pragma ComponentBehavior: Bound

import QtQuick
import Weave.Controls
import Weave.Templates as T

T.TextField {
    id: control

    T.TableLayout.minimumWidth: Math.max(contentLayout.minimumWidth, messageLoader.minimumWidth) // TODO: input-specific minimum width token
    T.TableLayout.minimumHeight: Math.max(Theme.component.input.minHeight, contentLayout.minimumHeight) + messageLoader.minimumHeight

    TableLayout.leftPadding: Math.max(T.TableLayout.leftLayoutPadding, _styleAttributes.paddingLeft)
    TableLayout.rightPadding: Math.max(T.TableLayout.rightLayoutPadding, _styleAttributes.paddingRight)
    TableLayout.topPadding: Math.max(T.TableLayout.topLayoutPadding, _styleAttributes.paddingTop)
    TableLayout.bottomPadding: Math.max(T.TableLayout.bottomLayoutPadding, _styleAttributes.paddingBottom)

    implicitWidth: contentLayout.preferredWidth + leftInset + rightInset
    implicitHeight: Math.max(Theme.component.input.minHeight, contentLayout.implicitHeight) + topInset + messageLoader.implicitHeight

    leftPadding: proxyText.x + leftInset
    topPadding: proxyText.y + topInset
    rightPadding: contentLayout.width - proxyText.x - proxyText.width + rightInset
    bottomPadding: contentLayout.height - proxyText.y - proxyText.height  + bottomInset
    bottomInset: messageLoader.implicitHeight

    color: Theme.component.input.textColor
    font.family: Theme.component.label.fontFamily
    font.pixelSize: Theme.component.input.fontSize
    font.weight: Theme.component.input.fontWeight

    selectionColor: feedback === Feedback.LouderError
            ? Theme.component.input.error.backgroundColor.selected
            : Theme.component.input.backgroundColor.selected
    selectedTextColor: color
    placeholderTextColor: Theme.component.input.placeholder.textColor
    verticalAlignment: TextInput.AlignVCenter

    hoverEnabled: control.enabled
    selectByMouse: true

    opacity: control.enabled ? 1.0 : Theme.component.input.opacity.disabled

    TableLayoutRow {
        id: contentLayout

        rowItem: control

        anchors {
            fill: control
            leftMargin: control.leftInset
            topMargin: control.topInset
            rightMargin: control.rightInset
            bottomMargin: control.bottomInset
        }

        leftMargin: control.T.TableLayout.leftPadding
        rightMargin: control.T.TableLayout.rightPadding
        topMargin: control.T.TableLayout.topPadding
        bottomMargin: control.T.TableLayout.bottomPadding

        horizontalSpacing: 0
        verticalSpacing: 0

        verticalItemAlignment: TableLayout.AlignVCenter

        Repeater {
            model: control.tagContentModel
        }

        Item {
            T.TableLayout.canWrap: true
            T.TableLayout.minimumHeight: Theme.component.input.lineHeight
        }

        T.DecorationItemLoader {
            id: decorationLoader

            T.TableLayout.topMargin: 0
            T.TableLayout.bottomMargin: 0

            delegateItem: control
            sourceComponent: control.decoration

            leftMargin: Theme.component.menu.icon.marginLeft
            rightMargin: Theme.component.menu.icon.marginRight
            topMargin: Theme.component.menu.icon.marginTop
            bottomMargin: Theme.component.menu.icon.marginBottom
        }

        Text {
            id: proxyText

            T.TableLayout.horizontalFillMode: T.TableLayout.Preferred
            T.TableLayout.minimumWidth: Theme.semantic.size.touchTarget
            T.TableLayout.minimumHeight: Theme.component.input.lineHeight
            T.TableLayout.preferredWidth: Math.max(implicitWidth, placeholder.implicitWidth)
            T.TableLayout.preferredHeight: Theme.component.input.lineHeight

            text: control.displayText
            font: control.font

            lineHeight: Theme.component.input.lineHeight
            lineHeightMode: Text.FixedHeight

            opacity: 0
        }

        Text {
            id: placeholder

            T.TableLayout.exclude: true

            anchors.fill: proxyText

            text: control.placeholderText
            font: control.font
            lineHeight: Theme.component.input.lineHeight
            lineHeightMode: Text.FixedHeight
            color: control.placeholderTextColor
            verticalAlignment: control.verticalAlignment
            visible: !control.length && !control.preeditText && (!control.activeFocus || control.horizontalAlignment !== Qt.AlignHCenter)
            elide: Text.ElideRight
            renderType: control.renderType
        }

        T.TableLayoutLoader {
            T.TableLayout.topMargin: 0
            T.TableLayout.bottomMargin: 0

            active: control.feedback !== Feedback.None
                    && (control.feedbackDisplayType === Feedback.IconOnly || control.message.length === 0)

            sourceComponent: InputErrorIcon {
                id: inputErrorIcon

                MouseArea {
                    id: hoverDetector
                    anchors.fill: parent
                    enabled: control.feedbackToolTip.text.length > 0
                    hoverEnabled: true
                }

                property Component defaultContent: ToolTipContent {}

                ToolTip.content: control.feedbackToolTip.content ? control.feedbackToolTip.content : defaultContent
                ToolTip.text: control.feedbackToolTip.text
                ToolTip.delay: control.feedbackToolTip.delay
                ToolTip.timeout: control.feedbackToolTip.timeout
                ToolTip.preferredAlignment: control.feedbackToolTip.preferredAlignment
                ToolTip.visible: hoverDetector.containsMouse
                       || (ToolTip.toolTip.parent === inputErrorIcon && ToolTip.toolTip.hovered)
                       || (control.feedbackToolTip.visible)
            }
        }
        Repeater {
             model: control.buttonsModel
        }
    }

    background: T.BackgroundItemLoader {
        delegateItem: control
        sourceComponent: TextInputBackground {
            style: control.style
            focused: control.activeFocus
            hovered: control.hovered
            error: control.feedback !== Feedback.None
            louder: control.feedback === Feedback.LouderError

            color: control._styleAttributes.backgroundColor
        }
    }

    TextInputMessageLoader {
        id: messageLoader

        y: control.height - height
        width: control.width

        message: (control.feedbackDisplayType !== Feedback.IconOnly) ? control.message : ""
        feedback: (control.feedbackDisplayType !== Feedback.IconOnly) ? control.feedback : Feedback.None
        toolTip: control.feedbackToolTip
    }

    completion.defaultDelegate: ItemDelegate {
        id: completionDelegate

        required property string modelData

        text: control.completion.highlightedText(
                modelData, control.completion.searchText, control.completion.filterMode, control.completion.caseSensitivity)
        highlighted: ListView.isCurrentItem
        font.weight: modelData === control.completion.searchText
                ? Theme.component.menuitem.fontWeight.selected
                : Theme.component.table.fontWeight

        width: control.width
    }

    completion.popup: T.CompletionPopup {
        id: dropdownPopup

        y: control.height
        width: control.width
        height: implicitContentHeight

        closePolicy: T.CompletionPopup.CloseOnEscape | T.CompletionPopup.CloseOnPressOutsideParent

        background: DropdownPopupBackground {
            belowDropdown: dropdownPopup.y > 0
        }

        contentItem: Item {
            id: popupContent

            clip: true
            implicitHeight: Math.min(listView.contentHeight, listView.height)

            ListView {
                id: listView

                width: popupContent.width
                height: 5 * (Theme.component.menu.lineHeight + Theme.component.menu.paddingTop + Theme.component.menu.paddingBottom)

                model: control.completion.contentModel

                currentIndex: control.completion.currentIndex

                ScrollBar.vertical: ScrollBar {}
            }
        }
    }
}