@ds-mo/ui 15.11.1 → 15.11.2

package/dist/components/ds-toast.js

@@ -1,2 +1,2 @@
-import{p as t,H as s,c as i,h as e,a as o,t as n}from"./index.js";import{c as a,r,d as h}from"./p-B5rN3slq.js";import{d as c}from"./p-CzTJAO2J.js";import{d}from"./p-CaNMVLhm.js";import{d as l}from"./p-BVsVUnAw.js";import{d as f}from"./p-0XTyQNRG.js";import{d as u}from"./p-CTAF7SkL.js";import{T as m,r as p,b as v}from"./p-CeXf9-X3.js";import{r as g}from"./p-CVYjLzYI.js";function w(t,s){const i=typeof t==="function"?t(s):t;return typeof i==="string"?{description:i}:i}class b{constructor(){this.records=[];this.listeners=new Set;this.nextId=0}add(t){const s=t.id||`ds-toast-${++this.nextId}`;const i=this.records.findIndex((t=>t.id===s));if(!t.title?.trim()&&!t.description?.trim()){console.warn(`[ds-toast] Toast "${s}" should provide a title or description.`)}if(i>=0){const e=this.records[i];const o={...e,...t,id:s,priority:t.priority??e.priority,transitionStatus:"active",closeReason:undefined,updateKey:e.updateKey+1,timerKey:e.timerKey+1};this.records=[o,...this.records.filter(((t,s)=>s!==i))];this.emit();return s}const e={...t,id:s,priority:t.priority??"low",transitionStatus:"starting",updateKey:0,timerKey:0};this.records=[e,...this.records];this.emit();return s}update(t,s){const i=this.records.findIndex((s=>s.id===t));if(i<0)return;const e=this.records[i];const o=Object.prototype.hasOwnProperty.call(s,"timeout")||e.type==="loading"&&s.type!==undefined&&s.type!=="loading";const n={...e,...s,id:t,priority:s.priority??e.priority,updateKey:e.updateKey+1,timerKey:o?e.timerKey+1:e.timerKey};this.records=this.records.map(((t,s)=>s===i?n:t));this.emit()}close(t,s="programmatic"){const i=this.records.findIndex((s=>s.id===t));if(i<0||this.records[i].transitionStatus==="ending")return;const e={...this.records[i],transitionStatus:"ending",closeReason:s};this.records=this.records.map(((t,s)=>s===i?e:t));this.emit();e.onClose?.({id:t,reason:s,toast:e})}closeAll(t="programmatic"){for(const s of[...this.records])this.close(s.id,t)}async promise(t,s){const i=w(s.loading,undefined);const e=this.add({...i,type:i.type??"loading",timeout:0});try{const i=await t;const o=w(s.success,i);this.update(e,{...o,type:o.type??"success",timeout:o.timeout});return i}catch(t){const i=w(s.error,t);this.update(e,{...i,type:i.type??"error",timeout:i.timeout});throw t}}subscribe(t){this.listeners.add(t);t(this.getSnapshot());return()=>{this.listeners.delete(t)}}getSnapshot(){return this.records.map((t=>({...t})))}activate(t){const s=this.records.find((s=>s.id===t));if(!s||s.transitionStatus!=="starting")return;this.records=this.records.map((s=>s.id===t?{...s,transitionStatus:"active"}:s));this.emit()}remove(t){const s=this.records.find((s=>s.id===t));if(!s||s.transitionStatus!=="ending")return null;const i=s.closeReason??"programmatic";this.records=this.records.filter((s=>s.id!==t));this.emit();const e={id:t,reason:i,toast:s};return e}notifyRemove(t){const{toast:s}=t;s.onRemove?.(t)}emit(){const t=this.getSnapshot();for(const s of this.listeners)s(t)}}function y(){return new b}const x=Symbol.for("@ds-mo/ui/default-toast-manager");const T=globalThis;const M=T[x];const k=M??y();if(!M)T[x]=k;const A=()=>`.ds-visually-hidden.sc-ds-toast-h,.ds-visually-hidden.sc-ds-toast{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0, 0, 0, 0);white-space:nowrap;border:0}@media (forced-colors: active){.sc-ds-toast:root,.sc-ds-toast-h,.ds-forced-colors-scope.sc-ds-toast{--ds-forced-color-surface:Canvas;--ds-forced-color-content:CanvasText;--ds-forced-color-control-boundary:ButtonText;--ds-forced-color-selected:Highlight;--ds-forced-color-on-selected:HighlightText;--ds-forced-color-disabled:GrayText}}.sc-ds-toast-h,.sc-ds-toast:where(.ds-table),.sc-ds-toast:where(.tooltip-popup),.sc-ds-toast:where(.ds-radius){--ds-radius-control:var(--dimension-radius-025);--ds-radius-card:var(--dimension-radius-050);--ds-radius-modal:var(--dimension-radius-050);--ds-radius-menu:var(--dimension-radius-075);--ds-radius-tooltip-control:var(--dimension-radius-025);--ds-radius-tooltip-menu:var(--dimension-radius-075);--ds-radius-table:var(--dimension-radius-050)}.sc-ds-toast-h{display:contents}.toast-region.sc-ds-toast{position:fixed;inset:0;z-index:var(--dimension-z-index-floating);pointer-events:none;outline:none}.toast-viewport.sc-ds-toast{position:absolute;right:var(--dimension-space-200);bottom:var(--dimension-space-200);display:grid;width:min(var(--dimension-card-width-sm), calc(100vw - 2 * var(--dimension-space-200)))}@media (width < 768px){[avoid-mobile-shell-bar].sc-ds-toast-h .toast-viewport.sc-ds-toast{bottom:calc(       var(--dimension-space-200) + var(--dimension-space-100) + var(--dimension-size-400) +         max(var(--dimension-space-100), env(safe-area-inset-bottom))     )}}.toast-positioner.sc-ds-toast{grid-area:1 / 1;align-self:end;justify-self:center;width:100%;pointer-events:auto;transform:translateY(calc(-1 * var(--toast-index) * var(--dimension-space-100)));transition:transform var(--effect-motion-short-3),     width var(--effect-motion-short-3)}.toast-viewport.sc-ds-toast:not([data-expanded]) .toast-positioner.sc-ds-toast{width:calc(100% - 2 * var(--toast-index) * var(--dimension-space-100))}.toast-viewport[data-expanded].sc-ds-toast .toast-positioner.sc-ds-toast{transform:translateY(calc(-1 * var(--toast-offset-y)))}.toast-positioner[data-limited].sc-ds-toast{visibility:hidden;pointer-events:none}.toast-positioner--anchored.sc-ds-toast{position:fixed;width:min(var(--dimension-card-width-sm), calc(100vw - 2 * var(--dimension-space-200)));transform:none}.toast-positioner--anchored[data-positioned='false'].sc-ds-toast{visibility:hidden}.toast-surface.sc-ds-toast{position:relative;display:block;box-sizing:border-box;width:100%;height:var(--toast-height, auto);padding:var(--dimension-space-200);overflow:hidden;color:var(--color-foreground-primary);background-color:var(--color-background-primary);border-radius:var(--ds-radius-modal);box-shadow:var(--effect-elevation-elevated-floating);transform:translate(var(--toast-swipe-movement-x), var(--toast-swipe-movement-y));animation:toast-enter var(--effect-motion-short-2) both}.toast-positioner--ending.sc-ds-toast .toast-surface.sc-ds-toast{animation:toast-exit var(--effect-motion-short-3) both}.toast-surface--swiping.sc-ds-toast{transition:none;user-select:none}.toast-content.sc-ds-toast{display:flex;flex-direction:column;min-width:0;padding-inline-end:var(--dimension-size-500);transition:opacity var(--effect-motion-short-3)}.toast-copy.sc-ds-toast{display:flex;flex-direction:column;min-width:0;min-height:var(--typography-lineheight-md);margin-block:calc(-1 * var(--dimension-space-025));gap:var(--dimension-space-050)}.toast-title.sc-ds-toast,.toast-description.sc-ds-toast{min-width:0}.toast-action.sc-ds-toast{align-self:start;margin-top:calc(var(--dimension-space-200) + var(--dimension-space-025))}.toast-close.sc-ds-toast{position:absolute;top:var(--dimension-space-100);right:var(--dimension-space-100);transition:opacity var(--effect-motion-short-3)}.toast-viewport.sc-ds-toast:not([data-expanded]) .toast-positioner[data-behind].sc-ds-toast .toast-content.sc-ds-toast,.toast-viewport.sc-ds-toast:not([data-expanded]) .toast-positioner[data-behind].sc-ds-toast .toast-close.sc-ds-toast{opacity:0}@keyframes toast-enter{from{opacity:0;transform:translateY(var(--dimension-space-100))}to{opacity:1;transform:translateY(0)}}@keyframes toast-exit{from{opacity:1}to{opacity:0}}@media (prefers-reduced-motion: reduce){.toast-positioner.sc-ds-toast,.toast-surface.sc-ds-toast,.toast-content.sc-ds-toast,.toast-close.sc-ds-toast,.toast-positioner--ending.sc-ds-toast .toast-surface.sc-ds-toast{transition:none;animation:none}.toast-positioner--ending.sc-ds-toast .toast-surface.sc-ds-toast{opacity:0}}@media (forced-colors: active){.toast-surface.sc-ds-toast{box-shadow:none;outline:var(--dimension-stroke-width-012) solid var(--ds-forced-color-content);outline-offset:calc(-1 * var(--dimension-stroke-width-012))}}`;const C=40;const S=10;const P="__global-stack__";const E='button,a,input,textarea,select,[role="button"],[data-ds-toast-swipe-ignore]';const F=new WeakMap;const z=new Set;let R=null;let j=0;const D=t(class t extends s{constructor(t){super();if(t!==false){this.__registerHost()}this.dsToastClose=i(this,"dsToastClose",7);this.dsToastRemove=i(this,"dsToastRemove",7);this.dsToastAction=i(this,"dsToastAction",7);this.manager=k;this.limit=3;this.timeout=m.animationDelayLong2;this.label="Notifications";this.closeLabel="Close notification";this.avoidMobileShellBar=false;this.swipeDirections=["down","right"];this.records=[];this.expanded=false;this.keyboardActive=false;this.swipe=null;this.layoutVersion=0;this.instanceId=++j;this.domIds=new Map;this.timers=new Map;this.closeWatchdogs=new Map;this.closeFrames=new Map;this.closeEvents=new Set;this.activationFrames=new Map;this.pauseReasons=new Set;this.hoveredIds=new Set;this.heights=new Map;this.measuredUpdateKeys=new Map;this.anchoredPositions=new Map;this.dismissedSwipeDirections=new Map;this.observedElements=new Set;this.pendingRemovals=[];this.unsubscribe=null;this.attachedManager=null;this.previousFocus=null;this.resizeObserver=null;this.mutationObserver=null;this.layoutFrame=null;this.activeSwipe=null;this.nextDomId=0;this.connected=false;this.pendingHoverLeave=false;this.handleWindowBlur=()=>this.pauseTimers("window");this.handleWindowFocus=()=>this.resumeTimers("window");this.handleVisibilityChange=()=>{if(document.hidden)this.pauseTimers("document");else this.resumeTimers("document")};this.handleFocusIn=()=>{const t=document.activeElement;if(!(t instanceof s)||!t.matches(":focus-visible"))return;R=this;this.keyboardActive=true;this.expanded=true;this.pauseTimers("focus")};this.handleFocusOut=t=>{const s=t.relatedTarget;if(s instanceof Node&&this.el.contains(s))return;if(!this.keyboardActive)return;this.keyboardActive=false;this.expanded=this.hoveredIds.size>0;this.resumeTimers("focus")};this.handleDocumentKeyDown=t=>{if(t.key!=="F6")return;const s=Array.from(z).filter((t=>t.activeRecords.length>0));const i=R&&R.activeRecords.length?R:s[s.length-1];if(i!==this)return;t.preventDefault();if(!this.el.contains(document.activeElement)){this.previousFocus=document.activeElement}this.keyboardActive=true;this.regionElement?.focus()};this.handleRegionKeyDown=t=>{if(t.key==="Escape"){const s=t.target;const i=s.closest(".toast-positioner");const e=i?.dataset["toastId"]??this.activeRecords[0]?.id;if(e){t.preventDefault();this.manager.close(e,"escape")}return}if(t.key==="Tab"&&t.shiftKey&&t.target===this.regionElement){t.preventDefault();this.restorePreviousFocus()}};this.handleWindowResize=()=>{this.heights.clear();this.measuredUpdateKeys.clear();this.layoutVersion+=1;this.scheduleLayout()};this.scheduleLayout=()=>{if(this.layoutFrame!==null)return;this.layoutFrame=requestAnimationFrame((()=>{this.layoutFrame=null;this.measureLayout()}))}}connectedCallback(){this.connect()}componentDidLoad(){this.connect()}connect(){if(this.connected)return;this.connected=true;this.resizeObserver??(this.resizeObserver=new ResizeObserver((()=>this.scheduleLayout())));this.mutationObserver??(this.mutationObserver=new MutationObserver((()=>this.scheduleLayout())));this.mutationObserver.observe(document.body,{childList:true,subtree:true});if(!this.unsubscribe)this.attachManager(this.manager);window.addEventListener("blur",this.handleWindowBlur);window.addEventListener("focus",this.handleWindowFocus);window.addEventListener("resize",this.handleWindowResize);window.addEventListener("scroll",this.scheduleLayout,true);document.addEventListener("keydown",this.handleDocumentKeyDown);document.addEventListener("visibilitychange",this.handleVisibilityChange);z.add(this);if(!R)R=this}componentDidRender(){this.syncObservedElements();this.flushPendingRemovals();this.scheduleLayout()}disconnectedCallback(){this.connected=false;this.flushPendingRemovals();this.detachManager();this.resetManagerState();this.resizeObserver?.disconnect();this.resizeObserver=null;this.mutationObserver?.disconnect();this.mutationObserver=null;this.observedElements.clear();if(this.layoutFrame!==null)cancelAnimationFrame(this.layoutFrame);this.layoutFrame=null;window.removeEventListener("blur",this.handleWindowBlur);window.removeEventListener("focus",this.handleWindowFocus);window.removeEventListener("resize",this.handleWindowResize);window.removeEventListener("scroll",this.scheduleLayout,true);document.removeEventListener("keydown",this.handleDocumentKeyDown);document.removeEventListener("visibilitychange",this.handleVisibilityChange);z.delete(this);if(R===this){const t=Array.from(z);R=t[t.length-1]??null}}onManagerChange(t){this.detachManager();this.resetManagerState();if(this.connected)this.attachManager(t)}onTimeoutChange(){for(const t of this.timers.values()){if(t.handle)clearTimeout(t.handle)}this.timers.clear();this.syncTimers()}attachManager(t){const s=F.get(t);if(s&&s!==this){console.warn("[ds-toast] A manager can control only one connected ds-toast instance.");return}F.set(t,this);this.attachedManager=t;this.unsubscribe=t.subscribe((t=>{this.records=t;this.syncLifecycle(t);this.scheduleLayout()}))}detachManager(){this.unsubscribe?.();this.unsubscribe=null;if(this.attachedManager&&F.get(this.attachedManager)===this){F.delete(this.attachedManager)}this.attachedManager=null}resetManagerState(){this.flushPendingRemovals();if(this.el.contains(document.activeElement))this.restorePreviousFocus();this.clearAllTimers();for(const t of this.activationFrames.values())cancelAnimationFrame(t);for(const t of this.closeFrames.values())cancelAnimationFrame(t);this.activationFrames.clear();this.closeFrames.clear();this.closeEvents.clear();this.pauseReasons.clear();this.hoveredIds.clear();this.pendingHoverLeave=false;this.heights.clear();this.measuredUpdateKeys.clear();this.anchoredPositions.clear();this.dismissedSwipeDirections.clear();this.domIds.clear();this.activeSwipe=null;this.swipe=null;this.expanded=false;this.keyboardActive=false;this.records=[];this.resizeObserver?.disconnect();this.observedElements.clear()}syncObservedElements(){const t=new Set(this.el.querySelectorAll(".toast-positioner"));for(const s of this.records){if(!s.positioner)continue;const i=this.resolveAnchor(s.positioner.anchor);if(i)t.add(i)}for(const s of this.observedElements){if(!t.has(s)){this.resizeObserver?.unobserve(s);this.observedElements.delete(s)}}for(const s of t){if(this.observedElements.has(s))continue;this.resizeObserver?.observe(s);this.observedElements.add(s)}}flushPendingRemovals(){for(const t of this.pendingRemovals.splice(0)){t.manager.notifyRemove(t.context);this.dsToastRemove.emit({id:t.context.id,toast:t.context.toast})}}syncLifecycle(t){const s=new Set(t.map((t=>t.id)));for(const t of this.hoveredIds){if(t!==P&&!s.has(t))this.hoveredIds.delete(t)}const i=t.some((t=>t.transitionStatus==="ending"));if(this.pendingHoverLeave&&!i&&!this.hoveredIds.size){this.pendingHoverLeave=false;this.expanded=false;this.resumeTimers("hover")}else if(!this.hoveredIds.size&&!this.pendingHoverLeave){this.resumeTimers("hover")}for(const[t,i]of this.timers){if(s.has(t))continue;if(i.handle)clearTimeout(i.handle);this.timers.delete(t)}for(const[t,i]of this.closeWatchdogs){if(s.has(t))continue;clearTimeout(i);this.closeWatchdogs.delete(t)}for(const[t,i]of this.activationFrames){if(s.has(t))continue;cancelAnimationFrame(i);this.activationFrames.delete(t)}for(const[t,i]of this.closeFrames){if(s.has(t))continue;cancelAnimationFrame(i);this.closeFrames.delete(t)}for(const t of this.domIds.keys()){if(s.has(t))continue;this.closeEvents.delete(t);this.domIds.delete(t);this.heights.delete(t);this.measuredUpdateKeys.delete(t);this.anchoredPositions.delete(t);this.dismissedSwipeDirections.delete(t)}for(const s of t){this.ensureDomId(s.id);if(s.transitionStatus==="starting"&&!this.activationFrames.has(s.id)){const t=this.attachedManager;const i=requestAnimationFrame((()=>{this.activationFrames.delete(s.id);t?.activate(s.id)}));this.activationFrames.set(s.id,i)}if(s.transitionStatus==="ending"){this.clearToastTimer(s.id);this.beginRemoval(s)}else{const t=this.closeWatchdogs.get(s.id);if(t)clearTimeout(t);this.closeWatchdogs.delete(s.id);const i=this.closeFrames.get(s.id);if(i)cancelAnimationFrame(i);this.closeFrames.delete(s.id);this.closeEvents.delete(s.id)}}this.syncTimers()}syncTimers(){const t=new Set;for(const s of this.records){if(s.transitionStatus!=="active")continue;t.add(s.id);const i=this.resolveToastTimeout(s);if(i<=0){this.clearToastTimer(s.id);continue}const e=this.timers.get(s.id);if(!e||e.timerKey!==s.timerKey){this.clearToastTimer(s.id);this.timers.set(s.id,{timerKey:s.timerKey,remaining:i,startedAt:0,handle:null})}if(!this.isPaused)this.startToastTimer(s.id)}for(const s of this.timers.keys()){if(!t.has(s))this.clearToastTimer(s)}}resolveToastTimeout(t){const s=t.timeout??this.timeout;if(typeof s==="number")return Math.max(0,s);return p(s,m.animationDelayLong2)}startToastTimer(t){const s=this.timers.get(t);if(!s||s.handle||s.remaining<=0)return;s.startedAt=Date.now();s.handle=setTimeout((()=>{s.handle=null;s.remaining=0;this.manager.close(t,"timeout")}),s.remaining)}pauseTimers(t){const s=this.isPaused;this.pauseReasons.add(t);if(s)return;const i=Date.now();for(const t of this.timers.values()){if(!t.handle)continue;clearTimeout(t.handle);t.handle=null;t.remaining=Math.max(0,t.remaining-(i-t.startedAt))}}resumeTimers(t){this.pauseReasons.delete(t);if(this.isPaused)return;for(const t of this.timers.keys())this.startToastTimer(t)}get isPaused(){return this.pauseReasons.size>0}clearToastTimer(t){const s=this.timers.get(t);if(s?.handle)clearTimeout(s.handle);this.timers.delete(t)}clearAllTimers(){for(const t of this.timers.values()){if(t.handle)clearTimeout(t.handle)}for(const t of this.closeWatchdogs.values())clearTimeout(t);this.timers.clear();this.closeWatchdogs.clear()}beginRemoval(t){if(!this.closeEvents.has(t.id)){this.closeEvents.add(t.id);this.dsToastClose.emit({id:t.id,reason:t.closeReason??"programmatic",toast:t});this.moveFocusAfterClose(t.id)}if(this.closeWatchdogs.has(t.id)||this.closeFrames.has(t.id))return;const s=v(m.motionShort3,m.animationDurationShort3);if(s<=0){queueMicrotask((()=>this.completeRemoval(t)));return}const i=requestAnimationFrame((()=>{this.closeFrames.delete(t.id);const i=this.records.find((s=>s.id===t.id));if(!i||i.transitionStatus!=="ending")return;this.closeWatchdogs.set(t.id,setTimeout((()=>this.completeRemoval(i)),s))}));this.closeFrames.set(t.id,i)}completeRemoval(t){const s=this.records.find((s=>s.id===t.id));if(!s||s.transitionStatus!=="ending")return;const i=this.closeWatchdogs.get(t.id);if(i)clearTimeout(i);this.closeWatchdogs.delete(t.id);const e=this.closeFrames.get(t.id);if(e)cancelAnimationFrame(e);this.closeFrames.delete(t.id);const o=this.attachedManager;const n=o?.remove(t.id);if(o&&n)this.pendingRemovals.push({manager:o,context:n})}handleAnimationComplete(t){if(t.transitionStatus==="ending")this.completeRemoval(t)}bindAnimationCancel(t,s){if(!t||t.dataset["cancelBound"]==="true")return;t.dataset["cancelBound"]="true";t.addEventListener("animationcancel",(()=>{const t=this.records.find((t=>t.id===s));if(t)this.handleAnimationComplete(t)}))}handlePointerEnter(t){R=this;this.pendingHoverLeave=false;this.hoveredIds.add(t);this.expanded=true;this.pauseTimers("hover")}handlePointerLeave(t){this.hoveredIds.delete(t);if(this.hoveredIds.size)return;if(this.records.some((t=>t.transitionStatus==="ending"))){this.pendingHoverLeave=true;return}this.expanded=false;this.resumeTimers("hover")}get regionElement(){return this.el.querySelector(".toast-region")}restorePreviousFocus(){this.previousFocus?.focus?.();this.previousFocus=null;this.keyboardActive=false}moveFocusAfterClose(t){const s=document.activeElement;const i=this.positionerElement(t);if(!s||!i?.contains(s))return;requestAnimationFrame((()=>{const s=this.activeRecords.find((s=>s.id!==t));const i=s?this.positionerElement(s.id)?.querySelector("ds-button-unfilled"):null;if(i?.setFocus)void i.setFocus();else if(s)this.regionElement?.focus();else this.restorePreviousFocus()}))}handleAction(t,s){const i={id:t.id,toast:t,originalEvent:s.detail};this.dsToastAction.emit(i);t.action?.onAction?.({id:t.id,data:t.data,manager:this.manager,originalEvent:s.detail})}handlePointerDown(t,s){if(s.button!==0)return;const i=s.target;if(i.closest(E))return;const e=s.currentTarget;e.setPointerCapture(s.pointerId);this.activeSwipe={id:t.id,pointerId:s.pointerId,pointerType:s.pointerType,startX:s.clientX,startY:s.clientY,maxDistance:0,cancelled:false,axis:null};this.swipe={id:t.id,x:0,y:0};if(s.pointerType==="touch")this.pauseTimers("swipe")}handlePointerMove(t){const s=this.activeSwipe;if(!s||s.pointerId!==t.pointerId||s.cancelled)return;const i=t.clientX-s.startX;const e=t.clientY-s.startY;if(!s.axis&&Math.max(Math.abs(i),Math.abs(e))>1){s.axis=Math.abs(i)>=Math.abs(e)?"x":"y"}if(!s.axis)return;const o=s.axis==="x";const n=o?i>=0?"right":"left":e>=0?"down":"up";const a=this.swipeDirections.includes(n);const r=o?Math.abs(i):Math.abs(e);const h=a?r:Math.sqrt(r);const c=(o?i:e)<0?-h:h;const d=o?c:0;const l=o?0:c;if(s.maxDistance-h>=S){s.cancelled=true;this.cancelSwipe();return}s.maxDistance=Math.max(s.maxDistance,h);if(r>1)t.preventDefault();this.swipe={id:s.id,x:d,y:l,direction:a?n:undefined}}handlePointerUp(t){const s=this.activeSwipe;if(!s||s.pointerId!==t.pointerId)return;const i=this.swipe;const e=i?Math.max(Math.abs(i.x),Math.abs(i.y)):0;const o=!s.cancelled&&!!i?.direction&&e>=C;const n=s.id;const a=s.pointerType==="touch";this.activeSwipe=null;this.swipe=null;if(a)this.resumeTimers("swipe");if(o&&i.direction){this.dismissedSwipeDirections.set(n,i.direction);this.manager.close(n,"swipe")}}handlePointerCancel(t){if(this.activeSwipe?.pointerId!==t.pointerId)return;this.cancelSwipe()}cancelSwipe(){const t=this.activeSwipe?.pointerType==="touch";this.activeSwipe=null;this.swipe=null;if(t)this.resumeTimers("swipe")}get touchAction(){const t=this.swipeDirections.includes("left")||this.swipeDirections.includes("right");const s=this.swipeDirections.includes("up")||this.swipeDirections.includes("down");if(t&&s)return"none";if(t)return"pan-y";if(s)return"pan-x";return"auto"}measureNaturalHeight(t,s){const i=t.querySelector(".toast-surface");if(!i)return 0;const e=t.style.width;const o=t.style.transition;const n=i.style.height;if(s){t.style.transition="none";t.style.width="100%"}i.style.height="auto";const a=i.getBoundingClientRect().height;i.style.height=n;if(s){t.style.width=e;t.getBoundingClientRect();t.style.transition=o}return a}measureLayout(){let t=false;for(const s of this.records){const i=this.positionerElement(s.id);if(!i)continue;let e=this.heights.get(s.id)??0;const o=e<=0||this.measuredUpdateKeys.get(s.id)!==s.updateKey;if(o){e=this.measureNaturalHeight(i,!s.positioner);if(e>0){if(this.heights.get(s.id)!==e)t=true;this.heights.set(s.id,e);this.measuredUpdateKeys.set(s.id,s.updateKey)}}if(!s.positioner)continue;const n=this.resolveAnchor(s.positioner.anchor);if(!n||e<=0){if(this.anchoredPositions.delete(s.id))t=true;continue}const h=i.getBoundingClientRect();const c=g(s.positioner.sideOffset,m.space050);const d=g(s.positioner.alignOffset,0);const l=a({anchorRect:n.getBoundingClientRect(),popupWidth:h.width,popupHeight:e,side:s.positioner.side??"top",align:s.positioner.align??"center",sideOffsetPx:c,alignOffsetPx:d,viewportPadPx:g(undefined,m.space200),viewportWidth:window.innerWidth,viewportHeight:window.innerHeight,collisionRect:r(n)});const f=this.anchoredPositions.get(s.id);if(!f||f.x!==l.x||f.y!==l.y||f.side!==l.resolvedSide){this.anchoredPositions.set(s.id,{x:l.x,y:l.y,side:l.resolvedSide});t=true}}if(t)this.layoutVersion+=1}resolveAnchor(t){return typeof t==="string"?document.getElementById(t):t}positionerElement(t){return Array.from(this.el.querySelectorAll(".toast-positioner")).find((s=>s.dataset["toastId"]===t))??null}ensureDomId(t){const s=this.domIds.get(t);if(s)return s;const i=++this.nextDomId;this.domIds.set(t,i);return i}get activeRecords(){return this.records.filter((t=>t.transitionStatus!=="ending"))}globalLayout(){const t=this.records.filter((t=>!t.positioner));let s=0;let i=0;const e=g(undefined,m.space200);const o=new Map;t.forEach(((t,n)=>{if(t.transitionStatus==="ending"){o.set(t.id,{index:n,offset:s,limited:false});return}const a=i>=Math.max(1,this.limit);o.set(t.id,{index:i,offset:s,limited:a});s+=(this.heights.get(t.id)??0)+e;i+=1}));return o}renderToast(t,s){const i=this.ensureDomId(t.id);const o=`ds-toast-${this.instanceId}-${i}-title`;const n=`ds-toast-${this.instanceId}-${i}-description`;const a=this.swipe?.id===t.id?this.swipe:null;const r=a?.direction??this.dismissedSwipeDirections.get(t.id);const h=!!t.positioner;const c=this.anchoredPositions.get(t.id);const d=t.priority==="high"&&!this.keyboardActive;const l=this.keyboardActive&&!s.limited?0:-1;const f=this.heights.get(t.id);return e("div",{ref:s=>this.bindAnimationCancel(s,t.id),class:{"toast-positioner":true,"toast-positioner--anchored":h,"toast-positioner--ending":t.transitionStatus==="ending"},"data-toast-id":t.id,"data-behind":!h&&s.index>0?"":undefined,"data-limited":s.limited?"":undefined,"data-positioned":h?String(!!c):undefined,"data-side":c?.side,inert:s.limited?true:undefined,"aria-hidden":s.limited?"true":undefined,style:{"--toast-index":String(s.index),"--toast-offset-y":`${s.offset}px`,"--toast-height":f?`${f}px`:undefined,zIndex:String(this.records.length-s.index),left:c?`${c.x}px`:undefined,top:c?`${c.y}px`:undefined},onAnimationEnd:()=>this.handleAnimationComplete(t)},e("div",{class:{"toast-surface":true,"toast-surface--swiping":!!a},role:t.priority==="high"?"alertdialog":"dialog","aria-modal":"false","aria-labelledby":t.title?o:t.description?n:undefined,"aria-describedby":t.title&&t.description?n:undefined,"aria-hidden":d?"true":undefined,"data-type":t.type,"data-priority":t.priority,"data-transition-status":t.transitionStatus,"data-swiping":a?"":undefined,"data-swipe-direction":r,style:{"--toast-swipe-movement-x":`${a?.x??0}px`,"--toast-swipe-movement-y":`${a?.y??0}px`,touchAction:this.touchAction},onPointerDown:s=>this.handlePointerDown(t,s),onPointerMove:t=>this.handlePointerMove(t),onPointerUp:t=>this.handlePointerUp(t),onPointerCancel:t=>this.handlePointerCancel(t),onPointerEnter:h?()=>this.handlePointerEnter(t.id):undefined,onPointerLeave:h?()=>this.handlePointerLeave(t.id):undefined},e("div",{class:"toast-content"},e("div",{class:"toast-copy"},t.title&&e("ds-text",{class:"toast-title",as:"div",variant:"text-title-small",color:"primary",textId:o},t.title),t.description&&e("ds-text",{class:"toast-description",as:"div",variant:"text-body-medium",color:"secondary",textId:n},t.description)),t.action&&e("ds-button-unfilled",{class:"toast-action",variant:"label",size:"md",type:"button",label:t.action.label,"aria-label":t.action.ariaLabel,hasBorder:true,focusTabIndex:l,"aria-hidden":!this.keyboardActive?"true":undefined,onDsClick:s=>this.handleAction(t,s)})),e("ds-button-unfilled",{class:"toast-close",variant:"icon",size:"md",type:"button",icon:"Cross","aria-label":this.closeLabel,hasBorder:false,activeFill:false,focusTabIndex:l,"aria-hidden":!this.keyboardActive?"true":undefined,onDsClick:()=>this.manager.close(t.id,"close-button")})))}render(){const t=this.globalLayout();const s=this.records.filter((t=>!t.positioner));const i=this.records.filter((t=>!!t.positioner));const n=this.records.filter((s=>s.priority==="high"&&s.transitionStatus!=="ending"&&!t.get(s.id)?.limited));return e(o,{key:"161fda4c02b168f0a94f3f0d57399c45e60baa3e"},e("section",{key:"c4f8088f07db4f681d92899d2f99826b7d11f643",class:"toast-region",role:"region","aria-label":this.label,"aria-live":"polite","aria-atomic":"false","aria-relevant":"additions text",tabIndex:-1,onFocusin:this.handleFocusIn,onFocusout:t=>this.handleFocusOut(t),onKeyDown:t=>this.handleRegionKeyDown(t)},e("div",{key:"4f406c5ac501175d377549764f252b168a11d807",class:"toast-viewport","data-expanded":this.expanded?"":undefined,onPointerEnter:()=>this.handlePointerEnter(P),onPointerLeave:()=>this.handlePointerLeave(P)},s.map((s=>this.renderToast(s,t.get(s.id)??{index:0,offset:0,limited:false})))),e("div",{key:"9c802a80a5cb20b2b6ed06865c685d99eadc803a",class:"toast-anchored-layer"},i.map((t=>this.renderToast(t,{index:0,offset:0,limited:false})))),e("div",{key:"2a85a109257e382849b7082b375dec350a642a78",class:"toast-assertive-announcer ds-visually-hidden"},n.map((t=>e("div",{role:"alert","aria-atomic":"true"},[t.title,t.description].filter(Boolean).join(". ")))))))}get el(){return this}static get watchers(){return{manager:[{onManagerChange:0}],timeout:[{onTimeoutChange:0}]}}static get style(){return A()}},[2,"ds-toast",{manager:[16],limit:[2],timeout:[8],label:[1],closeLabel:[1,"close-label"],avoidMobileShellBar:[516,"avoid-mobile-shell-bar"],swipeDirections:[16],records:[32],expanded:[32],keyboardActive:[32],swipe:[32],layoutVersion:[32]},undefined,{manager:[{onManagerChange:0}],timeout:[{onTimeoutChange:0}]}]);function L(){if(typeof customElements==="undefined"){return}const t=["ds-toast","ds-badge","ds-button-unfilled","ds-icon","ds-loader","ds-text","ds-tooltip"];t.forEach((t=>{switch(t){case"ds-toast":if(!customElements.get(n(t))){customElements.define(n(t),D)}break;case"ds-badge":if(!customElements.get(n(t))){c()}break;case"ds-button-unfilled":if(!customElements.get(n(t))){d()}break;case"ds-icon":if(!customElements.get(n(t))){l()}break;case"ds-loader":if(!customElements.get(n(t))){f()}break;case"ds-text":if(!customElements.get(n(t))){u()}break;case"ds-tooltip":if(!customElements.get(n(t))){h()}break}}))}L();const $=D;const I=L;export{$ as DsToast,I as defineCustomElement};
+import{p as t,H as s,c as i,h as e,a as o,t as n}from"./index.js";import{c as a,r,d as h}from"./p-BkKdzYZP.js";import{d as c}from"./p-CzTJAO2J.js";import{d}from"./p-CC4X8rpT.js";import{d as l}from"./p-BVsVUnAw.js";import{d as f}from"./p-0XTyQNRG.js";import{d as u}from"./p-CTAF7SkL.js";import{T as m,a as p,r as v}from"./p-mSCnWLhL.js";import{r as g}from"./p-CVYjLzYI.js";function w(t,s){const i=typeof t==="function"?t(s):t;return typeof i==="string"?{description:i}:i}class b{constructor(){this.records=[];this.listeners=new Set;this.nextId=0}add(t){const s=t.id||`ds-toast-${++this.nextId}`;const i=this.records.findIndex((t=>t.id===s));if(!t.title?.trim()&&!t.description?.trim()){console.warn(`[ds-toast] Toast "${s}" should provide a title or description.`)}if(i>=0){const e=this.records[i];const o={...e,...t,id:s,priority:t.priority??e.priority,transitionStatus:"active",closeReason:undefined,updateKey:e.updateKey+1,timerKey:e.timerKey+1};this.records=[o,...this.records.filter(((t,s)=>s!==i))];this.emit();return s}const e={...t,id:s,priority:t.priority??"low",transitionStatus:"starting",updateKey:0,timerKey:0};this.records=[e,...this.records];this.emit();return s}update(t,s){const i=this.records.findIndex((s=>s.id===t));if(i<0)return;const e=this.records[i];const o=Object.prototype.hasOwnProperty.call(s,"timeout")||e.type==="loading"&&s.type!==undefined&&s.type!=="loading";const n={...e,...s,id:t,priority:s.priority??e.priority,updateKey:e.updateKey+1,timerKey:o?e.timerKey+1:e.timerKey};this.records=this.records.map(((t,s)=>s===i?n:t));this.emit()}close(t,s="programmatic"){const i=this.records.findIndex((s=>s.id===t));if(i<0||this.records[i].transitionStatus==="ending")return;const e={...this.records[i],transitionStatus:"ending",closeReason:s};this.records=this.records.map(((t,s)=>s===i?e:t));this.emit();e.onClose?.({id:t,reason:s,toast:e})}closeAll(t="programmatic"){for(const s of[...this.records])this.close(s.id,t)}async promise(t,s){const i=w(s.loading,undefined);const e=this.add({...i,type:i.type??"loading",timeout:0});try{const i=await t;const o=w(s.success,i);this.update(e,{...o,type:o.type??"success",timeout:o.timeout});return i}catch(t){const i=w(s.error,t);this.update(e,{...i,type:i.type??"error",timeout:i.timeout});throw t}}subscribe(t){this.listeners.add(t);t(this.getSnapshot());return()=>{this.listeners.delete(t)}}getSnapshot(){return this.records.map((t=>({...t})))}activate(t){const s=this.records.find((s=>s.id===t));if(!s||s.transitionStatus!=="starting")return;this.records=this.records.map((s=>s.id===t?{...s,transitionStatus:"active"}:s));this.emit()}remove(t){const s=this.records.find((s=>s.id===t));if(!s||s.transitionStatus!=="ending")return null;const i=s.closeReason??"programmatic";this.records=this.records.filter((s=>s.id!==t));this.emit();const e={id:t,reason:i,toast:s};return e}notifyRemove(t){const{toast:s}=t;s.onRemove?.(t)}emit(){const t=this.getSnapshot();for(const s of this.listeners)s(t)}}function y(){return new b}const x=Symbol.for("@ds-mo/ui/default-toast-manager");const T=globalThis;const M=T[x];const k=M??y();if(!M)T[x]=k;const A=()=>`.ds-visually-hidden.sc-ds-toast-h,.ds-visually-hidden.sc-ds-toast{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0, 0, 0, 0);white-space:nowrap;border:0}@media (forced-colors: active){.sc-ds-toast:root,.sc-ds-toast-h,.ds-forced-colors-scope.sc-ds-toast{--ds-forced-color-surface:Canvas;--ds-forced-color-content:CanvasText;--ds-forced-color-control-boundary:ButtonText;--ds-forced-color-selected:Highlight;--ds-forced-color-on-selected:HighlightText;--ds-forced-color-disabled:GrayText}}.sc-ds-toast-h,.sc-ds-toast:where(.ds-table),.sc-ds-toast:where(.tooltip-popup),.sc-ds-toast:where(.ds-radius){--ds-radius-control:var(--dimension-radius-025);--ds-radius-card:var(--dimension-radius-050);--ds-radius-modal:var(--dimension-radius-050);--ds-radius-menu:var(--dimension-radius-075);--ds-radius-tooltip-control:var(--dimension-radius-025);--ds-radius-tooltip-menu:var(--dimension-radius-075);--ds-radius-table:var(--dimension-radius-050)}.sc-ds-toast-h{display:contents}.toast-region.sc-ds-toast{position:fixed;inset:0;z-index:var(--dimension-z-index-floating);pointer-events:none;outline:none}.toast-viewport.sc-ds-toast{position:absolute;right:var(--dimension-space-200);bottom:var(--dimension-space-200);display:grid;width:min(var(--dimension-card-width-sm), calc(100vw - 2 * var(--dimension-space-200)))}@media (width < 768px){[avoid-mobile-shell-bar].sc-ds-toast-h .toast-viewport.sc-ds-toast{bottom:calc(       var(--dimension-space-200) + var(--dimension-space-100) + var(--dimension-size-400) +         max(var(--dimension-space-100), env(safe-area-inset-bottom))     )}}.toast-positioner.sc-ds-toast{grid-area:1 / 1;align-self:end;justify-self:center;width:100%;pointer-events:auto;transform:translateY(calc(-1 * var(--toast-index) * var(--dimension-space-100)));transition:transform var(--effect-motion-short-3),     width var(--effect-motion-short-3)}.toast-viewport.sc-ds-toast:not([data-expanded]) .toast-positioner.sc-ds-toast{width:calc(100% - 2 * var(--toast-index) * var(--dimension-space-100))}.toast-viewport[data-expanded].sc-ds-toast .toast-positioner.sc-ds-toast{transform:translateY(calc(-1 * var(--toast-offset-y)))}.toast-positioner[data-limited].sc-ds-toast{visibility:hidden;pointer-events:none}.toast-positioner--anchored.sc-ds-toast{position:fixed;width:min(var(--dimension-card-width-sm), calc(100vw - 2 * var(--dimension-space-200)));transform:none}.toast-positioner--anchored[data-positioned='false'].sc-ds-toast{visibility:hidden}.toast-surface.sc-ds-toast{position:relative;display:block;box-sizing:border-box;width:100%;height:var(--toast-height, auto);padding:var(--dimension-space-200);overflow:hidden;color:var(--color-foreground-primary);background-color:var(--color-background-primary);border-radius:var(--ds-radius-modal);box-shadow:var(--effect-elevation-elevated-floating);transform:translate(var(--toast-swipe-movement-x), var(--toast-swipe-movement-y));animation:toast-enter var(--effect-motion-short-2) both}.toast-positioner--ending.sc-ds-toast .toast-surface.sc-ds-toast{animation:toast-exit var(--effect-motion-short-3) both}.toast-surface--swiping.sc-ds-toast{transition:none;user-select:none}.toast-content.sc-ds-toast{display:flex;flex-direction:column;min-width:0;padding-inline-end:var(--dimension-size-500);transition:opacity var(--effect-motion-short-3)}.toast-copy.sc-ds-toast{display:flex;flex-direction:column;min-width:0;min-height:var(--typography-lineheight-md);margin-block:calc(-1 * var(--dimension-space-025));gap:var(--dimension-space-050)}.toast-title.sc-ds-toast,.toast-description.sc-ds-toast{min-width:0}.toast-action.sc-ds-toast{align-self:start;margin-top:calc(var(--dimension-space-200) + var(--dimension-space-025))}.toast-close.sc-ds-toast{position:absolute;top:var(--dimension-space-100);right:var(--dimension-space-100);transition:opacity var(--effect-motion-short-3)}.toast-viewport.sc-ds-toast:not([data-expanded]) .toast-positioner[data-behind].sc-ds-toast .toast-content.sc-ds-toast,.toast-viewport.sc-ds-toast:not([data-expanded]) .toast-positioner[data-behind].sc-ds-toast .toast-close.sc-ds-toast{opacity:0}@keyframes toast-enter{from{opacity:0;transform:translateY(var(--dimension-space-100))}to{opacity:1;transform:translateY(0)}}@keyframes toast-exit{from{opacity:1}to{opacity:0}}@media (prefers-reduced-motion: reduce){.toast-positioner.sc-ds-toast,.toast-surface.sc-ds-toast,.toast-content.sc-ds-toast,.toast-close.sc-ds-toast,.toast-positioner--ending.sc-ds-toast .toast-surface.sc-ds-toast{transition:none;animation:none}.toast-positioner--ending.sc-ds-toast .toast-surface.sc-ds-toast{opacity:0}}@media (forced-colors: active){.toast-surface.sc-ds-toast{box-shadow:none;outline:var(--dimension-stroke-width-012) solid var(--ds-forced-color-content);outline-offset:calc(-1 * var(--dimension-stroke-width-012))}}`;const C=40;const S=10;const P="__global-stack__";const E='button,a,input,textarea,select,[role="button"],[data-ds-toast-swipe-ignore]';const F=new WeakMap;const z=new Set;let L=null;let R=0;const j=t(class t extends s{constructor(t){super();if(t!==false){this.__registerHost()}this.dsToastClose=i(this,"dsToastClose",7);this.dsToastRemove=i(this,"dsToastRemove",7);this.dsToastAction=i(this,"dsToastAction",7);this.manager=k;this.limit=3;this.timeout=m.animationDelayLong2;this.label="Notifications";this.closeLabel="Close notification";this.avoidMobileShellBar=false;this.swipeDirections=["down","right"];this.records=[];this.expanded=false;this.keyboardActive=false;this.swipe=null;this.layoutVersion=0;this.instanceId=++R;this.domIds=new Map;this.timers=new Map;this.closeWatchdogs=new Map;this.closeFrames=new Map;this.closeEvents=new Set;this.activationFrames=new Map;this.pauseReasons=new Set;this.hoveredIds=new Set;this.heights=new Map;this.measuredUpdateKeys=new Map;this.anchoredPositions=new Map;this.dismissedSwipeDirections=new Map;this.observedElements=new Set;this.pendingRemovals=[];this.unsubscribe=null;this.attachedManager=null;this.previousFocus=null;this.resizeObserver=null;this.mutationObserver=null;this.layoutFrame=null;this.activeSwipe=null;this.nextDomId=0;this.connected=false;this.pendingHoverLeave=false;this.handleWindowBlur=()=>this.pauseTimers("window");this.handleWindowFocus=()=>this.resumeTimers("window");this.handleVisibilityChange=()=>{if(document.hidden)this.pauseTimers("document");else this.resumeTimers("document")};this.handleFocusIn=()=>{const t=document.activeElement;if(!(t instanceof s)||!t.matches(":focus-visible"))return;L=this;this.keyboardActive=true;this.expanded=true;this.pauseTimers("focus")};this.handleFocusOut=t=>{const s=t.relatedTarget;if(s instanceof Node&&this.el.contains(s))return;if(!this.keyboardActive)return;this.keyboardActive=false;this.expanded=this.hoveredIds.size>0;this.resumeTimers("focus")};this.handleDocumentKeyDown=t=>{if(t.key!=="F6")return;const s=Array.from(z).filter((t=>t.activeRecords.length>0));const i=L&&L.activeRecords.length?L:s[s.length-1];if(i!==this)return;t.preventDefault();if(!this.el.contains(document.activeElement)){this.previousFocus=document.activeElement}this.keyboardActive=true;this.regionElement?.focus()};this.handleRegionKeyDown=t=>{if(t.key==="Escape"){const s=t.target;const i=s.closest(".toast-positioner");const e=i?.dataset["toastId"]??this.activeRecords[0]?.id;if(e){t.preventDefault();this.manager.close(e,"escape")}return}if(t.key==="Tab"&&t.shiftKey&&t.target===this.regionElement){t.preventDefault();this.restorePreviousFocus()}};this.handleWindowResize=()=>{this.heights.clear();this.measuredUpdateKeys.clear();this.layoutVersion+=1;this.scheduleLayout()};this.scheduleLayout=()=>{if(this.layoutFrame!==null)return;this.layoutFrame=requestAnimationFrame((()=>{this.layoutFrame=null;this.measureLayout()}))}}connectedCallback(){this.connect()}componentDidLoad(){this.connect()}connect(){if(this.connected)return;this.connected=true;this.resizeObserver??(this.resizeObserver=new ResizeObserver((()=>this.scheduleLayout())));this.mutationObserver??(this.mutationObserver=new MutationObserver((()=>this.scheduleLayout())));this.mutationObserver.observe(document.body,{childList:true,subtree:true});if(!this.unsubscribe)this.attachManager(this.manager);window.addEventListener("blur",this.handleWindowBlur);window.addEventListener("focus",this.handleWindowFocus);window.addEventListener("resize",this.handleWindowResize);window.addEventListener("scroll",this.scheduleLayout,true);document.addEventListener("keydown",this.handleDocumentKeyDown);document.addEventListener("visibilitychange",this.handleVisibilityChange);z.add(this);if(!L)L=this}componentDidRender(){this.syncObservedElements();this.flushPendingRemovals();this.scheduleLayout()}disconnectedCallback(){this.connected=false;this.flushPendingRemovals();this.detachManager();this.resetManagerState();this.resizeObserver?.disconnect();this.resizeObserver=null;this.mutationObserver?.disconnect();this.mutationObserver=null;this.observedElements.clear();if(this.layoutFrame!==null)cancelAnimationFrame(this.layoutFrame);this.layoutFrame=null;window.removeEventListener("blur",this.handleWindowBlur);window.removeEventListener("focus",this.handleWindowFocus);window.removeEventListener("resize",this.handleWindowResize);window.removeEventListener("scroll",this.scheduleLayout,true);document.removeEventListener("keydown",this.handleDocumentKeyDown);document.removeEventListener("visibilitychange",this.handleVisibilityChange);z.delete(this);if(L===this){const t=Array.from(z);L=t[t.length-1]??null}}onManagerChange(t){this.detachManager();this.resetManagerState();if(this.connected)this.attachManager(t)}onTimeoutChange(){for(const t of this.timers.values()){if(t.handle)clearTimeout(t.handle)}this.timers.clear();this.syncTimers()}attachManager(t){const s=F.get(t);if(s&&s!==this){console.warn("[ds-toast] A manager can control only one connected ds-toast instance.");return}F.set(t,this);this.attachedManager=t;this.unsubscribe=t.subscribe((t=>{this.records=t;this.syncLifecycle(t);this.scheduleLayout()}))}detachManager(){this.unsubscribe?.();this.unsubscribe=null;if(this.attachedManager&&F.get(this.attachedManager)===this){F.delete(this.attachedManager)}this.attachedManager=null}resetManagerState(){this.flushPendingRemovals();if(this.el.contains(document.activeElement))this.restorePreviousFocus();this.clearAllTimers();for(const t of this.activationFrames.values())cancelAnimationFrame(t);for(const t of this.closeFrames.values())cancelAnimationFrame(t);this.activationFrames.clear();this.closeFrames.clear();this.closeEvents.clear();this.pauseReasons.clear();this.hoveredIds.clear();this.pendingHoverLeave=false;this.heights.clear();this.measuredUpdateKeys.clear();this.anchoredPositions.clear();this.dismissedSwipeDirections.clear();this.domIds.clear();this.activeSwipe=null;this.swipe=null;this.expanded=false;this.keyboardActive=false;this.records=[];this.resizeObserver?.disconnect();this.observedElements.clear()}syncObservedElements(){const t=new Set(this.el.querySelectorAll(".toast-positioner"));for(const s of this.records){if(!s.positioner)continue;const i=this.resolveAnchor(s.positioner.anchor);if(i)t.add(i)}for(const s of this.observedElements){if(!t.has(s)){this.resizeObserver?.unobserve(s);this.observedElements.delete(s)}}for(const s of t){if(this.observedElements.has(s))continue;this.resizeObserver?.observe(s);this.observedElements.add(s)}}flushPendingRemovals(){for(const t of this.pendingRemovals.splice(0)){t.manager.notifyRemove(t.context);this.dsToastRemove.emit({id:t.context.id,toast:t.context.toast})}}syncLifecycle(t){const s=new Set(t.map((t=>t.id)));for(const t of this.hoveredIds){if(t!==P&&!s.has(t))this.hoveredIds.delete(t)}const i=t.some((t=>t.transitionStatus==="ending"));if(this.pendingHoverLeave&&!i&&!this.hoveredIds.size){this.pendingHoverLeave=false;this.expanded=false;this.resumeTimers("hover")}else if(!this.hoveredIds.size&&!this.pendingHoverLeave){this.resumeTimers("hover")}for(const[t,i]of this.timers){if(s.has(t))continue;if(i.handle)clearTimeout(i.handle);this.timers.delete(t)}for(const[t,i]of this.closeWatchdogs){if(s.has(t))continue;clearTimeout(i);this.closeWatchdogs.delete(t)}for(const[t,i]of this.activationFrames){if(s.has(t))continue;cancelAnimationFrame(i);this.activationFrames.delete(t)}for(const[t,i]of this.closeFrames){if(s.has(t))continue;cancelAnimationFrame(i);this.closeFrames.delete(t)}for(const t of this.domIds.keys()){if(s.has(t))continue;this.closeEvents.delete(t);this.domIds.delete(t);this.heights.delete(t);this.measuredUpdateKeys.delete(t);this.anchoredPositions.delete(t);this.dismissedSwipeDirections.delete(t)}for(const s of t){this.ensureDomId(s.id);if(s.transitionStatus==="starting"&&!this.activationFrames.has(s.id)){const t=this.attachedManager;const i=requestAnimationFrame((()=>{this.activationFrames.delete(s.id);t?.activate(s.id)}));this.activationFrames.set(s.id,i)}if(s.transitionStatus==="ending"){this.clearToastTimer(s.id);this.beginRemoval(s)}else{const t=this.closeWatchdogs.get(s.id);if(t)clearTimeout(t);this.closeWatchdogs.delete(s.id);const i=this.closeFrames.get(s.id);if(i)cancelAnimationFrame(i);this.closeFrames.delete(s.id);this.closeEvents.delete(s.id)}}this.syncTimers()}syncTimers(){const t=new Set;for(const s of this.records){if(s.transitionStatus!=="active")continue;t.add(s.id);const i=this.resolveToastTimeout(s);if(i<=0){this.clearToastTimer(s.id);continue}const e=this.timers.get(s.id);if(!e||e.timerKey!==s.timerKey){this.clearToastTimer(s.id);this.timers.set(s.id,{timerKey:s.timerKey,remaining:i,startedAt:0,handle:null})}if(!this.isPaused)this.startToastTimer(s.id)}for(const s of this.timers.keys()){if(!t.has(s))this.clearToastTimer(s)}}resolveToastTimeout(t){const s=t.timeout??this.timeout;if(typeof s==="number")return Math.max(0,s);return p(s,m.animationDelayLong2)}startToastTimer(t){const s=this.timers.get(t);if(!s||s.handle||s.remaining<=0)return;s.startedAt=Date.now();s.handle=setTimeout((()=>{s.handle=null;s.remaining=0;this.manager.close(t,"timeout")}),s.remaining)}pauseTimers(t){const s=this.isPaused;this.pauseReasons.add(t);if(s)return;const i=Date.now();for(const t of this.timers.values()){if(!t.handle)continue;clearTimeout(t.handle);t.handle=null;t.remaining=Math.max(0,t.remaining-(i-t.startedAt))}}resumeTimers(t){this.pauseReasons.delete(t);if(this.isPaused)return;for(const t of this.timers.keys())this.startToastTimer(t)}get isPaused(){return this.pauseReasons.size>0}clearToastTimer(t){const s=this.timers.get(t);if(s?.handle)clearTimeout(s.handle);this.timers.delete(t)}clearAllTimers(){for(const t of this.timers.values()){if(t.handle)clearTimeout(t.handle)}for(const t of this.closeWatchdogs.values())clearTimeout(t);this.timers.clear();this.closeWatchdogs.clear()}beginRemoval(t){if(!this.closeEvents.has(t.id)){this.closeEvents.add(t.id);this.dsToastClose.emit({id:t.id,reason:t.closeReason??"programmatic",toast:t});this.moveFocusAfterClose(t.id)}if(this.closeWatchdogs.has(t.id)||this.closeFrames.has(t.id))return;const s=v(m.motionShort3,m.animationDurationShort3);if(s<=0){queueMicrotask((()=>this.completeRemoval(t)));return}const i=requestAnimationFrame((()=>{this.closeFrames.delete(t.id);const i=this.records.find((s=>s.id===t.id));if(!i||i.transitionStatus!=="ending")return;this.closeWatchdogs.set(t.id,setTimeout((()=>this.completeRemoval(i)),s))}));this.closeFrames.set(t.id,i)}completeRemoval(t){const s=this.records.find((s=>s.id===t.id));if(!s||s.transitionStatus!=="ending")return;const i=this.closeWatchdogs.get(t.id);if(i)clearTimeout(i);this.closeWatchdogs.delete(t.id);const e=this.closeFrames.get(t.id);if(e)cancelAnimationFrame(e);this.closeFrames.delete(t.id);const o=this.attachedManager;const n=o?.remove(t.id);if(o&&n)this.pendingRemovals.push({manager:o,context:n})}handleAnimationComplete(t){if(t.transitionStatus==="ending")this.completeRemoval(t)}bindAnimationCancel(t,s){if(!t||t.dataset["cancelBound"]==="true")return;t.dataset["cancelBound"]="true";t.addEventListener("animationcancel",(()=>{const t=this.records.find((t=>t.id===s));if(t)this.handleAnimationComplete(t)}))}handlePointerEnter(t){L=this;this.pendingHoverLeave=false;this.hoveredIds.add(t);this.expanded=true;this.pauseTimers("hover")}handlePointerLeave(t){this.hoveredIds.delete(t);if(this.hoveredIds.size)return;if(this.records.some((t=>t.transitionStatus==="ending"))){this.pendingHoverLeave=true;return}this.expanded=false;this.resumeTimers("hover")}get regionElement(){return this.el.querySelector(".toast-region")}restorePreviousFocus(){this.previousFocus?.focus?.();this.previousFocus=null;this.keyboardActive=false}moveFocusAfterClose(t){const s=document.activeElement;const i=this.positionerElement(t);if(!s||!i?.contains(s))return;requestAnimationFrame((()=>{const s=this.activeRecords.find((s=>s.id!==t));const i=s?this.positionerElement(s.id)?.querySelector("ds-button-unfilled"):null;if(i?.setFocus)void i.setFocus();else if(s)this.regionElement?.focus();else this.restorePreviousFocus()}))}handleAction(t,s){const i={id:t.id,toast:t,originalEvent:s.detail};this.dsToastAction.emit(i);t.action?.onAction?.({id:t.id,data:t.data,manager:this.manager,originalEvent:s.detail})}handlePointerDown(t,s){if(s.button!==0)return;const i=s.target;if(i.closest(E))return;const e=s.currentTarget;e.setPointerCapture(s.pointerId);this.activeSwipe={id:t.id,pointerId:s.pointerId,pointerType:s.pointerType,startX:s.clientX,startY:s.clientY,maxDistance:0,cancelled:false,axis:null};this.swipe={id:t.id,x:0,y:0};if(s.pointerType==="touch")this.pauseTimers("swipe")}handlePointerMove(t){const s=this.activeSwipe;if(!s||s.pointerId!==t.pointerId||s.cancelled)return;const i=t.clientX-s.startX;const e=t.clientY-s.startY;if(!s.axis&&Math.max(Math.abs(i),Math.abs(e))>1){s.axis=Math.abs(i)>=Math.abs(e)?"x":"y"}if(!s.axis)return;const o=s.axis==="x";const n=o?i>=0?"right":"left":e>=0?"down":"up";const a=this.swipeDirections.includes(n);const r=o?Math.abs(i):Math.abs(e);const h=a?r:Math.sqrt(r);const c=(o?i:e)<0?-h:h;const d=o?c:0;const l=o?0:c;if(s.maxDistance-h>=S){s.cancelled=true;this.cancelSwipe();return}s.maxDistance=Math.max(s.maxDistance,h);if(r>1)t.preventDefault();this.swipe={id:s.id,x:d,y:l,direction:a?n:undefined}}handlePointerUp(t){const s=this.activeSwipe;if(!s||s.pointerId!==t.pointerId)return;const i=this.swipe;const e=i?Math.max(Math.abs(i.x),Math.abs(i.y)):0;const o=!s.cancelled&&!!i?.direction&&e>=C;const n=s.id;const a=s.pointerType==="touch";this.activeSwipe=null;this.swipe=null;if(a)this.resumeTimers("swipe");if(o&&i.direction){this.dismissedSwipeDirections.set(n,i.direction);this.manager.close(n,"swipe")}}handlePointerCancel(t){if(this.activeSwipe?.pointerId!==t.pointerId)return;this.cancelSwipe()}cancelSwipe(){const t=this.activeSwipe?.pointerType==="touch";this.activeSwipe=null;this.swipe=null;if(t)this.resumeTimers("swipe")}get touchAction(){const t=this.swipeDirections.includes("left")||this.swipeDirections.includes("right");const s=this.swipeDirections.includes("up")||this.swipeDirections.includes("down");if(t&&s)return"none";if(t)return"pan-y";if(s)return"pan-x";return"auto"}measureNaturalHeight(t,s){const i=t.querySelector(".toast-surface");if(!i)return 0;const e=t.style.width;const o=t.style.transition;const n=i.style.height;if(s){t.style.transition="none";t.style.width="100%"}i.style.height="auto";const a=i.getBoundingClientRect().height;i.style.height=n;if(s){t.style.width=e;t.getBoundingClientRect();t.style.transition=o}return a}measureLayout(){let t=false;for(const s of this.records){const i=this.positionerElement(s.id);if(!i)continue;let e=this.heights.get(s.id)??0;const o=e<=0||this.measuredUpdateKeys.get(s.id)!==s.updateKey;if(o){e=this.measureNaturalHeight(i,!s.positioner);if(e>0){if(this.heights.get(s.id)!==e)t=true;this.heights.set(s.id,e);this.measuredUpdateKeys.set(s.id,s.updateKey)}}if(!s.positioner)continue;const n=this.resolveAnchor(s.positioner.anchor);if(!n||e<=0){if(this.anchoredPositions.delete(s.id))t=true;continue}const h=i.getBoundingClientRect();const c=g(s.positioner.sideOffset,m.space050);const d=g(s.positioner.alignOffset,0);const l=a({anchorRect:n.getBoundingClientRect(),popupWidth:h.width,popupHeight:e,side:s.positioner.side??"top",align:s.positioner.align??"center",sideOffsetPx:c,alignOffsetPx:d,viewportPadPx:g(undefined,m.space200),viewportWidth:window.innerWidth,viewportHeight:window.innerHeight,collisionRect:r(n)});const f=this.anchoredPositions.get(s.id);if(!f||f.x!==l.x||f.y!==l.y||f.side!==l.resolvedSide){this.anchoredPositions.set(s.id,{x:l.x,y:l.y,side:l.resolvedSide});t=true}}if(t)this.layoutVersion+=1}resolveAnchor(t){return typeof t==="string"?document.getElementById(t):t}positionerElement(t){return Array.from(this.el.querySelectorAll(".toast-positioner")).find((s=>s.dataset["toastId"]===t))??null}ensureDomId(t){const s=this.domIds.get(t);if(s)return s;const i=++this.nextDomId;this.domIds.set(t,i);return i}get activeRecords(){return this.records.filter((t=>t.transitionStatus!=="ending"))}globalLayout(){const t=this.records.filter((t=>!t.positioner));let s=0;let i=0;const e=g(undefined,m.space200);const o=new Map;t.forEach(((t,n)=>{if(t.transitionStatus==="ending"){o.set(t.id,{index:n,offset:s,limited:false});return}const a=i>=Math.max(1,this.limit);o.set(t.id,{index:i,offset:s,limited:a});s+=(this.heights.get(t.id)??0)+e;i+=1}));return o}renderToast(t,s){const i=this.ensureDomId(t.id);const o=`ds-toast-${this.instanceId}-${i}-title`;const n=`ds-toast-${this.instanceId}-${i}-description`;const a=this.swipe?.id===t.id?this.swipe:null;const r=a?.direction??this.dismissedSwipeDirections.get(t.id);const h=!!t.positioner;const c=this.anchoredPositions.get(t.id);const d=t.priority==="high"&&!this.keyboardActive;const l=this.keyboardActive&&!s.limited?0:-1;const f=this.heights.get(t.id);return e("div",{ref:s=>this.bindAnimationCancel(s,t.id),class:{"toast-positioner":true,"toast-positioner--anchored":h,"toast-positioner--ending":t.transitionStatus==="ending"},"data-toast-id":t.id,"data-behind":!h&&s.index>0?"":undefined,"data-limited":s.limited?"":undefined,"data-positioned":h?String(!!c):undefined,"data-side":c?.side,inert:s.limited?true:undefined,"aria-hidden":s.limited?"true":undefined,style:{"--toast-index":String(s.index),"--toast-offset-y":`${s.offset}px`,"--toast-height":f?`${f}px`:undefined,zIndex:String(this.records.length-s.index),left:c?`${c.x}px`:undefined,top:c?`${c.y}px`:undefined},onAnimationEnd:()=>this.handleAnimationComplete(t)},e("div",{class:{"toast-surface":true,"toast-surface--swiping":!!a},role:t.priority==="high"?"alertdialog":"dialog","aria-modal":"false","aria-labelledby":t.title?o:t.description?n:undefined,"aria-describedby":t.title&&t.description?n:undefined,"aria-hidden":d?"true":undefined,"data-type":t.type,"data-priority":t.priority,"data-transition-status":t.transitionStatus,"data-swiping":a?"":undefined,"data-swipe-direction":r,style:{"--toast-swipe-movement-x":`${a?.x??0}px`,"--toast-swipe-movement-y":`${a?.y??0}px`,touchAction:this.touchAction},onPointerDown:s=>this.handlePointerDown(t,s),onPointerMove:t=>this.handlePointerMove(t),onPointerUp:t=>this.handlePointerUp(t),onPointerCancel:t=>this.handlePointerCancel(t),onPointerEnter:h?()=>this.handlePointerEnter(t.id):undefined,onPointerLeave:h?()=>this.handlePointerLeave(t.id):undefined},e("div",{class:"toast-content"},e("div",{class:"toast-copy"},t.title&&e("ds-text",{class:"toast-title",as:"div",variant:"text-title-small",color:"primary",textId:o},t.title),t.description&&e("ds-text",{class:"toast-description",as:"div",variant:"text-body-medium",color:"secondary",textId:n},t.description)),t.action&&e("ds-button-unfilled",{class:"toast-action",variant:"label",size:"md",type:"button",label:t.action.label,"aria-label":t.action.ariaLabel,hasBorder:true,focusTabIndex:l,"aria-hidden":!this.keyboardActive?"true":undefined,onDsClick:s=>this.handleAction(t,s)})),e("ds-button-unfilled",{class:"toast-close",variant:"icon",size:"md",type:"button",icon:"Cross","aria-label":this.closeLabel,hasBorder:false,activeFill:false,focusTabIndex:l,"aria-hidden":!this.keyboardActive?"true":undefined,onDsClick:()=>this.manager.close(t.id,"close-button")})))}render(){const t=this.globalLayout();const s=this.records.filter((t=>!t.positioner));const i=this.records.filter((t=>!!t.positioner));const n=this.records.filter((s=>s.priority==="high"&&s.transitionStatus!=="ending"&&!t.get(s.id)?.limited));return e(o,{key:"161fda4c02b168f0a94f3f0d57399c45e60baa3e"},e("section",{key:"c4f8088f07db4f681d92899d2f99826b7d11f643",class:"toast-region",role:"region","aria-label":this.label,"aria-live":"polite","aria-atomic":"false","aria-relevant":"additions text",tabIndex:-1,onFocusin:this.handleFocusIn,onFocusout:t=>this.handleFocusOut(t),onKeyDown:t=>this.handleRegionKeyDown(t)},e("div",{key:"4f406c5ac501175d377549764f252b168a11d807",class:"toast-viewport","data-expanded":this.expanded?"":undefined,onPointerEnter:()=>this.handlePointerEnter(P),onPointerLeave:()=>this.handlePointerLeave(P)},s.map((s=>this.renderToast(s,t.get(s.id)??{index:0,offset:0,limited:false})))),e("div",{key:"9c802a80a5cb20b2b6ed06865c685d99eadc803a",class:"toast-anchored-layer"},i.map((t=>this.renderToast(t,{index:0,offset:0,limited:false})))),e("div",{key:"2a85a109257e382849b7082b375dec350a642a78",class:"toast-assertive-announcer ds-visually-hidden"},n.map((t=>e("div",{role:"alert","aria-atomic":"true"},[t.title,t.description].filter(Boolean).join(". ")))))))}get el(){return this}static get watchers(){return{manager:[{onManagerChange:0}],timeout:[{onTimeoutChange:0}]}}static get style(){return A()}},[2,"ds-toast",{manager:[16],limit:[2],timeout:[8],label:[1],closeLabel:[1,"close-label"],avoidMobileShellBar:[516,"avoid-mobile-shell-bar"],swipeDirections:[16],records:[32],expanded:[32],keyboardActive:[32],swipe:[32],layoutVersion:[32]},undefined,{manager:[{onManagerChange:0}],timeout:[{onTimeoutChange:0}]}]);function D(){if(typeof customElements==="undefined"){return}const t=["ds-toast","ds-badge","ds-button-unfilled","ds-icon","ds-loader","ds-text","ds-tooltip"];t.forEach((t=>{switch(t){case"ds-toast":if(!customElements.get(n(t))){customElements.define(n(t),j)}break;case"ds-badge":if(!customElements.get(n(t))){c()}break;case"ds-button-unfilled":if(!customElements.get(n(t))){d()}break;case"ds-icon":if(!customElements.get(n(t))){l()}break;case"ds-loader":if(!customElements.get(n(t))){f()}break;case"ds-text":if(!customElements.get(n(t))){u()}break;case"ds-tooltip":if(!customElements.get(n(t))){h()}break}}))}D();const $=j;const I=D;export{$ as DsToast,I as defineCustomElement};
 //# sourceMappingURL=ds-toast.js.map

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

