@aceshooting/lyra-ui 14.1.1 → 14.3.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (78) hide show
  1. package/CHANGELOG.md +42 -0
  2. package/custom-elements.json +1 -1
  3. package/design-tokens.json +1 -1
  4. package/dist/cli/migration-contract.json +1 -1
  5. package/dist/components/charts/chart/chart-legend-visibility.d.ts +8 -0
  6. package/dist/components/charts/chart/chart.class.d.ts +64 -15
  7. package/dist/components/charts/chart/chart.class.js +10 -10
  8. package/dist/components/data/heatmap/heatmap.class.d.ts +44 -6
  9. package/dist/components/data/heatmap/heatmap.class.js +8 -2
  10. package/dist/components/data/heatmap/heatmap.styles.js +1 -1
  11. package/dist/components/data/table/table.class.d.ts +9 -1
  12. package/dist/components/data/table/table.class.js +4 -3
  13. package/dist/components/data/table/table.styles.js +1 -1
  14. package/dist/components/forms/button/button.class.d.ts +8 -2
  15. package/dist/components/forms/button/button.class.js +6 -2
  16. package/dist/components/forms/checkbox/checkbox.styles.js +1 -1
  17. package/dist/components/forms/date-picker/date-input.class.d.ts +7 -8
  18. package/dist/components/forms/date-picker/date-input.styles.js +1 -1
  19. package/dist/components/forms/locale-picker/locale-picker.class.d.ts +12 -2
  20. package/dist/components/forms/locale-picker/locale-picker.class.js +7 -6
  21. package/dist/components/forms/locale-picker/locale-picker.styles.js +1 -1
  22. package/dist/components/forms/slider/slider.class.d.ts +21 -5
  23. package/dist/components/forms/slider/slider.class.js +6 -5
  24. package/dist/components/forms/slider/slider.styles.js +1 -1
  25. package/dist/components/media/map/map-loader.d.ts +3 -1
  26. package/dist/components/media/map/map.class.d.ts +86 -6
  27. package/dist/components/media/map/map.class.js +1 -1
  28. package/dist/components/media/map/map.styles.js +1 -1
  29. package/dist/custom-elements-jsx.d.ts +1 -1
  30. package/dist/events.d.ts +21 -5
  31. package/dist/internal/default-strings.generated.d.ts +1 -1
  32. package/dist/internal/default-strings.generated.js +1 -1
  33. package/dist/internal/icons.d.ts +2 -0
  34. package/dist/internal/icons.js +2 -2
  35. package/dist/internal/localization-types.d.ts +1 -1
  36. package/dist/internal/localization.js +1 -1
  37. package/dist/internal/package-metadata.d.ts +1 -1
  38. package/dist/internal/package-metadata.js +1 -1
  39. package/dist/lyra.d.ts +1 -1
  40. package/dist/svelte.d.ts +1 -1
  41. package/dist/translations/ar.js +1 -1
  42. package/dist/translations/de.js +1 -1
  43. package/dist/translations/es.js +1 -1
  44. package/dist/translations/fa.js +1 -1
  45. package/dist/translations/fr.js +1 -1
  46. package/dist/translations/he.js +1 -1
  47. package/dist/translations/ja.js +1 -1
  48. package/dist/translations/pt-BR.js +1 -1
  49. package/dist/translations/ru.js +1 -1
  50. package/dist/translations/zh-CN.js +1 -1
  51. package/dist/vue.d.ts +1 -1
  52. package/llms/components/lr-accordion-item.md +36 -0
  53. package/llms/components/lr-accordion.md +36 -0
  54. package/llms/components/lr-bar-chart.md +5 -2
  55. package/llms/components/lr-bubble-chart.md +5 -2
  56. package/llms/components/lr-button.md +5 -0
  57. package/llms/components/lr-chart.md +67 -3
  58. package/llms/components/lr-checkbox.md +3 -1
  59. package/llms/components/lr-date-input.md +19 -33
  60. package/llms/components/lr-date-picker.md +19 -33
  61. package/llms/components/lr-details.md +36 -0
  62. package/llms/components/lr-doughnut-chart.md +5 -2
  63. package/llms/components/lr-heatmap.md +63 -4
  64. package/llms/components/lr-histogram.md +7 -3
  65. package/llms/components/lr-line-chart.md +5 -2
  66. package/llms/components/lr-locale-picker.md +16 -2
  67. package/llms/components/lr-map.md +131 -4
  68. package/llms/components/lr-pie-chart.md +5 -2
  69. package/llms/components/lr-polar-area-chart.md +5 -2
  70. package/llms/components/lr-radar-chart.md +5 -2
  71. package/llms/components/lr-scatter-chart.md +5 -2
  72. package/llms/components/lr-slider.md +20 -4
  73. package/llms/components/lr-table.md +10 -4
  74. package/llms-full.txt +439 -56
  75. package/package.json +3 -3
  76. package/vscode-css-data.json +1 -1
  77. package/vscode-html-data.json +1 -1
  78. package/web-types.json +1 -1
