From 6a4ac838ac82ec55c39678df5d4b002610a1db1a Mon Sep 17 00:00:00 2001
From: Benjamin Palko <benjaminpalko@hotmail.com>
Date: Tue, 2 Sep 2025 22:16:44 -0400
Subject: [PATCH] styled progress bar

---
 components/StyledProgressBar.qml | 58 ++++++++++++++++++++++++++++++++
 modules/storybook/Storybook.qml  | 15 +++++++++
 2 files changed, 73 insertions(+)
 create mode 100644 components/StyledProgressBar.qml

diff --git a/components/StyledProgressBar.qml b/components/StyledProgressBar.qml
new file mode 100644
index 0000000..f0c0ef6
--- /dev/null
+++ b/components/StyledProgressBar.qml
@@ -0,0 +1,58 @@
+import qs.config
+import QtQuick
+import QtQuick.Controls
+
+ProgressBar {
+    id: control
+    value: 0.5
+    padding: 2
+
+    HoverHandler {
+        enabled: !control.indeterminate
+        cursorShape: Qt.PointingHandCursor
+    }
+
+    background: Rectangle {
+        implicitWidth: 200
+        implicitHeight: 6
+        color: Theme.palette.base100
+        radius: 8
+    }
+
+    contentItem: Item {
+        implicitWidth: 200
+        implicitHeight: 4
+
+        // Progress indicator for determinate state.
+        Rectangle {
+            width: control.visualPosition * parent.width
+            height: parent.height
+            radius: 8
+            color: Theme.palette.primary
+            visible: !control.indeterminate
+        }
+
+        // Scrolling animation for indeterminate state.
+        Item {
+            anchors.fill: parent
+            visible: control.indeterminate
+            clip: true
+
+            Row {
+                Rectangle {
+                  id: rect
+                        color: Theme.palette.primary
+                        width: 40
+                        height: control.height
+                    }
+                XAnimator on x {
+                    from: control.width + rect.width
+                    to: -rect.width
+                    duration: 1000
+                    loops: Animation.Infinite
+                    running: control.indeterminate
+                }
+            }
+        }
+    }
+}
diff --git a/modules/storybook/Storybook.qml b/modules/storybook/Storybook.qml
index 50cc024..4f5d66a 100644
--- a/modules/storybook/Storybook.qml
+++ b/modules/storybook/Storybook.qml
@@ -96,6 +96,21 @@ StyledWindow {
                 }
             }
 
+            ColumnLayout {
+                StyledText {
+                    text: "Progress Bar"
+                    font.pixelSize: 18
+                }
+                StyledProgressBar {
+                    id: progressBar
+                    indeterminate: true
+                    implicitHeight: 10
+                    from: 0
+                    to: 100
+                    value: 50
+                }
+            }
+
             ColumnLayout {
                 StyledText {
                     text: "Mpris Player Selector"