selectionBarSync
Why JS: counting checked rows elsewhere on the page, announcing the count and the Escape and action keys need script.
import { selectionBarSync } from "@sdxc/ui/app";Usage
Wires the bar around its host ([data-slot="selection-bar"]) to the target region; the
host itself is the polite live region. The bar shows data-state="selecting" while any
row is checked, its hidden layer is inert, and the count stays on the last non-zero value
so the bar fades out still naming what was selected.
Signature
selectionBarSync(options: SelectionBarSync.Options): MixinDescriptor<HTMLElement>Parameters
| Parameter | Type | Required | Description |
|---|---|---|---|
options | SelectionBarSync.Options | Yes |
Examples
<span role="status" mix={[selectionBarSync({ target: "monitors", selected: "{count} selected", cleared: "Selection cleared" })]} />Used with it
The events, constants and types its module publishes, each imported from @sdxc/ui/app too.
Interface
SelectionBarSync.Options
Configuration for selectionBarSync.
| Member | Type | Required | Description |
|---|---|---|---|
target | string | Yes | The id of the region holding the rows' checkboxes. |
selected | string | Yes | The visible and announced count, with {count} replaced, such as "{count} selected". |
cleared | string | Yes | What is announced once the selection empties, such as "Selection cleared". |
locale | string | No | Locale for the count. Defaults to the runtime's. |