@@ -9,7 +9,7 @@
9
9
  - **Release history** [CHANGELOG.md](../../CHANGELOG.md); family-wide breaking-change summaries: [llms-full.txt](../../llms-full.txt)
10
10
  - **Deprecations** none
11
11
  - **Optional peers** none
12
- - **Themeable via** 12 parts, 16 custom properties — see this component's own `@csspart`/`@cssprop` list below
12
+ - **Themeable via** 13 parts, 16 custom properties — see this component's own `@csspart`/`@cssprop` list below
13
13
  - **Library-wide behavior** (events, form association, `locale`/`strings`, tokens, TS types): `llms/shared.md`
14
14
 
15
15
  ---
@@ -49,6 +49,14 @@ readonly LyraLocaleEntry[]`, `LyraLocaleEntry { tag: string; label?: string; cou
49
49
  - `showFlags: boolean = true` — each row's leading `<lr-flag language={tag} variant="compact">`
50
50
  (or `<lr-flag country={country} variant="compact">` when the entry sets `country`); `false`
51
51
  omits the flag element entirely (not just visually).
52
+ - `triggerDisplay: LyraLocaleTriggerDisplay = 'flag-label'` (attribute `trigger-display`) —
53
+ `'flag' | 'label' | 'flag-label'`. The default keeps the flag, label and chevron. `label`
54
+ omits only the trigger flag; the menu keeps its flags and endonyms. `flag` centers the flag in
55
+ a square and hides the visible label and chevron. The `trigger-label` remains available to
56
+ assistive technology and describes the trigger's current language; its accessible name still
57
+ follows `label`/the host `aria-label`. The square uses the shared/scoped trigger height with a
58
+ 24px floor. `showFlags=false` retains visible text in every mode. Selection, keyboard navigation,
59
+ form values and the uncommitted effective-locale preview keep their usual behavior.
52
60
  - `value: string = ''` — the **committed** selection (form value, drives `lr-change`). While `''`
53
61
  and untouched, the trigger _displays_ `effectiveLocale` as a preview label, but
54
62
  `checkValidity()`/`required` are governed by the real `value`, which stays `''` until a real
@@ -112,7 +120,8 @@ priority until cleared.
112
120
 
113
121
  **CSS parts:** `form-control`, `form-control-label`, `trigger`,
114
122
  `trigger-flag` (the trigger's leading `<lr-flag>` for the current value, present only while
115
- `showFlags` is on), `listbox`, `option`, `option-flag` (present only while `showFlags` is on),
123
+ `showFlags` is on and `triggerDisplay` is not `label`), `trigger-label` (the current language,
124
+ visually hidden in flag-only mode), `listbox`, `option`, `option-flag` (present only while `showFlags` is on),
116
125
  `option-label`, `option-tag` (the row's secondary line — the raw BCP-47 tag), `expand-icon`,
117
126
  `hint`, `error`.
118
127
 
@@ -137,6 +146,11 @@ quiet-brand, and semibold semantic tokens.
137
146
  peer warning duplication; `lr-flag` itself already logs one) when the optional
138
147
  `@aceshooting/lyra-flags` package isn't installed and `showFlags` is left on.
139
148
 
