@ds-mo/ui 2.10.3 → 2.11.1

package/dist/components/ds-scrollbar.js

@@ -1,2 +1,2 @@
-import{p as s,H as t,h as o,a as r,t as e}from"./index.js";const i=()=>`.sc-ds-scrollbar-h{display:contents}.scrollbar-container.sc-ds-scrollbar{position:relative;width:100%;height:100%;overflow:hidden}.scrollbar-content.sc-ds-scrollbar{width:100%;height:100%;min-height:0;overflow-y:auto;overflow-x:auto;scrollbar-width:none;-ms-overflow-style:none}.scrollbar-content.sc-ds-scrollbar::-webkit-scrollbar{display:none}.scrollbar-content.sc-ds-scrollbar:focus-visible{outline:var(--dimension-stroke-width-025) solid var(--color-interaction-focus);outline-offset:calc(var(--dimension-space-025) * -1)}.scrollbar-track.sc-ds-scrollbar{position:absolute;top:0;right:0;bottom:0;width:var(--dimension-size-050, 4px);pointer-events:none;z-index:10;opacity:0;transition:opacity var(--effect-motion-short-2)}.scrollbar-container[data-show-track='true'].sc-ds-scrollbar .scrollbar-track.sc-ds-scrollbar{opacity:1;pointer-events:auto}.scrollbar-thumb.sc-ds-scrollbar{position:absolute;right:0;width:var(--dimension-size-050, 4px);cursor:grab;border-radius:0;background-color:var(--color-foreground-quaternary);transition:background-color var(--effect-motion-short-2);-webkit-user-select:none;user-select:none}.scrollbar-thumb.sc-ds-scrollbar:active{cursor:grabbing}.scrollbar-track-h.sc-ds-scrollbar{position:absolute;left:0;right:0;bottom:0;height:var(--dimension-size-050, 4px);pointer-events:none;z-index:10;opacity:0;transition:opacity var(--effect-motion-short-2)}.scrollbar-container[data-show-track='true'].sc-ds-scrollbar .scrollbar-track-h.sc-ds-scrollbar{opacity:1;pointer-events:auto}.scrollbar-thumb-h.sc-ds-scrollbar{position:absolute;bottom:0;height:var(--dimension-size-050, 4px);cursor:grab;border-radius:0;background-color:var(--color-foreground-quaternary);transition:background-color var(--effect-motion-short-2);-webkit-user-select:none;user-select:none}.scrollbar-thumb-h.sc-ds-scrollbar:active{cursor:grabbing}.scrollbar-container--thick.sc-ds-scrollbar .scrollbar-track.sc-ds-scrollbar{width:var(--dimension-size-100, 8px)}.scrollbar-container--thick.sc-ds-scrollbar .scrollbar-thumb.sc-ds-scrollbar{width:var(--dimension-size-100, 8px)}.scrollbar-container--thick.sc-ds-scrollbar .scrollbar-track-h.sc-ds-scrollbar{height:var(--dimension-size-100, 8px)}.scrollbar-container--thick.sc-ds-scrollbar .scrollbar-thumb-h.sc-ds-scrollbar{height:var(--dimension-size-100, 8px)}`;const c=s(class s extends t{constructor(s){super();if(s!==false){this.__registerHost()}this.variant="default";this.showTrackOnHover=true;this.thumbHeight=0;this.thumbTop=0;this.thumbWidth=0;this.thumbLeft=0;this.isDragging=false;this.isDraggingH=false;this.isPointerInside=false;this.contentEl=null;this.resizeObserver=null;this.scrollHandler=null;this.dragStartY=0;this.dragStartScrollTop=0;this.dragStartX=0;this.dragStartScrollLeft=0}componentDidLoad(){this.contentEl=this.el.querySelector(".scrollbar-content");if(!this.contentEl)return;this.scrollHandler=()=>this.updateThumb();this.contentEl.addEventListener("scroll",this.scrollHandler);this.resizeObserver=new ResizeObserver((()=>this.updateThumb()));this.resizeObserver.observe(this.contentEl);window.addEventListener("resize",this.scrollHandler);this.updateThumb()}disconnectedCallback(){if(this.contentEl&&this.scrollHandler){this.contentEl.removeEventListener("scroll",this.scrollHandler)}if(this.scrollHandler){window.removeEventListener("resize",this.scrollHandler)}this.resizeObserver?.disconnect()}updateThumb(){const s=this.el.querySelector(".scrollbar-container");const t=this.contentEl;if(!s||!t)return;const o=s.clientHeight;const r=s.clientWidth;const e=t.scrollHeight;const i=t.scrollWidth;const c=t.scrollTop;const a=t.scrollLeft;if(e<=o){this.thumbHeight=0}else{const s=Math.max(20,o*(o/e));this.thumbHeight=s;this.thumbTop=c/(e-o)*(o-s)}if(i<=r){this.thumbWidth=0}else{const s=Math.max(20,r*(r/i));this.thumbWidth=s;this.thumbLeft=a/(i-r)*(r-s)}}handleThumbMouseDown(s){s.preventDefault();s.stopPropagation();const t=this.contentEl;if(!t)return;this.isDragging=true;this.dragStartY=s.clientY;this.dragStartScrollTop=t.scrollTop;const o=this.el.querySelector(".scrollbar-container");const r=s=>{const r=s.clientY-this.dragStartY;const e=t.scrollHeight-o.clientHeight;const i=e/(o.clientHeight-this.thumbHeight);t.scrollTop=Math.max(0,Math.min(e,this.dragStartScrollTop+r*i))};const e=()=>{this.isDragging=false;document.removeEventListener("mousemove",r);document.removeEventListener("mouseup",e)};document.addEventListener("mousemove",r);document.addEventListener("mouseup",e)}handleThumbHMouseDown(s){s.preventDefault();s.stopPropagation();const t=this.contentEl;if(!t)return;this.isDraggingH=true;this.dragStartX=s.clientX;this.dragStartScrollLeft=t.scrollLeft;const o=this.el.querySelector(".scrollbar-container");const r=s=>{const r=s.clientX-this.dragStartX;const e=t.scrollWidth-o.clientWidth;const i=e/(o.clientWidth-this.thumbWidth);t.scrollLeft=Math.max(0,Math.min(e,this.dragStartScrollLeft+r*i))};const e=()=>{this.isDraggingH=false;document.removeEventListener("mousemove",r);document.removeEventListener("mouseup",e)};document.addEventListener("mousemove",r);document.addEventListener("mouseup",e)}render(){const s=this.thumbHeight>0;const t=this.thumbWidth>0;const e=s||t;const i=this.showTrackOnHover&&(this.isPointerInside||this.isDragging||this.isDraggingH);return o(r,{key:"e8475f8b7ea08fe86039247ab956b8ad8942b854",style:{display:"contents"}},o("div",{key:"fc17e38d95fb6a0c91774e38a480d7c62d24e75f",class:{"scrollbar-container":true,"scrollbar-container--thick":this.variant==="thick"},"data-show-track":i?"true":"false","data-dragging":this.isDragging||this.isDraggingH,onMouseEnter:()=>{if(this.showTrackOnHover)this.isPointerInside=true},onMouseLeave:()=>{this.isPointerInside=false}},o("div",{key:"3b7d71e16dcc44d1125893ec00c920f3348539e4",class:"scrollbar-content",tabIndex:e?0:undefined},o("slot",{key:"c38783d49ce132ea0585e4251493aa74c2f9b5aa"})),s&&o("div",{key:"e4d4266612e2d2e609eed12cb4dc1caa45b698f4",class:"scrollbar-track","aria-hidden":"true"},o("div",{key:"3c06881fb30182c18ff6652b27c07772cad980a1",class:"scrollbar-thumb",style:{height:`${this.thumbHeight}px`,top:`${this.thumbTop}px`},onMouseDown:s=>this.handleThumbMouseDown(s)})),t&&o("div",{key:"6eb051b9d4016400fa9b452be7f86e8e8cf97f61",class:"scrollbar-track-h","aria-hidden":"true"},o("div",{key:"bba941135bbce4e20bbb7082ee2a8a2cfbb49ada",class:"scrollbar-thumb-h",style:{width:`${this.thumbWidth}px`,left:`${this.thumbLeft}px`},onMouseDown:s=>this.handleThumbHMouseDown(s)}))))}get el(){return this}static get style(){return i()}},[262,"ds-scrollbar",{variant:[1],showTrackOnHover:[4,"show-track-on-hover"],thumbHeight:[32],thumbTop:[32],thumbWidth:[32],thumbLeft:[32],isDragging:[32],isDraggingH:[32],isPointerInside:[32]}]);function a(){if(typeof customElements==="undefined"){return}const s=["ds-scrollbar"];s.forEach((s=>{switch(s){case"ds-scrollbar":if(!customElements.get(e(s))){customElements.define(e(s),c)}break}}))}a();const n=c;const l=a;export{n as DsScrollbar,l as defineCustomElement};
+import{p as s,H as t,h as o,a as r,t as e}from"./index.js";const i=()=>`.sc-ds-scrollbar-h{display:contents}.scrollbar-container.sc-ds-scrollbar{position:relative;width:100%;height:100%;overflow:hidden}.scrollbar-content.sc-ds-scrollbar{width:100%;height:100%;min-height:0;overflow-y:auto;overflow-x:auto;scrollbar-width:none;-ms-overflow-style:none}.scrollbar-content.sc-ds-scrollbar::-webkit-scrollbar{display:none}.scrollbar-content.sc-ds-scrollbar:focus-visible{outline:var(--dimension-stroke-width-025) solid var(--color-interaction-focus);outline-offset:calc(var(--dimension-space-025) * -1)}.scrollbar-track.sc-ds-scrollbar{position:absolute;top:0;right:0;bottom:0;width:var(--dimension-size-050, 4px);pointer-events:none;z-index:10;opacity:0;transition:opacity var(--effect-motion-short-2)}.scrollbar-container[data-show-track='true'].sc-ds-scrollbar .scrollbar-track.sc-ds-scrollbar{opacity:1;pointer-events:auto}.scrollbar-thumb.sc-ds-scrollbar{position:absolute;right:0;width:var(--dimension-size-050, 4px);cursor:grab;border-radius:0;background-color:var(--color-foreground-quaternary);transition:background-color var(--effect-motion-short-2);-webkit-user-select:none;user-select:none}.scrollbar-thumb.sc-ds-scrollbar:active{cursor:grabbing}.scrollbar-track-h.sc-ds-scrollbar{position:absolute;left:0;right:0;bottom:0;height:var(--dimension-size-050, 4px);pointer-events:none;z-index:10;opacity:0;transition:opacity var(--effect-motion-short-2)}.scrollbar-container[data-show-track='true'].sc-ds-scrollbar .scrollbar-track-h.sc-ds-scrollbar{opacity:1;pointer-events:auto}.scrollbar-thumb-h.sc-ds-scrollbar{position:absolute;bottom:0;height:var(--dimension-size-050, 4px);cursor:grab;border-radius:0;background-color:var(--color-foreground-quaternary);transition:background-color var(--effect-motion-short-2);-webkit-user-select:none;user-select:none}.scrollbar-thumb-h.sc-ds-scrollbar:active{cursor:grabbing}.scrollbar-container--thick.sc-ds-scrollbar .scrollbar-track.sc-ds-scrollbar{width:var(--dimension-size-100, 8px)}.scrollbar-container--thick.sc-ds-scrollbar .scrollbar-thumb.sc-ds-scrollbar{width:var(--dimension-size-100, 8px)}.scrollbar-container--thick.sc-ds-scrollbar .scrollbar-track-h.sc-ds-scrollbar{height:var(--dimension-size-100, 8px)}.scrollbar-container--thick.sc-ds-scrollbar .scrollbar-thumb-h.sc-ds-scrollbar{height:var(--dimension-size-100, 8px)}`;const c=s(class s extends t{constructor(s){super();if(s!==false){this.__registerHost()}this.variant="default";this.showTrackOnHover=true;this.thumbHeight=0;this.thumbTop=0;this.thumbWidth=0;this.thumbLeft=0;this.isDragging=false;this.isDraggingH=false;this.isPointerInside=false;this.contentEl=null;this.resizeObserver=null;this.scrollHandler=null;this.dragStartY=0;this.dragStartScrollTop=0;this.dragStartX=0;this.dragStartScrollLeft=0}componentDidLoad(){this.contentEl=this.el.querySelector(".scrollbar-content");if(!this.contentEl)return;this.scrollHandler=()=>this.updateThumb();this.contentEl.addEventListener("scroll",this.scrollHandler);this.resizeObserver=new ResizeObserver((()=>this.updateThumb()));this.resizeObserver.observe(this.contentEl);window.addEventListener("resize",this.scrollHandler);this.updateThumb()}disconnectedCallback(){if(this.contentEl&&this.scrollHandler){this.contentEl.removeEventListener("scroll",this.scrollHandler)}if(this.scrollHandler){window.removeEventListener("resize",this.scrollHandler)}this.resizeObserver?.disconnect()}updateThumb(){const s=this.el.querySelector(".scrollbar-container");const t=this.contentEl;if(!s||!t)return;const o=s.clientHeight;const r=s.clientWidth;const e=t.scrollHeight;const i=t.scrollWidth;const c=t.scrollTop;const a=t.scrollLeft;if(e<=o){this.thumbHeight=0}else{const s=Math.max(20,o*(o/e));this.thumbHeight=s;this.thumbTop=c/(e-o)*(o-s)}if(i<=r){this.thumbWidth=0}else{const s=Math.max(20,r*(r/i));this.thumbWidth=s;this.thumbLeft=a/(i-r)*(r-s)}}handleThumbMouseDown(s){s.preventDefault();s.stopPropagation();const t=this.contentEl;if(!t)return;this.isDragging=true;this.dragStartY=s.clientY;this.dragStartScrollTop=t.scrollTop;const o=this.el.querySelector(".scrollbar-container");const r=s=>{const r=s.clientY-this.dragStartY;const e=t.scrollHeight-o.clientHeight;const i=e/(o.clientHeight-this.thumbHeight);t.scrollTop=Math.max(0,Math.min(e,this.dragStartScrollTop+r*i))};const e=()=>{this.isDragging=false;document.removeEventListener("mousemove",r);document.removeEventListener("mouseup",e)};document.addEventListener("mousemove",r);document.addEventListener("mouseup",e)}handleThumbHMouseDown(s){s.preventDefault();s.stopPropagation();const t=this.contentEl;if(!t)return;this.isDraggingH=true;this.dragStartX=s.clientX;this.dragStartScrollLeft=t.scrollLeft;const o=this.el.querySelector(".scrollbar-container");const r=s=>{const r=s.clientX-this.dragStartX;const e=t.scrollWidth-o.clientWidth;const i=e/(o.clientWidth-this.thumbWidth);t.scrollLeft=Math.max(0,Math.min(e,this.dragStartScrollLeft+r*i))};const e=()=>{this.isDraggingH=false;document.removeEventListener("mousemove",r);document.removeEventListener("mouseup",e)};document.addEventListener("mousemove",r);document.addEventListener("mouseup",e)}render(){const s=this.thumbHeight>0;const t=this.thumbWidth>0;const e=s||t;const i=this.showTrackOnHover&&(this.isPointerInside||this.isDragging||this.isDraggingH);return o(r,{key:"8cee4d6081129c359fc002cb331bb01091f447d5",style:{display:"contents"}},o("div",{key:"8fe7b59ae67a72f36de2ef58be66fa690a05281f",class:{"scrollbar-container":true,"scrollbar-container--thick":this.variant==="thick"},"data-show-track":i?"true":"false","data-dragging":this.isDragging||this.isDraggingH,onMouseEnter:()=>{if(this.showTrackOnHover)this.isPointerInside=true},onMouseLeave:()=>{this.isPointerInside=false}},o("div",{key:"0ac6fa91d6a5442e4abaf341614b6f2085961e3d",class:"scrollbar-content",tabIndex:e?0:undefined},o("slot",{key:"afe1f5d30796c400c872328050c5cc7dfbc6373f"})),s&&o("div",{key:"6c87d4af5f5368ef2e73d14a00128117e5d66004",class:"scrollbar-track","aria-hidden":"true"},o("div",{key:"e5523224f064842cec210301b623c5ddcd8c4107",class:"scrollbar-thumb",style:{height:`${this.thumbHeight}px`,top:`${this.thumbTop}px`},onMouseDown:s=>this.handleThumbMouseDown(s)})),t&&o("div",{key:"d5efc93a5c328013857aff36009af3a9a9c48d12",class:"scrollbar-track-h","aria-hidden":"true"},o("div",{key:"4d417d4fe7dab06c497d4f1d64cbdd0f10f556be",class:"scrollbar-thumb-h",style:{width:`${this.thumbWidth}px`,left:`${this.thumbLeft}px`},onMouseDown:s=>this.handleThumbHMouseDown(s)}))))}get el(){return this}static get style(){return i()}},[262,"ds-scrollbar",{variant:[1],showTrackOnHover:[4,"show-track-on-hover"],thumbHeight:[32],thumbTop:[32],thumbWidth:[32],thumbLeft:[32],isDragging:[32],isDraggingH:[32],isPointerInside:[32]}]);function a(){if(typeof customElements==="undefined"){return}const s=["ds-scrollbar"];s.forEach((s=>{switch(s){case"ds-scrollbar":if(!customElements.get(e(s))){customElements.define(e(s),c)}break}}))}a();const n=c;const l=a;export{n as DsScrollbar,l as defineCustomElement};
 //# sourceMappingURL=ds-scrollbar.js.map

package/dist/components/ds-select.js

@@ -1,2 +1,2 @@
-import{p as e,H as s,c as t,h as i,a as r,t as o}from"./index.js";import{d as a}from"./p-TuuGOzXH.js";import{d as n}from"./p-eOWUz57C.js";import{d as l}from"./p-CRh-MLwj.js";const c=()=>`.select-host.sc-ds-select-h{display:inline-block;width:100%;position:relative}.inactive.sc-ds-select-h{opacity:0.5;pointer-events:none}.trigger.sc-ds-select{display:inline-flex;align-items:center;justify-content:space-between;width:100%;height:var(--dimension-size-400);padding:0 var(--dimension-space-075) 0 var(--dimension-space-100);border:none;border-radius:var(--dimension-radius-050);background-color:var(--color-background-primary);box-shadow:var(--effect-elevation-elevated-sm);cursor:pointer;box-sizing:border-box;gap:var(--dimension-space-050);font-family:inherit;outline:none;--_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))}.trigger.sc-ds-select:focus-visible{outline:var(--dimension-stroke-width-025) solid var(--color-interaction-focus);outline-offset:var(--dimension-space-025)}.trigger.sc-ds-select:hover:not(:disabled){background-color:var(--_hover-bg)}.trigger.sc-ds-select:active:not(:disabled){background-color:var(--_pressed-bg)}.trigger--open.sc-ds-select{background-color:var(--_pressed-bg)}.trigger__label.sc-ds-select{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;text-align:left;font-size:var(--typography-fontsize-md);line-height:var(--typography-lineheight-md);font-weight:var(--typography-weight-regular);color:var(--color-foreground-primary)}.trigger__label--placeholder.sc-ds-select{color:var(--color-foreground-secondary)}.trigger__chevron.sc-ds-select{flex-shrink:0;color:var(--color-foreground-secondary);transition:transform var(--effect-motion-short-2)}.trigger--open.sc-ds-select .trigger__chevron.sc-ds-select{transform:rotate(180deg)}`;const h=e(class e extends s{constructor(e){super();if(e!==false){this.__registerHost()}this.dsChange=t(this,"dsChange");this.options=[];this.value="";this.placeholder="Select option";this.inactive=false;this.isOpen=false;this.triggerEl=null;this.menuEl=null}componentDidLoad(){if(this.menuEl&&this.triggerEl){this.menuEl.anchor=this.triggerEl}this.menuEl?.addEventListener("dsSelect",(e=>{const s=e.detail;if(s?.value!==undefined){this.value=String(s.value);this.dsChange.emit(this.value)}this.isOpen=false}));this.menuEl?.addEventListener("dsClose",(()=>{this.isOpen=false}))}onIsOpenChange(e){if(this.menuEl){this.menuEl.open=e}}onOptionsChange(){this.syncMenuItems()}onValueChange(){this.syncMenuItems()}syncMenuItems(){if(!this.menuEl)return;this.menuEl.items=this.options.map((e=>({label:e.label,value:e.value,isSelected:e.value===this.value})))}open(){if(this.inactive||!this.options.length)return;if(this.menuEl&&this.triggerEl){this.menuEl.menuWidth=`${this.triggerEl.offsetWidth}px`;this.menuEl.anchor=this.triggerEl}this.syncMenuItems();this.isOpen=true}close(){this.isOpen=false}toggle(){if(this.isOpen){this.close()}else{this.open()}}handleKeyDown(e){if(document.activeElement!==this.triggerEl)return;if(!this.isOpen){switch(e.key){case"ArrowDown":case"ArrowUp":case"Enter":case" ":e.preventDefault();this.open();break}}else{if(e.key==="Escape"){e.preventDefault();this.close();this.triggerEl?.focus()}}}get selectedLabel(){const e=this.options.find((e=>e.value===this.value));return e?.label??""}get hasSelection(){return!!this.options.find((e=>e.value===this.value))}render(){const e=this.hasSelection?this.selectedLabel:this.placeholder;const s=!this.hasSelection;return i(r,{key:"f89c8d9283c9412dba10214a8a078bf180bda526",class:{"select-host":true,inactive:this.inactive}},i("button",{key:"7f2e490feb2424365bb5cabd1416a78c336b9988",ref:e=>{this.triggerEl=e??null},type:"button",class:{trigger:true,"trigger--open":this.isOpen},disabled:this.inactive,role:"combobox","aria-haspopup":"listbox","aria-expanded":this.isOpen,"aria-label":this.ariaLabel,"aria-labelledby":this.ariaLabelledby,onClick:()=>this.toggle()},i("span",{key:"faca9f6626914ec300eda66f3d9497aef1dcce81",class:{trigger__label:true,"trigger__label--placeholder":s}},e),i("svg",{key:"d8d175b43cb5335f898b98bf5774c1cc55ce4fd4",class:"trigger__chevron",width:"16",height:"16",viewBox:"0 0 16 16",fill:"none","aria-hidden":"true"},i("path",{key:"1c9bb3a48976d371e59cc85283ab6eb2fe342d6c",d:"M4 6L8 10L12 6",stroke:"currentColor","stroke-width":"1.25","stroke-linecap":"round","stroke-linejoin":"round"}))),i("ds-menu",{key:"f87e2929351a74e77e3c90f1ad5ae08064180441",ref:e=>{this.menuEl=e??null},side:"bottom",align:"start"}))}get el(){return this}static get watchers(){return{isOpen:[{onIsOpenChange:0}],options:[{onOptionsChange:0}],value:[{onValueChange:0}]}}static get style(){return c()}},[2,"ds-select",{options:[16],value:[1025],placeholder:[1],inactive:[4],ariaLabel:[1,"aria-label"],ariaLabelledby:[1,"aria-labelledby"],isOpen:[32]},[[0,"keydown","handleKeyDown"]],{isOpen:[{onIsOpenChange:0}],options:[{onOptionsChange:0}],value:[{onValueChange:0}]}]);function d(){if(typeof customElements==="undefined"){return}const e=["ds-select","ds-menu","ds-shell-gradient-picker","ds-shell-gradient-swatch"];e.forEach((e=>{switch(e){case"ds-select":if(!customElements.get(o(e))){customElements.define(o(e),h)}break;case"ds-menu":if(!customElements.get(o(e))){a()}break;case"ds-shell-gradient-picker":if(!customElements.get(o(e))){n()}break;case"ds-shell-gradient-swatch":if(!customElements.get(o(e))){l()}break}}))}d();const g=h;const p=d;export{g as DsSelect,p as defineCustomElement};
+import{p as e,H as s,c as t,h as i,a as r,t as o}from"./index.js";import{d as a}from"./p-CpNIQXz6.js";import{d as n}from"./p-DdFUTZ3y.js";import{d as c}from"./p-ChVwCVHy.js";const l=()=>`.select-host.sc-ds-select-h{display:inline-block;width:100%;position:relative}.inactive.sc-ds-select-h{opacity:0.5;pointer-events:none}.trigger.sc-ds-select{display:inline-flex;align-items:center;justify-content:space-between;width:100%;height:var(--dimension-size-400);padding:0 var(--dimension-space-075) 0 var(--dimension-space-100);border:none;border-radius:var(--dimension-radius-050);background-color:var(--color-background-primary);box-shadow:var(--effect-elevation-elevated-sm);cursor:pointer;box-sizing:border-box;gap:var(--dimension-space-050);font-family:inherit;outline:none;--_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))}.trigger.sc-ds-select:focus-visible{outline:var(--dimension-stroke-width-025) solid var(--color-interaction-focus);outline-offset:var(--dimension-space-025)}.trigger.sc-ds-select:hover:not(:disabled){background-color:var(--_hover-bg)}.trigger.sc-ds-select:active:not(:disabled){background-color:var(--_pressed-bg)}.trigger--open.sc-ds-select{background-color:var(--_pressed-bg)}.trigger__label.sc-ds-select{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;text-align:left;font-size:var(--typography-fontsize-md);line-height:var(--typography-lineheight-md);font-weight:var(--typography-weight-regular);color:var(--color-foreground-primary)}.trigger__label--placeholder.sc-ds-select{color:var(--color-foreground-secondary)}.trigger__chevron.sc-ds-select{flex-shrink:0;color:var(--color-foreground-secondary);transition:transform var(--effect-motion-short-2)}.trigger--open.sc-ds-select .trigger__chevron.sc-ds-select{transform:rotate(180deg)}`;const d=e(class e extends s{constructor(e){super();if(e!==false){this.__registerHost()}this.dsChange=t(this,"dsChange");this.options=[];this.value="";this.placeholder="Select option";this.inactive=false;this.isOpen=false;this.triggerEl=null;this.menuEl=null}componentDidLoad(){if(this.menuEl&&this.triggerEl){this.menuEl.anchor=this.triggerEl}this.menuEl?.addEventListener("dsSelect",(e=>{const s=e.detail;if(s?.value!==undefined){this.value=String(s.value);this.dsChange.emit(this.value)}this.isOpen=false}));this.menuEl?.addEventListener("dsClose",(()=>{this.isOpen=false}))}onIsOpenChange(e){if(this.menuEl){this.menuEl.open=e}}onOptionsChange(){this.syncMenuItems()}onValueChange(){this.syncMenuItems()}syncMenuItems(){if(!this.menuEl)return;this.menuEl.items=this.options.map((e=>({label:e.label,value:e.value,isSelected:e.value===this.value})))}open(){if(this.inactive||!this.options.length)return;if(this.menuEl&&this.triggerEl){this.menuEl.menuWidth=`${this.triggerEl.offsetWidth}px`;this.menuEl.anchor=this.triggerEl}this.syncMenuItems();this.isOpen=true}close(){this.isOpen=false}toggle(){if(this.isOpen){this.close()}else{this.open()}}handleKeyDown(e){if(document.activeElement!==this.triggerEl)return;if(!this.isOpen){switch(e.key){case"ArrowDown":case"ArrowUp":case"Enter":case" ":e.preventDefault();this.open();break}}else{if(e.key==="Escape"){e.preventDefault();this.close();this.triggerEl?.focus()}}}get selectedLabel(){const e=this.options.find((e=>e.value===this.value));return e?.label??""}get hasSelection(){return!!this.options.find((e=>e.value===this.value))}render(){const e=this.hasSelection?this.selectedLabel:this.placeholder;const s=!this.hasSelection;return i(r,{key:"3f539cccbdf00749a68a9e513e5e4d8ef0fcaeb9",class:{"select-host":true,inactive:this.inactive}},i("button",{key:"5ba9b0a950d5a3717fa0de7172441c82fce336fb",ref:e=>{this.triggerEl=e??null},type:"button",class:{trigger:true,"trigger--open":this.isOpen},disabled:this.inactive,role:"combobox","aria-haspopup":"listbox","aria-expanded":this.isOpen,"aria-label":this.ariaLabel,"aria-labelledby":this.ariaLabelledby,onClick:()=>this.toggle()},i("span",{key:"89a51d1b4ec69757d1c8df470529c1db98ec1d04",class:{trigger__label:true,"trigger__label--placeholder":s}},e),i("svg",{key:"587d0a8c205456a6dc0868a945471f84f7cac78d",class:"trigger__chevron",width:"16",height:"16",viewBox:"0 0 16 16",fill:"none","aria-hidden":"true"},i("path",{key:"df7a531aaca2fcccd6064d0a1cbaf547794eabf9",d:"M4 6L8 10L12 6",stroke:"currentColor","stroke-width":"1.25","stroke-linecap":"round","stroke-linejoin":"round"}))),i("ds-menu",{key:"e41da5785c44ed248dce51c607b4d697a73a1ec1",ref:e=>{this.menuEl=e??null},side:"bottom",align:"start"}))}get el(){return this}static get watchers(){return{isOpen:[{onIsOpenChange:0}],options:[{onOptionsChange:0}],value:[{onValueChange:0}]}}static get style(){return l()}},[2,"ds-select",{options:[16],value:[1025],placeholder:[1],inactive:[4],ariaLabel:[1,"aria-label"],ariaLabelledby:[1,"aria-labelledby"],isOpen:[32]},[[0,"keydown","handleKeyDown"]],{isOpen:[{onIsOpenChange:0}],options:[{onOptionsChange:0}],value:[{onValueChange:0}]}]);function h(){if(typeof customElements==="undefined"){return}const e=["ds-select","ds-menu","ds-shell-gradient-picker","ds-shell-gradient-swatch"];e.forEach((e=>{switch(e){case"ds-select":if(!customElements.get(o(e))){customElements.define(o(e),d)}break;case"ds-menu":if(!customElements.get(o(e))){a()}break;case"ds-shell-gradient-picker":if(!customElements.get(o(e))){n()}break;case"ds-shell-gradient-swatch":if(!customElements.get(o(e))){c()}break}}))}h();const g=d;const p=h;export{g as DsSelect,p as defineCustomElement};
 //# sourceMappingURL=ds-select.js.map

