@ds-mo/ui 14.0.1 → 14.2.0

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

@@ -1,2 +1,2 @@
-import{p as e,H as n,c as t,h as i,a as r,t as s}from"./index.js";import{c as o}from"./p-CMv_7vFs.js";import{d}from"./p-DZFilC--.js";import{r as c}from"./p-C-vRkDyn.js";const a=[{threshold:1e9,suffix:"b"},{threshold:1e6,suffix:"m"},{threshold:1e3,suffix:"k"}];function l(e,n){if(n){return new Intl.NumberFormat(n,{notation:"compact",compactDisplay:"short",maximumFractionDigits:1}).format(e)}const t=e<0?"-":"";const i=Math.abs(e);if(i<1e3)return String(e);for(let e=0;e<a.length;e++){const n=a[e];if(i<n.threshold)continue;let r=Math.round(i/n.threshold*10)/10;if(r>=1e3&&e>0){const n=a[e-1];r=Math.round(i/n.threshold*10)/10;return`${t}${r}${n.suffix}`}return`${t}${r}${n.suffix}`}return String(e)}function h(e,n=1,t){const i=n===2?2:1;const r=Number.isFinite(e)?e:0;return new Intl.NumberFormat(t,{style:"percent",minimumFractionDigits:i,maximumFractionDigits:i}).format(r)}const g=()=>`.ds-control--lg.sc-ds-chart-legend,.ds-control--lg.sc-ds-chart-legend-h,.ds-control--md.sc-ds-chart-legend-h,.ds-control--md.sc-ds-chart-legend,.ds-control--sm.sc-ds-chart-legend-h,.ds-control--sm.sc-ds-chart-legend,.ds-control--xs.sc-ds-chart-legend-h,.ds-control--xs.sc-ds-chart-legend{--ds-control-radius:var(--dimension-radius-025)}.ds-control--lg.sc-ds-chart-legend-h,.ds-control--lg.sc-ds-chart-legend{--ds-control-height:var(--dimension-size-500);--ds-control-icon:var(--dimension-iconography-lg);--ds-control-padding-inline:var(--dimension-space-100);--ds-control-label-inset:var(--dimension-space-050);--ds-control-gap:var(--dimension-space-050)}.ds-control--md.sc-ds-chart-legend-h,.ds-control--md.sc-ds-chart-legend{--ds-control-height:var(--dimension-size-400);--ds-control-icon:var(--dimension-iconography-md);--ds-control-padding-inline:var(--dimension-space-075);--ds-control-label-inset:var(--dimension-space-025);--ds-control-gap:var(--dimension-space-050)}.ds-control--sm.sc-ds-chart-legend-h,.ds-control--sm.sc-ds-chart-legend{--ds-control-height:var(--dimension-size-300);--ds-control-icon:var(--dimension-iconography-sm);--ds-control-padding-inline:var(--dimension-space-050);--ds-control-label-inset:var(--dimension-space-025);--ds-control-gap:var(--dimension-space-025)}.ds-control--xs.sc-ds-chart-legend-h,.ds-control--xs.sc-ds-chart-legend{--ds-control-height:var(--dimension-size-200);--ds-control-icon:var(--dimension-iconography-xs);--ds-control-padding-inline:var(--dimension-space-025);--ds-control-label-inset:var(--dimension-space-025);--ds-control-gap:0}@media (forced-colors: active){.sc-ds-chart-legend:root,.sc-ds-chart-legend-h,.ds-forced-colors-scope.sc-ds-chart-legend{--ds-forced-color-surface:Canvas;--ds-forced-color-content:CanvasText;--ds-forced-color-control-boundary:ButtonText;--ds-forced-color-selected:Highlight;--ds-forced-color-on-selected:HighlightText;--ds-forced-color-disabled:GrayText}}.ds-interaction-fill.sc-ds-chart-legend-h,.ds-interaction-fill.sc-ds-chart-legend{position:var(--ds-interaction-position, relative);z-index:var(--ds-interaction-z-index, 0);cursor:default;--ds-interaction-hover:var(--color-interaction-hover);--ds-interaction-pressed:var(--color-interaction-pressed);--ds-interaction-active:var(--color-interaction-active-brand);--ds-interaction-border-width:0px;--ds-interaction-border-color:transparent;--ds-interaction-divider-width:0px;--ds-interaction-divider-color:transparent;--ds-interaction-divider-inline-start-width:0px;--ds-interaction-divider-inline-start-color:transparent;--ds-interaction-divider-inline-end-width:0px;--ds-interaction-divider-inline-end-color:transparent}.ds-interaction-fill.sc-ds-chart-legend-h::before,.ds-interaction-fill.sc-ds-chart-legend::before,.ds-interaction-fill.sc-ds-chart-legend-h::after,.ds-interaction-fill.sc-ds-chart-legend::after{content:'';position:absolute;inset:0;border-radius:inherit;background:transparent;pointer-events:none;cursor:inherit;transition:none}.ds-interaction-fill.sc-ds-chart-legend-h::before,.ds-interaction-fill.sc-ds-chart-legend::before{z-index:1}.ds-interaction-fill.sc-ds-chart-legend-h::after,.ds-interaction-fill.sc-ds-chart-legend::after{z-index:3;box-shadow:inset 0 calc(-1 * var(--ds-interaction-divider-width)) 0 var(--ds-interaction-divider-color),     inset var(--ds-interaction-divider-inline-start-width) 0 0       var(--ds-interaction-divider-inline-start-color),     inset calc(-1 * var(--ds-interaction-divider-inline-end-width)) 0 0       var(--ds-interaction-divider-inline-end-color),     inset 0 0 0 var(--ds-interaction-border-width) var(--ds-interaction-border-color)}.ds-interaction-fill--bordered.sc-ds-chart-legend-h,.ds-interaction-fill--bordered.sc-ds-chart-legend{--ds-interaction-border-width:var(--dimension-stroke-width-012);--ds-interaction-border-color:var(--color-border-secondary)}.ds-interaction-fill--selected.sc-ds-chart-legend-h::before,.ds-interaction-fill--selected.sc-ds-chart-legend::before{background:var(--ds-interaction-active)}.ds-interaction-fill--selected.sc-ds-chart-legend-h,.ds-interaction-fill--selected.sc-ds-chart-legend{--ds-interaction-dot-ring:var(--ds-interaction-active)}@media (hover: hover) and (pointer: fine){.ds-interaction-fill.sc-ds-chart-legend-h:hover:not(:disabled)::after,.ds-interaction-fill.sc-ds-chart-legend:hover:not(:disabled)::after{background:var(--ds-interaction-hover)}}.ds-interaction-fill.sc-ds-chart-legend-h:active:not(:disabled)::after,.ds-interaction-fill.sc-ds-chart-legend:active:not(:disabled)::after{background:var(--ds-interaction-pressed)}.ds-interaction-fill--grouped.sc-ds-chart-legend-h::after,.ds-interaction-fill--grouped.sc-ds-chart-legend::after,.ds-interaction-fill--grouped.sc-ds-chart-legend-h:active:not(:disabled)::after,.ds-interaction-fill--grouped.sc-ds-chart-legend:active:not(:disabled)::after{background:var(--ds-interaction-group-fill, transparent)}@media (hover: hover) and (pointer: fine){.ds-interaction-fill--grouped.sc-ds-chart-legend-h:hover:not(:disabled)::after,.ds-interaction-fill--grouped.sc-ds-chart-legend:hover:not(:disabled)::after{background:var(--ds-interaction-group-fill, transparent)}}.ds-interaction-fill--grouped.sc-ds-chart-legend-h,.ds-interaction-fill--grouped.sc-ds-chart-legend{--ds-interaction-divider-width:var(--ds-interaction-group-divider-width, 0px);--ds-interaction-divider-color:var(--ds-interaction-group-divider-color, transparent);--ds-interaction-divider-inline-start-width:var(     --ds-interaction-group-divider-inline-start-width,     0px   );--ds-interaction-divider-inline-start-color:var(     --ds-interaction-group-divider-inline-start-color,     transparent   );--ds-interaction-divider-inline-end-width:var(     --ds-interaction-group-divider-inline-end-width,     0px   );--ds-interaction-divider-inline-end-color:var(     --ds-interaction-group-divider-inline-end-color,     transparent   )}.ds-interaction-fill.sc-ds-chart-legend-h>.ds-interaction-fill__content.sc-ds-chart-legend,.ds-interaction-fill.sc-ds-chart-legend>.ds-interaction-fill__content.sc-ds-chart-legend,.ds-interaction-fill__content.sc-ds-chart-legend{position:relative;z-index:2;cursor:inherit}.ds-interaction-fill--on-faint.sc-ds-chart-legend-h,.ds-interaction-fill--on-faint.sc-ds-chart-legend{--ds-interaction-active:var(--color-interaction-active)}.ds-interaction-fill--on-medium.sc-ds-chart-legend-h,.ds-interaction-fill--on-medium.sc-ds-chart-legend{--ds-interaction-hover:var(--color-interaction-on-medium-background-hover);--ds-interaction-pressed:var(--color-interaction-on-medium-background-pressed);--ds-interaction-active:var(--color-interaction-on-medium-background-active);--ds-focus-ring-color:var(--color-interaction-on-medium-background-focus)}.ds-interaction-fill--on-bold.sc-ds-chart-legend-h,.ds-interaction-fill--on-bold.sc-ds-chart-legend{--ds-interaction-hover:var(--color-interaction-on-bold-background-hover);--ds-interaction-pressed:var(--color-interaction-on-bold-background-pressed);--ds-interaction-active:var(--color-interaction-on-bold-background-active);--ds-focus-ring-color:var(--color-interaction-on-bold-background-focus)}.ds-interaction-fill--on-strong.sc-ds-chart-legend-h,.ds-interaction-fill--on-strong.sc-ds-chart-legend{--ds-interaction-hover:var(--color-interaction-on-strong-background-hover);--ds-interaction-pressed:var(--color-interaction-on-strong-background-pressed);--ds-interaction-active:var(--color-interaction-on-strong-background-active);--ds-focus-ring-color:var(--color-interaction-on-strong-background-focus)}.ds-interaction-fill--on-translucent.sc-ds-chart-legend-h,.ds-interaction-fill--on-translucent.sc-ds-chart-legend{--ds-interaction-hover:var(--color-translucent-interaction-hover);--ds-interaction-pressed:var(--color-translucent-interaction-pressed);--ds-interaction-active:var(--color-translucent-interaction-active);--ds-focus-ring-color:var(--color-translucent-interaction-focus)}.ds-interaction-fill--on-inverted.sc-ds-chart-legend-h,.ds-interaction-fill--on-inverted.sc-ds-chart-legend{--ds-interaction-hover:var(--color-inverted-interaction-hover);--ds-interaction-pressed:var(--color-inverted-interaction-pressed);--ds-interaction-active:var(--color-inverted-interaction-active);--ds-focus-ring-color:var(--color-inverted-interaction-focus)}.ds-interaction-fill--on-media.sc-ds-chart-legend-h,.ds-interaction-fill--on-media.sc-ds-chart-legend{--ds-interaction-hover:var(--color-media-interaction-hover);--ds-interaction-pressed:var(--color-media-interaction-pressed);--ds-interaction-active:var(--color-media-interaction-active);--ds-focus-ring-color:var(--color-media-interaction-focus)}.ds-interaction-fill--on-always-dark.sc-ds-chart-legend-h,.ds-interaction-fill--on-always-dark.sc-ds-chart-legend{--ds-interaction-hover:var(--color-always-dark-interaction-hover);--ds-interaction-pressed:var(--color-always-dark-interaction-pressed);--ds-interaction-active:var(--color-always-dark-interaction-active);--ds-focus-ring-color:var(--color-always-dark-interaction-focus)}.ds-interaction-fill--on-navigation.sc-ds-chart-legend-h,.ds-interaction-fill--on-navigation.sc-ds-chart-legend{--ds-interaction-hover:var(--color-navigation-interaction-hover);--ds-interaction-pressed:var(--color-navigation-interaction-pressed);--ds-interaction-active:var(--color-navigation-interaction-active);--ds-focus-ring-color:var(--color-navigation-interaction-focus)}@media (forced-colors: active){.ds-interaction-fill.sc-ds-chart-legend-h::after,.ds-interaction-fill.sc-ds-chart-legend::after{box-shadow:none;outline:var(--ds-interaction-border-width) solid       var(--ds-forced-color-control-boundary);outline-offset:calc(-1 * var(--ds-interaction-border-width))}.ds-interaction-fill--selected.sc-ds-chart-legend-h::before,.ds-interaction-fill--selected.sc-ds-chart-legend::before{background:transparent;outline:var(--dimension-stroke-width-025) solid var(--ds-forced-color-selected);outline-offset:calc(-1 * var(--dimension-stroke-width-025))}}@media (forced-colors: active) and (hover: hover) and (pointer: fine){.ds-interaction-fill.sc-ds-chart-legend-h:hover:not(:disabled):not(:focus-visible):not(:focus-within):not(.ds-focus-ring--visible)::after,.ds-interaction-fill.sc-ds-chart-legend:hover:not(:disabled):not(:focus-visible):not(:focus-within):not(.ds-focus-ring--visible)::after{outline-color:var(--ds-forced-color-selected);outline-width:var(--dimension-stroke-width-012)}}@media (forced-colors: active){.sc-ds-chart-legend:root,.sc-ds-chart-legend-h,.ds-forced-colors-scope.sc-ds-chart-legend{--ds-forced-color-surface:Canvas;--ds-forced-color-content:CanvasText;--ds-forced-color-control-boundary:ButtonText;--ds-forced-color-selected:Highlight;--ds-forced-color-on-selected:HighlightText;--ds-forced-color-disabled:GrayText}}.sc-ds-chart-legend-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-chart-legend-h,.ds-focus-ring.sc-ds-chart-legend,.ds-focus-ring-inset.sc-ds-chart-legend-h,.ds-focus-ring-inset.sc-ds-chart-legend{outline:none;-webkit-tap-highlight-color:transparent;touch-action:manipulation}.ds-focus-ring.sc-ds-chart-legend-h:focus-visible,.ds-focus-ring.sc-ds-chart-legend: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-chart-legend-h,.ds-focus-ring.ds-focus-ring--visible.sc-ds-chart-legend{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-chart-legend-h:focus-visible,.ds-focus-ring-inset.sc-ds-chart-legend:focus-visible{outline:none}.ds-focus-ring-inset.sc-ds-chart-legend-h:focus-visible::after,.ds-focus-ring-inset.sc-ds-chart-legend: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-chart-legend-h,.ds-focus-ring-inset.ds-focus-ring--visible.sc-ds-chart-legend{outline:none}.ds-focus-ring-inset.ds-focus-ring--visible.sc-ds-chart-legend-h::after,.ds-focus-ring-inset.ds-focus-ring--visible.sc-ds-chart-legend::after{outline:var(--ds-focus-ring-width) solid var(--ds-focus-ring-color);outline-offset:calc(-1 * var(--ds-focus-ring-width))}@media (forced-colors: active){.sc-ds-chart-legend-h{--ds-focus-ring-color:var(--ds-forced-color-selected)}}@media (forced-colors: active){.sc-ds-chart-legend:root,.sc-ds-chart-legend-h,.ds-forced-colors-scope.sc-ds-chart-legend{--ds-forced-color-surface:Canvas;--ds-forced-color-content:CanvasText;--ds-forced-color-control-boundary:ButtonText;--ds-forced-color-selected:Highlight;--ds-forced-color-on-selected:HighlightText;--ds-forced-color-disabled:GrayText}}.sc-ds-chart-legend-h{display:block;font-family:var(--typography-font-family-ui);user-select:none}.chart-legend__list.sc-ds-chart-legend{margin:0;padding:0;list-style:none}.chart-legend__list-item.sc-ds-chart-legend{display:contents}.chart-legend--vertical.sc-ds-chart-legend-h .chart-legend__list.sc-ds-chart-legend{display:grid;grid-template-columns:auto minmax(0, 1fr) var(--dimension-size-600);column-gap:var(--dimension-space-075);row-gap:var(--dimension-space-050)}.chart-legend--vertical.chart-legend--show-percentage.sc-ds-chart-legend-h .chart-legend__list.sc-ds-chart-legend{grid-template-columns:auto minmax(0, 1fr) var(--dimension-size-600) var(--dimension-size-800)}.chart-legend--vertical.sc-ds-chart-legend-h .chart-legend__item.sc-ds-chart-legend{grid-column:1 / -1;display:grid;grid-template-columns:subgrid}.chart-legend--horizontal.sc-ds-chart-legend-h .chart-legend__list.sc-ds-chart-legend{display:flex;flex-wrap:wrap;gap:var(--dimension-space-200)}.chart-legend--horizontal.sc-ds-chart-legend-h .chart-legend__item.sc-ds-chart-legend{display:flex;gap:var(--dimension-space-100)}.chart-legend__item.sc-ds-chart-legend{box-sizing:border-box;height:var(--ds-control-height, var(--dimension-size-400));align-items:center;padding:0 var(--ds-control-padding-inline, var(--dimension-space-075));border-radius:var(--ds-control-radius, var(--dimension-radius-025));text-decoration:none;color:inherit;transition:opacity var(--effect-motion-short-2)}.chart-legend__item--dimmed.sc-ds-chart-legend{opacity:var(--effect-opacity-medium)}@media (prefers-reduced-motion: reduce){.chart-legend__item.sc-ds-chart-legend{transition:none}}.chart-legend__item--interactive.sc-ds-chart-legend{cursor:pointer}.chart-legend__item.sc-ds-chart-legend>*.sc-ds-chart-legend{position:relative;z-index:2}.chart-legend__swatch-box.sc-ds-chart-legend{width:var(--dimension-size-250);height:var(--dimension-size-250);display:flex;align-items:center;justify-content:center;flex-shrink:0}.chart-legend__swatch.sc-ds-chart-legend{width:var(--dimension-space-150);height:var(--dimension-space-150);border-radius:var(--dimension-radius-025);flex-shrink:0}.chart-legend__label.sc-ds-chart-legend{min-width:0}.chart-legend__percentage.sc-ds-chart-legend{width:100%;min-width:0;text-align:right}.chart-legend__value.sc-ds-chart-legend{width:100%;text-align:right;min-width:0}@media (forced-colors: active){.chart-legend__swatch.sc-ds-chart-legend{forced-color-adjust:none;outline:var(--dimension-stroke-width-012) solid var(--ds-forced-color-content)}}`;const v=e(class e extends n{constructor(e){super();if(e!==false){this.__registerHost()}this.dsItemHover=t(this,"dsItemHover");this.dsItemClick=t(this,"dsItemClick");this.items=[];this.direction="vertical";this.showPercentage=true;this.percentageDecimals=1;this.highlightOnHover=true;this.activeLabel=null;this.hoveredLabel=null;this.handleClick=(e,n)=>{this.dsItemClick.emit({item:e,originalEvent:n})}}handleHighlightOnHoverChange(e){if(!e)this.hoveredLabel=null}handleHover(e){this.hoveredLabel=e?.label??null;this.dsItemHover.emit(e)}render(){const e=this.items.reduce(((e,n)=>e+(n.value??0)),0);const n=this.activeLabel??(this.highlightOnHover?this.hoveredLabel:null);return i(r,{key:"81612f79de5307cd4ed021ee5762ad6b0505be27",class:{"chart-legend":true,[`chart-legend--${this.direction}`]:true,"chart-legend--show-percentage":this.showPercentage}},i("ul",{key:"c544ade493dbd6009b21ab0ec26c785ab86d2ba4",class:"chart-legend__list",onMouseLeave:this.highlightOnHover?()=>this.handleHover(null):undefined},this.items.map(((t,r)=>{const s=n!=null&&t.label!==n;const d=c(t.href);const a=d?"a":"div";const g=t.value!=null?h(e?t.value/e:0,this.percentageDecimals,this.locale):"";return i("li",{class:"chart-legend__list-item",key:t.label},i(a,{class:{"chart-legend__item":true,"chart-legend__item--interactive":!!d,"chart-legend__item--dimmed":s,"ds-control--md":true,"ds-interaction-fill":this.highlightOnHover||!!d,"ds-focus-ring-inset":!!d},href:d,onClick:d?e=>this.handleClick(t,e):undefined,onMouseEnter:this.highlightOnHover?()=>this.handleHover(t):undefined,onFocus:this.highlightOnHover?()=>this.handleHover(t):undefined,onBlur:this.highlightOnHover?()=>this.handleHover(null):undefined},i("span",{class:"chart-legend__swatch-box"},i("span",{class:"chart-legend__swatch",style:{backgroundColor:t.color??o(r)}})),i("ds-text",{class:"chart-legend__label",as:"span",variant:"text-body-medium",color:"secondary",lineTruncation:1,title:t.label},t.label),t.value!=null&&i("ds-text",{class:"chart-legend__value",as:"span",variant:"text-body-medium",color:"primary",lineTruncation:1,align:"right",fontFeature:"tabular-nums",title:String(t.value)},l(t.value,this.locale)),t.value!=null&&this.showPercentage&&i("ds-text",{class:"chart-legend__percentage",as:"span",variant:"text-body-medium",color:"primary",lineTruncation:1,align:"right",fontFeature:"tabular-nums",title:g},g)))}))))}static get watchers(){return{highlightOnHover:[{handleHighlightOnHoverChange:0}]}}static get style(){return g()}},[2,"ds-chart-legend",{locale:[1],items:[16],direction:[1],showPercentage:[4,"show-percentage"],percentageDecimals:[2,"percentage-decimals"],highlightOnHover:[4,"highlight-on-hover"],activeLabel:[1,"active-label"],hoveredLabel:[32]},undefined,{highlightOnHover:[{handleHighlightOnHoverChange:0}]}]);function f(){if(typeof customElements==="undefined"){return}const e=["ds-chart-legend","ds-text"];e.forEach((e=>{switch(e){case"ds-chart-legend":if(!customElements.get(s(e))){customElements.define(s(e),v)}break;case"ds-text":if(!customElements.get(s(e))){d()}break}}))}f();const u=v;const m=f;export{u as DsChartLegend,m as defineCustomElement};
+import{p as e,H as n,c as t,h as i,a as r,t as s}from"./index.js";import{c as o}from"./p-CMv_7vFs.js";import{d}from"./p-DZFilC--.js";import{r as c}from"./p-C-vRkDyn.js";const a=[{threshold:1e9,suffix:"b"},{threshold:1e6,suffix:"m"},{threshold:1e3,suffix:"k"}];function l(e,n){if(n){return new Intl.NumberFormat(n,{notation:"compact",compactDisplay:"short",maximumFractionDigits:1}).format(e)}const t=e<0?"-":"";const i=Math.abs(e);if(i<1e3)return String(e);for(let e=0;e<a.length;e++){const n=a[e];if(i<n.threshold)continue;let r=Math.round(i/n.threshold*10)/10;if(r>=1e3&&e>0){const n=a[e-1];r=Math.round(i/n.threshold*10)/10;return`${t}${r}${n.suffix}`}return`${t}${r}${n.suffix}`}return String(e)}function h(e,n=1,t){const i=n===2?2:1;const r=Number.isFinite(e)?e:0;return new Intl.NumberFormat(t,{style:"percent",minimumFractionDigits:i,maximumFractionDigits:i}).format(r)}const g=()=>`.ds-control--lg.sc-ds-chart-legend,.ds-control--lg.sc-ds-chart-legend-h,.ds-control--md.sc-ds-chart-legend-h,.ds-control--md.sc-ds-chart-legend,.ds-control--sm.sc-ds-chart-legend-h,.ds-control--sm.sc-ds-chart-legend,.ds-control--xs.sc-ds-chart-legend-h,.ds-control--xs.sc-ds-chart-legend{--ds-control-radius:var(--dimension-radius-025)}.ds-control--lg.sc-ds-chart-legend-h,.ds-control--lg.sc-ds-chart-legend{--ds-control-height:var(--dimension-size-500);--ds-control-icon:var(--dimension-iconography-lg);--ds-control-padding-inline:var(--dimension-space-100);--ds-control-label-inset:var(--dimension-space-050);--ds-control-gap:var(--dimension-space-050)}.ds-control--md.sc-ds-chart-legend-h,.ds-control--md.sc-ds-chart-legend{--ds-control-height:var(--dimension-size-400);--ds-control-icon:var(--dimension-iconography-md);--ds-control-padding-inline:var(--dimension-space-075);--ds-control-label-inset:var(--dimension-space-025);--ds-control-gap:var(--dimension-space-050)}.ds-control--sm.sc-ds-chart-legend-h,.ds-control--sm.sc-ds-chart-legend{--ds-control-height:var(--dimension-size-300);--ds-control-icon:var(--dimension-iconography-sm);--ds-control-padding-inline:var(--dimension-space-050);--ds-control-label-inset:var(--dimension-space-025);--ds-control-gap:var(--dimension-space-025)}.ds-control--xs.sc-ds-chart-legend-h,.ds-control--xs.sc-ds-chart-legend{--ds-control-height:var(--dimension-size-200);--ds-control-icon:var(--dimension-iconography-xs);--ds-control-padding-inline:var(--dimension-space-025);--ds-control-label-inset:var(--dimension-space-025);--ds-control-gap:0}@media (forced-colors: active){.sc-ds-chart-legend:root,.sc-ds-chart-legend-h,.ds-forced-colors-scope.sc-ds-chart-legend{--ds-forced-color-surface:Canvas;--ds-forced-color-content:CanvasText;--ds-forced-color-control-boundary:ButtonText;--ds-forced-color-selected:Highlight;--ds-forced-color-on-selected:HighlightText;--ds-forced-color-disabled:GrayText}}.ds-interaction-fill.sc-ds-chart-legend-h,.ds-interaction-fill.sc-ds-chart-legend{position:var(--ds-interaction-position, relative);z-index:var(--ds-interaction-z-index, 0);cursor:default;--ds-interaction-hover:var(--color-interaction-hover);--ds-interaction-pressed:var(--color-interaction-pressed);--ds-interaction-active:var(--color-interaction-active-brand);--ds-interaction-border-width:0px;--ds-interaction-border-color:transparent;--ds-interaction-divider-width:0px;--ds-interaction-divider-color:transparent;--ds-interaction-divider-inline-start-width:0px;--ds-interaction-divider-inline-start-color:transparent;--ds-interaction-divider-inline-end-width:0px;--ds-interaction-divider-inline-end-color:transparent}.ds-interaction-fill.sc-ds-chart-legend-h::before,.ds-interaction-fill.sc-ds-chart-legend::before,.ds-interaction-fill.sc-ds-chart-legend-h::after,.ds-interaction-fill.sc-ds-chart-legend::after{content:'';position:absolute;inset:0;border-radius:inherit;background:transparent;pointer-events:none;cursor:inherit;transition:none}.ds-interaction-fill.sc-ds-chart-legend-h::before,.ds-interaction-fill.sc-ds-chart-legend::before{z-index:1}.ds-interaction-fill.sc-ds-chart-legend-h::after,.ds-interaction-fill.sc-ds-chart-legend::after{z-index:3;box-shadow:inset 0 calc(-1 * var(--ds-interaction-divider-width)) 0 var(--ds-interaction-divider-color),     inset var(--ds-interaction-divider-inline-start-width) 0 0       var(--ds-interaction-divider-inline-start-color),     inset calc(-1 * var(--ds-interaction-divider-inline-end-width)) 0 0       var(--ds-interaction-divider-inline-end-color),     inset 0 0 0 var(--ds-interaction-border-width) var(--ds-interaction-border-color)}.ds-interaction-fill--bordered.sc-ds-chart-legend-h,.ds-interaction-fill--bordered.sc-ds-chart-legend{--ds-interaction-border-width:var(--dimension-stroke-width-012);--ds-interaction-border-color:var(--color-border-secondary)}.ds-interaction-fill--selected.sc-ds-chart-legend-h::before,.ds-interaction-fill--selected.sc-ds-chart-legend::before{background:var(--ds-interaction-active)}.ds-interaction-fill--selected.sc-ds-chart-legend-h,.ds-interaction-fill--selected.sc-ds-chart-legend{--ds-interaction-dot-ring:var(--ds-interaction-active)}@media (hover: hover) and (pointer: fine){.ds-interaction-fill.sc-ds-chart-legend-h:hover:not(:disabled)::after,.ds-interaction-fill.sc-ds-chart-legend:hover:not(:disabled)::after{background:var(--ds-interaction-hover)}}.ds-interaction-fill.sc-ds-chart-legend-h:active:not(:disabled)::after,.ds-interaction-fill.sc-ds-chart-legend:active:not(:disabled)::after{background:var(--ds-interaction-pressed)}.ds-interaction-fill--grouped.sc-ds-chart-legend-h::after,.ds-interaction-fill--grouped.sc-ds-chart-legend::after,.ds-interaction-fill--grouped.sc-ds-chart-legend-h:active:not(:disabled)::after,.ds-interaction-fill--grouped.sc-ds-chart-legend:active:not(:disabled)::after{background:var(--ds-interaction-group-fill, transparent)}@media (hover: hover) and (pointer: fine){.ds-interaction-fill--grouped.sc-ds-chart-legend-h:hover:not(:disabled)::after,.ds-interaction-fill--grouped.sc-ds-chart-legend:hover:not(:disabled)::after{background:var(--ds-interaction-group-fill, transparent)}}.ds-interaction-fill--grouped.sc-ds-chart-legend-h,.ds-interaction-fill--grouped.sc-ds-chart-legend{--ds-interaction-divider-width:var(--ds-interaction-group-divider-width, 0px);--ds-interaction-divider-color:var(--ds-interaction-group-divider-color, transparent);--ds-interaction-divider-inline-start-width:var(     --ds-interaction-group-divider-inline-start-width,     0px   );--ds-interaction-divider-inline-start-color:var(     --ds-interaction-group-divider-inline-start-color,     transparent   );--ds-interaction-divider-inline-end-width:var(     --ds-interaction-group-divider-inline-end-width,     0px   );--ds-interaction-divider-inline-end-color:var(     --ds-interaction-group-divider-inline-end-color,     transparent   )}.ds-interaction-fill.sc-ds-chart-legend-h>.ds-interaction-fill__content.sc-ds-chart-legend,.ds-interaction-fill.sc-ds-chart-legend>.ds-interaction-fill__content.sc-ds-chart-legend,.ds-interaction-fill__content.sc-ds-chart-legend{position:relative;z-index:2;cursor:inherit}.ds-interaction-fill--on-faint.sc-ds-chart-legend-h,.ds-interaction-fill--on-faint.sc-ds-chart-legend{--ds-interaction-active:var(--color-interaction-active)}.ds-interaction-fill--on-medium.sc-ds-chart-legend-h,.ds-interaction-fill--on-medium.sc-ds-chart-legend{--ds-interaction-hover:var(--color-interaction-on-medium-background-hover);--ds-interaction-pressed:var(--color-interaction-on-medium-background-pressed);--ds-interaction-active:var(--color-interaction-on-medium-background-active);--ds-focus-ring-color:var(--color-interaction-on-medium-background-focus)}.ds-interaction-fill--on-bold.sc-ds-chart-legend-h,.ds-interaction-fill--on-bold.sc-ds-chart-legend{--ds-interaction-hover:var(--color-interaction-on-bold-background-hover);--ds-interaction-pressed:var(--color-interaction-on-bold-background-pressed);--ds-interaction-active:var(--color-interaction-on-bold-background-active);--ds-focus-ring-color:var(--color-interaction-on-bold-background-focus)}.ds-interaction-fill--on-strong.sc-ds-chart-legend-h,.ds-interaction-fill--on-strong.sc-ds-chart-legend{--ds-interaction-hover:var(--color-interaction-on-strong-background-hover);--ds-interaction-pressed:var(--color-interaction-on-strong-background-pressed);--ds-interaction-active:var(--color-interaction-on-strong-background-active);--ds-focus-ring-color:var(--color-interaction-on-strong-background-focus)}.ds-interaction-fill--on-translucent.sc-ds-chart-legend-h,.ds-interaction-fill--on-translucent.sc-ds-chart-legend{--ds-interaction-hover:var(--color-translucent-interaction-hover);--ds-interaction-pressed:var(--color-translucent-interaction-pressed);--ds-interaction-active:var(--color-translucent-interaction-active-brand);--ds-focus-ring-color:var(--color-translucent-interaction-focus)}.ds-interaction-fill--on-inverted.sc-ds-chart-legend-h,.ds-interaction-fill--on-inverted.sc-ds-chart-legend{--ds-interaction-hover:var(--color-inverted-interaction-hover);--ds-interaction-pressed:var(--color-inverted-interaction-pressed);--ds-interaction-active:var(--color-inverted-interaction-active-brand);--ds-focus-ring-color:var(--color-inverted-interaction-focus)}.ds-interaction-fill--on-media.sc-ds-chart-legend-h,.ds-interaction-fill--on-media.sc-ds-chart-legend{--ds-interaction-hover:var(--color-media-interaction-hover);--ds-interaction-pressed:var(--color-media-interaction-pressed);--ds-interaction-active:var(--color-media-interaction-active);--ds-focus-ring-color:var(--color-media-interaction-focus)}.ds-interaction-fill--on-always-dark.sc-ds-chart-legend-h,.ds-interaction-fill--on-always-dark.sc-ds-chart-legend{--ds-interaction-hover:var(--color-always-dark-interaction-hover);--ds-interaction-pressed:var(--color-always-dark-interaction-pressed);--ds-interaction-active:var(--color-always-dark-interaction-active-brand);--ds-focus-ring-color:var(--color-always-dark-interaction-focus)}.ds-interaction-fill--on-navigation.sc-ds-chart-legend-h,.ds-interaction-fill--on-navigation.sc-ds-chart-legend{--ds-interaction-hover:var(--color-navigation-interaction-hover);--ds-interaction-pressed:var(--color-navigation-interaction-pressed);--ds-interaction-active:var(--color-navigation-interaction-active);--ds-focus-ring-color:var(--color-navigation-interaction-focus)}@media (forced-colors: active){.ds-interaction-fill.sc-ds-chart-legend-h::after,.ds-interaction-fill.sc-ds-chart-legend::after{box-shadow:none;outline:var(--ds-interaction-border-width) solid       var(--ds-forced-color-control-boundary);outline-offset:calc(-1 * var(--ds-interaction-border-width))}.ds-interaction-fill--selected.sc-ds-chart-legend-h::before,.ds-interaction-fill--selected.sc-ds-chart-legend::before{background:transparent;outline:var(--dimension-stroke-width-025) solid var(--ds-forced-color-selected);outline-offset:calc(-1 * var(--dimension-stroke-width-025))}}@media (forced-colors: active) and (hover: hover) and (pointer: fine){.ds-interaction-fill.sc-ds-chart-legend-h:hover:not(:disabled):not(:focus-visible):not(:focus-within):not(.ds-focus-ring--visible)::after,.ds-interaction-fill.sc-ds-chart-legend:hover:not(:disabled):not(:focus-visible):not(:focus-within):not(.ds-focus-ring--visible)::after{outline-color:var(--ds-forced-color-selected);outline-width:var(--dimension-stroke-width-012)}}@media (forced-colors: active){.sc-ds-chart-legend:root,.sc-ds-chart-legend-h,.ds-forced-colors-scope.sc-ds-chart-legend{--ds-forced-color-surface:Canvas;--ds-forced-color-content:CanvasText;--ds-forced-color-control-boundary:ButtonText;--ds-forced-color-selected:Highlight;--ds-forced-color-on-selected:HighlightText;--ds-forced-color-disabled:GrayText}}.sc-ds-chart-legend-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-chart-legend-h,.ds-focus-ring.sc-ds-chart-legend,.ds-focus-ring-inset.sc-ds-chart-legend-h,.ds-focus-ring-inset.sc-ds-chart-legend{outline:none;-webkit-tap-highlight-color:transparent;touch-action:manipulation}.ds-focus-ring.sc-ds-chart-legend-h:focus-visible,.ds-focus-ring.sc-ds-chart-legend: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-chart-legend-h,.ds-focus-ring.ds-focus-ring--visible.sc-ds-chart-legend{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-chart-legend-h:focus-visible,.ds-focus-ring-inset.sc-ds-chart-legend:focus-visible{outline:none}.ds-focus-ring-inset.sc-ds-chart-legend-h:focus-visible::after,.ds-focus-ring-inset.sc-ds-chart-legend: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-chart-legend-h,.ds-focus-ring-inset.ds-focus-ring--visible.sc-ds-chart-legend{outline:none}.ds-focus-ring-inset.ds-focus-ring--visible.sc-ds-chart-legend-h::after,.ds-focus-ring-inset.ds-focus-ring--visible.sc-ds-chart-legend::after{outline:var(--ds-focus-ring-width) solid var(--ds-focus-ring-color);outline-offset:calc(-1 * var(--ds-focus-ring-width))}@media (forced-colors: active){.sc-ds-chart-legend-h{--ds-focus-ring-color:var(--ds-forced-color-selected)}}@media (forced-colors: active){.sc-ds-chart-legend:root,.sc-ds-chart-legend-h,.ds-forced-colors-scope.sc-ds-chart-legend{--ds-forced-color-surface:Canvas;--ds-forced-color-content:CanvasText;--ds-forced-color-control-boundary:ButtonText;--ds-forced-color-selected:Highlight;--ds-forced-color-on-selected:HighlightText;--ds-forced-color-disabled:GrayText}}.sc-ds-chart-legend-h{display:block;font-family:var(--typography-font-family-ui);user-select:none}.chart-legend__list.sc-ds-chart-legend{margin:0;padding:0;list-style:none}.chart-legend__list-item.sc-ds-chart-legend{display:contents}.chart-legend--vertical.sc-ds-chart-legend-h .chart-legend__list.sc-ds-chart-legend{display:grid;grid-template-columns:auto minmax(0, 1fr) var(--dimension-size-600);column-gap:var(--dimension-space-075);row-gap:var(--dimension-space-050)}.chart-legend--vertical.chart-legend--show-percentage.sc-ds-chart-legend-h .chart-legend__list.sc-ds-chart-legend{grid-template-columns:auto minmax(0, 1fr) var(--dimension-size-600) var(--dimension-size-800)}.chart-legend--vertical.sc-ds-chart-legend-h .chart-legend__item.sc-ds-chart-legend{grid-column:1 / -1;display:grid;grid-template-columns:subgrid}.chart-legend--horizontal.sc-ds-chart-legend-h .chart-legend__list.sc-ds-chart-legend{display:flex;flex-wrap:wrap;gap:var(--dimension-space-200)}.chart-legend--horizontal.sc-ds-chart-legend-h .chart-legend__item.sc-ds-chart-legend{display:flex;gap:var(--dimension-space-100)}.chart-legend__item.sc-ds-chart-legend{box-sizing:border-box;height:var(--ds-control-height, var(--dimension-size-400));align-items:center;padding:0 var(--ds-control-padding-inline, var(--dimension-space-075));border-radius:var(--ds-control-radius, var(--dimension-radius-025));text-decoration:none;color:inherit;transition:opacity var(--effect-motion-short-2)}.chart-legend__item--dimmed.sc-ds-chart-legend{opacity:var(--effect-opacity-medium)}@media (prefers-reduced-motion: reduce){.chart-legend__item.sc-ds-chart-legend{transition:none}}.chart-legend__item--interactive.sc-ds-chart-legend{cursor:pointer}.chart-legend__item.sc-ds-chart-legend>*.sc-ds-chart-legend{position:relative;z-index:2}.chart-legend__swatch-box.sc-ds-chart-legend{width:var(--dimension-size-250);height:var(--dimension-size-250);display:flex;align-items:center;justify-content:center;flex-shrink:0}.chart-legend__swatch.sc-ds-chart-legend{width:var(--dimension-space-150);height:var(--dimension-space-150);border-radius:var(--dimension-radius-025);flex-shrink:0}.chart-legend__label.sc-ds-chart-legend{min-width:0}.chart-legend__percentage.sc-ds-chart-legend{width:100%;min-width:0;text-align:right}.chart-legend__value.sc-ds-chart-legend{width:100%;text-align:right;min-width:0}@media (forced-colors: active){.chart-legend__swatch.sc-ds-chart-legend{forced-color-adjust:none;outline:var(--dimension-stroke-width-012) solid var(--ds-forced-color-content)}}`;const v=e(class e extends n{constructor(e){super();if(e!==false){this.__registerHost()}this.dsItemHover=t(this,"dsItemHover");this.dsItemClick=t(this,"dsItemClick");this.items=[];this.direction="vertical";this.showPercentage=true;this.percentageDecimals=1;this.highlightOnHover=true;this.activeLabel=null;this.hoveredLabel=null;this.handleClick=(e,n)=>{this.dsItemClick.emit({item:e,originalEvent:n})}}handleHighlightOnHoverChange(e){if(!e)this.hoveredLabel=null}handleHover(e){this.hoveredLabel=e?.label??null;this.dsItemHover.emit(e)}render(){const e=this.items.reduce(((e,n)=>e+(n.value??0)),0);const n=this.activeLabel??(this.highlightOnHover?this.hoveredLabel:null);return i(r,{key:"81612f79de5307cd4ed021ee5762ad6b0505be27",class:{"chart-legend":true,[`chart-legend--${this.direction}`]:true,"chart-legend--show-percentage":this.showPercentage}},i("ul",{key:"c544ade493dbd6009b21ab0ec26c785ab86d2ba4",class:"chart-legend__list",onMouseLeave:this.highlightOnHover?()=>this.handleHover(null):undefined},this.items.map(((t,r)=>{const s=n!=null&&t.label!==n;const d=c(t.href);const a=d?"a":"div";const g=t.value!=null?h(e?t.value/e:0,this.percentageDecimals,this.locale):"";return i("li",{class:"chart-legend__list-item",key:t.label},i(a,{class:{"chart-legend__item":true,"chart-legend__item--interactive":!!d,"chart-legend__item--dimmed":s,"ds-control--md":true,"ds-interaction-fill":this.highlightOnHover||!!d,"ds-focus-ring-inset":!!d},href:d,onClick:d?e=>this.handleClick(t,e):undefined,onMouseEnter:this.highlightOnHover?()=>this.handleHover(t):undefined,onFocus:this.highlightOnHover?()=>this.handleHover(t):undefined,onBlur:this.highlightOnHover?()=>this.handleHover(null):undefined},i("span",{class:"chart-legend__swatch-box"},i("span",{class:"chart-legend__swatch",style:{backgroundColor:t.color??o(r)}})),i("ds-text",{class:"chart-legend__label",as:"span",variant:"text-body-medium",color:"secondary",lineTruncation:1,title:t.label},t.label),t.value!=null&&i("ds-text",{class:"chart-legend__value",as:"span",variant:"text-body-medium",color:"primary",lineTruncation:1,align:"right",fontFeature:"tabular-nums",title:String(t.value)},l(t.value,this.locale)),t.value!=null&&this.showPercentage&&i("ds-text",{class:"chart-legend__percentage",as:"span",variant:"text-body-medium",color:"primary",lineTruncation:1,align:"right",fontFeature:"tabular-nums",title:g},g)))}))))}static get watchers(){return{highlightOnHover:[{handleHighlightOnHoverChange:0}]}}static get style(){return g()}},[2,"ds-chart-legend",{locale:[1],items:[16],direction:[1],showPercentage:[4,"show-percentage"],percentageDecimals:[2,"percentage-decimals"],highlightOnHover:[4,"highlight-on-hover"],activeLabel:[1,"active-label"],hoveredLabel:[32]},undefined,{highlightOnHover:[{handleHighlightOnHoverChange:0}]}]);function f(){if(typeof customElements==="undefined"){return}const e=["ds-chart-legend","ds-text"];e.forEach((e=>{switch(e){case"ds-chart-legend":if(!customElements.get(s(e))){customElements.define(s(e),v)}break;case"ds-text":if(!customElements.get(s(e))){d()}break}}))}f();const u=v;const m=f;export{u as DsChartLegend,m as defineCustomElement};
 //# sourceMappingURL=ds-chart-legend.js.map

