@aceshooting/lyra-ui 23.0.0 → 24.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 +16 -39
- package/README.md +72 -35
- package/custom-elements.json +1 -1
- package/design-tokens.json +1 -1
- package/dist/cli/lyra-rename-ledger.mjs +1 -1
- package/dist/cli/migration-contract.json +1 -1
- package/dist/cli/migration-contract.mjs +1 -1
- package/dist/cli/migration-renames.mjs +2 -2
- package/dist/cli/migration-transforms.mjs +2 -2
- package/dist/components/agent-tools/approval-queue/approval-queue.class.d.ts +1 -4
- package/dist/components/agent-tools/approval-queue/approval-queue.class.js +1 -3
- package/dist/components/agent-tools/compare-panel/compare-panel.class.d.ts +1 -4
- package/dist/components/agent-tools/compare-panel/compare-panel.class.js +1 -1
- package/dist/components/agent-tools/confirm-bar/confirm-bar.class.d.ts +1 -7
- package/dist/components/agent-tools/confirm-bar/confirm-bar.class.js +2 -2
- package/dist/components/agent-tools/context-inspector/context-inspector.class.d.ts +1 -1
- package/dist/components/agent-tools/evaluation-run/evaluation-run.class.d.ts +2 -5
- package/dist/components/agent-tools/evaluation-run/evaluation-run.class.js +1 -3
- package/dist/components/agent-tools/terminal/terminal.class.d.ts +1 -4
- package/dist/components/agent-tools/terminal/terminal.class.js +2 -2
- package/dist/components/agent-tools/tool-approval-dialog/tool-approval-dialog.class.d.ts +1 -7
- package/dist/components/agent-tools/tool-approval-dialog/tool-approval-dialog.class.js +1 -1
- package/dist/components/agent-tools/tool-timeline/tool-timeline.class.d.ts +1 -4
- package/dist/components/agent-tools/tool-timeline/tool-timeline.class.js +1 -3
- package/dist/components/charts/chart/lite-chart-axis-layout.d.ts +13 -0
- package/dist/components/charts/chart/lite-chart-axis-layout.js +1 -0
- package/dist/components/charts/chart/lite-chart.class.d.ts +1 -11
- package/dist/components/charts/chart/lite-chart.class.js +4 -4
- package/dist/components/conversation/agent-workspace/agent-workspace.class.d.ts +13 -3
- package/dist/components/conversation/agent-workspace/agent-workspace.class.js +1 -2
- package/dist/components/conversation/chat-message/chat-message.class.d.ts +3 -9
- package/dist/components/conversation/chat-message/chat-message.class.js +1 -1
- package/dist/components/conversation/code-block/code-block-base.class.js +1 -1
- package/dist/components/conversation/code-block/code-block-core.class.d.ts +6 -8
- package/dist/components/conversation/code-block/code-block-shared.d.ts +1 -4
- package/dist/components/conversation/code-block/code-block.class.d.ts +4 -6
- package/dist/components/conversation/markdown/markdown-base.class.d.ts +1 -3
- package/dist/components/conversation/markdown/markdown-base.class.js +1 -1
- package/dist/components/conversation/markdown/markdown-core.class.d.ts +1 -4
- package/dist/components/conversation/markdown/markdown.class.d.ts +1 -4
- package/dist/components/conversation/message-actions/message-actions.class.d.ts +1 -4
- package/dist/components/conversation/message-actions/message-actions.class.js +1 -1
- package/dist/components/conversation/message-feedback/message-feedback.class.d.ts +1 -4
- package/dist/components/conversation/message-feedback/message-feedback.class.js +2 -2
- package/dist/components/conversation/message-parts/message-parts.class.d.ts +2 -5
- package/dist/components/conversation/message-parts/message-parts.class.js +3 -3
- package/dist/components/conversation/streaming-text/streaming-text-base.class.d.ts +1 -1
- package/dist/components/conversation/streaming-text/streaming-text-core.class.d.ts +2 -0
- package/dist/components/conversation/streaming-text/streaming-text-core.class.js +0 -1
- package/dist/components/conversation/streaming-text/streaming-text.class.d.ts +2 -0
- package/dist/components/conversation/streaming-text/streaming-text.class.js +0 -1
- package/dist/components/conversation/thread-list/thread-list.class.d.ts +6 -17
- package/dist/components/conversation/thread-list/thread-list.class.js +6 -6
- package/dist/components/data/context-meter/context-meter.class.d.ts +1 -6
- package/dist/components/data/context-meter/context-meter.class.js +1 -1
- package/dist/components/data/data-grid/data-grid.class.d.ts +0 -1
- package/dist/components/data/data-grid/data-grid.class.js +2 -2
- package/dist/components/data/document-library/document-library.class.d.ts +6 -13
- package/dist/components/data/document-library/document-library.class.js +1 -2
- package/dist/components/data/heatmap/heatmap-grid-navigation.d.ts +7 -0
- package/dist/components/data/heatmap/heatmap-grid-navigation.js +1 -0
- package/dist/components/data/heatmap/heatmap.class.d.ts +3 -23
- package/dist/components/data/heatmap/heatmap.class.js +2 -2
- package/dist/components/data/sequence-strip/sequence-strip.class.d.ts +3 -9
- package/dist/components/data/sequence-strip/sequence-strip.class.js +3 -3
- package/dist/components/data/table/table.class.d.ts +5 -14
- package/dist/components/data/table/table.class.js +6 -6
- package/dist/components/forms/button/button.class.d.ts +2 -2
- package/dist/components/forms/button/button.class.js +9 -9
- package/dist/components/forms/combobox/combobox.class.d.ts +1 -4
- package/dist/components/forms/combobox/combobox.class.js +2 -2
- package/dist/components/forms/input/time-input.class.d.ts +1 -1
- package/dist/components/forms/input/time-input.class.js +1 -1
- package/dist/components/forms/select/select.class.d.ts +1 -2
- package/dist/components/forms/swatch-picker/swatch-picker.class.d.ts +3 -1
- package/dist/components/forms/swatch-picker/swatch-picker.class.js +1 -1
- package/dist/components/layout/app-rail/app-rail-item.class.d.ts +3 -6
- package/dist/components/layout/app-rail/app-rail-item.class.js +1 -1
- package/dist/components/layout/app-rail/app-rail.class.d.ts +2 -4
- package/dist/components/layout/app-rail/app-rail.class.js +1 -1
- package/dist/components/layout/app-rail-group/app-rail-group.class.d.ts +2 -6
- package/dist/components/layout/app-rail-group/app-rail-group.class.js +1 -1
- package/dist/components/layout/carousel/carousel.class.d.ts +1 -4
- package/dist/components/layout/carousel/carousel.class.js +2 -2
- package/dist/components/layout/command-palette/command-palette.class.js +1 -1
- package/dist/components/layout/details/details.class.d.ts +2 -4
- package/dist/components/layout/details/details.class.js +1 -1
- package/dist/components/layout/dock-panel/dock-panel.class.d.ts +3 -7
- package/dist/components/layout/dock-panel/dock-panel.class.js +1 -1
- package/dist/components/layout/menu/menu.class.js +1 -1
- package/dist/components/layout/multi-split/multi-split.class.d.ts +2 -4
- package/dist/components/layout/multi-split/multi-split.class.js +1 -1
- package/dist/components/layout/navigation-menu-item/navigation-menu-item.class.d.ts +2 -4
- package/dist/components/layout/navigation-menu-item/navigation-menu-item.class.js +1 -1
- package/dist/components/layout/reorder-list/reorder-item.class.d.ts +1 -4
- package/dist/components/layout/reorder-list/reorder-item.class.js +2 -2
- package/dist/components/media/attachment-trigger/attachment-trigger.class.d.ts +5 -9
- package/dist/components/media/attachment-trigger/attachment-trigger.class.js +5 -5
- package/dist/components/media/av-player/av-player.class.js +3 -3
- package/dist/components/media/file-input/file-input.class.d.ts +3 -6
- package/dist/components/media/file-input/file-input.class.js +3 -3
- package/dist/components/media/lightbox/lightbox.class.d.ts +11 -20
- package/dist/components/media/lightbox/lightbox.class.js +1 -1
- package/dist/components/media/map/map-data-layers.d.ts +20 -0
- package/dist/components/media/map/map-data-layers.js +1 -0
- package/dist/components/media/map/map.class.js +3 -3
- package/dist/components/media/media-time.d.ts +2 -0
- package/dist/components/media/media-time.js +1 -0
- package/dist/components/media/video/video.class.js +5 -5
- package/dist/components/media/video-playlist/video-playlist.class.js +2 -2
- package/dist/components/overlays/callout/callout.class.d.ts +2 -5
- package/dist/components/overlays/callout/callout.class.js +2 -2
- package/dist/components/overlays/dialog/dialog.class.d.ts +4 -7
- package/dist/components/overlays/dialog/dialog.class.js +2 -2
- package/dist/components/overlays/overlay/dropdown.class.d.ts +5 -10
- package/dist/components/overlays/overlay/dropdown.class.js +2 -2
- package/dist/components/overlays/overlay/popover.class.d.ts +2 -3
- package/dist/components/overlays/popup/popup.class.js +1 -1
- package/dist/components/overlays/progress/progress-bar.class.d.ts +1 -4
- package/dist/components/overlays/progress/progress-bar.class.js +2 -2
- package/dist/components/overlays/progress/progress-ring.class.d.ts +1 -4
- package/dist/components/overlays/progress/progress-ring.class.js +2 -2
- package/dist/components/overlays/progress/progress-shared.d.ts +3 -3
- package/dist/components/overlays/progress/progress-shared.js +1 -1
- package/dist/components/overlays/toast/toast-item.class.js +1 -1
- package/dist/components/retrieval/graph/graph.class.d.ts +5 -10
- package/dist/components/retrieval/graph/graph.class.js +1 -1
- package/dist/components/retrieval/knowledge-base/knowledge-base.class.d.ts +7 -14
- package/dist/components/retrieval/knowledge-base/knowledge-base.class.js +2 -3
- package/dist/components/retrieval/knowledge-graph-explorer/knowledge-graph-explorer.class.d.ts +2 -8
- package/dist/components/retrieval/memory-panel/memory-panel.class.js +0 -4
- package/dist/components/retrieval/rag-answer/rag-answer.class.js +1 -1
- package/dist/components/utility/export-button/export-button.class.d.ts +6 -10
- package/dist/components/utility/export-button/export-button.class.js +1 -1
- package/dist/components/utility/mention-popover/mention-popover.class.js +1 -1
- package/dist/components/viewers/geojson-view/geojson-view.class.d.ts +1 -1
- package/dist/components/viewers/highlight-layer/highlight-layer-timing.js +1 -1
- package/dist/components/viewers/pdf-viewer/pdf-viewer.class.js +4 -4
- package/dist/events.d.ts +17 -78
- package/dist/framework-types.d.ts +1 -1
- package/dist/internal/catalog-picker.js +1 -1
- package/dist/internal/css-motion-time.d.ts +7 -0
- package/dist/internal/css-motion-time.js +1 -0
- package/dist/internal/data-state-renderer.d.ts +1 -3
- package/dist/internal/data-state-renderer.js +1 -1
- package/dist/internal/localization-runtime.d.ts +2 -0
- package/dist/internal/localization-runtime.js +1 -1
- package/dist/internal/lyra-element.js +2 -2
- package/dist/internal/package-metadata.d.ts +1 -1
- package/dist/internal/package-metadata.js +1 -1
- package/dist/looks/data.css +1 -1
- package/dist/looks/terminal.css +1 -1
- package/dist/lyra.d.ts +1 -592
- package/dist/lyra.js +1 -1
- package/dist/testing/event-factory.d.ts +2 -2
- package/dist/testing/interaction-drivers.d.ts +5 -3
- package/dist/testing/lyra-tag-event-map.js +1 -1
- package/dist/theme/looks/data.d.ts +1 -1
- package/dist/theme/looks/data.js +1 -1
- package/dist/theme/looks/terminal.d.ts +1 -1
- package/dist/theme/looks/terminal.js +1 -1
- package/dist/theme/theme.d.ts +2 -80
- package/dist/theme/theme.js +1 -1
- package/llms/components/lr-agent-workspace.md +24 -2
- package/llms/components/lr-alert.md +1 -1
- package/llms/components/lr-animation.md +1 -1
- package/llms/components/lr-app-rail.md +8 -10
- package/llms/components/lr-approval-queue.md +2 -4
- package/llms/components/lr-attachment-trigger.md +3 -4
- package/llms/components/lr-badge.md +2 -2
- package/llms/components/lr-button.md +45 -99
- package/llms/components/lr-callout.md +3 -4
- package/llms/components/lr-carousel.md +3 -5
- package/llms/components/lr-chat-message.md +1 -2
- package/llms/components/lr-claim-evidence.md +1 -1
- package/llms/components/lr-code-block-core.md +2 -2
- package/llms/components/lr-code-block.md +5 -6
- package/llms/components/lr-color-picker.md +1 -1
- package/llms/components/lr-combobox.md +5 -6
- package/llms/components/lr-compare-panel.md +2 -4
- package/llms/components/lr-confirm-bar.md +3 -7
- package/llms/components/lr-context-inspector.md +3 -2
- package/llms/components/lr-context-menu.md +2 -2
- package/llms/components/lr-context-meter.md +2 -4
- package/llms/components/lr-copy-button.md +1 -1
- package/llms/components/lr-data-grid.md +4 -7
- package/llms/components/lr-details.md +3 -3
- package/llms/components/lr-dialog.md +4 -6
- package/llms/components/lr-dock-panel.md +5 -6
- package/llms/components/lr-document-library.md +5 -7
- package/llms/components/lr-drawer.md +3 -3
- package/llms/components/lr-dropdown.md +4 -5
- package/llms/components/lr-eval-run.md +3 -5
- package/llms/components/lr-export-button.md +4 -7
- package/llms/components/lr-file-input.md +0 -5
- package/llms/components/lr-funnel.md +1 -1
- package/llms/components/lr-graph.md +3 -7
- package/llms/components/lr-icon.md +1 -1
- package/llms/components/lr-include.md +1 -1
- package/llms/components/lr-input.md +31 -79
- package/llms/components/lr-json-viewer.md +1 -1
- package/llms/components/lr-knowledge-base.md +4 -6
- package/llms/components/lr-knowledge-graph-explorer.md +2 -5
- package/llms/components/lr-known-date.md +1 -1
- package/llms/components/lr-lightbox.md +9 -7
- package/llms/components/lr-lite-chart.md +1 -5
- package/llms/components/lr-markdown-core.md +3 -4
- package/llms/components/lr-markdown.md +3 -5
- package/llms/components/lr-mcp-app.md +1 -1
- package/llms/components/lr-message-actions.md +2 -3
- package/llms/components/lr-message-feedback.md +1 -3
- package/llms/components/lr-message-parts.md +4 -5
- package/llms/components/lr-multi-split.md +8 -7
- package/llms/components/lr-native-time-input.md +1 -1
- package/llms/components/lr-navigation-menu.md +5 -5
- package/llms/components/lr-number-input.md +3 -1
- package/llms/components/lr-otp-input.md +2 -0
- package/llms/components/lr-page.md +1 -1
- package/llms/components/lr-pan-zoom.md +1 -1
- package/llms/components/lr-phone-input.md +3 -1
- package/llms/components/lr-popover.md +2 -2
- package/llms/components/lr-progress-bar.md +3 -5
- package/llms/components/lr-progress-ring.md +5 -7
- package/llms/components/lr-prompt-input.md +1 -1
- package/llms/components/lr-prompt-queue.md +1 -1
- package/llms/components/lr-prompt-studio.md +1 -1
- package/llms/components/lr-rag-eval-dashboard.md +1 -1
- package/llms/components/lr-rating.md +2 -2
- package/llms/components/lr-realtime-session.md +1 -1
- package/llms/components/lr-reorder-item.md +1 -1
- package/llms/components/lr-reorder-list.md +2 -3
- package/llms/components/lr-retrieval-compare.md +1 -1
- package/llms/components/lr-select.md +3 -1
- package/llms/components/lr-selection-toolbar.md +1 -1
- package/llms/components/lr-sequence-strip.md +3 -8
- package/llms/components/lr-span-waterfall.md +1 -1
- package/llms/components/lr-split-panel.md +1 -1
- package/llms/components/lr-streaming-text-core.md +2 -1
- package/llms/components/lr-streaming-text.md +3 -2
- package/llms/components/lr-subagent-panel.md +1 -1
- package/llms/components/lr-swatch-picker.md +7 -6
- package/llms/components/lr-switch.md +3 -1
- package/llms/components/lr-table.md +33 -85
- package/llms/components/lr-terminal.md +2 -5
- package/llms/components/lr-textarea.md +1 -1
- package/llms/components/lr-thread-list.md +8 -14
- package/llms/components/lr-time-input.md +1 -1
- package/llms/components/lr-toggle-group.md +2 -2
- package/llms/components/lr-toggle.md +1 -1
- package/llms/components/lr-tool-approval-dialog.md +4 -7
- package/llms/components/lr-tool-call-block.md +1 -1
- package/llms/components/lr-tool-timeline.md +2 -5
- package/llms/components/lr-video-playlist.md +1 -1
- package/llms/components/lr-video.md +1 -1
- package/llms/components/lr-widget-renderer.md +7 -6
- package/llms/components/lr-zoomable-frame.md +1 -1
- package/llms/index.md +3 -618
- package/llms/migration.md +614 -614
- package/llms/shared/events-and-types.md +32 -31
- package/llms/shared/frameworks-and-ssr.md +7 -3
- package/llms/shared/imports-and-registration.md +22 -22
- package/llms/shared/localization-and-rtl.md +2 -2
- package/llms/shared/native-styles-and-utilities.md +263 -0
- package/llms/shared/styles-and-tokens.md +85 -676
- package/llms/shared/testing-and-utilities.md +12 -11
- package/llms/shared/v23-to-v24-migration.md +167 -0
- package/llms/shared.md +149 -494
- package/llms/tokens.md +3 -3
- package/llms.txt +9 -4
- package/package.json +7 -311
- package/registrations.json +1 -1
- package/vscode-html-data.json +1 -1
- package/web-types.json +1 -1
- package/dist/ssr-loader.d.ts +0 -2
- package/dist/ssr-loader.js +0 -1
- package/dist/theme/presets/shadcn.d.ts +0 -22
- package/dist/theme/presets/shadcn.js +0 -1
- package/dist/theme/presets.d.ts +0 -49
- package/dist/theme/presets.js +0 -1
- package/dist/themes/shadcn.css +0 -1
|
@@ -7,7 +7,7 @@
|
|
|
7
7
|
- **Family** `components/overlays/` — see `llms/index.md` for its siblings
|
|
8
8
|
- **Status** `stable` since `4.0.0` — see the maturity and deprecation policy in `llms/shared.md`
|
|
9
9
|
- **Release history** [CHANGELOG.md](../../CHANGELOG.md); family-wide breaking-change summaries: [overlays](https://github.com/aceshooting/lyra-ui/blob/main/packages/lyra-ui/llms/overlays.md)
|
|
10
|
-
- **
|
|
10
|
+
- **Deprecations** none
|
|
11
11
|
- **Optional peers** none
|
|
12
12
|
- **Themeable via** 15 parts, 21 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`
|
|
@@ -44,8 +44,6 @@ read, and neither is deprecated.
|
|
|
44
44
|
the generated visible title (string property or rich `label` slot) at that semantic level;
|
|
45
45
|
invalid untyped values retain level 3, while `none` keeps visual title text without heading
|
|
46
46
|
semantics. A direct light-DOM heading retains its own native/ARIA level.
|
|
47
|
-
- `accessibleLabel: string = ''` (property only) — explicit accessible-only name; unlike `label`,
|
|
48
|
-
it never renders visible text. In markup, use the host `aria-label`.
|
|
49
47
|
- `heading?: string` — legacy visible-title fallback, after the `label` slot and `label` property;
|
|
50
48
|
it has no effect when a direct light-DOM heading already supplies custom chrome
|
|
51
49
|
- `withoutCloseButton: boolean = false` (attribute `without-close-button`, reflected) — removes the
|
|
@@ -274,7 +272,7 @@ from).
|
|
|
274
272
|
</div>
|
|
275
273
|
</lr-dialog>
|
|
276
274
|
<script type="module">
|
|
277
|
-
import "@aceshooting/lyra-ui/components/
|
|
275
|
+
import "@aceshooting/lyra-ui/components/lr-dialog.js";
|
|
278
276
|
|
|
279
277
|
const dlg = document.getElementById("dlg");
|
|
280
278
|
// Listeners first: `lr-show` is emitted synchronously inside show().
|
|
@@ -312,8 +310,8 @@ A dialog with no chrome of Lyra's own, animating faster and blurring the page be
|
|
|
312
310
|
```
|
|
313
311
|
|
|
314
312
|
Accessible naming and visible title are separate. Naming precedence is: (1) host `aria-label`, by
|
|
315
|
-
attribute presence including an explicitly empty value, (2)
|
|
316
|
-
|
|
313
|
+
attribute presence including an explicitly empty value, (2) the copied text of an unslotted direct
|
|
314
|
+
light-DOM heading, then (3) the shadow-owned visible title wrapper.
|
|
317
315
|
Visible-title precedence is the rich `label` slot, then the mapped `label` property, then legacy
|
|
318
316
|
`heading`. The direct-heading case copies text because an IDREF cannot cross from the panel's shadow
|
|
319
317
|
tree to a light-DOM heading; the mapped title wrapper can use `aria-labelledby` because it lives in
|
|
@@ -53,8 +53,7 @@ renders at the `280px` default, and `event.detail.size` reads `undefined`.
|
|
|
53
53
|
|
|
54
54
|
**Exported types:** `LyraDockPanelEdge = 'start' | 'end' | 'top' | 'bottom'`, readonly
|
|
55
55
|
`LyraDockPanelResizeDetail = { extent: string }`, readonly
|
|
56
|
-
`LyraDockPanelCollapseChangeDetail = { expanded: boolean
|
|
57
|
-
key remains emitted but is deprecated; use its inverse, `expanded`), and `LyraDockPanelEventMap`.
|
|
56
|
+
`LyraDockPanelCollapseChangeDetail = { expanded: boolean }`, and `LyraDockPanelEventMap`.
|
|
58
57
|
The former dock-specific `parseLengthPx()` export is removed; dock length resolution is now a
|
|
59
58
|
private adapter over the library's canonical CSS-length resolver, with container/viewport units
|
|
60
59
|
resolved in the host's owner realm.
|
|
@@ -74,10 +73,10 @@ resolved in the host's owner realm.
|
|
|
74
73
|
after each genuine keyboard step whose own `lr-resize-request` was not prevented. `pointercancel`,
|
|
75
74
|
lost capture, disconnect/adoption, live policy/geometry mutation, no-op attempts, and a prevented
|
|
76
75
|
`lr-resize-request` all emit nothing.
|
|
77
|
-
- `lr-collapse-request` (cancelable; `detail: { expanded
|
|
78
|
-
built-in collapse toggle
|
|
79
|
-
|
|
80
|
-
|
|
76
|
+
- `lr-collapse-request` (cancelable; `detail: { expanded }` is the state proposed by the
|
|
77
|
+
built-in collapse toggle. Call `preventDefault()` to leave the host `collapsed` property
|
|
78
|
+
unchanged. Not fired when a consumer assigns `collapsed` directly), `lr-collapse-change`
|
|
79
|
+
(non-cancelable; `detail: { expanded }` is
|
|
81
80
|
the accepted built-in-toggle state. Not fired when a consumer assigns `collapsed` directly). Both
|
|
82
81
|
details are fresh readonly/frozen snapshots.
|
|
83
82
|
|
|
@@ -7,7 +7,7 @@
|
|
|
7
7
|
- **Family** `components/data/` — see `llms/index.md` for its siblings
|
|
8
8
|
- **Status** `stable` since `4.1.0` — see the maturity and deprecation policy in `llms/shared.md`
|
|
9
9
|
- **Release history** [CHANGELOG.md](../../CHANGELOG.md); family-wide breaking-change summaries: [data](https://github.com/aceshooting/lyra-ui/blob/main/packages/lyra-ui/llms/data.md)
|
|
10
|
-
- **
|
|
10
|
+
- **Deprecations** none
|
|
11
11
|
- **Optional peers** none
|
|
12
12
|
- **Themeable via** 21 parts, 0 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`
|
|
@@ -62,12 +62,10 @@ the nested table.
|
|
|
62
62
|
- `lr-sort` — non-cancelable; an accepted sort commits the same fields with `phase: 'commit'`.
|
|
63
63
|
- `lr-selection-change` — non-cancelable; fresh frozen readonly `{ documentIds }`.
|
|
64
64
|
- `lr-open` — non-cancelable; frozen readonly `{ documentId }`.
|
|
65
|
-
- `lr-retry-request`
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
otherwise the default clears them. Subscribe to one spelling. The alias is a veto point, not a
|
|
70
|
-
completion notification, and its removal is not before 24.0.0.
|
|
65
|
+
- `lr-retry-request` — cancelable, `detail: null`; the nested table's built-in retry button was
|
|
66
|
+
activated, only rendered while `error` is set. The library contains the child's request, then
|
|
67
|
+
emits its own canonical request. Preventing it leaves both library and table errors set; otherwise
|
|
68
|
+
the default clears them.
|
|
71
69
|
|
|
72
70
|
**Slots:** `error` — replaces the nested table's built-in failed-load state, including its retry
|
|
73
71
|
button, while `error` is set.
|
|
@@ -7,7 +7,7 @@
|
|
|
7
7
|
- **Family** `components/overlays/` — see `llms/index.md` for its siblings
|
|
8
8
|
- **Status** `stable` since `4.0.0` — see the maturity and deprecation policy in `llms/shared.md`
|
|
9
9
|
- **Release history** [CHANGELOG.md](../../CHANGELOG.md); family-wide breaking-change summaries: [overlays](https://github.com/aceshooting/lyra-ui/blob/main/packages/lyra-ui/llms/overlays.md)
|
|
10
|
-
- **
|
|
10
|
+
- **Deprecations** none
|
|
11
11
|
- **Optional peers** none
|
|
12
12
|
- **Themeable via** 15 parts, 26 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`
|
|
@@ -34,7 +34,7 @@ the slide animation are its own.
|
|
|
34
34
|
- `contained: boolean = false` (attribute `contained`, reflected) — position within the nearest
|
|
35
35
|
containing block without a backdrop, page inerting, focus trap, scroll lock, top-layer
|
|
36
36
|
promotion, or global Escape ownership
|
|
37
|
-
- `heading?: string`, `label: string`,
|
|
37
|
+
- `heading?: string`, `label: string`,
|
|
38
38
|
`withoutCloseButton: boolean = false` (attribute `without-close-button`, reflected),
|
|
39
39
|
`noHeader: boolean = false` (attribute `no-header`, Shoelace's spelling, reflected),
|
|
40
40
|
`withoutHeader: boolean = false` (attribute `without-header`, Web Awesome's spelling, reflected;
|
|
@@ -42,7 +42,7 @@ the slide animation are its own.
|
|
|
42
42
|
hint), and `lightDismiss: boolean = false` (attribute `light-dismiss`) — inherited dialog naming,
|
|
43
43
|
chrome and dismissal options. A plain `aria-label` attribute on the host names the panel, inherited
|
|
44
44
|
unchanged from `lr-dialog`: it is the strongest naming override, by attribute presence including
|
|
45
|
-
an explicitly empty value, ahead of
|
|
45
|
+
an explicitly empty value, ahead of any slotted heading.
|
|
46
46
|
- `headingLevel: LyraHeadingLevel = '3'` (attribute `heading-level`, reflected) — semantic level of
|
|
47
47
|
the generated title, from `1` through `6`, or `none` for visual-only title text. A direct slotted
|
|
48
48
|
heading retains its own native level.
|
|
@@ -7,7 +7,7 @@
|
|
|
7
7
|
- **Family** `components/overlays/` — see `llms/index.md` for its siblings
|
|
8
8
|
- **Status** `stable` since `4.0.0` — see the maturity and deprecation policy in `llms/shared.md`
|
|
9
9
|
- **Release history** [CHANGELOG.md](../../CHANGELOG.md); family-wide breaking-change summaries: [overlays](https://github.com/aceshooting/lyra-ui/blob/main/packages/lyra-ui/llms/overlays.md)
|
|
10
|
-
- **
|
|
10
|
+
- **Deprecations** none
|
|
11
11
|
- **Optional peers** none
|
|
12
12
|
- **Themeable via** 13 parts, 11 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`
|
|
@@ -101,10 +101,9 @@ its surface.
|
|
|
101
101
|
- `containingElement?: HTMLElement` (property only) — an external element that counts as inside for
|
|
102
102
|
light-dismiss handling.
|
|
103
103
|
- `withoutArrow: boolean = false` (attribute `without-arrow`, reflected) — suppresses the
|
|
104
|
-
pointer. `arrow
|
|
105
|
-
|
|
106
|
-
|
|
107
|
-
`lr-popover` for existing Lyra consumers.
|
|
104
|
+
pointer. Set `without-arrow` to preserve the previous omitted-arrow appearance.
|
|
105
|
+
- `arrowPlacement`, `arrowPadding`, and `accessibleLabel` (`aria-label`) are inherited from
|
|
106
|
+
`lr-popover`.
|
|
108
107
|
- `popupRole: 'menu'` (attribute `popup-role`) is the narrowed inherited surface. Dropdowns cannot
|
|
109
108
|
be changed into dialogs; use `lr-popover popup-role="dialog"` for arbitrary dialog-like content.
|
|
110
109
|
|
|
@@ -7,7 +7,7 @@
|
|
|
7
7
|
- **Family** `components/agent-tools/` — see `llms/index.md` for its siblings
|
|
8
8
|
- **Status** `stable` since `9.0.0` — see the maturity and deprecation policy in `llms/shared.md`
|
|
9
9
|
- **Release history** [CHANGELOG.md](../../CHANGELOG.md); family-wide breaking-change summaries: [agent-tools](https://github.com/aceshooting/lyra-ui/blob/main/packages/lyra-ui/llms/agent-tools.md)
|
|
10
|
-
- **
|
|
10
|
+
- **Deprecations** none
|
|
11
11
|
- **Optional peers** `dompurify`, `katex`, `marked`, `shiki` — see `llms/peers.md`
|
|
12
12
|
- **Themeable via** 25 parts, 0 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`
|
|
@@ -54,7 +54,7 @@ active? }`. `label` and `variant` customize application-defined lifecycle displa
|
|
|
54
54
|
**Events:** `lr-example-toggle` (`detail: EvalExampleToggleDetail` = `{ exampleId: string; expanded:
|
|
55
55
|
boolean }`), `lr-example-citation-select` (`detail: EvalCitationSelectDetail` = `{ exampleId:
|
|
56
56
|
string; citation: Citation }` — the nested `lr-grounding-summary`'s own `{ citation }` correlated
|
|
57
|
-
with the example it came from, so a host needn't walk the DOM), `lr-example-tool-approval-decide-request`
|
|
57
|
+
with the example it came from, so a host needn't walk the DOM), `lr-example-tool-approval-decide-request`
|
|
58
58
|
(`detail: EvalToolApprovalDetail` = `ToolTimelineApprovalDetail & { exampleId: string }` =
|
|
59
59
|
`{ invocationId: string; approved: boolean; args?: unknown; sourceKey?: string; exampleId: string
|
|
60
60
|
}`). The approval
|
|
@@ -64,9 +64,7 @@ host resolves asynchronous validation. The component also contains and correlate
|
|
|
64
64
|
child events as `lr-example-claim-select` (`{ exampleId, claim }`),
|
|
65
65
|
`lr-example-tool-activate` (`{ exampleId, invocationId, sourceKey? }`), and
|
|
66
66
|
`lr-example-tool-render-error` (`{ exampleId, invocationId, sourceKey?, toolName, error }`).
|
|
67
|
-
`lr-example-tool-approval-decide`
|
|
68
|
-
with the same correlated detail. Preventing either spelling propagates the nested approval veto;
|
|
69
|
-
subscribe to one spelling.
|
|
67
|
+
The cancelable `lr-example-tool-approval-decide-request` propagates its veto to the nested approval.
|
|
70
68
|
|
|
71
69
|
|
|
72
70
|
**CSS parts:** `base`, `header`,
|
|
@@ -7,7 +7,7 @@
|
|
|
7
7
|
- **Family** `components/utility/` — see `llms/index.md` for its siblings
|
|
8
8
|
- **Status** `stable` since `4.0.0` — see the maturity and deprecation policy in `llms/shared.md`
|
|
9
9
|
- **Release history** [CHANGELOG.md](../../CHANGELOG.md); family-wide breaking-change summaries: [utility](https://github.com/aceshooting/lyra-ui/blob/main/packages/lyra-ui/llms/utility.md)
|
|
10
|
-
- **
|
|
10
|
+
- **Deprecations** none
|
|
11
11
|
- **Optional peers** none
|
|
12
12
|
- **Themeable via** 6 parts, 16 custom properties — see this component's own `@csspart`/`@cssprop` list below
|
|
13
13
|
- **Library-wide behavior** (events, form association, `locale`/`strings`, tokens, TS types): `llms/shared.md`
|
|
@@ -79,7 +79,7 @@ extension?: string }`. Descriptor labels/descriptions are consumer-supplied, alr
|
|
|
79
79
|
|
|
80
80
|
**Methods:** `focus(options?)`, `blur()`, and `click()` forward to the native trigger button.
|
|
81
81
|
|
|
82
|
-
**Events:** `lr-export-request`
|
|
82
|
+
**Events:** `lr-export-request` (`detail: { format: string }`, **cancelable** — call `preventDefault()` to
|
|
83
83
|
substitute your own server-generated download instead of the built-in client-side one; the rows a
|
|
84
84
|
non-prevented built-in download serializes are read **after** this dispatch, so `.rows` assigned from
|
|
85
85
|
inside the listener still reaches it, and `getRows` is consulted at the same point),
|
|
@@ -90,9 +90,6 @@ also shown via the trigger's `trigger-error` part and announced through the shar
|
|
|
90
90
|
region, so a listener is needed only for additional handling; activation does not throw into
|
|
91
91
|
consumer code), `lr-show`, `lr-hide` (cancelable format-menu visibility transitions; self-imposed
|
|
92
92
|
closes caused by disablement, loading, or an unusable format list emit neither event).
|
|
93
|
-
`lr-export` is the deprecated cancelable alias, dispatched after `lr-export-request` with equal
|
|
94
|
-
detail. Either event can veto the export; subscribe to one spelling. Removal of the alias is not
|
|
95
|
-
before 24.0.0.
|
|
96
93
|
|
|
97
94
|
**Slots:** none.
|
|
98
95
|
|
|
@@ -140,7 +137,7 @@ change every unset export button beneath it.
|
|
|
140
137
|
{ key: "value", label: "Value" },
|
|
141
138
|
];
|
|
142
139
|
exp.formats = ["csv", "json"]; // shows a format-choice menu instead of exporting immediately
|
|
143
|
-
exp.addEventListener("lr-export", (e) =>
|
|
140
|
+
exp.addEventListener("lr-export-request", (e) =>
|
|
144
141
|
console.log("exporting", e.detail.format)
|
|
145
142
|
);
|
|
146
143
|
|
|
@@ -154,7 +151,7 @@ change every unset export button beneath it.
|
|
|
154
151
|
extension: "xlsx",
|
|
155
152
|
},
|
|
156
153
|
];
|
|
157
|
-
exp.addEventListener("lr-export", async (e) => {
|
|
154
|
+
exp.addEventListener("lr-export-request", async (e) => {
|
|
158
155
|
if (e.detail.format !== "xlsx") return;
|
|
159
156
|
e.preventDefault();
|
|
160
157
|
exp.loading = true;
|
|
@@ -9,7 +9,6 @@
|
|
|
9
9
|
- **Release history** [CHANGELOG.md](../../CHANGELOG.md); family-wide breaking-change summaries: [media](https://github.com/aceshooting/lyra-ui/blob/main/packages/lyra-ui/llms/media.md)
|
|
10
10
|
- **Deprecated part** `base` since `8.2.3`; use part `::part(file-input)`; removal not before `10.0.0` — The file-input part names the interactive picker surface; base remains on that same node during the compatibility window. That version is a policy floor, not a plan: `wa-file-input` still publishes its own deprecated `base` part, so this alias is removed only when upstream's is.
|
|
11
11
|
- **Deprecated part** `label` since `8.2.3`; use part `::part(form-control-label)`; removal not before `10.0.0` — The form-control-label part follows the shared form-control vocabulary; label remains on that same node during the compatibility window. That version is a policy floor, not a plan: `wa-file-input` still publishes its own deprecated `label` part, so this alias is removed only when upstream's is.
|
|
12
|
-
- **Deprecated property** `accessibleLabel` since `22.0.0`; use attribute `Use element.ariaLabel or setAttribute('aria-label', label); host attribute presence takes precedence over the compatibility fallback.`; removal not before `24.0.0` — The native host accessible-name API replaces this fallback property. The earlier accessible-label attribute deprecation has its own published release window; the programmatic property remains supported throughout its later window.
|
|
13
12
|
- **Optional peers** none
|
|
14
13
|
- **Themeable via** 22 parts, 21 custom properties — see this component's own `@csspart`/`@cssprop` list below
|
|
15
14
|
- **Library-wide behavior** (events, form association, `locale`/`strings`, tokens, TS types): `llms/shared.md`
|
|
@@ -132,10 +131,6 @@ enabled buttons retain pointer feedback.
|
|
|
132
131
|
- `validationTarget: HTMLElement | undefined` — the focusable base of the dropzone control after
|
|
133
132
|
first render. Assign another shadow descendant to override where native constraint-validation UI
|
|
134
133
|
is anchored; assign `undefined` to restore the default focusable base
|
|
135
|
-
- `accessibleLabel: string = ''` (property only, deprecated; removal not before 24.0.0) — accessible name forwarded to the semantic
|
|
136
|
-
dropzone and native file input, without changing visible copy. A host `aria-label` wins over it.
|
|
137
|
-
When neither is set, the form label (`label` or the `label` slot) names the dropzone, then the
|
|
138
|
-
localized instruction. In markup, name the dropzone with the host `aria-label`.
|
|
139
134
|
- `acceptedMessage?: string` (attribute `accepted-message`) — live-region message after an
|
|
140
135
|
accepted selection; `{count}` is replaced with the accepted count. Absence uses the localized
|
|
141
136
|
singular/plural `fileInputAcceptedOne`/`fileInputAcceptedMany` default. Every explicit string,
|
|
@@ -78,7 +78,7 @@ shown when `stages` exceeds the 500-stage render ceiling)
|
|
|
78
78
|
|
|
79
79
|
```html
|
|
80
80
|
<script type="module">
|
|
81
|
-
import '@aceshooting/lyra-ui/components/
|
|
81
|
+
import '@aceshooting/lyra-ui/components/lr-funnel.js';
|
|
82
82
|
</script>
|
|
83
83
|
|
|
84
84
|
<lr-funnel id="signup" label="Self-serve signup" share-precision="1"></lr-funnel>
|
|
@@ -7,8 +7,7 @@
|
|
|
7
7
|
- **Family** `components/retrieval/` — see `llms/index.md` for its siblings
|
|
8
8
|
- **Status** `stable` since `4.0.0` — see the maturity and deprecation policy in `llms/shared.md`
|
|
9
9
|
- **Release history** [CHANGELOG.md](../../CHANGELOG.md); family-wide breaking-change summaries: [retrieval](https://github.com/aceshooting/lyra-ui/blob/main/packages/lyra-ui/llms/retrieval.md)
|
|
10
|
-
- **
|
|
11
|
-
- **Deprecated event** `lr-node-click` since `22.0.0`; use event `lr-node-activate`; removal not before `24.0.0` — Activation covers pointer and keyboard gestures. The old event remains available with its original detail; edge activation names its optional identifier edgeId.
|
|
10
|
+
- **Deprecations** none
|
|
12
11
|
- **Optional peers** `d3-drag`, `d3-force`, `d3-selection`, `d3-zoom` — see `llms/peers.md`
|
|
13
12
|
- **Themeable via** 19 parts, 17 custom properties — see this component's own `@csspart`/`@cssprop` list below
|
|
14
13
|
- **Library-wide behavior** (events, form association, `locale`/`strings`, tokens, TS types): `llms/shared.md`
|
|
@@ -153,10 +152,7 @@ edgeId? }`; the optional `edgeId` is the stable `LyraGraphEdge.id` supplied by t
|
|
|
153
152
|
Enter/Space activations within 500ms — regardless of `LyraGraphNode.expandable`), `lr-community-activate`
|
|
154
153
|
(`detail: { communityId }`, a hull was activated by pointer or keyboard), `lr-selection-change`
|
|
155
154
|
(`detail: { selectedNodeIds, selectedEdgeIds }`, a controlled selection intent), and `lr-viewport-change`
|
|
156
|
-
(`detail: { k, x, y }`, a frame-coalesced camera/layout signal).
|
|
157
|
-
right after its canonical event: `lr-node-click` (use `lr-node-activate`, equal detail),
|
|
158
|
-
`lr-link-click` (use `lr-edge-activate`, renaming detail.linkId to detail.edgeId); these aliases
|
|
159
|
-
remain through v23.
|
|
155
|
+
(`detail: { k, x, y }`, a frame-coalesced camera/layout signal).
|
|
160
156
|
|
|
161
157
|
**Slots:** none.
|
|
162
158
|
|
|
@@ -217,7 +213,7 @@ localized `part="error"` alert. Install with
|
|
|
217
213
|
```html
|
|
218
214
|
<lr-graph style="display:block;height:500px"></lr-graph>
|
|
219
215
|
<script type="module">
|
|
220
|
-
import "@aceshooting/lyra-ui/components/
|
|
216
|
+
import "@aceshooting/lyra-ui/components/lr-graph.js";
|
|
221
217
|
|
|
222
218
|
const g = document.querySelector("lr-graph");
|
|
223
219
|
g.nodes = [
|
|
@@ -130,7 +130,7 @@ fetch allowlist, the response is still byte-capped, and the markup is still sani
|
|
|
130
130
|
cannot widen what an icon is allowed to render.
|
|
131
131
|
|
|
132
132
|
```ts
|
|
133
|
-
import "@aceshooting/lyra-ui/components/
|
|
133
|
+
import "@aceshooting/lyra-ui/components/lr-icon.js"; // registers <lr-icon>
|
|
134
134
|
import {
|
|
135
135
|
registerIconLibrary,
|
|
136
136
|
unregisterIconLibrary,
|
|
@@ -121,7 +121,7 @@ retried; a stale response never paints over a newer `src`.
|
|
|
121
121
|
Loading navigation…
|
|
122
122
|
</lr-include>
|
|
123
123
|
<script type="module">
|
|
124
|
-
import "@aceshooting/lyra-ui/components/
|
|
124
|
+
import "@aceshooting/lyra-ui/components/lr-include.js";
|
|
125
125
|
|
|
126
126
|
const include = document.querySelector("#navigation");
|
|
127
127
|
include.addEventListener("lr-include-error", (event) => {
|
|
@@ -21,23 +21,15 @@ form-associated via the same `FormAssociated` mixin as `lr-textarea`. Ships the
|
|
|
21
21
|
`label`/`hint`/`errorText` form-control chrome as `lr-textarea`/`lr-select`, and the same
|
|
22
22
|
`size` scale as `lr-select`/`lr-combobox`.
|
|
23
23
|
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
or while disabled/readonly. Native `step="any"` remains a non-steppable no-op.
|
|
28
|
-
|
|
29
|
-
Removing `label`, `hint`, `help-text`, or `error-text` safely omits that content while retaining
|
|
30
|
-
native `null` property readback. Explicit empty strings remain empty and later supplied text renders
|
|
31
|
-
normally. The same inherited behavior applies to `lr-number-input` and `lr-native-time-input`.
|
|
24
|
+
Removing `label`, `hint`, `help-text`, or `error-text` omits that content while retaining native
|
|
25
|
+
`null` property readback. Explicit empty strings remain empty. `lr-number-input` and
|
|
26
|
+
`lr-native-time-input` inherit this behavior.
|
|
32
27
|
|
|
33
28
|
Changing own `disabled` from true to false in the same task that disables an ancestor fieldset keeps
|
|
34
29
|
the native editing control effectively disabled. The enabled first-legend exception and explicit
|
|
35
30
|
own-disabled state retain their native meaning; validity and form submission follow the effective
|
|
36
31
|
disabled state.
|
|
37
32
|
|
|
38
|
-
Pressing Enter submits the ancestor `<form>` — the implicit submission a native `<input>` performs;
|
|
39
|
-
see "Enter-to-submit" below for the exact rules and for which controls deliberately opt out.
|
|
40
|
-
|
|
41
33
|
Public `--lr-input-*` theme inputs stay undeclared on the host, so an ancestor theme wrapper can
|
|
42
34
|
override size, appearance, and pill fallbacks; a value set directly on the element still wins.
|
|
43
35
|
When a clear or password action is present, `2xs` through `m` grow only enough to contain its
|
|
@@ -65,12 +57,9 @@ shared hit target (42px including the row border at the default theme); `l` and
|
|
|
65
57
|
- `value: string = ''` (from `FormAssociated`)
|
|
66
58
|
- `defaultValue: string = ''` — reset value, backed by the standard `value` content attribute;
|
|
67
59
|
`default-value` is accepted as a Shoelace attribute alias
|
|
68
|
-
- `name: string` (from `FormAssociated`) and
|
|
69
|
-
|
|
70
|
-
`id="input"`
|
|
71
|
-
control's own `name`/`id` — not `autocomplete` alone — recognize `<lr-input>` fields. The
|
|
72
|
-
internal `<label for>` tracks whichever id is in use. Leaving `id` unset on the host keeps the
|
|
73
|
-
internal input at `id="input"`, identical to before
|
|
60
|
+
- `name: string` (from `FormAssociated`) and inherited `id` are forwarded to the native input for
|
|
61
|
+
password-manager field detection. The internal `<label for>` tracks that id; without a host `id`,
|
|
62
|
+
the input uses `id="input"`
|
|
74
63
|
- `placeholder: string = ''`
|
|
75
64
|
- `clearable: boolean = false` (reflected) — shows a localized clear action while a `text` or
|
|
76
65
|
`search` input has a value; clearing preserves input focus
|
|
@@ -89,7 +78,7 @@ shared hit target (42px including the row border at the default theme); `l` and
|
|
|
89
78
|
- `title: string = ''` — forwarded to the native input
|
|
90
79
|
- `spellcheck: boolean = true` — forwarded to the native input, including `spellcheck="false"`
|
|
91
80
|
- `autocapitalize: string = ''` / `autocorrect` (read: `boolean = true`; write:
|
|
92
|
-
`boolean | 'off' | 'on'`;
|
|
81
|
+
`boolean | 'off' | 'on'`; markup `autocorrect="on"`/`autocorrect="off"`)
|
|
93
82
|
- `inputMode: string = ''` (attribute `inputmode`) / `enterKeyHint: string = ''` (attribute
|
|
94
83
|
`enterkeyhint`) — `autocapitalize`, `inputMode`, and `enterKeyHint` are forwarded verbatim to the
|
|
95
84
|
native input and an empty string omits them; `autocorrect` is normalized to canonical `on`/`off`
|
|
@@ -97,11 +86,6 @@ shared hit target (42px including the row border at the default theme); `l` and
|
|
|
97
86
|
native properties; `autocorrect` reads as boolean while accepting both Web Awesome's boolean
|
|
98
87
|
writes and Shoelace's `'off'`/`'on'` writes
|
|
99
88
|
|
|
100
|
-
**8.0 migration:** the former camel-case string property `autoCorrect` is not retained as a public
|
|
101
|
-
alias. Prefer boolean `autocorrect` writes in new code; migrated Shoelace `'off'`/`'on'` property
|
|
102
|
-
writes remain valid and read back as booleans. Markup uses `autocorrect="on"` /
|
|
103
|
-
`autocorrect="off"`.
|
|
104
|
-
|
|
105
89
|
- `min?: number | string` / `max?: number | string` (attributes `min`/`max`) /
|
|
106
90
|
`step?: number | 'any'` (attribute `step`, accepts the native `'any'` value alongside a number)
|
|
107
91
|
— forwarded verbatim to the native
|
|
@@ -118,10 +102,7 @@ writes remain valid and read back as booleans. Markup uses `autocorrect="on"` /
|
|
|
118
102
|
forwarded to the native input and reported as `validity.patternMismatch`. Anchored to the whole
|
|
119
103
|
value by the platform, so no `^`/`$` is needed; an empty value never violates it
|
|
120
104
|
- `passwordToggle: boolean = false` (attribute `password-toggle`, reflected — `type="password"`
|
|
121
|
-
only) —
|
|
122
|
-
Before, `type="password"` always rendered the toggle and there was no way to remove it; a consumer
|
|
123
|
-
whose threat model or visual design excludes one had to hide it with CSS. Add `password-toggle`
|
|
124
|
-
to keep the old rendering
|
|
105
|
+
only) — opt-in built-in show/hide-password button
|
|
125
106
|
- `passwordVisible: boolean = false` (attribute `password-visible` — `type="password"` only) —
|
|
126
107
|
whether the field currently reveals its raw text. Toggled by the built-in button, and also
|
|
127
108
|
settable up front with or without that button being rendered
|
|
@@ -142,10 +123,8 @@ writes remain valid and read back as booleans. Markup uses `autocorrect="on"` /
|
|
|
142
123
|
referenced element only needs a string `.value`, so a native `<input>`/`<textarea>` works the
|
|
143
124
|
same as another `lr-input`; see "A new-password field" below for the password-confirmation shape
|
|
144
125
|
- `withoutSpinButtons: boolean = false` (attribute `without-spin-buttons`, reflected —
|
|
145
|
-
`type="number"` only) — suppresses
|
|
146
|
-
|
|
147
|
-
platform's spinners now render exactly as they do on a bare `<input type="number">`.
|
|
148
|
-
`<lr-number-input>` defaults this the other way (`true`), so its rendering is unchanged
|
|
126
|
+
`type="number"` only) — suppresses native spin buttons; unset leaves them visible.
|
|
127
|
+
`<lr-number-input>` defaults this to `true`
|
|
149
128
|
- `noSpinButtons: boolean = false` (attribute `no-spin-buttons`) — Shoelace alias for
|
|
150
129
|
`withoutSpinButtons`; either suppresses native number spinners
|
|
151
130
|
- `debounce?: number` (attribute `debounce`, ms) — how long to wait after the last keystroke
|
|
@@ -195,7 +174,8 @@ Three more native passthroughs:
|
|
|
195
174
|
non-finite `steps` falls back to `1`; `0` is a no-op, as is `step="any"`, as is any `type` the
|
|
196
175
|
platform gives no allowed value step (it throws `InvalidStateError` for those, which is swallowed
|
|
197
176
|
here), and as is `disabled` or `readonly`. `type="number"` and `type="time"` are the two that step
|
|
198
|
-
— on a time field the unit is seconds, matching its `step`.
|
|
177
|
+
— on a time field the unit is seconds, matching its `step`. They use the current properties in
|
|
178
|
+
that synchronous call and are also no-ops before the native input renders.
|
|
199
179
|
`<lr-number-input>`'s stepper buttons build on these and _do_ emit, because a button press is a
|
|
200
180
|
user edit.
|
|
201
181
|
|
|
@@ -281,10 +261,8 @@ what is specific to it.
|
|
|
281
261
|
|
|
282
262
|
- **`size` accepts both spellings of every tier.** The canonical ladder is
|
|
283
263
|
`2xs`/`xs`/`s`/`m`/`l`/`xl`, and `small`/`medium`/`large` — Web Awesome's and Shoelace's names —
|
|
284
|
-
are accepted as exact synonyms for `s`/`m`/`l`.
|
|
285
|
-
|
|
286
|
-
`el.size` reads back whatever you wrote. A migration off either upstream is a tag rename with no
|
|
287
|
-
attribute rewrite. One ladder now drives `lr-button`, `lr-input`, `lr-select`, `lr-combobox`,
|
|
264
|
+
are accepted as exact synonyms for `s`/`m`/`l`. `el.size` reads back the spelling supplied.
|
|
265
|
+
One ladder drives `lr-button`, `lr-input`, `lr-select`, `lr-combobox`,
|
|
288
266
|
`lr-date-input`, `lr-textarea`, `lr-checkbox`, `lr-radio`, `lr-switch` and `lr-slider`, so
|
|
289
267
|
same-`size` controls line up in a toolbar row by construction. Retune a whole tier from one place
|
|
290
268
|
with `--lr-theme-form-control-height-*` rather than per component. Set
|
|
@@ -293,9 +271,8 @@ what is specific to it.
|
|
|
293
271
|
radius.
|
|
294
272
|
- **`appearance` is the fill vocabulary and nothing else.** `accent` (the loud semantic fill),
|
|
295
273
|
`filled` (a quiet tint of the same tone), `outlined` (a border, no fill), `filled-outlined`
|
|
296
|
-
(both) and `plain` (neither).
|
|
297
|
-
|
|
298
|
-
library-wide. `lr-button` adds two tiers of its own on top (`quiet` and `link`). Text fields
|
|
274
|
+
(both) and `plain` (neither). Container treatment uses `frame` (`card`/`plain`).
|
|
275
|
+
`lr-button` adds `quiet` and `link`. Text fields
|
|
299
276
|
(`lr-input`, `lr-textarea`, and `lr-select`) default to `outlined`; `lr-button` defaults to `accent`.
|
|
300
277
|
- **`pill` rounds the control's ends.** Available on `lr-input`, `lr-number-input`, `lr-time-input`,
|
|
301
278
|
`lr-textarea`, `lr-select`, `lr-combobox`, `lr-date-input`, `lr-phone-input`, `lr-token-input`,
|
|
@@ -303,13 +280,9 @@ what is specific to it.
|
|
|
303
280
|
component's own `--lr-*-radius` knob to `--lr-radius-pill` — rather than declaring a radius on a
|
|
304
281
|
part, so the knob stays the single corner-radius override point and a consumer's own value still
|
|
305
282
|
wins over it.
|
|
306
|
-
- **`setCustomValidity(message)` and `resetValidity()` are on every form-associated
|
|
307
|
-
here
|
|
308
|
-
|
|
309
|
-
(`lr-button` is a form-associated submitter, so an ancestor `<fieldset disabled>` and
|
|
310
|
-
`form.elements` reach it, but it carries no value or validity and therefore has no such method;
|
|
311
|
-
`lr-icon-button` is deliberately not form-associated.) It is the standard channel for a rejection
|
|
312
|
-
no client-side constraint can express — a server-side
|
|
283
|
+
- **`setCustomValidity(message)` and `resetValidity()` are on every form-associated value control
|
|
284
|
+
here and on the form-associated `lr-button` submitter.** `lr-icon-button` is not form-associated.
|
|
285
|
+
These methods handle a rejection no client-side constraint can express — a server-side
|
|
313
286
|
"that email is already registered". A non-empty message raises `customError` and becomes
|
|
314
287
|
`validationMessage`, so the control fails `checkValidity()`, blocks submission, and matches
|
|
315
288
|
`:invalid`/`:state(invalid)`.
|
|
@@ -398,7 +371,7 @@ Several controls expose the same pair: a per-`size` `*-min-height` **floor**, an
|
|
|
398
371
|
<lr-input type="time" label="Reminder" id="reminder"></lr-input>
|
|
399
372
|
<button type="button" id="open-picker">Pick a time</button>
|
|
400
373
|
<script type="module">
|
|
401
|
-
import "@aceshooting/lyra-ui/components/
|
|
374
|
+
import "@aceshooting/lyra-ui/components/lr-input.js";
|
|
402
375
|
const time = document.getElementById("reminder");
|
|
403
376
|
// showPicker() needs user activation, so drive it from a real click.
|
|
404
377
|
document
|
|
@@ -411,14 +384,8 @@ Several controls expose the same pair: a per-`size` `*-min-height` **floor**, an
|
|
|
411
384
|
attribute form is enough to turn each on. `autofocus` is likewise `false`-defaulting — none of
|
|
412
385
|
these four needs the property form to be reset.
|
|
413
386
|
|
|
414
|
-
**A new-password field.**
|
|
415
|
-
|
|
416
|
-
has no single correct default for "a password field" (`new-password` on a set/change/reset flow,
|
|
417
|
-
`current-password` on a login one, and one is never derivable from the other), so a `purpose`
|
|
418
|
-
property would still need a second parameter carrying that same distinction, in exchange for a
|
|
419
|
-
non-standard vocabulary a migrating `wa-`/`sl-`/native `<input type="password">` author would have
|
|
420
|
-
to learn instead of carrying over unchanged. Compose the existing primitives directly, the same way
|
|
421
|
-
a plain native `<input type="password">` does:
|
|
387
|
+
**A new-password field.** Set `autocomplete` explicitly: use `new-password` for set/change/reset
|
|
388
|
+
flows and `current-password` for login. A confirmation pair can use `match`:
|
|
422
389
|
|
|
423
390
|
```html
|
|
424
391
|
<lr-input
|
|
@@ -440,12 +407,8 @@ a plain native `<input type="password">` does:
|
|
|
440
407
|
></lr-input>
|
|
441
408
|
```
|
|
442
409
|
|
|
443
|
-
`autocomplete="new-password"`
|
|
444
|
-
|
|
445
|
-
own generator and save prompt from cross-contaminating a change/reset flow with the account's
|
|
446
|
-
existing credential; set it explicitly on every field in the pair, since `autocomplete` has no
|
|
447
|
-
purpose-derived default here. `match` (above) is what makes the second field fail validity —
|
|
448
|
-
`customError`, with a localized mismatch message — for as long as its value disagrees with the
|
|
410
|
+
Set `autocomplete="new-password"` on both fields in the pair; there is no purpose-derived default.
|
|
411
|
+
`match` makes the second field fail with a localized `customError` while its value differs from the
|
|
449
412
|
first field's, referenced here by id.
|
|
450
413
|
|
|
451
414
|
**Known gotchas:**
|
|
@@ -465,24 +428,13 @@ first field's, referenced here by id.
|
|
|
465
428
|
value, and the localized `valueInvalid` string when only the script-value check did.
|
|
466
429
|
- An empty value is never `tooShort` and never a `patternMismatch` — both native constraints skip
|
|
467
430
|
the empty string, and `required` is what rejects it.
|
|
468
|
-
-
|
|
469
|
-
|
|
470
|
-
|
|
471
|
-
|
|
472
|
-
|
|
473
|
-
|
|
474
|
-
|
|
475
|
-
- `showPicker()` swallows every platform failure by design, so it returns without telling you the
|
|
476
|
-
picker didn't open. Don't build a flow that assumes a picker is now on screen.
|
|
477
|
-
- `stepUp()`/`stepDown()` are silent — they emit no `input`/`change`. Emit your own, or drive the
|
|
478
|
-
value through a real user affordance, if downstream state depends on those events.
|
|
479
|
-
- **A `match` id reference resolves in this element's own root, not the whole document.** Two
|
|
480
|
-
fields inside two different shadow roots (a confirm field composed by one component, the field it
|
|
481
|
-
should match composed by an unrelated one) must pair through a direct element reference
|
|
482
|
-
(`confirm.match = passwordEl`) instead of an id string — exactly like every other idref this
|
|
483
|
-
library resolves, `aria-describedby` included. An id that does not resolve at all (a typo, or an
|
|
484
|
-
element removed later) is inert rather than a permanent block on submission: `match` stops
|
|
485
|
-
applying, it does not fail closed.
|
|
431
|
+
- `password-toggle` and its CSS part render only for `type="password"` with the opt-in attribute.
|
|
432
|
+
Native number spinners remain visible unless `without-spin-buttons` is set; `lr-number-input`
|
|
433
|
+
defaults to its own stepper pair.
|
|
434
|
+
- `showPicker()` can return without opening a picker. `stepUp()`/`stepDown()` emit no `input` or
|
|
435
|
+
`change`; downstream observers needing those events should use a user affordance or emit them.
|
|
436
|
+
- A `match` id resolves in this element's own root. Use a direct element reference
|
|
437
|
+
(`confirm.match = passwordEl`) across shadow roots. An unresolved id makes the constraint inert.
|
|
486
438
|
|
|
487
439
|
**Additional API surface:**
|
|
488
440
|
|
|
@@ -122,7 +122,7 @@ tokens `--lr-color-border-subtle`,
|
|
|
122
122
|
|
|
123
123
|
```ts
|
|
124
124
|
import { html } from "lit";
|
|
125
|
-
import "@aceshooting/lyra-ui/components/
|
|
125
|
+
import "@aceshooting/lyra-ui/components/lr-json-viewer.js";
|
|
126
126
|
|
|
127
127
|
html`<lr-json-viewer
|
|
128
128
|
.data=${apiResponse}
|
|
@@ -7,7 +7,7 @@
|
|
|
7
7
|
- **Family** `components/retrieval/` — see `llms/index.md` for its siblings
|
|
8
8
|
- **Status** `stable` since `4.1.0` — see the maturity and deprecation policy in `llms/shared.md`
|
|
9
9
|
- **Release history** [CHANGELOG.md](../../CHANGELOG.md); family-wide breaking-change summaries: [retrieval](https://github.com/aceshooting/lyra-ui/blob/main/packages/lyra-ui/llms/retrieval.md)
|
|
10
|
-
- **
|
|
10
|
+
- **Deprecations** none
|
|
11
11
|
- **Optional peers** none
|
|
12
12
|
- **Themeable via** 29 parts, 0 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`
|
|
@@ -62,11 +62,9 @@ before 9.0.0 — the library's only abbreviated event prefix. `<lr-knowledge-bas
|
|
|
62
62
|
re-emitted them under the `lr-source-*` names, so a host listening on the admin shell needs no
|
|
63
63
|
change; a host listening directly on `<lr-knowledge-base>` renames its four listeners.
|
|
64
64
|
`lr-retry-request` (`detail: null`, cancelable) proposes a retry when the nested table's built-in
|
|
65
|
-
retry button is activated.
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
earlier than 24.0.0 and warns only when vetoed. This component contains both nested table retry
|
|
69
|
-
events and re-proposes its own pair, so hosts receive each parent event once.
|
|
65
|
+
retry button is activated. Preventing it keeps both the parent and table in the error state.
|
|
66
|
+
Without a veto, the default action clears `error`. This component contains the nested table request
|
|
67
|
+
and re-proposes its own canonical request, so hosts receive the parent event once.
|
|
70
68
|
|
|
71
69
|
**Slots:** `error` — replaces the nested table's built-in failed-load state, including its retry
|
|
72
70
|
button, while `error` is set.
|
|
@@ -7,8 +7,7 @@
|
|
|
7
7
|
- **Family** `components/retrieval/` — see `llms/index.md` for its siblings
|
|
8
8
|
- **Status** `stable` since `4.1.0` — see the maturity and deprecation policy in `llms/shared.md`
|
|
9
9
|
- **Release history** [CHANGELOG.md](../../CHANGELOG.md); family-wide breaking-change summaries: [retrieval](https://github.com/aceshooting/lyra-ui/blob/main/packages/lyra-ui/llms/retrieval.md)
|
|
10
|
-
- **
|
|
11
|
-
- **Deprecated event** `lr-node-click` since `22.0.0`; use event `lr-node-activate`; removal not before `24.0.0` — Activation covers pointer and keyboard gestures. The old event remains available with its original detail; edge activation names its optional identifier edgeId.
|
|
10
|
+
- **Deprecations** none
|
|
12
11
|
- **Optional peers** `d3-drag`, `d3-force`, `d3-selection`, `d3-zoom` — see `llms/peers.md`
|
|
13
12
|
- **Themeable via** 13 parts, 1 custom property — see this component's own `@csspart`/`@cssprop` list below
|
|
14
13
|
- **Library-wide behavior** (events, form association, `locale`/`strings`, tokens, TS types): `llms/shared.md`
|
|
@@ -132,8 +131,6 @@ filtered-out id). None change `selectedNodeId` or filters.
|
|
|
132
131
|
(`detail: { nodeId, x, y }`), `lr-edge-activate` (`detail: { sourceNodeId, targetNodeId, edgeId? }`), `lr-community-activate`
|
|
133
132
|
(`detail: { communityId }`), `lr-node-expand` (`detail: { nodeId }`, from `lr-graph` and/or `lr-neighbor-list`),
|
|
134
133
|
`lr-relation-activate` (`detail: { relation, sourceNodeId?, targetNodeId?, occurrenceIndex }`, from `lr-path-strip`).
|
|
135
|
-
- `lr-node-click` — deprecated alias emitted after `lr-node-activate` with the same detail.
|
|
136
|
-
`lr-link-click` follows `lr-edge-activate`, retaining its legacy `linkId` detail field.
|
|
137
134
|
|
|
138
135
|
**Slots:** `details` — overrides the details popover's default content (an `lr-entity-card` with a
|
|
139
136
|
nested `lr-neighbor-list` and a pin toggle) entirely, including the two additive slots below.
|
|
@@ -176,7 +173,7 @@ the composed graph too. Retheme the composed graph through `lr-graph`'s own cust
|
|
|
176
173
|
resolves `LyraGraphNode.label || LyraGraphNode.accessibleLabel || LyraGraphNode.id` — a node with
|
|
177
174
|
only a spoken `accessibleLabel` (no visible `label`) still shows that text instead of falling
|
|
178
175
|
straight through to its raw id.
|
|
179
|
-
- `lr-graph.getNodePosition()` and `lr-node-
|
|
176
|
+
- `lr-graph.getNodePosition()` and `lr-node-activate`'s `{ x, y }` are graph-_local_ drawing
|
|
180
177
|
coordinates, never viewport pixels. For `renderer="svg"` this component resolves the real viewport
|
|
181
178
|
rect from `event.composedPath()`'s `[part="node"]` element; for `renderer="canvas"` (no per-node
|
|
182
179
|
DOM) it uses the click's `clientX`/`clientY`. While an svg-click popover stays open it re-anchors
|
|
@@ -77,7 +77,7 @@ Each access returns a fresh `LyraFormValidator<LyraKnownDate>[]`; its entry obse
|
|
|
77
77
|
element's current `ValidityState` into `{ isValid, message, invalidKeys }` without changing it.
|
|
78
78
|
|
|
79
79
|
```ts
|
|
80
|
-
import { LyraKnownDate } from "@aceshooting/lyra-ui/components/
|
|
80
|
+
import { LyraKnownDate } from "@aceshooting/lyra-ui/components/lr-known-date.js";
|
|
81
81
|
|
|
82
82
|
const knownDate = document.querySelector("lr-known-date")!;
|
|
83
83
|
const result = LyraKnownDate.validators[0].checkValidity(knownDate);
|