package/dist/components/ds-shell-gradient-picker.js

@@ -1,2 +1,2 @@
-import{S as o,d as s}from"./p-eOWUz57C.js";const t=o;const p=s;export{t as DsShellGradientPicker,p as defineCustomElement};
+import{S as o,d as s}from"./p-DdFUTZ3y.js";const t=o;const p=s;export{t as DsShellGradientPicker,p as defineCustomElement};
 //# sourceMappingURL=ds-shell-gradient-picker.js.map

package/dist/components/ds-shell-gradient-swatch.js

@@ -1,2 +1,2 @@
-import{S as o,d as s}from"./p-CRh-MLwj.js";const t=o;const p=s;export{t as DsShellGradientSwatch,p as defineCustomElement};
+import{S as o,d as s}from"./p-ChVwCVHy.js";const t=o;const p=s;export{t as DsShellGradientSwatch,p as defineCustomElement};
 //# sourceMappingURL=ds-shell-gradient-swatch.js.map

package/dist/components/ds-slider.js

@@ -1,2 +1,2 @@
-import{p as e,H as s,c as i,h as t,a,t as r}from"./index.js";const n=()=>`.field.sc-ds-slider{display:flex;flex-direction:column;gap:var(--dimension-space-050);width:100%}.label-row.sc-ds-slider{display:flex;align-items:baseline;justify-content:space-between;gap:var(--dimension-space-050)}.track.sc-ds-slider{position:relative;width:100%;height:var(--dimension-size-400);padding:0 var(--dimension-space-025);border-radius:var(--dimension-radius-075);cursor:pointer;user-select:none;box-sizing:border-box}.track-inner.sc-ds-slider{position:absolute;inset:0;border-radius:inherit;background-color:var(--color-background-primary);box-shadow:var(--effect-elevation-depressed-sm);pointer-events:none;z-index:1}.fill-track.sc-ds-slider{position:absolute;top:var(--dimension-space-025);right:0;bottom:var(--dimension-space-025);left:0;z-index:1;pointer-events:none}.fill.sc-ds-slider{position:absolute;left:var(--dimension-space-025);top:0;bottom:0;width:max(0px, calc((var(--slider-pct, 0) / 100) * (100% - var(--dimension-size-150)) - var(--dimension-space-025)));background-color:var(--color-background-bold-brand);box-shadow:var(--effect-elevation-elevated-sm);border-radius:var(--dimension-radius-050);transition:opacity var(--effect-motion-short-2);pointer-events:none}.track--at-min.sc-ds-slider .fill.sc-ds-slider{opacity:0}.thumb.sc-ds-slider{position:absolute;top:0;bottom:0;left:calc((var(--slider-pct, 0) / 100) * (100% - var(--dimension-size-150)));width:var(--dimension-size-150);padding:var(--dimension-space-025);box-sizing:border-box;pointer-events:none;z-index:2}.thumb.sc-ds-slider::before{content:'';position:absolute;inset:var(--dimension-space-025);background-color:var(--color-background-primary);box-shadow:var(--effect-elevation-elevated-sm);border-radius:var(--dimension-radius-050)}.thumb.sc-ds-slider::after{content:'';position:absolute;inset:var(--dimension-space-025);background-color:transparent;border-radius:var(--dimension-radius-050);transition:background-color 100ms ease}.track.sc-ds-slider:hover:not(.track--inactive) .thumb.sc-ds-slider::after{background-color:var(--color-interaction-hover)}.track.sc-ds-slider:active:not(.track--inactive) .thumb.sc-ds-slider::after{background-color:var(--color-interaction-pressed)}.range-input.sc-ds-slider{position:absolute;inset:0;width:100%;height:100%;margin:0;padding:0;opacity:0;cursor:pointer;-webkit-appearance:none;appearance:none;outline:none;z-index:3}.range-input.sc-ds-slider:disabled{cursor:not-allowed}.range-input.sc-ds-slider:hover{cursor:grab}.range-input.sc-ds-slider:active{cursor:grabbing}.track--inactive.sc-ds-slider{cursor:not-allowed;opacity:0.5}.track.sc-ds-slider:focus-within .track-inner.sc-ds-slider{box-shadow:var(--effect-elevation-depressed-sm), inset 0 0 0 1.25px var(--color-interaction-focus)}`;let o=0;const d=e(class e extends s{constructor(e){super();if(e!==false){this.__registerHost()}this.dsChange=i(this,"dsChange");this.generatedId=`ds-slider-${++o}`;this.value=0;this.min=0;this.max=100;this.step=1;this.inactive=false;this.handleInput=e=>{this.dsChange.emit(Number(e.target.value))}}get pct(){const e=this.max-this.min;return e===0?0:Math.round((this.value-this.min)/e*100)}render(){const e=this.inputId??this.generatedId;const s=this.pct;return t(a,{key:"b7147eb06d8859e3ea03073d333d63a63036add4",class:"field"},t("div",{key:"0589ac26bd05288a044485f19120397b78829e03",class:"label-row"},t("label",{key:"bd75405a27b95edc41bcaca9425c04f15819e5c2",class:"text-body-small-emphasis",htmlFor:e},this.label),t("span",{key:"901b006fb1ce96b3f7ba99ff0e22bfdbe75d28e4",class:"text-body-small-emphasis"},this.value)),t("div",{key:"bea458e318e0e49c24ed71583d8907bfeea76232",class:{track:true,"track--inactive":this.inactive,"track--at-min":s===0},style:{"--slider-pct":String(s)}},t("div",{key:"3052ee819db6afa6c64419d523bd715e56fe9962",class:"track-inner"},t("div",{key:"b21f54daa9dc732b660f30d36422a5335b4ec1bf",class:"fill-track"},t("div",{key:"80e5450d9e68a5cd81544d70e8fb8c3c134f0642",class:"fill"})),t("div",{key:"0622efb3f3e7473ad69cce52cfe917dd959d02b6",class:"thumb"})),t("input",{key:"07429f1ea6ec9885b162c0dfa755e9129a9a3250",type:"range",id:e,min:this.min,max:this.max,step:this.step,value:this.value,disabled:this.inactive,class:"range-input","aria-valuetext":this.valueText,onInput:this.handleInput})))}static get style(){return n()}},[2,"ds-slider",{value:[2],min:[2],max:[2],step:[2],label:[1],inactive:[4],valueText:[1,"value-text"],inputId:[1,"input-id"]}]);function c(){if(typeof customElements==="undefined"){return}const e=["ds-slider"];e.forEach((e=>{switch(e){case"ds-slider":if(!customElements.get(r(e))){customElements.define(r(e),d)}break}}))}c();const l=d;const b=c;export{l as DsSlider,b as defineCustomElement};
+import{p as e,H as s,c as i,h as t,a,t as r}from"./index.js";const n=()=>`.field.sc-ds-slider{display:flex;flex-direction:column;gap:var(--dimension-space-050);width:100%}.label-row.sc-ds-slider{display:flex;align-items:baseline;justify-content:space-between;gap:var(--dimension-space-050)}.track.sc-ds-slider{position:relative;width:100%;height:var(--dimension-size-400);padding:0 var(--dimension-space-025);border-radius:var(--dimension-radius-075);cursor:pointer;user-select:none;box-sizing:border-box}.track-inner.sc-ds-slider{position:absolute;inset:0;border-radius:inherit;background-color:var(--color-background-primary);box-shadow:var(--effect-elevation-depressed-sm);pointer-events:none;z-index:1}.fill-track.sc-ds-slider{position:absolute;top:var(--dimension-space-025);right:0;bottom:var(--dimension-space-025);left:0;z-index:1;pointer-events:none}.fill.sc-ds-slider{position:absolute;left:var(--dimension-space-025);top:0;bottom:0;width:max(0px, calc((var(--slider-pct, 0) / 100) * (100% - var(--dimension-size-150)) - var(--dimension-space-025)));background-color:var(--color-background-bold-brand);box-shadow:var(--effect-elevation-elevated-sm);border-radius:var(--dimension-radius-050);transition:opacity var(--effect-motion-short-2);pointer-events:none}.track--at-min.sc-ds-slider .fill.sc-ds-slider{opacity:0}.thumb.sc-ds-slider{position:absolute;top:0;bottom:0;left:calc((var(--slider-pct, 0) / 100) * (100% - var(--dimension-size-150)));width:var(--dimension-size-150);padding:var(--dimension-space-025);box-sizing:border-box;pointer-events:none;z-index:2}.thumb.sc-ds-slider::before{content:'';position:absolute;inset:var(--dimension-space-025);background-color:var(--color-background-primary);box-shadow:var(--effect-elevation-elevated-sm);border-radius:var(--dimension-radius-050)}.thumb.sc-ds-slider::after{content:'';position:absolute;inset:var(--dimension-space-025);background-color:transparent;border-radius:var(--dimension-radius-050);transition:background-color 100ms ease}.track.sc-ds-slider:hover:not(.track--inactive) .thumb.sc-ds-slider::after{background-color:var(--color-interaction-hover)}.track.sc-ds-slider:active:not(.track--inactive) .thumb.sc-ds-slider::after{background-color:var(--color-interaction-pressed)}.range-input.sc-ds-slider{position:absolute;inset:0;width:100%;height:100%;margin:0;padding:0;opacity:0;cursor:pointer;-webkit-appearance:none;appearance:none;outline:none;z-index:3}.range-input.sc-ds-slider:disabled{cursor:not-allowed}.range-input.sc-ds-slider:hover{cursor:grab}.range-input.sc-ds-slider:active{cursor:grabbing}.track--inactive.sc-ds-slider{cursor:not-allowed;opacity:0.5}.track.sc-ds-slider:focus-within .track-inner.sc-ds-slider{box-shadow:var(--effect-elevation-depressed-sm), inset 0 0 0 1.25px var(--color-interaction-focus)}`;let o=0;const c=e(class e extends s{constructor(e){super();if(e!==false){this.__registerHost()}this.dsChange=i(this,"dsChange");this.generatedId=`ds-slider-${++o}`;this.value=0;this.min=0;this.max=100;this.step=1;this.inactive=false;this.handleInput=e=>{this.dsChange.emit(Number(e.target.value))}}get pct(){const e=this.max-this.min;return e===0?0:Math.round((this.value-this.min)/e*100)}render(){const e=this.inputId??this.generatedId;const s=this.pct;return t(a,{key:"75c8794c2e99eb28c229f695888338159eaac47c",class:"field"},t("div",{key:"5f600c4d19e5a27881ff5b606e8e56033c27c803",class:"label-row"},t("label",{key:"a7087a684bb5cc5a0463cc6ce260f8d9021199e0",class:"text-body-small-emphasis",htmlFor:e},this.label),t("span",{key:"8933a2f311042822883a11c2c2188fb746f74c02",class:"text-body-small-emphasis"},this.value)),t("div",{key:"1917d0b100c3315428167097bc98658d916b34d2",class:{track:true,"track--inactive":this.inactive,"track--at-min":s===0},style:{"--slider-pct":String(s)}},t("div",{key:"73aa63959a3e44601ac544c12a7f7bc2094b5ce3",class:"track-inner"},t("div",{key:"04afa6d8e2e589536bca1ad61183dae2c373a9e7",class:"fill-track"},t("div",{key:"c9239f86c4ec5e4e0321f1ad6f5d218336f40dcb",class:"fill"})),t("div",{key:"ed3104c18ecd840c8494b7f568b39fb30ea067f1",class:"thumb"})),t("input",{key:"0f062cc837842f1677fa8d549d112e0bdb4bcaa6",type:"range",id:e,min:this.min,max:this.max,step:this.step,value:this.value,disabled:this.inactive,class:"range-input","aria-valuetext":this.valueText,onInput:this.handleInput})))}static get style(){return n()}},[2,"ds-slider",{value:[2],min:[2],max:[2],step:[2],label:[1],inactive:[4],valueText:[1,"value-text"],inputId:[1,"input-id"]}]);function d(){if(typeof customElements==="undefined"){return}const e=["ds-slider"];e.forEach((e=>{switch(e){case"ds-slider":if(!customElements.get(r(e))){customElements.define(r(e),c)}break}}))}d();const l=c;const b=d;export{l as DsSlider,b as defineCustomElement};
 //# sourceMappingURL=ds-slider.js.map

package/dist/components/ds-surface.js

@@ -1,2 +1,2 @@
-import{p as r,H as o,h as e,a,t as s}from"./index.js";const n=()=>`.surface.sc-ds-surface{box-sizing:border-box;position:relative;border:none;padding:0;margin:0;font:inherit;color:inherit;background:none;text-decoration:none;text-align:left;cursor:default;appearance:none;-webkit-appearance:none}.bg-primary.sc-ds-surface{background-color:var(--color-background-primary)}.bg-secondary.sc-ds-surface{background-color:var(--color-background-secondary)}.bg-transparent.sc-ds-surface{background-color:transparent}.bg-translucent.sc-ds-surface{background-color:var(--color-background-translucent);backdrop-filter:blur(var(--effect-blur-md));-webkit-backdrop-filter:blur(var(--effect-blur-md))}.intent-brand-faint.sc-ds-surface{background-color:var(--color-background-faint-brand)}.intent-brand-medium.sc-ds-surface{background-color:var(--color-background-medium-brand)}.intent-brand-bold.sc-ds-surface{background-color:var(--color-background-bold-brand)}.intent-brand-strong.sc-ds-surface{background-color:var(--color-background-strong-brand)}.intent-positive-faint.sc-ds-surface{background-color:var(--color-background-faint-positive)}.intent-positive-medium.sc-ds-surface{background-color:var(--color-background-medium-positive)}.intent-positive-bold.sc-ds-surface{background-color:var(--color-background-bold-positive)}.intent-positive-strong.sc-ds-surface{background-color:var(--color-background-strong-positive)}.intent-negative-faint.sc-ds-surface{background-color:var(--color-background-faint-negative)}.intent-negative-medium.sc-ds-surface{background-color:var(--color-background-medium-negative)}.intent-negative-bold.sc-ds-surface{background-color:var(--color-background-bold-negative)}.intent-negative-strong.sc-ds-surface{background-color:var(--color-background-strong-negative)}.intent-warning-faint.sc-ds-surface{background-color:var(--color-background-faint-warning)}.intent-warning-medium.sc-ds-surface{background-color:var(--color-background-medium-warning)}.intent-warning-bold.sc-ds-surface{background-color:var(--color-background-bold-warning)}.intent-warning-strong.sc-ds-surface{background-color:var(--color-background-strong-warning)}.intent-caution-faint.sc-ds-surface{background-color:var(--color-background-faint-caution)}.intent-caution-medium.sc-ds-surface{background-color:var(--color-background-medium-caution)}.intent-caution-bold.sc-ds-surface{background-color:var(--color-background-bold-caution)}.intent-caution-strong.sc-ds-surface{background-color:var(--color-background-strong-caution)}.intent-ai-faint.sc-ds-surface{background-color:var(--color-background-faint-ai)}.intent-ai-medium.sc-ds-surface{background-color:var(--color-background-medium-ai)}.intent-ai-bold.sc-ds-surface{background-color:var(--color-background-bold-ai)}.intent-ai-strong.sc-ds-surface{background-color:var(--color-background-strong-ai)}.intent-neutral-faint.sc-ds-surface{background-color:var(--color-background-faint-neutral)}.intent-neutral-medium.sc-ds-surface{background-color:var(--color-background-medium-neutral)}.intent-neutral-bold.sc-ds-surface{background-color:var(--color-background-bold-neutral)}.intent-neutral-strong.sc-ds-surface{background-color:var(--color-background-strong-neutral)}.intent-walkthrough-faint.sc-ds-surface{background-color:var(--color-background-faint-walkthrough)}.intent-walkthrough-medium.sc-ds-surface{background-color:var(--color-background-medium-walkthrough)}.intent-walkthrough-bold.sc-ds-surface{background-color:var(--color-background-bold-walkthrough)}.intent-walkthrough-strong.sc-ds-surface{background-color:var(--color-background-strong-walkthrough)}.intent-guide-faint.sc-ds-surface{background-color:var(--color-background-faint-guide)}.intent-guide-medium.sc-ds-surface{background-color:var(--color-background-medium-guide)}.intent-guide-bold.sc-ds-surface{background-color:var(--color-background-bold-guide)}.intent-guide-strong.sc-ds-surface{background-color:var(--color-background-strong-guide)}.elevation-depressed.sc-ds-surface{box-shadow:var(--effect-elevation-depressed-sm)}.elevation-depressed-md.sc-ds-surface{box-shadow:var(--effect-elevation-depressed-md)}.elevation-flat.sc-ds-surface{box-shadow:var(--effect-elevation-elevated-sm)}.elevation-elevated.sc-ds-surface{box-shadow:var(--effect-elevation-elevated-md)}.elevation-floating.sc-ds-surface{box-shadow:var(--effect-elevation-elevated-floating)}.elevation-overlayTop.sc-ds-surface{box-shadow:var(--effect-elevation-elevated-panel-top)}.elevation-overlayRight.sc-ds-surface{box-shadow:var(--effect-elevation-elevated-panel-right)}.elevation-overlayBottom.sc-ds-surface{box-shadow:var(--effect-elevation-elevated-panel-bottom)}.elevation-overlayLeft.sc-ds-surface{box-shadow:var(--effect-elevation-elevated-panel-left)}.edge-top.sc-ds-surface{border-top:var(--dimension-stroke-width-015) solid var(--color-border-tertiary)}.edge-right.sc-ds-surface{border-right:var(--dimension-stroke-width-015) solid var(--color-border-tertiary)}.edge-bottom.sc-ds-surface{border-bottom:var(--dimension-stroke-width-015) solid var(--color-border-tertiary)}.edge-left.sc-ds-surface{border-left:var(--dimension-stroke-width-015) solid var(--color-border-tertiary)}.radius-none.sc-ds-surface{border-radius:var(--dimension-radius-000)}.radius-xs.sc-ds-surface{border-radius:var(--dimension-radius-050)}.radius-sm.sc-ds-surface{border-radius:var(--dimension-radius-075)}.radius-md.sc-ds-surface{border-radius:var(--dimension-radius-100)}.radius-lg.sc-ds-surface{border-radius:var(--dimension-radius-125)}.radius-xl.sc-ds-surface{border-radius:var(--dimension-radius-175)}.radius-2xl.sc-ds-surface{border-radius:var(--dimension-radius-200)}.radius-full.sc-ds-surface{border-radius:var(--dimension-radius-half)}.interactive.sc-ds-surface{cursor:pointer;transition:transform var(--effect-motion-short-2);--_hover-bg:var(--color-interaction-hover);--_pressed-bg:var(--color-interaction-pressed)}.interactive.sc-ds-surface:hover{background-color:var(--_hover-bg)}.interactive.sc-ds-surface:active{background-color:var(--_pressed-bg);transform:scale(var(--dimension-scale-subtle))}.interactive.sc-ds-surface:focus-visible{outline:var(--dimension-stroke-width-025) solid var(--color-interaction-focus);outline-offset:var(--dimension-space-025)}.selected.sc-ds-surface::before{content:'';position:absolute;inset:0;border-radius:inherit;pointer-events:none;z-index:0;background-color:var(--color-interaction-hover)}.selected.sc-ds-surface>*.sc-ds-surface{position:relative;z-index:1}.inactive.sc-ds-surface{opacity:0.5;cursor:not-allowed;pointer-events:none}`;const c=new Set(["none","xs","sm","md","lg","xl","2xl","full"]);const t=r(class r extends o{constructor(r){super();if(r!==false){this.__registerHost()}this.background="transparent";this.contrast="faint";this.elevation="none";this.interactive=false;this.selected=false;this.inactive=false;this.as="div"}render(){const r=this.as;const o=this.intent?`intent-${this.intent}-${this.contrast}`:`bg-${this.background}`;const s=`elevation-${this.elevation}`;const n=this.edge&&this.elevation==="none"?this.edge.trim().split(/\s+/).map((r=>`edge-${r}`)):[];const t=this.radius&&c.has(this.radius)?`radius-${this.radius}`:"";const d=this.radius&&!c.has(this.radius)?this.radius:undefined;const i=["surface",o,s,...n,t,this.interactive?"interactive":"",this.selected?"selected":"",this.inactive?"inactive":""].filter(Boolean).join(" ");return e(a,{key:"1d99153f9bfe407c51f5f970363f7ad164374f7f",style:{display:"contents"}},e(r,{key:"9a52a59aa91e22b34830dcfe72237e7a4cdd1d97",class:i,style:d?{borderRadius:d}:undefined},e("slot",{key:"8416d8ac93dfa53cdc6adcb257d6fc2a6dd60d20"})))}static get style(){return n()}},[262,"ds-surface",{background:[1],intent:[1],contrast:[1],elevation:[1],edge:[1],radius:[1],interactive:[4],selected:[4],inactive:[4],as:[1]}]);function d(){if(typeof customElements==="undefined"){return}const r=["ds-surface"];r.forEach((r=>{switch(r){case"ds-surface":if(!customElements.get(s(r))){customElements.define(s(r),t)}break}}))}d();const i=t;const u=d;export{i as DsSurface,u as defineCustomElement};
+import{p as r,H as o,h as e,a,t as s}from"./index.js";const n=()=>`.surface.sc-ds-surface{box-sizing:border-box;position:relative;border:none;padding:0;margin:0;font:inherit;color:inherit;background:none;text-decoration:none;text-align:left;cursor:default;appearance:none;-webkit-appearance:none}.bg-primary.sc-ds-surface{background-color:var(--color-background-primary)}.bg-secondary.sc-ds-surface{background-color:var(--color-background-secondary)}.bg-transparent.sc-ds-surface{background-color:transparent}.bg-translucent.sc-ds-surface{background-color:var(--color-background-translucent);backdrop-filter:blur(var(--effect-blur-md));-webkit-backdrop-filter:blur(var(--effect-blur-md))}.intent-brand-faint.sc-ds-surface{background-color:var(--color-background-faint-brand)}.intent-brand-medium.sc-ds-surface{background-color:var(--color-background-medium-brand)}.intent-brand-bold.sc-ds-surface{background-color:var(--color-background-bold-brand)}.intent-brand-strong.sc-ds-surface{background-color:var(--color-background-strong-brand)}.intent-positive-faint.sc-ds-surface{background-color:var(--color-background-faint-positive)}.intent-positive-medium.sc-ds-surface{background-color:var(--color-background-medium-positive)}.intent-positive-bold.sc-ds-surface{background-color:var(--color-background-bold-positive)}.intent-positive-strong.sc-ds-surface{background-color:var(--color-background-strong-positive)}.intent-negative-faint.sc-ds-surface{background-color:var(--color-background-faint-negative)}.intent-negative-medium.sc-ds-surface{background-color:var(--color-background-medium-negative)}.intent-negative-bold.sc-ds-surface{background-color:var(--color-background-bold-negative)}.intent-negative-strong.sc-ds-surface{background-color:var(--color-background-strong-negative)}.intent-warning-faint.sc-ds-surface{background-color:var(--color-background-faint-warning)}.intent-warning-medium.sc-ds-surface{background-color:var(--color-background-medium-warning)}.intent-warning-bold.sc-ds-surface{background-color:var(--color-background-bold-warning)}.intent-warning-strong.sc-ds-surface{background-color:var(--color-background-strong-warning)}.intent-caution-faint.sc-ds-surface{background-color:var(--color-background-faint-caution)}.intent-caution-medium.sc-ds-surface{background-color:var(--color-background-medium-caution)}.intent-caution-bold.sc-ds-surface{background-color:var(--color-background-bold-caution)}.intent-caution-strong.sc-ds-surface{background-color:var(--color-background-strong-caution)}.intent-ai-faint.sc-ds-surface{background-color:var(--color-background-faint-ai)}.intent-ai-medium.sc-ds-surface{background-color:var(--color-background-medium-ai)}.intent-ai-bold.sc-ds-surface{background-color:var(--color-background-bold-ai)}.intent-ai-strong.sc-ds-surface{background-color:var(--color-background-strong-ai)}.intent-neutral-faint.sc-ds-surface{background-color:var(--color-background-faint-neutral)}.intent-neutral-medium.sc-ds-surface{background-color:var(--color-background-medium-neutral)}.intent-neutral-bold.sc-ds-surface{background-color:var(--color-background-bold-neutral)}.intent-neutral-strong.sc-ds-surface{background-color:var(--color-background-strong-neutral)}.intent-walkthrough-faint.sc-ds-surface{background-color:var(--color-background-faint-walkthrough)}.intent-walkthrough-medium.sc-ds-surface{background-color:var(--color-background-medium-walkthrough)}.intent-walkthrough-bold.sc-ds-surface{background-color:var(--color-background-bold-walkthrough)}.intent-walkthrough-strong.sc-ds-surface{background-color:var(--color-background-strong-walkthrough)}.intent-guide-faint.sc-ds-surface{background-color:var(--color-background-faint-guide)}.intent-guide-medium.sc-ds-surface{background-color:var(--color-background-medium-guide)}.intent-guide-bold.sc-ds-surface{background-color:var(--color-background-bold-guide)}.intent-guide-strong.sc-ds-surface{background-color:var(--color-background-strong-guide)}.elevation-depressed.sc-ds-surface{box-shadow:var(--effect-elevation-depressed-sm)}.elevation-depressed-md.sc-ds-surface{box-shadow:var(--effect-elevation-depressed-md)}.elevation-flat.sc-ds-surface{box-shadow:var(--effect-elevation-elevated-sm)}.elevation-elevated.sc-ds-surface{box-shadow:var(--effect-elevation-elevated-md)}.elevation-floating.sc-ds-surface{box-shadow:var(--effect-elevation-elevated-floating)}.elevation-overlayTop.sc-ds-surface{box-shadow:var(--effect-elevation-elevated-panel-top)}.elevation-overlayRight.sc-ds-surface{box-shadow:var(--effect-elevation-elevated-panel-right)}.elevation-overlayBottom.sc-ds-surface{box-shadow:var(--effect-elevation-elevated-panel-bottom)}.elevation-overlayLeft.sc-ds-surface{box-shadow:var(--effect-elevation-elevated-panel-left)}.edge-top.sc-ds-surface{border-top:var(--dimension-stroke-width-015) solid var(--color-border-tertiary)}.edge-right.sc-ds-surface{border-right:var(--dimension-stroke-width-015) solid var(--color-border-tertiary)}.edge-bottom.sc-ds-surface{border-bottom:var(--dimension-stroke-width-015) solid var(--color-border-tertiary)}.edge-left.sc-ds-surface{border-left:var(--dimension-stroke-width-015) solid var(--color-border-tertiary)}.radius-none.sc-ds-surface{border-radius:var(--dimension-radius-000)}.radius-xs.sc-ds-surface{border-radius:var(--dimension-radius-050)}.radius-sm.sc-ds-surface{border-radius:var(--dimension-radius-075)}.radius-md.sc-ds-surface{border-radius:var(--dimension-radius-100)}.radius-lg.sc-ds-surface{border-radius:var(--dimension-radius-125)}.radius-xl.sc-ds-surface{border-radius:var(--dimension-radius-175)}.radius-2xl.sc-ds-surface{border-radius:var(--dimension-radius-200)}.radius-full.sc-ds-surface{border-radius:var(--dimension-radius-half)}.interactive.sc-ds-surface{cursor:pointer;transition:transform var(--effect-motion-short-2);--_hover-bg:var(--color-interaction-hover);--_pressed-bg:var(--color-interaction-pressed)}.interactive.sc-ds-surface:hover{background-color:var(--_hover-bg)}.interactive.sc-ds-surface:active{background-color:var(--_pressed-bg);transform:scale(var(--dimension-scale-subtle))}.interactive.sc-ds-surface:focus-visible{outline:var(--dimension-stroke-width-025) solid var(--color-interaction-focus);outline-offset:var(--dimension-space-025)}.selected.sc-ds-surface::before{content:'';position:absolute;inset:0;border-radius:inherit;pointer-events:none;z-index:0;background-color:var(--color-interaction-hover)}.selected.sc-ds-surface>*.sc-ds-surface{position:relative;z-index:1}.inactive.sc-ds-surface{opacity:0.5;cursor:not-allowed;pointer-events:none}`;const c=new Set(["none","xs","sm","md","lg","xl","2xl","full"]);const t=r(class r extends o{constructor(r){super();if(r!==false){this.__registerHost()}this.background="transparent";this.contrast="faint";this.elevation="none";this.interactive=false;this.selected=false;this.inactive=false;this.as="div"}render(){const r=this.as;const o=this.intent?`intent-${this.intent}-${this.contrast}`:`bg-${this.background}`;const s=`elevation-${this.elevation}`;const n=this.edge&&this.elevation==="none"?this.edge.trim().split(/\s+/).map((r=>`edge-${r}`)):[];const t=this.radius&&c.has(this.radius)?`radius-${this.radius}`:"";const d=this.radius&&!c.has(this.radius)?this.radius:undefined;const i=["surface",o,s,...n,t,this.interactive?"interactive":"",this.selected?"selected":"",this.inactive?"inactive":""].filter(Boolean).join(" ");return e(a,{key:"336d95fbb17cb9f4a02e7f5a338b41000dc8605d",style:{display:"contents"}},e(r,{key:"c9b8daaef99b94527604ab5008650bb2839c8aa8",class:i,style:d?{borderRadius:d}:undefined},e("slot",{key:"e2ac706676c2d7a980b3aaa115d17eb9b0bc7e50"})))}static get style(){return n()}},[262,"ds-surface",{background:[1],intent:[1],contrast:[1],elevation:[1],edge:[1],radius:[1],interactive:[4],selected:[4],inactive:[4],as:[1]}]);function d(){if(typeof customElements==="undefined"){return}const r=["ds-surface"];r.forEach((r=>{switch(r){case"ds-surface":if(!customElements.get(s(r))){customElements.define(s(r),t)}break}}))}d();const i=t;const u=d;export{i as DsSurface,u as defineCustomElement};
 //# sourceMappingURL=ds-surface.js.map

