@ds-mo/ui 1.4.0 → 1.6.0

package/dist/components/p-BvmooLHV.js

@@ -0,0 +1,2 @@
+function n(n,t){const r=n.trim().split(/\s+/)[0]??"";const e=parseFloat(r);if(Number.isNaN(e))return t;if(/ms\s*$/.test(r))return e;if(/s\s*$/.test(r))return e*1e3;return e}function t(n){const t=n.match(/^var\(\s*(--[^),]+)/);if(t)return t[1].trim();if(n.startsWith("--"))return n.trim();return null}function r(r,e){if(typeof document==="undefined")return e;const u=t(r);if(!u)return n(r,e);const o=getComputedStyle(document.documentElement).getPropertyValue(u).trim();return n(o,e)}function e(e,u){if(typeof e==="number")return e;const o=typeof e==="string"&&e.trim()?e.trim():u;const f=t(o);if(f){return r(o,r(u,200))}return n(o,r(u,200))}export{n as p,e as r};
+//# sourceMappingURL=p-BvmooLHV.js.map

package/dist/components/p-BvmooLHV.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["parseCssTimeMs","value","fallback","firstToken","trim","split","num","parseFloat","Number","isNaN","test","extractCssCustomProp","ref","varMatch","match","startsWith","readTokenTimeMs","token","document","prop","raw","getComputedStyle","documentElement","getPropertyValue","resolveCssTimeMs","fallbackToken"],"sources":["src/wc/utils/resolve-css-time-ms.ts"],"sourcesContent":["/** Parse a CSS <time> value (or motion shorthand's first token) to milliseconds. */\nexport function parseCssTimeMs(value: string, fallback: number): number {\n  const firstToken = value.trim().split(/\\s+/)[0] ?? '';\n  const num = parseFloat(firstToken);\n  if (Number.isNaN(num)) return fallback;\n  if (/ms\\s*$/.test(firstToken)) return num;\n  if (/s\\s*$/.test(firstToken)) return num * 1000;\n  return num;\n}\n\nfunction extractCssCustomProp(ref: string): string | null {\n  const varMatch = ref.match(/^var\\(\\s*(--[^),]+)/);\n  if (varMatch) return varMatch[1].trim();\n  if (ref.startsWith('--')) return ref.trim();\n  return null;\n}\n\nfunction readTokenTimeMs(token: string, fallback: number): number {\n  if (typeof document === 'undefined') return fallback;\n\n  const prop = extractCssCustomProp(token);\n  if (!prop) return parseCssTimeMs(token, fallback);\n\n  const raw = getComputedStyle(document.documentElement).getPropertyValue(prop).trim();\n  return parseCssTimeMs(raw, fallback);\n}\n\n/**\n * Resolve a duration to milliseconds for JS timers aligned with CSS motion tokens.\n * Accepts numbers (ms), raw times (`200ms`, `0.75s`), or `var(--effect-*)` references.\n */\nexport function resolveCssTimeMs(\n  value: number | string | undefined,\n  fallbackToken: string,\n): number {\n  if (typeof value === 'number') return value;\n\n  const token = typeof value === 'string' && value.trim() ? value.trim() : fallbackToken;\n  const prop = extractCssCustomProp(token);\n\n  if (prop) {\n    return readTokenTimeMs(token, readTokenTimeMs(fallbackToken, 200));\n  }\n\n  return parseCssTimeMs(token, readTokenTimeMs(fallbackToken, 200));\n}\n"],"mappings":"AACM,SAAUA,EAAeC,EAAeC,GAC5C,MAAMC,EAAaF,EAAMG,OAAOC,MAAM,OAAO,IAAM,GACnD,MAAMC,EAAMC,WAAWJ,GACvB,GAAIK,OAAOC,MAAMH,GAAM,OAAOJ,EAC9B,GAAI,SAASQ,KAAKP,GAAa,OAAOG,EACtC,GAAI,QAAQI,KAAKP,GAAa,OAAOG,EAAM,IAC3C,OAAOA,CACT,CAEA,SAASK,EAAqBC,GAC5B,MAAMC,EAAWD,EAAIE,MAAM,uBAC3B,GAAID,EAAU,OAAOA,EAAS,GAAGT,OACjC,GAAIQ,EAAIG,WAAW,MAAO,OAAOH,EAAIR,OACrC,OAAO,IACT,CAEA,SAASY,EAAgBC,EAAef,GACtC,UAAWgB,WAAa,YAAa,OAAOhB,EAE5C,MAAMiB,EAAOR,EAAqBM,GAClC,IAAKE,EAAM,OAAOnB,EAAeiB,EAAOf,GAExC,MAAMkB,EAAMC,iBAAiBH,SAASI,iBAAiBC,iBAAiBJ,GAAMf,OAC9E,OAAOJ,EAAeoB,EAAKlB,EAC7B,CAMM,SAAUsB,EACdvB,EACAwB,GAEA,UAAWxB,IAAU,SAAU,OAAOA,EAEtC,MAAMgB,SAAehB,IAAU,UAAYA,EAAMG,OAASH,EAAMG,OAASqB,EACzE,MAAMN,EAAOR,EAAqBM,GAElC,GAAIE,EAAM,CACR,OAAOH,EAAgBC,EAAOD,EAAgBS,EAAe,K,CAG/D,OAAOzB,EAAeiB,EAAOD,EAAgBS,EAAe,KAC9D,Q","ignoreList":[]}

package/dist/components/p-C4WbCXBj.js

@@ -0,0 +1,2 @@
+import{p as e,H as t,c as s,h as i,a as n,t as o}from"./index.js";import{T as r}from"./p-BRju0sEC.js";import{r as a}from"./p-CYJ-de0u.js";import{r as d}from"./p-BvmooLHV.js";const c=()=>`.menu-popup.sc-ds-menu{box-sizing:border-box;display:flex;flex-direction:column;min-width:var(--dimension-menu-width-xs);max-width:var(--dimension-panel-width-lg);overflow:hidden;background-color:var(--color-background-primary);border-radius:var(--dimension-radius-075);box-shadow:var(--effect-shadow-elevated-floating);animation:menuFadeIn var(--effect-motion-short-2) forwards;backface-visibility:hidden;will-change:transform}.menu-popup.sc-ds-menu::after{content:'';position:absolute;inset:0;border-radius:inherit;pointer-events:none;box-shadow:var(--effect-highlight-elevated-floating)}.menu-popup--closing.sc-ds-menu{animation:menuFadeOut var(--effect-motion-short-3) forwards}@keyframes menuFadeIn{from{opacity:0;transform:inherit scale(0.97)}to{opacity:1}}@keyframes menuFadeOut{from{opacity:1}to{opacity:0}}.menu-section.sc-ds-menu{display:flex;flex-direction:column;gap:var(--dimension-space-050);padding:var(--dimension-space-050)}.menu-section--divided.sc-ds-menu{border-bottom:var(--dimension-stroke-width-015) solid var(--color-border-tertiary)}.section-header.sc-ds-menu{display:flex;align-items:center;height:var(--dimension-size-400);padding:var(--dimension-space-050) var(--dimension-space-075);-webkit-user-select:none;user-select:none}.section-label.sc-ds-menu{color:var(--color-foreground-secondary)}.menu-item.sc-ds-menu{display:flex;align-items:center;gap:var(--dimension-space-050);position:relative;width:100%;min-height:var(--dimension-size-400);padding:var(--dimension-space-075);box-sizing:border-box;border:none;border-radius:var(--dimension-radius-025);background:transparent;cursor:pointer;-webkit-user-select:none;user-select:none;text-align:left;color:inherit;--_hover-bg:var(--color-interaction-hover);--_pressed-bg:var(--color-interaction-pressed);--_selected-bg:var(--color-interaction-active)}.menu-item.sc-ds-menu:has(.menu-item__subtext){align-items:flex-start}.menu-item.sc-ds-menu::after{content:'';position:absolute;inset:0;border-radius:inherit;background:transparent;pointer-events:none;transition:none}.menu-item--selected.sc-ds-menu::after{background:var(--_selected-bg);transition:none}.menu-item.sc-ds-menu:hover:not(:disabled):not(.menu-item--selected)::after,.menu-item--focused.sc-ds-menu:not(:disabled):not(.menu-item--selected)::after{background:var(--_hover-bg);transition:none}.menu-item.sc-ds-menu:active:not(:disabled)::after{background:var(--_pressed-bg);transition:none}.menu-item.sc-ds-menu:focus-visible{outline:var(--dimension-stroke-width-025) solid var(--color-interaction-focus);outline-offset:var(--dimension-space-025)}.menu-item--inactive.sc-ds-menu{opacity:0.5;cursor:not-allowed;pointer-events:none}.menu-item--destructive.sc-ds-menu .menu-item__label.sc-ds-menu{color:var(--color-foreground-bold-negative) !important}.menu-item__content.sc-ds-menu{position:relative;z-index:1;display:flex;flex:1;flex-direction:column;gap:var(--dimension-space-025);min-width:0}.menu-item__label.sc-ds-menu{color:var(--color-foreground-secondary)}.menu-item.sc-ds-menu:has(.menu-item__subtext) .menu-item__label.sc-ds-menu,.menu-item--selected.sc-ds-menu .menu-item__label.sc-ds-menu{color:var(--color-foreground-primary)}.menu-item__subtext.sc-ds-menu{color:var(--color-foreground-secondary);line-height:1.4}.menu-item__toggle.sc-ds-menu{position:relative;z-index:1;flex-shrink:0;width:calc(var(--dimension-size-400) + var(--dimension-size-050));height:var(--dimension-size-250);border-radius:var(--dimension-radius-125);background-color:var(--color-background-translucent);transition:background-color var(--effect-motion-short-2)}.menu-item__toggle--on.sc-ds-menu{background-color:var(--color-background-medium-brand)}.menu-item__toggle-thumb.sc-ds-menu{position:absolute;top:var(--dimension-space-025);left:var(--dimension-space-025);width:var(--dimension-size-200);height:var(--dimension-size-200);border-radius:50%;background-color:var(--color-foreground-on-bold-background-primary);transition:transform var(--effect-motion-short-2)}.menu-item__toggle--on.sc-ds-menu .menu-item__toggle-thumb.sc-ds-menu{transform:translateX(var(--dimension-offset-200, 16px))}`;const u=e(class e extends t{constructor(e){super();if(e!==false){this.__registerHost()}this.dsClose=s(this,"dsClose");this.dsSelect=s(this,"dsSelect");this.open=false;this.items=[];this.sections=[];this.side="bottom";this.align="start";this.sideOffset=r.space050;this.alignOffset=0;this.shouldRender=false;this.closing=false;this.pos={x:0,y:0};this.focusedIndex=0;this.positionReady=false;this.clickOutsideHandler=null;this.scrollResizeHandler=null;this.closeTimer=null;this.itemEls=[]}componentDidLoad(){if(this.open)this.onOpenChange(true)}disconnectedCallback(){this.teardownListeners()}onOpenChange(e){if(e){this.shouldRender=true;this.closing=false;this.positionReady=false;requestAnimationFrame((()=>{this.calculatePosition();this.positionReady=true;this.focusInitialItem();this.setupListeners()}))}else if(this.shouldRender){this.closing=true;this.teardownListeners();this.closeTimer=setTimeout((()=>{this.shouldRender=false;this.closing=false;this.closeTimer=null}),this.closeAnimationMs)}}onPositionPropsChange(){if(this.open)this.calculatePosition()}get viewportPadPx(){return a(r.space050,r.space050)}get sideOffsetPx(){return a(this.sideOffset,r.space050)}get alignOffsetPx(){return a(this.alignOffset,0)}get popupFallbackWidthPx(){return a(r.menuWidthXs,r.menuWidthXs)}get popupFallbackHeightPx(){return a(r.menuFallbackHeight,r.menuFallbackHeight)}get closeAnimationMs(){return d(r.motionShort3,r.animationDurationShort3)}get resolvedAnchor(){if(this.anchor)return this.anchor;if(this.anchorId)return document.getElementById(this.anchorId);return null}get activeSections(){if(this.sections.length>0)return this.sections;if(this.items.length>0)return[{items:this.items}];return[]}get flatItems(){return this.activeSections.flatMap((e=>e.items))}calculatePosition(){const e=this.resolvedAnchor;if(!e)return;const t=this.el.querySelector(".menu-popup");if(!t)return;const s=e.getBoundingClientRect();const i=t.offsetWidth||this.popupFallbackWidthPx;const n=t.offsetHeight||this.popupFallbackHeightPx;const o=this.sideOffsetPx;const r=this.alignOffsetPx;const a=this.viewportPadPx;let d=0,c=0;switch(this.side){case"top":c=s.top-n-o;d=this.align==="start"?s.left+r:this.align==="end"?s.right-i+r:s.left+s.width/2-i/2+r;break;case"bottom":c=s.bottom+o;d=this.align==="start"?s.left+r:this.align==="end"?s.right-i+r:s.left+s.width/2-i/2+r;break;case"left":d=s.left-i-o;c=this.align==="start"?s.top+r:this.align==="end"?s.bottom-n+r:s.top+s.height/2-n/2+r;break;case"right":d=s.right+o;c=this.align==="start"?s.top+r:this.align==="end"?s.bottom-n+r:s.top+s.height/2-n/2+r;break}this.pos={x:Math.min(Math.max(d,a),window.innerWidth-i-a),y:Math.min(Math.max(c,a),window.innerHeight-n-a)}}focusInitialItem(){const e=this.flatItems;const t=e.findIndex((e=>e.isSelected&&!e.isInactive));const s=e.findIndex((e=>!e.isInactive));this.focusedIndex=t>=0?t:s>=0?s:0;requestAnimationFrame((()=>{const e=this.el.querySelectorAll(".menu-item");e[this.focusedIndex]?.focus()}))}setupListeners(){this.clickOutsideHandler=e=>{const t=e.target;const s=this.el.querySelector(".menu-popup");const i=this.resolvedAnchor;if(s?.contains(t)||i?.contains(t))return;this.close()};this.scrollResizeHandler=()=>this.calculatePosition();document.addEventListener("mousedown",this.clickOutsideHandler,true);window.addEventListener("scroll",this.scrollResizeHandler,true);window.addEventListener("resize",this.scrollResizeHandler)}teardownListeners(){if(this.clickOutsideHandler){document.removeEventListener("mousedown",this.clickOutsideHandler,true);this.clickOutsideHandler=null}if(this.scrollResizeHandler){window.removeEventListener("scroll",this.scrollResizeHandler,true);window.removeEventListener("resize",this.scrollResizeHandler);this.scrollResizeHandler=null}if(this.closeTimer){clearTimeout(this.closeTimer);this.closeTimer=null}}close(){this.resolvedAnchor?.focus();this.dsClose.emit();this.open=false}handleKeyDown(e){if(!this.open)return;const t=this.flatItems;const s=t.map(((e,t)=>({it:e,i:t}))).filter((({it:e})=>!e.isInactive)).map((({i:e})=>e));if(!s.length)return;const i=s.indexOf(this.focusedIndex);const n=i<0?0:i;switch(e.key){case"ArrowDown":e.preventDefault();e.stopPropagation();this.focusedIndex=s[(n+1)%s.length];this.focusItem(this.focusedIndex);break;case"ArrowUp":e.preventDefault();e.stopPropagation();this.focusedIndex=s[(n-1+s.length)%s.length];this.focusItem(this.focusedIndex);break;case"Home":e.preventDefault();e.stopPropagation();this.focusedIndex=s[0];this.focusItem(this.focusedIndex);break;case"End":e.preventDefault();e.stopPropagation();this.focusedIndex=s[s.length-1];this.focusItem(this.focusedIndex);break;case"Escape":e.preventDefault();this.close();break;case"Tab":e.preventDefault();this.close();break}}focusItem(e){const t=this.el.querySelectorAll(".menu-item");t[e]?.focus()}handleItemClick(e){if(e.isInactive)return;this.dsSelect.emit(e);this.close()}render(){if(!this.shouldRender)return i(n,{style:{display:"contents"}});const e=this.activeSections;let t=0;const s={position:"fixed",left:"0",top:"0",transform:`translate(${Math.round(this.pos.x)}px, ${Math.round(this.pos.y)}px)`,zIndex:"9998",visibility:this.positionReady?"visible":"hidden"};if(this.menuWidth)s["width"]=this.menuWidth;if(this.minWidth)s["min-width"]=this.minWidth;return i(n,{style:{display:"contents"}},i("div",{class:{"menu-popup":true,"menu-popup--closing":this.closing},style:s,role:"menu","aria-label":"Menu","aria-orientation":"vertical"},e.map(((s,n)=>i("div",{key:n,class:{"menu-section":true,"menu-section--divided":n<e.length-1},role:s.header?"group":undefined,"aria-label":s.header},s.header&&i("div",{class:"section-header","aria-hidden":"true"},i("span",{class:"text-body-small-emphasis section-label"},s.header)),s.items.map((e=>{const s=t++;const n=this.focusedIndex===s;return i("button",{key:s,type:"button",class:{"menu-item":true,"menu-item--selected":!!e.isSelected,"menu-item--inactive":!!e.isInactive,"menu-item--destructive":!!e.isDestructive,"menu-item--focused":n},role:"menuitem","aria-current":e.isSelected?"true":undefined,disabled:e.isInactive,tabIndex:n?0:-1,onClick:()=>this.handleItemClick(e),onFocus:()=>{this.focusedIndex=s}},i("div",{class:"menu-item__content"},i("span",{class:e.isSelected?"text-body-medium-emphasis menu-item__label":"text-body-medium menu-item__label"},e.label),e.subtext&&i("span",{class:"text-body-small menu-item__subtext"},e.subtext)),e.showToggle&&i("div",{class:{"menu-item__toggle":true,"menu-item__toggle--on":!!e.toggleValue},"aria-hidden":"true"},i("div",{class:"menu-item__toggle-thumb"})))})))))))}get el(){return this}static get watchers(){return{open:[{onOpenChange:0}],side:[{onPositionPropsChange:0}],align:[{onPositionPropsChange:0}],sideOffset:[{onPositionPropsChange:0}],alignOffset:[{onPositionPropsChange:0}]}}static get style(){return c()}},[2,"ds-menu",{open:[1028],items:[16],sections:[16],side:[1],align:[1],sideOffset:[8,"side-offset"],alignOffset:[8,"align-offset"],menuWidth:[1,"menu-width"],minWidth:[1,"min-width"],anchor:[16],anchorId:[1,"anchor-id"],shouldRender:[32],closing:[32],pos:[32],focusedIndex:[32],positionReady:[32]},[[0,"keydown","handleKeyDown"]],{open:[{onOpenChange:0}],side:[{onPositionPropsChange:0}],align:[{onPositionPropsChange:0}],sideOffset:[{onPositionPropsChange:0}],alignOffset:[{onPositionPropsChange:0}]}]);function m(){if(typeof customElements==="undefined"){return}const e=["ds-menu"];e.forEach((e=>{switch(e){case"ds-menu":if(!customElements.get(o(e))){customElements.define(o(e),u)}break}}))}m();export{u as M,m as d};
+//# sourceMappingURL=p-C4WbCXBj.js.map

