@aceshooting/lyra-ui 11.0.0 → 11.2.0

package/llms-full.txt

@@ -691,6 +691,15 @@ Three layers, and **which one you set decides how far the override reaches**:
 3. **`--lr-<component>-*`** — per-component properties, for one element at a time. Listed in each
    component's own section.
 
+**Layer 2 (`--lr-*`) is declared only on each `lr-*` element's own shadow `:host`.** It never
+reaches plain application CSS, and it never reaches your own custom elements, since neither is a
+descendant of an `lr-*` shadow root — `body { color: var(--lr-color-text) }` in application CSS
+resolves to nothing, silently, not an error. Retheme through layer 1 (`--lr-theme-*`), which
+`theme.css` supplies at document scope and which inherits normally into every nested shadow root.
+See [Where an override actually reaches](#where-an-override-actually-reaches) below for the full
+inheritance rules, including the one documented exception (per-component `--lr-<component>-*`
+hooks, layer 3, which do inherit through wrappers).
+
 ### The colour ramp and the semantic grid
 
 Colour has two layers beneath the `--lr-*` tokens you normally read.
@@ -1718,6 +1727,16 @@ control) is a single tab stop using a roving `tabindex`; arrow keys move within
 `Escape` dismisses the topmost dismissible overlay and returns focus to whatever opened it.
 `ArrowLeft`/`ArrowRight` mean previous/next and swap under `dir="rtl"`.
 
+**`accessibleLabel` binds to one of two different attributes depending on the component, and the
+two are not interchangeable.** Most components (e.g. `lr-card`, `lr-stat`) expose it as a direct
+alias of the native `aria-label` attribute — `accessible-label="…"` does nothing on those; write
+`aria-label="…"` instead. A minority (e.g. `lr-callout`, `lr-table`) separately compute an internal
+accessible name and expose `accessibleLabel` through the bespoke `accessible-label` attribute
+instead, specifically so the host's own native `aria-label` can still independently override that
+computed name. Check the component's own reference section (or its class JSDoc) for which
+convention it uses before writing markup — an `accessible-label` attribute on an `aria-label`-only
+component is a silent no-op, not an error.
+
 **What that contract is verified by, precisely.** Every one of the 284 public tags carries at least
 one axe-core assertion in its own directory's tests, in a test that mounts its own tag; contrast
 (4.5:1 text, 3:1 control borders, in both the light and dark palettes), a 40px minimum target size,
@@ -4041,7 +4060,7 @@ An `lr-option` row remains bounded by its owning listbox: the default label elli
 `start`/`end` (or `prefix`/`suffix`) adornment is capped at 40% of the row. Unbroken metadata
 therefore cannot widen a 320px LTR or RTL picker.
 
-**Adornments in the popup (fixed in 10.1.0).** Before 10.1.0 this paragraph described behavior the
+**Adornments in the popup (fixed in 11.0.0).** Before 11.0.0 this paragraph described behavior the
 code did not have: `lr-combobox` builds its popup from normalized row *data* rather than from the
 light-DOM nodes, so a slotted `start`/`end`/`prefix`/`suffix` adornment had nowhere to land and
 simply never rendered — the documented slots and their documented parts were both dead inside the
@@ -4128,7 +4147,7 @@ An async `source` row can carry the same two fields (`start`, `end`) alongside i
 - `maxOptionsVisible: number = 3` (attribute `max-options-visible` — caps how many selected **tags**
   show before collapsing to `+N`; nothing to do with the suggestion list, see the three-caps note
   below)
-- `visibleOptions?: number` (attribute `visible-options`, new in 10.1.0) — bounds the popup to about
+- `visibleOptions?: number` (attribute `visible-options`, new in 11.0.0) — bounds the popup to about
   this many suggestion rows, leaving the rest reachable by scrolling. Purely presentational: every
   row is still rendered. Measured from where row N actually starts rather than computed from a
   token, because a row's height varies with `sub` lines, adornments and group labels. Unset imposes
@@ -4205,7 +4224,7 @@ alias. Set the boolean `autocorrect` IDL, or use `autocorrect="on"` / `autocorre
 `ComboboxSourceRow = { readonly value: string; readonly label: string; readonly sub?: string; readonly icon?: unknown; readonly start?: unknown;
 readonly end?: unknown; readonly badge?: string |
 number; accessibleLabel?: string; data?: unknown; dotColor?: string; group?: string; disabled?:
-boolean }` — the row shape used by the async `source` path. `start` and `end` (new in 10.1.0) are
+boolean }` — the row shape used by the async `source` path. `start` and `end` (new in 11.0.0) are
 the async counterparts of `<lr-option>`'s `start`/`end` adornment slots and render as the
 `option-start` / `option-end` parts, inert and aria-hidden exactly like `icon`. `icon` renders as a decorative leading
 visual whose rendered subtree stays visible but is inert and hidden from assistive technology;