package/dist/components/ds-chart-legend.js.map

@@ -1 +1 @@
-{"version":3,"names":["COMPACT_UNITS","threshold","suffix","formatCompactNumber","value","locale","Intl","NumberFormat","notation","compactDisplay","maximumFractionDigits","format","sign","abs","Math","String","i","length","unit","scaled","round","next","formatPercentage","ratio","decimals","precision","Number","isFinite","style","minimumFractionDigits","chartLegendCss","ChartLegend","__stencil_proxyCustomElement","HTMLElement","constructor","registerHost","this","items","direction","showPercentage","percentageDecimals","highlightOnHover","activeLabel","hoveredLabel","handleClick","item","originalEvent","dsItemClick","emit","handleHighlightOnHoverChange","enabled","handleHover","label","dsItemHover","render","total","reduce","sum","highlightLabel","h","Host","key","class","onMouseLeave","undefined","map","isDimmed","href","resolveSafeUrl","RowTag","percentage","onClick","e","onMouseEnter","onFocus","onBlur","backgroundColor","color","categoryColor","as","variant","lineTruncation","title","align","fontFeature"],"sources":["src/wc/utils/format-compact-number.ts","src/wc/utils/format-percentage.ts","src/wc/components/ChartLegend/ChartLegend.css?tag=ds-chart-legend&encapsulation=scoped","src/wc/components/ChartLegend/ChartLegend.tsx"],"sourcesContent":["const COMPACT_UNITS: { threshold: number; suffix: string }[] = [\n  { threshold: 1_000_000_000, suffix: 'b' },\n  { threshold: 1_000_000, suffix: 'm' },\n  { threshold: 1_000, suffix: 'k' },\n];\n\n/** Compact large numbers for display: 1000 -> \"1k\", 1500 -> \"1.5k\", 110100 -> \"110.1k\", 1000000 -> \"1m\". */\nexport function formatCompactNumber(value: number, locale?: string): string {\n  if (locale) {\n    return new Intl.NumberFormat(locale, {\n      notation: 'compact',\n      compactDisplay: 'short',\n      maximumFractionDigits: 1,\n    }).format(value);\n  }\n  const sign = value < 0 ? '-' : '';\n  const abs = Math.abs(value);\n  if (abs < 1000) return String(value);\n\n  for (let i = 0; i < COMPACT_UNITS.length; i++) {\n    const unit = COMPACT_UNITS[i];\n    if (abs < unit.threshold) continue;\n\n    let scaled = Math.round((abs / unit.threshold) * 10) / 10;\n    // Carry over, e.g. 999.96k rounds to \"1000k\" — bump to the next unit instead.\n    if (scaled >= 1000 && i > 0) {\n      const next = COMPACT_UNITS[i - 1];\n      scaled = Math.round((abs / next.threshold) * 10) / 10;\n      return `${sign}${scaled}${next.suffix}`;\n    }\n    return `${sign}${scaled}${unit.suffix}`;\n  }\n  return String(value);\n}\n","export type PercentageDecimals = 1 | 2;\n\n/** Format a ratio as a locale-aware percentage with an exact, supported precision. */\nexport function formatPercentage(\n  ratio: number,\n  decimals: PercentageDecimals = 1,\n  locale?: string,\n): string {\n  const precision = decimals === 2 ? 2 : 1;\n  const value = Number.isFinite(ratio) ? ratio : 0;\n\n  return new Intl.NumberFormat(locale, {\n    style: 'percent',\n    minimumFractionDigits: precision,\n    maximumFractionDigits: precision,\n  }).format(value);\n}\n","@import '../../utils/control-density.css';\n@import '../../utils/interaction-fill.css';\n@import '../../utils/focus-ring.css';\n@import '../../utils/forced-colors.css';\n\n:host {\n  display: block;\n  font-family: var(--typography-font-family-ui);\n  user-select: none;\n}\n\n.chart-legend__list {\n  margin: 0;\n  padding: 0;\n  list-style: none;\n}\n\n/* Non-visual wrapper — the real box is .chart-legend__item so optional highlight/link\n   affordances cover the whole row while children align to the shared grid columns. */\n.chart-legend__list-item {\n  display: contents;\n}\n\n:host(.chart-legend--vertical) .chart-legend__list {\n  display: grid;\n  grid-template-columns: auto minmax(0, 1fr) var(--dimension-size-600);\n  column-gap: var(--dimension-space-075);\n  row-gap: var(--dimension-space-050);\n}\n\n:host(.chart-legend--vertical.chart-legend--show-percentage) .chart-legend__list {\n  grid-template-columns: auto minmax(0, 1fr) var(--dimension-size-600) var(--dimension-size-800);\n}\n\n:host(.chart-legend--vertical) .chart-legend__item {\n  grid-column: 1 / -1;\n  display: grid;\n  grid-template-columns: subgrid;\n}\n\n:host(.chart-legend--horizontal) .chart-legend__list {\n  display: flex;\n  flex-wrap: wrap;\n  gap: var(--dimension-space-200);\n}\n\n:host(.chart-legend--horizontal) .chart-legend__item {\n  display: flex;\n  gap: var(--dimension-space-100);\n}\n\n/*\n * Density: md control recipe (height / pad / radius / label inset).\n * Hover/press: `.ds-interaction-fill` (token overlay on ::after).\n */\n.chart-legend__item {\n  box-sizing: border-box;\n  height: var(--ds-control-height, var(--dimension-size-400));\n  align-items: center;\n  padding: 0 var(--ds-control-padding-inline, var(--dimension-space-075));\n  border-radius: var(--ds-control-radius, var(--dimension-radius-025));\n  text-decoration: none;\n  color: inherit;\n  transition: opacity var(--effect-motion-short-2);\n}\n\n.chart-legend__item--dimmed {\n  opacity: var(--effect-opacity-medium);\n}\n\n@media (prefers-reduced-motion: reduce) {\n  .chart-legend__item {\n    transition: none;\n  }\n}\n\n.chart-legend__item--interactive {\n  cursor: pointer;\n}\n\n/* Raise row content above interaction fills (positive z-index on util layers). */\n.chart-legend__item > * {\n  position: relative;\n  z-index: 2;\n}\n\n.chart-legend__swatch-box {\n  width: var(--dimension-size-250);\n  height: var(--dimension-size-250);\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  flex-shrink: 0;\n}\n\n.chart-legend__swatch {\n  width: var(--dimension-space-150);\n  height: var(--dimension-space-150);\n  border-radius: var(--dimension-radius-025);\n  flex-shrink: 0;\n}\n\n.chart-legend__label {\n  min-width: 0;\n}\n\n.chart-legend__percentage {\n  width: 100%;\n  min-width: 0;\n  text-align: right;\n}\n\n.chart-legend__value {\n  width: 100%;\n  text-align: right;\n  min-width: 0;\n}\n\n@media (forced-colors: active) {\n  .chart-legend__swatch {\n    forced-color-adjust: none;\n    outline: var(--dimension-stroke-width-012) solid var(--ds-forced-color-content);\n  }\n}\n","import { Component, Prop, State, Event, EventEmitter, h, Host, Watch } from '@stencil/core';\nimport { categoryColor } from '../../utils/chart-colors';\nimport { formatCompactNumber, formatPercentage, resolveSafeUrl } from '../../utils';\nimport type { ChartLegendItem } from '../../utils/chart-types';\n\nexport type ChartLegendDirection = 'vertical' | 'horizontal';\nexport type ChartLegendPercentageDecimals = 1 | 2;\n\n/**\n * Base legend for `ds-chart-*` components. Webapp's Overview widgets each style\n * legends differently (list w/ values, compact chips, bare swatches, external\n * stat callouts) — this covers the common \"swatch + label + optional value\" case.\n * Consumers who need a different treatment skip this component entirely and\n * render their own markup against the same `ChartLegendItem[]` data.\n */\n@Component({\n  tag: 'ds-chart-legend',\n  styleUrl: 'ChartLegend.css',\n  scoped: true,\n})\nexport class ChartLegend {\n  @Prop() locale: string | undefined;\n  /** Legend entries. Set as a JS property (not an HTML attribute). */\n  @Prop() items: ChartLegendItem[] = [];\n  @Prop() direction: ChartLegendDirection = 'vertical';\n  /** Show each item's share of the total (of items with a `value`) alongside its count. */\n  @Prop() showPercentage: boolean = true;\n  /** Fixed number of decimal places shown for percentages. */\n  @Prop() percentageDecimals: ChartLegendPercentageDecimals = 1;\n  /** Let local pointer/focus movement highlight one item and emit `dsItemHover`. */\n  @Prop() highlightOnHover: boolean = true;\n  /**\n   * Externally controlled highlight, matched by `label` — e.g. drive this from a sibling\n   * chart's `dsSliceHover` event to keep chart and legend hover in sync. Only dims the other\n   * rows' opacity (like a chart dimming its other slices) — it never shows the hover-fill,\n   * since that's reserved for a real pointer/keyboard interaction on this row.\n   */\n  @Prop() activeLabel: string | null = null;\n\n  /** Own pointer/focus hover, kept separate from `activeLabel` so the hover-fill (a \"you can\n   * click here\" affordance) never shows just because an external row was synced in. */\n  @State() private hoveredLabel: string | null = null;\n\n  /** Fires on row hover/focus with the item, or `null` on leave/blur. */\n  @Event() dsItemHover!: EventEmitter<ChartLegendItem | null>;\n  /** Fires when a deep-linkable row (`item.href` set) is activated. */\n  @Event() dsItemClick!: EventEmitter<{ item: ChartLegendItem; originalEvent: MouseEvent }>;\n\n  @Watch('highlightOnHover')\n  handleHighlightOnHoverChange(enabled: boolean) {\n    if (!enabled) this.hoveredLabel = null;\n  }\n\n  private handleHover(item: ChartLegendItem | null) {\n    this.hoveredLabel = item?.label ?? null;\n    this.dsItemHover.emit(item);\n  }\n\n  private handleClick = (item: ChartLegendItem, originalEvent: MouseEvent) => {\n    this.dsItemClick.emit({ item, originalEvent });\n  };\n\n  render() {\n    const total = this.items.reduce((sum, item) => sum + (item.value ?? 0), 0);\n    // Highlight/dim from either this component's own hover or an externally-synced label\n    // (e.g. an application-owned chart focus state).\n    const highlightLabel = this.activeLabel ?? (this.highlightOnHover ? this.hoveredLabel : null);\n\n    return (\n      <Host\n        class={{\n          'chart-legend': true,\n          [`chart-legend--${this.direction}`]: true,\n          'chart-legend--show-percentage': this.showPercentage,\n        }}\n      >\n        {/* mouseleave lives on the list, not each row — the row-gap between items is still\n            inside the list's box, so crossing it while moving between rows never fires this.\n            Only actually leaving the whole list does, and that clears with no delay. */}\n        <ul\n          class=\"chart-legend__list\"\n          onMouseLeave={this.highlightOnHover ? () => this.handleHover(null) : undefined}\n        >\n          {this.items.map((item, i) => {\n            const isDimmed = highlightLabel != null && item.label !== highlightLabel;\n            const href = resolveSafeUrl(item.href);\n            const RowTag = href ? 'a' : 'div';\n            const percentage = item.value != null\n              ? formatPercentage(total ? item.value / total : 0, this.percentageDecimals, this.locale)\n              : '';\n\n            return (\n              <li class=\"chart-legend__list-item\" key={item.label}>\n                <RowTag\n                  class={{\n                    'chart-legend__item': true,\n                    'chart-legend__item--interactive': !!href,\n                    'chart-legend__item--dimmed': isDimmed,\n                    'ds-control--md': true,\n                    'ds-interaction-fill': this.highlightOnHover || !!href,\n                    'ds-focus-ring-inset': !!href,\n                  }}\n                  href={href}\n                  onClick={href ? (e: MouseEvent) => this.handleClick(item, e) : undefined}\n                  onMouseEnter={\n                    this.highlightOnHover ? () => this.handleHover(item) : undefined\n                  }\n                  onFocus={this.highlightOnHover ? () => this.handleHover(item) : undefined}\n                  onBlur={this.highlightOnHover ? () => this.handleHover(null) : undefined}\n                >\n                  <span class=\"chart-legend__swatch-box\">\n                    <span class=\"chart-legend__swatch\" style={{ backgroundColor: item.color ?? categoryColor(i) }} />\n                  </span>\n                  <ds-text\n                    class=\"chart-legend__label\"\n                    as=\"span\"\n                    variant=\"text-body-medium\"\n                    color=\"secondary\"\n                    lineTruncation={1}\n                    title={item.label}\n                  >\n                    {item.label}\n                  </ds-text>\n                  {item.value != null && (\n                    <ds-text\n                      class=\"chart-legend__value\"\n                      as=\"span\"\n                      variant=\"text-body-medium\"\n                      color=\"primary\"\n                      lineTruncation={1}\n                      align=\"right\"\n                      fontFeature=\"tabular-nums\"\n                      title={String(item.value)}\n                    >\n                      {formatCompactNumber(item.value, this.locale)}\n                    </ds-text>\n                  )}\n                  {item.value != null && this.showPercentage && (\n                    <ds-text\n                      class=\"chart-legend__percentage\"\n                      as=\"span\"\n                      variant=\"text-body-medium\"\n                      color=\"primary\"\n                      lineTruncation={1}\n                      align=\"right\"\n                      fontFeature=\"tabular-nums\"\n                      title={percentage}\n                    >\n                      {percentage}\n                    </ds-text>\n                  )}\n                </RowTag>\n              </li>\n            );\n          })}\n        </ul>\n      </Host>\n    );\n  }\n}\n"],"mappings":"yKAAA,MAAMA,EAAyD,CAC7D,CAAEC,UAAW,IAAeC,OAAQ,KACpC,CAAED,UAAW,IAAWC,OAAQ,KAChC,CAAED,UAAW,IAAOC,OAAQ,MAIxB,SAAUC,EAAoBC,EAAeC,GACjD,GAAIA,EAAQ,CACV,OAAO,IAAIC,KAAKC,aAAaF,EAAQ,CACnCG,SAAU,UACVC,eAAgB,QAChBC,sBAAuB,IACtBC,OAAOP,E,CAEZ,MAAMQ,EAAOR,EAAQ,EAAI,IAAM,GAC/B,MAAMS,EAAMC,KAAKD,IAAIT,GACrB,GAAIS,EAAM,IAAM,OAAOE,OAAOX,GAE9B,IAAK,IAAIY,EAAI,EAAGA,EAAIhB,EAAciB,OAAQD,IAAK,CAC7C,MAAME,EAAOlB,EAAcgB,GAC3B,GAAIH,EAAMK,EAAKjB,UAAW,SAE1B,IAAIkB,EAASL,KAAKM,MAAOP,EAAMK,EAAKjB,UAAa,IAAM,GAEvD,GAAIkB,GAAU,KAAQH,EAAI,EAAG,CAC3B,MAAMK,EAAOrB,EAAcgB,EAAI,GAC/BG,EAASL,KAAKM,MAAOP,EAAMQ,EAAKpB,UAAa,IAAM,GACnD,MAAO,GAAGW,IAAOO,IAASE,EAAKnB,Q,CAEjC,MAAO,GAAGU,IAAOO,IAASD,EAAKhB,Q,CAEjC,OAAOa,OAAOX,EAChB,CC9BM,SAAUkB,EACdC,EACAC,EAA+B,EAC/BnB,GAEA,MAAMoB,EAAYD,IAAa,EAAI,EAAI,EACvC,MAAMpB,EAAQsB,OAAOC,SAASJ,GAASA,EAAQ,EAE/C,OAAO,IAAIjB,KAAKC,aAAaF,EAAQ,CACnCuB,MAAO,UACPC,sBAAuBJ,EACvBf,sBAAuBe,IACtBd,OAAOP,EACZ,CChBA,MAAM0B,EAAiB,IAAM,8ie,MCoBhBC,EAAWC,EAAA,MAAAD,UAAAE,EALxB,WAAAC,CAAAC,G,0HAQUC,KAAAC,MAA2B,GAC3BD,KAAAE,UAAkC,WAElCF,KAAAG,eAA0B,KAE1BH,KAAAI,mBAAoD,EAEpDJ,KAAAK,iBAA4B,KAO5BL,KAAAM,YAA6B,KAIpBN,KAAAO,aAA8B,KAiBvCP,KAAAQ,YAAc,CAACC,EAAuBC,KAC5CV,KAAKW,YAAYC,KAAK,CAAEH,OAAMC,iBAAgB,CAoGjD,CA9GC,4BAAAG,CAA6BC,GAC3B,IAAKA,EAASd,KAAKO,aAAe,I,CAG5B,WAAAQ,CAAYN,GAClBT,KAAKO,aAAeE,GAAMO,OAAS,KACnChB,KAAKiB,YAAYL,KAAKH,E,CAOxB,MAAAS,GACE,MAAMC,EAAQnB,KAAKC,MAAMmB,QAAO,CAACC,EAAKZ,IAASY,GAAOZ,EAAKzC,OAAS,IAAI,GAGxE,MAAMsD,EAAiBtB,KAAKM,cAAgBN,KAAKK,iBAAmBL,KAAKO,aAAe,MAExF,OACEgB,EAACC,EAAI,CAAAC,IAAA,2CACHC,MAAO,CACL,eAAgB,KAChB,CAAC,iBAAiB1B,KAAKE,aAAc,KACrC,gCAAiCF,KAAKG,iBAMxCoB,EAAA,MAAAE,IAAA,2CACEC,MAAM,qBACNC,aAAc3B,KAAKK,iBAAmB,IAAML,KAAKe,YAAY,MAAQa,WAEpE5B,KAAKC,MAAM4B,KAAI,CAACpB,EAAM7B,KACrB,MAAMkD,EAAWR,GAAkB,MAAQb,EAAKO,QAAUM,EAC1D,MAAMS,EAAOC,EAAevB,EAAKsB,MACjC,MAAME,EAASF,EAAO,IAAM,MAC5B,MAAMG,EAAazB,EAAKzC,OAAS,KAC7BkB,EAAiBiC,EAAQV,EAAKzC,MAAQmD,EAAQ,EAAGnB,KAAKI,mBAAoBJ,KAAK/B,QAC/E,GAEJ,OACEsD,EAAA,MAAIG,MAAM,0BAA0BD,IAAKhB,EAAKO,OAC5CO,EAACU,EAAM,CACLP,MAAO,CACL,qBAAsB,KACtB,oCAAqCK,EACrC,6BAA8BD,EAC9B,iBAAkB,KAClB,sBAAuB9B,KAAKK,oBAAsB0B,EAClD,wBAAyBA,GAE3BA,KAAMA,EACNI,QAASJ,EAAQK,GAAkBpC,KAAKQ,YAAYC,EAAM2B,GAAKR,UAC/DS,aACErC,KAAKK,iBAAmB,IAAML,KAAKe,YAAYN,GAAQmB,UAEzDU,QAAStC,KAAKK,iBAAmB,IAAML,KAAKe,YAAYN,GAAQmB,UAChEW,OAAQvC,KAAKK,iBAAmB,IAAML,KAAKe,YAAY,MAAQa,WAE/DL,EAAA,QAAMG,MAAM,4BACVH,EAAA,QAAMG,MAAM,uBAAuBlC,MAAO,CAAEgD,gBAAiB/B,EAAKgC,OAASC,EAAc9D,OAE3F2C,EAAA,WACEG,MAAM,sBACNiB,GAAG,OACHC,QAAQ,mBACRH,MAAM,YACNI,eAAgB,EAChBC,MAAOrC,EAAKO,OAEXP,EAAKO,OAEPP,EAAKzC,OAAS,MACbuD,EAAA,WACEG,MAAM,sBACNiB,GAAG,OACHC,QAAQ,mBACRH,MAAM,UACNI,eAAgB,EAChBE,MAAM,QACNC,YAAY,eACZF,MAAOnE,OAAO8B,EAAKzC,QAElBD,EAAoB0C,EAAKzC,MAAOgC,KAAK/B,SAGzCwC,EAAKzC,OAAS,MAAQgC,KAAKG,gBAC1BoB,EAAA,WACEG,MAAM,2BACNiB,GAAG,OACHC,QAAQ,mBACRH,MAAM,UACNI,eAAgB,EAChBE,MAAM,QACNC,YAAY,eACZF,MAAOZ,GAENA,IAIJ,K","ignoreList":[]}
+{"version":3,"names":["COMPACT_UNITS","threshold","suffix","formatCompactNumber","value","locale","Intl","NumberFormat","notation","compactDisplay","maximumFractionDigits","format","sign","abs","Math","String","i","length","unit","scaled","round","next","formatPercentage","ratio","decimals","precision","Number","isFinite","style","minimumFractionDigits","chartLegendCss","ChartLegend","__stencil_proxyCustomElement","HTMLElement","constructor","registerHost","this","items","direction","showPercentage","percentageDecimals","highlightOnHover","activeLabel","hoveredLabel","handleClick","item","originalEvent","dsItemClick","emit","handleHighlightOnHoverChange","enabled","handleHover","label","dsItemHover","render","total","reduce","sum","highlightLabel","h","Host","key","class","onMouseLeave","undefined","map","isDimmed","href","resolveSafeUrl","RowTag","percentage","onClick","e","onMouseEnter","onFocus","onBlur","backgroundColor","color","categoryColor","as","variant","lineTruncation","title","align","fontFeature"],"sources":["src/wc/utils/format-compact-number.ts","src/wc/utils/format-percentage.ts","src/wc/components/ChartLegend/ChartLegend.css?tag=ds-chart-legend&encapsulation=scoped","src/wc/components/ChartLegend/ChartLegend.tsx"],"sourcesContent":["const COMPACT_UNITS: { threshold: number; suffix: string }[] = [\n  { threshold: 1_000_000_000, suffix: 'b' },\n  { threshold: 1_000_000, suffix: 'm' },\n  { threshold: 1_000, suffix: 'k' },\n];\n\n/** Compact large numbers for display: 1000 -> \"1k\", 1500 -> \"1.5k\", 110100 -> \"110.1k\", 1000000 -> \"1m\". */\nexport function formatCompactNumber(value: number, locale?: string): string {\n  if (locale) {\n    return new Intl.NumberFormat(locale, {\n      notation: 'compact',\n      compactDisplay: 'short',\n      maximumFractionDigits: 1,\n    }).format(value);\n  }\n  const sign = value < 0 ? '-' : '';\n  const abs = Math.abs(value);\n  if (abs < 1000) return String(value);\n\n  for (let i = 0; i < COMPACT_UNITS.length; i++) {\n    const unit = COMPACT_UNITS[i];\n    if (abs < unit.threshold) continue;\n\n    let scaled = Math.round((abs / unit.threshold) * 10) / 10;\n    // Carry over, e.g. 999.96k rounds to \"1000k\" — bump to the next unit instead.\n    if (scaled >= 1000 && i > 0) {\n      const next = COMPACT_UNITS[i - 1];\n      scaled = Math.round((abs / next.threshold) * 10) / 10;\n      return `${sign}${scaled}${next.suffix}`;\n    }\n    return `${sign}${scaled}${unit.suffix}`;\n  }\n  return String(value);\n}\n","export type PercentageDecimals = 1 | 2;\n\n/** Format a ratio as a locale-aware percentage with an exact, supported precision. */\nexport function formatPercentage(\n  ratio: number,\n  decimals: PercentageDecimals = 1,\n  locale?: string,\n): string {\n  const precision = decimals === 2 ? 2 : 1;\n  const value = Number.isFinite(ratio) ? ratio : 0;\n\n  return new Intl.NumberFormat(locale, {\n    style: 'percent',\n    minimumFractionDigits: precision,\n    maximumFractionDigits: precision,\n  }).format(value);\n}\n","@import '../../utils/control-density.css';\n@import '../../utils/interaction-fill.css';\n@import '../../utils/focus-ring.css';\n@import '../../utils/forced-colors.css';\n\n:host {\n  display: block;\n  font-family: var(--typography-font-family-ui);\n  user-select: none;\n}\n\n.chart-legend__list {\n  margin: 0;\n  padding: 0;\n  list-style: none;\n}\n\n/* Non-visual wrapper — the real box is .chart-legend__item so optional highlight/link\n   affordances cover the whole row while children align to the shared grid columns. */\n.chart-legend__list-item {\n  display: contents;\n}\n\n:host(.chart-legend--vertical) .chart-legend__list {\n  display: grid;\n  grid-template-columns: auto minmax(0, 1fr) var(--dimension-size-600);\n  column-gap: var(--dimension-space-075);\n  row-gap: var(--dimension-space-050);\n}\n\n:host(.chart-legend--vertical.chart-legend--show-percentage) .chart-legend__list {\n  grid-template-columns: auto minmax(0, 1fr) var(--dimension-size-600) var(--dimension-size-800);\n}\n\n:host(.chart-legend--vertical) .chart-legend__item {\n  grid-column: 1 / -1;\n  display: grid;\n  grid-template-columns: subgrid;\n}\n\n:host(.chart-legend--horizontal) .chart-legend__list {\n  display: flex;\n  flex-wrap: wrap;\n  gap: var(--dimension-space-200);\n}\n\n:host(.chart-legend--horizontal) .chart-legend__item {\n  display: flex;\n  gap: var(--dimension-space-100);\n}\n\n/*\n * Density: md control recipe (height / pad / radius / label inset).\n * Hover/press: `.ds-interaction-fill` (token overlay on ::after).\n */\n.chart-legend__item {\n  box-sizing: border-box;\n  height: var(--ds-control-height, var(--dimension-size-400));\n  align-items: center;\n  padding: 0 var(--ds-control-padding-inline, var(--dimension-space-075));\n  border-radius: var(--ds-control-radius, var(--dimension-radius-025));\n  text-decoration: none;\n  color: inherit;\n  transition: opacity var(--effect-motion-short-2);\n}\n\n.chart-legend__item--dimmed {\n  opacity: var(--effect-opacity-medium);\n}\n\n@media (prefers-reduced-motion: reduce) {\n  .chart-legend__item {\n    transition: none;\n  }\n}\n\n.chart-legend__item--interactive {\n  cursor: pointer;\n}\n\n/* Raise row content above interaction fills (positive z-index on util layers). */\n.chart-legend__item > * {\n  position: relative;\n  z-index: 2;\n}\n\n.chart-legend__swatch-box {\n  width: var(--dimension-size-250);\n  height: var(--dimension-size-250);\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  flex-shrink: 0;\n}\n\n.chart-legend__swatch {\n  width: var(--dimension-space-150);\n  height: var(--dimension-space-150);\n  border-radius: var(--dimension-radius-025);\n  flex-shrink: 0;\n}\n\n.chart-legend__label {\n  min-width: 0;\n}\n\n.chart-legend__percentage {\n  width: 100%;\n  min-width: 0;\n  text-align: right;\n}\n\n.chart-legend__value {\n  width: 100%;\n  text-align: right;\n  min-width: 0;\n}\n\n@media (forced-colors: active) {\n  .chart-legend__swatch {\n    forced-color-adjust: none;\n    outline: var(--dimension-stroke-width-012) solid var(--ds-forced-color-content);\n  }\n}\n","import { Component, Prop, State, Event, EventEmitter, h, Host, Watch } from '@stencil/core';\nimport { categoryColor } from '../../utils/chart-colors';\nimport { formatCompactNumber, formatPercentage, resolveSafeUrl } from '../../utils';\nimport type { ChartLegendItem } from '../../utils/chart-types';\n\nexport type ChartLegendDirection = 'vertical' | 'horizontal';\nexport type ChartLegendPercentageDecimals = 1 | 2;\n\n/**\n * Base legend for `ds-chart-*` components. Webapp's Overview widgets each style\n * legends differently (list w/ values, compact chips, bare swatches, external\n * stat callouts) — this covers the common \"swatch + label + optional value\" case.\n * Consumers who need a different treatment skip this component entirely and\n * render their own markup against the same `ChartLegendItem[]` data.\n */\n@Component({\n  tag: 'ds-chart-legend',\n  styleUrl: 'ChartLegend.css',\n  scoped: true,\n})\nexport class ChartLegend {\n  @Prop() locale: string | undefined;\n  /** Legend entries. Set as a JS property (not an HTML attribute). */\n  @Prop() items: ChartLegendItem[] = [];\n  @Prop() direction: ChartLegendDirection = 'vertical';\n  /** Show each item's share of the total (of items with a `value`) alongside its count. */\n  @Prop() showPercentage: boolean = true;\n  /** Fixed number of decimal places shown for percentages. */\n  @Prop() percentageDecimals: ChartLegendPercentageDecimals = 1;\n  /** Let local pointer/focus movement highlight one item and emit `dsItemHover`. */\n  @Prop() highlightOnHover: boolean = true;\n  /**\n   * Externally controlled highlight, matched by `label` — e.g. drive this from a sibling\n   * chart's `dsSliceHover` event to keep chart and legend hover in sync. Only dims the other\n   * rows' opacity (like a chart dimming its other slices) — it never shows the hover-fill,\n   * since that's reserved for a real pointer/keyboard interaction on this row.\n   */\n  @Prop() activeLabel: string | null = null;\n\n  /** Own pointer/focus hover, kept separate from `activeLabel` so the hover-fill (a \"you can\n   * click here\" affordance) never shows just because an external row was synced in. */\n  @State() private hoveredLabel: string | null = null;\n\n  /** Fires on row hover/focus with the item, or `null` on leave/blur. */\n  @Event() dsItemHover!: EventEmitter<ChartLegendItem | null>;\n  /** Fires when a deep-linkable row (`item.href` set) is activated. */\n  @Event() dsItemClick!: EventEmitter<{ item: ChartLegendItem; originalEvent: MouseEvent }>;\n\n  @Watch('highlightOnHover')\n  handleHighlightOnHoverChange(enabled: boolean) {\n    if (!enabled) this.hoveredLabel = null;\n  }\n\n  private handleHover(item: ChartLegendItem | null) {\n    this.hoveredLabel = item?.label ?? null;\n    this.dsItemHover.emit(item);\n  }\n\n  private handleClick = (item: ChartLegendItem, originalEvent: MouseEvent) => {\n    this.dsItemClick.emit({ item, originalEvent });\n  };\n\n  render() {\n    const total = this.items.reduce((sum, item) => sum + (item.value ?? 0), 0);\n    // Highlight/dim from either this component's own hover or an externally-synced label\n    // (e.g. an application-owned chart focus state).\n    const highlightLabel = this.activeLabel ?? (this.highlightOnHover ? this.hoveredLabel : null);\n\n    return (\n      <Host\n        class={{\n          'chart-legend': true,\n          [`chart-legend--${this.direction}`]: true,\n          'chart-legend--show-percentage': this.showPercentage,\n        }}\n      >\n        {/* mouseleave lives on the list, not each row — the row-gap between items is still\n            inside the list's box, so crossing it while moving between rows never fires this.\n            Only actually leaving the whole list does, and that clears with no delay. */}\n        <ul\n          class=\"chart-legend__list\"\n          onMouseLeave={this.highlightOnHover ? () => this.handleHover(null) : undefined}\n        >\n          {this.items.map((item, i) => {\n            const isDimmed = highlightLabel != null && item.label !== highlightLabel;\n            const href = resolveSafeUrl(item.href);\n            const RowTag = href ? 'a' : 'div';\n            const percentage = item.value != null\n              ? formatPercentage(total ? item.value / total : 0, this.percentageDecimals, this.locale)\n              : '';\n\n            return (\n              <li class=\"chart-legend__list-item\" key={item.label}>\n                <RowTag\n                  class={{\n                    'chart-legend__item': true,\n                    'chart-legend__item--interactive': !!href,\n                    'chart-legend__item--dimmed': isDimmed,\n                    'ds-control--md': true,\n                    'ds-interaction-fill': this.highlightOnHover || !!href,\n                    'ds-focus-ring-inset': !!href,\n                  }}\n                  href={href}\n                  onClick={href ? (e: MouseEvent) => this.handleClick(item, e) : undefined}\n                  onMouseEnter={\n                    this.highlightOnHover ? () => this.handleHover(item) : undefined\n                  }\n                  onFocus={this.highlightOnHover ? () => this.handleHover(item) : undefined}\n                  onBlur={this.highlightOnHover ? () => this.handleHover(null) : undefined}\n                >\n                  <span class=\"chart-legend__swatch-box\">\n                    <span class=\"chart-legend__swatch\" style={{ backgroundColor: item.color ?? categoryColor(i) }} />\n                  </span>\n                  <ds-text\n                    class=\"chart-legend__label\"\n                    as=\"span\"\n                    variant=\"text-body-medium\"\n                    color=\"secondary\"\n                    lineTruncation={1}\n                    title={item.label}\n                  >\n                    {item.label}\n                  </ds-text>\n                  {item.value != null && (\n                    <ds-text\n                      class=\"chart-legend__value\"\n                      as=\"span\"\n                      variant=\"text-body-medium\"\n                      color=\"primary\"\n                      lineTruncation={1}\n                      align=\"right\"\n                      fontFeature=\"tabular-nums\"\n                      title={String(item.value)}\n                    >\n                      {formatCompactNumber(item.value, this.locale)}\n                    </ds-text>\n                  )}\n                  {item.value != null && this.showPercentage && (\n                    <ds-text\n                      class=\"chart-legend__percentage\"\n                      as=\"span\"\n                      variant=\"text-body-medium\"\n                      color=\"primary\"\n                      lineTruncation={1}\n                      align=\"right\"\n                      fontFeature=\"tabular-nums\"\n                      title={percentage}\n                    >\n                      {percentage}\n                    </ds-text>\n                  )}\n                </RowTag>\n              </li>\n            );\n          })}\n        </ul>\n      </Host>\n    );\n  }\n}\n"],"mappings":"yKAAA,MAAMA,EAAyD,CAC7D,CAAEC,UAAW,IAAeC,OAAQ,KACpC,CAAED,UAAW,IAAWC,OAAQ,KAChC,CAAED,UAAW,IAAOC,OAAQ,MAIxB,SAAUC,EAAoBC,EAAeC,GACjD,GAAIA,EAAQ,CACV,OAAO,IAAIC,KAAKC,aAAaF,EAAQ,CACnCG,SAAU,UACVC,eAAgB,QAChBC,sBAAuB,IACtBC,OAAOP,E,CAEZ,MAAMQ,EAAOR,EAAQ,EAAI,IAAM,GAC/B,MAAMS,EAAMC,KAAKD,IAAIT,GACrB,GAAIS,EAAM,IAAM,OAAOE,OAAOX,GAE9B,IAAK,IAAIY,EAAI,EAAGA,EAAIhB,EAAciB,OAAQD,IAAK,CAC7C,MAAME,EAAOlB,EAAcgB,GAC3B,GAAIH,EAAMK,EAAKjB,UAAW,SAE1B,IAAIkB,EAASL,KAAKM,MAAOP,EAAMK,EAAKjB,UAAa,IAAM,GAEvD,GAAIkB,GAAU,KAAQH,EAAI,EAAG,CAC3B,MAAMK,EAAOrB,EAAcgB,EAAI,GAC/BG,EAASL,KAAKM,MAAOP,EAAMQ,EAAKpB,UAAa,IAAM,GACnD,MAAO,GAAGW,IAAOO,IAASE,EAAKnB,Q,CAEjC,MAAO,GAAGU,IAAOO,IAASD,EAAKhB,Q,CAEjC,OAAOa,OAAOX,EAChB,CC9BM,SAAUkB,EACdC,EACAC,EAA+B,EAC/BnB,GAEA,MAAMoB,EAAYD,IAAa,EAAI,EAAI,EACvC,MAAMpB,EAAQsB,OAAOC,SAASJ,GAASA,EAAQ,EAE/C,OAAO,IAAIjB,KAAKC,aAAaF,EAAQ,CACnCuB,MAAO,UACPC,sBAAuBJ,EACvBf,sBAAuBe,IACtBd,OAAOP,EACZ,CChBA,MAAM0B,EAAiB,IAAM,gke,MCoBhBC,EAAWC,EAAA,MAAAD,UAAAE,EALxB,WAAAC,CAAAC,G,0HAQUC,KAAAC,MAA2B,GAC3BD,KAAAE,UAAkC,WAElCF,KAAAG,eAA0B,KAE1BH,KAAAI,mBAAoD,EAEpDJ,KAAAK,iBAA4B,KAO5BL,KAAAM,YAA6B,KAIpBN,KAAAO,aAA8B,KAiBvCP,KAAAQ,YAAc,CAACC,EAAuBC,KAC5CV,KAAKW,YAAYC,KAAK,CAAEH,OAAMC,iBAAgB,CAoGjD,CA9GC,4BAAAG,CAA6BC,GAC3B,IAAKA,EAASd,KAAKO,aAAe,I,CAG5B,WAAAQ,CAAYN,GAClBT,KAAKO,aAAeE,GAAMO,OAAS,KACnChB,KAAKiB,YAAYL,KAAKH,E,CAOxB,MAAAS,GACE,MAAMC,EAAQnB,KAAKC,MAAMmB,QAAO,CAACC,EAAKZ,IAASY,GAAOZ,EAAKzC,OAAS,IAAI,GAGxE,MAAMsD,EAAiBtB,KAAKM,cAAgBN,KAAKK,iBAAmBL,KAAKO,aAAe,MAExF,OACEgB,EAACC,EAAI,CAAAC,IAAA,2CACHC,MAAO,CACL,eAAgB,KAChB,CAAC,iBAAiB1B,KAAKE,aAAc,KACrC,gCAAiCF,KAAKG,iBAMxCoB,EAAA,MAAAE,IAAA,2CACEC,MAAM,qBACNC,aAAc3B,KAAKK,iBAAmB,IAAML,KAAKe,YAAY,MAAQa,WAEpE5B,KAAKC,MAAM4B,KAAI,CAACpB,EAAM7B,KACrB,MAAMkD,EAAWR,GAAkB,MAAQb,EAAKO,QAAUM,EAC1D,MAAMS,EAAOC,EAAevB,EAAKsB,MACjC,MAAME,EAASF,EAAO,IAAM,MAC5B,MAAMG,EAAazB,EAAKzC,OAAS,KAC7BkB,EAAiBiC,EAAQV,EAAKzC,MAAQmD,EAAQ,EAAGnB,KAAKI,mBAAoBJ,KAAK/B,QAC/E,GAEJ,OACEsD,EAAA,MAAIG,MAAM,0BAA0BD,IAAKhB,EAAKO,OAC5CO,EAACU,EAAM,CACLP,MAAO,CACL,qBAAsB,KACtB,oCAAqCK,EACrC,6BAA8BD,EAC9B,iBAAkB,KAClB,sBAAuB9B,KAAKK,oBAAsB0B,EAClD,wBAAyBA,GAE3BA,KAAMA,EACNI,QAASJ,EAAQK,GAAkBpC,KAAKQ,YAAYC,EAAM2B,GAAKR,UAC/DS,aACErC,KAAKK,iBAAmB,IAAML,KAAKe,YAAYN,GAAQmB,UAEzDU,QAAStC,KAAKK,iBAAmB,IAAML,KAAKe,YAAYN,GAAQmB,UAChEW,OAAQvC,KAAKK,iBAAmB,IAAML,KAAKe,YAAY,MAAQa,WAE/DL,EAAA,QAAMG,MAAM,4BACVH,EAAA,QAAMG,MAAM,uBAAuBlC,MAAO,CAAEgD,gBAAiB/B,EAAKgC,OAASC,EAAc9D,OAE3F2C,EAAA,WACEG,MAAM,sBACNiB,GAAG,OACHC,QAAQ,mBACRH,MAAM,YACNI,eAAgB,EAChBC,MAAOrC,EAAKO,OAEXP,EAAKO,OAEPP,EAAKzC,OAAS,MACbuD,EAAA,WACEG,MAAM,sBACNiB,GAAG,OACHC,QAAQ,mBACRH,MAAM,UACNI,eAAgB,EAChBE,MAAM,QACNC,YAAY,eACZF,MAAOnE,OAAO8B,EAAKzC,QAElBD,EAAoB0C,EAAKzC,MAAOgC,KAAK/B,SAGzCwC,EAAKzC,OAAS,MAAQgC,KAAKG,gBAC1BoB,EAAA,WACEG,MAAM,2BACNiB,GAAG,OACHC,QAAQ,mBACRH,MAAM,UACNI,eAAgB,EAChBE,MAAM,QACNC,YAAY,eACZF,MAAOZ,GAENA,IAIJ,K","ignoreList":[]}

