@aceshooting/lyra-ui 23.0.0 → 24.0.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 +9 -43
- 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 +2 -2
- package/dist/components/conversation/agent-workspace/agent-workspace.class.js +0 -1
- 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/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 +1 -1
- 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 +4 -4
- 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 +25 -24
- 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 +142 -487
- 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
|
@@ -52,10 +52,7 @@ withValue:boolean;
|
|
|
52
52
|
* over any tier. */
|
|
53
53
|
size:LyraSize;
|
|
54
54
|
/** Mapped accessible-name property. */
|
|
55
|
-
label:string;
|
|
56
|
-
/** Compatibility fallback below the host aria-label, including an explicitly empty host value.
|
|
57
|
-
* @deprecated Use the host aria-label attribute or the native ariaLabel property. */
|
|
58
|
-
get accessibleLabel():string;set accessibleLabel(value:string);
|
|
55
|
+
label:string;
|
|
59
56
|
/** The host `aria-label`: names the progressbar ahead of every other source, by presence, so an
|
|
60
57
|
* explicitly empty value stays empty. */
|
|
61
58
|
private hostAriaLabel;private cachedVisibleLabelText;private labelObserver?;private readonly labelUpgrades;private pendingLabelRefresh?;private readonly onLabelSlotChange;connectedCallback():void;
|
|
@@ -1,6 +1,6 @@
|
|
|
1
|
-
import{__decorate}from"tslib";import{CustomElementUpgradeObserver}from"../../../internal/custom-element-upgrade-observer.js";import{html,nothing}from"lit";import{property}from"lit/decorators.js";import{bindAccessibleTextObserver}from"../../../internal/accessibility-visibility.js";import{
|
|
1
|
+
import{__decorate}from"tslib";import{CustomElementUpgradeObserver}from"../../../internal/custom-element-upgrade-observer.js";import{html,nothing}from"lit";import{property}from"lit/decorators.js";import{bindAccessibleTextObserver}from"../../../internal/accessibility-visibility.js";import{LyraElement}from"../../../internal/lyra-element.js";import{variants}from"../../../internal/variants.styles.js";import{formatProgressPercent,joinAccessibleVisibleText,progressPercent,progressSafeMax,progressSafeValue,resolveProgressLabel}from"./progress-shared.js";import{styles}from"./progress.styles.js";import{LYRA_DEFAULT_progress}from"../../../internal/default-strings.generated.js";class LyraProgressBar extends LyraElement{constructor(){super(...arguments),this.value=0,this.max=100,this.indeterminate=!1,this.variant="brand",this.withValue=!1,this.size="m",this.label="",this.hostAriaLabel=null,this.cachedVisibleLabelText="",this.labelUpgrades=new CustomElementUpgradeObserver(()=>{!this.isConnected||!this.labelObserver||(this.bindLabelObserverTargets(),this.recomputeVisibleLabelText())}),this.onLabelSlotChange=event=>{const target=event.target;target?.nodeType!==1||target.localName!=="slot"||(this.bindLabelObserverTargets(),this.recomputeVisibleLabelText(),this.requestUpdate(),this.scheduleCascadeLabelRefresh())}}static{this.defaultStrings={...super.defaultStrings,progress:LYRA_DEFAULT_progress}}static{this.styles=[LyraElement.styles,variants,styles]}attributeChangedCallback(name,oldValue,newValue){super.attributeChangedCallback(name,oldValue,newValue)}connectedCallback(){super.connectedCallback(),this.addEventListener("slotchange",this.onLabelSlotChange),this.rebuildLabelObserver(),this.hasUpdated?this.recomputeVisibleLabelText():this.seedFirstRenderState(()=>this.recomputeVisibleLabelText())}adoptedCallback(){super.adoptedCallback(),this.rebuildLabelObserver()}rebuildLabelObserver(){this.labelObserver?.disconnect(),this.labelUpgrades.disconnect();const MutationObserverCtor=this.ownerDocument.defaultView?.MutationObserver;this.labelObserver=MutationObserverCtor?new MutationObserverCtor(()=>{this.bindLabelObserverTargets(),this.recomputeVisibleLabelText(),this.requestUpdate(),this.scheduleCascadeLabelRefresh()}):void 0,this.bindLabelObserverTargets()}scheduleCascadeLabelRefresh(){const ownerWindow=this.ownerDocument?.defaultView;if(!ownerWindow)return;const pending=this.pendingLabelRefresh;if(pending?.ownerWindow===ownerWindow)return;pending&&this.cancelCascadeLabelRefresh();const frameId=ownerWindow.requestAnimationFrame(()=>{const current=this.pendingLabelRefresh;if(current?.ownerWindow!==ownerWindow||current.kind!=="frame"||current.handle!==frameId)return;if(!this.isConnected||this.ownerDocument.defaultView!==ownerWindow){this.pendingLabelRefresh=void 0;return}const timeoutId=ownerWindow.setTimeout(()=>{const next=this.pendingLabelRefresh;next?.ownerWindow!==ownerWindow||next.kind!=="timeout"||next.handle!==timeoutId||(this.pendingLabelRefresh=void 0,this.isConnected&&this.ownerDocument.defaultView===ownerWindow&&this.recomputeVisibleLabelText())},0);this.pendingLabelRefresh={ownerWindow,kind:"timeout",handle:timeoutId}});this.pendingLabelRefresh={ownerWindow,kind:"frame",handle:frameId}}cancelCascadeLabelRefresh(){const pending=this.pendingLabelRefresh;pending&&(pending.kind==="frame"?pending.ownerWindow.cancelAnimationFrame(pending.handle):pending.ownerWindow.clearTimeout(pending.handle),this.pendingLabelRefresh=void 0)}bindLabelObserverTargets(){bindAccessibleTextObserver(this.labelObserver,this,[],this.labelUpgrades)}disconnectedCallback(){this.removeEventListener("slotchange",this.onLabelSlotChange),this.labelObserver?.disconnect(),this.labelUpgrades.disconnect(),this.labelObserver=void 0,this.cancelCascadeLabelRefresh(),super.disconnectedCallback()}computeVisibleLabelText(){const renderedSlots=this.renderRoot?.querySelectorAll("slot"),lightDomNodes=this.childNodes,nodes=renderedSlots&&renderedSlots.length>0?[...renderedSlots].flatMap(slot=>slot.assignedNodes({flatten:!0})):Array.from(lightDomNodes??[]).filter(node=>{if(node.nodeType!==1)return!0;const slotName=node.getAttribute("slot")??"";return slotName===""||slotName==="label"});return joinAccessibleVisibleText(nodes,{requireRendered:!1,skipRootAncestorValidation:!0})}recomputeVisibleLabelText(){const next=this.computeVisibleLabelText();next!==this.cachedVisibleLabelText&&(this.cachedVisibleLabelText=next,this.requestUpdate())}get safeMax(){return progressSafeMax(this.max)}get safeValue(){return progressSafeValue(this.value,this.safeMax)}get percent(){return progressPercent(this.safeValue,this.safeMax)}get formattedPercent(){return formatProgressPercent(this.effectiveLocale,this.percent)}render(){const label=resolveProgressLabel({hostAriaLabel:this.hostAriaLabel,label:this.label,visibleText:this.cachedVisibleLabelText,localizedFallback:this.localize("progress")}),hasVisibleLabel=!!this.cachedVisibleLabelText||this.withValue;return html`<div part="base progress-bar" role="progressbar" aria-label=${label}
|
|
2
2
|
aria-valuemin="0" aria-valuemax=${this.safeMax} aria-valuenow=${this.indeterminate?nothing:this.safeValue}
|
|
3
3
|
aria-valuetext=${this.indeterminate?nothing:this.formattedPercent}>
|
|
4
4
|
<div part="label" ?hidden=${!hasVisibleLabel}><slot @slotchange=${this.onLabelSlotChange}></slot><slot name="label" @slotchange=${this.onLabelSlotChange}></slot>${this.withValue&&!this.indeterminate?html`<span>${this.formattedPercent}</span>`:nothing}</div>
|
|
5
5
|
<div part="track"><div part="indicator" style="inline-size:${this.indeterminate?"40%":`${this.percent}%`}"></div></div>
|
|
6
|
-
</div>`}}__decorate([property({type:Number,reflect:!0})],LyraProgressBar.prototype,"value",void 0),__decorate([property({type:Number})],LyraProgressBar.prototype,"max",void 0),__decorate([property({type:Boolean,reflect:!0})],LyraProgressBar.prototype,"indeterminate",void 0),__decorate([property({reflect:!0})],LyraProgressBar.prototype,"variant",void 0),__decorate([property({type:Boolean,attribute:"with-value"})],LyraProgressBar.prototype,"withValue",void 0),__decorate([property({reflect:!0})],LyraProgressBar.prototype,"size",void 0),__decorate([property()],LyraProgressBar.prototype,"label",void 0),__decorate([property({attribute
|
|
6
|
+
</div>`}}__decorate([property({type:Number,reflect:!0})],LyraProgressBar.prototype,"value",void 0),__decorate([property({type:Number})],LyraProgressBar.prototype,"max",void 0),__decorate([property({type:Boolean,reflect:!0})],LyraProgressBar.prototype,"indeterminate",void 0),__decorate([property({reflect:!0})],LyraProgressBar.prototype,"variant",void 0),__decorate([property({type:Boolean,attribute:"with-value"})],LyraProgressBar.prototype,"withValue",void 0),__decorate([property({reflect:!0})],LyraProgressBar.prototype,"size",void 0),__decorate([property()],LyraProgressBar.prototype,"label",void 0),__decorate([property({attribute:"aria-label"})],LyraProgressBar.prototype,"hostAriaLabel",void 0);export{LyraProgressBar};
|
|
@@ -67,10 +67,7 @@ withValue:boolean;
|
|
|
67
67
|
* indicator stroke width and the center label's font size are unaffected by the tier. */
|
|
68
68
|
size:LyraSize;
|
|
69
69
|
/** Mapped accessible-name property. */
|
|
70
|
-
label:string;
|
|
71
|
-
/** Compatibility fallback below the host aria-label, including an explicitly empty host value.
|
|
72
|
-
* @deprecated Use the host aria-label attribute or the native ariaLabel property. */
|
|
73
|
-
get accessibleLabel():string;set accessibleLabel(value:string);
|
|
70
|
+
label:string;
|
|
74
71
|
/** The host `aria-label`: names the progressbar ahead of every other source, by presence, so an
|
|
75
72
|
* explicitly empty value stays empty. */
|
|
76
73
|
private hostAriaLabel;private cachedVisibleLabelText;private labelObserver?;private readonly labelUpgrades;private readonly onLabelSlotChange;connectedCallback():void;
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import{__decorate}from"tslib";import{CustomElementUpgradeObserver}from"../../../internal/custom-element-upgrade-observer.js";import{html,nothing}from"lit";import{property}from"lit/decorators.js";import{bindAccessibleTextObserver}from"../../../internal/accessibility-visibility.js";import{
|
|
1
|
+
import{__decorate}from"tslib";import{CustomElementUpgradeObserver}from"../../../internal/custom-element-upgrade-observer.js";import{html,nothing}from"lit";import{property}from"lit/decorators.js";import{bindAccessibleTextObserver}from"../../../internal/accessibility-visibility.js";import{LyraElement}from"../../../internal/lyra-element.js";import{variants}from"../../../internal/variants.styles.js";import{formatProgressPercent,joinAccessibleVisibleText,progressPercent,progressSafeMax,progressSafeValue,resolveProgressLabel}from"./progress-shared.js";import{ringStyles}from"./progress.styles.js";import{LYRA_DEFAULT_progress}from"../../../internal/default-strings.generated.js";class LyraProgressRing extends LyraElement{constructor(){super(...arguments),this.value=0,this.max=100,this.indeterminate=!1,this.variant="brand",this.withValue=!1,this.size="m",this.label="",this.hostAriaLabel=null,this.cachedVisibleLabelText="",this.labelUpgrades=new CustomElementUpgradeObserver(()=>{!this.isConnected||!this.labelObserver||(this.bindLabelObserverTargets(),this.recomputeVisibleLabelText())}),this.onLabelSlotChange=event=>{const target=event.target;target?.nodeType!==1||target.localName!=="slot"||(this.bindLabelObserverTargets(),this.recomputeVisibleLabelText())}}static{this.defaultStrings={...super.defaultStrings,progress:LYRA_DEFAULT_progress}}static{this.styles=[LyraElement.styles,variants,ringStyles]}attributeChangedCallback(name,oldValue,newValue){super.attributeChangedCallback(name,oldValue,newValue)}connectedCallback(){super.connectedCallback(),this.addEventListener("slotchange",this.onLabelSlotChange),this.rebuildLabelObserver(),this.hasUpdated?this.recomputeVisibleLabelText():this.seedFirstRenderState(()=>this.recomputeVisibleLabelText())}adoptedCallback(){super.adoptedCallback(),this.rebuildLabelObserver()}rebuildLabelObserver(){this.labelObserver?.disconnect(),this.labelUpgrades.disconnect();const MutationObserverCtor=this.ownerDocument?.defaultView?.MutationObserver;this.labelObserver=MutationObserverCtor?new MutationObserverCtor(()=>{this.bindLabelObserverTargets(),this.recomputeVisibleLabelText()}):void 0,this.bindLabelObserverTargets()}bindLabelObserverTargets(){bindAccessibleTextObserver(this.labelObserver,this,[],this.labelUpgrades)}disconnectedCallback(){this.removeEventListener("slotchange",this.onLabelSlotChange),this.labelObserver?.disconnect(),this.labelUpgrades.disconnect(),this.labelObserver=void 0,super.disconnectedCallback()}computeVisibleLabelText(){const slots=this.renderRoot?.querySelectorAll('slot:not([name]), slot[name="label"]'),lightDomNodes=this.childNodes,nodes=slots&&slots.length>0?[...slots].flatMap(slot=>slot.assignedNodes().length>0?slot.assignedNodes({flatten:!0}):[]):Array.from(lightDomNodes??[]).filter(node=>{if(node.nodeType!==1)return!0;const slotName=node.getAttribute("slot")??"";return slotName===""||slotName==="label"});return joinAccessibleVisibleText(nodes)}recomputeVisibleLabelText(){const next=this.computeVisibleLabelText();next!==this.cachedVisibleLabelText&&(this.cachedVisibleLabelText=next,this.requestUpdate())}get safeMax(){return progressSafeMax(this.max)}get safeValue(){return progressSafeValue(this.value,this.safeMax)}get percent(){return progressPercent(this.safeValue,this.safeMax)}get formattedPercent(){return formatProgressPercent(this.effectiveLocale,this.percent)}get indicator(){return this.renderRoot.querySelector('[part="indicator"]')}get indicatorOffset(){const circumference=2*Math.PI*42;return this.indeterminate?circumference*.65:circumference*(1-this.percent/100)}render(){const circumference=2*Math.PI*42,offset=this.indicatorOffset,label=resolveProgressLabel({hostAriaLabel:this.hostAriaLabel,label:this.label,visibleText:this.cachedVisibleLabelText,localizedFallback:this.localize("progress")});return html`<div part="base progress-ring" role="progressbar" aria-label=${label}
|
|
2
2
|
aria-valuemin="0" aria-valuemax=${this.safeMax} aria-valuenow=${this.indeterminate?nothing:this.safeValue}
|
|
3
3
|
aria-valuetext=${this.indeterminate?nothing:this.formattedPercent}>
|
|
4
4
|
<svg viewBox="0 0 100 100" aria-hidden="true">
|
|
@@ -7,4 +7,4 @@ import{__decorate}from"tslib";import{CustomElementUpgradeObserver}from"../../../
|
|
|
7
7
|
stroke-dasharray=${circumference} stroke-dashoffset=${offset}></circle>
|
|
8
8
|
</svg>
|
|
9
9
|
<span part="label"><slot @slotchange=${this.onLabelSlotChange}>${this.indeterminate||!this.withValue?"":this.formattedPercent}</slot><slot name="label" @slotchange=${this.onLabelSlotChange}></slot></span>
|
|
10
|
-
</div>`}}__decorate([property({type:Number,reflect:!0})],LyraProgressRing.prototype,"value",void 0),__decorate([property({type:Number})],LyraProgressRing.prototype,"max",void 0),__decorate([property({type:Boolean,reflect:!0})],LyraProgressRing.prototype,"indeterminate",void 0),__decorate([property({reflect:!0})],LyraProgressRing.prototype,"variant",void 0),__decorate([property({type:Boolean,attribute:"with-value"})],LyraProgressRing.prototype,"withValue",void 0),__decorate([property({reflect:!0})],LyraProgressRing.prototype,"size",void 0),__decorate([property()],LyraProgressRing.prototype,"label",void 0),__decorate([property({attribute
|
|
10
|
+
</div>`}}__decorate([property({type:Number,reflect:!0})],LyraProgressRing.prototype,"value",void 0),__decorate([property({type:Number})],LyraProgressRing.prototype,"max",void 0),__decorate([property({type:Boolean,reflect:!0})],LyraProgressRing.prototype,"indeterminate",void 0),__decorate([property({reflect:!0})],LyraProgressRing.prototype,"variant",void 0),__decorate([property({type:Boolean,attribute:"with-value"})],LyraProgressRing.prototype,"withValue",void 0),__decorate([property({reflect:!0})],LyraProgressRing.prototype,"size",void 0),__decorate([property()],LyraProgressRing.prototype,"label",void 0),__decorate([property({attribute:"aria-label"})],LyraProgressRing.prototype,"hostAriaLabel",void 0);export{LyraProgressRing};
|
|
@@ -30,11 +30,11 @@ export declare function joinAccessibleVisibleText(nodes:Iterable<Node>,options?:
|
|
|
30
30
|
* Accessible name for the `role="progressbar"` node, in the precedence both components document.
|
|
31
31
|
*
|
|
32
32
|
* A host `aria-label` wins by attribute *presence*, so an explicitly empty value stays empty rather
|
|
33
|
-
* than reviving a fallback. Otherwise: the mapped `label` property, then
|
|
34
|
-
*
|
|
33
|
+
* than reviving a fallback. Otherwise: the mapped `label` property, then the visible slotted label
|
|
34
|
+
* text, then the localized default the caller passes in (never a literal
|
|
35
35
|
* string here -- the caller resolves it through `localize()` so `registerLyraLocale()` keeps
|
|
36
36
|
* working).
|
|
37
37
|
*/
|
|
38
38
|
export declare function resolveProgressLabel(parts:{
|
|
39
39
|
/** The host `aria-label` attribute's value, `null` while it is absent. */
|
|
40
|
-
hostAriaLabel:string|null;label:string;
|
|
40
|
+
hostAriaLabel:string|null;label:string;visibleText:string;localizedFallback:string;}):string;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import{composedAccessibilityText,composedAccessibleVisibleText}from"../../../internal/accessibility-visibility.js";import{getNumberFormat}from"../../../internal/intl-cache.js";import{finiteRange}from"../../../internal/numbers.js";const PROGRESS_DEFAULT_MAX=100;function progressSafeMax(max){const normalized=finiteRange(max,PROGRESS_DEFAULT_MAX,0);return normalized>0?normalized:PROGRESS_DEFAULT_MAX}function progressSafeValue(value,safeMax){return finiteRange(value,0,0,safeMax)}function progressPercent(safeValue,safeMax){return safeValue/safeMax*100}function formatProgressPercent(locale,percent){return getNumberFormat(locale,{style:"percent",maximumFractionDigits:0}).format(percent/100)}function primeVisibilityCascade(nodes){const stack=[...nodes].reverse();let remaining=256;for(;stack.length>0&&remaining>0;){const node=stack.pop();if(!node||node.nodeType!==1)continue;const element=node;remaining--;try{element.ownerDocument.defaultView?.getComputedStyle(element).visibility}catch{}const assigned=element.localName==="slot"?element.assignedNodes({flatten:!0}):[],children=assigned.length>0?assigned:Array.from(element.childNodes);for(let index=children.length-1;index>=0;index--){const child=children[index];child&&stack.push(child)}}}function joinAccessibleVisibleText(nodes,options){const boundedRoots=Array.from(nodes).slice(0,256);return primeVisibilityCascade(boundedRoots),(options?composedAccessibilityText(boundedRoots,options):boundedRoots.map(composedAccessibleVisibleText).join(" ")).replace(/\s+/g," ").trim()}function resolveProgressLabel(parts){return parts.hostAriaLabel!==null?parts.hostAriaLabel:parts.label||parts.
|
|
1
|
+
import{composedAccessibilityText,composedAccessibleVisibleText}from"../../../internal/accessibility-visibility.js";import{getNumberFormat}from"../../../internal/intl-cache.js";import{finiteRange}from"../../../internal/numbers.js";const PROGRESS_DEFAULT_MAX=100;function progressSafeMax(max){const normalized=finiteRange(max,PROGRESS_DEFAULT_MAX,0);return normalized>0?normalized:PROGRESS_DEFAULT_MAX}function progressSafeValue(value,safeMax){return finiteRange(value,0,0,safeMax)}function progressPercent(safeValue,safeMax){return safeValue/safeMax*100}function formatProgressPercent(locale,percent){return getNumberFormat(locale,{style:"percent",maximumFractionDigits:0}).format(percent/100)}function primeVisibilityCascade(nodes){const stack=[...nodes].reverse();let remaining=256;for(;stack.length>0&&remaining>0;){const node=stack.pop();if(!node||node.nodeType!==1)continue;const element=node;remaining--;try{element.ownerDocument.defaultView?.getComputedStyle(element).visibility}catch{}const assigned=element.localName==="slot"?element.assignedNodes({flatten:!0}):[],children=assigned.length>0?assigned:Array.from(element.childNodes);for(let index=children.length-1;index>=0;index--){const child=children[index];child&&stack.push(child)}}}function joinAccessibleVisibleText(nodes,options){const boundedRoots=Array.from(nodes).slice(0,256);return primeVisibilityCascade(boundedRoots),(options?composedAccessibilityText(boundedRoots,options):boundedRoots.map(composedAccessibleVisibleText).join(" ")).replace(/\s+/g," ").trim()}function resolveProgressLabel(parts){return parts.hostAriaLabel!==null?parts.hostAriaLabel:parts.label||parts.visibleText||parts.localizedFallback}export{formatProgressPercent,joinAccessibleVisibleText,progressPercent,progressSafeMax,progressSafeValue,resolveProgressLabel};
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import{__decorate}from"tslib";import{html}from"lit";import{property,state}from"lit/decorators.js";import{keyed}from"lit/directives/keyed.js";import{composedParentElement}from"../../../internal/a11y.js";import{CustomElementUpgradeObserver}from"../../../internal/custom-element-upgrade-observer.js";import{composedAccessibilityTextResult}from"../../../internal/accessibility-visibility.js";import{acquireAnnouncementSink}from"../../../internal/announcer.js";import{LyraElement}from"../../../internal/lyra-element.js";import{closeIcon}from"../../../internal/icons.js";import{getSegmenter}from"../../../internal/intl-cache.js";import{prefersReducedMotion}from"../../../internal/motion.js";import{finiteDuration}from"../../../internal/numbers.js";import{composedContains,deepActiveElement}from"../../../internal/overlay-manager.js";import{applyComposedFocusRepair,captureComposedFocusRepair,isActionableElement}from"../../../internal/focus-navigation.js";import{tag}from"../../../internal/prefix.js";import{normalizeSize}from"../../../internal/variants.js";import{variants}from"../../../internal/variants.styles.js";import{styles}from"./toast-item.styles.js";import{TOAST_REGION_ENQUEUE,TOAST_REGION_EVICT,TOAST_REGION_REJECT,TOAST_REGION_SET_ACTIVE,toastRegionControllerFor}from"./toast-region-protocol.js";import{LYRA_DEFAULT_close,LYRA_DEFAULT_closeWithContext,LYRA_DEFAULT_closeWithTruncatedContext,LYRA_DEFAULT_toastContentIncomplete}from"../../../internal/default-strings.generated.js";function parseTime(value){const trimmed=value.trim();return trimmed.endsWith("ms")?Number.parseFloat(trimmed):trimmed.endsWith("s")?Number.parseFloat(trimmed)*1e3:0}function maxCssTime(value){return Math.max(0,...value.split(",").map(parseTime).filter(Number.isFinite))}const CLOSE_LABEL_GRAPHEME_LIMIT=40;function isAssertiveVariant(variant){return variant==="danger"||variant==="warning"}function truncateGraphemes(value,limit,locale){if(typeof Intl.Segmenter!="function")return{snippet:value,truncated:!1};let graphemes;try{graphemes=[...getSegmenter(locale,{granularity:"grapheme"}).segment(value)].map(({segment})=>segment)}catch(error){if(!(error instanceof RangeError))throw error;graphemes=[...getSegmenter(void 0,{granularity:"grapheme"}).segment(value)].map(({segment})=>segment)}return graphemes.length>limit?{snippet:graphemes.slice(0,limit).join(""),truncated:!0}:{snippet:value,truncated:!1}}class LyraToastItem extends LyraElement{constructor(){super(...arguments),this.duration=5e3,this.size="m",this.variant="neutral",this.withIcon=!1,this.elapsedMs=0,this.startedAt=0,this.timerStarted=!1,this.showGeneration=0,this.showCompletionGeneration=0,this.showCompletionRunning=!1,this.showAccepted=!1,this.afterShowEmitted=!1,this.admitted=!1,this.requestingRegionAdmission=!1,this.hovering=!1,this.focused=!1,this.messageUpgrades=new CustomElementUpgradeObserver(()=>{this.isConnected&&(this.bindMessageObserverTargets(),this.recomputeMessageText())}),this.lastAnnouncedMessage="",this.onMessageSlotChange=event=>{const target=event.target;target?.nodeType!==1||target.localName!=="slot"||(this.bindMessageObserverTargets(),this.recomputeMessageText())},this.hideCompletionRunning=!1,this.hideGeneration=0,this.afterHideEmitted=!1,this.messageText="",this.messageTextTruncated=!1,this.hiding=!1,this.progressRun=0,this.surfaceMounted=!1,this.interactionReady=!1,this.resumeTimer=()=>{if(this.timer!==void 0&&(this.timerOwner?.clearTimeout(this.timer),this.timer=void 0,this.timerOwner=void 0),!this.isConnected||!this.admitted||this.hiding||!this.hasAttribute("data-visible")||this.hovering||this.focused)return;const duration=this.safeDuration;if(!isFinite(duration)||duration<=0)return;const remaining=duration-this.elapsedMs;if(remaining<=0){this.requestHide("timer");return}const view=this.ownerDocument.defaultView;if(!view)return;this.startedAt=view.performance.now(),this.timerOwner=view;const timer=view.setTimeout(()=>{this.timer!==timer||this.timerOwner!==view||(this.timer=void 0,this.timerOwner=void 0,this.requestHide("timer"))},remaining);this.timer=timer},this.pauseTimer=()=>{if(this.timer!==void 0){const owner=this.timerOwner;owner?.clearTimeout(this.timer),this.timer=void 0,this.timerOwner=void 0,owner&&(this.elapsedMs+=owner.performance.now()-this.startedAt)}},this.onPointerEnter=()=>{this.hovering=!0,this.pauseTimer()},this.onPointerLeave=()=>{this.hovering=!1,!this.focused&&!this.hiding&&this.resumeTimer()},this.onFocusIn=event=>{const previous=event.relatedTarget;previous?.nodeType===1&&!composedContains(this,previous)&&previous.isConnected&&(this.focusReturnTarget=previous);const activeElement=deepActiveElement(this.ownerDocument);this.pendingFocusRepair=activeElement&&typeof activeElement.focus=="function"?captureComposedFocusRepair(this,activeElement)??void 0:void 0,this.focused=!0,this.pauseTimer()},this.onFocusOut=event=>{if(event.relatedTarget===null&&this.hasAttribute("data-visible")){const parent=this.parentElement,clearIfStillOwned=()=>{this.isConnected&&this.parentElement===parent&&(this.pendingFocusRepair=void 0)},view=this.ownerDocument.defaultView;view?view.queueMicrotask(clearIfStillOwned):queueMicrotask(clearIfStillOwned)}else event.relatedTarget?.nodeType===1&&!composedContains(this,event.relatedTarget)&&(this.pendingFocusRepair=void 0);this.focused=!1,!this.hovering&&!this.hiding&&this.resumeTimer()}}static{this.defaultStrings={...super.defaultStrings,close:LYRA_DEFAULT_close,closeWithContext:LYRA_DEFAULT_closeWithContext,closeWithTruncatedContext:LYRA_DEFAULT_closeWithTruncatedContext,toastContentIncomplete:LYRA_DEFAULT_toastContentIncomplete}}static{this.styles=[LyraElement.styles,variants,styles]}get toastItemElement(){return this.renderRoot.querySelector('[part="toast-item"]')}get effectiveSize(){const value=this.size;return["2xs","xs","s","m","l","xl","small","medium","large"].includes(value)?normalizeSize(value):"m"}get safeDuration(){return this.duration===1/0?1/0:finiteDuration(this.duration,5e3,0)}willUpdate(changed){super.willUpdate(changed),this.setAttribute("data-effective-size",this.effectiveSize),changed.has("duration")&&this.timerStarted&&this.admitted&&this.hasAttribute("data-visible")&&!this.hovering&&!this.focused&&(this.pauseTimer(),this.resumeTimer())}updated(changed){if(super.updated(changed),this.hasAttribute("data-visible")){const previousVariant=changed.get("variant");changed.has("variant")&&isAssertiveVariant(this.variant)!==isAssertiveVariant(previousVariant??"neutral")?this.announceMessage(!0):(changed.has("messageText")||changed.has("messageTextTruncated"))&&this.announceMessage()}this.shadowRoot?.querySelector('[part~="close-icon"] svg')?.setAttribute("part","close-icon__svg")}firstUpdated(changed){super.firstUpdated(changed),this.requestRegionAdmission(),this.admitted&&this.scheduleShow()}connectedCallback(){super.connectedCallback(),this.politeSink??=acquireAnnouncementSink("polite",{document:this.ownerDocument,source:this}),this.assertiveSink??=acquireAnnouncementSink("assertive",{document:this.ownerDocument,source:this});const MutationObserverCtor=this.ownerDocument.defaultView?.MutationObserver;if(this.messageObserver=MutationObserverCtor?new MutationObserverCtor(()=>{this.bindMessageObserverTargets(),this.recomputeMessageText()}):void 0,this.addEventListener("slotchange",this.onMessageSlotChange),this.bindMessageObserverTargets(),this.hasUpdated?this.recomputeMessageText():this.seedFirstRenderState(()=>this.recomputeMessageText()),this.requestRegionAdmission(),!!this.hasUpdated){if(this.hiding){this.completeHide();return}!this.hasAttribute("data-visible")&&this.admitted?this.scheduleShow():this.admitted&&this.timerStarted&&!this.hovering&&!this.focused&&(this.completeShow(),this.resumeTimer())}}requestRegionAdmission(){const controller=toastRegionControllerFor(this);if(controller){this.requestingRegionAdmission=!0;try{controller[TOAST_REGION_ENQUEUE](this)}finally{this.requestingRegionAdmission=!1}return}const parent=this.parentElement;if(parent?.localName===tag("toast")){this.regionOwner=void 0,this.admitted=!1,this.setAttribute("data-toast-queued",""),this.cancelPendingShow(),this.pauseTimer(),this.setSurfaceAvailability(!1);const releaseUnavailableOwner=()=>{this.parentElement===parent&&!toastRegionControllerFor(this)&&this.remove()},view=this.ownerDocument.defaultView;view?view.queueMicrotask(releaseUnavailableOwner):queueMicrotask(releaseUnavailableOwner);return}this.regionOwner=void 0,this.admitted=!0,this.removeAttribute("data-toast-queued"),this.hasAttribute("data-visible")&&(this.setSurfaceAvailability(!0),this.pendingFocusRepair&&(applyComposedFocusRepair(this.pendingFocusRepair),this.pendingFocusRepair=void 0))}[TOAST_REGION_SET_ACTIVE](owner,active){if(this.parentElement===owner){if(this.regionOwner=owner,this.admitted=active,this.toggleAttribute("data-toast-queued",!active),!active){const focusTarget=this.adjacentToastOrReturnTarget(),activeElement=deepActiveElement(this.ownerDocument),repair=this.pendingFocusRepair??(activeElement&&typeof activeElement.focus=="function"?captureComposedFocusRepair(this,focusTarget):null);this.cancelPendingShow(),this.pauseTimer(),this.setSurfaceAvailability(!1),repair&&applyComposedFocusRepair(repair,focusTarget),this.pendingFocusRepair=void 0;return}if(this.hasAttribute("data-visible")&&!this.hiding){this.setSurfaceAvailability(!0),this.pendingFocusRepair&&(applyComposedFocusRepair(this.pendingFocusRepair),this.pendingFocusRepair=void 0),!this.requestingRegionAdmission&&this.timerStarted&&!this.hovering&&!this.focused&&this.resumeTimer(),this.completeShow();return}this.isConnected&&this.hasUpdated&&!this.hiding&&!this.hasAttribute("data-visible")&&this.scheduleShow()}}[TOAST_REGION_EVICT](owner,_reason){this.regionOwner===owner&&(this.regionOwner=void 0,this.admitted=!1,this.cancelPendingShow(),this.showAccepted=!1,this.pauseTimer(),this.setSurfaceAvailability(!1),this.parentElement===owner&&this.remove())}setSurfaceAvailability(available){this.surfaceMounted=available,this.interactionReady=available;const surface=this.shadowRoot?.querySelector('[part="toast-item"]');surface&&(surface.hidden=!available,surface.inert=!available)}cancelPendingShow(){this.showGeneration+=1,this.showAccepted&&!this.afterShowEmitted&&(this.showCompletionGeneration+=1),this.showRafId!==void 0&&(this.showRafOwner?.cancelAnimationFrame(this.showRafId),this.showRafId=void 0,this.showRafOwner=void 0),this.cancelShowAnimation?.(),this.cancelShowAnimation=void 0}scheduleShow(){if(this.showRafId!==void 0||this.hiding||!this.admitted)return;const view=this.ownerDocument.defaultView;if(!view)return;const generation=++this.showGeneration;this.showRafOwner=view,this.showRafId=view.requestAnimationFrame(()=>{this.showRafId=void 0,this.showRafOwner=void 0,!(this.hiding||!this.admitted||generation!==this.showGeneration)&&this.prepareShow(generation)})}async prepareShow(generation){if(await this.updateComplete,generation!==this.showGeneration||!this.isConnected||!this.admitted||this.hiding)return;if(this.emit("lr-show",null,{cancelable:!0}).defaultPrevented){if(generation!==this.showGeneration)return;const owner=this.regionOwner;owner?owner[TOAST_REGION_REJECT](this):this.remove();return}if(generation!==this.showGeneration||!this.isConnected||!this.admitted||this.hiding)return;this.surfaceMounted=!0;const surface=this.shadowRoot?.querySelector('[part="toast-item"]');surface&&(surface.hidden=!1,surface.offsetWidth),this.setAttribute("data-visible",""),this.interactionReady=!0,surface&&(surface.inert=!1),this.announceMessage(!0),this.showAccepted=!0,this.afterShowEmitted=!1,this.showCompletionGeneration+=1,this.completeShow(),this.startTimer()}async completeShow(){if(this.showCompletionRunning||!this.showAccepted||this.afterShowEmitted||this.hiding||!this.admitted||!this.hasAttribute("data-visible"))return;this.showCompletionRunning=!0;const generation=this.showCompletionGeneration;if(await this.waitForVisualCompletion("show"),this.showCompletionRunning=!1,generation!==this.showCompletionGeneration||!this.isConnected||!this.admitted||this.hiding||!this.hasAttribute("data-visible")){this.isConnected&&this.admitted&&!this.hiding&&this.completeShow();return}this.afterShowEmitted||!this.showAccepted||(this.afterShowEmitted=!0,this.showAccepted=!1,this.emit("lr-after-show"))}disconnectedCallback(){const activeElement=deepActiveElement(this.ownerDocument);!this.pendingFocusRepair&&!this.hiding&&this.hasAttribute("data-visible")&&activeElement&&typeof activeElement.focus=="function"&&(this.pendingFocusRepair=captureComposedFocusRepair(this,activeElement)??void 0),super.disconnectedCallback(),this.removeEventListener("slotchange",this.onMessageSlotChange),this.messageObserver?.disconnect(),this.messageObserver=void 0,this.messageUpgrades.disconnect(),this.politeSink?.release(),this.politeSink=void 0,this.assertiveSink?.release(),this.assertiveSink=void 0,this.hiding&&!this.afterHideEmitted&&this.hideGeneration++,this.cancelPendingShow(),this.cancelHideAnimation?.(),this.cancelHideAnimation=void 0,this.pauseTimer(),this.hovering=!1,this.focused=!1,!this.hasAttribute("data-visible")&&!this.hiding&&(this.surfaceMounted=!1,this.interactionReady=!1)}startTimer(){this.timerStarted=!0,this.elapsedMs=0,this.resumeTimer()}clearTimer(){this.timer!==void 0&&this.timerOwner?.clearTimeout(this.timer),this.timer=void 0,this.timerOwner=void 0}waitForVisualCompletion(kind){(kind==="show"?this.cancelShowAnimation:this.cancelHideAnimation)?.();const surface=this.shadowRoot?.querySelector('[part="toast-item"]'),view=this.ownerDocument.defaultView;if(!surface||!view||prefersReducedMotion(this))return Promise.resolve();const computed=view.getComputedStyle(surface),transitionMs=maxCssTime(computed.transitionDuration)+maxCssTime(computed.transitionDelay),animationMs=maxCssTime(computed.animationDuration)+maxCssTime(computed.animationDelay),fallbackMs=Math.max(transitionMs,animationMs);return fallbackMs<=0?Promise.resolve():new Promise(resolve=>{let settled=!1,timeout;const cancelKey=kind==="show"?"cancelShowAnimation":"cancelHideAnimation",finish=()=>{settled||(settled=!0,timeout!==void 0&&view.clearTimeout(timeout),surface.removeEventListener("transitionend",onEnd),surface.removeEventListener("animationend",onEnd),this[cancelKey]===cancel&&(this[cancelKey]=void 0),resolve())},onEnd=event=>{event.target===surface&&finish()},cancel=()=>finish();surface.addEventListener("transitionend",onEnd),surface.addEventListener("animationend",onEnd),timeout=view.setTimeout(finish,fallbackMs+50),this[cancelKey]=cancel})}observeMessageNode(node){if(this.messageObserver){if(node.nodeType===3){this.messageObserver.observe(node,{characterData:!0});return}node.nodeType!==1&&node.nodeType!==11||this.messageObserver.observe(node,{attributes:!0,attributeFilter:["alt","aria-hidden","aria-label","aria-labelledby","class","contenteditable","hidden","href","inert","id","role","slot","style","tabindex"],childList:!0,characterData:!0,subtree:!0})}}bindMessageObserverTargets(){if(!this.messageObserver)return;this.messageObserver.disconnect(),this.observeMessageNode(this);let ancestor=composedParentElement(this);for(;ancestor;)this.messageObserver.observe(ancestor,{attributes:!0,attributeFilter:["aria-hidden","class","hidden","inert","style"]}),ancestor=composedParentElement(ancestor);for(const slot of this.querySelectorAll("slot"))for(const assigned of slot.assignedNodes({flatten:!0}))this.observeMessageNode(assigned)}observeLabelReferenceRoot(root){this.messageObserver?.observe(root,{attributes:!0,attributeFilter:["id"],childList:!0,subtree:!0})}recomputeMessageText(){const slot=this.renderRoot?.querySelector("slot:not([name])"),lightDomNodes=this.childNodes,messageNodes=slot?slot.assignedNodes({flatten:!0}):Array.from(lightDomNodes??[]).filter(node=>node.nodeType!==1||!node.getAttribute("slot")),result=composedAccessibilityTextResult(messageNodes,{requireRendered:!1,shouldPrune:element=>{const slotName=element.getAttribute("slot");return slotName!==null&&slotName!==""||isActionableElement(element)?!0:(this.messageUpgrades.observeElement(element),element.hasAttribute("tabindex")&&element.getAttribute("tabindex")!=="-1")},skipRootAncestorValidation:!0});this.messageText=result.text.trim().replace(/\s+/g," "),this.messageTextTruncated=result.truncated;for(const root of result.labelReferenceRoots)this.observeLabelReferenceRoot(root);for(const reference of result.referencedElements)this.observeMessageNode(reference);for(const root of result.traversedShadowRoots)this.observeMessageNode(root)}announceMessage(force=!1){const message=this.messageText,announcement=this.messageTextTruncated?message?`${message}…`:this.localize("toastContentIncomplete"):message;!force&&announcement===this.lastAnnouncedMessage||(this.lastAnnouncedMessage=announcement,(isAssertiveVariant(this.variant)?this.assertiveSink:this.politeSink)?.announce(announcement))}get closeLabel(){const text=this.messageText;if(!text&&this.messageTextTruncated)return this.localize("closeWithContext",void 0,{snippet:this.localize("toastContentIncomplete")});if(!text)return this.localize("close");const{snippet,truncated}=truncateGraphemes(text,CLOSE_LABEL_GRAPHEME_LIMIT,this.effectiveLocale);return this.messageTextTruncated||truncated?this.localize("closeWithTruncatedContext",void 0,{snippet}):this.localize("closeWithContext",void 0,{snippet})}async hide(){await this.requestHide("manual")}requestHide(source){if(this.hideRequest)return this.hideRequest;if(this.hiding)return Promise.resolve();let resolve,reject;const completion=new Promise((resolveCompletion,rejectCompletion)=>{resolve=resolveCompletion,reject=rejectCompletion});return this.hideRequest=completion,this.emit("lr-hide",null,{cancelable:!0}).defaultPrevented?(source==="timer"&&(this.elapsedMs=0,this.startedAt=0,this.progressRun+=1,this.isConnected&&!this.hovering&&!this.focused&&this.resumeTimer()),this.hideRequest===completion&&(this.hideRequest=void 0),resolve(),completion):(this.hiding=!0,this.showAccepted=!1,this.showCompletionGeneration+=1,this.shadowRoot?.querySelector('[part="close-button"]')?.setAttribute("aria-disabled","true"),this.cancelShowAnimation?.(),this.cancelShowAnimation=void 0,this.clearTimer(),this.removeAttribute("data-visible"),this.setAttribute("data-hiding",""),this.completeHide().then(()=>{this.hideRequest===completion&&(this.hideRequest=void 0),resolve()},reason=>{this.hideRequest===completion&&(this.hideRequest=void 0),reject(reason)}),completion)}async completeHide(){if(this.hideCompletionRunning||this.afterHideEmitted)return;this.hideCompletionRunning=!0;const generation=this.hideGeneration;if(await this.waitForVisualCompletion("hide"),this.hideCompletionRunning=!1,generation!==this.hideGeneration||!this.isConnected){this.isConnected&&await this.completeHide();return}this.afterHideEmitted||(this.repairFocusBeforeRemoval(),this.afterHideEmitted=!0,this.emit("lr-after-hide"),this.remove())}repairFocusBeforeRemoval(){const active=deepActiveElement(this.ownerDocument);composedContains(this,active)&&this.focusAdjacentToastOrReturn()}adjacentToastOrReturnTarget(){const findAdjacent=direction=>{let element=this[direction];for(;element;){if(element.localName===tag("toast-item")){const item=element,surface=item.shadowRoot?.querySelector('[part="toast-item"]');if(!item.hasAttribute("data-hiding")&&!item.hasAttribute("data-toast-queued")&&item.hasAttribute("data-visible")&&item.isConnected&&surface&&!surface.hidden&&!surface.inert)return item.shadowRoot?.querySelector('[part="close-button"]')??null}element=element[direction]}return null};return findAdjacent("nextElementSibling")??findAdjacent("previousElementSibling")??(this.focusReturnTarget?.isConnected&&!composedContains(this,this.focusReturnTarget)?this.focusReturnTarget:null)}focusAdjacentToastOrReturn(){this.adjacentToastOrReturnTarget()?.focus()}renderCloseControl(){const close=html`<span part="close-icon">${closeIcon()}</span>`,duration=this.safeDuration;return!Number.isFinite(duration)||duration<=0?close:html`
|
|
1
|
+
import{__decorate}from"tslib";import{maxCssTime}from"../../../internal/css-motion-time.js";import{html}from"lit";import{property,state}from"lit/decorators.js";import{keyed}from"lit/directives/keyed.js";import{composedParentElement}from"../../../internal/a11y.js";import{CustomElementUpgradeObserver}from"../../../internal/custom-element-upgrade-observer.js";import{composedAccessibilityTextResult}from"../../../internal/accessibility-visibility.js";import{acquireAnnouncementSink}from"../../../internal/announcer.js";import{LyraElement}from"../../../internal/lyra-element.js";import{closeIcon}from"../../../internal/icons.js";import{getSegmenter}from"../../../internal/intl-cache.js";import{prefersReducedMotion}from"../../../internal/motion.js";import{finiteDuration}from"../../../internal/numbers.js";import{composedContains,deepActiveElement}from"../../../internal/overlay-manager.js";import{applyComposedFocusRepair,captureComposedFocusRepair,isActionableElement}from"../../../internal/focus-navigation.js";import{tag}from"../../../internal/prefix.js";import{normalizeSize}from"../../../internal/variants.js";import{variants}from"../../../internal/variants.styles.js";import{styles}from"./toast-item.styles.js";import{TOAST_REGION_ENQUEUE,TOAST_REGION_EVICT,TOAST_REGION_REJECT,TOAST_REGION_SET_ACTIVE,toastRegionControllerFor}from"./toast-region-protocol.js";import{LYRA_DEFAULT_close,LYRA_DEFAULT_closeWithContext,LYRA_DEFAULT_closeWithTruncatedContext,LYRA_DEFAULT_toastContentIncomplete}from"../../../internal/default-strings.generated.js";const CLOSE_LABEL_GRAPHEME_LIMIT=40;function isAssertiveVariant(variant){return variant==="danger"||variant==="warning"}function truncateGraphemes(value,limit,locale){if(typeof Intl.Segmenter!="function")return{snippet:value,truncated:!1};let graphemes;try{graphemes=[...getSegmenter(locale,{granularity:"grapheme"}).segment(value)].map(({segment})=>segment)}catch(error){if(!(error instanceof RangeError))throw error;graphemes=[...getSegmenter(void 0,{granularity:"grapheme"}).segment(value)].map(({segment})=>segment)}return graphemes.length>limit?{snippet:graphemes.slice(0,limit).join(""),truncated:!0}:{snippet:value,truncated:!1}}class LyraToastItem extends LyraElement{constructor(){super(...arguments),this.duration=5e3,this.size="m",this.variant="neutral",this.withIcon=!1,this.elapsedMs=0,this.startedAt=0,this.timerStarted=!1,this.showGeneration=0,this.showCompletionGeneration=0,this.showCompletionRunning=!1,this.showAccepted=!1,this.afterShowEmitted=!1,this.admitted=!1,this.requestingRegionAdmission=!1,this.hovering=!1,this.focused=!1,this.messageUpgrades=new CustomElementUpgradeObserver(()=>{this.isConnected&&(this.bindMessageObserverTargets(),this.recomputeMessageText())}),this.lastAnnouncedMessage="",this.onMessageSlotChange=event=>{const target=event.target;target?.nodeType!==1||target.localName!=="slot"||(this.bindMessageObserverTargets(),this.recomputeMessageText())},this.hideCompletionRunning=!1,this.hideGeneration=0,this.afterHideEmitted=!1,this.messageText="",this.messageTextTruncated=!1,this.hiding=!1,this.progressRun=0,this.surfaceMounted=!1,this.interactionReady=!1,this.resumeTimer=()=>{if(this.timer!==void 0&&(this.timerOwner?.clearTimeout(this.timer),this.timer=void 0,this.timerOwner=void 0),!this.isConnected||!this.admitted||this.hiding||!this.hasAttribute("data-visible")||this.hovering||this.focused)return;const duration=this.safeDuration;if(!isFinite(duration)||duration<=0)return;const remaining=duration-this.elapsedMs;if(remaining<=0){this.requestHide("timer");return}const view=this.ownerDocument.defaultView;if(!view)return;this.startedAt=view.performance.now(),this.timerOwner=view;const timer=view.setTimeout(()=>{this.timer!==timer||this.timerOwner!==view||(this.timer=void 0,this.timerOwner=void 0,this.requestHide("timer"))},remaining);this.timer=timer},this.pauseTimer=()=>{if(this.timer!==void 0){const owner=this.timerOwner;owner?.clearTimeout(this.timer),this.timer=void 0,this.timerOwner=void 0,owner&&(this.elapsedMs+=owner.performance.now()-this.startedAt)}},this.onPointerEnter=()=>{this.hovering=!0,this.pauseTimer()},this.onPointerLeave=()=>{this.hovering=!1,!this.focused&&!this.hiding&&this.resumeTimer()},this.onFocusIn=event=>{const previous=event.relatedTarget;previous?.nodeType===1&&!composedContains(this,previous)&&previous.isConnected&&(this.focusReturnTarget=previous);const activeElement=deepActiveElement(this.ownerDocument);this.pendingFocusRepair=activeElement&&typeof activeElement.focus=="function"?captureComposedFocusRepair(this,activeElement)??void 0:void 0,this.focused=!0,this.pauseTimer()},this.onFocusOut=event=>{if(event.relatedTarget===null&&this.hasAttribute("data-visible")){const parent=this.parentElement,clearIfStillOwned=()=>{this.isConnected&&this.parentElement===parent&&(this.pendingFocusRepair=void 0)},view=this.ownerDocument.defaultView;view?view.queueMicrotask(clearIfStillOwned):queueMicrotask(clearIfStillOwned)}else event.relatedTarget?.nodeType===1&&!composedContains(this,event.relatedTarget)&&(this.pendingFocusRepair=void 0);this.focused=!1,!this.hovering&&!this.hiding&&this.resumeTimer()}}static{this.defaultStrings={...super.defaultStrings,close:LYRA_DEFAULT_close,closeWithContext:LYRA_DEFAULT_closeWithContext,closeWithTruncatedContext:LYRA_DEFAULT_closeWithTruncatedContext,toastContentIncomplete:LYRA_DEFAULT_toastContentIncomplete}}static{this.styles=[LyraElement.styles,variants,styles]}get toastItemElement(){return this.renderRoot.querySelector('[part="toast-item"]')}get effectiveSize(){const value=this.size;return["2xs","xs","s","m","l","xl","small","medium","large"].includes(value)?normalizeSize(value):"m"}get safeDuration(){return this.duration===1/0?1/0:finiteDuration(this.duration,5e3,0)}willUpdate(changed){super.willUpdate(changed),this.setAttribute("data-effective-size",this.effectiveSize),changed.has("duration")&&this.timerStarted&&this.admitted&&this.hasAttribute("data-visible")&&!this.hovering&&!this.focused&&(this.pauseTimer(),this.resumeTimer())}updated(changed){if(super.updated(changed),this.hasAttribute("data-visible")){const previousVariant=changed.get("variant");changed.has("variant")&&isAssertiveVariant(this.variant)!==isAssertiveVariant(previousVariant??"neutral")?this.announceMessage(!0):(changed.has("messageText")||changed.has("messageTextTruncated"))&&this.announceMessage()}this.shadowRoot?.querySelector('[part~="close-icon"] svg')?.setAttribute("part","close-icon__svg")}firstUpdated(changed){super.firstUpdated(changed),this.requestRegionAdmission(),this.admitted&&this.scheduleShow()}connectedCallback(){super.connectedCallback(),this.politeSink??=acquireAnnouncementSink("polite",{document:this.ownerDocument,source:this}),this.assertiveSink??=acquireAnnouncementSink("assertive",{document:this.ownerDocument,source:this});const MutationObserverCtor=this.ownerDocument.defaultView?.MutationObserver;if(this.messageObserver=MutationObserverCtor?new MutationObserverCtor(()=>{this.bindMessageObserverTargets(),this.recomputeMessageText()}):void 0,this.addEventListener("slotchange",this.onMessageSlotChange),this.bindMessageObserverTargets(),this.hasUpdated?this.recomputeMessageText():this.seedFirstRenderState(()=>this.recomputeMessageText()),this.requestRegionAdmission(),!!this.hasUpdated){if(this.hiding){this.completeHide();return}!this.hasAttribute("data-visible")&&this.admitted?this.scheduleShow():this.admitted&&this.timerStarted&&!this.hovering&&!this.focused&&(this.completeShow(),this.resumeTimer())}}requestRegionAdmission(){const controller=toastRegionControllerFor(this);if(controller){this.requestingRegionAdmission=!0;try{controller[TOAST_REGION_ENQUEUE](this)}finally{this.requestingRegionAdmission=!1}return}const parent=this.parentElement;if(parent?.localName===tag("toast")){this.regionOwner=void 0,this.admitted=!1,this.setAttribute("data-toast-queued",""),this.cancelPendingShow(),this.pauseTimer(),this.setSurfaceAvailability(!1);const releaseUnavailableOwner=()=>{this.parentElement===parent&&!toastRegionControllerFor(this)&&this.remove()},view=this.ownerDocument.defaultView;view?view.queueMicrotask(releaseUnavailableOwner):queueMicrotask(releaseUnavailableOwner);return}this.regionOwner=void 0,this.admitted=!0,this.removeAttribute("data-toast-queued"),this.hasAttribute("data-visible")&&(this.setSurfaceAvailability(!0),this.pendingFocusRepair&&(applyComposedFocusRepair(this.pendingFocusRepair),this.pendingFocusRepair=void 0))}[TOAST_REGION_SET_ACTIVE](owner,active){if(this.parentElement===owner){if(this.regionOwner=owner,this.admitted=active,this.toggleAttribute("data-toast-queued",!active),!active){const focusTarget=this.adjacentToastOrReturnTarget(),activeElement=deepActiveElement(this.ownerDocument),repair=this.pendingFocusRepair??(activeElement&&typeof activeElement.focus=="function"?captureComposedFocusRepair(this,focusTarget):null);this.cancelPendingShow(),this.pauseTimer(),this.setSurfaceAvailability(!1),repair&&applyComposedFocusRepair(repair,focusTarget),this.pendingFocusRepair=void 0;return}if(this.hasAttribute("data-visible")&&!this.hiding){this.setSurfaceAvailability(!0),this.pendingFocusRepair&&(applyComposedFocusRepair(this.pendingFocusRepair),this.pendingFocusRepair=void 0),!this.requestingRegionAdmission&&this.timerStarted&&!this.hovering&&!this.focused&&this.resumeTimer(),this.completeShow();return}this.isConnected&&this.hasUpdated&&!this.hiding&&!this.hasAttribute("data-visible")&&this.scheduleShow()}}[TOAST_REGION_EVICT](owner,_reason){this.regionOwner===owner&&(this.regionOwner=void 0,this.admitted=!1,this.cancelPendingShow(),this.showAccepted=!1,this.pauseTimer(),this.setSurfaceAvailability(!1),this.parentElement===owner&&this.remove())}setSurfaceAvailability(available){this.surfaceMounted=available,this.interactionReady=available;const surface=this.shadowRoot?.querySelector('[part="toast-item"]');surface&&(surface.hidden=!available,surface.inert=!available)}cancelPendingShow(){this.showGeneration+=1,this.showAccepted&&!this.afterShowEmitted&&(this.showCompletionGeneration+=1),this.showRafId!==void 0&&(this.showRafOwner?.cancelAnimationFrame(this.showRafId),this.showRafId=void 0,this.showRafOwner=void 0),this.cancelShowAnimation?.(),this.cancelShowAnimation=void 0}scheduleShow(){if(this.showRafId!==void 0||this.hiding||!this.admitted)return;const view=this.ownerDocument.defaultView;if(!view)return;const generation=++this.showGeneration;this.showRafOwner=view,this.showRafId=view.requestAnimationFrame(()=>{this.showRafId=void 0,this.showRafOwner=void 0,!(this.hiding||!this.admitted||generation!==this.showGeneration)&&this.prepareShow(generation)})}async prepareShow(generation){if(await this.updateComplete,generation!==this.showGeneration||!this.isConnected||!this.admitted||this.hiding)return;if(this.emit("lr-show",null,{cancelable:!0}).defaultPrevented){if(generation!==this.showGeneration)return;const owner=this.regionOwner;owner?owner[TOAST_REGION_REJECT](this):this.remove();return}if(generation!==this.showGeneration||!this.isConnected||!this.admitted||this.hiding)return;this.surfaceMounted=!0;const surface=this.shadowRoot?.querySelector('[part="toast-item"]');surface&&(surface.hidden=!1,surface.offsetWidth),this.setAttribute("data-visible",""),this.interactionReady=!0,surface&&(surface.inert=!1),this.announceMessage(!0),this.showAccepted=!0,this.afterShowEmitted=!1,this.showCompletionGeneration+=1,this.completeShow(),this.startTimer()}async completeShow(){if(this.showCompletionRunning||!this.showAccepted||this.afterShowEmitted||this.hiding||!this.admitted||!this.hasAttribute("data-visible"))return;this.showCompletionRunning=!0;const generation=this.showCompletionGeneration;if(await this.waitForVisualCompletion("show"),this.showCompletionRunning=!1,generation!==this.showCompletionGeneration||!this.isConnected||!this.admitted||this.hiding||!this.hasAttribute("data-visible")){this.isConnected&&this.admitted&&!this.hiding&&this.completeShow();return}this.afterShowEmitted||!this.showAccepted||(this.afterShowEmitted=!0,this.showAccepted=!1,this.emit("lr-after-show"))}disconnectedCallback(){const activeElement=deepActiveElement(this.ownerDocument);!this.pendingFocusRepair&&!this.hiding&&this.hasAttribute("data-visible")&&activeElement&&typeof activeElement.focus=="function"&&(this.pendingFocusRepair=captureComposedFocusRepair(this,activeElement)??void 0),super.disconnectedCallback(),this.removeEventListener("slotchange",this.onMessageSlotChange),this.messageObserver?.disconnect(),this.messageObserver=void 0,this.messageUpgrades.disconnect(),this.politeSink?.release(),this.politeSink=void 0,this.assertiveSink?.release(),this.assertiveSink=void 0,this.hiding&&!this.afterHideEmitted&&this.hideGeneration++,this.cancelPendingShow(),this.cancelHideAnimation?.(),this.cancelHideAnimation=void 0,this.pauseTimer(),this.hovering=!1,this.focused=!1,!this.hasAttribute("data-visible")&&!this.hiding&&(this.surfaceMounted=!1,this.interactionReady=!1)}startTimer(){this.timerStarted=!0,this.elapsedMs=0,this.resumeTimer()}clearTimer(){this.timer!==void 0&&this.timerOwner?.clearTimeout(this.timer),this.timer=void 0,this.timerOwner=void 0}waitForVisualCompletion(kind){(kind==="show"?this.cancelShowAnimation:this.cancelHideAnimation)?.();const surface=this.shadowRoot?.querySelector('[part="toast-item"]'),view=this.ownerDocument.defaultView;if(!surface||!view||prefersReducedMotion(this))return Promise.resolve();const computed=view.getComputedStyle(surface),transitionMs=maxCssTime(computed.transitionDuration)+maxCssTime(computed.transitionDelay),animationMs=maxCssTime(computed.animationDuration)+maxCssTime(computed.animationDelay),fallbackMs=Math.max(transitionMs,animationMs);return fallbackMs<=0?Promise.resolve():new Promise(resolve=>{let settled=!1,timeout;const cancelKey=kind==="show"?"cancelShowAnimation":"cancelHideAnimation",finish=()=>{settled||(settled=!0,timeout!==void 0&&view.clearTimeout(timeout),surface.removeEventListener("transitionend",onEnd),surface.removeEventListener("animationend",onEnd),this[cancelKey]===cancel&&(this[cancelKey]=void 0),resolve())},onEnd=event=>{event.target===surface&&finish()},cancel=()=>finish();surface.addEventListener("transitionend",onEnd),surface.addEventListener("animationend",onEnd),timeout=view.setTimeout(finish,fallbackMs+50),this[cancelKey]=cancel})}observeMessageNode(node){if(this.messageObserver){if(node.nodeType===3){this.messageObserver.observe(node,{characterData:!0});return}node.nodeType!==1&&node.nodeType!==11||this.messageObserver.observe(node,{attributes:!0,attributeFilter:["alt","aria-hidden","aria-label","aria-labelledby","class","contenteditable","hidden","href","inert","id","role","slot","style","tabindex"],childList:!0,characterData:!0,subtree:!0})}}bindMessageObserverTargets(){if(!this.messageObserver)return;this.messageObserver.disconnect(),this.observeMessageNode(this);let ancestor=composedParentElement(this);for(;ancestor;)this.messageObserver.observe(ancestor,{attributes:!0,attributeFilter:["aria-hidden","class","hidden","inert","style"]}),ancestor=composedParentElement(ancestor);for(const slot of this.querySelectorAll("slot"))for(const assigned of slot.assignedNodes({flatten:!0}))this.observeMessageNode(assigned)}observeLabelReferenceRoot(root){this.messageObserver?.observe(root,{attributes:!0,attributeFilter:["id"],childList:!0,subtree:!0})}recomputeMessageText(){const slot=this.renderRoot?.querySelector("slot:not([name])"),lightDomNodes=this.childNodes,messageNodes=slot?slot.assignedNodes({flatten:!0}):Array.from(lightDomNodes??[]).filter(node=>node.nodeType!==1||!node.getAttribute("slot")),result=composedAccessibilityTextResult(messageNodes,{requireRendered:!1,shouldPrune:element=>{const slotName=element.getAttribute("slot");return slotName!==null&&slotName!==""||isActionableElement(element)?!0:(this.messageUpgrades.observeElement(element),element.hasAttribute("tabindex")&&element.getAttribute("tabindex")!=="-1")},skipRootAncestorValidation:!0});this.messageText=result.text.trim().replace(/\s+/g," "),this.messageTextTruncated=result.truncated;for(const root of result.labelReferenceRoots)this.observeLabelReferenceRoot(root);for(const reference of result.referencedElements)this.observeMessageNode(reference);for(const root of result.traversedShadowRoots)this.observeMessageNode(root)}announceMessage(force=!1){const message=this.messageText,announcement=this.messageTextTruncated?message?`${message}…`:this.localize("toastContentIncomplete"):message;!force&&announcement===this.lastAnnouncedMessage||(this.lastAnnouncedMessage=announcement,(isAssertiveVariant(this.variant)?this.assertiveSink:this.politeSink)?.announce(announcement))}get closeLabel(){const text=this.messageText;if(!text&&this.messageTextTruncated)return this.localize("closeWithContext",void 0,{snippet:this.localize("toastContentIncomplete")});if(!text)return this.localize("close");const{snippet,truncated}=truncateGraphemes(text,CLOSE_LABEL_GRAPHEME_LIMIT,this.effectiveLocale);return this.messageTextTruncated||truncated?this.localize("closeWithTruncatedContext",void 0,{snippet}):this.localize("closeWithContext",void 0,{snippet})}async hide(){await this.requestHide("manual")}requestHide(source){if(this.hideRequest)return this.hideRequest;if(this.hiding)return Promise.resolve();let resolve,reject;const completion=new Promise((resolveCompletion,rejectCompletion)=>{resolve=resolveCompletion,reject=rejectCompletion});return this.hideRequest=completion,this.emit("lr-hide",null,{cancelable:!0}).defaultPrevented?(source==="timer"&&(this.elapsedMs=0,this.startedAt=0,this.progressRun+=1,this.isConnected&&!this.hovering&&!this.focused&&this.resumeTimer()),this.hideRequest===completion&&(this.hideRequest=void 0),resolve(),completion):(this.hiding=!0,this.showAccepted=!1,this.showCompletionGeneration+=1,this.shadowRoot?.querySelector('[part="close-button"]')?.setAttribute("aria-disabled","true"),this.cancelShowAnimation?.(),this.cancelShowAnimation=void 0,this.clearTimer(),this.removeAttribute("data-visible"),this.setAttribute("data-hiding",""),this.completeHide().then(()=>{this.hideRequest===completion&&(this.hideRequest=void 0),resolve()},reason=>{this.hideRequest===completion&&(this.hideRequest=void 0),reject(reason)}),completion)}async completeHide(){if(this.hideCompletionRunning||this.afterHideEmitted)return;this.hideCompletionRunning=!0;const generation=this.hideGeneration;if(await this.waitForVisualCompletion("hide"),this.hideCompletionRunning=!1,generation!==this.hideGeneration||!this.isConnected){this.isConnected&&await this.completeHide();return}this.afterHideEmitted||(this.repairFocusBeforeRemoval(),this.afterHideEmitted=!0,this.emit("lr-after-hide"),this.remove())}repairFocusBeforeRemoval(){const active=deepActiveElement(this.ownerDocument);composedContains(this,active)&&this.focusAdjacentToastOrReturn()}adjacentToastOrReturnTarget(){const findAdjacent=direction=>{let element=this[direction];for(;element;){if(element.localName===tag("toast-item")){const item=element,surface=item.shadowRoot?.querySelector('[part="toast-item"]');if(!item.hasAttribute("data-hiding")&&!item.hasAttribute("data-toast-queued")&&item.hasAttribute("data-visible")&&item.isConnected&&surface&&!surface.hidden&&!surface.inert)return item.shadowRoot?.querySelector('[part="close-button"]')??null}element=element[direction]}return null};return findAdjacent("nextElementSibling")??findAdjacent("previousElementSibling")??(this.focusReturnTarget?.isConnected&&!composedContains(this,this.focusReturnTarget)?this.focusReturnTarget:null)}focusAdjacentToastOrReturn(){this.adjacentToastOrReturnTarget()?.focus()}renderCloseControl(){const close=html`<span part="close-icon">${closeIcon()}</span>`,duration=this.safeDuration;return!Number.isFinite(duration)||duration<=0?close:html`
|
|
2
2
|
<span part="progress-ring" aria-hidden="true">
|
|
3
3
|
${keyed(this.progressRun,html`
|
|
4
4
|
<svg
|
|
@@ -5,11 +5,7 @@ export type LyraGraphNodeLabelsMode='always'|'zoom'|'none';
|
|
|
5
5
|
* `'container'` measures the host's own content box instead. */
|
|
6
6
|
export type LyraGraphFit='none'|'container';
|
|
7
7
|
/** Shared score-tier thresholds for retrieval relevance and grounding confidence. */
|
|
8
|
-
export interface LyraScoreThresholds{readonly high:number;readonly medium:number;}export interface LyraGraphEventMap{'lr-node-activate':CustomEvent<{nodeId:string;x:number;y:number;}>;'lr-edge-activate':CustomEvent<{sourceNodeId:string;targetNodeId:string;edgeId?:string;}>;
|
|
9
|
-
/** @deprecated Use lr-node-activate. */
|
|
10
|
-
'lr-node-click':CustomEvent<{nodeId:string;x:number;y:number;}>;
|
|
11
|
-
/** @deprecated Use lr-edge-activate and its edgeId detail field. */
|
|
12
|
-
'lr-link-click':CustomEvent<{sourceNodeId:string;targetNodeId:string;linkId?:string;}>;'lr-node-enter':CustomEvent<{nodeId:string;}>;'lr-node-leave':CustomEvent<{nodeId:string;}>;
|
|
8
|
+
export interface LyraScoreThresholds{readonly high:number;readonly medium:number;}export interface LyraGraphEventMap{'lr-node-activate':CustomEvent<{nodeId:string;x:number;y:number;}>;'lr-edge-activate':CustomEvent<{sourceNodeId:string;targetNodeId:string;edgeId?:string;}>;'lr-node-enter':CustomEvent<{nodeId:string;}>;'lr-node-leave':CustomEvent<{nodeId:string;}>;
|
|
13
9
|
/** An edge was hovered. */
|
|
14
10
|
'lr-edge-enter':CustomEvent<{sourceNodeId:string;targetNodeId:string;edgeId?:string;}>;
|
|
15
11
|
/** The hover from `lr-edge-enter` ended. */
|
|
@@ -64,11 +60,10 @@ export interface LyraScoreThresholds{readonly high:number;readonly medium:number
|
|
|
64
60
|
* effective identities are first-wins before layout, keyed DOM, selection, focus, or events.
|
|
65
61
|
* Retained identity spelling is not rewritten.
|
|
66
62
|
*
|
|
67
|
-
* @event lr-node-activate - Pointer or keyboard node activation with `{ nodeId, x, y }` detail
|
|
68
|
-
*
|
|
69
|
-
* @event lr-
|
|
70
|
-
*
|
|
71
|
-
* @event lr-link-click - Deprecated: use `lr-edge-activate` and `edgeId`. Compatibility detail remains unchanged. `detail: { sourceNodeId, targetNodeId, linkId? }`.
|
|
63
|
+
* @event lr-node-activate - Pointer or keyboard node activation with `{ nodeId, x, y }` detail;
|
|
64
|
+
* `x` and `y` are the node's current coordinates in the graph's local drawing space.
|
|
65
|
+
* @event lr-edge-activate - Pointer or keyboard edge activation with
|
|
66
|
+
* `{ sourceNodeId, targetNodeId, edgeId? }` detail.
|
|
72
67
|
* @event lr-node-enter - A node was hovered. `detail: { nodeId }`. Suppressed while dragging or
|
|
73
68
|
* panning. Canvas enter/leave events fire once per hit-identity transition or exit. In SVG,
|
|
74
69
|
* also toggles a `data-hovered` attribute on that node's `[part="node"]` element for
|