package/dist/components/p-C4WbCXBj.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["menuCss","Menu","__stencil_proxyCustomElement","HTMLElement","constructor","registerHost","this","open","items","sections","side","align","sideOffset","TOKEN_DEFAULTS","space050","alignOffset","shouldRender","closing","pos","x","y","focusedIndex","positionReady","clickOutsideHandler","scrollResizeHandler","closeTimer","itemEls","componentDidLoad","onOpenChange","disconnectedCallback","teardownListeners","isOpen","requestAnimationFrame","calculatePosition","focusInitialItem","setupListeners","setTimeout","closeAnimationMs","onPositionPropsChange","viewportPadPx","resolveCssLengthPx","sideOffsetPx","alignOffsetPx","popupFallbackWidthPx","menuWidthXs","popupFallbackHeightPx","menuFallbackHeight","resolveCssTimeMs","motionShort3","animationDurationShort3","resolvedAnchor","anchor","anchorId","document","getElementById","activeSections","length","flatItems","flatMap","s","anchorEl","popup","el","querySelector","a","getBoundingClientRect","pw","offsetWidth","ph","offsetHeight","vpPad","top","left","right","width","bottom","height","Math","min","max","window","innerWidth","innerHeight","flat","selectedIdx","findIndex","it","isSelected","isInactive","firstEnabledIdx","btns","querySelectorAll","focus","e","t","target","contains","close","addEventListener","removeEventListener","clearTimeout","dsClose","emit","handleKeyDown","enabled","map","i","filter","cur","indexOf","safe","key","preventDefault","stopPropagation","focusItem","idx","handleItemClick","item","dsSelect","render","h","Host","style","display","flatIdx","popupStyle","position","transform","round","zIndex","visibility","menuWidth","minWidth","class","role","section","si","header","undefined","isFocused","type","isDestructive","disabled","tabIndex","onClick","onFocus","label","subtext","showToggle","toggleValue"],"sources":["src/wc/components/Menu/Menu.css?tag=ds-menu&encapsulation=scoped","src/wc/components/Menu/Menu.tsx"],"sourcesContent":["/* ── Popup shell ─────────────────────────────────────────────────────────── */\n\n.menu-popup {\n  box-sizing: border-box;\n  display: flex;\n  flex-direction: column;\n  min-width: var(--dimension-menu-width-xs);\n  max-width: var(--dimension-panel-width-lg);\n  overflow: hidden;\n  background-color: var(--color-background-primary);\n  border-radius: var(--dimension-radius-075);\n  /* Split elevation: shadow on shell, inset highlight on ::after (combined token clips with overflow:hidden). */\n  box-shadow: var(--effect-shadow-elevated-floating);\n  animation: menuFadeIn var(--effect-motion-short-2) forwards;\n  backface-visibility: hidden;\n  will-change: transform;\n}\n\n.menu-popup::after {\n  content: '';\n  position: absolute;\n  inset: 0;\n  border-radius: inherit;\n  pointer-events: none;\n  box-shadow: var(--effect-highlight-elevated-floating);\n}\n\n.menu-popup--closing {\n  animation: menuFadeOut var(--effect-motion-short-3) forwards;\n}\n\n@keyframes menuFadeIn {\n  from { opacity: 0; transform: inherit scale(0.97); }\n  to   { opacity: 1; }\n}\n\n@keyframes menuFadeOut {\n  from { opacity: 1; }\n  to   { opacity: 0; }\n}\n\n/* ── Sections ────────────────────────────────────────────────────────────── */\n\n.menu-section {\n  display: flex;\n  flex-direction: column;\n  gap: var(--dimension-space-050);\n  padding: var(--dimension-space-050);\n}\n\n.menu-section--divided {\n  border-bottom: var(--dimension-stroke-width-015) solid var(--color-border-tertiary);\n}\n\n.section-header {\n  display: flex;\n  align-items: center;\n  height: var(--dimension-size-400);\n  padding: var(--dimension-space-050) var(--dimension-space-075);\n  -webkit-user-select: none;\n  user-select: none;\n}\n\n.section-label {\n  color: var(--color-foreground-secondary);\n}\n\n/* ── Items ───────────────────────────────────────────────────────────────── */\n\n.menu-item {\n  display: flex;\n  align-items: center;\n  gap: var(--dimension-space-050);\n  position: relative;\n  width: 100%;\n  min-height: var(--dimension-size-400);\n  padding: var(--dimension-space-075);\n  box-sizing: border-box;\n  border: none;\n  border-radius: var(--dimension-radius-025);\n  background: transparent;\n  cursor: pointer;\n  -webkit-user-select: none;\n  user-select: none;\n  text-align: left;\n  color: inherit;\n  --_hover-bg: var(--color-interaction-hover);\n  --_pressed-bg: var(--color-interaction-pressed);\n  --_selected-bg: var(--color-interaction-active);\n}\n\n.menu-item:has(.menu-item__subtext) {\n  align-items: flex-start;\n}\n\n/* Interaction layer — same ::after pattern as tabs / BarNav trigger */\n.menu-item::after {\n  content: '';\n  position: absolute;\n  inset: 0;\n  border-radius: inherit;\n  background: transparent;\n  pointer-events: none;\n  transition: none;\n}\n\n.menu-item--selected::after {\n  background: var(--_selected-bg);\n  transition: none;\n}\n\n.menu-item:hover:not(:disabled):not(.menu-item--selected)::after,\n.menu-item--focused:not(:disabled):not(.menu-item--selected)::after {\n  background: var(--_hover-bg);\n  transition: none;\n}\n\n.menu-item:active:not(:disabled)::after {\n  background: var(--_pressed-bg);\n  transition: none;\n}\n\n.menu-item:focus-visible {\n  outline: var(--dimension-stroke-width-025) solid var(--color-interaction-focus);\n  outline-offset: var(--dimension-space-025);\n}\n\n.menu-item--inactive {\n  opacity: 0.5;\n  cursor: not-allowed;\n  pointer-events: none;\n}\n\n.menu-item--destructive .menu-item__label {\n  color: var(--color-foreground-bold-negative) !important;\n}\n\n.menu-item__content {\n  position: relative;\n  z-index: 1;\n  display: flex;\n  flex: 1;\n  flex-direction: column;\n  gap: var(--dimension-space-025);\n  min-width: 0;\n}\n\n.menu-item__label {\n  color: var(--color-foreground-secondary);\n}\n\n.menu-item:has(.menu-item__subtext) .menu-item__label,\n.menu-item--selected .menu-item__label {\n  color: var(--color-foreground-primary);\n}\n\n.menu-item__subtext {\n  color: var(--color-foreground-secondary);\n  line-height: 1.4;\n}\n\n/* ── Toggle suffix ───────────────────────────────────────────────────────── */\n\n.menu-item__toggle {\n  position: relative;\n  z-index: 1;\n  flex-shrink: 0;\n  width: calc(var(--dimension-size-400) + var(--dimension-size-050));\n  height: var(--dimension-size-250);\n  border-radius: var(--dimension-radius-125);\n  background-color: var(--color-background-translucent);\n  transition: background-color var(--effect-motion-short-2);\n}\n\n.menu-item__toggle--on {\n  background-color: var(--color-background-medium-brand);\n}\n\n.menu-item__toggle-thumb {\n  position: absolute;\n  top: var(--dimension-space-025);\n  left: var(--dimension-space-025);\n  width: var(--dimension-size-200);\n  height: var(--dimension-size-200);\n  border-radius: 50%;\n  background-color: var(--color-foreground-on-bold-background-primary);\n  transition: transform var(--effect-motion-short-2);\n}\n\n.menu-item__toggle--on .menu-item__toggle-thumb {\n  transform: translateX(var(--dimension-offset-200, 16px));\n}\n","import { Component, Prop, State, Event, EventEmitter, Element, Watch, Listen, h, Host } from '@stencil/core';\nimport { resolveCssLengthPx, resolveCssTimeMs, TOKEN_DEFAULTS } from '../../utils';\n\nexport type MenuSide = 'top' | 'right' | 'bottom' | 'left';\nexport type MenuAlign = 'start' | 'center' | 'end';\n\nexport interface MenuItemData {\n  label: string;\n  value?: string;\n  subtext?: string;\n  isSelected?: boolean;\n  isInactive?: boolean;\n  isDestructive?: boolean;\n  showToggle?: boolean;\n  toggleValue?: boolean;\n}\n\nexport interface MenuSection {\n  header?: string;\n  items: MenuItemData[];\n}\n\n@Component({\n  tag: 'ds-menu',\n  styleUrl: 'Menu.css',\n  scoped: true,\n})\nexport class Menu {\n  @Element() el!: HTMLElement;\n\n  @Prop({ mutable: true }) open: boolean = false;\n  @Prop() items: MenuItemData[] = [];\n  @Prop() sections: MenuSection[] = [];\n  @Prop() side: MenuSide = 'bottom';\n  @Prop() align: MenuAlign = 'start';\n  /** Gap between anchor and menu — number (px) or TokoMo length (`var(--dimension-space-050)`, etc.). */\n  @Prop() sideOffset: number | string = TOKEN_DEFAULTS.space050;\n  /** Cross-axis offset — number (px) or TokoMo length. */\n  @Prop() alignOffset: number | string = 0;\n  @Prop() menuWidth: string | undefined;\n  @Prop() minWidth: string | undefined;\n  /** External trigger element to position against. Set via JS: menuEl.anchor = buttonEl */\n  @Prop() anchor: HTMLElement | undefined;\n  /** ID of the external trigger element for positioning */\n  @Prop() anchorId: string | undefined;\n\n  @State() private shouldRender: boolean = false;\n  @State() private closing: boolean = false;\n  @State() private pos: { x: number; y: number } = { x: 0, y: 0 };\n  @State() private focusedIndex: number = 0;\n  @State() private positionReady: boolean = false;\n\n  @Event() dsClose!: EventEmitter<void>;\n  @Event() dsSelect!: EventEmitter<MenuItemData>;\n\n  private clickOutsideHandler: ((e: MouseEvent) => void) | null = null;\n  private scrollResizeHandler: (() => void) | null = null;\n  private closeTimer: ReturnType<typeof setTimeout> | null = null;\n  private itemEls: HTMLElement[] = [];\n\n  componentDidLoad() {\n    if (this.open) this.onOpenChange(true);\n  }\n\n  disconnectedCallback() {\n    this.teardownListeners();\n  }\n\n  @Watch('open')\n  onOpenChange(isOpen: boolean) {\n    if (isOpen) {\n      this.shouldRender = true;\n      this.closing = false;\n      this.positionReady = false;\n      requestAnimationFrame(() => {\n        this.calculatePosition();\n        this.positionReady = true;\n        this.focusInitialItem();\n        this.setupListeners();\n      });\n    } else if (this.shouldRender) {\n      this.closing = true;\n      this.teardownListeners();\n      this.closeTimer = setTimeout(() => {\n        this.shouldRender = false;\n        this.closing = false;\n        this.closeTimer = null;\n      }, this.closeAnimationMs);\n    }\n  }\n\n  @Watch('side')\n  @Watch('align')\n  @Watch('sideOffset')\n  @Watch('alignOffset')\n  onPositionPropsChange() {\n    if (this.open) this.calculatePosition();\n  }\n\n  private get viewportPadPx(): number {\n    return resolveCssLengthPx(TOKEN_DEFAULTS.space050, TOKEN_DEFAULTS.space050);\n  }\n\n  private get sideOffsetPx(): number {\n    return resolveCssLengthPx(this.sideOffset, TOKEN_DEFAULTS.space050);\n  }\n\n  private get alignOffsetPx(): number {\n    return resolveCssLengthPx(this.alignOffset, 0);\n  }\n\n  private get popupFallbackWidthPx(): number {\n    return resolveCssLengthPx(TOKEN_DEFAULTS.menuWidthXs, TOKEN_DEFAULTS.menuWidthXs);\n  }\n\n  private get popupFallbackHeightPx(): number {\n    return resolveCssLengthPx(TOKEN_DEFAULTS.menuFallbackHeight, TOKEN_DEFAULTS.menuFallbackHeight);\n  }\n\n  private get closeAnimationMs(): number {\n    return resolveCssTimeMs(TOKEN_DEFAULTS.motionShort3, TOKEN_DEFAULTS.animationDurationShort3);\n  }\n\n  private get resolvedAnchor(): HTMLElement | null {\n    if (this.anchor) return this.anchor;\n    if (this.anchorId) return document.getElementById(this.anchorId);\n    return null;\n  }\n\n  private get activeSections(): MenuSection[] {\n    if (this.sections.length > 0) return this.sections;\n    if (this.items.length > 0) return [{ items: this.items }];\n    return [];\n  }\n\n  private get flatItems(): MenuItemData[] {\n    return this.activeSections.flatMap(s => s.items);\n  }\n\n  private calculatePosition() {\n    const anchorEl = this.resolvedAnchor;\n    if (!anchorEl) return;\n    const popup = this.el.querySelector('.menu-popup') as HTMLElement | null;\n    if (!popup) return;\n\n    const a = anchorEl.getBoundingClientRect();\n    const pw = popup.offsetWidth || this.popupFallbackWidthPx;\n    const ph = popup.offsetHeight || this.popupFallbackHeightPx;\n    const sideOffset = this.sideOffsetPx;\n    const alignOffset = this.alignOffsetPx;\n    const vpPad = this.viewportPadPx;\n    let x = 0, y = 0;\n\n    switch (this.side) {\n      case 'top':\n        y = a.top - ph - sideOffset;\n        x = this.align === 'start' ? a.left + alignOffset\n          : this.align === 'end' ? a.right - pw + alignOffset\n          : a.left + a.width / 2 - pw / 2 + alignOffset;\n        break;\n      case 'bottom':\n        y = a.bottom + sideOffset;\n        x = this.align === 'start' ? a.left + alignOffset\n          : this.align === 'end' ? a.right - pw + alignOffset\n          : a.left + a.width / 2 - pw / 2 + alignOffset;\n        break;\n      case 'left':\n        x = a.left - pw - sideOffset;\n        y = this.align === 'start' ? a.top + alignOffset\n          : this.align === 'end' ? a.bottom - ph + alignOffset\n          : a.top + a.height / 2 - ph / 2 + alignOffset;\n        break;\n      case 'right':\n        x = a.right + sideOffset;\n        y = this.align === 'start' ? a.top + alignOffset\n          : this.align === 'end' ? a.bottom - ph + alignOffset\n          : a.top + a.height / 2 - ph / 2 + alignOffset;\n        break;\n    }\n\n    this.pos = {\n      x: Math.min(Math.max(x, vpPad), window.innerWidth - pw - vpPad),\n      y: Math.min(Math.max(y, vpPad), window.innerHeight - ph - vpPad),\n    };\n  }\n\n  /** Focus the selected item when present, otherwise the first enabled item. */\n  private focusInitialItem() {\n    const flat = this.flatItems;\n    const selectedIdx = flat.findIndex(it => it.isSelected && !it.isInactive);\n    const firstEnabledIdx = flat.findIndex(it => !it.isInactive);\n    this.focusedIndex = selectedIdx >= 0\n      ? selectedIdx\n      : (firstEnabledIdx >= 0 ? firstEnabledIdx : 0);\n\n    requestAnimationFrame(() => {\n      const btns = this.el.querySelectorAll<HTMLElement>('.menu-item');\n      btns[this.focusedIndex]?.focus();\n    });\n  }\n\n  private setupListeners() {\n    this.clickOutsideHandler = (e: MouseEvent) => {\n      const t = e.target as Node;\n      const popup = this.el.querySelector('.menu-popup');\n      const anchorEl = this.resolvedAnchor;\n      if (popup?.contains(t) || anchorEl?.contains(t)) return;\n      this.close();\n    };\n\n    this.scrollResizeHandler = () => this.calculatePosition();\n\n    document.addEventListener('mousedown', this.clickOutsideHandler, true);\n    window.addEventListener('scroll', this.scrollResizeHandler, true);\n    window.addEventListener('resize', this.scrollResizeHandler);\n  }\n\n  private teardownListeners() {\n    if (this.clickOutsideHandler) {\n      document.removeEventListener('mousedown', this.clickOutsideHandler, true);\n      this.clickOutsideHandler = null;\n    }\n    if (this.scrollResizeHandler) {\n      window.removeEventListener('scroll', this.scrollResizeHandler, true);\n      window.removeEventListener('resize', this.scrollResizeHandler);\n      this.scrollResizeHandler = null;\n    }\n    if (this.closeTimer) {\n      clearTimeout(this.closeTimer);\n      this.closeTimer = null;\n    }\n  }\n\n  private close() {\n    this.resolvedAnchor?.focus();\n    this.dsClose.emit();\n    this.open = false;\n  }\n\n  @Listen('keydown')\n  handleKeyDown(e: KeyboardEvent) {\n    if (!this.open) return;\n    const flat = this.flatItems;\n    const enabled = flat.map((it, i) => ({ it, i })).filter(({ it }) => !it.isInactive).map(({ i }) => i);\n    if (!enabled.length) return;\n\n    const cur = enabled.indexOf(this.focusedIndex);\n    const safe = cur < 0 ? 0 : cur;\n\n    switch (e.key) {\n      case 'ArrowDown':\n        e.preventDefault(); e.stopPropagation();\n        this.focusedIndex = enabled[(safe + 1) % enabled.length];\n        this.focusItem(this.focusedIndex);\n        break;\n      case 'ArrowUp':\n        e.preventDefault(); e.stopPropagation();\n        this.focusedIndex = enabled[(safe - 1 + enabled.length) % enabled.length];\n        this.focusItem(this.focusedIndex);\n        break;\n      case 'Home':\n        e.preventDefault(); e.stopPropagation();\n        this.focusedIndex = enabled[0];\n        this.focusItem(this.focusedIndex);\n        break;\n      case 'End':\n        e.preventDefault(); e.stopPropagation();\n        this.focusedIndex = enabled[enabled.length - 1];\n        this.focusItem(this.focusedIndex);\n        break;\n      case 'Escape':\n        e.preventDefault();\n        this.close();\n        break;\n      case 'Tab':\n        e.preventDefault();\n        this.close();\n        break;\n    }\n  }\n\n  private focusItem(idx: number) {\n    const btns = this.el.querySelectorAll<HTMLElement>('.menu-item');\n    btns[idx]?.focus();\n  }\n\n  private handleItemClick(item: MenuItemData) {\n    if (item.isInactive) return;\n    this.dsSelect.emit(item);\n    this.close();\n  }\n\n  render() {\n    if (!this.shouldRender) return <Host style={{ display: 'contents' }} />;\n\n    const sections = this.activeSections;\n    let flatIdx = 0;\n\n    const popupStyle: Record<string, string> = {\n      position: 'fixed',\n      left: '0',\n      top: '0',\n      transform: `translate(${Math.round(this.pos.x)}px, ${Math.round(this.pos.y)}px)`,\n      zIndex: '9998',\n      visibility: this.positionReady ? 'visible' : 'hidden',\n    };\n\n    if (this.menuWidth) popupStyle['width'] = this.menuWidth;\n    if (this.minWidth) popupStyle['min-width'] = this.minWidth;\n\n    return (\n      <Host style={{ display: 'contents' }}>\n        <div\n          class={{ 'menu-popup': true, 'menu-popup--closing': this.closing }}\n          style={popupStyle}\n          role=\"menu\"\n          aria-label=\"Menu\"\n          aria-orientation=\"vertical\"\n        >\n          {sections.map((section, si) => (\n            <div\n              key={si}\n              class={{ 'menu-section': true, 'menu-section--divided': si < sections.length - 1 }}\n              role={section.header ? 'group' : undefined}\n              aria-label={section.header}\n            >\n              {section.header && (\n                <div class=\"section-header\" aria-hidden=\"true\">\n                  <span class=\"text-body-small-emphasis section-label\">{section.header}</span>\n                </div>\n              )}\n              {section.items.map(item => {\n                const idx = flatIdx++;\n                const isFocused = this.focusedIndex === idx;\n                return (\n                  <button\n                    key={idx}\n                    type=\"button\"\n                    class={{\n                      'menu-item': true,\n                      'menu-item--selected': !!item.isSelected,\n                      'menu-item--inactive': !!item.isInactive,\n                      'menu-item--destructive': !!item.isDestructive,\n                      'menu-item--focused': isFocused,\n                    }}\n                    role=\"menuitem\"\n                    aria-current={item.isSelected ? 'true' : undefined}\n                    disabled={item.isInactive}\n                    tabIndex={isFocused ? 0 : -1}\n                    onClick={() => this.handleItemClick(item)}\n                    onFocus={() => { this.focusedIndex = idx; }}\n                  >\n                    <div class=\"menu-item__content\">\n                      <span class={item.isSelected ? 'text-body-medium-emphasis menu-item__label' : 'text-body-medium menu-item__label'}>\n                        {item.label}\n                      </span>\n                      {item.subtext && (\n                        <span class=\"text-body-small menu-item__subtext\">{item.subtext}</span>\n                      )}\n                    </div>\n                    {item.showToggle && (\n                      <div class={{ 'menu-item__toggle': true, 'menu-item__toggle--on': !!item.toggleValue }} aria-hidden=\"true\">\n                        <div class=\"menu-item__toggle-thumb\" />\n                      </div>\n                    )}\n                  </button>\n                );\n              })}\n            </div>\n          ))}\n        </div>\n      </Host>\n    );\n  }\n}\n"],"mappings":"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","ignoreList":[]}