package/dist/components/ds-tab-group-nav.js

@@ -1,2 +1,2 @@
-import{T as o,d as s}from"./p-BXI096cJ.js";const t=o;const c=s;export{t as DsTabGroupNav,c as defineCustomElement};
+import{T as o,d as s}from"./p-CvgHQfvT.js";const t=o;const p=s;export{t as DsTabGroupNav,p as defineCustomElement};
 //# sourceMappingURL=ds-tab-group-nav.js.map

package/dist/components/ds-tab-group.js

@@ -1,2 +1,2 @@
-import{p as r,H as o,c as t,h as e,a as s,t as a}from"./index.js";import{g as i,i as n}from"./p-BQq26pt9.js";import{d}from"./p-EK1hOP19.js";const c=()=>`.sc-ds-tab-group-h{--ds-focus-ring-width:var(--dimension-stroke-width-025, 2px);--ds-focus-ring-offset:var(--dimension-space-025, 2px);--ds-focus-ring-color:var(--color-interaction-focus)}.ds-focus-ring.sc-ds-tab-group:focus-visible{outline:var(--ds-focus-ring-width) solid var(--ds-focus-ring-color);outline-offset:var(--ds-focus-ring-offset)}.ds-focus-ring.ds-focus-ring--visible.sc-ds-tab-group{outline:var(--ds-focus-ring-width) solid var(--ds-focus-ring-color);outline-offset:var(--ds-focus-ring-offset)}.ds-focus-ring-inset.sc-ds-tab-group:focus-visible{outline:none}.ds-focus-ring-inset.sc-ds-tab-group:focus-visible::after{outline:var(--ds-focus-ring-width) solid var(--ds-focus-ring-color);outline-offset:calc(-1 * var(--ds-focus-ring-width))}.ds-focus-ring-inset.ds-focus-ring--visible.sc-ds-tab-group{outline:none}.ds-focus-ring-inset.ds-focus-ring--visible.sc-ds-tab-group::after{outline:var(--ds-focus-ring-width) solid var(--ds-focus-ring-color);outline-offset:calc(-1 * var(--ds-focus-ring-width))}.sc-ds-tab-group-h{display:block}.tab-list.sc-ds-tab-group{display:flex;align-items:center;gap:var(--dimension-space-050);position:relative;width:max-content;max-width:100%;height:var(--dimension-size-400);padding:calc(var(--dimension-space-050) - var(--dimension-stroke-width-012));background-color:var(--color-background-secondary);border:var(--dimension-stroke-width-012) solid var(--color-border-tertiary);border-radius:var(--dimension-radius-half);box-sizing:border-box}.tab-list--vertical.sc-ds-tab-group{flex-direction:column;align-items:stretch}.tab.sc-ds-tab-group{display:flex;align-items:center;justify-content:center;gap:var(--dimension-space-050);padding:var(--dimension-space-050);background-color:transparent;border:var(--dimension-stroke-width-012) solid transparent;border-radius:var(--dimension-radius-half);cursor:pointer;-webkit-user-select:none;user-select:none;color:var(--color-foreground-secondary);position:relative;transition:color var(--effect-motion-short-2);flex-shrink:0;height:var(--dimension-size-300);min-width:var(--dimension-size-400);box-sizing:border-box;--_hover-bg:var(--color-interaction-hover);--_pressed-bg:var(--color-interaction-pressed);--_dot:var(--color-foreground-bold-brand);--_dot-ring:var(--color-background-secondary)}.tab.sc-ds-tab-group::after{content:'';position:absolute;inset:calc(var(--dimension-stroke-width-012) * -1);border-radius:inherit;background:transparent;pointer-events:none;transition:none}.tab.sc-ds-tab-group:hover::after{background:var(--_hover-bg);transition:none}.tab.sc-ds-tab-group:active::after{background:var(--_pressed-bg);transition:none}.tab--selected.sc-ds-tab-group{color:var(--color-foreground-primary);background-color:var(--color-background-primary);border-color:var(--color-border-tertiary)}.tab.sc-ds-tab-group:disabled,.tab[aria-disabled="true"].sc-ds-tab-group{opacity:0.5;cursor:not-allowed;pointer-events:none}.tab-list--vertical.sc-ds-tab-group .tab.sc-ds-tab-group{justify-content:flex-start}.tab__label.sc-ds-tab-group{position:relative;display:inline-flex;align-items:center;padding:0 var(--dimension-space-025);white-space:nowrap}.tab__label--dot.sc-ds-tab-group{padding-right:calc(var(--dimension-space-025) + var(--dimension-space-050))}.tab__dot.sc-ds-tab-group{position:absolute;top:0;right:0;pointer-events:none}.on-medium.sc-ds-tab-group{--_hover-bg:var(--color-interaction-on-medium-background-hover);--_pressed-bg:var(--color-interaction-on-medium-background-pressed);--_dot-ring:var(--color-background-medium-neutral);--ds-focus-ring-color:var(--color-interaction-on-medium-background-focus)}.on-bold.sc-ds-tab-group{--_hover-bg:var(--color-interaction-on-bold-background-hover);--_pressed-bg:var(--color-interaction-on-bold-background-pressed);--_dot-ring:var(--color-background-bold-neutral);--ds-focus-ring-color:var(--color-interaction-on-bold-background-focus);color:var(--color-foreground-on-bold-background-secondary)}.on-bold.tab--selected.sc-ds-tab-group{color:var(--color-foreground-on-bold-background-primary)}.on-strong.sc-ds-tab-group{--_hover-bg:var(--color-interaction-on-strong-background-hover);--_pressed-bg:var(--color-interaction-on-strong-background-pressed);--_dot-ring:var(--color-background-strong-neutral);--ds-focus-ring-color:var(--color-interaction-on-strong-background-focus);color:var(--color-foreground-on-bold-background-secondary)}.on-strong.tab--selected.sc-ds-tab-group{color:var(--color-foreground-on-bold-background-primary)}.on-always-dark.sc-ds-tab-group{--_hover-bg:var(--color-always-dark-interaction-hover);--_pressed-bg:var(--color-always-dark-interaction-pressed);--_dot-ring:var(--color-always-dark-background);--ds-focus-ring-color:var(--color-always-dark-interaction-focus);color:var(--color-always-dark-foreground-secondary)}.on-always-dark.tab--selected.sc-ds-tab-group{color:var(--color-always-dark-foreground-primary)}.tab-divider.sc-ds-tab-group{display:flex;align-items:center;justify-content:center;box-sizing:border-box;width:var(--dimension-stroke-width-012);align-self:center;padding:0;flex-shrink:0;pointer-events:none}.tab-divider__line.sc-ds-tab-group{width:var(--dimension-stroke-width-012);height:var(--typography-lineheight-sm);flex-shrink:0;background-color:var(--color-border-secondary)}.tab-divider--vertical.sc-ds-tab-group{width:auto;height:var(--dimension-stroke-width-012);align-self:stretch;padding:0}.tab-divider--vertical.sc-ds-tab-group .tab-divider__line.sc-ds-tab-group{width:auto;height:var(--dimension-stroke-width-012);align-self:stretch}`;const l=r(class r extends o{constructor(r){super();if(r!==false){this.__registerHost()}this.dsChange=t(this,"dsChange");this.value="";this.tabs=[];this.orientation="horizontal"}get selectableTabs(){return i(this.tabs)}selectTab(r,o){this.value=r;this.dsChange.emit(r);if(o?.focus!==false){this.focusTab(r)}}focusTab(r){const o=this.el.querySelector(`[data-tab-id="${r}"]`);o?.focus({preventScroll:true})}onValueChange(r,o){if(o===undefined||r===o)return;requestAnimationFrame((()=>{const o=document.activeElement;if(!o||!this.el.contains(o))return;const t=o.getAttribute("data-tab-id");if(t===r)return;const e=this.el.querySelector(`[data-tab-id="${r}"]`);if(e){e.focus({preventScroll:true})}else{o.blur()}}))}findEnabled(r,o){const t=this.selectableTabs;const e=t.length;for(let s=0;s<e;s++){const a=(r+o*(s+1)+e*(s+1))%e;if(!t[a]?.disabled)return a}return r}handleKeyDown(r){const o=this.selectableTabs;if(!o.length)return;const t=o.findIndex((r=>r.id===this.value));const e=this.orientation==="vertical";let s=null;if(!e){if(r.key==="ArrowRight"){s=this.findEnabled(t,1)}else if(r.key==="ArrowLeft"){s=this.findEnabled(t,-1)}}else{if(r.key==="ArrowDown"){s=this.findEnabled(t,1)}else if(r.key==="ArrowUp"){s=this.findEnabled(t,-1)}}if(r.key==="Home"){const r=o.findIndex((r=>!r.disabled));s=r===-1?null:r}else if(r.key==="End"){const r=[...o].reverse().findIndex((r=>!r.disabled));s=r===-1?null:o.length-1-r}if(s!==null){r.preventDefault();const t=o[s];this.selectTab(t.id)}}getBgClass(){if(!this.background||this.background==="faint")return"";if(this.background==="always-dark")return"on-always-dark";return`on-${this.background}`}render(){const r=this.getBgClass();const o=this.orientation==="vertical";return e(s,{key:"a3840bb8b8490f1b30020b7418947e2b6a3261d2",class:"tab-group-host"},e("div",{key:"ebd4fad99149332ef02171960328190f51b95fb9",role:"tablist",class:{"tab-list":true,"tab-list--vertical":o},"aria-label":this.ariaLabel,"aria-labelledby":this.ariaLabelledby,"aria-orientation":o?"vertical":undefined},this.tabs.map(((t,s)=>{if(n(t)){return e("div",{key:`divider-${s}`,class:{"tab-divider":true,"tab-divider--vertical":o},"aria-hidden":"true"},e("div",{class:"tab-divider__line"}))}const a=t.id===this.value;return e("button",{key:t.id,type:"button",role:"tab","data-tab-id":t.id,class:{tab:true,"tab--selected":a,"ds-focus-ring-inset":true,[r]:!!r},"aria-selected":a,"aria-disabled":t.disabled||undefined,"aria-controls":t.panelId??undefined,disabled:t.disabled,tabIndex:a?0:-1,onClick:()=>!t.disabled&&this.selectTab(t.id)},e("span",{class:{tab__label:true,"tab__label--dot":!!t.dot,[a?"text-body-small-emphasis":"text-body-small"]:true}},t.label,t.dot&&e("ds-badge",{class:"tab__dot",variant:"dot",background:"var(--_dot-ring)",label:"","aria-hidden":"true"})))}))))}get el(){return this}static get watchers(){return{value:[{onValueChange:0}]}}static get style(){return c()}},[2,"ds-tab-group",{value:[1025],tabs:[16],background:[1],ariaLabel:[1,"aria-label"],ariaLabelledby:[1,"aria-labelledby"],orientation:[1]},[[0,"keydown","handleKeyDown"]],{value:[{onValueChange:0}]}]);function u(){if(typeof customElements==="undefined"){return}const r=["ds-tab-group","ds-badge"];r.forEach((r=>{switch(r){case"ds-tab-group":if(!customElements.get(a(r))){customElements.define(a(r),l)}break;case"ds-badge":if(!customElements.get(a(r))){d()}break}}))}u();const b=l;const g=u;export{b as DsTabGroup,g as defineCustomElement};
+import{p as r,H as o,c as t,h as e,a as s,t as a}from"./index.js";import{g as i,i as n}from"./p-BQq26pt9.js";import{d}from"./p-EK1hOP19.js";const c=()=>`.sc-ds-tab-group-h{--ds-focus-ring-width:var(--dimension-stroke-width-025, 2px);--ds-focus-ring-offset:var(--dimension-space-025, 2px);--ds-focus-ring-color:var(--color-interaction-focus)}.ds-focus-ring.sc-ds-tab-group:focus-visible{outline:var(--ds-focus-ring-width) solid var(--ds-focus-ring-color);outline-offset:var(--ds-focus-ring-offset)}.ds-focus-ring.ds-focus-ring--visible.sc-ds-tab-group{outline:var(--ds-focus-ring-width) solid var(--ds-focus-ring-color);outline-offset:var(--ds-focus-ring-offset)}.ds-focus-ring-inset.sc-ds-tab-group:focus-visible{outline:none}.ds-focus-ring-inset.sc-ds-tab-group:focus-visible::after{outline:var(--ds-focus-ring-width) solid var(--ds-focus-ring-color);outline-offset:calc(-1 * var(--ds-focus-ring-width))}.ds-focus-ring-inset.ds-focus-ring--visible.sc-ds-tab-group{outline:none}.ds-focus-ring-inset.ds-focus-ring--visible.sc-ds-tab-group::after{outline:var(--ds-focus-ring-width) solid var(--ds-focus-ring-color);outline-offset:calc(-1 * var(--ds-focus-ring-width))}.sc-ds-tab-group-h{display:block}.tab-list.sc-ds-tab-group{display:flex;align-items:center;gap:var(--dimension-space-050);position:relative;width:max-content;max-width:100%;height:var(--dimension-size-400);padding:calc(var(--dimension-space-050) - var(--dimension-stroke-width-012));background-color:var(--color-background-secondary);border:var(--dimension-stroke-width-012) solid var(--color-border-tertiary);border-radius:var(--dimension-radius-half);box-sizing:border-box}.tab-list--vertical.sc-ds-tab-group{flex-direction:column;align-items:stretch}.tab.sc-ds-tab-group{display:flex;align-items:center;justify-content:center;gap:var(--dimension-space-050);padding:var(--dimension-space-050);background-color:transparent;border:var(--dimension-stroke-width-012) solid transparent;border-radius:var(--dimension-radius-half);cursor:pointer;-webkit-user-select:none;user-select:none;color:var(--color-foreground-secondary);position:relative;transition:color var(--effect-motion-short-2);flex-shrink:0;height:var(--dimension-size-300);min-width:var(--dimension-size-400);box-sizing:border-box;--_hover-bg:var(--color-interaction-hover);--_pressed-bg:var(--color-interaction-pressed);--_dot:var(--color-foreground-bold-brand);--_dot-ring:var(--color-background-secondary)}.tab.sc-ds-tab-group::after{content:'';position:absolute;inset:calc(var(--dimension-stroke-width-012) * -1);border-radius:inherit;background:transparent;pointer-events:none;transition:none}.tab.sc-ds-tab-group:hover::after{background:var(--_hover-bg);transition:none}.tab.sc-ds-tab-group:active::after{background:var(--_pressed-bg);transition:none}.tab--selected.sc-ds-tab-group{color:var(--color-foreground-primary);background-color:var(--color-background-primary);border-color:var(--color-border-tertiary)}.tab.sc-ds-tab-group:disabled,.tab[aria-disabled="true"].sc-ds-tab-group{opacity:0.5;cursor:not-allowed;pointer-events:none}.tab-list--vertical.sc-ds-tab-group .tab.sc-ds-tab-group{justify-content:flex-start}.tab__label.sc-ds-tab-group{position:relative;display:inline-flex;align-items:center;padding:0 var(--dimension-space-025);white-space:nowrap}.tab__label--dot.sc-ds-tab-group{padding-right:calc(var(--dimension-space-025) + var(--dimension-space-050))}.tab__dot.sc-ds-tab-group{position:absolute;top:0;right:0;pointer-events:none}.on-medium.sc-ds-tab-group{--_hover-bg:var(--color-interaction-on-medium-background-hover);--_pressed-bg:var(--color-interaction-on-medium-background-pressed);--_dot-ring:var(--color-background-medium-neutral);--ds-focus-ring-color:var(--color-interaction-on-medium-background-focus)}.on-bold.sc-ds-tab-group{--_hover-bg:var(--color-interaction-on-bold-background-hover);--_pressed-bg:var(--color-interaction-on-bold-background-pressed);--_dot-ring:var(--color-background-bold-neutral);--ds-focus-ring-color:var(--color-interaction-on-bold-background-focus);color:var(--color-foreground-on-bold-background-secondary)}.on-bold.tab--selected.sc-ds-tab-group{color:var(--color-foreground-on-bold-background-primary)}.on-strong.sc-ds-tab-group{--_hover-bg:var(--color-interaction-on-strong-background-hover);--_pressed-bg:var(--color-interaction-on-strong-background-pressed);--_dot-ring:var(--color-background-strong-neutral);--ds-focus-ring-color:var(--color-interaction-on-strong-background-focus);color:var(--color-foreground-on-bold-background-secondary)}.on-strong.tab--selected.sc-ds-tab-group{color:var(--color-foreground-on-bold-background-primary)}.on-always-dark.sc-ds-tab-group{--_hover-bg:var(--color-always-dark-interaction-hover);--_pressed-bg:var(--color-always-dark-interaction-pressed);--_dot-ring:var(--color-always-dark-background);--ds-focus-ring-color:var(--color-always-dark-interaction-focus);color:var(--color-always-dark-foreground-secondary)}.on-always-dark.tab--selected.sc-ds-tab-group{color:var(--color-always-dark-foreground-primary)}.tab-divider.sc-ds-tab-group{display:flex;align-items:center;justify-content:center;box-sizing:border-box;width:var(--dimension-stroke-width-012);align-self:center;padding:0;flex-shrink:0;pointer-events:none}.tab-divider__line.sc-ds-tab-group{width:var(--dimension-stroke-width-012);height:var(--typography-lineheight-sm);flex-shrink:0;background-color:var(--color-border-secondary)}.tab-divider--vertical.sc-ds-tab-group{width:auto;height:var(--dimension-stroke-width-012);align-self:stretch;padding:0}.tab-divider--vertical.sc-ds-tab-group .tab-divider__line.sc-ds-tab-group{width:auto;height:var(--dimension-stroke-width-012);align-self:stretch}`;const l=r(class r extends o{constructor(r){super();if(r!==false){this.__registerHost()}this.dsChange=t(this,"dsChange");this.value="";this.tabs=[];this.orientation="horizontal"}get selectableTabs(){return i(this.tabs)}selectTab(r,o){this.value=r;this.dsChange.emit(r);if(o?.focus!==false){this.focusTab(r)}}focusTab(r){const o=this.el.querySelector(`[data-tab-id="${r}"]`);o?.focus({preventScroll:true})}onValueChange(r,o){if(o===undefined||r===o)return;requestAnimationFrame((()=>{const o=document.activeElement;if(!o||!this.el.contains(o))return;const t=o.getAttribute("data-tab-id");if(t===r)return;const e=this.el.querySelector(`[data-tab-id="${r}"]`);if(e){e.focus({preventScroll:true})}else{o.blur()}}))}findEnabled(r,o){const t=this.selectableTabs;const e=t.length;for(let s=0;s<e;s++){const a=(r+o*(s+1)+e*(s+1))%e;if(!t[a]?.disabled)return a}return r}handleKeyDown(r){const o=this.selectableTabs;if(!o.length)return;const t=o.findIndex((r=>r.id===this.value));const e=this.orientation==="vertical";let s=null;if(!e){if(r.key==="ArrowRight"){s=this.findEnabled(t,1)}else if(r.key==="ArrowLeft"){s=this.findEnabled(t,-1)}}else{if(r.key==="ArrowDown"){s=this.findEnabled(t,1)}else if(r.key==="ArrowUp"){s=this.findEnabled(t,-1)}}if(r.key==="Home"){const r=o.findIndex((r=>!r.disabled));s=r===-1?null:r}else if(r.key==="End"){const r=[...o].reverse().findIndex((r=>!r.disabled));s=r===-1?null:o.length-1-r}if(s!==null){r.preventDefault();const t=o[s];this.selectTab(t.id)}}getBgClass(){if(!this.background||this.background==="faint")return"";if(this.background==="always-dark")return"on-always-dark";return`on-${this.background}`}render(){const r=this.getBgClass();const o=this.orientation==="vertical";return e(s,{key:"1954824b7af780980fe4ef7417842c5460bc8d36",class:"tab-group-host"},e("div",{key:"08084900df9abfd902d347ea7ad70c4b20829b1d",role:"tablist",class:{"tab-list":true,"tab-list--vertical":o},"aria-label":this.ariaLabel,"aria-labelledby":this.ariaLabelledby,"aria-orientation":o?"vertical":undefined},this.tabs.map(((t,s)=>{if(n(t)){return e("div",{key:`divider-${s}`,class:{"tab-divider":true,"tab-divider--vertical":o},"aria-hidden":"true"},e("div",{class:"tab-divider__line"}))}const a=t.id===this.value;return e("button",{key:t.id,type:"button",role:"tab","data-tab-id":t.id,class:{tab:true,"tab--selected":a,"ds-focus-ring-inset":true,[r]:!!r},"aria-selected":a,"aria-disabled":t.disabled||undefined,"aria-controls":t.panelId??undefined,disabled:t.disabled,tabIndex:a?0:-1,onClick:()=>!t.disabled&&this.selectTab(t.id)},e("span",{class:{tab__label:true,"tab__label--dot":!!t.dot,[a?"text-body-small-emphasis":"text-body-small"]:true}},t.label,t.dot&&e("ds-badge",{class:"tab__dot",variant:"dot",background:"var(--_dot-ring)",label:"","aria-hidden":"true"})))}))))}get el(){return this}static get watchers(){return{value:[{onValueChange:0}]}}static get style(){return c()}},[2,"ds-tab-group",{value:[1025],tabs:[16],background:[1],ariaLabel:[1,"aria-label"],ariaLabelledby:[1,"aria-labelledby"],orientation:[1]},[[0,"keydown","handleKeyDown"]],{value:[{onValueChange:0}]}]);function u(){if(typeof customElements==="undefined"){return}const r=["ds-tab-group","ds-badge"];r.forEach((r=>{switch(r){case"ds-tab-group":if(!customElements.get(a(r))){customElements.define(a(r),l)}break;case"ds-badge":if(!customElements.get(a(r))){d()}break}}))}u();const b=l;const g=u;export{b as DsTabGroup,g as defineCustomElement};
 //# sourceMappingURL=ds-tab-group.js.map

