@ds-mo/ui 2.8.0 → 2.10.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (143) hide show
  1. package/README.md +8 -9
  2. package/dist/.build-stamp +1 -1
  3. package/dist/components/ds-app-shell.js +1 -1
  4. package/dist/components/ds-badge.js +1 -1
  5. package/dist/components/ds-banner.js +1 -1
  6. package/dist/components/ds-bar-nav.js +1 -1
  7. package/dist/components/{ds-toggle-button.d.ts → ds-button-filled.d.ts} +4 -4
  8. package/dist/components/ds-button-filled.js +2 -0
  9. package/dist/components/ds-button-unfilled-icon.js +1 -1
  10. package/dist/components/{ds-button-group.d.ts → ds-card-setting.d.ts} +4 -4
  11. package/dist/components/ds-card-setting.js +2 -0
  12. package/dist/components/ds-card-setting.js.map +1 -0
  13. package/dist/components/ds-card.js +1 -1
  14. package/dist/components/ds-checkbox.js +1 -1
  15. package/dist/components/ds-chip.js +1 -1
  16. package/dist/components/ds-divider.js +1 -1
  17. package/dist/components/ds-empty-state.js +1 -1
  18. package/dist/components/ds-empty-state.js.map +1 -1
  19. package/dist/components/ds-fade.js +1 -1
  20. package/dist/components/ds-field.js +1 -1
  21. package/dist/components/ds-field.js.map +1 -1
  22. package/dist/components/ds-header.js +1 -1
  23. package/dist/components/ds-icon.js +1 -1
  24. package/dist/components/ds-input.js +1 -1
  25. package/dist/components/ds-loader.js +1 -1
  26. package/dist/components/ds-loader.js.map +1 -1
  27. package/dist/components/ds-menu.js +1 -1
  28. package/dist/components/ds-modal.js +1 -1
  29. package/dist/components/ds-panel-nav.js +1 -1
  30. package/dist/components/ds-panel-tools.js +1 -1
  31. package/dist/components/ds-panel-tools.js.map +1 -1
  32. package/dist/components/ds-radio-group.js +1 -1
  33. package/dist/components/ds-scrollbar.js +1 -1
  34. package/dist/components/ds-select.js +1 -1
  35. package/dist/components/ds-shell-gradient-picker.js +1 -1
  36. package/dist/components/ds-shell-gradient-swatch.js +1 -1
  37. package/dist/components/ds-slider.js +1 -1
  38. package/dist/components/ds-surface.js +1 -1
  39. package/dist/components/ds-tab-group-nav.js +1 -1
  40. package/dist/components/ds-tab-group.js +1 -1
  41. package/dist/components/ds-table.js +1 -1
  42. package/dist/components/ds-table.js.map +1 -1
  43. package/dist/components/ds-tag.js +1 -1
  44. package/dist/components/ds-text.js +1 -1
  45. package/dist/components/ds-toast-provider.js +1 -1
  46. package/dist/components/ds-toggle.js +1 -1
  47. package/dist/components/ds-tooltip.js +1 -1
  48. package/dist/components/ds-tooltip.js.map +1 -1
  49. package/dist/components/{p-g6MCxfm4.js → p-BFPfyJ8Z.js} +1 -1
  50. package/dist/components/p-BFPfyJ8Z.js.map +1 -0
  51. package/dist/components/{p-CiEc8Nwx.js → p-BOpHKDOG.js} +2 -2
  52. package/dist/components/p-BOpHKDOG.js.map +1 -0
  53. package/dist/components/{p-DvBrQuie.js → p-CDNVPM2x.js} +2 -2
  54. package/dist/components/{p-C9za7IDu.js → p-CJubWt1F.js} +2 -2
  55. package/dist/components/{p-DDEAcGac.js → p-CKCBqwIw.js} +2 -2
  56. package/dist/components/{p-DDEAcGac.js.map → p-CKCBqwIw.js.map} +1 -1
  57. package/dist/components/p-Cynjsv-P.js +2 -0
  58. package/dist/components/p-Cynjsv-P.js.map +1 -0
  59. package/dist/components/{p-B3ua1NkM.js → p-DnGr8qtq.js} +2 -2
  60. package/dist/components/p-Dul5eGGE.js +2 -0
  61. package/dist/components/p-Dul5eGGE.js.map +1 -0
  62. package/dist/components/{p-D4zKc1RW.js → p-evjnuLjj.js} +2 -2
  63. package/dist/components/p-jjfqrXnP.js +2 -0
  64. package/dist/components/p-jjfqrXnP.js.map +1 -0
  65. package/dist/components/p-w2Wrf0jC.js +2 -0
  66. package/dist/components/p-w2Wrf0jC.js.map +1 -0
  67. package/dist/types/components/Badge/Badge.d.ts +5 -1
  68. package/dist/types/components/ButtonFilled/ButtonFilled.d.ts +26 -0
  69. package/dist/types/components/ButtonFilled/index.d.ts +2 -0
  70. package/dist/types/components/ButtonUnfilledIcon/ButtonUnfilledIcon.d.ts +9 -2
  71. package/dist/types/components/ButtonUnfilledIcon/index.d.ts +1 -1
  72. package/dist/types/components/CardSetting/CardSetting.d.ts +16 -0
  73. package/dist/types/components/CardSetting/index.d.ts +2 -0
  74. package/dist/types/components/Icon/Icon.d.ts +14 -1
  75. package/dist/types/components/Icon/flag-icon-catalog.d.ts +2 -1
  76. package/dist/types/components/Icon/icon-cache.d.ts +25 -0
  77. package/dist/types/components/Icon/icon-svg.d.ts +26 -0
  78. package/dist/types/components/Icon/system-icon-catalog.d.ts +2 -1
  79. package/dist/types/components.d.ts +129 -414
  80. package/dist/types/utils/index.d.ts +1 -0
  81. package/package.json +2 -2
  82. package/src/angular/index.ts +2 -4
  83. package/src/angular/proxies.ts +40 -105
  84. package/src/react/components.ts +2 -4
  85. package/src/react/ds-button-filled.ts +27 -0
  86. package/src/react/ds-card-setting.ts +27 -0
  87. package/src/wc/components/Badge/Badge.tsx +6 -2
  88. package/src/wc/components/ButtonFilled/ButtonFilled.tsx +86 -0
  89. package/src/wc/components/ButtonFilled/index.ts +1 -0
  90. package/src/wc/components/ButtonUnfilledIcon/ButtonUnfilledIcon.tsx +19 -11
  91. package/src/wc/components/ButtonUnfilledIcon/index.ts +1 -1
  92. package/src/wc/components/CardSetting/CardSetting.tsx +96 -0
  93. package/src/wc/components/CardSetting/index.ts +1 -0
  94. package/src/wc/components/Icon/Icon.tsx +82 -22
  95. package/src/wc/components/Icon/flag-icon-catalog.ts +33 -65
  96. package/src/wc/components/Icon/icon-cache.ts +47 -0
  97. package/src/wc/components/Icon/icon-svg.ts +73 -0
  98. package/src/wc/components/Icon/system-icon-catalog.ts +398 -795
  99. package/src/wc/components.d.ts +129 -414
  100. package/src/wc/nav/badge-gradient-ring.ts +4 -1
  101. package/src/wc/utils/index.ts +1 -0
  102. package/dist/components/ds-button-group.js +0 -2
  103. package/dist/components/ds-button-group.js.map +0 -1
  104. package/dist/components/ds-button.d.ts +0 -11
  105. package/dist/components/ds-button.js +0 -2
  106. package/dist/components/ds-toggle-button-group.d.ts +0 -11
  107. package/dist/components/ds-toggle-button-group.js +0 -2
  108. package/dist/components/ds-toggle-button-group.js.map +0 -1
  109. package/dist/components/ds-toggle-button.js +0 -2
  110. package/dist/components/ds-toggle-button.js.map +0 -1
  111. package/dist/components/p-BPMJx63I.js +0 -2
  112. package/dist/components/p-BPMJx63I.js.map +0 -1
  113. package/dist/components/p-BTndnbR_.js +0 -2
  114. package/dist/components/p-BTndnbR_.js.map +0 -1
  115. package/dist/components/p-C0CUGiLm.js +0 -2
  116. package/dist/components/p-C0CUGiLm.js.map +0 -1
  117. package/dist/components/p-CiEc8Nwx.js.map +0 -1
  118. package/dist/components/p-DUDppafq.js +0 -2
  119. package/dist/components/p-DUDppafq.js.map +0 -1
  120. package/dist/components/p-DgDSRPSP.js +0 -2
  121. package/dist/components/p-DgDSRPSP.js.map +0 -1
  122. package/dist/components/p-DqBCQRRd.js +0 -2
  123. package/dist/components/p-DqBCQRRd.js.map +0 -1
  124. package/dist/components/p-g6MCxfm4.js.map +0 -1
  125. package/dist/types/components/Button/Button.d.ts +0 -38
  126. package/dist/types/components/Button/index.d.ts +0 -2
  127. package/dist/types/components/ButtonGroup/ButtonGroup.d.ts +0 -29
  128. package/dist/types/components/ToggleButton/ToggleButton.d.ts +0 -37
  129. package/dist/types/components/ToggleButtonGroup/ToggleButtonGroup.d.ts +0 -33
  130. package/src/react/ds-button-group.ts +0 -27
  131. package/src/react/ds-button.ts +0 -35
  132. package/src/react/ds-toggle-button-group.ts +0 -27
  133. package/src/react/ds-toggle-button.ts +0 -27
  134. package/src/wc/components/Button/Button.tsx +0 -158
  135. package/src/wc/components/Button/index.ts +0 -1
  136. package/src/wc/components/ButtonGroup/ButtonGroup.tsx +0 -110
  137. package/src/wc/components/ToggleButton/ToggleButton.tsx +0 -124
  138. package/src/wc/components/ToggleButtonGroup/ToggleButtonGroup.tsx +0 -118
  139. /package/dist/components/{ds-button.js.map → ds-button-filled.js.map} +0 -0
  140. /package/dist/components/{p-DvBrQuie.js.map → p-CDNVPM2x.js.map} +0 -0
  141. /package/dist/components/{p-C9za7IDu.js.map → p-CJubWt1F.js.map} +0 -0
  142. /package/dist/components/{p-B3ua1NkM.js.map → p-DnGr8qtq.js.map} +0 -0
  143. /package/dist/components/{p-D4zKc1RW.js.map → p-evjnuLjj.js.map} +0 -0