149
+ A compact header can set `trigger-display="flag"` and
150
+ `--lr-locale-picker-trigger-height: 2.25rem` for a 36px square at the usual 16px root size.
151
+ Import `@aceshooting/lyra-ui/components/media/flag/flag-peer.js` to register the optional flag
152
+ resolver. Menu labels stay visible; a per-entry `country` override also reaches the compact trigger.
153
+
140
154
  ```html
141
155
  <lr-locale-picker label="Language"></lr-locale-picker>
142
156
  <script type="module">
@@ -9,7 +9,7 @@
9
9
  - **Release history** [CHANGELOG.md](../../CHANGELOG.md); family-wide breaking-change summaries: [llms-full.txt](../../llms-full.txt)
10
10
  - **Deprecations** none
11
11
  - **Optional peers** `maplibre-gl` — see `llms/peers.md`
12
- - **Themeable via** 15 parts, 6 custom properties — see this component's own `@csspart`/`@cssprop` list below
12
+ - **Themeable via** 20 parts, 6 custom properties — see this component's own `@csspart`/`@cssprop` list below
13
13
  - **Library-wide behavior** (events, form association, `locale`/`strings`, tokens, TS types): `llms/shared.md`
14
14
 
15
15
  ---
@@ -127,7 +127,8 @@ string; geojson: GeoJSON.FeatureCollection; field: string; stops: [number, strin
127
127
  - `dataLayers: LyraMapGeoJsonDataLayer[] = []` (attribute: false) —
128
128
  `LyraMapGeoJsonDataLayer { sourceId: string; geojson: GeoJSON.Feature |
129
129
  GeoJSON.FeatureCollection; tone?: 'accent' | 'success' | 'warning' |
130
- 'danger' | 'neutral'; color?: string; strokeColor?: string; kind?: LyraMapDataLayerKind;
130
+ 'danger' | 'neutral'; color?: string; strokeColor?: string; line?: LyraMapLineOptions;
131
+ point?: LyraMapPointOptions; kind?: LyraMapDataLayerKind;
131
132
  heatmap?: LyraMapHeatmapOptions; cluster?: LyraMapClusterOptions }`. `sourceId` is trimmed and must be nonempty; the first layer for a
132
133
  `sourceId` that is successfully admitted wins; blank, malformed, and later duplicate records are
133
134
  ignored without reserving an identity for a valid later sibling. Each retained entry adds one
@@ -212,6 +213,104 @@ intensity?: LyraMapHeatmapZoomValue; opacity?: number }`, where `LyraMapHeatmapZ
212
213
  peer's default untouched on construction, and dropping a previously-authored value restores 1.
213
214
  `cluster` is ignored on a heatmap entry: a heatmap already aggregates density, and clustering its
214
215
  input would feed it one point per cluster instead of the real distribution.
216
+ `line?: LyraMapLineOptions { field?: string; stops?: readonly (readonly [number, string])[];
217
+ width?: number; opacity?: number }` configures line/outline paint for an ordinary `dataLayers`
218
+ entry. `field` names a numeric feature property; two usable `[value, color]` stops produce a
219
+ continuous linear ramp. Missing, null, and non-numeric feature values use `strokeColor`, then
220
+ `color`, then `tone`. Stops inspect the first 64 entries, discard non-finite values and invalid
221
+ CSS colors, sort ascending, and retain the first duplicate threshold. Fewer than two stops or
222
+ an absent field preserves flat color. Values beyond the endpoints clamp to their endpoint color.
223
+ CSS variables resolve on the host during reconciliation and retheming. `width` defaults to 2 CSS
224
+ pixels and clamps to `[0, 200]`; `opacity` defaults to 1 and clamps to `[0, 1]`. Non-finite values
225
+ restore those defaults, as does dropping a previously-authored option. Point colors and polygon
226
+ fills are unaffected; cluster and heatmap entries ignore `line`.
227
+
228
+ `point?: LyraMapPointOptions` styles individual points on ordinary and clustered auto entries.
229
+ It is ignored for heatmaps. `field` names a **string** feature property; `colors` maps exact
230
+ `[category, CSS color]` pairs. Missing, unknown and non-string categories use the existing
231
+ `strokeColor`/`color`/`tone` fallback. The first 32 pairs are inspected and valid duplicates are
232
+ first-wins. CSS variables resolve on the host and follow ancestor theme changes. `radius`
233
+ defaults to 5 CSS pixels and `strokeWidth` to 0; both clamp to `[0, 200]`. `strokeColor` overrides
234
+ the outline only, with the layer's flat color as fallback. Dropping options restores defaults.
235
+
236
+ `radius` also accepts `LyraMapPointRadiusOptions { field, stops, interpolation?, fallback? }`
237
+ for **numeric** feature-driven sizes. `field` is independent of the category field. The first 32
238
+ pairs are inspected and finite `[value, radius]` pairs are sorted ascending; duplicate thresholds are first-wins and
239
+ radii clamp to `[0, 200]`. `interpolation` defaults to `'step'`: below the first threshold use
240
+ its radius, and each threshold is inclusive. `'linear'` interpolates between adjacent stops and
241
+ clamps outside the domain. One usable stop is a constant for numeric features. Missing, null,
242
+ non-numeric and non-finite feature values use `fallback` (default 5, clamped to `[0, 200]`), as
243
+ do an empty field, unusable stops or a linear domain that cannot retain distinct finite intervals.
244
+ Invalid interpolation values use step. These options style individual/unclustered points;
245
+ cluster-count radii remain independent. Switching back to a number or removing the radius
246
+ scale restores the fixed radius without recreating the source.
247
+
248
+ `point.icons` maps exact category values to `LyraMapPointIcon { value: string; path: string;
249
+ viewBox?: readonly [number, number, number, number]; mode?: LyraMapPointIconMode;
250
+ strokeWidth?: number; lineCap?: LyraMapPointIconLineCap; lineJoin?: LyraMapPointIconLineJoin }`.
251
+ `iconField` defaults to `field`. Each icon is **SVG path data**, not SVG markup or a URL. Copy an icon's path data,
252
+ combine filled subpaths in that string, and supply its `[minX, minY, width, height]` viewBox
253
+ (default `[0, 0, 24, 24]`). `mode` defaults to `'fill'`; `'stroke'` draws open outline paths,
254
+ and `'fill-stroke'` paints both. `strokeWidth` uses **viewBox units** (default 2, clamped to
255
+ `[0, 200]`; zero omits the stroke), so it scales with the icon. `lineCap` accepts `'butt'`,
256
+ `'round'`, or `'square'`; `lineJoin` accepts `'miter'`, `'round'`, or `'bevel'`. Both default
257
+ to round; miter joins retain a limit of 10. Invalid modes/caps/joins restore their defaults,
258
+ and a non-finite stroke width restores 2. Keep padding inside the viewBox for strokes at its
259
+ edges, which are clipped to the fixed atlas square. These are icon-path options;
260
+ `point.strokeWidth` and `point.strokeColor` continue to style the surrounding circle only.
261
+ The first 32 entries are inspected, valid duplicates are first-wins, path data is capped at
262
+ 8192 characters, and viewBox coordinates must be finite within ±10000 with dimensions at least
263
+ 0.001. Invalid paths are ignored; markup, external references and event handlers cannot execute.
264
+ Rasterization is synchronous and local, with no fetch or HTML/SVG document insertion.
265
+ `iconColor` supplies both fill and stroke ink, accepts CSS variables and defaults to the tone's contrasting foreground; `iconSize`
266
+ is the displayed bounding square in CSS pixels (default 16, clamped to `[1, 200]`). The fixed
267
+ 64px raster preserves the viewBox aspect ratio. Unknown categories, invalid icons and partial
268
+ peers lacking image-atlas methods retain their colored circles. No sprite or glyph URL is needed.
269
+
270
+ All categories use the **same GeoJSON source** and cluster across categories. Cluster circles
271
+ keep the existing count-based styling; only unclustered points get category colors/icons.
272
+ An optional symbol layer and at most 32 images are allocated per configured source, with no
273
+ per-feature DOM markers. Data changes reuse the source, retheming updates paint/icon pixels,
274
+ and style reloads restore the owned resources. Removing the entry or icons releases its images.
275
+ `lr-map-click` on either a point's circle or icon returns `origin: 'data-layer'`, the public
276
+ `sourceId`, and the rendered feature. For clustered GeoJSON, use numeric feature IDs and keep
277
+ string business IDs in feature properties, as MapLibre's cluster tiling uses numeric IDs. Canvas export includes both; supply an accessible textual
278
+ legend/list for category interpretation and individual keyboard actions.
279
+
280
+ ```js
281
+ import '@aceshooting/lyra-ui/components/lr-map.js';
282
+ map.dataLayers = [{
283
+ sourceId: 'places', geojson: locations, cluster: {},
284
+ point: {
285
+ field: 'category',
286
+ radius: { field: 'visits', stops: [[0, 10], [10, 12], [50, 14], [100, 16]], fallback: 10 },
287
+ strokeWidth: 1,
288
+ colors: [['home', 'var(--lr-color-brand)'], ['work', 'var(--lr-color-success)']],
289
+ icons: [
290
+ { value: 'home', path: 'M2 12L12 2L22 12V22H2Z' },
291
+ { value: 'work', path: 'M8 6V3H16V6M3 6H21V21H3ZM3 11H21',
292
+ mode: 'stroke', strokeWidth: 1.75, lineCap: 'round', lineJoin: 'round' },
293
+ ],
294
+ iconSize: 14,
295
+ },
296
+ }];
297
+ ```
298
+
299
+ Share the same stops with `legendGradient` and set its endpoint labels for units. A gradient
300
+ matching a line ramp remains linear even alongside a logarithmic choropleth. Changing metric,
301
+ filtered GeoJSON, width or opacity reconciles existing resources; style reloads restore the layer.
302
+ Lines remain in MapLibre's canvas and can be captured with the map's normal render-event PNG
303
+ export flow.
304
+
305
+ ```js
306
+ mapElement.dataLayers = [{
307
+ sourceId: 'routes', geojson: routes,
308
+ line: { field: 'kmh', stops: speedStops, width: 4, opacity: 0.9 }
309
+ }];
310
+ mapElement.legendGradient = speedStops;
311
+ mapElement.legendGradientLoLabel = '0 km/h';
312
+ mapElement.legendGradientHiLabel = '100 km/h';
313
+ ```
215
314
  - `maxBounds: LyraMapBounds | null = null` (attribute: false) — box the map may not pan outside,
216
315
  `[[west, south], [east, north]]`. Prefer it over calling `map.setMaxBounds()` through the `.map`
217
316
  escape hatch: constraining the camera can wedge maplibre-gl at a sub-1 fractional zoom in a wide
@@ -254,7 +353,9 @@ payload beside the map.
254
353
 
255
354
  **Authoring types:** `LyraMapLegendEntry`, `LyraMapLegendPattern`, `LyraMapLegendProjection`, `LyraMapChoroplethLayer`,
256
355
  `LyraMapGeoJsonDataLayer`, `LyraMapDataLayerKind`, `LyraMapClusterOptions`, `LyraMapHeatmapOptions`,
257
- `LyraMapHeatmapZoomValue`, `LyraMapMarker`, `LyraMapMarkerActivationDetail`,
356
+ `LyraMapHeatmapZoomValue`, `LyraMapLineOptions`, `LyraMapPointOptions`, `LyraMapPointRadiusOptions`,
357
+ `LyraMapPointRadiusInterpolation`, `LyraMapPointIcon`, `LyraMapPointIconMode`,
358
+ `LyraMapPointIconLineCap`, `LyraMapPointIconLineJoin`, `LyraMapMarker`, `LyraMapMarkerActivationDetail`,
258
359
  `LyraMapMarkerActivationSource`, `LyraMapStyleSpecification`, and `LyraMapInstance`.
259
360
  The former `LegendEntry`, `ChoroplethLayer`, `GeoJsonDataLayer`, and `MapMarker` names are removed
260
361
  in v9 rather than retained as aliases.
@@ -297,7 +398,18 @@ when `legend` and `legendGradient` are both empty.
297
398
 
298
399
  **CSS parts:** `base`, `container`, `legend`, `legend-swatch`, `legend-gradient`, `legend-lo`,
299
400
  `legend-hi`, `legend-limit`, `marker`, `popup`,
300
- `popup-content`, `popup-close-button`, `attribution`, `attribution-toggle`, `error`.
401
+ `popup-content`, `popup-close-button`, `attribution`, `attribution-toggle`, `navigation`,
402
+ `zoom-in`, `zoom-out`, `compass`, `scale`, `error`.
403
+ The compact attribution summary has a decorative, current-color information glyph and retains
404
+ MapLibre's accessible name, keyboard/touch disclosure behavior and attribution links. To make
405
+ only this control compact, scope the shared target-size token to its public wrapper:
406
+
407
+ ```css
408
+ lr-map::part(attribution) { --lr-icon-button-size: var(--lr-size-24px); }
409
+ ```
410
+
411
+ Keep that target at least 24px in both axes. This leaves navigation controls at their existing size.
412
+
301
413
  `legend` is a localized `role="group"` containing a real list associated to the map canvas with
302
414
  `aria-describedby`; each entry is a `listitem`, decorative swatches are inert/accessibility-hidden,
303
415
  and the overlay is bounded to the map allocation with scrolling and long-label wrapping.
@@ -310,6 +422,21 @@ peer unavailable, owner-realm WebGL2 unavailable, or initialization failed. A po
310
422
  appended to the document's pre-mounted `[data-lr-live-region="assertive"]` sink rather than making
311
423
  shadow chrome live; raw caught errors are never exposed.
312
424
 
425
+ **Standard peer controls:** after `lr-map-load`, narrow `.map` to the installed MapLibre peer
426
+ and use `addControl(new NavigationControl(), 'bottom-right')` and
427
+ `addControl(new ScaleControl({ unit: 'metric' }), 'bottom-left')`. No document-level peer CSS or
428
+ shadow-root modification is needed: navigation buttons, compass glyph, scale bar and control
429
+ corners are styled with Lyra tokens. The corners follow inline start/end under RTL. The legend
430
+ reserves vertical room for these controls and attribution, including after resize or removal.
431
+ Attribution also reserves legend space when it is the only control. Opposing occupied corners
432
+ share the available width, so expanded attribution wraps without covering a scale or navigation
433
+ control on the other side; controls stay aligned to their logical edge in both text directions.
434
+ Navigation exposes `navigation`, `zoom-in`, `zoom-out`, and `compass` parts; the scale exposes `scale`.
435
+ Button names update through `zoomIn`, `zoomOut`, and `mapResetNorth` locale strings. MapLibre retains
436
+ keyboard activation, compass rotation, zoom limits, scale units and viewport updates. No controls
437
+ are created until the application explicitly adds them. This is a supported imperative peer-control
438
+ integration; there is no declarative controls property.
439
+
313
440
  **Themeable custom properties:**
314
441
 
315
442
  - `--lr-map-height` (default `var(--lr-size-24rem)`) — host block size, shared with the optional
@@ -25,8 +25,9 @@ Everything else is inherited verbatim from `lr-chart`; each name below has the s
25
25
  and behavior there. **See `llms/components/lr-chart.md` for the details, code example, and gotchas
26
26
  of every entry in these lists.**
27
27
 
28
- **Properties:** `description`, `grid`, `indexAxis` (`index-axis`), `label`, `hiddenDatasets`, `legendPosition`
29
- (`legend-position`), `max`, `min`, `plugins`, `scaleType` (`scale-type`), `annotations`,
28
+ **Properties:** `description`, `grid`, `axes`, `compact`, `indexAxis` (`index-axis`), `label`, `hiddenDatasets`, `legendPosition`
29
+ (`legend-position`), `hiddenDatums`, `legendMode` (`legend-mode`), `legendDisplay` (`legend-display`),
30
+ `max`, `min`, `plugins`, `scaleType` (`scale-type`), `annotations`,
30
31
  `stacked`, `withoutAnimation` (`without-animation`),
31
32
  `withoutLegend` (`without-legend`), `withoutTooltip` (`without-tooltip`), `xLabel` (`x-label`),
32
33
  `yLabel` (`y-label`), plus additive `labels`, `datasets`, `valueFormatter`, `formatter`, `area`, `zoom`,
@@ -42,6 +43,8 @@ of every entry in these lists.**
42
43
  index, label, value }`), `lr-before-legend-visibility-change` (cancelable), and
