@aceshooting/lyra-ui 14.0.0 → 14.1.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CHANGELOG.md +149 -19
- package/custom-elements.json +1 -1
- package/dist/components/agent-tools/commit-card/commit-card.class.d.ts +3 -1
- package/dist/components/agent-tools/commit-card/commit-card.class.js +2 -2
- package/dist/components/agent-tools/compare-panel/compare-panel.class.d.ts +2 -1
- package/dist/components/agent-tools/compare-panel/compare-panel.styles.js +1 -1
- package/dist/components/agent-tools/prompt-studio/prompt-studio.class.d.ts +6 -2
- package/dist/components/agent-tools/prompt-studio/prompt-studio.class.js +4 -4
- package/dist/components/agent-tools/result-card/result-card.class.d.ts +1 -1
- package/dist/components/agent-tools/result-card/result-card.class.js +1 -1
- package/dist/components/agent-tools/result-card/result-field.class.d.ts +1 -1
- package/dist/components/agent-tools/result-card/result-field.class.js +1 -1
- package/dist/components/agent-tools/stack-trace/stack-trace.class.d.ts +1 -1
- package/dist/components/agent-tools/stack-trace/stack-trace.class.js +1 -1
- package/dist/components/agent-tools/terminal/terminal.class.d.ts +1 -1
- package/dist/components/agent-tools/terminal/terminal.class.js +2 -2
- package/dist/components/agent-tools/tool-call-chip/tool-call-chip.class.d.ts +2 -2
- package/dist/components/agent-tools/tool-call-chip/tool-call-chip.class.js +1 -1
- package/dist/components/agent-tools/tool-param-form/tool-param-form.class.js +1 -1
- package/dist/components/agent-tools/tool-result-dialog/tool-result-dialog.class.js +2 -2
- package/dist/components/agent-tools/tool-select-dialog/tool-select-dialog.class.js +4 -4
- package/dist/components/agent-tools/trace-tree/span.d.ts +3 -1
- package/dist/components/agent-tools/trace-tree/span.js +1 -1
- package/dist/components/charts/chart/box-plot.class.d.ts +2 -0
- package/dist/components/charts/chart/box-plot.class.js +1 -1
- package/dist/components/charts/chart/chart.class.d.ts +6 -1
- package/dist/components/charts/chart/chart.class.js +1 -1
- package/dist/components/charts/chart/lite-chart.class.d.ts +20 -11
- package/dist/components/charts/chart/lite-chart.class.js +10 -8
- package/dist/components/conversation/chat-message/chat-message.class.d.ts +4 -3
- package/dist/components/conversation/code-block/code-block-core.class.d.ts +4 -3
- package/dist/components/conversation/code-block/code-block-core.class.js +1 -1
- package/dist/components/conversation/code-block/code-block-shared.d.ts +3 -3
- package/dist/components/conversation/code-block/code-block-shared.js +2 -2
- package/dist/components/conversation/code-block/code-block.class.d.ts +4 -3
- package/dist/components/conversation/code-block/code-block.class.js +1 -1
- package/dist/components/conversation/code-block/shiki-types.d.ts +2 -0
- package/dist/components/conversation/code-block/shiki-types.js +1 -1
- package/dist/components/conversation/conversation-item/conversation-item.class.js +1 -1
- package/dist/components/conversation/markdown/markdown-base.class.js +1 -1
- package/dist/components/conversation/markdown/markdown-core.class.d.ts +1 -1
- package/dist/components/conversation/markdown/markdown.class.d.ts +1 -1
- package/dist/components/conversation/message-actions/message-actions.class.d.ts +2 -0
- package/dist/components/conversation/message-actions/message-actions.class.js +1 -1
- package/dist/components/conversation/message-feedback/message-feedback.class.d.ts +3 -1
- package/dist/components/conversation/message-feedback/message-feedback.class.js +2 -2
- package/dist/components/conversation/message-parts/message-parts.class.d.ts +3 -0
- package/dist/components/conversation/model-select/model-select.class.js +3 -3
- package/dist/components/conversation/thread-list/thread-list.class.js +1 -1
- package/dist/components/conversation/transcript-feed/transcript-feed.class.d.ts +2 -0
- package/dist/components/conversation/transcript-feed/transcript-feed.class.js +1 -1
- package/dist/components/conversation/typing-indicator/typing-indicator.class.d.ts +2 -1
- package/dist/components/conversation/typing-indicator/typing-indicator.class.js +1 -1
- package/dist/components/conversation/usage-badge/usage-badge-overlay-runtime.d.ts +3 -0
- package/dist/components/conversation/usage-badge/usage-badge-overlay-runtime.js +1 -0
- package/dist/components/conversation/usage-badge/usage-badge.class.d.ts +4 -2
- package/dist/components/conversation/usage-badge/usage-badge.class.js +1 -1
- package/dist/components/conversation/voice-picker/voice-picker.class.js +3 -3
- package/dist/components/conversation/widget-renderer/resolve.d.ts +4 -6
- package/dist/components/conversation/widget-renderer/resolve.js +1 -1
- package/dist/components/data/calendar/calendar.class.d.ts +6 -3
- package/dist/components/data/calendar/calendar.class.js +1 -1
- package/dist/components/data/calendar/calendar.styles.js +1 -1
- package/dist/components/data/condition-builder/condition-builder.class.d.ts +3 -1
- package/dist/components/data/condition-builder/condition-builder.class.js +15 -1
- package/dist/components/data/context-meter/context-meter.class.js +2 -2
- package/dist/components/data/data-grid/data-grid.class.d.ts +6 -2
- package/dist/components/data/data-grid/data-grid.class.js +1 -1
- package/dist/components/data/document-library/document-library.class.d.ts +5 -2
- package/dist/components/data/document-library/document-library.class.js +1 -1
- package/dist/components/data/file-tree/file-tree.class.d.ts +2 -1
- package/dist/components/data/file-tree/file-tree.class.js +1 -1
- package/dist/components/data/flow-canvas/flow-canvas.class.d.ts +5 -2
- package/dist/components/data/flow-canvas/flow-canvas.styles.js +1 -1
- package/dist/components/data/flow-canvas/flow-model.js +1 -1
- package/dist/components/data/flow-canvas/flow-types.d.ts +2 -1
- package/dist/components/data/funnel/funnel.class.d.ts +1 -0
- package/dist/components/data/funnel/funnel.class.js +1 -1
- package/dist/components/data/gauge/gauge.class.d.ts +4 -1
- package/dist/components/data/gauge/gauge.class.js +6 -6
- package/dist/components/data/graph-query-builder/graph-query-builder.class.d.ts +5 -2
- package/dist/components/data/graph-query-builder/graph-query-builder.class.js +15 -1
- package/dist/components/data/heatmap/heatmap.class.d.ts +7 -4
- package/dist/components/data/heatmap/heatmap.class.js +1 -1
- package/dist/components/data/sparkline/sparkline.class.d.ts +2 -1
- package/dist/components/data/sparkline/sparkline.class.js +1 -1
- package/dist/components/data/stat/stat.class.d.ts +6 -2
- package/dist/components/data/stat/stat.class.js +1 -1
- package/dist/components/data/table/table.class.d.ts +5 -2
- package/dist/components/data/table/table.class.js +2 -2
- package/dist/components/data/timeline/timeline.class.d.ts +7 -2
- package/dist/components/data/timeline/timeline.class.js +1 -1
- package/dist/components/data/timeline/timeline.styles.js +1 -1
- package/dist/components/data/tree/tree-item.class.d.ts +3 -1
- package/dist/components/data/tree/tree-item.class.js +1 -1
- package/dist/components/data/tree/tree.class.d.ts +4 -1
- package/dist/components/data/tree/tree.class.js +1 -1
- package/dist/components/data/word-cloud/word-cloud-layout.d.ts +2 -1
- package/dist/components/data/word-cloud/word-cloud-layout.js +1 -1
- package/dist/components/data/word-cloud/word-cloud.class.d.ts +2 -1
- package/dist/components/forms/button/button.class.d.ts +5 -3
- package/dist/components/forms/button/button.class.js +1 -1
- package/dist/components/forms/checkbox/checkbox.class.d.ts +3 -0
- package/dist/components/forms/checkbox/checkbox.class.js +1 -1
- package/dist/components/forms/code-editor/code-editor.class.d.ts +11 -3
- package/dist/components/forms/code-editor/code-editor.class.js +6 -7
- package/dist/components/forms/code-editor/code-editor.styles.js +1 -1
- package/dist/components/forms/color-picker/color-picker.class.d.ts +5 -1
- package/dist/components/forms/color-picker/color-picker.class.js +4 -4
- package/dist/components/forms/combobox/combobox.class.d.ts +19 -8
- package/dist/components/forms/combobox/combobox.class.js +3 -3
- package/dist/components/forms/combobox/option.class.d.ts +4 -0
- package/dist/components/forms/combobox/option.class.js +2 -2
- package/dist/components/forms/date-picker/calendar-core.d.ts +1 -1
- package/dist/components/forms/date-picker/calendar-core.js +1 -1
- package/dist/components/forms/date-picker/date-input.class.d.ts +20 -10
- package/dist/components/forms/date-picker/date-input.class.js +4 -4
- package/dist/components/forms/date-picker/date-picker.class.d.ts +24 -13
- package/dist/components/forms/date-picker/date-picker.class.js +7 -7
- package/dist/components/forms/date-picker/date-picker.styles.js +1 -1
- package/dist/components/forms/emoji-picker/emoji-picker.class.d.ts +11 -3
- package/dist/components/forms/emoji-picker/emoji-picker.class.js +3 -3
- package/dist/components/forms/emoji-picker/emoji-types.d.ts +2 -2
- package/dist/components/forms/icon-button/icon-button.class.d.ts +4 -2
- package/dist/components/forms/icon-button/icon-button.class.js +1 -1
- package/dist/components/forms/input/input.class.d.ts +5 -1
- package/dist/components/forms/input/input.class.js +1 -1
- package/dist/components/forms/input/native-time-input.class.d.ts +3 -0
- package/dist/components/forms/input/number-input.class.d.ts +3 -0
- package/dist/components/forms/input/time-input.class.d.ts +3 -0
- package/dist/components/forms/input/time-input.class.js +1 -1
- package/dist/components/forms/locale-picker/locale-picker.class.d.ts +5 -1
- package/dist/components/forms/locale-picker/locale-picker.class.js +2 -2
- package/dist/components/forms/otp-input/otp-input.class.d.ts +5 -1
- package/dist/components/forms/otp-input/otp-input.class.js +1 -1
- package/dist/components/forms/phone-input/phone-input.class.d.ts +21 -8
- package/dist/components/forms/phone-input/phone-input.class.js +1 -1
- package/dist/components/forms/radio/radio-button.class.d.ts +4 -0
- package/dist/components/forms/radio/radio-group.class.d.ts +4 -1
- package/dist/components/forms/radio/radio-group.class.js +1 -1
- package/dist/components/forms/radio/radio.class.d.ts +6 -2
- package/dist/components/forms/radio/radio.class.js +1 -1
- package/dist/components/forms/rubric-form/rubric-form.class.d.ts +7 -1
- package/dist/components/forms/rubric-form/rubric-form.class.js +3 -3
- package/dist/components/forms/select/select.class.d.ts +8 -2
- package/dist/components/forms/select/select.class.js +2 -2
- package/dist/components/forms/slider/slider.class.d.ts +12 -6
- package/dist/components/forms/slider/slider.class.js +2 -2
- package/dist/components/forms/swatch-picker/swatch-picker.class.d.ts +4 -0
- package/dist/components/forms/swatch-picker/swatch-picker.class.js +1 -1
- package/dist/components/forms/switch/switch.class.d.ts +5 -1
- package/dist/components/forms/switch/switch.class.js +1 -1
- package/dist/components/forms/textarea/textarea.class.d.ts +3 -0
- package/dist/components/forms/textarea/textarea.class.js +1 -1
- package/dist/components/forms/time-range/time-range.class.d.ts +3 -0
- package/dist/components/forms/time-range/time-range.class.js +1 -1
- package/dist/components/forms/token-input/token-input.class.d.ts +8 -2
- package/dist/components/forms/token-input/token-input.class.js +2 -2
- package/dist/components/forms/token-input/token-input.styles.js +1 -1
- package/dist/components/layout/app-rail/app-rail.class.d.ts +3 -1
- package/dist/components/layout/app-rail/app-rail.class.js +1 -1
- package/dist/components/layout/carousel/carousel.class.d.ts +3 -2
- package/dist/components/layout/carousel/carousel.class.js +1 -1
- package/dist/components/layout/command-palette/command-palette.class.js +1 -1
- package/dist/components/layout/dashboard-grid/dashboard-grid.class.d.ts +2 -0
- package/dist/components/layout/dashboard-grid/dashboard-grid.class.js +1 -1
- package/dist/components/layout/details/details.class.d.ts +3 -3
- package/dist/components/layout/filter-bar/filter-bar.class.d.ts +3 -1
- package/dist/components/layout/filter-bar/filter-bar.class.js +1 -1
- package/dist/components/layout/menu/menu-label.class.d.ts +3 -3
- package/dist/components/layout/menu/menu.class.d.ts +4 -1
- package/dist/components/layout/menu/menu.class.js +1 -1
- package/dist/components/layout/multi-split/multi-split.class.d.ts +9 -3
- package/dist/components/layout/multi-split/multi-split.class.js +1 -1
- package/dist/components/layout/multi-split/multi-split.styles.js +1 -1
- package/dist/components/layout/reorder-list/reorder-item.class.d.ts +2 -1
- package/dist/components/layout/reorder-list/reorder-item.class.js +1 -1
- package/dist/components/layout/reorder-list/reorder-list.class.js +1 -1
- package/dist/components/layout/reorder-list/reorder-owner.js +1 -1
- package/dist/components/layout/split-panel/split-panel.class.d.ts +2 -1
- package/dist/components/layout/split-panel/split-panel.class.js +1 -1
- package/dist/components/layout/tab-group/tab-group.class.d.ts +3 -1
- package/dist/components/layout/tab-group/tab-group.class.js +1 -1
- package/dist/components/layout/widget/widget.class.d.ts +6 -2
- package/dist/components/layout/widget/widget.class.js +1 -1
- package/dist/components/media/animation/animation.class.d.ts +3 -2
- package/dist/components/media/animation/animation.class.js +1 -1
- package/dist/components/media/attachment-chip/attachment-chip.class.d.ts +4 -3
- package/dist/components/media/attachment-chip/attachment-chip.class.js +1 -1
- package/dist/components/media/av-player/av-metadata.d.ts +3 -2
- package/dist/components/media/av-player/av-player.class.d.ts +4 -3
- package/dist/components/media/av-player/av-player.class.js +3 -3
- package/dist/components/media/av-player/av-player.styles.js +1 -1
- package/dist/components/media/avatar/avatar.class.d.ts +2 -1
- package/dist/components/media/avatar/avatar.class.js +1 -1
- package/dist/components/media/file-input/file-input.class.d.ts +4 -2
- package/dist/components/media/file-input/file-input.class.js +1 -1
- package/dist/components/media/file-input/file-input.styles.js +1 -1
- package/dist/components/media/image-viewer/image-viewer.class.d.ts +2 -1
- package/dist/components/media/image-viewer/image-viewer.class.js +1 -1
- package/dist/components/media/image-viewer/image-viewer.styles.js +1 -1
- package/dist/components/media/map/map.class.d.ts +5 -3
- package/dist/components/media/map/map.class.js +1 -1
- package/dist/components/media/map/map.styles.js +1 -1
- package/dist/components/media/media-card/media-card.class.d.ts +1 -1
- package/dist/components/media/media-card/media-card.class.js +1 -1
- package/dist/components/media/pan-zoom/pan-zoom.class.js +1 -1
- package/dist/components/media/sequence-playback/sequence-playback.class.d.ts +1 -1
- package/dist/components/media/sequence-playback/sequence-playback.styles.js +1 -1
- package/dist/components/media/video/video.class.d.ts +2 -1
- package/dist/components/media/video/video.styles.js +1 -1
- package/dist/components/media/zoomable-frame/zoomable-frame.class.d.ts +3 -2
- package/dist/components/media/zoomable-frame/zoomable-frame.class.js +2 -2
- package/dist/components/overlays/chip/chip-group.class.d.ts +2 -0
- package/dist/components/overlays/chip/chip-group.class.js +1 -1
- package/dist/components/overlays/dialog/dialog.class.d.ts +2 -0
- package/dist/components/overlays/dialog/dialog.class.js +1 -1
- package/dist/components/overlays/empty/empty.class.d.ts +2 -0
- package/dist/components/overlays/empty/empty.class.js +1 -1
- package/dist/components/overlays/kbd/kbd.class.d.ts +2 -0
- package/dist/components/overlays/kbd/kbd.class.js +1 -1
- package/dist/components/overlays/overlay/popover.class.d.ts +3 -1
- package/dist/components/overlays/overlay/popover.class.js +1 -1
- package/dist/components/overlays/overlay/tooltip.class.d.ts +3 -1
- package/dist/components/overlays/overlay/tooltip.class.js +1 -1
- package/dist/components/overlays/rating/rating.class.d.ts +2 -0
- package/dist/components/overlays/rating/rating.class.js +1 -1
- package/dist/components/retrieval/embedding-explorer/embedding-explorer.class.js +2 -2
- package/dist/components/retrieval/entity-card/entity-card.class.d.ts +5 -2
- package/dist/components/retrieval/entity-card/entity-card.class.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/graph/graph-canvas.js +1 -1
- package/dist/components/retrieval/graph/graph.class.d.ts +9 -7
- package/dist/components/retrieval/graph/graph.class.js +1 -1
- package/dist/components/retrieval/grounding-summary/grounding-summary.class.d.ts +1 -3
- package/dist/components/retrieval/ingestion-queue/ingestion-queue.class.d.ts +2 -0
- package/dist/components/retrieval/ingestion-queue/ingestion-queue.class.js +1 -1
- package/dist/components/retrieval/knowledge-graph-explorer/knowledge-graph-explorer.class.d.ts +3 -2
- package/dist/components/retrieval/knowledge-graph-explorer/knowledge-graph-explorer.class.js +7 -3
- package/dist/components/retrieval/provenance-panel/provenance-panel.class.d.ts +2 -1
- package/dist/components/retrieval/provenance-panel/provenance-panel.class.js +1 -1
- package/dist/components/retrieval/source-picker/source-picker.class.d.ts +2 -1
- package/dist/components/retrieval/source-picker/source-picker.class.js +1 -1
- package/dist/components/utility/format/format-number.class.d.ts +3 -1
- package/dist/components/utility/format/format-options.js +1 -1
- package/dist/components/utility/json-viewer/json-viewer.class.d.ts +3 -2
- package/dist/components/utility/json-viewer/json-viewer.class.js +2 -2
- package/dist/components/utility/known-date/known-date.class.d.ts +9 -5
- package/dist/components/utility/known-date/known-date.class.js +2 -2
- package/dist/components/utility/known-date/known-date.styles.js +1 -1
- package/dist/components/utility/mention-popover/mention-popover.class.d.ts +3 -1
- package/dist/components/utility/mention-popover/mention-popover.class.js +1 -1
- package/dist/components/utility/poll-status/poll-status.class.d.ts +3 -0
- package/dist/components/utility/poll-status/poll-status.styles.js +1 -1
- package/dist/components/viewers/calendar-viewer/calendar-viewer.class.d.ts +1 -0
- package/dist/components/viewers/calendar-viewer/calendar-viewer.class.js +1 -1
- package/dist/components/viewers/dataset-viewer/dataset-viewer.class.d.ts +2 -1
- package/dist/components/viewers/dataset-viewer/dataset-viewer.styles.js +1 -1
- package/dist/components/viewers/document-preview/document-preview.class.d.ts +4 -2
- package/dist/components/viewers/document-preview/document-preview.class.js +1 -1
- package/dist/components/viewers/document-preview/document-preview.styles.js +1 -1
- package/dist/components/viewers/document-viewer/document-viewer.class.d.ts +3 -2
- package/dist/components/viewers/document-viewer/document-viewer.class.js +2 -2
- package/dist/components/viewers/document-viewer/registry-ownership.d.ts +1 -0
- package/dist/components/viewers/document-viewer/registry-ownership.js +1 -0
- package/dist/components/viewers/document-viewer/registry.js +1 -1
- package/dist/components/viewers/ebook-viewer/ebook-viewer.class.d.ts +7 -1
- package/dist/components/viewers/ebook-viewer/ebook-viewer.class.js +1 -1
- package/dist/components/viewers/email-viewer/email-viewer.class.d.ts +2 -1
- package/dist/components/viewers/email-viewer/email-viewer.class.js +2 -2
- package/dist/components/viewers/include/include-resource.js +1 -1
- package/dist/components/viewers/include/include.class.d.ts +3 -1
- package/dist/components/viewers/notebook-viewer/notebook-viewer.class.d.ts +4 -2
- package/dist/components/viewers/notebook-viewer/notebook-viewer.class.js +4 -4
- package/dist/components/viewers/notebook-viewer/notebook-viewer.styles.js +1 -1
- package/dist/components/viewers/passive-markup.js +1 -1
- package/dist/components/viewers/svg-viewer/svg-viewer.class.d.ts +2 -1
- package/dist/components/viewers/svg-viewer/svg-viewer.styles.js +1 -1
- package/dist/components/viewers/xml-viewer/xml-viewer.class.d.ts +2 -1
- package/dist/components/viewers/xml-viewer/xml-viewer.class.js +1 -1
- package/dist/components/viewers/xml-viewer/xml-viewer.js +1 -1
- package/dist/custom-elements-jsx.d.ts +1 -1
- package/dist/internal/aria-reflection.js +1 -1
- 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 +1 -1
- package/dist/internal/dev-mode-attribute-warning.d.ts +3 -0
- package/dist/internal/dev-mode-attribute-warning.js +1 -1
- package/dist/internal/form-associated.js +1 -1
- package/dist/internal/localization-types.d.ts +1 -1
- package/dist/internal/localization.js +1 -1
- package/dist/internal/lyra-element.js +1 -1
- package/dist/internal/native-control-description.d.ts +7 -0
- package/dist/internal/native-control-description.js +1 -0
- package/dist/internal/option-selection.js +1 -1
- package/dist/internal/overlay-order.d.ts +6 -0
- package/dist/internal/overlay-order.js +1 -0
- package/dist/internal/overlay-stack.d.ts +1 -1
- package/dist/internal/overlay-stack.js +1 -1
- package/dist/internal/package-metadata.d.ts +1 -1
- package/dist/internal/package-metadata.js +1 -1
- package/dist/internal/positioner.d.ts +5 -4
- package/dist/internal/reactive-property-writes.d.ts +1 -0
- package/dist/internal/reactive-property-writes.js +1 -0
- package/dist/internal/svg-title.d.ts +3 -0
- package/dist/internal/svg-title.js +1 -0
- package/dist/svelte.d.ts +1 -1
- package/dist/translations/ar.js +1 -1
- package/dist/translations/de.js +1 -1
- package/dist/translations/es.js +1 -1
- package/dist/translations/fa.js +1 -1
- package/dist/translations/fr.js +1 -1
- package/dist/translations/he.js +1 -1
- package/dist/translations/ja.js +1 -1
- package/dist/translations/pt-BR.js +1 -1
- package/dist/translations/ru.js +1 -1
- package/dist/translations/zh-CN.js +1 -1
- package/dist/vue.d.ts +1 -1
- package/llms/components/lr-accordion-item.md +4 -0
- package/llms/components/lr-accordion.md +4 -0
- package/llms/components/lr-agent-trace.md +3 -0
- package/llms/components/lr-animation.md +4 -0
- package/llms/components/lr-app-rail-item.md +4 -2
- package/llms/components/lr-app-rail.md +4 -2
- package/llms/components/lr-attachment-chip.md +6 -0
- package/llms/components/lr-av-player.md +14 -0
- package/llms/components/lr-avatar.md +4 -0
- package/llms/components/lr-box-plot.md +6 -0
- package/llms/components/lr-button.md +11 -3
- package/llms/components/lr-calendar-viewer.md +4 -0
- package/llms/components/lr-calendar.md +5 -0
- package/llms/components/lr-carousel.md +5 -0
- package/llms/components/lr-chart.md +13 -4
- package/llms/components/lr-chat-message.md +4 -0
- package/llms/components/lr-checkbox.md +3 -0
- package/llms/components/lr-chip-group.md +3 -0
- package/llms/components/lr-chip.md +3 -0
- package/llms/components/lr-code-block-core.md +16 -4
- package/llms/components/lr-code-block.md +7 -0
- package/llms/components/lr-code-editor.md +18 -5
- package/llms/components/lr-color-picker.md +9 -0
- package/llms/components/lr-combobox.md +35 -4
- package/llms/components/lr-command-palette.md +4 -0
- package/llms/components/lr-commit-card.md +3 -0
- package/llms/components/lr-compare-panel.md +7 -0
- package/llms/components/lr-condition-builder.md +5 -0
- package/llms/components/lr-conversation-item.md +3 -0
- package/llms/components/lr-copy-button.md +6 -0
- package/llms/components/lr-dashboard-grid.md +5 -0
- package/llms/components/lr-data-grid.md +11 -1
- package/llms/components/lr-dataset-viewer.md +3 -2
- package/llms/components/lr-date-input.md +46 -6
- package/llms/components/lr-date-picker.md +46 -6
- package/llms/components/lr-details.md +4 -0
- package/llms/components/lr-dialog.md +4 -0
- package/llms/components/lr-document-library.md +4 -0
- package/llms/components/lr-document-preview.md +7 -1
- package/llms/components/lr-document-viewer.md +9 -3
- package/llms/components/lr-dropdown-item.md +4 -0
- package/llms/components/lr-dropdown.md +3 -0
- package/llms/components/lr-ebook-viewer.md +4 -0
- package/llms/components/lr-email-viewer.md +5 -0
- package/llms/components/lr-emoji-picker.md +17 -3
- package/llms/components/lr-empty.md +3 -0
- package/llms/components/lr-entity-card.md +3 -0
- package/llms/components/lr-entity-chip.md +4 -0
- package/llms/components/lr-file-input.md +7 -0
- package/llms/components/lr-file-tree.md +5 -1
- package/llms/components/lr-filter-bar.md +5 -0
- package/llms/components/lr-flow-canvas.md +8 -1
- package/llms/components/lr-flow-node.md +2 -1
- package/llms/components/lr-flow-run-status.md +1 -1
- package/llms/components/lr-format-number.md +4 -0
- package/llms/components/lr-funnel.md +4 -0
- package/llms/components/lr-gauge.md +4 -0
- package/llms/components/lr-generation-metrics.md +5 -0
- package/llms/components/lr-graph-query-builder.md +6 -0
- package/llms/components/lr-graph.md +8 -2
- package/llms/components/lr-heatmap.md +13 -0
- package/llms/components/lr-icon-button.md +7 -0
- package/llms/components/lr-image-viewer.md +9 -0
- package/llms/components/lr-include.md +5 -0
- package/llms/components/lr-ingestion-queue.md +4 -0
- package/llms/components/lr-input.md +22 -8
- package/llms/components/lr-json-viewer.md +4 -0
- package/llms/components/lr-kbd.md +3 -0
- package/llms/components/lr-knowledge-graph-explorer.md +7 -0
- package/llms/components/lr-known-date.md +7 -0
- package/llms/components/lr-lite-chart.md +21 -4
- package/llms/components/lr-live-region.md +3 -0
- package/llms/components/lr-locale-picker.md +6 -0
- package/llms/components/lr-map.md +8 -0
- package/llms/components/lr-markdown-core.md +4 -0
- package/llms/components/lr-markdown.md +8 -4
- package/llms/components/lr-media-card.md +5 -2
- package/llms/components/lr-mention-popover.md +5 -0
- package/llms/components/lr-menu-item.md +4 -0
- package/llms/components/lr-menu-label.md +4 -3
- package/llms/components/lr-menu.md +4 -0
- package/llms/components/lr-message-actions.md +3 -0
- package/llms/components/lr-message-feedback.md +4 -0
- package/llms/components/lr-message-parts.md +3 -2
- package/llms/components/lr-model-select.md +8 -0
- package/llms/components/lr-multi-split.md +15 -6
- package/llms/components/lr-native-time-input.md +10 -0
- package/llms/components/lr-node-palette.md +3 -0
- package/llms/components/lr-notebook-viewer.md +4 -1
- package/llms/components/lr-number-input.md +12 -1
- package/llms/components/lr-option.md +35 -4
- package/llms/components/lr-otp-input.md +10 -0
- package/llms/components/lr-pan-zoom.md +1 -2
- package/llms/components/lr-phone-input.md +20 -5
- package/llms/components/lr-poll-status.md +4 -0
- package/llms/components/lr-popover.md +3 -0
- package/llms/components/lr-popup.md +3 -2
- package/llms/components/lr-prompt-studio.md +7 -0
- package/llms/components/lr-provenance-panel.md +3 -0
- package/llms/components/lr-push-to-talk.md +3 -0
- package/llms/components/lr-radio-button.md +13 -4
- package/llms/components/lr-radio-group.md +5 -0
- package/llms/components/lr-radio.md +9 -0
- package/llms/components/lr-rating.md +3 -0
- package/llms/components/lr-reorder-item.md +6 -0
- package/llms/components/lr-reorder-list.md +6 -0
- package/llms/components/lr-result-card.md +3 -0
- package/llms/components/lr-result-field.md +3 -0
- package/llms/components/lr-rubric-form.md +12 -0
- package/llms/components/lr-select.md +9 -0
- package/llms/components/lr-sequence-playback.md +4 -0
- package/llms/components/lr-slider.md +16 -4
- package/llms/components/lr-source-picker.md +4 -0
- package/llms/components/lr-span-waterfall.md +3 -0
- package/llms/components/lr-sparkline.md +4 -0
- package/llms/components/lr-split-panel.md +4 -0
- package/llms/components/lr-stack-trace.md +3 -0
- package/llms/components/lr-stat.md +10 -0
- package/llms/components/lr-subagent-panel.md +3 -2
- package/llms/components/lr-svg-viewer.md +3 -0
- package/llms/components/lr-swatch-picker.md +4 -0
- package/llms/components/lr-switch.md +6 -0
- package/llms/components/lr-tab-group.md +4 -0
- package/llms/components/lr-table.md +10 -2
- package/llms/components/lr-terminal.md +3 -0
- package/llms/components/lr-textarea.md +9 -0
- package/llms/components/lr-thread-list.md +6 -3
- package/llms/components/lr-time-input.md +3 -0
- package/llms/components/lr-time-range.md +5 -0
- package/llms/components/lr-timeline-item.md +6 -0
- package/llms/components/lr-timeline.md +6 -0
- package/llms/components/lr-token-input.md +14 -0
- package/llms/components/lr-tool-call-chip.md +5 -3
- package/llms/components/lr-tool-param-form.md +4 -0
- package/llms/components/lr-tool-result-dialog.md +4 -0
- package/llms/components/lr-tool-select-dialog.md +4 -0
- package/llms/components/lr-tooltip.md +6 -0
- package/llms/components/lr-trace-tree.md +3 -0
- package/llms/components/lr-transcript-feed.md +3 -0
- package/llms/components/lr-tree-item.md +12 -5
- package/llms/components/lr-tree.md +12 -5
- package/llms/components/lr-typing-indicator.md +3 -0
- package/llms/components/lr-usage-badge.md +4 -0
- package/llms/components/lr-video.md +8 -2
- package/llms/components/lr-virtual-list.md +5 -3
- package/llms/components/lr-voice-picker.md +8 -0
- package/llms/components/lr-widget-renderer.md +9 -0
- package/llms/components/lr-widget.md +4 -2
- package/llms/components/lr-word-cloud.md +4 -0
- package/llms/components/lr-xml-viewer.md +9 -2
- package/llms/components/lr-zoomable-frame.md +6 -3
- package/llms-full.txt +4080 -2711
- package/package.json +2 -2
- package/vscode-css-data.json +1 -1
- package/vscode-html-data.json +1 -1
- package/web-types.json +1 -1
|
@@ -1,4 +1,4 @@
|
|
|
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{hostAriaLabel,nextId,resolveAccessibleTrigger}from"../../../internal/a11y.js";import{acquireAriaOwnership}from"../../../internal/aria-ownership.js";import{tag}from"../../../internal/prefix.js";import{loadAnchoredOverlayRuntime}from"../../../internal/anchored-overlay-runtime.js";import{rtlAwarePlacement}from"../../../internal/rtl.js";import{finiteNumber}from"../../../internal/numbers.js";import{literalSetConverter,omittedEmptyStringConverter,trueDefaultBooleanConverter}from"../../../internal/converters.js";import{activateNonmodalOverlay}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");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.accessibleLabel="",this._popupRole="dialog",this._disabled=!1,this.resolvedSide="bottom",this.anchorPositioned=!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=>{const next=event.target.assignedElements({flatten:!0})[0];next!==this.slottedTrigger&&(this.slottedTrigger=next,this.syncInteractionTrigger())},this.onTriggerClick=()=>{this.virtualAnchor||(this.syncTriggerA11y(),this.open?this.hide():this.show())},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 for(){return this._for}set for(next){this._for=next??""}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 positioningStrategy(){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 canOpen(){return!this.disabled}renderPopupContent(){return html`<slot></slot>`}onTriggerKeyDown(_event){}isInsideLightDismissBoundary(path){return path.includes(this)||this.trigger!=null&&path.includes(this.trigger)}onPopupPositioned(){this.overlayHandle?.focusAutofocus()}willUpdate(changed){super.willUpdate(changed),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){super.updated(changed),(changed.has("for")||changed.has("anchor")||changed.has("open"))&&this.syncAnchorIdentityObservation(),changed.has("for")&&this.syncInteractionTrigger(),(changed.has("open")||changed.has("placement")||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"))&&(this.open&&this.isConnected?this.positionPopup():changed.has("open")&&this.invalidatePositioning(),changed.has("open")&&(this.open?this.isConnected&&(this.startLightDismiss(),this.activatePopoverOverlay()):(this.positionedAnchor=void 0,this.stopLightDismiss(),this.overlayHandle?.deactivate(),this.overlayHandle=void 0,this.virtualAnchor=void 0,this.returnFocusTo=void 0,this.syncInteractionTrigger())),this.isConnected&&this.syncTriggerA11y())}connectedCallback(){if(super.connectedCallback(),this.connectionSequence=++popoverConnectionSequence,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.trigger?.removeEventListener("click",this.onTriggerClick),this.trigger?.removeEventListener("keydown",this.onExternalTriggerKeyDown),this.releaseTriggerA11y(),this.trigger=void 0,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.trigger){this.syncTriggerA11y();return}if(this.trigger?.removeEventListener("click",this.onTriggerClick),this.trigger?.removeEventListener("keydown",this.onExternalTriggerKeyDown),this.trigger=next,this.trigger&&this.trigger!==this.slottedTrigger&&(this.trigger.addEventListener("click",this.onTriggerClick),this.trigger.addEventListener("keydown",this.onExternalTriggerKeyDown)),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.trigger})}positionPopup(){this.invalidatePositioning();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;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)}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){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:this.positioningStrategy,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)),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.trigger??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.trigger?resolveAccessibleTrigger(this.trigger):null}releaseTriggerA11y(){this.accessibleTriggerAria?.release(),this.accessibleTriggerAria=void 0,this.triggerAria?.release(),this.triggerAria=void 0}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,state}from"lit/decorators.js";import{LyraElement}from"../../../internal/lyra-element.js";import{hostAriaLabel,nextId,resolveAccessibleTrigger}from"../../../internal/a11y.js";import{acquireAriaOwnership}from"../../../internal/aria-ownership.js";import{tag}from"../../../internal/prefix.js";import{loadAnchoredOverlayRuntime}from"../../../internal/anchored-overlay-runtime.js";import{rtlAwarePlacement}from"../../../internal/rtl.js";import{finiteNumber}from"../../../internal/numbers.js";import{literalSetConverter,omittedEmptyStringConverter,trueDefaultBooleanConverter}from"../../../internal/converters.js";import{activateNonmodalOverlay}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");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.accessibleLabel="",this._popupRole="dialog",this._disabled=!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=>{const next=event.target.assignedElements({flatten:!0})[0];next!==this.slottedTrigger&&(this.slottedTrigger=next,this.syncInteractionTrigger())},this.onTriggerClick=()=>{this.virtualAnchor||(this.syncTriggerA11y(),this.open?this.hide():this.show())},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 for(){return this._for}set for(next){this._for=next??""}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 positioningStrategy(){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 canOpen(){return!this.disabled}renderPopupContent(){return html`<slot></slot>`}onTriggerKeyDown(_event){}isInsideLightDismissBoundary(path){return path.includes(this)||this.trigger!=null&&path.includes(this.trigger)}onPopupPositioned(){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){super.updated(changed),(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("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"))&&(this.open&&this.isConnected?this.positionPopup():changed.has("open")&&this.invalidatePositioning(),changed.has("open")&&(this.open?this.isConnected&&(this.startLightDismiss(),this.activatePopoverOverlay()):(this.positionedAnchor=void 0,this.stopLightDismiss(),this.overlayHandle?.deactivate(),this.overlayHandle=void 0,this.virtualAnchor=void 0,this.returnFocusTo=void 0,this.syncInteractionTrigger())),this.isConnected&&this.syncTriggerA11y())}connectedCallback(){if(super.connectedCallback(),this.connectionSequence=++popoverConnectionSequence,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.trigger?.removeEventListener("click",this.onTriggerClick),this.trigger?.removeEventListener("keydown",this.onExternalTriggerKeyDown),this.releaseTriggerA11y(),this.trigger=void 0,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.trigger){this.syncTriggerA11y();return}if(this.trigger?.removeEventListener("click",this.onTriggerClick),this.trigger?.removeEventListener("keydown",this.onExternalTriggerKeyDown),this.trigger=next,this.trigger&&this.trigger!==this.slottedTrigger&&(this.trigger.addEventListener("click",this.onTriggerClick),this.trigger.addEventListener("keydown",this.onExternalTriggerKeyDown)),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.trigger})}positionPopup(){this.invalidatePositioning();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;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)}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){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:this.positioningStrategy,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)),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.trigger??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.trigger?resolveAccessibleTrigger(this.trigger):null}releaseTriggerA11y(){this.accessibleTriggerAria?.release(),this.accessibleTriggerAria=void 0,this.triggerAria?.release(),this.triggerAria=void 0}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`
|
|
2
2
|
<span part="trigger" @click=${this.onTriggerClick} @keydown=${this.onTriggerKeyDown}>
|
|
3
3
|
<slot name="trigger" @slotchange=${this.onTriggerSlotChange}></slot>
|
|
4
4
|
</span>
|
|
@@ -45,6 +45,8 @@ export type LyraTooltipTrigger='hover'|'focus'|'click'|'manual';export type{Lyra
|
|
|
45
45
|
* Bubbling `focusin`/`focusout` observes those real composed targets, and moving focus within the
|
|
46
46
|
* trigger or between interactive popup controls does not spuriously close the tooltip.
|
|
47
47
|
*
|
|
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
|
+
*
|
|
48
50
|
* @customElement lr-tooltip
|
|
49
51
|
* @slot trigger - Web Awesome shape: the highest-priority interaction/ARIA owner.
|
|
50
52
|
* @slot - Web Awesome shape: tooltip content; Shoelace shape: the trigger when no named trigger
|
|
@@ -127,7 +129,7 @@ arrowPlacement:LyraArrowPlacement;
|
|
|
127
129
|
arrowPadding:number;content:string;accessibleLabel:string;private triggerElement?;private slottedTriggerElement?;
|
|
128
130
|
/** True when the default slot is tooltip content (WA mode). False only when an explicit
|
|
129
131
|
* Shoelace content source makes the default slot unambiguously the trigger. */
|
|
130
|
-
private namedTriggerMode;private interactiveContent;private resolvedSide;private anchorPositioned;private positionedAnchor?;private observedDirectAnchor?;private observedDirectAnchorWasConnected;private stopAnchorIdentityObservation?;private triggerAria?;private accessibleTriggerAria?;
|
|
132
|
+
private namedTriggerMode;private interactiveContent;private resolvedSide;private anchorPositioned;private positionedAnchor?;private positioningDirection?;private directionChanged;private observedDirectAnchor?;private observedDirectAnchorWasConnected;private stopAnchorIdentityObservation?;private triggerAria?;private accessibleTriggerAria?;
|
|
131
133
|
/** The virtual anchor set by `showAt()`, taking priority over `for`/`trigger` for positioning
|
|
132
134
|
* while set. Cleared whenever the tooltip closes, so a later `open = true` with no fresh
|
|
133
135
|
* `showAt()` call reverts to plain trigger-based behavior. */
|
|
@@ -1,4 +1,4 @@
|
|
|
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,trueDefaultBooleanConverter}from"../../../internal/converters.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}}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.hoist=!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.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 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),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(),changed.has("open")||changed.has("placement")||changed.has("distance")||changed.has("skidding")||changed.has("for")||changed.has("anchor")||changed.has("hoist")||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:this.hoist?"fixed":"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}from"../../../internal/active-element.js";import{finiteDuration,finiteNumber}from"../../../internal/numbers.js";import{omittedEmptyStringConverter,trueDefaultBooleanConverter}from"../../../internal/converters.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}}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.hoist=!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 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("hoist")||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:this.hoist?"fixed":"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`
|
|
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>
|
|
@@ -33,6 +33,8 @@ export type LyraRatingSymbolRenderer=(value:number,selected:boolean)=>unknown;ex
|
|
|
33
33
|
* label text. A rating is a row of symbols with no field frame of its own, so a consumer wanting a
|
|
34
34
|
* labeled field wraps this element in their own layout, exactly as `<lr-slider>` does.
|
|
35
35
|
*
|
|
36
|
+
* Readonly transitions synchronize validity and aria-invalid in the same completed update. Form reset restores the independent default-value rather than the live value attribute.
|
|
37
|
+
*
|
|
36
38
|
* @customElement lr-rating
|
|
37
39
|
* @event change - Bubbling, composed native `Event` emitted when a user commits a new value,
|
|
38
40
|
* immediately before `lr-change`. Programmatic writes and no-op gestures are silent.
|
|
@@ -1,4 +1,4 @@
|
|
|
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,svg}from"lit";import{property,state}from"lit/decorators.js";import{LyraElement}from"../../../internal/lyra-element.js";import{finiteCount,finiteNumber,finiteRange}from"../../../internal/numbers.js";import{getNumberFormat}from"../../../internal/intl-cache.js";import{attachInternalsSafely,getFormOwner,installCustomErrorProperty,isBarredFromValidation,setFormOwner}from"../../../internal/form-associated.js";import{syncValidityStates}from"../../../internal/custom-states.js";import{AnchoredValidityController,VALIDITY_ANCHOR}from"../../../internal/anchored-validity.js";import{normalizeSize}from"../../../internal/variants.js";import{styles}from"./rating.styles.js";import{dispatchNativeEvent}from"../../../internal/native-event-relay.js";import{installInvalidEventAlias}from"../../../internal/invalid-event-alias.js";import{omittedEmptyStringConverter}from"../../../internal/converters.js";import{EXTERNAL_LABEL_HOST_SEMANTICS,installFormControlLabelSupport}from"../../../internal/form-control-labels.js";installFormControlLabelSupport();import{currentValidityValidator}from"../../forms/form-validator.js";import{LYRA_DEFAULT_fieldRequired,LYRA_DEFAULT_rating}from"../../../internal/default-strings.generated.js";const DEFAULT_MAX=5,MAX_STARS=100,DEFAULT_PRECISION=1,MANAGED_ARIA_LABEL_ATTRIBUTE="data-lr-rating-managed-label",MIN_PRECISION=.01,STAR_POINTS="12 2 15.09 8.26 22 9.27 17 14.14 18.18 21.02 12 17.77 5.82 21.02 7 14.14 2 9.27 8.91 8.26 12 2";function starOutline(){return svg`<svg width="1em" height="1em" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.75" stroke-linejoin="round" aria-hidden="true" focusable="false"><polygon points=${STAR_POINTS}></polygon></svg>`}function starSolid(){return svg`<svg width="1em" height="1em" viewBox="0 0 24 24" fill="currentColor" stroke="none" aria-hidden="true" focusable="false"><polygon points=${STAR_POINTS}></polygon></svg>`}class LyraRating extends LyraElement{static{this.defaultStrings={...super.defaultStrings,fieldRequired:LYRA_DEFAULT_fieldRequired,rating:LYRA_DEFAULT_rating}}static get validators(){return[currentValidityValidator("required","disabled","readonly","value","max")]}static{this.formAssociated=!0}static{this.styles=[LyraElement.styles,styles]}static get observedAttributes(){return[...new Set([...super.observedAttributes,"role"])]}static{this.properties={customError:{attribute:"custom-error",reflect:!0,noAccessor:!0},value:{attribute:"value",type:Number,noAccessor:!0},defaultValue:{attribute:!1,noAccessor:!0},max:{type:Number,noAccessor:!0},name:{reflect:!0,noAccessor:!0,converter:omittedEmptyStringConverter},required:{type:Boolean,reflect:!0,noAccessor:!0},disabled:{type:Boolean,reflect:!0,noAccessor:!0}}}get effectiveSize(){const value=this.size;return["2xs","xs","s","m","l","xl","small","medium","large"].includes(value)?normalizeSize(value):"m"}get defaultValueAlias(){return this.defaultValue}set defaultValueAlias(next){this.defaultValue=finiteNumber(next??0,0)}get rating(){return this.renderRoot.querySelector('[part~="rating"]')}constructor(){super(),this.precision=1,this.readonly=!1,this.accessibleLabel="",this.label="",this.size="m",this.hoverValue=0,this.hovering=!1,this._value=0,this._max=DEFAULT_MAX,this._name="",this._required=!1,this._disabled=!1,this._fieldsetDisabled=!1,this._defaultValue=0,this._valueDirty=!1,this.settingDefaultValue=!1,this.reflectingDefaultValue=!1,this._hasInteracted=!1,this.authorAriaLabel=null,this.syncingHostSemantics=!1,this.externalLabelNameActive=!1,this.markInteracted=()=>{this._hasInteracted||(this._hasInteracted=!0,this.syncValidityStates())},this.onClick=event=>{const next=this.pointerValue(event);next!==null&&this.setValue(next)},this.onPointerEnter=event=>{this.interactive&&(this.hovering=!0,this.hoverValue=this.pointerValue(event)??this.hoverValue,this.emit("lr-hover",{phase:"start",value:this.hoverValue}))},this.onPointerMove=event=>{if(!this.interactive)return;const next=this.pointerValue(event);if(next!==null){if(!this.hovering){this.hovering=!0,this.hoverValue=next,this.emit("lr-hover",{phase:"start",value:next});return}next!==this.hoverValue&&(this.hoverValue=next,this.emit("lr-hover",{phase:"move",value:next}))}},this.onPointerEnd=()=>{this.hovering&&(this.hovering=!1,this.emit("lr-hover",{phase:"end",value:this.hoverValue}))},this.onKeyDown=event=>{const forwardKey=this.effectiveDirection==="rtl"?"ArrowLeft":"ArrowRight",backwardKey=this.effectiveDirection==="rtl"?"ArrowRight":"ArrowLeft";(event.key===forwardKey||event.key==="ArrowUp")&&(event.preventDefault(),this.setValue(this.safeValue+this.safePrecision)),(event.key===backwardKey||event.key==="ArrowDown")&&(event.preventDefault(),this.setValue(this.safeValue-this.safePrecision)),event.key==="Home"&&(event.preventDefault(),this.setValue(0)),event.key==="End"&&(event.preventDefault(),this.setValue(this.safeMax))},this.onHostKeyDown=event=>{event.composedPath()[0]===this&&this.onKeyDown(event)},this.onBlur=event=>{event.target===this&&this.markInteracted()},installInvalidEventAlias(this,init=>this.emit("lr-invalid",null,init)),this.internals=attachInternalsSafely(this),this.validityController=new AnchoredValidityController(this,this.internals,()=>this[VALIDITY_ANCHOR]()),installCustomErrorProperty(this,()=>this.validityController.customValidityMessage),this.internals.setFormValue("0"),this.addEventListener("focusout",this.markInteracted),this.addEventListener("keydown",this.onHostKeyDown),this.addEventListener("blur",this.onBlur),this.syncValidityStates()}attributeChangedCallback(name,oldValue,value){if(!(this.syncingHostSemantics&&(name==="aria-label"||name==="role"))){if(super.attributeChangedCallback(name,oldValue,value),name==="aria-label"){const managed=this.getAttribute(MANAGED_ARIA_LABEL_ATTRIBUTE),rehydratedManagedName=oldValue===null&&managed!==null&&managed===value;if(this.authorAriaLabel=rehydratedManagedName?null:value,!rehydratedManagedName){this.syncingHostSemantics=!0;try{this.removeAttribute(MANAGED_ARIA_LABEL_ATTRIBUTE)}finally{this.syncingHostSemantics=!1}}}if(name==="role"&&value!=="slider"){this.syncingHostSemantics=!0;try{this.setAttribute("role","slider")}finally{this.syncingHostSemantics=!1}}}}[EXTERNAL_LABEL_HOST_SEMANTICS](operation){if(operation.type==="has-authored-name")return this.authorAriaLabel!==null;if(operation.type==="apply"){this.externalLabelNameActive=!0,this.syncingHostSemantics=!0;try{this.setAttribute(MANAGED_ARIA_LABEL_ATTRIBUTE,operation.name),this.getAttribute("aria-label")!==operation.name&&this.setAttribute("aria-label",operation.name)}finally{this.syncingHostSemantics=!1}return}this.externalLabelNameActive=!1,this.syncingHostSemantics=!0;try{if(this.getAttribute("aria-label")===operation.appliedName)if(operation.hadPrevious){const previous=operation.previous??"";this.setAttribute(MANAGED_ARIA_LABEL_ATTRIBUTE,previous),this.setAttribute("aria-label",previous)}else this.removeAttribute(MANAGED_ARIA_LABEL_ATTRIBUTE),this.removeAttribute("aria-label")}finally{this.syncingHostSemantics=!1}this.authorAriaLabel===null&&this.syncHostSemantics()}get value(){return this._value}set value(next){const old=this._value;this.settingDefaultValue||(this._valueDirty=!0),this._value=typeof next=="number"?next:Number(next),this.syncFormValue(),this.requestUpdate("value",old)}get defaultValue(){return this._defaultValue}set defaultValue(next){if(this.reflectingDefaultValue)return;const old=this._defaultValue;this._defaultValue=next==null?0:typeof next=="number"?next:Number(next),this.reflectingDefaultValue=!0;try{next==null?this.removeAttribute("default-value"):this.setAttribute("default-value",String(this._defaultValue))}finally{this.reflectingDefaultValue=!1}this._valueDirty||this.restoreLiveValueFromDefault(),this.requestUpdate("defaultValue",old)}get max(){return this._max}set max(next){const old=this._max;this._max=typeof next=="number"?next:Number(next),this.syncFormValue(),this.requestUpdate("max",old)}get name(){return this._name}set name(next){const old=this._name;this._name=next??"",this._name?this.setAttribute("name",this._name):this.removeAttribute("name"),this.requestUpdate("name",old)}get required(){return this._required}set required(next){const old=this._required;this._required=!!next,this.toggleAttribute("required",this._required),this.updateValidity(),this.requestUpdate("required",old)}get disabled(){return this._disabled}set disabled(next){const old=this._disabled;this._disabled=!!next,this.toggleAttribute("disabled",this._disabled),this._disabled&&this.resetHover(),this.updateValidity(),this.requestUpdate("disabled",old)}get effectiveDisabled(){return this.disabled||this._fieldsetDisabled}get form(){return getFormOwner(this.internals)}set form(owner){setFormOwner(this,owner)}getForm(){return getFormOwner(this.internals)}get labels(){return this.internals.labels}get validity(){return this.internals.validity}get validationMessage(){return this.internals.validationMessage}get willValidate(){return this.internals.willValidate}[VALIDITY_ANCHOR](){return this.renderRoot?.querySelector('[part~="base"]')??null}checkValidity(){return this.updateValidity(),this.internals.checkValidity()}reportValidity(){return this.updateValidity(),this.markInteracted(),this.internals.reportValidity()}setCustomValidity(message){this.validityController.setCustomValidity(message??""),this.syncValidityStates(),this.syncHostSemantics()}resetValidity(){this.setCustomValidity("")}formResetCallback(){this.resetHover(),this.restoreLiveValueFromDefault(),this._hasInteracted=!1,this.syncValidityStates()}formStateRestoreCallback(state2,reason){this.value=typeof state2=="string"?finiteNumber(Number(state2),0):0}restoreLiveValueFromDefault(){this.settingDefaultValue=!0;try{this.value=this._defaultValue}finally{this.settingDefaultValue=!1}this._valueDirty=!1}formDisabledCallback(fieldsetDisabled){this._fieldsetDisabled=fieldsetDisabled,fieldsetDisabled&&this.resetHover(),this.updateValidity(),this.requestUpdate()}connectedCallback(){super.connectedCallback(),this.updateValidity(),this.syncHostSemantics()}disconnectedCallback(){super.disconnectedCallback(),this.resetHover()}get safeMax(){return finiteCount(this.max,DEFAULT_MAX,MAX_STARS)}get safeValue(){return finiteRange(this.value,0,0,this.safeMax)}get safePrecision(){const precision=finiteRange(this.precision,DEFAULT_PRECISION,MIN_PRECISION,this.safeMax);return precision>0?precision:DEFAULT_PRECISION}get interactive(){return!this.effectiveDisabled&&!this.readonly}syncFormValue(){this.internals&&(this.internals.setFormValue(String(this.safeValue)),this.updateValidity())}get barredFromValidation(){return isBarredFromValidation(this,this.internals)}updateValidity(){this.validityController&&(this.barredFromValidation?this.validityController.setValidity({}):this.required&&this.safeValue<=0?this.validityController.setValidity({valueMissing:!0},this.localize("fieldRequired")):this.validityController.setValidity({}),this.syncValidityStates())}syncValidityStates(){syncValidityStates(this.internals,{required:this.required,hasInteracted:this._hasInteracted,barred:this.barredFromValidation})}setValue(next){if(!this.interactive)return;this.markInteracted();const precision=this.safePrecision,clamped=Math.max(0,Math.min(this.safeMax,Math.round(next/precision)*precision));clamped!==this.value&&(this.value=clamped,dispatchNativeEvent(this,"change"),this.emit("lr-change",{value:this.value}))}pointerValue(event){const target=event.target?.closest?.("[data-value]");if(!target)return null;const star=Number(target.dataset.value);if(!Number.isFinite(star))return null;const rect=target.getBoundingClientRect(),precision=this.safePrecision;if(rect.width<=0)return Math.max(0,Math.min(this.safeMax,star));const physicalFraction=Math.max(0,Math.min(1,(event.clientX-rect.left)/rect.width)),logicalFraction=this.effectiveDirection==="rtl"?1-physicalFraction:physicalFraction,rawValue=star-1+logicalFraction;return Math.max(precision,Math.min(this.safeMax,Math.ceil(rawValue/precision)*precision))}resetHover(){this.hovering=!1,this.hoverValue=0}focus(options){this.effectiveDisabled||super.focus(options)}blur(){super.blur()}click(){this.effectiveDisabled||super.click()}captureHostNameProvenance(){if(this.externalLabelNameActive||this.authorAriaLabel!==null)return;const current=this.getAttribute("aria-label");if(current===null)return;const managed=this.getAttribute(MANAGED_ARIA_LABEL_ATTRIBUTE);if(managed!==current&&(this.authorAriaLabel=current,managed!==null)){this.syncingHostSemantics=!0;try{this.removeAttribute(MANAGED_ARIA_LABEL_ATTRIBUTE)}finally{this.syncingHostSemantics=!1}}}syncHostSemantics(){this.captureHostNameProvenance();const safeMax=this.safeMax,safeValue=this.safeValue,label=typeof this.label=="string"&&this.label.trim()===""?"":this.label,generatedLabel=this.accessibleLabel||label||this.localize("rating");this.syncingHostSemantics=!0;try{this.setAttribute("role","slider"),this.setAttribute("tabindex",this.effectiveDisabled?"-1":"0"),this.setAttribute("aria-valuemin","0"),this.setAttribute("aria-valuemax",String(safeMax)),this.setAttribute("aria-valuenow",String(safeValue)),this.setAttribute("aria-valuetext",getNumberFormat(this.effectiveLocale).format(safeValue)),this.setAttribute("aria-disabled",this.effectiveDisabled?"true":"false"),this.setAttribute("aria-readonly",this.readonly?"true":"false"),this.setAttribute("aria-required",this.required?"true":"false"),this.setAttribute("aria-invalid",this.internals.validity.valid?"false":"true"),this.setAttribute("data-effective-size",this.effectiveSize),!this.externalLabelNameActive&&this.authorAriaLabel===null&&this.getAttribute("aria-label")!==generatedLabel?(this.setAttribute(MANAGED_ARIA_LABEL_ATTRIBUTE,generatedLabel),this.setAttribute("aria-label",generatedLabel)):!this.externalLabelNameActive&&this.authorAriaLabel===null&&this.setAttribute(MANAGED_ARIA_LABEL_ATTRIBUTE,generatedLabel)}finally{this.syncingHostSemantics=!1}}willUpdate(changed){super.willUpdate(changed),changed.has("readonly")&&!this.interactive&&this.resetHover(),this.syncHostSemantics()}updated(changed){super.updated(changed),changed.has("readonly")&&this.updateValidity()}symbol(star,selected){return this.getSymbol?this.getSymbol(star,selected):selected?starSolid():starOutline()}renderSymbol(star,selected){return html`<span aria-hidden="true" inert style="pointer-events: none"
|
|
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,svg}from"lit";import{property,state}from"lit/decorators.js";import{LyraElement}from"../../../internal/lyra-element.js";import{finiteCount,finiteNumber,finiteRange}from"../../../internal/numbers.js";import{getNumberFormat}from"../../../internal/intl-cache.js";import{attachInternalsSafely,getFormOwner,installCustomErrorProperty,isBarredFromValidation,setFormOwner}from"../../../internal/form-associated.js";import{syncValidityStates}from"../../../internal/custom-states.js";import{AnchoredValidityController,VALIDITY_ANCHOR}from"../../../internal/anchored-validity.js";import{normalizeSize}from"../../../internal/variants.js";import{styles}from"./rating.styles.js";import{dispatchNativeEvent}from"../../../internal/native-event-relay.js";import{installInvalidEventAlias}from"../../../internal/invalid-event-alias.js";import{omittedEmptyStringConverter}from"../../../internal/converters.js";import{EXTERNAL_LABEL_HOST_SEMANTICS,installFormControlLabelSupport}from"../../../internal/form-control-labels.js";installFormControlLabelSupport();import{currentValidityValidator}from"../../forms/form-validator.js";import{LYRA_DEFAULT_fieldRequired,LYRA_DEFAULT_rating}from"../../../internal/default-strings.generated.js";const DEFAULT_MAX=5,MAX_STARS=100,DEFAULT_PRECISION=1,MANAGED_ARIA_LABEL_ATTRIBUTE="data-lr-rating-managed-label",MIN_PRECISION=.01,STAR_POINTS="12 2 15.09 8.26 22 9.27 17 14.14 18.18 21.02 12 17.77 5.82 21.02 7 14.14 2 9.27 8.91 8.26 12 2";function starOutline(){return svg`<svg width="1em" height="1em" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.75" stroke-linejoin="round" aria-hidden="true" focusable="false"><polygon points=${STAR_POINTS}></polygon></svg>`}function starSolid(){return svg`<svg width="1em" height="1em" viewBox="0 0 24 24" fill="currentColor" stroke="none" aria-hidden="true" focusable="false"><polygon points=${STAR_POINTS}></polygon></svg>`}class LyraRating extends LyraElement{static{this.defaultStrings={...super.defaultStrings,fieldRequired:LYRA_DEFAULT_fieldRequired,rating:LYRA_DEFAULT_rating}}static get validators(){return[currentValidityValidator("required","disabled","readonly","value","max")]}static{this.formAssociated=!0}static{this.styles=[LyraElement.styles,styles]}static get observedAttributes(){return[...new Set([...super.observedAttributes,"role"])]}static{this.properties={customError:{attribute:"custom-error",reflect:!0,noAccessor:!0},value:{attribute:"value",type:Number,noAccessor:!0},defaultValue:{attribute:!1,noAccessor:!0},max:{type:Number,noAccessor:!0},name:{reflect:!0,noAccessor:!0,converter:omittedEmptyStringConverter},required:{type:Boolean,reflect:!0,noAccessor:!0},disabled:{type:Boolean,reflect:!0,noAccessor:!0}}}get effectiveSize(){const value=this.size;return["2xs","xs","s","m","l","xl","small","medium","large"].includes(value)?normalizeSize(value):"m"}get defaultValueAlias(){return this.defaultValue}set defaultValueAlias(next){this.defaultValue=finiteNumber(next??0,0)}get rating(){return this.renderRoot.querySelector('[part~="rating"]')}constructor(){super(),this.precision=1,this.readonly=!1,this.accessibleLabel="",this.label="",this.size="m",this.hoverValue=0,this.hovering=!1,this._value=0,this._max=DEFAULT_MAX,this._name="",this._required=!1,this._disabled=!1,this._fieldsetDisabled=!1,this._defaultValue=0,this._valueDirty=!1,this.settingDefaultValue=!1,this.reflectingDefaultValue=!1,this._hasInteracted=!1,this.authorAriaLabel=null,this.syncingHostSemantics=!1,this.externalLabelNameActive=!1,this.markInteracted=()=>{this._hasInteracted||(this._hasInteracted=!0,this.syncValidityStates())},this.onClick=event=>{const next=this.pointerValue(event);next!==null&&this.setValue(next)},this.onPointerEnter=event=>{this.interactive&&(this.hovering=!0,this.hoverValue=this.pointerValue(event)??this.hoverValue,this.emit("lr-hover",{phase:"start",value:this.hoverValue}))},this.onPointerMove=event=>{if(!this.interactive)return;const next=this.pointerValue(event);if(next!==null){if(!this.hovering){this.hovering=!0,this.hoverValue=next,this.emit("lr-hover",{phase:"start",value:next});return}next!==this.hoverValue&&(this.hoverValue=next,this.emit("lr-hover",{phase:"move",value:next}))}},this.onPointerEnd=()=>{this.hovering&&(this.hovering=!1,this.emit("lr-hover",{phase:"end",value:this.hoverValue}))},this.onKeyDown=event=>{const forwardKey=this.effectiveDirection==="rtl"?"ArrowLeft":"ArrowRight",backwardKey=this.effectiveDirection==="rtl"?"ArrowRight":"ArrowLeft";(event.key===forwardKey||event.key==="ArrowUp")&&(event.preventDefault(),this.setValue(this.safeValue+this.safePrecision)),(event.key===backwardKey||event.key==="ArrowDown")&&(event.preventDefault(),this.setValue(this.safeValue-this.safePrecision)),event.key==="Home"&&(event.preventDefault(),this.setValue(0)),event.key==="End"&&(event.preventDefault(),this.setValue(this.safeMax))},this.onHostKeyDown=event=>{event.composedPath()[0]===this&&this.onKeyDown(event)},this.onBlur=event=>{event.target===this&&this.markInteracted()},installInvalidEventAlias(this,init=>this.emit("lr-invalid",null,init)),this.internals=attachInternalsSafely(this),this.validityController=new AnchoredValidityController(this,this.internals,()=>this[VALIDITY_ANCHOR]()),installCustomErrorProperty(this,()=>this.validityController.customValidityMessage),this.internals.setFormValue("0"),this.addEventListener("focusout",this.markInteracted),this.addEventListener("keydown",this.onHostKeyDown),this.addEventListener("blur",this.onBlur),this.syncValidityStates()}attributeChangedCallback(name,oldValue,value){if(!(this.syncingHostSemantics&&(name==="aria-label"||name==="role"))){if(super.attributeChangedCallback(name,oldValue,value),name==="aria-label"){const managed=this.getAttribute(MANAGED_ARIA_LABEL_ATTRIBUTE),rehydratedManagedName=oldValue===null&&managed!==null&&managed===value;if(this.authorAriaLabel=rehydratedManagedName?null:value,!rehydratedManagedName){this.syncingHostSemantics=!0;try{this.removeAttribute(MANAGED_ARIA_LABEL_ATTRIBUTE)}finally{this.syncingHostSemantics=!1}}}if(name==="role"&&value!=="slider"){this.syncingHostSemantics=!0;try{this.setAttribute("role","slider")}finally{this.syncingHostSemantics=!1}}}}[EXTERNAL_LABEL_HOST_SEMANTICS](operation){if(operation.type==="has-authored-name")return this.authorAriaLabel!==null;if(operation.type==="apply"){this.externalLabelNameActive=!0,this.syncingHostSemantics=!0;try{this.setAttribute(MANAGED_ARIA_LABEL_ATTRIBUTE,operation.name),this.getAttribute("aria-label")!==operation.name&&this.setAttribute("aria-label",operation.name)}finally{this.syncingHostSemantics=!1}return}this.externalLabelNameActive=!1,this.syncingHostSemantics=!0;try{if(this.getAttribute("aria-label")===operation.appliedName)if(operation.hadPrevious){const previous=operation.previous??"";this.setAttribute(MANAGED_ARIA_LABEL_ATTRIBUTE,previous),this.setAttribute("aria-label",previous)}else this.removeAttribute(MANAGED_ARIA_LABEL_ATTRIBUTE),this.removeAttribute("aria-label")}finally{this.syncingHostSemantics=!1}this.authorAriaLabel===null&&this.syncHostSemantics()}get value(){return this._value}set value(next){const old=this._value;this.settingDefaultValue||(this._valueDirty=!0),this._value=typeof next=="number"?next:Number(next),this.syncFormValue(),this.requestUpdate("value",old)}get defaultValue(){return this._defaultValue}set defaultValue(next){if(this.reflectingDefaultValue)return;const old=this._defaultValue;this._defaultValue=next==null?0:typeof next=="number"?next:Number(next),this.reflectingDefaultValue=!0;try{next==null?this.removeAttribute("default-value"):this.setAttribute("default-value",String(this._defaultValue))}finally{this.reflectingDefaultValue=!1}this._valueDirty||this.restoreLiveValueFromDefault(),this.requestUpdate("defaultValue",old)}get max(){return this._max}set max(next){const old=this._max;this._max=typeof next=="number"?next:Number(next),this.syncFormValue(),this.requestUpdate("max",old)}get name(){return this._name}set name(next){const old=this._name;this._name=next??"",this._name?this.setAttribute("name",this._name):this.removeAttribute("name"),this.requestUpdate("name",old)}get required(){return this._required}set required(next){const old=this._required;this._required=!!next,this.toggleAttribute("required",this._required),this.updateValidity(),this.requestUpdate("required",old)}get disabled(){return this._disabled}set disabled(next){const old=this._disabled;this._disabled=!!next,this.toggleAttribute("disabled",this._disabled),this._disabled&&this.resetHover(),this.updateValidity(),this.requestUpdate("disabled",old)}get effectiveDisabled(){return this.disabled||this._fieldsetDisabled}get form(){return getFormOwner(this.internals)}set form(owner){setFormOwner(this,owner)}getForm(){return getFormOwner(this.internals)}get labels(){return this.internals.labels}get validity(){return this.internals.validity}get validationMessage(){return this.internals.validationMessage}get willValidate(){return this.internals.willValidate}[VALIDITY_ANCHOR](){return this.renderRoot?.querySelector('[part~="base"]')??null}checkValidity(){return this.updateValidity(),this.internals.checkValidity()}reportValidity(){return this.updateValidity(),this.markInteracted(),this.internals.reportValidity()}setCustomValidity(message){this.validityController.setCustomValidity(message??""),this.syncValidityStates(),this.syncHostSemantics()}resetValidity(){this.setCustomValidity("")}formResetCallback(){this.resetHover(),this.restoreLiveValueFromDefault(),this._hasInteracted=!1,this.syncValidityStates()}formStateRestoreCallback(state2,reason){this.value=typeof state2=="string"?finiteNumber(Number(state2),0):0}restoreLiveValueFromDefault(){this.settingDefaultValue=!0;try{this.value=this._defaultValue}finally{this.settingDefaultValue=!1}this._valueDirty=!1}formDisabledCallback(fieldsetDisabled){this._fieldsetDisabled=fieldsetDisabled,fieldsetDisabled&&this.resetHover(),this.updateValidity(),this.requestUpdate()}connectedCallback(){super.connectedCallback(),this.updateValidity(),this.syncHostSemantics()}disconnectedCallback(){super.disconnectedCallback(),this.resetHover()}get safeMax(){return finiteCount(this.max,DEFAULT_MAX,MAX_STARS)}get safeValue(){return finiteRange(this.value,0,0,this.safeMax)}get safePrecision(){const precision=finiteRange(this.precision,DEFAULT_PRECISION,MIN_PRECISION,this.safeMax);return precision>0?precision:DEFAULT_PRECISION}get interactive(){return!this.effectiveDisabled&&!this.readonly}syncFormValue(){this.internals&&(this.internals.setFormValue(String(this.safeValue)),this.updateValidity())}get barredFromValidation(){return isBarredFromValidation(this,this.internals)}updateValidity(){this.validityController&&(this.barredFromValidation?this.validityController.setValidity({}):this.required&&this.safeValue<=0?this.validityController.setValidity({valueMissing:!0},this.localize("fieldRequired")):this.validityController.setValidity({}),this.syncValidityStates())}syncValidityStates(){syncValidityStates(this.internals,{required:this.required,hasInteracted:this._hasInteracted,barred:this.barredFromValidation})}setValue(next){if(!this.interactive)return;this.markInteracted();const precision=this.safePrecision,clamped=Math.max(0,Math.min(this.safeMax,Math.round(next/precision)*precision));clamped!==this.value&&(this.value=clamped,dispatchNativeEvent(this,"change"),this.emit("lr-change",{value:this.value}))}pointerValue(event){const target=event.target?.closest?.("[data-value]");if(!target)return null;const star=Number(target.dataset.value);if(!Number.isFinite(star))return null;const rect=target.getBoundingClientRect(),precision=this.safePrecision;if(rect.width<=0)return Math.max(0,Math.min(this.safeMax,star));const physicalFraction=Math.max(0,Math.min(1,(event.clientX-rect.left)/rect.width)),logicalFraction=this.effectiveDirection==="rtl"?1-physicalFraction:physicalFraction,rawValue=star-1+logicalFraction;return Math.max(precision,Math.min(this.safeMax,Math.ceil(rawValue/precision)*precision))}resetHover(){this.hovering=!1,this.hoverValue=0}focus(options){this.effectiveDisabled||super.focus(options)}blur(){super.blur()}click(){this.effectiveDisabled||super.click()}captureHostNameProvenance(){if(this.externalLabelNameActive||this.authorAriaLabel!==null)return;const current=this.getAttribute("aria-label");if(current===null)return;const managed=this.getAttribute(MANAGED_ARIA_LABEL_ATTRIBUTE);if(managed!==current&&(this.authorAriaLabel=current,managed!==null)){this.syncingHostSemantics=!0;try{this.removeAttribute(MANAGED_ARIA_LABEL_ATTRIBUTE)}finally{this.syncingHostSemantics=!1}}}syncHostSemantics(){this.captureHostNameProvenance();const safeMax=this.safeMax,safeValue=this.safeValue,label=typeof this.label=="string"&&this.label.trim()===""?"":this.label,generatedLabel=this.accessibleLabel||label||this.localize("rating");this.syncingHostSemantics=!0;try{this.setAttribute("role","slider"),this.setAttribute("tabindex",this.effectiveDisabled?"-1":"0"),this.setAttribute("aria-valuemin","0"),this.setAttribute("aria-valuemax",String(safeMax)),this.setAttribute("aria-valuenow",String(safeValue)),this.setAttribute("aria-valuetext",getNumberFormat(this.effectiveLocale).format(safeValue)),this.setAttribute("aria-disabled",this.effectiveDisabled?"true":"false"),this.setAttribute("aria-readonly",this.readonly?"true":"false"),this.setAttribute("aria-required",this.required?"true":"false"),this.setAttribute("aria-invalid",this.internals.validity.valid?"false":"true"),this.setAttribute("data-effective-size",this.effectiveSize),!this.externalLabelNameActive&&this.authorAriaLabel===null&&this.getAttribute("aria-label")!==generatedLabel?(this.setAttribute(MANAGED_ARIA_LABEL_ATTRIBUTE,generatedLabel),this.setAttribute("aria-label",generatedLabel)):!this.externalLabelNameActive&&this.authorAriaLabel===null&&this.setAttribute(MANAGED_ARIA_LABEL_ATTRIBUTE,generatedLabel)}finally{this.syncingHostSemantics=!1}}willUpdate(changed){super.willUpdate(changed),changed.has("readonly")&&!this.interactive&&this.resetHover(),this.syncHostSemantics()}updated(changed){super.updated(changed),changed.has("readonly")&&(this.updateValidity(),this.syncHostSemantics())}symbol(star,selected){return this.getSymbol?this.getSymbol(star,selected):selected?starSolid():starOutline()}renderSymbol(star,selected){return html`<span aria-hidden="true" inert style="pointer-events: none"
|
|
2
2
|
>${this.symbol(star,selected)}</span
|
|
3
3
|
>`}render(){const safeMax=this.safeMax,safeValue=this.safeValue,displayValue=this.hovering&&this.interactive?Math.min(this.hoverValue,safeMax):safeValue,count=Math.round(safeMax);return html`<div
|
|
4
4
|
part="base rating"
|
|
@@ -1,4 +1,4 @@
|
|
|
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,svg}from"lit";import{property,state}from"lit/decorators.js";import{hostAriaLabel}from"../../../internal/a11y.js";import{LyraElement}from"../../../internal/lyra-element.js";import{firstByRetrievalIdentity}from"../retrieval-identity.js";import{finiteRange}from"../../../internal/numbers.js";import{getNumberFormat}from"../../../internal/intl-cache.js";import{sanitizeCssLength}from"../../../internal/safe-css.js";import{specialistTokens}from"../../../internal/specialist-tokens.styles.js";import{styles}from"./embedding-explorer.styles.js";import{activeElementIn}from"../../../internal/active-element.js";import{LYRA_DEFAULT_embeddingExplorerEmpty,LYRA_DEFAULT_embeddingExplorerLabel,LYRA_DEFAULT_embeddingExplorerPoint}from"../../../internal/default-strings.generated.js";const WIDTH=640,HEIGHT=360,PAD=24,PALETTE=["var(--lr-color-chart-1)","var(--lr-color-chart-2)","var(--lr-color-chart-3)","var(--lr-color-chart-4)","var(--lr-color-chart-5)","var(--lr-color-chart-6)","var(--lr-color-chart-7)","var(--lr-color-chart-8)"];class LyraEmbeddingExplorer extends LyraElement{constructor(){super(...arguments),this.points=[],this.selectedPointId="",this.height="360px",this.accessibleLabel=null,this.activeIndex=0,this.refocusAfterUpdate=!1}static{this.defaultStrings={...super.defaultStrings,embeddingExplorerEmpty:LYRA_DEFAULT_embeddingExplorerEmpty,embeddingExplorerLabel:LYRA_DEFAULT_embeddingExplorerLabel,embeddingExplorerPoint:LYRA_DEFAULT_embeddingExplorerPoint}}static{this.ownedCollectionProperties=Object.freeze(["points"])}static{this.styles=[LyraElement.styles,specialistTokens,styles]}get validPoints(){return firstByRetrievalIdentity(Array.isArray(this.points)?this.points:[],point=>Number.isFinite(point.x)&&Number.isFinite(point.y)?point.id:void 0)}willUpdate(changed){if(super.willUpdate(changed),!changed.has("points"))return;const active=activeElementIn(this.shadowRoot)??null,focusedId=active?.getAttribute("data-id"),points=this.validPoints,matchingIndex=focusedId?points.findIndex(point=>point.id===focusedId):-1;this.activeIndex=matchingIndex>=0?matchingIndex:Math.min(this.activeIndex,Math.max(0,points.length-1)),this.refocusAfterUpdate=active?.getAttribute("part")==="point"}updated(changed){super.updated(changed),changed.has("height")&&this.applyHeight(),this.refocusAfterUpdate&&(this.refocusAfterUpdate=!1,this.renderRoot.querySelector(`[data-index="${this.activeIndex}"]`)?.focus())}applyHeight(){const height=sanitizeCssLength(this.height,"height");height?this.style.setProperty("--lr-embedding-explorer-height",height):this.style.removeProperty("--lr-embedding-explorer-height")}position(point,bounds){const{minX,maxX,minY,maxY}=bounds,x=PAD+finiteRange((point.x-minX)/(maxX-minX||1),.5,0,1)*(WIDTH-PAD*2),y=HEIGHT-PAD-finiteRange((point.y-minY)/(maxY-minY||1),.5,0,1)*(HEIGHT-PAD*2);return{x,y}}announceLabel(point,index){return this.localize("embeddingExplorerPoint",void 0,{label:point.label||point.id,index:getNumberFormat(this.effectiveLocale).format(index+1)})}select(point){this.emit("lr-point-select",{point})}activatePoint(point,index){this.activeIndex=index,this.select(point)}onPointKeyDown(event,point,index){const points=this.validPoints;if(event.key==="Enter"||event.key===" "){event.preventDefault(),this.select(point);return}const rtl=this.effectiveDirection==="rtl",forward=rtl?"ArrowLeft":"ArrowRight",backward=rtl?"ArrowRight":"ArrowLeft";let next=index;if(event.key===forward||event.key==="ArrowDown")next=Math.min(points.length-1,index+1);else if(event.key===backward||event.key==="ArrowUp")next=Math.max(0,index-1);else if(event.key==="Home")next=0;else if(event.key==="End")next=points.length-1;else return;event.preventDefault(),this.activeIndex=next,this.updateComplete.then(()=>{this.renderRoot.querySelector(`[data-index="${next}"]`)?.focus()})}renderPoint(point,index,bounds,clusterIndices){const{x,y}=this.position(point,bounds),label=this.announceLabel(point,index),cluster=String(point.cluster??"").trim(),selected=point.id===this.selectedPointId;return svg`<g
|
|
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{nativeSvgTitle}from"../../../internal/svg-title.js";import{html,nothing,svg}from"lit";import{property,state}from"lit/decorators.js";import{hostAriaLabel}from"../../../internal/a11y.js";import{LyraElement}from"../../../internal/lyra-element.js";import{firstByRetrievalIdentity}from"../retrieval-identity.js";import{finiteRange}from"../../../internal/numbers.js";import{getNumberFormat}from"../../../internal/intl-cache.js";import{sanitizeCssLength}from"../../../internal/safe-css.js";import{specialistTokens}from"../../../internal/specialist-tokens.styles.js";import{styles}from"./embedding-explorer.styles.js";import{activeElementIn}from"../../../internal/active-element.js";import{LYRA_DEFAULT_embeddingExplorerEmpty,LYRA_DEFAULT_embeddingExplorerLabel,LYRA_DEFAULT_embeddingExplorerPoint}from"../../../internal/default-strings.generated.js";const WIDTH=640,HEIGHT=360,PAD=24,PALETTE=["var(--lr-color-chart-1)","var(--lr-color-chart-2)","var(--lr-color-chart-3)","var(--lr-color-chart-4)","var(--lr-color-chart-5)","var(--lr-color-chart-6)","var(--lr-color-chart-7)","var(--lr-color-chart-8)"];class LyraEmbeddingExplorer extends LyraElement{constructor(){super(...arguments),this.points=[],this.selectedPointId="",this.height="360px",this.accessibleLabel=null,this.activeIndex=0,this.refocusAfterUpdate=!1}static{this.defaultStrings={...super.defaultStrings,embeddingExplorerEmpty:LYRA_DEFAULT_embeddingExplorerEmpty,embeddingExplorerLabel:LYRA_DEFAULT_embeddingExplorerLabel,embeddingExplorerPoint:LYRA_DEFAULT_embeddingExplorerPoint}}static{this.ownedCollectionProperties=Object.freeze(["points"])}static{this.styles=[LyraElement.styles,specialistTokens,styles]}get validPoints(){return firstByRetrievalIdentity(Array.isArray(this.points)?this.points:[],point=>Number.isFinite(point.x)&&Number.isFinite(point.y)?point.id:void 0)}willUpdate(changed){if(super.willUpdate(changed),!changed.has("points"))return;const active=activeElementIn(this.shadowRoot)??null,focusedId=active?.getAttribute("data-id"),points=this.validPoints,matchingIndex=focusedId?points.findIndex(point=>point.id===focusedId):-1;this.activeIndex=matchingIndex>=0?matchingIndex:Math.min(this.activeIndex,Math.max(0,points.length-1)),this.refocusAfterUpdate=active?.getAttribute("part")==="point"}updated(changed){super.updated(changed),changed.has("height")&&this.applyHeight(),this.refocusAfterUpdate&&(this.refocusAfterUpdate=!1,this.renderRoot.querySelector(`[data-index="${this.activeIndex}"]`)?.focus())}applyHeight(){const height=sanitizeCssLength(this.height,"height");height?this.style.setProperty("--lr-embedding-explorer-height",height):this.style.removeProperty("--lr-embedding-explorer-height")}position(point,bounds){const{minX,maxX,minY,maxY}=bounds,x=PAD+finiteRange((point.x-minX)/(maxX-minX||1),.5,0,1)*(WIDTH-PAD*2),y=HEIGHT-PAD-finiteRange((point.y-minY)/(maxY-minY||1),.5,0,1)*(HEIGHT-PAD*2);return{x,y}}announceLabel(point,index){return this.localize("embeddingExplorerPoint",void 0,{label:point.label||point.id,index:getNumberFormat(this.effectiveLocale).format(index+1)})}select(point){this.emit("lr-point-select",{point})}activatePoint(point,index){this.activeIndex=index,this.select(point)}onPointKeyDown(event,point,index){const points=this.validPoints;if(event.key==="Enter"||event.key===" "){event.preventDefault(),this.select(point);return}const rtl=this.effectiveDirection==="rtl",forward=rtl?"ArrowLeft":"ArrowRight",backward=rtl?"ArrowRight":"ArrowLeft";let next=index;if(event.key===forward||event.key==="ArrowDown")next=Math.min(points.length-1,index+1);else if(event.key===backward||event.key==="ArrowUp")next=Math.max(0,index-1);else if(event.key==="Home")next=0;else if(event.key==="End")next=points.length-1;else return;event.preventDefault(),this.activeIndex=next,this.updateComplete.then(()=>{this.renderRoot.querySelector(`[data-index="${next}"]`)?.focus()})}renderPoint(point,index,bounds,clusterIndices){const{x,y}=this.position(point,bounds),label=this.announceLabel(point,index),cluster=String(point.cluster??"").trim(),selected=point.id===this.selectedPointId;return svg`<g
|
|
2
2
|
part="point"
|
|
3
3
|
data-index=${index}
|
|
4
4
|
data-id=${point.id}
|
|
@@ -24,7 +24,7 @@ var __decorate=function(decorators,target,key,desc){var c=arguments.length,r=c<3
|
|
|
24
24
|
vector-effect="non-scaling-stroke"
|
|
25
25
|
></line>
|
|
26
26
|
<circle class="point-marker" r="6" fill=${PALETTE[(clusterIndices.get(cluster)??0)%PALETTE.length]}></circle>
|
|
27
|
-
|
|
27
|
+
${nativeSvgTitle(label)}
|
|
28
28
|
</g>`}render(){const points=this.validPoints,hostLabel=hostAriaLabel(this),label=hostLabel===null?this.accessibleLabel??this.localize("embeddingExplorerLabel"):hostLabel;if(points.length===0)return html`<div part="base" role="region" aria-label=${label}>
|
|
29
29
|
<p part="empty">${this.localize("embeddingExplorerEmpty")}</p>
|
|
30
30
|
</div>`;const bounds=points.reduce((result,point)=>({minX:Math.min(result.minX,point.x),maxX:Math.max(result.maxX,point.x),minY:Math.min(result.minY,point.y),maxY:Math.max(result.maxY,point.y)}),{minX:1/0,maxX:-1/0,minY:1/0,maxY:-1/0}),clusters=[...new Set(points.map(point=>String(point.cluster??"").trim()))].sort(),clusterIndices=new Map(clusters.map((cluster,index)=>[cluster,index])),visibleClusters=clusters.filter(cluster=>cluster.trim()!=="");return html`<div part="base">
|
|
@@ -25,13 +25,16 @@ export type EntityCardAppearance=LyraFrame;export interface LyraEntityCardEventM
|
|
|
25
25
|
* collection and reassign it after changes; mutating the assigned array does not update the view.
|
|
26
26
|
*
|
|
27
27
|
* @customElement lr-entity-card
|
|
28
|
+
* @attr {string | number | null} aria-level - Heading level forwarded to the title. An absent or empty value
|
|
29
|
+
* uses level 3.
|
|
28
30
|
* @slot - Extra body content below the property rows (e.g. a `lr-neighbor-list`).
|
|
29
31
|
* @slot actions - Extra header actions alongside the built-in focus button.
|
|
30
32
|
* @event lr-entity-select - The built-in focus button was activated. `detail: { entityId }`.
|
|
31
33
|
* @csspart base - The outer bordered container.
|
|
32
34
|
* @csspart header - The header row wrapping the type badge, title, and actions.
|
|
33
35
|
* @csspart type-badge - The resolved entity-type badge.
|
|
34
|
-
* @csspart title - The entity's label, `role="heading" aria-level="3"` by default.
|
|
36
|
+
* @csspart title - The entity's label, `role="heading" aria-level="3"` by default. The host's
|
|
37
|
+
* existing `aria-level` override updates live; removing it restores level 3.
|
|
35
38
|
* @csspart description - The entity's description text.
|
|
36
39
|
* @csspart properties - The wrapper around every property/degree/community row.
|
|
37
40
|
* @csspart property - One key/value dossier row.
|
|
@@ -47,7 +50,7 @@ export type EntityCardAppearance=LyraFrame;export interface LyraEntityCardEventM
|
|
|
47
50
|
* @status stable
|
|
48
51
|
* @since 4.0.0
|
|
49
52
|
*/
|
|
50
|
-
export declare class LyraEntityCard extends LyraElement<LyraEntityCardEventMap>{protected static readonly ownedCollectionProperties:readonly string[];static styles:import("lit").CSSResultGroup[];
|
|
53
|
+
export declare class LyraEntityCard extends LyraElement<LyraEntityCardEventMap>{static get observedAttributes():string[];attributeChangedCallback(name:string,oldValue:string|null,value:string|null):void;protected static readonly ownedCollectionProperties:readonly string[];static styles:import("lit").CSSResultGroup[];
|
|
51
54
|
/** `null` renders the shared `lr-empty` `noData` state. */
|
|
52
55
|
entity:Readonly<LyraEntity> |null;
|
|
53
56
|
/** `lr-graph` `nodeTypes` pass-through used to resolve the type badge's label and swatch
|
|
@@ -1,4 +1,4 @@
|
|
|
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}from"lit/decorators.js";import{styleMap}from"lit/directives/style-map.js";import{LyraElement}from"../../../internal/lyra-element.js";import{firstByRetrievalIdentity,isNonBlankIdentity}from"../retrieval-identity.js";import{sanitizeCssColor}from"../../../internal/safe-css.js";import{finiteCount,finiteNumber}from"../../../internal/numbers.js";import{getNumberFormat}from"../../../internal/intl-cache.js";import{styles}from"./entity-card.styles.js";import"../../agent-tools/result-card/result-field.class.js";import"../../overlays/badge/badge.class.js";import"../../overlays/chip/chip.class.js";import"../../forms/button/button.class.js";import"../../overlays/empty/empty.class.js";import{trueDefaultBooleanConverter}from"../../../internal/converters.js";import{LYRA_DEFAULT_entityCommunity,LYRA_DEFAULT_entityDegree,LYRA_DEFAULT_focusInGraph,LYRA_DEFAULT_noData,LYRA_DEFAULT_untitledEntity}from"../../../internal/default-strings.generated.js";function typeBadgeStyle(color){const safe=color!=null?sanitizeCssColor(color):void 0;return safe?{"--lr-badge-color":"var(--lr-color-text)","--lr-badge-background":`color-mix(in srgb, ${safe} 12%, var(--lr-color-surface))`,"--lr-badge-border":safe}:{}}class LyraEntityCard extends LyraElement{constructor(){super(...arguments),this.entity=null,this.types=[],this.communityLabel="",this.showFocusButton=!0,this.compact=!1,this.frame="card",this.onFocusClick=()=>{this.entity&&isNonBlankIdentity(this.entity.id)&&this.emit("lr-entity-select",{entityId:this.entity.id})}}static{this.defaultStrings={...super.defaultStrings,entityCommunity:LYRA_DEFAULT_entityCommunity,entityDegree:LYRA_DEFAULT_entityDegree,focusInGraph:LYRA_DEFAULT_focusInGraph,noData:LYRA_DEFAULT_noData,untitledEntity:LYRA_DEFAULT_untitledEntity}}static{this.ownedCollectionProperties=Object.freeze(["entity","types"])}static{this.styles=[LyraElement.styles,styles]}resolvedType(type){return firstByRetrievalIdentity(this.types,entry=>entry?.id).find(entry=>entry.id===type)}render(){if(!this.entity||!isNonBlankIdentity(this.entity.id))return html`<div part="base">
|
|
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}from"lit/decorators.js";import{styleMap}from"lit/directives/style-map.js";import{LyraElement}from"../../../internal/lyra-element.js";import{firstByRetrievalIdentity,isNonBlankIdentity}from"../retrieval-identity.js";import{sanitizeCssColor}from"../../../internal/safe-css.js";import{finiteCount,finiteNumber}from"../../../internal/numbers.js";import{getNumberFormat}from"../../../internal/intl-cache.js";import{styles}from"./entity-card.styles.js";import"../../agent-tools/result-card/result-field.class.js";import"../../overlays/badge/badge.class.js";import"../../overlays/chip/chip.class.js";import"../../forms/button/button.class.js";import"../../overlays/empty/empty.class.js";import{trueDefaultBooleanConverter}from"../../../internal/converters.js";import{LYRA_DEFAULT_entityCommunity,LYRA_DEFAULT_entityDegree,LYRA_DEFAULT_focusInGraph,LYRA_DEFAULT_noData,LYRA_DEFAULT_untitledEntity}from"../../../internal/default-strings.generated.js";function typeBadgeStyle(color){const safe=color!=null?sanitizeCssColor(color):void 0;return safe?{"--lr-badge-color":"var(--lr-color-text)","--lr-badge-background":`color-mix(in srgb, ${safe} 12%, var(--lr-color-surface))`,"--lr-badge-border":safe}:{}}class LyraEntityCard extends LyraElement{constructor(){super(...arguments),this.entity=null,this.types=[],this.communityLabel="",this.showFocusButton=!0,this.compact=!1,this.frame="card",this.onFocusClick=()=>{this.entity&&isNonBlankIdentity(this.entity.id)&&this.emit("lr-entity-select",{entityId:this.entity.id})}}static{this.defaultStrings={...super.defaultStrings,entityCommunity:LYRA_DEFAULT_entityCommunity,entityDegree:LYRA_DEFAULT_entityDegree,focusInGraph:LYRA_DEFAULT_focusInGraph,noData:LYRA_DEFAULT_noData,untitledEntity:LYRA_DEFAULT_untitledEntity}}static get observedAttributes(){return[...super.observedAttributes,"aria-level"]}attributeChangedCallback(name,oldValue,value){super.attributeChangedCallback(name,oldValue,value),name==="aria-level"&&oldValue!==value&&this.requestUpdate()}static{this.ownedCollectionProperties=Object.freeze(["entity","types"])}static{this.styles=[LyraElement.styles,styles]}resolvedType(type){return firstByRetrievalIdentity(this.types,entry=>entry?.id).find(entry=>entry.id===type)}render(){if(!this.entity||!isNonBlankIdentity(this.entity.id))return html`<div part="base">
|
|
2
2
|
<lr-empty part="empty" heading=${this.localize("noData")}></lr-empty>
|
|
3
3
|
</div>`;const entity=this.entity,titleText=entity.label||this.localize("untitledEntity"),resolved=entity.type?this.resolvedType(entity.type):void 0,badgeLabel=resolved?.label??entity.type,properties=Object.entries(entity.properties??{}),ariaLevel=this.getAttribute("aria-level")||"3";return html`
|
|
4
4
|
<div part="base">
|
|
@@ -29,9 +29,11 @@ import{type TemplateResult,type PropertyValues}from'lit';import{LyraElement}from
|
|
|
29
29
|
export declare class LyraEntityChip extends LyraElement<LyraEntityChipEventMap>{static styles:import("lit").CSSResultGroup[];
|
|
30
30
|
/** Echoed verbatim in both events. Blank identities disable activation. */
|
|
31
31
|
entityId:string;
|
|
32
|
-
/** The visible chip text (unlike citation-badge, the chip renders its own text, not `[n]`).
|
|
32
|
+
/** The visible chip text (unlike citation-badge, the chip renders its own text, not `[n]`).
|
|
33
|
+
* Removing the attribute leaves null readback and uses the localized untitled accessible name. */
|
|
33
34
|
text:string;
|
|
34
|
-
/** The entity's `lr-graph` `nodeTypes` id; reflected so hosts theme per type from CSS.
|
|
35
|
+
/** The entity's `lr-graph` `nodeTypes` id; reflected so hosts theme per type from CSS.
|
|
36
|
+
* A removed attribute is treated as an absent type without rewriting null readback. */
|
|
35
37
|
type:string;
|
|
36
38
|
/** Resolved display label for `type`; when set, the accessible name speaks it instead of the raw
|
|
37
39
|
* type id. */
|
|
@@ -1,4 +1,4 @@
|
|
|
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,query}from"lit/decorators.js";import{LyraElement}from"../../../internal/lyra-element.js";import{isNonBlankIdentity}from"../retrieval-identity.js";import{deferredPlace as place}from"../../../internal/anchored-overlay-runtime.js";import{nextId}from"../../../internal/a11y.js";import{SlotPresenceController}from"../../../internal/slot-presence-controller.js";import{styles}from"./entity-chip.styles.js";import{LYRA_DEFAULT_entityChipWithType,LYRA_DEFAULT_untitledEntity}from"../../../internal/default-strings.generated.js";const HIDE_DELAY_MS=200;class LyraEntityChip extends LyraElement{constructor(){super(...arguments),this.entityId="",this.text="",this.type="",this.popoverOpen=!1,this.popoverId=nextId("entity-chip-popover"),this.slotPresence=new SlotPresenceController(this),this.hovering=!1,this.focused=!1,this.onPointerEnter=()=>{this.hovering=!0,this.showPreview()},this.onPointerLeave=()=>{this.hovering=!1,this.scheduleHidePreview()},this.onFocusIn=()=>{this.focused=!0,this.showPreview()},this.onFocusOut=()=>{this.focused=!1,!this.hovering&&this.hidePreviewNow()},this.onKeyDown=e=>{if(e.key==="Escape"&&this.popoverOpen){e.stopPropagation(),this.hidePreviewNow();return}e.key===" "&&!e.repeat&&e.target===this.buttonEl&&(e.preventDefault(),this.emitOpen())},this.onClick=()=>{isNonBlankIdentity(this.entityId)&&this.emit("lr-entity-select",{entityId:this.entityId})},this.onDblClick=()=>{this.emitOpen()}}static{this.defaultStrings={...super.defaultStrings,entityChipWithType:LYRA_DEFAULT_entityChipWithType,untitledEntity:LYRA_DEFAULT_untitledEntity}}static{this.styles=[LyraElement.styles,styles]}get hasPreviewSlot(){return this.slotPresence.has()}willUpdate(changed){super.willUpdate(changed),this.popoverOpen&&!this.hasPreviewSlot&&this.hidePreviewNow()}updated(changed){super.updated(changed),changed.has("popoverOpen")&&(this.cleanupPositioner?.(),this.cleanupPositioner=void 0,this.popoverOpen&&this.buttonEl&&this.popoverEl&&(this.cleanupPositioner=place(this.buttonEl,this.popoverEl,{placement:"top-start"})))}disconnectedCallback(){super.disconnectedCallback(),this.cleanupPositioner?.(),this.cleanupPositioner=void 0,clearTimeout(this.hideTimer),this.hideTimer=void 0,this.popoverOpen=!1,this.hovering=!1,this.focused=!1}get accessibleLabel(){const label=this.text.trim()===""?this.localize("untitledEntity"):this.text,typeText=this.typeLabel?.trim()||this.type.trim();return typeText?this.localize("entityChipWithType",void 0,{label,type:typeText}):label}showPreview(){this.hasPreviewSlot&&(clearTimeout(this.hideTimer),this.hideTimer=void 0,!this.popoverOpen&&(this.popoverOpen=!0))}scheduleHidePreview(){!this.popoverOpen||this.hovering||this.focused||(clearTimeout(this.hideTimer),this.hideTimer=setTimeout(()=>{this.hideTimer=void 0,this.popoverOpen=!1},HIDE_DELAY_MS))}hidePreviewNow(){clearTimeout(this.hideTimer),this.hideTimer=void 0,this.popoverOpen&&(this.popoverOpen=!1)}emitOpen(){isNonBlankIdentity(this.entityId)&&this.emit("lr-entity-open",{entityId:this.entityId})}render(){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,query}from"lit/decorators.js";import{LyraElement}from"../../../internal/lyra-element.js";import{isNonBlankIdentity}from"../retrieval-identity.js";import{deferredPlace as place}from"../../../internal/anchored-overlay-runtime.js";import{nextId}from"../../../internal/a11y.js";import{SlotPresenceController}from"../../../internal/slot-presence-controller.js";import{styles}from"./entity-chip.styles.js";import{LYRA_DEFAULT_entityChipWithType,LYRA_DEFAULT_untitledEntity}from"../../../internal/default-strings.generated.js";const HIDE_DELAY_MS=200;class LyraEntityChip extends LyraElement{constructor(){super(...arguments),this.entityId="",this.text="",this.type="",this.popoverOpen=!1,this.popoverId=nextId("entity-chip-popover"),this.slotPresence=new SlotPresenceController(this),this.hovering=!1,this.focused=!1,this.onPointerEnter=()=>{this.hovering=!0,this.showPreview()},this.onPointerLeave=()=>{this.hovering=!1,this.scheduleHidePreview()},this.onFocusIn=()=>{this.focused=!0,this.showPreview()},this.onFocusOut=()=>{this.focused=!1,!this.hovering&&this.hidePreviewNow()},this.onKeyDown=e=>{if(e.key==="Escape"&&this.popoverOpen){e.stopPropagation(),this.hidePreviewNow();return}e.key===" "&&!e.repeat&&e.target===this.buttonEl&&(e.preventDefault(),this.emitOpen())},this.onClick=()=>{isNonBlankIdentity(this.entityId)&&this.emit("lr-entity-select",{entityId:this.entityId})},this.onDblClick=()=>{this.emitOpen()}}static{this.defaultStrings={...super.defaultStrings,entityChipWithType:LYRA_DEFAULT_entityChipWithType,untitledEntity:LYRA_DEFAULT_untitledEntity}}static{this.styles=[LyraElement.styles,styles]}get hasPreviewSlot(){return this.slotPresence.has()}willUpdate(changed){super.willUpdate(changed),this.popoverOpen&&!this.hasPreviewSlot&&this.hidePreviewNow()}updated(changed){super.updated(changed),changed.has("popoverOpen")&&(this.cleanupPositioner?.(),this.cleanupPositioner=void 0,this.popoverOpen&&this.buttonEl&&this.popoverEl&&(this.cleanupPositioner=place(this.buttonEl,this.popoverEl,{placement:"top-start"})))}disconnectedCallback(){super.disconnectedCallback(),this.cleanupPositioner?.(),this.cleanupPositioner=void 0,clearTimeout(this.hideTimer),this.hideTimer=void 0,this.popoverOpen=!1,this.hovering=!1,this.focused=!1}get accessibleLabel(){const label=(this.text??"").trim()===""?this.localize("untitledEntity"):this.text,typeText=this.typeLabel?.trim()||(this.type??"").trim();return typeText?this.localize("entityChipWithType",void 0,{label,type:typeText}):label}showPreview(){this.hasPreviewSlot&&(clearTimeout(this.hideTimer),this.hideTimer=void 0,!this.popoverOpen&&(this.popoverOpen=!0))}scheduleHidePreview(){!this.popoverOpen||this.hovering||this.focused||(clearTimeout(this.hideTimer),this.hideTimer=setTimeout(()=>{this.hideTimer=void 0,this.popoverOpen=!1},HIDE_DELAY_MS))}hidePreviewNow(){clearTimeout(this.hideTimer),this.hideTimer=void 0,this.popoverOpen&&(this.popoverOpen=!1)}emitOpen(){isNonBlankIdentity(this.entityId)&&this.emit("lr-entity-open",{entityId:this.entityId})}render(){return html`
|
|
2
2
|
<span
|
|
3
3
|
class="wrapper"
|
|
4
4
|
@pointerenter=${this.onPointerEnter}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
const HULL_STROKE_WIDTH=48,MIN_PICK_TARGET_PX=24,PICK_RASTER_GUARD_PX=2,LABEL_HALO_WIDTH=3,EXPAND_BADGE_R=5,EXPAND_BADGE_OFFSET=Math.SQRT1_2;function pathForShape(x,y,r,shape){const path=new Path2D;if(shape==="circle")return path.arc(x,y,r,0,Math.PI*2),path;const s=r*Math.sqrt(Math.PI)/2;if(shape==="square")return path.rect(x-s,y-s,s*2,s*2),path;const d=s*Math.SQRT2;return path.moveTo(x,y-d),path.lineTo(x+d,y),path.lineTo(x,y+d),path.lineTo(x-d,y),path.closePath(),path}function drawArrowhead(ctx,link){const dx=link.x2-link.x1,dy=link.y2-link.y1,len=Math.hypot(dx,dy)||1,ux=dx/len,uy=dy/len,size=Math.max(6,link.width*3),bx=link.x2-ux*size,by=link.y2-uy*size,px=-uy,py=ux;ctx.beginPath(),ctx.moveTo(link.x2,link.y2),ctx.lineTo(bx+px*size*.4,by+py*size*.4),ctx.lineTo(bx-px*size*.4,by-py*size*.4),ctx.closePath(),ctx.fillStyle=ctx.strokeStyle,ctx.fill()}function drawRing(ctx,ring,color){ctx.strokeStyle=color,ctx.lineWidth=2,ctx.beginPath(),ctx.arc(ring.x,ring.y,ring.r,0,Math.PI*2),ctx.stroke()}function drawKeyboardFocusCue(ctx,scene){if(ctx.strokeStyle=scene.haloColor,ctx.setLineDash([4,3]),scene.keyboardFocusLink){const link=scene.keyboardFocusLink;ctx.lineWidth=Math.max(4,link.width+4),ctx.beginPath(),ctx.moveTo(link.x1,link.y1),ctx.lineTo(link.x2,link.y2),ctx.stroke()}scene.keyboardFocusHull&&(ctx.lineWidth=4,ctx.stroke(new Path2D(scene.keyboardFocusHull.d))),ctx.setLineDash([]),scene.keyboardFocusRing&&drawRing(ctx,scene.keyboardFocusRing,scene.haloColor)}function drawGraphScene(ctx,camera,scene){ctx.save(),ctx.transform(camera.k,0,0,camera.k,camera.x,camera.y);const hullOpacity=scene.hullOpacity??.12;for(const hull of scene.hulls){const path=new Path2D(hull.d);ctx.globalAlpha=hullOpacity,ctx.fillStyle=hull.fill,ctx.strokeStyle=hull.fill,ctx.lineWidth=48,ctx.lineJoin="round",ctx.lineCap="round",ctx.fill(path),ctx.stroke(path),ctx.globalAlpha=1}const dimmedOpacity=scene.dimmedOpacity??1;for(const link of scene.links)ctx.strokeStyle=link.selected?scene.selectedColor:link.color,ctx.lineWidth=link.width,ctx.setLineDash(link.dash?[...link.dash]:[]),ctx.globalAlpha=link.dimmed?dimmedOpacity:1,ctx.beginPath(),ctx.moveTo(link.x1,link.y1),ctx.lineTo(link.x2,link.y2),ctx.stroke(),link.directed&&drawArrowhead(ctx,link);if(ctx.globalAlpha=1,ctx.setLineDash([]),scene.edgeLabels.length){ctx.font=scene.font,ctx.textAlign="center",ctx.textBaseline="middle",ctx.lineWidth=3;for(const label of scene.edgeLabels)ctx.strokeStyle=scene.labelHaloColor,ctx.strokeText(label.text,label.x,label.y),ctx.fillStyle=scene.labelColor,ctx.fillText(label.text,label.x,label.y)}for(const node of scene.nodes){const path=pathForShape(node.x,node.y,node.r,node.shape);ctx.globalAlpha=node.dimmed?dimmedOpacity:1,ctx.fillStyle=node.fill,ctx.fill(path),node.selected&&(ctx.strokeStyle=scene.selectedColor,ctx.lineWidth=2,ctx.stroke(path))}if(ctx.globalAlpha=1,scene.showNodeLabels&&scene.nodeLabels.length){ctx.font=scene.font,ctx.textAlign="left",ctx.textBaseline="middle",ctx.fillStyle=scene.labelColor;for(const label of scene.nodeLabels)ctx.fillText(label.text,label.x,label.y)}const expandIndicators=scene.expandIndicators??[];if(expandIndicators.length){ctx.lineWidth=1;for(const indicator of expandIndicators){const bx=indicator.x+indicator.r*EXPAND_BADGE_OFFSET,by=indicator.y-indicator.r*EXPAND_BADGE_OFFSET,path=new Path2D;path.arc(bx,by,5,0,Math.PI*2),ctx.fillStyle=scene.expandBadgeFill??"",ctx.fill(path),ctx.strokeStyle=scene.expandBadgeStroke??"",ctx.stroke(path),ctx.strokeStyle=scene.labelColor,ctx.beginPath(),ctx.moveTo(bx-5/2,by),ctx.lineTo(bx+5/2,by),ctx.moveTo(bx,by-5/2),ctx.lineTo(bx,by+5/2),ctx.stroke()}}scene.focusHalo&&drawRing(ctx,scene.focusHalo,scene.haloColor),drawKeyboardFocusCue(ctx,scene),ctx.restore()}function indexToPickColor(index){const v=index+1;return`rgb(${v>>16&255},${v>>8&255},${v&255})`}function pickColorToIndex(r,g,b){return(r<<16|g<<8|b)-1}function drawPickingScene(ctx,camera,scene){ctx.imageSmoothingEnabled=!1,ctx.clearRect(0,0,ctx.canvas.width,ctx.canvas.height),ctx.save(),ctx.transform(camera.k,0,0,camera.k,camera.x,camera.y);const minimumWorldStroke=26/(Number.isFinite(camera.k)&&Math.abs(camera.k)>0?Math.abs(camera.k):1);let idx=0;for(const hull of scene.hulls){const color=indexToPickColor(idx++),path=new Path2D(hull.d);ctx.fillStyle=color,ctx.strokeStyle=color,ctx.lineWidth=Math.max(48,minimumWorldStroke),ctx.lineJoin="round",ctx.lineCap="round",ctx.fill(path),ctx.stroke(path)}for(const link of scene.links)ctx.strokeStyle=indexToPickColor(idx++),ctx.lineWidth=Math.max(link.width+6,8,minimumWorldStroke),ctx.lineCap="round",ctx.beginPath(),ctx.moveTo(link.x1,link.y1),ctx.lineTo(link.x2,link.y2),ctx.stroke();for(const node of scene.nodes)ctx.fillStyle=indexToPickColor(idx++),ctx.fill(pathForShape(node.x,node.y,Math.max(node.r,minimumWorldStroke/2),node.shape));ctx.restore()}export{drawGraphScene,drawPickingScene,indexToPickColor,pickColorToIndex};
|
|
1
|
+
const HULL_STROKE_WIDTH=48,MIN_PICK_TARGET_PX=24,PICK_RASTER_GUARD_PX=2,LABEL_HALO_WIDTH=3,EXPAND_BADGE_R=5,EXPAND_BADGE_OFFSET=Math.SQRT1_2;function pathForShape(x,y,r,shape){const path=new Path2D;if(shape==="circle")return path.arc(x,y,r,0,Math.PI*2),path;const s=r*Math.sqrt(Math.PI)/2;if(shape==="square")return path.rect(x-s,y-s,s*2,s*2),path;const d=s*Math.SQRT2;return path.moveTo(x,y-d),path.lineTo(x+d,y),path.lineTo(x,y+d),path.lineTo(x-d,y),path.closePath(),path}function drawArrowhead(ctx,link){const dx=link.x2-link.x1,dy=link.y2-link.y1,len=Math.hypot(dx,dy)||1,ux=dx/len,uy=dy/len,size=Math.max(6,link.width*3),bx=link.x2-ux*size,by=link.y2-uy*size,px=-uy,py=ux;ctx.beginPath(),ctx.moveTo(link.x2,link.y2),ctx.lineTo(bx+px*size*.4,by+py*size*.4),ctx.lineTo(bx-px*size*.4,by-py*size*.4),ctx.closePath(),ctx.fillStyle=ctx.strokeStyle,ctx.fill()}function drawRing(ctx,ring,color){ctx.strokeStyle=color,ctx.lineWidth=2,ctx.beginPath(),ctx.arc(ring.x,ring.y,ring.r,0,Math.PI*2),ctx.stroke()}function drawKeyboardFocusCue(ctx,scene){if(ctx.strokeStyle=scene.haloColor,ctx.setLineDash([4,3]),scene.keyboardFocusLink){const link=scene.keyboardFocusLink;ctx.lineWidth=Math.max(4,link.width+4),ctx.beginPath(),ctx.moveTo(link.x1,link.y1),ctx.lineTo(link.x2,link.y2),ctx.stroke()}scene.keyboardFocusHull&&(ctx.lineWidth=4,ctx.stroke(new Path2D(scene.keyboardFocusHull.d))),ctx.setLineDash([]),scene.keyboardFocusRing&&drawRing(ctx,scene.keyboardFocusRing,scene.haloColor)}function drawGraphScene(ctx,camera,scene){ctx.save(),ctx.transform(camera.k,0,0,camera.k,camera.x,camera.y);const hullOpacity=scene.hullOpacity??.12;for(const hull of scene.hulls){const path=new Path2D(hull.d);ctx.globalAlpha=hullOpacity,ctx.fillStyle=hull.fill,ctx.strokeStyle=hull.fill,ctx.lineWidth=48,ctx.lineJoin="round",ctx.lineCap="round",ctx.fill(path),ctx.stroke(path),ctx.globalAlpha=1}const dimmedOpacity=scene.dimmedOpacity??1;for(const link of scene.links)link.width<=0||(ctx.strokeStyle=link.selected?scene.selectedColor:link.color,ctx.lineWidth=link.width,ctx.setLineDash(link.dash?[...link.dash]:[]),ctx.globalAlpha=link.dimmed?dimmedOpacity:1,ctx.beginPath(),ctx.moveTo(link.x1,link.y1),ctx.lineTo(link.x2,link.y2),ctx.stroke(),link.directed&&drawArrowhead(ctx,link));if(ctx.globalAlpha=1,ctx.setLineDash([]),scene.edgeLabels.length){ctx.font=scene.font,ctx.textAlign="center",ctx.textBaseline="middle",ctx.lineWidth=3;for(const label of scene.edgeLabels)ctx.strokeStyle=scene.labelHaloColor,ctx.strokeText(label.text,label.x,label.y),ctx.fillStyle=scene.labelColor,ctx.fillText(label.text,label.x,label.y)}for(const node of scene.nodes){const path=pathForShape(node.x,node.y,node.r,node.shape);ctx.globalAlpha=node.dimmed?dimmedOpacity:1,ctx.fillStyle=node.fill,ctx.fill(path),node.selected&&(ctx.strokeStyle=scene.selectedColor,ctx.lineWidth=2,ctx.stroke(path))}if(ctx.globalAlpha=1,scene.showNodeLabels&&scene.nodeLabels.length){ctx.font=scene.font,ctx.textAlign="left",ctx.textBaseline="middle",ctx.fillStyle=scene.labelColor;for(const label of scene.nodeLabels)ctx.fillText(label.text,label.x,label.y)}const expandIndicators=scene.expandIndicators??[];if(expandIndicators.length){ctx.lineWidth=1;for(const indicator of expandIndicators){const bx=indicator.x+indicator.r*EXPAND_BADGE_OFFSET,by=indicator.y-indicator.r*EXPAND_BADGE_OFFSET,path=new Path2D;path.arc(bx,by,5,0,Math.PI*2),ctx.fillStyle=scene.expandBadgeFill??"",ctx.fill(path),ctx.strokeStyle=scene.expandBadgeStroke??"",ctx.stroke(path),ctx.strokeStyle=scene.labelColor,ctx.beginPath(),ctx.moveTo(bx-5/2,by),ctx.lineTo(bx+5/2,by),ctx.moveTo(bx,by-5/2),ctx.lineTo(bx,by+5/2),ctx.stroke()}}scene.focusHalo&&drawRing(ctx,scene.focusHalo,scene.haloColor),drawKeyboardFocusCue(ctx,scene),ctx.restore()}function indexToPickColor(index){const v=index+1;return`rgb(${v>>16&255},${v>>8&255},${v&255})`}function pickColorToIndex(r,g,b){return(r<<16|g<<8|b)-1}function drawPickingScene(ctx,camera,scene){ctx.imageSmoothingEnabled=!1,ctx.clearRect(0,0,ctx.canvas.width,ctx.canvas.height),ctx.save(),ctx.transform(camera.k,0,0,camera.k,camera.x,camera.y);const minimumWorldStroke=26/(Number.isFinite(camera.k)&&Math.abs(camera.k)>0?Math.abs(camera.k):1);let idx=0;for(const hull of scene.hulls){const color=indexToPickColor(idx++),path=new Path2D(hull.d);ctx.fillStyle=color,ctx.strokeStyle=color,ctx.lineWidth=Math.max(48,minimumWorldStroke),ctx.lineJoin="round",ctx.lineCap="round",ctx.fill(path),ctx.stroke(path)}for(const link of scene.links)ctx.strokeStyle=indexToPickColor(idx++),ctx.lineWidth=Math.max(link.width+6,8,minimumWorldStroke),ctx.lineCap="round",ctx.beginPath(),ctx.moveTo(link.x1,link.y1),ctx.lineTo(link.x2,link.y2),ctx.stroke();for(const node of scene.nodes)ctx.fillStyle=indexToPickColor(idx++),ctx.fill(pathForShape(node.x,node.y,Math.max(node.r,minimumWorldStroke/2),node.shape));ctx.restore()}export{drawGraphScene,drawPickingScene,indexToPickColor,pickColorToIndex};
|
|
@@ -38,7 +38,8 @@ export interface LyraScoreThresholds{readonly high:number;readonly medium:number
|
|
|
38
38
|
* via cssprops instead), no native SVG `<title>` tooltip (replaced by `part="tooltip"`), and a
|
|
39
39
|
* drawn focus ring instead of a CSS one. Keyboard roving/announcements are preserved through an
|
|
40
40
|
* offscreen `part="cursor-item"` button per node/link/hull, driving the identical roving-tabindex
|
|
41
|
-
* logic as `renderer="svg"`.
|
|
41
|
+
* logic as `renderer="svg"`. Both renderers skip nonoperable links when moving real keyboard
|
|
42
|
+
* focus. Zero-width links retain topology but paint neither a stroke nor an arrowhead.
|
|
42
43
|
*
|
|
43
44
|
* Public collection properties take bounded, clone-owned readonly snapshots. Create a new
|
|
44
45
|
* collection and reassign it after changes; mutating the assigned array does not update the view.
|
|
@@ -52,7 +53,8 @@ export interface LyraScoreThresholds{readonly high:number;readonly medium:number
|
|
|
52
53
|
* node's current coordinates in the graph's local drawing space.
|
|
53
54
|
* @event lr-link-click - `detail: { sourceNodeId, targetNodeId, linkId? }`.
|
|
54
55
|
* @event lr-node-enter - A node was hovered. `detail: { nodeId }`. Suppressed while dragging or
|
|
55
|
-
* panning.
|
|
56
|
+
* panning. Canvas enter/leave events fire once per hit-identity transition or exit. In SVG,
|
|
57
|
+
* also toggles a `data-hovered` attribute on that node's `[part="node"]` element for
|
|
56
58
|
* pure-CSS theming (not a substitute for this event — a consumer computing its own
|
|
57
59
|
* adjacency-based highlight needs the id, which only the event carries).
|
|
58
60
|
* @event lr-node-leave - The hover from `lr-node-enter` ended. `detail: { nodeId }`.
|
|
@@ -168,9 +170,9 @@ height:number;
|
|
|
168
170
|
chargeStrength:number;
|
|
169
171
|
/** Preferred link length for force layout and layer separation for layered layout. */
|
|
170
172
|
linkDistance:number;
|
|
171
|
-
/** Minimum camera scale accepted by zoom interactions. */
|
|
173
|
+
/** Minimum camera scale accepted by zoom interactions; updates live in both renderers. */
|
|
172
174
|
minZoom:number;
|
|
173
|
-
/** Maximum camera scale accepted by zoom interactions. */
|
|
175
|
+
/** Maximum camera scale accepted by zoom interactions; updates live in both renderers. */
|
|
174
176
|
maxZoom:number;
|
|
175
177
|
/** Accessible name for the graph. A present host `aria-label`, including an explicitly empty
|
|
176
178
|
* one, makes this host the sole graph owner; otherwise the SVG/canvas owns the localized name. */
|
|
@@ -303,7 +305,7 @@ private pickItems;private canvasDragNode?;private canvasPointerId?;private canva
|
|
|
303
305
|
/** The latest hover pointer position awaiting a hit test -- `pointermove` can fire far more
|
|
304
306
|
* often than the display refreshes, and each hit test costs a bounding-rect read plus a
|
|
305
307
|
* pick-pixel readback, so hover resolution is coalesced to at most one per animation frame. */
|
|
306
|
-
private pendingHover?;private hoverRafId?;private hoverRafOwner?;
|
|
308
|
+
private pendingHover?;private canvasHover?;private hoverRafId?;private hoverRafOwner?;
|
|
307
309
|
/** Cached world-space draw scene, reused for camera-only repaints (pan/zoom moves the camera,
|
|
308
310
|
* not the scene) -- building it costs a `getComputedStyle()` pass plus full per-node/per-link
|
|
309
311
|
* array rebuilds, so it's only invalidated (`markCanvasDirty()`) when data/selection/style
|
|
@@ -486,7 +488,7 @@ private simulationIsTicking;private onCanvasPointerUp;
|
|
|
486
488
|
/** Releases the force pin and capture belonging to one active canvas node drag. Pointer state is
|
|
487
489
|
* cleared before `releasePointerCapture()` because that call may synchronously dispatch
|
|
488
490
|
* `lostpointercapture`; the resulting handler then observes an already-finished gesture. */
|
|
489
|
-
private finishCanvasNodeDrag;private takeCanvasPointerDown;private onCanvasPointerCancel;private onCanvasLostPointerCapture;private onCanvasPointerLeave;private onCanvasDblClick;
|
|
491
|
+
private finishCanvasNodeDrag;private takeCanvasPointerDown;private onCanvasPointerCancel;private onCanvasLostPointerCapture;private onCanvasPointerLeave;private canvasHoverSuppressed;private updateCanvasHover;private onCanvasDblClick;
|
|
490
492
|
/** Geometric fallback for dblclick: browsers can deliver the event before the offscreen pick
|
|
491
493
|
* canvas has painted the latest frame, while the simulation coordinates are already current. */
|
|
492
494
|
private nodeAtCanvasPoint;private updateCanvasTooltip;private isSelected;private isDimmed;private linkKey;
|
|
@@ -570,7 +572,7 @@ private announceHiddenNodeCount;
|
|
|
570
572
|
* structural change simply recomputes wholesale). `lr-graph` never passes `fixedPositions`. */
|
|
571
573
|
private rebuildLayeredLayout;private onNodeClick;
|
|
572
574
|
/** Returns a node's current position in the graph's local drawing space. */
|
|
573
|
-
getNodePosition(id:string):{x:number;y:number;}|undefined;private onLinkClick;private onNodeEnter;private onNodeLeave;private onNodeDblClick;private onLinkEnter;private onLinkLeave;private nodeAccessibleText;
|
|
575
|
+
getNodePosition(id:string):{x:number;y:number;}|undefined;private onLinkClick;private onNodeEnter;private onNodeLeave;private onNodeDblClick;private onLinkEnter;private linkHoverDetail;private onLinkLeave;private nodeAccessibleText;
|
|
574
576
|
/** One bounded tooltip/content-summary model shared by SVG, canvas and live announcements. */
|
|
575
577
|
private boundedGraphText;private nodeTooltipText;private linkAccessibleText;private linkTooltipText;private linkCoordinates;
|
|
576
578
|
/** World-space midpoint of a link, offset EDGE_LABEL_OFFSET_PX perpendicular to the segment
|