@ds-mo/ui 12.1.0 → 12.3.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/README.md +26 -3
- package/dist/.build-stamp +1 -1
- package/dist/agent-patterns.json +8 -7
- package/dist/agent.json +837 -66
- package/dist/angular/ds-avatar.d.ts +1 -1
- package/dist/angular/ds-avatar.js +3 -3
- package/dist/angular/ds-bar-title.d.ts +7 -1
- package/dist/angular/ds-bar-title.js +7 -4
- package/dist/angular/ds-bar-workflow.d.ts +28 -0
- package/dist/angular/ds-bar-workflow.js +48 -0
- package/dist/angular/ds-breadcrumb.d.ts +19 -0
- package/dist/angular/ds-breadcrumb.js +42 -0
- package/dist/angular/ds-card-data-viz-bar.d.ts +18 -0
- package/dist/angular/ds-card-data-viz-bar.js +42 -0
- package/dist/angular/ds-card-data-viz-line.d.ts +18 -0
- package/dist/angular/ds-card-data-viz-line.js +42 -0
- package/dist/angular/ds-chart-bar-stacked.d.ts +12 -0
- package/dist/angular/ds-chart-bar-stacked.js +38 -0
- package/dist/angular/ds-chart-legend.d.ts +1 -1
- package/dist/angular/ds-chart-legend.js +3 -3
- package/dist/angular/ds-conversation-list.d.ts +1 -1
- package/dist/angular/ds-conversation-list.js +4 -3
- package/dist/angular/ds-scroll-overlay.d.ts +19 -0
- package/dist/angular/ds-scroll-overlay.js +43 -0
- package/dist/angular/ds-shell-page.d.ts +1 -1
- package/dist/angular/ds-shell-page.js +3 -3
- package/dist/angular/index.d.ts +1 -1
- package/dist/angular/index.js +6 -0
- package/dist/angular/proxies.d.ts +6 -0
- package/dist/angular/proxies.js +6 -0
- package/dist/components/ds-agent-activity.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-avatar.js.map +1 -1
- package/dist/components/ds-badge.js +1 -1
- package/dist/components/ds-bar-nav.js +1 -1
- package/dist/components/ds-bar-nav.js.map +1 -1
- package/dist/components/ds-bar-title.js +1 -1
- package/dist/components/ds-bar-title.js.map +1 -1
- package/dist/components/ds-bar-workflow.d.ts +11 -0
- package/dist/components/ds-bar-workflow.js +2 -0
- package/dist/components/ds-bar-workflow.js.map +1 -0
- package/dist/components/ds-breadcrumb.d.ts +11 -0
- package/dist/components/ds-breadcrumb.js +2 -0
- package/dist/components/ds-breadcrumb.js.map +1 -0
- package/dist/components/ds-button-filled.js +1 -1
- package/dist/components/ds-button-unfilled.js +1 -1
- package/dist/components/ds-card-data-viz-bar.d.ts +11 -0
- package/dist/components/ds-card-data-viz-bar.js +2 -0
- package/dist/components/ds-card-data-viz-bar.js.map +1 -0
- package/dist/components/ds-card-data-viz-donut.js +1 -1
- package/dist/components/ds-card-data-viz-line.d.ts +11 -0
- package/dist/components/ds-card-data-viz-line.js +2 -0
- package/dist/components/ds-card-data-viz-line.js.map +1 -0
- package/dist/components/ds-card-setting.js +1 -1
- package/dist/components/ds-card-shell-data-viz.js +1 -1
- package/dist/components/ds-chart-bar-stacked.d.ts +11 -0
- package/dist/components/ds-chart-bar-stacked.js +2 -0
- package/dist/components/ds-chart-bar-stacked.js.map +1 -0
- package/dist/components/ds-chart-bar.js +1 -1
- package/dist/components/ds-chart-bar.js.map +1 -1
- package/dist/components/ds-chart-donut.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-line.js +1 -1
- package/dist/components/ds-chart-line.js.map +1 -1
- package/dist/components/ds-checkbox.js +1 -1
- package/dist/components/ds-chip.js +1 -1
- package/dist/components/ds-chip.js.map +1 -1
- package/dist/components/ds-code-block.js +1 -1
- package/dist/components/ds-conversation-list-item.js +1 -1
- package/dist/components/ds-conversation-list-item.js.map +1 -1
- package/dist/components/ds-conversation-list-section.js +1 -1
- package/dist/components/ds-conversation-list-section.js.map +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-divider.js +1 -1
- package/dist/components/ds-empty-state.js +1 -1
- package/dist/components/ds-field.js +1 -1
- package/dist/components/ds-input.js +1 -1
- package/dist/components/ds-input.js.map +1 -1
- package/dist/components/ds-markdown.js +1 -1
- package/dist/components/ds-menu.js +1 -1
- package/dist/components/ds-message-bubble.js +1 -1
- package/dist/components/ds-message-bubble.js.map +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-scroller.js.map +1 -1
- package/dist/components/ds-message.js +1 -1
- package/dist/components/ds-modal.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-sub-nav.js.map +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.js +1 -1
- package/dist/components/ds-radio.js.map +1 -1
- package/dist/components/ds-scroll-overlay.d.ts +11 -0
- package/dist/components/ds-scroll-overlay.js +2 -0
- package/dist/components/ds-scroll-overlay.js.map +1 -0
- package/dist/components/ds-select-multi.js +1 -1
- package/dist/components/ds-select-multi.js.map +1 -1
- package/dist/components/ds-select.js +1 -1
- package/dist/components/ds-select.js.map +1 -1
- package/dist/components/ds-shell-app.js +1 -1
- package/dist/components/ds-shell-gradient-picker.js +1 -1
- package/dist/components/ds-shell-gradient-swatch.js +1 -1
- package/dist/components/ds-shell-gradient-swatch.js.map +1 -1
- package/dist/components/ds-shell-page.js +1 -1
- package/dist/components/ds-shell-page.js.map +1 -1
- package/dist/components/ds-skeleton.js +1 -1
- package/dist/components/ds-slider.js +1 -1
- package/dist/components/ds-slider.js.map +1 -1
- package/dist/components/ds-swatch-picker.js +1 -1
- package/dist/components/ds-switch.js +1 -1
- package/dist/components/ds-tab-group.js +1 -1
- package/dist/components/ds-tab-group.js.map +1 -1
- package/dist/components/ds-tag.js +1 -1
- package/dist/components/ds-tag.js.map +1 -1
- package/dist/components/ds-text.js +1 -1
- package/dist/components/ds-toast.js +1 -1
- package/dist/components/ds-tooltip-data-viz.js +1 -1
- package/dist/components/ds-tooltip.js +1 -1
- package/dist/components/ds-typing-indicator.js +1 -1
- package/dist/components/ds-typing-indicator.js.map +1 -1
- package/dist/components/{p-B9jvSGid.js → p-9dQQSgwT.js} +2 -2
- package/dist/components/p-B3rbhRAk.js +2 -0
- package/dist/components/p-B3rbhRAk.js.map +1 -0
- package/dist/components/{p-BWUTr_XN.js → p-BJMRBHKW.js} +2 -2
- package/dist/components/p-BJMRBHKW.js.map +1 -0
- package/dist/components/p-BVV_rlIP.js +2 -0
- package/dist/components/p-BVV_rlIP.js.map +1 -0
- package/dist/components/p-BhxwpOH8.js +2 -0
- package/dist/components/{p-DpyTrZa2.js.map → p-BhxwpOH8.js.map} +1 -1
- package/dist/components/p-Bi_bxbih.js +2 -0
- package/dist/components/{p-Dqwcw1-m.js.map → p-Bi_bxbih.js.map} +1 -1
- package/dist/components/p-BtEjlcB9.js +2 -0
- package/dist/components/{p-DABj3qTX.js.map → p-BtEjlcB9.js.map} +1 -1
- package/dist/components/{p-Bs6SS34m.js → p-BwGnhInj.js} +2 -2
- package/dist/components/p-BwGnhInj.js.map +1 -0
- package/dist/components/p-C0NPJ0h2.js +2 -0
- package/dist/components/p-C0NPJ0h2.js.map +1 -0
- package/dist/components/{p-BkwBtZs3.js → p-C7bZ-jiU.js} +2 -2
- package/dist/components/p-CH3w-P2H.js +2 -0
- package/dist/components/p-CH3w-P2H.js.map +1 -0
- package/dist/components/{p-DxeHimqk.js → p-CH6cNXXF.js} +2 -2
- package/dist/components/p-CWlh7HAg.js +2 -0
- package/dist/components/p-CWlh7HAg.js.map +1 -0
- package/dist/components/p-CY19gMiz.js +2 -0
- package/dist/components/p-CY19gMiz.js.map +1 -0
- package/dist/components/p-C_ewSXTT.js +2 -0
- package/dist/components/p-C_ewSXTT.js.map +1 -0
- package/dist/components/{p-tDXHTAJh.js → p-Ce52yVXF.js} +2 -2
- package/dist/components/p-CoYFJD-w.js +2 -0
- package/dist/components/{p-webARv8d.js.map → p-CoYFJD-w.js.map} +1 -1
- package/dist/components/{p-BzsITTZa.js → p-Cuw2Lo2g.js} +2 -2
- package/dist/components/p-CydY-v7X.js +2 -0
- package/dist/components/p-CydY-v7X.js.map +1 -0
- package/dist/components/{p-LFGbdi7Y.js → p-D-xttdpn.js} +2 -2
- package/dist/components/{p-DfIch2Dk.js → p-D3DYxbC5.js} +2 -2
- package/dist/components/{p-CR7yMitN.js → p-DC7yOUQx.js} +2 -2
- package/dist/components/{p-liMPkhUP.js → p-DSa0Hnd3.js} +2 -2
- package/dist/components/p-DXewjzkM.js +2 -0
- package/dist/components/p-DXewjzkM.js.map +1 -0
- package/dist/components/p-DYqReipj.js +2 -0
- package/dist/components/{p-Dy_sZ-dI.js.map → p-DYqReipj.js.map} +1 -1
- package/dist/components/p-DbpfpeQT.js +2 -0
- package/dist/components/p-DbpfpeQT.js.map +1 -0
- package/dist/components/{p-DszI94sZ.js → p-DjPZxzIG.js} +2 -2
- package/dist/components/{p-DszI94sZ.js.map → p-DjPZxzIG.js.map} +1 -1
- package/dist/components/{p-CTV_QWC5.js → p-J6xK6Ihq.js} +2 -2
- package/dist/components/{p-Dfxnxx7L.js → p-jCWtxthA.js} +2 -2
- package/dist/docs/components.json +2137 -743
- package/dist/lib/utils/anchored-popup.d.ts +5 -1
- package/dist/lib/utils/index.js +3 -1
- package/dist/lib/utils/index.js.map +2 -2
- package/dist/mcp/cli.js +142 -18
- package/dist/mcp-data/registry/agent-response.json +9 -4
- package/dist/mcp-data/registry/agent-source-list.json +1 -1
- package/dist/mcp-data/registry/avatar.json +26 -7
- package/dist/mcp-data/registry/bar-title.json +76 -37
- package/dist/mcp-data/registry/bar-workflow.json +368 -0
- package/dist/mcp-data/registry/breadcrumb.json +205 -0
- package/dist/mcp-data/registry/button-filled.json +1 -1
- package/dist/mcp-data/registry/button-unfilled.json +1 -1
- package/dist/mcp-data/registry/card-data-viz-bar.json +212 -0
- package/dist/mcp-data/registry/card-data-viz-line.json +206 -0
- package/dist/mcp-data/registry/card-shell-data-viz.json +7 -0
- package/dist/mcp-data/registry/chart-bar-stacked.json +225 -0
- package/dist/mcp-data/registry/chart-bar.json +9 -2
- package/dist/mcp-data/registry/chart-legend.json +29 -3
- package/dist/mcp-data/registry/chart-line.json +4 -2
- package/dist/mcp-data/registry/checkbox.json +1 -1
- package/dist/mcp-data/registry/conversation-list-item.json +2 -2
- package/dist/mcp-data/registry/conversation-list-section.json +2 -2
- package/dist/mcp-data/registry/conversation-list.json +36 -9
- package/dist/mcp-data/registry/markdown.json +15 -10
- package/dist/mcp-data/registry/menu.json +9 -7
- package/dist/mcp-data/registry/message-scroller.json +6 -4
- package/dist/mcp-data/registry/message.json +3 -2
- package/dist/mcp-data/registry/panel-tool-search.json +1 -1
- package/dist/mcp-data/registry/registry.json +863 -74
- package/dist/mcp-data/registry/scroll-overlay.json +183 -0
- package/dist/mcp-data/registry/shell-gradient-swatch.json +1 -1
- package/dist/mcp-data/registry/shell-page.json +40 -19
- package/dist/mcp-data/registry/slider.json +1 -1
- package/dist/mcp-data/registry/switch.json +1 -1
- package/dist/mcp-data/registry/tab-group.json +1 -1
- package/dist/mcp-data/registry/text.json +1 -1
- package/dist/mcp-data/registry/typing-indicator.json +7 -7
- package/dist/react/components.d.ts +6 -0
- package/dist/react/components.js +6 -0
- package/dist/react/ds-bar-title.d.ts +2 -1
- package/dist/react/ds-bar-title.js +1 -0
- package/dist/react/ds-bar-workflow.d.ts +14 -0
- package/dist/react/ds-bar-workflow.js +16 -0
- package/dist/react/ds-breadcrumb.d.ts +12 -0
- package/dist/react/ds-breadcrumb.js +12 -0
- package/dist/react/ds-card-data-viz-bar.d.ts +12 -0
- package/dist/react/ds-card-data-viz-bar.js +12 -0
- package/dist/react/ds-card-data-viz-line.d.ts +12 -0
- package/dist/react/ds-card-data-viz-line.js +12 -0
- package/dist/react/ds-chart-bar-stacked.d.ts +9 -0
- package/dist/react/ds-chart-bar-stacked.js +12 -0
- package/dist/react/ds-scroll-overlay.d.ts +12 -0
- package/dist/react/ds-scroll-overlay.js +12 -0
- package/dist/styles/prose.css +215 -0
- package/dist/types/components/Avatar/Avatar.d.ts +4 -1
- package/dist/types/components/BarTitle/BarTitle.d.ts +14 -5
- package/dist/types/components/BarTitle/bar-title-types.d.ts +0 -1
- package/dist/types/components/BarWorkflow/BarWorkflow.d.ts +37 -0
- package/dist/types/components/BarWorkflow/bar-workflow-types.d.ts +12 -0
- package/dist/types/components/Breadcrumb/Breadcrumb.d.ts +31 -0
- package/dist/types/components/Breadcrumb/breadcrumb-types.d.ts +17 -0
- package/dist/types/components/CardDataVizBar/CardDataVizBar.d.ts +24 -0
- package/dist/types/components/CardDataVizBar/index.d.ts +2 -0
- package/dist/types/components/CardDataVizLine/CardDataVizLine.d.ts +24 -0
- package/dist/types/components/CardDataVizLine/index.d.ts +2 -0
- package/dist/types/components/ChartBarStacked/ChartBarStacked.d.ts +15 -0
- package/dist/types/components/ChartBarStacked/index.d.ts +3 -0
- package/dist/types/components/ChartLegend/ChartLegend.d.ts +3 -0
- package/dist/types/components/ConversationList/ConversationList.d.ts +12 -0
- package/dist/types/components/Menu/Menu.d.ts +1 -2
- package/dist/types/components/MessageScroller/MessageScroller.d.ts +1 -6
- package/dist/types/components/ScrollOverlay/ScrollOverlay.d.ts +28 -0
- package/dist/types/components/ShellPage/ShellPage.d.ts +19 -7
- package/dist/types/components/ShellPage/shell-page-responsive.d.ts +0 -8
- package/dist/types/components/TypingIndicator/TypingIndicator.d.ts +1 -1
- package/dist/types/components.d.ts +572 -26
- package/dist/types/stories/isolated-overlay-docs.d.ts +13 -0
- package/dist/types/utils/anchored-popup.d.ts +5 -1
- package/dist/types/utils/scroll-overlay-controller.d.ts +35 -0
- package/package.json +4 -3
- package/dist/components/p-BWUTr_XN.js.map +0 -1
- package/dist/components/p-BfEjWe8U.js +0 -2
- package/dist/components/p-BfEjWe8U.js.map +0 -1
- package/dist/components/p-Bs6SS34m.js.map +0 -1
- package/dist/components/p-C3Zfn7hz.js +0 -2
- package/dist/components/p-C3Zfn7hz.js.map +0 -1
- package/dist/components/p-CUik7PCi.js +0 -2
- package/dist/components/p-CUik7PCi.js.map +0 -1
- package/dist/components/p-CzBnvtcz.js +0 -2
- package/dist/components/p-CzBnvtcz.js.map +0 -1
- package/dist/components/p-DABj3qTX.js +0 -2
- package/dist/components/p-DpyTrZa2.js +0 -2
- package/dist/components/p-Dqwcw1-m.js +0 -2
- package/dist/components/p-Dy3Skua8.js +0 -2
- package/dist/components/p-Dy3Skua8.js.map +0 -1
- package/dist/components/p-Dy_sZ-dI.js +0 -2
- package/dist/components/p-l6PmnW_P.js +0 -2
- package/dist/components/p-l6PmnW_P.js.map +0 -1
- package/dist/components/p-webARv8d.js +0 -2
- /package/dist/components/{p-B9jvSGid.js.map → p-9dQQSgwT.js.map} +0 -0
- /package/dist/components/{p-BkwBtZs3.js.map → p-C7bZ-jiU.js.map} +0 -0
- /package/dist/components/{p-DxeHimqk.js.map → p-CH6cNXXF.js.map} +0 -0
- /package/dist/components/{p-tDXHTAJh.js.map → p-Ce52yVXF.js.map} +0 -0
- /package/dist/components/{p-BzsITTZa.js.map → p-Cuw2Lo2g.js.map} +0 -0
- /package/dist/components/{p-LFGbdi7Y.js.map → p-D-xttdpn.js.map} +0 -0
- /package/dist/components/{p-DfIch2Dk.js.map → p-D3DYxbC5.js.map} +0 -0
- /package/dist/components/{p-CR7yMitN.js.map → p-DC7yOUQx.js.map} +0 -0
- /package/dist/components/{p-liMPkhUP.js.map → p-DSa0Hnd3.js.map} +0 -0
- /package/dist/components/{p-CTV_QWC5.js.map → p-J6xK6Ihq.js.map} +0 -0
- /package/dist/components/{p-Dfxnxx7L.js.map → p-jCWtxthA.js.map} +0 -0
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["tabsToMenuSections","tabs","selectedId","sections","batch","item","isTabDivider","length","push","items","label","value","id","dot","isSelected","isInactive","tabsToOverflowMenuSections","trimLeadingDividers","tabsOverflowContainer","tabListScrollWidth","containerClientWidth","collapsed","hysteresis","diff","visibleTabCountForWidth","itemWidths","availableWidth","overflowTriggerWidth","itemGap","listExtraWidth","fullWidth","widthForItemCount","availableForTabs","Math","max","count","i","width","trimTrailingDividers","end","slice","start","itemsWidth","reduce","sum","barNavCss","BarNav","__stencil_proxyCustomElement","HTMLElement","constructor","registerHost","this","navStyle","tabsJson","basePath","currentUrl","moreTabsLabel","resolvedTabs","urlDerivedValue","hideTabsForDetailRoute","tabsCollapsed","menuOpen","menuTriggerActive","tabLayoutCommitted","visibleTabs","overflowTabs","menuInitialFocusVisible","overflowRovingFocused","focusedTabId","headerEl","triggerEl","menuEl","visibleTabListEl","probeTabListEl","resizeObserver","intrinsicWidthRetryCount","tabLayoutPendingFrames","panelNavTransition","ChromeTransitionGate","panelToolsTransition","overflowCoalescer","createRafCoalescer","updateTabsCollapsed","chromeTransitionShell","committedSection","pendingSection","onChromeTransitionStart","event","source","readChromeTransitionSource","enter","phase","readChromeTransitionPhase","onChromeTransitionEnd","exit","isActive","scheduleOverflowCheck","handleOverflowFocus","handleOverflowBlur","effectiveValue","renderedSelectableTabs","hasOverflowTabs","getSelectableTabs","syncFocusedTabId","preferred","some","tab","first","find","digestTabsConfig","map","t","join","resetTabOverflowLayout","onHostPropsChange","applyHostProps","onSelectionChange","syncMenuSections","onMenuOpenChange","open","onTabsCollapsedChange","prevCollapsed","requestAnimationFrame","undefined","queueMicrotask","focusVisibleSelectedTab","componentWillLoad","componentDidLoad","syncHostPropsIfNeeded","scheduleDeferredHostPropSync","setupOverflowObserver","bindChromeTransitionListeners","componentDidRender","chromeOverflowPaused","syncMenuAnchor","disconnectedCallback","disconnect","cancel","unbindChromeTransitionListeners","shell","el","closest","addEventListener","CHROME_TRANSITION_START","CHROME_TRANSITION_END","removeEventListener","shouldResyncBarNavProps","syncValueFromUrl","remaining","HOST_PROP_SYNC_BUDGET","tick","ResizeObserver","observe","schedule","getLeftZoneAvailableWidth","headerStyle","getComputedStyle","horizontalPadding","parseFloat","paddingLeft","paddingRight","clientWidth","getTabsIntrinsicWidth","scrollWidth","getHeaderGap","style","columnGap","gap","getOverflowTriggerReserveWidth","getBoundingClientRect","getProbeTabMetrics","tabList","children","Array","from","child","childrenWidth","gapWidth","setOverflowTabLayout","nextCollapsed","visibleChanged","overflowChanged","scheduleIntrinsicWidthRetry","INTRINSIC_WIDTH_RETRY_MAX","forceTabLayoutCommit","fallbackCollapsed","metrics","intrinsicWidth","TAB_LAYOUT_COMMIT_MAX_FRAMES","shouldCollapse","OVERFLOW_HYSTERESIS_PX","visibleCount","anchor","handleMenuSelect","e","detail","selectTab","String","handleMenuClose","handleMenuAfterClose","incomingTabs","parseJsonArrayProp","nextBasePath","sectionChanged","startsWith","tabsConfigChanged","hideTabs","deriveBarNavValueFromUrl","dsTabChange","emit","querySelector","focus","preventScroll","focusVisibleTab","focusLastVisibleTab","last","reverse","findEnabledVisibleTab","step","index","handleTabKeyDown","targetId","target","getAttribute","focusedId","key","focused","preventDefault","currentIndex","findIndex","nextIndex","setFocus","reversedIndex","toggleTabMenu","options","minWidth","focusVisible","handleTriggerKeyDown","renderTabList","probe","h","role","class","heading","ref","next","onKeyDown","onFocusin","type","panelId","disabled","tabIndex","onClick","onFocus","as","variant","emphasis","color","hasRing","render","sectionReady","hasTabs","tabGroupKey","renderedTabs","Host","inert","wrap","icon","activeFill","hasBorder","focusTabIndex","haspopup","expanded","onDsClick","onFocusout","side","align","sideOffset","initialFocusVisible","onDsSelect","onDsClose","onDsAfterClose"],"sources":["src/wc/components/BarNav/bar-nav-tabs-menu-utils.ts","src/wc/components/BarNav/BarNav.css?tag=ds-bar-nav&encapsulation=scoped","src/wc/components/BarNav/BarNav.tsx"],"sourcesContent":["import type { MenuItemData, MenuSection } from '../Menu/menu-types';\nimport {\n getSelectableTabs,\n isTabDivider,\n type TabItem,\n type TabItemTab,\n} from '../TabGroup/tab-item-utils';\n\n/** Map BarNav tabs to menu sections, preserving `{ type: 'divider' }` as section breaks. */\nexport function tabsToMenuSections(tabs: TabItem[], selectedId: string): MenuSection[] {\n const sections: MenuSection[] = [];\n let batch: MenuItemData[] = [];\n\n for (const item of tabs) {\n if (isTabDivider(item)) {\n if (batch.length > 0) {\n sections.push({ items: batch });\n batch = [];\n }\n continue;\n }\n\n batch.push({\n label: item.label,\n value: item.id,\n dot: item.dot,\n isSelected: item.id === selectedId,\n isInactive: item.isInactive,\n });\n }\n\n if (batch.length > 0) {\n sections.push({ items: batch });\n }\n\n return sections;\n}\n\nexport function tabsToOverflowMenuSections(tabs: TabItem[], selectedId: string): MenuSection[] {\n return tabsToMenuSections(trimLeadingDividers(tabs), selectedId);\n}\n\nexport function getActiveTab(tabs: TabItem[], selectedId: string): TabItemTab | undefined {\n const selectable = getSelectableTabs(tabs);\n return selectable.find(tab => tab.id === selectedId) ?? selectable[0];\n}\n\nexport function getActiveTabLabel(tabs: TabItem[], selectedId: string): string {\n return getActiveTab(tabs, selectedId)?.label ?? 'Tabs';\n}\n\n/** True when tablist content exceeds the available width (with optional hysteresis). */\nexport function tabsOverflowContainer(\n tabListScrollWidth: number,\n containerClientWidth: number,\n collapsed: boolean,\n hysteresis = 2,\n): boolean {\n const diff = tabListScrollWidth - containerClientWidth;\n if (collapsed) {\n return diff > -hysteresis;\n }\n return diff > hysteresis;\n}\n\nexport function visibleTabCountForWidth(\n itemWidths: number[],\n availableWidth: number,\n overflowTriggerWidth: number,\n itemGap: number,\n listExtraWidth: number,\n): number {\n if (itemWidths.length === 0 || availableWidth <= 0) return 0;\n\n const fullWidth = widthForItemCount(itemWidths, itemWidths.length, itemGap, listExtraWidth);\n if (fullWidth <= availableWidth) return itemWidths.length;\n\n const availableForTabs = Math.max(0, availableWidth - overflowTriggerWidth);\n let count = 0;\n\n for (let i = 1; i <= itemWidths.length; i++) {\n const width = widthForItemCount(itemWidths, i, itemGap, listExtraWidth);\n if (width > availableForTabs) break;\n count = i;\n }\n\n return count;\n}\n\nexport function trimTrailingDividers(tabs: TabItem[]): TabItem[] {\n let end = tabs.length;\n while (end > 0 && isTabDivider(tabs[end - 1])) {\n end -= 1;\n }\n return tabs.slice(0, end);\n}\n\nfunction trimLeadingDividers(tabs: TabItem[]): TabItem[] {\n let start = 0;\n while (start < tabs.length && isTabDivider(tabs[start])) {\n start += 1;\n }\n return tabs.slice(start);\n}\n\nfunction widthForItemCount(\n itemWidths: number[],\n count: number,\n itemGap: number,\n listExtraWidth: number,\n): number {\n if (count <= 0) return 0;\n const itemsWidth = itemWidths.slice(0, count).reduce((sum, width) => sum + width, 0);\n return listExtraWidth + itemsWidth + itemGap * Math.max(0, count - 1);\n}\n","@import '../../utils/control-density.css';\n@import '../../utils/focus-ring.css';\n@import '../../utils/control-inactive.css';\n\n:host {\n display: block;\n}\n\n.bar-nav {\n display: flex;\n align-items: center;\n position: relative;\n height: var(--dimension-size-600);\n padding: var(--dimension-space-100);\n gap: var(--dimension-space-100);\n box-sizing: border-box;\n border-bottom: var(--dimension-stroke-width-012) solid var(--_bar-nav-border);\n background-color: var(--_bar-nav-bg);\n color: var(--_bar-nav-fg-primary);\n -webkit-user-select: none;\n user-select: none;\n overflow: hidden;\n transition:\n background-color var(--effect-motion-short-3),\n border-color var(--effect-motion-short-3),\n color var(--effect-motion-short-3);\n isolation: isolate;\n /* Default chrome — app surfaces */\n --_bar-nav-bg: var(--color-background-secondary);\n --_bar-nav-border: var(--color-border-tertiary);\n --_bar-nav-fg-primary: var(--color-foreground-primary);\n --_bar-nav-fg-secondary: var(--color-foreground-secondary);\n --_bar-nav-hover: var(--color-interaction-hover);\n --_bar-nav-pressed: var(--color-interaction-pressed);\n --_bar-nav-focus: var(--color-interaction-focus);\n --_bar-nav-dot: var(--color-foreground-bold-brand);\n --ds-focus-ring-color: var(--_bar-nav-focus);\n}\n\n/* Style slots — same app tokens for now; hook texture/glyph layers later. */\n.bar-nav--dashboard,\n.bar-nav--settings {\n --_bar-nav-bg: var(--color-background-secondary);\n --_bar-nav-border: var(--color-border-tertiary);\n --_bar-nav-fg-primary: var(--color-foreground-primary);\n --_bar-nav-fg-secondary: var(--color-foreground-secondary);\n --_bar-nav-hover: var(--color-interaction-hover);\n --_bar-nav-pressed: var(--color-interaction-pressed);\n --_bar-nav-focus: var(--color-interaction-focus);\n --_bar-nav-dot: var(--color-foreground-bold-brand);\n}\n\n/* Shell-owned chrome (bg + wash) — bar is a transparent frame. */\n:host-context(ds-shell-app:not([gradient-preset='none'])) .bar-nav {\n background-color: transparent;\n}\n\n.bar-nav > :not(.bar-nav__tabs-probe) {\n position: relative;\n z-index: 3;\n}\n\n/* Overflow — keep fitting tabs visible and pin the overflow trigger to the far edge. */\n.bar-nav--tabs-collapsed {\n display: flex;\n gap: var(--dimension-space-100);\n align-items: center;\n}\n\n/* Expanded tabs — consume full header width */\n.bar-nav__left {\n position: relative;\n flex: 1 1 0%;\n min-width: 0;\n width: 0;\n display: flex;\n align-items: center;\n}\n\n.bar-nav__tabs-visible {\n flex: 1;\n min-width: 0;\n width: 100%;\n}\n\n/* Unconstrained width so intrinsic tab row width is measurable while collapsed */\n.bar-nav__tabs-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-nav__tabs-probe > div {\n width: max-content;\n}\n\n.bar-nav__tab-list {\n display: flex;\n align-items: center;\n gap: var(--dimension-space-050);\n position: relative;\n width: max-content;\n}\n\n.bar-nav__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-nav-fg-secondary);\n cursor: pointer;\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-nav__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}\n\n.bar-nav__tab:hover::after {\n background: var(--_bar-nav-hover);\n}\n\n.bar-nav__tab:active::after {\n background: var(--_bar-nav-pressed);\n}\n\n.bar-nav__tab--selected {\n color: var(--_bar-nav-fg-primary);\n}\n\n.bar-nav__tab-label {\n position: relative;\n display: inline-flex;\n align-items: center;\n padding: 0 var(--ds-control-label-inset);\n white-space: nowrap;\n}\n\n.bar-nav__tab-label--dot {\n padding-right: calc(var(--ds-control-label-inset) + var(--ds-control-gap));\n}\n\n.bar-nav__tab-dot {\n position: absolute;\n top: 0;\n right: 0;\n pointer-events: none;\n}\n\n.bar-nav__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-nav__tab-divider-line {\n width: var(--dimension-stroke-width-012);\n align-self: stretch;\n background-color: var(--_bar-nav-border);\n}\n\n/* In-flow placeholder while measuring overflow — avoids layout jump; hidden from view/accessibility. */\n.bar-nav__tabs-pending {\n flex: 1;\n min-width: 0;\n height: var(--ds-control-height);\n visibility: hidden;\n pointer-events: none;\n}\n\n/* Overflow trigger — compact icon button aligned to the right edge. */\n.bar-nav__overflow-trigger {\n margin-left: auto;\n --ds-button-unfilled-fg: var(--_bar-nav-fg-secondary);\n --ds-button-unfilled-fg-active: var(--_bar-nav-fg-primary);\n --ds-interaction-hover: var(--_bar-nav-hover);\n --ds-interaction-pressed: var(--_bar-nav-pressed);\n --ds-focus-ring-color: var(--_bar-nav-focus);\n}\n\n/* Fallback heading when no tabs — matches a single (selected) tab so the area\n name shares the tab label's type token, color, height and horizontal inset.\n Inset = tab button padding (space-075, 6px) + label inset (space-025, 2px).\n Color comes from ds-text color=\"primary\"; beat Text's inline-box display. */\nds-text.bar-nav__heading {\n display: inline-flex;\n align-items: center;\n height: var(--ds-control-height);\n padding-inline: calc(var(--ds-control-padding-inline) + var(--ds-control-label-inset));\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n -webkit-user-select: none;\n user-select: none;\n}\n","import {\n Component,\n Prop,\n Event,\n EventEmitter,\n Element,\n Watch,\n State,\n h,\n Host,\n} from '@stencil/core';\nimport type { NavChromeStyle } from '../../shell/nav-chrome';\nimport type { MenuItemData } from '../Menu/menu-types';\nimport { getSelectableTabs, isTabDivider, type TabItemTab } from '../TabGroup/tab-item-utils';\nimport type { BarNavTab } from './bar-nav-types';\nimport {\n deriveBarNavValueFromUrl,\n parseJsonArrayProp,\n shouldResyncBarNavProps,\n} from './bar-nav-utils';\nimport {\n tabsOverflowContainer,\n tabsToOverflowMenuSections,\n trimTrailingDividers,\n visibleTabCountForWidth,\n} from './bar-nav-tabs-menu-utils';\nimport {\n CHROME_TRANSITION_END,\n CHROME_TRANSITION_START,\n ChromeTransitionGate,\n createRafCoalescer,\n readChromeTransitionSource,\n readChromeTransitionPhase,\n} from '../../shell/chrome-transition';\n\n@Component({\n tag: 'ds-bar-nav',\n styleUrl: 'BarNav.css',\n scoped: true,\n})\nexport class BarNav {\n /** Style slot: `dashboard` or `settings`. Colors match for now. */\n @Prop({ attribute: 'nav-style', reflect: true }) navStyle: NavChromeStyle = 'dashboard';\n\n @Element() el!: HTMLElement;\n\n /**\n * Tab items for the left section.\n * Set via JS property: `el.tabs = [...]`. Replace the array reference to update.\n */\n @Prop() tabs: BarNavTab[] = [];\n\n /** JSON fallback for `tabs` — useful when framework bindings don't propagate arrays. */\n @Prop({ attribute: 'tabs-json' }) tabsJson: string = '';\n\n /** ID of the currently active tab. Overridden when `currentUrl` + `basePath` are set. */\n @Prop({ mutable: true }) value: string = '';\n\n /**\n * Fallback heading shown when no tabs are provided.\n * When tabs are present the heading is hidden.\n */\n @Prop() heading: string | undefined;\n\n /** Section base path (e.g. `/dashboard/safety`). Used with `currentUrl` to derive `value`. */\n @Prop() basePath: string = '';\n\n /** Current route URL. When set with `basePath`, the active tab is derived automatically. */\n @Prop() currentUrl: string = '';\n @Prop() moreTabsLabel: string = 'More tabs';\n\n /** Emitted when the active tab changes. Detail = tab id. */\n @Event() dsTabChange!: EventEmitter<string>;\n\n @State() private resolvedTabs: BarNavTab[] = [];\n @State() private urlDerivedValue: string = '';\n @State() private hideTabsForDetailRoute = false;\n @State() private tabsCollapsed = false;\n @State() private menuOpen = false;\n @State() private menuTriggerActive = false;\n /** When false, defer showing expanded tabs or the collapsed trigger until intrinsic width is measured (avoids a one-frame flash of the full tab row on narrow viewports). */\n @State() private tabLayoutCommitted = false;\n @State() private visibleTabs: BarNavTab[] = [];\n @State() private overflowTabs: BarNavTab[] = [];\n @State() private menuInitialFocusVisible = false;\n @State() private overflowRovingFocused = false;\n @State() private focusedTabId = '';\n\n private static readonly HOST_PROP_SYNC_BUDGET = 8;\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 private headerEl: HTMLElement | null = null;\n private triggerEl: (HTMLElement & { setFocus?: () => Promise<void> }) | null = null;\n private menuEl: HTMLDsMenuElement | null = null;\n private visibleTabListEl: HTMLElement | null = null;\n private probeTabListEl: 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.updateTabsCollapsed();\n });\n private chromeTransitionShell: HTMLElement | null = null;\n /** Matches `basePath` once tabs + URL are reconciled for the active section. */\n @State() private committedSection = '';\n /** Section waiting for URL + tabs to catch up after a cross-area navigation. */\n @State() private pendingSection = '';\n\n private get effectiveValue(): string {\n if (this.currentUrl && this.basePath) {\n return this.urlDerivedValue;\n }\n return this.value;\n }\n\n private get renderedSelectableTabs(): TabItemTab[] {\n const tabs = this.hasOverflowTabs ? this.visibleTabs : this.resolvedTabs;\n return getSelectableTabs(tabs);\n }\n\n private get hasOverflowTabs(): boolean {\n return this.tabLayoutCommitted && this.tabsCollapsed && this.overflowTabs.length > 0;\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 digestTabsConfig(tabs: BarNavTab[]): string {\n return tabs.map(t => (isTabDivider(t) ? '|' : t.id)).join(',');\n }\n\n private resetTabOverflowLayout() {\n this.tabLayoutCommitted = false;\n this.tabsCollapsed = false;\n this.menuOpen = false;\n this.menuTriggerActive = false;\n this.menuInitialFocusVisible = false;\n this.intrinsicWidthRetryCount = 0;\n this.tabLayoutPendingFrames = 0;\n this.visibleTabs = [];\n this.overflowTabs = [];\n }\n\n @Watch('tabs')\n @Watch('tabsJson')\n @Watch('currentUrl')\n @Watch('basePath')\n onHostPropsChange() {\n this.applyHostProps();\n }\n\n @Watch('value')\n @Watch('urlDerivedValue')\n onSelectionChange() {\n this.syncFocusedTabId(this.effectiveValue, this.renderedSelectableTabs);\n this.syncMenuSections();\n this.scheduleOverflowCheck();\n }\n\n @Watch('menuOpen')\n onMenuOpenChange(open: boolean) {\n if (this.menuEl) {\n this.menuEl.open = open;\n }\n }\n\n @Watch('tabsCollapsed')\n onTabsCollapsedChange(collapsed: boolean, prevCollapsed: boolean | undefined) {\n if (!collapsed) {\n this.menuOpen = false;\n this.menuTriggerActive = false;\n this.menuInitialFocusVisible = false;\n this.menuEl = null;\n }\n this.scheduleOverflowCheck();\n if (collapsed) {\n requestAnimationFrame(() => {\n this.scheduleOverflowCheck();\n });\n }\n if (collapsed || prevCollapsed === undefined || prevCollapsed === collapsed) return;\n requestAnimationFrame(() => this.scheduleOverflowCheck());\n queueMicrotask(() => this.focusVisibleSelectedTab());\n }\n\n componentWillLoad() {\n this.applyHostProps();\n this.syncFocusedTabId(this.effectiveValue, getSelectableTabs(this.resolvedTabs));\n }\n\n componentDidLoad() {\n this.syncHostPropsIfNeeded();\n this.scheduleDeferredHostPropSync();\n this.setupOverflowObserver();\n this.bindChromeTransitionListeners();\n this.scheduleOverflowCheck();\n }\n\n componentDidRender() {\n if (this.chromeOverflowPaused()) {\n this.syncMenuAnchor();\n return;\n }\n this.scheduleOverflowCheck();\n this.syncMenuAnchor();\n }\n\n disconnectedCallback() {\n this.resizeObserver?.disconnect();\n this.resizeObserver = null;\n this.overflowCoalescer.cancel();\n this.unbindChromeTransitionListeners();\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 /** Re-resolve props assigned by the host after componentWillLoad (Angular ngAfterViewInit). */\n private syncHostPropsIfNeeded() {\n if (shouldResyncBarNavProps(this.resolvedTabs, this.tabs, this.tabsJson)) {\n this.applyHostProps();\n } else if (this.currentUrl && this.basePath) {\n this.syncValueFromUrl();\n }\n }\n\n /** Poll across animation frames — host props may land without triggering @Watch. */\n private scheduleDeferredHostPropSync() {\n let remaining = BarNav.HOST_PROP_SYNC_BUDGET;\n const tick = () => {\n this.syncHostPropsIfNeeded();\n if (--remaining > 0) {\n requestAnimationFrame(tick);\n }\n };\n queueMicrotask(tick);\n }\n\n private setupOverflowObserver() {\n if (typeof ResizeObserver === 'undefined' || !this.headerEl) return;\n this.resizeObserver?.disconnect();\n this.resizeObserver = new ResizeObserver(() => {\n if (this.chromeOverflowPaused()) return;\n this.scheduleOverflowCheck();\n });\n this.resizeObserver.observe(this.headerEl);\n }\n\n private scheduleOverflowCheck() {\n if (this.chromeOverflowPaused()) return;\n this.overflowCoalescer.schedule();\n }\n\n /** Width available for the tab row or collapsed trigger. */\n private getLeftZoneAvailableWidth(): number {\n if (!this.headerEl) return 0;\n\n const headerStyle = getComputedStyle(this.headerEl);\n const horizontalPadding =\n (parseFloat(headerStyle.paddingLeft) || 0) + (parseFloat(headerStyle.paddingRight) || 0);\n\n return Math.max(0, this.headerEl.clientWidth - horizontalPadding);\n }\n\n private getTabsIntrinsicWidth(): number {\n return this.probeTabListEl?.scrollWidth ?? 0;\n }\n\n private getHeaderGap(): number {\n if (!this.headerEl) return 0;\n const style = getComputedStyle(this.headerEl);\n return parseFloat(style.columnGap || style.gap) || 0;\n }\n\n private getOverflowTriggerReserveWidth(): number {\n if (!this.triggerEl) {\n return 40;\n }\n return this.triggerEl.getBoundingClientRect().width + this.getHeaderGap();\n }\n\n private getProbeTabMetrics():\n | {\n itemWidths: number[];\n itemGap: number;\n listExtraWidth: number;\n }\n | null {\n const tabList = this.probeTabListEl;\n if (!tabList) return null;\n\n const children = Array.from(tabList.children) as HTMLElement[];\n const itemWidths = children.map(child => child.getBoundingClientRect().width);\n if (itemWidths.length === 0 || itemWidths.some(width => width === 0)) return null;\n\n const style = getComputedStyle(tabList);\n const itemGap = parseFloat(style.columnGap || style.gap) || 0;\n const childrenWidth = itemWidths.reduce((sum, width) => sum + width, 0);\n const gapWidth = itemGap * Math.max(0, itemWidths.length - 1);\n const listExtraWidth = Math.max(0, tabList.scrollWidth - childrenWidth - gapWidth);\n\n return { itemWidths, itemGap, listExtraWidth };\n }\n\n private setOverflowTabLayout(visibleTabs: BarNavTab[], overflowTabs: BarNavTab[]) {\n const nextCollapsed = overflowTabs.length > 0;\n const visibleChanged =\n this.digestTabsConfig(visibleTabs) !== this.digestTabsConfig(this.visibleTabs);\n const overflowChanged =\n this.digestTabsConfig(overflowTabs) !== this.digestTabsConfig(this.overflowTabs);\n\n if (visibleChanged) {\n this.visibleTabs = visibleTabs;\n }\n if (overflowChanged) {\n this.overflowTabs = overflowTabs;\n }\n if (nextCollapsed !== this.tabsCollapsed) {\n this.tabsCollapsed = nextCollapsed;\n if (!nextCollapsed) {\n this.menuOpen = false;\n this.menuTriggerActive = false;\n }\n }\n this.syncFocusedTabId(\n this.effectiveValue,\n getSelectableTabs(nextCollapsed ? visibleTabs : this.resolvedTabs),\n );\n }\n\n private scheduleIntrinsicWidthRetry() {\n if (this.intrinsicWidthRetryCount >= BarNav.INTRINSIC_WIDTH_RETRY_MAX) return;\n this.intrinsicWidthRetryCount++;\n requestAnimationFrame(() => this.scheduleOverflowCheck());\n }\n\n private forceTabLayoutCommit(fallbackCollapsed: boolean) {\n this.intrinsicWidthRetryCount = 0;\n this.tabLayoutPendingFrames = 0;\n this.setOverflowTabLayout(\n fallbackCollapsed ? [] : this.resolvedTabs,\n fallbackCollapsed ? this.resolvedTabs : [],\n );\n this.tabLayoutCommitted = true;\n }\n\n private updateTabsCollapsed() {\n if (!this.headerEl || this.resolvedTabs.length === 0 || this.hideTabsForDetailRoute) {\n if (this.tabsCollapsed) {\n this.setOverflowTabLayout([], []);\n }\n this.intrinsicWidthRetryCount = 0;\n this.tabLayoutPendingFrames = 0;\n this.tabLayoutCommitted = true;\n return;\n }\n\n const metrics = this.getProbeTabMetrics();\n const intrinsicWidth = this.getTabsIntrinsicWidth();\n if (!metrics || intrinsicWidth === 0) {\n this.tabLayoutPendingFrames += 1;\n if (this.intrinsicWidthRetryCount >= BarNav.INTRINSIC_WIDTH_RETRY_MAX) {\n this.forceTabLayoutCommit(false);\n } else if (this.tabLayoutPendingFrames >= BarNav.TAB_LAYOUT_COMMIT_MAX_FRAMES) {\n this.forceTabLayoutCommit(false);\n } else {\n this.scheduleIntrinsicWidthRetry();\n }\n return;\n }\n this.intrinsicWidthRetryCount = 0;\n this.tabLayoutPendingFrames = 0;\n\n const shouldCollapse = tabsOverflowContainer(\n intrinsicWidth,\n this.getLeftZoneAvailableWidth(),\n this.tabsCollapsed,\n BarNav.OVERFLOW_HYSTERESIS_PX,\n );\n\n if (!shouldCollapse) {\n this.setOverflowTabLayout(this.resolvedTabs, []);\n this.tabLayoutCommitted = true;\n return;\n }\n\n const visibleCount = visibleTabCountForWidth(\n metrics.itemWidths,\n this.getLeftZoneAvailableWidth(),\n this.getOverflowTriggerReserveWidth(),\n metrics.itemGap,\n metrics.listExtraWidth,\n );\n const visibleTabs = trimTrailingDividers(this.resolvedTabs.slice(0, visibleCount));\n const overflowTabs = this.resolvedTabs.slice(visibleTabs.length);\n this.setOverflowTabLayout(visibleTabs, overflowTabs);\n this.tabLayoutCommitted = true;\n }\n\n private syncMenuAnchor() {\n if (!this.menuEl || !this.triggerEl || !this.hasOverflowTabs) return;\n this.menuEl.anchor = this.triggerEl;\n this.syncMenuSections();\n }\n\n private handleMenuSelect(e: Event) {\n const detail = (e as CustomEvent<MenuItemData>).detail;\n if (detail?.value !== undefined) {\n this.selectTab(String(detail.value));\n }\n this.menuOpen = false;\n this.menuInitialFocusVisible = false;\n }\n\n private handleMenuClose() {\n this.menuOpen = false;\n this.menuInitialFocusVisible = false;\n }\n\n private handleMenuAfterClose() {\n if (!this.menuOpen) this.menuTriggerActive = false;\n }\n\n /** Batch tabs/basePath/currentUrl updates so URL derivation never runs with a mixed section. */\n private incomingTabs(): BarNavTab[] {\n return this.tabsJson\n ? parseJsonArrayProp(this.tabsJson, [])\n : (this.tabs ?? []);\n }\n\n private applyHostProps() {\n const nextBasePath = this.basePath;\n const sectionChanged =\n nextBasePath !== '' &&\n this.committedSection !== '' &&\n nextBasePath !== this.committedSection;\n\n if (sectionChanged) {\n this.urlDerivedValue = '';\n this.committedSection = '';\n this.pendingSection = nextBasePath;\n this.resolvedTabs = [];\n this.resetTabOverflowLayout();\n return;\n }\n\n if (this.pendingSection) {\n if (!nextBasePath || nextBasePath !== this.pendingSection) {\n return;\n }\n if (!this.currentUrl.startsWith(this.pendingSection)) {\n return;\n }\n const tabs = this.incomingTabs();\n if (tabs.length === 0) {\n return;\n }\n this.pendingSection = '';\n }\n\n const tabs = this.incomingTabs();\n const tabsConfigChanged =\n this.digestTabsConfig(tabs) !== this.digestTabsConfig(this.resolvedTabs);\n\n this.resolvedTabs = tabs;\n this.syncValueFromUrl();\n this.committedSection = nextBasePath;\n if (tabsConfigChanged) {\n this.resetTabOverflowLayout();\n }\n this.scheduleOverflowCheck();\n }\n\n private syncMenuSections() {\n if (!this.menuEl) return;\n this.menuEl.sections = tabsToOverflowMenuSections(this.overflowTabs, this.effectiveValue);\n }\n\n private syncValueFromUrl() {\n const tabs = this.incomingTabs();\n\n if (!this.currentUrl || !this.basePath) {\n this.urlDerivedValue = '';\n this.hideTabsForDetailRoute = false;\n return;\n }\n\n if (!this.currentUrl.startsWith(this.basePath)) {\n this.urlDerivedValue = '';\n this.hideTabsForDetailRoute = false;\n return;\n }\n\n const { value, hideTabs } = deriveBarNavValueFromUrl(\n this.currentUrl,\n this.basePath,\n tabs,\n );\n this.urlDerivedValue = value;\n this.hideTabsForDetailRoute = hideTabs;\n }\n\n private selectTab(id: string) {\n this.value = id;\n this.dsTabChange.emit(id);\n }\n\n /** Move focus to the selected tab in the visible tab group (after expand). */\n private focusVisibleSelectedTab() {\n const tab = this.visibleTabListEl?.querySelector(\n `[data-tab-id=\"${this.effectiveValue}\"]`,\n ) as HTMLElement | null;\n tab?.focus({ preventScroll: true });\n }\n\n private focusVisibleTab(id: string) {\n this.focusedTabId = id;\n const tab = this.visibleTabListEl?.querySelector(\n `[data-tab-id=\"${id}\"]`,\n ) as HTMLElement | null;\n tab?.focus({ preventScroll: true });\n }\n\n private focusLastVisibleTab() {\n const last = [...this.renderedSelectableTabs].reverse().find(tab => !tab.isInactive);\n if (last) this.focusVisibleTab(last.id);\n }\n\n private findEnabledVisibleTab(from: number, step: 1 | -1): number | null {\n const tabs = this.renderedSelectableTabs;\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(e: KeyboardEvent) {\n const tabs = this.renderedSelectableTabs;\n if (!tabs.length) return;\n const targetId = (e.target as HTMLElement | null)?.getAttribute('data-tab-id');\n const focusedId = targetId ?? this.focusedTabId;\n\n if (e.key === 'Enter' || e.key === ' ') {\n const focused = tabs.find(tab => tab.id === focusedId);\n if (!focused || focused.isInactive) return;\n e.preventDefault();\n this.selectTab(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 (e.key === 'ArrowRight') {\n nextIndex = this.findEnabledVisibleTab(currentIndex, 1);\n if (nextIndex === null && this.hasOverflowTabs) {\n e.preventDefault();\n this.overflowRovingFocused = true;\n void this.triggerEl?.setFocus?.();\n return;\n }\n } else if (e.key === 'ArrowLeft') {\n nextIndex = this.findEnabledVisibleTab(currentIndex, -1);\n } else if (e.key === 'Home') {\n nextIndex = tabs.findIndex(tab => !tab.isInactive);\n } else if (e.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 e.preventDefault();\n this.focusVisibleTab(tabs[nextIndex].id);\n }\n\n private toggleTabMenu(options?: { focusVisible?: boolean }) {\n if (this.menuOpen) {\n this.menuOpen = false;\n this.menuInitialFocusVisible = false;\n return;\n }\n\n if (this.menuEl && this.triggerEl) {\n this.menuEl.anchor = this.triggerEl;\n this.menuEl.minWidth = '';\n this.syncMenuSections();\n }\n\n this.menuInitialFocusVisible = options?.focusVisible ?? false;\n this.menuTriggerActive = true;\n this.menuOpen = true;\n }\n\n private handleOverflowFocus = () => {\n this.overflowRovingFocused = true;\n };\n\n private handleOverflowBlur = () => {\n this.overflowRovingFocused = false;\n };\n\n private handleTriggerKeyDown(e: KeyboardEvent) {\n if (!this.hasOverflowTabs) return;\n\n if (!this.menuOpen) {\n if (e.key === 'ArrowLeft') {\n e.preventDefault();\n this.overflowRovingFocused = false;\n this.focusLastVisibleTab();\n return;\n }\n\n if (e.key === 'Enter' || e.key === ' ') {\n e.preventDefault();\n this.toggleTabMenu({ focusVisible: true });\n }\n return;\n }\n\n if (e.key === 'Escape') {\n e.preventDefault();\n this.menuOpen = false;\n this.menuInitialFocusVisible = false;\n void this.triggerEl?.setFocus?.();\n }\n }\n\n private renderTabList(tabs: BarNavTab[], probe: boolean) {\n return (\n <div\n role=\"tablist\"\n class=\"bar-nav__tab-list\"\n aria-label={this.heading}\n ref={el => {\n if (probe) {\n const next = (el as HTMLElement) ?? null;\n if (next === this.probeTabListEl) return;\n this.probeTabListEl = next;\n if (next) {\n this.intrinsicWidthRetryCount = 0;\n this.tabLayoutPendingFrames = 0;\n this.scheduleOverflowCheck();\n }\n } else {\n this.visibleTabListEl = (el as HTMLElement) ?? null;\n }\n }}\n onKeyDown={probe ? undefined : (e: KeyboardEvent) => this.handleTabKeyDown(e)}\n onFocusin={probe ? undefined : () => {\n this.overflowRovingFocused = false;\n }}\n >\n {tabs.map((tab, index) => {\n if (isTabDivider(tab)) {\n return (\n <div class=\"bar-nav__tab-divider\" key={`divider-${index}`} aria-hidden=\"true\">\n <div class=\"bar-nav__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=\"tab\"\n data-tab-id={tab.id}\n class={{\n 'bar-nav__tab': true,\n 'bar-nav__tab--selected': isSelected,\n 'ds-control--md': true,\n 'ds-focus-ring-inset': true,\n 'ds-control-inactive': !!tab.isInactive,\n }}\n aria-selected={isSelected ? 'true' : 'false'}\n aria-disabled={tab.isInactive ? 'true' : undefined}\n aria-controls={tab.panelId ?? undefined}\n disabled={tab.isInactive}\n tabIndex={\n !probe && !this.overflowRovingFocused && tab.id === this.focusedTabId\n ? 0\n : -1\n }\n onClick={() => !probe && !tab.isInactive && this.selectTab(tab.id)}\n onFocus={() => {\n if (!probe) this.focusedTabId = tab.id;\n }}\n >\n <span\n class={{\n 'bar-nav__tab-label': true,\n 'bar-nav__tab-label--dot': !!tab.dot,\n }}\n >\n <ds-text as=\"span\" variant=\"text-body-medium\" emphasis={isSelected} color=\"inherit\">\n {tab.label}\n </ds-text>\n {tab.dot && (\n <ds-badge\n class=\"bar-nav__tab-dot\"\n variant=\"dot\"\n hasRing={false}\n label=\"\"\n aria-hidden=\"true\"\n />\n )}\n </span>\n </button>\n );\n })}\n </div>\n );\n }\n\n render() {\n // Section gating only applies when `basePath` is set (SPA section sync).\n // Tabs without a base path must still render — otherwise a single-tab bar\n // (or any non-routed tabs) silently falls through to an empty header.\n const sectionReady =\n this.basePath === '' || this.committedSection === this.basePath;\n const hasTabs =\n sectionReady && this.resolvedTabs.length > 0 && !this.hideTabsForDetailRoute;\n const tabGroupKey = this.basePath || 'no-section';\n const renderedTabs = this.hasOverflowTabs ? this.visibleTabs : this.resolvedTabs;\n\n return (\n <Host>\n <header\n class={{\n 'bar-nav': true,\n 'ds-control--md': true,\n 'bar-nav--dashboard': this.navStyle === 'dashboard',\n 'bar-nav--settings': this.navStyle === 'settings',\n 'bar-nav--tabs-collapsed':\n hasTabs && this.hasOverflowTabs,\n }}\n ref={el => {\n this.headerEl = el as HTMLElement;\n if (el && !this.resizeObserver) {\n this.setupOverflowObserver();\n }\n }}\n >\n {hasTabs && (\n <div class=\"bar-nav__tabs-probe\" aria-hidden=\"true\" inert>\n <div key={`probe-${tabGroupKey}`}>\n {this.renderTabList(this.resolvedTabs, true)}\n </div>\n </div>\n )}\n\n {hasTabs && this.tabLayoutCommitted && renderedTabs.length > 0 && (\n <div class=\"bar-nav__left\">\n <div key={`visible-${tabGroupKey}`} class=\"bar-nav__tabs-visible\">\n {this.renderTabList(renderedTabs, false)}\n </div>\n </div>\n )}\n\n {hasTabs && !this.tabLayoutCommitted && (\n <div class=\"bar-nav__tabs-pending\" aria-hidden=\"true\" />\n )}\n\n {!hasTabs && this.heading && (\n <ds-text\n class=\"bar-nav__heading\"\n as=\"span\"\n variant=\"text-body-medium\"\n emphasis\n color=\"primary\"\n wrap=\"nowrap\"\n >\n {this.heading}\n </ds-text>\n )}\n\n {hasTabs && this.hasOverflowTabs && (\n <ds-button-unfilled variant=\"icon\"\n class={{\n 'bar-nav__overflow-trigger': true,\n }}\n icon=\"Ellipses\"\n activeFill={false}\n hasBorder={false}\n focusTabIndex={this.overflowRovingFocused ? 0 : -1}\n ref={(el?: HTMLDsButtonUnfilledElement) => {\n this.triggerEl = (el as (HTMLElement & { setFocus?: () => Promise<void> })) ?? null;\n }}\n haspopup=\"menu\"\n expanded={this.menuTriggerActive}\n aria-label={this.moreTabsLabel}\n onDsClick={() => this.toggleTabMenu({ focusVisible: false })}\n onFocusin={this.handleOverflowFocus}\n onFocusout={this.handleOverflowBlur}\n onKeyDown={(e: KeyboardEvent) => this.handleTriggerKeyDown(e)}\n />\n )}\n\n </header>\n\n {hasTabs && this.hasOverflowTabs && (\n <ds-menu\n ref={el => {\n this.menuEl = (el as HTMLDsMenuElement) ?? null;\n }}\n open={this.menuOpen}\n sections={tabsToOverflowMenuSections(this.overflowTabs, this.effectiveValue)}\n side=\"bottom\"\n align=\"end\"\n sideOffset=\"calc(var(--dimension-space-100) + var(--dimension-space-050))\"\n initialFocusVisible={this.menuInitialFocusVisible}\n onDsSelect={(e: Event) => this.handleMenuSelect(e)}\n onDsClose={() => this.handleMenuClose()}\n onDsAfterClose={() => this.handleMenuAfterClose()}\n />\n )}\n </Host>\n );\n }\n}\n"],"mappings":"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","ignoreList":[]}
|
|
1
|
+
{"version":3,"names":["tabsToMenuSections","tabs","selectedId","sections","batch","item","isTabDivider","length","push","items","label","value","id","dot","isSelected","isInactive","tabsToOverflowMenuSections","trimLeadingDividers","tabsOverflowContainer","tabListScrollWidth","containerClientWidth","collapsed","hysteresis","diff","visibleTabCountForWidth","itemWidths","availableWidth","overflowTriggerWidth","itemGap","listExtraWidth","fullWidth","widthForItemCount","availableForTabs","Math","max","count","i","width","trimTrailingDividers","end","slice","start","itemsWidth","reduce","sum","barNavCss","BarNav","__stencil_proxyCustomElement","HTMLElement","constructor","registerHost","this","navStyle","tabsJson","basePath","currentUrl","moreTabsLabel","resolvedTabs","urlDerivedValue","hideTabsForDetailRoute","tabsCollapsed","menuOpen","menuTriggerActive","tabLayoutCommitted","visibleTabs","overflowTabs","menuInitialFocusVisible","overflowRovingFocused","focusedTabId","headerEl","triggerEl","menuEl","visibleTabListEl","probeTabListEl","resizeObserver","intrinsicWidthRetryCount","tabLayoutPendingFrames","panelNavTransition","ChromeTransitionGate","panelToolsTransition","overflowCoalescer","createRafCoalescer","updateTabsCollapsed","chromeTransitionShell","committedSection","pendingSection","onChromeTransitionStart","event","source","readChromeTransitionSource","enter","phase","readChromeTransitionPhase","onChromeTransitionEnd","exit","isActive","scheduleOverflowCheck","handleOverflowFocus","handleOverflowBlur","effectiveValue","renderedSelectableTabs","hasOverflowTabs","getSelectableTabs","syncFocusedTabId","preferred","some","tab","first","find","digestTabsConfig","map","t","join","resetTabOverflowLayout","onHostPropsChange","applyHostProps","onSelectionChange","syncMenuSections","onMenuOpenChange","open","onTabsCollapsedChange","prevCollapsed","requestAnimationFrame","undefined","queueMicrotask","focusVisibleSelectedTab","componentWillLoad","componentDidLoad","syncHostPropsIfNeeded","scheduleDeferredHostPropSync","setupOverflowObserver","bindChromeTransitionListeners","componentDidRender","chromeOverflowPaused","syncMenuAnchor","disconnectedCallback","disconnect","cancel","unbindChromeTransitionListeners","shell","el","closest","addEventListener","CHROME_TRANSITION_START","CHROME_TRANSITION_END","removeEventListener","shouldResyncBarNavProps","syncValueFromUrl","remaining","HOST_PROP_SYNC_BUDGET","tick","ResizeObserver","observe","schedule","getLeftZoneAvailableWidth","headerStyle","getComputedStyle","horizontalPadding","parseFloat","paddingLeft","paddingRight","clientWidth","getTabsIntrinsicWidth","scrollWidth","getHeaderGap","style","columnGap","gap","getOverflowTriggerReserveWidth","getBoundingClientRect","getProbeTabMetrics","tabList","children","Array","from","child","childrenWidth","gapWidth","setOverflowTabLayout","nextCollapsed","visibleChanged","overflowChanged","scheduleIntrinsicWidthRetry","INTRINSIC_WIDTH_RETRY_MAX","forceTabLayoutCommit","fallbackCollapsed","metrics","intrinsicWidth","TAB_LAYOUT_COMMIT_MAX_FRAMES","shouldCollapse","OVERFLOW_HYSTERESIS_PX","visibleCount","anchor","handleMenuSelect","e","detail","selectTab","String","handleMenuClose","handleMenuAfterClose","incomingTabs","parseJsonArrayProp","nextBasePath","sectionChanged","startsWith","tabsConfigChanged","hideTabs","deriveBarNavValueFromUrl","dsTabChange","emit","querySelector","focus","preventScroll","focusVisibleTab","focusLastVisibleTab","last","reverse","findEnabledVisibleTab","step","index","handleTabKeyDown","targetId","target","getAttribute","focusedId","key","focused","preventDefault","currentIndex","findIndex","nextIndex","setFocus","reversedIndex","toggleTabMenu","options","minWidth","focusVisible","handleTriggerKeyDown","renderTabList","probe","h","role","class","heading","ref","next","onKeyDown","onFocusin","type","panelId","disabled","tabIndex","onClick","onFocus","as","variant","emphasis","color","hasRing","render","sectionReady","hasTabs","tabGroupKey","renderedTabs","Host","inert","wrap","icon","activeFill","hasBorder","focusTabIndex","haspopup","expanded","onDsClick","onFocusout","side","align","sideOffset","initialFocusVisible","onDsSelect","onDsClose","onDsAfterClose"],"sources":["src/wc/components/BarNav/bar-nav-tabs-menu-utils.ts","src/wc/components/BarNav/BarNav.css?tag=ds-bar-nav&encapsulation=scoped","src/wc/components/BarNav/BarNav.tsx"],"sourcesContent":["import type { MenuItemData, MenuSection } from '../Menu/menu-types';\nimport {\n getSelectableTabs,\n isTabDivider,\n type TabItem,\n type TabItemTab,\n} from '../TabGroup/tab-item-utils';\n\n/** Map BarNav tabs to menu sections, preserving `{ type: 'divider' }` as section breaks. */\nexport function tabsToMenuSections(tabs: TabItem[], selectedId: string): MenuSection[] {\n const sections: MenuSection[] = [];\n let batch: MenuItemData[] = [];\n\n for (const item of tabs) {\n if (isTabDivider(item)) {\n if (batch.length > 0) {\n sections.push({ items: batch });\n batch = [];\n }\n continue;\n }\n\n batch.push({\n label: item.label,\n value: item.id,\n dot: item.dot,\n isSelected: item.id === selectedId,\n isInactive: item.isInactive,\n });\n }\n\n if (batch.length > 0) {\n sections.push({ items: batch });\n }\n\n return sections;\n}\n\nexport function tabsToOverflowMenuSections(tabs: TabItem[], selectedId: string): MenuSection[] {\n return tabsToMenuSections(trimLeadingDividers(tabs), selectedId);\n}\n\nexport function getActiveTab(tabs: TabItem[], selectedId: string): TabItemTab | undefined {\n const selectable = getSelectableTabs(tabs);\n return selectable.find(tab => tab.id === selectedId) ?? selectable[0];\n}\n\nexport function getActiveTabLabel(tabs: TabItem[], selectedId: string): string {\n return getActiveTab(tabs, selectedId)?.label ?? 'Tabs';\n}\n\n/** True when tablist content exceeds the available width (with optional hysteresis). */\nexport function tabsOverflowContainer(\n tabListScrollWidth: number,\n containerClientWidth: number,\n collapsed: boolean,\n hysteresis = 2,\n): boolean {\n const diff = tabListScrollWidth - containerClientWidth;\n if (collapsed) {\n return diff > -hysteresis;\n }\n return diff > hysteresis;\n}\n\nexport function visibleTabCountForWidth(\n itemWidths: number[],\n availableWidth: number,\n overflowTriggerWidth: number,\n itemGap: number,\n listExtraWidth: number,\n): number {\n if (itemWidths.length === 0 || availableWidth <= 0) return 0;\n\n const fullWidth = widthForItemCount(itemWidths, itemWidths.length, itemGap, listExtraWidth);\n if (fullWidth <= availableWidth) return itemWidths.length;\n\n const availableForTabs = Math.max(0, availableWidth - overflowTriggerWidth);\n let count = 0;\n\n for (let i = 1; i <= itemWidths.length; i++) {\n const width = widthForItemCount(itemWidths, i, itemGap, listExtraWidth);\n if (width > availableForTabs) break;\n count = i;\n }\n\n return count;\n}\n\nexport function trimTrailingDividers(tabs: TabItem[]): TabItem[] {\n let end = tabs.length;\n while (end > 0 && isTabDivider(tabs[end - 1])) {\n end -= 1;\n }\n return tabs.slice(0, end);\n}\n\nfunction trimLeadingDividers(tabs: TabItem[]): TabItem[] {\n let start = 0;\n while (start < tabs.length && isTabDivider(tabs[start])) {\n start += 1;\n }\n return tabs.slice(start);\n}\n\nfunction widthForItemCount(\n itemWidths: number[],\n count: number,\n itemGap: number,\n listExtraWidth: number,\n): number {\n if (count <= 0) return 0;\n const itemsWidth = itemWidths.slice(0, count).reduce((sum, width) => sum + width, 0);\n return listExtraWidth + itemsWidth + itemGap * Math.max(0, count - 1);\n}\n","@import '../../utils/control-density.css';\n@import '../../utils/focus-ring.css';\n@import '../../utils/control-inactive.css';\n\n:host {\n display: block;\n}\n\n.bar-nav {\n display: flex;\n align-items: center;\n position: relative;\n height: var(--dimension-size-600);\n padding: var(--dimension-space-100);\n gap: var(--dimension-space-100);\n box-sizing: border-box;\n border-bottom: var(--dimension-stroke-width-012) solid var(--_bar-nav-border);\n background-color: var(--_bar-nav-bg);\n color: var(--_bar-nav-fg-primary);\n -webkit-user-select: none;\n user-select: none;\n overflow: hidden;\n transition:\n background-color var(--effect-motion-short-3),\n border-color var(--effect-motion-short-3),\n color var(--effect-motion-short-3);\n isolation: isolate;\n /* Default chrome — app surfaces */\n --_bar-nav-bg: var(--color-background-secondary);\n --_bar-nav-border: var(--color-border-tertiary);\n --_bar-nav-fg-primary: var(--color-foreground-primary);\n --_bar-nav-fg-secondary: var(--color-foreground-secondary);\n --_bar-nav-hover: var(--color-interaction-hover);\n --_bar-nav-pressed: var(--color-interaction-pressed);\n --_bar-nav-focus: var(--color-interaction-focus);\n --_bar-nav-dot: var(--color-foreground-bold-brand);\n --ds-focus-ring-color: var(--_bar-nav-focus);\n}\n\n/* Style slots — same app tokens for now; hook texture/glyph layers later. */\n.bar-nav--dashboard,\n.bar-nav--settings {\n --_bar-nav-bg: var(--color-background-secondary);\n --_bar-nav-border: var(--color-border-tertiary);\n --_bar-nav-fg-primary: var(--color-foreground-primary);\n --_bar-nav-fg-secondary: var(--color-foreground-secondary);\n --_bar-nav-hover: var(--color-interaction-hover);\n --_bar-nav-pressed: var(--color-interaction-pressed);\n --_bar-nav-focus: var(--color-interaction-focus);\n --_bar-nav-dot: var(--color-foreground-bold-brand);\n}\n\n/* Shell-owned chrome (bg + wash) — bar is a transparent frame. */\n:host-context(ds-shell-app:not([gradient-preset='none'])) .bar-nav {\n background-color: transparent;\n}\n\n.bar-nav > :not(.bar-nav__tabs-probe) {\n position: relative;\n z-index: 3;\n}\n\n/* Overflow — keep fitting tabs visible and pin the overflow trigger to the far edge. */\n.bar-nav--tabs-collapsed {\n display: flex;\n gap: var(--dimension-space-100);\n align-items: center;\n}\n\n/* Expanded tabs — consume full header width */\n.bar-nav__left {\n position: relative;\n flex: 1 1 0%;\n min-width: 0;\n width: 0;\n display: flex;\n align-items: center;\n}\n\n.bar-nav__tabs-visible {\n flex: 1;\n min-width: 0;\n width: 100%;\n}\n\n/* Unconstrained width so intrinsic tab row width is measurable while collapsed */\n.bar-nav__tabs-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-nav__tabs-probe > div {\n width: max-content;\n}\n\n.bar-nav__tab-list {\n display: flex;\n align-items: center;\n gap: var(--dimension-space-050);\n position: relative;\n width: max-content;\n}\n\n.bar-nav__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-nav-fg-secondary);\n cursor: pointer;\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-nav__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}\n\n.bar-nav__tab:hover::after {\n background: var(--_bar-nav-hover);\n}\n\n.bar-nav__tab:active::after {\n background: var(--_bar-nav-pressed);\n}\n\n.bar-nav__tab--selected {\n color: var(--_bar-nav-fg-primary);\n}\n\n.bar-nav__tab-label {\n position: relative;\n display: inline-flex;\n align-items: center;\n padding: 0 var(--ds-control-label-inset);\n white-space: nowrap;\n}\n\n.bar-nav__tab-label--dot {\n padding-right: calc(var(--ds-control-label-inset) + var(--ds-control-gap));\n}\n\n.bar-nav__tab-dot {\n position: absolute;\n top: 0;\n right: 0;\n pointer-events: none;\n}\n\n.bar-nav__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-nav__tab-divider-line {\n width: var(--dimension-stroke-width-012);\n align-self: stretch;\n background-color: var(--_bar-nav-border);\n}\n\n/* In-flow placeholder while measuring overflow — avoids layout jump; hidden from view/accessibility. */\n.bar-nav__tabs-pending {\n flex: 1;\n min-width: 0;\n height: var(--ds-control-height);\n visibility: hidden;\n pointer-events: none;\n}\n\n/* Overflow trigger — compact icon button aligned to the right edge. */\n.bar-nav__overflow-trigger {\n margin-left: auto;\n --ds-button-unfilled-fg: var(--_bar-nav-fg-secondary);\n --ds-button-unfilled-fg-active: var(--_bar-nav-fg-primary);\n --ds-interaction-hover: var(--_bar-nav-hover);\n --ds-interaction-pressed: var(--_bar-nav-pressed);\n --ds-focus-ring-color: var(--_bar-nav-focus);\n}\n\n/* Fallback heading when no tabs — matches a single (selected) tab so the area\n name shares the tab label's type token, color, height and horizontal inset.\n Inset = tab button padding (space-075, 6px) + label inset (space-025, 2px).\n Color comes from ds-text color=\"primary\"; beat Text's inline-box display. */\nds-text.bar-nav__heading {\n display: inline-flex;\n align-items: center;\n height: var(--ds-control-height);\n padding-inline: calc(var(--ds-control-padding-inline) + var(--ds-control-label-inset));\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n -webkit-user-select: none;\n user-select: none;\n}\n","import {\n Component,\n Prop,\n Event,\n EventEmitter,\n Element,\n Watch,\n State,\n h,\n Host,\n} from '@stencil/core';\nimport type { NavChromeStyle } from '../../shell/nav-chrome';\nimport type { MenuItemData } from '../Menu/menu-types';\nimport { getSelectableTabs, isTabDivider, type TabItemTab } from '../TabGroup/tab-item-utils';\nimport type { BarNavTab } from './bar-nav-types';\nimport {\n deriveBarNavValueFromUrl,\n parseJsonArrayProp,\n shouldResyncBarNavProps,\n} from './bar-nav-utils';\nimport {\n tabsOverflowContainer,\n tabsToOverflowMenuSections,\n trimTrailingDividers,\n visibleTabCountForWidth,\n} from './bar-nav-tabs-menu-utils';\nimport {\n CHROME_TRANSITION_END,\n CHROME_TRANSITION_START,\n ChromeTransitionGate,\n createRafCoalescer,\n readChromeTransitionSource,\n readChromeTransitionPhase,\n} from '../../shell/chrome-transition';\n\n@Component({\n tag: 'ds-bar-nav',\n styleUrl: 'BarNav.css',\n scoped: true,\n})\nexport class BarNav {\n /** Style slot: `dashboard` or `settings`. Colors match for now. */\n @Prop({ attribute: 'nav-style', reflect: true }) navStyle: NavChromeStyle = 'dashboard';\n\n @Element() el!: HTMLElement;\n\n /**\n * Tab items for the left section.\n * Set via JS property: `el.tabs = [...]`. Replace the array reference to update.\n */\n @Prop() tabs: BarNavTab[] = [];\n\n /** JSON fallback for `tabs` — useful when framework bindings don't propagate arrays. */\n @Prop({ attribute: 'tabs-json' }) tabsJson: string = '';\n\n /** ID of the currently active tab. Overridden when `currentUrl` + `basePath` are set. */\n @Prop({ mutable: true }) value: string = '';\n\n /**\n * Fallback heading shown when no tabs are provided.\n * When tabs are present the heading is hidden.\n */\n @Prop() heading: string | undefined;\n\n /** Section base path (e.g. `/dashboard/safety`). Used with `currentUrl` to derive `value`. */\n @Prop() basePath: string = '';\n\n /** Current route URL. When set with `basePath`, the active tab is derived automatically. */\n @Prop() currentUrl: string = '';\n @Prop() moreTabsLabel: string = 'More tabs';\n\n /** Emitted when the active tab changes. Detail = tab id. */\n @Event() dsTabChange!: EventEmitter<string>;\n\n @State() private resolvedTabs: BarNavTab[] = [];\n @State() private urlDerivedValue: string = '';\n @State() private hideTabsForDetailRoute = false;\n @State() private tabsCollapsed = false;\n @State() private menuOpen = false;\n @State() private menuTriggerActive = false;\n /** When false, defer showing expanded tabs or the collapsed trigger until intrinsic width is measured (avoids a one-frame flash of the full tab row on narrow viewports). */\n @State() private tabLayoutCommitted = false;\n @State() private visibleTabs: BarNavTab[] = [];\n @State() private overflowTabs: BarNavTab[] = [];\n @State() private menuInitialFocusVisible = false;\n @State() private overflowRovingFocused = false;\n @State() private focusedTabId = '';\n\n private static readonly HOST_PROP_SYNC_BUDGET = 8;\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 private headerEl: HTMLElement | null = null;\n private triggerEl: (HTMLElement & { setFocus?: () => Promise<void> }) | null = null;\n private menuEl: HTMLDsMenuElement | null = null;\n private visibleTabListEl: HTMLElement | null = null;\n private probeTabListEl: 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.updateTabsCollapsed();\n });\n private chromeTransitionShell: HTMLElement | null = null;\n /** Matches `basePath` once tabs + URL are reconciled for the active section. */\n @State() private committedSection = '';\n /** Section waiting for URL + tabs to catch up after a cross-area navigation. */\n @State() private pendingSection = '';\n\n private get effectiveValue(): string {\n if (this.currentUrl && this.basePath) {\n return this.urlDerivedValue;\n }\n return this.value;\n }\n\n private get renderedSelectableTabs(): TabItemTab[] {\n const tabs = this.hasOverflowTabs ? this.visibleTabs : this.resolvedTabs;\n return getSelectableTabs(tabs);\n }\n\n private get hasOverflowTabs(): boolean {\n return this.tabLayoutCommitted && this.tabsCollapsed && this.overflowTabs.length > 0;\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 digestTabsConfig(tabs: BarNavTab[]): string {\n return tabs.map(t => (isTabDivider(t) ? '|' : t.id)).join(',');\n }\n\n private resetTabOverflowLayout() {\n this.tabLayoutCommitted = false;\n this.tabsCollapsed = false;\n this.menuOpen = false;\n this.menuTriggerActive = false;\n this.menuInitialFocusVisible = false;\n this.intrinsicWidthRetryCount = 0;\n this.tabLayoutPendingFrames = 0;\n this.visibleTabs = [];\n this.overflowTabs = [];\n }\n\n @Watch('tabs')\n @Watch('tabsJson')\n @Watch('currentUrl')\n @Watch('basePath')\n onHostPropsChange() {\n this.applyHostProps();\n }\n\n @Watch('value')\n @Watch('urlDerivedValue')\n onSelectionChange() {\n this.syncFocusedTabId(this.effectiveValue, this.renderedSelectableTabs);\n this.syncMenuSections();\n this.scheduleOverflowCheck();\n }\n\n @Watch('menuOpen')\n onMenuOpenChange(open: boolean) {\n if (this.menuEl) {\n this.menuEl.open = open;\n }\n }\n\n @Watch('tabsCollapsed')\n onTabsCollapsedChange(collapsed: boolean, prevCollapsed: boolean | undefined) {\n if (!collapsed) {\n this.menuOpen = false;\n this.menuTriggerActive = false;\n this.menuInitialFocusVisible = false;\n this.menuEl = null;\n }\n this.scheduleOverflowCheck();\n if (collapsed) {\n requestAnimationFrame(() => {\n this.scheduleOverflowCheck();\n });\n }\n if (collapsed || prevCollapsed === undefined || prevCollapsed === collapsed) return;\n requestAnimationFrame(() => this.scheduleOverflowCheck());\n queueMicrotask(() => this.focusVisibleSelectedTab());\n }\n\n componentWillLoad() {\n this.applyHostProps();\n this.syncFocusedTabId(this.effectiveValue, getSelectableTabs(this.resolvedTabs));\n }\n\n componentDidLoad() {\n this.syncHostPropsIfNeeded();\n this.scheduleDeferredHostPropSync();\n this.setupOverflowObserver();\n this.bindChromeTransitionListeners();\n this.scheduleOverflowCheck();\n }\n\n componentDidRender() {\n if (this.chromeOverflowPaused()) {\n this.syncMenuAnchor();\n return;\n }\n this.scheduleOverflowCheck();\n this.syncMenuAnchor();\n }\n\n disconnectedCallback() {\n this.resizeObserver?.disconnect();\n this.resizeObserver = null;\n this.overflowCoalescer.cancel();\n this.unbindChromeTransitionListeners();\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 /** Re-resolve props assigned by the host after componentWillLoad (Angular ngAfterViewInit). */\n private syncHostPropsIfNeeded() {\n if (shouldResyncBarNavProps(this.resolvedTabs, this.tabs, this.tabsJson)) {\n this.applyHostProps();\n } else if (this.currentUrl && this.basePath) {\n this.syncValueFromUrl();\n }\n }\n\n /** Poll across animation frames — host props may land without triggering @Watch. */\n private scheduleDeferredHostPropSync() {\n let remaining = BarNav.HOST_PROP_SYNC_BUDGET;\n const tick = () => {\n this.syncHostPropsIfNeeded();\n if (--remaining > 0) {\n requestAnimationFrame(tick);\n }\n };\n queueMicrotask(tick);\n }\n\n private setupOverflowObserver() {\n if (typeof ResizeObserver === 'undefined' || !this.headerEl) return;\n this.resizeObserver?.disconnect();\n this.resizeObserver = new ResizeObserver(() => {\n if (this.chromeOverflowPaused()) return;\n this.scheduleOverflowCheck();\n });\n this.resizeObserver.observe(this.headerEl);\n }\n\n private scheduleOverflowCheck() {\n if (this.chromeOverflowPaused()) return;\n this.overflowCoalescer.schedule();\n }\n\n /** Width available for the tab row or collapsed trigger. */\n private getLeftZoneAvailableWidth(): number {\n if (!this.headerEl) return 0;\n\n const headerStyle = getComputedStyle(this.headerEl);\n const horizontalPadding =\n (parseFloat(headerStyle.paddingLeft) || 0) + (parseFloat(headerStyle.paddingRight) || 0);\n\n return Math.max(0, this.headerEl.clientWidth - horizontalPadding);\n }\n\n private getTabsIntrinsicWidth(): number {\n return this.probeTabListEl?.scrollWidth ?? 0;\n }\n\n private getHeaderGap(): number {\n if (!this.headerEl) return 0;\n const style = getComputedStyle(this.headerEl);\n return parseFloat(style.columnGap || style.gap) || 0;\n }\n\n private getOverflowTriggerReserveWidth(): number {\n if (!this.triggerEl) {\n return 40;\n }\n return this.triggerEl.getBoundingClientRect().width + this.getHeaderGap();\n }\n\n private getProbeTabMetrics():\n | {\n itemWidths: number[];\n itemGap: number;\n listExtraWidth: number;\n }\n | null {\n const tabList = this.probeTabListEl;\n if (!tabList) return null;\n\n const children = Array.from(tabList.children) as HTMLElement[];\n const itemWidths = children.map(child => child.getBoundingClientRect().width);\n if (itemWidths.length === 0 || itemWidths.some(width => width === 0)) return null;\n\n const style = getComputedStyle(tabList);\n const itemGap = parseFloat(style.columnGap || style.gap) || 0;\n const childrenWidth = itemWidths.reduce((sum, width) => sum + width, 0);\n const gapWidth = itemGap * Math.max(0, itemWidths.length - 1);\n const listExtraWidth = Math.max(0, tabList.scrollWidth - childrenWidth - gapWidth);\n\n return { itemWidths, itemGap, listExtraWidth };\n }\n\n private setOverflowTabLayout(visibleTabs: BarNavTab[], overflowTabs: BarNavTab[]) {\n const nextCollapsed = overflowTabs.length > 0;\n const visibleChanged =\n this.digestTabsConfig(visibleTabs) !== this.digestTabsConfig(this.visibleTabs);\n const overflowChanged =\n this.digestTabsConfig(overflowTabs) !== this.digestTabsConfig(this.overflowTabs);\n\n if (visibleChanged) {\n this.visibleTabs = visibleTabs;\n }\n if (overflowChanged) {\n this.overflowTabs = overflowTabs;\n }\n if (nextCollapsed !== this.tabsCollapsed) {\n this.tabsCollapsed = nextCollapsed;\n if (!nextCollapsed) {\n this.menuOpen = false;\n this.menuTriggerActive = false;\n }\n }\n this.syncFocusedTabId(\n this.effectiveValue,\n getSelectableTabs(nextCollapsed ? visibleTabs : this.resolvedTabs),\n );\n }\n\n private scheduleIntrinsicWidthRetry() {\n if (this.intrinsicWidthRetryCount >= BarNav.INTRINSIC_WIDTH_RETRY_MAX) return;\n this.intrinsicWidthRetryCount++;\n requestAnimationFrame(() => this.scheduleOverflowCheck());\n }\n\n private forceTabLayoutCommit(fallbackCollapsed: boolean) {\n this.intrinsicWidthRetryCount = 0;\n this.tabLayoutPendingFrames = 0;\n this.setOverflowTabLayout(\n fallbackCollapsed ? [] : this.resolvedTabs,\n fallbackCollapsed ? this.resolvedTabs : [],\n );\n this.tabLayoutCommitted = true;\n }\n\n private updateTabsCollapsed() {\n if (!this.headerEl || this.resolvedTabs.length === 0 || this.hideTabsForDetailRoute) {\n if (this.tabsCollapsed) {\n this.setOverflowTabLayout([], []);\n }\n this.intrinsicWidthRetryCount = 0;\n this.tabLayoutPendingFrames = 0;\n this.tabLayoutCommitted = true;\n return;\n }\n\n const metrics = this.getProbeTabMetrics();\n const intrinsicWidth = this.getTabsIntrinsicWidth();\n if (!metrics || intrinsicWidth === 0) {\n this.tabLayoutPendingFrames += 1;\n if (this.intrinsicWidthRetryCount >= BarNav.INTRINSIC_WIDTH_RETRY_MAX) {\n this.forceTabLayoutCommit(false);\n } else if (this.tabLayoutPendingFrames >= BarNav.TAB_LAYOUT_COMMIT_MAX_FRAMES) {\n this.forceTabLayoutCommit(false);\n } else {\n this.scheduleIntrinsicWidthRetry();\n }\n return;\n }\n this.intrinsicWidthRetryCount = 0;\n this.tabLayoutPendingFrames = 0;\n\n const shouldCollapse = tabsOverflowContainer(\n intrinsicWidth,\n this.getLeftZoneAvailableWidth(),\n this.tabsCollapsed,\n BarNav.OVERFLOW_HYSTERESIS_PX,\n );\n\n if (!shouldCollapse) {\n this.setOverflowTabLayout(this.resolvedTabs, []);\n this.tabLayoutCommitted = true;\n return;\n }\n\n const visibleCount = visibleTabCountForWidth(\n metrics.itemWidths,\n this.getLeftZoneAvailableWidth(),\n this.getOverflowTriggerReserveWidth(),\n metrics.itemGap,\n metrics.listExtraWidth,\n );\n const visibleTabs = trimTrailingDividers(this.resolvedTabs.slice(0, visibleCount));\n const overflowTabs = this.resolvedTabs.slice(visibleTabs.length);\n this.setOverflowTabLayout(visibleTabs, overflowTabs);\n this.tabLayoutCommitted = true;\n }\n\n private syncMenuAnchor() {\n if (!this.menuEl || !this.triggerEl || !this.hasOverflowTabs) return;\n this.menuEl.anchor = this.triggerEl;\n this.syncMenuSections();\n }\n\n private handleMenuSelect(e: Event) {\n const detail = (e as CustomEvent<MenuItemData>).detail;\n if (detail?.value !== undefined) {\n this.selectTab(String(detail.value));\n }\n this.menuOpen = false;\n this.menuInitialFocusVisible = false;\n }\n\n private handleMenuClose() {\n this.menuOpen = false;\n this.menuInitialFocusVisible = false;\n }\n\n private handleMenuAfterClose() {\n if (!this.menuOpen) this.menuTriggerActive = false;\n }\n\n /** Batch tabs/basePath/currentUrl updates so URL derivation never runs with a mixed section. */\n private incomingTabs(): BarNavTab[] {\n return this.tabsJson\n ? parseJsonArrayProp(this.tabsJson, [])\n : (this.tabs ?? []);\n }\n\n private applyHostProps() {\n const nextBasePath = this.basePath;\n const sectionChanged =\n nextBasePath !== '' &&\n this.committedSection !== '' &&\n nextBasePath !== this.committedSection;\n\n if (sectionChanged) {\n this.urlDerivedValue = '';\n this.committedSection = '';\n this.pendingSection = nextBasePath;\n this.resolvedTabs = [];\n this.resetTabOverflowLayout();\n return;\n }\n\n if (this.pendingSection) {\n if (!nextBasePath || nextBasePath !== this.pendingSection) {\n return;\n }\n if (!this.currentUrl.startsWith(this.pendingSection)) {\n return;\n }\n const tabs = this.incomingTabs();\n if (tabs.length === 0) {\n return;\n }\n this.pendingSection = '';\n }\n\n const tabs = this.incomingTabs();\n const tabsConfigChanged =\n this.digestTabsConfig(tabs) !== this.digestTabsConfig(this.resolvedTabs);\n\n this.resolvedTabs = tabs;\n this.syncValueFromUrl();\n this.committedSection = nextBasePath;\n if (tabsConfigChanged) {\n this.resetTabOverflowLayout();\n }\n this.scheduleOverflowCheck();\n }\n\n private syncMenuSections() {\n if (!this.menuEl) return;\n this.menuEl.sections = tabsToOverflowMenuSections(this.overflowTabs, this.effectiveValue);\n }\n\n private syncValueFromUrl() {\n const tabs = this.incomingTabs();\n\n if (!this.currentUrl || !this.basePath) {\n this.urlDerivedValue = '';\n this.hideTabsForDetailRoute = false;\n return;\n }\n\n if (!this.currentUrl.startsWith(this.basePath)) {\n this.urlDerivedValue = '';\n this.hideTabsForDetailRoute = false;\n return;\n }\n\n const { value, hideTabs } = deriveBarNavValueFromUrl(\n this.currentUrl,\n this.basePath,\n tabs,\n );\n this.urlDerivedValue = value;\n this.hideTabsForDetailRoute = hideTabs;\n }\n\n private selectTab(id: string) {\n this.value = id;\n this.dsTabChange.emit(id);\n }\n\n /** Move focus to the selected tab in the visible tab group (after expand). */\n private focusVisibleSelectedTab() {\n const tab = this.visibleTabListEl?.querySelector(\n `[data-tab-id=\"${this.effectiveValue}\"]`,\n ) as HTMLElement | null;\n tab?.focus({ preventScroll: true });\n }\n\n private focusVisibleTab(id: string) {\n this.focusedTabId = id;\n const tab = this.visibleTabListEl?.querySelector(\n `[data-tab-id=\"${id}\"]`,\n ) as HTMLElement | null;\n tab?.focus({ preventScroll: true });\n }\n\n private focusLastVisibleTab() {\n const last = [...this.renderedSelectableTabs].reverse().find(tab => !tab.isInactive);\n if (last) this.focusVisibleTab(last.id);\n }\n\n private findEnabledVisibleTab(from: number, step: 1 | -1): number | null {\n const tabs = this.renderedSelectableTabs;\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(e: KeyboardEvent) {\n const tabs = this.renderedSelectableTabs;\n if (!tabs.length) return;\n const targetId = (e.target as HTMLElement | null)?.getAttribute('data-tab-id');\n const focusedId = targetId ?? this.focusedTabId;\n\n if (e.key === 'Enter' || e.key === ' ') {\n const focused = tabs.find(tab => tab.id === focusedId);\n if (!focused || focused.isInactive) return;\n e.preventDefault();\n this.selectTab(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 (e.key === 'ArrowRight') {\n nextIndex = this.findEnabledVisibleTab(currentIndex, 1);\n if (nextIndex === null && this.hasOverflowTabs) {\n e.preventDefault();\n this.overflowRovingFocused = true;\n void this.triggerEl?.setFocus?.();\n return;\n }\n } else if (e.key === 'ArrowLeft') {\n nextIndex = this.findEnabledVisibleTab(currentIndex, -1);\n } else if (e.key === 'Home') {\n nextIndex = tabs.findIndex(tab => !tab.isInactive);\n } else if (e.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 e.preventDefault();\n this.focusVisibleTab(tabs[nextIndex].id);\n }\n\n private toggleTabMenu(options?: { focusVisible?: boolean }) {\n if (this.menuOpen) {\n this.menuOpen = false;\n this.menuInitialFocusVisible = false;\n return;\n }\n\n if (this.menuEl && this.triggerEl) {\n this.menuEl.anchor = this.triggerEl;\n this.menuEl.minWidth = '';\n this.syncMenuSections();\n }\n\n this.menuInitialFocusVisible = options?.focusVisible ?? false;\n this.menuTriggerActive = true;\n this.menuOpen = true;\n }\n\n private handleOverflowFocus = () => {\n this.overflowRovingFocused = true;\n };\n\n private handleOverflowBlur = () => {\n this.overflowRovingFocused = false;\n };\n\n private handleTriggerKeyDown(e: KeyboardEvent) {\n if (!this.hasOverflowTabs) return;\n\n if (!this.menuOpen) {\n if (e.key === 'ArrowLeft') {\n e.preventDefault();\n this.overflowRovingFocused = false;\n this.focusLastVisibleTab();\n return;\n }\n\n if (e.key === 'Enter' || e.key === ' ') {\n e.preventDefault();\n this.toggleTabMenu({ focusVisible: true });\n }\n return;\n }\n\n if (e.key === 'Escape') {\n e.preventDefault();\n this.menuOpen = false;\n this.menuInitialFocusVisible = false;\n void this.triggerEl?.setFocus?.();\n }\n }\n\n private renderTabList(tabs: BarNavTab[], probe: boolean) {\n return (\n <div\n role=\"tablist\"\n class=\"bar-nav__tab-list\"\n aria-label={this.heading}\n ref={el => {\n if (probe) {\n const next = (el as HTMLElement) ?? null;\n if (next === this.probeTabListEl) return;\n this.probeTabListEl = next;\n if (next) {\n this.intrinsicWidthRetryCount = 0;\n this.tabLayoutPendingFrames = 0;\n this.scheduleOverflowCheck();\n }\n } else {\n this.visibleTabListEl = (el as HTMLElement) ?? null;\n }\n }}\n onKeyDown={probe ? undefined : (e: KeyboardEvent) => this.handleTabKeyDown(e)}\n onFocusin={probe ? undefined : () => {\n this.overflowRovingFocused = false;\n }}\n >\n {tabs.map((tab, index) => {\n if (isTabDivider(tab)) {\n return (\n <div class=\"bar-nav__tab-divider\" key={`divider-${index}`} aria-hidden=\"true\">\n <div class=\"bar-nav__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=\"tab\"\n data-tab-id={tab.id}\n class={{\n 'bar-nav__tab': true,\n 'bar-nav__tab--selected': isSelected,\n 'ds-control--md': true,\n 'ds-focus-ring-inset': true,\n 'ds-control-inactive': !!tab.isInactive,\n }}\n aria-selected={isSelected ? 'true' : 'false'}\n aria-disabled={tab.isInactive ? 'true' : undefined}\n aria-controls={tab.panelId ?? undefined}\n disabled={tab.isInactive}\n tabIndex={\n !probe && !this.overflowRovingFocused && tab.id === this.focusedTabId\n ? 0\n : -1\n }\n onClick={() => !probe && !tab.isInactive && this.selectTab(tab.id)}\n onFocus={() => {\n if (!probe) this.focusedTabId = tab.id;\n }}\n >\n <span\n class={{\n 'bar-nav__tab-label': true,\n 'bar-nav__tab-label--dot': !!tab.dot,\n }}\n >\n <ds-text as=\"span\" variant=\"text-body-medium\" emphasis={isSelected} color=\"inherit\">\n {tab.label}\n </ds-text>\n {tab.dot && (\n <ds-badge\n class=\"bar-nav__tab-dot\"\n variant=\"dot\"\n hasRing={false}\n label=\"\"\n aria-hidden=\"true\"\n />\n )}\n </span>\n </button>\n );\n })}\n </div>\n );\n }\n\n render() {\n // Section gating only applies when `basePath` is set (SPA section sync).\n // Tabs without a base path must still render — otherwise a single-tab bar\n // (or any non-routed tabs) silently falls through to an empty header.\n const sectionReady =\n this.basePath === '' || this.committedSection === this.basePath;\n const hasTabs =\n sectionReady && this.resolvedTabs.length > 0 && !this.hideTabsForDetailRoute;\n const tabGroupKey = this.basePath || 'no-section';\n const renderedTabs = this.hasOverflowTabs ? this.visibleTabs : this.resolvedTabs;\n\n return (\n <Host>\n <header\n class={{\n 'bar-nav': true,\n 'ds-control--md': true,\n 'bar-nav--dashboard': this.navStyle === 'dashboard',\n 'bar-nav--settings': this.navStyle === 'settings',\n 'bar-nav--tabs-collapsed':\n hasTabs && this.hasOverflowTabs,\n }}\n ref={el => {\n this.headerEl = el as HTMLElement;\n if (el && !this.resizeObserver) {\n this.setupOverflowObserver();\n }\n }}\n >\n {hasTabs && (\n <div class=\"bar-nav__tabs-probe\" aria-hidden=\"true\" inert>\n <div key={`probe-${tabGroupKey}`}>\n {this.renderTabList(this.resolvedTabs, true)}\n </div>\n </div>\n )}\n\n {hasTabs && this.tabLayoutCommitted && renderedTabs.length > 0 && (\n <div class=\"bar-nav__left\">\n <div key={`visible-${tabGroupKey}`} class=\"bar-nav__tabs-visible\">\n {this.renderTabList(renderedTabs, false)}\n </div>\n </div>\n )}\n\n {hasTabs && !this.tabLayoutCommitted && (\n <div class=\"bar-nav__tabs-pending\" aria-hidden=\"true\" />\n )}\n\n {!hasTabs && this.heading && (\n <ds-text\n class=\"bar-nav__heading\"\n as=\"span\"\n variant=\"text-body-medium\"\n emphasis\n color=\"primary\"\n wrap=\"nowrap\"\n >\n {this.heading}\n </ds-text>\n )}\n\n {hasTabs && this.hasOverflowTabs && (\n <ds-button-unfilled variant=\"icon\"\n class={{\n 'bar-nav__overflow-trigger': true,\n }}\n icon=\"Ellipses\"\n activeFill={false}\n hasBorder={false}\n focusTabIndex={this.overflowRovingFocused ? 0 : -1}\n ref={(el?: HTMLDsButtonUnfilledElement) => {\n this.triggerEl = (el as (HTMLElement & { setFocus?: () => Promise<void> })) ?? null;\n }}\n haspopup=\"menu\"\n expanded={this.menuTriggerActive}\n aria-label={this.moreTabsLabel}\n onDsClick={() => this.toggleTabMenu({ focusVisible: false })}\n onFocusin={this.handleOverflowFocus}\n onFocusout={this.handleOverflowBlur}\n onKeyDown={(e: KeyboardEvent) => this.handleTriggerKeyDown(e)}\n />\n )}\n\n </header>\n\n {hasTabs && this.hasOverflowTabs && (\n <ds-menu\n ref={el => {\n this.menuEl = (el as HTMLDsMenuElement) ?? null;\n }}\n open={this.menuOpen}\n sections={tabsToOverflowMenuSections(this.overflowTabs, this.effectiveValue)}\n side=\"bottom\"\n align=\"end\"\n sideOffset=\"calc(var(--dimension-space-100) + var(--dimension-space-050))\"\n initialFocusVisible={this.menuInitialFocusVisible}\n onDsSelect={(e: Event) => this.handleMenuSelect(e)}\n onDsClose={() => this.handleMenuClose()}\n onDsAfterClose={() => this.handleMenuAfterClose()}\n />\n )}\n </Host>\n );\n }\n}\n"],"mappings":"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","ignoreList":[]}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{p as t,H as i,c as e,h as s,a as r,t as n}from"./index.js";import{d as a}from"./p-DxeHimqk.js";import{d as o}from"./p-DpyTrZa2.js";import{d as c}from"./p-webARv8d.js";import{d as l}from"./p-BAfG3M8z.js";import{d}from"./p-Cpr3K41-.js";import{d as b}from"./p-C3Zfn7hz.js";import{d as h}from"./p-Dqwcw1-m.js";import{d as u}from"./p-Dy_sZ-dI.js";import{d as f}from"./p-Bs6SS34m.js";import{d as v}from"./p-DfIch2Dk.js";function g(t){return"type"in t&&t.type==="divider"}const m=()=>`.ds-control--md.sc-ds-bar-title-h,.ds-control--md.sc-ds-bar-title,.ds-control--sm.sc-ds-bar-title-h,.ds-control--sm.sc-ds-bar-title,.ds-control--xs.sc-ds-bar-title-h,.ds-control--xs.sc-ds-bar-title{--ds-control-radius:var(--dimension-radius-025)}.ds-control--md.sc-ds-bar-title-h,.ds-control--md.sc-ds-bar-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-title-h,.ds-control--sm.sc-ds-bar-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-title-h,.ds-control--xs.sc-ds-bar-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}.sc-ds-bar-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-title-h:focus-visible,.ds-focus-ring.sc-ds-bar-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-title-h,.ds-focus-ring.ds-focus-ring--visible.sc-ds-bar-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-title-h:focus-visible,.ds-focus-ring-inset.sc-ds-bar-title:focus-visible{outline:none}.ds-focus-ring-inset.sc-ds-bar-title-h:focus-visible::after,.ds-focus-ring-inset.sc-ds-bar-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-title-h,.ds-focus-ring-inset.ds-focus-ring--visible.sc-ds-bar-title{outline:none}.ds-focus-ring-inset.ds-focus-ring--visible.sc-ds-bar-title-h::after,.ds-focus-ring-inset.ds-focus-ring--visible.sc-ds-bar-title::after{outline:var(--ds-focus-ring-width) solid var(--ds-focus-ring-color);outline-offset:calc(-1 * var(--ds-focus-ring-width))}.ds-interaction-fill.sc-ds-bar-title-h,.ds-interaction-fill.sc-ds-bar-title{position:relative;z-index:0;--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-fill.sc-ds-bar-title-h::before,.ds-interaction-fill.sc-ds-bar-title::before,.ds-interaction-fill.sc-ds-bar-title-h::after,.ds-interaction-fill.sc-ds-bar-title::after{content:'';position:absolute;inset:0;border-radius:inherit;background:transparent;pointer-events:none;transition:none}.ds-interaction-fill.sc-ds-bar-title-h::before,.ds-interaction-fill.sc-ds-bar-title::before{z-index:1}.ds-interaction-fill.sc-ds-bar-title-h::after,.ds-interaction-fill.sc-ds-bar-title::after{z-index:3;box-shadow:inset 0 0 0 var(--ds-interaction-border-width) var(--ds-interaction-border-color)}.ds-interaction-fill--bordered.sc-ds-bar-title-h,.ds-interaction-fill--bordered.sc-ds-bar-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-title-h::before,.ds-interaction-fill--selected.sc-ds-bar-title::before{background:var(--ds-interaction-active)}.ds-interaction-fill--selected.sc-ds-bar-title-h,.ds-interaction-fill--selected.sc-ds-bar-title{--ds-interaction-dot-ring:var(--ds-interaction-active)}.ds-interaction-fill.sc-ds-bar-title-h:hover:not(:disabled)::after,.ds-interaction-fill.sc-ds-bar-title:hover:not(:disabled)::after{background:var(--ds-interaction-hover)}.ds-interaction-fill.sc-ds-bar-title-h:active:not(:disabled)::after,.ds-interaction-fill.sc-ds-bar-title:active:not(:disabled)::after{background:var(--ds-interaction-pressed)}.ds-interaction-fill.sc-ds-bar-title-h>.ds-interaction-fill__content.sc-ds-bar-title,.ds-interaction-fill.sc-ds-bar-title>.ds-interaction-fill__content.sc-ds-bar-title,.ds-interaction-fill__content.sc-ds-bar-title{position:relative;z-index:2}.ds-interaction-fill--on-faint.sc-ds-bar-title-h,.ds-interaction-fill--on-faint.sc-ds-bar-title{--ds-interaction-active:var(--color-interaction-active)}.ds-interaction-fill--on-medium.sc-ds-bar-title-h,.ds-interaction-fill--on-medium.sc-ds-bar-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-title-h,.ds-interaction-fill--on-bold.sc-ds-bar-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-title-h,.ds-interaction-fill--on-strong.sc-ds-bar-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-title-h,.ds-interaction-fill--on-translucent.sc-ds-bar-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);--ds-focus-ring-color:var(--color-translucent-interaction-focus)}.ds-interaction-fill--on-inverted.sc-ds-bar-title-h,.ds-interaction-fill--on-inverted.sc-ds-bar-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);--ds-focus-ring-color:var(--color-inverted-interaction-focus)}.ds-interaction-fill--on-media.sc-ds-bar-title-h,.ds-interaction-fill--on-media.sc-ds-bar-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-title-h,.ds-interaction-fill--on-always-dark.sc-ds-bar-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);--ds-focus-ring-color:var(--color-always-dark-interaction-focus)}.ds-interaction-fill--on-navigation.sc-ds-bar-title-h,.ds-interaction-fill--on-navigation.sc-ds-bar-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)}.sc-ds-bar-title-h{display:block;min-width:0;box-sizing:border-box;background:var(--color-background-primary)}[data-shell-page-syncing].sc-ds-bar-title-h{visibility:hidden}.bar-title.sc-ds-bar-title{position:relative;min-width:0;padding:0;box-sizing:border-box;background:var(--color-background-primary)}.bar-title-host--editor.sc-ds-bar-title-h,.bar-title-host--editor.sc-ds-bar-title-h .bar-title.sc-ds-bar-title{background:var(--color-background-bold-brand)}.bar-title.sc-ds-bar-title::after{content:'';position:absolute;inset:auto var(--dimension-space-400) 0;height:var(--dimension-stroke-width-012);background:var(--color-border-tertiary);pointer-events:none}.bar-title-host--editor.sc-ds-bar-title-h .bar-title.sc-ds-bar-title::after{display:none}.bar-title__inner.sc-ds-bar-title{position:relative;display:flex;flex-direction:column;align-items:stretch;gap:var(--dimension-space-100);padding:var(--dimension-space-400);box-sizing:border-box}.bar-title__row.sc-ds-bar-title{display:flex;align-items:flex-start;justify-content:space-between;gap:var(--dimension-space-100);min-height:var(--dimension-size-400);min-width:0}.bar-title-host--expanded.sc-ds-bar-title-h .bar-title__row.sc-ds-bar-title{gap:var(--dimension-space-400)}.bar-title__leading.sc-ds-bar-title{display:flex;flex:1 1 auto;flex-direction:column;gap:var(--dimension-space-050);min-width:0}.bar-title-host--expanded.bar-title-host--has-back.sc-ds-bar-title-h .bar-title__leading.sc-ds-bar-title{margin-block-start:calc(-1 * (var(--dimension-size-200) + var(--dimension-space-050) * 2))}.bar-title__title-row.sc-ds-bar-title{display:flex;align-items:center;gap:var(--dimension-space-100);min-width:0;min-height:var(--dimension-size-400)}.bar-title__identity.sc-ds-bar-title{display:flex;flex:0 1 auto;align-items:center;gap:var(--dimension-space-050);min-width:0}.bar-title__back.sc-ds-bar-title,.bar-title__breadcrumb-back.sc-ds-bar-title,.bar-title__section-chevron.sc-ds-bar-title{flex:0 0 auto}.bar-title__breadcrumb.sc-ds-bar-title,.bar-title__exit.sc-ds-bar-title{display:flex;align-items:center;min-width:0;margin-block-start:var(--dimension-space-050)}.bar-title__heading.sc-ds-bar-title{display:block;width:auto;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;user-select:none}.bar-title__divider.sc-ds-bar-title{width:var(--dimension-stroke-width-012);height:var(--dimension-size-250);margin-inline-start:var(--dimension-space-100);flex:0 0 var(--dimension-stroke-width-012);background:var(--color-border-tertiary)}.bar-title__section-selector.sc-ds-bar-title{display:flex;flex:0 1 auto;min-width:0;max-width:var(--dimension-panel-width-sm)}.bar-title__section-trigger.sc-ds-bar-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:pointer;font-family:inherit;user-select:none;transition:color var(--effect-motion-short-2)}.bar-title__section-trigger--expanded.sc-ds-bar-title{color:var(--color-foreground-primary)}.bar-title-host--editor.sc-ds-bar-title-h .bar-title__divider.sc-ds-bar-title{background:var(--color-border-on-bold-background-tertiary)}.bar-title-host--editor.sc-ds-bar-title-h .bar-title__section-trigger.sc-ds-bar-title{color:var(--color-foreground-on-bold-background-secondary)}.bar-title-host--editor.sc-ds-bar-title-h .bar-title__section-trigger--expanded.sc-ds-bar-title{color:var(--color-foreground-on-bold-background-primary)}.bar-title__section-trigger--expanded.sc-ds-bar-title::after,.bar-title__section-trigger--expanded.sc-ds-bar-title:hover::after{background:var(--ds-interaction-pressed)}.bar-title__section-label.sc-ds-bar-title{min-width:0;padding-inline:var(--ds-control-label-inset);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.bar-title__actions.sc-ds-bar-title{display:flex;align-items:center;gap:var(--dimension-space-100);flex:0 0 auto}.bar-title__description.sc-ds-bar-title{display:block;min-width:0;max-width:100%}.bar-title-host--compact.sc-ds-bar-title-h .bar-title.sc-ds-bar-title{height:var(--dimension-size-600);padding:var(--dimension-space-100)}.bar-title-host--compact.sc-ds-bar-title-h .bar-title.sc-ds-bar-title::after{inset-inline:0}.bar-title-host--compact.sc-ds-bar-title-h .bar-title__inner.sc-ds-bar-title{height:100%;padding:0;gap:0}.bar-title-host--compact.sc-ds-bar-title-h .bar-title__row.sc-ds-bar-title{height:100%;align-items:center}.bar-title-host--compact.sc-ds-bar-title-h .bar-title__identity.sc-ds-bar-title{height:var(--dimension-size-400)}.bar-title-host--compact.sc-ds-bar-title-h .bar-title__divider.sc-ds-bar-title{margin-inline-start:0}.bar-title-host--compact.sc-ds-bar-title-h .bar-title__heading.sc-ds-bar-title{display:inline-flex;flex:1 1 auto;align-items:center;height:var(--dimension-size-400);padding-inline:calc(var(--ds-control-padding-inline) + var(--ds-control-label-inset));box-sizing:border-box}@media (prefers-reduced-motion: reduce){.bar-title__section-trigger.sc-ds-bar-title{transition:none}}`;let p=0;const _=t(class t extends i{constructor(t){super();if(t!==false){this.__registerHost()}this.dsBack=e(this,"dsBack");this.dsSectionChange=e(this,"dsSectionChange");this.dsAction=e(this,"dsAction");this.description="";this.showBack=false;this.backAriaLabel="Back";this.backLabel="Back";this.sections=[];this.value="";this.sectionsAriaLabel="Change page section";this.primaryAction=null;this.actions=[];this.actionsAriaLabel="More page actions";this.variant="expanded";this.mode="default";this.sectionMenuOpen=false;this.actionMenuOpen=false;this.sectionMenuInitialFocusVisible=false;this.actionMenuInitialFocusVisible=false;this.instanceId=p++;this.sectionMenuTriggerId=`bar-title-section-trigger-${this.instanceId}`;this.sectionMenuId=`bar-title-section-menu-${this.instanceId}`;this.actionMenuTriggerId=`bar-title-action-trigger-${this.instanceId}`;this.actionMenuId=`bar-title-action-menu-${this.instanceId}`;this.sectionTriggerEl=null;this.actionTriggerEl=null;this.toggleSectionMenu=t=>{this.sectionMenuInitialFocusVisible=t.detail===0;this.actionMenuOpen=false;this.sectionMenuOpen=!this.sectionMenuOpen};this.closeSectionMenu=()=>{this.sectionMenuOpen=false};this.handleSectionSelect=t=>{const i=String(t.detail?.value??"");const e=this.selectableSections.find((t=>t.id===i));if(!e||e.isInactive)return;this.closeSectionMenu();this.dsSectionChange.emit(i);requestAnimationFrame((()=>this.sectionTriggerEl?.focus()))};this.toggleActionMenu=t=>{this.actionMenuInitialFocusVisible=t.detail===0;this.sectionMenuOpen=false;this.actionMenuOpen=!this.actionMenuOpen};this.closeActionMenu=()=>{this.actionMenuOpen=false};this.handleActionSelect=t=>{const i=String(t.detail?.value??"");const e=this.primaryCollapsed&&this.primaryAction?.id===i;const s=this.selectableActions.find((t=>t.id===i));if(!e&&!s)return;if(e&&(this.primaryAction?.isInactive||this.primaryAction?.isLoading)||s?.isInactive){return}this.closeActionMenu();this.dsAction.emit(i);requestAnimationFrame((()=>void this.actionTriggerEl?.setFocus?.()))}}handleSectionsChange(){if(!this.hasSectionSelector)this.closeSectionMenu()}handleActionsChange(){if(!this.showActionMenuTrigger)this.closeActionMenu()}get compact(){return this.variant!=="expanded"}get editor(){return this.mode==="editor"}get backTooltipLabel(){return this.editor?"Exit":"Go back"}get primaryCollapsed(){return!this.editor&&this.variant==="constrained"&&this.primaryAction!==null&&(this.primaryAction.collapse??"auto")==="auto"}get selectableSections(){return this.sections.filter((t=>!g(t)))}get hasSectionSelector(){return this.selectableSections.length>1}get effectiveValue(){return this.selectableSections.some((t=>t.id===this.value))?this.value:this.selectableSections[0]?.id??""}get selectedSectionLabel(){return this.selectableSections.find((t=>t.id===this.effectiveValue))?.label??""}get sectionTriggerAriaLabel(){return`${this.sectionsAriaLabel}. Current section: ${this.selectedSectionLabel}`}groupsFromItems(t,i){const e=[];let s=[];const r=()=>{if(s.length>0)e.push({items:s});s=[]};for(const e of t){if(g(e)){r()}else{s.push(i(e))}}r();return e}get sectionMenuSections(){return this.groupsFromItems(this.sections,(t=>({label:t.label,value:t.id,isSelected:t.id===this.effectiveValue,isInactive:t.isInactive})))}get selectableActions(){return this.actions.filter((t=>!g(t)))}get showActionMenuTrigger(){return this.selectableActions.length>0||this.primaryCollapsed&&this.primaryAction!==null}actionMenuItem(t){const i=t;return{label:t.label,value:t.id,isInactive:t.isInactive||i.isLoading,isDestructive:t.isDestructive||i.intent==="negative"}}get actionMenuSections(){const t=this.groupsFromItems(this.actions,(t=>this.actionMenuItem(t)));if(!this.primaryCollapsed||!this.primaryAction)return t;return[{items:[this.actionMenuItem(this.primaryAction)]},...t]}renderSectionSelector(){if(!this.hasSectionSelector)return null;return[s("div",{class:"bar-title__divider","aria-hidden":"true"}),s("div",{class:"bar-title__section-selector"},s("button",{ref:t=>{this.sectionTriggerEl=t??null},id:this.sectionMenuTriggerId,class:{"bar-title__section-trigger":true,"bar-title__section-trigger--expanded":this.sectionMenuOpen,"ds-control--md":true,"ds-focus-ring-inset":true,"ds-interaction-fill":true,"ds-interaction-fill--on-bold":this.editor},type:"button","aria-haspopup":"menu","aria-controls":this.sectionMenuId,"aria-expanded":String(this.sectionMenuOpen),"aria-label":this.sectionTriggerAriaLabel,onClick:this.toggleSectionMenu},s("ds-text",{class:"bar-title__section-label ds-interaction-fill__content",as:"span",variant:"text-body-medium",emphasis:true,color:this.editor?"on-bold":"primary"},this.selectedSectionLabel),s("ds-icon",{class:"bar-title__section-chevron ds-interaction-fill__content",name:"ChevronUpDown",size:"md",color:"inherit","aria-hidden":"true"})))]}renderActions(){const t=this.primaryAction;const i=this.editor&&this.compact;if(!t&&!this.showActionMenuTrigger)return null;return s("div",{class:"bar-title__actions"},t&&!this.primaryCollapsed?i?s("ds-tooltip",{label:t.label,side:"bottom",size:"sm"},s("ds-button-filled",{class:"bar-title__primary-action",variant:"icon",icon:"Check",label:t.label,"aria-label":t.label,intent:"brand",contrast:"faint",background:"bold",size:"md",type:t.type??"button",isInactive:t.isInactive,isLoading:t.isLoading,onDsClick:()=>this.dsAction.emit(t.id)})):s("ds-button-filled",{class:"bar-title__primary-action",variant:t.icon?"icon-label":"label",icon:t.icon??"",label:t.label,intent:this.editor?"brand":t.intent??"brand",contrast:this.editor?"faint":t.contrast??"bold",background:this.editor?"bold":undefined,size:"md",type:t.type??"button",isInactive:t.isInactive,isLoading:t.isLoading,onDsClick:()=>this.dsAction.emit(t.id)}):null,this.showActionMenuTrigger?s("ds-tooltip",{label:"Page options",side:"bottom",size:"sm"},s("ds-button-unfilled",{ref:t=>{this.actionTriggerEl=t??null},id:this.actionMenuTriggerId,class:"bar-title__more-actions",variant:"icon",icon:"Ellipses","aria-label":this.actionsAriaLabel,size:"md",background:this.editor?"bold":undefined,activeFill:!this.compact&&!this.editor,hasBorder:!this.compact&&!this.primaryCollapsed&&!this.editor,haspopup:"menu",controls:this.actionMenuId,expanded:this.actionMenuOpen,onDsClick:t=>this.toggleActionMenu(t.detail)})):null)}renderBack(t){if(!this.showBack)return null;if(!t){if(this.editor){return s("div",{class:"bar-title__exit"},s("ds-button-unfilled",{class:"bar-title__exit-action",variant:"icon-label",icon:"Cross",label:this.backLabel,"aria-label":this.backAriaLabel,size:"xs",background:"bold",activeFill:false,hasBorder:false,onDsClick:t=>this.dsBack.emit(t.detail)}))}return s("div",{class:"bar-title__breadcrumb"},s("ds-button-unfilled",{class:"bar-title__breadcrumb-back",variant:"icon-label",icon:"ChevronLeft",label:this.backLabel,"aria-label":this.backAriaLabel,size:"xs",hasBorder:false,onDsClick:t=>this.dsBack.emit(t.detail)}))}return s("ds-tooltip",{label:this.backTooltipLabel,side:"bottom",size:"sm"},s("ds-button-unfilled",{class:"bar-title__back",variant:"icon",icon:this.editor?"Cross":"ChevronLeft","aria-label":this.backAriaLabel,size:"md",background:this.editor?"bold":undefined,activeFill:false,hasBorder:false,onDsClick:t=>this.dsBack.emit(t.detail)}))}render(){const t=this.compact;return s(r,{key:"4b5208dcaace6bf1efa8d3280b6bd5783343a3b0",class:{"bar-title-host--compact":t,"bar-title-host--expanded":this.variant==="expanded","bar-title-host--constrained":this.variant==="constrained","bar-title-host--editor":this.editor,"bar-title-host--has-description":!!this.description,"bar-title-host--has-back":this.showBack}},s("div",{key:"12615a8dd390358fdbd9812aeeecc2355f1efdf2",class:"bar-title"},s("div",{key:"92d6a2d6cf54e698f3eea865956e3f03cfac9991",class:"bar-title__inner"},s("div",{key:"0253a3669b3b4ae16e463d234f79e7981ad1b852",class:"bar-title__row"},s("div",{key:"70f5bb9bae56735a99bed9ad331ad49ccef10533",class:"bar-title__leading"},!t?this.renderBack(false):null,s("div",{key:"3b61b49b6eba84b464c08cb61a55b01450161081",class:"bar-title__title-row"},s("div",{key:"9522076fa7d051e7fe9fe20258cb21f80766baa9",class:"bar-title__identity"},t?this.renderBack(true):null,s("ds-text",{key:"34a0f33aed1f40d6096432ef0001b9ed6b2fad72",class:"bar-title__heading ds-control--md",variant:t?"text-title-small":"text-title-medium",emphasis:true,color:this.editor?"on-bold":"primary",as:"h1",lineTruncation:1},this.heading)),this.renderSectionSelector()),this.description&&!t?s("ds-text",{class:"bar-title__description",variant:"text-body-small",color:this.editor?"var(--color-foreground-on-bold-background-secondary)":"secondary",lineTruncation:2,wrap:"wrap",as:"p"},this.description):null),this.renderActions()))),this.hasSectionSelector?s("ds-menu",{id:this.sectionMenuId,class:"bar-title__section-menu",anchorId:this.sectionMenuTriggerId,menuLabel:this.sectionsAriaLabel,open:this.sectionMenuOpen,initialFocusVisible:this.sectionMenuInitialFocusVisible,sections:this.sectionMenuSections,onDsClose:this.closeSectionMenu,onDsSelect:this.handleSectionSelect}):null,this.showActionMenuTrigger?s("ds-menu",{id:this.actionMenuId,class:"bar-title__action-menu",anchorId:this.actionMenuTriggerId,align:"end",menuLabel:this.actionsAriaLabel,open:this.actionMenuOpen,initialFocusVisible:this.actionMenuInitialFocusVisible,sections:this.actionMenuSections,onDsClose:this.closeActionMenu,onDsSelect:this.handleActionSelect}):null)}static get watchers(){return{sections:[{handleSectionsChange:0}],actions:[{handleActionsChange:0}],primaryAction:[{handleActionsChange:0}]}}static get style(){return m()}},[2,"ds-bar-title",{heading:[1],description:[1],showBack:[4,"show-back"],backAriaLabel:[1,"back-aria-label"],backLabel:[1,"back-label"],sections:[16],value:[1],sectionsAriaLabel:[1,"sections-aria-label"],primaryAction:[16],actions:[16],actionsAriaLabel:[1,"actions-aria-label"],variant:[1],mode:[1],sectionMenuOpen:[32],actionMenuOpen:[32],sectionMenuInitialFocusVisible:[32],actionMenuInitialFocusVisible:[32]},undefined,{sections:[{handleSectionsChange:0}],actions:[{handleActionsChange:0}],primaryAction:[{handleActionsChange:0}]}]);function k(){if(typeof customElements==="undefined"){return}const t=["ds-bar-title","ds-badge","ds-button-filled","ds-button-unfilled","ds-icon","ds-loader","ds-menu","ds-swatch-picker","ds-switch","ds-text","ds-tooltip"];t.forEach((t=>{switch(t){case"ds-bar-title":if(!customElements.get(n(t))){customElements.define(n(t),_)}break;case"ds-badge":if(!customElements.get(n(t))){a()}break;case"ds-button-filled":if(!customElements.get(n(t))){o()}break;case"ds-button-unfilled":if(!customElements.get(n(t))){c()}break;case"ds-icon":if(!customElements.get(n(t))){l()}break;case"ds-loader":if(!customElements.get(n(t))){d()}break;case"ds-menu":if(!customElements.get(n(t))){b()}break;case"ds-swatch-picker":if(!customElements.get(n(t))){h()}break;case"ds-switch":if(!customElements.get(n(t))){u()}break;case"ds-text":if(!customElements.get(n(t))){f()}break;case"ds-tooltip":if(!customElements.get(n(t))){v()}break}}))}k();const x=_;const w=k;export{x as DsBarTitle,w as defineCustomElement};
|
|
1
|
+
import{p as t,H as i,c as e,h as s,a as r,t as n}from"./index.js";import{d as a}from"./p-CH6cNXXF.js";import{d as o}from"./p-BVV_rlIP.js";import{d as c}from"./p-BhxwpOH8.js";import{d as l}from"./p-CoYFJD-w.js";import{d}from"./p-BAfG3M8z.js";import{d as b}from"./p-Cpr3K41-.js";import{d as h}from"./p-CWlh7HAg.js";import{d as u}from"./p-Bi_bxbih.js";import{d as f}from"./p-DYqReipj.js";import{d as m}from"./p-BwGnhInj.js";import{d as v}from"./p-D3DYxbC5.js";function g(t){return"type"in t&&t.type==="divider"}const p=()=>`.ds-control--md.sc-ds-bar-title-h,.ds-control--md.sc-ds-bar-title,.ds-control--sm.sc-ds-bar-title-h,.ds-control--sm.sc-ds-bar-title,.ds-control--xs.sc-ds-bar-title-h,.ds-control--xs.sc-ds-bar-title{--ds-control-radius:var(--dimension-radius-025)}.ds-control--md.sc-ds-bar-title-h,.ds-control--md.sc-ds-bar-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-title-h,.ds-control--sm.sc-ds-bar-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-title-h,.ds-control--xs.sc-ds-bar-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}.sc-ds-bar-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-title-h:focus-visible,.ds-focus-ring.sc-ds-bar-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-title-h,.ds-focus-ring.ds-focus-ring--visible.sc-ds-bar-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-title-h:focus-visible,.ds-focus-ring-inset.sc-ds-bar-title:focus-visible{outline:none}.ds-focus-ring-inset.sc-ds-bar-title-h:focus-visible::after,.ds-focus-ring-inset.sc-ds-bar-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-title-h,.ds-focus-ring-inset.ds-focus-ring--visible.sc-ds-bar-title{outline:none}.ds-focus-ring-inset.ds-focus-ring--visible.sc-ds-bar-title-h::after,.ds-focus-ring-inset.ds-focus-ring--visible.sc-ds-bar-title::after{outline:var(--ds-focus-ring-width) solid var(--ds-focus-ring-color);outline-offset:calc(-1 * var(--ds-focus-ring-width))}.ds-interaction-fill.sc-ds-bar-title-h,.ds-interaction-fill.sc-ds-bar-title{position:relative;z-index:0;--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-fill.sc-ds-bar-title-h::before,.ds-interaction-fill.sc-ds-bar-title::before,.ds-interaction-fill.sc-ds-bar-title-h::after,.ds-interaction-fill.sc-ds-bar-title::after{content:'';position:absolute;inset:0;border-radius:inherit;background:transparent;pointer-events:none;transition:none}.ds-interaction-fill.sc-ds-bar-title-h::before,.ds-interaction-fill.sc-ds-bar-title::before{z-index:1}.ds-interaction-fill.sc-ds-bar-title-h::after,.ds-interaction-fill.sc-ds-bar-title::after{z-index:3;box-shadow:inset 0 0 0 var(--ds-interaction-border-width) var(--ds-interaction-border-color)}.ds-interaction-fill--bordered.sc-ds-bar-title-h,.ds-interaction-fill--bordered.sc-ds-bar-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-title-h::before,.ds-interaction-fill--selected.sc-ds-bar-title::before{background:var(--ds-interaction-active)}.ds-interaction-fill--selected.sc-ds-bar-title-h,.ds-interaction-fill--selected.sc-ds-bar-title{--ds-interaction-dot-ring:var(--ds-interaction-active)}.ds-interaction-fill.sc-ds-bar-title-h:hover:not(:disabled)::after,.ds-interaction-fill.sc-ds-bar-title:hover:not(:disabled)::after{background:var(--ds-interaction-hover)}.ds-interaction-fill.sc-ds-bar-title-h:active:not(:disabled)::after,.ds-interaction-fill.sc-ds-bar-title:active:not(:disabled)::after{background:var(--ds-interaction-pressed)}.ds-interaction-fill.sc-ds-bar-title-h>.ds-interaction-fill__content.sc-ds-bar-title,.ds-interaction-fill.sc-ds-bar-title>.ds-interaction-fill__content.sc-ds-bar-title,.ds-interaction-fill__content.sc-ds-bar-title{position:relative;z-index:2}.ds-interaction-fill--on-faint.sc-ds-bar-title-h,.ds-interaction-fill--on-faint.sc-ds-bar-title{--ds-interaction-active:var(--color-interaction-active)}.ds-interaction-fill--on-medium.sc-ds-bar-title-h,.ds-interaction-fill--on-medium.sc-ds-bar-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-title-h,.ds-interaction-fill--on-bold.sc-ds-bar-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-title-h,.ds-interaction-fill--on-strong.sc-ds-bar-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-title-h,.ds-interaction-fill--on-translucent.sc-ds-bar-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);--ds-focus-ring-color:var(--color-translucent-interaction-focus)}.ds-interaction-fill--on-inverted.sc-ds-bar-title-h,.ds-interaction-fill--on-inverted.sc-ds-bar-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);--ds-focus-ring-color:var(--color-inverted-interaction-focus)}.ds-interaction-fill--on-media.sc-ds-bar-title-h,.ds-interaction-fill--on-media.sc-ds-bar-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-title-h,.ds-interaction-fill--on-always-dark.sc-ds-bar-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);--ds-focus-ring-color:var(--color-always-dark-interaction-focus)}.ds-interaction-fill--on-navigation.sc-ds-bar-title-h,.ds-interaction-fill--on-navigation.sc-ds-bar-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)}.sc-ds-bar-title-h{display:block;min-width:0;box-sizing:border-box;background:var(--color-background-primary)}[data-shell-page-syncing].sc-ds-bar-title-h{visibility:hidden}.bar-title.sc-ds-bar-title{position:relative;min-width:0;padding:0;box-sizing:border-box;background:var(--color-background-primary)}.bar-title.sc-ds-bar-title::after{content:'';position:absolute;inset:auto var(--dimension-space-400) 0;height:var(--dimension-stroke-width-012);background:var(--color-border-tertiary);pointer-events:none}.bar-title__inner.sc-ds-bar-title{position:relative;display:flex;flex-direction:column;align-items:stretch;gap:var(--dimension-space-100);padding:var(--dimension-space-400);box-sizing:border-box}.bar-title__row.sc-ds-bar-title{display:flex;align-items:flex-start;justify-content:space-between;gap:var(--dimension-space-100);min-height:var(--dimension-size-400);min-width:0}.bar-title-host--expanded.sc-ds-bar-title-h .bar-title__row.sc-ds-bar-title{gap:var(--dimension-space-400)}.bar-title__leading.sc-ds-bar-title{display:flex;flex:1 1 auto;flex-direction:column;gap:var(--dimension-space-100);min-width:0}.bar-title__title-row.sc-ds-bar-title{display:flex;align-items:center;gap:var(--dimension-space-100);min-width:0;min-height:var(--dimension-size-400)}.bar-title__identity.sc-ds-bar-title{display:flex;flex:0 1 auto;align-items:center;gap:var(--dimension-space-050);min-width:0}.bar-title__back.sc-ds-bar-title,.bar-title__section-chevron.sc-ds-bar-title{flex:0 0 auto}.bar-title__breadcrumb.sc-ds-bar-title{display:block;width:100%;min-width:0}.bar-title__heading.sc-ds-bar-title{display:block;width:auto;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;user-select:none}.bar-title__divider.sc-ds-bar-title{width:var(--dimension-stroke-width-012);height:var(--dimension-size-250);margin-inline-start:var(--dimension-space-100);flex:0 0 var(--dimension-stroke-width-012);background:var(--color-border-tertiary)}.bar-title__section-selector.sc-ds-bar-title{display:flex;flex:0 1 auto;min-width:0;max-width:var(--dimension-panel-width-sm)}.bar-title__section-trigger.sc-ds-bar-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:pointer;font-family:inherit;user-select:none;transition:color var(--effect-motion-short-2)}.bar-title__section-trigger--expanded.sc-ds-bar-title{color:var(--color-foreground-primary)}.bar-title__section-trigger--expanded.sc-ds-bar-title::after,.bar-title__section-trigger--expanded.sc-ds-bar-title:hover::after{background:var(--ds-interaction-pressed)}.bar-title__section-label.sc-ds-bar-title{min-width:0;padding-inline:var(--ds-control-label-inset);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.bar-title__actions.sc-ds-bar-title{display:flex;align-items:center;gap:var(--dimension-space-100);flex:0 0 auto}.bar-title__description.sc-ds-bar-title{display:block;min-width:0;max-width:100%}.bar-title-host--compact.sc-ds-bar-title-h .bar-title.sc-ds-bar-title{height:var(--dimension-size-600);padding:var(--dimension-space-100)}.bar-title-host--compact.sc-ds-bar-title-h .bar-title.sc-ds-bar-title::after{inset-inline:0}.bar-title-host--compact.sc-ds-bar-title-h .bar-title__inner.sc-ds-bar-title{height:100%;padding:0;gap:0}.bar-title-host--compact.sc-ds-bar-title-h .bar-title__row.sc-ds-bar-title{height:100%;align-items:center}.bar-title-host--compact.sc-ds-bar-title-h .bar-title__identity.sc-ds-bar-title{height:var(--dimension-size-400)}.bar-title-host--compact.sc-ds-bar-title-h .bar-title__divider.sc-ds-bar-title{margin-inline-start:0}.bar-title-host--compact.sc-ds-bar-title-h .bar-title__heading.sc-ds-bar-title{display:inline-flex;flex:1 1 auto;align-items:center;height:var(--dimension-size-400);padding-inline:calc(var(--ds-control-padding-inline) + var(--ds-control-label-inset));box-sizing:border-box}@media (prefers-reduced-motion: reduce){.bar-title__section-trigger.sc-ds-bar-title{transition:none}}`;let _=0;const k=t(class t extends i{constructor(t){super();if(t!==false){this.__registerHost()}this.dsBack=e(this,"dsBack");this.dsBreadcrumbSelect=e(this,"dsBreadcrumbSelect");this.dsSectionChange=e(this,"dsSectionChange");this.dsAction=e(this,"dsAction");this.description="";this.showBack=false;this.backAriaLabel="Back";this.backLabel="Back";this.breadcrumbs=[];this.breadcrumbAriaLabel="Breadcrumb";this.sections=[];this.value="";this.sectionsAriaLabel="Change page section";this.primaryAction=null;this.actions=[];this.actionsAriaLabel="More page actions";this.variant="expanded";this.sectionMenuOpen=false;this.actionMenuOpen=false;this.sectionMenuInitialFocusVisible=false;this.actionMenuInitialFocusVisible=false;this.instanceId=_++;this.sectionMenuTriggerId=`bar-title-section-trigger-${this.instanceId}`;this.sectionMenuId=`bar-title-section-menu-${this.instanceId}`;this.actionMenuTriggerId=`bar-title-action-trigger-${this.instanceId}`;this.actionMenuId=`bar-title-action-menu-${this.instanceId}`;this.sectionTriggerEl=null;this.actionTriggerEl=null;this.toggleSectionMenu=t=>{this.sectionMenuInitialFocusVisible=t.detail===0;this.actionMenuOpen=false;this.sectionMenuOpen=!this.sectionMenuOpen};this.closeSectionMenu=()=>{this.sectionMenuOpen=false};this.handleSectionSelect=t=>{const i=String(t.detail?.value??"");const e=this.selectableSections.find((t=>t.id===i));if(!e||e.isInactive)return;this.closeSectionMenu();this.dsSectionChange.emit(i);requestAnimationFrame((()=>this.sectionTriggerEl?.focus()))};this.toggleActionMenu=t=>{this.actionMenuInitialFocusVisible=t.detail===0;this.sectionMenuOpen=false;this.actionMenuOpen=!this.actionMenuOpen};this.closeActionMenu=()=>{this.actionMenuOpen=false};this.handleActionSelect=t=>{const i=String(t.detail?.value??"");const e=this.primaryCollapsed&&this.primaryAction?.id===i;const s=this.selectableActions.find((t=>t.id===i));if(!e&&!s)return;if(e&&(this.primaryAction?.isInactive||this.primaryAction?.isLoading)||s?.isInactive){return}this.closeActionMenu();this.dsAction.emit(i);requestAnimationFrame((()=>void this.actionTriggerEl?.setFocus?.()))};this.handleBreadcrumbSelect=t=>{if(this.breadcrumbs.length===0){this.dsBack.emit(t.detail.originalEvent);return}const i=this.dsBreadcrumbSelect.emit(t.detail);if(i.defaultPrevented)t.preventDefault()}}componentWillLoad(){if(this.el.closest("ds-shell-page")){this.el.setAttribute("data-shell-page-syncing","")}}handleSectionsChange(){if(!this.hasSectionSelector)this.closeSectionMenu()}handleActionsChange(){if(!this.showActionMenuTrigger)this.closeActionMenu()}get compact(){return this.variant!=="expanded"}get expandedBreadcrumbItems(){if(this.breadcrumbs.length>0)return this.breadcrumbs;if(!this.showBack)return[];return[{id:"back",label:this.backLabel,ariaLabel:this.backAriaLabel}]}get backTooltipLabel(){return"Go back"}get primaryCollapsed(){return this.variant==="constrained"&&this.primaryAction!==null&&(this.primaryAction.collapse??"auto")==="auto"}get selectableSections(){return this.sections.filter((t=>!g(t)))}get hasSectionSelector(){return this.selectableSections.length>1}get effectiveValue(){return this.selectableSections.some((t=>t.id===this.value))?this.value:this.selectableSections[0]?.id??""}get selectedSectionLabel(){return this.selectableSections.find((t=>t.id===this.effectiveValue))?.label??""}get sectionTriggerAriaLabel(){return`${this.sectionsAriaLabel}. Current section: ${this.selectedSectionLabel}`}groupsFromItems(t,i){const e=[];let s=[];const r=()=>{if(s.length>0)e.push({items:s});s=[]};for(const e of t){if(g(e)){r()}else{s.push(i(e))}}r();return e}get sectionMenuSections(){return this.groupsFromItems(this.sections,(t=>({label:t.label,value:t.id,isSelected:t.id===this.effectiveValue,isInactive:t.isInactive})))}get selectableActions(){return this.actions.filter((t=>!g(t)))}get showActionMenuTrigger(){return this.selectableActions.length>0||this.primaryCollapsed&&this.primaryAction!==null}actionMenuItem(t){const i=t;return{label:t.label,value:t.id,isInactive:t.isInactive||i.isLoading,isDestructive:t.isDestructive||i.intent==="negative"}}get actionMenuSections(){const t=this.groupsFromItems(this.actions,(t=>this.actionMenuItem(t)));if(!this.primaryCollapsed||!this.primaryAction)return t;return[{items:[this.actionMenuItem(this.primaryAction)]},...t]}renderSectionSelector(){if(!this.hasSectionSelector)return null;return[s("div",{class:"bar-title__divider","aria-hidden":"true"}),s("div",{class:"bar-title__section-selector"},s("button",{ref:t=>{this.sectionTriggerEl=t??null},id:this.sectionMenuTriggerId,class:{"bar-title__section-trigger":true,"bar-title__section-trigger--expanded":this.sectionMenuOpen,"ds-control--md":true,"ds-focus-ring-inset":true,"ds-interaction-fill":true},type:"button","aria-haspopup":"menu","aria-controls":this.sectionMenuId,"aria-expanded":String(this.sectionMenuOpen),"aria-label":this.sectionTriggerAriaLabel,onClick:this.toggleSectionMenu},s("ds-text",{class:"bar-title__section-label ds-interaction-fill__content",as:"span",variant:"text-body-medium",emphasis:true,color:"primary"},this.selectedSectionLabel),s("ds-icon",{class:"bar-title__section-chevron ds-interaction-fill__content",name:"ChevronUpDown",size:"md",color:"inherit","aria-hidden":"true"})))]}renderActions(){const t=this.primaryAction;if(!t&&!this.showActionMenuTrigger)return null;return s("div",{class:"bar-title__actions"},t&&!this.primaryCollapsed?s("ds-button-filled",{class:"bar-title__primary-action",variant:t.icon?"icon-label":"label",icon:t.icon??"",label:t.label,intent:t.intent??"brand",contrast:t.contrast??"bold",size:"md",type:t.type??"button",isInactive:t.isInactive,isLoading:t.isLoading,onDsClick:()=>this.dsAction.emit(t.id)}):null,this.showActionMenuTrigger?s("ds-tooltip",{label:"Page options",side:"bottom",size:"sm"},s("ds-button-unfilled",{ref:t=>{this.actionTriggerEl=t??null},id:this.actionMenuTriggerId,class:"bar-title__more-actions",variant:"icon",icon:"Ellipses","aria-label":this.actionsAriaLabel,size:"md",activeFill:!this.compact,hasBorder:t!==null&&!this.primaryCollapsed,haspopup:"menu",controls:this.actionMenuId,expanded:this.actionMenuOpen,onDsClick:t=>this.toggleActionMenu(t.detail)})):null)}renderBreadcrumb(){const t=this.expandedBreadcrumbItems;if(t.length===0)return null;return s("ds-breadcrumb",{class:"bar-title__breadcrumb",items:t,ariaLabel:this.breadcrumbAriaLabel,onDsSelect:this.handleBreadcrumbSelect})}renderBack(){if(!this.showBack)return null;return s("ds-tooltip",{label:this.backTooltipLabel,side:"bottom",size:"sm"},s("ds-button-unfilled",{class:"bar-title__back",variant:"icon",icon:"ChevronLeft","aria-label":this.backAriaLabel,size:"md",activeFill:false,hasBorder:false,onDsClick:t=>this.dsBack.emit(t.detail)}))}render(){const t=this.compact;return s(r,{key:"cc69ad441709ca3405fa4dee48fbf2b9ad640eb3",class:{"bar-title-host--compact":t,"bar-title-host--expanded":this.variant==="expanded","bar-title-host--constrained":this.variant==="constrained","bar-title-host--has-description":!!this.description,"bar-title-host--has-back":this.showBack,"bar-title-host--has-breadcrumb":!t&&this.expandedBreadcrumbItems.length>0}},s("div",{key:"6a75519b3918baaa7e5dbd212ff0cafd03f9fbf3",class:"bar-title"},s("div",{key:"e69e698afb1df14c3fcdf8307bad49b6edf9cd10",class:"bar-title__inner"},!t?this.renderBreadcrumb():null,s("div",{key:"0384f8670212882ac255cc570d22f333ee819e75",class:"bar-title__row"},s("div",{key:"8a3c1f8b6830cdf5c21694b3d6484318bcab79fd",class:"bar-title__leading"},s("div",{key:"9589326e14e149b31a6fa396742bb7f97e0de1bf",class:"bar-title__title-row","data-shell-page-header-anchor":true},s("div",{key:"9746238eae4940a96351f14d427bf12c2cdfb038",class:"bar-title__identity"},t?this.renderBack():null,s("ds-text",{key:"eb113192c65ecbed88f04f86b57490a49c1212c7",class:"bar-title__heading ds-control--md",variant:t?"text-title-small":"text-title-medium",emphasis:true,color:"primary",as:"h1",lineTruncation:1},this.heading)),this.renderSectionSelector()),this.description&&!t?s("ds-text",{class:"bar-title__description",variant:"text-body-small",color:"secondary",lineTruncation:2,wrap:"wrap",as:"p"},this.description):null),this.renderActions()))),this.hasSectionSelector?s("ds-menu",{id:this.sectionMenuId,class:"bar-title__section-menu",anchorId:this.sectionMenuTriggerId,menuLabel:this.sectionsAriaLabel,open:this.sectionMenuOpen,initialFocusVisible:this.sectionMenuInitialFocusVisible,sections:this.sectionMenuSections,onDsClose:this.closeSectionMenu,onDsSelect:this.handleSectionSelect}):null,this.showActionMenuTrigger?s("ds-menu",{id:this.actionMenuId,class:"bar-title__action-menu",anchorId:this.actionMenuTriggerId,align:"end",menuLabel:this.actionsAriaLabel,open:this.actionMenuOpen,initialFocusVisible:this.actionMenuInitialFocusVisible,sections:this.actionMenuSections,onDsClose:this.closeActionMenu,onDsSelect:this.handleActionSelect}):null)}get el(){return this}static get watchers(){return{sections:[{handleSectionsChange:0}],actions:[{handleActionsChange:0}],primaryAction:[{handleActionsChange:0}]}}static get style(){return p()}},[2,"ds-bar-title",{heading:[1],description:[1],showBack:[4,"show-back"],backAriaLabel:[1,"back-aria-label"],backLabel:[1,"back-label"],breadcrumbs:[16],breadcrumbAriaLabel:[1,"breadcrumb-aria-label"],sections:[16],value:[1],sectionsAriaLabel:[1,"sections-aria-label"],primaryAction:[16],actions:[16],actionsAriaLabel:[1,"actions-aria-label"],variant:[1],sectionMenuOpen:[32],actionMenuOpen:[32],sectionMenuInitialFocusVisible:[32],actionMenuInitialFocusVisible:[32]},undefined,{sections:[{handleSectionsChange:0}],actions:[{handleActionsChange:0}],primaryAction:[{handleActionsChange:0}]}]);function x(){if(typeof customElements==="undefined"){return}const t=["ds-bar-title","ds-badge","ds-breadcrumb","ds-button-filled","ds-button-unfilled","ds-icon","ds-loader","ds-menu","ds-swatch-picker","ds-switch","ds-text","ds-tooltip"];t.forEach((t=>{switch(t){case"ds-bar-title":if(!customElements.get(n(t))){customElements.define(n(t),k)}break;case"ds-badge":if(!customElements.get(n(t))){a()}break;case"ds-breadcrumb":if(!customElements.get(n(t))){o()}break;case"ds-button-filled":if(!customElements.get(n(t))){c()}break;case"ds-button-unfilled":if(!customElements.get(n(t))){l()}break;case"ds-icon":if(!customElements.get(n(t))){d()}break;case"ds-loader":if(!customElements.get(n(t))){b()}break;case"ds-menu":if(!customElements.get(n(t))){h()}break;case"ds-swatch-picker":if(!customElements.get(n(t))){u()}break;case"ds-switch":if(!customElements.get(n(t))){f()}break;case"ds-text":if(!customElements.get(n(t))){m()}break;case"ds-tooltip":if(!customElements.get(n(t))){v()}break}}))}x();const w=k;const y=x;export{w as DsBarTitle,y as defineCustomElement};
|
|
2
2
|
//# sourceMappingURL=ds-bar-title.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["isBarTitleDivider","item","type","barTitleCss","nextBarTitleId","BarTitle","__stencil_proxyCustomElement","HTMLElement","constructor","registerHost","this","description","showBack","backAriaLabel","backLabel","sections","value","sectionsAriaLabel","primaryAction","actions","actionsAriaLabel","variant","mode","sectionMenuOpen","actionMenuOpen","sectionMenuInitialFocusVisible","actionMenuInitialFocusVisible","instanceId","sectionMenuTriggerId","sectionMenuId","actionMenuTriggerId","actionMenuId","sectionTriggerEl","actionTriggerEl","toggleSectionMenu","event","detail","closeSectionMenu","handleSectionSelect","id","String","selected","selectableSections","find","section","isInactive","dsSectionChange","emit","requestAnimationFrame","focus","toggleActionMenu","closeActionMenu","handleActionSelect","primaryMatches","primaryCollapsed","action","selectableActions","candidate","isLoading","dsAction","setFocus","handleSectionsChange","hasSectionSelector","handleActionsChange","showActionMenuTrigger","compact","editor","backTooltipLabel","collapse","filter","length","effectiveValue","some","selectedSectionLabel","label","sectionTriggerAriaLabel","groupsFromItems","source","map","groups","items","commit","push","sectionMenuSections","isSelected","actionMenuItem","primary","isDestructive","intent","actionMenuSections","renderSectionSelector","h","class","ref","el","onClick","as","emphasis","color","name","size","renderActions","compactEditor","side","icon","contrast","background","onDsClick","undefined","activeFill","hasBorder","haspopup","controls","expanded","renderBack","dsBack","render","Host","key","lineTruncation","heading","wrap","anchorId","menuLabel","open","initialFocusVisible","onDsClose","onDsSelect","align"],"sources":["src/wc/components/BarTitle/bar-title-types.ts","src/wc/components/BarTitle/BarTitle.css?tag=ds-bar-title&encapsulation=scoped","src/wc/components/BarTitle/BarTitle.tsx"],"sourcesContent":["import type { ButtonFilledContrast, ButtonFilledIntent } from '../ButtonFilled/ButtonFilled';\n\nexport interface BarTitleSection {\n id: string;\n label: string;\n isInactive?: boolean;\n}\n\nexport interface BarTitleDivider {\n type: 'divider';\n}\n\nexport type BarTitleSectionItem = BarTitleSection | BarTitleDivider;\n\nexport interface BarTitleAction {\n id: string;\n label: string;\n isInactive?: boolean;\n isDestructive?: boolean;\n}\n\nexport interface BarTitlePrimaryAction extends BarTitleAction {\n icon?: string;\n intent?: ButtonFilledIntent;\n contrast?: ButtonFilledContrast;\n isLoading?: boolean;\n type?: 'button' | 'submit' | 'reset';\n collapse?: BarTitlePrimaryActionCollapse;\n}\n\nexport type BarTitleActionItem = BarTitleAction | BarTitleDivider;\n\nexport type BarTitleVariant = 'expanded' | 'compact' | 'constrained';\n\nexport type BarTitleMode = 'default' | 'editor';\n\nexport type BarTitlePrimaryActionCollapse = 'auto' | 'never';\n\nexport function isBarTitleDivider(\n item: BarTitleSectionItem | BarTitleActionItem\n): item is BarTitleDivider {\n return 'type' in item && item.type === 'divider';\n}\n","@import '../../utils/control-density.css';\n@import '../../utils/focus-ring.css';\n@import '../../utils/interaction-fill.css';\n\n:host {\n display: block;\n min-width: 0;\n box-sizing: border-box;\n background: var(--color-background-primary);\n}\n\n:host([data-shell-page-syncing]) {\n visibility: hidden;\n}\n\n.bar-title {\n position: relative;\n min-width: 0;\n padding: 0;\n box-sizing: border-box;\n background: var(--color-background-primary);\n}\n\n:host(.bar-title-host--editor),\n:host(.bar-title-host--editor) .bar-title {\n background: var(--color-background-bold-brand);\n}\n\n.bar-title::after {\n content: '';\n position: absolute;\n inset: auto var(--dimension-space-400) 0;\n height: var(--dimension-stroke-width-012);\n background: var(--color-border-tertiary);\n pointer-events: none;\n}\n\n:host(.bar-title-host--editor) .bar-title::after {\n display: none;\n}\n\n.bar-title__inner {\n position: relative;\n display: flex;\n flex-direction: column;\n align-items: stretch;\n gap: var(--dimension-space-100);\n padding: var(--dimension-space-400);\n box-sizing: border-box;\n}\n\n.bar-title__row {\n display: flex;\n align-items: flex-start;\n justify-content: space-between;\n gap: var(--dimension-space-100);\n min-height: var(--dimension-size-400);\n min-width: 0;\n}\n\n:host(.bar-title-host--expanded) .bar-title__row {\n gap: var(--dimension-space-400);\n}\n\n.bar-title__leading {\n display: flex;\n flex: 1 1 auto;\n flex-direction: column;\n gap: var(--dimension-space-050);\n min-width: 0;\n}\n\n/*\n * Pull the whole leading block up by exactly the breadcrumb row's own box\n * (its xs control-height + its top margin + the row-gap below it), so the\n * title row lands flush with the actions' top without moving actions.\n * Tied to the same tokens that size the breadcrumb, not a guessed pixel value.\n */\n:host(.bar-title-host--expanded.bar-title-host--has-back) .bar-title__leading {\n margin-block-start: calc(-1 * (var(--dimension-size-200) + var(--dimension-space-050) * 2));\n}\n\n.bar-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}\n\n.bar-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}\n\n.bar-title__back,\n.bar-title__breadcrumb-back,\n.bar-title__section-chevron {\n flex: 0 0 auto;\n}\n\n.bar-title__breadcrumb,\n.bar-title__exit {\n display: flex;\n align-items: center;\n min-width: 0;\n margin-block-start: var(--dimension-space-050);\n}\n\n.bar-title__heading {\n display: block;\n width: auto;\n min-width: 0;\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n user-select: none;\n}\n\n.bar-title__divider {\n width: var(--dimension-stroke-width-012);\n height: var(--dimension-size-250);\n margin-inline-start: var(--dimension-space-100);\n flex: 0 0 var(--dimension-stroke-width-012);\n background: var(--color-border-tertiary);\n}\n\n.bar-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-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: pointer;\n font-family: inherit;\n user-select: none;\n transition: color var(--effect-motion-short-2);\n}\n\n.bar-title__section-trigger--expanded {\n color: var(--color-foreground-primary);\n}\n\n:host(.bar-title-host--editor) .bar-title__divider {\n background: var(--color-border-on-bold-background-tertiary);\n}\n\n:host(.bar-title-host--editor) .bar-title__section-trigger {\n color: var(--color-foreground-on-bold-background-secondary);\n}\n\n:host(.bar-title-host--editor) .bar-title__section-trigger--expanded {\n color: var(--color-foreground-on-bold-background-primary);\n}\n\n.bar-title__section-trigger--expanded::after,\n.bar-title__section-trigger--expanded:hover::after {\n background: var(--ds-interaction-pressed);\n}\n\n.bar-title__section-label {\n min-width: 0;\n padding-inline: var(--ds-control-label-inset);\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n}\n\n.bar-title__actions {\n display: flex;\n align-items: center;\n gap: var(--dimension-space-100);\n flex: 0 0 auto;\n}\n\n.bar-title__description {\n display: block;\n min-width: 0;\n max-width: 100%;\n}\n\n:host(.bar-title-host--compact) .bar-title {\n height: var(--dimension-size-600);\n padding: var(--dimension-space-100);\n}\n\n:host(.bar-title-host--compact) .bar-title::after {\n inset-inline: 0;\n}\n\n:host(.bar-title-host--compact) .bar-title__inner {\n height: 100%;\n padding: 0;\n gap: 0;\n}\n\n:host(.bar-title-host--compact) .bar-title__row {\n height: 100%;\n align-items: center;\n}\n\n:host(.bar-title-host--compact) .bar-title__identity {\n height: var(--dimension-size-400);\n}\n\n:host(.bar-title-host--compact) .bar-title__divider {\n margin-inline-start: 0;\n}\n\n:host(.bar-title-host--compact) .bar-title__heading {\n display: inline-flex;\n flex: 1 1 auto;\n align-items: center;\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}\n\n@media (prefers-reduced-motion: reduce) {\n .bar-title__section-trigger {\n transition: none;\n }\n}\n","import { Component, Event, EventEmitter, h, Host, Prop, State, Watch } from '@stencil/core';\nimport type { MenuItemData, MenuSection } from '../Menu/menu-types';\nimport {\n isBarTitleDivider,\n type BarTitleAction,\n type BarTitleActionItem,\n type BarTitleMode,\n type BarTitlePrimaryAction,\n type BarTitleSection,\n type BarTitleSectionItem,\n type BarTitleVariant,\n} from './bar-title-types';\n\nlet nextBarTitleId = 0;\n\ntype FocusableButton = HTMLElement & { setFocus?: () => Promise<void> };\n\n@Component({\n tag: 'ds-bar-title',\n styleUrl: 'BarTitle.css',\n scoped: true,\n})\nexport class BarTitle {\n /** The page's single visible h1. */\n @Prop() heading!: string;\n\n /** Optional supporting copy shown in the expanded presentation. */\n @Prop() description: 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 /** Visible parent-page label used by the expanded Back breadcrumb. */\n @Prop() backLabel: string = 'Back';\n\n /** Optional page sections exposed through the active-section menu. */\n @Prop() sections: BarTitleSectionItem[] = [];\n\n /** Id of the active page section. */\n @Prop() value: string = '';\n\n /** Accessible name for the page-section 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 /** Accessible name for the page-actions menu. */\n @Prop() actionsAriaLabel: string = 'More page actions';\n\n /** Explicit visual/capacity variant. ShellPage owns automatic selection. */\n @Prop() variant: BarTitleVariant = 'expanded';\n\n /** Semantic page-header treatment. Editor mode uses bold-brand create/edit chrome. */\n @Prop() mode: BarTitleMode = 'default';\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 actionMenuOpen = false;\n @State() private sectionMenuInitialFocusVisible = false;\n @State() private actionMenuInitialFocusVisible = false;\n\n private readonly instanceId = nextBarTitleId++;\n private readonly sectionMenuTriggerId = `bar-title-section-trigger-${this.instanceId}`;\n private readonly sectionMenuId = `bar-title-section-menu-${this.instanceId}`;\n private readonly actionMenuTriggerId = `bar-title-action-trigger-${this.instanceId}`;\n private readonly actionMenuId = `bar-title-action-menu-${this.instanceId}`;\n private sectionTriggerEl: HTMLButtonElement | null = null;\n private actionTriggerEl: FocusableButton | null = null;\n\n @Watch('sections')\n handleSectionsChange() {\n if (!this.hasSectionSelector) this.closeSectionMenu();\n }\n\n @Watch('actions')\n @Watch('primaryAction')\n handleActionsChange() {\n if (!this.showActionMenuTrigger) this.closeActionMenu();\n }\n\n private get compact(): boolean {\n return this.variant !== 'expanded';\n }\n\n private get editor(): boolean {\n return this.mode === 'editor';\n }\n\n /** Tooltip copy is fixed and generic; backAriaLabel/actionsAriaLabel stay page-specific. */\n private get backTooltipLabel(): string {\n return this.editor ? 'Exit' : 'Go back';\n }\n\n private get primaryCollapsed(): boolean {\n return (\n !this.editor &&\n this.variant === 'constrained' &&\n this.primaryAction !== null &&\n (this.primaryAction.collapse ?? 'auto') === 'auto'\n );\n }\n\n private get selectableSections(): BarTitleSection[] {\n return this.sections.filter((item): item is BarTitleSection => !isBarTitleDivider(item));\n }\n\n private get hasSectionSelector(): boolean {\n return this.selectableSections.length > 1;\n }\n\n private get effectiveValue(): string {\n return this.selectableSections.some(section => section.id === this.value)\n ? this.value\n : (this.selectableSections[0]?.id ?? '');\n }\n\n private get selectedSectionLabel(): string {\n return this.selectableSections.find(section => section.id === this.effectiveValue)?.label ?? '';\n }\n\n private get sectionTriggerAriaLabel(): string {\n return `${this.sectionsAriaLabel}. Current section: ${this.selectedSectionLabel}`;\n }\n\n private groupsFromItems<T extends BarTitleSection | BarTitleAction>(\n source: Array<T | { type: 'divider' }>,\n map: (item: T) => MenuItemData\n ): MenuSection[] {\n const groups: MenuSection[] = [];\n let items: MenuItemData[] = [];\n const commit = () => {\n if (items.length > 0) groups.push({ items });\n items = [];\n };\n\n for (const item of source) {\n if (isBarTitleDivider(item)) {\n commit();\n } else {\n items.push(map(item));\n }\n }\n commit();\n return groups;\n }\n\n private get sectionMenuSections(): MenuSection[] {\n return this.groupsFromItems(this.sections, section => ({\n label: section.label,\n value: section.id,\n isSelected: section.id === this.effectiveValue,\n isInactive: section.isInactive,\n }));\n }\n\n private get selectableActions(): BarTitleAction[] {\n return this.actions.filter((item): item is BarTitleAction => !isBarTitleDivider(item));\n }\n\n private get showActionMenuTrigger(): boolean {\n return (\n this.selectableActions.length > 0 || (this.primaryCollapsed && this.primaryAction !== null)\n );\n }\n\n private actionMenuItem(action: BarTitleAction | BarTitlePrimaryAction): MenuItemData {\n const primary = action as BarTitlePrimaryAction;\n return {\n label: action.label,\n value: action.id,\n isInactive: action.isInactive || primary.isLoading,\n isDestructive: action.isDestructive || primary.intent === 'negative',\n };\n }\n\n private get actionMenuSections(): MenuSection[] {\n const groups = this.groupsFromItems(this.actions, action => this.actionMenuItem(action));\n if (!this.primaryCollapsed || !this.primaryAction) return groups;\n return [{ items: [this.actionMenuItem(this.primaryAction)] }, ...groups];\n }\n\n private toggleSectionMenu = (event: MouseEvent) => {\n this.sectionMenuInitialFocusVisible = event.detail === 0;\n this.actionMenuOpen = false;\n this.sectionMenuOpen = !this.sectionMenuOpen;\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 const selected = this.selectableSections.find(section => section.id === id);\n if (!selected || selected.isInactive) return;\n this.closeSectionMenu();\n this.dsSectionChange.emit(id);\n requestAnimationFrame(() => this.sectionTriggerEl?.focus());\n };\n\n private toggleActionMenu = (event: MouseEvent) => {\n this.actionMenuInitialFocusVisible = event.detail === 0;\n this.sectionMenuOpen = false;\n this.actionMenuOpen = !this.actionMenuOpen;\n };\n\n private closeActionMenu = () => {\n this.actionMenuOpen = false;\n };\n\n private handleActionSelect = (event: CustomEvent<MenuItemData>) => {\n const id = String(event.detail?.value ?? '');\n const primaryMatches = this.primaryCollapsed && this.primaryAction?.id === id;\n const action = this.selectableActions.find(candidate => candidate.id === id);\n if (!primaryMatches && !action) return;\n if (\n (primaryMatches && (this.primaryAction?.isInactive || this.primaryAction?.isLoading)) ||\n action?.isInactive\n ) {\n return;\n }\n this.closeActionMenu();\n this.dsAction.emit(id);\n requestAnimationFrame(() => void this.actionTriggerEl?.setFocus?.());\n };\n\n private renderSectionSelector() {\n if (!this.hasSectionSelector) return null;\n return [\n <div class=\"bar-title__divider\" aria-hidden=\"true\" />,\n <div class=\"bar-title__section-selector\">\n <button\n ref={el => {\n this.sectionTriggerEl = el ?? null;\n }}\n id={this.sectionMenuTriggerId}\n class={{\n 'bar-title__section-trigger': true,\n 'bar-title__section-trigger--expanded': this.sectionMenuOpen,\n 'ds-control--md': true,\n 'ds-focus-ring-inset': true,\n 'ds-interaction-fill': true,\n 'ds-interaction-fill--on-bold': this.editor,\n }}\n type=\"button\"\n aria-haspopup=\"menu\"\n aria-controls={this.sectionMenuId}\n aria-expanded={String(this.sectionMenuOpen)}\n aria-label={this.sectionTriggerAriaLabel}\n onClick={this.toggleSectionMenu}\n >\n <ds-text\n class=\"bar-title__section-label ds-interaction-fill__content\"\n as=\"span\"\n variant=\"text-body-medium\"\n emphasis\n color={this.editor ? 'on-bold' : 'primary'}\n >\n {this.selectedSectionLabel}\n </ds-text>\n <ds-icon\n class=\"bar-title__section-chevron ds-interaction-fill__content\"\n name=\"ChevronUpDown\"\n size=\"md\"\n color=\"inherit\"\n aria-hidden=\"true\"\n />\n </button>\n </div>,\n ];\n }\n\n private renderActions() {\n const primary = this.primaryAction;\n const compactEditor = this.editor && this.compact;\n if (!primary && !this.showActionMenuTrigger) return null;\n\n return (\n <div class=\"bar-title__actions\">\n {primary && !this.primaryCollapsed ? (\n compactEditor ? (\n <ds-tooltip label={primary.label} side=\"bottom\" size=\"sm\">\n <ds-button-filled\n class=\"bar-title__primary-action\"\n variant=\"icon\"\n icon=\"Check\"\n label={primary.label}\n aria-label={primary.label}\n intent=\"brand\"\n contrast=\"faint\"\n background=\"bold\"\n size=\"md\"\n type={primary.type ?? 'button'}\n isInactive={primary.isInactive}\n isLoading={primary.isLoading}\n onDsClick={() => this.dsAction.emit(primary.id)}\n />\n </ds-tooltip>\n ) : (\n <ds-button-filled\n class=\"bar-title__primary-action\"\n variant={primary.icon ? 'icon-label' : 'label'}\n icon={primary.icon ?? ''}\n label={primary.label}\n intent={this.editor ? 'brand' : (primary.intent ?? 'brand')}\n contrast={this.editor ? 'faint' : (primary.contrast ?? 'bold')}\n background={this.editor ? 'bold' : undefined}\n size=\"md\"\n type={primary.type ?? 'button'}\n isInactive={primary.isInactive}\n isLoading={primary.isLoading}\n onDsClick={() => this.dsAction.emit(primary.id)}\n />\n )\n ) : null}\n {this.showActionMenuTrigger ? (\n <ds-tooltip label=\"Page options\" side=\"bottom\" size=\"sm\">\n <ds-button-unfilled\n ref={el => {\n this.actionTriggerEl = el ?? null;\n }}\n id={this.actionMenuTriggerId}\n class=\"bar-title__more-actions\"\n variant=\"icon\"\n icon=\"Ellipses\"\n aria-label={this.actionsAriaLabel}\n size=\"md\"\n background={this.editor ? 'bold' : undefined}\n activeFill={!this.compact && !this.editor}\n hasBorder={!this.compact && !this.primaryCollapsed && !this.editor}\n haspopup=\"menu\"\n controls={this.actionMenuId}\n expanded={this.actionMenuOpen}\n onDsClick={(event: CustomEvent<MouseEvent>) => this.toggleActionMenu(event.detail)}\n />\n </ds-tooltip>\n ) : null}\n </div>\n );\n }\n\n private renderBack(compact: boolean) {\n if (!this.showBack) return null;\n\n if (!compact) {\n if (this.editor) {\n return (\n <div class=\"bar-title__exit\">\n <ds-button-unfilled\n class=\"bar-title__exit-action\"\n variant=\"icon-label\"\n icon=\"Cross\"\n label={this.backLabel}\n aria-label={this.backAriaLabel}\n size=\"xs\"\n background=\"bold\"\n activeFill={false}\n hasBorder={false}\n onDsClick={(event: CustomEvent<MouseEvent>) => this.dsBack.emit(event.detail)}\n />\n </div>\n );\n }\n\n return (\n <div class=\"bar-title__breadcrumb\">\n <ds-button-unfilled\n class=\"bar-title__breadcrumb-back\"\n variant=\"icon-label\"\n icon=\"ChevronLeft\"\n label={this.backLabel}\n aria-label={this.backAriaLabel}\n size=\"xs\"\n hasBorder={false}\n onDsClick={(event: CustomEvent<MouseEvent>) => this.dsBack.emit(event.detail)}\n />\n </div>\n );\n }\n\n return (\n <ds-tooltip label={this.backTooltipLabel} side=\"bottom\" size=\"sm\">\n <ds-button-unfilled\n class=\"bar-title__back\"\n variant=\"icon\"\n icon={this.editor ? 'Cross' : 'ChevronLeft'}\n aria-label={this.backAriaLabel}\n size=\"md\"\n background={this.editor ? 'bold' : undefined}\n activeFill={false}\n hasBorder={false}\n onDsClick={(event: CustomEvent<MouseEvent>) => this.dsBack.emit(event.detail)}\n />\n </ds-tooltip>\n );\n }\n\n render() {\n const compact = this.compact;\n return (\n <Host\n class={{\n 'bar-title-host--compact': compact,\n 'bar-title-host--expanded': this.variant === 'expanded',\n 'bar-title-host--constrained': this.variant === 'constrained',\n 'bar-title-host--editor': this.editor,\n 'bar-title-host--has-description': !!this.description,\n 'bar-title-host--has-back': this.showBack,\n }}\n >\n <div class=\"bar-title\">\n <div class=\"bar-title__inner\">\n <div class=\"bar-title__row\">\n <div class=\"bar-title__leading\">\n {!compact ? this.renderBack(false) : null}\n <div class=\"bar-title__title-row\">\n <div class=\"bar-title__identity\">\n {compact ? this.renderBack(true) : null}\n <ds-text\n class=\"bar-title__heading ds-control--md\"\n variant={compact ? 'text-title-small' : 'text-title-medium'}\n emphasis\n color={this.editor ? 'on-bold' : 'primary'}\n as=\"h1\"\n lineTruncation={1}\n >\n {this.heading}\n </ds-text>\n </div>\n {this.renderSectionSelector()}\n </div>\n {this.description && !compact ? (\n <ds-text\n class=\"bar-title__description\"\n variant=\"text-body-small\"\n color={\n this.editor\n ? 'var(--color-foreground-on-bold-background-secondary)'\n : 'secondary'\n }\n lineTruncation={2}\n wrap=\"wrap\"\n as=\"p\"\n >\n {this.description}\n </ds-text>\n ) : null}\n </div>\n {this.renderActions()}\n </div>\n </div>\n </div>\n\n {this.hasSectionSelector ? (\n <ds-menu\n id={this.sectionMenuId}\n class=\"bar-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 onDsSelect={this.handleSectionSelect}\n />\n ) : null}\n\n {this.showActionMenuTrigger ? (\n <ds-menu\n id={this.actionMenuId}\n class=\"bar-title__action-menu\"\n anchorId={this.actionMenuTriggerId}\n align=\"end\"\n menuLabel={this.actionsAriaLabel}\n open={this.actionMenuOpen}\n initialFocusVisible={this.actionMenuInitialFocusVisible}\n sections={this.actionMenuSections}\n onDsClose={this.closeActionMenu}\n onDsSelect={this.handleActionSelect}\n />\n ) : null}\n </Host>\n );\n }\n}\n"],"mappings":"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","ignoreList":[]}
|
|
1
|
+
{"version":3,"names":["isBarTitleDivider","item","type","barTitleCss","nextBarTitleId","BarTitle","__stencil_proxyCustomElement","HTMLElement","constructor","registerHost","this","description","showBack","backAriaLabel","backLabel","breadcrumbs","breadcrumbAriaLabel","sections","value","sectionsAriaLabel","primaryAction","actions","actionsAriaLabel","variant","sectionMenuOpen","actionMenuOpen","sectionMenuInitialFocusVisible","actionMenuInitialFocusVisible","instanceId","sectionMenuTriggerId","sectionMenuId","actionMenuTriggerId","actionMenuId","sectionTriggerEl","actionTriggerEl","toggleSectionMenu","event","detail","closeSectionMenu","handleSectionSelect","id","String","selected","selectableSections","find","section","isInactive","dsSectionChange","emit","requestAnimationFrame","focus","toggleActionMenu","closeActionMenu","handleActionSelect","primaryMatches","primaryCollapsed","action","selectableActions","candidate","isLoading","dsAction","setFocus","handleBreadcrumbSelect","length","dsBack","originalEvent","forwarded","dsBreadcrumbSelect","defaultPrevented","preventDefault","componentWillLoad","el","closest","setAttribute","handleSectionsChange","hasSectionSelector","handleActionsChange","showActionMenuTrigger","compact","expandedBreadcrumbItems","label","ariaLabel","backTooltipLabel","collapse","filter","effectiveValue","some","selectedSectionLabel","sectionTriggerAriaLabel","groupsFromItems","source","map","groups","items","commit","push","sectionMenuSections","isSelected","actionMenuItem","primary","isDestructive","intent","actionMenuSections","renderSectionSelector","h","class","ref","onClick","as","emphasis","color","name","size","renderActions","icon","contrast","onDsClick","side","activeFill","hasBorder","haspopup","controls","expanded","renderBreadcrumb","onDsSelect","renderBack","render","Host","key","lineTruncation","heading","wrap","anchorId","menuLabel","open","initialFocusVisible","onDsClose","align"],"sources":["src/wc/components/BarTitle/bar-title-types.ts","src/wc/components/BarTitle/BarTitle.css?tag=ds-bar-title&encapsulation=scoped","src/wc/components/BarTitle/BarTitle.tsx"],"sourcesContent":["import type { ButtonFilledContrast, ButtonFilledIntent } from '../ButtonFilled/ButtonFilled';\n\nexport interface BarTitleSection {\n id: string;\n label: string;\n isInactive?: boolean;\n}\n\nexport interface BarTitleDivider {\n type: 'divider';\n}\n\nexport type BarTitleSectionItem = BarTitleSection | BarTitleDivider;\n\nexport interface BarTitleAction {\n id: string;\n label: string;\n isInactive?: boolean;\n isDestructive?: boolean;\n}\n\nexport interface BarTitlePrimaryAction extends BarTitleAction {\n icon?: string;\n intent?: ButtonFilledIntent;\n contrast?: ButtonFilledContrast;\n isLoading?: boolean;\n type?: 'button' | 'submit' | 'reset';\n collapse?: BarTitlePrimaryActionCollapse;\n}\n\nexport type BarTitleActionItem = BarTitleAction | BarTitleDivider;\n\nexport type BarTitleVariant = 'expanded' | 'compact' | 'constrained';\n\nexport type BarTitlePrimaryActionCollapse = 'auto' | 'never';\n\nexport function isBarTitleDivider(\n item: BarTitleSectionItem | BarTitleActionItem\n): item is BarTitleDivider {\n return 'type' in item && item.type === 'divider';\n}\n","@import '../../utils/control-density.css';\n@import '../../utils/focus-ring.css';\n@import '../../utils/interaction-fill.css';\n\n:host {\n display: block;\n min-width: 0;\n box-sizing: border-box;\n background: var(--color-background-primary);\n}\n\n:host([data-shell-page-syncing]) {\n visibility: hidden;\n}\n\n.bar-title {\n position: relative;\n min-width: 0;\n padding: 0;\n box-sizing: border-box;\n background: var(--color-background-primary);\n}\n\n.bar-title::after {\n content: '';\n position: absolute;\n inset: auto var(--dimension-space-400) 0;\n height: var(--dimension-stroke-width-012);\n background: var(--color-border-tertiary);\n pointer-events: none;\n}\n\n.bar-title__inner {\n position: relative;\n display: flex;\n flex-direction: column;\n align-items: stretch;\n gap: var(--dimension-space-100);\n padding: var(--dimension-space-400);\n box-sizing: border-box;\n}\n\n.bar-title__row {\n display: flex;\n align-items: flex-start;\n justify-content: space-between;\n gap: var(--dimension-space-100);\n min-height: var(--dimension-size-400);\n min-width: 0;\n}\n\n:host(.bar-title-host--expanded) .bar-title__row {\n gap: var(--dimension-space-400);\n}\n\n.bar-title__leading {\n display: flex;\n flex: 1 1 auto;\n flex-direction: column;\n gap: var(--dimension-space-100);\n min-width: 0;\n}\n\n.bar-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}\n\n.bar-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}\n\n.bar-title__back,\n.bar-title__section-chevron {\n flex: 0 0 auto;\n}\n\n.bar-title__breadcrumb {\n display: block;\n width: 100%;\n min-width: 0;\n}\n\n.bar-title__heading {\n display: block;\n width: auto;\n min-width: 0;\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n user-select: none;\n}\n\n.bar-title__divider {\n width: var(--dimension-stroke-width-012);\n height: var(--dimension-size-250);\n margin-inline-start: var(--dimension-space-100);\n flex: 0 0 var(--dimension-stroke-width-012);\n background: var(--color-border-tertiary);\n}\n\n.bar-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-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: pointer;\n font-family: inherit;\n user-select: none;\n transition: color var(--effect-motion-short-2);\n}\n\n.bar-title__section-trigger--expanded {\n color: var(--color-foreground-primary);\n}\n\n.bar-title__section-trigger--expanded::after,\n.bar-title__section-trigger--expanded:hover::after {\n background: var(--ds-interaction-pressed);\n}\n\n.bar-title__section-label {\n min-width: 0;\n padding-inline: var(--ds-control-label-inset);\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n}\n\n.bar-title__actions {\n display: flex;\n align-items: center;\n gap: var(--dimension-space-100);\n flex: 0 0 auto;\n}\n\n.bar-title__description {\n display: block;\n min-width: 0;\n max-width: 100%;\n}\n\n:host(.bar-title-host--compact) .bar-title {\n height: var(--dimension-size-600);\n padding: var(--dimension-space-100);\n}\n\n:host(.bar-title-host--compact) .bar-title::after {\n inset-inline: 0;\n}\n\n:host(.bar-title-host--compact) .bar-title__inner {\n height: 100%;\n padding: 0;\n gap: 0;\n}\n\n:host(.bar-title-host--compact) .bar-title__row {\n height: 100%;\n align-items: center;\n}\n\n:host(.bar-title-host--compact) .bar-title__identity {\n height: var(--dimension-size-400);\n}\n\n:host(.bar-title-host--compact) .bar-title__divider {\n margin-inline-start: 0;\n}\n\n:host(.bar-title-host--compact) .bar-title__heading {\n display: inline-flex;\n flex: 1 1 auto;\n align-items: center;\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}\n\n@media (prefers-reduced-motion: reduce) {\n .bar-title__section-trigger {\n transition: none;\n }\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 type { BreadcrumbItem, BreadcrumbSelectDetail } from '../Breadcrumb/breadcrumb-types';\nimport type { MenuItemData, MenuSection } from '../Menu/menu-types';\nimport {\n isBarTitleDivider,\n type BarTitleAction,\n type BarTitleActionItem,\n type BarTitlePrimaryAction,\n type BarTitleSection,\n type BarTitleSectionItem,\n type BarTitleVariant,\n} from './bar-title-types';\n\nlet nextBarTitleId = 0;\n\ntype FocusableButton = HTMLElement & { setFocus?: () => Promise<void> };\n\n@Component({\n tag: 'ds-bar-title',\n styleUrl: 'BarTitle.css',\n scoped: true,\n})\nexport class BarTitle {\n @Element() el!: HTMLElement;\n\n /** The page's single visible h1. */\n @Prop() heading!: string;\n\n /** Optional supporting copy shown in the expanded presentation. */\n @Prop() description: 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 /** Visible parent-page label used by the expanded breadcrumb when breadcrumbs is empty. */\n @Prop() backLabel: string = 'Back';\n\n /** Optional expanded ancestor path. Compact variants continue to use the Back action. */\n @Prop() breadcrumbs: BreadcrumbItem[] = [];\n\n /** Accessible name for the expanded breadcrumb navigation landmark. */\n @Prop() breadcrumbAriaLabel: string = 'Breadcrumb';\n\n /** Optional page sections exposed through the active-section menu. */\n @Prop() sections: BarTitleSectionItem[] = [];\n\n /** Id of the active page section. */\n @Prop() value: string = '';\n\n /** Accessible name for the page-section 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 /** Accessible name for the page-actions menu. */\n @Prop() actionsAriaLabel: string = 'More page actions';\n\n /** Explicit visual/capacity variant. ShellPage owns automatic selection. */\n @Prop() variant: BarTitleVariant = 'expanded';\n\n /** Emitted when the leading Back action is activated. */\n @Event() dsBack!: EventEmitter<MouseEvent>;\n\n /** Emitted when an authored expanded breadcrumb item is activated. */\n @Event({ cancelable: true }) dsBreadcrumbSelect!: EventEmitter<BreadcrumbSelectDetail>;\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 actionMenuOpen = false;\n @State() private sectionMenuInitialFocusVisible = false;\n @State() private actionMenuInitialFocusVisible = false;\n\n private readonly instanceId = nextBarTitleId++;\n private readonly sectionMenuTriggerId = `bar-title-section-trigger-${this.instanceId}`;\n private readonly sectionMenuId = `bar-title-section-menu-${this.instanceId}`;\n private readonly actionMenuTriggerId = `bar-title-action-trigger-${this.instanceId}`;\n private readonly actionMenuId = `bar-title-action-menu-${this.instanceId}`;\n private sectionTriggerEl: HTMLButtonElement | null = null;\n private actionTriggerEl: FocusableButton | null = null;\n\n componentWillLoad() {\n if (this.el.closest('ds-shell-page')) {\n this.el.setAttribute('data-shell-page-syncing', '');\n }\n }\n\n @Watch('sections')\n handleSectionsChange() {\n if (!this.hasSectionSelector) this.closeSectionMenu();\n }\n\n @Watch('actions')\n @Watch('primaryAction')\n handleActionsChange() {\n if (!this.showActionMenuTrigger) this.closeActionMenu();\n }\n\n private get compact(): boolean {\n return this.variant !== 'expanded';\n }\n\n private get expandedBreadcrumbItems(): BreadcrumbItem[] {\n if (this.breadcrumbs.length > 0) return this.breadcrumbs;\n if (!this.showBack) return [];\n return [\n {\n id: 'back',\n label: this.backLabel,\n ariaLabel: this.backAriaLabel,\n },\n ];\n }\n\n /** Tooltip copy is fixed and generic; backAriaLabel/actionsAriaLabel stay page-specific. */\n private get backTooltipLabel(): string {\n return 'Go back';\n }\n\n private get primaryCollapsed(): boolean {\n return (\n this.variant === 'constrained' &&\n this.primaryAction !== null &&\n (this.primaryAction.collapse ?? 'auto') === 'auto'\n );\n }\n\n private get selectableSections(): BarTitleSection[] {\n return this.sections.filter((item): item is BarTitleSection => !isBarTitleDivider(item));\n }\n\n private get hasSectionSelector(): boolean {\n return this.selectableSections.length > 1;\n }\n\n private get effectiveValue(): string {\n return this.selectableSections.some(section => section.id === this.value)\n ? this.value\n : (this.selectableSections[0]?.id ?? '');\n }\n\n private get selectedSectionLabel(): string {\n return this.selectableSections.find(section => section.id === this.effectiveValue)?.label ?? '';\n }\n\n private get sectionTriggerAriaLabel(): string {\n return `${this.sectionsAriaLabel}. Current section: ${this.selectedSectionLabel}`;\n }\n\n private groupsFromItems<T extends BarTitleSection | BarTitleAction>(\n source: Array<T | { type: 'divider' }>,\n map: (item: T) => MenuItemData\n ): MenuSection[] {\n const groups: MenuSection[] = [];\n let items: MenuItemData[] = [];\n const commit = () => {\n if (items.length > 0) groups.push({ items });\n items = [];\n };\n\n for (const item of source) {\n if (isBarTitleDivider(item)) {\n commit();\n } else {\n items.push(map(item));\n }\n }\n commit();\n return groups;\n }\n\n private get sectionMenuSections(): MenuSection[] {\n return this.groupsFromItems(this.sections, section => ({\n label: section.label,\n value: section.id,\n isSelected: section.id === this.effectiveValue,\n isInactive: section.isInactive,\n }));\n }\n\n private get selectableActions(): BarTitleAction[] {\n return this.actions.filter((item): item is BarTitleAction => !isBarTitleDivider(item));\n }\n\n private get showActionMenuTrigger(): boolean {\n return (\n this.selectableActions.length > 0 || (this.primaryCollapsed && this.primaryAction !== null)\n );\n }\n\n private actionMenuItem(action: BarTitleAction | BarTitlePrimaryAction): MenuItemData {\n const primary = action as BarTitlePrimaryAction;\n return {\n label: action.label,\n value: action.id,\n isInactive: action.isInactive || primary.isLoading,\n isDestructive: action.isDestructive || primary.intent === 'negative',\n };\n }\n\n private get actionMenuSections(): MenuSection[] {\n const groups = this.groupsFromItems(this.actions, action => this.actionMenuItem(action));\n if (!this.primaryCollapsed || !this.primaryAction) return groups;\n return [{ items: [this.actionMenuItem(this.primaryAction)] }, ...groups];\n }\n\n private toggleSectionMenu = (event: MouseEvent) => {\n this.sectionMenuInitialFocusVisible = event.detail === 0;\n this.actionMenuOpen = false;\n this.sectionMenuOpen = !this.sectionMenuOpen;\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 const selected = this.selectableSections.find(section => section.id === id);\n if (!selected || selected.isInactive) return;\n this.closeSectionMenu();\n this.dsSectionChange.emit(id);\n requestAnimationFrame(() => this.sectionTriggerEl?.focus());\n };\n\n private toggleActionMenu = (event: MouseEvent) => {\n this.actionMenuInitialFocusVisible = event.detail === 0;\n this.sectionMenuOpen = false;\n this.actionMenuOpen = !this.actionMenuOpen;\n };\n\n private closeActionMenu = () => {\n this.actionMenuOpen = false;\n };\n\n private handleActionSelect = (event: CustomEvent<MenuItemData>) => {\n const id = String(event.detail?.value ?? '');\n const primaryMatches = this.primaryCollapsed && this.primaryAction?.id === id;\n const action = this.selectableActions.find(candidate => candidate.id === id);\n if (!primaryMatches && !action) return;\n if (\n (primaryMatches && (this.primaryAction?.isInactive || this.primaryAction?.isLoading)) ||\n action?.isInactive\n ) {\n return;\n }\n this.closeActionMenu();\n this.dsAction.emit(id);\n requestAnimationFrame(() => void this.actionTriggerEl?.setFocus?.());\n };\n\n private renderSectionSelector() {\n if (!this.hasSectionSelector) return null;\n return [\n <div class=\"bar-title__divider\" aria-hidden=\"true\" />,\n <div class=\"bar-title__section-selector\">\n <button\n ref={el => {\n this.sectionTriggerEl = el ?? null;\n }}\n id={this.sectionMenuTriggerId}\n class={{\n 'bar-title__section-trigger': true,\n 'bar-title__section-trigger--expanded': this.sectionMenuOpen,\n 'ds-control--md': true,\n 'ds-focus-ring-inset': true,\n 'ds-interaction-fill': true,\n }}\n type=\"button\"\n aria-haspopup=\"menu\"\n aria-controls={this.sectionMenuId}\n aria-expanded={String(this.sectionMenuOpen)}\n aria-label={this.sectionTriggerAriaLabel}\n onClick={this.toggleSectionMenu}\n >\n <ds-text\n class=\"bar-title__section-label ds-interaction-fill__content\"\n as=\"span\"\n variant=\"text-body-medium\"\n emphasis\n color=\"primary\"\n >\n {this.selectedSectionLabel}\n </ds-text>\n <ds-icon\n class=\"bar-title__section-chevron ds-interaction-fill__content\"\n name=\"ChevronUpDown\"\n size=\"md\"\n color=\"inherit\"\n aria-hidden=\"true\"\n />\n </button>\n </div>,\n ];\n }\n\n private renderActions() {\n const primary = this.primaryAction;\n if (!primary && !this.showActionMenuTrigger) return null;\n\n return (\n <div class=\"bar-title__actions\">\n {primary && !this.primaryCollapsed ? (\n <ds-button-filled\n class=\"bar-title__primary-action\"\n variant={primary.icon ? 'icon-label' : 'label'}\n icon={primary.icon ?? ''}\n label={primary.label}\n intent={primary.intent ?? 'brand'}\n contrast={primary.contrast ?? 'bold'}\n size=\"md\"\n type={primary.type ?? 'button'}\n isInactive={primary.isInactive}\n isLoading={primary.isLoading}\n onDsClick={() => this.dsAction.emit(primary.id)}\n />\n ) : null}\n {this.showActionMenuTrigger ? (\n <ds-tooltip label=\"Page options\" side=\"bottom\" size=\"sm\">\n <ds-button-unfilled\n ref={el => {\n this.actionTriggerEl = el ?? null;\n }}\n id={this.actionMenuTriggerId}\n class=\"bar-title__more-actions\"\n variant=\"icon\"\n icon=\"Ellipses\"\n aria-label={this.actionsAriaLabel}\n size=\"md\"\n activeFill={!this.compact}\n hasBorder={primary !== null && !this.primaryCollapsed}\n haspopup=\"menu\"\n controls={this.actionMenuId}\n expanded={this.actionMenuOpen}\n onDsClick={(event: CustomEvent<MouseEvent>) => this.toggleActionMenu(event.detail)}\n />\n </ds-tooltip>\n ) : null}\n </div>\n );\n }\n\n private handleBreadcrumbSelect = (event: CustomEvent<BreadcrumbSelectDetail>) => {\n if (this.breadcrumbs.length === 0) {\n this.dsBack.emit(event.detail.originalEvent);\n return;\n }\n const forwarded = this.dsBreadcrumbSelect.emit(event.detail);\n if (forwarded.defaultPrevented) event.preventDefault();\n };\n\n private renderBreadcrumb() {\n const items = this.expandedBreadcrumbItems;\n if (items.length === 0) return null;\n return (\n <ds-breadcrumb\n class=\"bar-title__breadcrumb\"\n items={items}\n ariaLabel={this.breadcrumbAriaLabel}\n onDsSelect={this.handleBreadcrumbSelect}\n />\n );\n }\n\n private renderBack() {\n if (!this.showBack) return null;\n return (\n <ds-tooltip label={this.backTooltipLabel} side=\"bottom\" size=\"sm\">\n <ds-button-unfilled\n class=\"bar-title__back\"\n variant=\"icon\"\n icon=\"ChevronLeft\"\n aria-label={this.backAriaLabel}\n size=\"md\"\n activeFill={false}\n hasBorder={false}\n onDsClick={(event: CustomEvent<MouseEvent>) => this.dsBack.emit(event.detail)}\n />\n </ds-tooltip>\n );\n }\n\n render() {\n const compact = this.compact;\n return (\n <Host\n class={{\n 'bar-title-host--compact': compact,\n 'bar-title-host--expanded': this.variant === 'expanded',\n 'bar-title-host--constrained': this.variant === 'constrained',\n 'bar-title-host--has-description': !!this.description,\n 'bar-title-host--has-back': this.showBack,\n 'bar-title-host--has-breadcrumb': !compact && this.expandedBreadcrumbItems.length > 0,\n }}\n >\n <div class=\"bar-title\">\n <div class=\"bar-title__inner\">\n {!compact ? this.renderBreadcrumb() : null}\n <div class=\"bar-title__row\">\n <div class=\"bar-title__leading\">\n <div class=\"bar-title__title-row\" data-shell-page-header-anchor>\n <div class=\"bar-title__identity\">\n {compact ? this.renderBack() : null}\n <ds-text\n class=\"bar-title__heading ds-control--md\"\n variant={compact ? 'text-title-small' : 'text-title-medium'}\n emphasis\n color=\"primary\"\n as=\"h1\"\n lineTruncation={1}\n >\n {this.heading}\n </ds-text>\n </div>\n {this.renderSectionSelector()}\n </div>\n {this.description && !compact ? (\n <ds-text\n class=\"bar-title__description\"\n variant=\"text-body-small\"\n color=\"secondary\"\n lineTruncation={2}\n wrap=\"wrap\"\n as=\"p\"\n >\n {this.description}\n </ds-text>\n ) : null}\n </div>\n {this.renderActions()}\n </div>\n </div>\n </div>\n\n {this.hasSectionSelector ? (\n <ds-menu\n id={this.sectionMenuId}\n class=\"bar-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 onDsSelect={this.handleSectionSelect}\n />\n ) : null}\n\n {this.showActionMenuTrigger ? (\n <ds-menu\n id={this.actionMenuId}\n class=\"bar-title__action-menu\"\n anchorId={this.actionMenuTriggerId}\n align=\"end\"\n menuLabel={this.actionsAriaLabel}\n open={this.actionMenuOpen}\n initialFocusVisible={this.actionMenuInitialFocusVisible}\n sections={this.actionMenuSections}\n onDsClose={this.closeActionMenu}\n onDsSelect={this.handleActionSelect}\n />\n ) : null}\n </Host>\n );\n }\n}\n"],"mappings":"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","ignoreList":[]}
|