43
44
  `lr-legend-visibility-change` (commit; both legend events carry `datasetIndex`, `visible`, and the
44
45
  complete `hiddenDatasets` snapshot).
46
+ Radial category legends additionally emit `lr-before-datum-visibility-change` (cancelable) and
47
+ `lr-datum-visibility-change`, carrying `index`, `visible` and the frozen `hiddenDatums` snapshot.
45
48
 
46
49
  **Slots:** default JSON configuration script, `data-table`, `center`.
47
50
 
@@ -25,8 +25,9 @@ Everything else is inherited verbatim from `lr-chart`; each name below has the s
25
25
  and behavior there. **See `llms/components/lr-chart.md` for the details, code example, and gotchas
26
26
  of every entry in these lists.**
27
27
 
28
- **Properties:** `description`, `grid`, `indexAxis` (`index-axis`), `label`, `hiddenDatasets`, `legendPosition`
29
- (`legend-position`), `max`, `min`, `plugins`, `scaleType` (`scale-type`), `annotations`,
28
+ **Properties:** `description`, `grid`, `axes`, `compact`, `indexAxis` (`index-axis`), `label`, `hiddenDatasets`, `legendPosition`
29
+ (`legend-position`), `hiddenDatums`, `legendMode` (`legend-mode`), `legendDisplay` (`legend-display`),
30
+ `max`, `min`, `plugins`, `scaleType` (`scale-type`), `annotations`,
30
31
  `stacked`, `withoutAnimation` (`without-animation`),
