// 02-repeater/repeater.qml
// Repeater: instantiate one child per model row. Inline, no scroll.
// Pure QML. Run with: qml6 repeater.qml

import QtQuick
import QtQuick.Window
import QtQuick.Layouts

Window {
    width: 360
    height: 360
    visible: true
    title: "QML 02: Repeater"

    ColumnLayout {
        anchors.fill: parent
        anchors.margins: 12
        spacing: 8

        // The model is a JS array of objects.
        Repeater {
            model: [
                { name: "Alice",   role: "Engineer" },
                { name: "Bob",     role: "Designer" },
                { name: "Charlie", role: "Manager"  },
                { name: "Dana",    role: "Researcher" }
            ]

            delegate: Rectangle {
                required property var modelData
                Layout.fillWidth: true
                implicitHeight: 44
                radius: 6
                color: index % 2 ? "#f0f0f0" : "white"
                border.color: "#ccc"
                border.width: 1

                RowLayout {
                    anchors.fill: parent
                    anchors.margins: 12
                    Text {
                        text: modelData.name
                        font.bold: true
                        Layout.preferredWidth: 100
                    }
                    Text {
                        text: modelData.role
                        color: "#666"
                    }
                    Item { Layout.fillWidth: true }
                    Text {
                        text: "#" + (index + 1)
                        color: "#999"
                    }
                }
            }
        }
    }
}