import QtQuick
import Syidax.Core

Item {
    implicitWidth: Math.max(360, childrenRect.width)
    implicitHeight: childrenRect.height

    property QtObject settings: QtObject {
        id: storyArgs
        property string content: "Saves the form"
        property string position: "top"
        property string trigger: "hover"
        property bool hideArrow: false
        property int opendelay: 0
        property int closedelay: 0
        property int maxWidth: 320
        property string animation: "none"
    }

    

    Item {
        width: 320
        height: 120
        SyButton {
            anchors.centerIn: parent
            text: "Save"
            SyTooltip { id: exampleControl1; 
                content: storyArgs.content
                position: storyArgs.position
                trigger: storyArgs.trigger
                hideArrow: storyArgs.hideArrow
                opendelay: storyArgs.opendelay
                closedelay: storyArgs.closedelay
                maxWidth: storyArgs.maxWidth
                animation: storyArgs.animation
            }
        }
    }

}

import QtQuick
import Syidax.Core

pragma ComponentBehavior: Bound

Item {
    implicitWidth: Math.max(360, childrenRect.width)
    implicitHeight: childrenRect.height
    id: story
    readonly property var positions: ["topLeft", "top", "topRight", "leftTop", "rightTop", "left", "right", "leftBottom", "rightBottom", "bottomLeft", "bottom", "bottomRight"]

    Item {
        width: 600
        height: 340
        Grid {
            anchors.centerIn: parent
            columns: 3
            columnSpacing: 110
            rowSpacing: 60
            Repeater {
                model: story.positions
                delegate: SyButton {
                    id: cell
                    required property string modelData
                    text: cell.modelData
                    width: 120
                    SyTooltip { content: cell.modelData; position: cell.modelData; trigger: "none"; Component.onCompleted: Qt.callLater(setOpen) }
                }
            }
        }
    }
}

import QtQuick
import Syidax.Core

Item {
    width: 520; height: 180
    Row {
        x: 24; y: 28; spacing: 40
        SyButton {
            id: hoverTarget; text: "hover"
            SyTooltip { id: hoverPopup; position: "bottom"; content: "Shown while the pointer is over the button" }
        }
        SyButton {
            id: clickTarget; text: "click"
            SyTooltip { id: clickPopup; trigger: "click"; position: "bottom"; content: "Shown after clicking the button" }
        }
        FocusScope {
            id: focusAnchor; width: 150; height: focusTarget.height
            SyInput {
                id: focusTarget; placeholder: "focus"; width: parent.width
                SyTooltip { id: focusPopup; anchor: focusAnchor; trigger: "focus"; position: "bottom"; content: "Shown while the field has focus" }
            }
        }
    }
}

import QtQuick
import Syidax.Core

Item {
    implicitWidth: Math.max(360, childrenRect.width)
    implicitHeight: childrenRect.height
    // Focused Gallery routes: keep only the selected API and its prerequisites.
    id: featureStory

    Row {
        spacing: 16
        SyButton { text: "Slow"; SyTooltip { id: featureTarget0; content: "Half a second to open, 300 ms to close"; opendelay: 500; closedelay: 300 } }
        SyButton { text: "Long text"; SyTooltip { id: featureTarget1; content: "The content of this area is being fetched. It stays readable until the spinner masks it."; maxWidth: 220 } }
        SyButton { text: "Plain"; SyTooltip { id: featureTarget2; content: "No arrow, fades in"; hideArrow: true; animation: "fade"; animationSpeed: "slow" } }
    }
}

import QtQuick
import Syidax.Core

Item {
    implicitWidth: Math.max(360, childrenRect.width)
    implicitHeight: childrenRect.height
    // Focused Gallery routes: keep only the selected API and its prerequisites.
    id: featureStory

    Column {
        spacing: 24
        Item {
            width: 560; height: 150
            SyButton {
                x: 24; y: 24
 text: "Save"; SyTooltip { id: tip; content: "Saves the form"; trigger: "none" } }
        }
        Row {
            objectName: "exampleCommands"

            spacing: 8
            SyButton { id: exampleControl1;  visible: true; text: "tip.setOpen()"; variant: "secondary"; size: "small"; onClicked: tip.setOpen() }
            SyButton { id: exampleControl2;  visible: true; text: "tip.setClose()"; variant: "secondary"; size: "small"; onClicked: tip.setClose() }
            SyButton { id: exampleControl3;  visible: true; text: "tip.close()"; variant: "secondary"; size: "small"; onClicked: tip.close() }
        }
        Text {
            text: "tip.isOpen === " + tip.isOpen
            font.family: Theme.monoFontFamily
            font.pixelSize: 12
            color: Theme.semantic.textSubtle
        }
    }
}

import QtQuick
import Syidax.Core

Item {
    implicitWidth: Math.max(360, childrenRect.width)
    implicitHeight: childrenRect.height

    property QtObject settings: QtObject {
        id: storyArgs
        property string content: "Saves the form"
        property string position: "top"
        property string trigger: "click"
        property bool hideArrow: false
        property int opendelay: 0
        property int closedelay: 0
        property int maxWidth: 320
        property string animation: "none"
    }

    

    Item {
        width: 320
        height: 120
        SyButton {
            anchors.centerIn: parent
            text: "Save"
            SyTooltip { id: exampleControl1; 
                content: storyArgs.content
                position: storyArgs.position
                trigger: storyArgs.trigger
                hideArrow: storyArgs.hideArrow
                opendelay: storyArgs.opendelay
                closedelay: storyArgs.closedelay
                maxWidth: storyArgs.maxWidth
                animation: storyArgs.animation
            }
        }
    }

}