package/dist/components/p-CYJ-de0u.js

@@ -0,0 +1,2 @@
+const n=new Map;let e=null;function t(){if(typeof document==="undefined")return null;if(!e){e=document.createElement("div");e.setAttribute("aria-hidden","true");e.style.cssText="position:absolute;visibility:hidden;pointer-events:none;top:0;left:0;width:0;height:0;overflow:hidden;";document.documentElement.appendChild(e)}return e}function r(e,i){const o=e===undefined||e===null||e===""?i:e;if(typeof o==="number")return o;const u=o.trim();if(!u)return r(i,0);const d=n.get(u);if(d!==undefined)return d;if(/^-?\d+(\.\d+)?$/.test(u)){const e=Number(u);n.set(u,e);return e}const f=u.match(/^(-?\d+(\.\d+)?)px$/);if(f){const e=parseFloat(f[1]);n.set(u,e);return e}const s=t();if(!s){return typeof i==="number"?i:0}s.style.width=u;const c=s.getBoundingClientRect().width;s.style.width="";n.set(u,c);return c}export{r};
+//# sourceMappingURL=p-CYJ-de0u.js.map

package/dist/components/p-CYJ-de0u.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["lengthPxCache","Map","probeEl","getProbeElement","document","createElement","setAttribute","style","cssText","documentElement","appendChild","resolveCssLengthPx","value","fallback","resolved","undefined","trimmed","trim","cached","get","test","n","Number","set","pxMatch","match","px","parseFloat","probe","width","getBoundingClientRect"],"sources":["src/wc/utils/resolve-css-length-px.ts"],"sourcesContent":["const lengthPxCache = new Map<string, number>();\n\nlet probeEl: HTMLElement | null = null;\n\nfunction getProbeElement(): HTMLElement | null {\n  if (typeof document === 'undefined') return null;\n\n  if (!probeEl) {\n    probeEl = document.createElement('div');\n    probeEl.setAttribute('aria-hidden', 'true');\n    probeEl.style.cssText =\n      'position:absolute;visibility:hidden;pointer-events:none;top:0;left:0;width:0;height:0;overflow:hidden;';\n    document.documentElement.appendChild(probeEl);\n  }\n\n  return probeEl;\n}\n\n/** Clear session cache (tests only). */\nexport function clearCssLengthPxCache(): void {\n  lengthPxCache.clear();\n}\n\n/**\n * Resolve a CSS length to pixels for layout math.\n * Numbers pass through; `var(--dimension-*)`, `calc(...)`, and `16px` resolve via a hidden probe.\n */\nexport function resolveCssLengthPx(\n  value: number | string | undefined,\n  fallback: number | string,\n): number {\n  const resolved = value === undefined || value === null || value === '' ? fallback : value;\n  if (typeof resolved === 'number') return resolved;\n\n  const trimmed = resolved.trim();\n  if (!trimmed) return resolveCssLengthPx(fallback, 0);\n\n  const cached = lengthPxCache.get(trimmed);\n  if (cached !== undefined) return cached;\n\n  if (/^-?\\d+(\\.\\d+)?$/.test(trimmed)) {\n    const n = Number(trimmed);\n    lengthPxCache.set(trimmed, n);\n    return n;\n  }\n\n  const pxMatch = trimmed.match(/^(-?\\d+(\\.\\d+)?)px$/);\n  if (pxMatch) {\n    const px = parseFloat(pxMatch[1]);\n    lengthPxCache.set(trimmed, px);\n    return px;\n  }\n\n  const probe = getProbeElement();\n  if (!probe) {\n    return typeof fallback === 'number' ? fallback : 0;\n  }\n\n  probe.style.width = trimmed;\n  const px = probe.getBoundingClientRect().width;\n  probe.style.width = '';\n  lengthPxCache.set(trimmed, px);\n  return px;\n}\n"],"mappings":"AAAA,MAAMA,EAAgB,IAAIC,IAE1B,IAAIC,EAA8B,KAElC,SAASC,IACP,UAAWC,WAAa,YAAa,OAAO,KAE5C,IAAKF,EAAS,CACZA,EAAUE,SAASC,cAAc,OACjCH,EAAQI,aAAa,cAAe,QACpCJ,EAAQK,MAAMC,QACZ,yGACFJ,SAASK,gBAAgBC,YAAYR,E,CAGvC,OAAOA,CACT,CAWM,SAAUS,EACdC,EACAC,GAEA,MAAMC,EAAWF,IAAUG,WAAaH,IAAU,MAAQA,IAAU,GAAKC,EAAWD,EACpF,UAAWE,IAAa,SAAU,OAAOA,EAEzC,MAAME,EAAUF,EAASG,OACzB,IAAKD,EAAS,OAAOL,EAAmBE,EAAU,GAElD,MAAMK,EAASlB,EAAcmB,IAAIH,GACjC,GAAIE,IAAWH,UAAW,OAAOG,EAEjC,GAAI,kBAAkBE,KAAKJ,GAAU,CACnC,MAAMK,EAAIC,OAAON,GACjBhB,EAAcuB,IAAIP,EAASK,GAC3B,OAAOA,C,CAGT,MAAMG,EAAUR,EAAQS,MAAM,uBAC9B,GAAID,EAAS,CACX,MAAME,EAAKC,WAAWH,EAAQ,IAC9BxB,EAAcuB,IAAIP,EAASU,GAC3B,OAAOA,C,CAGT,MAAME,EAAQzB,IACd,IAAKyB,EAAO,CACV,cAAcf,IAAa,SAAWA,EAAW,C,CAGnDe,EAAMrB,MAAMsB,MAAQb,EACpB,MAAMU,EAAKE,EAAME,wBAAwBD,MACzCD,EAAMrB,MAAMsB,MAAQ,GACpB7B,EAAcuB,IAAIP,EAASU,GAC3B,OAAOA,CACT,Q","ignoreList":[]}

package/dist/components/{p--YDw8Q4o.js → p-CsO880L-.js}

