mirror of
https://github.com/arthur-pbty/arthur-os.git
synced 2026-08-04 20:28:23 +02:00
David Heinemeier Hansson
b54d8e04ae
TextField, NumberField, Dropdown, SearchableDropdown, and Toggle all painted their background, border color, and border width with the same three-line ternary ladder (`_focused ? focusFill : _hot ? hoverFill : normalFill`). Five components × three properties × three branches is a lot of room for one of them to drift from the others when a new state ever gets added. Add controlFill / controlBorder / controlBorderWidth on Style and rewrite each call site as a single binding. No visual change.
58 lines
2.3 KiB
QML
58 lines
2.3 KiB
QML
import QtQuick
|
|
import QtQuick.Controls
|
|
import qs.Commons
|
|
|
|
// Single-line text input with the kit's focus + selection styling. Inherits
|
|
// from Qt Quick Controls TextField so the underlying type's API (text,
|
|
// placeholderText, accepted, editingFinished, validator, ...) is available
|
|
// to callers without re-exposing each property.
|
|
//
|
|
// Defaults bind to qs.Commons.Color so a caller with no theme overrides
|
|
// just works; foreground / accent / selectionTint can be overridden per
|
|
// instance. activeFocus and mouse hover / panel cursor use the same
|
|
// hover-cursor defaults, so text inputs match Button, Toggle, and Dropdown.
|
|
//
|
|
// Sizing is driven by font.pixelSize + verticalPadding. The default 30px
|
|
// implicitHeight fits dialog forms; inline callers (wifi's row-embedded
|
|
// passphrase prompt) drop verticalPadding to match a 22-26px row.
|
|
TextField {
|
|
id: root
|
|
|
|
property color foreground: Color.foreground
|
|
property color accent: Color.accent
|
|
property color selectionTint: Style.selectionFillFor(foreground, accent)
|
|
property bool password: false
|
|
property real horizontalPadding: Style.spacing.controlPaddingX
|
|
property real verticalPadding: Style.spacing.inputPaddingY
|
|
|
|
// Panel-cursor flag. When true (and the field isn't already focused),
|
|
// the background paints the shared hover/cursor state.
|
|
// For mouse-enter/leave the consumer reads QQC TextField's inherited
|
|
// `hovered` property (via onHoveredChanged) — we don't add a sibling
|
|
// signal because the inherited property would shadow it.
|
|
property bool hasCursor: false
|
|
|
|
readonly property bool _focused: activeFocus
|
|
readonly property bool _hot: hovered || hasCursor
|
|
|
|
echoMode: password ? TextInput.Password : TextInput.Normal
|
|
font.family: Style.font.family
|
|
font.pixelSize: Style.font.body
|
|
color: foreground
|
|
selectionColor: selectionTint
|
|
selectedTextColor: foreground
|
|
placeholderTextColor: Qt.darker(foreground, 1.6)
|
|
|
|
leftPadding: horizontalPadding
|
|
rightPadding: horizontalPadding
|
|
topPadding: verticalPadding
|
|
bottomPadding: verticalPadding
|
|
|
|
background: Rectangle {
|
|
color: Style.controlFill(root._focused, root._hot, root.foreground, root.accent)
|
|
border.color: Style.controlBorder(root._focused, root._hot, root.foreground, root.accent)
|
|
border.width: Style.controlBorderWidth(root._focused, root._hot)
|
|
radius: Style.cornerRadius
|
|
}
|
|
}
|