@ds-mo/ui 8.0.1 → 8.1.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/.build-stamp +1 -1
- package/dist/agent.json +633 -29
- package/dist/angular/ds-badge.d.ts +1 -1
- package/dist/angular/ds-badge.js +3 -3
- package/dist/angular/ds-button-filled.d.ts +1 -1
- package/dist/angular/ds-button-filled.js +3 -3
- package/dist/angular/ds-button-unfilled.d.ts +1 -1
- package/dist/angular/ds-button-unfilled.js +3 -3
- package/dist/angular/ds-checkbox.d.ts +4 -1
- package/dist/angular/ds-checkbox.js +3 -3
- package/dist/angular/ds-empty-state.d.ts +1 -1
- package/dist/angular/ds-empty-state.js +3 -3
- package/dist/angular/ds-select-multi.d.ts +28 -0
- package/dist/angular/ds-select-multi.js +49 -0
- package/dist/angular/ds-select.d.ts +12 -2
- package/dist/angular/ds-select.js +11 -4
- package/dist/angular/index.d.ts +1 -1
- package/dist/angular/index.js +1 -0
- package/dist/angular/proxies.d.ts +1 -0
- package/dist/angular/proxies.js +1 -0
- package/dist/components/ds-app-shell.js +1 -1
- package/dist/components/ds-badge.js +1 -1
- package/dist/components/ds-banner.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-button-filled.js +1 -1
- package/dist/components/ds-button-unfilled.js +1 -1
- package/dist/components/ds-card-data-viz-donut.js +1 -1
- package/dist/components/ds-card-setting.js +1 -1
- package/dist/components/ds-card.js +1 -1
- package/dist/components/ds-chart-bar.js +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-line.js +1 -1
- package/dist/components/ds-checkbox.js +1 -1
- package/dist/components/ds-checkbox.js.map +1 -1
- package/dist/components/ds-chip.js +1 -1
- package/dist/components/ds-divider.js +1 -1
- package/dist/components/ds-empty-state.js +1 -1
- package/dist/components/ds-empty-state.js.map +1 -1
- package/dist/components/ds-field.js +1 -1
- package/dist/components/ds-icon.js +1 -1
- package/dist/components/ds-input.js +1 -1
- package/dist/components/ds-menu.js +1 -1
- package/dist/components/ds-modal.js +1 -1
- package/dist/components/ds-pagination.js +1 -1
- package/dist/components/ds-panel-nav.js +1 -1
- package/dist/components/ds-panel-nav.js.map +1 -1
- package/dist/components/ds-panel-sub-nav.js +1 -1
- package/dist/components/ds-panel-tools.js +1 -1
- package/dist/components/ds-radio-group.js +1 -1
- package/dist/components/ds-select-multi.d.ts +11 -0
- package/dist/components/ds-select-multi.js +2 -0
- package/dist/components/ds-select-multi.js.map +1 -0
- package/dist/components/ds-select.js +1 -1
- package/dist/components/ds-select.js.map +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-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-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-table.js +1 -1
- package/dist/components/ds-tag.js +1 -1
- package/dist/components/ds-text.js +1 -1
- package/dist/components/ds-tooltip-data-viz.js +1 -1
- package/dist/components/ds-tooltip.js +1 -1
- package/dist/components/{p-CPD_mML6.js → p-B2FhhQba.js} +2 -2
- package/dist/components/p-BEmVLLnN.js +2 -0
- package/dist/components/p-BEmVLLnN.js.map +1 -0
- package/dist/components/{p-DoZU8RH0.js → p-BMbadvZo.js} +2 -2
- package/dist/components/{p-B8ERbwc9.js → p-BcB-zkOx.js} +2 -2
- package/dist/components/p-COzps7J4.js +2 -0
- package/dist/components/p-COzps7J4.js.map +1 -0
- package/dist/components/p-CTmsQjsE.js +2 -0
- package/dist/components/p-CTmsQjsE.js.map +1 -0
- package/dist/components/p-C_cu-HIT.js +2 -0
- package/dist/components/p-C_cu-HIT.js.map +1 -0
- package/dist/components/{p-DavEAOUa.js → p-Ckiwpsgw.js} +2 -2
- package/dist/components/{p-Dt0XnMxc.js → p-CwaC4wLu.js} +2 -2
- package/dist/components/{p-Dt0XnMxc.js.map → p-CwaC4wLu.js.map} +1 -1
- package/dist/components/{p-clDpFcdU.js → p-DDBLO7bY.js} +2 -2
- package/dist/components/p-Du9UUSJ5.js +2 -0
- package/dist/components/p-Du9UUSJ5.js.map +1 -0
- package/dist/components/p-JsVSx7ZR.js +2 -0
- package/dist/components/p-JsVSx7ZR.js.map +1 -0
- package/dist/components/{p-3bRWSqaN.js → p-WdtWRvVr.js} +2 -2
- package/dist/components/{p-Mx6VFEQc.js → p-_zP4v-Al.js} +2 -2
- package/dist/components/p-_zP4v-Al.js.map +1 -0
- package/dist/components/{p-DsiueSMI.js → p-auwU64d8.js} +2 -2
- package/dist/components/p-f0a1l4Uc.js +2 -0
- package/dist/components/p-f0a1l4Uc.js.map +1 -0
- package/dist/docs/components.json +1974 -237
- package/dist/framework/angular.d.ts +1 -0
- package/dist/framework/angular.js +1 -0
- package/dist/framework/select-multi-value-accessor.d.ts +9 -0
- package/dist/framework/select-multi-value-accessor.js +40 -0
- package/dist/lib/components/Menu/menu-position.d.ts +6 -19
- package/dist/lib/utils/anchored-popup.d.ts +19 -0
- package/dist/react/components.d.ts +1 -0
- package/dist/react/components.js +1 -0
- package/dist/react/ds-select-multi.d.ts +14 -0
- package/dist/react/ds-select-multi.js +16 -0
- package/dist/react/ds-select.d.ts +2 -0
- package/dist/react/ds-select.js +5 -1
- package/dist/types/components/Badge/Badge.d.ts +2 -0
- package/dist/types/components/ButtonFilled/ButtonFilled.d.ts +2 -0
- package/dist/types/components/ButtonUnfilled/ButtonUnfilled.d.ts +2 -0
- package/dist/types/components/Checkbox/Checkbox.d.ts +16 -0
- package/dist/types/components/Checkbox/index.d.ts +1 -1
- package/dist/types/components/EmptyState/EmptyState.d.ts +6 -5
- package/dist/types/components/Menu/menu-position.d.ts +6 -19
- package/dist/types/components/Select/Select.d.ts +94 -48
- package/dist/types/components/Select/index.d.ts +1 -1
- package/dist/types/components/SelectMulti/SelectMulti.d.ts +131 -0
- package/dist/types/components/SelectMulti/index.d.ts +2 -0
- package/dist/types/components/Text/Text.d.ts +1 -0
- package/dist/types/components.d.ts +683 -55
- package/dist/types/utils/anchored-popup.d.ts +20 -0
- package/dist/types/utils/choice-list-parts.d.ts +33 -0
- package/dist/types/utils/choice-list.d.ts +26 -0
- package/package.json +2 -2
- package/dist/components/p-Ca1H1HPf.js +0 -2
- package/dist/components/p-Ca1H1HPf.js.map +0 -1
- package/dist/components/p-CpX87AQy.js +0 -2
- package/dist/components/p-CpX87AQy.js.map +0 -1
- package/dist/components/p-CyMmsNCF.js +0 -2
- package/dist/components/p-CyMmsNCF.js.map +0 -1
- package/dist/components/p-Mx6VFEQc.js.map +0 -1
- /package/dist/components/{p-CPD_mML6.js.map → p-B2FhhQba.js.map} +0 -0
- /package/dist/components/{p-DoZU8RH0.js.map → p-BMbadvZo.js.map} +0 -0
- /package/dist/components/{p-B8ERbwc9.js.map → p-BcB-zkOx.js.map} +0 -0
- /package/dist/components/{p-DavEAOUa.js.map → p-Ckiwpsgw.js.map} +0 -0
- /package/dist/components/{p-clDpFcdU.js.map → p-DDBLO7bY.js.map} +0 -0
- /package/dist/components/{p-3bRWSqaN.js.map → p-WdtWRvVr.js.map} +0 -0
- /package/dist/components/{p-DsiueSMI.js.map → p-auwU64d8.js.map} +0 -0
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{p as s,H as t,c as i,h as e,a,t as n}from"./index.js";import{i as r,g as o}from"./p-BQq26pt9.js";import{s as h,p as d,d as c}from"./p-BOQnc-M4.js";import{C as l,c as b,a as f,b as u,r as v,d as p}from"./p-BKhG2xrW.js";import{d as g}from"./p-Ca1H1HPf.js";import{d as m}from"./p-Mx6VFEQc.js";import{d as _}from"./p-DoZU8RH0.js";import{d as y}from"./p-wxw8arTd.js";import{d as w}from"./p-CyMmsNCF.js";import{d as k}from"./p-clDpFcdU.js";import{d as x}from"./p-DavEAOUa.js";import{d as C}from"./p-B8ERbwc9.js";import{d as T}from"./p-Dt0XnMxc.js";function E(s,t){const i=[];let e=[];for(const a of s){if(r(a)){if(e.length>0){i.push({items:e});e=[]}continue}e.push({label:a.label,value:a.id,dot:a.dot,isSelected:a.id===t,isInactive:a.isInactive})}if(e.length>0){i.push({items:e})}return i}function F(s,t){return E(D(s),t)}function M(s,t,i,e=2){const a=s-t;if(i){return a>-e}return a>e}function S(s,t,i,e,a){if(s.length===0||t<=0)return 0;const n=P(s,s.length,e,a);if(n<=t)return s.length;const r=Math.max(0,t-i);let o=0;for(let t=1;t<=s.length;t++){const i=P(s,t,e,a);if(i>r)break;o=t}return o}function O(s){let t=s.length;while(t>0&&r(s[t-1])){t-=1}return s.slice(0,t)}function D(s){let t=0;while(t<s.length&&r(s[t])){t+=1}return s.slice(t)}function P(s,t,i,e){if(t<=0)return 0;const a=s.slice(0,t).reduce(((s,t)=>s+t),0);return e+a+i*Math.max(0,t-1)}const H=()=>`.sc-ds-bar-nav-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-nav-h:focus-visible,.ds-focus-ring.sc-ds-bar-nav: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-nav-h,.ds-focus-ring.ds-focus-ring--visible.sc-ds-bar-nav{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-nav-h:focus-visible,.ds-focus-ring-inset.sc-ds-bar-nav:focus-visible{outline:none}.ds-focus-ring-inset.sc-ds-bar-nav-h:focus-visible::after,.ds-focus-ring-inset.sc-ds-bar-nav: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-nav-h,.ds-focus-ring-inset.ds-focus-ring--visible.sc-ds-bar-nav{outline:none}.ds-focus-ring-inset.ds-focus-ring--visible.sc-ds-bar-nav-h::after,.ds-focus-ring-inset.ds-focus-ring--visible.sc-ds-bar-nav::after{outline:var(--ds-focus-ring-width) solid var(--ds-focus-ring-color);outline-offset:calc(-1 * var(--ds-focus-ring-width))}.ds-control-inactive.sc-ds-bar-nav-h,.ds-control-inactive.sc-ds-bar-nav{opacity:0.25;pointer-events:none;cursor:not-allowed}.sc-ds-bar-nav-h{display:block}.bar-nav.sc-ds-bar-nav{display:flex;align-items:center;position:relative;height:var(--dimension-size-600);padding:var(--dimension-space-100);gap:var(--dimension-space-100);box-sizing:border-box;border-bottom:var(--dimension-stroke-width-012) solid var(--_bar-nav-border);background-color:var(--_bar-nav-bg);color:var(--_bar-nav-fg-primary);-webkit-user-select:none;user-select:none;overflow:hidden;transition:background-color var(--effect-motion-short-3), border-color var(--effect-motion-short-3), color var(--effect-motion-short-3);isolation:isolate;--_bar-nav-bg:var(--color-background-secondary);--_bar-nav-border:var(--color-border-tertiary);--_bar-nav-fg-primary:var(--color-foreground-primary);--_bar-nav-fg-secondary:var(--color-foreground-secondary);--_bar-nav-hover:var(--color-interaction-hover);--_bar-nav-pressed:var(--color-interaction-pressed);--_bar-nav-focus:var(--color-interaction-focus);--_bar-nav-dot:var(--color-foreground-bold-brand);--ds-focus-ring-color:var(--_bar-nav-focus)}.bar-nav--dashboard.sc-ds-bar-nav,.bar-nav--settings.sc-ds-bar-nav{--_bar-nav-bg:var(--color-background-secondary);--_bar-nav-border:var(--color-border-tertiary);--_bar-nav-fg-primary:var(--color-foreground-primary);--_bar-nav-fg-secondary:var(--color-foreground-secondary);--_bar-nav-hover:var(--color-interaction-hover);--_bar-nav-pressed:var(--color-interaction-pressed);--_bar-nav-focus:var(--color-interaction-focus);--_bar-nav-dot:var(--color-foreground-bold-brand)}ds-app-shell.sc-ds-bar-nav-h:not([gradient-preset='none']) .bar-nav.sc-ds-bar-nav,ds-app-shell:not([gradient-preset='none']) .sc-ds-bar-nav-h .bar-nav.sc-ds-bar-nav{background-color:transparent}.bar-nav.sc-ds-bar-nav>.sc-ds-bar-nav:not(.bar-nav__tabs-probe){position:relative;z-index:3}.bar-nav--tabs-collapsed.sc-ds-bar-nav{display:flex;gap:var(--dimension-space-100);align-items:center}.bar-nav__left.sc-ds-bar-nav{position:relative;flex:1 1 0%;min-width:0;width:0;display:flex;align-items:center}.bar-nav__tabs-visible.sc-ds-bar-nav{flex:1;min-width:0;width:100%}.bar-nav__tabs-probe.sc-ds-bar-nav{position:absolute;left:0;top:0;visibility:hidden;pointer-events:none;overflow:visible;width:max-content;max-width:none;z-index:-1}.bar-nav__tabs-probe.sc-ds-bar-nav>div.sc-ds-bar-nav{width:max-content}.bar-nav__tab-list.sc-ds-bar-nav{display:flex;align-items:center;gap:var(--dimension-space-050);position:relative;width:max-content}.bar-nav__tab.sc-ds-bar-nav{display:flex;align-items:center;justify-content:center;gap:var(--dimension-space-050);height:var(--dimension-size-400);min-width:var(--dimension-size-400);padding:var(--dimension-space-075);box-sizing:border-box;border:none;border-radius:var(--dimension-radius-025);background-color:transparent;color:var(--_bar-nav-fg-secondary);cursor:pointer;position:relative;flex-shrink:0;-webkit-user-select:none;user-select:none;transition:color var(--effect-motion-short-2)}.bar-nav__tab.sc-ds-bar-nav::after{content:'';position:absolute;inset:0;border-radius:var(--dimension-radius-025);background:transparent;pointer-events:none}.bar-nav__tab.sc-ds-bar-nav:hover::after{background:var(--_bar-nav-hover)}.bar-nav__tab.sc-ds-bar-nav:active::after{background:var(--_bar-nav-pressed)}.bar-nav__tab--selected.sc-ds-bar-nav{color:var(--_bar-nav-fg-primary)}.bar-nav__tab-label.sc-ds-bar-nav{position:relative;display:inline-flex;align-items:center;padding:0 var(--dimension-space-025);white-space:nowrap}.bar-nav__tab-label--dot.sc-ds-bar-nav{padding-right:calc(var(--dimension-space-025) + var(--dimension-space-050))}.bar-nav__tab-dot.sc-ds-bar-nav{position:absolute;top:0;right:0;pointer-events:none}.bar-nav__tab-divider.sc-ds-bar-nav{display:flex;align-items:center;justify-content:center;box-sizing:border-box;width:var(--dimension-space-100);height:var(--dimension-size-400);padding-block:var(--dimension-space-075);flex-shrink:0;pointer-events:none}.bar-nav__tab-divider-line.sc-ds-bar-nav{width:var(--dimension-stroke-width-012);align-self:stretch;background-color:var(--_bar-nav-border)}.bar-nav__tabs-pending.sc-ds-bar-nav{flex:1;min-width:0;height:var(--dimension-size-400);visibility:hidden;pointer-events:none}.bar-nav__overflow-trigger.sc-ds-bar-nav{margin-left:auto;--ds-button-unfilled-fg:var(--_bar-nav-fg-secondary);--ds-button-unfilled-fg-active:var(--_bar-nav-fg-primary);--ds-interaction-hover:var(--_bar-nav-hover);--ds-interaction-pressed:var(--_bar-nav-pressed);--ds-focus-ring-color:var(--_bar-nav-focus)}ds-text.bar-nav__heading.sc-ds-bar-nav{display:inline-flex;align-items:center;height:var(--dimension-size-400);padding-inline:var(--dimension-space-100);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;-webkit-user-select:none;user-select:none}`;const j=s(class s extends t{constructor(s){super();if(s!==false){this.__registerHost()}this.dsTabChange=i(this,"dsTabChange");this.navStyle="dashboard";this.tabs=[];this.tabsJson="";this.value="";this.basePath="";this.currentUrl="";this.moreTabsLabel="More tabs";this.resolvedTabs=[];this.urlDerivedValue="";this.hideTabsForDetailRoute=false;this.tabsCollapsed=false;this.menuOpen=false;this.tabLayoutCommitted=false;this.visibleTabs=[];this.overflowTabs=[];this.menuInitialFocusVisible=false;this.overflowRovingFocused=false;this.focusedTabId="";this.headerEl=null;this.triggerEl=null;this.menuEl=null;this.visibleTabListEl=null;this.probeTabListEl=null;this.resizeObserver=null;this.intrinsicWidthRetryCount=0;this.tabLayoutPendingFrames=0;this.panelNavTransition=new l;this.panelToolsTransition=new l;this.overflowCoalescer=b((()=>{this.updateTabsCollapsed()}));this.chromeTransitionShell=null;this.committedSection="";this.pendingSection="";this.onChromeTransitionStart=s=>{const t=v(s);if(t==="panel-nav"){this.panelNavTransition.enter();return}if(t==="panel-tools"){const t=p(s)??"opening";if(t==="closing"){this.panelToolsTransition.enter()}}};this.onChromeTransitionEnd=s=>{const t=v(s);if(t==="panel-nav"){this.panelNavTransition.exit();if(!this.panelNavTransition.isActive){this.scheduleOverflowCheck()}return}if(t==="panel-tools"){this.panelToolsTransition.exit();this.scheduleOverflowCheck()}};this.handleOverflowFocus=()=>{this.overflowRovingFocused=true};this.handleOverflowBlur=()=>{this.overflowRovingFocused=false}}get effectiveValue(){if(this.currentUrl&&this.basePath){return this.urlDerivedValue}return this.value}get renderedSelectableTabs(){const s=this.hasOverflowTabs?this.visibleTabs:this.resolvedTabs;return o(s)}get hasOverflowTabs(){return this.tabLayoutCommitted&&this.tabsCollapsed&&this.overflowTabs.length>0}syncFocusedTabId(s,t){if(t.some((t=>t.id===s&&!t.isInactive))){this.focusedTabId=s;return}const i=t.find((s=>!s.isInactive));this.focusedTabId=i?.id??""}digestTabsConfig(s){return s.map((s=>r(s)?"|":s.id)).join(",")}resetTabOverflowLayout(){this.tabLayoutCommitted=false;this.tabsCollapsed=false;this.menuOpen=false;this.menuInitialFocusVisible=false;this.intrinsicWidthRetryCount=0;this.tabLayoutPendingFrames=0;this.visibleTabs=[];this.overflowTabs=[]}onHostPropsChange(){this.applyHostProps()}onSelectionChange(){this.syncFocusedTabId(this.effectiveValue,this.renderedSelectableTabs);this.syncMenuSections();this.scheduleOverflowCheck()}onMenuOpenChange(s){if(this.menuEl){this.menuEl.open=s}}onTabsCollapsedChange(s,t){if(!s){this.menuOpen=false;this.menuInitialFocusVisible=false;this.menuEl=null}this.scheduleOverflowCheck();if(s){requestAnimationFrame((()=>{this.scheduleOverflowCheck()}))}if(s||t===undefined||t===s)return;requestAnimationFrame((()=>this.scheduleOverflowCheck()));queueMicrotask((()=>this.focusVisibleSelectedTab()))}componentWillLoad(){this.applyHostProps();this.syncFocusedTabId(this.effectiveValue,o(this.resolvedTabs))}componentDidLoad(){this.syncHostPropsIfNeeded();this.scheduleDeferredHostPropSync();this.setupOverflowObserver();this.bindChromeTransitionListeners();this.scheduleOverflowCheck()}componentDidRender(){if(this.chromeOverflowPaused()){this.syncMenuAnchor();return}this.scheduleOverflowCheck();this.syncMenuAnchor()}disconnectedCallback(){this.resizeObserver?.disconnect();this.resizeObserver=null;this.overflowCoalescer.cancel();this.unbindChromeTransitionListeners()}bindChromeTransitionListeners(){const s=this.el.closest("ds-app-shell");if(!s)return;this.chromeTransitionShell=s;s.addEventListener(f,this.onChromeTransitionStart);s.addEventListener(u,this.onChromeTransitionEnd)}unbindChromeTransitionListeners(){if(!this.chromeTransitionShell)return;this.chromeTransitionShell.removeEventListener(f,this.onChromeTransitionStart);this.chromeTransitionShell.removeEventListener(u,this.onChromeTransitionEnd);this.chromeTransitionShell=null}chromeOverflowPaused(){return this.panelNavTransition.isActive||this.panelToolsTransition.isActive}syncHostPropsIfNeeded(){if(h(this.resolvedTabs,this.tabs,this.tabsJson)){this.applyHostProps()}else if(this.currentUrl&&this.basePath){this.syncValueFromUrl()}}scheduleDeferredHostPropSync(){let t=s.HOST_PROP_SYNC_BUDGET;const i=()=>{this.syncHostPropsIfNeeded();if(--t>0){requestAnimationFrame(i)}};queueMicrotask(i)}setupOverflowObserver(){if(typeof ResizeObserver==="undefined"||!this.headerEl)return;this.resizeObserver?.disconnect();this.resizeObserver=new ResizeObserver((()=>{if(this.chromeOverflowPaused())return;this.scheduleOverflowCheck()}));this.resizeObserver.observe(this.headerEl)}scheduleOverflowCheck(){if(this.chromeOverflowPaused())return;this.overflowCoalescer.schedule()}getLeftZoneAvailableWidth(){if(!this.headerEl)return 0;const s=getComputedStyle(this.headerEl);const t=(parseFloat(s.paddingLeft)||0)+(parseFloat(s.paddingRight)||0);return Math.max(0,this.headerEl.clientWidth-t)}getTabsIntrinsicWidth(){return this.probeTabListEl?.scrollWidth??0}getHeaderGap(){if(!this.headerEl)return 0;const s=getComputedStyle(this.headerEl);return parseFloat(s.columnGap||s.gap)||0}getOverflowTriggerReserveWidth(){if(!this.triggerEl){return 40}return this.triggerEl.getBoundingClientRect().width+this.getHeaderGap()}getProbeTabMetrics(){const s=this.probeTabListEl;if(!s)return null;const t=Array.from(s.children);const i=t.map((s=>s.getBoundingClientRect().width));if(i.length===0||i.some((s=>s===0)))return null;const e=getComputedStyle(s);const a=parseFloat(e.columnGap||e.gap)||0;const n=i.reduce(((s,t)=>s+t),0);const r=a*Math.max(0,i.length-1);const o=Math.max(0,s.scrollWidth-n-r);return{itemWidths:i,itemGap:a,listExtraWidth:o}}setOverflowTabLayout(s,t){const i=t.length>0;const e=this.digestTabsConfig(s)!==this.digestTabsConfig(this.visibleTabs);const a=this.digestTabsConfig(t)!==this.digestTabsConfig(this.overflowTabs);if(e){this.visibleTabs=s}if(a){this.overflowTabs=t}if(i!==this.tabsCollapsed){this.tabsCollapsed=i;if(!i){this.menuOpen=false}}this.syncFocusedTabId(this.effectiveValue,o(i?s:this.resolvedTabs))}scheduleIntrinsicWidthRetry(){if(this.intrinsicWidthRetryCount>=s.INTRINSIC_WIDTH_RETRY_MAX)return;this.intrinsicWidthRetryCount++;requestAnimationFrame((()=>this.scheduleOverflowCheck()))}forceTabLayoutCommit(s){this.intrinsicWidthRetryCount=0;this.tabLayoutPendingFrames=0;this.setOverflowTabLayout(s?[]:this.resolvedTabs,s?this.resolvedTabs:[]);this.tabLayoutCommitted=true}updateTabsCollapsed(){if(!this.headerEl||this.resolvedTabs.length===0||this.hideTabsForDetailRoute){if(this.tabsCollapsed){this.setOverflowTabLayout([],[])}this.intrinsicWidthRetryCount=0;this.tabLayoutPendingFrames=0;this.tabLayoutCommitted=true;return}const t=this.getProbeTabMetrics();const i=this.getTabsIntrinsicWidth();if(!t||i===0){this.tabLayoutPendingFrames+=1;if(this.intrinsicWidthRetryCount>=s.INTRINSIC_WIDTH_RETRY_MAX){this.forceTabLayoutCommit(false)}else if(this.tabLayoutPendingFrames>=s.TAB_LAYOUT_COMMIT_MAX_FRAMES){this.forceTabLayoutCommit(false)}else{this.scheduleIntrinsicWidthRetry()}return}this.intrinsicWidthRetryCount=0;this.tabLayoutPendingFrames=0;const e=M(i,this.getLeftZoneAvailableWidth(),this.tabsCollapsed,s.OVERFLOW_HYSTERESIS_PX);if(!e){this.setOverflowTabLayout(this.resolvedTabs,[]);this.tabLayoutCommitted=true;return}const a=S(t.itemWidths,this.getLeftZoneAvailableWidth(),this.getOverflowTriggerReserveWidth(),t.itemGap,t.listExtraWidth);const n=O(this.resolvedTabs.slice(0,a));const r=this.resolvedTabs.slice(n.length);this.setOverflowTabLayout(n,r);this.tabLayoutCommitted=true}syncMenuAnchor(){if(!this.menuEl||!this.triggerEl||!this.hasOverflowTabs)return;this.menuEl.anchor=this.triggerEl;this.syncMenuSections()}handleMenuSelect(s){const t=s.detail;if(t?.value!==undefined){this.selectTab(String(t.value))}this.menuOpen=false;this.menuInitialFocusVisible=false}handleMenuClose(){this.menuOpen=false;this.menuInitialFocusVisible=false}incomingTabs(){return this.tabsJson?d(this.tabsJson,[]):this.tabs??[]}applyHostProps(){const s=this.basePath;const t=s!==""&&this.committedSection!==""&&s!==this.committedSection;if(t){this.urlDerivedValue="";this.committedSection="";this.pendingSection=s;this.resolvedTabs=[];this.resetTabOverflowLayout();return}if(this.pendingSection){if(!s||s!==this.pendingSection){return}if(!this.currentUrl.startsWith(this.pendingSection)){return}const t=this.incomingTabs();if(t.length===0){return}this.pendingSection=""}const i=this.incomingTabs();const e=this.digestTabsConfig(i)!==this.digestTabsConfig(this.resolvedTabs);this.resolvedTabs=i;this.syncValueFromUrl();this.committedSection=s;if(e){this.resetTabOverflowLayout()}this.scheduleOverflowCheck()}syncMenuSections(){if(!this.menuEl)return;this.menuEl.sections=F(this.overflowTabs,this.effectiveValue)}syncValueFromUrl(){const s=this.incomingTabs();if(!this.currentUrl||!this.basePath){this.urlDerivedValue="";this.hideTabsForDetailRoute=false;return}if(!this.currentUrl.startsWith(this.basePath)){this.urlDerivedValue="";this.hideTabsForDetailRoute=false;return}const{value:t,hideTabs:i}=c(this.currentUrl,this.basePath,s);this.urlDerivedValue=t;this.hideTabsForDetailRoute=i}selectTab(s){this.value=s;this.dsTabChange.emit(s)}focusVisibleSelectedTab(){const s=this.visibleTabListEl?.querySelector(`[data-tab-id="${this.effectiveValue}"]`);s?.focus({preventScroll:true})}focusVisibleTab(s){this.focusedTabId=s;const t=this.visibleTabListEl?.querySelector(`[data-tab-id="${s}"]`);t?.focus({preventScroll:true})}focusLastVisibleTab(){const s=[...this.renderedSelectableTabs].reverse().find((s=>!s.isInactive));if(s)this.focusVisibleTab(s.id)}findEnabledVisibleTab(s,t){const i=this.renderedSelectableTabs;for(let e=s+t;e>=0&&e<i.length;e+=t){if(!i[e]?.isInactive)return e}return null}handleTabKeyDown(s){const t=this.renderedSelectableTabs;if(!t.length)return;const i=s.target?.getAttribute("data-tab-id");const e=i??this.focusedTabId;if(s.key==="Enter"||s.key===" "){const i=t.find((s=>s.id===e));if(!i||i.isInactive)return;s.preventDefault();this.selectTab(i.id);return}const a=t.findIndex((s=>s.id===e));if(a<0)return;let n;if(s.key==="ArrowRight"){n=this.findEnabledVisibleTab(a,1);if(n===null&&this.hasOverflowTabs){s.preventDefault();this.overflowRovingFocused=true;void this.triggerEl?.setFocus?.();return}}else if(s.key==="ArrowLeft"){n=this.findEnabledVisibleTab(a,-1)}else if(s.key==="Home"){n=t.findIndex((s=>!s.isInactive))}else if(s.key==="End"){const s=[...t].reverse().findIndex((s=>!s.isInactive));n=s<0?null:t.length-1-s}else{return}if(n===null||n<0||n===a)return;s.preventDefault();this.focusVisibleTab(t[n].id)}toggleTabMenu(s){if(this.menuOpen){this.menuOpen=false;this.menuInitialFocusVisible=false;return}if(this.menuEl&&this.triggerEl){this.menuEl.anchor=this.triggerEl;this.menuEl.minWidth="";this.syncMenuSections()}this.menuInitialFocusVisible=s?.focusVisible??false;this.menuOpen=true}handleTriggerKeyDown(s){if(!this.hasOverflowTabs)return;if(!this.menuOpen){if(s.key==="ArrowLeft"){s.preventDefault();this.overflowRovingFocused=false;this.focusLastVisibleTab();return}if(s.key==="Enter"||s.key===" "){s.preventDefault();this.toggleTabMenu({focusVisible:true})}return}if(s.key==="Escape"){s.preventDefault();this.menuOpen=false;this.menuInitialFocusVisible=false;void this.triggerEl?.setFocus?.()}}renderTabList(s,t){return e("div",{role:"tablist",class:"bar-nav__tab-list","aria-label":this.heading,ref:s=>{if(t){const t=s??null;if(t===this.probeTabListEl)return;this.probeTabListEl=t;if(t){this.intrinsicWidthRetryCount=0;this.tabLayoutPendingFrames=0;this.scheduleOverflowCheck()}}else{this.visibleTabListEl=s??null}},onKeyDown:t?undefined:s=>this.handleTabKeyDown(s),onFocusin:t?undefined:()=>{this.overflowRovingFocused=false}},s.map(((s,i)=>{if(r(s)){return e("div",{class:"bar-nav__tab-divider",key:`divider-${i}`,"aria-hidden":"true"},e("div",{class:"bar-nav__tab-divider-line"}))}const a=s.id===this.effectiveValue;return e("button",{key:s.id,type:"button",role:"tab","data-tab-id":s.id,class:{"bar-nav__tab":true,"bar-nav__tab--selected":a,"ds-focus-ring-inset":true,"ds-control-inactive":!!s.isInactive},"aria-selected":a?"true":"false","aria-disabled":s.isInactive?"true":undefined,"aria-controls":s.panelId??undefined,disabled:s.isInactive,tabIndex:!t&&!this.overflowRovingFocused&&s.id===this.focusedTabId?0:-1,onClick:()=>!t&&!s.isInactive&&this.selectTab(s.id),onFocus:()=>{if(!t)this.focusedTabId=s.id}},e("span",{class:{"bar-nav__tab-label":true,"bar-nav__tab-label--dot":!!s.dot}},e("ds-text",{as:"span",variant:"text-body-medium",emphasis:a,color:"inherit"},s.label),s.dot&&e("ds-badge",{class:"bar-nav__tab-dot",variant:"dot",background:"var(--_bar-nav-bg)",label:"","aria-hidden":"true"})))})))}render(){const s=this.basePath===""||this.committedSection===this.basePath;const t=s&&this.resolvedTabs.length>0&&!this.hideTabsForDetailRoute;const i=this.basePath||"no-section";const n=this.hasOverflowTabs?this.visibleTabs:this.resolvedTabs;return e(a,{key:"eb816430a2d595c5681e5296d61a78e38d460ccb"},e("header",{key:"6447b5cf50612443db89957cafc4ad8c6a08ee4f",class:{"bar-nav":true,"bar-nav--dashboard":this.navStyle==="dashboard","bar-nav--settings":this.navStyle==="settings","bar-nav--tabs-collapsed":t&&this.hasOverflowTabs},ref:s=>{this.headerEl=s;if(s&&!this.resizeObserver){this.setupOverflowObserver()}}},t&&e("div",{key:"4713a73aa54f9eaf8cee0ec4015784adaf39ffe0",class:"bar-nav__tabs-probe","aria-hidden":"true",inert:true},e("div",{key:`probe-${i}`},this.renderTabList(this.resolvedTabs,true))),t&&this.tabLayoutCommitted&&n.length>0&&e("div",{key:"e4f96d13002e5a8449f05507618b57b9ab8a9eab",class:"bar-nav__left"},e("div",{key:`visible-${i}`,class:"bar-nav__tabs-visible"},this.renderTabList(n,false))),t&&!this.tabLayoutCommitted&&e("div",{key:"8afca4036e819222f5128a346af0cd0b5674c88b",class:"bar-nav__tabs-pending","aria-hidden":"true"}),!t&&this.heading&&e("ds-text",{key:"3cc006b12816ecf5185812b59a7812a5c6c1ecd0",class:"bar-nav__heading",as:"span",variant:"text-body-medium",emphasis:true,color:"primary",wrap:"nowrap"},this.heading),t&&this.hasOverflowTabs&&e("ds-button-unfilled",{key:"18f4459938821047fbc19aed294d9862e617a577",variant:"icon",class:{"bar-nav__overflow-trigger":true},icon:"Ellipses",isActive:this.menuOpen,activeFill:false,hasBorder:false,focusTabIndex:this.overflowRovingFocused?0:-1,ref:s=>{this.triggerEl=s??null},haspopup:"menu",expanded:this.menuOpen,"aria-label":this.moreTabsLabel,onDsClick:()=>this.toggleTabMenu({focusVisible:false}),onFocusin:this.handleOverflowFocus,onFocusout:this.handleOverflowBlur,onKeyDown:s=>this.handleTriggerKeyDown(s)})),t&&this.hasOverflowTabs&&e("ds-menu",{key:"0e8f05696e9222da433dd309dfc0cba331b36417",ref:s=>{this.menuEl=s??null},open:this.menuOpen,sections:F(this.overflowTabs,this.effectiveValue),side:"bottom",align:"end",sideOffset:"calc(var(--dimension-space-100) + var(--dimension-space-050))",alignOffset:"var(--dimension-space-050)",initialFocusVisible:this.menuInitialFocusVisible,onDsSelect:s=>this.handleMenuSelect(s),onDsClose:()=>this.handleMenuClose()}))}get el(){return this}static get watchers(){return{tabs:[{onHostPropsChange:0}],tabsJson:[{onHostPropsChange:0}],currentUrl:[{onHostPropsChange:0}],basePath:[{onHostPropsChange:0}],value:[{onSelectionChange:0}],urlDerivedValue:[{onSelectionChange:0}],menuOpen:[{onMenuOpenChange:0}],tabsCollapsed:[{onTabsCollapsedChange:0}]}}static get style(){return H()}},[2,"ds-bar-nav",{navStyle:[513,"nav-style"],tabs:[16],tabsJson:[1,"tabs-json"],value:[1025],heading:[1],basePath:[1,"base-path"],currentUrl:[1,"current-url"],moreTabsLabel:[1,"more-tabs-label"],resolvedTabs:[32],urlDerivedValue:[32],hideTabsForDetailRoute:[32],tabsCollapsed:[32],menuOpen:[32],tabLayoutCommitted:[32],visibleTabs:[32],overflowTabs:[32],menuInitialFocusVisible:[32],overflowRovingFocused:[32],focusedTabId:[32],committedSection:[32],pendingSection:[32]},undefined,{tabs:[{onHostPropsChange:0}],tabsJson:[{onHostPropsChange:0}],currentUrl:[{onHostPropsChange:0}],basePath:[{onHostPropsChange:0}],value:[{onSelectionChange:0}],urlDerivedValue:[{onSelectionChange:0}],menuOpen:[{onMenuOpenChange:0}],tabsCollapsed:[{onTabsCollapsedChange:0}]}]);j.HOST_PROP_SYNC_BUDGET=8;j.INTRINSIC_WIDTH_RETRY_MAX=3;j.TAB_LAYOUT_COMMIT_MAX_FRAMES=16;j.OVERFLOW_HYSTERESIS_PX=8;function L(){if(typeof customElements==="undefined"){return}const s=["ds-bar-nav","ds-badge","ds-button-unfilled","ds-icon","ds-loader","ds-menu","ds-shell-gradient-picker","ds-shell-gradient-swatch","ds-switch","ds-text"];s.forEach((s=>{switch(s){case"ds-bar-nav":if(!customElements.get(n(s))){customElements.define(n(s),j)}break;case"ds-badge":if(!customElements.get(n(s))){g()}break;case"ds-button-unfilled":if(!customElements.get(n(s))){m()}break;case"ds-icon":if(!customElements.get(n(s))){_()}break;case"ds-loader":if(!customElements.get(n(s))){y()}break;case"ds-menu":if(!customElements.get(n(s))){w()}break;case"ds-shell-gradient-picker":if(!customElements.get(n(s))){k()}break;case"ds-shell-gradient-swatch":if(!customElements.get(n(s))){x()}break;case"ds-switch":if(!customElements.get(n(s))){C()}break;case"ds-text":if(!customElements.get(n(s))){T()}break}}))}L();const V=j;const z=L;export{V as DsBarNav,z as defineCustomElement};
|
|
1
|
+
import{p as s,H as t,c as i,h as e,a,t as n}from"./index.js";import{i as r,g as o}from"./p-BQq26pt9.js";import{s as h,p as d,d as c}from"./p-BOQnc-M4.js";import{C as l,c as b,a as f,b as u,r as v,d as p}from"./p-BKhG2xrW.js";import{d as g}from"./p-JsVSx7ZR.js";import{d as m}from"./p-_zP4v-Al.js";import{d as _}from"./p-BMbadvZo.js";import{d as y}from"./p-wxw8arTd.js";import{d as w}from"./p-CTmsQjsE.js";import{d as k}from"./p-DDBLO7bY.js";import{d as C}from"./p-Ckiwpsgw.js";import{d as x}from"./p-BcB-zkOx.js";import{d as T}from"./p-CwaC4wLu.js";function S(s,t){const i=[];let e=[];for(const a of s){if(r(a)){if(e.length>0){i.push({items:e});e=[]}continue}e.push({label:a.label,value:a.id,dot:a.dot,isSelected:a.id===t,isInactive:a.isInactive})}if(e.length>0){i.push({items:e})}return i}function O(s,t){return S(P(s),t)}function E(s,t,i,e=2){const a=s-t;if(i){return a>-e}return a>e}function F(s,t,i,e,a){if(s.length===0||t<=0)return 0;const n=j(s,s.length,e,a);if(n<=t)return s.length;const r=Math.max(0,t-i);let o=0;for(let t=1;t<=s.length;t++){const i=j(s,t,e,a);if(i>r)break;o=t}return o}function M(s){let t=s.length;while(t>0&&r(s[t-1])){t-=1}return s.slice(0,t)}function P(s){let t=0;while(t<s.length&&r(s[t])){t+=1}return s.slice(t)}function j(s,t,i,e){if(t<=0)return 0;const a=s.slice(0,t).reduce(((s,t)=>s+t),0);return e+a+i*Math.max(0,t-1)}const D=()=>`.sc-ds-bar-nav-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-nav-h:focus-visible,.ds-focus-ring.sc-ds-bar-nav: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-nav-h,.ds-focus-ring.ds-focus-ring--visible.sc-ds-bar-nav{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-nav-h:focus-visible,.ds-focus-ring-inset.sc-ds-bar-nav:focus-visible{outline:none}.ds-focus-ring-inset.sc-ds-bar-nav-h:focus-visible::after,.ds-focus-ring-inset.sc-ds-bar-nav: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-nav-h,.ds-focus-ring-inset.ds-focus-ring--visible.sc-ds-bar-nav{outline:none}.ds-focus-ring-inset.ds-focus-ring--visible.sc-ds-bar-nav-h::after,.ds-focus-ring-inset.ds-focus-ring--visible.sc-ds-bar-nav::after{outline:var(--ds-focus-ring-width) solid var(--ds-focus-ring-color);outline-offset:calc(-1 * var(--ds-focus-ring-width))}.ds-control-inactive.sc-ds-bar-nav-h,.ds-control-inactive.sc-ds-bar-nav{opacity:0.25;pointer-events:none;cursor:not-allowed}.sc-ds-bar-nav-h{display:block}.bar-nav.sc-ds-bar-nav{display:flex;align-items:center;position:relative;height:var(--dimension-size-600);padding:var(--dimension-space-100);gap:var(--dimension-space-100);box-sizing:border-box;border-bottom:var(--dimension-stroke-width-012) solid var(--_bar-nav-border);background-color:var(--_bar-nav-bg);color:var(--_bar-nav-fg-primary);-webkit-user-select:none;user-select:none;overflow:hidden;transition:background-color var(--effect-motion-short-3), border-color var(--effect-motion-short-3), color var(--effect-motion-short-3);isolation:isolate;--_bar-nav-bg:var(--color-background-secondary);--_bar-nav-border:var(--color-border-tertiary);--_bar-nav-fg-primary:var(--color-foreground-primary);--_bar-nav-fg-secondary:var(--color-foreground-secondary);--_bar-nav-hover:var(--color-interaction-hover);--_bar-nav-pressed:var(--color-interaction-pressed);--_bar-nav-focus:var(--color-interaction-focus);--_bar-nav-dot:var(--color-foreground-bold-brand);--ds-focus-ring-color:var(--_bar-nav-focus)}.bar-nav--dashboard.sc-ds-bar-nav,.bar-nav--settings.sc-ds-bar-nav{--_bar-nav-bg:var(--color-background-secondary);--_bar-nav-border:var(--color-border-tertiary);--_bar-nav-fg-primary:var(--color-foreground-primary);--_bar-nav-fg-secondary:var(--color-foreground-secondary);--_bar-nav-hover:var(--color-interaction-hover);--_bar-nav-pressed:var(--color-interaction-pressed);--_bar-nav-focus:var(--color-interaction-focus);--_bar-nav-dot:var(--color-foreground-bold-brand)}ds-app-shell.sc-ds-bar-nav-h:not([gradient-preset='none']) .bar-nav.sc-ds-bar-nav,ds-app-shell:not([gradient-preset='none']) .sc-ds-bar-nav-h .bar-nav.sc-ds-bar-nav{background-color:transparent}.bar-nav.sc-ds-bar-nav>.sc-ds-bar-nav:not(.bar-nav__tabs-probe){position:relative;z-index:3}.bar-nav--tabs-collapsed.sc-ds-bar-nav{display:flex;gap:var(--dimension-space-100);align-items:center}.bar-nav__left.sc-ds-bar-nav{position:relative;flex:1 1 0%;min-width:0;width:0;display:flex;align-items:center}.bar-nav__tabs-visible.sc-ds-bar-nav{flex:1;min-width:0;width:100%}.bar-nav__tabs-probe.sc-ds-bar-nav{position:absolute;left:0;top:0;visibility:hidden;pointer-events:none;overflow:visible;width:max-content;max-width:none;z-index:-1}.bar-nav__tabs-probe.sc-ds-bar-nav>div.sc-ds-bar-nav{width:max-content}.bar-nav__tab-list.sc-ds-bar-nav{display:flex;align-items:center;gap:var(--dimension-space-050);position:relative;width:max-content}.bar-nav__tab.sc-ds-bar-nav{display:flex;align-items:center;justify-content:center;gap:var(--dimension-space-050);height:var(--dimension-size-400);min-width:var(--dimension-size-400);padding:var(--dimension-space-075);box-sizing:border-box;border:none;border-radius:var(--dimension-radius-025);background-color:transparent;color:var(--_bar-nav-fg-secondary);cursor:pointer;position:relative;flex-shrink:0;-webkit-user-select:none;user-select:none;transition:color var(--effect-motion-short-2)}.bar-nav__tab.sc-ds-bar-nav::after{content:'';position:absolute;inset:0;border-radius:var(--dimension-radius-025);background:transparent;pointer-events:none}.bar-nav__tab.sc-ds-bar-nav:hover::after{background:var(--_bar-nav-hover)}.bar-nav__tab.sc-ds-bar-nav:active::after{background:var(--_bar-nav-pressed)}.bar-nav__tab--selected.sc-ds-bar-nav{color:var(--_bar-nav-fg-primary)}.bar-nav__tab-label.sc-ds-bar-nav{position:relative;display:inline-flex;align-items:center;padding:0 var(--dimension-space-025);white-space:nowrap}.bar-nav__tab-label--dot.sc-ds-bar-nav{padding-right:calc(var(--dimension-space-025) + var(--dimension-space-050))}.bar-nav__tab-dot.sc-ds-bar-nav{position:absolute;top:0;right:0;pointer-events:none}.bar-nav__tab-divider.sc-ds-bar-nav{display:flex;align-items:center;justify-content:center;box-sizing:border-box;width:var(--dimension-space-100);height:var(--dimension-size-400);padding-block:var(--dimension-space-075);flex-shrink:0;pointer-events:none}.bar-nav__tab-divider-line.sc-ds-bar-nav{width:var(--dimension-stroke-width-012);align-self:stretch;background-color:var(--_bar-nav-border)}.bar-nav__tabs-pending.sc-ds-bar-nav{flex:1;min-width:0;height:var(--dimension-size-400);visibility:hidden;pointer-events:none}.bar-nav__overflow-trigger.sc-ds-bar-nav{margin-left:auto;--ds-button-unfilled-fg:var(--_bar-nav-fg-secondary);--ds-button-unfilled-fg-active:var(--_bar-nav-fg-primary);--ds-interaction-hover:var(--_bar-nav-hover);--ds-interaction-pressed:var(--_bar-nav-pressed);--ds-focus-ring-color:var(--_bar-nav-focus)}ds-text.bar-nav__heading.sc-ds-bar-nav{display:inline-flex;align-items:center;height:var(--dimension-size-400);padding-inline:var(--dimension-space-100);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;-webkit-user-select:none;user-select:none}`;const L=s(class s extends t{constructor(s){super();if(s!==false){this.__registerHost()}this.dsTabChange=i(this,"dsTabChange");this.navStyle="dashboard";this.tabs=[];this.tabsJson="";this.value="";this.basePath="";this.currentUrl="";this.moreTabsLabel="More tabs";this.resolvedTabs=[];this.urlDerivedValue="";this.hideTabsForDetailRoute=false;this.tabsCollapsed=false;this.menuOpen=false;this.tabLayoutCommitted=false;this.visibleTabs=[];this.overflowTabs=[];this.menuInitialFocusVisible=false;this.overflowRovingFocused=false;this.focusedTabId="";this.headerEl=null;this.triggerEl=null;this.menuEl=null;this.visibleTabListEl=null;this.probeTabListEl=null;this.resizeObserver=null;this.intrinsicWidthRetryCount=0;this.tabLayoutPendingFrames=0;this.panelNavTransition=new l;this.panelToolsTransition=new l;this.overflowCoalescer=b((()=>{this.updateTabsCollapsed()}));this.chromeTransitionShell=null;this.committedSection="";this.pendingSection="";this.onChromeTransitionStart=s=>{const t=v(s);if(t==="panel-nav"){this.panelNavTransition.enter();return}if(t==="panel-tools"){const t=p(s)??"opening";if(t==="closing"){this.panelToolsTransition.enter()}}};this.onChromeTransitionEnd=s=>{const t=v(s);if(t==="panel-nav"){this.panelNavTransition.exit();if(!this.panelNavTransition.isActive){this.scheduleOverflowCheck()}return}if(t==="panel-tools"){this.panelToolsTransition.exit();this.scheduleOverflowCheck()}};this.handleOverflowFocus=()=>{this.overflowRovingFocused=true};this.handleOverflowBlur=()=>{this.overflowRovingFocused=false}}get effectiveValue(){if(this.currentUrl&&this.basePath){return this.urlDerivedValue}return this.value}get renderedSelectableTabs(){const s=this.hasOverflowTabs?this.visibleTabs:this.resolvedTabs;return o(s)}get hasOverflowTabs(){return this.tabLayoutCommitted&&this.tabsCollapsed&&this.overflowTabs.length>0}syncFocusedTabId(s,t){if(t.some((t=>t.id===s&&!t.isInactive))){this.focusedTabId=s;return}const i=t.find((s=>!s.isInactive));this.focusedTabId=i?.id??""}digestTabsConfig(s){return s.map((s=>r(s)?"|":s.id)).join(",")}resetTabOverflowLayout(){this.tabLayoutCommitted=false;this.tabsCollapsed=false;this.menuOpen=false;this.menuInitialFocusVisible=false;this.intrinsicWidthRetryCount=0;this.tabLayoutPendingFrames=0;this.visibleTabs=[];this.overflowTabs=[]}onHostPropsChange(){this.applyHostProps()}onSelectionChange(){this.syncFocusedTabId(this.effectiveValue,this.renderedSelectableTabs);this.syncMenuSections();this.scheduleOverflowCheck()}onMenuOpenChange(s){if(this.menuEl){this.menuEl.open=s}}onTabsCollapsedChange(s,t){if(!s){this.menuOpen=false;this.menuInitialFocusVisible=false;this.menuEl=null}this.scheduleOverflowCheck();if(s){requestAnimationFrame((()=>{this.scheduleOverflowCheck()}))}if(s||t===undefined||t===s)return;requestAnimationFrame((()=>this.scheduleOverflowCheck()));queueMicrotask((()=>this.focusVisibleSelectedTab()))}componentWillLoad(){this.applyHostProps();this.syncFocusedTabId(this.effectiveValue,o(this.resolvedTabs))}componentDidLoad(){this.syncHostPropsIfNeeded();this.scheduleDeferredHostPropSync();this.setupOverflowObserver();this.bindChromeTransitionListeners();this.scheduleOverflowCheck()}componentDidRender(){if(this.chromeOverflowPaused()){this.syncMenuAnchor();return}this.scheduleOverflowCheck();this.syncMenuAnchor()}disconnectedCallback(){this.resizeObserver?.disconnect();this.resizeObserver=null;this.overflowCoalescer.cancel();this.unbindChromeTransitionListeners()}bindChromeTransitionListeners(){const s=this.el.closest("ds-app-shell");if(!s)return;this.chromeTransitionShell=s;s.addEventListener(f,this.onChromeTransitionStart);s.addEventListener(u,this.onChromeTransitionEnd)}unbindChromeTransitionListeners(){if(!this.chromeTransitionShell)return;this.chromeTransitionShell.removeEventListener(f,this.onChromeTransitionStart);this.chromeTransitionShell.removeEventListener(u,this.onChromeTransitionEnd);this.chromeTransitionShell=null}chromeOverflowPaused(){return this.panelNavTransition.isActive||this.panelToolsTransition.isActive}syncHostPropsIfNeeded(){if(h(this.resolvedTabs,this.tabs,this.tabsJson)){this.applyHostProps()}else if(this.currentUrl&&this.basePath){this.syncValueFromUrl()}}scheduleDeferredHostPropSync(){let t=s.HOST_PROP_SYNC_BUDGET;const i=()=>{this.syncHostPropsIfNeeded();if(--t>0){requestAnimationFrame(i)}};queueMicrotask(i)}setupOverflowObserver(){if(typeof ResizeObserver==="undefined"||!this.headerEl)return;this.resizeObserver?.disconnect();this.resizeObserver=new ResizeObserver((()=>{if(this.chromeOverflowPaused())return;this.scheduleOverflowCheck()}));this.resizeObserver.observe(this.headerEl)}scheduleOverflowCheck(){if(this.chromeOverflowPaused())return;this.overflowCoalescer.schedule()}getLeftZoneAvailableWidth(){if(!this.headerEl)return 0;const s=getComputedStyle(this.headerEl);const t=(parseFloat(s.paddingLeft)||0)+(parseFloat(s.paddingRight)||0);return Math.max(0,this.headerEl.clientWidth-t)}getTabsIntrinsicWidth(){return this.probeTabListEl?.scrollWidth??0}getHeaderGap(){if(!this.headerEl)return 0;const s=getComputedStyle(this.headerEl);return parseFloat(s.columnGap||s.gap)||0}getOverflowTriggerReserveWidth(){if(!this.triggerEl){return 40}return this.triggerEl.getBoundingClientRect().width+this.getHeaderGap()}getProbeTabMetrics(){const s=this.probeTabListEl;if(!s)return null;const t=Array.from(s.children);const i=t.map((s=>s.getBoundingClientRect().width));if(i.length===0||i.some((s=>s===0)))return null;const e=getComputedStyle(s);const a=parseFloat(e.columnGap||e.gap)||0;const n=i.reduce(((s,t)=>s+t),0);const r=a*Math.max(0,i.length-1);const o=Math.max(0,s.scrollWidth-n-r);return{itemWidths:i,itemGap:a,listExtraWidth:o}}setOverflowTabLayout(s,t){const i=t.length>0;const e=this.digestTabsConfig(s)!==this.digestTabsConfig(this.visibleTabs);const a=this.digestTabsConfig(t)!==this.digestTabsConfig(this.overflowTabs);if(e){this.visibleTabs=s}if(a){this.overflowTabs=t}if(i!==this.tabsCollapsed){this.tabsCollapsed=i;if(!i){this.menuOpen=false}}this.syncFocusedTabId(this.effectiveValue,o(i?s:this.resolvedTabs))}scheduleIntrinsicWidthRetry(){if(this.intrinsicWidthRetryCount>=s.INTRINSIC_WIDTH_RETRY_MAX)return;this.intrinsicWidthRetryCount++;requestAnimationFrame((()=>this.scheduleOverflowCheck()))}forceTabLayoutCommit(s){this.intrinsicWidthRetryCount=0;this.tabLayoutPendingFrames=0;this.setOverflowTabLayout(s?[]:this.resolvedTabs,s?this.resolvedTabs:[]);this.tabLayoutCommitted=true}updateTabsCollapsed(){if(!this.headerEl||this.resolvedTabs.length===0||this.hideTabsForDetailRoute){if(this.tabsCollapsed){this.setOverflowTabLayout([],[])}this.intrinsicWidthRetryCount=0;this.tabLayoutPendingFrames=0;this.tabLayoutCommitted=true;return}const t=this.getProbeTabMetrics();const i=this.getTabsIntrinsicWidth();if(!t||i===0){this.tabLayoutPendingFrames+=1;if(this.intrinsicWidthRetryCount>=s.INTRINSIC_WIDTH_RETRY_MAX){this.forceTabLayoutCommit(false)}else if(this.tabLayoutPendingFrames>=s.TAB_LAYOUT_COMMIT_MAX_FRAMES){this.forceTabLayoutCommit(false)}else{this.scheduleIntrinsicWidthRetry()}return}this.intrinsicWidthRetryCount=0;this.tabLayoutPendingFrames=0;const e=E(i,this.getLeftZoneAvailableWidth(),this.tabsCollapsed,s.OVERFLOW_HYSTERESIS_PX);if(!e){this.setOverflowTabLayout(this.resolvedTabs,[]);this.tabLayoutCommitted=true;return}const a=F(t.itemWidths,this.getLeftZoneAvailableWidth(),this.getOverflowTriggerReserveWidth(),t.itemGap,t.listExtraWidth);const n=M(this.resolvedTabs.slice(0,a));const r=this.resolvedTabs.slice(n.length);this.setOverflowTabLayout(n,r);this.tabLayoutCommitted=true}syncMenuAnchor(){if(!this.menuEl||!this.triggerEl||!this.hasOverflowTabs)return;this.menuEl.anchor=this.triggerEl;this.syncMenuSections()}handleMenuSelect(s){const t=s.detail;if(t?.value!==undefined){this.selectTab(String(t.value))}this.menuOpen=false;this.menuInitialFocusVisible=false}handleMenuClose(){this.menuOpen=false;this.menuInitialFocusVisible=false}incomingTabs(){return this.tabsJson?d(this.tabsJson,[]):this.tabs??[]}applyHostProps(){const s=this.basePath;const t=s!==""&&this.committedSection!==""&&s!==this.committedSection;if(t){this.urlDerivedValue="";this.committedSection="";this.pendingSection=s;this.resolvedTabs=[];this.resetTabOverflowLayout();return}if(this.pendingSection){if(!s||s!==this.pendingSection){return}if(!this.currentUrl.startsWith(this.pendingSection)){return}const t=this.incomingTabs();if(t.length===0){return}this.pendingSection=""}const i=this.incomingTabs();const e=this.digestTabsConfig(i)!==this.digestTabsConfig(this.resolvedTabs);this.resolvedTabs=i;this.syncValueFromUrl();this.committedSection=s;if(e){this.resetTabOverflowLayout()}this.scheduleOverflowCheck()}syncMenuSections(){if(!this.menuEl)return;this.menuEl.sections=O(this.overflowTabs,this.effectiveValue)}syncValueFromUrl(){const s=this.incomingTabs();if(!this.currentUrl||!this.basePath){this.urlDerivedValue="";this.hideTabsForDetailRoute=false;return}if(!this.currentUrl.startsWith(this.basePath)){this.urlDerivedValue="";this.hideTabsForDetailRoute=false;return}const{value:t,hideTabs:i}=c(this.currentUrl,this.basePath,s);this.urlDerivedValue=t;this.hideTabsForDetailRoute=i}selectTab(s){this.value=s;this.dsTabChange.emit(s)}focusVisibleSelectedTab(){const s=this.visibleTabListEl?.querySelector(`[data-tab-id="${this.effectiveValue}"]`);s?.focus({preventScroll:true})}focusVisibleTab(s){this.focusedTabId=s;const t=this.visibleTabListEl?.querySelector(`[data-tab-id="${s}"]`);t?.focus({preventScroll:true})}focusLastVisibleTab(){const s=[...this.renderedSelectableTabs].reverse().find((s=>!s.isInactive));if(s)this.focusVisibleTab(s.id)}findEnabledVisibleTab(s,t){const i=this.renderedSelectableTabs;for(let e=s+t;e>=0&&e<i.length;e+=t){if(!i[e]?.isInactive)return e}return null}handleTabKeyDown(s){const t=this.renderedSelectableTabs;if(!t.length)return;const i=s.target?.getAttribute("data-tab-id");const e=i??this.focusedTabId;if(s.key==="Enter"||s.key===" "){const i=t.find((s=>s.id===e));if(!i||i.isInactive)return;s.preventDefault();this.selectTab(i.id);return}const a=t.findIndex((s=>s.id===e));if(a<0)return;let n;if(s.key==="ArrowRight"){n=this.findEnabledVisibleTab(a,1);if(n===null&&this.hasOverflowTabs){s.preventDefault();this.overflowRovingFocused=true;void this.triggerEl?.setFocus?.();return}}else if(s.key==="ArrowLeft"){n=this.findEnabledVisibleTab(a,-1)}else if(s.key==="Home"){n=t.findIndex((s=>!s.isInactive))}else if(s.key==="End"){const s=[...t].reverse().findIndex((s=>!s.isInactive));n=s<0?null:t.length-1-s}else{return}if(n===null||n<0||n===a)return;s.preventDefault();this.focusVisibleTab(t[n].id)}toggleTabMenu(s){if(this.menuOpen){this.menuOpen=false;this.menuInitialFocusVisible=false;return}if(this.menuEl&&this.triggerEl){this.menuEl.anchor=this.triggerEl;this.menuEl.minWidth="";this.syncMenuSections()}this.menuInitialFocusVisible=s?.focusVisible??false;this.menuOpen=true}handleTriggerKeyDown(s){if(!this.hasOverflowTabs)return;if(!this.menuOpen){if(s.key==="ArrowLeft"){s.preventDefault();this.overflowRovingFocused=false;this.focusLastVisibleTab();return}if(s.key==="Enter"||s.key===" "){s.preventDefault();this.toggleTabMenu({focusVisible:true})}return}if(s.key==="Escape"){s.preventDefault();this.menuOpen=false;this.menuInitialFocusVisible=false;void this.triggerEl?.setFocus?.()}}renderTabList(s,t){return e("div",{role:"tablist",class:"bar-nav__tab-list","aria-label":this.heading,ref:s=>{if(t){const t=s??null;if(t===this.probeTabListEl)return;this.probeTabListEl=t;if(t){this.intrinsicWidthRetryCount=0;this.tabLayoutPendingFrames=0;this.scheduleOverflowCheck()}}else{this.visibleTabListEl=s??null}},onKeyDown:t?undefined:s=>this.handleTabKeyDown(s),onFocusin:t?undefined:()=>{this.overflowRovingFocused=false}},s.map(((s,i)=>{if(r(s)){return e("div",{class:"bar-nav__tab-divider",key:`divider-${i}`,"aria-hidden":"true"},e("div",{class:"bar-nav__tab-divider-line"}))}const a=s.id===this.effectiveValue;return e("button",{key:s.id,type:"button",role:"tab","data-tab-id":s.id,class:{"bar-nav__tab":true,"bar-nav__tab--selected":a,"ds-focus-ring-inset":true,"ds-control-inactive":!!s.isInactive},"aria-selected":a?"true":"false","aria-disabled":s.isInactive?"true":undefined,"aria-controls":s.panelId??undefined,disabled:s.isInactive,tabIndex:!t&&!this.overflowRovingFocused&&s.id===this.focusedTabId?0:-1,onClick:()=>!t&&!s.isInactive&&this.selectTab(s.id),onFocus:()=>{if(!t)this.focusedTabId=s.id}},e("span",{class:{"bar-nav__tab-label":true,"bar-nav__tab-label--dot":!!s.dot}},e("ds-text",{as:"span",variant:"text-body-medium",emphasis:a,color:"inherit"},s.label),s.dot&&e("ds-badge",{class:"bar-nav__tab-dot",variant:"dot",hasRing:false,label:"","aria-hidden":"true"})))})))}render(){const s=this.basePath===""||this.committedSection===this.basePath;const t=s&&this.resolvedTabs.length>0&&!this.hideTabsForDetailRoute;const i=this.basePath||"no-section";const n=this.hasOverflowTabs?this.visibleTabs:this.resolvedTabs;return e(a,{key:"5ccc6a0b16deaf5e9a0059ce6901fdf9733bcb14"},e("header",{key:"fcc1456249a473d53d81c6a1e13b17abf8b4d17b",class:{"bar-nav":true,"bar-nav--dashboard":this.navStyle==="dashboard","bar-nav--settings":this.navStyle==="settings","bar-nav--tabs-collapsed":t&&this.hasOverflowTabs},ref:s=>{this.headerEl=s;if(s&&!this.resizeObserver){this.setupOverflowObserver()}}},t&&e("div",{key:"89d48a9428c94ee346929fc3bcbeb3adf602392c",class:"bar-nav__tabs-probe","aria-hidden":"true",inert:true},e("div",{key:`probe-${i}`},this.renderTabList(this.resolvedTabs,true))),t&&this.tabLayoutCommitted&&n.length>0&&e("div",{key:"406aaff4dd59a4fcf6eefbffacd56a67575caea3",class:"bar-nav__left"},e("div",{key:`visible-${i}`,class:"bar-nav__tabs-visible"},this.renderTabList(n,false))),t&&!this.tabLayoutCommitted&&e("div",{key:"fda1b1c2521bb372d6936d60683a14dd4c759c8d",class:"bar-nav__tabs-pending","aria-hidden":"true"}),!t&&this.heading&&e("ds-text",{key:"a21f0721124633987cbe492bb15155e57c640ffd",class:"bar-nav__heading",as:"span",variant:"text-body-medium",emphasis:true,color:"primary",wrap:"nowrap"},this.heading),t&&this.hasOverflowTabs&&e("ds-button-unfilled",{key:"73c7d943a2fc9e5ab2b2abe69d7a8fa620ba9601",variant:"icon",class:{"bar-nav__overflow-trigger":true},icon:"Ellipses",isActive:this.menuOpen,activeFill:false,hasBorder:false,focusTabIndex:this.overflowRovingFocused?0:-1,ref:s=>{this.triggerEl=s??null},haspopup:"menu",expanded:this.menuOpen,"aria-label":this.moreTabsLabel,onDsClick:()=>this.toggleTabMenu({focusVisible:false}),onFocusin:this.handleOverflowFocus,onFocusout:this.handleOverflowBlur,onKeyDown:s=>this.handleTriggerKeyDown(s)})),t&&this.hasOverflowTabs&&e("ds-menu",{key:"d237154c420b197683b34f4b0e181a8bdfee1c19",ref:s=>{this.menuEl=s??null},open:this.menuOpen,sections:O(this.overflowTabs,this.effectiveValue),side:"bottom",align:"end",sideOffset:"calc(var(--dimension-space-100) + var(--dimension-space-050))",alignOffset:"var(--dimension-space-050)",initialFocusVisible:this.menuInitialFocusVisible,onDsSelect:s=>this.handleMenuSelect(s),onDsClose:()=>this.handleMenuClose()}))}get el(){return this}static get watchers(){return{tabs:[{onHostPropsChange:0}],tabsJson:[{onHostPropsChange:0}],currentUrl:[{onHostPropsChange:0}],basePath:[{onHostPropsChange:0}],value:[{onSelectionChange:0}],urlDerivedValue:[{onSelectionChange:0}],menuOpen:[{onMenuOpenChange:0}],tabsCollapsed:[{onTabsCollapsedChange:0}]}}static get style(){return D()}},[2,"ds-bar-nav",{navStyle:[513,"nav-style"],tabs:[16],tabsJson:[1,"tabs-json"],value:[1025],heading:[1],basePath:[1,"base-path"],currentUrl:[1,"current-url"],moreTabsLabel:[1,"more-tabs-label"],resolvedTabs:[32],urlDerivedValue:[32],hideTabsForDetailRoute:[32],tabsCollapsed:[32],menuOpen:[32],tabLayoutCommitted:[32],visibleTabs:[32],overflowTabs:[32],menuInitialFocusVisible:[32],overflowRovingFocused:[32],focusedTabId:[32],committedSection:[32],pendingSection:[32]},undefined,{tabs:[{onHostPropsChange:0}],tabsJson:[{onHostPropsChange:0}],currentUrl:[{onHostPropsChange:0}],basePath:[{onHostPropsChange:0}],value:[{onSelectionChange:0}],urlDerivedValue:[{onSelectionChange:0}],menuOpen:[{onMenuOpenChange:0}],tabsCollapsed:[{onTabsCollapsedChange:0}]}]);L.HOST_PROP_SYNC_BUDGET=8;L.INTRINSIC_WIDTH_RETRY_MAX=3;L.TAB_LAYOUT_COMMIT_MAX_FRAMES=16;L.OVERFLOW_HYSTERESIS_PX=8;function z(){if(typeof customElements==="undefined"){return}const s=["ds-bar-nav","ds-badge","ds-button-unfilled","ds-icon","ds-loader","ds-menu","ds-shell-gradient-picker","ds-shell-gradient-swatch","ds-switch","ds-text"];s.forEach((s=>{switch(s){case"ds-bar-nav":if(!customElements.get(n(s))){customElements.define(n(s),L)}break;case"ds-badge":if(!customElements.get(n(s))){g()}break;case"ds-button-unfilled":if(!customElements.get(n(s))){m()}break;case"ds-icon":if(!customElements.get(n(s))){_()}break;case"ds-loader":if(!customElements.get(n(s))){y()}break;case"ds-menu":if(!customElements.get(n(s))){w()}break;case"ds-shell-gradient-picker":if(!customElements.get(n(s))){k()}break;case"ds-shell-gradient-swatch":if(!customElements.get(n(s))){C()}break;case"ds-switch":if(!customElements.get(n(s))){x()}break;case"ds-text":if(!customElements.get(n(s))){T()}break}}))}z();const H=L;const V=z;export{H as DsBarNav,V as defineCustomElement};
|
|
2
2
|
//# sourceMappingURL=ds-bar-nav.js.map
|
|
@@ -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","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","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","background","render","sectionReady","hasTabs","tabGroupKey","renderedTabs","Host","inert","wrap","icon","activeFill","hasBorder","focusTabIndex","haspopup","expanded","onDsClick","onFocusout","side","align","sideOffset","alignOffset","initialFocusVisible","onDsSelect","onDsClose"],"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/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-app-shell: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(--dimension-space-050);\n height: var(--dimension-size-400);\n min-width: var(--dimension-size-400);\n padding: var(--dimension-space-075);\n box-sizing: border-box;\n border: none;\n border-radius: var(--dimension-radius-025);\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(--dimension-radius-025);\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(--dimension-space-025);\n white-space: nowrap;\n}\n\n.bar-nav__tab-label--dot {\n padding-right: calc(var(--dimension-space-025) + var(--dimension-space-050));\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(--dimension-size-400);\n padding-block: var(--dimension-space-075);\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(--dimension-size-400);\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(--dimension-size-400);\n padding-inline: var(--dimension-space-100);\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 /** 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.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.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('ds-app-shell');\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 }\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 /** 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.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-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 background=\"var(--_bar-nav-bg)\"\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 '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 isActive={this.menuOpen}\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.menuOpen}\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 alignOffset=\"var(--dimension-space-050)\"\n initialFocusVisible={this.menuInitialFocusVisible}\n onDsSelect={(e: Event) => this.handleMenuSelect(e)}\n onDsClose={() => this.handleMenuClose()}\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","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","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","alignOffset","initialFocusVisible","onDsSelect","onDsClose"],"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/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-app-shell: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(--dimension-space-050);\n height: var(--dimension-size-400);\n min-width: var(--dimension-size-400);\n padding: var(--dimension-space-075);\n box-sizing: border-box;\n border: none;\n border-radius: var(--dimension-radius-025);\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(--dimension-radius-025);\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(--dimension-space-025);\n white-space: nowrap;\n}\n\n.bar-nav__tab-label--dot {\n padding-right: calc(var(--dimension-space-025) + var(--dimension-space-050));\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(--dimension-size-400);\n padding-block: var(--dimension-space-075);\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(--dimension-size-400);\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(--dimension-size-400);\n padding-inline: var(--dimension-space-100);\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 /** 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.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.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('ds-app-shell');\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 }\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 /** 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.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-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 '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 isActive={this.menuOpen}\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.menuOpen}\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 alignOffset=\"var(--dimension-space-050)\"\n initialFocusVisible={this.menuInitialFocusVisible}\n onDsSelect={(e: Event) => this.handleMenuSelect(e)}\n onDsClose={() => this.handleMenuClose()}\n />\n )}\n </Host>\n );\n }\n}\n"],"mappings":"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","ignoreList":[]}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{B as
|
|
1
|
+
import{B as s,d as o}from"./p-COzps7J4.js";const p=s;const t=o;export{p as DsButtonFilled,t as defineCustomElement};
|
|
2
2
|
//# sourceMappingURL=ds-button-filled.js.map
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{B as o,d as s}from"./p-
|
|
1
|
+
import{B as o,d as s}from"./p-_zP4v-Al.js";const t=o;const p=s;export{t as DsButtonUnfilled,p as defineCustomElement};
|
|
2
2
|
//# sourceMappingURL=ds-button-unfilled.js.map
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{p as t,H as
|
|
1
|
+
import{p as t,H as a,c as d,h as e,a as s,t as i}from"./index.js";import{d as c}from"./p-JsVSx7ZR.js";import{d as n}from"./p-_zP4v-Al.js";import{d as o}from"./p-B2FhhQba.js";import{d as r}from"./p-BMbadvZo.js";import{d as l}from"./p-wxw8arTd.js";import{d as h}from"./p-CwaC4wLu.js";const f=()=>`.sc-ds-card-data-viz-donut-h{display:contents}.card-data-viz-donut__layout.sc-ds-card-data-viz-donut{display:flex;flex-direction:column;flex:1 1 auto;min-height:0;height:100%;gap:var(--dimension-space-200);box-sizing:border-box}.card-data-viz-donut__chart-region.sc-ds-card-data-viz-donut{flex:1 1 auto;min-height:0;display:grid;padding:var(--dimension-space-400) var(--dimension-space-400) 0 var(--dimension-space-400);box-sizing:border-box}.card-data-viz-donut__chart-region.sc-ds-card-data-viz-donut>*.sc-ds-card-data-viz-donut{width:100%;height:100%;min-width:0;min-height:0;max-width:100%;max-height:100%}.card-data-viz-donut__legend-region.sc-ds-card-data-viz-donut{flex:0 0 auto;padding:0 var(--dimension-space-100) var(--dimension-space-100) var(--dimension-space-100);box-sizing:border-box}`;const b=t(class t extends a{constructor(t){super();if(t!==false){this.__registerHost()}this.dsFilterClick=d(this,"dsFilterClick");this.cardWidth="md";this.filterLabel="Filter";this.hasChartSlot=false;this.hasLegendSlot=false;this.handleChartHover=t=>{const a=this.el.querySelector('[slot="legend"]');if(!a||!("activeLabel"in a))return;a.activeLabel=t.detail?.label??null};this.handleLegendHover=t=>{const a=this.el.querySelector('[slot="chart"]');if(!a||!("activeLabel"in a))return;a.activeLabel=t.detail?.label??null};this.handleFilterClick=()=>{this.dsFilterClick.emit()}}componentWillRender(){this.hasChartSlot=!!this.el.querySelector('[slot="chart"]');this.hasLegendSlot=!!this.el.querySelector('[slot="legend"]')}componentDidLoad(){this.el.addEventListener("dsSliceHover",this.handleChartHover);this.el.addEventListener("dsItemHover",this.handleLegendHover)}disconnectedCallback(){this.el.removeEventListener("dsSliceHover",this.handleChartHover);this.el.removeEventListener("dsItemHover",this.handleLegendHover)}render(){return e(s,{key:"fdbc290be1fe5695d6d2e378ac9fbeef57add6d3",class:"card-data-viz-donut"},e("ds-card",{key:"b9c9d0f0c827b4d2cb57fbb4b2811ad64275e252",heading:this.heading,cardWidth:this.cardWidth},e("ds-button-unfilled",{key:"49b0a49f0eea793f3deb9180cc37c62bc7641311",slot:"actions",variant:"icon",type:"button",icon:"Filters","aria-label":this.filterLabel,onDsClick:this.handleFilterClick}),e("div",{key:"bbabbb340812512e1327645aa7f9103cb8a17540",class:"card-data-viz-donut__layout"},this.hasChartSlot&&e("div",{key:"52ba1cf13c8927b2072ff3f9afbc8472f6e8f7c5",class:"card-data-viz-donut__chart-region"},e("slot",{key:"8833da8d26d917787f88ec219fe25d266f47b35d",name:"chart"})),this.hasLegendSlot&&e("div",{key:"8765cb32805a80e44c47150dc7bdae68e6d5fefc",class:"card-data-viz-donut__legend-region"},e("slot",{key:"df94fe2b3d4a539099c698f8dccad028e8b5865b",name:"legend"})))))}get el(){return this}static get style(){return f()}},[262,"ds-card-data-viz-donut",{heading:[1],cardWidth:[1,"card-width"],filterLabel:[1,"filter-label"],hasChartSlot:[32],hasLegendSlot:[32]}]);function m(){if(typeof customElements==="undefined"){return}const t=["ds-card-data-viz-donut","ds-badge","ds-button-unfilled","ds-card","ds-icon","ds-loader","ds-text"];t.forEach((t=>{switch(t){case"ds-card-data-viz-donut":if(!customElements.get(i(t))){customElements.define(i(t),b)}break;case"ds-badge":if(!customElements.get(i(t))){c()}break;case"ds-button-unfilled":if(!customElements.get(i(t))){n()}break;case"ds-card":if(!customElements.get(i(t))){o()}break;case"ds-icon":if(!customElements.get(i(t))){r()}break;case"ds-loader":if(!customElements.get(i(t))){l()}break;case"ds-text":if(!customElements.get(i(t))){h()}break}}))}m();const u=b;const v=m;export{u as DsCardDataVizDonut,v as defineCustomElement};
|
|
2
2
|
//# sourceMappingURL=ds-card-data-viz-donut.js.map
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{p as s,H as t,c as e,h as a,a as i,t as d}from"./index.js";import{d as n}from"./p-
|
|
1
|
+
import{p as s,H as t,c as e,h as a,a as i,t as d}from"./index.js";import{d as n}from"./p-JsVSx7ZR.js";import{d as c}from"./p-COzps7J4.js";import{d as o}from"./p-_zP4v-Al.js";import{d as r}from"./p-B2FhhQba.js";import{d as l}from"./p-BMbadvZo.js";import{d as f}from"./p-wxw8arTd.js";import{d as b}from"./p-CwaC4wLu.js";const m=()=>`.sc-ds-card-setting-h{display:contents}.card-setting__actions.sc-ds-card-setting{display:flex;flex-shrink:0;align-items:center;gap:var(--dimension-space-100)}`;const u=s(class s extends t{constructor(s){super();if(s!==false){this.__registerHost()}this.dsEditingChange=e(this,"dsEditingChange");this.cardWidth="md";this.editing=false;this.editLabel="Edit";this.cancelLabel="Cancel";this.saveLabel="Save";this.enterEdit=()=>{this.dsEditingChange.emit(true)};this.exitEdit=()=>{this.dsEditingChange.emit(false)}}render(){const s=this.editing;return a(i,{key:"da4d9dd77ddf5ca9a4eff4d74a59c07a7068a738",class:"card-setting"},a("ds-card",{key:"1d80c67ab1ea557608115964b57fdd75547aa616",heading:this.heading,cardWidth:this.cardWidth,appearance:s?"editing":"default"},!s?a("ds-button-unfilled",{slot:"actions",variant:"icon",type:"button",icon:"Pencil","aria-label":this.editLabel,onDsClick:this.enterEdit}):a("div",{slot:"actions",class:"card-setting__actions"},a("ds-button-unfilled",{variant:"icon",type:"button",icon:"Cross",background:"bold","aria-label":this.cancelLabel,onDsClick:this.exitEdit}),a("ds-button-filled",{variant:"icon",type:"button",icon:"Check",intent:"brand",contrast:"faint","aria-label":this.saveLabel,onDsClick:this.exitEdit})),a("slot",{key:"0fcf3abc7b9a9f82bd5f68f87e0bcd4d24677503"})))}static get style(){return m()}},[262,"ds-card-setting",{heading:[1],cardWidth:[1,"card-width"],editing:[4],editLabel:[1,"edit-label"],cancelLabel:[1,"cancel-label"],saveLabel:[1,"save-label"]}]);function h(){if(typeof customElements==="undefined"){return}const s=["ds-card-setting","ds-badge","ds-button-filled","ds-button-unfilled","ds-card","ds-icon","ds-loader","ds-text"];s.forEach((s=>{switch(s){case"ds-card-setting":if(!customElements.get(d(s))){customElements.define(d(s),u)}break;case"ds-badge":if(!customElements.get(d(s))){n()}break;case"ds-button-filled":if(!customElements.get(d(s))){c()}break;case"ds-button-unfilled":if(!customElements.get(d(s))){o()}break;case"ds-card":if(!customElements.get(d(s))){r()}break;case"ds-icon":if(!customElements.get(d(s))){l()}break;case"ds-loader":if(!customElements.get(d(s))){f()}break;case"ds-text":if(!customElements.get(d(s))){b()}break}}))}h();const p=u;const g=h;export{p as DsCardSetting,g as defineCustomElement};
|
|
2
2
|
//# sourceMappingURL=ds-card-setting.js.map
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{C as o,d as s}from"./p-
|
|
1
|
+
import{C as o,d as s}from"./p-B2FhhQba.js";const t=o;const a=s;export{t as DsCard,a as defineCustomElement};
|
|
2
2
|
//# sourceMappingURL=ds-card.js.map
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{p as t,H as a,h as r,a as s,t as e}from"./index.js";import{c as i}from"./p-CMv_7vFs.js";import{m as c,b as o,l as n}from"./p-CzBnvtcz.js";const h=()=>`.sc-ds-chart-bar-h{display:inline-flex;font-family:var(--typography-font-family)}.chart-bar__gridline.sc-ds-chart-bar{stroke:var(--color-border-tertiary);stroke-width:1}.chart-bar__axis-label.sc-ds-chart-bar{fill:var(--color-foreground-tertiary);font-family:var(--typography-font-family);font-size:var(--typography-fontsize-xs);font-weight:var(--typography-weight-medium);letter-spacing:var(--typography-letterspacing-positive);text-transform:uppercase}.chart-bar__bar.sc-ds-chart-bar{rx:var(--dimension-radius-050)}`;const l={top:16,right:16,bottom:24,left:32};const
|
|
1
|
+
import{p as t,H as a,h as r,a as s,t as e}from"./index.js";import{c as i}from"./p-CMv_7vFs.js";import{m as c,b as o,l as n}from"./p-CzBnvtcz.js";const h=()=>`.sc-ds-chart-bar-h{display:inline-flex;font-family:var(--typography-font-family)}.chart-bar__gridline.sc-ds-chart-bar{stroke:var(--color-border-tertiary);stroke-width:1}.chart-bar__axis-label.sc-ds-chart-bar{fill:var(--color-foreground-tertiary);font-family:var(--typography-font-family);font-size:var(--typography-fontsize-xs);font-weight:var(--typography-weight-medium);letter-spacing:var(--typography-letterspacing-positive);text-transform:uppercase}.chart-bar__bar.sc-ds-chart-bar{rx:var(--dimension-radius-050)}`;const l={top:16,right:16,bottom:24,left:32};const f=t(class t extends a{constructor(t){super();if(t!==false){this.__registerHost()}this.data=[];this.width=480;this.height=240}render(){const t=this.width-l.left-l.right;const a=this.height-l.top-l.bottom;const e=c(this.data,(t=>t.value))??0;const h=o().domain(this.data.map((t=>t.label))).range([0,t]).padding(.35);const f=n().domain([0,e||1]).range([a,0]).nice();const b=f.ticks(4);return r(s,{key:"1babf8960184176302c43338ae46c1e248fdab12",class:"chart-bar"},r("svg",{key:"b606e4280dfef5ba421e49931b45ea727f0a9609",class:"chart-bar__svg",viewBox:`0 0 ${this.width} ${this.height}`,width:this.width,height:this.height,role:"img","aria-label":this.data.map((t=>`${t.label}: ${t.value}`)).join(", ")},r("g",{key:"4b9d32c51060f6258859e2b7afdfcce2a855e6b9",transform:`translate(${l.left}, ${l.top})`},b.map((a=>r("g",{key:`grid-${a}`,transform:`translate(0, ${f(a)})`},r("line",{class:"chart-bar__gridline",x1:0,x2:t}),r("text",{class:"chart-bar__axis-label",x:-8,"text-anchor":"end","dominant-baseline":"middle"},a)))),this.data.map(((t,s)=>{const e=h.bandwidth();const c=h(t.label)??0;const o=f(t.value);return r("g",{key:t.label},r("rect",{class:"chart-bar__bar",x:c,y:o,width:e,height:a-o,fill:t.color??i(s)}),r("text",{class:"chart-bar__axis-label",x:c+e/2,y:a+16,"text-anchor":"middle"},t.label))})))))}static get style(){return h()}},[2,"ds-chart-bar",{data:[16],width:[2],height:[2]}]);function b(){if(typeof customElements==="undefined"){return}const t=["ds-chart-bar"];t.forEach((t=>{switch(t){case"ds-chart-bar":if(!customElements.get(e(t))){customElements.define(e(t),f)}break}}))}b();const d=f;const m=b;export{d as DsChartBar,m as defineCustomElement};
|
|
2
2
|
//# sourceMappingURL=ds-chart-bar.js.map
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{p as t,H as n,c as e,h as i,a as s,t as r}from"./index.js";import{c as o}from"./p-CMv_7vFs.js";import{T as a}from"./p-drBA73M_.js";import{r as c}from"./p-BWUTr_XN.js";import{f as h}from"./p-BBpASejH.js";import{w as u,c as l,a as f}from"./p-CrCGIx8s.js";function d(t,n,e){t.textContent=n;if(e<=0||t.getComputedTextLength()<=e)return n;let i=0;let s=n.length;while(i<s){const r=Math.ceil((i+s)/2);t.textContent=`${n.slice(0,r)}…`;if(t.getComputedTextLength()<=e){i=r}else{s=r-1}}return i>0?`${n.slice(0,i)}…`:"…"}const p=Math.abs;const y=Math.atan2;const g=Math.cos;const v=Math.max;const m=Math.min;const b=Math.sin;const x=Math.sqrt;const M=1e-12;const _=Math.PI;const w=_/2;const z=2*_;function k(t){return t>1?0:t<-1?_:Math.acos(t)}function $(t){return t>=1?w:t<=-1?-w:Math.asin(t)}function A(t){return t.innerRadius}function C(t){return t.outerRadius}function S(t){return t.startAngle}function j(t){return t.endAngle}function B(t){return t&&t.padAngle}function R(t,n,e,i,s,r,o,a){var c=e-t,h=i-n,u=o-s,l=a-r,f=l*c-u*h;if(f*f<M)return;f=(u*(n-r)-l*(t-s))/f;return[t+f*c,n+f*h]}function L(t,n,e,i,s,r,o){var a=t-e,c=n-i,h=(o?r:-r)/x(a*a+c*c),u=h*c,l=-h*a,f=t+u,d=n+l,p=e+u,y=i+l,g=(f+p)/2,m=(d+y)/2,b=p-f,M=y-d,_=b*b+M*M,w=s-r,z=f*y-p*d,k=(M<0?-1:1)*x(v(0,w*w*_-z*z)),$=(z*M-b*k)/_,A=(-z*b-M*k)/_,C=(z*M+b*k)/_,S=(-z*b+M*k)/_,j=$-g,B=A-m,R=C-g,L=S-m;if(j*j+B*B>R*R+L*L)$=C,A=S;return{cx:$,cy:A,x01:-u,y01:-l,x11:$*(s/w-1),y11:A*(s/w-1)}}function N(){var t=A,n=C,e=l(0),i=null,s=S,r=j,o=B,a=null,c=u(h);function h(){var h,u,l=+t.apply(this,arguments),f=+n.apply(this,arguments),d=s.apply(this,arguments)-w,v=r.apply(this,arguments)-w,A=p(v-d),C=v>d;if(!a)a=h=c();if(f<l)u=f,f=l,l=u;if(!(f>M))a.moveTo(0,0);else if(A>z-M){a.moveTo(f*g(d),f*b(d));a.arc(0,0,f,d,v,!C);if(l>M){a.moveTo(l*g(v),l*b(v));a.arc(0,0,l,v,d,C)}}else{var S=d,j=v,B=d,N=v,P=A,E=A,F=o.apply(this,arguments)/2,H=F>M&&(i?+i.apply(this,arguments):x(l*l+f*f)),O=m(p(f-l)/2,+e.apply(this,arguments)),T=O,D=O,V,G;if(H>M){var I=$(H/l*b(F)),U=$(H/f*b(F));if((P-=I*2)>M)I*=C?1:-1,B+=I,N-=I;else P=0,B=N=(d+v)/2;if((E-=U*2)>M)U*=C?1:-1,S+=U,j-=U;else E=0,S=j=(d+v)/2}var W=f*g(S),X=f*b(S),q=l*g(N),J=l*b(N);if(O>M){var K=f*g(j),Q=f*b(j),Y=l*g(B),Z=l*b(B),tt;if(A<_){if(tt=R(W,X,Y,Z,K,Q,q,J)){var nt=W-tt[0],et=X-tt[1],it=K-tt[0],st=Q-tt[1],rt=1/b(k((nt*it+et*st)/(x(nt*nt+et*et)*x(it*it+st*st)))/2),ot=x(tt[0]*tt[0]+tt[1]*tt[1]);T=m(O,(l-ot)/(rt-1));D=m(O,(f-ot)/(rt+1))}else{T=D=0}}}if(!(E>M))a.moveTo(W,X);else if(D>M){V=L(Y,Z,W,X,f,D,C);G=L(K,Q,q,J,f,D,C);a.moveTo(V.cx+V.x01,V.cy+V.y01);if(D<O)a.arc(V.cx,V.cy,D,y(V.y01,V.x01),y(G.y01,G.x01),!C);else{a.arc(V.cx,V.cy,D,y(V.y01,V.x01),y(V.y11,V.x11),!C);a.arc(0,0,f,y(V.cy+V.y11,V.cx+V.x11),y(G.cy+G.y11,G.cx+G.x11),!C);a.arc(G.cx,G.cy,D,y(G.y11,G.x11),y(G.y01,G.x01),!C)}}else a.moveTo(W,X),a.arc(0,0,f,S,j,!C);if(!(l>M)||!(P>M))a.lineTo(q,J);else if(T>M){V=L(q,J,K,Q,l,-T,C);G=L(W,X,Y,Z,l,-T,C);a.lineTo(V.cx+V.x01,V.cy+V.y01);if(T<O)a.arc(V.cx,V.cy,T,y(V.y01,V.x01),y(G.y01,G.x01),!C);else{a.arc(V.cx,V.cy,T,y(V.y01,V.x01),y(V.y11,V.x11),!C);a.arc(0,0,l,y(V.cy+V.y11,V.cx+V.x11),y(G.cy+G.y11,G.cx+G.x11),C);a.arc(G.cx,G.cy,T,y(G.y11,G.x11),y(G.y01,G.x01),!C)}}else a.arc(0,0,l,N,B,C)}a.closePath();if(h)return a=null,h+""||null}h.centroid=function(){var e=(+t.apply(this,arguments)+ +n.apply(this,arguments))/2,i=(+s.apply(this,arguments)+ +r.apply(this,arguments))/2-_/2;return[g(i)*e,b(i)*e]};h.innerRadius=function(n){return arguments.length?(t=typeof n==="function"?n:l(+n),h):t};h.outerRadius=function(t){return arguments.length?(n=typeof t==="function"?t:l(+t),h):n};h.cornerRadius=function(t){return arguments.length?(e=typeof t==="function"?t:l(+t),h):e};h.padRadius=function(t){return arguments.length?(i=t==null?null:typeof t==="function"?t:l(+t),h):i};h.startAngle=function(t){return arguments.length?(s=typeof t==="function"?t:l(+t),h):s};h.endAngle=function(t){return arguments.length?(r=typeof t==="function"?t:l(+t),h):r};h.padAngle=function(t){return arguments.length?(o=typeof t==="function"?t:l(+t),h):o};h.context=function(t){return arguments.length?(a=t==null?null:t,h):a};return h}function P(t,n){return n<t?-1:n>t?1:n>=t?0:NaN}function E(t){return t}function F(){var t=E,n=P,e=null,i=l(0),s=l(z),r=l(0);function o(o){var a,c=(o=f(o)).length,h,u,l=0,d=new Array(c),p=new Array(c),y=+i.apply(this,arguments),g=Math.min(z,Math.max(-z,s.apply(this,arguments)-y)),v,m=Math.min(Math.abs(g)/c,r.apply(this,arguments)),b=m*(g<0?-1:1),x;for(a=0;a<c;++a){if((x=p[d[a]=a]=+t(o[a],a,o))>0){l+=x}}if(n!=null)d.sort((function(t,e){return n(p[t],p[e])}));else if(e!=null)d.sort((function(t,n){return e(o[t],o[n])}));for(a=0,u=l?(g-c*b)/l:0;a<c;++a,y=v){h=d[a],x=p[h],v=y+(x>0?x*u:0)+b,p[h]={data:o[h],index:a,value:x,startAngle:y,endAngle:v,padAngle:m}}return p}o.value=function(n){return arguments.length?(t=typeof n==="function"?n:l(+n),o):t};o.sortValues=function(t){return arguments.length?(n=t,e=null,o):n};o.sort=function(t){return arguments.length?(e=t,n=null,o):e};o.startAngle=function(t){return arguments.length?(i=typeof t==="function"?t:l(+t),o):i};o.endAngle=function(t){return arguments.length?(s=typeof t==="function"?t:l(+t),o):s};o.padAngle=function(t){return arguments.length?(r=typeof t==="function"?t:l(+t),o):r};return o}const H=()=>`.sc-ds-chart-donut-h{display:inline-block;font-family:var(--typography-font-family);user-select:none}.chart-donut--fill.sc-ds-chart-donut-h{display:block;width:100%;height:100%;min-width:0;min-height:0}.chart-donut__wrapper.sc-ds-chart-donut{position:relative}.chart-donut--fill.sc-ds-chart-donut-h .chart-donut__wrapper.sc-ds-chart-donut{width:100%;height:100%;display:flex;align-items:center;justify-content:center}.chart-donut__svg.sc-ds-chart-donut path.sc-ds-chart-donut{cursor:default;transition:opacity var(--effect-motion-short-2)}@media (prefers-reduced-motion: reduce){.chart-donut__svg.sc-ds-chart-donut path.sc-ds-chart-donut{transition:none}}.chart-donut__svg.sc-ds-chart-donut path.sc-ds-chart-donut:focus-visible{outline:none;stroke:var(--color-interaction-focus);stroke-width:2}.chart-donut__center-value.sc-ds-chart-donut{fill:var(--color-foreground-primary);font-family:var(--typography-font-family);font-size:var(--typography-fontsize-xl);line-height:var(--typography-lineheight-xl);font-weight:var(--typography-weight-semibold);letter-spacing:var(--typography-letterspacing-negative-double);cursor:default}.chart-donut__center-caption.sc-ds-chart-donut{fill:var(--color-foreground-secondary);font-family:var(--typography-font-family);font-size:var(--typography-fontsize-md);line-height:var(--typography-lineheight-md);font-weight:var(--typography-weight-regular);letter-spacing:var(--typography-letterspacing-negative-half);cursor:default}`;const O=.25;const T=0;const D=.82;const V=128;const G=t(class t extends n{constructor(t){super();if(t!==false){this.__registerHost()}this.dsSliceHover=e(this,"dsSliceHover");this.noDataLabel="No data";this.data=[];this.thickness=a.size200;this.cornerRadius=a.radius025;this.gap=1;this.activeLabel=null;this.hoveredLabel=null;this.displayedValueText="";this.displayedCaptionText="";this.measuredSize=V;this.resizeObserver=null}get isFillMode(){return this.size==null||!Number.isFinite(this.size)||this.size<=0}get fillMinPx(){return c(a.donutFillMin,V)}get fillMaxPx(){return c(a.donutFillMax,192)}clampFillSize(t){const n=this.fillMinPx;const e=this.fillMaxPx;if(!(t>0))return n;return Math.round(Math.min(e,Math.max(n,t)))}get resolvedSize(){if(!this.isFillMode)return this.size;return this.clampFillSize(this.measuredSize)}componentDidLoad(){this.syncResizeObserver()}onSizePropChange(){this.syncResizeObserver()}disconnectedCallback(){this.teardownResizeObserver()}syncResizeObserver(){this.teardownResizeObserver();if(!this.isFillMode)return;const t=this.el;if(!t||typeof ResizeObserver==="undefined")return;this.resizeObserver=new ResizeObserver((t=>{const n=t[0];if(!n)return;this.applyAvailableSize(n.contentRect.width,n.contentRect.height)}));this.resizeObserver.observe(t);this.measureHost()}measureHost(){const t=this.el.getBoundingClientRect();this.applyAvailableSize(t.width,t.height)}applyAvailableSize(t,n){const e=Math.floor(Math.min(t,n));if(e>0&&e!==this.measuredSize){this.measuredSize=e}}teardownResizeObserver(){this.resizeObserver?.disconnect();this.resizeObserver=null}handleHover(t){this.hoveredLabel=t?.label??null;this.dsSliceHover.emit(t)}componentDidRender(){if(this.isFillMode&&!this.resizeObserver){this.syncResizeObserver()}const t=this.resolvedSize;const n=t/2;const e=c(this.thickness,a.size200);const i=n-e;const s=i*2*D;const r=this.data.reduce(((t,n)=>t+n.value),0);const o=this.centerValue??h(r,this.locale);if(this.valueTextEl){const t=d(this.valueTextEl,o,s);if(t!==this.displayedValueText)this.displayedValueText=t;else this.valueTextEl.textContent=t}const u=this.centerCaption??"";if(this.captionTextEl&&u){const t=d(this.captionTextEl,u,s);if(t!==this.displayedCaptionText)this.displayedCaptionText=t;else this.captionTextEl.textContent=t}}render(){const t=this.resolvedSize;const n=t/2;const e=c(this.thickness,a.size200);const r=c(this.cornerRadius,a.radius025);const u=n-e;const l=this.data.reduce(((t,n)=>t+n.value),0);const f=l<=0;const d=this.activeLabel??this.hoveredLabel;const p=N().innerRadius(u).outerRadius(n).cornerRadius(r).padAngle(this.gap*Math.PI/180);const y=f?[]:F().value((t=>t.value)).sort(null)(this.data);const g=f?N().innerRadius(u).outerRadius(n)({startAngle:0,endAngle:Math.PI*2}):null;const v=c(a.lineheightXl,32);const m=c(a.lineheightMd,20);const b=this.centerCaption?n-(T+m)/2:n;const x=n+(v+T)/2;const M=this.centerValue??h(l,this.locale);const _=this.centerCaption??"";const w=this.isFillMode;return i(s,{key:"632d87df4c043eac4ef534edc58982e539d5404c",class:{"chart-donut":true,"chart-donut--fill":w,"chart-donut--fixed":!w},style:!w?{width:`${t}px`,height:`${t}px`}:undefined},i("div",{key:"529ab6bae28eb75154cdee7db789b3a160a34fdb",class:"chart-donut__wrapper",style:!w?{width:`${t}px`,height:`${t}px`}:undefined},i("svg",{key:"a8edaf66e21c86d53b3fca5f29c0e98502e374fa",class:"chart-donut__svg",viewBox:`0 0 ${t} ${t}`,width:t,height:t},i("g",{key:"248d36e1f2279f496093e429323596abf0488d18",transform:`translate(${n}, ${n})`},f?i("path",{d:g??undefined,fill:"var(--color-background-faint-neutral)","aria-label":this.noDataLabel}):y.map(((t,n)=>{const e=this.data[n];const s=d!=null&&e.label!==d;return i("path",{key:e.label,d:p(t)??undefined,fill:e.color??o(n),opacity:s?O:1,tabindex:0,role:"img","aria-label":`${e.label}: ${e.value}`,onMouseEnter:()=>this.handleHover(e),onMouseLeave:()=>this.handleHover(null),onFocus:()=>this.handleHover(e),onBlur:()=>this.handleHover(null)})}))),i("text",{key:"a70783b91c84166e7ab6f851984be6b19714cf1d",class:"chart-donut__center-value",x:n,y:b,"text-anchor":"middle","dominant-baseline":"central",ref:t=>{this.valueTextEl=t??undefined}},this.displayedValueText||M),_&&i("text",{key:"3f89b9902461dbed4513d9a4d88e6932f1c81145",class:"chart-donut__center-caption",x:n,y:x,"text-anchor":"middle","dominant-baseline":"central",ref:t=>{this.captionTextEl=t??undefined}},this.displayedCaptionText||_))))}get el(){return this}static get watchers(){return{size:[{onSizePropChange:0}]}}static get style(){return H()}},[2,"ds-chart-donut",{locale:[1],noDataLabel:[1,"no-data-label"],data:[16],size:[2],thickness:[8],cornerRadius:[8,"corner-radius"],gap:[2],centerValue:[1,"center-value"],centerCaption:[1,"center-caption"],activeLabel:[1,"active-label"],hoveredLabel:[32],displayedValueText:[32],displayedCaptionText:[32],measuredSize:[32]},undefined,{size:[{onSizePropChange:0}]}]);function I(){if(typeof customElements==="undefined"){return}const t=["ds-chart-donut"];t.forEach((t=>{switch(t){case"ds-chart-donut":if(!customElements.get(r(t))){customElements.define(r(t),G)}break}}))}I();const U=G;const W=I;export{U as DsChartDonut,W as defineCustomElement};
|
|
1
|
+
import{p as t,H as n,c as e,h as i,a as s,t as r}from"./index.js";import{c as o}from"./p-CMv_7vFs.js";import{T as a}from"./p-drBA73M_.js";import{r as c}from"./p-BWUTr_XN.js";import{f as h}from"./p-BBpASejH.js";import{w as u,c as l,a as f}from"./p-CrCGIx8s.js";function d(t,n,e){t.textContent=n;if(e<=0||t.getComputedTextLength()<=e)return n;let i=0;let s=n.length;while(i<s){const r=Math.ceil((i+s)/2);t.textContent=`${n.slice(0,r)}…`;if(t.getComputedTextLength()<=e){i=r}else{s=r-1}}return i>0?`${n.slice(0,i)}…`:"…"}const p=Math.abs;const y=Math.atan2;const g=Math.cos;const v=Math.max;const m=Math.min;const b=Math.sin;const x=Math.sqrt;const M=1e-12;const _=Math.PI;const w=_/2;const z=2*_;function k(t){return t>1?0:t<-1?_:Math.acos(t)}function $(t){return t>=1?w:t<=-1?-w:Math.asin(t)}function A(t){return t.innerRadius}function C(t){return t.outerRadius}function S(t){return t.startAngle}function j(t){return t.endAngle}function B(t){return t&&t.padAngle}function R(t,n,e,i,s,r,o,a){var c=e-t,h=i-n,u=o-s,l=a-r,f=l*c-u*h;if(f*f<M)return;f=(u*(n-r)-l*(t-s))/f;return[t+f*c,n+f*h]}function L(t,n,e,i,s,r,o){var a=t-e,c=n-i,h=(o?r:-r)/x(a*a+c*c),u=h*c,l=-h*a,f=t+u,d=n+l,p=e+u,y=i+l,g=(f+p)/2,m=(d+y)/2,b=p-f,M=y-d,_=b*b+M*M,w=s-r,z=f*y-p*d,k=(M<0?-1:1)*x(v(0,w*w*_-z*z)),$=(z*M-b*k)/_,A=(-z*b-M*k)/_,C=(z*M+b*k)/_,S=(-z*b+M*k)/_,j=$-g,B=A-m,R=C-g,L=S-m;if(j*j+B*B>R*R+L*L)$=C,A=S;return{cx:$,cy:A,x01:-u,y01:-l,x11:$*(s/w-1),y11:A*(s/w-1)}}function N(){var t=A,n=C,e=l(0),i=null,s=S,r=j,o=B,a=null,c=u(h);function h(){var h,u,l=+t.apply(this,arguments),f=+n.apply(this,arguments),d=s.apply(this,arguments)-w,v=r.apply(this,arguments)-w,A=p(v-d),C=v>d;if(!a)a=h=c();if(f<l)u=f,f=l,l=u;if(!(f>M))a.moveTo(0,0);else if(A>z-M){a.moveTo(f*g(d),f*b(d));a.arc(0,0,f,d,v,!C);if(l>M){a.moveTo(l*g(v),l*b(v));a.arc(0,0,l,v,d,C)}}else{var S=d,j=v,B=d,N=v,P=A,E=A,F=o.apply(this,arguments)/2,H=F>M&&(i?+i.apply(this,arguments):x(l*l+f*f)),O=m(p(f-l)/2,+e.apply(this,arguments)),T=O,D=O,V,G;if(H>M){var I=$(H/l*b(F)),U=$(H/f*b(F));if((P-=I*2)>M)I*=C?1:-1,B+=I,N-=I;else P=0,B=N=(d+v)/2;if((E-=U*2)>M)U*=C?1:-1,S+=U,j-=U;else E=0,S=j=(d+v)/2}var W=f*g(S),X=f*b(S),q=l*g(N),J=l*b(N);if(O>M){var K=f*g(j),Q=f*b(j),Y=l*g(B),Z=l*b(B),tt;if(A<_){if(tt=R(W,X,Y,Z,K,Q,q,J)){var nt=W-tt[0],et=X-tt[1],it=K-tt[0],st=Q-tt[1],rt=1/b(k((nt*it+et*st)/(x(nt*nt+et*et)*x(it*it+st*st)))/2),ot=x(tt[0]*tt[0]+tt[1]*tt[1]);T=m(O,(l-ot)/(rt-1));D=m(O,(f-ot)/(rt+1))}else{T=D=0}}}if(!(E>M))a.moveTo(W,X);else if(D>M){V=L(Y,Z,W,X,f,D,C);G=L(K,Q,q,J,f,D,C);a.moveTo(V.cx+V.x01,V.cy+V.y01);if(D<O)a.arc(V.cx,V.cy,D,y(V.y01,V.x01),y(G.y01,G.x01),!C);else{a.arc(V.cx,V.cy,D,y(V.y01,V.x01),y(V.y11,V.x11),!C);a.arc(0,0,f,y(V.cy+V.y11,V.cx+V.x11),y(G.cy+G.y11,G.cx+G.x11),!C);a.arc(G.cx,G.cy,D,y(G.y11,G.x11),y(G.y01,G.x01),!C)}}else a.moveTo(W,X),a.arc(0,0,f,S,j,!C);if(!(l>M)||!(P>M))a.lineTo(q,J);else if(T>M){V=L(q,J,K,Q,l,-T,C);G=L(W,X,Y,Z,l,-T,C);a.lineTo(V.cx+V.x01,V.cy+V.y01);if(T<O)a.arc(V.cx,V.cy,T,y(V.y01,V.x01),y(G.y01,G.x01),!C);else{a.arc(V.cx,V.cy,T,y(V.y01,V.x01),y(V.y11,V.x11),!C);a.arc(0,0,l,y(V.cy+V.y11,V.cx+V.x11),y(G.cy+G.y11,G.cx+G.x11),C);a.arc(G.cx,G.cy,T,y(G.y11,G.x11),y(G.y01,G.x01),!C)}}else a.arc(0,0,l,N,B,C)}a.closePath();if(h)return a=null,h+""||null}h.centroid=function(){var e=(+t.apply(this,arguments)+ +n.apply(this,arguments))/2,i=(+s.apply(this,arguments)+ +r.apply(this,arguments))/2-_/2;return[g(i)*e,b(i)*e]};h.innerRadius=function(n){return arguments.length?(t=typeof n==="function"?n:l(+n),h):t};h.outerRadius=function(t){return arguments.length?(n=typeof t==="function"?t:l(+t),h):n};h.cornerRadius=function(t){return arguments.length?(e=typeof t==="function"?t:l(+t),h):e};h.padRadius=function(t){return arguments.length?(i=t==null?null:typeof t==="function"?t:l(+t),h):i};h.startAngle=function(t){return arguments.length?(s=typeof t==="function"?t:l(+t),h):s};h.endAngle=function(t){return arguments.length?(r=typeof t==="function"?t:l(+t),h):r};h.padAngle=function(t){return arguments.length?(o=typeof t==="function"?t:l(+t),h):o};h.context=function(t){return arguments.length?(a=t==null?null:t,h):a};return h}function P(t,n){return n<t?-1:n>t?1:n>=t?0:NaN}function E(t){return t}function F(){var t=E,n=P,e=null,i=l(0),s=l(z),r=l(0);function o(o){var a,c=(o=f(o)).length,h,u,l=0,d=new Array(c),p=new Array(c),y=+i.apply(this,arguments),g=Math.min(z,Math.max(-z,s.apply(this,arguments)-y)),v,m=Math.min(Math.abs(g)/c,r.apply(this,arguments)),b=m*(g<0?-1:1),x;for(a=0;a<c;++a){if((x=p[d[a]=a]=+t(o[a],a,o))>0){l+=x}}if(n!=null)d.sort((function(t,e){return n(p[t],p[e])}));else if(e!=null)d.sort((function(t,n){return e(o[t],o[n])}));for(a=0,u=l?(g-c*b)/l:0;a<c;++a,y=v){h=d[a],x=p[h],v=y+(x>0?x*u:0)+b,p[h]={data:o[h],index:a,value:x,startAngle:y,endAngle:v,padAngle:m}}return p}o.value=function(n){return arguments.length?(t=typeof n==="function"?n:l(+n),o):t};o.sortValues=function(t){return arguments.length?(n=t,e=null,o):n};o.sort=function(t){return arguments.length?(e=t,n=null,o):e};o.startAngle=function(t){return arguments.length?(i=typeof t==="function"?t:l(+t),o):i};o.endAngle=function(t){return arguments.length?(s=typeof t==="function"?t:l(+t),o):s};o.padAngle=function(t){return arguments.length?(r=typeof t==="function"?t:l(+t),o):r};return o}const H=()=>`.sc-ds-chart-donut-h{display:inline-block;font-family:var(--typography-font-family);user-select:none}.chart-donut--fill.sc-ds-chart-donut-h{display:block;width:100%;height:100%;min-width:0;min-height:0}.chart-donut__wrapper.sc-ds-chart-donut{position:relative}.chart-donut--fill.sc-ds-chart-donut-h .chart-donut__wrapper.sc-ds-chart-donut{width:100%;height:100%;display:flex;align-items:center;justify-content:center}.chart-donut__svg.sc-ds-chart-donut path.sc-ds-chart-donut{cursor:default;transition:opacity var(--effect-motion-short-2)}@media (prefers-reduced-motion: reduce){.chart-donut__svg.sc-ds-chart-donut path.sc-ds-chart-donut{transition:none}}.chart-donut__svg.sc-ds-chart-donut path.sc-ds-chart-donut:focus-visible{outline:none;stroke:var(--color-interaction-focus);stroke-width:2}.chart-donut__center-value.sc-ds-chart-donut{fill:var(--color-foreground-primary);font-family:var(--typography-font-family);font-size:var(--typography-fontsize-xl);line-height:var(--typography-lineheight-xl);font-weight:var(--typography-weight-semibold);letter-spacing:var(--typography-letterspacing-negative-double);cursor:default}.chart-donut__center-caption.sc-ds-chart-donut{fill:var(--color-foreground-secondary);font-family:var(--typography-font-family);font-size:var(--typography-fontsize-md);line-height:var(--typography-lineheight-md);font-weight:var(--typography-weight-regular);letter-spacing:var(--typography-letterspacing-negative-half);cursor:default}`;const O=.25;const T=0;const D=.82;const V=128;const G=t(class t extends n{constructor(t){super();if(t!==false){this.__registerHost()}this.dsSliceHover=e(this,"dsSliceHover");this.noDataLabel="No data";this.data=[];this.thickness=a.size200;this.cornerRadius=a.radius025;this.gap=1;this.activeLabel=null;this.hoveredLabel=null;this.displayedValueText="";this.displayedCaptionText="";this.measuredSize=V;this.resizeObserver=null}get isFillMode(){return this.size==null||!Number.isFinite(this.size)||this.size<=0}get fillMinPx(){return c(a.donutFillMin,V)}get fillMaxPx(){return c(a.donutFillMax,192)}clampFillSize(t){const n=this.fillMinPx;const e=this.fillMaxPx;if(!(t>0))return n;return Math.round(Math.min(e,Math.max(n,t)))}get resolvedSize(){if(!this.isFillMode)return this.size;return this.clampFillSize(this.measuredSize)}componentDidLoad(){this.syncResizeObserver()}onSizePropChange(){this.syncResizeObserver()}disconnectedCallback(){this.teardownResizeObserver()}syncResizeObserver(){this.teardownResizeObserver();if(!this.isFillMode)return;const t=this.el;if(!t||typeof ResizeObserver==="undefined")return;this.resizeObserver=new ResizeObserver((t=>{const n=t[0];if(!n)return;this.applyAvailableSize(n.contentRect.width,n.contentRect.height)}));this.resizeObserver.observe(t);this.measureHost()}measureHost(){const t=this.el.getBoundingClientRect();this.applyAvailableSize(t.width,t.height)}applyAvailableSize(t,n){const e=Math.floor(Math.min(t,n));if(e>0&&e!==this.measuredSize){this.measuredSize=e}}teardownResizeObserver(){this.resizeObserver?.disconnect();this.resizeObserver=null}handleHover(t){this.hoveredLabel=t?.label??null;this.dsSliceHover.emit(t)}componentDidRender(){if(this.isFillMode&&!this.resizeObserver){this.syncResizeObserver()}const t=this.resolvedSize;const n=t/2;const e=c(this.thickness,a.size200);const i=n-e;const s=i*2*D;const r=this.data.reduce(((t,n)=>t+n.value),0);const o=this.centerValue??h(r,this.locale);if(this.valueTextEl){const t=d(this.valueTextEl,o,s);if(t!==this.displayedValueText)this.displayedValueText=t;else this.valueTextEl.textContent=t}const u=this.centerCaption??"";if(this.captionTextEl&&u){const t=d(this.captionTextEl,u,s);if(t!==this.displayedCaptionText)this.displayedCaptionText=t;else this.captionTextEl.textContent=t}}render(){const t=this.resolvedSize;const n=t/2;const e=c(this.thickness,a.size200);const r=c(this.cornerRadius,a.radius025);const u=n-e;const l=this.data.reduce(((t,n)=>t+n.value),0);const f=l<=0;const d=this.activeLabel??this.hoveredLabel;const p=N().innerRadius(u).outerRadius(n).cornerRadius(r).padAngle(this.gap*Math.PI/180);const y=f?[]:F().value((t=>t.value)).sort(null)(this.data);const g=f?N().innerRadius(u).outerRadius(n)({startAngle:0,endAngle:Math.PI*2}):null;const v=c(a.lineheightXl,32);const m=c(a.lineheightMd,20);const b=this.centerCaption?n-(T+m)/2:n;const x=n+(v+T)/2;const M=this.centerValue??h(l,this.locale);const _=this.centerCaption??"";const w=this.isFillMode;return i(s,{key:"02a4bf80e5d7b569b182c804e72f53533a10f660",class:{"chart-donut":true,"chart-donut--fill":w,"chart-donut--fixed":!w},style:!w?{width:`${t}px`,height:`${t}px`}:undefined},i("div",{key:"7d42352be38d6d30dda0c281c8620ae72fa007d1",class:"chart-donut__wrapper",style:!w?{width:`${t}px`,height:`${t}px`}:undefined},i("svg",{key:"c5a1398fe619520bd99dc16b6f91294103d50979",class:"chart-donut__svg",viewBox:`0 0 ${t} ${t}`,width:t,height:t},i("g",{key:"bb3fa5696ffdcb5b6a499170baa87fea010a5806",transform:`translate(${n}, ${n})`},f?i("path",{d:g??undefined,fill:"var(--color-background-faint-neutral)","aria-label":this.noDataLabel}):y.map(((t,n)=>{const e=this.data[n];const s=d!=null&&e.label!==d;return i("path",{key:e.label,d:p(t)??undefined,fill:e.color??o(n),opacity:s?O:1,tabindex:0,role:"img","aria-label":`${e.label}: ${e.value}`,onMouseEnter:()=>this.handleHover(e),onMouseLeave:()=>this.handleHover(null),onFocus:()=>this.handleHover(e),onBlur:()=>this.handleHover(null)})}))),i("text",{key:"c77797bb4de1c6f0f1e16dbdf912d9d296f708c1",class:"chart-donut__center-value",x:n,y:b,"text-anchor":"middle","dominant-baseline":"central",ref:t=>{this.valueTextEl=t??undefined}},this.displayedValueText||M),_&&i("text",{key:"a7f7a687806f87e73c2a1c80f3839925e6fad641",class:"chart-donut__center-caption",x:n,y:x,"text-anchor":"middle","dominant-baseline":"central",ref:t=>{this.captionTextEl=t??undefined}},this.displayedCaptionText||_))))}get el(){return this}static get watchers(){return{size:[{onSizePropChange:0}]}}static get style(){return H()}},[2,"ds-chart-donut",{locale:[1],noDataLabel:[1,"no-data-label"],data:[16],size:[2],thickness:[8],cornerRadius:[8,"corner-radius"],gap:[2],centerValue:[1,"center-value"],centerCaption:[1,"center-caption"],activeLabel:[1,"active-label"],hoveredLabel:[32],displayedValueText:[32],displayedCaptionText:[32],measuredSize:[32]},undefined,{size:[{onSizePropChange:0}]}]);function I(){if(typeof customElements==="undefined"){return}const t=["ds-chart-donut"];t.forEach((t=>{switch(t){case"ds-chart-donut":if(!customElements.get(r(t))){customElements.define(r(t),G)}break}}))}I();const U=G;const W=I;export{U as DsChartDonut,W as defineCustomElement};
|
|
2
2
|
//# sourceMappingURL=ds-chart-donut.js.map
|