package/dist/components/ds-table.js

@@ -1,2 +1,2 @@
-import{p as e,H as t,c as s,h as r,a as o,t as a}from"./index.js";const i=()=>`.sc-ds-table-h{display:block;width:100%}.table-wrapper.sc-ds-table{display:flex;flex-direction:column;width:100%;overflow:hidden;border-radius:var(--dimension-radius-075)}.table-scroll.sc-ds-table{overflow-x:auto;width:100%}.table.sc-ds-table{display:grid;width:100%;min-width:max-content}.header-row.sc-ds-table{display:contents}.header-cell.sc-ds-table{display:flex;align-items:center;gap:var(--dimension-space-050);padding:var(--dimension-space-075) var(--dimension-space-100);background-color:var(--color-background-secondary);border-bottom:var(--dimension-stroke-width-015) solid var(--color-border-primary);-webkit-user-select:none;user-select:none;position:sticky;top:0;z-index:2}.header-cell--sortable.sc-ds-table{cursor:pointer}.header-cell--sortable.sc-ds-table:hover{background-color:var(--color-background-translucent)}.header-cell--sortable.sc-ds-table:focus-visible{outline:var(--dimension-stroke-width-025) solid var(--color-interaction-focus);outline-offset:calc(var(--dimension-space-025) * -1)}.sort-indicator.sc-ds-table{font-size:12px;color:var(--color-foreground-secondary)}.row.sc-ds-table{display:contents}.row--clickable.sc-ds-table{cursor:pointer}.row.sc-ds-table:hover .cell.sc-ds-table{background-color:var(--color-interaction-hover)}.row--selected.sc-ds-table .cell.sc-ds-table{background-color:var(--color-background-faint-brand)}.row--clickable.sc-ds-table:focus-visible .cell.sc-ds-table{background-color:var(--color-interaction-hover);box-shadow:inset 0 0 0 var(--dimension-stroke-width-025) var(--color-interaction-focus)}.cell.sc-ds-table{display:flex;align-items:center;padding:var(--dimension-space-075) var(--dimension-space-100);border-bottom:var(--dimension-stroke-width-015) solid var(--color-border-primary);min-height:var(--dimension-size-500);background-color:var(--color-background-primary);transition:background-color var(--effect-motion-short-2)}.align-right.sc-ds-table{justify-content:flex-end;text-align:right}.align-center.sc-ds-table{justify-content:center;text-align:center}.cell-value.sc-ds-table{display:-webkit-box;-webkit-line-clamp:1;-webkit-box-orient:vertical;overflow:hidden}.empty-row.sc-ds-table{display:flex;align-items:center;justify-content:center;padding:var(--dimension-space-400);background-color:var(--color-background-primary)}.skeleton.sc-ds-table{height:14px;width:60%;background-color:var(--color-background-translucent);border-radius:var(--dimension-radius-050);animation:shimmer 1.5s infinite}@keyframes shimmer{0%{opacity:0.5}50%{opacity:1}100%{opacity:0.5}}.table-pagination.sc-ds-table{display:flex;align-items:center;justify-content:center;gap:var(--dimension-space-100);padding:var(--dimension-space-100);border-top:var(--dimension-stroke-width-015) solid var(--color-border-primary);background-color:var(--color-background-primary)}.page-button.sc-ds-table{display:flex;align-items:center;padding:var(--dimension-space-050) var(--dimension-space-100);background-color:transparent;border:none;border-radius:var(--dimension-radius-075);cursor:pointer;transition:background-color var(--effect-motion-short-2)}.page-button.sc-ds-table:hover:not(:disabled){background-color:var(--color-interaction-hover)}.page-button.sc-ds-table:disabled{opacity:0.4;cursor:not-allowed}.page-button.sc-ds-table:focus-visible{outline:var(--dimension-stroke-width-025) solid var(--color-interaction-focus);outline-offset:var(--dimension-stroke-width-015)}`;function n(e,t){if(e.accessorKey)return t[e.accessorKey];if(e.accessor)return e.accessor(t);return undefined}function c(e,t,s){const r=s==="asc"?1:-1;if(e==null&&t==null)return 0;if(e==null)return r;if(t==null)return-r;if(typeof e==="number"&&typeof t==="number")return(e-t)*r;return String(e).localeCompare(String(t))*r}const l=e(class e extends t{constructor(e){super();if(e!==false){this.__registerHost()}this.dsSort=s(this,"dsSort");this.dsRowClick=s(this,"dsRowClick");this.dsPageChange=s(this,"dsPageChange");this.columns=[];this.data=[];this.loading=false;this.emptyMessage="No results found.";this.selectedRows="";this.pageSize=20}get activeSort(){return this.sortState??this.internalSort}get visibleCols(){return this.columns.filter((e=>!e.hide))}get gridTemplate(){return this.visibleCols.map((e=>{if(e.width)return typeof e.width==="number"?`${e.width}px`:e.width;return"minmax(120px, 1fr)"})).join(" ")}get sortedData(){const e=this.activeSort;if(!e)return this.data;const t=this.columns.find((t=>t.id===e.columnId));if(!t)return this.data;return[...this.data].sort(((s,r)=>c(n(t,s),n(t,r),e.direction)))}get pagedData(){if(this.pageIndex===undefined)return this.sortedData;const e=this.pageIndex*this.pageSize;return this.sortedData.slice(e,e+this.pageSize)}get totalPages(){if(this.pageIndex===undefined)return 1;return Math.ceil(this.sortedData.length/this.pageSize)}get selectedSet(){if(!this.selectedRows)return new Set;return new Set(this.selectedRows.split(",").map(Number).filter((e=>!isNaN(e))))}handleSort(e){this.dsSort.emit({columnId:e});if(!this.sortState){const t=this.internalSort;this.internalSort=t?.columnId===e?{columnId:e,direction:t.direction==="asc"?"desc":"asc"}:{columnId:e,direction:"asc"}}}render(){const{visibleCols:e,pagedData:t,totalPages:s,loading:a}=this;const i=!a&&t.length===0;const c=this.selectedSet;const l=this.activeSort;const d=this.pageIndex!==undefined&&s>1;return r(o,{key:"b24ccb73f651b1caf2afc71dd5f655c8a60a8333"},r("div",{key:"39718b9dc59f83430ff235dfd595520089b746d4",class:"table-wrapper","aria-busy":a||undefined},r("div",{key:"58b574f310f06a54608fec962a20b740550889d9",class:"table-scroll"},r("div",{key:"2a9e2f58d93c0fa3b8da60f89eee753c81ca5e93",class:"table",style:{gridTemplateColumns:this.gridTemplate},role:"table"},r("div",{key:"ce0982d67adbac5ef6e6925b989aa198e1fffd56",class:"header-row",role:"row"},e.map((e=>{const t=l?.columnId===e.id;const s=e.sortable?t?l.direction==="asc"?"ascending":"descending":"none":undefined;return r("div",{key:e.id,class:{"header-cell":true,"header-cell--sortable":!!e.sortable,"align-right":e.align==="right","align-center":e.align==="center"},role:"columnheader","aria-sort":s,tabIndex:e.sortable?0:undefined,onClick:()=>e.sortable&&this.handleSort(e.id),onKeyDown:t=>{if(e.sortable&&(t.key==="Enter"||t.key===" ")){t.preventDefault();this.handleSort(e.id)}},style:e.minWidth?{minWidth:typeof e.minWidth==="number"?`${e.minWidth}px`:e.minWidth}:undefined},r("span",{class:"text-body-small-emphasis",style:{color:"var(--color-foreground-secondary)"}},e.header),t&&r("span",{class:"sort-indicator","aria-hidden":"true"},l.direction==="asc"?"↑":"↓"))}))),a&&Array.from({length:5}).map(((t,s)=>r("div",{key:`sk-${s}`,class:"row",role:s===0?"status":"row","aria-label":s===0?"Loading":undefined},e.map((e=>r("div",{key:e.id,class:"cell",role:"cell"},r("div",{class:"skeleton"}))))))),i&&r("div",{key:"052eb503fb19382b0146efafd1fa96a4c02899bd",class:"empty-row",style:{gridColumn:"1 / -1"}},r("p",{key:"eeb2f020496ff5792d253e6b4edcf645701891cb",class:"text-body-medium",style:{margin:"0",color:"var(--color-foreground-secondary)"}},this.emptyMessage)),!a&&t.map(((t,s)=>{const o=c.has(s);return r("div",{key:s,class:{row:true,"row--selected":o,"row--clickable":true},role:"row",tabIndex:0,"aria-selected":this.selectedRows?o:undefined,onClick:()=>this.dsRowClick.emit({row:t,rowIndex:s}),onKeyDown:e=>{if(e.key==="Enter"||e.key===" "){e.preventDefault();this.dsRowClick.emit({row:t,rowIndex:s})}}},e.map((e=>r("div",{key:e.id,class:{cell:true,"align-right":e.align==="right","align-center":e.align==="center"},role:"cell"},r("span",{class:"text-body-medium cell-value"},String(n(e,t)??""))))))})))),d&&r("div",{key:"4c176cafbeb04c1e226bd2bdfec6999b3fc72e74",class:"table-pagination"},r("button",{key:"246a9a67ddcb1455317178c4cc030baa9bd8f611",type:"button",class:"page-button",disabled:this.pageIndex===0,onClick:()=>{this.pageIndex=this.pageIndex-1;this.dsPageChange.emit({pageIndex:this.pageIndex})}},r("span",{key:"db44b0389f1c3c60c63d18675590e36cf6c701f6",class:"text-body-small"},"Previous")),r("span",{key:"759e11114a0b99e392023babc988b00a8f804675",class:"text-body-small",style:{color:"var(--color-foreground-secondary)"}},"Page ",this.pageIndex+1," of ",s),r("button",{key:"bc6e5f7e4e727c3b04515fb1dd98e14f9ace6cc9",type:"button",class:"page-button",disabled:this.pageIndex>=s-1,onClick:()=>{this.pageIndex=this.pageIndex+1;this.dsPageChange.emit({pageIndex:this.pageIndex})}},r("span",{key:"4447ac7caad111f1e23e621c1892b57c49103e49",class:"text-body-small"},"Next")))))}static get style(){return i()}},[2,"ds-table",{columns:[16],data:[16],sortState:[16],loading:[4],emptyMessage:[1,"empty-message"],selectedRows:[1,"selected-rows"],pageIndex:[1026,"page-index"],pageSize:[2,"page-size"],internalSort:[32]}]);function d(){if(typeof customElements==="undefined"){return}const e=["ds-table"];e.forEach((e=>{switch(e){case"ds-table":if(!customElements.get(a(e))){customElements.define(a(e),l)}break}}))}d();const b=l;const u=d;export{b as DsTable,u as defineCustomElement};
+import{p as e,H as t,c as s,h as r,a,t as o}from"./index.js";const i=()=>`.sc-ds-table-h{display:block;width:100%}.table-wrapper.sc-ds-table{display:flex;flex-direction:column;width:100%;overflow:hidden;border-radius:var(--dimension-radius-075)}.table-scroll.sc-ds-table{overflow-x:auto;width:100%}.table.sc-ds-table{display:grid;width:100%;min-width:max-content}.header-row.sc-ds-table{display:contents}.header-cell.sc-ds-table{display:flex;align-items:center;gap:var(--dimension-space-050);padding:var(--dimension-space-075) var(--dimension-space-100);background-color:var(--color-background-secondary);border-bottom:var(--dimension-stroke-width-015) solid var(--color-border-primary);-webkit-user-select:none;user-select:none;position:sticky;top:0;z-index:2}.header-cell--sortable.sc-ds-table{cursor:pointer}.header-cell--sortable.sc-ds-table:hover{background-color:var(--color-background-translucent)}.header-cell--sortable.sc-ds-table:focus-visible{outline:var(--dimension-stroke-width-025) solid var(--color-interaction-focus);outline-offset:calc(var(--dimension-space-025) * -1)}.sort-indicator.sc-ds-table{font-size:12px;color:var(--color-foreground-secondary)}.row.sc-ds-table{display:contents}.row--clickable.sc-ds-table{cursor:pointer}.row.sc-ds-table:hover .cell.sc-ds-table{background-color:var(--color-interaction-hover)}.row--selected.sc-ds-table .cell.sc-ds-table{background-color:var(--color-background-faint-brand)}.row--clickable.sc-ds-table:focus-visible .cell.sc-ds-table{background-color:var(--color-interaction-hover);box-shadow:inset 0 0 0 var(--dimension-stroke-width-025) var(--color-interaction-focus)}.cell.sc-ds-table{display:flex;align-items:center;padding:var(--dimension-space-075) var(--dimension-space-100);border-bottom:var(--dimension-stroke-width-015) solid var(--color-border-primary);min-height:var(--dimension-size-500);background-color:var(--color-background-primary);transition:background-color var(--effect-motion-short-2)}.align-right.sc-ds-table{justify-content:flex-end;text-align:right}.align-center.sc-ds-table{justify-content:center;text-align:center}.cell-value.sc-ds-table{display:-webkit-box;-webkit-line-clamp:1;-webkit-box-orient:vertical;overflow:hidden}.empty-row.sc-ds-table{display:flex;align-items:center;justify-content:center;padding:var(--dimension-space-400);background-color:var(--color-background-primary)}.skeleton.sc-ds-table{height:14px;width:60%;background-color:var(--color-background-translucent);border-radius:var(--dimension-radius-050);animation:shimmer 1.5s infinite}@keyframes shimmer{0%{opacity:0.5}50%{opacity:1}100%{opacity:0.5}}.table-pagination.sc-ds-table{display:flex;align-items:center;justify-content:center;gap:var(--dimension-space-100);padding:var(--dimension-space-100);border-top:var(--dimension-stroke-width-015) solid var(--color-border-primary);background-color:var(--color-background-primary)}.page-button.sc-ds-table{display:flex;align-items:center;padding:var(--dimension-space-050) var(--dimension-space-100);background-color:transparent;border:none;border-radius:var(--dimension-radius-075);cursor:pointer;transition:background-color var(--effect-motion-short-2)}.page-button.sc-ds-table:hover:not(:disabled){background-color:var(--color-interaction-hover)}.page-button.sc-ds-table:disabled{opacity:0.4;cursor:not-allowed}.page-button.sc-ds-table:focus-visible{outline:var(--dimension-stroke-width-025) solid var(--color-interaction-focus);outline-offset:var(--dimension-stroke-width-015)}`;function n(e,t){if(e.accessorKey)return t[e.accessorKey];if(e.accessor)return e.accessor(t);return undefined}function c(e,t,s){const r=s==="asc"?1:-1;if(e==null&&t==null)return 0;if(e==null)return r;if(t==null)return-r;if(typeof e==="number"&&typeof t==="number")return(e-t)*r;return String(e).localeCompare(String(t))*r}const d=e(class e extends t{constructor(e){super();if(e!==false){this.__registerHost()}this.dsSort=s(this,"dsSort");this.dsRowClick=s(this,"dsRowClick");this.dsPageChange=s(this,"dsPageChange");this.columns=[];this.data=[];this.loading=false;this.emptyMessage="No results found.";this.selectedRows="";this.pageSize=20}get activeSort(){return this.sortState??this.internalSort}get visibleCols(){return this.columns.filter((e=>!e.hide))}get gridTemplate(){return this.visibleCols.map((e=>{if(e.width)return typeof e.width==="number"?`${e.width}px`:e.width;return"minmax(120px, 1fr)"})).join(" ")}get sortedData(){const e=this.activeSort;if(!e)return this.data;const t=this.columns.find((t=>t.id===e.columnId));if(!t)return this.data;return[...this.data].sort(((s,r)=>c(n(t,s),n(t,r),e.direction)))}get pagedData(){if(this.pageIndex===undefined)return this.sortedData;const e=this.pageIndex*this.pageSize;return this.sortedData.slice(e,e+this.pageSize)}get totalPages(){if(this.pageIndex===undefined)return 1;return Math.ceil(this.sortedData.length/this.pageSize)}get selectedSet(){if(!this.selectedRows)return new Set;return new Set(this.selectedRows.split(",").map(Number).filter((e=>!isNaN(e))))}handleSort(e){this.dsSort.emit({columnId:e});if(!this.sortState){const t=this.internalSort;this.internalSort=t?.columnId===e?{columnId:e,direction:t.direction==="asc"?"desc":"asc"}:{columnId:e,direction:"asc"}}}render(){const{visibleCols:e,pagedData:t,totalPages:s,loading:o}=this;const i=!o&&t.length===0;const c=this.selectedSet;const d=this.activeSort;const l=this.pageIndex!==undefined&&s>1;return r(a,{key:"e4aaa884479c0f12edf2814a7040d75156ca4594"},r("div",{key:"0dfc1c82e1cabfabe0930e471f71b596e135edaa",class:"table-wrapper","aria-busy":o||undefined},r("div",{key:"47f51d0ae23f4d6ae4ded105fc128eb580ea8d20",class:"table-scroll"},r("div",{key:"5169a87188000812c799904d9c76f9e88e8b3a8d",class:"table",style:{gridTemplateColumns:this.gridTemplate},role:"table"},r("div",{key:"47d7c342f60c8084725fe21a58a9ed2b7dfa06cd",class:"header-row",role:"row"},e.map((e=>{const t=d?.columnId===e.id;const s=e.sortable?t?d.direction==="asc"?"ascending":"descending":"none":undefined;return r("div",{key:e.id,class:{"header-cell":true,"header-cell--sortable":!!e.sortable,"align-right":e.align==="right","align-center":e.align==="center"},role:"columnheader","aria-sort":s,tabIndex:e.sortable?0:undefined,onClick:()=>e.sortable&&this.handleSort(e.id),onKeyDown:t=>{if(e.sortable&&(t.key==="Enter"||t.key===" ")){t.preventDefault();this.handleSort(e.id)}},style:e.minWidth?{minWidth:typeof e.minWidth==="number"?`${e.minWidth}px`:e.minWidth}:undefined},r("span",{class:"text-body-small-emphasis",style:{color:"var(--color-foreground-secondary)"}},e.header),t&&r("span",{class:"sort-indicator","aria-hidden":"true"},d.direction==="asc"?"↑":"↓"))}))),o&&Array.from({length:5}).map(((t,s)=>r("div",{key:`sk-${s}`,class:"row",role:s===0?"status":"row","aria-label":s===0?"Loading":undefined},e.map((e=>r("div",{key:e.id,class:"cell",role:"cell"},r("div",{class:"skeleton"}))))))),i&&r("div",{key:"ec5295b1ffaeb4d659353fd0ca3b5a2bc8bddcd3",class:"empty-row",style:{gridColumn:"1 / -1"}},r("p",{key:"3931c7c044a9e75629df0bf209781cf4b8a0f9f8",class:"text-body-medium",style:{margin:"0",color:"var(--color-foreground-secondary)"}},this.emptyMessage)),!o&&t.map(((t,s)=>{const a=c.has(s);return r("div",{key:s,class:{row:true,"row--selected":a,"row--clickable":true},role:"row",tabIndex:0,"aria-selected":this.selectedRows?a:undefined,onClick:()=>this.dsRowClick.emit({row:t,rowIndex:s}),onKeyDown:e=>{if(e.key==="Enter"||e.key===" "){e.preventDefault();this.dsRowClick.emit({row:t,rowIndex:s})}}},e.map((e=>r("div",{key:e.id,class:{cell:true,"align-right":e.align==="right","align-center":e.align==="center"},role:"cell"},r("span",{class:"text-body-medium cell-value"},String(n(e,t)??""))))))})))),l&&r("div",{key:"9b79af013d0cc169fccc55fcf77592d04cca02d9",class:"table-pagination"},r("button",{key:"d5421d65be405774bb956776e06981b932ff6563",type:"button",class:"page-button",disabled:this.pageIndex===0,onClick:()=>{this.pageIndex=this.pageIndex-1;this.dsPageChange.emit({pageIndex:this.pageIndex})}},r("span",{key:"9cc2f6865893e3028f99fb1208fa557f856250c0",class:"text-body-small"},"Previous")),r("span",{key:"e5f7226aa47aa20905629b34ee61d45b211c936e",class:"text-body-small",style:{color:"var(--color-foreground-secondary)"}},"Page ",this.pageIndex+1," of ",s),r("button",{key:"73fa0159fc9a94a23c0c8914c5e1d25a0bd94549",type:"button",class:"page-button",disabled:this.pageIndex>=s-1,onClick:()=>{this.pageIndex=this.pageIndex+1;this.dsPageChange.emit({pageIndex:this.pageIndex})}},r("span",{key:"a699efaad9443a56782cf2a1946af567524e058d",class:"text-body-small"},"Next")))))}static get style(){return i()}},[2,"ds-table",{columns:[16],data:[16],sortState:[16],loading:[4],emptyMessage:[1,"empty-message"],selectedRows:[1,"selected-rows"],pageIndex:[1026,"page-index"],pageSize:[2,"page-size"],internalSort:[32]}]);function l(){if(typeof customElements==="undefined"){return}const e=["ds-table"];e.forEach((e=>{switch(e){case"ds-table":if(!customElements.get(o(e))){customElements.define(o(e),d)}break}}))}l();const b=d;const u=l;export{b as DsTable,u as defineCustomElement};
 //# sourceMappingURL=ds-table.js.map

package/dist/components/ds-table.js.map

