make storybook a tabbed window

2025-09-07 23:12:11 -04:00 · 2025-09-07 23:12:11 -04:00 · 32167ef44e
commit 32167ef44e
parent 8aced615ce
8 changed files with 279 additions and 207 deletions
--- a/modules/storybook/Components.qml
+++ b/modules/storybook/Components.qml
@ -0,0 +1,136 @@
+import qs.components
+import qs.config
+import QtQuick
+import QtQuick.Controls
+import QtQuick.Layouts
+
+GridLayout {
+    flow: GridLayout.TopToBottom
+    columns: 2
+    rows: 10
+
+    ColumnLayout {
+        StyledText {
+            text: "ToolTip"
+            font.pixelSize: 18
+        }
+        Button {
+            id: toolTipButton
+            text: "Hello world!"
+            StyledToolTip {
+                visible: toolTipButton.hovered
+                text: qsTr("Save the active project")
+            }
+        }
+    }
+
+    ColumnLayout {
+        StyledText {
+            text: "ProgressBar"
+            font.pixelSize: 18
+        }
+        StyledProgressBar {
+            id: progressBar
+            indeterminate: true
+            implicitHeight: 10
+            from: 0
+            to: 100
+            value: 50
+        }
+    }
+
+    ColumnLayout {
+        StyledText {
+            text: "ListView"
+            font.pixelSize: 18
+        }
+        StyledWrapperRectangle {
+            border.color: Styling.theme.base100
+            border.width: 2
+            StyledListView {
+                implicitWidth: 200
+                implicitHeight: 100
+                model: 10
+                delegate: StyledText {
+                    text: "Hello world!"
+                }
+            }
+        }
+    }
+
+    ColumnLayout {
+        StyledText {
+            text: "Mpris Player Selector"
+            font.pixelSize: 18
+        }
+        MprisPlayerSelector {}
+    }
+
+    ColumnLayout {
+        StyledText {
+            text: "Mpris Controller"
+            font.pixelSize: 18
+        }
+        MprisController {
+            player: Mpris.active ?? null
+        }
+    }
+
+    ColumnLayout {
+        StyledText {
+            text: "Drawer"
+            font.pixelSize: 18
+        }
+        RowLayout {
+            Button {
+                text: "Top"
+                onClicked: {
+                    drawer.x = root.width / 2 - drawer.width / 2;
+                    drawer.y = 0;
+                    drawer.edge = Qt.TopEdge;
+                    drawer.open();
+                }
+            }
+            Button {
+                text: "Left"
+                onClicked: {
+                    drawer.y = root.height / 2 - drawer.height / 2;
+                    drawer.x = 0;
+                    drawer.edge = Qt.LeftEdge;
+                    drawer.open();
+                }
+            }
+            Button {
+                text: "Right"
+                onClicked: {
+                    drawer.y = root.height / 2 - drawer.height / 2;
+                    drawer.x = 0;
+                    drawer.edge = Qt.RightEdge;
+                    drawer.open();
+                }
+            }
+            Button {
+                text: "Bottom"
+                onClicked: {
+                    drawer.x = root.width / 2 - drawer.width / 2;
+                    drawer.y = 0;
+                    drawer.edge = Qt.BottomEdge;
+                    drawer.open();
+                }
+            }
+        }
+    }
+
+    StyledDrawer {
+        id: drawer
+        edge: Qt.TopEdge
+        width: 400
+        height: 200
+        Button {
+            anchors.horizontalCenter: parent.horizontalCenter
+            anchors.verticalCenter: parent.verticalCenter
+            text: "Close"
+            onClicked: drawer.close()
+        }
+    }
+}