@ds-mo/ui 15.4.0 → 15.5.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/NOTICE +7 -1
- package/dist/.package-ready.json +1 -1
- package/dist/agent-patterns.json +1 -1
- package/dist/agent.json +64 -8
- package/dist/angular/boolean-value-accessor.js +3 -3
- package/dist/angular/ds-agent-activity.js +3 -3
- package/dist/angular/ds-agent-questionnaire.js +3 -3
- package/dist/angular/ds-agent-response.js +3 -3
- package/dist/angular/ds-agent-source-list.js +3 -3
- package/dist/angular/ds-agent-tool-call.js +3 -3
- package/dist/angular/ds-attachment-list.js +3 -3
- package/dist/angular/ds-avatar.js +3 -3
- package/dist/angular/ds-badge.js +3 -3
- package/dist/angular/ds-banner.js +3 -3
- package/dist/angular/ds-bar-action.js +3 -3
- package/dist/angular/ds-bar-nav.js +3 -3
- package/dist/angular/ds-bar-page-title.js +3 -3
- package/dist/angular/ds-bar-title.js +3 -3
- package/dist/angular/ds-bar-workflow.js +3 -3
- package/dist/angular/ds-breadcrumb.js +3 -3
- package/dist/angular/ds-button-filled.js +3 -3
- package/dist/angular/ds-button-inverted.js +3 -3
- package/dist/angular/ds-button-unfilled.js +3 -3
- package/dist/angular/ds-calendar.js +3 -3
- package/dist/angular/ds-card-action-center.js +3 -3
- package/dist/angular/ds-card-chart.js +3 -3
- package/dist/angular/ds-card-navigation.js +3 -3
- package/dist/angular/ds-card-overview.js +3 -3
- package/dist/angular/ds-card-setting.js +3 -3
- package/dist/angular/ds-card-settings-scope.js +3 -3
- package/dist/angular/ds-chart-legend.js +3 -3
- package/dist/angular/ds-chart.js +3 -3
- package/dist/angular/ds-checkbox-group.js +3 -3
- package/dist/angular/ds-checkbox.d.ts +1 -1
- package/dist/angular/ds-checkbox.js +5 -5
- package/dist/angular/ds-chip.js +3 -3
- package/dist/angular/ds-code-block.js +3 -3
- package/dist/angular/ds-conversation-list-item.js +3 -3
- package/dist/angular/ds-conversation-list-section.js +3 -3
- package/dist/angular/ds-conversation-list.js +3 -3
- package/dist/angular/ds-data-customize.js +3 -3
- package/dist/angular/ds-data-filter.js +3 -3
- package/dist/angular/ds-data-group.js +3 -3
- package/dist/angular/ds-data-preferences.js +3 -3
- package/dist/angular/ds-data-saved-views.js +3 -3
- package/dist/angular/ds-data-search.js +3 -3
- package/dist/angular/ds-data-sort.js +3 -3
- package/dist/angular/ds-data-toolbar.js +3 -3
- package/dist/angular/ds-divider.js +3 -3
- package/dist/angular/ds-empty-state.js +3 -3
- package/dist/angular/ds-field.js +3 -3
- package/dist/angular/ds-filter-menu.js +3 -3
- package/dist/angular/ds-icon.js +3 -3
- package/dist/angular/ds-inline-banner-settings.js +3 -3
- package/dist/angular/ds-input-date.js +3 -3
- package/dist/angular/ds-input-time.js +3 -3
- package/dist/angular/ds-input.js +3 -3
- package/dist/angular/ds-loader.js +3 -3
- package/dist/angular/ds-map-cluster-marker.js +3 -3
- package/dist/angular/ds-map-entity-marker.js +3 -3
- package/dist/angular/ds-markdown.js +3 -3
- package/dist/angular/ds-menu.js +3 -3
- package/dist/angular/ds-message-actions.js +3 -3
- package/dist/angular/ds-message-bubble.js +3 -3
- package/dist/angular/ds-message-composer.js +3 -3
- package/dist/angular/ds-message-scroller.js +3 -3
- package/dist/angular/ds-message.js +3 -3
- package/dist/angular/ds-mobile-bar-nav.js +3 -3
- package/dist/angular/ds-mobile-header.js +3 -3
- package/dist/angular/ds-mobile-section-switcher.js +3 -3
- package/dist/angular/ds-mobile-sheet-nav.js +3 -3
- package/dist/angular/ds-modal.js +3 -3
- package/dist/angular/ds-pagination.js +3 -3
- package/dist/angular/ds-panel-nav.js +3 -3
- package/dist/angular/ds-panel-sub-nav.js +3 -3
- package/dist/angular/ds-panel-tool-header.js +3 -3
- package/dist/angular/ds-panel-tool-search.js +3 -3
- package/dist/angular/ds-panel-tools.js +3 -3
- package/dist/angular/ds-paper-texture.js +3 -3
- package/dist/angular/ds-radio-tile.js +3 -3
- package/dist/angular/ds-radio.js +3 -3
- package/dist/angular/ds-score.js +3 -3
- package/dist/angular/ds-scroll-overlay.js +3 -3
- package/dist/angular/ds-select.d.ts +1 -1
- package/dist/angular/ds-select.js +5 -5
- package/dist/angular/ds-setting-row-checkbox.js +3 -3
- package/dist/angular/ds-setting-row-radio.js +3 -3
- package/dist/angular/ds-setting-row-toggle.js +3 -3
- package/dist/angular/ds-shell-app.js +3 -3
- package/dist/angular/ds-shell-page.js +3 -3
- package/dist/angular/ds-shell-tools.js +3 -3
- package/dist/angular/ds-skeleton.js +3 -3
- package/dist/angular/ds-slider.js +3 -3
- package/dist/angular/ds-swatch-picker.js +3 -3
- package/dist/angular/ds-switch.js +3 -3
- package/dist/angular/ds-tab-group.js +3 -3
- package/dist/angular/ds-table.d.ts +7 -1
- package/dist/angular/ds-table.js +13 -7
- package/dist/angular/ds-tag.js +3 -3
- package/dist/angular/ds-text.js +3 -3
- package/dist/angular/ds-textarea.js +3 -3
- package/dist/angular/ds-time-picker.js +3 -3
- package/dist/angular/ds-toast.js +3 -3
- package/dist/angular/ds-tooltip-chart.js +3 -3
- package/dist/angular/ds-tooltip.js +3 -3
- package/dist/angular/ds-typing-indicator.js +3 -3
- package/dist/angular/number-value-accessor.js +3 -3
- package/dist/angular/radio-value-accessor.js +3 -3
- package/dist/angular/select-value-accessor.js +3 -3
- package/dist/angular/text-value-accessor.js +3 -3
- package/dist/angular/value-accessor.js +3 -3
- package/dist/components/THIRD-PARTY-NOTICES +1791 -0
- package/dist/components/bundled-dependencies.json +478 -0
- package/dist/components/ds-agent-activity.js +1 -1
- package/dist/components/ds-agent-questionnaire.js +1 -1
- package/dist/components/ds-agent-response.js +1 -1
- package/dist/components/ds-agent-source-list.js +1 -1
- package/dist/components/ds-agent-tool-call.js +1 -1
- package/dist/components/ds-attachment-list.js +1 -1
- package/dist/components/ds-avatar.js +1 -1
- package/dist/components/ds-banner.js +1 -1
- package/dist/components/ds-banner.js.map +1 -1
- package/dist/components/ds-bar-nav.js +1 -1
- package/dist/components/ds-bar-page-title.js +1 -1
- package/dist/components/ds-bar-title.js +1 -1
- package/dist/components/ds-bar-workflow.js +1 -1
- package/dist/components/ds-breadcrumb.js +1 -1
- package/dist/components/ds-button-filled.js +1 -1
- package/dist/components/ds-button-inverted.js +1 -1
- package/dist/components/ds-button-unfilled.js +1 -1
- package/dist/components/ds-calendar.js +1 -1
- package/dist/components/ds-card-action-center.js +1 -1
- package/dist/components/ds-card-chart.js +1 -1
- package/dist/components/ds-card-navigation.js +1 -1
- package/dist/components/ds-card-overview.js +1 -1
- package/dist/components/ds-card-overview.js.map +1 -1
- package/dist/components/ds-card-setting.js +1 -1
- package/dist/components/ds-chart-legend.js +1 -1
- package/dist/components/ds-chart-legend.js.map +1 -1
- package/dist/components/ds-chart.js +1 -1
- package/dist/components/ds-chart.js.map +1 -1
- package/dist/components/ds-checkbox.js +1 -1
- package/dist/components/ds-chip.js +1 -1
- package/dist/components/ds-code-block.js +1 -1
- package/dist/components/ds-conversation-list.js +1 -1
- package/dist/components/ds-conversation-list.js.map +1 -1
- package/dist/components/ds-data-customize.js +1 -1
- package/dist/components/ds-data-filter.js +1 -1
- package/dist/components/ds-data-group.js +1 -1
- package/dist/components/ds-data-preferences.js +1 -1
- package/dist/components/ds-data-preferences.js.map +1 -1
- package/dist/components/ds-data-saved-views.js +1 -1
- package/dist/components/ds-data-search.js +1 -1
- package/dist/components/ds-data-sort.js +1 -1
- package/dist/components/ds-data-toolbar.js +1 -1
- package/dist/components/ds-divider.js +1 -1
- package/dist/components/ds-empty-state.js +1 -1
- package/dist/components/ds-filter-menu.js +1 -1
- package/dist/components/ds-icon.js +1 -1
- package/dist/components/ds-input-date.js +1 -1
- package/dist/components/ds-input-date.js.map +1 -1
- package/dist/components/ds-input-time.js +1 -1
- package/dist/components/ds-input-time.js.map +1 -1
- package/dist/components/ds-input.js +1 -1
- package/dist/components/ds-map-entity-marker.js +1 -1
- package/dist/components/ds-markdown.js +1 -1
- package/dist/components/ds-menu.js +1 -1
- package/dist/components/ds-message-actions.js +1 -1
- package/dist/components/ds-message-bubble.js +1 -1
- package/dist/components/ds-message-composer.js +1 -1
- package/dist/components/ds-message-scroller.js +1 -1
- package/dist/components/ds-message.js +1 -1
- package/dist/components/ds-mobile-bar-nav.js +1 -1
- package/dist/components/ds-mobile-header.js +1 -1
- package/dist/components/ds-mobile-section-switcher.js +1 -1
- package/dist/components/ds-mobile-sheet-nav.js +1 -1
- package/dist/components/ds-modal.js +1 -1
- package/dist/components/ds-pagination.js +1 -1
- package/dist/components/ds-panel-nav.js +1 -1
- package/dist/components/ds-panel-sub-nav.js +1 -1
- package/dist/components/ds-panel-tool-header.js +1 -1
- package/dist/components/ds-panel-tool-search.js +1 -1
- package/dist/components/ds-panel-tools.js +1 -1
- package/dist/components/ds-radio-tile.js +1 -1
- package/dist/components/ds-radio-tile.js.map +1 -1
- package/dist/components/ds-radio.js +1 -1
- package/dist/components/ds-scroll-overlay.js +1 -1
- package/dist/components/ds-scroll-overlay.js.map +1 -1
- package/dist/components/ds-select.js +1 -1
- package/dist/components/ds-setting-row-toggle.js +1 -1
- package/dist/components/ds-shell-app.js +1 -1
- package/dist/components/ds-shell-app.js.map +1 -1
- package/dist/components/ds-shell-page.js +1 -1
- package/dist/components/ds-shell-tools.js +1 -1
- package/dist/components/ds-slider.js +1 -1
- package/dist/components/ds-slider.js.map +1 -1
- package/dist/components/ds-switch.js +1 -1
- package/dist/components/ds-tab-group.js +1 -1
- package/dist/components/ds-table.js +1 -1
- package/dist/components/ds-table.js.map +1 -1
- package/dist/components/ds-tag.js +1 -1
- package/dist/components/ds-textarea.js +1 -1
- package/dist/components/ds-textarea.js.map +1 -1
- package/dist/components/ds-time-picker.js +1 -1
- package/dist/components/ds-toast.js +1 -1
- package/dist/components/ds-tooltip-chart.js +1 -1
- package/dist/components/ds-tooltip.js +1 -1
- package/dist/components/p--STJbKuN.js +2 -0
- package/dist/components/p--STJbKuN.js.map +1 -0
- package/dist/components/{p-Co1rUdOR.js → p--pJyciTI.js} +2 -2
- package/dist/components/p--pJyciTI.js.map +1 -0
- package/dist/components/p-02k7d7BH.js +2 -0
- package/dist/components/p-02k7d7BH.js.map +1 -0
- package/dist/components/{p-CZNZTcYS.js → p-5-gQbIIz.js} +2 -2
- package/dist/components/{p-DRdoGSGX.js → p-7MwoWtTJ.js} +2 -2
- package/dist/components/p-B0uO3-Dp.js +2 -0
- package/dist/components/p-B0uO3-Dp.js.map +1 -0
- package/dist/components/p-B6TX55c5.js +2 -0
- package/dist/components/p-B6TX55c5.js.map +1 -0
- package/dist/components/p-B95UP66y.js +2 -0
- package/dist/components/p-B95UP66y.js.map +1 -0
- package/dist/components/p-BGSG6xIS.js +2 -0
- package/dist/components/p-BGSG6xIS.js.map +1 -0
- package/dist/components/p-BNarCFJZ.js +2 -0
- package/dist/components/p-BNarCFJZ.js.map +1 -0
- package/dist/components/{p-DJDbskZf.js → p-BO5URdZF.js} +2 -2
- package/dist/components/{p-DmSnHVW6.js → p-BVxK8ce0.js} +2 -2
- package/dist/components/{p-B0EpvBDs.js → p-BYeG0b5N.js} +2 -2
- package/dist/components/p-BcpIK9S6.js +2 -0
- package/dist/components/p-BcpIK9S6.js.map +1 -0
- package/dist/components/p-Bf-BphXP.js +2 -0
- package/dist/components/p-Bf-BphXP.js.map +1 -0
- package/dist/components/{p-Bk3poU91.js → p-BmIllmq2.js} +2 -2
- package/dist/components/p-BmIllmq2.js.map +1 -0
- package/dist/components/p-Bq_ypMSy.js +2 -0
- package/dist/components/p-Bq_ypMSy.js.map +1 -0
- package/dist/components/p-ByLH5RAD.js +2 -0
- package/dist/components/p-ByLH5RAD.js.map +1 -0
- package/dist/components/{p-DzvTC27M.js → p-C1ZfBbJ_.js} +2 -2
- package/dist/components/p-C1ZfBbJ_.js.map +1 -0
- package/dist/components/p-C1oczmAc.js +2 -0
- package/dist/components/p-C1oczmAc.js.map +1 -0
- package/dist/components/p-C5BBIDVm.js +2 -0
- package/dist/components/p-C5BBIDVm.js.map +1 -0
- package/dist/components/{p-CJ1NnOEW.js → p-CA3iQ1ME.js} +2 -2
- package/dist/components/p-CE6MaXBg.js +2 -0
- package/dist/components/p-CE6MaXBg.js.map +1 -0
- package/dist/components/p-CXGjCWSh.js +2 -0
- package/dist/components/p-CXGjCWSh.js.map +1 -0
- package/dist/components/{p-DYQa1DVF.js → p-C_9VGgPf.js} +2 -2
- package/dist/components/p-CbrDF2gA.js +2 -0
- package/dist/components/p-CbrDF2gA.js.map +1 -0
- package/dist/components/{p-7TVdPhGR.js → p-CgQB8Ct5.js} +2 -2
- package/dist/components/{p-D6FRqNhN.js → p-D-J7GgjY.js} +2 -2
- package/dist/components/{p-DSZPO06T.js → p-D9_iDlkT.js} +2 -2
- package/dist/components/{p-BwdnVqAY.js → p-DEYCF-oJ.js} +2 -2
- package/dist/components/p-DGVZhrMd.js +2 -0
- package/dist/components/p-DGVZhrMd.js.map +1 -0
- package/dist/components/{p-C8V4lkVy.js → p-DKGW3gRa.js} +2 -2
- package/dist/components/p-DPFg5d4_.js +2 -0
- package/dist/components/p-DPFg5d4_.js.map +1 -0
- package/dist/components/{p-C4huuwed.js → p-DR_8IPn9.js} +2 -2
- package/dist/components/p-DXL5D30P.js +2 -0
- package/dist/components/p-DXL5D30P.js.map +1 -0
- package/dist/components/{p-B0BQCVkq.js → p-D_iZPukF.js} +2 -2
- package/dist/components/{p-JBki_jyY.js → p-DfMTDFcE.js} +2 -2
- package/dist/components/{p-MOJmB6vX.js → p-Dg6hnCc2.js} +2 -2
- package/dist/components/{p-DXk1eml1.js → p-DjbT9kKm.js} +2 -2
- package/dist/components/p-Dka0lUI_.js +2 -0
- package/dist/components/p-Dka0lUI_.js.map +1 -0
- package/dist/components/p-DlsjHRU3.js +2 -0
- package/dist/components/p-DlsjHRU3.js.map +1 -0
- package/dist/components/{p-_IqSPt5V.js → p-Dr5rkAhe.js} +2 -2
- package/dist/components/p-DuCCuJKI.js +2 -0
- package/dist/components/p-DuCCuJKI.js.map +1 -0
- package/dist/components/{p-DIQiHX0q.js → p-DvGrsLgt.js} +2 -2
- package/dist/components/{p-Doa2blZT.js → p-PtxCwf5S.js} +2 -2
- package/dist/components/p-PzYJqN8B.js +2 -0
- package/dist/components/p-PzYJqN8B.js.map +1 -0
- package/dist/components/p-S1Ct3FJV.js +2 -0
- package/dist/components/p-S1Ct3FJV.js.map +1 -0
- package/dist/components/p-YC7UM4jH.js +2 -0
- package/dist/components/p-YC7UM4jH.js.map +1 -0
- package/dist/components/{p-B9TM6FqC.js → p-d76Ry5nh.js} +2 -2
- package/dist/components/p-ioGH5SoA.js +2 -0
- package/dist/components/p-ioGH5SoA.js.map +1 -0
- package/dist/components/p-jp7hwRtC.js +2 -0
- package/dist/components/p-jp7hwRtC.js.map +1 -0
- package/dist/components/{p-BFHpU-uU.js → p-kwS-vkau.js} +2 -2
- package/dist/components/{p-DjkUFlDW.js → p-pPtjNRqC.js} +3 -2
- package/dist/components/p-pPtjNRqC.js.map +1 -0
- package/dist/components/{p-B39iJO8F.js → p-rmPIcWED.js} +2 -2
- package/dist/components/p-t2Ebn8si.js +2 -0
- package/dist/components/p-t2Ebn8si.js.map +1 -0
- package/dist/components/p-wRhYxngW.js +2 -0
- package/dist/components/p-wRhYxngW.js.map +1 -0
- package/dist/docs/components.json +477 -82
- package/dist/lib/components/Icon/icon-cache.d.ts +6 -0
- package/dist/lib/utils/clock-time.d.ts +1 -0
- package/dist/lib/utils/date-filter-value.d.ts +2 -0
- package/dist/lib/utils/form-association.d.ts +2 -1
- package/dist/lib/utils/format-percentage.d.ts +1 -1
- package/dist/lib/utils/index.js +113 -93
- package/dist/lib/utils/index.js.map +4 -4
- package/dist/lib/utils/intl-formatters.d.ts +3 -0
- package/dist/lib/utils/resolve-css-length-px.d.ts +4 -3
- package/dist/lint/THIRD-PARTY-NOTICES +97 -40
- package/dist/lint/bundled-dependencies.json +162 -0
- package/dist/lint/index.js +1341 -1333
- package/dist/mcp/THIRD-PARTY-NOTICES +470 -0
- package/dist/mcp/bundled-dependencies.json +29 -0
- package/dist/mcp-data/registry/agent-tool-call.json +1 -1
- package/dist/mcp-data/registry/banner.json +1 -1
- package/dist/mcp-data/registry/bar-nav.json +1 -1
- package/dist/mcp-data/registry/bar-page-title.json +1 -1
- package/dist/mcp-data/registry/breadcrumb.json +1 -1
- package/dist/mcp-data/registry/calendar.json +4 -4
- package/dist/mcp-data/registry/card-overview.json +1 -1
- package/dist/mcp-data/registry/chart.json +3 -3
- package/dist/mcp-data/registry/checkbox.json +17 -1
- package/dist/mcp-data/registry/conversation-list.json +1 -1
- package/dist/mcp-data/registry/data-group.json +1 -1
- package/dist/mcp-data/registry/data-preferences.json +1 -1
- package/dist/mcp-data/registry/filter-menu.json +1 -1
- package/dist/mcp-data/registry/icon.json +6 -5
- package/dist/mcp-data/registry/input-date.json +1 -1
- package/dist/mcp-data/registry/input-time.json +1 -1
- package/dist/mcp-data/registry/markdown.json +1 -1
- package/dist/mcp-data/registry/menu.json +1 -1
- package/dist/mcp-data/registry/message.json +4 -4
- package/dist/mcp-data/registry/mobile-section-switcher.json +1 -1
- package/dist/mcp-data/registry/modal.json +1 -1
- package/dist/mcp-data/registry/panel-nav.json +1 -1
- package/dist/mcp-data/registry/radio-tile.json +1 -1
- package/dist/mcp-data/registry/radio.json +1 -1
- package/dist/mcp-data/registry/registry.json +63 -7
- package/dist/mcp-data/registry/scroll-overlay.json +1 -1
- package/dist/mcp-data/registry/select.json +70 -3
- package/dist/mcp-data/registry/shell-app.json +1 -1
- package/dist/mcp-data/registry/slider.json +3 -3
- package/dist/mcp-data/registry/switch.json +1 -1
- package/dist/mcp-data/registry/table.json +140 -14
- package/dist/mcp-data/registry/tooltip-chart.json +1 -1
- package/dist/react/ds-table.d.ts +3 -1
- package/dist/react/ds-table.js +2 -0
- package/dist/styles/table.css +405 -8
- package/dist/types/components/AgentToolCall/AgentToolCall.d.ts +3 -0
- package/dist/types/components/Banner/Banner.d.ts +1 -0
- package/dist/types/components/BarNav/BarNav.d.ts +4 -0
- package/dist/types/components/BarPageTitle/BarPageTitle.d.ts +4 -0
- package/dist/types/components/Breadcrumb/Breadcrumb.d.ts +5 -0
- package/dist/types/components/Calendar/Calendar.d.ts +2 -0
- package/dist/types/components/CardOverview/CardOverview.d.ts +3 -0
- package/dist/types/components/Chart/Chart.d.ts +7 -1
- package/dist/types/components/Checkbox/Checkbox.d.ts +3 -0
- package/dist/types/components/ConversationList/ConversationList.d.ts +3 -0
- package/dist/types/components/DataGroup/DataGroup.d.ts +3 -0
- package/dist/types/components/DataPreferences/DataPreferences.d.ts +1 -0
- package/dist/types/components/FilterMenu/FilterMenu.d.ts +1 -0
- package/dist/types/components/Icon/icon-cache.d.ts +6 -0
- package/dist/types/components/Icon/icon-svg.d.ts +10 -24
- package/dist/types/components/Markdown/Markdown.d.ts +4 -0
- package/dist/types/components/Menu/Menu.d.ts +3 -0
- package/dist/types/components/Message/Message.d.ts +1 -1
- package/dist/types/components/MobileSectionSwitcher/MobileSectionSwitcher.d.ts +5 -0
- package/dist/types/components/Modal/Modal.d.ts +3 -0
- package/dist/types/components/PanelNav/PanelNav.d.ts +8 -1
- package/dist/types/components/Radio/Radio.d.ts +1 -0
- package/dist/types/components/ScrollOverlay/ScrollOverlay.d.ts +1 -0
- package/dist/types/components/Select/Select.d.ts +8 -0
- package/dist/types/components/ShellApp/ShellApp.d.ts +3 -0
- package/dist/types/components/Slider/Slider.d.ts +1 -1
- package/dist/types/components/Switch/Switch.d.ts +2 -0
- package/dist/types/components/Table/Table.d.ts +35 -0
- package/dist/types/components/Table/index.d.ts +1 -1
- package/dist/types/components/Table/table-body-renderer.d.ts +1 -0
- package/dist/types/components/Table/table-cell-editor.d.ts +4 -0
- package/dist/types/components/Table/table-grid-model.d.ts +23 -0
- package/dist/types/components/Table/table-layout-controller.d.ts +1 -0
- package/dist/types/components/Table/table-model.d.ts +1 -1
- package/dist/types/components/Table/table-review-fixtures.d.ts +10 -0
- package/dist/types/components/Table/table-row-view.d.ts +11 -2
- package/dist/types/components/Table/table-skeleton-view.d.ts +3 -1
- package/dist/types/components/Table/table-structure.d.ts +38 -0
- package/dist/types/components/Table/table-types.d.ts +71 -1
- package/dist/types/components/Table/table-virtual-controller.d.ts +1 -0
- package/dist/types/components/TooltipChart/TooltipChart.d.ts +4 -0
- package/dist/types/components.d.ts +98 -12
- package/dist/types/shell/chrome-transition.d.ts +1 -0
- package/dist/types/utils/anchored-position-controller.d.ts +2 -0
- package/dist/types/utils/clock-time.d.ts +1 -0
- package/dist/types/utils/connection-tasks.d.ts +13 -0
- package/dist/types/utils/date-filter-value.d.ts +2 -0
- package/dist/types/utils/form-association.d.ts +2 -1
- package/dist/types/utils/format-percentage.d.ts +1 -1
- package/dist/types/utils/intl-formatters.d.ts +4 -0
- package/dist/types/utils/resolve-css-length-px.d.ts +4 -3
- package/dist/types/utils/select-controller.d.ts +1 -0
- package/dist/vue/THIRD-PARTY-NOTICES +14 -0
- package/dist/vue/bundled-dependencies.json +13 -0
- package/dist/vue/ds-checkbox.js +1 -0
- package/dist/vue/ds-select.js +4 -0
- package/dist/vue/ds-table.js +8 -0
- package/package.json +16 -11
- package/dist/components/p-B8ZonS3S.js +0 -2
- package/dist/components/p-B8ZonS3S.js.map +0 -1
- package/dist/components/p-BDdlJZyL.js +0 -2
- package/dist/components/p-BDdlJZyL.js.map +0 -1
- package/dist/components/p-BERXvOCf.js +0 -2
- package/dist/components/p-BERXvOCf.js.map +0 -1
- package/dist/components/p-BQspV5U7.js +0 -2
- package/dist/components/p-BQspV5U7.js.map +0 -1
- package/dist/components/p-BhjqYTiY.js +0 -2
- package/dist/components/p-BhjqYTiY.js.map +0 -1
- package/dist/components/p-BjtXYFhw.js +0 -2
- package/dist/components/p-BjtXYFhw.js.map +0 -1
- package/dist/components/p-Bk3poU91.js.map +0 -1
- package/dist/components/p-BxduVc5g.js +0 -2
- package/dist/components/p-BxduVc5g.js.map +0 -1
- package/dist/components/p-C0qN3PSb.js +0 -2
- package/dist/components/p-C0qN3PSb.js.map +0 -1
- package/dist/components/p-CPamUzaj.js +0 -2
- package/dist/components/p-CPamUzaj.js.map +0 -1
- package/dist/components/p-CUDocY23.js +0 -2
- package/dist/components/p-CUDocY23.js.map +0 -1
- package/dist/components/p-CX6ZxUQT.js +0 -2
- package/dist/components/p-CX6ZxUQT.js.map +0 -1
- package/dist/components/p-Cgn-BORA.js +0 -2
- package/dist/components/p-Cgn-BORA.js.map +0 -1
- package/dist/components/p-Ck1hgD6g.js +0 -2
- package/dist/components/p-Ck1hgD6g.js.map +0 -1
- package/dist/components/p-Co1rUdOR.js.map +0 -1
- package/dist/components/p-CochmPyg.js +0 -2
- package/dist/components/p-CochmPyg.js.map +0 -1
- package/dist/components/p-DCyJ3_PL.js +0 -2
- package/dist/components/p-DCyJ3_PL.js.map +0 -1
- package/dist/components/p-DVEx-Xg9.js +0 -2
- package/dist/components/p-DVEx-Xg9.js.map +0 -1
- package/dist/components/p-DYsE6HLk.js +0 -2
- package/dist/components/p-DYsE6HLk.js.map +0 -1
- package/dist/components/p-DebLYW7A.js +0 -2
- package/dist/components/p-DebLYW7A.js.map +0 -1
- package/dist/components/p-DjkUFlDW.js.map +0 -1
- package/dist/components/p-Dnt5xUBD.js +0 -2
- package/dist/components/p-Dnt5xUBD.js.map +0 -1
- package/dist/components/p-Dyqd-cub.js +0 -2
- package/dist/components/p-Dyqd-cub.js.map +0 -1
- package/dist/components/p-DzvTC27M.js.map +0 -1
- package/dist/components/p-g0jsfEXz.js +0 -2
- package/dist/components/p-g0jsfEXz.js.map +0 -1
- package/dist/components/p-pp1IQN4Z.js +0 -2
- package/dist/components/p-pp1IQN4Z.js.map +0 -1
- package/dist/components/p-rCeztgVn.js +0 -2
- package/dist/components/p-rCeztgVn.js.map +0 -1
- /package/dist/components/{p-CZNZTcYS.js.map → p-5-gQbIIz.js.map} +0 -0
- /package/dist/components/{p-DRdoGSGX.js.map → p-7MwoWtTJ.js.map} +0 -0
- /package/dist/components/{p-DJDbskZf.js.map → p-BO5URdZF.js.map} +0 -0
- /package/dist/components/{p-DmSnHVW6.js.map → p-BVxK8ce0.js.map} +0 -0
- /package/dist/components/{p-B0EpvBDs.js.map → p-BYeG0b5N.js.map} +0 -0
- /package/dist/components/{p-CJ1NnOEW.js.map → p-CA3iQ1ME.js.map} +0 -0
- /package/dist/components/{p-DYQa1DVF.js.map → p-C_9VGgPf.js.map} +0 -0
- /package/dist/components/{p-7TVdPhGR.js.map → p-CgQB8Ct5.js.map} +0 -0
- /package/dist/components/{p-D6FRqNhN.js.map → p-D-J7GgjY.js.map} +0 -0
- /package/dist/components/{p-DSZPO06T.js.map → p-D9_iDlkT.js.map} +0 -0
- /package/dist/components/{p-BwdnVqAY.js.map → p-DEYCF-oJ.js.map} +0 -0
- /package/dist/components/{p-C8V4lkVy.js.map → p-DKGW3gRa.js.map} +0 -0
- /package/dist/components/{p-C4huuwed.js.map → p-DR_8IPn9.js.map} +0 -0
- /package/dist/components/{p-B0BQCVkq.js.map → p-D_iZPukF.js.map} +0 -0
- /package/dist/components/{p-JBki_jyY.js.map → p-DfMTDFcE.js.map} +0 -0
- /package/dist/components/{p-MOJmB6vX.js.map → p-Dg6hnCc2.js.map} +0 -0
- /package/dist/components/{p-DXk1eml1.js.map → p-DjbT9kKm.js.map} +0 -0
- /package/dist/components/{p-_IqSPt5V.js.map → p-Dr5rkAhe.js.map} +0 -0
- /package/dist/components/{p-DIQiHX0q.js.map → p-DvGrsLgt.js.map} +0 -0
- /package/dist/components/{p-Doa2blZT.js.map → p-PtxCwf5S.js.map} +0 -0
- /package/dist/components/{p-B9TM6FqC.js.map → p-d76Ry5nh.js.map} +0 -0
- /package/dist/components/{p-BFHpU-uU.js.map → p-kwS-vkau.js.map} +0 -0
- /package/dist/components/{p-B39iJO8F.js.map → p-rmPIcWED.js.map} +0 -0
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"names":["SelectController","constructor","state","this","triggerEl","popupEl","searchEl","typeahead","typeaheadTimer","outsideHandler","setTriggerElement","element","setPopupElement","setSearchElement","handleTriggerKeyDown","event","open","includes","key","preventDefault","openPopup","isTypeaheadKey","searchable","searchTerm","handleTypeahead","handleListKeyDown","focusRingVisible","activeIndex","moveChoiceIndex","options","enabledChoiceIndexes","enabled","length","target","Node","contains","option","selectOption","closePopup","position","AnchoredPositionController","getAnchor","getPopup","measure","trigger","popup","isConnected","host","sectionPadding","resolveCssLengthPx","TOKEN_DEFAULTS","space050","style","minWidth","menuWidthXs","choicePopupMinWidth","offsetWidth","align","popupAlign","anchorRect","getBoundingClientRect","popupWidth","popupHeight","offsetHeight","side","sideOffsetPx","alignOffsetPx","resolveChoicePopupAlignOffset","sectionInsetPx","viewportPadPx","viewportWidth","window","innerWidth","viewportHeight","innerHeight","collisionRect","resolveAnchoredOverlayBoundaryRect","boundary","apply","x","y","positionReady","topLayer","activeOptionId","isLoading","generatedId","undefined","connect","openChanged","disconnect","cancelPositionRetry","unbindPopupListeners","clearTimeout","setFocus","focus","optionsChanged","requestAnimationFrame","updatePosition","loadingChanged","positionChanged","bindPopupListeners","schedulePositionUpdate","scrollActiveOptionIntoView","searchChanged","activeIndexChanged","focusVisible","edge","isDisabled","preferredIndex","restoreFocus","focusSearchOrTrigger","metaKey","ctrlKey","altKey","normalized","toLocaleLowerCase","repeatedCharacter","every","character","match","findChoiceTypeaheadMatch","resetMs","resolveCssTimeMs","animationDurationMedium1","setTimeout","querySelector","scrollIntoView","block","inline","eventIntersectsComposedBoundary","document","addEventListener","observe","removeEventListener","unobserve","cancel","onReady","schedule","update","selectCss","ICON_SIZE","lg","md","sm","xs","OPTION_ACTION_SIZE","selectId","Select","__stencil_proxyCustomElement","HTMLElement","registerHost","sections","multiple","value","disabled","required","requiredMessage","DEFAULT_REQUIRED_MESSAGE","placeholder","triggerLabelPlaceholder","dot","size","isInset","insetDepth","width","isInactive","neutralTrigger","activeFill","collapseLabel","iconOnly","hasBorder","rounded","indicator","allowClear","clearLabel","selectedLabel","searchPlaceholder","noResultsText","loadingLabel","error","ariaLabel","formDisabled","compactFooterSummary","captionCompact","listboxId","errorId","initialValue","controller","createController","hasLoaded","clearSelection","stopPropagation","dsChange","emit","dsClear","visibleOptions","activateFooterAction","dsFooterAction","owner","el","findIndex","scalarValue","componentWillLoad","normalizeValueForMode","Array","isArray","syncFormValue","componentDidLoad","observeFooterContent","syncCaptionCompactObserver","connectedCallback","componentDidRender","scheduleFooterSummaryMeasurement","disconnectedCallback","footerResizeObserver","observedFooterContentElement","footerMeasurementFrame","cancelAnimationFrame","disconnectCaptionCompactObserver","onCollapseLabelChange","inactive","values","resolvedValues","setRepeatedFormControlValue","internals","name","hasSelection","setFormControlValue","missing","setRequiredValidity","onLoadingChange","onPopupAlignChange","onOpenChange","dsOpenChange","onSearchTermChange","onActiveIndexChange","formDisabledCallback","formResetCallback","formStateRestoreCallback","restoreStringFormState","restoreStringArrayFormState","allSections","resolveChoiceSections","allOptions","flattenChoiceSections","visibleSections","filterChoiceSections","valid","Set","map","filter","has","selectedOption","find","Boolean","popupRole","some","action","content","footerContentElement","ResizeObserver","measureFooterSummary","summary","footerSummaryMeasureElement","clear","footerClearElement","styles","getComputedStyle","clientWidth","Number","parseFloat","paddingInlineStart","paddingInlineEnd","requiredWidth","columnGap","nextCompact","current","next","renderOption","index","usesIcons","usesSubtext","selected","active","actionId","h","ChoiceOptionRow","id","actionOpen","surfaceOpen","expanded","leading","class","label","checked","presentation","icon","color","supporting","subtextActions","actionIndex","as","variant","CONTROL_SUPPORTING_TEXT_VARIANT","type","tone","onKeyDown","onClick","dsOptionSubtextAction","actionValue","originalEvent","haspopup","controls","onDsClick","dsOptionAction","anchorId","detail","onHover","onSelect","captionIconOnly","doubleInset","captionCompactDisconnect","observeTableCaptionCompact","compact","renderCaptionTooltip","render","showPlaceholder","count","triggerLabel","textVariant","CONTROL_TEXT_VARIANT","iconSize","usesOptionIcons","choiceListUsesIcons","usesOptionSubtext","choiceListUsesSubtext","showError","errorMessage","describedBy","ariaDescribedby","join","popupStyle","left","top","transform","Math","round","zIndex","visibility","flatIndex","Host","controlWidthClass","background","ref","inputId","choiceBackgroundClassMap","role","String","ariaLabelledby","shiftKey","getElementById","lineTruncation","hasRing","trim","popover","ChoiceSearch","activeDescendant","inputRef","onValueChange","body","section","sectionIndex","divider","header","emphasis","footerActionLabel","ChoiceActionFooter","onAction","ChoiceFooter","compactSummary","useCompactSummary","contentRef","summaryMeasureRef","clearRef","onClear","textId"],"sources":["src/wc/utils/select-controller.ts","src/wc/components/Select/Select.css?tag=ds-select&encapsulation=scoped","src/wc/components/Select/Select.tsx"],"sourcesContent":["import { AnchoredPositionController } from './anchored-position-controller';\nimport {\n enabledChoiceIndexes,\n findChoiceTypeaheadMatch,\n moveChoiceIndex,\n type ChoiceOption,\n} from './choice-list';\nimport { choicePopupMinWidth, resolveChoicePopupAlignOffset } from './choice-popup-alignment';\nimport { resolveCssLengthPx } from './resolve-css-length-px';\nimport { resolveCssTimeMs } from './resolve-css-time-ms';\nimport { TOKEN_DEFAULTS } from './token-defaults';\nimport { eventIntersectsComposedBoundary } from './anchored-overlay-interaction-controller';\nimport { resolveAnchoredOverlayBoundaryRect } from './anchored-overlay-boundary';\n\ntype PopupPosition = { x: number; y: number };\n\nexport interface SelectControllerState<T extends ChoiceOption> {\n readonly host: HTMLElement;\n readonly generatedId: string;\n readonly options: T[];\n readonly searchable: boolean;\n readonly isLoading: boolean;\n readonly isDisabled: boolean;\n readonly preferredIndex: number;\n readonly popupAlign: 'start' | 'end';\n readonly boundary: HTMLElement | undefined;\n open: boolean;\n activeIndex: number;\n searchTerm: string;\n focusRingVisible: boolean;\n position: PopupPosition;\n positionReady: boolean;\n selectOption(option: T): void;\n}\n\n/**\n * Shared single/multiple Select interaction controller.\n *\n * Decorated Stencil state and scalar/array selection remain in each component;\n * this controller owns only popup lifecycle, focus, positioning, typeahead,\n * and listbox keyboard traversal. Anchored placement is delegated to\n * `AnchoredPositionController`; only the choice-cell measurement stays here.\n */\nexport class SelectController<T extends ChoiceOption> {\n private triggerEl: HTMLButtonElement | null = null;\n private popupEl: HTMLDivElement | null = null;\n private searchEl: HTMLDsInputElement | null = null;\n private typeahead = '';\n private typeaheadTimer: ReturnType<typeof setTimeout> | null = null;\n private outsideHandler: ((event: MouseEvent) => void) | null = null;\n private readonly position: AnchoredPositionController;\n\n constructor(private readonly state: SelectControllerState<T>) {\n this.position = new AnchoredPositionController({\n getAnchor: () => this.triggerEl,\n getPopup: () => this.popupEl,\n measure: (trigger, popup) => {\n if (!this.state.open || !popup.isConnected || !this.state.host.contains(popup)) return null;\n\n const sectionPadding = resolveCssLengthPx(TOKEN_DEFAULTS.space050, TOKEN_DEFAULTS.space050);\n popup.style.minWidth = `max(var(--ds-choice-popup-min-inline-size, ${TOKEN_DEFAULTS.menuWidthXs}), ${choicePopupMinWidth(trigger.offsetWidth, sectionPadding)}px)`;\n\n const align = this.state.popupAlign;\n return {\n anchorRect: trigger.getBoundingClientRect(),\n popupWidth: popup.offsetWidth,\n popupHeight: popup.offsetHeight,\n side: 'bottom',\n align,\n sideOffsetPx: sectionPadding,\n alignOffsetPx: resolveChoicePopupAlignOffset({\n align,\n alignOffsetPx: 0,\n sectionInsetPx: sectionPadding,\n }),\n viewportPadPx: sectionPadding,\n viewportWidth: window.innerWidth,\n viewportHeight: window.innerHeight,\n collisionRect: resolveAnchoredOverlayBoundaryRect(trigger, this.state.boundary),\n };\n },\n apply: ({ x, y }) => {\n this.state.position = { x, y };\n this.state.positionReady = true;\n },\n topLayer: true,\n });\n }\n\n get activeOptionId(): string | undefined {\n return !this.state.isLoading && this.state.activeIndex >= 0\n ? `${this.state.generatedId}-option-${this.state.activeIndex}`\n : undefined;\n }\n\n setTriggerElement = (element: HTMLButtonElement | null) => {\n this.triggerEl = element;\n };\n\n setPopupElement = (element: HTMLDivElement | null) => {\n this.popupEl = element;\n };\n\n setSearchElement = (element: HTMLDsInputElement | null) => {\n this.searchEl = element;\n };\n\n connect() {\n if (this.state.open) this.openChanged(true);\n }\n\n disconnect() {\n this.cancelPositionRetry();\n this.unbindPopupListeners();\n if (this.typeaheadTimer) clearTimeout(this.typeaheadTimer);\n }\n\n setFocus() {\n this.triggerEl?.focus();\n }\n\n optionsChanged() {\n if (!this.state.open) return;\n const enabled = enabledChoiceIndexes(this.state.options);\n if (!enabled.includes(this.state.activeIndex)) this.state.activeIndex = enabled[0] ?? -1;\n requestAnimationFrame(() => this.updatePosition());\n }\n\n loadingChanged() {\n if (this.state.open) requestAnimationFrame(() => this.updatePosition());\n }\n\n positionChanged() {\n if (this.state.open) requestAnimationFrame(() => this.updatePosition());\n }\n\n openChanged(open: boolean) {\n if (open) {\n this.bindPopupListeners();\n this.schedulePositionUpdate(() => {\n this.scrollActiveOptionIntoView();\n if (this.state.searchable) void this.searchEl?.setFocus();\n });\n return;\n }\n this.cancelPositionRetry();\n this.unbindPopupListeners();\n this.state.searchTerm = '';\n this.state.positionReady = false;\n }\n\n searchChanged() {\n this.state.activeIndex = enabledChoiceIndexes(this.state.options)[0] ?? -1;\n requestAnimationFrame(() => {\n this.updatePosition();\n this.scrollActiveOptionIntoView();\n });\n }\n\n activeIndexChanged() {\n requestAnimationFrame(() => this.scrollActiveOptionIntoView());\n }\n\n openPopup(focusVisible: boolean, edge?: 'first' | 'last') {\n if (this.state.isDisabled || (!this.state.options.length && !this.state.isLoading)) return;\n const enabled = enabledChoiceIndexes(this.state.options);\n this.state.activeIndex =\n edge === 'last'\n ? (enabled[enabled.length - 1] ?? -1)\n : this.state.preferredIndex >= 0\n ? this.state.preferredIndex\n : (enabled[0] ?? -1);\n this.state.focusRingVisible = focusVisible;\n this.state.open = true;\n }\n\n closePopup(restoreFocus = false) {\n if (!this.state.open) return;\n this.state.open = false;\n if (restoreFocus) requestAnimationFrame(() => this.triggerEl?.focus());\n }\n\n focusSearchOrTrigger() {\n requestAnimationFrame(() => {\n if (this.state.searchable) void this.searchEl?.setFocus();\n else this.triggerEl?.focus();\n });\n }\n\n handleTriggerKeyDown = (event: KeyboardEvent) => {\n if (!this.state.open) {\n if (['ArrowDown', 'ArrowUp', 'Enter', ' '].includes(event.key)) {\n event.preventDefault();\n this.openPopup(true, event.key === 'ArrowUp' ? 'last' : 'first');\n } else if (this.isTypeaheadKey(event)) {\n event.preventDefault();\n this.openPopup(true);\n if (this.state.searchable) this.state.searchTerm = event.key;\n else this.handleTypeahead(event.key);\n }\n return;\n }\n this.handleListKeyDown(event);\n };\n\n handleListKeyDown = (event: KeyboardEvent) => {\n switch (event.key) {\n case 'ArrowDown':\n event.preventDefault();\n this.state.focusRingVisible = true;\n this.state.activeIndex = moveChoiceIndex(this.state.options, this.state.activeIndex, 1);\n break;\n case 'ArrowUp':\n event.preventDefault();\n this.state.focusRingVisible = true;\n this.state.activeIndex = moveChoiceIndex(this.state.options, this.state.activeIndex, -1);\n break;\n case 'Home':\n event.preventDefault();\n this.state.focusRingVisible = true;\n this.state.activeIndex = enabledChoiceIndexes(this.state.options)[0] ?? -1;\n break;\n case 'End': {\n event.preventDefault();\n this.state.focusRingVisible = true;\n const enabled = enabledChoiceIndexes(this.state.options);\n this.state.activeIndex = enabled[enabled.length - 1] ?? -1;\n break;\n }\n case 'Enter':\n case ' ': {\n if (\n event.key === ' ' &&\n this.state.searchable &&\n event.target instanceof Node &&\n this.searchEl?.contains(event.target)\n )\n break;\n event.preventDefault();\n const option = this.state.options[this.state.activeIndex];\n if (option) this.state.selectOption(option);\n break;\n }\n case 'Escape':\n event.preventDefault();\n this.closePopup(true);\n break;\n case 'Tab':\n this.closePopup();\n break;\n default:\n if (!this.state.searchable && this.isTypeaheadKey(event)) {\n this.handleTypeahead(event.key);\n }\n }\n };\n\n private isTypeaheadKey(event: KeyboardEvent) {\n return event.key.length === 1 && !event.metaKey && !event.ctrlKey && !event.altKey;\n }\n\n private handleTypeahead(key: string) {\n if (this.typeaheadTimer) clearTimeout(this.typeaheadTimer);\n this.state.focusRingVisible = true;\n const normalized = key.toLocaleLowerCase();\n const repeatedCharacter =\n this.typeahead.length > 0 && [...this.typeahead].every(character => character === normalized);\n this.typeahead = repeatedCharacter ? normalized : `${this.typeahead}${normalized}`;\n const match = findChoiceTypeaheadMatch(\n this.state.options,\n this.typeahead,\n this.state.activeIndex\n );\n if (match >= 0) this.state.activeIndex = match;\n const resetMs = resolveCssTimeMs(\n TOKEN_DEFAULTS.animationDurationMedium1,\n TOKEN_DEFAULTS.animationDurationMedium1\n );\n this.typeaheadTimer = setTimeout(() => {\n this.typeahead = '';\n this.typeaheadTimer = null;\n }, resetMs);\n }\n\n private scrollActiveOptionIntoView() {\n if (!this.state.open || !this.activeOptionId) return;\n this.state.host\n .querySelector<HTMLElement>(`#${this.activeOptionId}`)\n ?.scrollIntoView({ block: 'nearest', inline: 'nearest' });\n }\n\n private bindPopupListeners() {\n this.unbindPopupListeners();\n this.outsideHandler = event => {\n if (eventIntersectsComposedBoundary(event, this.state.host)) return;\n this.closePopup();\n };\n document.addEventListener('mousedown', this.outsideHandler, true);\n this.position.observe();\n }\n\n private unbindPopupListeners() {\n if (this.outsideHandler) {\n document.removeEventListener('mousedown', this.outsideHandler, true);\n this.outsideHandler = null;\n }\n this.position.unobserve();\n }\n\n private cancelPositionRetry() {\n this.position.cancel();\n }\n\n private schedulePositionUpdate(onReady?: () => void) {\n if (!this.state.open) return;\n this.state.positionReady = false;\n this.position.schedule(onReady);\n }\n\n private updatePosition(): boolean {\n return this.position.update();\n }\n}\n","@import '../../utils/radius.css';\n@import '../../utils/choice-list.css';\n@import '../../utils/control-density-inset.css';\n@import '../../utils/control-parts.css';\n@import '../../utils/control-width.css';\n@import '../../utils/field-stack.css';\n@import '../../utils/search-control.css';\n@import '../../utils/select-trigger.css';\n@import '../../utils/table-caption-control.css';\n@import '../../utils/typography.css';\n@import '../../styles/control-elevation.css';\n\n.wrapper--error {\n --ds-interaction-border-width: var(--dimension-stroke-width-018);\n --ds-interaction-border-color: var(--color-border-bold-negative);\n}\n\n.select-popup {\n color: var(--color-foreground-secondary);\n}\n\n.select-option[aria-selected='true'] .ds-choice-item__icon {\n color: var(--color-foreground-primary);\n}\n\n.select-option-row {\n position: relative;\n isolation: isolate;\n}\n\n.select-option-row__action {\n position: absolute;\n top: 50%;\n right: var(--dimension-space-050);\n z-index: var(--dimension-z-index-floating);\n display: flex;\n align-items: center;\n justify-content: center;\n border-radius: var(--dimension-radius-half);\n background: var(--color-background-transparent);\n -webkit-backdrop-filter: blur(var(--effect-blur-sm));\n backdrop-filter: blur(var(--effect-blur-sm));\n opacity: 0;\n pointer-events: none;\n transform: translateY(-50%);\n}\n\n.select-option-row:has(:focus-visible) .select-option-row__action,\n.select-option-row--action-open .select-option-row__action,\n.select-option-row--keyboard-active .select-option-row__action {\n opacity: 1;\n pointer-events: auto;\n}\n\n.select-option-row--action-open .select-option::after {\n background: var(--ds-interaction-hover);\n}\n\n.select-option__subtext-actions {\n display: flex;\n align-items: center;\n gap: var(--dimension-space-050);\n min-inline-size: 0;\n color: var(--color-foreground-secondary);\n}\n\n.select-option__subtext-action {\n appearance: none;\n display: inline-flex;\n align-items: center;\n padding: 0;\n border: 0;\n border-radius: var(--dimension-radius-025);\n background: transparent;\n cursor: pointer;\n}\n\n.select-option__subtext-action--negative {\n --ds-text-action-foreground: var(--color-foreground-bold-negative);\n}\n\n.select-option__subtext-action-separator {\n color: var(--color-foreground-tertiary);\n pointer-events: none;\n}\n\n@media (hover: hover) and (pointer: fine) {\n .select-option-row:hover .select-option-row__action {\n opacity: 1;\n pointer-events: auto;\n }\n\n .select-option-row:hover .select-option::after {\n background: var(--ds-interaction-hover);\n }\n}\n\n@media (hover: none) {\n .select-option-row__action {\n opacity: 1;\n pointer-events: auto;\n }\n\n .select-option-row--has-action .ds-choice-item__content {\n padding-inline-end: var(--dimension-size-400);\n }\n}\n\n.error-text {\n width: 100%;\n}\n","import {\n AttachInternals,\n Component,\n Element,\n Event,\n EventEmitter,\n h,\n Host,\n Method,\n Prop,\n State,\n type VNode,\n Watch,\n} from '@stencil/core';\nimport {\n controlWidthClass,\n CONTROL_SUPPORTING_TEXT_VARIANT,\n CONTROL_TEXT_VARIANT,\n DEFAULT_REQUIRED_MESSAGE,\n restoreStringArrayFormState,\n restoreStringFormState,\n setFormControlValue,\n setRepeatedFormControlValue,\n setRequiredValidity,\n type ControlInsetDepth,\n type ControlWidth,\n} from '../../utils';\nimport {\n ChoiceActionFooter,\n ChoiceFooter,\n ChoiceOptionRow,\n ChoiceSearch,\n} from '../../utils/choice-list-parts';\nimport {\n choiceBackgroundClassMap,\n choiceListUsesIcons,\n choiceListUsesSubtext,\n enabledChoiceIndexes,\n filterChoiceSections,\n flattenChoiceSections,\n resolveChoiceSections,\n type ChoiceBackground,\n type ChoiceOption,\n type ChoiceSection,\n} from '../../utils/choice-list';\nimport { SelectController } from '../../utils/select-controller';\nimport { observeTableCaptionCompact } from '../../utils/table-caption-compact';\n\nexport type SelectOption = ChoiceOption;\nexport type SelectSection = ChoiceSection;\nexport type SelectBackground = ChoiceBackground;\nexport type SelectSize = 'lg' | 'md' | 'sm' | 'xs';\nexport type SelectWidth = ControlWidth;\nexport type SelectPopupAlign = 'start' | 'end';\nexport type SelectValue = string | string[];\nexport type SelectIndicator = 'down' | 'up-down' | 'none';\n\nexport interface SelectOptionActionDetail {\n value: string;\n anchorId: string;\n originalEvent: MouseEvent;\n}\n\nexport interface SelectOptionSubtextActionDetail {\n value: string;\n actionValue: string;\n originalEvent: MouseEvent;\n}\n\nconst ICON_SIZE: Record<SelectSize, 'lg' | 'md' | 'sm' | 'xs'> = {\n lg: 'lg',\n md: 'md',\n sm: 'sm',\n xs: 'xs',\n};\n\nconst OPTION_ACTION_SIZE: Record<SelectSize, 'md' | 'sm' | 'xs'> = {\n lg: 'md',\n md: 'sm',\n sm: 'xs',\n xs: 'xs',\n};\n\nlet selectId = 0;\n\n@Component({\n tag: 'ds-select',\n styleUrl: 'Select.css',\n scoped: true,\n formAssociated: true,\n})\nexport class Select {\n @Element() el!: HTMLElement;\n @AttachInternals() internals!: ElementInternals;\n\n /** Flat choices. Assign arrays through the JavaScript property. */\n @Prop() options: SelectOption[] = [];\n /** Grouped choices; takes precedence over options. Assign through JavaScript. */\n @Prop() sections: SelectSection[] = [];\n /** Enable independent multi-value selection while keeping the popup open. */\n @Prop({ reflect: true }) multiple: boolean = false;\n /** Selected scalar or array value according to `multiple`. */\n @Prop({ mutable: true }) value: SelectValue = '';\n /** Controlled popup visibility. */\n @Prop({ mutable: true, reflect: true }) open: boolean = false;\n /** Native form field name. */\n @Prop({ reflect: true }) name: string | undefined;\n /** Native disabled state. */\n @Prop({ reflect: true }) disabled: boolean = false;\n /** Require one valid selected value. */\n @Prop({ reflect: true }) required: boolean = false;\n /** Validation message used when required is missing. */\n @Prop() requiredMessage: string = DEFAULT_REQUIRED_MESSAGE;\n /** Trigger text shown when no valid value is selected. */\n @Prop() placeholder: string = 'Select';\n /** Optional scalar-mode trigger text that does not change the selected option label. */\n @Prop() triggerLabel: string | undefined;\n /** Present triggerLabel with placeholder emphasis while preserving the selected value. */\n @Prop() triggerLabelPlaceholder: boolean = false;\n /** Show a supplemental notification dot beside the trigger label. */\n @Prop() dot: boolean = false;\n /** Control density. */\n @Prop() size: SelectSize = 'md';\n /** Use reduced outer geometry when nested inside a control of the same size. */\n @Prop() isInset: boolean = false;\n /** Single removes 4px overall; double removes 8px overall (xs stays single). */\n @Prop() insetDepth: ControlInsetDepth = 'single';\n /** Width fit — hug content (default) or fill the parent. */\n @Prop() width: SelectWidth = 'hug';\n /** Align the popup's choice edge to the trigger start or end edge. */\n @Prop() popupAlign: SelectPopupAlign = 'start';\n /** Explicit collision owner; otherwise the nearest data-ds-overlay-boundary ancestor is used. */\n @Prop() boundary: HTMLElement | undefined;\n /** Shared inactive treatment; removes interaction and form submission. */\n @Prop() isInactive: boolean = false;\n /** Replace the prefix with a loader and disable option interaction. */\n @Prop() isLoading: boolean = false;\n /** Show the selected interaction fill when a valid value exists. */\n /** Keep trigger colors neutral when a value is selected. */\n @Prop() neutralTrigger: boolean = false;\n @Prop() activeFill: boolean = false;\n /**\n * Opt into table-caption icon-only chrome below 900px. The trigger omits its\n * visible label and chevron; keep an accessible name via aria-label.\n */\n @Prop({ reflect: true }) collapseLabel: boolean = false;\n /** Always show only the prefix icon; retain an accessible name via aria-label. */\n @Prop() iconOnly: boolean = false;\n /** Show the surface-aware inset border, including focused and invalid strokes. */\n @Prop() hasBorder: boolean = true;\n /** Use a pill radius on the trigger. Popup chrome stays on the menu radius. */\n @Prop() rounded: boolean = false;\n /** Optional trigger prefix icon name. */\n @Prop() icon: string | undefined;\n /** Trailing choice indicator. Use up-down for compact value steppers such as page size. */\n @Prop() indicator: SelectIndicator = 'down';\n /** Show the clear footer action when a value exists. */\n @Prop() allowClear: boolean = true;\n /** Localized clear action label. */\n @Prop() clearLabel: string = 'Clear';\n /** Localized noun displayed after the selected count in multiple mode. */\n @Prop() selectedLabel: string = 'selected';\n /** Optional text action shown in the popup footer instead of the clear action. */\n @Prop() footerActionLabel: string | undefined;\n /** Show immediate local filtering over option labels, subtext, and section headings. */\n @Prop() searchable: boolean = false;\n /** Localized search-field placeholder and accessible name. */\n @Prop() searchPlaceholder: string = 'Search';\n /** Localized empty-filter result text. */\n @Prop() noResultsText: string = 'No results found';\n /** Accessible loading status label. */\n @Prop() loadingLabel: string = 'Loading';\n /** Actual parent surface context; omit on primary and secondary surfaces. */\n @Prop() background: SelectBackground | undefined;\n /** Show invalid visual state. */\n @Prop() error: boolean = false;\n /** Error text rendered below the trigger when error is true. */\n @Prop() errorMessage: string | undefined;\n /** ID applied to the internal combobox trigger for external labels. */\n @Prop() inputId: string | undefined;\n /** Direct accessible name when no external label is available. */\n @Prop({ attribute: 'aria-label' }) ariaLabel: string | null = null;\n /** IDs of elements that label the combobox. */\n @Prop({ attribute: 'aria-labelledby' }) ariaLabelledby: string | undefined;\n /** Additional IDs that describe the combobox. */\n @Prop({ attribute: 'aria-describedby' }) ariaDescribedby: string | undefined;\n\n /** Emitted after selection or clearing with the next scalar or array value. */\n @Event() dsChange!: EventEmitter<SelectValue>;\n /** Emitted after the footer clear action. */\n @Event() dsClear!: EventEmitter<void>;\n /** Emitted whenever popup visibility changes. */\n @Event() dsOpenChange!: EventEmitter<boolean>;\n /** Emitted when the optional popup footer action is activated. */\n @Event() dsFooterAction!: EventEmitter<void>;\n /** Emitted when an option's contextual ellipsis action is activated. */\n @Event() dsOptionAction!: EventEmitter<SelectOptionActionDetail>;\n /** Emitted when an option's supporting text action is activated. */\n @Event() dsOptionSubtextAction!: EventEmitter<SelectOptionSubtextActionDetail>;\n\n @State() private activeIndex = -1;\n @State() private searchTerm = '';\n @State() private formDisabled = false;\n @State() private position = { x: 0, y: 0 };\n @State() private positionReady = false;\n @State() private focusRingVisible = false;\n @State() private compactFooterSummary = false;\n @State() private captionCompact = false;\n\n private readonly generatedId = `ds-select-${++selectId}`;\n private readonly listboxId = `${this.generatedId}-listbox`;\n private readonly errorId = `${this.generatedId}-error`;\n private initialValue: SelectValue = '';\n private readonly controller = this.createController();\n private footerContentElement?: HTMLDivElement;\n private footerSummaryMeasureElement?: HTMLElement;\n private footerClearElement?: HTMLButtonElement;\n private footerResizeObserver?: ResizeObserver;\n private observedFooterContentElement?: HTMLDivElement;\n private footerMeasurementFrame?: number;\n private captionCompactDisconnect: (() => void) | undefined;\n private hasLoaded = false;\n\n private createController() {\n // eslint-disable-next-line @typescript-eslint/no-this-alias -- adapter getters preserve reactive component ownership without inheritance.\n const owner = this;\n return new SelectController<SelectOption>({\n get host() {\n return owner.el;\n },\n generatedId: owner.generatedId,\n get options() {\n return owner.visibleOptions;\n },\n get searchable() {\n return owner.searchable;\n },\n get isLoading() {\n return owner.isLoading;\n },\n get isDisabled() {\n return owner.isDisabled;\n },\n get preferredIndex() {\n if (owner.multiple) return -1;\n return owner.visibleOptions.findIndex(\n option => option.value === owner.scalarValue && !option.isInactive\n );\n },\n get popupAlign() {\n return owner.popupAlign;\n },\n get boundary() {\n return owner.boundary;\n },\n get open() {\n return owner.open;\n },\n set open(value) {\n owner.open = value;\n },\n get activeIndex() {\n return owner.activeIndex;\n },\n set activeIndex(value) {\n owner.activeIndex = value;\n },\n get searchTerm() {\n return owner.searchTerm;\n },\n set searchTerm(value) {\n owner.searchTerm = value;\n },\n get focusRingVisible() {\n return owner.focusRingVisible;\n },\n set focusRingVisible(value) {\n owner.focusRingVisible = value;\n },\n get position() {\n return owner.position;\n },\n set position(value) {\n owner.position = value;\n },\n get positionReady() {\n return owner.positionReady;\n },\n set positionReady(value) {\n owner.positionReady = value;\n },\n selectOption: option => owner.selectOption(option),\n });\n }\n\n componentWillLoad() {\n this.value = this.normalizeValueForMode(this.value);\n this.initialValue = Array.isArray(this.value) ? [...this.value] : this.value;\n this.syncFormValue();\n }\n\n componentDidLoad() {\n this.hasLoaded = true;\n this.controller.connect();\n this.observeFooterContent();\n this.syncCaptionCompactObserver();\n }\n\n connectedCallback() {\n if (!this.hasLoaded) return;\n this.controller.connect();\n this.observeFooterContent();\n this.syncCaptionCompactObserver();\n }\n\n componentDidRender() {\n this.observeFooterContent();\n this.scheduleFooterSummaryMeasurement();\n }\n\n disconnectedCallback() {\n this.controller.disconnect();\n this.footerResizeObserver?.disconnect();\n this.observedFooterContentElement = undefined;\n if (this.footerMeasurementFrame !== undefined) {\n cancelAnimationFrame(this.footerMeasurementFrame);\n this.footerMeasurementFrame = undefined;\n }\n this.disconnectCaptionCompactObserver();\n }\n\n @Watch('collapseLabel')\n onCollapseLabelChange() {\n this.syncCaptionCompactObserver();\n }\n\n @Watch('value')\n @Watch('multiple')\n @Watch('disabled')\n @Watch('isInactive')\n @Watch('required')\n @Watch('name')\n @Watch('options')\n @Watch('sections')\n syncFormValue() {\n if (\n (this.multiple && !Array.isArray(this.value)) ||\n (!this.multiple && Array.isArray(this.value))\n ) {\n this.value = this.normalizeValueForMode(this.value);\n }\n const inactive = this.isDisabled;\n if (this.multiple) {\n const values = this.resolvedValues;\n setRepeatedFormControlValue(this.internals, this.name, values, { inactive });\n } else {\n const value = this.hasSelection ? this.scalarValue : '';\n setFormControlValue(this.internals, value, { inactive });\n }\n const missing = this.required && !inactive && !this.hasSelection;\n setRequiredValidity(this.internals, missing, this.requiredMessage);\n this.controller.optionsChanged();\n }\n\n @Watch('isLoading')\n onLoadingChange() {\n this.controller.loadingChanged();\n }\n\n @Watch('popupAlign')\n @Watch('boundary')\n onPopupAlignChange() {\n this.controller.positionChanged();\n }\n\n @Watch('open')\n onOpenChange(open: boolean) {\n this.dsOpenChange.emit(open);\n this.controller.openChanged(open);\n }\n\n @Watch('searchTerm')\n onSearchTermChange() {\n this.controller.searchChanged();\n }\n\n @Watch('activeIndex')\n onActiveIndexChange() {\n this.controller.activeIndexChanged();\n }\n\n formDisabledCallback(disabled: boolean) {\n this.formDisabled = disabled;\n this.syncFormValue();\n }\n\n formResetCallback() {\n this.value = this.normalizeValueForMode(this.initialValue);\n this.closePopup();\n }\n\n formStateRestoreCallback(state: string | File | FormData | null) {\n if (!this.multiple) {\n this.value = restoreStringFormState(state);\n return;\n }\n this.value = restoreStringArrayFormState(state);\n }\n\n @Method()\n async setFocus() {\n this.controller.setFocus();\n }\n\n private get isDisabled(): boolean {\n return this.disabled || this.isInactive || this.formDisabled;\n }\n\n private normalizeValueForMode(value: SelectValue): SelectValue {\n if (this.multiple) {\n return Array.isArray(value) ? [...value] : value ? [value] : [];\n }\n return Array.isArray(value) ? (value[0] ?? '') : value;\n }\n\n private get allSections(): SelectSection[] {\n return resolveChoiceSections(this.options, this.sections);\n }\n\n private get allOptions(): SelectOption[] {\n return flattenChoiceSections(this.allSections);\n }\n\n private get visibleSections(): SelectSection[] {\n return this.searchable\n ? filterChoiceSections(this.allSections, this.searchTerm)\n : this.allSections;\n }\n\n private get visibleOptions(): SelectOption[] {\n return flattenChoiceSections(this.visibleSections);\n }\n\n private get scalarValue(): string {\n return typeof this.value === 'string' ? this.value : '';\n }\n\n private get resolvedValues(): string[] {\n if (!this.multiple || !Array.isArray(this.value)) return [];\n const valid = new Set(this.allOptions.map(option => option.value));\n return [...new Set(this.value.filter(value => valid.has(value)))];\n }\n\n private get selectedOption(): SelectOption | undefined {\n if (this.multiple) return undefined;\n return this.allOptions.find(option => option.value === this.scalarValue);\n }\n\n private get hasSelection(): boolean {\n return this.multiple ? this.resolvedValues.length > 0 : Boolean(this.selectedOption);\n }\n\n private get activeOptionId(): string | undefined {\n return this.controller.activeOptionId;\n }\n\n private get popupRole(): 'listbox' | 'grid' {\n return this.allOptions.some(option => Boolean(option.action)) ? 'grid' : 'listbox';\n }\n\n private observeFooterContent() {\n const content =\n this.open && this.multiple && this.hasSelection ? this.footerContentElement : undefined;\n if (!content?.isConnected) {\n this.footerResizeObserver?.disconnect();\n this.observedFooterContentElement = undefined;\n return;\n }\n if (this.observedFooterContentElement === content) return;\n\n this.footerResizeObserver?.disconnect();\n if (typeof ResizeObserver !== 'undefined') {\n this.footerResizeObserver = new ResizeObserver(() => this.scheduleFooterSummaryMeasurement());\n this.footerResizeObserver.observe(content);\n }\n this.observedFooterContentElement = content;\n }\n\n private scheduleFooterSummaryMeasurement() {\n if (\n !this.open ||\n !this.multiple ||\n !this.hasSelection ||\n this.footerMeasurementFrame !== undefined\n ) {\n return;\n }\n this.footerMeasurementFrame = requestAnimationFrame(() => {\n this.footerMeasurementFrame = undefined;\n this.measureFooterSummary();\n });\n }\n\n private measureFooterSummary() {\n const content = this.footerContentElement;\n const summary = this.footerSummaryMeasureElement;\n const clear = this.footerClearElement;\n if (!content?.isConnected || !summary?.isConnected || !clear?.isConnected) return;\n\n const styles = getComputedStyle(content);\n const innerWidth =\n content.clientWidth -\n Number.parseFloat(styles.paddingInlineStart || '0') -\n Number.parseFloat(styles.paddingInlineEnd || '0');\n const requiredWidth =\n summary.getBoundingClientRect().width +\n clear.getBoundingClientRect().width +\n Number.parseFloat(styles.columnGap || '0');\n const nextCompact = requiredWidth > innerWidth + 0.5;\n if (nextCompact !== this.compactFooterSummary) {\n this.compactFooterSummary = nextCompact;\n }\n }\n\n private closePopup(restoreFocus = false) {\n this.controller.closePopup(restoreFocus);\n }\n\n private openPopup(focusVisible: boolean, edge?: 'first' | 'last') {\n this.controller.openPopup(focusVisible, edge);\n }\n\n private selectOption(option: SelectOption) {\n if (option.isInactive || this.isLoading) return;\n if (this.multiple) {\n const current = this.resolvedValues;\n const next = current.includes(option.value)\n ? current.filter(value => value !== option.value)\n : [...current, option.value];\n this.value = next;\n this.dsChange.emit([...next]);\n return;\n }\n this.value = option.value;\n this.dsChange.emit(option.value);\n this.controller.closePopup(true);\n }\n\n private clearSelection = (event: Event) => {\n event.preventDefault();\n event.stopPropagation();\n this.value = this.multiple ? [] : '';\n this.dsChange.emit(this.multiple ? [] : '');\n this.dsClear.emit();\n if (!this.multiple) {\n const enabled = enabledChoiceIndexes(this.visibleOptions);\n this.activeIndex = enabled[0] ?? -1;\n }\n this.controller.focusSearchOrTrigger();\n };\n\n private activateFooterAction = (event: MouseEvent) => {\n event.preventDefault();\n event.stopPropagation();\n this.dsFooterAction.emit();\n this.closePopup();\n };\n\n private readonly handleListKeyDown = this.controller.handleListKeyDown;\n private readonly handleTriggerKeyDown = this.controller.handleTriggerKeyDown;\n\n private renderOption(\n option: SelectOption,\n index: number,\n usesIcons: boolean,\n usesSubtext: boolean\n ) {\n const selected = this.multiple\n ? this.resolvedValues.includes(option.value)\n : option.value === this.scalarValue;\n const active = index === this.activeIndex;\n const actionId = `${this.generatedId}-option-action-${index}`;\n return (\n <ChoiceOptionRow\n size={this.size}\n id={`${this.generatedId}-option-${index}`}\n option={option}\n selected={selected}\n active={active}\n focusRingVisible={this.focusRingVisible}\n usesSubtext={usesSubtext}\n actionOpen={option.action?.surfaceOpen ?? option.action?.expanded}\n popupRole={this.popupRole}\n leading={\n this.multiple ? (\n <span\n class=\"ds-choice-item__icon ds-control-icon-box ds-interaction-fill__content\"\n aria-hidden=\"true\"\n >\n <ds-checkbox\n class=\"select-option__checkbox\"\n label=\"\"\n size={this.size}\n checked={selected}\n presentation\n />\n </span>\n ) : usesIcons && option.icon ? (\n <span\n class=\"ds-choice-item__icon ds-control-icon-box ds-interaction-fill__content\"\n aria-hidden=\"true\"\n >\n <ds-icon name={option.icon} size={this.size} color=\"inherit\" />\n </span>\n ) : undefined\n }\n supporting={\n option.subtextActions?.length ? (\n <span class=\"ds-choice-item__subtext ds-control-label-box select-option__subtext-actions\">\n {option.subtextActions.map((action, actionIndex) => [\n actionIndex > 0 ? (\n <ds-text\n class=\"select-option__subtext-action-separator\"\n as=\"span\"\n variant={CONTROL_SUPPORTING_TEXT_VARIANT[this.size]}\n color=\"inherit\"\n aria-hidden=\"true\"\n >\n ·\n </ds-text>\n ) : null,\n <button\n type=\"button\"\n class={{\n 'select-option__subtext-action': true,\n 'select-option__subtext-action--negative': action.tone === 'negative',\n 'ds-text-action': true,\n 'ds-focus-ring': true,\n }}\n onKeyDown={(event: KeyboardEvent) => event.stopPropagation()}\n onClick={(event: MouseEvent) => {\n event.preventDefault();\n event.stopPropagation();\n this.dsOptionSubtextAction.emit({\n value: option.value,\n actionValue: action.value,\n originalEvent: event,\n });\n }}\n >\n <ds-text\n as=\"span\"\n variant={CONTROL_SUPPORTING_TEXT_VARIANT[this.size]}\n color=\"inherit\"\n >\n {action.label}\n </ds-text>\n </button>,\n ])}\n </span>\n ) : undefined\n }\n action={\n option.action ? (\n <ds-tooltip label={option.action.label} side=\"left\" size=\"sm\">\n <ds-button-unfilled\n id={actionId}\n variant=\"icon\"\n size={OPTION_ACTION_SIZE[this.size]}\n icon=\"Ellipses\"\n rounded\n hasBorder={false}\n activeFill={false}\n ariaLabel={option.action.label}\n haspopup=\"menu\"\n controls={option.action.controls}\n expanded={option.action.expanded}\n surfaceOpen={option.action.surfaceOpen}\n onKeyDown={event => {\n event.stopPropagation();\n if (event.key === 'Escape' || event.key === 'ArrowLeft') {\n event.preventDefault();\n this.controller.focusSearchOrTrigger();\n }\n }}\n onDsClick={(event: CustomEvent<MouseEvent>) => {\n event.stopPropagation();\n this.dsOptionAction.emit({\n value: option.value,\n anchorId: actionId,\n originalEvent: event.detail,\n });\n }}\n />\n </ds-tooltip>\n ) : undefined\n }\n onHover={() => {\n this.focusRingVisible = false;\n this.activeIndex = index;\n }}\n onSelect={() => this.selectOption(option)}\n />\n );\n }\n\n private get captionIconOnly(): boolean {\n return (\n (this.iconOnly || (this.collapseLabel && this.captionCompact)) &&\n Boolean(this.icon || this.isLoading)\n );\n }\n\n private get doubleInset(): boolean {\n return this.isInset && this.insetDepth === 'double' && this.size !== 'xs';\n }\n\n private syncCaptionCompactObserver(): void {\n this.disconnectCaptionCompactObserver();\n if (!this.collapseLabel) {\n if (this.captionCompact) this.captionCompact = false;\n return;\n }\n this.captionCompactDisconnect = observeTableCaptionCompact(this.el, compact => {\n if (this.captionCompact !== compact) this.captionCompact = compact;\n });\n }\n\n private disconnectCaptionCompactObserver(): void {\n this.captionCompactDisconnect?.();\n this.captionCompactDisconnect = undefined;\n }\n\n private renderCaptionTooltip(trigger: VNode, label: string): VNode {\n if (!this.collapseLabel) return trigger;\n return (\n <ds-tooltip label={label} side=\"top\" size=\"sm\">\n {trigger}\n </ds-tooltip>\n );\n }\n\n render() {\n const inactive = this.isDisabled;\n const showPlaceholder = !this.hasSelection;\n const count = this.resolvedValues.length;\n const label = this.multiple\n ? `${this.placeholder}${count > 0 ? ` · ${count}` : ''}`\n : showPlaceholder\n ? this.placeholder\n : (this.triggerLabel ?? this.selectedOption?.label);\n const textVariant = CONTROL_TEXT_VARIANT[this.size];\n const iconSize = ICON_SIZE[this.size];\n const usesOptionIcons = !this.multiple && choiceListUsesIcons(this.allOptions);\n const usesOptionSubtext = choiceListUsesSubtext(this.allOptions);\n const showError = this.error && Boolean(this.errorMessage);\n const describedBy =\n [this.ariaDescribedby, showError ? this.errorId : undefined].filter(Boolean).join(' ') ||\n undefined;\n const popupStyle = {\n position: 'fixed',\n left: '0',\n top: '0',\n transform: `translate(${Math.round(this.position.x)}px, ${Math.round(this.position.y)}px)`,\n zIndex: 'var(--dimension-z-index-floating)',\n visibility: this.positionReady ? 'visible' : 'hidden',\n };\n let flatIndex = 0;\n\n return (\n <Host\n class={{\n 'select-host': true,\n 'ds-select-trigger-host': true,\n 'select-host--multiple': this.multiple,\n 'ds-field-stack': true,\n 'ds-field-stack--supporting-inset': !this.hasBorder,\n 'ds-control-inactive': inactive,\n [`ds-control--${this.size}`]: true,\n 'ds-table-caption-control': this.collapseLabel,\n 'ds-table-caption-control--compact': this.captionIconOnly,\n ...controlWidthClass(this.width),\n [`select-host--background-${this.background}`]: !!this.background,\n [`ds-select-trigger-host--background-${this.background}`]: !!this.background,\n }}\n >\n {this.renderCaptionTooltip(\n <button\n ref={element => {\n this.controller.setTriggerElement((element as HTMLButtonElement) ?? null);\n }}\n id={this.inputId ?? this.generatedId}\n type=\"button\"\n class={{\n trigger: true,\n 'ds-control-frame': true,\n 'ds-focus-ring-inset': true,\n 'ds-interaction-fill': true,\n 'ds-interaction-fill--selected': !inactive && this.activeFill && this.hasSelection,\n 'trigger--expanded': !inactive && this.open,\n 'ds-interaction-fill--surface-open': !inactive && this.open,\n 'trigger--bordered': this.hasBorder,\n 'trigger--rounded': this.rounded,\n 'trigger--placeholder': showPlaceholder && !this.multiple,\n 'trigger--has-value': this.hasSelection && !this.neutralTrigger,\n 'trigger--label-placeholder':\n !this.multiple && Boolean(this.triggerLabel) && this.triggerLabelPlaceholder,\n 'wrapper--error': this.hasBorder && this.error,\n [`ds-control--${this.size}`]: true,\n 'ds-control--inset': this.isInset && !this.doubleInset,\n 'ds-control--inset-double': this.doubleInset,\n ...choiceBackgroundClassMap(this.background),\n }}\n disabled={inactive}\n role=\"combobox\"\n aria-haspopup={this.popupRole}\n aria-expanded={String(this.open)}\n aria-controls={this.open ? this.listboxId : undefined}\n aria-activedescendant={this.open && !this.searchable ? this.activeOptionId : undefined}\n aria-label={this.ariaLabel ?? (this.captionIconOnly ? label : undefined)}\n aria-labelledby={this.ariaLabelledby}\n aria-describedby={describedBy}\n aria-invalid={this.error ? 'true' : undefined}\n aria-required={this.required || undefined}\n aria-busy={this.isLoading ? 'true' : undefined}\n onClick={() => (this.open ? this.closePopup() : this.openPopup(false))}\n onKeyDown={event => {\n const action = this.visibleOptions[this.activeIndex]?.action;\n if (\n this.open &&\n action &&\n (event.key === 'ArrowRight' || (event.key === 'F10' && event.shiftKey))\n ) {\n event.preventDefault();\n document\n .getElementById(`${this.generatedId}-option-action-${this.activeIndex}`)\n ?.querySelector<HTMLElement>('button')\n ?.focus();\n return;\n }\n this.handleTriggerKeyDown(event);\n }}\n >\n {(this.icon || this.isLoading) && (\n <span\n class=\"trigger__prefix ds-control-icon-box ds-interaction-fill__content\"\n aria-hidden=\"true\"\n >\n {this.isLoading ? (\n <ds-loader size={iconSize} color=\"inherit\" />\n ) : (\n <ds-icon name={this.icon} size={iconSize} color=\"inherit\" />\n )}\n </span>\n )}\n {this.captionIconOnly ? null : (\n <span\n class={{\n 'trigger__label-box': true,\n 'ds-interaction-fill__content': true,\n }}\n >\n <span\n class={{\n 'trigger__label-content': true,\n 'ds-control-label-box': true,\n 'ds-control-label-dot': this.dot,\n 'trigger__label-content--dot': this.dot,\n }}\n >\n <ds-text\n class=\"trigger__label\"\n as=\"span\"\n variant={textVariant}\n color=\"inherit\"\n lineTruncation={1}\n >\n {label}\n </ds-text>\n {this.dot && (\n <ds-badge\n class=\"trigger__dot ds-control-label-dot__badge\"\n variant=\"dot\"\n hasRing={false}\n label=\"\"\n aria-hidden=\"true\"\n />\n )}\n </span>\n </span>\n )}\n {this.captionIconOnly || this.indicator === 'none' ? null : (\n <span\n class=\"trigger__chevron ds-control-icon-box ds-interaction-fill__content\"\n aria-hidden=\"true\"\n >\n <ds-icon\n name={this.indicator === 'up-down' ? 'ChevronUpDown' : 'ChevronDown'}\n size={iconSize}\n color=\"inherit\"\n />\n </span>\n )}\n </button>,\n this.captionIconOnly ? this.ariaLabel?.trim() || this.placeholder : ''\n )}\n\n {this.open && (\n <div\n popover=\"manual\"\n ref={element => {\n this.controller.setPopupElement((element as HTMLDivElement) ?? null);\n }}\n class=\"select-popup ds-choice-popup\"\n style={popupStyle}\n >\n {this.searchable && (\n <ChoiceSearch\n size={this.size}\n value={this.searchTerm}\n placeholder={this.searchPlaceholder}\n controls={this.listboxId}\n activeDescendant={this.activeOptionId}\n inputRef={this.controller.setSearchElement}\n clearLabel={this.clearLabel}\n onValueChange={value => {\n this.searchTerm = value;\n }}\n onKeyDown={event => this.handleListKeyDown(event)}\n />\n )}\n <div\n id={this.listboxId}\n class=\"ds-choice-list\"\n role={this.popupRole}\n aria-multiselectable={this.multiple ? 'true' : undefined}\n aria-label={this.ariaLabel ?? this.placeholder}\n aria-busy={this.isLoading ? 'true' : undefined}\n >\n {this.isLoading ? (\n <div\n class=\"ds-choice-loading ds-empty-region\"\n role={this.popupRole === 'grid' ? 'row' : 'option'}\n aria-selected=\"false\"\n aria-disabled=\"true\"\n aria-label={this.loadingLabel}\n aria-live=\"polite\"\n >\n {this.popupRole === 'grid' ? (\n <span role=\"gridcell\">\n <ds-loader size={this.size} color=\"inherit\" />\n </span>\n ) : (\n <ds-loader size={this.size} color=\"inherit\" />\n )}\n </div>\n ) : this.visibleOptions.length === 0 ? (\n <div\n class=\"ds-choice-empty ds-empty-region\"\n role={this.popupRole === 'grid' ? 'row' : 'option'}\n aria-selected=\"false\"\n aria-disabled=\"true\"\n aria-label={this.noResultsText}\n aria-live=\"polite\"\n >\n {this.popupRole === 'grid' ? (\n <span role=\"gridcell\">\n <ds-empty-state body={this.noResultsText} />\n </span>\n ) : (\n <ds-empty-state body={this.noResultsText} />\n )}\n </div>\n ) : (\n this.visibleSections.map((section, sectionIndex) => (\n <div\n class={{\n 'ds-choice-section': true,\n 'ds-chrome-column': true,\n 'ds-chrome-space--sm': true,\n 'ds-choice-section--divided': !!section.divider,\n 'ds-choice-section--headed-after-first':\n sectionIndex > 0 && Boolean(section.header),\n }}\n role={\n this.popupRole === 'grid' ? 'rowgroup' : section.header ? 'group' : undefined\n }\n aria-label={section.header}\n >\n {section.header && this.popupRole === 'grid' ? (\n <ds-text\n class={`ds-choice-section__header ds-control-section-heading ds-control--${this.size}`}\n as=\"span\"\n variant={CONTROL_SUPPORTING_TEXT_VARIANT[this.size]}\n emphasis\n color=\"primary\"\n role=\"row\"\n >\n <span class=\"ds-choice-section__header-label\" role=\"gridcell\">\n {section.header}\n </span>\n </ds-text>\n ) : section.header ? (\n <ds-text\n class={`ds-choice-section__header ds-control-section-heading ds-control--${this.size}`}\n as=\"span\"\n variant={CONTROL_SUPPORTING_TEXT_VARIANT[this.size]}\n emphasis\n color=\"primary\"\n aria-hidden=\"true\"\n >\n <span class=\"ds-choice-section__header-label\">{section.header}</span>\n </ds-text>\n ) : null}\n {section.options.map(option =>\n this.renderOption(option, flatIndex++, usesOptionIcons, usesOptionSubtext)\n )}\n </div>\n ))\n )}\n </div>\n {this.footerActionLabel && !this.isLoading ? (\n <ChoiceActionFooter\n size={this.size}\n label={this.footerActionLabel}\n onAction={this.activateFooterAction}\n />\n ) : this.allowClear && this.hasSelection && !this.isLoading ? (\n <ChoiceFooter\n size={this.size}\n summary={this.multiple ? `${count} ${this.selectedLabel}` : undefined}\n compactSummary={this.multiple ? String(count) : undefined}\n useCompactSummary={this.compactFooterSummary}\n contentRef={element => {\n this.footerContentElement = element ?? undefined;\n }}\n summaryMeasureRef={element => {\n this.footerSummaryMeasureElement = element ?? undefined;\n }}\n clearRef={element => {\n this.footerClearElement = element ?? undefined;\n }}\n clearLabel={this.clearLabel}\n onClear={this.clearSelection}\n />\n ) : null}\n </div>\n )}\n\n {showError && (\n <ds-text\n class=\"error-text\"\n as=\"div\"\n variant=\"text-body-small\"\n color=\"negative\"\n textId={this.errorId}\n role=\"alert\"\n >\n {this.errorMessage}\n </ds-text>\n )}\n </Host>\n );\n }\n}\n"],"mappings":"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","ignoreList":[]}
|
|
@@ -1,2 +0,0 @@
|
|
|
1
|
-
import{p as e,H as r,c as s,h as t,a as i,t as o}from"./index.js";import{d as n}from"./p-D8OWhnID.js";import{r as d}from"./p-rCeztgVn.js";const c=()=>`@media (forced-colors: active){.sc-ds-breadcrumb:root,.sc-ds-breadcrumb-h,.ds-forced-colors-scope.sc-ds-breadcrumb{--ds-forced-color-surface:Canvas;--ds-forced-color-content:CanvasText;--ds-forced-color-control-boundary:ButtonText;--ds-forced-color-selected:Highlight;--ds-forced-color-on-selected:HighlightText;--ds-forced-color-disabled:GrayText}}.sc-ds-breadcrumb-h{--ds-focus-ring-width:var(--dimension-stroke-width-025, 2px);--ds-focus-ring-offset:var(--dimension-space-025, 2px);--ds-focus-ring-color:var(--color-interaction-focus)}.ds-focus-ring.sc-ds-breadcrumb-h,.ds-focus-ring.sc-ds-breadcrumb,.ds-focus-ring-inset.sc-ds-breadcrumb-h,.ds-focus-ring-inset.sc-ds-breadcrumb{outline:none;-webkit-tap-highlight-color:transparent;touch-action:manipulation}.ds-focus-ring.sc-ds-breadcrumb-h:focus-visible,.ds-focus-ring.sc-ds-breadcrumb:focus-visible{outline:var(--ds-focus-ring-width) solid var(--ds-focus-ring-color);outline-offset:var(--ds-focus-ring-offset)}.ds-focus-ring.ds-focus-ring--visible.sc-ds-breadcrumb-h,.ds-focus-ring.ds-focus-ring--visible.sc-ds-breadcrumb{outline:var(--ds-focus-ring-width) solid var(--ds-focus-ring-color);outline-offset:var(--ds-focus-ring-offset)}.ds-focus-ring-inset.sc-ds-breadcrumb-h:focus-visible,.ds-focus-ring-inset.sc-ds-breadcrumb:focus-visible{outline:none}.ds-focus-ring-inset.sc-ds-breadcrumb-h:focus-visible::after,.ds-focus-ring-inset.sc-ds-breadcrumb:focus-visible::after{outline:var(--ds-focus-ring-width) solid var(--ds-focus-ring-color);outline-offset:calc(-1 * var(--ds-focus-ring-width))}.ds-focus-ring-inset.ds-focus-ring--visible.sc-ds-breadcrumb-h,.ds-focus-ring-inset.ds-focus-ring--visible.sc-ds-breadcrumb{outline:none}.ds-focus-ring-inset.ds-focus-ring--visible.sc-ds-breadcrumb-h::after,.ds-focus-ring-inset.ds-focus-ring--visible.sc-ds-breadcrumb::after{outline:var(--ds-focus-ring-width) solid var(--ds-focus-ring-color);outline-offset:calc(-1 * var(--ds-focus-ring-width))}@media (forced-colors: active){.sc-ds-breadcrumb-h{--ds-focus-ring-color:var(--ds-forced-color-selected)}}.ds-visually-hidden.sc-ds-breadcrumb-h,.ds-visually-hidden.sc-ds-breadcrumb{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0, 0, 0, 0);white-space:nowrap;border:0}.sc-ds-breadcrumb:where(.ds-text-decoration,.ds-text-action).sc-ds-breadcrumb{text-decoration-color:var(--ds-text-decoration-color, var(--color-foreground-tertiary));text-decoration-thickness:var(--ds-text-decoration-thickness, var(--dimension-stroke-width-012));text-underline-offset:var(--ds-text-decoration-offset, var(--dimension-space-025))}.ds-text-action.sc-ds-breadcrumb{--ds-text-action-foreground:var(--color-foreground-bold-brand);--ds-text-decoration-color:var(--ds-text-action-foreground);color:var(--ds-text-action-foreground);text-decoration-line:none}.ds-text-action--on-medium.sc-ds-breadcrumb{--ds-text-action-foreground:var(--color-foreground-on-medium-background-primary);--ds-text-decoration-color:var(--color-foreground-on-medium-background-secondary);text-decoration-line:underline}.ds-text-action--on-strong.sc-ds-breadcrumb{--ds-text-action-foreground:var(--color-foreground-on-strong-background-primary);--ds-text-decoration-color:var(--color-foreground-on-strong-background-secondary);text-decoration-line:underline}.ds-text-action--on-bold.sc-ds-breadcrumb{--ds-text-action-foreground:var(--color-foreground-on-bold-background-primary);--ds-text-decoration-color:var(--color-foreground-on-bold-background-secondary);text-decoration-line:underline}@media (hover: hover) and (pointer: fine){.ds-text-action.sc-ds-breadcrumb:hover{text-decoration-line:underline}}@media (forced-colors: active){.ds-text-action.sc-ds-breadcrumb{text-decoration-line:underline;text-decoration-color:currentcolor}}.sc-ds-breadcrumb-h{position:relative;display:block;min-width:0;box-sizing:border-box}.breadcrumb.sc-ds-breadcrumb{inline-size:100%;min-width:0}.breadcrumb__list.sc-ds-breadcrumb{display:flex;align-items:center;box-sizing:border-box;inline-size:100%;min-width:0;margin:0;padding:0;overflow:hidden;list-style:none}.breadcrumb__item.sc-ds-breadcrumb{display:flex;flex:0 0 auto;align-items:center;min-width:0}.breadcrumb__separator.sc-ds-breadcrumb{flex:0 0 auto;margin-inline:var(--dimension-space-050);user-select:none}.breadcrumb__link.sc-ds-breadcrumb,.breadcrumb__current.sc-ds-breadcrumb{display:inline-flex;flex:0 0 auto;min-width:0;overflow:hidden;padding:0;border:0;border-radius:var(--dimension-radius-025);background:transparent;color:var(--color-foreground-secondary);font:inherit;text-decoration:none}.breadcrumb__link.sc-ds-breadcrumb{cursor:default}a.breadcrumb__link.sc-ds-breadcrumb{cursor:pointer}@media (hover: hover) and (pointer: fine){.breadcrumb__link.sc-ds-breadcrumb:hover .breadcrumb__label.sc-ds-breadcrumb{text-decoration-line:underline}}.breadcrumb__label.sc-ds-breadcrumb{--ds-text-decoration-color:var(--color-foreground-quaternary);display:inline-block;inline-size:var(--breadcrumb-label-width, auto);min-width:0}.breadcrumb__measurements.sc-ds-breadcrumb{position:absolute;inset:0 auto auto 0;visibility:hidden;pointer-events:none;white-space:nowrap}.breadcrumb__measurement.sc-ds-breadcrumb{display:inline-block;inline-size:max-content;max-inline-size:none}`;const a=e(class e extends r{constructor(e){super();if(e!==false){this.__registerHost()}this.dsSelect=s(this,"dsSelect",7);this.items=[];this.ariaLabel="Breadcrumb";this.labelWidths=[];this.collapsedLabels=[];this.measurementElements=[];this.separatorElements=[]}componentDidLoad(){this.observeContainer();this.scheduleMeasurement();void document.fonts?.ready.then((()=>this.scheduleMeasurement()))}componentDidRender(){this.observeContainer();this.scheduleMeasurement()}disconnectedCallback(){this.resizeObserver?.disconnect();this.observedElement=undefined;if(this.measurementFrame!==undefined)cancelAnimationFrame(this.measurementFrame)}handleItemsChange(){this.labelWidths=[];this.collapsedLabels=[];this.scheduleMeasurement()}observeContainer(){if(!this.navElement||this.observedElement===this.navElement)return;this.resizeObserver??(this.resizeObserver=new ResizeObserver((()=>this.scheduleMeasurement())));this.resizeObserver.disconnect();this.resizeObserver.observe(this.navElement);this.observedElement=this.navElement}scheduleMeasurement(){if(this.measurementFrame!==undefined)return;this.measurementFrame=requestAnimationFrame((()=>{this.measurementFrame=undefined;this.measureLabels()}))}measureLabels(){if(!this.navElement||!this.listElement||!this.ellipsisMeasurement||this.items.length===0)return;const e=this.items.map(((e,r)=>this.measurementElements[r]?.getBoundingClientRect().width??0));const r=this.ellipsisMeasurement.getBoundingClientRect().width;if(e.some((e=>e===0))||r===0)return;const s=this.separatorElements.reduce(((e,r)=>{const s=getComputedStyle(r);return e+r.getBoundingClientRect().width+Number.parseFloat(s.marginInlineStart)+Number.parseFloat(s.marginInlineEnd)}),0);const t=Math.max(0,this.navElement.clientWidth-s);const i=e.map((e=>Math.min(e,r)));const o=[...i];let n=Math.max(0,t-i.reduce(((e,r)=>e+r),0));for(let r=e.length-1;r>=0&&n>0;r-=1){const s=Math.min(n,e[r]-i[r]);o[r]+=s;n-=s}const d=o.length!==this.labelWidths.length||o.some(((e,r)=>Math.abs(e-(this.labelWidths[r]??0))>.25));const c=o.map(((r,s)=>e[s]>i[s]&&Math.abs(r-i[s])<=.25));const a=c.length!==this.collapsedLabels.length||c.some(((e,r)=>e!==this.collapsedLabels[r]));if(d)this.labelWidths=o;if(a)this.collapsedLabels=c}handleSelect(e,r){const s=this.dsSelect.emit({item:e,originalEvent:r});if(s.defaultPrevented)r.preventDefault()}renderItem(e,r){const s=this.labelWidths[r];const i=this.collapsedLabels[r]??false;const o=[t("ds-text",{class:"breadcrumb__label ds-text-decoration",as:"span",variant:"text-caption",color:"inherit",lineTruncation:i?"none":1,"aria-hidden":i?"true":undefined,style:s===undefined?undefined:{"--breadcrumb-label-width":`${s}px`}},i?"…":e.label),i?t("span",{class:"breadcrumb__accessible-label ds-visually-hidden"},e.label):null];if(e.isCurrent){return t("span",{class:"breadcrumb__current","aria-current":"page","aria-label":e.ariaLabel},o)}const n=d(e.href);if(n){return t("a",{class:"breadcrumb__link ds-focus-ring",href:n,"aria-label":e.ariaLabel,onClick:r=>this.handleSelect(e,r)},o)}return t("button",{class:"breadcrumb__link ds-focus-ring",type:"button","aria-label":e.ariaLabel,onClick:r=>this.handleSelect(e,r)},o)}render(){if(this.items.length===0)return null;this.measurementElements=[];this.separatorElements=[];return t(i,null,t("nav",{class:"breadcrumb","aria-label":this.ariaLabel,ref:e=>{this.navElement=e}},t("div",{class:"breadcrumb__measurements","aria-hidden":"true"},this.items.map(((e,r)=>t("ds-text",{class:"breadcrumb__measurement",as:"span",variant:"text-caption",color:"inherit",ref:e=>{if(e)this.measurementElements[r]=e}},e.label))),t("ds-text",{class:"breadcrumb__measurement",as:"span",variant:"text-caption",color:"inherit",ref:e=>{this.ellipsisMeasurement=e}},"…")),t("ol",{class:"breadcrumb__list",ref:e=>{this.listElement=e}},this.items.map(((e,r)=>t("li",{class:"breadcrumb__item",key:e.id},r>0?t("ds-text",{class:"breadcrumb__separator",as:"span",variant:"text-caption",color:"tertiary","aria-hidden":"true",ref:e=>{if(e)this.separatorElements[r-1]=e}},"/"):null,this.renderItem(e,r)))))))}static get watchers(){return{items:[{handleItemsChange:0}]}}static get style(){return c()}},[2,"ds-breadcrumb",{items:[16],ariaLabel:[1,"aria-label"],labelWidths:[32],collapsedLabels:[32]},undefined,{items:[{handleItemsChange:0}]}]);function u(){if(typeof customElements==="undefined"){return}const e=["ds-breadcrumb","ds-text"];e.forEach((e=>{switch(e){case"ds-breadcrumb":if(!customElements.get(o(e))){customElements.define(o(e),a)}break;case"ds-text":if(!customElements.get(o(e))){n()}break}}))}u();export{a as B,u as d};
|
|
2
|
-
//# sourceMappingURL=p-DVEx-Xg9.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"names":["breadcrumbCss","Breadcrumb","__stencil_proxyCustomElement","HTMLElement","constructor","registerHost","this","items","ariaLabel","labelWidths","collapsedLabels","measurementElements","separatorElements","componentDidLoad","observeContainer","scheduleMeasurement","document","fonts","ready","then","componentDidRender","disconnectedCallback","resizeObserver","disconnect","observedElement","undefined","measurementFrame","cancelAnimationFrame","handleItemsChange","navElement","ResizeObserver","observe","requestAnimationFrame","measureLabels","listElement","ellipsisMeasurement","length","naturalWidths","map","_","index","getBoundingClientRect","width","ellipsisWidth","some","separatorWidth","reduce","total","separator","styles","getComputedStyle","Number","parseFloat","marginInlineStart","marginInlineEnd","availableWidth","Math","max","clientWidth","minimumWidths","min","nextWidths","remainingWidth","extraWidth","widthsChanged","abs","nextCollapsedLabels","collapsedLabelsChanged","isCollapsed","handleSelect","item","originalEvent","event","dsSelect","emit","defaultPrevented","preventDefault","renderItem","allocatedWidth","label","h","class","as","variant","color","lineTruncation","style","isCurrent","href","resolveSafeUrl","onClick","type","render","Host","ref","element","key","id"],"sources":["src/wc/components/Breadcrumb/Breadcrumb.css?tag=ds-breadcrumb&encapsulation=scoped","src/wc/components/Breadcrumb/Breadcrumb.tsx"],"sourcesContent":["@import '../../utils/focus-ring.css';\n@import '../../utils/visually-hidden.css';\n@import '../../utils/text-decoration.css';\n\n:host {\n position: relative;\n display: block;\n min-width: 0;\n box-sizing: border-box;\n}\n\n.breadcrumb {\n inline-size: 100%;\n min-width: 0;\n}\n\n.breadcrumb__list {\n display: flex;\n align-items: center;\n box-sizing: border-box;\n inline-size: 100%;\n min-width: 0;\n margin: 0;\n padding: 0;\n overflow: hidden;\n list-style: none;\n}\n\n.breadcrumb__item {\n display: flex;\n flex: 0 0 auto;\n align-items: center;\n min-width: 0;\n}\n\n.breadcrumb__separator {\n flex: 0 0 auto;\n margin-inline: var(--dimension-space-050);\n user-select: none;\n}\n\n.breadcrumb__link,\n.breadcrumb__current {\n display: inline-flex;\n flex: 0 0 auto;\n min-width: 0;\n overflow: hidden;\n padding: 0;\n border: 0;\n border-radius: var(--dimension-radius-025);\n background: transparent;\n color: var(--color-foreground-secondary);\n font: inherit;\n text-decoration: none;\n}\n\n.breadcrumb__link {\n cursor: default;\n}\n\na.breadcrumb__link {\n cursor: pointer;\n}\n\n@media (hover: hover) and (pointer: fine) {\n .breadcrumb__link:hover .breadcrumb__label {\n text-decoration-line: underline;\n }\n}\n\n.breadcrumb__label {\n --ds-text-decoration-color: var(--color-foreground-quaternary);\n\n display: inline-block;\n inline-size: var(--breadcrumb-label-width, auto);\n min-width: 0;\n}\n\n.breadcrumb__measurements {\n position: absolute;\n inset: 0 auto auto 0;\n visibility: hidden;\n pointer-events: none;\n white-space: nowrap;\n}\n\n.breadcrumb__measurement {\n display: inline-block;\n inline-size: max-content;\n max-inline-size: none;\n}\n","import { Component, Event, EventEmitter, h, Host, Prop, State, Watch } from '@stencil/core';\nimport { resolveSafeUrl } from '../../utils';\nimport type { BreadcrumbItem, BreadcrumbSelectDetail } from './breadcrumb-types';\n\n@Component({\n tag: 'ds-breadcrumb',\n styleUrl: 'Breadcrumb.css',\n scoped: true,\n})\nexport class Breadcrumb {\n /** Ordered path from the broadest ancestor to the nearest page. */\n @Prop() items: BreadcrumbItem[] = [];\n\n /** Accessible name for the breadcrumb navigation landmark. */\n @Prop() ariaLabel: string = 'Breadcrumb';\n\n /** Emitted when an interactive breadcrumb item is activated. Prevent to cancel native navigation. */\n @Event({ cancelable: true }) dsSelect!: EventEmitter<BreadcrumbSelectDetail>;\n\n @State() private labelWidths: number[] = [];\n @State() private collapsedLabels: boolean[] = [];\n\n private navElement?: HTMLElement;\n private listElement?: HTMLOListElement;\n private measurementElements: HTMLElement[] = [];\n private separatorElements: HTMLElement[] = [];\n private ellipsisMeasurement?: HTMLElement;\n private resizeObserver?: ResizeObserver;\n private observedElement?: HTMLElement;\n private measurementFrame?: number;\n\n componentDidLoad() {\n this.observeContainer();\n this.scheduleMeasurement();\n void document.fonts?.ready.then(() => this.scheduleMeasurement());\n }\n\n componentDidRender() {\n this.observeContainer();\n this.scheduleMeasurement();\n }\n\n disconnectedCallback() {\n this.resizeObserver?.disconnect();\n this.observedElement = undefined;\n if (this.measurementFrame !== undefined) cancelAnimationFrame(this.measurementFrame);\n }\n\n @Watch('items')\n handleItemsChange() {\n this.labelWidths = [];\n this.collapsedLabels = [];\n this.scheduleMeasurement();\n }\n\n private observeContainer() {\n if (!this.navElement || this.observedElement === this.navElement) return;\n this.resizeObserver ??= new ResizeObserver(() => this.scheduleMeasurement());\n this.resizeObserver.disconnect();\n this.resizeObserver.observe(this.navElement);\n this.observedElement = this.navElement;\n }\n\n private scheduleMeasurement() {\n if (this.measurementFrame !== undefined) return;\n this.measurementFrame = requestAnimationFrame(() => {\n this.measurementFrame = undefined;\n this.measureLabels();\n });\n }\n\n private measureLabels() {\n if (\n !this.navElement ||\n !this.listElement ||\n !this.ellipsisMeasurement ||\n this.items.length === 0\n )\n return;\n\n const naturalWidths = this.items.map(\n (_, index) => this.measurementElements[index]?.getBoundingClientRect().width ?? 0\n );\n const ellipsisWidth = this.ellipsisMeasurement.getBoundingClientRect().width;\n if (naturalWidths.some(width => width === 0) || ellipsisWidth === 0) return;\n\n const separatorWidth = this.separatorElements.reduce((total, separator) => {\n const styles = getComputedStyle(separator);\n return (\n total +\n separator.getBoundingClientRect().width +\n Number.parseFloat(styles.marginInlineStart) +\n Number.parseFloat(styles.marginInlineEnd)\n );\n }, 0);\n const availableWidth = Math.max(0, this.navElement.clientWidth - separatorWidth);\n const minimumWidths = naturalWidths.map(width => Math.min(width, ellipsisWidth));\n const nextWidths = [...minimumWidths];\n let remainingWidth = Math.max(\n 0,\n availableWidth - minimumWidths.reduce((total, width) => total + width, 0)\n );\n\n // Protect the current/newest location. Extra width is granted newest-to-oldest,\n // so ancestors collapse in path order as the available space decreases.\n for (let index = naturalWidths.length - 1; index >= 0 && remainingWidth > 0; index -= 1) {\n const extraWidth = Math.min(remainingWidth, naturalWidths[index] - minimumWidths[index]);\n nextWidths[index] += extraWidth;\n remainingWidth -= extraWidth;\n }\n\n const widthsChanged =\n nextWidths.length !== this.labelWidths.length ||\n nextWidths.some((width, index) => Math.abs(width - (this.labelWidths[index] ?? 0)) > 0.25);\n const nextCollapsedLabels = nextWidths.map(\n (width, index) =>\n naturalWidths[index] > minimumWidths[index] &&\n Math.abs(width - minimumWidths[index]) <= 0.25\n );\n const collapsedLabelsChanged =\n nextCollapsedLabels.length !== this.collapsedLabels.length ||\n nextCollapsedLabels.some((isCollapsed, index) => isCollapsed !== this.collapsedLabels[index]);\n if (widthsChanged) this.labelWidths = nextWidths;\n if (collapsedLabelsChanged) this.collapsedLabels = nextCollapsedLabels;\n }\n\n private handleSelect(item: BreadcrumbItem, originalEvent: MouseEvent) {\n const event = this.dsSelect.emit({ item, originalEvent });\n if (event.defaultPrevented) originalEvent.preventDefault();\n }\n\n private renderItem(item: BreadcrumbItem, index: number) {\n const allocatedWidth = this.labelWidths[index];\n const isCollapsed = this.collapsedLabels[index] ?? false;\n const label = [\n <ds-text\n class=\"breadcrumb__label ds-text-decoration\"\n as=\"span\"\n variant=\"text-caption\"\n color=\"inherit\"\n lineTruncation={isCollapsed ? 'none' : 1}\n aria-hidden={isCollapsed ? 'true' : undefined}\n style={\n allocatedWidth === undefined\n ? undefined\n : { '--breadcrumb-label-width': `${allocatedWidth}px` }\n }\n >\n {isCollapsed ? '…' : item.label}\n </ds-text>,\n isCollapsed ? (\n <span class=\"breadcrumb__accessible-label ds-visually-hidden\">{item.label}</span>\n ) : null,\n ];\n\n if (item.isCurrent) {\n return (\n <span class=\"breadcrumb__current\" aria-current=\"page\" aria-label={item.ariaLabel}>\n {label}\n </span>\n );\n }\n\n const href = resolveSafeUrl(item.href);\n if (href) {\n return (\n <a\n class=\"breadcrumb__link ds-focus-ring\"\n href={href}\n aria-label={item.ariaLabel}\n onClick={(event: MouseEvent) => this.handleSelect(item, event)}\n >\n {label}\n </a>\n );\n }\n\n return (\n <button\n class=\"breadcrumb__link ds-focus-ring\"\n type=\"button\"\n aria-label={item.ariaLabel}\n onClick={(event: MouseEvent) => this.handleSelect(item, event)}\n >\n {label}\n </button>\n );\n }\n\n render() {\n if (this.items.length === 0) return null;\n\n this.measurementElements = [];\n this.separatorElements = [];\n\n return (\n <Host>\n <nav\n class=\"breadcrumb\"\n aria-label={this.ariaLabel}\n ref={element => {\n this.navElement = element;\n }}\n >\n <div class=\"breadcrumb__measurements\" aria-hidden=\"true\">\n {this.items.map((item, index) => (\n <ds-text\n class=\"breadcrumb__measurement\"\n as=\"span\"\n variant=\"text-caption\"\n color=\"inherit\"\n ref={element => {\n if (element) this.measurementElements[index] = element;\n }}\n >\n {item.label}\n </ds-text>\n ))}\n <ds-text\n class=\"breadcrumb__measurement\"\n as=\"span\"\n variant=\"text-caption\"\n color=\"inherit\"\n ref={element => {\n this.ellipsisMeasurement = element;\n }}\n >\n …\n </ds-text>\n </div>\n <ol\n class=\"breadcrumb__list\"\n ref={element => {\n this.listElement = element;\n }}\n >\n {this.items.map((item, index) => (\n <li class=\"breadcrumb__item\" key={item.id}>\n {index > 0 ? (\n <ds-text\n class=\"breadcrumb__separator\"\n as=\"span\"\n variant=\"text-caption\"\n color=\"tertiary\"\n aria-hidden=\"true\"\n ref={element => {\n if (element) this.separatorElements[index - 1] = element;\n }}\n >\n /\n </ds-text>\n ) : null}\n {this.renderItem(item, index)}\n </li>\n ))}\n </ol>\n </nav>\n </Host>\n );\n }\n}\n"],"mappings":"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","ignoreList":[]}
|
|
@@ -1,2 +0,0 @@
|
|
|
1
|
-
import{p as e,H as t,c as i,h as s,a as r,t as a}from"./index.js";import{C as n,c as o,a as d,b as c,t as l,r as h,d as p}from"./p-BxduVc5g.js";import{g,i as b}from"./p-BQq26pt9.js";import{b as u,f,r as v,a as m,c as _,s as w,d as x,e as y,g as k,h as I,i as C,j as A,v as T,o as z,k as L,l as M,m as S,n as B,p as j,q as E}from"./p-BWSIw8AQ.js";import{d as D}from"./p-CwdRaJER.js";import{d as O}from"./p-MOJmB6vX.js";import{d as F}from"./p-D6FRqNhN.js";import{d as V}from"./p-DjkUFlDW.js";import{d as R}from"./p-0XTyQNRG.js";import{d as H}from"./p-Dnt5xUBD.js";import{d as q}from"./p-B9y6azEw.js";import{d as $}from"./p-Cgn-BORA.js";import{d as P}from"./p-B9TM6FqC.js";import{d as W}from"./p-D8OWhnID.js";import{d as G}from"./p-DIQiHX0q.js";const Q=()=>`.sc-ds-bar-page-title-h,.sc-ds-bar-page-title:where(.ds-table),.sc-ds-bar-page-title:where(.tooltip-popup),.sc-ds-bar-page-title:where(.ds-radius){--ds-radius-control:var(--dimension-radius-025);--ds-radius-card:var(--dimension-radius-050);--ds-radius-modal:var(--dimension-radius-050);--ds-radius-menu:var(--dimension-radius-075);--ds-radius-tooltip-control:var(--dimension-radius-025);--ds-radius-tooltip-menu:var(--dimension-radius-075);--ds-radius-table:var(--dimension-radius-050)}.ds-control--lg.sc-ds-bar-page-title,.ds-control--lg.sc-ds-bar-page-title-h,.ds-control--md.sc-ds-bar-page-title-h,.ds-control--md.sc-ds-bar-page-title,.ds-control--sm.sc-ds-bar-page-title-h,.ds-control--sm.sc-ds-bar-page-title,.ds-control--xs.sc-ds-bar-page-title-h,.ds-control--xs.sc-ds-bar-page-title{--ds-control-radius:var(--ds-radius-control)}.ds-control--lg.sc-ds-bar-page-title-h,.ds-control--lg.sc-ds-bar-page-title{--ds-control-height:var(--dimension-size-500);--ds-control-icon:var(--dimension-iconography-lg);--ds-control-padding-inline:var(--dimension-space-100);--ds-control-label-inset:var(--dimension-space-050);--ds-control-gap:var(--dimension-space-050)}.ds-control--md.sc-ds-bar-page-title-h,.ds-control--md.sc-ds-bar-page-title{--ds-control-height:var(--dimension-size-400);--ds-control-icon:var(--dimension-iconography-md);--ds-control-padding-inline:var(--dimension-space-075);--ds-control-label-inset:var(--dimension-space-025);--ds-control-gap:var(--dimension-space-050)}.ds-control--sm.sc-ds-bar-page-title-h,.ds-control--sm.sc-ds-bar-page-title{--ds-control-height:var(--dimension-size-300);--ds-control-icon:var(--dimension-iconography-sm);--ds-control-padding-inline:var(--dimension-space-050);--ds-control-label-inset:var(--dimension-space-025);--ds-control-gap:var(--dimension-space-025)}.ds-control--xs.sc-ds-bar-page-title-h,.ds-control--xs.sc-ds-bar-page-title{--ds-control-height:var(--dimension-size-200);--ds-control-icon:var(--dimension-iconography-xs);--ds-control-padding-inline:var(--dimension-space-025);--ds-control-label-inset:var(--dimension-space-025);--ds-control-gap:0}.ds-control-frame.sc-ds-bar-page-title{display:inline-flex;align-items:center;box-sizing:border-box;height:var(--ds-control-height, var(--dimension-size-400));padding-inline:var(--ds-control-padding-inline, var(--dimension-space-075));gap:var(--ds-control-gap, var(--dimension-space-050));border-radius:var(--ds-control-radius, var(--dimension-radius-025))}.ds-control-section-heading.sc-ds-bar-page-title{display:flex;align-items:center;box-sizing:border-box;height:var(--ds-control-height, var(--dimension-size-400));padding-inline:calc( var(--ds-control-padding-inline, var(--dimension-space-075)) + var(--ds-control-label-inset, var(--dimension-space-025)) )}.ds-control-icon-box.sc-ds-bar-page-title{display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;width:var(--ds-control-icon, var(--dimension-iconography-md));height:var(--ds-control-icon, var(--dimension-iconography-md))}.ds-control-label-box.sc-ds-bar-page-title{min-width:0;padding-inline:var(--ds-control-label-inset, var(--dimension-space-025))}.ds-control-label-dot.sc-ds-bar-page-title{position:relative;padding-inline-end:calc( var(--ds-control-label-inset, var(--dimension-space-025)) + var(--ds-control-gap, var(--dimension-space-050)) )}.ds-control-label-dot__badge.sc-ds-bar-page-title{position:absolute;inset-block-start:0;inset-inline-end:0;pointer-events:none}.ds-control--lg.sc-ds-bar-page-title,.ds-control--lg.sc-ds-bar-page-title-h,.ds-control--md.sc-ds-bar-page-title-h,.ds-control--md.sc-ds-bar-page-title,.ds-control--sm.sc-ds-bar-page-title-h,.ds-control--sm.sc-ds-bar-page-title,.ds-control--xs.sc-ds-bar-page-title-h,.ds-control--xs.sc-ds-bar-page-title{--ds-control-radius:var(--ds-radius-control)}.ds-control--lg.sc-ds-bar-page-title-h,.ds-control--lg.sc-ds-bar-page-title{--ds-control-height:var(--dimension-size-500);--ds-control-icon:var(--dimension-iconography-lg);--ds-control-padding-inline:var(--dimension-space-100);--ds-control-label-inset:var(--dimension-space-050);--ds-control-gap:var(--dimension-space-050)}.ds-control--md.sc-ds-bar-page-title-h,.ds-control--md.sc-ds-bar-page-title{--ds-control-height:var(--dimension-size-400);--ds-control-icon:var(--dimension-iconography-md);--ds-control-padding-inline:var(--dimension-space-075);--ds-control-label-inset:var(--dimension-space-025);--ds-control-gap:var(--dimension-space-050)}.ds-control--sm.sc-ds-bar-page-title-h,.ds-control--sm.sc-ds-bar-page-title{--ds-control-height:var(--dimension-size-300);--ds-control-icon:var(--dimension-iconography-sm);--ds-control-padding-inline:var(--dimension-space-050);--ds-control-label-inset:var(--dimension-space-025);--ds-control-gap:var(--dimension-space-025)}.ds-control--xs.sc-ds-bar-page-title-h,.ds-control--xs.sc-ds-bar-page-title{--ds-control-height:var(--dimension-size-200);--ds-control-icon:var(--dimension-iconography-xs);--ds-control-padding-inline:var(--dimension-space-025);--ds-control-label-inset:var(--dimension-space-025);--ds-control-gap:0}.ds-chrome-header.sc-ds-bar-page-title{display:flex;align-items:center;box-sizing:border-box;min-width:0;min-block-size:var(--dimension-size-600);padding:var(--dimension-space-100);gap:var(--dimension-space-100)}.ds-chrome-header--wrapping.sc-ds-bar-page-title{flex-wrap:wrap}.ds-chrome-header--bounded.sc-ds-bar-page-title{border-block-end:var(--dimension-stroke-width-012) solid var(--color-border-tertiary)}.ds-chrome-header__leading.sc-ds-bar-page-title,.ds-chrome-header__trailing.sc-ds-bar-page-title{display:flex;align-items:center;flex:0 0 auto;min-width:0}.ds-chrome-header__trailing.sc-ds-bar-page-title{margin-inline-start:auto;gap:var(--dimension-space-100)}.ds-chrome-header__copy.sc-ds-bar-page-title{display:flex;flex:1 1 0;min-width:0;padding:var(--ds-control-padding-inline, var(--dimension-space-075));box-sizing:border-box}.ds-chrome-header__copy--wrapping.sc-ds-bar-page-title{align-items:baseline;flex-wrap:wrap;column-gap:var(--dimension-space-100);row-gap:var(--dimension-space-050)}.ds-chrome-header__copy--stacked.sc-ds-bar-page-title{align-items:stretch;flex-direction:column;gap:var(--dimension-space-050)}.ds-chrome-header__heading.sc-ds-bar-page-title,.ds-chrome-header__description.sc-ds-bar-page-title{width:auto;min-width:0;padding-inline:var(--ds-control-label-inset, var(--dimension-space-025));box-sizing:border-box}.ds-chrome-header__heading.sc-ds-bar-page-title{flex:0 1 auto}.ds-chrome-header__copy--wrapping.sc-ds-bar-page-title .ds-chrome-header__description.sc-ds-bar-page-title{flex:1 1 var(--dimension-card-width-xs)}@media (forced-colors: active){.sc-ds-bar-page-title:root,.sc-ds-bar-page-title-h,.ds-forced-colors-scope.sc-ds-bar-page-title{--ds-forced-color-surface:Canvas;--ds-forced-color-content:CanvasText;--ds-forced-color-control-boundary:ButtonText;--ds-forced-color-selected:Highlight;--ds-forced-color-on-selected:HighlightText;--ds-forced-color-disabled:GrayText}}.sc-ds-bar-page-title-h{--ds-focus-ring-width:var(--dimension-stroke-width-025, 2px);--ds-focus-ring-offset:var(--dimension-space-025, 2px);--ds-focus-ring-color:var(--color-interaction-focus)}.ds-focus-ring.sc-ds-bar-page-title-h,.ds-focus-ring.sc-ds-bar-page-title,.ds-focus-ring-inset.sc-ds-bar-page-title-h,.ds-focus-ring-inset.sc-ds-bar-page-title{outline:none;-webkit-tap-highlight-color:transparent;touch-action:manipulation}.ds-focus-ring.sc-ds-bar-page-title-h:focus-visible,.ds-focus-ring.sc-ds-bar-page-title:focus-visible{outline:var(--ds-focus-ring-width) solid var(--ds-focus-ring-color);outline-offset:var(--ds-focus-ring-offset)}.ds-focus-ring.ds-focus-ring--visible.sc-ds-bar-page-title-h,.ds-focus-ring.ds-focus-ring--visible.sc-ds-bar-page-title{outline:var(--ds-focus-ring-width) solid var(--ds-focus-ring-color);outline-offset:var(--ds-focus-ring-offset)}.ds-focus-ring-inset.sc-ds-bar-page-title-h:focus-visible,.ds-focus-ring-inset.sc-ds-bar-page-title:focus-visible{outline:none}.ds-focus-ring-inset.sc-ds-bar-page-title-h:focus-visible::after,.ds-focus-ring-inset.sc-ds-bar-page-title:focus-visible::after{outline:var(--ds-focus-ring-width) solid var(--ds-focus-ring-color);outline-offset:calc(-1 * var(--ds-focus-ring-width))}.ds-focus-ring-inset.ds-focus-ring--visible.sc-ds-bar-page-title-h,.ds-focus-ring-inset.ds-focus-ring--visible.sc-ds-bar-page-title{outline:none}.ds-focus-ring-inset.ds-focus-ring--visible.sc-ds-bar-page-title-h::after,.ds-focus-ring-inset.ds-focus-ring--visible.sc-ds-bar-page-title::after{outline:var(--ds-focus-ring-width) solid var(--ds-focus-ring-color);outline-offset:calc(-1 * var(--ds-focus-ring-width))}@media (forced-colors: active){.sc-ds-bar-page-title-h{--ds-focus-ring-color:var(--ds-forced-color-selected)}}@media (forced-colors: active){.sc-ds-bar-page-title:root,.sc-ds-bar-page-title-h,.ds-forced-colors-scope.sc-ds-bar-page-title{--ds-forced-color-surface:Canvas;--ds-forced-color-content:CanvasText;--ds-forced-color-control-boundary:ButtonText;--ds-forced-color-selected:Highlight;--ds-forced-color-on-selected:HighlightText;--ds-forced-color-disabled:GrayText}}.ds-interaction-fill.sc-ds-bar-page-title-h,.ds-interaction-fill.sc-ds-bar-page-title{position:var(--ds-interaction-position, relative);z-index:var(--ds-interaction-z-index, 0);cursor:default;--ds-interaction-hover:var(--color-interaction-hover);--ds-interaction-pressed:var(--color-interaction-pressed);--ds-interaction-active:var(--color-interaction-active-brand);--ds-interaction-border-width:0px;--ds-interaction-border-color:transparent;--ds-interaction-divider-width:0px;--ds-interaction-divider-color:transparent;--ds-interaction-divider-inline-start-width:0px;--ds-interaction-divider-inline-start-color:transparent;--ds-interaction-divider-inline-end-width:0px;--ds-interaction-divider-inline-end-color:transparent}.ds-interaction-fill.sc-ds-bar-page-title-h::before,.ds-interaction-fill.sc-ds-bar-page-title::before,.ds-interaction-fill.sc-ds-bar-page-title-h::after,.ds-interaction-fill.sc-ds-bar-page-title::after{content:'';position:absolute;inset:0;border-radius:inherit;background:transparent;pointer-events:none;cursor:inherit;transition:none}.ds-interaction-fill.sc-ds-bar-page-title-h::before,.ds-interaction-fill.sc-ds-bar-page-title::before{z-index:1}.ds-interaction-fill.sc-ds-bar-page-title-h::after,.ds-interaction-fill.sc-ds-bar-page-title::after{z-index:3;box-shadow:inset 0 calc(-1 * var(--ds-interaction-divider-width)) 0 var(--ds-interaction-divider-color), inset var(--ds-interaction-divider-inline-start-width) 0 0 var(--ds-interaction-divider-inline-start-color), inset calc(-1 * var(--ds-interaction-divider-inline-end-width)) 0 0 var(--ds-interaction-divider-inline-end-color), inset 0 0 0 var(--ds-interaction-border-width) var(--ds-interaction-border-color)}.ds-interaction-fill--bordered.sc-ds-bar-page-title-h,.ds-interaction-fill--bordered.sc-ds-bar-page-title{--ds-interaction-border-width:var(--dimension-stroke-width-012);--ds-interaction-border-color:var(--color-border-secondary)}.ds-interaction-fill--selected.sc-ds-bar-page-title-h::before,.ds-interaction-fill--selected.sc-ds-bar-page-title::before{background:var(--ds-interaction-active)}.ds-interaction-fill--selected.sc-ds-bar-page-title-h,.ds-interaction-fill--selected.sc-ds-bar-page-title{--ds-interaction-dot-ring:var(--ds-interaction-active)}@media (hover: hover) and (pointer: fine){.ds-interaction-fill.sc-ds-bar-page-title-h:hover:not(:disabled)::after,.ds-interaction-fill.sc-ds-bar-page-title:hover:not(:disabled)::after{background:var(--ds-interaction-hover)}}.ds-interaction-fill.sc-ds-bar-page-title-h:active:not(:disabled)::after,.ds-interaction-fill.sc-ds-bar-page-title:active:not(:disabled)::after{background:var(--ds-interaction-pressed)}.ds-interaction-fill--grouped.sc-ds-bar-page-title-h::after,.ds-interaction-fill--grouped.sc-ds-bar-page-title::after,.ds-interaction-fill--grouped.sc-ds-bar-page-title-h:active:not(:disabled)::after,.ds-interaction-fill--grouped.sc-ds-bar-page-title:active:not(:disabled)::after{background:var(--ds-interaction-group-fill, transparent)}@media (hover: hover) and (pointer: fine){.ds-interaction-fill--grouped.sc-ds-bar-page-title-h:hover:not(:disabled)::after,.ds-interaction-fill--grouped.sc-ds-bar-page-title:hover:not(:disabled)::after{background:var(--ds-interaction-group-fill, transparent)}}.ds-interaction-fill--grouped.sc-ds-bar-page-title-h,.ds-interaction-fill--grouped.sc-ds-bar-page-title{--ds-interaction-divider-width:var(--ds-interaction-group-divider-width, 0px);--ds-interaction-divider-color:var(--ds-interaction-group-divider-color, transparent);--ds-interaction-divider-inline-start-width:var( --ds-interaction-group-divider-inline-start-width, 0px );--ds-interaction-divider-inline-start-color:var( --ds-interaction-group-divider-inline-start-color, transparent );--ds-interaction-divider-inline-end-width:var( --ds-interaction-group-divider-inline-end-width, 0px );--ds-interaction-divider-inline-end-color:var( --ds-interaction-group-divider-inline-end-color, transparent )}.ds-interaction-fill.sc-ds-bar-page-title-h>.ds-interaction-fill__content.sc-ds-bar-page-title,.ds-interaction-fill.sc-ds-bar-page-title>.ds-interaction-fill__content.sc-ds-bar-page-title,.ds-interaction-fill__content.sc-ds-bar-page-title{position:relative;z-index:2;cursor:inherit}.ds-interaction-fill--on-faint.sc-ds-bar-page-title-h,.ds-interaction-fill--on-faint.sc-ds-bar-page-title{--ds-interaction-active:var(--color-interaction-active)}.ds-interaction-fill--on-medium.sc-ds-bar-page-title-h,.ds-interaction-fill--on-medium.sc-ds-bar-page-title{--ds-interaction-hover:var(--color-interaction-on-medium-background-hover);--ds-interaction-pressed:var(--color-interaction-on-medium-background-pressed);--ds-interaction-active:var(--color-interaction-on-medium-background-active);--ds-focus-ring-color:var(--color-interaction-on-medium-background-focus)}.ds-interaction-fill--on-bold.sc-ds-bar-page-title-h,.ds-interaction-fill--on-bold.sc-ds-bar-page-title{--ds-interaction-hover:var(--color-interaction-on-bold-background-hover);--ds-interaction-pressed:var(--color-interaction-on-bold-background-pressed);--ds-interaction-active:var(--color-interaction-on-bold-background-active);--ds-focus-ring-color:var(--color-interaction-on-bold-background-focus)}.ds-interaction-fill--on-strong.sc-ds-bar-page-title-h,.ds-interaction-fill--on-strong.sc-ds-bar-page-title{--ds-interaction-hover:var(--color-interaction-on-strong-background-hover);--ds-interaction-pressed:var(--color-interaction-on-strong-background-pressed);--ds-interaction-active:var(--color-interaction-on-strong-background-active);--ds-focus-ring-color:var(--color-interaction-on-strong-background-focus)}.ds-interaction-fill--on-translucent.sc-ds-bar-page-title-h,.ds-interaction-fill--on-translucent.sc-ds-bar-page-title{--ds-interaction-hover:var(--color-translucent-interaction-hover);--ds-interaction-pressed:var(--color-translucent-interaction-pressed);--ds-interaction-active:var(--color-translucent-interaction-active-brand);--ds-focus-ring-color:var(--color-translucent-interaction-focus)}.ds-interaction-fill--on-inverted.sc-ds-bar-page-title-h,.ds-interaction-fill--on-inverted.sc-ds-bar-page-title{--ds-interaction-hover:var(--color-inverted-interaction-hover);--ds-interaction-pressed:var(--color-inverted-interaction-pressed);--ds-interaction-active:var(--color-inverted-interaction-active-brand);--ds-focus-ring-color:var(--color-inverted-interaction-focus)}.ds-interaction-fill--on-media.sc-ds-bar-page-title-h,.ds-interaction-fill--on-media.sc-ds-bar-page-title{--ds-interaction-hover:var(--color-media-interaction-hover);--ds-interaction-pressed:var(--color-media-interaction-pressed);--ds-interaction-active:var(--color-media-interaction-active);--ds-focus-ring-color:var(--color-media-interaction-focus)}.ds-interaction-fill--on-always-dark.sc-ds-bar-page-title-h,.ds-interaction-fill--on-always-dark.sc-ds-bar-page-title{--ds-interaction-hover:var(--color-always-dark-interaction-hover);--ds-interaction-pressed:var(--color-always-dark-interaction-pressed);--ds-interaction-active:var(--color-always-dark-interaction-active-brand);--ds-focus-ring-color:var(--color-always-dark-interaction-focus)}.ds-interaction-fill--on-chrome.sc-ds-bar-page-title-h,.ds-interaction-fill--on-chrome.sc-ds-bar-page-title{--ds-interaction-hover:var(--color-chrome-interaction-hover);--ds-interaction-pressed:var(--color-chrome-interaction-pressed);--ds-interaction-active:var(--color-chrome-interaction-active);--ds-focus-ring-color:var(--color-chrome-interaction-focus)}.ds-interaction-fill--on-navigation.sc-ds-bar-page-title-h,.ds-interaction-fill--on-navigation.sc-ds-bar-page-title{--ds-interaction-hover:var(--color-navigation-interaction-hover);--ds-interaction-pressed:var(--color-navigation-interaction-pressed);--ds-interaction-active:var(--color-navigation-interaction-active);--ds-focus-ring-color:var(--color-navigation-interaction-focus)}.ds-interaction-fill.ds-interaction-fill--surface-open.sc-ds-bar-page-title-h:not(:disabled)::after,.ds-interaction-fill.ds-interaction-fill--surface-open.sc-ds-bar-page-title:not(:disabled)::after{background:var(--ds-interaction-pressed)}@media (forced-colors: active){.ds-interaction-fill.sc-ds-bar-page-title-h::after,.ds-interaction-fill.sc-ds-bar-page-title::after{box-shadow:none;outline:var(--ds-interaction-border-width) solid var(--ds-forced-color-control-boundary);outline-offset:calc(-1 * var(--ds-interaction-border-width))}.ds-interaction-fill--surface-open.sc-ds-bar-page-title-h:not(:disabled):not(:focus-visible):not(:focus-within):not(.ds-focus-ring--visible)::after,.ds-interaction-fill--surface-open.sc-ds-bar-page-title:not(:disabled):not(:focus-visible):not(:focus-within):not(.ds-focus-ring--visible)::after{outline:var(--dimension-stroke-width-025) dashed var(--ds-forced-color-control-boundary);outline-offset:calc(-1 * var(--dimension-stroke-width-025))}.ds-interaction-fill--selected.sc-ds-bar-page-title-h::before,.ds-interaction-fill--selected.sc-ds-bar-page-title::before{background:transparent;outline:var(--dimension-stroke-width-025) solid var(--ds-forced-color-selected);outline-offset:calc(-1 * var(--dimension-stroke-width-025))}}@media (forced-colors: active) and (hover: hover) and (pointer: fine){.ds-interaction-fill.sc-ds-bar-page-title-h:hover:not(:disabled):not(:focus-visible):not(:focus-within):not(.ds-focus-ring--visible)::after,.ds-interaction-fill.sc-ds-bar-page-title:hover:not(:disabled):not(:focus-visible):not(:focus-within):not(.ds-focus-ring--visible)::after{outline-color:var(--ds-forced-color-selected);outline-width:var(--dimension-stroke-width-012)}}@media (forced-colors: active){.sc-ds-bar-page-title:root,.sc-ds-bar-page-title-h,.ds-forced-colors-scope.sc-ds-bar-page-title{--ds-forced-color-surface:Canvas;--ds-forced-color-content:CanvasText;--ds-forced-color-control-boundary:ButtonText;--ds-forced-color-selected:Highlight;--ds-forced-color-on-selected:HighlightText;--ds-forced-color-disabled:GrayText}}.ds-control-inactive.sc-ds-bar-page-title-h,.ds-control-inactive.sc-ds-bar-page-title{opacity:var(--effect-opacity-medium);pointer-events:none;cursor:not-allowed}@media (forced-colors: active){.ds-control-inactive.sc-ds-bar-page-title-h,.ds-control-inactive.sc-ds-bar-page-title{color:var(--ds-forced-color-disabled);opacity:1}}.sc-ds-bar-page-title-h{display:block;min-width:0;box-sizing:border-box;background:var(--color-background-secondary);--_bar-page-title-fg-primary:var(--color-foreground-primary);--_bar-page-title-fg-secondary:var(--color-foreground-secondary);--_bar-page-title-hover:var(--color-interaction-hover);--_bar-page-title-pressed:var(--color-interaction-pressed);--_bar-page-title-focus:var(--color-interaction-focus);--_bar-page-title-border:var(--color-border-tertiary);--ds-focus-ring-color:var(--_bar-page-title-focus)}[data-shell-bar].sc-ds-bar-page-title-h{background:transparent;color:var(--_bar-page-title-fg-primary);--_bar-page-title-fg-primary:var(--color-chrome-foreground-primary);--_bar-page-title-fg-secondary:var(--color-chrome-foreground-secondary);--_bar-page-title-hover:var(--color-chrome-interaction-hover);--_bar-page-title-pressed:var(--color-chrome-interaction-pressed);--_bar-page-title-focus:var(--color-chrome-interaction-focus);--_bar-page-title-border:var(--color-chrome-border-tertiary);--ds-focus-ring-color:var(--_bar-page-title-focus)}ds-shell-app.sc-ds-bar-page-title-h:not([gradient-preset='none']),ds-shell-app:not([gradient-preset='none']) .sc-ds-bar-page-title-h,ds-shell-app.sc-ds-bar-page-title-h:not([gradient-preset='none']) .bar-page-title.sc-ds-bar-page-title,ds-shell-app:not([gradient-preset='none']) .sc-ds-bar-page-title-h .bar-page-title.sc-ds-bar-page-title,ds-shell-app.shell-app--paper-texture.sc-ds-bar-page-title-h,ds-shell-app.shell-app--paper-texture .sc-ds-bar-page-title-h,ds-shell-app.shell-app--paper-texture.sc-ds-bar-page-title-h .bar-page-title.sc-ds-bar-page-title,ds-shell-app.shell-app--paper-texture .sc-ds-bar-page-title-h .bar-page-title.sc-ds-bar-page-title{background:transparent}.bar-page-title.sc-ds-bar-page-title{position:relative;height:var(--dimension-size-600);min-width:0;box-sizing:border-box;background:var(--color-background-secondary);color:var(--_bar-page-title-fg-primary)}[data-shell-bar].sc-ds-bar-page-title-h .bar-page-title.sc-ds-bar-page-title{background:transparent}.bar-page-title.sc-ds-bar-page-title::after{content:'';position:absolute;inset:auto 0 0;height:var(--dimension-stroke-width-012);background:var(--_bar-page-title-border);pointer-events:none}.bar-page-title--divider-hidden.sc-ds-bar-page-title::after{display:none}.bar-page-title__inner.sc-ds-bar-page-title{position:relative;z-index:1;flex:1 1 auto;height:100%;min-width:0;padding:0;gap:0}.bar-page-title__row.sc-ds-bar-page-title{display:flex;align-items:center;justify-content:space-between;gap:var(--dimension-space-100);height:100%;min-width:0}.bar-page-title__title-row.sc-ds-bar-page-title{display:flex;align-items:center;gap:var(--dimension-space-100);min-width:0;min-height:var(--dimension-size-400);flex:1 1 auto}.bar-page-title__identity.sc-ds-bar-page-title{display:flex;flex:0 1 auto;align-items:center;gap:var(--dimension-space-050);min-width:0;height:var(--dimension-size-400)}.bar-page-title__back.sc-ds-bar-page-title,.bar-page-title__section-chevron.sc-ds-bar-page-title{flex:0 0 auto}.bar-page-title__heading.sc-ds-bar-page-title{display:inline-flex;flex:1 1 auto;align-items:center;width:auto;min-width:0;height:var(--dimension-size-400);padding-inline:calc(var(--ds-control-padding-inline) + var(--ds-control-label-inset));box-sizing:border-box;user-select:none}.bar-page-title__divider.sc-ds-bar-page-title{width:var(--dimension-stroke-width-012);height:var(--dimension-size-250);flex:0 0 var(--dimension-stroke-width-012);background:var(--_bar-page-title-border)}.bar-page-title__section-selector.sc-ds-bar-page-title{display:flex;flex:0 1 auto;min-width:0;max-width:var(--dimension-panel-width-sm)}.bar-page-title__section-trigger.sc-ds-bar-page-title{--ds-control-radius:var(--dimension-radius-half);display:inline-flex;align-items:center;justify-content:center;gap:var(--ds-control-gap);height:var(--ds-control-height);min-width:0;max-width:100%;padding-inline:var(--ds-control-padding-inline);border:none;border-radius:var(--ds-control-radius);box-sizing:border-box;background:transparent;color:var(--color-foreground-secondary);cursor:default;font-family:inherit;user-select:none}[data-shell-bar].sc-ds-bar-page-title-h .bar-page-title__section-trigger.sc-ds-bar-page-title{color:var(--_bar-page-title-fg-primary)}.bar-page-title__section-label.sc-ds-bar-page-title{min-width:0;padding-inline:var(--ds-control-label-inset)}.bar-page-title__actions.sc-ds-bar-page-title{display:flex;align-items:center;gap:var(--dimension-space-100);flex:0 0 auto}.bar-page-title__probe.sc-ds-bar-page-title{position:absolute;left:0;top:0;visibility:hidden;pointer-events:none;overflow:visible;width:max-content;max-width:none;z-index:-1}.bar-page-title__probe-row.sc-ds-bar-page-title{display:flex;align-items:center;gap:var(--dimension-space-100);width:max-content;max-width:none}.bar-page-title__probe.sc-ds-bar-page-title .bar-page-title__identity.sc-ds-bar-page-title,.bar-page-title__probe.sc-ds-bar-page-title .bar-page-title__heading.sc-ds-bar-page-title{flex:0 0 auto;width:max-content;min-width:0;max-width:none}.bar-page-title__tabs-pending.sc-ds-bar-page-title{flex:0 0 auto;width:var(--dimension-size-400);height:var(--ds-control-height);visibility:hidden;pointer-events:none}.bar-page-title__tab-list.sc-ds-bar-page-title{display:flex;align-items:center;gap:var(--dimension-space-050);position:relative;width:max-content;flex:0 0 auto;min-width:0}.bar-page-title__tab.sc-ds-bar-page-title{display:flex;align-items:center;justify-content:center;gap:var(--ds-control-gap);height:var(--ds-control-height);min-width:var(--ds-control-height);padding:0 var(--ds-control-padding-inline);box-sizing:border-box;border:none;border-radius:var(--ds-control-radius);background-color:transparent;color:var(--_bar-page-title-fg-secondary);cursor:default;position:relative;flex-shrink:0;-webkit-user-select:none;user-select:none;transition:color var(--effect-motion-short-2)}.bar-page-title__tab.sc-ds-bar-page-title::after{content:'';position:absolute;inset:0;border-radius:var(--ds-control-radius);background:transparent;pointer-events:none;cursor:inherit}@media (hover: hover) and (pointer: fine){.bar-page-title__tab.sc-ds-bar-page-title:hover::after{background:var(--_bar-page-title-hover)}}.bar-page-title__tab.sc-ds-bar-page-title:active::after{background:var(--_bar-page-title-pressed)}.bar-page-title__tab--selected.sc-ds-bar-page-title{color:var(--_bar-page-title-fg-primary)}.bar-page-title__tab-label.sc-ds-bar-page-title{display:inline-flex;align-items:center;white-space:nowrap}.bar-page-title__tab-divider.sc-ds-bar-page-title{display:flex;align-items:center;justify-content:center;box-sizing:border-box;width:var(--dimension-space-100);height:var(--ds-control-height);padding-block:var(--ds-control-padding-inline);flex-shrink:0;pointer-events:none}.bar-page-title__tab-divider-line.sc-ds-bar-page-title{width:var(--dimension-stroke-width-012);align-self:stretch;background-color:var(--_bar-page-title-border)}`;let N=0;const X=e(class e extends t{constructor(e){super();if(e!==false){this.__registerHost()}this.dsBack=i(this,"dsBack",7);this.dsSectionChange=i(this,"dsSectionChange",7);this.dsAction=i(this,"dsAction",7);this.showBack=false;this.backAriaLabel="Back";this.sections=[];this.value="";this.sectionsAriaLabel="Change page section";this.primaryAction=null;this.actions=[];this.actionsAriaLabel="More page actions";this.showDivider=true;this.sectionMenuOpen=false;this.openActionMenuId="";this.surfaceActionMenuId="";this.sectionSurfaceOpen=false;this.sectionMenuInitialFocusVisible=false;this.actionMenuInitialFocusVisible=false;this.sectionsCollapsed=false;this.layoutCommitted=false;this.focusedTabId="";this.instanceId=N++;this.sectionMenuTriggerId=`bar-page-title-section-trigger-${this.instanceId}`;this.sectionMenuId=`bar-page-title-section-menu-${this.instanceId}`;this.actionMenuTriggerId=`bar-page-title-action-trigger-${this.instanceId}`;this.actionMenuId=`bar-page-title-action-menu-${this.instanceId}`;this.sectionTriggerEl=null;this.actionTriggerEl=null;this.actionTriggerEls=new Map;this.chromeEl=null;this.rowEl=null;this.probeRowEl=null;this.visibleTabListEl=null;this.resizeObserver=null;this.intrinsicWidthRetryCount=0;this.tabLayoutPendingFrames=0;this.panelNavTransition=new n;this.panelToolsTransition=new n;this.overflowCoalescer=o((()=>{this.updateSectionsCollapsed()}));this.chromeTransitionShell=null;this.onChromeTransitionStart=e=>{const t=h(e);if(t==="panel-nav"){this.panelNavTransition.enter();return}if(t==="panel-tools"){const t=p(e)??"opening";if(t==="closing"){this.panelToolsTransition.enter()}}};this.onChromeTransitionEnd=e=>{const t=h(e);if(t==="panel-nav"){this.panelNavTransition.exit();if(!this.panelNavTransition.isActive){this.scheduleOverflowCheck()}return}if(t==="panel-tools"){this.panelToolsTransition.exit();this.scheduleOverflowCheck()}};this.toggleSectionMenu=e=>{this.sectionMenuInitialFocusVisible=e.detail===0;this.openActionMenuId="";this.sectionMenuOpen=!this.sectionMenuOpen;if(this.sectionMenuOpen)this.sectionSurfaceOpen=true};this.closeSectionMenu=()=>{this.sectionMenuOpen=false};this.handleSectionSelect=e=>{const t=String(e.detail?.value??"");this.closeSectionMenu();this.selectSection(t);requestAnimationFrame((()=>this.sectionTriggerEl?.focus()))};this.toggleActionMenu=(e,t)=>{this.actionMenuInitialFocusVisible=t.detail===0;this.sectionMenuOpen=false;this.openActionMenuId=this.openActionMenuId===e?"":e;if(this.openActionMenuId)this.surfaceActionMenuId=this.openActionMenuId};this.finishActionMenuClose=e=>{const t=this.surfaceActionMenuId;const i=t==="__overflow"?this.actionMenuId:u("bar-page-title",this.instanceId,this.resolvedActionItems,t);if(this.openActionMenuId!==t&&e.target.id===i){this.surfaceActionMenuId=""}};this.closeActionMenu=()=>{this.openActionMenuId=""};this.handleActionSelect=e=>{const t=String(e.detail?.value??"");const i=f(this.resolvedActionItems,t);if(!i||i.isInactive||"isLoading"in i&&i.isLoading)return;const s=this.openActionMenuId;this.closeActionMenu();this.dsAction.emit(t);requestAnimationFrame((()=>{void v({menuId:s,overflowTrigger:this.actionTriggerEl,actionTriggers:this.actionTriggerEls,resolvedActionItems:this.resolvedActionItems})}))}}componentWillLoad(){this.reportActionIdIssues();this.syncFocusedTabId(this.effectiveValue,this.selectableTabs)}componentDidLoad(){this.setupOverflowObserver();this.bindChromeTransitionListeners();this.scheduleOverflowCheck()}componentDidRender(){if(this.chromeOverflowPaused())return;this.scheduleOverflowCheck()}disconnectedCallback(){this.resizeObserver?.disconnect();this.resizeObserver=null;this.overflowCoalescer.cancel();this.unbindChromeTransitionListeners()}handleSectionsChange(e,t){if(!this.hasSectionSelector){this.closeSectionMenu();this.sectionSurfaceOpen=false;this.sectionsCollapsed=false;this.layoutCommitted=true;this.intrinsicWidthRetryCount=0;this.tabLayoutPendingFrames=0;return}if(m(e)===m(t)){this.syncFocusedTabId(this.effectiveValue,this.selectableTabs);return}this.resetSectionLayout();this.syncFocusedTabId(this.effectiveValue,this.selectableTabs);this.scheduleOverflowCheck()}handleValueChange(){this.syncFocusedTabId(this.effectiveValue,this.selectableTabs);this.scheduleOverflowCheck()}handleLayoutInputsChange(){this.reportActionIdIssues();if(!this.availableActionMenuIds.has(this.openActionMenuId))this.closeActionMenu();if(!this.availableActionMenuIds.has(this.surfaceActionMenuId))this.surfaceActionMenuId="";this.scheduleOverflowCheck()}reportActionIdIssues(){for(const e of _(this.resolvedActionItems)){console.warn(`[ds-bar-page-title] ${e}`)}}get dividerVisible(){return this.showCompactDivider??this.showDivider}get usesChromeTokens(){return this.el.hasAttribute("data-shell-bar")}get shellBarButtonBackground(){return this.usesChromeTokens?"chrome":undefined}get selectableSections(){return w(this.sections)}get hasSectionSelector(){return this.selectableSections.length>1}get sectionTabs(){return x(this.sections)}get selectableTabs(){return g(this.sectionTabs)}get effectiveValue(){return y(this.sections,this.value)}get selectedSectionLabel(){return k(this.sections,this.value)}get sectionTriggerAriaLabel(){return I(this.sectionsAriaLabel,this.selectedSectionLabel)}get sectionMenuSections(){return C(this.sections,this.effectiveValue)}get resolvedActionItems(){return A(this.actionItems,this.primaryAction,this.actions)}get visibleActions(){return T(this.resolvedActionItems,"compact")}get actionMenuSections(){return z(this.resolvedActionItems,"compact")}get showActionMenuTrigger(){return this.actionMenuSections.length>0}get availableActionMenuIds(){return L(this.visibleActions,this.showActionMenuTrigger)}get showSectionTabs(){return this.hasSectionSelector&&this.layoutCommitted&&!this.sectionsCollapsed}get showSectionButton(){return this.hasSectionSelector&&this.layoutCommitted&&this.sectionsCollapsed}resetSectionLayout(){this.layoutCommitted=false;this.sectionsCollapsed=false;this.sectionMenuOpen=false;this.sectionMenuInitialFocusVisible=false;this.intrinsicWidthRetryCount=0;this.tabLayoutPendingFrames=0}bindChromeTransitionListeners(){const e=this.el.closest("ds-shell-app");if(!e)return;this.chromeTransitionShell=e;e.addEventListener(d,this.onChromeTransitionStart);e.addEventListener(c,this.onChromeTransitionEnd)}unbindChromeTransitionListeners(){if(!this.chromeTransitionShell)return;this.chromeTransitionShell.removeEventListener(d,this.onChromeTransitionStart);this.chromeTransitionShell.removeEventListener(c,this.onChromeTransitionEnd);this.chromeTransitionShell=null}chromeOverflowPaused(){return this.panelNavTransition.isActive||this.panelToolsTransition.isActive}setupOverflowObserver(){if(typeof ResizeObserver==="undefined"||!this.chromeEl)return;this.resizeObserver?.disconnect();this.resizeObserver=new ResizeObserver((()=>{if(this.chromeOverflowPaused())return;this.scheduleOverflowCheck()}));this.resizeObserver.observe(this.chromeEl)}scheduleOverflowCheck(){if(this.chromeOverflowPaused())return;this.overflowCoalescer.schedule()}scheduleIntrinsicWidthRetry(){if(this.intrinsicWidthRetryCount>=e.INTRINSIC_WIDTH_RETRY_MAX)return;this.intrinsicWidthRetryCount++;requestAnimationFrame((()=>this.scheduleOverflowCheck()))}forceTabLayoutCommit(e){this.intrinsicWidthRetryCount=0;this.tabLayoutPendingFrames=0;const t=this.sectionsCollapsed!==e;if(t)this.sectionsCollapsed=e;if(!e&&t){this.closeSectionMenu();this.sectionSurfaceOpen=false}this.layoutCommitted=true}getAvailableWidth(){if(!this.rowEl)return 0;const e=this.rowEl.clientWidth;const t=this.rowEl.querySelector(".bar-page-title__actions");const i=t?.getBoundingClientRect().width??0;const s=getComputedStyle(this.rowEl);const r=parseFloat(s.columnGap||s.gap)||0;return Math.max(0,e-i-(i>0?r:0))}updateSectionsCollapsed(){if(!this.hasSectionSelector){if(this.sectionsCollapsed)this.sectionsCollapsed=false;this.intrinsicWidthRetryCount=0;this.tabLayoutPendingFrames=0;this.layoutCommitted=true;return}const t=this.probeRowEl?.scrollWidth??0;const i=this.getAvailableWidth();if(!this.probeRowEl||!this.rowEl||t===0){if(this.layoutCommitted){this.scheduleIntrinsicWidthRetry();return}this.tabLayoutPendingFrames+=1;if(this.intrinsicWidthRetryCount>=e.INTRINSIC_WIDTH_RETRY_MAX||this.tabLayoutPendingFrames>=e.TAB_LAYOUT_COMMIT_MAX_FRAMES){this.forceTabLayoutCommit(false)}else{this.scheduleIntrinsicWidthRetry()}return}this.intrinsicWidthRetryCount=0;this.tabLayoutPendingFrames=0;const s=l(t,i,this.sectionsCollapsed,e.OVERFLOW_HYSTERESIS_PX);this.forceTabLayoutCommit(s)}syncFocusedTabId(e,t){if(t.some((t=>t.id===e&&!t.isInactive))){this.focusedTabId=e;return}const i=t.find((e=>!e.isInactive));this.focusedTabId=i?.id??""}selectSection(e){const t=this.selectableSections.find((t=>t.id===e));if(!t||t.isInactive)return;this.dsSectionChange.emit(e)}focusVisibleTab(e){this.focusedTabId=e;const t=this.visibleTabListEl?.querySelector(`[data-tab-id="${e}"]`);t?.focus({preventScroll:true})}findEnabledTab(e,t){const i=this.selectableTabs;for(let s=e+t;s>=0&&s<i.length;s+=t){if(!i[s]?.isInactive)return s}return null}handleTabKeyDown(e){const t=this.selectableTabs;if(!t.length)return;const i=e.target?.getAttribute("data-tab-id");const s=i??this.focusedTabId;if(e.key==="Enter"||e.key===" "){const i=t.find((e=>e.id===s));if(!i||i.isInactive)return;e.preventDefault();this.selectSection(i.id);return}const r=t.findIndex((e=>e.id===s));if(r<0)return;let a;if(e.key==="ArrowRight"){a=this.findEnabledTab(r,1)}else if(e.key==="ArrowLeft"){a=this.findEnabledTab(r,-1)}else if(e.key==="Home"){a=t.findIndex((e=>!e.isInactive))}else if(e.key==="End"){const e=[...t].reverse().findIndex((e=>!e.isInactive));a=e<0?null:t.length-1-e}else{return}if(a===null||a<0||a===r)return;e.preventDefault();this.focusVisibleTab(t[a].id)}chromeActionOptions(){return{classPrefix:"bar-page-title",compact:true,visibleActions:this.visibleActions,showOverflowTrigger:this.showActionMenuTrigger,actionItems:this.actionItems,primaryAction:this.primaryAction,resolvedActionItems:this.resolvedActionItems,instanceId:this.instanceId,openActionMenuId:this.openActionMenuId,surfaceActionMenuId:this.surfaceActionMenuId,actionsAriaLabel:this.actionsAriaLabel,actionMenuTriggerId:this.actionMenuTriggerId,actionMenuId:this.actionMenuId,actionTriggers:this.actionTriggerEls,buttonBackground:this.shellBarButtonBackground,setOverflowTriggerEl:e=>{this.actionTriggerEl=e},toggleActionMenu:this.toggleActionMenu,emitAction:e=>this.dsAction.emit(e)}}renderHeading(e){return s("ds-text",{class:"bar-page-title__heading ds-control--md",variant:"text-title-small",emphasis:true,color:"inherit",as:e?"span":"h1",wrap:e?"nowrap":undefined,lineTruncation:e?"none":1},this.heading)}renderTabList(e){return s("div",{role:e?undefined:"tablist",class:"bar-page-title__tab-list","aria-label":e?undefined:this.sectionsAriaLabel,ref:t=>{if(!e)this.visibleTabListEl=t??null},onKeyDown:e?undefined:e=>this.handleTabKeyDown(e)},this.sectionTabs.map(((t,i)=>{if(b(t)){return s("div",{class:"bar-page-title__tab-divider",key:`divider-${i}`,"aria-hidden":"true"},s("div",{class:"bar-page-title__tab-divider-line"}))}const r=t.id===this.effectiveValue;return s("button",{key:t.id,type:"button",role:e?undefined:"tab","data-tab-id":t.id,class:{"bar-page-title__tab":true,"bar-page-title__tab--selected":r,"ds-control--md":true,"ds-focus-ring-inset":true,"ds-control-inactive":!!t.isInactive,"ds-interaction-fill--on-chrome":this.usesChromeTokens},"aria-selected":r?"true":"false","aria-disabled":t.isInactive?"true":undefined,disabled:t.isInactive,tabIndex:!e&&t.id===this.focusedTabId?0:-1,onClick:()=>!e&&this.selectSection(t.id),onFocus:()=>{if(!e)this.focusedTabId=t.id}},s("ds-text",{class:"bar-page-title__tab-label ds-control-label-box",as:"span",variant:"text-body-medium",emphasis:r,color:"inherit"},t.label))})))}renderIdentity(e){return s("div",{class:"bar-page-title__identity"},M({classPrefix:"bar-page-title",showBack:this.showBack,backAriaLabel:this.backAriaLabel,background:this.shellBarButtonBackground,onBack:e=>this.dsBack.emit(e)}),this.renderHeading(e))}renderSectionRegion(){if(!this.hasSectionSelector)return null;if(!this.layoutCommitted){return[s("div",{class:"bar-page-title__divider","aria-hidden":"true"}),s("div",{class:"bar-page-title__tabs-pending","aria-hidden":"true"})]}if(this.showSectionTabs){return[s("div",{class:"bar-page-title__divider","aria-hidden":"true"}),this.renderTabList(false)]}return[s("div",{class:"bar-page-title__divider","aria-hidden":"true"}),S({classPrefix:"bar-page-title",triggerId:this.sectionMenuTriggerId,menuId:this.sectionMenuId,open:this.sectionMenuOpen,surfaceOpen:this.sectionSurfaceOpen,ariaLabel:this.sectionTriggerAriaLabel,selectedLabel:this.selectedSectionLabel,background:this.shellBarButtonBackground,labelColor:this.usesChromeTokens?"inherit":undefined,setTriggerEl:e=>{this.sectionTriggerEl=e},onToggle:this.toggleSectionMenu})]}render(){return s(r,{key:"25e51460cf70c30635f77efc4f80e32d12fb0086"},s("div",{key:"fc310092e051eb8a0d9e024c23c92c38d4fb4a32",class:{"bar-page-title":true,"bar-page-title--divider-hidden":!this.dividerVisible,"ds-chrome-header":true},ref:e=>{this.chromeEl=e??null;if(e&&!this.resizeObserver)this.setupOverflowObserver()}},this.hasSectionSelector?s("div",{class:"bar-page-title__probe","aria-hidden":"true",inert:true},s("div",{class:"bar-page-title__probe-row",ref:e=>{const t=e??null;if(t===this.probeRowEl)return;this.probeRowEl=t;if(t){this.intrinsicWidthRetryCount=0;this.tabLayoutPendingFrames=0;this.scheduleOverflowCheck()}}},this.renderIdentity(true),s("div",{class:"bar-page-title__divider"}),this.renderTabList(true))):null,s("div",{key:"2bea477ef963282b9181aadf6252f4c54b29d13c",class:"bar-page-title__inner"},s("div",{key:"92dfdc57806371ff8c10813bebabf01d614cf23e",class:"bar-page-title__row",ref:e=>{this.rowEl=e??null}},s("div",{key:"744cf0925e90e00b29fe2b920ecc2494391b3b24",class:"bar-page-title__title-row"},this.renderIdentity(false),this.renderSectionRegion()),E(this.chromeActionOptions())))),this.showSectionButton?s("ds-menu",{id:this.sectionMenuId,class:"bar-page-title__section-menu",anchorId:this.sectionMenuTriggerId,menuLabel:this.sectionsAriaLabel,open:this.sectionMenuOpen,initialFocusVisible:this.sectionMenuInitialFocusVisible,sections:this.sectionMenuSections,onDsClose:this.closeSectionMenu,onDsAfterClose:()=>{if(!this.sectionMenuOpen)this.sectionSurfaceOpen=false},onDsSelect:this.handleSectionSelect}):null,j({classPrefix:"bar-page-title",visibleActions:this.visibleActions,instanceId:this.instanceId,resolvedActionItems:this.resolvedActionItems,openActionMenuId:this.openActionMenuId,actionMenuInitialFocusVisible:this.actionMenuInitialFocusVisible,overflowTrigger:this.actionTriggerEl,actionTriggers:this.actionTriggerEls,closeActionMenu:this.closeActionMenu,finishActionMenuClose:this.finishActionMenuClose,handleActionSelect:this.handleActionSelect}),B({classPrefix:"bar-page-title",showOverflowTrigger:this.showActionMenuTrigger,actionMenuId:this.actionMenuId,actionMenuTriggerId:this.actionMenuTriggerId,actionsAriaLabel:this.actionsAriaLabel,open:this.openActionMenuId==="__overflow",actionMenuInitialFocusVisible:this.actionMenuInitialFocusVisible,actionMenuSections:this.actionMenuSections,closeActionMenu:this.closeActionMenu,finishActionMenuClose:this.finishActionMenuClose,handleActionSelect:this.handleActionSelect}))}get el(){return this}static get watchers(){return{sections:[{handleSectionsChange:0}],value:[{handleValueChange:0}],heading:[{handleLayoutInputsChange:0}],showBack:[{handleLayoutInputsChange:0}],primaryAction:[{handleLayoutInputsChange:0}],actions:[{handleLayoutInputsChange:0}],actionItems:[{handleLayoutInputsChange:0}]}}static get style(){return Q()}},[2,"ds-bar-page-title",{heading:[1],showBack:[4,"show-back"],backAriaLabel:[1,"back-aria-label"],sections:[16],value:[1],sectionsAriaLabel:[1,"sections-aria-label"],primaryAction:[16],actions:[16],actionItems:[16],actionsAriaLabel:[1,"actions-aria-label"],showDivider:[4,"show-divider"],showCompactDivider:[4,"show-compact-divider"],sectionMenuOpen:[32],openActionMenuId:[32],surfaceActionMenuId:[32],sectionSurfaceOpen:[32],sectionMenuInitialFocusVisible:[32],actionMenuInitialFocusVisible:[32],sectionsCollapsed:[32],layoutCommitted:[32],focusedTabId:[32]},undefined,{sections:[{handleSectionsChange:0}],value:[{handleValueChange:0}],heading:[{handleLayoutInputsChange:0}],showBack:[{handleLayoutInputsChange:0}],primaryAction:[{handleLayoutInputsChange:0}],actions:[{handleLayoutInputsChange:0}],actionItems:[{handleLayoutInputsChange:0}]}]);X.INTRINSIC_WIDTH_RETRY_MAX=3;X.TAB_LAYOUT_COMMIT_MAX_FRAMES=16;X.OVERFLOW_HYSTERESIS_PX=8;function J(){if(typeof customElements==="undefined"){return}const e=["ds-bar-page-title","ds-badge","ds-button-filled","ds-button-unfilled","ds-icon","ds-loader","ds-menu","ds-swatch-picker","ds-switch","ds-tag","ds-text","ds-tooltip"];e.forEach((e=>{switch(e){case"ds-bar-page-title":if(!customElements.get(a(e))){customElements.define(a(e),X)}break;case"ds-badge":if(!customElements.get(a(e))){D()}break;case"ds-button-filled":if(!customElements.get(a(e))){O()}break;case"ds-button-unfilled":if(!customElements.get(a(e))){F()}break;case"ds-icon":if(!customElements.get(a(e))){V()}break;case"ds-loader":if(!customElements.get(a(e))){R()}break;case"ds-menu":if(!customElements.get(a(e))){H()}break;case"ds-swatch-picker":if(!customElements.get(a(e))){q()}break;case"ds-switch":if(!customElements.get(a(e))){$()}break;case"ds-tag":if(!customElements.get(a(e))){P()}break;case"ds-text":if(!customElements.get(a(e))){W()}break;case"ds-tooltip":if(!customElements.get(a(e))){G()}break}}))}J();export{X as B,J as d};
|
|
2
|
-
//# sourceMappingURL=p-DYsE6HLk.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"names":["barPageTitleCss","nextBarPageTitleId","BarPageTitle","__stencil_proxyCustomElement","HTMLElement","constructor","registerHost","this","showBack","backAriaLabel","sections","value","sectionsAriaLabel","primaryAction","actions","actionsAriaLabel","showDivider","sectionMenuOpen","openActionMenuId","surfaceActionMenuId","sectionSurfaceOpen","sectionMenuInitialFocusVisible","actionMenuInitialFocusVisible","sectionsCollapsed","layoutCommitted","focusedTabId","instanceId","sectionMenuTriggerId","sectionMenuId","actionMenuTriggerId","actionMenuId","sectionTriggerEl","actionTriggerEl","actionTriggerEls","Map","chromeEl","rowEl","probeRowEl","visibleTabListEl","resizeObserver","intrinsicWidthRetryCount","tabLayoutPendingFrames","panelNavTransition","ChromeTransitionGate","panelToolsTransition","overflowCoalescer","createRafCoalescer","updateSectionsCollapsed","chromeTransitionShell","onChromeTransitionStart","event","source","readChromeTransitionSource","enter","phase","readChromeTransitionPhase","onChromeTransitionEnd","exit","isActive","scheduleOverflowCheck","toggleSectionMenu","detail","closeSectionMenu","handleSectionSelect","id","String","selectSection","requestAnimationFrame","focus","toggleActionMenu","finishActionMenuClose","domId","barTitleActionMenuDomId","resolvedActionItems","target","closeActionMenu","handleActionSelect","action","findBarTitleAction","isInactive","isLoading","menuId","dsAction","emit","restoreBarTitleActionFocus","overflowTrigger","actionTriggers","componentWillLoad","reportActionIdIssues","syncFocusedTabId","effectiveValue","selectableTabs","componentDidLoad","setupOverflowObserver","bindChromeTransitionListeners","componentDidRender","chromeOverflowPaused","disconnectedCallback","disconnect","cancel","unbindChromeTransitionListeners","handleSectionsChange","next","prev","hasSectionSelector","barTitleSectionsDigest","resetSectionLayout","handleValueChange","handleLayoutInputsChange","availableActionMenuIds","has","issue","barTitleActionIdIssues","console","warn","dividerVisible","showCompactDivider","usesChromeTokens","el","hasAttribute","shellBarButtonBackground","undefined","selectableSections","selectableBarTitleSections","length","sectionTabs","barTitleSectionsToTabs","getSelectableTabs","effectiveBarTitleSectionValue","selectedSectionLabel","selectedBarTitleSectionLabel","sectionTriggerAriaLabel","barTitleSectionTriggerAriaLabel","sectionMenuSections","barTitleSectionMenuSections","resolveBarTitleActionItems","actionItems","visibleActions","visibleBarTitleActions","actionMenuSections","overflowBarTitleActionSections","showActionMenuTrigger","availableBarTitleActionMenuIds","showSectionTabs","showSectionButton","shell","closest","addEventListener","CHROME_TRANSITION_START","CHROME_TRANSITION_END","removeEventListener","ResizeObserver","observe","schedule","scheduleIntrinsicWidthRetry","INTRINSIC_WIDTH_RETRY_MAX","forceTabLayoutCommit","collapsed","collapsedChanged","getAvailableWidth","rowWidth","clientWidth","querySelector","actionsWidth","getBoundingClientRect","width","style","getComputedStyle","gap","parseFloat","columnGap","Math","max","probeWidth","scrollWidth","available","TAB_LAYOUT_COMMIT_MAX_FRAMES","shouldCollapse","tabsOverflowContainer","OVERFLOW_HYSTERESIS_PX","preferred","tabs","some","tab","first","find","selected","section","dsSectionChange","focusVisibleTab","preventScroll","findEnabledTab","from","step","index","handleTabKeyDown","targetId","getAttribute","focusedId","key","focused","preventDefault","currentIndex","findIndex","nextIndex","reversedIndex","reverse","chromeActionOptions","classPrefix","compact","showOverflowTrigger","buttonBackground","setOverflowTriggerEl","emitAction","renderHeading","probe","h","class","variant","emphasis","color","as","wrap","lineTruncation","heading","renderTabList","role","ref","onKeyDown","map","isTabDivider","isSelected","type","disabled","tabIndex","onClick","onFocus","label","renderIdentity","renderBarTitleBack","background","onBack","dsBack","renderSectionRegion","renderBarTitleSectionTrigger","triggerId","open","surfaceOpen","ariaLabel","selectedLabel","labelColor","setTriggerEl","onToggle","render","Host","inert","renderBarTitleActions","anchorId","menuLabel","initialFocusVisible","onDsClose","onDsAfterClose","onDsSelect","renderBarTitleActionMenus","renderBarTitleOverflowMenu"],"sources":["src/wc/components/BarPageTitle/BarPageTitle.css?tag=ds-bar-page-title&encapsulation=scoped","src/wc/components/BarPageTitle/BarPageTitle.tsx"],"sourcesContent":["@import '../../utils/radius.css';\n@import '../../utils/control-density.css';\n@import '../../utils/control-parts.css';\n@import '../../utils/chrome-header.css';\n@import '../../utils/focus-ring.css';\n@import '../../utils/interaction-fill.css';\n@import '../../utils/control-inactive.css';\n\n:host {\n display: block;\n min-width: 0;\n box-sizing: border-box;\n background: var(--color-background-secondary);\n --_bar-page-title-fg-primary: var(--color-foreground-primary);\n --_bar-page-title-fg-secondary: var(--color-foreground-secondary);\n --_bar-page-title-hover: var(--color-interaction-hover);\n --_bar-page-title-pressed: var(--color-interaction-pressed);\n --_bar-page-title-focus: var(--color-interaction-focus);\n --_bar-page-title-border: var(--color-border-tertiary);\n --ds-focus-ring-color: var(--_bar-page-title-focus);\n}\n\n:host([data-shell-bar]) {\n background: transparent;\n color: var(--_bar-page-title-fg-primary);\n --_bar-page-title-fg-primary: var(--color-chrome-foreground-primary);\n --_bar-page-title-fg-secondary: var(--color-chrome-foreground-secondary);\n --_bar-page-title-hover: var(--color-chrome-interaction-hover);\n --_bar-page-title-pressed: var(--color-chrome-interaction-pressed);\n --_bar-page-title-focus: var(--color-chrome-interaction-focus);\n --_bar-page-title-border: var(--color-chrome-border-tertiary);\n --ds-focus-ring-color: var(--_bar-page-title-focus);\n}\n\n:host-context(ds-shell-app:not([gradient-preset='none'])),\n:host-context(ds-shell-app:not([gradient-preset='none'])) .bar-page-title,\n:host-context(ds-shell-app.shell-app--paper-texture),\n:host-context(ds-shell-app.shell-app--paper-texture) .bar-page-title {\n background: transparent;\n}\n\n.bar-page-title {\n position: relative;\n height: var(--dimension-size-600);\n min-width: 0;\n box-sizing: border-box;\n background: var(--color-background-secondary);\n color: var(--_bar-page-title-fg-primary);\n}\n\n:host([data-shell-bar]) .bar-page-title {\n background: transparent;\n}\n\n.bar-page-title::after {\n content: '';\n position: absolute;\n inset: auto 0 0;\n height: var(--dimension-stroke-width-012);\n background: var(--_bar-page-title-border);\n pointer-events: none;\n}\n\n.bar-page-title--divider-hidden::after {\n display: none;\n}\n\n.bar-page-title__inner {\n position: relative;\n z-index: 1;\n flex: 1 1 auto;\n height: 100%;\n min-width: 0;\n padding: 0;\n gap: 0;\n}\n\n.bar-page-title__row {\n display: flex;\n align-items: center;\n justify-content: space-between;\n gap: var(--dimension-space-100);\n height: 100%;\n min-width: 0;\n}\n\n.bar-page-title__title-row {\n display: flex;\n align-items: center;\n gap: var(--dimension-space-100);\n min-width: 0;\n min-height: var(--dimension-size-400);\n flex: 1 1 auto;\n}\n\n.bar-page-title__identity {\n display: flex;\n flex: 0 1 auto;\n align-items: center;\n gap: var(--dimension-space-050);\n min-width: 0;\n height: var(--dimension-size-400);\n}\n\n.bar-page-title__back,\n.bar-page-title__section-chevron {\n flex: 0 0 auto;\n}\n\n.bar-page-title__heading {\n display: inline-flex;\n flex: 1 1 auto;\n align-items: center;\n width: auto;\n min-width: 0;\n height: var(--dimension-size-400);\n padding-inline: calc(var(--ds-control-padding-inline) + var(--ds-control-label-inset));\n box-sizing: border-box;\n user-select: none;\n}\n\n.bar-page-title__divider {\n width: var(--dimension-stroke-width-012);\n height: var(--dimension-size-250);\n flex: 0 0 var(--dimension-stroke-width-012);\n background: var(--_bar-page-title-border);\n}\n\n.bar-page-title__section-selector {\n display: flex;\n flex: 0 1 auto;\n min-width: 0;\n max-width: var(--dimension-panel-width-sm);\n}\n\n.bar-page-title__section-trigger {\n --ds-control-radius: var(--dimension-radius-half);\n\n display: inline-flex;\n align-items: center;\n justify-content: center;\n gap: var(--ds-control-gap);\n height: var(--ds-control-height);\n min-width: 0;\n max-width: 100%;\n padding-inline: var(--ds-control-padding-inline);\n border: none;\n border-radius: var(--ds-control-radius);\n box-sizing: border-box;\n background: transparent;\n color: var(--color-foreground-secondary);\n cursor: default;\n font-family: inherit;\n user-select: none;\n}\n\n:host([data-shell-bar]) .bar-page-title__section-trigger {\n color: var(--_bar-page-title-fg-primary);\n}\n\n.bar-page-title__section-label {\n min-width: 0;\n padding-inline: var(--ds-control-label-inset);\n}\n\n.bar-page-title__actions {\n display: flex;\n align-items: center;\n gap: var(--dimension-space-100);\n flex: 0 0 auto;\n}\n\n.bar-page-title__probe {\n position: absolute;\n left: 0;\n top: 0;\n visibility: hidden;\n pointer-events: none;\n overflow: visible;\n width: max-content;\n max-width: none;\n z-index: -1;\n}\n\n.bar-page-title__probe-row {\n display: flex;\n align-items: center;\n gap: var(--dimension-space-100);\n width: max-content;\n max-width: none;\n}\n\n.bar-page-title__probe .bar-page-title__identity,\n.bar-page-title__probe .bar-page-title__heading {\n flex: 0 0 auto;\n width: max-content;\n min-width: 0;\n max-width: none;\n}\n\n.bar-page-title__tabs-pending {\n flex: 0 0 auto;\n width: var(--dimension-size-400);\n height: var(--ds-control-height);\n visibility: hidden;\n pointer-events: none;\n}\n\n.bar-page-title__tab-list {\n display: flex;\n align-items: center;\n gap: var(--dimension-space-050);\n position: relative;\n width: max-content;\n flex: 0 0 auto;\n min-width: 0;\n}\n\n.bar-page-title__tab {\n display: flex;\n align-items: center;\n justify-content: center;\n gap: var(--ds-control-gap);\n height: var(--ds-control-height);\n min-width: var(--ds-control-height);\n padding: 0 var(--ds-control-padding-inline);\n box-sizing: border-box;\n border: none;\n border-radius: var(--ds-control-radius);\n background-color: transparent;\n color: var(--_bar-page-title-fg-secondary);\n cursor: default;\n position: relative;\n flex-shrink: 0;\n -webkit-user-select: none;\n user-select: none;\n transition: color var(--effect-motion-short-2);\n}\n\n.bar-page-title__tab::after {\n content: '';\n position: absolute;\n inset: 0;\n border-radius: var(--ds-control-radius);\n background: transparent;\n pointer-events: none;\n cursor: inherit;\n}\n\n@media (hover: hover) and (pointer: fine) {\n .bar-page-title__tab:hover::after {\n background: var(--_bar-page-title-hover);\n }\n}\n\n.bar-page-title__tab:active::after {\n background: var(--_bar-page-title-pressed);\n}\n\n.bar-page-title__tab--selected {\n color: var(--_bar-page-title-fg-primary);\n}\n\n.bar-page-title__tab-label {\n display: inline-flex;\n align-items: center;\n white-space: nowrap;\n}\n\n.bar-page-title__tab-divider {\n display: flex;\n align-items: center;\n justify-content: center;\n box-sizing: border-box;\n width: var(--dimension-space-100);\n height: var(--ds-control-height);\n padding-block: var(--ds-control-padding-inline);\n flex-shrink: 0;\n pointer-events: none;\n}\n\n.bar-page-title__tab-divider-line {\n width: var(--dimension-stroke-width-012);\n align-self: stretch;\n background-color: var(--_bar-page-title-border);\n}\n","import {\n Component,\n Element,\n Event,\n EventEmitter,\n h,\n Host,\n Prop,\n State,\n Watch,\n} from '@stencil/core';\nimport {\n CHROME_TRANSITION_END,\n CHROME_TRANSITION_START,\n ChromeTransitionGate,\n createRafCoalescer,\n readChromeTransitionPhase,\n readChromeTransitionSource,\n} from '../../shell/chrome-transition';\nimport type { MenuItemData } from '../Menu/menu-types';\nimport { tabsOverflowContainer } from '../BarNav/bar-nav-tabs-menu-utils';\nimport { getSelectableTabs, isTabDivider, type TabItemTab } from '../TabGroup/tab-item-utils';\nimport {\n availableBarTitleActionMenuIds,\n barTitleActionIdIssues,\n findBarTitleAction,\n overflowBarTitleActionSections,\n resolveBarTitleActionItems,\n visibleBarTitleActions,\n} from '../BarTitle/bar-title-actions';\nimport {\n type FocusableBarTitleButton,\n barTitleActionMenuDomId,\n renderBarTitleActionMenus,\n renderBarTitleActions,\n renderBarTitleBack,\n renderBarTitleOverflowMenu,\n renderBarTitleSectionTrigger,\n restoreBarTitleActionFocus,\n} from '../BarTitle/bar-title-action-chrome';\nimport {\n barTitleSectionMenuSections,\n barTitleSectionTriggerAriaLabel,\n barTitleSectionsDigest,\n barTitleSectionsToTabs,\n effectiveBarTitleSectionValue,\n selectableBarTitleSections,\n selectedBarTitleSectionLabel,\n} from '../BarTitle/bar-title-sections';\nimport type {\n BarTitleActionConfigItem,\n BarTitleActionItem,\n BarTitlePrimaryAction,\n BarTitleSectionItem,\n} from '../BarTitle/bar-title-types';\n\nlet nextBarPageTitleId = 0;\n\n@Component({\n tag: 'ds-bar-page-title',\n styleUrl: 'BarPageTitle.css',\n scoped: true,\n})\nexport class BarPageTitle {\n private static readonly INTRINSIC_WIDTH_RETRY_MAX = 3;\n private static readonly TAB_LAYOUT_COMMIT_MAX_FRAMES = 16;\n private static readonly OVERFLOW_HYSTERESIS_PX = 8;\n\n @Element() el!: HTMLElement;\n\n /** The page's single visible h1. */\n @Prop() heading!: string;\n\n /** Show the leading page-level Back action. */\n @Prop({ attribute: 'show-back' }) showBack: boolean = false;\n\n /** Accessible name for the leading Back action. */\n @Prop() backAriaLabel: string = 'Back';\n\n /** Optional page sections shown as an all-or-nothing tab row, or the compact section button. */\n @Prop() sections: BarTitleSectionItem[] = [];\n\n /** Id of the active page section. */\n @Prop() value: string = '';\n\n /** Accessible name for the page-section tablist and menu. */\n @Prop() sectionsAriaLabel: string = 'Change page section';\n\n /** The one highest-emphasis page action. */\n @Prop() primaryAction: BarTitlePrimaryAction | null = null;\n\n /** Secondary page actions shown in the overflow menu. Dividers create groups. */\n @Prop() actions: BarTitleActionItem[] = [];\n\n /**\n * Ordered page-header actions. When supplied, this replaces the legacy\n * primaryAction/actions presentation while preserving the same dsAction event.\n */\n @Prop() actionItems?: BarTitleActionConfigItem[];\n\n /** Accessible name for the page-actions menu. */\n @Prop() actionsAriaLabel: string = 'More page actions';\n\n /** Draw the compact bottom divider beneath the header. */\n @Prop() showDivider: boolean = true;\n\n /** Override divider visibility for the compact shell-bar presentation. */\n @Prop() showCompactDivider?: boolean;\n\n /** Emitted when the leading Back action is activated. */\n @Event() dsBack!: EventEmitter<MouseEvent>;\n\n /** Emitted with the newly selected page-section id. */\n @Event() dsSectionChange!: EventEmitter<string>;\n\n /** Emitted with the activated primary or overflow action id. */\n @Event() dsAction!: EventEmitter<string>;\n\n @State() private sectionMenuOpen = false;\n @State() private openActionMenuId = '';\n @State() private surfaceActionMenuId = '';\n @State() private sectionSurfaceOpen = false;\n @State() private sectionMenuInitialFocusVisible = false;\n @State() private actionMenuInitialFocusVisible = false;\n @State() private sectionsCollapsed = false;\n @State() private layoutCommitted = false;\n @State() private focusedTabId = '';\n\n private readonly instanceId = nextBarPageTitleId++;\n private readonly sectionMenuTriggerId = `bar-page-title-section-trigger-${this.instanceId}`;\n private readonly sectionMenuId = `bar-page-title-section-menu-${this.instanceId}`;\n private readonly actionMenuTriggerId = `bar-page-title-action-trigger-${this.instanceId}`;\n private readonly actionMenuId = `bar-page-title-action-menu-${this.instanceId}`;\n private sectionTriggerEl: HTMLButtonElement | null = null;\n private actionTriggerEl: FocusableBarTitleButton | null = null;\n private actionTriggerEls = new Map<string, FocusableBarTitleButton>();\n private chromeEl: HTMLElement | null = null;\n private rowEl: HTMLElement | null = null;\n private probeRowEl: HTMLElement | null = null;\n private visibleTabListEl: HTMLElement | null = null;\n private resizeObserver: ResizeObserver | null = null;\n private intrinsicWidthRetryCount = 0;\n private tabLayoutPendingFrames = 0;\n private readonly panelNavTransition = new ChromeTransitionGate();\n private readonly panelToolsTransition = new ChromeTransitionGate();\n private readonly overflowCoalescer = createRafCoalescer(() => {\n this.updateSectionsCollapsed();\n });\n private chromeTransitionShell: HTMLElement | null = null;\n\n componentWillLoad() {\n this.reportActionIdIssues();\n this.syncFocusedTabId(this.effectiveValue, this.selectableTabs);\n }\n\n componentDidLoad() {\n this.setupOverflowObserver();\n this.bindChromeTransitionListeners();\n this.scheduleOverflowCheck();\n }\n\n componentDidRender() {\n if (this.chromeOverflowPaused()) return;\n this.scheduleOverflowCheck();\n }\n\n disconnectedCallback() {\n this.resizeObserver?.disconnect();\n this.resizeObserver = null;\n this.overflowCoalescer.cancel();\n this.unbindChromeTransitionListeners();\n }\n\n @Watch('sections')\n handleSectionsChange(next: BarTitleSectionItem[], prev: BarTitleSectionItem[]) {\n if (!this.hasSectionSelector) {\n this.closeSectionMenu();\n this.sectionSurfaceOpen = false;\n this.sectionsCollapsed = false;\n this.layoutCommitted = true;\n this.intrinsicWidthRetryCount = 0;\n this.tabLayoutPendingFrames = 0;\n return;\n }\n if (barTitleSectionsDigest(next) === barTitleSectionsDigest(prev)) {\n this.syncFocusedTabId(this.effectiveValue, this.selectableTabs);\n return;\n }\n this.resetSectionLayout();\n this.syncFocusedTabId(this.effectiveValue, this.selectableTabs);\n this.scheduleOverflowCheck();\n }\n\n @Watch('value')\n handleValueChange() {\n this.syncFocusedTabId(this.effectiveValue, this.selectableTabs);\n this.scheduleOverflowCheck();\n }\n\n @Watch('heading')\n @Watch('showBack')\n @Watch('primaryAction')\n @Watch('actions')\n @Watch('actionItems')\n handleLayoutInputsChange() {\n this.reportActionIdIssues();\n if (!this.availableActionMenuIds.has(this.openActionMenuId)) this.closeActionMenu();\n if (!this.availableActionMenuIds.has(this.surfaceActionMenuId)) this.surfaceActionMenuId = '';\n this.scheduleOverflowCheck();\n }\n\n private reportActionIdIssues() {\n for (const issue of barTitleActionIdIssues(this.resolvedActionItems)) {\n console.warn(`[ds-bar-page-title] ${issue}`);\n }\n }\n\n private get dividerVisible(): boolean {\n return this.showCompactDivider ?? this.showDivider;\n }\n\n private get usesChromeTokens(): boolean {\n return this.el.hasAttribute('data-shell-bar');\n }\n\n private get shellBarButtonBackground(): 'chrome' | undefined {\n return this.usesChromeTokens ? 'chrome' : undefined;\n }\n\n private get selectableSections() {\n return selectableBarTitleSections(this.sections);\n }\n\n private get hasSectionSelector(): boolean {\n return this.selectableSections.length > 1;\n }\n\n private get sectionTabs() {\n return barTitleSectionsToTabs(this.sections);\n }\n\n private get selectableTabs(): TabItemTab[] {\n return getSelectableTabs(this.sectionTabs);\n }\n\n private get effectiveValue(): string {\n return effectiveBarTitleSectionValue(this.sections, this.value);\n }\n\n private get selectedSectionLabel(): string {\n return selectedBarTitleSectionLabel(this.sections, this.value);\n }\n\n private get sectionTriggerAriaLabel(): string {\n return barTitleSectionTriggerAriaLabel(this.sectionsAriaLabel, this.selectedSectionLabel);\n }\n\n private get sectionMenuSections() {\n return barTitleSectionMenuSections(this.sections, this.effectiveValue);\n }\n\n private get resolvedActionItems(): BarTitleActionConfigItem[] {\n return resolveBarTitleActionItems(this.actionItems, this.primaryAction, this.actions);\n }\n\n private get visibleActions(): BarTitleActionConfigItem[] {\n return visibleBarTitleActions(this.resolvedActionItems, 'compact');\n }\n\n private get actionMenuSections() {\n return overflowBarTitleActionSections(this.resolvedActionItems, 'compact');\n }\n\n private get showActionMenuTrigger(): boolean {\n return this.actionMenuSections.length > 0;\n }\n\n private get availableActionMenuIds(): Set<string> {\n return availableBarTitleActionMenuIds(this.visibleActions, this.showActionMenuTrigger);\n }\n\n private get showSectionTabs(): boolean {\n return this.hasSectionSelector && this.layoutCommitted && !this.sectionsCollapsed;\n }\n\n private get showSectionButton(): boolean {\n return this.hasSectionSelector && this.layoutCommitted && this.sectionsCollapsed;\n }\n\n private resetSectionLayout() {\n this.layoutCommitted = false;\n this.sectionsCollapsed = false;\n this.sectionMenuOpen = false;\n this.sectionMenuInitialFocusVisible = false;\n this.intrinsicWidthRetryCount = 0;\n this.tabLayoutPendingFrames = 0;\n }\n\n private bindChromeTransitionListeners() {\n const shell = this.el.closest<HTMLElement>('ds-shell-app');\n if (!shell) return;\n this.chromeTransitionShell = shell;\n shell.addEventListener(CHROME_TRANSITION_START, this.onChromeTransitionStart);\n shell.addEventListener(CHROME_TRANSITION_END, this.onChromeTransitionEnd);\n }\n\n private unbindChromeTransitionListeners() {\n if (!this.chromeTransitionShell) return;\n this.chromeTransitionShell.removeEventListener(\n CHROME_TRANSITION_START,\n this.onChromeTransitionStart\n );\n this.chromeTransitionShell.removeEventListener(\n CHROME_TRANSITION_END,\n this.onChromeTransitionEnd\n );\n this.chromeTransitionShell = null;\n }\n\n private onChromeTransitionStart = (event: Event) => {\n const source = readChromeTransitionSource(event);\n if (source === 'panel-nav') {\n this.panelNavTransition.enter();\n return;\n }\n if (source === 'panel-tools') {\n const phase = readChromeTransitionPhase(event) ?? 'opening';\n if (phase === 'closing') {\n this.panelToolsTransition.enter();\n }\n }\n };\n\n private chromeOverflowPaused(): boolean {\n return this.panelNavTransition.isActive || this.panelToolsTransition.isActive;\n }\n\n private onChromeTransitionEnd = (event: Event) => {\n const source = readChromeTransitionSource(event);\n if (source === 'panel-nav') {\n this.panelNavTransition.exit();\n if (!this.panelNavTransition.isActive) {\n this.scheduleOverflowCheck();\n }\n return;\n }\n if (source === 'panel-tools') {\n this.panelToolsTransition.exit();\n this.scheduleOverflowCheck();\n }\n };\n\n private setupOverflowObserver() {\n if (typeof ResizeObserver === 'undefined' || !this.chromeEl) return;\n this.resizeObserver?.disconnect();\n this.resizeObserver = new ResizeObserver(() => {\n if (this.chromeOverflowPaused()) return;\n this.scheduleOverflowCheck();\n });\n this.resizeObserver.observe(this.chromeEl);\n }\n\n private scheduleOverflowCheck() {\n if (this.chromeOverflowPaused()) return;\n this.overflowCoalescer.schedule();\n }\n\n private scheduleIntrinsicWidthRetry() {\n if (this.intrinsicWidthRetryCount >= BarPageTitle.INTRINSIC_WIDTH_RETRY_MAX) return;\n this.intrinsicWidthRetryCount++;\n requestAnimationFrame(() => this.scheduleOverflowCheck());\n }\n\n private forceTabLayoutCommit(collapsed: boolean) {\n this.intrinsicWidthRetryCount = 0;\n this.tabLayoutPendingFrames = 0;\n const collapsedChanged = this.sectionsCollapsed !== collapsed;\n if (collapsedChanged) this.sectionsCollapsed = collapsed;\n if (!collapsed && collapsedChanged) {\n this.closeSectionMenu();\n this.sectionSurfaceOpen = false;\n }\n this.layoutCommitted = true;\n }\n\n private getAvailableWidth(): number {\n if (!this.rowEl) return 0;\n const rowWidth = this.rowEl.clientWidth;\n const actions = this.rowEl.querySelector<HTMLElement>('.bar-page-title__actions');\n const actionsWidth = actions?.getBoundingClientRect().width ?? 0;\n const style = getComputedStyle(this.rowEl);\n const gap = parseFloat(style.columnGap || style.gap) || 0;\n return Math.max(0, rowWidth - actionsWidth - (actionsWidth > 0 ? gap : 0));\n }\n\n private updateSectionsCollapsed() {\n if (!this.hasSectionSelector) {\n if (this.sectionsCollapsed) this.sectionsCollapsed = false;\n this.intrinsicWidthRetryCount = 0;\n this.tabLayoutPendingFrames = 0;\n this.layoutCommitted = true;\n return;\n }\n\n const probeWidth = this.probeRowEl?.scrollWidth ?? 0;\n const available = this.getAvailableWidth();\n if (!this.probeRowEl || !this.rowEl || probeWidth === 0) {\n if (this.layoutCommitted) {\n this.scheduleIntrinsicWidthRetry();\n return;\n }\n this.tabLayoutPendingFrames += 1;\n if (\n this.intrinsicWidthRetryCount >= BarPageTitle.INTRINSIC_WIDTH_RETRY_MAX ||\n this.tabLayoutPendingFrames >= BarPageTitle.TAB_LAYOUT_COMMIT_MAX_FRAMES\n ) {\n this.forceTabLayoutCommit(false);\n } else {\n this.scheduleIntrinsicWidthRetry();\n }\n return;\n }\n\n this.intrinsicWidthRetryCount = 0;\n this.tabLayoutPendingFrames = 0;\n const shouldCollapse = tabsOverflowContainer(\n probeWidth,\n available,\n this.sectionsCollapsed,\n BarPageTitle.OVERFLOW_HYSTERESIS_PX\n );\n this.forceTabLayoutCommit(shouldCollapse);\n }\n\n private syncFocusedTabId(preferred: string, tabs: TabItemTab[]) {\n if (tabs.some(tab => tab.id === preferred && !tab.isInactive)) {\n this.focusedTabId = preferred;\n return;\n }\n const first = tabs.find(tab => !tab.isInactive);\n this.focusedTabId = first?.id ?? '';\n }\n\n private selectSection(id: string) {\n const selected = this.selectableSections.find(section => section.id === id);\n if (!selected || selected.isInactive) return;\n this.dsSectionChange.emit(id);\n }\n\n private toggleSectionMenu = (event: MouseEvent) => {\n this.sectionMenuInitialFocusVisible = event.detail === 0;\n this.openActionMenuId = '';\n this.sectionMenuOpen = !this.sectionMenuOpen;\n if (this.sectionMenuOpen) this.sectionSurfaceOpen = true;\n };\n\n private closeSectionMenu = () => {\n this.sectionMenuOpen = false;\n };\n\n private handleSectionSelect = (event: CustomEvent<MenuItemData>) => {\n const id = String(event.detail?.value ?? '');\n this.closeSectionMenu();\n this.selectSection(id);\n requestAnimationFrame(() => this.sectionTriggerEl?.focus());\n };\n\n private toggleActionMenu = (id: string, event: MouseEvent) => {\n this.actionMenuInitialFocusVisible = event.detail === 0;\n this.sectionMenuOpen = false;\n this.openActionMenuId = this.openActionMenuId === id ? '' : id;\n if (this.openActionMenuId) this.surfaceActionMenuId = this.openActionMenuId;\n };\n\n private finishActionMenuClose = (event: CustomEvent<void>) => {\n const id = this.surfaceActionMenuId;\n const domId =\n id === '__overflow'\n ? this.actionMenuId\n : barTitleActionMenuDomId('bar-page-title', this.instanceId, this.resolvedActionItems, id);\n if (this.openActionMenuId !== id && (event.target as HTMLElement).id === domId) {\n this.surfaceActionMenuId = '';\n }\n };\n\n private closeActionMenu = () => {\n this.openActionMenuId = '';\n };\n\n private handleActionSelect = (event: CustomEvent<MenuItemData>) => {\n const id = String(event.detail?.value ?? '');\n const action = findBarTitleAction(this.resolvedActionItems, id);\n if (!action || action.isInactive || ('isLoading' in action && action.isLoading)) return;\n const menuId = this.openActionMenuId;\n this.closeActionMenu();\n this.dsAction.emit(id);\n requestAnimationFrame(() => {\n void restoreBarTitleActionFocus({\n menuId,\n overflowTrigger: this.actionTriggerEl,\n actionTriggers: this.actionTriggerEls,\n resolvedActionItems: this.resolvedActionItems,\n });\n });\n };\n\n private focusVisibleTab(id: string) {\n this.focusedTabId = id;\n const tab = this.visibleTabListEl?.querySelector(`[data-tab-id=\"${id}\"]`) as HTMLElement | null;\n tab?.focus({ preventScroll: true });\n }\n\n private findEnabledTab(from: number, step: 1 | -1): number | null {\n const tabs = this.selectableTabs;\n for (let index = from + step; index >= 0 && index < tabs.length; index += step) {\n if (!tabs[index]?.isInactive) return index;\n }\n return null;\n }\n\n private handleTabKeyDown(event: KeyboardEvent) {\n const tabs = this.selectableTabs;\n if (!tabs.length) return;\n const targetId = (event.target as HTMLElement | null)?.getAttribute('data-tab-id');\n const focusedId = targetId ?? this.focusedTabId;\n\n if (event.key === 'Enter' || event.key === ' ') {\n const focused = tabs.find(tab => tab.id === focusedId);\n if (!focused || focused.isInactive) return;\n event.preventDefault();\n this.selectSection(focused.id);\n return;\n }\n\n const currentIndex = tabs.findIndex(tab => tab.id === focusedId);\n if (currentIndex < 0) return;\n\n let nextIndex: number | null;\n if (event.key === 'ArrowRight') {\n nextIndex = this.findEnabledTab(currentIndex, 1);\n } else if (event.key === 'ArrowLeft') {\n nextIndex = this.findEnabledTab(currentIndex, -1);\n } else if (event.key === 'Home') {\n nextIndex = tabs.findIndex(tab => !tab.isInactive);\n } else if (event.key === 'End') {\n const reversedIndex = [...tabs].reverse().findIndex(tab => !tab.isInactive);\n nextIndex = reversedIndex < 0 ? null : tabs.length - 1 - reversedIndex;\n } else {\n return;\n }\n\n if (nextIndex === null || nextIndex < 0 || nextIndex === currentIndex) return;\n event.preventDefault();\n this.focusVisibleTab(tabs[nextIndex].id);\n }\n\n private chromeActionOptions() {\n return {\n classPrefix: 'bar-page-title',\n compact: true,\n visibleActions: this.visibleActions,\n showOverflowTrigger: this.showActionMenuTrigger,\n actionItems: this.actionItems,\n primaryAction: this.primaryAction,\n resolvedActionItems: this.resolvedActionItems,\n instanceId: this.instanceId,\n openActionMenuId: this.openActionMenuId,\n surfaceActionMenuId: this.surfaceActionMenuId,\n actionsAriaLabel: this.actionsAriaLabel,\n actionMenuTriggerId: this.actionMenuTriggerId,\n actionMenuId: this.actionMenuId,\n actionTriggers: this.actionTriggerEls,\n buttonBackground: this.shellBarButtonBackground,\n setOverflowTriggerEl: (el: FocusableBarTitleButton | null) => {\n this.actionTriggerEl = el;\n },\n toggleActionMenu: this.toggleActionMenu,\n emitAction: (id: string) => this.dsAction.emit(id),\n };\n }\n\n private renderHeading(probe: boolean) {\n return (\n <ds-text\n class=\"bar-page-title__heading ds-control--md\"\n variant=\"text-title-small\"\n emphasis\n color=\"inherit\"\n as={probe ? 'span' : 'h1'}\n wrap={probe ? 'nowrap' : undefined}\n lineTruncation={probe ? 'none' : 1}\n >\n {this.heading}\n </ds-text>\n );\n }\n\n private renderTabList(probe: boolean) {\n return (\n <div\n role={probe ? undefined : 'tablist'}\n class=\"bar-page-title__tab-list\"\n aria-label={probe ? undefined : this.sectionsAriaLabel}\n ref={el => {\n if (!probe) this.visibleTabListEl = (el as HTMLElement) ?? null;\n }}\n onKeyDown={probe ? undefined : (event: KeyboardEvent) => this.handleTabKeyDown(event)}\n >\n {this.sectionTabs.map((tab, index) => {\n if (isTabDivider(tab)) {\n return (\n <div class=\"bar-page-title__tab-divider\" key={`divider-${index}`} aria-hidden=\"true\">\n <div class=\"bar-page-title__tab-divider-line\" />\n </div>\n );\n }\n\n const isSelected = tab.id === this.effectiveValue;\n return (\n <button\n key={tab.id}\n type=\"button\"\n role={probe ? undefined : 'tab'}\n data-tab-id={tab.id}\n class={{\n 'bar-page-title__tab': true,\n 'bar-page-title__tab--selected': isSelected,\n 'ds-control--md': true,\n 'ds-focus-ring-inset': true,\n 'ds-control-inactive': !!tab.isInactive,\n 'ds-interaction-fill--on-chrome': this.usesChromeTokens,\n }}\n aria-selected={isSelected ? 'true' : 'false'}\n aria-disabled={tab.isInactive ? 'true' : undefined}\n disabled={tab.isInactive}\n tabIndex={!probe && tab.id === this.focusedTabId ? 0 : -1}\n onClick={() => !probe && this.selectSection(tab.id)}\n onFocus={() => {\n if (!probe) this.focusedTabId = tab.id;\n }}\n >\n <ds-text\n class=\"bar-page-title__tab-label ds-control-label-box\"\n as=\"span\"\n variant=\"text-body-medium\"\n emphasis={isSelected}\n color=\"inherit\"\n >\n {tab.label}\n </ds-text>\n </button>\n );\n })}\n </div>\n );\n }\n\n private renderIdentity(probe: boolean) {\n return (\n <div class=\"bar-page-title__identity\">\n {renderBarTitleBack({\n classPrefix: 'bar-page-title',\n showBack: this.showBack,\n backAriaLabel: this.backAriaLabel,\n background: this.shellBarButtonBackground,\n onBack: event => this.dsBack.emit(event),\n })}\n {this.renderHeading(probe)}\n </div>\n );\n }\n\n private renderSectionRegion() {\n if (!this.hasSectionSelector) return null;\n if (!this.layoutCommitted) {\n return [\n <div class=\"bar-page-title__divider\" aria-hidden=\"true\" />,\n <div class=\"bar-page-title__tabs-pending\" aria-hidden=\"true\" />,\n ];\n }\n if (this.showSectionTabs) {\n return [\n <div class=\"bar-page-title__divider\" aria-hidden=\"true\" />,\n this.renderTabList(false),\n ];\n }\n return [\n <div class=\"bar-page-title__divider\" aria-hidden=\"true\" />,\n renderBarTitleSectionTrigger({\n classPrefix: 'bar-page-title',\n triggerId: this.sectionMenuTriggerId,\n menuId: this.sectionMenuId,\n open: this.sectionMenuOpen,\n surfaceOpen: this.sectionSurfaceOpen,\n ariaLabel: this.sectionTriggerAriaLabel,\n selectedLabel: this.selectedSectionLabel,\n background: this.shellBarButtonBackground,\n labelColor: this.usesChromeTokens ? 'inherit' : undefined,\n setTriggerEl: el => {\n this.sectionTriggerEl = el;\n },\n onToggle: this.toggleSectionMenu,\n }),\n ];\n }\n\n render() {\n return (\n <Host>\n <div\n class={{\n 'bar-page-title': true,\n 'bar-page-title--divider-hidden': !this.dividerVisible,\n 'ds-chrome-header': true,\n }}\n ref={el => {\n this.chromeEl = (el as HTMLElement) ?? null;\n if (el && !this.resizeObserver) this.setupOverflowObserver();\n }}\n >\n {this.hasSectionSelector ? (\n <div class=\"bar-page-title__probe\" aria-hidden=\"true\" inert>\n <div\n class=\"bar-page-title__probe-row\"\n ref={el => {\n const next = (el as HTMLElement) ?? null;\n if (next === this.probeRowEl) return;\n this.probeRowEl = next;\n if (next) {\n this.intrinsicWidthRetryCount = 0;\n this.tabLayoutPendingFrames = 0;\n this.scheduleOverflowCheck();\n }\n }}\n >\n {this.renderIdentity(true)}\n <div class=\"bar-page-title__divider\" />\n {this.renderTabList(true)}\n </div>\n </div>\n ) : null}\n\n <div class=\"bar-page-title__inner\">\n <div\n class=\"bar-page-title__row\"\n ref={el => {\n this.rowEl = (el as HTMLElement) ?? null;\n }}\n >\n <div class=\"bar-page-title__title-row\">\n {this.renderIdentity(false)}\n {this.renderSectionRegion()}\n </div>\n {renderBarTitleActions(this.chromeActionOptions())}\n </div>\n </div>\n </div>\n\n {this.showSectionButton ? (\n <ds-menu\n id={this.sectionMenuId}\n class=\"bar-page-title__section-menu\"\n anchorId={this.sectionMenuTriggerId}\n menuLabel={this.sectionsAriaLabel}\n open={this.sectionMenuOpen}\n initialFocusVisible={this.sectionMenuInitialFocusVisible}\n sections={this.sectionMenuSections}\n onDsClose={this.closeSectionMenu}\n onDsAfterClose={() => {\n if (!this.sectionMenuOpen) this.sectionSurfaceOpen = false;\n }}\n onDsSelect={this.handleSectionSelect}\n />\n ) : null}\n\n {renderBarTitleActionMenus({\n classPrefix: 'bar-page-title',\n visibleActions: this.visibleActions,\n instanceId: this.instanceId,\n resolvedActionItems: this.resolvedActionItems,\n openActionMenuId: this.openActionMenuId,\n actionMenuInitialFocusVisible: this.actionMenuInitialFocusVisible,\n overflowTrigger: this.actionTriggerEl,\n actionTriggers: this.actionTriggerEls,\n closeActionMenu: this.closeActionMenu,\n finishActionMenuClose: this.finishActionMenuClose,\n handleActionSelect: this.handleActionSelect,\n })}\n\n {renderBarTitleOverflowMenu({\n classPrefix: 'bar-page-title',\n showOverflowTrigger: this.showActionMenuTrigger,\n actionMenuId: this.actionMenuId,\n actionMenuTriggerId: this.actionMenuTriggerId,\n actionsAriaLabel: this.actionsAriaLabel,\n open: this.openActionMenuId === '__overflow',\n actionMenuInitialFocusVisible: this.actionMenuInitialFocusVisible,\n actionMenuSections: this.actionMenuSections,\n closeActionMenu: this.closeActionMenu,\n finishActionMenuClose: this.finishActionMenuClose,\n handleActionSelect: this.handleActionSelect,\n })}\n </Host>\n );\n }\n}\n"],"mappings":"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","ignoreList":[]}
|
|
@@ -1,2 +0,0 @@
|
|
|
1
|
-
import{p as e,H as s,h as a,a as t,t as i}from"./index.js";import{d}from"./p-D8OWhnID.js";const m=()=>`.sc-ds-message-h{display:block;box-sizing:border-box;content-visibility:auto;contain-intrinsic-size:auto var(--dimension-size-800);-webkit-user-select:none;user-select:none}.message-host--group-middle.sc-ds-message-h,.message-host--group-last.sc-ds-message-h{margin-block-start:calc(var(--dimension-space-050) - var(--dimension-space-300))}.message.sc-ds-message{display:grid;grid-template-columns:minmax(0, 1fr) auto;align-items:end;gap:0;width:100%;box-sizing:border-box}.message--outgoing.sc-ds-message{grid-template-columns:minmax(0, 1fr) auto}.message__header.sc-ds-message:empty,.message__footer.sc-ds-message:empty,.message__metadata-actions.sc-ds-message:empty,.message__actions.sc-ds-message:empty{display:none}.message__actions.sc-ds-message:not(:empty){margin-inline-start:var(--dimension-space-075)}.message__body.sc-ds-message{display:flex;flex-direction:column;min-width:0;gap:var(--dimension-space-050)}.message--incoming.sc-ds-message .message__body.sc-ds-message{width:100%}.message__body.sc-ds-message:has(.message__content>ds-message-bubble) .message__header.sc-ds-message{padding-inline-start:calc(var(--dimension-space-100) + var(--dimension-space-025))}.message--outgoing.sc-ds-message .message__body.sc-ds-message{align-items:flex-end}.message--outgoing.sc-ds-message .message__header.sc-ds-message{display:none}.message--system.sc-ds-message .message__body.sc-ds-message{align-items:center}.message__header.sc-ds-message,.message__footer.sc-ds-message,.message__metadata-actions.sc-ds-message,.message__actions.sc-ds-message{display:flex;align-items:center;gap:var(--dimension-space-050)}@media (hover: hover) and (pointer: fine){.message--metadata-hover.sc-ds-message .message__footer.sc-ds-message{opacity:0;pointer-events:none;transition:opacity var(--effect-motion-short-2)}.message--metadata-hover.sc-ds-message:hover .message__footer.sc-ds-message,.message--metadata-hover.sc-ds-message:focus-within .message__footer.sc-ds-message{opacity:1;pointer-events:auto}}@media (prefers-reduced-motion: reduce){.message--metadata-hover.sc-ds-message .message__footer.sc-ds-message{transition:none}}.message__content.sc-ds-message{width:100%;min-width:0;-webkit-user-select:text;user-select:text}.message--outgoing.sc-ds-message .message__content.sc-ds-message{display:flex;justify-content:flex-end}.message__footer.sc-ds-message time.sc-ds-message{display:inline-flex}.message--group-middle.sc-ds-message .message__header.sc-ds-message,.message--group-last.sc-ds-message .message__header.sc-ds-message{display:none}.message--group-first.sc-ds-message .message__footer.sc-ds-message,.message--group-middle.sc-ds-message .message__footer.sc-ds-message{display:none}`;const n={sending:"Sending",sent:"Sent",delivered:"Delivered",read:"Read",failed:"Failed to send"};const o=e(class e extends s{constructor(e){super();if(e!==false){this.__registerHost()}this.messageId="";this.direction="incoming";this.groupPosition="single";this.author="";this.showAuthor=true;this.timestamp="";this.streaming=false;this.metadataVisibility="always";this.scrollAnchor=false}formattedTimestamp(){if(!this.timestamp)return"";const e=Date.parse(this.timestamp);if(Number.isNaN(e))return this.timestamp;return new Intl.DateTimeFormat(undefined,{hour:"numeric",minute:"2-digit"}).format(new Date(e))}renderMetadataActions(){return a("div",{class:"message__metadata-actions"},a("slot",{name:"metadata-actions"}))}render(){const e=this.deliveryState?n[this.deliveryState]:"";const s=this.formattedTimestamp();return a(t,{key:"337ce5ffffa3af3159d5e976a80b808cd0ea7447",class:`message-host--group-${this.groupPosition}`,"data-message-id":this.messageId||undefined,"data-scroll-anchor":this.scrollAnchor?"true":undefined,"aria-busy":this.streaming?"true":undefined},a("article",{key:"667f014e8cb951a8b94959c5cba84eea6f35d6d5",class:{message:true,[`message--${this.direction}`]:true,[`message--group-${this.groupPosition}`]:true,[`message--metadata-${this.metadataVisibility}`]:true},"aria-label":this.author?`Message from ${this.author}`:"Message"},a("div",{key:"d41ffbae092bf44dfe974dcfe93c925e6d575a28",class:"message__body"},a("div",{key:"fd7cef2d8ab41ec2ebd29e2b5f1427f98ae55777",class:"message__header"},a("slot",{key:"2740bc7f89d3debe34141a376ae45c5f17717dc9",name:"header"}),this.author&&this.showAuthor?a("ds-text",{as:"span",variant:"text-body-small",emphasis:true,color:"primary"},this.author):null),a("div",{key:"074e09ec94814c1e69e33689b9d9999ce3506f48",class:"message__content"},a("slot",{key:"9d5431c214a8f0b93cbff8143c4ddd1efe700ccd"})),a("div",{key:"fea4a8e9238ddc504d751b8a6ce1457fc4d16765",class:"message__footer"},this.direction==="incoming"?this.renderMetadataActions():null,a("slot",{key:"d9b291ec32334726a174369250ec5bc091ef0261",name:"footer"}),e?a("ds-text",{as:"span",variant:"text-caption",color:this.deliveryState==="failed"?"negative":"secondary"},e):null,this.deliveryState==="failed"&&s?a("ds-text",{as:"span",variant:"text-caption",color:"tertiary","aria-hidden":"true"},"·"):null,s?a("time",{dateTime:this.timestamp},a("ds-text",{as:"span",variant:"text-caption",color:"secondary"},s)):null,this.direction!=="incoming"?this.renderMetadataActions():null)),a("div",{key:"68b10d0f0033754f105a10a3cce3957891588952",class:"message__actions"},a("slot",{key:"433d1f18d3c51db10647246b552cb5b108de0bfb",name:"actions"}))))}static get style(){return m()}},[262,"ds-message",{messageId:[513,"message-id"],direction:[513],groupPosition:[1,"group-position"],author:[1],showAuthor:[4,"show-author"],timestamp:[1],deliveryState:[1,"delivery-state"],streaming:[4],metadataVisibility:[1,"metadata-visibility"],scrollAnchor:[516,"scroll-anchor"]}]);function c(){if(typeof customElements==="undefined"){return}const e=["ds-message","ds-text"];e.forEach((e=>{switch(e){case"ds-message":if(!customElements.get(i(e))){customElements.define(i(e),o)}break;case"ds-text":if(!customElements.get(i(e))){d()}break}}))}c();export{o as M,c as d};
|
|
2
|
-
//# sourceMappingURL=p-DebLYW7A.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"names":["messageCss","DELIVERY_LABELS","sending","sent","delivered","read","failed","Message","__stencil_proxyCustomElement","HTMLElement","constructor","registerHost","this","messageId","direction","groupPosition","author","showAuthor","timestamp","streaming","metadataVisibility","scrollAnchor","formattedTimestamp","parsed","Date","parse","Number","isNaN","Intl","DateTimeFormat","undefined","hour","minute","format","renderMetadataActions","h","class","name","render","delivery","deliveryState","Host","key","message","as","variant","emphasis","color","dateTime"],"sources":["src/wc/components/Message/Message.css?tag=ds-message&encapsulation=scoped","src/wc/components/Message/Message.tsx"],"sourcesContent":[":host {\n display: block;\n box-sizing: border-box;\n content-visibility: auto;\n contain-intrinsic-size: auto var(--dimension-size-800);\n -webkit-user-select: none;\n user-select: none;\n}\n\n:host(.message-host--group-middle),\n:host(.message-host--group-last) {\n margin-block-start: calc(var(--dimension-space-050) - var(--dimension-space-300));\n}\n\n.message {\n display: grid;\n grid-template-columns: minmax(0, 1fr) auto;\n align-items: end;\n gap: 0;\n width: 100%;\n box-sizing: border-box;\n}\n\n.message--outgoing {\n grid-template-columns: minmax(0, 1fr) auto;\n}\n\n.message__header:empty,\n.message__footer:empty,\n.message__metadata-actions:empty,\n.message__actions:empty {\n display: none;\n}\n\n.message__actions:not(:empty) {\n margin-inline-start: var(--dimension-space-075);\n}\n\n.message__body {\n display: flex;\n flex-direction: column;\n min-width: 0;\n gap: var(--dimension-space-050);\n}\n\n.message--incoming .message__body {\n width: 100%;\n}\n\n.message__body:has(.message__content > ds-message-bubble) .message__header {\n padding-inline-start: calc(var(--dimension-space-100) + var(--dimension-space-025));\n}\n\n.message--outgoing .message__body {\n align-items: flex-end;\n}\n\n.message--outgoing .message__header {\n display: none;\n}\n\n.message--system .message__body {\n align-items: center;\n}\n\n.message__header,\n.message__footer,\n.message__metadata-actions,\n.message__actions {\n display: flex;\n align-items: center;\n gap: var(--dimension-space-050);\n}\n\n@media (hover: hover) and (pointer: fine) {\n .message--metadata-hover .message__footer {\n opacity: 0;\n pointer-events: none;\n transition: opacity var(--effect-motion-short-2);\n }\n\n .message--metadata-hover:hover .message__footer,\n .message--metadata-hover:focus-within .message__footer {\n opacity: 1;\n pointer-events: auto;\n }\n}\n\n@media (prefers-reduced-motion: reduce) {\n .message--metadata-hover .message__footer {\n transition: none;\n }\n}\n\n.message__content {\n width: 100%;\n min-width: 0;\n -webkit-user-select: text;\n user-select: text;\n}\n\n.message--outgoing .message__content {\n display: flex;\n justify-content: flex-end;\n}\n\n.message__footer time {\n display: inline-flex;\n}\n\n.message--group-middle .message__header,\n.message--group-last .message__header {\n display: none;\n}\n\n.message--group-first .message__footer,\n.message--group-middle .message__footer {\n display: none;\n}\n","import { Component, h, Host, Prop } from '@stencil/core';\nimport type {\n MessageDeliveryState,\n MessageDirection,\n MessageGroupPosition,\n MessageMetadataVisibility,\n} from '../conversation-types';\n\nconst DELIVERY_LABELS: Record<MessageDeliveryState, string> = {\n sending: 'Sending',\n sent: 'Sent',\n delivered: 'Delivered',\n read: 'Read',\n failed: 'Failed to send',\n};\n\n@Component({\n tag: 'ds-message',\n styleUrl: 'Message.css',\n scoped: true,\n})\nexport class Message {\n @Prop({ reflect: true }) messageId: string = '';\n @Prop({ reflect: true }) direction: MessageDirection = 'incoming';\n @Prop() groupPosition: MessageGroupPosition = 'single';\n @Prop() author: string = '';\n /** Keep author semantics while allowing products with self-evident roles to hide the visible label. */\n @Prop() showAuthor: boolean = true;\n /** ISO timestamp. */\n @Prop() timestamp: string = '';\n @Prop() deliveryState: MessageDeliveryState | undefined;\n @Prop() streaming: boolean = false;\n /** Controls whether the complete metadata footer is persistent or revealed through hover/focus. */\n @Prop() metadataVisibility: MessageMetadataVisibility = 'always';\n @Prop({ reflect: true }) scrollAnchor: boolean = false;\n\n private formattedTimestamp(): string {\n if (!this.timestamp) return '';\n const parsed = Date.parse(this.timestamp);\n if (Number.isNaN(parsed)) return this.timestamp;\n return new Intl.DateTimeFormat(undefined, {\n hour: 'numeric',\n minute: '2-digit',\n }).format(new Date(parsed));\n }\n\n private renderMetadataActions() {\n return (\n <div class=\"message__metadata-actions\">\n <slot name=\"metadata-actions\" />\n </div>\n );\n }\n\n render() {\n const delivery = this.deliveryState ? DELIVERY_LABELS[this.deliveryState] : '';\n const formattedTimestamp = this.formattedTimestamp();\n return (\n <Host\n class={`message-host--group-${this.groupPosition}`}\n data-message-id={this.messageId || undefined}\n data-scroll-anchor={this.scrollAnchor ? 'true' : undefined}\n aria-busy={this.streaming ? 'true' : undefined}\n >\n <article\n class={{\n message: true,\n [`message--${this.direction}`]: true,\n [`message--group-${this.groupPosition}`]: true,\n [`message--metadata-${this.metadataVisibility}`]: true,\n }}\n aria-label={this.author ? `Message from ${this.author}` : 'Message'}\n >\n <div class=\"message__body\">\n <div class=\"message__header\">\n <slot name=\"header\" />\n {this.author && this.showAuthor ? (\n <ds-text as=\"span\" variant=\"text-body-small\" emphasis color=\"primary\">\n {this.author}\n </ds-text>\n ) : null}\n </div>\n <div class=\"message__content\">\n <slot />\n </div>\n <div class=\"message__footer\">\n {this.direction === 'incoming' ? this.renderMetadataActions() : null}\n <slot name=\"footer\" />\n {delivery ? (\n <ds-text\n as=\"span\"\n variant=\"text-caption\"\n color={this.deliveryState === 'failed' ? 'negative' : 'secondary'}\n >\n {delivery}\n </ds-text>\n ) : null}\n {this.deliveryState === 'failed' && formattedTimestamp ? (\n <ds-text as=\"span\" variant=\"text-caption\" color=\"tertiary\" aria-hidden=\"true\">\n ·\n </ds-text>\n ) : null}\n {formattedTimestamp ? (\n <time dateTime={this.timestamp}>\n <ds-text as=\"span\" variant=\"text-caption\" color=\"secondary\">\n {formattedTimestamp}\n </ds-text>\n </time>\n ) : null}\n {this.direction !== 'incoming' ? this.renderMetadataActions() : null}\n </div>\n </div>\n <div class=\"message__actions\">\n <slot name=\"actions\" />\n </div>\n </article>\n </Host>\n );\n }\n}\n"],"mappings":"0FAAA,MAAMA,EAAa,IAAM,+nFCQzB,MAAMC,EAAwD,CAC5DC,QAAS,UACTC,KAAM,OACNC,UAAW,YACXC,KAAM,OACNC,OAAQ,kB,MAQGC,EAAOC,EAAA,MAAAD,UAAAE,EALpB,WAAAC,CAAAC,G,4CAM2BC,KAAAC,UAAoB,GACpBD,KAAAE,UAA8B,WAC/CF,KAAAG,cAAsC,SACtCH,KAAAI,OAAiB,GAEjBJ,KAAAK,WAAsB,KAEtBL,KAAAM,UAAoB,GAEpBN,KAAAO,UAAqB,MAErBP,KAAAQ,mBAAgD,SAC/BR,KAAAS,aAAwB,KAqFlD,CAnFS,kBAAAC,GACN,IAAKV,KAAKM,UAAW,MAAO,GAC5B,MAAMK,EAASC,KAAKC,MAAMb,KAAKM,WAC/B,GAAIQ,OAAOC,MAAMJ,GAAS,OAAOX,KAAKM,UACtC,OAAO,IAAIU,KAAKC,eAAeC,UAAW,CACxCC,KAAM,UACNC,OAAQ,YACPC,OAAO,IAAIT,KAAKD,G,CAGb,qBAAAW,GACN,OACEC,EAAA,OAAKC,MAAM,6BACTD,EAAA,QAAME,KAAK,qB,CAKjB,MAAAC,GACE,MAAMC,EAAW3B,KAAK4B,cAAgBvC,EAAgBW,KAAK4B,eAAiB,GAC5E,MAAMlB,EAAqBV,KAAKU,qBAChC,OACEa,EAACM,EAAI,CAAAC,IAAA,2CACHN,MAAO,uBAAuBxB,KAAKG,gBAAe,kBACjCH,KAAKC,WAAaiB,UAAS,qBACxBlB,KAAKS,aAAe,OAASS,UAAS,YAC/ClB,KAAKO,UAAY,OAASW,WAErCK,EAAA,WAAAO,IAAA,2CACEN,MAAO,CACLO,QAAS,KACT,CAAC,YAAY/B,KAAKE,aAAc,KAChC,CAAC,kBAAkBF,KAAKG,iBAAkB,KAC1C,CAAC,qBAAqBH,KAAKQ,sBAAuB,MACnD,aACWR,KAAKI,OAAS,gBAAgBJ,KAAKI,SAAW,WAE1DmB,EAAA,OAAAO,IAAA,2CAAKN,MAAM,iBACTD,EAAA,OAAAO,IAAA,2CAAKN,MAAM,mBACTD,EAAA,QAAAO,IAAA,2CAAML,KAAK,WACVzB,KAAKI,QAAUJ,KAAKK,WACnBkB,EAAA,WAASS,GAAG,OAAOC,QAAQ,kBAAkBC,SAAQ,KAACC,MAAM,WACzDnC,KAAKI,QAEN,MAENmB,EAAA,OAAAO,IAAA,2CAAKN,MAAM,oBACTD,EAAA,QAAAO,IAAA,8CAEFP,EAAA,OAAAO,IAAA,2CAAKN,MAAM,mBACRxB,KAAKE,YAAc,WAAaF,KAAKsB,wBAA0B,KAChEC,EAAA,QAAAO,IAAA,2CAAML,KAAK,WACVE,EACCJ,EAAA,WACES,GAAG,OACHC,QAAQ,eACRE,MAAOnC,KAAK4B,gBAAkB,SAAW,WAAa,aAErDD,GAED,KACH3B,KAAK4B,gBAAkB,UAAYlB,EAClCa,EAAA,WAASS,GAAG,OAAOC,QAAQ,eAAeE,MAAM,WAAU,cAAa,QAAM,KAG3E,KACHzB,EACCa,EAAA,QAAMa,SAAUpC,KAAKM,WACnBiB,EAAA,WAASS,GAAG,OAAOC,QAAQ,eAAeE,MAAM,aAC7CzB,IAGH,KACHV,KAAKE,YAAc,WAAaF,KAAKsB,wBAA0B,OAGpEC,EAAA,OAAAO,IAAA,2CAAKN,MAAM,oBACTD,EAAA,QAAAO,IAAA,2CAAML,KAAK,c","ignoreList":[]}
|