Files
metabuilder/qml/MetaBuilder/CComponentPropsList.qml
johndoe6345789 d9ca84628b feat(a11y): deep keyboard accessibility pass across all QML components
Second-pass a11y work across all 12 component groups. Every interactive
element now has activeFocusOnTab, Keys.onReturnPressed/SpacePressed, and
context-aware Accessible.name/description bindings.

Highlights:
- Dialogs: keyboard handlers with enabled-guard on confirm buttons
- CDropdownMenu: full keyboard nav (Up/Down/Enter/Escape)
- CLoginForm: explicit KeyNavigation.tab chain (username→password→submit)
- CNotificationBell: dynamic "3 notifications"/"No notifications" name
- CJobProgressBar: Accessible.minimumValue/maximumValue/currentValue
- CExecutionStatusDot: "Execution status: Running/Passed/Failed" binding
- CKeyboardShortcuts: invisible Repeater exposes all shortcuts to a11y tree
- CDataTable rows: "Row N of M" descriptions
- Canvas elements: Accessible.Canvas role + keyboard zoom (+/- keys)
- DropdownExpandedList: focus-highlight extended to :activeFocus
- Dynamic names reflect loading state (e.g. "Signing in, please wait")

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
2026-03-19 20:53:53 +00:00

86 lines
2.2 KiB
QML

import QtQuick
import QtQuick.Controls
import QtQuick.Layouts
import QmlComponents 1.0
ColumnLayout {
id: root
objectName: "list_component_props"
Accessible.role: Accessible.List
Accessible.name: "Custom Properties"
Layout.fillWidth: true
Layout.fillHeight: true
spacing: 8
property var props: []
signal addProp()
signal removeProp(int index)
FlexRow {
Layout.fillWidth: true
spacing: 8
CText { variant: "h4"; text: "Custom Properties" }
Item { Layout.fillWidth: true }
CButton {
text: "Add Prop"
variant: "ghost"
size: "sm"
activeFocusOnTab: true
Accessible.role: Accessible.Button
Accessible.name: "Add custom property"
Keys.onReturnPressed: root.addProp()
Keys.onSpacePressed: root.addProp()
onClicked: root.addProp()
}
}
ListView {
Layout.fillWidth: true
Layout.fillHeight: true
clip: true
spacing: 6
model: root.props
delegate: CPaper {
width: parent ? parent.width : 300
height: 44
RowLayout {
anchors.fill: parent
anchors.margins: 8
spacing: 8
CText {
variant: "body2"
text: modelData.key
Layout.preferredWidth: 120
opacity: 0.7
}
CText {
variant: "body1"
text: modelData.value
Layout.fillWidth: true
}
CButton {
text: "\u00D7"
variant: "ghost"
size: "sm"
activeFocusOnTab: true
Accessible.role: Accessible.Button
Accessible.name:
"Remove property "
+ modelData.key
Keys.onReturnPressed:
root.removeProp(index)
Keys.onSpacePressed:
root.removeProp(index)
onClicked: root.removeProp(index)
}
}
}
}
}