status-desktop/ui/shared/ColorSelector.qml
emizzle 9374be5857
feat: Send transaction component -- Account selector
Fixes #670.

Component spec based on https://www.notion.so/emizzle/Wallet-transaction-components-2003b78a8d0d41c4ab3d21eb2496fb20.

Changes the current Select shared component to a model databound component. This means we can bind directly to `QAbstractListModel`'s coming from Nim instead of needing manipulating the data in to javascript objects. The changes to the Select component will be used for the upcoming Asset selector shared component.
2020-08-05 16:38:49 +10:00

57 lines
1.8 KiB
QML

import QtQuick 2.13
import QtQuick.Controls 2.13
import "../imports"
Item {
id: root
property string selectedColor
//% "Account color"
property string label: qsTrId("account-color")
property var model
height: accountColorInput.height
Select {
id: accountColorInput
bgColor: selectedColor
label: root.label
model: root.model
menu.delegate: Component {
MenuItem {
property bool isFirstItem: index === 0
property bool isLastItem: index === root.model.length - 1
height: 52
width: parent.width
padding: 10
onTriggered: function () {
const selectedColor = root.model[index]
root.selectedColor = selectedColor
}
background: Rectangle {
color: root.model[index] || Style.current.transparent
radius: Style.current.radius
// cover bottom left/right corners with square corners
Rectangle {
visible: !isLastItem
anchors.left: parent.left
anchors.right: parent.right
anchors.bottom: parent.bottom
height: parent.radius
color: parent.color
}
// cover top left/right corners with square corners
Rectangle {
visible: !isFirstItem
anchors.left: parent.left
anchors.right: parent.right
anchors.top: parent.top
height: parent.radius
color: parent.color
}
}
}
}
}
}