Table row<mds-table-row>Generato da @maggioli-design-system/magma@2.3.0dist/documentation.json. Incapsulamento: shadow.
Questa pagina è generata dai pacchetti Magma, documentati solo in inglese.
Il primo esempio della pagina Pattern, dal vivo. Cambia le sue proprietà qui sotto e l'anteprima le segue; Ripristina riporta l'esempio com'era.
Proprietà
interactiveinteractivebooleanSpecifies whether the row reacts to user interaction (hover/focus).
overlayActionsoverlayActionsbooleanSpecifies whether the row's actions are shown as an overlay.
selectableselectablebooleanSpecifies whether the row can be selected via a checkbox.
selectedselectedbooleanSpecifies whether the row is currently selected.
selectionselectionbooleanReflects the parent table selection state (set by mds-table); drives the row action background without :host-context
valuestringThe value associated with the row, emitted when the row is selected.
Panoramica
The <mds-table-row> web component represents a single data row inside a <mds-table> (slotted through mds-table-body; mds-table-header and mds-table-footer are rows themselves). It wraps a set of mds-table-cell children, and optionally exposes a per-row selection checkbox and an aside actions menu.
Semantic Behavior
Compound child only: <mds-table-row> must be slotted inside the mds-table-body of an <mds-table>; it is not used standalone and its default slot must contain mds-table-cell elements, not arbitrary markup.Parent-driven configuration: interactive, selectable, and overlayActions are set by the parent <mds-table> on every row, so rows stay in sync with table state rather than being configured one by one.Selection reporting: When selectable is on, the row renders a leading selection checkbox; toggling it updates the row’s selected prop and tells the table to recompute and emit the table-level selection event.Selected as two-way state: selected can be read and set by the parent to drive bulk select-all behavior.Actions menu: An action-named slot, when present, renders an actions cell that floats correctly over the scrolling row.Localized accessibility labels: The selection switch’s title is localized (Select/Deselect row) across el/en/es/it.
Properties & Visual Configurations
Most props are orchestrated by the parent table rather than set directly by consumers:interactive: mirrors the table’s interactive mode (hover highlight); normally inherited from <mds-table> rather than set per row.selectable: enables the leading selection switch; toggled by the table so all rows gain or lose selection together.overlayActions: set by the table when the row content overflows horizontally, switching the actions menu to an overlay rendering so it stays reachable while scrolling.selected: the row’s current selection state; read and written by the parent for select-all and batch operations.value: the identifying payload reported back in the table’s selection event for this row - set this to the business key (e.g. record id) you need when handling selections.