@ds-mo/ui 2.10.3 → 2.11.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/.build-stamp +1 -1
- package/dist/components/ds-app-shell.js +1 -1
- package/dist/components/ds-banner.js +1 -1
- package/dist/components/ds-bar-nav.js +1 -1
- package/dist/components/ds-button-filled.js +1 -1
- package/dist/components/ds-button-unfilled-icon.js +1 -1
- package/dist/components/ds-card-data-viz.d.ts +11 -0
- package/dist/components/ds-card-data-viz.js +2 -0
- package/dist/components/ds-card-data-viz.js.map +1 -0
- package/dist/components/ds-card-setting.js +1 -1
- package/dist/components/{ds-card.d.ts → ds-chart-bar.d.ts} +4 -4
- package/dist/components/ds-chart-bar.js +2 -0
- package/dist/components/ds-chart-bar.js.map +1 -0
- package/dist/components/ds-chart-donut.d.ts +11 -0
- package/dist/components/ds-chart-donut.js +2 -0
- package/dist/components/ds-chart-donut.js.map +1 -0
- package/dist/components/ds-chart-legend.d.ts +11 -0
- package/dist/components/ds-chart-legend.js +2 -0
- package/dist/components/ds-chart-legend.js.map +1 -0
- package/dist/components/ds-chart-line.d.ts +11 -0
- package/dist/components/ds-chart-line.js +2 -0
- package/dist/components/ds-chart-line.js.map +1 -0
- package/dist/components/ds-checkbox.js +1 -1
- package/dist/components/ds-chip.js +1 -1
- package/dist/components/ds-divider.js +1 -1
- package/dist/components/ds-empty-state.js +1 -1
- package/dist/components/ds-empty-state.js.map +1 -1
- package/dist/components/ds-fade.js +1 -1
- package/dist/components/ds-field.js +1 -1
- package/dist/components/ds-header.js +1 -1
- package/dist/components/ds-header.js.map +1 -1
- package/dist/components/ds-icon.js +1 -1
- package/dist/components/ds-input.js +1 -1
- package/dist/components/ds-loader.js +1 -1
- package/dist/components/ds-menu.js +1 -1
- package/dist/components/ds-modal.js +1 -1
- package/dist/components/ds-panel-nav.js +1 -1
- package/dist/components/ds-panel-tools.js +1 -1
- package/dist/components/ds-radio-group.js +1 -1
- package/dist/components/ds-scrollbar.js +1 -1
- package/dist/components/ds-select.js +1 -1
- package/dist/components/ds-shell-gradient-picker.js +1 -1
- package/dist/components/ds-shell-gradient-swatch.js +1 -1
- package/dist/components/ds-slider.js +1 -1
- package/dist/components/ds-surface.js +1 -1
- package/dist/components/ds-tab-group-nav.js +1 -1
- package/dist/components/ds-tab-group.js +1 -1
- package/dist/components/ds-table.js +1 -1
- package/dist/components/ds-table.js.map +1 -1
- package/dist/components/ds-tag.js +1 -1
- package/dist/components/ds-text.js +1 -1
- package/dist/components/ds-toast-provider.js +1 -1
- package/dist/components/ds-toggle.js +1 -1
- package/dist/components/ds-tooltip-data-viz.d.ts +11 -0
- package/dist/components/ds-tooltip-data-viz.js +2 -0
- package/dist/components/ds-tooltip-data-viz.js.map +1 -0
- package/dist/components/ds-tooltip.js +1 -1
- package/dist/components/{p-B7HWSpyT.js → p-8Nt92j1-.js} +2 -2
- package/dist/components/{p-B7HWSpyT.js.map → p-8Nt92j1-.js.map} +1 -1
- package/dist/components/{p-rX6iIVpx.js → p-BMQbEIrQ.js} +2 -2
- package/dist/components/{p-B6ZyVOGV.js → p-BSFgy5r6.js} +2 -2
- package/dist/components/p-CMv_7vFs.js +2 -0
- package/dist/components/p-CMv_7vFs.js.map +1 -0
- package/dist/components/{p-CRh-MLwj.js → p-ChVwCVHy.js} +2 -2
- package/dist/components/{p-TuuGOzXH.js → p-CpNIQXz6.js} +2 -2
- package/dist/components/p-CrCGIx8s.js +2 -0
- package/dist/components/p-CrCGIx8s.js.map +1 -0
- package/dist/components/{p-BXI096cJ.js → p-CvgHQfvT.js} +2 -2
- package/dist/components/p-CzBnvtcz.js +2 -0
- package/dist/components/p-CzBnvtcz.js.map +1 -0
- package/dist/components/p-DEpLlQZK.js +2 -0
- package/dist/components/p-DEpLlQZK.js.map +1 -0
- package/dist/components/{p-BGZjpSXm.js → p-DOU4cbpc.js} +2 -2
- package/dist/components/p-DdFUTZ3y.js +2 -0
- package/dist/components/{p-eOWUz57C.js.map → p-DdFUTZ3y.js.map} +1 -1
- package/dist/components/p-bDf6yBQd.js +2 -0
- package/dist/components/p-bDf6yBQd.js.map +1 -0
- package/dist/lib/nav/index.js +7 -0
- package/dist/lib/nav/index.js.map +2 -2
- package/dist/lib/utils/format-compact-number.d.ts +2 -0
- package/dist/lib/utils/index.d.ts +2 -0
- package/dist/lib/utils/index.js +59 -1
- package/dist/lib/utils/index.js.map +3 -3
- package/dist/lib/utils/token-defaults.d.ts +7 -0
- package/dist/lib/utils/truncate-svg-text.d.ts +9 -0
- package/dist/types/components/CardDataViz/CardDataViz.d.ts +18 -0
- package/dist/types/components/CardDataViz/index.d.ts +2 -0
- package/dist/types/components/ChartBar/ChartBar.d.ts +9 -0
- package/dist/types/components/ChartBar/index.d.ts +2 -0
- package/dist/types/components/ChartDonut/ChartDonut.d.ts +35 -0
- package/dist/types/components/ChartDonut/index.d.ts +2 -0
- package/dist/types/components/ChartLegend/ChartLegend.d.ts +38 -0
- package/dist/types/components/ChartLegend/index.d.ts +3 -0
- package/dist/types/components/ChartLine/ChartLine.d.ts +12 -0
- package/dist/types/components/ChartLine/index.d.ts +2 -0
- package/dist/types/components/TooltipDataViz/TooltipDataViz.d.ts +28 -0
- package/dist/types/components/TooltipDataViz/index.d.ts +2 -0
- package/dist/types/components.d.ts +470 -23
- package/dist/types/utils/chart-colors.d.ts +2 -0
- package/dist/types/utils/chart-types.d.ts +23 -0
- package/dist/types/utils/format-compact-number.d.ts +3 -0
- package/dist/types/utils/index.d.ts +2 -0
- package/dist/types/utils/token-defaults.d.ts +7 -0
- package/dist/types/utils/truncate-svg-text.d.ts +10 -0
- package/package.json +13 -5
- package/src/angular/index.ts +7 -2
- package/src/angular/proxies.ts +144 -6
- package/src/react/components.ts +6 -1
- package/src/react/ds-card-data-viz.ts +26 -0
- package/src/react/{ds-card.ts → ds-chart-bar.ts} +7 -7
- package/src/react/ds-chart-donut.ts +27 -0
- package/src/react/ds-chart-legend.ts +33 -0
- package/src/react/ds-chart-line.ts +26 -0
- package/src/react/ds-tooltip-data-viz.ts +26 -0
- package/src/wc/components/CardDataViz/CardDataViz.tsx +67 -0
- package/src/wc/components/CardDataViz/index.ts +1 -0
- package/src/wc/components/ChartBar/ChartBar.tsx +88 -0
- package/src/wc/components/ChartBar/index.ts +1 -0
- package/src/wc/components/ChartDonut/ChartDonut.tsx +184 -0
- package/src/wc/components/ChartDonut/index.ts +1 -0
- package/src/wc/components/ChartLegend/ChartLegend.tsx +114 -0
- package/src/wc/components/ChartLegend/index.ts +2 -0
- package/src/wc/components/ChartLine/ChartLine.tsx +102 -0
- package/src/wc/components/ChartLine/index.ts +1 -0
- package/src/wc/components/Icon/system-icon-catalog.ts +2 -2
- package/src/wc/components/TooltipDataViz/TooltipDataViz.tsx +82 -0
- package/src/wc/components/TooltipDataViz/index.ts +1 -0
- package/src/wc/components.d.ts +470 -23
- package/src/wc/utils/chart-colors.ts +7 -0
- package/src/wc/utils/chart-types.ts +25 -0
- package/src/wc/utils/format-compact-number.ts +27 -0
- package/src/wc/utils/index.ts +2 -0
- package/src/wc/utils/token-defaults.ts +14 -0
- package/src/wc/utils/truncate-svg-text.ts +25 -0
- package/dist/components/ds-card.js +0 -2
- package/dist/components/ds-card.js.map +0 -1
- package/dist/components/p-eOWUz57C.js +0 -2
- package/dist/components/p-jjfqrXnP.js +0 -2
- package/dist/components/p-jjfqrXnP.js.map +0 -1
- package/dist/types/components/Card/Card.d.ts +0 -8
- package/src/wc/components/Card/Card.tsx +0 -26
- /package/dist/components/{p-rX6iIVpx.js.map → p-BMQbEIrQ.js.map} +0 -0
- /package/dist/components/{p-B6ZyVOGV.js.map → p-BSFgy5r6.js.map} +0 -0
- /package/dist/components/{p-CRh-MLwj.js.map → p-ChVwCVHy.js.map} +0 -0
- /package/dist/components/{p-TuuGOzXH.js.map → p-CpNIQXz6.js.map} +0 -0
- /package/dist/components/{p-BXI096cJ.js.map → p-CvgHQfvT.js.map} +0 -0
- /package/dist/components/{p-BGZjpSXm.js.map → p-DOU4cbpc.js.map} +0 -0
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{p as e,H as s,c as o,h as c,a as i,t as r}from"./index.js";const t=()=>`.checkbox.sc-ds-checkbox{display:flex;align-items:center;gap:var(--dimension-space-050);padding:var(--dimension-space-075);height:var(--dimension-size-400);box-sizing:border-box;cursor:pointer;user-select:none;border-radius:var(--dimension-radius-075);transition:background-color var(--effect-motion-short-2)}.checkbox.sc-ds-checkbox:hover{background-color:var(--color-interaction-hover)}.checkbox.sc-ds-checkbox:active{background-color:var(--color-interaction-pressed)}.inactive.sc-ds-checkbox{cursor:not-allowed;opacity:0.5;pointer-events:none}.box.sc-ds-checkbox{width:20px;height:20px;flex-shrink:0;border:1.5px solid var(--color-foreground-secondary);border-radius:var(--dimension-radius-050);display:flex;align-items:center;justify-content:center;box-sizing:border-box;transition:all var(--effect-motion-short-2)}.box--marked.sc-ds-checkbox{background-color:var(--color-foreground-primary);border-color:var(--color-foreground-primary)}.checkmark.sc-ds-checkbox{color:var(--color-foreground-on-bold-background-primary);font-size:14px;line-height:1;font-weight:700}.checkbox__label.sc-ds-checkbox{flex:1;min-width:0}`;let
|
|
1
|
+
import{p as e,H as s,c as o,h as c,a as i,t as r}from"./index.js";const t=()=>`.checkbox.sc-ds-checkbox{display:flex;align-items:center;gap:var(--dimension-space-050);padding:var(--dimension-space-075);height:var(--dimension-size-400);box-sizing:border-box;cursor:pointer;user-select:none;border-radius:var(--dimension-radius-075);transition:background-color var(--effect-motion-short-2)}.checkbox.sc-ds-checkbox:hover{background-color:var(--color-interaction-hover)}.checkbox.sc-ds-checkbox:active{background-color:var(--color-interaction-pressed)}.inactive.sc-ds-checkbox{cursor:not-allowed;opacity:0.5;pointer-events:none}.box.sc-ds-checkbox{width:20px;height:20px;flex-shrink:0;border:1.5px solid var(--color-foreground-secondary);border-radius:var(--dimension-radius-050);display:flex;align-items:center;justify-content:center;box-sizing:border-box;transition:all var(--effect-motion-short-2)}.box--marked.sc-ds-checkbox{background-color:var(--color-foreground-primary);border-color:var(--color-foreground-primary)}.checkmark.sc-ds-checkbox{color:var(--color-foreground-on-bold-background-primary);font-size:14px;line-height:1;font-weight:700}.checkbox__label.sc-ds-checkbox{flex:1;min-width:0}`;let a=0;const n=e(class e extends s{constructor(e){super();if(e!==false){this.__registerHost()}this.dsChange=o(this,"dsChange");this.labelId=`ds-checkbox-label-${++a}`;this.checked=false;this.indeterminate=false;this.inactive=false;this.handleActivate=()=>{if(this.inactive)return;this.checked=!this.checked;this.dsChange.emit(this.checked)};this.handleKeyDown=e=>{if(e.key===" "||e.key==="Enter"){e.preventDefault();this.handleActivate()}}}render(){const e=this.checked||this.indeterminate;return c(i,{key:"3911b4c3be900f05917aa92b212d1c742fa509b9",role:"checkbox","aria-checked":this.indeterminate?"mixed":String(this.checked),"aria-disabled":this.inactive||undefined,"aria-labelledby":this.labelId,tabIndex:this.inactive?-1:0,class:{checkbox:true,inactive:this.inactive},onClick:this.handleActivate,onKeyDown:this.handleKeyDown},c("span",{key:"f3f5ad1e15f438fcd27cf147d33223aa15118603",class:{box:true,"box--marked":e}},e&&c("span",{key:"860e784364d654527ba37d3803bb23cb160e4919",class:"checkmark","aria-hidden":"true"},this.indeterminate?"−":"✓")),c("span",{key:"f946ff62f76a788ffca47517ccd55de9c7fc3c3e",id:this.labelId,class:"text-body-medium checkbox__label"},this.label))}static get style(){return t()}},[2,"ds-checkbox",{label:[1],checked:[1028],indeterminate:[4],inactive:[4]}]);function d(){if(typeof customElements==="undefined"){return}const e=["ds-checkbox"];e.forEach((e=>{switch(e){case"ds-checkbox":if(!customElements.get(r(e))){customElements.define(r(e),n)}break}}))}d();const h=n;const b=d;export{h as DsCheckbox,b as defineCustomElement};
|
|
2
2
|
//# sourceMappingURL=ds-checkbox.js.map
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{p as o,H as t,c as r,h as a,a as n,t as e}from"./index.js";const i=()=>`.sc-ds-chip-h{display:inline-flex;align-items:center;justify-content:center;border-radius:var(--dimension-radius-050);box-sizing:border-box;color:var(--color-foreground-primary);position:relative;--_hover-bg:var(--color-interaction-hover);--_pressed-bg:var(--color-interaction-pressed)}.tag--size-md.sc-ds-chip-h{height:var(--dimension-size-400);padding:0 var(--dimension-space-075);gap:0}.tag--size-sm.sc-ds-chip-h{height:var(--dimension-size-300);padding:0 var(--dimension-space-050);gap:0}.tag--size-xs.sc-ds-chip-h{height:var(--dimension-size-200);padding:0 var(--dimension-space-025);gap:0}.tag--rounded.sc-ds-chip-h{border-radius:var(--dimension-radius-half)}.tag--on-medium.sc-ds-chip-h{--_hover-bg:var(--color-interaction-on-medium-background-hover);--_pressed-bg:var(--color-interaction-on-medium-background-pressed)}.tag--on-bold.sc-ds-chip-h{--_hover-bg:var(--color-interaction-on-bold-background-hover);--_pressed-bg:var(--color-interaction-on-bold-background-pressed)}.tag--on-strong.sc-ds-chip-h{--_hover-bg:var(--color-interaction-on-strong-background-hover);--_pressed-bg:var(--color-interaction-on-strong-background-pressed)}.tag--on-always-dark.sc-ds-chip-h{--_hover-bg:var(--color-always-dark-interaction-hover);--_pressed-bg:var(--color-always-dark-interaction-pressed)}.tag--elevation-flat.sc-ds-chip-h{background-color:transparent !important;box-shadow:inset 0 0 0 var(--dimension-stroke-width-015) currentColor}.tag--elevation-elevated.sc-ds-chip-h{box-shadow:var(--effect-elevation-elevated-sm)}.tag--elevation-flat.tag--intent-neutral.tag--contrast-bold.sc-ds-chip-h{color:var(--color-foreground-bold-neutral)}.tag--elevation-flat.tag--intent-brand.tag--contrast-bold.sc-ds-chip-h{color:var(--color-foreground-bold-brand)}.tag--elevation-flat.tag--intent-ai.tag--contrast-bold.sc-ds-chip-h{color:var(--color-foreground-bold-ai)}.tag--elevation-flat.tag--intent-negative.tag--contrast-bold.sc-ds-chip-h{color:var(--color-foreground-bold-negative)}.tag--elevation-flat.tag--intent-warning.tag--contrast-bold.sc-ds-chip-h{color:var(--color-foreground-bold-warning)}.tag--elevation-flat.tag--intent-caution.tag--contrast-bold.sc-ds-chip-h{color:var(--color-foreground-bold-caution)}.tag--elevation-flat.tag--intent-positive.tag--contrast-bold.sc-ds-chip-h{color:var(--color-foreground-bold-positive)}.tag--elevation-flat.tag--intent-neutral.tag--contrast-strong.sc-ds-chip-h{color:var(--color-foreground-strong-neutral)}.tag--elevation-flat.tag--intent-brand.tag--contrast-strong.sc-ds-chip-h{color:var(--color-foreground-strong-brand)}.tag--elevation-flat.tag--intent-ai.tag--contrast-strong.sc-ds-chip-h{color:var(--color-foreground-strong-ai)}.tag--elevation-flat.tag--intent-negative.tag--contrast-strong.sc-ds-chip-h{color:var(--color-foreground-strong-negative)}.tag--elevation-flat.tag--intent-warning.tag--contrast-strong.sc-ds-chip-h{color:var(--color-foreground-strong-warning)}.tag--elevation-flat.tag--intent-caution.tag--contrast-strong.sc-ds-chip-h{color:var(--color-foreground-strong-caution)}.tag--elevation-flat.tag--intent-positive.tag--contrast-strong.sc-ds-chip-h{color:var(--color-foreground-strong-positive)}.tag--elevation-flat.tag--intent-neutral.tag--contrast-medium.sc-ds-chip-h{color:var(--color-foreground-medium-neutral)}.tag--elevation-flat.tag--intent-brand.tag--contrast-medium.sc-ds-chip-h{color:var(--color-foreground-medium-brand)}.tag--elevation-flat.tag--intent-ai.tag--contrast-medium.sc-ds-chip-h{color:var(--color-foreground-medium-ai)}.tag--elevation-flat.tag--intent-negative.tag--contrast-medium.sc-ds-chip-h{color:var(--color-foreground-medium-negative)}.tag--elevation-flat.tag--intent-warning.tag--contrast-medium.sc-ds-chip-h{color:var(--color-foreground-medium-warning)}.tag--elevation-flat.tag--intent-caution.tag--contrast-medium.sc-ds-chip-h{color:var(--color-foreground-medium-caution)}.tag--elevation-flat.tag--intent-positive.tag--contrast-medium.sc-ds-chip-h{color:var(--color-foreground-medium-positive)}.tag--elevation-flat.tag--intent-neutral.tag--contrast-faint.sc-ds-chip-h{color:var(--color-foreground-faint-neutral)}.tag--elevation-flat.tag--intent-brand.tag--contrast-faint.sc-ds-chip-h{color:var(--color-foreground-faint-brand)}.tag--elevation-flat.tag--intent-ai.tag--contrast-faint.sc-ds-chip-h{color:var(--color-foreground-faint-ai)}.tag--elevation-flat.tag--intent-negative.tag--contrast-faint.sc-ds-chip-h{color:var(--color-foreground-faint-negative)}.tag--elevation-flat.tag--intent-warning.tag--contrast-faint.sc-ds-chip-h{color:var(--color-foreground-faint-warning)}.tag--elevation-flat.tag--intent-caution.tag--contrast-faint.sc-ds-chip-h{color:var(--color-foreground-faint-caution)}.tag--elevation-flat.tag--intent-positive.tag--contrast-faint.sc-ds-chip-h{color:var(--color-foreground-faint-positive)}.tag--intent-neutral.tag--contrast-strong.sc-ds-chip-h{background-color:var(--color-background-strong-neutral);color:var(--color-foreground-medium-neutral)}.tag--intent-brand.tag--contrast-strong.sc-ds-chip-h{background-color:var(--color-background-strong-brand);color:var(--color-foreground-medium-brand)}.tag--intent-ai.tag--contrast-strong.sc-ds-chip-h{background-color:var(--color-background-strong-ai);color:var(--color-foreground-medium-ai)}.tag--intent-negative.tag--contrast-strong.sc-ds-chip-h{background-color:var(--color-background-strong-negative);color:var(--color-foreground-medium-negative)}.tag--intent-warning.tag--contrast-strong.sc-ds-chip-h{background-color:var(--color-background-strong-warning);color:var(--color-foreground-medium-warning)}.tag--intent-caution.tag--contrast-strong.sc-ds-chip-h{background-color:var(--color-background-strong-caution);color:var(--color-foreground-medium-caution)}.tag--intent-positive.tag--contrast-strong.sc-ds-chip-h{background-color:var(--color-background-strong-positive);color:var(--color-foreground-medium-positive)}.tag--intent-neutral.tag--contrast-bold.sc-ds-chip-h{background-color:var(--color-background-bold-neutral);color:var(--color-foreground-on-bold-background-primary)}.tag--intent-brand.tag--contrast-bold.sc-ds-chip-h{background-color:var(--color-background-bold-brand);color:var(--color-foreground-on-bold-background-primary)}.tag--intent-ai.tag--contrast-bold.sc-ds-chip-h{background-color:var(--color-background-bold-ai);color:var(--color-foreground-on-bold-background-primary)}.tag--intent-negative.tag--contrast-bold.sc-ds-chip-h{background-color:var(--color-background-bold-negative);color:var(--color-foreground-on-bold-background-primary)}.tag--intent-warning.tag--contrast-bold.sc-ds-chip-h{background-color:var(--color-background-bold-warning);color:var(--color-foreground-on-bold-background-primary)}.tag--intent-caution.tag--contrast-bold.sc-ds-chip-h{background-color:var(--color-background-bold-caution);color:var(--color-foreground-on-bold-background-primary)}.tag--intent-positive.tag--contrast-bold.sc-ds-chip-h{background-color:var(--color-background-bold-positive);color:var(--color-foreground-on-bold-background-primary)}.tag--intent-neutral.tag--contrast-medium.sc-ds-chip-h{background-color:var(--color-background-medium-neutral);color:var(--color-foreground-strong-neutral)}.tag--intent-brand.tag--contrast-medium.sc-ds-chip-h{background-color:var(--color-background-medium-brand);color:var(--color-foreground-strong-brand)}.tag--intent-ai.tag--contrast-medium.sc-ds-chip-h{background-color:var(--color-background-medium-ai);color:var(--color-foreground-strong-ai)}.tag--intent-negative.tag--contrast-medium.sc-ds-chip-h{background-color:var(--color-background-medium-negative);color:var(--color-foreground-strong-negative)}.tag--intent-warning.tag--contrast-medium.sc-ds-chip-h{background-color:var(--color-background-medium-warning);color:var(--color-foreground-strong-warning)}.tag--intent-caution.tag--contrast-medium.sc-ds-chip-h{background-color:var(--color-background-medium-caution);color:var(--color-foreground-strong-caution)}.tag--intent-positive.tag--contrast-medium.sc-ds-chip-h{background-color:var(--color-background-medium-positive);color:var(--color-foreground-strong-positive)}.tag--intent-neutral.tag--contrast-faint.sc-ds-chip-h{background-color:var(--color-background-faint-neutral);color:var(--color-foreground-bold-neutral)}.tag--intent-brand.tag--contrast-faint.sc-ds-chip-h{background-color:var(--color-background-faint-brand);color:var(--color-foreground-bold-brand)}.tag--intent-ai.tag--contrast-faint.sc-ds-chip-h{background-color:var(--color-background-faint-ai);color:var(--color-foreground-bold-ai)}.tag--intent-negative.tag--contrast-faint.sc-ds-chip-h{background-color:var(--color-background-faint-negative);color:var(--color-foreground-bold-negative)}.tag--intent-warning.tag--contrast-faint.sc-ds-chip-h{background-color:var(--color-background-faint-warning);color:var(--color-foreground-bold-warning)}.tag--intent-caution.tag--contrast-faint.sc-ds-chip-h{background-color:var(--color-background-faint-caution);color:var(--color-foreground-bold-caution)}.tag--intent-positive.tag--contrast-faint.sc-ds-chip-h{background-color:var(--color-background-faint-positive);color:var(--color-foreground-bold-positive)}.tag--interactive.sc-ds-chip-h{cursor:pointer;user-select:none;outline:none}.tag--interactive.sc-ds-chip-h:hover{background-color:var(--_hover-bg)}.tag--interactive.sc-ds-chip-h:active{background-color:var(--_pressed-bg)}.tag--interactive.sc-ds-chip-h:focus-visible{outline:var(--dimension-stroke-width-025) solid var(--color-interaction-focus);outline-offset:var(--dimension-space-025)}.tag--pressed.sc-ds-chip-h{background-color:var(--color-background-faint-brand) !important;color:var(--color-foreground-bold-brand) !important}.tag__label.sc-ds-chip{line-height:0;padding:0 var(--dimension-space-025);white-space:nowrap;flex-shrink:0}.tag__icon-slot.sc-ds-chip{display:contents}.tag--removable.sc-ds-chip-h .tag__label.sc-ds-chip{padding-inline-end:0}.tag__remove.sc-ds-chip{padding:0;margin:0;border:none;background:none;display:flex;align-items:center;justify-content:center;cursor:pointer;color:inherit;flex-shrink:0;position:relative;border-radius:var(--dimension-radius-050)}.tag--size-md.tag--removable.sc-ds-chip-h .tag__remove.sc-ds-chip,.tag--size-sm.tag--removable.sc-ds-chip-h .tag__remove.sc-ds-chip{margin-inline-start:var(--dimension-space-050)}.tag--size-xs.tag--removable.sc-ds-chip-h .tag__remove.sc-ds-chip{margin-inline-start:var(--dimension-space-025)}.tag__remove.sc-ds-chip::before{content:'';position:absolute;inset:-2px;border-radius:var(--dimension-radius-025);background-color:transparent;transition:var(--effect-transition-interaction-background-short-2);pointer-events:none}.tag__remove.sc-ds-chip:hover::before{background-color:var(--color-interaction-hover)}.tag__remove.sc-ds-chip:active::before{background-color:var(--color-interaction-pressed)}.tag--size-sm.sc-ds-chip-h .tag__remove.sc-ds-chip::before{inset:-1px;border-radius:3px}.tag--size-xs.sc-ds-chip-h .tag__remove.sc-ds-chip::before{inset:0;border-radius:var(--dimension-radius-050)}.tag--rounded.sc-ds-chip-h .tag__remove.sc-ds-chip,.tag--rounded.sc-ds-chip-h .tag__remove.sc-ds-chip::before{border-radius:var(--dimension-radius-half)}.tag__remove-x.sc-ds-chip{display:inline-flex;line-height:0;font-size:inherit}.tag--inactive.sc-ds-chip-h{opacity:0.5;pointer-events:none;cursor:not-allowed}`;const c={md:"text-body-medium",sm:"text-body-small",xs:"text-caption"};const s={md:20,sm:16,xs:12};const d=o(class o extends t{constructor(o){super();if(o!==false){this.__registerHost()}this.dsRemove=r(this,"dsRemove");this.dsClick=r(this,"dsClick");this.dsPressedChange=r(this,"dsPressedChange");this.intent="neutral";this.contrast="faint";this.elevation="none";this.size="md";this.rounded=false;this.removable=false;this.inactive=false;this.pressed=false;this.handleClick=()=>{if(this.inactive)return;this.pressed=!this.pressed;this.dsPressedChange.emit(this.pressed);this.dsClick.emit()};this.handleKeyDown=o=>{if(this.inactive)return;if(o.key==="Enter"||o.key===" "){o.preventDefault();this.handleClick()}};this.handleRemove=o=>{o.stopPropagation();this.dsRemove.emit()}}render(){const o=this.size.toUpperCase();const t=c[this.size];const r=s[this.size];const e=this.maxWidth!=null?{maxWidth:typeof this.maxWidth==="number"?`${this.maxWidth}px`:this.maxWidth}:undefined;const i={tag:true,[`tag--intent-${this.intent}`]:true,[`tag--contrast-${this.contrast}`]:true,[`tag--elevation-${this.elevation}`]:true,[`tag--size-${this.size}`]:true,"tag--rounded":this.rounded,"tag--rounded-no-icon-left":this.rounded,"tag--rounded-no-remove-right":this.rounded&&!this.removable,[`tag--icon-left-${o}`]:false,[`tag--icon-right-${o}`]:this.removable,"tag--removable":this.removable,"tag--interactive":true,"tag--inactive":this.inactive,"tag--pressed":this.pressed,"tag--on-medium":this.background==="medium","tag--on-bold":this.background==="bold","tag--on-strong":this.background==="strong","tag--on-always-dark":this.background==="always-dark"};return a(n,{key:"1bdfb70411c9038bba66b368eac494aaf0d6ba88",class:i,style:e,onClick:this.handleClick,onKeyDown:this.handleKeyDown,role:"button",tabIndex:this.inactive?-1:0,"aria-pressed":String(this.pressed),"aria-disabled":this.inactive||undefined},a("span",{key:"ae0ce68af5db54306d940480d6e72280e9e12d48",class:"tag__icon-slot",style:{fontSize:`${r}px`,lineHeight:"0"}},a("slot",{key:"3cb6666a6d9e5840043f62a379169fe7058113d8",name:"icon"})),a("span",{key:"4cfac44ed9a7cb7e22c5b0c9f243d888f52e8450",class:{tag__label:true,[t]:true}},this.label),this.removable&&a("button",{key:"f68b9abb7889931bbdae851858ebf15726db9911",type:"button",class:"tag__remove",onClick:this.handleRemove,"aria-label":`Remove ${this.label}`,tabIndex:-1},a("slot",{key:"4b9449ce4c43a50f487a3eff7cf0ed5bba76dd7a",name:"remove-icon"},a("span",{key:"8912dac6b0df4872abb3b75207829bf14ba25bd7",class:"tag__remove-x",style:{fontSize:`${r}px`,lineHeight:"0"}},"✕"))))}static get style(){return i()}},[262,"ds-chip",{label:[1],intent:[1],contrast:[1],elevation:[1],size:[1],rounded:[4],removable:[4],maxWidth:[8,"max-width"],inactive:[4],background:[1],pressed:[1028]}]);function g(){if(typeof customElements==="undefined"){return}const o=["ds-chip"];o.forEach((o=>{switch(o){case"ds-chip":if(!customElements.get(e(o))){customElements.define(e(o),d)}break}}))}g();const l=d;const h=g;export{l as DsChip,h as defineCustomElement};
|
|
1
|
+
import{p as o,H as t,c as r,h as a,a as n,t as e}from"./index.js";const i=()=>`.sc-ds-chip-h{display:inline-flex;align-items:center;justify-content:center;border-radius:var(--dimension-radius-050);box-sizing:border-box;color:var(--color-foreground-primary);position:relative;--_hover-bg:var(--color-interaction-hover);--_pressed-bg:var(--color-interaction-pressed)}.tag--size-md.sc-ds-chip-h{height:var(--dimension-size-400);padding:0 var(--dimension-space-075);gap:0}.tag--size-sm.sc-ds-chip-h{height:var(--dimension-size-300);padding:0 var(--dimension-space-050);gap:0}.tag--size-xs.sc-ds-chip-h{height:var(--dimension-size-200);padding:0 var(--dimension-space-025);gap:0}.tag--rounded.sc-ds-chip-h{border-radius:var(--dimension-radius-half)}.tag--on-medium.sc-ds-chip-h{--_hover-bg:var(--color-interaction-on-medium-background-hover);--_pressed-bg:var(--color-interaction-on-medium-background-pressed)}.tag--on-bold.sc-ds-chip-h{--_hover-bg:var(--color-interaction-on-bold-background-hover);--_pressed-bg:var(--color-interaction-on-bold-background-pressed)}.tag--on-strong.sc-ds-chip-h{--_hover-bg:var(--color-interaction-on-strong-background-hover);--_pressed-bg:var(--color-interaction-on-strong-background-pressed)}.tag--on-always-dark.sc-ds-chip-h{--_hover-bg:var(--color-always-dark-interaction-hover);--_pressed-bg:var(--color-always-dark-interaction-pressed)}.tag--elevation-flat.sc-ds-chip-h{background-color:transparent !important;box-shadow:inset 0 0 0 var(--dimension-stroke-width-015) currentColor}.tag--elevation-elevated.sc-ds-chip-h{box-shadow:var(--effect-elevation-elevated-sm)}.tag--elevation-flat.tag--intent-neutral.tag--contrast-bold.sc-ds-chip-h{color:var(--color-foreground-bold-neutral)}.tag--elevation-flat.tag--intent-brand.tag--contrast-bold.sc-ds-chip-h{color:var(--color-foreground-bold-brand)}.tag--elevation-flat.tag--intent-ai.tag--contrast-bold.sc-ds-chip-h{color:var(--color-foreground-bold-ai)}.tag--elevation-flat.tag--intent-negative.tag--contrast-bold.sc-ds-chip-h{color:var(--color-foreground-bold-negative)}.tag--elevation-flat.tag--intent-warning.tag--contrast-bold.sc-ds-chip-h{color:var(--color-foreground-bold-warning)}.tag--elevation-flat.tag--intent-caution.tag--contrast-bold.sc-ds-chip-h{color:var(--color-foreground-bold-caution)}.tag--elevation-flat.tag--intent-positive.tag--contrast-bold.sc-ds-chip-h{color:var(--color-foreground-bold-positive)}.tag--elevation-flat.tag--intent-neutral.tag--contrast-strong.sc-ds-chip-h{color:var(--color-foreground-strong-neutral)}.tag--elevation-flat.tag--intent-brand.tag--contrast-strong.sc-ds-chip-h{color:var(--color-foreground-strong-brand)}.tag--elevation-flat.tag--intent-ai.tag--contrast-strong.sc-ds-chip-h{color:var(--color-foreground-strong-ai)}.tag--elevation-flat.tag--intent-negative.tag--contrast-strong.sc-ds-chip-h{color:var(--color-foreground-strong-negative)}.tag--elevation-flat.tag--intent-warning.tag--contrast-strong.sc-ds-chip-h{color:var(--color-foreground-strong-warning)}.tag--elevation-flat.tag--intent-caution.tag--contrast-strong.sc-ds-chip-h{color:var(--color-foreground-strong-caution)}.tag--elevation-flat.tag--intent-positive.tag--contrast-strong.sc-ds-chip-h{color:var(--color-foreground-strong-positive)}.tag--elevation-flat.tag--intent-neutral.tag--contrast-medium.sc-ds-chip-h{color:var(--color-foreground-medium-neutral)}.tag--elevation-flat.tag--intent-brand.tag--contrast-medium.sc-ds-chip-h{color:var(--color-foreground-medium-brand)}.tag--elevation-flat.tag--intent-ai.tag--contrast-medium.sc-ds-chip-h{color:var(--color-foreground-medium-ai)}.tag--elevation-flat.tag--intent-negative.tag--contrast-medium.sc-ds-chip-h{color:var(--color-foreground-medium-negative)}.tag--elevation-flat.tag--intent-warning.tag--contrast-medium.sc-ds-chip-h{color:var(--color-foreground-medium-warning)}.tag--elevation-flat.tag--intent-caution.tag--contrast-medium.sc-ds-chip-h{color:var(--color-foreground-medium-caution)}.tag--elevation-flat.tag--intent-positive.tag--contrast-medium.sc-ds-chip-h{color:var(--color-foreground-medium-positive)}.tag--elevation-flat.tag--intent-neutral.tag--contrast-faint.sc-ds-chip-h{color:var(--color-foreground-faint-neutral)}.tag--elevation-flat.tag--intent-brand.tag--contrast-faint.sc-ds-chip-h{color:var(--color-foreground-faint-brand)}.tag--elevation-flat.tag--intent-ai.tag--contrast-faint.sc-ds-chip-h{color:var(--color-foreground-faint-ai)}.tag--elevation-flat.tag--intent-negative.tag--contrast-faint.sc-ds-chip-h{color:var(--color-foreground-faint-negative)}.tag--elevation-flat.tag--intent-warning.tag--contrast-faint.sc-ds-chip-h{color:var(--color-foreground-faint-warning)}.tag--elevation-flat.tag--intent-caution.tag--contrast-faint.sc-ds-chip-h{color:var(--color-foreground-faint-caution)}.tag--elevation-flat.tag--intent-positive.tag--contrast-faint.sc-ds-chip-h{color:var(--color-foreground-faint-positive)}.tag--intent-neutral.tag--contrast-strong.sc-ds-chip-h{background-color:var(--color-background-strong-neutral);color:var(--color-foreground-medium-neutral)}.tag--intent-brand.tag--contrast-strong.sc-ds-chip-h{background-color:var(--color-background-strong-brand);color:var(--color-foreground-medium-brand)}.tag--intent-ai.tag--contrast-strong.sc-ds-chip-h{background-color:var(--color-background-strong-ai);color:var(--color-foreground-medium-ai)}.tag--intent-negative.tag--contrast-strong.sc-ds-chip-h{background-color:var(--color-background-strong-negative);color:var(--color-foreground-medium-negative)}.tag--intent-warning.tag--contrast-strong.sc-ds-chip-h{background-color:var(--color-background-strong-warning);color:var(--color-foreground-medium-warning)}.tag--intent-caution.tag--contrast-strong.sc-ds-chip-h{background-color:var(--color-background-strong-caution);color:var(--color-foreground-medium-caution)}.tag--intent-positive.tag--contrast-strong.sc-ds-chip-h{background-color:var(--color-background-strong-positive);color:var(--color-foreground-medium-positive)}.tag--intent-neutral.tag--contrast-bold.sc-ds-chip-h{background-color:var(--color-background-bold-neutral);color:var(--color-foreground-on-bold-background-primary)}.tag--intent-brand.tag--contrast-bold.sc-ds-chip-h{background-color:var(--color-background-bold-brand);color:var(--color-foreground-on-bold-background-primary)}.tag--intent-ai.tag--contrast-bold.sc-ds-chip-h{background-color:var(--color-background-bold-ai);color:var(--color-foreground-on-bold-background-primary)}.tag--intent-negative.tag--contrast-bold.sc-ds-chip-h{background-color:var(--color-background-bold-negative);color:var(--color-foreground-on-bold-background-primary)}.tag--intent-warning.tag--contrast-bold.sc-ds-chip-h{background-color:var(--color-background-bold-warning);color:var(--color-foreground-on-bold-background-primary)}.tag--intent-caution.tag--contrast-bold.sc-ds-chip-h{background-color:var(--color-background-bold-caution);color:var(--color-foreground-on-bold-background-primary)}.tag--intent-positive.tag--contrast-bold.sc-ds-chip-h{background-color:var(--color-background-bold-positive);color:var(--color-foreground-on-bold-background-primary)}.tag--intent-neutral.tag--contrast-medium.sc-ds-chip-h{background-color:var(--color-background-medium-neutral);color:var(--color-foreground-strong-neutral)}.tag--intent-brand.tag--contrast-medium.sc-ds-chip-h{background-color:var(--color-background-medium-brand);color:var(--color-foreground-strong-brand)}.tag--intent-ai.tag--contrast-medium.sc-ds-chip-h{background-color:var(--color-background-medium-ai);color:var(--color-foreground-strong-ai)}.tag--intent-negative.tag--contrast-medium.sc-ds-chip-h{background-color:var(--color-background-medium-negative);color:var(--color-foreground-strong-negative)}.tag--intent-warning.tag--contrast-medium.sc-ds-chip-h{background-color:var(--color-background-medium-warning);color:var(--color-foreground-strong-warning)}.tag--intent-caution.tag--contrast-medium.sc-ds-chip-h{background-color:var(--color-background-medium-caution);color:var(--color-foreground-strong-caution)}.tag--intent-positive.tag--contrast-medium.sc-ds-chip-h{background-color:var(--color-background-medium-positive);color:var(--color-foreground-strong-positive)}.tag--intent-neutral.tag--contrast-faint.sc-ds-chip-h{background-color:var(--color-background-faint-neutral);color:var(--color-foreground-bold-neutral)}.tag--intent-brand.tag--contrast-faint.sc-ds-chip-h{background-color:var(--color-background-faint-brand);color:var(--color-foreground-bold-brand)}.tag--intent-ai.tag--contrast-faint.sc-ds-chip-h{background-color:var(--color-background-faint-ai);color:var(--color-foreground-bold-ai)}.tag--intent-negative.tag--contrast-faint.sc-ds-chip-h{background-color:var(--color-background-faint-negative);color:var(--color-foreground-bold-negative)}.tag--intent-warning.tag--contrast-faint.sc-ds-chip-h{background-color:var(--color-background-faint-warning);color:var(--color-foreground-bold-warning)}.tag--intent-caution.tag--contrast-faint.sc-ds-chip-h{background-color:var(--color-background-faint-caution);color:var(--color-foreground-bold-caution)}.tag--intent-positive.tag--contrast-faint.sc-ds-chip-h{background-color:var(--color-background-faint-positive);color:var(--color-foreground-bold-positive)}.tag--interactive.sc-ds-chip-h{cursor:pointer;user-select:none;outline:none}.tag--interactive.sc-ds-chip-h:hover{background-color:var(--_hover-bg)}.tag--interactive.sc-ds-chip-h:active{background-color:var(--_pressed-bg)}.tag--interactive.sc-ds-chip-h:focus-visible{outline:var(--dimension-stroke-width-025) solid var(--color-interaction-focus);outline-offset:var(--dimension-space-025)}.tag--pressed.sc-ds-chip-h{background-color:var(--color-background-faint-brand) !important;color:var(--color-foreground-bold-brand) !important}.tag__label.sc-ds-chip{line-height:0;padding:0 var(--dimension-space-025);white-space:nowrap;flex-shrink:0}.tag__icon-slot.sc-ds-chip{display:contents}.tag--removable.sc-ds-chip-h .tag__label.sc-ds-chip{padding-inline-end:0}.tag__remove.sc-ds-chip{padding:0;margin:0;border:none;background:none;display:flex;align-items:center;justify-content:center;cursor:pointer;color:inherit;flex-shrink:0;position:relative;border-radius:var(--dimension-radius-050)}.tag--size-md.tag--removable.sc-ds-chip-h .tag__remove.sc-ds-chip,.tag--size-sm.tag--removable.sc-ds-chip-h .tag__remove.sc-ds-chip{margin-inline-start:var(--dimension-space-050)}.tag--size-xs.tag--removable.sc-ds-chip-h .tag__remove.sc-ds-chip{margin-inline-start:var(--dimension-space-025)}.tag__remove.sc-ds-chip::before{content:'';position:absolute;inset:-2px;border-radius:var(--dimension-radius-025);background-color:transparent;transition:var(--effect-transition-interaction-background-short-2);pointer-events:none}.tag__remove.sc-ds-chip:hover::before{background-color:var(--color-interaction-hover)}.tag__remove.sc-ds-chip:active::before{background-color:var(--color-interaction-pressed)}.tag--size-sm.sc-ds-chip-h .tag__remove.sc-ds-chip::before{inset:-1px;border-radius:3px}.tag--size-xs.sc-ds-chip-h .tag__remove.sc-ds-chip::before{inset:0;border-radius:var(--dimension-radius-050)}.tag--rounded.sc-ds-chip-h .tag__remove.sc-ds-chip,.tag--rounded.sc-ds-chip-h .tag__remove.sc-ds-chip::before{border-radius:var(--dimension-radius-half)}.tag__remove-x.sc-ds-chip{display:inline-flex;line-height:0;font-size:inherit}.tag--inactive.sc-ds-chip-h{opacity:0.5;pointer-events:none;cursor:not-allowed}`;const c={md:"text-body-medium",sm:"text-body-small",xs:"text-caption"};const s={md:20,sm:16,xs:12};const d=o(class o extends t{constructor(o){super();if(o!==false){this.__registerHost()}this.dsRemove=r(this,"dsRemove");this.dsClick=r(this,"dsClick");this.dsPressedChange=r(this,"dsPressedChange");this.intent="neutral";this.contrast="faint";this.elevation="none";this.size="md";this.rounded=false;this.removable=false;this.inactive=false;this.pressed=false;this.handleClick=()=>{if(this.inactive)return;this.pressed=!this.pressed;this.dsPressedChange.emit(this.pressed);this.dsClick.emit()};this.handleKeyDown=o=>{if(this.inactive)return;if(o.key==="Enter"||o.key===" "){o.preventDefault();this.handleClick()}};this.handleRemove=o=>{o.stopPropagation();this.dsRemove.emit()}}render(){const o=this.size.toUpperCase();const t=c[this.size];const r=s[this.size];const e=this.maxWidth!=null?{maxWidth:typeof this.maxWidth==="number"?`${this.maxWidth}px`:this.maxWidth}:undefined;const i={tag:true,[`tag--intent-${this.intent}`]:true,[`tag--contrast-${this.contrast}`]:true,[`tag--elevation-${this.elevation}`]:true,[`tag--size-${this.size}`]:true,"tag--rounded":this.rounded,"tag--rounded-no-icon-left":this.rounded,"tag--rounded-no-remove-right":this.rounded&&!this.removable,[`tag--icon-left-${o}`]:false,[`tag--icon-right-${o}`]:this.removable,"tag--removable":this.removable,"tag--interactive":true,"tag--inactive":this.inactive,"tag--pressed":this.pressed,"tag--on-medium":this.background==="medium","tag--on-bold":this.background==="bold","tag--on-strong":this.background==="strong","tag--on-always-dark":this.background==="always-dark"};return a(n,{key:"0465a0cef7f58a28ac7ee8318284d25f74055fe2",class:i,style:e,onClick:this.handleClick,onKeyDown:this.handleKeyDown,role:"button",tabIndex:this.inactive?-1:0,"aria-pressed":String(this.pressed),"aria-disabled":this.inactive||undefined},a("span",{key:"c50920e9cc5327f2df7d897965806f05b4b829fb",class:"tag__icon-slot",style:{fontSize:`${r}px`,lineHeight:"0"}},a("slot",{key:"73de9e56c10cc010b556211b510f99b74704eb0d",name:"icon"})),a("span",{key:"accc39da131dac3c21234be3295df50e44a18410",class:{tag__label:true,[t]:true}},this.label),this.removable&&a("button",{key:"554ad5a68b643ca616950c7125e1899b0b5f8a0b",type:"button",class:"tag__remove",onClick:this.handleRemove,"aria-label":`Remove ${this.label}`,tabIndex:-1},a("slot",{key:"b928b40dddef49be8dd548405da6a94d6c72ef77",name:"remove-icon"},a("span",{key:"5d7826d02d301157ec51404b626f584864aa4526",class:"tag__remove-x",style:{fontSize:`${r}px`,lineHeight:"0"}},"✕"))))}static get style(){return i()}},[262,"ds-chip",{label:[1],intent:[1],contrast:[1],elevation:[1],size:[1],rounded:[4],removable:[4],maxWidth:[8,"max-width"],inactive:[4],background:[1],pressed:[1028]}]);function g(){if(typeof customElements==="undefined"){return}const o=["ds-chip"];o.forEach((o=>{switch(o){case"ds-chip":if(!customElements.get(e(o))){customElements.define(e(o),d)}break}}))}g();const l=d;const h=g;export{l as DsChip,h as defineCustomElement};
|
|
2
2
|
//# sourceMappingURL=ds-chip.js.map
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{p as i,H as e,h as d,a as r,t as s}from"./index.js";const a=()=>`.sc-ds-divider-h{--_divider-color:var(--color-divider-divider);--_divider-inset:0;--_divider-length:100%;display:block;flex-shrink:0;width:var(--_divider-length);height:var(--dimension-stroke-width-012);margin:0 var(--_divider-inset);border:none;background-color:var(--_divider-color)}.divider--vertical.sc-ds-divider-h{width:var(--dimension-stroke-width-012);height:var(--_divider-length);min-height:var(--dimension-stroke-width-012);margin:var(--_divider-inset) 0;align-self:stretch}.divider--vertical.divider--custom-length.sc-ds-divider-h{align-self:center}[surface='on-bold-background'].sc-ds-divider-h,.divider--surface-on-bold-background.sc-ds-divider-h{--_divider-color:var(--color-divider-on-bold-background)}[surface='on-strong-background'].sc-ds-divider-h,.divider--surface-on-strong-background.sc-ds-divider-h{--_divider-color:var(--color-divider-on-strong-background)}[surface='on-medium-background'].sc-ds-divider-h,.divider--surface-on-medium-background.sc-ds-divider-h{--_divider-color:var(--color-divider-on-medium-background)}[surface='on-translucent-background'].sc-ds-divider-h,.divider--surface-on-translucent-background.sc-ds-divider-h{--_divider-color:var(--color-divider-on-translucent-background)}[surface='navigation'].sc-ds-divider-h,.divider--surface-navigation.sc-ds-divider-h{--_divider-color:var(--color-navigation-divider)}[surface='media'].sc-ds-divider-h,.divider--surface-media.sc-ds-divider-h{--_divider-color:var(--color-media-divider)}[surface='always-dark'].sc-ds-divider-h,.divider--surface-always-dark.sc-ds-divider-h{--_divider-color:var(--color-always-dark-divider)}[surface='inverted'].sc-ds-divider-h,.divider--surface-inverted.sc-ds-divider-h{--_divider-color:var(--color-inverted-divider)}`;const n={none:"0","space-000":"var(--dimension-space-000)","space-012":"var(--dimension-space-012)","space-025":"var(--dimension-space-025)","space-050":"var(--dimension-space-050)","space-075":"var(--dimension-space-075)","space-100":"var(--dimension-space-100)","space-125":"var(--dimension-space-125)","space-150":"var(--dimension-space-150)","space-175":"var(--dimension-space-175)","space-200":"var(--dimension-space-200)","space-250":"var(--dimension-space-250)","space-300":"var(--dimension-space-300)","space-400":"var(--dimension-space-400)","space-600":"var(--dimension-space-600)","space-800":"var(--dimension-space-800)"};const c=i(class i extends e{constructor(i){super();if(i!==false){this.__registerHost()}this.orientation="horizontal";this.surface="default";this.inset="none";this.length="auto";this.semantic=false}resolveInset(){return Object.prototype.hasOwnProperty.call(n,this.inset)?n[this.inset]:this.inset}resolveLength(){return this.length==="auto"||this.length==="full"?"100%":this.length}render(){const i=this.orientation==="vertical";const e=this.length!=="auto"&&this.length!=="full";return d(r,{key:"
|
|
1
|
+
import{p as i,H as e,h as d,a as r,t as s}from"./index.js";const a=()=>`.sc-ds-divider-h{--_divider-color:var(--color-divider-divider);--_divider-inset:0;--_divider-length:100%;display:block;flex-shrink:0;width:var(--_divider-length);height:var(--dimension-stroke-width-012);margin:0 var(--_divider-inset);border:none;background-color:var(--_divider-color)}.divider--vertical.sc-ds-divider-h{width:var(--dimension-stroke-width-012);height:var(--_divider-length);min-height:var(--dimension-stroke-width-012);margin:var(--_divider-inset) 0;align-self:stretch}.divider--vertical.divider--custom-length.sc-ds-divider-h{align-self:center}[surface='on-bold-background'].sc-ds-divider-h,.divider--surface-on-bold-background.sc-ds-divider-h{--_divider-color:var(--color-divider-on-bold-background)}[surface='on-strong-background'].sc-ds-divider-h,.divider--surface-on-strong-background.sc-ds-divider-h{--_divider-color:var(--color-divider-on-strong-background)}[surface='on-medium-background'].sc-ds-divider-h,.divider--surface-on-medium-background.sc-ds-divider-h{--_divider-color:var(--color-divider-on-medium-background)}[surface='on-translucent-background'].sc-ds-divider-h,.divider--surface-on-translucent-background.sc-ds-divider-h{--_divider-color:var(--color-divider-on-translucent-background)}[surface='navigation'].sc-ds-divider-h,.divider--surface-navigation.sc-ds-divider-h{--_divider-color:var(--color-navigation-divider)}[surface='media'].sc-ds-divider-h,.divider--surface-media.sc-ds-divider-h{--_divider-color:var(--color-media-divider)}[surface='always-dark'].sc-ds-divider-h,.divider--surface-always-dark.sc-ds-divider-h{--_divider-color:var(--color-always-dark-divider)}[surface='inverted'].sc-ds-divider-h,.divider--surface-inverted.sc-ds-divider-h{--_divider-color:var(--color-inverted-divider)}`;const n={none:"0","space-000":"var(--dimension-space-000)","space-012":"var(--dimension-space-012)","space-025":"var(--dimension-space-025)","space-050":"var(--dimension-space-050)","space-075":"var(--dimension-space-075)","space-100":"var(--dimension-space-100)","space-125":"var(--dimension-space-125)","space-150":"var(--dimension-space-150)","space-175":"var(--dimension-space-175)","space-200":"var(--dimension-space-200)","space-250":"var(--dimension-space-250)","space-300":"var(--dimension-space-300)","space-400":"var(--dimension-space-400)","space-600":"var(--dimension-space-600)","space-800":"var(--dimension-space-800)"};const c=i(class i extends e{constructor(i){super();if(i!==false){this.__registerHost()}this.orientation="horizontal";this.surface="default";this.inset="none";this.length="auto";this.semantic=false}resolveInset(){return Object.prototype.hasOwnProperty.call(n,this.inset)?n[this.inset]:this.inset}resolveLength(){return this.length==="auto"||this.length==="full"?"100%":this.length}render(){const i=this.orientation==="vertical";const e=this.length!=="auto"&&this.length!=="full";return d(r,{key:"a9e79ad8e31b1c7e49c33427e73dca4eee885096",role:this.semantic?"separator":undefined,"aria-orientation":this.semantic?this.orientation:undefined,"aria-hidden":this.semantic?undefined:"true",class:{divider:true,"divider--vertical":i,"divider--custom-length":e,[`divider--surface-${this.surface}`]:true},style:{"--_divider-inset":this.resolveInset(),"--_divider-length":this.resolveLength()}})}static get style(){return a()}},[2,"ds-divider",{orientation:[1],surface:[1],inset:[1],length:[1],semantic:[4]}]);function o(){if(typeof customElements==="undefined"){return}const i=["ds-divider"];i.forEach((i=>{switch(i){case"ds-divider":if(!customElements.get(s(i))){customElements.define(s(i),c)}break}}))}o();const t=c;const v=o;export{t as DsDivider,v as defineCustomElement};
|
|
2
2
|
//# sourceMappingURL=ds-divider.js.map
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{p as t,H as e,h as s,a,t as
|
|
1
|
+
import{p as t,H as e,h as s,a as c,t as n}from"./index.js";const o=()=>`.sc-ds-empty-state-h{display:block;width:100%;height:100%}.empty-state.sc-ds-empty-state{display:flex;align-items:center;justify-content:center;height:100%;min-height:400px;width:100%}.empty-state.sc-ds-empty-state p.sc-ds-empty-state{margin:0}`;const a={"no-content":"No page contents to display.","no-results":"No results found.","no-results-filter":"No results found. Please update search criteria.","no-access":"You don't have access to this page."};const d=t(class t extends e{constructor(t){super();if(t!==false){this.__registerHost()}this.type="no-content"}render(){return s(c,{key:"452f3dc088c95f003eff619455435893e613b794"},s("div",{key:"8cf7988d365c275dbe997961f22a77e9150dc04b",class:"empty-state"},s("p",{key:"d5ffda6a2ff29428c6247f470e4f2c28635f288b",class:"text-body-medium",style:{color:"var(--color-foreground-secondary)"}},this.message||a[this.type])))}static get style(){return o()}},[2,"ds-empty-state",{type:[1],message:[1]}]);function i(){if(typeof customElements==="undefined"){return}const t=["ds-empty-state"];t.forEach((t=>{switch(t){case"ds-empty-state":if(!customElements.get(n(t))){customElements.define(n(t),d)}break}}))}i();const r=d;const f=i;export{r as DsEmptyState,f as defineCustomElement};
|
|
2
2
|
//# sourceMappingURL=ds-empty-state.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["emptyStateCss","DEFAULT_MESSAGES","EmptyState","__stencil_proxyCustomElement","HTMLElement","constructor","registerHost","this","type","render","h","Host","key","class","style","color","message"],"sources":["src/wc/components/EmptyState/EmptyState.css?tag=ds-empty-state&encapsulation=scoped","src/wc/components/EmptyState/EmptyState.tsx"],"sourcesContent":[":host {\n display: block;\n width: 100%;\n height: 100%;\n}\n\n.empty-state {\n display: flex;\n align-items: center;\n justify-content: center;\n height: 100%;\n min-height: 400px;\n width: 100%;\n}\n\n.empty-state p {\n margin: 0;\n}\n","import { Component, Prop, h, Host } from '@stencil/core';\n\nexport type EmptyStateType = 'no-content' | 'no-results' | 'no-results-filter' | 'no-access';\n\nconst DEFAULT_MESSAGES: Record<EmptyStateType, string> = {\n 'no-content': 'No page contents to display.',\n 'no-results': 'No results found.',\n 'no-results-filter': 'No results found. Please update search criteria.',\n 'no-access': \"You don't have access to this page.\",\n};\n\n@Component({\n tag: 'ds-empty-state',\n styleUrl: 'EmptyState.css',\n scoped: true,\n})\nexport class EmptyState {\n @Prop() type: EmptyStateType = 'no-content';\n @Prop() message: string | undefined;\n\n render() {\n return (\n <Host>\n <div class=\"empty-state\">\n <p class=\"text-body-medium\" style={{ color: 'var(--color-foreground-secondary)' }}>\n {this.message || DEFAULT_MESSAGES[this.type]}\n </p>\n </div>\n </Host>\n );\n }\n}\n"],"mappings":"
|
|
1
|
+
{"version":3,"names":["emptyStateCss","DEFAULT_MESSAGES","EmptyState","__stencil_proxyCustomElement","HTMLElement","constructor","registerHost","this","type","render","h","Host","key","class","style","color","message"],"sources":["src/wc/components/EmptyState/EmptyState.css?tag=ds-empty-state&encapsulation=scoped","src/wc/components/EmptyState/EmptyState.tsx"],"sourcesContent":[":host {\n display: block;\n width: 100%;\n height: 100%;\n}\n\n.empty-state {\n display: flex;\n align-items: center;\n justify-content: center;\n height: 100%;\n min-height: 400px;\n width: 100%;\n}\n\n.empty-state p {\n margin: 0;\n}\n","import { Component, Prop, h, Host } from '@stencil/core';\n\nexport type EmptyStateType = 'no-content' | 'no-results' | 'no-results-filter' | 'no-access';\n\nconst DEFAULT_MESSAGES: Record<EmptyStateType, string> = {\n 'no-content': 'No page contents to display.',\n 'no-results': 'No results found.',\n 'no-results-filter': 'No results found. Please update search criteria.',\n 'no-access': \"You don't have access to this page.\",\n};\n\n@Component({\n tag: 'ds-empty-state',\n styleUrl: 'EmptyState.css',\n scoped: true,\n})\nexport class EmptyState {\n @Prop() type: EmptyStateType = 'no-content';\n @Prop() message: string | undefined;\n\n render() {\n return (\n <Host>\n <div class=\"empty-state\">\n <p class=\"text-body-medium\" style={{ color: 'var(--color-foreground-secondary)' }}>\n {this.message || DEFAULT_MESSAGES[this.type]}\n </p>\n </div>\n </Host>\n );\n }\n}\n"],"mappings":"2DAAA,MAAMA,EAAgB,IAAM,uPCI5B,MAAMC,EAAmD,CACvD,aAAc,+BACd,aAAc,oBACd,oBAAqB,mDACrB,YAAa,uC,MAQFC,EAAUC,EAAA,MAAAD,UAAAE,EALvB,WAAAC,CAAAC,G,4CAMUC,KAAAC,KAAuB,YAchC,CAXC,MAAAC,GACE,OACEC,EAACC,EAAI,CAAAC,IAAA,4CACHF,EAAA,OAAAE,IAAA,2CAAKC,MAAM,eACTH,EAAA,KAAAE,IAAA,2CAAGC,MAAM,mBAAmBC,MAAO,CAAEC,MAAO,sCACzCR,KAAKS,SAAWf,EAAiBM,KAAKC,Q","ignoreList":[]}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{p as e,H as s,h as a,a as t,t as d}from"./index.js";import{s as i,a as r}from"./p-CBUIn8dk.js";const o=()=>`.scroll-edge-fade.sc-ds-fade{--ds-scroll-edge-fade-size:var(--dimension-size-600)}.scroll-edge-fade--top.sc-ds-fade{-webkit-mask-image:linear-gradient(to bottom, #000 0, #000 50%, transparent 100%);mask-image:linear-gradient(to bottom, #000 0, #000 50%, transparent 100%);-webkit-mask-size:100% 100%;mask-size:100% 100%}.scroll-edge-fade--bottom.sc-ds-fade{-webkit-mask-image:linear-gradient( to bottom, #000 0, #000 calc(100% - var(--ds-scroll-edge-fade-size)), transparent 100% );mask-image:linear-gradient( to bottom, #000 0, #000 calc(100% - var(--ds-scroll-edge-fade-size)), transparent 100% );-webkit-mask-size:100% 100%;mask-size:100% 100%}.scroll-edge-fade--left.sc-ds-fade{-webkit-mask-image:linear-gradient( to right, #000 0, #000 calc(100% - var(--ds-scroll-edge-fade-size)), transparent 100% );mask-image:linear-gradient( to right, #000 0, #000 calc(100% - var(--ds-scroll-edge-fade-size)), transparent 100% );-webkit-mask-size:100% 100%;mask-size:100% 100%}.scroll-edge-fade--right.sc-ds-fade{-webkit-mask-image:linear-gradient( to left, #000 0, #000 calc(100% - var(--ds-scroll-edge-fade-size)), transparent 100% );mask-image:linear-gradient( to left, #000 0, #000 calc(100% - var(--ds-scroll-edge-fade-size)), transparent 100% );-webkit-mask-size:100% 100%;mask-size:100% 100%}.scroll-edge-fade--at-end.sc-ds-fade,.scroll-edge-fade--hidden.sc-ds-fade{-webkit-mask-image:none;mask-image:none}.sc-ds-fade-h{display:block;height:100%;box-sizing:border-box}.fade__scroll.sc-ds-fade{height:100%;overflow:auto;box-sizing:border-box}`;const
|
|
1
|
+
import{p as e,H as s,h as a,a as t,t as d}from"./index.js";import{s as i,a as r}from"./p-CBUIn8dk.js";const o=()=>`.scroll-edge-fade.sc-ds-fade{--ds-scroll-edge-fade-size:var(--dimension-size-600)}.scroll-edge-fade--top.sc-ds-fade{-webkit-mask-image:linear-gradient(to bottom, #000 0, #000 50%, transparent 100%);mask-image:linear-gradient(to bottom, #000 0, #000 50%, transparent 100%);-webkit-mask-size:100% 100%;mask-size:100% 100%}.scroll-edge-fade--bottom.sc-ds-fade{-webkit-mask-image:linear-gradient( to bottom, #000 0, #000 calc(100% - var(--ds-scroll-edge-fade-size)), transparent 100% );mask-image:linear-gradient( to bottom, #000 0, #000 calc(100% - var(--ds-scroll-edge-fade-size)), transparent 100% );-webkit-mask-size:100% 100%;mask-size:100% 100%}.scroll-edge-fade--left.sc-ds-fade{-webkit-mask-image:linear-gradient( to right, #000 0, #000 calc(100% - var(--ds-scroll-edge-fade-size)), transparent 100% );mask-image:linear-gradient( to right, #000 0, #000 calc(100% - var(--ds-scroll-edge-fade-size)), transparent 100% );-webkit-mask-size:100% 100%;mask-size:100% 100%}.scroll-edge-fade--right.sc-ds-fade{-webkit-mask-image:linear-gradient( to left, #000 0, #000 calc(100% - var(--ds-scroll-edge-fade-size)), transparent 100% );mask-image:linear-gradient( to left, #000 0, #000 calc(100% - var(--ds-scroll-edge-fade-size)), transparent 100% );-webkit-mask-size:100% 100%;mask-size:100% 100%}.scroll-edge-fade--at-end.sc-ds-fade,.scroll-edge-fade--hidden.sc-ds-fade{-webkit-mask-image:none;mask-image:none}.sc-ds-fade-h{display:block;height:100%;box-sizing:border-box}.fade__scroll.sc-ds-fade{height:100%;overflow:auto;box-sizing:border-box}`;const n=e(class e extends s{constructor(e){super();if(e!==false){this.__registerHost()}this.side="bottom";this.size="size-600";this.visible=true}render(){return a(t,{key:"167df54396bc0d4fff2335254bd48398785ee117"},a("div",{key:"576b3aff27a66ab3d6a5067627f333fe2c64330e",class:{fade__scroll:true,...r({edges:this.side,hidden:!this.visible})},style:i(this.size,this.height)},a("slot",{key:"3f8afcaf1f1f06c08291e6ed9317f8d39d0acc6c"})))}static get style(){return o()}},[262,"ds-fade",{side:[1],size:[1],height:[1],visible:[4]}]);function l(){if(typeof customElements==="undefined"){return}const e=["ds-fade"];e.forEach((e=>{switch(e){case"ds-fade":if(!customElements.get(d(e))){customElements.define(d(e),n)}break}}))}l();const c=n;const f=l;export{c as DsFade,f as defineCustomElement};
|
|
2
2
|
//# sourceMappingURL=ds-fade.js.map
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{p as e,H as s,h as d,a as l,t}from"./index.js";const c=()=>`.sc-ds-field-h{display:block}.field.sc-ds-field{display:flex;flex-direction:column;gap:var(--dimension-space-050)}.field__label.sc-ds-field{display:block}`;let i=0;const
|
|
1
|
+
import{p as e,H as s,h as d,a as l,t}from"./index.js";const c=()=>`.sc-ds-field-h{display:block}.field.sc-ds-field{display:flex;flex-direction:column;gap:var(--dimension-space-050)}.field__label.sc-ds-field{display:block}`;let i=0;const f=e(class e extends s{constructor(e){super();if(e!==false){this.__registerHost()}this.resolvedId=`ds-field-${++i}`}render(){const e=this.fieldId||this.resolvedId;return d(l,{key:"154ef5697d15acc54c2d99aa9369fe1a993accfb"},d("div",{key:"0d0487d87fe2eb6995c7a2ee03ff22eea89051ca",class:"field"},d("label",{key:"d21d011ca84f23f6abe439fb184d319c6a60e32f",class:"text-body-small-emphasis field__label",htmlFor:e},this.label),d("slot",{key:"9791ec917068cef75305e7a84cbfef33dd54dddd"})))}static get style(){return c()}},[262,"ds-field",{label:[1],fieldId:[1,"field-id"]}]);function a(){if(typeof customElements==="undefined"){return}const e=["ds-field"];e.forEach((e=>{switch(e){case"ds-field":if(!customElements.get(t(e))){customElements.define(t(e),f)}break}}))}a();const n=f;const o=a;export{n as DsField,o as defineCustomElement};
|
|
2
2
|
//# sourceMappingURL=ds-field.js.map
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{p as e,H as
|
|
1
|
+
import{p as e,H as r,h as s,a,t as d}from"./index.js";const c=()=>`.sc-ds-header-h{display:flex;align-items:center;justify-content:space-between;height:var(--dimension-size-600, 48px);padding:0 var(--dimension-space-100);flex-shrink:0;gap:var(--dimension-space-100);border-bottom:var(--dimension-stroke-width-015) solid var(--color-border-tertiary);box-sizing:border-box}.bg-primary.sc-ds-header-h{background-color:var(--color-background-primary)}.bg-secondary.sc-ds-header-h{background-color:var(--color-background-secondary)}.bg-transparent.sc-ds-header-h{background-color:transparent}.bg-translucent.sc-ds-header-h{background-color:var(--color-background-translucent);backdrop-filter:blur(var(--effect-blur-md));-webkit-backdrop-filter:blur(var(--effect-blur-md))}.left.sc-ds-header{display:flex;align-items:center;gap:var(--dimension-space-100);flex-shrink:0;min-width:0}.title.sc-ds-header{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.center.sc-ds-header{display:flex;align-items:center;justify-content:center;gap:var(--dimension-space-050);flex:1;min-width:0}.right.sc-ds-header{display:flex;align-items:center;gap:var(--dimension-space-050);flex-shrink:0}`;const t=e(class e extends r{constructor(e){super();if(e!==false){this.__registerHost()}this.background="secondary"}render(){return s(a,{key:"582bd542b6447ced6cc66144e906bf0cf8fdc580",class:{header:true,[`bg-${this.background}`]:true},role:"banner"},s("div",{key:"99f7eb72f19e7de12127559b8e41c542ebadb244",class:"left"},s("slot",{key:"cb8b7e3eb281d4895ad80dc45ec924dfe775afd4",name:"left"}),this.heading&&s("span",{key:"853d46a3d631c2f4cd42b07d28759fefdf623cdf",class:"title text-title-small"},this.heading)),s("div",{key:"438d9b039dad0c9e11fa24734bfff287706704bc",class:"center"},s("slot",{key:"6176e5d35bbbdce7c62ee0af91ddc5f528ffa7a9",name:"center"})),s("div",{key:"c2a09f30c23df0af7da6c37c88193223defae7cb",class:"right"},s("slot",{key:"204f71f84780469d01b4b91d6970c2ac16ba8c22",name:"right"})))}static get style(){return c()}},[262,"ds-header",{heading:[1],background:[1]}]);function n(){if(typeof customElements==="undefined"){return}const e=["ds-header"];e.forEach((e=>{switch(e){case"ds-header":if(!customElements.get(d(e))){customElements.define(d(e),t)}break}}))}n();const i=t;const o=n;export{i as DsHeader,o as defineCustomElement};
|
|
2
2
|
//# sourceMappingURL=ds-header.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["headerCss","Header","__stencil_proxyCustomElement","HTMLElement","constructor","registerHost","this","background","render","h","Host","key","class","header","role","name","heading"],"sources":["src/wc/components/Header/Header.css?tag=ds-header&encapsulation=scoped","src/wc/components/Header/Header.tsx"],"sourcesContent":[":host {\n display: flex;\n align-items: center;\n justify-content: space-between;\n height: var(--dimension-size-600, 48px);\n padding: 0 var(--dimension-space-100);\n flex-shrink: 0;\n gap: var(--dimension-space-100);\n border-bottom: var(--dimension-stroke-width-015) solid var(--color-border-tertiary);\n box-sizing: border-box;\n}\n\n/* Backgrounds */\n:host(.bg-primary) { background-color: var(--color-background-primary); }\n:host(.bg-secondary) { background-color: var(--color-background-secondary); }\n:host(.bg-transparent) { background-color: transparent; }\n:host(.bg-translucent) {\n background-color: var(--color-background-translucent);\n backdrop-filter: blur(var(--effect-blur-md));\n -webkit-backdrop-filter: blur(var(--effect-blur-md));\n}\n\n.left {\n display: flex;\n align-items: center;\n gap: var(--dimension-space-100);\n flex-shrink: 0;\n min-width: 0;\n}\n\n.title {\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n}\n\n.center {\n display: flex;\n align-items: center;\n justify-content: center;\n gap: var(--dimension-space-050);\n flex: 1;\n min-width: 0;\n}\n\n.right {\n display: flex;\n align-items: center;\n gap: var(--dimension-space-050);\n flex-shrink: 0;\n}\n","import { Component, Prop, h, Host } from '@stencil/core';\n\nexport type HeaderBackground = 'primary' | 'secondary' | 'transparent' | 'translucent';\n\n@Component({\n tag: 'ds-header',\n styleUrl: 'Header.css',\n scoped: true,\n})\nexport class Header {\n @Prop() heading: string | undefined;\n @Prop() background: HeaderBackground = 'secondary';\n\n render() {\n return (\n <Host\n class={{ header: true, [`bg-${this.background}`]: true }}\n role=\"banner\"\n >\n <div class=\"left\">\n <slot name=\"left\" />\n {this.heading && <span class=\"title text-title-small\">{this.heading}</span>}\n </div>\n <div class=\"center\">\n <slot name=\"center\" />\n </div>\n <div class=\"right\">\n <slot name=\"right\" />\n </div>\n </Host>\n );\n }\n}\n"],"mappings":"
|
|
1
|
+
{"version":3,"names":["headerCss","Header","__stencil_proxyCustomElement","HTMLElement","constructor","registerHost","this","background","render","h","Host","key","class","header","role","name","heading"],"sources":["src/wc/components/Header/Header.css?tag=ds-header&encapsulation=scoped","src/wc/components/Header/Header.tsx"],"sourcesContent":[":host {\n display: flex;\n align-items: center;\n justify-content: space-between;\n height: var(--dimension-size-600, 48px);\n padding: 0 var(--dimension-space-100);\n flex-shrink: 0;\n gap: var(--dimension-space-100);\n border-bottom: var(--dimension-stroke-width-015) solid var(--color-border-tertiary);\n box-sizing: border-box;\n}\n\n/* Backgrounds */\n:host(.bg-primary) { background-color: var(--color-background-primary); }\n:host(.bg-secondary) { background-color: var(--color-background-secondary); }\n:host(.bg-transparent) { background-color: transparent; }\n:host(.bg-translucent) {\n background-color: var(--color-background-translucent);\n backdrop-filter: blur(var(--effect-blur-md));\n -webkit-backdrop-filter: blur(var(--effect-blur-md));\n}\n\n.left {\n display: flex;\n align-items: center;\n gap: var(--dimension-space-100);\n flex-shrink: 0;\n min-width: 0;\n}\n\n.title {\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n}\n\n.center {\n display: flex;\n align-items: center;\n justify-content: center;\n gap: var(--dimension-space-050);\n flex: 1;\n min-width: 0;\n}\n\n.right {\n display: flex;\n align-items: center;\n gap: var(--dimension-space-050);\n flex-shrink: 0;\n}\n","import { Component, Prop, h, Host } from '@stencil/core';\n\nexport type HeaderBackground = 'primary' | 'secondary' | 'transparent' | 'translucent';\n\n@Component({\n tag: 'ds-header',\n styleUrl: 'Header.css',\n scoped: true,\n})\nexport class Header {\n @Prop() heading: string | undefined;\n @Prop() background: HeaderBackground = 'secondary';\n\n render() {\n return (\n <Host\n class={{ header: true, [`bg-${this.background}`]: true }}\n role=\"banner\"\n >\n <div class=\"left\">\n <slot name=\"left\" />\n {this.heading && <span class=\"title text-title-small\">{this.heading}</span>}\n </div>\n <div class=\"center\">\n <slot name=\"center\" />\n </div>\n <div class=\"right\">\n <slot name=\"right\" />\n </div>\n </Host>\n );\n }\n}\n"],"mappings":"sDAAA,MAAMA,EAAY,IAAM,wlC,MCSXC,EAAMC,EAAA,MAAAD,UAAAE,EALnB,WAAAC,CAAAC,G,4CAOUC,KAAAC,WAA+B,WAqBxC,CAnBC,MAAAC,GACE,OACEC,EAACC,EAAI,CAAAC,IAAA,2CACHC,MAAO,CAAEC,OAAQ,KAAM,CAAC,MAAMP,KAAKC,cAAe,MAClDO,KAAK,UAELL,EAAA,OAAAE,IAAA,2CAAKC,MAAM,QACTH,EAAA,QAAAE,IAAA,2CAAMI,KAAK,SACVT,KAAKU,SAAWP,EAAA,QAAAE,IAAA,2CAAMC,MAAM,0BAA0BN,KAAKU,UAE9DP,EAAA,OAAAE,IAAA,2CAAKC,MAAM,UACTH,EAAA,QAAAE,IAAA,2CAAMI,KAAK,YAEbN,EAAA,OAAAE,IAAA,2CAAKC,MAAM,SACTH,EAAA,QAAAE,IAAA,2CAAMI,KAAK,W","ignoreList":[]}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{I as o,d as s}from"./p-
|
|
1
|
+
import{I as o,d as s}from"./p-8Nt92j1-.js";const t=o;const p=s;export{t as DsIcon,p as defineCustomElement};
|
|
2
2
|
//# sourceMappingURL=ds-icon.js.map
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{p as e,H as i,c as s,h as t,a as r,t as a}from"./index.js";const n=()=>`.input-container.sc-ds-input{display:flex;flex-direction:column;gap:var(--dimension-space-050);width:100%}.wrapper.sc-ds-input{width:100%;height:var(--dimension-size-400);display:flex;align-items:center;background-color:var(--color-background-primary);border-radius:var(--dimension-radius-075);box-shadow:var(--effect-elevation-depressed-sm);box-sizing:border-box}.wrapper.sc-ds-input:focus-within{box-shadow:inset 0 0 0 1.25px var(--color-foreground-bold-brand)}.wrapper--error.sc-ds-input{box-shadow:inset 0 0 0 1.25px var(--color-border-bold-negative)}.wrapper--error.sc-ds-input:focus-within{box-shadow:inset 0 0 0 1.25px var(--color-border-bold-negative)}.row.sc-ds-input{display:flex;align-items:center;width:100%;height:100%;gap:var(--dimension-space-050)}.native-input.sc-ds-input{flex:1;min-width:0;height:100%;padding:0 var(--dimension-space-100);background:transparent;border:none;outline:none;font-family:inherit;font-size:var(--typography-fontsize-md);line-height:var(--typography-lineheight-md);color:var(--color-foreground-primary);border-radius:var(--dimension-radius-075);-webkit-appearance:none;appearance:none}.native-input.sc-ds-input:disabled{opacity:0.5;cursor:not-allowed}.native-input.sc-ds-input::placeholder{color:var(--color-foreground-secondary)}.native-input.sc-ds-input:focus::placeholder{color:var(--color-foreground-tertiary)}.native-input[type='search'].sc-ds-input::-webkit-search-cancel-button,.native-input[type='search'].sc-ds-input::-webkit-search-decoration{display:none}.clear-btn.sc-ds-input{flex-shrink:0;margin-right:var(--dimension-space-050);padding:var(--dimension-space-050);border:none;background:none;cursor:pointer;color:var(--color-foreground-secondary);border-radius:var(--dimension-radius-050);display:flex;align-items:center;justify-content:center;font-size:16px;line-height:1}.clear-btn.sc-ds-input:hover{background-color:var(--color-interaction-hover)}.suffix.sc-ds-input{display:flex;align-items:center;flex-shrink:0;margin-right:var(--dimension-space-050)}.suffix.sc-ds-input:empty{display:none}.error-text.sc-ds-input{font-size:var(--typography-fontsize-sm);line-height:var(--typography-lineheight-sm);color:var(--color-foreground-bold-negative)}`;let o=0;const
|
|
1
|
+
import{p as e,H as i,c as s,h as t,a as r,t as a}from"./index.js";const n=()=>`.input-container.sc-ds-input{display:flex;flex-direction:column;gap:var(--dimension-space-050);width:100%}.wrapper.sc-ds-input{width:100%;height:var(--dimension-size-400);display:flex;align-items:center;background-color:var(--color-background-primary);border-radius:var(--dimension-radius-075);box-shadow:var(--effect-elevation-depressed-sm);box-sizing:border-box}.wrapper.sc-ds-input:focus-within{box-shadow:inset 0 0 0 1.25px var(--color-foreground-bold-brand)}.wrapper--error.sc-ds-input{box-shadow:inset 0 0 0 1.25px var(--color-border-bold-negative)}.wrapper--error.sc-ds-input:focus-within{box-shadow:inset 0 0 0 1.25px var(--color-border-bold-negative)}.row.sc-ds-input{display:flex;align-items:center;width:100%;height:100%;gap:var(--dimension-space-050)}.native-input.sc-ds-input{flex:1;min-width:0;height:100%;padding:0 var(--dimension-space-100);background:transparent;border:none;outline:none;font-family:inherit;font-size:var(--typography-fontsize-md);line-height:var(--typography-lineheight-md);color:var(--color-foreground-primary);border-radius:var(--dimension-radius-075);-webkit-appearance:none;appearance:none}.native-input.sc-ds-input:disabled{opacity:0.5;cursor:not-allowed}.native-input.sc-ds-input::placeholder{color:var(--color-foreground-secondary)}.native-input.sc-ds-input:focus::placeholder{color:var(--color-foreground-tertiary)}.native-input[type='search'].sc-ds-input::-webkit-search-cancel-button,.native-input[type='search'].sc-ds-input::-webkit-search-decoration{display:none}.clear-btn.sc-ds-input{flex-shrink:0;margin-right:var(--dimension-space-050);padding:var(--dimension-space-050);border:none;background:none;cursor:pointer;color:var(--color-foreground-secondary);border-radius:var(--dimension-radius-050);display:flex;align-items:center;justify-content:center;font-size:16px;line-height:1}.clear-btn.sc-ds-input:hover{background-color:var(--color-interaction-hover)}.suffix.sc-ds-input{display:flex;align-items:center;flex-shrink:0;margin-right:var(--dimension-space-050)}.suffix.sc-ds-input:empty{display:none}.error-text.sc-ds-input{font-size:var(--typography-fontsize-sm);line-height:var(--typography-lineheight-sm);color:var(--color-foreground-bold-negative)}`;let o=0;const d=e(class e extends i{constructor(e){super();if(e!==false){this.__registerHost()}this.dsChange=s(this,"dsChange");this.dsClear=s(this,"dsClear");this.generatedId=`ds-input-${++o}`;this.errorId=`${this.generatedId}-error`;this.value="";this.type="text";this.inactive=false;this.autoFocus=false;this.error=false;this.handleInput=e=>{this.dsChange.emit(e.target.value)};this.handleClear=()=>{this.dsChange.emit("");this.dsClear.emit();this.el.querySelector("input")?.focus()}}async setFocus(){this.el.querySelector("input")?.focus()}render(){const e=this.inputId??this.generatedId;const i=this.type==="search"&&this.value.length>0&&!this.inactive;const s=this.error&&Boolean(this.errorMessage);const a=[this.ariaDescribedby,s?this.errorId:undefined].filter(Boolean).join(" ")||undefined;return t(r,{key:"215418d9e24c49aab546792a49f00ab93b6532c3",class:"input-container"},t("div",{key:"afb8e90064eb9258a998e6fc5e37405d8f45cee8",class:{wrapper:true,"wrapper--error":this.error}},t("div",{key:"651fcd2ca36afe07e168ddc73fbb5676dd332fda",class:"row"},t("input",{key:"8b7027c8ed40273c90e7968afb5e06ffcbd951f1",type:this.type,id:e,value:this.value,placeholder:this.placeholder,disabled:this.inactive,autoFocus:this.autoFocus,class:"native-input","aria-label":this.ariaLabel,"aria-labelledby":this.ariaLabelledby,"aria-describedby":a,"aria-invalid":this.error||undefined,onInput:this.handleInput}),i&&t("button",{key:"0bc32a1f5e49a0fe138fd885cae7d1674c01db13",type:"button",class:"clear-btn",onClick:this.handleClear,"aria-label":"Clear"},t("span",{key:"66fb9bc862c86313507ca5ba0060e327db38e4c4","aria-hidden":"true"},"×")),t("span",{key:"3dc319f395c6c9721cc01cc447d97b6ce4231b5b",class:"suffix"},t("slot",{key:"71ea40da9ac752c0f49c55a38d227c0145051380",name:"suffix"})))),s&&t("div",{key:"50f20da4db88ebfe729bb1e30d46e74dad133aa5",id:this.errorId,role:"alert",class:"error-text"},this.errorMessage))}get el(){return this}static get style(){return n()}},[262,"ds-input",{value:[1],placeholder:[1],type:[1],inactive:[4],autoFocus:[4,"auto-focus"],error:[4],errorMessage:[1,"error-message"],inputId:[1,"input-id"],ariaLabel:[1,"aria-label"],ariaLabelledby:[1,"aria-labelledby"],ariaDescribedby:[1,"aria-describedby"],setFocus:[64]}]);function c(){if(typeof customElements==="undefined"){return}const e=["ds-input"];e.forEach((e=>{switch(e){case"ds-input":if(!customElements.get(a(e))){customElements.define(a(e),d)}break}}))}c();const l=d;const p=c;export{l as DsInput,p as defineCustomElement};
|
|
2
2
|
//# sourceMappingURL=ds-input.js.map
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{p as s,H as e,h as t,t as i}from"./index.js";import{T as r}from"./p-
|
|
1
|
+
import{p as s,H as e,h as t,t as i}from"./index.js";import{T as r}from"./p-bDf6yBQd.js";import{r as n}from"./p-BWUTr_XN.js";const o=()=>`:host{display:inline-flex;align-items:center;flex-shrink:0}.spinner{flex-shrink:0;animation:spin 0.75s linear infinite}.status{display:inline-flex;align-items:center}.visually-hidden{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0, 0, 0, 0);white-space:nowrap;border:0}@keyframes spin{from{transform:rotate(0deg)}to{transform:rotate(360deg)}}`;const a=s(class s extends e{constructor(s){super();if(s!==false){this.__registerHost()}this.__attachShadow();this.size=r.iconographyMd}get sizePx(){return n(this.size,r.iconographyMd)}render(){const s=`${this.sizePx}px`;const e=t("svg",{style:{width:s,height:s},viewBox:"0 0 16 16",fill:"none",class:"spinner","aria-hidden":"true"},t("circle",{cx:"8",cy:"8",r:"5",stroke:"currentColor","stroke-width":"1","stroke-linecap":"round","stroke-dasharray":"23.6 7.9"}));if(!this.label)return e;return t("span",{role:"status","aria-live":"polite",class:"status"},e,t("span",{class:"visually-hidden"},this.label))}static get style(){return o()}},[1,"ds-loader",{size:[8],label:[1]}]);function l(){if(typeof customElements==="undefined"){return}const s=["ds-loader"];s.forEach((s=>{switch(s){case"ds-loader":if(!customElements.get(i(s))){customElements.define(i(s),a)}break}}))}l();const d=a;const c=l;export{d as DsLoader,c as defineCustomElement};
|
|
2
2
|
//# sourceMappingURL=ds-loader.js.map
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{M as o,d as s}from"./p-
|
|
1
|
+
import{M as o,d as s}from"./p-CpNIQXz6.js";const p=o;const t=s;export{p as DsMenu,t as defineCustomElement};
|
|
2
2
|
//# sourceMappingURL=ds-menu.js.map
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{p as e,H as s,c as t,h as a,a as o,t as i}from"./index.js";import{r as d}from"./p-C1cBr-Ri.js";import{T as n}from"./p-
|
|
1
|
+
import{p as e,H as s,c as t,h as a,a as o,t as i}from"./index.js";import{r as d}from"./p-C1cBr-Ri.js";import{T as n}from"./p-bDf6yBQd.js";const l=()=>`.modal-backdrop.sc-ds-modal{background-color:var(--color-background-shade);backdrop-filter:blur(var(--effect-blur-sm));-webkit-backdrop-filter:blur(var(--effect-blur-sm));animation:modalBackdropIn var(--effect-motion-short-2) forwards;box-sizing:border-box}.modal-backdrop--closing.sc-ds-modal{animation:modalBackdropOut var(--effect-motion-short-3) forwards}@keyframes modalBackdropIn{from{opacity:0}to{opacity:1}}@keyframes modalBackdropOut{from{opacity:1}to{opacity:0}}.modal-dialog.sc-ds-modal{display:flex;flex-direction:column;max-height:calc(100vh - 2 * var(--dimension-space-200));overflow:hidden;background-color:var(--color-background-primary);border-radius:var(--dimension-radius-300);box-shadow:var(--effect-elevation-elevated-floating);animation:modalDialogIn var(--effect-motion-short-2) forwards;outline:none;box-sizing:border-box}.modal-backdrop--closing.sc-ds-modal .modal-dialog.sc-ds-modal{animation:modalDialogOut var(--effect-motion-short-3) forwards}@keyframes modalDialogIn{from{opacity:0;transform:scale(0.97) translateY(4px)}to{opacity:1;transform:scale(1) translateY(0)}}@keyframes modalDialogOut{from{opacity:1;transform:scale(1) translateY(0)}to{opacity:0;transform:scale(0.97) translateY(4px)}}.modal-header.sc-ds-modal{padding:var(--dimension-space-200) var(--dimension-space-200) var(--dimension-space-100);flex-shrink:0}.modal-title.sc-ds-modal{margin:0}.modal-subtitle.sc-ds-modal{margin-top:var(--dimension-space-100);color:var(--color-foreground-secondary);text-wrap:balance}.modal-body.sc-ds-modal{padding:var(--dimension-space-100) var(--dimension-space-200);overflow-y:auto;flex:1}.modal-footer.sc-ds-modal{padding:var(--dimension-space-100) var(--dimension-space-200) var(--dimension-space-200);flex-shrink:0}.modal-footer.sc-ds-modal:empty{display:none}`;const r={sm:"var(--dimension-modal-width-sm)",md:"var(--dimension-modal-width-md)",lg:"var(--dimension-modal-width-lg)"};const c=["a[href]","area[href]","button:not([disabled])",'input:not([disabled]):not([type="hidden"])',"select:not([disabled])","textarea:not([disabled])","iframe",'[contenteditable="true"]','[tabindex]:not([tabindex="-1"])'].join(",");let m=0;const f=e(class e extends s{constructor(e){super();if(e!==false){this.__registerHost()}this.dsClose=t(this,"dsClose");this.open=false;this.modalWidth="md";this.shouldRender=false;this.closing=false;this.instanceId=++m;this.titleId=`ds-modal-title-${m}`;this.subtitleId=`ds-modal-subtitle-${m}`;this.previousFocus=null;this.escapeHandler=null;this.tabHandler=null;this.closeTimer=null}componentDidLoad(){if(this.open)this.onOpenChange(true)}disconnectedCallback(){this.teardownListeners()}onOpenChange(e){if(e){this.shouldRender=true;this.closing=false;this.previousFocus=document.activeElement;requestAnimationFrame((()=>{this.focusFirst();this.setupListeners()}))}else if(this.shouldRender){this.closing=true;this.teardownListeners();this.closeTimer=setTimeout((()=>{this.shouldRender=false;this.closing=false;this.closeTimer=null;this.previousFocus?.focus?.();this.previousFocus=null}),this.closeAnimationMs)}}focusFirst(){const e=this.el.querySelector(".modal-dialog");if(!e)return;const s=this.getFocusables(e);(s[0]??e).focus()}getFocusables(e){return Array.from(e.querySelectorAll(c)).filter((e=>!e.hasAttribute("disabled")&&e.getAttribute("aria-hidden")!=="true"))}setupListeners(){this.escapeHandler=e=>{if(e.key==="Escape"){e.preventDefault();this.close()}};this.tabHandler=e=>{if(e.key!=="Tab")return;const s=this.el.querySelector(".modal-dialog");if(!s)return;const t=this.getFocusables(s);if(!t.length){e.preventDefault();s.focus();return}const a=t[0];const o=t[t.length-1];const i=document.activeElement;if(e.shiftKey){if(i===a||i===s||!s.contains(i)){e.preventDefault();o.focus()}}else{if(i===o||!s.contains(i)){e.preventDefault();a.focus()}}};document.addEventListener("keydown",this.escapeHandler);document.addEventListener("keydown",this.tabHandler)}teardownListeners(){if(this.escapeHandler){document.removeEventListener("keydown",this.escapeHandler);this.escapeHandler=null}if(this.tabHandler){document.removeEventListener("keydown",this.tabHandler);this.tabHandler=null}if(this.closeTimer){clearTimeout(this.closeTimer);this.closeTimer=null}}close(){this.dsClose.emit();this.open=false}handleBackdropMouseDown(e){if(e.target===e.currentTarget)this.close()}get resolvedWidth(){if(this.modalWidth==="sm"||this.modalWidth==="md"||this.modalWidth==="lg"){return r[this.modalWidth]}return this.modalWidth}get closeAnimationMs(){return d(n.motionShort3,n.animationDurationShort3)}render(){const e=!this.shouldRender&&!this.closing;return a(o,{key:"119e503da985fa5708c2c7905342970967a5c66c",style:{display:"contents"}},a("div",{key:"4705eb57c4e8db24f18fad413dd5de9dfbda6fb2",class:{"modal-backdrop":true,"modal-backdrop--closing":this.closing,"modal-backdrop--hidden":e},onMouseDown:e=>this.handleBackdropMouseDown(e),style:{position:"fixed",inset:"0",zIndex:"9999",display:e?"none":"flex",alignItems:"center",justifyContent:"center",padding:"var(--dimension-space-200)"}},a("div",{key:"985ae229ddf00b907770809f49b312c4e6c16bae",class:{"modal-dialog":true,"modal-dialog--closing":this.closing},role:"dialog","aria-modal":"true","aria-labelledby":this.titleId,"aria-describedby":this.subtitle?this.subtitleId:undefined,tabIndex:-1,style:{width:`min(${this.resolvedWidth}, calc(100vw - 2 * var(--dimension-space-200)))`}},a("div",{key:"64582583cd9048d0c3da4733ddef22fd9566677c",class:"modal-header"},a("h2",{key:"9ee14d042fd5756b25f913cc6e34efda94208f01",id:this.titleId,class:"text-title-small modal-title"},this.heading),this.subtitle&&a("div",{key:"66ae051aeb6d97cb96e373391ae2c4e1d81dbee8",id:this.subtitleId,class:"modal-subtitle text-body-medium"},this.subtitle)),a("div",{key:"d92b28b01b6cb1453822a0afd6536ffcb15b971b",class:"modal-body"},a("slot",{key:"3f2840e7549674939a5151313301bd2a34a84d14"})),a("div",{key:"3c5afd23204bfbf6d9018a5740651a4ecc242f9b",class:"modal-footer"},a("slot",{key:"159ec8278497d23cab8778b039282e7fc78428e2",name:"footer"})))))}get el(){return this}static get watchers(){return{open:[{onOpenChange:0}]}}static get style(){return l()}},[262,"ds-modal",{open:[1028],heading:[1],subtitle:[1],modalWidth:[1,"modal-width"],shouldRender:[32],closing:[32]},undefined,{open:[{onOpenChange:0}]}]);function h(){if(typeof customElements==="undefined"){return}const e=["ds-modal"];e.forEach((e=>{switch(e){case"ds-modal":if(!customElements.get(i(e))){customElements.define(i(e),f)}break}}))}h();const u=f;const b=h;export{u as DsModal,b as defineCustomElement};
|
|
2
2
|
//# sourceMappingURL=ds-modal.js.map
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{p as e,H as a,c as n,h as s,a as i,t}from"./index.js";import{a as o}from"./p-CBUIn8dk.js";import{d as r}from"./p-EK1hOP19.js";import{d}from"./p-B6ZyVOGV.js";import{d as l}from"./p-B7HWSpyT.js";import{d as c}from"./p-BGZjpSXm.js";import{a as v}from"./p-jjfqrXnP.js";const p={side:"right",align:"end",sideOffset:"calc(var(--dimension-space-100) + var(--dimension-space-050))",alignOffset:v.space050};const h="data-nav-style";function f(e){if(e==="dashboard"||e==="settings")return e;return undefined}function m(e,a,n){const s=f(a);if(s)return s;const i=typeof document!=="undefined"?document.documentElement.getAttribute(h):null;const t=f(i);if(t)return t;return e}function u(e,a){return e!==a}function g(e,a){return e===a||e.startsWith(`${a}/`)}function b(e,a){if(!e)return"";let n="";let s=0;for(const i of a){if(!i.href)continue;if(g(e,i.href)&&i.href.length>s){n=i.id;s=i.href.length}}return n}function _(e){return e.reduce(((e,a)=>e+a.items.length),0)}function y(e){if(Array.isArray(e))return e;if(typeof e==="string"){try{const a=JSON.parse(e);return Array.isArray(a)?a:[]}catch{return[]}}return[]}function x(e,a){if(e)return true;if(a===null)return false;return a!=="false"}function k(e,a){return _(e)===0&&_(y(a))>0}const w="ds-panel-nav-user-menu-anchor";const z=()=>`.scroll-edge-fade.sc-ds-panel-nav{--ds-scroll-edge-fade-size:var(--dimension-size-600)}.scroll-edge-fade--top.sc-ds-panel-nav{-webkit-mask-image:linear-gradient(to bottom, #000 0, #000 50%, transparent 100%);mask-image:linear-gradient(to bottom, #000 0, #000 50%, transparent 100%);-webkit-mask-size:100% 100%;mask-size:100% 100%}.scroll-edge-fade--bottom.sc-ds-panel-nav{-webkit-mask-image:linear-gradient( to bottom, #000 0, #000 calc(100% - var(--ds-scroll-edge-fade-size)), transparent 100% );mask-image:linear-gradient( to bottom, #000 0, #000 calc(100% - var(--ds-scroll-edge-fade-size)), transparent 100% );-webkit-mask-size:100% 100%;mask-size:100% 100%}.scroll-edge-fade--left.sc-ds-panel-nav{-webkit-mask-image:linear-gradient( to right, #000 0, #000 calc(100% - var(--ds-scroll-edge-fade-size)), transparent 100% );mask-image:linear-gradient( to right, #000 0, #000 calc(100% - var(--ds-scroll-edge-fade-size)), transparent 100% );-webkit-mask-size:100% 100%;mask-size:100% 100%}.scroll-edge-fade--right.sc-ds-panel-nav{-webkit-mask-image:linear-gradient( to left, #000 0, #000 calc(100% - var(--ds-scroll-edge-fade-size)), transparent 100% );mask-image:linear-gradient( to left, #000 0, #000 calc(100% - var(--ds-scroll-edge-fade-size)), transparent 100% );-webkit-mask-size:100% 100%;mask-size:100% 100%}.scroll-edge-fade--at-end.sc-ds-panel-nav,.scroll-edge-fade--hidden.sc-ds-panel-nav{-webkit-mask-image:none;mask-image:none}`;const C=()=>`.sc-ds-panel-nav-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-panel-nav: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-panel-nav{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-panel-nav:focus-visible{outline:none}.ds-focus-ring-inset.sc-ds-panel-nav: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-panel-nav{outline:none}.ds-focus-ring-inset.ds-focus-ring--visible.sc-ds-panel-nav::after{outline:var(--ds-focus-ring-width) solid var(--ds-focus-ring-color);outline-offset:calc(-1 * var(--ds-focus-ring-width))}.panel-nav.sc-ds-panel-nav{--_nav-width:var(--dimension-panel-width-2xs);--_nav-width-collapsed:var(--dimension-size-600);--_nav-item-height:var(--dimension-size-400, 32px);--_nav-padding-x:var(--dimension-space-100, 8px);--_nav-padding-y:var(--dimension-space-100, 8px);--_nav-footer-btn-w:calc(var(--dimension-space-075, 6px) * 2 + var(--dimension-iconography-md, 20px));--_nav-speed:var(--ds-panel-nav-speed, 1);--_nav-expand-dur:calc(var(--_nav-speed) * var(--effect-animation-duration-medium-1, 300ms));--_nav-expand-motion:var(--_nav-expand-dur) var(--effect-animation-easing-ease-in-out, ease);--_nav-label-fade-dur:calc(var(--_nav-speed) * var(--effect-animation-duration-medium-1, 300ms));--_nav-label-fade-motion:var(--_nav-label-fade-dur) var(--effect-animation-easing-ease-in-out, ease);--_nav-label-fade-out-dur:calc(var(--_nav-speed) * var(--effect-animation-duration-medium-1, 300ms));--_nav-label-fade-out-motion:var(--_nav-label-fade-out-dur) var(--effect-animation-easing-ease-in-out, ease);--_nav-bg:var(--color-background-secondary);--_nav-border:var(--color-border-tertiary);--_nav-divider:var(--color-border-tertiary);--_nav-fg-primary:var(--color-foreground-primary);--_nav-fg-secondary:var(--color-foreground-secondary);--_nav-fg-tertiary:var(--color-foreground-tertiary);--_nav-hover:var(--color-interaction-hover);--_nav-pressed:var(--color-interaction-pressed);--_nav-focus:var(--color-interaction-focus);--_nav-dot:var(--color-foreground-bold-brand);--ds-focus-ring-color:var(--_nav-focus)}ds-app-shell[gradient].sc-ds-panel-nav-h .panel-nav.sc-ds-panel-nav,ds-app-shell[gradient] .sc-ds-panel-nav-h .panel-nav.sc-ds-panel-nav{background-color:transparent}.panel-nav--dashboard.sc-ds-panel-nav,.panel-nav--settings.sc-ds-panel-nav{--_nav-bg:var(--color-background-secondary);--_nav-border:var(--color-border-tertiary);--_nav-divider:var(--color-border-tertiary);--_nav-fg-primary:var(--color-foreground-primary);--_nav-fg-secondary:var(--color-foreground-secondary);--_nav-fg-tertiary:var(--color-foreground-tertiary);--_nav-hover:var(--color-interaction-hover);--_nav-pressed:var(--color-interaction-pressed);--_nav-focus:var(--color-interaction-focus);--_nav-dot:var(--color-foreground-bold-brand)}.panel-nav.sc-ds-panel-nav{display:flex;flex-direction:column;position:relative;width:var(--_nav-width);min-width:var(--_nav-width);height:100%;background-color:var(--_nav-bg);border-right:var(--dimension-stroke-width-012, 1px) solid var(--_nav-border);box-sizing:border-box;overflow:visible;transition:width var(--_nav-expand-motion), min-width var(--_nav-expand-motion), background-color var(--effect-motion-short-3, 200ms ease), border-color var(--effect-motion-short-3, 200ms ease);font-family:var(--typography-font-family, system-ui);isolation:isolate}.panel-nav__header.sc-ds-panel-nav,.panel-nav__body.sc-ds-panel-nav,.panel-nav__footer.sc-ds-panel-nav{position:relative;z-index:3}.panel-nav--collapsed.sc-ds-panel-nav{width:var(--_nav-width-collapsed);min-width:var(--_nav-width-collapsed)}.panel-nav__header.sc-ds-panel-nav{display:flex;align-items:center;height:var(--dimension-size-600, 48px);padding:var(--dimension-space-100, 8px);flex-shrink:0;box-sizing:border-box;border-bottom:var(--dimension-stroke-width-012, 1px) solid var(--_nav-divider);transition:border-color var(--effect-motion-short-3, 200ms ease)}.panel-nav__header-btn.sc-ds-panel-nav{all:unset;display:flex;align-items:center;justify-content:center;padding:var(--dimension-space-075, 6px);border-radius:var(--dimension-radius-025, 2px);cursor:pointer;color:var(--_nav-fg-primary);position:relative;flex-shrink:0;box-sizing:border-box;transition:color var(--effect-motion-short-3, 200ms ease)}.panel-nav__header-btn.sc-ds-panel-nav::after{content:'';position:absolute;inset:0;border-radius:var(--dimension-radius-025, 2px);background:transparent;pointer-events:none;transition:none}.panel-nav__header-btn.sc-ds-panel-nav:hover::after{background:var(--_nav-hover);transition:none}.panel-nav__header-btn.sc-ds-panel-nav:active::after{background:var(--_nav-pressed);transition:none}.panel-nav__header-logo.sc-ds-panel-nav{display:flex;align-items:center;justify-content:center;position:relative;z-index:1;opacity:1}.panel-nav__m-mark.sc-ds-panel-nav{width:var(--dimension-iconography-md, 20px);height:var(--dimension-iconography-md, 20px);display:block}.panel-nav__header-toggle.sc-ds-panel-nav{display:flex;align-items:center;justify-content:center;position:absolute;inset:0;z-index:2;opacity:0;pointer-events:none}.panel-nav__header-btn.sc-ds-panel-nav:hover .panel-nav__header-logo.sc-ds-panel-nav{opacity:0}.panel-nav__header-btn.sc-ds-panel-nav:hover .panel-nav__header-toggle.sc-ds-panel-nav{opacity:1}.panel-nav__body.sc-ds-panel-nav{flex:1;overflow-y:auto;overflow-x:hidden;display:flex;flex-direction:column;gap:var(--dimension-space-200, 16px);padding:var(--dimension-space-100, 8px);box-sizing:border-box;scrollbar-width:none}.panel-nav__body.sc-ds-panel-nav::-webkit-scrollbar{display:none}.panel-nav__group.sc-ds-panel-nav{display:flex;flex-direction:column;gap:var(--dimension-space-050, 4px)}.panel-nav__group-label.sc-ds-panel-nav{display:flex;align-items:center;text-transform:uppercase;color:var(--_nav-fg-secondary);user-select:none;height:var(--dimension-size-300, 24px);line-height:var(--typography-lineheight-xs, 12px);padding:0 var(--dimension-space-075, 6px);white-space:nowrap;overflow:hidden;max-height:var(--dimension-size-300, 24px);opacity:1;transition:opacity var(--_nav-label-fade-motion) 0ms, max-height var(--_nav-label-fade-motion) 0ms, padding var(--_nav-label-fade-motion) 0ms, color var(--effect-motion-short-3, 200ms ease)}.panel-nav__item.sc-ds-panel-nav{all:unset;display:flex;align-items:center;gap:var(--dimension-space-050, 4px);padding:0 var(--dimension-space-075, 6px);height:var(--dimension-size-400, 32px);border-radius:var(--dimension-radius-025, 2px);cursor:pointer;color:var(--_nav-fg-secondary);position:relative;box-sizing:border-box;width:100%;user-select:none;transition:color var(--effect-motion-short-1, 50ms ease-in-out)}.panel-nav__item.sc-ds-panel-nav::after{content:'';position:absolute;inset:0;border-radius:var(--dimension-radius-025, 2px);background:transparent;pointer-events:none;transition:none}.panel-nav__item.sc-ds-panel-nav:hover::after{background:var(--_nav-hover);transition:none}.panel-nav__item.sc-ds-panel-nav:active::after{background:var(--_nav-pressed);transition:none}.panel-nav__item--active.sc-ds-panel-nav{color:var(--_nav-fg-primary)}.panel-nav__item-icon.sc-ds-panel-nav{display:flex;align-items:center;justify-content:center;flex-shrink:0;width:var(--dimension-iconography-md, 20px);height:var(--dimension-iconography-md, 20px);position:relative}.panel-nav__item-label.sc-ds-panel-nav{flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-width:0;height:var(--typography-lineheight-md, 20px);line-height:var(--typography-lineheight-md, 20px);opacity:1;mask-image:linear-gradient(to right, black 50%, transparent 100%);-webkit-mask-image:linear-gradient(to right, black 50%, transparent 100%);mask-size:200% 100%;-webkit-mask-size:200% 100%;mask-position:0% 0;-webkit-mask-position:0% 0;transition:opacity var(--_nav-label-fade-motion) 0ms, mask-position var(--_nav-label-fade-motion) 0ms, -webkit-mask-position var(--_nav-label-fade-motion) 0ms}.panel-nav__item-label-text.sc-ds-panel-nav{padding:0 var(--dimension-space-025, 2px)}.panel-nav__item-dot.sc-ds-panel-nav{position:absolute;right:calc(var(--dimension-space-100, 8px) + var(--dimension-space-050, 4px) + var(--dimension-stroke-width-012, 1px));top:calc(var(--dimension-space-100, 8px) + var(--dimension-space-050, 4px) + var(--dimension-stroke-width-012, 1px));pointer-events:none;transition:right var(--_nav-expand-motion), top var(--_nav-expand-motion)}.panel-nav--collapsed.sc-ds-panel-nav .panel-nav__item-dot.sc-ds-panel-nav{right:var(--dimension-space-075);top:var(--dimension-space-075)}.panel-nav--animating.sc-ds-panel-nav .panel-nav__item-label.sc-ds-panel-nav{text-overflow:clip}.panel-nav--collapsed.sc-ds-panel-nav .panel-nav__item-label.sc-ds-panel-nav{opacity:0;pointer-events:none;text-overflow:clip;mask-position:100% 0;-webkit-mask-position:100% 0;transition:opacity var(--_nav-label-fade-out-motion) 0ms, mask-position var(--_nav-label-fade-out-motion) 0ms, -webkit-mask-position var(--_nav-label-fade-out-motion) 0ms}.panel-nav--collapsed.sc-ds-panel-nav .panel-nav__group-label.sc-ds-panel-nav{opacity:0;max-height:0;padding:0 var(--dimension-space-075, 6px);pointer-events:none;transition:opacity var(--_nav-label-fade-out-motion) 0ms, max-height var(--_nav-label-fade-out-motion) 0ms, padding var(--_nav-label-fade-out-motion) 0ms, color var(--effect-motion-short-3, 200ms ease)}.panel-nav__footer.sc-ds-panel-nav{position:relative;flex-shrink:0;height:calc(var(--_nav-padding-y) * 2 + var(--_nav-item-height));transition:height var(--_nav-expand-motion)}.panel-nav--collapsed.sc-ds-panel-nav .panel-nav__footer.sc-ds-panel-nav{height:calc(var(--_nav-padding-y) * 2 + var(--_nav-item-height) * 2 + var(--dimension-space-050, 4px))}.panel-nav__footer-btn.sc-ds-panel-nav{position:absolute;left:var(--_nav-padding-x);top:var(--_nav-padding-y);--ds-button-unfilled-icon-fg:var(--_nav-fg-secondary);--ds-button-unfilled-icon-fg-active:var(--_nav-fg-primary);--ds-button-unfilled-icon-hover-bg:var(--_nav-hover);--ds-button-unfilled-icon-pressed-bg:var(--_nav-pressed);--ds-focus-ring-color:var(--_nav-focus)}.panel-nav__footer-user.sc-ds-panel-nav{position:absolute;left:calc(var(--_nav-padding-x) + var(--_nav-footer-btn-w) + var(--dimension-space-050, 4px));right:calc(var(--_nav-padding-x) - var(--dimension-stroke-width-012, 1px));top:var(--_nav-padding-y);width:auto;min-width:0;transition:left var(--_nav-expand-motion), right var(--_nav-expand-motion), top var(--_nav-expand-motion), color var(--effect-motion-short-3, 200ms ease)}.panel-nav--collapsed.sc-ds-panel-nav .panel-nav__footer-user.sc-ds-panel-nav{left:var(--_nav-padding-x);top:calc(var(--_nav-padding-y) + var(--_nav-item-height) + var(--dimension-space-050, 4px))}.panel-nav__footer-user-label.sc-ds-panel-nav{text-align:right;position:absolute;left:var(--dimension-space-075, 6px);right:calc(var(--dimension-space-075, 6px) + var(--dimension-iconography-md, 20px) + var(--dimension-space-050, 4px));top:50%;transform:translateY(-50%);flex:none;height:var(--typography-lineheight-md, 20px);mask-image:none;-webkit-mask-image:none;transition:opacity var(--_nav-label-fade-motion)}.panel-nav--collapsed.sc-ds-panel-nav .panel-nav__footer-user-label.sc-ds-panel-nav{opacity:0;pointer-events:none;mask-position:0% 0;-webkit-mask-position:0% 0}.panel-nav__footer-user-icon.sc-ds-panel-nav{position:absolute;left:calc(100% - var(--dimension-iconography-md, 20px) - var(--dimension-space-075, 6px));top:0;bottom:0;height:auto;display:flex;align-items:center;justify-content:center;transition:left var(--_nav-expand-motion)}.panel-nav--collapsed.sc-ds-panel-nav .panel-nav__footer-user-icon.sc-ds-panel-nav{left:var(--dimension-space-075, 6px)}.panel-nav__footer-icon-expanded.sc-ds-panel-nav,.panel-nav__footer-icon-collapsed.sc-ds-panel-nav{position:absolute;inset:0;display:flex;align-items:center;justify-content:center}.panel-nav__footer-icon-expanded.sc-ds-panel-nav{opacity:1;transition:opacity var(--_nav-label-fade-motion)}.panel-nav__footer-icon-collapsed.sc-ds-panel-nav{opacity:0;transition:opacity var(--_nav-label-fade-motion)}.panel-nav--collapsed.sc-ds-panel-nav .panel-nav__footer-icon-expanded.sc-ds-panel-nav{opacity:0;transition:opacity var(--_nav-label-fade-out-motion)}.panel-nav--collapsed.sc-ds-panel-nav .panel-nav__footer-icon-collapsed.sc-ds-panel-nav{opacity:1;transition:opacity var(--_nav-label-fade-out-motion)}.panel-nav__user-initial.sc-ds-panel-nav{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;color:var(--_nav-fg-secondary);text-transform:uppercase;line-height:1;pointer-events:none;transition:color var(--effect-motion-short-3, 200ms ease)}.panel-nav__resize-handle.sc-ds-panel-nav{position:absolute;top:0;right:var(--dimension-space-n050, -4px);bottom:0;width:var(--dimension-space-100, 8px);z-index:20;cursor:ew-resize;touch-action:none;background:transparent}.panel-nav__resize-handle.sc-ds-panel-nav::before{content:'';position:absolute;inset:0;background:rgba(0, 0, 0, 0.001)}.panel-nav__resize-handle.sc-ds-panel-nav::after{content:'';position:absolute;top:0;bottom:0;left:50%;transform:translateX(-50%);width:var(--dimension-stroke-width-025, 2px);background:var(--color-foreground-primary);opacity:0;pointer-events:none;transition:opacity var(--effect-motion-short-2, 100ms ease-in-out)}.panel-nav__resize-handle--overlay.sc-ds-panel-nav::after{opacity:1}@media (prefers-reduced-motion: reduce){.panel-nav.sc-ds-panel-nav,.panel-nav.sc-ds-panel-nav *.sc-ds-panel-nav,.panel-nav.sc-ds-panel-nav *.sc-ds-panel-nav::before,.panel-nav.sc-ds-panel-nav *.sc-ds-panel-nav::after,.panel-nav__resize-handle.sc-ds-panel-nav,.panel-nav__resize-handle.sc-ds-panel-nav::before,.panel-nav__resize-handle.sc-ds-panel-nav::after{transition-duration:0.01ms !important;animation-duration:0.01ms !important;transition-delay:0.01ms !important}}`;const A=e(class e extends a{constructor(e){super();if(e!==false){this.__registerHost()}this.dsNavSelect=n(this,"dsNavSelect");this.dsNavToggle=n(this,"dsNavToggle");this.dsChromeTransitionStart=n(this,"dsChromeTransitionStart");this.dsChromeTransitionEnd=n(this,"dsChromeTransitionEnd");this.dsNavFooterAction=n(this,"dsNavFooterAction");this.dsNavUserAction=n(this,"dsNavUserAction");this.navStyle="dashboard";this.disableViewTransition=false;this.groups="[]";this.routerMode="anchor";this.activeId="";this.collapsed=false;this.breakpoint=0;this.storageKey="";this.currentUrl="";this.userName="";this.userInitial="";this.renderedStyle="dashboard";this.parsedGroups=[];this.isAnimating=false;this.rovingIndex=0;this.viewportNarrow=false;this.urlDerivedActiveId="";this.isDragging=false;this.dragStartX=0;this.didSnap=false;this.lastDeltaX=0;this.edgeOverlayTimer=null;this.showEdgeOverlay=false}get effectiveActiveId(){return this.urlDerivedActiveId||this.activeId}get effectiveDisableViewTransition(){return x(this.disableViewTransition,this.el.getAttribute("disable-view-transition"))}onCollapsedChange(e,a){if(a===undefined)return;this.startCollapseAnimation()}onViewportNarrowChange(e,a){if(a===undefined)return;this.startCollapseAnimation()}onBreakpointChange(){this.disconnectResizeObserver();if(this.breakpoint>0)this.connectResizeObserver()}onGroupsChange(e){this.parsedGroups=y(e);this.rovingIndex=0;this.syncActiveFromUrl()}onActiveIdChange(){}onCurrentUrlChange(){this.syncActiveFromUrl()}onNavStyleChange(e){this.renderedStyle=e}componentWillLoad(){this.renderedStyle=m(this.navStyle,this.el.getAttribute("nav-style"));if(this.storageKey){try{const e=localStorage.getItem(this.storageKey);if(e!==null)this.collapsed=e==="true"}catch{}}this.onGroupsChange(this.groups);this.syncActiveFromUrl()}componentDidLoad(){this.syncHostPropsIfNeeded();this.scheduleDeferredHostPropSync();if(this.breakpoint>0)this.connectResizeObserver()}disconnectedCallback(){this.disconnectResizeObserver();this.clearEdgeOverlayTimer();if(this.globalMouseMoveHandler){window.removeEventListener("mousemove",this.globalMouseMoveHandler)}if(this.globalMouseUpHandler){window.removeEventListener("mouseup",this.globalMouseUpHandler)}}startCollapseAnimation(){this.isAnimating=true;this.dsChromeTransitionStart.emit({source:"panel-nav"});const e=this.el.querySelector(".panel-nav");const a=e?.getBoundingClientRect().width??0;if(this.transitionEndHandler){e?.removeEventListener("transitionend",this.transitionEndHandler)}this.transitionEndHandler=a=>{if(a.propertyName==="width"){this.finishCollapseAnimation(e)}};e?.addEventListener("transitionend",this.transitionEndHandler);requestAnimationFrame((()=>{requestAnimationFrame((()=>{if(!this.isAnimating)return;const n=e?.getBoundingClientRect().width??0;if(Math.abs(n-a)<1){this.finishCollapseAnimation(e)}}))}))}finishCollapseAnimation(e){if(!this.isAnimating)return;this.isAnimating=false;this.dsChromeTransitionEnd.emit({source:"panel-nav"});if(this.transitionEndHandler){e?.removeEventListener("transitionend",this.transitionEndHandler)}}connectResizeObserver(){this.viewportNarrow=window.innerWidth<this.breakpoint;this.resizeObserver=new ResizeObserver((()=>{this.viewportNarrow=window.innerWidth<this.breakpoint}));this.resizeObserver.observe(document.documentElement)}disconnectResizeObserver(){this.resizeObserver?.disconnect();this.resizeObserver=undefined}syncActiveFromUrl(){if(!this.currentUrl){this.urlDerivedActiveId="";return}this.urlDerivedActiveId=b(this.currentUrl,this.getAllItems())}syncHostPropsIfNeeded(){if(u(this.renderedStyle,this.navStyle)){this.renderedStyle=this.navStyle}if(k(this.parsedGroups,this.groups)){this.onGroupsChange(this.groups)}else if(this.currentUrl){this.syncActiveFromUrl()}}scheduleDeferredHostPropSync(){let a=e.HOST_PROP_SYNC_BUDGET;const n=()=>{this.syncHostPropsIfNeeded();if(--a>0){requestAnimationFrame(n)}};queueMicrotask(n)}applyToggle(e){this.collapsed=e;if(this.storageKey){try{localStorage.setItem(this.storageKey,String(e))}catch{}}this.dsNavToggle.emit(e)}getAllItems(){return this.parsedGroups.flatMap((e=>e.items))}getFooterRovingIndex(){return 1+this.getAllItems().length}getUserRovingIndex(){return this.getFooterRovingIndex()+1}getRovingElement(e){const a=this.getAllItems().length;if(e===0){return this.el.querySelector(".panel-nav__header-btn")}if(e>=1&&e<=a){const a=this.el.querySelectorAll(".panel-nav__body .panel-nav__item");return a[e-1]??null}if(e===this.getFooterRovingIndex()){return this.el.querySelector(".panel-nav__footer-btn .button-icon")}if(e===this.getUserRovingIndex()){return this.el.querySelector(".panel-nav__footer-user")}return null}focusRovingAt(e){this.rovingIndex=e;this.getRovingElement(e)?.focus({preventScroll:true})}activateRovingIndex(e){const a=this.getAllItems().length;const n=this.getAllItems();if(e===0){this.handleToggle();return}if(e>=1&&e<=a){this.handleItemClick(n[e-1].id);return}if(e===this.getFooterRovingIndex()){this.handleFooterAction();return}if(e===this.getUserRovingIndex()){const e=this.el.querySelector(`#${w}`);if(e)this.dsNavUserAction.emit({anchor:e,menuPlacement:p})}}handleRovingKeyDown(e,a){if(e.key==="Enter"||e.key===" "){e.preventDefault();this.activateRovingIndex(a);return}const n=this.getFooterRovingIndex();const s=this.getUserRovingIndex();let i;switch(e.key){case"ArrowDown":if(a===s)return;if(a===n)i=s;else i=a+1;break;case"ArrowUp":if(a===0)return;if(a===s)i=n;else if(a===n)i=n-1;else i=a-1;break;case"ArrowRight":if(a===n)i=s;else return;break;case"ArrowLeft":if(a===s)i=n;else return;break;case"Home":e.preventDefault();i=0;break;case"End":e.preventDefault();i=s;break;default:return}if(i===undefined||i===a)return;e.preventDefault();this.focusRovingAt(i)}handleItemClick(e){this.dsNavSelect.emit(e)}handleToggle(){this.applyToggle(!this.collapsed)}async toggleCollapsed(){this.handleToggle()}handleFooterAction(){this.dsNavFooterAction.emit()}handleUserAction(e){const a=e.currentTarget;this.dsNavUserAction.emit({anchor:a,menuPlacement:p})}clearEdgeOverlayTimer(){if(this.edgeOverlayTimer!==null){window.clearTimeout(this.edgeOverlayTimer);this.edgeOverlayTimer=null}}handleResizeHandleMouseEnter(){this.clearEdgeOverlayTimer();this.edgeOverlayTimer=window.setTimeout((()=>{this.showEdgeOverlay=true;this.edgeOverlayTimer=null}),500)}handleResizeHandleMouseLeave(){if(this.isDragging)return;this.clearEdgeOverlayTimer();this.showEdgeOverlay=false}handleResizeHandleMouseDown(e){e.preventDefault();e.stopPropagation();const a=this.collapsed||this.viewportNarrow;this.isDragging=true;this.dragStartX=e.clientX;this.didSnap=false;this.lastDeltaX=0;this.clearEdgeOverlayTimer();this.showEdgeOverlay=false;document.body.style.cursor="ew-resize";document.body.style.userSelect="none";const n=e=>{const n=e.clientX-this.dragStartX;this.lastDeltaX=Math.abs(n);if(this.didSnap)return;if(!a&&n<-8){this.applyToggle(true);this.didSnap=true}else if(a&&n>8){this.applyToggle(false);this.didSnap=true}};const s=()=>{if(!this.didSnap&&this.lastDeltaX<3){this.applyToggle(!a)}this.isDragging=false;this.showEdgeOverlay=false;document.body.style.cursor="";document.body.style.userSelect="";window.removeEventListener("mousemove",n);window.removeEventListener("mouseup",s);this.globalMouseMoveHandler=undefined;this.globalMouseUpHandler=undefined};this.globalMouseMoveHandler=n;this.globalMouseUpHandler=s;window.addEventListener("mousemove",n);window.addEventListener("mouseup",s)}renderNavItem(e,a,n){const i=e.id===this.effectiveActiveId;const t=a+1;const o=[s("span",{class:"panel-nav__item-icon"},s("ds-icon",{name:e.icon,size:"md",color:"inherit",flag:e.flag})),s("span",{class:"panel-nav__item-label"},s("span",{class:"panel-nav__item-label-text"},s("ds-text",{as:"span",variant:i?"text-body-medium-emphasis":"text-body-medium",color:"inherit"},e.label))),e.dot&&s("ds-badge",{class:"panel-nav__item-dot",variant:"dot",background:"var(--_nav-bg)",label:"","aria-hidden":"true"})];const r={class:{"panel-nav__item":true,"panel-nav__item--active":i,"ds-focus-ring-inset":true},"aria-current":i?"page":undefined,title:n?e.label:undefined,tabIndex:t===this.rovingIndex?0:-1,onClick:()=>this.handleItemClick(e.id),onKeyDown:e=>this.handleRovingKeyDown(e,t),onFocus:()=>{this.rovingIndex=t}};const d=this.routerMode==="anchor"&&e.href;return d?s("a",{...r,href:e.href},o):s("button",{...r,type:"button"},o)}render(){const e=this.renderedStyle;const a=e==="dashboard";const n=this.navStyle==="dashboard";const t=this.collapsed||this.viewportNarrow;const{userName:r,userInitial:d}=this;const l={"panel-nav":true,"panel-nav--dashboard":n,"panel-nav--settings":!n,"panel-nav--collapsed":t,"panel-nav--animating":this.isAnimating};return s(i,{key:"08efc6451a8ace5c6f0058e42350e40a3ab0aa21",style:{display:"block",position:"relative"}},s("nav",{key:"7ae0031f7bccd5b3c026308cd2db6810e428ea1c",class:l,"aria-label":a?"Dashboard navigation":"Settings navigation"},s("div",{key:"0f3c239ac7bd24f0032cd7ba3fe75bb219eee3e6",class:"panel-nav__header"},s("button",{key:"776a8244329299a41b07892f375646f33b7ec91c",type:"button",class:"panel-nav__header-btn ds-focus-ring-inset",tabIndex:this.rovingIndex===0?0:-1,onClick:()=>this.handleToggle(),onKeyDown:e=>this.handleRovingKeyDown(e,0),onFocus:()=>{this.rovingIndex=0},"aria-label":t?"Expand navigation":"Collapse navigation","aria-expanded":t?"false":"true"},s("span",{key:"f2c9d83388620fd3bb7c8107e20bbec80d348778",class:"panel-nav__header-logo","aria-hidden":"true"},s("svg",{key:"12b07cb10eaa834088ec59d2a284e2ed0b2712e0",class:"panel-nav__m-mark",viewBox:"0 0 20 20",fill:"none",xmlns:"http://www.w3.org/2000/svg",focusable:"false","aria-hidden":"true"},s("path",{key:"4152fecde6286f5369343a0e9b860c8772c50a12",d:"M11.1159 4.31537H7.67021L2.53401 13.0703H0V15.6875H4.02716L8.24319 8.49978V15.6846H11.6342L15.8289 8.47829V15.6846H18.7122V4.3125H15.2559L11.1159 11.3648V4.31537Z",fill:"currentColor"}))),s("span",{key:"d0cdd5317609dbd518039f89e12a24e383c1ac82",class:"panel-nav__header-toggle","aria-hidden":"true"},s("ds-icon",{key:"411f96d85b618715d210c8e3283a856bc9f8b486",name:t?"LeftExpandB":"LeftCollapseB",size:"md",color:"inherit"})))),s("div",{key:"f3d8da5ca8158dea5e3c91d27309de0a50bb2758",class:{"panel-nav__body":true,...o({edges:"bottom"})}},(()=>{let e=0;return this.parsedGroups.map((a=>s("div",{class:"panel-nav__group"},a.label&&s("span",{class:"panel-nav__group-label"},s("span",{class:"panel-nav__item-label-text"},s("ds-text",{as:"span",variant:"text-caption-emphasis",color:"inherit"},a.label))),a.items.map((a=>this.renderNavItem(a,e++,t))))))})()),s("div",{key:"2bba41120798e4dfd7acac383c0592dec340f23c",class:"panel-nav__footer"},s("ds-button-unfilled-icon",{key:"83df5ab2e0421e667d995937a9bfed1b62f6e265",class:"panel-nav__footer-btn",icon:a?"Gear":"Dashboard",activeFill:false,focusTabIndex:this.rovingIndex===this.getFooterRovingIndex()?0:-1,title:a?"Settings":"Dashboard","aria-label":a?"Open settings":"Go to dashboard",onDsClick:()=>this.handleFooterAction(),onKeyDown:e=>this.handleRovingKeyDown(e,this.getFooterRovingIndex()),onFocusin:()=>{this.rovingIndex=this.getFooterRovingIndex()}}),s("button",{key:"1154756081523aacb2f7578f642fd0f001d137a7",type:"button",id:w,class:"panel-nav__item panel-nav__footer-user ds-focus-ring-inset",tabIndex:this.rovingIndex===this.getUserRovingIndex()?0:-1,"aria-label":t?`User: ${r}`:`User menu for ${r}`,onClick:e=>this.handleUserAction(e),onKeyDown:e=>this.handleRovingKeyDown(e,this.getUserRovingIndex()),onFocus:()=>{this.rovingIndex=this.getUserRovingIndex()}},s("span",{key:"06feee3966fd54e82a8e9e925aa6b05518b74d25",class:"panel-nav__item-label panel-nav__footer-user-label"},s("span",{key:"f7d4e3c6ea0371fd1223bbd3d47242d5dbad8ed9",class:"panel-nav__item-label-text"},s("ds-text",{key:"f51127c35b8ca32830586c8958d10a09d104fa06",as:"span",variant:"text-body-medium-emphasis",color:"inherit"},r))),s("span",{key:"fef3fa52b463bad410f96aca8b381db0420fd98c",class:"panel-nav__item-icon panel-nav__footer-user-icon","aria-hidden":"true"},s("span",{key:"cf555124f87e655b4bc6e72384a8e96489b57f9d",class:"panel-nav__footer-icon-expanded"},s("ds-icon",{key:"d3bf1624c57c9f7ab1fac1a3228c7f6b4e25659c",name:"ChevronUpDown",size:"md",color:"inherit"})),s("span",{key:"110623707b4de50a895d447691da47e92a37bdac",class:"panel-nav__footer-icon-collapsed"},s("ds-icon",{key:"7cec006970eceab7424ad54bee8a8041256dc6e4",name:"Circle",size:"md",color:"inherit"}),s("span",{key:"554aeb0ee908e3d0c4865ae01b675841548e8d2d",class:"panel-nav__user-initial"},s("ds-text",{key:"bec07f63e63693ef70f3e74a8393f5c17b8c486d",as:"span",variant:"text-caption-emphasis",color:"inherit"},d))))))),!this.viewportNarrow&&s("div",{key:"ac9d3a9e23012fb0f81320590c853f605da462fd",class:{"panel-nav__resize-handle":true,"panel-nav__resize-handle--overlay":this.showEdgeOverlay},onMouseEnter:()=>this.handleResizeHandleMouseEnter(),onMouseLeave:()=>this.handleResizeHandleMouseLeave(),onMouseDown:e=>this.handleResizeHandleMouseDown(e),"aria-hidden":"true"}))}get el(){return this}static get watchers(){return{collapsed:[{onCollapsedChange:0}],viewportNarrow:[{onViewportNarrowChange:0}],breakpoint:[{onBreakpointChange:0}],groups:[{onGroupsChange:0}],activeId:[{onActiveIdChange:0}],urlDerivedActiveId:[{onActiveIdChange:0}],currentUrl:[{onCurrentUrlChange:0}],navStyle:[{onNavStyleChange:0}]}}static get style(){return z()+C()}},[2,"ds-panel-nav",{navStyle:[513,"nav-style"],disableViewTransition:[4,"disable-view-transition"],groups:[1],routerMode:[1,"router-mode"],activeId:[1,"active-id"],collapsed:[1028],breakpoint:[2],storageKey:[1,"storage-key"],currentUrl:[1,"current-url"],userName:[1,"user-name"],userInitial:[1,"user-initial"],renderedStyle:[32],parsedGroups:[32],isAnimating:[32],rovingIndex:[32],viewportNarrow:[32],urlDerivedActiveId:[32],showEdgeOverlay:[32],toggleCollapsed:[64]},undefined,{collapsed:[{onCollapsedChange:0}],viewportNarrow:[{onViewportNarrowChange:0}],breakpoint:[{onBreakpointChange:0}],groups:[{onGroupsChange:0}],activeId:[{onActiveIdChange:0}],urlDerivedActiveId:[{onActiveIdChange:0}],currentUrl:[{onCurrentUrlChange:0}],navStyle:[{onNavStyleChange:0}]}]);A.HOST_PROP_SYNC_BUDGET=8;function I(){if(typeof customElements==="undefined"){return}const e=["ds-panel-nav","ds-badge","ds-button-unfilled-icon","ds-icon","ds-text"];e.forEach((e=>{switch(e){case"ds-panel-nav":if(!customElements.get(t(e))){customElements.define(t(e),A)}break;case"ds-badge":if(!customElements.get(t(e))){r()}break;case"ds-button-unfilled-icon":if(!customElements.get(t(e))){d()}break;case"ds-icon":if(!customElements.get(t(e))){l()}break;case"ds-text":if(!customElements.get(t(e))){c()}break}}))}I();const D=A;const S=I;export{D as DsPanelNav,S as defineCustomElement};
|
|
1
|
+
import{p as e,H as a,c as n,h as s,a as i,t}from"./index.js";import{a as o}from"./p-CBUIn8dk.js";import{d as r}from"./p-EK1hOP19.js";import{d as l}from"./p-BSFgy5r6.js";import{d}from"./p-8Nt92j1-.js";import{d as c}from"./p-DOU4cbpc.js";import{a as v}from"./p-bDf6yBQd.js";const p={side:"right",align:"end",sideOffset:"calc(var(--dimension-space-100) + var(--dimension-space-050))",alignOffset:v.space050};const h="data-nav-style";function f(e){if(e==="dashboard"||e==="settings")return e;return undefined}function u(e,a,n){const s=f(a);if(s)return s;const i=typeof document!=="undefined"?document.documentElement.getAttribute(h):null;const t=f(i);if(t)return t;return e}function m(e,a){return e!==a}function g(e,a){return e===a||e.startsWith(`${a}/`)}function b(e,a){if(!e)return"";let n="";let s=0;for(const i of a){if(!i.href)continue;if(g(e,i.href)&&i.href.length>s){n=i.id;s=i.href.length}}return n}function _(e){return e.reduce(((e,a)=>e+a.items.length),0)}function y(e){if(Array.isArray(e))return e;if(typeof e==="string"){try{const a=JSON.parse(e);return Array.isArray(a)?a:[]}catch{return[]}}return[]}function x(e,a){if(e)return true;if(a===null)return false;return a!=="false"}function k(e,a){return _(e)===0&&_(y(a))>0}const w="ds-panel-nav-user-menu-anchor";const z=()=>`.scroll-edge-fade.sc-ds-panel-nav{--ds-scroll-edge-fade-size:var(--dimension-size-600)}.scroll-edge-fade--top.sc-ds-panel-nav{-webkit-mask-image:linear-gradient(to bottom, #000 0, #000 50%, transparent 100%);mask-image:linear-gradient(to bottom, #000 0, #000 50%, transparent 100%);-webkit-mask-size:100% 100%;mask-size:100% 100%}.scroll-edge-fade--bottom.sc-ds-panel-nav{-webkit-mask-image:linear-gradient( to bottom, #000 0, #000 calc(100% - var(--ds-scroll-edge-fade-size)), transparent 100% );mask-image:linear-gradient( to bottom, #000 0, #000 calc(100% - var(--ds-scroll-edge-fade-size)), transparent 100% );-webkit-mask-size:100% 100%;mask-size:100% 100%}.scroll-edge-fade--left.sc-ds-panel-nav{-webkit-mask-image:linear-gradient( to right, #000 0, #000 calc(100% - var(--ds-scroll-edge-fade-size)), transparent 100% );mask-image:linear-gradient( to right, #000 0, #000 calc(100% - var(--ds-scroll-edge-fade-size)), transparent 100% );-webkit-mask-size:100% 100%;mask-size:100% 100%}.scroll-edge-fade--right.sc-ds-panel-nav{-webkit-mask-image:linear-gradient( to left, #000 0, #000 calc(100% - var(--ds-scroll-edge-fade-size)), transparent 100% );mask-image:linear-gradient( to left, #000 0, #000 calc(100% - var(--ds-scroll-edge-fade-size)), transparent 100% );-webkit-mask-size:100% 100%;mask-size:100% 100%}.scroll-edge-fade--at-end.sc-ds-panel-nav,.scroll-edge-fade--hidden.sc-ds-panel-nav{-webkit-mask-image:none;mask-image:none}`;const C=()=>`.sc-ds-panel-nav-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-panel-nav: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-panel-nav{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-panel-nav:focus-visible{outline:none}.ds-focus-ring-inset.sc-ds-panel-nav: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-panel-nav{outline:none}.ds-focus-ring-inset.ds-focus-ring--visible.sc-ds-panel-nav::after{outline:var(--ds-focus-ring-width) solid var(--ds-focus-ring-color);outline-offset:calc(-1 * var(--ds-focus-ring-width))}.panel-nav.sc-ds-panel-nav{--_nav-width:var(--dimension-panel-width-2xs);--_nav-width-collapsed:var(--dimension-size-600);--_nav-item-height:var(--dimension-size-400, 32px);--_nav-padding-x:var(--dimension-space-100, 8px);--_nav-padding-y:var(--dimension-space-100, 8px);--_nav-footer-btn-w:calc(var(--dimension-space-075, 6px) * 2 + var(--dimension-iconography-md, 20px));--_nav-speed:var(--ds-panel-nav-speed, 1);--_nav-expand-dur:calc(var(--_nav-speed) * var(--effect-animation-duration-medium-1, 300ms));--_nav-expand-motion:var(--_nav-expand-dur) var(--effect-animation-easing-ease-in-out, ease);--_nav-label-fade-dur:calc(var(--_nav-speed) * var(--effect-animation-duration-medium-1, 300ms));--_nav-label-fade-motion:var(--_nav-label-fade-dur) var(--effect-animation-easing-ease-in-out, ease);--_nav-label-fade-out-dur:calc(var(--_nav-speed) * var(--effect-animation-duration-medium-1, 300ms));--_nav-label-fade-out-motion:var(--_nav-label-fade-out-dur) var(--effect-animation-easing-ease-in-out, ease);--_nav-bg:var(--color-background-secondary);--_nav-border:var(--color-border-tertiary);--_nav-divider:var(--color-border-tertiary);--_nav-fg-primary:var(--color-foreground-primary);--_nav-fg-secondary:var(--color-foreground-secondary);--_nav-fg-tertiary:var(--color-foreground-tertiary);--_nav-hover:var(--color-interaction-hover);--_nav-pressed:var(--color-interaction-pressed);--_nav-focus:var(--color-interaction-focus);--_nav-dot:var(--color-foreground-bold-brand);--ds-focus-ring-color:var(--_nav-focus)}ds-app-shell[gradient].sc-ds-panel-nav-h .panel-nav.sc-ds-panel-nav,ds-app-shell[gradient] .sc-ds-panel-nav-h .panel-nav.sc-ds-panel-nav{background-color:transparent}.panel-nav--dashboard.sc-ds-panel-nav,.panel-nav--settings.sc-ds-panel-nav{--_nav-bg:var(--color-background-secondary);--_nav-border:var(--color-border-tertiary);--_nav-divider:var(--color-border-tertiary);--_nav-fg-primary:var(--color-foreground-primary);--_nav-fg-secondary:var(--color-foreground-secondary);--_nav-fg-tertiary:var(--color-foreground-tertiary);--_nav-hover:var(--color-interaction-hover);--_nav-pressed:var(--color-interaction-pressed);--_nav-focus:var(--color-interaction-focus);--_nav-dot:var(--color-foreground-bold-brand)}.panel-nav.sc-ds-panel-nav{display:flex;flex-direction:column;position:relative;width:var(--_nav-width);min-width:var(--_nav-width);height:100%;background-color:var(--_nav-bg);border-right:var(--dimension-stroke-width-012, 1px) solid var(--_nav-border);box-sizing:border-box;overflow:visible;transition:width var(--_nav-expand-motion), min-width var(--_nav-expand-motion), background-color var(--effect-motion-short-3, 200ms ease), border-color var(--effect-motion-short-3, 200ms ease);font-family:var(--typography-font-family, system-ui);isolation:isolate}.panel-nav__header.sc-ds-panel-nav,.panel-nav__body.sc-ds-panel-nav,.panel-nav__footer.sc-ds-panel-nav{position:relative;z-index:3}.panel-nav--collapsed.sc-ds-panel-nav{width:var(--_nav-width-collapsed);min-width:var(--_nav-width-collapsed)}.panel-nav__header.sc-ds-panel-nav{display:flex;align-items:center;height:var(--dimension-size-600, 48px);padding:var(--dimension-space-100, 8px);flex-shrink:0;box-sizing:border-box;border-bottom:var(--dimension-stroke-width-012, 1px) solid var(--_nav-divider);transition:border-color var(--effect-motion-short-3, 200ms ease)}.panel-nav__header-btn.sc-ds-panel-nav{all:unset;display:flex;align-items:center;justify-content:center;padding:var(--dimension-space-075, 6px);border-radius:var(--dimension-radius-025, 2px);cursor:pointer;color:var(--_nav-fg-primary);position:relative;flex-shrink:0;box-sizing:border-box;transition:color var(--effect-motion-short-3, 200ms ease)}.panel-nav__header-btn.sc-ds-panel-nav::after{content:'';position:absolute;inset:0;border-radius:var(--dimension-radius-025, 2px);background:transparent;pointer-events:none;transition:none}.panel-nav__header-btn.sc-ds-panel-nav:hover::after{background:var(--_nav-hover);transition:none}.panel-nav__header-btn.sc-ds-panel-nav:active::after{background:var(--_nav-pressed);transition:none}.panel-nav__header-logo.sc-ds-panel-nav{display:flex;align-items:center;justify-content:center;position:relative;z-index:1;opacity:1}.panel-nav__m-mark.sc-ds-panel-nav{width:var(--dimension-iconography-md, 20px);height:var(--dimension-iconography-md, 20px);display:block}.panel-nav__header-toggle.sc-ds-panel-nav{display:flex;align-items:center;justify-content:center;position:absolute;inset:0;z-index:2;opacity:0;pointer-events:none}.panel-nav__header-btn.sc-ds-panel-nav:hover .panel-nav__header-logo.sc-ds-panel-nav{opacity:0}.panel-nav__header-btn.sc-ds-panel-nav:hover .panel-nav__header-toggle.sc-ds-panel-nav{opacity:1}.panel-nav__body.sc-ds-panel-nav{flex:1;overflow-y:auto;overflow-x:hidden;display:flex;flex-direction:column;gap:var(--dimension-space-200, 16px);padding:var(--dimension-space-100, 8px);box-sizing:border-box;scrollbar-width:none}.panel-nav__body.sc-ds-panel-nav::-webkit-scrollbar{display:none}.panel-nav__group.sc-ds-panel-nav{display:flex;flex-direction:column;gap:var(--dimension-space-050, 4px)}.panel-nav__group-label.sc-ds-panel-nav{display:flex;align-items:center;text-transform:uppercase;color:var(--_nav-fg-secondary);user-select:none;height:var(--dimension-size-300, 24px);line-height:var(--typography-lineheight-xs, 12px);padding:0 var(--dimension-space-075, 6px);white-space:nowrap;overflow:hidden;max-height:var(--dimension-size-300, 24px);opacity:1;transition:opacity var(--_nav-label-fade-motion) 0ms, max-height var(--_nav-label-fade-motion) 0ms, padding var(--_nav-label-fade-motion) 0ms, color var(--effect-motion-short-3, 200ms ease)}.panel-nav__item.sc-ds-panel-nav{all:unset;display:flex;align-items:center;gap:var(--dimension-space-050, 4px);padding:0 var(--dimension-space-075, 6px);height:var(--dimension-size-400, 32px);border-radius:var(--dimension-radius-025, 2px);cursor:pointer;color:var(--_nav-fg-secondary);position:relative;box-sizing:border-box;width:100%;user-select:none;transition:color var(--effect-motion-short-1, 50ms ease-in-out)}.panel-nav__item.sc-ds-panel-nav::after{content:'';position:absolute;inset:0;border-radius:var(--dimension-radius-025, 2px);background:transparent;pointer-events:none;transition:none}.panel-nav__item.sc-ds-panel-nav:hover::after{background:var(--_nav-hover);transition:none}.panel-nav__item.sc-ds-panel-nav:active::after{background:var(--_nav-pressed);transition:none}.panel-nav__item--active.sc-ds-panel-nav{color:var(--_nav-fg-primary)}.panel-nav__item-icon.sc-ds-panel-nav{display:flex;align-items:center;justify-content:center;flex-shrink:0;width:var(--dimension-iconography-md, 20px);height:var(--dimension-iconography-md, 20px);position:relative}.panel-nav__item-label.sc-ds-panel-nav{flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-width:0;height:var(--typography-lineheight-md, 20px);line-height:var(--typography-lineheight-md, 20px);opacity:1;mask-image:linear-gradient(to right, black 50%, transparent 100%);-webkit-mask-image:linear-gradient(to right, black 50%, transparent 100%);mask-size:200% 100%;-webkit-mask-size:200% 100%;mask-position:0% 0;-webkit-mask-position:0% 0;transition:opacity var(--_nav-label-fade-motion) 0ms, mask-position var(--_nav-label-fade-motion) 0ms, -webkit-mask-position var(--_nav-label-fade-motion) 0ms}.panel-nav__item-label-text.sc-ds-panel-nav{padding:0 var(--dimension-space-025, 2px)}.panel-nav__item-dot.sc-ds-panel-nav{position:absolute;right:calc(var(--dimension-space-100, 8px) + var(--dimension-space-050, 4px) + var(--dimension-stroke-width-012, 1px));top:calc(var(--dimension-space-100, 8px) + var(--dimension-space-050, 4px) + var(--dimension-stroke-width-012, 1px));pointer-events:none;transition:right var(--_nav-expand-motion), top var(--_nav-expand-motion)}.panel-nav--collapsed.sc-ds-panel-nav .panel-nav__item-dot.sc-ds-panel-nav{right:var(--dimension-space-075);top:var(--dimension-space-075)}.panel-nav--animating.sc-ds-panel-nav .panel-nav__item-label.sc-ds-panel-nav{text-overflow:clip}.panel-nav--collapsed.sc-ds-panel-nav .panel-nav__item-label.sc-ds-panel-nav{opacity:0;pointer-events:none;text-overflow:clip;mask-position:100% 0;-webkit-mask-position:100% 0;transition:opacity var(--_nav-label-fade-out-motion) 0ms, mask-position var(--_nav-label-fade-out-motion) 0ms, -webkit-mask-position var(--_nav-label-fade-out-motion) 0ms}.panel-nav--collapsed.sc-ds-panel-nav .panel-nav__group-label.sc-ds-panel-nav{opacity:0;max-height:0;padding:0 var(--dimension-space-075, 6px);pointer-events:none;transition:opacity var(--_nav-label-fade-out-motion) 0ms, max-height var(--_nav-label-fade-out-motion) 0ms, padding var(--_nav-label-fade-out-motion) 0ms, color var(--effect-motion-short-3, 200ms ease)}.panel-nav__footer.sc-ds-panel-nav{position:relative;flex-shrink:0;height:calc(var(--_nav-padding-y) * 2 + var(--_nav-item-height));transition:height var(--_nav-expand-motion)}.panel-nav--collapsed.sc-ds-panel-nav .panel-nav__footer.sc-ds-panel-nav{height:calc(var(--_nav-padding-y) * 2 + var(--_nav-item-height) * 2 + var(--dimension-space-050, 4px))}.panel-nav__footer-btn.sc-ds-panel-nav{position:absolute;left:var(--_nav-padding-x);top:var(--_nav-padding-y);--ds-button-unfilled-icon-fg:var(--_nav-fg-secondary);--ds-button-unfilled-icon-fg-active:var(--_nav-fg-primary);--ds-button-unfilled-icon-hover-bg:var(--_nav-hover);--ds-button-unfilled-icon-pressed-bg:var(--_nav-pressed);--ds-focus-ring-color:var(--_nav-focus)}.panel-nav__footer-user.sc-ds-panel-nav{position:absolute;left:calc(var(--_nav-padding-x) + var(--_nav-footer-btn-w) + var(--dimension-space-050, 4px));right:calc(var(--_nav-padding-x) - var(--dimension-stroke-width-012, 1px));top:var(--_nav-padding-y);width:auto;min-width:0;transition:left var(--_nav-expand-motion), right var(--_nav-expand-motion), top var(--_nav-expand-motion), color var(--effect-motion-short-3, 200ms ease)}.panel-nav--collapsed.sc-ds-panel-nav .panel-nav__footer-user.sc-ds-panel-nav{left:var(--_nav-padding-x);top:calc(var(--_nav-padding-y) + var(--_nav-item-height) + var(--dimension-space-050, 4px))}.panel-nav__footer-user-label.sc-ds-panel-nav{text-align:right;position:absolute;left:var(--dimension-space-075, 6px);right:calc(var(--dimension-space-075, 6px) + var(--dimension-iconography-md, 20px) + var(--dimension-space-050, 4px));top:50%;transform:translateY(-50%);flex:none;height:var(--typography-lineheight-md, 20px);mask-image:none;-webkit-mask-image:none;transition:opacity var(--_nav-label-fade-motion)}.panel-nav--collapsed.sc-ds-panel-nav .panel-nav__footer-user-label.sc-ds-panel-nav{opacity:0;pointer-events:none;mask-position:0% 0;-webkit-mask-position:0% 0}.panel-nav__footer-user-icon.sc-ds-panel-nav{position:absolute;left:calc(100% - var(--dimension-iconography-md, 20px) - var(--dimension-space-075, 6px));top:0;bottom:0;height:auto;display:flex;align-items:center;justify-content:center;transition:left var(--_nav-expand-motion)}.panel-nav--collapsed.sc-ds-panel-nav .panel-nav__footer-user-icon.sc-ds-panel-nav{left:var(--dimension-space-075, 6px)}.panel-nav__footer-icon-expanded.sc-ds-panel-nav,.panel-nav__footer-icon-collapsed.sc-ds-panel-nav{position:absolute;inset:0;display:flex;align-items:center;justify-content:center}.panel-nav__footer-icon-expanded.sc-ds-panel-nav{opacity:1;transition:opacity var(--_nav-label-fade-motion)}.panel-nav__footer-icon-collapsed.sc-ds-panel-nav{opacity:0;transition:opacity var(--_nav-label-fade-motion)}.panel-nav--collapsed.sc-ds-panel-nav .panel-nav__footer-icon-expanded.sc-ds-panel-nav{opacity:0;transition:opacity var(--_nav-label-fade-out-motion)}.panel-nav--collapsed.sc-ds-panel-nav .panel-nav__footer-icon-collapsed.sc-ds-panel-nav{opacity:1;transition:opacity var(--_nav-label-fade-out-motion)}.panel-nav__user-initial.sc-ds-panel-nav{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;color:var(--_nav-fg-secondary);text-transform:uppercase;line-height:1;pointer-events:none;transition:color var(--effect-motion-short-3, 200ms ease)}.panel-nav__resize-handle.sc-ds-panel-nav{position:absolute;top:0;right:var(--dimension-space-n050, -4px);bottom:0;width:var(--dimension-space-100, 8px);z-index:20;cursor:ew-resize;touch-action:none;background:transparent}.panel-nav__resize-handle.sc-ds-panel-nav::before{content:'';position:absolute;inset:0;background:rgba(0, 0, 0, 0.001)}.panel-nav__resize-handle.sc-ds-panel-nav::after{content:'';position:absolute;top:0;bottom:0;left:50%;transform:translateX(-50%);width:var(--dimension-stroke-width-025, 2px);background:var(--color-foreground-primary);opacity:0;pointer-events:none;transition:opacity var(--effect-motion-short-2, 100ms ease-in-out)}.panel-nav__resize-handle--overlay.sc-ds-panel-nav::after{opacity:1}@media (prefers-reduced-motion: reduce){.panel-nav.sc-ds-panel-nav,.panel-nav.sc-ds-panel-nav *.sc-ds-panel-nav,.panel-nav.sc-ds-panel-nav *.sc-ds-panel-nav::before,.panel-nav.sc-ds-panel-nav *.sc-ds-panel-nav::after,.panel-nav__resize-handle.sc-ds-panel-nav,.panel-nav__resize-handle.sc-ds-panel-nav::before,.panel-nav__resize-handle.sc-ds-panel-nav::after{transition-duration:0.01ms !important;animation-duration:0.01ms !important;transition-delay:0.01ms !important}}`;const A=e(class e extends a{constructor(e){super();if(e!==false){this.__registerHost()}this.dsNavSelect=n(this,"dsNavSelect");this.dsNavToggle=n(this,"dsNavToggle");this.dsChromeTransitionStart=n(this,"dsChromeTransitionStart");this.dsChromeTransitionEnd=n(this,"dsChromeTransitionEnd");this.dsNavFooterAction=n(this,"dsNavFooterAction");this.dsNavUserAction=n(this,"dsNavUserAction");this.navStyle="dashboard";this.disableViewTransition=false;this.groups="[]";this.routerMode="anchor";this.activeId="";this.collapsed=false;this.breakpoint=0;this.storageKey="";this.currentUrl="";this.userName="";this.userInitial="";this.renderedStyle="dashboard";this.parsedGroups=[];this.isAnimating=false;this.rovingIndex=0;this.viewportNarrow=false;this.urlDerivedActiveId="";this.isDragging=false;this.dragStartX=0;this.didSnap=false;this.lastDeltaX=0;this.edgeOverlayTimer=null;this.showEdgeOverlay=false}get effectiveActiveId(){return this.urlDerivedActiveId||this.activeId}get effectiveDisableViewTransition(){return x(this.disableViewTransition,this.el.getAttribute("disable-view-transition"))}onCollapsedChange(e,a){if(a===undefined)return;this.startCollapseAnimation()}onViewportNarrowChange(e,a){if(a===undefined)return;this.startCollapseAnimation()}onBreakpointChange(){this.disconnectResizeObserver();if(this.breakpoint>0)this.connectResizeObserver()}onGroupsChange(e){this.parsedGroups=y(e);this.rovingIndex=0;this.syncActiveFromUrl()}onActiveIdChange(){}onCurrentUrlChange(){this.syncActiveFromUrl()}onNavStyleChange(e){this.renderedStyle=e}componentWillLoad(){this.renderedStyle=u(this.navStyle,this.el.getAttribute("nav-style"));if(this.storageKey){try{const e=localStorage.getItem(this.storageKey);if(e!==null)this.collapsed=e==="true"}catch{}}this.onGroupsChange(this.groups);this.syncActiveFromUrl()}componentDidLoad(){this.syncHostPropsIfNeeded();this.scheduleDeferredHostPropSync();if(this.breakpoint>0)this.connectResizeObserver()}disconnectedCallback(){this.disconnectResizeObserver();this.clearEdgeOverlayTimer();if(this.globalMouseMoveHandler){window.removeEventListener("mousemove",this.globalMouseMoveHandler)}if(this.globalMouseUpHandler){window.removeEventListener("mouseup",this.globalMouseUpHandler)}}startCollapseAnimation(){this.isAnimating=true;this.dsChromeTransitionStart.emit({source:"panel-nav"});const e=this.el.querySelector(".panel-nav");const a=e?.getBoundingClientRect().width??0;if(this.transitionEndHandler){e?.removeEventListener("transitionend",this.transitionEndHandler)}this.transitionEndHandler=a=>{if(a.propertyName==="width"){this.finishCollapseAnimation(e)}};e?.addEventListener("transitionend",this.transitionEndHandler);requestAnimationFrame((()=>{requestAnimationFrame((()=>{if(!this.isAnimating)return;const n=e?.getBoundingClientRect().width??0;if(Math.abs(n-a)<1){this.finishCollapseAnimation(e)}}))}))}finishCollapseAnimation(e){if(!this.isAnimating)return;this.isAnimating=false;this.dsChromeTransitionEnd.emit({source:"panel-nav"});if(this.transitionEndHandler){e?.removeEventListener("transitionend",this.transitionEndHandler)}}connectResizeObserver(){this.viewportNarrow=window.innerWidth<this.breakpoint;this.resizeObserver=new ResizeObserver((()=>{this.viewportNarrow=window.innerWidth<this.breakpoint}));this.resizeObserver.observe(document.documentElement)}disconnectResizeObserver(){this.resizeObserver?.disconnect();this.resizeObserver=undefined}syncActiveFromUrl(){if(!this.currentUrl){this.urlDerivedActiveId="";return}this.urlDerivedActiveId=b(this.currentUrl,this.getAllItems())}syncHostPropsIfNeeded(){if(m(this.renderedStyle,this.navStyle)){this.renderedStyle=this.navStyle}if(k(this.parsedGroups,this.groups)){this.onGroupsChange(this.groups)}else if(this.currentUrl){this.syncActiveFromUrl()}}scheduleDeferredHostPropSync(){let a=e.HOST_PROP_SYNC_BUDGET;const n=()=>{this.syncHostPropsIfNeeded();if(--a>0){requestAnimationFrame(n)}};queueMicrotask(n)}applyToggle(e){this.collapsed=e;if(this.storageKey){try{localStorage.setItem(this.storageKey,String(e))}catch{}}this.dsNavToggle.emit(e)}getAllItems(){return this.parsedGroups.flatMap((e=>e.items))}getFooterRovingIndex(){return 1+this.getAllItems().length}getUserRovingIndex(){return this.getFooterRovingIndex()+1}getRovingElement(e){const a=this.getAllItems().length;if(e===0){return this.el.querySelector(".panel-nav__header-btn")}if(e>=1&&e<=a){const a=this.el.querySelectorAll(".panel-nav__body .panel-nav__item");return a[e-1]??null}if(e===this.getFooterRovingIndex()){return this.el.querySelector(".panel-nav__footer-btn .button-icon")}if(e===this.getUserRovingIndex()){return this.el.querySelector(".panel-nav__footer-user")}return null}focusRovingAt(e){this.rovingIndex=e;this.getRovingElement(e)?.focus({preventScroll:true})}activateRovingIndex(e){const a=this.getAllItems().length;const n=this.getAllItems();if(e===0){this.handleToggle();return}if(e>=1&&e<=a){this.handleItemClick(n[e-1].id);return}if(e===this.getFooterRovingIndex()){this.handleFooterAction();return}if(e===this.getUserRovingIndex()){const e=this.el.querySelector(`#${w}`);if(e)this.dsNavUserAction.emit({anchor:e,menuPlacement:p})}}handleRovingKeyDown(e,a){if(e.key==="Enter"||e.key===" "){e.preventDefault();this.activateRovingIndex(a);return}const n=this.getFooterRovingIndex();const s=this.getUserRovingIndex();let i;switch(e.key){case"ArrowDown":if(a===s)return;if(a===n)i=s;else i=a+1;break;case"ArrowUp":if(a===0)return;if(a===s)i=n;else if(a===n)i=n-1;else i=a-1;break;case"ArrowRight":if(a===n)i=s;else return;break;case"ArrowLeft":if(a===s)i=n;else return;break;case"Home":e.preventDefault();i=0;break;case"End":e.preventDefault();i=s;break;default:return}if(i===undefined||i===a)return;e.preventDefault();this.focusRovingAt(i)}handleItemClick(e){this.dsNavSelect.emit(e)}handleToggle(){this.applyToggle(!this.collapsed)}async toggleCollapsed(){this.handleToggle()}handleFooterAction(){this.dsNavFooterAction.emit()}handleUserAction(e){const a=e.currentTarget;this.dsNavUserAction.emit({anchor:a,menuPlacement:p})}clearEdgeOverlayTimer(){if(this.edgeOverlayTimer!==null){window.clearTimeout(this.edgeOverlayTimer);this.edgeOverlayTimer=null}}handleResizeHandleMouseEnter(){this.clearEdgeOverlayTimer();this.edgeOverlayTimer=window.setTimeout((()=>{this.showEdgeOverlay=true;this.edgeOverlayTimer=null}),500)}handleResizeHandleMouseLeave(){if(this.isDragging)return;this.clearEdgeOverlayTimer();this.showEdgeOverlay=false}handleResizeHandleMouseDown(e){e.preventDefault();e.stopPropagation();const a=this.collapsed||this.viewportNarrow;this.isDragging=true;this.dragStartX=e.clientX;this.didSnap=false;this.lastDeltaX=0;this.clearEdgeOverlayTimer();this.showEdgeOverlay=false;document.body.style.cursor="ew-resize";document.body.style.userSelect="none";const n=e=>{const n=e.clientX-this.dragStartX;this.lastDeltaX=Math.abs(n);if(this.didSnap)return;if(!a&&n<-8){this.applyToggle(true);this.didSnap=true}else if(a&&n>8){this.applyToggle(false);this.didSnap=true}};const s=()=>{if(!this.didSnap&&this.lastDeltaX<3){this.applyToggle(!a)}this.isDragging=false;this.showEdgeOverlay=false;document.body.style.cursor="";document.body.style.userSelect="";window.removeEventListener("mousemove",n);window.removeEventListener("mouseup",s);this.globalMouseMoveHandler=undefined;this.globalMouseUpHandler=undefined};this.globalMouseMoveHandler=n;this.globalMouseUpHandler=s;window.addEventListener("mousemove",n);window.addEventListener("mouseup",s)}renderNavItem(e,a,n){const i=e.id===this.effectiveActiveId;const t=a+1;const o=[s("span",{class:"panel-nav__item-icon"},s("ds-icon",{name:e.icon,size:"md",color:"inherit",flag:e.flag})),s("span",{class:"panel-nav__item-label"},s("span",{class:"panel-nav__item-label-text"},s("ds-text",{as:"span",variant:i?"text-body-medium-emphasis":"text-body-medium",color:"inherit"},e.label))),e.dot&&s("ds-badge",{class:"panel-nav__item-dot",variant:"dot",background:"var(--_nav-bg)",label:"","aria-hidden":"true"})];const r={class:{"panel-nav__item":true,"panel-nav__item--active":i,"ds-focus-ring-inset":true},"aria-current":i?"page":undefined,title:n?e.label:undefined,tabIndex:t===this.rovingIndex?0:-1,onClick:()=>this.handleItemClick(e.id),onKeyDown:e=>this.handleRovingKeyDown(e,t),onFocus:()=>{this.rovingIndex=t}};const l=this.routerMode==="anchor"&&e.href;return l?s("a",{...r,href:e.href},o):s("button",{...r,type:"button"},o)}render(){const e=this.renderedStyle;const a=e==="dashboard";const n=this.navStyle==="dashboard";const t=this.collapsed||this.viewportNarrow;const{userName:r,userInitial:l}=this;const d={"panel-nav":true,"panel-nav--dashboard":n,"panel-nav--settings":!n,"panel-nav--collapsed":t,"panel-nav--animating":this.isAnimating};return s(i,{key:"44a4447696239390ef9a2eecb2f99ea279e48b5d",style:{display:"block",position:"relative"}},s("nav",{key:"6fdf3c52a5ac037913cdf8cf748681e2b78cd4a5",class:d,"aria-label":a?"Dashboard navigation":"Settings navigation"},s("div",{key:"49a1401ec6bf7810dffbf7809a343d20224f1587",class:"panel-nav__header"},s("button",{key:"4aa7025b17e341f8f4dcdbe7213b56d883db9523",type:"button",class:"panel-nav__header-btn ds-focus-ring-inset",tabIndex:this.rovingIndex===0?0:-1,onClick:()=>this.handleToggle(),onKeyDown:e=>this.handleRovingKeyDown(e,0),onFocus:()=>{this.rovingIndex=0},"aria-label":t?"Expand navigation":"Collapse navigation","aria-expanded":t?"false":"true"},s("span",{key:"87f3417176af648852d5b35a59663dda90c6d049",class:"panel-nav__header-logo","aria-hidden":"true"},s("svg",{key:"918eab9380be82c2b9ecdae0875e38bd1c68ffca",class:"panel-nav__m-mark",viewBox:"0 0 20 20",fill:"none",xmlns:"http://www.w3.org/2000/svg",focusable:"false","aria-hidden":"true"},s("path",{key:"036d7287f1c416afc6aa76f2650f7f61f0f21ee3",d:"M11.1159 4.31537H7.67021L2.53401 13.0703H0V15.6875H4.02716L8.24319 8.49978V15.6846H11.6342L15.8289 8.47829V15.6846H18.7122V4.3125H15.2559L11.1159 11.3648V4.31537Z",fill:"currentColor"}))),s("span",{key:"1d214aeaaef6d35908484931cd1b7c4f8a03454a",class:"panel-nav__header-toggle","aria-hidden":"true"},s("ds-icon",{key:"9bac15a30e357644b0fcc7b83de69dd197f1f5eb",name:t?"LeftExpandB":"LeftCollapseB",size:"md",color:"inherit"})))),s("div",{key:"fa672362f5dae452aa05b540adff29022d0cc020",class:{"panel-nav__body":true,...o({edges:"bottom"})}},(()=>{let e=0;return this.parsedGroups.map((a=>s("div",{class:"panel-nav__group"},a.label&&s("span",{class:"panel-nav__group-label"},s("span",{class:"panel-nav__item-label-text"},s("ds-text",{as:"span",variant:"text-caption-emphasis",color:"inherit"},a.label))),a.items.map((a=>this.renderNavItem(a,e++,t))))))})()),s("div",{key:"71c635ae6e85cf702bda21e22614768ea1bc9d52",class:"panel-nav__footer"},s("ds-button-unfilled-icon",{key:"44bd850906ac911a6c7f73a597c5806528ca3eab",class:"panel-nav__footer-btn",icon:a?"Gear":"Dashboard",activeFill:false,focusTabIndex:this.rovingIndex===this.getFooterRovingIndex()?0:-1,title:a?"Settings":"Dashboard","aria-label":a?"Open settings":"Go to dashboard",onDsClick:()=>this.handleFooterAction(),onKeyDown:e=>this.handleRovingKeyDown(e,this.getFooterRovingIndex()),onFocusin:()=>{this.rovingIndex=this.getFooterRovingIndex()}}),s("button",{key:"cd93414f58852bc59a83e1274304741c83fc70ba",type:"button",id:w,class:"panel-nav__item panel-nav__footer-user ds-focus-ring-inset",tabIndex:this.rovingIndex===this.getUserRovingIndex()?0:-1,"aria-label":t?`User: ${r}`:`User menu for ${r}`,onClick:e=>this.handleUserAction(e),onKeyDown:e=>this.handleRovingKeyDown(e,this.getUserRovingIndex()),onFocus:()=>{this.rovingIndex=this.getUserRovingIndex()}},s("span",{key:"78bcb3658a600b654a303222ab8c66dda7c5c5eb",class:"panel-nav__item-label panel-nav__footer-user-label"},s("span",{key:"c0e4a2ff2c02f6e99e1a69b7aad0127541225050",class:"panel-nav__item-label-text"},s("ds-text",{key:"d6ab9f4b40085c23bf56e1937c494f7cdb25aeca",as:"span",variant:"text-body-medium-emphasis",color:"inherit"},r))),s("span",{key:"7b4af7ebeeb6284501e0d433a9def680b8491e16",class:"panel-nav__item-icon panel-nav__footer-user-icon","aria-hidden":"true"},s("span",{key:"7f2a2357f300d3d49ea2791502c2ba75f9221fdf",class:"panel-nav__footer-icon-expanded"},s("ds-icon",{key:"59c33c811282c2fd05d0a41c3744c952914e1319",name:"ChevronUpDown",size:"md",color:"inherit"})),s("span",{key:"adc3f7a2d468c15cc659d4cac0b5f7c3096d0402",class:"panel-nav__footer-icon-collapsed"},s("ds-icon",{key:"cdd1eb9a0e043ac0688cff039ba55da43d16cf94",name:"Circle",size:"md",color:"inherit"}),s("span",{key:"e33c4c137983e198f53d3aae08cd795733945441",class:"panel-nav__user-initial"},s("ds-text",{key:"3d4a2a6f06d5fd3c759ac56127a645168c356156",as:"span",variant:"text-caption-emphasis",color:"inherit"},l))))))),!this.viewportNarrow&&s("div",{key:"38f558ee69173730b890869d9e88837a7841e2c7",class:{"panel-nav__resize-handle":true,"panel-nav__resize-handle--overlay":this.showEdgeOverlay},onMouseEnter:()=>this.handleResizeHandleMouseEnter(),onMouseLeave:()=>this.handleResizeHandleMouseLeave(),onMouseDown:e=>this.handleResizeHandleMouseDown(e),"aria-hidden":"true"}))}get el(){return this}static get watchers(){return{collapsed:[{onCollapsedChange:0}],viewportNarrow:[{onViewportNarrowChange:0}],breakpoint:[{onBreakpointChange:0}],groups:[{onGroupsChange:0}],activeId:[{onActiveIdChange:0}],urlDerivedActiveId:[{onActiveIdChange:0}],currentUrl:[{onCurrentUrlChange:0}],navStyle:[{onNavStyleChange:0}]}}static get style(){return z()+C()}},[2,"ds-panel-nav",{navStyle:[513,"nav-style"],disableViewTransition:[4,"disable-view-transition"],groups:[1],routerMode:[1,"router-mode"],activeId:[1,"active-id"],collapsed:[1028],breakpoint:[2],storageKey:[1,"storage-key"],currentUrl:[1,"current-url"],userName:[1,"user-name"],userInitial:[1,"user-initial"],renderedStyle:[32],parsedGroups:[32],isAnimating:[32],rovingIndex:[32],viewportNarrow:[32],urlDerivedActiveId:[32],showEdgeOverlay:[32],toggleCollapsed:[64]},undefined,{collapsed:[{onCollapsedChange:0}],viewportNarrow:[{onViewportNarrowChange:0}],breakpoint:[{onBreakpointChange:0}],groups:[{onGroupsChange:0}],activeId:[{onActiveIdChange:0}],urlDerivedActiveId:[{onActiveIdChange:0}],currentUrl:[{onCurrentUrlChange:0}],navStyle:[{onNavStyleChange:0}]}]);A.HOST_PROP_SYNC_BUDGET=8;function I(){if(typeof customElements==="undefined"){return}const e=["ds-panel-nav","ds-badge","ds-button-unfilled-icon","ds-icon","ds-text"];e.forEach((e=>{switch(e){case"ds-panel-nav":if(!customElements.get(t(e))){customElements.define(t(e),A)}break;case"ds-badge":if(!customElements.get(t(e))){r()}break;case"ds-button-unfilled-icon":if(!customElements.get(t(e))){l()}break;case"ds-icon":if(!customElements.get(t(e))){d()}break;case"ds-text":if(!customElements.get(t(e))){c()}break}}))}I();const D=A;const N=I;export{D as DsPanelNav,N as defineCustomElement};
|
|
2
2
|
//# sourceMappingURL=ds-panel-nav.js.map
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{p as e,H as t,c as s,h as o,a,t as i}from"./index.js";import{p as n}from"./p-BOQnc-M4.js";import{d as l}from"./p-EK1hOP19.js";import{d as r}from"./p-B6ZyVOGV.js";import{d}from"./p-B7HWSpyT.js";const c="search";const h={search:"Search",messages:"Messages",stacks:"Stacks",activity:"Activity",agents:"Agents"};function p(e,t){if(t){return n(t,[])}return e??[]}function f(e,t){return!e&&t==="idle"}function b(e,t,s){if(e&&t===s){return{open:false,activeTool:s,selected:false}}return{open:true,activeTool:s,selected:true}}const u=()=>`.sc-ds-panel-tools-h{display:block;flex:0 0 auto;box-sizing:border-box;height:100%;min-height:0;overflow:hidden;--_panel-tools-rail-width:var(--dimension-size-600);--_panel-tools-drawer-width:var(--dimension-panel-width-sm);--_panel-tools-border:var(--dimension-stroke-width-012, 1px) solid var(--color-border-tertiary);--_panel-tools-surface-bg:var(--color-background-secondary);--_panel-tools-expand-dur:var(--effect-animation-duration-medium-1, 300ms)}.panel-tools__layout.sc-ds-panel-tools{display:flex;flex-direction:row-reverse;align-items:stretch;height:100%;min-height:0;box-sizing:border-box}.panel-tools__drawer.sc-ds-panel-tools{flex:0 0 auto;max-width:0;min-width:0;height:100%;min-height:0;overflow:hidden;box-sizing:border-box;transition:none}.panel-tools--ready.panel-tools--motion-opening.sc-ds-panel-tools-h .panel-tools__drawer.sc-ds-panel-tools{transition:max-width var(--_panel-tools-expand-dur) var(--effect-animation-easing-ease-out, ease-out)}.panel-tools--ready.panel-tools--motion-closing.sc-ds-panel-tools-h .panel-tools__drawer.sc-ds-panel-tools{transition:max-width var(--_panel-tools-expand-dur) var(--effect-animation-easing-ease-in, ease-in)}.panel-tools--open.sc-ds-panel-tools-h .panel-tools__drawer.sc-ds-panel-tools{max-width:var(--_panel-tools-drawer-width)}.panel-tools__drawer--visible.sc-ds-panel-tools{border-left:var(--_panel-tools-border)}.panel-tools__drawer-surface.sc-ds-panel-tools{display:flex;flex-direction:column;width:var(--_panel-tools-drawer-width);height:100%;min-height:0;box-sizing:border-box;background-color:var(--_panel-tools-surface-bg)}ds-app-shell[gradient].sc-ds-panel-tools-h .panel-tools__drawer-surface.sc-ds-panel-tools,ds-app-shell[gradient] .sc-ds-panel-tools-h .panel-tools__drawer-surface.sc-ds-panel-tools,ds-app-shell[gradient].sc-ds-panel-tools-h .panel-tools__rail.sc-ds-panel-tools,ds-app-shell[gradient] .sc-ds-panel-tools-h .panel-tools__rail.sc-ds-panel-tools{background-color:transparent}.panel-tools__header.sc-ds-panel-tools{flex:0 0 auto;display:flex;align-items:center;height:var(--dimension-size-600);padding:var(--dimension-space-100);border-bottom:var(--_panel-tools-border);color:var(--color-foreground-primary);box-sizing:border-box;-webkit-user-select:none;user-select:none}.panel-tools__title.sc-ds-panel-tools{display:inline-flex;align-items:center;height:var(--dimension-size-400);padding-inline:var(--dimension-space-100);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.panel-tools__body.sc-ds-panel-tools{flex:1 1 auto;min-height:0;overflow:auto;position:relative}.panel-tools--drawer-resting.sc-ds-panel-tools-h .panel-tools__body.sc-ds-panel-tools{content-visibility:auto;contain-intrinsic-size:auto 200px}.panel-tools__view.sc-ds-panel-tools{display:none;height:100%;min-height:0;box-sizing:border-box;padding:var(--dimension-space-200);color:var(--color-foreground-secondary);font-family:var(--typography-font-family);font-size:var(--typography-fontsize-md);line-height:var(--typography-lineheight-md);font-weight:var(--typography-weight-regular);letter-spacing:var(--typography-letterspacing-negative-half)}.panel-tools__view.sc-ds-panel-tools-s>*,.panel-tools__view .sc-ds-panel-tools-s>*{margin:0;color:var(--color-foreground-secondary);font-family:var(--typography-font-family);font-size:var(--typography-fontsize-md);line-height:var(--typography-lineheight-md);font-weight:var(--typography-weight-regular);letter-spacing:var(--typography-letterspacing-negative-half)}.panel-tools__view--active.sc-ds-panel-tools{display:block}.panel-tools__rail.sc-ds-panel-tools{flex:0 0 var(--_panel-tools-rail-width);width:var(--_panel-tools-rail-width);min-width:var(--_panel-tools-rail-width);display:flex;flex-direction:column;box-sizing:border-box;height:100%;min-height:0;border-left:var(--_panel-tools-border);background-color:var(--_panel-tools-surface-bg)}.panel-tools__rail-header.sc-ds-panel-tools{display:flex;align-items:center;justify-content:center;height:var(--dimension-size-600);padding:var(--dimension-space-100);flex-shrink:0;box-sizing:border-box;border-bottom:var(--_panel-tools-border)}.panel-tools__rail-body.sc-ds-panel-tools{flex:1 1 auto;min-height:0;overflow-y:auto;overflow-x:hidden;display:flex;flex-direction:column;gap:var(--dimension-space-050);padding:var(--dimension-space-100);box-sizing:border-box;scrollbar-width:none}.panel-tools__rail-body.sc-ds-panel-tools::-webkit-scrollbar{display:none}.panel-tools__rail-action.sc-ds-panel-tools{display:flex;align-items:center;justify-content:center;width:100%;height:var(--dimension-size-400);flex-shrink:0}`;const m=e(class e extends t{constructor(e){super();if(e!==false){this.__registerHost()}this.dsToolChange=s(this,"dsToolChange");this.dsChromeTransitionStart=s(this,"dsChromeTransitionStart");this.dsChromeTransitionEnd=s(this,"dsChromeTransitionEnd");this.open=false;this.activeTool="";this.items=[];this.itemsJson="";this.motion="idle";this.readyForMotion=false;this.rovingIndex=0;this.motionEnableGeneration=0;this.handleTransitionEnd=e=>{if(e.target!==this.el.querySelector(".panel-tools__drawer"))return;if(e.propertyName!=="max-width")return;this.motion="idle";this.dsChromeTransitionEnd.emit({source:"panel-tools"})};this.handleToolChange=e=>{const t=b(this.open,this.activeTool,e);this.open=t.open;this.activeTool=t.activeTool;this.dsToolChange.emit({id:e,selected:t.selected})};this.handleRailKeyDown=(e,t)=>{const s=this.orderedRailItems;if(!s.length)return;if(e.key==="Enter"||e.key===" "){e.preventDefault();this.handleToolChange(s[t].id);return}if(e.key==="ArrowDown"){if(t>=s.length-1)return;e.preventDefault();this.focusRailAt(t+1);return}if(e.key==="ArrowUp"){if(t<=0)return;e.preventDefault();this.focusRailAt(t-1)}}}get railItems(){return p(this.items,this.itemsJson)}get orderedRailItems(){const e=this.railItems;const t=e.find((e=>e.id===c));const s=e.filter((e=>e.id!==c));return t?[t,...s]:s}disconnectedCallback(){this.el.removeEventListener("transitionend",this.handleTransitionEnd);this.motionEnableGeneration+=1}deferMotionEnable(){if(this.readyForMotion)return;const e=++this.motionEnableGeneration;requestAnimationFrame((()=>{if(e!==this.motionEnableGeneration)return;requestAnimationFrame((()=>{if(e!==this.motionEnableGeneration)return;this.readyForMotion=true}))}))}connectedCallback(){this.el.addEventListener("transitionend",this.handleTransitionEnd)}openChanged(e,t){if(this.readyForMotion&&t!==undefined&&t!==e){this.motion=e?"opening":"closing";this.dsChromeTransitionStart.emit({source:"panel-tools",phase:e?"opening":"closing"})}this.deferMotionEnable()}activeToolChanged(){this.deferMotionEnable()}componentDidLoad(){this.deferMotionEnable()}itemsChanged(){this.rovingIndex=0;this.deferMotionEnable()}isRailSelected(e){return this.open&&this.activeTool===e}isDrawerPresent(){return this.open||this.motion==="closing"}isViewActive(e){return this.isDrawerPresent()&&this.activeTool===e}headerLabel(){if(!this.isDrawerPresent()||!this.activeTool)return"";return h[this.activeTool]??""}async activateTool(e){const t=this.railItems.find((t=>t.id===e));if(!t||t.inactive)return;this.handleToolChange(e)}async closeDrawer(){if(!this.open)return;const e=this.activeTool;this.open=false;if(e){this.dsToolChange.emit({id:e,selected:false})}}focusRailAt(e){const t=this.orderedRailItems;if(!t.length)return;const s=Math.max(0,Math.min(e,t.length-1));if(s===this.rovingIndex)return;this.rovingIndex=s;const o=Array.from(this.el.querySelectorAll(".panel-tools__rail-action .button-icon"));o[s]?.focus({preventScroll:true})}renderRailAction(e,t){return o("ds-button-unfilled-icon",{key:e.id,class:"panel-tools__rail-action",icon:e.icon,isActive:this.isRailSelected(e.id),activeFill:false,dot:e.dot??false,inactive:e.inactive,focusTabIndex:t===this.rovingIndex?0:-1,"aria-label":e.ariaLabel??h[e.id],pressed:this.isRailSelected(e.id),onFocusin:()=>{this.rovingIndex=t},onKeyDown:e=>this.handleRailKeyDown(e,t),onDsClick:()=>this.handleToolChange(e.id)})}render(){const e=this.headerLabel();const t=this.orderedRailItems;const s=t.find((e=>e.id===c));const i=t.filter((e=>e.id!==c));const n=this.isDrawerPresent();const l=f(this.open,this.motion);return o(a,{key:"ac0d965dde5d8b75215d8a22e11f554d7c111ba5",class:{"panel-tools":true,"panel-tools--open":this.open,"panel-tools--ready":this.readyForMotion,"panel-tools--motion-opening":this.motion==="opening","panel-tools--motion-closing":this.motion==="closing","panel-tools--drawer-resting":l},role:"complementary","aria-label":"Tools"},o("div",{key:"d6cba7142ac428a55975e775f7cea3ec196a54c9",class:"panel-tools__layout"},o("nav",{key:"b2f2cb5c595da32592a3ebc420ca0f4621b624d0",class:"panel-tools__rail","aria-label":"Tool shortcuts"},s?o("div",{class:"panel-tools__rail-header"},this.renderRailAction(s,0)):null,o("div",{key:"47cdd627a93ae4452dbf6f1f51b254fa93aa7344",class:"panel-tools__rail-body"},i.map(((e,t)=>this.renderRailAction(e,s?t+1:t))))),o("div",{key:"36e76929dbe79bb3080478a3503ca35daa64e784",class:{"panel-tools__drawer":true,"panel-tools__drawer--visible":n},"aria-hidden":n?null:"true",inert:n?undefined:true},o("div",{key:"6edf2d4f731bd8424eddb87178589adec15c1120",class:"panel-tools__drawer-surface"},o("header",{key:"4b3d064bfdbadca70414505f46e7fa5ebeb434c7",class:"panel-tools__header"},o("span",{key:"3a8bcdea26782562f6ac9bb5b6aba081f9abc6ca",class:"panel-tools__title text-body-medium-emphasis"},e)),o("div",{key:"43dd430415427705df26fa558d51717bf95d42be",class:"panel-tools__body"},o("div",{key:"32e7ea302408a7f3ee7568d11d2afd16ad54aa26",class:{"panel-tools__view":true,"panel-tools__view--active":this.isViewActive("search"),"text-body-medium":true},hidden:!this.isViewActive("search")},o("slot",{key:"307033a0284fa3a3e9cbd09c873ee1e9a7e733dd",name:"search"})),o("div",{key:"a489b39ff485f7b24afdb0fd97daa22bf4491756",class:{"panel-tools__view":true,"panel-tools__view--active":this.isViewActive("messages"),"text-body-medium":true},hidden:!this.isViewActive("messages")},o("slot",{key:"3daab8b59ec1268eb102e51587220f99466ffcbe",name:"messages"})),o("div",{key:"ff4baf398c1470bdea33b4f7f42cd7523c5af3d7",class:{"panel-tools__view":true,"panel-tools__view--active":this.isViewActive("stacks"),"text-body-medium":true},hidden:!this.isViewActive("stacks")},o("slot",{key:"b019044734a873c517fa63a56b213bf5bacb7bfc",name:"stacks"})),o("div",{key:"6259c70da186f4500b719b2e292a607bbf7ec82e",class:{"panel-tools__view":true,"panel-tools__view--active":this.isViewActive("activity"),"text-body-medium":true},hidden:!this.isViewActive("activity")},o("slot",{key:"5ab26ba976e0df8621ad5ef282b91ced6ecf49c0",name:"activity"})),o("div",{key:"cea49f6d2d6c9c003407ec5850829fc5c92488e5",class:{"panel-tools__view":true,"panel-tools__view--active":this.isViewActive("agents"),"text-body-medium":true},hidden:!this.isViewActive("agents")},o("slot",{key:"59866ad118c8a8b29d4b84e02b2926bfc07a193b",name:"agents"})))))))}get el(){return this}static get watchers(){return{open:[{openChanged:0}],activeTool:[{activeToolChanged:0}],items:[{itemsChanged:0}],itemsJson:[{itemsChanged:0}]}}static get style(){return u()}},[262,"ds-panel-tools",{open:[1540],activeTool:[1537,"active-tool"],items:[16],itemsJson:[1,"items-json"],motion:[32],readyForMotion:[32],rovingIndex:[32],activateTool:[64],closeDrawer:[64]},undefined,{open:[{openChanged:0}],activeTool:[{activeToolChanged:0}],items:[{itemsChanged:0}],itemsJson:[{itemsChanged:0}]}]);function g(){if(typeof customElements==="undefined"){return}const e=["ds-panel-tools","ds-badge","ds-button-unfilled-icon","ds-icon"];e.forEach((e=>{switch(e){case"ds-panel-tools":if(!customElements.get(i(e))){customElements.define(i(e),m)}break;case"ds-badge":if(!customElements.get(i(e))){l()}break;case"ds-button-unfilled-icon":if(!customElements.get(i(e))){r()}break;case"ds-icon":if(!customElements.get(i(e))){d()}break}}))}g();const v=m;const _=g;export{v as DsPanelTools,_ as defineCustomElement};
|
|
1
|
+
import{p as e,H as t,c as s,h as o,a,t as i}from"./index.js";import{p as n}from"./p-BOQnc-M4.js";import{d as l}from"./p-EK1hOP19.js";import{d as r}from"./p-BSFgy5r6.js";import{d}from"./p-8Nt92j1-.js";const c="search";const h={search:"Search",messages:"Messages",stacks:"Stacks",activity:"Activity",agents:"Agents"};function p(e,t){if(t){return n(t,[])}return e??[]}function f(e,t){return!e&&t==="idle"}function b(e,t,s){if(e&&t===s){return{open:false,activeTool:s,selected:false}}return{open:true,activeTool:s,selected:true}}const u=()=>`.sc-ds-panel-tools-h{display:block;flex:0 0 auto;box-sizing:border-box;height:100%;min-height:0;overflow:hidden;--_panel-tools-rail-width:var(--dimension-size-600);--_panel-tools-drawer-width:var(--dimension-panel-width-sm);--_panel-tools-border:var(--dimension-stroke-width-012, 1px) solid var(--color-border-tertiary);--_panel-tools-surface-bg:var(--color-background-secondary);--_panel-tools-expand-dur:var(--effect-animation-duration-medium-1, 300ms)}.panel-tools__layout.sc-ds-panel-tools{display:flex;flex-direction:row-reverse;align-items:stretch;height:100%;min-height:0;box-sizing:border-box}.panel-tools__drawer.sc-ds-panel-tools{flex:0 0 auto;max-width:0;min-width:0;height:100%;min-height:0;overflow:hidden;box-sizing:border-box;transition:none}.panel-tools--ready.panel-tools--motion-opening.sc-ds-panel-tools-h .panel-tools__drawer.sc-ds-panel-tools{transition:max-width var(--_panel-tools-expand-dur) var(--effect-animation-easing-ease-out, ease-out)}.panel-tools--ready.panel-tools--motion-closing.sc-ds-panel-tools-h .panel-tools__drawer.sc-ds-panel-tools{transition:max-width var(--_panel-tools-expand-dur) var(--effect-animation-easing-ease-in, ease-in)}.panel-tools--open.sc-ds-panel-tools-h .panel-tools__drawer.sc-ds-panel-tools{max-width:var(--_panel-tools-drawer-width)}.panel-tools__drawer--visible.sc-ds-panel-tools{border-left:var(--_panel-tools-border)}.panel-tools__drawer-surface.sc-ds-panel-tools{display:flex;flex-direction:column;width:var(--_panel-tools-drawer-width);height:100%;min-height:0;box-sizing:border-box;background-color:var(--_panel-tools-surface-bg)}ds-app-shell[gradient].sc-ds-panel-tools-h .panel-tools__drawer-surface.sc-ds-panel-tools,ds-app-shell[gradient] .sc-ds-panel-tools-h .panel-tools__drawer-surface.sc-ds-panel-tools,ds-app-shell[gradient].sc-ds-panel-tools-h .panel-tools__rail.sc-ds-panel-tools,ds-app-shell[gradient] .sc-ds-panel-tools-h .panel-tools__rail.sc-ds-panel-tools{background-color:transparent}.panel-tools__header.sc-ds-panel-tools{flex:0 0 auto;display:flex;align-items:center;height:var(--dimension-size-600);padding:var(--dimension-space-100);border-bottom:var(--_panel-tools-border);color:var(--color-foreground-primary);box-sizing:border-box;-webkit-user-select:none;user-select:none}.panel-tools__title.sc-ds-panel-tools{display:inline-flex;align-items:center;height:var(--dimension-size-400);padding-inline:var(--dimension-space-100);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.panel-tools__body.sc-ds-panel-tools{flex:1 1 auto;min-height:0;overflow:auto;position:relative}.panel-tools--drawer-resting.sc-ds-panel-tools-h .panel-tools__body.sc-ds-panel-tools{content-visibility:auto;contain-intrinsic-size:auto 200px}.panel-tools__view.sc-ds-panel-tools{display:none;height:100%;min-height:0;box-sizing:border-box;padding:var(--dimension-space-200);color:var(--color-foreground-secondary);font-family:var(--typography-font-family);font-size:var(--typography-fontsize-md);line-height:var(--typography-lineheight-md);font-weight:var(--typography-weight-regular);letter-spacing:var(--typography-letterspacing-negative-half)}.panel-tools__view.sc-ds-panel-tools-s>*,.panel-tools__view .sc-ds-panel-tools-s>*{margin:0;color:var(--color-foreground-secondary);font-family:var(--typography-font-family);font-size:var(--typography-fontsize-md);line-height:var(--typography-lineheight-md);font-weight:var(--typography-weight-regular);letter-spacing:var(--typography-letterspacing-negative-half)}.panel-tools__view--active.sc-ds-panel-tools{display:block}.panel-tools__rail.sc-ds-panel-tools{flex:0 0 var(--_panel-tools-rail-width);width:var(--_panel-tools-rail-width);min-width:var(--_panel-tools-rail-width);display:flex;flex-direction:column;box-sizing:border-box;height:100%;min-height:0;border-left:var(--_panel-tools-border);background-color:var(--_panel-tools-surface-bg)}.panel-tools__rail-header.sc-ds-panel-tools{display:flex;align-items:center;justify-content:center;height:var(--dimension-size-600);padding:var(--dimension-space-100);flex-shrink:0;box-sizing:border-box;border-bottom:var(--_panel-tools-border)}.panel-tools__rail-body.sc-ds-panel-tools{flex:1 1 auto;min-height:0;overflow-y:auto;overflow-x:hidden;display:flex;flex-direction:column;gap:var(--dimension-space-050);padding:var(--dimension-space-100);box-sizing:border-box;scrollbar-width:none}.panel-tools__rail-body.sc-ds-panel-tools::-webkit-scrollbar{display:none}.panel-tools__rail-action.sc-ds-panel-tools{display:flex;align-items:center;justify-content:center;width:100%;height:var(--dimension-size-400);flex-shrink:0}`;const m=e(class e extends t{constructor(e){super();if(e!==false){this.__registerHost()}this.dsToolChange=s(this,"dsToolChange");this.dsChromeTransitionStart=s(this,"dsChromeTransitionStart");this.dsChromeTransitionEnd=s(this,"dsChromeTransitionEnd");this.open=false;this.activeTool="";this.items=[];this.itemsJson="";this.motion="idle";this.readyForMotion=false;this.rovingIndex=0;this.motionEnableGeneration=0;this.handleTransitionEnd=e=>{if(e.target!==this.el.querySelector(".panel-tools__drawer"))return;if(e.propertyName!=="max-width")return;this.motion="idle";this.dsChromeTransitionEnd.emit({source:"panel-tools"})};this.handleToolChange=e=>{const t=b(this.open,this.activeTool,e);this.open=t.open;this.activeTool=t.activeTool;this.dsToolChange.emit({id:e,selected:t.selected})};this.handleRailKeyDown=(e,t)=>{const s=this.orderedRailItems;if(!s.length)return;if(e.key==="Enter"||e.key===" "){e.preventDefault();this.handleToolChange(s[t].id);return}if(e.key==="ArrowDown"){if(t>=s.length-1)return;e.preventDefault();this.focusRailAt(t+1);return}if(e.key==="ArrowUp"){if(t<=0)return;e.preventDefault();this.focusRailAt(t-1)}}}get railItems(){return p(this.items,this.itemsJson)}get orderedRailItems(){const e=this.railItems;const t=e.find((e=>e.id===c));const s=e.filter((e=>e.id!==c));return t?[t,...s]:s}disconnectedCallback(){this.el.removeEventListener("transitionend",this.handleTransitionEnd);this.motionEnableGeneration+=1}deferMotionEnable(){if(this.readyForMotion)return;const e=++this.motionEnableGeneration;requestAnimationFrame((()=>{if(e!==this.motionEnableGeneration)return;requestAnimationFrame((()=>{if(e!==this.motionEnableGeneration)return;this.readyForMotion=true}))}))}connectedCallback(){this.el.addEventListener("transitionend",this.handleTransitionEnd)}openChanged(e,t){if(this.readyForMotion&&t!==undefined&&t!==e){this.motion=e?"opening":"closing";this.dsChromeTransitionStart.emit({source:"panel-tools",phase:e?"opening":"closing"})}this.deferMotionEnable()}activeToolChanged(){this.deferMotionEnable()}componentDidLoad(){this.deferMotionEnable()}itemsChanged(){this.rovingIndex=0;this.deferMotionEnable()}isRailSelected(e){return this.open&&this.activeTool===e}isDrawerPresent(){return this.open||this.motion==="closing"}isViewActive(e){return this.isDrawerPresent()&&this.activeTool===e}headerLabel(){if(!this.isDrawerPresent()||!this.activeTool)return"";return h[this.activeTool]??""}async activateTool(e){const t=this.railItems.find((t=>t.id===e));if(!t||t.inactive)return;this.handleToolChange(e)}async closeDrawer(){if(!this.open)return;const e=this.activeTool;this.open=false;if(e){this.dsToolChange.emit({id:e,selected:false})}}focusRailAt(e){const t=this.orderedRailItems;if(!t.length)return;const s=Math.max(0,Math.min(e,t.length-1));if(s===this.rovingIndex)return;this.rovingIndex=s;const o=Array.from(this.el.querySelectorAll(".panel-tools__rail-action .button-icon"));o[s]?.focus({preventScroll:true})}renderRailAction(e,t){return o("ds-button-unfilled-icon",{key:e.id,class:"panel-tools__rail-action",icon:e.icon,isActive:this.isRailSelected(e.id),activeFill:false,dot:e.dot??false,inactive:e.inactive,focusTabIndex:t===this.rovingIndex?0:-1,"aria-label":e.ariaLabel??h[e.id],pressed:this.isRailSelected(e.id),onFocusin:()=>{this.rovingIndex=t},onKeyDown:e=>this.handleRailKeyDown(e,t),onDsClick:()=>this.handleToolChange(e.id)})}render(){const e=this.headerLabel();const t=this.orderedRailItems;const s=t.find((e=>e.id===c));const i=t.filter((e=>e.id!==c));const n=this.isDrawerPresent();const l=f(this.open,this.motion);return o(a,{key:"99038bdb2a703f8f91d256f9ec29400ece33019b",class:{"panel-tools":true,"panel-tools--open":this.open,"panel-tools--ready":this.readyForMotion,"panel-tools--motion-opening":this.motion==="opening","panel-tools--motion-closing":this.motion==="closing","panel-tools--drawer-resting":l},role:"complementary","aria-label":"Tools"},o("div",{key:"a9c2e58c2ac770ffeb102ea7cfc217a2f163408a",class:"panel-tools__layout"},o("nav",{key:"6fe1ae3269dfb5d06aec898a6388d316bc6a6317",class:"panel-tools__rail","aria-label":"Tool shortcuts"},s?o("div",{class:"panel-tools__rail-header"},this.renderRailAction(s,0)):null,o("div",{key:"5f7acd3dfd1e90799e929319916d8a4dbd121dba",class:"panel-tools__rail-body"},i.map(((e,t)=>this.renderRailAction(e,s?t+1:t))))),o("div",{key:"e36eecb0a800168b163a3a856c5fb12ab7076b1a",class:{"panel-tools__drawer":true,"panel-tools__drawer--visible":n},"aria-hidden":n?null:"true",inert:n?undefined:true},o("div",{key:"bb61a22b7c20910a1b3d65fd4f5d4453ce0ce1a2",class:"panel-tools__drawer-surface"},o("header",{key:"9446ee5476b0903fc8260731ca828e527352ec82",class:"panel-tools__header"},o("span",{key:"84221b301411ba95b39bc38c4d1934460289f56f",class:"panel-tools__title text-body-medium-emphasis"},e)),o("div",{key:"3d021b22082db0f2fd4aae00ce428708adaf3524",class:"panel-tools__body"},o("div",{key:"84a209ae09b72a8c5ec2749f20ea33f93ba21d76",class:{"panel-tools__view":true,"panel-tools__view--active":this.isViewActive("search"),"text-body-medium":true},hidden:!this.isViewActive("search")},o("slot",{key:"a06f7c36ce1f27ed95a98b6b3cdc3463108bea5c",name:"search"})),o("div",{key:"87456d90cd3384025e11b16f91fbbd5215710847",class:{"panel-tools__view":true,"panel-tools__view--active":this.isViewActive("messages"),"text-body-medium":true},hidden:!this.isViewActive("messages")},o("slot",{key:"6d120440dec715105a5b46af221aa9adb050f7b3",name:"messages"})),o("div",{key:"3598e1b90a6f74bbef6950e3adb87f3375df82ce",class:{"panel-tools__view":true,"panel-tools__view--active":this.isViewActive("stacks"),"text-body-medium":true},hidden:!this.isViewActive("stacks")},o("slot",{key:"96bc6cb41a457abcd48004aa8861c4e982749988",name:"stacks"})),o("div",{key:"a45d71ab8d5237352f45ccb51e24876fb12c5d8f",class:{"panel-tools__view":true,"panel-tools__view--active":this.isViewActive("activity"),"text-body-medium":true},hidden:!this.isViewActive("activity")},o("slot",{key:"8216915104056493c29ef5b446b56639e2d014ac",name:"activity"})),o("div",{key:"de801cef019aab6f201c3bf002f5274c546f5fdd",class:{"panel-tools__view":true,"panel-tools__view--active":this.isViewActive("agents"),"text-body-medium":true},hidden:!this.isViewActive("agents")},o("slot",{key:"6677ddd025c2a0ad25369b6dceb429af59e18366",name:"agents"})))))))}get el(){return this}static get watchers(){return{open:[{openChanged:0}],activeTool:[{activeToolChanged:0}],items:[{itemsChanged:0}],itemsJson:[{itemsChanged:0}]}}static get style(){return u()}},[262,"ds-panel-tools",{open:[1540],activeTool:[1537,"active-tool"],items:[16],itemsJson:[1,"items-json"],motion:[32],readyForMotion:[32],rovingIndex:[32],activateTool:[64],closeDrawer:[64]},undefined,{open:[{openChanged:0}],activeTool:[{activeToolChanged:0}],items:[{itemsChanged:0}],itemsJson:[{itemsChanged:0}]}]);function g(){if(typeof customElements==="undefined"){return}const e=["ds-panel-tools","ds-badge","ds-button-unfilled-icon","ds-icon"];e.forEach((e=>{switch(e){case"ds-panel-tools":if(!customElements.get(i(e))){customElements.define(i(e),m)}break;case"ds-badge":if(!customElements.get(i(e))){l()}break;case"ds-button-unfilled-icon":if(!customElements.get(i(e))){r()}break;case"ds-icon":if(!customElements.get(i(e))){d()}break}}))}g();const v=m;const _=g;export{v as DsPanelTools,_ as defineCustomElement};
|
|
2
2
|
//# sourceMappingURL=ds-panel-tools.js.map
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{p as r,H as i,c as e,h as o,a as s
|
|
1
|
+
import{p as r,H as i,c as e,h as o,a,t as s}from"./index.js";const t=()=>`.group.sc-ds-radio-group{display:flex;flex-direction:column;gap:var(--dimension-space-025)}.group--horizontal.sc-ds-radio-group{flex-direction:row;gap:var(--dimension-space-100)}.radio-item.sc-ds-radio-group{display:flex;align-items:center;gap:var(--dimension-space-050);padding:var(--dimension-space-075);height:var(--dimension-size-400);box-sizing:border-box;cursor:pointer;user-select:none;border-radius:var(--dimension-radius-075);transition:background-color var(--effect-motion-short-2);outline:none}.radio-item.sc-ds-radio-group:hover{background-color:var(--color-interaction-hover)}.radio-item.sc-ds-radio-group:active{background-color:var(--color-interaction-pressed)}.radio-item.sc-ds-radio-group:focus-visible{outline:var(--dimension-stroke-width-025) solid var(--color-interaction-focus);outline-offset:var(--dimension-space-025)}.radio-item--inactive.sc-ds-radio-group{cursor:not-allowed;opacity:0.5;pointer-events:none}.circle.sc-ds-radio-group{width:20px;height:20px;flex-shrink:0;border:1.5px solid var(--color-foreground-secondary);border-radius:var(--dimension-radius-half);display:flex;align-items:center;justify-content:center;box-sizing:border-box;transition:all var(--effect-motion-short-2)}.circle--checked.sc-ds-radio-group{border-color:var(--color-foreground-primary)}.dot.sc-ds-radio-group{width:10px;height:10px;border-radius:var(--dimension-radius-half);background-color:var(--color-foreground-primary)}.radio-label.sc-ds-radio-group{flex:1;min-width:0}`;const n=r(class r extends i{constructor(r){super();if(r!==false){this.__registerHost()}this.dsChange=e(this,"dsChange");this.options=[];this.value="";this.direction="vertical";this.inactive=false}get activeItems(){return Array.from(this.el.querySelectorAll("[data-radio-item]:not([data-inactive])"))}handleKeyDown(r){const i=this.activeItems;if(!i.length)return;const e=i.find((r=>r===document.activeElement));if(!e)return;const o=i.indexOf(e);let a=-1;switch(r.key){case"ArrowDown":case"ArrowRight":r.preventDefault();a=(o+1)%i.length;break;case"ArrowUp":case"ArrowLeft":r.preventDefault();a=(o-1+i.length)%i.length;break;case"Home":r.preventDefault();a=0;break;case"End":r.preventDefault();a=i.length-1;break}if(a>=0){i[a].focus();const r=i[a].dataset["value"];if(r&&r!==this.value){this.value=r;this.dsChange.emit(r)}}}selectItem(r){if(this.inactive)return;if(r!==this.value){this.value=r;this.dsChange.emit(r)}}render(){const r=this.options.findIndex((r=>r.value===this.value));const i=this.options.findIndex((r=>!this.inactive&&!r.inactive));const e=r>=0&&!this.inactive&&!this.options[r]?.inactive?r:i;return o(a,{key:"6293ebd0a80d8e1b432a615f069aec5fa2a6437c",role:"radiogroup","aria-label":this.ariaLabel,"aria-labelledby":this.ariaLabelledby,class:{group:true,"group--horizontal":this.direction==="horizontal"}},this.options.map(((r,i)=>{const a=this.inactive||!!r.inactive;const s=r.value===this.value;const t=a?-1:i===e?0:-1;return o("div",{key:r.value,role:"radio","aria-checked":String(s),"aria-disabled":a||undefined,tabIndex:t,"data-radio-item":true,"data-value":r.value,"data-inactive":a||undefined,class:{"radio-item":true,"radio-item--inactive":a},onClick:()=>!a&&this.selectItem(r.value),onKeyDown:i=>{if((i.key===" "||i.key==="Enter")&&!a){i.preventDefault();this.selectItem(r.value)}}},o("span",{class:{circle:true,"circle--checked":s}},s&&o("span",{class:"dot"})),o("span",{class:"text-body-medium radio-label"},r.label))})))}get el(){return this}static get style(){return t()}},[2,"ds-radio-group",{options:[16],value:[1025],direction:[1],inactive:[4],ariaLabel:[1,"aria-label"],ariaLabelledby:[1,"aria-labelledby"]},[[0,"keydown","handleKeyDown"]]]);function d(){if(typeof customElements==="undefined"){return}const r=["ds-radio-group"];r.forEach((r=>{switch(r){case"ds-radio-group":if(!customElements.get(s(r))){customElements.define(s(r),n)}break}}))}d();const c=n;const l=d;export{c as DsRadioGroup,l as defineCustomElement};
|
|
2
2
|
//# sourceMappingURL=ds-radio-group.js.map
|