@@ -1,2 +1,2 @@
-import{p as o,H as r,c as n,h as t,a,t as e}from"./index.js";import{d as i}from"./p-BcuUR5Ao.js";const s=()=>`.btn-host.sc-ds-button{display:inline-block}.btn-host--full.sc-ds-button{display:block;width:100%}.btn.sc-ds-button{display:inline-flex;align-items:center;justify-content:center;border:none;border-radius:var(--dimension-radius-050);cursor:pointer;position:relative;transition:transform var(--effect-motion-short-2);height:var(--dimension-size-400);font-family:inherit;color:var(--color-foreground-primary);background:transparent;box-sizing:border-box;text-decoration:none;user-select:none;outline:none;width:100%;--_hover-bg:var(--color-interaction-hover);--_pressed-bg:var(--color-interaction-pressed);--_border:var(--color-border-tertiary)}.btn.sc-ds-button:focus-visible{outline:var(--dimension-stroke-width-025) solid var(--color-interaction-focus);outline-offset:var(--dimension-space-025)}.btn.sc-ds-button:hover:not(.inactive){background-color:var(--_hover-bg)}.btn.sc-ds-button:active:not(.inactive){background-color:var(--_pressed-bg);transform:scale(var(--dimension-scale-subtle))}.onMedium.sc-ds-button{--_hover-bg:var(--color-interaction-on-medium-background-hover);--_pressed-bg:var(--color-interaction-on-medium-background-pressed);--_border:var(--color-border-on-medium-background-tertiary)}.onBold.sc-ds-button{--_hover-bg:var(--color-interaction-on-bold-background-hover);--_pressed-bg:var(--color-interaction-on-bold-background-pressed);--_border:var(--color-border-on-bold-background-tertiary)}.onStrong.sc-ds-button{--_hover-bg:var(--color-interaction-on-strong-background-hover);--_pressed-bg:var(--color-interaction-on-strong-background-pressed);--_border:var(--color-border-on-strong-background-tertiary)}.onAlwaysDark.sc-ds-button{--_hover-bg:var(--color-always-dark-interaction-hover);--_pressed-bg:var(--color-always-dark-interaction-pressed);--_border:var(--color-always-dark-border-tertiary)}.primary.sc-ds-button{color:var(--color-foreground-on-bold-background-primary)}.primary.intentNone.sc-ds-button{background-color:var(--color-inverted-background);color:var(--color-inverted-foreground-primary);--_hover-bg:color-mix(in oklch, var(--color-inverted-background) 90%, var(--color-inverted-foreground-primary));--_pressed-bg:color-mix(in oklch, var(--color-inverted-background) 85%, var(--color-inverted-foreground-primary));--_border:var(--color-inverted-border-tertiary)}.primary.sc-ds-button:not(.intentNone){background-color:var(--_bg);--_hover-bg:color-mix(in oklch, var(--_bg) 85%, var(--color-foreground-on-bold-background-primary));--_pressed-bg:color-mix(in oklch, var(--_bg) 80%, var(--color-foreground-on-bold-background-primary))}.primary.intentBrand.sc-ds-button{--_bg:var(--color-background-bold-brand);color:var(--color-foreground-faint-brand)}.primary.intentNeutral.sc-ds-button{--_bg:var(--color-background-bold-neutral);color:var(--color-foreground-faint-neutral)}.primary.intentPositive.sc-ds-button{--_bg:var(--color-background-bold-positive);color:var(--color-foreground-faint-positive)}.primary.intentNegative.sc-ds-button{--_bg:var(--color-background-bold-negative);color:var(--color-foreground-faint-negative)}.primary.intentWarning.sc-ds-button{--_bg:var(--color-background-bold-warning);color:var(--color-foreground-faint-warning)}.primary.intentCaution.sc-ds-button{--_bg:var(--color-background-bold-caution);color:var(--color-foreground-faint-caution)}.primary.intentAi.sc-ds-button{--_bg:var(--color-background-bold-ai);color:var(--color-foreground-faint-ai)}.primary.contrastMedium.sc-ds-button{--_hover-bg:color-mix(in oklch, var(--_bg) 85%, var(--color-foreground-primary));--_pressed-bg:color-mix(in oklch, var(--_bg) 80%, var(--color-foreground-primary))}.primary.contrastMedium.intentBrand.sc-ds-button{--_bg:var(--color-background-medium-brand);color:var(--color-foreground-strong-brand)}.primary.contrastMedium.intentNeutral.sc-ds-button{--_bg:var(--color-background-medium-neutral);color:var(--color-foreground-strong-neutral)}.primary.contrastMedium.intentPositive.sc-ds-button{--_bg:var(--color-background-medium-positive);color:var(--color-foreground-strong-positive)}.primary.contrastMedium.intentNegative.sc-ds-button{--_bg:var(--color-background-medium-negative);color:var(--color-foreground-strong-negative)}.primary.contrastMedium.intentWarning.sc-ds-button{--_bg:var(--color-background-medium-warning);color:var(--color-foreground-strong-warning)}.primary.contrastMedium.intentCaution.sc-ds-button{--_bg:var(--color-background-medium-caution);color:var(--color-foreground-strong-caution)}.primary.contrastMedium.intentAi.sc-ds-button{--_bg:var(--color-background-medium-ai);color:var(--color-foreground-strong-ai)}.primary.contrastStrong.sc-ds-button{--_hover-bg:color-mix(in oklch, var(--_bg) 90%, var(--color-foreground-on-bold-background-primary));--_pressed-bg:color-mix(in oklch, var(--_bg) 85%, var(--color-foreground-on-bold-background-primary))}.primary.contrastStrong.intentBrand.sc-ds-button{--_bg:var(--color-background-strong-brand);color:var(--color-foreground-medium-brand)}.primary.contrastStrong.intentNeutral.sc-ds-button{--_bg:var(--color-background-strong-neutral);color:var(--color-foreground-medium-neutral)}.primary.contrastStrong.intentPositive.sc-ds-button{--_bg:var(--color-background-strong-positive);color:var(--color-foreground-medium-positive)}.primary.contrastStrong.intentNegative.sc-ds-button{--_bg:var(--color-background-strong-negative);color:var(--color-foreground-medium-negative)}.primary.contrastStrong.intentWarning.sc-ds-button{--_bg:var(--color-background-strong-warning);color:var(--color-foreground-medium-warning)}.primary.contrastStrong.intentCaution.sc-ds-button{--_bg:var(--color-background-strong-caution);color:var(--color-foreground-medium-caution)}.primary.contrastStrong.intentAi.sc-ds-button{--_bg:var(--color-background-strong-ai);color:var(--color-foreground-medium-ai)}.primary.contrastFaint.sc-ds-button{--_hover-bg:color-mix(in oklch, var(--_bg) 90%, var(--color-foreground-primary));--_pressed-bg:color-mix(in oklch, var(--_bg) 85%, var(--color-foreground-primary))}.primary.contrastFaint.intentBrand.sc-ds-button{--_bg:var(--color-background-faint-brand);color:var(--color-foreground-bold-brand)}.primary.contrastFaint.intentNeutral.sc-ds-button{--_bg:var(--color-background-faint-neutral);color:var(--color-foreground-bold-neutral)}.primary.contrastFaint.intentPositive.sc-ds-button{--_bg:var(--color-background-faint-positive);color:var(--color-foreground-bold-positive)}.primary.contrastFaint.intentNegative.sc-ds-button{--_bg:var(--color-background-faint-negative);color:var(--color-foreground-bold-negative)}.primary.contrastFaint.intentWarning.sc-ds-button{--_bg:var(--color-background-faint-warning);color:var(--color-foreground-bold-warning)}.primary.contrastFaint.intentCaution.sc-ds-button{--_bg:var(--color-background-faint-caution);color:var(--color-foreground-bold-caution)}.primary.contrastFaint.intentAi.sc-ds-button{--_bg:var(--color-background-faint-ai);color:var(--color-foreground-bold-ai)}.primary.intentNone.onStrong.sc-ds-button,.primary.intentNone.onAlwaysDark.sc-ds-button{background-color:var(--color-background-primary);color:var(--color-foreground-primary);--_hover-bg:color-mix(in oklch, var(--color-background-primary) 90%, var(--color-foreground-primary));--_pressed-bg:color-mix(in oklch, var(--color-background-primary) 85%, var(--color-foreground-primary));--_border:var(--color-border-tertiary)}.secondary.sc-ds-button{background-color:transparent;color:var(--color-foreground-secondary)}.secondary.intentBrand.sc-ds-button{color:var(--color-foreground-bold-brand)}.secondary.intentNeutral.sc-ds-button{color:var(--color-foreground-bold-neutral)}.secondary.intentPositive.sc-ds-button{color:var(--color-foreground-bold-positive)}.secondary.intentNegative.sc-ds-button{color:var(--color-foreground-bold-negative)}.secondary.intentWarning.sc-ds-button{color:var(--color-foreground-bold-warning)}.secondary.intentCaution.sc-ds-button{color:var(--color-foreground-bold-caution)}.secondary.intentAi.sc-ds-button{color:var(--color-foreground-bold-ai)}.secondary.onMedium.sc-ds-button{color:var(--color-foreground-primary)}.secondary.onMedium.intentBrand.sc-ds-button{color:var(--color-foreground-strong-brand)}.secondary.onMedium.intentNeutral.sc-ds-button{color:var(--color-foreground-strong-neutral)}.secondary.onMedium.intentPositive.sc-ds-button{color:var(--color-foreground-strong-positive)}.secondary.onMedium.intentNegative.sc-ds-button{color:var(--color-foreground-strong-negative)}.secondary.onMedium.intentWarning.sc-ds-button{color:var(--color-foreground-strong-warning)}.secondary.onMedium.intentCaution.sc-ds-button{color:var(--color-foreground-strong-caution)}.secondary.onMedium.intentAi.sc-ds-button{color:var(--color-foreground-strong-ai)}.secondary.onBold.sc-ds-button{color:var(--color-foreground-on-bold-background-secondary)}.secondary.onBold.intentBrand.sc-ds-button{color:var(--color-foreground-faint-brand)}.secondary.onBold.intentNeutral.sc-ds-button{color:var(--color-foreground-faint-neutral)}.secondary.onBold.intentPositive.sc-ds-button{color:var(--color-foreground-faint-positive)}.secondary.onBold.intentNegative.sc-ds-button{color:var(--color-foreground-faint-negative)}.secondary.onBold.intentWarning.sc-ds-button{color:var(--color-foreground-faint-warning)}.secondary.onBold.intentCaution.sc-ds-button{color:var(--color-foreground-faint-caution)}.secondary.onBold.intentAi.sc-ds-button{color:var(--color-foreground-faint-ai)}.secondary.onAlwaysDark.sc-ds-button{color:var(--color-always-dark-foreground-secondary)}.secondary.onAlwaysDark.intentBrand.sc-ds-button{color:var(--color-always-dark-foreground-brand)}.secondary.onAlwaysDark.intentNeutral.sc-ds-button{color:var(--color-always-dark-foreground-neutral)}.secondary.onAlwaysDark.intentPositive.sc-ds-button{color:var(--color-always-dark-foreground-positive)}.secondary.onAlwaysDark.intentNegative.sc-ds-button{color:var(--color-always-dark-foreground-negative)}.secondary.onAlwaysDark.intentWarning.sc-ds-button{color:var(--color-always-dark-foreground-warning)}.secondary.onAlwaysDark.intentCaution.sc-ds-button{color:var(--color-always-dark-foreground-caution)}.secondary.onAlwaysDark.intentAi.sc-ds-button{color:var(--color-always-dark-foreground-ai)}.secondary.onStrong.sc-ds-button{color:var(--color-foreground-on-bold-background-secondary)}.secondary.onStrong.intentBrand.sc-ds-button{color:var(--color-foreground-faint-brand)}.secondary.onStrong.intentNeutral.sc-ds-button{color:var(--color-foreground-faint-neutral)}.secondary.onStrong.intentPositive.sc-ds-button{color:var(--color-foreground-faint-positive)}.secondary.onStrong.intentNegative.sc-ds-button{color:var(--color-foreground-faint-negative)}.secondary.onStrong.intentWarning.sc-ds-button{color:var(--color-foreground-faint-warning)}.secondary.onStrong.intentCaution.sc-ds-button{color:var(--color-foreground-faint-caution)}.secondary.onStrong.intentAi.sc-ds-button{color:var(--color-foreground-faint-ai)}.secondary.elevationFlat.sc-ds-button{box-shadow:inset 0 0 0 1px var(--_border)}.secondary.elevationElevated.sc-ds-button{background-color:var(--color-background-primary);box-shadow:var(--effect-elevation-elevated-sm);--_hover-bg:color-mix(in oklch, var(--color-background-primary) 90%, var(--color-foreground-primary));--_pressed-bg:color-mix(in oklch, var(--color-background-primary) 85%, var(--color-foreground-primary))}.secondary.elevationFloating.sc-ds-button{background-color:var(--color-background-primary);box-shadow:var(--effect-elevation-elevated-floating);--_hover-bg:color-mix(in oklch, var(--color-background-primary) 90%, var(--color-foreground-primary));--_pressed-bg:color-mix(in oklch, var(--color-background-primary) 85%, var(--color-foreground-primary))}.primary.elevationElevated.sc-ds-button{box-shadow:var(--effect-elevation-elevated-sm)}.primary.elevationNone.sc-ds-button{box-shadow:none}.primary.elevationFlat.sc-ds-button{box-shadow:inset 0 0 0 1px var(--_border)}.primary.intentNone.elevationFlat.sc-ds-button{--_border:var(--color-border-tertiary)}.primary.elevationFloating.sc-ds-button{box-shadow:var(--effect-elevation-elevated-floating) !important}.iconOnly.sc-ds-button{padding:0;width:var(--dimension-size-400);min-width:var(--dimension-size-400)}.labelOnly.sc-ds-button{padding:0 var(--dimension-space-100)}.iconAndLabel.sc-ds-button{padding:0 var(--dimension-space-100) 0 var(--dimension-space-075);gap:var(--dimension-space-025)}.dropdown.sc-ds-button{gap:var(--dimension-space-050)}.sizeSM.sc-ds-button{height:var(--dimension-size-300)}.sizeSM.iconOnly.sc-ds-button{width:var(--dimension-size-300);min-width:var(--dimension-size-300)}.sizeSM.labelOnly.sc-ds-button{padding:0 var(--dimension-space-075)}.sizeSM.iconAndLabel.sc-ds-button{padding:0 var(--dimension-space-075) 0 var(--dimension-space-050);gap:1px}.sizeXS.sc-ds-button{height:var(--dimension-size-200)}.sizeXS.iconOnly.sc-ds-button{width:var(--dimension-size-200);min-width:var(--dimension-size-200)}.sizeXS.labelOnly.sc-ds-button,.sizeXS.iconAndLabel.sc-ds-button{padding:0 var(--dimension-space-025);gap:0}.sizeLG.sc-ds-button{height:var(--dimension-size-500)}.sizeLG.iconOnly.sc-ds-button{width:var(--dimension-size-500);min-width:var(--dimension-size-500)}.sizeLG.labelOnly.sc-ds-button{padding:0 var(--dimension-space-150)}.sizeLG.iconAndLabel.sc-ds-button{padding:0 var(--dimension-space-150) 0 var(--dimension-space-100);gap:var(--dimension-space-075)}.rounded.sc-ds-button{border-radius:var(--dimension-radius-half)}.rounded.labelOnly.sc-ds-button{padding-left:calc(var(--dimension-space-100) + var(--dimension-space-050));padding-right:calc(var(--dimension-space-100) + var(--dimension-space-050))}.rounded.iconAndLabel.sc-ds-button{padding-left:calc(var(--dimension-space-075) + var(--dimension-space-050));padding-right:calc(var(--dimension-space-100) + var(--dimension-space-050))}.rounded.sizeSM.labelOnly.sc-ds-button{padding-left:calc(var(--dimension-space-075) + var(--dimension-space-050));padding-right:calc(var(--dimension-space-075) + var(--dimension-space-050))}.rounded.sizeSM.iconAndLabel.sc-ds-button{padding-left:calc(var(--dimension-space-050) + var(--dimension-space-050));padding-right:calc(var(--dimension-space-075) + var(--dimension-space-050))}.rounded.sizeLG.labelOnly.sc-ds-button{padding-left:calc(var(--dimension-space-150) + var(--dimension-space-050));padding-right:calc(var(--dimension-space-150) + var(--dimension-space-050))}.rounded.sizeLG.iconAndLabel.sc-ds-button{padding-left:calc(var(--dimension-space-100) + var(--dimension-space-050));padding-right:calc(var(--dimension-space-150) + var(--dimension-space-050))}.inactive.sc-ds-button{opacity:0.5;cursor:not-allowed;pointer-events:none}.fullWidth.sc-ds-button{display:flex;width:100%}.btn__icon.sc-ds-button{display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;line-height:0}.btn__label.sc-ds-button{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.btn__chevron.sc-ds-button{flex-shrink:0}.btn__badge.sc-ds-button{position:absolute;top:var(--dimension-space-025);right:var(--dimension-space-025);font-size:var(--typography-fontsize-xs);font-weight:var(--typography-weight-semibold);line-height:var(--typography-lineheight-xs);color:var(--color-foreground-secondary);pointer-events:none;z-index:10}`;const d={xs:12,sm:16,md:20,lg:24};const c={xs:"text-caption-emphasis",sm:"text-body-small-emphasis",md:"text-body-medium-emphasis",lg:"text-body-large-emphasis"};const l=o(class o extends r{constructor(o){super();if(o!==false){this.__registerHost()}this.dsClick=n(this,"dsClick");this.dsMouseEnter=n(this,"dsMouseEnter");this.dsMouseLeave=n(this,"dsMouseLeave");this.variant="primary";this.intent="brand";this.size="md";this.rounded=false;this.fullWidth=false;this.contrast="bold";this.dropdown=false;this.loading=false;this.inactive=false;this.type="button";this.hasIcon=false;this.handleClick=o=>{if(this.inactive||this.loading)return;this.dsClick.emit(o)}}componentWillLoad(){this.hasIcon=!!this.el.querySelector('[slot="icon"]')}get effectiveElevation(){return this.elevation??(this.variant==="primary"?"none":"flat")}render(){const o=this.href?"a":"button";const r=this.size;const n=d[r];const e=c[r];const i=this.effectiveElevation;const s=!!this.label;const l=this.hasIcon||this.loading;const b=l&&!s;const g=s&&!l;const v=l&&s;const m=this.background;const p={btn:true,[this.variant]:true,[`intent${u(this.intent)}`]:true,[`size${r.toUpperCase()}`]:r!=="md",rounded:this.rounded,inactive:this.inactive||this.loading,iconOnly:b,labelOnly:g,iconAndLabel:v,dropdown:this.dropdown,[`contrast${u(this.contrast)}`]:this.variant==="primary"&&this.intent!=="none"&&this.contrast!=="bold",[`elevation${u(i)}`]:true,onMedium:m==="medium",onBold:m==="bold",onStrong:m==="strong",onAlwaysDark:m==="always-dark",fullWidth:this.fullWidth};const f={};if(o==="button"){f.type=this.type;f.disabled=this.inactive||this.loading}if(this.href)f.href=this.href;if(this.target)f.target=this.target;return t(a,{key:"25946719f92cd6ab248a1476b069c69cc6d9543a",class:{"btn-host":true,"btn-host--full":this.fullWidth}},t(o,{key:"45fd0a95c28b762c3b2f1efc7064eb04de6a1ae8",class:p,style:this.width?{width:this.width}:undefined,"aria-label":this.ariaLabel,"aria-labelledby":this.ariaLabelledby,"aria-disabled":this.inactive||this.loading||undefined,"aria-busy":this.loading||undefined,onClick:this.handleClick,onMouseEnter:o=>!this.inactive&&!this.loading&&this.dsMouseEnter.emit(o),onMouseLeave:o=>!this.inactive&&!this.loading&&this.dsMouseLeave.emit(o),...f},t("span",{key:"42b19206da99c2f4f307fda73f06f23c7c7714ef",class:"btn__icon",style:{fontSize:`${n}px`,display:l?undefined:"none"}},this.loading?t("ds-loader",{size:n}):t("slot",{name:"icon"})),s&&t("span",{key:"80a796e7ba3083206d3456262db9f931715d4f81",class:`btn__label ${e}`},this.label),this.dropdown&&t("svg",{key:"fbac0f718e17b8aafe91a72fde2271d8404855de",class:"btn__chevron",width:n,height:n,viewBox:"0 0 20 20",fill:"none","aria-hidden":"true"},t("path",{key:"b10b8a3ac3b99d3e20c53d4270dff387fef30fc8",d:"M5 7.5L10 12.5L15 7.5",stroke:"currentColor","stroke-width":"1.5","stroke-linecap":"round","stroke-linejoin":"round"})),this.badgeCount!=null&&this.badgeCount>0&&t("span",{key:"13cc06cf71d98442ef9137c3867bdb7a615cb9d2",class:"btn__badge"},this.badgeCount>9?"+":this.badgeCount)))}get el(){return this}static get style(){return s()}},[262,"ds-button",{variant:[1],intent:[1],size:[1],label:[1],rounded:[4],fullWidth:[4,"full-width"],width:[1],contrast:[1],background:[1],dropdown:[4],badgeCount:[2,"badge-count"],elevation:[1],loading:[4],inactive:[4],href:[1],target:[1],type:[1],ariaLabel:[1,"aria-label"],ariaLabelledby:[1,"aria-labelledby"],hasIcon:[32]}]);function u(o){return o.charAt(0).toUpperCase()+o.slice(1)}function b(){if(typeof customElements==="undefined"){return}const o=["ds-button","ds-loader"];o.forEach((o=>{switch(o){case"ds-button":if(!customElements.get(e(o))){customElements.define(e(o),l)}break;case"ds-loader":if(!customElements.get(e(o))){i()}break}}))}b();export{l as B,b as d};
-//# sourceMappingURL=p--YDw8Q4o.js.map
+import{p as o,H as r,c as n,h as t,a,t as e}from"./index.js";import{d as i}from"./p-DTjpgYJV.js";const s=()=>`.btn-host.sc-ds-button{display:inline-block}.btn-host--full.sc-ds-button{display:block;width:100%}.btn.sc-ds-button{display:inline-flex;align-items:center;justify-content:center;border:none;border-radius:var(--dimension-radius-050);cursor:pointer;position:relative;transition:transform var(--effect-motion-short-2);height:var(--dimension-size-400);font-family:inherit;color:var(--color-foreground-primary);background:transparent;box-sizing:border-box;text-decoration:none;user-select:none;outline:none;width:100%;--_hover-bg:var(--color-interaction-hover);--_pressed-bg:var(--color-interaction-pressed);--_border:var(--color-border-tertiary)}.btn.sc-ds-button:focus-visible{outline:var(--dimension-stroke-width-025) solid var(--color-interaction-focus);outline-offset:var(--dimension-space-025)}.btn.sc-ds-button:hover:not(.inactive){background-color:var(--_hover-bg)}.btn.sc-ds-button:active:not(.inactive){background-color:var(--_pressed-bg);transform:scale(var(--dimension-scale-subtle))}.onMedium.sc-ds-button{--_hover-bg:var(--color-interaction-on-medium-background-hover);--_pressed-bg:var(--color-interaction-on-medium-background-pressed);--_border:var(--color-border-on-medium-background-tertiary)}.onBold.sc-ds-button{--_hover-bg:var(--color-interaction-on-bold-background-hover);--_pressed-bg:var(--color-interaction-on-bold-background-pressed);--_border:var(--color-border-on-bold-background-tertiary)}.onStrong.sc-ds-button{--_hover-bg:var(--color-interaction-on-strong-background-hover);--_pressed-bg:var(--color-interaction-on-strong-background-pressed);--_border:var(--color-border-on-strong-background-tertiary)}.onAlwaysDark.sc-ds-button{--_hover-bg:var(--color-always-dark-interaction-hover);--_pressed-bg:var(--color-always-dark-interaction-pressed);--_border:var(--color-always-dark-border-tertiary)}.primary.sc-ds-button{color:var(--color-foreground-on-bold-background-primary)}.primary.intentNone.sc-ds-button{background-color:var(--color-inverted-background);color:var(--color-inverted-foreground-primary);--_hover-bg:color-mix(in oklch, var(--color-inverted-background) 90%, var(--color-inverted-foreground-primary));--_pressed-bg:color-mix(in oklch, var(--color-inverted-background) 85%, var(--color-inverted-foreground-primary));--_border:var(--color-inverted-border-tertiary)}.primary.sc-ds-button:not(.intentNone){background-color:var(--_bg);--_hover-bg:color-mix(in oklch, var(--_bg) 85%, var(--color-foreground-on-bold-background-primary));--_pressed-bg:color-mix(in oklch, var(--_bg) 80%, var(--color-foreground-on-bold-background-primary))}.primary.intentBrand.sc-ds-button{--_bg:var(--color-background-bold-brand);color:var(--color-foreground-faint-brand)}.primary.intentNeutral.sc-ds-button{--_bg:var(--color-background-bold-neutral);color:var(--color-foreground-faint-neutral)}.primary.intentPositive.sc-ds-button{--_bg:var(--color-background-bold-positive);color:var(--color-foreground-faint-positive)}.primary.intentNegative.sc-ds-button{--_bg:var(--color-background-bold-negative);color:var(--color-foreground-faint-negative)}.primary.intentWarning.sc-ds-button{--_bg:var(--color-background-bold-warning);color:var(--color-foreground-faint-warning)}.primary.intentCaution.sc-ds-button{--_bg:var(--color-background-bold-caution);color:var(--color-foreground-faint-caution)}.primary.intentAi.sc-ds-button{--_bg:var(--color-background-bold-ai);color:var(--color-foreground-faint-ai)}.primary.contrastMedium.sc-ds-button{--_hover-bg:color-mix(in oklch, var(--_bg) 85%, var(--color-foreground-primary));--_pressed-bg:color-mix(in oklch, var(--_bg) 80%, var(--color-foreground-primary))}.primary.contrastMedium.intentBrand.sc-ds-button{--_bg:var(--color-background-medium-brand);color:var(--color-foreground-strong-brand)}.primary.contrastMedium.intentNeutral.sc-ds-button{--_bg:var(--color-background-medium-neutral);color:var(--color-foreground-strong-neutral)}.primary.contrastMedium.intentPositive.sc-ds-button{--_bg:var(--color-background-medium-positive);color:var(--color-foreground-strong-positive)}.primary.contrastMedium.intentNegative.sc-ds-button{--_bg:var(--color-background-medium-negative);color:var(--color-foreground-strong-negative)}.primary.contrastMedium.intentWarning.sc-ds-button{--_bg:var(--color-background-medium-warning);color:var(--color-foreground-strong-warning)}.primary.contrastMedium.intentCaution.sc-ds-button{--_bg:var(--color-background-medium-caution);color:var(--color-foreground-strong-caution)}.primary.contrastMedium.intentAi.sc-ds-button{--_bg:var(--color-background-medium-ai);color:var(--color-foreground-strong-ai)}.primary.contrastStrong.sc-ds-button{--_hover-bg:color-mix(in oklch, var(--_bg) 90%, var(--color-foreground-on-bold-background-primary));--_pressed-bg:color-mix(in oklch, var(--_bg) 85%, var(--color-foreground-on-bold-background-primary))}.primary.contrastStrong.intentBrand.sc-ds-button{--_bg:var(--color-background-strong-brand);color:var(--color-foreground-medium-brand)}.primary.contrastStrong.intentNeutral.sc-ds-button{--_bg:var(--color-background-strong-neutral);color:var(--color-foreground-medium-neutral)}.primary.contrastStrong.intentPositive.sc-ds-button{--_bg:var(--color-background-strong-positive);color:var(--color-foreground-medium-positive)}.primary.contrastStrong.intentNegative.sc-ds-button{--_bg:var(--color-background-strong-negative);color:var(--color-foreground-medium-negative)}.primary.contrastStrong.intentWarning.sc-ds-button{--_bg:var(--color-background-strong-warning);color:var(--color-foreground-medium-warning)}.primary.contrastStrong.intentCaution.sc-ds-button{--_bg:var(--color-background-strong-caution);color:var(--color-foreground-medium-caution)}.primary.contrastStrong.intentAi.sc-ds-button{--_bg:var(--color-background-strong-ai);color:var(--color-foreground-medium-ai)}.primary.contrastFaint.sc-ds-button{--_hover-bg:color-mix(in oklch, var(--_bg) 90%, var(--color-foreground-primary));--_pressed-bg:color-mix(in oklch, var(--_bg) 85%, var(--color-foreground-primary))}.primary.contrastFaint.intentBrand.sc-ds-button{--_bg:var(--color-background-faint-brand);color:var(--color-foreground-bold-brand)}.primary.contrastFaint.intentNeutral.sc-ds-button{--_bg:var(--color-background-faint-neutral);color:var(--color-foreground-bold-neutral)}.primary.contrastFaint.intentPositive.sc-ds-button{--_bg:var(--color-background-faint-positive);color:var(--color-foreground-bold-positive)}.primary.contrastFaint.intentNegative.sc-ds-button{--_bg:var(--color-background-faint-negative);color:var(--color-foreground-bold-negative)}.primary.contrastFaint.intentWarning.sc-ds-button{--_bg:var(--color-background-faint-warning);color:var(--color-foreground-bold-warning)}.primary.contrastFaint.intentCaution.sc-ds-button{--_bg:var(--color-background-faint-caution);color:var(--color-foreground-bold-caution)}.primary.contrastFaint.intentAi.sc-ds-button{--_bg:var(--color-background-faint-ai);color:var(--color-foreground-bold-ai)}.primary.intentNone.onStrong.sc-ds-button,.primary.intentNone.onAlwaysDark.sc-ds-button{background-color:var(--color-background-primary);color:var(--color-foreground-primary);--_hover-bg:color-mix(in oklch, var(--color-background-primary) 90%, var(--color-foreground-primary));--_pressed-bg:color-mix(in oklch, var(--color-background-primary) 85%, var(--color-foreground-primary));--_border:var(--color-border-tertiary)}.secondary.sc-ds-button{background-color:transparent;color:var(--color-foreground-secondary)}.secondary.intentBrand.sc-ds-button{color:var(--color-foreground-bold-brand)}.secondary.intentNeutral.sc-ds-button{color:var(--color-foreground-bold-neutral)}.secondary.intentPositive.sc-ds-button{color:var(--color-foreground-bold-positive)}.secondary.intentNegative.sc-ds-button{color:var(--color-foreground-bold-negative)}.secondary.intentWarning.sc-ds-button{color:var(--color-foreground-bold-warning)}.secondary.intentCaution.sc-ds-button{color:var(--color-foreground-bold-caution)}.secondary.intentAi.sc-ds-button{color:var(--color-foreground-bold-ai)}.secondary.onMedium.sc-ds-button{color:var(--color-foreground-primary)}.secondary.onMedium.intentBrand.sc-ds-button{color:var(--color-foreground-strong-brand)}.secondary.onMedium.intentNeutral.sc-ds-button{color:var(--color-foreground-strong-neutral)}.secondary.onMedium.intentPositive.sc-ds-button{color:var(--color-foreground-strong-positive)}.secondary.onMedium.intentNegative.sc-ds-button{color:var(--color-foreground-strong-negative)}.secondary.onMedium.intentWarning.sc-ds-button{color:var(--color-foreground-strong-warning)}.secondary.onMedium.intentCaution.sc-ds-button{color:var(--color-foreground-strong-caution)}.secondary.onMedium.intentAi.sc-ds-button{color:var(--color-foreground-strong-ai)}.secondary.onBold.sc-ds-button{color:var(--color-foreground-on-bold-background-secondary)}.secondary.onBold.intentBrand.sc-ds-button{color:var(--color-foreground-faint-brand)}.secondary.onBold.intentNeutral.sc-ds-button{color:var(--color-foreground-faint-neutral)}.secondary.onBold.intentPositive.sc-ds-button{color:var(--color-foreground-faint-positive)}.secondary.onBold.intentNegative.sc-ds-button{color:var(--color-foreground-faint-negative)}.secondary.onBold.intentWarning.sc-ds-button{color:var(--color-foreground-faint-warning)}.secondary.onBold.intentCaution.sc-ds-button{color:var(--color-foreground-faint-caution)}.secondary.onBold.intentAi.sc-ds-button{color:var(--color-foreground-faint-ai)}.secondary.onAlwaysDark.sc-ds-button{color:var(--color-always-dark-foreground-secondary)}.secondary.onAlwaysDark.intentBrand.sc-ds-button{color:var(--color-always-dark-foreground-brand)}.secondary.onAlwaysDark.intentNeutral.sc-ds-button{color:var(--color-always-dark-foreground-neutral)}.secondary.onAlwaysDark.intentPositive.sc-ds-button{color:var(--color-always-dark-foreground-positive)}.secondary.onAlwaysDark.intentNegative.sc-ds-button{color:var(--color-always-dark-foreground-negative)}.secondary.onAlwaysDark.intentWarning.sc-ds-button{color:var(--color-always-dark-foreground-warning)}.secondary.onAlwaysDark.intentCaution.sc-ds-button{color:var(--color-always-dark-foreground-caution)}.secondary.onAlwaysDark.intentAi.sc-ds-button{color:var(--color-always-dark-foreground-ai)}.secondary.onStrong.sc-ds-button{color:var(--color-foreground-on-bold-background-secondary)}.secondary.onStrong.intentBrand.sc-ds-button{color:var(--color-foreground-faint-brand)}.secondary.onStrong.intentNeutral.sc-ds-button{color:var(--color-foreground-faint-neutral)}.secondary.onStrong.intentPositive.sc-ds-button{color:var(--color-foreground-faint-positive)}.secondary.onStrong.intentNegative.sc-ds-button{color:var(--color-foreground-faint-negative)}.secondary.onStrong.intentWarning.sc-ds-button{color:var(--color-foreground-faint-warning)}.secondary.onStrong.intentCaution.sc-ds-button{color:var(--color-foreground-faint-caution)}.secondary.onStrong.intentAi.sc-ds-button{color:var(--color-foreground-faint-ai)}.secondary.elevationFlat.sc-ds-button{box-shadow:inset 0 0 0 1px var(--_border)}.secondary.elevationElevated.sc-ds-button{background-color:var(--color-background-primary);box-shadow:var(--effect-elevation-elevated-sm);--_hover-bg:color-mix(in oklch, var(--color-background-primary) 90%, var(--color-foreground-primary));--_pressed-bg:color-mix(in oklch, var(--color-background-primary) 85%, var(--color-foreground-primary))}.secondary.elevationFloating.sc-ds-button{background-color:var(--color-background-primary);box-shadow:var(--effect-elevation-elevated-floating);--_hover-bg:color-mix(in oklch, var(--color-background-primary) 90%, var(--color-foreground-primary));--_pressed-bg:color-mix(in oklch, var(--color-background-primary) 85%, var(--color-foreground-primary))}.primary.elevationElevated.sc-ds-button{box-shadow:var(--effect-elevation-elevated-sm)}.primary.elevationNone.sc-ds-button{box-shadow:none}.primary.elevationFlat.sc-ds-button{box-shadow:inset 0 0 0 1px var(--_border)}.primary.intentNone.elevationFlat.sc-ds-button{--_border:var(--color-border-tertiary)}.primary.elevationFloating.sc-ds-button{box-shadow:var(--effect-elevation-elevated-floating) !important}.iconOnly.sc-ds-button{padding:0;width:var(--dimension-size-400);min-width:var(--dimension-size-400)}.labelOnly.sc-ds-button{padding:0 var(--dimension-space-100)}.iconAndLabel.sc-ds-button{padding:0 var(--dimension-space-100) 0 var(--dimension-space-075);gap:var(--dimension-space-025)}.dropdown.sc-ds-button{gap:var(--dimension-space-050)}.sizeSM.sc-ds-button{height:var(--dimension-size-300)}.sizeSM.iconOnly.sc-ds-button{width:var(--dimension-size-300);min-width:var(--dimension-size-300)}.sizeSM.labelOnly.sc-ds-button{padding:0 var(--dimension-space-075)}.sizeSM.iconAndLabel.sc-ds-button{padding:0 var(--dimension-space-075) 0 var(--dimension-space-050);gap:1px}.sizeXS.sc-ds-button{height:var(--dimension-size-200)}.sizeXS.iconOnly.sc-ds-button{width:var(--dimension-size-200);min-width:var(--dimension-size-200)}.sizeXS.labelOnly.sc-ds-button,.sizeXS.iconAndLabel.sc-ds-button{padding:0 var(--dimension-space-025);gap:0}.sizeLG.sc-ds-button{height:var(--dimension-size-500)}.sizeLG.iconOnly.sc-ds-button{width:var(--dimension-size-500);min-width:var(--dimension-size-500)}.sizeLG.labelOnly.sc-ds-button{padding:0 var(--dimension-space-150)}.sizeLG.iconAndLabel.sc-ds-button{padding:0 var(--dimension-space-150) 0 var(--dimension-space-100);gap:var(--dimension-space-075)}.rounded.sc-ds-button{border-radius:var(--dimension-radius-half)}.rounded.labelOnly.sc-ds-button{padding-left:calc(var(--dimension-space-100) + var(--dimension-space-050));padding-right:calc(var(--dimension-space-100) + var(--dimension-space-050))}.rounded.iconAndLabel.sc-ds-button{padding-left:calc(var(--dimension-space-075) + var(--dimension-space-050));padding-right:calc(var(--dimension-space-100) + var(--dimension-space-050))}.rounded.sizeSM.labelOnly.sc-ds-button{padding-left:calc(var(--dimension-space-075) + var(--dimension-space-050));padding-right:calc(var(--dimension-space-075) + var(--dimension-space-050))}.rounded.sizeSM.iconAndLabel.sc-ds-button{padding-left:calc(var(--dimension-space-050) + var(--dimension-space-050));padding-right:calc(var(--dimension-space-075) + var(--dimension-space-050))}.rounded.sizeLG.labelOnly.sc-ds-button{padding-left:calc(var(--dimension-space-150) + var(--dimension-space-050));padding-right:calc(var(--dimension-space-150) + var(--dimension-space-050))}.rounded.sizeLG.iconAndLabel.sc-ds-button{padding-left:calc(var(--dimension-space-100) + var(--dimension-space-050));padding-right:calc(var(--dimension-space-150) + var(--dimension-space-050))}.inactive.sc-ds-button{opacity:0.5;cursor:not-allowed;pointer-events:none}.fullWidth.sc-ds-button{display:flex;width:100%}.btn__icon.sc-ds-button{display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;line-height:0}.btn__label.sc-ds-button{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.btn__chevron.sc-ds-button{flex-shrink:0}.btn__badge.sc-ds-button{position:absolute;top:var(--dimension-space-025);right:var(--dimension-space-025);font-size:var(--typography-fontsize-xs);font-weight:var(--typography-weight-semibold);line-height:var(--typography-lineheight-xs);color:var(--color-foreground-secondary);pointer-events:none;z-index:10}`;const d={xs:12,sm:16,md:20,lg:24};const c={xs:"text-caption-emphasis",sm:"text-body-small-emphasis",md:"text-body-medium-emphasis",lg:"text-body-large-emphasis"};const l=o(class o extends r{constructor(o){super();if(o!==false){this.__registerHost()}this.dsClick=n(this,"dsClick");this.dsMouseEnter=n(this,"dsMouseEnter");this.dsMouseLeave=n(this,"dsMouseLeave");this.variant="primary";this.intent="brand";this.size="md";this.rounded=false;this.fullWidth=false;this.contrast="bold";this.dropdown=false;this.loading=false;this.inactive=false;this.type="button";this.hasIcon=false;this.handleClick=o=>{if(this.inactive||this.loading)return;this.dsClick.emit(o)}}componentWillLoad(){this.hasIcon=!!this.el.querySelector('[slot="icon"]')}get effectiveElevation(){return this.elevation??(this.variant==="primary"?"none":"flat")}render(){const o=this.href?"a":"button";const r=this.size;const n=d[r];const e=c[r];const i=this.effectiveElevation;const s=!!this.label;const l=this.hasIcon||this.loading;const b=l&&!s;const g=s&&!l;const v=l&&s;const m=this.background;const p={btn:true,[this.variant]:true,[`intent${u(this.intent)}`]:true,[`size${r.toUpperCase()}`]:r!=="md",rounded:this.rounded,inactive:this.inactive||this.loading,iconOnly:b,labelOnly:g,iconAndLabel:v,dropdown:this.dropdown,[`contrast${u(this.contrast)}`]:this.variant==="primary"&&this.intent!=="none"&&this.contrast!=="bold",[`elevation${u(i)}`]:true,onMedium:m==="medium",onBold:m==="bold",onStrong:m==="strong",onAlwaysDark:m==="always-dark",fullWidth:this.fullWidth};const f={};if(o==="button"){f.type=this.type;f.disabled=this.inactive||this.loading}if(this.href)f.href=this.href;if(this.target)f.target=this.target;return t(a,{key:"25946719f92cd6ab248a1476b069c69cc6d9543a",class:{"btn-host":true,"btn-host--full":this.fullWidth}},t(o,{key:"45fd0a95c28b762c3b2f1efc7064eb04de6a1ae8",class:p,style:this.width?{width:this.width}:undefined,"aria-label":this.ariaLabel,"aria-labelledby":this.ariaLabelledby,"aria-disabled":this.inactive||this.loading||undefined,"aria-busy":this.loading||undefined,onClick:this.handleClick,onMouseEnter:o=>!this.inactive&&!this.loading&&this.dsMouseEnter.emit(o),onMouseLeave:o=>!this.inactive&&!this.loading&&this.dsMouseLeave.emit(o),...f},t("span",{key:"42b19206da99c2f4f307fda73f06f23c7c7714ef",class:"btn__icon",style:{fontSize:`${n}px`,display:l?undefined:"none"}},this.loading?t("ds-loader",{size:n}):t("slot",{name:"icon"})),s&&t("span",{key:"80a796e7ba3083206d3456262db9f931715d4f81",class:`btn__label ${e}`},this.label),this.dropdown&&t("svg",{key:"fbac0f718e17b8aafe91a72fde2271d8404855de",class:"btn__chevron",width:n,height:n,viewBox:"0 0 20 20",fill:"none","aria-hidden":"true"},t("path",{key:"b10b8a3ac3b99d3e20c53d4270dff387fef30fc8",d:"M5 7.5L10 12.5L15 7.5",stroke:"currentColor","stroke-width":"1.5","stroke-linecap":"round","stroke-linejoin":"round"})),this.badgeCount!=null&&this.badgeCount>0&&t("span",{key:"13cc06cf71d98442ef9137c3867bdb7a615cb9d2",class:"btn__badge"},this.badgeCount>9?"+":this.badgeCount)))}get el(){return this}static get style(){return s()}},[262,"ds-button",{variant:[1],intent:[1],size:[1],label:[1],rounded:[4],fullWidth:[4,"full-width"],width:[1],contrast:[1],background:[1],dropdown:[4],badgeCount:[2,"badge-count"],elevation:[1],loading:[4],inactive:[4],href:[1],target:[1],type:[1],ariaLabel:[1,"aria-label"],ariaLabelledby:[1,"aria-labelledby"],hasIcon:[32]}]);function u(o){return o.charAt(0).toUpperCase()+o.slice(1)}function b(){if(typeof customElements==="undefined"){return}const o=["ds-button","ds-loader"];o.forEach((o=>{switch(o){case"ds-button":if(!customElements.get(e(o))){customElements.define(e(o),l)}break;case"ds-loader":if(!customElements.get(e(o))){i()}break}}))}b();export{l as B,b as d};
+//# sourceMappingURL=p-CsO880L-.js.map

