@ds-mo/ui 13.6.1 → 13.7.0

package/dist/components/ds-bar-workflow.js

@@ -1,2 +1,2 @@
-import{p as s,H as o,c as i,h as e,a as r,t}from"./index.js";import{d as a}from"./p-IYy-jODg.js";import{d as n}from"./p-BFfHIu6y.js";import{d}from"./p-BR_oMaas.js";import{d as l}from"./p-BAfG3M8z.js";import{d as c}from"./p-Ca-I2UnB.js";import{d as m}from"./p-1S9AW2MA.js";import{d as b}from"./p-CuJ3J6OJ.js";import{d as h}from"./p-B4_0Ys4w.js";import{d as w}from"./p-DVuxzrCC.js";import{d as f}from"./p-DHF5cLzr.js";import{d as p}from"./p-Bb4f5SuF.js";import{d as u}from"./p-D2cjoj2r.js";const k=()=>`.ds-control--lg.sc-ds-bar-workflow,.ds-control--lg.sc-ds-bar-workflow-h,.ds-control--md.sc-ds-bar-workflow-h,.ds-control--md.sc-ds-bar-workflow,.ds-control--sm.sc-ds-bar-workflow-h,.ds-control--sm.sc-ds-bar-workflow,.ds-control--xs.sc-ds-bar-workflow-h,.ds-control--xs.sc-ds-bar-workflow{--ds-control-radius:var(--dimension-radius-025)}.ds-control--lg.sc-ds-bar-workflow-h,.ds-control--lg.sc-ds-bar-workflow{--ds-control-height:var(--dimension-size-500);--ds-control-icon:var(--dimension-iconography-lg);--ds-control-padding-inline:var(--dimension-space-100);--ds-control-label-inset:var(--dimension-space-050);--ds-control-gap:var(--dimension-space-050)}.ds-control--md.sc-ds-bar-workflow-h,.ds-control--md.sc-ds-bar-workflow{--ds-control-height:var(--dimension-size-400);--ds-control-icon:var(--dimension-iconography-md);--ds-control-padding-inline:var(--dimension-space-075);--ds-control-label-inset:var(--dimension-space-025);--ds-control-gap:var(--dimension-space-050)}.ds-control--sm.sc-ds-bar-workflow-h,.ds-control--sm.sc-ds-bar-workflow{--ds-control-height:var(--dimension-size-300);--ds-control-icon:var(--dimension-iconography-sm);--ds-control-padding-inline:var(--dimension-space-050);--ds-control-label-inset:var(--dimension-space-025);--ds-control-gap:var(--dimension-space-025)}.ds-control--xs.sc-ds-bar-workflow-h,.ds-control--xs.sc-ds-bar-workflow{--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-bar-workflow-h,.ds-chrome-space--sm.sc-ds-bar-workflow{--ds-chrome-padding:var(--dimension-space-050);--ds-chrome-gap:var(--dimension-space-050)}.ds-chrome-space--md.sc-ds-bar-workflow-h,.ds-chrome-space--md.sc-ds-bar-workflow{--ds-chrome-padding:var(--dimension-space-100);--ds-chrome-gap:var(--dimension-space-100)}.ds-chrome-space--lg.sc-ds-bar-workflow-h,.ds-chrome-space--lg.sc-ds-bar-workflow{--ds-chrome-padding:var(--dimension-space-200);--ds-chrome-gap:var(--dimension-space-200)}.ds-chrome-row.sc-ds-bar-workflow-h,.ds-chrome-row.sc-ds-bar-workflow,.ds-chrome-column.sc-ds-bar-workflow-h,.ds-chrome-column.sc-ds-bar-workflow,.ds-chrome-grid.sc-ds-bar-workflow-h,.ds-chrome-grid.sc-ds-bar-workflow{display:flex;box-sizing:border-box;gap:var(--ds-chrome-gap, var(--dimension-space-100));padding:var(--ds-chrome-padding, var(--dimension-space-100))}.ds-chrome-row.sc-ds-bar-workflow-h,.ds-chrome-row.sc-ds-bar-workflow{flex-direction:row;align-items:center}.ds-chrome-column.sc-ds-bar-workflow-h,.ds-chrome-column.sc-ds-bar-workflow{flex-direction:column}.ds-chrome-grid.sc-ds-bar-workflow-h,.ds-chrome-grid.sc-ds-bar-workflow{display:grid;align-items:center}.sc-ds-bar-workflow-h{display:block;min-width:0;box-sizing:border-box;background:var(--color-background-bold-brand)}.bar-workflow.sc-ds-bar-workflow{justify-content:space-between;height:var(--dimension-size-600);min-width:0;background:var(--color-background-bold-brand)}.bar-workflow__identity.sc-ds-bar-workflow{display:flex;flex:1 1 auto;align-items:center;gap:var(--dimension-space-050);height:var(--dimension-size-400);min-width:0}.bar-workflow__heading.sc-ds-bar-workflow{display:inline-flex;flex:1 1 auto;align-items:center;width:auto;min-width:0;height:var(--dimension-size-400);padding-inline:calc(var(--ds-control-padding-inline) + var(--ds-control-label-inset));box-sizing:border-box;user-select:none}.bar-workflow__actions.sc-ds-bar-workflow{display:flex;flex:0 0 auto;align-items:center;gap:var(--dimension-space-100)}`;const g=s(class s extends o{constructor(s){super();if(s!==false){this.__registerHost()}this.dsExit=i(this,"dsExit");this.dsStepChange=i(this,"dsStepChange");this.dsSubmit=i(this,"dsSubmit");this.steps=[];this.value="";this.exitLabel="Exit";this.exitAriaLabel="Exit workflow";this.previousLabel="Previous step";this.nextLabel="Next step";this.submitAction={label:"Save",type:"submit"};this.isNextInactive=false;this.responsiveMode="desktop";this.handlePrevious=()=>{if(this.previousStep&&!this.previousStep.isInactive){this.dsStepChange.emit(this.previousStep.id)}};this.handleNext=()=>{if(this.nextStep&&!this.isNextInactive&&!this.nextStep.isInactive){this.dsStepChange.emit(this.nextStep.id)}}}get currentIndex(){const s=this.steps.findIndex((s=>s.id===this.value));return s>=0?s:0}get previousStep(){return this.steps[this.currentIndex-1]??null}get nextStep(){return this.steps[this.currentIndex+1]??null}get isLastStep(){return this.steps.length<=1||this.currentIndex===this.steps.length-1}get resolvedHeading(){if(this.steps.length<=1)return this.heading;return`${this.heading} · ${this.currentIndex+1}/${this.steps.length}`}renderSubmit(s){const o=this.submitAction;return e("ds-tooltip",{slot:s,label:o.label,side:"bottom",size:"sm"},e("ds-button-filled",{class:"bar-workflow__submit",variant:"icon",icon:"Check",label:o.label,"aria-label":o.label,intent:"brand",contrast:"faint",background:"bold",size:"md",type:o.type??"submit",isInactive:o.isInactive,isLoading:o.isLoading,onDsClick:s=>this.dsSubmit.emit(s.detail)}))}renderMobile(){return e("ds-mobile-header",{class:"bar-workflow__mobile",heading:this.resolvedHeading,tone:"brand"},e("ds-tooltip",{slot:"leading",label:this.exitLabel,side:"bottom",size:"sm"},e("ds-button-unfilled",{class:"bar-workflow__exit",variant:"icon",icon:"Cross","aria-label":this.exitAriaLabel,size:"md",background:"bold",activeFill:false,hasBorder:false,onDsClick:s=>this.dsExit.emit(s.detail)})),this.previousStep?e("ds-tooltip",{slot:"trailing",label:this.previousLabel,side:"bottom",size:"sm"},e("ds-button-unfilled",{class:"bar-workflow__previous",variant:"icon",icon:"ChevronLeft","aria-label":this.previousLabel,size:"md",background:"bold",activeFill:false,hasBorder:false,isInactive:this.previousStep.isInactive,onDsClick:this.handlePrevious})):null,this.isLastStep?this.renderSubmit("trailing"):e("ds-tooltip",{slot:"trailing",label:this.nextLabel,side:"bottom",size:"sm"},e("ds-button-filled",{class:"bar-workflow__next",variant:"icon",icon:"ChevronRight",label:this.nextLabel,"aria-label":this.nextLabel,intent:"brand",contrast:"faint",background:"bold",size:"md",type:"button",isInactive:this.isNextInactive||this.nextStep?.isInactive,onDsClick:this.handleNext})))}renderDesktop(){return e("div",{class:"bar-workflow ds-chrome-row ds-chrome-space--md"},e("div",{class:"bar-workflow__identity"},e("ds-tooltip",{label:this.exitLabel,side:"bottom",size:"sm"},e("ds-button-unfilled",{class:"bar-workflow__exit",variant:"icon",icon:"Cross","aria-label":this.exitAriaLabel,size:"md",background:"bold",activeFill:false,hasBorder:false,onDsClick:s=>this.dsExit.emit(s.detail)})),e("ds-text",{class:"bar-workflow__heading ds-control--md",variant:"text-title-small",emphasis:true,color:"on-bold",as:"h1",lineTruncation:1},this.resolvedHeading)),e("div",{class:"bar-workflow__actions"},this.previousStep?e("ds-tooltip",{label:this.previousLabel,side:"bottom",size:"sm"},e("ds-button-unfilled",{class:"bar-workflow__previous",variant:"icon",icon:"ChevronLeft","aria-label":this.previousLabel,size:"md",background:"bold",activeFill:false,hasBorder:false,isInactive:this.previousStep.isInactive,onDsClick:this.handlePrevious})):null,this.isLastStep?this.renderSubmit():e("ds-tooltip",{label:this.nextLabel,side:"bottom",size:"sm"},e("ds-button-filled",{class:"bar-workflow__next",variant:"icon",icon:"ChevronRight",label:this.nextLabel,"aria-label":this.nextLabel,intent:"brand",contrast:"faint",background:"bold",size:"md",type:"button",isInactive:this.isNextInactive||this.nextStep?.isInactive,onDsClick:this.handleNext}))))}render(){return e(r,{key:"46bb979dc1649a652673d55e27e1cb5183cdbd33"},this.responsiveMode==="mobile"?this.renderMobile():this.renderDesktop())}static get style(){return k()}},[2,"ds-bar-workflow",{heading:[1],steps:[16],value:[1],exitLabel:[1,"exit-label"],exitAriaLabel:[1,"exit-aria-label"],previousLabel:[1,"previous-label"],nextLabel:[1,"next-label"],submitAction:[16],isNextInactive:[4,"is-next-inactive"],responsiveMode:[513,"responsive-mode"]}]);function v(){if(typeof customElements==="undefined"){return}const s=["ds-bar-workflow","ds-badge","ds-button-filled","ds-button-unfilled","ds-icon","ds-loader","ds-menu","ds-mobile-header","ds-mobile-section-switcher","ds-swatch-picker","ds-switch","ds-text","ds-tooltip"];s.forEach((s=>{switch(s){case"ds-bar-workflow":if(!customElements.get(t(s))){customElements.define(t(s),g)}break;case"ds-badge":if(!customElements.get(t(s))){a()}break;case"ds-button-filled":if(!customElements.get(t(s))){n()}break;case"ds-button-unfilled":if(!customElements.get(t(s))){d()}break;case"ds-icon":if(!customElements.get(t(s))){l()}break;case"ds-loader":if(!customElements.get(t(s))){c()}break;case"ds-menu":if(!customElements.get(t(s))){m()}break;case"ds-mobile-header":if(!customElements.get(t(s))){b()}break;case"ds-mobile-section-switcher":if(!customElements.get(t(s))){h()}break;case"ds-swatch-picker":if(!customElements.get(t(s))){w()}break;case"ds-switch":if(!customElements.get(t(s))){f()}break;case"ds-text":if(!customElements.get(t(s))){p()}break;case"ds-tooltip":if(!customElements.get(t(s))){u()}break}}))}v();const x=g;const _=v;export{x as DsBarWorkflow,_ as defineCustomElement};
+import{p as s,H as o,c as i,h as e,a as r,t}from"./index.js";import{d as a}from"./p-1Zbh1MRy.js";import{d as n}from"./p-DQ94PkZA.js";import{d}from"./p-D3UKwTEo.js";import{d as l}from"./p-BAfG3M8z.js";import{d as c}from"./p-Ca-I2UnB.js";import{d as m}from"./p-ByfXC1wu.js";import{d as b}from"./p-CbAfTqlb.js";import{d as h}from"./p-CkyXU1YX.js";import{d as w}from"./p-CfTThRNX.js";import{d as f}from"./p-u2OZHaLY.js";import{d as p}from"./p-jf1zCsuw.js";import{d as k}from"./p-CWLrXsDQ.js";const u=()=>`.ds-control--lg.sc-ds-bar-workflow,.ds-control--lg.sc-ds-bar-workflow-h,.ds-control--md.sc-ds-bar-workflow-h,.ds-control--md.sc-ds-bar-workflow,.ds-control--sm.sc-ds-bar-workflow-h,.ds-control--sm.sc-ds-bar-workflow,.ds-control--xs.sc-ds-bar-workflow-h,.ds-control--xs.sc-ds-bar-workflow{--ds-control-radius:var(--dimension-radius-025)}.ds-control--lg.sc-ds-bar-workflow-h,.ds-control--lg.sc-ds-bar-workflow{--ds-control-height:var(--dimension-size-500);--ds-control-icon:var(--dimension-iconography-lg);--ds-control-padding-inline:var(--dimension-space-100);--ds-control-label-inset:var(--dimension-space-050);--ds-control-gap:var(--dimension-space-050)}.ds-control--md.sc-ds-bar-workflow-h,.ds-control--md.sc-ds-bar-workflow{--ds-control-height:var(--dimension-size-400);--ds-control-icon:var(--dimension-iconography-md);--ds-control-padding-inline:var(--dimension-space-075);--ds-control-label-inset:var(--dimension-space-025);--ds-control-gap:var(--dimension-space-050)}.ds-control--sm.sc-ds-bar-workflow-h,.ds-control--sm.sc-ds-bar-workflow{--ds-control-height:var(--dimension-size-300);--ds-control-icon:var(--dimension-iconography-sm);--ds-control-padding-inline:var(--dimension-space-050);--ds-control-label-inset:var(--dimension-space-025);--ds-control-gap:var(--dimension-space-025)}.ds-control--xs.sc-ds-bar-workflow-h,.ds-control--xs.sc-ds-bar-workflow{--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-bar-workflow-h,.ds-chrome-space--sm.sc-ds-bar-workflow{--ds-chrome-padding:var(--dimension-space-050);--ds-chrome-gap:var(--dimension-space-050)}.ds-chrome-space--md.sc-ds-bar-workflow-h,.ds-chrome-space--md.sc-ds-bar-workflow{--ds-chrome-padding:var(--dimension-space-100);--ds-chrome-gap:var(--dimension-space-100)}.ds-chrome-space--lg.sc-ds-bar-workflow-h,.ds-chrome-space--lg.sc-ds-bar-workflow{--ds-chrome-padding:var(--dimension-space-200);--ds-chrome-gap:var(--dimension-space-200)}.ds-chrome-row.sc-ds-bar-workflow-h,.ds-chrome-row.sc-ds-bar-workflow,.ds-chrome-column.sc-ds-bar-workflow-h,.ds-chrome-column.sc-ds-bar-workflow,.ds-chrome-grid.sc-ds-bar-workflow-h,.ds-chrome-grid.sc-ds-bar-workflow{display:flex;box-sizing:border-box;gap:var(--ds-chrome-gap, var(--dimension-space-100));padding:var(--ds-chrome-padding, var(--dimension-space-100))}.ds-chrome-row.sc-ds-bar-workflow-h,.ds-chrome-row.sc-ds-bar-workflow{flex-direction:row;align-items:center}.ds-chrome-column.sc-ds-bar-workflow-h,.ds-chrome-column.sc-ds-bar-workflow{flex-direction:column}.ds-chrome-grid.sc-ds-bar-workflow-h,.ds-chrome-grid.sc-ds-bar-workflow{display:grid;align-items:center}.sc-ds-bar-workflow-h{display:block;min-width:0;box-sizing:border-box;background:var(--color-background-bold-brand)}.bar-workflow.sc-ds-bar-workflow{justify-content:space-between;height:var(--dimension-size-600);min-width:0;background:var(--color-background-bold-brand)}.bar-workflow__identity.sc-ds-bar-workflow{display:flex;flex:1 1 auto;align-items:center;gap:var(--dimension-space-050);height:var(--dimension-size-400);min-width:0}.bar-workflow__heading.sc-ds-bar-workflow{display:inline-flex;flex:1 1 auto;align-items:center;width:auto;min-width:0;height:var(--dimension-size-400);padding-inline:calc(var(--ds-control-padding-inline) + var(--ds-control-label-inset));box-sizing:border-box;user-select:none}.bar-workflow__actions.sc-ds-bar-workflow{display:flex;flex:0 0 auto;align-items:center;gap:var(--dimension-space-100)}`;const g=s(class s extends o{constructor(s){super();if(s!==false){this.__registerHost()}this.dsExit=i(this,"dsExit");this.dsStepChange=i(this,"dsStepChange");this.dsSubmit=i(this,"dsSubmit");this.steps=[];this.value="";this.exitLabel="Exit";this.exitAriaLabel="Exit workflow";this.previousLabel="Previous step";this.nextLabel="Next step";this.submitAction={label:"Save",type:"submit"};this.isNextInactive=false;this.responsiveMode="desktop";this.handlePrevious=()=>{if(this.previousStep&&!this.previousStep.isInactive){this.dsStepChange.emit(this.previousStep.id)}};this.handleNext=()=>{if(this.nextStep&&!this.isNextInactive&&!this.nextStep.isInactive){this.dsStepChange.emit(this.nextStep.id)}}}get currentIndex(){const s=this.steps.findIndex((s=>s.id===this.value));return s>=0?s:0}get previousStep(){return this.steps[this.currentIndex-1]??null}get nextStep(){return this.steps[this.currentIndex+1]??null}get isLastStep(){return this.steps.length<=1||this.currentIndex===this.steps.length-1}get resolvedHeading(){if(this.steps.length<=1)return this.heading;return`${this.heading} · ${this.currentIndex+1}/${this.steps.length}`}renderSubmit(s){const o=this.submitAction;return e("ds-tooltip",{slot:s,label:o.label,side:"bottom",size:"sm"},e("ds-button-filled",{class:"bar-workflow__submit",variant:"icon",icon:"Check",label:o.label,"aria-label":o.label,intent:"brand",contrast:"faint",background:"bold",size:"md",type:o.type??"submit",isInactive:o.isInactive,isLoading:o.isLoading,onDsClick:s=>this.dsSubmit.emit(s.detail)}))}renderMobile(){return e("ds-mobile-header",{class:"bar-workflow__mobile",heading:this.resolvedHeading,tone:"brand"},e("ds-tooltip",{slot:"leading",label:this.exitLabel,side:"bottom",size:"sm"},e("ds-button-unfilled",{class:"bar-workflow__exit",variant:"icon",icon:"Cross","aria-label":this.exitAriaLabel,size:"md",background:"bold",activeFill:false,hasBorder:false,onDsClick:s=>this.dsExit.emit(s.detail)})),this.previousStep?e("ds-tooltip",{slot:"trailing",label:this.previousLabel,side:"bottom",size:"sm"},e("ds-button-unfilled",{class:"bar-workflow__previous",variant:"icon",icon:"ChevronLeft","aria-label":this.previousLabel,size:"md",background:"bold",activeFill:false,hasBorder:false,isInactive:this.previousStep.isInactive,onDsClick:this.handlePrevious})):null,this.isLastStep?this.renderSubmit("trailing"):e("ds-tooltip",{slot:"trailing",label:this.nextLabel,side:"bottom",size:"sm"},e("ds-button-filled",{class:"bar-workflow__next",variant:"icon",icon:"ChevronRight",label:this.nextLabel,"aria-label":this.nextLabel,intent:"brand",contrast:"faint",background:"bold",size:"md",type:"button",isInactive:this.isNextInactive||this.nextStep?.isInactive,onDsClick:this.handleNext})))}renderDesktop(){return e("div",{class:"bar-workflow ds-chrome-row ds-chrome-space--md"},e("div",{class:"bar-workflow__identity"},e("ds-tooltip",{label:this.exitLabel,side:"bottom",size:"sm"},e("ds-button-unfilled",{class:"bar-workflow__exit",variant:"icon",icon:"Cross","aria-label":this.exitAriaLabel,size:"md",background:"bold",activeFill:false,hasBorder:false,onDsClick:s=>this.dsExit.emit(s.detail)})),e("ds-text",{class:"bar-workflow__heading ds-control--md",variant:"text-title-small",emphasis:true,color:"on-bold",as:"h1",lineTruncation:1},this.resolvedHeading)),e("div",{class:"bar-workflow__actions"},this.previousStep?e("ds-tooltip",{label:this.previousLabel,side:"bottom",size:"sm"},e("ds-button-unfilled",{class:"bar-workflow__previous",variant:"icon",icon:"ChevronLeft","aria-label":this.previousLabel,size:"md",background:"bold",activeFill:false,hasBorder:false,isInactive:this.previousStep.isInactive,onDsClick:this.handlePrevious})):null,this.isLastStep?this.renderSubmit():e("ds-tooltip",{label:this.nextLabel,side:"bottom",size:"sm"},e("ds-button-filled",{class:"bar-workflow__next",variant:"icon",icon:"ChevronRight",label:this.nextLabel,"aria-label":this.nextLabel,intent:"brand",contrast:"faint",background:"bold",size:"md",type:"button",isInactive:this.isNextInactive||this.nextStep?.isInactive,onDsClick:this.handleNext}))))}render(){return e(r,{key:"95172ca41cc7b71b2865cf2f0fc9975c36473f09"},this.responsiveMode==="mobile"?this.renderMobile():this.renderDesktop())}static get style(){return u()}},[2,"ds-bar-workflow",{heading:[1],steps:[16],value:[1],exitLabel:[1,"exit-label"],exitAriaLabel:[1,"exit-aria-label"],previousLabel:[1,"previous-label"],nextLabel:[1,"next-label"],submitAction:[16],isNextInactive:[4,"is-next-inactive"],responsiveMode:[513,"responsive-mode"]}]);function v(){if(typeof customElements==="undefined"){return}const s=["ds-bar-workflow","ds-badge","ds-button-filled","ds-button-unfilled","ds-icon","ds-loader","ds-menu","ds-mobile-header","ds-mobile-section-switcher","ds-swatch-picker","ds-switch","ds-text","ds-tooltip"];s.forEach((s=>{switch(s){case"ds-bar-workflow":if(!customElements.get(t(s))){customElements.define(t(s),g)}break;case"ds-badge":if(!customElements.get(t(s))){a()}break;case"ds-button-filled":if(!customElements.get(t(s))){n()}break;case"ds-button-unfilled":if(!customElements.get(t(s))){d()}break;case"ds-icon":if(!customElements.get(t(s))){l()}break;case"ds-loader":if(!customElements.get(t(s))){c()}break;case"ds-menu":if(!customElements.get(t(s))){m()}break;case"ds-mobile-header":if(!customElements.get(t(s))){b()}break;case"ds-mobile-section-switcher":if(!customElements.get(t(s))){h()}break;case"ds-swatch-picker":if(!customElements.get(t(s))){w()}break;case"ds-switch":if(!customElements.get(t(s))){f()}break;case"ds-text":if(!customElements.get(t(s))){p()}break;case"ds-tooltip":if(!customElements.get(t(s))){k()}break}}))}v();const x=g;const _=v;export{x as DsBarWorkflow,_ as defineCustomElement};
 //# sourceMappingURL=ds-bar-workflow.js.map