package/dist/components/ds-checkbox.js

@@ -1,2 +1,2 @@
-import{C as o,d as s}from"./p-BaiGt_o6.js";const t=o;const a=s;export{t as DsCheckbox,a as defineCustomElement};
+import{C as o,d as s}from"./p-DD5OCVXx.js";const t=o;const p=s;export{t as DsCheckbox,p as defineCustomElement};
 //# sourceMappingURL=ds-checkbox.js.map

package/dist/components/ds-chip.js

@@ -1,2 +1,2 @@
-import{p as i,H as o,c as s,h as r,a as n,t as e}from"./index.js";import{d as c}from"./p-BFfLvMZd.js";import{d as t}from"./p-DZFilC--.js";import{C as d}from"./p-CuwopElg.js";const a=()=>`.ds-control--lg.sc-ds-chip,.ds-control--lg.sc-ds-chip-h,.ds-control--md.sc-ds-chip-h,.ds-control--md.sc-ds-chip,.ds-control--sm.sc-ds-chip-h,.ds-control--sm.sc-ds-chip,.ds-control--xs.sc-ds-chip-h,.ds-control--xs.sc-ds-chip{--ds-control-radius:var(--dimension-radius-025)}.ds-control--lg.sc-ds-chip-h,.ds-control--lg.sc-ds-chip{--ds-control-height:var(--dimension-size-500);--ds-control-icon:var(--dimension-iconography-lg);--ds-control-padding-inline:var(--dimension-space-100);--ds-control-label-inset:var(--dimension-space-050);--ds-control-gap:var(--dimension-space-050)}.ds-control--md.sc-ds-chip-h,.ds-control--md.sc-ds-chip{--ds-control-height:var(--dimension-size-400);--ds-control-icon:var(--dimension-iconography-md);--ds-control-padding-inline:var(--dimension-space-075);--ds-control-label-inset:var(--dimension-space-025);--ds-control-gap:var(--dimension-space-050)}.ds-control--sm.sc-ds-chip-h,.ds-control--sm.sc-ds-chip{--ds-control-height:var(--dimension-size-300);--ds-control-icon:var(--dimension-iconography-sm);--ds-control-padding-inline:var(--dimension-space-050);--ds-control-label-inset:var(--dimension-space-025);--ds-control-gap:var(--dimension-space-025)}.ds-control--xs.sc-ds-chip-h,.ds-control--xs.sc-ds-chip{--ds-control-height:var(--dimension-size-200);--ds-control-icon:var(--dimension-iconography-xs);--ds-control-padding-inline:var(--dimension-space-025);--ds-control-label-inset:var(--dimension-space-025);--ds-control-gap:0}@media (forced-colors: active){.sc-ds-chip:root,.sc-ds-chip-h,.ds-forced-colors-scope.sc-ds-chip{--ds-forced-color-surface:Canvas;--ds-forced-color-content:CanvasText;--ds-forced-color-control-boundary:ButtonText;--ds-forced-color-selected:Highlight;--ds-forced-color-on-selected:HighlightText;--ds-forced-color-disabled:GrayText}}.ds-interaction-fill.sc-ds-chip-h,.ds-interaction-fill.sc-ds-chip{position:var(--ds-interaction-position, relative);z-index:var(--ds-interaction-z-index, 0);cursor:default;--ds-interaction-hover:var(--color-interaction-hover);--ds-interaction-pressed:var(--color-interaction-pressed);--ds-interaction-active:var(--color-interaction-active-brand);--ds-interaction-border-width:0px;--ds-interaction-border-color:transparent;--ds-interaction-divider-width:0px;--ds-interaction-divider-color:transparent;--ds-interaction-divider-inline-start-width:0px;--ds-interaction-divider-inline-start-color:transparent;--ds-interaction-divider-inline-end-width:0px;--ds-interaction-divider-inline-end-color:transparent}.ds-interaction-fill.sc-ds-chip-h::before,.ds-interaction-fill.sc-ds-chip::before,.ds-interaction-fill.sc-ds-chip-h::after,.ds-interaction-fill.sc-ds-chip::after{content:'';position:absolute;inset:0;border-radius:inherit;background:transparent;pointer-events:none;cursor:inherit;transition:none}.ds-interaction-fill.sc-ds-chip-h::before,.ds-interaction-fill.sc-ds-chip::before{z-index:1}.ds-interaction-fill.sc-ds-chip-h::after,.ds-interaction-fill.sc-ds-chip::after{z-index:3;box-shadow:inset 0 calc(-1 * var(--ds-interaction-divider-width)) 0 var(--ds-interaction-divider-color),     inset var(--ds-interaction-divider-inline-start-width) 0 0       var(--ds-interaction-divider-inline-start-color),     inset calc(-1 * var(--ds-interaction-divider-inline-end-width)) 0 0       var(--ds-interaction-divider-inline-end-color),     inset 0 0 0 var(--ds-interaction-border-width) var(--ds-interaction-border-color)}.ds-interaction-fill--bordered.sc-ds-chip-h,.ds-interaction-fill--bordered.sc-ds-chip{--ds-interaction-border-width:var(--dimension-stroke-width-012);--ds-interaction-border-color:var(--color-border-secondary)}.ds-interaction-fill--selected.sc-ds-chip-h::before,.ds-interaction-fill--selected.sc-ds-chip::before{background:var(--ds-interaction-active)}.ds-interaction-fill--selected.sc-ds-chip-h,.ds-interaction-fill--selected.sc-ds-chip{--ds-interaction-dot-ring:var(--ds-interaction-active)}@media (hover: hover) and (pointer: fine){.ds-interaction-fill.sc-ds-chip-h:hover:not(:disabled)::after,.ds-interaction-fill.sc-ds-chip:hover:not(:disabled)::after{background:var(--ds-interaction-hover)}}.ds-interaction-fill.sc-ds-chip-h:active:not(:disabled)::after,.ds-interaction-fill.sc-ds-chip:active:not(:disabled)::after{background:var(--ds-interaction-pressed)}.ds-interaction-fill--grouped.sc-ds-chip-h::after,.ds-interaction-fill--grouped.sc-ds-chip::after,.ds-interaction-fill--grouped.sc-ds-chip-h:active:not(:disabled)::after,.ds-interaction-fill--grouped.sc-ds-chip:active:not(:disabled)::after{background:var(--ds-interaction-group-fill, transparent)}@media (hover: hover) and (pointer: fine){.ds-interaction-fill--grouped.sc-ds-chip-h:hover:not(:disabled)::after,.ds-interaction-fill--grouped.sc-ds-chip:hover:not(:disabled)::after{background:var(--ds-interaction-group-fill, transparent)}}.ds-interaction-fill--grouped.sc-ds-chip-h,.ds-interaction-fill--grouped.sc-ds-chip{--ds-interaction-divider-width:var(--ds-interaction-group-divider-width, 0px);--ds-interaction-divider-color:var(--ds-interaction-group-divider-color, transparent);--ds-interaction-divider-inline-start-width:var(     --ds-interaction-group-divider-inline-start-width,     0px   );--ds-interaction-divider-inline-start-color:var(     --ds-interaction-group-divider-inline-start-color,     transparent   );--ds-interaction-divider-inline-end-width:var(     --ds-interaction-group-divider-inline-end-width,     0px   );--ds-interaction-divider-inline-end-color:var(     --ds-interaction-group-divider-inline-end-color,     transparent   )}.ds-interaction-fill.sc-ds-chip-h>.ds-interaction-fill__content.sc-ds-chip,.ds-interaction-fill.sc-ds-chip>.ds-interaction-fill__content.sc-ds-chip,.ds-interaction-fill__content.sc-ds-chip{position:relative;z-index:2;cursor:inherit}.ds-interaction-fill--on-faint.sc-ds-chip-h,.ds-interaction-fill--on-faint.sc-ds-chip{--ds-interaction-active:var(--color-interaction-active)}.ds-interaction-fill--on-medium.sc-ds-chip-h,.ds-interaction-fill--on-medium.sc-ds-chip{--ds-interaction-hover:var(--color-interaction-on-medium-background-hover);--ds-interaction-pressed:var(--color-interaction-on-medium-background-pressed);--ds-interaction-active:var(--color-interaction-on-medium-background-active);--ds-focus-ring-color:var(--color-interaction-on-medium-background-focus)}.ds-interaction-fill--on-bold.sc-ds-chip-h,.ds-interaction-fill--on-bold.sc-ds-chip{--ds-interaction-hover:var(--color-interaction-on-bold-background-hover);--ds-interaction-pressed:var(--color-interaction-on-bold-background-pressed);--ds-interaction-active:var(--color-interaction-on-bold-background-active);--ds-focus-ring-color:var(--color-interaction-on-bold-background-focus)}.ds-interaction-fill--on-strong.sc-ds-chip-h,.ds-interaction-fill--on-strong.sc-ds-chip{--ds-interaction-hover:var(--color-interaction-on-strong-background-hover);--ds-interaction-pressed:var(--color-interaction-on-strong-background-pressed);--ds-interaction-active:var(--color-interaction-on-strong-background-active);--ds-focus-ring-color:var(--color-interaction-on-strong-background-focus)}.ds-interaction-fill--on-translucent.sc-ds-chip-h,.ds-interaction-fill--on-translucent.sc-ds-chip{--ds-interaction-hover:var(--color-translucent-interaction-hover);--ds-interaction-pressed:var(--color-translucent-interaction-pressed);--ds-interaction-active:var(--color-translucent-interaction-active);--ds-focus-ring-color:var(--color-translucent-interaction-focus)}.ds-interaction-fill--on-inverted.sc-ds-chip-h,.ds-interaction-fill--on-inverted.sc-ds-chip{--ds-interaction-hover:var(--color-inverted-interaction-hover);--ds-interaction-pressed:var(--color-inverted-interaction-pressed);--ds-interaction-active:var(--color-inverted-interaction-active);--ds-focus-ring-color:var(--color-inverted-interaction-focus)}.ds-interaction-fill--on-media.sc-ds-chip-h,.ds-interaction-fill--on-media.sc-ds-chip{--ds-interaction-hover:var(--color-media-interaction-hover);--ds-interaction-pressed:var(--color-media-interaction-pressed);--ds-interaction-active:var(--color-media-interaction-active);--ds-focus-ring-color:var(--color-media-interaction-focus)}.ds-interaction-fill--on-always-dark.sc-ds-chip-h,.ds-interaction-fill--on-always-dark.sc-ds-chip{--ds-interaction-hover:var(--color-always-dark-interaction-hover);--ds-interaction-pressed:var(--color-always-dark-interaction-pressed);--ds-interaction-active:var(--color-always-dark-interaction-active);--ds-focus-ring-color:var(--color-always-dark-interaction-focus)}.ds-interaction-fill--on-navigation.sc-ds-chip-h,.ds-interaction-fill--on-navigation.sc-ds-chip{--ds-interaction-hover:var(--color-navigation-interaction-hover);--ds-interaction-pressed:var(--color-navigation-interaction-pressed);--ds-interaction-active:var(--color-navigation-interaction-active);--ds-focus-ring-color:var(--color-navigation-interaction-focus)}@media (forced-colors: active){.ds-interaction-fill.sc-ds-chip-h::after,.ds-interaction-fill.sc-ds-chip::after{box-shadow:none;outline:var(--ds-interaction-border-width) solid       var(--ds-forced-color-control-boundary);outline-offset:calc(-1 * var(--ds-interaction-border-width))}.ds-interaction-fill--selected.sc-ds-chip-h::before,.ds-interaction-fill--selected.sc-ds-chip::before{background:transparent;outline:var(--dimension-stroke-width-025) solid var(--ds-forced-color-selected);outline-offset:calc(-1 * var(--dimension-stroke-width-025))}}@media (forced-colors: active) and (hover: hover) and (pointer: fine){.ds-interaction-fill.sc-ds-chip-h:hover:not(:disabled):not(:focus-visible):not(:focus-within):not(.ds-focus-ring--visible)::after,.ds-interaction-fill.sc-ds-chip:hover:not(:disabled):not(:focus-visible):not(:focus-within):not(.ds-focus-ring--visible)::after{outline-color:var(--ds-forced-color-selected);outline-width:var(--dimension-stroke-width-012)}}@media (forced-colors: active){.sc-ds-chip:root,.sc-ds-chip-h,.ds-forced-colors-scope.sc-ds-chip{--ds-forced-color-surface:Canvas;--ds-forced-color-content:CanvasText;--ds-forced-color-control-boundary:ButtonText;--ds-forced-color-selected:Highlight;--ds-forced-color-on-selected:HighlightText;--ds-forced-color-disabled:GrayText}}.sc-ds-chip-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-chip-h,.ds-focus-ring.sc-ds-chip,.ds-focus-ring-inset.sc-ds-chip-h,.ds-focus-ring-inset.sc-ds-chip{outline:none;-webkit-tap-highlight-color:transparent;touch-action:manipulation}.ds-focus-ring.sc-ds-chip-h:focus-visible,.ds-focus-ring.sc-ds-chip: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-chip-h,.ds-focus-ring.ds-focus-ring--visible.sc-ds-chip{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-chip-h:focus-visible,.ds-focus-ring-inset.sc-ds-chip:focus-visible{outline:none}.ds-focus-ring-inset.sc-ds-chip-h:focus-visible::after,.ds-focus-ring-inset.sc-ds-chip: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-chip-h,.ds-focus-ring-inset.ds-focus-ring--visible.sc-ds-chip{outline:none}.ds-focus-ring-inset.ds-focus-ring--visible.sc-ds-chip-h::after,.ds-focus-ring-inset.ds-focus-ring--visible.sc-ds-chip::after{outline:var(--ds-focus-ring-width) solid var(--ds-focus-ring-color);outline-offset:calc(-1 * var(--ds-focus-ring-width))}@media (forced-colors: active){.sc-ds-chip-h{--ds-focus-ring-color:var(--ds-forced-color-selected)}}@media (forced-colors: active){.sc-ds-chip:root,.sc-ds-chip-h,.ds-forced-colors-scope.sc-ds-chip{--ds-forced-color-surface:Canvas;--ds-forced-color-content:CanvasText;--ds-forced-color-control-boundary:ButtonText;--ds-forced-color-selected:Highlight;--ds-forced-color-on-selected:HighlightText;--ds-forced-color-disabled:GrayText}}.ds-control-inactive.sc-ds-chip-h,.ds-control-inactive.sc-ds-chip{opacity:var(--effect-opacity-medium);pointer-events:none;cursor:not-allowed}@media (forced-colors: active){.ds-control-inactive.sc-ds-chip-h,.ds-control-inactive.sc-ds-chip{color:var(--ds-forced-color-disabled);opacity:1}}.sc-ds-chip-h{display:inline-flex;align-items:center;justify-content:center;box-sizing:border-box;color:var(--color-foreground-primary);position:relative;border-radius:var(--ds-control-radius, var(--dimension-radius-025));height:var(--ds-control-height);padding:0 var(--ds-control-padding-inline);gap:var(--ds-control-gap);user-select:none;-webkit-user-select:none}.tag--rounded.sc-ds-chip-h{border-radius:var(--dimension-radius-half)}.tag__label.sc-ds-chip{position:relative;z-index:2;padding:0 var(--ds-control-label-inset);white-space:nowrap;flex-shrink:1;min-width:0;overflow:hidden;text-overflow:ellipsis}.chip--default.sc-ds-chip-h{background-color:var(--color-background-faint-neutral);color:var(--color-foreground-bold-neutral)}.chip--active.sc-ds-chip-h{background-color:var(--color-background-faint-brand);color:var(--color-foreground-bold-brand)}.chip--error.sc-ds-chip-h{background-color:var(--color-background-faint-negative);color:var(--color-foreground-bold-negative)}.chip--caution.sc-ds-chip-h{background-color:var(--color-background-faint-caution);color:var(--color-foreground-bold-caution)}.tag__remove.sc-ds-chip{padding:0;margin:0;border:none;background:none;display:flex;align-items:center;justify-content:center;cursor:default;color:inherit;flex-shrink:0;position:relative;z-index:2;border-radius:var(--dimension-radius-half)}.tag__remove.sc-ds-chip::before{content:'';position:absolute;inset:var(--dimension-space-n025);border-radius:var(--dimension-radius-half);background-color:transparent;transition:var(--effect-transition-interaction-background-short-2);pointer-events:none}@media (hover: hover) and (pointer: fine){.tag__remove.sc-ds-chip:hover::before{background-color:var(--color-interaction-hover)}}.tag__remove.sc-ds-chip:active::before{background-color:var(--color-interaction-pressed)}.tag--size-sm.sc-ds-chip-h .tag__remove.sc-ds-chip::before{inset:var(--dimension-space-n012)}.tag--size-xs.sc-ds-chip-h .tag__remove.sc-ds-chip::before{inset:0}.tag__remove-x.sc-ds-chip{display:inline-flex;flex-shrink:0;width:var(--ds-control-icon);height:var(--ds-control-icon)}`;const l={md:"md",sm:"sm",xs:"xs"};const h=i(class i extends o{constructor(i){super();if(i!==false){this.__registerHost()}this.dsRemove=s(this,"dsRemove");this.state="default";this.size="md";this.rounded=false;this.isInactive=false;this.removeLabel="Remove {label}";this.handleRemove=i=>{i.stopPropagation();if(this.isInactive)return;this.dsRemove.emit()}}render(){const i=d[this.size];const o=l[this.size];const s=this.maxWidth!=null?{maxWidth:typeof this.maxWidth==="number"?`${this.maxWidth}px`:this.maxWidth}:undefined;return r(n,{key:"b71fc10291bea9c4caf2400c4b498a4ddf845b39",class:{tag:true,chip:true,[`chip--${this.state}`]:true,[`tag--size-${this.size}`]:true,"ds-control--md":this.size==="md","ds-control--sm":this.size==="sm","ds-control--xs":this.size==="xs","tag--rounded":this.rounded,"tag--removable":true,"ds-interaction-fill":!this.isInactive,"ds-control-inactive":this.isInactive},style:s,"aria-disabled":this.isInactive?"true":undefined},r("ds-text",{key:"19481f7717c57bd5099b1db9388a1a041850235c",class:"tag__label",as:"span",variant:i,color:"inherit"},this.label),r("button",{key:"35bfb4dc194146bf8b4371dedd5e4fd341388a9e",type:"button",class:"tag__remove ds-focus-ring-inset",onClick:this.handleRemove,"aria-label":this.removeLabel.replace("{label}",this.label),disabled:this.isInactive||undefined},r("ds-icon",{key:"bac96b51eafcbd66d165df947fb7a94ee4892051",class:"tag__remove-x",name:"Cross",size:o,color:"inherit"})))}static get style(){return a()}},[2,"ds-chip",{label:[1],state:[1],size:[1],rounded:[4],maxWidth:[8,"max-width"],isInactive:[4,"is-inactive"],removeLabel:[1,"remove-label"]}]);function v(){if(typeof customElements==="undefined"){return}const i=["ds-chip","ds-icon","ds-text"];i.forEach((i=>{switch(i){case"ds-chip":if(!customElements.get(e(i))){customElements.define(e(i),h)}break;case"ds-icon":if(!customElements.get(e(i))){c()}break;case"ds-text":if(!customElements.get(e(i))){t()}break}}))}v();const f=h;const p=v;export{f as DsChip,p as defineCustomElement};
+import{p as i,H as o,c as s,h as r,a as n,t as e}from"./index.js";import{d as c}from"./p-BFfLvMZd.js";import{d as t}from"./p-DZFilC--.js";import{C as d}from"./p-CuwopElg.js";const a=()=>`.ds-control--lg.sc-ds-chip,.ds-control--lg.sc-ds-chip-h,.ds-control--md.sc-ds-chip-h,.ds-control--md.sc-ds-chip,.ds-control--sm.sc-ds-chip-h,.ds-control--sm.sc-ds-chip,.ds-control--xs.sc-ds-chip-h,.ds-control--xs.sc-ds-chip{--ds-control-radius:var(--dimension-radius-025)}.ds-control--lg.sc-ds-chip-h,.ds-control--lg.sc-ds-chip{--ds-control-height:var(--dimension-size-500);--ds-control-icon:var(--dimension-iconography-lg);--ds-control-padding-inline:var(--dimension-space-100);--ds-control-label-inset:var(--dimension-space-050);--ds-control-gap:var(--dimension-space-050)}.ds-control--md.sc-ds-chip-h,.ds-control--md.sc-ds-chip{--ds-control-height:var(--dimension-size-400);--ds-control-icon:var(--dimension-iconography-md);--ds-control-padding-inline:var(--dimension-space-075);--ds-control-label-inset:var(--dimension-space-025);--ds-control-gap:var(--dimension-space-050)}.ds-control--sm.sc-ds-chip-h,.ds-control--sm.sc-ds-chip{--ds-control-height:var(--dimension-size-300);--ds-control-icon:var(--dimension-iconography-sm);--ds-control-padding-inline:var(--dimension-space-050);--ds-control-label-inset:var(--dimension-space-025);--ds-control-gap:var(--dimension-space-025)}.ds-control--xs.sc-ds-chip-h,.ds-control--xs.sc-ds-chip{--ds-control-height:var(--dimension-size-200);--ds-control-icon:var(--dimension-iconography-xs);--ds-control-padding-inline:var(--dimension-space-025);--ds-control-label-inset:var(--dimension-space-025);--ds-control-gap:0}@media (forced-colors: active){.sc-ds-chip:root,.sc-ds-chip-h,.ds-forced-colors-scope.sc-ds-chip{--ds-forced-color-surface:Canvas;--ds-forced-color-content:CanvasText;--ds-forced-color-control-boundary:ButtonText;--ds-forced-color-selected:Highlight;--ds-forced-color-on-selected:HighlightText;--ds-forced-color-disabled:GrayText}}.ds-interaction-fill.sc-ds-chip-h,.ds-interaction-fill.sc-ds-chip{position:var(--ds-interaction-position, relative);z-index:var(--ds-interaction-z-index, 0);cursor:default;--ds-interaction-hover:var(--color-interaction-hover);--ds-interaction-pressed:var(--color-interaction-pressed);--ds-interaction-active:var(--color-interaction-active-brand);--ds-interaction-border-width:0px;--ds-interaction-border-color:transparent;--ds-interaction-divider-width:0px;--ds-interaction-divider-color:transparent;--ds-interaction-divider-inline-start-width:0px;--ds-interaction-divider-inline-start-color:transparent;--ds-interaction-divider-inline-end-width:0px;--ds-interaction-divider-inline-end-color:transparent}.ds-interaction-fill.sc-ds-chip-h::before,.ds-interaction-fill.sc-ds-chip::before,.ds-interaction-fill.sc-ds-chip-h::after,.ds-interaction-fill.sc-ds-chip::after{content:'';position:absolute;inset:0;border-radius:inherit;background:transparent;pointer-events:none;cursor:inherit;transition:none}.ds-interaction-fill.sc-ds-chip-h::before,.ds-interaction-fill.sc-ds-chip::before{z-index:1}.ds-interaction-fill.sc-ds-chip-h::after,.ds-interaction-fill.sc-ds-chip::after{z-index:3;box-shadow:inset 0 calc(-1 * var(--ds-interaction-divider-width)) 0 var(--ds-interaction-divider-color),     inset var(--ds-interaction-divider-inline-start-width) 0 0       var(--ds-interaction-divider-inline-start-color),     inset calc(-1 * var(--ds-interaction-divider-inline-end-width)) 0 0       var(--ds-interaction-divider-inline-end-color),     inset 0 0 0 var(--ds-interaction-border-width) var(--ds-interaction-border-color)}.ds-interaction-fill--bordered.sc-ds-chip-h,.ds-interaction-fill--bordered.sc-ds-chip{--ds-interaction-border-width:var(--dimension-stroke-width-012);--ds-interaction-border-color:var(--color-border-secondary)}.ds-interaction-fill--selected.sc-ds-chip-h::before,.ds-interaction-fill--selected.sc-ds-chip::before{background:var(--ds-interaction-active)}.ds-interaction-fill--selected.sc-ds-chip-h,.ds-interaction-fill--selected.sc-ds-chip{--ds-interaction-dot-ring:var(--ds-interaction-active)}@media (hover: hover) and (pointer: fine){.ds-interaction-fill.sc-ds-chip-h:hover:not(:disabled)::after,.ds-interaction-fill.sc-ds-chip:hover:not(:disabled)::after{background:var(--ds-interaction-hover)}}.ds-interaction-fill.sc-ds-chip-h:active:not(:disabled)::after,.ds-interaction-fill.sc-ds-chip:active:not(:disabled)::after{background:var(--ds-interaction-pressed)}.ds-interaction-fill--grouped.sc-ds-chip-h::after,.ds-interaction-fill--grouped.sc-ds-chip::after,.ds-interaction-fill--grouped.sc-ds-chip-h:active:not(:disabled)::after,.ds-interaction-fill--grouped.sc-ds-chip:active:not(:disabled)::after{background:var(--ds-interaction-group-fill, transparent)}@media (hover: hover) and (pointer: fine){.ds-interaction-fill--grouped.sc-ds-chip-h:hover:not(:disabled)::after,.ds-interaction-fill--grouped.sc-ds-chip:hover:not(:disabled)::after{background:var(--ds-interaction-group-fill, transparent)}}.ds-interaction-fill--grouped.sc-ds-chip-h,.ds-interaction-fill--grouped.sc-ds-chip{--ds-interaction-divider-width:var(--ds-interaction-group-divider-width, 0px);--ds-interaction-divider-color:var(--ds-interaction-group-divider-color, transparent);--ds-interaction-divider-inline-start-width:var(     --ds-interaction-group-divider-inline-start-width,     0px   );--ds-interaction-divider-inline-start-color:var(     --ds-interaction-group-divider-inline-start-color,     transparent   );--ds-interaction-divider-inline-end-width:var(     --ds-interaction-group-divider-inline-end-width,     0px   );--ds-interaction-divider-inline-end-color:var(     --ds-interaction-group-divider-inline-end-color,     transparent   )}.ds-interaction-fill.sc-ds-chip-h>.ds-interaction-fill__content.sc-ds-chip,.ds-interaction-fill.sc-ds-chip>.ds-interaction-fill__content.sc-ds-chip,.ds-interaction-fill__content.sc-ds-chip{position:relative;z-index:2;cursor:inherit}.ds-interaction-fill--on-faint.sc-ds-chip-h,.ds-interaction-fill--on-faint.sc-ds-chip{--ds-interaction-active:var(--color-interaction-active)}.ds-interaction-fill--on-medium.sc-ds-chip-h,.ds-interaction-fill--on-medium.sc-ds-chip{--ds-interaction-hover:var(--color-interaction-on-medium-background-hover);--ds-interaction-pressed:var(--color-interaction-on-medium-background-pressed);--ds-interaction-active:var(--color-interaction-on-medium-background-active);--ds-focus-ring-color:var(--color-interaction-on-medium-background-focus)}.ds-interaction-fill--on-bold.sc-ds-chip-h,.ds-interaction-fill--on-bold.sc-ds-chip{--ds-interaction-hover:var(--color-interaction-on-bold-background-hover);--ds-interaction-pressed:var(--color-interaction-on-bold-background-pressed);--ds-interaction-active:var(--color-interaction-on-bold-background-active);--ds-focus-ring-color:var(--color-interaction-on-bold-background-focus)}.ds-interaction-fill--on-strong.sc-ds-chip-h,.ds-interaction-fill--on-strong.sc-ds-chip{--ds-interaction-hover:var(--color-interaction-on-strong-background-hover);--ds-interaction-pressed:var(--color-interaction-on-strong-background-pressed);--ds-interaction-active:var(--color-interaction-on-strong-background-active);--ds-focus-ring-color:var(--color-interaction-on-strong-background-focus)}.ds-interaction-fill--on-translucent.sc-ds-chip-h,.ds-interaction-fill--on-translucent.sc-ds-chip{--ds-interaction-hover:var(--color-translucent-interaction-hover);--ds-interaction-pressed:var(--color-translucent-interaction-pressed);--ds-interaction-active:var(--color-translucent-interaction-active-brand);--ds-focus-ring-color:var(--color-translucent-interaction-focus)}.ds-interaction-fill--on-inverted.sc-ds-chip-h,.ds-interaction-fill--on-inverted.sc-ds-chip{--ds-interaction-hover:var(--color-inverted-interaction-hover);--ds-interaction-pressed:var(--color-inverted-interaction-pressed);--ds-interaction-active:var(--color-inverted-interaction-active-brand);--ds-focus-ring-color:var(--color-inverted-interaction-focus)}.ds-interaction-fill--on-media.sc-ds-chip-h,.ds-interaction-fill--on-media.sc-ds-chip{--ds-interaction-hover:var(--color-media-interaction-hover);--ds-interaction-pressed:var(--color-media-interaction-pressed);--ds-interaction-active:var(--color-media-interaction-active);--ds-focus-ring-color:var(--color-media-interaction-focus)}.ds-interaction-fill--on-always-dark.sc-ds-chip-h,.ds-interaction-fill--on-always-dark.sc-ds-chip{--ds-interaction-hover:var(--color-always-dark-interaction-hover);--ds-interaction-pressed:var(--color-always-dark-interaction-pressed);--ds-interaction-active:var(--color-always-dark-interaction-active-brand);--ds-focus-ring-color:var(--color-always-dark-interaction-focus)}.ds-interaction-fill--on-navigation.sc-ds-chip-h,.ds-interaction-fill--on-navigation.sc-ds-chip{--ds-interaction-hover:var(--color-navigation-interaction-hover);--ds-interaction-pressed:var(--color-navigation-interaction-pressed);--ds-interaction-active:var(--color-navigation-interaction-active);--ds-focus-ring-color:var(--color-navigation-interaction-focus)}@media (forced-colors: active){.ds-interaction-fill.sc-ds-chip-h::after,.ds-interaction-fill.sc-ds-chip::after{box-shadow:none;outline:var(--ds-interaction-border-width) solid       var(--ds-forced-color-control-boundary);outline-offset:calc(-1 * var(--ds-interaction-border-width))}.ds-interaction-fill--selected.sc-ds-chip-h::before,.ds-interaction-fill--selected.sc-ds-chip::before{background:transparent;outline:var(--dimension-stroke-width-025) solid var(--ds-forced-color-selected);outline-offset:calc(-1 * var(--dimension-stroke-width-025))}}@media (forced-colors: active) and (hover: hover) and (pointer: fine){.ds-interaction-fill.sc-ds-chip-h:hover:not(:disabled):not(:focus-visible):not(:focus-within):not(.ds-focus-ring--visible)::after,.ds-interaction-fill.sc-ds-chip:hover:not(:disabled):not(:focus-visible):not(:focus-within):not(.ds-focus-ring--visible)::after{outline-color:var(--ds-forced-color-selected);outline-width:var(--dimension-stroke-width-012)}}@media (forced-colors: active){.sc-ds-chip:root,.sc-ds-chip-h,.ds-forced-colors-scope.sc-ds-chip{--ds-forced-color-surface:Canvas;--ds-forced-color-content:CanvasText;--ds-forced-color-control-boundary:ButtonText;--ds-forced-color-selected:Highlight;--ds-forced-color-on-selected:HighlightText;--ds-forced-color-disabled:GrayText}}.sc-ds-chip-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-chip-h,.ds-focus-ring.sc-ds-chip,.ds-focus-ring-inset.sc-ds-chip-h,.ds-focus-ring-inset.sc-ds-chip{outline:none;-webkit-tap-highlight-color:transparent;touch-action:manipulation}.ds-focus-ring.sc-ds-chip-h:focus-visible,.ds-focus-ring.sc-ds-chip: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-chip-h,.ds-focus-ring.ds-focus-ring--visible.sc-ds-chip{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-chip-h:focus-visible,.ds-focus-ring-inset.sc-ds-chip:focus-visible{outline:none}.ds-focus-ring-inset.sc-ds-chip-h:focus-visible::after,.ds-focus-ring-inset.sc-ds-chip: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-chip-h,.ds-focus-ring-inset.ds-focus-ring--visible.sc-ds-chip{outline:none}.ds-focus-ring-inset.ds-focus-ring--visible.sc-ds-chip-h::after,.ds-focus-ring-inset.ds-focus-ring--visible.sc-ds-chip::after{outline:var(--ds-focus-ring-width) solid var(--ds-focus-ring-color);outline-offset:calc(-1 * var(--ds-focus-ring-width))}@media (forced-colors: active){.sc-ds-chip-h{--ds-focus-ring-color:var(--ds-forced-color-selected)}}@media (forced-colors: active){.sc-ds-chip:root,.sc-ds-chip-h,.ds-forced-colors-scope.sc-ds-chip{--ds-forced-color-surface:Canvas;--ds-forced-color-content:CanvasText;--ds-forced-color-control-boundary:ButtonText;--ds-forced-color-selected:Highlight;--ds-forced-color-on-selected:HighlightText;--ds-forced-color-disabled:GrayText}}.ds-control-inactive.sc-ds-chip-h,.ds-control-inactive.sc-ds-chip{opacity:var(--effect-opacity-medium);pointer-events:none;cursor:not-allowed}@media (forced-colors: active){.ds-control-inactive.sc-ds-chip-h,.ds-control-inactive.sc-ds-chip{color:var(--ds-forced-color-disabled);opacity:1}}.sc-ds-chip-h{display:inline-flex;align-items:center;justify-content:center;box-sizing:border-box;color:var(--color-foreground-primary);position:relative;border-radius:var(--ds-control-radius, var(--dimension-radius-025));height:var(--ds-control-height);padding:0 var(--ds-control-padding-inline);gap:var(--ds-control-gap);user-select:none;-webkit-user-select:none}.tag--rounded.sc-ds-chip-h{border-radius:var(--dimension-radius-half)}.tag__label.sc-ds-chip{position:relative;z-index:2;padding:0 var(--ds-control-label-inset);white-space:nowrap;flex-shrink:1;min-width:0;overflow:hidden;text-overflow:ellipsis}.chip--default.sc-ds-chip-h{background-color:var(--color-background-faint-neutral);color:var(--color-foreground-bold-neutral)}.chip--active.sc-ds-chip-h{background-color:var(--color-background-faint-brand);color:var(--color-foreground-bold-brand)}.chip--error.sc-ds-chip-h{background-color:var(--color-background-faint-negative);color:var(--color-foreground-bold-negative)}.chip--caution.sc-ds-chip-h{background-color:var(--color-background-faint-caution);color:var(--color-foreground-bold-caution)}.tag__remove.sc-ds-chip{padding:0;margin:0;border:none;background:none;display:flex;align-items:center;justify-content:center;cursor:default;color:inherit;flex-shrink:0;position:relative;z-index:2;border-radius:var(--dimension-radius-half)}.tag__remove.sc-ds-chip::before{content:'';position:absolute;inset:var(--dimension-space-n025);border-radius:var(--dimension-radius-half);background-color:transparent;transition:var(--effect-transition-interaction-background-short-2);pointer-events:none}@media (hover: hover) and (pointer: fine){.tag__remove.sc-ds-chip:hover::before{background-color:var(--color-interaction-hover)}}.tag__remove.sc-ds-chip:active::before{background-color:var(--color-interaction-pressed)}.tag--size-sm.sc-ds-chip-h .tag__remove.sc-ds-chip::before{inset:var(--dimension-space-n012)}.tag--size-xs.sc-ds-chip-h .tag__remove.sc-ds-chip::before{inset:0}.tag__remove-x.sc-ds-chip{display:inline-flex;flex-shrink:0;width:var(--ds-control-icon);height:var(--ds-control-icon)}`;const l={md:"md",sm:"sm",xs:"xs"};const h=i(class i extends o{constructor(i){super();if(i!==false){this.__registerHost()}this.dsRemove=s(this,"dsRemove");this.state="default";this.size="md";this.rounded=false;this.isInactive=false;this.removeLabel="Remove {label}";this.handleRemove=i=>{i.stopPropagation();if(this.isInactive)return;this.dsRemove.emit()}}render(){const i=d[this.size];const o=l[this.size];const s=this.maxWidth!=null?{maxWidth:typeof this.maxWidth==="number"?`${this.maxWidth}px`:this.maxWidth}:undefined;return r(n,{key:"b71fc10291bea9c4caf2400c4b498a4ddf845b39",class:{tag:true,chip:true,[`chip--${this.state}`]:true,[`tag--size-${this.size}`]:true,"ds-control--md":this.size==="md","ds-control--sm":this.size==="sm","ds-control--xs":this.size==="xs","tag--rounded":this.rounded,"tag--removable":true,"ds-interaction-fill":!this.isInactive,"ds-control-inactive":this.isInactive},style:s,"aria-disabled":this.isInactive?"true":undefined},r("ds-text",{key:"19481f7717c57bd5099b1db9388a1a041850235c",class:"tag__label",as:"span",variant:i,color:"inherit"},this.label),r("button",{key:"35bfb4dc194146bf8b4371dedd5e4fd341388a9e",type:"button",class:"tag__remove ds-focus-ring-inset",onClick:this.handleRemove,"aria-label":this.removeLabel.replace("{label}",this.label),disabled:this.isInactive||undefined},r("ds-icon",{key:"bac96b51eafcbd66d165df947fb7a94ee4892051",class:"tag__remove-x",name:"Cross",size:o,color:"inherit"})))}static get style(){return a()}},[2,"ds-chip",{label:[1],state:[1],size:[1],rounded:[4],maxWidth:[8,"max-width"],isInactive:[4,"is-inactive"],removeLabel:[1,"remove-label"]}]);function v(){if(typeof customElements==="undefined"){return}const i=["ds-chip","ds-icon","ds-text"];i.forEach((i=>{switch(i){case"ds-chip":if(!customElements.get(e(i))){customElements.define(e(i),h)}break;case"ds-icon":if(!customElements.get(e(i))){c()}break;case"ds-text":if(!customElements.get(e(i))){t()}break}}))}v();const f=h;const p=v;export{f as DsChip,p as defineCustomElement};
 //# sourceMappingURL=ds-chip.js.map

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

