@aceshooting/lyra-ui 21.0.0 → 21.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 +56 -0
- package/README.md +6 -3
- package/custom-elements.json +1 -1
- package/dist/ai/runtime.js +1 -1
- package/dist/ai/types.d.ts +13 -5
- package/dist/cli/lyra-rename-ledger.mjs +1 -0
- package/dist/cli/migrate-wa.mjs +33 -13
- package/dist/cli/migration-contract.json +1 -1
- package/dist/components/agent-tools/agent-trace/agent-trace.class.d.ts +5 -3
- package/dist/components/agent-tools/agent-trace/agent-trace.class.js +3 -2
- package/dist/components/agent-tools/tool-call-block/tool-call-block.class.d.ts +15 -3
- package/dist/components/agent-tools/tool-call-block/tool-call-block.class.js +3 -3
- package/dist/components/agent-tools/tool-call-chip/tool-call-chip.class.d.ts +24 -8
- package/dist/components/agent-tools/tool-call-chip/tool-call-chip.class.js +3 -3
- package/dist/components/agent-tools/tool-param-form/tool-param-form.class.js +4 -0
- package/dist/components/agent-tools/tool-result-dialog/tool-result-dialog.class.d.ts +9 -5
- package/dist/components/agent-tools/tool-result-dialog/tool-result-dialog.class.js +2 -2
- package/dist/components/agent-tools/tool-result-dialog/tool-result-dialog.styles.js +1 -1
- package/dist/components/agent-tools/tool-status.js +2 -2
- package/dist/components/agent-tools/tool-timeline/tool-timeline.class.d.ts +8 -0
- package/dist/components/agent-tools/tool-timeline/tool-timeline.class.js +3 -2
- package/dist/components/agent-tools/tool-timeline/tool-timeline.styles.js +1 -1
- package/dist/components/agent-tools/trace-tree/span.d.ts +2 -2
- package/dist/components/charts/chart/box-plot.class.d.ts +3 -1
- package/dist/components/charts/chart/box-plot.class.js +9 -9
- package/dist/components/charts/chart/chart-bidi.d.ts +109 -0
- package/dist/components/charts/chart/chart-bidi.js +1 -0
- package/dist/components/charts/chart/chart.class.d.ts +17 -2
- package/dist/components/charts/chart/chart.class.js +10 -8
- package/dist/components/charts/chart/histogram.class.js +1 -1
- package/dist/components/charts/chart/lite-chart.class.d.ts +24 -5
- package/dist/components/charts/chart/lite-chart.class.js +9 -9
- package/dist/components/charts/chart/lite-chart.styles.js +1 -1
- package/dist/components/conversation/code-block/shiki-dark-theme.d.ts +2 -2
- package/dist/components/conversation/code-block/shiki-dark-theme.js +1 -1
- package/dist/components/conversation/conversation-item/conversation-item.class.d.ts +18 -2
- package/dist/components/conversation/conversation-item/conversation-item.class.js +3 -3
- package/dist/components/conversation/conversation-item/conversation-item.styles.js +1 -1
- package/dist/components/conversation/markdown/markdown-base.class.js +1 -1
- package/dist/components/conversation/markdown/markdown-core.class.d.ts +3 -1
- package/dist/components/conversation/markdown/markdown.class.d.ts +3 -1
- package/dist/components/conversation/message-actions/message-actions.class.d.ts +7 -2
- package/dist/components/conversation/message-actions/message-actions.class.js +2 -2
- package/dist/components/conversation/message-parts/message-parts.class.d.ts +6 -2
- package/dist/components/conversation/message-parts/message-parts.class.js +5 -3
- package/dist/components/conversation/selection-toolbar/selection-toolbar.class.d.ts +3 -2
- package/dist/components/conversation/selection-toolbar/selection-toolbar.class.js +1 -1
- package/dist/components/conversation/streaming-text/streaming-text-base.class.d.ts +1 -5
- package/dist/components/conversation/streaming-text/streaming-text-base.class.js +2 -2
- package/dist/components/conversation/streaming-text/streaming-text-core.class.d.ts +7 -1
- package/dist/components/conversation/streaming-text/streaming-text-core.class.js +3 -4
- package/dist/components/conversation/streaming-text/streaming-text.class.d.ts +7 -1
- package/dist/components/conversation/streaming-text/streaming-text.class.js +3 -4
- package/dist/components/conversation/thread-list/thread-list.class.d.ts +13 -2
- package/dist/components/conversation/thread-list/thread-list.class.js +3 -3
- package/dist/components/data/data-grid/data-grid.class.js +1 -1
- package/dist/components/data/document-library/document-library.class.js +2 -0
- package/dist/components/data/flow-canvas/flow-canvas.class.js +1 -1
- package/dist/components/data/flow-minimap/flow-minimap.class.js +1 -1
- package/dist/components/data/flow-node/flow-node.class.d.ts +6 -2
- package/dist/components/data/flow-node/flow-node.class.js +6 -2
- package/dist/components/data/flow-node/flow-node.styles.js +1 -1
- package/dist/components/data/gauge/gauge.styles.js +1 -1
- package/dist/components/data/heatmap/heatmap.class.d.ts +3 -0
- package/dist/components/data/heatmap/heatmap.class.js +2 -2
- package/dist/components/data/heatmap/heatmap.styles.js +1 -1
- package/dist/components/data/sparkline/sparkline.class.d.ts +5 -3
- package/dist/components/data/stat/stat.class.d.ts +4 -3
- package/dist/components/data/table/table.class.d.ts +32 -5
- package/dist/components/data/table/table.class.js +3 -2
- package/dist/components/forms/button/button.class.d.ts +7 -1
- package/dist/components/forms/button/button.styles.js +1 -1
- package/dist/components/forms/date-picker/date-input.styles.js +1 -1
- package/dist/components/forms/input/input.styles.js +1 -1
- package/dist/components/forms/rubric-form/rubric-form.class.js +1 -0
- package/dist/components/layout/app-rail/app-rail.class.d.ts +50 -11
- package/dist/components/layout/app-rail/app-rail.class.js +2 -2
- package/dist/components/layout/command-palette/command-palette.class.js +1 -1
- package/dist/components/layout/menu/menu.class.d.ts +6 -5
- package/dist/components/layout/split-panel/split-panel.class.d.ts +2 -1
- package/dist/components/media/flag/language-map.d.ts +8 -0
- package/dist/components/media/flag/language-map.js +1 -1
- package/dist/components/media/map/map-loader.d.ts +7 -1
- package/dist/components/media/map/map.class.d.ts +111 -5
- package/dist/components/media/map/map.class.js +3 -3
- package/dist/components/media/media-card/media-card.class.d.ts +18 -5
- package/dist/components/media/media-card/media-card.class.js +1 -1
- package/dist/components/overlays/overlay/popover.class.d.ts +20 -0
- package/dist/components/overlays/overlay/popover.class.js +2 -2
- package/dist/components/retrieval/graph/graph.class.d.ts +3 -3
- package/dist/components/retrieval/graph/graph.class.js +1 -1
- package/dist/components/retrieval/knowledge-graph-explorer/knowledge-graph-explorer.class.d.ts +5 -3
- package/dist/components/retrieval/knowledge-graph-explorer/knowledge-graph-explorer.class.js +3 -2
- package/dist/components/retrieval/mind-map/mind-map.class.d.ts +3 -3
- package/dist/components/retrieval/mind-map/mind-map.class.js +1 -1
- package/dist/components/retrieval/retrieval-results/retrieval-results.class.d.ts +4 -1
- package/dist/components/retrieval/retrieval-results/retrieval-results.class.js +5 -1
- package/dist/components/retrieval/source-picker/source-picker.class.d.ts +4 -1
- package/dist/components/retrieval/source-picker/source-picker.class.js +5 -1
- package/dist/components/utility/icon/icon.class.d.ts +9 -3
- package/dist/components/utility/icon/icon.class.js +1 -1
- package/dist/components/utility/mutation-observer/mutation-observer.class.d.ts +14 -8
- package/dist/components/utility/mutation-observer/mutation-observer.class.js +1 -1
- package/dist/components/viewers/document-viewer/document-viewer.class.d.ts +6 -1
- package/dist/components/viewers/document-viewer/document-viewer.class.js +7 -1
- package/dist/components/viewers/document-viewer/registry.d.ts +12 -3
- package/dist/components/viewers/geojson-view/geojson-view.class.d.ts +13 -5
- package/dist/components/viewers/geojson-view/geojson-view.class.js +1 -1
- package/dist/components/viewers/geojson-view/geojson-viewer.class.d.ts +3 -2
- package/dist/custom-elements-jsx.d.ts +1 -1
- package/dist/events.d.ts +644 -1242
- package/dist/internal/anchored-overlay-runtime.d.ts +2 -2
- package/dist/internal/cell-range.d.ts +0 -6
- package/dist/internal/cell-range.js +1 -1
- package/dist/internal/css-token-length.d.ts +7 -0
- package/dist/internal/css-token-length.js +1 -0
- package/dist/internal/default-strings.generated.d.ts +1 -1
- package/dist/internal/default-strings.generated.js +1 -1
- package/dist/internal/deferred-focus-return.d.ts +7 -4
- package/dist/internal/deferred-focus-return.js +1 -1
- package/dist/internal/dev-mode-attribute-warning.d.ts +35 -0
- package/dist/internal/dev-mode-attribute-warning.js +1 -1
- package/dist/internal/localization-runtime.js +1 -1
- package/dist/internal/localization-types.d.ts +1 -1
- package/dist/internal/localization.js +2 -2
- package/dist/internal/package-metadata.d.ts +1 -1
- package/dist/internal/package-metadata.js +1 -1
- package/dist/internal/papaparse-loader.d.ts +1 -1
- package/dist/internal/papaparse-loader.js +1 -1
- package/dist/internal/positioner.d.ts +10 -0
- package/dist/internal/positioner.js +1 -1
- package/dist/internal/shared-unions.d.ts +2 -1
- package/dist/internal/slotted-overlay-controller.d.ts +20 -0
- package/dist/internal/slotted-overlay-controller.js +1 -0
- package/dist/internal/text-quote.d.ts +1 -1
- package/dist/internal/text-quote.js +1 -1
- package/dist/internal/theme-observation.d.ts +4 -0
- package/dist/internal/theme-observation.js +1 -0
- package/dist/internal/theme-watcher.js +1 -1
- package/dist/localization.d.ts +6 -1
- package/dist/localization.js +1 -1
- package/dist/lyra.d.ts +1 -1
- package/dist/lyra.js +1 -1
- package/dist/svelte.d.ts +1 -1
- package/dist/testing/lyra-tag-event-map.js +1 -1
- package/dist/translations/ar/agent-tools.js +1 -1
- package/dist/translations/cs/agent-tools.js +1 -1
- package/dist/translations/da/agent-tools.js +1 -1
- package/dist/translations/de/agent-tools.js +1 -1
- package/dist/translations/de-CH/agent-tools.js +1 -1
- package/dist/translations/es/agent-tools.js +1 -1
- package/dist/translations/fa/agent-tools.js +1 -1
- package/dist/translations/fi/agent-tools.js +1 -1
- package/dist/translations/fr/agent-tools.js +1 -1
- package/dist/translations/he/agent-tools.js +1 -1
- package/dist/translations/hi/agent-tools.js +1 -1
- package/dist/translations/hr/agent-tools.js +1 -1
- package/dist/translations/hu/agent-tools.js +1 -1
- package/dist/translations/id/agent-tools.js +1 -1
- package/dist/translations/it/agent-tools.js +1 -1
- package/dist/translations/ja/agent-tools.js +1 -1
- package/dist/translations/kk/agent-tools.js +1 -1
- package/dist/translations/ko/agent-tools.js +1 -1
- package/dist/translations/nb/agent-tools.js +1 -1
- package/dist/translations/nl/agent-tools.js +1 -1
- package/dist/translations/nn/agent-tools.js +1 -1
- package/dist/translations/pl/agent-tools.js +1 -1
- package/dist/translations/pt-BR/agent-tools.js +1 -1
- package/dist/translations/pt-PT/agent-tools.js +1 -1
- package/dist/translations/pt-PT/charts.js +1 -1
- package/dist/translations/pt-PT/conversation.js +1 -1
- package/dist/translations/pt-PT/data.js +1 -1
- package/dist/translations/pt-PT/forms.js +1 -1
- package/dist/translations/pt-PT/layout.js +1 -1
- package/dist/translations/pt-PT/media.js +1 -1
- package/dist/translations/pt-PT/retrieval.js +1 -1
- package/dist/translations/pt-PT/shared.js +1 -1
- package/dist/translations/pt-PT/utility.js +1 -1
- package/dist/translations/pt-PT/viewers.js +2 -2
- package/dist/translations/ro/agent-tools.js +1 -1
- package/dist/translations/ru/agent-tools.js +1 -1
- package/dist/translations/sl/agent-tools.js +1 -1
- package/dist/translations/sv/agent-tools.js +1 -1
- package/dist/translations/tr/agent-tools.js +1 -1
- package/dist/translations/uk/agent-tools.js +1 -1
- package/dist/translations/zh-CN/agent-tools.js +1 -1
- package/dist/translations/zh-TW/agent-tools.js +1 -1
- package/dist/utilities/index.d.ts +1 -1
- package/dist/utilities/index.js +1 -1
- package/dist/utilities/localization.d.ts +28 -10
- package/dist/vue.d.ts +1 -1
- package/llms/components/lr-accordion-item.md +2 -344
- package/llms/components/lr-accordion.md +2 -344
- package/llms/components/lr-app-rail-group.md +2 -721
- package/llms/components/lr-app-rail-item.md +2 -721
- package/llms/components/lr-app-rail.md +29 -4
- package/llms/components/lr-bar-chart.md +2 -87
- package/llms/components/lr-box-plot.md +1 -1
- package/llms/components/lr-breadcrumb-item.md +2 -67
- package/llms/components/lr-bubble-chart.md +2 -87
- package/llms/components/lr-button.md +7 -0
- package/llms/components/lr-chart.md +4 -5
- package/llms/components/lr-chip-group.md +2 -272
- package/llms/components/lr-conversation-item.md +20 -2
- package/llms/components/lr-date-input.md +2 -457
- package/llms/components/lr-date-picker.md +6 -2
- package/llms/components/lr-document-library.md +3 -3
- package/llms/components/lr-document-viewer.md +14 -5
- package/llms/components/lr-doughnut-chart.md +2 -87
- package/llms/components/lr-dropdown-item.md +2 -306
- package/llms/components/lr-dropdown.md +6 -0
- package/llms/components/lr-flag.md +9 -1
- package/llms/components/lr-flow-node.md +4 -1
- package/llms/components/lr-geojson-view.md +3 -90
- package/llms/components/lr-geojson-viewer.md +13 -5
- package/llms/components/lr-icon-button.md +4 -1
- package/llms/components/lr-icon.md +14 -6
- package/llms/components/lr-input.md +9 -2
- package/llms/components/lr-lite-chart.md +17 -9
- package/llms/components/lr-map.md +87 -2
- package/llms/components/lr-markdown-core.md +5 -4
- package/llms/components/lr-markdown.md +4 -2
- package/llms/components/lr-media-card.md +10 -5
- package/llms/components/lr-menu-item.md +2 -306
- package/llms/components/lr-menu.md +9 -6
- package/llms/components/lr-menubar-item.md +2 -125
- package/llms/components/lr-message-actions.md +4 -1
- package/llms/components/lr-message-parts.md +14 -5
- package/llms/components/lr-mutation-observer.md +12 -6
- package/llms/components/lr-navigation-menu-item.md +2 -237
- package/llms/components/lr-number-input.md +4 -0
- package/llms/components/lr-option.md +2 -712
- package/llms/components/lr-pie-chart.md +2 -87
- package/llms/components/lr-polar-area-chart.md +2 -87
- package/llms/components/lr-popover.md +10 -0
- package/llms/components/lr-prompt-input.md +5 -1
- package/llms/components/lr-radar-chart.md +2 -87
- package/llms/components/lr-reorder-item.md +2 -157
- package/llms/components/lr-result-field.md +2 -117
- package/llms/components/lr-retrieval-results.md +3 -1
- package/llms/components/lr-rubric-form.md +3 -2
- package/llms/components/lr-scatter-chart.md +2 -87
- package/llms/components/lr-selection-toolbar.md +4 -2
- package/llms/components/lr-source-card.md +2 -186
- package/llms/components/lr-source-picker.md +3 -1
- package/llms/components/lr-sparkline.md +9 -4
- package/llms/components/lr-split-panel.md +5 -3
- package/llms/components/lr-stat.md +4 -3
- package/llms/components/lr-streaming-text-core.md +7 -5
- package/llms/components/lr-streaming-text.md +9 -6
- package/llms/components/lr-swatch-picker.md +130 -0
- package/llms/components/lr-tag.md +2 -177
- package/llms/components/lr-thread-list.md +27 -4
- package/llms/components/lr-timeline-item.md +2 -120
- package/llms/components/lr-toast-item.md +2 -223
- package/llms/components/lr-tool-call-block.md +12 -3
- package/llms/components/lr-tool-call-chip.md +12 -6
- package/llms/components/lr-tool-param-form.md +3 -2
- package/llms/components/lr-tool-result-dialog.md +7 -3
- package/llms/components/lr-tool-result-view.md +4 -3
- package/llms/components/lr-tool-timeline.md +12 -5
- package/llms/components/lr-tree-item.md +2 -354
- package/llms/index.md +22 -4
- package/llms/migration.md +75 -1
- package/llms/peers.md +1 -1
- package/llms/shared.md +86 -39
- package/llms-full.txt +739 -163
- package/package.json +6 -6
- package/registrations.json +1 -1
- package/vscode-css-data.json +1 -1
- package/vscode-html-data.json +1 -1
- package/web-types.json +1 -1
|
@@ -29,11 +29,17 @@ its content.
|
|
|
29
29
|
**Properties:**
|
|
30
30
|
|
|
31
31
|
- `name: string = ''` — the tool/function name, e.g. `web_search`
|
|
32
|
+
- `displayName?: string` (attribute `display-name`, 21.1.0) — the application's own,
|
|
33
|
+
already-translated label for the tool (e.g. `Lecture d’un fichier`). It replaces `name` in the
|
|
34
|
+
visible `name` part and the chip's accessible name only; `lr-tool-call-chip-select` still reports
|
|
35
|
+
the raw `name`. Unset or empty shows `name`
|
|
32
36
|
- `category: string = ''` — optional grouping label, e.g. `research`
|
|
33
|
-
- `status: 'pending'|'running'|'success'|'error'|'denied' = 'pending'` (reflected) —
|
|
34
|
-
glyph, accent color, and `status-text`; same status vocabulary as
|
|
35
|
-
call's chip and its detail dialog always agree;
|
|
36
|
-
|
|
37
|
+
- `status: 'pending'|'running'|'success'|'error'|'denied'|'incomplete' = 'pending'` (reflected) —
|
|
38
|
+
drives the glyph, accent color, and `status-text`; same status vocabulary as
|
|
39
|
+
`<lr-tool-result-dialog>` so a call's chip and its detail dialog always agree; `incomplete`
|
|
40
|
+
(21.1.0) is a call that ended without a result (an interrupted stream, a cancelled run) and reads
|
|
41
|
+
`Incomplete` (`statusIncomplete`) with its own static glyph in the neutral `pending` tone; unknown
|
|
42
|
+
runtime values render the pending icon, text, and accessible label instead of failing the update
|
|
37
43
|
- `summary: string = ''` — short human-readable status text, e.g. `Searching web…`
|
|
38
44
|
- `durationMs?: number` (attribute `duration-ms`) — how long the call took, in milliseconds; the
|
|
39
45
|
`duration` part is omitted entirely when unset
|
|
@@ -58,7 +64,7 @@ content — assigned content wins; otherwise the `icon` prop is rendered as a li
|
|
|
58
64
|
the built-in glyph for the current `status` is used)
|
|
59
65
|
|
|
60
66
|
**CSS parts:** `base` (the clickable `<button>`), `icon`, `label` (wrapper around `category`, `name`,
|
|
61
|
-
`summary`), `category`, `name
|
|
67
|
+
`summary`), `category`, `name` (the tool name, or `display-name` when set), `summary`, `meta` (wrapper around `status-text` and `duration`),
|
|
62
68
|
`status-text`, `duration`, `tooltip` (the floating detail popup, only meaningful while open)
|
|
63
69
|
|
|
64
70
|
**Themeable custom properties:** `--lr-tool-call-chip-spin` (default `var(--lr-transition-ambient)`,
|
|
@@ -66,7 +72,7 @@ i.e. `1.8s ease-in-out` at the shipped token value and `0.001ms linear` under
|
|
|
66
72
|
`prefers-reduced-motion` — running-icon animation duration/timing) and `--lr-transition-ambient`
|
|
67
73
|
(default `1.8s ease-in-out` — pending-icon pulse duration/timing).
|
|
68
74
|
`--lr-tool-call-chip-accent`, `--lr-tool-call-chip-bg`, and `--lr-tool-call-chip-border` are public
|
|
69
|
-
component hooks whose private defaults follow `status` (e.g. `pending` →
|
|
75
|
+
component hooks whose private defaults follow `status` (e.g. `pending` and `incomplete` →
|
|
70
76
|
`--lr-color-text-quiet`/`--lr-color-surface`/`--lr-color-border`; `running` → brand; `success` →
|
|
71
77
|
success; `error` → danger; `denied` → warning). Set them on an ancestor to retheme a subtree or
|
|
72
78
|
directly on one chip; either public value remains authoritative in every status. Shared tokens
|
|
@@ -142,8 +142,9 @@ fired once up front at connect time and after every effective change; serializat
|
|
|
142
142
|
publish their root message as `errors.base` and `formError`), and no-detail `focus`/`blur` events for
|
|
143
143
|
generated native text/number inputs. The composed
|
|
144
144
|
`<lr-select>` controls already bubble their own focus/blur bridges through the host.
|
|
145
|
-
Nested control events (`input`, `change`, `lr-change`,
|
|
146
|
-
contained at the form boundary; consumers receive
|
|
145
|
+
Nested control events (`input`, `change`, `lr-change`, the selects' `lr-show`/`lr-after-show`/
|
|
146
|
+
`lr-hide`/`lr-after-hide`, and option mutation) are contained at the form boundary; consumers receive
|
|
147
|
+
the single form-level `lr-input` contract.
|
|
147
148
|
`lr-invalid` (no detail) is the bubbling/composed, cancelable alias emitted when the complete
|
|
148
149
|
parameter form fails a native validity check; preventing it also prevents the native `invalid`
|
|
149
150
|
event's default validation UI.
|
|
@@ -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,
|
|
12
|
+
- **Themeable via** 12 parts, 15 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
|
---
|
|
@@ -39,8 +39,10 @@ title.
|
|
|
39
39
|
cloning that name. A direct property assignment made without the attribute can name the panel
|
|
40
40
|
- `toolName: string = ''` (attribute `tool-name`) — the tool's name, rendered prominently in the
|
|
41
41
|
header
|
|
42
|
-
- `status: 'pending'|'running'|'success'|'error'|'denied' = 'pending'` (reflected) —
|
|
43
|
-
header's status badge; same status vocabulary as `<lr-tool-call-chip
|
|
42
|
+
- `status: 'pending'|'running'|'success'|'error'|'denied'|'incomplete' = 'pending'` (reflected) —
|
|
43
|
+
drives the header's status badge; same status vocabulary as `<lr-tool-call-chip>`. `incomplete`
|
|
44
|
+
(21.1.0) is a call that ended without a result; its badge reads `Incomplete` in the neutral
|
|
45
|
+
pending look, through its own `--lr-tool-result-dialog-incomplete-*` pair
|
|
44
46
|
- `durationMs?: number` (attribute `duration-ms`) — how long the call took, in milliseconds; omitted
|
|
45
47
|
from the header entirely when unset
|
|
46
48
|
- `maximized: boolean = false` (reflected) — near-fullscreen presentation of the same open dialog
|
|
@@ -143,5 +145,7 @@ Backdrop clicks leave the dialog open by default; add `light-dismiss` to opt in,
|
|
|
143
145
|
- `--lr-tool-result-dialog-error-bg` — Error status background. Default: `var(--lr-color-danger-quiet)`.
|
|
144
146
|
- `--lr-tool-result-dialog-denied-color` — Denied status foreground. Default: `var(--lr-color-warning)`.
|
|
145
147
|
- `--lr-tool-result-dialog-denied-bg` — Denied status background. Default: `var(--lr-color-warning-quiet)`.
|
|
148
|
+
- `--lr-tool-result-dialog-incomplete-color` — Incomplete status foreground (21.1.0). Default: `var(--lr-color-text-quiet)`.
|
|
149
|
+
- `--lr-tool-result-dialog-incomplete-bg` — Incomplete status background (21.1.0). Default: `transparent`.
|
|
146
150
|
|
|
147
151
|
---
|
|
@@ -49,7 +49,7 @@ Direction: a text fallback (`::part(fallback-text)`) uses `unicode-bidi: plainte
|
|
|
49
49
|
- `copyable: boolean = false` (reflected) — shows a copy-to-clipboard affordance alongside the
|
|
50
50
|
fallback view, for either `fallback` kind: forwarded to `<lr-json-viewer>`'s own `copyable` for
|
|
51
51
|
`"json"`, or a `<lr-copy-button>` rendered next to the text for `"text"`.
|
|
52
|
-
- `status: 'pending'|'running'|'success'|'error'|'denied' = 'success'` (reflected) — the outcome of
|
|
52
|
+
- `status: 'pending'|'running'|'success'|'error'|'denied'|'incomplete' = 'success'` (reflected) — the outcome of
|
|
53
53
|
the currently-rendered result, as reported by the matched renderer's own `context.reportStatus()`
|
|
54
54
|
(see below). Reset to `'success'` immediately before every `render()` call, so a renderer that
|
|
55
55
|
never calls `reportStatus` — including every pre-existing 2-arg renderer written before this
|
|
@@ -131,8 +131,9 @@ DirectToolRendererDefinition }>` and `render?: never` — lazy loader
|
|
|
131
131
|
**`ToolRenderContext`** — the shape of `render()`'s 3rd argument:
|
|
132
132
|
|
|
133
133
|
- `reportStatus: (status: ToolResultStatus) => void` — reports this render's outcome without
|
|
134
|
-
throwing. `ToolResultStatus` is `'pending' | 'running' | 'success' | 'error' | 'denied'
|
|
135
|
-
union `<lr-tool-result-dialog>`/`<lr-tool-call-chip>` use, re-exported
|
|
134
|
+
throwing. `ToolResultStatus` is `'pending' | 'running' | 'success' | 'error' | 'denied' |
|
|
135
|
+
'incomplete'`, the same union `<lr-tool-result-dialog>`/`<lr-tool-call-chip>` use, re-exported
|
|
136
|
+
from this module. Calling
|
|
136
137
|
it is entirely optional: a renderer that never calls it leaves `<lr-tool-result-view>`'s `status`
|
|
137
138
|
property at its default, `'success'`. This threads through the lazy `load()` path exactly the
|
|
138
139
|
same way — a `render()` resolved via `load()` receives the same 3rd `context` argument as one
|
|
@@ -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** 17 parts,
|
|
12
|
+
- **Themeable via** 17 parts, 14 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
|
---
|
|
@@ -22,9 +22,9 @@ primitives, with retry counts and sensitive-field redaction.
|
|
|
22
22
|
**Properties:**
|
|
23
23
|
|
|
24
24
|
- `entries: readonly ToolTimelineEntry[] = []` (attribute: false) — `ToolTimelineEntry` **extends
|
|
25
|
-
`ToolInvocation` from `@aceshooting/lyra-ui/ai`** (`{ id: string; name: string;
|
|
26
|
-
Record<string, unknown>; status: ToolCallStatus; result?: unknown; error?: string }`, where
|
|
27
|
-
`ToolCallStatus = 'pending' | 'running' | 'success' | 'error' | 'denied'`) with `{ startedAt?:
|
|
25
|
+
`ToolInvocation` from `@aceshooting/lyra-ui/ai`** (`{ id: string; name: string; displayName?:
|
|
26
|
+
string; args: Record<string, unknown>; status: ToolCallStatus; result?: unknown; error?: string }`, where
|
|
27
|
+
`ToolCallStatus = 'pending' | 'running' | 'success' | 'error' | 'denied' | 'incomplete'`) with `{ startedAt?:
|
|
28
28
|
number; endedAt?: number; retryCount?: number; redactedFields?: readonly string[]; needsApproval?: boolean;
|
|
29
29
|
approved?: boolean; sourceKey?: string; icon?: string }`. `sourceKey` identifies the owning run or
|
|
30
30
|
source generation when invocation ids can be reused; every expansion, activation, renderer error,
|
|
@@ -32,7 +32,12 @@ approved?: boolean; sourceKey?: string; icon?: string }`. `sourceKey` identifies
|
|
|
32
32
|
are omitted; a blank optional `sourceKey` is treated as absent. Duplicate occurrences of the same
|
|
33
33
|
pair are normalized before any lookup with a deterministic first-occurrence-wins policy. `icon` is a
|
|
34
34
|
literal hint forwarded to the composed tool-call chip. A foreign runtime `status` normalizes once
|
|
35
|
-
to `pending` before both the timeline row and its composed chip render.
|
|
35
|
+
to `pending` before both the timeline row and its composed chip render. `displayName` (21.1.0),
|
|
36
|
+
the application's own translated tool label, is forwarded to the chip's `displayName` and names
|
|
37
|
+
the entry's details disclosure (`Details for Lecture d’un fichier`); an empty, omitted or
|
|
38
|
+
non-string value shows `name`. `name` still selects the result renderer, is still the `toolName`
|
|
39
|
+
in `lr-tool-render-error`, and still names the tool in the approval dialog, so the reviewer
|
|
40
|
+
authorizes the exact tool.
|
|
36
41
|
Timestamps are epoch milliseconds; entries sort ascending by `startedAt`,
|
|
37
42
|
and an entry with none sorts after every timed entry (keeping its relative position among other
|
|
38
43
|
untimed ones) and renders no visible timestamp. `startedAt`+`endedAt` derive the `durationMs`
|
|
@@ -113,6 +118,8 @@ per-entry timeline marker dot's size, which also sets the entry grid's leading c
|
|
|
113
118
|
`status="denied"` entry, decoupled from the pending-approval border color below so either can be
|
|
114
119
|
retinted independently; `--lr-tool-timeline-pending-marker-color` (default
|
|
115
120
|
`var(--lr-color-text-quiet)`) — rail-dot color for a `status="pending"` entry;
|
|
121
|
+
`--lr-tool-timeline-incomplete-marker-color` (21.1.0, default `var(--lr-color-text-quiet)`) —
|
|
122
|
+
rail-dot color for a `status="incomplete"` entry, independent of the pending one;
|
|
116
123
|
`--lr-tool-timeline-pending-approval-border-color` (default
|
|
117
124
|
`var(--lr-color-warning)`) — color of the entry body's leading border while that entry's
|
|
118
125
|
`data-pending-approval` is `"true"`.
|
|
@@ -9,358 +9,6 @@
|
|
|
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** 28 parts, 26 custom properties — see
|
|
13
|
-
- **Documented with** `lr-tree
|
|
12
|
+
- **Themeable via** 28 parts, 26 custom properties — see `lr-tree.md`
|
|
13
|
+
- **Documented with** `lr-tree`: see [lr-tree.md](./lr-tree.md).
|
|
14
14
|
- **Library-wide behavior** (events, form association, `locale`/`strings`, tokens, TS types): `llms/shared.md`
|
|
15
|
-
|
|
16
|
-
---
|
|
17
|
-
|
|
18
|
-
## `lr-tree` / `lr-tree-item`
|
|
19
|
-
|
|
20
|
-
An expand/collapse hierarchy (document/graph navigation tree). Mirrors `wa-tree`/`wa-tree-item` and
|
|
21
|
-
`sl-tree`/`sl-tree-item`.
|
|
22
|
-
|
|
23
|
-
An otherwise unnamed data row receives its stable `id` as a semantic name. Usable `accessibleLabel`,
|
|
24
|
-
visible label, description, badge content and explicit host naming retain precedence; the fallback
|
|
25
|
-
changes neither visible content nor installed data. Blank visible labels remain supported.
|
|
26
|
-
Declarative items receive no automatic ID fallback.
|
|
27
|
-
|
|
28
|
-
**Renamed in 8.0.0 — breaking:** the child element is `<lr-tree-item>` (class `LyraTreeItem`), not
|
|
29
|
-
`<lr-tree-node>`/`LyraTreeNode`. It was the only child element in the library whose tag diverged
|
|
30
|
-
from both upstreams, so `wa-tree-item`/`sl-tree-item` markup had nothing to rename to. The shared
|
|
31
|
-
data types moved to `tree-types.ts` to free the name and are still re-exported from `tree.js`. A
|
|
32
|
-
leftover `<lr-tree-node>` is an unregistered tag: it never
|
|
33
|
-
upgrades, `<lr-tree>` does not count it as an item at all, and the tree renders its empty state
|
|
34
|
-
with the stale markup sitting inert in the light DOM — no error anywhere.
|
|
35
|
-
|
|
36
|
-
**9.0 type/API cleanup:** rename the structured-data type `TreeItem` to `LyraTreeNodeData`, use
|
|
37
|
-
`LyraVariant` for `TreeBadge.tone` instead of `TreeBadgeTone`, and replace a singular `badge` value
|
|
38
|
-
with `badges: [{ text: String(value) }]`. The former item-controller fields (`activeId`, `ancestry`,
|
|
39
|
-
`depth`, `setSize`, `posInSet`) and context setters were never consumer state; they are now private
|
|
40
|
-
owner context maintained by `<lr-tree>`.
|
|
41
|
-
|
|
42
|
-
**Two child models are accepted, and they never interleave.**
|
|
43
|
-
|
|
44
|
-
- **Declarative** (mirrors the upstream markup, so a tag rename is the whole migration): write
|
|
45
|
-
nested `<lr-tree-item>` elements as light-DOM children, each carrying its own
|
|
46
|
-
`label`/`expanded`/`disabled`/`selected` attributes. `<lr-tree-item>` moves its nested children
|
|
47
|
-
onto an internal `children` slot itself, so you never write `slot=`.
|
|
48
|
-
- **Data**: leave `<lr-tree>` empty and assign `data`, a `LyraTreeNodeData[]` of plain objects. This is this
|
|
49
|
-
library's own original shape and is where per-row icons, secondary descriptions and badges live —
|
|
50
|
-
the declarative model has none of those. `<lr-tree>` creates and reconciles the
|
|
51
|
-
`<lr-tree-item>` children by `id`, and each item renders its own subtree into its own shadow root.
|
|
52
|
-
Every reachable `LyraTreeNodeData.id` must be nonblank and globally unique. Malformed rows and
|
|
53
|
-
later duplicates are omitted before rendering; the first valid depth-first occurrence wins
|
|
54
|
-
and cannot receive focus, selection, expansion, or reorder requests. Supplying unique refreshed
|
|
55
|
-
data releases that fail-closed state.
|
|
56
|
-
|
|
57
|
-
A tree containing any author-written `<lr-tree-item>` child is read purely as the declarative model
|
|
58
|
-
and `data` is ignored. The empty state renders only when neither model has any items.
|
|
59
|
-
|
|
60
|
-
Both child models use the same selection, roving-focus, checkbox-cascade, icon, and lazy-loading
|
|
61
|
-
engine. The upstream lifecycle names are normalized to the library-wide `lr-` prefix;
|
|
62
|
-
`lr-node-toggle` and `lr-node-select` remain as additive Lyra notifications. In multiple modes the
|
|
63
|
-
tree role explicitly exposes `aria-multiselectable="true"` (and explicit `"false"` otherwise),
|
|
64
|
-
while each treeitem host is the sole selected/checked/mixed semantic owner; checkbox-shaped chrome
|
|
65
|
-
is decorative and cannot duplicate the row's accessible name.
|
|
66
|
-
|
|
67
|
-
### `lr-tree`
|
|
68
|
-
|
|
69
|
-
Implements the full WAI-ARIA treeitem keyboard pattern: a single owner-controlled roving `tabindex`
|
|
70
|
-
across every reachable `<lr-tree-item>` and
|
|
71
|
-
ArrowUp/Down/Right/Left/Home/End/Enter/Space handled by one delegated `keydown` listener (native
|
|
72
|
-
`KeyboardEvent`s are `composed: true` and bubble across shadow-DOM boundaries, so a press inside a
|
|
73
|
-
deeply-nested node's own shadow root still reaches it).
|
|
74
|
-
|
|
75
|
-
**Properties:**
|
|
76
|
-
|
|
77
|
-
- `data: readonly LyraTreeNodeData[] = []` (attribute: false) — the object child model; ignored
|
|
78
|
-
while any author-written `<lr-tree-item>` child is present. Assignment installs a detached,
|
|
79
|
-
recursively frozen snapshot: mutate caller data only before assignment, then reassign after
|
|
80
|
-
changes. Normalization accepts at most 1,000 valid nodes and 64 descendant levels, and lazily
|
|
81
|
-
inspects at most 10,000 root/child array positions globally in depth-first order. It never
|
|
82
|
-
invokes caller accessors and exposes `dataTruncated = true` when malformed or over-budget input
|
|
83
|
-
was omitted or the inspected-position ceiling was reached. Collapsed branches do not instantiate descendants; disclosure projects only normalized
|
|
84
|
-
children while `aria-setsize` preserves the declared sibling count. `LyraTreeNodeData` is
|
|
85
|
-
`{ readonly id: string; readonly label: string; readonly children?: readonly LyraTreeNodeData[];
|
|
86
|
-
readonly selected?: boolean; readonly disabled?: boolean; readonly lazy?: boolean; readonly
|
|
87
|
-
badges?: readonly TreeBadge[]; readonly icon?: unknown; readonly description?: string; readonly
|
|
88
|
-
accessibleLabel?: string }`. `TreeBadge` is `{ readonly text: string; readonly tone?:
|
|
89
|
-
LyraVariant; readonly label?: string }`. `badges` renders tone-mapped chips in order. A nonempty
|
|
90
|
-
`label` makes that chip a named `img`; when the override is omitted or empty, no generic role or
|
|
91
|
-
redundant `aria-label` is added and the visible `text` contributes to the treeitem name naturally.
|
|
92
|
-
`icon` renders as a decorative leading visual, `description` as secondary visible row text, and
|
|
93
|
-
`accessibleLabel` names the `role="treeitem"` host without changing its visible label. An
|
|
94
|
-
author-supplied host `aria-label` takes precedence by presence and is never overwritten or
|
|
95
|
-
removed by later object refreshes; removing the author attribute restores the current data name.
|
|
96
|
-
`id` is the event, roving-focus, reconciliation, and reorder identity and must be unique across
|
|
97
|
-
the complete reachable hierarchy; malformed rows, blank IDs and later duplicates are omitted as described above
|
|
98
|
-
- `selection: 'single'|'multiple'|'leaf'|'leaf-multiple' = 'single'` — self-managed selection for
|
|
99
|
-
both child models. `single` selects one item; `leaf` selects one loaded leaf; `multiple` displays
|
|
100
|
-
checkboxes and cascades through enabled descendants; `leaf-multiple` applies that cascade only
|
|
101
|
-
to leaves. Partially-selected branches expose `indeterminate`
|
|
102
|
-
- `label: string = ''` — accessible-name fallback for the tree; `role="tree"` lives on an internal
|
|
103
|
-
`[part="base"]` element. A host `aria-label` takes precedence by attribute presence, including an
|
|
104
|
-
explicit empty string; removing it restores the `label` fallback. External `aria-labelledby`
|
|
105
|
-
idrefs are not forwarded across the shadow boundary.
|
|
106
|
-
- `reorderable: boolean = false` (reflected) — opts into keyboard reordering. Unset, no `lr-reorder`
|
|
107
|
-
is ever emitted, Ctrl/Cmd+Arrow behaves exactly like a plain Arrow press, and the internal live
|
|
108
|
-
region is not rendered at all.
|
|
109
|
-
|
|
110
|
-
**Read-only getters:** `selectedItems: readonly LyraTreeItem[]` returns a new frozen snapshot of
|
|
111
|
-
selected item elements in document order, including derived fully-selected parents in either
|
|
112
|
-
multiple mode. `dataTruncated: boolean` reports bounded/malformed normalization as described above.
|
|
113
|
-
|
|
114
|
-
**Keyboard:** ArrowDown/ArrowUp move the roving focus to the next/previous _visible_ node.
|
|
115
|
-
ArrowRight expands a collapsed node (focus stays put; a second ArrowRight then steps into the first
|
|
116
|
-
child) or moves into an already-expanded node's first child. ArrowLeft collapses an expanded node, or
|
|
117
|
-
moves focus to its parent. Home/End jump to the first/last visible node. Enter/Space activate
|
|
118
|
-
`select()` on the focused node. While `reorderable`, **Ctrl/Cmd**+ArrowUp/ArrowDown moves the focused
|
|
119
|
-
node within its own parent's child list instead of navigating. Ctrl/Cmd rather than Alt: Alt+Arrow is
|
|
120
|
-
browser back/forward on Windows and Linux. ArrowUp/ArrowDown are not direction-sensitive, so this
|
|
121
|
-
binding is deliberately **not** RTL-swapped — "down" always means later in the sibling list.
|
|
122
|
-
If a same-id data refresh disables an expanded branch, that reused branch collapses immediately;
|
|
123
|
-
enabled descendants are never left visibly stranded outside this navigation walk.
|
|
124
|
-
|
|
125
|
-
**`inert` excludes an item and its whole subtree from that walk, exactly as `disabled` does.**
|
|
126
|
-
`role="treeitem"` and the roving `tabindex` both live on the `<lr-tree-item>` host itself, so an
|
|
127
|
-
inert item literally refuses `focus()` — stepping the roving index onto one would leave focus behind
|
|
128
|
-
on `<body>` and kill every later arrow press. Marking the focused item inert therefore moves the
|
|
129
|
-
roving stop to the next reachable row instead of stranding it, and the state is observed live
|
|
130
|
-
(`attributeFilter: ['selected', 'disabled', 'inert', 'lazy']`). Two deliberate limits:
|
|
131
|
-
|
|
132
|
-
- **Only inertness _inside_ the tree counts** — the item's own `inert`, or that of an ancestor item
|
|
133
|
-
between it and the `<lr-tree>`. An inert ancestor _outside_ the tree (the page behind an open
|
|
134
|
-
modal) inerts every item uniformly, and excluding them all would empty the walk, null out
|
|
135
|
-
`activeId`, and leave the tree with no `tabindex="0"` stop for anything to restore once the dialog
|
|
136
|
-
closes. That case needs no handling: focus cannot be inside the tree at all.
|
|
137
|
-
- **Selection ignores it.** An inert subtree is temporarily non-interactive, not deselected, so
|
|
138
|
-
`selectedItems` and the multiple-mode cascade are unchanged and a modal that inerts the page can
|
|
139
|
-
never silently wipe a tree's selection.
|
|
140
|
-
|
|
141
|
-
**Methods:** `expandAll(): Promise<void>`, `collapseAll(): Promise<void>` (both iterative, bounded,
|
|
142
|
-
and resolved only after the affected rendered item cascade settles).
|
|
143
|
-
|
|
144
|
-
**Events:** `lr-selection-change` (`detail: { selection }`, where both the detail and selection
|
|
145
|
-
snapshot are frozen) and `lr-reorder` (`detail: { nodeId, parentNodeId, fromIndex, toIndex }`, only while `reorderable`).
|
|
146
|
-
Like every other event here it is a **request**: `data` is host-owned and is never mutated by this
|
|
147
|
-
component, so nothing moves until the host reassigns a reordered `data` — focus then follows the
|
|
148
|
-
moved node. The live region likewise announces a completed move only after the rendered sibling
|
|
149
|
-
order confirms the exact requested swap. Ignored or rejected requests stay silent, and unrelated
|
|
150
|
-
updates do not prematurely discard an asynchronously persisted request. `parentNodeId` is `null` for a
|
|
151
|
-
top-level item, and `fromIndex`/`toIndex` are **sibling-scoped
|
|
152
|
-
indices**, not positions in the flattened visible list. The move is constrained to one sibling list
|
|
153
|
-
and never fires at a subtree boundary, so a reorder can never become a reparent: Ctrl+ArrowDown on
|
|
154
|
-
the last child of a subtree is ambiguous (the visually next row is a top-level uncle, so "move down"
|
|
155
|
-
could mean either "swap with the next sibling" — there is none — or "reparent up a level"), and
|
|
156
|
-
reparenting is a structural edit with no keyboard affordance distinguishing the two. Such a request
|
|
157
|
-
is simply not made: no event, no announcement, focus stays put. Item events listed below bubble
|
|
158
|
-
through the tree as well.
|
|
159
|
-
|
|
160
|
-
**Slots:** default — top-level `<lr-tree-item>` elements, each nesting its own children (the
|
|
161
|
-
declarative model). Leave it empty and assign `data` for the object model; the same slot then holds
|
|
162
|
-
the items `<lr-tree>` generates. `expand-icon` and `collapse-icon` provide tree-wide disclosure
|
|
163
|
-
icons; an item-level slot with the same name takes precedence.
|
|
164
|
-
|
|
165
|
-
**CSS parts:** `base` and `tree` are aliases on the same `role="tree"` root; `empty` is the
|
|
166
|
-
empty-state message shown when neither child model has any items.
|
|
167
|
-
|
|
168
|
-
**Themeable custom properties:** shared tokens `--lr-space-xs`/`-s`, `--lr-color-brand-quiet`,
|
|
169
|
-
`--lr-color-text-quiet`, `--lr-color-border`, `--lr-color-border-subtle`, `--lr-color-text`,
|
|
170
|
-
`--lr-radius`, `--lr-focus-ring-*` (row `:focus-visible` ring, driven by `:host(:focus-visible)`
|
|
171
|
-
since the host itself is the focusable `role="treeitem"`), plus `--indent-size`, `--indent-guide-color`,
|
|
172
|
-
`--indent-guide-offset`, `--indent-guide-style`, and `--indent-guide-width`.
|
|
173
|
-
|
|
174
|
-
**Optional peer deps:** none.
|
|
175
|
-
|
|
176
|
-
### `lr-tree-item`
|
|
177
|
-
|
|
178
|
-
One row of the tree, in either child model. `role="treeitem"` (plus
|
|
179
|
-
`aria-expanded`/`aria-level`/`aria-setsize`/`aria-posinset`/`aria-selected` and the roving
|
|
180
|
-
`tabindex`, driven by `<lr-tree>`) live on the _host_ element itself, not an internal row `<div>` —
|
|
181
|
-
so this node's own nested children (whether rendered in its own shadow root or projected from the
|
|
182
|
-
light DOM, as further `role="group"` content) are genuine DOM descendants of the treeitem, matching
|
|
183
|
-
the WAI-ARIA treeitem pattern's containment expectation.
|
|
184
|
-
|
|
185
|
-
**Properties — declarative model** (write these as attributes; `item` data seeds the matching state
|
|
186
|
-
when assigned):
|
|
187
|
-
|
|
188
|
-
- `label: string = ''` — the row's label, used only when nothing is slotted into the default slot
|
|
189
|
-
- `disabled: boolean = false` (reflected) — removes the item from roving focus and blocks
|
|
190
|
-
select/toggle activation
|
|
191
|
-
- `selected: boolean = false` (reflected) — renders the selected state and is exposed as
|
|
192
|
-
`aria-selected`
|
|
193
|
-
- `lazy: boolean = false` (reflected) — defers expansion, renders the spinner, and emits
|
|
194
|
-
`lr-lazy-load` until children arrive or `lazy` is cleared
|
|
195
|
-
|
|
196
|
-
**Properties — data model:**
|
|
197
|
-
|
|
198
|
-
- `item?: LyraTreeNodeData` (attribute: false) — the whole subtree as one object, normally assigned by
|
|
199
|
-
`<lr-tree>` from its `data`. An assigned `item` **wins** for label/disabled/children and seeds
|
|
200
|
-
`selected`/`lazy`; a refreshed object identity re-seeds those values. Light-DOM children are
|
|
201
|
-
ignored while `item` is assigned. Outside an owning tree, an omitted `item.selected` leaves
|
|
202
|
-
`aria-selected` off the host; an owning tree always publishes explicit true/false state. Assign
|
|
203
|
-
`undefined` to return safely to the declarative model and reset data-seeded selected/lazy state
|
|
204
|
-
|
|
205
|
-
**Properties — shared:**
|
|
206
|
-
|
|
207
|
-
- `expanded: boolean = false` (reflected)
|
|
208
|
-
- `loading: boolean` (read-only) — a lazy expansion is waiting for children
|
|
209
|
-
- `indeterminate: boolean` (read-only) — an enabled branch has some but not all selectable
|
|
210
|
-
descendants selected
|
|
211
|
-
|
|
212
|
-
**Read-only getters** — each answers for whichever child model is in use, which is what lets
|
|
213
|
-
`<lr-tree>` drive both with one implementation:
|
|
214
|
-
|
|
215
|
-
- `nodeId: string` — this item's identity: `item.id` in the data model, or a generated per-element
|
|
216
|
-
id in the declarative one (where the markup carries no id of its own). It is the `nodeId` every
|
|
217
|
-
`lr-node-toggle` / `lr-node-select` / `lr-reorder` detail carries, and what the tree tracks its
|
|
218
|
-
roving tabindex by
|
|
219
|
-
- `isDisabled: boolean` — `item.disabled` in the data model, the `disabled` property in the
|
|
220
|
-
declarative one
|
|
221
|
-
- `nodeLabel: string` — this item's spoken name, used for the tree's reorder announcements: a host
|
|
222
|
-
`aria-label` is authoritative in both models
|
|
223
|
-
(including the component-owned stable-ID fallback for otherwise unnamed data rows); otherwise `item.accessibleLabel || item.label` in
|
|
224
|
-
the data model, or flattened accessibility-visible slotted label text (nested items excluded)
|
|
225
|
-
followed by the `label` fallback in the declarative one. Direct and forwarding-slot
|
|
226
|
-
text/ARIA/visibility mutations update the name
|
|
227
|
-
- `hasChildren: boolean` — whether this node has at least one child in whichever model is in use.
|
|
228
|
-
Leaf nodes never expose `aria-expanded` and cannot expand or collapse. It also reports `false`
|
|
229
|
-
past the owner controller's 64-level bound, which stops runaway recursion; cyclic object graphs
|
|
230
|
-
are detected by private ancestry identity
|
|
231
|
-
|
|
232
|
-
**Methods:** `expand()`, `collapse()` (each a no-op if already in that state, disabled, loading, or a leaf),
|
|
233
|
-
`select()` (fires `lr-node-select`; a no-op while disabled), and host `click()` (forwards exactly
|
|
234
|
-
once to the same selection path and is likewise disabled-gated). `childItems(): LyraTreeItem[]` returns
|
|
235
|
-
this node's **direct** child `<lr-tree-item>` elements — from its own shadow root in the data model,
|
|
236
|
-
from its own light-DOM children in the declarative one. A grandchild is not included; it lives under
|
|
237
|
-
its own parent. `getChildrenItems({ includeDisabled = true } = {})` is the upstream-compatible
|
|
238
|
-
public spelling over the same direct-child list.
|
|
239
|
-
|
|
240
|
-
**Events:** `lr-node-toggle` (`detail: { nodeId, expanded }`, fired by `expand()`/`collapse()` — via
|
|
241
|
-
the toggle button or ArrowRight/ArrowLeft), `lr-node-select` (`detail: { nodeId }`, fired by `select()`
|
|
242
|
-
— via clicking anywhere in the row or Enter/Space) — dispatched from `lr-tree-item`,
|
|
243
|
-
bubble/compose up through `lr-tree`'s light DOM. `lr-expand`/`lr-collapse` fire when a transition
|
|
244
|
-
begins; `lr-after-expand`/`lr-after-collapse` fire after the matching themeable duration. Rapid
|
|
245
|
-
opposite transitions and disconnects invalidate stale after-events. Collapse keeps the subtree
|
|
246
|
-
mounted through its real opacity animation and removes it only when the animation completes;
|
|
247
|
-
reduced motion settles immediately, and duration parsing is finite/nonnegative/timer-capped.
|
|
248
|
-
`lr-lazy-load` requests data
|
|
249
|
-
with `detail: { item, generation }`; `lr-lazy-change` reports `detail: { item, loading }` when the
|
|
250
|
-
pending state starts or ends. Disabling or disconnecting an item invalidates the pending generation.
|
|
251
|
-
|
|
252
|
-
**Slots:** default — the row's label content in the declarative model. `children` — where nested
|
|
253
|
-
`<lr-tree-item>` children are projected; **assigned by the component**, so write the nested items in
|
|
254
|
-
the default slot and never set `slot="children"` yourself. `expand-icon` and `collapse-icon`
|
|
255
|
-
override the owning tree's corresponding icon for one item. The label/children slots are unused in
|
|
256
|
-
the data model.
|
|
257
|
-
|
|
258
|
-
Visual slot selection is separate from `nodeLabel` extraction: flattened element-only and visible
|
|
259
|
-
`aria-hidden` content still chooses the authored slot instead of the `label` fallback, while hidden
|
|
260
|
-
content is omitted from the spoken name. Host `aria-label` remains authoritative by presence.
|
|
261
|
-
|
|
262
|
-
**CSS parts:** `base` and `tree-item` are aliases on the same outer wrapper around the row and child
|
|
263
|
-
group; `row`, `toggle`, `icon`, `content`, `label`, `description`, `badge`, `group`, `item`,
|
|
264
|
-
`item--disabled`, `item--expanded`, `item--indeterminate`, `item--selected`, `indentation`,
|
|
265
|
-
`expand-button`, `spinner`, `spinner__base`, `children`, `checkbox`, `checkbox__base`,
|
|
266
|
-
`checkbox__control`, `checkbox__control--checked`, `checkbox__control--indeterminate`,
|
|
267
|
-
`checkbox__checked-icon`, `checkbox__indeterminate-icon`, and `checkbox__label`. `badge`
|
|
268
|
-
is applied to every `item.badges` chip; chips carry
|
|
269
|
-
`data-tone="neutral|brand|success|warning|danger"`. `icon` is `aria-hidden="true"`; `content`
|
|
270
|
-
groups the primary label and optional wrapping secondary description while preserving one
|
|
271
|
-
interactive treeitem per row. `icon`, `description` and `badge` render only in the data model —
|
|
272
|
-
the declarative model has no icon/description/badge inputs, so a row written as markup renders
|
|
273
|
-
`row`/`toggle`/`content`/`label` (and `group` while expanded) and nothing else.
|
|
274
|
-
`item` and its four state aliases are real painted row containers: consumer background, border,
|
|
275
|
-
padding, and opacity rules reach the visible row rather than a boxless wrapper.
|
|
276
|
-
The enabled disclosure `toggle` has its own pointer-hover feedback in addition to the row's hover
|
|
277
|
-
treatment; disabled toggles remain visually inert.
|
|
278
|
-
In the data model, every recursively rendered child forwards this complete part list under the
|
|
279
|
-
same names, so one selector on the outer item, such as `lr-tree-item::part(row)`, reaches matching
|
|
280
|
-
parts at every rendered depth. Declarative children remain light-DOM hosts and can be matched
|
|
281
|
-
directly as `<lr-tree-item>` elements.
|
|
282
|
-
|
|
283
|
-
**Themeable custom properties:** `--indent-size` (default `var(--lr-space-l)`, applied once per
|
|
284
|
-
nesting depth), `--indent-guide-color` (default `var(--lr-color-border-subtle)`),
|
|
285
|
-
`--indent-guide-offset` (default `0`, the guide's block-axis inset at both ends),
|
|
286
|
-
`--indent-guide-style` (default `solid`), and `--indent-guide-width` (default `0`); these mirrored
|
|
287
|
-
properties are consumed directly by every `<lr-tree-item>` and may be set on an item or inherited
|
|
288
|
-
from `<lr-tree>`. `--lr-tree-depth` is internal and set inline per row for indentation;
|
|
289
|
-
`--show-duration`/`--hide-duration` both default through `--lr-duration-base`;
|
|
290
|
-
`--lr-tree-selected-color` and `--lr-tree-selected-bg` for the selected row; and paired
|
|
291
|
-
`--lr-tree-checkbox-checked-border-color`, `--lr-tree-checkbox-checked-bg`,
|
|
292
|
-
`--lr-tree-checkbox-checked-color`, `--lr-tree-checkbox-indeterminate-border-color`,
|
|
293
|
-
`--lr-tree-checkbox-indeterminate-bg`, and `--lr-tree-checkbox-indeterminate-color` independently
|
|
294
|
-
theme the two multiple-selection checkbox states (brand border/background and on-brand glyph
|
|
295
|
-
fallbacks). The selected-row background is also the base its hover/press mixes from, and each
|
|
296
|
-
checkbox border token also paints that state's border under the pointer; and paired
|
|
297
|
-
`--lr-tree-badge-{neutral|brand|success|warning|danger}-color` /
|
|
298
|
-
`--lr-tree-badge-{neutral|brand|success|warning|danger}-bg` properties for each badge tone. Each
|
|
299
|
-
badge property falls back to its corresponding shared semantic token. The expanded names are
|
|
300
|
-
`--lr-tree-badge-neutral-color`, `--lr-tree-badge-neutral-bg`, `--lr-tree-badge-brand-color`,
|
|
301
|
-
`--lr-tree-badge-brand-bg`, `--lr-tree-badge-success-color`, `--lr-tree-badge-success-bg`,
|
|
302
|
-
`--lr-tree-badge-warning-color`, `--lr-tree-badge-warning-bg`, `--lr-tree-badge-danger-color`,
|
|
303
|
-
and `--lr-tree-badge-danger-bg`.
|
|
304
|
-
|
|
305
|
-
**Optional peer deps:** none.
|
|
306
|
-
|
|
307
|
-
The data model — icons, descriptions and badges live here:
|
|
308
|
-
|
|
309
|
-
```html
|
|
310
|
-
<lr-tree></lr-tree>
|
|
311
|
-
<script>
|
|
312
|
-
document.querySelector("lr-tree").data = [
|
|
313
|
-
{
|
|
314
|
-
id: "1",
|
|
315
|
-
label: "Root",
|
|
316
|
-
description: "Two child documents",
|
|
317
|
-
accessibleLabel: "Root, two child documents",
|
|
318
|
-
icon: document.createTextNode("◇"),
|
|
319
|
-
children: [
|
|
320
|
-
{ id: "1a", label: "Child A" },
|
|
321
|
-
{ id: "1b", label: "Child B", badges: [{ text: "3" }] },
|
|
322
|
-
],
|
|
323
|
-
},
|
|
324
|
-
];
|
|
325
|
-
</script>
|
|
326
|
-
```
|
|
327
|
-
|
|
328
|
-
The declarative model — the same shape a renamed `wa-tree`/`sl-tree` subtree lands in, with no
|
|
329
|
-
`slot=` anywhere and no `data` assignment:
|
|
330
|
-
|
|
331
|
-
```html
|
|
332
|
-
<lr-tree label="Documents">
|
|
333
|
-
<lr-tree-item label="Root" expanded>
|
|
334
|
-
<lr-tree-item label="Child A"></lr-tree-item>
|
|
335
|
-
<lr-tree-item label="Child B" disabled></lr-tree-item>
|
|
336
|
-
</lr-tree-item>
|
|
337
|
-
</lr-tree>
|
|
338
|
-
```
|
|
339
|
-
|
|
340
|
-
**Known gotchas:**
|
|
341
|
-
|
|
342
|
-
- all four previously-known ARIA gaps in this pair are fixed: the treeitem row is now genuinely
|
|
343
|
-
keyboard-operable with a roving tabindex and full arrow-key navigation (not just the expand/collapse
|
|
344
|
-
button); the expanded-children `role="group"` is now a real DOM descendant of its `role="treeitem"`
|
|
345
|
-
host rather than a shadow-DOM sibling; by-id reconciliation (preserving `expanded` state across
|
|
346
|
-
data reassignment) now applies at every depth via a keyed `repeat()`, not just depth 0; and
|
|
347
|
-
`role="tree"` now has an accessible name via the new `label` property.
|
|
348
|
-
- `lr-tree`'s `getUpdateComplete()` cascades through owner-controlled descendants
|
|
349
|
-
`<lr-tree-item>`'s own `updateComplete` (see `update-cascade.ts`) so that code awaiting the
|
|
350
|
-
tree's `updateComplete` does not run before a reachable nested node has finished rendering its
|
|
351
|
-
roving `tabIndex`. The same 64-level/1,000-node work bounds apply to context, focus, selection,
|
|
352
|
-
and disclosure walks.
|
|
353
|
-
- row enrichment is intentionally structured rather than an unrestricted renderer: use `icon`,
|
|
354
|
-
`label`, `description`, `badges`, and `accessibleLabel`. This keeps the host as the single
|
|
355
|
-
`role="treeitem"` interaction target and preserves the APG keyboard model.
|
|
356
|
-
- `lr-file-tree` does **not** forward `reorderable`, and deliberately so: its `LyraTreeNodeData[]` is derived
|
|
357
|
-
from `nodes` on every render and keyed by filesystem path, an order it does not own.
|
|
358
|
-
- in the declarative model, appending a child while the parent is collapsed still registers: a
|
|
359
|
-
`childList` MutationObserver assigns the `children` slot and requests an update, because
|
|
360
|
-
`slotchange` alone cannot see a child added to a slot that is not currently rendered. Editing a
|
|
361
|
-
label in place is picked up the same way.
|
|
362
|
-
- a declarative row whose default slot holds only whitespace around its nested items still shows the
|
|
363
|
-
`label` attribute — indentation does not count as slotted label content, which is what makes the
|
|
364
|
-
common `<lr-tree-item label="…">` + nested-children shape render its label.
|
|
365
|
-
|
|
366
|
-
---
|
package/llms/index.md
CHANGED
|
@@ -5,9 +5,13 @@
|
|
|
5
5
|
296 custom elements, grouped by the source family they live in.
|
|
6
6
|
|
|
7
7
|
**Reading one component.** Its reference file path is derived from the tag — no search needed:
|
|
8
|
-
`llms/components/<tag>.md` (e.g. `llms/components/lr-table.md`)
|
|
9
|
-
|
|
10
|
-
|
|
8
|
+
`llms/components/<tag>.md` (e.g. `llms/components/lr-table.md`): import path, optional peers,
|
|
9
|
+
properties, events, slots, CSS parts, themeable custom properties, a usage snippet, and known
|
|
10
|
+
gotchas — a few hundred tokens instead of the whole catalog. A tag documented together with
|
|
11
|
+
siblings (e.g. `lr-combobox` / `lr-option`) still gets its own generated facts (import path,
|
|
12
|
+
class, status, deprecations, optional peers), but the properties, events, slots, usage snippet,
|
|
13
|
+
and gotchas live once in the primary sibling's file; the secondary tag's file carries a one-line
|
|
14
|
+
pointer to it instead of a duplicated copy.
|
|
11
15
|
|
|
12
16
|
**Importing.** Registration paths are stable aliases derived from the tag:
|
|
13
17
|
`import '@aceshooting/lyra-ui/components/lr-table.js';` registers `<lr-table>` and remains
|
|
@@ -236,7 +240,7 @@ Optional peers: `llms/peers.md`. Safe `wa-*`/`sl-*` migration: `llms/migration.m
|
|
|
236
240
|
- `lr-xml-viewer` · lr-xml-viewer.js · `stable` since `4.0.0` — collapsible, copyable, `DOMParser`-based tree view for XML documents, mirroring `lr-json-viewer`'s UX (`collapsed-depth`, `copyable`, str...
|
|
237
241
|
- `lr-document-compare` · lr-document-compare.js · `stable` since `4.1.0` — side-by-side or inline comparison of two document versions, composed entirely from two existing primitives rather than reimplementing eit...
|
|
238
242
|
- `lr-geojson-viewer` · lr-geojson-viewer.js · `stable` since `9.0.0` — document-registry bridge rendering a fetched GeoJSON file through `<lr-map>`'s `dataLayers`.
|
|
239
|
-
- `lr-geojson-view` · lr-geojson-view.js · `stable` since `4.0.0` —
|
|
243
|
+
- `lr-geojson-view` · lr-geojson-view.js · `stable` since `4.0.0` — Deprecated compatibility class for the pre-v9 `lr-geojson-view` tag.
|
|
240
244
|
|
|
241
245
|
## Conversation & chat UI — `components/conversation/` (34)
|
|
242
246
|
|
|
@@ -346,3 +350,17 @@ Optional peers: `llms/peers.md`. Safe `wa-*`/`sl-*` migration: `llms/migration.m
|
|
|
346
350
|
- `lr-claim-evidence` · lr-claim-evidence.js · `stable` since `7.0.0` — a controlled claim-by-claim grounding audit.
|
|
347
351
|
- `lr-retrieval-compare` · lr-retrieval-compare.js · `stable` since `7.0.0` — a side-by-side retrieval/reranking workbench that makes rank, overlap, and dense/sparse/rerank/final score changes inspectable.
|
|
348
352
|
- `lr-rag-eval-dashboard` · lr-rag-eval-dashboard.js · `stable` since `7.0.0` — a controlled RAG quality overview with current metric cards, per-metric trends, evaluation slices, and run history.
|
|
353
|
+
|
|
354
|
+
## Deprecated package exports
|
|
355
|
+
|
|
356
|
+
These package entry points and exported types still work but are deprecated. Each names its
|
|
357
|
+
replacement and the earliest release that may remove it, under the deprecation policy in
|
|
358
|
+
`llms/shared.md`.
|
|
359
|
+
|
|
360
|
+
- **Deprecated entry point** `@aceshooting/lyra-ui/components/lr-geojson-view.js` since `21.1.0`; use entry point `import '@aceshooting/lyra-ui/components/lr-geojson-viewer.js';`; removal not before `23.0.0` — This tag-shaped route registers the deprecated lr-geojson-view alias (and, through it, lr-geojson-viewer). Import the lr-geojson-viewer route instead; this one keeps working unchanged through the 22.x line.
|
|
361
|
+
- **Deprecated entry point** `@aceshooting/lyra-ui/components/viewers/geojson-view/geojson-view.class.js` since `21.1.0`; use entry point `import { LyraGeoJsonViewer } from '@aceshooting/lyra-ui/components/viewers/geojson-view/geojson-viewer.class.js';`; removal not before `23.0.0` — This route exists for the deprecated LyraGeojsonView alias class and its event map; its re-exports of LyraGeoJsonViewer and its types duplicate the canonical geojson-viewer class route. Import from that route instead; this one keeps working unchanged through the 22.x line.
|
|
362
|
+
- **Deprecated entry point** `@aceshooting/lyra-ui/components/viewers/geojson-view/geojson-view.js` since `21.1.0`; use entry point `import '@aceshooting/lyra-ui/components/viewers/geojson-view/geojson-viewer.js';`; removal not before `23.0.0` — This route registers the deprecated lr-geojson-view alias and, as a side effect, lr-geojson-viewer. Import the geojson-viewer route to register the canonical tag alone; this one keeps working unchanged through the 22.x line.
|
|
363
|
+
- **Deprecated entry point** `@aceshooting/lyra-ui/utilities/localization.js` since `21.1.0`; use entry point `import { bridgeLyraLocale, resolveLyraScopedString, subscribeLyraLocale } from '@aceshooting/lyra-ui/localization.js';`; removal not before `23.0.0` — The side-effect-free localization.js entry now re-exports every binding of this route (bridgeLyraLocale, resolveLyraScopedString, subscribeLyraLocale and the LyraLocaleBridgeOptions/LyraLocaleBridgeCleanup types), identical at runtime and in type, so one entry point carries the whole application-facing locale runtime. Changing the import specifier is the entire migration; this route keeps working unchanged through the 22.x line.
|
|
364
|
+
- **Deprecated type** `DocumentFile` from `@aceshooting/lyra-ui/components/viewers/document-viewer/registry.js` since `21.1.0`; use type `import type { LyraDocumentFile } from '@aceshooting/lyra-ui/components/viewers/document-viewer/registry.js';`; removal not before `23.0.0` — LyraDocumentFile is the structurally identical interface under the library's prefixed type naming, and each is assignable to the other. Exported signatures keep the unprefixed name until the removal, so no existing signature changes in a minor release.
|
|
365
|
+
- **Deprecated type** `DocumentRendererDefinition` from `@aceshooting/lyra-ui/components/viewers/document-viewer/registry.js` since `21.1.0`; use type `import type { LyraDocumentRendererDefinition } from '@aceshooting/lyra-ui/components/viewers/document-viewer/registry.js';`; removal not before `23.0.0` — LyraDocumentRendererDefinition is the same union under the library's prefixed type naming. Exported signatures keep the unprefixed name until the removal, so no existing signature changes in a minor release.
|
|
366
|
+
- **Deprecated type** `LyraGeojsonViewEventMap` from `@aceshooting/lyra-ui/components/viewers/geojson-view/geojson-view.class.js` since `21.1.0`; use type `import type { LyraGeoJsonViewerEventMap } from '@aceshooting/lyra-ui/components/viewers/geojson-view/geojson-viewer.class.js';`; removal not before `23.0.0` — The event contract of the deprecated lr-geojson-view alias is exactly LyraGeoJsonViewerEventMap under a second name. The alias type keeps resolving to it, from this route and the package root, through the 22.x line.
|