31
32
  `withoutLegend` (`without-legend`), `withoutTooltip` (`without-tooltip`), `xLabel` (`x-label`),
32
33
  `yLabel` (`y-label`), plus additive `labels`, `datasets`, `valueFormatter`, `formatter`, `area`, `zoom`,
@@ -42,6 +43,8 @@ of every entry in these lists.**
42
43
  index, label, value }`), `lr-before-legend-visibility-change` (cancelable), and
43
44
  `lr-legend-visibility-change` (commit; both legend events carry `datasetIndex`, `visible`, and the
44
45
  complete `hiddenDatasets` snapshot).
46
+ Radial category legends additionally emit `lr-before-datum-visibility-change` (cancelable) and
47
+ `lr-datum-visibility-change`, carrying `index`, `visible` and the frozen `hiddenDatums` snapshot.
45
48
 
46
49
  **Slots:** default JSON configuration script, `data-table`, `center`.
47
50
 
@@ -25,8 +25,9 @@ Everything else is inherited verbatim from `lr-chart`; each name below has the s
25
25
  and behavior there. **See `llms/components/lr-chart.md` for the details, code example, and gotchas
26
26
  of every entry in these lists.**
27
27
 
28
- **Properties:** `description`, `grid`, `indexAxis` (`index-axis`), `label`, `hiddenDatasets`, `legendPosition`
29
- (`legend-position`), `max`, `min`, `plugins`, `scaleType` (`scale-type`), `annotations`,
28
+ **Properties:** `description`, `grid`, `axes`, `compact`, `indexAxis` (`index-axis`), `label`, `hiddenDatasets`, `legendPosition`
29
+ (`legend-position`), `hiddenDatums`, `legendMode` (`legend-mode`), `legendDisplay` (`legend-display`),
30
+ `max`, `min`, `plugins`, `scaleType` (`scale-type`), `annotations`,
30
31
  `stacked`, `withoutAnimation` (`without-animation`),
31
32
  `withoutLegend` (`without-legend`), `withoutTooltip` (`without-tooltip`), `xLabel` (`x-label`),
32
33
  `yLabel` (`y-label`), plus additive `labels`, `datasets`, `valueFormatter`, `formatter`, `area`, `zoom`,
@@ -42,6 +43,8 @@ of every entry in these lists.**
42
43
  index, label, value }`), `lr-before-legend-visibility-change` (cancelable), and