package/dist/components/p-DTjpgYJV.js

@@ -0,0 +1,2 @@
+import{p as s,H as e,h as t,t as i}from"./index.js";import{T as r}from"./p-BRju0sEC.js";import{r as n}from"./p-CYJ-de0u.js";const a=()=>`:host{display:inline-flex;align-items:center;flex-shrink:0}.spinner{flex-shrink:0;animation:spin 0.75s linear infinite}.status{display:inline-flex;align-items:center}.visually-hidden{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0, 0, 0, 0);white-space:nowrap;border:0}@keyframes spin{from{transform:rotate(0deg)}to{transform:rotate(360deg)}}`;const o=s(class s extends e{constructor(s){super();if(s!==false){this.__registerHost()}this.__attachShadow();this.size=r.iconographyMd}get sizePx(){return n(this.size,r.iconographyMd)}render(){const s=`${this.sizePx}px`;const e=t("svg",{style:{width:s,height:s},viewBox:"0 0 16 16",fill:"none",class:"spinner","aria-hidden":"true"},t("circle",{cx:"8",cy:"8",r:"5",stroke:"currentColor","stroke-width":"1","stroke-linecap":"round","stroke-dasharray":"23.6 7.9"}));if(!this.label)return e;return t("span",{role:"status","aria-live":"polite",class:"status"},e,t("span",{class:"visually-hidden"},this.label))}static get style(){return a()}},[1,"ds-loader",{size:[8],label:[1]}]);function l(){if(typeof customElements==="undefined"){return}const s=["ds-loader"];s.forEach((s=>{switch(s){case"ds-loader":if(!customElements.get(i(s))){customElements.define(i(s),o)}break}}))}l();export{o as L,l as d};
+//# sourceMappingURL=p-DTjpgYJV.js.map

