Flora/qml/panels/CodeBlock.qml

import QtQuick
import QtQuick.Controls
import Flora

Rectangle {
    id: root

    property string code: ""
    property string language: "text"
    property string codeId: ""

    signal copyRequested(string codeId)

    // Telegram-like bubble
    color: "#2e4d6a"
    radius: 12
    // adaptive width like Telegram message
    width: parent ? Math.min(parent.width * 0.88, implicitWidth) : implicitWidth
    implicitWidth: 400
    implicitHeight: column.implicitHeight + 20

    // For syntax highlighting, we use a TextArea with RichText
    // The highlighted code is set from outside via highlightedText
    property string highlightedText: ""

    Column {
        id: column
        width: parent.width - 20
        anchors.top: parent.top
        anchors.left: parent.left
        anchors.right: parent.right
        anchors.margins: 10
        spacing: 6

        // Header with language and copy button
        Row {
            width: parent.width
            height: 24
            spacing: 8

            Label {
                text: root.language.toUpperCase()
                color: "#8a9ba8"
                font.pixelSize: 10
                font.bold: true
                font.letterSpacing: 0.4
                verticalAlignment: Text.AlignVCenter
                height: parent.height
                visible: root.language !== "text" && root.language !== ""
            }
            Item { width: parent.width - languageLabel.width - copyButton.width - 16; height: 1 }
            Label {
                id: languageLabel
                text: root.language
                visible: false
                width: 0
                height: 0
            }

            // Copy button - Telegram style, hover/active feedback
            Rectangle {
                id: copyButton
                width: copyLabel.implicitWidth + 16
                height: 22
                radius: 11
                color: copyHover.hovered ? (copyTap.pressed ? Qt.rgba(1,1,1,0.30) : Qt.rgba(1,1,1,0.22)) : Qt.rgba(1,1,1,0.12)
                border.color: copyHover.hovered ? Qt.rgba(1,1,1,0.28) : Qt.rgba(1,1,1,0.18)
                border.width: 1

                property bool copied: false
                Timer { id: copyResetTimer; interval: 1500; onTriggered: copyButton.copied = false }

                Label {
                    id: copyLabel
                    anchors.centerIn: parent
                    text: copyButton.copied ? "✓ Скопировано" : "📋 Копировать"
                    color: copyButton.copied ? "#6ab2f6" : "#ffffff"
                    font.pixelSize: 11
                    font.family: "-apple-system, sans-serif"
                }

                HoverHandler { id: copyHover }
                TapHandler {
                    id: copyTap
                    onTapped: {
                        root.copyRequested(root.codeId)
                        copyButton.copied = true
                        copyResetTimer.restart()
                    }
                }
                // For mouse cursor
                HoverHandler {
                    cursorShape: Qt.PointingHandCursor
                }
            }
        }

        // Code area - like real editor
        Rectangle {
            width: parent.width
            color: Qt.rgba(0,0,0,0.22)
            radius: 8
            // height based on content
            implicitHeight: codeText.implicitHeight + 20

            ScrollView {
                anchors.fill: parent
                anchors.margins: 8
                clip: true
                ScrollBar.horizontal.policy: ScrollBar.AsNeeded
                ScrollBar.vertical.policy: ScrollBar.AsNeeded

                TextArea {
                    id: codeText
                    readOnly: true
                    selectByMouse: true
                    textFormat: Text.RichText
                    wrapMode: Text.Wrap
                    color: "#ffffff"
                    selectionColor: "#3a6ea5"
                    selectedTextColor: "#ffffff"
                    font.family: "JetBrains Mono, Fira Code, Menlo, Consolas, monospace"
                    font.pixelSize: 13
                    tabStopDistance: 32
                    text: root.highlightedText.length > 0 ? root.highlightedText : root.code
                    background: Rectangle { color: "transparent" }
                }
            }
        }
    }

    // For bracket matching highlight in editor, we could add a similar indicator
    // But for preview, this is just display
}