43
44
  `lr-legend-visibility-change` (commit; both legend events carry `datasetIndex`, `visible`, and the
44
45
  complete `hiddenDatasets` snapshot).
46
+ Radial category legends additionally emit `lr-before-datum-visibility-change` (cancelable) and
47
+ `lr-datum-visibility-change`, carrying `index`, `visible` and the frozen `hiddenDatums` snapshot.
45
48
 
46
49
  **Slots:** default JSON configuration script, `data-table`, `center`.
47
50
 
@@ -25,8 +25,9 @@ Everything else is inherited verbatim from `lr-chart`; each name below has the s
25
25
  and behavior there. **See `llms/components/lr-chart.md` for the details, code example, and gotchas
26
26
  of every entry in these lists.**
27
27
 
28
- **Properties:** `description`, `grid`, `indexAxis` (`index-axis`), `label`, `hiddenDatasets`, `legendPosition`
29
- (`legend-position`), `max`, `min`, `plugins`, `scaleType` (`scale-type`), `annotations`,
28
+ **Properties:** `description`, `grid`, `axes`, `compact`, `indexAxis` (`index-axis`), `label`, `hiddenDatasets`, `legendPosition`
29
+ (`legend-position`), `hiddenDatums`, `legendMode` (`legend-mode`), `legendDisplay` (`legend-display`),
30
+ `max`, `min`, `plugins`, `scaleType` (`scale-type`), `annotations`,
30
31
  `stacked`, `withoutAnimation` (`without-animation`),