@@ -4842,9 +4861,13 @@ Inline month-grid calendar, not form-associated (used standalone or embedded ins
 **Properties (28):**
 
 - `dayContent` (JS only): `LyraDatePickerDayContent | undefined`
-- `presets: LyraDateRangePreset[] = []` (JS only, new in 10.1.0) —
-  `LyraDateRangePreset { label: string; start: string; end: string }`, where `start`/`end` are ISO
-  `YYYY-MM-DD`. Renders a `[part="presets"]` quick-range button row above the calendar, for the
+- `presets: LyraDateRangePreset[] = []` (JS only, new in 11.0.0) —
+  `LyraDateRangePreset { label: string; start?: string; end?: string }`, where `start`/`end` are ISO
+  `YYYY-MM-DD`. **Either bound may be omitted (new in 11.1.0)** to mean an OPEN bound, resolving to
+  the picker's `min` / `max` respectively — that is how an "All time" preset is expressed. When the
+  corresponding `min`/`max` is unset there is nothing to resolve to (a `value` of
+  `YYYY-MM-DD/YYYY-MM-DD` has no unbounded spelling), so that preset's button renders **disabled**
+  rather than looking live and doing nothing when pressed. Renders a `[part="presets"]` quick-range button row above the calendar, for the
   dashboard time-filter shape (Today / Last 7 days / Last 30 days / This month / All time).
   **Range mode only** — a preset names two dates, so it is ignored for a single-date picker rather
   than rendering a row that cannot do anything; unset renders nothing at all. Applying one commits
@@ -4855,6 +4878,16 @@ Inline month-grid calendar, not form-associated (used standalone or embedded ins
   The active button carries `aria-pressed="true"` and `data-active`. Deliberately the same
   `label`/`start`/`end` shape as `<lr-time-range>`'s `TimeRangePreset`, so the library has one
   preset vocabulary rather than two — the only difference is the unit (ISO dates, not numbers)
+- `appliedPreset: LyraDateRangePreset | undefined` (read-only, new in 11.1.0) — the preset whose
+  button produced the current `value`, or `undefined` when the range was picked by hand. Read it
+  inside your own `change`/`input` handler. It exists because a dashboard filter has to persist
+  *which* preset is active rather than the pair it froze to: "Last 7 days" must still mean the last
+  7 days after tomorrow's reload. That fact is not recoverable from `value` — re-deriving it by
+  string-matching is the mapping table `presets` exists to delete, and it is ambiguous anyway
+  (Today and This month coincide on the 1st of a month, and a hand-picked range can equal a
+  preset's pair by construction). A property rather than an event detail because `input`/`change`
+  here are **native** events, deliberately indistinguishable from a manual selection so existing
+  handlers need no special case, and a native `Event` cannot carry a detail without changing type
 - `disabled: boolean = false` (reflected)
 - `disabledDates: string | string[] | Date[] = ''` (attribute `disabled-dates`)
 - `disabledDaysOfWeek: string = ''` (attribute `disabled-days-of-week`)
@@ -5022,7 +5055,9 @@ capped at 40% and ellipsize unbroken content. Clear and calendar actions retain
 **Custom states:** `blank`, `disabled`, `open`, and `range`; the shared form-associated mixin also
 exposes its validity states.
 
-**CSS parts (19):** `clear-button`, `date-input`, `date-picker`, `end`, `expand-button`,
+**CSS parts (21):** `clear-button`, `date-input`, `date-picker`, `presets` and `preset-button`
+(forwarded from the nested `lr-date-picker` via `exportparts`, so the quick-range row is styleable
+from outside — new in 11.1.0), `end`, `expand-button`,
 `expand-icon`, `form-control`, `form-control-input`, `form-control-label`, `hint`, `input`,
 `input-wrapper`, `popup`, `range-separator`, `segment`, `segment-literal`, `start`, permanent
 compatibility name `base` (a nested wrapper inside `date-input`), and permanent compatibility name
@@ -5155,7 +5190,7 @@ and `dateTimeFormat(locale, options)`.
 - `--lr-date-picker-nav-active-bg` — Pressed navigation background; defaults to the hover color
   mixed by `--lr-color-mix-active`.
 - `--lr-date-picker-preset-hover-bg`, `--lr-date-picker-preset-active-bg`, and
-  `--lr-date-picker-preset-selected-bg` (new in 10.1.0) — hover, pressed, and
+  `--lr-date-picker-preset-selected-bg` (new in 11.0.0) — hover, pressed, and
   currently-selected paint for a `presets` quick-range button. Defaults are
   `var(--lr-color-brand-quiet)`, that hover colour mixed by `--lr-color-mix-active`, and
   `var(--lr-color-brand)` respectively.
@@ -10836,7 +10871,7 @@ weekdayLabelText?: (jsWeekday:number)=>string|undefined; monthLabelText?:
   A malformed value is ignored rather than collapsing the gutter. Calendar mode is unaffected; it
   has its own fixed weekday gutter
 - `colLabelHeight?: number | 'auto'` (attribute `col-label-height`, not reflected, `'auto'` new in
-  10.1.0) — height, in CSS px, of the matrix column-label band, or `'auto'` to measure the labels
+  11.0.0) — height, in CSS px, of the matrix column-label band, or `'auto'` to measure the labels
   and size the band to fit them. Under a non-zero `colLabelRotation` the measurement projects each
   label's width through the rotation, which is what makes a rotated axis usable without hand-tuning
   a magic number. Never below the built-in `20`, and bounded above by a sanity ceiling so a
@@ -10845,7 +10880,7 @@ weekdayLabelText?: (jsWeekday:number)=>string|undefined; monthLabelText?:
   be bounded relative to them, whereas the canvas simply grows taller for this band and the cells
   keep their size. Unset keeps the built-in `20`, so no existing chart reflows. A malformed value is
   ignored
-- `colLabelRotation?: number` (attribute `col-label-rotation`, new in 10.1.0) — rotation, in
+- `colLabelRotation?: number` (attribute `col-label-rotation`, new in 11.0.0) — rotation, in
   degrees, applied to matrix column labels. Unset or `0` paints them horizontally exactly as before.
   In a dense matrix the per-column width is far narrower than a typical label, so horizontal labels
   collide with their neighbours; `45` or `90` is the standard remedy. Each label rotates about an
@@ -10967,7 +11002,7 @@ weekday * (cellSize + CAL_GAP)`), consulted consistently by drawing, hit-testing
   than 2 entries) keeps today's 2-endpoint interpolation exactly. Invalid colors use the canvas
   fallback color and prevent the custom legend gradient from being assigned.
 - `legendStops?: readonly HeatmapLegendStop[]` (attribute: false) — clone-owned, bounded, frozen `HeatmapLegendStop { value: number;
-color?: string; label?: string }`: a discrete legend key rendered **instead of** the
+color?: string; label?: string; partOfRamp?: boolean }`: a discrete legend key rendered **instead of** the
   `--lr-heatmap-scale-lo`/`-hi` gradient bar and its `[part="legend-lo"]`/`[part="legend-hi"]`
   endpoint labels — one `[part="legend-stop"]` per entry, in array order, each a
   `[part="legend-swatch"]` filled with that entry's `color` plus a `[part="legend-stop-label"]`.
@@ -10984,14 +11019,26 @@ color?: string; label?: string }`: a discrete legend key rendered **instead of**
   are never consulted by the color ramp, the bucket math, the tooltip, or the generated accessible
   name, so adding them changes nothing a cell renders. Labeled `annotations` still render their
   `[part="legend-annotation"]` entries after the stops. Unset (the default) or an empty array
-  reproduces the exact gradient legend, unchanged.
+  reproduces the exact gradient legend, unchanged. A dev-mode-only warning fires when a stop's
+  `color` doesn't match the corresponding `colorSteps` entry — set `partOfRamp: false` on a stop
+  that is a real, distinctly-colored swatch deliberately outside the sequential ramp (e.g. a fixed
+  "no data" color next to an N-step ramp) to exclude just that stop from the comparison; defaults to
+  `true`. A caption-only stop (no `color`) is already excluded regardless of this flag.
 
 **Getters/methods:** `refreshTheme()` — redraws canvas content after an upstream design-token or
 color-scheme change; called automatically on theme changes, exposed for a consumer that needs to
-force a redraw manually.
+force a redraw manually. `matrixGeometry: Readonly<{ padLeft: number; padTop: number; cellSize:
+number }> | undefined` — the gutter/cell geometry the last matrix-mode draw actually painted with,
+in CSS pixels; `undefined` in calendar mode. Lets a light-DOM consumer (e.g. a sticky header mirror
+for a tall matrix) line up with the canvas without hardcoding the same numbers `row-label-width`/
+`col-label-height`'s `"auto"` resolution would otherwise keep private.
 
 **Events:** `lr-cell-click` (fired on click, or Enter/Space on the keyboard-focused cell —
-`detail: { row, col, value }` in matrix mode, `detail: { date, value }` in calendar mode)
+`detail: { row, col, value }` in matrix mode, `detail: { date, value }` in calendar mode),
+`lr-matrix-geometry-change` (fired after a matrix-mode draw whose resolved `matrixGeometry` differs
+from the previous draw — e.g. after `row-label-width="auto"`/`col-label-height="auto"` resolves
+against new content or a resize; `detail` is the same object `matrixGeometry` returns; never fired
+in calendar mode)
 
 **Slots:** none.
 
@@ -13002,6 +13049,7 @@ These named interfaces and helper signatures are available to typed integrations
   value: unknown;
   color: unknown;
   label: unknown;
+  partOfRamp: unknown;
 }`
   `HeatmapMatrixData {
   kind: unknown;
@@ -18551,7 +18599,7 @@ A click-triggered, light-dismiss floating surface positioned with the shared Flo
 - `accessibleLabel: string = ''` (attribute **`aria-label`**) — names the popup. An authored host
   attribute wins by presence, including `aria-label=""`; only when it is absent does the property
   or localized "Popover" ("Menu" when `popupRole` is `menu`) fallback apply
-- `popupRole: 'dialog'|'menu'|'none' = 'dialog'` (attribute `popup-role`). `none` (new in 10.1.0)
+- `popupRole: 'dialog'|'menu'|'none' = 'dialog'` (attribute `popup-role`). `none` (new in 11.0.0)
   renders **no** `role` and no generated `aria-label` on the popup surface, and leaves
   `aria-haspopup` off the trigger, so slotted content owns its own semantics and accessible name.
   It exists for the WAI-ARIA **disclosure navigation** pattern: a flyout of links is not an
@@ -21698,6 +21746,12 @@ wording that reads to a user as a bug. Style the two states apart with those att
 rectangular corner radius), `--lr-flag-aspect-ratio` (default `4 / 3`), and
 `--lr-flag-object-fit` (default `cover`); also consumes `--lr-color-border` for the inset ring.
 
+**Sizing.** The host has no intrinsic `width` — it sizes from `font-size` (`block-size: 1em`,
+`inline-size` derived from `--lr-flag-aspect-ratio` via CSS `aspect-ratio`), so it scales naturally
+with surrounding text (`<lr-flag style="font-size: 2rem">`). Setting `width`/`inline-size` directly
+instead makes both axes definite, which defeats `aspect-ratio` (only applies when at most one axis
+is definite) and squashes the image rather than scaling it.
+
 **Optional peer deps:** `@aceshooting/lyra-flags` — required for the component to actually render an
 image when `country` or `language` is used. Import
 `@aceshooting/lyra-ui/components/media/flag/flag-peer.js` once to opt into
@@ -21821,9 +21875,26 @@ import "@aceshooting/lyra-ui/components/media/flag/flag-peer.js";
 - `country`/`language` resolve through `@aceshooting/lyra-flags`'s `flagUrl(code)`, which lazily
   fetches one requested flag at runtime. A bundler may still emit the complete reachable lazy-chunk
   graph because every supported code has a literal loader import; use a literal asset subpath
-  import when the deployment artifact must be pruned. If you already have a flag's URL at build
+  import when the deployment artifact must be pruned. If every `<lr-flag>` in the app is pinned to
+  one `fidelity` (no per-instance switching), register
+  `@aceshooting/lyra-flags/standard`/`/compact`/`/detailed` via `setFlagUrlResolver()` instead of
+  importing `flag-peer.js` (which always registers the full three-tier resolver) — the tier-specific
+  entry excludes the other two tiers' generated loader maps from the reachable graph; see that
+  package's README. If you already have a flag's URL at build
   time, `src` skips the peer-package round trip; native image loading still uses the same bounded
   loading/error transaction.
+- Rendering many flags at once (a country table, a picker listing every locale): resolve every code
+  up front with `@aceshooting/lyra-flags`'s `flagUrls()` (one call, returns `{code: url}` for all
+  249 flags) and pass results through `src`, instead of letting each `<lr-flag>` instance
+  independently call `flagUrl()` — skips one peer-resolution round trip per instance. Image fetches
+  themselves are unaffected either way (each flag is a distinct asset; there is no sprite).
+  Alternatively, import `@aceshooting/lyra-ui/components/media/flag/flag-peer-bulk.js` instead of
+  the default `flag-peer.js` (never both) to get this automatically: it registers a resolver backed
+  by one shared `flagUrls()` call, so every `<lr-flag>` on the page benefits without threading `src`
+  by hand. Only worth it when the page renders most/all flags — a page with a handful pays an
+  unneeded 249-entry fetch. Only the standard tier is bulk-fetched this way;
+  `fidelity="compact"/"detailed"` on individual elements still resolves through its own lazy
+  per-code loader.
 - 65 of `@aceshooting/lyra-flags`' 249 flags (any whose design includes a detailed coat of
   arms/seal/emblem, e.g. `es`, `pt`, `sv`) ship **three** fidelity tiers, selected via the
   `fidelity` property (`flagUrl(code, { variant: fidelity })` under the hood): `"compact"` — a tiny WebP raster for
@@ -21991,7 +22062,7 @@ string; geojson: GeoJSON.FeatureCollection; field: string; stops: [number, strin
   the documented way to weight a ramp toward the low end). **`stops` stay in the data's own units
   under either mode**, so the legend keeps reading in real values instead of log units — no
   pre-transforming to log10 and hand-relabelling the legend back.
-  `'step'` (new in 10.1.0) emits maplibre's `['step', …]` instead of `['interpolate', …]`, giving
+  `'step'` (new in 11.0.0) emits maplibre's `['step', …]` instead of `['interpolate', …]`, giving
   **discrete bands rather than a continuous ramp**. Use it whenever the legend advertises a fixed
   set of ranges with one swatch each: a ramp would put colours on the map that appear nowhere in the
   legend, and would render two regions in the same advertised band as visibly different colours
@@ -22024,7 +22095,7 @@ GeoJSON.FeatureCollection; tone?: 'accent' | 'success' | 'warning' |
   GeoJSON source plus three geometry-filtered layers
   (fill, line, and circle, so a mixed `FeatureCollection` renders correctly), colored from the
   matching `--lr-color-*` token (`tone` defaults to `'accent'` → `--lr-color-brand`).
-  `color` and `strokeColor` (both new in 10.1.0) override that per surface — `color` paints the
+  `color` and `strokeColor` (both new in 11.0.0) override that per surface — `color` paints the
   polygon fill, `strokeColor` the line and circle layers, falling back to `color` and then to `tone`.
   They are separable because a fill and its outline want opposite things on a
   choropleth-plus-overlay map, and the difference is measurable rather than aesthetic: the fill
@@ -24233,6 +24304,7 @@ These named interfaces and helper signatures are available to typed integrations
 
 - **`components-media-flag-flag-contracts`** — Supporting data types and helpers for this component family.
   `loadFlagUrl(/* public names: importFlags */): unknown`
+  `loadBulkFlagUrl(/* public names: importFlags */): unknown`
   `setFlagUrlResolver(/* public names: value */): unknown`
 
 - **`components-media-flag-language-map-contracts`** — Supporting data types and helpers for this component family.
@@ -24638,7 +24710,7 @@ property).
   ignored without evaluating script or exposing prototype-pollution keys to the merge.
 - `showDataTable: boolean = false` (attribute `show-data-table`) — makes the always-available
   accessible data table visible rather than screen-reader-only
-- `dataTableToggle: boolean = false` (attribute `data-table-toggle`, new in 10.1.0) — renders a
+- `dataTableToggle: boolean = false` (attribute `data-table-toggle`, new in 11.0.0) — renders a
   localized disclosure button (`part="data-table-toggle"`) above the data table so a *sighted*
   reader can reveal the numbers on demand. `showDataTable` alone is all-or-nothing, which left
   consumers wrapping a duplicated table in their own `<details>`. With the toggle on,
@@ -24960,6 +25032,21 @@ passthrough). Not a subclass of `LyraChart`.
 - `tableTotals: boolean = false` (attribute `table-totals`) — adds a localized total column to the
   multi-series accessible table when `type="bar"` and `stacked` are both active. Ignored for
   grouped bars, line charts, and the single-series `data-list`.
+- `showDataTable: boolean = false` (attribute `show-data-table`, new in 11.1.0) — makes the
+  generated accessible table visible rather than screen-reader-only. Same meaning as `lr-chart`'s
+  property of the same name.
+- `dataTableToggle: boolean = false` (attribute `data-table-toggle`, new in 11.1.0) — renders a
+  localized disclosure button (`part="data-table-toggle"`, with `aria-expanded` and
+  `aria-controls`) above the table, so a *sighted* reader can reveal the numbers on demand;
+  `showDataTable` then becomes the disclosure's **initial** state rather than its whole behavior.
+  The table stays in the DOM in both states, so assistive technology never loses it. This matters
+  more here than on `lr-chart`: this component exists to avoid the Chart.js peers, so without it an
+  app that chose it for exactly that reason had to either hand-roll a `<details>` around a
+  duplicated table or adopt `lr-chart` and pull in Chart.js for a button — the cheap component
+  stuck with the expensive workaround. Unset, nothing renders and behavior is unchanged.
+  Themeable via `--lr-lite-chart-data-table-toggle-hover-bg` (default
+  `var(--lr-color-brand-quiet)`) and `--lr-lite-chart-data-table-toggle-active-bg` (default: that
+  hover colour mixed by `--lr-color-mix-active`).
 - `layout: 'fit' | 'scroll' = 'fit'` (reflected) — `'fit'` (default) is the original squeeze-the-
   whole-plot-to-host-width behavior, unchanged. `'scroll'` gives bars a fixed `barWidth` instead: plot
   content width becomes `categoryCount * barWidth` (can exceed the host's measured width), and
@@ -25066,7 +25153,8 @@ data alternative.
 mark), `line`, `legend`, `legend-item`, `legend-swatch`, `legend-text` (extra per-item text after
 the series label, rendered only when `legendText` is set), `live-region` (the current mark
 announcement for keyboard users), `data-list` (a visually hidden sampled list of plotted data
-points — single-series only), `data-table` (the generated/slotted alternative container), `table`
+points — single-series only), `data-table` (the generated/slotted alternative container),
+`data-table-toggle` (the `dataTableToggle` disclosure button — new in 11.1.0), `table`
 (the generated semantic category×series table rendered when there is more than one dataset), and
 `data-truncation` (the
 visible/announced sampling notice).
@@ -25345,7 +25433,7 @@ browser). Does **not** extend `LyraChart` — a deliberately bespoke API.
 - `formatter?: LyraChartFormatter`, `valueFormatter?: LyraChartValueFormatter` — numeric axis,
   tooltip, table, summary, and export formatting; the context-object formatter takes precedence
 - `showDataTable: boolean = false` (attribute `show-data-table`) — reveals the accessible data table
-- `dataTableToggle: boolean = false` (attribute `data-table-toggle`, new in 10.1.0) — renders a
+- `dataTableToggle: boolean = false` (attribute `data-table-toggle`, new in 11.0.0) — renders a
   localized disclosure button (`part="data-table-toggle"`) above the data table so a *sighted*
   reader can reveal the numbers on demand. `showDataTable` alone is all-or-nothing, which left
   consumers wrapping a duplicated table in their own `<details>`. With the toggle on,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@aceshooting/lyra-ui",
-  "version": "11.0.0",
+  "version": "11.2.0",
   "description": "Free, independent Lit web components: an open-source alternative to Shoelace and Web Awesome with accessible forms, dashboards, charts, and agent UI.",
   "keywords": [
     "web-components",
@@ -2252,7 +2252,7 @@
     "lit": "^3.3.3"
   },
   "peerDependencies": {
-    "@aceshooting/lyra-flags": "^2.0.0",
+    "@aceshooting/lyra-flags": "^2.1.0",
     "@aiden0z/pptx-renderer": "^1.2.4",
     "@sgratzl/chartjs-chart-boxplot": "^4.4.5",
     "chart.js": "^4.5.1",
@@ -2263,7 +2263,7 @@
     "d3-force": "^3.0.0",
     "d3-selection": "^3.0.0",
     "d3-zoom": "^3.0.0",
-    "dompurify": "^3.4.13",
+    "dompurify": "^3.4.14",
     "emoji-picker-element-data": "^1.8.0",
     "epubjs": "^0.3.93",
     "ical.js": "^2.2.1",
@@ -2372,7 +2372,7 @@
     }
   },
   "devDependencies": {
-    "@aceshooting/lyra-flags": "^2.0.0",
+    "@aceshooting/lyra-flags": "^2.1.0",
     "@aiden0z/pptx-renderer": "^1.2.4",
     "@codecov/bundle-analyzer": "^2.0.1",
     "@custom-elements-manifest/analyzer": "^0.11.0",
@@ -2402,7 +2402,7 @@
     "d3-force": "^3.0.0",
     "d3-selection": "^3.0.0",
     "d3-zoom": "^3.0.0",
-    "dompurify": "^3.4.13",
+    "dompurify": "^3.4.14",
     "emoji-picker-element-data": "^1.8.0",
     "epubjs": "^0.3.93",
     "fast-check": "^4.9.0",
@@ -2416,7 +2416,7 @@
     "mammoth": "^1.12.1",
     "maplibre-gl": "^6.4.1",
     "marked": "^18.0.10",
-    "oxc-parser": "^0.145.0",
+    "oxc-parser": "^0.146.0",
     "papaparse": "^5.6.0",
     "pdfjs-dist": "^6.2.108",
     "pixelmatch": "^7.2.0",

package/vscode-css-data.json

@@ -6357,6 +6357,20 @@
         "value": "**`<lr-graph>`** (default: `var(--lr-color-border)`) — Default link stroke, overridden per-link by a link's own `color`."
       }
     },
+    {
+      "name": "--lr-lite-chart-data-table-toggle-active-bg",
+      "description": {
+        "kind": "markdown",
+        "value": "**`<lr-lite-chart>`** — Pressed background of the `dataTableToggle` disclosure button; defaults to a mix of the hover background with the shared active mix partner."
+      }
+    },
+    {
+      "name": "--lr-lite-chart-data-table-toggle-hover-bg",
+      "description": {
+        "kind": "markdown",
+        "value": "**`<lr-lite-chart>`** (default: `var(--lr-color-brand-quiet)`) — Hover background of the `dataTableToggle` disclosure button."
+      }
+    },
     {
       "name": "--lr-lite-chart-selected-outline-color",
       "description": {

package/vscode-html-data.json

@@ -7232,7 +7232,7 @@
       "name": "lr-date-input",
       "description": {
         "kind": "markdown",
-        "value": "`<lr-date-input>` — a date field with an attached calendar popover.\nMirrors the core `<wa-date-input>` API under `lr-`. Value is ISO 8601\n(`YYYY-MM-DD`, or `YYYY-MM-DD/YYYY-MM-DD` in range mode). Form-associated.\nThe ISO model is explicitly proleptic Gregorian for every locale. Display uses locale digits\nand `Intl.DateTimeFormat.formatRange()`; parsing normalizes those digits and bidi marks so the\ncomponent's own Arabic/Persian presentation always round-trips to the same ISO value.\n\nThis component uses a single text field; typing accepts ISO or a\nlocale-parseable date. Enter commits the typed text and then performs the implicit form\nsubmission a native `<input>` would (see `internal/submit-on-enter.ts` — the internal input is\nin a shadow root and has no form owner, so the platform can never do it here); the commit runs\nfirst so the submitted value is the date the field visibly shows.\nThat text field is also the popup-opening `role=\"combobox\"` owner, with explicit\n`aria-haspopup`, `aria-controls`, and `aria-expanded`; the adjacent button remains an equivalent\npointer/keyboard toggle rather than carrying the only popup relationship.\n\n`size` uses the same `2xs`–`xl` scale as `lr-input`/`lr-select`/`lr-combobox`'s own `size`,\ndefault `m`. The calendar-toggle and clear buttons keep a constant touch-target size at every\ntier (mirroring `lr-input`'s own password-toggle button), so only the field's density scales.\nIn a constrained row the editable input shrinks first, while each public `start`/`end`\nadornment is capped at 40% so unbroken consumer content cannot widen the field.\n\n---\n\n**Component metadata**\n\n- Status: `experimental`\n- Since: `4.0.0`\n- Rationale: This exact tag already appears in published Lyra versions and remains experimental under full semver protection while its public API and usage patterns mature.\n- Graduation: Eligible for stable status once its documented API, populated accessibility states, cross-browser behavior, and compatibility contract demonstrate sustained reliability.\n\n---\n\n**Slots**\n\n| Name | Description |\n| --- | --- |\n| `clear-icon` | Replaces the clear icon. |\n| `day-YYYY-MM-DD` | Content for an individual ISO calendar day. |\n| `end` | Adornment after the text field and the built-in clear action, and before the calendar toggle — so consumer content never sits outboard of the calendar button. |\n| `error` | Lyra extension for custom validation markup. |\n| `expand-icon` | Replaces the calendar icon. |\n| `footer` | Calendar footer content. |\n| `hint` | Custom hint content. |\n| `label` | Custom label content. |\n| `next-icon` | Replaces the next-month icon in the calendar. |\n| `previous-icon` | Replaces the previous-month icon in the calendar. |\n| `start` | Adornment at the inline-start of the input row, before the text field. |\n\n---\n\n**CSS Shadow Parts**\n\n| Name | Description |\n| --- | --- |\n| `base` | Permanent compatibility name for the nested base wrapper. |\n| `clear-button` | The clear control. |\n| `date-input` | The date-input wrapper. |\n| `date-picker` | The nested date picker. |\n| `end` | Wrapper around the `end` adornment slot; `hidden` while nothing is slotted. |\n| `error` | The validation message. |\n| `expand-button` | The calendar popup toggle. |\n| `expand-icon` | The calendar icon. |\n| `form-control` | The outer form-control wrapper. |\n| `form-control-input` | The editable date surface. |\n| `form-control-label` | The outer label wrapper. |\n| `hint` | The hint message. |\n| `input` | The text input. |\n| `input-wrapper` | The input and button wrapper. |\n| `label` | Permanent compatibility name for the inner label-content wrapper. |\n| `popup` | The positioned calendar popup. |\n| `range-separator` | The range separator. |\n| `segment` | The editable date segment wrapper. |\n| `segment-literal` | A literal inside the editable date surface. |\n| `start` | Wrapper around the `start` adornment slot; `hidden` while nothing is slotted. |\n\n---\n\n**CSS Custom Properties**\n\n- `--lr-date-input-padding-block` (default: `var(--lr-space-xs)`) — Block padding of the input row, scaled by `size`.\n- `--lr-date-input-padding-inline` (default: `var(--lr-space-s)`) — Inline padding of the input row, scaled by `size`.\n- `--lr-date-input-font-size` (default: `inherit`) — Font size of the text input, scaled by `size`.\n- `--lr-date-input-placeholder-color` (default: `var(--lr-color-text-quiet)`) — Placeholder text color.\n- `--lr-date-input-gap` (default: `var(--lr-space-xs)`) — Gap between input-row children.\n- `--lr-date-input-radius` (default: `var(--lr-radius)`) — Input-row corner radius. `pill` changes its private default to `--lr-radius-pill`; an inherited or direct public value still wins.\n- `--lr-date-input-focus-border-color` (default: `var(--lr-color-brand)`) — Focused row border color.\n- `--lr-date-input-action-hover-color` (default: `var(--lr-color-text)`) — Clear/calendar action color on hover.\n- `--lr-date-input-action-hover-bg` (default: `transparent`) — Clear/calendar action background on hover.\n- `--lr-date-input-action-hover-radius` (default: `var(--lr-date-input-radius)`) — Clear/calendar action corner radius on hover.\n- `--lr-date-input-action-active-color` (default: `var(--lr-date-input-action-hover-color,var(--lr-color-text))`) — Clear/calendar action color while pressed.\n- `--lr-date-input-action-active-bg` (default: `color-mix(...)`) — Clear/calendar action background while pressed.\n- `--lr-date-input-action-active-radius` (default: `var(--lr-date-input-radius)`) — Clear/calendar action corner radius while pressed.\n- `--lr-date-input-control-min-height` (default: `var(--lr-form-control-height)`) — Minimum block size of the input row, read from the shared form-control height ladder so retuning `--lr-theme-form-control-height-*` moves this control and every sibling field together. Each default sits below the row's transitively-pinned height, so it is dead until a consumer raises it -- the unset render is unchanged.\n- `--lr-date-input-control-height` — Exact block size of the input row. Undeclared by default, so the row grows to fit its content (floored by `--lr-date-input-control-min-height`). Set it to pin a fixed height; the calendar toggle keeps its own 24x24 touch target even when this pins a shorter row.\n- `--show-duration` (default: `var(--lr-transition-fast)`) — Popup enter-transition duration.\n- `--hide-duration` (default: `var(--lr-transition-fast)`) — Popup exit-transition duration.\n- `--lr-form-control-required-content` (default: `' *'`) — The required-field marker rendered after the label. Set it to `''` to suppress the marker, or to any other quoted string (`' (required)'`, a localized word) to replace it. Caller-supplied content, so it is never localized here.\n- `--lr-form-control-required-color` (default: `var(--lr-color-danger)`) — Color of that marker, retunable without touching any other danger-coloured surface.\n- `--lr-form-control-required-offset` (default: `0`) — Inline space between the label text and the marker."
+        "value": "`<lr-date-input>` — a date field with an attached calendar popover.\nMirrors the core `<wa-date-input>` API under `lr-`. Value is ISO 8601\n(`YYYY-MM-DD`, or `YYYY-MM-DD/YYYY-MM-DD` in range mode). Form-associated.\nThe ISO model is explicitly proleptic Gregorian for every locale. Display uses locale digits\nand `Intl.DateTimeFormat.formatRange()`; parsing normalizes those digits and bidi marks so the\ncomponent's own Arabic/Persian presentation always round-trips to the same ISO value.\n\nThis component uses a single text field; typing accepts ISO or a\nlocale-parseable date. Enter commits the typed text and then performs the implicit form\nsubmission a native `<input>` would (see `internal/submit-on-enter.ts` — the internal input is\nin a shadow root and has no form owner, so the platform can never do it here); the commit runs\nfirst so the submitted value is the date the field visibly shows.\nThat text field is also the popup-opening `role=\"combobox\"` owner, with explicit\n`aria-haspopup`, `aria-controls`, and `aria-expanded`; the adjacent button remains an equivalent\npointer/keyboard toggle rather than carrying the only popup relationship.\n\n`size` uses the same `2xs`–`xl` scale as `lr-input`/`lr-select`/`lr-combobox`'s own `size`,\ndefault `m`. The calendar-toggle and clear buttons keep a constant touch-target size at every\ntier (mirroring `lr-input`'s own password-toggle button), so only the field's density scales.\nIn a constrained row the editable input shrinks first, while each public `start`/`end`\nadornment is capped at 40% so unbroken consumer content cannot widen the field.\n\n---\n\n**Component metadata**\n\n- Status: `experimental`\n- Since: `4.0.0`\n- Rationale: This exact tag already appears in published Lyra versions and remains experimental under full semver protection while its public API and usage patterns mature.\n- Graduation: Eligible for stable status once its documented API, populated accessibility states, cross-browser behavior, and compatibility contract demonstrate sustained reliability.\n\n---\n\n**Slots**\n\n| Name | Description |\n| --- | --- |\n| `clear-icon` | Replaces the clear icon. |\n| `day-YYYY-MM-DD` | Content for an individual ISO calendar day. |\n| `end` | Adornment after the text field and the built-in clear action, and before the calendar toggle — so consumer content never sits outboard of the calendar button. |\n| `error` | Lyra extension for custom validation markup. |\n| `expand-icon` | Replaces the calendar icon. |\n| `footer` | Calendar footer content. |\n| `hint` | Custom hint content. |\n| `label` | Custom label content. |\n| `next-icon` | Replaces the next-month icon in the calendar. |\n| `previous-icon` | Replaces the previous-month icon in the calendar. |\n| `start` | Adornment at the inline-start of the input row, before the text field. |\n\n---\n\n**CSS Shadow Parts**\n\n| Name | Description |\n| --- | --- |\n| `base` | Permanent compatibility name for the nested base wrapper. |\n| `clear-button` | The clear control. |\n| `date-input` | The date-input wrapper. |\n| `date-picker` | The nested date picker. |\n| `end` | Wrapper around the `end` adornment slot; `hidden` while nothing is slotted. |\n| `error` | The validation message. |\n| `expand-button` | The calendar popup toggle. |\n| `expand-icon` | The calendar icon. |\n| `form-control` | The outer form-control wrapper. |\n| `form-control-input` | The editable date surface. |\n| `form-control-label` | The outer label wrapper. |\n| `hint` | The hint message. |\n| `input` | The text input. |\n| `input-wrapper` | The input and button wrapper. |\n| `label` | Permanent compatibility name for the inner label-content wrapper. |\n| `popup` | The positioned calendar popup. |\n| `preset-button` | One quick-range button, forwarded from `<lr-date-picker>`. |\n| `presets` | The nested picker's quick-range row, forwarded from `<lr-date-picker>`. |\n| `range-separator` | The range separator. |\n| `segment` | The editable date segment wrapper. |\n| `segment-literal` | A literal inside the editable date surface. |\n| `start` | Wrapper around the `start` adornment slot; `hidden` while nothing is slotted. |\n\n---\n\n**CSS Custom Properties**\n\n- `--lr-date-input-padding-block` (default: `var(--lr-space-xs)`) — Block padding of the input row, scaled by `size`.\n- `--lr-date-input-padding-inline` (default: `var(--lr-space-s)`) — Inline padding of the input row, scaled by `size`.\n- `--lr-date-input-font-size` (default: `inherit`) — Font size of the text input, scaled by `size`.\n- `--lr-date-input-placeholder-color` (default: `var(--lr-color-text-quiet)`) — Placeholder text color.\n- `--lr-date-input-gap` (default: `var(--lr-space-xs)`) — Gap between input-row children.\n- `--lr-date-input-radius` (default: `var(--lr-radius)`) — Input-row corner radius. `pill` changes its private default to `--lr-radius-pill`; an inherited or direct public value still wins.\n- `--lr-date-input-focus-border-color` (default: `var(--lr-color-brand)`) — Focused row border color.\n- `--lr-date-input-action-hover-color` (default: `var(--lr-color-text)`) — Clear/calendar action color on hover.\n- `--lr-date-input-action-hover-bg` (default: `transparent`) — Clear/calendar action background on hover.\n- `--lr-date-input-action-hover-radius` (default: `var(--lr-date-input-radius)`) — Clear/calendar action corner radius on hover.\n- `--lr-date-input-action-active-color` (default: `var(--lr-date-input-action-hover-color,var(--lr-color-text))`) — Clear/calendar action color while pressed.\n- `--lr-date-input-action-active-bg` (default: `color-mix(...)`) — Clear/calendar action background while pressed.\n- `--lr-date-input-action-active-radius` (default: `var(--lr-date-input-radius)`) — Clear/calendar action corner radius while pressed.\n- `--lr-date-input-control-min-height` (default: `var(--lr-form-control-height)`) — Minimum block size of the input row, read from the shared form-control height ladder so retuning `--lr-theme-form-control-height-*` moves this control and every sibling field together. Each default sits below the row's transitively-pinned height, so it is dead until a consumer raises it -- the unset render is unchanged.\n- `--lr-date-input-control-height` — Exact block size of the input row. Undeclared by default, so the row grows to fit its content (floored by `--lr-date-input-control-min-height`). Set it to pin a fixed height; the calendar toggle keeps its own 24x24 touch target even when this pins a shorter row.\n- `--show-duration` (default: `var(--lr-transition-fast)`) — Popup enter-transition duration.\n- `--hide-duration` (default: `var(--lr-transition-fast)`) — Popup exit-transition duration.\n- `--lr-form-control-required-content` (default: `' *'`) — The required-field marker rendered after the label. Set it to `''` to suppress the marker, or to any other quoted string (`' (required)'`, a localized word) to replace it. Caller-supplied content, so it is never localized here.\n- `--lr-form-control-required-color` (default: `var(--lr-color-danger)`) — Color of that marker, retunable without touching any other danger-coloured surface.\n- `--lr-form-control-required-offset` (default: `0`) — Inline space between the label text and the marker."
       },
       "attributes": [
         {
@@ -10645,7 +10645,7 @@
       "name": "lr-flag",
       "description": {
         "kind": "markdown",
-        "value": "`<lr-flag>` — a country/language flag.\n\nFlag images are shipped by the optional peer package `@aceshooting/lyra-flags`,\nnot bundled into lyra-ui itself, so importing the core library pulls zero flag\nweight. Give it a `country` (ISO 3166-1 alpha-2) or a `language` tag (mapped to\na representative country). While that peer package's `flagUrl()` resolves,\nthe host carries `aria-busy=\"true\"`; a decorative skeleton and ordinary, non-live localized\nloading text render in its place. A missing or failed peer resolver fails closed with a localized visible error and a\nshared light-DOM assertive announcement, plus a one-time `console.warn` naming the code and the\n`flag-peer.js` import that registers a resolver -- the visible error alone cannot tell a\ndeveloper that the fix is a missing import rather than missing flag data;\nan installed resolver returning no URL for an unknown code remains a valid\nempty result.\n\n**Bundle-size note:** `country`/`language` resolve through the peer package's\n`flagUrl(code)`, which lazily fetches one requested flag at runtime. A\nbundler may still emit the complete reachable lazy-chunk graph; use a\nliteral asset subpath import when the deployment artifact must be pruned.\nIf you already\nhave a flag's URL at build time (e.g. from your own literal\n`import frUrl from '@aceshooting/lyra-flags/flags/fr.svg?url'`), pass it as\n`src` instead to skip the peer-package round trip (and its loading-skeleton\nflash) entirely.\n\nThe ~65 flags whose design includes a detailed coat of arms/seal/emblem (e.g. `es`, `pt`) ship\nthree fidelity tiers; choose one with `fidelity`: `\"compact\"` (a tiny WebP raster for icon-scale\nuse — menu items, language selectors, dense lists), the default `\"standard\"` (icon-optimized\nvector for card/row sizes), or `\"detailed\"` (the pristine full-detail vector for hero-scale\ndisplay). A no-op for every other code — all tiers resolve to the same file. See `fidelity`'s own\ndoc.\n\n---\n\n**Component metadata**\n\n- Status: `stable`\n- Since: `4.0.0`\n- Rationale: This exact lr-* tag appears in a published Lyra release manifest and remains a supported public contract under semver.\n- Graduation: Already stable; it retains that status while its documented behavior, accessibility, compatibility, and cross-browser support remain part of the public contract.\n\n---\n\n**Slots**\n\n| Name | Description |\n| --- | --- |\n| `fallback` | Rendered in place of the flag when `country`/`language` cannot resolve to a current flag (an unassigned, historical, or malformed code). Wins over the `fallback` property. Distinct from the peer-resolver failure that produces `[part=\"error\"]`: an unresolvable code is data, not a defect. |\n\n---\n\n**CSS Shadow Parts**\n\n| Name | Description |\n| --- | --- |\n| `error` | Ordinary localized visible error rendered when the optional peer resolver is unavailable or fails; each fresh resolution failure appends the same localized message to the shared light-DOM assertive announcement sink. |\n| `fallback-image` | The `fallback` property's placeholder image, when no `fallback` slot content is supplied. |\n| `image` | The underlying <img>. |\n\n---\n\n**CSS Custom Properties**\n\n- `--lr-flag-aspect-ratio` (default: `4 / 3`) — Rectangular flag aspect ratio.\n- `--lr-flag-object-fit` (default: `cover`) — How the image fits its flag frame.\n- `--lr-flag-radius` — Rectangular flag corner radius."
+        "value": "`<lr-flag>` — a country/language flag.\n\nFlag images are shipped by the optional peer package `@aceshooting/lyra-flags`,\nnot bundled into lyra-ui itself, so importing the core library pulls zero flag\nweight. Give it a `country` (ISO 3166-1 alpha-2) or a `language` tag (mapped to\na representative country). While that peer package's `flagUrl()` resolves,\nthe host carries `aria-busy=\"true\"`; a decorative skeleton and ordinary, non-live localized\nloading text render in its place. A missing or failed peer resolver fails closed with a localized visible error and a\nshared light-DOM assertive announcement, plus a one-time `console.warn` naming the code and the\n`flag-peer.js` import that registers a resolver -- the visible error alone cannot tell a\ndeveloper that the fix is a missing import rather than missing flag data;\nan installed resolver returning no URL for an unknown code remains a valid\nempty result.\n\n**Bundle-size note:** `country`/`language` resolve through the peer package's\n`flagUrl(code)`, which lazily fetches one requested flag at runtime. A\nbundler may still emit the complete reachable lazy-chunk graph; use a\nliteral asset subpath import when the deployment artifact must be pruned.\nIf every `<lr-flag>` in your app is pinned to the same `fidelity` (no\nper-instance switching), register `@aceshooting/lyra-flags/standard`/`/compact`/`/detailed` with\n`setFlagUrlResolver()` instead of importing `flag-peer.js` (which always registers the full\nthree-tier resolver) — the tier-specific entry excludes the other two tiers' generated loader\nmaps from the reachable graph; see that package's README for the exact shape.\nIf you already\nhave a flag's URL at build time (e.g. from your own literal\n`import frUrl from '@aceshooting/lyra-flags/flags/fr.svg?url'`), pass it as\n`src` instead to skip the peer-package round trip (and its loading-skeleton\nflash) entirely.\n\n**Rendering many flags at once** (a country table, a picker listing every locale): resolve every\ncode up front with `@aceshooting/lyra-flags`'s `flagUrls()` (one call, returns `{code: url}` for\nall 249 flags) and pass results through `src`, instead of letting each `<lr-flag>` instance\nindependently call `flagUrl()` — this skips one peer-resolution round trip per instance. Image\nfetches themselves are unaffected either way (each flag is a distinct asset; there is no sprite).\nOr import `flag-peer-bulk.js` instead of `flag-peer.js` (never both) to get this automatically,\nregistering a resolver backed by one shared `flagUrls()` call — worthwhile only when the page\nrenders most/all flags; a page with a handful pays an unneeded 249-entry fetch.\n\n**Sizing:** the host has no intrinsic `width` — it sizes from `font-size` (`block-size: 1em`,\n`inline-size` derived from `--lr-flag-aspect-ratio` via CSS `aspect-ratio`), so `<lr-flag>` scales\nnaturally with surrounding text (e.g. `style=\"font-size: 2rem\"`). Do not set `width`/`inline-size`\ndirectly: making both axes definite defeats `aspect-ratio` (which only participates when at most\none axis is definite per the CSS sizing spec), squashing the image instead of scaling it.\n\nThe ~65 flags whose design includes a detailed coat of arms/seal/emblem (e.g. `es`, `pt`) ship\nthree fidelity tiers; choose one with `fidelity`: `\"compact\"` (a tiny WebP raster for icon-scale\nuse — menu items, language selectors, dense lists), the default `\"standard\"` (icon-optimized\nvector for card/row sizes), or `\"detailed\"` (the pristine full-detail vector for hero-scale\ndisplay). A no-op for every other code — all tiers resolve to the same file. See `fidelity`'s own\ndoc.\n\n---\n\n**Component metadata**\n\n- Status: `stable`\n- Since: `4.0.0`\n- Rationale: This exact lr-* tag appears in a published Lyra release manifest and remains a supported public contract under semver.\n- Graduation: Already stable; it retains that status while its documented behavior, accessibility, compatibility, and cross-browser support remain part of the public contract.\n\n---\n\n**Slots**\n\n| Name | Description |\n| --- | --- |\n| `fallback` | Rendered in place of the flag when `country`/`language` cannot resolve to a current flag (an unassigned, historical, or malformed code). Wins over the `fallback` property. Distinct from the peer-resolver failure that produces `[part=\"error\"]`: an unresolvable code is data, not a defect. |\n\n---\n\n**CSS Shadow Parts**\n\n| Name | Description |\n| --- | --- |\n| `error` | Ordinary localized visible error rendered when the optional peer resolver is unavailable or fails; each fresh resolution failure appends the same localized message to the shared light-DOM assertive announcement sink. |\n| `fallback-image` | The `fallback` property's placeholder image, when no `fallback` slot content is supplied. |\n| `image` | The underlying <img>. |\n\n---\n\n**CSS Custom Properties**\n\n- `--lr-flag-aspect-ratio` (default: `4 / 3`) — Rectangular flag aspect ratio.\n- `--lr-flag-object-fit` (default: `cover`) — How the image fits its flag frame.\n- `--lr-flag-radius` — Rectangular flag corner radius."
       },
       "attributes": [
         {
@@ -14414,7 +14414,7 @@
       "name": "lr-lite-chart",
       "description": {
         "kind": "markdown",
-        "value": "`<lr-lite-chart>` — a dependency-free bar/line chart, plain SVG/DOM\nrendering with zero peer dependencies (unlike `lr-chart`, which wraps\n`chart.js`). For a project whose architecture forbids a charting\ndependency outright, this covers the common bar/line case: grouped or\nstacked bars, multi-series lines, per-point click, and hover tooltips\n(native SVG `<title>`, no positioning JS needed) — not a full `lr-chart`\nreplacement (no zoom/pan, no pie/doughnut/radar/scatter/bubble types, no\nhorizontal/dual-y-axis, no raw-config passthrough, no interactive legend\ntoggle — unlike `lr-chart`/`lr-box-plot`, clicking a `legend-item` here does\nnot hide its series; the legend is a static color key).\n\nBecause this renders real DOM (not canvas), it reuses `lr-chart`'s\n`--lr-chart-*` theme tokens directly via CSS `var()` — no\n`getComputedStyle()`-based re-theming step is needed the way `chart.ts`\nneeds one for its canvas.\n\nBy default (`layout=\"fit\"`) the plot always squeezes to the measured host\nwidth. Three independent, opt-in escape hatches for dense/aligned data:\n`layout=\"scroll\"` (+ `barWidth`) gives every bar a fixed pixel width and\nlets the plot overflow the host horizontally (scrollable) instead of\nsqueezing; `maxLabels` decimates which x-axis text labels render (bars\nalways still render) once there are more categories than that; and\n`barX` lets a consumer hand in its own per-category x-coordinate function\n— e.g. to pixel-align this chart's bars with a sibling `lr-heatmap`'s\ncalendar columns — overriding the internal slot math for both bars and\ntheir labels. All three are additive and no-ops when left unset.\n\nSeven further additive, opt-in properties: `pointText` overrides the\nper-bar/per-point `<title>` tooltip and accessible-name text (mirrors\n`lr-heatmap`'s `cellText` hook), falling back to the built-in raw-value\ntemplate when unset; `roundedBars` draws bars as a rounded-top path\ninstead of a square-cornered rect; `skipZero` omits a bar entirely (not\njust zero-height) for an exactly-`0` value; `valueAxisGutter`/`barGapRatio`\noverride the internal `PAD_LEFT`/`BAR_GROUP_GAP` layout constants; `scale`\n(`type=\"bar\"` only) switches the bar-height mapping from the default\nlinear `niceDomain` fraction to a `Math.sqrt(value / domainMax)`\ncompression (mirroring `lr-heatmap`'s matrix-mode `sqrt` scale) so a\nskewed dataset's smaller bars don't get washed out by one dominant value\n— gridlines/tick labels stay on the linear domain regardless, only the bar\nmarks' own height changes, and `type=\"line\"` ignores `scale` entirely; and\n`withoutValueAxis` suppresses `renderGrid()`'s gridlines/tick labels altogether\n(x-axis category labels, rendered separately, are unaffected). An eighth,\n`legendText`, appends a formatter-supplied string after each series' label in the\nbuilt-in legend row (e.g. a value or share) — no-op while `legend` is unset, matching the same\nfallback-to-unchanged convention as every other hook here. The built-in multi-series accessible\ntable can independently format its finite numeric cells through `tableCellFormatter`; for a\nstacked bar chart, `tableTotals` adds an opt-in localized total column. Both are no-ops when\nunset.\n\nPublic collection properties take bounded, clone-owned readonly snapshots. Create a new\ncollection and reassign it after changes; mutating the assigned array does not update the view.\n\n---\n\n**Component metadata**\n\n- Status: `stable`\n- Since: `4.0.0`\n- Rationale: This exact lr-* tag appears in a published Lyra release manifest and remains a supported public contract under semver.\n- Graduation: Already stable; it retains that status while its documented behavior, accessibility, compatibility, and cross-browser support remain part of the public contract.\n\n---\n\n**Slots**\n\n| Name | Description |\n| --- | --- |\n| `data-table` | An optional consumer-provided complete/paginated accessible data alternative. |\n\n---\n\n**CSS Shadow Parts**\n\n| Name | Description |\n| --- | --- |\n| `axis-label` | Each axis tick label. |\n| `axis-title` | The x/y axis title text, when set. |\n| `bar` | Each bar rect (type=\"bar\"). Carries `data-selected` and `aria-pressed=\"true\"` when its category index is in `selectedIndices`. While `forced-colors: active` matches, its fill is a per-series SVG texture instead of a flat color, so series that collapse onto the same system color stay distinguishable. |\n| `base` | The host's flex layout wrapper. |\n| `data-list` | A visually hidden sampled list of plotted data points (single-series only). |\n| `data-table` | A visually hidden sampled category×series data table, rendered instead of `data-list` when there is more than one dataset so a screen-reader user hears series grouping rather than one flattened N×M sequence. |\n| `data-truncation` | Explanation shown when built-in marks/data alternatives sample more than 1,000 records. |\n| `description` | The visually hidden accessible chart description, when set. |\n| `grid-line` | Each horizontal gridline. |\n| `legend` | The legend row, when `legend` is set. |\n| `legend-item` | Each legend entry. |\n| `legend-swatch` | Each legend entry's color swatch. While `forced-colors: active` matches, it carries a `data-encoding` attribute selecting the CSS texture that matches its series' plotted encoding. |\n| `legend-text` | Extra per-item text after the series label, rendered only when `legendText` is set. |\n| `line` | Each series' stroked line path (type=\"line\"). While `forced-colors: active` matches, it carries a per-series `stroke-dasharray` for the same reason. |\n| `live-region` | The current mark announcement for keyboard users. |\n| `point` | Each series' per-point keyboard target (type=\"line\"). Carries `data-selected` and explicit `aria-pressed` state. |\n| `table` | The generated semantic table inside the `data-table` container. |\n\n---\n\n**CSS Custom Properties**\n\n- `--lr-chart-color-1` (default: `var(--lr-color-chart-1)`) — First series color.\n- `--lr-chart-color-2` (default: `var(--lr-color-chart-2)`) — Second series color.\n- `--lr-chart-color-3` (default: `var(--lr-color-chart-3)`) — Third series color.\n- `--lr-chart-color-4` (default: `var(--lr-color-chart-4)`) — Fourth series color.\n- `--lr-chart-color-5` (default: `var(--lr-color-chart-5)`) — Fifth series color.\n- `--lr-chart-color-6` (default: `var(--lr-color-chart-6)`) — Sixth series color.\n- `--lr-chart-color-7` (default: `var(--lr-color-chart-7)`) — Seventh series color.\n- `--lr-chart-color-8` (default: `var(--lr-color-chart-8)`) — Eighth series color.\n- `--lr-chart-grid-color` (default: `var(--lr-color-border)`) — Grid-line color.\n- `--lr-chart-height` (default: `var(--lr-size-280px)`) — Consumer-owned chart height. The `height` property supplies only a private fallback, so this public token always wins when set.\n- `--lr-chart-legend-color` (default: `var(--lr-color-text)`) — Legend label color.\n- `--lr-chart-legend-side-max` (default: `var(--lr-size-15rem)`) — Maximum side-legend track size.\n- `--lr-chart-pattern-step` (default: `var(--lr-space-2xs)`) — Tile size of the texture painted on `[part='legend-swatch']` while `forced-colors: active` matches, where the eight-color series ramp collapses onto a repeating system-color cycle and the texture becomes the only channel keeping series apart. Declared on the swatch part rather than the host; the stripe width within a tile stays `--lr-border-width-thin`, so a larger step spaces the stripes further apart. Shared verbatim with `<lr-chart>` and `<lr-box-plot>`.\n- `--lr-chart-tick-color` (default: `var(--lr-color-text-quiet)`) — Axis and legend-detail color.\n- `--lr-lite-chart-selected-outline-color` (default: `var(--lr-color-brand)`) — Stroke for a bar/point whose category index is in `selectedIndices`.\n- `--lr-lite-chart-selected-outline-width` (default: `var(--lr-size-2px)`) — Stroke width for a bar/point whose category index is in `selectedIndices`."
+        "value": "`<lr-lite-chart>` — a dependency-free bar/line chart, plain SVG/DOM\nrendering with zero peer dependencies (unlike `lr-chart`, which wraps\n`chart.js`). For a project whose architecture forbids a charting\ndependency outright, this covers the common bar/line case: grouped or\nstacked bars, multi-series lines, per-point click, and hover tooltips\n(native SVG `<title>`, no positioning JS needed) — not a full `lr-chart`\nreplacement (no zoom/pan, no pie/doughnut/radar/scatter/bubble types, no\nhorizontal/dual-y-axis, no raw-config passthrough, no interactive legend\ntoggle — unlike `lr-chart`/`lr-box-plot`, clicking a `legend-item` here does\nnot hide its series; the legend is a static color key).\n\nBecause this renders real DOM (not canvas), it reuses `lr-chart`'s\n`--lr-chart-*` theme tokens directly via CSS `var()` — no\n`getComputedStyle()`-based re-theming step is needed the way `chart.ts`\nneeds one for its canvas.\n\nBy default (`layout=\"fit\"`) the plot always squeezes to the measured host\nwidth. Three independent, opt-in escape hatches for dense/aligned data:\n`layout=\"scroll\"` (+ `barWidth`) gives every bar a fixed pixel width and\nlets the plot overflow the host horizontally (scrollable) instead of\nsqueezing; `maxLabels` decimates which x-axis text labels render (bars\nalways still render) once there are more categories than that; and\n`barX` lets a consumer hand in its own per-category x-coordinate function\n— e.g. to pixel-align this chart's bars with a sibling `lr-heatmap`'s\ncalendar columns — overriding the internal slot math for both bars and\ntheir labels. All three are additive and no-ops when left unset.\n\nSeven further additive, opt-in properties: `pointText` overrides the\nper-bar/per-point `<title>` tooltip and accessible-name text (mirrors\n`lr-heatmap`'s `cellText` hook), falling back to the built-in raw-value\ntemplate when unset; `roundedBars` draws bars as a rounded-top path\ninstead of a square-cornered rect; `skipZero` omits a bar entirely (not\njust zero-height) for an exactly-`0` value; `valueAxisGutter`/`barGapRatio`\noverride the internal `PAD_LEFT`/`BAR_GROUP_GAP` layout constants; `scale`\n(`type=\"bar\"` only) switches the bar-height mapping from the default\nlinear `niceDomain` fraction to a `Math.sqrt(value / domainMax)`\ncompression (mirroring `lr-heatmap`'s matrix-mode `sqrt` scale) so a\nskewed dataset's smaller bars don't get washed out by one dominant value\n— gridlines/tick labels stay on the linear domain regardless, only the bar\nmarks' own height changes, and `type=\"line\"` ignores `scale` entirely; and\n`withoutValueAxis` suppresses `renderGrid()`'s gridlines/tick labels altogether\n(x-axis category labels, rendered separately, are unaffected). An eighth,\n`legendText`, appends a formatter-supplied string after each series' label in the\nbuilt-in legend row (e.g. a value or share) — no-op while `legend` is unset, matching the same\nfallback-to-unchanged convention as every other hook here. The built-in multi-series accessible\ntable can independently format its finite numeric cells through `tableCellFormatter`; for a\nstacked bar chart, `tableTotals` adds an opt-in localized total column. Both are no-ops when\nunset.\n\nPublic collection properties take bounded, clone-owned readonly snapshots. Create a new\ncollection and reassign it after changes; mutating the assigned array does not update the view.\n\n---\n\n**Component metadata**\n\n- Status: `stable`\n- Since: `4.0.0`\n- Rationale: This exact lr-* tag appears in a published Lyra release manifest and remains a supported public contract under semver.\n- Graduation: Already stable; it retains that status while its documented behavior, accessibility, compatibility, and cross-browser support remain part of the public contract.\n\n---\n\n**Slots**\n\n| Name | Description |\n| --- | --- |\n| `data-table` | An optional consumer-provided complete/paginated accessible data alternative. |\n\n---\n\n**CSS Shadow Parts**\n\n| Name | Description |\n| --- | --- |\n| `axis-label` | Each axis tick label. |\n| `axis-title` | The x/y axis title text, when set. |\n| `bar` | Each bar rect (type=\"bar\"). Carries `data-selected` and `aria-pressed=\"true\"` when its category index is in `selectedIndices`. While `forced-colors: active` matches, its fill is a per-series SVG texture instead of a flat color, so series that collapse onto the same system color stay distinguishable. |\n| `base` | The host's flex layout wrapper. |\n| `data-list` | A visually hidden sampled list of plotted data points (single-series only). |\n| `data-table` | A visually hidden sampled category×series data table, rendered instead of `data-list` when there is more than one dataset so a screen-reader user hears series grouping rather than one flattened N×M sequence. |\n| `data-table-toggle` | The disclosure button rendered by `dataTableToggle`. |\n| `data-truncation` | Explanation shown when built-in marks/data alternatives sample more than 1,000 records. |\n| `description` | The visually hidden accessible chart description, when set. |\n| `grid-line` | Each horizontal gridline. |\n| `legend` | The legend row, when `legend` is set. |\n| `legend-item` | Each legend entry. |\n| `legend-swatch` | Each legend entry's color swatch. While `forced-colors: active` matches, it carries a `data-encoding` attribute selecting the CSS texture that matches its series' plotted encoding. |\n| `legend-text` | Extra per-item text after the series label, rendered only when `legendText` is set. |\n| `line` | Each series' stroked line path (type=\"line\"). While `forced-colors: active` matches, it carries a per-series `stroke-dasharray` for the same reason. |\n| `live-region` | The current mark announcement for keyboard users. |\n| `point` | Each series' per-point keyboard target (type=\"line\"). Carries `data-selected` and explicit `aria-pressed` state. |\n| `table` | The generated semantic table inside the `data-table` container. |\n\n---\n\n**CSS Custom Properties**\n\n- `--lr-chart-color-1` (default: `var(--lr-color-chart-1)`) — First series color.\n- `--lr-chart-color-2` (default: `var(--lr-color-chart-2)`) — Second series color.\n- `--lr-chart-color-3` (default: `var(--lr-color-chart-3)`) — Third series color.\n- `--lr-chart-color-4` (default: `var(--lr-color-chart-4)`) — Fourth series color.\n- `--lr-chart-color-5` (default: `var(--lr-color-chart-5)`) — Fifth series color.\n- `--lr-chart-color-6` (default: `var(--lr-color-chart-6)`) — Sixth series color.\n- `--lr-chart-color-7` (default: `var(--lr-color-chart-7)`) — Seventh series color.\n- `--lr-chart-color-8` (default: `var(--lr-color-chart-8)`) — Eighth series color.\n- `--lr-chart-grid-color` (default: `var(--lr-color-border)`) — Grid-line color.\n- `--lr-chart-height` (default: `var(--lr-size-280px)`) — Consumer-owned chart height. The `height` property supplies only a private fallback, so this public token always wins when set.\n- `--lr-chart-legend-color` (default: `var(--lr-color-text)`) — Legend label color.\n- `--lr-chart-legend-side-max` (default: `var(--lr-size-15rem)`) — Maximum side-legend track size.\n- `--lr-chart-pattern-step` (default: `var(--lr-space-2xs)`) — Tile size of the texture painted on `[part='legend-swatch']` while `forced-colors: active` matches, where the eight-color series ramp collapses onto a repeating system-color cycle and the texture becomes the only channel keeping series apart. Declared on the swatch part rather than the host; the stripe width within a tile stays `--lr-border-width-thin`, so a larger step spaces the stripes further apart. Shared verbatim with `<lr-chart>` and `<lr-box-plot>`.\n- `--lr-chart-tick-color` (default: `var(--lr-color-text-quiet)`) — Axis and legend-detail color.\n- `--lr-lite-chart-data-table-toggle-active-bg` — Pressed background of the `dataTableToggle` disclosure button; defaults to a mix of the hover background with the shared active mix partner.\n- `--lr-lite-chart-data-table-toggle-hover-bg` (default: `var(--lr-color-brand-quiet)`) — Hover background of the `dataTableToggle` disclosure button.\n- `--lr-lite-chart-selected-outline-color` (default: `var(--lr-color-brand)`) — Stroke for a bar/point whose category index is in `selectedIndices`.\n- `--lr-lite-chart-selected-outline-width` (default: `var(--lr-size-2px)`) — Stroke width for a bar/point whose category index is in `selectedIndices`."
       },
       "attributes": [
         {
@@ -14445,6 +14445,13 @@
             "value": "Type: `boolean`  \nDefault: `true`"
           }
         },
+        {
+          "name": "data-table-toggle",
+          "description": {
+            "kind": "markdown",
+            "value": "Render a disclosure button above the accessible data table so a sighted reader can reveal the\nnumbers on demand, turning `showDataTable` into the disclosure's INITIAL state rather than its\nwhole behavior. The table stays in the DOM in both states, so assistive technology never loses\nit.\n\nMatters more here than on `<lr-chart>`: this component exists to avoid the Chart.js peers, so\nwithout it an app that chose it for that reason had to either hand-roll a `<details>` around a\nduplicated table or adopt `<lr-chart>` and pull in Chart.js for a button — the cheap component\nstuck with the expensive workaround.\n\nType: `boolean`  \nDefault: `false`"
+          }
+        },
         {
           "name": "description",
           "description": {
@@ -14555,6 +14562,13 @@
             }
           ]
         },
+        {
+          "name": "show-data-table",
+          "description": {
+            "kind": "markdown",
+            "value": "Makes the generated data table visible; it stays screen-reader available when false. Same\nmeaning as `<lr-chart>`'s property of the same name.\n\nType: `boolean`  \nDefault: `false`"
+          }
+        },
         {
           "name": "skip-zero",
           "description": {