@@ -1 +1 @@
-{"version":3,"names":["chipCss","ICON_SIZE","md","sm","xs","Chip","__stencil_proxyCustomElement","HTMLElement","constructor","registerHost","this","state","size","rounded","isInactive","removeLabel","handleRemove","e","stopPropagation","dsRemove","emit","render","textVariant","CONTROL_TEXT_VARIANT","iconSize","maxWidthStyle","maxWidth","undefined","h","Host","key","class","tag","chip","style","as","variant","color","label","type","onClick","replace","disabled","name"],"sources":["src/wc/components/Chip/Chip.css?tag=ds-chip&encapsulation=scoped","src/wc/components/Chip/Chip.tsx"],"sourcesContent":["@import '../../utils/tag-chip.css';\n\n/*\n * Semantic state colors — Chip’s differentiator from Tag.\n * All states use the faint contrast weight; hue comes from the state.\n */\n:host(.chip--default) {\n  background-color: var(--color-background-faint-neutral);\n  color: var(--color-foreground-bold-neutral);\n}\n\n:host(.chip--active) {\n  background-color: var(--color-background-faint-brand);\n  color: var(--color-foreground-bold-brand);\n}\n\n:host(.chip--error) {\n  background-color: var(--color-background-faint-negative);\n  color: var(--color-foreground-bold-negative);\n}\n\n:host(.chip--caution) {\n  background-color: var(--color-background-faint-caution);\n  color: var(--color-foreground-bold-caution);\n}\n\n/*\n * Label↔dismiss uses host gap, mirroring Tag icon↔label spacing:\n * [inset][text][inset][gap][icon].\n */\n.tag__remove {\n  padding: 0;\n  margin: 0;\n  border: none;\n  background: none;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  cursor: default;\n  color: inherit;\n  flex-shrink: 0;\n  position: relative;\n  z-index: 2;\n  border-radius: var(--dimension-radius-half);\n}\n\n.tag__remove::before {\n  content: '';\n  position: absolute;\n  inset: var(--dimension-space-n025);\n  border-radius: var(--dimension-radius-half);\n  background-color: transparent;\n  transition: var(--effect-transition-interaction-background-short-2);\n  pointer-events: none;\n}\n\n@media (hover: hover) and (pointer: fine) {\n  .tag__remove:hover::before {\n    background-color: var(--color-interaction-hover);\n  }\n}\n\n.tag__remove:active::before {\n  background-color: var(--color-interaction-pressed);\n}\n\n:host(.tag--size-sm) .tag__remove::before {\n  inset: var(--dimension-space-n012);\n}\n\n:host(.tag--size-xs) .tag__remove::before {\n  inset: 0;\n}\n\n.tag__remove-x {\n  display: inline-flex;\n  flex-shrink: 0;\n  width: var(--ds-control-icon);\n  height: var(--ds-control-icon);\n}\n","import { Component, Prop, Event, EventEmitter, h, Host } from '@stencil/core';\nimport { CONTROL_TEXT_VARIANT } from '../../utils';\n\n/**\n * Semantic chip state — replaces Tag’s intent × contrast matrix.\n * - `default` — neutral faint\n * - `active` — brand faint\n * - `error` — negative faint\n * - `caution` — caution faint\n */\nexport type ChipState = 'default' | 'active' | 'error' | 'caution';\nexport type ChipSize = 'md' | 'sm' | 'xs';\n\n/** Dismiss `ds-icon` size — same iconography metrics as Tag’s leading icon. */\nconst ICON_SIZE: Record<ChipSize, 'md' | 'sm' | 'xs'> = {\n  md: 'md',\n  sm: 'sm',\n  xs: 'xs',\n};\n\n/**\n * Removable chip — same density recipe as Tag, but colored by semantic `state`\n * (not intent × contrast). Not a toggle/select control; the only intentional\n * action is remove.\n */\n@Component({\n  tag: 'ds-chip',\n  styleUrl: 'Chip.css',\n  scoped: true,\n})\nexport class Chip {\n  @Prop() label!: string;\n  /** Semantic color state. @default 'default' */\n  @Prop() state: ChipState = 'default';\n  @Prop() size: ChipSize = 'md';\n  @Prop() rounded: boolean = false;\n  @Prop() maxWidth: string | number | undefined;\n  @Prop() isInactive: boolean = false;\n  /** Accessible remove action. Use `{label}` as the chip-label placeholder. */\n  @Prop() removeLabel: string = 'Remove {label}';\n\n  /** Fired when the remove button is clicked. */\n  @Event() dsRemove!: EventEmitter<void>;\n\n  private handleRemove = (e: MouseEvent) => {\n    e.stopPropagation();\n    if (this.isInactive) return;\n    this.dsRemove.emit();\n  };\n\n  render() {\n    const textVariant = CONTROL_TEXT_VARIANT[this.size];\n    const iconSize = ICON_SIZE[this.size];\n\n    const maxWidthStyle = this.maxWidth != null\n      ? { maxWidth: typeof this.maxWidth === 'number' ? `${this.maxWidth}px` : this.maxWidth }\n      : undefined;\n\n    return (\n      <Host\n        class={{\n          'tag': true,\n          'chip': true,\n          [`chip--${this.state}`]: true,\n          [`tag--size-${this.size}`]: true,\n          'ds-control--md': this.size === 'md',\n          'ds-control--sm': this.size === 'sm',\n          'ds-control--xs': this.size === 'xs',\n          'tag--rounded': this.rounded,\n          'tag--removable': true,\n          /* Hover overlay on the chip surface — dismiss is the only action. */\n          'ds-interaction-fill': !this.isInactive,\n          'ds-control-inactive': this.isInactive,\n        }}\n        style={maxWidthStyle}\n        aria-disabled={this.isInactive ? 'true' : undefined}\n      >\n        <ds-text class=\"tag__label\" as=\"span\" variant={textVariant} color=\"inherit\">\n          {this.label}\n        </ds-text>\n        <button\n          type=\"button\"\n          class=\"tag__remove ds-focus-ring-inset\"\n          onClick={this.handleRemove}\n          aria-label={this.removeLabel.replace('{label}', this.label)}\n          disabled={this.isInactive || undefined}\n        >\n          <ds-icon class=\"tag__remove-x\" name=\"Cross\" size={iconSize} color=\"inherit\"></ds-icon>\n        </button>\n      </Host>\n    );\n  }\n}\n"],"mappings":"8KAAA,MAAMA,EAAU,IAAM,6ncCctB,MAAMC,EAAkD,CACtDC,GAAI,KACJC,GAAI,KACJC,GAAI,M,MAaOC,EAAIC,EAAA,MAAAD,UAAAE,EALjB,WAAAC,CAAAC,G,6EAQUC,KAAAC,MAAmB,UACnBD,KAAAE,KAAiB,KACjBF,KAAAG,QAAmB,MAEnBH,KAAAI,WAAsB,MAEtBJ,KAAAK,YAAsB,iBAKtBL,KAAAM,aAAgBC,IACtBA,EAAEC,kBACF,GAAIR,KAAKI,WAAY,OACrBJ,KAAKS,SAASC,MAAM,CA6CvB,CA1CC,MAAAC,GACE,MAAMC,EAAcC,EAAqBb,KAAKE,MAC9C,MAAMY,EAAWvB,EAAUS,KAAKE,MAEhC,MAAMa,EAAgBf,KAAKgB,UAAY,KACnC,CAAEA,gBAAiBhB,KAAKgB,WAAa,SAAW,GAAGhB,KAAKgB,aAAehB,KAAKgB,UAC5EC,UAEJ,OACEC,EAACC,EAAI,CAAAC,IAAA,2CACHC,MAAO,CACLC,IAAO,KACPC,KAAQ,KACR,CAAC,SAASvB,KAAKC,SAAU,KACzB,CAAC,aAAaD,KAAKE,QAAS,KAC5B,iBAAkBF,KAAKE,OAAS,KAChC,iBAAkBF,KAAKE,OAAS,KAChC,iBAAkBF,KAAKE,OAAS,KAChC,eAAgBF,KAAKG,QACrB,iBAAkB,KAElB,uBAAwBH,KAAKI,WAC7B,sBAAuBJ,KAAKI,YAE9BoB,MAAOT,EAAa,gBACLf,KAAKI,WAAa,OAASa,WAE1CC,EAAA,WAAAE,IAAA,2CAASC,MAAM,aAAaI,GAAG,OAAOC,QAASd,EAAae,MAAM,WAC/D3B,KAAK4B,OAERV,EAAA,UAAAE,IAAA,2CACES,KAAK,SACLR,MAAM,kCACNS,QAAS9B,KAAKM,aAAY,aACdN,KAAKK,YAAY0B,QAAQ,UAAW/B,KAAK4B,OACrDI,SAAUhC,KAAKI,YAAca,WAE7BC,EAAA,WAAAE,IAAA,2CAASC,MAAM,gBAAgBY,KAAK,QAAQ/B,KAAMY,EAAUa,MAAM,a","ignoreList":[]}
+{"version":3,"names":["chipCss","ICON_SIZE","md","sm","xs","Chip","__stencil_proxyCustomElement","HTMLElement","constructor","registerHost","this","state","size","rounded","isInactive","removeLabel","handleRemove","e","stopPropagation","dsRemove","emit","render","textVariant","CONTROL_TEXT_VARIANT","iconSize","maxWidthStyle","maxWidth","undefined","h","Host","key","class","tag","chip","style","as","variant","color","label","type","onClick","replace","disabled","name"],"sources":["src/wc/components/Chip/Chip.css?tag=ds-chip&encapsulation=scoped","src/wc/components/Chip/Chip.tsx"],"sourcesContent":["@import '../../utils/tag-chip.css';\n\n/*\n * Semantic state colors — Chip’s differentiator from Tag.\n * All states use the faint contrast weight; hue comes from the state.\n */\n:host(.chip--default) {\n  background-color: var(--color-background-faint-neutral);\n  color: var(--color-foreground-bold-neutral);\n}\n\n:host(.chip--active) {\n  background-color: var(--color-background-faint-brand);\n  color: var(--color-foreground-bold-brand);\n}\n\n:host(.chip--error) {\n  background-color: var(--color-background-faint-negative);\n  color: var(--color-foreground-bold-negative);\n}\n\n:host(.chip--caution) {\n  background-color: var(--color-background-faint-caution);\n  color: var(--color-foreground-bold-caution);\n}\n\n/*\n * Label↔dismiss uses host gap, mirroring Tag icon↔label spacing:\n * [inset][text][inset][gap][icon].\n */\n.tag__remove {\n  padding: 0;\n  margin: 0;\n  border: none;\n  background: none;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  cursor: default;\n  color: inherit;\n  flex-shrink: 0;\n  position: relative;\n  z-index: 2;\n  border-radius: var(--dimension-radius-half);\n}\n\n.tag__remove::before {\n  content: '';\n  position: absolute;\n  inset: var(--dimension-space-n025);\n  border-radius: var(--dimension-radius-half);\n  background-color: transparent;\n  transition: var(--effect-transition-interaction-background-short-2);\n  pointer-events: none;\n}\n\n@media (hover: hover) and (pointer: fine) {\n  .tag__remove:hover::before {\n    background-color: var(--color-interaction-hover);\n  }\n}\n\n.tag__remove:active::before {\n  background-color: var(--color-interaction-pressed);\n}\n\n:host(.tag--size-sm) .tag__remove::before {\n  inset: var(--dimension-space-n012);\n}\n\n:host(.tag--size-xs) .tag__remove::before {\n  inset: 0;\n}\n\n.tag__remove-x {\n  display: inline-flex;\n  flex-shrink: 0;\n  width: var(--ds-control-icon);\n  height: var(--ds-control-icon);\n}\n","import { Component, Prop, Event, EventEmitter, h, Host } from '@stencil/core';\nimport { CONTROL_TEXT_VARIANT } from '../../utils';\n\n/**\n * Semantic chip state — replaces Tag’s intent × contrast matrix.\n * - `default` — neutral faint\n * - `active` — brand faint\n * - `error` — negative faint\n * - `caution` — caution faint\n */\nexport type ChipState = 'default' | 'active' | 'error' | 'caution';\nexport type ChipSize = 'md' | 'sm' | 'xs';\n\n/** Dismiss `ds-icon` size — same iconography metrics as Tag’s leading icon. */\nconst ICON_SIZE: Record<ChipSize, 'md' | 'sm' | 'xs'> = {\n  md: 'md',\n  sm: 'sm',\n  xs: 'xs',\n};\n\n/**\n * Removable chip — same density recipe as Tag, but colored by semantic `state`\n * (not intent × contrast). Not a toggle/select control; the only intentional\n * action is remove.\n */\n@Component({\n  tag: 'ds-chip',\n  styleUrl: 'Chip.css',\n  scoped: true,\n})\nexport class Chip {\n  @Prop() label!: string;\n  /** Semantic color state. @default 'default' */\n  @Prop() state: ChipState = 'default';\n  @Prop() size: ChipSize = 'md';\n  @Prop() rounded: boolean = false;\n  @Prop() maxWidth: string | number | undefined;\n  @Prop() isInactive: boolean = false;\n  /** Accessible remove action. Use `{label}` as the chip-label placeholder. */\n  @Prop() removeLabel: string = 'Remove {label}';\n\n  /** Fired when the remove button is clicked. */\n  @Event() dsRemove!: EventEmitter<void>;\n\n  private handleRemove = (e: MouseEvent) => {\n    e.stopPropagation();\n    if (this.isInactive) return;\n    this.dsRemove.emit();\n  };\n\n  render() {\n    const textVariant = CONTROL_TEXT_VARIANT[this.size];\n    const iconSize = ICON_SIZE[this.size];\n\n    const maxWidthStyle = this.maxWidth != null\n      ? { maxWidth: typeof this.maxWidth === 'number' ? `${this.maxWidth}px` : this.maxWidth }\n      : undefined;\n\n    return (\n      <Host\n        class={{\n          'tag': true,\n          'chip': true,\n          [`chip--${this.state}`]: true,\n          [`tag--size-${this.size}`]: true,\n          'ds-control--md': this.size === 'md',\n          'ds-control--sm': this.size === 'sm',\n          'ds-control--xs': this.size === 'xs',\n          'tag--rounded': this.rounded,\n          'tag--removable': true,\n          /* Hover overlay on the chip surface — dismiss is the only action. */\n          'ds-interaction-fill': !this.isInactive,\n          'ds-control-inactive': this.isInactive,\n        }}\n        style={maxWidthStyle}\n        aria-disabled={this.isInactive ? 'true' : undefined}\n      >\n        <ds-text class=\"tag__label\" as=\"span\" variant={textVariant} color=\"inherit\">\n          {this.label}\n        </ds-text>\n        <button\n          type=\"button\"\n          class=\"tag__remove ds-focus-ring-inset\"\n          onClick={this.handleRemove}\n          aria-label={this.removeLabel.replace('{label}', this.label)}\n          disabled={this.isInactive || undefined}\n        >\n          <ds-icon class=\"tag__remove-x\" name=\"Cross\" size={iconSize} color=\"inherit\"></ds-icon>\n        </button>\n      </Host>\n    );\n  }\n}\n"],"mappings":"8KAAA,MAAMA,EAAU,IAAM,+ocCctB,MAAMC,EAAkD,CACtDC,GAAI,KACJC,GAAI,KACJC,GAAI,M,MAaOC,EAAIC,EAAA,MAAAD,UAAAE,EALjB,WAAAC,CAAAC,G,6EAQUC,KAAAC,MAAmB,UACnBD,KAAAE,KAAiB,KACjBF,KAAAG,QAAmB,MAEnBH,KAAAI,WAAsB,MAEtBJ,KAAAK,YAAsB,iBAKtBL,KAAAM,aAAgBC,IACtBA,EAAEC,kBACF,GAAIR,KAAKI,WAAY,OACrBJ,KAAKS,SAASC,MAAM,CA6CvB,CA1CC,MAAAC,GACE,MAAMC,EAAcC,EAAqBb,KAAKE,MAC9C,MAAMY,EAAWvB,EAAUS,KAAKE,MAEhC,MAAMa,EAAgBf,KAAKgB,UAAY,KACnC,CAAEA,gBAAiBhB,KAAKgB,WAAa,SAAW,GAAGhB,KAAKgB,aAAehB,KAAKgB,UAC5EC,UAEJ,OACEC,EAACC,EAAI,CAAAC,IAAA,2CACHC,MAAO,CACLC,IAAO,KACPC,KAAQ,KACR,CAAC,SAASvB,KAAKC,SAAU,KACzB,CAAC,aAAaD,KAAKE,QAAS,KAC5B,iBAAkBF,KAAKE,OAAS,KAChC,iBAAkBF,KAAKE,OAAS,KAChC,iBAAkBF,KAAKE,OAAS,KAChC,eAAgBF,KAAKG,QACrB,iBAAkB,KAElB,uBAAwBH,KAAKI,WAC7B,sBAAuBJ,KAAKI,YAE9BoB,MAAOT,EAAa,gBACLf,KAAKI,WAAa,OAASa,WAE1CC,EAAA,WAAAE,IAAA,2CAASC,MAAM,aAAaI,GAAG,OAAOC,QAASd,EAAae,MAAM,WAC/D3B,KAAK4B,OAERV,EAAA,UAAAE,IAAA,2CACES,KAAK,SACLR,MAAM,kCACNS,QAAS9B,KAAKM,aAAY,aACdN,KAAKK,YAAY0B,QAAQ,UAAW/B,KAAK4B,OACrDI,SAAUhC,KAAKI,YAAca,WAE7BC,EAAA,WAAAE,IAAA,2CAASC,MAAM,gBAAgBY,KAAK,QAAQ/B,KAAMY,EAAUa,MAAM,a","ignoreList":[]}