31
32
  `withoutLegend` (`without-legend`), `withoutTooltip` (`without-tooltip`), `xLabel` (`x-label`),
32
33
  `yLabel` (`y-label`), plus additive `labels`, `datasets`, `valueFormatter`, `formatter`, `area`, `zoom`,
@@ -42,6 +43,8 @@ of every entry in these lists.**
42
43
  index, label, value }`), `lr-before-legend-visibility-change` (cancelable), and
43
44
  `lr-legend-visibility-change` (commit; both legend events carry `datasetIndex`, `visible`, and the
44
45
  complete `hiddenDatasets` snapshot).
46
+ Radial category legends additionally emit `lr-before-datum-visibility-change` (cancelable) and
47
+ `lr-datum-visibility-change`, carrying `index`, `visible` and the frozen `hiddenDatums` snapshot.
45
48
 
46
49
  **Slots:** default JSON configuration script, `data-table`, `center`.
47
50
 
@@ -9,7 +9,7 @@
9
9
  - **Release history** [CHANGELOG.md](../../CHANGELOG.md); family-wide breaking-change summaries: [llms-full.txt](../../llms-full.txt)
10
10
  - **Deprecations** none
11
11
  - **Optional peers** none
12
- - **Themeable via** 25 parts, 24 custom properties — see this component's own `@csspart`/`@cssprop` list below
12
+ - **Themeable via** 26 parts, 24 custom properties — see this component's own `@csspart`/`@cssprop` list below
13
13
  - **Library-wide behavior** (events, form association, `locale`/`strings`, tokens, TS types): `llms/shared.md`
14
14
 
15
15
  ---
@@ -113,6 +113,15 @@ single numeric string entry.
113
113
  - `showValue: boolean = false` (attribute `show-value`) — opt-in numeric readout next to the track;
114
114
  a range readout joins both values with an en dash. The explicit HTML spelling
115
115
  `show-value="false"` stays false.
116
+ - `valueDisplay: SliderValueDisplay = 'numeric'` (attribute `value-display`) — `'numeric' |
117
+ 'formatted'`. Opt into `formatted` to reuse `valueFormatter` (or `tooltipFormatter` when no
118
+ value formatter is supplied) for the visible readout too. Each range handle is formatted
119
+ separately; nullish results fall back to localized numbers. Existing ARIA and tooltip behavior
120
+ is unchanged. The callback owns its unit labels and locale formatting.
121
+ - `valuePlacement: SliderValuePlacement = 'inline'` (attribute `value-placement`) — `'inline' |
122
+ 'label'`. With `showValue`, `label` places the readout opposite the label in a wrapping row that
123
+ follows RTL. The readout stays outside the accessible label. These presentation options update
124
+ on live `lr-input` changes without changing the commit-only `lr-change` contract.
116
125
  - `value: number = 0`, `defaultValue: number = 0` (attribute `value`), `valueAsNumber: number`, and
117
126
  `valueAsString: string` are synchronized and finite. Values normalize the low/high domain, snap
118
127
  to the grid anchored at the low endpoint, then clamp so a non-grid endpoint remains reachable;
@@ -165,7 +174,8 @@ live value bubble per handle, present only with `with-tooltip`), `tooltip-visibl
165
174
  `tooltip` element's part list_ while that handle is focused or dragged — visibility is encoded in
166
175
  the part name because `::part(tooltip)[data-visible]` is invalid CSS and never matches; write
167
176
  `::part(tooltip-visible)`). The tooltip also exposes `tooltip__tooltip`, `tooltip__content`, and
168
- `tooltip__arrow`. `value` is the opt-in numeric readout.
177
+ `tooltip__arrow`. `value` is the opt-in readout; `label-row` contains the separate label and value
178
+ nodes when `showValue` and `valuePlacement="label"` are enabled.
169
179
 
170
180
  **CSS custom states:** `disabled`, `dragging`, `focused`, `required`, `optional`, `valid`,
171
181
  `invalid`, `user-valid`, and `user-invalid`. A slider always has a finite numeric value, so
@@ -270,8 +280,14 @@ is present for upstream form-surface parity but adds no missing-value constraint
270
280
  value); ArrowUp/ArrowDown are never swapped, since direction only affects the horizontal inline axis.
271
281
  - Changing `min`/`max`/`step` after mount automatically re-clamps/re-snaps the current `value` in the
272
282
  next update — narrowing the domain can silently move the slider's value.
