Skip to main content
cngx-src documentation

CngxDataGridRow

ComponentPrimaryOnPushNo encapsulationv0.1.0WCAG AA

projects/ui/data-grid-accordion/data-grid-row.component.ts

Import#

import { CngxDataGridRow } from '@cngx/ui/data-grid-accordion'

Description#

A disclosure row in a CngxDataGridAccordion. Renders the APG-correct trio: a role="heading" wrapper carrying the group's aria-level, a cngxAccordionPanel summary <button> laid out on the shared --cngx-dga-columns grid, and a role="region" detail zone named back at the primary cell via aria-labelledby. Expansion is derived from the coordinator (Pillar 1); the button self-wires keyboard nav through the registration brain, so arrow keys rove across rows even though each summary lives in its own component view.

The projected cngxDgaCells fill the summary grid; the one marked primary supplies the row's accessible name, so a screen reader hears a list of expandable sections rather than a wall of cell text.

https://cngxjs.github.io/cngx/examples/#/ui/data-grid-accordion/master-detail https://cngxjs.github.io/cngx/examples/#/ui/data-grid-accordion/report https://cngxjs.github.io/cngx/examples/#/ui/data-grid-accordion/lazy-row

Metadata#

Host#

Dependencies#

CNGX_DATA_GRID_ACCORDIONinject()grid

Relationships

Index#

Inputs#

errorMessage#
input()

Error message announced in the error state. English default; override per locale.

default 'Failed to load'
panelId#string
input()

Stable id this row registers under in the coordinator's open-set. Defaults to a generated id; bind [panelId] to a stable row value to address the row through the group's [(openIds)] model - so a sorted row stays open while it moves. Mirrors CngxAccordionItem.panelId.

default nextUid('cngx-dga-row-')
input()

Semantic severity reflected onto the [data-severity] host attribute for skins that render it (the log-stream skin fills a coloured left edge from the matching --cngx-color-danger / -warning / -info token). Purely visual, no ARIA impact.

The row's async lifecycle, communicated to assistive tech. Accepts a raw AsyncStatus or a CngxAsyncState the consumer already owns - the row reads only the status discriminator, never the payload, so it stays non-generic. A pure data input (the row injects no CNGX_STATEFUL), so no empty-string transform: a bare string status must survive untouched. Mirrors CngxAccordionItem.state; the consumer wires the fetch, the row only communicates the state it is handed.

Instance Properties#

busySlot#unknown
contentChild()ProtectedReadonly

Per-instance busy slot; absent means the CSS skeleton default renders.

contentChild(CngxDgaRowBusy)
cells#unknown
contentChildren()Readonly

Projected cells; the primary one supplies the row's accessible name. Public so CngxDataGridAccordion can read the primary-column index (for the grow default) and use the first row as the column source when no header exists.

contentChildren(CngxDgCell)
errorSlot#unknown
contentChild()ProtectedReadonly

Per-instance error slot; absent means the CSS error affordance default renders.

contentChild(CngxDgaRowError)
headerId#unknown
ProtectedReadonly
nextUid('cngx-dga-header-')
regionId#unknown
ProtectedReadonly
nextUid('cngx-dga-region-')

HostBindings#

BindingExpression
[attr.data-expanded]expanded() ? '' : null
[attr.data-severity]severity() ?? null