@aceshooting/lyra-ui 27.0.0 → 28.0.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CHANGELOG.md +55 -63
- package/README.md +7 -3
- package/dist/cli/css-declarations.mjs +1 -0
- package/dist/cli/lyra-rename-ledger.mjs +1 -1
- package/dist/cli/migrate-wa.mjs +9 -4
- package/dist/cli/migration-contract.json +1 -1
- package/dist/cli/migration-renames.mjs +2 -2
- package/dist/cli/migration-theme-scopes.mjs +3 -0
- package/dist/cli/theme-scope-vocabulary.generated.mjs +1 -0
- package/dist/components/agent-tools/activity-feed/activity-feed.class.js +1 -1
- package/dist/components/agent-tools/agent-eval-dashboard/agent-eval-dashboard.class.js +1 -1
- package/dist/components/agent-tools/agent-question/agent-question.class.js +1 -1
- package/dist/components/agent-tools/agent-run/agent-run.class.js +1 -1
- package/dist/components/agent-tools/agent-trace/agent-trace.class.js +1 -1
- package/dist/components/agent-tools/approval-queue/approval-queue.class.js +1 -1
- package/dist/components/agent-tools/artifact-panel/artifact-panel.class.js +1 -1
- package/dist/components/agent-tools/background-runs/background-runs.class.js +1 -1
- package/dist/components/agent-tools/browser-frame/browser-frame.class.js +1 -1
- package/dist/components/agent-tools/budget-meter/budget-meter.class.js +1 -1
- package/dist/components/agent-tools/change-review/change-review.class.js +1 -1
- package/dist/components/agent-tools/commit-card/commit-card.class.js +1 -1
- package/dist/components/agent-tools/compare-panel/compare-panel.class.js +1 -1
- package/dist/components/agent-tools/confirm-bar/confirm-bar.class.js +1 -1
- package/dist/components/agent-tools/connector-manager/connector-manager.class.js +1 -1
- package/dist/components/agent-tools/context-inspector/context-inspector.class.js +1 -1
- package/dist/components/agent-tools/eval-dataset/eval-dataset.class.js +1 -1
- package/dist/components/agent-tools/eval-result/eval-result.class.js +1 -1
- package/dist/components/agent-tools/evaluation-run/evaluation-run.class.js +1 -1
- package/dist/components/agent-tools/mcp-app/mcp-app.class.js +1 -1
- package/dist/components/agent-tools/permission-grant/permission-grant.class.js +1 -1
- package/dist/components/agent-tools/permission-rules/permission-rules.class.js +1 -1
- package/dist/components/agent-tools/policy-summary/policy-summary.class.js +1 -1
- package/dist/components/agent-tools/prompt-studio/prompt-studio.class.js +1 -1
- package/dist/components/agent-tools/result-card/result-field.class.js +1 -1
- package/dist/components/agent-tools/schema-viewer/schema-viewer.class.js +1 -1
- package/dist/components/agent-tools/span-waterfall/span-waterfall.class.js +1 -1
- package/dist/components/agent-tools/stack-trace/stack-trace.class.js +1 -1
- package/dist/components/agent-tools/subagent-panel/subagent-panel.class.js +2 -2
- package/dist/components/agent-tools/task-list/task-list.class.js +2 -2
- package/dist/components/agent-tools/terminal/terminal.class.js +1 -1
- package/dist/components/agent-tools/test-results/test-results.class.js +1 -1
- package/dist/components/agent-tools/thinking-panel/thinking-panel.class.js +1 -1
- package/dist/components/agent-tools/tool-approval-dialog/tool-approval-dialog.class.js +1 -1
- package/dist/components/agent-tools/tool-call-block/tool-call-block.class.js +1 -1
- 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 +1 -1
- package/dist/components/agent-tools/tool-result-view/tool-result-view.class.js +1 -1
- package/dist/components/agent-tools/tool-select-dialog/tool-select-dialog.class.js +1 -1
- package/dist/components/agent-tools/tool-timeline/tool-timeline.class.js +1 -1
- package/dist/components/agent-tools/trace-tree/trace-tree.class.js +2 -2
- package/dist/components/charts/chart/box-plot.class.js +1 -1
- package/dist/components/charts/chart/chart-token-cache.js +2 -2
- package/dist/components/charts/chart/chart.class.d.ts +1 -1
- package/dist/components/charts/chart/chart.class.js +3 -3
- package/dist/components/charts/chart/histogram.class.js +1 -1
- package/dist/components/charts/chart/lite-chart.class.js +1 -1
- package/dist/components/conversation/agent-workspace/agent-workspace.class.js +1 -1
- package/dist/components/conversation/audio-visualizer/audio-visualizer.class.js +1 -1
- package/dist/components/conversation/branch-picker/branch-picker.class.js +1 -1
- package/dist/components/conversation/chat-composer/chat-composer.class.js +1 -1
- package/dist/components/conversation/chat-message/chat-message.class.js +1 -1
- package/dist/components/conversation/chat-viewport/chat-viewport.class.js +1 -1
- package/dist/components/conversation/checkpoint/checkpoint.class.js +1 -1
- package/dist/components/conversation/code-block/code-block-base.class.js +1 -1
- package/dist/components/conversation/code-block/code-block-core.class.js +1 -1
- package/dist/components/conversation/code-block/code-block.class.js +1 -1
- package/dist/components/conversation/conversation-item/conversation-item.class.js +1 -1
- package/dist/components/conversation/generation-metrics/generation-metrics.class.js +1 -1
- package/dist/components/conversation/handoff-divider/handoff-divider.class.js +1 -1
- package/dist/components/conversation/markdown/markdown-base.class.js +1 -1
- package/dist/components/conversation/markdown/markdown-core.class.js +1 -1
- package/dist/components/conversation/markdown/markdown.class.js +1 -1
- package/dist/components/conversation/message-actions/message-actions.class.js +1 -1
- package/dist/components/conversation/message-feedback/message-feedback.class.js +1 -1
- package/dist/components/conversation/message-parts/message-parts.class.js +1 -1
- package/dist/components/conversation/model-select/model-select.class.js +1 -1
- package/dist/components/conversation/model-settings-panel/model-settings-panel.class.js +1 -1
- package/dist/components/conversation/prompt-input/prompt-input.class.js +1 -1
- package/dist/components/conversation/prompt-queue/prompt-queue.class.js +1 -1
- package/dist/components/conversation/push-to-talk/push-to-talk.class.js +1 -1
- package/dist/components/conversation/realtime-session/realtime-session.class.js +1 -1
- package/dist/components/conversation/selection-toolbar/selection-toolbar.class.js +1 -1
- package/dist/components/conversation/stream-status/stream-status.class.js +1 -1
- package/dist/components/conversation/suggestion-chips/suggestion-chips.class.js +1 -1
- package/dist/components/conversation/thread-list/thread-list.class.js +1 -1
- package/dist/components/conversation/transcript-feed/transcript-feed.class.js +1 -1
- package/dist/components/conversation/typing-indicator/typing-indicator.class.js +1 -1
- package/dist/components/conversation/usage-badge/usage-badge.class.js +1 -1
- package/dist/components/conversation/voice-picker/voice-picker.class.js +1 -1
- package/dist/components/data/calendar/calendar.class.js +1 -1
- package/dist/components/data/condition-builder/condition-builder.class.js +1 -1
- package/dist/components/data/context-meter/context-meter.class.js +1 -1
- package/dist/components/data/data-grid/data-grid.class.d.ts +2 -2
- package/dist/components/data/data-grid/data-grid.class.js +3 -3
- package/dist/components/data/document-library/document-library.class.js +1 -1
- package/dist/components/data/env-list/env-list.class.js +1 -1
- package/dist/components/data/file-tree/file-tree.class.d.ts +2 -2
- package/dist/components/data/file-tree/file-tree.class.js +1 -1
- package/dist/components/data/flow-canvas/flow-canvas.class.js +1 -1
- package/dist/components/data/flow-controls/flow-controls.class.js +1 -1
- package/dist/components/data/flow-minimap/flow-minimap.class.js +1 -1
- package/dist/components/data/flow-node/flow-node.class.js +1 -1
- package/dist/components/data/flow-run-status/flow-run-status.class.js +1 -1
- package/dist/components/data/funnel/funnel.class.js +1 -1
- package/dist/components/data/gauge/gauge.class.js +1 -1
- package/dist/components/data/graph-query-builder/graph-query-builder.class.js +1 -1
- package/dist/components/data/heatmap/heatmap.class.js +1 -1
- package/dist/components/data/pagination/pagination.class.d.ts +2 -0
- package/dist/components/data/pagination/pagination.class.js +1 -1
- package/dist/components/data/pagination/pagination.styles.js +1 -1
- package/dist/components/data/sequence-strip/sequence-strip.class.js +1 -1
- package/dist/components/data/sparkline/sparkline.class.js +1 -1
- package/dist/components/data/stat/stat.class.js +1 -1
- package/dist/components/data/table/table.class.d.ts +23 -2
- package/dist/components/data/table/table.class.js +5 -3
- package/dist/components/data/table/table.styles.js +1 -1
- package/dist/components/data/timeline/timeline.class.js +1 -1
- package/dist/components/data/tree/tree.class.js +1 -1
- package/dist/components/data/word-cloud/word-cloud.class.js +1 -1
- package/dist/components/forms/button/button.class.js +1 -1
- package/dist/components/forms/checkbox/checkbox.class.js +1 -1
- package/dist/components/forms/checkbox-group/checkbox-group.class.js +1 -1
- package/dist/components/forms/code-editor/code-editor.class.js +1 -1
- package/dist/components/forms/color-picker/color-picker.class.d.ts +8 -4
- package/dist/components/forms/color-picker/color-picker.class.js +2 -2
- package/dist/components/forms/combobox/combobox.class.js +1 -1
- package/dist/components/forms/country-picker/country-picker.class.js +1 -1
- package/dist/components/forms/currency-picker/currency-picker.class.js +1 -1
- package/dist/components/forms/date-picker/date-input.class.js +1 -1
- package/dist/components/forms/date-picker/date-picker.class.js +1 -1
- package/dist/components/forms/emoji-picker/emoji-data-loader.js +1 -1
- package/dist/components/forms/emoji-picker/emoji-picker.class.d.ts +7 -4
- package/dist/components/forms/emoji-picker/emoji-picker.class.js +5 -5
- package/dist/components/forms/icon-button/icon-button.class.d.ts +4 -0
- package/dist/components/forms/icon-button/icon-button.class.js +1 -1
- package/dist/components/forms/icon-button/icon-button.styles.js +1 -1
- package/dist/components/forms/input/input-shared.js +1 -1
- package/dist/components/forms/input/input.class.js +1 -1
- package/dist/components/forms/input/native-time-input.class.js +1 -1
- package/dist/components/forms/input/number-input.class.js +1 -1
- package/dist/components/forms/input/time-input.class.js +1 -1
- package/dist/components/forms/locale-picker/locale-picker.class.js +1 -1
- package/dist/components/forms/otp-input/otp-input.class.js +1 -1
- package/dist/components/forms/phone-input/phone-input.class.js +1 -1
- package/dist/components/forms/radio/radio-group.class.js +1 -1
- package/dist/components/forms/radio/radio.class.js +1 -1
- package/dist/components/forms/rubric-form/rubric-form.class.js +4 -4
- package/dist/components/forms/select/select.class.js +1 -1
- package/dist/components/forms/signature-pad/signature-pad.class.js +1 -1
- package/dist/components/forms/slider/slider.class.js +1 -1
- package/dist/components/forms/switch/switch.class.js +1 -1
- package/dist/components/forms/textarea/textarea.class.js +1 -1
- package/dist/components/forms/time-range/time-range.class.js +1 -1
- package/dist/components/forms/time-zone-picker/time-zone-picker.class.js +1 -1
- package/dist/components/forms/token-input/token-input.class.js +1 -1
- package/dist/components/forms/unit-picker/unit-picker.class.js +1 -1
- package/dist/components/layout/app-rail/app-rail-item.class.js +1 -1
- package/dist/components/layout/app-rail/app-rail.class.d.ts +70 -7
- package/dist/components/layout/app-rail/app-rail.class.js +16 -4
- package/dist/components/layout/app-rail/app-rail.styles.js +1 -1
- package/dist/components/layout/app-rail-group/app-rail-group.class.js +1 -1
- package/dist/components/layout/breadcrumb/breadcrumb.class.js +1 -1
- package/dist/components/layout/card/card.class.js +1 -1
- 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.js +1 -1
- package/dist/components/layout/details/accordion-item.class.js +1 -1
- package/dist/components/layout/details/details.class.js +1 -1
- package/dist/components/layout/dock-panel/dock-panel.class.js +1 -1
- package/dist/components/layout/drilldown-panel/drilldown-panel.class.js +1 -1
- package/dist/components/layout/filter-bar/filter-bar.class.js +1 -1
- package/dist/components/layout/menu/menu.class.js +1 -1
- package/dist/components/layout/menubar/menubar.class.js +1 -1
- package/dist/components/layout/multi-split/multi-split.class.js +1 -1
- package/dist/components/layout/navigation-menu/navigation-menu.class.js +1 -1
- package/dist/components/layout/page/page.class.js +1 -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/responsive-panel/responsive-panel.class.js +1 -1
- package/dist/components/layout/scroller/scroller.class.js +1 -1
- package/dist/components/layout/segmented/segmented.class.d.ts +7 -4
- package/dist/components/layout/segmented/segmented.styles.js +1 -1
- package/dist/components/layout/split-panel/split-panel.class.js +1 -1
- package/dist/components/layout/tab-group/tab-group.class.js +1 -1
- package/dist/components/layout/tab-group/tab.class.js +1 -1
- package/dist/components/layout/virtual-list/virtual-list.styles.js +1 -1
- package/dist/components/layout/widget/widget.class.js +1 -1
- package/dist/components/media/animated-image/animated-image.class.js +1 -1
- package/dist/components/media/attachment-chip/attachment-chip.class.js +1 -1
- package/dist/components/media/attachment-trigger/attachment-trigger.class.js +2 -2
- package/dist/components/media/av-player/av-player.class.js +1 -1
- package/dist/components/media/avatar-group/avatar-group.class.js +1 -1
- package/dist/components/media/drop-zone/drop-zone.class.js +1 -1
- package/dist/components/media/file-icon/file-icon.class.js +1 -1
- package/dist/components/media/file-input/file-input.class.js +1 -1
- package/dist/components/media/flag/flag.class.js +1 -1
- package/dist/components/media/image-comparer/image-comparer.class.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 +4 -2
- package/dist/components/media/image-viewer/image-viewer.styles.js +1 -1
- package/dist/components/media/lightbox/lightbox.class.js +1 -1
- package/dist/components/media/map/map.class.js +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/qr-code/qr-code.class.d.ts +2 -2
- package/dist/components/media/qr-code/qr-code.class.js +1 -1
- package/dist/components/media/sequence-playback/sequence-playback.class.js +1 -1
- package/dist/components/media/video/video.class.js +1 -1
- package/dist/components/media/video-playlist/video-playlist.class.js +1 -1
- package/dist/components/media/zoomable-frame/zoomable-frame.class.js +1 -1
- package/dist/components/overlays/alert/alert.class.js +1 -1
- package/dist/components/overlays/badge/tag.class.js +1 -1
- package/dist/components/overlays/callout/callout.class.js +1 -1
- package/dist/components/overlays/chip/chip-group.class.js +1 -1
- package/dist/components/overlays/chip/chip.class.js +1 -1
- package/dist/components/overlays/context-menu/context-menu.class.js +1 -1
- package/dist/components/overlays/dialog/confirm.js +1 -1
- package/dist/components/overlays/dialog/dialog.class.js +1 -1
- package/dist/components/overlays/kbd/kbd.class.js +1 -1
- package/dist/components/overlays/overlay/popover.class.js +1 -1
- package/dist/components/overlays/overlay/tooltip.class.js +1 -1
- package/dist/components/overlays/progress/progress-bar.class.js +1 -1
- package/dist/components/overlays/progress/progress-ring.class.js +1 -1
- package/dist/components/overlays/rating/rating.class.js +1 -1
- package/dist/components/overlays/skeleton/skeleton.class.js +1 -1
- package/dist/components/overlays/spinner/spinner.class.js +1 -1
- package/dist/components/overlays/toast/toast-item.class.js +1 -1
- package/dist/components/overlays/toast/toast.class.js +1 -1
- package/dist/components/retrieval/chunk-inspector/chunk-inspector.class.js +1 -1
- package/dist/components/retrieval/citation-badge/citation-badge.class.js +1 -1
- package/dist/components/retrieval/claim-evidence/claim-evidence.class.js +1 -1
- package/dist/components/retrieval/community-card/community-card.class.js +1 -1
- package/dist/components/retrieval/embedding-explorer/embedding-explorer.class.js +1 -1
- package/dist/components/retrieval/entity-card/entity-card.class.js +1 -1
- package/dist/components/retrieval/entity-chip/entity-chip.class.js +1 -1
- package/dist/components/retrieval/entity-dossier/entity-dossier.class.js +1 -1
- package/dist/components/retrieval/graph/graph.class.js +1 -1
- package/dist/components/retrieval/graph-legend/graph-legend.class.js +1 -1
- package/dist/components/retrieval/grounding-summary/grounding-summary.class.js +2 -2
- package/dist/components/retrieval/ingestion-queue/ingestion-queue.class.js +1 -1
- package/dist/components/retrieval/knowledge-base/knowledge-base.class.js +1 -1
- package/dist/components/retrieval/knowledge-base-admin/knowledge-base-admin.class.js +1 -1
- package/dist/components/retrieval/knowledge-graph-explorer/knowledge-graph-explorer.class.js +1 -1
- package/dist/components/retrieval/memory-panel/memory-panel.class.js +1 -1
- package/dist/components/retrieval/mind-map/mind-map.class.js +1 -1
- package/dist/components/retrieval/neighbor-list/neighbor-list.class.js +1 -1
- package/dist/components/retrieval/node-palette/node-palette.class.js +1 -1
- package/dist/components/retrieval/path-strip/path-strip.class.js +1 -1
- package/dist/components/retrieval/provenance-panel/provenance-panel.class.js +1 -1
- package/dist/components/retrieval/rag-answer/rag-answer.class.js +1 -1
- package/dist/components/retrieval/rag-eval-dashboard/rag-eval-dashboard.class.js +1 -1
- package/dist/components/retrieval/research-progress/research-progress.class.js +1 -1
- package/dist/components/retrieval/retrieval-compare/retrieval-compare.class.js +1 -1
- package/dist/components/retrieval/retrieval-results/retrieval-results.class.js +1 -1
- package/dist/components/retrieval/retrieval-search/retrieval-search.class.js +1 -1
- package/dist/components/retrieval/retrieval-trace/retrieval-trace.class.js +1 -1
- package/dist/components/retrieval/source-card/source-card.class.js +1 -1
- package/dist/components/retrieval/source-list/source-list.class.js +1 -1
- package/dist/components/retrieval/source-picker/source-picker.class.js +1 -1
- package/dist/components/utility/copy-button/copy-button.class.js +1 -1
- package/dist/components/utility/diff-view/diff-view.class.js +1 -1
- package/dist/components/utility/export-button/export-button.class.js +1 -1
- package/dist/components/utility/icon/icon.class.js +1 -1
- package/dist/components/utility/json-viewer/json-viewer.class.js +1 -1
- package/dist/components/utility/known-date/known-date.class.js +1 -1
- package/dist/components/utility/mention-popover/mention-popover.class.js +1 -1
- package/dist/components/utility/poll-status/poll-status.class.js +1 -1
- package/dist/components/utility/random-content/random-content.class.js +1 -1
- package/dist/components/utility/tour/tour.class.js +1 -1
- package/dist/components/viewers/archive-viewer/archive-viewer.class.js +1 -1
- package/dist/components/viewers/calendar-viewer/calendar-viewer.class.js +1 -1
- package/dist/components/viewers/contact-viewer/contact-viewer.class.js +1 -1
- package/dist/components/viewers/csv-viewer/csv-viewer.class.js +1 -1
- package/dist/components/viewers/dataset-viewer/dataset-viewer.class.js +2 -2
- package/dist/components/viewers/document-compare/document-compare.class.js +1 -1
- package/dist/components/viewers/document-preview/document-preview.class.js +1 -1
- package/dist/components/viewers/document-viewer/document-viewer.class.js +1 -1
- package/dist/components/viewers/docx-viewer/docx-viewer.class.js +1 -1
- package/dist/components/viewers/ebook-viewer/ebook-viewer.class.js +1 -1
- package/dist/components/viewers/email-viewer/email-viewer.class.js +1 -1
- package/dist/components/viewers/geojson-view/geojson-view.class.js +1 -1
- package/dist/components/viewers/geojson-view/geojson-viewer.class.js +1 -1
- package/dist/components/viewers/highlight-layer/highlight-layer.class.js +1 -1
- package/dist/components/viewers/html-viewer/html-viewer.class.js +1 -1
- package/dist/components/viewers/include/include.class.js +1 -1
- package/dist/components/viewers/notebook-viewer/notebook-viewer.class.js +1 -1
- package/dist/components/viewers/page-rail/page-rail.class.d.ts +1 -1
- package/dist/components/viewers/page-rail/page-rail.class.js +3 -3
- package/dist/components/viewers/pdf-viewer/pdf-viewer.class.d.ts +2 -2
- package/dist/components/viewers/pdf-viewer/pdf-viewer.class.js +2 -2
- package/dist/components/viewers/pptx-viewer/pptx-viewer.class.js +1 -1
- package/dist/components/viewers/spreadsheet-viewer/spreadsheet-viewer.class.js +1 -1
- package/dist/components/viewers/svg-viewer/svg-viewer.class.js +1 -1
- package/dist/components/viewers/xml-viewer/xml-viewer.class.js +1 -1
- package/dist/events.d.ts +6 -1
- package/dist/framework-types.d.ts +1 -1
- package/dist/internal/accessibility-visibility.js +1 -1
- package/dist/internal/collection-snapshot.js +1 -1
- package/dist/internal/default-strings/agent-tools.generated.js +1 -0
- package/dist/internal/default-strings/charts.generated.js +1 -0
- package/dist/internal/default-strings/conversation.generated.js +1 -0
- package/dist/internal/default-strings/data.generated.js +1 -0
- package/dist/internal/default-strings/forms.generated.js +1 -0
- package/dist/internal/default-strings/layout.generated.js +1 -0
- package/dist/internal/default-strings/media.generated.js +1 -0
- package/dist/internal/default-strings/overlays.generated.js +1 -0
- package/dist/internal/default-strings/retrieval.generated.js +1 -0
- package/dist/internal/default-strings/shared.generated.js +1 -0
- package/dist/internal/default-strings/utility.generated.js +1 -0
- package/dist/internal/default-strings/viewers.generated.js +5 -0
- package/dist/internal/dev-mode-attribute-warning.development.js +1 -1
- package/dist/internal/dev-mode-attribute-warning.production.js +1 -1
- package/dist/internal/document-tokens.d.ts +11 -0
- package/dist/internal/document-tokens.generated.js +15 -0
- package/dist/internal/document-tokens.js +3 -0
- package/dist/internal/form-associated.d.ts +1 -1
- package/dist/internal/form-associated.js +1 -1
- package/dist/internal/glass-surface.styles.js +1 -1
- package/dist/internal/host-tokens.styles.js +1 -0
- package/dist/internal/image-zoom.js +1 -0
- package/dist/internal/intl-cache.js +1 -1
- package/dist/internal/localization-types.d.ts +1 -1
- package/dist/internal/localization.js +2 -2
- package/dist/internal/lyra-element.d.ts +4 -2
- package/dist/internal/lyra-element.js +2 -2
- package/dist/internal/opaque-content-border.styles.js +1 -1
- package/dist/internal/open-overlay-raise.styles.js +1 -0
- package/dist/internal/optional-peer-failure.js +1 -0
- package/dist/internal/package-metadata.js +1 -1
- package/dist/internal/prefix.js +1 -1
- package/dist/internal/specialist-host-tokens.styles.js +1 -0
- package/dist/internal/specialist-tokens.generated.js +2 -0
- package/dist/internal/step-value.js +1 -1
- package/dist/internal/theme-observation.js +1 -1
- package/dist/internal/theme-scopes.d.ts +11 -0
- package/dist/internal/theme-scopes.js +1 -0
- package/dist/looks/shadcn.css +1 -1
- package/dist/lyra.d.ts +1 -1
- package/dist/lyra.js +1 -1
- package/dist/styles/design-tokens.css +1 -1
- package/dist/styles/tokens-root.css +1 -1
- package/dist/surfaces/glass.css +1 -1
- package/dist/testing/happy-dom-shims.d.ts +21 -2
- package/dist/testing/happy-dom-shims.js +1 -1
- package/dist/testing/index.d.ts +1 -1
- package/dist/testing/index.js +1 -1
- package/dist/testing/interaction-drivers.d.ts +66 -7
- package/dist/testing/interaction-drivers.js +1 -1
- package/dist/testing/jsdom-shims.d.ts +70 -0
- package/dist/testing/jsdom-shims.js +1 -0
- package/dist/theme/look-inputs.d.ts +1 -1
- package/dist/theme/look-inputs.js +37 -41
- package/dist/theme/theme.d.ts +13 -0
- package/dist/theme/theme.js +1 -1
- package/dist/theme.css +1 -1
- package/dist/utilities/index.d.ts +1 -1
- package/dist/utilities/index.js +1 -1
- package/dist/utilities/scoped-registry.d.ts +3 -0
- package/dist/utilities/scoped-registry.js +1 -1
- package/dist/utilities/theme-scopes.d.ts +1 -0
- package/dist/utilities/theme-scopes.js +1 -0
- package/dist/utilities/tokens.d.ts +1 -0
- package/dist/utilities/tokens.js +1 -0
- package/llms/components/lr-app-rail.md +51 -4
- package/llms/components/lr-emoji-picker.md +13 -8
- package/llms/components/lr-icon-button.md +13 -1
- package/llms/components/lr-image-viewer.md +8 -0
- package/llms/components/lr-pagination.md +4 -2
- package/llms/components/lr-segmented.md +7 -3
- package/llms/components/lr-table.md +14 -12
- package/llms/components/lr-thread-list.md +4 -3
- package/llms/migration.md +9 -0
- package/llms/peers.md +1 -1
- package/llms/shared/events-and-types.md +41 -0
- package/llms/shared/frameworks-and-ssr.md +16 -0
- package/llms/shared/imports-and-registration.md +4 -3
- package/llms/shared/native-styles-and-utilities.md +38 -3
- package/llms/shared/styles-and-tokens.md +242 -102
- package/llms/shared/testing-and-utilities.md +90 -6
- package/llms/shared.md +431 -114
- package/llms/tokens.md +31 -49
- package/locales.json +138 -138
- package/package.json +14 -7
- package/registrations.json +1 -1
- package/dist/internal/default-strings.generated.js +0 -5
- package/dist/internal/specialist-tokens.styles.js +0 -1
- package/dist/internal/tokens/palette.styles.js +0 -1
- package/dist/internal/tokens.styles.js +0 -1
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import{__decorate}from"tslib";import{html,nothing}from"lit";import{property,query,state}from"lit/decorators.js";import{repeat}from"lit/directives/repeat.js";import{LyraElement}from"../../../internal/lyra-element.js";import{resolveListMove}from"../../../internal/list-navigation.js";import{nextId}from"../../../internal/a11y.js";import{composedAccessibilityText}from"../../../internal/accessibility-visibility.js";import{isHtmlElement}from"../../../internal/dom-guards.js";import{chevronIcon}from"../../../internal/icons.js";import{prefersReducedMotion}from"../../../internal/motion.js";import{tag}from"../../../internal/prefix.js";import{observeScrollOverflow}from"../../../internal/scroll-overflow.js";import{scrollOverflowFadeStyles}from"../../../internal/scroll-overflow.styles.js";import{styles}from"./tab-group.styles.js";import{shadowFocusTarget}from"../../../internal/active-element.js";import{LYRA_DEFAULT_scrollNext,LYRA_DEFAULT_scrollPrevious}from"../../../internal/default-strings.generated.js";function isInertChild(child){return isHtmlElement(child)&&child.inert}function isTabLabelSubtreeExcludedWithoutInert(element){if(element.hasAttribute("hidden")||element.getAttribute("aria-hidden")?.trim().toLowerCase()==="true")return!0;const rendered=element.ownerDocument.defaultView?.getComputedStyle(element);return rendered?.display==="none"||rendered?.contentVisibility==="hidden"}const SYNTHETIC_PANEL_PREFIX="lr-tab-",SCROLL_STEP_RATIO=.8;class LyraTabGroup extends LyraElement{constructor(){super(...arguments),this.active="",this.accessibleLabel=null,this.placement="top",this.activation="auto",this.withoutScrollControls=!1,this.noScrollControls=!1,this.fixedScrollControls=!1,this.tabs=[],this.focusedTab="",this.baseId=nextId("tab-group"),this.nextOpaqueId=0,this.idsBySlot=new Map,this.mutationObserverGeneration=0,this.projectedSourceSnapshots=new Map,this.projectedSlotSnapshots=new Map,this.projectedSourceObserverGeneration=0,this.rehomeTabFocus=!1,this.scrollStartAvailable=!1,this.scrollEndAvailable=!1,this.scrollOverflow=observeScrollOverflow(this,()=>this.renderRoot.querySelector('[part~="tablist"]'),()=>this.measureTabScrollEdges()),this.syncTabs=()=>{const children=Array.from(this.children);this.adoptProjectedSourceInertStates(),this.adoptProjectedSlotStates();const projectedSlots=new Set,next=this.readElementModel(children,projectedSlots);this.syncProjectedSlots(projectedSlots),this.syncProjectedSources(next);const liveSlots=new Set(next.map(tab=>tab.slotName));for(const slotName of this.idsBySlot.keys())liveSlots.has(slotName)||this.idsBySlot.delete(slotName);this.tabs=next},this.onTabListKeyDown=e=>{if(e.altKey||e.ctrlKey||e.metaKey||e.isComposing)return;const navigable=this.tabs.filter(t=>this.isNavigable(t));if(navigable.length===0)return;const origin=this.keyboardOriginTab(e,navigable),currentIndex=origin?navigable.indexOf(origin):-1;if(e.key==="Delete"){if(!origin?.element.closable)return;e.preventDefault(),origin.element.requestCloseFromOwner();return}if(this.activation==="manual"&&(e.key==="Enter"||e.key===" "||e.key==="Spacebar")){if(!origin)return;e.preventDefault(),this.activateTab(origin);return}const targetIndex=resolveListMove(e,{count:navigable.length,current:currentIndex,orientation:this.isVertical?"vertical":"horizontal",direction:this.effectiveDirection});if(targetIndex===null)return;e.preventDefault();const target=navigable[targetIndex];if(this.activation==="manual"){this.focusOnly(target);return}this.activateTab(target),this.focusTab(target.slotName)},this.onTabListScroll=()=>{this.measureTabScrollEdges()},this.onScrollControlMouseDown=event=>{event.preventDefault()},this.onScrollControlPointerDown=event=>{const control=event.currentTarget;control instanceof HTMLElement&&(control.setAttribute("data-pressed",""),control.setPointerCapture(event.pointerId))},this.onScrollControlPointerEnd=event=>{const control=event.currentTarget;control instanceof HTMLElement&&(control.removeAttribute("data-pressed"),control.hasPointerCapture(event.pointerId)&&control.releasePointerCapture(event.pointerId))}}static{this.defaultStrings={...super.defaultStrings,scrollNext:LYRA_DEFAULT_scrollNext,scrollPrevious:LYRA_DEFAULT_scrollPrevious}}static{this.styles=[LyraElement.styles,scrollOverflowFadeStyles,styles]}connectedCallback(){super.connectedCallback(),this.hasUpdated?this.syncTabs():this.seedFirstRenderState(this.syncTabs),this.resetMutationObserver();const ownerDocument=this.ownerDocument,MutationObserverCtor=ownerDocument.defaultView?.MutationObserver;if(!MutationObserverCtor)return;const generation=this.mutationObserverGeneration,observer=new MutationObserverCtor(records=>{if(this.mutationObserver!==observer||this.mutationObserverDocument!==ownerDocument||this.mutationObserverGeneration!==generation||!this.isConnected||this.ownerDocument!==ownerDocument)return;const isDirectChild=node=>node.parentNode===this,isElementTabContent=node=>{let current=node.nodeType===1?node:node.parentElement;for(;current&¤t!==this;){if(current.localName===tag("tab")&¤t.parentNode===this)return!0;current=current.parentElement}return!1};records.some(record=>record.type==="childList"?record.target===this||isElementTabContent(record.target):record.type==="characterData"?isElementTabContent(record.target):record.attributeName==="inert"&&this.projectedSourceSnapshots.has(record.target)?!1:isDirectChild(record.target)||isElementTabContent(record.target))&&this.syncTabs()});this.mutationObserver=observer,this.mutationObserverDocument=ownerDocument,observer.observe(this,{childList:!0,subtree:!0,attributes:!0,characterData:!0,attributeFilter:["alt","aria-hidden","aria-label","aria-labelledby","class","closable","disabled","hidden","inert","id","label","name","open","panel","slot","style"]})}disconnectedCallback(){this.resetMutationObserver(),this.resetProjectedSourceObserver(),this.restoreProjectedSources(),this.restoreProjectedSlots(),super.disconnectedCallback()}adoptedCallback(){super.adoptedCallback(),this.resetMutationObserver(),this.resetProjectedSourceObserver()}resetMutationObserver(){this.mutationObserverGeneration+=1,this.mutationObserver?.disconnect(),this.mutationObserver=void 0,this.mutationObserverDocument=void 0}readElementModel(children,projectedSlots){const seen=new Set,next=[],panels=children.filter(child=>child.localName===tag("tab-panel")),authoredNames=new Set(children.flatMap(child=>{if(child.localName===tag("tab")){const name=child.getAttribute("panel");return name?[name]:[]}if(child.localName===tag("tab-panel")){const name=child.getAttribute("name");return name?[name]:[]}return[]}));let index=0;for(const child of children){if(child.localName!==tag("tab"))continue;const authoredPanel=child.getAttribute("panel")||void 0;let slotName=authoredPanel??`${SYNTHETIC_PANEL_PREFIX}${index}`;if(!authoredPanel){let collision=0;for(;authoredNames.has(slotName)||seen.has(slotName);)collision+=1,slotName=`${SYNTHETIC_PANEL_PREFIX}${index}-${collision}`}if(index+=1,!authoredPanel&&!this.readElementLabel(child,{allowUnprojected:!0})||seen.has(slotName))continue;seen.add(slotName);const tabSlot=this.tabSlotName(slotName);this.projectSlot(child,tabSlot,projectedSlots);const visibleLabel=this.readElementLabel(child);if(!authoredPanel&&!visibleLabel)continue;const label=visibleLabel||slotName,panel=panels.find(candidate=>candidate.getAttribute("name")===slotName);panel&&this.projectSlot(panel,slotName,projectedSlots),next.push({slotName,label,disabled:child.hasAttribute("disabled"),inert:isInertChild(child),element:child}),!this.active&&child.hasAttribute("active")&&(this.active=slotName)}return next}readElementLabel(tab,options={}){const labelNodes=Array.from(tab.childNodes).filter(node=>node.nodeType!==Node.ELEMENT_NODE||node.getAttribute("slot")===null||node.getAttribute("slot")==="");return composedAccessibilityText(labelNodes,{ancestorBoundary:tab,isSubtreeExcluded:element=>this.isTabLabelSubtreeExcluded(element),requireRendered:!options.allowUnprojected,skipRootAncestorValidation:options.allowUnprojected,ignoreInheritedVisibility:!0}).replace(/\s+/g," ").trim()}libraryOwnsSourceInert(element){return this.projectedSourceSnapshots.get(element)?.libraryOwnsInert===!0}isTabLabelSubtreeExcluded(element){return isTabLabelSubtreeExcludedWithoutInert(element)||element.hasAttribute("inert")&&!this.libraryOwnsSourceInert(element)}snapshotProjectedSource(source){const inert=source.getAttribute("inert");return{inert,appliedInert:inert,libraryOwnsInert:!1}}adoptProjectedSourceInert(source,snapshot){const current=source.getAttribute("inert");current!==snapshot.appliedInert&&(snapshot.inert=current,snapshot.libraryOwnsInert=!1)}makeProjectedSourceInert(source,snapshot){source.hasAttribute("inert")||(source.setAttribute("inert",""),snapshot.libraryOwnsInert=!0),snapshot.appliedInert=source.getAttribute("inert")}restoreProjectedSource(source,snapshot){this.adoptProjectedSourceInert(source,snapshot),snapshot.inert===null?source.removeAttribute("inert"):source.setAttribute("inert",snapshot.inert)}restoreProjectedSources(){for(const[source,snapshot]of this.projectedSourceSnapshots)this.restoreProjectedSource(source,snapshot);this.projectedSourceSnapshots.clear()}resetProjectedSourceObserver(){this.projectedSourceObserverGeneration+=1,this.projectedSourceObserver?.disconnect(),this.projectedSourceObserver=void 0,this.projectedSourceObserverDocument=void 0}observeProjectedSources(){this.resetProjectedSourceObserver();const ownerDocument=this.ownerDocument,MutationObserverCtor=ownerDocument.defaultView?.MutationObserver;if(!MutationObserverCtor||!this.isConnected||this.projectedSourceSnapshots.size===0)return;const generation=this.projectedSourceObserverGeneration,observer=new MutationObserverCtor(records=>{this.projectedSourceObserver!==observer||this.projectedSourceObserverDocument!==ownerDocument||this.projectedSourceObserverGeneration!==generation||!this.isConnected||this.ownerDocument!==ownerDocument||records.some(record=>this.projectedSourceSnapshots.has(record.target))&&this.syncTabs()});this.projectedSourceObserver=observer,this.projectedSourceObserverDocument=ownerDocument;for(const source of this.projectedSourceSnapshots.keys())observer.observe(source,{attributes:!0,attributeFilter:["inert"]})}projectedSources(tabs){const sources=new Set;for(const tab of tabs)for(const child of Array.from(tab.element.children))(child.getAttribute("slot")??"")===""&&sources.add(child);return sources}syncProjectedSources(tabs){const sources=this.projectedSources(tabs);for(const[source,snapshot]of this.projectedSourceSnapshots)this.adoptProjectedSourceInert(source,snapshot),sources.has(source)||(this.restoreProjectedSource(source,snapshot),this.projectedSourceSnapshots.delete(source));for(const source of sources){const snapshot=this.projectedSourceSnapshots.get(source)??this.snapshotProjectedSource(source);this.projectedSourceSnapshots.set(source,snapshot),this.adoptProjectedSourceInert(source,snapshot),this.makeProjectedSourceInert(source,snapshot)}this.observeProjectedSources()}adoptProjectedSourceInertStates(){for(const[source,snapshot]of this.projectedSourceSnapshots)this.adoptProjectedSourceInert(source,snapshot)}snapshotProjectedSlot(source){const slot=source.getAttribute("slot");return{slot,appliedSlot:slot,libraryOwnsSlot:!1}}adoptProjectedSlot(source,snapshot){const current=source.getAttribute("slot");current!==snapshot.appliedSlot&&(snapshot.slot=current,snapshot.libraryOwnsSlot=!1)}projectSlot(source,slot,projectedSlots){const snapshot=this.projectedSlotSnapshots.get(source)??this.snapshotProjectedSlot(source);this.projectedSlotSnapshots.set(source,snapshot),this.adoptProjectedSlot(source,snapshot),source.getAttribute("slot")!==slot&&(source.setAttribute("slot",slot),snapshot.libraryOwnsSlot=!0),snapshot.appliedSlot=source.getAttribute("slot"),projectedSlots.add(source)}restoreProjectedSlot(source,snapshot){this.adoptProjectedSlot(source,snapshot),snapshot.slot===null?source.removeAttribute("slot"):source.setAttribute("slot",snapshot.slot)}syncProjectedSlots(projectedSlots){for(const[source,snapshot]of this.projectedSlotSnapshots)projectedSlots.has(source)||(this.restoreProjectedSlot(source,snapshot),this.projectedSlotSnapshots.delete(source))}restoreProjectedSlots(){for(const[source,snapshot]of this.projectedSlotSnapshots)this.restoreProjectedSlot(source,snapshot);this.projectedSlotSnapshots.clear()}adoptProjectedSlotStates(){for(const[source,snapshot]of this.projectedSlotSnapshots)this.adoptProjectedSlot(source,snapshot)}isNavigable(tab){return!tab.disabled&&!tab.inert}willUpdate(changed){if(super.willUpdate(changed),!changed.has("tabs")&&!changed.has("active"))return;const focused=shadowFocusTarget(this),focusedSlot=focused?.getAttribute("part")==="tab"?focused.getAttribute("data-slot"):null;focusedSlot!==null&&!this.tabs.some(tab=>tab.slotName===focusedSlot&&this.isNavigable(tab))&&(this.rehomeTabFocus=!0,this.focusedTab=this.active);const current=this.tabs.find(t=>t.slotName===this.active);if(current&&this.isNavigable(current))return;this.rehomeTabFocus=this.rehomeTabFocus||focusedSlot!==null;const outgoing=this.active,before=changed.get("tabs")??this.tabs,at=this.hasUpdated&&changed.has("tabs")&&!changed.has("active")?before.findIndex(t=>t.slotName===outgoing):-1,renamed=at<0?void 0:this.tabs.find(t=>t.element===before[at].element&&this.isNavigable(t)),candidates=at<0?this.tabs:[...before.slice(at+1),...before.slice(0,at).reverse()].map(t=>this.tabs.find(live=>live.slotName===t.slotName));this.active=(renamed??candidates.find(t=>t&&this.isNavigable(t)))?.slotName??"",this.focusedTab=this.active,at>=0&&!renamed&&(this.emit("lr-tab-hide",{name:outgoing}),this.active&&this.emit("lr-tab-show",{name:this.active}))}updated(changed){super.updated(changed),(changed.has("active")||changed.has("tabs"))&&this.syncElementActiveState(),this.scrollOverflow.observeExtra(this.renderRoot.querySelectorAll('[part="tab"]')),this.measureTabScrollEdges(),this.rehomeTabFocus&&(this.rehomeTabFocus=!1,this.renderRoot.querySelector('[part="tab"][tabindex="0"]')?.focus())}selectTab(tab){if(!this.isNavigable(tab)||tab.slotName===this.active)return;const previous=this.active;this.active=tab.slotName,this.focusedTab=tab.slotName,previous&&this.emit("lr-tab-hide",{name:previous}),this.emit("lr-tab-show",{name:tab.slotName})}activateTab(tab){this.isNavigable(tab)&&(this.selectTab(tab),this.emit("lr-activate",{value:tab.slotName}))}show(panel){const tab=this.tabs.find(candidate=>candidate.slotName===panel);tab&&this.selectTab(tab)}syncElementActiveState(){for(const child of Array.from(this.children))if(child.localName===tag("tab")){const definition=this.tabs.find(tab=>tab.element===child);child.toggleAttribute("active",definition?.slotName===this.active)}else child.localName===tag("tab-panel")&&child.toggleAttribute("active",child.getAttribute("name")===this.active)}focusOnly(tab){this.focusedTab=tab.slotName,this.focusTab(tab.slotName)}get rovingTab(){if(this.activation!=="manual")return this.active;const candidate=this.tabs.find(t=>t.slotName===this.focusedTab&&this.isNavigable(t));return candidate?candidate.slotName:this.active}keyboardOriginTab(event,navigable){const eventButton=event.composedPath().find(candidate=>candidate.nodeType===1&&candidate.getAttribute?.("part")==="tab"&&candidate.getRootNode()===this.renderRoot),focused=shadowFocusTarget(this),owned=(eventButton??(focused?.getAttribute("part")==="tab"?focused:void 0))?.dataset.slot;return navigable.find(tab=>tab.slotName===owned)??navigable.find(tab=>tab.slotName===this.rovingTab)}focusTab(slotName){const buttons=this.renderRoot.querySelectorAll('[part="tab"]');for(const button of Array.from(buttons))if(button.dataset.slot===slotName){button.focus();return}}get isVertical(){return this.placement==="start"||this.placement==="end"}tabId(slotName){return this.idsFor(slotName).tab}panelId(slotName){return this.idsFor(slotName).panel}idsFor(slotName){const existing=this.idsBySlot.get(slotName);if(existing)return existing;const token=`${this.baseId}-${this.nextOpaqueId++}`,ids={tab:`${token}-tab`,panel:`${token}-panel`};return this.idsBySlot.set(slotName,ids),ids}tabSlotName(slotName){return`${slotName}-tab`}get scrollControlsSuppressed(){return this.withoutScrollControls||this.noScrollControls}measureTabScrollEdges(){const tablist=this.renderRoot.querySelector('[part~="tablist"]');if(!tablist||this.isVertical){this.setTabScrollEdges(!1,!1,tablist);return}const maximum=Math.max(0,tablist.scrollWidth-tablist.clientWidth),position=Math.max(0,Math.min(maximum,this.effectiveDirection==="rtl"?-tablist.scrollLeft:tablist.scrollLeft));this.setTabScrollEdges(position>1,position<maximum-1,tablist)}setTabScrollEdges(start,end,tablist){tablist?.toggleAttribute("data-scroll-start",start),tablist?.toggleAttribute("data-scroll-end",end),!(start===this.scrollStartAvailable&&end===this.scrollEndAvailable)&&(this.scrollStartAvailable=start,this.scrollEndAvailable=end)}scrollTabs(edge){const tablist=this.renderRoot.querySelector('[part~="tablist"]');if(!tablist||!isHtmlElement(tablist)||typeof tablist.scrollBy!="function")return;const step=Math.max(1,tablist.clientWidth*SCROLL_STEP_RATIO),towardEnd=edge==="end"?1:-1,physical=this.effectiveDirection==="rtl"?-towardEnd:towardEnd;tablist.scrollBy({left:step*physical,behavior:prefersReducedMotion(this)?"instant":"smooth"})}renderScrollControl(edge){if(this.isVertical||this.scrollControlsSuppressed)return nothing;const available=edge==="start"?this.scrollStartAvailable:this.scrollEndAvailable;return html`<button
|
|
1
|
+
import{__decorate}from"tslib";import{html,nothing}from"lit";import{property,query,state}from"lit/decorators.js";import{repeat}from"lit/directives/repeat.js";import{LyraElement}from"../../../internal/lyra-element.js";import{resolveListMove}from"../../../internal/list-navigation.js";import{nextId}from"../../../internal/a11y.js";import{composedAccessibilityText}from"../../../internal/accessibility-visibility.js";import{isHtmlElement}from"../../../internal/dom-guards.js";import{chevronIcon}from"../../../internal/icons.js";import{prefersReducedMotion}from"../../../internal/motion.js";import{tag}from"../../../internal/prefix.js";import{observeScrollOverflow}from"../../../internal/scroll-overflow.js";import{scrollOverflowFadeStyles}from"../../../internal/scroll-overflow.styles.js";import{styles}from"./tab-group.styles.js";import{shadowFocusTarget}from"../../../internal/active-element.js";import{LYRA_DEFAULT_scrollNext,LYRA_DEFAULT_scrollPrevious}from"../../../internal/default-strings/layout.generated.js";function isInertChild(child){return isHtmlElement(child)&&child.inert}function isTabLabelSubtreeExcludedWithoutInert(element){if(element.hasAttribute("hidden")||element.getAttribute("aria-hidden")?.trim().toLowerCase()==="true")return!0;const rendered=element.ownerDocument.defaultView?.getComputedStyle(element);return rendered?.display==="none"||rendered?.contentVisibility==="hidden"}const SYNTHETIC_PANEL_PREFIX="lr-tab-",SCROLL_STEP_RATIO=.8;class LyraTabGroup extends LyraElement{constructor(){super(...arguments),this.active="",this.accessibleLabel=null,this.placement="top",this.activation="auto",this.withoutScrollControls=!1,this.noScrollControls=!1,this.fixedScrollControls=!1,this.tabs=[],this.focusedTab="",this.baseId=nextId("tab-group"),this.nextOpaqueId=0,this.idsBySlot=new Map,this.mutationObserverGeneration=0,this.projectedSourceSnapshots=new Map,this.projectedSlotSnapshots=new Map,this.projectedSourceObserverGeneration=0,this.rehomeTabFocus=!1,this.scrollStartAvailable=!1,this.scrollEndAvailable=!1,this.scrollOverflow=observeScrollOverflow(this,()=>this.renderRoot.querySelector('[part~="tablist"]'),()=>this.measureTabScrollEdges()),this.syncTabs=()=>{const children=Array.from(this.children);this.adoptProjectedSourceInertStates(),this.adoptProjectedSlotStates();const projectedSlots=new Set,next=this.readElementModel(children,projectedSlots);this.syncProjectedSlots(projectedSlots),this.syncProjectedSources(next);const liveSlots=new Set(next.map(tab=>tab.slotName));for(const slotName of this.idsBySlot.keys())liveSlots.has(slotName)||this.idsBySlot.delete(slotName);this.tabs=next},this.onTabListKeyDown=e=>{if(e.altKey||e.ctrlKey||e.metaKey||e.isComposing)return;const navigable=this.tabs.filter(t=>this.isNavigable(t));if(navigable.length===0)return;const origin=this.keyboardOriginTab(e,navigable),currentIndex=origin?navigable.indexOf(origin):-1;if(e.key==="Delete"){if(!origin?.element.closable)return;e.preventDefault(),origin.element.requestCloseFromOwner();return}if(this.activation==="manual"&&(e.key==="Enter"||e.key===" "||e.key==="Spacebar")){if(!origin)return;e.preventDefault(),this.activateTab(origin);return}const targetIndex=resolveListMove(e,{count:navigable.length,current:currentIndex,orientation:this.isVertical?"vertical":"horizontal",direction:this.effectiveDirection});if(targetIndex===null)return;e.preventDefault();const target=navigable[targetIndex];if(this.activation==="manual"){this.focusOnly(target);return}this.activateTab(target),this.focusTab(target.slotName)},this.onTabListScroll=()=>{this.measureTabScrollEdges()},this.onScrollControlMouseDown=event=>{event.preventDefault()},this.onScrollControlPointerDown=event=>{const control=event.currentTarget;control instanceof HTMLElement&&(control.setAttribute("data-pressed",""),control.setPointerCapture(event.pointerId))},this.onScrollControlPointerEnd=event=>{const control=event.currentTarget;control instanceof HTMLElement&&(control.removeAttribute("data-pressed"),control.hasPointerCapture(event.pointerId)&&control.releasePointerCapture(event.pointerId))}}static{this.defaultStrings={...super.defaultStrings,scrollNext:LYRA_DEFAULT_scrollNext,scrollPrevious:LYRA_DEFAULT_scrollPrevious}}static{this.styles=[LyraElement.styles,scrollOverflowFadeStyles,styles]}connectedCallback(){super.connectedCallback(),this.hasUpdated?this.syncTabs():this.seedFirstRenderState(this.syncTabs),this.resetMutationObserver();const ownerDocument=this.ownerDocument,MutationObserverCtor=ownerDocument.defaultView?.MutationObserver;if(!MutationObserverCtor)return;const generation=this.mutationObserverGeneration,observer=new MutationObserverCtor(records=>{if(this.mutationObserver!==observer||this.mutationObserverDocument!==ownerDocument||this.mutationObserverGeneration!==generation||!this.isConnected||this.ownerDocument!==ownerDocument)return;const isDirectChild=node=>node.parentNode===this,isElementTabContent=node=>{let current=node.nodeType===1?node:node.parentElement;for(;current&¤t!==this;){if(current.localName===tag("tab")&¤t.parentNode===this)return!0;current=current.parentElement}return!1};records.some(record=>record.type==="childList"?record.target===this||isElementTabContent(record.target):record.type==="characterData"?isElementTabContent(record.target):record.attributeName==="inert"&&this.projectedSourceSnapshots.has(record.target)?!1:isDirectChild(record.target)||isElementTabContent(record.target))&&this.syncTabs()});this.mutationObserver=observer,this.mutationObserverDocument=ownerDocument,observer.observe(this,{childList:!0,subtree:!0,attributes:!0,characterData:!0,attributeFilter:["alt","aria-hidden","aria-label","aria-labelledby","class","closable","disabled","hidden","inert","id","label","name","open","panel","slot","style"]})}disconnectedCallback(){this.resetMutationObserver(),this.resetProjectedSourceObserver(),this.restoreProjectedSources(),this.restoreProjectedSlots(),super.disconnectedCallback()}adoptedCallback(){super.adoptedCallback(),this.resetMutationObserver(),this.resetProjectedSourceObserver()}resetMutationObserver(){this.mutationObserverGeneration+=1,this.mutationObserver?.disconnect(),this.mutationObserver=void 0,this.mutationObserverDocument=void 0}readElementModel(children,projectedSlots){const seen=new Set,next=[],panels=children.filter(child=>child.localName===tag("tab-panel")),authoredNames=new Set(children.flatMap(child=>{if(child.localName===tag("tab")){const name=child.getAttribute("panel");return name?[name]:[]}if(child.localName===tag("tab-panel")){const name=child.getAttribute("name");return name?[name]:[]}return[]}));let index=0;for(const child of children){if(child.localName!==tag("tab"))continue;const authoredPanel=child.getAttribute("panel")||void 0;let slotName=authoredPanel??`${SYNTHETIC_PANEL_PREFIX}${index}`;if(!authoredPanel){let collision=0;for(;authoredNames.has(slotName)||seen.has(slotName);)collision+=1,slotName=`${SYNTHETIC_PANEL_PREFIX}${index}-${collision}`}if(index+=1,!authoredPanel&&!this.readElementLabel(child,{allowUnprojected:!0})||seen.has(slotName))continue;seen.add(slotName);const tabSlot=this.tabSlotName(slotName);this.projectSlot(child,tabSlot,projectedSlots);const visibleLabel=this.readElementLabel(child);if(!authoredPanel&&!visibleLabel)continue;const label=visibleLabel||slotName,panel=panels.find(candidate=>candidate.getAttribute("name")===slotName);panel&&this.projectSlot(panel,slotName,projectedSlots),next.push({slotName,label,disabled:child.hasAttribute("disabled"),inert:isInertChild(child),element:child}),!this.active&&child.hasAttribute("active")&&(this.active=slotName)}return next}readElementLabel(tab,options={}){const labelNodes=Array.from(tab.childNodes).filter(node=>node.nodeType!==Node.ELEMENT_NODE||node.getAttribute("slot")===null||node.getAttribute("slot")==="");return composedAccessibilityText(labelNodes,{ancestorBoundary:tab,isSubtreeExcluded:element=>this.isTabLabelSubtreeExcluded(element),requireRendered:!options.allowUnprojected,skipRootAncestorValidation:options.allowUnprojected,ignoreInheritedVisibility:!0}).replace(/\s+/g," ").trim()}libraryOwnsSourceInert(element){return this.projectedSourceSnapshots.get(element)?.libraryOwnsInert===!0}isTabLabelSubtreeExcluded(element){return isTabLabelSubtreeExcludedWithoutInert(element)||element.hasAttribute("inert")&&!this.libraryOwnsSourceInert(element)}snapshotProjectedSource(source){const inert=source.getAttribute("inert");return{inert,appliedInert:inert,libraryOwnsInert:!1}}adoptProjectedSourceInert(source,snapshot){const current=source.getAttribute("inert");current!==snapshot.appliedInert&&(snapshot.inert=current,snapshot.libraryOwnsInert=!1)}makeProjectedSourceInert(source,snapshot){source.hasAttribute("inert")||(source.setAttribute("inert",""),snapshot.libraryOwnsInert=!0),snapshot.appliedInert=source.getAttribute("inert")}restoreProjectedSource(source,snapshot){this.adoptProjectedSourceInert(source,snapshot),snapshot.inert===null?source.removeAttribute("inert"):source.setAttribute("inert",snapshot.inert)}restoreProjectedSources(){for(const[source,snapshot]of this.projectedSourceSnapshots)this.restoreProjectedSource(source,snapshot);this.projectedSourceSnapshots.clear()}resetProjectedSourceObserver(){this.projectedSourceObserverGeneration+=1,this.projectedSourceObserver?.disconnect(),this.projectedSourceObserver=void 0,this.projectedSourceObserverDocument=void 0}observeProjectedSources(){this.resetProjectedSourceObserver();const ownerDocument=this.ownerDocument,MutationObserverCtor=ownerDocument.defaultView?.MutationObserver;if(!MutationObserverCtor||!this.isConnected||this.projectedSourceSnapshots.size===0)return;const generation=this.projectedSourceObserverGeneration,observer=new MutationObserverCtor(records=>{this.projectedSourceObserver!==observer||this.projectedSourceObserverDocument!==ownerDocument||this.projectedSourceObserverGeneration!==generation||!this.isConnected||this.ownerDocument!==ownerDocument||records.some(record=>this.projectedSourceSnapshots.has(record.target))&&this.syncTabs()});this.projectedSourceObserver=observer,this.projectedSourceObserverDocument=ownerDocument;for(const source of this.projectedSourceSnapshots.keys())observer.observe(source,{attributes:!0,attributeFilter:["inert"]})}projectedSources(tabs){const sources=new Set;for(const tab of tabs)for(const child of Array.from(tab.element.children))(child.getAttribute("slot")??"")===""&&sources.add(child);return sources}syncProjectedSources(tabs){const sources=this.projectedSources(tabs);for(const[source,snapshot]of this.projectedSourceSnapshots)this.adoptProjectedSourceInert(source,snapshot),sources.has(source)||(this.restoreProjectedSource(source,snapshot),this.projectedSourceSnapshots.delete(source));for(const source of sources){const snapshot=this.projectedSourceSnapshots.get(source)??this.snapshotProjectedSource(source);this.projectedSourceSnapshots.set(source,snapshot),this.adoptProjectedSourceInert(source,snapshot),this.makeProjectedSourceInert(source,snapshot)}this.observeProjectedSources()}adoptProjectedSourceInertStates(){for(const[source,snapshot]of this.projectedSourceSnapshots)this.adoptProjectedSourceInert(source,snapshot)}snapshotProjectedSlot(source){const slot=source.getAttribute("slot");return{slot,appliedSlot:slot,libraryOwnsSlot:!1}}adoptProjectedSlot(source,snapshot){const current=source.getAttribute("slot");current!==snapshot.appliedSlot&&(snapshot.slot=current,snapshot.libraryOwnsSlot=!1)}projectSlot(source,slot,projectedSlots){const snapshot=this.projectedSlotSnapshots.get(source)??this.snapshotProjectedSlot(source);this.projectedSlotSnapshots.set(source,snapshot),this.adoptProjectedSlot(source,snapshot),source.getAttribute("slot")!==slot&&(source.setAttribute("slot",slot),snapshot.libraryOwnsSlot=!0),snapshot.appliedSlot=source.getAttribute("slot"),projectedSlots.add(source)}restoreProjectedSlot(source,snapshot){this.adoptProjectedSlot(source,snapshot),snapshot.slot===null?source.removeAttribute("slot"):source.setAttribute("slot",snapshot.slot)}syncProjectedSlots(projectedSlots){for(const[source,snapshot]of this.projectedSlotSnapshots)projectedSlots.has(source)||(this.restoreProjectedSlot(source,snapshot),this.projectedSlotSnapshots.delete(source))}restoreProjectedSlots(){for(const[source,snapshot]of this.projectedSlotSnapshots)this.restoreProjectedSlot(source,snapshot);this.projectedSlotSnapshots.clear()}adoptProjectedSlotStates(){for(const[source,snapshot]of this.projectedSlotSnapshots)this.adoptProjectedSlot(source,snapshot)}isNavigable(tab){return!tab.disabled&&!tab.inert}willUpdate(changed){if(super.willUpdate(changed),!changed.has("tabs")&&!changed.has("active"))return;const focused=shadowFocusTarget(this),focusedSlot=focused?.getAttribute("part")==="tab"?focused.getAttribute("data-slot"):null;focusedSlot!==null&&!this.tabs.some(tab=>tab.slotName===focusedSlot&&this.isNavigable(tab))&&(this.rehomeTabFocus=!0,this.focusedTab=this.active);const current=this.tabs.find(t=>t.slotName===this.active);if(current&&this.isNavigable(current))return;this.rehomeTabFocus=this.rehomeTabFocus||focusedSlot!==null;const outgoing=this.active,before=changed.get("tabs")??this.tabs,at=this.hasUpdated&&changed.has("tabs")&&!changed.has("active")?before.findIndex(t=>t.slotName===outgoing):-1,renamed=at<0?void 0:this.tabs.find(t=>t.element===before[at].element&&this.isNavigable(t)),candidates=at<0?this.tabs:[...before.slice(at+1),...before.slice(0,at).reverse()].map(t=>this.tabs.find(live=>live.slotName===t.slotName));this.active=(renamed??candidates.find(t=>t&&this.isNavigable(t)))?.slotName??"",this.focusedTab=this.active,at>=0&&!renamed&&(this.emit("lr-tab-hide",{name:outgoing}),this.active&&this.emit("lr-tab-show",{name:this.active}))}updated(changed){super.updated(changed),(changed.has("active")||changed.has("tabs"))&&this.syncElementActiveState(),this.scrollOverflow.observeExtra(this.renderRoot.querySelectorAll('[part="tab"]')),this.measureTabScrollEdges(),this.rehomeTabFocus&&(this.rehomeTabFocus=!1,this.renderRoot.querySelector('[part="tab"][tabindex="0"]')?.focus())}selectTab(tab){if(!this.isNavigable(tab)||tab.slotName===this.active)return;const previous=this.active;this.active=tab.slotName,this.focusedTab=tab.slotName,previous&&this.emit("lr-tab-hide",{name:previous}),this.emit("lr-tab-show",{name:tab.slotName})}activateTab(tab){this.isNavigable(tab)&&(this.selectTab(tab),this.emit("lr-activate",{value:tab.slotName}))}show(panel){const tab=this.tabs.find(candidate=>candidate.slotName===panel);tab&&this.selectTab(tab)}syncElementActiveState(){for(const child of Array.from(this.children))if(child.localName===tag("tab")){const definition=this.tabs.find(tab=>tab.element===child);child.toggleAttribute("active",definition?.slotName===this.active)}else child.localName===tag("tab-panel")&&child.toggleAttribute("active",child.getAttribute("name")===this.active)}focusOnly(tab){this.focusedTab=tab.slotName,this.focusTab(tab.slotName)}get rovingTab(){if(this.activation!=="manual")return this.active;const candidate=this.tabs.find(t=>t.slotName===this.focusedTab&&this.isNavigable(t));return candidate?candidate.slotName:this.active}keyboardOriginTab(event,navigable){const eventButton=event.composedPath().find(candidate=>candidate.nodeType===1&&candidate.getAttribute?.("part")==="tab"&&candidate.getRootNode()===this.renderRoot),focused=shadowFocusTarget(this),owned=(eventButton??(focused?.getAttribute("part")==="tab"?focused:void 0))?.dataset.slot;return navigable.find(tab=>tab.slotName===owned)??navigable.find(tab=>tab.slotName===this.rovingTab)}focusTab(slotName){const buttons=this.renderRoot.querySelectorAll('[part="tab"]');for(const button of Array.from(buttons))if(button.dataset.slot===slotName){button.focus();return}}get isVertical(){return this.placement==="start"||this.placement==="end"}tabId(slotName){return this.idsFor(slotName).tab}panelId(slotName){return this.idsFor(slotName).panel}idsFor(slotName){const existing=this.idsBySlot.get(slotName);if(existing)return existing;const token=`${this.baseId}-${this.nextOpaqueId++}`,ids={tab:`${token}-tab`,panel:`${token}-panel`};return this.idsBySlot.set(slotName,ids),ids}tabSlotName(slotName){return`${slotName}-tab`}get scrollControlsSuppressed(){return this.withoutScrollControls||this.noScrollControls}measureTabScrollEdges(){const tablist=this.renderRoot.querySelector('[part~="tablist"]');if(!tablist||this.isVertical){this.setTabScrollEdges(!1,!1,tablist);return}const maximum=Math.max(0,tablist.scrollWidth-tablist.clientWidth),position=Math.max(0,Math.min(maximum,this.effectiveDirection==="rtl"?-tablist.scrollLeft:tablist.scrollLeft));this.setTabScrollEdges(position>1,position<maximum-1,tablist)}setTabScrollEdges(start,end,tablist){tablist?.toggleAttribute("data-scroll-start",start),tablist?.toggleAttribute("data-scroll-end",end),!(start===this.scrollStartAvailable&&end===this.scrollEndAvailable)&&(this.scrollStartAvailable=start,this.scrollEndAvailable=end)}scrollTabs(edge){const tablist=this.renderRoot.querySelector('[part~="tablist"]');if(!tablist||!isHtmlElement(tablist)||typeof tablist.scrollBy!="function")return;const step=Math.max(1,tablist.clientWidth*SCROLL_STEP_RATIO),towardEnd=edge==="end"?1:-1,physical=this.effectiveDirection==="rtl"?-towardEnd:towardEnd;tablist.scrollBy({left:step*physical,behavior:prefersReducedMotion(this)?"instant":"smooth"})}renderScrollControl(edge){if(this.isVertical||this.scrollControlsSuppressed)return nothing;const available=edge==="start"?this.scrollStartAvailable:this.scrollEndAvailable;return html`<button
|
|
2
2
|
type="button"
|
|
3
3
|
part=${edge==="start"?"scroll-button scroll-button__base scroll-button-start scroll-button--start":"scroll-button scroll-button__base scroll-button-end scroll-button--end"}
|
|
4
4
|
tabindex="-1"
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import{__decorate}from"tslib";import{html,nothing}from"lit";import{property}from"lit/decorators.js";import{closeIcon}from"../../../internal/icons.js";import{LyraElement}from"../../../internal/lyra-element.js";import{styles}from"./tab.styles.js";import{LYRA_DEFAULT_close}from"../../../internal/default-strings.generated.js";class LyraTab extends LyraElement{constructor(){super(...arguments),this.panel="",this.disabled=!1,this.active=!1,this.closable=!1,this.onClosePointerDown=event=>{event.preventDefault(),event.stopPropagation()},this.onCloseClick=event=>{event.stopPropagation(),this.requestCloseFromOwner()}}static{this.defaultStrings={...super.defaultStrings,close:LYRA_DEFAULT_close}}static{this.styles=[LyraElement.styles,styles]}connectedCallback(){super.connectedCallback(),this.hasAttribute("slot")||(this.slot="nav")}requestCloseFromOwner(){!this.closable||this.disabled||this.emit("lr-close",null)}render(){return html`
|
|
1
|
+
import{__decorate}from"tslib";import{html,nothing}from"lit";import{property}from"lit/decorators.js";import{closeIcon}from"../../../internal/icons.js";import{LyraElement}from"../../../internal/lyra-element.js";import{styles}from"./tab.styles.js";import{LYRA_DEFAULT_close}from"../../../internal/default-strings/shared.generated.js";class LyraTab extends LyraElement{constructor(){super(...arguments),this.panel="",this.disabled=!1,this.active=!1,this.closable=!1,this.onClosePointerDown=event=>{event.preventDefault(),event.stopPropagation()},this.onCloseClick=event=>{event.stopPropagation(),this.requestCloseFromOwner()}}static{this.defaultStrings={...super.defaultStrings,close:LYRA_DEFAULT_close}}static{this.styles=[LyraElement.styles,styles]}connectedCallback(){super.connectedCallback(),this.hasAttribute("slot")||(this.slot="nav")}requestCloseFromOwner(){!this.closable||this.disabled||this.emit("lr-close",null)}render(){return html`
|
|
2
2
|
<slot part="base tab"></slot>
|
|
3
3
|
${this.closable?html`
|
|
4
4
|
<span
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import{css}from"lit";const styles=css
|
|
1
|
+
import{css}from"lit";import{raiseWhileOverlayOpen}from"../../../internal/open-overlay-raise.styles.js";const styles=css` :host { display: block; min-inline-size: 0; --_lr-virtual-list-height: var(--lr-size-24rem); } [part="base"] { position: relative; min-inline-size: 0; block-size: var(--lr-virtual-list-height, var(--_lr-virtual-list-height)); overflow-x: auto; overflow-y: auto; overscroll-behavior: contain; scrollbar-width: var(--lr-theme-scrollbar-width, auto); scrollbar-gutter: var(--lr-theme-scrollbar-gutter, auto); } [part="base"][data-external-scroll] { block-size: auto; overflow: visible; } [part="base"]:focus-visible { outline: var(--lr-focus-ring-width) solid var(--lr-focus-ring-color); outline-offset: calc(-1 * var(--lr-focus-ring-offset)); } [part="base"]:hover { outline-width: var( --lr-virtual-list-hover-outline-width, var(--lr-border-width-thin) ); outline-style: var(--lr-virtual-list-hover-outline-style, solid); outline-color: var( --lr-virtual-list-hover-outline-color, var(--lr-color-border-strong) ); outline-offset: var( --lr-virtual-list-hover-outline-offset, calc(-1 * var(--lr-border-width-thin)) ); } [part="base"][data-external-scroll]:hover { outline-style: none; } [part="spacer"] { position: relative; min-inline-size: 0; inline-size: 100%; } [part="row"] { position: absolute; inset-inline-start: 0; inset-block-start: 0; min-inline-size: 0; inline-size: 100%; box-sizing: border-box; overflow-wrap: anywhere; will-change: transform; --_lr-positioning-strategy-default: fixed; } ${raiseWhileOverlayOpen('[part="row"]',"var(--lr-layer-content)")} [part="base"][data-lr-no-top-layer] [part="row"]:has(lr-dropdown[open]) { transform: none !important; will-change: auto; inset-block-start: var(--_lr-virtual-list-row-offset); z-index: var(--lr-overlay-stack-index, var(--lr-layer-popover)); } [part="row"] [data-lr-virtual-list-mark] mark { background: var( --lr-virtual-list-row-mark-bg, revert ); color: var( --lr-virtual-list-row-mark-color, revert ); border-radius: var( --lr-virtual-list-row-mark-radius, 0 ); padding: var(--lr-virtual-list-row-mark-padding, 0); } [part="row"] [data-lr-virtual-list-link] a:where(:any-link) { color: var(--lr-virtual-list-row-link-color, revert); } [part="group"] { position: absolute; inset-inline: 0; inset-block-start: 0; z-index: var(--lr-layer-content); padding: var(--lr-space-xs) var(--lr-space-s); background: var(--lr-color-surface); color: var(--lr-color-text-quiet); font-size: var(--lr-size-0-875em); font-weight: var(--lr-font-weight-semibold); pointer-events: none; } [part="sticky-group"] { position: sticky; inset-block-start: 0; z-index: var(--lr-layer-content); pointer-events: none; } [part="sticky-group"][data-inactive] { visibility: hidden; } :host([loading]) [part="base"] { cursor: progress; } `;export{styles};
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import{__decorate}from"tslib";import{NativeModalCarrier}from"../../../internal/native-modal-carrier.js";import{nativeModalCarrierStyles}from"../../../internal/native-modal-carrier.styles.js";import{AccessibleTextController}from"../../../internal/accessible-text-controller.js";import{html,nothing}from"lit";import{property,state}from"lit/decorators.js";import{repeat}from"lit/directives/repeat.js";import{styleMap}from"lit/directives/style-map.js";import{LyraElement}from"../../../internal/lyra-element.js";import{requestThenCommit}from"../../../internal/request-commit.js";import{markVetoGuardWrite,VetoWriteGuard}from"../../../internal/veto-write-guard.js";import{renderInertPresentation}from"../../../internal/inert-presentation.js";import{cancelDeferredFocusReturn,captureFocusReturnOpener}from"../../../internal/deferred-focus-return.js";import{activateOverlay,collectFocusableElements,deepActiveElement}from"../../../internal/overlay-manager.js";import{readPersistedState,writePersistedState}from"../../../internal/persisted-state.js";import{definePersistedProperty,isPersistedPropertyExplicitlySet}from"../../../internal/persisted-restore.js";import{nextId}from"../../../internal/a11y.js";import{composedAccessibilityText}from"../../../internal/accessibility-visibility.js";import{observeScrollOverflow}from"../../../internal/scroll-overflow.js";import{scrollOverflowFadeStyles}from"../../../internal/scroll-overflow.styles.js";import{chevronIcon,closeIcon,expandIcon}from"../../../internal/icons.js";import{styles}from"./widget.styles.js";import{sanitizeCssInset}from"../../../internal/safe-css.js";import{SlotPresenceController}from"../../../internal/slot-presence-controller.js";import{LYRA_DEFAULT_widgetCollapse,LYRA_DEFAULT_widgetExitFullscreen,LYRA_DEFAULT_widgetExpand,LYRA_DEFAULT_widgetExpandToFullscreen,LYRA_DEFAULT_widgetFullscreenPanel,LYRA_DEFAULT_widgetViewGroup}from"../../../internal/default-strings.generated.js";const MAX_WIDGET_VIEWS=256;function snapshotWidgetViews(value){if(!Array.isArray(value))return Object.freeze([]);const seen=new Set,normalized=[];for(const candidate of value.slice(0,MAX_WIDGET_VIEWS))try{if(!candidate||typeof candidate!="object")continue;const record=candidate,viewId=record.viewId;if(typeof viewId!="string"||viewId.length===0||viewId!==viewId.trim()||seen.has(viewId))continue;const label=record.label,ariaLabel=record.ariaLabel,icon=record.icon;if(label!==void 0&&typeof label!="string"||ariaLabel!==void 0&&typeof ariaLabel!="string")continue;seen.add(viewId),normalized.push(Object.freeze({viewId,...label!==void 0?{label}:{},...icon!==void 0?{icon}:{},...ariaLabel!==void 0?{ariaLabel}:{}}))}catch{}return Object.freeze(normalized)}const collapseWriteGuards=new WeakMap;function collapseWriteGuardFor(widget){let guard=collapseWriteGuards.get(widget);return guard||(guard=new VetoWriteGuard,collapseWriteGuards.set(widget,guard)),guard}function installSynchronousCollapsedReflection(prototype){const installed=Object.getOwnPropertyDescriptor(prototype,"collapsed"),installedSet=installed.set;Object.defineProperty(prototype,"collapsed",{...installed,set(next){installedSet.call(this,next),markVetoGuardWrite(collapseWriteGuardFor(this)),this.toggleAttribute("collapsed",this.collapsed)}})}class LyraWidget extends LyraElement{constructor(){super(...arguments),this.actionsScrollOverflow=observeScrollOverflow(this,()=>this.renderRoot.querySelector('[part="actions"]')),this.viewTogglesScrollOverflow=observeScrollOverflow(this,()=>this.renderRoot.querySelector('[part="view-toggles"]')),this.label="",this.accessibleLabel=null,this.sublabel="",this.collapsible=!1,this.expandable=!1,this.fullscreen=!1,this.fullscreenInset="",this.backdropInset="",this.size="m",this.effectiveViews=Object.freeze([]),this.activeViewId="",this.slotPresence=new SlotPresenceController(this),this.nativeModal=new NativeModalCarrier(this,{onCancel:()=>{this.overlayHandle?.isTopmost()&&this.dismissFullscreen()},onUnexpectedClose:()=>{this.overlayHandle?.isTopmost()&&this.dismissFullscreen(),this.fullscreen&&this.nativeModal.show()}}),this.labelTextObserver=new AccessibleTextController(this,[],()=>{const assigned=this.shadowRoot?.querySelector('slot[name="label"]')?.assignedElements({flatten:!0})??[];this.syncLabelSlot(assigned)},["alt","aria-labelledby","slot"],!1),this.ownerRealmGeneration=0,this.bodyId=nextId("widget-body"),this.persistReady=!1,this.onLabelSlotChange=e=>{const assigned=e.target.assignedElements({flatten:!0});this.syncLabelSlot(assigned)},this.setActiveView=viewId=>{if(viewId!==this.activeViewId){if(this.emit("lr-view-request",{viewId},{cancelable:!0}).defaultPrevented)return;this.activeViewId=viewId,this.emit("lr-view-change",{viewId})}this.emit("lr-activate",{value:viewId})},this.dispatchingCollapse=!1,this.toggleCollapsed=()=>{this.requestCollapse(!this.collapsed)},this.toggleFullscreen=e=>{const next=!this.fullscreen,trigger=e.currentTarget;this.requestFullscreenChange(next)&&next&&(this.explicitTrigger=trigger)},this.dismissFullscreen=()=>{this.fullscreen&&this.requestFullscreenChange(!1)},this.onBackdropClick=()=>{this.overlayHandle?.dismissBackdrop()}}static{this.defaultStrings={...super.defaultStrings,widgetCollapse:LYRA_DEFAULT_widgetCollapse,widgetExitFullscreen:LYRA_DEFAULT_widgetExitFullscreen,widgetExpand:LYRA_DEFAULT_widgetExpand,widgetExpandToFullscreen:LYRA_DEFAULT_widgetExpandToFullscreen,widgetFullscreenPanel:LYRA_DEFAULT_widgetFullscreenPanel,widgetViewGroup:LYRA_DEFAULT_widgetViewGroup}}static{this.styles=[LyraElement.styles,nativeModalCarrierStyles,scrollOverflowFadeStyles,styles]}static{this.properties={collapsed:{type:Boolean,reflect:!0,noAccessor:!0}}}static{definePersistedProperty(this.prototype,"collapsed",{initial:!1,attribute:!0,type:Boolean,reflect:!0,coerce:next=>!!next}),installSynchronousCollapsedReflection(this.prototype)}get views(){return this.effectiveViews}set views(value){if(value===this.viewsSource||value===this.effectiveViews)return;this.viewsSource=value;const previous=this.effectiveViews;this.effectiveViews=snapshotWidgetViews(value),this.requestUpdate("views",previous)}get storageFullKey(){return this.storageKey?`lr-widget:${this.storageKey}`:void 0}willUpdate(changed){if(super.willUpdate(changed),!this.hasUpdated){const labelChildren=Array.from(this.children).filter(el=>el.getAttribute("slot")==="label");this.labelSlotText=this.readLabelSlotText(labelChildren);const parsed=readPersistedState(this.storageFullKey,v=>typeof v=="object"&&v!==null);parsed&&typeof parsed.collapsed=="boolean"&&!isPersistedPropertyExplicitlySet(this,"collapsed")&&(this.collapsed=parsed.collapsed)}if(changed.has("fullscreen")&&(this.fullscreen?this.activateFullscreenOverlay():this.deactivateFullscreenOverlay()),changed.has("views")||changed.has("activeViewId")){const focused=this.renderRoot?.querySelector('[part="view-toggle"]:focus');this.focusedViewIdBeforeUpdate=focused?.dataset.viewId;const views=this.views;if(!views.some(view=>view.viewId===this.activeViewId)){const forcedBySibling=this.hasUpdated&&changed.has("views")&&!changed.has("activeViewId");this.activeViewId=views[0]?.viewId??"",forcedBySibling&&this.emit("lr-view-change",{viewId:this.activeViewId})}}}updated(changed){super.updated(changed),this.fullscreen&&this.nativeModal.show();const actionsSlot=this.renderRoot.querySelector('slot[name="actions"]');if(this.actionsScrollOverflow.observeExtra(actionsSlot?actionsSlot.assignedElements({flatten:!0}):[]),this.viewTogglesScrollOverflow.observeExtra(this.renderRoot.querySelectorAll('[part="view-toggle"]')),this.persistReady&&changed.has("collapsed")&&writePersistedState(this.storageFullKey,{collapsed:this.collapsed}),this.persistReady=!0,changed.has("fullscreen")&&this.fullscreen)this.overlayHandle?.focusInitial();else if(changed.has("collapsed")&&this.fullscreen){const panel=this.shadowRoot?.querySelector('[part="base"]'),active=deepActiveElement(this.ownerDocument);panel&&!collectFocusableElements(panel).includes(active)&&(active&&typeof active.blur=="function"&&active.blur(),this.overlayHandle?.focusInitial())}if(changed.has("views")||changed.has("activeViewId")){const focusedId=this.focusedViewIdBeforeUpdate;this.focusedViewIdBeforeUpdate=void 0,focusedId&&!this.views.some(view=>view.viewId===focusedId)&&Array.from(this.renderRoot.querySelectorAll('[part="view-toggle"]')).find(toggle=>toggle.dataset.viewId===this.activeViewId)?.focus()}}connectedCallback(){super.connectedCallback(),this.hasUpdated&&this.fullscreen&&(this.overlayHandle?.isActive()?this.overlayHandle.resume():this.activateFullscreenOverlay(),this.queueOwnerMicrotask(()=>{this.nativeModal.show(),this.overlayHandle?.focusInitial()})),this.hasUpdated&&this.queueOwnerMicrotask(()=>{const slot=this.shadowRoot?.querySelector('slot[name="label"]');slot&&this.syncLabelSlot(slot.assignedElements({flatten:!0}))})}disconnectedCallback(){this.nativeModal.hide(),super.disconnectedCallback(),this.overlayHandle?.suspend(),cancelDeferredFocusReturn(this),this.resetOwnerRealmWork()}adoptedCallback(){super.adoptedCallback(),this.resetOwnerRealmWork();const slot=this.shadowRoot?.querySelector('slot[name="label"]');this.isConnected&&slot&&this.syncLabelSlot(slot.assignedElements({flatten:!0})),this.labelTextObserver.adopted()}resetOwnerRealmWork(){this.ownerRealmGeneration+=1,this.labelTextObserver.setEnabled(!1)}queueOwnerMicrotask(callback){const ownerDocument=this.ownerDocument,ownerWindow=ownerDocument.defaultView;if(!ownerWindow||!this.isConnected)return;const generation=this.ownerRealmGeneration;ownerWindow.queueMicrotask(()=>{this.ownerRealmGeneration!==generation||!this.isConnected||this.ownerDocument!==ownerDocument||callback()})}activateFullscreenOverlay(){this.nativeModal.prepare(),this.fullscreenOpener=this.explicitTrigger??captureFocusReturnOpener(this),this.overlayHandle=activateOverlay({host:this,panel:()=>this.shadowRoot?.querySelector('[part="base"]')??null,onEscape:this.dismissFullscreen,onBackdrop:this.dismissFullscreen,restoreFocusTo:this.explicitTrigger,lockScroll:!0,suspendWhenUnrendered:!0,deferredReturn:()=>{const opener=this.fullscreenOpener;return opener?{candidates:()=>[opener],isCurrent:()=>!this.fullscreen}:void 0}}),this.explicitTrigger=void 0}deactivateFullscreenOverlay(){this.nativeModal.hide(),this.nativeModal.prepare(!1),this.overlayHandle?.deactivate(),this.overlayHandle=void 0,this.fullscreenOpener=void 0}syncLabelSlot(assigned){this.labelSlotText=this.readLabelSlotText(assigned),this.labelTextObserver.setEnabled(assigned.length>0),this.labelTextObserver.bind()}readLabelSlotText(assigned){return composedAccessibilityText(assigned).replace(/\s+/g," ").trim()||void 0}requestCollapse(next){if(this.dispatchingCollapse)return;const previous=this.collapsed;this.dispatchingCollapse=!0;try{requestThenCommit({requestDetail:{expanded:!next},emitRequest:(proposal,init)=>{const request=this.emit("lr-toggle-request",proposal,init);return this.emit("lr-collapse-request",{collapsed:next},init).defaultPrevented&&request.preventDefault(),request},guard:collapseWriteGuardFor(this),commit:()=>{this.collapsed===previous&&(this.collapsed=next,this.emit("lr-collapse-change",{collapsed:next}),this.emit("lr-toggle",{expanded:!next}))}})}finally{this.dispatchingCollapse=!1}}requestFullscreenChange(next){return this.emit("lr-fullscreen-request",{fullscreen:next},{cancelable:!0}).defaultPrevented?!1:(this.fullscreen=next,this.emit("lr-fullscreen-change",{fullscreen:next}),!0)}render(){const hasLabel=(this.label??"").length>0,hasSublabel=(this.sublabel??"").length>0,views=this.views,fullscreenInset=sanitizeCssInset(this.fullscreenInset),backdropInset=sanitizeCssInset(this.backdropInset);return this.nativeModal.render(html`
|
|
1
|
+
import{__decorate}from"tslib";import{NativeModalCarrier}from"../../../internal/native-modal-carrier.js";import{nativeModalCarrierStyles}from"../../../internal/native-modal-carrier.styles.js";import{AccessibleTextController}from"../../../internal/accessible-text-controller.js";import{html,nothing}from"lit";import{property,state}from"lit/decorators.js";import{repeat}from"lit/directives/repeat.js";import{styleMap}from"lit/directives/style-map.js";import{LyraElement}from"../../../internal/lyra-element.js";import{requestThenCommit}from"../../../internal/request-commit.js";import{markVetoGuardWrite,VetoWriteGuard}from"../../../internal/veto-write-guard.js";import{renderInertPresentation}from"../../../internal/inert-presentation.js";import{cancelDeferredFocusReturn,captureFocusReturnOpener}from"../../../internal/deferred-focus-return.js";import{activateOverlay,collectFocusableElements,deepActiveElement}from"../../../internal/overlay-manager.js";import{readPersistedState,writePersistedState}from"../../../internal/persisted-state.js";import{definePersistedProperty,isPersistedPropertyExplicitlySet}from"../../../internal/persisted-restore.js";import{nextId}from"../../../internal/a11y.js";import{composedAccessibilityText}from"../../../internal/accessibility-visibility.js";import{observeScrollOverflow}from"../../../internal/scroll-overflow.js";import{scrollOverflowFadeStyles}from"../../../internal/scroll-overflow.styles.js";import{chevronIcon,closeIcon,expandIcon}from"../../../internal/icons.js";import{styles}from"./widget.styles.js";import{sanitizeCssInset}from"../../../internal/safe-css.js";import{SlotPresenceController}from"../../../internal/slot-presence-controller.js";import{LYRA_DEFAULT_widgetCollapse,LYRA_DEFAULT_widgetExitFullscreen,LYRA_DEFAULT_widgetExpand,LYRA_DEFAULT_widgetExpandToFullscreen,LYRA_DEFAULT_widgetFullscreenPanel,LYRA_DEFAULT_widgetViewGroup}from"../../../internal/default-strings/layout.generated.js";const MAX_WIDGET_VIEWS=256;function snapshotWidgetViews(value){if(!Array.isArray(value))return Object.freeze([]);const seen=new Set,normalized=[];for(const candidate of value.slice(0,MAX_WIDGET_VIEWS))try{if(!candidate||typeof candidate!="object")continue;const record=candidate,viewId=record.viewId;if(typeof viewId!="string"||viewId.length===0||viewId!==viewId.trim()||seen.has(viewId))continue;const label=record.label,ariaLabel=record.ariaLabel,icon=record.icon;if(label!==void 0&&typeof label!="string"||ariaLabel!==void 0&&typeof ariaLabel!="string")continue;seen.add(viewId),normalized.push(Object.freeze({viewId,...label!==void 0?{label}:{},...icon!==void 0?{icon}:{},...ariaLabel!==void 0?{ariaLabel}:{}}))}catch{}return Object.freeze(normalized)}const collapseWriteGuards=new WeakMap;function collapseWriteGuardFor(widget){let guard=collapseWriteGuards.get(widget);return guard||(guard=new VetoWriteGuard,collapseWriteGuards.set(widget,guard)),guard}function installSynchronousCollapsedReflection(prototype){const installed=Object.getOwnPropertyDescriptor(prototype,"collapsed"),installedSet=installed.set;Object.defineProperty(prototype,"collapsed",{...installed,set(next){installedSet.call(this,next),markVetoGuardWrite(collapseWriteGuardFor(this)),this.toggleAttribute("collapsed",this.collapsed)}})}class LyraWidget extends LyraElement{constructor(){super(...arguments),this.actionsScrollOverflow=observeScrollOverflow(this,()=>this.renderRoot.querySelector('[part="actions"]')),this.viewTogglesScrollOverflow=observeScrollOverflow(this,()=>this.renderRoot.querySelector('[part="view-toggles"]')),this.label="",this.accessibleLabel=null,this.sublabel="",this.collapsible=!1,this.expandable=!1,this.fullscreen=!1,this.fullscreenInset="",this.backdropInset="",this.size="m",this.effectiveViews=Object.freeze([]),this.activeViewId="",this.slotPresence=new SlotPresenceController(this),this.nativeModal=new NativeModalCarrier(this,{onCancel:()=>{this.overlayHandle?.isTopmost()&&this.dismissFullscreen()},onUnexpectedClose:()=>{this.overlayHandle?.isTopmost()&&this.dismissFullscreen(),this.fullscreen&&this.nativeModal.show()}}),this.labelTextObserver=new AccessibleTextController(this,[],()=>{const assigned=this.shadowRoot?.querySelector('slot[name="label"]')?.assignedElements({flatten:!0})??[];this.syncLabelSlot(assigned)},["alt","aria-labelledby","slot"],!1),this.ownerRealmGeneration=0,this.bodyId=nextId("widget-body"),this.persistReady=!1,this.onLabelSlotChange=e=>{const assigned=e.target.assignedElements({flatten:!0});this.syncLabelSlot(assigned)},this.setActiveView=viewId=>{if(viewId!==this.activeViewId){if(this.emit("lr-view-request",{viewId},{cancelable:!0}).defaultPrevented)return;this.activeViewId=viewId,this.emit("lr-view-change",{viewId})}this.emit("lr-activate",{value:viewId})},this.dispatchingCollapse=!1,this.toggleCollapsed=()=>{this.requestCollapse(!this.collapsed)},this.toggleFullscreen=e=>{const next=!this.fullscreen,trigger=e.currentTarget;this.requestFullscreenChange(next)&&next&&(this.explicitTrigger=trigger)},this.dismissFullscreen=()=>{this.fullscreen&&this.requestFullscreenChange(!1)},this.onBackdropClick=()=>{this.overlayHandle?.dismissBackdrop()}}static{this.defaultStrings={...super.defaultStrings,widgetCollapse:LYRA_DEFAULT_widgetCollapse,widgetExitFullscreen:LYRA_DEFAULT_widgetExitFullscreen,widgetExpand:LYRA_DEFAULT_widgetExpand,widgetExpandToFullscreen:LYRA_DEFAULT_widgetExpandToFullscreen,widgetFullscreenPanel:LYRA_DEFAULT_widgetFullscreenPanel,widgetViewGroup:LYRA_DEFAULT_widgetViewGroup}}static{this.styles=[LyraElement.styles,nativeModalCarrierStyles,scrollOverflowFadeStyles,styles]}static{this.properties={collapsed:{type:Boolean,reflect:!0,noAccessor:!0}}}static{definePersistedProperty(this.prototype,"collapsed",{initial:!1,attribute:!0,type:Boolean,reflect:!0,coerce:next=>!!next}),installSynchronousCollapsedReflection(this.prototype)}get views(){return this.effectiveViews}set views(value){if(value===this.viewsSource||value===this.effectiveViews)return;this.viewsSource=value;const previous=this.effectiveViews;this.effectiveViews=snapshotWidgetViews(value),this.requestUpdate("views",previous)}get storageFullKey(){return this.storageKey?`lr-widget:${this.storageKey}`:void 0}willUpdate(changed){if(super.willUpdate(changed),!this.hasUpdated){const labelChildren=Array.from(this.children).filter(el=>el.getAttribute("slot")==="label");this.labelSlotText=this.readLabelSlotText(labelChildren);const parsed=readPersistedState(this.storageFullKey,v=>typeof v=="object"&&v!==null);parsed&&typeof parsed.collapsed=="boolean"&&!isPersistedPropertyExplicitlySet(this,"collapsed")&&(this.collapsed=parsed.collapsed)}if(changed.has("fullscreen")&&(this.fullscreen?this.activateFullscreenOverlay():this.deactivateFullscreenOverlay()),changed.has("views")||changed.has("activeViewId")){const focused=this.renderRoot?.querySelector('[part="view-toggle"]:focus');this.focusedViewIdBeforeUpdate=focused?.dataset.viewId;const views=this.views;if(!views.some(view=>view.viewId===this.activeViewId)){const forcedBySibling=this.hasUpdated&&changed.has("views")&&!changed.has("activeViewId");this.activeViewId=views[0]?.viewId??"",forcedBySibling&&this.emit("lr-view-change",{viewId:this.activeViewId})}}}updated(changed){super.updated(changed),this.fullscreen&&this.nativeModal.show();const actionsSlot=this.renderRoot.querySelector('slot[name="actions"]');if(this.actionsScrollOverflow.observeExtra(actionsSlot?actionsSlot.assignedElements({flatten:!0}):[]),this.viewTogglesScrollOverflow.observeExtra(this.renderRoot.querySelectorAll('[part="view-toggle"]')),this.persistReady&&changed.has("collapsed")&&writePersistedState(this.storageFullKey,{collapsed:this.collapsed}),this.persistReady=!0,changed.has("fullscreen")&&this.fullscreen)this.overlayHandle?.focusInitial();else if(changed.has("collapsed")&&this.fullscreen){const panel=this.shadowRoot?.querySelector('[part="base"]'),active=deepActiveElement(this.ownerDocument);panel&&!collectFocusableElements(panel).includes(active)&&(active&&typeof active.blur=="function"&&active.blur(),this.overlayHandle?.focusInitial())}if(changed.has("views")||changed.has("activeViewId")){const focusedId=this.focusedViewIdBeforeUpdate;this.focusedViewIdBeforeUpdate=void 0,focusedId&&!this.views.some(view=>view.viewId===focusedId)&&Array.from(this.renderRoot.querySelectorAll('[part="view-toggle"]')).find(toggle=>toggle.dataset.viewId===this.activeViewId)?.focus()}}connectedCallback(){super.connectedCallback(),this.hasUpdated&&this.fullscreen&&(this.overlayHandle?.isActive()?this.overlayHandle.resume():this.activateFullscreenOverlay(),this.queueOwnerMicrotask(()=>{this.nativeModal.show(),this.overlayHandle?.focusInitial()})),this.hasUpdated&&this.queueOwnerMicrotask(()=>{const slot=this.shadowRoot?.querySelector('slot[name="label"]');slot&&this.syncLabelSlot(slot.assignedElements({flatten:!0}))})}disconnectedCallback(){this.nativeModal.hide(),super.disconnectedCallback(),this.overlayHandle?.suspend(),cancelDeferredFocusReturn(this),this.resetOwnerRealmWork()}adoptedCallback(){super.adoptedCallback(),this.resetOwnerRealmWork();const slot=this.shadowRoot?.querySelector('slot[name="label"]');this.isConnected&&slot&&this.syncLabelSlot(slot.assignedElements({flatten:!0})),this.labelTextObserver.adopted()}resetOwnerRealmWork(){this.ownerRealmGeneration+=1,this.labelTextObserver.setEnabled(!1)}queueOwnerMicrotask(callback){const ownerDocument=this.ownerDocument,ownerWindow=ownerDocument.defaultView;if(!ownerWindow||!this.isConnected)return;const generation=this.ownerRealmGeneration;ownerWindow.queueMicrotask(()=>{this.ownerRealmGeneration!==generation||!this.isConnected||this.ownerDocument!==ownerDocument||callback()})}activateFullscreenOverlay(){this.nativeModal.prepare(),this.fullscreenOpener=this.explicitTrigger??captureFocusReturnOpener(this),this.overlayHandle=activateOverlay({host:this,panel:()=>this.shadowRoot?.querySelector('[part="base"]')??null,onEscape:this.dismissFullscreen,onBackdrop:this.dismissFullscreen,restoreFocusTo:this.explicitTrigger,lockScroll:!0,suspendWhenUnrendered:!0,deferredReturn:()=>{const opener=this.fullscreenOpener;return opener?{candidates:()=>[opener],isCurrent:()=>!this.fullscreen}:void 0}}),this.explicitTrigger=void 0}deactivateFullscreenOverlay(){this.nativeModal.hide(),this.nativeModal.prepare(!1),this.overlayHandle?.deactivate(),this.overlayHandle=void 0,this.fullscreenOpener=void 0}syncLabelSlot(assigned){this.labelSlotText=this.readLabelSlotText(assigned),this.labelTextObserver.setEnabled(assigned.length>0),this.labelTextObserver.bind()}readLabelSlotText(assigned){return composedAccessibilityText(assigned).replace(/\s+/g," ").trim()||void 0}requestCollapse(next){if(this.dispatchingCollapse)return;const previous=this.collapsed;this.dispatchingCollapse=!0;try{requestThenCommit({requestDetail:{expanded:!next},emitRequest:(proposal,init)=>{const request=this.emit("lr-toggle-request",proposal,init);return this.emit("lr-collapse-request",{collapsed:next},init).defaultPrevented&&request.preventDefault(),request},guard:collapseWriteGuardFor(this),commit:()=>{this.collapsed===previous&&(this.collapsed=next,this.emit("lr-collapse-change",{collapsed:next}),this.emit("lr-toggle",{expanded:!next}))}})}finally{this.dispatchingCollapse=!1}}requestFullscreenChange(next){return this.emit("lr-fullscreen-request",{fullscreen:next},{cancelable:!0}).defaultPrevented?!1:(this.fullscreen=next,this.emit("lr-fullscreen-change",{fullscreen:next}),!0)}render(){const hasLabel=(this.label??"").length>0,hasSublabel=(this.sublabel??"").length>0,views=this.views,fullscreenInset=sanitizeCssInset(this.fullscreenInset),backdropInset=sanitizeCssInset(this.backdropInset);return this.nativeModal.render(html`
|
|
2
2
|
${this.fullscreen?html`<div
|
|
3
3
|
part="backdrop"
|
|
4
4
|
style=${backdropInset?styleMap({"--lr-widget-backdrop-inset":backdropInset}):nothing}
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import{__decorate}from"tslib";import{observeReducedMotion}from"../../../internal/motion-observer.js";import{html,nothing}from"lit";import{property,query,state}from"lit/decorators.js";import{LyraElement}from"../../../internal/lyra-element.js";import{playIcon,pauseIcon}from"../../../internal/icons.js";import{safeMediaSrc}from"../../../internal/safe-url.js";import{prefersReducedMotion}from"../../../internal/motion.js";import{relayNativeEvent}from"../../../internal/native-event-relay.js";import{styles}from"./animated-image.styles.js";import{resolveBoundedCanvasAllocation}from"../../../internal/canvas.js";import{hostAriaLabel}from"../../../internal/a11y.js";import{LYRA_DEFAULT_animatedImageDefaultAlt,LYRA_DEFAULT_pauseWithContext,LYRA_DEFAULT_playWithContext}from"../../../internal/default-strings.generated.js";const MAX_FROZEN_FRAME_DIMENSION=8192,MAX_FROZEN_FRAME_PIXELS=16777216;class LyraAnimatedImage extends LyraElement{constructor(){super(...arguments),this.src="",this.play=!1,this.ignoreReducedMotion=!1,this.accessibleLabel="",this.hasLoaded=!1,this.hasError=!1,this._playing=!1,this.userPlay=!1,this.connectionEventBaselinePending=!0,this.onMotionPreferenceChange=()=>{this.requestUpdate()},this.onImageLoad=event=>{if(!this.isConnected||event.currentTarget!==this.imageEl)return;this.hasError=!1,this.hasLoaded=!0;const img=this.imageEl,canvas=this.canvasEl;if(img&&canvas){const width=img.naturalWidth,height=img.naturalHeight,allocation=resolveBoundedCanvasAllocation({cssWidth:width,cssHeight:height,desiredScale:1,maxDimension:MAX_FROZEN_FRAME_DIMENSION,maxPixels:MAX_FROZEN_FRAME_PIXELS});canvas.width=allocation.pixelWidth,canvas.height=allocation.pixelHeight;const ctx=canvas.getContext("2d");ctx&&(ctx.scale(allocation.scaleX,allocation.scaleY),ctx.drawImage(img,0,0,width,height))}this.emit("lr-load",null)},this.onImageError=event=>{!this.isConnected||event.currentTarget!==this.imageEl||(this.hasLoaded=!1,this.hasError=!0,this.emit("lr-error",null))},this.onToggleClick=()=>{this.userPlay=this.play=!this.play},this.onControlFocus=event=>{relayNativeEvent(this,event)},this.onControlBlur=event=>{relayNativeEvent(this,event)}}static{this.defaultStrings={...super.defaultStrings,animatedImageDefaultAlt:LYRA_DEFAULT_animatedImageDefaultAlt,pauseWithContext:LYRA_DEFAULT_pauseWithContext,playWithContext:LYRA_DEFAULT_playWithContext}}static{this.knownUnobservedAttributes=["playing"]}static{this.styles=[LyraElement.styles,styles]}get playing(){return this._playing}connectedCallback(){super.connectedCallback(),this.connectionEventBaselinePending=!0,this.stopMotionWatch=observeReducedMotion(this,this.onMotionPreferenceChange),this.requestUpdate()}disconnectedCallback(){this.connectionEventBaselinePending=!0,this.stopMotionWatch?.(),this.stopMotionWatch=void 0,super.disconnectedCallback()}willUpdate(changed){super.willUpdate(changed);const mayEmitConnectionTransition=this.isConnected&&!this.connectionEventBaselinePending;changed.has("src")&&(this.hasLoaded=!1,this.hasError=!1,this.src.trim()!==""&&safeMediaSrc(this.src)===null&&(this.hasError=!0,mayEmitConnectionTransition&&this.emit("lr-error",null))),this.play||(this.userPlay=!1);const nextPlaying=this.play&&(this.ignoreReducedMotion||this.userPlay||!prefersReducedMotion(this));nextPlaying!==this._playing&&(this._playing=nextPlaying,this.toggleAttribute("playing",nextPlaying),mayEmitConnectionTransition&&this.emit(nextPlaying?"lr-play":"lr-pause",null)),this.toggleAttribute("data-loaded",this.hasLoaded)}updated(changed){super.updated(changed),this.isConnected&&(this.connectionEventBaselinePending=!1)}get effectiveAlt(){return this.alt??""}get toggleLabel(){const authoredLabel=hostAriaLabel(this);if(authoredLabel)return authoredLabel;if(this.accessibleLabel)return this.accessibleLabel;const name=this.effectiveAlt||this.localize("animatedImageDefaultAlt");return this.playing?this.localize("pauseWithContext",void 0,{name}):this.localize("playWithContext",void 0,{name})}focus(options){this.playButtonEl?.focus(options)}blur(){this.playButtonEl?.blur()}click(){this.playButtonEl?.click()}render(){const src=safeMediaSrc(this.src),alt=this.effectiveAlt,frozen=this.hasLoaded&&!this.playing,showControls=this.hasLoaded&&!this.hasError;return html`
|
|
1
|
+
import{__decorate}from"tslib";import{observeReducedMotion}from"../../../internal/motion-observer.js";import{html,nothing}from"lit";import{property,query,state}from"lit/decorators.js";import{LyraElement}from"../../../internal/lyra-element.js";import{playIcon,pauseIcon}from"../../../internal/icons.js";import{safeMediaSrc}from"../../../internal/safe-url.js";import{prefersReducedMotion}from"../../../internal/motion.js";import{relayNativeEvent}from"../../../internal/native-event-relay.js";import{styles}from"./animated-image.styles.js";import{resolveBoundedCanvasAllocation}from"../../../internal/canvas.js";import{hostAriaLabel}from"../../../internal/a11y.js";import{LYRA_DEFAULT_animatedImageDefaultAlt,LYRA_DEFAULT_pauseWithContext,LYRA_DEFAULT_playWithContext}from"../../../internal/default-strings/media.generated.js";const MAX_FROZEN_FRAME_DIMENSION=8192,MAX_FROZEN_FRAME_PIXELS=16777216;class LyraAnimatedImage extends LyraElement{constructor(){super(...arguments),this.src="",this.play=!1,this.ignoreReducedMotion=!1,this.accessibleLabel="",this.hasLoaded=!1,this.hasError=!1,this._playing=!1,this.userPlay=!1,this.connectionEventBaselinePending=!0,this.onMotionPreferenceChange=()=>{this.requestUpdate()},this.onImageLoad=event=>{if(!this.isConnected||event.currentTarget!==this.imageEl)return;this.hasError=!1,this.hasLoaded=!0;const img=this.imageEl,canvas=this.canvasEl;if(img&&canvas){const width=img.naturalWidth,height=img.naturalHeight,allocation=resolveBoundedCanvasAllocation({cssWidth:width,cssHeight:height,desiredScale:1,maxDimension:MAX_FROZEN_FRAME_DIMENSION,maxPixels:MAX_FROZEN_FRAME_PIXELS});canvas.width=allocation.pixelWidth,canvas.height=allocation.pixelHeight;const ctx=canvas.getContext("2d");ctx&&(ctx.scale(allocation.scaleX,allocation.scaleY),ctx.drawImage(img,0,0,width,height))}this.emit("lr-load",null)},this.onImageError=event=>{!this.isConnected||event.currentTarget!==this.imageEl||(this.hasLoaded=!1,this.hasError=!0,this.emit("lr-error",null))},this.onToggleClick=()=>{this.userPlay=this.play=!this.play},this.onControlFocus=event=>{relayNativeEvent(this,event)},this.onControlBlur=event=>{relayNativeEvent(this,event)}}static{this.defaultStrings={...super.defaultStrings,animatedImageDefaultAlt:LYRA_DEFAULT_animatedImageDefaultAlt,pauseWithContext:LYRA_DEFAULT_pauseWithContext,playWithContext:LYRA_DEFAULT_playWithContext}}static{this.knownUnobservedAttributes=["playing"]}static{this.styles=[LyraElement.styles,styles]}get playing(){return this._playing}connectedCallback(){super.connectedCallback(),this.connectionEventBaselinePending=!0,this.stopMotionWatch=observeReducedMotion(this,this.onMotionPreferenceChange),this.requestUpdate()}disconnectedCallback(){this.connectionEventBaselinePending=!0,this.stopMotionWatch?.(),this.stopMotionWatch=void 0,super.disconnectedCallback()}willUpdate(changed){super.willUpdate(changed);const mayEmitConnectionTransition=this.isConnected&&!this.connectionEventBaselinePending;changed.has("src")&&(this.hasLoaded=!1,this.hasError=!1,this.src.trim()!==""&&safeMediaSrc(this.src)===null&&(this.hasError=!0,mayEmitConnectionTransition&&this.emit("lr-error",null))),this.play||(this.userPlay=!1);const nextPlaying=this.play&&(this.ignoreReducedMotion||this.userPlay||!prefersReducedMotion(this));nextPlaying!==this._playing&&(this._playing=nextPlaying,this.toggleAttribute("playing",nextPlaying),mayEmitConnectionTransition&&this.emit(nextPlaying?"lr-play":"lr-pause",null)),this.toggleAttribute("data-loaded",this.hasLoaded)}updated(changed){super.updated(changed),this.isConnected&&(this.connectionEventBaselinePending=!1)}get effectiveAlt(){return this.alt??""}get toggleLabel(){const authoredLabel=hostAriaLabel(this);if(authoredLabel)return authoredLabel;if(this.accessibleLabel)return this.accessibleLabel;const name=this.effectiveAlt||this.localize("animatedImageDefaultAlt");return this.playing?this.localize("pauseWithContext",void 0,{name}):this.localize("playWithContext",void 0,{name})}focus(options){this.playButtonEl?.focus(options)}blur(){this.playButtonEl?.blur()}click(){this.playButtonEl?.click()}render(){const src=safeMediaSrc(this.src),alt=this.effectiveAlt,frozen=this.hasLoaded&&!this.playing,showControls=this.hasLoaded&&!this.hasError;return html`
|
|
2
2
|
<div part="base">
|
|
3
3
|
<img
|
|
4
4
|
part="image"
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import{__decorate}from"tslib";import{html,nothing,svg}from"lit";import{property}from"lit/decorators.js";import{LyraElement}from"../../../internal/lyra-element.js";import{nextId}from"../../../internal/a11y.js";import{AnnouncementSinkController}from"../../../internal/announcer.js";import{closeIcon,expandIcon,fileIcon}from"../../../internal/icons.js";import{finiteRange}from"../../../internal/numbers.js";import{safeMediaSrc}from"../../../internal/safe-url.js";import{styles}from"./attachment-chip.styles.js";import{normalizeReflectedOptionalSize,normalizeSize,optionalSizeConverter}from"../../../internal/variants.js";import{getNumberFormat}from"../../../internal/intl-cache.js";import{FILE_SIZE_UNIT_KEYS,formatFileSize,localizedNumberLabel}from"./file-size.js";import{LYRA_DEFAULT_attachmentPreviewFile,LYRA_DEFAULT_attachmentPreviewName,LYRA_DEFAULT_attachmentRetryWithContext,
|
|
1
|
+
import{__decorate}from"tslib";import{html,nothing,svg}from"lit";import{property}from"lit/decorators.js";import{LyraElement}from"../../../internal/lyra-element.js";import{nextId}from"../../../internal/a11y.js";import{AnnouncementSinkController}from"../../../internal/announcer.js";import{closeIcon,expandIcon,fileIcon}from"../../../internal/icons.js";import{finiteRange}from"../../../internal/numbers.js";import{safeMediaSrc}from"../../../internal/safe-url.js";import{styles}from"./attachment-chip.styles.js";import{normalizeReflectedOptionalSize,normalizeSize,optionalSizeConverter}from"../../../internal/variants.js";import{getNumberFormat}from"../../../internal/intl-cache.js";import{FILE_SIZE_UNIT_KEYS,formatFileSize,localizedNumberLabel}from"./file-size.js";import{LYRA_DEFAULT_attachmentPreviewFile,LYRA_DEFAULT_attachmentPreviewName,LYRA_DEFAULT_attachmentRetryWithContext,LYRA_DEFAULT_attachmentUploadFailed,LYRA_DEFAULT_attachmentUploadingIndeterminate,LYRA_DEFAULT_attachmentUploadingProgress,LYRA_DEFAULT_attachmentUploadingWithContext}from"../../../internal/default-strings/media.generated.js";import{LYRA_DEFAULT_attachmentUntitledFile,LYRA_DEFAULT_collapse,LYRA_DEFAULT_details,LYRA_DEFAULT_fileSizeUnitB,LYRA_DEFAULT_fileSizeUnitGb,LYRA_DEFAULT_fileSizeUnitKb,LYRA_DEFAULT_fileSizeUnitMb,LYRA_DEFAULT_fileSizeUnitTb,LYRA_DEFAULT_loading,LYRA_DEFAULT_map,LYRA_DEFAULT_navigation,LYRA_DEFAULT_open,LYRA_DEFAULT_removeWithContext,LYRA_DEFAULT_search,LYRA_DEFAULT_select}from"../../../internal/default-strings/shared.generated.js";import{FILE_SIZE_UNIT_KEYS as FILE_SIZE_UNIT_KEYS2,formatFileSize as formatFileSize2}from"./file-size.js";const ICON_VIEW_BOX="0 0 24 24";function isCompactSize(size){if(size===void 0)return!1;const step=normalizeSize(size);return step==="2xs"||step==="xs"||step==="s"}const ICON_STROKE_WIDTH="1.75";function retryIcon(){return svg`
|
|
2
2
|
<svg
|
|
3
3
|
width="1em"
|
|
4
4
|
height="1em"
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import{__decorate}from"tslib";import{collectionSupport}from"../../../internal/collection-snapshot.js";import{html,nothing,svg}from"lit";import{property,query}from"lit/decorators.js";import{LyraElement}from"../../../internal/lyra-element.js";import{syncAriaDescribedByElements}from"../../../internal/aria-controls.js";import{chevronIcon}from"../../../internal/icons.js";import{relayNativeEvent}from"../../../internal/native-event-relay.js";import{sizes}from"../../../internal/sizes.styles.js";import{styles}from"./attachment-trigger.styles.js";import{falseDefaultBooleanConverter}from"../../../internal/converters.js";import{matchesAccept}from"../file-input/accept.js";import{LYRA_DEFAULT_attachmentAdd,LYRA_DEFAULT_attachmentMenuAudio,LYRA_DEFAULT_attachmentMenuCamera,LYRA_DEFAULT_attachmentMenuFiles,LYRA_DEFAULT_attachmentMenuImage,LYRA_DEFAULT_attachmentTriggerAudio,LYRA_DEFAULT_attachmentTriggerCamera,LYRA_DEFAULT_attachmentTriggerFiles,LYRA_DEFAULT_attachmentTriggerImage
|
|
1
|
+
import{__decorate}from"tslib";import{collectionSupport}from"../../../internal/collection-snapshot.js";import{html,nothing,svg}from"lit";import{property,query}from"lit/decorators.js";import{LyraElement}from"../../../internal/lyra-element.js";import{syncAriaDescribedByElements}from"../../../internal/aria-controls.js";import{chevronIcon}from"../../../internal/icons.js";import{relayNativeEvent}from"../../../internal/native-event-relay.js";import{sizes}from"../../../internal/sizes.styles.js";import{styles}from"./attachment-trigger.styles.js";import{falseDefaultBooleanConverter}from"../../../internal/converters.js";import{matchesAccept}from"../file-input/accept.js";import{LYRA_DEFAULT_attachmentAdd,LYRA_DEFAULT_attachmentMenuAudio,LYRA_DEFAULT_attachmentMenuCamera,LYRA_DEFAULT_attachmentMenuFiles,LYRA_DEFAULT_attachmentMenuImage,LYRA_DEFAULT_attachmentTriggerAudio,LYRA_DEFAULT_attachmentTriggerCamera,LYRA_DEFAULT_attachmentTriggerFiles,LYRA_DEFAULT_attachmentTriggerImage}from"../../../internal/default-strings/media.generated.js";import{LYRA_DEFAULT_collapse,LYRA_DEFAULT_copy,LYRA_DEFAULT_date,LYRA_DEFAULT_details,LYRA_DEFAULT_map,LYRA_DEFAULT_navigation,LYRA_DEFAULT_open,LYRA_DEFAULT_search,LYRA_DEFAULT_select}from"../../../internal/default-strings/shared.generated.js";const ICON_VIEW_BOX="0 0 24 24",ICON_STROKE_WIDTH="1.75";function icon(paths){return svg`
|
|
2
2
|
<svg
|
|
3
3
|
width="1em"
|
|
4
4
|
height="1em"
|
|
@@ -25,7 +25,7 @@ import{__decorate}from"tslib";import{collectionSupport}from"../../../internal/co
|
|
|
25
25
|
<path d="M19 10v2a7 7 0 0 1-14 0v-2"></path>
|
|
26
26
|
<line x1="12" y1="19" x2="12" y2="23"></line>
|
|
27
27
|
<line x1="8" y1="23" x2="16" y2="23"></line>
|
|
28
|
-
`)}const CAPABILITY_META={files:{icon:paperclipIcon,triggerKey:"attachmentTriggerFiles",menuKey:"attachmentMenuFiles"},image:{icon:imageIcon,triggerKey:"attachmentTriggerImage",menuKey:"attachmentMenuImage"},camera:{icon:cameraIcon,triggerKey:"attachmentTriggerCamera",menuKey:"attachmentMenuCamera"},audio:{icon:audioIcon,triggerKey:"attachmentTriggerAudio",menuKey:"attachmentMenuAudio"}},OWNED_CAPABILITY_SNAPSHOTS=new WeakSet;function ownCapabilitySnapshot(values){const snapshot=Object.freeze(values);return OWNED_CAPABILITY_SNAPSHOTS.add(snapshot),snapshot}const DEFAULT_CAPABILITIES=ownCapabilitySnapshot(["files"]),MAX_ATTACHMENT_CAPABILITIES=4,ATTACHMENT_CAPABILITY_SCAN_LIMIT=64;function normalizeCapabilities(value){try{if(!Array.isArray(value))return DEFAULT_CAPABILITIES;if(OWNED_CAPABILITY_SNAPSHOTS.has(value))return value;const normalized=[],length=Math.min(value.length,ATTACHMENT_CAPABILITY_SCAN_LIMIT);for(let index=0;index<length&&normalized.length<MAX_ATTACHMENT_CAPABILITIES;index++){const candidate=value[index];typeof candidate=="string"&&Object.prototype.hasOwnProperty.call(CAPABILITY_META,candidate)&&!normalized.includes(candidate)&&normalized.push(candidate)}return ownCapabilitySnapshot(normalized)}catch{return DEFAULT_CAPABILITIES}}function isCanonicalCapabilitySnapshot(source){try{return typeof source=="object"&&source!==null&&OWNED_CAPABILITY_SNAPSHOTS.has(source)}catch{return!1}}class LyraAttachmentTrigger extends LyraElement{constructor(){super(...arguments),this.capabilities=DEFAULT_CAPABILITIES,this.accept="",this.hostAccessibleLabel=null,this.multiple=!1,this.disabled=!1,this.appearance="plain",this.size="m",this.descriptionSyncGeneration=0,this.hasSyncedDescribedByElements=!1,this.pendingCapability="files",this.pickerGeneration=0,this.pendingPickerGeneration=-1,this.onTriggerClick=()=>{const capability=this.effectiveCapabilities[0];capability!==void 0&&this.activateCapability(capability)},this.onMenuSelect=e=>{e.stopPropagation();const capability=e.detail.item.value;Object.prototype.hasOwnProperty.call(CAPABILITY_META,capability)&&this.effectiveCapabilities.includes(capability)&&this.activateCapability(capability)},this.onInputChange=e=>{e.stopPropagation();const input=e.target,selected=input.files,generation=this.pendingPickerGeneration;if(this.pendingPickerGeneration=-1,this.isConnected&&generation===this.pickerGeneration&&!this.disabled&&selected&&selected.length>0){const accept=this.effectiveAccept(this.pendingCapability),files=Array.from(selected),matching=files.filter(file=>matchesAccept(file,accept));this.emit("lr-files",{capability:this.pendingCapability,files:matching,rejected:files.filter(file=>!matching.includes(file)).map(file=>({file,reason:"type"})),remainingFiles:null,remainingTotalSize:null})}input.value=""},this.onControlFocus=event=>{relayNativeEvent(this,event)},this.onControlBlur=event=>{relayNativeEvent(this,event)},this.stopInternalEvent=event=>{event.stopPropagation()}}static{this.defaultStrings={...super.defaultStrings,attachmentAdd:LYRA_DEFAULT_attachmentAdd,attachmentMenuAudio:LYRA_DEFAULT_attachmentMenuAudio,attachmentMenuCamera:LYRA_DEFAULT_attachmentMenuCamera,attachmentMenuFiles:LYRA_DEFAULT_attachmentMenuFiles,attachmentMenuImage:LYRA_DEFAULT_attachmentMenuImage,attachmentTriggerAudio:LYRA_DEFAULT_attachmentTriggerAudio,attachmentTriggerCamera:LYRA_DEFAULT_attachmentTriggerCamera,attachmentTriggerFiles:LYRA_DEFAULT_attachmentTriggerFiles,attachmentTriggerImage:LYRA_DEFAULT_attachmentTriggerImage,collapse:LYRA_DEFAULT_collapse,copy:LYRA_DEFAULT_copy,details:LYRA_DEFAULT_details,map:LYRA_DEFAULT_map,navigation:LYRA_DEFAULT_navigation,open:LYRA_DEFAULT_open,search:LYRA_DEFAULT_search,select:LYRA_DEFAULT_select}}static{this.collectionSupport=collectionSupport}static{this.ownedCollectionProperties=Object.freeze(["capabilities"])}static{this.styles=[LyraElement.styles,sizes,styles]}static{this.immutableEventDetails=Object.freeze(["lr-files"])}get triggerEl(){return this.composedTriggerEl?.control??this.composedTriggerEl}get effectiveCapabilities(){return normalizeCapabilities(this.capabilities)}get hasFileCapability(){return this.effectiveCapabilities.includes("files")||this.effectiveCapabilities.includes("image")}willUpdate(changed){if(super.willUpdate(changed),changed.has("disabled")&&this.disabled&&this.dropdownEl?.hide(),changed.has("capabilities")){const normalized=normalizeCapabilities(this.capabilities);isCanonicalCapabilitySnapshot(this.capabilities)||(this.capabilities=normalized)}}updated(changed){super.updated(changed),this.syncTriggerDescription();const composed=this.composedTriggerEl;if(!composed||composed.control)return;const generation=++this.descriptionSyncGeneration;composed.updateComplete.then(()=>{generation!==this.descriptionSyncGeneration||!this.isConnected||this.syncTriggerDescription()})}syncTriggerDescription(){const hostDescribedBy=this.getAttribute("aria-describedby");!hostDescribedBy&&!this.hasSyncedDescribedByElements||(this.hasSyncedDescribedByElements=syncAriaDescribedByElements(this,this.triggerEl,hostDescribedBy))}effectiveAccept(capability){return capability==="image"?this.accept||"image/*":this.accept}activateCapability(capability){if(this.disabled)return;if(capability==="camera"){this.emit("lr-camera-request",null);return}if(capability==="audio"){this.emit("lr-audio-request",null);return}this.pendingCapability=capability,this.pendingPickerGeneration=++this.pickerGeneration;const input=this.inputEl;input&&(input.accept=this.effectiveAccept(capability),input.click())}disconnectedCallback(){this.pendingPickerGeneration=-1,this.pickerGeneration++,this.dropdownEl?.hide(),super.disconnectedCallback()}primaryControl(){return this.renderRoot.querySelector('[part="trigger"], [part="menu-trigger"]')??void 0}focus(options){this.primaryControl()?.focus(options)}blur(){this.primaryControl()?.blur()}click(){this.primaryControl()?.click()}renderHiddenInput(){return html`
|
|
28
|
+
`)}const CAPABILITY_META={files:{icon:paperclipIcon,triggerKey:"attachmentTriggerFiles",menuKey:"attachmentMenuFiles"},image:{icon:imageIcon,triggerKey:"attachmentTriggerImage",menuKey:"attachmentMenuImage"},camera:{icon:cameraIcon,triggerKey:"attachmentTriggerCamera",menuKey:"attachmentMenuCamera"},audio:{icon:audioIcon,triggerKey:"attachmentTriggerAudio",menuKey:"attachmentMenuAudio"}},OWNED_CAPABILITY_SNAPSHOTS=new WeakSet;function ownCapabilitySnapshot(values){const snapshot=Object.freeze(values);return OWNED_CAPABILITY_SNAPSHOTS.add(snapshot),snapshot}const DEFAULT_CAPABILITIES=ownCapabilitySnapshot(["files"]),MAX_ATTACHMENT_CAPABILITIES=4,ATTACHMENT_CAPABILITY_SCAN_LIMIT=64;function normalizeCapabilities(value){try{if(!Array.isArray(value))return DEFAULT_CAPABILITIES;if(OWNED_CAPABILITY_SNAPSHOTS.has(value))return value;const normalized=[],length=Math.min(value.length,ATTACHMENT_CAPABILITY_SCAN_LIMIT);for(let index=0;index<length&&normalized.length<MAX_ATTACHMENT_CAPABILITIES;index++){const candidate=value[index];typeof candidate=="string"&&Object.prototype.hasOwnProperty.call(CAPABILITY_META,candidate)&&!normalized.includes(candidate)&&normalized.push(candidate)}return ownCapabilitySnapshot(normalized)}catch{return DEFAULT_CAPABILITIES}}function isCanonicalCapabilitySnapshot(source){try{return typeof source=="object"&&source!==null&&OWNED_CAPABILITY_SNAPSHOTS.has(source)}catch{return!1}}class LyraAttachmentTrigger extends LyraElement{constructor(){super(...arguments),this.capabilities=DEFAULT_CAPABILITIES,this.accept="",this.hostAccessibleLabel=null,this.multiple=!1,this.disabled=!1,this.appearance="plain",this.size="m",this.descriptionSyncGeneration=0,this.hasSyncedDescribedByElements=!1,this.pendingCapability="files",this.pickerGeneration=0,this.pendingPickerGeneration=-1,this.onTriggerClick=()=>{const capability=this.effectiveCapabilities[0];capability!==void 0&&this.activateCapability(capability)},this.onMenuSelect=e=>{e.stopPropagation();const capability=e.detail.item.value;Object.prototype.hasOwnProperty.call(CAPABILITY_META,capability)&&this.effectiveCapabilities.includes(capability)&&this.activateCapability(capability)},this.onInputChange=e=>{e.stopPropagation();const input=e.target,selected=input.files,generation=this.pendingPickerGeneration;if(this.pendingPickerGeneration=-1,this.isConnected&&generation===this.pickerGeneration&&!this.disabled&&selected&&selected.length>0){const accept=this.effectiveAccept(this.pendingCapability),files=Array.from(selected),matching=files.filter(file=>matchesAccept(file,accept));this.emit("lr-files",{capability:this.pendingCapability,files:matching,rejected:files.filter(file=>!matching.includes(file)).map(file=>({file,reason:"type"})),remainingFiles:null,remainingTotalSize:null})}input.value=""},this.onControlFocus=event=>{relayNativeEvent(this,event)},this.onControlBlur=event=>{relayNativeEvent(this,event)},this.stopInternalEvent=event=>{event.stopPropagation()}}static{this.defaultStrings={...super.defaultStrings,attachmentAdd:LYRA_DEFAULT_attachmentAdd,attachmentMenuAudio:LYRA_DEFAULT_attachmentMenuAudio,attachmentMenuCamera:LYRA_DEFAULT_attachmentMenuCamera,attachmentMenuFiles:LYRA_DEFAULT_attachmentMenuFiles,attachmentMenuImage:LYRA_DEFAULT_attachmentMenuImage,attachmentTriggerAudio:LYRA_DEFAULT_attachmentTriggerAudio,attachmentTriggerCamera:LYRA_DEFAULT_attachmentTriggerCamera,attachmentTriggerFiles:LYRA_DEFAULT_attachmentTriggerFiles,attachmentTriggerImage:LYRA_DEFAULT_attachmentTriggerImage,collapse:LYRA_DEFAULT_collapse,copy:LYRA_DEFAULT_copy,date:LYRA_DEFAULT_date,details:LYRA_DEFAULT_details,map:LYRA_DEFAULT_map,navigation:LYRA_DEFAULT_navigation,open:LYRA_DEFAULT_open,search:LYRA_DEFAULT_search,select:LYRA_DEFAULT_select}}static{this.collectionSupport=collectionSupport}static{this.ownedCollectionProperties=Object.freeze(["capabilities"])}static{this.styles=[LyraElement.styles,sizes,styles]}static{this.immutableEventDetails=Object.freeze(["lr-files"])}get triggerEl(){return this.composedTriggerEl?.control??this.composedTriggerEl}get effectiveCapabilities(){return normalizeCapabilities(this.capabilities)}get hasFileCapability(){return this.effectiveCapabilities.includes("files")||this.effectiveCapabilities.includes("image")}willUpdate(changed){if(super.willUpdate(changed),changed.has("disabled")&&this.disabled&&this.dropdownEl?.hide(),changed.has("capabilities")){const normalized=normalizeCapabilities(this.capabilities);isCanonicalCapabilitySnapshot(this.capabilities)||(this.capabilities=normalized)}}updated(changed){super.updated(changed),this.syncTriggerDescription();const composed=this.composedTriggerEl;if(!composed||composed.control)return;const generation=++this.descriptionSyncGeneration;composed.updateComplete.then(()=>{generation!==this.descriptionSyncGeneration||!this.isConnected||this.syncTriggerDescription()})}syncTriggerDescription(){const hostDescribedBy=this.getAttribute("aria-describedby");!hostDescribedBy&&!this.hasSyncedDescribedByElements||(this.hasSyncedDescribedByElements=syncAriaDescribedByElements(this,this.triggerEl,hostDescribedBy))}effectiveAccept(capability){return capability==="image"?this.accept||"image/*":this.accept}activateCapability(capability){if(this.disabled)return;if(capability==="camera"){this.emit("lr-camera-request",null);return}if(capability==="audio"){this.emit("lr-audio-request",null);return}this.pendingCapability=capability,this.pendingPickerGeneration=++this.pickerGeneration;const input=this.inputEl;input&&(input.accept=this.effectiveAccept(capability),input.click())}disconnectedCallback(){this.pendingPickerGeneration=-1,this.pickerGeneration++,this.dropdownEl?.hide(),super.disconnectedCallback()}primaryControl(){return this.renderRoot.querySelector('[part="trigger"], [part="menu-trigger"]')??void 0}focus(options){this.primaryControl()?.focus(options)}blur(){this.primaryControl()?.blur()}click(){this.primaryControl()?.click()}renderHiddenInput(){return html`
|
|
29
29
|
<input
|
|
30
30
|
part="hidden-input"
|
|
31
31
|
type="file"
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import{__decorate}from"tslib";import{html,nothing}from"lit";import{property,query,state}from"lit/decorators.js";import{keyed}from"lit/directives/keyed.js";import{ref}from"lit/directives/ref.js";import{literalSetConverter}from"../../../internal/converters.js";import{tag}from"../../../internal/prefix.js";import{LyraElement}from"../../../internal/lyra-element.js";import{DocumentAnchorTarget}from"../../../internal/anchor-target.js";import{MAX_NATIVE_PLAYBACK_RATE as MAX_PLAYBACK_RATE,MIN_NATIVE_PLAYBACK_RATE as MIN_PLAYBACK_RATE,NativeMediaController,safeNativeMediaSource as safeMediaSrc}from"../../../internal/media-controller.js";import{hostAriaLabel,srOnly}from"../../../internal/a11y.js";import{finiteNumber,finiteRange}from"../../../internal/numbers.js";import{attachInternalsSafely}from"../../../internal/element-internals.js";import{resolveCanvasColor}from"../../../internal/canvas-color.js";import{chevronIcon}from"../../../internal/icons.js";import{getNumberFormat}from"../../../internal/intl-cache.js";import{formatMediaTime}from"../../../internal/media-time.js";import{ThemeWatcher}from"../../../internal/theme-watcher.js";import{relayNativeEvent}from"../../../internal/native-event-relay.js";import{styles}from"./av-player.styles.js";import{AnnouncementSinkController}from"../../../internal/announcer.js";import{resolveBoundedCanvasAllocation}from"../../../internal/canvas.js";import{EMPTY_LYRA_AV_CUES,EMPTY_LYRA_AV_TRACKS,snapshotLyraAvCues,snapshotLyraAvTracks}from"./av-metadata.js";import{
|
|
1
|
+
import{__decorate}from"tslib";import{html,nothing}from"lit";import{property,query,state}from"lit/decorators.js";import{keyed}from"lit/directives/keyed.js";import{ref}from"lit/directives/ref.js";import{literalSetConverter}from"../../../internal/converters.js";import{tag}from"../../../internal/prefix.js";import{LyraElement}from"../../../internal/lyra-element.js";import{DocumentAnchorTarget}from"../../../internal/anchor-target.js";import{MAX_NATIVE_PLAYBACK_RATE as MAX_PLAYBACK_RATE,MIN_NATIVE_PLAYBACK_RATE as MIN_PLAYBACK_RATE,NativeMediaController,safeNativeMediaSource as safeMediaSrc}from"../../../internal/media-controller.js";import{hostAriaLabel,srOnly}from"../../../internal/a11y.js";import{finiteNumber,finiteRange}from"../../../internal/numbers.js";import{attachInternalsSafely}from"../../../internal/element-internals.js";import{resolveCanvasColor}from"../../../internal/canvas-color.js";import{chevronIcon}from"../../../internal/icons.js";import{getNumberFormat}from"../../../internal/intl-cache.js";import{formatMediaTime}from"../../../internal/media-time.js";import{ThemeWatcher}from"../../../internal/theme-watcher.js";import{relayNativeEvent}from"../../../internal/native-event-relay.js";import{styles}from"./av-player.styles.js";import{AnnouncementSinkController}from"../../../internal/announcer.js";import{resolveBoundedCanvasAllocation}from"../../../internal/canvas.js";import{EMPTY_LYRA_AV_CUES,EMPTY_LYRA_AV_TRACKS,snapshotLyraAvCues,snapshotLyraAvTracks}from"./av-metadata.js";import{LYRA_DEFAULT_avPlayerFailedToLoad,LYRA_DEFAULT_avPlayerLabel,LYRA_DEFAULT_avPlayerPlaybackRate,LYRA_DEFAULT_avPlayerPosition,LYRA_DEFAULT_avPlayerRateOption,LYRA_DEFAULT_avPlayerTimeline,LYRA_DEFAULT_avPlayerTranscript,LYRA_DEFAULT_viewerHighlightLabel}from"../../../internal/default-strings/media.generated.js";import{LYRA_DEFAULT_anchorJumped,LYRA_DEFAULT_anchorJumpedToPage,LYRA_DEFAULT_anchorNotFound}from"../../../internal/default-strings/shared.generated.js";const CONTROLS_SURFACE=literalSetConverter(["regular","clear"],"regular"),TIME_CHANGE_THROTTLE_MS=250,MAX_AV_RATES=32,MAX_AV_PEAKS=65536,MAX_CANVAS_DIMENSION=4096,MAX_CANVAS_PIXELS=8388608,OWNED_AV_COLLECTIONS=new WeakSet,NO_REPORTED_ERROR=Symbol("no-reported-av-error");function ownedSnapshot(values){const snapshot=Object.freeze(values);return OWNED_AV_COLLECTIONS.add(snapshot),snapshot}const EMPTY_RATES=ownedSnapshot([]),DEFAULT_RATES=ownedSnapshot([.75,1,1.25,1.5,2]),EMPTY_CUES=EMPTY_LYRA_AV_CUES,EMPTY_PEAKS=ownedSnapshot([]),EMPTY_TRACKS=EMPTY_LYRA_AV_TRACKS;function normalizeArray(value,limit,normalize,fallback){try{if(!Array.isArray(value))return fallback;if(OWNED_AV_COLLECTIONS.has(value))return value;const result=[],length=Math.min(value.length,limit);for(let index=0;index<length;index++)try{const normalized=normalize(value[index],index);normalized!==void 0&&result.push(normalized)}catch{}return ownedSnapshot(result)}catch{return fallback}}function normalizeRates(value){const seen=new Set;return normalizeArray(value,MAX_AV_RATES,candidate=>{if(!(typeof candidate!="number"||!Number.isFinite(candidate)||candidate<MIN_PLAYBACK_RATE||candidate>MAX_PLAYBACK_RATE||seen.has(candidate)))return seen.add(candidate),candidate},EMPTY_RATES)}function normalizePeaks(value){return normalizeArray(value,MAX_AV_PEAKS,candidate=>typeof candidate=="number"?finiteRange(candidate,0,0,1):void 0,EMPTY_PEAKS)}function positiveFinite(value){const finite=finiteNumber(value,1);return finite>0?finite:1}function waveformPaintPeaks(peaks,maxBars){const barCount=Math.max(1,Math.floor(finiteNumber(maxBars,1)));if(peaks.length<=barCount)return peaks;const finalIndex=peaks.length-1;if(barCount===1)return[finiteRange(peaks[finalIndex],0,0,1)];const result=new Array(barCount),preEndpointBars=barCount-1;for(let barIndex=0;barIndex<preEndpointBars;barIndex+=1){const start=Math.floor(barIndex*finalIndex/preEndpointBars),end=Math.floor((barIndex+1)*finalIndex/preEndpointBars);let peak=0;for(let sampleIndex=start;sampleIndex<end;sampleIndex+=1)peak=Math.max(peak,finiteRange(peaks[sampleIndex],0,0,1));result[barIndex]=peak}return result[preEndpointBars]=finiteRange(peaks[finalIndex],0,0,1),result}class LyraAvPlayerBase extends LyraElement{}class LyraAvPlayer extends DocumentAnchorTarget(LyraAvPlayerBase){static{this.defaultStrings={...super.defaultStrings,anchorJumped:LYRA_DEFAULT_anchorJumped,anchorJumpedToPage:LYRA_DEFAULT_anchorJumpedToPage,anchorNotFound:LYRA_DEFAULT_anchorNotFound,avPlayerFailedToLoad:LYRA_DEFAULT_avPlayerFailedToLoad,avPlayerLabel:LYRA_DEFAULT_avPlayerLabel,avPlayerPlaybackRate:LYRA_DEFAULT_avPlayerPlaybackRate,avPlayerPosition:LYRA_DEFAULT_avPlayerPosition,avPlayerRateOption:LYRA_DEFAULT_avPlayerRateOption,avPlayerTimeline:LYRA_DEFAULT_avPlayerTimeline,avPlayerTranscript:LYRA_DEFAULT_avPlayerTranscript,viewerHighlightLabel:LYRA_DEFAULT_viewerHighlightLabel}}static{this.styles=[LyraElement.styles,styles,srOnly]}static{this.properties={playbackRate:{type:Number,attribute:"playback-rate",reflect:!0,noAccessor:!0},volume:{type:Number,reflect:!0,noAccessor:!0}}}get playbackRate(){return this._playbackRate}set playbackRate(next){const old=this._playbackRate;this._playbackRate=finiteRange(next,1,MIN_PLAYBACK_RATE,MAX_PLAYBACK_RATE),this.requestUpdate("playbackRate",old)}get volume(){return this._volume}set volume(next){const old=this._volume;this._volume=finiteRange(next,1,0,1),this.requestUpdate("volume",old)}get rates(){return this._rates}set rates(value){if(value===this.inputs.rates)return;this.inputs.rates=value;const previous=this._rates;this._rates=normalizeRates(value),this.requestUpdate("rates",previous)}get cues(){return this._cues}set cues(value){if(value===this.inputs.cues)return;this.inputs.cues=value;const previous=this._cues;if(this._cues=snapshotLyraAvCues(value),this._cues!==previous){const starts=[...new Set(this._cues.map(cue=>cue.start))].sort((a,b)=>a-b);this.nextCueStarts=new Map;for(let index=0;index<starts.length;index+=1)this.nextCueStarts.set(starts[index],starts[index+1]??1/0)}this.requestUpdate("cues",previous)}get peaks(){return this._peaks}set peaks(value){if(value===this.inputs.peaks)return;this.inputs.peaks=value;const previous=this._peaks;this._peaks=normalizePeaks(value),this.requestUpdate("peaks",previous)}get tracks(){return this._tracks}set tracks(value){if(value===this.inputs.tracks)return;this.inputs.tracks=value;const previous=this._tracks;this._tracks=snapshotLyraAvTracks(value),this.requestUpdate("tracks",previous)}constructor(){super(),this.src="",this.name="",this.mimeType="",this.poster="",this.loop=!1,this.muted=!1,this.preload="metadata",this._playbackRate=1,this._volume=1,this.controlsSurface="regular",this.inputs={},this._rates=DEFAULT_RATES,this._cues=EMPTY_CUES,this.nextCueStarts=new Map,this._peaks=EMPTY_PEAKS,this._tracks=EMPTY_TRACKS,this.anchorKinds=["time-range"],this.duration=0,this.currentTimeState=0,this.activeCueId=null,this.activeCueIndex=-1,this.searchQuery="",this.searchMatches=[],this.activeSearchIndex=-1,this.metadataLoaded=!1,this.sourceError=!1,this.playbackError=!1,this.mediaController=new NativeMediaController(this,{onEvent:event=>this.onNativeMediaEvent(event)}),this.semanticInternals=attachInternalsSafely(this),this.lastTimeChangeAt=0,this.searchLocale="",this.transcriptLocale="",this.searchMatchIndices=new Set,this.cueKeys=[],this.announcements=new AnnouncementSinkController(this,{eager:["assertive"]}),this.waveformVisible=!1,this.waveformDirty=!1,this.pendingSeekEmission=null,this.lastEmittedTime=null,this.lastReportedSourceError=NO_REPORTED_ERROR,this.connectionEventBaselinePending=!0,this.onMediaFocus=event=>{relayNativeEvent(this,event)},this.onMediaBlur=event=>{relayNativeEvent(this,event)},this.onWindowResize=()=>this.drawWaveform(),this.canvasRef=el=>{if(!el){this.unbindWaveformResizeObserver();return}this.syncWaveformVisibilityObserver(),this.syncWaveformResizeObserver(),this.drawWaveform()},this.mediaRef=el=>{const media=el?.localName==="audio"||el?.localName==="video"?el:void 0;this.mediaController.attach(media)},this.onPlaybackFailure=error=>{this.playbackError=!0,this.announceRenderError(),this.emit("lr-render-error",{error})},this.onHighlightActivate=(id,start)=>{this.activeHighlightId=id,this.seek(start),this.emit("lr-highlight-activate",{highlightId:id})},this.onTimelineClick=event=>{if(!this.duration)return;const rect=event.currentTarget.getBoundingClientRect();if(rect.width<=0)return;const ratio=Math.min(1,Math.max(0,(event.clientX-rect.left)/rect.width));this.seek(ratio*this.duration)},this.onTimelineKeyDown=event=>{if(!(this.duration>0))return;const delta=event.shiftKey?15:5;switch(event.key){case"ArrowLeft":event.preventDefault(),this.seek(Math.max(0,this.currentTime-delta));break;case"ArrowRight":event.preventDefault(),this.seek(Math.min(this.duration,this.currentTime+delta));break;case"Home":event.preventDefault(),this.seek(0);break;case"End":event.preventDefault(),this.seek(this.duration);break;case" ":event.preventDefault(),this.toggle();break;default:return}},this.cueKey=(_cue,index)=>this.cueKeys[index]??`index:${index}`,this.renderCue=(cue,index)=>{const c=cue,start=this.safeCueStart(c),isActive=this.activeCueIndex===index,isMatch=this.searchMatchIndices.has(index),isActiveMatch=index===this.searchMatches[this.activeSearchIndex],part=["cue",isActive?"cue-current":"",isMatch?"cue-match":"",isActiveMatch?"cue-active-match":""].filter(Boolean).join(" ");return html`<button
|
|
2
2
|
part=${part}
|
|
3
3
|
type="button"
|
|
4
4
|
aria-current=${isActive?"true":"false"}
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import{__decorate}from"tslib";import{collectionSupport}from"../../../internal/collection-snapshot.js";import{html,nothing}from"lit";import{property,query,state}from"lit/decorators.js";import{hostAriaLabel}from"../../../internal/a11y.js";import{collectInitialSlotAssignment}from"../../../internal/initial-slot-collection.js";import{getNumberFormat}from"../../../internal/intl-cache.js";import{LyraElement}from"../../../internal/lyra-element.js";import{finiteCount}from"../../../internal/numbers.js";import{tag}from"../../../internal/prefix.js";import{LYRA_AVATAR_SHAPE_VALUES,LYRA_SIZE_VALUES,LYRA_VARIANT_VALUES}from"../../../internal/variant-values.js";import{styles}from"./avatar-group.styles.js";import{LYRA_DEFAULT_showMoreCollapsed,LYRA_DEFAULT_showMoreCount}from"../../../internal/default-strings.generated.js";const OVERFLOW_IDENTITY_DETAIL_PROPERTIES=Object.freeze({"lr-overflow-activate":Object.freeze(["hiddenAvatars"])});class LyraAvatarGroup extends LyraElement{constructor(){super(...arguments),this.size="m",this.shape="circle",this.variant="neutral",this.label="",this.eligibleAvatarCount=0,this.overflowHiddenAvatars=Object.freeze([]),this.assignedAvatars=Object.freeze([]),this.observedAvatars=Object.freeze([]),this.defaultOwnership=new Map,this.pendingOwnedAttributeWrites=new WeakMap,this.onSlotChange=e=>{this.onSlotChangeFromSlot(e.target)},this.onOverflowClick=()=>{const hiddenAvatars=Object.freeze([...this.overflowHiddenAvatars]);this.emit("lr-overflow-activate",Object.freeze({hiddenCount:hiddenAvatars.length,hiddenAvatars}))}}static{this.defaultStrings={...super.defaultStrings,showMoreCollapsed:LYRA_DEFAULT_showMoreCollapsed,showMoreCount:LYRA_DEFAULT_showMoreCount}}static{this.collectionSupport=collectionSupport}static{this.immutableEventDetails=Object.freeze(["lr-overflow-activate"])}static{this.identityEventDetailProperties=OVERFLOW_IDENTITY_DETAIL_PROPERTIES}static{this.styles=[LyraElement.styles,styles]}get max(){return this._max}set max(next){const old=this._max;this._max=next==null?void 0:finiteCount(next),this.requestUpdate("max",old)}willUpdate(changed){super.willUpdate(changed),changed.has("size")&&!LYRA_SIZE_VALUES.includes(this.size)&&(this.size="m"),changed.has("shape")&&!LYRA_AVATAR_SHAPE_VALUES.includes(this.shape)&&(this.shape="circle"),changed.has("variant")&&!LYRA_VARIANT_VALUES.includes(this.variant)&&(this.variant="neutral"),this.hasUpdated?changed.has("max")&&this.recomputeWindow():this.seedFirstRenderState(()=>{this.assignedAvatars=Object.freeze(Array.from(this.children).filter(element=>this.isAvatar(element))),this.recomputeWindow()})}firstUpdated(changed){super.firstUpdated(changed);const slot=this.avatarsSlot;queueMicrotask(()=>{collectInitialSlotAssignment(slot,s=>this.onSlotChangeFromSlot(s))})}connectedCallback(){if(super.connectedCallback(),!this.hasUpdated)return;const slot=this.renderRoot.querySelector("slot");slot?.localName==="slot"&&this.reconcileAvatars(slot.assignedElements({flatten:!0}))}updated(changed){super.updated(changed),this.connectAvatarObserver(this.assignedAvatars),this.applyGroupDefaults(),this.applyVisibilityMarkers()}disconnectedCallback(){this.disconnectAvatarObserver(),this.restoreOwnedState(),super.disconnectedCallback()}adoptedCallback(){if(super.adoptedCallback(),this.disconnectAvatarObserver(),!this.isConnected)return;const slot=this.renderRoot.querySelector("slot");slot?.localName==="slot"&&this.reconcileAvatars(slot.assignedElements({flatten:!0}))}get hasOverflow(){const max=this.max;return max!=null&&this.eligibleAvatarCount>max}get hiddenCount(){return this.overflowHiddenAvatars.length}isAvatar(element){return element.localName===tag("avatar")}sameAvatars(a,b){return a.length===b.length&&a.every((avatar,index)=>avatar===b[index])}reconcileAvatars(elements){if(!this.isConnected)return;const next=Object.freeze(elements.filter(element=>this.isAvatar(element))),nextSet=new Set(next);for(const avatar of this.assignedAvatars)nextSet.has(avatar)||this.restoreAvatarState(avatar);this.assignedAvatars=next,this.connectAvatarObserver(next),this.applyGroupDefaults(),this.recomputeWindow(),this.applyVisibilityMarkers()}recomputeWindow(){const eligible=this.assignedAvatars.filter(avatar=>!avatar.hasAttribute("hidden")&&!avatar.hasAttribute("inert")),hidden=this.max==null?[]:eligible.slice(this.max);this.eligibleAvatarCount!==eligible.length&&(this.eligibleAvatarCount=eligible.length),this.sameAvatars(this.overflowHiddenAvatars,hidden)||(this.overflowHiddenAvatars=Object.freeze([...hidden]))}connectAvatarObserver(avatars){const ownerWindow=this.ownerDocument.defaultView;if(!ownerWindow||!!this.sameAvatars(this.observedAvatars,avatars)&&this.avatarObserverWindow===ownerWindow&&this.avatarObserver)return;this.disconnectAvatarObserver(),this.observedAvatars=Object.freeze([...avatars]),this.avatarObserverWindow=ownerWindow;const observer=new ownerWindow.MutationObserver(records=>{if(!(this.avatarObserver!==observer||!this.isConnected||this.ownerDocument.defaultView!==ownerWindow)){for(const record of records){const attribute=record.attributeName;if(!attribute||attribute!=="size"&&attribute!=="shape"&&attribute!=="variant"||!this.isAvatar(record.target))continue;const avatar=record.target;if(this.consumeOwnedAttributeWrite(avatar,attribute))continue;const ownership=this.defaultOwnership.get(avatar);ownership?.delete(attribute),ownership?.size===0&&this.defaultOwnership.delete(avatar)}this.applyGroupDefaults(),this.recomputeWindow(),this.applyVisibilityMarkers()}});this.avatarObserver=observer;for(const avatar of avatars)observer.observe(avatar,{attributes:!0,attributeFilter:["hidden","inert","size","shape","variant"]})}disconnectAvatarObserver(){this.avatarObserver?.disconnect();for(const avatar of this.observedAvatars)this.pendingOwnedAttributeWrites.delete(avatar);this.avatarObserver=void 0,this.avatarObserverWindow=void 0,this.observedAvatars=Object.freeze([])}markOwnedAttributeWrite(avatar,attribute){if(!this.avatarObserver||!this.observedAvatars.includes(avatar))return;let writes=this.pendingOwnedAttributeWrites.get(avatar);writes||(writes=new Map,this.pendingOwnedAttributeWrites.set(avatar,writes)),writes.set(attribute,(writes.get(attribute)??0)+1)}consumeOwnedAttributeWrite(avatar,attribute){const writes=this.pendingOwnedAttributeWrites.get(avatar),count=writes?.get(attribute)??0;return count===0?!1:(count===1?writes.delete(attribute):writes.set(attribute,count-1),writes.size===0&&this.pendingOwnedAttributeWrites.delete(avatar),!0)}applyGroupDefaults(){const values={size:this.size,shape:this.shape,variant:this.variant};for(const avatar of this.assignedAvatars){let ownership=this.defaultOwnership.get(avatar);for(const attribute of["size","shape","variant"]){const applied=ownership?.get(attribute);applied!=null&&avatar.getAttribute(attribute)!==applied&&ownership.delete(attribute),avatar.hasAttribute(attribute)?ownership?.has(attribute)&&avatar.getAttribute(attribute)===applied&&applied!==values[attribute]&&(ownership.set(attribute,values[attribute]),this.markOwnedAttributeWrite(avatar,attribute),avatar.setAttribute(attribute,values[attribute])):(ownership??=new Map,ownership.set(attribute,values[attribute]),this.markOwnedAttributeWrite(avatar,attribute),avatar.setAttribute(attribute,values[attribute]))}ownership?.size?this.defaultOwnership.set(avatar,ownership):this.defaultOwnership.delete(avatar)}}applyVisibilityMarkers(){const hidden=new Set(this.overflowHiddenAvatars),firstVisible=this.assignedAvatars.find(avatar=>!avatar.hasAttribute("hidden")&&!avatar.hasAttribute("inert")&&!hidden.has(avatar));for(const avatar of this.assignedAvatars)hidden.has(avatar)?avatar.setAttribute("data-lr-avatar-group-hidden",""):avatar.removeAttribute("data-lr-avatar-group-hidden"),avatar===firstVisible?avatar.setAttribute("data-lr-avatar-group-first",""):avatar.removeAttribute("data-lr-avatar-group-first")}restoreAvatarState(avatar){avatar.removeAttribute("data-lr-avatar-group-hidden"),avatar.removeAttribute("data-lr-avatar-group-first");const ownership=this.defaultOwnership.get(avatar);if(ownership){for(const[attribute,applied]of ownership)avatar.getAttribute(attribute)===applied&&avatar.removeAttribute(attribute);this.defaultOwnership.delete(avatar)}}restoreOwnedState(){for(const avatar of this.assignedAvatars)this.restoreAvatarState(avatar);this.assignedAvatars=Object.freeze([]),this.overflowHiddenAvatars=Object.freeze([]),this.eligibleAvatarCount=0}onSlotChangeFromSlot(slot){this.updateBrowserDerivedState(()=>{this.isConnected&&this.reconcileAvatars(slot.assignedElements({flatten:!0}))})}render(){const overflowing=this.hasOverflow,hiddenCount=this.hiddenCount,badgeIsFirstVisible=overflowing&&hiddenCount===this.eligibleAvatarCount,accessibleLabel=hostAriaLabel(this)??(this.label||nothing),localizedHiddenCount=getNumberFormat(this.effectiveLocale).format(hiddenCount);return html`
|
|
1
|
+
import{__decorate}from"tslib";import{collectionSupport}from"../../../internal/collection-snapshot.js";import{html,nothing}from"lit";import{property,query,state}from"lit/decorators.js";import{hostAriaLabel}from"../../../internal/a11y.js";import{collectInitialSlotAssignment}from"../../../internal/initial-slot-collection.js";import{getNumberFormat}from"../../../internal/intl-cache.js";import{LyraElement}from"../../../internal/lyra-element.js";import{finiteCount}from"../../../internal/numbers.js";import{tag}from"../../../internal/prefix.js";import{LYRA_AVATAR_SHAPE_VALUES,LYRA_SIZE_VALUES,LYRA_VARIANT_VALUES}from"../../../internal/variant-values.js";import{styles}from"./avatar-group.styles.js";import{LYRA_DEFAULT_showMoreCollapsed,LYRA_DEFAULT_showMoreCount}from"../../../internal/default-strings/shared.generated.js";const OVERFLOW_IDENTITY_DETAIL_PROPERTIES=Object.freeze({"lr-overflow-activate":Object.freeze(["hiddenAvatars"])});class LyraAvatarGroup extends LyraElement{constructor(){super(...arguments),this.size="m",this.shape="circle",this.variant="neutral",this.label="",this.eligibleAvatarCount=0,this.overflowHiddenAvatars=Object.freeze([]),this.assignedAvatars=Object.freeze([]),this.observedAvatars=Object.freeze([]),this.defaultOwnership=new Map,this.pendingOwnedAttributeWrites=new WeakMap,this.onSlotChange=e=>{this.onSlotChangeFromSlot(e.target)},this.onOverflowClick=()=>{const hiddenAvatars=Object.freeze([...this.overflowHiddenAvatars]);this.emit("lr-overflow-activate",Object.freeze({hiddenCount:hiddenAvatars.length,hiddenAvatars}))}}static{this.defaultStrings={...super.defaultStrings,showMoreCollapsed:LYRA_DEFAULT_showMoreCollapsed,showMoreCount:LYRA_DEFAULT_showMoreCount}}static{this.collectionSupport=collectionSupport}static{this.immutableEventDetails=Object.freeze(["lr-overflow-activate"])}static{this.identityEventDetailProperties=OVERFLOW_IDENTITY_DETAIL_PROPERTIES}static{this.styles=[LyraElement.styles,styles]}get max(){return this._max}set max(next){const old=this._max;this._max=next==null?void 0:finiteCount(next),this.requestUpdate("max",old)}willUpdate(changed){super.willUpdate(changed),changed.has("size")&&!LYRA_SIZE_VALUES.includes(this.size)&&(this.size="m"),changed.has("shape")&&!LYRA_AVATAR_SHAPE_VALUES.includes(this.shape)&&(this.shape="circle"),changed.has("variant")&&!LYRA_VARIANT_VALUES.includes(this.variant)&&(this.variant="neutral"),this.hasUpdated?changed.has("max")&&this.recomputeWindow():this.seedFirstRenderState(()=>{this.assignedAvatars=Object.freeze(Array.from(this.children).filter(element=>this.isAvatar(element))),this.recomputeWindow()})}firstUpdated(changed){super.firstUpdated(changed);const slot=this.avatarsSlot;queueMicrotask(()=>{collectInitialSlotAssignment(slot,s=>this.onSlotChangeFromSlot(s))})}connectedCallback(){if(super.connectedCallback(),!this.hasUpdated)return;const slot=this.renderRoot.querySelector("slot");slot?.localName==="slot"&&this.reconcileAvatars(slot.assignedElements({flatten:!0}))}updated(changed){super.updated(changed),this.connectAvatarObserver(this.assignedAvatars),this.applyGroupDefaults(),this.applyVisibilityMarkers()}disconnectedCallback(){this.disconnectAvatarObserver(),this.restoreOwnedState(),super.disconnectedCallback()}adoptedCallback(){if(super.adoptedCallback(),this.disconnectAvatarObserver(),!this.isConnected)return;const slot=this.renderRoot.querySelector("slot");slot?.localName==="slot"&&this.reconcileAvatars(slot.assignedElements({flatten:!0}))}get hasOverflow(){const max=this.max;return max!=null&&this.eligibleAvatarCount>max}get hiddenCount(){return this.overflowHiddenAvatars.length}isAvatar(element){return element.localName===tag("avatar")}sameAvatars(a,b){return a.length===b.length&&a.every((avatar,index)=>avatar===b[index])}reconcileAvatars(elements){if(!this.isConnected)return;const next=Object.freeze(elements.filter(element=>this.isAvatar(element))),nextSet=new Set(next);for(const avatar of this.assignedAvatars)nextSet.has(avatar)||this.restoreAvatarState(avatar);this.assignedAvatars=next,this.connectAvatarObserver(next),this.applyGroupDefaults(),this.recomputeWindow(),this.applyVisibilityMarkers()}recomputeWindow(){const eligible=this.assignedAvatars.filter(avatar=>!avatar.hasAttribute("hidden")&&!avatar.hasAttribute("inert")),hidden=this.max==null?[]:eligible.slice(this.max);this.eligibleAvatarCount!==eligible.length&&(this.eligibleAvatarCount=eligible.length),this.sameAvatars(this.overflowHiddenAvatars,hidden)||(this.overflowHiddenAvatars=Object.freeze([...hidden]))}connectAvatarObserver(avatars){const ownerWindow=this.ownerDocument.defaultView;if(!ownerWindow||!!this.sameAvatars(this.observedAvatars,avatars)&&this.avatarObserverWindow===ownerWindow&&this.avatarObserver)return;this.disconnectAvatarObserver(),this.observedAvatars=Object.freeze([...avatars]),this.avatarObserverWindow=ownerWindow;const observer=new ownerWindow.MutationObserver(records=>{if(!(this.avatarObserver!==observer||!this.isConnected||this.ownerDocument.defaultView!==ownerWindow)){for(const record of records){const attribute=record.attributeName;if(!attribute||attribute!=="size"&&attribute!=="shape"&&attribute!=="variant"||!this.isAvatar(record.target))continue;const avatar=record.target;if(this.consumeOwnedAttributeWrite(avatar,attribute))continue;const ownership=this.defaultOwnership.get(avatar);ownership?.delete(attribute),ownership?.size===0&&this.defaultOwnership.delete(avatar)}this.applyGroupDefaults(),this.recomputeWindow(),this.applyVisibilityMarkers()}});this.avatarObserver=observer;for(const avatar of avatars)observer.observe(avatar,{attributes:!0,attributeFilter:["hidden","inert","size","shape","variant"]})}disconnectAvatarObserver(){this.avatarObserver?.disconnect();for(const avatar of this.observedAvatars)this.pendingOwnedAttributeWrites.delete(avatar);this.avatarObserver=void 0,this.avatarObserverWindow=void 0,this.observedAvatars=Object.freeze([])}markOwnedAttributeWrite(avatar,attribute){if(!this.avatarObserver||!this.observedAvatars.includes(avatar))return;let writes=this.pendingOwnedAttributeWrites.get(avatar);writes||(writes=new Map,this.pendingOwnedAttributeWrites.set(avatar,writes)),writes.set(attribute,(writes.get(attribute)??0)+1)}consumeOwnedAttributeWrite(avatar,attribute){const writes=this.pendingOwnedAttributeWrites.get(avatar),count=writes?.get(attribute)??0;return count===0?!1:(count===1?writes.delete(attribute):writes.set(attribute,count-1),writes.size===0&&this.pendingOwnedAttributeWrites.delete(avatar),!0)}applyGroupDefaults(){const values={size:this.size,shape:this.shape,variant:this.variant};for(const avatar of this.assignedAvatars){let ownership=this.defaultOwnership.get(avatar);for(const attribute of["size","shape","variant"]){const applied=ownership?.get(attribute);applied!=null&&avatar.getAttribute(attribute)!==applied&&ownership.delete(attribute),avatar.hasAttribute(attribute)?ownership?.has(attribute)&&avatar.getAttribute(attribute)===applied&&applied!==values[attribute]&&(ownership.set(attribute,values[attribute]),this.markOwnedAttributeWrite(avatar,attribute),avatar.setAttribute(attribute,values[attribute])):(ownership??=new Map,ownership.set(attribute,values[attribute]),this.markOwnedAttributeWrite(avatar,attribute),avatar.setAttribute(attribute,values[attribute]))}ownership?.size?this.defaultOwnership.set(avatar,ownership):this.defaultOwnership.delete(avatar)}}applyVisibilityMarkers(){const hidden=new Set(this.overflowHiddenAvatars),firstVisible=this.assignedAvatars.find(avatar=>!avatar.hasAttribute("hidden")&&!avatar.hasAttribute("inert")&&!hidden.has(avatar));for(const avatar of this.assignedAvatars)hidden.has(avatar)?avatar.setAttribute("data-lr-avatar-group-hidden",""):avatar.removeAttribute("data-lr-avatar-group-hidden"),avatar===firstVisible?avatar.setAttribute("data-lr-avatar-group-first",""):avatar.removeAttribute("data-lr-avatar-group-first")}restoreAvatarState(avatar){avatar.removeAttribute("data-lr-avatar-group-hidden"),avatar.removeAttribute("data-lr-avatar-group-first");const ownership=this.defaultOwnership.get(avatar);if(ownership){for(const[attribute,applied]of ownership)avatar.getAttribute(attribute)===applied&&avatar.removeAttribute(attribute);this.defaultOwnership.delete(avatar)}}restoreOwnedState(){for(const avatar of this.assignedAvatars)this.restoreAvatarState(avatar);this.assignedAvatars=Object.freeze([]),this.overflowHiddenAvatars=Object.freeze([]),this.eligibleAvatarCount=0}onSlotChangeFromSlot(slot){this.updateBrowserDerivedState(()=>{this.isConnected&&this.reconcileAvatars(slot.assignedElements({flatten:!0}))})}render(){const overflowing=this.hasOverflow,hiddenCount=this.hiddenCount,badgeIsFirstVisible=overflowing&&hiddenCount===this.eligibleAvatarCount,accessibleLabel=hostAriaLabel(this)??(this.label||nothing),localizedHiddenCount=getNumberFormat(this.effectiveLocale).format(hiddenCount);return html`
|
|
2
2
|
<div part="base" role="group" aria-label=${accessibleLabel}>
|
|
3
3
|
<slot @slotchange=${this.onSlotChange}></slot>
|
|
4
4
|
${overflowing?html`<button
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import{__decorate}from"tslib";import{eventCollectionSupport}from"../../../internal/collection-snapshot.js";import{html,nothing}from"lit";import{property,state}from"lit/decorators.js";import{LyraElement}from"../../../internal/lyra-element.js";import{srOnly}from"../../../internal/a11y.js";import{acquireAnnouncementSink}from"../../../internal/announcer.js";import{attachInternalsSafely}from"../../../internal/element-internals.js";import{setCustomState}from"../../../internal/custom-states.js";import{getNumberFormat}from"../../../internal/intl-cache.js";import{fileIcon}from"../../../internal/icons.js";import{falseDefaultBooleanConverter}from"../../../internal/converters.js";import{DropSessionController}from"../../../internal/drop-session-controller.js";import{classifyFiles,EMPTY_MIME_TYPES,freezeDetail,handleDrop,mimeTypeFilter,outcomeText,snapshotMimeTypes}from"../file-input/file-intake.js";import{styles}from"./drop-zone.styles.js";import{
|
|
1
|
+
import{__decorate}from"tslib";import{eventCollectionSupport}from"../../../internal/collection-snapshot.js";import{html,nothing}from"lit";import{property,state}from"lit/decorators.js";import{LyraElement}from"../../../internal/lyra-element.js";import{srOnly}from"../../../internal/a11y.js";import{acquireAnnouncementSink}from"../../../internal/announcer.js";import{attachInternalsSafely}from"../../../internal/element-internals.js";import{setCustomState}from"../../../internal/custom-states.js";import{getNumberFormat}from"../../../internal/intl-cache.js";import{fileIcon}from"../../../internal/icons.js";import{falseDefaultBooleanConverter}from"../../../internal/converters.js";import{DropSessionController}from"../../../internal/drop-session-controller.js";import{classifyFiles,EMPTY_MIME_TYPES,freezeDetail,handleDrop,mimeTypeFilter,outcomeText,snapshotMimeTypes}from"../file-input/file-intake.js";import{styles}from"./drop-zone.styles.js";import{LYRA_DEFAULT_dropzoneRejectedType,LYRA_DEFAULT_dropzoneReleaseToAdd,LYRA_DEFAULT_fileInputAcceptedMany,LYRA_DEFAULT_fileInputAcceptedOne,LYRA_DEFAULT_fileInputFolderRejected,LYRA_DEFAULT_fileInputRejectedCount,LYRA_DEFAULT_fileInputRejectedLimit,LYRA_DEFAULT_fileInputRejectedMany,LYRA_DEFAULT_fileInputRejectedMaxFiles,LYRA_DEFAULT_fileInputRejectedMaxTotalSize,LYRA_DEFAULT_fileInputRejectedOne,LYRA_DEFAULT_fileInputRejectedRead,LYRA_DEFAULT_fileInputRejectedSize,LYRA_DEFAULT_fileInputRejectedType}from"../../../internal/default-strings/media.generated.js";import{LYRA_DEFAULT_collapse,LYRA_DEFAULT_copy,LYRA_DEFAULT_date,LYRA_DEFAULT_details,LYRA_DEFAULT_loading,LYRA_DEFAULT_map,LYRA_DEFAULT_navigation,LYRA_DEFAULT_open,LYRA_DEFAULT_search,LYRA_DEFAULT_select}from"../../../internal/default-strings/shared.generated.js";class LyraDropZone extends LyraElement{static{this.defaultStrings={...super.defaultStrings,collapse:LYRA_DEFAULT_collapse,copy:LYRA_DEFAULT_copy,date:LYRA_DEFAULT_date,details:LYRA_DEFAULT_details,dropzoneRejectedType:LYRA_DEFAULT_dropzoneRejectedType,dropzoneReleaseToAdd:LYRA_DEFAULT_dropzoneReleaseToAdd,fileInputAcceptedMany:LYRA_DEFAULT_fileInputAcceptedMany,fileInputAcceptedOne:LYRA_DEFAULT_fileInputAcceptedOne,fileInputFolderRejected:LYRA_DEFAULT_fileInputFolderRejected,fileInputRejectedCount:LYRA_DEFAULT_fileInputRejectedCount,fileInputRejectedLimit:LYRA_DEFAULT_fileInputRejectedLimit,fileInputRejectedMany:LYRA_DEFAULT_fileInputRejectedMany,fileInputRejectedMaxFiles:LYRA_DEFAULT_fileInputRejectedMaxFiles,fileInputRejectedMaxTotalSize:LYRA_DEFAULT_fileInputRejectedMaxTotalSize,fileInputRejectedOne:LYRA_DEFAULT_fileInputRejectedOne,fileInputRejectedRead:LYRA_DEFAULT_fileInputRejectedRead,fileInputRejectedSize:LYRA_DEFAULT_fileInputRejectedSize,fileInputRejectedType:LYRA_DEFAULT_fileInputRejectedType,loading:LYRA_DEFAULT_loading,map:LYRA_DEFAULT_map,navigation:LYRA_DEFAULT_navigation,open:LYRA_DEFAULT_open,search:LYRA_DEFAULT_search,select:LYRA_DEFAULT_select}}static{this.collectionSupport=eventCollectionSupport}static{this.immutableEventDetails=Object.freeze(["lr-files"])}static{this.styles=[LyraElement.styles,styles,srOnly]}constructor(){super(),this.disabled=!1,this.multiple=!1,this.accept="",this.allowedMimeTypes=EMPTY_MIME_TYPES,this.forbiddenMimeTypes=EMPTY_MIME_TYPES,this.maxFileSize=0,this.maxFiles=0,this.maxTotalSize=0,this.heldFileCount=0,this.heldTotalSize=0,this.size="m",this.dragState="default",this.rejectedFiles=Object.freeze([]),this.resultStatus="",this.announcementsArmed=!1,this.onDragEnter=e=>this.dropSession.onDragEnter(e),this.onDragOver=e=>this.dropSession.onDragOver(e),this.onDragLeave=e=>this.dropSession.onDragLeave(e),this.onDrop=e=>handleDrop(this,this.dropSession,e,this.multiple,(files,rejected)=>this.emitFiles(files,rejected)),this.internals=attachInternalsSafely(this),this.dropSession=new DropSessionController(this,{isDisabled:()=>this.disabled,previewRejects:items=>this.classify(items,!0).rejected.length>0,onStateChange:()=>{this.dragState=this.dropSession.state,setCustomState(this.internals,"dragging",this.dropSession.dragging)}})}get dragging(){return this.dragState!=="default"}willUpdate(changed){super.willUpdate(changed),changed.has("disabled")&&this.disabled&&this.dropSession.reset()}connectedCallback(){super.connectedCallback(),this.politeSink??=acquireAnnouncementSink("polite",{document:this.ownerDocument,source:this}),this.assertiveSink??=acquireAnnouncementSink("assertive",{document:this.ownerDocument,source:this})}disconnectedCallback(){this.politeSink?.release(),this.politeSink=void 0,this.assertiveSink?.release(),this.assertiveSink=void 0,this.announcementsArmed=!1,super.disconnectedCallback()}updated(changed){super.updated(changed),this.announcementsArmed&&(changed.has("dragState")&&this.dragState!=="default"&&this.politeSink?.announce(this.overlayText()),changed.has("resultStatus")&&this.resultStatus&&this.politeSink?.announce(this.resultStatus),changed.has("rejectedFiles")&&this.rejectedFiles.length>0&&this.assertiveSink?.announce(this.rejectedFiles.map(rejected=>this.rejectionMessage(rejected)).join(" "))),this.announcementsArmed=!0}classify(fileList,isPreview=!1){return classifyFiles(this,fileList,this.multiple,[],isPreview,mimeTypeFilter(snapshotMimeTypes(this.allowedMimeTypes),snapshotMimeTypes(this.forbiddenMimeTypes)))}rejectionMessage(rejected){const filename=rejected.file.name;switch(rejected.reason){case"type":return this.localize("fileInputRejectedType",void 0,{filename});case"size":return this.localize("fileInputRejectedSize",void 0,{filename});case"count":return this.localize("fileInputRejectedCount",void 0,{filename});case"directory":return this.localize("fileInputFolderRejected",void 0,{filename});case"read":return this.localize("fileInputRejectedRead",void 0,{filename});case"limit":return this.localize("fileInputRejectedLimit",void 0,{filename});case"maxFiles":return this.localize("fileInputRejectedMaxFiles",void 0,{filename});case"maxTotalSize":return this.localize("fileInputRejectedMaxTotalSize",void 0,{filename})}}emitFiles(fileList,additionalRejected=[]){const detail=freezeDetail(this.classify(fileList),additionalRejected),{files,rejected}=detail;this.rejectedFiles=rejected;const messages=[],numberFormat=getNumberFormat(this.effectiveLocale);if(files.length){const count=numberFormat.format(files.length),key=files.length===1?"fileInputAcceptedOne":"fileInputAcceptedMany";messages.push(outcomeText(this.acceptedMessage,()=>this.localize(key,void 0,{count}),count))}if(rejected.length){const count=numberFormat.format(rejected.length),key=rejected.length===1?"fileInputRejectedOne":"fileInputRejectedMany";messages.push(outcomeText(this.rejectedMessage,()=>this.localize(key,void 0,{count}),count))}this.resultStatus=messages.filter(message=>message.length>0).join(" "),this.emit("lr-files",detail)}overlayText(){return this.dragState==="accept"?this.localize("dropzoneReleaseToAdd"):this.dragState==="reject"?this.localize("dropzoneRejectedType"):""}statusText(){return this.dragState==="default"?this.resultStatus:this.overlayText()}render(){return html`
|
|
2
2
|
<div
|
|
3
3
|
part="base"
|
|
4
4
|
@dragenter=${this.onDragEnter}
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import{__decorate}from"tslib";import{html,nothing}from"lit";import{property}from"lit/decorators.js";import{hostAriaLabel}from"../../../internal/a11y.js";import{fileIcon}from"../../../internal/icons.js";import{LyraElement}from"../../../internal/lyra-element.js";import{formatFileSize,FILE_SIZE_UNIT_KEYS,localizedNumberLabel}from"../attachment-chip/file-size.js";import{finiteRange}from"../../../internal/numbers.js";import{literalSetConverter}from"../../../internal/converters.js";import{defaultFileTypeMetadataRegistry}from"./file-type-metadata.js";import{usesFileNameFallback}from"./mime-type.js";import{styles}from"./file-icon.styles.js";import{
|
|
1
|
+
import{__decorate}from"tslib";import{html,nothing}from"lit";import{property}from"lit/decorators.js";import{hostAriaLabel}from"../../../internal/a11y.js";import{fileIcon}from"../../../internal/icons.js";import{LyraElement}from"../../../internal/lyra-element.js";import{formatFileSize,FILE_SIZE_UNIT_KEYS,localizedNumberLabel}from"../attachment-chip/file-size.js";import{finiteRange}from"../../../internal/numbers.js";import{literalSetConverter}from"../../../internal/converters.js";import{defaultFileTypeMetadataRegistry}from"./file-type-metadata.js";import{usesFileNameFallback}from"./mime-type.js";import{styles}from"./file-icon.styles.js";import{LYRA_DEFAULT_fileTypeArchive,LYRA_DEFAULT_fileTypeAudio,LYRA_DEFAULT_fileTypeCode,LYRA_DEFAULT_fileTypeFile,LYRA_DEFAULT_fileTypeImage,LYRA_DEFAULT_fileTypePdf,LYRA_DEFAULT_fileTypePresentation,LYRA_DEFAULT_fileTypeSpreadsheet,LYRA_DEFAULT_fileTypeText,LYRA_DEFAULT_fileTypeVideo,LYRA_DEFAULT_fileTypeWithSize,LYRA_DEFAULT_fileTypeWord}from"../../../internal/default-strings/media.generated.js";import{LYRA_DEFAULT_collapse,LYRA_DEFAULT_details,LYRA_DEFAULT_fileSizeUnitB,LYRA_DEFAULT_fileSizeUnitGb,LYRA_DEFAULT_fileSizeUnitKb,LYRA_DEFAULT_fileSizeUnitMb,LYRA_DEFAULT_fileSizeUnitTb,LYRA_DEFAULT_map,LYRA_DEFAULT_navigation,LYRA_DEFAULT_open,LYRA_DEFAULT_search,LYRA_DEFAULT_select}from"../../../internal/default-strings/shared.generated.js";const ICON_LABELS={file:"fileTypeFile",pdf:"fileTypePdf",word:"fileTypeWord",spreadsheet:"fileTypeSpreadsheet",presentation:"fileTypePresentation",text:"fileTypeText",code:"fileTypeCode",archive:"fileTypeArchive",image:"fileTypeImage",audio:"fileTypeAudio",video:"fileTypeVideo"},FILE_ICON_MODE=literalSetConverter(["icon","label"],"icon");function qualifyingToken(value){if(typeof value!="string")return"";const token=value.trim().replace(/^\./,"").toLowerCase();return/^(?=[a-z0-9+]*[a-z])[a-z0-9+]{1,4}$/.test(token)?token.toUpperCase():""}function fileNameExtension(value){if(typeof value!="string")return"";const segment=value.trim().split(/[\\/]/).pop()??"",dot=segment.lastIndexOf(".");return dot>0?qualifyingToken(segment.slice(dot+1)):""}function badgeToken(metadata,mimeType,name){const abbreviation=typeof metadata.abbreviation=="string"?metadata.abbreviation.trim():"";if(abbreviation)return abbreviation;const nameExtension=usesFileNameFallback(mimeType)?fileNameExtension(name):"",extensions=Array.isArray(metadata.extensions)?metadata.extensions:[];if(nameExtension&&extensions.some(extension=>qualifyingToken(extension)===nameExtension))return nameExtension;const firstExtension=extensions.map(qualifyingToken).find(Boolean)??"";return firstExtension||nameExtension}function estimatedTokenEm(token){let em=0;for(const char of token)em+=/[MW]/.test(char)?.97:/[DGHNOQU]/.test(char)?.82:/[AV]/.test(char)?.78:/[IJ]/.test(char)?.4:/[A-Z0-9+]/.test(char)?.7:1;return em}class LyraFileIcon extends LyraElement{constructor(){super(...arguments),this.mimeType="",this.name="",this.bytes=0,this.decorative=!1,this._mode="icon",this.registry=defaultFileTypeMetadataRegistry}static{this.defaultStrings={...super.defaultStrings,collapse:LYRA_DEFAULT_collapse,details:LYRA_DEFAULT_details,fileSizeUnitB:LYRA_DEFAULT_fileSizeUnitB,fileSizeUnitGb:LYRA_DEFAULT_fileSizeUnitGb,fileSizeUnitKb:LYRA_DEFAULT_fileSizeUnitKb,fileSizeUnitMb:LYRA_DEFAULT_fileSizeUnitMb,fileSizeUnitTb:LYRA_DEFAULT_fileSizeUnitTb,fileTypeArchive:LYRA_DEFAULT_fileTypeArchive,fileTypeAudio:LYRA_DEFAULT_fileTypeAudio,fileTypeCode:LYRA_DEFAULT_fileTypeCode,fileTypeFile:LYRA_DEFAULT_fileTypeFile,fileTypeImage:LYRA_DEFAULT_fileTypeImage,fileTypePdf:LYRA_DEFAULT_fileTypePdf,fileTypePresentation:LYRA_DEFAULT_fileTypePresentation,fileTypeSpreadsheet:LYRA_DEFAULT_fileTypeSpreadsheet,fileTypeText:LYRA_DEFAULT_fileTypeText,fileTypeVideo:LYRA_DEFAULT_fileTypeVideo,fileTypeWithSize:LYRA_DEFAULT_fileTypeWithSize,fileTypeWord:LYRA_DEFAULT_fileTypeWord,map:LYRA_DEFAULT_map,navigation:LYRA_DEFAULT_navigation,open:LYRA_DEFAULT_open,search:LYRA_DEFAULT_search,select:LYRA_DEFAULT_select}}static{this.styles=[LyraElement.styles,styles]}get mode(){return this._mode}set mode(next){const normalized=FILE_ICON_MODE.normalizeReflected(this,"mode",next),old=this._mode;old!==normalized&&(this._mode=normalized,this.requestUpdate("mode",old))}resolveMetadata(){try{if(this.registry&&typeof this.registry.resolve=="function")return this.registry.resolve(this.mimeType,this.name)}catch{}return defaultFileTypeMetadataRegistry.resolve("","")}render(){const metadata=this.resolveMetadata(),metadataLabel=metadata.provenance==="consumer"?metadata.label:this.localize(ICON_LABELS[metadata.icon]),renderedLabel=this.label??metadataLabel,bytes=finiteRange(this.bytes,0,0),sizeText=bytes>0?formatFileSize(bytes,unit=>this.localize(FILE_SIZE_UNIT_KEYS[unit]),localizedNumberLabel(this.effectiveLocale)):"",accessibleNameBase=renderedLabel||metadataLabel,fallbackLabel=sizeText?this.localize("fileTypeWithSize",void 0,{label:accessibleNameBase,size:sizeText}):accessibleNameBase,accessibleLabel=hostAriaLabel(this)??fallbackLabel;let token="";try{token=badgeToken(metadata,this.mimeType,this.name)}catch{}const tokenTier=token===""?"none":estimatedTokenEm(token)<=2.4?"short":"long",descriptionId=this.mode==="label"&&metadata.provenance==="consumer"&&metadata.description?"metadata-description":void 0;return html`
|
|
2
2
|
<span
|
|
3
3
|
part="base"
|
|
4
4
|
role=${this.decorative?"presentation":"img"}
|