@aceshooting/lyra-ui 19.0.1 → 20.0.1
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 +159 -0
- package/custom-elements.json +1 -1
- package/dist/cli/migration-contract.json +1 -1
- package/dist/components/agent-tools/activity-feed/activity-feed.class.d.ts +14 -4
- package/dist/components/agent-tools/activity-feed/activity-feed.styles.js +1 -1
- package/dist/components/agent-tools/approval-queue/approval-queue.class.d.ts +1 -0
- package/dist/components/agent-tools/approval-queue/approval-queue.class.js +4 -3
- package/dist/components/agent-tools/approval-queue/approval-queue.styles.js +1 -1
- package/dist/components/agent-tools/artifact-panel/artifact-panel.class.d.ts +3 -1
- package/dist/components/agent-tools/context-inspector/context-inspector.class.d.ts +1 -0
- package/dist/components/agent-tools/context-inspector/context-inspector.class.js +4 -3
- package/dist/components/agent-tools/context-inspector/context-inspector.styles.js +1 -1
- package/dist/components/agent-tools/eval-dataset/eval-dataset.class.js +1 -1
- package/dist/components/agent-tools/eval-result/eval-result.class.js +1 -1
- package/dist/components/agent-tools/evaluation-run/evaluation-run.class.d.ts +1 -0
- package/dist/components/agent-tools/evaluation-run/evaluation-run.class.js +4 -3
- package/dist/components/agent-tools/evaluation-run/evaluation-run.styles.js +1 -1
- package/dist/components/agent-tools/policy-summary/policy-summary.class.d.ts +1 -0
- package/dist/components/agent-tools/policy-summary/policy-summary.class.js +4 -3
- package/dist/components/agent-tools/policy-summary/policy-summary.styles.js +1 -1
- package/dist/components/agent-tools/prompt-studio/prompt-studio.class.js +1 -1
- package/dist/components/agent-tools/schema-viewer/schema-viewer.class.d.ts +10 -1
- package/dist/components/agent-tools/schema-viewer/schema-viewer.class.js +3 -3
- package/dist/components/agent-tools/subagent-panel/subagent-panel.class.js +1 -1
- package/dist/components/agent-tools/thinking-panel/thinking-panel.class.d.ts +6 -3
- package/dist/components/agent-tools/thinking-panel/thinking-panel.styles.js +1 -1
- package/dist/components/agent-tools/tool-call-chip/tool-call-chip.class.d.ts +14 -3
- package/dist/components/agent-tools/tool-call-chip/tool-call-chip.class.js +2 -2
- package/dist/components/agent-tools/tool-param-form/tool-param-form.class.d.ts +12 -2
- package/dist/components/agent-tools/tool-param-form/tool-param-form.class.js +3 -1
- package/dist/components/charts/chart/box-plot.class.d.ts +15 -3
- package/dist/components/charts/chart/box-plot.class.js +3 -3
- package/dist/components/charts/chart/box-plot.styles.js +1 -1
- package/dist/components/charts/chart/chart.class.d.ts +23 -5
- package/dist/components/charts/chart/chart.class.js +2 -2
- package/dist/components/charts/chart/chart.styles.js +1 -1
- package/dist/components/charts/chart/lite-chart.class.js +1 -1
- package/dist/components/charts/chart/lite-chart.styles.js +1 -1
- package/dist/components/conversation/audio-visualizer/audio-visualizer.class.d.ts +4 -2
- package/dist/components/conversation/audio-visualizer/audio-visualizer.class.js +1 -1
- package/dist/components/conversation/branch-picker/branch-picker.class.d.ts +4 -2
- package/dist/components/conversation/branch-picker/branch-picker.class.js +1 -1
- package/dist/components/conversation/chat-viewport/chat-viewport.class.d.ts +4 -3
- package/dist/components/conversation/chat-viewport/chat-viewport.class.js +1 -1
- package/dist/components/conversation/code-block/code-block-core.class.d.ts +6 -11
- package/dist/components/conversation/code-block/code-block-core.class.js +1 -1
- package/dist/components/conversation/code-block/code-block-shared.d.ts +29 -1
- package/dist/components/conversation/code-block/code-block-shared.js +1 -1
- package/dist/components/conversation/code-block/code-block.class.d.ts +6 -11
- package/dist/components/conversation/code-block/code-block.class.js +1 -1
- package/dist/components/conversation/markdown/markdown-shared.js +2 -2
- package/dist/components/conversation/message-actions/message-actions.class.d.ts +4 -2
- package/dist/components/conversation/message-actions/message-actions.class.js +2 -2
- package/dist/components/conversation/message-parts/message-parts.class.d.ts +17 -2
- package/dist/components/conversation/model-select/model-select.class.js +1 -0
- package/dist/components/conversation/model-select/model-select.styles.js +1 -1
- package/dist/components/conversation/prompt-input/prompt-input.class.d.ts +5 -1
- package/dist/components/conversation/prompt-input/prompt-input.class.js +2 -2
- package/dist/components/conversation/prompt-queue/prompt-queue.class.d.ts +6 -1
- package/dist/components/conversation/prompt-queue/prompt-queue.class.js +2 -2
- package/dist/components/conversation/realtime-session/realtime-session.class.d.ts +5 -1
- package/dist/components/conversation/realtime-session/realtime-session.class.js +1 -1
- package/dist/components/conversation/selection-toolbar/selection-toolbar.class.d.ts +5 -1
- package/dist/components/conversation/selection-toolbar/selection-toolbar.class.js +1 -1
- package/dist/components/conversation/voice-picker/voice-picker.class.d.ts +13 -2
- package/dist/components/conversation/voice-picker/voice-picker.class.js +5 -3
- package/dist/components/conversation/voice-picker/voice-picker.styles.js +1 -1
- package/dist/components/data/calendar/calendar.class.d.ts +9 -0
- package/dist/components/data/calendar/calendar.class.js +2 -2
- package/dist/components/data/calendar/calendar.styles.js +1 -1
- package/dist/components/data/condition-builder/condition-builder.class.d.ts +5 -1
- package/dist/components/data/context-meter/context-meter.class.d.ts +4 -0
- package/dist/components/data/context-meter/context-meter.styles.js +1 -1
- package/dist/components/data/data-grid/data-grid.class.d.ts +8 -2
- package/dist/components/data/data-grid/data-grid.class.js +1 -2
- package/dist/components/data/flow-node/flow-node.class.d.ts +7 -4
- package/dist/components/data/flow-node/flow-node.styles.js +1 -1
- package/dist/components/data/funnel/funnel.class.d.ts +5 -0
- package/dist/components/data/funnel/funnel.class.js +4 -3
- package/dist/components/data/funnel/funnel.styles.js +1 -1
- package/dist/components/data/gauge/gauge.class.d.ts +12 -1
- package/dist/components/data/gauge/gauge.styles.js +1 -1
- package/dist/components/data/graph-query-builder/graph-query-builder.class.d.ts +50 -13
- package/dist/components/data/graph-query-builder/graph-query-builder.class.js +2 -2
- package/dist/components/data/graph-query-builder/graph-query-builder.styles.js +1 -1
- package/dist/components/data/heatmap/heatmap.class.d.ts +27 -9
- package/dist/components/data/heatmap/heatmap.class.js +5 -3
- package/dist/components/data/sequence-strip/sequence-strip.class.d.ts +2 -0
- package/dist/components/data/sequence-strip/sequence-strip.styles.js +1 -1
- package/dist/components/data/table/table.class.d.ts +8 -0
- package/dist/components/data/table/table.class.js +2 -1
- package/dist/components/data/tree/tree.class.d.ts +20 -1
- package/dist/components/data/tree/tree.class.js +1 -1
- package/dist/components/data/word-cloud/word-cloud.class.d.ts +4 -1
- package/dist/components/data/word-cloud/word-cloud.class.js +2 -2
- package/dist/components/forms/button/button.class.js +1 -1
- package/dist/components/forms/checkbox/checkbox.class.d.ts +11 -8
- package/dist/components/forms/checkbox/checkbox.class.js +1 -1
- package/dist/components/forms/checkbox/checkbox.styles.js +1 -1
- package/dist/components/forms/checkbox-group/checkbox-group.class.d.ts +2 -2
- package/dist/components/forms/checkbox-group/checkbox-group.class.js +1 -1
- package/dist/components/forms/code-editor/code-editor.class.d.ts +2 -0
- package/dist/components/forms/code-editor/code-editor.class.js +1 -1
- package/dist/components/forms/code-editor/code-editor.styles.js +1 -1
- package/dist/components/forms/color-picker/color-picker.class.d.ts +11 -1
- package/dist/components/forms/color-picker/color-picker.class.js +4 -3
- package/dist/components/forms/combobox/combobox.class.d.ts +67 -18
- package/dist/components/forms/combobox/combobox.class.js +7 -6
- package/dist/components/forms/combobox/combobox.styles.js +1 -1
- package/dist/components/forms/date-picker/date-input.class.d.ts +22 -2
- package/dist/components/forms/date-picker/date-input.class.js +4 -2
- package/dist/components/forms/date-picker/date-input.styles.js +1 -1
- package/dist/components/forms/emoji-picker/emoji-data-loader.d.ts +18 -4
- package/dist/components/forms/emoji-picker/emoji-data-loader.js +1 -1
- package/dist/components/forms/emoji-picker/emoji-picker.class.d.ts +18 -4
- package/dist/components/forms/emoji-picker/emoji-picker.class.js +1 -1
- package/dist/components/forms/emoji-picker/emoji-picker.styles.js +1 -1
- package/dist/components/forms/icon-button/icon-button.class.d.ts +1 -1
- package/dist/components/forms/input/time-input.class.d.ts +11 -1
- package/dist/components/forms/input/time-input.class.js +4 -3
- package/dist/components/forms/input/time-input.styles.js +1 -1
- package/dist/components/forms/locale-picker/locale-picker.class.d.ts +17 -3
- package/dist/components/forms/locale-picker/locale-picker.class.js +3 -2
- package/dist/components/forms/locale-picker/locale-picker.styles.js +1 -1
- package/dist/components/forms/otp-input/otp-input.class.d.ts +13 -5
- package/dist/components/forms/otp-input/otp-input.class.js +2 -2
- package/dist/components/forms/otp-input/otp-input.styles.js +1 -1
- package/dist/components/forms/phone-input/phone-input.class.d.ts +10 -3
- package/dist/components/forms/phone-input/phone-input.class.js +6 -2
- package/dist/components/forms/phone-input/phone-input.styles.js +1 -1
- package/dist/components/forms/radio/radio-group.class.d.ts +1 -1
- package/dist/components/forms/radio/radio-group.class.js +2 -2
- package/dist/components/forms/rubric-form/rubric-form.class.d.ts +9 -1
- package/dist/components/forms/rubric-form/rubric-form.class.js +5 -3
- package/dist/components/forms/select/select.class.d.ts +4 -0
- package/dist/components/forms/select/select.styles.js +1 -1
- package/dist/components/forms/slider/slider.class.d.ts +5 -1
- package/dist/components/forms/slider/slider.class.js +3 -3
- package/dist/components/forms/switch/switch.class.d.ts +6 -5
- package/dist/components/forms/switch/switch.class.js +1 -1
- package/dist/components/forms/time-range/time-range.class.d.ts +2 -2
- package/dist/components/forms/token-input/token-input.class.d.ts +13 -3
- package/dist/components/forms/token-input/token-input.class.js +3 -1
- package/dist/components/layout/carousel/carousel.class.d.ts +4 -1
- package/dist/components/layout/carousel/carousel.class.js +1 -1
- package/dist/components/layout/command-palette/command-palette.class.d.ts +8 -2
- package/dist/components/layout/command-palette/command-palette.class.js +1 -1
- package/dist/components/layout/command-palette/command-palette.styles.js +1 -1
- package/dist/components/layout/details/accordion.class.js +1 -1
- package/dist/components/layout/dock-panel/dock-panel.class.d.ts +10 -7
- package/dist/components/layout/dock-panel/dock-panel.class.js +2 -2
- package/dist/components/layout/dock-panel/dock-panel.styles.js +1 -1
- package/dist/components/layout/menu/menu.class.d.ts +13 -3
- package/dist/components/layout/menu/menu.class.js +4 -3
- package/dist/components/layout/menu/menu.styles.js +1 -1
- package/dist/components/layout/page/page.class.d.ts +7 -1
- package/dist/components/layout/reorder-list/reorder-list.class.d.ts +1 -1
- package/dist/components/layout/reorder-list/reorder-list.class.js +1 -1
- package/dist/components/layout/segmented/segmented.class.d.ts +2 -0
- package/dist/components/layout/segmented/segmented.styles.js +1 -1
- package/dist/components/layout/virtual-list/virtual-list.styles.js +1 -1
- package/dist/components/layout/widget/widget.class.d.ts +15 -2
- package/dist/components/layout/widget/widget.class.js +1 -1
- package/dist/components/layout/widget/widget.styles.js +1 -1
- package/dist/components/media/avatar/avatar.class.d.ts +4 -0
- package/dist/components/media/avatar/avatar.styles.js +1 -1
- package/dist/components/media/avatar-group/avatar-group.class.d.ts +8 -1
- package/dist/components/media/avatar-group/avatar-group.styles.js +1 -1
- package/dist/components/media/drop-zone/drop-zone.class.d.ts +10 -4
- package/dist/components/media/drop-zone/drop-zone.class.js +2 -2
- package/dist/components/media/drop-zone/drop-zone.styles.js +1 -1
- package/dist/components/media/flag/flag.class.js +1 -1
- package/dist/components/media/map/map.class.d.ts +19 -5
- package/dist/components/media/map/map.class.js +3 -3
- package/dist/components/media/video-playlist/video-playlist.class.d.ts +6 -3
- package/dist/components/media/video-playlist/video-playlist.class.js +1 -1
- package/dist/components/overlays/callout/callout.class.d.ts +4 -1
- package/dist/components/overlays/dialog/dialog.class.d.ts +4 -1
- package/dist/components/overlays/overlay/overlay.styles.js +1 -1
- package/dist/components/overlays/overlay/popover.class.d.ts +9 -1
- package/dist/components/overlays/overlay/popover.class.js +3 -2
- package/dist/components/overlays/overlay/tooltip.class.d.ts +14 -4
- package/dist/components/overlays/overlay/tooltip.class.js +3 -2
- package/dist/components/overlays/popup/popup.class.d.ts +15 -1
- package/dist/components/overlays/popup/popup.class.js +3 -3
- package/dist/components/overlays/popup/popup.styles.js +1 -1
- package/dist/components/overlays/progress/progress-bar.class.d.ts +2 -0
- package/dist/components/overlays/progress/progress.styles.js +1 -1
- package/dist/components/retrieval/citation-badge/citation-badge.class.d.ts +4 -2
- package/dist/components/retrieval/citation-badge/citation-badge.class.js +1 -1
- package/dist/components/retrieval/claim-evidence/claim-evidence.class.d.ts +4 -0
- package/dist/components/retrieval/claim-evidence/claim-evidence.class.js +4 -3
- package/dist/components/retrieval/claim-evidence/claim-evidence.styles.js +1 -1
- package/dist/components/retrieval/community-card/community-card.class.d.ts +6 -1
- package/dist/components/retrieval/community-card/community-card.styles.js +1 -1
- package/dist/components/retrieval/embedding-explorer/embedding-explorer.class.d.ts +9 -1
- package/dist/components/retrieval/embedding-explorer/embedding-explorer.class.js +4 -3
- package/dist/components/retrieval/entity-card/entity-card.styles.js +1 -1
- package/dist/components/retrieval/entity-chip/entity-chip.class.d.ts +4 -2
- package/dist/components/retrieval/entity-chip/entity-chip.class.js +1 -1
- package/dist/components/retrieval/entity-dossier/entity-dossier.class.js +2 -2
- package/dist/components/retrieval/graph-legend/graph-legend.class.d.ts +18 -4
- package/dist/components/retrieval/graph-legend/graph-legend.class.js +2 -2
- package/dist/components/retrieval/grounding-summary/grounding-summary.class.d.ts +7 -0
- package/dist/components/retrieval/grounding-summary/grounding-summary.class.js +4 -3
- package/dist/components/retrieval/grounding-summary/grounding-summary.styles.js +1 -1
- package/dist/components/retrieval/memory-panel/memory-panel.class.d.ts +6 -0
- package/dist/components/retrieval/memory-panel/memory-panel.class.js +4 -3
- package/dist/components/retrieval/memory-panel/memory-panel.styles.js +1 -1
- package/dist/components/retrieval/mind-map/mind-map-layout.d.ts +17 -1
- package/dist/components/retrieval/mind-map/mind-map-layout.js +1 -1
- package/dist/components/retrieval/mind-map/mind-map.class.d.ts +8 -1
- package/dist/components/retrieval/mind-map/mind-map.class.js +3 -2
- package/dist/components/retrieval/rag-eval-dashboard/rag-eval-dashboard.class.d.ts +5 -0
- package/dist/components/retrieval/rag-eval-dashboard/rag-eval-dashboard.class.js +6 -5
- package/dist/components/retrieval/rag-eval-dashboard/rag-eval-dashboard.styles.js +1 -1
- package/dist/components/retrieval/retrieval-compare/retrieval-compare.class.js +5 -5
- package/dist/components/retrieval/retrieval-compare/retrieval-compare.styles.js +1 -1
- package/dist/components/retrieval/source-list/source-list.class.d.ts +21 -2
- package/dist/components/retrieval/source-list/source-list.class.js +2 -2
- package/dist/components/retrieval/source-list/source-list.styles.js +1 -1
- package/dist/components/retrieval/source-picker/source-picker.class.d.ts +3 -1
- package/dist/components/retrieval/source-picker/source-picker.class.js +2 -2
- package/dist/components/utility/diff-view/diff-view.class.d.ts +105 -8
- package/dist/components/utility/diff-view/diff-view.class.js +21 -5
- package/dist/components/utility/diff-view/diff-view.styles.js +1 -1
- package/dist/components/utility/export-button/export-button.class.d.ts +26 -2
- package/dist/components/utility/export-button/export-button.class.js +4 -2
- package/dist/components/utility/export-button/export-button.styles.js +1 -1
- package/dist/components/utility/mention-popover/mention-popover.class.d.ts +19 -1
- package/dist/components/utility/mention-popover/mention-popover.class.js +3 -2
- package/dist/components/utility/mention-popover/mention-popover.styles.js +1 -1
- package/dist/components/utility/tour/tour.class.d.ts +1 -3
- package/dist/components/utility/tour/tour.class.js +1 -1
- package/dist/components/viewers/archive-viewer/archive-viewer.class.d.ts +20 -3
- package/dist/components/viewers/archive-viewer/archive-viewer.class.js +1 -1
- package/dist/components/viewers/ebook-viewer/ebook-viewer.class.js +1 -1
- package/dist/components/viewers/geojson-view/geojson-view.styles.js +1 -1
- package/dist/components/viewers/geojson-view/geojson-viewer.class.d.ts +5 -0
- package/dist/components/viewers/geojson-view/geojson-viewer.class.js +6 -3
- package/dist/components/viewers/pdf-viewer/pdf-viewer.class.d.ts +7 -1
- package/dist/components/viewers/pdf-viewer/pdf-viewer.class.js +1 -1
- package/dist/components/viewers/pptx-viewer/pptx-viewer.class.d.ts +7 -1
- package/dist/components/viewers/pptx-viewer/pptx-viewer.class.js +1 -1
- package/dist/components/viewers/xml-viewer/xml-viewer.class.d.ts +5 -0
- package/dist/components/viewers/xml-viewer/xml-viewer.class.js +1 -1
- package/dist/custom-elements-jsx.d.ts +1 -1
- package/dist/events.d.ts +79 -30
- package/dist/internal/accessibility-visibility.js +1 -1
- package/dist/internal/aria-reflection.js +1 -1
- package/dist/internal/catalog-picker.d.ts +14 -3
- package/dist/internal/catalog-picker.js +1 -1
- package/dist/internal/default-strings.generated.d.ts +1 -1
- package/dist/internal/default-strings.generated.js +2 -2
- package/dist/internal/localization-types.d.ts +1 -1
- package/dist/internal/localization.js +2 -2
- package/dist/internal/lyra-element.d.ts +17 -0
- 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/svelte.d.ts +1 -1
- package/dist/testing/lyra-tag-event-map.js +1 -1
- package/dist/translations/ar/agent-tools.js +1 -1
- package/dist/translations/ar/data.js +1 -1
- package/dist/translations/ar/retrieval.js +1 -1
- package/dist/translations/ar/shared.js +1 -1
- package/dist/translations/ar/viewers.js +1 -1
- package/dist/translations/de/agent-tools.js +1 -1
- package/dist/translations/de/data.js +1 -1
- package/dist/translations/de/retrieval.js +1 -1
- package/dist/translations/de/shared.js +1 -1
- package/dist/translations/de/viewers.js +1 -1
- package/dist/translations/es/agent-tools.js +1 -1
- package/dist/translations/es/data.js +1 -1
- package/dist/translations/es/retrieval.js +1 -1
- package/dist/translations/es/shared.js +1 -1
- package/dist/translations/es/viewers.js +1 -1
- package/dist/translations/fa/agent-tools.js +1 -1
- package/dist/translations/fa/data.js +1 -1
- package/dist/translations/fa/retrieval.js +1 -1
- package/dist/translations/fa/shared.js +1 -1
- package/dist/translations/fa/viewers.js +1 -1
- package/dist/translations/fr/agent-tools.js +1 -1
- package/dist/translations/fr/data.js +1 -1
- package/dist/translations/fr/retrieval.js +1 -1
- package/dist/translations/fr/shared.js +1 -1
- package/dist/translations/fr/viewers.js +1 -1
- package/dist/translations/he/agent-tools.js +1 -1
- package/dist/translations/he/data.js +1 -1
- package/dist/translations/he/retrieval.js +1 -1
- package/dist/translations/he/shared.js +1 -1
- package/dist/translations/he/viewers.js +1 -1
- package/dist/translations/it/agent-tools.js +1 -1
- package/dist/translations/it/data.js +1 -1
- package/dist/translations/it/retrieval.js +1 -1
- package/dist/translations/it/shared.js +1 -1
- package/dist/translations/it/viewers.js +1 -1
- package/dist/translations/ja/agent-tools.js +1 -1
- package/dist/translations/ja/data.js +1 -1
- package/dist/translations/ja/retrieval.js +1 -1
- package/dist/translations/ja/shared.js +1 -1
- package/dist/translations/ja/viewers.js +1 -1
- package/dist/translations/pt-BR/agent-tools.js +1 -1
- package/dist/translations/pt-BR/data.js +1 -1
- package/dist/translations/pt-BR/retrieval.js +1 -1
- package/dist/translations/pt-BR/shared.js +1 -1
- package/dist/translations/pt-BR/viewers.js +1 -1
- package/dist/translations/ro/agent-tools.js +1 -1
- package/dist/translations/ro/data.js +1 -1
- package/dist/translations/ro/retrieval.js +1 -1
- package/dist/translations/ro/shared.js +1 -1
- package/dist/translations/ro/viewers.js +1 -1
- package/dist/translations/ru/agent-tools.js +1 -1
- package/dist/translations/ru/data.js +1 -1
- package/dist/translations/ru/retrieval.js +1 -1
- package/dist/translations/ru/shared.js +1 -1
- package/dist/translations/ru/viewers.js +1 -1
- package/dist/translations/zh-CN/agent-tools.js +1 -1
- package/dist/translations/zh-CN/data.js +1 -1
- package/dist/translations/zh-CN/retrieval.js +1 -1
- package/dist/translations/zh-CN/shared.js +1 -1
- package/dist/translations/zh-CN/viewers.js +1 -1
- package/dist/vue.d.ts +1 -1
- package/llms/components/lr-activity-feed.md +20 -9
- package/llms/components/lr-approval-queue.md +3 -2
- package/llms/components/lr-archive-viewer.md +8 -1
- package/llms/components/lr-artifact-panel.md +3 -1
- package/llms/components/lr-audio-visualizer.md +3 -1
- package/llms/components/lr-avatar-group.md +13 -6
- package/llms/components/lr-avatar.md +6 -2
- package/llms/components/lr-bar-chart.md +6 -3
- package/llms/components/lr-box-plot.md +6 -2
- package/llms/components/lr-branch-picker.md +3 -1
- package/llms/components/lr-bubble-chart.md +6 -3
- package/llms/components/lr-calendar.md +10 -3
- package/llms/components/lr-carousel.md +4 -2
- package/llms/components/lr-chart.md +12 -4
- package/llms/components/lr-chat-viewport.md +3 -2
- package/llms/components/lr-checkbox.md +8 -5
- package/llms/components/lr-citation-badge.md +2 -0
- package/llms/components/lr-claim-evidence.md +6 -2
- package/llms/components/lr-code-editor.md +3 -1
- package/llms/components/lr-color-picker.md +20 -8
- package/llms/components/lr-combobox.md +26 -3
- package/llms/components/lr-command-palette.md +6 -3
- package/llms/components/lr-community-card.md +7 -4
- package/llms/components/lr-context-inspector.md +3 -2
- package/llms/components/lr-context-meter.md +13 -5
- package/llms/components/lr-data-grid.md +2 -0
- package/llms/components/lr-date-input.md +12 -3
- package/llms/components/lr-date-picker.md +11 -2
- package/llms/components/lr-diff-view.md +46 -5
- package/llms/components/lr-doughnut-chart.md +6 -3
- package/llms/components/lr-drop-zone.md +7 -3
- package/llms/components/lr-embedding-explorer.md +8 -2
- package/llms/components/lr-emoji-picker.md +5 -1
- package/llms/components/lr-entity-chip.md +2 -0
- package/llms/components/lr-eval-run.md +3 -2
- package/llms/components/lr-export-button.md +5 -2
- package/llms/components/lr-flow-node.md +7 -4
- package/llms/components/lr-funnel.md +7 -2
- package/llms/components/lr-gauge.md +7 -2
- package/llms/components/lr-geojson-view.md +10 -2
- package/llms/components/lr-geojson-viewer.md +10 -2
- package/llms/components/lr-graph-legend.md +6 -3
- package/llms/components/lr-graph-query-builder.md +21 -11
- package/llms/components/lr-grounding-summary.md +8 -2
- package/llms/components/lr-heatmap.md +5 -2
- package/llms/components/lr-histogram.md +4 -2
- package/llms/components/lr-json-schema-viewer.md +7 -5
- package/llms/components/lr-line-chart.md +6 -3
- package/llms/components/lr-locale-picker.md +4 -1
- package/llms/components/lr-map.md +5 -3
- package/llms/components/lr-memory-panel.md +6 -2
- package/llms/components/lr-mention-popover.md +7 -4
- package/llms/components/lr-message-actions.md +3 -1
- package/llms/components/lr-message-parts.md +8 -2
- package/llms/components/lr-mind-map.md +11 -2
- package/llms/components/lr-option.md +25 -2
- package/llms/components/lr-otp-input.md +3 -1
- package/llms/components/lr-phone-input.md +9 -5
- package/llms/components/lr-pie-chart.md +6 -3
- package/llms/components/lr-polar-area-chart.md +6 -3
- package/llms/components/lr-policy-summary.md +3 -2
- package/llms/components/lr-progress-bar.md +4 -1
- package/llms/components/lr-prompt-input.md +4 -1
- package/llms/components/lr-prompt-queue.md +5 -2
- package/llms/components/lr-radar-chart.md +6 -3
- package/llms/components/lr-rag-eval-dashboard.md +7 -2
- package/llms/components/lr-realtime-session.md +3 -1
- package/llms/components/lr-rubric-form.md +6 -1
- package/llms/components/lr-scatter-chart.md +6 -3
- package/llms/components/lr-segmented.md +3 -1
- package/llms/components/lr-select.md +7 -1
- package/llms/components/lr-selection-toolbar.md +4 -1
- package/llms/components/lr-sequence-strip.md +7 -3
- package/llms/components/lr-source-card.md +16 -1
- package/llms/components/lr-source-list.md +17 -2
- package/llms/components/lr-source-picker.md +3 -1
- package/llms/components/lr-subagent-panel.md +6 -3
- package/llms/components/lr-switch.md +4 -3
- package/llms/components/lr-table.md +6 -1
- package/llms/components/lr-thinking-panel.md +8 -5
- package/llms/components/lr-token-input.md +15 -1
- package/llms/components/lr-tool-call-chip.md +2 -0
- package/llms/components/lr-tool-param-form.md +15 -4
- package/llms/components/lr-tooltip.md +8 -4
- package/llms/components/lr-trace-tree.md +7 -4
- package/llms/components/lr-video-playlist.md +7 -5
- package/llms/components/lr-voice-picker.md +7 -4
- package/llms/components/lr-widget.md +15 -2
- package/llms/migration.md +4 -4
- package/llms-full.txt +552 -159
- package/package.json +11 -9
- package/registrations.json +1 -1
- package/vscode-css-data.json +1 -1
- package/vscode-html-data.json +1 -1
- package/web-types.json +1 -1
|
@@ -156,7 +156,10 @@ export interface LyraDialogModalController{activateExternal():void;deactivateExt
|
|
|
156
156
|
* because the painted surface now sits one shadow boundary deeper than `close-button`. As of
|
|
157
157
|
* 16.0.0 the close button IS an `<lr-icon-button>`, so its background, radius, hover/press mixes,
|
|
158
158
|
* focus ring and hit-area floor come from `--lr-icon-button-*`; a rule that painted through
|
|
159
|
-
* `::part(close-button)` moves here or onto the token.
|
|
159
|
+
* `::part(close-button)` moves here or onto the token. To resize it, set
|
|
160
|
+
* `--lr-icon-button-size-scope` (or the application-wide `--lr-theme-icon-button-size`) on this
|
|
161
|
+
* element or an ancestor -- NOT `--lr-icon-button-size` itself, which every `LyraElement`
|
|
162
|
+
* re-declares on its own `:host` and so never reaches this composed child.
|
|
160
163
|
* @csspart label - Mapped alias on the visible title.
|
|
161
164
|
* @csspart body - The wrapper around the default slot.
|
|
162
165
|
* @csspart footer - The wrapper around the `footer` slot.
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import{css}from"lit";import{overlaySurface,overlaySurfaceFill}from"../../../internal/overlay-surface.styles.js";const styles=css` :host { display: inline-block; } [part='trigger'] { display: inline-block; } [part~='popup'] { position: fixed; top: 0; left: 0; z-index: var(--lr-overlay-stack-index, var(--lr-layer-popover)); max-inline-size: min(var(--max-width, var(--lr-overlay-max-inline-size, var(--lr-size-20rem))), var(--lr-positioner-available-inline-size, var(--lr-size-20rem))); max-block-size: var(--lr-positioner-available-block-size, var(--lr-size-20rem)); overflow: auto; ${overlaySurface} box-shadow: var(--lr-overlay-shadow-anchored, var(--lr-shadow-m)); } [part~='hover-bridge'] { position: fixed; inset: 0; z-index: var(--lr-overlay-stack-index, var(--lr-layer-popover)); clip-path: polygon( var(--lr-positioner-hover-bridge-top-left-x, 0) var(--lr-positioner-hover-bridge-top-left-y, 0), var(--lr-positioner-hover-bridge-top-right-x, 0) var(--lr-positioner-hover-bridge-top-right-y, 0), var(--lr-positioner-hover-bridge-bottom-right-x, 0) var(--lr-positioner-hover-bridge-bottom-right-y, 0), var(--lr-positioner-hover-bridge-bottom-left-x, 0) var(--lr-positioner-hover-bridge-bottom-left-y, 0) ); } [part~='popup'][data-hidden] { visibility: hidden; opacity: 0; pointer-events: none; transform: translateY(var(--lr-size-neg-0-25rem)); } [part~='popup'] { opacity: 1; transform: translateY(0); } :host([data-closing]) [part~='popup'][data-hidden] { visibility: visible; } [part~='content'] { padding: var(--lr-space-m); } [part~='popup']:where([data-has-arrow]) { overflow: visible; } [part~='popup']:where([data-has-arrow]) [part~='content'] { overflow: auto; max-block-size: var(--lr-positioner-available-block-size, var(--lr-size-20rem)); } [part~='arrow'] { position: absolute; inline-size: calc(2 * var(--arrow-size, var(--lr-overlay-arrow-size, var(--lr-size-0-375rem)))); block-size: calc(2 * var(--arrow-size, var(--lr-overlay-arrow-size, var(--lr-size-0-375rem)))); rotate: 45deg; ${overlaySurfaceFill} clip-path: polygon(100% 0, 100% 100%, 0 100%); } `,tooltipStyles=css`:host,[part=trigger]{display:inline-block}[part~=popup]{z-index:var(--lr-overlay-stack-index,var(--lr-layer-popover));min-inline-size:0;max-inline-size:min(var(--max-width,var(--lr-tooltip-max-inline-size,var(--lr-size-20rem))), var(--lr-positioner-available-inline-size,100vi));max-block-size:var(--lr-positioner-available-block-size,100vb);overflow-wrap:anywhere;padding:var(--lr-space-xs) var(--lr-space-s);border-radius:var(--lr-radius-xs);background:var(--lr-tooltip-background,var(--lr-color-neutral));color:var(--lr-tooltip-color,var(--lr-color-on-neutral));font-size:var(--lr-font-size-sm);line-height:var(--lr-line-height-compact);box-shadow:var(--lr-shadow-m);position:absolute;top:0;left:0;overflow:clip auto}[part~=popup][data-hidden]{visibility:hidden;opacity:0;pointer-events:none}[part~=popup]{opacity:1}:host([data-closing]) [part~=popup][data-hidden]{visibility:visible}[part~=popup]:where([data-has-arrow]){overflow:visible}[part~=arrow]{inline-size:calc(2 * var(--arrow-size,var(--lr-tooltip-arrow-size,var(--lr-size-0-375rem))));block-size:calc(2 * var(--arrow-size,var(--lr-tooltip-arrow-size,var(--lr-size-0-375rem))));background:var(--lr-tooltip-background,var(--lr-color-neutral));position:absolute;rotate:45deg}`;export{styles,tooltipStyles};
|
|
1
|
+
import{css}from"lit";import{overlaySurface,overlaySurfaceFill}from"../../../internal/overlay-surface.styles.js";const styles=css` :host { display: inline-block; } [part='trigger'] { display: inline-block; } [part~='popup'] { position: fixed; top: 0; left: 0; z-index: var(--lr-overlay-stack-index, var(--lr-layer-popover)); max-inline-size: min(var(--max-width, var(--lr-overlay-max-inline-size, var(--lr-size-20rem))), var(--lr-positioner-available-inline-size, var(--lr-size-20rem))); max-block-size: var(--lr-positioner-available-block-size, var(--lr-size-20rem)); overflow: auto; ${overlaySurface} box-shadow: var(--lr-overlay-shadow-anchored, var(--lr-shadow-m)); } [part~='hover-bridge'] { position: fixed; inset: 0; z-index: var(--lr-overlay-stack-index, var(--lr-layer-popover)); clip-path: polygon( var(--lr-positioner-hover-bridge-top-left-x, 0) var(--lr-positioner-hover-bridge-top-left-y, 0), var(--lr-positioner-hover-bridge-top-right-x, 0) var(--lr-positioner-hover-bridge-top-right-y, 0), var(--lr-positioner-hover-bridge-bottom-right-x, 0) var(--lr-positioner-hover-bridge-bottom-right-y, 0), var(--lr-positioner-hover-bridge-bottom-left-x, 0) var(--lr-positioner-hover-bridge-bottom-left-y, 0) ); } [part~='popup'][hidden] { display: none; } [part~='popup'][data-hidden] { visibility: hidden; opacity: 0; pointer-events: none; transform: translateY(var(--lr-size-neg-0-25rem)); } [part~='popup'] { opacity: 1; transform: translateY(0); } :host([data-closing]) [part~='popup'][data-hidden] { visibility: visible; } [part~='content'] { padding: var(--lr-space-m); } [part~='popup']:where([data-has-arrow]) { overflow: visible; } [part~='popup']:where([data-has-arrow]) [part~='content'] { overflow: auto; max-block-size: var(--lr-positioner-available-block-size, var(--lr-size-20rem)); } [part~='arrow'] { position: absolute; inline-size: calc(2 * var(--arrow-size, var(--lr-overlay-arrow-size, var(--lr-size-0-375rem)))); block-size: calc(2 * var(--arrow-size, var(--lr-overlay-arrow-size, var(--lr-size-0-375rem)))); rotate: 45deg; ${overlaySurfaceFill} clip-path: polygon(100% 0, 100% 100%, 0 100%); } `,tooltipStyles=css`:host,[part=trigger]{display:inline-block}[part~=popup]{z-index:var(--lr-overlay-stack-index,var(--lr-layer-popover));min-inline-size:0;max-inline-size:min(var(--max-width,var(--lr-tooltip-max-inline-size,var(--lr-size-20rem))), var(--lr-positioner-available-inline-size,100vi));max-block-size:var(--lr-positioner-available-block-size,100vb);overflow-wrap:anywhere;padding:var(--lr-space-xs) var(--lr-space-s);border-radius:var(--lr-radius-xs);background:var(--lr-tooltip-background,var(--lr-color-neutral));color:var(--lr-tooltip-color,var(--lr-color-on-neutral));font-size:var(--lr-font-size-sm);line-height:var(--lr-line-height-compact);box-shadow:var(--lr-shadow-m);position:absolute;top:0;left:0;overflow:clip auto}[part~=popup][hidden]{display:none}[part~=popup][data-hidden]{visibility:hidden;opacity:0;pointer-events:none}[part~=popup]{opacity:1}:host([data-closing]) [part~=popup][data-hidden]{visibility:visible}[part~=popup]:where([data-has-arrow]){overflow:visible}[part~=arrow]{inline-size:calc(2 * var(--arrow-size,var(--lr-tooltip-arrow-size,var(--lr-size-0-375rem))));block-size:calc(2 * var(--arrow-size,var(--lr-tooltip-arrow-size,var(--lr-size-0-375rem))));background:var(--lr-tooltip-background,var(--lr-color-neutral));position:absolute;rotate:45deg}`;export{styles,tooltipStyles};
|
|
@@ -229,7 +229,15 @@ private pinned;
|
|
|
229
229
|
* `focus`-triggered popover reopens the instant it closes, because the restoration IS a focusin
|
|
230
230
|
* on the trigger -- and it reopens from inside `updated()`, which is also what trips Lit's
|
|
231
231
|
* change-in-update warning. */
|
|
232
|
-
private suppressTriggerFocusOpen;private delayTimer?;private delayTimerView?;private pendingDirection?;private resolvedSide;private anchorPositioned;
|
|
232
|
+
private suppressTriggerFocusOpen;private delayTimer?;private delayTimerView?;private pendingDirection?;private resolvedSide;private anchorPositioned;
|
|
233
|
+
/** Removes the settled-closed popup from layout (`[hidden]` -> `display:none`) so its stale
|
|
234
|
+
* placed coordinates and full slotted-content box stop contributing to whatever ancestor
|
|
235
|
+
* establishes its CSS containing block. Starts `true` (never-opened popups stay out of
|
|
236
|
+
* layout), clears as soon as `open` becomes true -- before positioning runs, so the popup is
|
|
237
|
+
* still a real, measurable box -- and is set back only once the close transition has settled
|
|
238
|
+
* (`lr-after-hide`), preserving the existing visibility/opacity fade in the meantime. Mirrors
|
|
239
|
+
* `LyraSelect`'s `listboxHidden`. */
|
|
240
|
+
private popupHidden;private positionedAnchor?;private positioningDirection?;private directionChanged;private observedDirectAnchor?;private observedDirectAnchorWasConnected;private stopAnchorIdentityObservation?;private triggerAria?;private accessibleTriggerAria?;
|
|
233
241
|
/** The virtual anchor set by `showAt()`, taking priority over `trigger` for positioning while
|
|
234
242
|
* set. Cleared whenever the popover closes, so a later `open = true` with no fresh `showAt()`
|
|
235
243
|
* call reverts to plain trigger-based behavior. */
|
|
@@ -1,14 +1,15 @@
|
|
|
1
|
-
var __decorate=function(decorators,target,key,desc){var c=arguments.length,r=c<3?target:desc===null?desc=Object.getOwnPropertyDescriptor(target,key):desc,d;if(typeof Reflect=="object"&&typeof Reflect.decorate=="function")r=Reflect.decorate(decorators,target,key,desc);else for(var i=decorators.length-1;i>=0;i--)(d=decorators[i])&&(r=(c<3?d(r):c>3?d(target,key,r):d(target,key))||r);return c>3&&r&&Object.defineProperty(target,key,r),r};import{html,nothing}from"lit";import{property,query,state}from"lit/decorators.js";import{LyraElement}from"../../../internal/lyra-element.js";import{hostAriaLabel,nextId,resolveAccessibleTrigger}from"../../../internal/a11y.js";import{collectInitialSlotAssignment}from"../../../internal/initial-slot-collection.js";import{acquireAriaOwnership}from"../../../internal/aria-ownership.js";import{tag}from"../../../internal/prefix.js";import{resolveEffectivePositioningStrategy}from"../../../internal/positioning-strategy.js";import{loadAnchoredOverlayRuntime}from"../../../internal/anchored-overlay-runtime.js";import{rtlAwarePlacement}from"../../../internal/rtl.js";import{finiteDuration,finiteNumber}from"../../../internal/numbers.js";import{activeElementIn}from"../../../internal/active-element.js";import{literalSetConverter,omittedEmptyStringConverter,optionalLiteralSetConverter,trueDefaultBooleanConverter}from"../../../internal/converters.js";import{activateNonmodalOverlay,composedContains}from"../../../internal/nonmodal-overlay-manager.js";import{setCustomState}from"../../../internal/custom-states.js";import{attachInternalsSafely}from"../../../internal/element-internals.js";import{animateRegistered}from"../../../internal/registered-animation.js";import{applyOverlayArrow}from"./overlay-arrow.js";import{normalizeVirtualRect,observeOverlayAnchorIdentity,OverlayTransitionGate,resolveOverlayAnchor}from"./overlay-shared.js";import{styles}from"./overlay.styles.js";import{LYRA_DEFAULT_menuLabel,LYRA_DEFAULT_popover}from"../../../internal/default-strings.generated.js";const DEFAULT_DISTANCE=8;let popoverConnectionSequence=0;const POPUP_ROLE=literalSetConverter(["dialog","menu","none"],"dialog"),POPOVER_TRIGGER_KEYWORDS=["click","hover","focus","manual"];function normalizeTriggerList(next){const keywords=[];for(const token of String(next??"").trim().toLowerCase().split(/\s+/)){const keyword=POPOVER_TRIGGER_KEYWORDS.find(candidate=>candidate===token);keyword&&!keywords.includes(keyword)&&keywords.push(keyword)}return keywords.length>0?keywords.join(" "):"click"}const DEFAULT_TRIGGER_DELAY=0,POSITIONING_STRATEGY=optionalLiteralSetConverter(["absolute","fixed"]);class LyraPopover extends LyraElement{constructor(){super(...arguments),this._open=!1,this.placement="top",this.distance=8,this.skidding=0,this._for="",this.anchor=null,this.arrow=!0,this.withoutArrow=!1,this.arrowPlacement="anchor",this.arrowPadding=0,this._trigger="click",this.showDelay=0,this.hideDelay=0,this.hoverBridge=!1,this.accessibleLabel="",this._popupRole="dialog",this._disabled=!1,this.openedByInteraction=!1,this.pinned=!1,this.suppressTriggerFocusOpen=!1,this.resolvedSide="bottom",this.anchorPositioned=!1,this.directionChanged=!1,this.observedDirectAnchorWasConnected=!1,this.positioningGeneration=0,this.positioningReady=Promise.resolve(!1),this.generatedHostId=nextId("popover"),this.popupId=nextId("popover-popup"),this.hostIdObserverGeneration=0,this.transitionToken=0,this.transitionGate=new OverlayTransitionGate,this.connectionSequence=0,this.popoverInternals=attachInternalsSafely(this),this.onExternalTriggerKeyDown=event=>{this.onTriggerKeyDown(event)},this.onTriggerSlotChange=event=>{this.collectTriggerFromSlot(event.target)},this.onTriggerClick=()=>{if(!this.virtualAnchor&&(this.syncTriggerA11y(),!this.isManualTrigger)){if(this.cancelPendingTransition(),this.opensOn("click")){this.open?this.hide():this.show();return}if(this.open&&this.pinned){this.hide();return}this.pinned=!0,this.openedByInteraction=!1,this.open||this.show()}},this.onTriggerPointerEnter=()=>{this.opensOn("hover")&&this.requestDelayedTransition(!0)},this.onTriggerPointerLeave=event=>{this.opensOn("hover")&&this.requestInteractionClose(event.relatedTarget)},this.onPopupPointerEnter=()=>{!this.opensOn("hover")||!this.open||this.cancelPendingTransition()},this.onPopupPointerLeave=event=>{this.opensOn("hover")&&this.requestInteractionClose(event.relatedTarget)},this.onSurfaceFocusIn=()=>{!this.opensOn("focus")||this.suppressTriggerFocusOpen||this.requestDelayedTransition(!0)},this.onSurfaceFocusOut=event=>{this.opensOn("focus")&&this.requestInteractionClose(event.relatedTarget)},this.onPopupClick=event=>{if(event.defaultPrevented)return;const path=event.composedPath(),hostIndex=path.indexOf(this);if(hostIndex<0)return;const closeAction=path.slice(0,hostIndex).find(target=>target.nodeType===1&&target.getAttribute("data-popover")==="close");if(!closeAction)return;event.stopPropagation();const state2=closeAction;state2.effectiveDisabled===!0||state2.disabled===!0||closeAction.hasAttribute("disabled")||closeAction.getAttribute("aria-disabled")?.trim().toLowerCase()==="true"||closeAction.hasAttribute("inert")||closeAction.closest("[inert]")||this.hide()},this.onDocumentPointer=event=>{this.overlayHandle?.isTopmost()&&(this.isInsideLightDismissBoundary(event.composedPath())||this.hide())}}static{this.defaultStrings={...super.defaultStrings,menuLabel:LYRA_DEFAULT_menuLabel,popover:LYRA_DEFAULT_popover}}static{this.styles=[LyraElement.styles,styles]}get open(){return this._open}set open(next){const normalized=!!next&&this.canOpen;if(normalized!==this._open){if(!this.hasUpdated){this.setOpen(normalized),this.isConnected&&this.connectionSequence>0&&this.updateBrowserDerivedState(()=>this.reconcileInitialPopoverPeers());return}normalized?this.show():this.hide()}}get positioningStrategy(){return this._positioningStrategy??this.defaultPositioningStrategy}set positioningStrategy(next){const normalized=POSITIONING_STRATEGY.normalize(next)??this.defaultPositioningStrategy,old=this.positioningStrategy;this._positioningStrategy=normalized,normalized!==old&&(this.requestUpdate("positioningStrategy",old),this.onPositioningStrategyChanged(old,normalized))}onPositioningStrategyChanged(_previous,_next){}get for(){return this._for}set for(next){this._for=next??""}get trigger(){return this._trigger}set trigger(next){const normalized=normalizeTriggerList(next);if(normalized===this._trigger)return;const old=this._trigger;this._trigger=normalized,this.requestUpdate("trigger",old)}get triggerKeywords(){return new Set(this._trigger.split(" "))}get isManualTrigger(){return this.triggerKeywords.has("manual")}opensOn(keyword){return!this.isManualTrigger&&this.triggerKeywords.has(keyword)}get popupRole(){return this._popupRole}set popupRole(next){const normalized=POPUP_ROLE.normalize(next);if(normalized===this._popupRole)return;const old=this._popupRole;this._popupRole=normalized,this.requestUpdate("popupRole",old)}get disabled(){return this._disabled}set disabled(next){const normalized=!!next;if(normalized===this._disabled)return;const old=this._disabled;this._disabled=normalized,this.requestUpdate("disabled",old),normalized&&this.open&&(this.hasUpdated?this.hide():this.open=!1)}get defaultDistance(){return DEFAULT_DISTANCE}get defaultPositioningStrategy(){return"fixed"}get positioningSync(){}get animationNamespace(){return"popover"}animationDurationProperties(showing){return[showing?"--show-duration":"--hide-duration","--lr-duration-fast"]}get popupPartNames(){return["popup","dialog","popup__popup"].join(" ")}get contentPartNames(){return["content","body"].join(" ")}get triggerPopupRole(){return this.popupRole}get popupSurfaceRole(){return this.popupRole==="none"?void 0:this.popupRole}get effectivePopupLabel(){return hostAriaLabel(this)??(this.accessibleLabel||this.localize(this.triggerPopupRole==="menu"?"menuLabel":"popover"))}get rendersArrow(){return this.arrow&&!this.withoutArrow}get rendersHoverBridge(){return this.hoverBridge&&this.opensOn("hover")&&this.open}get canOpen(){return!this.disabled}renderPopupContent(){return html`<slot></slot>`}onTriggerKeyDown(_event){}isInsideLightDismissBoundary(path){return path.includes(this)||this.triggerElement!=null&&path.includes(this.triggerElement)}onPopupPositioned(){this.openedByInteraction||this.overlayHandle?.focusAutofocus()}willUpdate(changed){super.willUpdate(changed);const direction=this.effectiveDirection;this.directionChanged=direction!==this.positioningDirection,this.positioningDirection=direction,changed.has("anchor")&&changed.get("anchor")===this.observedDirectAnchor&&this.observedDirectAnchorWasConnected&&this.anchor?.isConnected!==!0&&this.open&&!this.resolveAnchor()&&this.forceClose({focusTrigger:!1}),changed.has("open")&&!this.open&&(this.anchorPositioned=!1),(changed.has("anchor")||changed.has("for"))&&(this.anchorPositioned=!1)}updated(changed){if(super.updated(changed),changed.has("trigger")&&(this.cancelPendingTransition(),!this.opensOn("hover")&&!this.opensOn("focus")&&(this.pinned=!1)),changed.has("showDelay")&&this.pendingDirection==="show"&&this.requestDelayedTransition(!0,!0),changed.has("hideDelay")&&this.pendingDirection==="hide"&&this.requestDelayedTransition(!1,!0),(changed.has("for")||changed.has("anchor")||changed.has("open"))&&this.syncAnchorIdentityObservation(),changed.has("for")&&this.syncInteractionTrigger(),this.directionChanged||changed.has("open")||changed.has("placement")||changed.has("positioningStrategy")||changed.has("hoverBridge")||changed.has("trigger")||changed.has("distance")||changed.has("skidding")||changed.has("for")||changed.has("anchor")||changed.has("arrow")||changed.has("withoutArrow")||changed.has("arrowPlacement")||changed.has("arrowPadding")||changed.has("popupRole")){if(this.open&&this.isConnected?this.positionPopup():changed.has("open")&&this.invalidatePositioning(),changed.has("open"))if(this.open)this.isConnected&&(this.startLightDismiss(),this.activatePopoverOverlay());else{this.pinned=!1,this.openedByInteraction=!1,this.cancelPendingTransition(),this.positionedAnchor=void 0,this.stopLightDismiss(),this.suppressTriggerFocusOpen=!0;try{this.overlayHandle?.deactivate()}finally{this.suppressTriggerFocusOpen=!1}this.overlayHandle=void 0,this.virtualAnchor=void 0,this.returnFocusTo=void 0,this.syncInteractionTrigger()}this.isConnected&&this.syncTriggerA11y()}}firstUpdated(changed){super.firstUpdated(changed);const slot=this.triggerSlotElement;queueMicrotask(()=>{collectInitialSlotAssignment(slot,s=>this.collectTriggerFromSlot(s))})}connectedCallback(){if(super.connectedCallback(),this.connectionSequence=++popoverConnectionSequence,this.addEventListener("focusin",this.onSurfaceFocusIn),this.addEventListener("focusout",this.onSurfaceFocusOut),this.updateBrowserDerivedState(()=>this.reconcileInitialPopoverPeers()),this.syncAnchorIdentityObservation(),this.id||(this.id=this.generatedHostId),this.observeHostId(),this.syncInteractionTrigger(),this.hasUpdated&&this.open){const wasPreviouslyActivated=this.overlayHandle?.isActive()===!0;this.startLightDismiss(),wasPreviouslyActivated?this.overlayHandle.resume():this.activatePopoverOverlay(),this.positionPopup()}}disconnectedCallback(){this.stopAnchorIdentityObservation?.(),this.stopAnchorIdentityObservation=void 0,this.invalidatePositioning(),this.stopLightDismiss(),this.resetHostIdObserver(),this.overlayHandle?.suspend(),this.triggerElement?.removeEventListener("click",this.onTriggerClick),this.triggerElement?.removeEventListener("keydown",this.onExternalTriggerKeyDown),this.triggerElement&&this.unbindTriggerInteractions(this.triggerElement),this.releaseTriggerA11y(),this.triggerElement=void 0,this.removeEventListener("focusin",this.onSurfaceFocusIn),this.removeEventListener("focusout",this.onSurfaceFocusOut),this.cancelPendingTransition(),this.pinned=!1,this.openedByInteraction=!1,this.transitionToken++,this.cancelTransitionAnimation(),this.removeAttribute("data-closing"),super.disconnectedCallback()}adoptedCallback(){super.adoptedCallback(),this.stopAnchorIdentityObservation?.(),this.stopAnchorIdentityObservation=void 0,this.resetHostIdObserver(),this.releaseTriggerA11y()}syncAnchorIdentityObservation(){this.stopAnchorIdentityObservation?.(),this.stopAnchorIdentityObservation=void 0;const directAnchor=this.open?this.anchor??void 0:void 0;if(this.observedDirectAnchor=directAnchor,this.observedDirectAnchorWasConnected=directAnchor?.isConnected===!0,!this.isConnected||!this.for&&!directAnchor)return;const onIdentityChange=()=>{const directAnchorRemoved=this.anchor===this.observedDirectAnchor&&this.observedDirectAnchorWasConnected&&this.observedDirectAnchor?.isConnected===!1;if(this.observedDirectAnchorWasConnected=this.observedDirectAnchor?.isConnected===!0,this.syncInteractionTrigger(),!this.open)return;const nextAnchor=this.resolveAnchor();if(directAnchorRemoved&&!nextAnchor){this.forceClose({focusTrigger:!1});return}nextAnchor!==this.positionedAnchor&&this.positionPopup()},observedRoots=new Set([this]);directAnchor&&directAnchor.getRootNode()!==this.getRootNode()&&observedRoots.add(directAnchor.isConnected?directAnchor:directAnchor.ownerDocument);const cleanups=[...observedRoots].map(root=>observeOverlayAnchorIdentity(root,onIdentityChange));this.stopAnchorIdentityObservation=()=>{for(const cleanup of cleanups)cleanup()}}resolveForTrigger(){if(!this.for)return;const target=this.getRootNode().getElementById?.(this.for)??null,HTMLElementCtor=target?.ownerDocument.defaultView?.HTMLElement;return target&&HTMLElementCtor&&target instanceof HTMLElementCtor?target:void 0}syncInteractionTrigger(){const next=this.virtualAnchor?void 0:this.slottedTrigger??this.resolveForTrigger();if(next===this.triggerElement){this.syncTriggerA11y();return}if(this.triggerElement?.removeEventListener("click",this.onTriggerClick),this.triggerElement?.removeEventListener("keydown",this.onExternalTriggerKeyDown),this.triggerElement&&this.unbindTriggerInteractions(this.triggerElement),this.triggerElement=next,this.triggerElement&&this.triggerElement!==this.slottedTrigger&&(this.triggerElement.addEventListener("click",this.onTriggerClick),this.triggerElement.addEventListener("keydown",this.onExternalTriggerKeyDown)),this.triggerElement&&this.bindTriggerInteractions(this.triggerElement),this.syncTriggerA11y(),this.open){if(!this.resolveAnchor()){this.forceClose({focusTrigger:!1});return}this.updatePopoverRestoreFocusTarget(),this.positionPopup()}}activatePopoverOverlay(){!this.isConnected||this.overlayHandle?.isActive()||(this.overlayHandle=activateNonmodalOverlay({host:this,panel:()=>this.renderRoot.querySelector('[part~="popup"]'),onEscape:()=>{this.hide()},restoreFocusTo:this.virtualAnchor?this.returnFocusTo??null:this.accessibleTrigger}))}updatePopoverRestoreFocusTarget(){const target=this.virtualAnchor?this.returnFocusTo??null:this.accessibleTrigger;if(this.overlayHandle?.isActive()){this.overlayHandle.updateRestoreFocusTo(target);return}this.activatePopoverOverlay()}showAt(rect,options){const normalizedRect=normalizeVirtualRect(rect);if(!normalizedRect)return;const previousAnchor=this.virtualAnchor,previousReturnFocusTo=this.returnFocusTo,bounds=new DOMRect(normalizedRect.x,normalizedRect.y,normalizedRect.width,normalizedRect.height);if(this.virtualAnchor={getBoundingClientRect:()=>bounds,contextElement:normalizedRect.contextElement},this.returnFocusTo=options?.returnFocusTo,this.syncInteractionTrigger(),this.open){this.updatePopoverRestoreFocusTarget(),this.positionPopup();return}this.show(),!this.open&&(this.virtualAnchor=previousAnchor,this.returnFocusTo=previousReturnFocusTo,this.syncInteractionTrigger())}resolveAnchor(){return resolveOverlayAnchor(this,{virtualAnchor:this.virtualAnchor,anchor:this.anchor,for:this.for,trigger:this.triggerElement})}positionPopup(){this.invalidatePositioning();const popup=this.renderRoot.querySelector('[part~="popup"]'),arrowElement=this.renderRoot.querySelector('[part~="arrow"]'),bridgeElement=this.renderRoot.querySelector('[part~="hover-bridge"]'),anchor=this.resolveAnchor();if(!this.open||!anchor||!popup){this.positionedAnchor=void 0,this.anchorPositioned=!1;return}anchor!==this.positionedAnchor&&(this.anchorPositioned=!1);const generation=this.positioningGeneration;this.positioningReady=new Promise(resolve=>{this.resolvePositioningReady=resolve}),this.startPositioning(generation,anchor,popup,arrowElement,bridgeElement)}invalidatePositioning(){this.positioningGeneration++,this.cleanup?.(),this.cleanup=void 0,this.resolvePositioningReady?.(!1),this.resolvePositioningReady=void 0}resolveCurrentPositioning(positioned){const resolve=this.resolvePositioningReady;this.resolvePositioningReady=void 0,resolve?.(positioned)}async startPositioning(generation,anchor,popup,arrowElement,bridgeElement){try{const{place}=await loadAnchoredOverlayRuntime();if(generation!==this.positioningGeneration||!this.open||!this.isConnected||this.resolveAnchor()!==anchor||this.renderRoot.querySelector('[part~="popup"]')!==popup)return;const cleanup=place(anchor,popup,{placement:rtlAwarePlacement(this.placement,this),strategy:resolveEffectivePositioningStrategy(this,this._positioningStrategy,this.defaultPositioningStrategy),offset:finiteNumber(this.distance,this.defaultDistance),skidding:finiteNumber(this.skidding,0),sync:this.positioningSync,arrow:this.rendersArrow&&arrowElement?arrowElement:void 0,arrowPadding:Math.max(0,finiteNumber(this.arrowPadding,0)),hoverBridge:this.rendersHoverBridge&&bridgeElement?bridgeElement:void 0,onPlaced:({placement,arrow})=>{if(generation!==this.positioningGeneration)return;const becamePositioned=!this.anchorPositioned||this.positionedAnchor!==anchor;this.positionedAnchor=anchor,this.anchorPositioned=!0;const side=applyOverlayArrow(arrowElement,{placement,coords:arrow,enabled:this.rendersArrow,arrowPlacement:this.arrowPlacement,arrowPadding:Math.max(0,finiteNumber(this.arrowPadding,0)),rtl:this.effectiveDirection==="rtl",sizeProperty:"--arrow-size",fallbackSizeProperty:"--lr-overlay-arrow-size"});side!==this.resolvedSide&&(this.resolvedSide=side),this.updateComplete.then(()=>{generation!==this.positioningGeneration||!this.open||this.resolveAnchor()!==anchor||(this.resolveCurrentPositioning(!0),becamePositioned&&this.onPopupPositioned())})}});generation!==this.positioningGeneration?cleanup():this.cleanup=cleanup}catch{if(generation!==this.positioningGeneration)return;this.resolveCurrentPositioning(!1),this.forceClose({focusTrigger:!1})}}syncTriggerA11y(){const trigger=this.triggerElement??null,popup=this.renderRoot?.querySelector('[part~="popup"]')??null,contribution={attributes:{"aria-haspopup":this.triggerPopupRole==="none"?null:this.triggerPopupRole,"aria-expanded":this.open?"true":"false"},controls:popup?[popup]:[]};this.triggerAria?this.triggerAria.update(trigger,contribution):this.triggerAria=acquireAriaOwnership(trigger,contribution);const accessibleTrigger=this.accessibleTrigger,distinctAccessibleTrigger=accessibleTrigger!==trigger?accessibleTrigger:null;this.accessibleTriggerAria?this.accessibleTriggerAria.update(distinctAccessibleTrigger,contribution):this.accessibleTriggerAria=acquireAriaOwnership(distinctAccessibleTrigger,contribution),this.overlayHandle?.isActive()&&!this.virtualAnchor&&this.overlayHandle.updateRestoreFocusTo(accessibleTrigger)}get accessibleTrigger(){return this.triggerElement?resolveAccessibleTrigger(this.triggerElement):null}releaseTriggerA11y(){this.accessibleTriggerAria?.release(),this.accessibleTriggerAria=void 0,this.triggerAria?.release(),this.triggerAria=void 0}collectTriggerFromSlot(slot){const next=slot.assignedElements({flatten:!0})[0];next!==this.slottedTrigger&&(this.slottedTrigger=next,this.syncInteractionTrigger())}requestInteractionClose(next){this.pinned||this.isWithinPopoverSurface(next)||this.hasFocusWithinSurface()||this.requestDelayedTransition(!1)}isWithinPopoverSurface(target){if(target===null||target.nodeType!==1)return!1;const element=target;if(composedContains(this,element))return!0;const popup=this.renderRoot?.querySelector('[part~="popup"]')??null;return popup&&composedContains(popup,element)?!0:this.triggerElement!=null&&composedContains(this.triggerElement,element)}hasFocusWithinSurface(){const active=activeElementIn(this.ownerDocument);return active===null||this.triggerElement&&composedContains(this.triggerElement,active)?!1:this.isWithinPopoverSurface(active)}requestDelayedTransition(next,deferImmediate=!1){if(this.cancelPendingTransition(),next&&!this.canOpen)return;const commit=()=>{next?(this.openedByInteraction=!0,this.show()):this.hide()},delay=Math.max(0,finiteDuration(next?this.showDelay:this.hideDelay,DEFAULT_TRIGGER_DELAY)),view=this.ownerDocument.defaultView;if(!view||delay<=0&&!deferImmediate){commit();return}this.pendingDirection=next?"show":"hide",this.delayTimerView=view;const timer=view.setTimeout(()=>{this.delayTimerView!==view||this.delayTimer!==timer||(this.delayTimer=void 0,this.delayTimerView=void 0,this.pendingDirection=void 0,commit())},delay);this.delayTimer=timer}cancelPendingTransition(){this.delayTimer!==void 0&&this.delayTimerView?.clearTimeout(this.delayTimer),this.delayTimer=void 0,this.delayTimerView=void 0,this.pendingDirection=void 0}triggerNeedsOwnFocusListeners(trigger){return!composedContains(this,trigger)}bindTriggerInteractions(trigger){trigger.addEventListener("mouseenter",this.onTriggerPointerEnter),trigger.addEventListener("mouseleave",this.onTriggerPointerLeave),this.triggerNeedsOwnFocusListeners(trigger)&&(trigger.addEventListener("focusin",this.onSurfaceFocusIn),trigger.addEventListener("focusout",this.onSurfaceFocusOut))}unbindTriggerInteractions(trigger){trigger.removeEventListener("mouseenter",this.onTriggerPointerEnter),trigger.removeEventListener("mouseleave",this.onTriggerPointerLeave),trigger.removeEventListener("focusin",this.onSurfaceFocusIn),trigger.removeEventListener("focusout",this.onSurfaceFocusOut)}startLightDismiss(){const nextDocument=this.ownerDocument;this.lightDismissDocument!==nextDocument&&(this.stopLightDismiss(),nextDocument.addEventListener("pointerdown",this.onDocumentPointer),this.lightDismissDocument=nextDocument)}stopLightDismiss(){this.lightDismissDocument?.removeEventListener("pointerdown",this.onDocumentPointer),this.lightDismissDocument=void 0}observeHostId(){const ownerDocument=this.ownerDocument;if(this.hostIdObserver&&this.hostIdObserverDocument===ownerDocument)return;this.resetHostIdObserver();const MutationObserverCtor=ownerDocument.defaultView?.MutationObserver;if(!MutationObserverCtor||!this.isConnected)return;const generation=this.hostIdObserverGeneration,observer=new MutationObserverCtor(()=>{this.hostIdObserver!==observer||this.hostIdObserverDocument!==ownerDocument||this.hostIdObserverGeneration!==generation||!this.isConnected||this.ownerDocument!==ownerDocument||(this.id||(this.id=this.generatedHostId),this.syncTriggerA11y())});this.hostIdObserver=observer,this.hostIdObserverDocument=ownerDocument,observer.observe(this,{attributes:!0,attributeFilter:["id"]})}resetHostIdObserver(){this.hostIdObserverGeneration+=1,this.hostIdObserver?.disconnect(),this.hostIdObserver=void 0,this.hostIdObserverDocument=void 0}setOpen(next){if(this._open===next)return;const old=this._open;this._open=next,setCustomState(this.popoverInternals,"open",next),this.requestUpdate("open",old)}syncOpenAttribute(){this.toggleAttribute("open",this._open)}show(){return this._open||!this.canOpen?Promise.resolve():this.transitionGate.request(!0,()=>{if(this.emitCancelableLifecycle("lr-show").defaultPrevented){this.syncOpenAttribute();return}if(!this.closePopoverPeers()){this.syncOpenAttribute();return}return this.cancelTransitionAnimation(),this.removeAttribute("data-closing"),this.setOpen(!0),this.settleTransition("lr-after-show")})}hide(options){return this._open?this.transitionGate.request(!1,()=>{if(this.emitCancelableLifecycle("lr-hide").defaultPrevented){this.syncOpenAttribute();return}return this.forceClose(options)}):Promise.resolve()}closePopoverPeers(){if(this.virtualAnchor||this.localName!==tag("popover"))return!0;const root=this.getRootNode();for(const peer of root.querySelectorAll(tag("popover")))if(!(peer===this||!peer.open||peer.virtualAnchor)&&(peer.hide({focusTrigger:!1}),peer.open))return!1;return!0}reconcileInitialPopoverPeers(){if(!this.isConnected||!this._open||this.virtualAnchor||this.localName!==tag("popover"))return;const peers=[...this.getRootNode().querySelectorAll(tag("popover"))].filter(peer=>peer.isConnected&&peer._open&&!peer.virtualAnchor&&peer.connectionSequence>0);if(peers.reduce((latest,peer)=>!latest||peer.connectionSequence>latest.connectionSequence?peer:latest,void 0)!==this){this.closeForInitialPeerReconciliation();return}for(const peer of peers)peer!==this&&peer.closeForInitialPeerReconciliation()}closeForInitialPeerReconciliation(){this._open&&(this.transitionToken++,this.cancelTransitionAnimation(),this.removeAttribute("data-closing"),this.invalidatePositioning(),this.stopLightDismiss(),this.overlayHandle?.deactivate({restoreFocus:!1}),this.overlayHandle=void 0,this.positionedAnchor=void 0,this.anchorPositioned=!1,this.returnFocusTo=void 0,this.setOpen(!1),this.syncOpenAttribute())}forceClose(options){return this._open?(options?.focusTrigger===!1&&(this.overlayHandle?.deactivate({restoreFocus:!1}),this.overlayHandle=void 0),this.cancelTransitionAnimation(),this.isConnected&&this.setAttribute("data-closing",""),this.setOpen(!1),this.settleTransition("lr-after-hide")):Promise.resolve()}cancelTransitionAnimation(){this.transitionAnimation?.cancel(),this.transitionAnimation=void 0}emitCancelableLifecycle(name){return this.emit(name,null,{cancelable:!0})}emitSettledLifecycle(name){return this.emit(name)}async settleTransition(event){const token=++this.transitionToken;if(await this.updateComplete,this.transitionToken===token){if(event==="lr-after-show"){for(;this.open&&!this.anchorPositioned;){const readiness=this.positioningReady,positioned=await readiness;if(this.transitionToken!==token)return;if(positioned)break;if(readiness===this.positioningReady)return}if(await this.updateComplete,this.transitionToken!==token)return}if(this.isConnected){const popup=this.renderRoot.querySelector('[part~="popup"]'),showing=event==="lr-after-show",offset="translateY(var(--lr-size-neg-0-25rem))",animation=popup?animateRegistered(this,popup,`${this.animationNamespace}.${showing?"show":"hide"}`,this.effectiveDirection,{keyframes:showing?[{opacity:0,transform:offset},{opacity:1,transform:"translateY(0)"}]:[{opacity:1,transform:"translateY(0)"},{opacity:0,transform:offset}],durationProperties:this.animationDurationProperties(showing),easingProperties:["--lr-easing-standard"]}):void 0;if(this.transitionAnimation=animation,await animation?.finished.catch(()=>{}),this.transitionToken!==token)return;this.cancelTransitionAnimation()}event==="lr-after-hide"&&this.removeAttribute("data-closing"),this.emitSettledLifecycle(event)}}render(){const popupRole=this.popupSurfaceRole;return html`
|
|
1
|
+
var __decorate=function(decorators,target,key,desc){var c=arguments.length,r=c<3?target:desc===null?desc=Object.getOwnPropertyDescriptor(target,key):desc,d;if(typeof Reflect=="object"&&typeof Reflect.decorate=="function")r=Reflect.decorate(decorators,target,key,desc);else for(var i=decorators.length-1;i>=0;i--)(d=decorators[i])&&(r=(c<3?d(r):c>3?d(target,key,r):d(target,key))||r);return c>3&&r&&Object.defineProperty(target,key,r),r};import{html,nothing}from"lit";import{property,query,state}from"lit/decorators.js";import{LyraElement}from"../../../internal/lyra-element.js";import{hostAriaLabel,nextId,resolveAccessibleTrigger}from"../../../internal/a11y.js";import{collectInitialSlotAssignment}from"../../../internal/initial-slot-collection.js";import{acquireAriaOwnership}from"../../../internal/aria-ownership.js";import{tag}from"../../../internal/prefix.js";import{resolveEffectivePositioningStrategy}from"../../../internal/positioning-strategy.js";import{loadAnchoredOverlayRuntime}from"../../../internal/anchored-overlay-runtime.js";import{rtlAwarePlacement}from"../../../internal/rtl.js";import{finiteDuration,finiteNumber}from"../../../internal/numbers.js";import{activeElementIn}from"../../../internal/active-element.js";import{literalSetConverter,omittedEmptyStringConverter,optionalLiteralSetConverter,trueDefaultBooleanConverter}from"../../../internal/converters.js";import{activateNonmodalOverlay,composedContains}from"../../../internal/nonmodal-overlay-manager.js";import{setCustomState}from"../../../internal/custom-states.js";import{attachInternalsSafely}from"../../../internal/element-internals.js";import{animateRegistered}from"../../../internal/registered-animation.js";import{applyOverlayArrow}from"./overlay-arrow.js";import{normalizeVirtualRect,observeOverlayAnchorIdentity,OverlayTransitionGate,resolveOverlayAnchor}from"./overlay-shared.js";import{styles}from"./overlay.styles.js";import{LYRA_DEFAULT_menuLabel,LYRA_DEFAULT_popover}from"../../../internal/default-strings.generated.js";const DEFAULT_DISTANCE=8;let popoverConnectionSequence=0;const POPUP_ROLE=literalSetConverter(["dialog","menu","none"],"dialog"),POPOVER_TRIGGER_KEYWORDS=["click","hover","focus","manual"];function normalizeTriggerList(next){const keywords=[];for(const token of String(next??"").trim().toLowerCase().split(/\s+/)){const keyword=POPOVER_TRIGGER_KEYWORDS.find(candidate=>candidate===token);keyword&&!keywords.includes(keyword)&&keywords.push(keyword)}return keywords.length>0?keywords.join(" "):"click"}const DEFAULT_TRIGGER_DELAY=0,POSITIONING_STRATEGY=optionalLiteralSetConverter(["absolute","fixed"]);class LyraPopover extends LyraElement{constructor(){super(...arguments),this._open=!1,this.placement="top",this.distance=8,this.skidding=0,this._for="",this.anchor=null,this.arrow=!0,this.withoutArrow=!1,this.arrowPlacement="anchor",this.arrowPadding=0,this._trigger="click",this.showDelay=0,this.hideDelay=0,this.hoverBridge=!1,this.accessibleLabel="",this._popupRole="dialog",this._disabled=!1,this.openedByInteraction=!1,this.pinned=!1,this.suppressTriggerFocusOpen=!1,this.resolvedSide="bottom",this.anchorPositioned=!1,this.popupHidden=!0,this.directionChanged=!1,this.observedDirectAnchorWasConnected=!1,this.positioningGeneration=0,this.positioningReady=Promise.resolve(!1),this.generatedHostId=nextId("popover"),this.popupId=nextId("popover-popup"),this.hostIdObserverGeneration=0,this.transitionToken=0,this.transitionGate=new OverlayTransitionGate,this.connectionSequence=0,this.popoverInternals=attachInternalsSafely(this),this.onExternalTriggerKeyDown=event=>{this.onTriggerKeyDown(event)},this.onTriggerSlotChange=event=>{this.collectTriggerFromSlot(event.target)},this.onTriggerClick=()=>{if(!this.virtualAnchor&&(this.syncTriggerA11y(),!this.isManualTrigger)){if(this.cancelPendingTransition(),this.opensOn("click")){this.open?this.hide():this.show();return}if(this.open&&this.pinned){this.hide();return}this.pinned=!0,this.openedByInteraction=!1,this.open||this.show()}},this.onTriggerPointerEnter=()=>{this.opensOn("hover")&&this.requestDelayedTransition(!0)},this.onTriggerPointerLeave=event=>{this.opensOn("hover")&&this.requestInteractionClose(event.relatedTarget)},this.onPopupPointerEnter=()=>{!this.opensOn("hover")||!this.open||this.cancelPendingTransition()},this.onPopupPointerLeave=event=>{this.opensOn("hover")&&this.requestInteractionClose(event.relatedTarget)},this.onSurfaceFocusIn=()=>{!this.opensOn("focus")||this.suppressTriggerFocusOpen||this.requestDelayedTransition(!0)},this.onSurfaceFocusOut=event=>{this.opensOn("focus")&&this.requestInteractionClose(event.relatedTarget)},this.onPopupClick=event=>{if(event.defaultPrevented)return;const path=event.composedPath(),hostIndex=path.indexOf(this);if(hostIndex<0)return;const closeAction=path.slice(0,hostIndex).find(target=>target.nodeType===1&&target.getAttribute("data-popover")==="close");if(!closeAction)return;event.stopPropagation();const state2=closeAction;state2.effectiveDisabled===!0||state2.disabled===!0||closeAction.hasAttribute("disabled")||closeAction.getAttribute("aria-disabled")?.trim().toLowerCase()==="true"||closeAction.hasAttribute("inert")||closeAction.closest("[inert]")||this.hide()},this.onDocumentPointer=event=>{this.overlayHandle?.isTopmost()&&(this.isInsideLightDismissBoundary(event.composedPath())||this.hide())}}static{this.defaultStrings={...super.defaultStrings,menuLabel:LYRA_DEFAULT_menuLabel,popover:LYRA_DEFAULT_popover}}static{this.styles=[LyraElement.styles,styles]}get open(){return this._open}set open(next){const normalized=!!next&&this.canOpen;if(normalized!==this._open){if(!this.hasUpdated){this.setOpen(normalized),this.isConnected&&this.connectionSequence>0&&this.updateBrowserDerivedState(()=>this.reconcileInitialPopoverPeers());return}normalized?this.show():this.hide()}}get positioningStrategy(){return this._positioningStrategy??this.defaultPositioningStrategy}set positioningStrategy(next){const normalized=POSITIONING_STRATEGY.normalize(next)??this.defaultPositioningStrategy,old=this.positioningStrategy;this._positioningStrategy=normalized,normalized!==old&&(this.requestUpdate("positioningStrategy",old),this.onPositioningStrategyChanged(old,normalized))}onPositioningStrategyChanged(_previous,_next){}get for(){return this._for}set for(next){this._for=next??""}get trigger(){return this._trigger}set trigger(next){const normalized=normalizeTriggerList(next);if(normalized===this._trigger)return;const old=this._trigger;this._trigger=normalized,this.requestUpdate("trigger",old)}get triggerKeywords(){return new Set(this._trigger.split(" "))}get isManualTrigger(){return this.triggerKeywords.has("manual")}opensOn(keyword){return!this.isManualTrigger&&this.triggerKeywords.has(keyword)}get popupRole(){return this._popupRole}set popupRole(next){const normalized=POPUP_ROLE.normalize(next);if(normalized===this._popupRole)return;const old=this._popupRole;this._popupRole=normalized,this.requestUpdate("popupRole",old)}get disabled(){return this._disabled}set disabled(next){const normalized=!!next;if(normalized===this._disabled)return;const old=this._disabled;this._disabled=normalized,this.requestUpdate("disabled",old),normalized&&this.open&&(this.hasUpdated?this.hide():this.open=!1)}get defaultDistance(){return DEFAULT_DISTANCE}get defaultPositioningStrategy(){return"fixed"}get positioningSync(){}get animationNamespace(){return"popover"}animationDurationProperties(showing){return[showing?"--show-duration":"--hide-duration","--lr-duration-fast"]}get popupPartNames(){return["popup","dialog","popup__popup"].join(" ")}get contentPartNames(){return["content","body"].join(" ")}get triggerPopupRole(){return this.popupRole}get popupSurfaceRole(){return this.popupRole==="none"?void 0:this.popupRole}get effectivePopupLabel(){return hostAriaLabel(this)??(this.accessibleLabel||this.localize(this.triggerPopupRole==="menu"?"menuLabel":"popover"))}get rendersArrow(){return this.arrow&&!this.withoutArrow}get rendersHoverBridge(){return this.hoverBridge&&this.opensOn("hover")&&this.open}get canOpen(){return!this.disabled}renderPopupContent(){return html`<slot></slot>`}onTriggerKeyDown(_event){}isInsideLightDismissBoundary(path){return path.includes(this)||this.triggerElement!=null&&path.includes(this.triggerElement)}onPopupPositioned(){this.openedByInteraction||this.overlayHandle?.focusAutofocus()}willUpdate(changed){super.willUpdate(changed);const direction=this.effectiveDirection;this.directionChanged=direction!==this.positioningDirection,this.positioningDirection=direction,changed.has("anchor")&&changed.get("anchor")===this.observedDirectAnchor&&this.observedDirectAnchorWasConnected&&this.anchor?.isConnected!==!0&&this.open&&!this.resolveAnchor()&&this.forceClose({focusTrigger:!1}),changed.has("open")&&!this.open&&(this.anchorPositioned=!1),changed.has("open")&&this.open&&(this.popupHidden=!1),(changed.has("anchor")||changed.has("for"))&&(this.anchorPositioned=!1)}updated(changed){if(super.updated(changed),changed.has("trigger")&&(this.cancelPendingTransition(),!this.opensOn("hover")&&!this.opensOn("focus")&&(this.pinned=!1)),changed.has("showDelay")&&this.pendingDirection==="show"&&this.requestDelayedTransition(!0,!0),changed.has("hideDelay")&&this.pendingDirection==="hide"&&this.requestDelayedTransition(!1,!0),(changed.has("for")||changed.has("anchor")||changed.has("open"))&&this.syncAnchorIdentityObservation(),changed.has("for")&&this.syncInteractionTrigger(),this.directionChanged||changed.has("open")||changed.has("placement")||changed.has("positioningStrategy")||changed.has("hoverBridge")||changed.has("trigger")||changed.has("distance")||changed.has("skidding")||changed.has("for")||changed.has("anchor")||changed.has("arrow")||changed.has("withoutArrow")||changed.has("arrowPlacement")||changed.has("arrowPadding")||changed.has("popupRole")){if(this.open&&this.isConnected?this.positionPopup():changed.has("open")&&this.invalidatePositioning(),changed.has("open"))if(this.open)this.isConnected&&(this.startLightDismiss(),this.activatePopoverOverlay());else{this.pinned=!1,this.openedByInteraction=!1,this.cancelPendingTransition(),this.positionedAnchor=void 0,this.stopLightDismiss(),this.suppressTriggerFocusOpen=!0;try{this.overlayHandle?.deactivate()}finally{this.suppressTriggerFocusOpen=!1}this.overlayHandle=void 0,this.virtualAnchor=void 0,this.returnFocusTo=void 0,this.syncInteractionTrigger()}this.isConnected&&this.syncTriggerA11y()}}firstUpdated(changed){super.firstUpdated(changed);const slot=this.triggerSlotElement;queueMicrotask(()=>{collectInitialSlotAssignment(slot,s=>this.collectTriggerFromSlot(s))})}connectedCallback(){if(super.connectedCallback(),this.connectionSequence=++popoverConnectionSequence,this.addEventListener("focusin",this.onSurfaceFocusIn),this.addEventListener("focusout",this.onSurfaceFocusOut),this.updateBrowserDerivedState(()=>this.reconcileInitialPopoverPeers()),this.syncAnchorIdentityObservation(),this.id||(this.id=this.generatedHostId),this.observeHostId(),this.syncInteractionTrigger(),this.hasUpdated&&this.open){const wasPreviouslyActivated=this.overlayHandle?.isActive()===!0;this.startLightDismiss(),wasPreviouslyActivated?this.overlayHandle.resume():this.activatePopoverOverlay(),this.popupHidden=!1,this.positionPopup()}}disconnectedCallback(){this.stopAnchorIdentityObservation?.(),this.stopAnchorIdentityObservation=void 0,this.invalidatePositioning(),this.stopLightDismiss(),this.resetHostIdObserver(),this.overlayHandle?.suspend(),this.triggerElement?.removeEventListener("click",this.onTriggerClick),this.triggerElement?.removeEventListener("keydown",this.onExternalTriggerKeyDown),this.triggerElement&&this.unbindTriggerInteractions(this.triggerElement),this.releaseTriggerA11y(),this.triggerElement=void 0,this.removeEventListener("focusin",this.onSurfaceFocusIn),this.removeEventListener("focusout",this.onSurfaceFocusOut),this.cancelPendingTransition(),this.pinned=!1,this.openedByInteraction=!1,this.transitionToken++,this.cancelTransitionAnimation(),this.removeAttribute("data-closing"),this.popupHidden=!0,super.disconnectedCallback()}adoptedCallback(){super.adoptedCallback(),this.stopAnchorIdentityObservation?.(),this.stopAnchorIdentityObservation=void 0,this.resetHostIdObserver(),this.releaseTriggerA11y()}syncAnchorIdentityObservation(){this.stopAnchorIdentityObservation?.(),this.stopAnchorIdentityObservation=void 0;const directAnchor=this.open?this.anchor??void 0:void 0;if(this.observedDirectAnchor=directAnchor,this.observedDirectAnchorWasConnected=directAnchor?.isConnected===!0,!this.isConnected||!this.for&&!directAnchor)return;const onIdentityChange=()=>{const directAnchorRemoved=this.anchor===this.observedDirectAnchor&&this.observedDirectAnchorWasConnected&&this.observedDirectAnchor?.isConnected===!1;if(this.observedDirectAnchorWasConnected=this.observedDirectAnchor?.isConnected===!0,this.syncInteractionTrigger(),!this.open)return;const nextAnchor=this.resolveAnchor();if(directAnchorRemoved&&!nextAnchor){this.forceClose({focusTrigger:!1});return}nextAnchor!==this.positionedAnchor&&this.positionPopup()},observedRoots=new Set([this]);directAnchor&&directAnchor.getRootNode()!==this.getRootNode()&&observedRoots.add(directAnchor.isConnected?directAnchor:directAnchor.ownerDocument);const cleanups=[...observedRoots].map(root=>observeOverlayAnchorIdentity(root,onIdentityChange));this.stopAnchorIdentityObservation=()=>{for(const cleanup of cleanups)cleanup()}}resolveForTrigger(){if(!this.for)return;const target=this.getRootNode().getElementById?.(this.for)??null,HTMLElementCtor=target?.ownerDocument.defaultView?.HTMLElement;return target&&HTMLElementCtor&&target instanceof HTMLElementCtor?target:void 0}syncInteractionTrigger(){const next=this.virtualAnchor?void 0:this.slottedTrigger??this.resolveForTrigger();if(next===this.triggerElement){this.syncTriggerA11y();return}if(this.triggerElement?.removeEventListener("click",this.onTriggerClick),this.triggerElement?.removeEventListener("keydown",this.onExternalTriggerKeyDown),this.triggerElement&&this.unbindTriggerInteractions(this.triggerElement),this.triggerElement=next,this.triggerElement&&this.triggerElement!==this.slottedTrigger&&(this.triggerElement.addEventListener("click",this.onTriggerClick),this.triggerElement.addEventListener("keydown",this.onExternalTriggerKeyDown)),this.triggerElement&&this.bindTriggerInteractions(this.triggerElement),this.syncTriggerA11y(),this.open){if(!this.resolveAnchor()){this.forceClose({focusTrigger:!1});return}this.updatePopoverRestoreFocusTarget(),this.positionPopup()}}activatePopoverOverlay(){!this.isConnected||this.overlayHandle?.isActive()||(this.overlayHandle=activateNonmodalOverlay({host:this,panel:()=>this.renderRoot.querySelector('[part~="popup"]'),onEscape:()=>{this.hide()},restoreFocusTo:this.virtualAnchor?this.returnFocusTo??null:this.accessibleTrigger}))}updatePopoverRestoreFocusTarget(){const target=this.virtualAnchor?this.returnFocusTo??null:this.accessibleTrigger;if(this.overlayHandle?.isActive()){this.overlayHandle.updateRestoreFocusTo(target);return}this.activatePopoverOverlay()}showAt(rect,options){const normalizedRect=normalizeVirtualRect(rect);if(!normalizedRect)return;const previousAnchor=this.virtualAnchor,previousReturnFocusTo=this.returnFocusTo,bounds=new DOMRect(normalizedRect.x,normalizedRect.y,normalizedRect.width,normalizedRect.height);if(this.virtualAnchor={getBoundingClientRect:()=>bounds,contextElement:normalizedRect.contextElement},this.returnFocusTo=options?.returnFocusTo,this.syncInteractionTrigger(),this.open){this.updatePopoverRestoreFocusTarget(),this.positionPopup();return}this.show(),!this.open&&(this.virtualAnchor=previousAnchor,this.returnFocusTo=previousReturnFocusTo,this.syncInteractionTrigger())}resolveAnchor(){return resolveOverlayAnchor(this,{virtualAnchor:this.virtualAnchor,anchor:this.anchor,for:this.for,trigger:this.triggerElement})}positionPopup(){this.invalidatePositioning();const popup=this.renderRoot.querySelector('[part~="popup"]'),arrowElement=this.renderRoot.querySelector('[part~="arrow"]'),bridgeElement=this.renderRoot.querySelector('[part~="hover-bridge"]'),anchor=this.resolveAnchor();if(!this.open||!anchor||!popup){this.positionedAnchor=void 0,this.anchorPositioned=!1;return}anchor!==this.positionedAnchor&&(this.anchorPositioned=!1);const generation=this.positioningGeneration;this.positioningReady=new Promise(resolve=>{this.resolvePositioningReady=resolve}),this.startPositioning(generation,anchor,popup,arrowElement,bridgeElement)}invalidatePositioning(){this.positioningGeneration++,this.cleanup?.(),this.cleanup=void 0,this.resolvePositioningReady?.(!1),this.resolvePositioningReady=void 0}resolveCurrentPositioning(positioned){const resolve=this.resolvePositioningReady;this.resolvePositioningReady=void 0,resolve?.(positioned)}async startPositioning(generation,anchor,popup,arrowElement,bridgeElement){try{const{place}=await loadAnchoredOverlayRuntime();if(generation!==this.positioningGeneration||!this.open||!this.isConnected||this.resolveAnchor()!==anchor||this.renderRoot.querySelector('[part~="popup"]')!==popup)return;const cleanup=place(anchor,popup,{placement:rtlAwarePlacement(this.placement,this),strategy:resolveEffectivePositioningStrategy(this,this._positioningStrategy,this.defaultPositioningStrategy),offset:finiteNumber(this.distance,this.defaultDistance),skidding:finiteNumber(this.skidding,0),sync:this.positioningSync,arrow:this.rendersArrow&&arrowElement?arrowElement:void 0,arrowPadding:Math.max(0,finiteNumber(this.arrowPadding,0)),hoverBridge:this.rendersHoverBridge&&bridgeElement?bridgeElement:void 0,onPlaced:({placement,arrow})=>{if(generation!==this.positioningGeneration)return;const becamePositioned=!this.anchorPositioned||this.positionedAnchor!==anchor;this.positionedAnchor=anchor,this.anchorPositioned=!0;const side=applyOverlayArrow(arrowElement,{placement,coords:arrow,enabled:this.rendersArrow,arrowPlacement:this.arrowPlacement,arrowPadding:Math.max(0,finiteNumber(this.arrowPadding,0)),rtl:this.effectiveDirection==="rtl",sizeProperty:"--arrow-size",fallbackSizeProperty:"--lr-overlay-arrow-size"});side!==this.resolvedSide&&(this.resolvedSide=side),this.updateComplete.then(()=>{generation!==this.positioningGeneration||!this.open||this.resolveAnchor()!==anchor||(this.resolveCurrentPositioning(!0),becamePositioned&&this.onPopupPositioned())})}});generation!==this.positioningGeneration?cleanup():this.cleanup=cleanup}catch{if(generation!==this.positioningGeneration)return;this.resolveCurrentPositioning(!1),this.forceClose({focusTrigger:!1})}}syncTriggerA11y(){const trigger=this.triggerElement??null,popup=this.renderRoot?.querySelector('[part~="popup"]')??null,contribution={attributes:{"aria-haspopup":this.triggerPopupRole==="none"?null:this.triggerPopupRole,"aria-expanded":this.open?"true":"false"},controls:popup?[popup]:[]};this.triggerAria?this.triggerAria.update(trigger,contribution):this.triggerAria=acquireAriaOwnership(trigger,contribution);const accessibleTrigger=this.accessibleTrigger,distinctAccessibleTrigger=accessibleTrigger!==trigger?accessibleTrigger:null;this.accessibleTriggerAria?this.accessibleTriggerAria.update(distinctAccessibleTrigger,contribution):this.accessibleTriggerAria=acquireAriaOwnership(distinctAccessibleTrigger,contribution),this.overlayHandle?.isActive()&&!this.virtualAnchor&&this.overlayHandle.updateRestoreFocusTo(accessibleTrigger)}get accessibleTrigger(){return this.triggerElement?resolveAccessibleTrigger(this.triggerElement):null}releaseTriggerA11y(){this.accessibleTriggerAria?.release(),this.accessibleTriggerAria=void 0,this.triggerAria?.release(),this.triggerAria=void 0}collectTriggerFromSlot(slot){const next=slot.assignedElements({flatten:!0})[0];next!==this.slottedTrigger&&(this.slottedTrigger=next,this.syncInteractionTrigger())}requestInteractionClose(next){this.pinned||this.isWithinPopoverSurface(next)||this.hasFocusWithinSurface()||this.requestDelayedTransition(!1)}isWithinPopoverSurface(target){if(target===null||target.nodeType!==1)return!1;const element=target;if(composedContains(this,element))return!0;const popup=this.renderRoot?.querySelector('[part~="popup"]')??null;return popup&&composedContains(popup,element)?!0:this.triggerElement!=null&&composedContains(this.triggerElement,element)}hasFocusWithinSurface(){const active=activeElementIn(this.ownerDocument);return active===null||this.triggerElement&&composedContains(this.triggerElement,active)?!1:this.isWithinPopoverSurface(active)}requestDelayedTransition(next,deferImmediate=!1){if(this.cancelPendingTransition(),next&&!this.canOpen)return;const commit=()=>{next?(this.openedByInteraction=!0,this.show()):this.hide()},delay=Math.max(0,finiteDuration(next?this.showDelay:this.hideDelay,DEFAULT_TRIGGER_DELAY)),view=this.ownerDocument.defaultView;if(!view||delay<=0&&!deferImmediate){commit();return}this.pendingDirection=next?"show":"hide",this.delayTimerView=view;const timer=view.setTimeout(()=>{this.delayTimerView!==view||this.delayTimer!==timer||(this.delayTimer=void 0,this.delayTimerView=void 0,this.pendingDirection=void 0,commit())},delay);this.delayTimer=timer}cancelPendingTransition(){this.delayTimer!==void 0&&this.delayTimerView?.clearTimeout(this.delayTimer),this.delayTimer=void 0,this.delayTimerView=void 0,this.pendingDirection=void 0}triggerNeedsOwnFocusListeners(trigger){return!composedContains(this,trigger)}bindTriggerInteractions(trigger){trigger.addEventListener("mouseenter",this.onTriggerPointerEnter),trigger.addEventListener("mouseleave",this.onTriggerPointerLeave),this.triggerNeedsOwnFocusListeners(trigger)&&(trigger.addEventListener("focusin",this.onSurfaceFocusIn),trigger.addEventListener("focusout",this.onSurfaceFocusOut))}unbindTriggerInteractions(trigger){trigger.removeEventListener("mouseenter",this.onTriggerPointerEnter),trigger.removeEventListener("mouseleave",this.onTriggerPointerLeave),trigger.removeEventListener("focusin",this.onSurfaceFocusIn),trigger.removeEventListener("focusout",this.onSurfaceFocusOut)}startLightDismiss(){const nextDocument=this.ownerDocument;this.lightDismissDocument!==nextDocument&&(this.stopLightDismiss(),nextDocument.addEventListener("pointerdown",this.onDocumentPointer),this.lightDismissDocument=nextDocument)}stopLightDismiss(){this.lightDismissDocument?.removeEventListener("pointerdown",this.onDocumentPointer),this.lightDismissDocument=void 0}observeHostId(){const ownerDocument=this.ownerDocument;if(this.hostIdObserver&&this.hostIdObserverDocument===ownerDocument)return;this.resetHostIdObserver();const MutationObserverCtor=ownerDocument.defaultView?.MutationObserver;if(!MutationObserverCtor||!this.isConnected)return;const generation=this.hostIdObserverGeneration,observer=new MutationObserverCtor(()=>{this.hostIdObserver!==observer||this.hostIdObserverDocument!==ownerDocument||this.hostIdObserverGeneration!==generation||!this.isConnected||this.ownerDocument!==ownerDocument||(this.id||(this.id=this.generatedHostId),this.syncTriggerA11y())});this.hostIdObserver=observer,this.hostIdObserverDocument=ownerDocument,observer.observe(this,{attributes:!0,attributeFilter:["id"]})}resetHostIdObserver(){this.hostIdObserverGeneration+=1,this.hostIdObserver?.disconnect(),this.hostIdObserver=void 0,this.hostIdObserverDocument=void 0}setOpen(next){if(this._open===next)return;const old=this._open;this._open=next,setCustomState(this.popoverInternals,"open",next),this.requestUpdate("open",old)}syncOpenAttribute(){this.toggleAttribute("open",this._open)}show(){return this._open||!this.canOpen?Promise.resolve():this.transitionGate.request(!0,()=>{if(this.emitCancelableLifecycle("lr-show").defaultPrevented){this.syncOpenAttribute();return}if(!this.closePopoverPeers()){this.syncOpenAttribute();return}return this.cancelTransitionAnimation(),this.removeAttribute("data-closing"),this.setOpen(!0),this.settleTransition("lr-after-show")})}hide(options){return this._open?this.transitionGate.request(!1,()=>{if(this.emitCancelableLifecycle("lr-hide").defaultPrevented){this.syncOpenAttribute();return}return this.forceClose(options)}):Promise.resolve()}closePopoverPeers(){if(this.virtualAnchor||this.localName!==tag("popover"))return!0;const root=this.getRootNode();for(const peer of root.querySelectorAll(tag("popover")))if(!(peer===this||!peer.open||peer.virtualAnchor)&&(peer.hide({focusTrigger:!1}),peer.open))return!1;return!0}reconcileInitialPopoverPeers(){if(!this.isConnected||!this._open||this.virtualAnchor||this.localName!==tag("popover"))return;const peers=[...this.getRootNode().querySelectorAll(tag("popover"))].filter(peer=>peer.isConnected&&peer._open&&!peer.virtualAnchor&&peer.connectionSequence>0);if(peers.reduce((latest,peer)=>!latest||peer.connectionSequence>latest.connectionSequence?peer:latest,void 0)!==this){this.closeForInitialPeerReconciliation();return}for(const peer of peers)peer!==this&&peer.closeForInitialPeerReconciliation()}closeForInitialPeerReconciliation(){this._open&&(this.transitionToken++,this.cancelTransitionAnimation(),this.removeAttribute("data-closing"),this.invalidatePositioning(),this.stopLightDismiss(),this.overlayHandle?.deactivate({restoreFocus:!1}),this.overlayHandle=void 0,this.positionedAnchor=void 0,this.anchorPositioned=!1,this.returnFocusTo=void 0,this.setOpen(!1),this.syncOpenAttribute())}forceClose(options){return this._open?(options?.focusTrigger===!1&&(this.overlayHandle?.deactivate({restoreFocus:!1}),this.overlayHandle=void 0),this.cancelTransitionAnimation(),this.isConnected&&this.setAttribute("data-closing",""),this.setOpen(!1),this.settleTransition("lr-after-hide")):Promise.resolve()}cancelTransitionAnimation(){this.transitionAnimation?.cancel(),this.transitionAnimation=void 0}emitCancelableLifecycle(name){return this.emit(name,null,{cancelable:!0})}emitSettledLifecycle(name){return this.emit(name)}async settleTransition(event){const token=++this.transitionToken;if(await this.updateComplete,this.transitionToken===token){if(event==="lr-after-show"){for(;this.open&&!this.anchorPositioned;){const readiness=this.positioningReady,positioned=await readiness;if(this.transitionToken!==token)return;if(positioned)break;if(readiness===this.positioningReady)return}if(await this.updateComplete,this.transitionToken!==token)return}if(this.isConnected){const popup=this.renderRoot.querySelector('[part~="popup"]'),showing=event==="lr-after-show",offset="translateY(var(--lr-size-neg-0-25rem))",animation=popup?animateRegistered(this,popup,`${this.animationNamespace}.${showing?"show":"hide"}`,this.effectiveDirection,{keyframes:showing?[{opacity:0,transform:offset},{opacity:1,transform:"translateY(0)"}]:[{opacity:1,transform:"translateY(0)"},{opacity:0,transform:offset}],durationProperties:this.animationDurationProperties(showing),easingProperties:["--lr-easing-standard"]}):void 0;if(this.transitionAnimation=animation,await animation?.finished.catch(()=>{}),this.transitionToken!==token)return;this.cancelTransitionAnimation()}event==="lr-after-hide"&&(this.removeAttribute("data-closing"),this.popupHidden=!0,await this.updateComplete,this.transitionToken!==token)||this.emitSettledLifecycle(event)}}render(){const popupRole=this.popupSurfaceRole;return html`
|
|
2
2
|
<span part="trigger" @click=${this.onTriggerClick} @keydown=${this.onTriggerKeyDown}>
|
|
3
3
|
<slot name="trigger" @slotchange=${this.onTriggerSlotChange}></slot>
|
|
4
4
|
</span>
|
|
5
5
|
${this.rendersHoverBridge?html`<span part="hover-bridge" aria-hidden="true"></span>`:nothing}
|
|
6
6
|
<div id=${this.popupId} part=${this.popupPartNames} role=${popupRole??nothing}
|
|
7
7
|
aria-label=${popupRole?this.effectivePopupLabel:nothing}
|
|
8
|
+
?hidden=${this.popupHidden}
|
|
8
9
|
?data-hidden=${!this.open||!this.anchorPositioned} ?data-has-arrow=${this.rendersArrow}
|
|
9
10
|
@mouseenter=${this.onPopupPointerEnter} @mouseleave=${this.onPopupPointerLeave}
|
|
10
11
|
@click=${this.onPopupClick}>
|
|
11
12
|
<div part=${this.contentPartNames}>${this.renderPopupContent()}</div>
|
|
12
13
|
${this.rendersArrow?html`<span part="arrow popup__arrow arrow-${this.resolvedSide}"></span>`:nothing}
|
|
13
14
|
</div>
|
|
14
|
-
`}}__decorate([property({type:Boolean,reflect:!0})],LyraPopover.prototype,"open",null),__decorate([property({reflect:!0})],LyraPopover.prototype,"placement",void 0),__decorate([property({attribute:"positioning-strategy",reflect:!0,converter:POSITIONING_STRATEGY})],LyraPopover.prototype,"positioningStrategy",null),__decorate([property({type:Number})],LyraPopover.prototype,"distance",void 0),__decorate([property({type:Number})],LyraPopover.prototype,"skidding",void 0),__decorate([property({reflect:!0,converter:omittedEmptyStringConverter})],LyraPopover.prototype,"for",null),__decorate([property({attribute:!1})],LyraPopover.prototype,"anchor",void 0),__decorate([property({type:Boolean,converter:trueDefaultBooleanConverter,reflect:!0})],LyraPopover.prototype,"arrow",void 0),__decorate([property({type:Boolean,attribute:"without-arrow",reflect:!0})],LyraPopover.prototype,"withoutArrow",void 0),__decorate([property({attribute:"arrow-placement"})],LyraPopover.prototype,"arrowPlacement",void 0),__decorate([property({type:Number,attribute:"arrow-padding"})],LyraPopover.prototype,"arrowPadding",void 0),__decorate([property()],LyraPopover.prototype,"trigger",null),__decorate([property({type:Number,attribute:"show-delay"})],LyraPopover.prototype,"showDelay",void 0),__decorate([property({type:Number,attribute:"hide-delay"})],LyraPopover.prototype,"hideDelay",void 0),__decorate([property({type:Boolean,attribute:"hover-bridge",reflect:!0})],LyraPopover.prototype,"hoverBridge",void 0),__decorate([property({attribute:"aria-label"})],LyraPopover.prototype,"accessibleLabel",void 0),__decorate([property({attribute:"popup-role",converter:POPUP_ROLE})],LyraPopover.prototype,"popupRole",null),__decorate([property({type:Boolean,reflect:!0})],LyraPopover.prototype,"disabled",null),__decorate([query('slot[name="trigger"]')],LyraPopover.prototype,"triggerSlotElement",void 0),__decorate([state()],LyraPopover.prototype,"resolvedSide",void 0),__decorate([state()],LyraPopover.prototype,"anchorPositioned",void 0);export{LyraPopover};
|
|
15
|
+
`}}__decorate([property({type:Boolean,reflect:!0})],LyraPopover.prototype,"open",null),__decorate([property({reflect:!0})],LyraPopover.prototype,"placement",void 0),__decorate([property({attribute:"positioning-strategy",reflect:!0,converter:POSITIONING_STRATEGY})],LyraPopover.prototype,"positioningStrategy",null),__decorate([property({type:Number})],LyraPopover.prototype,"distance",void 0),__decorate([property({type:Number})],LyraPopover.prototype,"skidding",void 0),__decorate([property({reflect:!0,converter:omittedEmptyStringConverter})],LyraPopover.prototype,"for",null),__decorate([property({attribute:!1})],LyraPopover.prototype,"anchor",void 0),__decorate([property({type:Boolean,converter:trueDefaultBooleanConverter,reflect:!0})],LyraPopover.prototype,"arrow",void 0),__decorate([property({type:Boolean,attribute:"without-arrow",reflect:!0})],LyraPopover.prototype,"withoutArrow",void 0),__decorate([property({attribute:"arrow-placement"})],LyraPopover.prototype,"arrowPlacement",void 0),__decorate([property({type:Number,attribute:"arrow-padding"})],LyraPopover.prototype,"arrowPadding",void 0),__decorate([property()],LyraPopover.prototype,"trigger",null),__decorate([property({type:Number,attribute:"show-delay"})],LyraPopover.prototype,"showDelay",void 0),__decorate([property({type:Number,attribute:"hide-delay"})],LyraPopover.prototype,"hideDelay",void 0),__decorate([property({type:Boolean,attribute:"hover-bridge",reflect:!0})],LyraPopover.prototype,"hoverBridge",void 0),__decorate([property({attribute:"aria-label"})],LyraPopover.prototype,"accessibleLabel",void 0),__decorate([property({attribute:"popup-role",converter:POPUP_ROLE})],LyraPopover.prototype,"popupRole",null),__decorate([property({type:Boolean,reflect:!0})],LyraPopover.prototype,"disabled",null),__decorate([query('slot[name="trigger"]')],LyraPopover.prototype,"triggerSlotElement",void 0),__decorate([state()],LyraPopover.prototype,"resolvedSide",void 0),__decorate([state()],LyraPopover.prototype,"anchorPositioned",void 0),__decorate([state()],LyraPopover.prototype,"popupHidden",void 0);export{LyraPopover};
|
|
@@ -48,9 +48,12 @@ export type LyraTooltipTrigger='hover'|'focus'|'click'|'manual';export type{Lyra
|
|
|
48
48
|
* Open popovers, dropdowns and tooltips reposition when their effective host or inherited text direction changes, preserving open state and lifecycle events. Removing content safely omits tooltip fallback text.
|
|
49
49
|
*
|
|
50
50
|
* @customElement lr-tooltip
|
|
51
|
-
* @slot trigger -
|
|
52
|
-
*
|
|
53
|
-
* is
|
|
51
|
+
* @slot trigger - The highest-priority interaction/ARIA owner; a Lyra-original addition, mirroring
|
|
52
|
+
* `<lr-popover>`'s own `@slot trigger` -- `wa-tooltip` has no trigger slot of its own (its real
|
|
53
|
+
* anchor mechanism is the `for` attribute plus the unrelated `trigger` activation-mode
|
|
54
|
+
* attribute, both implemented below).
|
|
55
|
+
* @slot - Web Awesome shape: tooltip content, its only slot; Shoelace shape: the trigger when no
|
|
56
|
+
* named trigger is present.
|
|
54
57
|
* @slot content - Shoelace shape: tooltip content when the default slot owns the trigger.
|
|
55
58
|
* @event lr-show - The tooltip is about to open. Cancelable — `preventDefault()` keeps it closed.
|
|
56
59
|
* @event lr-after-show - The tooltip is open and its transition has finished.
|
|
@@ -161,7 +164,14 @@ arrowPlacement:LyraArrowPlacement;
|
|
|
161
164
|
arrowPadding:number;content:string;accessibleLabel:string;private triggerElement?;private slottedTriggerElement?;
|
|
162
165
|
/** True when the default slot is tooltip content (WA mode). False only when an explicit
|
|
163
166
|
* Shoelace content source makes the default slot unambiguously the trigger. */
|
|
164
|
-
private namedTriggerMode;private interactiveContent;private resolvedSide;private anchorPositioned;
|
|
167
|
+
private namedTriggerMode;private interactiveContent;private resolvedSide;private anchorPositioned;
|
|
168
|
+
/** Removes the settled-closed popup from layout (`[hidden]` -> `display:none`) so its stale
|
|
169
|
+
* placed coordinates and full content box stop contributing to whatever ancestor establishes
|
|
170
|
+
* its CSS containing block. Starts `true`, clears as soon as `open` becomes true -- before
|
|
171
|
+
* positioning runs, so the popup is still a real, measurable box -- and is set back only once
|
|
172
|
+
* the close transition has settled (`lr-after-hide`), preserving the existing visibility/
|
|
173
|
+
* opacity fade in the meantime. Mirrors `LyraSelect`'s `listboxHidden`. */
|
|
174
|
+
private popupHidden;private positionedAnchor?;private positioningDirection?;private directionChanged;private observedDirectAnchor?;private observedDirectAnchorWasConnected;private stopAnchorIdentityObservation?;private triggerAria?;private accessibleTriggerAria?;
|
|
165
175
|
/** The virtual anchor set by `showAt()`, taking priority over `for`/`trigger` for positioning
|
|
166
176
|
* while set. Cleared whenever the tooltip closes, so a later `open = true` with no fresh
|
|
167
177
|
* `showAt()` call reverts to plain trigger-based behavior. */
|
|
@@ -1,10 +1,11 @@
|
|
|
1
|
-
var __decorate=function(decorators,target,key,desc){var c=arguments.length,r=c<3?target:desc===null?desc=Object.getOwnPropertyDescriptor(target,key):desc,d;if(typeof Reflect=="object"&&typeof Reflect.decorate=="function")r=Reflect.decorate(decorators,target,key,desc);else for(var i=decorators.length-1;i>=0;i--)(d=decorators[i])&&(r=(c<3?d(r):c>3?d(target,key,r):d(target,key))||r);return c>3&&r&&Object.defineProperty(target,key,r),r};import{html,nothing}from"lit";import{property,state}from"lit/decorators.js";import{LyraElement}from"../../../internal/lyra-element.js";import{isAccessibilitySubtreeExcluded,isAccessibilityVisibilityHidden,nextId,resolveAccessibleTrigger}from"../../../internal/a11y.js";import{acquireAriaOwnership}from"../../../internal/aria-ownership.js";import{isActionableElement}from"../../../internal/focus-navigation.js";import{deferredPlaceReady as place,waitForDeferredPlacement}from"../../../internal/anchored-overlay-runtime.js";import{virtualAnchorFromRect}from"../../../internal/positioner-geometry.js";import{rtlAwarePlacement}from"../../../internal/rtl.js";import{activeElementIn}from"../../../internal/active-element.js";import{finiteDuration,finiteNumber}from"../../../internal/numbers.js";import{omittedEmptyStringConverter,optionalLiteralSetConverter,trueDefaultBooleanConverter}from"../../../internal/converters.js";import{resolveEffectivePositioningStrategy}from"../../../internal/positioning-strategy.js";import{activateNonmodalOverlay,composedContains}from"../../../internal/nonmodal-overlay-manager.js";import{animateRegistered}from"../../../internal/registered-animation.js";import{composedAccessibilityTextResult}from"../../../internal/accessibility-visibility.js";import{applyOverlayArrow}from"./overlay-arrow.js";import{normalizeVirtualRect,observeOverlayAnchorIdentity,OverlayTransitionGate,resolveOverlayAnchor}from"./overlay-shared.js";import{tooltipStyles}from"./overlay.styles.js";import{LYRA_DEFAULT_popover}from"../../../internal/default-strings.generated.js";const DEFAULT_SHOW_DELAY=150,DEFAULT_HIDE_DELAY=0,DEFAULT_DISTANCE=8,MAX_SHADOW_CONTENT_SCAN_FRAMES=4;function safelyComposedContains(container,candidate){try{return candidate?.nodeType===1&&composedContains(container,candidate)}catch{return!1}}const TOOLTIP_POSITIONING_STRATEGY=optionalLiteralSetConverter(["absolute","fixed"]);class LyraTooltip extends LyraElement{constructor(){super(...arguments),this._open=!1,this.trigger="hover focus",this.manual=!1,this.showDelay=150,this.hideDelay=0,this.placement="top",this.distance=8,this.skidding=0,this._for="",this.anchor=null,this.disabled=!1,this.arrow=!0,this.withoutArrow=!1,this.arrowPlacement="anchor",this.arrowPadding=0,this.content="",this.accessibleLabel="",this.namedTriggerMode=!0,this.interactiveContent=!1,this.resolvedSide="top",this.anchorPositioned=!1,this.directionChanged=!1,this.observedDirectAnchorWasConnected=!1,this.placementPending=!1,this.restoreFocusOnClose=!1,this.suppressTriggerFocusOpen=!1,this.openedByPointer=!1,this.tooltipId=nextId("tooltip"),this.descriptionId=nextId("tooltip-description"),this.triggerSyncGeneration=0,this.contentSlotListeners=new Set,this.shadowContentScanAttempts=0,this.transitionToken=0,this.transitionGate=new OverlayTransitionGate,this.onTriggerSlotChange=event=>{this.syncNamedTriggerMode();const slot=event.target;this.slottedTriggerElement=slot.assignedElements({flatten:!0})[0],this.syncInteractionTrigger()},this.onEnter=event=>{if(!this.disabled){if(this.syncTriggerA11y(),event.type==="focusin"){if(this.suppressTriggerFocusOpen||!this.opensOn("focus"))return}else if(!this.opensOn("hover"))return;event.type!=="focusin"&&(this.openedByPointer=!0),this.requestTransition(!0)}},this.onLeave=event=>{if(event.type==="focusout"?!this.opensOn("focus"):!this.opensOn("hover"))return;const next=event.relatedTarget;next!==null&&next.nodeType===1&&this.triggerElement&&composedContains(this.triggerElement,next)||this.interactiveContent&&this.isPopupTarget(next)||this.requestTransition(!1)},this.onTriggerClick=()=>{this.disabled||this.opensOn("click")&&(this.syncTriggerA11y(),this._open?this.hide():this.show())},this.onPopupEnter=()=>{!this.interactiveContent||this.isManual||(this.cancelPendingTransition(),this.show())},this.onPopupLeave=event=>{if(!this.interactiveContent||this.isManual)return;const next=event.relatedTarget;next!==null&&next.nodeType===1&&(this.triggerElement&&composedContains(this.triggerElement,next)||this.isPopupTarget(next))||this.requestTransition(!1)},this.onContentSlotChange=event=>{event.target?.localName==="slot"&&this.updateInteractiveContent()},this.onTriggerKeyDown=event=>{this.isManual||!this.open||event.key!=="Escape"||!this.overlayHandle?.isTopmost()||(event.preventDefault(),this.hide())}}static{this.defaultStrings={...super.defaultStrings,popover:LYRA_DEFAULT_popover}}static{this.styles=[LyraElement.styles,tooltipStyles]}get open(){return this._open}set open(next){const normalized=!!next;if(normalized||this.cancelPendingTransition(),normalized!==this._open){if(!this.hasUpdated){this.applyOpenState(normalized);return}normalized?this.show():this.hide()}}get for(){return this._for}set for(next){this._for=next??""}get positioningStrategy(){return this._positioningStrategy??"absolute"}set positioningStrategy(next){const normalized=TOOLTIP_POSITIONING_STRATEGY.normalize(next)??"absolute",old=this.positioningStrategy;this._positioningStrategy=normalized,normalized!==old&&(this.requestUpdate("positioningStrategy",old),old==="fixed"!=(normalized==="fixed")&&this.requestUpdate("hoist",old==="fixed"))}get hoist(){return this.positioningStrategy==="fixed"}set hoist(next){this.positioningStrategy=next?"fixed":"absolute"}get rendersArrow(){return this.arrow&&!this.withoutArrow}get activeContentSlot(){const selector=this.namedTriggerMode?'[part~="body"] slot:not([name])':'[part~="body"] slot[name="content"]';return(this.renderRoot??this.shadowRoot)?.querySelector(selector)??null}syncNamedTriggerMode(schedule=!0){const children=Array.from(this.children),hasNamedTrigger=children.some(child=>child.getAttribute("slot")==="trigger"),hasShoelaceContent=(this.content??"").length>0||children.some(child=>child.getAttribute("slot")==="content"),next=hasNamedTrigger||!hasShoelaceContent;if(next===this.namedTriggerMode)return;const old=this.namedTriggerMode;this.namedTriggerMode=next,schedule&&this.hasUpdated&&this.requestUpdate("namedTriggerMode",old)}get triggerKeywords(){return new Set(String(this.trigger??"").trim().split(/\s+/).filter(Boolean))}get isManual(){const keywords=this.triggerKeywords;return this.manual||keywords.size===0||keywords.has("manual")}opensOn(keyword){return!this.isManual&&this.triggerKeywords.has(keyword)}willUpdate(changed){super.willUpdate(changed);const direction=this.effectiveDirection;this.directionChanged=direction!==this.positioningDirection,this.positioningDirection=direction,this.syncNamedTriggerMode(!1),(changed.has("manual")||changed.has("trigger"))&&this.isManual&&this.cancelPendingTransition(),changed.has("disabled")&&this.disabled&&(this.cancelPendingTransition(),this._open&&(this.hasUpdated?this.hide():this.applyOpenState(!1))),changed.has("anchor")&&changed.get("anchor")===this.observedDirectAnchor&&this.observedDirectAnchorWasConnected&&this.anchor?.isConnected!==!0&&this.open&&!this.resolveAnchor()&&this.forceClose(),changed.has("showDelay")&&this.pendingDirection==="show"&&this.requestTransition(!0),changed.has("hideDelay")&&this.pendingDirection==="hide"&&this.requestTransition(!1),changed.has("for")&&this.syncInteractionTrigger(),changed.has("open")&&!this.open&&(this.anchorPositioned=!1),(changed.has("anchor")||changed.has("for"))&&(this.anchorPositioned=!1)}updated(changed){if(super.updated(changed),(changed.has("for")||changed.has("anchor")||changed.has("open"))&&this.syncAnchorIdentityObservation(),this.directionChanged||changed.has("open")||changed.has("placement")||changed.has("distance")||changed.has("skidding")||changed.has("for")||changed.has("anchor")||changed.has("positioningStrategy")||changed.has("arrow")||changed.has("withoutArrow")||changed.has("arrowPlacement")||changed.has("arrowPadding")||changed.has("interactiveContent")){if(this.cleanup?.(),this.cleanup=void 0,this.open&&this.isConnected&&this.position(),changed.has("open"))if(this.open)this.updateInteractiveContent(),this.isConnected&&this.requiresOverlayManager&&this.activateTooltipOverlay();else{this.positionedAnchor=void 0;const restoreFocus=this.restoreFocusOnClose;this.suppressTriggerFocusOpen=restoreFocus;try{this.overlayHandle?.deactivate({restoreFocus})}finally{this.suppressTriggerFocusOpen=!1}this.overlayHandle=void 0,this.restoreFocusOnClose=!1,this.virtualAnchor=void 0,this.returnFocusTo=void 0,this.syncInteractionTrigger()}else changed.has("interactiveContent")&&this.open&&this.isConnected&&(this.requiresOverlayManager?this.activateTooltipOverlay():(this.overlayHandle?.deactivate({restoreFocus:!1}),this.overlayHandle=void 0));this.syncTriggerA11y()}(changed.has("content")||changed.has("accessibleLabel"))&&this.updateDescriptionProxy()}connectedCallback(){super.connectedCallback();const triggerSyncGeneration=++this.triggerSyncGeneration,triggerSyncDocument=this.ownerDocument;this.syncAnchorIdentityObservation(),this.ensureDescriptionProxy(),this.contentObserver?.disconnect();const MutationObserverCtor=this.ownerDocument.defaultView?.MutationObserver;this.contentObserver=MutationObserverCtor?new MutationObserverCtor(()=>{this.syncNamedTriggerMode(),this.updateInteractiveContent()}):void 0,this.updateInteractiveContent(),this.syncInteractionTrigger(),this.updateComplete.then(()=>{if(triggerSyncGeneration!==this.triggerSyncGeneration||!this.isConnected||this.ownerDocument!==triggerSyncDocument)return;const slot=this.renderRoot.querySelector('[part="trigger"] > slot');this.slottedTriggerElement=slot?.assignedElements({flatten:!0})[0],this.syncInteractionTrigger()}),this.hasUpdated&&this.open&&(this.position(),this.requiresOverlayManager&&(this.overlayHandle?.isActive()?this.overlayHandle.resume():this.activateTooltipOverlay()))}disconnectedCallback(){this.triggerSyncGeneration++,this.stopAnchorIdentityObservation?.(),this.stopAnchorIdentityObservation=void 0,this.cancelPendingTransition(),this.cleanup?.(),this.cleanup=void 0,this.overlayHandle?.suspend(),this.triggerElement&&this.unbindTrigger(this.triggerElement),this.releaseTriggerA11y(),this.triggerElement=void 0,this.contentObserver?.disconnect(),this.contentObserver=void 0,this.stopLabelReferenceIdentityObservation?.(),this.stopLabelReferenceIdentityObservation=void 0,this.clearContentSlotListeners(),this.cancelShadowContentScan(),this.transitionToken++,this.cancelTransitionAnimation(),this.removeAttribute("data-closing"),super.disconnectedCallback()}adoptedCallback(){super.adoptedCallback(),this.triggerSyncGeneration++,this.stopAnchorIdentityObservation?.(),this.stopAnchorIdentityObservation=void 0,this.cancelPendingTransition(),this.cancelShadowContentScan(),this.contentObserver?.disconnect(),this.contentObserver=void 0,this.stopLabelReferenceIdentityObservation?.(),this.stopLabelReferenceIdentityObservation=void 0,this.clearContentSlotListeners(),this.releaseTriggerA11y()}syncAnchorIdentityObservation(){this.stopAnchorIdentityObservation?.(),this.stopAnchorIdentityObservation=void 0;const directAnchor=this.open?this.anchor??void 0:void 0;if(this.observedDirectAnchor=directAnchor,this.observedDirectAnchorWasConnected=directAnchor?.isConnected===!0,!this.isConnected||!this.for&&!directAnchor)return;const onIdentityChange=()=>{const directAnchorRemoved=this.anchor===this.observedDirectAnchor&&this.observedDirectAnchorWasConnected&&this.observedDirectAnchor?.isConnected===!1;if(this.observedDirectAnchorWasConnected=this.observedDirectAnchor?.isConnected===!0,this.syncInteractionTrigger(),!this.open)return;const nextAnchor=this.resolveAnchor();if(directAnchorRemoved&&!nextAnchor){this.forceClose();return}nextAnchor!==this.positionedAnchor&&this.position()},observedRoots=new Set([this]);directAnchor&&directAnchor.getRootNode()!==this.getRootNode()&&observedRoots.add(directAnchor.isConnected?directAnchor:directAnchor.ownerDocument);const cleanups=[...observedRoots].map(root=>observeOverlayAnchorIdentity(root,onIdentityChange));this.stopAnchorIdentityObservation=()=>{for(const cleanup of cleanups)cleanup()}}resolveForTrigger(){if(!this.for)return;const target=this.getRootNode().getElementById?.(this.for)??null,HTMLElementCtor=target?.ownerDocument.defaultView?.HTMLElement;return target&&HTMLElementCtor&&target instanceof HTMLElementCtor?target:void 0}syncInteractionTrigger(){const next=this.virtualAnchor?void 0:this.slottedTriggerElement??this.resolveForTrigger();this.adoptTrigger(next)}activateTooltipOverlay(){if(!this.isConnected)return;const restoreFocusTarget=this.virtualAnchor?this.returnFocusTo??null:this.accessibleTrigger;if(this.overlayHandle?.isActive()){this.overlayHandle.updateRestoreFocusTo(restoreFocusTarget);return}this.overlayHandle=activateNonmodalOverlay({host:this,panel:()=>this.renderRoot.querySelector('[part~="popup"]'),onEscape:()=>this.hide({restoreFocus:this.shouldRestoreFocusAfterEscape()}),restoreFocusTo:restoreFocusTarget}),this.overlayHandle.focusAutofocus()}shouldRestoreFocusAfterEscape(){if(this.virtualAnchor)return this.returnFocusTo!==void 0;const active=activeElementIn(this.ownerDocument);return safelyComposedContains(this,active)}get requiresOverlayManager(){return this.open}showAt(rect,options){const normalizedRect=normalizeVirtualRect(rect);if(!normalizedRect)return;const previousAnchor=this.virtualAnchor,previousReturnFocusTo=this.returnFocusTo;if(this.virtualAnchor=virtualAnchorFromRect(normalizedRect),this.returnFocusTo=options?.returnFocusTo,this.syncInteractionTrigger(),this.open){this.activateTooltipOverlay(),this.position();return}this.show(),!this.open&&(this.virtualAnchor=previousAnchor,this.returnFocusTo=previousReturnFocusTo,this.syncInteractionTrigger())}show(){return this.cancelPendingTransition(),this.disabled||this._open?Promise.resolve():this.transitionGate.request(!0,()=>{if(this.emit("lr-show",null,{cancelable:!0}).defaultPrevented){this.syncOpenAttribute();return}return this.cancelTransitionAnimation(),this.removeAttribute("data-closing"),this.applyOpenState(!0),this.settleTransition("lr-after-show")})}hide(options){return this.cancelPendingTransition(),this._open?this.transitionGate.request(!1,()=>{if(this.emit("lr-hide",null,{cancelable:!0}).defaultPrevented){this.syncOpenAttribute();return}return options?.restoreFocus&&(this.restoreFocusOnClose=!0),this.cancelTransitionAnimation(),this.isConnected&&this.setAttribute("data-closing",""),this.applyOpenState(!1),this.settleTransition("lr-after-hide")}):Promise.resolve()}forceClose(){return this.cancelPendingTransition(),this._open?(this.cancelTransitionAnimation(),this.isConnected&&this.setAttribute("data-closing",""),this.applyOpenState(!1),this.settleTransition("lr-after-hide")):Promise.resolve()}applyOpenState(next){const old=this._open;this._open=next,next||(this.cancelShadowContentScan(),this.placementPending=!1),next||(this.openedByPointer=!1),this.requestUpdate("open",old)}syncOpenAttribute(){this.toggleAttribute("open",this._open)}cancelTransitionAnimation(){this.transitionAnimation?.cancel(),this.transitionAnimation=void 0}async settleTransition(event){const token=++this.transitionToken;if(await this.updateComplete,this.transitionToken===token){if(event==="lr-after-show"){const positioned=await waitForDeferredPlacement(()=>this.cleanup);if(this.transitionToken!==token||!this.open)return;if(!positioned){await this.forceClose();return}if(await this.updateComplete,this.transitionToken!==token)return}if(this.isConnected){const popup=this.renderRoot.querySelector('[part~="popup"]'),showing=event==="lr-after-show",animation=popup?animateRegistered(this,popup,`tooltip.${showing?"show":"hide"}`,this.effectiveDirection,{keyframes:showing?[{opacity:0},{opacity:1}]:[{opacity:1},{opacity:0}],durationProperties:["--lr-transition-fast","--lr-duration-fast"],easingProperties:["--lr-easing-standard"]}):void 0;if(this.transitionAnimation=animation,await animation?.finished.catch(()=>{}),this.transitionToken!==token)return;this.cancelTransitionAnimation()}event==="lr-after-hide"&&this.removeAttribute("data-closing"),this.emit(event)}}resolveAnchor(){return resolveOverlayAnchor(this,{virtualAnchor:this.virtualAnchor,anchor:this.anchor,for:this.for,trigger:this.triggerElement})}position(){this.cleanup?.(),this.cleanup=void 0;const popup=this.renderRoot.querySelector('[part~="popup"]'),arrowElement=this.renderRoot.querySelector('[part~="arrow"]'),anchor=this.resolveAnchor();if(!this.open||!anchor||!popup){this.positionedAnchor=void 0,this.anchorPositioned=!1,this.placementPending=!1;return}if(anchor!==this.positionedAnchor&&(this.anchorPositioned=!1),this.open&&anchor&&popup){const arrowPadding=Math.max(0,finiteNumber(this.arrowPadding,0));this.placementPending=!0,this.cleanup=place(anchor,popup,{placement:rtlAwarePlacement(this.placement,this),strategy:resolveEffectivePositioningStrategy(this,this._positioningStrategy,"absolute"),offset:finiteNumber(this.distance,DEFAULT_DISTANCE),skidding:finiteNumber(this.skidding,0),arrow:this.rendersArrow&&arrowElement?arrowElement:void 0,arrowPadding,onPlaced:({placement,arrow})=>{this.placementPending=!1,this.positionedAnchor=anchor,this.anchorPositioned=!0;const side=applyOverlayArrow(arrowElement,{placement,coords:arrow,enabled:this.rendersArrow,arrowPlacement:this.arrowPlacement,arrowPadding,rtl:this.effectiveDirection==="rtl",sizeProperty:"--arrow-size",fallbackSizeProperty:"--lr-tooltip-arrow-size"});side!==this.resolvedSide&&(this.resolvedSide=side)}})}}syncTriggerA11y(){const trigger=this.triggerElement??null,proxy=this.open?this.descriptionProxy:void 0,contribution={descriptions:proxy?[proxy]:[]};this.triggerAria?this.triggerAria.update(trigger,contribution):this.triggerAria=acquireAriaOwnership(trigger,contribution);const accessibleTrigger=this.accessibleTrigger,distinctAccessibleTrigger=accessibleTrigger!==trigger?accessibleTrigger:null;this.accessibleTriggerAria?this.accessibleTriggerAria.update(distinctAccessibleTrigger,contribution):this.accessibleTriggerAria=acquireAriaOwnership(distinctAccessibleTrigger,contribution),this.overlayHandle?.isActive()&&!this.virtualAnchor&&this.overlayHandle.updateRestoreFocusTo(accessibleTrigger)}get accessibleTrigger(){return this.triggerElement?resolveAccessibleTrigger(this.triggerElement):null}releaseTriggerA11y(){this.accessibleTriggerAria?.release(),this.accessibleTriggerAria=void 0,this.triggerAria?.release(),this.triggerAria=void 0}requestTransition(next){if(this.cancelPendingTransition(),this.disabled)return;const delay=this.interactionDelay(next);if(delay<=0){next?this.show():this.hide();return}this.pendingDirection=next?"show":"hide";const view=this.ownerDocument.defaultView;if(!view){this.pendingDirection=void 0;return}this.timerView=view;const timer=view.setTimeout(()=>{this.timerView!==view||this.timer!==timer||(this.timer=void 0,this.timerView=void 0,this.pendingDirection=void 0,next?this.show():this.hide())},delay);this.timer=timer}interactionDelay(showing){const value=showing?this.showDelay:this.hideDelay,fallback=showing?DEFAULT_SHOW_DELAY:DEFAULT_HIDE_DELAY,attribute=showing?"show-delay":"hide-delay";if(this.hasAttribute(attribute)||value!==fallback)return finiteDuration(value,fallback);const property2=showing?"--show-delay":"--hide-delay",match=(this.ownerDocument.defaultView?.getComputedStyle(this).getPropertyValue(property2).trim()??"").match(/^(-?(?:\d+\.?\d*|\.\d+))(ms|s)$/i);if(!match)return fallback;const amount=Number(match[1]),milliseconds=match[2]?.toLowerCase()==="s"?amount*1e3:amount;return finiteDuration(milliseconds,fallback)}cancelPendingTransition(){this.timer!==void 0&&this.timerView?.clearTimeout(this.timer),this.timer=void 0,this.timerView=void 0,this.pendingDirection=void 0}bindTrigger(trigger){trigger.addEventListener("mouseenter",this.onEnter),trigger.addEventListener("mouseleave",this.onLeave),trigger.addEventListener("focusin",this.onEnter),trigger.addEventListener("focusout",this.onLeave),trigger.addEventListener("click",this.onTriggerClick),trigger.addEventListener("keydown",this.onTriggerKeyDown)}unbindTrigger(trigger){trigger.removeEventListener("mouseenter",this.onEnter),trigger.removeEventListener("mouseleave",this.onLeave),trigger.removeEventListener("focusin",this.onEnter),trigger.removeEventListener("focusout",this.onLeave),trigger.removeEventListener("click",this.onTriggerClick),trigger.removeEventListener("keydown",this.onTriggerKeyDown)}isTriggerHeld(trigger){try{if(trigger.matches(":hover"))return!0}catch{}const active=activeElementIn(trigger.ownerDocument);return safelyComposedContains(trigger,active)}adoptTrigger(next){if(next===this.triggerElement){this.syncTriggerA11y();return}const hadTrigger=this.triggerElement!==void 0;if(this.cancelPendingTransition(),this.triggerElement&&this.unbindTrigger(this.triggerElement),this.triggerElement=next,!this.triggerElement){this.syncTriggerA11y(),hadTrigger&&this.open&&!this.resolveAnchor()&&this.forceClose();return}this.bindTrigger(this.triggerElement),this.syncTriggerA11y(),hadTrigger&&this._open&&this.openedByPointer&&!this.isTriggerHeld(this.triggerElement)&&this.forceClose(),this.open&&this.position(),this.open&&this.interactiveContent&&this.activateTooltipOverlay()}isPopupTarget(target){if(target===null||target.nodeType!==1)return!1;const element=target,slot=this.activeContentSlot;return this.renderRoot.querySelector('[part~="popup"]')?.contains(element)===!0||slot?.assignedElements({flatten:!0}).some(root=>composedContains(root,element))===!0}clearContentSlotListeners(){for(const slot of this.contentSlotListeners)slot.removeEventListener("slotchange",this.onContentSlotChange);this.contentSlotListeners.clear()}syncContentSlotListeners(slots){const activeSlot=this.activeContentSlot;for(const slot of this.contentSlotListeners)slots.has(slot)&&slot!==activeSlot||(slot.removeEventListener("slotchange",this.onContentSlotChange),this.contentSlotListeners.delete(slot));for(const slot of slots)slot===activeSlot||this.contentSlotListeners.has(slot)||(slot.addEventListener("slotchange",this.onContentSlotChange),this.contentSlotListeners.add(slot))}inspectContent(){const snapshot={actionable:!1,assigned:!1,awaitingShadowRoot:!1,labelReferenceRoots:new Set,text:"",externalRoots:new Set,shadowRoots:new Set,forwardingSlots:new Set,composedAncestors:new Set},activeSlot=this.activeContentSlot;if(!activeSlot)return snapshot;snapshot.assigned=activeSlot.assignedNodes().length>0;const popup=this.renderRoot.querySelector('[part~="popup"]'),bypassClosedVisibility=popup?.hasAttribute("data-hidden")===!0||this.placementPending,previousVisibility=popup?.style.getPropertyValue("visibility")??"",previousVisibilityPriority=popup?.style.getPropertyPriority("visibility")??"";if(popup&&bypassClosedVisibility){const hostVisibility=this.ownerDocument.defaultView?.getComputedStyle(this).visibility??"visible";popup.style.setProperty("visibility",hostVisibility)}try{const visitedContentElements=new Set,accessibilityText=composedAccessibilityTextResult(activeSlot,{shouldPruneNode:node=>{if(node.getRootNode()!==this.renderRoot&&!this.contains(node)&&snapshot.externalRoots.add(node),node.nodeType!==1)return!1;const element=node;return visitedContentElements.add(element),!isAccessibilitySubtreeExcluded(element)&&!isAccessibilityVisibilityHidden(element)&&isActionableElement(element)&&(snapshot.actionable=!0),element.localName==="slot"&&snapshot.forwardingSlots.add(element),element.shadowRoot?snapshot.shadowRoots.add(element.shadowRoot):element.localName.includes("-")&&(snapshot.awaitingShadowRoot=!0),!1},isSubtreeExcluded:element=>(!visitedContentElements.has(element)&&element!==this&&snapshot.composedAncestors.add(element),isAccessibilitySubtreeExcluded(element))});snapshot.text=accessibilityText.text.replace(/\s+/g," ").trim();for(const root of accessibilityText.labelReferenceRoots)snapshot.labelReferenceRoots.add(root);for(const reference of accessibilityText.referencedElements)snapshot.externalRoots.add(reference)}finally{popup&&bypassClosedVisibility&&(previousVisibility?popup.style.setProperty("visibility",previousVisibility,previousVisibilityPriority):popup.style.removeProperty("visibility"))}return snapshot}observeContentNode(node){if(this.contentObserver){if(node.nodeType===3){this.contentObserver.observe(node,{characterData:!0});return}node.nodeType!==1&&node.nodeType!==11||this.contentObserver.observe(node,{attributes:!0,attributeFilter:["aria-hidden","aria-label","aria-labelledby","alt","class","contenteditable","hidden","href","inert","open","role","slot","style","tabindex"],childList:!0,characterData:!0,subtree:!0})}}bindContentObservation(snapshot){if(this.stopLabelReferenceIdentityObservation?.(),this.stopLabelReferenceIdentityObservation=void 0,this.isConnected&&snapshot.labelReferenceRoots.size>0){const cleanups=[...snapshot.labelReferenceRoots].map(root=>observeOverlayAnchorIdentity(root,()=>this.updateInteractiveContent()));this.stopLabelReferenceIdentityObservation=()=>{for(const cleanup of cleanups)cleanup()}}if(this.contentObserver){this.contentObserver.disconnect();for(const ancestor of snapshot.composedAncestors)ancestor===this||ancestor.getRootNode()===this.renderRoot||snapshot.externalRoots.has(ancestor)||this.contentObserver.observe(ancestor,{attributes:!0,attributeFilter:["aria-hidden","class","hidden","inert","style"]});this.observeContentNode(this);for(const root of snapshot.externalRoots)this.observeContentNode(root);for(const root of snapshot.shadowRoots)this.observeContentNode(root)}}updateInteractiveContent(fromShadowContentScan=!1){fromShadowContentScan||(this.shadowContentScanAttempts=0);const snapshot=this.inspectContent();this.interactiveContent=snapshot.actionable,this.syncContentSlotListeners(snapshot.forwardingSlots),this.bindContentObservation(snapshot),this.scheduleShadowContentScan(snapshot.awaitingShadowRoot),this.updateDescriptionProxy(snapshot.text,snapshot.assigned)}scheduleShadowContentScan(awaitingShadowRoot){if(this.cancelShadowContentScan(!1),!awaitingShadowRoot||!this.open||!this.isConnected||this.shadowContentScanAttempts>=MAX_SHADOW_CONTENT_SCAN_FRAMES)return;const view=this.ownerDocument.defaultView;view&&(this.shadowContentScanView=view,this.shadowContentScanFrame=view.requestAnimationFrame(()=>{this.shadowContentScanFrame=void 0,this.shadowContentScanView=void 0,this.shadowContentScanAttempts++,this.updateInteractiveContent(!0)}))}cancelShadowContentScan(resetAttempts=!0){this.shadowContentScanFrame!==void 0&&this.shadowContentScanView?.cancelAnimationFrame(this.shadowContentScanFrame),this.shadowContentScanFrame=void 0,this.shadowContentScanView=void 0,resetAttempts&&(this.shadowContentScanAttempts=0)}ensureDescriptionProxy(){this.descriptionProxy||(this.descriptionProxy=this.ownerDocument.createElement("span"),this.descriptionProxy.id=this.descriptionId,this.descriptionProxy.slot="__lr-tooltip-description",this.descriptionProxy.hidden=!0,this.descriptionProxy.dataset.lyraTooltipDescription=""),this.descriptionProxy.parentElement!==this&&this.append(this.descriptionProxy),this.updateDescriptionProxy()}updateDescriptionProxy(contentText,assigned){if(!this.descriptionProxy)return;const hostLabel=this.getAttribute("aria-label"),snapshot=contentText===void 0||assigned===void 0?this.inspectContent():void 0,visibleContent=contentText??snapshot?.text??"",hasAssignment=assigned??snapshot?.assigned??!1,description=hostLabel!==null?hostLabel.trim():(this.accessibleLabel||visibleContent||(hasAssignment?"":this.content)).trim();this.descriptionProxy.textContent!==description&&(this.descriptionProxy.textContent=description)}render(){const hostLabel=this.getAttribute("aria-label"),propertyLabel=this.accessibleLabel??"",hasExplicitLabel=hostLabel!==null||propertyLabel.length>0,label=hostLabel!==null?hostLabel:propertyLabel,popupLabel=this.interactiveContent?hasExplicitLabel?label:this.localize("popover"):hasExplicitLabel?label:nothing;return html`
|
|
1
|
+
var __decorate=function(decorators,target,key,desc){var c=arguments.length,r=c<3?target:desc===null?desc=Object.getOwnPropertyDescriptor(target,key):desc,d;if(typeof Reflect=="object"&&typeof Reflect.decorate=="function")r=Reflect.decorate(decorators,target,key,desc);else for(var i=decorators.length-1;i>=0;i--)(d=decorators[i])&&(r=(c<3?d(r):c>3?d(target,key,r):d(target,key))||r);return c>3&&r&&Object.defineProperty(target,key,r),r};import{html,nothing}from"lit";import{property,state}from"lit/decorators.js";import{LyraElement}from"../../../internal/lyra-element.js";import{isAccessibilitySubtreeExcluded,isAccessibilityVisibilityHidden,nextId,resolveAccessibleTrigger}from"../../../internal/a11y.js";import{acquireAriaOwnership}from"../../../internal/aria-ownership.js";import{isActionableElement}from"../../../internal/focus-navigation.js";import{deferredPlaceReady as place,waitForDeferredPlacement}from"../../../internal/anchored-overlay-runtime.js";import{virtualAnchorFromRect}from"../../../internal/positioner-geometry.js";import{rtlAwarePlacement}from"../../../internal/rtl.js";import{activeElementIn,composedParentElement}from"../../../internal/active-element.js";import{finiteDuration,finiteNumber}from"../../../internal/numbers.js";import{omittedEmptyStringConverter,optionalLiteralSetConverter,trueDefaultBooleanConverter}from"../../../internal/converters.js";import{resolveEffectivePositioningStrategy}from"../../../internal/positioning-strategy.js";import{activateNonmodalOverlay,composedContains}from"../../../internal/nonmodal-overlay-manager.js";import{animateRegistered}from"../../../internal/registered-animation.js";import{composedAccessibilityTextResult}from"../../../internal/accessibility-visibility.js";import{applyOverlayArrow}from"./overlay-arrow.js";import{normalizeVirtualRect,observeOverlayAnchorIdentity,OverlayTransitionGate,resolveOverlayAnchor}from"./overlay-shared.js";import{tooltipStyles}from"./overlay.styles.js";import{LYRA_DEFAULT_popover}from"../../../internal/default-strings.generated.js";const DEFAULT_SHOW_DELAY=150,DEFAULT_HIDE_DELAY=0,DEFAULT_DISTANCE=8,MAX_SHADOW_CONTENT_SCAN_FRAMES=4;function safelyComposedContains(container,candidate){try{return candidate?.nodeType===1&&composedContains(container,candidate)}catch{return!1}}const TOOLTIP_POSITIONING_STRATEGY=optionalLiteralSetConverter(["absolute","fixed"]);class LyraTooltip extends LyraElement{constructor(){super(...arguments),this._open=!1,this.trigger="hover focus",this.manual=!1,this.showDelay=150,this.hideDelay=0,this.placement="top",this.distance=8,this.skidding=0,this._for="",this.anchor=null,this.disabled=!1,this.arrow=!0,this.withoutArrow=!1,this.arrowPlacement="anchor",this.arrowPadding=0,this.content="",this.accessibleLabel="",this.namedTriggerMode=!0,this.interactiveContent=!1,this.resolvedSide="top",this.anchorPositioned=!1,this.popupHidden=!0,this.directionChanged=!1,this.observedDirectAnchorWasConnected=!1,this.placementPending=!1,this.restoreFocusOnClose=!1,this.suppressTriggerFocusOpen=!1,this.openedByPointer=!1,this.tooltipId=nextId("tooltip"),this.descriptionId=nextId("tooltip-description"),this.triggerSyncGeneration=0,this.contentSlotListeners=new Set,this.shadowContentScanAttempts=0,this.transitionToken=0,this.transitionGate=new OverlayTransitionGate,this.onTriggerSlotChange=event=>{this.syncNamedTriggerMode();const slot=event.target;this.slottedTriggerElement=slot.assignedElements({flatten:!0})[0],this.syncInteractionTrigger()},this.onEnter=event=>{if(!this.disabled){if(this.syncTriggerA11y(),event.type==="focusin"){if(this.suppressTriggerFocusOpen||!this.opensOn("focus"))return}else if(!this.opensOn("hover"))return;event.type!=="focusin"&&(this.openedByPointer=!0),this.requestTransition(!0)}},this.onLeave=event=>{if(event.type==="focusout"?!this.opensOn("focus"):!this.opensOn("hover"))return;const next=event.relatedTarget;next!==null&&next.nodeType===1&&this.triggerElement&&composedContains(this.triggerElement,next)||this.interactiveContent&&this.isPopupTarget(next)||this.requestTransition(!1)},this.onTriggerClick=()=>{this.disabled||this.opensOn("click")&&(this.syncTriggerA11y(),this._open?this.hide():this.show())},this.onPopupEnter=()=>{!this.interactiveContent||this.isManual||(this.cancelPendingTransition(),this.show())},this.onPopupLeave=event=>{if(!this.interactiveContent||this.isManual)return;const next=event.relatedTarget;next!==null&&next.nodeType===1&&(this.triggerElement&&composedContains(this.triggerElement,next)||this.isPopupTarget(next))||this.requestTransition(!1)},this.onContentSlotChange=event=>{event.target?.localName==="slot"&&this.updateInteractiveContent()},this.onTriggerKeyDown=event=>{this.isManual||!this.open||event.key!=="Escape"||!this.overlayHandle?.isTopmost()||(event.preventDefault(),this.hide())}}static{this.defaultStrings={...super.defaultStrings,popover:LYRA_DEFAULT_popover}}static{this.styles=[LyraElement.styles,tooltipStyles]}get open(){return this._open}set open(next){const normalized=!!next;if(normalized||this.cancelPendingTransition(),normalized!==this._open){if(!this.hasUpdated){this.applyOpenState(normalized);return}normalized?this.show():this.hide()}}get for(){return this._for}set for(next){this._for=next??""}get positioningStrategy(){return this._positioningStrategy??"absolute"}set positioningStrategy(next){const normalized=TOOLTIP_POSITIONING_STRATEGY.normalize(next)??"absolute",old=this.positioningStrategy;this._positioningStrategy=normalized,normalized!==old&&(this.requestUpdate("positioningStrategy",old),old==="fixed"!=(normalized==="fixed")&&this.requestUpdate("hoist",old==="fixed"))}get hoist(){return this.positioningStrategy==="fixed"}set hoist(next){this.positioningStrategy=next?"fixed":"absolute"}get rendersArrow(){return this.arrow&&!this.withoutArrow}get activeContentSlot(){const selector=this.namedTriggerMode?'[part~="body"] slot:not([name])':'[part~="body"] slot[name="content"]';return(this.renderRoot??this.shadowRoot)?.querySelector(selector)??null}syncNamedTriggerMode(schedule=!0){const children=Array.from(this.children),hasNamedTrigger=children.some(child=>child.getAttribute("slot")==="trigger"),hasShoelaceContent=(this.content??"").length>0||children.some(child=>child.getAttribute("slot")==="content"),next=hasNamedTrigger||!hasShoelaceContent;if(next===this.namedTriggerMode)return;const old=this.namedTriggerMode;this.namedTriggerMode=next,schedule&&this.hasUpdated&&this.requestUpdate("namedTriggerMode",old)}get triggerKeywords(){return new Set(String(this.trigger??"").trim().split(/\s+/).filter(Boolean))}get isManual(){const keywords=this.triggerKeywords;return this.manual||keywords.size===0||keywords.has("manual")}opensOn(keyword){return!this.isManual&&this.triggerKeywords.has(keyword)}willUpdate(changed){super.willUpdate(changed);const direction=this.effectiveDirection;this.directionChanged=direction!==this.positioningDirection,this.positioningDirection=direction,this.syncNamedTriggerMode(!1),(changed.has("manual")||changed.has("trigger"))&&this.isManual&&this.cancelPendingTransition(),changed.has("disabled")&&this.disabled&&(this.cancelPendingTransition(),this._open&&(this.hasUpdated?this.hide():this.applyOpenState(!1))),changed.has("anchor")&&changed.get("anchor")===this.observedDirectAnchor&&this.observedDirectAnchorWasConnected&&this.anchor?.isConnected!==!0&&this.open&&!this.resolveAnchor()&&this.forceClose(),changed.has("showDelay")&&this.pendingDirection==="show"&&this.requestTransition(!0),changed.has("hideDelay")&&this.pendingDirection==="hide"&&this.requestTransition(!1),changed.has("for")&&this.syncInteractionTrigger(),changed.has("open")&&!this.open&&(this.anchorPositioned=!1),changed.has("open")&&this.open&&(this.popupHidden=!1),(changed.has("anchor")||changed.has("for"))&&(this.anchorPositioned=!1)}updated(changed){if(super.updated(changed),(changed.has("for")||changed.has("anchor")||changed.has("open"))&&this.syncAnchorIdentityObservation(),this.directionChanged||changed.has("open")||changed.has("placement")||changed.has("distance")||changed.has("skidding")||changed.has("for")||changed.has("anchor")||changed.has("positioningStrategy")||changed.has("arrow")||changed.has("withoutArrow")||changed.has("arrowPlacement")||changed.has("arrowPadding")||changed.has("interactiveContent")){if(this.cleanup?.(),this.cleanup=void 0,this.open&&this.isConnected&&this.position(),changed.has("open"))if(this.open)this.updateInteractiveContent(),this.isConnected&&this.requiresOverlayManager&&this.activateTooltipOverlay();else{this.positionedAnchor=void 0;const restoreFocus=this.restoreFocusOnClose;this.suppressTriggerFocusOpen=restoreFocus;try{this.overlayHandle?.deactivate({restoreFocus})}finally{this.suppressTriggerFocusOpen=!1}this.overlayHandle=void 0,this.restoreFocusOnClose=!1,this.virtualAnchor=void 0,this.returnFocusTo=void 0,this.syncInteractionTrigger()}else changed.has("interactiveContent")&&this.open&&this.isConnected&&(this.requiresOverlayManager?this.activateTooltipOverlay():(this.overlayHandle?.deactivate({restoreFocus:!1}),this.overlayHandle=void 0));this.syncTriggerA11y()}(changed.has("content")||changed.has("accessibleLabel"))&&this.updateDescriptionProxy()}connectedCallback(){super.connectedCallback();const triggerSyncGeneration=++this.triggerSyncGeneration,triggerSyncDocument=this.ownerDocument;this.syncAnchorIdentityObservation(),this.ensureDescriptionProxy(),this.contentObserver?.disconnect();const MutationObserverCtor=this.ownerDocument.defaultView?.MutationObserver;this.contentObserver=MutationObserverCtor?new MutationObserverCtor(()=>{this.syncNamedTriggerMode(),this.updateInteractiveContent()}):void 0,this.updateInteractiveContent(),this.syncInteractionTrigger(),this.updateComplete.then(()=>{if(triggerSyncGeneration!==this.triggerSyncGeneration||!this.isConnected||this.ownerDocument!==triggerSyncDocument)return;const slot=this.renderRoot.querySelector('[part="trigger"] > slot');this.slottedTriggerElement=slot?.assignedElements({flatten:!0})[0],this.syncInteractionTrigger()}),this.hasUpdated&&this.open&&(this.popupHidden=!1,this.position(),this.requiresOverlayManager&&(this.overlayHandle?.isActive()?this.overlayHandle.resume():this.activateTooltipOverlay()))}disconnectedCallback(){this.triggerSyncGeneration++,this.stopAnchorIdentityObservation?.(),this.stopAnchorIdentityObservation=void 0,this.cancelPendingTransition(),this.cleanup?.(),this.cleanup=void 0,this.overlayHandle?.suspend(),this.triggerElement&&this.unbindTrigger(this.triggerElement),this.releaseTriggerA11y(),this.triggerElement=void 0,this.contentObserver?.disconnect(),this.contentObserver=void 0,this.stopLabelReferenceIdentityObservation?.(),this.stopLabelReferenceIdentityObservation=void 0,this.clearContentSlotListeners(),this.cancelShadowContentScan(),this.transitionToken++,this.cancelTransitionAnimation(),this.removeAttribute("data-closing"),this.popupHidden=!0,super.disconnectedCallback()}adoptedCallback(){super.adoptedCallback(),this.triggerSyncGeneration++,this.stopAnchorIdentityObservation?.(),this.stopAnchorIdentityObservation=void 0,this.cancelPendingTransition(),this.cancelShadowContentScan(),this.contentObserver?.disconnect(),this.contentObserver=void 0,this.stopLabelReferenceIdentityObservation?.(),this.stopLabelReferenceIdentityObservation=void 0,this.clearContentSlotListeners(),this.releaseTriggerA11y()}syncAnchorIdentityObservation(){this.stopAnchorIdentityObservation?.(),this.stopAnchorIdentityObservation=void 0;const directAnchor=this.open?this.anchor??void 0:void 0;if(this.observedDirectAnchor=directAnchor,this.observedDirectAnchorWasConnected=directAnchor?.isConnected===!0,!this.isConnected||!this.for&&!directAnchor)return;const onIdentityChange=()=>{const directAnchorRemoved=this.anchor===this.observedDirectAnchor&&this.observedDirectAnchorWasConnected&&this.observedDirectAnchor?.isConnected===!1;if(this.observedDirectAnchorWasConnected=this.observedDirectAnchor?.isConnected===!0,this.syncInteractionTrigger(),!this.open)return;const nextAnchor=this.resolveAnchor();if(directAnchorRemoved&&!nextAnchor){this.forceClose();return}nextAnchor!==this.positionedAnchor&&this.position()},observedRoots=new Set([this]);directAnchor&&directAnchor.getRootNode()!==this.getRootNode()&&observedRoots.add(directAnchor.isConnected?directAnchor:directAnchor.ownerDocument);const cleanups=[...observedRoots].map(root=>observeOverlayAnchorIdentity(root,onIdentityChange));this.stopAnchorIdentityObservation=()=>{for(const cleanup of cleanups)cleanup()}}resolveForTrigger(){if(!this.for)return;const target=this.getRootNode().getElementById?.(this.for)??null,HTMLElementCtor=target?.ownerDocument.defaultView?.HTMLElement;return target&&HTMLElementCtor&&target instanceof HTMLElementCtor?target:void 0}syncInteractionTrigger(){const next=this.virtualAnchor?void 0:this.slottedTriggerElement??this.resolveForTrigger();this.adoptTrigger(next)}activateTooltipOverlay(){if(!this.isConnected)return;const restoreFocusTarget=this.virtualAnchor?this.returnFocusTo??null:this.accessibleTrigger;if(this.overlayHandle?.isActive()){this.overlayHandle.updateRestoreFocusTo(restoreFocusTarget);return}this.overlayHandle=activateNonmodalOverlay({host:this,panel:()=>this.renderRoot.querySelector('[part~="popup"]'),onEscape:()=>this.hide({restoreFocus:this.shouldRestoreFocusAfterEscape()}),restoreFocusTo:restoreFocusTarget}),this.overlayHandle.focusAutofocus()}shouldRestoreFocusAfterEscape(){if(this.virtualAnchor)return this.returnFocusTo!==void 0;const active=activeElementIn(this.ownerDocument);return safelyComposedContains(this,active)}get requiresOverlayManager(){return this.open}showAt(rect,options){const normalizedRect=normalizeVirtualRect(rect);if(!normalizedRect)return;const previousAnchor=this.virtualAnchor,previousReturnFocusTo=this.returnFocusTo;if(this.virtualAnchor=virtualAnchorFromRect(normalizedRect),this.returnFocusTo=options?.returnFocusTo,this.syncInteractionTrigger(),this.open){this.activateTooltipOverlay(),this.position();return}this.show(),!this.open&&(this.virtualAnchor=previousAnchor,this.returnFocusTo=previousReturnFocusTo,this.syncInteractionTrigger())}show(){return this.cancelPendingTransition(),this.disabled||this._open?Promise.resolve():this.transitionGate.request(!0,()=>{if(this.emit("lr-show",null,{cancelable:!0}).defaultPrevented){this.syncOpenAttribute();return}return this.cancelTransitionAnimation(),this.removeAttribute("data-closing"),this.applyOpenState(!0),this.settleTransition("lr-after-show")})}hide(options){return this.cancelPendingTransition(),this._open?this.transitionGate.request(!1,()=>{if(this.emit("lr-hide",null,{cancelable:!0}).defaultPrevented){this.syncOpenAttribute();return}return options?.restoreFocus&&(this.restoreFocusOnClose=!0),this.cancelTransitionAnimation(),this.isConnected&&this.setAttribute("data-closing",""),this.applyOpenState(!1),this.settleTransition("lr-after-hide")}):Promise.resolve()}forceClose(){return this.cancelPendingTransition(),this._open?(this.cancelTransitionAnimation(),this.isConnected&&this.setAttribute("data-closing",""),this.applyOpenState(!1),this.settleTransition("lr-after-hide")):Promise.resolve()}applyOpenState(next){const old=this._open;this._open=next,next||(this.cancelShadowContentScan(),this.placementPending=!1),next||(this.openedByPointer=!1),this.requestUpdate("open",old)}syncOpenAttribute(){this.toggleAttribute("open",this._open)}cancelTransitionAnimation(){this.transitionAnimation?.cancel(),this.transitionAnimation=void 0}async settleTransition(event){const token=++this.transitionToken;if(await this.updateComplete,this.transitionToken===token){if(event==="lr-after-show"){const positioned=await waitForDeferredPlacement(()=>this.cleanup);if(this.transitionToken!==token||!this.open)return;if(!positioned){await this.forceClose();return}if(await this.updateComplete,this.transitionToken!==token)return}if(this.isConnected){const popup=this.renderRoot.querySelector('[part~="popup"]'),showing=event==="lr-after-show",animation=popup?animateRegistered(this,popup,`tooltip.${showing?"show":"hide"}`,this.effectiveDirection,{keyframes:showing?[{opacity:0},{opacity:1}]:[{opacity:1},{opacity:0}],durationProperties:["--lr-transition-fast","--lr-duration-fast"],easingProperties:["--lr-easing-standard"]}):void 0;if(this.transitionAnimation=animation,await animation?.finished.catch(()=>{}),this.transitionToken!==token)return;this.cancelTransitionAnimation()}event==="lr-after-hide"&&(this.removeAttribute("data-closing"),this.popupHidden=!0,await this.updateComplete,this.transitionToken!==token)||this.emit(event)}}resolveAnchor(){return resolveOverlayAnchor(this,{virtualAnchor:this.virtualAnchor,anchor:this.anchor,for:this.for,trigger:this.triggerElement})}position(){this.cleanup?.(),this.cleanup=void 0;const popup=this.renderRoot.querySelector('[part~="popup"]'),arrowElement=this.renderRoot.querySelector('[part~="arrow"]'),anchor=this.resolveAnchor();if(!this.open||!anchor||!popup){this.positionedAnchor=void 0,this.anchorPositioned=!1,this.placementPending=!1;return}if(anchor!==this.positionedAnchor&&(this.anchorPositioned=!1),this.open&&anchor&&popup){const arrowPadding=Math.max(0,finiteNumber(this.arrowPadding,0));this.placementPending=!0,this.cleanup=place(anchor,popup,{placement:rtlAwarePlacement(this.placement,this),strategy:resolveEffectivePositioningStrategy(this,this._positioningStrategy,"absolute"),offset:finiteNumber(this.distance,DEFAULT_DISTANCE),skidding:finiteNumber(this.skidding,0),arrow:this.rendersArrow&&arrowElement?arrowElement:void 0,arrowPadding,onPlaced:({placement,arrow})=>{this.placementPending=!1,this.positionedAnchor=anchor,this.anchorPositioned=!0;const side=applyOverlayArrow(arrowElement,{placement,coords:arrow,enabled:this.rendersArrow,arrowPlacement:this.arrowPlacement,arrowPadding,rtl:this.effectiveDirection==="rtl",sizeProperty:"--arrow-size",fallbackSizeProperty:"--lr-tooltip-arrow-size"});side!==this.resolvedSide&&(this.resolvedSide=side)}})}}syncTriggerA11y(){const trigger=this.triggerElement??null,proxy=this.open?this.descriptionProxy:void 0,contribution={descriptions:proxy?[proxy]:[]};this.triggerAria?this.triggerAria.update(trigger,contribution):this.triggerAria=acquireAriaOwnership(trigger,contribution);const accessibleTrigger=this.accessibleTrigger,distinctAccessibleTrigger=accessibleTrigger!==trigger?accessibleTrigger:null;this.accessibleTriggerAria?this.accessibleTriggerAria.update(distinctAccessibleTrigger,contribution):this.accessibleTriggerAria=acquireAriaOwnership(distinctAccessibleTrigger,contribution),this.overlayHandle?.isActive()&&!this.virtualAnchor&&this.overlayHandle.updateRestoreFocusTo(accessibleTrigger)}get accessibleTrigger(){return this.triggerElement?resolveAccessibleTrigger(this.triggerElement):null}releaseTriggerA11y(){this.accessibleTriggerAria?.release(),this.accessibleTriggerAria=void 0,this.triggerAria?.release(),this.triggerAria=void 0}requestTransition(next){if(this.cancelPendingTransition(),this.disabled)return;const delay=this.interactionDelay(next);if(delay<=0){next?this.show():this.hide();return}this.pendingDirection=next?"show":"hide";const view=this.ownerDocument.defaultView;if(!view){this.pendingDirection=void 0;return}this.timerView=view;const timer=view.setTimeout(()=>{this.timerView!==view||this.timer!==timer||(this.timer=void 0,this.timerView=void 0,this.pendingDirection=void 0,next?this.show():this.hide())},delay);this.timer=timer}interactionDelay(showing){const value=showing?this.showDelay:this.hideDelay,fallback=showing?DEFAULT_SHOW_DELAY:DEFAULT_HIDE_DELAY,attribute=showing?"show-delay":"hide-delay";if(this.hasAttribute(attribute)||value!==fallback)return finiteDuration(value,fallback);const property2=showing?"--show-delay":"--hide-delay",match=(this.ownerDocument.defaultView?.getComputedStyle(this).getPropertyValue(property2).trim()??"").match(/^(-?(?:\d+\.?\d*|\.\d+))(ms|s)$/i);if(!match)return fallback;const amount=Number(match[1]),milliseconds=match[2]?.toLowerCase()==="s"?amount*1e3:amount;return finiteDuration(milliseconds,fallback)}cancelPendingTransition(){this.timer!==void 0&&this.timerView?.clearTimeout(this.timer),this.timer=void 0,this.timerView=void 0,this.pendingDirection=void 0}bindTrigger(trigger){trigger.addEventListener("mouseenter",this.onEnter),trigger.addEventListener("mouseleave",this.onLeave),trigger.addEventListener("focusin",this.onEnter),trigger.addEventListener("focusout",this.onLeave),trigger.addEventListener("click",this.onTriggerClick),trigger.addEventListener("keydown",this.onTriggerKeyDown)}unbindTrigger(trigger){trigger.removeEventListener("mouseenter",this.onEnter),trigger.removeEventListener("mouseleave",this.onLeave),trigger.removeEventListener("focusin",this.onEnter),trigger.removeEventListener("focusout",this.onLeave),trigger.removeEventListener("click",this.onTriggerClick),trigger.removeEventListener("keydown",this.onTriggerKeyDown)}isTriggerHeld(trigger){try{if(trigger.matches(":hover"))return!0}catch{}const active=activeElementIn(trigger.ownerDocument);return safelyComposedContains(trigger,active)}adoptTrigger(next){if(next===this.triggerElement){this.syncTriggerA11y();return}const hadTrigger=this.triggerElement!==void 0;if(this.cancelPendingTransition(),this.triggerElement&&this.unbindTrigger(this.triggerElement),this.triggerElement=next,!this.triggerElement){this.syncTriggerA11y(),hadTrigger&&this.open&&!this.resolveAnchor()&&this.forceClose();return}this.bindTrigger(this.triggerElement),this.syncTriggerA11y(),hadTrigger&&this._open&&this.openedByPointer&&!this.isTriggerHeld(this.triggerElement)&&this.forceClose(),this.open&&this.position(),this.open&&this.interactiveContent&&this.activateTooltipOverlay()}isPopupTarget(target){if(target===null||target.nodeType!==1)return!1;const element=target,slot=this.activeContentSlot;return this.renderRoot.querySelector('[part~="popup"]')?.contains(element)===!0||slot?.assignedElements({flatten:!0}).some(root=>composedContains(root,element))===!0}clearContentSlotListeners(){for(const slot of this.contentSlotListeners)slot.removeEventListener("slotchange",this.onContentSlotChange);this.contentSlotListeners.clear()}syncContentSlotListeners(slots){const activeSlot=this.activeContentSlot;for(const slot of this.contentSlotListeners)slots.has(slot)&&slot!==activeSlot||(slot.removeEventListener("slotchange",this.onContentSlotChange),this.contentSlotListeners.delete(slot));for(const slot of slots)slot===activeSlot||this.contentSlotListeners.has(slot)||(slot.addEventListener("slotchange",this.onContentSlotChange),this.contentSlotListeners.add(slot))}inspectContent(){const snapshot={actionable:!1,assigned:!1,awaitingShadowRoot:!1,labelReferenceRoots:new Set,text:"",externalRoots:new Set,shadowRoots:new Set,forwardingSlots:new Set,composedAncestors:new Set},activeSlot=this.activeContentSlot;if(!activeSlot)return snapshot;snapshot.assigned=activeSlot.assignedNodes().length>0;const popup=this.renderRoot.querySelector('[part~="popup"]'),bypassClosedVisibility=popup?.hasAttribute("data-hidden")===!0||this.placementPending,previousVisibility=popup?.style.getPropertyValue("visibility")??"",previousVisibilityPriority=popup?.style.getPropertyPriority("visibility")??"",previousHidden=popup?.hidden??!1;if(popup&&bypassClosedVisibility){const hostVisibility=this.ownerDocument.defaultView?.getComputedStyle(this).visibility??"visible";popup.style.setProperty("visibility",hostVisibility),popup.hidden=!1}try{const visitedContentElements=new Set,accessibilityText=composedAccessibilityTextResult(activeSlot,{shouldPruneNode:node=>{if(node.getRootNode()!==this.renderRoot&&!this.contains(node)&&snapshot.externalRoots.add(node),node.nodeType!==1)return!1;const element=node;return visitedContentElements.add(element),!isAccessibilitySubtreeExcluded(element)&&!isAccessibilityVisibilityHidden(element)&&isActionableElement(element)&&(snapshot.actionable=!0),element.localName==="slot"&&snapshot.forwardingSlots.add(element),element.shadowRoot?snapshot.shadowRoots.add(element.shadowRoot):element.localName.includes("-")&&(snapshot.awaitingShadowRoot=!0),!1},isSubtreeExcluded:element=>(!visitedContentElements.has(element)&&element!==this&&snapshot.composedAncestors.add(element),isAccessibilitySubtreeExcluded(element))});snapshot.text=accessibilityText.text.replace(/\s+/g," ").trim();for(const root of accessibilityText.labelReferenceRoots)snapshot.labelReferenceRoots.add(root);for(const reference of accessibilityText.referencedElements)snapshot.externalRoots.add(reference)}finally{popup&&bypassClosedVisibility&&(previousVisibility?popup.style.setProperty("visibility",previousVisibility,previousVisibilityPriority):popup.style.removeProperty("visibility"),popup.hidden=previousHidden)}return snapshot}observeContentNode(node){if(this.contentObserver){if(node.nodeType===3){this.contentObserver.observe(node,{characterData:!0});return}node.nodeType!==1&&node.nodeType!==11||this.contentObserver.observe(node,{attributes:!0,attributeFilter:["aria-hidden","aria-label","aria-labelledby","alt","class","contenteditable","hidden","href","inert","open","role","slot","style","tabindex"],childList:!0,characterData:!0,subtree:!0})}}bindContentObservation(snapshot){if(this.stopLabelReferenceIdentityObservation?.(),this.stopLabelReferenceIdentityObservation=void 0,this.isConnected&&snapshot.labelReferenceRoots.size>0){const cleanups=[...snapshot.labelReferenceRoots].map(root=>observeOverlayAnchorIdentity(root,()=>this.updateInteractiveContent()));this.stopLabelReferenceIdentityObservation=()=>{for(const cleanup of cleanups)cleanup()}}if(!this.contentObserver)return;const pendingRecords=this.contentObserver.takeRecords();this.contentObserver.disconnect(),pendingRecords.length>0&&queueMicrotask(()=>this.updateInteractiveContent());const ancestorFilter={attributes:!0,attributeFilter:["aria-hidden","class","hidden","inert","style"]};for(const ancestor of snapshot.composedAncestors)ancestor===this||ancestor.getRootNode()===this.renderRoot||snapshot.externalRoots.has(ancestor)||this.contentObserver.observe(ancestor,ancestorFilter);for(let ancestor=composedParentElement(this),hops=0;ancestor&&hops<64;ancestor=composedParentElement(ancestor),hops++)this.contentObserver.observe(ancestor,ancestorFilter);this.observeContentNode(this);for(const root of snapshot.externalRoots)this.observeContentNode(root);for(const root of snapshot.shadowRoots)this.observeContentNode(root)}updateInteractiveContent(fromShadowContentScan=!1){fromShadowContentScan||(this.shadowContentScanAttempts=0);const snapshot=this.inspectContent();this.interactiveContent=snapshot.actionable,this.syncContentSlotListeners(snapshot.forwardingSlots),this.bindContentObservation(snapshot),this.scheduleShadowContentScan(snapshot.awaitingShadowRoot),this.updateDescriptionProxy(snapshot.text,snapshot.assigned)}scheduleShadowContentScan(awaitingShadowRoot){if(this.cancelShadowContentScan(!1),!awaitingShadowRoot||!this.open||!this.isConnected||this.shadowContentScanAttempts>=MAX_SHADOW_CONTENT_SCAN_FRAMES)return;const view=this.ownerDocument.defaultView;view&&(this.shadowContentScanView=view,this.shadowContentScanFrame=view.requestAnimationFrame(()=>{this.shadowContentScanFrame=void 0,this.shadowContentScanView=void 0,this.shadowContentScanAttempts++,this.updateInteractiveContent(!0)}))}cancelShadowContentScan(resetAttempts=!0){this.shadowContentScanFrame!==void 0&&this.shadowContentScanView?.cancelAnimationFrame(this.shadowContentScanFrame),this.shadowContentScanFrame=void 0,this.shadowContentScanView=void 0,resetAttempts&&(this.shadowContentScanAttempts=0)}ensureDescriptionProxy(){this.descriptionProxy||(this.descriptionProxy=this.ownerDocument.createElement("span"),this.descriptionProxy.id=this.descriptionId,this.descriptionProxy.slot="__lr-tooltip-description",this.descriptionProxy.hidden=!0,this.descriptionProxy.dataset.lyraTooltipDescription=""),this.descriptionProxy.parentElement!==this&&this.append(this.descriptionProxy),this.updateDescriptionProxy()}updateDescriptionProxy(contentText,assigned){if(!this.descriptionProxy)return;const hostLabel=this.getAttribute("aria-label"),snapshot=contentText===void 0||assigned===void 0?this.inspectContent():void 0,visibleContent=contentText??snapshot?.text??"",hasAssignment=assigned??snapshot?.assigned??!1,description=hostLabel!==null?hostLabel.trim():(this.accessibleLabel||visibleContent||(hasAssignment?"":this.content)).trim();this.descriptionProxy.textContent!==description&&(this.descriptionProxy.textContent=description)}render(){const hostLabel=this.getAttribute("aria-label"),propertyLabel=this.accessibleLabel??"",hasExplicitLabel=hostLabel!==null||propertyLabel.length>0,label=hostLabel!==null?hostLabel:propertyLabel,popupLabel=this.interactiveContent?hasExplicitLabel?label:this.localize("popover"):hasExplicitLabel?label:nothing;return html`
|
|
2
2
|
<span part="trigger">
|
|
3
3
|
${this.namedTriggerMode?html`<slot name="trigger" @slotchange=${this.onTriggerSlotChange}></slot>`:html`<slot @slotchange=${this.onTriggerSlotChange}></slot>`}
|
|
4
4
|
</span>
|
|
5
5
|
<slot name="__lr-tooltip-description" hidden></slot>
|
|
6
6
|
<div id=${this.tooltipId} part="popup base tooltip base__popup" role=${this.interactiveContent?"dialog":"tooltip"}
|
|
7
7
|
aria-label=${popupLabel}
|
|
8
|
+
?hidden=${this.popupHidden}
|
|
8
9
|
?data-hidden=${!this.open||!this.anchorPositioned}
|
|
9
10
|
?data-has-arrow=${this.rendersArrow}
|
|
10
11
|
@mouseenter=${this.onPopupEnter} @mouseleave=${this.onPopupLeave}
|
|
@@ -14,4 +15,4 @@ var __decorate=function(decorators,target,key,desc){var c=arguments.length,r=c<3
|
|
|
14
15
|
</span>
|
|
15
16
|
${this.rendersArrow?html`<span part="arrow base__arrow arrow-${this.resolvedSide}"></span>`:nothing}
|
|
16
17
|
</div>
|
|
17
|
-
`}}__decorate([property({type:Boolean,reflect:!0})],LyraTooltip.prototype,"open",null),__decorate([property()],LyraTooltip.prototype,"trigger",void 0),__decorate([property({type:Boolean})],LyraTooltip.prototype,"manual",void 0),__decorate([property({type:Number,attribute:"show-delay"})],LyraTooltip.prototype,"showDelay",void 0),__decorate([property({type:Number,attribute:"hide-delay"})],LyraTooltip.prototype,"hideDelay",void 0),__decorate([property({reflect:!0})],LyraTooltip.prototype,"placement",void 0),__decorate([property({type:Number})],LyraTooltip.prototype,"distance",void 0),__decorate([property({type:Number})],LyraTooltip.prototype,"skidding",void 0),__decorate([property({reflect:!0,converter:omittedEmptyStringConverter})],LyraTooltip.prototype,"for",null),__decorate([property({attribute:!1})],LyraTooltip.prototype,"anchor",void 0),__decorate([property({type:Boolean,reflect:!0})],LyraTooltip.prototype,"disabled",void 0),__decorate([property({attribute:"positioning-strategy",reflect:!0,converter:TOOLTIP_POSITIONING_STRATEGY})],LyraTooltip.prototype,"positioningStrategy",null),__decorate([property({type:Boolean,reflect:!0})],LyraTooltip.prototype,"hoist",null),__decorate([property({type:Boolean,converter:trueDefaultBooleanConverter,reflect:!0})],LyraTooltip.prototype,"arrow",void 0),__decorate([property({type:Boolean,attribute:"without-arrow",reflect:!0})],LyraTooltip.prototype,"withoutArrow",void 0),__decorate([property({attribute:"arrow-placement"})],LyraTooltip.prototype,"arrowPlacement",void 0),__decorate([property({type:Number,attribute:"arrow-padding"})],LyraTooltip.prototype,"arrowPadding",void 0),__decorate([property()],LyraTooltip.prototype,"content",void 0),__decorate([property({attribute:"aria-label"})],LyraTooltip.prototype,"accessibleLabel",void 0),__decorate([state()],LyraTooltip.prototype,"interactiveContent",void 0),__decorate([state()],LyraTooltip.prototype,"resolvedSide",void 0),__decorate([state()],LyraTooltip.prototype,"anchorPositioned",void 0);export{LyraTooltip};
|
|
18
|
+
`}}__decorate([property({type:Boolean,reflect:!0})],LyraTooltip.prototype,"open",null),__decorate([property()],LyraTooltip.prototype,"trigger",void 0),__decorate([property({type:Boolean})],LyraTooltip.prototype,"manual",void 0),__decorate([property({type:Number,attribute:"show-delay"})],LyraTooltip.prototype,"showDelay",void 0),__decorate([property({type:Number,attribute:"hide-delay"})],LyraTooltip.prototype,"hideDelay",void 0),__decorate([property({reflect:!0})],LyraTooltip.prototype,"placement",void 0),__decorate([property({type:Number})],LyraTooltip.prototype,"distance",void 0),__decorate([property({type:Number})],LyraTooltip.prototype,"skidding",void 0),__decorate([property({reflect:!0,converter:omittedEmptyStringConverter})],LyraTooltip.prototype,"for",null),__decorate([property({attribute:!1})],LyraTooltip.prototype,"anchor",void 0),__decorate([property({type:Boolean,reflect:!0})],LyraTooltip.prototype,"disabled",void 0),__decorate([property({attribute:"positioning-strategy",reflect:!0,converter:TOOLTIP_POSITIONING_STRATEGY})],LyraTooltip.prototype,"positioningStrategy",null),__decorate([property({type:Boolean,reflect:!0})],LyraTooltip.prototype,"hoist",null),__decorate([property({type:Boolean,converter:trueDefaultBooleanConverter,reflect:!0})],LyraTooltip.prototype,"arrow",void 0),__decorate([property({type:Boolean,attribute:"without-arrow",reflect:!0})],LyraTooltip.prototype,"withoutArrow",void 0),__decorate([property({attribute:"arrow-placement"})],LyraTooltip.prototype,"arrowPlacement",void 0),__decorate([property({type:Number,attribute:"arrow-padding"})],LyraTooltip.prototype,"arrowPadding",void 0),__decorate([property()],LyraTooltip.prototype,"content",void 0),__decorate([property({attribute:"aria-label"})],LyraTooltip.prototype,"accessibleLabel",void 0),__decorate([state()],LyraTooltip.prototype,"interactiveContent",void 0),__decorate([state()],LyraTooltip.prototype,"resolvedSide",void 0),__decorate([state()],LyraTooltip.prototype,"anchorPositioned",void 0),__decorate([state()],LyraTooltip.prototype,"popupHidden",void 0);export{LyraTooltip};
|
|
@@ -138,7 +138,21 @@ virtualAnchor:VirtualAnchor|{x:number;y:number;width?:number;height?:number;}|nu
|
|
|
138
138
|
/** The positioned popup element, exposed for mapped popup integrations. Upstream public types
|
|
139
139
|
* permit assignment, so writes are accepted for source compatibility; the shadow-owned node
|
|
140
140
|
* remains authoritative because replacing it would detach positioning, parts, and animation. */
|
|
141
|
-
get popup():HTMLElement;set popup(_next:HTMLElement);private arrowElement;private hoverBridgeElement;private anchorSlotWrapper;private stopPlacing?;private stopAnchorIdentityObservation?;private anchorPositioned;
|
|
141
|
+
get popup():HTMLElement;set popup(_next:HTMLElement);private arrowElement;private hoverBridgeElement;private anchorSlotWrapper;private stopPlacing?;private stopAnchorIdentityObservation?;private anchorPositioned;
|
|
142
|
+
/** Removes the settled-inactive popup from layout (`[hidden]` -> `display:none`) so its stale
|
|
143
|
+
* placed coordinates and full slotted-content box stop contributing to whatever ancestor
|
|
144
|
+
* establishes its CSS containing block. Starts `true`, clears as soon as `active` becomes true
|
|
145
|
+
* -- before `reposition()`'s deferred placement runs, so the popup is still a real, measurable
|
|
146
|
+
* box -- and is set back only once the CSS opacity/visibility exit transition has actually
|
|
147
|
+
* finished playing (`settlePopupHidden()`), preserving the existing fade in the meantime. */
|
|
148
|
+
private popupHidden;private popupHideToken;private placingAnchorIdentity?;private positionedAnchorIdentity?;private resolvedPlacement;connectedCallback():void;disconnectedCallback():void;protected willUpdate(changed:PropertyValues):void;protected updated(changed:PropertyValues):void;
|
|
149
|
+
/** Removes the popup from layout only once its CSS opacity/visibility exit transition has
|
|
150
|
+
* actually finished playing -- or immediately when there is none to wait for (reduced motion,
|
|
151
|
+
* or a `--hide-duration`/`--show-duration` override of `0s`), matching this component's own
|
|
152
|
+
* transition-duration custom properties rather than a hardcoded guess. A safety timeout covers
|
|
153
|
+
* a browser that never dispatches the end event. Superseded by a fresh close (a new token) or a
|
|
154
|
+
* reopen (`this.active` true again) at either await point. */
|
|
155
|
+
private settlePopupHidden;
|
|
142
156
|
/** Recomputes the position now. Rarely needed — the popup already tracks scroll, resize and
|
|
143
157
|
* layout change — but a consumer that moved a virtual anchor imperatively can force a pass. */
|
|
144
158
|
reposition():void;
|
|
@@ -1,8 +1,8 @@
|
|
|
1
|
-
var __decorate=function(decorators,target,key,desc){var c=arguments.length,r=c<3?target:desc===null?desc=Object.getOwnPropertyDescriptor(target,key):desc,d;if(typeof Reflect=="object"&&typeof Reflect.decorate=="function")r=Reflect.decorate(decorators,target,key,desc);else for(var i=decorators.length-1;i>=0;i--)(d=decorators[i])&&(r=(c<3?d(r):c>3?d(target,key,r):d(target,key))||r);return c>3&&r&&Object.defineProperty(target,key,r),r};import{html,nothing}from"lit";import{property,query,state}from"lit/decorators.js";import{LyraElement}from"../../../internal/lyra-element.js";import{deferredPlace as place}from"../../../internal/anchored-overlay-runtime.js";import{virtualAnchorFromRect}from"../../../internal/positioner-geometry.js";import{rtlAwarePlacement}from"../../../internal/rtl.js";import{finiteNumber}from"../../../internal/numbers.js";import{applyOverlayArrow}from"../overlay/overlay-arrow.js";import{observeOverlayAnchorIdentity}from"../overlay/overlay-shared.js";import{styles}from"./popup.styles.js";const PLACEMENTS=new Set(["top","top-start","top-end","bottom","bottom-start","bottom-end","left","left-start","left-end","right","right-start","right-end"]),AUTO_SIZE_AXES=new Set(["horizontal","vertical","both"]),SYNC_AXES=new Set(["width","height","both"]);class LyraPopup extends LyraElement{constructor(){super(...arguments),this.active=!1,this.for="",this.anchor=null,this.placement="top",this.strategy="absolute",this.distance=0,this.skidding=0,this.flip=!1,this.flipFallbackPlacements="",this.flipFallbackStrategy="best-fit",this.boundary="viewport",this.flipBoundary=null,this.flipPadding=0,this.shift=!1,this.shiftBoundary=null,this.shiftPadding=0,this.padding=0,this.autoSize=null,this.autoSizeBoundary=null,this.autoSizePadding=0,this.sync=null,this.hoverBridge=!1,this.arrow=!1,this.arrowPlacement="anchor",this.arrowPadding=10,this.virtualAnchor=null,this.anchorPositioned=!1,this.resolvedPlacement="top",this.onAnchorSlotChange=()=>{if(!this.active)return;const nextIdentity=this.resolveAnchor()?.identity,currentIdentity=this.placingAnchorIdentity??this.positionedAnchorIdentity;nextIdentity!==currentIdentity&&this.reposition()},this.onForwardedAnchorSlotChange=event=>{event.target?.localName==="slot"&&this.onAnchorSlotChange()}}static{this.styles=[LyraElement.styles,styles]}get popup(){return this.renderRoot?.querySelector('[part~="popup"]')}set popup(_next){}connectedCallback(){super.connectedCallback(),this.addEventListener("slotchange",this.onForwardedAnchorSlotChange),this.syncAnchorIdentityObservation(),this.hasUpdated&&this.active&&this.reposition()}disconnectedCallback(){this.removeEventListener("slotchange",this.onForwardedAnchorSlotChange),this.stopAnchorIdentityObservation?.(),this.stopAnchorIdentityObservation=void 0,this.teardown(),this.positionedAnchorIdentity=void 0,this.setPositioned(!1),super.disconnectedCallback()}willUpdate(changed){super.willUpdate(changed),changed.has("active")&&!this.active&&this.setPositioned(!1),(changed.has("anchor")||changed.has("for")||changed.has("virtualAnchor"))&&this.setPositioned(!1)}updated(changed){super.updated(changed),this.reposition()}reposition(){this.syncAnchorIdentityObservation();const anchor=this.isConnected&&this.active?this.resolveAnchor():null,previousIdentity=this.placingAnchorIdentity??this.positionedAnchorIdentity;if(this.teardown(),!this.isConnected||!this.active||!this.popup||!anchor){this.positionedAnchorIdentity=void 0,this.setPositioned(!1);return}anchor.identity!==previousIdentity&&(this.positionedAnchorIdentity=void 0,this.setPositioned(!1)),this.placingAnchorIdentity=anchor.identity;const arrowPadding=Math.max(0,finiteNumber(this.arrowPadding,0));this.stopPlacing=place(anchor.target,this.popup,{placement:rtlAwarePlacement(this.placement,this),strategy:this.strategy==="absolute"?"absolute":"fixed",offset:finiteNumber(this.distance,0),skidding:finiteNumber(this.skidding,0),boundary:this.boundary==="scroll"?void 0:[],flip:this.flip,flipFallbackPlacements:this.parsedFlipFallbackPlacements,flipFallbackStrategy:this.flipFallbackStrategy==="initial"||this.flipFallbackStrategy==="initial-placement"?"initial-placement":"best-fit",flipBoundary:this.flipBoundary??void 0,flipPadding:Math.max(0,finiteNumber(this.flipPadding,0)),shift:this.shift,shiftBoundary:this.shiftBoundary??void 0,shiftPadding:Math.max(0,finiteNumber(this.shiftPadding,0)),padding:Math.max(0,finiteNumber(this.padding,0)),autoSize:AUTO_SIZE_AXES.has(this.autoSize)?this.autoSize:void 0,autoSizeBoundary:this.autoSizeBoundary??void 0,autoSizePadding:Math.max(0,finiteNumber(this.autoSizePadding,0)),sync:SYNC_AXES.has(this.sync)?this.sync:void 0,arrow:this.arrow?this.arrowElement:void 0,arrowPadding,hoverBridge:this.hoverBridge?this.hoverBridgeElement:void 0,onPlaced:({placement,arrow})=>{const currentAnchor=this.resolveAnchor();if(!this.isConnected||!this.active||currentAnchor?.identity!==anchor.identity){this.setPositioned(!1);return}this.placingAnchorIdentity=void 0,this.positionedAnchorIdentity=anchor.identity,this.setPositioned(!0),this.popup.style.setProperty("--auto-size-available-width",this.popup.style.getPropertyValue("--lr-positioner-available-inline-size")),this.popup.style.setProperty("--auto-size-available-height",this.popup.style.getPropertyValue("--lr-positioner-available-block-size"));const side=applyOverlayArrow(this.arrowElement??null,{placement,coords:arrow,enabled:this.arrow,arrowPlacement:this.arrowPlacement,arrowPadding,rtl:this.effectiveDirection==="rtl",sizeProperty:"--arrow-size",fallbackSizeProperty:"--lr-popup-arrow-size"});this.applyArrowSidePart(side),placement!==this.resolvedPlacement&&(this.resolvedPlacement=placement,this.applySidePart(placement)),this.emit("lr-reposition",{placement})}})}get parsedFlipFallbackPlacements(){const raw=(this.flipFallbackPlacements??"").trim();if(!raw)return;const parsed=raw.split(/[\s,]+/).filter(token=>PLACEMENTS.has(token));return parsed.length?parsed:void 0}teardown(){this.stopPlacing?.(),this.stopPlacing=void 0,this.placingAnchorIdentity=void 0}resolveAnchor(){if(this.virtualAnchor){const candidate=this.virtualAnchor;if(typeof candidate.getBoundingClientRect=="function")return{target:candidate,identity:candidate};const rect=this.virtualAnchor,width=rect.width??0,height=rect.height??0;return[rect.x,rect.y,width,height].every(Number.isFinite)?{target:virtualAnchorFromRect({x:rect.x,y:rect.y,width:Math.max(0,width),height:Math.max(0,height)}),identity:rect}:null}if(this.anchor){if(typeof this.anchor=="string"){const target2=this.getRootNode().getElementById?.(this.anchor)??null;if(target2)return{target:target2,identity:target2}}else if(typeof this.anchor.getBoundingClientRect=="function"&&(!this.isElementAnchor(this.anchor)||this.anchor.isConnected))return{target:this.anchor,identity:this.anchor}}if(this.for){const target2=this.getRootNode().getElementById?.(this.for)??null;if(target2)return{target:target2,identity:target2}}const target=this.anchorSlotWrapper?.querySelector("slot")?.assignedElements({flatten:!0})[0]??null;return target?.isConnected?{target,identity:target}:null}isElementAnchor(anchor){const candidate=anchor,ElementCtor=candidate.ownerDocument?.defaultView?.Element;return ElementCtor?candidate instanceof ElementCtor:candidate.nodeType===1}syncAnchorIdentityObservation(){if(this.stopAnchorIdentityObservation?.(),this.stopAnchorIdentityObservation=void 0,!this.isConnected||!this.active||this.virtualAnchor)return;const directAnchor=this.anchor&&typeof this.anchor!="string"&&this.isElementAnchor(this.anchor)?this.anchor:void 0;if(!(typeof this.anchor=="string"||!!this.for||!!directAnchor))return;const onIdentityChange=()=>{const nextIdentity=this.resolveAnchor()?.identity,currentIdentity=this.placingAnchorIdentity??this.positionedAnchorIdentity;nextIdentity!==currentIdentity&&this.reposition()},observedRoots=new Set([this]);directAnchor&&directAnchor.getRootNode()!==this.getRootNode()&&observedRoots.add(directAnchor.isConnected?directAnchor:directAnchor.ownerDocument);const cleanups=[...observedRoots].map(root=>observeOverlayAnchorIdentity(root,onIdentityChange));this.stopAnchorIdentityObservation=()=>{for(const cleanup of cleanups)cleanup()}}setPositioned(positioned){this.anchorPositioned=positioned}applySidePart(placement){const side=placement.split("-")[0]??"bottom";this.popup?.setAttribute("part",`popup ${side}`)}applyArrowSidePart(side){this.arrowElement?.setAttribute("part",`arrow arrow-${side}`)}render(){const side=this.resolvedPlacement.split("-")[0],paints=this.active&&this.anchorPositioned,awaitsPosition=this.active&&!this.anchorPositioned;return html`
|
|
1
|
+
var __decorate=function(decorators,target,key,desc){var c=arguments.length,r=c<3?target:desc===null?desc=Object.getOwnPropertyDescriptor(target,key):desc,d;if(typeof Reflect=="object"&&typeof Reflect.decorate=="function")r=Reflect.decorate(decorators,target,key,desc);else for(var i=decorators.length-1;i>=0;i--)(d=decorators[i])&&(r=(c<3?d(r):c>3?d(target,key,r):d(target,key))||r);return c>3&&r&&Object.defineProperty(target,key,r),r};import{html,nothing}from"lit";import{property,query,state}from"lit/decorators.js";import{LyraElement}from"../../../internal/lyra-element.js";import{deferredPlace as place}from"../../../internal/anchored-overlay-runtime.js";import{virtualAnchorFromRect}from"../../../internal/positioner-geometry.js";import{rtlAwarePlacement}from"../../../internal/rtl.js";import{finiteNumber}from"../../../internal/numbers.js";import{prefersReducedMotion}from"../../../internal/motion.js";import{applyOverlayArrow}from"../overlay/overlay-arrow.js";import{observeOverlayAnchorIdentity}from"../overlay/overlay-shared.js";import{styles}from"./popup.styles.js";const PLACEMENTS=new Set(["top","top-start","top-end","bottom","bottom-start","bottom-end","left","left-start","left-end","right","right-start","right-end"]),AUTO_SIZE_AXES=new Set(["horizontal","vertical","both"]),SYNC_AXES=new Set(["width","height","both"]);function parseCssTime(value){const trimmed=value.trim();return trimmed.endsWith("ms")?Number.parseFloat(trimmed):trimmed.endsWith("s")?Number.parseFloat(trimmed)*1e3:0}function maxCssTransitionTime(value){return Math.max(0,...value.split(",").map(parseCssTime).filter(Number.isFinite))}class LyraPopup extends LyraElement{constructor(){super(...arguments),this.active=!1,this.for="",this.anchor=null,this.placement="top",this.strategy="absolute",this.distance=0,this.skidding=0,this.flip=!1,this.flipFallbackPlacements="",this.flipFallbackStrategy="best-fit",this.boundary="viewport",this.flipBoundary=null,this.flipPadding=0,this.shift=!1,this.shiftBoundary=null,this.shiftPadding=0,this.padding=0,this.autoSize=null,this.autoSizeBoundary=null,this.autoSizePadding=0,this.sync=null,this.hoverBridge=!1,this.arrow=!1,this.arrowPlacement="anchor",this.arrowPadding=10,this.virtualAnchor=null,this.anchorPositioned=!1,this.popupHidden=!0,this.popupHideToken=0,this.resolvedPlacement="top",this.onAnchorSlotChange=()=>{if(!this.active)return;const nextIdentity=this.resolveAnchor()?.identity,currentIdentity=this.placingAnchorIdentity??this.positionedAnchorIdentity;nextIdentity!==currentIdentity&&this.reposition()},this.onForwardedAnchorSlotChange=event=>{event.target?.localName==="slot"&&this.onAnchorSlotChange()}}static{this.styles=[LyraElement.styles,styles]}get popup(){return this.renderRoot?.querySelector('[part~="popup"]')}set popup(_next){}connectedCallback(){super.connectedCallback(),this.addEventListener("slotchange",this.onForwardedAnchorSlotChange),this.syncAnchorIdentityObservation(),this.hasUpdated&&this.active&&(this.popupHidden=!1,this.reposition())}disconnectedCallback(){this.removeEventListener("slotchange",this.onForwardedAnchorSlotChange),this.stopAnchorIdentityObservation?.(),this.stopAnchorIdentityObservation=void 0,this.teardown(),this.positionedAnchorIdentity=void 0,this.setPositioned(!1),this.popupHideToken++,this.popupHidden=!0,super.disconnectedCallback()}willUpdate(changed){super.willUpdate(changed),changed.has("active")&&!this.active&&this.setPositioned(!1),changed.has("active")&&this.active&&(this.popupHidden=!1),(changed.has("anchor")||changed.has("for")||changed.has("virtualAnchor"))&&this.setPositioned(!1)}updated(changed){super.updated(changed),this.reposition(),changed.has("active")&&!this.active&&this.settlePopupHidden()}async settlePopupHidden(){const token=++this.popupHideToken;if(await this.updateComplete,token!==this.popupHideToken||this.active)return;const popup=this.popup,view=this.ownerDocument.defaultView;if(popup&&view&&!prefersReducedMotion(view)){const computed=view.getComputedStyle(popup),durationMs=maxCssTransitionTime(computed.transitionDuration)+maxCssTransitionTime(computed.transitionDelay);if(durationMs>0&&(await new Promise(resolve=>{let settled=!1,timeout;const finish=()=>{settled||(settled=!0,timeout!==void 0&&view.clearTimeout(timeout),popup.removeEventListener("transitionend",onEnd),popup.removeEventListener("transitioncancel",onEnd),resolve())},onEnd=event=>{event.target===popup&&finish()};popup.addEventListener("transitionend",onEnd),popup.addEventListener("transitioncancel",onEnd),timeout=view.setTimeout(finish,durationMs+50)}),token!==this.popupHideToken||this.active))return}this.popupHidden=!0}reposition(){this.syncAnchorIdentityObservation();const anchor=this.isConnected&&this.active?this.resolveAnchor():null,previousIdentity=this.placingAnchorIdentity??this.positionedAnchorIdentity;if(this.teardown(),!this.isConnected||!this.active||!this.popup||!anchor){this.positionedAnchorIdentity=void 0,this.setPositioned(!1);return}anchor.identity!==previousIdentity&&(this.positionedAnchorIdentity=void 0,this.setPositioned(!1)),this.placingAnchorIdentity=anchor.identity;const arrowPadding=Math.max(0,finiteNumber(this.arrowPadding,0));this.stopPlacing=place(anchor.target,this.popup,{placement:rtlAwarePlacement(this.placement,this),strategy:this.strategy==="absolute"?"absolute":"fixed",offset:finiteNumber(this.distance,0),skidding:finiteNumber(this.skidding,0),boundary:this.boundary==="scroll"?void 0:[],flip:this.flip,flipFallbackPlacements:this.parsedFlipFallbackPlacements,flipFallbackStrategy:this.flipFallbackStrategy==="initial"||this.flipFallbackStrategy==="initial-placement"?"initial-placement":"best-fit",flipBoundary:this.flipBoundary??void 0,flipPadding:Math.max(0,finiteNumber(this.flipPadding,0)),shift:this.shift,shiftBoundary:this.shiftBoundary??void 0,shiftPadding:Math.max(0,finiteNumber(this.shiftPadding,0)),padding:Math.max(0,finiteNumber(this.padding,0)),autoSize:AUTO_SIZE_AXES.has(this.autoSize)?this.autoSize:void 0,autoSizeBoundary:this.autoSizeBoundary??void 0,autoSizePadding:Math.max(0,finiteNumber(this.autoSizePadding,0)),sync:SYNC_AXES.has(this.sync)?this.sync:void 0,arrow:this.arrow?this.arrowElement:void 0,arrowPadding,hoverBridge:this.hoverBridge?this.hoverBridgeElement:void 0,onPlaced:({placement,arrow})=>{const currentAnchor=this.resolveAnchor();if(!this.isConnected||!this.active||currentAnchor?.identity!==anchor.identity){this.setPositioned(!1);return}this.placingAnchorIdentity=void 0,this.positionedAnchorIdentity=anchor.identity,this.setPositioned(!0),this.popup.style.setProperty("--auto-size-available-width",this.popup.style.getPropertyValue("--lr-positioner-available-inline-size")),this.popup.style.setProperty("--auto-size-available-height",this.popup.style.getPropertyValue("--lr-positioner-available-block-size"));const side=applyOverlayArrow(this.arrowElement??null,{placement,coords:arrow,enabled:this.arrow,arrowPlacement:this.arrowPlacement,arrowPadding,rtl:this.effectiveDirection==="rtl",sizeProperty:"--arrow-size",fallbackSizeProperty:"--lr-popup-arrow-size"});this.applyArrowSidePart(side),placement!==this.resolvedPlacement&&(this.resolvedPlacement=placement,this.applySidePart(placement)),this.emit("lr-reposition",{placement})}})}get parsedFlipFallbackPlacements(){const raw=(this.flipFallbackPlacements??"").trim();if(!raw)return;const parsed=raw.split(/[\s,]+/).filter(token=>PLACEMENTS.has(token));return parsed.length?parsed:void 0}teardown(){this.stopPlacing?.(),this.stopPlacing=void 0,this.placingAnchorIdentity=void 0}resolveAnchor(){if(this.virtualAnchor){const candidate=this.virtualAnchor;if(typeof candidate.getBoundingClientRect=="function")return{target:candidate,identity:candidate};const rect=this.virtualAnchor,width=rect.width??0,height=rect.height??0;return[rect.x,rect.y,width,height].every(Number.isFinite)?{target:virtualAnchorFromRect({x:rect.x,y:rect.y,width:Math.max(0,width),height:Math.max(0,height)}),identity:rect}:null}if(this.anchor){if(typeof this.anchor=="string"){const target2=this.getRootNode().getElementById?.(this.anchor)??null;if(target2)return{target:target2,identity:target2}}else if(typeof this.anchor.getBoundingClientRect=="function"&&(!this.isElementAnchor(this.anchor)||this.anchor.isConnected))return{target:this.anchor,identity:this.anchor}}if(this.for){const target2=this.getRootNode().getElementById?.(this.for)??null;if(target2)return{target:target2,identity:target2}}const target=this.anchorSlotWrapper?.querySelector("slot")?.assignedElements({flatten:!0})[0]??null;return target?.isConnected?{target,identity:target}:null}isElementAnchor(anchor){const candidate=anchor,ElementCtor=candidate.ownerDocument?.defaultView?.Element;return ElementCtor?candidate instanceof ElementCtor:candidate.nodeType===1}syncAnchorIdentityObservation(){if(this.stopAnchorIdentityObservation?.(),this.stopAnchorIdentityObservation=void 0,!this.isConnected||!this.active||this.virtualAnchor)return;const directAnchor=this.anchor&&typeof this.anchor!="string"&&this.isElementAnchor(this.anchor)?this.anchor:void 0;if(!(typeof this.anchor=="string"||!!this.for||!!directAnchor))return;const onIdentityChange=()=>{const nextIdentity=this.resolveAnchor()?.identity,currentIdentity=this.placingAnchorIdentity??this.positionedAnchorIdentity;nextIdentity!==currentIdentity&&this.reposition()},observedRoots=new Set([this]);directAnchor&&directAnchor.getRootNode()!==this.getRootNode()&&observedRoots.add(directAnchor.isConnected?directAnchor:directAnchor.ownerDocument);const cleanups=[...observedRoots].map(root=>observeOverlayAnchorIdentity(root,onIdentityChange));this.stopAnchorIdentityObservation=()=>{for(const cleanup of cleanups)cleanup()}}setPositioned(positioned){this.anchorPositioned=positioned}applySidePart(placement){const side=placement.split("-")[0]??"bottom";this.popup?.setAttribute("part",`popup ${side}`)}applyArrowSidePart(side){this.arrowElement?.setAttribute("part",`arrow arrow-${side}`)}render(){const side=this.resolvedPlacement.split("-")[0],paints=this.active&&this.anchorPositioned,awaitsPosition=this.active&&!this.anchorPositioned;return html`
|
|
2
2
|
${this.hoverBridge?html`<span part="hover-bridge" ?data-active=${paints}></span>`:nothing}
|
|
3
3
|
<span part="anchor"><slot name="anchor" @slotchange=${this.onAnchorSlotChange}></slot></span>
|
|
4
|
-
<div part="popup ${side}" ?data-active=${paints} ?data-awaits-position=${awaitsPosition}>
|
|
4
|
+
<div part="popup ${side}" ?hidden=${this.popupHidden} ?data-active=${paints} ?data-awaits-position=${awaitsPosition}>
|
|
5
5
|
<slot></slot>
|
|
6
6
|
${this.arrow?html`<span part="arrow arrow-${side}"></span>`:nothing}
|
|
7
7
|
</div>
|
|
8
|
-
`}}__decorate([property({type:Boolean,reflect:!0})],LyraPopup.prototype,"active",void 0),__decorate([property({reflect:!0})],LyraPopup.prototype,"for",void 0),__decorate([property()],LyraPopup.prototype,"anchor",void 0),__decorate([property({reflect:!0})],LyraPopup.prototype,"placement",void 0),__decorate([property({reflect:!0})],LyraPopup.prototype,"strategy",void 0),__decorate([property({type:Number})],LyraPopup.prototype,"distance",void 0),__decorate([property({type:Number})],LyraPopup.prototype,"skidding",void 0),__decorate([property({type:Boolean})],LyraPopup.prototype,"flip",void 0),__decorate([property({attribute:"flip-fallback-placements"})],LyraPopup.prototype,"flipFallbackPlacements",void 0),__decorate([property({attribute:"flip-fallback-strategy"})],LyraPopup.prototype,"flipFallbackStrategy",void 0),__decorate([property()],LyraPopup.prototype,"boundary",void 0),__decorate([property({attribute:!1})],LyraPopup.prototype,"flipBoundary",void 0),__decorate([property({type:Number,attribute:"flip-padding"})],LyraPopup.prototype,"flipPadding",void 0),__decorate([property({type:Boolean})],LyraPopup.prototype,"shift",void 0),__decorate([property({attribute:!1})],LyraPopup.prototype,"shiftBoundary",void 0),__decorate([property({type:Number,attribute:"shift-padding"})],LyraPopup.prototype,"shiftPadding",void 0),__decorate([property({type:Number})],LyraPopup.prototype,"padding",void 0),__decorate([property({attribute:"auto-size"})],LyraPopup.prototype,"autoSize",void 0),__decorate([property({attribute:!1})],LyraPopup.prototype,"autoSizeBoundary",void 0),__decorate([property({type:Number,attribute:"auto-size-padding"})],LyraPopup.prototype,"autoSizePadding",void 0),__decorate([property()],LyraPopup.prototype,"sync",void 0),__decorate([property({type:Boolean,attribute:"hover-bridge"})],LyraPopup.prototype,"hoverBridge",void 0),__decorate([property({type:Boolean})],LyraPopup.prototype,"arrow",void 0),__decorate([property({attribute:"arrow-placement"})],LyraPopup.prototype,"arrowPlacement",void 0),__decorate([property({type:Number,attribute:"arrow-padding"})],LyraPopup.prototype,"arrowPadding",void 0),__decorate([property({attribute:!1})],LyraPopup.prototype,"virtualAnchor",void 0),__decorate([query('[part~="arrow"]')],LyraPopup.prototype,"arrowElement",void 0),__decorate([query('[part~="hover-bridge"]')],LyraPopup.prototype,"hoverBridgeElement",void 0),__decorate([query('[part="anchor"]')],LyraPopup.prototype,"anchorSlotWrapper",void 0),__decorate([state()],LyraPopup.prototype,"anchorPositioned",void 0);export{LyraPopup};
|
|
8
|
+
`}}__decorate([property({type:Boolean,reflect:!0})],LyraPopup.prototype,"active",void 0),__decorate([property({reflect:!0})],LyraPopup.prototype,"for",void 0),__decorate([property()],LyraPopup.prototype,"anchor",void 0),__decorate([property({reflect:!0})],LyraPopup.prototype,"placement",void 0),__decorate([property({reflect:!0})],LyraPopup.prototype,"strategy",void 0),__decorate([property({type:Number})],LyraPopup.prototype,"distance",void 0),__decorate([property({type:Number})],LyraPopup.prototype,"skidding",void 0),__decorate([property({type:Boolean})],LyraPopup.prototype,"flip",void 0),__decorate([property({attribute:"flip-fallback-placements"})],LyraPopup.prototype,"flipFallbackPlacements",void 0),__decorate([property({attribute:"flip-fallback-strategy"})],LyraPopup.prototype,"flipFallbackStrategy",void 0),__decorate([property()],LyraPopup.prototype,"boundary",void 0),__decorate([property({attribute:!1})],LyraPopup.prototype,"flipBoundary",void 0),__decorate([property({type:Number,attribute:"flip-padding"})],LyraPopup.prototype,"flipPadding",void 0),__decorate([property({type:Boolean})],LyraPopup.prototype,"shift",void 0),__decorate([property({attribute:!1})],LyraPopup.prototype,"shiftBoundary",void 0),__decorate([property({type:Number,attribute:"shift-padding"})],LyraPopup.prototype,"shiftPadding",void 0),__decorate([property({type:Number})],LyraPopup.prototype,"padding",void 0),__decorate([property({attribute:"auto-size"})],LyraPopup.prototype,"autoSize",void 0),__decorate([property({attribute:!1})],LyraPopup.prototype,"autoSizeBoundary",void 0),__decorate([property({type:Number,attribute:"auto-size-padding"})],LyraPopup.prototype,"autoSizePadding",void 0),__decorate([property()],LyraPopup.prototype,"sync",void 0),__decorate([property({type:Boolean,attribute:"hover-bridge"})],LyraPopup.prototype,"hoverBridge",void 0),__decorate([property({type:Boolean})],LyraPopup.prototype,"arrow",void 0),__decorate([property({attribute:"arrow-placement"})],LyraPopup.prototype,"arrowPlacement",void 0),__decorate([property({type:Number,attribute:"arrow-padding"})],LyraPopup.prototype,"arrowPadding",void 0),__decorate([property({attribute:!1})],LyraPopup.prototype,"virtualAnchor",void 0),__decorate([query('[part~="arrow"]')],LyraPopup.prototype,"arrowElement",void 0),__decorate([query('[part~="hover-bridge"]')],LyraPopup.prototype,"hoverBridgeElement",void 0),__decorate([query('[part="anchor"]')],LyraPopup.prototype,"anchorSlotWrapper",void 0),__decorate([state()],LyraPopup.prototype,"anchorPositioned",void 0),__decorate([state()],LyraPopup.prototype,"popupHidden",void 0);export{LyraPopup};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import{css}from"lit";const styles=css`:host,[part=anchor]{display:contents}[part~=popup]{z-index:var(--lr-overlay-stack-index,var(--lr-layer-popover));max-inline-size:var(--lr-positioner-available-inline-size,none);max-block-size:var(--lr-positioner-available-block-size,none);visibility:visible;opacity:1;transition-property:opacity,visibility;transition-duration:var(--show-duration,var(--lr-duration-fast));transition-timing-function:var(--lr-easing-standard);position:absolute;top:0;left:0}[part~=popup]:not([data-active]){visibility:hidden;opacity:0;pointer-events:none;transition-duration:var(--hide-duration,var(--lr-duration-fast))}[part~=popup][data-awaits-position]{transition:none}[part~=hover-bridge]{z-index:calc(var(--lr-overlay-stack-index,var(--lr-layer-popover)) - 1);clip-path:polygon(var(--lr-positioner-hover-bridge-top-left-x,0) var(--lr-positioner-hover-bridge-top-left-y,0), var(--lr-positioner-hover-bridge-top-right-x,0) var(--lr-positioner-hover-bridge-top-right-y,0), var(--lr-positioner-hover-bridge-bottom-right-x,0) var(--lr-positioner-hover-bridge-bottom-right-y,0), var(--lr-positioner-hover-bridge-bottom-left-x,0) var(--lr-positioner-hover-bridge-bottom-left-y,0));position:fixed;inset:0}[part~=hover-bridge]:not([data-active]){display:none}[part~=arrow]{inline-size:calc(2 * var(--arrow-size,var(--lr-popup-arrow-size,var(--lr-size-0-375rem))));block-size:calc(2 * var(--arrow-size,var(--lr-popup-arrow-size,var(--lr-size-0-375rem))));background:var(--arrow-color,var(--lr-color-surface-raised));border:var(--popup-border-width,var(--lr-border-width-thin)) solid var(--lr-color-border);clip-path:polygon(100% 0,100% 100%,0 100%);position:absolute;rotate:45deg}@media (prefers-reduced-motion:reduce){[part~=popup]{transition:none!important}}`;export{styles};
|
|
1
|
+
import{css}from"lit";const styles=css`:host,[part=anchor]{display:contents}[part~=popup][hidden]{display:none}[part~=popup]{z-index:var(--lr-overlay-stack-index,var(--lr-layer-popover));max-inline-size:var(--lr-positioner-available-inline-size,none);max-block-size:var(--lr-positioner-available-block-size,none);visibility:visible;opacity:1;transition-property:opacity,visibility;transition-duration:var(--show-duration,var(--lr-duration-fast));transition-timing-function:var(--lr-easing-standard);position:absolute;top:0;left:0}[part~=popup]:not([data-active]){visibility:hidden;opacity:0;pointer-events:none;transition-duration:var(--hide-duration,var(--lr-duration-fast))}[part~=popup][data-awaits-position]{transition:none}[part~=hover-bridge]{z-index:calc(var(--lr-overlay-stack-index,var(--lr-layer-popover)) - 1);clip-path:polygon(var(--lr-positioner-hover-bridge-top-left-x,0) var(--lr-positioner-hover-bridge-top-left-y,0), var(--lr-positioner-hover-bridge-top-right-x,0) var(--lr-positioner-hover-bridge-top-right-y,0), var(--lr-positioner-hover-bridge-bottom-right-x,0) var(--lr-positioner-hover-bridge-bottom-right-y,0), var(--lr-positioner-hover-bridge-bottom-left-x,0) var(--lr-positioner-hover-bridge-bottom-left-y,0));position:fixed;inset:0}[part~=hover-bridge]:not([data-active]){display:none}[part~=arrow]{inline-size:calc(2 * var(--arrow-size,var(--lr-popup-arrow-size,var(--lr-size-0-375rem))));block-size:calc(2 * var(--arrow-size,var(--lr-popup-arrow-size,var(--lr-size-0-375rem))));background:var(--arrow-color,var(--lr-color-surface-raised));border:var(--popup-border-width,var(--lr-border-width-thin)) solid var(--lr-color-border);clip-path:polygon(100% 0,100% 100%,0 100%);position:absolute;rotate:45deg}@media (prefers-reduced-motion:reduce){[part~=popup]{transition:none!important}}`;export{styles};
|
|
@@ -20,6 +20,8 @@ export type LyraProgressVariant=LyraVariant;
|
|
|
20
20
|
* ladder (`0.25rem` at `2xs` up to `1.5rem` at `xl`, `1rem` unchanged at the `m` default); an
|
|
21
21
|
* inherited or direct value here still wins outright over every tier.
|
|
22
22
|
* @cssprop [--lr-progress-track-color=var(--lr-color-brand-quiet)] - Track color.
|
|
23
|
+
* @cssprop [--lr-progress-track-radius=var(--lr-radius-pill)] - Track corner radius. The indicator
|
|
24
|
+
* inherits it, so retuning one retunes both without a `::part(track)`/`::part(indicator)` rule.
|
|
23
25
|
* @cssprop [--lr-progress-indicator-color=var(--lr-progress-indicator-variant-color)] - Indicator
|
|
24
26
|
* color, overriding the variant palette below.
|
|
25
27
|
* @cssprop [--lr-progress-indicator-variant-color=var(--lr-color-fill-loud,var(--lr-color-brand))] -
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import{css}from"lit";const styles=css`:host{color:var(--lr-color-brand);--_lr-progress-indicator-variant-color:var(--lr-color-brand);--_lr-progress-track-height:var(--lr-size-1rem);display:block}:host([variant]){--_lr-progress-indicator-variant-color:var(--lr-color-fill-loud)}:host([size="2xs"]){--_lr-progress-track-height:var(--lr-size-0-25rem)}:host([size=xs]){--_lr-progress-track-height:var(--lr-size-0-375rem)}:host([size=s]),:host([size=small]){--_lr-progress-track-height:var(--lr-size-0-625rem)}:host([size=l]),:host([size=large]){--_lr-progress-track-height:var(--lr-size-1-25rem)}:host([size=xl]){--_lr-progress-track-height:var(--lr-size-1-5rem)}[part~=base]{display:block}[part=track]{inline-size:100%;block-size:var(--lr-progress-track-height,var(--lr-progress-height,var(--track-height,var(--height,var(--_lr-progress-track-height)))));border-radius:var(--lr-radius-pill);background:var(--lr-progress-track-color,var(--track-color,var(--lr-color-brand-quiet)));overflow:hidden}[part=indicator]{border-radius:inherit;background:var(--lr-progress-indicator-color,var(--indicator-color,var(--lr-progress-indicator-variant-color,var(--_lr-progress-indicator-variant-color))));block-size:100%;transition:inline-size var(--lr-transition-base)}:host([indeterminate]) [part=indicator]{animation:lr-progress-slide var(--lr-progress-duration,var(--lr-transition-ambient)) infinite alternate}[part=label]{justify-content:space-between;gap:var(--lr-space-s);overflow-wrap:anywhere;min-inline-size:0;color:var(--lr-progress-label-color,var(--label-color,var(--lr-color-text)));font-size:var(--lr-font-size-sm);flex-wrap:wrap;margin-block-end:var(--lr-space-xs);display:flex}[part=label][hidden]{display:none}@keyframes lr-progress-slide{0%{transform:translate(-100%)}to{transform:translate(250%)}}:host([indeterminate]:dir(rtl)) [part=indicator]{animation-name:lr-progress-slide-rtl}@keyframes lr-progress-slide-rtl{0%{transform:translate(100%)}to{transform:translate(-250%)}}@media (prefers-reduced-motion:reduce){[part=indicator]{transition:none;animation:none!important}}`,ringStyles=css`:host{color:var(--lr-color-brand);--_lr-progress-ring-indicator-variant-color:var(--lr-color-brand);--_lr-progress-ring-size:var(--lr-size-2-5rem);display:inline-block}:host([variant]){--_lr-progress-ring-indicator-variant-color:var(--lr-color-fill-loud)}:host([size="2xs"]){--_lr-progress-ring-size:var(--lr-size-1-25rem)}:host([size=xs]){--_lr-progress-ring-size:var(--lr-size-1-75rem)}:host([size=s]),:host([size=small]){--_lr-progress-ring-size:var(--lr-size-2-25rem)}:host([size=l]),:host([size=large]){--_lr-progress-ring-size:var(--lr-size-3rem)}:host([size=xl]){--_lr-progress-ring-size:var(--lr-size-3-5rem)}[part~=base]{inline-size:var(--lr-progress-ring-size,var(--size,var(--_lr-progress-ring-size)));block-size:var(--lr-progress-ring-size,var(--size,var(--_lr-progress-ring-size)));justify-content:center;align-items:center;display:inline-flex;position:relative}svg{block-size:100%;inline-size:100%;transform:rotate(-90deg)}circle{fill:none;stroke-linecap:round}[part=track]{stroke:var(--lr-progress-ring-track-color,var(--track-color,var(--lr-color-brand-quiet)));stroke-width:var(--lr-progress-ring-track-width,var(--track-width,var(--lr-theme-progress-ring-track-width,var(--lr-size-4px))))}[part=indicator]{stroke:var(--lr-progress-ring-indicator-color,var(--indicator-color,var(--lr-progress-ring-indicator-variant-color,var(--_lr-progress-ring-indicator-variant-color))));stroke-width:var(--lr-progress-ring-indicator-width,var(--indicator-width,var(--lr-progress-ring-track-width,var(--track-width,var(--lr-theme-progress-ring-track-width,var(--lr-size-4px))))));transition:stroke-dashoffset var(--lr-progress-ring-indicator-transition-duration,var(--indicator-transition-duration,var(--lr-transition-base)))}:host([indeterminate]) [part=indicator]{transform-box:fill-box;transform-origin:50%;animation:lr-progress-ring-spin var(--lr-progress-duration,var(--lr-transition-ambient)) infinite}[part=label]{padding-inline:var(--lr-space-2xs);text-align:center;text-overflow:ellipsis;white-space:nowrap;color:var(--lr-color-text);font-size:var(--lr-font-size-sm);position:absolute;inset-inline:0;overflow:hidden}@keyframes lr-progress-ring-spin{to{transform:rotate(360deg)}}@media (prefers-reduced-motion:reduce){[part=indicator]{transition:none;animation:none!important}}`;export{ringStyles,styles};
|
|
1
|
+
import{css}from"lit";const styles=css`:host{color:var(--lr-color-brand);--_lr-progress-indicator-variant-color:var(--lr-color-brand);--_lr-progress-track-height:var(--lr-size-1rem);display:block}:host([variant]){--_lr-progress-indicator-variant-color:var(--lr-color-fill-loud)}:host([size="2xs"]){--_lr-progress-track-height:var(--lr-size-0-25rem)}:host([size=xs]){--_lr-progress-track-height:var(--lr-size-0-375rem)}:host([size=s]),:host([size=small]){--_lr-progress-track-height:var(--lr-size-0-625rem)}:host([size=l]),:host([size=large]){--_lr-progress-track-height:var(--lr-size-1-25rem)}:host([size=xl]){--_lr-progress-track-height:var(--lr-size-1-5rem)}[part~=base]{display:block}[part=track]{inline-size:100%;block-size:var(--lr-progress-track-height,var(--lr-progress-height,var(--track-height,var(--height,var(--_lr-progress-track-height)))));border-radius:var(--lr-progress-track-radius,var(--lr-radius-pill));background:var(--lr-progress-track-color,var(--track-color,var(--lr-color-brand-quiet)));overflow:hidden}[part=indicator]{border-radius:inherit;background:var(--lr-progress-indicator-color,var(--indicator-color,var(--lr-progress-indicator-variant-color,var(--_lr-progress-indicator-variant-color))));block-size:100%;transition:inline-size var(--lr-transition-base)}:host([indeterminate]) [part=indicator]{animation:lr-progress-slide var(--lr-progress-duration,var(--lr-transition-ambient)) infinite alternate}[part=label]{justify-content:space-between;gap:var(--lr-space-s);overflow-wrap:anywhere;min-inline-size:0;color:var(--lr-progress-label-color,var(--label-color,var(--lr-color-text)));font-size:var(--lr-font-size-sm);flex-wrap:wrap;margin-block-end:var(--lr-space-xs);display:flex}[part=label][hidden]{display:none}@keyframes lr-progress-slide{0%{transform:translate(-100%)}to{transform:translate(250%)}}:host([indeterminate]:dir(rtl)) [part=indicator]{animation-name:lr-progress-slide-rtl}@keyframes lr-progress-slide-rtl{0%{transform:translate(100%)}to{transform:translate(-250%)}}@media (prefers-reduced-motion:reduce){[part=indicator]{transition:none;animation:none!important}}`,ringStyles=css`:host{color:var(--lr-color-brand);--_lr-progress-ring-indicator-variant-color:var(--lr-color-brand);--_lr-progress-ring-size:var(--lr-size-2-5rem);display:inline-block}:host([variant]){--_lr-progress-ring-indicator-variant-color:var(--lr-color-fill-loud)}:host([size="2xs"]){--_lr-progress-ring-size:var(--lr-size-1-25rem)}:host([size=xs]){--_lr-progress-ring-size:var(--lr-size-1-75rem)}:host([size=s]),:host([size=small]){--_lr-progress-ring-size:var(--lr-size-2-25rem)}:host([size=l]),:host([size=large]){--_lr-progress-ring-size:var(--lr-size-3rem)}:host([size=xl]){--_lr-progress-ring-size:var(--lr-size-3-5rem)}[part~=base]{inline-size:var(--lr-progress-ring-size,var(--size,var(--_lr-progress-ring-size)));block-size:var(--lr-progress-ring-size,var(--size,var(--_lr-progress-ring-size)));justify-content:center;align-items:center;display:inline-flex;position:relative}svg{block-size:100%;inline-size:100%;transform:rotate(-90deg)}circle{fill:none;stroke-linecap:round}[part=track]{stroke:var(--lr-progress-ring-track-color,var(--track-color,var(--lr-color-brand-quiet)));stroke-width:var(--lr-progress-ring-track-width,var(--track-width,var(--lr-theme-progress-ring-track-width,var(--lr-size-4px))))}[part=indicator]{stroke:var(--lr-progress-ring-indicator-color,var(--indicator-color,var(--lr-progress-ring-indicator-variant-color,var(--_lr-progress-ring-indicator-variant-color))));stroke-width:var(--lr-progress-ring-indicator-width,var(--indicator-width,var(--lr-progress-ring-track-width,var(--track-width,var(--lr-theme-progress-ring-track-width,var(--lr-size-4px))))));transition:stroke-dashoffset var(--lr-progress-ring-indicator-transition-duration,var(--indicator-transition-duration,var(--lr-transition-base)))}:host([indeterminate]) [part=indicator]{transform-box:fill-box;transform-origin:50%;animation:lr-progress-ring-spin var(--lr-progress-duration,var(--lr-transition-ambient)) infinite}[part=label]{padding-inline:var(--lr-space-2xs);text-align:center;text-overflow:ellipsis;white-space:nowrap;color:var(--lr-color-text);font-size:var(--lr-font-size-sm);position:absolute;inset-inline:0;overflow:hidden}@keyframes lr-progress-ring-spin{to{transform:rotate(360deg)}}@media (prefers-reduced-motion:reduce){[part=indicator]{transition:none;animation:none!important}}`;export{ringStyles,styles};
|