package/dist/components/ds-code-block.js

@@ -1,2 +1,2 @@
-import{C as o,d as s}from"./p-DXHq_AfZ.js";const t=o;const p=s;export{t as DsCodeBlock,p as defineCustomElement};
+import{C as o,d as s}from"./p-DT4WdAup.js";const p=o;const t=s;export{p as DsCodeBlock,t as defineCustomElement};
 //# sourceMappingURL=ds-code-block.js.map

package/dist/components/ds-conversation-list-item.js

@@ -1,2 +1,2 @@
-import{p as i,H as e,c as o,h as t,a as s,t as n}from"./index.js";import{d as r}from"./p-D8nnhQNJ.js";import{d as c}from"./p-Ca-I2UnB.js";import{d as a}from"./p-DZFilC--.js";const d=()=>`@media (forced-colors: active){.sc-ds-conversation-list-item:root,.sc-ds-conversation-list-item-h,.ds-forced-colors-scope.sc-ds-conversation-list-item{--ds-forced-color-surface:Canvas;--ds-forced-color-content:CanvasText;--ds-forced-color-control-boundary:ButtonText;--ds-forced-color-selected:Highlight;--ds-forced-color-on-selected:HighlightText;--ds-forced-color-disabled:GrayText}}.sc-ds-conversation-list-item-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-conversation-list-item-h,.ds-focus-ring.sc-ds-conversation-list-item,.ds-focus-ring-inset.sc-ds-conversation-list-item-h,.ds-focus-ring-inset.sc-ds-conversation-list-item{outline:none;-webkit-tap-highlight-color:transparent;touch-action:manipulation}.ds-focus-ring.sc-ds-conversation-list-item-h:focus-visible,.ds-focus-ring.sc-ds-conversation-list-item: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-conversation-list-item-h,.ds-focus-ring.ds-focus-ring--visible.sc-ds-conversation-list-item{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-conversation-list-item-h:focus-visible,.ds-focus-ring-inset.sc-ds-conversation-list-item:focus-visible{outline:none}.ds-focus-ring-inset.sc-ds-conversation-list-item-h:focus-visible::after,.ds-focus-ring-inset.sc-ds-conversation-list-item: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-conversation-list-item-h,.ds-focus-ring-inset.ds-focus-ring--visible.sc-ds-conversation-list-item{outline:none}.ds-focus-ring-inset.ds-focus-ring--visible.sc-ds-conversation-list-item-h::after,.ds-focus-ring-inset.ds-focus-ring--visible.sc-ds-conversation-list-item::after{outline:var(--ds-focus-ring-width) solid var(--ds-focus-ring-color);outline-offset:calc(-1 * var(--ds-focus-ring-width))}@media (forced-colors: active){.sc-ds-conversation-list-item-h{--ds-focus-ring-color:var(--ds-forced-color-selected)}}@media (forced-colors: active){.sc-ds-conversation-list-item:root,.sc-ds-conversation-list-item-h,.ds-forced-colors-scope.sc-ds-conversation-list-item{--ds-forced-color-surface:Canvas;--ds-forced-color-content:CanvasText;--ds-forced-color-control-boundary:ButtonText;--ds-forced-color-selected:Highlight;--ds-forced-color-on-selected:HighlightText;--ds-forced-color-disabled:GrayText}}@media (forced-colors: active){.sc-ds-conversation-list-item:root,.sc-ds-conversation-list-item-h,.ds-forced-colors-scope.sc-ds-conversation-list-item{--ds-forced-color-surface:Canvas;--ds-forced-color-content:CanvasText;--ds-forced-color-control-boundary:ButtonText;--ds-forced-color-selected:Highlight;--ds-forced-color-on-selected:HighlightText;--ds-forced-color-disabled:GrayText}}.ds-interaction-fill.sc-ds-conversation-list-item-h,.ds-interaction-fill.sc-ds-conversation-list-item{position:var(--ds-interaction-position, relative);z-index:var(--ds-interaction-z-index, 0);cursor:default;--ds-interaction-hover:var(--color-interaction-hover);--ds-interaction-pressed:var(--color-interaction-pressed);--ds-interaction-active:var(--color-interaction-active-brand);--ds-interaction-border-width:0px;--ds-interaction-border-color:transparent;--ds-interaction-divider-width:0px;--ds-interaction-divider-color:transparent;--ds-interaction-divider-inline-start-width:0px;--ds-interaction-divider-inline-start-color:transparent;--ds-interaction-divider-inline-end-width:0px;--ds-interaction-divider-inline-end-color:transparent}.ds-interaction-fill.sc-ds-conversation-list-item-h::before,.ds-interaction-fill.sc-ds-conversation-list-item::before,.ds-interaction-fill.sc-ds-conversation-list-item-h::after,.ds-interaction-fill.sc-ds-conversation-list-item::after{content:'';position:absolute;inset:0;border-radius:inherit;background:transparent;pointer-events:none;cursor:inherit;transition:none}.ds-interaction-fill.sc-ds-conversation-list-item-h::before,.ds-interaction-fill.sc-ds-conversation-list-item::before{z-index:1}.ds-interaction-fill.sc-ds-conversation-list-item-h::after,.ds-interaction-fill.sc-ds-conversation-list-item::after{z-index:3;box-shadow:inset 0 calc(-1 * var(--ds-interaction-divider-width)) 0 var(--ds-interaction-divider-color),     inset var(--ds-interaction-divider-inline-start-width) 0 0       var(--ds-interaction-divider-inline-start-color),     inset calc(-1 * var(--ds-interaction-divider-inline-end-width)) 0 0       var(--ds-interaction-divider-inline-end-color),     inset 0 0 0 var(--ds-interaction-border-width) var(--ds-interaction-border-color)}.ds-interaction-fill--bordered.sc-ds-conversation-list-item-h,.ds-interaction-fill--bordered.sc-ds-conversation-list-item{--ds-interaction-border-width:var(--dimension-stroke-width-012);--ds-interaction-border-color:var(--color-border-secondary)}.ds-interaction-fill--selected.sc-ds-conversation-list-item-h::before,.ds-interaction-fill--selected.sc-ds-conversation-list-item::before{background:var(--ds-interaction-active)}.ds-interaction-fill--selected.sc-ds-conversation-list-item-h,.ds-interaction-fill--selected.sc-ds-conversation-list-item{--ds-interaction-dot-ring:var(--ds-interaction-active)}@media (hover: hover) and (pointer: fine){.ds-interaction-fill.sc-ds-conversation-list-item-h:hover:not(:disabled)::after,.ds-interaction-fill.sc-ds-conversation-list-item:hover:not(:disabled)::after{background:var(--ds-interaction-hover)}}.ds-interaction-fill.sc-ds-conversation-list-item-h:active:not(:disabled)::after,.ds-interaction-fill.sc-ds-conversation-list-item:active:not(:disabled)::after{background:var(--ds-interaction-pressed)}.ds-interaction-fill--grouped.sc-ds-conversation-list-item-h::after,.ds-interaction-fill--grouped.sc-ds-conversation-list-item::after,.ds-interaction-fill--grouped.sc-ds-conversation-list-item-h:active:not(:disabled)::after,.ds-interaction-fill--grouped.sc-ds-conversation-list-item:active:not(:disabled)::after{background:var(--ds-interaction-group-fill, transparent)}@media (hover: hover) and (pointer: fine){.ds-interaction-fill--grouped.sc-ds-conversation-list-item-h:hover:not(:disabled)::after,.ds-interaction-fill--grouped.sc-ds-conversation-list-item:hover:not(:disabled)::after{background:var(--ds-interaction-group-fill, transparent)}}.ds-interaction-fill--grouped.sc-ds-conversation-list-item-h,.ds-interaction-fill--grouped.sc-ds-conversation-list-item{--ds-interaction-divider-width:var(--ds-interaction-group-divider-width, 0px);--ds-interaction-divider-color:var(--ds-interaction-group-divider-color, transparent);--ds-interaction-divider-inline-start-width:var(     --ds-interaction-group-divider-inline-start-width,     0px   );--ds-interaction-divider-inline-start-color:var(     --ds-interaction-group-divider-inline-start-color,     transparent   );--ds-interaction-divider-inline-end-width:var(     --ds-interaction-group-divider-inline-end-width,     0px   );--ds-interaction-divider-inline-end-color:var(     --ds-interaction-group-divider-inline-end-color,     transparent   )}.ds-interaction-fill.sc-ds-conversation-list-item-h>.ds-interaction-fill__content.sc-ds-conversation-list-item,.ds-interaction-fill.sc-ds-conversation-list-item>.ds-interaction-fill__content.sc-ds-conversation-list-item,.ds-interaction-fill__content.sc-ds-conversation-list-item{position:relative;z-index:2;cursor:inherit}.ds-interaction-fill--on-faint.sc-ds-conversation-list-item-h,.ds-interaction-fill--on-faint.sc-ds-conversation-list-item{--ds-interaction-active:var(--color-interaction-active)}.ds-interaction-fill--on-medium.sc-ds-conversation-list-item-h,.ds-interaction-fill--on-medium.sc-ds-conversation-list-item{--ds-interaction-hover:var(--color-interaction-on-medium-background-hover);--ds-interaction-pressed:var(--color-interaction-on-medium-background-pressed);--ds-interaction-active:var(--color-interaction-on-medium-background-active);--ds-focus-ring-color:var(--color-interaction-on-medium-background-focus)}.ds-interaction-fill--on-bold.sc-ds-conversation-list-item-h,.ds-interaction-fill--on-bold.sc-ds-conversation-list-item{--ds-interaction-hover:var(--color-interaction-on-bold-background-hover);--ds-interaction-pressed:var(--color-interaction-on-bold-background-pressed);--ds-interaction-active:var(--color-interaction-on-bold-background-active);--ds-focus-ring-color:var(--color-interaction-on-bold-background-focus)}.ds-interaction-fill--on-strong.sc-ds-conversation-list-item-h,.ds-interaction-fill--on-strong.sc-ds-conversation-list-item{--ds-interaction-hover:var(--color-interaction-on-strong-background-hover);--ds-interaction-pressed:var(--color-interaction-on-strong-background-pressed);--ds-interaction-active:var(--color-interaction-on-strong-background-active);--ds-focus-ring-color:var(--color-interaction-on-strong-background-focus)}.ds-interaction-fill--on-translucent.sc-ds-conversation-list-item-h,.ds-interaction-fill--on-translucent.sc-ds-conversation-list-item{--ds-interaction-hover:var(--color-translucent-interaction-hover);--ds-interaction-pressed:var(--color-translucent-interaction-pressed);--ds-interaction-active:var(--color-translucent-interaction-active);--ds-focus-ring-color:var(--color-translucent-interaction-focus)}.ds-interaction-fill--on-inverted.sc-ds-conversation-list-item-h,.ds-interaction-fill--on-inverted.sc-ds-conversation-list-item{--ds-interaction-hover:var(--color-inverted-interaction-hover);--ds-interaction-pressed:var(--color-inverted-interaction-pressed);--ds-interaction-active:var(--color-inverted-interaction-active);--ds-focus-ring-color:var(--color-inverted-interaction-focus)}.ds-interaction-fill--on-media.sc-ds-conversation-list-item-h,.ds-interaction-fill--on-media.sc-ds-conversation-list-item{--ds-interaction-hover:var(--color-media-interaction-hover);--ds-interaction-pressed:var(--color-media-interaction-pressed);--ds-interaction-active:var(--color-media-interaction-active);--ds-focus-ring-color:var(--color-media-interaction-focus)}.ds-interaction-fill--on-always-dark.sc-ds-conversation-list-item-h,.ds-interaction-fill--on-always-dark.sc-ds-conversation-list-item{--ds-interaction-hover:var(--color-always-dark-interaction-hover);--ds-interaction-pressed:var(--color-always-dark-interaction-pressed);--ds-interaction-active:var(--color-always-dark-interaction-active);--ds-focus-ring-color:var(--color-always-dark-interaction-focus)}.ds-interaction-fill--on-navigation.sc-ds-conversation-list-item-h,.ds-interaction-fill--on-navigation.sc-ds-conversation-list-item{--ds-interaction-hover:var(--color-navigation-interaction-hover);--ds-interaction-pressed:var(--color-navigation-interaction-pressed);--ds-interaction-active:var(--color-navigation-interaction-active);--ds-focus-ring-color:var(--color-navigation-interaction-focus)}@media (forced-colors: active){.ds-interaction-fill.sc-ds-conversation-list-item-h::after,.ds-interaction-fill.sc-ds-conversation-list-item::after{box-shadow:none;outline:var(--ds-interaction-border-width) solid       var(--ds-forced-color-control-boundary);outline-offset:calc(-1 * var(--ds-interaction-border-width))}.ds-interaction-fill--selected.sc-ds-conversation-list-item-h::before,.ds-interaction-fill--selected.sc-ds-conversation-list-item::before{background:transparent;outline:var(--dimension-stroke-width-025) solid var(--ds-forced-color-selected);outline-offset:calc(-1 * var(--dimension-stroke-width-025))}}@media (forced-colors: active) and (hover: hover) and (pointer: fine){.ds-interaction-fill.sc-ds-conversation-list-item-h:hover:not(:disabled):not(:focus-visible):not(:focus-within):not(.ds-focus-ring--visible)::after,.ds-interaction-fill.sc-ds-conversation-list-item:hover:not(:disabled):not(:focus-visible):not(:focus-within):not(.ds-focus-ring--visible)::after{outline-color:var(--ds-forced-color-selected);outline-width:var(--dimension-stroke-width-012)}}@media (forced-colors: active){.sc-ds-conversation-list-item:root,.sc-ds-conversation-list-item-h,.ds-forced-colors-scope.sc-ds-conversation-list-item{--ds-forced-color-surface:Canvas;--ds-forced-color-content:CanvasText;--ds-forced-color-control-boundary:ButtonText;--ds-forced-color-selected:Highlight;--ds-forced-color-on-selected:HighlightText;--ds-forced-color-disabled:GrayText}}.ds-control-inactive.sc-ds-conversation-list-item-h,.ds-control-inactive.sc-ds-conversation-list-item{opacity:var(--effect-opacity-medium);pointer-events:none;cursor:not-allowed}@media (forced-colors: active){.ds-control-inactive.sc-ds-conversation-list-item-h,.ds-control-inactive.sc-ds-conversation-list-item{color:var(--ds-forced-color-disabled);opacity:1}}.ds-control--lg.sc-ds-conversation-list-item,.ds-control--lg.sc-ds-conversation-list-item-h,.ds-control--md.sc-ds-conversation-list-item-h,.ds-control--md.sc-ds-conversation-list-item,.ds-control--sm.sc-ds-conversation-list-item-h,.ds-control--sm.sc-ds-conversation-list-item,.ds-control--xs.sc-ds-conversation-list-item-h,.ds-control--xs.sc-ds-conversation-list-item{--ds-control-radius:var(--dimension-radius-025)}.ds-control--lg.sc-ds-conversation-list-item-h,.ds-control--lg.sc-ds-conversation-list-item{--ds-control-height:var(--dimension-size-500);--ds-control-icon:var(--dimension-iconography-lg);--ds-control-padding-inline:var(--dimension-space-100);--ds-control-label-inset:var(--dimension-space-050);--ds-control-gap:var(--dimension-space-050)}.ds-control--md.sc-ds-conversation-list-item-h,.ds-control--md.sc-ds-conversation-list-item{--ds-control-height:var(--dimension-size-400);--ds-control-icon:var(--dimension-iconography-md);--ds-control-padding-inline:var(--dimension-space-075);--ds-control-label-inset:var(--dimension-space-025);--ds-control-gap:var(--dimension-space-050)}.ds-control--sm.sc-ds-conversation-list-item-h,.ds-control--sm.sc-ds-conversation-list-item{--ds-control-height:var(--dimension-size-300);--ds-control-icon:var(--dimension-iconography-sm);--ds-control-padding-inline:var(--dimension-space-050);--ds-control-label-inset:var(--dimension-space-025);--ds-control-gap:var(--dimension-space-025)}.ds-control--xs.sc-ds-conversation-list-item-h,.ds-control--xs.sc-ds-conversation-list-item{--ds-control-height:var(--dimension-size-200);--ds-control-icon:var(--dimension-iconography-xs);--ds-control-padding-inline:var(--dimension-space-025);--ds-control-label-inset:var(--dimension-space-025);--ds-control-gap:0}.ds-chrome-space--sm.sc-ds-conversation-list-item-h,.ds-chrome-space--sm.sc-ds-conversation-list-item{--ds-chrome-padding:var(--dimension-space-050);--ds-chrome-gap:var(--dimension-space-050)}.ds-chrome-space--md.sc-ds-conversation-list-item-h,.ds-chrome-space--md.sc-ds-conversation-list-item{--ds-chrome-padding:var(--dimension-space-100);--ds-chrome-gap:var(--dimension-space-100)}.ds-chrome-space--lg.sc-ds-conversation-list-item-h,.ds-chrome-space--lg.sc-ds-conversation-list-item{--ds-chrome-padding:var(--dimension-space-200);--ds-chrome-gap:var(--dimension-space-200)}.ds-chrome-row.sc-ds-conversation-list-item-h,.ds-chrome-row.sc-ds-conversation-list-item,.ds-chrome-column.sc-ds-conversation-list-item-h,.ds-chrome-column.sc-ds-conversation-list-item,.ds-chrome-grid.sc-ds-conversation-list-item-h,.ds-chrome-grid.sc-ds-conversation-list-item{display:flex;box-sizing:border-box;gap:var(--ds-chrome-gap, var(--dimension-space-100));padding:var(--ds-chrome-padding, var(--dimension-space-100))}.ds-chrome-row.sc-ds-conversation-list-item-h,.ds-chrome-row.sc-ds-conversation-list-item{flex-direction:row;align-items:center}.ds-chrome-column.sc-ds-conversation-list-item-h,.ds-chrome-column.sc-ds-conversation-list-item{flex-direction:column}.ds-chrome-grid.sc-ds-conversation-list-item-h,.ds-chrome-grid.sc-ds-conversation-list-item{display:grid;align-items:center}.ds-control-frame.sc-ds-conversation-list-item{display:inline-flex;align-items:center;box-sizing:border-box;height:var(--ds-control-height, var(--dimension-size-400));padding-inline:var(--ds-control-padding-inline, var(--dimension-space-075));gap:var(--ds-control-gap, var(--dimension-space-050));border-radius:var(--ds-control-radius, var(--dimension-radius-025))}.ds-control-section-heading.sc-ds-conversation-list-item{display:flex;align-items:center;box-sizing:border-box;height:var(--ds-control-height, var(--dimension-size-400));padding-inline:calc(     var(--ds-control-padding-inline, var(--dimension-space-075)) +       var(--ds-control-label-inset, var(--dimension-space-025))   )}.ds-control-icon-box.sc-ds-conversation-list-item{display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;width:var(--ds-control-icon, var(--dimension-iconography-md));height:var(--ds-control-icon, var(--dimension-iconography-md))}.ds-control-label-box.sc-ds-conversation-list-item{min-width:0;padding-inline:var(--ds-control-label-inset, var(--dimension-space-025))}.ds-control-label-dot.sc-ds-conversation-list-item{position:relative;padding-inline-end:calc(     var(--ds-control-label-inset, var(--dimension-space-025)) +       var(--ds-control-gap, var(--dimension-space-050))   )}.ds-control-label-dot__badge.sc-ds-conversation-list-item{position:absolute;inset-block-start:0;inset-inline-end:0;pointer-events:none}.ds-empty-region.sc-ds-conversation-list-item{display:flex;flex:1 1 auto;align-items:center;justify-content:center;box-sizing:border-box;min-width:0;min-height:0}.ds-empty-region--padded.sc-ds-conversation-list-item{padding:var(--dimension-space-200)}.sc-ds-conversation-list-item:where(.ds-text-decoration,.ds-text-action).sc-ds-conversation-list-item{text-decoration-color:var(--ds-text-decoration-color, var(--color-foreground-tertiary));text-decoration-thickness:var(--ds-text-decoration-thickness, var(--dimension-stroke-width-012));text-underline-offset:var(--ds-text-decoration-offset, var(--dimension-space-025))}.ds-text-action.sc-ds-conversation-list-item{--ds-text-action-foreground:var(--color-foreground-bold-brand);--ds-text-decoration-color:var(--ds-text-action-foreground);color:var(--ds-text-action-foreground);text-decoration-line:none}.ds-text-action--on-medium.sc-ds-conversation-list-item{--ds-text-action-foreground:var(--color-foreground-on-medium-background-primary);--ds-text-decoration-color:var(--color-foreground-on-medium-background-secondary);text-decoration-line:underline}.ds-text-action--on-strong.sc-ds-conversation-list-item{--ds-text-action-foreground:var(--color-foreground-on-strong-background-primary);--ds-text-decoration-color:var(--color-foreground-on-strong-background-secondary);text-decoration-line:underline}.ds-text-action--on-bold.sc-ds-conversation-list-item{--ds-text-action-foreground:var(--color-foreground-on-bold-background-primary);--ds-text-decoration-color:var(--color-foreground-on-bold-background-secondary);text-decoration-line:underline}@media (hover: hover) and (pointer: fine){.ds-text-action.sc-ds-conversation-list-item:hover{text-decoration-line:underline}}@media (forced-colors: active){.ds-text-action.sc-ds-conversation-list-item{text-decoration-line:underline;text-decoration-color:currentcolor}}.ds-choice-popup.sc-ds-conversation-list-item{box-sizing:border-box;display:flex;flex-direction:column;min-width:var(--dimension-menu-width-xs);max-width:min(     var(--dimension-panel-width-lg),     calc(100vw - var(--dimension-space-200))   );max-height:calc(100vh - var(--dimension-space-200));overflow:hidden;inset:auto;margin:0;padding:0;border:0;background-color:var(--color-background-primary);border-radius:var(--dimension-radius-075);box-shadow:var(--effect-shadow-elevated-floating);animation:dsChoiceFadeIn var(--effect-motion-short-2) forwards;backface-visibility:hidden;will-change:transform;text-align:start}.ds-choice-popup.sc-ds-conversation-list-item::after{content:'';position:absolute;inset:0;border-radius:inherit;pointer-events:none;box-shadow:var(--effect-highlight-elevated-floating)}.ds-choice-popup--closing.sc-ds-conversation-list-item{animation:dsChoiceFadeOut var(--effect-motion-short-2) forwards}@keyframes dsChoiceFadeIn{from{opacity:0;transform:inherit scale(0.97)}to{opacity:1}}@keyframes dsChoiceFadeOut{from{opacity:1}to{opacity:0}}@media (prefers-reduced-motion: reduce){.ds-choice-popup.sc-ds-conversation-list-item{animation:none;opacity:1}.ds-choice-popup--closing.sc-ds-conversation-list-item{opacity:0}}.ds-choice-list.sc-ds-conversation-list-item{display:flex;flex-direction:column;min-height:0;overflow-y:auto;overscroll-behavior:contain}.ds-choice-section--divided.sc-ds-conversation-list-item{border-bottom:var(--dimension-stroke-width-015) solid var(--color-border-tertiary)}ds-text.ds-choice-section__header.sc-ds-conversation-list-item{text-align:start;-webkit-user-select:none;user-select:none}.ds-choice-section--headed-after-first.sc-ds-conversation-list-item{margin-block-start:var(--dimension-space-050)}.ds-choice-item.sc-ds-conversation-list-item{width:100%;border:none;border-radius:var(--ds-control-radius, var(--dimension-radius-025));background:transparent;cursor:default;-webkit-user-select:none;user-select:none;text-align:left;color:inherit}.ds-choice-item.sc-ds-conversation-list-item:has(.ds-choice-item__subtext){height:auto;min-height:var(--ds-control-height, var(--dimension-size-400));padding-block:var(--ds-control-padding-inline, var(--dimension-space-075));align-items:flex-start}.ds-choice-item__content.sc-ds-conversation-list-item{display:flex;flex:1;flex-direction:column;gap:var(--dimension-space-025);min-width:0}ds-text.ds-choice-item__label.sc-ds-conversation-list-item{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}ds-text.ds-choice-item__subtext.sc-ds-conversation-list-item{display:-webkit-box;overflow:hidden;white-space:normal;-webkit-box-orient:vertical;-webkit-line-clamp:2}.ds-choice-item__icon.sc-ds-conversation-list-item,.ds-choice-item__suffix.sc-ds-conversation-list-item{display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;width:var(--ds-control-icon, var(--dimension-iconography-md));height:var(--ds-control-icon, var(--dimension-iconography-md));pointer-events:none}.ds-choice-item__tag.sc-ds-conversation-list-item{flex-shrink:0;pointer-events:none}.ds-choice-empty.sc-ds-conversation-list-item,.ds-choice-loading.sc-ds-conversation-list-item{min-height:var(--dimension-size-600);padding:var(--dimension-space-100)}.ds-choice-footer.sc-ds-conversation-list-item{position:relative;box-sizing:border-box;padding-block:var(--dimension-space-050)}.ds-choice-footer.sc-ds-conversation-list-item::before{content:'';position:absolute;inset:0 0 auto;height:var(--dimension-stroke-width-012);background-color:var(--color-border-tertiary);pointer-events:none}.ds-choice-footer__content.sc-ds-conversation-list-item{display:flex;align-items:center;justify-content:space-between;column-gap:var(--dimension-space-050);box-sizing:border-box;height:var(--ds-control-height, var(--dimension-size-400))}.ds-choice-footer__summary.sc-ds-conversation-list-item,.ds-choice-footer__summary-measure.sc-ds-conversation-list-item,.ds-choice-footer__clear.sc-ds-conversation-list-item ds-text.sc-ds-conversation-list-item,.ds-choice-footer__action.sc-ds-conversation-list-item ds-text.sc-ds-conversation-list-item{padding-inline:calc(     var(--dimension-space-050) +       var(--ds-control-padding-inline, var(--dimension-space-075)) +       var(--ds-control-label-inset, var(--dimension-space-025))   )}.ds-choice-footer__summary.sc-ds-conversation-list-item,.ds-choice-footer__summary-measure.sc-ds-conversation-list-item,.ds-choice-footer__clear.sc-ds-conversation-list-item,.ds-choice-footer__action.sc-ds-conversation-list-item{white-space:nowrap}.ds-choice-footer__summary-measure.sc-ds-conversation-list-item{position:absolute;visibility:hidden;pointer-events:none}.ds-choice-footer__clear.sc-ds-conversation-list-item,.ds-choice-footer__action.sc-ds-conversation-list-item{appearance:none;display:inline-flex;align-items:center;padding:0;border:0;border-radius:var(--dimension-radius-025);background:transparent;cursor:default}@media (forced-colors: active){.ds-choice-popup.sc-ds-conversation-list-item{outline:var(--dimension-stroke-width-012) solid var(--ds-forced-color-content);outline-offset:calc(-1 * var(--dimension-stroke-width-012))}.ds-choice-popup.sc-ds-conversation-list-item::after{box-shadow:none}.ds-choice-section--divided.sc-ds-conversation-list-item{border-bottom-color:var(--ds-forced-color-content)}.ds-choice-footer.sc-ds-conversation-list-item::before{background-color:var(--ds-forced-color-content)}}.ds-visually-hidden.sc-ds-conversation-list-item-h,.ds-visually-hidden.sc-ds-conversation-list-item{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0, 0, 0, 0);white-space:nowrap;border:0}.ds-control-elevation.sc-ds-conversation-list-item-h,.ds-control-elevation.sc-ds-conversation-list-item{position:relative;overflow:visible;box-shadow:var(--ds-control-elevation-shadow, none)}.ds-control-elevation.sc-ds-conversation-list-item-h::after,.ds-control-elevation.sc-ds-conversation-list-item::after{content:'';position:absolute;inset:0;z-index:4;border-radius:inherit;box-shadow:var(--ds-control-elevation-highlight, none);pointer-events:none}.ds-control-elevation--sm.sc-ds-conversation-list-item-h,.ds-control-elevation--sm.sc-ds-conversation-list-item{--ds-control-elevation-shadow:var(--effect-shadow-elevated-sm);--ds-control-elevation-highlight:var(--effect-highlight-elevated-sm)}.ds-control-elevation--md.sc-ds-conversation-list-item-h,.ds-control-elevation--md.sc-ds-conversation-list-item{--ds-control-elevation-shadow:var(--effect-shadow-elevated-md);--ds-control-elevation-highlight:var(--effect-highlight-elevated-md)}.ds-control-elevation--floating.sc-ds-conversation-list-item-h,.ds-control-elevation--floating.sc-ds-conversation-list-item{--ds-control-elevation-shadow:var(--effect-shadow-elevated-floating);--ds-control-elevation-highlight:var(--effect-highlight-elevated-floating)}.ds-control-elevation--press-scale.sc-ds-conversation-list-item{--ds-control-press-active-scale:var(--dimension-scale-default);transition:scale var(--effect-motion-short-2)}.ds-control-elevation--press-scale[data-ds-press-active].sc-ds-conversation-list-item{scale:var(--dimension-scale-subtle)}@media (prefers-reduced-motion: reduce){.ds-control-elevation--press-scale.sc-ds-conversation-list-item,.ds-control-elevation--press-scale[data-ds-press-active].sc-ds-conversation-list-item{scale:none;transition:none}}.sc-ds-conversation-list-item-h{display:block;box-sizing:border-box;-webkit-user-select:none;user-select:none}.sc-ds-conversation-list-item-h:focus-within,.conversation-list-item--actions-open.sc-ds-conversation-list-item-h{position:relative;z-index:var(--dimension-z-index-floating)}.conversation-list-item__row.sc-ds-conversation-list-item{position:relative;isolation:isolate}.conversation-list-item.sc-ds-conversation-list-item{color:var(--color-foreground-primary)}.conversation-list-item--error.sc-ds-conversation-list-item{--ds-interaction-border-width:var(--dimension-stroke-width-012);--ds-interaction-border-color:var(--color-border-bold-negative)}.conversation-list-item__leading.sc-ds-conversation-list-item:empty,.conversation-list-item__trailing.sc-ds-conversation-list-item:empty{display:none}.conversation-list-item__leading.sc-ds-conversation-list-item,.conversation-list-item__trailing.sc-ds-conversation-list-item,.conversation-list-item__preview-row.sc-ds-conversation-list-item{display:flex;align-items:center}.conversation-list-item__leading.sc-ds-conversation-list-item{align-self:center;width:auto;height:auto;margin-inline-start:var(--ds-control-label-inset, var(--dimension-space-025));margin-inline-end:var(--dimension-space-050)}.conversation-list-item__content.sc-ds-conversation-list-item{min-width:0}.conversation-list-item__title-row.sc-ds-conversation-list-item{display:flex;align-items:center;min-width:0}.conversation-list-item__preview-row.sc-ds-conversation-list-item{min-width:0;gap:var(--dimension-space-050)}ds-text.conversation-list-item__title.sc-ds-conversation-list-item,ds-text.conversation-list-item__preview.sc-ds-conversation-list-item{display:block;min-width:0}ds-text.conversation-list-item__title.sc-ds-conversation-list-item{flex:1}.conversation-list-item__unread.sc-ds-conversation-list-item{display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;width:var(--dimension-size-200);margin-inline-end:var(--dimension-space-025)}ds-text.conversation-list-item__preview.ds-choice-item__subtext.sc-ds-conversation-list-item{-webkit-line-clamp:1}.conversation-list-item__actions.sc-ds-conversation-list-item{position:absolute;top:50%;right:var(--dimension-space-100);z-index:var(--dimension-z-index-floating);display:flex;align-items:center;justify-content:center;border-radius:var(--dimension-radius-half);background:var(--color-background-transparent);-webkit-backdrop-filter:blur(var(--effect-blur-sm));backdrop-filter:blur(var(--effect-blur-sm));opacity:0;pointer-events:none;transform:translateY(-50%)}.conversation-list-item__row.sc-ds-conversation-list-item:has(:focus-visible) .conversation-list-item__actions.sc-ds-conversation-list-item,.conversation-list-item--actions-open.sc-ds-conversation-list-item-h .conversation-list-item__actions.sc-ds-conversation-list-item{opacity:1;pointer-events:auto}.conversation-list-item--actions-open.sc-ds-conversation-list-item-h .conversation-list-item.sc-ds-conversation-list-item::after{background:var(--ds-interaction-hover)}.conversation-list-item__row.sc-ds-conversation-list-item:active .conversation-list-item.sc-ds-conversation-list-item::after{background:var(--ds-interaction-pressed)}@media (hover: hover) and (pointer: fine){.sc-ds-conversation-list-item-h:hover{position:relative;z-index:var(--dimension-z-index-floating)}.conversation-list-item__row.sc-ds-conversation-list-item:hover .conversation-list-item__actions.sc-ds-conversation-list-item{opacity:1;pointer-events:auto}.conversation-list-item__row.sc-ds-conversation-list-item:hover .conversation-list-item.sc-ds-conversation-list-item::after{background:var(--ds-interaction-hover)}}@media (hover: none){.conversation-list-item__actions.sc-ds-conversation-list-item{opacity:1;pointer-events:auto}.conversation-list-item--has-actions.sc-ds-conversation-list-item-h .conversation-list-item__title-row.sc-ds-conversation-list-item{padding-inline-end:var(--dimension-size-400)}}`;const l=i(class i extends e{constructor(i){super();if(i!==false){this.__registerHost()}this.dsSelect=o(this,"dsSelect");this.conversationId="";this.conversationTitle="";this.preview="";this.updatedAt="";this.selected=false;this.state="default";this.statusLabel="";this.unreadCount=0;this.actionsOpen=false;this.handleClick=()=>this.dsSelect.emit({id:this.conversationId});this.handleActionsSlotChange=i=>{const e=i.target;this.el.classList.toggle("conversation-list-item--has-actions",e.assignedElements().length>0)}}render(){const i=this.state==="busy";const e=i&&this.statusLabel?this.statusLabel:this.preview;const o=[this.conversationTitle,e,this.unreadCount>0?`${this.unreadCount} unread`:""].filter(Boolean).join(". ");return t(s,{key:"0b9b88880134edd989f52c7607404dbba2caac91",role:"listitem",class:{"conversation-list-item--actions-open":this.actionsOpen}},t("div",{key:"e055d1d3626db7dd15834bd3417634755b9a071c",class:"conversation-list-item__row"},t("button",{key:"723bfe9cf7de4737f044f3946facec3c4144cb68",type:"button",class:{"conversation-list-item":true,"ds-choice-item":true,"ds-control-frame":true,"ds-control--md":true,"ds-focus-ring-inset":true,"ds-interaction-fill":true,"ds-interaction-fill--selected":this.selected,"conversation-list-item--error":this.state==="error"},"aria-label":o,"aria-current":this.selected?"true":undefined,"aria-busy":i?"true":undefined,onClick:this.handleClick},t("span",{key:"26ed82ab0e1225e825d032bbb8b0dac90e610b3d",class:"conversation-list-item__leading ds-choice-item__icon ds-control-icon-box ds-interaction-fill__content"},t("slot",{key:"ee79dee1948d02f02095cef4e2e32db8f4e979ae",name:"leading"})),t("span",{key:"8c4cd43c88e2f862666fafdffc8ca710fdc1e9dc",class:"conversation-list-item__content ds-choice-item__content ds-interaction-fill__content"},t("span",{key:"b6859eb2d0ca542b50e0a7b6551527c03e427904",class:"conversation-list-item__title-row"},t("ds-text",{key:"137f4420cefd644904cb7874598b728d8c2b847a",class:"conversation-list-item__title ds-choice-item__label ds-control-label-box",as:"span",variant:"text-body-medium",emphasis:this.unreadCount>0,color:this.unreadCount>0?"primary":"secondary",lineTruncation:1},this.conversationTitle),this.unreadCount>0?t("span",{class:"conversation-list-item__unread"},t("ds-badge",{variant:"dot",surface:"secondary",hasRing:false})):null),t("span",{key:"8bb7a02da2643c1fc42ec3cd90813250fa68960e",class:"conversation-list-item__preview-row"},i?t("ds-loader",{size:"sm",color:"secondary"}):null,t("ds-text",{key:"120fb8e12ee3cfbff3afd08b6f102ff474eaf666",class:"conversation-list-item__preview ds-choice-item__subtext ds-control-label-box",as:"span",variant:"text-body-small",color:this.state==="error"?"negative":"secondary",lineTruncation:1},e)),this.updatedAt?t("time",{class:"conversation-list-item__time ds-visually-hidden",dateTime:this.updatedAt},this.updatedAt):null),t("span",{key:"ad5a195de56ef1037ea982332f7dd2e7a2100b36",class:"conversation-list-item__trailing ds-interaction-fill__content"},t("slot",{key:"8d1ee445dec02a40d880d213422bd542cc5335a0",name:"trailing"}))),t("div",{key:"5fd007848fc4be58e3adfe4bf171ce58f7fa56da",class:"conversation-list-item__actions ds-control-elevation ds-control-elevation--md ds-control-elevation--press-scale"},t("slot",{key:"27e306a5f223eb133cceae4ba2d9791801c9b14d",name:"actions",onSlotchange:this.handleActionsSlotChange}))))}get el(){return this}static get style(){return d()}},[262,"ds-conversation-list-item",{conversationId:[1,"conversation-id"],conversationTitle:[1,"conversation-title"],preview:[1],updatedAt:[1,"updated-at"],selected:[4],state:[1],statusLabel:[1,"status-label"],unreadCount:[2,"unread-count"],actionsOpen:[516,"actions-open"]}]);function v(){if(typeof customElements==="undefined"){return}const i=["ds-conversation-list-item","ds-badge","ds-loader","ds-text"];i.forEach((i=>{switch(i){case"ds-conversation-list-item":if(!customElements.get(n(i))){customElements.define(n(i),l)}break;case"ds-badge":if(!customElements.get(n(i))){r()}break;case"ds-loader":if(!customElements.get(n(i))){c()}break;case"ds-text":if(!customElements.get(n(i))){a()}break}}))}v();const m=l;const f=v;export{m as DsConversationListItem,f as defineCustomElement};
+import{p as i,H as e,c as o,h as t,a as s,t as n}from"./index.js";import{d as r}from"./p-D8nnhQNJ.js";import{d as c}from"./p-Ca-I2UnB.js";import{d as a}from"./p-DZFilC--.js";const d=()=>`@media (forced-colors: active){.sc-ds-conversation-list-item:root,.sc-ds-conversation-list-item-h,.ds-forced-colors-scope.sc-ds-conversation-list-item{--ds-forced-color-surface:Canvas;--ds-forced-color-content:CanvasText;--ds-forced-color-control-boundary:ButtonText;--ds-forced-color-selected:Highlight;--ds-forced-color-on-selected:HighlightText;--ds-forced-color-disabled:GrayText}}.sc-ds-conversation-list-item-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-conversation-list-item-h,.ds-focus-ring.sc-ds-conversation-list-item,.ds-focus-ring-inset.sc-ds-conversation-list-item-h,.ds-focus-ring-inset.sc-ds-conversation-list-item{outline:none;-webkit-tap-highlight-color:transparent;touch-action:manipulation}.ds-focus-ring.sc-ds-conversation-list-item-h:focus-visible,.ds-focus-ring.sc-ds-conversation-list-item: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-conversation-list-item-h,.ds-focus-ring.ds-focus-ring--visible.sc-ds-conversation-list-item{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-conversation-list-item-h:focus-visible,.ds-focus-ring-inset.sc-ds-conversation-list-item:focus-visible{outline:none}.ds-focus-ring-inset.sc-ds-conversation-list-item-h:focus-visible::after,.ds-focus-ring-inset.sc-ds-conversation-list-item: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-conversation-list-item-h,.ds-focus-ring-inset.ds-focus-ring--visible.sc-ds-conversation-list-item{outline:none}.ds-focus-ring-inset.ds-focus-ring--visible.sc-ds-conversation-list-item-h::after,.ds-focus-ring-inset.ds-focus-ring--visible.sc-ds-conversation-list-item::after{outline:var(--ds-focus-ring-width) solid var(--ds-focus-ring-color);outline-offset:calc(-1 * var(--ds-focus-ring-width))}@media (forced-colors: active){.sc-ds-conversation-list-item-h{--ds-focus-ring-color:var(--ds-forced-color-selected)}}@media (forced-colors: active){.sc-ds-conversation-list-item:root,.sc-ds-conversation-list-item-h,.ds-forced-colors-scope.sc-ds-conversation-list-item{--ds-forced-color-surface:Canvas;--ds-forced-color-content:CanvasText;--ds-forced-color-control-boundary:ButtonText;--ds-forced-color-selected:Highlight;--ds-forced-color-on-selected:HighlightText;--ds-forced-color-disabled:GrayText}}@media (forced-colors: active){.sc-ds-conversation-list-item:root,.sc-ds-conversation-list-item-h,.ds-forced-colors-scope.sc-ds-conversation-list-item{--ds-forced-color-surface:Canvas;--ds-forced-color-content:CanvasText;--ds-forced-color-control-boundary:ButtonText;--ds-forced-color-selected:Highlight;--ds-forced-color-on-selected:HighlightText;--ds-forced-color-disabled:GrayText}}.ds-interaction-fill.sc-ds-conversation-list-item-h,.ds-interaction-fill.sc-ds-conversation-list-item{position:var(--ds-interaction-position, relative);z-index:var(--ds-interaction-z-index, 0);cursor:default;--ds-interaction-hover:var(--color-interaction-hover);--ds-interaction-pressed:var(--color-interaction-pressed);--ds-interaction-active:var(--color-interaction-active-brand);--ds-interaction-border-width:0px;--ds-interaction-border-color:transparent;--ds-interaction-divider-width:0px;--ds-interaction-divider-color:transparent;--ds-interaction-divider-inline-start-width:0px;--ds-interaction-divider-inline-start-color:transparent;--ds-interaction-divider-inline-end-width:0px;--ds-interaction-divider-inline-end-color:transparent}.ds-interaction-fill.sc-ds-conversation-list-item-h::before,.ds-interaction-fill.sc-ds-conversation-list-item::before,.ds-interaction-fill.sc-ds-conversation-list-item-h::after,.ds-interaction-fill.sc-ds-conversation-list-item::after{content:'';position:absolute;inset:0;border-radius:inherit;background:transparent;pointer-events:none;cursor:inherit;transition:none}.ds-interaction-fill.sc-ds-conversation-list-item-h::before,.ds-interaction-fill.sc-ds-conversation-list-item::before{z-index:1}.ds-interaction-fill.sc-ds-conversation-list-item-h::after,.ds-interaction-fill.sc-ds-conversation-list-item::after{z-index:3;box-shadow:inset 0 calc(-1 * var(--ds-interaction-divider-width)) 0 var(--ds-interaction-divider-color),     inset var(--ds-interaction-divider-inline-start-width) 0 0       var(--ds-interaction-divider-inline-start-color),     inset calc(-1 * var(--ds-interaction-divider-inline-end-width)) 0 0       var(--ds-interaction-divider-inline-end-color),     inset 0 0 0 var(--ds-interaction-border-width) var(--ds-interaction-border-color)}.ds-interaction-fill--bordered.sc-ds-conversation-list-item-h,.ds-interaction-fill--bordered.sc-ds-conversation-list-item{--ds-interaction-border-width:var(--dimension-stroke-width-012);--ds-interaction-border-color:var(--color-border-secondary)}.ds-interaction-fill--selected.sc-ds-conversation-list-item-h::before,.ds-interaction-fill--selected.sc-ds-conversation-list-item::before{background:var(--ds-interaction-active)}.ds-interaction-fill--selected.sc-ds-conversation-list-item-h,.ds-interaction-fill--selected.sc-ds-conversation-list-item{--ds-interaction-dot-ring:var(--ds-interaction-active)}@media (hover: hover) and (pointer: fine){.ds-interaction-fill.sc-ds-conversation-list-item-h:hover:not(:disabled)::after,.ds-interaction-fill.sc-ds-conversation-list-item:hover:not(:disabled)::after{background:var(--ds-interaction-hover)}}.ds-interaction-fill.sc-ds-conversation-list-item-h:active:not(:disabled)::after,.ds-interaction-fill.sc-ds-conversation-list-item:active:not(:disabled)::after{background:var(--ds-interaction-pressed)}.ds-interaction-fill--grouped.sc-ds-conversation-list-item-h::after,.ds-interaction-fill--grouped.sc-ds-conversation-list-item::after,.ds-interaction-fill--grouped.sc-ds-conversation-list-item-h:active:not(:disabled)::after,.ds-interaction-fill--grouped.sc-ds-conversation-list-item:active:not(:disabled)::after{background:var(--ds-interaction-group-fill, transparent)}@media (hover: hover) and (pointer: fine){.ds-interaction-fill--grouped.sc-ds-conversation-list-item-h:hover:not(:disabled)::after,.ds-interaction-fill--grouped.sc-ds-conversation-list-item:hover:not(:disabled)::after{background:var(--ds-interaction-group-fill, transparent)}}.ds-interaction-fill--grouped.sc-ds-conversation-list-item-h,.ds-interaction-fill--grouped.sc-ds-conversation-list-item{--ds-interaction-divider-width:var(--ds-interaction-group-divider-width, 0px);--ds-interaction-divider-color:var(--ds-interaction-group-divider-color, transparent);--ds-interaction-divider-inline-start-width:var(     --ds-interaction-group-divider-inline-start-width,     0px   );--ds-interaction-divider-inline-start-color:var(     --ds-interaction-group-divider-inline-start-color,     transparent   );--ds-interaction-divider-inline-end-width:var(     --ds-interaction-group-divider-inline-end-width,     0px   );--ds-interaction-divider-inline-end-color:var(     --ds-interaction-group-divider-inline-end-color,     transparent   )}.ds-interaction-fill.sc-ds-conversation-list-item-h>.ds-interaction-fill__content.sc-ds-conversation-list-item,.ds-interaction-fill.sc-ds-conversation-list-item>.ds-interaction-fill__content.sc-ds-conversation-list-item,.ds-interaction-fill__content.sc-ds-conversation-list-item{position:relative;z-index:2;cursor:inherit}.ds-interaction-fill--on-faint.sc-ds-conversation-list-item-h,.ds-interaction-fill--on-faint.sc-ds-conversation-list-item{--ds-interaction-active:var(--color-interaction-active)}.ds-interaction-fill--on-medium.sc-ds-conversation-list-item-h,.ds-interaction-fill--on-medium.sc-ds-conversation-list-item{--ds-interaction-hover:var(--color-interaction-on-medium-background-hover);--ds-interaction-pressed:var(--color-interaction-on-medium-background-pressed);--ds-interaction-active:var(--color-interaction-on-medium-background-active);--ds-focus-ring-color:var(--color-interaction-on-medium-background-focus)}.ds-interaction-fill--on-bold.sc-ds-conversation-list-item-h,.ds-interaction-fill--on-bold.sc-ds-conversation-list-item{--ds-interaction-hover:var(--color-interaction-on-bold-background-hover);--ds-interaction-pressed:var(--color-interaction-on-bold-background-pressed);--ds-interaction-active:var(--color-interaction-on-bold-background-active);--ds-focus-ring-color:var(--color-interaction-on-bold-background-focus)}.ds-interaction-fill--on-strong.sc-ds-conversation-list-item-h,.ds-interaction-fill--on-strong.sc-ds-conversation-list-item{--ds-interaction-hover:var(--color-interaction-on-strong-background-hover);--ds-interaction-pressed:var(--color-interaction-on-strong-background-pressed);--ds-interaction-active:var(--color-interaction-on-strong-background-active);--ds-focus-ring-color:var(--color-interaction-on-strong-background-focus)}.ds-interaction-fill--on-translucent.sc-ds-conversation-list-item-h,.ds-interaction-fill--on-translucent.sc-ds-conversation-list-item{--ds-interaction-hover:var(--color-translucent-interaction-hover);--ds-interaction-pressed:var(--color-translucent-interaction-pressed);--ds-interaction-active:var(--color-translucent-interaction-active-brand);--ds-focus-ring-color:var(--color-translucent-interaction-focus)}.ds-interaction-fill--on-inverted.sc-ds-conversation-list-item-h,.ds-interaction-fill--on-inverted.sc-ds-conversation-list-item{--ds-interaction-hover:var(--color-inverted-interaction-hover);--ds-interaction-pressed:var(--color-inverted-interaction-pressed);--ds-interaction-active:var(--color-inverted-interaction-active-brand);--ds-focus-ring-color:var(--color-inverted-interaction-focus)}.ds-interaction-fill--on-media.sc-ds-conversation-list-item-h,.ds-interaction-fill--on-media.sc-ds-conversation-list-item{--ds-interaction-hover:var(--color-media-interaction-hover);--ds-interaction-pressed:var(--color-media-interaction-pressed);--ds-interaction-active:var(--color-media-interaction-active);--ds-focus-ring-color:var(--color-media-interaction-focus)}.ds-interaction-fill--on-always-dark.sc-ds-conversation-list-item-h,.ds-interaction-fill--on-always-dark.sc-ds-conversation-list-item{--ds-interaction-hover:var(--color-always-dark-interaction-hover);--ds-interaction-pressed:var(--color-always-dark-interaction-pressed);--ds-interaction-active:var(--color-always-dark-interaction-active-brand);--ds-focus-ring-color:var(--color-always-dark-interaction-focus)}.ds-interaction-fill--on-navigation.sc-ds-conversation-list-item-h,.ds-interaction-fill--on-navigation.sc-ds-conversation-list-item{--ds-interaction-hover:var(--color-navigation-interaction-hover);--ds-interaction-pressed:var(--color-navigation-interaction-pressed);--ds-interaction-active:var(--color-navigation-interaction-active);--ds-focus-ring-color:var(--color-navigation-interaction-focus)}@media (forced-colors: active){.ds-interaction-fill.sc-ds-conversation-list-item-h::after,.ds-interaction-fill.sc-ds-conversation-list-item::after{box-shadow:none;outline:var(--ds-interaction-border-width) solid       var(--ds-forced-color-control-boundary);outline-offset:calc(-1 * var(--ds-interaction-border-width))}.ds-interaction-fill--selected.sc-ds-conversation-list-item-h::before,.ds-interaction-fill--selected.sc-ds-conversation-list-item::before{background:transparent;outline:var(--dimension-stroke-width-025) solid var(--ds-forced-color-selected);outline-offset:calc(-1 * var(--dimension-stroke-width-025))}}@media (forced-colors: active) and (hover: hover) and (pointer: fine){.ds-interaction-fill.sc-ds-conversation-list-item-h:hover:not(:disabled):not(:focus-visible):not(:focus-within):not(.ds-focus-ring--visible)::after,.ds-interaction-fill.sc-ds-conversation-list-item:hover:not(:disabled):not(:focus-visible):not(:focus-within):not(.ds-focus-ring--visible)::after{outline-color:var(--ds-forced-color-selected);outline-width:var(--dimension-stroke-width-012)}}@media (forced-colors: active){.sc-ds-conversation-list-item:root,.sc-ds-conversation-list-item-h,.ds-forced-colors-scope.sc-ds-conversation-list-item{--ds-forced-color-surface:Canvas;--ds-forced-color-content:CanvasText;--ds-forced-color-control-boundary:ButtonText;--ds-forced-color-selected:Highlight;--ds-forced-color-on-selected:HighlightText;--ds-forced-color-disabled:GrayText}}.ds-control-inactive.sc-ds-conversation-list-item-h,.ds-control-inactive.sc-ds-conversation-list-item{opacity:var(--effect-opacity-medium);pointer-events:none;cursor:not-allowed}@media (forced-colors: active){.ds-control-inactive.sc-ds-conversation-list-item-h,.ds-control-inactive.sc-ds-conversation-list-item{color:var(--ds-forced-color-disabled);opacity:1}}.ds-control--lg.sc-ds-conversation-list-item,.ds-control--lg.sc-ds-conversation-list-item-h,.ds-control--md.sc-ds-conversation-list-item-h,.ds-control--md.sc-ds-conversation-list-item,.ds-control--sm.sc-ds-conversation-list-item-h,.ds-control--sm.sc-ds-conversation-list-item,.ds-control--xs.sc-ds-conversation-list-item-h,.ds-control--xs.sc-ds-conversation-list-item{--ds-control-radius:var(--dimension-radius-025)}.ds-control--lg.sc-ds-conversation-list-item-h,.ds-control--lg.sc-ds-conversation-list-item{--ds-control-height:var(--dimension-size-500);--ds-control-icon:var(--dimension-iconography-lg);--ds-control-padding-inline:var(--dimension-space-100);--ds-control-label-inset:var(--dimension-space-050);--ds-control-gap:var(--dimension-space-050)}.ds-control--md.sc-ds-conversation-list-item-h,.ds-control--md.sc-ds-conversation-list-item{--ds-control-height:var(--dimension-size-400);--ds-control-icon:var(--dimension-iconography-md);--ds-control-padding-inline:var(--dimension-space-075);--ds-control-label-inset:var(--dimension-space-025);--ds-control-gap:var(--dimension-space-050)}.ds-control--sm.sc-ds-conversation-list-item-h,.ds-control--sm.sc-ds-conversation-list-item{--ds-control-height:var(--dimension-size-300);--ds-control-icon:var(--dimension-iconography-sm);--ds-control-padding-inline:var(--dimension-space-050);--ds-control-label-inset:var(--dimension-space-025);--ds-control-gap:var(--dimension-space-025)}.ds-control--xs.sc-ds-conversation-list-item-h,.ds-control--xs.sc-ds-conversation-list-item{--ds-control-height:var(--dimension-size-200);--ds-control-icon:var(--dimension-iconography-xs);--ds-control-padding-inline:var(--dimension-space-025);--ds-control-label-inset:var(--dimension-space-025);--ds-control-gap:0}.ds-chrome-space--sm.sc-ds-conversation-list-item-h,.ds-chrome-space--sm.sc-ds-conversation-list-item{--ds-chrome-padding:var(--dimension-space-050);--ds-chrome-gap:var(--dimension-space-050)}.ds-chrome-space--md.sc-ds-conversation-list-item-h,.ds-chrome-space--md.sc-ds-conversation-list-item{--ds-chrome-padding:var(--dimension-space-100);--ds-chrome-gap:var(--dimension-space-100)}.ds-chrome-space--lg.sc-ds-conversation-list-item-h,.ds-chrome-space--lg.sc-ds-conversation-list-item{--ds-chrome-padding:var(--dimension-space-200);--ds-chrome-gap:var(--dimension-space-200)}.ds-chrome-row.sc-ds-conversation-list-item-h,.ds-chrome-row.sc-ds-conversation-list-item,.ds-chrome-column.sc-ds-conversation-list-item-h,.ds-chrome-column.sc-ds-conversation-list-item,.ds-chrome-grid.sc-ds-conversation-list-item-h,.ds-chrome-grid.sc-ds-conversation-list-item{display:flex;box-sizing:border-box;gap:var(--ds-chrome-gap, var(--dimension-space-100));padding:var(--ds-chrome-padding, var(--dimension-space-100))}.ds-chrome-row.sc-ds-conversation-list-item-h,.ds-chrome-row.sc-ds-conversation-list-item{flex-direction:row;align-items:center}.ds-chrome-column.sc-ds-conversation-list-item-h,.ds-chrome-column.sc-ds-conversation-list-item{flex-direction:column}.ds-chrome-grid.sc-ds-conversation-list-item-h,.ds-chrome-grid.sc-ds-conversation-list-item{display:grid;align-items:center}.ds-control-frame.sc-ds-conversation-list-item{display:inline-flex;align-items:center;box-sizing:border-box;height:var(--ds-control-height, var(--dimension-size-400));padding-inline:var(--ds-control-padding-inline, var(--dimension-space-075));gap:var(--ds-control-gap, var(--dimension-space-050));border-radius:var(--ds-control-radius, var(--dimension-radius-025))}.ds-control-section-heading.sc-ds-conversation-list-item{display:flex;align-items:center;box-sizing:border-box;height:var(--ds-control-height, var(--dimension-size-400));padding-inline:calc(     var(--ds-control-padding-inline, var(--dimension-space-075)) +       var(--ds-control-label-inset, var(--dimension-space-025))   )}.ds-control-icon-box.sc-ds-conversation-list-item{display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;width:var(--ds-control-icon, var(--dimension-iconography-md));height:var(--ds-control-icon, var(--dimension-iconography-md))}.ds-control-label-box.sc-ds-conversation-list-item{min-width:0;padding-inline:var(--ds-control-label-inset, var(--dimension-space-025))}.ds-control-label-dot.sc-ds-conversation-list-item{position:relative;padding-inline-end:calc(     var(--ds-control-label-inset, var(--dimension-space-025)) +       var(--ds-control-gap, var(--dimension-space-050))   )}.ds-control-label-dot__badge.sc-ds-conversation-list-item{position:absolute;inset-block-start:0;inset-inline-end:0;pointer-events:none}.ds-empty-region.sc-ds-conversation-list-item{display:flex;flex:1 1 auto;align-items:center;justify-content:center;box-sizing:border-box;min-width:0;min-height:0}.ds-empty-region--padded.sc-ds-conversation-list-item{padding:var(--dimension-space-200)}.sc-ds-conversation-list-item:where(.ds-text-decoration,.ds-text-action).sc-ds-conversation-list-item{text-decoration-color:var(--ds-text-decoration-color, var(--color-foreground-tertiary));text-decoration-thickness:var(--ds-text-decoration-thickness, var(--dimension-stroke-width-012));text-underline-offset:var(--ds-text-decoration-offset, var(--dimension-space-025))}.ds-text-action.sc-ds-conversation-list-item{--ds-text-action-foreground:var(--color-foreground-bold-brand);--ds-text-decoration-color:var(--ds-text-action-foreground);color:var(--ds-text-action-foreground);text-decoration-line:none}.ds-text-action--on-medium.sc-ds-conversation-list-item{--ds-text-action-foreground:var(--color-foreground-on-medium-background-primary);--ds-text-decoration-color:var(--color-foreground-on-medium-background-secondary);text-decoration-line:underline}.ds-text-action--on-strong.sc-ds-conversation-list-item{--ds-text-action-foreground:var(--color-foreground-on-strong-background-primary);--ds-text-decoration-color:var(--color-foreground-on-strong-background-secondary);text-decoration-line:underline}.ds-text-action--on-bold.sc-ds-conversation-list-item{--ds-text-action-foreground:var(--color-foreground-on-bold-background-primary);--ds-text-decoration-color:var(--color-foreground-on-bold-background-secondary);text-decoration-line:underline}@media (hover: hover) and (pointer: fine){.ds-text-action.sc-ds-conversation-list-item:hover{text-decoration-line:underline}}@media (forced-colors: active){.ds-text-action.sc-ds-conversation-list-item{text-decoration-line:underline;text-decoration-color:currentcolor}}.ds-choice-popup.sc-ds-conversation-list-item{box-sizing:border-box;display:flex;flex-direction:column;min-width:var(--dimension-menu-width-xs);max-width:min(     var(--dimension-panel-width-lg),     calc(100vw - var(--dimension-space-200))   );max-height:calc(100vh - var(--dimension-space-200));overflow:hidden;inset:auto;margin:0;padding:0;border:0;background-color:var(--color-background-primary);border-radius:var(--dimension-radius-075);box-shadow:var(--effect-shadow-elevated-floating);animation:dsChoiceFadeIn var(--effect-motion-short-2) forwards;backface-visibility:hidden;will-change:transform;text-align:start}.ds-choice-popup.sc-ds-conversation-list-item::after{content:'';position:absolute;inset:0;border-radius:inherit;pointer-events:none;box-shadow:var(--effect-highlight-elevated-floating)}.ds-choice-popup--closing.sc-ds-conversation-list-item{animation:dsChoiceFadeOut var(--effect-motion-short-2) forwards}@keyframes dsChoiceFadeIn{from{opacity:0;transform:inherit scale(0.97)}to{opacity:1}}@keyframes dsChoiceFadeOut{from{opacity:1}to{opacity:0}}@media (prefers-reduced-motion: reduce){.ds-choice-popup.sc-ds-conversation-list-item{animation:none;opacity:1}.ds-choice-popup--closing.sc-ds-conversation-list-item{opacity:0}}.ds-choice-list.sc-ds-conversation-list-item{display:flex;flex-direction:column;min-height:0;overflow-y:auto;overscroll-behavior:contain}.ds-choice-section--divided.sc-ds-conversation-list-item{border-bottom:var(--dimension-stroke-width-015) solid var(--color-border-tertiary)}ds-text.ds-choice-section__header.sc-ds-conversation-list-item{text-align:start;-webkit-user-select:none;user-select:none}.ds-choice-section--headed-after-first.sc-ds-conversation-list-item{margin-block-start:var(--dimension-space-050)}.ds-choice-item.sc-ds-conversation-list-item{width:100%;border:none;border-radius:var(--ds-control-radius, var(--dimension-radius-025));background:transparent;cursor:default;-webkit-user-select:none;user-select:none;text-align:left;color:inherit}.ds-choice-item.sc-ds-conversation-list-item:has(.ds-choice-item__subtext){height:auto;min-height:var(--ds-control-height, var(--dimension-size-400));padding-block:var(--ds-control-padding-inline, var(--dimension-space-075));align-items:flex-start}.ds-choice-item__content.sc-ds-conversation-list-item{display:flex;flex:1;flex-direction:column;gap:var(--dimension-space-025);min-width:0}ds-text.ds-choice-item__label.sc-ds-conversation-list-item{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}ds-text.ds-choice-item__subtext.sc-ds-conversation-list-item{display:-webkit-box;overflow:hidden;white-space:normal;-webkit-box-orient:vertical;-webkit-line-clamp:2}.ds-choice-item__icon.sc-ds-conversation-list-item,.ds-choice-item__suffix.sc-ds-conversation-list-item{display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;width:var(--ds-control-icon, var(--dimension-iconography-md));height:var(--ds-control-icon, var(--dimension-iconography-md));pointer-events:none}.ds-choice-item__tag.sc-ds-conversation-list-item{flex-shrink:0;pointer-events:none}.ds-choice-empty.sc-ds-conversation-list-item,.ds-choice-loading.sc-ds-conversation-list-item{min-height:var(--dimension-size-600);padding:var(--dimension-space-100)}.ds-choice-footer.sc-ds-conversation-list-item{position:relative;box-sizing:border-box;padding-block:var(--dimension-space-050)}.ds-choice-footer.sc-ds-conversation-list-item::before{content:'';position:absolute;inset:0 0 auto;height:var(--dimension-stroke-width-012);background-color:var(--color-border-tertiary);pointer-events:none}.ds-choice-footer__content.sc-ds-conversation-list-item{display:flex;align-items:center;justify-content:space-between;column-gap:var(--dimension-space-050);box-sizing:border-box;height:var(--ds-control-height, var(--dimension-size-400))}.ds-choice-footer__summary.sc-ds-conversation-list-item,.ds-choice-footer__summary-measure.sc-ds-conversation-list-item,.ds-choice-footer__clear.sc-ds-conversation-list-item ds-text.sc-ds-conversation-list-item,.ds-choice-footer__action.sc-ds-conversation-list-item ds-text.sc-ds-conversation-list-item{padding-inline:calc(     var(--dimension-space-050) +       var(--ds-control-padding-inline, var(--dimension-space-075)) +       var(--ds-control-label-inset, var(--dimension-space-025))   )}.ds-choice-footer__summary.sc-ds-conversation-list-item,.ds-choice-footer__summary-measure.sc-ds-conversation-list-item,.ds-choice-footer__clear.sc-ds-conversation-list-item,.ds-choice-footer__action.sc-ds-conversation-list-item{white-space:nowrap}.ds-choice-footer__summary-measure.sc-ds-conversation-list-item{position:absolute;visibility:hidden;pointer-events:none}.ds-choice-footer__clear.sc-ds-conversation-list-item,.ds-choice-footer__action.sc-ds-conversation-list-item{appearance:none;display:inline-flex;align-items:center;padding:0;border:0;border-radius:var(--dimension-radius-025);background:transparent;cursor:default}@media (forced-colors: active){.ds-choice-popup.sc-ds-conversation-list-item{outline:var(--dimension-stroke-width-012) solid var(--ds-forced-color-content);outline-offset:calc(-1 * var(--dimension-stroke-width-012))}.ds-choice-popup.sc-ds-conversation-list-item::after{box-shadow:none}.ds-choice-section--divided.sc-ds-conversation-list-item{border-bottom-color:var(--ds-forced-color-content)}.ds-choice-footer.sc-ds-conversation-list-item::before{background-color:var(--ds-forced-color-content)}}.ds-visually-hidden.sc-ds-conversation-list-item-h,.ds-visually-hidden.sc-ds-conversation-list-item{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0, 0, 0, 0);white-space:nowrap;border:0}.ds-control-elevation.sc-ds-conversation-list-item-h,.ds-control-elevation.sc-ds-conversation-list-item{position:relative;overflow:visible;box-shadow:var(--ds-control-elevation-shadow, none)}.ds-control-elevation.sc-ds-conversation-list-item-h::after,.ds-control-elevation.sc-ds-conversation-list-item::after{content:'';position:absolute;inset:0;z-index:4;border-radius:inherit;box-shadow:var(--ds-control-elevation-highlight, none);pointer-events:none}.ds-control-elevation--sm.sc-ds-conversation-list-item-h,.ds-control-elevation--sm.sc-ds-conversation-list-item{--ds-control-elevation-shadow:var(--effect-shadow-elevated-sm);--ds-control-elevation-highlight:var(--effect-highlight-elevated-sm)}.ds-control-elevation--md.sc-ds-conversation-list-item-h,.ds-control-elevation--md.sc-ds-conversation-list-item{--ds-control-elevation-shadow:var(--effect-shadow-elevated-md);--ds-control-elevation-highlight:var(--effect-highlight-elevated-md)}.ds-control-elevation--floating.sc-ds-conversation-list-item-h,.ds-control-elevation--floating.sc-ds-conversation-list-item{--ds-control-elevation-shadow:var(--effect-shadow-elevated-floating);--ds-control-elevation-highlight:var(--effect-highlight-elevated-floating)}.ds-control-elevation--press-scale.sc-ds-conversation-list-item{--ds-control-press-active-scale:var(--dimension-scale-default);transition:scale var(--effect-motion-short-2)}.ds-control-elevation--press-scale[data-ds-press-active].sc-ds-conversation-list-item{scale:var(--dimension-scale-subtle)}@media (prefers-reduced-motion: reduce){.ds-control-elevation--press-scale.sc-ds-conversation-list-item,.ds-control-elevation--press-scale[data-ds-press-active].sc-ds-conversation-list-item{scale:none;transition:none}}.sc-ds-conversation-list-item-h{display:block;box-sizing:border-box;-webkit-user-select:none;user-select:none}.sc-ds-conversation-list-item-h:focus-within,.conversation-list-item--actions-open.sc-ds-conversation-list-item-h{position:relative;z-index:var(--dimension-z-index-floating)}.conversation-list-item__row.sc-ds-conversation-list-item{position:relative;isolation:isolate}.conversation-list-item.sc-ds-conversation-list-item{color:var(--color-foreground-primary)}.conversation-list-item--error.sc-ds-conversation-list-item{--ds-interaction-border-width:var(--dimension-stroke-width-012);--ds-interaction-border-color:var(--color-border-bold-negative)}.conversation-list-item__leading.sc-ds-conversation-list-item:empty,.conversation-list-item__trailing.sc-ds-conversation-list-item:empty{display:none}.conversation-list-item__leading.sc-ds-conversation-list-item,.conversation-list-item__trailing.sc-ds-conversation-list-item,.conversation-list-item__preview-row.sc-ds-conversation-list-item{display:flex;align-items:center}.conversation-list-item__leading.sc-ds-conversation-list-item{align-self:center;width:auto;height:auto;margin-inline-start:var(--ds-control-label-inset, var(--dimension-space-025));margin-inline-end:var(--dimension-space-050)}.conversation-list-item__content.sc-ds-conversation-list-item{min-width:0}.conversation-list-item__title-row.sc-ds-conversation-list-item{display:flex;align-items:center;min-width:0}.conversation-list-item__preview-row.sc-ds-conversation-list-item{min-width:0;gap:var(--dimension-space-050)}ds-text.conversation-list-item__title.sc-ds-conversation-list-item,ds-text.conversation-list-item__preview.sc-ds-conversation-list-item{display:block;min-width:0}ds-text.conversation-list-item__title.sc-ds-conversation-list-item{flex:1}.conversation-list-item__unread.sc-ds-conversation-list-item{display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;width:var(--dimension-size-200);margin-inline-end:var(--dimension-space-025)}ds-text.conversation-list-item__preview.ds-choice-item__subtext.sc-ds-conversation-list-item{-webkit-line-clamp:1}.conversation-list-item__actions.sc-ds-conversation-list-item{position:absolute;top:50%;right:var(--dimension-space-100);z-index:var(--dimension-z-index-floating);display:flex;align-items:center;justify-content:center;border-radius:var(--dimension-radius-half);background:var(--color-background-transparent);-webkit-backdrop-filter:blur(var(--effect-blur-sm));backdrop-filter:blur(var(--effect-blur-sm));opacity:0;pointer-events:none;transform:translateY(-50%)}.conversation-list-item__row.sc-ds-conversation-list-item:has(:focus-visible) .conversation-list-item__actions.sc-ds-conversation-list-item,.conversation-list-item--actions-open.sc-ds-conversation-list-item-h .conversation-list-item__actions.sc-ds-conversation-list-item{opacity:1;pointer-events:auto}.conversation-list-item--actions-open.sc-ds-conversation-list-item-h .conversation-list-item.sc-ds-conversation-list-item::after{background:var(--ds-interaction-hover)}.conversation-list-item__row.sc-ds-conversation-list-item:active .conversation-list-item.sc-ds-conversation-list-item::after{background:var(--ds-interaction-pressed)}@media (hover: hover) and (pointer: fine){.sc-ds-conversation-list-item-h:hover{position:relative;z-index:var(--dimension-z-index-floating)}.conversation-list-item__row.sc-ds-conversation-list-item:hover .conversation-list-item__actions.sc-ds-conversation-list-item{opacity:1;pointer-events:auto}.conversation-list-item__row.sc-ds-conversation-list-item:hover .conversation-list-item.sc-ds-conversation-list-item::after{background:var(--ds-interaction-hover)}}@media (hover: none){.conversation-list-item__actions.sc-ds-conversation-list-item{opacity:1;pointer-events:auto}.conversation-list-item--has-actions.sc-ds-conversation-list-item-h .conversation-list-item__title-row.sc-ds-conversation-list-item{padding-inline-end:var(--dimension-size-400)}}`;const l=i(class i extends e{constructor(i){super();if(i!==false){this.__registerHost()}this.dsSelect=o(this,"dsSelect");this.conversationId="";this.conversationTitle="";this.preview="";this.updatedAt="";this.selected=false;this.state="default";this.statusLabel="";this.unreadCount=0;this.actionsOpen=false;this.handleClick=()=>this.dsSelect.emit({id:this.conversationId});this.handleActionsSlotChange=i=>{const e=i.target;this.el.classList.toggle("conversation-list-item--has-actions",e.assignedElements().length>0)}}render(){const i=this.state==="busy";const e=i&&this.statusLabel?this.statusLabel:this.preview;const o=[this.conversationTitle,e,this.unreadCount>0?`${this.unreadCount} unread`:""].filter(Boolean).join(". ");return t(s,{key:"0b9b88880134edd989f52c7607404dbba2caac91",role:"listitem",class:{"conversation-list-item--actions-open":this.actionsOpen}},t("div",{key:"e055d1d3626db7dd15834bd3417634755b9a071c",class:"conversation-list-item__row"},t("button",{key:"723bfe9cf7de4737f044f3946facec3c4144cb68",type:"button",class:{"conversation-list-item":true,"ds-choice-item":true,"ds-control-frame":true,"ds-control--md":true,"ds-focus-ring-inset":true,"ds-interaction-fill":true,"ds-interaction-fill--selected":this.selected,"conversation-list-item--error":this.state==="error"},"aria-label":o,"aria-current":this.selected?"true":undefined,"aria-busy":i?"true":undefined,onClick:this.handleClick},t("span",{key:"26ed82ab0e1225e825d032bbb8b0dac90e610b3d",class:"conversation-list-item__leading ds-choice-item__icon ds-control-icon-box ds-interaction-fill__content"},t("slot",{key:"ee79dee1948d02f02095cef4e2e32db8f4e979ae",name:"leading"})),t("span",{key:"8c4cd43c88e2f862666fafdffc8ca710fdc1e9dc",class:"conversation-list-item__content ds-choice-item__content ds-interaction-fill__content"},t("span",{key:"b6859eb2d0ca542b50e0a7b6551527c03e427904",class:"conversation-list-item__title-row"},t("ds-text",{key:"137f4420cefd644904cb7874598b728d8c2b847a",class:"conversation-list-item__title ds-choice-item__label ds-control-label-box",as:"span",variant:"text-body-medium",emphasis:this.unreadCount>0,color:this.unreadCount>0?"primary":"secondary",lineTruncation:1},this.conversationTitle),this.unreadCount>0?t("span",{class:"conversation-list-item__unread"},t("ds-badge",{variant:"dot",surface:"secondary",hasRing:false})):null),t("span",{key:"8bb7a02da2643c1fc42ec3cd90813250fa68960e",class:"conversation-list-item__preview-row"},i?t("ds-loader",{size:"sm",color:"secondary"}):null,t("ds-text",{key:"120fb8e12ee3cfbff3afd08b6f102ff474eaf666",class:"conversation-list-item__preview ds-choice-item__subtext ds-control-label-box",as:"span",variant:"text-body-small",color:this.state==="error"?"negative":"secondary",lineTruncation:1},e)),this.updatedAt?t("time",{class:"conversation-list-item__time ds-visually-hidden",dateTime:this.updatedAt},this.updatedAt):null),t("span",{key:"ad5a195de56ef1037ea982332f7dd2e7a2100b36",class:"conversation-list-item__trailing ds-interaction-fill__content"},t("slot",{key:"8d1ee445dec02a40d880d213422bd542cc5335a0",name:"trailing"}))),t("div",{key:"5fd007848fc4be58e3adfe4bf171ce58f7fa56da",class:"conversation-list-item__actions ds-control-elevation ds-control-elevation--md ds-control-elevation--press-scale"},t("slot",{key:"27e306a5f223eb133cceae4ba2d9791801c9b14d",name:"actions",onSlotchange:this.handleActionsSlotChange}))))}get el(){return this}static get style(){return d()}},[262,"ds-conversation-list-item",{conversationId:[1,"conversation-id"],conversationTitle:[1,"conversation-title"],preview:[1],updatedAt:[1,"updated-at"],selected:[4],state:[1],statusLabel:[1,"status-label"],unreadCount:[2,"unread-count"],actionsOpen:[516,"actions-open"]}]);function v(){if(typeof customElements==="undefined"){return}const i=["ds-conversation-list-item","ds-badge","ds-loader","ds-text"];i.forEach((i=>{switch(i){case"ds-conversation-list-item":if(!customElements.get(n(i))){customElements.define(n(i),l)}break;case"ds-badge":if(!customElements.get(n(i))){r()}break;case"ds-loader":if(!customElements.get(n(i))){c()}break;case"ds-text":if(!customElements.get(n(i))){a()}break}}))}v();const m=l;const f=v;export{m as DsConversationListItem,f as defineCustomElement};
 //# sourceMappingURL=ds-conversation-list-item.js.map

