font list + search

2026-04-23 01:00:57 +02:00
parent 4a18eda37c
commit 6b8ae3f291
4 changed files with 145 additions and 23 deletions
@@ -0,0 +1,140 @@
+pragma ComponentBehavior: Bound
+
+import Quickshell
+import QtQuick
+import QtQuick.Layouts
+import qs.Config
+import qs.Components
+
+Item {
+	id: root
+
+	required property string name
+	required property var object
+	required property string setting
+
+	Layout.fillWidth: true
+	Layout.preferredHeight: row.height
+
+	RowLayout {
+		id: row
+
+		anchors.left: parent.left
+		anchors.margins: Appearance.padding.small
+		anchors.right: parent.right
+		anchors.verticalCenter: parent.verticalCenter
+
+		CustomText {
+			id: text
+
+			Layout.fillWidth: true
+			font.pointSize: Appearance.font.size.larger
+			text: root.name
+		}
+
+		CustomClippingRect {
+			id: fontArea
+
+			Layout.preferredHeight: 42 * 6 + Appearance.padding.normal * 2 + Appearance.spacing.small * 5
+			Layout.preferredWidth: 500
+			color: DynamicColors.tPalette.m3surfaceContainer
+			radius: 21 + Appearance.padding.normal
+
+			CustomRect {
+				id: searchBox
+
+				anchors.left: parent.left
+				anchors.margins: Appearance.padding.normal
+				anchors.right: parent.right
+				anchors.top: parent.top
+				color: DynamicColors.tPalette.m3surfaceContainer
+				implicitHeight: 42
+				radius: Appearance.rounding.full
+
+				MaterialIcon {
+					id: searchIcon
+
+					anchors.bottom: parent.bottom
+					anchors.left: parent.left
+					anchors.leftMargin: Appearance.padding.large
+					anchors.top: parent.top
+					font.pointSize: Appearance.font.size.large
+					text: "search"
+					verticalAlignment: Text.AlignVCenter
+				}
+
+				CustomTextField {
+					id: fontSearch
+
+					anchors.left: searchIcon.right
+					anchors.leftMargin: Appearance.spacing.small
+					anchors.right: parent.right
+					anchors.rightMargin: Appearance.spacing.normal
+					anchors.verticalCenter: parent.verticalCenter
+					placeholderText: "Search..."
+				}
+			}
+
+			CustomClippingRect {
+				anchors.bottom: parent.bottom
+				anchors.left: parent.left
+				anchors.margins: Appearance.padding.normal
+				anchors.right: parent.right
+				anchors.top: searchBox.bottom
+				bottomLeftRadius: 21
+				bottomRightRadius: 21
+
+				CustomListView {
+					anchors.fill: parent
+					clip: true
+					spacing: Appearance.spacing.small
+
+					delegate: CustomRect {
+						id: fontDelegate
+
+						required property string modelData
+
+						anchors.left: parent.left
+						anchors.right: parent.right
+						implicitHeight: 42
+						radius: Appearance.rounding.smallest
+
+						CustomText {
+							anchors.fill: parent
+							anchors.leftMargin: Appearance.padding.normal
+							text: modelData
+							verticalAlignment: Text.AlignVCenter
+						}
+
+						MaterialIcon {
+							anchors.fill: parent
+							anchors.rightMargin: Appearance.padding.normal
+							color: DynamicColors.palette.m3primary
+							font.pointSize: Appearance.font.size.large
+							horizontalAlignment: Text.AlignRight
+							text: "check_circle"
+							verticalAlignment: Text.AlignVCenter
+							visible: root.object[root.setting] === fontDelegate.modelData
+						}
+
+						StateLayer {
+							onClicked: {
+								root.object[root.setting] = fontDelegate.modelData;
+								Config.save();
+							}
+						}
+					}
+					model: ScriptModel {
+						values: {
+							const fonts = Qt.fontFamilies();
+							const search = fontSearch.text;
+							var regex = new RegExp(search, "i");
+
+							return fonts.filter(n => regex.test(n));
+						}
+					}
+				}
+			}
+		}
+	}
+}