package/dist/components/ds-breadcrumb.js

@@ -1,2 +1,2 @@
-import{B as o,d as s}from"./p-BPyymeuR.js";const t=o;const m=s;export{t as DsBreadcrumb,m as defineCustomElement};
+import{B as o,d as s}from"./p-C2U48kDH.js";const t=o;const p=s;export{t as DsBreadcrumb,p as defineCustomElement};
 //# sourceMappingURL=ds-breadcrumb.js.map

package/dist/components/ds-button-filled.js

@@ -1,2 +1,2 @@
-import{B as o,d as s}from"./p-BFfHIu6y.js";const t=o;const p=s;export{t as DsButtonFilled,p as defineCustomElement};
+import{B as o,d as s}from"./p-DQ94PkZA.js";const t=o;const p=s;export{t as DsButtonFilled,p as defineCustomElement};
 //# sourceMappingURL=ds-button-filled.js.map

package/dist/components/ds-button-unfilled.js

@@ -1,2 +1,2 @@
-import{B as o,d as s}from"./p-BR_oMaas.js";const a=o;const t=s;export{a as DsButtonUnfilled,t as defineCustomElement};
+import{B as o,d as s}from"./p-D3UKwTEo.js";const t=o;const p=s;export{t as DsButtonUnfilled,p as defineCustomElement};
 //# sourceMappingURL=ds-button-unfilled.js.map

package/dist/components/{ds-chart-line.d.ts → ds-card-chart.d.ts}

@@ -1,9 +1,9 @@
 import type { Components, JSX } from "../types/components";
 