@@ -1,2 +1,2 @@
-import{T as o,d as s}from"./p-y2Sdv9M3.js";const t=o;const p=s;export{t as DsTooltipChart,p as defineCustomElement};
+import{T as o,d as s}from"./p-BvlkO__o.js";const t=o;const p=s;export{t as DsTooltipChart,p as defineCustomElement};
 //# sourceMappingURL=ds-tooltip-chart.js.map

package/dist/components/ds-tooltip.js

@@ -1,2 +1,2 @@
-import{T as s,d as o}from"./p-B5rN3slq.js";const r=s;const t=o;export{r as DsTooltip,t as defineCustomElement};
+import{T as o,d as s}from"./p-BkKdzYZP.js";const t=o;const p=s;export{t as DsTooltip,p as defineCustomElement};
 //# sourceMappingURL=ds-tooltip.js.map

package/dist/components/{p-B9Q7fXxW.js → p-4qKHg502.js}

@@ -1,2 +1,2 @@
-import{p as s,H as i,c as r,h as e,a as n,t}from"./index.js";import{C as a}from"./p-DlsjHRU3.js";import{g as o,i as d}from"./p-BQq26pt9.js";import{t as c,v as l,a as h,b as v}from"./p-02k7d7BH.js";import{C as b,c as f,a as u,b as p,r as g,d as m}from"./p-B0uO3-Dp.js";import{d as w}from"./p-CzTJAO2J.js";import{d as _}from"./p-CaNMVLhm.js";import{d as y}from"./p-BVsVUnAw.js";import{d as k}from"./p-0XTyQNRG.js";import{d as x}from"./p-DixX2_Bd.js";import{d as C}from"./p-Ch00yccW.js";import{d as T}from"./p-CAARHqjE.js";import{d as z}from"./p-M9pOLcyK.js";import{d as H}from"./p-CTAF7SkL.js";import{d as O}from"./p-B5rN3slq.js";function S(s,i,r){if(!s||!i){return{value:"",hideTabs:false}}if(s!==i&&!s.startsWith(`${i}/`)){return{value:"",hideTabs:false}}const e=s.slice(i.length);const n=e.startsWith("/")?e.slice(1).split("/")[0]:"";const t=o(r);if(!n){return{value:t[0]?.id??"",hideTabs:false}}const a=t.find((s=>s.id===n));if(a){return{value:a.id,hideTabs:false}}return{value:"",hideTabs:true}}function j(s,i){return s.length===0&&(i?.length??0)>0}const E=()=>`.sc-ds-bar-nav-h,.sc-ds-bar-nav:where(.ds-table),.sc-ds-bar-nav:where(.tooltip-popup),.sc-ds-bar-nav:where(.ds-radius){--ds-radius-control:var(--dimension-radius-025);--ds-radius-card:var(--dimension-radius-050);--ds-radius-modal:var(--dimension-radius-050);--ds-radius-menu:var(--dimension-radius-075);--ds-radius-tooltip-control:var(--dimension-radius-025);--ds-radius-tooltip-menu:var(--dimension-radius-075);--ds-radius-table:var(--dimension-radius-050)}.ds-control--lg.sc-ds-bar-nav,.ds-control--lg.sc-ds-bar-nav-h,.ds-control--md.sc-ds-bar-nav-h,.ds-control--md.sc-ds-bar-nav,.ds-control--sm.sc-ds-bar-nav-h,.ds-control--sm.sc-ds-bar-nav,.ds-control--xs.sc-ds-bar-nav-h,.ds-control--xs.sc-ds-bar-nav{--ds-control-radius:var(--ds-radius-control)}.ds-control--lg.sc-ds-bar-nav-h,.ds-control--lg.sc-ds-bar-nav{--ds-control-height:var(--dimension-size-500);--ds-control-icon:var(--dimension-iconography-lg);--ds-control-padding-inline:var(--dimension-space-100);--ds-control-label-inset:var(--dimension-space-050);--ds-control-gap:var(--dimension-space-050)}.ds-control--md.sc-ds-bar-nav-h,.ds-control--md.sc-ds-bar-nav{--ds-control-height:var(--dimension-size-400);--ds-control-icon:var(--dimension-iconography-md);--ds-control-padding-inline:var(--dimension-space-075);--ds-control-label-inset:var(--dimension-space-025);--ds-control-gap:var(--dimension-space-050)}.ds-control--sm.sc-ds-bar-nav-h,.ds-control--sm.sc-ds-bar-nav{--ds-control-height:var(--dimension-size-300);--ds-control-icon:var(--dimension-iconography-sm);--ds-control-padding-inline:var(--dimension-space-050);--ds-control-label-inset:var(--dimension-space-025);--ds-control-gap:var(--dimension-space-025)}.ds-control--xs.sc-ds-bar-nav-h,.ds-control--xs.sc-ds-bar-nav{--ds-control-height:var(--dimension-size-200);--ds-control-icon:var(--dimension-iconography-xs);--ds-control-padding-inline:var(--dimension-space-025);--ds-control-label-inset:var(--dimension-space-025);--ds-control-gap:0}.ds-control-frame.sc-ds-bar-nav{display:inline-flex;align-items:center;box-sizing:border-box;height:var(--ds-control-height, var(--dimension-size-400));padding-inline:var(--ds-control-padding-inline, var(--dimension-space-075));gap:var(--ds-control-gap, var(--dimension-space-050));border-radius:var(--ds-control-radius, var(--dimension-radius-025))}.ds-control-section-heading.sc-ds-bar-nav{display:flex;align-items:center;box-sizing:border-box;height:var(--ds-control-height, var(--dimension-size-400));padding-inline:calc(     var(--ds-control-padding-inline, var(--dimension-space-075)) +       var(--ds-control-label-inset, var(--dimension-space-025))   )}.ds-control-icon-box.sc-ds-bar-nav{display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;width:var(--ds-control-icon, var(--dimension-iconography-md));height:var(--ds-control-icon, var(--dimension-iconography-md))}.ds-control-label-box.sc-ds-bar-nav{min-width:0;padding-inline:var(--ds-control-label-inset, var(--dimension-space-025))}.ds-control-label-dot.sc-ds-bar-nav{position:relative;padding-inline-end:calc(     var(--ds-control-label-inset, var(--dimension-space-025)) +       var(--ds-control-gap, var(--dimension-space-050))   )}.ds-control-label-dot__badge.sc-ds-bar-nav{position:absolute;inset-block-start:0;inset-inline-end:0;pointer-events:none}.ds-chrome-space--sm.sc-ds-bar-nav-h,.ds-chrome-space--sm.sc-ds-bar-nav{--ds-chrome-padding:var(--ds-chrome-space-sm-padding, var(--dimension-space-050));--ds-chrome-gap:var(--dimension-space-050)}.ds-chrome-space--md.sc-ds-bar-nav-h,.ds-chrome-space--md.sc-ds-bar-nav{--ds-chrome-padding:var(--dimension-space-100);--ds-chrome-gap:var(--dimension-space-100)}.ds-chrome-space--lg.sc-ds-bar-nav-h,.ds-chrome-space--lg.sc-ds-bar-nav{--ds-chrome-padding:var(--dimension-space-200);--ds-chrome-gap:var(--dimension-space-200)}.ds-chrome-row.sc-ds-bar-nav-h,.ds-chrome-row.sc-ds-bar-nav,.ds-chrome-column.sc-ds-bar-nav-h,.ds-chrome-column.sc-ds-bar-nav,.ds-chrome-grid.sc-ds-bar-nav-h,.ds-chrome-grid.sc-ds-bar-nav{display:flex;box-sizing:border-box;gap:var(--ds-chrome-gap, var(--dimension-space-100));padding:var(--ds-chrome-padding, var(--dimension-space-100))}.ds-chrome-row.sc-ds-bar-nav-h,.ds-chrome-row.sc-ds-bar-nav{flex-direction:row;align-items:center}.ds-chrome-column.sc-ds-bar-nav-h,.ds-chrome-column.sc-ds-bar-nav{flex-direction:column}.ds-chrome-grid.sc-ds-bar-nav-h,.ds-chrome-grid.sc-ds-bar-nav{display:grid;align-items:center}@media (forced-colors: active){.sc-ds-bar-nav:root,.sc-ds-bar-nav-h,.ds-forced-colors-scope.sc-ds-bar-nav{--ds-forced-color-surface:Canvas;--ds-forced-color-content:CanvasText;--ds-forced-color-control-boundary:ButtonText;--ds-forced-color-selected:Highlight;--ds-forced-color-on-selected:HighlightText;--ds-forced-color-disabled:GrayText}}.sc-ds-bar-nav-h{--ds-focus-ring-width:var(--dimension-stroke-width-025, 2px);--ds-focus-ring-offset:var(--dimension-space-025, 2px);--ds-focus-ring-color:var(--color-interaction-focus)}.ds-focus-ring.sc-ds-bar-nav-h,.ds-focus-ring.sc-ds-bar-nav,.ds-focus-ring-inset.sc-ds-bar-nav-h,.ds-focus-ring-inset.sc-ds-bar-nav{outline:none;-webkit-tap-highlight-color:transparent;touch-action:manipulation}.ds-focus-ring.sc-ds-bar-nav-h:focus-visible,.ds-focus-ring.sc-ds-bar-nav:focus-visible{outline:var(--ds-focus-ring-width) solid var(--ds-focus-ring-color);outline-offset:var(--ds-focus-ring-offset)}.ds-focus-ring.ds-focus-ring--visible.sc-ds-bar-nav-h,.ds-focus-ring.ds-focus-ring--visible.sc-ds-bar-nav{outline:var(--ds-focus-ring-width) solid var(--ds-focus-ring-color);outline-offset:var(--ds-focus-ring-offset)}.ds-focus-ring-inset.sc-ds-bar-nav-h:focus-visible,.ds-focus-ring-inset.sc-ds-bar-nav:focus-visible{outline:none}.ds-focus-ring-inset.sc-ds-bar-nav-h:focus-visible::after,.ds-focus-ring-inset.sc-ds-bar-nav:focus-visible::after{outline:var(--ds-focus-ring-width) solid var(--ds-focus-ring-color);outline-offset:calc(-1 * var(--ds-focus-ring-width))}.ds-focus-ring-inset.ds-focus-ring--visible.sc-ds-bar-nav-h,.ds-focus-ring-inset.ds-focus-ring--visible.sc-ds-bar-nav{outline:none}.ds-focus-ring-inset.ds-focus-ring--visible.sc-ds-bar-nav-h::after,.ds-focus-ring-inset.ds-focus-ring--visible.sc-ds-bar-nav::after{outline:var(--ds-focus-ring-width) solid var(--ds-focus-ring-color);outline-offset:calc(-1 * var(--ds-focus-ring-width))}@media (forced-colors: active){.sc-ds-bar-nav-h{--ds-focus-ring-color:var(--ds-forced-color-selected)}}@media (forced-colors: active){.sc-ds-bar-nav:root,.sc-ds-bar-nav-h,.ds-forced-colors-scope.sc-ds-bar-nav{--ds-forced-color-surface:Canvas;--ds-forced-color-content:CanvasText;--ds-forced-color-control-boundary:ButtonText;--ds-forced-color-selected:Highlight;--ds-forced-color-on-selected:HighlightText;--ds-forced-color-disabled:GrayText}}.ds-control-inactive.sc-ds-bar-nav-h,.ds-control-inactive.sc-ds-bar-nav{opacity:var(--effect-opacity-medium);pointer-events:none;cursor:not-allowed}@media (forced-colors: active){.ds-control-inactive.sc-ds-bar-nav-h,.ds-control-inactive.sc-ds-bar-nav{color:var(--ds-forced-color-disabled);opacity:1}}@media (forced-colors: active){.sc-ds-bar-nav:root,.sc-ds-bar-nav-h,.ds-forced-colors-scope.sc-ds-bar-nav{--ds-forced-color-surface:Canvas;--ds-forced-color-content:CanvasText;--ds-forced-color-control-boundary:ButtonText;--ds-forced-color-selected:Highlight;--ds-forced-color-on-selected:HighlightText;--ds-forced-color-disabled:GrayText}}.ds-interaction-fill.sc-ds-bar-nav-h,.ds-interaction-fill.sc-ds-bar-nav{position:var(--ds-interaction-position, relative);z-index:var(--ds-interaction-z-index, 0);cursor:default;--ds-interaction-hover:var(--color-interaction-hover);--ds-interaction-pressed:var(--color-interaction-pressed);--ds-interaction-active:var(--color-interaction-active-brand);--ds-interaction-border-width:0px;--ds-interaction-border-color:transparent;--ds-interaction-divider-width:0px;--ds-interaction-divider-color:transparent;--ds-interaction-divider-inline-start-width:0px;--ds-interaction-divider-inline-start-color:transparent;--ds-interaction-divider-inline-end-width:0px;--ds-interaction-divider-inline-end-color:transparent}.ds-interaction-fill.sc-ds-bar-nav-h::before,.ds-interaction-fill.sc-ds-bar-nav::before,.ds-interaction-fill.sc-ds-bar-nav-h::after,.ds-interaction-fill.sc-ds-bar-nav::after{content:'';position:absolute;inset:0;border-radius:inherit;background:transparent;pointer-events:none;cursor:inherit;transition:none}.ds-interaction-fill.sc-ds-bar-nav-h::before,.ds-interaction-fill.sc-ds-bar-nav::before{z-index:1}.ds-interaction-fill.sc-ds-bar-nav-h::after,.ds-interaction-fill.sc-ds-bar-nav::after{z-index:3;box-shadow:inset 0 calc(-1 * var(--ds-interaction-divider-width)) 0 var(--ds-interaction-divider-color),     inset var(--ds-interaction-divider-inline-start-width) 0 0       var(--ds-interaction-divider-inline-start-color),     inset calc(-1 * var(--ds-interaction-divider-inline-end-width)) 0 0       var(--ds-interaction-divider-inline-end-color),     inset 0 0 0 var(--ds-interaction-border-width) var(--ds-interaction-border-color)}.ds-interaction-fill--bordered.sc-ds-bar-nav-h,.ds-interaction-fill--bordered.sc-ds-bar-nav{--ds-interaction-border-width:var(--dimension-stroke-width-012);--ds-interaction-border-color:var(--color-border-secondary)}.ds-interaction-fill--selected.sc-ds-bar-nav-h::before,.ds-interaction-fill--selected.sc-ds-bar-nav::before{background:var(--ds-interaction-active)}.ds-interaction-fill--selected.sc-ds-bar-nav-h,.ds-interaction-fill--selected.sc-ds-bar-nav{--ds-interaction-dot-ring:var(--ds-interaction-active)}@media (hover: hover) and (pointer: fine){.ds-interaction-fill.sc-ds-bar-nav-h:hover:not(:disabled)::after,.ds-interaction-fill.sc-ds-bar-nav:hover:not(:disabled)::after{background:var(--ds-interaction-hover)}}.ds-interaction-fill.sc-ds-bar-nav-h:active:not(:disabled)::after,.ds-interaction-fill.sc-ds-bar-nav:active:not(:disabled)::after{background:var(--ds-interaction-pressed)}.ds-interaction-fill--grouped.sc-ds-bar-nav-h::after,.ds-interaction-fill--grouped.sc-ds-bar-nav::after,.ds-interaction-fill--grouped.sc-ds-bar-nav-h:active:not(:disabled)::after,.ds-interaction-fill--grouped.sc-ds-bar-nav:active:not(:disabled)::after{background:var(--ds-interaction-group-fill, transparent)}@media (hover: hover) and (pointer: fine){.ds-interaction-fill--grouped.sc-ds-bar-nav-h:hover:not(:disabled)::after,.ds-interaction-fill--grouped.sc-ds-bar-nav:hover:not(:disabled)::after{background:var(--ds-interaction-group-fill, transparent)}}.ds-interaction-fill--grouped.sc-ds-bar-nav-h,.ds-interaction-fill--grouped.sc-ds-bar-nav{--ds-interaction-divider-width:var(--ds-interaction-group-divider-width, 0px);--ds-interaction-divider-color:var(--ds-interaction-group-divider-color, transparent);--ds-interaction-divider-inline-start-width:var(     --ds-interaction-group-divider-inline-start-width,     0px   );--ds-interaction-divider-inline-start-color:var(     --ds-interaction-group-divider-inline-start-color,     transparent   );--ds-interaction-divider-inline-end-width:var(     --ds-interaction-group-divider-inline-end-width,     0px   );--ds-interaction-divider-inline-end-color:var(     --ds-interaction-group-divider-inline-end-color,     transparent   )}.ds-interaction-fill.sc-ds-bar-nav-h>.ds-interaction-fill__content.sc-ds-bar-nav,.ds-interaction-fill.sc-ds-bar-nav>.ds-interaction-fill__content.sc-ds-bar-nav,.ds-interaction-fill__content.sc-ds-bar-nav{position:relative;z-index:2;cursor:inherit}.ds-interaction-fill--on-faint.sc-ds-bar-nav-h,.ds-interaction-fill--on-faint.sc-ds-bar-nav{--ds-interaction-active:var(--color-interaction-active)}.ds-interaction-fill--on-medium.sc-ds-bar-nav-h,.ds-interaction-fill--on-medium.sc-ds-bar-nav{--ds-interaction-hover:var(--color-interaction-on-medium-background-hover);--ds-interaction-pressed:var(--color-interaction-on-medium-background-pressed);--ds-interaction-active:var(--color-interaction-on-medium-background-active);--ds-focus-ring-color:var(--color-interaction-on-medium-background-focus)}.ds-interaction-fill--on-bold.sc-ds-bar-nav-h,.ds-interaction-fill--on-bold.sc-ds-bar-nav{--ds-interaction-hover:var(--color-interaction-on-bold-background-hover);--ds-interaction-pressed:var(--color-interaction-on-bold-background-pressed);--ds-interaction-active:var(--color-interaction-on-bold-background-active);--ds-focus-ring-color:var(--color-interaction-on-bold-background-focus)}.ds-interaction-fill--on-strong.sc-ds-bar-nav-h,.ds-interaction-fill--on-strong.sc-ds-bar-nav{--ds-interaction-hover:var(--color-interaction-on-strong-background-hover);--ds-interaction-pressed:var(--color-interaction-on-strong-background-pressed);--ds-interaction-active:var(--color-interaction-on-strong-background-active);--ds-focus-ring-color:var(--color-interaction-on-strong-background-focus)}.ds-interaction-fill--on-translucent.sc-ds-bar-nav-h,.ds-interaction-fill--on-translucent.sc-ds-bar-nav{--ds-interaction-hover:var(--color-translucent-interaction-hover);--ds-interaction-pressed:var(--color-translucent-interaction-pressed);--ds-interaction-active:var(--color-translucent-interaction-active-brand);--ds-focus-ring-color:var(--color-translucent-interaction-focus)}.ds-interaction-fill--on-inverted.sc-ds-bar-nav-h,.ds-interaction-fill--on-inverted.sc-ds-bar-nav{--ds-interaction-hover:var(--color-inverted-interaction-hover);--ds-interaction-pressed:var(--color-inverted-interaction-pressed);--ds-interaction-active:var(--color-inverted-interaction-active-brand);--ds-focus-ring-color:var(--color-inverted-interaction-focus)}.ds-interaction-fill--on-media.sc-ds-bar-nav-h,.ds-interaction-fill--on-media.sc-ds-bar-nav{--ds-interaction-hover:var(--color-media-interaction-hover);--ds-interaction-pressed:var(--color-media-interaction-pressed);--ds-interaction-active:var(--color-media-interaction-active);--ds-focus-ring-color:var(--color-media-interaction-focus)}.ds-interaction-fill--on-always-dark.sc-ds-bar-nav-h,.ds-interaction-fill--on-always-dark.sc-ds-bar-nav{--ds-interaction-hover:var(--color-always-dark-interaction-hover);--ds-interaction-pressed:var(--color-always-dark-interaction-pressed);--ds-interaction-active:var(--color-always-dark-interaction-active-brand);--ds-focus-ring-color:var(--color-always-dark-interaction-focus)}.ds-interaction-fill--on-chrome.sc-ds-bar-nav-h,.ds-interaction-fill--on-chrome.sc-ds-bar-nav{--ds-interaction-hover:var(--color-chrome-interaction-hover);--ds-interaction-pressed:var(--color-chrome-interaction-pressed);--ds-interaction-active:var(--color-chrome-interaction-active);--ds-focus-ring-color:var(--color-chrome-interaction-focus)}.ds-interaction-fill--on-navigation.sc-ds-bar-nav-h,.ds-interaction-fill--on-navigation.sc-ds-bar-nav{--ds-interaction-hover:var(--color-navigation-interaction-hover);--ds-interaction-pressed:var(--color-navigation-interaction-pressed);--ds-interaction-active:var(--color-navigation-interaction-active);--ds-focus-ring-color:var(--color-navigation-interaction-focus)}.ds-interaction-fill.ds-interaction-fill--surface-open.sc-ds-bar-nav-h:not(:disabled)::after,.ds-interaction-fill.ds-interaction-fill--surface-open.sc-ds-bar-nav:not(:disabled)::after{background:var(--ds-interaction-pressed)}@media (forced-colors: active){.ds-interaction-fill.sc-ds-bar-nav-h::after,.ds-interaction-fill.sc-ds-bar-nav::after{box-shadow:none;outline:var(--ds-interaction-border-width) solid var(--ds-forced-color-control-boundary);outline-offset:calc(-1 * var(--ds-interaction-border-width))}.ds-interaction-fill--surface-open.sc-ds-bar-nav-h:not(:disabled):not(:focus-visible):not(:focus-within):not(.ds-focus-ring--visible)::after,.ds-interaction-fill--surface-open.sc-ds-bar-nav:not(:disabled):not(:focus-visible):not(:focus-within):not(.ds-focus-ring--visible)::after{outline:var(--dimension-stroke-width-025) dashed var(--ds-forced-color-control-boundary);outline-offset:calc(-1 * var(--dimension-stroke-width-025))}.ds-interaction-fill--selected.sc-ds-bar-nav-h::before,.ds-interaction-fill--selected.sc-ds-bar-nav::before{background:transparent;outline:var(--dimension-stroke-width-025) solid var(--ds-forced-color-selected);outline-offset:calc(-1 * var(--dimension-stroke-width-025))}}@media (forced-colors: active) and (hover: hover) and (pointer: fine){.ds-interaction-fill.sc-ds-bar-nav-h:hover:not(:disabled):not(:focus-visible):not(:focus-within):not(.ds-focus-ring--visible)::after,.ds-interaction-fill.sc-ds-bar-nav:hover:not(:disabled):not(:focus-visible):not(:focus-within):not(.ds-focus-ring--visible)::after{outline-color:var(--ds-forced-color-selected);outline-width:var(--dimension-stroke-width-012)}}.sc-ds-bar-nav-h{display:block}.bar-nav.sc-ds-bar-nav{position:relative;height:var(--dimension-size-600);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-chrome-background-theme);--_bar-nav-border:var(--color-chrome-border-tertiary);--_bar-nav-fg-primary:var(--color-chrome-foreground-primary);--_bar-nav-fg-secondary:var(--color-chrome-foreground-secondary);--_bar-nav-hover:var(--color-chrome-interaction-hover);--_bar-nav-pressed:var(--color-chrome-interaction-pressed);--_bar-nav-focus:var(--color-chrome-interaction-focus);--_bar-nav-dot:var(--color-chrome-foreground-theme);--ds-interaction-hover:var(--_bar-nav-hover);--ds-interaction-pressed:var(--_bar-nav-pressed);--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-chrome-background-theme);--_bar-nav-border:var(--color-chrome-border-tertiary);--_bar-nav-fg-primary:var(--color-chrome-foreground-primary);--_bar-nav-fg-secondary:var(--color-chrome-foreground-secondary);--_bar-nav-hover:var(--color-chrome-interaction-hover);--_bar-nav-pressed:var(--color-chrome-interaction-pressed);--_bar-nav-focus:var(--color-chrome-interaction-focus);--_bar-nav-dot:var(--color-chrome-foreground-theme);--ds-interaction-hover:var(--_bar-nav-hover);--ds-interaction-pressed:var(--_bar-nav-pressed);--ds-focus-ring-color:var(--_bar-nav-focus)}ds-shell-app.sc-ds-bar-nav-h .bar-nav.sc-ds-bar-nav,ds-shell-app .sc-ds-bar-nav-h .bar-nav.sc-ds-bar-nav{background-color:transparent}.bar-nav.sc-ds-bar-nav>.sc-ds-bar-nav:not(.bar-nav__tabs-probe){position:relative;z-index:3}.bar-nav--tabs-collapsed.sc-ds-bar-nav{display:flex;gap:var(--dimension-space-100);align-items:center}.bar-nav__left.sc-ds-bar-nav{position:relative;flex:1 1 0%;min-width:0;width:0;display:flex;align-items:center}.bar-nav__tabs-visible.sc-ds-bar-nav{flex:1;min-width:0;width:100%}.bar-nav__tabs-probe.sc-ds-bar-nav{position:absolute;left:0;top:0;visibility:hidden;pointer-events:none;overflow:visible;width:max-content;max-width:none;z-index:-1}.bar-nav__tabs-probe.sc-ds-bar-nav>div.sc-ds-bar-nav{width:max-content}.bar-nav__tab-list.sc-ds-bar-nav{display:flex;align-items:center;gap:var(--dimension-space-050);position:relative;width:max-content}.bar-nav__tab.sc-ds-bar-nav{display:flex;align-items:center;justify-content:center;gap:var(--ds-control-gap);height:var(--ds-control-height);min-width:var(--ds-control-height);padding:0 var(--ds-control-padding-inline);box-sizing:border-box;border:none;border-radius:var(--ds-control-radius);background-color:transparent;color:var(--_bar-nav-fg-secondary);cursor:default;position:relative;flex-shrink:0;-webkit-user-select:none;user-select:none;transition:color var(--effect-motion-short-2)}.bar-nav__tab.sc-ds-bar-nav::after{content:'';position:absolute;inset:0;border-radius:var(--ds-control-radius);background:transparent;pointer-events:none;cursor:inherit}@media (hover: hover) and (pointer: fine){.bar-nav__tab.sc-ds-bar-nav:hover::after{background:var(--_bar-nav-hover)}}.bar-nav__tab.sc-ds-bar-nav:active::after{background:var(--_bar-nav-pressed)}.bar-nav__tab--selected.sc-ds-bar-nav{color:var(--_bar-nav-fg-primary)}.bar-nav__tab-label.sc-ds-bar-nav{display:inline-flex;align-items:center;white-space:nowrap}.bar-nav__tab-divider.sc-ds-bar-nav{display:flex;align-items:center;justify-content:center;box-sizing:border-box;width:var(--dimension-space-100);height:var(--ds-control-height);padding-block:var(--ds-control-padding-inline);flex-shrink:0;pointer-events:none}.bar-nav__tab-divider-line.sc-ds-bar-nav{width:var(--dimension-stroke-width-012);align-self:stretch;background-color:var(--_bar-nav-border)}.bar-nav__tabs-pending.sc-ds-bar-nav{flex:1;min-width:0;height:var(--ds-control-height);visibility:hidden;pointer-events:none}.bar-nav__overflow-trigger.sc-ds-bar-nav{margin-left:auto}ds-text.bar-nav__heading.sc-ds-bar-nav{display:inline-flex;align-items:center;height:var(--ds-control-height);padding-inline:calc(var(--ds-control-padding-inline) + var(--ds-control-label-inset));-webkit-user-select:none;user-select:none}`;const D=s(class s extends i{constructor(s){super();if(s!==false){this.__registerHost()}this.dsTabChange=r(this,"dsTabChange",7);this.navStyle="dashboard";this.tabs=[];this.value="";this.basePath="";this.currentUrl="";this.moreTabsLabel="More tabs";this.resolvedTabs=[];this.urlDerivedValue="";this.hideTabsForDetailRoute=false;this.tabsCollapsed=false;this.menuOpen=false;this.menuTriggerActive=false;this.tabLayoutCommitted=false;this.visibleTabs=[];this.overflowTabs=[];this.menuInitialFocusVisible=false;this.overflowRovingFocused=false;this.focusedTabId="";this.headerEl=null;this.triggerEl=null;this.menuEl=null;this.visibleTabListEl=null;this.probeTabListEl=null;this.resizeObserver=null;this.hasLoaded=false;this.connectionTasks=new a((()=>this.el.isConnected));this.intrinsicWidthRetryCount=0;this.tabLayoutPendingFrames=0;this.panelNavTransition=new b;this.panelToolsTransition=new b;this.overflowCoalescer=f((()=>{this.updateTabsCollapsed()}));this.chromeTransitionShell=null;this.committedSection="";this.pendingSection="";this.onChromeTransitionStart=s=>{const i=g(s);if(i==="panel-nav"){this.panelNavTransition.enter();return}if(i==="panel-tools"){const i=m(s)??"opening";if(i==="closing"){this.panelToolsTransition.enter()}}};this.onChromeTransitionEnd=s=>{const i=g(s);if(i==="panel-nav"){this.panelNavTransition.exit();if(!this.panelNavTransition.isActive){this.scheduleOverflowCheck()}return}if(i==="panel-tools"){this.panelToolsTransition.exit();this.scheduleOverflowCheck()}};this.handleOverflowFocus=()=>{this.overflowRovingFocused=true};this.handleOverflowBlur=()=>{this.overflowRovingFocused=false}}get effectiveValue(){if(this.currentUrl&&this.basePath){return this.urlDerivedValue}return this.value}get renderedSelectableTabs(){const s=this.hasOverflowTabs?this.visibleTabs:this.resolvedTabs;return o(s)}get hasOverflowTabs(){return this.tabLayoutCommitted&&this.tabsCollapsed&&this.overflowTabs.length>0}syncFocusedTabId(s,i){if(i.some((i=>i.id===s&&!i.isInactive))){this.focusedTabId=s;return}const r=i.find((s=>!s.isInactive));this.focusedTabId=r?.id??""}digestTabsConfig(s){return s.map((s=>d(s)?"|":s.id)).join(",")}resetTabOverflowLayout(){this.tabLayoutCommitted=false;this.tabsCollapsed=false;this.menuOpen=false;this.menuTriggerActive=false;this.menuInitialFocusVisible=false;this.intrinsicWidthRetryCount=0;this.tabLayoutPendingFrames=0;this.visibleTabs=[];this.overflowTabs=[]}onHostPropsChange(){this.applyHostProps()}onSelectionChange(){this.syncFocusedTabId(this.effectiveValue,this.renderedSelectableTabs);this.syncMenuSections();this.scheduleOverflowCheck()}onMenuOpenChange(s){if(this.menuEl){this.menuEl.open=s}}onTabsCollapsedChange(s,i){if(!s){this.menuOpen=false;this.menuTriggerActive=false;this.menuInitialFocusVisible=false;this.menuEl=null}this.scheduleOverflowCheck();if(s){this.connectionTasks.frame((()=>{this.scheduleOverflowCheck()}))}if(s||i===undefined||i===s)return;this.connectionTasks.frame((()=>this.scheduleOverflowCheck()));this.connectionTasks.microtask((()=>this.focusVisibleSelectedTab()))}componentWillLoad(){this.applyHostProps();this.syncFocusedTabId(this.effectiveValue,o(this.resolvedTabs))}connectedCallback(){if(this.hasLoaded)this.connectResources()}componentDidLoad(){this.hasLoaded=true;this.connectResources()}connectResources(){if(!this.el.isConnected)return;this.intrinsicWidthRetryCount=0;this.tabLayoutPendingFrames=0;this.syncHostPropsIfNeeded();this.scheduleDeferredHostPropSync();this.setupOverflowObserver();this.bindChromeTransitionListeners();this.scheduleOverflowCheck()}componentDidRender(){if(this.chromeOverflowPaused()){this.syncMenuAnchor();return}this.scheduleOverflowCheck();this.syncMenuAnchor()}disconnectedCallback(){this.connectionTasks.cancel();this.resizeObserver?.disconnect();this.resizeObserver=null;this.overflowCoalescer.cancel();this.unbindChromeTransitionListeners();this.panelNavTransition.exit();this.panelToolsTransition.exit()}bindChromeTransitionListeners(){this.unbindChromeTransitionListeners();const s=this.el.closest("ds-shell-app");if(!s)return;this.chromeTransitionShell=s;s.addEventListener(u,this.onChromeTransitionStart);s.addEventListener(p,this.onChromeTransitionEnd)}unbindChromeTransitionListeners(){if(!this.chromeTransitionShell)return;this.chromeTransitionShell.removeEventListener(u,this.onChromeTransitionStart);this.chromeTransitionShell.removeEventListener(p,this.onChromeTransitionEnd);this.chromeTransitionShell=null}chromeOverflowPaused(){return this.panelNavTransition.isActive||this.panelToolsTransition.isActive}syncHostPropsIfNeeded(){if(j(this.resolvedTabs,this.tabs)){this.applyHostProps()}else if(this.currentUrl&&this.basePath){this.syncValueFromUrl()}}scheduleDeferredHostPropSync(){let i=s.HOST_PROP_SYNC_BUDGET;const r=()=>{this.syncHostPropsIfNeeded();if(--i>0){this.connectionTasks.frame(r)}};this.connectionTasks.microtask(r)}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.el.isConnected||this.chromeOverflowPaused())return;this.overflowCoalescer.schedule()}getLeftZoneAvailableWidth(){if(!this.headerEl)return 0;const s=getComputedStyle(this.headerEl);const i=(parseFloat(s.paddingLeft)||0)+(parseFloat(s.paddingRight)||0);return Math.max(0,this.headerEl.clientWidth-i)}getTabsIntrinsicWidth(){return this.probeTabListEl?.scrollWidth??0}getHeaderGap(){if(!this.headerEl)return 0;const s=getComputedStyle(this.headerEl);return parseFloat(s.columnGap||s.gap)||0}getOverflowTriggerReserveWidth(){if(!this.triggerEl){return 40}return this.triggerEl.getBoundingClientRect().width+this.getHeaderGap()}getProbeTabMetrics(){const s=this.probeTabListEl;if(!s)return null;const i=Array.from(s.children);const r=i.map((s=>s.getBoundingClientRect().width));if(r.length===0||r.some((s=>s===0)))return null;const e=getComputedStyle(s);const n=parseFloat(e.columnGap||e.gap)||0;const t=r.reduce(((s,i)=>s+i),0);const a=n*Math.max(0,r.length-1);const o=Math.max(0,s.scrollWidth-t-a);return{itemWidths:r,itemGap:n,listExtraWidth:o}}setOverflowTabLayout(s,i){const r=i.length>0;const e=this.digestTabsConfig(s)!==this.digestTabsConfig(this.visibleTabs);const n=this.digestTabsConfig(i)!==this.digestTabsConfig(this.overflowTabs);if(e){this.visibleTabs=s}if(n){this.overflowTabs=i}if(r!==this.tabsCollapsed){this.tabsCollapsed=r;if(!r){this.menuOpen=false;this.menuTriggerActive=false}}this.syncFocusedTabId(this.effectiveValue,o(r?s:this.resolvedTabs))}scheduleIntrinsicWidthRetry(){if(this.intrinsicWidthRetryCount>=s.INTRINSIC_WIDTH_RETRY_MAX)return;this.intrinsicWidthRetryCount++;this.connectionTasks.frame((()=>this.scheduleOverflowCheck()))}forceTabLayoutCommit(s){this.intrinsicWidthRetryCount=0;this.tabLayoutPendingFrames=0;this.setOverflowTabLayout(s?[]:this.resolvedTabs,s?this.resolvedTabs:[]);this.tabLayoutCommitted=true}updateTabsCollapsed(){if(!this.el.isConnected||this.chromeOverflowPaused())return;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 i=this.getProbeTabMetrics();const r=this.getTabsIntrinsicWidth();if(!i||r===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=c(r,this.getLeftZoneAvailableWidth(),this.tabsCollapsed,s.OVERFLOW_HYSTERESIS_PX);if(!e){this.setOverflowTabLayout(this.resolvedTabs,[]);this.tabLayoutCommitted=true;return}const n=l(i.itemWidths,this.getLeftZoneAvailableWidth(),this.getOverflowTriggerReserveWidth(),i.itemGap,i.listExtraWidth);const t=h(this.resolvedTabs.slice(0,n));const a=this.resolvedTabs.slice(t.length);this.setOverflowTabLayout(t,a);this.tabLayoutCommitted=true}syncMenuAnchor(){if(!this.menuEl||!this.triggerEl||!this.hasOverflowTabs)return;this.menuEl.anchor=this.triggerEl;this.syncMenuSections()}handleMenuSelect(s){const i=s.detail;if(i?.value!==undefined){this.selectTab(String(i.value))}this.menuOpen=false;this.menuInitialFocusVisible=false}handleMenuClose(){this.menuOpen=false;this.menuInitialFocusVisible=false}handleMenuAfterClose(){if(!this.menuOpen)this.menuTriggerActive=false}incomingTabs(){return this.tabs??[]}applyHostProps(){const s=this.basePath;const i=s!==""&&this.committedSection!==""&&s!==this.committedSection;if(i){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 i=this.incomingTabs();if(i.length===0){return}this.pendingSection=""}const r=this.incomingTabs();const e=this.digestTabsConfig(r)!==this.digestTabsConfig(this.resolvedTabs);this.resolvedTabs=r;this.syncValueFromUrl();this.committedSection=s;if(e){this.resetTabOverflowLayout()}this.scheduleOverflowCheck()}syncMenuSections(){if(!this.menuEl)return;this.menuEl.sections=v(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:i,hideTabs:r}=S(this.currentUrl,this.basePath,s);this.urlDerivedValue=i;this.hideTabsForDetailRoute=r}selectTab(s){this.value=s;this.dsTabChange.emit(s)}focusVisibleSelectedTab(){const s=this.visibleTabListEl?.querySelector(`[data-tab-id="${this.effectiveValue}"]`);s?.focus({preventScroll:true})}focusVisibleTab(s){this.focusedTabId=s;const i=this.visibleTabListEl?.querySelector(`[data-tab-id="${s}"]`);i?.focus({preventScroll:true})}focusLastVisibleTab(){const s=[...this.renderedSelectableTabs].reverse().find((s=>!s.isInactive));if(s)this.focusVisibleTab(s.id)}findEnabledVisibleTab(s,i){const r=this.renderedSelectableTabs;for(let e=s+i;e>=0&&e<r.length;e+=i){if(!r[e]?.isInactive)return e}return null}handleTabKeyDown(s){const i=this.renderedSelectableTabs;if(!i.length)return;const r=s.target?.getAttribute("data-tab-id");const e=r??this.focusedTabId;if(s.key==="Enter"||s.key===" "){const r=i.find((s=>s.id===e));if(!r||r.isInactive)return;s.preventDefault();this.selectTab(r.id);return}const n=i.findIndex((s=>s.id===e));if(n<0)return;let t;if(s.key==="ArrowRight"){t=this.findEnabledVisibleTab(n,1);if(t===null&&this.hasOverflowTabs){s.preventDefault();this.overflowRovingFocused=true;void this.triggerEl?.setFocus?.();return}}else if(s.key==="ArrowLeft"){t=this.findEnabledVisibleTab(n,-1)}else if(s.key==="Home"){t=i.findIndex((s=>!s.isInactive))}else if(s.key==="End"){const s=[...i].reverse().findIndex((s=>!s.isInactive));t=s<0?null:i.length-1-s}else{return}if(t===null||t<0||t===n)return;s.preventDefault();this.focusVisibleTab(i[t].id)}toggleTabMenu(s){if(this.menuOpen){this.menuOpen=false;this.menuInitialFocusVisible=false;return}if(this.menuEl&&this.triggerEl){this.menuEl.anchor=this.triggerEl;this.menuEl.minWidth="";this.syncMenuSections()}this.menuInitialFocusVisible=s?.focusVisible??false;this.menuTriggerActive=true;this.menuOpen=true}handleTriggerKeyDown(s){if(!this.hasOverflowTabs)return;if(!this.menuOpen){if(s.key==="ArrowLeft"){s.preventDefault();this.overflowRovingFocused=false;this.focusLastVisibleTab();return}if(s.key==="Enter"||s.key===" "){s.preventDefault();this.toggleTabMenu({focusVisible:true})}return}if(s.key==="Escape"){s.preventDefault();this.menuOpen=false;this.menuInitialFocusVisible=false;void this.triggerEl?.setFocus?.()}}renderTabList(s,i){return e("div",{role:"tablist",class:"bar-nav__tab-list","aria-label":this.heading,ref:s=>{if(i){const i=s??null;if(i===this.probeTabListEl)return;this.probeTabListEl=i;if(i){this.intrinsicWidthRetryCount=0;this.tabLayoutPendingFrames=0;this.scheduleOverflowCheck()}}else{this.visibleTabListEl=s??null}},onKeyDown:i?undefined:s=>this.handleTabKeyDown(s),onFocusin:i?undefined:()=>{this.overflowRovingFocused=false}},s.map(((s,r)=>{if(d(s)){return e("div",{class:"bar-nav__tab-divider",key:`divider-${r}`,"aria-hidden":"true"},e("div",{class:"bar-nav__tab-divider-line"}))}const n=s.id===this.effectiveValue;return e("button",{key:s.id,type:"button",role:"tab","data-tab-id":s.id,class:{"bar-nav__tab":true,"bar-nav__tab--selected":n,"ds-control--md":true,"ds-focus-ring-inset":true,"ds-interaction-fill--on-chrome":true,"ds-control-inactive":!!s.isInactive},"aria-selected":n?"true":"false","aria-disabled":s.isInactive?"true":undefined,"aria-controls":s.panelId??undefined,disabled:s.isInactive,tabIndex:!i&&!this.overflowRovingFocused&&s.id===this.focusedTabId?0:-1,onClick:()=>!i&&!s.isInactive&&this.selectTab(s.id),onFocus:()=>{if(!i)this.focusedTabId=s.id}},e("span",{class:{"bar-nav__tab-label":true,"ds-control-label-box":true,"ds-control-label-dot":!!s.dot,"bar-nav__tab-label--dot":!!s.dot}},e("ds-text",{as:"span",variant:"text-body-medium",emphasis:n,color:"inherit"},s.label),s.dot&&e("ds-badge",{class:"bar-nav__tab-dot ds-control-label-dot__badge",variant:"dot",hasRing:false,label:"","aria-hidden":"true",style:{"--_badge-bg":"var(--_bar-nav-dot)"}})))})))}render(){const s=this.basePath===""||this.committedSection===this.basePath;const i=s&&this.resolvedTabs.length>0&&!this.hideTabsForDetailRoute;const r=this.basePath||"no-section";const t=this.hasOverflowTabs?this.visibleTabs:this.resolvedTabs;return e(n,{key:"4fb00b2b9fae2157d7a252c6f7bd4afbb5758dc2"},e("header",{key:"3782712812412a50afe77a467db99848ceb87f5a",class:{"bar-nav":true,"ds-control--md":true,"ds-chrome-row":true,"ds-chrome-space--md":true,"ds-interaction-fill--on-chrome":true,"bar-nav--dashboard":this.navStyle==="dashboard","bar-nav--settings":this.navStyle==="settings","bar-nav--tabs-collapsed":i&&this.hasOverflowTabs},ref:s=>{this.headerEl=s;if(s&&!this.resizeObserver){this.setupOverflowObserver()}}},i&&e("div",{key:"9fb036913b76743e55bf928053fdb2fe4d24a8a3",class:"bar-nav__tabs-probe","aria-hidden":"true",inert:true},e("div",{key:`probe-${r}`},this.renderTabList(this.resolvedTabs,true))),i&&this.tabLayoutCommitted&&t.length>0&&e("div",{key:"1e6cadebf1364710c047a69e3f8c89d5f15056a2",class:"bar-nav__left"},e("div",{key:`visible-${r}`,class:"bar-nav__tabs-visible"},this.renderTabList(t,false))),i&&!this.tabLayoutCommitted&&e("div",{key:"d2377466c93a2430c2ac34232f0ddbef24a00c9e",class:"bar-nav__tabs-pending","aria-hidden":"true"}),!i&&this.heading&&e("ds-text",{key:"87e715c0cf1f3579050d8e8e3808b80ca89d8647",class:"bar-nav__heading",lineTruncation:1,as:"span",variant:"text-body-medium",emphasis:true,color:"inherit",wrap:"nowrap"},this.heading),i&&this.hasOverflowTabs&&e("ds-button-unfilled",{key:"842f03966471e3fbfd2d4725e8550f3cf7fceff1",variant:"icon",class:{"bar-nav__overflow-trigger":true},icon:"ChevronDown",activeFill:false,hasBorder:false,background:"chrome",focusTabIndex:this.overflowRovingFocused?0:-1,ref:s=>{this.triggerEl=s??null},haspopup:"menu",expanded:this.menuOpen,surfaceOpen:this.menuTriggerActive,"aria-label":this.moreTabsLabel,onDsClick:()=>this.toggleTabMenu({focusVisible:false}),onFocusin:this.handleOverflowFocus,onFocusout:this.handleOverflowBlur,onKeyDown:s=>this.handleTriggerKeyDown(s)})),i&&this.hasOverflowTabs&&e("ds-menu",{key:"c127ce890de39fae58f21a5862531e394a9de8de",ref:s=>{this.menuEl=s??null},open:this.menuOpen,sections:v(this.overflowTabs,this.effectiveValue),side:"bottom",align:"end",sideOffset:"calc(var(--dimension-space-100) + var(--dimension-space-050))",initialFocusVisible:this.menuInitialFocusVisible,onDsSelect:s=>this.handleMenuSelect(s),onDsClose:()=>this.handleMenuClose(),onDsAfterClose:()=>this.handleMenuAfterClose()}))}get el(){return this}static get watchers(){return{tabs:[{onHostPropsChange:0}],currentUrl:[{onHostPropsChange:0}],basePath:[{onHostPropsChange:0}],value:[{onSelectionChange:0}],urlDerivedValue:[{onSelectionChange:0}],menuOpen:[{onMenuOpenChange:0}],tabsCollapsed:[{onTabsCollapsedChange:0}]}}static get style(){return E()}},[2,"ds-bar-nav",{navStyle:[513,"nav-style"],tabs:[16],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],menuTriggerActive:[32],tabLayoutCommitted:[32],visibleTabs:[32],overflowTabs:[32],menuInitialFocusVisible:[32],overflowRovingFocused:[32],focusedTabId:[32],committedSection:[32],pendingSection:[32]},undefined,{tabs:[{onHostPropsChange:0}],currentUrl:[{onHostPropsChange:0}],basePath:[{onHostPropsChange:0}],value:[{onSelectionChange:0}],urlDerivedValue:[{onSelectionChange:0}],menuOpen:[{onMenuOpenChange:0}],tabsCollapsed:[{onTabsCollapsedChange:0}]}]);D.HOST_PROP_SYNC_BUDGET=8;D.INTRINSIC_WIDTH_RETRY_MAX=3;D.TAB_LAYOUT_COMMIT_MAX_FRAMES=16;D.OVERFLOW_HYSTERESIS_PX=8;function L(){if(typeof customElements==="undefined"){return}const s=["ds-bar-nav","ds-badge","ds-button-unfilled","ds-icon","ds-loader","ds-menu","ds-swatch-picker","ds-switch","ds-tag","ds-text","ds-tooltip"];s.forEach((s=>{switch(s){case"ds-bar-nav":if(!customElements.get(t(s))){customElements.define(t(s),D)}break;case"ds-badge":if(!customElements.get(t(s))){w()}break;case"ds-button-unfilled":if(!customElements.get(t(s))){_()}break;case"ds-icon":if(!customElements.get(t(s))){y()}break;case"ds-loader":if(!customElements.get(t(s))){k()}break;case"ds-menu":if(!customElements.get(t(s))){x()}break;case"ds-swatch-picker":if(!customElements.get(t(s))){C()}break;case"ds-switch":if(!customElements.get(t(s))){T()}break;case"ds-tag":if(!customElements.get(t(s))){z()}break;case"ds-text":if(!customElements.get(t(s))){H()}break;case"ds-tooltip":if(!customElements.get(t(s))){O()}break}}))}L();export{D as B,L as d};
-//# sourceMappingURL=p-B9Q7fXxW.js.map
+import{p as s,H as i,c as r,h as e,a as n,t}from"./index.js";import{C as a}from"./p-DlsjHRU3.js";import{g as o,i as d}from"./p-BQq26pt9.js";import{t as c,v as l,a as h,b as v}from"./p-02k7d7BH.js";import{C as b,c as f,a as u,b as p,r as g,d as m}from"./p-B0uO3-Dp.js";import{d as w}from"./p-CzTJAO2J.js";import{d as _}from"./p-CC4X8rpT.js";import{d as y}from"./p-BVsVUnAw.js";import{d as k}from"./p-0XTyQNRG.js";import{d as x}from"./p-529k8euH.js";import{d as C}from"./p-Ch00yccW.js";import{d as T}from"./p-CAARHqjE.js";import{d as z}from"./p-M9pOLcyK.js";import{d as H}from"./p-CTAF7SkL.js";import{d as O}from"./p-BkKdzYZP.js";function S(s,i,r){if(!s||!i){return{value:"",hideTabs:false}}if(s!==i&&!s.startsWith(`${i}/`)){return{value:"",hideTabs:false}}const e=s.slice(i.length);const n=e.startsWith("/")?e.slice(1).split("/")[0]:"";const t=o(r);if(!n){return{value:t[0]?.id??"",hideTabs:false}}const a=t.find((s=>s.id===n));if(a){return{value:a.id,hideTabs:false}}return{value:"",hideTabs:true}}function j(s,i){return s.length===0&&(i?.length??0)>0}const E=()=>`.sc-ds-bar-nav-h,.sc-ds-bar-nav:where(.ds-table),.sc-ds-bar-nav:where(.tooltip-popup),.sc-ds-bar-nav:where(.ds-radius){--ds-radius-control:var(--dimension-radius-025);--ds-radius-card:var(--dimension-radius-050);--ds-radius-modal:var(--dimension-radius-050);--ds-radius-menu:var(--dimension-radius-075);--ds-radius-tooltip-control:var(--dimension-radius-025);--ds-radius-tooltip-menu:var(--dimension-radius-075);--ds-radius-table:var(--dimension-radius-050)}.ds-control--lg.sc-ds-bar-nav,.ds-control--lg.sc-ds-bar-nav-h,.ds-control--md.sc-ds-bar-nav-h,.ds-control--md.sc-ds-bar-nav,.ds-control--sm.sc-ds-bar-nav-h,.ds-control--sm.sc-ds-bar-nav,.ds-control--xs.sc-ds-bar-nav-h,.ds-control--xs.sc-ds-bar-nav{--ds-control-radius:var(--ds-radius-control)}.ds-control--lg.sc-ds-bar-nav-h,.ds-control--lg.sc-ds-bar-nav{--ds-control-height:var(--dimension-size-500);--ds-control-icon:var(--dimension-iconography-lg);--ds-control-padding-inline:var(--dimension-space-100);--ds-control-label-inset:var(--dimension-space-050);--ds-control-gap:var(--dimension-space-050)}.ds-control--md.sc-ds-bar-nav-h,.ds-control--md.sc-ds-bar-nav{--ds-control-height:var(--dimension-size-400);--ds-control-icon:var(--dimension-iconography-md);--ds-control-padding-inline:var(--dimension-space-075);--ds-control-label-inset:var(--dimension-space-025);--ds-control-gap:var(--dimension-space-050)}.ds-control--sm.sc-ds-bar-nav-h,.ds-control--sm.sc-ds-bar-nav{--ds-control-height:var(--dimension-size-300);--ds-control-icon:var(--dimension-iconography-sm);--ds-control-padding-inline:var(--dimension-space-050);--ds-control-label-inset:var(--dimension-space-025);--ds-control-gap:var(--dimension-space-025)}.ds-control--xs.sc-ds-bar-nav-h,.ds-control--xs.sc-ds-bar-nav{--ds-control-height:var(--dimension-size-200);--ds-control-icon:var(--dimension-iconography-xs);--ds-control-padding-inline:var(--dimension-space-025);--ds-control-label-inset:var(--dimension-space-025);--ds-control-gap:0}.ds-control-frame.sc-ds-bar-nav{display:inline-flex;align-items:center;box-sizing:border-box;height:var(--ds-control-height, var(--dimension-size-400));padding-inline:var(--ds-control-padding-inline, var(--dimension-space-075));gap:var(--ds-control-gap, var(--dimension-space-050));border-radius:var(--ds-control-radius, var(--dimension-radius-025))}.ds-control-section-heading.sc-ds-bar-nav{display:flex;align-items:center;box-sizing:border-box;height:var(--ds-control-height, var(--dimension-size-400));padding-inline:calc(     var(--ds-control-padding-inline, var(--dimension-space-075)) +       var(--ds-control-label-inset, var(--dimension-space-025))   )}.ds-control-icon-box.sc-ds-bar-nav{display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;width:var(--ds-control-icon, var(--dimension-iconography-md));height:var(--ds-control-icon, var(--dimension-iconography-md))}.ds-control-label-box.sc-ds-bar-nav{min-width:0;padding-inline:var(--ds-control-label-inset, var(--dimension-space-025))}.ds-control-label-dot.sc-ds-bar-nav{position:relative;padding-inline-end:calc(     var(--ds-control-label-inset, var(--dimension-space-025)) +       var(--ds-control-gap, var(--dimension-space-050))   )}.ds-control-label-dot__badge.sc-ds-bar-nav{position:absolute;inset-block-start:0;inset-inline-end:0;pointer-events:none}.ds-chrome-space--sm.sc-ds-bar-nav-h,.ds-chrome-space--sm.sc-ds-bar-nav{--ds-chrome-padding:var(--ds-chrome-space-sm-padding, var(--dimension-space-050));--ds-chrome-gap:var(--dimension-space-050)}.ds-chrome-space--md.sc-ds-bar-nav-h,.ds-chrome-space--md.sc-ds-bar-nav{--ds-chrome-padding:var(--dimension-space-100);--ds-chrome-gap:var(--dimension-space-100)}.ds-chrome-space--lg.sc-ds-bar-nav-h,.ds-chrome-space--lg.sc-ds-bar-nav{--ds-chrome-padding:var(--dimension-space-200);--ds-chrome-gap:var(--dimension-space-200)}.ds-chrome-row.sc-ds-bar-nav-h,.ds-chrome-row.sc-ds-bar-nav,.ds-chrome-column.sc-ds-bar-nav-h,.ds-chrome-column.sc-ds-bar-nav,.ds-chrome-grid.sc-ds-bar-nav-h,.ds-chrome-grid.sc-ds-bar-nav{display:flex;box-sizing:border-box;gap:var(--ds-chrome-gap, var(--dimension-space-100));padding:var(--ds-chrome-padding, var(--dimension-space-100))}.ds-chrome-row.sc-ds-bar-nav-h,.ds-chrome-row.sc-ds-bar-nav{flex-direction:row;align-items:center}.ds-chrome-column.sc-ds-bar-nav-h,.ds-chrome-column.sc-ds-bar-nav{flex-direction:column}.ds-chrome-grid.sc-ds-bar-nav-h,.ds-chrome-grid.sc-ds-bar-nav{display:grid;align-items:center}@media (forced-colors: active){.sc-ds-bar-nav:root,.sc-ds-bar-nav-h,.ds-forced-colors-scope.sc-ds-bar-nav{--ds-forced-color-surface:Canvas;--ds-forced-color-content:CanvasText;--ds-forced-color-control-boundary:ButtonText;--ds-forced-color-selected:Highlight;--ds-forced-color-on-selected:HighlightText;--ds-forced-color-disabled:GrayText}}.sc-ds-bar-nav-h{--ds-focus-ring-width:var(--dimension-stroke-width-025, 2px);--ds-focus-ring-offset:var(--dimension-space-025, 2px);--ds-focus-ring-color:var(--color-interaction-focus)}.ds-focus-ring.sc-ds-bar-nav-h,.ds-focus-ring.sc-ds-bar-nav,.ds-focus-ring-inset.sc-ds-bar-nav-h,.ds-focus-ring-inset.sc-ds-bar-nav{outline:none;-webkit-tap-highlight-color:transparent;touch-action:manipulation}.ds-focus-ring.sc-ds-bar-nav-h:focus-visible,.ds-focus-ring.sc-ds-bar-nav:focus-visible{outline:var(--ds-focus-ring-width) solid var(--ds-focus-ring-color);outline-offset:var(--ds-focus-ring-offset)}.ds-focus-ring.ds-focus-ring--visible.sc-ds-bar-nav-h,.ds-focus-ring.ds-focus-ring--visible.sc-ds-bar-nav{outline:var(--ds-focus-ring-width) solid var(--ds-focus-ring-color);outline-offset:var(--ds-focus-ring-offset)}.ds-focus-ring-inset.sc-ds-bar-nav-h:focus-visible,.ds-focus-ring-inset.sc-ds-bar-nav:focus-visible{outline:none}.ds-focus-ring-inset.sc-ds-bar-nav-h:focus-visible::after,.ds-focus-ring-inset.sc-ds-bar-nav:focus-visible::after{outline:var(--ds-focus-ring-width) solid var(--ds-focus-ring-color);outline-offset:calc(-1 * var(--ds-focus-ring-width))}.ds-focus-ring-inset.ds-focus-ring--visible.sc-ds-bar-nav-h,.ds-focus-ring-inset.ds-focus-ring--visible.sc-ds-bar-nav{outline:none}.ds-focus-ring-inset.ds-focus-ring--visible.sc-ds-bar-nav-h::after,.ds-focus-ring-inset.ds-focus-ring--visible.sc-ds-bar-nav::after{outline:var(--ds-focus-ring-width) solid var(--ds-focus-ring-color);outline-offset:calc(-1 * var(--ds-focus-ring-width))}@media (forced-colors: active){.sc-ds-bar-nav-h{--ds-focus-ring-color:var(--ds-forced-color-selected)}}@media (forced-colors: active){.sc-ds-bar-nav:root,.sc-ds-bar-nav-h,.ds-forced-colors-scope.sc-ds-bar-nav{--ds-forced-color-surface:Canvas;--ds-forced-color-content:CanvasText;--ds-forced-color-control-boundary:ButtonText;--ds-forced-color-selected:Highlight;--ds-forced-color-on-selected:HighlightText;--ds-forced-color-disabled:GrayText}}.ds-control-inactive.sc-ds-bar-nav-h,.ds-control-inactive.sc-ds-bar-nav{opacity:var(--effect-opacity-medium);pointer-events:none;cursor:not-allowed}@media (forced-colors: active){.ds-control-inactive.sc-ds-bar-nav-h,.ds-control-inactive.sc-ds-bar-nav{color:var(--ds-forced-color-disabled);opacity:1}}@media (forced-colors: active){.sc-ds-bar-nav:root,.sc-ds-bar-nav-h,.ds-forced-colors-scope.sc-ds-bar-nav{--ds-forced-color-surface:Canvas;--ds-forced-color-content:CanvasText;--ds-forced-color-control-boundary:ButtonText;--ds-forced-color-selected:Highlight;--ds-forced-color-on-selected:HighlightText;--ds-forced-color-disabled:GrayText}}.ds-interaction-fill.sc-ds-bar-nav-h,.ds-interaction-fill.sc-ds-bar-nav{position:var(--ds-interaction-position, relative);z-index:var(--ds-interaction-z-index, 0);cursor:default;--ds-interaction-hover:var(--color-interaction-hover);--ds-interaction-pressed:var(--color-interaction-pressed);--ds-interaction-active:var(--color-interaction-active-brand);--ds-interaction-border-width:0px;--ds-interaction-border-color:transparent;--ds-interaction-divider-width:0px;--ds-interaction-divider-color:transparent;--ds-interaction-divider-inline-start-width:0px;--ds-interaction-divider-inline-start-color:transparent;--ds-interaction-divider-inline-end-width:0px;--ds-interaction-divider-inline-end-color:transparent}.ds-interaction-fill.sc-ds-bar-nav-h::before,.ds-interaction-fill.sc-ds-bar-nav::before,.ds-interaction-fill.sc-ds-bar-nav-h::after,.ds-interaction-fill.sc-ds-bar-nav::after{content:'';position:absolute;inset:0;border-radius:inherit;background:transparent;pointer-events:none;cursor:inherit;transition:none}.ds-interaction-fill.sc-ds-bar-nav-h::before,.ds-interaction-fill.sc-ds-bar-nav::before{z-index:1}.ds-interaction-fill.sc-ds-bar-nav-h::after,.ds-interaction-fill.sc-ds-bar-nav::after{z-index:3;box-shadow:inset 0 calc(-1 * var(--ds-interaction-divider-width)) 0 var(--ds-interaction-divider-color),     inset var(--ds-interaction-divider-inline-start-width) 0 0       var(--ds-interaction-divider-inline-start-color),     inset calc(-1 * var(--ds-interaction-divider-inline-end-width)) 0 0       var(--ds-interaction-divider-inline-end-color),     inset 0 0 0 var(--ds-interaction-border-width) var(--ds-interaction-border-color)}.ds-interaction-fill--bordered.sc-ds-bar-nav-h,.ds-interaction-fill--bordered.sc-ds-bar-nav{--ds-interaction-border-width:var(--dimension-stroke-width-012);--ds-interaction-border-color:var(--color-border-secondary)}.ds-interaction-fill--selected.sc-ds-bar-nav-h::before,.ds-interaction-fill--selected.sc-ds-bar-nav::before{background:var(--ds-interaction-active)}.ds-interaction-fill--selected.sc-ds-bar-nav-h,.ds-interaction-fill--selected.sc-ds-bar-nav{--ds-interaction-dot-ring:var(--ds-interaction-active)}@media (hover: hover) and (pointer: fine){.ds-interaction-fill.sc-ds-bar-nav-h:hover:not(:disabled)::after,.ds-interaction-fill.sc-ds-bar-nav:hover:not(:disabled)::after{background:var(--ds-interaction-hover)}}.ds-interaction-fill.sc-ds-bar-nav-h:active:not(:disabled)::after,.ds-interaction-fill.sc-ds-bar-nav:active:not(:disabled)::after{background:var(--ds-interaction-pressed)}.ds-interaction-fill--grouped.sc-ds-bar-nav-h::after,.ds-interaction-fill--grouped.sc-ds-bar-nav::after,.ds-interaction-fill--grouped.sc-ds-bar-nav-h:active:not(:disabled)::after,.ds-interaction-fill--grouped.sc-ds-bar-nav:active:not(:disabled)::after{background:var(--ds-interaction-group-fill, transparent)}@media (hover: hover) and (pointer: fine){.ds-interaction-fill--grouped.sc-ds-bar-nav-h:hover:not(:disabled)::after,.ds-interaction-fill--grouped.sc-ds-bar-nav:hover:not(:disabled)::after{background:var(--ds-interaction-group-fill, transparent)}}.ds-interaction-fill--grouped.sc-ds-bar-nav-h,.ds-interaction-fill--grouped.sc-ds-bar-nav{--ds-interaction-divider-width:var(--ds-interaction-group-divider-width, 0px);--ds-interaction-divider-color:var(--ds-interaction-group-divider-color, transparent);--ds-interaction-divider-inline-start-width:var(     --ds-interaction-group-divider-inline-start-width,     0px   );--ds-interaction-divider-inline-start-color:var(     --ds-interaction-group-divider-inline-start-color,     transparent   );--ds-interaction-divider-inline-end-width:var(     --ds-interaction-group-divider-inline-end-width,     0px   );--ds-interaction-divider-inline-end-color:var(     --ds-interaction-group-divider-inline-end-color,     transparent   )}.ds-interaction-fill.sc-ds-bar-nav-h>.ds-interaction-fill__content.sc-ds-bar-nav,.ds-interaction-fill.sc-ds-bar-nav>.ds-interaction-fill__content.sc-ds-bar-nav,.ds-interaction-fill__content.sc-ds-bar-nav{position:relative;z-index:2;cursor:inherit}.ds-interaction-fill--on-faint.sc-ds-bar-nav-h,.ds-interaction-fill--on-faint.sc-ds-bar-nav{--ds-interaction-active:var(--color-interaction-active)}.ds-interaction-fill--on-medium.sc-ds-bar-nav-h,.ds-interaction-fill--on-medium.sc-ds-bar-nav{--ds-interaction-hover:var(--color-interaction-on-medium-background-hover);--ds-interaction-pressed:var(--color-interaction-on-medium-background-pressed);--ds-interaction-active:var(--color-interaction-on-medium-background-active);--ds-focus-ring-color:var(--color-interaction-on-medium-background-focus)}.ds-interaction-fill--on-bold.sc-ds-bar-nav-h,.ds-interaction-fill--on-bold.sc-ds-bar-nav{--ds-interaction-hover:var(--color-interaction-on-bold-background-hover);--ds-interaction-pressed:var(--color-interaction-on-bold-background-pressed);--ds-interaction-active:var(--color-interaction-on-bold-background-active);--ds-focus-ring-color:var(--color-interaction-on-bold-background-focus)}.ds-interaction-fill--on-strong.sc-ds-bar-nav-h,.ds-interaction-fill--on-strong.sc-ds-bar-nav{--ds-interaction-hover:var(--color-interaction-on-strong-background-hover);--ds-interaction-pressed:var(--color-interaction-on-strong-background-pressed);--ds-interaction-active:var(--color-interaction-on-strong-background-active);--ds-focus-ring-color:var(--color-interaction-on-strong-background-focus)}.ds-interaction-fill--on-translucent.sc-ds-bar-nav-h,.ds-interaction-fill--on-translucent.sc-ds-bar-nav{--ds-interaction-hover:var(--color-translucent-interaction-hover);--ds-interaction-pressed:var(--color-translucent-interaction-pressed);--ds-interaction-active:var(--color-translucent-interaction-active-brand);--ds-focus-ring-color:var(--color-translucent-interaction-focus)}.ds-interaction-fill--on-inverted.sc-ds-bar-nav-h,.ds-interaction-fill--on-inverted.sc-ds-bar-nav{--ds-interaction-hover:var(--color-inverted-interaction-hover);--ds-interaction-pressed:var(--color-inverted-interaction-pressed);--ds-interaction-active:var(--color-inverted-interaction-active-brand);--ds-focus-ring-color:var(--color-inverted-interaction-focus)}.ds-interaction-fill--on-media.sc-ds-bar-nav-h,.ds-interaction-fill--on-media.sc-ds-bar-nav{--ds-interaction-hover:var(--color-media-interaction-hover);--ds-interaction-pressed:var(--color-media-interaction-pressed);--ds-interaction-active:var(--color-media-interaction-active);--ds-focus-ring-color:var(--color-media-interaction-focus)}.ds-interaction-fill--on-always-dark.sc-ds-bar-nav-h,.ds-interaction-fill--on-always-dark.sc-ds-bar-nav{--ds-interaction-hover:var(--color-always-dark-interaction-hover);--ds-interaction-pressed:var(--color-always-dark-interaction-pressed);--ds-interaction-active:var(--color-always-dark-interaction-active-brand);--ds-focus-ring-color:var(--color-always-dark-interaction-focus)}.ds-interaction-fill--on-chrome.sc-ds-bar-nav-h,.ds-interaction-fill--on-chrome.sc-ds-bar-nav{--ds-interaction-hover:var(--color-chrome-interaction-hover);--ds-interaction-pressed:var(--color-chrome-interaction-pressed);--ds-interaction-active:var(--color-chrome-interaction-active);--ds-focus-ring-color:var(--color-chrome-interaction-focus)}.ds-interaction-fill--on-navigation.sc-ds-bar-nav-h,.ds-interaction-fill--on-navigation.sc-ds-bar-nav{--ds-interaction-hover:var(--color-navigation-interaction-hover);--ds-interaction-pressed:var(--color-navigation-interaction-pressed);--ds-interaction-active:var(--color-navigation-interaction-active);--ds-focus-ring-color:var(--color-navigation-interaction-focus)}.ds-interaction-fill.ds-interaction-fill--surface-open.sc-ds-bar-nav-h:not(:disabled)::after,.ds-interaction-fill.ds-interaction-fill--surface-open.sc-ds-bar-nav:not(:disabled)::after{background:var(--ds-interaction-pressed)}@media (forced-colors: active){.ds-interaction-fill.sc-ds-bar-nav-h::after,.ds-interaction-fill.sc-ds-bar-nav::after{box-shadow:none;outline:var(--ds-interaction-border-width) solid var(--ds-forced-color-control-boundary);outline-offset:calc(-1 * var(--ds-interaction-border-width))}.ds-interaction-fill--surface-open.sc-ds-bar-nav-h:not(:disabled):not(:focus-visible):not(:focus-within):not(.ds-focus-ring--visible)::after,.ds-interaction-fill--surface-open.sc-ds-bar-nav:not(:disabled):not(:focus-visible):not(:focus-within):not(.ds-focus-ring--visible)::after{outline:var(--dimension-stroke-width-025) dashed var(--ds-forced-color-control-boundary);outline-offset:calc(-1 * var(--dimension-stroke-width-025))}.ds-interaction-fill--selected.sc-ds-bar-nav-h::before,.ds-interaction-fill--selected.sc-ds-bar-nav::before{background:transparent;outline:var(--dimension-stroke-width-025) solid var(--ds-forced-color-selected);outline-offset:calc(-1 * var(--dimension-stroke-width-025))}}@media (forced-colors: active) and (hover: hover) and (pointer: fine){.ds-interaction-fill.sc-ds-bar-nav-h:hover:not(:disabled):not(:focus-visible):not(:focus-within):not(.ds-focus-ring--visible)::after,.ds-interaction-fill.sc-ds-bar-nav:hover:not(:disabled):not(:focus-visible):not(:focus-within):not(.ds-focus-ring--visible)::after{outline-color:var(--ds-forced-color-selected);outline-width:var(--dimension-stroke-width-012)}}.sc-ds-bar-nav-h{display:block}.bar-nav.sc-ds-bar-nav{position:relative;height:var(--dimension-size-600);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-chrome-background-theme);--_bar-nav-border:var(--color-chrome-border-tertiary);--_bar-nav-fg-primary:var(--color-chrome-foreground-primary);--_bar-nav-fg-secondary:var(--color-chrome-foreground-secondary);--_bar-nav-hover:var(--color-chrome-interaction-hover);--_bar-nav-pressed:var(--color-chrome-interaction-pressed);--_bar-nav-focus:var(--color-chrome-interaction-focus);--_bar-nav-dot:var(--color-chrome-foreground-theme);--ds-interaction-hover:var(--_bar-nav-hover);--ds-interaction-pressed:var(--_bar-nav-pressed);--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-chrome-background-theme);--_bar-nav-border:var(--color-chrome-border-tertiary);--_bar-nav-fg-primary:var(--color-chrome-foreground-primary);--_bar-nav-fg-secondary:var(--color-chrome-foreground-secondary);--_bar-nav-hover:var(--color-chrome-interaction-hover);--_bar-nav-pressed:var(--color-chrome-interaction-pressed);--_bar-nav-focus:var(--color-chrome-interaction-focus);--_bar-nav-dot:var(--color-chrome-foreground-theme);--ds-interaction-hover:var(--_bar-nav-hover);--ds-interaction-pressed:var(--_bar-nav-pressed);--ds-focus-ring-color:var(--_bar-nav-focus)}ds-shell-app.sc-ds-bar-nav-h .bar-nav.sc-ds-bar-nav,ds-shell-app .sc-ds-bar-nav-h .bar-nav.sc-ds-bar-nav{background-color:transparent}.bar-nav.sc-ds-bar-nav>.sc-ds-bar-nav:not(.bar-nav__tabs-probe){position:relative;z-index:3}.bar-nav--tabs-collapsed.sc-ds-bar-nav{display:flex;gap:var(--dimension-space-100);align-items:center}.bar-nav__left.sc-ds-bar-nav{position:relative;flex:1 1 0%;min-width:0;width:0;display:flex;align-items:center}.bar-nav__tabs-visible.sc-ds-bar-nav{flex:1;min-width:0;width:100%}.bar-nav__tabs-probe.sc-ds-bar-nav{position:absolute;left:0;top:0;visibility:hidden;pointer-events:none;overflow:visible;width:max-content;max-width:none;z-index:-1}.bar-nav__tabs-probe.sc-ds-bar-nav>div.sc-ds-bar-nav{width:max-content}.bar-nav__tab-list.sc-ds-bar-nav{display:flex;align-items:center;gap:var(--dimension-space-050);position:relative;width:max-content}.bar-nav__tab.sc-ds-bar-nav{display:flex;align-items:center;justify-content:center;gap:var(--ds-control-gap);height:var(--ds-control-height);min-width:var(--ds-control-height);padding:0 var(--ds-control-padding-inline);box-sizing:border-box;border:none;border-radius:var(--ds-control-radius);background-color:transparent;color:var(--_bar-nav-fg-secondary);cursor:default;position:relative;flex-shrink:0;-webkit-user-select:none;user-select:none;transition:color var(--effect-motion-short-2)}.bar-nav__tab.sc-ds-bar-nav::after{content:'';position:absolute;inset:0;border-radius:var(--ds-control-radius);background:transparent;pointer-events:none;cursor:inherit}@media (hover: hover) and (pointer: fine){.bar-nav__tab.sc-ds-bar-nav:hover::after{background:var(--_bar-nav-hover)}}.bar-nav__tab.sc-ds-bar-nav:active::after{background:var(--_bar-nav-pressed)}.bar-nav__tab--selected.sc-ds-bar-nav{color:var(--_bar-nav-fg-primary)}.bar-nav__tab-label.sc-ds-bar-nav{display:inline-flex;align-items:center;white-space:nowrap}.bar-nav__tab-divider.sc-ds-bar-nav{display:flex;align-items:center;justify-content:center;box-sizing:border-box;width:var(--dimension-space-100);height:var(--ds-control-height);padding-block:var(--ds-control-padding-inline);flex-shrink:0;pointer-events:none}.bar-nav__tab-divider-line.sc-ds-bar-nav{width:var(--dimension-stroke-width-012);align-self:stretch;background-color:var(--_bar-nav-border)}.bar-nav__tabs-pending.sc-ds-bar-nav{flex:1;min-width:0;height:var(--ds-control-height);visibility:hidden;pointer-events:none}.bar-nav__overflow-trigger.sc-ds-bar-nav{margin-left:auto}ds-text.bar-nav__heading.sc-ds-bar-nav{display:inline-flex;align-items:center;height:var(--ds-control-height);padding-inline:calc(var(--ds-control-padding-inline) + var(--ds-control-label-inset));-webkit-user-select:none;user-select:none}`;const D=s(class s extends i{constructor(s){super();if(s!==false){this.__registerHost()}this.dsTabChange=r(this,"dsTabChange",7);this.navStyle="dashboard";this.tabs=[];this.value="";this.basePath="";this.currentUrl="";this.moreTabsLabel="More tabs";this.resolvedTabs=[];this.urlDerivedValue="";this.hideTabsForDetailRoute=false;this.tabsCollapsed=false;this.menuOpen=false;this.menuTriggerActive=false;this.tabLayoutCommitted=false;this.visibleTabs=[];this.overflowTabs=[];this.menuInitialFocusVisible=false;this.overflowRovingFocused=false;this.focusedTabId="";this.headerEl=null;this.triggerEl=null;this.menuEl=null;this.visibleTabListEl=null;this.probeTabListEl=null;this.resizeObserver=null;this.hasLoaded=false;this.connectionTasks=new a((()=>this.el.isConnected));this.intrinsicWidthRetryCount=0;this.tabLayoutPendingFrames=0;this.panelNavTransition=new b;this.panelToolsTransition=new b;this.overflowCoalescer=f((()=>{this.updateTabsCollapsed()}));this.chromeTransitionShell=null;this.committedSection="";this.pendingSection="";this.onChromeTransitionStart=s=>{const i=g(s);if(i==="panel-nav"){this.panelNavTransition.enter();return}if(i==="panel-tools"){const i=m(s)??"opening";if(i==="closing"){this.panelToolsTransition.enter()}}};this.onChromeTransitionEnd=s=>{const i=g(s);if(i==="panel-nav"){this.panelNavTransition.exit();if(!this.panelNavTransition.isActive){this.scheduleOverflowCheck()}return}if(i==="panel-tools"){this.panelToolsTransition.exit();this.scheduleOverflowCheck()}};this.handleOverflowFocus=()=>{this.overflowRovingFocused=true};this.handleOverflowBlur=()=>{this.overflowRovingFocused=false}}get effectiveValue(){if(this.currentUrl&&this.basePath){return this.urlDerivedValue}return this.value}get renderedSelectableTabs(){const s=this.hasOverflowTabs?this.visibleTabs:this.resolvedTabs;return o(s)}get hasOverflowTabs(){return this.tabLayoutCommitted&&this.tabsCollapsed&&this.overflowTabs.length>0}syncFocusedTabId(s,i){if(i.some((i=>i.id===s&&!i.isInactive))){this.focusedTabId=s;return}const r=i.find((s=>!s.isInactive));this.focusedTabId=r?.id??""}digestTabsConfig(s){return s.map((s=>d(s)?"|":s.id)).join(",")}resetTabOverflowLayout(){this.tabLayoutCommitted=false;this.tabsCollapsed=false;this.menuOpen=false;this.menuTriggerActive=false;this.menuInitialFocusVisible=false;this.intrinsicWidthRetryCount=0;this.tabLayoutPendingFrames=0;this.visibleTabs=[];this.overflowTabs=[]}onHostPropsChange(){this.applyHostProps()}onSelectionChange(){this.syncFocusedTabId(this.effectiveValue,this.renderedSelectableTabs);this.syncMenuSections();this.scheduleOverflowCheck()}onMenuOpenChange(s){if(this.menuEl){this.menuEl.open=s}}onTabsCollapsedChange(s,i){if(!s){this.menuOpen=false;this.menuTriggerActive=false;this.menuInitialFocusVisible=false;this.menuEl=null}this.scheduleOverflowCheck();if(s){this.connectionTasks.frame((()=>{this.scheduleOverflowCheck()}))}if(s||i===undefined||i===s)return;this.connectionTasks.frame((()=>this.scheduleOverflowCheck()));this.connectionTasks.microtask((()=>this.focusVisibleSelectedTab()))}componentWillLoad(){this.applyHostProps();this.syncFocusedTabId(this.effectiveValue,o(this.resolvedTabs))}connectedCallback(){if(this.hasLoaded)this.connectResources()}componentDidLoad(){this.hasLoaded=true;this.connectResources()}connectResources(){if(!this.el.isConnected)return;this.intrinsicWidthRetryCount=0;this.tabLayoutPendingFrames=0;this.syncHostPropsIfNeeded();this.scheduleDeferredHostPropSync();this.setupOverflowObserver();this.bindChromeTransitionListeners();this.scheduleOverflowCheck()}componentDidRender(){if(this.chromeOverflowPaused()){this.syncMenuAnchor();return}this.scheduleOverflowCheck();this.syncMenuAnchor()}disconnectedCallback(){this.connectionTasks.cancel();this.resizeObserver?.disconnect();this.resizeObserver=null;this.overflowCoalescer.cancel();this.unbindChromeTransitionListeners();this.panelNavTransition.exit();this.panelToolsTransition.exit()}bindChromeTransitionListeners(){this.unbindChromeTransitionListeners();const s=this.el.closest("ds-shell-app");if(!s)return;this.chromeTransitionShell=s;s.addEventListener(u,this.onChromeTransitionStart);s.addEventListener(p,this.onChromeTransitionEnd)}unbindChromeTransitionListeners(){if(!this.chromeTransitionShell)return;this.chromeTransitionShell.removeEventListener(u,this.onChromeTransitionStart);this.chromeTransitionShell.removeEventListener(p,this.onChromeTransitionEnd);this.chromeTransitionShell=null}chromeOverflowPaused(){return this.panelNavTransition.isActive||this.panelToolsTransition.isActive}syncHostPropsIfNeeded(){if(j(this.resolvedTabs,this.tabs)){this.applyHostProps()}else if(this.currentUrl&&this.basePath){this.syncValueFromUrl()}}scheduleDeferredHostPropSync(){let i=s.HOST_PROP_SYNC_BUDGET;const r=()=>{this.syncHostPropsIfNeeded();if(--i>0){this.connectionTasks.frame(r)}};this.connectionTasks.microtask(r)}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.el.isConnected||this.chromeOverflowPaused())return;this.overflowCoalescer.schedule()}getLeftZoneAvailableWidth(){if(!this.headerEl)return 0;const s=getComputedStyle(this.headerEl);const i=(parseFloat(s.paddingLeft)||0)+(parseFloat(s.paddingRight)||0);return Math.max(0,this.headerEl.clientWidth-i)}getTabsIntrinsicWidth(){return this.probeTabListEl?.scrollWidth??0}getHeaderGap(){if(!this.headerEl)return 0;const s=getComputedStyle(this.headerEl);return parseFloat(s.columnGap||s.gap)||0}getOverflowTriggerReserveWidth(){if(!this.triggerEl){return 40}return this.triggerEl.getBoundingClientRect().width+this.getHeaderGap()}getProbeTabMetrics(){const s=this.probeTabListEl;if(!s)return null;const i=Array.from(s.children);const r=i.map((s=>s.getBoundingClientRect().width));if(r.length===0||r.some((s=>s===0)))return null;const e=getComputedStyle(s);const n=parseFloat(e.columnGap||e.gap)||0;const t=r.reduce(((s,i)=>s+i),0);const a=n*Math.max(0,r.length-1);const o=Math.max(0,s.scrollWidth-t-a);return{itemWidths:r,itemGap:n,listExtraWidth:o}}setOverflowTabLayout(s,i){const r=i.length>0;const e=this.digestTabsConfig(s)!==this.digestTabsConfig(this.visibleTabs);const n=this.digestTabsConfig(i)!==this.digestTabsConfig(this.overflowTabs);if(e){this.visibleTabs=s}if(n){this.overflowTabs=i}if(r!==this.tabsCollapsed){this.tabsCollapsed=r;if(!r){this.menuOpen=false;this.menuTriggerActive=false}}this.syncFocusedTabId(this.effectiveValue,o(r?s:this.resolvedTabs))}scheduleIntrinsicWidthRetry(){if(this.intrinsicWidthRetryCount>=s.INTRINSIC_WIDTH_RETRY_MAX)return;this.intrinsicWidthRetryCount++;this.connectionTasks.frame((()=>this.scheduleOverflowCheck()))}forceTabLayoutCommit(s){this.intrinsicWidthRetryCount=0;this.tabLayoutPendingFrames=0;this.setOverflowTabLayout(s?[]:this.resolvedTabs,s?this.resolvedTabs:[]);this.tabLayoutCommitted=true}updateTabsCollapsed(){if(!this.el.isConnected||this.chromeOverflowPaused())return;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 i=this.getProbeTabMetrics();const r=this.getTabsIntrinsicWidth();if(!i||r===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=c(r,this.getLeftZoneAvailableWidth(),this.tabsCollapsed,s.OVERFLOW_HYSTERESIS_PX);if(!e){this.setOverflowTabLayout(this.resolvedTabs,[]);this.tabLayoutCommitted=true;return}const n=l(i.itemWidths,this.getLeftZoneAvailableWidth(),this.getOverflowTriggerReserveWidth(),i.itemGap,i.listExtraWidth);const t=h(this.resolvedTabs.slice(0,n));const a=this.resolvedTabs.slice(t.length);this.setOverflowTabLayout(t,a);this.tabLayoutCommitted=true}syncMenuAnchor(){if(!this.menuEl||!this.triggerEl||!this.hasOverflowTabs)return;this.menuEl.anchor=this.triggerEl;this.syncMenuSections()}handleMenuSelect(s){const i=s.detail;if(i?.value!==undefined){this.selectTab(String(i.value))}this.menuOpen=false;this.menuInitialFocusVisible=false}handleMenuClose(){this.menuOpen=false;this.menuInitialFocusVisible=false}handleMenuAfterClose(){if(!this.menuOpen)this.menuTriggerActive=false}incomingTabs(){return this.tabs??[]}applyHostProps(){const s=this.basePath;const i=s!==""&&this.committedSection!==""&&s!==this.committedSection;if(i){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 i=this.incomingTabs();if(i.length===0){return}this.pendingSection=""}const r=this.incomingTabs();const e=this.digestTabsConfig(r)!==this.digestTabsConfig(this.resolvedTabs);this.resolvedTabs=r;this.syncValueFromUrl();this.committedSection=s;if(e){this.resetTabOverflowLayout()}this.scheduleOverflowCheck()}syncMenuSections(){if(!this.menuEl)return;this.menuEl.sections=v(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:i,hideTabs:r}=S(this.currentUrl,this.basePath,s);this.urlDerivedValue=i;this.hideTabsForDetailRoute=r}selectTab(s){this.value=s;this.dsTabChange.emit(s)}focusVisibleSelectedTab(){const s=this.visibleTabListEl?.querySelector(`[data-tab-id="${this.effectiveValue}"]`);s?.focus({preventScroll:true})}focusVisibleTab(s){this.focusedTabId=s;const i=this.visibleTabListEl?.querySelector(`[data-tab-id="${s}"]`);i?.focus({preventScroll:true})}focusLastVisibleTab(){const s=[...this.renderedSelectableTabs].reverse().find((s=>!s.isInactive));if(s)this.focusVisibleTab(s.id)}findEnabledVisibleTab(s,i){const r=this.renderedSelectableTabs;for(let e=s+i;e>=0&&e<r.length;e+=i){if(!r[e]?.isInactive)return e}return null}handleTabKeyDown(s){const i=this.renderedSelectableTabs;if(!i.length)return;const r=s.target?.getAttribute("data-tab-id");const e=r??this.focusedTabId;if(s.key==="Enter"||s.key===" "){const r=i.find((s=>s.id===e));if(!r||r.isInactive)return;s.preventDefault();this.selectTab(r.id);return}const n=i.findIndex((s=>s.id===e));if(n<0)return;let t;if(s.key==="ArrowRight"){t=this.findEnabledVisibleTab(n,1);if(t===null&&this.hasOverflowTabs){s.preventDefault();this.overflowRovingFocused=true;void this.triggerEl?.setFocus?.();return}}else if(s.key==="ArrowLeft"){t=this.findEnabledVisibleTab(n,-1)}else if(s.key==="Home"){t=i.findIndex((s=>!s.isInactive))}else if(s.key==="End"){const s=[...i].reverse().findIndex((s=>!s.isInactive));t=s<0?null:i.length-1-s}else{return}if(t===null||t<0||t===n)return;s.preventDefault();this.focusVisibleTab(i[t].id)}toggleTabMenu(s){if(this.menuOpen){this.menuOpen=false;this.menuInitialFocusVisible=false;return}if(this.menuEl&&this.triggerEl){this.menuEl.anchor=this.triggerEl;this.menuEl.minWidth="";this.syncMenuSections()}this.menuInitialFocusVisible=s?.focusVisible??false;this.menuTriggerActive=true;this.menuOpen=true}handleTriggerKeyDown(s){if(!this.hasOverflowTabs)return;if(!this.menuOpen){if(s.key==="ArrowLeft"){s.preventDefault();this.overflowRovingFocused=false;this.focusLastVisibleTab();return}if(s.key==="Enter"||s.key===" "){s.preventDefault();this.toggleTabMenu({focusVisible:true})}return}if(s.key==="Escape"){s.preventDefault();this.menuOpen=false;this.menuInitialFocusVisible=false;void this.triggerEl?.setFocus?.()}}renderTabList(s,i){return e("div",{role:"tablist",class:"bar-nav__tab-list","aria-label":this.heading,ref:s=>{if(i){const i=s??null;if(i===this.probeTabListEl)return;this.probeTabListEl=i;if(i){this.intrinsicWidthRetryCount=0;this.tabLayoutPendingFrames=0;this.scheduleOverflowCheck()}}else{this.visibleTabListEl=s??null}},onKeyDown:i?undefined:s=>this.handleTabKeyDown(s),onFocusin:i?undefined:()=>{this.overflowRovingFocused=false}},s.map(((s,r)=>{if(d(s)){return e("div",{class:"bar-nav__tab-divider",key:`divider-${r}`,"aria-hidden":"true"},e("div",{class:"bar-nav__tab-divider-line"}))}const n=s.id===this.effectiveValue;return e("button",{key:s.id,type:"button",role:"tab","data-tab-id":s.id,class:{"bar-nav__tab":true,"bar-nav__tab--selected":n,"ds-control--md":true,"ds-focus-ring-inset":true,"ds-interaction-fill--on-chrome":true,"ds-control-inactive":!!s.isInactive},"aria-selected":n?"true":"false","aria-disabled":s.isInactive?"true":undefined,"aria-controls":s.panelId??undefined,disabled:s.isInactive,tabIndex:!i&&!this.overflowRovingFocused&&s.id===this.focusedTabId?0:-1,onClick:()=>!i&&!s.isInactive&&this.selectTab(s.id),onFocus:()=>{if(!i)this.focusedTabId=s.id}},e("span",{class:{"bar-nav__tab-label":true,"ds-control-label-box":true,"ds-control-label-dot":!!s.dot,"bar-nav__tab-label--dot":!!s.dot}},e("ds-text",{as:"span",variant:"text-body-medium",emphasis:n,color:"inherit"},s.label),s.dot&&e("ds-badge",{class:"bar-nav__tab-dot ds-control-label-dot__badge",variant:"dot",hasRing:false,label:"","aria-hidden":"true",style:{"--_badge-bg":"var(--_bar-nav-dot)"}})))})))}render(){const s=this.basePath===""||this.committedSection===this.basePath;const i=s&&this.resolvedTabs.length>0&&!this.hideTabsForDetailRoute;const r=this.basePath||"no-section";const t=this.hasOverflowTabs?this.visibleTabs:this.resolvedTabs;return e(n,{key:"4fb00b2b9fae2157d7a252c6f7bd4afbb5758dc2"},e("header",{key:"3782712812412a50afe77a467db99848ceb87f5a",class:{"bar-nav":true,"ds-control--md":true,"ds-chrome-row":true,"ds-chrome-space--md":true,"ds-interaction-fill--on-chrome":true,"bar-nav--dashboard":this.navStyle==="dashboard","bar-nav--settings":this.navStyle==="settings","bar-nav--tabs-collapsed":i&&this.hasOverflowTabs},ref:s=>{this.headerEl=s;if(s&&!this.resizeObserver){this.setupOverflowObserver()}}},i&&e("div",{key:"9fb036913b76743e55bf928053fdb2fe4d24a8a3",class:"bar-nav__tabs-probe","aria-hidden":"true",inert:true},e("div",{key:`probe-${r}`},this.renderTabList(this.resolvedTabs,true))),i&&this.tabLayoutCommitted&&t.length>0&&e("div",{key:"1e6cadebf1364710c047a69e3f8c89d5f15056a2",class:"bar-nav__left"},e("div",{key:`visible-${r}`,class:"bar-nav__tabs-visible"},this.renderTabList(t,false))),i&&!this.tabLayoutCommitted&&e("div",{key:"d2377466c93a2430c2ac34232f0ddbef24a00c9e",class:"bar-nav__tabs-pending","aria-hidden":"true"}),!i&&this.heading&&e("ds-text",{key:"87e715c0cf1f3579050d8e8e3808b80ca89d8647",class:"bar-nav__heading",lineTruncation:1,as:"span",variant:"text-body-medium",emphasis:true,color:"inherit",wrap:"nowrap"},this.heading),i&&this.hasOverflowTabs&&e("ds-button-unfilled",{key:"842f03966471e3fbfd2d4725e8550f3cf7fceff1",variant:"icon",class:{"bar-nav__overflow-trigger":true},icon:"ChevronDown",activeFill:false,hasBorder:false,background:"chrome",focusTabIndex:this.overflowRovingFocused?0:-1,ref:s=>{this.triggerEl=s??null},haspopup:"menu",expanded:this.menuOpen,surfaceOpen:this.menuTriggerActive,"aria-label":this.moreTabsLabel,onDsClick:()=>this.toggleTabMenu({focusVisible:false}),onFocusin:this.handleOverflowFocus,onFocusout:this.handleOverflowBlur,onKeyDown:s=>this.handleTriggerKeyDown(s)})),i&&this.hasOverflowTabs&&e("ds-menu",{key:"c127ce890de39fae58f21a5862531e394a9de8de",ref:s=>{this.menuEl=s??null},open:this.menuOpen,sections:v(this.overflowTabs,this.effectiveValue),side:"bottom",align:"end",sideOffset:"calc(var(--dimension-space-100) + var(--dimension-space-050))",initialFocusVisible:this.menuInitialFocusVisible,onDsSelect:s=>this.handleMenuSelect(s),onDsClose:()=>this.handleMenuClose(),onDsAfterClose:()=>this.handleMenuAfterClose()}))}get el(){return this}static get watchers(){return{tabs:[{onHostPropsChange:0}],currentUrl:[{onHostPropsChange:0}],basePath:[{onHostPropsChange:0}],value:[{onSelectionChange:0}],urlDerivedValue:[{onSelectionChange:0}],menuOpen:[{onMenuOpenChange:0}],tabsCollapsed:[{onTabsCollapsedChange:0}]}}static get style(){return E()}},[2,"ds-bar-nav",{navStyle:[513,"nav-style"],tabs:[16],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],menuTriggerActive:[32],tabLayoutCommitted:[32],visibleTabs:[32],overflowTabs:[32],menuInitialFocusVisible:[32],overflowRovingFocused:[32],focusedTabId:[32],committedSection:[32],pendingSection:[32]},undefined,{tabs:[{onHostPropsChange:0}],currentUrl:[{onHostPropsChange:0}],basePath:[{onHostPropsChange:0}],value:[{onSelectionChange:0}],urlDerivedValue:[{onSelectionChange:0}],menuOpen:[{onMenuOpenChange:0}],tabsCollapsed:[{onTabsCollapsedChange:0}]}]);D.HOST_PROP_SYNC_BUDGET=8;D.INTRINSIC_WIDTH_RETRY_MAX=3;D.TAB_LAYOUT_COMMIT_MAX_FRAMES=16;D.OVERFLOW_HYSTERESIS_PX=8;function F(){if(typeof customElements==="undefined"){return}const s=["ds-bar-nav","ds-badge","ds-button-unfilled","ds-icon","ds-loader","ds-menu","ds-swatch-picker","ds-switch","ds-tag","ds-text","ds-tooltip"];s.forEach((s=>{switch(s){case"ds-bar-nav":if(!customElements.get(t(s))){customElements.define(t(s),D)}break;case"ds-badge":if(!customElements.get(t(s))){w()}break;case"ds-button-unfilled":if(!customElements.get(t(s))){_()}break;case"ds-icon":if(!customElements.get(t(s))){y()}break;case"ds-loader":if(!customElements.get(t(s))){k()}break;case"ds-menu":if(!customElements.get(t(s))){x()}break;case"ds-swatch-picker":if(!customElements.get(t(s))){C()}break;case"ds-switch":if(!customElements.get(t(s))){T()}break;case"ds-tag":if(!customElements.get(t(s))){z()}break;case"ds-text":if(!customElements.get(t(s))){H()}break;case"ds-tooltip":if(!customElements.get(t(s))){O()}break}}))}F();export{D as B,F as d};
+//# sourceMappingURL=p-4qKHg502.js.map