@aceshooting/lyra-ui 7.0.0 → 7.1.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.
- package/CHANGELOG.md +15 -0
- package/README.md +12 -4
- package/custom-elements.json +146 -8
- package/dist/components/forms/button/button.class.d.ts +10 -4
- package/dist/components/forms/button/button.class.d.ts.map +1 -1
- package/dist/components/forms/button/button.class.js +21 -5
- package/dist/components/forms/button/button.class.js.map +1 -1
- package/dist/components/forms/checkbox/checkbox.class.d.ts +5 -3
- package/dist/components/forms/checkbox/checkbox.class.d.ts.map +1 -1
- package/dist/components/forms/checkbox/checkbox.class.js +13 -3
- package/dist/components/forms/checkbox/checkbox.class.js.map +1 -1
- package/dist/components/forms/icon-button/icon-button.class.d.ts +11 -4
- package/dist/components/forms/icon-button/icon-button.class.d.ts.map +1 -1
- package/dist/components/forms/icon-button/icon-button.class.js +21 -5
- package/dist/components/forms/icon-button/icon-button.class.js.map +1 -1
- package/dist/components/forms/icon-button/icon-button.styles.js +1 -1
- package/dist/components/layout/menu/menu.class.d.ts +4 -1
- package/dist/components/layout/menu/menu.class.d.ts.map +1 -1
- package/dist/components/layout/menu/menu.class.js +4 -1
- package/dist/components/layout/menu/menu.class.js.map +1 -1
- package/dist/components/media/map/map-loader.d.ts +2 -2
- package/dist/components/media/map/map-loader.js +2 -2
- package/dist/components/media/map/map.class.d.ts +2 -2
- package/dist/components/media/map/map.class.js +2 -2
- package/dist/components/overlays/overlay/popover.class.d.ts +7 -0
- package/dist/components/overlays/overlay/popover.class.d.ts.map +1 -1
- package/dist/components/overlays/overlay/popover.class.js +13 -2
- package/dist/components/overlays/overlay/popover.class.js.map +1 -1
- package/dist/components/overlays/overlay/tooltip.class.d.ts +9 -0
- package/dist/components/overlays/overlay/tooltip.class.d.ts.map +1 -1
- package/dist/components/overlays/overlay/tooltip.class.js +43 -3
- package/dist/components/overlays/overlay/tooltip.class.js.map +1 -1
- package/dist/internal/aria-controls.d.ts +11 -2
- package/dist/internal/aria-controls.d.ts.map +1 -1
- package/dist/internal/aria-controls.js +35 -11
- package/dist/internal/aria-controls.js.map +1 -1
- package/dist/localization.d.ts +9 -0
- package/dist/localization.d.ts.map +1 -0
- package/dist/localization.js +8 -0
- package/dist/localization.js.map +1 -0
- package/dist/lyra.d.ts +2 -2
- package/dist/lyra.d.ts.map +1 -1
- package/dist/lyra.js +1 -1
- package/dist/lyra.js.map +1 -1
- package/llms/components/lr-button.md +7 -4
- package/llms/components/lr-checkbox.md +6 -3
- package/llms/components/lr-dropdown-item.md +10 -1
- package/llms/components/lr-dropdown.md +2 -0
- package/llms/components/lr-geojson-view.md +4 -3
- package/llms/components/lr-icon-button.md +11 -6
- package/llms/components/lr-map.md +5 -4
- package/llms/components/lr-menu-item.md +10 -1
- package/llms/components/lr-menu.md +10 -1
- package/llms/components/lr-popover.md +7 -0
- package/llms/components/lr-tooltip.md +8 -0
- package/llms/peers.md +1 -1
- package/llms/shared.md +15 -8
- package/llms-full.txt +74 -28
- package/package.json +4 -3
- package/vscode-css-data.json +7 -0
- package/vscode-html-data.json +21 -7
- package/web-types.json +20 -8
package/CHANGELOG.md
CHANGED
|
@@ -1,5 +1,20 @@
|
|
|
1
1
|
# Changelog
|
|
2
2
|
|
|
3
|
+
## 7.1.0
|
|
4
|
+
|
|
5
|
+
### Minor Changes
|
|
6
|
+
|
|
7
|
+
- bf9ac61: Resolve public integration gaps:
|
|
8
|
+
|
|
9
|
+
- add the side-effect-free `@aceshooting/lyra-ui/localization.js` runtime entry;
|
|
10
|
+
- add `--lr-icon-button-border-hover`, falling back to the base border;
|
|
11
|
+
- document and test the reflected `ariaControlsElements` contract for menu triggers;
|
|
12
|
+
- make popover/dropdown `aria-controls` target their public host so native and Lyra triggers can
|
|
13
|
+
resolve it;
|
|
14
|
+
- make tooltip and checkbox descriptions resolvable across their trigger/control shadow
|
|
15
|
+
boundaries; and
|
|
16
|
+
- accept MapLibre GL JS v5 or v6, with version-specific worker guidance.
|
|
17
|
+
|
|
3
18
|
## 7.0.0
|
|
4
19
|
|
|
5
20
|
### Major Changes
|
package/README.md
CHANGED
|
@@ -55,8 +55,9 @@ npm install @aceshooting/lyra-ui
|
|
|
55
55
|
# optional peer: maplibre-gl, only needed for <lr-map> — also import
|
|
56
56
|
# `maplibre-gl/dist/maplibre-gl.css` yourself once, since lr-map only
|
|
57
57
|
# ships its own legend/popup chrome CSS, not maplibre-gl's own stylesheet.
|
|
58
|
-
# MapLibre
|
|
59
|
-
#
|
|
58
|
+
# Lyra supports MapLibre v5 and v6. v5's standard build includes its worker;
|
|
59
|
+
# v6 is ESM-only, requires WebGL2, and also needs its module-worker URL
|
|
60
|
+
# configured for your bundler before the first map is constructed.
|
|
60
61
|
# <lr-map> falls back to OpenStreetMap's demo tile server when you don't
|
|
61
62
|
# set `mapStyle` — fine for local dev, but NOT for production (no capacity
|
|
62
63
|
# guarantees, requires an identifying User-Agent, subject to IP-blocking —
|
|
@@ -64,7 +65,7 @@ npm install @aceshooting/lyra-ui
|
|
|
64
65
|
# apps must supply their own `mapStyle`.
|
|
65
66
|
```
|
|
66
67
|
|
|
67
|
-
For example, Vite consumers
|
|
68
|
+
For example, Vite consumers using MapLibre v6 configure its self-contained worker once:
|
|
68
69
|
|
|
69
70
|
```js
|
|
70
71
|
import { setWorkerUrl } from 'maplibre-gl';
|
|
@@ -265,13 +266,20 @@ Markdown, phone-number metadata, and flag artwork remain optional peer dependenc
|
|
|
265
266
|
`aria-label`s) resolves through a small runtime, in two ways you can combine:
|
|
266
267
|
|
|
267
268
|
```ts
|
|
268
|
-
import {
|
|
269
|
+
import {
|
|
270
|
+
registerLyraLocale,
|
|
271
|
+
setLyraLocale,
|
|
272
|
+
} from '@aceshooting/lyra-ui/localization.js';
|
|
269
273
|
|
|
270
274
|
// App-wide: register translations once, anywhere in the app.
|
|
271
275
|
registerLyraLocale('fr', { close: 'Fermer', retry: 'Réessayer', /* ... */ });
|
|
272
276
|
setLyraLocale('fr'); // or just set <html lang="fr">/an ancestor `lang` — components pick it up
|
|
273
277
|
```
|
|
274
278
|
|
|
279
|
+
The dedicated `localization.js` entry is side-effect-free: it does not register the component
|
|
280
|
+
graph. The package root continues to re-export the same runtime for compatibility, but importing
|
|
281
|
+
it also registers the non-peer-gated components.
|
|
282
|
+
|
|
275
283
|
```html
|
|
276
284
|
<!-- Per-instance: override specific keys on one element without a global registry. -->
|
|
277
285
|
<lr-toast .strings=${{ close: 'Fermer' }}></lr-toast>
|
package/custom-elements.json
CHANGED
|
@@ -100165,7 +100165,7 @@
|
|
|
100165
100165
|
"declarations": [
|
|
100166
100166
|
{
|
|
100167
100167
|
"kind": "class",
|
|
100168
|
-
"description": "`<lr-button>` — a generic action-button primitive. Renders an internal native\n`<button part=\"base\">`. `type=\"submit\"`/`type=\"reset\"`\nare handled by this component itself via the host's own `closest('form')` — a shadow-internal\nnative `<button type=\"submit\">` does not participate in an ancestor light-DOM form's submission\non its own, since form-submitter semantics don't cross the shadow boundary.\n\nWhen `href` is set to a safe link URL (`http:`/`https:`/`blob:`/`mailto:`/relative — see\n`safeLinkHref`, or `safeDownloadHref` which drops `mailto:` when `download` is set) the root\nrenders as a real `<a part=\"base\" href=…>` instead — for a link styled\nas a button (e.g. a CTA). Native navigation is then the anchor's own activation, so the\nsubmit/reset click handler and `type` (submit/reset) have no effect in that mode. When the\nbutton is disabled (its own `disabled` or an ancestor `<fieldset disabled>`) the anchor renders\nwith `aria-disabled=\"true\"` and **no `href`** — an href-less anchor is not focusable or\nnavigable, so a disabled link button genuinely cannot be activated (unlike a bare\n`aria-disabled` on a still-navigable link). An unsafe/unparseable `href` falls back to the\nnative `<button>`.\n\n`accessibleLabel` (attribute `aria-label`) is forwarded reactively to the internal button/anchor\nas a literal string (for an icon-only button with no visible label)
|
|
100168
|
+
"description": "`<lr-button>` — a generic action-button primitive. Renders an internal native\n`<button part=\"base\">`. `type=\"submit\"`/`type=\"reset\"`\nare handled by this component itself via the host's own `closest('form')` — a shadow-internal\nnative `<button type=\"submit\">` does not participate in an ancestor light-DOM form's submission\non its own, since form-submitter semantics don't cross the shadow boundary.\n\nWhen `href` is set to a safe link URL (`http:`/`https:`/`blob:`/`mailto:`/relative — see\n`safeLinkHref`, or `safeDownloadHref` which drops `mailto:` when `download` is set) the root\nrenders as a real `<a part=\"base\" href=…>` instead — for a link styled\nas a button (e.g. a CTA). Native navigation is then the anchor's own activation, so the\nsubmit/reset click handler and `type` (submit/reset) have no effect in that mode. When the\nbutton is disabled (its own `disabled` or an ancestor `<fieldset disabled>`) the anchor renders\nwith `aria-disabled=\"true\"` and **no `href`** — an href-less anchor is not focusable or\nnavigable, so a disabled link button genuinely cannot be activated (unlike a bare\n`aria-disabled` on a still-navigable link). An unsafe/unparseable `href` falls back to the\nnative `<button>`.\n\n`accessibleLabel` (attribute `aria-label`) is forwarded reactively to the internal button/anchor\nas a literal string (for an icon-only button with no visible label). Host `aria-describedby`\nIDREFs are resolved through `ariaDescribedByElements`; external `aria-labelledby` is not copied\nacross the shadow boundary.\nHost `aria-haspopup` and `aria-expanded` values are likewise forwarded to the internal semantic\ncontrol. When host `aria-controls` names elements in the host's own root, the controls\nrelationship is resolved onto the internal control through the reflected element-reference API\nso it remains valid across this component's shadow boundary. Assigning that relationship\nintentionally clears the serialized `aria-controls` value; read `ariaControlsElements` in a\nsupporting browser. Browsers without that API retain the forwarded string attribute as a\nbest-effort fallback.",
|
|
100169
100169
|
"name": "LyraButton",
|
|
100170
100170
|
"cssProperties": [
|
|
100171
100171
|
{
|
|
@@ -100487,6 +100487,15 @@
|
|
|
100487
100487
|
"default": "false",
|
|
100488
100488
|
"description": "Whether the `start`/`end` slots have assigned content. Drives `?hidden` on the adornment\nwrappers so an unslotted wrapper collapses to `display: none` instead of contributing a dead\n`--lr-button-gap` of inline space (a bare `<slot>` is an element child, so a `:empty` rule\ncould never match it). Seeded synchronously in `willUpdate` before the first paint, then kept\ncurrent by each slot's `slotchange` — mirrors `<lr-input>`'s identical pattern."
|
|
100489
100489
|
},
|
|
100490
|
+
{
|
|
100491
|
+
"kind": "field",
|
|
100492
|
+
"name": "hasSyncedDescribedByElements",
|
|
100493
|
+
"type": {
|
|
100494
|
+
"text": "boolean"
|
|
100495
|
+
},
|
|
100496
|
+
"privacy": "private",
|
|
100497
|
+
"default": "false"
|
|
100498
|
+
},
|
|
100490
100499
|
{
|
|
100491
100500
|
"kind": "field",
|
|
100492
100501
|
"name": "href",
|
|
@@ -100629,6 +100638,16 @@
|
|
|
100629
100638
|
"default": "null",
|
|
100630
100639
|
"attribute": "aria-controls"
|
|
100631
100640
|
},
|
|
100641
|
+
{
|
|
100642
|
+
"kind": "field",
|
|
100643
|
+
"name": "triggerDescribedBy",
|
|
100644
|
+
"type": {
|
|
100645
|
+
"text": "string | null"
|
|
100646
|
+
},
|
|
100647
|
+
"privacy": "private",
|
|
100648
|
+
"default": "null",
|
|
100649
|
+
"attribute": "aria-describedby"
|
|
100650
|
+
},
|
|
100632
100651
|
{
|
|
100633
100652
|
"kind": "field",
|
|
100634
100653
|
"name": "triggerExpanded",
|
|
@@ -100918,6 +100937,16 @@
|
|
|
100918
100937
|
"name": "LyraElement",
|
|
100919
100938
|
"module": "src/internal/lyra-element.ts"
|
|
100920
100939
|
}
|
|
100940
|
+
},
|
|
100941
|
+
{
|
|
100942
|
+
"kind": "method",
|
|
100943
|
+
"name": "syncDescribedByElements",
|
|
100944
|
+
"privacy": "private",
|
|
100945
|
+
"return": {
|
|
100946
|
+
"type": {
|
|
100947
|
+
"text": "void"
|
|
100948
|
+
}
|
|
100949
|
+
}
|
|
100921
100950
|
}
|
|
100922
100951
|
],
|
|
100923
100952
|
"attributes": [
|
|
@@ -100938,6 +100967,14 @@
|
|
|
100938
100967
|
"default": "null",
|
|
100939
100968
|
"fieldName": "triggerControls"
|
|
100940
100969
|
},
|
|
100970
|
+
{
|
|
100971
|
+
"name": "aria-describedby",
|
|
100972
|
+
"type": {
|
|
100973
|
+
"text": "string | null"
|
|
100974
|
+
},
|
|
100975
|
+
"default": "null",
|
|
100976
|
+
"fieldName": "triggerDescribedBy"
|
|
100977
|
+
},
|
|
100941
100978
|
{
|
|
100942
100979
|
"name": "aria-expanded",
|
|
100943
100980
|
"type": {
|
|
@@ -102084,7 +102121,7 @@
|
|
|
102084
102121
|
],
|
|
102085
102122
|
"slots": [
|
|
102086
102123
|
{
|
|
102087
|
-
"description": "Label text, rendered next to the box. Clicking it toggles the checkbox, the same as clicking a native checkbox's associated `<label>`. If left empty, set `aria-label` on the host so the control still has an accessible name. A host `aria-describedby` attribute is
|
|
102124
|
+
"description": "Label text, rendered next to the box. Clicking it toggles the checkbox, the same as clicking a native checkbox's associated `<label>`. If left empty, set `aria-label` on the host so the control still has an accessible name. A host `aria-describedby` attribute is resolved onto the internal `role=\"checkbox\"` through `ariaDescribedByElements` so externally-owned descriptions remain valid across the shadow boundary.",
|
|
102088
102125
|
"name": ""
|
|
102089
102126
|
}
|
|
102090
102127
|
],
|
|
@@ -102274,6 +102311,15 @@
|
|
|
102274
102311
|
"privacy": "private",
|
|
102275
102312
|
"default": "false"
|
|
102276
102313
|
},
|
|
102314
|
+
{
|
|
102315
|
+
"kind": "field",
|
|
102316
|
+
"name": "hasSyncedDescribedByElements",
|
|
102317
|
+
"type": {
|
|
102318
|
+
"text": "boolean"
|
|
102319
|
+
},
|
|
102320
|
+
"privacy": "private",
|
|
102321
|
+
"default": "false"
|
|
102322
|
+
},
|
|
102277
102323
|
{
|
|
102278
102324
|
"kind": "field",
|
|
102279
102325
|
"name": "indeterminate",
|
|
@@ -111918,7 +111964,7 @@
|
|
|
111918
111964
|
"declarations": [
|
|
111919
111965
|
{
|
|
111920
111966
|
"kind": "class",
|
|
111921
|
-
"description": "`<lr-icon-button>` — an accessible icon-only action button.\n\nSet `icon` for one of `<lr-icon>`'s named glyphs, or slot your own content instead. Slotted\ncontent is a **sibling** of the built-in glyph rather than being piped through `<lr-icon>`, so\nany complete element — an `<svg>`, an `<img>`, an `<lr-flag>` — renders at its own natural\naspect ratio instead of being forced into a 1:1 box. Bare SVG geometry (`<path>`, `<circle>`,\nand a handful of other raw primitives) with no enclosing `<svg>` of its own is detected and\ncloned into a real, internal SVG-namespaced element so it still paints — the same fallback\n`<lr-icon>`'s own custom-content slot uses, but narrowly scoped so a custom element (e.g. a\nslotted `<lr-flag>`) is never run through it.\n\nHost `aria-haspopup` and `aria-expanded` values are forwarded reactively to the shadow-internal\nnative button.
|
|
111967
|
+
"description": "`<lr-icon-button>` — an accessible icon-only action button.\n\nSet `icon` for one of `<lr-icon>`'s named glyphs, or slot your own content instead. Slotted\ncontent is a **sibling** of the built-in glyph rather than being piped through `<lr-icon>`, so\nany complete element — an `<svg>`, an `<img>`, an `<lr-flag>` — renders at its own natural\naspect ratio instead of being forced into a 1:1 box. Bare SVG geometry (`<path>`, `<circle>`,\nand a handful of other raw primitives) with no enclosing `<svg>` of its own is detected and\ncloned into a real, internal SVG-namespaced element so it still paints — the same fallback\n`<lr-icon>`'s own custom-content slot uses, but narrowly scoped so a custom element (e.g. a\nslotted `<lr-flag>`) is never run through it.\n\nHost `aria-haspopup` and `aria-expanded` values are forwarded reactively to the shadow-internal\nnative button. Host `aria-describedby` IDREFs are resolved through `ariaDescribedByElements`.\nWhen host `aria-controls` names elements in the host's own root, the controls relationship is\nresolved onto that focused control through the reflected element-reference API so it remains\nvalid across this component's shadow boundary. Assigning that relationship intentionally clears\nthe serialized `aria-controls` value; read `ariaControlsElements` in a supporting browser.\nBrowsers without that API retain the forwarded string attribute as a best-effort fallback.\n\nForm-associated (mirroring `<lr-button>`'s identical shape): discoverable through\n`form.elements`, and `type=\"submit\"`/`type=\"reset\"` are handled by this component itself via\nthe host's own `closest('form')` — a shadow-internal native `<button type=\"submit\">` does not\nparticipate in an ancestor light-DOM form's submission on its own, since form-submitter\nsemantics don't cross the shadow boundary.",
|
|
111922
111968
|
"name": "LyraIconButton",
|
|
111923
111969
|
"cssProperties": [
|
|
111924
111970
|
{
|
|
@@ -111955,6 +112001,11 @@
|
|
|
111955
112001
|
"description": "Complete border shorthand of the native button.",
|
|
111956
112002
|
"name": "--lr-icon-button-border",
|
|
111957
112003
|
"default": "0"
|
|
112004
|
+
},
|
|
112005
|
+
{
|
|
112006
|
+
"description": "Complete border shorthand on hover.",
|
|
112007
|
+
"name": "--lr-icon-button-border-hover",
|
|
112008
|
+
"default": "var(--lr-icon-button-border, 0)"
|
|
111958
112009
|
}
|
|
111959
112010
|
],
|
|
111960
112011
|
"cssParts": [
|
|
@@ -112095,6 +112146,15 @@
|
|
|
112095
112146
|
"default": "false",
|
|
112096
112147
|
"description": "Only ever true when `icon` is unset and at least one top-level slotted element is bare SVG\ngeometry with no SVG parent of its own -- see `needsSvgNamespaceFallback`. Mounts the internal\n`[part=\"fallback\"]` SVG, which `updated()` then populates via `syncFallbackGeometry()`."
|
|
112097
112148
|
},
|
|
112149
|
+
{
|
|
112150
|
+
"kind": "field",
|
|
112151
|
+
"name": "hasSyncedDescribedByElements",
|
|
112152
|
+
"type": {
|
|
112153
|
+
"text": "boolean"
|
|
112154
|
+
},
|
|
112155
|
+
"privacy": "private",
|
|
112156
|
+
"default": "false"
|
|
112157
|
+
},
|
|
112098
112158
|
{
|
|
112099
112159
|
"kind": "field",
|
|
112100
112160
|
"name": "icon",
|
|
@@ -112218,6 +112278,16 @@
|
|
|
112218
112278
|
"default": "null",
|
|
112219
112279
|
"attribute": "aria-controls"
|
|
112220
112280
|
},
|
|
112281
|
+
{
|
|
112282
|
+
"kind": "field",
|
|
112283
|
+
"name": "triggerDescribedBy",
|
|
112284
|
+
"type": {
|
|
112285
|
+
"text": "string | null"
|
|
112286
|
+
},
|
|
112287
|
+
"privacy": "private",
|
|
112288
|
+
"default": "null",
|
|
112289
|
+
"attribute": "aria-describedby"
|
|
112290
|
+
},
|
|
112221
112291
|
{
|
|
112222
112292
|
"kind": "field",
|
|
112223
112293
|
"name": "triggerExpanded",
|
|
@@ -112496,6 +112566,16 @@
|
|
|
112496
112566
|
"module": "src/internal/lyra-element.ts"
|
|
112497
112567
|
}
|
|
112498
112568
|
},
|
|
112569
|
+
{
|
|
112570
|
+
"kind": "method",
|
|
112571
|
+
"name": "syncDescribedByElements",
|
|
112572
|
+
"privacy": "private",
|
|
112573
|
+
"return": {
|
|
112574
|
+
"type": {
|
|
112575
|
+
"text": "void"
|
|
112576
|
+
}
|
|
112577
|
+
}
|
|
112578
|
+
},
|
|
112499
112579
|
{
|
|
112500
112580
|
"kind": "method",
|
|
112501
112581
|
"name": "syncFallbackGeometry",
|
|
@@ -112517,6 +112597,14 @@
|
|
|
112517
112597
|
"default": "null",
|
|
112518
112598
|
"fieldName": "triggerControls"
|
|
112519
112599
|
},
|
|
112600
|
+
{
|
|
112601
|
+
"name": "aria-describedby",
|
|
112602
|
+
"type": {
|
|
112603
|
+
"text": "string | null"
|
|
112604
|
+
},
|
|
112605
|
+
"default": "null",
|
|
112606
|
+
"fieldName": "triggerDescribedBy"
|
|
112607
|
+
},
|
|
112520
112608
|
{
|
|
112521
112609
|
"name": "aria-expanded",
|
|
112522
112610
|
"type": {
|
|
@@ -141836,7 +141924,7 @@
|
|
|
141836
141924
|
"declarations": [
|
|
141837
141925
|
{
|
|
141838
141926
|
"kind": "class",
|
|
141839
|
-
"description": "`<lr-menu>` — an anchored dropdown of `<lr-menu-item>` actions, opened\nfrom a consumer-supplied trigger (typically an icon button). A close, drop-\nin-shaped replacement for reaching outside this library for a third-party\ndropdown to build a gear menu, an avatar menu, or a history row's overflow\nmenu: click the trigger, a positioned menu appears, clicking an item both\nperforms the action *and* closes the menu.\n\n**ARIA pattern — `role=\"menu\"`/`role=\"menuitem\"` with real roving DOM\nfocus, not a listbox.** Two coherent, mutually-exclusive shapes were\navailable here: (a) `role=\"listbox\"`/`role=\"option\"` with\n`aria-activedescendant`, the pattern `<lr-select>`'s trigger-button +\npopup listbox uses, where DOM focus never leaves the trigger; or (b)\n`role=\"menu\"`/`role=\"menuitem\"` with real focus moving between actual\nfocusable rows, the WAI-ARIA \"menu button\" pattern. This picks (b):\n`<lr-menu-item>` rows are real, independently-focusable elements (see\nthat class's own doc), which is the more natural fit for a menu\nspecifically — unlike a listbox's rows, a menu's rows are conventionally\nbutton-/link-shaped, and every well-known native/OS menu (and this\nfamily's own `<lr-tree>`/`<lr-tree-node>` pair, which this component's\nroving-tabindex plumbing directly mirrors) already moves real focus rather\nthan merely a virtual `aria-activedescendant` pointer. `role`/`tabIndex`\nare consistently the menu-button shape throughout — never mixed with\nlistbox/option.\n\nInteraction contract (mirrors the WAI-ARIA APG \"menu button\" pattern):\n- Click the trigger (or Enter/Space on it, via the trigger's own native\n `click` activation) toggles the menu, moving focus to the first\n non-disabled item on open.\n- ArrowDown/ArrowUp on the trigger while closed also open it, focusing the\n first/last non-disabled item respectively.\n- Once open, ArrowDown/ArrowUp move the roving focus among non-disabled\n items (wrapping past either end — the recommended, and more common,\n menu-widget behavior, unlike `<lr-select>`'s clamped listbox nav).\n Home/End jump to the first/last non-disabled item. Enter/Space activate\n the focused item. Escape closes and returns focus to the trigger. A\n printable keypress runs type-ahead: roving focus jumps to the next\n non-disabled item whose text starts with the accumulated buffer, cycling\n from just after the active item (mirrors `<lr-select>`'s identical\n listbox type-ahead). All of the above (except Escape and Tab) only\n respond to keydowns from a real `<lr-menu-item>` target, so a slotted\n non-item control (e.g. a date input) keeps its own full default keyboard\n behavior.\n- Tab never traps focus and never calls `preventDefault()` — the browser's\n own Tab navigation always proceeds untouched. It closes the menu only\n when focus is on its way *out* of the popup: with a focusable in the\n `header`/`footer` region on the far side of the keypress, the menu stays\n open so native Tab can carry focus there instead. With neither region\n filled, Tab closes exactly as it always has. Tabbing past the popup's\n last focusable in either direction closes it too, including from slotted\n non-item content — which previously left the menu open while focus\n walked away.\n- Escape from `header`/`footer` content closes the menu and refocuses the\n trigger unconditionally, mirroring `<lr-popover>`'s handling of arbitrary\n popup content. `closeOnEscapeAnywhere` governs only the *legacy* shape —\n non-item content slotted into the **default** slot — and defaults to\n `false`, so existing consumers keep today's behavior unchanged.\n- A click outside both the trigger and the open popup closes it (mirrors\n `<lr-select>`'s `onDocPointer` exactly) — this does *not* refocus the\n trigger, since the outside click itself already moved focus somewhere\n the user chose; Escape and a committed selection *do* refocus the\n trigger, since those are dismissals with nowhere else for focus to go.\n\n`show(focus?)` and `hide(options?)` are the public imperative pair, for the cases the trigger\ncan't express: a slotted \"Apply\"/\"Done\" button inside the menu, a keyboard shortcut, a parent\nrestoring UI state. `hide({ focusTrigger: true })` is the one that also returns DOM focus to the\ntrigger — use it whenever the interaction that closed the menu hasn't already put focus\nsomewhere the user chose. Writing `open` directly still works and is fully equivalent apart from\nthe focus moves: the roving-tabindex reset is centralized in `updated()`, so `el.open = false`\nnever leaves a stale `tabindex=\"0\"` tab stop on the last active item.\n\nThe trigger element itself is read from the `trigger` slot's assigned element (first one, if\nseveral are assigned) and enhanced imperatively with\n`aria-haspopup=\"menu\"`/`aria-expanded`/`aria-controls` — the same \"reach into a consumer-owned\nlight-DOM element to complete its a11y wiring\" approach `<lr-dialog>` documents for its own\nheading detection. `aria-controls` targets this menu host (which receives a stable generated\n`id` only when the consumer did not supply one), rather than a shadow-private popup id, so the\nrelationship is resolvable from the trigger's root. `<lr-button>` and `<lr-icon-button>` observe\nthose attributes, forward the popup/expanded values to their shadow-internal native controls,\nand resolve the controls element-reference onto that focused control.\n\nThe popup is always rendered (never `display:none`) so `.focus()` calls on\nits content work synchronously the instant it opens — visually hidden via\n`visibility`/`opacity` instead (identical to `<lr-select>`'s own\n`[part=\"listbox\"]`). `visibility` is an inherited CSS property that\npierces the `<slot>` projection boundary, so every closed-state\n`<lr-menu-item>` is automatically excluded from sequential (Tab-key)\nnavigation with no separate JS bookkeeping.",
|
|
141927
|
+
"description": "`<lr-menu>` — an anchored dropdown of `<lr-menu-item>` actions, opened\nfrom a consumer-supplied trigger (typically an icon button). A close, drop-\nin-shaped replacement for reaching outside this library for a third-party\ndropdown to build a gear menu, an avatar menu, or a history row's overflow\nmenu: click the trigger, a positioned menu appears, clicking an item both\nperforms the action *and* closes the menu.\n\n**ARIA pattern — `role=\"menu\"`/`role=\"menuitem\"` with real roving DOM\nfocus, not a listbox.** Two coherent, mutually-exclusive shapes were\navailable here: (a) `role=\"listbox\"`/`role=\"option\"` with\n`aria-activedescendant`, the pattern `<lr-select>`'s trigger-button +\npopup listbox uses, where DOM focus never leaves the trigger; or (b)\n`role=\"menu\"`/`role=\"menuitem\"` with real focus moving between actual\nfocusable rows, the WAI-ARIA \"menu button\" pattern. This picks (b):\n`<lr-menu-item>` rows are real, independently-focusable elements (see\nthat class's own doc), which is the more natural fit for a menu\nspecifically — unlike a listbox's rows, a menu's rows are conventionally\nbutton-/link-shaped, and every well-known native/OS menu (and this\nfamily's own `<lr-tree>`/`<lr-tree-node>` pair, which this component's\nroving-tabindex plumbing directly mirrors) already moves real focus rather\nthan merely a virtual `aria-activedescendant` pointer. `role`/`tabIndex`\nare consistently the menu-button shape throughout — never mixed with\nlistbox/option.\n\nInteraction contract (mirrors the WAI-ARIA APG \"menu button\" pattern):\n- Click the trigger (or Enter/Space on it, via the trigger's own native\n `click` activation) toggles the menu, moving focus to the first\n non-disabled item on open.\n- ArrowDown/ArrowUp on the trigger while closed also open it, focusing the\n first/last non-disabled item respectively.\n- Once open, ArrowDown/ArrowUp move the roving focus among non-disabled\n items (wrapping past either end — the recommended, and more common,\n menu-widget behavior, unlike `<lr-select>`'s clamped listbox nav).\n Home/End jump to the first/last non-disabled item. Enter/Space activate\n the focused item. Escape closes and returns focus to the trigger. A\n printable keypress runs type-ahead: roving focus jumps to the next\n non-disabled item whose text starts with the accumulated buffer, cycling\n from just after the active item (mirrors `<lr-select>`'s identical\n listbox type-ahead). All of the above (except Escape and Tab) only\n respond to keydowns from a real `<lr-menu-item>` target, so a slotted\n non-item control (e.g. a date input) keeps its own full default keyboard\n behavior.\n- Tab never traps focus and never calls `preventDefault()` — the browser's\n own Tab navigation always proceeds untouched. It closes the menu only\n when focus is on its way *out* of the popup: with a focusable in the\n `header`/`footer` region on the far side of the keypress, the menu stays\n open so native Tab can carry focus there instead. With neither region\n filled, Tab closes exactly as it always has. Tabbing past the popup's\n last focusable in either direction closes it too, including from slotted\n non-item content — which previously left the menu open while focus\n walked away.\n- Escape from `header`/`footer` content closes the menu and refocuses the\n trigger unconditionally, mirroring `<lr-popover>`'s handling of arbitrary\n popup content. `closeOnEscapeAnywhere` governs only the *legacy* shape —\n non-item content slotted into the **default** slot — and defaults to\n `false`, so existing consumers keep today's behavior unchanged.\n- A click outside both the trigger and the open popup closes it (mirrors\n `<lr-select>`'s `onDocPointer` exactly) — this does *not* refocus the\n trigger, since the outside click itself already moved focus somewhere\n the user chose; Escape and a committed selection *do* refocus the\n trigger, since those are dismissals with nowhere else for focus to go.\n\n`show(focus?)` and `hide(options?)` are the public imperative pair, for the cases the trigger\ncan't express: a slotted \"Apply\"/\"Done\" button inside the menu, a keyboard shortcut, a parent\nrestoring UI state. `hide({ focusTrigger: true })` is the one that also returns DOM focus to the\ntrigger — use it whenever the interaction that closed the menu hasn't already put focus\nsomewhere the user chose. Writing `open` directly still works and is fully equivalent apart from\nthe focus moves: the roving-tabindex reset is centralized in `updated()`, so `el.open = false`\nnever leaves a stale `tabindex=\"0\"` tab stop on the last active item.\n\nThe trigger element itself is read from the `trigger` slot's assigned element (first one, if\nseveral are assigned) and enhanced imperatively with\n`aria-haspopup=\"menu\"`/`aria-expanded`/`aria-controls` — the same \"reach into a consumer-owned\nlight-DOM element to complete its a11y wiring\" approach `<lr-dialog>` documents for its own\nheading detection. `aria-controls` targets this menu host (which receives a stable generated\n`id` only when the consumer did not supply one), rather than a shadow-private popup id, so the\nrelationship is resolvable from the trigger's root. `<lr-button>` and `<lr-icon-button>` observe\nthose attributes, forward the popup/expanded values to their shadow-internal native controls,\nand resolve the controls element-reference onto that focused control. In supporting browsers,\nassigning the element reference intentionally clears the internal control's serialized\n`aria-controls` value; `ariaControlsElements` is the relationship's source of truth. Browsers\nwithout the reflected element-reference API retain the string as a best-effort fallback.\n\nThe popup is always rendered (never `display:none`) so `.focus()` calls on\nits content work synchronously the instant it opens — visually hidden via\n`visibility`/`opacity` instead (identical to `<lr-select>`'s own\n`[part=\"listbox\"]`). `visibility` is an inherited CSS property that\npierces the `<slot>` projection boundary, so every closed-state\n`<lr-menu-item>` is automatically excluded from sequential (Tab-key)\nnavigation with no separate JS bookkeeping.",
|
|
141840
141928
|
"name": "LyraMenu",
|
|
141841
141929
|
"cssParts": [
|
|
141842
141930
|
{
|
|
@@ -161378,7 +161466,7 @@
|
|
|
161378
161466
|
"text": "Promise<MaplibreModule | null>"
|
|
161379
161467
|
}
|
|
161380
161468
|
},
|
|
161381
|
-
"description": "Lazily loads the optional peer dependency `maplibre-gl` once per page.\nResolves to `null` (with a one-time warning) if it isn't installed —\nmirrors `<lr-flag>`'s peer-dependency pattern. Consumers must separately\nimport `maplibre-gl/dist/maplibre-gl.css
|
|
161469
|
+
"description": "Lazily loads the optional peer dependency `maplibre-gl` once per page.\nResolves to `null` (with a one-time warning) if it isn't installed —\nmirrors `<lr-flag>`'s peer-dependency pattern. Consumers must separately\nimport `maplibre-gl/dist/maplibre-gl.css`. MapLibre v6 consumers also configure its module-worker\nURL for their bundler once they install the peer; v5's standard build includes its worker."
|
|
161382
161470
|
}
|
|
161383
161471
|
],
|
|
161384
161472
|
"exports": [
|
|
@@ -161398,7 +161486,7 @@
|
|
|
161398
161486
|
"declarations": [
|
|
161399
161487
|
{
|
|
161400
161488
|
"kind": "class",
|
|
161401
|
-
"description": "`<lr-map>` — a maplibre-gl wrapper with a declarative legend, choropleth\nGeoJSON layer, markers, and additive `dataLayers` GeoJSON overlays\n(arbitrary shapes rendered as a source plus fill/line/circle layers,\nindependent of `choropleth`'s field/stops color-interpolation), plus a raw\n`map` escape hatch. Requires the optional peer dep `maplibre-gl`\
|
|
161489
|
+
"description": "`<lr-map>` — a maplibre-gl wrapper with a declarative legend, choropleth\nGeoJSON layer, markers, and additive `dataLayers` GeoJSON overlays\n(arbitrary shapes rendered as a source plus fill/line/circle layers,\nindependent of `choropleth`'s field/stops color-interpolation), plus a raw\n`map` escape hatch. Requires the optional peer dep `maplibre-gl`\nv5 or v6 (consumers also import its CSS). MapLibre v6 is ESM-only, requires WebGL2, and needs\nits module-worker URL configured once; v5's standard build includes its worker.\n\nThe underlying `maplibregl.Map` — and the WebGL context it opens — isn't\nconstructed until this element is first visible in the viewport (tracked\nvia `IntersectionObserver`), even once the `maplibre-gl` peer dependency\nhas finished loading. Browsers hard-cap concurrent WebGL contexts per\npage, so a grid/dashboard of many `<lr-map>` instances only constructs\nthe ones actually on-screen instead of racing to exhaust that budget the\ninstant each one mounts. `map` stays `undefined` (and `lr-map-load`\ndoesn't fire) until construction actually happens.",
|
|
161402
161490
|
"name": "LyraMap",
|
|
161403
161491
|
"cssParts": [
|
|
161404
161492
|
{
|
|
@@ -170644,6 +170732,16 @@
|
|
|
170644
170732
|
"module": "src/components/overlays/overlay/popover.class.ts"
|
|
170645
170733
|
}
|
|
170646
170734
|
},
|
|
170735
|
+
{
|
|
170736
|
+
"kind": "field",
|
|
170737
|
+
"name": "generatedHostId",
|
|
170738
|
+
"privacy": "private",
|
|
170739
|
+
"readonly": true,
|
|
170740
|
+
"inheritedFrom": {
|
|
170741
|
+
"name": "LyraPopover",
|
|
170742
|
+
"module": "src/components/overlays/overlay/popover.class.ts"
|
|
170743
|
+
}
|
|
170744
|
+
},
|
|
170647
170745
|
{
|
|
170648
170746
|
"kind": "field",
|
|
170649
170747
|
"name": "inheritedContextObserver",
|
|
@@ -171402,7 +171500,7 @@
|
|
|
171402
171500
|
"declarations": [
|
|
171403
171501
|
{
|
|
171404
171502
|
"kind": "class",
|
|
171405
|
-
"description": "`<lr-popover>` — a click-triggered, light-dismiss floating surface.",
|
|
171503
|
+
"description": "`<lr-popover>` — a click-triggered, light-dismiss floating surface.\n\nThe slotted trigger receives `aria-haspopup`, `aria-expanded`, and `aria-controls`.\n`aria-controls` targets this public host (which receives a stable generated `id` when the\nconsumer did not supply one), not the shadow-private popup. That keeps the relationship\nresolvable for native triggers and lets `<lr-button>`/`<lr-icon-button>` reflect the host onto\ntheir focused shadow-internal controls through `ariaControlsElements`.",
|
|
171406
171504
|
"name": "LyraPopover",
|
|
171407
171505
|
"cssProperties": [
|
|
171408
171506
|
{
|
|
@@ -171529,6 +171627,12 @@
|
|
|
171529
171627
|
"privacy": "private",
|
|
171530
171628
|
"readonly": true
|
|
171531
171629
|
},
|
|
171630
|
+
{
|
|
171631
|
+
"kind": "field",
|
|
171632
|
+
"name": "generatedHostId",
|
|
171633
|
+
"privacy": "private",
|
|
171634
|
+
"readonly": true
|
|
171635
|
+
},
|
|
171532
171636
|
{
|
|
171533
171637
|
"kind": "field",
|
|
171534
171638
|
"name": "inheritedContextObserver",
|
|
@@ -172145,7 +172249,7 @@
|
|
|
172145
172249
|
"declarations": [
|
|
172146
172250
|
{
|
|
172147
172251
|
"kind": "class",
|
|
172148
|
-
"description": "`<lr-tooltip>` — a localized, hover/focus tooltip for a consumer-owned trigger.\nPlain content uses tooltip semantics. When the default slot contains an actionable descendant,\nthe popup promotes to a named dialog and remains open while pointer or focus is inside so its\ncontrols can be reached. Prefer `<lr-popover>` when click-to-open ownership is desired.",
|
|
172252
|
+
"description": "`<lr-tooltip>` — a localized, hover/focus tooltip for a consumer-owned trigger.\nPlain content uses tooltip semantics. When the default slot contains an actionable descendant,\nthe popup promotes to a named dialog and remains open while pointer or focus is inside so its\ncontrols can be reached. Prefer `<lr-popover>` when click-to-open ownership is desired.\n\nWhile open, the trigger's `aria-describedby` targets a hidden text proxy in this component's\nlight DOM rather than the shadow-private popup. Native triggers can resolve that ID directly;\n`<lr-button>` and `<lr-icon-button>` reflect it onto their focused internal controls through\n`ariaDescribedByElements`, where the serialized internal attribute is intentionally empty.",
|
|
172149
172253
|
"name": "LyraTooltip",
|
|
172150
172254
|
"cssProperties": [
|
|
172151
172255
|
{
|
|
@@ -172247,6 +172351,20 @@
|
|
|
172247
172351
|
"text": "number"
|
|
172248
172352
|
}
|
|
172249
172353
|
},
|
|
172354
|
+
{
|
|
172355
|
+
"kind": "field",
|
|
172356
|
+
"name": "descriptionId",
|
|
172357
|
+
"privacy": "private",
|
|
172358
|
+
"readonly": true
|
|
172359
|
+
},
|
|
172360
|
+
{
|
|
172361
|
+
"kind": "field",
|
|
172362
|
+
"name": "descriptionProxy",
|
|
172363
|
+
"type": {
|
|
172364
|
+
"text": "HTMLSpanElement | undefined"
|
|
172365
|
+
},
|
|
172366
|
+
"privacy": "private"
|
|
172367
|
+
},
|
|
172250
172368
|
{
|
|
172251
172369
|
"kind": "field",
|
|
172252
172370
|
"name": "distance",
|
|
@@ -172628,6 +172746,16 @@
|
|
|
172628
172746
|
"module": "src/internal/lyra-element.ts"
|
|
172629
172747
|
}
|
|
172630
172748
|
},
|
|
172749
|
+
{
|
|
172750
|
+
"kind": "method",
|
|
172751
|
+
"name": "ensureDescriptionProxy",
|
|
172752
|
+
"privacy": "private",
|
|
172753
|
+
"return": {
|
|
172754
|
+
"type": {
|
|
172755
|
+
"text": "void"
|
|
172756
|
+
}
|
|
172757
|
+
}
|
|
172758
|
+
},
|
|
172631
172759
|
{
|
|
172632
172760
|
"kind": "method",
|
|
172633
172761
|
"name": "isPopupTarget",
|
|
@@ -172873,6 +173001,16 @@
|
|
|
172873
173001
|
}
|
|
172874
173002
|
]
|
|
172875
173003
|
},
|
|
173004
|
+
{
|
|
173005
|
+
"kind": "method",
|
|
173006
|
+
"name": "updateDescriptionProxy",
|
|
173007
|
+
"privacy": "private",
|
|
173008
|
+
"return": {
|
|
173009
|
+
"type": {
|
|
173010
|
+
"text": "void"
|
|
173011
|
+
}
|
|
173012
|
+
}
|
|
173013
|
+
},
|
|
172876
173014
|
{
|
|
172877
173015
|
"kind": "method",
|
|
172878
173016
|
"name": "updateInteractiveContent",
|
|
@@ -23,13 +23,16 @@ export type ButtonType = 'button' | 'submit' | 'reset';
|
|
|
23
23
|
* native `<button>`.
|
|
24
24
|
*
|
|
25
25
|
* `accessibleLabel` (attribute `aria-label`) is forwarded reactively to the internal button/anchor
|
|
26
|
-
* as a literal string (for an icon-only button with no visible label)
|
|
27
|
-
* `aria-labelledby
|
|
26
|
+
* as a literal string (for an icon-only button with no visible label). Host `aria-describedby`
|
|
27
|
+
* IDREFs are resolved through `ariaDescribedByElements`; external `aria-labelledby` is not copied
|
|
28
|
+
* across the shadow boundary.
|
|
28
29
|
* Host `aria-haspopup` and `aria-expanded` values are likewise forwarded to the internal semantic
|
|
29
30
|
* control. When host `aria-controls` names elements in the host's own root, the controls
|
|
30
31
|
* relationship is resolved onto the internal control through the reflected element-reference API
|
|
31
|
-
* so it remains valid across this component's shadow boundary
|
|
32
|
-
* the
|
|
32
|
+
* so it remains valid across this component's shadow boundary. Assigning that relationship
|
|
33
|
+
* intentionally clears the serialized `aria-controls` value; read `ariaControlsElements` in a
|
|
34
|
+
* supporting browser. Browsers without that API retain the forwarded string attribute as a
|
|
35
|
+
* best-effort fallback.
|
|
33
36
|
*
|
|
34
37
|
* @customElement lr-button
|
|
35
38
|
* @slot - Default slot: the button's label content.
|
|
@@ -119,6 +122,7 @@ export declare class LyraButton extends LyraElement {
|
|
|
119
122
|
};
|
|
120
123
|
private _fieldsetDisabled;
|
|
121
124
|
private _disabled;
|
|
125
|
+
private hasSyncedDescribedByElements;
|
|
122
126
|
get disabled(): boolean;
|
|
123
127
|
set disabled(next: boolean);
|
|
124
128
|
/** Whether the button is disabled explicitly or by an ancestor fieldset. */
|
|
@@ -131,6 +135,7 @@ export declare class LyraButton extends LyraElement {
|
|
|
131
135
|
private triggerHasPopup;
|
|
132
136
|
private triggerExpanded;
|
|
133
137
|
private triggerControls;
|
|
138
|
+
private triggerDescribedBy;
|
|
134
139
|
/** Tone vocabulary shared with `<lr-chip>`/`<lr-avatar>`'s own `tone` property, named
|
|
135
140
|
* `variant` here (not `tone`) to keep the component's semantic tone vocabulary consistent. */
|
|
136
141
|
variant: ButtonVariant;
|
|
@@ -201,6 +206,7 @@ export declare class LyraButton extends LyraElement {
|
|
|
201
206
|
private onStartSlotChange;
|
|
202
207
|
private onEndSlotChange;
|
|
203
208
|
protected updated(changed: PropertyValues): void;
|
|
209
|
+
private syncDescribedByElements;
|
|
204
210
|
render(): TemplateResult;
|
|
205
211
|
}
|
|
206
212
|
declare global {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"button.class.d.ts","sourceRoot":"","sources":["../../../../src/components/forms/button/button.class.ts"],"names":[],"mappings":"AAAA,OAAO,EAAiB,KAAK,cAAc,EAAE,KAAK,cAAc,EAAE,MAAM,KAAK,CAAC;AAE9E,OAAO,EAAE,WAAW,EAAE,MAAM,mCAAmC,CAAC;
|
|
1
|
+
{"version":3,"file":"button.class.d.ts","sourceRoot":"","sources":["../../../../src/components/forms/button/button.class.ts"],"names":[],"mappings":"AAAA,OAAO,EAAiB,KAAK,cAAc,EAAE,KAAK,cAAc,EAAE,MAAM,KAAK,CAAC;AAE9E,OAAO,EAAE,WAAW,EAAE,MAAM,mCAAmC,CAAC;AAShE,MAAM,MAAM,aAAa,GAAG,SAAS,GAAG,OAAO,GAAG,SAAS,GAAG,SAAS,GAAG,QAAQ,CAAC;AACnF,MAAM,MAAM,gBAAgB,GAAG,QAAQ,GAAG,QAAQ,GAAG,UAAU,GAAG,OAAO,GAAG,MAAM,GAAG,OAAO,CAAC;AAC7F,MAAM,MAAM,UAAU,GAAG,KAAK,GAAG,IAAI,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,IAAI,CAAC;AAC/D,MAAM,MAAM,UAAU,GAAG,QAAQ,GAAG,QAAQ,GAAG,OAAO,CAAC;AAEvD;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAyGG;AACH,qBAAa,UAAW,SAAQ,WAAW;IACzC,OAAgB,MAAM,iCAAgC;IAOtD,MAAM,CAAC,cAAc,UAAQ;IAE7B,OAAgB,UAAU;QACxB,QAAQ;YAAI,IAAI;YAAW,OAAO;YAAQ,UAAU;;MACpD;IAEF,OAAO,CAAC,iBAAiB,CAAS;IAClC,OAAO,CAAC,SAAS,CAAS;IAC1B,OAAO,CAAC,4BAA4B,CAAS;IAE7C,IAAI,QAAQ,IAAI,OAAO,CAEtB;IACD,IAAI,QAAQ,CAAC,IAAI,EAAE,OAAO,EAKzB;IAED,4EAA4E;IAC5E,IAAI,iBAAiB,IAAI,OAAO,CAE/B;IAED,cAiBC;IAED;;+CAE2C;IACJ,eAAe,EAAE,MAAM,GAAG,IAAI,CAAQ;IACnC,OAAO,CAAC,eAAe,CAAuB;IAC9C,OAAO,CAAC,eAAe,CAAuB;IAC9C,OAAO,CAAC,eAAe,CAAuB;IAC3C,OAAO,CAAC,kBAAkB,CAAuB;IAE9F;mGAC+F;IAClE,OAAO,EAAE,aAAa,CAAa;IAChE;;;;;;;;;kCAS8B;IACD,UAAU,EAAE,gBAAgB,CAAY;IACrE;;6DAEyD;IAC5B,IAAI,EAAE,UAAU,CAAO;IACpD;0FACsF;IAC1E,IAAI,EAAE,UAAU,CAAY;IACxC;;sFAEkF;IACtC,OAAO,UAAS;IAE5D;;;;;;;;yGAQqG;IACzF,IAAI,CAAC,EAAE,MAAM,CAAC;IAC1B;;;2EAGuE;IAC3D,MAAM,CAAC,EAAE,MAAM,CAAC;IAC5B;2BACuB;IACX,QAAQ,CAAC,EAAE,MAAM,CAAC;IAE9B;;;;0FAIsF;IAC7E,OAAO,CAAC,YAAY,CAAS;IAC7B,OAAO,CAAC,UAAU,CAAS;IAIZ,OAAO,CAAC,MAAM,CAAC,CAAwC;IAE/E;;;sCAGkC;IACzB,KAAK,IAAI,IAAI,CAGrB;IAEQ,KAAK,CAAC,OAAO,CAAC,EAAE,YAAY,GAAG,IAAI,CAE3C;IAEQ,IAAI,IAAI,IAAI,CAEpB;IAED,OAAO,CAAC,OAAO,CAMb;IAEF;;;;;OAKG;IACH,oBAAoB,CAAC,QAAQ,EAAE,OAAO,GAAG,IAAI,CAG5C;IAED,UAAmB,UAAU,CAAC,OAAO,EAAE,cAAc,GAAG,IAAI,CAU3D;IAED,OAAO,CAAC,iBAAiB,CAEvB;IAEF,OAAO,CAAC,eAAe,CAErB;IAEF,UAAmB,OAAO,CAAC,OAAO,EAAE,cAAc,GAAG,IAAI,CAIxD;IAED,OAAO,CAAC,uBAAuB;IAStB,MAAM,IAAI,cAAc,CA2DhC;CACF;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,WAAW,EAAE,UAAU,CAAC;KACzB;CACF"}
|
|
@@ -9,7 +9,7 @@ import { property, query, state } from 'lit/decorators.js';
|
|
|
9
9
|
import { LyraElement } from '../../../internal/lyra-element.js';
|
|
10
10
|
import { spinnerIcon } from '../../../internal/icons.js';
|
|
11
11
|
import { safeDownloadHref, safeLinkHref } from '../../../internal/safe-url.js';
|
|
12
|
-
import { syncAriaControlsElements } from '../../../internal/aria-controls.js';
|
|
12
|
+
import { syncAriaControlsElements, syncAriaDescribedByElements, } from '../../../internal/aria-controls.js';
|
|
13
13
|
import { styles } from './button.styles.js';
|
|
14
14
|
/**
|
|
15
15
|
* `<lr-button>` — a generic action-button primitive. Renders an internal native
|
|
@@ -30,13 +30,16 @@ import { styles } from './button.styles.js';
|
|
|
30
30
|
* native `<button>`.
|
|
31
31
|
*
|
|
32
32
|
* `accessibleLabel` (attribute `aria-label`) is forwarded reactively to the internal button/anchor
|
|
33
|
-
* as a literal string (for an icon-only button with no visible label)
|
|
34
|
-
* `aria-labelledby
|
|
33
|
+
* as a literal string (for an icon-only button with no visible label). Host `aria-describedby`
|
|
34
|
+
* IDREFs are resolved through `ariaDescribedByElements`; external `aria-labelledby` is not copied
|
|
35
|
+
* across the shadow boundary.
|
|
35
36
|
* Host `aria-haspopup` and `aria-expanded` values are likewise forwarded to the internal semantic
|
|
36
37
|
* control. When host `aria-controls` names elements in the host's own root, the controls
|
|
37
38
|
* relationship is resolved onto the internal control through the reflected element-reference API
|
|
38
|
-
* so it remains valid across this component's shadow boundary
|
|
39
|
-
* the
|
|
39
|
+
* so it remains valid across this component's shadow boundary. Assigning that relationship
|
|
40
|
+
* intentionally clears the serialized `aria-controls` value; read `ariaControlsElements` in a
|
|
41
|
+
* supporting browser. Browsers without that API retain the forwarded string attribute as a
|
|
42
|
+
* best-effort fallback.
|
|
40
43
|
*
|
|
41
44
|
* @customElement lr-button
|
|
42
45
|
* @slot - Default slot: the button's label content.
|
|
@@ -143,6 +146,7 @@ export class LyraButton extends LyraElement {
|
|
|
143
146
|
super();
|
|
144
147
|
this._fieldsetDisabled = false;
|
|
145
148
|
this._disabled = false;
|
|
149
|
+
this.hasSyncedDescribedByElements = false;
|
|
146
150
|
/** Accessible name forwarded to the internal native button or anchor. Bound to the host's
|
|
147
151
|
* `aria-label` content attribute so changing or removing that attribute after mount keeps the
|
|
148
152
|
* actual focused control synchronized. */
|
|
@@ -150,6 +154,7 @@ export class LyraButton extends LyraElement {
|
|
|
150
154
|
this.triggerHasPopup = null;
|
|
151
155
|
this.triggerExpanded = null;
|
|
152
156
|
this.triggerControls = null;
|
|
157
|
+
this.triggerDescribedBy = null;
|
|
153
158
|
/** Tone vocabulary shared with `<lr-chip>`/`<lr-avatar>`'s own `tone` property, named
|
|
154
159
|
* `variant` here (not `tone`) to keep the component's semantic tone vocabulary consistent. */
|
|
155
160
|
this.variant = 'neutral';
|
|
@@ -252,6 +257,12 @@ export class LyraButton extends LyraElement {
|
|
|
252
257
|
updated(changed) {
|
|
253
258
|
super.updated(changed);
|
|
254
259
|
syncAriaControlsElements(this, this.baseEl, this.triggerControls);
|
|
260
|
+
this.syncDescribedByElements();
|
|
261
|
+
}
|
|
262
|
+
syncDescribedByElements() {
|
|
263
|
+
if (!this.triggerDescribedBy && !this.hasSyncedDescribedByElements)
|
|
264
|
+
return;
|
|
265
|
+
this.hasSyncedDescribedByElements = syncAriaDescribedByElements(this, this.baseEl, this.triggerDescribedBy);
|
|
255
266
|
}
|
|
256
267
|
render() {
|
|
257
268
|
// Shared inner content, rendered identically in both roots so the extracted variable produces
|
|
@@ -287,6 +298,7 @@ export class LyraButton extends LyraElement {
|
|
|
287
298
|
aria-haspopup=${this.triggerHasPopup ?? nothing}
|
|
288
299
|
aria-expanded=${this.triggerExpanded ?? nothing}
|
|
289
300
|
aria-controls=${this.triggerControls || nothing}
|
|
301
|
+
aria-describedby=${this.triggerDescribedBy || nothing}
|
|
290
302
|
aria-disabled=${disabled ? 'true' : nothing}
|
|
291
303
|
aria-busy=${this.loading ? 'true' : 'false'}
|
|
292
304
|
tabindex=${disabled ? '-1' : nothing}
|
|
@@ -301,6 +313,7 @@ export class LyraButton extends LyraElement {
|
|
|
301
313
|
aria-haspopup=${this.triggerHasPopup ?? nothing}
|
|
302
314
|
aria-expanded=${this.triggerExpanded ?? nothing}
|
|
303
315
|
aria-controls=${this.triggerControls || nothing}
|
|
316
|
+
aria-describedby=${this.triggerDescribedBy || nothing}
|
|
304
317
|
aria-busy=${this.loading ? 'true' : 'false'}
|
|
305
318
|
?disabled=${this.effectiveDisabled || this.loading}
|
|
306
319
|
@click=${this.onClick}
|
|
@@ -322,6 +335,9 @@ __decorate([
|
|
|
322
335
|
__decorate([
|
|
323
336
|
property({ attribute: 'aria-controls' })
|
|
324
337
|
], LyraButton.prototype, "triggerControls", void 0);
|
|
338
|
+
__decorate([
|
|
339
|
+
property({ attribute: 'aria-describedby' })
|
|
340
|
+
], LyraButton.prototype, "triggerDescribedBy", void 0);
|
|
325
341
|
__decorate([
|
|
326
342
|
property({ reflect: true })
|
|
327
343
|
], LyraButton.prototype, "variant", void 0);
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"button.class.js","sourceRoot":"","sources":["../../../../src/components/forms/button/button.class.ts"],"names":[],"mappings":";;;;;;AAAA,OAAO,EAAE,IAAI,EAAE,OAAO,EAA4C,MAAM,KAAK,CAAC;AAC9E,OAAO,EAAE,QAAQ,EAAE,KAAK,EAAE,KAAK,EAAE,MAAM,mBAAmB,CAAC;AAC3D,OAAO,EAAE,WAAW,EAAE,MAAM,mCAAmC,CAAC;AAChE,OAAO,EAAE,WAAW,EAAE,MAAM,4BAA4B,CAAC;AACzD,OAAO,EAAE,gBAAgB,EAAE,YAAY,EAAE,MAAM,+BAA+B,CAAC;AAC/E,OAAO,
|
|
1
|
+
{"version":3,"file":"button.class.js","sourceRoot":"","sources":["../../../../src/components/forms/button/button.class.ts"],"names":[],"mappings":"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"}
|
|
@@ -33,9 +33,9 @@ export interface LyraCheckboxEventMap {
|
|
|
33
33
|
* checkbox, the same as clicking a native checkbox's associated `<label>`.
|
|
34
34
|
* If left empty, set `aria-label` on the host so the control still has an
|
|
35
35
|
* accessible name.
|
|
36
|
-
* A host `aria-describedby` attribute is
|
|
37
|
-
* `
|
|
38
|
-
*
|
|
36
|
+
* A host `aria-describedby` attribute is resolved onto the internal `role="checkbox"` through
|
|
37
|
+
* `ariaDescribedByElements` so externally-owned descriptions remain valid across the shadow
|
|
38
|
+
* boundary.
|
|
39
39
|
* @event input - The user toggled the checkbox; bubbling and composed like a native form event.
|
|
40
40
|
* @event change - Fired immediately after `input` for the same user toggle.
|
|
41
41
|
* @event lr-change - Compatibility alias fired after `input` and `change` (click or Space).
|
|
@@ -97,6 +97,7 @@ export declare class LyraCheckbox extends LyraElement<LyraCheckboxEventMap> {
|
|
|
97
97
|
private internals;
|
|
98
98
|
private validityController;
|
|
99
99
|
private labelObserver?;
|
|
100
|
+
private hasSyncedDescribedByElements;
|
|
100
101
|
private _defaultChecked;
|
|
101
102
|
private _defaultCaptured;
|
|
102
103
|
private _fieldsetDisabled;
|
|
@@ -131,6 +132,7 @@ export declare class LyraCheckbox extends LyraElement<LyraCheckboxEventMap> {
|
|
|
131
132
|
connectedCallback(): void;
|
|
132
133
|
disconnectedCallback(): void;
|
|
133
134
|
protected willUpdate(changed: PropertyValues): void;
|
|
135
|
+
protected updated(changed: PropertyValues): void;
|
|
134
136
|
private updateValidity;
|
|
135
137
|
private reflectInvalid;
|
|
136
138
|
private syncFormState;
|