273
- - `valueFormatter` is presentation-only: `aria-valuenow`, the visible numeric readout, geometry,
274
- form value, and emitted values stay numeric. With no formatter, `aria-valuetext` remains the
283
+ - `valueFormatter` is presentation-only: `aria-valuenow`, geometry, form value, and emitted values
284
+ stay numeric. The visible readout stays numeric unless `valueDisplay="formatted"` is set.
285
+ - Numeric value/domain assignments in the same Lit update batch are normalized against the final
286
+ `min`, `max`, and `step`, regardless of binding order. Await `updateComplete` to read the settled
287
+ scalar or range endpoints. Immediate imperative readback remains clamped to the current domain;
288
+ separate update batches intentionally normalize independently. Programmatic normalization emits
289
+ no user input/change event.
290
+ With no formatter, `aria-valuetext` remains the
275
291
  numeric string rendered by earlier versions; a nullish formatter result omits it.
276
292
  - A pointer drag fires `lr-input` continuously and a single `lr-change` on release; a keyboard step
277
293
  fires exactly one of each per press, but OS key-repeat while a key is held re-fires `lr-input` on
@@ -9,7 +9,7 @@
9
9
  - **Release history** [CHANGELOG.md](../../CHANGELOG.md); family-wide breaking-change summaries: [llms-full.txt](../../llms-full.txt)
10
10
  - **Deprecations** none
11
11
  - **Optional peers** none
12
- - **Themeable via** 34 parts, 18 custom properties — see this component's own `@csspart`/`@cssprop` list below
12
+ - **Themeable via** 36 parts, 18 custom properties — see this component's own `@csspart`/`@cssprop` list below
13
13
  - **Library-wide behavior** (events, form association, `locale`/`strings`, tokens, TS types): `llms/shared.md`
14
14
 
15
15
  ---
@@ -146,6 +146,10 @@ cell: (row) => unknown }` —
146
146
  the two consequences of the fixed algorithm worth knowing before opting in
147
147
  - `sortKey: string = ''` (attribute `sort-key`)
148
148
  - `sortDir: 'asc'|'desc' = 'asc'` (attribute `sort-dir`)
149
+ - `sortIndicators: TableSortIndicators = 'active'` (attribute `sort-indicators`) — `'all'` adds a
150
+ muted bidirectional indicator to each inactive sortable header, reserving the same space as the
151
+ active chevron. The default retains only the active column's indicator. This presentation does
152
+ not change keyboard interaction, client/server sorting, or `aria-sort="none"` on inactive columns.
149
153
  - `sortMode: 'client'|'server' = 'client'` (attribute `sort-mode`, reflected) — mirrors
150
154
  `paginationMode`'s identical split. `'client'` (the default) orders `rows` in the browser from
151
155
  `sortKey`/`sortDir` and the active column's `sortValue`; `'server'` renders `rows` exactly as
@@ -316,8 +320,9 @@ slot-replaceable: it reports a configuration problem (`noColumnsHeading`), not "
316
320
  nothing", and one slot covering all three would collapse that distinction. Everything else comes
317
321
  from `columns`/`rows`.
318
322
 
319
- **CSS parts:** `base`, `table`, `caption`, `head`, `header-cell`, `row`, `cell`, `more-button`, `sort-icon` (a
320
- chevron indicator shown on the active sortable header, rotated per `sortDir`), `reveal-columns-button`
323
+ **CSS parts:** `base`, `table`, `caption`, `head`, `header-cell`, `row`, `cell`, `more-button`, `sort-icon`
324
+ (each sort indicator), `sort-icon-active` (the active chevron, rotated per `sortDir`),
325
+ `sort-icon-inactive` (the muted bidirectional indicator under `sort-indicators="all"`), `reveal-columns-button`
321
326
  (shown when priority columns are hidden or when a narrow allocation is currently force-visible),
322
327
  `foot` (the `<tfoot>`, only rendered when at least one
323
328
  column defines `footer`), `footer-row`, `footer-cell`, `row-total-cell` (each body row's trailing
@@ -387,7 +392,8 @@ or structural-pseudo-class selector and does not affect group, expanded, hover,
387
392
  showing through the sticky header while it scrolls.
388
393
  Same shape and rationale as `--lr-table-row-selected-bg`: inline `var()` fallbacks, not on `:host`,
389
394
  because `::part(header-cell)[aria-sort]` is invalid CSS. The `sort-icon` part styles only the
390
- chevron; these tokens style the header cell itself.
395
+ indicator; these tokens style the header cell itself. Use `::part(sort-icon-inactive)` and
396
+ `::part(sort-icon-active)` to style the two indicator states without private selectors.
391
397
  `--lr-table-sticky-offset` (default `0`) is measured and written inline per column by the component
392
398
  so multiple `sticky` columns stack instead of overlapping; it is a read-out, not a knob you set.
393
399
  `--lr-table-heat-t` is likewise component-written (each `[data-heat]` cell's position on the ramp).