package/dist/components/p-DTjpgYJV.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["loaderCss","Loader","__stencil_proxyCustomElement","HTMLElement","constructor","registerHost","this","size","TOKEN_DEFAULTS","iconographyMd","sizePx","resolveCssLengthPx","render","px","svg","h","style","width","height","viewBox","fill","class","cx","cy","r","stroke","label","role"],"sources":["src/wc/components/Loader/Loader.css?tag=ds-loader&encapsulation=shadow","src/wc/components/Loader/Loader.tsx"],"sourcesContent":[":host {\n  display: inline-flex;\n  align-items: center;\n  flex-shrink: 0;\n}\n\n.spinner {\n  flex-shrink: 0;\n  animation: spin 0.75s linear infinite;\n}\n\n.status {\n  display: inline-flex;\n  align-items: center;\n}\n\n.visually-hidden {\n  position: absolute;\n  width: 1px;\n  height: 1px;\n  padding: 0;\n  margin: -1px;\n  overflow: hidden;\n  clip: rect(0, 0, 0, 0);\n  white-space: nowrap;\n  border: 0;\n}\n\n@keyframes spin {\n  from { transform: rotate(0deg); }\n  to   { transform: rotate(360deg); }\n}\n","import { Component, Prop, h } from '@stencil/core';\nimport { resolveCssLengthPx, TOKEN_DEFAULTS } from '../../utils';\n\n@Component({\n  tag: 'ds-loader',\n  styleUrl: 'Loader.css',\n  shadow: true,\n})\nexport class Loader {\n  /** Render size — number (px) or TokoMo length (`var(--dimension-iconography-md)`, etc.). */\n  @Prop() size: number | string = TOKEN_DEFAULTS.iconographyMd;\n  /**\n   * Accessible label for standalone usage. Wraps the spinner in a live region\n   * and renders the label visually-hidden. Omit when the host element already\n   * conveys busy state via aria-busy.\n   */\n  @Prop() label: string | undefined;\n\n  private get sizePx(): number {\n    return resolveCssLengthPx(this.size, TOKEN_DEFAULTS.iconographyMd);\n  }\n\n  render() {\n    const px = `${this.sizePx}px`;\n    const svg = (\n      <svg\n        style={{ width: px, height: px }}\n        viewBox=\"0 0 16 16\"\n        fill=\"none\"\n        class=\"spinner\"\n        aria-hidden=\"true\"\n      >\n        <circle\n          cx=\"8\" cy=\"8\" r=\"5\"\n          stroke=\"currentColor\"\n          stroke-width=\"1\"\n          stroke-linecap=\"round\"\n          stroke-dasharray=\"23.6 7.9\"\n        />\n      </svg>\n    );\n\n    if (!this.label) return svg;\n\n    return (\n      <span role=\"status\" aria-live=\"polite\" class=\"status\">\n        {svg}\n        <span class=\"visually-hidden\">{this.label}</span>\n      </span>\n    );\n  }\n}\n"],"mappings":"4HAAA,MAAMA,EAAY,IAAM,kY,MCQXC,EAAMC,EAAA,MAAAD,UAAAE,EALnB,WAAAC,CAAAC,G,kEAOUC,KAAAC,KAAwBC,EAAeC,aAyChD,CAjCC,UAAYC,GACV,OAAOC,EAAmBL,KAAKC,KAAMC,EAAeC,c,CAGtD,MAAAG,GACE,MAAMC,EAAK,GAAGP,KAAKI,WACnB,MAAMI,EACJC,EAAA,OACEC,MAAO,CAAEC,MAAOJ,EAAIK,OAAQL,GAC5BM,QAAQ,YACRC,KAAK,OACLC,MAAM,UAAS,cACH,QAEZN,EAAA,UACEO,GAAG,IAAIC,GAAG,IAAIC,EAAE,IAChBC,OAAO,eAAc,eACR,IAAG,iBACD,QAAO,mBACL,cAKvB,IAAKnB,KAAKoB,MAAO,OAAOZ,EAExB,OACEC,EAAA,QAAMY,KAAK,SAAQ,YAAW,SAASN,MAAM,UAC1CP,EACDC,EAAA,QAAMM,MAAM,mBAAmBf,KAAKoB,O","ignoreList":[]}

package/dist/components/p-DfL2MOso.js

@@ -0,0 +1,2 @@
+import{p as t}from"./p-BvmooLHV.js";const n="ds-shell-bar-nav";const o="ds-shell-nav-vt-style";function e(){if(typeof document==="undefined")return;if(document.getElementById(o))return;const t=document.createElement("style");t.id=o;t.textContent=["::view-transition-old(root),::view-transition-new(root){animation:none;mix-blend-mode:normal}",`::view-transition-old(${n}),::view-transition-new(${n}){animation:none;mix-blend-mode:normal}`,"::view-transition-new(root){clip-path:circle(0px at var(--vt-x,50%) var(--vt-y,50%))}",`::view-transition-new(${n}){clip-path:circle(0px at var(--vt-x,50%) var(--vt-y,50%))}`].join("\n");document.head.appendChild(t)}function i(t){const n=t??document.querySelector(".panel-nav__footer-btn");const o=n?.getBoundingClientRect();const e=o?Math.round(o.left+o.width/2):Math.round(window.innerWidth/2);const i=o?Math.round(o.top+o.height/2):Math.round(window.innerHeight/2);const a=Math.ceil(Math.hypot(Math.max(e,window.innerWidth-e),Math.max(i,window.innerHeight-i)));return{x:e,y:i,maxRadius:a}}function a(t){document.documentElement.style.setProperty("--vt-x",`${t.x}px`);document.documentElement.style.setProperty("--vt-y",`${t.y}px`)}function s(o,e){const i=getComputedStyle(document.documentElement).getPropertyValue("--effect-animation-duration-long-1").trim();const a=t(i,750);const s={clipPath:[`circle(0px at ${o.x}px ${o.y}px)`,`circle(${o.maxRadius}px at ${o.x}px ${o.y}px)`]};const c={duration:a,easing:"ease-in-out",fill:"forwards"};document.documentElement.animate(s,{...c,pseudoElement:"::view-transition-new(root)"});document.documentElement.animate(s,{...c,pseudoElement:`::view-transition-new(${n})`})}export{n as S,s as a,e,i as r,a as s};
+//# sourceMappingURL=p-DfL2MOso.js.map

package/dist/components/p-DfL2MOso.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["SHELL_BAR_NAV_VT_NAME","VT_STYLE_ID","ensureShellNavVtStyle","document","getElementById","style","createElement","id","textContent","join","head","appendChild","resolveShellNavRevealOrigin","originEl","btn","querySelector","rect","getBoundingClientRect","x","Math","round","left","width","window","innerWidth","y","top","height","innerHeight","maxRadius","ceil","hypot","max","setShellNavRevealOriginVars","origin","documentElement","setProperty","animateShellNavRadialReveal","durationMs","durToken","getComputedStyle","getPropertyValue","trim","duration","parseCssTimeMs","keyframes","clipPath","options","easing","fill","animate","pseudoElement"],"sources":["src/wc/nav/shell-view-transition.ts"],"sourcesContent":["import { parseCssTimeMs } from '../utils/resolve-css-time-ms';\n\n/** `view-transition-name` on `ds-bar-nav` — pairs with root reveal in shell apps. */\nexport const SHELL_BAR_NAV_VT_NAME = 'ds-shell-bar-nav';\n\nexport { parseCssTimeMs };\n\nconst VT_STYLE_ID = 'ds-shell-nav-vt-style';\n\n/** Suppress default cross-fade and pin new snapshots to a 0px circle for WAAPI reveal. */\nexport function ensureShellNavVtStyle(): void {\n  if (typeof document === 'undefined') return;\n  if (document.getElementById(VT_STYLE_ID)) return;\n\n  const style = document.createElement('style');\n  style.id = VT_STYLE_ID;\n  style.textContent = [\n    '::view-transition-old(root),::view-transition-new(root){animation:none;mix-blend-mode:normal}',\n    `::view-transition-old(${SHELL_BAR_NAV_VT_NAME}),::view-transition-new(${SHELL_BAR_NAV_VT_NAME}){animation:none;mix-blend-mode:normal}`,\n    '::view-transition-new(root){clip-path:circle(0px at var(--vt-x,50%) var(--vt-y,50%))}',\n    `::view-transition-new(${SHELL_BAR_NAV_VT_NAME}){clip-path:circle(0px at var(--vt-x,50%) var(--vt-y,50%))}`,\n  ].join('\\n');\n  document.head.appendChild(style);\n}\n\nexport interface ShellNavRevealOrigin {\n  x: number;\n  y: number;\n  maxRadius: number;\n}\n\n/** Origin for the radial reveal — defaults to panel-nav footer gear, then viewport center. */\nexport function resolveShellNavRevealOrigin(originEl?: HTMLElement | null): ShellNavRevealOrigin {\n  const btn =\n    originEl ??\n    document.querySelector<HTMLElement>('.panel-nav__footer-btn');\n  const rect = btn?.getBoundingClientRect();\n  const x = rect ? Math.round(rect.left + rect.width / 2) : Math.round(window.innerWidth / 2);\n  const y = rect ? Math.round(rect.top + rect.height / 2) : Math.round(window.innerHeight / 2);\n  const maxRadius = Math.ceil(\n    Math.hypot(Math.max(x, window.innerWidth - x), Math.max(y, window.innerHeight - y)),\n  );\n  return { x, y, maxRadius };\n}\n\nexport function setShellNavRevealOriginVars(origin: ShellNavRevealOrigin): void {\n  document.documentElement.style.setProperty('--vt-x', `${origin.x}px`);\n  document.documentElement.style.setProperty('--vt-y', `${origin.y}px`);\n}\n\n/** Animate root + bar-nav snapshots with the same radial clip-path reveal. */\nexport function animateShellNavRadialReveal(\n  origin: ShellNavRevealOrigin,\n  durationMs?: number,\n): void {\n  const durToken = getComputedStyle(document.documentElement)\n    .getPropertyValue('--effect-animation-duration-long-1')\n    .trim();\n  const duration = durationMs ?? parseCssTimeMs(durToken, 750);\n  const keyframes = {\n    clipPath: [\n      `circle(0px at ${origin.x}px ${origin.y}px)`,\n      `circle(${origin.maxRadius}px at ${origin.x}px ${origin.y}px)`,\n    ],\n  };\n  const options = {\n    duration,\n    easing: 'ease-in-out',\n    fill: 'forwards' as const,\n  };\n\n  document.documentElement.animate(keyframes, {\n    ...options,\n    pseudoElement: '::view-transition-new(root)',\n  });\n  document.documentElement.animate(keyframes, {\n    ...options,\n    pseudoElement: `::view-transition-new(${SHELL_BAR_NAV_VT_NAME})`,\n  });\n}\n\n/** Run radial reveal when a view transition's `ready` promise settles (app/router driver). */\nexport function runShellNavStyleRevealOnReady(\n  transition: { ready: Promise<void> },\n  originEl?: HTMLElement | null,\n): void {\n  ensureShellNavVtStyle();\n  const origin = resolveShellNavRevealOrigin(originEl);\n  setShellNavRevealOriginVars(origin);\n\n  transition.ready\n    .then(() => animateShellNavRadialReveal(origin))\n    .catch(() => {\n      /* transition skipped or superseded */\n    });\n}\n"],"mappings":"oCAGO,MAAMA,EAAwB,mBAIrC,MAAMC,EAAc,wB,SAGJC,IACd,UAAWC,WAAa,YAAa,OACrC,GAAIA,SAASC,eAAeH,GAAc,OAE1C,MAAMI,EAAQF,SAASG,cAAc,SACrCD,EAAME,GAAKN,EACXI,EAAMG,YAAc,CAClB,gGACA,yBAAyBR,4BAAgDA,2CACzE,wFACA,yBAAyBA,gEACzBS,KAAK,MACPN,SAASO,KAAKC,YAAYN,EAC5B,CASM,SAAUO,EAA4BC,GAC1C,MAAMC,EACJD,GACAV,SAASY,cAA2B,0BACtC,MAAMC,EAAOF,GAAKG,wBAClB,MAAMC,EAAIF,EAAOG,KAAKC,MAAMJ,EAAKK,KAAOL,EAAKM,MAAQ,GAAKH,KAAKC,MAAMG,OAAOC,WAAa,GACzF,MAAMC,EAAIT,EAAOG,KAAKC,MAAMJ,EAAKU,IAAMV,EAAKW,OAAS,GAAKR,KAAKC,MAAMG,OAAOK,YAAc,GAC1F,MAAMC,EAAYV,KAAKW,KACrBX,KAAKY,MAAMZ,KAAKa,IAAId,EAAGK,OAAOC,WAAaN,GAAIC,KAAKa,IAAIP,EAAGF,OAAOK,YAAcH,KAElF,MAAO,CAAEP,IAAGO,IAAGI,YACjB,CAEM,SAAUI,EAA4BC,GAC1C/B,SAASgC,gBAAgB9B,MAAM+B,YAAY,SAAU,GAAGF,EAAOhB,OAC/Df,SAASgC,gBAAgB9B,MAAM+B,YAAY,SAAU,GAAGF,EAAOT,MACjE,CAGM,SAAUY,EACdH,EACAI,GAEA,MAAMC,EAAWC,iBAAiBrC,SAASgC,iBACxCM,iBAAiB,sCACjBC,OACH,MAAMC,EAAyBC,EAAeL,EAAU,KACxD,MAAMM,EAAY,CAChBC,SAAU,CACR,iBAAiBZ,EAAOhB,OAAOgB,EAAOT,OACtC,UAAUS,EAAOL,kBAAkBK,EAAOhB,OAAOgB,EAAOT,SAG5D,MAAMsB,EAAU,CACdJ,WACAK,OAAQ,cACRC,KAAM,YAGR9C,SAASgC,gBAAgBe,QAAQL,EAAW,IACvCE,EACHI,cAAe,gCAEjBhD,SAASgC,gBAAgBe,QAAQL,EAAW,IACvCE,EACHI,cAAe,yBAAyBnD,MAE5C,Q","ignoreList":[]}