@@ -1 +1 @@
-{"version":3,"names":["tableCss","getCellValue","col","row","accessorKey","accessor","undefined","compareValues","a","b","dir","m","String","localeCompare","Table","__stencil_proxyCustomElement","HTMLElement","constructor","registerHost","this","columns","data","loading","emptyMessage","selectedRows","pageSize","activeSort","sortState","internalSort","visibleCols","filter","c","hide","gridTemplate","map","width","join","sortedData","sort","find","id","columnId","direction","pagedData","pageIndex","start","slice","totalPages","Math","ceil","length","selectedSet","Set","split","Number","n","isNaN","handleSort","dsSort","emit","cur","render","isEmpty","hasPagination","h","Host","key","class","style","gridTemplateColumns","role","isSorted","ariaSort","sortable","align","tabIndex","onClick","onKeyDown","e","preventDefault","minWidth","color","header","Array","from","_","i","gridColumn","margin","rowIndex","isSelected","has","dsRowClick","cell","type","disabled","dsPageChange"],"sources":["src/wc/components/Table/Table.css?tag=ds-table&encapsulation=scoped","src/wc/components/Table/Table.tsx"],"sourcesContent":[":host {\n  display: block;\n  width: 100%;\n}\n\n.table-wrapper {\n  display: flex;\n  flex-direction: column;\n  width: 100%;\n  overflow: hidden;\n  border-radius: var(--dimension-radius-075);\n}\n\n.table-scroll {\n  overflow-x: auto;\n  width: 100%;\n}\n\n.table {\n  display: grid;\n  width: 100%;\n  min-width: max-content;\n}\n\n/* ─── Header ────────────────────────────────────────────────────────────────── */\n\n.header-row {\n  display: contents;\n}\n\n.header-cell {\n  display: flex;\n  align-items: center;\n  gap: var(--dimension-space-050);\n  padding: var(--dimension-space-075) var(--dimension-space-100);\n  background-color: var(--color-background-secondary);\n  border-bottom: var(--dimension-stroke-width-015) solid var(--color-border-primary);\n  -webkit-user-select: none;\n  user-select: none;\n  position: sticky;\n  top: 0;\n  z-index: 2;\n}\n\n.header-cell--sortable {\n  cursor: pointer;\n}\n\n.header-cell--sortable:hover {\n  background-color: var(--color-background-translucent);\n}\n\n.header-cell--sortable:focus-visible {\n  outline: var(--dimension-stroke-width-025) solid var(--color-interaction-focus);\n  outline-offset: calc(var(--dimension-space-025) * -1);\n}\n\n.sort-indicator {\n  font-size: 12px;\n  color: var(--color-foreground-secondary);\n}\n\n/* ─── Rows ──────────────────────────────────────────────────────────────────── */\n\n.row {\n  display: contents;\n}\n\n.row--clickable {\n  cursor: pointer;\n}\n\n.row:hover .cell {\n  background-color: var(--color-interaction-hover);\n}\n\n.row--selected .cell {\n  background-color: var(--color-background-faint-brand);\n}\n\n.row--clickable:focus-visible .cell {\n  background-color: var(--color-interaction-hover);\n  box-shadow: inset 0 0 0 var(--dimension-stroke-width-025) var(--color-interaction-focus);\n}\n\n/* ─── Cells ─────────────────────────────────────────────────────────────────── */\n\n.cell {\n  display: flex;\n  align-items: center;\n  padding: var(--dimension-space-075) var(--dimension-space-100);\n  border-bottom: var(--dimension-stroke-width-015) solid var(--color-border-primary);\n  min-height: var(--dimension-size-500);\n  background-color: var(--color-background-primary);\n  transition: background-color var(--effect-motion-short-2);\n}\n\n.align-right {\n  justify-content: flex-end;\n  text-align: right;\n}\n\n.align-center {\n  justify-content: center;\n  text-align: center;\n}\n\n.cell-value {\n  display: -webkit-box;\n  -webkit-line-clamp: 1;\n  -webkit-box-orient: vertical;\n  overflow: hidden;\n}\n\n/* ─── Empty state ───────────────────────────────────────────────────────────── */\n\n.empty-row {\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  padding: var(--dimension-space-400);\n  background-color: var(--color-background-primary);\n}\n\n/* ─── Loading skeleton ──────────────────────────────────────────────────────── */\n\n.skeleton {\n  height: 14px;\n  width: 60%;\n  background-color: var(--color-background-translucent);\n  border-radius: var(--dimension-radius-050);\n  animation: shimmer 1.5s infinite;\n}\n\n@keyframes shimmer {\n  0%   { opacity: 0.5; }\n  50%  { opacity: 1; }\n  100% { opacity: 0.5; }\n}\n\n/* ─── Pagination ────────────────────────────────────────────────────────────── */\n\n.table-pagination {\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  gap: var(--dimension-space-100);\n  padding: var(--dimension-space-100);\n  border-top: var(--dimension-stroke-width-015) solid var(--color-border-primary);\n  background-color: var(--color-background-primary);\n}\n\n.page-button {\n  display: flex;\n  align-items: center;\n  padding: var(--dimension-space-050) var(--dimension-space-100);\n  background-color: transparent;\n  border: none;\n  border-radius: var(--dimension-radius-075);\n  cursor: pointer;\n  transition: background-color var(--effect-motion-short-2);\n}\n\n.page-button:hover:not(:disabled) {\n  background-color: var(--color-interaction-hover);\n}\n\n.page-button:disabled {\n  opacity: 0.4;\n  cursor: not-allowed;\n}\n\n.page-button:focus-visible {\n  outline: var(--dimension-stroke-width-025) solid var(--color-interaction-focus);\n  outline-offset: var(--dimension-stroke-width-015);\n}\n","import { Component, Prop, State, Event, EventEmitter, h, Host } from '@stencil/core';\n\nexport type SortDirection = 'asc' | 'desc';\n\nexport interface SortState {\n  columnId: string;\n  direction: SortDirection;\n}\n\nexport interface TableColumn<T = unknown> {\n  id: string;\n  header: string;\n  accessorKey?: string;\n  accessor?: (row: T) => unknown;\n  sortable?: boolean;\n  align?: 'left' | 'right' | 'center';\n  width?: string | number;\n  minWidth?: string | number;\n  hide?: boolean;\n}\n\nfunction getCellValue<T>(col: TableColumn<T>, row: T): unknown {\n  if (col.accessorKey) return (row as Record<string, unknown>)[col.accessorKey];\n  if (col.accessor) return col.accessor(row);\n  return undefined;\n}\n\nfunction compareValues(a: unknown, b: unknown, dir: SortDirection): number {\n  const m = dir === 'asc' ? 1 : -1;\n  if (a == null && b == null) return 0;\n  if (a == null) return m;\n  if (b == null) return -m;\n  if (typeof a === 'number' && typeof b === 'number') return (a - b) * m;\n  return String(a).localeCompare(String(b)) * m;\n}\n\n@Component({\n  tag: 'ds-table',\n  styleUrl: 'Table.css',\n  scoped: true,\n})\nexport class Table {\n  @Prop() columns: TableColumn[] = [];\n  @Prop() data: unknown[] = [];\n  @Prop() sortState: SortState | undefined;\n  @Prop() loading: boolean = false;\n  @Prop() emptyMessage: string = 'No results found.';\n  /** Comma-separated zero-based row indices that are selected. */\n  @Prop() selectedRows: string = '';\n  /** Page index (0-based). Enables built-in pagination when set alongside pageSize. */\n  @Prop({ mutable: true }) pageIndex: number | undefined;\n  @Prop() pageSize: number = 20;\n\n  @State() private internalSort: SortState | undefined;\n\n  @Event() dsSort!: EventEmitter<{ columnId: string }>;\n  @Event() dsRowClick!: EventEmitter<{ row: unknown; rowIndex: number }>;\n  @Event() dsPageChange!: EventEmitter<{ pageIndex: number }>;\n\n  private get activeSort(): SortState | undefined {\n    return this.sortState ?? this.internalSort;\n  }\n\n  private get visibleCols(): TableColumn[] {\n    return this.columns.filter(c => !c.hide);\n  }\n\n  private get gridTemplate(): string {\n    return this.visibleCols.map(col => {\n      if (col.width) return typeof col.width === 'number' ? `${col.width}px` : col.width;\n      return 'minmax(120px, 1fr)';\n    }).join(' ');\n  }\n\n  private get sortedData(): unknown[] {\n    const sort = this.activeSort;\n    if (!sort) return this.data;\n    const col = this.columns.find(c => c.id === sort.columnId);\n    if (!col) return this.data;\n    return [...this.data].sort((a, b) =>\n      compareValues(getCellValue(col, a), getCellValue(col, b), sort.direction)\n    );\n  }\n\n  private get pagedData(): unknown[] {\n    if (this.pageIndex === undefined) return this.sortedData;\n    const start = this.pageIndex * this.pageSize;\n    return this.sortedData.slice(start, start + this.pageSize);\n  }\n\n  private get totalPages(): number {\n    if (this.pageIndex === undefined) return 1;\n    return Math.ceil(this.sortedData.length / this.pageSize);\n  }\n\n  private get selectedSet(): Set<number> {\n    if (!this.selectedRows) return new Set();\n    return new Set(this.selectedRows.split(',').map(Number).filter(n => !isNaN(n)));\n  }\n\n  private handleSort(columnId: string) {\n    this.dsSort.emit({ columnId });\n    // Toggle internal sort if consumer hasn't provided sortState\n    if (!this.sortState) {\n      const cur = this.internalSort;\n      this.internalSort = cur?.columnId === columnId\n        ? { columnId, direction: cur.direction === 'asc' ? 'desc' : 'asc' }\n        : { columnId, direction: 'asc' };\n    }\n  }\n\n  render() {\n    const { visibleCols, pagedData, totalPages, loading } = this;\n    const isEmpty = !loading && pagedData.length === 0;\n    const selectedSet = this.selectedSet;\n    const sort = this.activeSort;\n    const hasPagination = this.pageIndex !== undefined && totalPages > 1;\n\n    return (\n      <Host>\n        <div class=\"table-wrapper\" aria-busy={loading || undefined}>\n          <div class=\"table-scroll\">\n            <div class=\"table\" style={{ gridTemplateColumns: this.gridTemplate }} role=\"table\">\n\n              {/* Header row */}\n              <div class=\"header-row\" role=\"row\">\n                {visibleCols.map(col => {\n                  const isSorted = sort?.columnId === col.id;\n                  const ariaSort = col.sortable\n                    ? (isSorted ? (sort.direction === 'asc' ? 'ascending' : 'descending') : 'none')\n                    : undefined;\n                  return (\n                    <div\n                      key={col.id}\n                      class={{\n                        'header-cell': true,\n                        'header-cell--sortable': !!col.sortable,\n                        'align-right': col.align === 'right',\n                        'align-center': col.align === 'center',\n                      }}\n                      role=\"columnheader\"\n                      aria-sort={ariaSort}\n                      tabIndex={col.sortable ? 0 : undefined}\n                      onClick={() => col.sortable && this.handleSort(col.id)}\n                      onKeyDown={(e: KeyboardEvent) => {\n                        if (col.sortable && (e.key === 'Enter' || e.key === ' ')) {\n                          e.preventDefault();\n                          this.handleSort(col.id);\n                        }\n                      }}\n                      style={col.minWidth ? { minWidth: typeof col.minWidth === 'number' ? `${col.minWidth}px` : col.minWidth as string } : undefined}\n                    >\n                      <span class=\"text-body-small-emphasis\" style={{ color: 'var(--color-foreground-secondary)' }}>\n                        {col.header}\n                      </span>\n                      {isSorted && (\n                        <span class=\"sort-indicator\" aria-hidden=\"true\">\n                          {sort.direction === 'asc' ? '↑' : '↓'}\n                        </span>\n                      )}\n                    </div>\n                  );\n                })}\n              </div>\n\n              {/* Loading skeleton */}\n              {loading && Array.from({ length: 5 }).map((_, i) => (\n                <div\n                  key={`sk-${i}`}\n                  class=\"row\"\n                  role={i === 0 ? 'status' : 'row'}\n                  aria-label={i === 0 ? 'Loading' : undefined}\n                >\n                  {visibleCols.map(col => (\n                    <div key={col.id} class=\"cell\" role=\"cell\">\n                      <div class=\"skeleton\" />\n                    </div>\n                  ))}\n                </div>\n              ))}\n\n              {/* Empty state */}\n              {isEmpty && (\n                <div class=\"empty-row\" style={{ gridColumn: '1 / -1' }}>\n                  <p class=\"text-body-medium\" style={{ margin: '0', color: 'var(--color-foreground-secondary)' }}>\n                    {this.emptyMessage}\n                  </p>\n                </div>\n              )}\n\n              {/* Data rows */}\n              {!loading && pagedData.map((row, rowIndex) => {\n                const isSelected = selectedSet.has(rowIndex);\n                return (\n                  <div\n                    key={rowIndex}\n                    class={{\n                      'row': true,\n                      'row--selected': isSelected,\n                      'row--clickable': true,\n                    }}\n                    role=\"row\"\n                    tabIndex={0}\n                    aria-selected={this.selectedRows ? isSelected : undefined}\n                    onClick={() => this.dsRowClick.emit({ row, rowIndex })}\n                    onKeyDown={(e: KeyboardEvent) => {\n                      if (e.key === 'Enter' || e.key === ' ') {\n                        e.preventDefault();\n                        this.dsRowClick.emit({ row, rowIndex });\n                      }\n                    }}\n                  >\n                    {visibleCols.map(col => (\n                      <div\n                        key={col.id}\n                        class={{\n                          'cell': true,\n                          'align-right': col.align === 'right',\n                          'align-center': col.align === 'center',\n                        }}\n                        role=\"cell\"\n                      >\n                        <span class=\"text-body-medium cell-value\">\n                          {String(getCellValue(col, row) ?? '')}\n                        </span>\n                      </div>\n                    ))}\n                  </div>\n                );\n              })}\n            </div>\n          </div>\n\n          {/* Built-in pagination */}\n          {hasPagination && (\n            <div class=\"table-pagination\">\n              <button\n                type=\"button\"\n                class=\"page-button\"\n                disabled={this.pageIndex === 0}\n                onClick={() => {\n                  this.pageIndex = this.pageIndex! - 1;\n                  this.dsPageChange.emit({ pageIndex: this.pageIndex });\n                }}\n              >\n                <span class=\"text-body-small\">Previous</span>\n              </button>\n              <span class=\"text-body-small\" style={{ color: 'var(--color-foreground-secondary)' }}>\n                Page {this.pageIndex! + 1} of {totalPages}\n              </span>\n              <button\n                type=\"button\"\n                class=\"page-button\"\n                disabled={this.pageIndex! >= totalPages - 1}\n                onClick={() => {\n                  this.pageIndex = this.pageIndex! + 1;\n                  this.dsPageChange.emit({ pageIndex: this.pageIndex });\n                }}\n              >\n                <span class=\"text-body-small\">Next</span>\n              </button>\n            </div>\n          )}\n        </div>\n      </Host>\n    );\n  }\n}\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"names":["tableCss","getCellValue","col","row","accessorKey","accessor","undefined","compareValues","a","b","dir","m","String","localeCompare","Table","__stencil_proxyCustomElement","HTMLElement","constructor","registerHost","this","columns","data","loading","emptyMessage","selectedRows","pageSize","activeSort","sortState","internalSort","visibleCols","filter","c","hide","gridTemplate","map","width","join","sortedData","sort","find","id","columnId","direction","pagedData","pageIndex","start","slice","totalPages","Math","ceil","length","selectedSet","Set","split","Number","n","isNaN","handleSort","dsSort","emit","cur","render","isEmpty","hasPagination","h","Host","key","class","style","gridTemplateColumns","role","isSorted","ariaSort","sortable","align","tabIndex","onClick","onKeyDown","e","preventDefault","minWidth","color","header","Array","from","_","i","gridColumn","margin","rowIndex","isSelected","has","dsRowClick","cell","type","disabled","dsPageChange"],"sources":["src/wc/components/Table/Table.css?tag=ds-table&encapsulation=scoped","src/wc/components/Table/Table.tsx"],"sourcesContent":[":host {\n  display: block;\n  width: 100%;\n}\n\n.table-wrapper {\n  display: flex;\n  flex-direction: column;\n  width: 100%;\n  overflow: hidden;\n  border-radius: var(--dimension-radius-075);\n}\n\n.table-scroll {\n  overflow-x: auto;\n  width: 100%;\n}\n\n.table {\n  display: grid;\n  width: 100%;\n  min-width: max-content;\n}\n\n/* ─── Header ────────────────────────────────────────────────────────────────── */\n\n.header-row {\n  display: contents;\n}\n\n.header-cell {\n  display: flex;\n  align-items: center;\n  gap: var(--dimension-space-050);\n  padding: var(--dimension-space-075) var(--dimension-space-100);\n  background-color: var(--color-background-secondary);\n  border-bottom: var(--dimension-stroke-width-015) solid var(--color-border-primary);\n  -webkit-user-select: none;\n  user-select: none;\n  position: sticky;\n  top: 0;\n  z-index: 2;\n}\n\n.header-cell--sortable {\n  cursor: pointer;\n}\n\n.header-cell--sortable:hover {\n  background-color: var(--color-background-translucent);\n}\n\n.header-cell--sortable:focus-visible {\n  outline: var(--dimension-stroke-width-025) solid var(--color-interaction-focus);\n  outline-offset: calc(var(--dimension-space-025) * -1);\n}\n\n.sort-indicator {\n  font-size: 12px;\n  color: var(--color-foreground-secondary);\n}\n\n/* ─── Rows ──────────────────────────────────────────────────────────────────── */\n\n.row {\n  display: contents;\n}\n\n.row--clickable {\n  cursor: pointer;\n}\n\n.row:hover .cell {\n  background-color: var(--color-interaction-hover);\n}\n\n.row--selected .cell {\n  background-color: var(--color-background-faint-brand);\n}\n\n.row--clickable:focus-visible .cell {\n  background-color: var(--color-interaction-hover);\n  box-shadow: inset 0 0 0 var(--dimension-stroke-width-025) var(--color-interaction-focus);\n}\n\n/* ─── Cells ─────────────────────────────────────────────────────────────────── */\n\n.cell {\n  display: flex;\n  align-items: center;\n  padding: var(--dimension-space-075) var(--dimension-space-100);\n  border-bottom: var(--dimension-stroke-width-015) solid var(--color-border-primary);\n  min-height: var(--dimension-size-500);\n  background-color: var(--color-background-primary);\n  transition: background-color var(--effect-motion-short-2);\n}\n\n.align-right {\n  justify-content: flex-end;\n  text-align: right;\n}\n\n.align-center {\n  justify-content: center;\n  text-align: center;\n}\n\n.cell-value {\n  display: -webkit-box;\n  -webkit-line-clamp: 1;\n  -webkit-box-orient: vertical;\n  overflow: hidden;\n}\n\n/* ─── Empty state ───────────────────────────────────────────────────────────── */\n\n.empty-row {\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  padding: var(--dimension-space-400);\n  background-color: var(--color-background-primary);\n}\n\n/* ─── Loading skeleton ──────────────────────────────────────────────────────── */\n\n.skeleton {\n  height: 14px;\n  width: 60%;\n  background-color: var(--color-background-translucent);\n  border-radius: var(--dimension-radius-050);\n  animation: shimmer 1.5s infinite;\n}\n\n@keyframes shimmer {\n  0%   { opacity: 0.5; }\n  50%  { opacity: 1; }\n  100% { opacity: 0.5; }\n}\n\n/* ─── Pagination ────────────────────────────────────────────────────────────── */\n\n.table-pagination {\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  gap: var(--dimension-space-100);\n  padding: var(--dimension-space-100);\n  border-top: var(--dimension-stroke-width-015) solid var(--color-border-primary);\n  background-color: var(--color-background-primary);\n}\n\n.page-button {\n  display: flex;\n  align-items: center;\n  padding: var(--dimension-space-050) var(--dimension-space-100);\n  background-color: transparent;\n  border: none;\n  border-radius: var(--dimension-radius-075);\n  cursor: pointer;\n  transition: background-color var(--effect-motion-short-2);\n}\n\n.page-button:hover:not(:disabled) {\n  background-color: var(--color-interaction-hover);\n}\n\n.page-button:disabled {\n  opacity: 0.4;\n  cursor: not-allowed;\n}\n\n.page-button:focus-visible {\n  outline: var(--dimension-stroke-width-025) solid var(--color-interaction-focus);\n  outline-offset: var(--dimension-stroke-width-015);\n}\n","import { Component, Prop, State, Event, EventEmitter, h, Host } from '@stencil/core';\n\nexport type SortDirection = 'asc' | 'desc';\n\nexport interface SortState {\n  columnId: string;\n  direction: SortDirection;\n}\n\nexport interface TableColumn<T = unknown> {\n  id: string;\n  header: string;\n  accessorKey?: string;\n  accessor?: (row: T) => unknown;\n  sortable?: boolean;\n  align?: 'left' | 'right' | 'center';\n  width?: string | number;\n  minWidth?: string | number;\n  hide?: boolean;\n}\n\nfunction getCellValue<T>(col: TableColumn<T>, row: T): unknown {\n  if (col.accessorKey) return (row as Record<string, unknown>)[col.accessorKey];\n  if (col.accessor) return col.accessor(row);\n  return undefined;\n}\n\nfunction compareValues(a: unknown, b: unknown, dir: SortDirection): number {\n  const m = dir === 'asc' ? 1 : -1;\n  if (a == null && b == null) return 0;\n  if (a == null) return m;\n  if (b == null) return -m;\n  if (typeof a === 'number' && typeof b === 'number') return (a - b) * m;\n  return String(a).localeCompare(String(b)) * m;\n}\n\n@Component({\n  tag: 'ds-table',\n  styleUrl: 'Table.css',\n  scoped: true,\n})\nexport class Table {\n  @Prop() columns: TableColumn[] = [];\n  @Prop() data: unknown[] = [];\n  @Prop() sortState: SortState | undefined;\n  @Prop() loading: boolean = false;\n  @Prop() emptyMessage: string = 'No results found.';\n  /** Comma-separated zero-based row indices that are selected. */\n  @Prop() selectedRows: string = '';\n  /** Page index (0-based). Enables built-in pagination when set alongside pageSize. */\n  @Prop({ mutable: true }) pageIndex: number | undefined;\n  @Prop() pageSize: number = 20;\n\n  @State() private internalSort: SortState | undefined;\n\n  @Event() dsSort!: EventEmitter<{ columnId: string }>;\n  @Event() dsRowClick!: EventEmitter<{ row: unknown; rowIndex: number }>;\n  @Event() dsPageChange!: EventEmitter<{ pageIndex: number }>;\n\n  private get activeSort(): SortState | undefined {\n    return this.sortState ?? this.internalSort;\n  }\n\n  private get visibleCols(): TableColumn[] {\n    return this.columns.filter(c => !c.hide);\n  }\n\n  private get gridTemplate(): string {\n    return this.visibleCols.map(col => {\n      if (col.width) return typeof col.width === 'number' ? `${col.width}px` : col.width;\n      return 'minmax(120px, 1fr)';\n    }).join(' ');\n  }\n\n  private get sortedData(): unknown[] {\n    const sort = this.activeSort;\n    if (!sort) return this.data;\n    const col = this.columns.find(c => c.id === sort.columnId);\n    if (!col) return this.data;\n    return [...this.data].sort((a, b) =>\n      compareValues(getCellValue(col, a), getCellValue(col, b), sort.direction)\n    );\n  }\n\n  private get pagedData(): unknown[] {\n    if (this.pageIndex === undefined) return this.sortedData;\n    const start = this.pageIndex * this.pageSize;\n    return this.sortedData.slice(start, start + this.pageSize);\n  }\n\n  private get totalPages(): number {\n    if (this.pageIndex === undefined) return 1;\n    return Math.ceil(this.sortedData.length / this.pageSize);\n  }\n\n  private get selectedSet(): Set<number> {\n    if (!this.selectedRows) return new Set();\n    return new Set(this.selectedRows.split(',').map(Number).filter(n => !isNaN(n)));\n  }\n\n  private handleSort(columnId: string) {\n    this.dsSort.emit({ columnId });\n    // Toggle internal sort if consumer hasn't provided sortState\n    if (!this.sortState) {\n      const cur = this.internalSort;\n      this.internalSort = cur?.columnId === columnId\n        ? { columnId, direction: cur.direction === 'asc' ? 'desc' : 'asc' }\n        : { columnId, direction: 'asc' };\n    }\n  }\n\n  render() {\n    const { visibleCols, pagedData, totalPages, loading } = this;\n    const isEmpty = !loading && pagedData.length === 0;\n    const selectedSet = this.selectedSet;\n    const sort = this.activeSort;\n    const hasPagination = this.pageIndex !== undefined && totalPages > 1;\n\n    return (\n      <Host>\n        <div class=\"table-wrapper\" aria-busy={loading || undefined}>\n          <div class=\"table-scroll\">\n            <div class=\"table\" style={{ gridTemplateColumns: this.gridTemplate }} role=\"table\">\n\n              {/* Header row */}\n              <div class=\"header-row\" role=\"row\">\n                {visibleCols.map(col => {\n                  const isSorted = sort?.columnId === col.id;\n                  const ariaSort = col.sortable\n                    ? (isSorted ? (sort.direction === 'asc' ? 'ascending' : 'descending') : 'none')\n                    : undefined;\n                  return (\n                    <div\n                      key={col.id}\n                      class={{\n                        'header-cell': true,\n                        'header-cell--sortable': !!col.sortable,\n                        'align-right': col.align === 'right',\n                        'align-center': col.align === 'center',\n                      }}\n                      role=\"columnheader\"\n                      aria-sort={ariaSort}\n                      tabIndex={col.sortable ? 0 : undefined}\n                      onClick={() => col.sortable && this.handleSort(col.id)}\n                      onKeyDown={(e: KeyboardEvent) => {\n                        if (col.sortable && (e.key === 'Enter' || e.key === ' ')) {\n                          e.preventDefault();\n                          this.handleSort(col.id);\n                        }\n                      }}\n                      style={col.minWidth ? { minWidth: typeof col.minWidth === 'number' ? `${col.minWidth}px` : col.minWidth as string } : undefined}\n                    >\n                      <span class=\"text-body-small-emphasis\" style={{ color: 'var(--color-foreground-secondary)' }}>\n                        {col.header}\n                      </span>\n                      {isSorted && (\n                        <span class=\"sort-indicator\" aria-hidden=\"true\">\n                          {sort.direction === 'asc' ? '↑' : '↓'}\n                        </span>\n                      )}\n                    </div>\n                  );\n                })}\n              </div>\n\n              {/* Loading skeleton */}\n              {loading && Array.from({ length: 5 }).map((_, i) => (\n                <div\n                  key={`sk-${i}`}\n                  class=\"row\"\n                  role={i === 0 ? 'status' : 'row'}\n                  aria-label={i === 0 ? 'Loading' : undefined}\n                >\n                  {visibleCols.map(col => (\n                    <div key={col.id} class=\"cell\" role=\"cell\">\n                      <div class=\"skeleton\" />\n                    </div>\n                  ))}\n                </div>\n              ))}\n\n              {/* Empty state */}\n              {isEmpty && (\n                <div class=\"empty-row\" style={{ gridColumn: '1 / -1' }}>\n                  <p class=\"text-body-medium\" style={{ margin: '0', color: 'var(--color-foreground-secondary)' }}>\n                    {this.emptyMessage}\n                  </p>\n                </div>\n              )}\n\n              {/* Data rows */}\n              {!loading && pagedData.map((row, rowIndex) => {\n                const isSelected = selectedSet.has(rowIndex);\n                return (\n                  <div\n                    key={rowIndex}\n                    class={{\n                      'row': true,\n                      'row--selected': isSelected,\n                      'row--clickable': true,\n                    }}\n                    role=\"row\"\n                    tabIndex={0}\n                    aria-selected={this.selectedRows ? isSelected : undefined}\n                    onClick={() => this.dsRowClick.emit({ row, rowIndex })}\n                    onKeyDown={(e: KeyboardEvent) => {\n                      if (e.key === 'Enter' || e.key === ' ') {\n                        e.preventDefault();\n                        this.dsRowClick.emit({ row, rowIndex });\n                      }\n                    }}\n                  >\n                    {visibleCols.map(col => (\n                      <div\n                        key={col.id}\n                        class={{\n                          'cell': true,\n                          'align-right': col.align === 'right',\n                          'align-center': col.align === 'center',\n                        }}\n                        role=\"cell\"\n                      >\n                        <span class=\"text-body-medium cell-value\">\n                          {String(getCellValue(col, row) ?? '')}\n                        </span>\n                      </div>\n                    ))}\n                  </div>\n                );\n              })}\n            </div>\n          </div>\n\n          {/* Built-in pagination */}\n          {hasPagination && (\n            <div class=\"table-pagination\">\n              <button\n                type=\"button\"\n                class=\"page-button\"\n                disabled={this.pageIndex === 0}\n                onClick={() => {\n                  this.pageIndex = this.pageIndex! - 1;\n                  this.dsPageChange.emit({ pageIndex: this.pageIndex });\n                }}\n              >\n                <span class=\"text-body-small\">Previous</span>\n              </button>\n              <span class=\"text-body-small\" style={{ color: 'var(--color-foreground-secondary)' }}>\n                Page {this.pageIndex! + 1} of {totalPages}\n              </span>\n              <button\n                type=\"button\"\n                class=\"page-button\"\n                disabled={this.pageIndex! >= totalPages - 1}\n                onClick={() => {\n                  this.pageIndex = this.pageIndex! + 1;\n                  this.dsPageChange.emit({ pageIndex: this.pageIndex });\n                }}\n              >\n                <span class=\"text-body-small\">Next</span>\n              </button>\n            </div>\n          )}\n        </div>\n      </Host>\n    );\n  }\n}\n"],"mappings":"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","ignoreList":[]}

package/dist/components/ds-tag.js

@@ -1,2 +1,2 @@
-import{p as o,H as t,h as a,a as r,t as n}from"./index.js";const e=()=>`.sc-ds-tag-h{display:inline-flex;align-items:center;justify-content:center;border-radius:var(--dimension-radius-050);box-sizing:border-box;color:var(--color-foreground-primary);position:relative;--_hover-bg:var(--color-interaction-hover);--_pressed-bg:var(--color-interaction-pressed)}.tag--size-md.sc-ds-tag-h{height:var(--dimension-size-400);padding:0 var(--dimension-space-075);gap:0}.tag--size-sm.sc-ds-tag-h{height:var(--dimension-size-300);padding:0 var(--dimension-space-050);gap:0}.tag--size-xs.sc-ds-tag-h{height:var(--dimension-size-200);padding:0 var(--dimension-space-025);gap:0}.tag--rounded.sc-ds-tag-h{border-radius:var(--dimension-radius-half)}.tag--on-medium.sc-ds-tag-h{--_hover-bg:var(--color-interaction-on-medium-background-hover);--_pressed-bg:var(--color-interaction-on-medium-background-pressed)}.tag--on-bold.sc-ds-tag-h{--_hover-bg:var(--color-interaction-on-bold-background-hover);--_pressed-bg:var(--color-interaction-on-bold-background-pressed)}.tag--on-strong.sc-ds-tag-h{--_hover-bg:var(--color-interaction-on-strong-background-hover);--_pressed-bg:var(--color-interaction-on-strong-background-pressed)}.tag--on-always-dark.sc-ds-tag-h{--_hover-bg:var(--color-always-dark-interaction-hover);--_pressed-bg:var(--color-always-dark-interaction-pressed)}.tag--elevation-flat.sc-ds-tag-h{background-color:transparent !important;box-shadow:inset 0 0 0 var(--dimension-stroke-width-015) currentColor}.tag--elevation-elevated.sc-ds-tag-h{box-shadow:var(--effect-elevation-elevated-sm)}.tag--elevation-flat.tag--intent-neutral.tag--contrast-bold.sc-ds-tag-h{color:var(--color-foreground-bold-neutral)}.tag--elevation-flat.tag--intent-brand.tag--contrast-bold.sc-ds-tag-h{color:var(--color-foreground-bold-brand)}.tag--elevation-flat.tag--intent-ai.tag--contrast-bold.sc-ds-tag-h{color:var(--color-foreground-bold-ai)}.tag--elevation-flat.tag--intent-negative.tag--contrast-bold.sc-ds-tag-h{color:var(--color-foreground-bold-negative)}.tag--elevation-flat.tag--intent-warning.tag--contrast-bold.sc-ds-tag-h{color:var(--color-foreground-bold-warning)}.tag--elevation-flat.tag--intent-caution.tag--contrast-bold.sc-ds-tag-h{color:var(--color-foreground-bold-caution)}.tag--elevation-flat.tag--intent-positive.tag--contrast-bold.sc-ds-tag-h{color:var(--color-foreground-bold-positive)}.tag--elevation-flat.tag--intent-neutral.tag--contrast-strong.sc-ds-tag-h{color:var(--color-foreground-strong-neutral)}.tag--elevation-flat.tag--intent-brand.tag--contrast-strong.sc-ds-tag-h{color:var(--color-foreground-strong-brand)}.tag--elevation-flat.tag--intent-ai.tag--contrast-strong.sc-ds-tag-h{color:var(--color-foreground-strong-ai)}.tag--elevation-flat.tag--intent-negative.tag--contrast-strong.sc-ds-tag-h{color:var(--color-foreground-strong-negative)}.tag--elevation-flat.tag--intent-warning.tag--contrast-strong.sc-ds-tag-h{color:var(--color-foreground-strong-warning)}.tag--elevation-flat.tag--intent-caution.tag--contrast-strong.sc-ds-tag-h{color:var(--color-foreground-strong-caution)}.tag--elevation-flat.tag--intent-positive.tag--contrast-strong.sc-ds-tag-h{color:var(--color-foreground-strong-positive)}.tag--elevation-flat.tag--intent-neutral.tag--contrast-medium.sc-ds-tag-h{color:var(--color-foreground-medium-neutral)}.tag--elevation-flat.tag--intent-brand.tag--contrast-medium.sc-ds-tag-h{color:var(--color-foreground-medium-brand)}.tag--elevation-flat.tag--intent-ai.tag--contrast-medium.sc-ds-tag-h{color:var(--color-foreground-medium-ai)}.tag--elevation-flat.tag--intent-negative.tag--contrast-medium.sc-ds-tag-h{color:var(--color-foreground-medium-negative)}.tag--elevation-flat.tag--intent-warning.tag--contrast-medium.sc-ds-tag-h{color:var(--color-foreground-medium-warning)}.tag--elevation-flat.tag--intent-caution.tag--contrast-medium.sc-ds-tag-h{color:var(--color-foreground-medium-caution)}.tag--elevation-flat.tag--intent-positive.tag--contrast-medium.sc-ds-tag-h{color:var(--color-foreground-medium-positive)}.tag--elevation-flat.tag--intent-neutral.tag--contrast-faint.sc-ds-tag-h{color:var(--color-foreground-faint-neutral)}.tag--elevation-flat.tag--intent-brand.tag--contrast-faint.sc-ds-tag-h{color:var(--color-foreground-faint-brand)}.tag--elevation-flat.tag--intent-ai.tag--contrast-faint.sc-ds-tag-h{color:var(--color-foreground-faint-ai)}.tag--elevation-flat.tag--intent-negative.tag--contrast-faint.sc-ds-tag-h{color:var(--color-foreground-faint-negative)}.tag--elevation-flat.tag--intent-warning.tag--contrast-faint.sc-ds-tag-h{color:var(--color-foreground-faint-warning)}.tag--elevation-flat.tag--intent-caution.tag--contrast-faint.sc-ds-tag-h{color:var(--color-foreground-faint-caution)}.tag--elevation-flat.tag--intent-positive.tag--contrast-faint.sc-ds-tag-h{color:var(--color-foreground-faint-positive)}.tag--intent-neutral.tag--contrast-strong.sc-ds-tag-h{background-color:var(--color-background-strong-neutral);color:var(--color-foreground-medium-neutral)}.tag--intent-brand.tag--contrast-strong.sc-ds-tag-h{background-color:var(--color-background-strong-brand);color:var(--color-foreground-medium-brand)}.tag--intent-ai.tag--contrast-strong.sc-ds-tag-h{background-color:var(--color-background-strong-ai);color:var(--color-foreground-medium-ai)}.tag--intent-negative.tag--contrast-strong.sc-ds-tag-h{background-color:var(--color-background-strong-negative);color:var(--color-foreground-medium-negative)}.tag--intent-warning.tag--contrast-strong.sc-ds-tag-h{background-color:var(--color-background-strong-warning);color:var(--color-foreground-medium-warning)}.tag--intent-caution.tag--contrast-strong.sc-ds-tag-h{background-color:var(--color-background-strong-caution);color:var(--color-foreground-medium-caution)}.tag--intent-positive.tag--contrast-strong.sc-ds-tag-h{background-color:var(--color-background-strong-positive);color:var(--color-foreground-medium-positive)}.tag--intent-neutral.tag--contrast-bold.sc-ds-tag-h{background-color:var(--color-background-bold-neutral);color:var(--color-foreground-on-bold-background-primary)}.tag--intent-brand.tag--contrast-bold.sc-ds-tag-h{background-color:var(--color-background-bold-brand);color:var(--color-foreground-on-bold-background-primary)}.tag--intent-ai.tag--contrast-bold.sc-ds-tag-h{background-color:var(--color-background-bold-ai);color:var(--color-foreground-on-bold-background-primary)}.tag--intent-negative.tag--contrast-bold.sc-ds-tag-h{background-color:var(--color-background-bold-negative);color:var(--color-foreground-on-bold-background-primary)}.tag--intent-warning.tag--contrast-bold.sc-ds-tag-h{background-color:var(--color-background-bold-warning);color:var(--color-foreground-on-bold-background-primary)}.tag--intent-caution.tag--contrast-bold.sc-ds-tag-h{background-color:var(--color-background-bold-caution);color:var(--color-foreground-on-bold-background-primary)}.tag--intent-positive.tag--contrast-bold.sc-ds-tag-h{background-color:var(--color-background-bold-positive);color:var(--color-foreground-on-bold-background-primary)}.tag--intent-neutral.tag--contrast-medium.sc-ds-tag-h{background-color:var(--color-background-medium-neutral);color:var(--color-foreground-strong-neutral)}.tag--intent-brand.tag--contrast-medium.sc-ds-tag-h{background-color:var(--color-background-medium-brand);color:var(--color-foreground-strong-brand)}.tag--intent-ai.tag--contrast-medium.sc-ds-tag-h{background-color:var(--color-background-medium-ai);color:var(--color-foreground-strong-ai)}.tag--intent-negative.tag--contrast-medium.sc-ds-tag-h{background-color:var(--color-background-medium-negative);color:var(--color-foreground-strong-negative)}.tag--intent-warning.tag--contrast-medium.sc-ds-tag-h{background-color:var(--color-background-medium-warning);color:var(--color-foreground-strong-warning)}.tag--intent-caution.tag--contrast-medium.sc-ds-tag-h{background-color:var(--color-background-medium-caution);color:var(--color-foreground-strong-caution)}.tag--intent-positive.tag--contrast-medium.sc-ds-tag-h{background-color:var(--color-background-medium-positive);color:var(--color-foreground-strong-positive)}.tag--intent-neutral.tag--contrast-faint.sc-ds-tag-h{background-color:var(--color-background-faint-neutral);color:var(--color-foreground-bold-neutral)}.tag--intent-brand.tag--contrast-faint.sc-ds-tag-h{background-color:var(--color-background-faint-brand);color:var(--color-foreground-bold-brand)}.tag--intent-ai.tag--contrast-faint.sc-ds-tag-h{background-color:var(--color-background-faint-ai);color:var(--color-foreground-bold-ai)}.tag--intent-negative.tag--contrast-faint.sc-ds-tag-h{background-color:var(--color-background-faint-negative);color:var(--color-foreground-bold-negative)}.tag--intent-warning.tag--contrast-faint.sc-ds-tag-h{background-color:var(--color-background-faint-warning);color:var(--color-foreground-bold-warning)}.tag--intent-caution.tag--contrast-faint.sc-ds-tag-h{background-color:var(--color-background-faint-caution);color:var(--color-foreground-bold-caution)}.tag--intent-positive.tag--contrast-faint.sc-ds-tag-h{background-color:var(--color-background-faint-positive);color:var(--color-foreground-bold-positive)}.tag--interactive.sc-ds-tag-h{cursor:pointer;user-select:none;outline:none}.tag--interactive.sc-ds-tag-h:hover{background-color:var(--_hover-bg)}.tag--interactive.sc-ds-tag-h:active{background-color:var(--_pressed-bg)}.tag--interactive.sc-ds-tag-h:focus-visible{outline:var(--dimension-stroke-width-025) solid var(--color-interaction-focus);outline-offset:var(--dimension-space-025)}.tag--pressed.sc-ds-tag-h{background-color:var(--color-background-faint-brand) !important;color:var(--color-foreground-bold-brand) !important}.tag__label.sc-ds-tag{line-height:0;padding:0 var(--dimension-space-025);white-space:nowrap;flex-shrink:0}.tag__icon-slot.sc-ds-tag{display:contents}.tag--removable.sc-ds-tag-h .tag__label.sc-ds-tag{padding-inline-end:0}.tag__remove.sc-ds-tag{padding:0;margin:0;border:none;background:none;display:flex;align-items:center;justify-content:center;cursor:pointer;color:inherit;flex-shrink:0;position:relative;border-radius:var(--dimension-radius-050)}.tag--size-md.tag--removable.sc-ds-tag-h .tag__remove.sc-ds-tag,.tag--size-sm.tag--removable.sc-ds-tag-h .tag__remove.sc-ds-tag{margin-inline-start:var(--dimension-space-050)}.tag--size-xs.tag--removable.sc-ds-tag-h .tag__remove.sc-ds-tag{margin-inline-start:var(--dimension-space-025)}.tag__remove.sc-ds-tag::before{content:'';position:absolute;inset:-2px;border-radius:var(--dimension-radius-025);background-color:transparent;transition:var(--effect-transition-interaction-background-short-2);pointer-events:none}.tag__remove.sc-ds-tag:hover::before{background-color:var(--color-interaction-hover)}.tag__remove.sc-ds-tag:active::before{background-color:var(--color-interaction-pressed)}.tag--size-sm.sc-ds-tag-h .tag__remove.sc-ds-tag::before{inset:-1px;border-radius:3px}.tag--size-xs.sc-ds-tag-h .tag__remove.sc-ds-tag::before{inset:0;border-radius:var(--dimension-radius-050)}.tag--rounded.sc-ds-tag-h .tag__remove.sc-ds-tag,.tag--rounded.sc-ds-tag-h .tag__remove.sc-ds-tag::before{border-radius:var(--dimension-radius-half)}.tag__remove-x.sc-ds-tag{display:inline-flex;line-height:0;font-size:inherit}.tag--inactive.sc-ds-tag-h{opacity:0.5;pointer-events:none;cursor:not-allowed}`;const g={md:"text-body-medium",sm:"text-body-small",xs:"text-caption"};const c={md:20,sm:16,xs:12};const s=o(class o extends t{constructor(o){super();if(o!==false){this.__registerHost()}this.intent="neutral";this.contrast="faint";this.elevation="none";this.size="md";this.rounded=false}render(){const o=this.size.toUpperCase();const t=g[this.size];const n=c[this.size];const e=this.maxWidth!=null?{maxWidth:typeof this.maxWidth==="number"?`${this.maxWidth}px`:this.maxWidth}:undefined;const s={tag:true,[`tag--intent-${this.intent}`]:true,[`tag--contrast-${this.contrast}`]:true,[`tag--elevation-${this.elevation}`]:true,[`tag--size-${this.size}`]:true,"tag--rounded":this.rounded,"tag--rounded-no-icon-left":this.rounded,"tag--rounded-no-remove-right":this.rounded,[`tag--icon-left-${o}`]:false,[`tag--icon-right-${o}`]:false};return a(r,{key:"f8b17c2ac7e8bc69d4a7e8d232eeb398db1e4cd8",class:s,style:e},a("span",{key:"51fdb2ee046a5b77b2f482df38ffa0b55200b168",class:"tag__icon-slot",style:{fontSize:`${n}px`,lineHeight:"0"}},a("slot",{key:"794af10789f185dca8447ec2a0bb286fc092fcd7",name:"icon"})),a("span",{key:"b996b78ee8465ffe3698d22d183c5643a2bbe25f",class:{tag__label:true,[t]:true}},this.label))}static get style(){return e()}},[262,"ds-tag",{label:[1],intent:[1],contrast:[1],elevation:[1],size:[1],rounded:[4],maxWidth:[8,"max-width"]}]);function i(){if(typeof customElements==="undefined"){return}const o=["ds-tag"];o.forEach((o=>{switch(o){case"ds-tag":if(!customElements.get(n(o))){customElements.define(n(o),s)}break}}))}i();const d=s;const l=i;export{d as DsTag,l as defineCustomElement};
+import{p as o,H as t,h as a,a as r,t as n}from"./index.js";const e=()=>`.sc-ds-tag-h{display:inline-flex;align-items:center;justify-content:center;border-radius:var(--dimension-radius-050);box-sizing:border-box;color:var(--color-foreground-primary);position:relative;--_hover-bg:var(--color-interaction-hover);--_pressed-bg:var(--color-interaction-pressed)}.tag--size-md.sc-ds-tag-h{height:var(--dimension-size-400);padding:0 var(--dimension-space-075);gap:0}.tag--size-sm.sc-ds-tag-h{height:var(--dimension-size-300);padding:0 var(--dimension-space-050);gap:0}.tag--size-xs.sc-ds-tag-h{height:var(--dimension-size-200);padding:0 var(--dimension-space-025);gap:0}.tag--rounded.sc-ds-tag-h{border-radius:var(--dimension-radius-half)}.tag--on-medium.sc-ds-tag-h{--_hover-bg:var(--color-interaction-on-medium-background-hover);--_pressed-bg:var(--color-interaction-on-medium-background-pressed)}.tag--on-bold.sc-ds-tag-h{--_hover-bg:var(--color-interaction-on-bold-background-hover);--_pressed-bg:var(--color-interaction-on-bold-background-pressed)}.tag--on-strong.sc-ds-tag-h{--_hover-bg:var(--color-interaction-on-strong-background-hover);--_pressed-bg:var(--color-interaction-on-strong-background-pressed)}.tag--on-always-dark.sc-ds-tag-h{--_hover-bg:var(--color-always-dark-interaction-hover);--_pressed-bg:var(--color-always-dark-interaction-pressed)}.tag--elevation-flat.sc-ds-tag-h{background-color:transparent !important;box-shadow:inset 0 0 0 var(--dimension-stroke-width-015) currentColor}.tag--elevation-elevated.sc-ds-tag-h{box-shadow:var(--effect-elevation-elevated-sm)}.tag--elevation-flat.tag--intent-neutral.tag--contrast-bold.sc-ds-tag-h{color:var(--color-foreground-bold-neutral)}.tag--elevation-flat.tag--intent-brand.tag--contrast-bold.sc-ds-tag-h{color:var(--color-foreground-bold-brand)}.tag--elevation-flat.tag--intent-ai.tag--contrast-bold.sc-ds-tag-h{color:var(--color-foreground-bold-ai)}.tag--elevation-flat.tag--intent-negative.tag--contrast-bold.sc-ds-tag-h{color:var(--color-foreground-bold-negative)}.tag--elevation-flat.tag--intent-warning.tag--contrast-bold.sc-ds-tag-h{color:var(--color-foreground-bold-warning)}.tag--elevation-flat.tag--intent-caution.tag--contrast-bold.sc-ds-tag-h{color:var(--color-foreground-bold-caution)}.tag--elevation-flat.tag--intent-positive.tag--contrast-bold.sc-ds-tag-h{color:var(--color-foreground-bold-positive)}.tag--elevation-flat.tag--intent-neutral.tag--contrast-strong.sc-ds-tag-h{color:var(--color-foreground-strong-neutral)}.tag--elevation-flat.tag--intent-brand.tag--contrast-strong.sc-ds-tag-h{color:var(--color-foreground-strong-brand)}.tag--elevation-flat.tag--intent-ai.tag--contrast-strong.sc-ds-tag-h{color:var(--color-foreground-strong-ai)}.tag--elevation-flat.tag--intent-negative.tag--contrast-strong.sc-ds-tag-h{color:var(--color-foreground-strong-negative)}.tag--elevation-flat.tag--intent-warning.tag--contrast-strong.sc-ds-tag-h{color:var(--color-foreground-strong-warning)}.tag--elevation-flat.tag--intent-caution.tag--contrast-strong.sc-ds-tag-h{color:var(--color-foreground-strong-caution)}.tag--elevation-flat.tag--intent-positive.tag--contrast-strong.sc-ds-tag-h{color:var(--color-foreground-strong-positive)}.tag--elevation-flat.tag--intent-neutral.tag--contrast-medium.sc-ds-tag-h{color:var(--color-foreground-medium-neutral)}.tag--elevation-flat.tag--intent-brand.tag--contrast-medium.sc-ds-tag-h{color:var(--color-foreground-medium-brand)}.tag--elevation-flat.tag--intent-ai.tag--contrast-medium.sc-ds-tag-h{color:var(--color-foreground-medium-ai)}.tag--elevation-flat.tag--intent-negative.tag--contrast-medium.sc-ds-tag-h{color:var(--color-foreground-medium-negative)}.tag--elevation-flat.tag--intent-warning.tag--contrast-medium.sc-ds-tag-h{color:var(--color-foreground-medium-warning)}.tag--elevation-flat.tag--intent-caution.tag--contrast-medium.sc-ds-tag-h{color:var(--color-foreground-medium-caution)}.tag--elevation-flat.tag--intent-positive.tag--contrast-medium.sc-ds-tag-h{color:var(--color-foreground-medium-positive)}.tag--elevation-flat.tag--intent-neutral.tag--contrast-faint.sc-ds-tag-h{color:var(--color-foreground-faint-neutral)}.tag--elevation-flat.tag--intent-brand.tag--contrast-faint.sc-ds-tag-h{color:var(--color-foreground-faint-brand)}.tag--elevation-flat.tag--intent-ai.tag--contrast-faint.sc-ds-tag-h{color:var(--color-foreground-faint-ai)}.tag--elevation-flat.tag--intent-negative.tag--contrast-faint.sc-ds-tag-h{color:var(--color-foreground-faint-negative)}.tag--elevation-flat.tag--intent-warning.tag--contrast-faint.sc-ds-tag-h{color:var(--color-foreground-faint-warning)}.tag--elevation-flat.tag--intent-caution.tag--contrast-faint.sc-ds-tag-h{color:var(--color-foreground-faint-caution)}.tag--elevation-flat.tag--intent-positive.tag--contrast-faint.sc-ds-tag-h{color:var(--color-foreground-faint-positive)}.tag--intent-neutral.tag--contrast-strong.sc-ds-tag-h{background-color:var(--color-background-strong-neutral);color:var(--color-foreground-medium-neutral)}.tag--intent-brand.tag--contrast-strong.sc-ds-tag-h{background-color:var(--color-background-strong-brand);color:var(--color-foreground-medium-brand)}.tag--intent-ai.tag--contrast-strong.sc-ds-tag-h{background-color:var(--color-background-strong-ai);color:var(--color-foreground-medium-ai)}.tag--intent-negative.tag--contrast-strong.sc-ds-tag-h{background-color:var(--color-background-strong-negative);color:var(--color-foreground-medium-negative)}.tag--intent-warning.tag--contrast-strong.sc-ds-tag-h{background-color:var(--color-background-strong-warning);color:var(--color-foreground-medium-warning)}.tag--intent-caution.tag--contrast-strong.sc-ds-tag-h{background-color:var(--color-background-strong-caution);color:var(--color-foreground-medium-caution)}.tag--intent-positive.tag--contrast-strong.sc-ds-tag-h{background-color:var(--color-background-strong-positive);color:var(--color-foreground-medium-positive)}.tag--intent-neutral.tag--contrast-bold.sc-ds-tag-h{background-color:var(--color-background-bold-neutral);color:var(--color-foreground-on-bold-background-primary)}.tag--intent-brand.tag--contrast-bold.sc-ds-tag-h{background-color:var(--color-background-bold-brand);color:var(--color-foreground-on-bold-background-primary)}.tag--intent-ai.tag--contrast-bold.sc-ds-tag-h{background-color:var(--color-background-bold-ai);color:var(--color-foreground-on-bold-background-primary)}.tag--intent-negative.tag--contrast-bold.sc-ds-tag-h{background-color:var(--color-background-bold-negative);color:var(--color-foreground-on-bold-background-primary)}.tag--intent-warning.tag--contrast-bold.sc-ds-tag-h{background-color:var(--color-background-bold-warning);color:var(--color-foreground-on-bold-background-primary)}.tag--intent-caution.tag--contrast-bold.sc-ds-tag-h{background-color:var(--color-background-bold-caution);color:var(--color-foreground-on-bold-background-primary)}.tag--intent-positive.tag--contrast-bold.sc-ds-tag-h{background-color:var(--color-background-bold-positive);color:var(--color-foreground-on-bold-background-primary)}.tag--intent-neutral.tag--contrast-medium.sc-ds-tag-h{background-color:var(--color-background-medium-neutral);color:var(--color-foreground-strong-neutral)}.tag--intent-brand.tag--contrast-medium.sc-ds-tag-h{background-color:var(--color-background-medium-brand);color:var(--color-foreground-strong-brand)}.tag--intent-ai.tag--contrast-medium.sc-ds-tag-h{background-color:var(--color-background-medium-ai);color:var(--color-foreground-strong-ai)}.tag--intent-negative.tag--contrast-medium.sc-ds-tag-h{background-color:var(--color-background-medium-negative);color:var(--color-foreground-strong-negative)}.tag--intent-warning.tag--contrast-medium.sc-ds-tag-h{background-color:var(--color-background-medium-warning);color:var(--color-foreground-strong-warning)}.tag--intent-caution.tag--contrast-medium.sc-ds-tag-h{background-color:var(--color-background-medium-caution);color:var(--color-foreground-strong-caution)}.tag--intent-positive.tag--contrast-medium.sc-ds-tag-h{background-color:var(--color-background-medium-positive);color:var(--color-foreground-strong-positive)}.tag--intent-neutral.tag--contrast-faint.sc-ds-tag-h{background-color:var(--color-background-faint-neutral);color:var(--color-foreground-bold-neutral)}.tag--intent-brand.tag--contrast-faint.sc-ds-tag-h{background-color:var(--color-background-faint-brand);color:var(--color-foreground-bold-brand)}.tag--intent-ai.tag--contrast-faint.sc-ds-tag-h{background-color:var(--color-background-faint-ai);color:var(--color-foreground-bold-ai)}.tag--intent-negative.tag--contrast-faint.sc-ds-tag-h{background-color:var(--color-background-faint-negative);color:var(--color-foreground-bold-negative)}.tag--intent-warning.tag--contrast-faint.sc-ds-tag-h{background-color:var(--color-background-faint-warning);color:var(--color-foreground-bold-warning)}.tag--intent-caution.tag--contrast-faint.sc-ds-tag-h{background-color:var(--color-background-faint-caution);color:var(--color-foreground-bold-caution)}.tag--intent-positive.tag--contrast-faint.sc-ds-tag-h{background-color:var(--color-background-faint-positive);color:var(--color-foreground-bold-positive)}.tag--interactive.sc-ds-tag-h{cursor:pointer;user-select:none;outline:none}.tag--interactive.sc-ds-tag-h:hover{background-color:var(--_hover-bg)}.tag--interactive.sc-ds-tag-h:active{background-color:var(--_pressed-bg)}.tag--interactive.sc-ds-tag-h:focus-visible{outline:var(--dimension-stroke-width-025) solid var(--color-interaction-focus);outline-offset:var(--dimension-space-025)}.tag--pressed.sc-ds-tag-h{background-color:var(--color-background-faint-brand) !important;color:var(--color-foreground-bold-brand) !important}.tag__label.sc-ds-tag{line-height:0;padding:0 var(--dimension-space-025);white-space:nowrap;flex-shrink:0}.tag__icon-slot.sc-ds-tag{display:contents}.tag--removable.sc-ds-tag-h .tag__label.sc-ds-tag{padding-inline-end:0}.tag__remove.sc-ds-tag{padding:0;margin:0;border:none;background:none;display:flex;align-items:center;justify-content:center;cursor:pointer;color:inherit;flex-shrink:0;position:relative;border-radius:var(--dimension-radius-050)}.tag--size-md.tag--removable.sc-ds-tag-h .tag__remove.sc-ds-tag,.tag--size-sm.tag--removable.sc-ds-tag-h .tag__remove.sc-ds-tag{margin-inline-start:var(--dimension-space-050)}.tag--size-xs.tag--removable.sc-ds-tag-h .tag__remove.sc-ds-tag{margin-inline-start:var(--dimension-space-025)}.tag__remove.sc-ds-tag::before{content:'';position:absolute;inset:-2px;border-radius:var(--dimension-radius-025);background-color:transparent;transition:var(--effect-transition-interaction-background-short-2);pointer-events:none}.tag__remove.sc-ds-tag:hover::before{background-color:var(--color-interaction-hover)}.tag__remove.sc-ds-tag:active::before{background-color:var(--color-interaction-pressed)}.tag--size-sm.sc-ds-tag-h .tag__remove.sc-ds-tag::before{inset:-1px;border-radius:3px}.tag--size-xs.sc-ds-tag-h .tag__remove.sc-ds-tag::before{inset:0;border-radius:var(--dimension-radius-050)}.tag--rounded.sc-ds-tag-h .tag__remove.sc-ds-tag,.tag--rounded.sc-ds-tag-h .tag__remove.sc-ds-tag::before{border-radius:var(--dimension-radius-half)}.tag__remove-x.sc-ds-tag{display:inline-flex;line-height:0;font-size:inherit}.tag--inactive.sc-ds-tag-h{opacity:0.5;pointer-events:none;cursor:not-allowed}`;const g={md:"text-body-medium",sm:"text-body-small",xs:"text-caption"};const c={md:20,sm:16,xs:12};const s=o(class o extends t{constructor(o){super();if(o!==false){this.__registerHost()}this.intent="neutral";this.contrast="faint";this.elevation="none";this.size="md";this.rounded=false}render(){const o=this.size.toUpperCase();const t=g[this.size];const n=c[this.size];const e=this.maxWidth!=null?{maxWidth:typeof this.maxWidth==="number"?`${this.maxWidth}px`:this.maxWidth}:undefined;const s={tag:true,[`tag--intent-${this.intent}`]:true,[`tag--contrast-${this.contrast}`]:true,[`tag--elevation-${this.elevation}`]:true,[`tag--size-${this.size}`]:true,"tag--rounded":this.rounded,"tag--rounded-no-icon-left":this.rounded,"tag--rounded-no-remove-right":this.rounded,[`tag--icon-left-${o}`]:false,[`tag--icon-right-${o}`]:false};return a(r,{key:"2260ea7b942412005f901a6b7a3b11ab335cd207",class:s,style:e},a("span",{key:"917020d262b120372b565cd48d71ac49400ebb44",class:"tag__icon-slot",style:{fontSize:`${n}px`,lineHeight:"0"}},a("slot",{key:"e334cd796a5da9481032eac6d0b71346c96f7e69",name:"icon"})),a("span",{key:"ae760e216345de84d9805a928dee6c917ac8a959",class:{tag__label:true,[t]:true}},this.label))}static get style(){return e()}},[262,"ds-tag",{label:[1],intent:[1],contrast:[1],elevation:[1],size:[1],rounded:[4],maxWidth:[8,"max-width"]}]);function i(){if(typeof customElements==="undefined"){return}const o=["ds-tag"];o.forEach((o=>{switch(o){case"ds-tag":if(!customElements.get(n(o))){customElements.define(n(o),s)}break}}))}i();const d=s;const l=i;export{d as DsTag,l as defineCustomElement};
 //# sourceMappingURL=ds-tag.js.map

package/dist/components/ds-text.js

@@ -1,2 +1,2 @@
-import{T as o,d as s}from"./p-BGZjpSXm.js";const p=o;const t=s;export{p as DsText,t as defineCustomElement};
+import{T as o,d as s}from"./p-DOU4cbpc.js";const c=o;const p=s;export{c as DsText,p as defineCustomElement};
 //# sourceMappingURL=ds-text.js.map

package/dist/components/ds-toast-provider.js

@@ -1,2 +1,2 @@
-import{p as t,H as e,h as s,a as i,t as o}from"./index.js";import{r as n}from"./p-C1cBr-Ri.js";import{T as r}from"./p-jjfqrXnP.js";let a=[];const d=new Set;let c=0;function l(){d.forEach((t=>t()))}function u(t){d.add(t);return()=>d.delete(t)}function m(){return a}function f(){return n(r.animationDelayLong2,r.animationDelayLong2)}const p={show(t){const e=`ds-toast-${++c}`;const s=t.duration??f();a=[...a,{id:e,intent:"neutral",...t,duration:s}];l();return e},success(t,e){return p.show({message:t,intent:"positive",...e})},error(t,e){return p.show({message:t,intent:"negative",...e})},warning(t,e){return p.show({message:t,intent:"warning",...e})},info(t,e){return p.show({message:t,intent:"neutral",...e})},dismiss(t){a=a.filter((e=>e.id!==t));l()},dismissAll(){a=[];l()}};const h=()=>`.toast.sc-ds-toast-provider{animation:toastSlideIn var(--effect-motion-short-3) ease-out;width:100%;max-width:var(--dimension-panel-width-md)}.toast--exit.sc-ds-toast-provider{animation:toastFadeOut var(--effect-motion-short-3) ease-in forwards}.toast-dismiss.sc-ds-toast-provider{background:none;border:none;color:inherit;cursor:pointer;padding:var(--dimension-space-025);margin-left:auto;font-size:16px;line-height:1;opacity:0.7;border-radius:var(--dimension-radius-050);transition:opacity var(--effect-motion-short-2);flex-shrink:0}.toast-dismiss.sc-ds-toast-provider:hover{opacity:1}@keyframes toastSlideIn{from{opacity:0;transform:translateY(-8px)}to{opacity:1;transform:translateY(0)}}@keyframes toastFadeOut{from{opacity:1}to{opacity:0}}`;const g={neutral:"var(--color-background-bold-neutral)",brand:"var(--color-background-bold-brand)",positive:"var(--color-background-bold-positive)",negative:"var(--color-background-bold-negative)",warning:"var(--color-background-bold-warning)",caution:"var(--color-background-bold-caution)"};const v=t(class t extends e{constructor(t){super();if(t!==false){this.__registerHost()}this.position="top-center";this.items=[];this.unsubscribe=null}get fadeOutMs(){return n(r.motionShort3,r.animationDurationShort3)}connectedCallback(){this.unsubscribe=u((()=>this.syncFromStore()));this.syncFromStore()}disconnectedCallback(){this.items.forEach((t=>{if(t.timer)clearTimeout(t.timer)}));this.unsubscribe?.()}syncFromStore(){const t=m();const e=new Set(this.items.map((t=>t.data.id)));const s=new Set(t.map((t=>t.id)));const i=this.items.filter((t=>s.has(t.data.id)));const o=t.filter((t=>!e.has(t.id))).map((t=>{const e={data:t,exiting:false,timer:null,remaining:t.duration,startedAt:0,paused:false};if(t.duration>0){e.startedAt=Date.now();e.timer=setTimeout((()=>this.dismissItem(t.id)),t.duration)}return e}));this.items=[...i,...o]}dismissItem(t){this.items=this.items.map((e=>e.data.id===t?{...e,exiting:true,timer:null}:e));setTimeout((()=>{this.items=this.items.filter((e=>e.data.id!==t));p.dismiss(t)}),this.fadeOutMs)}pauseItem(t){this.items=this.items.map((e=>{if(e.data.id!==t||e.paused||!e.timer)return e;clearTimeout(e.timer);const s=Date.now()-e.startedAt;return{...e,paused:true,timer:null,remaining:Math.max(0,e.remaining-s)}}))}resumeItem(t){this.items=this.items.map((e=>{if(e.data.id!==t||!e.paused||e.remaining<=0)return e;const s=setTimeout((()=>this.dismissItem(t)),e.remaining);return{...e,paused:false,timer:s,startedAt:Date.now()}}))}getPositionStyle(){const t={position:"fixed",zIndex:"9999",display:"flex",flexDirection:"column",gap:"var(--dimension-space-075)",pointerEvents:"none",padding:"var(--dimension-space-100)",maxWidth:`var(${r.panelWidthMd})`,width:"100%",boxSizing:"border-box"};switch(this.position){case"top-center":return{...t,top:"0",left:"50%",transform:"translateX(-50%)",alignItems:"center"};case"top-right":return{...t,top:"0",right:"0",alignItems:"flex-end"};case"bottom-center":return{...t,bottom:"0",left:"50%",transform:"translateX(-50%)",alignItems:"center"};case"bottom-right":return{...t,bottom:"0",right:"0",alignItems:"flex-end"}}}render(){return s(i,{key:"dcd43f4fa5d707d6e9e98767210d8ec779d0f62a",style:{display:"contents"}},s("div",{key:"7956bd6b3dc352b5ddda76702f2b134f8c14e3ec",class:"toast-container",role:"region","aria-label":"Notifications","aria-live":"polite",style:this.getPositionStyle()},this.items.map((t=>s("div",{key:t.data.id,class:{toast:true,"toast--exit":t.exiting},role:t.data.intent==="negative"?"alert":"status",style:{backgroundColor:g[t.data.intent],borderRadius:"var(--dimension-radius-125)",boxShadow:"var(--effect-elevation-elevated-floating)",display:"flex",alignItems:"center",gap:"var(--dimension-space-075)",padding:"var(--dimension-space-075) var(--dimension-space-100)",minHeight:"var(--dimension-size-400)",pointerEvents:"auto",color:"var(--color-foreground-on-bold-background-primary)",boxSizing:"border-box"},onMouseEnter:()=>this.pauseItem(t.data.id),onMouseLeave:()=>this.resumeItem(t.data.id)},s("span",{class:"text-body-medium",style:{flex:"1"}},t.data.message),s("button",{type:"button",class:"toast-dismiss",onClick:()=>this.dismissItem(t.data.id),"aria-label":"Dismiss"},"×"))))))}static get style(){return h()}},[2,"ds-toast-provider",{position:[1],items:[32]}]);function b(){if(typeof customElements==="undefined"){return}const t=["ds-toast-provider"];t.forEach((t=>{switch(t){case"ds-toast-provider":if(!customElements.get(o(t))){customElements.define(o(t),v)}break}}))}b();const x=v;const y=b;export{x as DsToastProvider,y as defineCustomElement};
+import{p as t,H as e,h as s,a as i,t as o}from"./index.js";import{r as n}from"./p-C1cBr-Ri.js";import{T as r}from"./p-bDf6yBQd.js";let a=[];const c=new Set;let d=0;function l(){c.forEach((t=>t()))}function u(t){c.add(t);return()=>c.delete(t)}function m(){return a}function f(){return n(r.animationDelayLong2,r.animationDelayLong2)}const p={show(t){const e=`ds-toast-${++d}`;const s=t.duration??f();a=[...a,{id:e,intent:"neutral",...t,duration:s}];l();return e},success(t,e){return p.show({message:t,intent:"positive",...e})},error(t,e){return p.show({message:t,intent:"negative",...e})},warning(t,e){return p.show({message:t,intent:"warning",...e})},info(t,e){return p.show({message:t,intent:"neutral",...e})},dismiss(t){a=a.filter((e=>e.id!==t));l()},dismissAll(){a=[];l()}};const h=()=>`.toast.sc-ds-toast-provider{animation:toastSlideIn var(--effect-motion-short-3) ease-out;width:100%;max-width:var(--dimension-panel-width-md)}.toast--exit.sc-ds-toast-provider{animation:toastFadeOut var(--effect-motion-short-3) ease-in forwards}.toast-dismiss.sc-ds-toast-provider{background:none;border:none;color:inherit;cursor:pointer;padding:var(--dimension-space-025);margin-left:auto;font-size:16px;line-height:1;opacity:0.7;border-radius:var(--dimension-radius-050);transition:opacity var(--effect-motion-short-2);flex-shrink:0}.toast-dismiss.sc-ds-toast-provider:hover{opacity:1}@keyframes toastSlideIn{from{opacity:0;transform:translateY(-8px)}to{opacity:1;transform:translateY(0)}}@keyframes toastFadeOut{from{opacity:1}to{opacity:0}}`;const g={neutral:"var(--color-background-bold-neutral)",brand:"var(--color-background-bold-brand)",positive:"var(--color-background-bold-positive)",negative:"var(--color-background-bold-negative)",warning:"var(--color-background-bold-warning)",caution:"var(--color-background-bold-caution)"};const b=t(class t extends e{constructor(t){super();if(t!==false){this.__registerHost()}this.position="top-center";this.items=[];this.unsubscribe=null}get fadeOutMs(){return n(r.motionShort3,r.animationDurationShort3)}connectedCallback(){this.unsubscribe=u((()=>this.syncFromStore()));this.syncFromStore()}disconnectedCallback(){this.items.forEach((t=>{if(t.timer)clearTimeout(t.timer)}));this.unsubscribe?.()}syncFromStore(){const t=m();const e=new Set(this.items.map((t=>t.data.id)));const s=new Set(t.map((t=>t.id)));const i=this.items.filter((t=>s.has(t.data.id)));const o=t.filter((t=>!e.has(t.id))).map((t=>{const e={data:t,exiting:false,timer:null,remaining:t.duration,startedAt:0,paused:false};if(t.duration>0){e.startedAt=Date.now();e.timer=setTimeout((()=>this.dismissItem(t.id)),t.duration)}return e}));this.items=[...i,...o]}dismissItem(t){this.items=this.items.map((e=>e.data.id===t?{...e,exiting:true,timer:null}:e));setTimeout((()=>{this.items=this.items.filter((e=>e.data.id!==t));p.dismiss(t)}),this.fadeOutMs)}pauseItem(t){this.items=this.items.map((e=>{if(e.data.id!==t||e.paused||!e.timer)return e;clearTimeout(e.timer);const s=Date.now()-e.startedAt;return{...e,paused:true,timer:null,remaining:Math.max(0,e.remaining-s)}}))}resumeItem(t){this.items=this.items.map((e=>{if(e.data.id!==t||!e.paused||e.remaining<=0)return e;const s=setTimeout((()=>this.dismissItem(t)),e.remaining);return{...e,paused:false,timer:s,startedAt:Date.now()}}))}getPositionStyle(){const t={position:"fixed",zIndex:"9999",display:"flex",flexDirection:"column",gap:"var(--dimension-space-075)",pointerEvents:"none",padding:"var(--dimension-space-100)",maxWidth:`var(${r.panelWidthMd})`,width:"100%",boxSizing:"border-box"};switch(this.position){case"top-center":return{...t,top:"0",left:"50%",transform:"translateX(-50%)",alignItems:"center"};case"top-right":return{...t,top:"0",right:"0",alignItems:"flex-end"};case"bottom-center":return{...t,bottom:"0",left:"50%",transform:"translateX(-50%)",alignItems:"center"};case"bottom-right":return{...t,bottom:"0",right:"0",alignItems:"flex-end"}}}render(){return s(i,{key:"c03f35b5e6068283fa7c528b1fbef957918a691a",style:{display:"contents"}},s("div",{key:"c028d9166a58251f967f0304b6d511e3c0f59375",class:"toast-container",role:"region","aria-label":"Notifications","aria-live":"polite",style:this.getPositionStyle()},this.items.map((t=>s("div",{key:t.data.id,class:{toast:true,"toast--exit":t.exiting},role:t.data.intent==="negative"?"alert":"status",style:{backgroundColor:g[t.data.intent],borderRadius:"var(--dimension-radius-125)",boxShadow:"var(--effect-elevation-elevated-floating)",display:"flex",alignItems:"center",gap:"var(--dimension-space-075)",padding:"var(--dimension-space-075) var(--dimension-space-100)",minHeight:"var(--dimension-size-400)",pointerEvents:"auto",color:"var(--color-foreground-on-bold-background-primary)",boxSizing:"border-box"},onMouseEnter:()=>this.pauseItem(t.data.id),onMouseLeave:()=>this.resumeItem(t.data.id)},s("span",{class:"text-body-medium",style:{flex:"1"}},t.data.message),s("button",{type:"button",class:"toast-dismiss",onClick:()=>this.dismissItem(t.data.id),"aria-label":"Dismiss"},"×"))))))}static get style(){return h()}},[2,"ds-toast-provider",{position:[1],items:[32]}]);function v(){if(typeof customElements==="undefined"){return}const t=["ds-toast-provider"];t.forEach((t=>{switch(t){case"ds-toast-provider":if(!customElements.get(o(t))){customElements.define(o(t),b)}break}}))}v();const y=b;const x=v;export{y as DsToastProvider,x as defineCustomElement};
 //# sourceMappingURL=ds-toast-provider.js.map

package/dist/components/ds-toggle.js

@@ -1,2 +1,2 @@
-import{p as t,H as e,c as o,h as i,a as s,t as n}from"./index.js";const r=()=>`:host{position:relative;display:inline-flex;align-items:center;justify-content:flex-start;width:var(--dimension-size-400);height:var(--dimension-size-250);padding:0 var(--dimension-space-025);border:none;border-radius:var(--dimension-radius-half);cursor:pointer;user-select:none;outline:none;flex-shrink:0;background-color:var(--color-background-medium-neutral);box-shadow:var(--effect-highlight-depressed-sm);transition:background-color var(--effect-motion-short-2);box-sizing:border-box}:host::before{content:'';position:absolute;inset:0;border-radius:inherit;box-shadow:var(--effect-shadow-depressed-sm);pointer-events:none}:host(:focus-visible){outline:var(--dimension-stroke-width-025) solid var(--color-interaction-focus);outline-offset:var(--dimension-space-025)}:host(.checked){background-color:var(--color-foreground-bold-brand)}:host(.inactive){cursor:not-allowed;opacity:0.5}.thumb{position:relative;flex-shrink:0;width:var(--dimension-size-200);height:var(--dimension-size-200);background-color:var(--color-background-primary);border-radius:var(--dimension-radius-half);box-shadow:var(--effect-elevation-elevated-sm);transition:transform var(--effect-motion-short-2);transform:translateX(0);z-index:1}.thumb::after{content:'';position:absolute;inset:0;background-color:transparent;border-radius:inherit;transition:background-color var(--effect-motion-instant, 100ms);pointer-events:none}:host(:hover:not(.inactive)) .thumb::after{background-color:var(--color-interaction-hover)}:host(:active:not(.inactive)) .thumb::after{background-color:var(--color-interaction-pressed)}:host(.checked) .thumb{transform:translateX(var(--dimension-offset-150))}:host(:active:not(.inactive)) .thumb{transform:translateX(0) scale(var(--dimension-scale-subtle)) !important;transition:transform var(--effect-motion-instant)}:host(.checked:active:not(.inactive)) .thumb{transform:translateX(var(--dimension-offset-150)) scale(var(--dimension-scale-subtle)) !important;transition:transform var(--effect-motion-instant)}`;const a=t(class t extends e{constructor(t){super();if(t!==false){this.__registerHost()}this.__attachShadow();this.dsChange=o(this,"dsChange");this.checked=false;this.inactive=false;this.handleClick=()=>{if(this.inactive)return;this.checked=!this.checked;this.dsChange.emit(this.checked)};this.handleKeyDown=t=>{if(this.inactive)return;if(t.key===" "||t.key==="Enter"){t.preventDefault();this.handleClick()}}}render(){return i(s,{key:"a343baedfb36edf3eb39682b05d72a66fcca29d1",role:"switch","aria-checked":String(this.checked),"aria-disabled":this.inactive||undefined,tabIndex:this.inactive?-1:0,class:{toggle:true,checked:this.checked,inactive:this.inactive},onClick:this.handleClick,onKeyDown:this.handleKeyDown},i("span",{key:"e92a69389de75fd134d748644ebc1f9550aa8292",class:"thumb"}))}static get style(){return r()}},[1,"ds-toggle",{checked:[1028],inactive:[4]}]);function c(){if(typeof customElements==="undefined"){return}const t=["ds-toggle"];t.forEach((t=>{switch(t){case"ds-toggle":if(!customElements.get(n(t))){customElements.define(n(t),a)}break}}))}c();const d=a;const h=c;export{d as DsToggle,h as defineCustomElement};
+import{p as t,H as e,c as o,h as i,a as s,t as n}from"./index.js";const r=()=>`:host{position:relative;display:inline-flex;align-items:center;justify-content:flex-start;width:var(--dimension-size-400);height:var(--dimension-size-250);padding:0 var(--dimension-space-025);border:none;border-radius:var(--dimension-radius-half);cursor:pointer;user-select:none;outline:none;flex-shrink:0;background-color:var(--color-background-medium-neutral);box-shadow:var(--effect-highlight-depressed-sm);transition:background-color var(--effect-motion-short-2);box-sizing:border-box}:host::before{content:'';position:absolute;inset:0;border-radius:inherit;box-shadow:var(--effect-shadow-depressed-sm);pointer-events:none}:host(:focus-visible){outline:var(--dimension-stroke-width-025) solid var(--color-interaction-focus);outline-offset:var(--dimension-space-025)}:host(.checked){background-color:var(--color-foreground-bold-brand)}:host(.inactive){cursor:not-allowed;opacity:0.5}.thumb{position:relative;flex-shrink:0;width:var(--dimension-size-200);height:var(--dimension-size-200);background-color:var(--color-background-primary);border-radius:var(--dimension-radius-half);box-shadow:var(--effect-elevation-elevated-sm);transition:transform var(--effect-motion-short-2);transform:translateX(0);z-index:1}.thumb::after{content:'';position:absolute;inset:0;background-color:transparent;border-radius:inherit;transition:background-color var(--effect-motion-instant, 100ms);pointer-events:none}:host(:hover:not(.inactive)) .thumb::after{background-color:var(--color-interaction-hover)}:host(:active:not(.inactive)) .thumb::after{background-color:var(--color-interaction-pressed)}:host(.checked) .thumb{transform:translateX(var(--dimension-offset-150))}:host(:active:not(.inactive)) .thumb{transform:translateX(0) scale(var(--dimension-scale-subtle)) !important;transition:transform var(--effect-motion-instant)}:host(.checked:active:not(.inactive)) .thumb{transform:translateX(var(--dimension-offset-150)) scale(var(--dimension-scale-subtle)) !important;transition:transform var(--effect-motion-instant)}`;const a=t(class t extends e{constructor(t){super();if(t!==false){this.__registerHost()}this.__attachShadow();this.dsChange=o(this,"dsChange");this.checked=false;this.inactive=false;this.handleClick=()=>{if(this.inactive)return;this.checked=!this.checked;this.dsChange.emit(this.checked)};this.handleKeyDown=t=>{if(this.inactive)return;if(t.key===" "||t.key==="Enter"){t.preventDefault();this.handleClick()}}}render(){return i(s,{key:"66c915391c1cd5652720eb41c9a3c8dc5b5cec0e",role:"switch","aria-checked":String(this.checked),"aria-disabled":this.inactive||undefined,tabIndex:this.inactive?-1:0,class:{toggle:true,checked:this.checked,inactive:this.inactive},onClick:this.handleClick,onKeyDown:this.handleKeyDown},i("span",{key:"3dedc4bcfef36e8ef547123fdcf04cb6a76d1c1d",class:"thumb"}))}static get style(){return r()}},[1,"ds-toggle",{checked:[1028],inactive:[4]}]);function c(){if(typeof customElements==="undefined"){return}const t=["ds-toggle"];t.forEach((t=>{switch(t){case"ds-toggle":if(!customElements.get(n(t))){customElements.define(n(t),a)}break}}))}c();const d=a;const h=c;export{d as DsToggle,h as defineCustomElement};
 //# sourceMappingURL=ds-toggle.js.map

package/dist/components/ds-tooltip-data-viz.d.ts

@@ -0,0 +1,11 @@
+import type { Components, JSX } from "../types/components";
+
+interface DsTooltipDataViz extends Components.DsTooltipDataViz, HTMLElement {}
+export const DsTooltipDataViz: {
+    prototype: DsTooltipDataViz;
+    new (): DsTooltipDataViz;
+};
+/**
+ * Used to define this component and all nested components recursively.
+ */
+export const defineCustomElement: () => void;

package/dist/components/ds-tooltip-data-viz.js

@@ -0,0 +1,2 @@
+import{p as t,H as a,h as e,a as o,t as i}from"./index.js";import{d as s}from"./p-DOU4cbpc.js";const n=()=>`.sc-ds-tooltip-data-viz-h{position:absolute;z-index:var(--dimension-z-index-tooltip);display:block;box-sizing:border-box;background-color:var(--color-background-translucent);backdrop-filter:blur(var(--effect-blur-md));-webkit-backdrop-filter:blur(var(--effect-blur-md));border-radius:var(--dimension-radius-025);box-shadow:var(--effect-elevation-elevated-floating);white-space:nowrap;pointer-events:none;animation:tooltip-data-viz-fade-in var(--effect-motion-short-2) forwards}.tooltip-data-viz__item.sc-ds-tooltip-data-viz{box-sizing:border-box;height:var(--dimension-size-400);display:flex;align-items:center;gap:var(--dimension-space-025);padding:0 var(--dimension-space-075)}.tooltip-data-viz__label.sc-ds-tooltip-data-viz,.tooltip-data-viz__value.sc-ds-tooltip-data-viz{padding:0 var(--dimension-space-025);line-height:var(--typography-lineheight-md)}@keyframes tooltip-data-viz-fade-in{from{opacity:0}to{opacity:1}}`;const r=12;const d=8;const c=t(class t extends a{constructor(t){super();if(t!==false){this.__registerHost()}this.value="";this.label="";this.x=0;this.y=0;this.side="right";this.align="bottom"}componentDidLoad(){this.calculatePlacement()}onAnchorChange(){requestAnimationFrame((()=>this.calculatePlacement()))}calculatePlacement(){const t=this.el.getBoundingClientRect();if(!t.width||!t.height)return;const a=t.right>window.innerWidth-d?"left":"right";const e=t.bottom>window.innerHeight-d?"top":"bottom";if(a!==this.side)this.side=a;if(e!==this.align)this.align=e}render(){const t=this.side==="right"?`${r}px`:`calc(-100% - ${r}px)`;const a=this.align==="bottom"?`${r}px`:`calc(-100% - ${r}px)`;return e(o,{key:"4b372a0e39d799ec8811b084fcbcb0f4a146952a",class:"tooltip-data-viz",style:{left:`${this.x}px`,top:`${this.y}px`,transform:`translate(${t}, ${a})`}},e("div",{key:"ecf6345711908e7799d272c67537a64f35824abe",class:"tooltip-data-viz__item"},e("span",{key:"f61444257e82dcf21d4f62a41fa5a66debbe11f0",class:"tooltip-data-viz__label"},e("ds-text",{key:"28b40c9e9287aaafcb0cf06b241b23303030b287",as:"span",variant:"text-body-medium",color:"var(--color-foreground-on-translucent-background-secondary)"},this.label)),e("span",{key:"cfef06d33dcd0c2628d2bf51ff9301f46f108dc5",class:"tooltip-data-viz__value"},e("ds-text",{key:"c4dced858a25bf5a6c0b79d0d2b430f4f34c2271",as:"span",variant:"text-body-medium-emphasis",color:"var(--color-foreground-on-translucent-background-primary)"},this.value))))}get el(){return this}static get watchers(){return{x:[{onAnchorChange:0}],y:[{onAnchorChange:0}]}}static get style(){return n()}},[2,"ds-tooltip-data-viz",{value:[8],label:[1],x:[2],y:[2],side:[32],align:[32]},undefined,{x:[{onAnchorChange:0}],y:[{onAnchorChange:0}]}]);function l(){if(typeof customElements==="undefined"){return}const t=["ds-tooltip-data-viz","ds-text"];t.forEach((t=>{switch(t){case"ds-tooltip-data-viz":if(!customElements.get(i(t))){customElements.define(i(t),c)}break;case"ds-text":if(!customElements.get(i(t))){s()}break}}))}l();const p=c;const f=l;export{p as DsTooltipDataViz,f as defineCustomElement};
+//# sourceMappingURL=ds-tooltip-data-viz.js.map

package/dist/components/ds-tooltip-data-viz.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["tooltipDataVizCss","CURSOR_OFFSET_PX","VIEWPORT_PAD_PX","TooltipDataViz","__stencil_proxyCustomElement","HTMLElement","constructor","registerHost","this","value","label","x","y","side","align","componentDidLoad","calculatePlacement","onAnchorChange","requestAnimationFrame","rect","el","getBoundingClientRect","width","height","nextSide","right","window","innerWidth","nextAlign","bottom","innerHeight","render","translateX","translateY","h","Host","key","class","style","left","top","transform","as","variant","color"],"sources":["src/wc/components/TooltipDataViz/TooltipDataViz.css?tag=ds-tooltip-data-viz&encapsulation=scoped","src/wc/components/TooltipDataViz/TooltipDataViz.tsx"],"sourcesContent":["/* No padding here — the item div below owns all the spacing, so there's exactly one padding\n   box instead of stacking the host's padding on top of the item's. */\n:host {\n  position: absolute;\n  z-index: var(--dimension-z-index-tooltip);\n  display: block;\n  box-sizing: border-box;\n  background-color: var(--color-background-translucent);\n  backdrop-filter: blur(var(--effect-blur-md));\n  -webkit-backdrop-filter: blur(var(--effect-blur-md));\n  border-radius: var(--dimension-radius-025);\n  box-shadow: var(--effect-elevation-elevated-floating);\n  white-space: nowrap;\n  pointer-events: none;\n  animation: tooltip-data-viz-fade-in var(--effect-motion-short-2) forwards;\n}\n\n/* Fixed height (not derived from padding + line-height) — same fix as ChartLegend's items:\n   a plain wrapper can inherit a taller default line-height than its actual content and inflate\n   the row. A hard height + horizontal-only padding sidesteps that. */\n.tooltip-data-viz__item {\n  box-sizing: border-box;\n  height: var(--dimension-size-400);\n  display: flex;\n  align-items: center;\n  gap: var(--dimension-space-025);\n  padding: 0 var(--dimension-space-075);\n}\n\n/* <ds-text>'s host is `display: contents` — padding/line-height on it would no-op, so this\n   wrapper owns both: 2px horizontal padding around the text, and line-height matching\n   text-body-medium so the wrapper hugs its actual content instead of inheriting the browser\n   default. */\n.tooltip-data-viz__label,\n.tooltip-data-viz__value {\n  padding: 0 var(--dimension-space-025);\n  line-height: var(--typography-lineheight-md);\n}\n\n@keyframes tooltip-data-viz-fade-in {\n  from { opacity: 0; }\n  to   { opacity: 1; }\n}\n","import { Component, Prop, State, Element, Watch, h, Host } from '@stencil/core';\n\nconst CURSOR_OFFSET_PX = 12;\nconst VIEWPORT_PAD_PX = 8;\n\nexport type TooltipDataVizSide = 'left' | 'right';\nexport type TooltipDataVizAlign = 'top' | 'bottom';\n\n/**\n * Positioned value/label callout for chart hover interactions (donut slice, bar,\n * line point, ...). Unlike `ds-tooltip`, this doesn't bind to a slotted anchor element —\n * charts hover-highlight data that lives inside an SVG, so the chart itself computes\n * the anchor point (e.g. the cursor position while hovering) and passes it in as `x`/`y`.\n *\n * Renders `position: absolute` — place inside a `position: relative` chart wrapper,\n * with `x`/`y` as pixel coordinates within that wrapper. Defaults to sitting below-right\n * of the anchor (matching cursor-following tooltips), flipping to whichever side/edge\n * keeps it on-screen.\n */\n@Component({\n  tag: 'ds-tooltip-data-viz',\n  styleUrl: 'TooltipDataViz.css',\n  scoped: true,\n})\nexport class TooltipDataViz {\n  @Element() el!: HTMLElement;\n\n  @Prop() value: string | number = '';\n  @Prop() label: string = '';\n  /** Anchor point in px, relative to the nearest `position: relative` ancestor — e.g. the cursor. */\n  @Prop() x: number = 0;\n  @Prop() y: number = 0;\n\n  @State() private side: TooltipDataVizSide = 'right';\n  @State() private align: TooltipDataVizAlign = 'bottom';\n\n  componentDidLoad() {\n    this.calculatePlacement();\n  }\n\n  @Watch('x')\n  @Watch('y')\n  onAnchorChange() {\n    requestAnimationFrame(() => this.calculatePlacement());\n  }\n\n  private calculatePlacement() {\n    const rect = this.el.getBoundingClientRect();\n    if (!rect.width || !rect.height) return;\n\n    const nextSide: TooltipDataVizSide = rect.right > window.innerWidth - VIEWPORT_PAD_PX ? 'left' : 'right';\n    const nextAlign: TooltipDataVizAlign = rect.bottom > window.innerHeight - VIEWPORT_PAD_PX ? 'top' : 'bottom';\n\n    if (nextSide !== this.side) this.side = nextSide;\n    if (nextAlign !== this.align) this.align = nextAlign;\n  }\n\n  render() {\n    const translateX = this.side === 'right' ? `${CURSOR_OFFSET_PX}px` : `calc(-100% - ${CURSOR_OFFSET_PX}px)`;\n    const translateY = this.align === 'bottom' ? `${CURSOR_OFFSET_PX}px` : `calc(-100% - ${CURSOR_OFFSET_PX}px)`;\n\n    return (\n      <Host\n        class=\"tooltip-data-viz\"\n        style={{ left: `${this.x}px`, top: `${this.y}px`, transform: `translate(${translateX}, ${translateY})` }}\n      >\n        <div class=\"tooltip-data-viz__item\">\n          <span class=\"tooltip-data-viz__label\">\n            <ds-text as=\"span\" variant=\"text-body-medium\" color=\"var(--color-foreground-on-translucent-background-secondary)\">\n              {this.label}\n            </ds-text>\n          </span>\n          <span class=\"tooltip-data-viz__value\">\n            <ds-text as=\"span\" variant=\"text-body-medium-emphasis\" color=\"var(--color-foreground-on-translucent-background-primary)\">\n              {this.value}\n            </ds-text>\n          </span>\n        </div>\n      </Host>\n    );\n  }\n}\n"],"mappings":"+FAAA,MAAMA,EAAoB,IAAM,45BCEhC,MAAMC,EAAmB,GACzB,MAAMC,EAAkB,E,MAqBXC,EAAcC,EAAA,MAAAD,UAAAE,EAL3B,WAAAC,CAAAC,G,4CAQUC,KAAAC,MAAyB,GACzBD,KAAAE,MAAgB,GAEhBF,KAAAG,EAAY,EACZH,KAAAI,EAAY,EAEHJ,KAAAK,KAA2B,QAC3BL,KAAAM,MAA6B,QA+C/C,CA7CC,gBAAAC,GACEP,KAAKQ,oB,CAKP,cAAAC,GACEC,uBAAsB,IAAMV,KAAKQ,sB,CAG3B,kBAAAA,GACN,MAAMG,EAAOX,KAAKY,GAAGC,wBACrB,IAAKF,EAAKG,QAAUH,EAAKI,OAAQ,OAEjC,MAAMC,EAA+BL,EAAKM,MAAQC,OAAOC,WAAazB,EAAkB,OAAS,QACjG,MAAM0B,EAAiCT,EAAKU,OAASH,OAAOI,YAAc5B,EAAkB,MAAQ,SAEpG,GAAIsB,IAAahB,KAAKK,KAAML,KAAKK,KAAOW,EACxC,GAAII,IAAcpB,KAAKM,MAAON,KAAKM,MAAQc,C,CAG7C,MAAAG,GACE,MAAMC,EAAaxB,KAAKK,OAAS,QAAU,GAAGZ,MAAuB,gBAAgBA,OACrF,MAAMgC,EAAazB,KAAKM,QAAU,SAAW,GAAGb,MAAuB,gBAAgBA,OAEvF,OACEiC,EAACC,EAAI,CAAAC,IAAA,2CACHC,MAAM,mBACNC,MAAO,CAAEC,KAAM,GAAG/B,KAAKG,MAAO6B,IAAK,GAAGhC,KAAKI,MAAO6B,UAAW,aAAaT,MAAeC,OAEzFC,EAAA,OAAAE,IAAA,2CAAKC,MAAM,0BACTH,EAAA,QAAAE,IAAA,2CAAMC,MAAM,2BACVH,EAAA,WAAAE,IAAA,2CAASM,GAAG,OAAOC,QAAQ,mBAAmBC,MAAM,+DACjDpC,KAAKE,QAGVwB,EAAA,QAAAE,IAAA,2CAAMC,MAAM,2BACVH,EAAA,WAAAE,IAAA,2CAASM,GAAG,OAAOC,QAAQ,4BAA4BC,MAAM,6DAC1DpC,KAAKC,S","ignoreList":[]}

package/dist/components/ds-tooltip.js

@@ -1,2 +1,2 @@
-import{p as t,H as s,h as i,a as e,t as o}from"./index.js";import{a as n,T as a}from"./p-jjfqrXnP.js";import{r}from"./p-BWUTr_XN.js";import{r as h}from"./p-C1cBr-Ri.js";const c=()=>`.tooltip-popup.sc-ds-tooltip{box-sizing:border-box;background-color:var(--color-background-primary);border-radius:var(--dimension-radius-075);box-shadow:var(--effect-elevation-elevated-floating);padding:var(--dimension-space-050);white-space:nowrap;animation:tooltipFadeIn var(--effect-motion-short-2) forwards;will-change:transform;backface-visibility:hidden}.tooltip-popup--closing.sc-ds-tooltip{animation:tooltipFadeOut var(--effect-motion-short-3) forwards}.tooltip-inner.sc-ds-tooltip{display:flex;flex-direction:row;align-items:center;gap:var(--dimension-space-050)}.key-hint.sc-ds-tooltip{width:var(--dimension-size-200);height:var(--dimension-size-200);flex-shrink:0;display:flex;align-items:center;justify-content:center;border:var(--dimension-stroke-width-015) solid var(--color-foreground-tertiary);border-bottom-width:var(--dimension-stroke-width-025);border-radius:var(--dimension-radius-025)}@keyframes tooltipFadeIn{from{opacity:0}to{opacity:1}}@keyframes tooltipFadeOut{from{opacity:1}to{opacity:0}}`;let l=0;let d=0;const f=t(class t extends s{constructor(t){super();if(t!==false){this.__registerHost()}this.side="top";this.align="center";this.sideOffset=n.space050;this.alignOffset=0;this.delay=a.animationDelayMedium1;this.shortcutKeyPosition="end";this.visible=false;this.closing=false;this.pos={x:0,y:0};this.tooltipId=`ds-tooltip-${++d}`;this.delayTimer=null;this.closeTimer=null;this.anchor=null;this.tooltipEl=null;this.mouseEnterHandler=()=>this.show();this.mouseLeaveHandler=()=>this.hide();this.focusHandler=()=>this.show();this.blurHandler=()=>this.hide()}componentDidLoad(){this.bindAnchor()}disconnectedCallback(){this.unbindAnchor();this.clearTimers()}onPositionPropsChange(){if(this.visible)this.calculatePosition()}get viewportPadPx(){return r(a.space050,a.space050)}get sideOffsetPx(){return r(this.sideOffset,a.space050)}get alignOffsetPx(){return r(this.alignOffset,0)}get hoverDelayMs(){return h(this.delay,a.animationDelayMedium1)}get instantReopenMs(){return h(a.animationDurationMedium1,a.animationDurationMedium1)}get fadeOutMs(){return h(a.motionShort3,a.animationDurationShort3)}get tooltipFallbackWidthPx(){return r(a.tooltipFallbackWidth,a.tooltipFallbackWidth)}get tooltipFallbackHeightPx(){return r(a.size300,a.size300)}bindAnchor(){const t=this.el.querySelector("slot");const s=t?.assignedElements?.()??[];const i=s[0]??this.el.firstElementChild;if(!i)return;this.anchor=i;i.setAttribute("aria-describedby",this.tooltipId);i.addEventListener("mouseenter",this.mouseEnterHandler);i.addEventListener("mouseleave",this.mouseLeaveHandler);i.addEventListener("focus",this.focusHandler);i.addEventListener("blur",this.blurHandler)}unbindAnchor(){if(!this.anchor)return;this.anchor.removeAttribute("aria-describedby");this.anchor.removeEventListener("mouseenter",this.mouseEnterHandler);this.anchor.removeEventListener("mouseleave",this.mouseLeaveHandler);this.anchor.removeEventListener("focus",this.focusHandler);this.anchor.removeEventListener("blur",this.blurHandler);this.anchor=null}clearTimers(){if(this.delayTimer){clearTimeout(this.delayTimer);this.delayTimer=null}if(this.closeTimer){clearTimeout(this.closeTimer);this.closeTimer=null}}show(){this.clearTimers();const t=Date.now()-l<this.instantReopenMs;if(t){this.closing=false;this.visible=true;requestAnimationFrame((()=>this.calculatePosition()));return}this.delayTimer=setTimeout((()=>{this.delayTimer=null;this.closing=false;this.visible=true;requestAnimationFrame((()=>this.calculatePosition()))}),this.hoverDelayMs)}hide(){this.clearTimers();if(!this.visible)return;l=Date.now();this.closing=true;this.closeTimer=setTimeout((()=>{this.closeTimer=null;this.visible=false;this.closing=false}),this.fadeOutMs)}calculatePosition(){if(!this.anchor)return;const t=this.el.querySelector(".tooltip-popup");if(!t)return;const s=this.anchor.getBoundingClientRect();const i=t.offsetWidth||this.tooltipFallbackWidthPx;const e=t.offsetHeight||this.tooltipFallbackHeightPx;const o=this.sideOffsetPx;const n=this.alignOffsetPx;const a=this.viewportPadPx;let r=0,h=0;switch(this.side){case"top":h=s.top-e-o;r=this.align==="start"?s.left+n:this.align==="end"?s.right-i+n:s.left+s.width/2-i/2+n;break;case"bottom":h=s.bottom+o;r=this.align==="start"?s.left+n:this.align==="end"?s.right-i+n:s.left+s.width/2-i/2+n;break;case"left":r=s.left-i-o;h=this.align==="start"?s.top+n:this.align==="end"?s.bottom-e+n:s.top+s.height/2-e/2+n;break;case"right":r=s.right+o;h=this.align==="start"?s.top+n:this.align==="end"?s.bottom-e+n:s.top+s.height/2-e/2+n;break}this.pos={x:Math.min(Math.max(r,a),window.innerWidth-i-a),y:Math.min(Math.max(h,a),window.innerHeight-e-a)}}render(){return i(e,{key:"8cc138d93c0db5c7e81f76a46d23130d19f53390",style:{display:"contents"}},i("slot",{key:"e340f320d2bf9fb3faa937db059db823c0a006d9"}),(this.visible||this.closing)&&i("div",{key:"fb363c7f47cc1a728e3a7d5c08f90ba49a94c159",id:this.tooltipId,class:{"tooltip-popup":true,"tooltip-popup--closing":this.closing},role:"tooltip",style:{position:"fixed",left:"0",top:"0",transform:`translate(${Math.round(this.pos.x)}px, ${Math.round(this.pos.y)}px)`,zIndex:"10000",pointerEvents:"none"}},i("div",{key:"df672e9205cd391a12123ecc84c0df1a36230b0d",class:"tooltip-inner"},this.shortcutKey&&this.shortcutKeyPosition==="start"&&i("div",{key:"be717d8c84362ee0f48435a3b119424d58920d75",class:"key-hint","aria-hidden":"true"},i("span",{key:"c74411b21fca50e32188177bee8aa92c8caa364a",class:"text-caption-emphasis"},this.shortcutKey)),i("span",{key:"ee9b9c1c07b767a64178a7bc54ec22fcac1f90ad",class:"text-body-small"},this.label),this.shortcutKey&&this.shortcutKeyPosition==="end"&&i("div",{key:"1f1f5450c5bfab3c490ef130ae16ab953a56bcc0",class:"key-hint","aria-hidden":"true"},i("span",{key:"dc8835a2f4337ace7d36032c62695f9b83eede68",class:"text-caption-emphasis"},this.shortcutKey)))))}get el(){return this}static get watchers(){return{label:[{onPositionPropsChange:0}],side:[{onPositionPropsChange:0}],align:[{onPositionPropsChange:0}],sideOffset:[{onPositionPropsChange:0}],alignOffset:[{onPositionPropsChange:0}]}}static get style(){return c()}},[262,"ds-tooltip",{label:[1],side:[1],align:[1],sideOffset:[8,"side-offset"],alignOffset:[8,"align-offset"],delay:[8],shortcutKey:[1,"shortcut-key"],shortcutKeyPosition:[1,"shortcut-key-position"],visible:[32],closing:[32],pos:[32]},undefined,{label:[{onPositionPropsChange:0}],side:[{onPositionPropsChange:0}],align:[{onPositionPropsChange:0}],sideOffset:[{onPositionPropsChange:0}],alignOffset:[{onPositionPropsChange:0}]}]);function p(){if(typeof customElements==="undefined"){return}const t=["ds-tooltip"];t.forEach((t=>{switch(t){case"ds-tooltip":if(!customElements.get(o(t))){customElements.define(o(t),f)}break}}))}p();const u=f;const b=p;export{u as DsTooltip,b as defineCustomElement};
+import{p as t,H as s,h as i,a as e,t as o}from"./index.js";import{a as n,T as a}from"./p-bDf6yBQd.js";import{r}from"./p-BWUTr_XN.js";import{r as h}from"./p-C1cBr-Ri.js";const l=()=>`.tooltip-popup.sc-ds-tooltip{box-sizing:border-box;background-color:var(--color-background-primary);border-radius:var(--dimension-radius-075);box-shadow:var(--effect-elevation-elevated-floating);padding:var(--dimension-space-050);white-space:nowrap;animation:tooltipFadeIn var(--effect-motion-short-2) forwards;will-change:transform;backface-visibility:hidden}.tooltip-popup--closing.sc-ds-tooltip{animation:tooltipFadeOut var(--effect-motion-short-3) forwards}.tooltip-inner.sc-ds-tooltip{display:flex;flex-direction:row;align-items:center;gap:var(--dimension-space-050)}.key-hint.sc-ds-tooltip{width:var(--dimension-size-200);height:var(--dimension-size-200);flex-shrink:0;display:flex;align-items:center;justify-content:center;border:var(--dimension-stroke-width-015) solid var(--color-foreground-tertiary);border-bottom-width:var(--dimension-stroke-width-025);border-radius:var(--dimension-radius-025)}@keyframes tooltipFadeIn{from{opacity:0}to{opacity:1}}@keyframes tooltipFadeOut{from{opacity:1}to{opacity:0}}`;let d=0;let c=0;const f=t(class t extends s{constructor(t){super();if(t!==false){this.__registerHost()}this.side="top";this.align="center";this.sideOffset=n.space050;this.alignOffset=0;this.delay=a.animationDelayMedium1;this.shortcutKeyPosition="end";this.visible=false;this.closing=false;this.pos={x:0,y:0};this.tooltipId=`ds-tooltip-${++c}`;this.delayTimer=null;this.closeTimer=null;this.anchor=null;this.tooltipEl=null;this.mouseEnterHandler=()=>this.show();this.mouseLeaveHandler=()=>this.hide();this.focusHandler=()=>this.show();this.blurHandler=()=>this.hide()}componentDidLoad(){this.bindAnchor()}disconnectedCallback(){this.unbindAnchor();this.clearTimers()}onPositionPropsChange(){if(this.visible)this.calculatePosition()}get viewportPadPx(){return r(a.space050,a.space050)}get sideOffsetPx(){return r(this.sideOffset,a.space050)}get alignOffsetPx(){return r(this.alignOffset,0)}get hoverDelayMs(){return h(this.delay,a.animationDelayMedium1)}get instantReopenMs(){return h(a.animationDurationMedium1,a.animationDurationMedium1)}get fadeOutMs(){return h(a.motionShort3,a.animationDurationShort3)}get tooltipFallbackWidthPx(){return r(a.tooltipFallbackWidth,a.tooltipFallbackWidth)}get tooltipFallbackHeightPx(){return r(a.size300,a.size300)}bindAnchor(){const t=this.el.querySelector("slot");const s=t?.assignedElements?.()??[];const i=s[0]??this.el.firstElementChild;if(!i)return;this.anchor=i;i.setAttribute("aria-describedby",this.tooltipId);i.addEventListener("mouseenter",this.mouseEnterHandler);i.addEventListener("mouseleave",this.mouseLeaveHandler);i.addEventListener("focus",this.focusHandler);i.addEventListener("blur",this.blurHandler)}unbindAnchor(){if(!this.anchor)return;this.anchor.removeAttribute("aria-describedby");this.anchor.removeEventListener("mouseenter",this.mouseEnterHandler);this.anchor.removeEventListener("mouseleave",this.mouseLeaveHandler);this.anchor.removeEventListener("focus",this.focusHandler);this.anchor.removeEventListener("blur",this.blurHandler);this.anchor=null}clearTimers(){if(this.delayTimer){clearTimeout(this.delayTimer);this.delayTimer=null}if(this.closeTimer){clearTimeout(this.closeTimer);this.closeTimer=null}}show(){this.clearTimers();const t=Date.now()-d<this.instantReopenMs;if(t){this.closing=false;this.visible=true;requestAnimationFrame((()=>this.calculatePosition()));return}this.delayTimer=setTimeout((()=>{this.delayTimer=null;this.closing=false;this.visible=true;requestAnimationFrame((()=>this.calculatePosition()))}),this.hoverDelayMs)}hide(){this.clearTimers();if(!this.visible)return;d=Date.now();this.closing=true;this.closeTimer=setTimeout((()=>{this.closeTimer=null;this.visible=false;this.closing=false}),this.fadeOutMs)}calculatePosition(){if(!this.anchor)return;const t=this.el.querySelector(".tooltip-popup");if(!t)return;const s=this.anchor.getBoundingClientRect();const i=t.offsetWidth||this.tooltipFallbackWidthPx;const e=t.offsetHeight||this.tooltipFallbackHeightPx;const o=this.sideOffsetPx;const n=this.alignOffsetPx;const a=this.viewportPadPx;let r=0,h=0;switch(this.side){case"top":h=s.top-e-o;r=this.align==="start"?s.left+n:this.align==="end"?s.right-i+n:s.left+s.width/2-i/2+n;break;case"bottom":h=s.bottom+o;r=this.align==="start"?s.left+n:this.align==="end"?s.right-i+n:s.left+s.width/2-i/2+n;break;case"left":r=s.left-i-o;h=this.align==="start"?s.top+n:this.align==="end"?s.bottom-e+n:s.top+s.height/2-e/2+n;break;case"right":r=s.right+o;h=this.align==="start"?s.top+n:this.align==="end"?s.bottom-e+n:s.top+s.height/2-e/2+n;break}this.pos={x:Math.min(Math.max(r,a),window.innerWidth-i-a),y:Math.min(Math.max(h,a),window.innerHeight-e-a)}}render(){return i(e,{key:"fd85f1f6dbc8e2698aaeada0259fe1a931125cde",style:{display:"contents"}},i("slot",{key:"9fd3c7672bfae857f9de748b03192e89badead97"}),(this.visible||this.closing)&&i("div",{key:"81a80ccf657bd2769136f498fe1d02387a891bce",id:this.tooltipId,class:{"tooltip-popup":true,"tooltip-popup--closing":this.closing},role:"tooltip",style:{position:"fixed",left:"0",top:"0",transform:`translate(${Math.round(this.pos.x)}px, ${Math.round(this.pos.y)}px)`,zIndex:"10000",pointerEvents:"none"}},i("div",{key:"f44ae6bde548c09e7681442cd70e838c5604c5f0",class:"tooltip-inner"},this.shortcutKey&&this.shortcutKeyPosition==="start"&&i("div",{key:"f51776f5339d26596ce2e355b7c96b7d13b22a9a",class:"key-hint","aria-hidden":"true"},i("span",{key:"ca55765544a9378d63d30b02b4ce511de3de8474",class:"text-caption-emphasis"},this.shortcutKey)),i("span",{key:"2139c28413ba1ad5fae5526cf453ce4aea23095e",class:"text-body-small"},this.label),this.shortcutKey&&this.shortcutKeyPosition==="end"&&i("div",{key:"65470aa0f46da9768dcbf50844ea7807d7189f2f",class:"key-hint","aria-hidden":"true"},i("span",{key:"d50f2576c3dec83f0a7e1c7d8e92966df9a0fcab",class:"text-caption-emphasis"},this.shortcutKey)))))}get el(){return this}static get watchers(){return{label:[{onPositionPropsChange:0}],side:[{onPositionPropsChange:0}],align:[{onPositionPropsChange:0}],sideOffset:[{onPositionPropsChange:0}],alignOffset:[{onPositionPropsChange:0}]}}static get style(){return l()}},[262,"ds-tooltip",{label:[1],side:[1],align:[1],sideOffset:[8,"side-offset"],alignOffset:[8,"align-offset"],delay:[8],shortcutKey:[1,"shortcut-key"],shortcutKeyPosition:[1,"shortcut-key-position"],visible:[32],closing:[32],pos:[32]},undefined,{label:[{onPositionPropsChange:0}],side:[{onPositionPropsChange:0}],align:[{onPositionPropsChange:0}],sideOffset:[{onPositionPropsChange:0}],alignOffset:[{onPositionPropsChange:0}]}]);function p(){if(typeof customElements==="undefined"){return}const t=["ds-tooltip"];t.forEach((t=>{switch(t){case"ds-tooltip":if(!customElements.get(o(t))){customElements.define(o(t),f)}break}}))}p();const u=f;const m=p;export{u as DsTooltip,m as defineCustomElement};
 //# sourceMappingURL=ds-tooltip.js.map