package/dist/components/ds-slider.js CHANGED
@@ -1,2 +1,2 @@
1
- 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:"f816252ffb1e6db62aa5d17cc49f0c33f2852021",class:"field"},t("div",{key:"7d408ed26f125be62a2a5634c036d4435bfdd199",class:"label-row"},t("label",{key:"02f2c40b8cca197509db45c6d4564a613de674b9",class:"text-body-small-emphasis",htmlFor:e},this.label),t("span",{key:"f203a075cb20ded1340e2a67befad3a710d5f843",class:"text-body-small-emphasis"},this.value)),t("div",{key:"e6cfe5405397f89f17932c8c37b815223d99f267",class:{track:true,"track--inactive":this.inactive,"track--at-min":s===0},style:{"--slider-pct":String(s)}},t("div",{key:"bc0fe6acbfab16c960a69af50d988af2d62d7875",class:"track-inner"},t("div",{key:"1eac9c67734333422dec80eb46ed3b8abdca8989",class:"fill-track"},t("div",{key:"9b5c8a545f3bca188369161c9c8034cf67c00af9",class:"fill"})),t("div",{key:"cd82afbf8360bd00d8e3579e5e822903c2444565",class:"thumb"})),t("input",{key:"1e53154fd4090ec03eb6d7e362340105442bc4e2",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};
1
+ import{p as e,H as s,c as i,h as t,a,t as r}from"./index.js";const d=()=>`.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 n=0;const o=e(class e extends s{constructor(e){super();if(e!==false){this.__registerHost()}this.dsChange=i(this,"dsChange");this.generatedId=`ds-slider-${++n}`;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:"0103ea55297b4027b0d49adf3c83db970ef308be",class:"field"},t("div",{key:"1d4de1ad37f6558c6a59d806507637e2cb6a4140",class:"label-row"},t("label",{key:"3d838e9559d0536b9d08ce0eb8f968ffce92448d",class:"text-body-small-emphasis",htmlFor:e},this.label),t("span",{key:"5162ed48d6007e6d93285f0dd8fc8cccfa8a9c7b",class:"text-body-small-emphasis"},this.value)),t("div",{key:"cabda7cc6c988d6097fe4ca0441d9dfc561289c5",class:{track:true,"track--inactive":this.inactive,"track--at-min":s===0},style:{"--slider-pct":String(s)}},t("div",{key:"b7d1eb8f73d424a2e380b8f2c31ae031ef0371b8",class:"track-inner"},t("div",{key:"222306d54a1fbadedb124973dd642f091478991d",class:"fill-track"},t("div",{key:"062e67848bbfcf0bf0cfec1441aa8c2d012d2d36",class:"fill"})),t("div",{key:"ed1ac5800e99d90c90df071312ff1cdd489cb642",class:"thumb"})),t("input",{key:"a2cb5727b75abd1aa65b4f4ede00a862e073b2b3",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 d()}},[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),o)}break}}))}c();const l=o;const b=c;export{l as DsSlider,b as defineCustomElement};
2
2
  //# sourceMappingURL=ds-slider.js.map
package/dist/components/ds-surface.js CHANGED
@@ -1,2 +1,2 @@
1
- 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:"3cc20c0461b6ab8f72027e54d0a892e2b07e865b",style:{display:"contents"}},e(r,{key:"68242542c50b716f70270228e4c765deb3cb13c0",class:i,style:d?{borderRadius:d}:undefined},e("slot",{key:"c549384e937aa6c80ec0fe3a039ad038436cd0d8"})))}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};
1
+ 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:"39af4fc8292a6a849da72e8fbe130831610eb92c",style:{display:"contents"}},e(r,{key:"5e5dcf15df0164dc3ce356c5c6a55e09a19d73c6",class:i,style:d?{borderRadius:d}:undefined},e("slot",{key:"cb7e54df6d3bd8d0fdcec5537b293e4878a170a7"})))}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};
2
2
  //# sourceMappingURL=ds-surface.js.map
package/dist/components/ds-tab-group-nav.js CHANGED
@@ -1,2 +1,2 @@
1
- import{T as o,d as s}from"./p-D4zKc1RW.js";const t=o;const c=s;export{t as DsTabGroupNav,c as defineCustomElement};
1
+ import{T as o,d as s}from"./p-evjnuLjj.js";const j=o;const t=s;export{j as DsTabGroupNav,t as defineCustomElement};
2
2
  //# sourceMappingURL=ds-tab-group-nav.js.map
package/dist/components/ds-tab-group.js CHANGED
@@ -1,2 +1,2 @@
1
- import{p as r,H as o,c as e,h as t,a as s,t as a}from"./index.js";import{g as i,i as n}from"./p-BQq26pt9.js";import{d}from"./p-CiEc8Nwx.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=e(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 e=o.getAttribute("data-tab-id");if(e===r)return;const t=this.el.querySelector(`[data-tab-id="${r}"]`);if(t){t.focus({preventScroll:true})}else{o.blur()}}))}findEnabled(r,o){const e=this.selectableTabs;const t=e.length;for(let s=0;s<t;s++){const a=(r+o*(s+1)+t*(s+1))%t;if(!e[a]?.disabled)return a}return r}handleKeyDown(r){const o=this.selectableTabs;if(!o.length)return;const e=o.findIndex((r=>r.id===this.value));const t=this.orientation==="vertical";let s=null;if(!t){if(r.key==="ArrowRight"){s=this.findEnabled(e,1)}else if(r.key==="ArrowLeft"){s=this.findEnabled(e,-1)}}else{if(r.key==="ArrowDown"){s=this.findEnabled(e,1)}else if(r.key==="ArrowUp"){s=this.findEnabled(e,-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 e=o[s];this.selectTab(e.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 t(s,{key:"3169bbef555225fc37eebbc55efac726b2def9c6",class:"tab-group-host"},t("div",{key:"18770a26e5ebfd75e95dda95548a67b2d32e61b6",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(((e,s)=>{if(n(e)){return t("div",{key:`divider-${s}`,class:{"tab-divider":true,"tab-divider--vertical":o},"aria-hidden":"true"},t("div",{class:"tab-divider__line"}))}const a=e.id===this.value;return t("button",{key:e.id,type:"button",role:"tab","data-tab-id":e.id,class:{tab:true,"tab--selected":a,"ds-focus-ring-inset":true,[r]:!!r},"aria-selected":a,"aria-disabled":e.disabled||undefined,"aria-controls":e.panelId??undefined,disabled:e.disabled,tabIndex:a?0:-1,onClick:()=>!e.disabled&&this.selectTab(e.id)},t("span",{class:{tab__label:true,"tab__label--dot":!!e.dot,[a?"text-body-small-emphasis":"text-body-small"]:true}},e.label,e.dot&&t("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};
1
+ import{p as r,H as o,c as e,h as t,a as s,t as a}from"./index.js";import{g as i,i as n}from"./p-BQq26pt9.js";import{d}from"./p-BOpHKDOG.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=e(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 e=o.getAttribute("data-tab-id");if(e===r)return;const t=this.el.querySelector(`[data-tab-id="${r}"]`);if(t){t.focus({preventScroll:true})}else{o.blur()}}))}findEnabled(r,o){const e=this.selectableTabs;const t=e.length;for(let s=0;s<t;s++){const a=(r+o*(s+1)+t*(s+1))%t;if(!e[a]?.disabled)return a}return r}handleKeyDown(r){const o=this.selectableTabs;if(!o.length)return;const e=o.findIndex((r=>r.id===this.value));const t=this.orientation==="vertical";let s=null;if(!t){if(r.key==="ArrowRight"){s=this.findEnabled(e,1)}else if(r.key==="ArrowLeft"){s=this.findEnabled(e,-1)}}else{if(r.key==="ArrowDown"){s=this.findEnabled(e,1)}else if(r.key==="ArrowUp"){s=this.findEnabled(e,-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 e=o[s];this.selectTab(e.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 t(s,{key:"ee5c6f1eb19954a412dde51849f7ea885ddce476",class:"tab-group-host"},t("div",{key:"6c8d936b7c08ad0c88f7c14bb57b483eefc02b0b",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(((e,s)=>{if(n(e)){return t("div",{key:`divider-${s}`,class:{"tab-divider":true,"tab-divider--vertical":o},"aria-hidden":"true"},t("div",{class:"tab-divider__line"}))}const a=e.id===this.value;return t("button",{key:e.id,type:"button",role:"tab","data-tab-id":e.id,class:{tab:true,"tab--selected":a,"ds-focus-ring-inset":true,[r]:!!r},"aria-selected":a,"aria-disabled":e.disabled||undefined,"aria-controls":e.panelId??undefined,disabled:e.disabled,tabIndex:a?0:-1,onClick:()=>!e.disabled&&this.selectTab(e.id)},t("span",{class:{tab__label:true,"tab__label--dot":!!e.dot,[a?"text-body-small-emphasis":"text-body-small"]:true}},e.label,e.dot&&t("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};
2
2
  //# sourceMappingURL=ds-tab-group.js.map
package/dist/components/ds-table.js CHANGED
@@ -1,2 +1,2 @@
1
- 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 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:a}=this;const i=!a&&t.length===0;const c=this.selectedSet;const d=this.activeSort;const l=this.pageIndex!==undefined&&s>1;return r(o,{key:"3a6f54941387df28c74b14257f035ac93652cdcf"},r("div",{key:"b2a1045a5fd174003966645650553420475058ce",class:"table-wrapper","aria-busy":a||undefined},r("div",{key:"6d7fbb6febbe6f05359d9ad6189f8866490eee7b",class:"table-scroll"},r("div",{key:"f03574dadee96f7dfb372e3ddd34fe717b1ae563",class:"table",style:{gridTemplateColumns:this.gridTemplate},role:"table"},r("div",{key:"e794dfab96958e0293e6a6e47beb72e7857f1b4f",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"?"↑":"↓"))}))),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:"04a5fccc576f7ff871bba1af5412185d6fe87560",class:"empty-row",style:{gridColumn:"1 / -1"}},r("p",{key:"4cdc75986020faa5d56f8d4a2fec48574ae559ab",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)??""))))))})))),l&&r("div",{key:"680b51162c40d53584a8f7ebef26b7e9e8639141",class:"table-pagination"},r("button",{key:"772753be9b892d6997f417328e075cad6b65556c",type:"button",class:"page-button",disabled:this.pageIndex===0,onClick:()=>{this.pageIndex=this.pageIndex-1;this.dsPageChange.emit({pageIndex:this.pageIndex})}},r("span",{key:"3b9794aaa972110d36d771828b6ea3f28d807316",class:"text-body-small"},"Previous")),r("span",{key:"f3c76d397aafc3b9d16234add0651c2edf49a785",class:"text-body-small",style:{color:"var(--color-foreground-secondary)"}},"Page ",this.pageIndex+1," of ",s),r("button",{key:"766f8392e26416c51b7487277cd1de1dc4f044d8",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:"1f57b737f018e9c7e8cc951a70cef2de879ce980",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(a(e))){customElements.define(a(e),d)}break}}))}l();const b=d;const u=l;export{b as DsTable,u as defineCustomElement};
1
+ 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:"aa2fefadc490201e7d744e47d1e9d8f27037cd02"},r("div",{key:"44d3ed87a124c83e2dcb5d9af097ec338acb8e31",class:"table-wrapper","aria-busy":o||undefined},r("div",{key:"9d2e741670f9224bca313e2dd5c195a4f1489150",class:"table-scroll"},r("div",{key:"466541f998b43258af996c12c85c51602c8eabb7",class:"table",style:{gridTemplateColumns:this.gridTemplate},role:"table"},r("div",{key:"fd8bb07849d6f1f6f514f2b7d20b8f131f05c60a",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:"f2589a72d13ac49c0cf4e5a992675e6fca93a947",class:"empty-row",style:{gridColumn:"1 / -1"}},r("p",{key:"de359c74425b67c22a446f75d7b71cb57e5089fc",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:"35a16e34865daeb3f30ba09b3700fd81ffb92a04",class:"table-pagination"},r("button",{key:"a02f9ea5e3956abf24d76319f42bc8c9c2e66532",type:"button",class:"page-button",disabled:this.pageIndex===0,onClick:()=>{this.pageIndex=this.pageIndex-1;this.dsPageChange.emit({pageIndex:this.pageIndex})}},r("span",{key:"6d02dce0c77c971eedbc5d7f5502abcebb63f476",class:"text-body-small"},"Previous")),r("span",{key:"91526793d4030dcc1a51a22d6e9a40a3a64f1cbe",class:"text-body-small",style:{color:"var(--color-foreground-secondary)"}},"Page ",this.pageIndex+1," of ",s),r("button",{key:"65e163a77045e4fca9fcd28b2f803630820f75cc",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:"7b910652314404cf90a1955c9e5779a452e4fd84",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};
2
2
  //# sourceMappingURL=ds-table.js.map
package/dist/components/ds-table.js.map CHANGED
@@ -1 +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":[]}
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":[]}
package/dist/components/ds-tag.js CHANGED
@@ -1,2 +1,2 @@
1
- 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:"d5c777ec3519ed046726786baaf17c5ae182ca79",class:s,style:e},a("span",{key:"e58349b3de4bd3d156acf983419d0ff512c6ba80",class:"tag__icon-slot",style:{fontSize:`${n}px`,lineHeight:"0"}},a("slot",{key:"1a52344b42849ae9c731837e243787b9cfd299c9",name:"icon"})),a("span",{key:"1d27c3345d0608bfb1d2a50e4c57e4ff4a24d3c4",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};
1
+ 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:"4761fb9b76c34fd1cce55a4675302eb2ad527d8c",class:s,style:e},a("span",{key:"42a35b7b1f2b8edafa56835d63d7b2c1835360e0",class:"tag__icon-slot",style:{fontSize:`${n}px`,lineHeight:"0"}},a("slot",{key:"090eeadf7150e134e0533f5bea55e228d95148b7",name:"icon"})),a("span",{key:"431375e761dad9eb26db3cb15ea13b211b5d81d4",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};
2
2
  //# sourceMappingURL=ds-tag.js.map
package/dist/components/ds-text.js CHANGED
@@ -1,2 +1,2 @@
1
- import{T as o,d as s}from"./p-C9za7IDu.js";const t=o;const a=s;export{t as DsText,a as defineCustomElement};
1
+ import{T as o,d as s}from"./p-CJubWt1F.js";const t=o;const p=s;export{t as DsText,p as defineCustomElement};
2
2
  //# sourceMappingURL=ds-text.js.map
package/dist/components/ds-toast-provider.js CHANGED
@@ -1,2 +1,2 @@
1
- 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-BPMJx63I.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 p(){return n(r.animationDelayLong2,r.animationDelayLong2)}const f={show(t){const e=`ds-toast-${++c}`;const s=t.duration??p();a=[...a,{id:e,intent:"neutral",...t,duration:s}];l();return e},success(t,e){return f.show({message:t,intent:"positive",...e})},error(t,e){return f.show({message:t,intent:"negative",...e})},warning(t,e){return f.show({message:t,intent:"warning",...e})},info(t,e){return f.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));f.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:"37887db881a0b206d6bff33f1ad28f0a7bc82cdd",style:{display:"contents"}},s("div",{key:"43e4508819f149d4696466c3b65722b465e08229",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 x=b;const y=v;export{x as DsToastProvider,y as defineCustomElement};
1
+ 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 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:"a35254ca7009ecbb3f3c159becf4c91438bcbfa4",style:{display:"contents"}},s("div",{key:"e91c4c6633f76e3b2748f91971ede39bc8ff38da",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 x=b;const y=v;export{x as DsToastProvider,y as defineCustomElement};
2
2
  //# sourceMappingURL=ds-toast-provider.js.map
package/dist/components/ds-toggle.js CHANGED
@@ -1,2 +1,2 @@
1
- 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:"79d42c85719902f19c4d4c326af7a275c7166e0f",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:"35f42e01489ecf5292b0536bd18e851a9e67da8c",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};
1
+ 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:"a8e22d676be8eaaa9d42b67a7d1d77e05f8aede9",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:"f963c1c2e7992c517f06b5368e6b7b553cf04cd2",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};
2
2
  //# sourceMappingURL=ds-toggle.js.map
package/dist/components/ds-tooltip.js CHANGED
@@ -1,2 +1,2 @@
1
- import{p as t,H as s,h as i,a as e,t as o}from"./index.js";import{a,T as n}from"./p-BPMJx63I.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 c=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=a.space050;this.alignOffset=0;this.delay=n.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(n.space050,n.space050)}get sideOffsetPx(){return r(this.sideOffset,n.space050)}get alignOffsetPx(){return r(this.alignOffset,0)}get hoverDelayMs(){return h(this.delay,n.animationDelayMedium1)}get instantReopenMs(){return h(n.animationDurationMedium1,n.animationDurationMedium1)}get fadeOutMs(){return h(n.motionShort3,n.animationDurationShort3)}get tooltipFallbackWidthPx(){return r(n.tooltipFallbackWidth,n.tooltipFallbackWidth)}get tooltipFallbackHeightPx(){return r(n.size300,n.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()-c<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;c=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 a=this.alignOffsetPx;const n=this.viewportPadPx;let r=0,h=0;switch(this.side){case"top":h=s.top-e-o;r=this.align==="start"?s.left+a:this.align==="end"?s.right-i+a:s.left+s.width/2-i/2+a;break;case"bottom":h=s.bottom+o;r=this.align==="start"?s.left+a:this.align==="end"?s.right-i+a:s.left+s.width/2-i/2+a;break;case"left":r=s.left-i-o;h=this.align==="start"?s.top+a:this.align==="end"?s.bottom-e+a:s.top+s.height/2-e/2+a;break;case"right":r=s.right+o;h=this.align==="start"?s.top+a:this.align==="end"?s.bottom-e+a:s.top+s.height/2-e/2+a;break}this.pos={x:Math.min(Math.max(r,n),window.innerWidth-i-n),y:Math.min(Math.max(h,n),window.innerHeight-e-n)}}render(){return i(e,{key:"8b74aa4f9a9a3a47a4dd41c7d6cde6096cee3f32",style:{display:"contents"}},i("slot",{key:"5a56a969e621ca75e5d79d1516bfccc5dcab2158"}),(this.visible||this.closing)&&i("div",{key:"c1c442aa19bf6a4b89a3b10a549fa4e30f2a1ff1",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:"54a012f64b0c1895b94381324d0dc95711b6cdab",class:"tooltip-inner"},this.shortcutKey&&this.shortcutKeyPosition==="start"&&i("div",{key:"604d87ec5681a2f106258bd70d78eb8f9379e55e",class:"key-hint","aria-hidden":"true"},i("span",{key:"984193e08719e2493d9a5cd019c4b64fbbad1e14",class:"text-caption-emphasis"},this.shortcutKey)),i("span",{key:"8054dff3ca01248e810f93ebad1fcc375f5d25ea",class:"text-body-small"},this.label),this.shortcutKey&&this.shortcutKeyPosition==="end"&&i("div",{key:"54e0c710a3df9d12377266a8e12e8f7440548ae0",class:"key-hint","aria-hidden":"true"},i("span",{key:"12169ef64adc9f9c8ec304a7fcac1a18ab51bcb6",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 b=p;export{u as DsTooltip,b as defineCustomElement};
1
+ 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:"181d37eabe90777943f08cbc90a3872ccd9fa74d",style:{display:"contents"}},i("slot",{key:"9bf7b0fb206c28ac2b7e414e7d50edccc37456fe"}),(this.visible||this.closing)&&i("div",{key:"cacc838a5f6349b223b123f17430a0548c1d269e",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:"cfcf694a684ab13ead06fbd4be5da14b6ee4b4a6",class:"tooltip-inner"},this.shortcutKey&&this.shortcutKeyPosition==="start"&&i("div",{key:"20c479385ede9bb7f1b6f892e168de9443e76c70",class:"key-hint","aria-hidden":"true"},i("span",{key:"c1c6639f3201ce4f03ce1decf362e7c2c75c12cc",class:"text-caption-emphasis"},this.shortcutKey)),i("span",{key:"5c035523a5ebfb37e5fd5470600dea953626659e",class:"text-body-small"},this.label),this.shortcutKey&&this.shortcutKeyPosition==="end"&&i("div",{key:"44abe4f3f927ce54445ba8ce51925ac80f7d8a61",class:"key-hint","aria-hidden":"true"},i("span",{key:"3f4d6b1444f1a57498f30fcf024f6c79fd963d1a",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};
2
2
  //# sourceMappingURL=ds-tooltip.js.map
package/dist/components/ds-tooltip.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"names":["tooltipCss","lastDismissedAt","tooltipIdCounter","Tooltip","__stencil_proxyCustomElement","HTMLElement","constructor","registerHost","this","side","align","sideOffset","TOKEN_CSS_LENGTHS","space050","alignOffset","delay","TOKEN_DEFAULTS","animationDelayMedium1","shortcutKeyPosition","visible","closing","pos","x","y","tooltipId","delayTimer","closeTimer","anchor","tooltipEl","mouseEnterHandler","show","mouseLeaveHandler","hide","focusHandler","blurHandler","componentDidLoad","bindAnchor","disconnectedCallback","unbindAnchor","clearTimers","onPositionPropsChange","calculatePosition","viewportPadPx","resolveCssLengthPx","sideOffsetPx","alignOffsetPx","hoverDelayMs","resolveCssTimeMs","instantReopenMs","animationDurationMedium1","fadeOutMs","motionShort3","animationDurationShort3","tooltipFallbackWidthPx","tooltipFallbackWidth","tooltipFallbackHeightPx","size300","slot","el","querySelector","slotted","assignedElements","child","firstElementChild","setAttribute","addEventListener","removeAttribute","removeEventListener","clearTimeout","instant","Date","now","requestAnimationFrame","setTimeout","tip","a","getBoundingClientRect","tw","offsetWidth","th","offsetHeight","vpPad","top","left","right","width","bottom","height","Math","min","max","window","innerWidth","innerHeight","render","h","Host","key","style","display","id","class","role","position","transform","round","zIndex","pointerEvents","shortcutKey","label"],"sources":["src/wc/components/Tooltip/Tooltip.css?tag=ds-tooltip&encapsulation=scoped","src/wc/components/Tooltip/Tooltip.tsx"],"sourcesContent":[".tooltip-popup {\n box-sizing: border-box;\n background-color: var(--color-background-primary);\n border-radius: var(--dimension-radius-075);\n box-shadow: var(--effect-elevation-elevated-floating);\n padding: var(--dimension-space-050);\n white-space: nowrap;\n animation: tooltipFadeIn var(--effect-motion-short-2) forwards;\n will-change: transform;\n backface-visibility: hidden;\n}\n\n.tooltip-popup--closing {\n animation: tooltipFadeOut var(--effect-motion-short-3) forwards;\n}\n\n.tooltip-inner {\n display: flex;\n flex-direction: row;\n align-items: center;\n gap: var(--dimension-space-050);\n}\n\n.key-hint {\n width: var(--dimension-size-200);\n height: var(--dimension-size-200);\n flex-shrink: 0;\n display: flex;\n align-items: center;\n justify-content: center;\n border: var(--dimension-stroke-width-015) solid var(--color-foreground-tertiary);\n border-bottom-width: var(--dimension-stroke-width-025);\n border-radius: var(--dimension-radius-025);\n}\n\n@keyframes tooltipFadeIn {\n from { opacity: 0; }\n to { opacity: 1; }\n}\n\n@keyframes tooltipFadeOut {\n from { opacity: 1; }\n to { opacity: 0; }\n}\n","import { Component, Prop, State, Element, Watch, h, Host } from '@stencil/core';\nimport { resolveCssLengthPx, resolveCssTimeMs, TOKEN_CSS_LENGTHS, TOKEN_DEFAULTS } from '../../utils';\n\nexport type TooltipSide = 'top' | 'right' | 'bottom' | 'left';\nexport type TooltipAlign = 'start' | 'center' | 'end';\n\nlet lastDismissedAt = 0;\nlet tooltipIdCounter = 0;\n\n@Component({\n tag: 'ds-tooltip',\n styleUrl: 'Tooltip.css',\n scoped: true,\n})\nexport class Tooltip {\n @Element() el!: HTMLElement;\n\n @Prop() label!: string;\n @Prop() side: TooltipSide = 'top';\n @Prop() align: TooltipAlign = 'center';\n /** Gap between anchor and tooltip — number (px) or TokoMo length. */\n @Prop() sideOffset: number | string = TOKEN_CSS_LENGTHS.space050;\n /** Cross-axis offset — number (px) or TokoMo length. */\n @Prop() alignOffset: number | string = 0;\n /** Show delay — number (ms) or TokoMo time token / `var(--effect-animation-delay-*)`. */\n @Prop() delay: number | string = TOKEN_DEFAULTS.animationDelayMedium1;\n @Prop() shortcutKey: string | undefined;\n @Prop() shortcutKeyPosition: 'start' | 'end' = 'end';\n\n @State() private visible: boolean = false;\n @State() private closing: boolean = false;\n @State() private pos: { x: number; y: number } = { x: 0, y: 0 };\n\n private tooltipId = `ds-tooltip-${++tooltipIdCounter}`;\n private delayTimer: ReturnType<typeof setTimeout> | null = null;\n private closeTimer: ReturnType<typeof setTimeout> | null = null;\n private anchor: HTMLElement | null = null;\n private tooltipEl: HTMLElement | null = null;\n private mouseEnterHandler: () => void = () => this.show();\n private mouseLeaveHandler: () => void = () => this.hide();\n private focusHandler: () => void = () => this.show();\n private blurHandler: () => void = () => this.hide();\n\n componentDidLoad() {\n this.bindAnchor();\n }\n\n disconnectedCallback() {\n this.unbindAnchor();\n this.clearTimers();\n }\n\n @Watch('label')\n @Watch('side')\n @Watch('align')\n @Watch('sideOffset')\n @Watch('alignOffset')\n onPositionPropsChange() {\n if (this.visible) this.calculatePosition();\n }\n\n private get viewportPadPx(): number {\n return resolveCssLengthPx(TOKEN_DEFAULTS.space050, TOKEN_DEFAULTS.space050);\n }\n\n private get sideOffsetPx(): number {\n return resolveCssLengthPx(this.sideOffset, TOKEN_DEFAULTS.space050);\n }\n\n private get alignOffsetPx(): number {\n return resolveCssLengthPx(this.alignOffset, 0);\n }\n\n private get hoverDelayMs(): number {\n return resolveCssTimeMs(this.delay, TOKEN_DEFAULTS.animationDelayMedium1);\n }\n\n private get instantReopenMs(): number {\n return resolveCssTimeMs(\n TOKEN_DEFAULTS.animationDurationMedium1,\n TOKEN_DEFAULTS.animationDurationMedium1,\n );\n }\n\n private get fadeOutMs(): number {\n return resolveCssTimeMs(TOKEN_DEFAULTS.motionShort3, TOKEN_DEFAULTS.animationDurationShort3);\n }\n\n private get tooltipFallbackWidthPx(): number {\n return resolveCssLengthPx(TOKEN_DEFAULTS.tooltipFallbackWidth, TOKEN_DEFAULTS.tooltipFallbackWidth);\n }\n\n private get tooltipFallbackHeightPx(): number {\n return resolveCssLengthPx(TOKEN_DEFAULTS.size300, TOKEN_DEFAULTS.size300);\n }\n\n private bindAnchor() {\n const slot = this.el.querySelector('slot') as HTMLSlotElement | null;\n const slotted = slot?.assignedElements?.() ?? [];\n const child = (slotted[0] ?? this.el.firstElementChild) as HTMLElement | null;\n if (!child) return;\n this.anchor = child;\n child.setAttribute('aria-describedby', this.tooltipId);\n child.addEventListener('mouseenter', this.mouseEnterHandler);\n child.addEventListener('mouseleave', this.mouseLeaveHandler);\n child.addEventListener('focus', this.focusHandler);\n child.addEventListener('blur', this.blurHandler);\n }\n\n private unbindAnchor() {\n if (!this.anchor) return;\n this.anchor.removeAttribute('aria-describedby');\n this.anchor.removeEventListener('mouseenter', this.mouseEnterHandler);\n this.anchor.removeEventListener('mouseleave', this.mouseLeaveHandler);\n this.anchor.removeEventListener('focus', this.focusHandler);\n this.anchor.removeEventListener('blur', this.blurHandler);\n this.anchor = null;\n }\n\n private clearTimers() {\n if (this.delayTimer) { clearTimeout(this.delayTimer); this.delayTimer = null; }\n if (this.closeTimer) { clearTimeout(this.closeTimer); this.closeTimer = null; }\n }\n\n private show() {\n this.clearTimers();\n const instant = Date.now() - lastDismissedAt < this.instantReopenMs;\n if (instant) {\n this.closing = false;\n this.visible = true;\n requestAnimationFrame(() => this.calculatePosition());\n return;\n }\n this.delayTimer = setTimeout(() => {\n this.delayTimer = null;\n this.closing = false;\n this.visible = true;\n requestAnimationFrame(() => this.calculatePosition());\n }, this.hoverDelayMs);\n }\n\n private hide() {\n this.clearTimers();\n if (!this.visible) return;\n lastDismissedAt = Date.now();\n this.closing = true;\n this.closeTimer = setTimeout(() => {\n this.closeTimer = null;\n this.visible = false;\n this.closing = false;\n }, this.fadeOutMs);\n }\n\n private calculatePosition() {\n if (!this.anchor) return;\n const tip = this.el.querySelector('.tooltip-popup') as HTMLElement | null;\n if (!tip) return;\n const a = this.anchor.getBoundingClientRect();\n const tw = tip.offsetWidth || this.tooltipFallbackWidthPx;\n const th = tip.offsetHeight || this.tooltipFallbackHeightPx;\n const sideOffset = this.sideOffsetPx;\n const alignOffset = this.alignOffsetPx;\n const vpPad = this.viewportPadPx;\n let x = 0, y = 0;\n\n switch (this.side) {\n case 'top':\n y = a.top - th - sideOffset;\n x = this.align === 'start' ? a.left + alignOffset\n : this.align === 'end' ? a.right - tw + alignOffset\n : a.left + a.width / 2 - tw / 2 + alignOffset;\n break;\n case 'bottom':\n y = a.bottom + sideOffset;\n x = this.align === 'start' ? a.left + alignOffset\n : this.align === 'end' ? a.right - tw + alignOffset\n : a.left + a.width / 2 - tw / 2 + alignOffset;\n break;\n case 'left':\n x = a.left - tw - sideOffset;\n y = this.align === 'start' ? a.top + alignOffset\n : this.align === 'end' ? a.bottom - th + alignOffset\n : a.top + a.height / 2 - th / 2 + alignOffset;\n break;\n case 'right':\n x = a.right + sideOffset;\n y = this.align === 'start' ? a.top + alignOffset\n : this.align === 'end' ? a.bottom - th + alignOffset\n : a.top + a.height / 2 - th / 2 + alignOffset;\n break;\n }\n\n this.pos = {\n x: Math.min(Math.max(x, vpPad), window.innerWidth - tw - vpPad),\n y: Math.min(Math.max(y, vpPad), window.innerHeight - th - vpPad),\n };\n }\n\n render() {\n return (\n <Host style={{ display: 'contents' }}>\n <slot />\n {(this.visible || this.closing) && (\n <div\n id={this.tooltipId}\n class={{ 'tooltip-popup': true, 'tooltip-popup--closing': this.closing }}\n role=\"tooltip\"\n style={{\n position: 'fixed',\n left: '0',\n top: '0',\n transform: `translate(${Math.round(this.pos.x)}px, ${Math.round(this.pos.y)}px)`,\n zIndex: '10000',\n pointerEvents: 'none',\n }}\n >\n <div class=\"tooltip-inner\">\n {this.shortcutKey && this.shortcutKeyPosition === 'start' && (\n <div class=\"key-hint\" aria-hidden=\"true\">\n <span class=\"text-caption-emphasis\">{this.shortcutKey}</span>\n </div>\n )}\n <span class=\"text-body-small\">{this.label}</span>\n {this.shortcutKey && this.shortcutKeyPosition === 'end' && (\n <div class=\"key-hint\" aria-hidden=\"true\">\n <span class=\"text-caption-emphasis\">{this.shortcutKey}</span>\n </div>\n )}\n </div>\n </div>\n )}\n </Host>\n );\n }\n}\n"],"mappings":"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","ignoreList":[]}
1
+ {"version":3,"names":["tooltipCss","lastDismissedAt","tooltipIdCounter","Tooltip","__stencil_proxyCustomElement","HTMLElement","constructor","registerHost","this","side","align","sideOffset","TOKEN_CSS_LENGTHS","space050","alignOffset","delay","TOKEN_DEFAULTS","animationDelayMedium1","shortcutKeyPosition","visible","closing","pos","x","y","tooltipId","delayTimer","closeTimer","anchor","tooltipEl","mouseEnterHandler","show","mouseLeaveHandler","hide","focusHandler","blurHandler","componentDidLoad","bindAnchor","disconnectedCallback","unbindAnchor","clearTimers","onPositionPropsChange","calculatePosition","viewportPadPx","resolveCssLengthPx","sideOffsetPx","alignOffsetPx","hoverDelayMs","resolveCssTimeMs","instantReopenMs","animationDurationMedium1","fadeOutMs","motionShort3","animationDurationShort3","tooltipFallbackWidthPx","tooltipFallbackWidth","tooltipFallbackHeightPx","size300","slot","el","querySelector","slotted","assignedElements","child","firstElementChild","setAttribute","addEventListener","removeAttribute","removeEventListener","clearTimeout","instant","Date","now","requestAnimationFrame","setTimeout","tip","a","getBoundingClientRect","tw","offsetWidth","th","offsetHeight","vpPad","top","left","right","width","bottom","height","Math","min","max","window","innerWidth","innerHeight","render","h","Host","key","style","display","id","class","role","position","transform","round","zIndex","pointerEvents","shortcutKey","label"],"sources":["src/wc/components/Tooltip/Tooltip.css?tag=ds-tooltip&encapsulation=scoped","src/wc/components/Tooltip/Tooltip.tsx"],"sourcesContent":[".tooltip-popup {\n box-sizing: border-box;\n background-color: var(--color-background-primary);\n border-radius: var(--dimension-radius-075);\n box-shadow: var(--effect-elevation-elevated-floating);\n padding: var(--dimension-space-050);\n white-space: nowrap;\n animation: tooltipFadeIn var(--effect-motion-short-2) forwards;\n will-change: transform;\n backface-visibility: hidden;\n}\n\n.tooltip-popup--closing {\n animation: tooltipFadeOut var(--effect-motion-short-3) forwards;\n}\n\n.tooltip-inner {\n display: flex;\n flex-direction: row;\n align-items: center;\n gap: var(--dimension-space-050);\n}\n\n.key-hint {\n width: var(--dimension-size-200);\n height: var(--dimension-size-200);\n flex-shrink: 0;\n display: flex;\n align-items: center;\n justify-content: center;\n border: var(--dimension-stroke-width-015) solid var(--color-foreground-tertiary);\n border-bottom-width: var(--dimension-stroke-width-025);\n border-radius: var(--dimension-radius-025);\n}\n\n@keyframes tooltipFadeIn {\n from { opacity: 0; }\n to { opacity: 1; }\n}\n\n@keyframes tooltipFadeOut {\n from { opacity: 1; }\n to { opacity: 0; }\n}\n","import { Component, Prop, State, Element, Watch, h, Host } from '@stencil/core';\nimport { resolveCssLengthPx, resolveCssTimeMs, TOKEN_CSS_LENGTHS, TOKEN_DEFAULTS } from '../../utils';\n\nexport type TooltipSide = 'top' | 'right' | 'bottom' | 'left';\nexport type TooltipAlign = 'start' | 'center' | 'end';\n\nlet lastDismissedAt = 0;\nlet tooltipIdCounter = 0;\n\n@Component({\n tag: 'ds-tooltip',\n styleUrl: 'Tooltip.css',\n scoped: true,\n})\nexport class Tooltip {\n @Element() el!: HTMLElement;\n\n @Prop() label!: string;\n @Prop() side: TooltipSide = 'top';\n @Prop() align: TooltipAlign = 'center';\n /** Gap between anchor and tooltip — number (px) or TokoMo length. */\n @Prop() sideOffset: number | string = TOKEN_CSS_LENGTHS.space050;\n /** Cross-axis offset — number (px) or TokoMo length. */\n @Prop() alignOffset: number | string = 0;\n /** Show delay — number (ms) or TokoMo time token / `var(--effect-animation-delay-*)`. */\n @Prop() delay: number | string = TOKEN_DEFAULTS.animationDelayMedium1;\n @Prop() shortcutKey: string | undefined;\n @Prop() shortcutKeyPosition: 'start' | 'end' = 'end';\n\n @State() private visible: boolean = false;\n @State() private closing: boolean = false;\n @State() private pos: { x: number; y: number } = { x: 0, y: 0 };\n\n private tooltipId = `ds-tooltip-${++tooltipIdCounter}`;\n private delayTimer: ReturnType<typeof setTimeout> | null = null;\n private closeTimer: ReturnType<typeof setTimeout> | null = null;\n private anchor: HTMLElement | null = null;\n private tooltipEl: HTMLElement | null = null;\n private mouseEnterHandler: () => void = () => this.show();\n private mouseLeaveHandler: () => void = () => this.hide();\n private focusHandler: () => void = () => this.show();\n private blurHandler: () => void = () => this.hide();\n\n componentDidLoad() {\n this.bindAnchor();\n }\n\n disconnectedCallback() {\n this.unbindAnchor();\n this.clearTimers();\n }\n\n @Watch('label')\n @Watch('side')\n @Watch('align')\n @Watch('sideOffset')\n @Watch('alignOffset')\n onPositionPropsChange() {\n if (this.visible) this.calculatePosition();\n }\n\n private get viewportPadPx(): number {\n return resolveCssLengthPx(TOKEN_DEFAULTS.space050, TOKEN_DEFAULTS.space050);\n }\n\n private get sideOffsetPx(): number {\n return resolveCssLengthPx(this.sideOffset, TOKEN_DEFAULTS.space050);\n }\n\n private get alignOffsetPx(): number {\n return resolveCssLengthPx(this.alignOffset, 0);\n }\n\n private get hoverDelayMs(): number {\n return resolveCssTimeMs(this.delay, TOKEN_DEFAULTS.animationDelayMedium1);\n }\n\n private get instantReopenMs(): number {\n return resolveCssTimeMs(\n TOKEN_DEFAULTS.animationDurationMedium1,\n TOKEN_DEFAULTS.animationDurationMedium1,\n );\n }\n\n private get fadeOutMs(): number {\n return resolveCssTimeMs(TOKEN_DEFAULTS.motionShort3, TOKEN_DEFAULTS.animationDurationShort3);\n }\n\n private get tooltipFallbackWidthPx(): number {\n return resolveCssLengthPx(TOKEN_DEFAULTS.tooltipFallbackWidth, TOKEN_DEFAULTS.tooltipFallbackWidth);\n }\n\n private get tooltipFallbackHeightPx(): number {\n return resolveCssLengthPx(TOKEN_DEFAULTS.size300, TOKEN_DEFAULTS.size300);\n }\n\n private bindAnchor() {\n const slot = this.el.querySelector('slot') as HTMLSlotElement | null;\n const slotted = slot?.assignedElements?.() ?? [];\n const child = (slotted[0] ?? this.el.firstElementChild) as HTMLElement | null;\n if (!child) return;\n this.anchor = child;\n child.setAttribute('aria-describedby', this.tooltipId);\n child.addEventListener('mouseenter', this.mouseEnterHandler);\n child.addEventListener('mouseleave', this.mouseLeaveHandler);\n child.addEventListener('focus', this.focusHandler);\n child.addEventListener('blur', this.blurHandler);\n }\n\n private unbindAnchor() {\n if (!this.anchor) return;\n this.anchor.removeAttribute('aria-describedby');\n this.anchor.removeEventListener('mouseenter', this.mouseEnterHandler);\n this.anchor.removeEventListener('mouseleave', this.mouseLeaveHandler);\n this.anchor.removeEventListener('focus', this.focusHandler);\n this.anchor.removeEventListener('blur', this.blurHandler);\n this.anchor = null;\n }\n\n private clearTimers() {\n if (this.delayTimer) { clearTimeout(this.delayTimer); this.delayTimer = null; }\n if (this.closeTimer) { clearTimeout(this.closeTimer); this.closeTimer = null; }\n }\n\n private show() {\n this.clearTimers();\n const instant = Date.now() - lastDismissedAt < this.instantReopenMs;\n if (instant) {\n this.closing = false;\n this.visible = true;\n requestAnimationFrame(() => this.calculatePosition());\n return;\n }\n this.delayTimer = setTimeout(() => {\n this.delayTimer = null;\n this.closing = false;\n this.visible = true;\n requestAnimationFrame(() => this.calculatePosition());\n }, this.hoverDelayMs);\n }\n\n private hide() {\n this.clearTimers();\n if (!this.visible) return;\n lastDismissedAt = Date.now();\n this.closing = true;\n this.closeTimer = setTimeout(() => {\n this.closeTimer = null;\n this.visible = false;\n this.closing = false;\n }, this.fadeOutMs);\n }\n\n private calculatePosition() {\n if (!this.anchor) return;\n const tip = this.el.querySelector('.tooltip-popup') as HTMLElement | null;\n if (!tip) return;\n const a = this.anchor.getBoundingClientRect();\n const tw = tip.offsetWidth || this.tooltipFallbackWidthPx;\n const th = tip.offsetHeight || this.tooltipFallbackHeightPx;\n const sideOffset = this.sideOffsetPx;\n const alignOffset = this.alignOffsetPx;\n const vpPad = this.viewportPadPx;\n let x = 0, y = 0;\n\n switch (this.side) {\n case 'top':\n y = a.top - th - sideOffset;\n x = this.align === 'start' ? a.left + alignOffset\n : this.align === 'end' ? a.right - tw + alignOffset\n : a.left + a.width / 2 - tw / 2 + alignOffset;\n break;\n case 'bottom':\n y = a.bottom + sideOffset;\n x = this.align === 'start' ? a.left + alignOffset\n : this.align === 'end' ? a.right - tw + alignOffset\n : a.left + a.width / 2 - tw / 2 + alignOffset;\n break;\n case 'left':\n x = a.left - tw - sideOffset;\n y = this.align === 'start' ? a.top + alignOffset\n : this.align === 'end' ? a.bottom - th + alignOffset\n : a.top + a.height / 2 - th / 2 + alignOffset;\n break;\n case 'right':\n x = a.right + sideOffset;\n y = this.align === 'start' ? a.top + alignOffset\n : this.align === 'end' ? a.bottom - th + alignOffset\n : a.top + a.height / 2 - th / 2 + alignOffset;\n break;\n }\n\n this.pos = {\n x: Math.min(Math.max(x, vpPad), window.innerWidth - tw - vpPad),\n y: Math.min(Math.max(y, vpPad), window.innerHeight - th - vpPad),\n };\n }\n\n render() {\n return (\n <Host style={{ display: 'contents' }}>\n <slot />\n {(this.visible || this.closing) && (\n <div\n id={this.tooltipId}\n class={{ 'tooltip-popup': true, 'tooltip-popup--closing': this.closing }}\n role=\"tooltip\"\n style={{\n position: 'fixed',\n left: '0',\n top: '0',\n transform: `translate(${Math.round(this.pos.x)}px, ${Math.round(this.pos.y)}px)`,\n zIndex: '10000',\n pointerEvents: 'none',\n }}\n >\n <div class=\"tooltip-inner\">\n {this.shortcutKey && this.shortcutKeyPosition === 'start' && (\n <div class=\"key-hint\" aria-hidden=\"true\">\n <span class=\"text-caption-emphasis\">{this.shortcutKey}</span>\n </div>\n )}\n <span class=\"text-body-small\">{this.label}</span>\n {this.shortcutKey && this.shortcutKeyPosition === 'end' && (\n <div class=\"key-hint\" aria-hidden=\"true\">\n <span class=\"text-caption-emphasis\">{this.shortcutKey}</span>\n </div>\n )}\n </div>\n </div>\n )}\n </Host>\n );\n }\n}\n"],"mappings":"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","ignoreList":[]}
package/dist/components/{p-g6MCxfm4.js → p-BFPfyJ8Z.js} RENAMED
@@ -1,2 +1,2 @@
1
1
  const t="--_badge-gradient-position";function n(t){const n=t.closest("ds-app-shell");return n?.hasAttribute("gradient")===true}export{t as B,n as i};
2
- //# sourceMappingURL=p-g6MCxfm4.js.map
2
+ //# sourceMappingURL=p-BFPfyJ8Z.js.map
package/dist/components/p-BFPfyJ8Z.js.map ADDED
@@ -0,0 +1 @@
1
+ {"version":3,"names":["BADGE_GRADIENT_POSITION_VAR","isShellGradientActive","from","shell","closest","hasAttribute"],"sources":["src/wc/nav/badge-gradient-ring.ts"],"sourcesContent":["import {\n SHELL_GRADIENT_POSITION_BAR_VAR,\n SHELL_GRADIENT_POSITION_PANEL_VAR,\n} from './shell-gradient';\n\n/** Per-badge background-position for shell gradient ring sampling. */\nexport const BADGE_GRADIENT_POSITION_VAR = '--_badge-gradient-position';\n\nexport interface GradientSurface {\n element: HTMLElement;\n chromeHost: HTMLElement;\n positionVar: string;\n}\n\n/** Whether the badge sits under `ds-app-shell[gradient]`. */\nexport function isShellGradientActive(from: HTMLElement): boolean {\n // Explicit <HTMLElement>: the inferred HTMLDsAppShellElement type only\n // resolves where @stencil/core types are installed — consumers importing\n // `@ds-mo/ui/nav` (raw TS) compile this without them.\n const shell = from.closest<HTMLElement>('ds-app-shell');\n return shell?.hasAttribute('gradient') === true;\n}\n\n/** Bar or panel chrome surface that owns the shell gradient stack. */\nexport function findGradientSurface(from: HTMLElement): GradientSurface | null {\n const barHost = from.closest('ds-bar-nav') as HTMLElement | null;\n if (barHost) {\n const root = barHost.shadowRoot ?? barHost;\n const element = root.querySelector('.bar-nav');\n if (element) {\n return {\n element: element as HTMLElement,\n chromeHost: barHost,\n positionVar: SHELL_GRADIENT_POSITION_BAR_VAR,\n };\n }\n }\n\n const panelHost = from.closest('ds-panel-nav') as HTMLElement | null;\n if (panelHost) {\n const root = panelHost.shadowRoot ?? panelHost;\n const element = root.querySelector('.panel-nav');\n if (element) {\n return {\n element: element as HTMLElement,\n chromeHost: panelHost,\n positionVar: SHELL_GRADIENT_POSITION_PANEL_VAR,\n };\n }\n }\n\n return null;\n}\n\ninterface ParsedPosition {\n x: number;\n y: number;\n}\n\n/** Parse a two-value CSS background-position (e.g. `-200px 0`). */\nexport function parseCssBackgroundPosition(value: string): ParsedPosition {\n const trimmed = value.trim();\n if (!trimmed) return { x: 0, y: 0 };\n\n const parts = trimmed.split(/\\s+/);\n const x = parseLength(parts[0] ?? '0');\n const y = parseLength(parts[1] ?? '0');\n return { x, y };\n}\n\nfunction parseLength(token: string): number {\n const px = token.match(/^(-?[\\d.]+)px$/);\n if (px) return Number(px[1]);\n return 0;\n}\n\n/**\n * Background position for a badge ring so the shell gradient aligns with nav chrome.\n * Uses badge center relative to the painted chrome surface.\n */\nexport function badgeGradientPosition(\n badgeHost: HTMLElement,\n surface: GradientSurface,\n shellPosition: string,\n): string {\n const badgeRect = badgeHost.getBoundingClientRect();\n const surfaceRect = surface.element.getBoundingClientRect();\n const anchorX = badgeRect.left + badgeRect.width / 2 - surfaceRect.left;\n const anchorY = badgeRect.top + badgeRect.height / 2 - surfaceRect.top;\n const { x, y } = parseCssBackgroundPosition(shellPosition);\n\n return `${Math.round(x - anchorX)}px ${Math.round(y - anchorY)}px`;\n}\n\n/** Resolve shell gradient position from chrome host custom properties. */\nexport function readShellGradientPosition(surface: GradientSurface): string {\n const styles = getComputedStyle(surface.chromeHost);\n return styles.getPropertyValue(surface.positionVar).trim() || '0 0';\n}\n\n/** Stamp `--_badge-gradient-position` on the badge host (fixed viewport chrome). */\nexport function syncBadgeGradientPosition(badgeHost: HTMLElement): void {\n if (!isShellGradientActive(badgeHost)) {\n badgeHost.style.removeProperty(BADGE_GRADIENT_POSITION_VAR);\n return;\n }\n\n badgeHost.style.setProperty(BADGE_GRADIENT_POSITION_VAR, '0 0');\n}\n"],"mappings":"AAMO,MAAMA,EAA8B,6BASrC,SAAUC,EAAsBC,GAIpC,MAAMC,EAAQD,EAAKE,QAAqB,gBACxC,OAAOD,GAAOE,aAAa,cAAgB,IAC7C,Q","ignoreList":[]}