package/dist/components/p-DiWQFROF.js

@@ -0,0 +1,2 @@
+import{p as o,H as e,c as n,h as s,a as r,t}from"./index.js";import{d as i}from"./p-DqBCQRRd.js";import{r as a}from"./p-CYJ-de0u.js";import{T as d}from"./p-BRju0sEC.js";const c=()=>`.toggle-btn.sc-ds-toggle-button{display:inline-flex;align-items:center;justify-content:center;border:none;border-radius:var(--dimension-radius-050);cursor:pointer;position:relative;transition:transform var(--effect-motion-short-2);height:var(--dimension-size-400);font-family:inherit;background:transparent;box-sizing:border-box;-webkit-user-select:none;user-select:none;--_hover-bg:var(--color-interaction-hover);--_pressed-bg:var(--color-interaction-pressed);--_border:var(--color-border-tertiary)}.toggle-btn.sc-ds-toggle-button:focus-visible{outline:var(--dimension-stroke-width-025) solid var(--color-interaction-focus);outline-offset:var(--dimension-space-025)}.toggle-btn.sc-ds-toggle-button:hover:not(.inactive){background-color:var(--_hover-bg)}.toggle-btn.sc-ds-toggle-button:active:not(.inactive){background-color:var(--_pressed-bg);transform:scale(var(--dimension-scale-subtle))}.onMedium.sc-ds-toggle-button{--_hover-bg:var(--color-interaction-on-medium-background-hover);--_pressed-bg:var(--color-interaction-on-medium-background-pressed);--_border:var(--color-border-on-medium-background-tertiary)}.onBold.sc-ds-toggle-button{--_hover-bg:var(--color-interaction-on-bold-background-hover);--_pressed-bg:var(--color-interaction-on-bold-background-pressed);--_border:var(--color-border-on-bold-background-tertiary)}.onStrong.sc-ds-toggle-button{--_hover-bg:var(--color-interaction-on-strong-background-hover);--_pressed-bg:var(--color-interaction-on-strong-background-pressed);--_border:var(--color-border-on-strong-background-tertiary)}.onAlwaysDark.sc-ds-toggle-button{--_hover-bg:var(--color-always-dark-interaction-hover);--_pressed-bg:var(--color-always-dark-interaction-pressed);--_border:var(--color-always-dark-border-tertiary)}.elevationElevated.sc-ds-toggle-button{background-color:var(--color-background-primary);box-shadow:var(--effect-elevation-elevated-sm);color:var(--color-foreground-secondary);--_hover-bg:color-mix(in oklch, var(--color-background-primary) 90%, var(--color-foreground-primary));--_pressed-bg:color-mix(in oklch, var(--color-background-primary) 85%, var(--color-foreground-primary))}.elevationFlat.sc-ds-toggle-button{box-shadow:inset 0 0 0 1px var(--_border);color:var(--color-foreground-secondary)}.elevationNone.sc-ds-toggle-button{color:var(--color-foreground-secondary)}.elevationFloating.sc-ds-toggle-button{background-color:var(--color-background-primary);box-shadow:var(--effect-elevation-elevated-floating);color:var(--color-foreground-secondary);--_hover-bg:color-mix(in oklch, var(--color-background-primary) 90%, var(--color-foreground-primary));--_pressed-bg:color-mix(in oklch, var(--color-background-primary) 85%, var(--color-foreground-primary))}.onBold.elevationNone.sc-ds-toggle-button,.onBold.elevationFlat.sc-ds-toggle-button,.onStrong.elevationNone.sc-ds-toggle-button,.onStrong.elevationFlat.sc-ds-toggle-button{color:var(--color-foreground-on-bold-background-secondary)}.onAlwaysDark.elevationNone.sc-ds-toggle-button,.onAlwaysDark.elevationFlat.sc-ds-toggle-button{color:var(--color-always-dark-foreground-secondary)}.pressed.sc-ds-toggle-button{background-color:var(--color-background-faint-brand);color:var(--color-foreground-bold-brand)}.iconOnly.sc-ds-toggle-button{padding:0;width:var(--dimension-size-400);min-width:var(--dimension-size-400)}.labelOnly.sc-ds-toggle-button{padding:0 var(--dimension-space-100)}.iconAndLabel.sc-ds-toggle-button{padding:0 var(--dimension-space-100) 0 var(--dimension-space-075);gap:var(--dimension-space-025)}.sizeSM.sc-ds-toggle-button{height:var(--dimension-size-300)}.sizeSM.iconOnly.sc-ds-toggle-button{width:var(--dimension-size-300);min-width:var(--dimension-size-300)}.sizeSM.labelOnly.sc-ds-toggle-button{padding:0 var(--dimension-space-075)}.sizeSM.iconAndLabel.sc-ds-toggle-button{padding:0 var(--dimension-space-075) 0 var(--dimension-space-050);gap:0}.sizeXS.sc-ds-toggle-button{height:var(--dimension-size-200)}.sizeXS.iconOnly.sc-ds-toggle-button{width:var(--dimension-size-200);min-width:var(--dimension-size-200)}.sizeXS.labelOnly.sc-ds-toggle-button,.sizeXS.iconAndLabel.sc-ds-toggle-button{padding:0 var(--dimension-space-025);gap:0}.rounded.sc-ds-toggle-button{border-radius:var(--dimension-radius-half)}.rounded.labelOnly.sc-ds-toggle-button{padding-left:calc(var(--dimension-space-100) + var(--dimension-space-050));padding-right:calc(var(--dimension-space-100) + var(--dimension-space-050))}.rounded.iconAndLabel.sc-ds-toggle-button{padding-left:calc(var(--dimension-space-075) + var(--dimension-space-050));padding-right:calc(var(--dimension-space-100) + var(--dimension-space-050))}.rounded.sizeSM.labelOnly.sc-ds-toggle-button{padding-left:calc(var(--dimension-space-075) + var(--dimension-space-050));padding-right:calc(var(--dimension-space-075) + var(--dimension-space-050))}.rounded.sizeSM.iconAndLabel.sc-ds-toggle-button{padding-left:calc(var(--dimension-space-050) + var(--dimension-space-050));padding-right:calc(var(--dimension-space-075) + var(--dimension-space-050))}.rounded.iconOnly.sc-ds-toggle-button{width:var(--dimension-size-400);min-width:var(--dimension-size-400);padding:0}.rounded.sizeSM.iconOnly.sc-ds-toggle-button{width:var(--dimension-size-300);min-width:var(--dimension-size-300)}.rounded.sizeXS.iconOnly.sc-ds-toggle-button{width:var(--dimension-size-200);min-width:var(--dimension-size-200)}.inactive.sc-ds-toggle-button{opacity:0.5;cursor:not-allowed;pointer-events:none}.toggle-btn__icon.sc-ds-toggle-button{display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;line-height:0}.toggle-btn__label.sc-ds-toggle-button{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}`;const l={md:"md",sm:"sm",xs:"xs"};const g={md:d.iconographyMd,sm:d.iconographySm,xs:d.iconographyXs};const b={md:"text-body-medium-emphasis",sm:"text-body-small-emphasis",xs:"text-caption-emphasis"};const u=o(class o extends e{constructor(o){super();if(o!==false){this.__registerHost()}this.dsChange=n(this,"dsChange");this.elevation="elevated";this.size="md";this.rounded=false;this.pressed=false;this.inactive=false;this.handleClick=()=>{if(this.inactive)return;this.dsChange.emit(!this.pressed)}}render(){const o=this.size;const e=l[o];const n=a(g[o],g[o]);const t=b[o];const i=!!this.icon;const d=!!this.label;const c=i&&!d;const u=d&&!i;const v=i&&d;const m=this.background;const p=this.elevation.charAt(0).toUpperCase()+this.elevation.slice(1);const h={"toggle-btn":true,[`elevation${p}`]:true,sizeSM:o==="sm",sizeXS:o==="xs",rounded:this.rounded,inactive:this.inactive,pressed:this.pressed,iconOnly:c,labelOnly:u,iconAndLabel:v,onMedium:m==="medium",onBold:m==="bold",onStrong:m==="strong",onAlwaysDark:m==="always-dark"};return s(r,{key:"5dccc1350f12d5861c84dbda0cba5a569910c168"},s("button",{key:"72a530d6fa2b468c9853d10d8ed7a602396ec4c0",type:"button",class:h,disabled:this.inactive,"aria-label":this.ariaLabel??this.label??"toggle","aria-pressed":this.pressed,onClick:this.handleClick},i&&s("span",{key:"6ceb9ae4685c08cc33b817d616bf38991957549e",class:"toggle-btn__icon",style:{fontSize:`${n}px`}},s("ds-icon",{key:"f536c207e6a9c38d5d7cafe35e0fbfe75629977a",name:this.icon,size:e})),d&&s("span",{key:"65b60a81f1f4f56bd3be7fd7d1b2560a23a3ba5f",class:`toggle-btn__label ${t}`},this.label)))}static get style(){return c()}},[2,"ds-toggle-button",{elevation:[1],label:[1],icon:[1],size:[1],rounded:[4],background:[1],pressed:[1028],inactive:[4],ariaLabel:[1,"aria-label"]}]);function v(){if(typeof customElements==="undefined"){return}const o=["ds-toggle-button","ds-icon"];o.forEach((o=>{switch(o){case"ds-toggle-button":if(!customElements.get(t(o))){customElements.define(t(o),u)}break;case"ds-icon":if(!customElements.get(t(o))){i()}break}}))}v();export{u as T,v as d};
+//# sourceMappingURL=p-DiWQFROF.js.map