-interface DsChartLine extends Components.DsChartLine, HTMLElement {}
-export const DsChartLine: {
-    prototype: DsChartLine;
-    new (): DsChartLine;
+interface DsCardChart extends Components.DsCardChart, HTMLElement {}
+export const DsCardChart: {
+    prototype: DsCardChart;
+    new (): DsCardChart;
 };
 /**
  * Used to define this component and all nested components recursively.

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

@@ -0,0 +1,2 @@
+import{p as r,H as s,c as a,h as d,a as c,t as e}from"./index.js";import{d as o}from"./p-1Zbh1MRy.js";import{d as t}from"./p-D3UKwTEo.js";import{d as i}from"./p-BAfG3M8z.js";import{d as n}from"./p-Ca-I2UnB.js";import{d as h}from"./p-jf1zCsuw.js";const l=()=>`.ds-control--lg.sc-ds-card-chart,.ds-control--lg.sc-ds-card-chart-h,.ds-control--md.sc-ds-card-chart-h,.ds-control--md.sc-ds-card-chart,.ds-control--sm.sc-ds-card-chart-h,.ds-control--sm.sc-ds-card-chart,.ds-control--xs.sc-ds-card-chart-h,.ds-control--xs.sc-ds-card-chart{--ds-control-radius:var(--dimension-radius-025)}.ds-control--lg.sc-ds-card-chart-h,.ds-control--lg.sc-ds-card-chart{--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-card-chart-h,.ds-control--md.sc-ds-card-chart{--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-card-chart-h,.ds-control--sm.sc-ds-card-chart{--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-card-chart-h,.ds-control--xs.sc-ds-card-chart{--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-header.sc-ds-card-chart{display:flex;align-items:center;box-sizing:border-box;min-width:0;min-block-size:var(--dimension-size-600);padding:var(--dimension-space-100);gap:var(--dimension-space-100)}.ds-chrome-header--wrapping.sc-ds-card-chart{flex-wrap:wrap}.ds-chrome-header--bounded.sc-ds-card-chart{border-block-end:var(--dimension-stroke-width-012) solid var(--color-border-tertiary)}.ds-chrome-header__leading.sc-ds-card-chart,.ds-chrome-header__trailing.sc-ds-card-chart{display:flex;align-items:center;flex:0 0 auto;min-width:0}.ds-chrome-header__trailing.sc-ds-card-chart{margin-inline-start:auto;gap:var(--dimension-space-100)}.ds-chrome-header__copy.sc-ds-card-chart{display:flex;flex:1 1 0;min-width:0;padding:var(--ds-control-padding-inline, var(--dimension-space-075));box-sizing:border-box}.ds-chrome-header__copy--wrapping.sc-ds-card-chart{align-items:baseline;flex-wrap:wrap;column-gap:var(--dimension-space-100);row-gap:var(--dimension-space-050)}.ds-chrome-header__copy--stacked.sc-ds-card-chart{align-items:stretch;flex-direction:column;gap:var(--dimension-space-050)}.ds-chrome-header__heading.sc-ds-card-chart,.ds-chrome-header__description.sc-ds-card-chart{width:auto;min-width:0;padding-inline:var(--ds-control-label-inset, var(--dimension-space-025));box-sizing:border-box}.ds-chrome-header__heading.sc-ds-card-chart{flex:0 1 auto}.ds-chrome-header__copy--wrapping.sc-ds-card-chart .ds-chrome-header__description.sc-ds-card-chart{flex:1 1 var(--dimension-card-width-xs)}@media (forced-colors: active){.sc-ds-card-chart:root,.sc-ds-card-chart-h,.ds-forced-colors-scope.sc-ds-card-chart{--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-card-chart-h{position:relative;display:flex;flex-direction:column;box-sizing:border-box;width:var(--_card-chart-width);min-height:var(--_card-chart-min-height);max-width:100%;overflow:visible;border:none;border-radius:var(--dimension-radius-125);background-color:var(--color-background-primary);box-shadow:var(--effect-shadow-elevated-sm)}.sc-ds-card-chart-h::after{content:'';position:absolute;inset:0;z-index:4;border-radius:inherit;box-shadow:var(--effect-highlight-elevated-sm);pointer-events:none}.card-chart__header.sc-ds-card-chart{flex-shrink:0;border-bottom:var(--dimension-stroke-width-012) solid var(--color-border-tertiary);background-color:var(--color-background-primary)}.card-chart__copy.sc-ds-card-chart{align-items:center}ds-text.card-chart__title.sc-ds-card-chart{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;-webkit-user-select:none;user-select:none}.card-chart__actions.sc-ds-card-chart{flex-shrink:0}.card-chart__actions.sc-ds-card-chart:empty{display:none}.card-chart__body.sc-ds-card-chart,.card-chart__layout.sc-ds-card-chart{display:flex;flex:1 1 auto;flex-direction:column;box-sizing:border-box;min-height:0}.card-chart__body.sc-ds-card-chart{border-radius:0 0 var(--dimension-radius-125) var(--dimension-radius-125);background-color:var(--color-background-primary)}.card-chart__layout.sc-ds-card-chart{height:100%;gap:var(--dimension-space-200)}.card-chart__chart.sc-ds-card-chart{display:grid;flex:1 1 auto;align-items:center;box-sizing:border-box;min-height:0;padding:var(--dimension-space-200) var(--dimension-space-200) 0     var(--dimension-space-200)}.card-chart__chart.sc-ds-card-chart>*.sc-ds-card-chart{width:100%;min-width:0;max-width:100%}.card-chart__chart.sc-ds-card-chart>ds-chart.sc-ds-card-chart{--ds-chart-container-height:100%}.card-chart__legend.sc-ds-card-chart{flex:0 0 auto;box-sizing:border-box;padding:0 var(--dimension-space-100) var(--dimension-space-100)     var(--dimension-space-100)}@media (forced-colors: active){.sc-ds-card-chart-h{box-shadow:none;outline:var(--dimension-stroke-width-012) solid var(--ds-forced-color-content);outline-offset:calc(-1 * var(--dimension-stroke-width-012))}.sc-ds-card-chart-h::after{box-shadow:none}}`;const m={sm:"var(--dimension-card-width-sm)",md:"var(--dimension-card-width-md)",lg:"var(--dimension-card-width-lg)"};const p={sm:"var(--dimension-card-height-sm)",md:"var(--dimension-card-height-md)",lg:"var(--dimension-card-height-lg)"};const g=r(class r extends s{constructor(r){super();if(r!==false){this.__registerHost()}this.dsFilterClick=a(this,"dsFilterClick");this.variant="custom";this.cardWidth="md";this.showFilter=false;this.filterLabel="Filter";this.hasChartSlot=false;this.hasLegendSlot=false;this.handleFilterClick=()=>{this.dsFilterClick.emit()}}componentWillRender(){this.hasChartSlot=!!this.el.querySelector('[slot="chart"]');this.hasLegendSlot=!!this.el.querySelector('[slot="legend"]')}componentDidRender(){const r=this.el.querySelector('ds-chart-legend[slot="legend"]');if(this.variant==="chart"&&r){r.setAttribute("highlight-on-hover","false");if("highlightOnHover"in r)r.highlightOnHover=false}}render(){const r=this.variant!=="custom"||this.hasChartSlot;return d(c,{key:"831de53d6122f5430183559dff180160dd6734d8",class:{"card-chart":true,[`card-chart--${this.variant}`]:true},style:{"--_card-chart-width":m[this.cardWidth],"--_card-chart-min-height":p[this.cardWidth]}},d("header",{key:"7dc8442e9bbde50e1c5ae28060aa4930b3b4e33d",class:"card-chart__header ds-chrome-header"},d("div",{key:"590e0b68f29fe7e1d1e67102c14f74015756f2b4",class:"card-chart__copy ds-chrome-header__copy ds-control--md"},d("ds-text",{key:"c8aa8ba1c2e10f2bd1b9f80041f56fd59f9e085e",class:"card-chart__title ds-chrome-header__heading",variant:"text-title-small",emphasis:true,color:"primary",as:"h2"},this.heading)),d("div",{key:"0740c05e1f1622c65361af703e80dc77eea3261a",class:"card-chart__actions ds-chrome-header__trailing"},this.showFilter?d("ds-button-unfilled",{variant:"icon",type:"button",icon:"Filters","aria-label":this.filterLabel,onDsClick:this.handleFilterClick}):null,d("slot",{key:"179817d356109b5da3603838db46768e950d2499",name:"actions"}))),d("div",{key:"c3e650d2ad06c4c480e9a0d5e57bba676f3449fe",class:"card-chart__body"},r?d("div",{class:"card-chart__layout"},this.hasChartSlot?d("div",{class:{"card-chart__chart":true}},d("slot",{name:"chart"})):null,this.hasLegendSlot?d("div",{class:"card-chart__legend"},d("slot",{name:"legend"})):null,d("slot",null)):d("slot",null)))}get el(){return this}static get style(){return l()}},[262,"ds-card-chart",{heading:[1],variant:[1],cardWidth:[1,"card-width"],showFilter:[4,"show-filter"],filterLabel:[1,"filter-label"],hasChartSlot:[32],hasLegendSlot:[32]}]);function f(){if(typeof customElements==="undefined"){return}const r=["ds-card-chart","ds-badge","ds-button-unfilled","ds-icon","ds-loader","ds-text"];r.forEach((r=>{switch(r){case"ds-card-chart":if(!customElements.get(e(r))){customElements.define(e(r),g)}break;case"ds-badge":if(!customElements.get(e(r))){o()}break;case"ds-button-unfilled":if(!customElements.get(e(r))){t()}break;case"ds-icon":if(!customElements.get(e(r))){i()}break;case"ds-loader":if(!customElements.get(e(r))){n()}break;case"ds-text":if(!customElements.get(e(r))){h()}break}}))}f();const b=g;const v=f;export{b as DsCardChart,v as defineCustomElement};
+//# sourceMappingURL=ds-card-chart.js.map

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

@@ -0,0 +1 @@
+{"version":3,"names":["cardChartCss","CARD_WIDTH_VARS","sm","md","lg","CARD_HEIGHT_VARS","CardChart","__stencil_proxyCustomElement","HTMLElement","constructor","registerHost","this","variant","cardWidth","showFilter","filterLabel","hasChartSlot","hasLegendSlot","handleFilterClick","dsFilterClick","emit","componentWillRender","el","querySelector","componentDidRender","legend","setAttribute","highlightOnHover","render","usesChartLayout","h","Host","key","class","style","emphasis","color","as","heading","type","icon","onDsClick","name"],"sources":["src/wc/components/CardChart/CardChart.css?tag=ds-card-chart&encapsulation=scoped","src/wc/components/CardChart/CardChart.tsx"],"sourcesContent":["@import '../../utils/chrome-header.css';\n@import '../../utils/forced-colors.css';\n\n:host {\n  position: relative;\n  display: flex;\n  flex-direction: column;\n  box-sizing: border-box;\n  width: var(--_card-chart-width);\n  min-height: var(--_card-chart-min-height);\n  max-width: 100%;\n  overflow: visible;\n  border: none;\n  border-radius: var(--dimension-radius-125);\n  background-color: var(--color-background-primary);\n  box-shadow: var(--effect-shadow-elevated-sm);\n}\n\n:host::after {\n  content: '';\n  position: absolute;\n  inset: 0;\n  z-index: 4;\n  border-radius: inherit;\n  box-shadow: var(--effect-highlight-elevated-sm);\n  pointer-events: none;\n}\n\n.card-chart__header {\n  flex-shrink: 0;\n  border-bottom: var(--dimension-stroke-width-012) solid var(--color-border-tertiary);\n  background-color: var(--color-background-primary);\n}\n\n.card-chart__copy {\n  align-items: center;\n}\n\nds-text.card-chart__title {\n  overflow: hidden;\n  text-overflow: ellipsis;\n  white-space: nowrap;\n  -webkit-user-select: none;\n  user-select: none;\n}\n\n.card-chart__actions {\n  flex-shrink: 0;\n}\n\n.card-chart__actions:empty {\n  display: none;\n}\n\n.card-chart__body,\n.card-chart__layout {\n  display: flex;\n  flex: 1 1 auto;\n  flex-direction: column;\n  box-sizing: border-box;\n  min-height: 0;\n}\n\n.card-chart__body {\n  border-radius: 0 0 var(--dimension-radius-125) var(--dimension-radius-125);\n  background-color: var(--color-background-primary);\n}\n\n.card-chart__layout {\n  height: 100%;\n  gap: var(--dimension-space-200);\n}\n\n.card-chart__chart {\n  display: grid;\n  flex: 1 1 auto;\n  align-items: center;\n  box-sizing: border-box;\n  min-height: 0;\n  padding: var(--dimension-space-200) var(--dimension-space-200) 0\n    var(--dimension-space-200);\n}\n\n.card-chart__chart > * {\n  width: 100%;\n  min-width: 0;\n  max-width: 100%;\n}\n\n.card-chart__chart > ds-chart {\n  --ds-chart-container-height: 100%;\n}\n\n.card-chart__legend {\n  flex: 0 0 auto;\n  box-sizing: border-box;\n  padding: 0 var(--dimension-space-100) var(--dimension-space-100)\n    var(--dimension-space-100);\n}\n\n@media (forced-colors: active) {\n  :host {\n    box-shadow: none;\n    outline: var(--dimension-stroke-width-012) solid var(--ds-forced-color-content);\n    outline-offset: calc(-1 * var(--dimension-stroke-width-012));\n  }\n\n  :host::after {\n    box-shadow: none;\n  }\n}\n","import {\n  Component,\n  Element,\n  Event,\n  EventEmitter,\n  h,\n  Host,\n  Prop,\n  State,\n} from '@stencil/core';\n\nexport type CardChartWidth = 'sm' | 'md' | 'lg';\nexport type CardChartVariant = 'custom' | 'chart';\n\ntype LegendSlot = HTMLElement & {\n  activeLabel?: string | null;\n  highlightOnHover?: boolean;\n};\n\nconst CARD_WIDTH_VARS: Record<CardChartWidth, string> = {\n  sm: 'var(--dimension-card-width-sm)',\n  md: 'var(--dimension-card-width-md)',\n  lg: 'var(--dimension-card-width-lg)',\n};\n\nconst CARD_HEIGHT_VARS: Record<CardChartWidth, string> = {\n  sm: 'var(--dimension-card-height-sm)',\n  md: 'var(--dimension-card-height-md)',\n  lg: 'var(--dimension-card-height-lg)',\n};\n\n/**\n * Standard chart card chrome and composition. The variant owns\n * only the chart/legend relationship; applications continue to own data.\n */\n@Component({\n  tag: 'ds-card-chart',\n  styleUrl: 'CardChart.css',\n  scoped: true,\n})\nexport class CardChart {\n  @Element() el!: HTMLElement;\n\n  /** Chart heading shown in the card header. */\n  @Prop() heading!: string;\n  /** Chart composition behavior. */\n  @Prop() variant: CardChartVariant = 'custom';\n  /** Width token with the matching chart-card min-height. */\n  @Prop() cardWidth: CardChartWidth = 'md';\n  /** Renders the standard filter action before custom actions. */\n  @Prop() showFilter: boolean = false;\n  @Prop() filterLabel: string = 'Filter';\n\n  /** Emits when the standard header filter control is activated. */\n  @Event() dsFilterClick!: EventEmitter<void>;\n\n  @State() private hasChartSlot = false;\n  @State() private hasLegendSlot = false;\n\n  componentWillRender() {\n    this.hasChartSlot = !!this.el.querySelector('[slot=\"chart\"]');\n    this.hasLegendSlot = !!this.el.querySelector('[slot=\"legend\"]');\n  }\n\n  componentDidRender() {\n    const legend = this.el.querySelector(\n      'ds-chart-legend[slot=\"legend\"]'\n    ) as LegendSlot | null;\n    if (this.variant === 'chart' && legend) {\n      legend.setAttribute('highlight-on-hover', 'false');\n      if ('highlightOnHover' in legend) legend.highlightOnHover = false;\n    }\n  }\n\n  private handleFilterClick = () => {\n    this.dsFilterClick.emit();\n  };\n\n  render() {\n    const usesChartLayout = this.variant !== 'custom' || this.hasChartSlot;\n    return (\n      <Host\n        class={{\n          'card-chart': true,\n          [`card-chart--${this.variant}`]: true,\n        }}\n        style={{\n          '--_card-chart-width': CARD_WIDTH_VARS[this.cardWidth],\n          '--_card-chart-min-height': CARD_HEIGHT_VARS[this.cardWidth],\n        }}\n      >\n        <header class=\"card-chart__header ds-chrome-header\">\n          {/* eslint-disable-next-line local/prefer-direct-ds-text -- Shared header copy owns the control-density geometry around the semantic heading. */}\n          <div class=\"card-chart__copy ds-chrome-header__copy ds-control--md\">\n            <ds-text\n              class=\"card-chart__title ds-chrome-header__heading\"\n              variant=\"text-title-small\"\n              emphasis\n              color=\"primary\"\n              as=\"h2\"\n            >\n              {this.heading}\n            </ds-text>\n          </div>\n          <div class=\"card-chart__actions ds-chrome-header__trailing\">\n            {this.showFilter ? (\n              <ds-button-unfilled\n                variant=\"icon\"\n                type=\"button\"\n                icon=\"Filters\"\n                aria-label={this.filterLabel}\n                onDsClick={this.handleFilterClick}\n              />\n            ) : null}\n            <slot name=\"actions\" />\n          </div>\n        </header>\n        <div class=\"card-chart__body\">\n          {usesChartLayout ? (\n            <div class=\"card-chart__layout\">\n              {this.hasChartSlot ? (\n                <div\n                  class={{\n                    'card-chart__chart': true,\n                  }}\n                >\n                  <slot name=\"chart\" />\n                </div>\n              ) : null}\n              {this.hasLegendSlot ? (\n                <div class=\"card-chart__legend\">\n                  <slot name=\"legend\" />\n                </div>\n              ) : null}\n              <slot />\n            </div>\n          ) : (\n            <slot />\n          )}\n        </div>\n      </Host>\n    );\n  }\n}\n"],"mappings":"sPAAA,MAAMA,EAAe,IAAM,q/KCmB3B,MAAMC,EAAkD,CACtDC,GAAI,iCACJC,GAAI,iCACJC,GAAI,kCAGN,MAAMC,EAAmD,CACvDH,GAAI,kCACJC,GAAI,kCACJC,GAAI,mC,MAYOE,EAASC,EAAA,MAAAD,UAAAE,EALtB,WAAAC,CAAAC,G,uFAWUC,KAAAC,QAA4B,SAE5BD,KAAAE,UAA4B,KAE5BF,KAAAG,WAAsB,MACtBH,KAAAI,YAAsB,SAKbJ,KAAAK,aAAe,MACfL,KAAAM,cAAgB,MAiBzBN,KAAAO,kBAAoB,KAC1BP,KAAKQ,cAAcC,MAAM,CAoE5B,CApFC,mBAAAC,GACEV,KAAKK,eAAiBL,KAAKW,GAAGC,cAAc,kBAC5CZ,KAAKM,gBAAkBN,KAAKW,GAAGC,cAAc,kB,CAG/C,kBAAAC,GACE,MAAMC,EAASd,KAAKW,GAAGC,cACrB,kCAEF,GAAIZ,KAAKC,UAAY,SAAWa,EAAQ,CACtCA,EAAOC,aAAa,qBAAsB,SAC1C,GAAI,qBAAsBD,EAAQA,EAAOE,iBAAmB,K,EAQhE,MAAAC,GACE,MAAMC,EAAkBlB,KAAKC,UAAY,UAAYD,KAAKK,aAC1D,OACEc,EAACC,EAAI,CAAAC,IAAA,2CACHC,MAAO,CACL,aAAc,KACd,CAAC,eAAetB,KAAKC,WAAY,MAEnCsB,MAAO,CACL,sBAAuBjC,EAAgBU,KAAKE,WAC5C,2BAA4BR,EAAiBM,KAAKE,aAGpDiB,EAAA,UAAAE,IAAA,2CAAQC,MAAM,uCAEZH,EAAA,OAAAE,IAAA,2CAAKC,MAAM,0DACTH,EAAA,WAAAE,IAAA,2CACEC,MAAM,8CACNrB,QAAQ,mBACRuB,SAAQ,KACRC,MAAM,UACNC,GAAG,MAEF1B,KAAK2B,UAGVR,EAAA,OAAAE,IAAA,2CAAKC,MAAM,kDACRtB,KAAKG,WACJgB,EAAA,sBACElB,QAAQ,OACR2B,KAAK,SACLC,KAAK,UAAS,aACF7B,KAAKI,YACjB0B,UAAW9B,KAAKO,oBAEhB,KACJY,EAAA,QAAAE,IAAA,2CAAMU,KAAK,cAGfZ,EAAA,OAAAE,IAAA,2CAAKC,MAAM,oBACRJ,EACCC,EAAA,OAAKG,MAAM,sBACRtB,KAAKK,aACJc,EAAA,OACEG,MAAO,CACL,oBAAqB,OAGvBH,EAAA,QAAMY,KAAK,WAEX,KACH/B,KAAKM,cACJa,EAAA,OAAKG,MAAM,sBACTH,EAAA,QAAMY,KAAK,YAEX,KACJZ,EAAA,cAGFA,EAAA,c","ignoreList":[]}

package/dist/components/ds-card-overview.js

@@ -1,2 +1,2 @@
-import{p as e,H as r,c as o,h as i,a as s,t as c}from"./index.js";import{d}from"./p-Bsfpxto1.js";import{d as t}from"./p-Bb4f5SuF.js";import{d as a}from"./p-D2cjoj2r.js";import{r as n}from"./p-BJMRBHKW.js";import{T as v}from"./p-C4uYvyq6.js";function l(e){const r=Math.max(1,Math.floor(e.cellCount));const o=Math.max(1,e.minCellWidth);const i=Math.max(1,Math.floor(e.maxColumns??4));const s=Math.max(1,Math.min(r,i,Math.floor(Math.max(0,e.availableWidth)/o)));if(r%2!==0)return s;for(let e=s;e>=1;e-=1){if(r%e===0)return e}return 1}function f(e){const r=Math.max(0,e.compactHeight);const o=Math.max(e.expandedHeight,r);const i=e.variant==="compact"||!Number.isFinite(e.progress)?0:Math.min(1,Math.max(0,e.progress));const s=Math.max(0,o-r);const c=s*i;return{active:i>0&&s>0,expandedHeight:o,offset:c,visibleHeight:o-c}}function w(e){const r=typeof e==="number"?e:Number(e);if(!Number.isFinite(r)||r<0||r>100)return undefined;if(r<=50)return"fair";if(r<=80)return"good";return"excellent"}function h(e,r){const o=e.findIndex((e=>!e.isInactive));if(o<0)return-1;return e[r]&&!e[r].isInactive?r:o}function u(e,r,o){for(let i=1;i<=e.length;i+=1){const s=((r+o*i)%e.length+e.length)%e.length;if(!e[s]?.isInactive)return s}return-1}const m=()=>`@media (forced-colors: active){.sc-ds-card-overview:root,.sc-ds-card-overview-h,.ds-forced-colors-scope.sc-ds-card-overview{--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-card-overview-h,.ds-interaction-fill.sc-ds-card-overview{position:relative;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-fill.sc-ds-card-overview-h::before,.ds-interaction-fill.sc-ds-card-overview::before,.ds-interaction-fill.sc-ds-card-overview-h::after,.ds-interaction-fill.sc-ds-card-overview::after{content:'';position:absolute;inset:0;border-radius:inherit;background:transparent;pointer-events:none;cursor:inherit;transition:none}.ds-interaction-fill.sc-ds-card-overview-h::before,.ds-interaction-fill.sc-ds-card-overview::before{z-index:1}.ds-interaction-fill.sc-ds-card-overview-h::after,.ds-interaction-fill.sc-ds-card-overview::after{z-index:3;box-shadow:inset 0 0 0 var(--ds-interaction-border-width) var(--ds-interaction-border-color)}.ds-interaction-fill--bordered.sc-ds-card-overview-h,.ds-interaction-fill--bordered.sc-ds-card-overview{--ds-interaction-border-width:var(--dimension-stroke-width-012);--ds-interaction-border-color:var(--color-border-secondary)}.ds-interaction-fill--selected.sc-ds-card-overview-h::before,.ds-interaction-fill--selected.sc-ds-card-overview::before{background:var(--ds-interaction-active)}.ds-interaction-fill--selected.sc-ds-card-overview-h,.ds-interaction-fill--selected.sc-ds-card-overview{--ds-interaction-dot-ring:var(--ds-interaction-active)}@media (hover: hover) and (pointer: fine){.ds-interaction-fill.sc-ds-card-overview-h:hover:not(:disabled)::after,.ds-interaction-fill.sc-ds-card-overview:hover:not(:disabled)::after{background:var(--ds-interaction-hover)}}.ds-interaction-fill.sc-ds-card-overview-h:active:not(:disabled)::after,.ds-interaction-fill.sc-ds-card-overview:active:not(:disabled)::after{background:var(--ds-interaction-pressed)}.ds-interaction-fill.sc-ds-card-overview-h>.ds-interaction-fill__content.sc-ds-card-overview,.ds-interaction-fill.sc-ds-card-overview>.ds-interaction-fill__content.sc-ds-card-overview,.ds-interaction-fill__content.sc-ds-card-overview{position:relative;z-index:2;cursor:inherit}.ds-interaction-fill--on-faint.sc-ds-card-overview-h,.ds-interaction-fill--on-faint.sc-ds-card-overview{--ds-interaction-active:var(--color-interaction-active)}.ds-interaction-fill--on-medium.sc-ds-card-overview-h,.ds-interaction-fill--on-medium.sc-ds-card-overview{--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-card-overview-h,.ds-interaction-fill--on-bold.sc-ds-card-overview{--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-card-overview-h,.ds-interaction-fill--on-strong.sc-ds-card-overview{--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-card-overview-h,.ds-interaction-fill--on-translucent.sc-ds-card-overview{--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-card-overview-h,.ds-interaction-fill--on-inverted.sc-ds-card-overview{--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-card-overview-h,.ds-interaction-fill--on-media.sc-ds-card-overview{--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-card-overview-h,.ds-interaction-fill--on-always-dark.sc-ds-card-overview{--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-card-overview-h,.ds-interaction-fill--on-navigation.sc-ds-card-overview{--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-card-overview-h::after,.ds-interaction-fill.sc-ds-card-overview::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-card-overview-h::before,.ds-interaction-fill--selected.sc-ds-card-overview::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-card-overview-h:hover:not(:disabled):not(:focus-visible):not(:focus-within):not(.ds-focus-ring--visible)::after,.ds-interaction-fill.sc-ds-card-overview: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-card-overview:root,.sc-ds-card-overview-h,.ds-forced-colors-scope.sc-ds-card-overview{--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-card-overview-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-card-overview-h,.ds-focus-ring.sc-ds-card-overview,.ds-focus-ring-inset.sc-ds-card-overview-h,.ds-focus-ring-inset.sc-ds-card-overview{outline:none;-webkit-tap-highlight-color:transparent;touch-action:manipulation}.ds-focus-ring.sc-ds-card-overview-h:focus-visible,.ds-focus-ring.sc-ds-card-overview: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-card-overview-h,.ds-focus-ring.ds-focus-ring--visible.sc-ds-card-overview{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-card-overview-h:focus-visible,.ds-focus-ring-inset.sc-ds-card-overview:focus-visible{outline:none}.ds-focus-ring-inset.sc-ds-card-overview-h:focus-visible::after,.ds-focus-ring-inset.sc-ds-card-overview: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-card-overview-h,.ds-focus-ring-inset.ds-focus-ring--visible.sc-ds-card-overview{outline:none}.ds-focus-ring-inset.ds-focus-ring--visible.sc-ds-card-overview-h::after,.ds-focus-ring-inset.ds-focus-ring--visible.sc-ds-card-overview::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-card-overview-h{--ds-focus-ring-color:var(--ds-forced-color-selected)}}.ds-control--lg.sc-ds-card-overview,.ds-control--lg.sc-ds-card-overview-h,.ds-control--md.sc-ds-card-overview-h,.ds-control--md.sc-ds-card-overview,.ds-control--sm.sc-ds-card-overview-h,.ds-control--sm.sc-ds-card-overview,.ds-control--xs.sc-ds-card-overview-h,.ds-control--xs.sc-ds-card-overview{--ds-control-radius:var(--dimension-radius-025)}.ds-control--lg.sc-ds-card-overview-h,.ds-control--lg.sc-ds-card-overview{--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-card-overview-h,.ds-control--md.sc-ds-card-overview{--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-card-overview-h,.ds-control--sm.sc-ds-card-overview{--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-card-overview-h,.ds-control--xs.sc-ds-card-overview{--ds-control-height:var(--dimension-size-200);--ds-control-icon:var(--dimension-iconography-xs);--ds-control-padding-inline:var(--dimension-space-025);--ds-control-label-inset:var(--dimension-space-025);--ds-control-gap:0}.ds-control-frame.sc-ds-card-overview{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-icon-box.sc-ds-card-overview{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-card-overview{min-width:0;padding-inline:var(--ds-control-label-inset, var(--dimension-space-025))}.ds-control-elevation.sc-ds-card-overview-h,.ds-control-elevation.sc-ds-card-overview{position:relative;overflow:visible;box-shadow:var(--ds-control-elevation-shadow, none)}.ds-control-elevation.sc-ds-card-overview-h::after,.ds-control-elevation.sc-ds-card-overview::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-card-overview-h,.ds-control-elevation--sm.sc-ds-card-overview{--ds-control-elevation-shadow:var(--effect-shadow-elevated-sm);--ds-control-elevation-highlight:var(--effect-highlight-elevated-sm)}.ds-control-elevation--md.sc-ds-card-overview-h,.ds-control-elevation--md.sc-ds-card-overview{--ds-control-elevation-shadow:var(--effect-shadow-elevated-md);--ds-control-elevation-highlight:var(--effect-highlight-elevated-md)}.ds-control-elevation--floating.sc-ds-card-overview-h,.ds-control-elevation--floating.sc-ds-card-overview{--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-card-overview{--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-card-overview{scale:var(--dimension-scale-subtle)}@media (prefers-reduced-motion: reduce){.ds-control-elevation--press-scale.sc-ds-card-overview,.ds-control-elevation--press-scale[data-ds-press-active].sc-ds-card-overview{scale:none;transition:none}}.sc-ds-card-overview-h{display:block;box-sizing:border-box;container-type:inline-size;-webkit-user-select:none;user-select:none;--ds-card-overview-metric-min:calc(var(--dimension-size-400) * 5);--ds-card-overview-divider-width:var(--dimension-stroke-width-012);--ds-card-overview-divider-color:var(--color-always-dark-border-tertiary);color:var(--color-always-dark-foreground-primary)}.card-overview__surface.sc-ds-card-overview{width:100%;min-width:0;box-sizing:border-box;border-radius:var(--dimension-radius-125);background:var(--color-always-dark-background);color:var(--color-always-dark-foreground-primary);overflow-anchor:none}.card-overview__clip.sc-ds-card-overview{height:100%;min-width:0;border-radius:inherit;background:inherit;overflow:hidden}.card-overview--scroll-collapsing.sc-ds-card-overview-h{height:var(--ds-card-overview-expanded-height);pointer-events:none}.card-overview--scroll-collapsing.sc-ds-card-overview-h .card-overview__surface.sc-ds-card-overview{height:var(--ds-card-overview-visible-height);pointer-events:auto;will-change:height}.card-overview--scroll-collapsing.sc-ds-card-overview-h .card-overview__body.sc-ds-card-overview{transform:translateY(calc(-1 * var(--ds-card-overview-content-offset)));will-change:transform}.card-overview__layout.sc-ds-card-overview{display:flex;flex-direction:column;min-width:0}.card-overview__summary.sc-ds-card-overview{position:relative;z-index:1;flex:0 0 auto;min-width:0;background:var(--color-always-dark-background)}.card-overview__header.sc-ds-card-overview{display:flex;position:relative;align-items:center;gap:0;width:100%;height:var(--dimension-size-600);min-width:0;padding:var(--dimension-space-100);box-sizing:border-box}.card-overview__header.sc-ds-card-overview::after{content:'';position:absolute;inset-inline:0;inset-block-end:0;height:var(--ds-card-overview-divider-width);background:var(--ds-card-overview-divider-color);pointer-events:none}.card-overview__period.sc-ds-card-overview{display:flex;flex:0 1 auto;align-items:center;gap:0;min-width:0;min-height:var(--ds-control-height);overflow:hidden;white-space:nowrap}.card-overview__period-current.sc-ds-card-overview,.card-overview__period-comparison.sc-ds-card-overview{min-width:0;overflow:hidden;text-overflow:ellipsis}.card-overview__period-current.sc-ds-card-overview{display:flex;flex:0 1 auto;align-items:center}.card-overview__period-fixed.sc-ds-card-overview{flex:0 1 auto;min-width:0}.card-overview__period-comparison.sc-ds-card-overview{flex:0 0 auto}.card-overview__filter.sc-ds-card-overview{display:flex;flex:0 1 auto;align-items:center;min-width:0}.card-overview__body.sc-ds-card-overview{display:flex;position:relative;z-index:0;flex-direction:column;min-width:0;transform:translateY(0)}.card-overview__metrics.sc-ds-card-overview{display:grid;flex:1 1 auto;grid-template-columns:repeat(     var(--ds-card-overview-grid-columns, auto-fit),     minmax(min(100%, var(--ds-card-overview-metric-min)), 1fr)   );align-content:stretch;min-width:0;overflow:clip}.card-overview__score.sc-ds-card-overview,.card-overview__metric.sc-ds-card-overview{display:flex;min-width:0;padding:var(--dimension-space-100);box-shadow:var(--ds-card-overview-divider-width) 0 0 0 var(--ds-card-overview-divider-color),     0 var(--ds-card-overview-divider-width) 0 0 var(--ds-card-overview-divider-color);box-sizing:border-box}.card-overview__score-content.sc-ds-card-overview,.card-overview__metric-action.sc-ds-card-overview{display:flex;flex:1 1 auto;min-width:0;padding:var(--dimension-space-075);border-radius:var(--dimension-radius-025);box-sizing:border-box}.card-overview__score-content.sc-ds-card-overview{align-items:center;justify-content:space-between;gap:var(--dimension-space-100);background:var(--color-always-dark-interaction-active);color:var(--color-always-dark-foreground-primary)}.card-overview__score-content--fair.sc-ds-card-overview{background:var(--color-safety-score-background-fair);color:var(--color-safety-score-foreground-on-fair)}.card-overview__score-content--good.sc-ds-card-overview{background:var(--color-safety-score-background-good);color:var(--color-safety-score-foreground-on-good)}.card-overview__score-content--excellent.sc-ds-card-overview{background:var(--color-safety-score-background-excellent);color:var(--color-safety-score-foreground-on-excellent)}.card-overview__score-copy.sc-ds-card-overview{display:flex;flex:1 1 auto;flex-direction:column;align-items:flex-start;gap:var(--dimension-space-025);min-width:0}.card-overview__score-value.sc-ds-card-overview,.card-overview__score-figure.sc-ds-card-overview{flex:0 0 auto;margin-block:calc(-1 * var(--dimension-space-150))}.card-overview__score-content--error.sc-ds-card-overview{align-items:center;justify-content:center;border:var(--ds-card-overview-divider-width) solid     var(--color-always-dark-border-tertiary);background:transparent;color:var(--color-always-dark-foreground-negative);text-align:center}.card-overview__metric-action.sc-ds-card-overview{flex-direction:column;justify-content:center;gap:var(--dimension-space-050)}.card-overview__metric-action[role='button'].sc-ds-card-overview{cursor:default}.card-overview__metric-content.sc-ds-card-overview{display:flex;flex-direction:column;justify-content:center;gap:var(--dimension-space-050);min-width:0}.card-overview__metric-label.sc-ds-card-overview{min-width:0}.card-overview__metric-figure.sc-ds-card-overview{display:flex;align-items:baseline;gap:var(--dimension-space-100);min-width:0}.card-overview__trend.sc-ds-card-overview{flex:0 0 auto;white-space:nowrap}.card-overview--stacked.sc-ds-card-overview-h .card-overview__metrics.sc-ds-card-overview{grid-template-columns:minmax(0, 1fr)}.card-overview--compact.sc-ds-card-overview-h{height:var(--dimension-size-600);min-height:var(--dimension-size-600)}.card-overview--compact.sc-ds-card-overview-h .card-overview__surface.sc-ds-card-overview,.card-overview--compact.sc-ds-card-overview-h .card-overview__clip.sc-ds-card-overview,.card-overview--compact.sc-ds-card-overview-h .card-overview__layout.sc-ds-card-overview,.card-overview--compact.sc-ds-card-overview-h .card-overview__summary.sc-ds-card-overview{width:100%;height:100%}.card-overview--compact.sc-ds-card-overview-h .card-overview__header.sc-ds-card-overview::after{display:none}@media (forced-colors: active){.card-overview__header.sc-ds-card-overview::after{background:var(--ds-forced-color-content)}.card-overview__score-content.sc-ds-card-overview{border:var(--dimension-stroke-width-012) solid var(--ds-forced-color-content);background:var(--ds-forced-color-surface);color:var(--ds-forced-color-content)}}`;const g="var(--dimension-menu-width-xs)";const b=4;const p=7;const _={positive:"var(--color-always-dark-foreground-positive)",negative:"var(--color-always-dark-foreground-negative)",neutral:"var(--color-always-dark-foreground-secondary)"};const x="var(--color-always-dark-foreground-primary)";const y="var(--color-always-dark-foreground-secondary)";const k=e(class e extends r{constructor(e){super();if(e!==false){this.__registerHost()}this.dsMetricSelect=o(this,"dsMetricSelect");this.variant="default";this.layout="auto";this.periodLabel="";this.comparisonLabel="";this.metrics=[];this.metricMinWidth=g;this.isLoading=false;this.overviewLabel="Overview";this.scrollCollapseProgress=0;this.focusedMetricIndex=0;this.expandedHeight=0;this.layoutResizeObserver=null;this.handleMetricKeyDown=(e,r)=>{switch(e.key){case"ArrowRight":case"ArrowDown":e.preventDefault();this.moveFocus(r,1);break;case"ArrowLeft":case"ArrowUp":e.preventDefault();this.moveFocus(r,-1);break}}}componentDidLoad(){this.observeLayout()}componentDidRender(){if(!this.layoutResizeObserver)this.observeLayout();else this.updateLayoutGeometry()}disconnectedCallback(){this.layoutResizeObserver?.disconnect();this.layoutResizeObserver=null}get visibleMetrics(){return this.metrics.slice(0,p)}get visibleCellCount(){const e=this.isLoading&&this.metrics.length===0?b:this.visibleMetrics.length;return 1+e}get resolvedScrollCollapseProgress(){if(this.variant==="compact"||!Number.isFinite(this.scrollCollapseProgress))return 0;return Math.min(1,Math.max(0,this.scrollCollapseProgress))}get scrollCollapseGeometry(){const e=n(v.size600,48);return f({variant:this.variant,progress:this.resolvedScrollCollapseProgress,expandedHeight:this.expandedHeight,compactHeight:e})}observeLayout(){const e=this.layoutEl;if(!e)return;const r=e.getBoundingClientRect();this.updateLayoutGeometry(r.width,r.height);if(typeof ResizeObserver==="undefined")return;this.layoutResizeObserver?.disconnect();this.layoutResizeObserver=new ResizeObserver((e=>{const r=e[0]?.contentRect;if(r)this.updateLayoutGeometry(r.width,r.height)}));this.layoutResizeObserver.observe(e)}updateLayoutGeometry(e,r){const o=this.layoutEl;if(!o)return;const i=e===undefined||r===undefined?o.getBoundingClientRect():null;const s=e??i?.width??0;const c=r??i?.height??0;if(c>0&&Math.abs(c-this.expandedHeight)>=.5){this.expandedHeight=c}const d=l({cellCount:this.visibleCellCount,availableWidth:s,minCellWidth:n(this.metricMinWidth,v.menuWidthXs)});if(d!==this.gridColumns)this.gridColumns=d}get rovingIndex(){return h(this.visibleMetrics,this.focusedMetricIndex)}selectMetric(e,r){if(e.isInactive)return;this.focusedMetricIndex=r;this.dsMetricSelect.emit(e)}moveFocus(e,r){const o=this.visibleMetrics;const i=u(o,e,r<0?-1:1);if(i<0)return;this.focusedMetricIndex=i;const s=this.el.querySelectorAll(".card-overview__metric-action");s[i]?.focus()}bar(e,r,o){return i("ds-skeleton",{class:o,variant:"text",textVariant:e,width:r,background:"always-dark"})}renderTrend(e,r,o=false,s){if(!e)return null;return i("ds-text",{as:"span",class:{"card-overview__trend":true,"ds-control-label-box":true,[`card-overview__trend--${e.tone}`]:true},variant:r,emphasis:o,color:s??_[e.tone],fontFeature:"tabular-nums"},e.direction==="up"?"↑":"↓"," ",e.value)}renderScore(){if(this.isLoading){return i("div",{class:"card-overview__score",part:"score"},i("div",{class:"card-overview__score-content"},i("div",{class:"card-overview__score-copy"},this.bar("text-body-small","64px","card-overview__score-label"),this.bar("text-body-medium","28px")),i("div",{class:"card-overview__score-figure"},this.bar("text-display-medium","56px"))))}const e=this.scoreErrorMessage||(!this.score?"Score unavailable":undefined);if(e){return i("div",{class:"card-overview__score",part:"score"},i("ds-text",{as:"span",class:"card-overview__score-content card-overview__score-content--error",variant:"text-body-medium",color:"inherit",role:"alert"},e))}const r=this.score;if(!r)return null;const o=r.level??w(r.value);return i("div",{class:"card-overview__score",part:"score"},i("div",{class:{"card-overview__score-content":true,[`card-overview__score-content--${o}`]:Boolean(o)}},i("div",{class:"card-overview__score-copy"},i("ds-text",{as:"span",class:"card-overview__score-label ds-control-label-box",variant:"text-body-small",color:"inherit"},r.label),this.renderTrend(r.trend,"text-body-medium",false,"inherit")),i("ds-text",{as:"span",class:"card-overview__score-value ds-control-label-box",variant:"text-display-medium",emphasis:true,color:"inherit",fontFeature:"tabular-nums"},r.value)))}renderMetric(e,r){const o=!e.isInactive;const s=i("ds-text",{as:"span",class:"card-overview__metric-label ds-control-label-box",variant:"text-body-small",color:y},e.label);return i("div",{class:"card-overview__metric",part:"metric"},i("div",{class:{"card-overview__metric-action":true,"card-overview__metric-action--inactive":!o,"ds-interaction-fill":o,"ds-interaction-fill--on-always-dark":o,"ds-focus-ring-inset":o},role:o?"button":undefined,tabIndex:o&&r===this.rovingIndex?0:-1,onClick:()=>this.selectMetric(e,r),onKeyDown:e=>this.handleMetricKeyDown(e,r),onFocusin:()=>{if(o)this.focusedMetricIndex=r}},i("div",{class:"ds-interaction-fill__content card-overview__metric-content"},e.labelTooltip?i("ds-tooltip",{label:e.labelTooltip,side:"top",size:"sm"},s):s,i("div",{class:"card-overview__metric-figure"},i("ds-text",{as:"span",class:"card-overview__metric-value ds-control-label-box",variant:"text-body-medium",color:x,fontFeature:"tabular-nums"},e.value),this.renderTrend(e.trend,"text-body-medium")))))}renderMetrics(){if(this.isLoading&&this.metrics.length===0){return[this.renderScore(),...Array.from({length:b},((e,r)=>i("div",{class:"card-overview__metric",key:`loading-${r}`},i("div",{class:"card-overview__metric-action card-overview__metric-action--inactive"},this.bar("text-body-small","70%","card-overview__metric-label"),i("div",{class:"card-overview__metric-figure"},this.bar("text-body-medium","36px"),this.bar("text-body-medium","40px"))))))]}return[this.renderScore(),...this.visibleMetrics.map(((e,r)=>this.renderMetric(e,r)))]}render(){const e=this.variant==="compact";const r=this.scrollCollapseGeometry;return i(s,{key:"fa930957cc50fecb3bfce8c78a6dd58c19b0a639",class:{"card-overview":true,"card-overview--compact":e,"card-overview--stacked":!e&&this.layout==="stacked","card-overview--scroll-collapsing":r.active},role:"region","aria-label":this.overviewLabel,"aria-busy":this.isLoading?"true":undefined,style:{"--ds-card-overview-metric-min":this.metricMinWidth,"--ds-card-overview-grid-columns":this.gridColumns?String(this.gridColumns):undefined,"--ds-card-overview-expanded-height":r.active?`${r.expandedHeight}px`:undefined,"--ds-card-overview-visible-height":r.active?`${r.visibleHeight}px`:undefined,"--ds-card-overview-content-offset":r.active?`${r.offset}px`:undefined}},i("div",{key:"96d462ad32403fdf33233bca29b14454f4a8f4ce",class:{"card-overview__surface":true,"ds-control-elevation":true,"ds-control-elevation--sm":!e,"ds-control-elevation--floating":e}},i("div",{key:"6566ce5d652b92e112b5e1d30b663dafdfb25ab9",class:"card-overview__clip"},i("div",{key:"c8e5fec304393c24754818e81feb1462108e8ea2",ref:e=>{this.layoutEl=e??undefined},class:{"card-overview__layout":true}},i("div",{key:"41a0efc1253b90f9b25dda3925f01346cf71f0bb",class:"card-overview__summary"},i("div",{key:"ed5534c94ba2ff2bb3a3071b7bf9e0525f28c676",class:"card-overview__header ds-control--md"},this.isLoading?i("div",{class:"card-overview__period"},this.bar("text-body-medium","184px"),this.bar("text-body-medium","248px")):i("div",{class:"card-overview__period"},i("div",{class:"card-overview__period-current"},i("slot",{name:"period"},this.periodLabel&&i("div",{class:"card-overview__period-fixed ds-control-frame"},i("ds-text",{as:"span",class:"ds-control-label-box",variant:"text-body-medium",emphasis:true,color:x},this.periodLabel)))),this.comparisonLabel&&i("ds-text",{as:"span",class:"card-overview__period-comparison ds-control-label-box",variant:"text-body-medium",color:y},this.comparisonLabel)),i("div",{key:"6644fea8d2f6a85d434f9f1e64e84948cb43bee6",class:"card-overview__filter"},this.isLoading?i("ds-skeleton",{variant:"control",controlSize:"md",width:"128px",background:"always-dark"}):i("slot",{name:"filter"})))),!e&&i("div",{key:"f3133376e436603da3a8e2df9938bc398bbf030a",class:"card-overview__body"},i("div",{key:"51e9293e4f93ea670d4586e0c1c663455ac32cd1",class:"card-overview__metrics",part:"metrics"},this.renderMetrics()),i("slot",{key:"0bb62ffba8e02181d15a1bd7c42b7bc9d3129acd",name:"footer"}))))))}get el(){return this}static get style(){return m()}},[262,"ds-card-overview",{variant:[1],layout:[1],score:[16],periodLabel:[1,"period-label"],comparisonLabel:[1,"comparison-label"],metrics:[16],metricMinWidth:[1,"metric-min-width"],isLoading:[4,"is-loading"],scoreErrorMessage:[1,"score-error-message"],overviewLabel:[1,"overview-label"],scrollCollapseProgress:[2,"scroll-collapse-progress"],focusedMetricIndex:[32],expandedHeight:[32],gridColumns:[32]}]);function z(){if(typeof customElements==="undefined"){return}const e=["ds-card-overview","ds-skeleton","ds-text","ds-tooltip"];e.forEach((e=>{switch(e){case"ds-card-overview":if(!customElements.get(c(e))){customElements.define(c(e),k)}break;case"ds-skeleton":if(!customElements.get(c(e))){d()}break;case"ds-text":if(!customElements.get(c(e))){t()}break;case"ds-tooltip":if(!customElements.get(c(e))){a()}break}}))}z();const M=k;const C=z;export{M as DsCardOverview,C as defineCustomElement};
+import{p as e,H as r,c as o,h as i,a as s,t as c}from"./index.js";import{d}from"./p-BsBw-w1q.js";import{d as t}from"./p-jf1zCsuw.js";import{d as a}from"./p-CWLrXsDQ.js";import{r as n}from"./p-BJMRBHKW.js";import{T as v}from"./p-CXduurfd.js";function l(e){const r=Math.max(1,Math.floor(e.cellCount));const o=Math.max(1,e.minCellWidth);const i=Math.max(1,Math.floor(e.maxColumns??4));const s=Math.max(1,Math.min(r,i,Math.floor(Math.max(0,e.availableWidth)/o)));if(r%2!==0)return s;for(let e=s;e>=1;e-=1){if(r%e===0)return e}return 1}function f(e){const r=Math.max(0,e.compactHeight);const o=Math.max(e.expandedHeight,r);const i=e.variant==="compact"||!Number.isFinite(e.progress)?0:Math.min(1,Math.max(0,e.progress));const s=Math.max(0,o-r);const c=s*i;return{active:i>0&&s>0,expandedHeight:o,offset:c,visibleHeight:o-c}}function w(e){const r=typeof e==="number"?e:Number(e);if(!Number.isFinite(r)||r<0||r>100)return undefined;if(r<=50)return"fair";if(r<=80)return"good";return"excellent"}function h(e,r){const o=e.findIndex((e=>!e.isInactive));if(o<0)return-1;return e[r]&&!e[r].isInactive?r:o}function u(e,r,o){for(let i=1;i<=e.length;i+=1){const s=((r+o*i)%e.length+e.length)%e.length;if(!e[s]?.isInactive)return s}return-1}const m=()=>`@media (forced-colors: active){.sc-ds-card-overview:root,.sc-ds-card-overview-h,.ds-forced-colors-scope.sc-ds-card-overview{--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-card-overview-h,.ds-interaction-fill.sc-ds-card-overview{position:relative;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-fill.sc-ds-card-overview-h::before,.ds-interaction-fill.sc-ds-card-overview::before,.ds-interaction-fill.sc-ds-card-overview-h::after,.ds-interaction-fill.sc-ds-card-overview::after{content:'';position:absolute;inset:0;border-radius:inherit;background:transparent;pointer-events:none;cursor:inherit;transition:none}.ds-interaction-fill.sc-ds-card-overview-h::before,.ds-interaction-fill.sc-ds-card-overview::before{z-index:1}.ds-interaction-fill.sc-ds-card-overview-h::after,.ds-interaction-fill.sc-ds-card-overview::after{z-index:3;box-shadow:inset 0 0 0 var(--ds-interaction-border-width) var(--ds-interaction-border-color)}.ds-interaction-fill--bordered.sc-ds-card-overview-h,.ds-interaction-fill--bordered.sc-ds-card-overview{--ds-interaction-border-width:var(--dimension-stroke-width-012);--ds-interaction-border-color:var(--color-border-secondary)}.ds-interaction-fill--selected.sc-ds-card-overview-h::before,.ds-interaction-fill--selected.sc-ds-card-overview::before{background:var(--ds-interaction-active)}.ds-interaction-fill--selected.sc-ds-card-overview-h,.ds-interaction-fill--selected.sc-ds-card-overview{--ds-interaction-dot-ring:var(--ds-interaction-active)}@media (hover: hover) and (pointer: fine){.ds-interaction-fill.sc-ds-card-overview-h:hover:not(:disabled)::after,.ds-interaction-fill.sc-ds-card-overview:hover:not(:disabled)::after{background:var(--ds-interaction-hover)}}.ds-interaction-fill.sc-ds-card-overview-h:active:not(:disabled)::after,.ds-interaction-fill.sc-ds-card-overview:active:not(:disabled)::after{background:var(--ds-interaction-pressed)}.ds-interaction-fill.sc-ds-card-overview-h>.ds-interaction-fill__content.sc-ds-card-overview,.ds-interaction-fill.sc-ds-card-overview>.ds-interaction-fill__content.sc-ds-card-overview,.ds-interaction-fill__content.sc-ds-card-overview{position:relative;z-index:2;cursor:inherit}.ds-interaction-fill--on-faint.sc-ds-card-overview-h,.ds-interaction-fill--on-faint.sc-ds-card-overview{--ds-interaction-active:var(--color-interaction-active)}.ds-interaction-fill--on-medium.sc-ds-card-overview-h,.ds-interaction-fill--on-medium.sc-ds-card-overview{--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-card-overview-h,.ds-interaction-fill--on-bold.sc-ds-card-overview{--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-card-overview-h,.ds-interaction-fill--on-strong.sc-ds-card-overview{--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-card-overview-h,.ds-interaction-fill--on-translucent.sc-ds-card-overview{--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-card-overview-h,.ds-interaction-fill--on-inverted.sc-ds-card-overview{--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-card-overview-h,.ds-interaction-fill--on-media.sc-ds-card-overview{--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-card-overview-h,.ds-interaction-fill--on-always-dark.sc-ds-card-overview{--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-card-overview-h,.ds-interaction-fill--on-navigation.sc-ds-card-overview{--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-card-overview-h::after,.ds-interaction-fill.sc-ds-card-overview::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-card-overview-h::before,.ds-interaction-fill--selected.sc-ds-card-overview::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-card-overview-h:hover:not(:disabled):not(:focus-visible):not(:focus-within):not(.ds-focus-ring--visible)::after,.ds-interaction-fill.sc-ds-card-overview: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-card-overview:root,.sc-ds-card-overview-h,.ds-forced-colors-scope.sc-ds-card-overview{--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-card-overview-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-card-overview-h,.ds-focus-ring.sc-ds-card-overview,.ds-focus-ring-inset.sc-ds-card-overview-h,.ds-focus-ring-inset.sc-ds-card-overview{outline:none;-webkit-tap-highlight-color:transparent;touch-action:manipulation}.ds-focus-ring.sc-ds-card-overview-h:focus-visible,.ds-focus-ring.sc-ds-card-overview: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-card-overview-h,.ds-focus-ring.ds-focus-ring--visible.sc-ds-card-overview{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-card-overview-h:focus-visible,.ds-focus-ring-inset.sc-ds-card-overview:focus-visible{outline:none}.ds-focus-ring-inset.sc-ds-card-overview-h:focus-visible::after,.ds-focus-ring-inset.sc-ds-card-overview: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-card-overview-h,.ds-focus-ring-inset.ds-focus-ring--visible.sc-ds-card-overview{outline:none}.ds-focus-ring-inset.ds-focus-ring--visible.sc-ds-card-overview-h::after,.ds-focus-ring-inset.ds-focus-ring--visible.sc-ds-card-overview::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-card-overview-h{--ds-focus-ring-color:var(--ds-forced-color-selected)}}.ds-control--lg.sc-ds-card-overview,.ds-control--lg.sc-ds-card-overview-h,.ds-control--md.sc-ds-card-overview-h,.ds-control--md.sc-ds-card-overview,.ds-control--sm.sc-ds-card-overview-h,.ds-control--sm.sc-ds-card-overview,.ds-control--xs.sc-ds-card-overview-h,.ds-control--xs.sc-ds-card-overview{--ds-control-radius:var(--dimension-radius-025)}.ds-control--lg.sc-ds-card-overview-h,.ds-control--lg.sc-ds-card-overview{--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-card-overview-h,.ds-control--md.sc-ds-card-overview{--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-card-overview-h,.ds-control--sm.sc-ds-card-overview{--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-card-overview-h,.ds-control--xs.sc-ds-card-overview{--ds-control-height:var(--dimension-size-200);--ds-control-icon:var(--dimension-iconography-xs);--ds-control-padding-inline:var(--dimension-space-025);--ds-control-label-inset:var(--dimension-space-025);--ds-control-gap:0}.ds-control-frame.sc-ds-card-overview{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-icon-box.sc-ds-card-overview{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-card-overview{min-width:0;padding-inline:var(--ds-control-label-inset, var(--dimension-space-025))}.ds-control-elevation.sc-ds-card-overview-h,.ds-control-elevation.sc-ds-card-overview{position:relative;overflow:visible;box-shadow:var(--ds-control-elevation-shadow, none)}.ds-control-elevation.sc-ds-card-overview-h::after,.ds-control-elevation.sc-ds-card-overview::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-card-overview-h,.ds-control-elevation--sm.sc-ds-card-overview{--ds-control-elevation-shadow:var(--effect-shadow-elevated-sm);--ds-control-elevation-highlight:var(--effect-highlight-elevated-sm)}.ds-control-elevation--md.sc-ds-card-overview-h,.ds-control-elevation--md.sc-ds-card-overview{--ds-control-elevation-shadow:var(--effect-shadow-elevated-md);--ds-control-elevation-highlight:var(--effect-highlight-elevated-md)}.ds-control-elevation--floating.sc-ds-card-overview-h,.ds-control-elevation--floating.sc-ds-card-overview{--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-card-overview{--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-card-overview{scale:var(--dimension-scale-subtle)}@media (prefers-reduced-motion: reduce){.ds-control-elevation--press-scale.sc-ds-card-overview,.ds-control-elevation--press-scale[data-ds-press-active].sc-ds-card-overview{scale:none;transition:none}}.sc-ds-card-overview-h{display:block;box-sizing:border-box;container-type:inline-size;-webkit-user-select:none;user-select:none;--ds-card-overview-metric-min:calc(var(--dimension-size-400) * 5);--ds-card-overview-divider-width:var(--dimension-stroke-width-012);--ds-card-overview-divider-color:var(--color-always-dark-border-tertiary);color:var(--color-always-dark-foreground-primary)}.card-overview__surface.sc-ds-card-overview{width:100%;min-width:0;box-sizing:border-box;border-radius:var(--dimension-radius-125);background:var(--color-always-dark-background);color:var(--color-always-dark-foreground-primary);overflow-anchor:none}.card-overview__clip.sc-ds-card-overview{height:100%;min-width:0;border-radius:inherit;background:inherit;overflow:hidden}.card-overview--scroll-collapsing.sc-ds-card-overview-h{height:var(--ds-card-overview-expanded-height);pointer-events:none}.card-overview--scroll-collapsing.sc-ds-card-overview-h .card-overview__surface.sc-ds-card-overview{height:var(--ds-card-overview-visible-height);pointer-events:auto;will-change:height}.card-overview--scroll-collapsing.sc-ds-card-overview-h .card-overview__body.sc-ds-card-overview{transform:translateY(calc(-1 * var(--ds-card-overview-content-offset)));will-change:transform}.card-overview__layout.sc-ds-card-overview{display:flex;flex-direction:column;min-width:0}.card-overview__summary.sc-ds-card-overview{position:relative;z-index:1;flex:0 0 auto;min-width:0;background:var(--color-always-dark-background)}.card-overview__header.sc-ds-card-overview{display:flex;position:relative;align-items:center;gap:0;width:100%;height:var(--dimension-size-600);min-width:0;padding:var(--dimension-space-100);box-sizing:border-box}.card-overview__header.sc-ds-card-overview::after{content:'';position:absolute;inset-inline:0;inset-block-end:0;height:var(--ds-card-overview-divider-width);background:var(--ds-card-overview-divider-color);pointer-events:none}.card-overview__period.sc-ds-card-overview{display:flex;flex:0 1 auto;align-items:center;gap:0;min-width:0;min-height:var(--ds-control-height);overflow:hidden;white-space:nowrap}.card-overview__period-current.sc-ds-card-overview,.card-overview__period-comparison.sc-ds-card-overview{min-width:0;overflow:hidden;text-overflow:ellipsis}.card-overview__period-current.sc-ds-card-overview{display:flex;flex:0 1 auto;align-items:center}.card-overview__period-fixed.sc-ds-card-overview{flex:0 1 auto;min-width:0}.card-overview__period-comparison.sc-ds-card-overview{flex:0 0 auto}.card-overview__filter.sc-ds-card-overview{display:flex;flex:0 1 auto;align-items:center;min-width:0}.card-overview__body.sc-ds-card-overview{display:flex;position:relative;z-index:0;flex-direction:column;min-width:0;transform:translateY(0)}.card-overview__metrics.sc-ds-card-overview{display:grid;flex:1 1 auto;grid-template-columns:repeat(     var(--ds-card-overview-grid-columns, auto-fit),     minmax(min(100%, var(--ds-card-overview-metric-min)), 1fr)   );align-content:stretch;min-width:0;overflow:clip}.card-overview__score.sc-ds-card-overview,.card-overview__metric.sc-ds-card-overview{display:flex;min-width:0;padding:var(--dimension-space-100);box-shadow:var(--ds-card-overview-divider-width) 0 0 0 var(--ds-card-overview-divider-color),     0 var(--ds-card-overview-divider-width) 0 0 var(--ds-card-overview-divider-color);box-sizing:border-box}.card-overview__score-content.sc-ds-card-overview,.card-overview__metric-action.sc-ds-card-overview{display:flex;flex:1 1 auto;min-width:0;padding:var(--dimension-space-075);border-radius:var(--dimension-radius-025);box-sizing:border-box}.card-overview__score-content.sc-ds-card-overview{align-items:center;justify-content:space-between;gap:var(--dimension-space-100);background:var(--color-always-dark-interaction-active);color:var(--color-always-dark-foreground-primary)}.card-overview__score-content--fair.sc-ds-card-overview{background:var(--color-safety-score-background-fair);color:var(--color-safety-score-foreground-on-fair)}.card-overview__score-content--good.sc-ds-card-overview{background:var(--color-safety-score-background-good);color:var(--color-safety-score-foreground-on-good)}.card-overview__score-content--excellent.sc-ds-card-overview{background:var(--color-safety-score-background-excellent);color:var(--color-safety-score-foreground-on-excellent)}.card-overview__score-copy.sc-ds-card-overview{display:flex;flex:1 1 auto;flex-direction:column;align-items:flex-start;gap:var(--dimension-space-025);min-width:0}.card-overview__score-value.sc-ds-card-overview,.card-overview__score-figure.sc-ds-card-overview{flex:0 0 auto;margin-block:calc(-1 * var(--dimension-space-150))}.card-overview__score-content--error.sc-ds-card-overview{align-items:center;justify-content:center;border:var(--ds-card-overview-divider-width) solid     var(--color-always-dark-border-tertiary);background:transparent;color:var(--color-always-dark-foreground-negative);text-align:center}.card-overview__metric-action.sc-ds-card-overview{flex-direction:column;justify-content:center;gap:var(--dimension-space-050)}.card-overview__metric-action[role='button'].sc-ds-card-overview{cursor:default}.card-overview__metric-content.sc-ds-card-overview{display:flex;flex-direction:column;justify-content:center;gap:var(--dimension-space-050);min-width:0}.card-overview__metric-label.sc-ds-card-overview{min-width:0}.card-overview__metric-figure.sc-ds-card-overview{display:flex;align-items:baseline;gap:var(--dimension-space-100);min-width:0}.card-overview__trend.sc-ds-card-overview{flex:0 0 auto;white-space:nowrap}.card-overview--stacked.sc-ds-card-overview-h .card-overview__metrics.sc-ds-card-overview{grid-template-columns:minmax(0, 1fr)}.card-overview--compact.sc-ds-card-overview-h{height:var(--dimension-size-600);min-height:var(--dimension-size-600)}.card-overview--compact.sc-ds-card-overview-h .card-overview__surface.sc-ds-card-overview,.card-overview--compact.sc-ds-card-overview-h .card-overview__clip.sc-ds-card-overview,.card-overview--compact.sc-ds-card-overview-h .card-overview__layout.sc-ds-card-overview,.card-overview--compact.sc-ds-card-overview-h .card-overview__summary.sc-ds-card-overview{width:100%;height:100%}.card-overview--compact.sc-ds-card-overview-h .card-overview__header.sc-ds-card-overview::after{display:none}@media (forced-colors: active){.card-overview__header.sc-ds-card-overview::after{background:var(--ds-forced-color-content)}.card-overview__score-content.sc-ds-card-overview{border:var(--dimension-stroke-width-012) solid var(--ds-forced-color-content);background:var(--ds-forced-color-surface);color:var(--ds-forced-color-content)}}`;const g="var(--dimension-menu-width-xs)";const b=4;const p=7;const _={positive:"var(--color-always-dark-foreground-positive)",negative:"var(--color-always-dark-foreground-negative)",neutral:"var(--color-always-dark-foreground-secondary)"};const x="var(--color-always-dark-foreground-primary)";const y="var(--color-always-dark-foreground-secondary)";const k=e(class e extends r{constructor(e){super();if(e!==false){this.__registerHost()}this.dsMetricSelect=o(this,"dsMetricSelect");this.variant="default";this.layout="auto";this.periodLabel="";this.comparisonLabel="";this.metrics=[];this.metricMinWidth=g;this.isLoading=false;this.overviewLabel="Overview";this.scrollCollapseProgress=0;this.focusedMetricIndex=0;this.expandedHeight=0;this.layoutResizeObserver=null;this.handleMetricKeyDown=(e,r)=>{switch(e.key){case"ArrowRight":case"ArrowDown":e.preventDefault();this.moveFocus(r,1);break;case"ArrowLeft":case"ArrowUp":e.preventDefault();this.moveFocus(r,-1);break}}}componentDidLoad(){this.observeLayout()}componentDidRender(){if(!this.layoutResizeObserver)this.observeLayout();else this.updateLayoutGeometry()}disconnectedCallback(){this.layoutResizeObserver?.disconnect();this.layoutResizeObserver=null}get visibleMetrics(){return this.metrics.slice(0,p)}get visibleCellCount(){const e=this.isLoading&&this.metrics.length===0?b:this.visibleMetrics.length;return 1+e}get resolvedScrollCollapseProgress(){if(this.variant==="compact"||!Number.isFinite(this.scrollCollapseProgress))return 0;return Math.min(1,Math.max(0,this.scrollCollapseProgress))}get scrollCollapseGeometry(){const e=n(v.size600,48);return f({variant:this.variant,progress:this.resolvedScrollCollapseProgress,expandedHeight:this.expandedHeight,compactHeight:e})}observeLayout(){const e=this.layoutEl;if(!e)return;const r=e.getBoundingClientRect();this.updateLayoutGeometry(r.width,r.height);if(typeof ResizeObserver==="undefined")return;this.layoutResizeObserver?.disconnect();this.layoutResizeObserver=new ResizeObserver((e=>{const r=e[0]?.contentRect;if(r)this.updateLayoutGeometry(r.width,r.height)}));this.layoutResizeObserver.observe(e)}updateLayoutGeometry(e,r){const o=this.layoutEl;if(!o)return;const i=e===undefined||r===undefined?o.getBoundingClientRect():null;const s=e??i?.width??0;const c=r??i?.height??0;if(c>0&&Math.abs(c-this.expandedHeight)>=.5){this.expandedHeight=c}const d=l({cellCount:this.visibleCellCount,availableWidth:s,minCellWidth:n(this.metricMinWidth,v.menuWidthXs)});if(d!==this.gridColumns)this.gridColumns=d}get rovingIndex(){return h(this.visibleMetrics,this.focusedMetricIndex)}selectMetric(e,r){if(e.isInactive)return;this.focusedMetricIndex=r;this.dsMetricSelect.emit(e)}moveFocus(e,r){const o=this.visibleMetrics;const i=u(o,e,r<0?-1:1);if(i<0)return;this.focusedMetricIndex=i;const s=this.el.querySelectorAll(".card-overview__metric-action");s[i]?.focus()}bar(e,r,o){return i("ds-skeleton",{class:o,variant:"text",textVariant:e,width:r,background:"always-dark"})}renderTrend(e,r,o=false,s){if(!e)return null;return i("ds-text",{as:"span",class:{"card-overview__trend":true,"ds-control-label-box":true,[`card-overview__trend--${e.tone}`]:true},variant:r,emphasis:o,color:s??_[e.tone],fontFeature:"tabular-nums"},e.direction==="up"?"↑":"↓"," ",e.value)}renderScore(){if(this.isLoading){return i("div",{class:"card-overview__score",part:"score"},i("div",{class:"card-overview__score-content"},i("div",{class:"card-overview__score-copy"},this.bar("text-body-small","64px","card-overview__score-label"),this.bar("text-body-medium","28px")),i("div",{class:"card-overview__score-figure"},this.bar("text-display-medium","56px"))))}const e=this.scoreErrorMessage||(!this.score?"Score unavailable":undefined);if(e){return i("div",{class:"card-overview__score",part:"score"},i("ds-text",{as:"span",class:"card-overview__score-content card-overview__score-content--error",variant:"text-body-medium",color:"inherit",role:"alert"},e))}const r=this.score;if(!r)return null;const o=r.level??w(r.value);return i("div",{class:"card-overview__score",part:"score"},i("div",{class:{"card-overview__score-content":true,[`card-overview__score-content--${o}`]:Boolean(o)}},i("div",{class:"card-overview__score-copy"},i("ds-text",{as:"span",class:"card-overview__score-label ds-control-label-box",variant:"text-body-small",color:"inherit"},r.label),this.renderTrend(r.trend,"text-body-medium",false,"inherit")),i("ds-text",{as:"span",class:"card-overview__score-value ds-control-label-box",variant:"text-display-medium",emphasis:true,color:"inherit",fontFeature:"tabular-nums"},r.value)))}renderMetric(e,r){const o=!e.isInactive;const s=i("ds-text",{as:"span",class:"card-overview__metric-label ds-control-label-box",variant:"text-body-small",color:y},e.label);return i("div",{class:"card-overview__metric",part:"metric"},i("div",{class:{"card-overview__metric-action":true,"card-overview__metric-action--inactive":!o,"ds-interaction-fill":o,"ds-interaction-fill--on-always-dark":o,"ds-focus-ring-inset":o},role:o?"button":undefined,tabIndex:o&&r===this.rovingIndex?0:-1,onClick:()=>this.selectMetric(e,r),onKeyDown:e=>this.handleMetricKeyDown(e,r),onFocusin:()=>{if(o)this.focusedMetricIndex=r}},i("div",{class:"ds-interaction-fill__content card-overview__metric-content"},e.labelTooltip?i("ds-tooltip",{label:e.labelTooltip,side:"top",size:"sm"},s):s,i("div",{class:"card-overview__metric-figure"},i("ds-text",{as:"span",class:"card-overview__metric-value ds-control-label-box",variant:"text-body-medium",color:x,fontFeature:"tabular-nums"},e.value),this.renderTrend(e.trend,"text-body-medium")))))}renderMetrics(){if(this.isLoading&&this.metrics.length===0){return[this.renderScore(),...Array.from({length:b},((e,r)=>i("div",{class:"card-overview__metric",key:`loading-${r}`},i("div",{class:"card-overview__metric-action card-overview__metric-action--inactive"},this.bar("text-body-small","70%","card-overview__metric-label"),i("div",{class:"card-overview__metric-figure"},this.bar("text-body-medium","36px"),this.bar("text-body-medium","40px"))))))]}return[this.renderScore(),...this.visibleMetrics.map(((e,r)=>this.renderMetric(e,r)))]}render(){const e=this.variant==="compact";const r=this.scrollCollapseGeometry;return i(s,{key:"9e765fe038158c8a4bb7e334d8ca4b1d813d3746",class:{"card-overview":true,"card-overview--compact":e,"card-overview--stacked":!e&&this.layout==="stacked","card-overview--scroll-collapsing":r.active},role:"region","aria-label":this.overviewLabel,"aria-busy":this.isLoading?"true":undefined,style:{"--ds-card-overview-metric-min":this.metricMinWidth,"--ds-card-overview-grid-columns":this.gridColumns?String(this.gridColumns):undefined,"--ds-card-overview-expanded-height":r.active?`${r.expandedHeight}px`:undefined,"--ds-card-overview-visible-height":r.active?`${r.visibleHeight}px`:undefined,"--ds-card-overview-content-offset":r.active?`${r.offset}px`:undefined}},i("div",{key:"0863dc58ca17dd114ebe286bb90c07bdc9d609d7",class:{"card-overview__surface":true,"ds-control-elevation":true,"ds-control-elevation--sm":!e,"ds-control-elevation--floating":e}},i("div",{key:"550133b7a9cea7ab29e64fe67af73a89eac13f69",class:"card-overview__clip"},i("div",{key:"1e8ac68d3a0abbc32cb519a4aa54fd0af682012d",ref:e=>{this.layoutEl=e??undefined},class:{"card-overview__layout":true}},i("div",{key:"189c3a97195394bff3ebcc1d4966540ab0202e2f",class:"card-overview__summary"},i("div",{key:"686f7c20be97f69587995400eb8d8764fdbc97d1",class:"card-overview__header ds-control--md"},this.isLoading?i("div",{class:"card-overview__period"},this.bar("text-body-medium","184px"),this.bar("text-body-medium","248px")):i("div",{class:"card-overview__period"},i("div",{class:"card-overview__period-current"},i("slot",{name:"period"},this.periodLabel&&i("div",{class:"card-overview__period-fixed ds-control-frame"},i("ds-text",{as:"span",class:"ds-control-label-box",variant:"text-body-medium",emphasis:true,color:x},this.periodLabel)))),this.comparisonLabel&&i("ds-text",{as:"span",class:"card-overview__period-comparison ds-control-label-box",variant:"text-body-medium",color:y},this.comparisonLabel)),i("div",{key:"310de6d4db9d6889bbb3a026294d9033ee6d76c5",class:"card-overview__filter"},this.isLoading?i("ds-skeleton",{variant:"control",controlSize:"md",width:"128px",background:"always-dark"}):i("slot",{name:"filter"})))),!e&&i("div",{key:"3c98bd773a0f6dceedf4021dfe38ab406a2e96d0",class:"card-overview__body"},i("div",{key:"554ca90baf363d473e8a3abc7cef49b2943b6033",class:"card-overview__metrics",part:"metrics"},this.renderMetrics()),i("slot",{key:"e8cd6ead498385c049b6d3fa02cf1bbe8baa5365",name:"footer"}))))))}get el(){return this}static get style(){return m()}},[262,"ds-card-overview",{variant:[1],layout:[1],score:[16],periodLabel:[1,"period-label"],comparisonLabel:[1,"comparison-label"],metrics:[16],metricMinWidth:[1,"metric-min-width"],isLoading:[4,"is-loading"],scoreErrorMessage:[1,"score-error-message"],overviewLabel:[1,"overview-label"],scrollCollapseProgress:[2,"scroll-collapse-progress"],focusedMetricIndex:[32],expandedHeight:[32],gridColumns:[32]}]);function z(){if(typeof customElements==="undefined"){return}const e=["ds-card-overview","ds-skeleton","ds-text","ds-tooltip"];e.forEach((e=>{switch(e){case"ds-card-overview":if(!customElements.get(c(e))){customElements.define(c(e),k)}break;case"ds-skeleton":if(!customElements.get(c(e))){d()}break;case"ds-text":if(!customElements.get(c(e))){t()}break;case"ds-tooltip":if(!customElements.get(c(e))){a()}break}}))}z();const M=k;const C=z;export{M as DsCardOverview,C as defineCustomElement};
 //# sourceMappingURL=ds-card-overview.js.map

package/dist/components/ds-card-setting.js

@@ -1,2 +1,2 @@
-import{p as s,H as e,c as d,h as t,a,t as i}from"./index.js";import{d as r}from"./p-IYy-jODg.js";import{d as c}from"./p-BFfHIu6y.js";import{d as n}from"./p-BR_oMaas.js";import{d as o}from"./p-BAfG3M8z.js";import{d as l}from"./p-Ca-I2UnB.js";import{d as m}from"./p-Bb4f5SuF.js";const g=()=>`.ds-chrome-space--sm.sc-ds-card-setting-h,.ds-chrome-space--sm.sc-ds-card-setting{--ds-chrome-padding:var(--dimension-space-050);--ds-chrome-gap:var(--dimension-space-050)}.ds-chrome-space--md.sc-ds-card-setting-h,.ds-chrome-space--md.sc-ds-card-setting{--ds-chrome-padding:var(--dimension-space-100);--ds-chrome-gap:var(--dimension-space-100)}.ds-chrome-space--lg.sc-ds-card-setting-h,.ds-chrome-space--lg.sc-ds-card-setting{--ds-chrome-padding:var(--dimension-space-200);--ds-chrome-gap:var(--dimension-space-200)}.ds-chrome-row.sc-ds-card-setting-h,.ds-chrome-row.sc-ds-card-setting,.ds-chrome-column.sc-ds-card-setting-h,.ds-chrome-column.sc-ds-card-setting,.ds-chrome-grid.sc-ds-card-setting-h,.ds-chrome-grid.sc-ds-card-setting{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-card-setting-h,.ds-chrome-row.sc-ds-card-setting{flex-direction:row;align-items:center}.ds-chrome-column.sc-ds-card-setting-h,.ds-chrome-column.sc-ds-card-setting{flex-direction:column}.ds-chrome-grid.sc-ds-card-setting-h,.ds-chrome-grid.sc-ds-card-setting{display:grid;align-items:center}.sc-ds-card-setting-h{display:flex;flex-direction:column;box-sizing:border-box;width:var(--_card-setting-width);min-height:var(--_card-setting-min-height);max-width:100%;overflow:hidden;background-color:var(--color-background-primary);border:none;border-radius:var(--dimension-radius-025);box-shadow:0 0 0 var(--dimension-stroke-width-012) var(--color-border-tertiary)}.card-setting--editing.sc-ds-card-setting-h{background-color:var(--color-background-bold-brand);box-shadow:0 0 0 var(--dimension-stroke-width-025) var(--color-border-bold-brand)}.card-setting__header.sc-ds-card-setting{justify-content:space-between;height:var(--dimension-size-600);flex:0 0 auto;background-color:var(--color-background-secondary);border-bottom:var(--dimension-stroke-width-012) solid var(--color-border-tertiary)}.card-setting--editing.sc-ds-card-setting-h .card-setting__header.sc-ds-card-setting{background-color:transparent;border-bottom-color:transparent}ds-text.card-setting__title.sc-ds-card-setting{display:flex;flex:1 1 auto;align-items:center;min-width:0;padding:calc(var(--dimension-space-075) + var(--dimension-space-025));box-sizing:border-box;-webkit-user-select:none;user-select:none}.card-setting__actions.sc-ds-card-setting{display:flex;flex-shrink:0;align-items:center;gap:var(--dimension-space-100)}.card-setting__body.sc-ds-card-setting{display:flex;flex:1 1 auto;flex-direction:column;min-height:0;box-sizing:border-box;background-color:var(--color-background-primary);border-radius:0 0 var(--dimension-radius-025) var(--dimension-radius-025)}.card-setting--editing.sc-ds-card-setting-h .card-setting__body.sc-ds-card-setting{border-radius:var(--dimension-radius-025)}`;const h={sm:"var(--dimension-card-width-sm)",md:"var(--dimension-card-width-md)",lg:"var(--dimension-card-width-lg)"};const b={sm:"var(--dimension-card-height-sm)",md:"var(--dimension-card-height-md)",lg:"var(--dimension-card-height-lg)"};const f="var(--color-foreground-faint-brand)";const u=s(class s extends e{constructor(s){super();if(s!==false){this.__registerHost()}this.dsAction=d(this,"dsAction");this.cardWidth="md";this.editing=false;this.editLabel="Edit";this.cancelLabel="Cancel";this.saveLabel="Save"}emitAction(s,e){this.dsAction.emit({action:s,originalEvent:e})}render(){const s=this.editing;return t(a,{key:"350f5c23f14cefc61416a405654b458592330a13",class:{"card-setting":true,"card-setting--editing":s},style:{"--_card-setting-width":h[this.cardWidth],"--_card-setting-min-height":b[this.cardWidth]}},t("header",{key:"4519408151de57147a8e2591a9ad7a6da0eed7da",class:"card-setting__header ds-chrome-row ds-chrome-space--md"},t("ds-text",{key:"ecda5a9fd573a6e2bd432fb6b144fa220cffceba",class:"card-setting__title",variant:"text-title-small",emphasis:true,color:s?f:"primary",as:"h2"},this.heading),t("div",{key:"ec2fc8d5dd55f8a72418a1097c9eebe3bb60da93",class:"card-setting__actions"},!s?t("ds-button-unfilled",{variant:"icon",type:"button",icon:"Pencil","aria-label":this.editLabel,onDsClick:s=>this.emitAction("edit",s.detail)}):[t("ds-button-unfilled",{key:"cancel",variant:"icon",type:"button",icon:"Cross",background:"bold","aria-label":this.cancelLabel,onDsClick:s=>this.emitAction("cancel",s.detail)}),t("ds-button-filled",{key:"save",variant:"icon",type:"button",icon:"Check",intent:"brand",contrast:"faint","aria-label":this.saveLabel,onDsClick:s=>this.emitAction("save",s.detail)})])),t("div",{key:"d77bf8480f6818e8f8a8d3f7b2b51dfd4f57a4a6",class:"card-setting__body"},t("slot",{key:"e8f442d4d483f27dc87265d2a38e885a025b7e98"})))}static get style(){return g()}},[262,"ds-card-setting",{heading:[1],cardWidth:[1,"card-width"],editing:[4],editLabel:[1,"edit-label"],cancelLabel:[1,"cancel-label"],saveLabel:[1,"save-label"]}]);function p(){if(typeof customElements==="undefined"){return}const s=["ds-card-setting","ds-badge","ds-button-filled","ds-button-unfilled","ds-icon","ds-loader","ds-text"];s.forEach((s=>{switch(s){case"ds-card-setting":if(!customElements.get(i(s))){customElements.define(i(s),u)}break;case"ds-badge":if(!customElements.get(i(s))){r()}break;case"ds-button-filled":if(!customElements.get(i(s))){c()}break;case"ds-button-unfilled":if(!customElements.get(i(s))){n()}break;case"ds-icon":if(!customElements.get(i(s))){o()}break;case"ds-loader":if(!customElements.get(i(s))){l()}break;case"ds-text":if(!customElements.get(i(s))){m()}break}}))}p();const v=u;const k=p;export{v as DsCardSetting,k as defineCustomElement};
+import{p as s,H as e,c as d,h as t,a as i,t as r}from"./index.js";import{d as a}from"./p-1Zbh1MRy.js";import{d as c}from"./p-DQ94PkZA.js";import{d as n}from"./p-D3UKwTEo.js";import{d as o}from"./p-BAfG3M8z.js";import{d as l}from"./p-Ca-I2UnB.js";import{d as m}from"./p-jf1zCsuw.js";const g=()=>`.ds-chrome-space--sm.sc-ds-card-setting-h,.ds-chrome-space--sm.sc-ds-card-setting{--ds-chrome-padding:var(--dimension-space-050);--ds-chrome-gap:var(--dimension-space-050)}.ds-chrome-space--md.sc-ds-card-setting-h,.ds-chrome-space--md.sc-ds-card-setting{--ds-chrome-padding:var(--dimension-space-100);--ds-chrome-gap:var(--dimension-space-100)}.ds-chrome-space--lg.sc-ds-card-setting-h,.ds-chrome-space--lg.sc-ds-card-setting{--ds-chrome-padding:var(--dimension-space-200);--ds-chrome-gap:var(--dimension-space-200)}.ds-chrome-row.sc-ds-card-setting-h,.ds-chrome-row.sc-ds-card-setting,.ds-chrome-column.sc-ds-card-setting-h,.ds-chrome-column.sc-ds-card-setting,.ds-chrome-grid.sc-ds-card-setting-h,.ds-chrome-grid.sc-ds-card-setting{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-card-setting-h,.ds-chrome-row.sc-ds-card-setting{flex-direction:row;align-items:center}.ds-chrome-column.sc-ds-card-setting-h,.ds-chrome-column.sc-ds-card-setting{flex-direction:column}.ds-chrome-grid.sc-ds-card-setting-h,.ds-chrome-grid.sc-ds-card-setting{display:grid;align-items:center}.sc-ds-card-setting-h{display:flex;flex-direction:column;box-sizing:border-box;width:var(--_card-setting-width);min-height:var(--_card-setting-min-height);max-width:100%;overflow:hidden;background-color:var(--color-background-primary);border:none;border-radius:var(--dimension-radius-025);box-shadow:0 0 0 var(--dimension-stroke-width-012) var(--color-border-tertiary)}.card-setting--editing.sc-ds-card-setting-h{background-color:var(--color-background-bold-brand);box-shadow:0 0 0 var(--dimension-stroke-width-025) var(--color-border-bold-brand)}.card-setting__header.sc-ds-card-setting{justify-content:space-between;height:var(--dimension-size-600);flex:0 0 auto;background-color:var(--color-background-secondary);border-bottom:var(--dimension-stroke-width-012) solid var(--color-border-tertiary)}.card-setting--editing.sc-ds-card-setting-h .card-setting__header.sc-ds-card-setting{background-color:transparent;border-bottom-color:transparent}ds-text.card-setting__title.sc-ds-card-setting{display:flex;flex:1 1 auto;align-items:center;min-width:0;padding:calc(var(--dimension-space-075) + var(--dimension-space-025));box-sizing:border-box;-webkit-user-select:none;user-select:none}.card-setting__actions.sc-ds-card-setting{display:flex;flex-shrink:0;align-items:center;gap:var(--dimension-space-100)}.card-setting__body.sc-ds-card-setting{display:flex;flex:1 1 auto;flex-direction:column;min-height:0;box-sizing:border-box;background-color:var(--color-background-primary);border-radius:0 0 var(--dimension-radius-025) var(--dimension-radius-025)}.card-setting--editing.sc-ds-card-setting-h .card-setting__body.sc-ds-card-setting{border-radius:var(--dimension-radius-025)}`;const h={sm:"var(--dimension-card-width-sm)",md:"var(--dimension-card-width-md)",lg:"var(--dimension-card-width-lg)"};const b={sm:"var(--dimension-card-height-sm)",md:"var(--dimension-card-height-md)",lg:"var(--dimension-card-height-lg)"};const u="var(--color-foreground-faint-brand)";const p=s(class s extends e{constructor(s){super();if(s!==false){this.__registerHost()}this.dsAction=d(this,"dsAction");this.cardWidth="md";this.editing=false;this.editLabel="Edit";this.cancelLabel="Cancel";this.saveLabel="Save"}emitAction(s,e){this.dsAction.emit({action:s,originalEvent:e})}render(){const s=this.editing;return t(i,{key:"a688541841664f1a00c09e1da030b154be044833",class:{"card-setting":true,"card-setting--editing":s},style:{"--_card-setting-width":h[this.cardWidth],"--_card-setting-min-height":b[this.cardWidth]}},t("header",{key:"0ebbdc80c4d837dfb7e2949e7114e8d4a44a8e4c",class:"card-setting__header ds-chrome-row ds-chrome-space--md"},t("ds-text",{key:"0082d032d2bc54d73b8e06b13075710dfccb5e4e",class:"card-setting__title",variant:"text-title-small",emphasis:true,color:s?u:"primary",as:"h2"},this.heading),t("div",{key:"f50d438bafd9b4244c3880a62c3f6a0e5f7034c3",class:"card-setting__actions"},!s?t("ds-button-unfilled",{variant:"icon",type:"button",icon:"Pencil","aria-label":this.editLabel,onDsClick:s=>this.emitAction("edit",s.detail)}):[t("ds-button-unfilled",{key:"cancel",variant:"icon",type:"button",icon:"Cross",background:"bold","aria-label":this.cancelLabel,onDsClick:s=>this.emitAction("cancel",s.detail)}),t("ds-button-filled",{key:"save",variant:"icon",type:"button",icon:"Check",intent:"brand",contrast:"faint","aria-label":this.saveLabel,onDsClick:s=>this.emitAction("save",s.detail)})])),t("div",{key:"eb9aaf8e49beb0be74d54adb7b373833b82e7aaf",class:"card-setting__body"},t("slot",{key:"03264b8d83a7140af7b3a6837863ad469cde343b"})))}static get style(){return g()}},[262,"ds-card-setting",{heading:[1],cardWidth:[1,"card-width"],editing:[4],editLabel:[1,"edit-label"],cancelLabel:[1,"cancel-label"],saveLabel:[1,"save-label"]}]);function f(){if(typeof customElements==="undefined"){return}const s=["ds-card-setting","ds-badge","ds-button-filled","ds-button-unfilled","ds-icon","ds-loader","ds-text"];s.forEach((s=>{switch(s){case"ds-card-setting":if(!customElements.get(r(s))){customElements.define(r(s),p)}break;case"ds-badge":if(!customElements.get(r(s))){a()}break;case"ds-button-filled":if(!customElements.get(r(s))){c()}break;case"ds-button-unfilled":if(!customElements.get(r(s))){n()}break;case"ds-icon":if(!customElements.get(r(s))){o()}break;case"ds-loader":if(!customElements.get(r(s))){l()}break;case"ds-text":if(!customElements.get(r(s))){m()}break}}))}f();const v=p;const k=f;export{v as DsCardSetting,k as defineCustomElement};
 //# sourceMappingURL=ds-card-setting.js.map

package/dist/components/ds-card-setting.js.map

@@ -1 +1 @@
-{"version":3,"names":["cardSettingCss","CARD_WIDTH_VARS","sm","md","lg","CARD_HEIGHT_VARS","FAINT_BRAND_TITLE_COLOR","CardSetting","__stencil_proxyCustomElement","HTMLElement","constructor","registerHost","this","cardWidth","editing","editLabel","cancelLabel","saveLabel","emitAction","action","originalEvent","dsAction","emit","render","h","Host","key","class","style","variant","emphasis","color","as","heading","type","icon","onDsClick","event","detail","background","intent","contrast"],"sources":["src/wc/components/CardSetting/CardSetting.css?tag=ds-card-setting&encapsulation=scoped","src/wc/components/CardSetting/CardSetting.tsx"],"sourcesContent":["@import '../../utils/chrome-layout.css';\n\n:host {\n  display: flex;\n  flex-direction: column;\n  box-sizing: border-box;\n  width: var(--_card-setting-width);\n  min-height: var(--_card-setting-min-height);\n  max-width: 100%;\n  overflow: hidden;\n  background-color: var(--color-background-primary);\n  border: none;\n  border-radius: var(--dimension-radius-025);\n  box-shadow: 0 0 0 var(--dimension-stroke-width-012) var(--color-border-tertiary);\n}\n\n:host(.card-setting--editing) {\n  background-color: var(--color-background-bold-brand);\n  box-shadow: 0 0 0 var(--dimension-stroke-width-025) var(--color-border-bold-brand);\n}\n\n.card-setting__header {\n  justify-content: space-between;\n  height: var(--dimension-size-600);\n  flex: 0 0 auto;\n  background-color: var(--color-background-secondary);\n  border-bottom: var(--dimension-stroke-width-012) solid var(--color-border-tertiary);\n}\n\n:host(.card-setting--editing) .card-setting__header {\n  background-color: transparent;\n  border-bottom-color: transparent;\n}\n\nds-text.card-setting__title {\n  display: flex;\n  flex: 1 1 auto;\n  align-items: center;\n  min-width: 0;\n  padding: calc(var(--dimension-space-075) + var(--dimension-space-025));\n  box-sizing: border-box;\n  -webkit-user-select: none;\n  user-select: none;\n}\n\n.card-setting__actions {\n  display: flex;\n  flex-shrink: 0;\n  align-items: center;\n  gap: var(--dimension-space-100);\n}\n\n.card-setting__body {\n  display: flex;\n  flex: 1 1 auto;\n  flex-direction: column;\n  min-height: 0;\n  box-sizing: border-box;\n  background-color: var(--color-background-primary);\n  border-radius: 0 0 var(--dimension-radius-025) var(--dimension-radius-025);\n}\n\n:host(.card-setting--editing) .card-setting__body {\n  border-radius: var(--dimension-radius-025);\n}\n","import { Component, Event, EventEmitter, h, Host, Prop } from '@stencil/core';\n\nexport type CardSettingWidth = 'sm' | 'md' | 'lg';\nexport type CardSettingAction = 'edit' | 'save' | 'cancel';\n\nexport interface CardSettingActionDetail {\n  action: CardSettingAction;\n  originalEvent: MouseEvent;\n}\n\nconst CARD_WIDTH_VARS: Record<CardSettingWidth, string> = {\n  sm: 'var(--dimension-card-width-sm)',\n  md: 'var(--dimension-card-width-md)',\n  lg: 'var(--dimension-card-width-lg)',\n};\n\nconst CARD_HEIGHT_VARS: Record<CardSettingWidth, string> = {\n  sm: 'var(--dimension-card-height-sm)',\n  md: 'var(--dimension-card-height-md)',\n  lg: 'var(--dimension-card-height-lg)',\n};\n\nconst FAINT_BRAND_TITLE_COLOR = 'var(--color-foreground-faint-brand)';\n\n@Component({\n  tag: 'ds-card-setting',\n  styleUrl: 'CardSetting.css',\n  scoped: true,\n})\nexport class CardSetting {\n  /** Section heading shown in the card header. */\n  @Prop() heading!: string;\n\n  /**\n   * Card width token (`sm` / `md` / `lg`). Also sets host `min-height` to the\n   * matching `--dimension-card-height-*` so the body fills available space\n   * even when the slot is empty.\n   */\n  @Prop() cardWidth: CardSettingWidth = 'md';\n\n  /** Controlled edit state — parent owns single-edit orchestration. */\n  @Prop() editing = false;\n  @Prop() editLabel: string = 'Edit';\n  @Prop() cancelLabel: string = 'Cancel';\n  @Prop() saveLabel: string = 'Save';\n\n  /** Emits a controlled edit, save, or cancel request. */\n  @Event() dsAction!: EventEmitter<CardSettingActionDetail>;\n\n  private emitAction(action: CardSettingAction, originalEvent: MouseEvent) {\n    this.dsAction.emit({ action, originalEvent });\n  }\n\n  render() {\n    const editing = this.editing;\n\n    return (\n      <Host\n        class={{\n          'card-setting': true,\n          'card-setting--editing': editing,\n        }}\n        style={{\n          '--_card-setting-width': CARD_WIDTH_VARS[this.cardWidth],\n          '--_card-setting-min-height': CARD_HEIGHT_VARS[this.cardWidth],\n        }}\n      >\n        <header class=\"card-setting__header ds-chrome-row ds-chrome-space--md\">\n          <ds-text\n            class=\"card-setting__title\"\n            variant=\"text-title-small\"\n            emphasis\n            color={editing ? FAINT_BRAND_TITLE_COLOR : 'primary'}\n            as=\"h2\"\n          >\n            {this.heading}\n          </ds-text>\n          <div class=\"card-setting__actions\">\n          {!editing ? (\n            <ds-button-unfilled\n              variant=\"icon\"\n              type=\"button\"\n              icon=\"Pencil\"\n              aria-label={this.editLabel}\n              onDsClick={(event: CustomEvent<MouseEvent>) =>\n                this.emitAction('edit', event.detail)\n              }\n            />\n          ) : (\n            [\n              <ds-button-unfilled\n                key=\"cancel\"\n                variant=\"icon\"\n                type=\"button\"\n                icon=\"Cross\"\n                background=\"bold\"\n                aria-label={this.cancelLabel}\n                onDsClick={(event: CustomEvent<MouseEvent>) =>\n                  this.emitAction('cancel', event.detail)\n                }\n              />,\n              <ds-button-filled\n                key=\"save\"\n                variant=\"icon\"\n                type=\"button\"\n                icon=\"Check\"\n                intent=\"brand\"\n                contrast=\"faint\"\n                aria-label={this.saveLabel}\n                onDsClick={(event: CustomEvent<MouseEvent>) =>\n                  this.emitAction('save', event.detail)\n                }\n              />,\n            ]\n          )}\n          </div>\n        </header>\n        <div class=\"card-setting__body\">\n          <slot />\n        </div>\n      </Host>\n    );\n  }\n}\n"],"mappings":"qRAAA,MAAMA,EAAiB,IAAM,szFCU7B,MAAMC,EAAoD,CACxDC,GAAI,iCACJC,GAAI,iCACJC,GAAI,kCAGN,MAAMC,EAAqD,CACzDH,GAAI,kCACJC,GAAI,kCACJC,GAAI,mCAGN,MAAME,EAA0B,sC,MAOnBC,EAAWC,EAAA,MAAAD,UAAAE,EALxB,WAAAC,CAAAC,G,6EAcUC,KAAAC,UAA8B,KAG9BD,KAAAE,QAAU,MACVF,KAAAG,UAAoB,OACpBH,KAAAI,YAAsB,SACtBJ,KAAAK,UAAoB,MA+E7B,CA1ES,UAAAC,CAAWC,EAA2BC,GAC5CR,KAAKS,SAASC,KAAK,CAAEH,SAAQC,iB,CAG/B,MAAAG,GACE,MAAMT,EAAUF,KAAKE,QAErB,OACEU,EAACC,EAAI,CAAAC,IAAA,2CACHC,MAAO,CACL,eAAgB,KAChB,wBAAyBb,GAE3Bc,MAAO,CACL,wBAAyB3B,EAAgBW,KAAKC,WAC9C,6BAA8BR,EAAiBO,KAAKC,aAGtDW,EAAA,UAAAE,IAAA,2CAAQC,MAAM,0DACZH,EAAA,WAAAE,IAAA,2CACEC,MAAM,sBACNE,QAAQ,mBACRC,SAAQ,KACRC,MAAOjB,EAAUR,EAA0B,UAC3C0B,GAAG,MAEFpB,KAAKqB,SAERT,EAAA,OAAAE,IAAA,2CAAKC,MAAM,0BACTb,EACAU,EAAA,sBACEK,QAAQ,OACRK,KAAK,SACLC,KAAK,SAAQ,aACDvB,KAAKG,UACjBqB,UAAYC,GACVzB,KAAKM,WAAW,OAAQmB,EAAMC,UAEhC,CAGAd,EAAA,sBACEE,IAAI,SACJG,QAAQ,OACRK,KAAK,SACLC,KAAK,QACLI,WAAW,OAAM,aACL3B,KAAKI,YACjBoB,UAAYC,GACVzB,KAAKM,WAAW,SAAUmB,EAAMC,UAGpCd,EAAA,oBACEE,IAAI,OACJG,QAAQ,OACRK,KAAK,SACLC,KAAK,QACLK,OAAO,QACPC,SAAS,QAAO,aACJ7B,KAAKK,UACjBmB,UAAYC,GACVzB,KAAKM,WAAW,OAAQmB,EAAMC,aAOxCd,EAAA,OAAAE,IAAA,2CAAKC,MAAM,sBACTH,EAAA,QAAAE,IAAA,8C","ignoreList":[]}
+{"version":3,"names":["cardSettingCss","CARD_WIDTH_VARS","sm","md","lg","CARD_HEIGHT_VARS","FAINT_BRAND_TITLE_COLOR","CardSetting","__stencil_proxyCustomElement","HTMLElement","constructor","registerHost","this","cardWidth","editing","editLabel","cancelLabel","saveLabel","emitAction","action","originalEvent","dsAction","emit","render","h","Host","key","class","style","variant","emphasis","color","as","heading","type","icon","onDsClick","event","detail","background","intent","contrast"],"sources":["src/wc/components/CardSetting/CardSetting.css?tag=ds-card-setting&encapsulation=scoped","src/wc/components/CardSetting/CardSetting.tsx"],"sourcesContent":["@import '../../utils/chrome-layout.css';\n\n:host {\n  display: flex;\n  flex-direction: column;\n  box-sizing: border-box;\n  width: var(--_card-setting-width);\n  min-height: var(--_card-setting-min-height);\n  max-width: 100%;\n  overflow: hidden;\n  background-color: var(--color-background-primary);\n  border: none;\n  border-radius: var(--dimension-radius-025);\n  box-shadow: 0 0 0 var(--dimension-stroke-width-012) var(--color-border-tertiary);\n}\n\n:host(.card-setting--editing) {\n  background-color: var(--color-background-bold-brand);\n  box-shadow: 0 0 0 var(--dimension-stroke-width-025) var(--color-border-bold-brand);\n}\n\n.card-setting__header {\n  justify-content: space-between;\n  height: var(--dimension-size-600);\n  flex: 0 0 auto;\n  background-color: var(--color-background-secondary);\n  border-bottom: var(--dimension-stroke-width-012) solid var(--color-border-tertiary);\n}\n\n:host(.card-setting--editing) .card-setting__header {\n  background-color: transparent;\n  border-bottom-color: transparent;\n}\n\nds-text.card-setting__title {\n  display: flex;\n  flex: 1 1 auto;\n  align-items: center;\n  min-width: 0;\n  padding: calc(var(--dimension-space-075) + var(--dimension-space-025));\n  box-sizing: border-box;\n  -webkit-user-select: none;\n  user-select: none;\n}\n\n.card-setting__actions {\n  display: flex;\n  flex-shrink: 0;\n  align-items: center;\n  gap: var(--dimension-space-100);\n}\n\n.card-setting__body {\n  display: flex;\n  flex: 1 1 auto;\n  flex-direction: column;\n  min-height: 0;\n  box-sizing: border-box;\n  background-color: var(--color-background-primary);\n  border-radius: 0 0 var(--dimension-radius-025) var(--dimension-radius-025);\n}\n\n:host(.card-setting--editing) .card-setting__body {\n  border-radius: var(--dimension-radius-025);\n}\n","import { Component, Event, EventEmitter, h, Host, Prop } from '@stencil/core';\n\nexport type CardSettingWidth = 'sm' | 'md' | 'lg';\nexport type CardSettingAction = 'edit' | 'save' | 'cancel';\n\nexport interface CardSettingActionDetail {\n  action: CardSettingAction;\n  originalEvent: MouseEvent;\n}\n\nconst CARD_WIDTH_VARS: Record<CardSettingWidth, string> = {\n  sm: 'var(--dimension-card-width-sm)',\n  md: 'var(--dimension-card-width-md)',\n  lg: 'var(--dimension-card-width-lg)',\n};\n\nconst CARD_HEIGHT_VARS: Record<CardSettingWidth, string> = {\n  sm: 'var(--dimension-card-height-sm)',\n  md: 'var(--dimension-card-height-md)',\n  lg: 'var(--dimension-card-height-lg)',\n};\n\nconst FAINT_BRAND_TITLE_COLOR = 'var(--color-foreground-faint-brand)';\n\n@Component({\n  tag: 'ds-card-setting',\n  styleUrl: 'CardSetting.css',\n  scoped: true,\n})\nexport class CardSetting {\n  /** Section heading shown in the card header. */\n  @Prop() heading!: string;\n\n  /**\n   * Card width token (`sm` / `md` / `lg`). Also sets host `min-height` to the\n   * matching `--dimension-card-height-*` so the body fills available space\n   * even when the slot is empty.\n   */\n  @Prop() cardWidth: CardSettingWidth = 'md';\n\n  /** Controlled edit state — parent owns single-edit orchestration. */\n  @Prop() editing = false;\n  @Prop() editLabel: string = 'Edit';\n  @Prop() cancelLabel: string = 'Cancel';\n  @Prop() saveLabel: string = 'Save';\n\n  /** Emits a controlled edit, save, or cancel request. */\n  @Event() dsAction!: EventEmitter<CardSettingActionDetail>;\n\n  private emitAction(action: CardSettingAction, originalEvent: MouseEvent) {\n    this.dsAction.emit({ action, originalEvent });\n  }\n\n  render() {\n    const editing = this.editing;\n\n    return (\n      <Host\n        class={{\n          'card-setting': true,\n          'card-setting--editing': editing,\n        }}\n        style={{\n          '--_card-setting-width': CARD_WIDTH_VARS[this.cardWidth],\n          '--_card-setting-min-height': CARD_HEIGHT_VARS[this.cardWidth],\n        }}\n      >\n        <header class=\"card-setting__header ds-chrome-row ds-chrome-space--md\">\n          <ds-text\n            class=\"card-setting__title\"\n            variant=\"text-title-small\"\n            emphasis\n            color={editing ? FAINT_BRAND_TITLE_COLOR : 'primary'}\n            as=\"h2\"\n          >\n            {this.heading}\n          </ds-text>\n          <div class=\"card-setting__actions\">\n          {!editing ? (\n            <ds-button-unfilled\n              variant=\"icon\"\n              type=\"button\"\n              icon=\"Pencil\"\n              aria-label={this.editLabel}\n              onDsClick={(event: CustomEvent<MouseEvent>) =>\n                this.emitAction('edit', event.detail)\n              }\n            />\n          ) : (\n            [\n              <ds-button-unfilled\n                key=\"cancel\"\n                variant=\"icon\"\n                type=\"button\"\n                icon=\"Cross\"\n                background=\"bold\"\n                aria-label={this.cancelLabel}\n                onDsClick={(event: CustomEvent<MouseEvent>) =>\n                  this.emitAction('cancel', event.detail)\n                }\n              />,\n              <ds-button-filled\n                key=\"save\"\n                variant=\"icon\"\n                type=\"button\"\n                icon=\"Check\"\n                intent=\"brand\"\n                contrast=\"faint\"\n                aria-label={this.saveLabel}\n                onDsClick={(event: CustomEvent<MouseEvent>) =>\n                  this.emitAction('save', event.detail)\n                }\n              />,\n            ]\n          )}\n          </div>\n        </header>\n        <div class=\"card-setting__body\">\n          <slot />\n        </div>\n      </Host>\n    );\n  }\n}\n"],"mappings":"0RAAA,MAAMA,EAAiB,IAAM,szFCU7B,MAAMC,EAAoD,CACxDC,GAAI,iCACJC,GAAI,iCACJC,GAAI,kCAGN,MAAMC,EAAqD,CACzDH,GAAI,kCACJC,GAAI,kCACJC,GAAI,mCAGN,MAAME,EAA0B,sC,MAOnBC,EAAWC,EAAA,MAAAD,UAAAE,EALxB,WAAAC,CAAAC,G,6EAcUC,KAAAC,UAA8B,KAG9BD,KAAAE,QAAU,MACVF,KAAAG,UAAoB,OACpBH,KAAAI,YAAsB,SACtBJ,KAAAK,UAAoB,MA+E7B,CA1ES,UAAAC,CAAWC,EAA2BC,GAC5CR,KAAKS,SAASC,KAAK,CAAEH,SAAQC,iB,CAG/B,MAAAG,GACE,MAAMT,EAAUF,KAAKE,QAErB,OACEU,EAACC,EAAI,CAAAC,IAAA,2CACHC,MAAO,CACL,eAAgB,KAChB,wBAAyBb,GAE3Bc,MAAO,CACL,wBAAyB3B,EAAgBW,KAAKC,WAC9C,6BAA8BR,EAAiBO,KAAKC,aAGtDW,EAAA,UAAAE,IAAA,2CAAQC,MAAM,0DACZH,EAAA,WAAAE,IAAA,2CACEC,MAAM,sBACNE,QAAQ,mBACRC,SAAQ,KACRC,MAAOjB,EAAUR,EAA0B,UAC3C0B,GAAG,MAEFpB,KAAKqB,SAERT,EAAA,OAAAE,IAAA,2CAAKC,MAAM,0BACTb,EACAU,EAAA,sBACEK,QAAQ,OACRK,KAAK,SACLC,KAAK,SAAQ,aACDvB,KAAKG,UACjBqB,UAAYC,GACVzB,KAAKM,WAAW,OAAQmB,EAAMC,UAEhC,CAGAd,EAAA,sBACEE,IAAI,SACJG,QAAQ,OACRK,KAAK,SACLC,KAAK,QACLI,WAAW,OAAM,aACL3B,KAAKI,YACjBoB,UAAYC,GACVzB,KAAKM,WAAW,SAAUmB,EAAMC,UAGpCd,EAAA,oBACEE,IAAI,OACJG,QAAQ,OACRK,KAAK,SACLC,KAAK,QACLK,OAAO,QACPC,SAAS,QAAO,aACJ7B,KAAKK,UACjBmB,UAAYC,GACVzB,KAAKM,WAAW,OAAQmB,EAAMC,aAOxCd,EAAA,OAAAE,IAAA,2CAAKC,MAAM,sBACTH,EAAA,QAAAE,IAAA,8C","ignoreList":[]}

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

@@ -1,2 +1,2 @@
-import{p as e,H as n,c as t,h as s,a as r,t as i}from"./index.js";import{c as o}from"./p-CMv_7vFs.js";import{d as c}from"./p-Bb4f5SuF.js";import{r as d}from"./p-C-vRkDyn.js";import{f as a}from"./p-DXewjzkM.js";import{f as l}from"./p-BBpASejH.js";const h=()=>`.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:relative;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-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 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.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);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 g=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 s(r,{key:"642fbb1af61d424497d6c002f340183fa81417ce",class:{"chart-legend":true,[`chart-legend--${this.direction}`]:true,"chart-legend--show-percentage":this.showPercentage}},s("ul",{key:"4aa9d192532379a7a02dfb6055824f173ee1bcfb",class:"chart-legend__list",onMouseLeave:this.highlightOnHover?()=>this.handleHover(null):undefined},this.items.map(((t,r)=>{const i=n!=null&&t.label!==n;const c=d(t.href);const h=c?"a":"div";const g=t.value!=null?a(e?t.value/e:0,this.percentageDecimals,this.locale):"";return s("li",{class:"chart-legend__list-item",key:t.label},s(h,{class:{"chart-legend__item":true,"chart-legend__item--interactive":!!c,"chart-legend__item--dimmed":i,"ds-control--md":true,"ds-interaction-fill":this.highlightOnHover||!!c,"ds-focus-ring-inset":!!c},href:c,onClick:c?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},s("span",{class:"chart-legend__swatch-box"},s("span",{class:"chart-legend__swatch",style:{backgroundColor:t.color??o(r)}})),s("ds-text",{class:"chart-legend__label",as:"span",variant:"text-body-medium",color:"secondary",lineTruncation:1,title:t.label},t.label),t.value!=null&&s("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&&s("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 h()}},[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(i(e))){customElements.define(i(e),g)}break;case"ds-text":if(!customElements.get(i(e))){c()}break}}))}f();const v=g;const u=f;export{v as DsChartLegend,u as defineCustomElement};
+import{p as e,H as n,c as t,h as s,a as r,t as i}from"./index.js";import{c as o}from"./p-CMv_7vFs.js";import{d as c}from"./p-jf1zCsuw.js";import{r as d}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 s=Math.abs(e);if(s<1e3)return String(e);for(let e=0;e<a.length;e++){const n=a[e];if(s<n.threshold)continue;let r=Math.round(s/n.threshold*10)/10;if(r>=1e3&&e>0){const n=a[e-1];r=Math.round(s/n.threshold*10)/10;return`${t}${r}${n.suffix}`}return`${t}${r}${n.suffix}`}return String(e)}function h(e,n=1,t){const s=n===2?2:1;const r=Number.isFinite(e)?e:0;return new Intl.NumberFormat(t,{style:"percent",minimumFractionDigits:s,maximumFractionDigits:s}).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:relative;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-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 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.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);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 f=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 s(r,{key:"9033cd0ce71688b270ec4f971982f09ba6ae4a7f",class:{"chart-legend":true,[`chart-legend--${this.direction}`]:true,"chart-legend--show-percentage":this.showPercentage}},s("ul",{key:"4a5cdda74d416835cf260f2a80183110f30bcaa1",class:"chart-legend__list",onMouseLeave:this.highlightOnHover?()=>this.handleHover(null):undefined},this.items.map(((t,r)=>{const i=n!=null&&t.label!==n;const c=d(t.href);const a=c?"a":"div";const g=t.value!=null?h(e?t.value/e:0,this.percentageDecimals,this.locale):"";return s("li",{class:"chart-legend__list-item",key:t.label},s(a,{class:{"chart-legend__item":true,"chart-legend__item--interactive":!!c,"chart-legend__item--dimmed":i,"ds-control--md":true,"ds-interaction-fill":this.highlightOnHover||!!c,"ds-focus-ring-inset":!!c},href:c,onClick:c?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},s("span",{class:"chart-legend__swatch-box"},s("span",{class:"chart-legend__swatch",style:{backgroundColor:t.color??o(r)}})),s("ds-text",{class:"chart-legend__label",as:"span",variant:"text-body-medium",color:"secondary",lineTruncation:1,title:t.label},t.label),t.value!=null&&s("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&&s("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 v(){if(typeof customElements==="undefined"){return}const e=["ds-chart-legend","ds-text"];e.forEach((e=>{switch(e){case"ds-chart-legend":if(!customElements.get(i(e))){customElements.define(i(e),f)}break;case"ds-text":if(!customElements.get(i(e))){c()}break}}))}v();const u=f;const m=v;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":["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","value","highlightLabel","h","Host","key","class","onMouseLeave","undefined","map","i","isDimmed","href","resolveSafeUrl","RowTag","percentage","formatPercentage","locale","onClick","e","onMouseEnter","onFocus","onBlur","style","backgroundColor","color","categoryColor","as","variant","lineTruncation","title","align","fontFeature","String","formatCompactNumber"],"sources":["src/wc/components/ChartLegend/ChartLegend.css?tag=ds-chart-legend&encapsulation=scoped","src/wc/components/ChartLegend/ChartLegend.tsx"],"sourcesContent":["@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);\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 `ChartDatum[]` 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. a sibling ds-chart-donut slice) — same mechanism ds-chart-donut uses for its slices.\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":"sPAAA,MAAMA,EAAiB,IAAM,kla,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,EAAKa,OAAS,IAAI,GAGxE,MAAMC,EAAiBvB,KAAKM,cAAgBN,KAAKK,iBAAmBL,KAAKO,aAAe,MAExF,OACEiB,EAACC,EAAI,CAAAC,IAAA,2CACHC,MAAO,CACL,eAAgB,KAChB,CAAC,iBAAiB3B,KAAKE,aAAc,KACrC,gCAAiCF,KAAKG,iBAMxCqB,EAAA,MAAAE,IAAA,2CACEC,MAAM,qBACNC,aAAc5B,KAAKK,iBAAmB,IAAML,KAAKe,YAAY,MAAQc,WAEpE7B,KAAKC,MAAM6B,KAAI,CAACrB,EAAMsB,KACrB,MAAMC,EAAWT,GAAkB,MAAQd,EAAKO,QAAUO,EAC1D,MAAMU,EAAOC,EAAezB,EAAKwB,MACjC,MAAME,EAASF,EAAO,IAAM,MAC5B,MAAMG,EAAa3B,EAAKa,OAAS,KAC7Be,EAAiBlB,EAAQV,EAAKa,MAAQH,EAAQ,EAAGnB,KAAKI,mBAAoBJ,KAAKsC,QAC/E,GAEJ,OACEd,EAAA,MAAIG,MAAM,0BAA0BD,IAAKjB,EAAKO,OAC5CQ,EAACW,EAAM,CACLR,MAAO,CACL,qBAAsB,KACtB,oCAAqCM,EACrC,6BAA8BD,EAC9B,iBAAkB,KAClB,sBAAuBhC,KAAKK,oBAAsB4B,EAClD,wBAAyBA,GAE3BA,KAAMA,EACNM,QAASN,EAAQO,GAAkBxC,KAAKQ,YAAYC,EAAM+B,GAAKX,UAC/DY,aACEzC,KAAKK,iBAAmB,IAAML,KAAKe,YAAYN,GAAQoB,UAEzDa,QAAS1C,KAAKK,iBAAmB,IAAML,KAAKe,YAAYN,GAAQoB,UAChEc,OAAQ3C,KAAKK,iBAAmB,IAAML,KAAKe,YAAY,MAAQc,WAE/DL,EAAA,QAAMG,MAAM,4BACVH,EAAA,QAAMG,MAAM,uBAAuBiB,MAAO,CAAEC,gBAAiBpC,EAAKqC,OAASC,EAAchB,OAE3FP,EAAA,WACEG,MAAM,sBACNqB,GAAG,OACHC,QAAQ,mBACRH,MAAM,YACNI,eAAgB,EAChBC,MAAO1C,EAAKO,OAEXP,EAAKO,OAEPP,EAAKa,OAAS,MACbE,EAAA,WACEG,MAAM,sBACNqB,GAAG,OACHC,QAAQ,mBACRH,MAAM,UACNI,eAAgB,EAChBE,MAAM,QACNC,YAAY,eACZF,MAAOG,OAAO7C,EAAKa,QAElBiC,EAAoB9C,EAAKa,MAAOtB,KAAKsC,SAGzC7B,EAAKa,OAAS,MAAQtB,KAAKG,gBAC1BqB,EAAA,WACEG,MAAM,2BACNqB,GAAG,OACHC,QAAQ,mBACRH,MAAM,UACNI,eAAgB,EAChBE,MAAM,QACNC,YAAY,eACZF,MAAOf,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);\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":"8KAAA,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,kla,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-chart-bar.d.ts → ds-chart.d.ts}

@@ -1,9 +1,9 @@
 import type { Components, JSX } from "../types/components";
 
-interface DsChartBar extends Components.DsChartBar, HTMLElement {}
-export const DsChartBar: {
-    prototype: DsChartBar;
-    new (): DsChartBar;
+interface DsChart extends Components.DsChart, HTMLElement {}
+export const DsChart: {
+    prototype: DsChart;
+    new (): DsChart;
 };
 /**
  * Used to define this component and all nested components recursively.