internal: refactor widgets folder

Split into subdirs and rename to components

1 files changed, 86 insertions, 0 deletions

diff --git a/components/controls/StyledTextField.qml b/components/controls/StyledTextField.qml
new file mode 100644
index 0000000..30db314
--- /dev/null
+++ b/components/controls/StyledTextField.qml
@@ -0,0 +1,86 @@
+pragma ComponentBehavior: Bound
+
+import ".."
+import qs.services
+import qs.config
+import QtQuick
+import QtQuick.Controls
+
+TextField {
+    id: root
+
+    color: Colours.palette.m3onSurface
+    placeholderTextColor: Colours.palette.m3outline
+    font.family: Appearance.font.family.sans
+    font.pointSize: Appearance.font.size.smaller
+    renderType: TextField.NativeRendering
+    cursorVisible: !readOnly
+
+    background: null
+
+    cursorDelegate: StyledRect {
+        id: cursor
+
+        property bool disableBlink
+
+        implicitWidth: 2
+        color: Colours.palette.m3primary
+        radius: Appearance.rounding.normal
+
+        Connections {
+            target: root
+
+            function onCursorPositionChanged(): void {
+                if (root.activeFocus && root.cursorVisible) {
+                    cursor.opacity = 1;
+                    cursor.disableBlink = true;
+                    enableBlink.restart();
+                }
+            }
+        }
+
+        Timer {
+            id: enableBlink
+
+            interval: 100
+            onTriggered: cursor.disableBlink = false
+        }
+
+        Timer {
+            running: root.activeFocus && root.cursorVisible && !cursor.disableBlink
+            repeat: true
+            triggeredOnStart: true
+            interval: 500
+            onTriggered: parent.opacity = parent.opacity === 1 ? 0 : 1
+        }
+
+        Binding {
+            when: !root.activeFocus || !root.cursorVisible
+            cursor.opacity: 0
+        }
+
+        Behavior on opacity {
+            NumberAnimation {
+                duration: Appearance.anim.durations.small
+                easing.type: Easing.BezierSpline
+                easing.bezierCurve: Appearance.anim.curves.standard
+            }
+        }
+    }
+
+    Behavior on color {
+        ColorAnimation {
+            duration: Appearance.anim.durations.normal
+            easing.type: Easing.BezierSpline
+            easing.bezierCurve: Appearance.anim.curves.standard
+        }
+    }
+
+    Behavior on placeholderTextColor {
+        ColorAnimation {
+            duration: Appearance.anim.durations.normal
+            easing.type: Easing.BezierSpline
+            easing.bezierCurve: Appearance.anim.curves.standard
+        }
+    }
+}