package/dist/components/ds-conversation-list-item.js.map

@@ -1 +1 @@
-{"version":3,"names":["conversationListItemCss","ConversationListItem","__stencil_proxyCustomElement","HTMLElement","constructor","registerHost","this","conversationId","conversationTitle","preview","updatedAt","selected","state","statusLabel","unreadCount","actionsOpen","handleClick","dsSelect","emit","id","handleActionsSlotChange","event","slot","target","el","classList","toggle","assignedElements","length","render","busy","subtext","accessibleName","filter","Boolean","join","h","Host","key","role","class","type","undefined","onClick","name","as","variant","emphasis","color","lineTruncation","surface","hasRing","size","dateTime","onSlotchange"],"sources":["src/wc/components/ConversationListItem/ConversationListItem.css?tag=ds-conversation-list-item&encapsulation=scoped","src/wc/components/ConversationListItem/ConversationListItem.tsx"],"sourcesContent":["@import '../../utils/choice-list.css';\n@import '../../utils/visually-hidden.css';\n@import '../../styles/control-elevation.css';\n\n:host {\n  display: block;\n  box-sizing: border-box;\n  -webkit-user-select: none;\n  user-select: none;\n}\n\n:host(:focus-within),\n:host(.conversation-list-item--actions-open) {\n  position: relative;\n  z-index: var(--dimension-z-index-floating);\n}\n\n.conversation-list-item__row {\n  position: relative;\n  isolation: isolate;\n}\n\n.conversation-list-item {\n  color: var(--color-foreground-primary);\n}\n\n.conversation-list-item--error {\n  --ds-interaction-border-width: var(--dimension-stroke-width-012);\n  --ds-interaction-border-color: var(--color-border-bold-negative);\n}\n\n.conversation-list-item__leading:empty,\n.conversation-list-item__trailing:empty {\n  display: none;\n}\n\n.conversation-list-item__leading,\n.conversation-list-item__trailing,\n.conversation-list-item__preview-row {\n  display: flex;\n  align-items: center;\n}\n\n.conversation-list-item__leading {\n  align-self: center;\n  width: auto;\n  height: auto;\n  margin-inline-start: var(--ds-control-label-inset, var(--dimension-space-025));\n  margin-inline-end: var(--dimension-space-050);\n}\n\n.conversation-list-item__content {\n  min-width: 0;\n}\n\n.conversation-list-item__title-row {\n  display: flex;\n  align-items: center;\n  min-width: 0;\n}\n\n.conversation-list-item__preview-row {\n  min-width: 0;\n  gap: var(--dimension-space-050);\n}\n\nds-text.conversation-list-item__title,\nds-text.conversation-list-item__preview {\n  display: block;\n  min-width: 0;\n}\n\nds-text.conversation-list-item__title {\n  flex: 1;\n}\n\n.conversation-list-item__unread {\n  display: inline-flex;\n  align-items: center;\n  justify-content: center;\n  flex-shrink: 0;\n  width: var(--dimension-size-200);\n  margin-inline-end: var(--dimension-space-025);\n}\n\nds-text.conversation-list-item__preview.ds-choice-item__subtext {\n  -webkit-line-clamp: 1;\n}\n\n.conversation-list-item__actions {\n  position: absolute;\n  top: 50%;\n  right: var(--dimension-space-100);\n  z-index: var(--dimension-z-index-floating);\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  border-radius: var(--dimension-radius-half);\n  background: var(--color-background-transparent);\n  -webkit-backdrop-filter: blur(var(--effect-blur-sm));\n  backdrop-filter: blur(var(--effect-blur-sm));\n  opacity: 0;\n  pointer-events: none;\n  transform: translateY(-50%);\n}\n\n.conversation-list-item__row:has(:focus-visible) .conversation-list-item__actions,\n:host(.conversation-list-item--actions-open) .conversation-list-item__actions {\n  opacity: 1;\n  pointer-events: auto;\n}\n\n:host(.conversation-list-item--actions-open) .conversation-list-item::after {\n  background: var(--ds-interaction-hover);\n}\n\n.conversation-list-item__row:active .conversation-list-item::after {\n  background: var(--ds-interaction-pressed);\n}\n\n@media (hover: hover) and (pointer: fine) {\n  :host(:hover) {\n    position: relative;\n    z-index: var(--dimension-z-index-floating);\n  }\n\n  .conversation-list-item__row:hover .conversation-list-item__actions {\n    opacity: 1;\n    pointer-events: auto;\n  }\n\n  /* Keep the row wash continuous while the pointer moves onto its sibling action. */\n  .conversation-list-item__row:hover .conversation-list-item::after {\n    background: var(--ds-interaction-hover);\n  }\n}\n\n@media (hover: none) {\n  .conversation-list-item__actions {\n    opacity: 1;\n    pointer-events: auto;\n  }\n\n  :host(.conversation-list-item--has-actions) .conversation-list-item__title-row {\n    padding-inline-end: var(--dimension-size-400);\n  }\n}\n","/* eslint-disable local/no-selected-fill-emphasis-change -- Unread emphasis is message state, independent of the selected-row fill state. */\nimport { Component, Element, Event, EventEmitter, h, Host, Prop } from '@stencil/core';\nimport type { ConversationItemState } from '../conversation-types';\n\n@Component({\n  tag: 'ds-conversation-list-item',\n  styleUrl: 'ConversationListItem.css',\n  scoped: true,\n})\nexport class ConversationListItem {\n  @Element() el!: HTMLElement;\n\n  @Prop() conversationId: string = '';\n  /** Visible conversation title. Named to avoid the native HTMLElement.title contract. */\n  @Prop() conversationTitle: string = '';\n  @Prop() preview: string = '';\n  /** ISO timestamp for semantic activity metadata. */\n  @Prop() updatedAt: string = '';\n  @Prop() selected: boolean = false;\n  @Prop() state: ConversationItemState = 'default';\n  @Prop() statusLabel: string = '';\n  @Prop() unreadCount: number = 0;\n  /** Keep the contextual-actions surface visible while its popup is open or closing. */\n  @Prop({ reflect: true }) actionsOpen: boolean = false;\n\n  @Event() dsSelect!: EventEmitter<{ id: string }>;\n\n  private handleClick = () => this.dsSelect.emit({ id: this.conversationId });\n\n  private handleActionsSlotChange = (event: Event) => {\n    const slot = event.target as HTMLSlotElement;\n    this.el.classList.toggle(\n      'conversation-list-item--has-actions',\n      slot.assignedElements().length > 0\n    );\n  };\n\n  render() {\n    const busy = this.state === 'busy';\n    const subtext = busy && this.statusLabel ? this.statusLabel : this.preview;\n    const accessibleName = [\n      this.conversationTitle,\n      subtext,\n      this.unreadCount > 0 ? `${this.unreadCount} unread` : '',\n    ]\n      .filter(Boolean)\n      .join('. ');\n\n    return (\n      <Host\n        role=\"listitem\"\n        class={{ 'conversation-list-item--actions-open': this.actionsOpen }}\n      >\n        <div class=\"conversation-list-item__row\">\n          <button\n            type=\"button\"\n            class={{\n              'conversation-list-item': true,\n              'ds-choice-item': true,\n              'ds-control-frame': true,\n              'ds-control--md': true,\n              'ds-focus-ring-inset': true,\n              'ds-interaction-fill': true,\n              'ds-interaction-fill--selected': this.selected,\n              'conversation-list-item--error': this.state === 'error',\n            }}\n            aria-label={accessibleName}\n            aria-current={this.selected ? 'true' : undefined}\n            aria-busy={busy ? 'true' : undefined}\n            onClick={this.handleClick}\n          >\n            <span class=\"conversation-list-item__leading ds-choice-item__icon ds-control-icon-box ds-interaction-fill__content\">\n              <slot name=\"leading\" />\n            </span>\n            <span class=\"conversation-list-item__content ds-choice-item__content ds-interaction-fill__content\">\n              <span class=\"conversation-list-item__title-row\">\n                <ds-text\n                  class=\"conversation-list-item__title ds-choice-item__label ds-control-label-box\"\n                  as=\"span\"\n                  variant=\"text-body-medium\"\n                  emphasis={this.unreadCount > 0}\n                  color={this.unreadCount > 0 ? 'primary' : 'secondary'}\n                  lineTruncation={1}\n                >\n                  {this.conversationTitle}\n                </ds-text>\n                {this.unreadCount > 0 ? (\n                  <span class=\"conversation-list-item__unread\">\n                    <ds-badge variant=\"dot\" surface=\"secondary\" hasRing={false} />\n                  </span>\n                ) : null}\n              </span>\n              <span class=\"conversation-list-item__preview-row\">\n                {busy ? <ds-loader size=\"sm\" color=\"secondary\" /> : null}\n                <ds-text\n                  class=\"conversation-list-item__preview ds-choice-item__subtext ds-control-label-box\"\n                  as=\"span\"\n                  variant=\"text-body-small\"\n                  color={this.state === 'error' ? 'negative' : 'secondary'}\n                  lineTruncation={1}\n                >\n                  {subtext}\n                </ds-text>\n              </span>\n              {this.updatedAt ? (\n                <time class=\"conversation-list-item__time ds-visually-hidden\" dateTime={this.updatedAt}>\n                  {this.updatedAt}\n                </time>\n              ) : null}\n            </span>\n            <span class=\"conversation-list-item__trailing ds-interaction-fill__content\">\n              <slot name=\"trailing\" />\n            </span>\n          </button>\n          <div class=\"conversation-list-item__actions ds-control-elevation ds-control-elevation--md ds-control-elevation--press-scale\">\n            <slot name=\"actions\" onSlotchange={this.handleActionsSlotChange} />\n          </div>\n        </div>\n      </Host>\n    );\n  }\n}\n"],"mappings":"8KAAA,MAAMA,EAA0B,IAAM,267B,MCSzBC,EAAoBC,EAAA,MAAAD,UAAAE,EALjC,WAAAC,CAAAC,G,6EAQUC,KAAAC,eAAyB,GAEzBD,KAAAE,kBAA4B,GAC5BF,KAAAG,QAAkB,GAElBH,KAAAI,UAAoB,GACpBJ,KAAAK,SAAoB,MACpBL,KAAAM,MAA+B,UAC/BN,KAAAO,YAAsB,GACtBP,KAAAQ,YAAsB,EAELR,KAAAS,YAAuB,MAIxCT,KAAAU,YAAc,IAAMV,KAAKW,SAASC,KAAK,CAAEC,GAAIb,KAAKC,iBAElDD,KAAAc,wBAA2BC,IACjC,MAAMC,EAAOD,EAAME,OACnBjB,KAAKkB,GAAGC,UAAUC,OAChB,sCACAJ,EAAKK,mBAAmBC,OAAS,EAClC,CAuFJ,CApFC,MAAAC,GACE,MAAMC,EAAOxB,KAAKM,QAAU,OAC5B,MAAMmB,EAAUD,GAAQxB,KAAKO,YAAcP,KAAKO,YAAcP,KAAKG,QACnE,MAAMuB,EAAiB,CACrB1B,KAAKE,kBACLuB,EACAzB,KAAKQ,YAAc,EAAI,GAAGR,KAAKQ,qBAAuB,IAErDmB,OAAOC,SACPC,KAAK,MAER,OACEC,EAACC,EAAI,CAAAC,IAAA,2CACHC,KAAK,WACLC,MAAO,CAAE,uCAAwClC,KAAKS,cAEtDqB,EAAA,OAAAE,IAAA,2CAAKE,MAAM,+BACTJ,EAAA,UAAAE,IAAA,2CACEG,KAAK,SACLD,MAAO,CACL,yBAA0B,KAC1B,iBAAkB,KAClB,mBAAoB,KACpB,iBAAkB,KAClB,sBAAuB,KACvB,sBAAuB,KACvB,gCAAiClC,KAAKK,SACtC,gCAAiCL,KAAKM,QAAU,SACjD,aACWoB,EAAc,eACZ1B,KAAKK,SAAW,OAAS+B,UAAS,YACrCZ,EAAO,OAASY,UAC3BC,QAASrC,KAAKU,aAEdoB,EAAA,QAAAE,IAAA,2CAAME,MAAM,yGACVJ,EAAA,QAAAE,IAAA,2CAAMM,KAAK,aAEbR,EAAA,QAAAE,IAAA,2CAAME,MAAM,wFACVJ,EAAA,QAAAE,IAAA,2CAAME,MAAM,qCACVJ,EAAA,WAAAE,IAAA,2CACEE,MAAM,2EACNK,GAAG,OACHC,QAAQ,mBACRC,SAAUzC,KAAKQ,YAAc,EAC7BkC,MAAO1C,KAAKQ,YAAc,EAAI,UAAY,YAC1CmC,eAAgB,GAEf3C,KAAKE,mBAEPF,KAAKQ,YAAc,EAClBsB,EAAA,QAAMI,MAAM,kCACVJ,EAAA,YAAUU,QAAQ,MAAMI,QAAQ,YAAYC,QAAS,SAErD,MAENf,EAAA,QAAAE,IAAA,2CAAME,MAAM,uCACTV,EAAOM,EAAA,aAAWgB,KAAK,KAAKJ,MAAM,cAAiB,KACpDZ,EAAA,WAAAE,IAAA,2CACEE,MAAM,+EACNK,GAAG,OACHC,QAAQ,kBACRE,MAAO1C,KAAKM,QAAU,QAAU,WAAa,YAC7CqC,eAAgB,GAEflB,IAGJzB,KAAKI,UACJ0B,EAAA,QAAMI,MAAM,kDAAkDa,SAAU/C,KAAKI,WAC1EJ,KAAKI,WAEN,MAEN0B,EAAA,QAAAE,IAAA,2CAAME,MAAM,iEACVJ,EAAA,QAAAE,IAAA,2CAAMM,KAAK,eAGfR,EAAA,OAAAE,IAAA,2CAAKE,MAAM,mHACTJ,EAAA,QAAAE,IAAA,2CAAMM,KAAK,UAAUU,aAAchD,KAAKc,4B","ignoreList":[]}
+{"version":3,"names":["conversationListItemCss","ConversationListItem","__stencil_proxyCustomElement","HTMLElement","constructor","registerHost","this","conversationId","conversationTitle","preview","updatedAt","selected","state","statusLabel","unreadCount","actionsOpen","handleClick","dsSelect","emit","id","handleActionsSlotChange","event","slot","target","el","classList","toggle","assignedElements","length","render","busy","subtext","accessibleName","filter","Boolean","join","h","Host","key","role","class","type","undefined","onClick","name","as","variant","emphasis","color","lineTruncation","surface","hasRing","size","dateTime","onSlotchange"],"sources":["src/wc/components/ConversationListItem/ConversationListItem.css?tag=ds-conversation-list-item&encapsulation=scoped","src/wc/components/ConversationListItem/ConversationListItem.tsx"],"sourcesContent":["@import '../../utils/choice-list.css';\n@import '../../utils/visually-hidden.css';\n@import '../../styles/control-elevation.css';\n\n:host {\n  display: block;\n  box-sizing: border-box;\n  -webkit-user-select: none;\n  user-select: none;\n}\n\n:host(:focus-within),\n:host(.conversation-list-item--actions-open) {\n  position: relative;\n  z-index: var(--dimension-z-index-floating);\n}\n\n.conversation-list-item__row {\n  position: relative;\n  isolation: isolate;\n}\n\n.conversation-list-item {\n  color: var(--color-foreground-primary);\n}\n\n.conversation-list-item--error {\n  --ds-interaction-border-width: var(--dimension-stroke-width-012);\n  --ds-interaction-border-color: var(--color-border-bold-negative);\n}\n\n.conversation-list-item__leading:empty,\n.conversation-list-item__trailing:empty {\n  display: none;\n}\n\n.conversation-list-item__leading,\n.conversation-list-item__trailing,\n.conversation-list-item__preview-row {\n  display: flex;\n  align-items: center;\n}\n\n.conversation-list-item__leading {\n  align-self: center;\n  width: auto;\n  height: auto;\n  margin-inline-start: var(--ds-control-label-inset, var(--dimension-space-025));\n  margin-inline-end: var(--dimension-space-050);\n}\n\n.conversation-list-item__content {\n  min-width: 0;\n}\n\n.conversation-list-item__title-row {\n  display: flex;\n  align-items: center;\n  min-width: 0;\n}\n\n.conversation-list-item__preview-row {\n  min-width: 0;\n  gap: var(--dimension-space-050);\n}\n\nds-text.conversation-list-item__title,\nds-text.conversation-list-item__preview {\n  display: block;\n  min-width: 0;\n}\n\nds-text.conversation-list-item__title {\n  flex: 1;\n}\n\n.conversation-list-item__unread {\n  display: inline-flex;\n  align-items: center;\n  justify-content: center;\n  flex-shrink: 0;\n  width: var(--dimension-size-200);\n  margin-inline-end: var(--dimension-space-025);\n}\n\nds-text.conversation-list-item__preview.ds-choice-item__subtext {\n  -webkit-line-clamp: 1;\n}\n\n.conversation-list-item__actions {\n  position: absolute;\n  top: 50%;\n  right: var(--dimension-space-100);\n  z-index: var(--dimension-z-index-floating);\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  border-radius: var(--dimension-radius-half);\n  background: var(--color-background-transparent);\n  -webkit-backdrop-filter: blur(var(--effect-blur-sm));\n  backdrop-filter: blur(var(--effect-blur-sm));\n  opacity: 0;\n  pointer-events: none;\n  transform: translateY(-50%);\n}\n\n.conversation-list-item__row:has(:focus-visible) .conversation-list-item__actions,\n:host(.conversation-list-item--actions-open) .conversation-list-item__actions {\n  opacity: 1;\n  pointer-events: auto;\n}\n\n:host(.conversation-list-item--actions-open) .conversation-list-item::after {\n  background: var(--ds-interaction-hover);\n}\n\n.conversation-list-item__row:active .conversation-list-item::after {\n  background: var(--ds-interaction-pressed);\n}\n\n@media (hover: hover) and (pointer: fine) {\n  :host(:hover) {\n    position: relative;\n    z-index: var(--dimension-z-index-floating);\n  }\n\n  .conversation-list-item__row:hover .conversation-list-item__actions {\n    opacity: 1;\n    pointer-events: auto;\n  }\n\n  /* Keep the row wash continuous while the pointer moves onto its sibling action. */\n  .conversation-list-item__row:hover .conversation-list-item::after {\n    background: var(--ds-interaction-hover);\n  }\n}\n\n@media (hover: none) {\n  .conversation-list-item__actions {\n    opacity: 1;\n    pointer-events: auto;\n  }\n\n  :host(.conversation-list-item--has-actions) .conversation-list-item__title-row {\n    padding-inline-end: var(--dimension-size-400);\n  }\n}\n","/* eslint-disable local/no-selected-fill-emphasis-change -- Unread emphasis is message state, independent of the selected-row fill state. */\nimport { Component, Element, Event, EventEmitter, h, Host, Prop } from '@stencil/core';\nimport type { ConversationItemState } from '../conversation-types';\n\n@Component({\n  tag: 'ds-conversation-list-item',\n  styleUrl: 'ConversationListItem.css',\n  scoped: true,\n})\nexport class ConversationListItem {\n  @Element() el!: HTMLElement;\n\n  @Prop() conversationId: string = '';\n  /** Visible conversation title. Named to avoid the native HTMLElement.title contract. */\n  @Prop() conversationTitle: string = '';\n  @Prop() preview: string = '';\n  /** ISO timestamp for semantic activity metadata. */\n  @Prop() updatedAt: string = '';\n  @Prop() selected: boolean = false;\n  @Prop() state: ConversationItemState = 'default';\n  @Prop() statusLabel: string = '';\n  @Prop() unreadCount: number = 0;\n  /** Keep the contextual-actions surface visible while its popup is open or closing. */\n  @Prop({ reflect: true }) actionsOpen: boolean = false;\n\n  @Event() dsSelect!: EventEmitter<{ id: string }>;\n\n  private handleClick = () => this.dsSelect.emit({ id: this.conversationId });\n\n  private handleActionsSlotChange = (event: Event) => {\n    const slot = event.target as HTMLSlotElement;\n    this.el.classList.toggle(\n      'conversation-list-item--has-actions',\n      slot.assignedElements().length > 0\n    );\n  };\n\n  render() {\n    const busy = this.state === 'busy';\n    const subtext = busy && this.statusLabel ? this.statusLabel : this.preview;\n    const accessibleName = [\n      this.conversationTitle,\n      subtext,\n      this.unreadCount > 0 ? `${this.unreadCount} unread` : '',\n    ]\n      .filter(Boolean)\n      .join('. ');\n\n    return (\n      <Host\n        role=\"listitem\"\n        class={{ 'conversation-list-item--actions-open': this.actionsOpen }}\n      >\n        <div class=\"conversation-list-item__row\">\n          <button\n            type=\"button\"\n            class={{\n              'conversation-list-item': true,\n              'ds-choice-item': true,\n              'ds-control-frame': true,\n              'ds-control--md': true,\n              'ds-focus-ring-inset': true,\n              'ds-interaction-fill': true,\n              'ds-interaction-fill--selected': this.selected,\n              'conversation-list-item--error': this.state === 'error',\n            }}\n            aria-label={accessibleName}\n            aria-current={this.selected ? 'true' : undefined}\n            aria-busy={busy ? 'true' : undefined}\n            onClick={this.handleClick}\n          >\n            <span class=\"conversation-list-item__leading ds-choice-item__icon ds-control-icon-box ds-interaction-fill__content\">\n              <slot name=\"leading\" />\n            </span>\n            <span class=\"conversation-list-item__content ds-choice-item__content ds-interaction-fill__content\">\n              <span class=\"conversation-list-item__title-row\">\n                <ds-text\n                  class=\"conversation-list-item__title ds-choice-item__label ds-control-label-box\"\n                  as=\"span\"\n                  variant=\"text-body-medium\"\n                  emphasis={this.unreadCount > 0}\n                  color={this.unreadCount > 0 ? 'primary' : 'secondary'}\n                  lineTruncation={1}\n                >\n                  {this.conversationTitle}\n                </ds-text>\n                {this.unreadCount > 0 ? (\n                  <span class=\"conversation-list-item__unread\">\n                    <ds-badge variant=\"dot\" surface=\"secondary\" hasRing={false} />\n                  </span>\n                ) : null}\n              </span>\n              <span class=\"conversation-list-item__preview-row\">\n                {busy ? <ds-loader size=\"sm\" color=\"secondary\" /> : null}\n                <ds-text\n                  class=\"conversation-list-item__preview ds-choice-item__subtext ds-control-label-box\"\n                  as=\"span\"\n                  variant=\"text-body-small\"\n                  color={this.state === 'error' ? 'negative' : 'secondary'}\n                  lineTruncation={1}\n                >\n                  {subtext}\n                </ds-text>\n              </span>\n              {this.updatedAt ? (\n                <time class=\"conversation-list-item__time ds-visually-hidden\" dateTime={this.updatedAt}>\n                  {this.updatedAt}\n                </time>\n              ) : null}\n            </span>\n            <span class=\"conversation-list-item__trailing ds-interaction-fill__content\">\n              <slot name=\"trailing\" />\n            </span>\n          </button>\n          <div class=\"conversation-list-item__actions ds-control-elevation ds-control-elevation--md ds-control-elevation--press-scale\">\n            <slot name=\"actions\" onSlotchange={this.handleActionsSlotChange} />\n          </div>\n        </div>\n      </Host>\n    );\n  }\n}\n"],"mappings":"8KAAA,MAAMA,EAA0B,IAAM,677B,MCSzBC,EAAoBC,EAAA,MAAAD,UAAAE,EALjC,WAAAC,CAAAC,G,6EAQUC,KAAAC,eAAyB,GAEzBD,KAAAE,kBAA4B,GAC5BF,KAAAG,QAAkB,GAElBH,KAAAI,UAAoB,GACpBJ,KAAAK,SAAoB,MACpBL,KAAAM,MAA+B,UAC/BN,KAAAO,YAAsB,GACtBP,KAAAQ,YAAsB,EAELR,KAAAS,YAAuB,MAIxCT,KAAAU,YAAc,IAAMV,KAAKW,SAASC,KAAK,CAAEC,GAAIb,KAAKC,iBAElDD,KAAAc,wBAA2BC,IACjC,MAAMC,EAAOD,EAAME,OACnBjB,KAAKkB,GAAGC,UAAUC,OAChB,sCACAJ,EAAKK,mBAAmBC,OAAS,EAClC,CAuFJ,CApFC,MAAAC,GACE,MAAMC,EAAOxB,KAAKM,QAAU,OAC5B,MAAMmB,EAAUD,GAAQxB,KAAKO,YAAcP,KAAKO,YAAcP,KAAKG,QACnE,MAAMuB,EAAiB,CACrB1B,KAAKE,kBACLuB,EACAzB,KAAKQ,YAAc,EAAI,GAAGR,KAAKQ,qBAAuB,IAErDmB,OAAOC,SACPC,KAAK,MAER,OACEC,EAACC,EAAI,CAAAC,IAAA,2CACHC,KAAK,WACLC,MAAO,CAAE,uCAAwClC,KAAKS,cAEtDqB,EAAA,OAAAE,IAAA,2CAAKE,MAAM,+BACTJ,EAAA,UAAAE,IAAA,2CACEG,KAAK,SACLD,MAAO,CACL,yBAA0B,KAC1B,iBAAkB,KAClB,mBAAoB,KACpB,iBAAkB,KAClB,sBAAuB,KACvB,sBAAuB,KACvB,gCAAiClC,KAAKK,SACtC,gCAAiCL,KAAKM,QAAU,SACjD,aACWoB,EAAc,eACZ1B,KAAKK,SAAW,OAAS+B,UAAS,YACrCZ,EAAO,OAASY,UAC3BC,QAASrC,KAAKU,aAEdoB,EAAA,QAAAE,IAAA,2CAAME,MAAM,yGACVJ,EAAA,QAAAE,IAAA,2CAAMM,KAAK,aAEbR,EAAA,QAAAE,IAAA,2CAAME,MAAM,wFACVJ,EAAA,QAAAE,IAAA,2CAAME,MAAM,qCACVJ,EAAA,WAAAE,IAAA,2CACEE,MAAM,2EACNK,GAAG,OACHC,QAAQ,mBACRC,SAAUzC,KAAKQ,YAAc,EAC7BkC,MAAO1C,KAAKQ,YAAc,EAAI,UAAY,YAC1CmC,eAAgB,GAEf3C,KAAKE,mBAEPF,KAAKQ,YAAc,EAClBsB,EAAA,QAAMI,MAAM,kCACVJ,EAAA,YAAUU,QAAQ,MAAMI,QAAQ,YAAYC,QAAS,SAErD,MAENf,EAAA,QAAAE,IAAA,2CAAME,MAAM,uCACTV,EAAOM,EAAA,aAAWgB,KAAK,KAAKJ,MAAM,cAAiB,KACpDZ,EAAA,WAAAE,IAAA,2CACEE,MAAM,+EACNK,GAAG,OACHC,QAAQ,kBACRE,MAAO1C,KAAKM,QAAU,QAAU,WAAa,YAC7CqC,eAAgB,GAEflB,IAGJzB,KAAKI,UACJ0B,EAAA,QAAMI,MAAM,kDAAkDa,SAAU/C,KAAKI,WAC1EJ,KAAKI,WAEN,MAEN0B,EAAA,QAAAE,IAAA,2CAAME,MAAM,iEACVJ,EAAA,QAAAE,IAAA,2CAAMM,KAAK,eAGfR,EAAA,OAAAE,IAAA,2CAAKE,MAAM,mHACTJ,EAAA,QAAAE,IAAA,2CAAMM,KAAK,UAAUU,aAAchD,KAAKc,4B","ignoreList":[]}