@ds-mo/ui 3.0.0 → 3.1.0

package/dist/components/ds-bar-nav.js

@@ -1,2 +1,2 @@
-import{p as s,H as t,c as i,h as e,a as n,t as r}from"./index.js";import{i as a}from"./p-BQq26pt9.js";import{s as o,p as h,d as l}from"./p-BOQnc-M4.js";import{C as c,c as d,a as f,b as u,r as b,d as v}from"./p-BiM6QBTF.js";import{d as p}from"./p-DQ3l2TXw.js";import{d as g}from"./p-CNgNgezy.js";import{d as m}from"./p-9Qu1ls2y.js";import{d as y}from"./p-B_ENgncs.js";import{d as _}from"./p-CsaW5gDM.js";import{d as w}from"./p-BSNlp8Di.js";import{d as C}from"./p-V2qW8NL0.js";import{d as k}from"./p-sBx2MuF2.js";function x(s,t){if(!s)return null;const i=s.shadowRoot??s;return i.querySelector(t)}function T(s){return x(s,'[role="tablist"]')}function F(s,t){const i=[];let e=[];for(const n of s){if(a(n)){if(e.length>0){i.push({items:e});e=[]}continue}e.push({label:n.label,value:n.id,isSelected:n.id===t,isInactive:n.isInactive})}if(e.length>0){i.push({items:e})}return i}function M(s,t){return F(D(s),t)}function S(s,t,i,e=2){const n=s-t;if(i){return n>-e}return n>e}function E(s,t,i,e,n){if(s.length===0||t<=0)return 0;const r=P(s,s.length,e,n);if(r<=t)return s.length;const a=Math.max(0,t-i);let o=0;for(let t=1;t<=s.length;t++){const i=P(s,t,e,n);if(i>a)break;o=t}return o}function O(s){let t=s.length;while(t>0&&a(s[t-1])){t-=1}return s.slice(0,t)}function D(s){let t=0;while(t<s.length&&a(s[t])){t+=1}return s.slice(t)}function P(s,t,i,e){if(t<=0)return 0;const n=s.slice(0,t).reduce(((s,t)=>s+t),0);return e+n+i*Math.max(0,t-1)}const j=()=>`.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: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{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:focus-visible{outline:none}.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{outline:none}.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))}.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[gradient].sc-ds-bar-nav-h .bar-nav.sc-ds-bar-nav,ds-app-shell[gradient] .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__left.sc-ds-bar-nav ds-tab-group-nav.sc-ds-bar-nav{flex:1;min-width:0}.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 ds-tab-group-nav.sc-ds-bar-nav{width:max-content}.bar-nav__tabs-visible.sc-ds-bar-nav{width:100%;min-width:0}.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)}.bar-nav__heading.sc-ds-bar-nav{display:inline-flex;align-items:center;height:var(--dimension-size-400);padding-inline:var(--dimension-space-100);color:var(--_bar-nav-fg-primary);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;-webkit-user-select:none;user-select:none}`;const H=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.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.headerEl=null;this.triggerEl=null;this.menuEl=null;this.visibleTabGroupEl=null;this.probeTabGroupEl=null;this.resizeObserver=null;this.intrinsicWidthRetryCount=0;this.tabLayoutPendingFrames=0;this.panelNavTransition=new c;this.panelToolsTransition=new c;this.overflowCoalescer=d((()=>{this.updateTabsCollapsed()}));this.chromeTransitionShell=null;this.committedSection="";this.pendingSection="";this.onChromeTransitionStart=s=>{const t=b(s);if(t==="panel-nav"){this.panelNavTransition.enter();return}if(t==="panel-tools"){const t=v(s)??"opening";if(t==="closing"){this.panelToolsTransition.enter()}}};this.onChromeTransitionEnd=s=>{const t=b(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 hasOverflowTabs(){return this.tabLayoutCommitted&&this.tabsCollapsed&&this.overflowTabs.length>0}digestTabsConfig(s){return s.map((s=>a(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.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()}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(o(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(){const s=T(this.probeTabGroupEl);return s?.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=T(this.probeTabGroupEl);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 n=parseFloat(e.columnGap||e.gap)||0;const r=i.reduce(((s,t)=>s+t),0);const a=n*Math.max(0,i.length-1);const o=Math.max(0,s.scrollWidth-r-a);return{itemWidths:i,itemGap:n,listExtraWidth:o}}setOverflowTabLayout(s,t){const i=t.length>0;const e=this.digestTabsConfig(s)!==this.digestTabsConfig(this.visibleTabs);const n=this.digestTabsConfig(t)!==this.digestTabsConfig(this.overflowTabs);if(e){this.visibleTabs=s}if(n){this.overflowTabs=t}if(i!==this.tabsCollapsed){this.tabsCollapsed=i;if(!i){this.menuOpen=false}}}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=S(i,this.getLeftZoneAvailableWidth(),this.tabsCollapsed,s.OVERFLOW_HYSTERESIS_PX);if(!e){this.setOverflowTabLayout(this.resolvedTabs,[]);this.tabLayoutCommitted=true;return}const n=E(t.itemWidths,this.getLeftZoneAvailableWidth(),this.getOverflowTriggerReserveWidth(),t.itemGap,t.listExtraWidth);const r=O(this.resolvedTabs.slice(0,n));const a=this.resolvedTabs.slice(r.length);this.setOverflowTabLayout(r,a);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?h(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=M(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}=l(this.currentUrl,this.basePath,s);this.urlDerivedValue=t;this.hideTabsForDetailRoute=i}selectTab(s){this.value=s;this.dsTabChange.emit(s)}focusVisibleSelectedTab(){const s=x(this.visibleTabGroupEl,`[data-tab-id="${this.effectiveValue}"]`);s?.focus({preventScroll:true})}handleTabChange(s){this.selectTab(s.detail)}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}handleTabRovingExit(s){if(s.detail!=="end"||!this.hasOverflowTabs)return;this.overflowRovingFocused=true;void this.triggerEl?.setFocus?.()}handleTriggerKeyDown(s){if(!this.hasOverflowTabs)return;if(!this.menuOpen){if(s.key==="ArrowLeft"){s.preventDefault();this.overflowRovingFocused=false;void this.visibleTabGroupEl?.focusLastTab();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?.()}}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 r=this.hasOverflowTabs?this.visibleTabs:this.resolvedTabs;return e(n,{key:"28c907ed1d936026a4749b9734d0cb95d41f4234"},e("header",{key:"68bf7fe93f176b54e1649761d7fcb22dd97db71f",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:"802ad6b71c76a097773f6d47902e205acd0a407b",class:"bar-nav__tabs-probe","aria-hidden":"true",inert:true},e("ds-tab-group-nav",{key:`probe-${i}`,ref:s=>{const t=s??null;if(t===this.probeTabGroupEl)return;this.probeTabGroupEl=t;if(t){this.intrinsicWidthRetryCount=0;this.tabLayoutPendingFrames=0;this.scheduleOverflowCheck()}},tabs:this.resolvedTabs,value:this.effectiveValue})),t&&this.tabLayoutCommitted&&r.length>0&&e("div",{key:"2b463108ec3db6c0b335a32390f6cbbde4eaaa45",class:"bar-nav__left"},e("ds-tab-group-nav",{key:`visible-${i}`,class:"bar-nav__tabs-visible",ref:s=>{this.visibleTabGroupEl=s??null},tabs:r,value:this.effectiveValue,selectionFollowsFocus:false,rovingEnabled:!this.overflowRovingFocused,onDsChange:s=>this.handleTabChange(s),onDsRovingExit:s=>this.handleTabRovingExit(s),onFocusin:()=>{this.overflowRovingFocused=false}})),t&&!this.tabLayoutCommitted&&e("div",{key:"044744f4ee904871a3807929e4df5075d1907823",class:"bar-nav__tabs-pending","aria-hidden":"true"}),!t&&this.heading&&e("ds-text",{key:"223f908d66593911b993f7f542064e72f625e3c3",class:"bar-nav__heading",as:"span",variant:"text-body-medium",emphasis:true,color:"inherit",wrap:"nowrap"},this.heading),t&&this.hasOverflowTabs&&e("ds-button-unfilled",{key:"152b778ebbec38621e0fba7b38d4399a01405995",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":"More tabs",onDsClick:()=>this.toggleTabMenu({focusVisible:false}),onFocusin:this.handleOverflowFocus,onFocusout:this.handleOverflowBlur,onKeyDown:s=>this.handleTriggerKeyDown(s)})),t&&this.hasOverflowTabs&&e("ds-menu",{key:"8443ef53655b97f8317921f576eb8b4f7d14c56f",ref:s=>{this.menuEl=s??null},open:this.menuOpen,sections:M(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 j()}},[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"],resolvedTabs:[32],urlDerivedValue:[32],hideTabsForDetailRoute:[32],tabsCollapsed:[32],menuOpen:[32],tabLayoutCommitted:[32],visibleTabs:[32],overflowTabs:[32],menuInitialFocusVisible:[32],overflowRovingFocused:[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}]}]);H.HOST_PROP_SYNC_BUDGET=8;H.INTRINSIC_WIDTH_RETRY_MAX=3;H.TAB_LAYOUT_COMMIT_MAX_FRAMES=16;H.OVERFLOW_HYSTERESIS_PX=8;function L(){if(typeof customElements==="undefined"){return}const s=["ds-bar-nav","ds-badge","ds-button-unfilled","ds-icon","ds-menu","ds-shell-gradient-picker","ds-shell-gradient-swatch","ds-tab-group-nav","ds-text"];s.forEach((s=>{switch(s){case"ds-bar-nav":if(!customElements.get(r(s))){customElements.define(r(s),H)}break;case"ds-badge":if(!customElements.get(r(s))){p()}break;case"ds-button-unfilled":if(!customElements.get(r(s))){g()}break;case"ds-icon":if(!customElements.get(r(s))){m()}break;case"ds-menu":if(!customElements.get(r(s))){y()}break;case"ds-shell-gradient-picker":if(!customElements.get(r(s))){_()}break;case"ds-shell-gradient-swatch":if(!customElements.get(r(s))){w()}break;case"ds-tab-group-nav":if(!customElements.get(r(s))){C()}break;case"ds-text":if(!customElements.get(r(s))){k()}break}}))}L();const V=H;const z=L;export{V as DsBarNav,z as defineCustomElement};
+import{p as s,H as t,c as i,h as e,a as n,t as r}from"./index.js";import{i as a}from"./p-BQq26pt9.js";import{s as o,p as h,d as l}from"./p-BOQnc-M4.js";import{C as c,c as d,a as f,b as u,r as b,d as v}from"./p-BiM6QBTF.js";import{d as p}from"./p-DEgY_Lnb.js";import{d as g}from"./p-DHjjwgku.js";import{d as m}from"./p-9Qu1ls2y.js";import{d as y}from"./p-DolYlDbY.js";import{d as _}from"./p-CTK82RIw.js";import{d as w}from"./p-Cp86p-11.js";import{d as C}from"./p-BFiaUYu7.js";import{d as k}from"./p-BOQRM49Q.js";function T(s,t){if(!s)return null;const i=s.shadowRoot??s;return i.querySelector(t)}function x(s){return T(s,'[role="tablist"]')}function F(s,t){const i=[];let e=[];for(const n of s){if(a(n)){if(e.length>0){i.push({items:e});e=[]}continue}e.push({label:n.label,value:n.id,isSelected:n.id===t,isInactive:n.isInactive})}if(e.length>0){i.push({items:e})}return i}function M(s,t){return F(D(s),t)}function O(s,t,i,e=2){const n=s-t;if(i){return n>-e}return n>e}function E(s,t,i,e,n){if(s.length===0||t<=0)return 0;const r=P(s,s.length,e,n);if(r<=t)return s.length;const a=Math.max(0,t-i);let o=0;for(let t=1;t<=s.length;t++){const i=P(s,t,e,n);if(i>a)break;o=t}return o}function S(s){let t=s.length;while(t>0&&a(s[t-1])){t-=1}return s.slice(0,t)}function D(s){let t=0;while(t<s.length&&a(s[t])){t+=1}return s.slice(t)}function P(s,t,i,e){if(t<=0)return 0;const n=s.slice(0,t).reduce(((s,t)=>s+t),0);return e+n+i*Math.max(0,t-1)}const j=()=>`.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: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{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:focus-visible{outline:none}.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{outline:none}.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))}.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[gradient].sc-ds-bar-nav-h .bar-nav.sc-ds-bar-nav,ds-app-shell[gradient] .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__left.sc-ds-bar-nav ds-tab-group-nav.sc-ds-bar-nav{flex:1;min-width:0}.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 ds-tab-group-nav.sc-ds-bar-nav{width:max-content}.bar-nav__tabs-visible.sc-ds-bar-nav{width:100%;min-width:0}.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 H=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.headerEl=null;this.triggerEl=null;this.menuEl=null;this.visibleTabGroupEl=null;this.probeTabGroupEl=null;this.resizeObserver=null;this.intrinsicWidthRetryCount=0;this.tabLayoutPendingFrames=0;this.panelNavTransition=new c;this.panelToolsTransition=new c;this.overflowCoalescer=d((()=>{this.updateTabsCollapsed()}));this.chromeTransitionShell=null;this.committedSection="";this.pendingSection="";this.onChromeTransitionStart=s=>{const t=b(s);if(t==="panel-nav"){this.panelNavTransition.enter();return}if(t==="panel-tools"){const t=v(s)??"opening";if(t==="closing"){this.panelToolsTransition.enter()}}};this.onChromeTransitionEnd=s=>{const t=b(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 hasOverflowTabs(){return this.tabLayoutCommitted&&this.tabsCollapsed&&this.overflowTabs.length>0}digestTabsConfig(s){return s.map((s=>a(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.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()}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(o(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(){const s=x(this.probeTabGroupEl);return s?.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=x(this.probeTabGroupEl);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 n=parseFloat(e.columnGap||e.gap)||0;const r=i.reduce(((s,t)=>s+t),0);const a=n*Math.max(0,i.length-1);const o=Math.max(0,s.scrollWidth-r-a);return{itemWidths:i,itemGap:n,listExtraWidth:o}}setOverflowTabLayout(s,t){const i=t.length>0;const e=this.digestTabsConfig(s)!==this.digestTabsConfig(this.visibleTabs);const n=this.digestTabsConfig(t)!==this.digestTabsConfig(this.overflowTabs);if(e){this.visibleTabs=s}if(n){this.overflowTabs=t}if(i!==this.tabsCollapsed){this.tabsCollapsed=i;if(!i){this.menuOpen=false}}}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=O(i,this.getLeftZoneAvailableWidth(),this.tabsCollapsed,s.OVERFLOW_HYSTERESIS_PX);if(!e){this.setOverflowTabLayout(this.resolvedTabs,[]);this.tabLayoutCommitted=true;return}const n=E(t.itemWidths,this.getLeftZoneAvailableWidth(),this.getOverflowTriggerReserveWidth(),t.itemGap,t.listExtraWidth);const r=S(this.resolvedTabs.slice(0,n));const a=this.resolvedTabs.slice(r.length);this.setOverflowTabLayout(r,a);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?h(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=M(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}=l(this.currentUrl,this.basePath,s);this.urlDerivedValue=t;this.hideTabsForDetailRoute=i}selectTab(s){this.value=s;this.dsTabChange.emit(s)}focusVisibleSelectedTab(){const s=T(this.visibleTabGroupEl,`[data-tab-id="${this.effectiveValue}"]`);s?.focus({preventScroll:true})}handleTabChange(s){this.selectTab(s.detail)}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}handleTabRovingExit(s){if(s.detail!=="end"||!this.hasOverflowTabs)return;this.overflowRovingFocused=true;void this.triggerEl?.setFocus?.()}handleTriggerKeyDown(s){if(!this.hasOverflowTabs)return;if(!this.menuOpen){if(s.key==="ArrowLeft"){s.preventDefault();this.overflowRovingFocused=false;void this.visibleTabGroupEl?.focusLastTab();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?.()}}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 r=this.hasOverflowTabs?this.visibleTabs:this.resolvedTabs;return e(n,{key:"0dcf11918e7de012aabb9da6a628199f1feb110c"},e("header",{key:"52df548473157878d6cec109111261337458dc0a",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:"ee29f2d9acad2250b412329bb367b8434a5096de",class:"bar-nav__tabs-probe","aria-hidden":"true",inert:true},e("ds-tab-group-nav",{key:`probe-${i}`,ref:s=>{const t=s??null;if(t===this.probeTabGroupEl)return;this.probeTabGroupEl=t;if(t){this.intrinsicWidthRetryCount=0;this.tabLayoutPendingFrames=0;this.scheduleOverflowCheck()}},tabs:this.resolvedTabs,value:this.effectiveValue})),t&&this.tabLayoutCommitted&&r.length>0&&e("div",{key:"25c92f0b7376915dcdfde89774e63aef2f90c9c7",class:"bar-nav__left"},e("ds-tab-group-nav",{key:`visible-${i}`,class:"bar-nav__tabs-visible",ref:s=>{this.visibleTabGroupEl=s??null},tabs:r,value:this.effectiveValue,selectionFollowsFocus:false,rovingEnabled:!this.overflowRovingFocused,onDsChange:s=>this.handleTabChange(s),onDsRovingExit:s=>this.handleTabRovingExit(s),onFocusin:()=>{this.overflowRovingFocused=false}})),t&&!this.tabLayoutCommitted&&e("div",{key:"4f7de99b7d90b9deca90bd68ca66cadf834c9d23",class:"bar-nav__tabs-pending","aria-hidden":"true"}),!t&&this.heading&&e("ds-text",{key:"fbd3ff14c2b0cb6b09b82a784cfa02e11435cc50",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:"10dbfd8ae578bce9d0153e542bc3a26bc95dfb9b",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:"56f52e5ade9fec4915bf3986e593041af90e4085",ref:s=>{this.menuEl=s??null},open:this.menuOpen,sections:M(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 j()}},[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],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}]}]);H.HOST_PROP_SYNC_BUDGET=8;H.INTRINSIC_WIDTH_RETRY_MAX=3;H.TAB_LAYOUT_COMMIT_MAX_FRAMES=16;H.OVERFLOW_HYSTERESIS_PX=8;function L(){if(typeof customElements==="undefined"){return}const s=["ds-bar-nav","ds-badge","ds-button-unfilled","ds-icon","ds-menu","ds-shell-gradient-picker","ds-shell-gradient-swatch","ds-tab-group-nav","ds-text"];s.forEach((s=>{switch(s){case"ds-bar-nav":if(!customElements.get(r(s))){customElements.define(r(s),H)}break;case"ds-badge":if(!customElements.get(r(s))){p()}break;case"ds-button-unfilled":if(!customElements.get(r(s))){g()}break;case"ds-icon":if(!customElements.get(r(s))){m()}break;case"ds-menu":if(!customElements.get(r(s))){y()}break;case"ds-shell-gradient-picker":if(!customElements.get(r(s))){_()}break;case"ds-shell-gradient-swatch":if(!customElements.get(r(s))){w()}break;case"ds-tab-group-nav":if(!customElements.get(r(s))){C()}break;case"ds-text":if(!customElements.get(r(s))){k()}break}}))}L();const R=H;const V=L;export{R as DsBarNav,V as defineCustomElement};
 //# sourceMappingURL=ds-bar-nav.js.map

package/dist/components/ds-bar-nav.js.map

@@ -1 +1 @@
-{"version":3,"names":["queryWithinComponentHost","host","selector","root","shadowRoot","querySelector","getTabListFromTabGroup","tabGroupEl","tabsToMenuSections","tabs","selectedId","sections","batch","item","isTabDivider","length","push","items","label","value","id","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","resolvedTabs","urlDerivedValue","hideTabsForDetailRoute","tabsCollapsed","menuOpen","tabLayoutCommitted","visibleTabs","overflowTabs","menuInitialFocusVisible","overflowRovingFocused","headerEl","triggerEl","menuEl","visibleTabGroupEl","probeTabGroupEl","resizeObserver","intrinsicWidthRetryCount","tabLayoutPendingFrames","panelNavTransition","ChromeTransitionDepth","panelToolsTransition","overflowCoalescer","createRafCoalescer","updateTabsCollapsed","chromeTransitionShell","committedSection","pendingSection","onChromeTransitionStart","event","source","readChromeTransitionSource","enter","phase","readChromeTransitionPhase","onChromeTransitionEnd","exit","isActive","scheduleOverflowCheck","handleOverflowFocus","handleOverflowBlur","effectiveValue","hasOverflowTabs","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","tabList","scrollWidth","getHeaderGap","style","columnGap","gap","getOverflowTriggerReserveWidth","getBoundingClientRect","getProbeTabMetrics","children","Array","from","child","some","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","tab","focus","preventScroll","handleTabChange","toggleTabMenu","options","minWidth","focusVisible","handleTabRovingExit","setFocus","handleTriggerKeyDown","key","preventDefault","focusLastTab","render","sectionReady","hasTabs","tabGroupKey","renderedTabs","h","Host","class","ref","inert","next","selectionFollowsFocus","rovingEnabled","onDsChange","onDsRovingExit","onFocusin","heading","as","variant","emphasis","color","wrap","icon","activeFill","hasBorder","focusTabIndex","haspopup","expanded","onDsClick","onFocusout","onKeyDown","side","align","sideOffset","alignOffset","initialFocusVisible","onDsSelect","onDsClose"],"sources":["src/wc/components/BarNav/bar-nav-dom-utils.ts","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":["export type QueryableHost = {\n  shadowRoot?: ShadowRoot | null;\n  querySelector: (selectors: string) => Element | null;\n};\n\n/**\n * Query within a Stencil custom-element host (light DOM today, shadow DOM–safe).\n * Use for child nodes owned by ds-tab-group and similar components.\n */\nexport function queryWithinComponentHost(\n  host: QueryableHost | null | undefined,\n  selector: string,\n): HTMLElement | null {\n  if (!host) return null;\n  const root = host.shadowRoot ?? host;\n  return root.querySelector(selector) as HTMLElement | null;\n}\n\nexport function getTabListFromTabGroup(\n  tabGroupEl: QueryableHost | null | undefined,\n): HTMLElement | null {\n  return queryWithinComponentHost(tabGroupEl, '[role=\"tablist\"]');\n}\n","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      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\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[gradient]) .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__left ds-tab-group-nav {\n  flex: 1;\n  min-width: 0;\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 ds-tab-group-nav {\n  width: max-content;\n}\n\n.bar-nav__tabs-visible {\n  width: 100%;\n  min-width: 0;\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.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  color: var(--_bar-nav-fg-primary);\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 '../../nav/nav-chrome';\nimport type { MenuItemData } from '../Menu/menu-types';\nimport { isTabDivider } 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  getTabListFromTabGroup,\n  queryWithinComponentHost,\n  type QueryableHost,\n} from './bar-nav-dom-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  ChromeTransitionDepth,\n  createRafCoalescer,\n  readChromeTransitionSource,\n  readChromeTransitionPhase,\n} from '../../nav/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\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\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 visibleTabGroupEl: HTMLDsTabGroupNavElement | null = null;\n  private probeTabGroupEl: QueryableHost | null = null;\n  private resizeObserver: ResizeObserver | null = null;\n  private intrinsicWidthRetryCount = 0;\n  private tabLayoutPendingFrames = 0;\n  private readonly panelNavTransition = new ChromeTransitionDepth();\n  private readonly panelToolsTransition = new ChromeTransitionDepth();\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 hasOverflowTabs(): boolean {\n    return this.tabLayoutCommitted && this.tabsCollapsed && this.overflowTabs.length > 0;\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.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  }\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    const tabList = getTabListFromTabGroup(this.probeTabGroupEl);\n    return tabList?.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 = getTabListFromTabGroup(this.probeTabGroupEl);\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  }\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 = queryWithinComponentHost(\n      this.visibleTabGroupEl,\n      `[data-tab-id=\"${this.effectiveValue}\"]`,\n    );\n    tab?.focus({ preventScroll: true });\n  }\n\n  private handleTabChange(e: Event) {\n    this.selectTab((e as CustomEvent<string>).detail);\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 handleTabRovingExit(e: CustomEvent<'start' | 'end'>) {\n    if (e.detail !== 'end' || !this.hasOverflowTabs) return;\n    this.overflowRovingFocused = true;\n    void this.triggerEl?.setFocus?.();\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        void this.visibleTabGroupEl?.focusLastTab();\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  render() {\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                <ds-tab-group-nav\n                  key={`probe-${tabGroupKey}`}\n                  ref={el => {\n                    const next = el ?? null;\n                    if (next === this.probeTabGroupEl) return;\n                    this.probeTabGroupEl = next;\n                    if (next) {\n                      this.intrinsicWidthRetryCount = 0;\n                      this.tabLayoutPendingFrames = 0;\n                      this.scheduleOverflowCheck();\n                    }\n                  }}\n                  tabs={this.resolvedTabs}\n                  value={this.effectiveValue}\n                />\n              </div>\n            )}\n\n            {hasTabs && this.tabLayoutCommitted && renderedTabs.length > 0 && (\n              <div class=\"bar-nav__left\">\n                <ds-tab-group-nav\n                  key={`visible-${tabGroupKey}`}\n                  class=\"bar-nav__tabs-visible\"\n                  ref={el => {\n                    this.visibleTabGroupEl = el ?? null;\n                  }}\n                  tabs={renderedTabs}\n                  value={this.effectiveValue}\n                  selectionFollowsFocus={false}\n                  rovingEnabled={!this.overflowRovingFocused}\n                  onDsChange={(e: Event) => this.handleTabChange(e)}\n                  onDsRovingExit={(e: CustomEvent<'start' | 'end'>) => this.handleTabRovingExit(e)}\n                  onFocusin={() => {\n                    this.overflowRovingFocused = false;\n                  }}\n                />\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=\"inherit\"\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=\"More tabs\"\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":[]}
+{"version":3,"names":["queryWithinComponentHost","host","selector","root","shadowRoot","querySelector","getTabListFromTabGroup","tabGroupEl","tabsToMenuSections","tabs","selectedId","sections","batch","item","isTabDivider","length","push","items","label","value","id","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","headerEl","triggerEl","menuEl","visibleTabGroupEl","probeTabGroupEl","resizeObserver","intrinsicWidthRetryCount","tabLayoutPendingFrames","panelNavTransition","ChromeTransitionDepth","panelToolsTransition","overflowCoalescer","createRafCoalescer","updateTabsCollapsed","chromeTransitionShell","committedSection","pendingSection","onChromeTransitionStart","event","source","readChromeTransitionSource","enter","phase","readChromeTransitionPhase","onChromeTransitionEnd","exit","isActive","scheduleOverflowCheck","handleOverflowFocus","handleOverflowBlur","effectiveValue","hasOverflowTabs","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","tabList","scrollWidth","getHeaderGap","style","columnGap","gap","getOverflowTriggerReserveWidth","getBoundingClientRect","getProbeTabMetrics","children","Array","from","child","some","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","tab","focus","preventScroll","handleTabChange","toggleTabMenu","options","minWidth","focusVisible","handleTabRovingExit","setFocus","handleTriggerKeyDown","key","preventDefault","focusLastTab","render","sectionReady","hasTabs","tabGroupKey","renderedTabs","h","Host","class","ref","inert","next","selectionFollowsFocus","rovingEnabled","onDsChange","onDsRovingExit","onFocusin","heading","as","variant","emphasis","color","wrap","icon","activeFill","hasBorder","focusTabIndex","haspopup","expanded","onDsClick","onFocusout","onKeyDown","side","align","sideOffset","alignOffset","initialFocusVisible","onDsSelect","onDsClose"],"sources":["src/wc/components/BarNav/bar-nav-dom-utils.ts","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":["export type QueryableHost = {\n  shadowRoot?: ShadowRoot | null;\n  querySelector: (selectors: string) => Element | null;\n};\n\n/**\n * Query within a Stencil custom-element host (light DOM today, shadow DOM–safe).\n * Use for child nodes owned by ds-tab-group and similar components.\n */\nexport function queryWithinComponentHost(\n  host: QueryableHost | null | undefined,\n  selector: string,\n): HTMLElement | null {\n  if (!host) return null;\n  const root = host.shadowRoot ?? host;\n  return root.querySelector(selector) as HTMLElement | null;\n}\n\nexport function getTabListFromTabGroup(\n  tabGroupEl: QueryableHost | null | undefined,\n): HTMLElement | null {\n  return queryWithinComponentHost(tabGroupEl, '[role=\"tablist\"]');\n}\n","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      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\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[gradient]) .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__left ds-tab-group-nav {\n  flex: 1;\n  min-width: 0;\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 ds-tab-group-nav {\n  width: max-content;\n}\n\n.bar-nav__tabs-visible {\n  width: 100%;\n  min-width: 0;\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 '../../nav/nav-chrome';\nimport type { MenuItemData } from '../Menu/menu-types';\nimport { isTabDivider } 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  getTabListFromTabGroup,\n  queryWithinComponentHost,\n  type QueryableHost,\n} from './bar-nav-dom-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  ChromeTransitionDepth,\n  createRafCoalescer,\n  readChromeTransitionSource,\n  readChromeTransitionPhase,\n} from '../../nav/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\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 visibleTabGroupEl: HTMLDsTabGroupNavElement | null = null;\n  private probeTabGroupEl: QueryableHost | null = null;\n  private resizeObserver: ResizeObserver | null = null;\n  private intrinsicWidthRetryCount = 0;\n  private tabLayoutPendingFrames = 0;\n  private readonly panelNavTransition = new ChromeTransitionDepth();\n  private readonly panelToolsTransition = new ChromeTransitionDepth();\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 hasOverflowTabs(): boolean {\n    return this.tabLayoutCommitted && this.tabsCollapsed && this.overflowTabs.length > 0;\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.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  }\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    const tabList = getTabListFromTabGroup(this.probeTabGroupEl);\n    return tabList?.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 = getTabListFromTabGroup(this.probeTabGroupEl);\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  }\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 = queryWithinComponentHost(\n      this.visibleTabGroupEl,\n      `[data-tab-id=\"${this.effectiveValue}\"]`,\n    );\n    tab?.focus({ preventScroll: true });\n  }\n\n  private handleTabChange(e: Event) {\n    this.selectTab((e as CustomEvent<string>).detail);\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 handleTabRovingExit(e: CustomEvent<'start' | 'end'>) {\n    if (e.detail !== 'end' || !this.hasOverflowTabs) return;\n    this.overflowRovingFocused = true;\n    void this.triggerEl?.setFocus?.();\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        void this.visibleTabGroupEl?.focusLastTab();\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  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                <ds-tab-group-nav\n                  key={`probe-${tabGroupKey}`}\n                  ref={el => {\n                    const next = el ?? null;\n                    if (next === this.probeTabGroupEl) return;\n                    this.probeTabGroupEl = next;\n                    if (next) {\n                      this.intrinsicWidthRetryCount = 0;\n                      this.tabLayoutPendingFrames = 0;\n                      this.scheduleOverflowCheck();\n                    }\n                  }}\n                  tabs={this.resolvedTabs}\n                  value={this.effectiveValue}\n                />\n              </div>\n            )}\n\n            {hasTabs && this.tabLayoutCommitted && renderedTabs.length > 0 && (\n              <div class=\"bar-nav__left\">\n                <ds-tab-group-nav\n                  key={`visible-${tabGroupKey}`}\n                  class=\"bar-nav__tabs-visible\"\n                  ref={el => {\n                    this.visibleTabGroupEl = el ?? null;\n                  }}\n                  tabs={renderedTabs}\n                  value={this.effectiveValue}\n                  selectionFollowsFocus={false}\n                  rovingEnabled={!this.overflowRovingFocused}\n                  onDsChange={(e: Event) => this.handleTabChange(e)}\n                  onDsRovingExit={(e: CustomEvent<'start' | 'end'>) => this.handleTabRovingExit(e)}\n                  onFocusin={() => {\n                    this.overflowRovingFocused = false;\n                  }}\n                />\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":[]}

package/dist/components/ds-button-filled.js

@@ -1,2 +1,2 @@
-import{B as o,d as s}from"./p-BVNJnFI9.js";const t=o;const n=s;export{t as DsButtonFilled,n as defineCustomElement};
+import{B as o,d as s}from"./p-DOEMwKBb.js";const t=o;const p=s;export{t as DsButtonFilled,p as defineCustomElement};
 //# sourceMappingURL=ds-button-filled.js.map

package/dist/components/ds-button-unfilled.js

@@ -1,2 +1,2 @@
-import{B as o,d as s}from"./p-CNgNgezy.js";const t=o;const p=s;export{t as DsButtonUnfilled,p as defineCustomElement};
+import{B as o,d as s}from"./p-DHjjwgku.js";const t=o;const j=s;export{t as DsButtonUnfilled,j as defineCustomElement};
 //# sourceMappingURL=ds-button-unfilled.js.map

package/dist/components/ds-card-data-viz-donut.js

@@ -1,2 +1,2 @@
-import{p as t,H as a,c as e,h as s,a as d,t as i}from"./index.js";import{d as c}from"./p-DQ3l2TXw.js";import{d as n}from"./p-CNgNgezy.js";import{d as o}from"./p-CQmul5NK.js";import{d as r}from"./p-9Qu1ls2y.js";import{d as l}from"./p-sBx2MuF2.js";const h=()=>`.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 f=t(class t extends a{constructor(t){super();if(t!==false){this.__registerHost()}this.dsFilterClick=e(this,"dsFilterClick");this.cardWidth="md";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 s(d,{key:"465cc0bdeccb6864d295f9889363112af5def480",class:"card-data-viz-donut"},s("ds-card",{key:"f4aeb6baf6f153ff83eaac9e4fc2dee44a792c93",heading:this.heading,cardWidth:this.cardWidth},s("ds-button-unfilled",{key:"a4ca1104ef44957bc3a4cc81b8eab655042c972f",slot:"actions",variant:"icon",type:"button",icon:"Filters","aria-label":"Filter",onDsClick:this.handleFilterClick}),s("div",{key:"0485a0c2b5c56363f8d781036a8b48b4aa8ba22d",class:"card-data-viz-donut__layout"},this.hasChartSlot&&s("div",{key:"febe0a30c05c1eeed1131538ffd57049b09566e3",class:"card-data-viz-donut__chart-region"},s("slot",{key:"d8a455b4551eaa008715491120f9d6bccf6494d3",name:"chart"})),this.hasLegendSlot&&s("div",{key:"dd8114f1aad15b643242726016dcf5c27df6fed3",class:"card-data-viz-donut__legend-region"},s("slot",{key:"2fc2bbb103ee3907c1a2d4e8f8e8a0413bfaa499",name:"legend"})))))}get el(){return this}static get style(){return h()}},[262,"ds-card-data-viz-donut",{heading:[1],cardWidth:[1,"card-width"],hasChartSlot:[32],hasLegendSlot:[32]}]);function u(){if(typeof customElements==="undefined"){return}const t=["ds-card-data-viz-donut","ds-badge","ds-button-unfilled","ds-card","ds-icon","ds-text"];t.forEach((t=>{switch(t){case"ds-card-data-viz-donut":if(!customElements.get(i(t))){customElements.define(i(t),f)}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-text":if(!customElements.get(i(t))){l()}break}}))}u();const m=f;const b=u;export{m as DsCardDataVizDonut,b as defineCustomElement};
+import{p as t,H as e,c as s,h as a,a as d,t as i}from"./index.js";import{d as n}from"./p-DEgY_Lnb.js";import{d as c}from"./p-DHjjwgku.js";import{d as o}from"./p-DMD-RO1W.js";import{d as r}from"./p-9Qu1ls2y.js";import{d as l}from"./p-BOQRM49Q.js";const h=()=>`.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 f=t(class t extends e{constructor(t){super();if(t!==false){this.__registerHost()}this.dsFilterClick=s(this,"dsFilterClick");this.cardWidth="md";this.filterLabel="Filter";this.hasChartSlot=false;this.hasLegendSlot=false;this.handleChartHover=t=>{const e=this.el.querySelector('[slot="legend"]');if(!e||!("activeLabel"in e))return;e.activeLabel=t.detail?.label??null};this.handleLegendHover=t=>{const e=this.el.querySelector('[slot="chart"]');if(!e||!("activeLabel"in e))return;e.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 a(d,{key:"91451b7965425014f9de9246d20b4fa94e8e5793",class:"card-data-viz-donut"},a("ds-card",{key:"a2dd46142efe1ff45cecf62f47c366cdffba25bc",heading:this.heading,cardWidth:this.cardWidth},a("ds-button-unfilled",{key:"8117a7986800db33ba3f97a19f3a07c698484f3b",slot:"actions",variant:"icon",type:"button",icon:"Filters","aria-label":this.filterLabel,onDsClick:this.handleFilterClick}),a("div",{key:"a6197199811286133de9a57a9f05c22f9db4778f",class:"card-data-viz-donut__layout"},this.hasChartSlot&&a("div",{key:"2a5909d4689ee3efb601e7904eb31257d6193ad8",class:"card-data-viz-donut__chart-region"},a("slot",{key:"d2d2248f56e533eb4f3cc81c709404058444dd75",name:"chart"})),this.hasLegendSlot&&a("div",{key:"74ac4321927ef009be24ea26fe291bc7e09158e3",class:"card-data-viz-donut__legend-region"},a("slot",{key:"7f51d0ad31530bbcf3dc82bfd932bc1466b9f6c2",name:"legend"})))))}get el(){return this}static get style(){return h()}},[262,"ds-card-data-viz-donut",{heading:[1],cardWidth:[1,"card-width"],filterLabel:[1,"filter-label"],hasChartSlot:[32],hasLegendSlot:[32]}]);function u(){if(typeof customElements==="undefined"){return}const t=["ds-card-data-viz-donut","ds-badge","ds-button-unfilled","ds-card","ds-icon","ds-text"];t.forEach((t=>{switch(t){case"ds-card-data-viz-donut":if(!customElements.get(i(t))){customElements.define(i(t),f)}break;case"ds-badge":if(!customElements.get(i(t))){n()}break;case"ds-button-unfilled":if(!customElements.get(i(t))){c()}break;case"ds-card":if(!customElements.get(i(t))){o()}break;case"ds-icon":if(!customElements.get(i(t))){r()}break;case"ds-text":if(!customElements.get(i(t))){l()}break}}))}u();const m=f;const b=u;export{m as DsCardDataVizDonut,b as defineCustomElement};
 //# sourceMappingURL=ds-card-data-viz-donut.js.map

package/dist/components/ds-card-data-viz-donut.js.map

@@ -1 +1 @@
-{"version":3,"names":["cardDataVizDonutCss","CardDataVizDonut","__stencil_proxyCustomElement","HTMLElement","constructor","registerHost","this","cardWidth","hasChartSlot","hasLegendSlot","handleChartHover","e","legend","el","querySelector","activeLabel","detail","label","handleLegendHover","chart","handleFilterClick","dsFilterClick","emit","componentWillRender","componentDidLoad","addEventListener","disconnectedCallback","removeEventListener","render","h","Host","key","class","heading","slot","variant","type","icon","onDsClick","name"],"sources":["src/wc/components/CardDataVizDonut/CardDataVizDonut.css?tag=ds-card-data-viz-donut&encapsulation=scoped","src/wc/components/CardDataVizDonut/CardDataVizDonut.tsx"],"sourcesContent":[":host {\n  display: contents;\n}\n\n.card-data-viz-donut__layout {\n  display: flex;\n  flex-direction: column;\n  flex: 1 1 auto;\n  min-height: 0;\n  height: 100%;\n  gap: var(--dimension-space-200);\n  box-sizing: border-box;\n}\n\n/*\n * Chart region fills leftover space; legend stays content-sized.\n * Padding is per-region so the body gap isn't doubled at the shared edge.\n */\n.card-data-viz-donut__chart-region {\n  flex: 1 1 auto;\n  min-height: 0;\n  /* Stretch the slotted donut to the full region; the donut centers its own SVG. */\n  display: grid;\n  padding: var(--dimension-space-400) var(--dimension-space-400) 0 var(--dimension-space-400);\n  box-sizing: border-box;\n}\n\n/* Make the slotted donut stretch to the region so ResizeObserver can measure fill size. */\n.card-data-viz-donut__chart-region > * {\n  width: 100%;\n  height: 100%;\n  min-width: 0;\n  min-height: 0;\n  max-width: 100%;\n  max-height: 100%;\n}\n\n.card-data-viz-donut__legend-region {\n  flex: 0 0 auto;\n  padding: 0 var(--dimension-space-100) var(--dimension-space-100) var(--dimension-space-100);\n  box-sizing: border-box;\n}\n","import { Component, Element, Event, EventEmitter, State, h, Host, Prop } from '@stencil/core';\nimport type { CardWidth } from '../Card/Card';\n\nexport type CardDataVizDonutWidth = CardWidth;\n\n/** Matches the `dsSliceHover`/`dsItemHover` detail shape emitted by `ds-chart-*` and `ds-chart-legend`. */\ntype HoveredDatum = { label: string } | null;\n\n/** A slotted chart/legend that opts into hover sync by exposing an `activeLabel` prop. */\ntype SyncableSlot = HTMLElement & { activeLabel?: string | null };\n\n/**\n * Donut data-viz card — shared `ds-card` chrome with a fill chart region and\n * content-sized legend. Hover sync between chart and legend stays here.\n */\n@Component({\n  tag: 'ds-card-data-viz-donut',\n  styleUrl: 'CardDataVizDonut.css',\n  scoped: true,\n})\nexport class CardDataVizDonut {\n  @Element() el!: HTMLElement;\n\n  /** Widget heading shown in the card header. */\n  @Prop() heading!: string;\n\n  /** Card width token — also sets matching min-height. */\n  @Prop() cardWidth: CardDataVizDonutWidth = 'md';\n\n  /** Emits when the header filter control is activated. */\n  @Event() dsFilterClick!: EventEmitter<void>;\n\n  // Scoped (light-DOM) components have no native slot projection to detect emptiness from CSS —\n  // check the actual children so an unused region (e.g. no legend) doesn't render a dangling\n  // padded box plus a body gap next to nothing.\n  @State() private hasChartSlot = false;\n  @State() private hasLegendSlot = false;\n\n  componentWillRender() {\n    // Not `:scope >` — Stencil's scoped slot polyfill relocates slotted children into\n    // region wrappers (and here into nested `ds-card`), so they may not stay direct\n    // host children across renders.\n    this.hasChartSlot = !!this.el.querySelector('[slot=\"chart\"]');\n    this.hasLegendSlot = !!this.el.querySelector('[slot=\"legend\"]');\n  }\n\n  componentDidLoad() {\n    // Sync the chart's and legend's `activeLabel` from each other's hover events, so any\n    // ds-chart-donut + ds-chart-legend pair cross-highlights without every consumer having to\n    // wire it up by hand. Delegated on the host (rather than bound to the specific slotted\n    // elements) since Stencil events bubble and the slot content can be swapped at runtime.\n    this.el.addEventListener('dsSliceHover', this.handleChartHover);\n    this.el.addEventListener('dsItemHover', this.handleLegendHover);\n  }\n\n  disconnectedCallback() {\n    this.el.removeEventListener('dsSliceHover', this.handleChartHover);\n    this.el.removeEventListener('dsItemHover', this.handleLegendHover);\n  }\n\n  private handleChartHover = (e: Event) => {\n    // Not `:scope >` — Stencil's slot polyfill for scoped (non-shadow) components relocates\n    // slotted children into an inner region wrapper on render, so they're no longer direct\n    // children of the host by the time this fires.\n    const legend = this.el.querySelector('[slot=\"legend\"]') as SyncableSlot | null;\n    if (!legend || !('activeLabel' in legend)) return;\n    legend.activeLabel = (e as CustomEvent<HoveredDatum>).detail?.label ?? null;\n  };\n\n  private handleLegendHover = (e: Event) => {\n    const chart = this.el.querySelector('[slot=\"chart\"]') as SyncableSlot | null;\n    if (!chart || !('activeLabel' in chart)) return;\n    chart.activeLabel = (e as CustomEvent<HoveredDatum>).detail?.label ?? null;\n  };\n\n  private handleFilterClick = () => {\n    this.dsFilterClick.emit();\n  };\n\n  render() {\n    return (\n      <Host class=\"card-data-viz-donut\">\n        <ds-card heading={this.heading} cardWidth={this.cardWidth}>\n          <ds-button-unfilled\n            slot=\"actions\"\n            variant=\"icon\"\n            type=\"button\"\n            icon=\"Filters\"\n            aria-label=\"Filter\"\n            onDsClick={this.handleFilterClick}\n          />\n          <div class=\"card-data-viz-donut__layout\">\n            {this.hasChartSlot && (\n              <div class=\"card-data-viz-donut__chart-region\">\n                <slot name=\"chart\" />\n              </div>\n            )}\n            {this.hasLegendSlot && (\n              <div class=\"card-data-viz-donut__legend-region\">\n                <slot name=\"legend\" />\n              </div>\n            )}\n          </div>\n        </ds-card>\n      </Host>\n    );\n  }\n}\n"],"mappings":"sPAAA,MAAMA,EAAsB,IAAM,kyB,MCoBrBC,EAAgBC,EAAA,MAAAD,UAAAE,EAL7B,WAAAC,CAAAC,G,uFAYUC,KAAAC,UAAmC,KAQ1BD,KAAAE,aAAe,MACfF,KAAAG,cAAgB,MAwBzBH,KAAAI,iBAAoBC,IAI1B,MAAMC,EAASN,KAAKO,GAAGC,cAAc,mBACrC,IAAKF,KAAY,gBAAiBA,GAAS,OAC3CA,EAAOG,YAAeJ,EAAgCK,QAAQC,OAAS,IAAI,EAGrEX,KAAAY,kBAAqBP,IAC3B,MAAMQ,EAAQb,KAAKO,GAAGC,cAAc,kBACpC,IAAKK,KAAW,gBAAiBA,GAAQ,OACzCA,EAAMJ,YAAeJ,EAAgCK,QAAQC,OAAS,IAAI,EAGpEX,KAAAc,kBAAoB,KAC1Bd,KAAKe,cAAcC,MAAM,CA+B5B,CArEC,mBAAAC,GAIEjB,KAAKE,eAAiBF,KAAKO,GAAGC,cAAc,kBAC5CR,KAAKG,gBAAkBH,KAAKO,GAAGC,cAAc,kB,CAG/C,gBAAAU,GAKElB,KAAKO,GAAGY,iBAAiB,eAAgBnB,KAAKI,kBAC9CJ,KAAKO,GAAGY,iBAAiB,cAAenB,KAAKY,kB,CAG/C,oBAAAQ,GACEpB,KAAKO,GAAGc,oBAAoB,eAAgBrB,KAAKI,kBACjDJ,KAAKO,GAAGc,oBAAoB,cAAerB,KAAKY,kB,CAsBlD,MAAAU,GACE,OACEC,EAACC,EAAI,CAAAC,IAAA,2CAACC,MAAM,uBACVH,EAAA,WAAAE,IAAA,2CAASE,QAAS3B,KAAK2B,QAAS1B,UAAWD,KAAKC,WAC9CsB,EAAA,sBAAAE,IAAA,2CACEG,KAAK,UACLC,QAAQ,OACRC,KAAK,SACLC,KAAK,UAAS,aACH,SACXC,UAAWhC,KAAKc,oBAElBS,EAAA,OAAAE,IAAA,2CAAKC,MAAM,+BACR1B,KAAKE,cACJqB,EAAA,OAAAE,IAAA,2CAAKC,MAAM,qCACTH,EAAA,QAAAE,IAAA,2CAAMQ,KAAK,WAGdjC,KAAKG,eACJoB,EAAA,OAAAE,IAAA,2CAAKC,MAAM,sCACTH,EAAA,QAAAE,IAAA,2CAAMQ,KAAK,c","ignoreList":[]}
+{"version":3,"names":["cardDataVizDonutCss","CardDataVizDonut","__stencil_proxyCustomElement","HTMLElement","constructor","registerHost","this","cardWidth","filterLabel","hasChartSlot","hasLegendSlot","handleChartHover","e","legend","el","querySelector","activeLabel","detail","label","handleLegendHover","chart","handleFilterClick","dsFilterClick","emit","componentWillRender","componentDidLoad","addEventListener","disconnectedCallback","removeEventListener","render","h","Host","key","class","heading","slot","variant","type","icon","onDsClick","name"],"sources":["src/wc/components/CardDataVizDonut/CardDataVizDonut.css?tag=ds-card-data-viz-donut&encapsulation=scoped","src/wc/components/CardDataVizDonut/CardDataVizDonut.tsx"],"sourcesContent":[":host {\n  display: contents;\n}\n\n.card-data-viz-donut__layout {\n  display: flex;\n  flex-direction: column;\n  flex: 1 1 auto;\n  min-height: 0;\n  height: 100%;\n  gap: var(--dimension-space-200);\n  box-sizing: border-box;\n}\n\n/*\n * Chart region fills leftover space; legend stays content-sized.\n * Padding is per-region so the body gap isn't doubled at the shared edge.\n */\n.card-data-viz-donut__chart-region {\n  flex: 1 1 auto;\n  min-height: 0;\n  /* Stretch the slotted donut to the full region; the donut centers its own SVG. */\n  display: grid;\n  padding: var(--dimension-space-400) var(--dimension-space-400) 0 var(--dimension-space-400);\n  box-sizing: border-box;\n}\n\n/* Make the slotted donut stretch to the region so ResizeObserver can measure fill size. */\n.card-data-viz-donut__chart-region > * {\n  width: 100%;\n  height: 100%;\n  min-width: 0;\n  min-height: 0;\n  max-width: 100%;\n  max-height: 100%;\n}\n\n.card-data-viz-donut__legend-region {\n  flex: 0 0 auto;\n  padding: 0 var(--dimension-space-100) var(--dimension-space-100) var(--dimension-space-100);\n  box-sizing: border-box;\n}\n","import { Component, Element, Event, EventEmitter, State, h, Host, Prop } from '@stencil/core';\nimport type { CardWidth } from '../Card/Card';\n\nexport type CardDataVizDonutWidth = CardWidth;\n\n/** Matches the `dsSliceHover`/`dsItemHover` detail shape emitted by `ds-chart-*` and `ds-chart-legend`. */\ntype HoveredDatum = { label: string } | null;\n\n/** A slotted chart/legend that opts into hover sync by exposing an `activeLabel` prop. */\ntype SyncableSlot = HTMLElement & { activeLabel?: string | null };\n\n/**\n * Donut data-viz card — shared `ds-card` chrome with a fill chart region and\n * content-sized legend. Hover sync between chart and legend stays here.\n */\n@Component({\n  tag: 'ds-card-data-viz-donut',\n  styleUrl: 'CardDataVizDonut.css',\n  scoped: true,\n})\nexport class CardDataVizDonut {\n  @Element() el!: HTMLElement;\n\n  /** Widget heading shown in the card header. */\n  @Prop() heading!: string;\n\n  /** Card width token — also sets matching min-height. */\n  @Prop() cardWidth: CardDataVizDonutWidth = 'md';\n  @Prop() filterLabel: string = 'Filter';\n\n  /** Emits when the header filter control is activated. */\n  @Event() dsFilterClick!: EventEmitter<void>;\n\n  // Scoped (light-DOM) components have no native slot projection to detect emptiness from CSS —\n  // check the actual children so an unused region (e.g. no legend) doesn't render a dangling\n  // padded box plus a body gap next to nothing.\n  @State() private hasChartSlot = false;\n  @State() private hasLegendSlot = false;\n\n  componentWillRender() {\n    // Not `:scope >` — Stencil's scoped slot polyfill relocates slotted children into\n    // region wrappers (and here into nested `ds-card`), so they may not stay direct\n    // host children across renders.\n    this.hasChartSlot = !!this.el.querySelector('[slot=\"chart\"]');\n    this.hasLegendSlot = !!this.el.querySelector('[slot=\"legend\"]');\n  }\n\n  componentDidLoad() {\n    // Sync the chart's and legend's `activeLabel` from each other's hover events, so any\n    // ds-chart-donut + ds-chart-legend pair cross-highlights without every consumer having to\n    // wire it up by hand. Delegated on the host (rather than bound to the specific slotted\n    // elements) since Stencil events bubble and the slot content can be swapped at runtime.\n    this.el.addEventListener('dsSliceHover', this.handleChartHover);\n    this.el.addEventListener('dsItemHover', this.handleLegendHover);\n  }\n\n  disconnectedCallback() {\n    this.el.removeEventListener('dsSliceHover', this.handleChartHover);\n    this.el.removeEventListener('dsItemHover', this.handleLegendHover);\n  }\n\n  private handleChartHover = (e: Event) => {\n    // Not `:scope >` — Stencil's slot polyfill for scoped (non-shadow) components relocates\n    // slotted children into an inner region wrapper on render, so they're no longer direct\n    // children of the host by the time this fires.\n    const legend = this.el.querySelector('[slot=\"legend\"]') as SyncableSlot | null;\n    if (!legend || !('activeLabel' in legend)) return;\n    legend.activeLabel = (e as CustomEvent<HoveredDatum>).detail?.label ?? null;\n  };\n\n  private handleLegendHover = (e: Event) => {\n    const chart = this.el.querySelector('[slot=\"chart\"]') as SyncableSlot | null;\n    if (!chart || !('activeLabel' in chart)) return;\n    chart.activeLabel = (e as CustomEvent<HoveredDatum>).detail?.label ?? null;\n  };\n\n  private handleFilterClick = () => {\n    this.dsFilterClick.emit();\n  };\n\n  render() {\n    return (\n      <Host class=\"card-data-viz-donut\">\n        <ds-card heading={this.heading} cardWidth={this.cardWidth}>\n          <ds-button-unfilled\n            slot=\"actions\"\n            variant=\"icon\"\n            type=\"button\"\n            icon=\"Filters\"\n            aria-label={this.filterLabel}\n            onDsClick={this.handleFilterClick}\n          />\n          <div class=\"card-data-viz-donut__layout\">\n            {this.hasChartSlot && (\n              <div class=\"card-data-viz-donut__chart-region\">\n                <slot name=\"chart\" />\n              </div>\n            )}\n            {this.hasLegendSlot && (\n              <div class=\"card-data-viz-donut__legend-region\">\n                <slot name=\"legend\" />\n              </div>\n            )}\n          </div>\n        </ds-card>\n      </Host>\n    );\n  }\n}\n"],"mappings":"sPAAA,MAAMA,EAAsB,IAAM,kyB,MCoBrBC,EAAgBC,EAAA,MAAAD,UAAAE,EAL7B,WAAAC,CAAAC,G,uFAYUC,KAAAC,UAAmC,KACnCD,KAAAE,YAAsB,SAQbF,KAAAG,aAAe,MACfH,KAAAI,cAAgB,MAwBzBJ,KAAAK,iBAAoBC,IAI1B,MAAMC,EAASP,KAAKQ,GAAGC,cAAc,mBACrC,IAAKF,KAAY,gBAAiBA,GAAS,OAC3CA,EAAOG,YAAeJ,EAAgCK,QAAQC,OAAS,IAAI,EAGrEZ,KAAAa,kBAAqBP,IAC3B,MAAMQ,EAAQd,KAAKQ,GAAGC,cAAc,kBACpC,IAAKK,KAAW,gBAAiBA,GAAQ,OACzCA,EAAMJ,YAAeJ,EAAgCK,QAAQC,OAAS,IAAI,EAGpEZ,KAAAe,kBAAoB,KAC1Bf,KAAKgB,cAAcC,MAAM,CA+B5B,CArEC,mBAAAC,GAIElB,KAAKG,eAAiBH,KAAKQ,GAAGC,cAAc,kBAC5CT,KAAKI,gBAAkBJ,KAAKQ,GAAGC,cAAc,kB,CAG/C,gBAAAU,GAKEnB,KAAKQ,GAAGY,iBAAiB,eAAgBpB,KAAKK,kBAC9CL,KAAKQ,GAAGY,iBAAiB,cAAepB,KAAKa,kB,CAG/C,oBAAAQ,GACErB,KAAKQ,GAAGc,oBAAoB,eAAgBtB,KAAKK,kBACjDL,KAAKQ,GAAGc,oBAAoB,cAAetB,KAAKa,kB,CAsBlD,MAAAU,GACE,OACEC,EAACC,EAAI,CAAAC,IAAA,2CAACC,MAAM,uBACVH,EAAA,WAAAE,IAAA,2CAASE,QAAS5B,KAAK4B,QAAS3B,UAAWD,KAAKC,WAC9CuB,EAAA,sBAAAE,IAAA,2CACEG,KAAK,UACLC,QAAQ,OACRC,KAAK,SACLC,KAAK,UAAS,aACFhC,KAAKE,YACjB+B,UAAWjC,KAAKe,oBAElBS,EAAA,OAAAE,IAAA,2CAAKC,MAAM,+BACR3B,KAAKG,cACJqB,EAAA,OAAAE,IAAA,2CAAKC,MAAM,qCACTH,EAAA,QAAAE,IAAA,2CAAMQ,KAAK,WAGdlC,KAAKI,eACJoB,EAAA,OAAAE,IAAA,2CAAKC,MAAM,sCACTH,EAAA,QAAAE,IAAA,2CAAMQ,KAAK,c","ignoreList":[]}

package/dist/components/ds-card-setting.js

@@ -1,2 +1,2 @@
-import{p as t,H as s,c as e,h as i,a,t as n}from"./index.js";import{d}from"./p-DQ3l2TXw.js";import{d as c}from"./p-BVNJnFI9.js";import{d as o}from"./p-CNgNgezy.js";import{d as r}from"./p-CQmul5NK.js";import{d as l}from"./p-9Qu1ls2y.js";import{d as f}from"./p-sBx2MuF2.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=t(class t extends s{constructor(t){super();if(t!==false){this.__registerHost()}this.dsEditingChange=e(this,"dsEditingChange");this.cardWidth="md";this.editing=false;this.enterEdit=()=>{this.dsEditingChange.emit(true)};this.exitEdit=()=>{this.dsEditingChange.emit(false)}}render(){const t=this.editing;return i(a,{key:"985e62500e2c6be9d9022bb22633ce47ad363679",class:"card-setting"},i("ds-card",{key:"9f9c830946cf152b678a4f99fd72bdff7171938c",heading:this.heading,cardWidth:this.cardWidth,appearance:t?"editing":"default"},!t?i("ds-button-unfilled",{slot:"actions",variant:"icon",type:"button",icon:"Pencil","aria-label":"Edit",onDsClick:this.enterEdit}):i("div",{slot:"actions",class:"card-setting__actions"},i("ds-button-unfilled",{variant:"icon",type:"button",icon:"Cross",backgroundContrast:"bold","aria-label":"Cancel",onDsClick:this.exitEdit}),i("ds-button-filled",{variant:"icon",type:"button",icon:"Check",intent:"brand",contrast:"faint","aria-label":"Save",onDsClick:this.exitEdit})),i("slot",{key:"f252ac0dc8695add61b70f755d703b86e53f368b"})))}static get style(){return m()}},[262,"ds-card-setting",{heading:[1],cardWidth:[1,"card-width"],editing:[4]}]);function b(){if(typeof customElements==="undefined"){return}const t=["ds-card-setting","ds-badge","ds-button-filled","ds-button-unfilled","ds-card","ds-icon","ds-text"];t.forEach((t=>{switch(t){case"ds-card-setting":if(!customElements.get(n(t))){customElements.define(n(t),u)}break;case"ds-badge":if(!customElements.get(n(t))){d()}break;case"ds-button-filled":if(!customElements.get(n(t))){c()}break;case"ds-button-unfilled":if(!customElements.get(n(t))){o()}break;case"ds-card":if(!customElements.get(n(t))){r()}break;case"ds-icon":if(!customElements.get(n(t))){l()}break;case"ds-text":if(!customElements.get(n(t))){f()}break}}))}b();const p=u;const h=b;export{p as DsCardSetting,h as defineCustomElement};
+import{p as t,H as s,c as e,h as a,a as i,t as n}from"./index.js";import{d}from"./p-DEgY_Lnb.js";import{d as c}from"./p-DOEMwKBb.js";import{d as o}from"./p-DHjjwgku.js";import{d as l}from"./p-DMD-RO1W.js";import{d as r}from"./p-9Qu1ls2y.js";import{d as f}from"./p-BOQRM49Q.js";const b=()=>`.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 m=t(class t extends s{constructor(t){super();if(t!==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 t=this.editing;return a(i,{key:"62659b4788c87d22fb6a2886dc9246141a629fef",class:"card-setting"},a("ds-card",{key:"f7b58e31c8495648fd7fde9b53a0311b013e6aef",heading:this.heading,cardWidth:this.cardWidth,appearance:t?"editing":"default"},!t?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",backgroundContrast:"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:"ef8fd2dcb066d2a5a08b87a1fc182f3d98743cce"})))}static get style(){return b()}},[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 u(){if(typeof customElements==="undefined"){return}const t=["ds-card-setting","ds-badge","ds-button-filled","ds-button-unfilled","ds-card","ds-icon","ds-text"];t.forEach((t=>{switch(t){case"ds-card-setting":if(!customElements.get(n(t))){customElements.define(n(t),m)}break;case"ds-badge":if(!customElements.get(n(t))){d()}break;case"ds-button-filled":if(!customElements.get(n(t))){c()}break;case"ds-button-unfilled":if(!customElements.get(n(t))){o()}break;case"ds-card":if(!customElements.get(n(t))){l()}break;case"ds-icon":if(!customElements.get(n(t))){r()}break;case"ds-text":if(!customElements.get(n(t))){f()}break}}))}u();const h=m;const p=u;export{h as DsCardSetting,p as defineCustomElement};
 //# sourceMappingURL=ds-card-setting.js.map

package/dist/components/ds-card-setting.js.map

@@ -1 +1 @@
-{"version":3,"names":["cardSettingCss","CardSetting","__stencil_proxyCustomElement","HTMLElement","constructor","registerHost","this","cardWidth","editing","enterEdit","dsEditingChange","emit","exitEdit","render","h","Host","key","class","heading","appearance","slot","variant","type","icon","onDsClick","backgroundContrast","intent","contrast"],"sources":["src/wc/components/CardSetting/CardSetting.css?tag=ds-card-setting&encapsulation=scoped","src/wc/components/CardSetting/CardSetting.tsx"],"sourcesContent":[":host {\n  display: contents;\n}\n\n.card-setting__actions {\n  display: flex;\n  flex-shrink: 0;\n  align-items: center;\n  gap: var(--dimension-space-100);\n}\n","import { Component, Event, EventEmitter, h, Host, Prop } from '@stencil/core';\nimport type { CardWidth } from '../Card/Card';\n\nexport type CardSettingWidth = CardWidth;\n\n@Component({\n  tag: 'ds-card-setting',\n  styleUrl: 'CardSetting.css',\n  scoped: true,\n})\nexport class CardSetting {\n  /** Section heading shown in the card header. */\n  @Prop() heading!: string;\n\n  /**\n   * Card width token (`sm` / `md` / `lg`). Also sets host `min-height` to the\n   * matching `--dimension-card-height-*` so the body fills available space\n   * even when the slot is empty.\n   */\n  @Prop() cardWidth: CardSettingWidth = 'md';\n\n  /** Controlled edit state — parent owns single-edit orchestration. */\n  @Prop() editing = false;\n\n  /** Emits when the user enters or exits edit mode. */\n  @Event() dsEditingChange!: EventEmitter<boolean>;\n\n  private enterEdit = () => {\n    this.dsEditingChange.emit(true);\n  };\n\n  private exitEdit = () => {\n    this.dsEditingChange.emit(false);\n  };\n\n  render() {\n    const editing = this.editing;\n\n    return (\n      <Host class=\"card-setting\">\n        <ds-card\n          heading={this.heading}\n          cardWidth={this.cardWidth}\n          appearance={editing ? 'editing' : 'default'}\n        >\n          {!editing ? (\n            <ds-button-unfilled\n              slot=\"actions\"\n              variant=\"icon\"\n              type=\"button\"\n              icon=\"Pencil\"\n              aria-label=\"Edit\"\n              onDsClick={this.enterEdit}\n            />\n          ) : (\n            <div slot=\"actions\" class=\"card-setting__actions\">\n              <ds-button-unfilled\n                variant=\"icon\"\n                type=\"button\"\n                icon=\"Cross\"\n                backgroundContrast=\"bold\"\n                aria-label=\"Cancel\"\n                onDsClick={this.exitEdit}\n              />\n              <ds-button-filled\n                variant=\"icon\"\n                type=\"button\"\n                icon=\"Check\"\n                intent=\"brand\"\n                contrast=\"faint\"\n                aria-label=\"Save\"\n                onDsClick={this.exitEdit}\n              />\n            </div>\n          )}\n          <slot />\n        </ds-card>\n      </Host>\n    );\n  }\n}\n"],"mappings":"gRAAA,MAAMA,EAAiB,IAAM,iK,MCUhBC,EAAWC,EAAA,MAAAD,UAAAE,EALxB,WAAAC,CAAAC,G,2FAcUC,KAAAC,UAA8B,KAG9BD,KAAAE,QAAU,MAKVF,KAAAG,UAAY,KAClBH,KAAKI,gBAAgBC,KAAK,KAAK,EAGzBL,KAAAM,SAAW,KACjBN,KAAKI,gBAAgBC,KAAK,MAAM,CAgDnC,CA7CC,MAAAE,GACE,MAAML,EAAUF,KAAKE,QAErB,OACEM,EAACC,EAAI,CAAAC,IAAA,2CAACC,MAAM,gBACVH,EAAA,WAAAE,IAAA,2CACEE,QAASZ,KAAKY,QACdX,UAAWD,KAAKC,UAChBY,WAAYX,EAAU,UAAY,YAEhCA,EACAM,EAAA,sBACEM,KAAK,UACLC,QAAQ,OACRC,KAAK,SACLC,KAAK,SAAQ,aACF,OACXC,UAAWlB,KAAKG,YAGlBK,EAAA,OAAKM,KAAK,UAAUH,MAAM,yBACxBH,EAAA,sBACEO,QAAQ,OACRC,KAAK,SACLC,KAAK,QACLE,mBAAmB,OAAM,aACd,SACXD,UAAWlB,KAAKM,WAElBE,EAAA,oBACEO,QAAQ,OACRC,KAAK,SACLC,KAAK,QACLG,OAAO,QACPC,SAAS,QAAO,aACL,OACXH,UAAWlB,KAAKM,YAItBE,EAAA,QAAAE,IAAA,8C","ignoreList":[]}
+{"version":3,"names":["cardSettingCss","CardSetting","__stencil_proxyCustomElement","HTMLElement","constructor","registerHost","this","cardWidth","editing","editLabel","cancelLabel","saveLabel","enterEdit","dsEditingChange","emit","exitEdit","render","h","Host","key","class","heading","appearance","slot","variant","type","icon","onDsClick","backgroundContrast","intent","contrast"],"sources":["src/wc/components/CardSetting/CardSetting.css?tag=ds-card-setting&encapsulation=scoped","src/wc/components/CardSetting/CardSetting.tsx"],"sourcesContent":[":host {\n  display: contents;\n}\n\n.card-setting__actions {\n  display: flex;\n  flex-shrink: 0;\n  align-items: center;\n  gap: var(--dimension-space-100);\n}\n","import { Component, Event, EventEmitter, h, Host, Prop } from '@stencil/core';\nimport type { CardWidth } from '../Card/Card';\n\nexport type CardSettingWidth = CardWidth;\n\n@Component({\n  tag: 'ds-card-setting',\n  styleUrl: 'CardSetting.css',\n  scoped: true,\n})\nexport class CardSetting {\n  /** Section heading shown in the card header. */\n  @Prop() heading!: string;\n\n  /**\n   * Card width token (`sm` / `md` / `lg`). Also sets host `min-height` to the\n   * matching `--dimension-card-height-*` so the body fills available space\n   * even when the slot is empty.\n   */\n  @Prop() cardWidth: CardSettingWidth = 'md';\n\n  /** Controlled edit state — parent owns single-edit orchestration. */\n  @Prop() editing = false;\n  @Prop() editLabel: string = 'Edit';\n  @Prop() cancelLabel: string = 'Cancel';\n  @Prop() saveLabel: string = 'Save';\n\n  /** Emits when the user enters or exits edit mode. */\n  @Event() dsEditingChange!: EventEmitter<boolean>;\n\n  private enterEdit = () => {\n    this.dsEditingChange.emit(true);\n  };\n\n  private exitEdit = () => {\n    this.dsEditingChange.emit(false);\n  };\n\n  render() {\n    const editing = this.editing;\n\n    return (\n      <Host class=\"card-setting\">\n        <ds-card\n          heading={this.heading}\n          cardWidth={this.cardWidth}\n          appearance={editing ? 'editing' : 'default'}\n        >\n          {!editing ? (\n            <ds-button-unfilled\n              slot=\"actions\"\n              variant=\"icon\"\n              type=\"button\"\n              icon=\"Pencil\"\n              aria-label={this.editLabel}\n              onDsClick={this.enterEdit}\n            />\n          ) : (\n            <div slot=\"actions\" class=\"card-setting__actions\">\n              <ds-button-unfilled\n                variant=\"icon\"\n                type=\"button\"\n                icon=\"Cross\"\n                backgroundContrast=\"bold\"\n                aria-label={this.cancelLabel}\n                onDsClick={this.exitEdit}\n              />\n              <ds-button-filled\n                variant=\"icon\"\n                type=\"button\"\n                icon=\"Check\"\n                intent=\"brand\"\n                contrast=\"faint\"\n                aria-label={this.saveLabel}\n                onDsClick={this.exitEdit}\n              />\n            </div>\n          )}\n          <slot />\n        </ds-card>\n      </Host>\n    );\n  }\n}\n"],"mappings":"qRAAA,MAAMA,EAAiB,IAAM,iK,MCUhBC,EAAWC,EAAA,MAAAD,UAAAE,EALxB,WAAAC,CAAAC,G,2FAcUC,KAAAC,UAA8B,KAG9BD,KAAAE,QAAU,MACVF,KAAAG,UAAoB,OACpBH,KAAAI,YAAsB,SACtBJ,KAAAK,UAAoB,OAKpBL,KAAAM,UAAY,KAClBN,KAAKO,gBAAgBC,KAAK,KAAK,EAGzBR,KAAAS,SAAW,KACjBT,KAAKO,gBAAgBC,KAAK,MAAM,CAgDnC,CA7CC,MAAAE,GACE,MAAMR,EAAUF,KAAKE,QAErB,OACES,EAACC,EAAI,CAAAC,IAAA,2CAACC,MAAM,gBACVH,EAAA,WAAAE,IAAA,2CACEE,QAASf,KAAKe,QACdd,UAAWD,KAAKC,UAChBe,WAAYd,EAAU,UAAY,YAEhCA,EACAS,EAAA,sBACEM,KAAK,UACLC,QAAQ,OACRC,KAAK,SACLC,KAAK,SAAQ,aACDpB,KAAKG,UACjBkB,UAAWrB,KAAKM,YAGlBK,EAAA,OAAKM,KAAK,UAAUH,MAAM,yBACxBH,EAAA,sBACEO,QAAQ,OACRC,KAAK,SACLC,KAAK,QACLE,mBAAmB,OAAM,aACbtB,KAAKI,YACjBiB,UAAWrB,KAAKS,WAElBE,EAAA,oBACEO,QAAQ,OACRC,KAAK,SACLC,KAAK,QACLG,OAAO,QACPC,SAAS,QAAO,aACJxB,KAAKK,UACjBgB,UAAWrB,KAAKS,YAItBE,EAAA,QAAAE,IAAA,8C","ignoreList":[]}

package/dist/components/ds-card.js

@@ -1,2 +1,2 @@
-import{C as o,d as s}from"./p-CQmul5NK.js";const t=o;const m=s;export{t as DsCard,m as defineCustomElement};
+import{C as o,d as s}from"./p-DMD-RO1W.js";const t=o;const p=s;export{t as DsCard,p as defineCustomElement};
 //# sourceMappingURL=ds-card.js.map

package/dist/components/ds-chart-donut.js

@@ -1,2 +1,2 @@
-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{a}from"./p-8WTsyLQ9.js";import{r as c}from"./p-BWUTr_XN.js";import{w as h,c as u,a as l}from"./p-CrCGIx8s.js";import{f}from"./p-DEpLlQZK.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 w=Math.PI;const _=w/2;const z=2*w;function k(t){return t>1?0:t<-1?w:Math.acos(t)}function $(t){return t>=1?_:t<=-1?-_:Math.asin(t)}function C(t){return t.innerRadius}function A(t){return t.outerRadius}function S(t){return t.startAngle}function j(t){return t.endAngle}function L(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 E(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,w=b*b+M*M,_=s-r,z=f*y-p*d,k=(M<0?-1:1)*x(v(0,_*_*w-z*z)),$=(z*M-b*k)/w,C=(-z*b-M*k)/w,A=(z*M+b*k)/w,S=(-z*b+M*k)/w,j=$-g,L=C-m,R=A-g,E=S-m;if(j*j+L*L>R*R+E*E)$=A,C=S;return{cx:$,cy:C,x01:-u,y01:-l,x11:$*(s/_-1),y11:C*(s/_-1)}}function N(){var t=C,n=A,e=u(0),i=null,s=S,r=j,o=L,a=null,c=h(l);function l(){var h,u,l=+t.apply(this,arguments),f=+n.apply(this,arguments),d=s.apply(this,arguments)-_,v=r.apply(this,arguments)-_,C=p(v-d),A=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(C>z-M){a.moveTo(f*g(d),f*b(d));a.arc(0,0,f,d,v,!A);if(l>M){a.moveTo(l*g(v),l*b(v));a.arc(0,0,l,v,d,A)}}else{var S=d,j=v,L=d,N=v,P=C,F=C,O=o.apply(this,arguments)/2,T=O>M&&(i?+i.apply(this,arguments):x(l*l+f*f)),B=m(p(f-l)/2,+e.apply(this,arguments)),D=B,H=B,Q,V;if(T>M){var W=$(T/l*b(O)),G=$(T/f*b(O));if((P-=W*2)>M)W*=A?1:-1,L+=W,N-=W;else P=0,L=N=(d+v)/2;if((F-=G*2)>M)G*=A?1:-1,S+=G,j-=G;else F=0,S=j=(d+v)/2}var I=f*g(S),K=f*b(S),U=l*g(N),X=l*b(N);if(B>M){var Z=f*g(j),q=f*b(j),J=l*g(L),Y=l*b(L),tt;if(C<w){if(tt=R(I,K,J,Y,Z,q,U,X)){var nt=I-tt[0],et=K-tt[1],it=Z-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]);D=m(B,(l-ot)/(rt-1));H=m(B,(f-ot)/(rt+1))}else{D=H=0}}}if(!(F>M))a.moveTo(I,K);else if(H>M){Q=E(J,Y,I,K,f,H,A);V=E(Z,q,U,X,f,H,A);a.moveTo(Q.cx+Q.x01,Q.cy+Q.y01);if(H<B)a.arc(Q.cx,Q.cy,H,y(Q.y01,Q.x01),y(V.y01,V.x01),!A);else{a.arc(Q.cx,Q.cy,H,y(Q.y01,Q.x01),y(Q.y11,Q.x11),!A);a.arc(0,0,f,y(Q.cy+Q.y11,Q.cx+Q.x11),y(V.cy+V.y11,V.cx+V.x11),!A);a.arc(V.cx,V.cy,H,y(V.y11,V.x11),y(V.y01,V.x01),!A)}}else a.moveTo(I,K),a.arc(0,0,f,S,j,!A);if(!(l>M)||!(P>M))a.lineTo(U,X);else if(D>M){Q=E(U,X,Z,q,l,-D,A);V=E(I,K,J,Y,l,-D,A);a.lineTo(Q.cx+Q.x01,Q.cy+Q.y01);if(D<B)a.arc(Q.cx,Q.cy,D,y(Q.y01,Q.x01),y(V.y01,V.x01),!A);else{a.arc(Q.cx,Q.cy,D,y(Q.y01,Q.x01),y(Q.y11,Q.x11),!A);a.arc(0,0,l,y(Q.cy+Q.y11,Q.cx+Q.x11),y(V.cy+V.y11,V.cx+V.x11),A);a.arc(V.cx,V.cy,D,y(V.y11,V.x11),y(V.y01,V.x01),!A)}}else a.arc(0,0,l,N,L,A)}a.closePath();if(h)return a=null,h+""||null}l.centroid=function(){var e=(+t.apply(this,arguments)+ +n.apply(this,arguments))/2,i=(+s.apply(this,arguments)+ +r.apply(this,arguments))/2-w/2;return[g(i)*e,b(i)*e]};l.innerRadius=function(n){return arguments.length?(t=typeof n==="function"?n:u(+n),l):t};l.outerRadius=function(t){return arguments.length?(n=typeof t==="function"?t:u(+t),l):n};l.cornerRadius=function(t){return arguments.length?(e=typeof t==="function"?t:u(+t),l):e};l.padRadius=function(t){return arguments.length?(i=t==null?null:typeof t==="function"?t:u(+t),l):i};l.startAngle=function(t){return arguments.length?(s=typeof t==="function"?t:u(+t),l):s};l.endAngle=function(t){return arguments.length?(r=typeof t==="function"?t:u(+t),l):r};l.padAngle=function(t){return arguments.length?(o=typeof t==="function"?t:u(+t),l):o};l.context=function(t){return arguments.length?(a=t==null?null:t,l):a};return l}function P(t,n){return n<t?-1:n>t?1:n>=t?0:NaN}function F(t){return t}function O(){var t=F,n=P,e=null,i=u(0),s=u(z),r=u(0);function o(o){var a,c=(o=l(o)).length,h,u,f=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){f+=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=f?(g-c*b)/f: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:u(+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:u(+t),o):i};o.endAngle=function(t){return arguments.length?(s=typeof t==="function"?t:u(+t),o):s};o.padAngle=function(t){return arguments.length?(r=typeof t==="function"?t:u(+t),o):r};return o}const T=()=>`.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)}.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 B=.25;const D=0;const H=.82;const Q=128;const V=t(class t extends n{constructor(t){super();if(t!==false){this.__registerHost()}this.dsSliceHover=e(this,"dsSliceHover");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=Q;this.resizeObserver=null}get isFillMode(){return this.size==null||!Number.isFinite(this.size)||this.size<=0}get fillMinPx(){return c(a.donutFillMin,Q)}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*H;const r=this.data.reduce(((t,n)=>t+n.value),0);const o=this.centerValue??f(r);if(this.valueTextEl){const t=d(this.valueTextEl,o,s);if(t!==this.displayedValueText)this.displayedValueText=t;else this.valueTextEl.textContent=t}const h=this.centerCaption??"";if(this.captionTextEl&&h){const t=d(this.captionTextEl,h,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 h=n-e;const u=this.data.reduce(((t,n)=>t+n.value),0);const l=u<=0;const d=this.activeLabel??this.hoveredLabel;const p=N().innerRadius(h).outerRadius(n).cornerRadius(r).padAngle(this.gap*Math.PI/180);const y=l?[]:O().value((t=>t.value)).sort(null)(this.data);const g=l?N().innerRadius(h).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-(D+m)/2:n;const x=n+(v+D)/2;const M=this.centerValue??f(u);const w=this.centerCaption??"";const _=this.isFillMode;return i(s,{key:"3f9e2dd1fe922e959ffd0075b039bf8de05ae92d",class:{"chart-donut":true,"chart-donut--fill":_,"chart-donut--fixed":!_},style:!_?{width:`${t}px`,height:`${t}px`}:undefined},i("div",{key:"da468c2034561d5de2f0d84320df999232c49d03",class:"chart-donut__wrapper",style:!_?{width:`${t}px`,height:`${t}px`}:undefined},i("svg",{key:"be4cfec31c164ff8436238270c0488a324058a57",class:"chart-donut__svg",viewBox:`0 0 ${t} ${t}`,width:t,height:t},i("g",{key:"79a867836cb830972474186222d8a4cf7479b12f",transform:`translate(${n}, ${n})`},l?i("path",{d:g??undefined,fill:"var(--color-background-faint-neutral)","aria-label":"No data"}):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?B: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:"6f7a8fa3c065bdd8236f59ba28ed48ce4f038d2e",class:"chart-donut__center-value",x:n,y:b,"text-anchor":"middle","dominant-baseline":"central",ref:t=>{this.valueTextEl=t??undefined}},this.displayedValueText||M),w&&i("text",{key:"8019803d2e859f5f0e50bf2cc1a8e90bd5ba7c35",class:"chart-donut__center-caption",x:n,y:x,"text-anchor":"middle","dominant-baseline":"central",ref:t=>{this.captionTextEl=t??undefined}},this.displayedCaptionText||w))))}get el(){return this}static get watchers(){return{size:[{onSizePropChange:0}]}}static get style(){return T()}},[2,"ds-chart-donut",{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 W(){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),V)}break}}))}W();const G=V;const I=W;export{G as DsChartDonut,I as defineCustomElement};
+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{a}from"./p-8WTsyLQ9.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 w=Math.PI;const _=w/2;const z=2*w;function k(t){return t>1?0:t<-1?w:Math.acos(t)}function $(t){return t>=1?_:t<=-1?-_: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 L(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 B(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,w=b*b+M*M,_=s-r,z=f*y-p*d,k=(M<0?-1:1)*x(v(0,_*_*w-z*z)),$=(z*M-b*k)/w,A=(-z*b-M*k)/w,C=(z*M+b*k)/w,S=(-z*b+M*k)/w,j=$-g,L=A-m,R=C-g,B=S-m;if(j*j+L*L>R*R+B*B)$=C,A=S;return{cx:$,cy:A,x01:-u,y01:-l,x11:$*(s/_-1),y11:A*(s/_-1)}}function N(){var t=A,n=C,e=l(0),i=null,s=S,r=j,o=L,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)-_,v=r.apply(this,arguments)-_,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,L=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,W;if(H>M){var G=$(H/l*b(F)),I=$(H/f*b(F));if((P-=G*2)>M)G*=C?1:-1,L+=G,N-=G;else P=0,L=N=(d+v)/2;if((E-=I*2)>M)I*=C?1:-1,S+=I,j-=I;else E=0,S=j=(d+v)/2}var Q=f*g(S),U=f*b(S),X=l*g(N),q=l*b(N);if(O>M){var J=f*g(j),K=f*b(j),Y=l*g(L),Z=l*b(L),tt;if(A<w){if(tt=R(Q,U,Y,Z,J,K,X,q)){var nt=Q-tt[0],et=U-tt[1],it=J-tt[0],st=K-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(Q,U);else if(D>M){V=B(Y,Z,Q,U,f,D,C);W=B(J,K,X,q,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(W.y01,W.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(W.cy+W.y11,W.cx+W.x11),!C);a.arc(W.cx,W.cy,D,y(W.y11,W.x11),y(W.y01,W.x01),!C)}}else a.moveTo(Q,U),a.arc(0,0,f,S,j,!C);if(!(l>M)||!(P>M))a.lineTo(X,q);else if(T>M){V=B(X,q,J,K,l,-T,C);W=B(Q,U,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(W.y01,W.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(W.cy+W.y11,W.cx+W.x11),C);a.arc(W.cx,W.cy,T,y(W.y11,W.x11),y(W.y01,W.x01),!C)}}else a.arc(0,0,l,N,L,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-w/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)}.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 W=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 w=this.centerCaption??"";const _=this.isFillMode;return i(s,{key:"cfd26d1ae86a66fe0504c25cf4d8b6d4cbe957fc",class:{"chart-donut":true,"chart-donut--fill":_,"chart-donut--fixed":!_},style:!_?{width:`${t}px`,height:`${t}px`}:undefined},i("div",{key:"954c2f9b6d5f3771946c00953348f8c0186f0aa7",class:"chart-donut__wrapper",style:!_?{width:`${t}px`,height:`${t}px`}:undefined},i("svg",{key:"8bbb079e3e0fd1dbc4481227d92a8cb6f831d184",class:"chart-donut__svg",viewBox:`0 0 ${t} ${t}`,width:t,height:t},i("g",{key:"2aba6e4785e0f7688aae6ef02fcf2c7e3aade0b3",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:"62223e32aed3d15d39947b9c4ccfd67b1a31017c",class:"chart-donut__center-value",x:n,y:b,"text-anchor":"middle","dominant-baseline":"central",ref:t=>{this.valueTextEl=t??undefined}},this.displayedValueText||M),w&&i("text",{key:"40e75cb4015ceea91b5b5b5b155462ec1777a4d0",class:"chart-donut__center-caption",x:n,y:x,"text-anchor":"middle","dominant-baseline":"central",ref:t=>{this.captionTextEl=t??undefined}},this.displayedCaptionText||w))))}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 G(){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),W)}break}}))}G();const I=W;const Q=G;export{I as DsChartDonut,Q as defineCustomElement};
 //# sourceMappingURL=ds-chart-donut.js.map