block · settings-row
Settings row
A responsive explicit-label layout for one native setting control and its supporting description.
Install with
npx @madojs/ui@latest add settings-row.
Block
Settings row
Send one summary after each production deployment.
Choose how often activity summaries are prepared.
This value is supplied by the organization administrator.
Composition
- Pair a content group containing an explicit label/description with one native control in the control group.
Public API
-
class
mado-ui-settings-row / content / label / description / control - Responsive label-copy-control composition.
-
attribute
aria-describedby - Connects the native control to supporting copy when useful.
Detected public classes
.mado-ui-settings-row.mado-ui-settings-row-content.mado-ui-settings-row-control.mado-ui-settings-row-description.mado-ui-settings-row-label
Detected public CSS properties
--mado-ui-color-border--mado-ui-color-text--mado-ui-color-text-muted--mado-ui-settings-row-align--mado-ui-settings-row-border--mado-ui-settings-row-color--mado-ui-settings-row-content-basis--mado-ui-settings-row-content-gap--mado-ui-settings-row-description-color--mado-ui-settings-row-gap--mado-ui-settings-row-justify--mado-ui-settings-row-label-color--mado-ui-settings-row-label-size--mado-ui-settings-row-padding-block--mado-ui-space-1--mado-ui-space-4
Accessibility contract
- The explicit label for/id relationship owns activation and naming; the row itself is not a control.
- Keep description ids unique and reference them only while the corresponding nodes exist.
Keyboard
- The recipe adds no composite keyboard model; native interactive descendants keep their browser-defined keys and Tab order.
Focus
- Focus remains on native links, buttons or controls. Presentational wrappers never become focusable.
Fallback
- Without the copied stylesheet, the semantic source HTML remains readable and operable.
Installation graph
Direct dependencies
-
Mado UI theme
theme
Resolved install order
-
Mado UI theme
theme
Copied source
The CLI resolves each registry source path into the configured project target. Links below point to the exact catalog build tag.
-
blocks/settings-row/mado-ui-settings-row.css{styles}/mado-ui-settings-row.css