129 lines
3.2 KiB
QML
129 lines
3.2 KiB
QML
pragma ComponentBehavior: Bound
|
|
|
|
import Quickshell
|
|
import QtQuick
|
|
import QtQuick.Layouts
|
|
import ZShell.Config
|
|
import qs.Components
|
|
import qs.Services
|
|
|
|
DialogRowButton {
|
|
id: root
|
|
|
|
required property var model
|
|
property var selectedItem
|
|
property var initialSelect
|
|
|
|
acceptAllowed: !!selectedItem
|
|
horizontalContentMargin: -Tokens.padding.extraSmall
|
|
separateContent: true
|
|
|
|
content: Component {
|
|
ColumnLayout {
|
|
VerticalFadeListView {
|
|
bottomMargin: Tokens.padding.large
|
|
Layout.fillHeight: true
|
|
Layout.fillWidth: true
|
|
model: ScriptModel {
|
|
values: {
|
|
const s = searchField.text;
|
|
var regex = new RegExp(s, "i");
|
|
|
|
return root.model.filter(n => regex.test(n));
|
|
}
|
|
}
|
|
spacing: 0
|
|
topMargin: Tokens.padding.large
|
|
|
|
delegate: CustomRect {
|
|
id: item
|
|
|
|
required property var modelData
|
|
readonly property bool selected: root.selectedItem === modelData
|
|
|
|
anchors.left: ListView.view.contentItem.left
|
|
anchors.margins: 1 // Gets cut off for some reason without this
|
|
anchors.right: ListView.view.contentItem.right
|
|
color: Qt.alpha(Colors.palette.m3tertiaryContainer, selected ? 1 : 0)
|
|
implicitHeight: label.implicitHeight + Tokens.padding.small * 2
|
|
radius: stateLayer.pressed ? Tokens.rounding.extraSmall : selected ? Tokens.rounding.largeIncreased : Tokens.rounding.medium
|
|
|
|
Behavior on radius {
|
|
Anim {
|
|
type: Anim.SlowEffects
|
|
}
|
|
}
|
|
|
|
StateLayer {
|
|
id: stateLayer
|
|
|
|
onClicked: root.selectedItem = item.modelData
|
|
}
|
|
|
|
CustomText {
|
|
id: label
|
|
|
|
anchors.left: parent.left
|
|
anchors.margins: Tokens.padding.large
|
|
anchors.right: item.selected ? checkIcon.left : parent.right
|
|
anchors.rightMargin: item.selected ? Tokens.spacing.medium : anchors.margins
|
|
anchors.verticalCenter: parent.verticalCenter
|
|
color: item.selected ? Colors.palette.m3onTertiaryContainer : Colors.palette.m3onSurface
|
|
elide: Text.ElideRight
|
|
font.pointSize: Tokens.font.size.smaller
|
|
text: item.modelData
|
|
}
|
|
|
|
MaterialIcon {
|
|
id: checkIcon
|
|
|
|
anchors.margins: Tokens.padding.large
|
|
anchors.right: parent.right
|
|
anchors.verticalCenter: parent.verticalCenter
|
|
color: Colors.palette.m3onTertiaryContainer
|
|
font.pointSize: Tokens.font.size.normal
|
|
opacity: item.selected ? 1 : 0
|
|
text: "check"
|
|
|
|
Behavior on opacity {
|
|
Anim {
|
|
type: Anim.SlowEffects
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
SearchBar {
|
|
id: searchField
|
|
|
|
Layout.fillWidth: true
|
|
bg.border.color: Colors.palette.m3outlineVariant
|
|
bg.color: Colors.tPalette.m3surfaceContainerLowest
|
|
clearIcon.font.pointSize: Tokens.font.size.large
|
|
clearIcon.padding: Tokens.padding.extraSmall
|
|
font.pointSize: Tokens.font.size.small
|
|
placeholderText: qsTr("Search...")
|
|
searchIcon.anchors.leftMargin: Tokens.padding.large
|
|
searchIcon.font.pointSize: Tokens.font.size.large
|
|
|
|
Behavior on bg.border.color {
|
|
CAnim {}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
onOpenChanged: {
|
|
if (open) {
|
|
root.rootParent.interactive = false;
|
|
if (!initialSelect)
|
|
selectedItem = null;
|
|
else
|
|
selectedItem = initialSelect;
|
|
} else {
|
|
root.rootParent.interactive = true;
|
|
}
|
|
}
|
|
}
|