package/dist/components/p-DiWQFROF.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["toggleButtonCss","ICON_SIZE","md","sm","xs","ICON_TOKEN","TOKEN_DEFAULTS","iconographyMd","iconographySm","iconographyXs","TEXT_CLASS","ToggleButton","__stencil_proxyCustomElement","HTMLElement","constructor","registerHost","this","elevation","size","rounded","pressed","inactive","handleClick","dsChange","emit","render","iconSize","iconPx","resolveCssLengthPx","textClass","hasIcon","icon","hasLabel","label","isIconOnly","isLabelOnly","isIconAndLabel","bg","background","elevKey","charAt","toUpperCase","slice","cls","sizeSM","sizeXS","iconOnly","labelOnly","iconAndLabel","onMedium","onBold","onStrong","onAlwaysDark","h","Host","key","type","class","disabled","ariaLabel","onClick","style","fontSize","name"],"sources":["src/wc/components/ToggleButton/ToggleButton.css?tag=ds-toggle-button&encapsulation=scoped","src/wc/components/ToggleButton/ToggleButton.tsx"],"sourcesContent":["/* ==========================================================================\n   ToggleButton — hover/pressed via direct background-color + color-mix().\n   Elevation controls the chrome level:\n     elevated — bg-primary + shadow  (default)\n     flat     — border only\n     none     — ghost (transparent, no border, no shadow)\n     floating — bg-primary + FAB-strength shadow\n   ========================================================================== */\n\n.toggle-btn {\n  display: inline-flex;\n  align-items: center;\n  justify-content: center;\n  border: none;\n  border-radius: var(--dimension-radius-050);\n  cursor: pointer;\n  position: relative;\n  transition: transform var(--effect-motion-short-2);\n  height: var(--dimension-size-400);\n  font-family: inherit;\n  background: transparent;\n  box-sizing: border-box;\n  -webkit-user-select: none;\n  user-select: none;\n\n  /* Interaction — ghost defaults */\n  --_hover-bg: var(--color-interaction-hover);\n  --_pressed-bg: var(--color-interaction-pressed);\n  --_border: var(--color-border-tertiary);\n}\n\n.toggle-btn:focus-visible {\n  outline: var(--dimension-stroke-width-025) solid var(--color-interaction-focus);\n  outline-offset: var(--dimension-space-025);\n}\n\n.toggle-btn:hover:not(.inactive) {\n  background-color: var(--_hover-bg);\n}\n\n.toggle-btn:active:not(.inactive) {\n  background-color: var(--_pressed-bg);\n  transform: scale(var(--dimension-scale-subtle));\n}\n\n/* ==========================================================================\n   Background context — parent surface awareness\n   ========================================================================== */\n\n.onMedium {\n  --_hover-bg: var(--color-interaction-on-medium-background-hover);\n  --_pressed-bg: var(--color-interaction-on-medium-background-pressed);\n  --_border: var(--color-border-on-medium-background-tertiary);\n}\n\n.onBold {\n  --_hover-bg: var(--color-interaction-on-bold-background-hover);\n  --_pressed-bg: var(--color-interaction-on-bold-background-pressed);\n  --_border: var(--color-border-on-bold-background-tertiary);\n}\n\n.onStrong {\n  --_hover-bg: var(--color-interaction-on-strong-background-hover);\n  --_pressed-bg: var(--color-interaction-on-strong-background-pressed);\n  --_border: var(--color-border-on-strong-background-tertiary);\n}\n\n.onAlwaysDark {\n  --_hover-bg: var(--color-always-dark-interaction-hover);\n  --_pressed-bg: var(--color-always-dark-interaction-pressed);\n  --_border: var(--color-always-dark-border-tertiary);\n}\n\n/* ==========================================================================\n   Elevation levels\n   ========================================================================== */\n\n/* ── Elevated (default): bg-primary + shadow ───────────────────────────── */\n\n.elevationElevated {\n  background-color: var(--color-background-primary);\n  box-shadow: var(--effect-elevation-elevated-sm);\n  color: var(--color-foreground-secondary);\n  --_hover-bg: color-mix(in oklch, var(--color-background-primary) 90%, var(--color-foreground-primary));\n  --_pressed-bg: color-mix(in oklch, var(--color-background-primary) 85%, var(--color-foreground-primary));\n}\n\n/* ── Flat: border only, transparent bg ─────────────────────────────────── */\n\n.elevationFlat {\n  box-shadow: inset 0 0 0 1px var(--_border);\n  color: var(--color-foreground-secondary);\n}\n\n/* ── None: ghost — transparent, no border, no shadow ───────────────────── */\n\n.elevationNone {\n  color: var(--color-foreground-secondary);\n}\n\n/* ── Floating: bg-primary + FAB-strength shadow ─────────────────────────── */\n\n.elevationFloating {\n  background-color: var(--color-background-primary);\n  box-shadow: var(--effect-elevation-elevated-floating);\n  color: var(--color-foreground-secondary);\n  --_hover-bg: color-mix(in oklch, var(--color-background-primary) 90%, var(--color-foreground-primary));\n  --_pressed-bg: color-mix(in oklch, var(--color-background-primary) 85%, var(--color-foreground-primary));\n}\n\n/* ── Fg on bold / strong surface ────────────────────────────────────────── */\n\n.onBold.elevationNone, .onBold.elevationFlat,\n.onStrong.elevationNone, .onStrong.elevationFlat {\n  color: var(--color-foreground-on-bold-background-secondary);\n}\n\n/* ── Fg on always-dark surface ─────────────────────────────────────────── */\n\n.onAlwaysDark.elevationNone, .onAlwaysDark.elevationFlat {\n  color: var(--color-always-dark-foreground-secondary);\n}\n\n/* ==========================================================================\n   Pressed state — shared across all elevation levels\n   ========================================================================== */\n\n.pressed {\n  background-color: var(--color-background-faint-brand);\n  color: var(--color-foreground-bold-brand);\n}\n\n/* ==========================================================================\n   Layout\n   ========================================================================== */\n\n.iconOnly    { padding: 0; width: var(--dimension-size-400); min-width: var(--dimension-size-400); }\n.labelOnly   { padding: 0 var(--dimension-space-100); }\n.iconAndLabel { padding: 0 var(--dimension-space-100) 0 var(--dimension-space-075); gap: var(--dimension-space-025); }\n\n/* ==========================================================================\n   Sizes\n   ========================================================================== */\n\n.sizeSM { height: var(--dimension-size-300); }\n.sizeSM.iconOnly { width: var(--dimension-size-300); min-width: var(--dimension-size-300); }\n.sizeSM.labelOnly   { padding: 0 var(--dimension-space-075); }\n.sizeSM.iconAndLabel { padding: 0 var(--dimension-space-075) 0 var(--dimension-space-050); gap: 0; }\n\n.sizeXS { height: var(--dimension-size-200); }\n.sizeXS.iconOnly { width: var(--dimension-size-200); min-width: var(--dimension-size-200); }\n.sizeXS.labelOnly, .sizeXS.iconAndLabel { padding: 0 var(--dimension-space-025); gap: 0; }\n\n/* ==========================================================================\n   Rounded (pill shape)\n   ========================================================================== */\n\n.rounded { border-radius: var(--dimension-radius-half); }\n.rounded.labelOnly   { padding-left: calc(var(--dimension-space-100) + var(--dimension-space-050)); padding-right: calc(var(--dimension-space-100) + var(--dimension-space-050)); }\n.rounded.iconAndLabel { padding-left: calc(var(--dimension-space-075) + var(--dimension-space-050)); padding-right: calc(var(--dimension-space-100) + var(--dimension-space-050)); }\n.rounded.sizeSM.labelOnly   { padding-left: calc(var(--dimension-space-075) + var(--dimension-space-050)); padding-right: calc(var(--dimension-space-075) + var(--dimension-space-050)); }\n.rounded.sizeSM.iconAndLabel { padding-left: calc(var(--dimension-space-050) + var(--dimension-space-050)); padding-right: calc(var(--dimension-space-075) + var(--dimension-space-050)); }\n.rounded.iconOnly { width: var(--dimension-size-400); min-width: var(--dimension-size-400); padding: 0; }\n.rounded.sizeSM.iconOnly { width: var(--dimension-size-300); min-width: var(--dimension-size-300); }\n.rounded.sizeXS.iconOnly { width: var(--dimension-size-200); min-width: var(--dimension-size-200); }\n\n/* ==========================================================================\n   Disabled\n   ========================================================================== */\n\n.inactive { opacity: 0.5; cursor: not-allowed; pointer-events: none; }\n\n/* ==========================================================================\n   Inner slots\n   ========================================================================== */\n\n.toggle-btn__icon {\n  display: inline-flex;\n  align-items: center;\n  justify-content: center;\n  flex-shrink: 0;\n  line-height: 0;\n}\n\n.toggle-btn__label {\n  white-space: nowrap;\n  overflow: hidden;\n  text-overflow: ellipsis;\n}\n","import { Component, Prop, Event, EventEmitter, h, Host } from '@stencil/core';\nimport type { IconSize } from '../Icon/Icon';\nimport { resolveCssLengthPx, TOKEN_DEFAULTS } from '../../utils';\n\nexport type ToggleButtonElevation  = 'none' | 'flat' | 'elevated' | 'floating';\nexport type ToggleButtonSize       = 'md' | 'sm' | 'xs';\nexport type ToggleButtonBackground = 'faint' | 'medium' | 'bold' | 'strong' | 'always-dark';\n\nconst ICON_SIZE: Record<ToggleButtonSize, IconSize> = { md: 'md', sm: 'sm', xs: 'xs' };\n\nconst ICON_TOKEN: Record<ToggleButtonSize, string> = {\n  md: TOKEN_DEFAULTS.iconographyMd,\n  sm: TOKEN_DEFAULTS.iconographySm,\n  xs: TOKEN_DEFAULTS.iconographyXs,\n};\n\nconst TEXT_CLASS: Record<ToggleButtonSize, string> = {\n  md: 'text-body-medium-emphasis',\n  sm: 'text-body-small-emphasis',\n  xs: 'text-caption-emphasis',\n};\n\n@Component({\n  tag: 'ds-toggle-button',\n  styleUrl: 'ToggleButton.css',\n  scoped: true,\n})\nexport class ToggleButton {\n  /**\n   * Chrome level.\n   *   none     — ghost (transparent, no border, no shadow)\n   *   flat     — border only, transparent bg\n   *   elevated — bg-primary + shadow  [default]\n   *   floating — bg-primary + FAB-strength shadow\n   */\n  @Prop() elevation: ToggleButtonElevation = 'elevated';\n\n  /** Label text. */\n  @Prop() label: string | undefined;\n\n  /**\n   * Icon name for <ds-icon>. Set via JS property.\n   * @example el.icon = 'GridView';\n   */\n  @Prop() icon: string | undefined;\n\n  /** Size: md (32px), sm (24px), xs (16px). */\n  @Prop() size: ToggleButtonSize = 'md';\n\n  /** Pill shape. */\n  @Prop() rounded: boolean = false;\n\n  /** Parent surface context — adjusts hover tokens for colored backgrounds. */\n  @Prop() background: ToggleButtonBackground | undefined;\n\n  /** Controlled pressed state. */\n  @Prop({ mutable: true }) pressed: boolean = false;\n\n  /** Disables interaction. */\n  @Prop() inactive: boolean = false;\n\n  @Prop({ attribute: 'aria-label' }) ariaLabel: string | undefined;\n\n  /** Emits the new pressed value (!pressed) on click. */\n  @Event() dsChange!: EventEmitter<boolean>;\n\n  private handleClick = () => {\n    if (this.inactive) return;\n    this.dsChange.emit(!this.pressed);\n  };\n\n  render() {\n    const size = this.size;\n    const iconSize = ICON_SIZE[size];\n    const iconPx = resolveCssLengthPx(ICON_TOKEN[size], ICON_TOKEN[size]);\n    const textClass = TEXT_CLASS[size];\n    const hasIcon = !!this.icon;\n    const hasLabel = !!this.label;\n    const isIconOnly = hasIcon && !hasLabel;\n    const isLabelOnly = hasLabel && !hasIcon;\n    const isIconAndLabel = hasIcon && hasLabel;\n    const bg = this.background;\n    const elevKey = this.elevation.charAt(0).toUpperCase() + this.elevation.slice(1);\n\n    const cls: Record<string, boolean> = {\n      'toggle-btn': true,\n      [`elevation${elevKey}`]: true,\n      sizeSM: size === 'sm',\n      sizeXS: size === 'xs',\n      rounded: this.rounded,\n      inactive: this.inactive,\n      pressed: this.pressed,\n      iconOnly: isIconOnly,\n      labelOnly: isLabelOnly,\n      iconAndLabel: isIconAndLabel,\n      onMedium: bg === 'medium',\n      onBold: bg === 'bold',\n      onStrong: bg === 'strong',\n      onAlwaysDark: bg === 'always-dark',\n    };\n\n    return (\n      <Host>\n        <button\n          type=\"button\"\n          class={cls}\n          disabled={this.inactive}\n          aria-label={this.ariaLabel ?? this.label ?? 'toggle'}\n          aria-pressed={this.pressed}\n          onClick={this.handleClick}\n        >\n          {hasIcon && (\n            <span class=\"toggle-btn__icon\" style={{ fontSize: `${iconPx}px` }}>\n              <ds-icon name={this.icon} size={iconSize} />\n            </span>\n          )}\n          {hasLabel && (\n            <span class={`toggle-btn__label ${textClass}`}>{this.label}</span>\n          )}\n        </button>\n      </Host>\n    );\n  }\n}\n"],"mappings":"yKAAA,MAAMA,EAAkB,IAAM,8hLCQ9B,MAAMC,EAAgD,CAAEC,GAAI,KAAMC,GAAI,KAAMC,GAAI,MAEhF,MAAMC,EAA+C,CACnDH,GAAII,EAAeC,cACnBJ,GAAIG,EAAeE,cACnBJ,GAAIE,EAAeG,eAGrB,MAAMC,EAA+C,CACnDR,GAAI,4BACJC,GAAI,2BACJC,GAAI,yB,MAQOO,EAAYC,EAAA,MAAAD,UAAAE,EALzB,WAAAC,CAAAC,G,6EAaUC,KAAAC,UAAmC,WAYnCD,KAAAE,KAAyB,KAGzBF,KAAAG,QAAmB,MAMFH,KAAAI,QAAmB,MAGpCJ,KAAAK,SAAoB,MAOpBL,KAAAM,YAAc,KACpB,GAAIN,KAAKK,SAAU,OACnBL,KAAKO,SAASC,MAAMR,KAAKI,QAAQ,CAuDpC,CApDC,MAAAK,GACE,MAAMP,EAAOF,KAAKE,KAClB,MAAMQ,EAAWzB,EAAUiB,GAC3B,MAAMS,EAASC,EAAmBvB,EAAWa,GAAOb,EAAWa,IAC/D,MAAMW,EAAYnB,EAAWQ,GAC7B,MAAMY,IAAYd,KAAKe,KACvB,MAAMC,IAAahB,KAAKiB,MACxB,MAAMC,EAAaJ,IAAYE,EAC/B,MAAMG,EAAcH,IAAaF,EACjC,MAAMM,EAAiBN,GAAWE,EAClC,MAAMK,EAAKrB,KAAKsB,WAChB,MAAMC,EAAUvB,KAAKC,UAAUuB,OAAO,GAAGC,cAAgBzB,KAAKC,UAAUyB,MAAM,GAE9E,MAAMC,EAA+B,CACnC,aAAc,KACd,CAAC,YAAYJ,KAAY,KACzBK,OAAQ1B,IAAS,KACjB2B,OAAQ3B,IAAS,KACjBC,QAASH,KAAKG,QACdE,SAAUL,KAAKK,SACfD,QAASJ,KAAKI,QACd0B,SAAUZ,EACVa,UAAWZ,EACXa,aAAcZ,EACda,SAAUZ,IAAO,SACjBa,OAAQb,IAAO,OACfc,SAAUd,IAAO,SACjBe,aAAcf,IAAO,eAGvB,OACEgB,EAACC,EAAI,CAAAC,IAAA,4CACHF,EAAA,UAAAE,IAAA,2CACEC,KAAK,SACLC,MAAOd,EACPe,SAAU1C,KAAKK,SAAQ,aACXL,KAAK2C,WAAa3C,KAAKiB,OAAS,SAAQ,eACtCjB,KAAKI,QACnBwC,QAAS5C,KAAKM,aAEbQ,GACCuB,EAAA,QAAAE,IAAA,2CAAME,MAAM,mBAAmBI,MAAO,CAAEC,SAAU,GAAGnC,QACnD0B,EAAA,WAAAE,IAAA,2CAASQ,KAAM/C,KAAKe,KAAMb,KAAMQ,KAGnCM,GACCqB,EAAA,QAAAE,IAAA,2CAAME,MAAO,qBAAqB5B,KAAcb,KAAKiB,Q","ignoreList":[]}

package/dist/types/components/AppShell/AppShell.d.ts

@@ -0,0 +1,25 @@
+import type { NavChromeStyle } from '../../nav/nav-chrome';
+export declare class AppShell {
+    /** Chrome style propagated to slotted `ds-panel-nav` and `ds-bar-nav`. */
+    navStyle: NavChromeStyle;
+    /** When `true`, paints the shared L-shaped radial wash on panel + bar backgrounds. */
+    gradient: boolean;
+    /**
+     * Optional custom gradient for `background-image` (e.g. SVG URL).
+     * When set, overrides the built-in radial wash.
+     */
+    gradientSrc: string;
+    el: HTMLElement;
+    private resizeObserver;
+    componentDidLoad(): void;
+    private scheduleGradientVars;
+    disconnectedCallback(): void;
+    onShellPropsChange(): void;
+    private connectMetricsObserver;
+    private applyGradientVars;
+    private clearGradientVars;
+    private syncSlottedNavStyle;
+    private updateGradientVars;
+    render(): any;
+}
+//# sourceMappingURL=AppShell.d.ts.map

package/dist/types/components/Banner/Banner.d.ts

@@ -15,6 +15,8 @@ export declare class Banner {
     dsDismiss: EventEmitter<void>;
     private dismissTimer;
     private closeTimer;
+    private get fadeOutMs();
+    private get autoDismissMs();
     componentDidLoad(): void;
     onMessageChange(newVal: string): void;
     disconnectedCallback(): void;

package/dist/types/components/Loader/Loader.d.ts

@@ -1,12 +1,13 @@
 export declare class Loader {
-    /** Render size in px. Designed on a 16×16 viewBox; stroke scales proportionally. */
-    size: number;
+    /** Render size — number (px) or TokoMo length (`var(--dimension-iconography-md)`, etc.). */
+    size: number | string;
     /**
      * Accessible label for standalone usage. Wraps the spinner in a live region
      * and renders the label visually-hidden. Omit when the host element already
      * conveys busy state via aria-busy.
      */
     label: string | undefined;
+    private get sizePx();
     render(): any;
 }
 //# sourceMappingURL=Loader.d.ts.map

package/dist/types/components/Menu/Menu.d.ts

@@ -22,8 +22,10 @@ export declare class Menu {
     sections: MenuSection[];
     side: MenuSide;
     align: MenuAlign;
-    sideOffset: number;
-    alignOffset: number;
+    /** Gap between anchor and menu — number (px) or TokoMo length (`var(--dimension-space-050)`, etc.). */
+    sideOffset: number | string;
+    /** Cross-axis offset — number (px) or TokoMo length. */
+    alignOffset: number | string;
     menuWidth: string | undefined;
     minWidth: string | undefined;
     /** External trigger element to position against. Set via JS: menuEl.anchor = buttonEl */
@@ -44,6 +46,13 @@ export declare class Menu {
     componentDidLoad(): void;
     disconnectedCallback(): void;
     onOpenChange(isOpen: boolean): void;
+    onPositionPropsChange(): void;
+    private get viewportPadPx();
+    private get sideOffsetPx();
+    private get alignOffsetPx();
+    private get popupFallbackWidthPx();
+    private get popupFallbackHeightPx();
+    private get closeAnimationMs();
     private get resolvedAnchor();
     private get activeSections();
     private get flatItems();

package/dist/types/components/Modal/Modal.d.ts

@@ -26,6 +26,7 @@ export declare class Modal {
     private close;
     private handleBackdropMouseDown;
     private get resolvedWidth();
+    private get closeAnimationMs();
     render(): any;
 }
 //# sourceMappingURL=Modal.d.ts.map

package/dist/types/components/PanelNav/PanelNav.d.ts

@@ -19,14 +19,12 @@ export declare class PanelNav {
     /** ID of the currently active/selected nav item. Overridden by `currentUrl` matching when set. */
     activeId: string;
     /** Whether the nav is in collapsed (icon-only) state.
-     *  When `storageKey` is set the component manages this internally —
-     *  do not also bind it from outside in that mode. */
+     *  Set `storageKey` to persist across reloads. `dsNavToggle` still fires on change. */
     collapsed: boolean;
     /** Viewport width (px) below which the nav auto-collapses to icon-only mode. 0 = disabled. */
     breakpoint: number;
     /** `localStorage` key used to persist the collapsed state across page loads.
-     *  When set the component is self-managing for collapsed state; `dsNavToggle`
-     *  still fires for consumers that want to observe the change. */
+     *  When set, collapsed state is restored on mount and written on each toggle. */
     storageKey: string;
     /** Current route URL (e.g. `window.location.pathname` or the router's active URL).
      *  When set the component derives the active item by matching item `href` values
@@ -92,8 +90,7 @@ export declare class PanelNav {
     private syncRenderedStyleIfNeeded;
     /** Poll across animation frames — host props may land without triggering @Watch. */
     private scheduleDeferredHostPropSync;
-    /** Centralised toggle: always emits `dsNavToggle`; when `storageKey` is set
-     *  also mutates `collapsed` directly and persists to `localStorage`. */
+    /** Centralised toggle: updates `collapsed`, emits `dsNavToggle`, optionally persists. */
     private applyToggle;
     private getAllItems;
     private syncRovingIndex;

package/dist/types/components/Toast/Toast.d.ts

@@ -3,6 +3,7 @@ export declare class ToastProvider {
     position: ToastPosition;
     private items;
     private unsubscribe;
+    private get fadeOutMs();
     connectedCallback(): void;
     disconnectedCallback(): void;
     private syncFromStore;

package/dist/types/components/Tooltip/Tooltip.d.ts

@@ -5,9 +5,12 @@ export declare class Tooltip {
     label: string;
     side: TooltipSide;
     align: TooltipAlign;
-    sideOffset: number;
-    alignOffset: number;
-    delay: number;
+    /** Gap between anchor and tooltip — number (px) or TokoMo length. */
+    sideOffset: number | string;
+    /** Cross-axis offset — number (px) or TokoMo length. */
+    alignOffset: number | string;
+    /** Show delay — number (ms) or TokoMo time token / `var(--effect-animation-delay-*)`. */
+    delay: number | string;
     shortcutKey: string | undefined;
     shortcutKeyPosition: 'start' | 'end';
     private visible;
@@ -25,6 +28,14 @@ export declare class Tooltip {
     componentDidLoad(): void;
     disconnectedCallback(): void;
     onPositionPropsChange(): void;
+    private get viewportPadPx();
+    private get sideOffsetPx();
+    private get alignOffsetPx();
+    private get hoverDelayMs();
+    private get instantReopenMs();
+    private get fadeOutMs();
+    private get tooltipFallbackWidthPx();
+    private get tooltipFallbackHeightPx();
     private bindAnchor;
     private unbindAnchor;
     private clearTimers;