@ds-mo/ui 12.6.0 → 12.6.2
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/agent-patterns.json +1 -1
- package/dist/agent.json +10 -7
- package/dist/components/ds-agent-activity.js +1 -1
- package/dist/components/ds-agent-response.js +1 -1
- package/dist/components/ds-agent-source-list.js +1 -1
- package/dist/components/ds-agent-tool-call.js +1 -1
- package/dist/components/ds-bar-nav.js +1 -1
- package/dist/components/ds-bar-nav.js.map +1 -1
- package/dist/components/ds-bar-title.js +1 -1
- package/dist/components/ds-bar-title.js.map +1 -1
- package/dist/components/ds-bar-workflow.js +1 -1
- package/dist/components/ds-breadcrumb.js +1 -1
- package/dist/components/ds-button-filled.js +1 -1
- package/dist/components/ds-button-unfilled.js +1 -1
- package/dist/components/ds-card-data-viz-bar.js +1 -1
- package/dist/components/ds-card-data-viz-donut.js +1 -1
- package/dist/components/ds-card-data-viz-line.js +1 -1
- package/dist/components/ds-card-setting.js +1 -1
- package/dist/components/ds-chart-legend.js +1 -1
- package/dist/components/ds-chart-legend.js.map +1 -1
- package/dist/components/ds-checkbox.js +1 -1
- package/dist/components/ds-chip.js +1 -1
- package/dist/components/ds-chip.js.map +1 -1
- package/dist/components/ds-code-block.js +1 -1
- package/dist/components/ds-conversation-list-item.js +1 -1
- package/dist/components/ds-conversation-list-item.js.map +1 -1
- package/dist/components/ds-input.js +1 -1
- package/dist/components/ds-input.js.map +1 -1
- package/dist/components/ds-markdown.js +1 -1
- package/dist/components/ds-menu.js +1 -1
- package/dist/components/ds-message-composer.js +1 -1
- package/dist/components/ds-message-scroller.js +1 -1
- package/dist/components/ds-mobile-bar-nav.js +1 -1
- package/dist/components/ds-mobile-bar-nav.js.map +1 -1
- package/dist/components/ds-mobile-header.js +1 -1
- package/dist/components/ds-mobile-section-switcher.js +1 -1
- package/dist/components/ds-mobile-sheet-nav.js +1 -1
- package/dist/components/ds-mobile-sheet-nav.js.map +1 -1
- package/dist/components/ds-modal.js +1 -1
- package/dist/components/ds-panel-nav.js +1 -1
- package/dist/components/ds-panel-nav.js.map +1 -1
- package/dist/components/ds-panel-sub-nav.js +1 -1
- package/dist/components/ds-panel-sub-nav.js.map +1 -1
- package/dist/components/ds-panel-tool-header.js +1 -1
- package/dist/components/ds-panel-tool-search.js +1 -1
- package/dist/components/ds-panel-tools.js +1 -1
- package/dist/components/ds-radio.js +1 -1
- package/dist/components/ds-radio.js.map +1 -1
- package/dist/components/ds-select-multi.js +1 -1
- package/dist/components/ds-select-multi.js.map +1 -1
- package/dist/components/ds-select.js +1 -1
- package/dist/components/ds-select.js.map +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-shell-gradient-swatch.js.map +1 -1
- package/dist/components/ds-shell-tools.js +1 -1
- package/dist/components/ds-shell-tools.js.map +1 -1
- package/dist/components/ds-slider.js +1 -1
- package/dist/components/ds-slider.js.map +1 -1
- package/dist/components/ds-swatch-picker.js +1 -1
- package/dist/components/ds-switch.js +1 -1
- package/dist/components/ds-tab-group.js +1 -1
- package/dist/components/ds-tag.js +1 -1
- package/dist/components/ds-tag.js.map +1 -1
- package/dist/components/ds-toast.js +1 -1
- package/dist/components/ds-toast.js.map +1 -1
- package/dist/components/p-B9bxDfZV.js +2 -0
- package/dist/components/p-B9bxDfZV.js.map +1 -0
- package/dist/components/{p-CICGtu7H.js → p-B9xVWER6.js} +2 -2
- package/dist/components/{p-D4o2D1hk.js → p-BLea0TrP.js} +2 -2
- package/dist/components/p-BbgPGF2a.js +2 -0
- package/dist/components/{p-CXcjwduV.js.map → p-BbgPGF2a.js.map} +1 -1
- package/dist/components/p-BwsGYxZx.js +2 -0
- package/dist/components/{p-YtgcuJYx.js.map → p-BwsGYxZx.js.map} +1 -1
- package/dist/components/{p-D9iN80yX.js → p-CWTih3Gc.js} +2 -2
- package/dist/components/{p-CvKKmZJj.js → p-Ccj5Op6E.js} +2 -2
- package/dist/components/p-CiqnkENu.js +2 -0
- package/dist/components/{p-DTea1Du7.js.map → p-CiqnkENu.js.map} +1 -1
- package/dist/components/{p-B3rbhRAk.js → p-CnHrJTD5.js} +2 -2
- package/dist/components/{p-B3rbhRAk.js.map → p-CnHrJTD5.js.map} +1 -1
- package/dist/components/{p-BHYrsGBw.js → p-DIoiApa-.js} +2 -2
- package/dist/components/{p-BHYrsGBw.js.map → p-DIoiApa-.js.map} +1 -1
- package/dist/components/p-DPME1wUJ.js +2 -0
- package/dist/components/{p-DcFfilOX.js.map → p-DPME1wUJ.js.map} +1 -1
- package/dist/components/{p-DvVW0hxm.js → p-DUlqUNbE.js} +2 -2
- package/dist/components/{p-CLzlL3G4.js → p-DXLWm4PF.js} +2 -2
- package/dist/components/{p-CLzlL3G4.js.map → p-DXLWm4PF.js.map} +1 -1
- package/dist/components/p-DYcC5-R9.js +2 -0
- package/dist/components/{p-46nk9-RO.js.map → p-DYcC5-R9.js.map} +1 -1
- package/dist/components/p-DqubRds2.js +2 -0
- package/dist/components/p-DqubRds2.js.map +1 -0
- package/dist/components/p-DwX7UmLl.js +2 -0
- package/dist/components/{p-CFpWrYAH.js.map → p-DwX7UmLl.js.map} +1 -1
- package/dist/components/p-uQhuDEVt.js +2 -0
- package/dist/components/p-uQhuDEVt.js.map +1 -0
- package/dist/docs/components.json +2 -2
- package/dist/mcp-data/registry/agent-activity.json +1 -1
- package/dist/mcp-data/registry/agent-source-list.json +1 -1
- package/dist/mcp-data/registry/agent-tool-call.json +1 -1
- package/dist/mcp-data/registry/bar-nav.json +1 -1
- package/dist/mcp-data/registry/bar-title.json +1 -1
- package/dist/mcp-data/registry/breadcrumb.json +1 -1
- package/dist/mcp-data/registry/button-filled.json +1 -1
- package/dist/mcp-data/registry/button-unfilled.json +1 -1
- package/dist/mcp-data/registry/checkbox.json +1 -1
- package/dist/mcp-data/registry/chip.json +1 -1
- package/dist/mcp-data/registry/menu.json +7 -7
- package/dist/mcp-data/registry/mobile-bar-nav.json +6 -4
- package/dist/mcp-data/registry/mobile-section-switcher.json +4 -3
- package/dist/mcp-data/registry/mobile-sheet-nav.json +1 -1
- package/dist/mcp-data/registry/panel-nav.json +1 -1
- package/dist/mcp-data/registry/panel-sub-nav.json +1 -1
- package/dist/mcp-data/registry/radio.json +1 -1
- package/dist/mcp-data/registry/registry.json +9 -6
- package/dist/mcp-data/registry/select.json +1 -1
- package/dist/mcp-data/registry/shell-gradient-swatch.json +1 -1
- package/dist/mcp-data/registry/slider.json +1 -1
- package/dist/mcp-data/registry/swatch-picker.json +1 -1
- package/dist/mcp-data/registry/switch.json +1 -1
- package/dist/mcp-data/registry/tab-group.json +1 -1
- package/dist/mcp-data/registry/tag.json +1 -1
- package/dist/mcp-data/registry/toast.json +1 -1
- package/dist/types/components/Menu/Menu.d.ts +1 -1
- package/dist/types/components/MobileBarNav/MobileBarNav.d.ts +11 -0
- package/dist/types/components.d.ts +2 -2
- package/package.json +1 -1
- package/dist/components/p--bSkr_yn.js +0 -2
- package/dist/components/p--bSkr_yn.js.map +0 -1
- package/dist/components/p-46nk9-RO.js +0 -2
- package/dist/components/p-CFpWrYAH.js +0 -2
- package/dist/components/p-CXcjwduV.js +0 -2
- package/dist/components/p-DD1Lgs7O.js +0 -2
- package/dist/components/p-DD1Lgs7O.js.map +0 -1
- package/dist/components/p-DTea1Du7.js +0 -2
- package/dist/components/p-DcFfilOX.js +0 -2
- package/dist/components/p-YtgcuJYx.js +0 -2
- package/dist/components/p-loq_--ce.js +0 -2
- package/dist/components/p-loq_--ce.js.map +0 -1
- /package/dist/components/{p-CICGtu7H.js.map → p-B9xVWER6.js.map} +0 -0
- /package/dist/components/{p-D4o2D1hk.js.map → p-BLea0TrP.js.map} +0 -0
- /package/dist/components/{p-D9iN80yX.js.map → p-CWTih3Gc.js.map} +0 -0
- /package/dist/components/{p-CvKKmZJj.js.map → p-Ccj5Op6E.js.map} +0 -0
- /package/dist/components/{p-DvVW0hxm.js.map → p-DUlqUNbE.js.map} +0 -0
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{p as e,H as s,c as t,h as a,a as o,t as l}from"./index.js";import{C as r}from"./p-DbpfpeQT.js";import{d as i}from"./p-CaRyxTMz.js";import{d as n}from"./p-DcFfilOX.js";import{d}from"./p-C7bZ-jiU.js";import{d as c}from"./p-BAfG3M8z.js";import{d as h}from"./p-Ca-I2UnB.js";import{d as p}from"./p-BwGnhInj.js";import{d as g}from"./p-DWdRSOBV.js";const m=()=>`.ds-control--lg.sc-ds-panel-tool-search,.ds-control--lg.sc-ds-panel-tool-search-h,.ds-control--md.sc-ds-panel-tool-search-h,.ds-control--md.sc-ds-panel-tool-search,.ds-control--sm.sc-ds-panel-tool-search-h,.ds-control--sm.sc-ds-panel-tool-search,.ds-control--xs.sc-ds-panel-tool-search-h,.ds-control--xs.sc-ds-panel-tool-search{--ds-control-radius:var(--dimension-radius-025)}.ds-control--lg.sc-ds-panel-tool-search-h,.ds-control--lg.sc-ds-panel-tool-search{--ds-control-height:var(--dimension-size-500);--ds-control-icon:var(--dimension-iconography-lg);--ds-control-padding-inline:var(--dimension-space-100);--ds-control-label-inset:var(--dimension-space-050);--ds-control-gap:var(--dimension-space-050)}.ds-control--md.sc-ds-panel-tool-search-h,.ds-control--md.sc-ds-panel-tool-search{--ds-control-height:var(--dimension-size-400);--ds-control-icon:var(--dimension-iconography-md);--ds-control-padding-inline:var(--dimension-space-075);--ds-control-label-inset:var(--dimension-space-025);--ds-control-gap:var(--dimension-space-050)}.ds-control--sm.sc-ds-panel-tool-search-h,.ds-control--sm.sc-ds-panel-tool-search{--ds-control-height:var(--dimension-size-300);--ds-control-icon:var(--dimension-iconography-sm);--ds-control-padding-inline:var(--dimension-space-050);--ds-control-label-inset:var(--dimension-space-025);--ds-control-gap:var(--dimension-space-025)}.ds-control--xs.sc-ds-panel-tool-search-h,.ds-control--xs.sc-ds-panel-tool-search{--ds-control-height:var(--dimension-size-200);--ds-control-icon:var(--dimension-iconography-xs);--ds-control-padding-inline:var(--dimension-space-025);--ds-control-label-inset:var(--dimension-space-025);--ds-control-gap:0}.select-search.sc-ds-panel-tool-search{position:relative;box-sizing:border-box;padding:var(--dimension-space-050);background:transparent}.select-search.sc-ds-panel-tool-search::after{content:'';position:absolute;inset:auto 0 0;height:var(--dimension-stroke-width-012);background-color:var(--color-border-tertiary);pointer-events:none}.select-search.sc-ds-panel-tool-search:focus-within::after{height:var(--dimension-stroke-width-018);background-color:var(--color-border-bold-brand)}.select-search__control.sc-ds-panel-tool-search{display:flex;align-items:center;box-sizing:border-box;gap:var(--ds-control-gap, var(--dimension-space-050));height:var(--ds-control-height, var(--dimension-size-400));padding:0 var(--ds-control-padding-inline, var(--dimension-space-075));border:0;border-radius:var(--ds-control-radius, var(--dimension-radius-025))}.select-search__control.sc-ds-panel-tool-search:has(.select-search__clear){padding-right:0}.select-search__control.sc-ds-panel-tool-search>ds-icon.sc-ds-panel-tool-search{flex-shrink:0;color:var(--color-foreground-secondary)}.select-search.sc-ds-panel-tool-search .select-search__control.sc-ds-panel-tool-search .select-search__clear.sc-ds-panel-tool-search{align-self:center;flex-shrink:0;margin-right:var(--dimension-space-050)}.select-search__control.sc-ds-panel-tool-search input.sc-ds-panel-tool-search{flex:1;min-width:0;height:100%;padding:0 var(--ds-control-label-inset, var(--dimension-space-025));border:0;outline:none;background:transparent;color:var(--color-foreground-primary);font-family:inherit}.select-search__control.sc-ds-panel-tool-search input.sc-ds-panel-tool-search::placeholder{color:var(--color-foreground-secondary)}.select-search__control.sc-ds-panel-tool-search input.sc-ds-panel-tool-search:focus::placeholder{color:var(--color-foreground-quaternary)}.select-search__control.sc-ds-panel-tool-search input[type='search'].sc-ds-panel-tool-search::-webkit-search-cancel-button,.select-search__control.sc-ds-panel-tool-search input[type='search'].sc-ds-panel-tool-search::-webkit-search-decoration{display:none}.ds-text--display-medium.sc-ds-panel-tool-search-h,.ds-text--display-medium.sc-ds-panel-tool-search{font-size:var(--typography-fontsize-3xl);line-height:var(--typography-lineheight-3xl)}.ds-text--display-small.sc-ds-panel-tool-search-h,.ds-text--display-small.sc-ds-panel-tool-search{font-size:var(--typography-fontsize-2xl);line-height:var(--typography-lineheight-2xl)}.ds-text--title-large.sc-ds-panel-tool-search-h,.ds-text--title-large.sc-ds-panel-tool-search{font-size:var(--typography-fontsize-xl);line-height:var(--typography-lineheight-xl)}.ds-text--title-medium.sc-ds-panel-tool-search-h,.ds-text--title-medium.sc-ds-panel-tool-search{font-size:var(--typography-fontsize-lg);line-height:var(--typography-lineheight-lg)}.ds-text--title-small.sc-ds-panel-tool-search-h,.ds-text--title-small.sc-ds-panel-tool-search{font-size:var(--typography-fontsize-md);line-height:var(--typography-lineheight-md)}.ds-text--body-large.sc-ds-panel-tool-search-h,.ds-text--body-large.sc-ds-panel-tool-search{font-size:var(--typography-fontsize-lg);line-height:var(--typography-lineheight-lg)}.ds-text--body-medium.sc-ds-panel-tool-search-h,.ds-text--body-medium.sc-ds-panel-tool-search{font-size:var(--typography-fontsize-md);line-height:var(--typography-lineheight-md)}.ds-text--body-small.sc-ds-panel-tool-search-h,.ds-text--body-small.sc-ds-panel-tool-search{font-size:var(--typography-fontsize-sm);line-height:var(--typography-lineheight-sm)}.ds-text--caption.sc-ds-panel-tool-search-h,.ds-text--caption.sc-ds-panel-tool-search{font-size:var(--typography-fontsize-xs);line-height:var(--typography-lineheight-xs);text-transform:uppercase}.ds-text--display-medium.ds-text--emphasis.sc-ds-panel-tool-search-h,.ds-text--display-small.ds-text--emphasis.sc-ds-panel-tool-search-h,.ds-text--display-medium.ds-text--emphasis.sc-ds-panel-tool-search,.ds-text--display-small.ds-text--emphasis.sc-ds-panel-tool-search{font-weight:var(--typography-weight-bold);letter-spacing:var(--typography-letterspacing-negative-double)}.ds-text--display-medium.ds-text--regular.sc-ds-panel-tool-search-h,.ds-text--display-small.ds-text--regular.sc-ds-panel-tool-search-h,.ds-text--display-medium.ds-text--regular.sc-ds-panel-tool-search,.ds-text--display-small.ds-text--regular.sc-ds-panel-tool-search{font-weight:var(--typography-weight-semibold);letter-spacing:var(--typography-letterspacing-negative)}.ds-text--title-large.ds-text--emphasis.sc-ds-panel-tool-search-h,.ds-text--title-large.ds-text--emphasis.sc-ds-panel-tool-search{font-weight:var(--typography-weight-semibold);letter-spacing:var(--typography-letterspacing-negative-double)}.ds-text--title-large.ds-text--regular.sc-ds-panel-tool-search-h,.ds-text--title-large.ds-text--regular.sc-ds-panel-tool-search{font-weight:var(--typography-weight-medium);letter-spacing:var(--typography-letterspacing-negative)}.ds-text--title-medium.ds-text--emphasis.sc-ds-panel-tool-search-h,.ds-text--title-small.ds-text--emphasis.sc-ds-panel-tool-search-h,.ds-text--title-medium.ds-text--emphasis.sc-ds-panel-tool-search,.ds-text--title-small.ds-text--emphasis.sc-ds-panel-tool-search{font-weight:var(--typography-weight-semibold);letter-spacing:var(--typography-letterspacing-negative)}.ds-text--title-medium.ds-text--regular.sc-ds-panel-tool-search-h,.ds-text--title-small.ds-text--regular.sc-ds-panel-tool-search-h,.ds-text--title-medium.ds-text--regular.sc-ds-panel-tool-search,.ds-text--title-small.ds-text--regular.sc-ds-panel-tool-search{font-weight:var(--typography-weight-medium);letter-spacing:var(--typography-letterspacing-negative-half)}.ds-text--body-large.ds-text--emphasis.sc-ds-panel-tool-search-h,.ds-text--body-medium.ds-text--emphasis.sc-ds-panel-tool-search-h,.ds-text--body-large.ds-text--emphasis.sc-ds-panel-tool-search,.ds-text--body-medium.ds-text--emphasis.sc-ds-panel-tool-search{font-weight:var(--typography-weight-medium);letter-spacing:var(--typography-letterspacing-negative)}.ds-text--body-large.ds-text--regular.sc-ds-panel-tool-search-h,.ds-text--body-medium.ds-text--regular.sc-ds-panel-tool-search-h,.ds-text--body-large.ds-text--regular.sc-ds-panel-tool-search,.ds-text--body-medium.ds-text--regular.sc-ds-panel-tool-search{font-weight:var(--typography-weight-regular);letter-spacing:var(--typography-letterspacing-negative-half)}.ds-text--body-small.ds-text--emphasis.sc-ds-panel-tool-search-h,.ds-text--body-small.ds-text--emphasis.sc-ds-panel-tool-search{font-weight:var(--typography-weight-medium);letter-spacing:var(--typography-letterspacing-negative-half)}.ds-text--body-small.ds-text--regular.sc-ds-panel-tool-search-h,.ds-text--body-small.ds-text--regular.sc-ds-panel-tool-search{font-weight:var(--typography-weight-regular);letter-spacing:var(--typography-letterspacing-none)}.ds-text--caption.ds-text--emphasis.sc-ds-panel-tool-search-h,.ds-text--caption.ds-text--emphasis.sc-ds-panel-tool-search{font-weight:var(--typography-weight-semibold);letter-spacing:var(--typography-letterspacing-positive)}.ds-text--caption.ds-text--regular.sc-ds-panel-tool-search-h,.ds-text--caption.ds-text--regular.sc-ds-panel-tool-search{font-weight:var(--typography-weight-medium);letter-spacing:var(--typography-letterspacing-positive)}.sc-ds-panel-tool-search-h{display:block;flex:0 0 var(--dimension-size-600);width:100%;min-width:0;height:var(--dimension-size-600);box-sizing:border-box;background:transparent}.panel-tool-search.sc-ds-panel-tool-search{position:relative;display:flex;align-items:center;gap:var(--dimension-space-100);width:100%;height:100%;padding:var(--dimension-space-100);box-sizing:border-box;background:transparent}.panel-tool-search.sc-ds-panel-tool-search::after{content:'';position:absolute;inset:auto 0 0;height:var(--dimension-stroke-width-012);background-color:var(--color-border-tertiary);pointer-events:none}.select-search.sc-ds-panel-tool-search{flex:1 1 auto;width:auto;min-width:0;height:var(--dimension-size-400);padding:0}.select-search.sc-ds-panel-tool-search::after{display:none}.panel-tool-search__filter-group.sc-ds-panel-tool-search{display:flex;flex:0 0 auto;align-items:center;gap:var(--dimension-space-100)}.panel-tool-search__divider.sc-ds-panel-tool-search,.panel-tool-search__filter.sc-ds-panel-tool-search{flex:0 0 auto}`;const y=e(class e extends s{constructor(e){super();if(e!==false){this.__registerHost()}this.dsChange=t(this,"dsChange");this.dsClear=t(this,"dsClear");this.dsFilterToggle=t(this,"dsFilterToggle");this.value="";this.placeholder="Search";this.ariaLabel="Search";this.isInactive=false;this.showFilter=false;this.filterAriaLabel="Filter";this.filterTriggerId="";this.filterExpanded=false;this.filterActive=false;this.handleChange=e=>{this.value=e;this.dsChange.emit(e)}}componentDidRender(){const e=this.el.querySelector("input");if(e&&e.value!==this.value)e.value=this.value}async setFocus(){this.el.querySelector("input")?.focus()}async focusFilterTrigger(){const e=this.el.querySelector("ds-button-unfilled.panel-tool-search__filter");await(e?.setFocus?.())}render(){return a(o,{key:"50108814b7efefd5be3941162d9f0e09c9b37187"},a("div",{key:"570f40da8df9b6de99d1c55f40c535f0904235c2",class:"panel-tool-search"},a(r,{key:"b470765ec6a80a16403a5f9d4f2d6a1e8ae3f45a",value:this.value,placeholder:this.placeholder,ariaLabel:this.ariaLabel,controls:this.controls,disabled:this.isInactive,inputRef:()=>undefined,clearLabel:"Clear",onValueChange:this.handleChange,onClear:()=>this.dsClear.emit(),onKeyDown:()=>undefined}),this.showFilter?a("div",{class:"panel-tool-search__filter-group"},a("ds-divider",{class:"panel-tool-search__divider",orientation:"vertical",length:"var(--dimension-size-200)"}),a("ds-tooltip",{label:this.filterAriaLabel,side:"bottom",size:"sm"},a("ds-button-unfilled",{id:this.filterTriggerId||undefined,class:"panel-tool-search__filter",variant:"icon",icon:"Filters",size:"md","aria-label":this.filterAriaLabel,haspopup:"menu",controls:this.filterControls,expanded:this.filterExpanded,isActive:this.filterActive,isInactive:this.isInactive,activeFill:false,hasBorder:false,onDsChange:e=>{e.stopPropagation()},onDsClick:e=>{e.stopPropagation();this.dsFilterToggle.emit(e.detail)}}))):null))}get el(){return this}static get style(){return m()}},[2,"ds-panel-tool-search",{value:[1025],placeholder:[1],ariaLabel:[1,"aria-label"],controls:[1],isInactive:[4,"is-inactive"],showFilter:[4,"show-filter"],filterAriaLabel:[1,"filter-aria-label"],filterTriggerId:[1,"filter-trigger-id"],filterControls:[1,"filter-controls"],filterExpanded:[4,"filter-expanded"],filterActive:[4,"filter-active"],setFocus:[64],focusFilterTrigger:[64]}]);function x(){if(typeof customElements==="undefined"){return}const e=["ds-panel-tool-search","ds-badge","ds-button-unfilled","ds-divider","ds-icon","ds-loader","ds-text","ds-tooltip"];e.forEach((e=>{switch(e){case"ds-panel-tool-search":if(!customElements.get(l(e))){customElements.define(l(e),y)}break;case"ds-badge":if(!customElements.get(l(e))){i()}break;case"ds-button-unfilled":if(!customElements.get(l(e))){n()}break;case"ds-divider":if(!customElements.get(l(e))){d()}break;case"ds-icon":if(!customElements.get(l(e))){c()}break;case"ds-loader":if(!customElements.get(l(e))){h()}break;case"ds-text":if(!customElements.get(l(e))){p()}break;case"ds-tooltip":if(!customElements.get(l(e))){g()}break}}))}x();const f=y;const u=x;export{f as DsPanelToolSearch,u as defineCustomElement};
|
|
1
|
+
import{p as e,H as s,c as t,h as a,a as o,t as l}from"./index.js";import{C as r}from"./p-DbpfpeQT.js";import{d as i}from"./p-CaRyxTMz.js";import{d as n}from"./p-DPME1wUJ.js";import{d}from"./p-C7bZ-jiU.js";import{d as c}from"./p-BAfG3M8z.js";import{d as h}from"./p-Ca-I2UnB.js";import{d as p}from"./p-BwGnhInj.js";import{d as g}from"./p-DWdRSOBV.js";const m=()=>`.ds-control--lg.sc-ds-panel-tool-search,.ds-control--lg.sc-ds-panel-tool-search-h,.ds-control--md.sc-ds-panel-tool-search-h,.ds-control--md.sc-ds-panel-tool-search,.ds-control--sm.sc-ds-panel-tool-search-h,.ds-control--sm.sc-ds-panel-tool-search,.ds-control--xs.sc-ds-panel-tool-search-h,.ds-control--xs.sc-ds-panel-tool-search{--ds-control-radius:var(--dimension-radius-025)}.ds-control--lg.sc-ds-panel-tool-search-h,.ds-control--lg.sc-ds-panel-tool-search{--ds-control-height:var(--dimension-size-500);--ds-control-icon:var(--dimension-iconography-lg);--ds-control-padding-inline:var(--dimension-space-100);--ds-control-label-inset:var(--dimension-space-050);--ds-control-gap:var(--dimension-space-050)}.ds-control--md.sc-ds-panel-tool-search-h,.ds-control--md.sc-ds-panel-tool-search{--ds-control-height:var(--dimension-size-400);--ds-control-icon:var(--dimension-iconography-md);--ds-control-padding-inline:var(--dimension-space-075);--ds-control-label-inset:var(--dimension-space-025);--ds-control-gap:var(--dimension-space-050)}.ds-control--sm.sc-ds-panel-tool-search-h,.ds-control--sm.sc-ds-panel-tool-search{--ds-control-height:var(--dimension-size-300);--ds-control-icon:var(--dimension-iconography-sm);--ds-control-padding-inline:var(--dimension-space-050);--ds-control-label-inset:var(--dimension-space-025);--ds-control-gap:var(--dimension-space-025)}.ds-control--xs.sc-ds-panel-tool-search-h,.ds-control--xs.sc-ds-panel-tool-search{--ds-control-height:var(--dimension-size-200);--ds-control-icon:var(--dimension-iconography-xs);--ds-control-padding-inline:var(--dimension-space-025);--ds-control-label-inset:var(--dimension-space-025);--ds-control-gap:0}.select-search.sc-ds-panel-tool-search{position:relative;box-sizing:border-box;padding:var(--dimension-space-050);background:transparent}.select-search.sc-ds-panel-tool-search::after{content:'';position:absolute;inset:auto 0 0;height:var(--dimension-stroke-width-012);background-color:var(--color-border-tertiary);pointer-events:none}.select-search.sc-ds-panel-tool-search:focus-within::after{height:var(--dimension-stroke-width-018);background-color:var(--color-border-bold-brand)}.select-search__control.sc-ds-panel-tool-search{display:flex;align-items:center;box-sizing:border-box;gap:var(--ds-control-gap, var(--dimension-space-050));height:var(--ds-control-height, var(--dimension-size-400));padding:0 var(--ds-control-padding-inline, var(--dimension-space-075));border:0;border-radius:var(--ds-control-radius, var(--dimension-radius-025))}.select-search__control.sc-ds-panel-tool-search:has(.select-search__clear){padding-right:0}.select-search__control.sc-ds-panel-tool-search>ds-icon.sc-ds-panel-tool-search{flex-shrink:0;color:var(--color-foreground-secondary)}.select-search.sc-ds-panel-tool-search .select-search__control.sc-ds-panel-tool-search .select-search__clear.sc-ds-panel-tool-search{align-self:center;flex-shrink:0;margin-right:var(--dimension-space-050)}.select-search__control.sc-ds-panel-tool-search input.sc-ds-panel-tool-search{flex:1;min-width:0;height:100%;padding:0 var(--ds-control-label-inset, var(--dimension-space-025));border:0;outline:none;background:transparent;color:var(--color-foreground-primary);font-family:inherit}.select-search__control.sc-ds-panel-tool-search input.sc-ds-panel-tool-search::placeholder{color:var(--color-foreground-secondary)}.select-search__control.sc-ds-panel-tool-search input.sc-ds-panel-tool-search:focus::placeholder{color:var(--color-foreground-quaternary)}.select-search__control.sc-ds-panel-tool-search input[type='search'].sc-ds-panel-tool-search::-webkit-search-cancel-button,.select-search__control.sc-ds-panel-tool-search input[type='search'].sc-ds-panel-tool-search::-webkit-search-decoration{display:none}.ds-text--display-medium.sc-ds-panel-tool-search-h,.ds-text--display-medium.sc-ds-panel-tool-search{font-size:var(--typography-fontsize-3xl);line-height:var(--typography-lineheight-3xl)}.ds-text--display-small.sc-ds-panel-tool-search-h,.ds-text--display-small.sc-ds-panel-tool-search{font-size:var(--typography-fontsize-2xl);line-height:var(--typography-lineheight-2xl)}.ds-text--title-large.sc-ds-panel-tool-search-h,.ds-text--title-large.sc-ds-panel-tool-search{font-size:var(--typography-fontsize-xl);line-height:var(--typography-lineheight-xl)}.ds-text--title-medium.sc-ds-panel-tool-search-h,.ds-text--title-medium.sc-ds-panel-tool-search{font-size:var(--typography-fontsize-lg);line-height:var(--typography-lineheight-lg)}.ds-text--title-small.sc-ds-panel-tool-search-h,.ds-text--title-small.sc-ds-panel-tool-search{font-size:var(--typography-fontsize-md);line-height:var(--typography-lineheight-md)}.ds-text--body-large.sc-ds-panel-tool-search-h,.ds-text--body-large.sc-ds-panel-tool-search{font-size:var(--typography-fontsize-lg);line-height:var(--typography-lineheight-lg)}.ds-text--body-medium.sc-ds-panel-tool-search-h,.ds-text--body-medium.sc-ds-panel-tool-search{font-size:var(--typography-fontsize-md);line-height:var(--typography-lineheight-md)}.ds-text--body-small.sc-ds-panel-tool-search-h,.ds-text--body-small.sc-ds-panel-tool-search{font-size:var(--typography-fontsize-sm);line-height:var(--typography-lineheight-sm)}.ds-text--caption.sc-ds-panel-tool-search-h,.ds-text--caption.sc-ds-panel-tool-search{font-size:var(--typography-fontsize-xs);line-height:var(--typography-lineheight-xs);text-transform:uppercase}.ds-text--display-medium.ds-text--emphasis.sc-ds-panel-tool-search-h,.ds-text--display-small.ds-text--emphasis.sc-ds-panel-tool-search-h,.ds-text--display-medium.ds-text--emphasis.sc-ds-panel-tool-search,.ds-text--display-small.ds-text--emphasis.sc-ds-panel-tool-search{font-weight:var(--typography-weight-bold);letter-spacing:var(--typography-letterspacing-negative-double)}.ds-text--display-medium.ds-text--regular.sc-ds-panel-tool-search-h,.ds-text--display-small.ds-text--regular.sc-ds-panel-tool-search-h,.ds-text--display-medium.ds-text--regular.sc-ds-panel-tool-search,.ds-text--display-small.ds-text--regular.sc-ds-panel-tool-search{font-weight:var(--typography-weight-semibold);letter-spacing:var(--typography-letterspacing-negative)}.ds-text--title-large.ds-text--emphasis.sc-ds-panel-tool-search-h,.ds-text--title-large.ds-text--emphasis.sc-ds-panel-tool-search{font-weight:var(--typography-weight-semibold);letter-spacing:var(--typography-letterspacing-negative-double)}.ds-text--title-large.ds-text--regular.sc-ds-panel-tool-search-h,.ds-text--title-large.ds-text--regular.sc-ds-panel-tool-search{font-weight:var(--typography-weight-medium);letter-spacing:var(--typography-letterspacing-negative)}.ds-text--title-medium.ds-text--emphasis.sc-ds-panel-tool-search-h,.ds-text--title-small.ds-text--emphasis.sc-ds-panel-tool-search-h,.ds-text--title-medium.ds-text--emphasis.sc-ds-panel-tool-search,.ds-text--title-small.ds-text--emphasis.sc-ds-panel-tool-search{font-weight:var(--typography-weight-semibold);letter-spacing:var(--typography-letterspacing-negative)}.ds-text--title-medium.ds-text--regular.sc-ds-panel-tool-search-h,.ds-text--title-small.ds-text--regular.sc-ds-panel-tool-search-h,.ds-text--title-medium.ds-text--regular.sc-ds-panel-tool-search,.ds-text--title-small.ds-text--regular.sc-ds-panel-tool-search{font-weight:var(--typography-weight-medium);letter-spacing:var(--typography-letterspacing-negative-half)}.ds-text--body-large.ds-text--emphasis.sc-ds-panel-tool-search-h,.ds-text--body-medium.ds-text--emphasis.sc-ds-panel-tool-search-h,.ds-text--body-large.ds-text--emphasis.sc-ds-panel-tool-search,.ds-text--body-medium.ds-text--emphasis.sc-ds-panel-tool-search{font-weight:var(--typography-weight-medium);letter-spacing:var(--typography-letterspacing-negative)}.ds-text--body-large.ds-text--regular.sc-ds-panel-tool-search-h,.ds-text--body-medium.ds-text--regular.sc-ds-panel-tool-search-h,.ds-text--body-large.ds-text--regular.sc-ds-panel-tool-search,.ds-text--body-medium.ds-text--regular.sc-ds-panel-tool-search{font-weight:var(--typography-weight-regular);letter-spacing:var(--typography-letterspacing-negative-half)}.ds-text--body-small.ds-text--emphasis.sc-ds-panel-tool-search-h,.ds-text--body-small.ds-text--emphasis.sc-ds-panel-tool-search{font-weight:var(--typography-weight-medium);letter-spacing:var(--typography-letterspacing-negative-half)}.ds-text--body-small.ds-text--regular.sc-ds-panel-tool-search-h,.ds-text--body-small.ds-text--regular.sc-ds-panel-tool-search{font-weight:var(--typography-weight-regular);letter-spacing:var(--typography-letterspacing-none)}.ds-text--caption.ds-text--emphasis.sc-ds-panel-tool-search-h,.ds-text--caption.ds-text--emphasis.sc-ds-panel-tool-search{font-weight:var(--typography-weight-semibold);letter-spacing:var(--typography-letterspacing-positive)}.ds-text--caption.ds-text--regular.sc-ds-panel-tool-search-h,.ds-text--caption.ds-text--regular.sc-ds-panel-tool-search{font-weight:var(--typography-weight-medium);letter-spacing:var(--typography-letterspacing-positive)}.sc-ds-panel-tool-search-h{display:block;flex:0 0 var(--dimension-size-600);width:100%;min-width:0;height:var(--dimension-size-600);box-sizing:border-box;background:transparent}.panel-tool-search.sc-ds-panel-tool-search{position:relative;display:flex;align-items:center;gap:var(--dimension-space-100);width:100%;height:100%;padding:var(--dimension-space-100);box-sizing:border-box;background:transparent}.panel-tool-search.sc-ds-panel-tool-search::after{content:'';position:absolute;inset:auto 0 0;height:var(--dimension-stroke-width-012);background-color:var(--color-border-tertiary);pointer-events:none}.select-search.sc-ds-panel-tool-search{flex:1 1 auto;width:auto;min-width:0;height:var(--dimension-size-400);padding:0}.select-search.sc-ds-panel-tool-search::after{display:none}.panel-tool-search__filter-group.sc-ds-panel-tool-search{display:flex;flex:0 0 auto;align-items:center;gap:var(--dimension-space-100)}.panel-tool-search__divider.sc-ds-panel-tool-search,.panel-tool-search__filter.sc-ds-panel-tool-search{flex:0 0 auto}`;const y=e(class e extends s{constructor(e){super();if(e!==false){this.__registerHost()}this.dsChange=t(this,"dsChange");this.dsClear=t(this,"dsClear");this.dsFilterToggle=t(this,"dsFilterToggle");this.value="";this.placeholder="Search";this.ariaLabel="Search";this.isInactive=false;this.showFilter=false;this.filterAriaLabel="Filter";this.filterTriggerId="";this.filterExpanded=false;this.filterActive=false;this.handleChange=e=>{this.value=e;this.dsChange.emit(e)}}componentDidRender(){const e=this.el.querySelector("input");if(e&&e.value!==this.value)e.value=this.value}async setFocus(){this.el.querySelector("input")?.focus()}async focusFilterTrigger(){const e=this.el.querySelector("ds-button-unfilled.panel-tool-search__filter");await(e?.setFocus?.())}render(){return a(o,{key:"50108814b7efefd5be3941162d9f0e09c9b37187"},a("div",{key:"570f40da8df9b6de99d1c55f40c535f0904235c2",class:"panel-tool-search"},a(r,{key:"b470765ec6a80a16403a5f9d4f2d6a1e8ae3f45a",value:this.value,placeholder:this.placeholder,ariaLabel:this.ariaLabel,controls:this.controls,disabled:this.isInactive,inputRef:()=>undefined,clearLabel:"Clear",onValueChange:this.handleChange,onClear:()=>this.dsClear.emit(),onKeyDown:()=>undefined}),this.showFilter?a("div",{class:"panel-tool-search__filter-group"},a("ds-divider",{class:"panel-tool-search__divider",orientation:"vertical",length:"var(--dimension-size-200)"}),a("ds-tooltip",{label:this.filterAriaLabel,side:"bottom",size:"sm"},a("ds-button-unfilled",{id:this.filterTriggerId||undefined,class:"panel-tool-search__filter",variant:"icon",icon:"Filters",size:"md","aria-label":this.filterAriaLabel,haspopup:"menu",controls:this.filterControls,expanded:this.filterExpanded,isActive:this.filterActive,isInactive:this.isInactive,activeFill:false,hasBorder:false,onDsChange:e=>{e.stopPropagation()},onDsClick:e=>{e.stopPropagation();this.dsFilterToggle.emit(e.detail)}}))):null))}get el(){return this}static get style(){return m()}},[2,"ds-panel-tool-search",{value:[1025],placeholder:[1],ariaLabel:[1,"aria-label"],controls:[1],isInactive:[4,"is-inactive"],showFilter:[4,"show-filter"],filterAriaLabel:[1,"filter-aria-label"],filterTriggerId:[1,"filter-trigger-id"],filterControls:[1,"filter-controls"],filterExpanded:[4,"filter-expanded"],filterActive:[4,"filter-active"],setFocus:[64],focusFilterTrigger:[64]}]);function x(){if(typeof customElements==="undefined"){return}const e=["ds-panel-tool-search","ds-badge","ds-button-unfilled","ds-divider","ds-icon","ds-loader","ds-text","ds-tooltip"];e.forEach((e=>{switch(e){case"ds-panel-tool-search":if(!customElements.get(l(e))){customElements.define(l(e),y)}break;case"ds-badge":if(!customElements.get(l(e))){i()}break;case"ds-button-unfilled":if(!customElements.get(l(e))){n()}break;case"ds-divider":if(!customElements.get(l(e))){d()}break;case"ds-icon":if(!customElements.get(l(e))){c()}break;case"ds-loader":if(!customElements.get(l(e))){h()}break;case"ds-text":if(!customElements.get(l(e))){p()}break;case"ds-tooltip":if(!customElements.get(l(e))){g()}break}}))}x();const f=y;const u=x;export{f as DsPanelToolSearch,u as defineCustomElement};
|
|
2
2
|
//# sourceMappingURL=ds-panel-tool-search.js.map
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{P as o,d as s}from"./p-
|
|
1
|
+
import{P as o,d as s}from"./p-BLea0TrP.js";const r=o;const t=s;export{r as DsPanelTools,t as defineCustomElement};
|
|
2
2
|
//# sourceMappingURL=ds-panel-tools.js.map
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{p as i,H as o,c as r,h as s,a as n,t}from"./index.js";import{d as e}from"./p-BwGnhInj.js";import{D as a,s as d}from"./p-BgGP65Nn.js";const c=()=>`.ds-control-inactive.sc-ds-radio-h,.ds-control-inactive.sc-ds-radio{opacity:0.5;pointer-events:none;cursor:not-allowed}.ds-control--lg.sc-ds-radio,.ds-control--lg.sc-ds-radio-h,.ds-control--md.sc-ds-radio-h,.ds-control--md.sc-ds-radio,.ds-control--sm.sc-ds-radio-h,.ds-control--sm.sc-ds-radio,.ds-control--xs.sc-ds-radio-h,.ds-control--xs.sc-ds-radio{--ds-control-radius:var(--dimension-radius-025)}.ds-control--lg.sc-ds-radio-h,.ds-control--lg.sc-ds-radio{--ds-control-height:var(--dimension-size-500);--ds-control-icon:var(--dimension-iconography-lg);--ds-control-padding-inline:var(--dimension-space-100);--ds-control-label-inset:var(--dimension-space-050);--ds-control-gap:var(--dimension-space-050)}.ds-control--md.sc-ds-radio-h,.ds-control--md.sc-ds-radio{--ds-control-height:var(--dimension-size-400);--ds-control-icon:var(--dimension-iconography-md);--ds-control-padding-inline:var(--dimension-space-075);--ds-control-label-inset:var(--dimension-space-025);--ds-control-gap:var(--dimension-space-050)}.ds-control--sm.sc-ds-radio-h,.ds-control--sm.sc-ds-radio{--ds-control-height:var(--dimension-size-300);--ds-control-icon:var(--dimension-iconography-sm);--ds-control-padding-inline:var(--dimension-space-050);--ds-control-label-inset:var(--dimension-space-025);--ds-control-gap:var(--dimension-space-025)}.ds-control--xs.sc-ds-radio-h,.ds-control--xs.sc-ds-radio{--ds-control-height:var(--dimension-size-200);--ds-control-icon:var(--dimension-iconography-xs);--ds-control-padding-inline:var(--dimension-space-025);--ds-control-label-inset:var(--dimension-space-025);--ds-control-gap:0}.sc-ds-radio-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-radio-h:focus-visible,.ds-focus-ring.sc-ds-radio: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-radio-h,.ds-focus-ring.ds-focus-ring--visible.sc-ds-radio{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-radio-h:focus-visible,.ds-focus-ring-inset.sc-ds-radio:focus-visible{outline:none}.ds-focus-ring-inset.sc-ds-radio-h:focus-visible::after,.ds-focus-ring-inset.sc-ds-radio: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-radio-h,.ds-focus-ring-inset.ds-focus-ring--visible.sc-ds-radio{outline:none}.ds-focus-ring-inset.ds-focus-ring--visible.sc-ds-radio-h::after,.ds-focus-ring-inset.ds-focus-ring--visible.sc-ds-radio::after{outline:var(--ds-focus-ring-width) solid var(--ds-focus-ring-color);outline-offset:calc(-1 * var(--ds-focus-ring-width))}.ds-interaction-fill.sc-ds-radio-h,.ds-interaction-fill.sc-ds-radio{position:relative;z-index:0;--ds-interaction-hover:var(--color-interaction-hover);--ds-interaction-pressed:var(--color-interaction-pressed);--ds-interaction-active:var(--color-interaction-active-brand);--ds-interaction-border-width:0px;--ds-interaction-border-color:transparent}.ds-interaction-fill.sc-ds-radio-h::before,.ds-interaction-fill.sc-ds-radio::before,.ds-interaction-fill.sc-ds-radio-h::after,.ds-interaction-fill.sc-ds-radio::after{content:'';position:absolute;inset:0;border-radius:inherit;background:transparent;pointer-events:none;transition:none}.ds-interaction-fill.sc-ds-radio-h::before,.ds-interaction-fill.sc-ds-radio::before{z-index:1}.ds-interaction-fill.sc-ds-radio-h::after,.ds-interaction-fill.sc-ds-radio::after{z-index:3;box-shadow:inset 0 0 0 var(--ds-interaction-border-width) var(--ds-interaction-border-color)}.ds-interaction-fill--bordered.sc-ds-radio-h,.ds-interaction-fill--bordered.sc-ds-radio{--ds-interaction-border-width:var(--dimension-stroke-width-012);--ds-interaction-border-color:var(--color-border-secondary)}.ds-interaction-fill--selected.sc-ds-radio-h::before,.ds-interaction-fill--selected.sc-ds-radio::before{background:var(--ds-interaction-active)}.ds-interaction-fill--selected.sc-ds-radio-h,.ds-interaction-fill--selected.sc-ds-radio{--ds-interaction-dot-ring:var(--ds-interaction-active)}.ds-interaction-fill.sc-ds-radio-h:hover:not(:disabled)::after,.ds-interaction-fill.sc-ds-radio:hover:not(:disabled)::after{background:var(--ds-interaction-hover)}.ds-interaction-fill.sc-ds-radio-h:active:not(:disabled)::after,.ds-interaction-fill.sc-ds-radio:active:not(:disabled)::after{background:var(--ds-interaction-pressed)}.ds-interaction-fill.sc-ds-radio-h>.ds-interaction-fill__content.sc-ds-radio,.ds-interaction-fill.sc-ds-radio>.ds-interaction-fill__content.sc-ds-radio,.ds-interaction-fill__content.sc-ds-radio{position:relative;z-index:2}.ds-interaction-fill--on-faint.sc-ds-radio-h,.ds-interaction-fill--on-faint.sc-ds-radio{--ds-interaction-active:var(--color-interaction-active)}.ds-interaction-fill--on-medium.sc-ds-radio-h,.ds-interaction-fill--on-medium.sc-ds-radio{--ds-interaction-hover:var(--color-interaction-on-medium-background-hover);--ds-interaction-pressed:var(--color-interaction-on-medium-background-pressed);--ds-interaction-active:var(--color-interaction-on-medium-background-active);--ds-focus-ring-color:var(--color-interaction-on-medium-background-focus)}.ds-interaction-fill--on-bold.sc-ds-radio-h,.ds-interaction-fill--on-bold.sc-ds-radio{--ds-interaction-hover:var(--color-interaction-on-bold-background-hover);--ds-interaction-pressed:var(--color-interaction-on-bold-background-pressed);--ds-interaction-active:var(--color-interaction-on-bold-background-active);--ds-focus-ring-color:var(--color-interaction-on-bold-background-focus)}.ds-interaction-fill--on-strong.sc-ds-radio-h,.ds-interaction-fill--on-strong.sc-ds-radio{--ds-interaction-hover:var(--color-interaction-on-strong-background-hover);--ds-interaction-pressed:var(--color-interaction-on-strong-background-pressed);--ds-interaction-active:var(--color-interaction-on-strong-background-active);--ds-focus-ring-color:var(--color-interaction-on-strong-background-focus)}.ds-interaction-fill--on-translucent.sc-ds-radio-h,.ds-interaction-fill--on-translucent.sc-ds-radio{--ds-interaction-hover:var(--color-translucent-interaction-hover);--ds-interaction-pressed:var(--color-translucent-interaction-pressed);--ds-interaction-active:var(--color-translucent-interaction-active);--ds-focus-ring-color:var(--color-translucent-interaction-focus)}.ds-interaction-fill--on-inverted.sc-ds-radio-h,.ds-interaction-fill--on-inverted.sc-ds-radio{--ds-interaction-hover:var(--color-inverted-interaction-hover);--ds-interaction-pressed:var(--color-inverted-interaction-pressed);--ds-interaction-active:var(--color-inverted-interaction-active);--ds-focus-ring-color:var(--color-inverted-interaction-focus)}.ds-interaction-fill--on-media.sc-ds-radio-h,.ds-interaction-fill--on-media.sc-ds-radio{--ds-interaction-hover:var(--color-media-interaction-hover);--ds-interaction-pressed:var(--color-media-interaction-pressed);--ds-interaction-active:var(--color-media-interaction-active);--ds-focus-ring-color:var(--color-media-interaction-focus)}.ds-interaction-fill--on-always-dark.sc-ds-radio-h,.ds-interaction-fill--on-always-dark.sc-ds-radio{--ds-interaction-hover:var(--color-always-dark-interaction-hover);--ds-interaction-pressed:var(--color-always-dark-interaction-pressed);--ds-interaction-active:var(--color-always-dark-interaction-active);--ds-focus-ring-color:var(--color-always-dark-interaction-focus)}.ds-interaction-fill--on-navigation.sc-ds-radio-h,.ds-interaction-fill--on-navigation.sc-ds-radio{--ds-interaction-hover:var(--color-navigation-interaction-hover);--ds-interaction-pressed:var(--color-navigation-interaction-pressed);--ds-interaction-active:var(--color-navigation-interaction-active);--ds-focus-ring-color:var(--color-navigation-interaction-focus)}.sc-ds-radio-h{display:flex;flex-direction:column;gap:var(--dimension-space-025)}.radio--horizontal.sc-ds-radio-h{flex-direction:row;gap:var(--dimension-space-100)}.radio--md.sc-ds-radio-h{--_radio-circle:var(--dimension-iconography-sm);--_radio-dot:var(--dimension-size-100);--_radio-stroke:var(--dimension-stroke-width-015)}.radio--sm.sc-ds-radio-h{--_radio-circle:var(--dimension-iconography-xs);--_radio-dot:var(--dimension-size-075);--_radio-stroke:var(--dimension-stroke-width-012)}.radio--xs.sc-ds-radio-h{--_radio-circle:var(--dimension-size-100);--_radio-dot:var(--dimension-size-050);--_radio-stroke:calc(var(--dimension-stroke-width-base) * 3 / 32)}.radio__item.sc-ds-radio{display:inline-flex;align-items:center;box-sizing:border-box;gap:var(--ds-control-gap);height:var(--ds-control-height);padding:0 var(--ds-control-padding-inline);border-radius:var(--ds-control-radius);cursor:pointer;user-select:none}.radio__placement.sc-ds-radio{display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;width:var(--ds-control-icon);height:var(--ds-control-icon)}.radio__circle.sc-ds-radio{display:inline-flex;align-items:center;justify-content:center;box-sizing:border-box;width:var(--_radio-circle);height:var(--_radio-circle);border:0;border-radius:var(--dimension-radius-half);box-shadow:inset 0 0 0 var(--_radio-stroke) var(--color-foreground-tertiary);transition:background-color var(--effect-motion-short-2), box-shadow var(--effect-motion-short-2)}.radio__circle--checked.sc-ds-radio{background-color:var(--color-background-bold-brand);box-shadow:none}.radio__dot.sc-ds-radio{width:var(--_radio-dot);height:var(--_radio-dot);border-radius:var(--dimension-radius-half);background-color:var(--color-foreground-on-bold-background-primary)}.radio__label.sc-ds-radio{flex:1;min-width:0;padding:0 var(--ds-control-label-inset)}`;const l={md:"text-body-medium",sm:"text-body-small",xs:"text-caption"};const v=i(class i extends o{constructor(i){super();if(i!==false){this.__registerHost()}this.dsChange=r(this,"dsChange");this.internals=this.attachInternals();this.options=[];this.value="";this.size="md";this.disabled=false;this.required=false;this.requiredMessage=a;this.direction="vertical";this.isInactive=false;this.ariaLabel=null;this.initialValue="";this.formDisabled=false}componentWillLoad(){this.initialValue=this.value;this.syncFormValue()}syncFormValue(){const i=this.isInactive||this.disabled||this.formDisabled;this.internals.setFormValue(i?null:this.value);const o=this.required&&!i&&this.value.length===0;d(this.internals,o,this.requiredMessage)}formDisabledCallback(i){this.formDisabled=i;this.syncFormValue()}formResetCallback(){this.value=this.initialValue}formStateRestoreCallback(i){this.value=typeof i==="string"?i:""}get activeItems(){return Array.from(this.el.querySelectorAll("[data-radio-item]:not([data-inactive])"))}handleKeyDown(i){const o=this.activeItems;if(!o.length)return;const r=o.find((i=>i===document.activeElement));if(!r)return;const s=o.indexOf(r);let n=-1;switch(i.key){case"ArrowDown":case"ArrowRight":i.preventDefault();n=(s+1)%o.length;break;case"ArrowUp":case"ArrowLeft":i.preventDefault();n=(s-1+o.length)%o.length;break;case"Home":i.preventDefault();n=0;break;case"End":i.preventDefault();n=o.length-1;break}if(n>=0){o[n].focus();const i=o[n].dataset["value"];if(i&&i!==this.value){this.value=i;this.dsChange.emit(i)}}}selectItem(i){if(this.isInactive||this.disabled||this.formDisabled)return;if(i!==this.value){this.value=i;this.dsChange.emit(i)}}render(){const i=this.isInactive||this.disabled||this.formDisabled;const o=this.required&&!i&&this.value.length===0;const r=this.options.findIndex((i=>i.value===this.value));const t=this.options.findIndex((o=>!i&&!o.isInactive));const e=r>=0&&!i&&!this.options[r]?.isInactive?r:t;return s(n,{key:"fbd6208d6cfa975bc83793ca0264d344d7dc9a18",role:"radiogroup","aria-label":this.ariaLabel,"aria-labelledby":this.ariaLabelledby,"aria-required":this.required?"true":undefined,"aria-invalid":o?"true":undefined,class:{radio:true,"radio--horizontal":this.direction==="horizontal",[`radio--${this.size}`]:true}},this.options.map(((o,r)=>{const n=i||!!o.isInactive;const t=o.value===this.value;const a=n?-1:r===e?0:-1;return s("div",{key:o.value,role:"radio","aria-checked":String(t),"aria-disabled":n?"true":undefined,tabIndex:a,"data-radio-item":true,"data-value":o.value,"data-inactive":n||undefined,class:{radio__item:true,[`ds-control--${this.size}`]:true,"ds-control-inactive":n,"ds-focus-ring-inset":!n,"ds-interaction-fill":!n},onClick:()=>!n&&this.selectItem(o.value),onKeyDown:i=>{if((i.key===" "||i.key==="Enter")&&!n){i.preventDefault();this.selectItem(o.value)}}},s("span",{class:"radio__placement ds-interaction-fill__content","aria-hidden":"true"},s("span",{class:{radio__circle:true,"radio__circle--checked":t}},t&&s("span",{class:"radio__dot"}))),s("ds-text",{class:"radio__label ds-interaction-fill__content",as:"span",variant:l[this.size]},o.label))})))}static get formAssociated(){return true}get el(){return this}static get watchers(){return{value:[{syncFormValue:0}],disabled:[{syncFormValue:0}],isInactive:[{syncFormValue:0}],required:[{syncFormValue:0}]}}static get style(){return c()}},[66,"ds-radio",{options:[16],value:[1025],size:[1],name:[513],form:[513],disabled:[516],required:[516],requiredMessage:[1,"required-message"],direction:[1],isInactive:[4,"is-inactive"],ariaLabel:[1,"aria-label"],ariaLabelledby:[1,"aria-labelledby"],formDisabled:[32]},[[0,"keydown","handleKeyDown"]],{value:[{syncFormValue:0}],disabled:[{syncFormValue:0}],isInactive:[{syncFormValue:0}],required:[{syncFormValue:0}]}]);function h(){if(typeof customElements==="undefined"){return}const i=["ds-radio","ds-text"];i.forEach((i=>{switch(i){case"ds-radio":if(!customElements.get(t(i))){customElements.define(t(i),v)}break;case"ds-text":if(!customElements.get(t(i))){e()}break}}))}h();const f=v;const u=h;export{f as DsRadio,u as defineCustomElement};
|
|
1
|
+
import{p as i,H as o,c as r,h as s,a as n,t}from"./index.js";import{d as e}from"./p-BwGnhInj.js";import{D as a,s as d}from"./p-BgGP65Nn.js";const c=()=>`.ds-control-inactive.sc-ds-radio-h,.ds-control-inactive.sc-ds-radio{opacity:0.5;pointer-events:none;cursor:not-allowed}.ds-control--lg.sc-ds-radio,.ds-control--lg.sc-ds-radio-h,.ds-control--md.sc-ds-radio-h,.ds-control--md.sc-ds-radio,.ds-control--sm.sc-ds-radio-h,.ds-control--sm.sc-ds-radio,.ds-control--xs.sc-ds-radio-h,.ds-control--xs.sc-ds-radio{--ds-control-radius:var(--dimension-radius-025)}.ds-control--lg.sc-ds-radio-h,.ds-control--lg.sc-ds-radio{--ds-control-height:var(--dimension-size-500);--ds-control-icon:var(--dimension-iconography-lg);--ds-control-padding-inline:var(--dimension-space-100);--ds-control-label-inset:var(--dimension-space-050);--ds-control-gap:var(--dimension-space-050)}.ds-control--md.sc-ds-radio-h,.ds-control--md.sc-ds-radio{--ds-control-height:var(--dimension-size-400);--ds-control-icon:var(--dimension-iconography-md);--ds-control-padding-inline:var(--dimension-space-075);--ds-control-label-inset:var(--dimension-space-025);--ds-control-gap:var(--dimension-space-050)}.ds-control--sm.sc-ds-radio-h,.ds-control--sm.sc-ds-radio{--ds-control-height:var(--dimension-size-300);--ds-control-icon:var(--dimension-iconography-sm);--ds-control-padding-inline:var(--dimension-space-050);--ds-control-label-inset:var(--dimension-space-025);--ds-control-gap:var(--dimension-space-025)}.ds-control--xs.sc-ds-radio-h,.ds-control--xs.sc-ds-radio{--ds-control-height:var(--dimension-size-200);--ds-control-icon:var(--dimension-iconography-xs);--ds-control-padding-inline:var(--dimension-space-025);--ds-control-label-inset:var(--dimension-space-025);--ds-control-gap:0}.sc-ds-radio-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-radio-h,.ds-focus-ring.sc-ds-radio,.ds-focus-ring-inset.sc-ds-radio-h,.ds-focus-ring-inset.sc-ds-radio{outline:none;-webkit-tap-highlight-color:transparent;touch-action:manipulation}.ds-focus-ring.sc-ds-radio-h:focus-visible,.ds-focus-ring.sc-ds-radio: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-radio-h,.ds-focus-ring.ds-focus-ring--visible.sc-ds-radio{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-radio-h:focus-visible,.ds-focus-ring-inset.sc-ds-radio:focus-visible{outline:none}.ds-focus-ring-inset.sc-ds-radio-h:focus-visible::after,.ds-focus-ring-inset.sc-ds-radio: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-radio-h,.ds-focus-ring-inset.ds-focus-ring--visible.sc-ds-radio{outline:none}.ds-focus-ring-inset.ds-focus-ring--visible.sc-ds-radio-h::after,.ds-focus-ring-inset.ds-focus-ring--visible.sc-ds-radio::after{outline:var(--ds-focus-ring-width) solid var(--ds-focus-ring-color);outline-offset:calc(-1 * var(--ds-focus-ring-width))}.ds-interaction-fill.sc-ds-radio-h,.ds-interaction-fill.sc-ds-radio{position:relative;z-index:0;cursor:default;--ds-interaction-hover:var(--color-interaction-hover);--ds-interaction-pressed:var(--color-interaction-pressed);--ds-interaction-active:var(--color-interaction-active-brand);--ds-interaction-border-width:0px;--ds-interaction-border-color:transparent}.ds-interaction-fill.sc-ds-radio-h::before,.ds-interaction-fill.sc-ds-radio::before,.ds-interaction-fill.sc-ds-radio-h::after,.ds-interaction-fill.sc-ds-radio::after{content:'';position:absolute;inset:0;border-radius:inherit;background:transparent;pointer-events:none;cursor:inherit;transition:none}.ds-interaction-fill.sc-ds-radio-h::before,.ds-interaction-fill.sc-ds-radio::before{z-index:1}.ds-interaction-fill.sc-ds-radio-h::after,.ds-interaction-fill.sc-ds-radio::after{z-index:3;box-shadow:inset 0 0 0 var(--ds-interaction-border-width) var(--ds-interaction-border-color)}.ds-interaction-fill--bordered.sc-ds-radio-h,.ds-interaction-fill--bordered.sc-ds-radio{--ds-interaction-border-width:var(--dimension-stroke-width-012);--ds-interaction-border-color:var(--color-border-secondary)}.ds-interaction-fill--selected.sc-ds-radio-h::before,.ds-interaction-fill--selected.sc-ds-radio::before{background:var(--ds-interaction-active)}.ds-interaction-fill--selected.sc-ds-radio-h,.ds-interaction-fill--selected.sc-ds-radio{--ds-interaction-dot-ring:var(--ds-interaction-active)}@media (hover: hover) and (pointer: fine){.ds-interaction-fill.sc-ds-radio-h:hover:not(:disabled)::after,.ds-interaction-fill.sc-ds-radio:hover:not(:disabled)::after{background:var(--ds-interaction-hover)}}.ds-interaction-fill.sc-ds-radio-h:active:not(:disabled)::after,.ds-interaction-fill.sc-ds-radio:active:not(:disabled)::after{background:var(--ds-interaction-pressed)}.ds-interaction-fill.sc-ds-radio-h>.ds-interaction-fill__content.sc-ds-radio,.ds-interaction-fill.sc-ds-radio>.ds-interaction-fill__content.sc-ds-radio,.ds-interaction-fill__content.sc-ds-radio{position:relative;z-index:2;cursor:inherit}.ds-interaction-fill--on-faint.sc-ds-radio-h,.ds-interaction-fill--on-faint.sc-ds-radio{--ds-interaction-active:var(--color-interaction-active)}.ds-interaction-fill--on-medium.sc-ds-radio-h,.ds-interaction-fill--on-medium.sc-ds-radio{--ds-interaction-hover:var(--color-interaction-on-medium-background-hover);--ds-interaction-pressed:var(--color-interaction-on-medium-background-pressed);--ds-interaction-active:var(--color-interaction-on-medium-background-active);--ds-focus-ring-color:var(--color-interaction-on-medium-background-focus)}.ds-interaction-fill--on-bold.sc-ds-radio-h,.ds-interaction-fill--on-bold.sc-ds-radio{--ds-interaction-hover:var(--color-interaction-on-bold-background-hover);--ds-interaction-pressed:var(--color-interaction-on-bold-background-pressed);--ds-interaction-active:var(--color-interaction-on-bold-background-active);--ds-focus-ring-color:var(--color-interaction-on-bold-background-focus)}.ds-interaction-fill--on-strong.sc-ds-radio-h,.ds-interaction-fill--on-strong.sc-ds-radio{--ds-interaction-hover:var(--color-interaction-on-strong-background-hover);--ds-interaction-pressed:var(--color-interaction-on-strong-background-pressed);--ds-interaction-active:var(--color-interaction-on-strong-background-active);--ds-focus-ring-color:var(--color-interaction-on-strong-background-focus)}.ds-interaction-fill--on-translucent.sc-ds-radio-h,.ds-interaction-fill--on-translucent.sc-ds-radio{--ds-interaction-hover:var(--color-translucent-interaction-hover);--ds-interaction-pressed:var(--color-translucent-interaction-pressed);--ds-interaction-active:var(--color-translucent-interaction-active);--ds-focus-ring-color:var(--color-translucent-interaction-focus)}.ds-interaction-fill--on-inverted.sc-ds-radio-h,.ds-interaction-fill--on-inverted.sc-ds-radio{--ds-interaction-hover:var(--color-inverted-interaction-hover);--ds-interaction-pressed:var(--color-inverted-interaction-pressed);--ds-interaction-active:var(--color-inverted-interaction-active);--ds-focus-ring-color:var(--color-inverted-interaction-focus)}.ds-interaction-fill--on-media.sc-ds-radio-h,.ds-interaction-fill--on-media.sc-ds-radio{--ds-interaction-hover:var(--color-media-interaction-hover);--ds-interaction-pressed:var(--color-media-interaction-pressed);--ds-interaction-active:var(--color-media-interaction-active);--ds-focus-ring-color:var(--color-media-interaction-focus)}.ds-interaction-fill--on-always-dark.sc-ds-radio-h,.ds-interaction-fill--on-always-dark.sc-ds-radio{--ds-interaction-hover:var(--color-always-dark-interaction-hover);--ds-interaction-pressed:var(--color-always-dark-interaction-pressed);--ds-interaction-active:var(--color-always-dark-interaction-active);--ds-focus-ring-color:var(--color-always-dark-interaction-focus)}.ds-interaction-fill--on-navigation.sc-ds-radio-h,.ds-interaction-fill--on-navigation.sc-ds-radio{--ds-interaction-hover:var(--color-navigation-interaction-hover);--ds-interaction-pressed:var(--color-navigation-interaction-pressed);--ds-interaction-active:var(--color-navigation-interaction-active);--ds-focus-ring-color:var(--color-navigation-interaction-focus)}.sc-ds-radio-h{display:flex;flex-direction:column;gap:var(--dimension-space-025)}.radio--horizontal.sc-ds-radio-h{flex-direction:row;gap:var(--dimension-space-100)}.radio--md.sc-ds-radio-h{--_radio-circle:var(--dimension-iconography-sm);--_radio-dot:var(--dimension-size-100);--_radio-stroke:var(--dimension-stroke-width-015)}.radio--sm.sc-ds-radio-h{--_radio-circle:var(--dimension-iconography-xs);--_radio-dot:var(--dimension-size-075);--_radio-stroke:var(--dimension-stroke-width-012)}.radio--xs.sc-ds-radio-h{--_radio-circle:var(--dimension-size-100);--_radio-dot:var(--dimension-size-050);--_radio-stroke:calc(var(--dimension-stroke-width-base) * 3 / 32)}.radio__item.sc-ds-radio{display:inline-flex;align-items:center;box-sizing:border-box;gap:var(--ds-control-gap);height:var(--ds-control-height);padding:0 var(--ds-control-padding-inline);border-radius:var(--ds-control-radius);cursor:default;user-select:none}.radio__placement.sc-ds-radio{display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;width:var(--ds-control-icon);height:var(--ds-control-icon)}.radio__circle.sc-ds-radio{display:inline-flex;align-items:center;justify-content:center;box-sizing:border-box;width:var(--_radio-circle);height:var(--_radio-circle);border:0;border-radius:var(--dimension-radius-half);box-shadow:inset 0 0 0 var(--_radio-stroke) var(--color-foreground-tertiary);transition:background-color var(--effect-motion-short-2), box-shadow var(--effect-motion-short-2)}.radio__circle--checked.sc-ds-radio{background-color:var(--color-background-bold-brand);box-shadow:none}.radio__dot.sc-ds-radio{width:var(--_radio-dot);height:var(--_radio-dot);border-radius:var(--dimension-radius-half);background-color:var(--color-foreground-on-bold-background-primary)}.radio__label.sc-ds-radio{flex:1;min-width:0;padding:0 var(--ds-control-label-inset)}`;const l={md:"text-body-medium",sm:"text-body-small",xs:"text-caption"};const h=i(class i extends o{constructor(i){super();if(i!==false){this.__registerHost()}this.dsChange=r(this,"dsChange");this.internals=this.attachInternals();this.options=[];this.value="";this.size="md";this.disabled=false;this.required=false;this.requiredMessage=a;this.direction="vertical";this.isInactive=false;this.ariaLabel=null;this.initialValue="";this.formDisabled=false}componentWillLoad(){this.initialValue=this.value;this.syncFormValue()}syncFormValue(){const i=this.isInactive||this.disabled||this.formDisabled;this.internals.setFormValue(i?null:this.value);const o=this.required&&!i&&this.value.length===0;d(this.internals,o,this.requiredMessage)}formDisabledCallback(i){this.formDisabled=i;this.syncFormValue()}formResetCallback(){this.value=this.initialValue}formStateRestoreCallback(i){this.value=typeof i==="string"?i:""}get activeItems(){return Array.from(this.el.querySelectorAll("[data-radio-item]:not([data-inactive])"))}handleKeyDown(i){const o=this.activeItems;if(!o.length)return;const r=o.find((i=>i===document.activeElement));if(!r)return;const s=o.indexOf(r);let n=-1;switch(i.key){case"ArrowDown":case"ArrowRight":i.preventDefault();n=(s+1)%o.length;break;case"ArrowUp":case"ArrowLeft":i.preventDefault();n=(s-1+o.length)%o.length;break;case"Home":i.preventDefault();n=0;break;case"End":i.preventDefault();n=o.length-1;break}if(n>=0){o[n].focus();const i=o[n].dataset["value"];if(i&&i!==this.value){this.value=i;this.dsChange.emit(i)}}}selectItem(i){if(this.isInactive||this.disabled||this.formDisabled)return;if(i!==this.value){this.value=i;this.dsChange.emit(i)}}render(){const i=this.isInactive||this.disabled||this.formDisabled;const o=this.required&&!i&&this.value.length===0;const r=this.options.findIndex((i=>i.value===this.value));const t=this.options.findIndex((o=>!i&&!o.isInactive));const e=r>=0&&!i&&!this.options[r]?.isInactive?r:t;return s(n,{key:"fbd6208d6cfa975bc83793ca0264d344d7dc9a18",role:"radiogroup","aria-label":this.ariaLabel,"aria-labelledby":this.ariaLabelledby,"aria-required":this.required?"true":undefined,"aria-invalid":o?"true":undefined,class:{radio:true,"radio--horizontal":this.direction==="horizontal",[`radio--${this.size}`]:true}},this.options.map(((o,r)=>{const n=i||!!o.isInactive;const t=o.value===this.value;const a=n?-1:r===e?0:-1;return s("div",{key:o.value,role:"radio","aria-checked":String(t),"aria-disabled":n?"true":undefined,tabIndex:a,"data-radio-item":true,"data-value":o.value,"data-inactive":n||undefined,class:{radio__item:true,[`ds-control--${this.size}`]:true,"ds-control-inactive":n,"ds-focus-ring-inset":!n,"ds-interaction-fill":!n},onClick:()=>!n&&this.selectItem(o.value),onKeyDown:i=>{if((i.key===" "||i.key==="Enter")&&!n){i.preventDefault();this.selectItem(o.value)}}},s("span",{class:"radio__placement ds-interaction-fill__content","aria-hidden":"true"},s("span",{class:{radio__circle:true,"radio__circle--checked":t}},t&&s("span",{class:"radio__dot"}))),s("ds-text",{class:"radio__label ds-interaction-fill__content",as:"span",variant:l[this.size]},o.label))})))}static get formAssociated(){return true}get el(){return this}static get watchers(){return{value:[{syncFormValue:0}],disabled:[{syncFormValue:0}],isInactive:[{syncFormValue:0}],required:[{syncFormValue:0}]}}static get style(){return c()}},[66,"ds-radio",{options:[16],value:[1025],size:[1],name:[513],form:[513],disabled:[516],required:[516],requiredMessage:[1,"required-message"],direction:[1],isInactive:[4,"is-inactive"],ariaLabel:[1,"aria-label"],ariaLabelledby:[1,"aria-labelledby"],formDisabled:[32]},[[0,"keydown","handleKeyDown"]],{value:[{syncFormValue:0}],disabled:[{syncFormValue:0}],isInactive:[{syncFormValue:0}],required:[{syncFormValue:0}]}]);function v(){if(typeof customElements==="undefined"){return}const i=["ds-radio","ds-text"];i.forEach((i=>{switch(i){case"ds-radio":if(!customElements.get(t(i))){customElements.define(t(i),h)}break;case"ds-text":if(!customElements.get(t(i))){e()}break}}))}v();const f=h;const u=v;export{f as DsRadio,u as defineCustomElement};
|
|
2
2
|
//# sourceMappingURL=ds-radio.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["radioCss","LABEL_VARIANT","md","sm","xs","Radio","__stencil_proxyCustomElement","HTMLElement","constructor","registerHost","this","options","value","size","disabled","required","requiredMessage","DEFAULT_REQUIRED_MESSAGE","direction","isInactive","ariaLabel","initialValue","formDisabled","componentWillLoad","syncFormValue","inactive","internals","setFormValue","missing","length","setRequiredValidity","formDisabledCallback","formResetCallback","formStateRestoreCallback","state","activeItems","Array","from","el","querySelectorAll","handleKeyDown","e","items","focused","find","item","document","activeElement","idx","indexOf","next","key","preventDefault","focus","nextValue","dataset","dsChange","emit","selectItem","optValue","render","invalid","selectedIdx","findIndex","option","firstActiveIdx","focusableIdx","h","Host","role","ariaLabelledby","undefined","class","radio","map","index","isItemInactive","isChecked","tabIdx","String","tabIndex","radio__item","onClick","onKeyDown","radio__circle","as","variant","label"],"sources":["src/wc/components/Radio/Radio.css?tag=ds-radio&encapsulation=scoped","src/wc/components/Radio/Radio.tsx"],"sourcesContent":["@import '../../utils/control-inactive.css';\n@import '../../utils/control-density.css';\n@import '../../utils/focus-ring.css';\n@import '../../utils/interaction-fill.css';\n\n:host {\n display: flex;\n flex-direction: column;\n gap: var(--dimension-space-025);\n}\n\n:host(.radio--horizontal) {\n flex-direction: row;\n gap: var(--dimension-space-100);\n}\n\n:host(.radio--md) {\n --_radio-circle: var(--dimension-iconography-sm);\n --_radio-dot: var(--dimension-size-100);\n --_radio-stroke: var(--dimension-stroke-width-015);\n}\n\n:host(.radio--sm) {\n --_radio-circle: var(--dimension-iconography-xs);\n --_radio-dot: var(--dimension-size-075);\n --_radio-stroke: var(--dimension-stroke-width-012);\n}\n\n:host(.radio--xs) {\n --_radio-circle: var(--dimension-size-100);\n --_radio-dot: var(--dimension-size-050);\n --_radio-stroke: calc(var(--dimension-stroke-width-base) * 3 / 32);\n}\n\n.radio__item {\n display: inline-flex;\n align-items: center;\n box-sizing: border-box;\n gap: var(--ds-control-gap);\n height: var(--ds-control-height);\n padding: 0 var(--ds-control-padding-inline);\n border-radius: var(--ds-control-radius);\n cursor: pointer;\n user-select: none;\n}\n\n.radio__placement {\n display: inline-flex;\n align-items: center;\n justify-content: center;\n flex-shrink: 0;\n width: var(--ds-control-icon);\n height: var(--ds-control-icon);\n}\n\n.radio__circle {\n display: inline-flex;\n align-items: center;\n justify-content: center;\n box-sizing: border-box;\n width: var(--_radio-circle);\n height: var(--_radio-circle);\n border: 0;\n border-radius: var(--dimension-radius-half);\n box-shadow: inset 0 0 0 var(--_radio-stroke) var(--color-foreground-tertiary);\n transition:\n background-color var(--effect-motion-short-2),\n box-shadow var(--effect-motion-short-2);\n}\n\n.radio__circle--checked {\n background-color: var(--color-background-bold-brand);\n box-shadow: none;\n}\n\n.radio__dot {\n width: var(--_radio-dot);\n height: var(--_radio-dot);\n border-radius: var(--dimension-radius-half);\n background-color: var(--color-foreground-on-bold-background-primary);\n}\n\n.radio__label {\n flex: 1;\n min-width: 0;\n padding: 0 var(--ds-control-label-inset);\n}\n","import { AttachInternals, Component, Prop, State, Event, EventEmitter, Element, Listen, Watch, h, Host } from '@stencil/core';\nimport { DEFAULT_REQUIRED_MESSAGE, setRequiredValidity } from '../../utils';\n\nexport interface RadioOption {\n label: string;\n value: string;\n isInactive?: boolean;\n}\n\nexport type RadioSize = 'md' | 'sm' | 'xs';\n\nconst LABEL_VARIANT: Record<RadioSize, 'text-body-medium' | 'text-body-small' | 'text-caption'> = {\n md: 'text-body-medium',\n sm: 'text-body-small',\n xs: 'text-caption',\n};\n\n@Component({\n tag: 'ds-radio',\n styleUrl: 'Radio.css',\n scoped: true,\n formAssociated: true,\n})\nexport class Radio {\n @Element() el!: HTMLElement;\n @AttachInternals() internals!: ElementInternals;\n\n /** Visible choices in this one-of-many set. */\n @Prop() options: RadioOption[] = [];\n /** Selected option value. */\n @Prop({ mutable: true }) value: string = '';\n /** Visual and placement density for every option. */\n @Prop() size: RadioSize = 'md';\n /** Native form field name. */\n @Prop({ reflect: true }) name: string | undefined;\n /** Associates the radio set with a form by id when rendered outside that form. */\n @Prop({ reflect: true }) form: string | undefined;\n /** Native disabled state for the complete set. */\n @Prop({ reflect: true }) disabled: boolean = false;\n /** Require one option to be selected for form validity. */\n @Prop({ reflect: true }) required: boolean = false;\n /** Validation message used when a required set has no selection. */\n @Prop() requiredMessage: string = DEFAULT_REQUIRED_MESSAGE;\n /** Layout direction for the option set. */\n @Prop() direction: 'vertical' | 'horizontal' = 'vertical';\n /** Design-system inactive state for the complete set. */\n @Prop() isInactive: boolean = false;\n /** Accessible name when visible group labeling is unavailable. */\n @Prop({ attribute: 'aria-label' }) ariaLabel: string | null = null;\n /** Id reference for a visible group label. */\n @Prop({ attribute: 'aria-labelledby' }) ariaLabelledby: string | undefined;\n\n /** Emitted after user selection with the selected option value. */\n @Event() dsChange!: EventEmitter<string>;\n\n private initialValue = '';\n @State() private formDisabled = false;\n\n componentWillLoad() {\n this.initialValue = this.value;\n this.syncFormValue();\n }\n\n @Watch('value')\n @Watch('disabled')\n @Watch('isInactive')\n @Watch('required')\n syncFormValue() {\n const inactive = this.isInactive || this.disabled || this.formDisabled;\n this.internals.setFormValue(inactive ? null : this.value);\n const missing = this.required && !inactive && this.value.length === 0;\n setRequiredValidity(this.internals, missing, this.requiredMessage);\n }\n\n formDisabledCallback(disabled: boolean) {\n this.formDisabled = disabled;\n this.syncFormValue();\n }\n\n formResetCallback() {\n this.value = this.initialValue;\n }\n\n formStateRestoreCallback(state: string | File | FormData | null) {\n this.value = typeof state === 'string' ? state : '';\n }\n\n private get activeItems(): HTMLElement[] {\n return Array.from(this.el.querySelectorAll<HTMLElement>('[data-radio-item]:not([data-inactive])'));\n }\n\n @Listen('keydown')\n handleKeyDown(e: KeyboardEvent) {\n const items = this.activeItems;\n if (!items.length) return;\n\n const focused = items.find(item => item === document.activeElement);\n if (!focused) return;\n\n const idx = items.indexOf(focused);\n let next = -1;\n\n switch (e.key) {\n case 'ArrowDown':\n case 'ArrowRight':\n e.preventDefault();\n next = (idx + 1) % items.length;\n break;\n case 'ArrowUp':\n case 'ArrowLeft':\n e.preventDefault();\n next = (idx - 1 + items.length) % items.length;\n break;\n case 'Home':\n e.preventDefault();\n next = 0;\n break;\n case 'End':\n e.preventDefault();\n next = items.length - 1;\n break;\n }\n\n if (next >= 0) {\n items[next].focus();\n const nextValue = items[next].dataset['value'];\n if (nextValue && nextValue !== this.value) {\n this.value = nextValue;\n this.dsChange.emit(nextValue);\n }\n }\n }\n\n private selectItem(optValue: string) {\n if (this.isInactive || this.disabled || this.formDisabled) return;\n if (optValue !== this.value) {\n this.value = optValue;\n this.dsChange.emit(optValue);\n }\n }\n\n render() {\n const inactive = this.isInactive || this.disabled || this.formDisabled;\n const invalid = this.required && !inactive && this.value.length === 0;\n const selectedIdx = this.options.findIndex(option => option.value === this.value);\n const firstActiveIdx = this.options.findIndex(option => !inactive && !option.isInactive);\n const focusableIdx = selectedIdx >= 0 && !inactive && !this.options[selectedIdx]?.isInactive\n ? selectedIdx\n : firstActiveIdx;\n\n return (\n <Host\n role=\"radiogroup\"\n aria-label={this.ariaLabel}\n aria-labelledby={this.ariaLabelledby}\n aria-required={this.required ? 'true' : undefined}\n aria-invalid={invalid ? 'true' : undefined}\n class={{\n radio: true,\n 'radio--horizontal': this.direction === 'horizontal',\n [`radio--${this.size}`]: true,\n }}\n >\n {this.options.map((option, index) => {\n const isItemInactive = inactive || !!option.isInactive;\n const isChecked = option.value === this.value;\n const tabIdx = isItemInactive ? -1 : index === focusableIdx ? 0 : -1;\n\n return (\n <div\n key={option.value}\n role=\"radio\"\n aria-checked={String(isChecked)}\n aria-disabled={isItemInactive ? 'true' : undefined}\n tabIndex={tabIdx}\n data-radio-item\n data-value={option.value}\n data-inactive={isItemInactive || undefined}\n class={{\n radio__item: true,\n [`ds-control--${this.size}`]: true,\n 'ds-control-inactive': isItemInactive,\n 'ds-focus-ring-inset': !isItemInactive,\n 'ds-interaction-fill': !isItemInactive,\n }}\n onClick={() => !isItemInactive && this.selectItem(option.value)}\n onKeyDown={(e: KeyboardEvent) => {\n if ((e.key === ' ' || e.key === 'Enter') && !isItemInactive) {\n e.preventDefault();\n this.selectItem(option.value);\n }\n }}\n >\n <span class=\"radio__placement ds-interaction-fill__content\" aria-hidden=\"true\">\n <span class={{ radio__circle: true, 'radio__circle--checked': isChecked }}>\n {isChecked && <span class=\"radio__dot\" />}\n </span>\n </span>\n <ds-text\n class=\"radio__label ds-interaction-fill__content\"\n as=\"span\"\n variant={LABEL_VARIANT[this.size]}\n >\n {option.label}\n </ds-text>\n </div>\n );\n })}\n </Host>\n );\n }\n}\n"],"mappings":"4IAAA,MAAMA,EAAW,IAAM,4lTCWvB,MAAMC,EAA4F,CAChGC,GAAI,mBACJC,GAAI,kBACJC,GAAI,gB,MASOC,EAAKC,EAAA,MAAAD,UAAAE,EANlB,WAAAC,CAAAC,G,mHAWUC,KAAAC,QAAyB,GAERD,KAAAE,MAAgB,GAEjCF,KAAAG,KAAkB,KAMDH,KAAAI,SAAoB,MAEpBJ,KAAAK,SAAoB,MAErCL,KAAAM,gBAA0BC,EAE1BP,KAAAQ,UAAuC,WAEvCR,KAAAS,WAAsB,MAEKT,KAAAU,UAA2B,KAOtDV,KAAAW,aAAe,GACNX,KAAAY,aAAe,KA2JjC,CAzJC,iBAAAC,GACEb,KAAKW,aAAeX,KAAKE,MACzBF,KAAKc,e,CAOP,aAAAA,GACE,MAAMC,EAAWf,KAAKS,YAAcT,KAAKI,UAAYJ,KAAKY,aAC1DZ,KAAKgB,UAAUC,aAAaF,EAAW,KAAOf,KAAKE,OACnD,MAAMgB,EAAUlB,KAAKK,WAAaU,GAAYf,KAAKE,MAAMiB,SAAW,EACpEC,EAAoBpB,KAAKgB,UAAWE,EAASlB,KAAKM,gB,CAGpD,oBAAAe,CAAqBjB,GACnBJ,KAAKY,aAAeR,EACpBJ,KAAKc,e,CAGP,iBAAAQ,GACEtB,KAAKE,MAAQF,KAAKW,Y,CAGpB,wBAAAY,CAAyBC,GACvBxB,KAAKE,aAAesB,IAAU,SAAWA,EAAQ,E,CAGnD,eAAYC,GACV,OAAOC,MAAMC,KAAK3B,KAAK4B,GAAGC,iBAA8B,0C,CAI1D,aAAAC,CAAcC,GACZ,MAAMC,EAAQhC,KAAKyB,YACnB,IAAKO,EAAMb,OAAQ,OAEnB,MAAMc,EAAUD,EAAME,MAAKC,GAAQA,IAASC,SAASC,gBACrD,IAAKJ,EAAS,OAEd,MAAMK,EAAMN,EAAMO,QAAQN,GAC1B,IAAIO,GAAO,EAEX,OAAQT,EAAEU,KACR,IAAK,YACL,IAAK,aACHV,EAAEW,iBACFF,GAAQF,EAAM,GAAKN,EAAMb,OACzB,MACF,IAAK,UACL,IAAK,YACHY,EAAEW,iBACFF,GAAQF,EAAM,EAAIN,EAAMb,QAAUa,EAAMb,OACxC,MACF,IAAK,OACHY,EAAEW,iBACFF,EAAO,EACP,MACF,IAAK,MACHT,EAAEW,iBACFF,EAAOR,EAAMb,OAAS,EACtB,MAGJ,GAAIqB,GAAQ,EAAG,CACbR,EAAMQ,GAAMG,QACZ,MAAMC,EAAYZ,EAAMQ,GAAMK,QAAQ,SACtC,GAAID,GAAaA,IAAc5C,KAAKE,MAAO,CACzCF,KAAKE,MAAQ0C,EACb5C,KAAK8C,SAASC,KAAKH,E,GAKjB,UAAAI,CAAWC,GACjB,GAAIjD,KAAKS,YAAcT,KAAKI,UAAYJ,KAAKY,aAAc,OAC3D,GAAIqC,IAAajD,KAAKE,MAAO,CAC3BF,KAAKE,MAAQ+C,EACbjD,KAAK8C,SAASC,KAAKE,E,EAIvB,MAAAC,GACE,MAAMnC,EAAWf,KAAKS,YAAcT,KAAKI,UAAYJ,KAAKY,aAC1D,MAAMuC,EAAUnD,KAAKK,WAAaU,GAAYf,KAAKE,MAAMiB,SAAW,EACpE,MAAMiC,EAAcpD,KAAKC,QAAQoD,WAAUC,GAAUA,EAAOpD,QAAUF,KAAKE,QAC3E,MAAMqD,EAAiBvD,KAAKC,QAAQoD,WAAUC,IAAWvC,IAAauC,EAAO7C,aAC7E,MAAM+C,EAAeJ,GAAe,IAAMrC,IAAaf,KAAKC,QAAQmD,IAAc3C,WAC9E2C,EACAG,EAEJ,OACEE,EAACC,EAAI,CAAAjB,IAAA,2CACHkB,KAAK,aAAY,aACL3D,KAAKU,UAAS,kBACTV,KAAK4D,eAAc,gBACrB5D,KAAKK,SAAW,OAASwD,UAAS,eACnCV,EAAU,OAASU,UACjCC,MAAO,CACLC,MAAO,KACP,oBAAqB/D,KAAKQ,YAAc,aACxC,CAAC,UAAUR,KAAKG,QAAS,OAG1BH,KAAKC,QAAQ+D,KAAI,CAACV,EAAQW,KACzB,MAAMC,EAAiBnD,KAAcuC,EAAO7C,WAC5C,MAAM0D,EAAYb,EAAOpD,QAAUF,KAAKE,MACxC,MAAMkE,EAASF,GAAiB,EAAKD,IAAUT,EAAe,GAAI,EAElE,OACEC,EAAA,OACEhB,IAAKa,EAAOpD,MACZyD,KAAK,QAAO,eACEU,OAAOF,GAAU,gBAChBD,EAAiB,OAASL,UACzCS,SAAUF,EAAM,oCAEJd,EAAOpD,MAAK,gBACTgE,GAAkBL,UACjCC,MAAO,CACLS,YAAa,KACb,CAAC,eAAevE,KAAKG,QAAS,KAC9B,sBAAuB+D,EACvB,uBAAwBA,EACxB,uBAAwBA,GAE1BM,QAAS,KAAON,GAAkBlE,KAAKgD,WAAWM,EAAOpD,OACzDuE,UAAY1C,IACV,IAAKA,EAAEU,MAAQ,KAAOV,EAAEU,MAAQ,WAAayB,EAAgB,CAC3DnC,EAAEW,iBACF1C,KAAKgD,WAAWM,EAAOpD,M,IAI3BuD,EAAA,QAAMK,MAAM,gDAA+C,cAAa,QACtEL,EAAA,QAAMK,MAAO,CAAEY,cAAe,KAAM,yBAA0BP,IAC3DA,GAAaV,EAAA,QAAMK,MAAM,iBAG9BL,EAAA,WACEK,MAAM,4CACNa,GAAG,OACHC,QAASrF,EAAcS,KAAKG,OAE3BmD,EAAOuB,OAEN,I","ignoreList":[]}
|
|
1
|
+
{"version":3,"names":["radioCss","LABEL_VARIANT","md","sm","xs","Radio","__stencil_proxyCustomElement","HTMLElement","constructor","registerHost","this","options","value","size","disabled","required","requiredMessage","DEFAULT_REQUIRED_MESSAGE","direction","isInactive","ariaLabel","initialValue","formDisabled","componentWillLoad","syncFormValue","inactive","internals","setFormValue","missing","length","setRequiredValidity","formDisabledCallback","formResetCallback","formStateRestoreCallback","state","activeItems","Array","from","el","querySelectorAll","handleKeyDown","e","items","focused","find","item","document","activeElement","idx","indexOf","next","key","preventDefault","focus","nextValue","dataset","dsChange","emit","selectItem","optValue","render","invalid","selectedIdx","findIndex","option","firstActiveIdx","focusableIdx","h","Host","role","ariaLabelledby","undefined","class","radio","map","index","isItemInactive","isChecked","tabIdx","String","tabIndex","radio__item","onClick","onKeyDown","radio__circle","as","variant","label"],"sources":["src/wc/components/Radio/Radio.css?tag=ds-radio&encapsulation=scoped","src/wc/components/Radio/Radio.tsx"],"sourcesContent":["@import '../../utils/control-inactive.css';\n@import '../../utils/control-density.css';\n@import '../../utils/focus-ring.css';\n@import '../../utils/interaction-fill.css';\n\n:host {\n display: flex;\n flex-direction: column;\n gap: var(--dimension-space-025);\n}\n\n:host(.radio--horizontal) {\n flex-direction: row;\n gap: var(--dimension-space-100);\n}\n\n:host(.radio--md) {\n --_radio-circle: var(--dimension-iconography-sm);\n --_radio-dot: var(--dimension-size-100);\n --_radio-stroke: var(--dimension-stroke-width-015);\n}\n\n:host(.radio--sm) {\n --_radio-circle: var(--dimension-iconography-xs);\n --_radio-dot: var(--dimension-size-075);\n --_radio-stroke: var(--dimension-stroke-width-012);\n}\n\n:host(.radio--xs) {\n --_radio-circle: var(--dimension-size-100);\n --_radio-dot: var(--dimension-size-050);\n --_radio-stroke: calc(var(--dimension-stroke-width-base) * 3 / 32);\n}\n\n.radio__item {\n display: inline-flex;\n align-items: center;\n box-sizing: border-box;\n gap: var(--ds-control-gap);\n height: var(--ds-control-height);\n padding: 0 var(--ds-control-padding-inline);\n border-radius: var(--ds-control-radius);\n cursor: default;\n user-select: none;\n}\n\n.radio__placement {\n display: inline-flex;\n align-items: center;\n justify-content: center;\n flex-shrink: 0;\n width: var(--ds-control-icon);\n height: var(--ds-control-icon);\n}\n\n.radio__circle {\n display: inline-flex;\n align-items: center;\n justify-content: center;\n box-sizing: border-box;\n width: var(--_radio-circle);\n height: var(--_radio-circle);\n border: 0;\n border-radius: var(--dimension-radius-half);\n box-shadow: inset 0 0 0 var(--_radio-stroke) var(--color-foreground-tertiary);\n transition:\n background-color var(--effect-motion-short-2),\n box-shadow var(--effect-motion-short-2);\n}\n\n.radio__circle--checked {\n background-color: var(--color-background-bold-brand);\n box-shadow: none;\n}\n\n.radio__dot {\n width: var(--_radio-dot);\n height: var(--_radio-dot);\n border-radius: var(--dimension-radius-half);\n background-color: var(--color-foreground-on-bold-background-primary);\n}\n\n.radio__label {\n flex: 1;\n min-width: 0;\n padding: 0 var(--ds-control-label-inset);\n}\n","import { AttachInternals, Component, Prop, State, Event, EventEmitter, Element, Listen, Watch, h, Host } from '@stencil/core';\nimport { DEFAULT_REQUIRED_MESSAGE, setRequiredValidity } from '../../utils';\n\nexport interface RadioOption {\n label: string;\n value: string;\n isInactive?: boolean;\n}\n\nexport type RadioSize = 'md' | 'sm' | 'xs';\n\nconst LABEL_VARIANT: Record<RadioSize, 'text-body-medium' | 'text-body-small' | 'text-caption'> = {\n md: 'text-body-medium',\n sm: 'text-body-small',\n xs: 'text-caption',\n};\n\n@Component({\n tag: 'ds-radio',\n styleUrl: 'Radio.css',\n scoped: true,\n formAssociated: true,\n})\nexport class Radio {\n @Element() el!: HTMLElement;\n @AttachInternals() internals!: ElementInternals;\n\n /** Visible choices in this one-of-many set. */\n @Prop() options: RadioOption[] = [];\n /** Selected option value. */\n @Prop({ mutable: true }) value: string = '';\n /** Visual and placement density for every option. */\n @Prop() size: RadioSize = 'md';\n /** Native form field name. */\n @Prop({ reflect: true }) name: string | undefined;\n /** Associates the radio set with a form by id when rendered outside that form. */\n @Prop({ reflect: true }) form: string | undefined;\n /** Native disabled state for the complete set. */\n @Prop({ reflect: true }) disabled: boolean = false;\n /** Require one option to be selected for form validity. */\n @Prop({ reflect: true }) required: boolean = false;\n /** Validation message used when a required set has no selection. */\n @Prop() requiredMessage: string = DEFAULT_REQUIRED_MESSAGE;\n /** Layout direction for the option set. */\n @Prop() direction: 'vertical' | 'horizontal' = 'vertical';\n /** Design-system inactive state for the complete set. */\n @Prop() isInactive: boolean = false;\n /** Accessible name when visible group labeling is unavailable. */\n @Prop({ attribute: 'aria-label' }) ariaLabel: string | null = null;\n /** Id reference for a visible group label. */\n @Prop({ attribute: 'aria-labelledby' }) ariaLabelledby: string | undefined;\n\n /** Emitted after user selection with the selected option value. */\n @Event() dsChange!: EventEmitter<string>;\n\n private initialValue = '';\n @State() private formDisabled = false;\n\n componentWillLoad() {\n this.initialValue = this.value;\n this.syncFormValue();\n }\n\n @Watch('value')\n @Watch('disabled')\n @Watch('isInactive')\n @Watch('required')\n syncFormValue() {\n const inactive = this.isInactive || this.disabled || this.formDisabled;\n this.internals.setFormValue(inactive ? null : this.value);\n const missing = this.required && !inactive && this.value.length === 0;\n setRequiredValidity(this.internals, missing, this.requiredMessage);\n }\n\n formDisabledCallback(disabled: boolean) {\n this.formDisabled = disabled;\n this.syncFormValue();\n }\n\n formResetCallback() {\n this.value = this.initialValue;\n }\n\n formStateRestoreCallback(state: string | File | FormData | null) {\n this.value = typeof state === 'string' ? state : '';\n }\n\n private get activeItems(): HTMLElement[] {\n return Array.from(this.el.querySelectorAll<HTMLElement>('[data-radio-item]:not([data-inactive])'));\n }\n\n @Listen('keydown')\n handleKeyDown(e: KeyboardEvent) {\n const items = this.activeItems;\n if (!items.length) return;\n\n const focused = items.find(item => item === document.activeElement);\n if (!focused) return;\n\n const idx = items.indexOf(focused);\n let next = -1;\n\n switch (e.key) {\n case 'ArrowDown':\n case 'ArrowRight':\n e.preventDefault();\n next = (idx + 1) % items.length;\n break;\n case 'ArrowUp':\n case 'ArrowLeft':\n e.preventDefault();\n next = (idx - 1 + items.length) % items.length;\n break;\n case 'Home':\n e.preventDefault();\n next = 0;\n break;\n case 'End':\n e.preventDefault();\n next = items.length - 1;\n break;\n }\n\n if (next >= 0) {\n items[next].focus();\n const nextValue = items[next].dataset['value'];\n if (nextValue && nextValue !== this.value) {\n this.value = nextValue;\n this.dsChange.emit(nextValue);\n }\n }\n }\n\n private selectItem(optValue: string) {\n if (this.isInactive || this.disabled || this.formDisabled) return;\n if (optValue !== this.value) {\n this.value = optValue;\n this.dsChange.emit(optValue);\n }\n }\n\n render() {\n const inactive = this.isInactive || this.disabled || this.formDisabled;\n const invalid = this.required && !inactive && this.value.length === 0;\n const selectedIdx = this.options.findIndex(option => option.value === this.value);\n const firstActiveIdx = this.options.findIndex(option => !inactive && !option.isInactive);\n const focusableIdx = selectedIdx >= 0 && !inactive && !this.options[selectedIdx]?.isInactive\n ? selectedIdx\n : firstActiveIdx;\n\n return (\n <Host\n role=\"radiogroup\"\n aria-label={this.ariaLabel}\n aria-labelledby={this.ariaLabelledby}\n aria-required={this.required ? 'true' : undefined}\n aria-invalid={invalid ? 'true' : undefined}\n class={{\n radio: true,\n 'radio--horizontal': this.direction === 'horizontal',\n [`radio--${this.size}`]: true,\n }}\n >\n {this.options.map((option, index) => {\n const isItemInactive = inactive || !!option.isInactive;\n const isChecked = option.value === this.value;\n const tabIdx = isItemInactive ? -1 : index === focusableIdx ? 0 : -1;\n\n return (\n <div\n key={option.value}\n role=\"radio\"\n aria-checked={String(isChecked)}\n aria-disabled={isItemInactive ? 'true' : undefined}\n tabIndex={tabIdx}\n data-radio-item\n data-value={option.value}\n data-inactive={isItemInactive || undefined}\n class={{\n radio__item: true,\n [`ds-control--${this.size}`]: true,\n 'ds-control-inactive': isItemInactive,\n 'ds-focus-ring-inset': !isItemInactive,\n 'ds-interaction-fill': !isItemInactive,\n }}\n onClick={() => !isItemInactive && this.selectItem(option.value)}\n onKeyDown={(e: KeyboardEvent) => {\n if ((e.key === ' ' || e.key === 'Enter') && !isItemInactive) {\n e.preventDefault();\n this.selectItem(option.value);\n }\n }}\n >\n <span class=\"radio__placement ds-interaction-fill__content\" aria-hidden=\"true\">\n <span class={{ radio__circle: true, 'radio__circle--checked': isChecked }}>\n {isChecked && <span class=\"radio__dot\" />}\n </span>\n </span>\n <ds-text\n class=\"radio__label ds-interaction-fill__content\"\n as=\"span\"\n variant={LABEL_VARIANT[this.size]}\n >\n {option.label}\n </ds-text>\n </div>\n );\n })}\n </Host>\n );\n }\n}\n"],"mappings":"4IAAA,MAAMA,EAAW,IAAM,+3TCWvB,MAAMC,EAA4F,CAChGC,GAAI,mBACJC,GAAI,kBACJC,GAAI,gB,MASOC,EAAKC,EAAA,MAAAD,UAAAE,EANlB,WAAAC,CAAAC,G,mHAWUC,KAAAC,QAAyB,GAERD,KAAAE,MAAgB,GAEjCF,KAAAG,KAAkB,KAMDH,KAAAI,SAAoB,MAEpBJ,KAAAK,SAAoB,MAErCL,KAAAM,gBAA0BC,EAE1BP,KAAAQ,UAAuC,WAEvCR,KAAAS,WAAsB,MAEKT,KAAAU,UAA2B,KAOtDV,KAAAW,aAAe,GACNX,KAAAY,aAAe,KA2JjC,CAzJC,iBAAAC,GACEb,KAAKW,aAAeX,KAAKE,MACzBF,KAAKc,e,CAOP,aAAAA,GACE,MAAMC,EAAWf,KAAKS,YAAcT,KAAKI,UAAYJ,KAAKY,aAC1DZ,KAAKgB,UAAUC,aAAaF,EAAW,KAAOf,KAAKE,OACnD,MAAMgB,EAAUlB,KAAKK,WAAaU,GAAYf,KAAKE,MAAMiB,SAAW,EACpEC,EAAoBpB,KAAKgB,UAAWE,EAASlB,KAAKM,gB,CAGpD,oBAAAe,CAAqBjB,GACnBJ,KAAKY,aAAeR,EACpBJ,KAAKc,e,CAGP,iBAAAQ,GACEtB,KAAKE,MAAQF,KAAKW,Y,CAGpB,wBAAAY,CAAyBC,GACvBxB,KAAKE,aAAesB,IAAU,SAAWA,EAAQ,E,CAGnD,eAAYC,GACV,OAAOC,MAAMC,KAAK3B,KAAK4B,GAAGC,iBAA8B,0C,CAI1D,aAAAC,CAAcC,GACZ,MAAMC,EAAQhC,KAAKyB,YACnB,IAAKO,EAAMb,OAAQ,OAEnB,MAAMc,EAAUD,EAAME,MAAKC,GAAQA,IAASC,SAASC,gBACrD,IAAKJ,EAAS,OAEd,MAAMK,EAAMN,EAAMO,QAAQN,GAC1B,IAAIO,GAAO,EAEX,OAAQT,EAAEU,KACR,IAAK,YACL,IAAK,aACHV,EAAEW,iBACFF,GAAQF,EAAM,GAAKN,EAAMb,OACzB,MACF,IAAK,UACL,IAAK,YACHY,EAAEW,iBACFF,GAAQF,EAAM,EAAIN,EAAMb,QAAUa,EAAMb,OACxC,MACF,IAAK,OACHY,EAAEW,iBACFF,EAAO,EACP,MACF,IAAK,MACHT,EAAEW,iBACFF,EAAOR,EAAMb,OAAS,EACtB,MAGJ,GAAIqB,GAAQ,EAAG,CACbR,EAAMQ,GAAMG,QACZ,MAAMC,EAAYZ,EAAMQ,GAAMK,QAAQ,SACtC,GAAID,GAAaA,IAAc5C,KAAKE,MAAO,CACzCF,KAAKE,MAAQ0C,EACb5C,KAAK8C,SAASC,KAAKH,E,GAKjB,UAAAI,CAAWC,GACjB,GAAIjD,KAAKS,YAAcT,KAAKI,UAAYJ,KAAKY,aAAc,OAC3D,GAAIqC,IAAajD,KAAKE,MAAO,CAC3BF,KAAKE,MAAQ+C,EACbjD,KAAK8C,SAASC,KAAKE,E,EAIvB,MAAAC,GACE,MAAMnC,EAAWf,KAAKS,YAAcT,KAAKI,UAAYJ,KAAKY,aAC1D,MAAMuC,EAAUnD,KAAKK,WAAaU,GAAYf,KAAKE,MAAMiB,SAAW,EACpE,MAAMiC,EAAcpD,KAAKC,QAAQoD,WAAUC,GAAUA,EAAOpD,QAAUF,KAAKE,QAC3E,MAAMqD,EAAiBvD,KAAKC,QAAQoD,WAAUC,IAAWvC,IAAauC,EAAO7C,aAC7E,MAAM+C,EAAeJ,GAAe,IAAMrC,IAAaf,KAAKC,QAAQmD,IAAc3C,WAC9E2C,EACAG,EAEJ,OACEE,EAACC,EAAI,CAAAjB,IAAA,2CACHkB,KAAK,aAAY,aACL3D,KAAKU,UAAS,kBACTV,KAAK4D,eAAc,gBACrB5D,KAAKK,SAAW,OAASwD,UAAS,eACnCV,EAAU,OAASU,UACjCC,MAAO,CACLC,MAAO,KACP,oBAAqB/D,KAAKQ,YAAc,aACxC,CAAC,UAAUR,KAAKG,QAAS,OAG1BH,KAAKC,QAAQ+D,KAAI,CAACV,EAAQW,KACzB,MAAMC,EAAiBnD,KAAcuC,EAAO7C,WAC5C,MAAM0D,EAAYb,EAAOpD,QAAUF,KAAKE,MACxC,MAAMkE,EAASF,GAAiB,EAAKD,IAAUT,EAAe,GAAI,EAElE,OACEC,EAAA,OACEhB,IAAKa,EAAOpD,MACZyD,KAAK,QAAO,eACEU,OAAOF,GAAU,gBAChBD,EAAiB,OAASL,UACzCS,SAAUF,EAAM,oCAEJd,EAAOpD,MAAK,gBACTgE,GAAkBL,UACjCC,MAAO,CACLS,YAAa,KACb,CAAC,eAAevE,KAAKG,QAAS,KAC9B,sBAAuB+D,EACvB,uBAAwBA,EACxB,uBAAwBA,GAE1BM,QAAS,KAAON,GAAkBlE,KAAKgD,WAAWM,EAAOpD,OACzDuE,UAAY1C,IACV,IAAKA,EAAEU,MAAQ,KAAOV,EAAEU,MAAQ,WAAayB,EAAgB,CAC3DnC,EAAEW,iBACF1C,KAAKgD,WAAWM,EAAOpD,M,IAI3BuD,EAAA,QAAMK,MAAM,gDAA+C,cAAa,QACtEL,EAAA,QAAMK,MAAO,CAAEY,cAAe,KAAM,yBAA0BP,IAC3DA,GAAaV,EAAA,QAAMK,MAAM,iBAG9BL,EAAA,WACEK,MAAM,4CACNa,GAAG,OACHC,QAASrF,EAAcS,KAAKG,OAE3BmD,EAAOuB,OAEN,I","ignoreList":[]}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{p as e,H as t,c as s,h as i,a as r,t as o}from"./index.js";import{c as n,a as c,r as l}from"./p-CydY-v7X.js";import{a,C as d,b as h}from"./p-DbpfpeQT.js";import{e as u,r as m,f as g,a as p,b as f,m as v,d as b,g as y}from"./p-BhC1YyId.js";import{d as x}from"./p-CaRyxTMz.js";import{d as w}from"./p-DcFfilOX.js";import{d as k}from"./p-DTea1Du7.js";import{d as _}from"./p-BY0PzkUp.js";import{d as z}from"./p-BAfG3M8z.js";import{d as C}from"./p-Ca-I2UnB.js";import{d as F}from"./p-BwGnhInj.js";import{d as j}from"./p-DWdRSOBV.js";import{D as A,s as D}from"./p-BgGP65Nn.js";import{r as V}from"./p-BJMRBHKW.js";import{r as I,T as L}from"./p-Dg3xLna0.js";import{C as $}from"./p-Cx-ywr1e.js";import{c as O}from"./p-DuFm-ieS.js";const S=()=>`.sc-ds-select-multi-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-select-multi-h:focus-visible,.ds-focus-ring.sc-ds-select-multi: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-select-multi-h,.ds-focus-ring.ds-focus-ring--visible.sc-ds-select-multi{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-select-multi-h:focus-visible,.ds-focus-ring-inset.sc-ds-select-multi:focus-visible{outline:none}.ds-focus-ring-inset.sc-ds-select-multi-h:focus-visible::after,.ds-focus-ring-inset.sc-ds-select-multi: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-select-multi-h,.ds-focus-ring-inset.ds-focus-ring--visible.sc-ds-select-multi{outline:none}.ds-focus-ring-inset.ds-focus-ring--visible.sc-ds-select-multi-h::after,.ds-focus-ring-inset.ds-focus-ring--visible.sc-ds-select-multi::after{outline:var(--ds-focus-ring-width) solid var(--ds-focus-ring-color);outline-offset:calc(-1 * var(--ds-focus-ring-width))}.ds-interaction-fill.sc-ds-select-multi-h,.ds-interaction-fill.sc-ds-select-multi{position:relative;z-index:0;--ds-interaction-hover:var(--color-interaction-hover);--ds-interaction-pressed:var(--color-interaction-pressed);--ds-interaction-active:var(--color-interaction-active-brand);--ds-interaction-border-width:0px;--ds-interaction-border-color:transparent}.ds-interaction-fill.sc-ds-select-multi-h::before,.ds-interaction-fill.sc-ds-select-multi::before,.ds-interaction-fill.sc-ds-select-multi-h::after,.ds-interaction-fill.sc-ds-select-multi::after{content:'';position:absolute;inset:0;border-radius:inherit;background:transparent;pointer-events:none;transition:none}.ds-interaction-fill.sc-ds-select-multi-h::before,.ds-interaction-fill.sc-ds-select-multi::before{z-index:1}.ds-interaction-fill.sc-ds-select-multi-h::after,.ds-interaction-fill.sc-ds-select-multi::after{z-index:3;box-shadow:inset 0 0 0 var(--ds-interaction-border-width) var(--ds-interaction-border-color)}.ds-interaction-fill--bordered.sc-ds-select-multi-h,.ds-interaction-fill--bordered.sc-ds-select-multi{--ds-interaction-border-width:var(--dimension-stroke-width-012);--ds-interaction-border-color:var(--color-border-secondary)}.ds-interaction-fill--selected.sc-ds-select-multi-h::before,.ds-interaction-fill--selected.sc-ds-select-multi::before{background:var(--ds-interaction-active)}.ds-interaction-fill--selected.sc-ds-select-multi-h,.ds-interaction-fill--selected.sc-ds-select-multi{--ds-interaction-dot-ring:var(--ds-interaction-active)}.ds-interaction-fill.sc-ds-select-multi-h:hover:not(:disabled)::after,.ds-interaction-fill.sc-ds-select-multi:hover:not(:disabled)::after{background:var(--ds-interaction-hover)}.ds-interaction-fill.sc-ds-select-multi-h:active:not(:disabled)::after,.ds-interaction-fill.sc-ds-select-multi:active:not(:disabled)::after{background:var(--ds-interaction-pressed)}.ds-interaction-fill.sc-ds-select-multi-h>.ds-interaction-fill__content.sc-ds-select-multi,.ds-interaction-fill.sc-ds-select-multi>.ds-interaction-fill__content.sc-ds-select-multi,.ds-interaction-fill__content.sc-ds-select-multi{position:relative;z-index:2}.ds-interaction-fill--on-faint.sc-ds-select-multi-h,.ds-interaction-fill--on-faint.sc-ds-select-multi{--ds-interaction-active:var(--color-interaction-active)}.ds-interaction-fill--on-medium.sc-ds-select-multi-h,.ds-interaction-fill--on-medium.sc-ds-select-multi{--ds-interaction-hover:var(--color-interaction-on-medium-background-hover);--ds-interaction-pressed:var(--color-interaction-on-medium-background-pressed);--ds-interaction-active:var(--color-interaction-on-medium-background-active);--ds-focus-ring-color:var(--color-interaction-on-medium-background-focus)}.ds-interaction-fill--on-bold.sc-ds-select-multi-h,.ds-interaction-fill--on-bold.sc-ds-select-multi{--ds-interaction-hover:var(--color-interaction-on-bold-background-hover);--ds-interaction-pressed:var(--color-interaction-on-bold-background-pressed);--ds-interaction-active:var(--color-interaction-on-bold-background-active);--ds-focus-ring-color:var(--color-interaction-on-bold-background-focus)}.ds-interaction-fill--on-strong.sc-ds-select-multi-h,.ds-interaction-fill--on-strong.sc-ds-select-multi{--ds-interaction-hover:var(--color-interaction-on-strong-background-hover);--ds-interaction-pressed:var(--color-interaction-on-strong-background-pressed);--ds-interaction-active:var(--color-interaction-on-strong-background-active);--ds-focus-ring-color:var(--color-interaction-on-strong-background-focus)}.ds-interaction-fill--on-translucent.sc-ds-select-multi-h,.ds-interaction-fill--on-translucent.sc-ds-select-multi{--ds-interaction-hover:var(--color-translucent-interaction-hover);--ds-interaction-pressed:var(--color-translucent-interaction-pressed);--ds-interaction-active:var(--color-translucent-interaction-active);--ds-focus-ring-color:var(--color-translucent-interaction-focus)}.ds-interaction-fill--on-inverted.sc-ds-select-multi-h,.ds-interaction-fill--on-inverted.sc-ds-select-multi{--ds-interaction-hover:var(--color-inverted-interaction-hover);--ds-interaction-pressed:var(--color-inverted-interaction-pressed);--ds-interaction-active:var(--color-inverted-interaction-active);--ds-focus-ring-color:var(--color-inverted-interaction-focus)}.ds-interaction-fill--on-media.sc-ds-select-multi-h,.ds-interaction-fill--on-media.sc-ds-select-multi{--ds-interaction-hover:var(--color-media-interaction-hover);--ds-interaction-pressed:var(--color-media-interaction-pressed);--ds-interaction-active:var(--color-media-interaction-active);--ds-focus-ring-color:var(--color-media-interaction-focus)}.ds-interaction-fill--on-always-dark.sc-ds-select-multi-h,.ds-interaction-fill--on-always-dark.sc-ds-select-multi{--ds-interaction-hover:var(--color-always-dark-interaction-hover);--ds-interaction-pressed:var(--color-always-dark-interaction-pressed);--ds-interaction-active:var(--color-always-dark-interaction-active);--ds-focus-ring-color:var(--color-always-dark-interaction-focus)}.ds-interaction-fill--on-navigation.sc-ds-select-multi-h,.ds-interaction-fill--on-navigation.sc-ds-select-multi{--ds-interaction-hover:var(--color-navigation-interaction-hover);--ds-interaction-pressed:var(--color-navigation-interaction-pressed);--ds-interaction-active:var(--color-navigation-interaction-active);--ds-focus-ring-color:var(--color-navigation-interaction-focus)}.ds-control-inactive.sc-ds-select-multi-h,.ds-control-inactive.sc-ds-select-multi{opacity:0.5;pointer-events:none;cursor:not-allowed}.ds-control--lg.sc-ds-select-multi,.ds-control--lg.sc-ds-select-multi-h,.ds-control--md.sc-ds-select-multi-h,.ds-control--md.sc-ds-select-multi,.ds-control--sm.sc-ds-select-multi-h,.ds-control--sm.sc-ds-select-multi,.ds-control--xs.sc-ds-select-multi-h,.ds-control--xs.sc-ds-select-multi{--ds-control-radius:var(--dimension-radius-025)}.ds-control--lg.sc-ds-select-multi-h,.ds-control--lg.sc-ds-select-multi{--ds-control-height:var(--dimension-size-500);--ds-control-icon:var(--dimension-iconography-lg);--ds-control-padding-inline:var(--dimension-space-100);--ds-control-label-inset:var(--dimension-space-050);--ds-control-gap:var(--dimension-space-050)}.ds-control--md.sc-ds-select-multi-h,.ds-control--md.sc-ds-select-multi{--ds-control-height:var(--dimension-size-400);--ds-control-icon:var(--dimension-iconography-md);--ds-control-padding-inline:var(--dimension-space-075);--ds-control-label-inset:var(--dimension-space-025);--ds-control-gap:var(--dimension-space-050)}.ds-control--sm.sc-ds-select-multi-h,.ds-control--sm.sc-ds-select-multi{--ds-control-height:var(--dimension-size-300);--ds-control-icon:var(--dimension-iconography-sm);--ds-control-padding-inline:var(--dimension-space-050);--ds-control-label-inset:var(--dimension-space-025);--ds-control-gap:var(--dimension-space-025)}.ds-control--xs.sc-ds-select-multi-h,.ds-control--xs.sc-ds-select-multi{--ds-control-height:var(--dimension-size-200);--ds-control-icon:var(--dimension-iconography-xs);--ds-control-padding-inline:var(--dimension-space-025);--ds-control-label-inset:var(--dimension-space-025);--ds-control-gap:0}.ds-choice-popup.sc-ds-select-multi{box-sizing:border-box;display:flex;flex-direction:column;min-width:var(--dimension-menu-width-xs);max-width:min( var(--dimension-panel-width-lg), calc(100vw - var(--dimension-space-200)) );max-height:calc(100vh - var(--dimension-space-200));overflow:hidden;inset:auto;margin:0;padding:0;border:0;background-color:var(--color-background-primary);border-radius:var(--dimension-radius-075);box-shadow:var(--effect-shadow-elevated-floating);animation:dsChoiceFadeIn var(--effect-motion-short-2) forwards;backface-visibility:hidden;will-change:transform;text-align:start}.ds-choice-popup.sc-ds-select-multi::after{content:'';position:absolute;inset:0;border-radius:inherit;pointer-events:none;box-shadow:var(--effect-highlight-elevated-floating)}.ds-choice-popup--closing.sc-ds-select-multi{animation:dsChoiceFadeOut var(--effect-motion-short-2) forwards}@keyframes dsChoiceFadeIn{from{opacity:0;transform:inherit scale(0.97)}to{opacity:1}}@keyframes dsChoiceFadeOut{from{opacity:1}to{opacity:0}}@media (prefers-reduced-motion: reduce){.ds-choice-popup.sc-ds-select-multi{animation:none;opacity:1}.ds-choice-popup--closing.sc-ds-select-multi{opacity:0}}.ds-choice-list.sc-ds-select-multi{display:flex;flex-direction:column;min-height:0;overflow-y:auto;overscroll-behavior:contain}.ds-choice-section.sc-ds-select-multi{display:flex;flex-direction:column;gap:var(--dimension-space-050);padding:var(--dimension-space-050)}.ds-choice-section--divided.sc-ds-select-multi{border-bottom:var(--dimension-stroke-width-015) solid var(--color-border-tertiary)}ds-text.ds-choice-section__header.sc-ds-select-multi{display:flex;align-items:center;box-sizing:border-box;height:var(--ds-control-height, var(--dimension-size-400));padding:0 calc( var(--ds-control-padding-inline, var(--dimension-space-075)) + var(--ds-control-label-inset, var(--dimension-space-025)) );text-align:start;-webkit-user-select:none;user-select:none}.ds-choice-item.sc-ds-select-multi{display:flex;align-items:center;gap:var(--ds-control-gap, var(--dimension-space-050));width:100%;height:var(--ds-control-height, var(--dimension-size-400));padding:0 var(--ds-control-padding-inline, var(--dimension-space-075));box-sizing:border-box;border:none;border-radius:var(--ds-control-radius, var(--dimension-radius-025));background:transparent;cursor:pointer;-webkit-user-select:none;user-select:none;text-align:left;color:inherit}.ds-choice-item.sc-ds-select-multi:has(.ds-choice-item__subtext){height:auto;min-height:var(--ds-control-height, var(--dimension-size-400));padding-block:var(--ds-control-padding-inline, var(--dimension-space-075));align-items:flex-start}.ds-choice-item__content.sc-ds-select-multi{display:flex;flex:1;flex-direction:column;gap:var(--dimension-space-025);min-width:0}ds-text.ds-choice-item__label.sc-ds-select-multi,.ds-choice-item__subtext.sc-ds-select-multi,ds-text.ds-choice-item__subtext.sc-ds-select-multi{padding:0 var(--ds-control-label-inset, var(--dimension-space-025))}ds-text.ds-choice-item__label.sc-ds-select-multi{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}ds-text.ds-choice-item__subtext.sc-ds-select-multi{display:-webkit-box;overflow:hidden;white-space:normal;-webkit-box-orient:vertical;-webkit-line-clamp:2}.ds-choice-item__icon.sc-ds-select-multi,.ds-choice-item__suffix.sc-ds-select-multi{display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;width:var(--ds-control-icon, var(--dimension-iconography-md));height:var(--ds-control-icon, var(--dimension-iconography-md));pointer-events:none}.ds-choice-empty.sc-ds-select-multi,.ds-choice-loading.sc-ds-select-multi{display:flex;align-items:center;justify-content:center;box-sizing:border-box;min-height:var(--dimension-size-600);padding:var(--dimension-space-100)}.ds-choice-footer.sc-ds-select-multi{position:relative;box-sizing:border-box;padding-block:var(--dimension-space-050)}.ds-choice-footer.sc-ds-select-multi::before{content:'';position:absolute;inset:0 0 auto;height:var(--dimension-stroke-width-012);background-color:var(--color-border-tertiary);pointer-events:none}.ds-choice-footer__content.sc-ds-select-multi{display:flex;align-items:center;justify-content:space-between;box-sizing:border-box;height:var(--dimension-size-400)}.ds-choice-footer__summary.sc-ds-select-multi,.ds-choice-footer__clear.sc-ds-select-multi ds-text.sc-ds-select-multi{padding-inline:calc( var(--dimension-space-050) + var(--ds-control-padding-inline, var(--dimension-space-075)) + var(--ds-control-label-inset, var(--dimension-space-025)) )}.ds-choice-footer__clear.sc-ds-select-multi{appearance:none;display:inline-flex;align-items:center;padding:0;border:0;border-radius:var(--dimension-radius-025);background:transparent;color:var(--color-foreground-bold-brand);cursor:pointer}.ds-choice-footer__clear.sc-ds-select-multi:hover{text-decoration:underline;text-decoration-color:var(--color-foreground-tertiary)}.ds-control-width--hug.sc-ds-select-multi-h,.ds-control-width--hug.sc-ds-select-multi{width:fit-content;max-width:100%;flex:0 0 auto;align-self:flex-start}.ds-control-width--fill.sc-ds-select-multi-h,.ds-control-width--fill.sc-ds-select-multi{width:100%;min-width:0;flex:1 1 auto;align-self:stretch}.select-search.sc-ds-select-multi{position:relative;box-sizing:border-box;padding:var(--dimension-space-050);background:transparent}.select-search.sc-ds-select-multi::after{content:'';position:absolute;inset:auto 0 0;height:var(--dimension-stroke-width-012);background-color:var(--color-border-tertiary);pointer-events:none}.select-search.sc-ds-select-multi:focus-within::after{height:var(--dimension-stroke-width-018);background-color:var(--color-border-bold-brand)}.select-search__control.sc-ds-select-multi{display:flex;align-items:center;box-sizing:border-box;gap:var(--ds-control-gap, var(--dimension-space-050));height:var(--ds-control-height, var(--dimension-size-400));padding:0 var(--ds-control-padding-inline, var(--dimension-space-075));border:0;border-radius:var(--ds-control-radius, var(--dimension-radius-025))}.select-search__control.sc-ds-select-multi:has(.select-search__clear){padding-right:0}.select-search__control.sc-ds-select-multi>ds-icon.sc-ds-select-multi{flex-shrink:0;color:var(--color-foreground-secondary)}.select-search.sc-ds-select-multi .select-search__control.sc-ds-select-multi .select-search__clear.sc-ds-select-multi{align-self:center;flex-shrink:0;margin-right:var(--dimension-space-050)}.select-search__control.sc-ds-select-multi input.sc-ds-select-multi{flex:1;min-width:0;height:100%;padding:0 var(--ds-control-label-inset, var(--dimension-space-025));border:0;outline:none;background:transparent;color:var(--color-foreground-primary);font-family:inherit}.select-search__control.sc-ds-select-multi input.sc-ds-select-multi::placeholder{color:var(--color-foreground-secondary)}.select-search__control.sc-ds-select-multi input.sc-ds-select-multi:focus::placeholder{color:var(--color-foreground-quaternary)}.select-search__control.sc-ds-select-multi input[type='search'].sc-ds-select-multi::-webkit-search-cancel-button,.select-search__control.sc-ds-select-multi input[type='search'].sc-ds-select-multi::-webkit-search-decoration{display:none}.ds-text--display-medium.sc-ds-select-multi-h,.ds-text--display-medium.sc-ds-select-multi{font-size:var(--typography-fontsize-3xl);line-height:var(--typography-lineheight-3xl)}.ds-text--display-small.sc-ds-select-multi-h,.ds-text--display-small.sc-ds-select-multi{font-size:var(--typography-fontsize-2xl);line-height:var(--typography-lineheight-2xl)}.ds-text--title-large.sc-ds-select-multi-h,.ds-text--title-large.sc-ds-select-multi{font-size:var(--typography-fontsize-xl);line-height:var(--typography-lineheight-xl)}.ds-text--title-medium.sc-ds-select-multi-h,.ds-text--title-medium.sc-ds-select-multi{font-size:var(--typography-fontsize-lg);line-height:var(--typography-lineheight-lg)}.ds-text--title-small.sc-ds-select-multi-h,.ds-text--title-small.sc-ds-select-multi{font-size:var(--typography-fontsize-md);line-height:var(--typography-lineheight-md)}.ds-text--body-large.sc-ds-select-multi-h,.ds-text--body-large.sc-ds-select-multi{font-size:var(--typography-fontsize-lg);line-height:var(--typography-lineheight-lg)}.ds-text--body-medium.sc-ds-select-multi-h,.ds-text--body-medium.sc-ds-select-multi{font-size:var(--typography-fontsize-md);line-height:var(--typography-lineheight-md)}.ds-text--body-small.sc-ds-select-multi-h,.ds-text--body-small.sc-ds-select-multi{font-size:var(--typography-fontsize-sm);line-height:var(--typography-lineheight-sm)}.ds-text--caption.sc-ds-select-multi-h,.ds-text--caption.sc-ds-select-multi{font-size:var(--typography-fontsize-xs);line-height:var(--typography-lineheight-xs);text-transform:uppercase}.ds-text--display-medium.ds-text--emphasis.sc-ds-select-multi-h,.ds-text--display-small.ds-text--emphasis.sc-ds-select-multi-h,.ds-text--display-medium.ds-text--emphasis.sc-ds-select-multi,.ds-text--display-small.ds-text--emphasis.sc-ds-select-multi{font-weight:var(--typography-weight-bold);letter-spacing:var(--typography-letterspacing-negative-double)}.ds-text--display-medium.ds-text--regular.sc-ds-select-multi-h,.ds-text--display-small.ds-text--regular.sc-ds-select-multi-h,.ds-text--display-medium.ds-text--regular.sc-ds-select-multi,.ds-text--display-small.ds-text--regular.sc-ds-select-multi{font-weight:var(--typography-weight-semibold);letter-spacing:var(--typography-letterspacing-negative)}.ds-text--title-large.ds-text--emphasis.sc-ds-select-multi-h,.ds-text--title-large.ds-text--emphasis.sc-ds-select-multi{font-weight:var(--typography-weight-semibold);letter-spacing:var(--typography-letterspacing-negative-double)}.ds-text--title-large.ds-text--regular.sc-ds-select-multi-h,.ds-text--title-large.ds-text--regular.sc-ds-select-multi{font-weight:var(--typography-weight-medium);letter-spacing:var(--typography-letterspacing-negative)}.ds-text--title-medium.ds-text--emphasis.sc-ds-select-multi-h,.ds-text--title-small.ds-text--emphasis.sc-ds-select-multi-h,.ds-text--title-medium.ds-text--emphasis.sc-ds-select-multi,.ds-text--title-small.ds-text--emphasis.sc-ds-select-multi{font-weight:var(--typography-weight-semibold);letter-spacing:var(--typography-letterspacing-negative)}.ds-text--title-medium.ds-text--regular.sc-ds-select-multi-h,.ds-text--title-small.ds-text--regular.sc-ds-select-multi-h,.ds-text--title-medium.ds-text--regular.sc-ds-select-multi,.ds-text--title-small.ds-text--regular.sc-ds-select-multi{font-weight:var(--typography-weight-medium);letter-spacing:var(--typography-letterspacing-negative-half)}.ds-text--body-large.ds-text--emphasis.sc-ds-select-multi-h,.ds-text--body-medium.ds-text--emphasis.sc-ds-select-multi-h,.ds-text--body-large.ds-text--emphasis.sc-ds-select-multi,.ds-text--body-medium.ds-text--emphasis.sc-ds-select-multi{font-weight:var(--typography-weight-medium);letter-spacing:var(--typography-letterspacing-negative)}.ds-text--body-large.ds-text--regular.sc-ds-select-multi-h,.ds-text--body-medium.ds-text--regular.sc-ds-select-multi-h,.ds-text--body-large.ds-text--regular.sc-ds-select-multi,.ds-text--body-medium.ds-text--regular.sc-ds-select-multi{font-weight:var(--typography-weight-regular);letter-spacing:var(--typography-letterspacing-negative-half)}.ds-text--body-small.ds-text--emphasis.sc-ds-select-multi-h,.ds-text--body-small.ds-text--emphasis.sc-ds-select-multi{font-weight:var(--typography-weight-medium);letter-spacing:var(--typography-letterspacing-negative-half)}.ds-text--body-small.ds-text--regular.sc-ds-select-multi-h,.ds-text--body-small.ds-text--regular.sc-ds-select-multi{font-weight:var(--typography-weight-regular);letter-spacing:var(--typography-letterspacing-none)}.ds-text--caption.ds-text--emphasis.sc-ds-select-multi-h,.ds-text--caption.ds-text--emphasis.sc-ds-select-multi{font-weight:var(--typography-weight-semibold);letter-spacing:var(--typography-letterspacing-positive)}.ds-text--caption.ds-text--regular.sc-ds-select-multi-h,.ds-text--caption.ds-text--regular.sc-ds-select-multi{font-weight:var(--typography-weight-medium);letter-spacing:var(--typography-letterspacing-positive)}.select-host.sc-ds-select-multi-h{display:inline-flex;flex-direction:column;gap:var(--dimension-space-050);position:relative;outline:none;--ds-select-fg:var(--color-foreground-secondary);--ds-select-fg-active:var(--color-foreground-primary);--ds-select-prefix-fg:var(--ds-select-fg);--ds-select-chevron-fg:var(--ds-select-fg);--ds-select-border:var(--color-border-secondary)}.ds-control-width--fill.sc-ds-select-multi-h,.ds-control-width--fill.sc-ds-select-multi-h .trigger.sc-ds-select-multi{width:100%}.trigger.sc-ds-select-multi{display:inline-flex;align-items:center;justify-content:flex-start;box-sizing:border-box;height:var(--ds-control-height, var(--dimension-size-400));padding:0 var(--ds-control-padding-inline, var(--dimension-space-075));gap:var(--ds-control-gap, var(--dimension-space-050));background:transparent;border:none;border-radius:var(--ds-control-radius, var(--dimension-radius-025));color:var(--ds-select-fg);cursor:pointer;font-family:inherit;-webkit-user-select:none;user-select:none;overflow:hidden;transition:color var(--effect-motion-short-2)}.trigger--bordered.sc-ds-select-multi{--ds-interaction-border-width:var(--dimension-stroke-width-012);--ds-interaction-border-color:var(--ds-select-border)}.trigger--has-value.sc-ds-select-multi .trigger__label.sc-ds-select-multi{color:var(--ds-select-fg-active)}.wrapper--error.sc-ds-select-multi{--ds-interaction-border-width:var(--dimension-stroke-width-018);--ds-interaction-border-color:var(--color-border-bold-negative)}.trigger__prefix.sc-ds-select-multi,.trigger__chevron.sc-ds-select-multi{position:relative;z-index:2;flex-shrink:0;width:var(--ds-control-icon, var(--dimension-iconography-md));height:var(--ds-control-icon, var(--dimension-iconography-md));display:inline-flex;align-items:center;justify-content:center}.trigger__prefix.sc-ds-select-multi{color:var(--ds-select-prefix-fg)}.trigger__chevron.sc-ds-select-multi{color:var(--ds-select-chevron-fg)}.trigger__label.sc-ds-select-multi{position:relative;z-index:2;flex:1 1 auto;min-width:0;padding:0 var(--ds-control-label-inset, var(--dimension-space-025));text-align:left;color:inherit;transition:color var(--effect-motion-short-2)}.select-popup.sc-ds-select-multi{color:var(--color-foreground-secondary)}.select-option[aria-selected='true'].sc-ds-select-multi .ds-choice-item__icon.sc-ds-select-multi{color:var(--color-foreground-primary)}.error-text.sc-ds-select-multi{width:100%}.select-host--background-medium.sc-ds-select-multi-h{--ds-select-fg:var(--color-foreground-on-medium-background-secondary);--ds-select-fg-active:var(--color-foreground-on-medium-background-primary);--ds-select-border:var(--color-border-on-medium-background-secondary)}.select-host--background-bold.sc-ds-select-multi-h{--ds-select-fg:var(--color-foreground-on-bold-background-secondary);--ds-select-fg-active:var(--color-foreground-on-bold-background-primary);--ds-select-border:var(--color-border-on-bold-background-secondary)}.select-host--background-strong.sc-ds-select-multi-h{--ds-select-fg:var(--color-foreground-on-strong-background-secondary);--ds-select-fg-active:var(--color-foreground-on-strong-background-primary);--ds-select-border:var(--color-border-on-strong-background-secondary)}.select-host--background-translucent.sc-ds-select-multi-h{--ds-select-fg:var(--color-translucent-foreground-secondary);--ds-select-fg-active:var(--color-translucent-foreground-primary);--ds-select-border:var(--color-translucent-border-secondary)}.select-host--background-inverted.sc-ds-select-multi-h{--ds-select-fg:var(--color-inverted-foreground-secondary);--ds-select-fg-active:var(--color-inverted-foreground-primary);--ds-select-border:var(--color-inverted-border-secondary)}.select-host--background-media.sc-ds-select-multi-h{--ds-select-fg:var(--color-media-foreground-secondary);--ds-select-fg-active:var(--color-media-foreground-primary);--ds-select-border:var(--color-media-border-secondary)}.select-host--background-always-dark.sc-ds-select-multi-h{--ds-select-fg:var(--color-always-dark-foreground-secondary);--ds-select-fg-active:var(--color-always-dark-foreground-primary);--ds-select-border:var(--color-always-dark-border-secondary)}`;const T={md:"md",sm:"sm",xs:"xs"};let P=0;const q=8;const E=e(class e extends t{constructor(e){super();if(e!==false){this.__registerHost()}this.dsChange=s(this,"dsChange");this.dsClear=s(this,"dsClear");this.dsOpenChange=s(this,"dsOpenChange");this.internals=this.attachInternals();this.options=[];this.sections=[];this.values=[];this.open=false;this.disabled=false;this.required=false;this.requiredMessage=A;this.placeholder="Select";this.size="md";this.width="hug";this.isInactive=false;this.isLoading=false;this.activeFill=true;this.hasBorder=true;this.allowClear=true;this.clearLabel="Clear";this.selectedLabel="selected";this.searchable=false;this.searchPlaceholder="Search";this.noResultsText="No results found";this.loadingLabel="Loading";this.error=false;this.ariaLabel=null;this.activeIndex=-1;this.searchTerm="";this.formDisabled=false;this.position={x:0,y:0};this.positionReady=false;this.focusRingVisible=false;this.generatedId=`ds-select-multi-${++P}`;this.listboxId=`${this.generatedId}-listbox`;this.errorId=`${this.generatedId}-error`;this.triggerEl=null;this.popupEl=null;this.searchEl=null;this.initialValues=[];this.typeahead="";this.typeaheadTimer=null;this.outsideHandler=null;this.repositionHandler=null;this.positionRetryRaf=null;this.clearSelection=e=>{e.preventDefault();e.stopPropagation();this.values=[];this.dsChange.emit([]);this.dsClear.emit();requestAnimationFrame((()=>this.searchable?this.searchEl?.focus():this.triggerEl?.focus()))};this.handleTriggerKeyDown=e=>{if(!this.open){if(["ArrowDown","ArrowUp","Enter"," "].includes(e.key)){e.preventDefault();this.openPopup(true,e.key==="ArrowUp"?"last":"first")}else if(e.key.length===1&&!e.metaKey&&!e.ctrlKey&&!e.altKey){e.preventDefault();this.openPopup(true);if(this.searchable)this.searchTerm=e.key;else this.handleTypeahead(e.key)}return}this.handleListKeyDown(e)}}componentWillLoad(){this.initialValues=[...this.values];this.syncFormValue()}componentDidLoad(){if(this.open)this.onOpenChange(true)}disconnectedCallback(){this.cancelPositionRetry();this.unbindPopupListeners();if(this.typeaheadTimer)clearTimeout(this.typeaheadTimer)}syncFormValue(){const e=this.resolvedValues;if(this.isDisabled||!this.name||e.length===0){this.internals.setFormValue(null)}else{const t=new FormData;e.forEach((e=>t.append(this.name,e)));this.internals.setFormValue(t,JSON.stringify(e))}const t=this.required&&!this.isDisabled&&e.length===0;D(this.internals,t,this.requiredMessage);if(this.open){const e=u(this.visibleOptions);if(!e.includes(this.activeIndex))this.activeIndex=e[0]??-1;requestAnimationFrame((()=>this.updatePosition()))}}onLoadingChange(){if(this.open)requestAnimationFrame((()=>this.updatePosition()))}onOpenChange(e){this.dsOpenChange.emit(e);if(e){this.bindPopupListeners();this.schedulePositionUpdate((()=>{this.scrollActiveOptionIntoView();if(this.searchable)this.searchEl?.focus()}))}else{this.cancelPositionRetry();this.unbindPopupListeners();this.searchTerm="";this.positionReady=false}}onSearchTermChange(){this.activeIndex=u(this.visibleOptions)[0]??-1;requestAnimationFrame((()=>{this.updatePosition();this.scrollActiveOptionIntoView()}))}onActiveIndexChange(){requestAnimationFrame((()=>this.scrollActiveOptionIntoView()))}formDisabledCallback(e){this.formDisabled=e;this.syncFormValue()}formResetCallback(){this.values=[...this.initialValues];this.closePopup()}formStateRestoreCallback(e){if(typeof e!=="string"){this.values=[];return}try{const t=JSON.parse(e);this.values=Array.isArray(t)?t.filter((e=>typeof e==="string")):[]}catch{this.values=[]}}async setFocus(){this.triggerEl?.focus()}get isDisabled(){return this.disabled||this.isInactive||this.formDisabled}get allSections(){return m(this.options,this.sections)}get allOptions(){return g(this.allSections)}get visibleSections(){return this.searchable?p(this.allSections,this.searchTerm):this.allSections}get visibleOptions(){return g(this.visibleSections)}get resolvedValues(){const e=new Set(this.allOptions.map((e=>e.value)));return[...new Set(this.values.filter((t=>e.has(t))))]}get hasSelection(){return this.resolvedValues.length>0}get activeOptionId(){return!this.isLoading&&this.activeIndex>=0?`${this.generatedId}-option-${this.activeIndex}`:undefined}scrollActiveOptionIntoView(){if(!this.open||!this.activeOptionId)return;this.el.querySelector(`#${this.activeOptionId}`)?.scrollIntoView({block:"nearest",inline:"nearest"})}bindPopupListeners(){this.unbindPopupListeners();this.outsideHandler=e=>{if(this.el.contains(e.target))return;this.closePopup()};this.repositionHandler=()=>this.updatePosition();document.addEventListener("mousedown",this.outsideHandler,true);window.addEventListener("scroll",this.repositionHandler,true);window.addEventListener("resize",this.repositionHandler)}unbindPopupListeners(){if(this.outsideHandler){document.removeEventListener("mousedown",this.outsideHandler,true);this.outsideHandler=null}if(this.repositionHandler){window.removeEventListener("scroll",this.repositionHandler,true);window.removeEventListener("resize",this.repositionHandler);this.repositionHandler=null}}cancelPositionRetry(){if(this.positionRetryRaf!==null){cancelAnimationFrame(this.positionRetryRaf);this.positionRetryRaf=null}}schedulePositionUpdate(e){if(!this.open)return;this.cancelPositionRetry();this.positionReady=false;let t=q;const s=()=>{this.positionRetryRaf=null;if(!this.open)return;if(this.updatePosition()){e?.();return}if(t>0){t-=1;this.positionRetryRaf=requestAnimationFrame(s)}};this.positionRetryRaf=requestAnimationFrame(s)}updatePosition(){if(!this.open||!this.triggerEl||!this.popupEl||!this.popupEl.isConnected||!this.el.contains(this.popupEl))return false;const e=V(L.space050,L.space050);this.popupEl.style.minWidth=`${n(this.triggerEl.offsetWidth,e)}px`;this.position=c({anchorRect:this.triggerEl.getBoundingClientRect(),popupWidth:this.popupEl.offsetWidth,popupHeight:this.popupEl.offsetHeight,side:"bottom",align:"start",sideOffsetPx:e,alignOffsetPx:l({align:"start",alignOffsetPx:0,sectionInsetPx:e}),viewportPadPx:e,viewportWidth:window.innerWidth,viewportHeight:window.innerHeight});this.positionReady=true;return true}openPopup(e,t){if(this.isDisabled||!this.allOptions.length&&!this.isLoading)return;const s=u(this.visibleOptions);this.activeIndex=t==="last"?s[s.length-1]??-1:s[0]??-1;this.focusRingVisible=e;this.open=true}closePopup(e=false){if(!this.open)return;this.open=false;if(e)requestAnimationFrame((()=>this.triggerEl?.focus()))}toggleOption(e){if(e.isInactive||this.isLoading)return;const t=this.resolvedValues;const s=t.includes(e.value)?t.filter((t=>t!==e.value)):[...t,e.value];this.values=s;this.dsChange.emit([...s])}handleTypeahead(e){if(this.typeaheadTimer)clearTimeout(this.typeaheadTimer);this.focusRingVisible=true;const t=e.toLocaleLowerCase();const s=this.typeahead.length>0&&[...this.typeahead].every((e=>e===t));this.typeahead=s?t:`${this.typeahead}${t}`;const i=f(this.visibleOptions,this.typeahead,this.activeIndex);if(i>=0)this.activeIndex=i;const r=I(L.animationDurationMedium1,L.animationDurationMedium1);this.typeaheadTimer=setTimeout((()=>{this.typeahead="";this.typeaheadTimer=null}),r)}handleListKeyDown(e){switch(e.key){case"ArrowDown":e.preventDefault();this.focusRingVisible=true;this.activeIndex=v(this.visibleOptions,this.activeIndex,1);break;case"ArrowUp":e.preventDefault();this.focusRingVisible=true;this.activeIndex=v(this.visibleOptions,this.activeIndex,-1);break;case"Home":e.preventDefault();this.focusRingVisible=true;this.activeIndex=u(this.visibleOptions)[0]??-1;break;case"End":{e.preventDefault();this.focusRingVisible=true;const t=u(this.visibleOptions);this.activeIndex=t[t.length-1]??-1;break}case"Enter":case" ":{if(e.key===" "&&this.searchable&&e.target===this.searchEl)break;e.preventDefault();const t=this.visibleOptions[this.activeIndex];if(t)this.toggleOption(t);break}case"Escape":e.preventDefault();this.closePopup(true);break;case"Tab":this.closePopup();break;default:if(!this.searchable&&e.key.length===1&&!e.metaKey&&!e.ctrlKey&&!e.altKey){this.handleTypeahead(e.key)}}}renderOption(e,t,s){const r=this.values.includes(e.value);const o=this.activeIndex===t;return i(a,{id:`${this.generatedId}-option-${t}`,option:e,selected:r,active:o,focusRingVisible:this.focusRingVisible,usesSubtext:s,leading:i("span",{class:"ds-choice-item__icon ds-interaction-fill__content","aria-hidden":"true"},i("ds-checkbox",{class:"select-option__checkbox",label:"",size:"md",checked:r,presentation:true})),onHover:()=>{this.focusRingVisible=false;this.activeIndex=t},onSelect:()=>this.toggleOption(e)})}render(){const e=this.isDisabled;const t=this.resolvedValues.length;const s=$[this.size];const o=T[this.size];const n=b(this.allOptions);const c=this.error&&Boolean(this.errorMessage);const l=[this.ariaDescribedby,c?this.errorId:undefined].filter(Boolean).join(" ")||undefined;const a={position:"fixed",left:"0",top:"0",transform:`translate(${Math.round(this.position.x)}px, ${Math.round(this.position.y)}px)`,zIndex:"var(--dimension-z-index-floating)",visibility:this.positionReady?"visible":"hidden"};let u=0;return i(r,{key:"5bb5dee514d53580e7b21a5cb50c247cc2f62ada",class:{"select-host":true,"ds-control-inactive":e,"ds-control--md":this.size==="md","ds-control--sm":this.size==="sm","ds-control--xs":this.size==="xs",...O(this.width),[`select-host--background-${this.background}`]:!!this.background}},i("button",{key:"3d9fbf2783839c2eed24dc8ad4dc3f79054e017b",ref:e=>{this.triggerEl=e??null},id:this.inputId??this.generatedId,type:"button",class:{trigger:true,"ds-focus-ring-inset":true,"ds-interaction-fill":true,"ds-interaction-fill--selected":!e&&this.activeFill&&this.hasSelection,"trigger--bordered":this.hasBorder||this.error,"trigger--has-value":this.hasSelection,"wrapper--error":this.error,[`ds-control--${this.size}`]:true,...y(this.background)},disabled:e,role:"combobox","aria-haspopup":"listbox","aria-expanded":String(this.open),"aria-controls":this.open?this.listboxId:undefined,"aria-activedescendant":this.open&&!this.searchable?this.activeOptionId:undefined,"aria-label":this.ariaLabel,"aria-labelledby":this.ariaLabelledby,"aria-describedby":l,"aria-invalid":this.error?"true":undefined,"aria-required":this.required||undefined,"aria-busy":this.isLoading?"true":undefined,onClick:()=>this.open?this.closePopup():this.openPopup(false),onKeyDown:this.handleTriggerKeyDown},(this.icon||this.isLoading)&&i("span",{key:"b88719f161ca9b90185f7e5a8c0d630acff25ab1",class:"trigger__prefix ds-interaction-fill__content","aria-hidden":"true"},this.isLoading?i("ds-loader",{size:o,color:"inherit"}):i("ds-icon",{name:this.icon,size:o,color:"inherit"})),i("ds-text",{key:"a6aef154d4d577dfdea6df2a8d8edd695493f8ca",class:"trigger__label ds-interaction-fill__content",as:"span",variant:s,color:"inherit",lineTruncation:1},`${this.placeholder}${t>0?` · ${t}`:""}`),i("span",{key:"c3a08976c6a65afc9fba37ad3df942686f66eebc",class:"trigger__chevron ds-interaction-fill__content","aria-hidden":"true"},i("ds-icon",{key:"d245ecafb9aee5e3a357839d4b6a7cc155fcadb9",name:"ChevronDown",size:o,color:"inherit"}))),this.open&&i("div",{key:"d5bac77d9e2bfa0c23a77157048ae2057963fe59",ref:e=>{this.popupEl=e??null},class:"select-popup ds-choice-popup",style:a},this.searchable&&i(d,{key:"65ce1fbbd6225c0318c2666aefae84ddfb8f0f9f",value:this.searchTerm,placeholder:this.searchPlaceholder,controls:this.listboxId,activeDescendant:this.activeOptionId,inputRef:e=>{this.searchEl=e},clearLabel:this.clearLabel,onValueChange:e=>{this.searchTerm=e},onKeyDown:e=>this.handleListKeyDown(e)}),i("div",{key:"2152419f19c3d5ec3004e2e3353d4cabcac37d91",id:this.listboxId,class:"ds-choice-list",role:"listbox","aria-multiselectable":"true","aria-label":this.ariaLabel??this.placeholder,"aria-busy":this.isLoading?"true":undefined},this.isLoading?i("div",{class:"ds-choice-loading",role:"option","aria-selected":"false","aria-disabled":"true","aria-label":this.loadingLabel,"aria-live":"polite"},i("ds-loader",{size:"md",color:"inherit"})):this.visibleOptions.length===0?i("div",{class:"ds-choice-empty",role:"option","aria-selected":"false","aria-disabled":"true","aria-label":this.noResultsText,"aria-live":"polite"},i("ds-empty-state",{body:this.noResultsText})):this.visibleSections.map((e=>i("div",{class:{"ds-choice-section":true,"ds-choice-section--divided":!!e.divider},role:e.header?"group":undefined,"aria-label":e.header},e.header&&i("ds-text",{class:"ds-choice-section__header ds-control--md",as:"span",variant:"text-body-small",emphasis:true,color:"primary","aria-hidden":"true"},e.header),e.options.map((e=>this.renderOption(e,u++,n))))))),this.allowClear&&this.hasSelection&&!this.isLoading&&i(h,{key:"f01ca9b0d5cd1e0a69d8d9c9b8f30cac57a484a0",summary:`${t} ${this.selectedLabel}`,clearLabel:this.clearLabel,onClear:this.clearSelection})),c&&i("ds-text",{key:"91a41c779a0199e257ed5b4dc8c8e9d9e3143232",class:"error-text",as:"div",variant:"text-body-small",color:"negative",textId:this.errorId,role:"alert"},this.errorMessage))}static get formAssociated(){return true}get el(){return this}static get watchers(){return{values:[{syncFormValue:0}],disabled:[{syncFormValue:0}],isInactive:[{syncFormValue:0}],required:[{syncFormValue:0}],name:[{syncFormValue:0}],options:[{syncFormValue:0}],sections:[{syncFormValue:0}],isLoading:[{onLoadingChange:0}],open:[{onOpenChange:0}],searchTerm:[{onSearchTermChange:0}],activeIndex:[{onActiveIndexChange:0}]}}static get style(){return S()}},[66,"ds-select-multi",{options:[16],sections:[16],values:[1040],open:[1540],name:[513],disabled:[516],required:[516],requiredMessage:[1,"required-message"],placeholder:[1],size:[1],width:[1],isInactive:[4,"is-inactive"],isLoading:[4,"is-loading"],activeFill:[4,"active-fill"],hasBorder:[4,"has-border"],icon:[1],allowClear:[4,"allow-clear"],clearLabel:[1,"clear-label"],selectedLabel:[1,"selected-label"],searchable:[4],searchPlaceholder:[1,"search-placeholder"],noResultsText:[1,"no-results-text"],loadingLabel:[1,"loading-label"],background:[1],error:[4],errorMessage:[1,"error-message"],inputId:[1,"input-id"],ariaLabel:[1,"aria-label"],ariaLabelledby:[1,"aria-labelledby"],ariaDescribedby:[1,"aria-describedby"],activeIndex:[32],searchTerm:[32],formDisabled:[32],position:[32],positionReady:[32],focusRingVisible:[32],setFocus:[64]},undefined,{values:[{syncFormValue:0}],disabled:[{syncFormValue:0}],isInactive:[{syncFormValue:0}],required:[{syncFormValue:0}],name:[{syncFormValue:0}],options:[{syncFormValue:0}],sections:[{syncFormValue:0}],isLoading:[{onLoadingChange:0}],open:[{onOpenChange:0}],searchTerm:[{onSearchTermChange:0}],activeIndex:[{onActiveIndexChange:0}]}]);function B(){if(typeof customElements==="undefined"){return}const e=["ds-select-multi","ds-badge","ds-button-unfilled","ds-checkbox","ds-empty-state","ds-icon","ds-loader","ds-text","ds-tooltip"];e.forEach((e=>{switch(e){case"ds-select-multi":if(!customElements.get(o(e))){customElements.define(o(e),E)}break;case"ds-badge":if(!customElements.get(o(e))){x()}break;case"ds-button-unfilled":if(!customElements.get(o(e))){w()}break;case"ds-checkbox":if(!customElements.get(o(e))){k()}break;case"ds-empty-state":if(!customElements.get(o(e))){_()}break;case"ds-icon":if(!customElements.get(o(e))){z()}break;case"ds-loader":if(!customElements.get(o(e))){C()}break;case"ds-text":if(!customElements.get(o(e))){F()}break;case"ds-tooltip":if(!customElements.get(o(e))){j()}break}}))}B();const R=E;const M=B;export{R as DsSelectMulti,M as defineCustomElement};
|
|
1
|
+
import{p as e,H as t,c as s,h as i,a as r,t as o}from"./index.js";import{c as n,a as c,r as l}from"./p-CydY-v7X.js";import{a,C as d,b as h}from"./p-DbpfpeQT.js";import{e as u,r as m,f as g,a as p,b as f,m as v,d as b,g as y}from"./p-BhC1YyId.js";import{d as x}from"./p-CaRyxTMz.js";import{d as w}from"./p-DPME1wUJ.js";import{d as k}from"./p-CiqnkENu.js";import{d as _}from"./p-BY0PzkUp.js";import{d as z}from"./p-BAfG3M8z.js";import{d as C}from"./p-Ca-I2UnB.js";import{d as F}from"./p-BwGnhInj.js";import{d as j}from"./p-DWdRSOBV.js";import{D as A,s as V}from"./p-BgGP65Nn.js";import{r as I}from"./p-BJMRBHKW.js";import{r as L,T as $}from"./p-Dg3xLna0.js";import{C as D}from"./p-Cx-ywr1e.js";import{c as O}from"./p-DuFm-ieS.js";const S=()=>`.sc-ds-select-multi-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-select-multi-h,.ds-focus-ring.sc-ds-select-multi,.ds-focus-ring-inset.sc-ds-select-multi-h,.ds-focus-ring-inset.sc-ds-select-multi{outline:none;-webkit-tap-highlight-color:transparent;touch-action:manipulation}.ds-focus-ring.sc-ds-select-multi-h:focus-visible,.ds-focus-ring.sc-ds-select-multi: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-select-multi-h,.ds-focus-ring.ds-focus-ring--visible.sc-ds-select-multi{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-select-multi-h:focus-visible,.ds-focus-ring-inset.sc-ds-select-multi:focus-visible{outline:none}.ds-focus-ring-inset.sc-ds-select-multi-h:focus-visible::after,.ds-focus-ring-inset.sc-ds-select-multi: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-select-multi-h,.ds-focus-ring-inset.ds-focus-ring--visible.sc-ds-select-multi{outline:none}.ds-focus-ring-inset.ds-focus-ring--visible.sc-ds-select-multi-h::after,.ds-focus-ring-inset.ds-focus-ring--visible.sc-ds-select-multi::after{outline:var(--ds-focus-ring-width) solid var(--ds-focus-ring-color);outline-offset:calc(-1 * var(--ds-focus-ring-width))}.ds-interaction-fill.sc-ds-select-multi-h,.ds-interaction-fill.sc-ds-select-multi{position:relative;z-index:0;cursor:default;--ds-interaction-hover:var(--color-interaction-hover);--ds-interaction-pressed:var(--color-interaction-pressed);--ds-interaction-active:var(--color-interaction-active-brand);--ds-interaction-border-width:0px;--ds-interaction-border-color:transparent}.ds-interaction-fill.sc-ds-select-multi-h::before,.ds-interaction-fill.sc-ds-select-multi::before,.ds-interaction-fill.sc-ds-select-multi-h::after,.ds-interaction-fill.sc-ds-select-multi::after{content:'';position:absolute;inset:0;border-radius:inherit;background:transparent;pointer-events:none;cursor:inherit;transition:none}.ds-interaction-fill.sc-ds-select-multi-h::before,.ds-interaction-fill.sc-ds-select-multi::before{z-index:1}.ds-interaction-fill.sc-ds-select-multi-h::after,.ds-interaction-fill.sc-ds-select-multi::after{z-index:3;box-shadow:inset 0 0 0 var(--ds-interaction-border-width) var(--ds-interaction-border-color)}.ds-interaction-fill--bordered.sc-ds-select-multi-h,.ds-interaction-fill--bordered.sc-ds-select-multi{--ds-interaction-border-width:var(--dimension-stroke-width-012);--ds-interaction-border-color:var(--color-border-secondary)}.ds-interaction-fill--selected.sc-ds-select-multi-h::before,.ds-interaction-fill--selected.sc-ds-select-multi::before{background:var(--ds-interaction-active)}.ds-interaction-fill--selected.sc-ds-select-multi-h,.ds-interaction-fill--selected.sc-ds-select-multi{--ds-interaction-dot-ring:var(--ds-interaction-active)}@media (hover: hover) and (pointer: fine){.ds-interaction-fill.sc-ds-select-multi-h:hover:not(:disabled)::after,.ds-interaction-fill.sc-ds-select-multi:hover:not(:disabled)::after{background:var(--ds-interaction-hover)}}.ds-interaction-fill.sc-ds-select-multi-h:active:not(:disabled)::after,.ds-interaction-fill.sc-ds-select-multi:active:not(:disabled)::after{background:var(--ds-interaction-pressed)}.ds-interaction-fill.sc-ds-select-multi-h>.ds-interaction-fill__content.sc-ds-select-multi,.ds-interaction-fill.sc-ds-select-multi>.ds-interaction-fill__content.sc-ds-select-multi,.ds-interaction-fill__content.sc-ds-select-multi{position:relative;z-index:2;cursor:inherit}.ds-interaction-fill--on-faint.sc-ds-select-multi-h,.ds-interaction-fill--on-faint.sc-ds-select-multi{--ds-interaction-active:var(--color-interaction-active)}.ds-interaction-fill--on-medium.sc-ds-select-multi-h,.ds-interaction-fill--on-medium.sc-ds-select-multi{--ds-interaction-hover:var(--color-interaction-on-medium-background-hover);--ds-interaction-pressed:var(--color-interaction-on-medium-background-pressed);--ds-interaction-active:var(--color-interaction-on-medium-background-active);--ds-focus-ring-color:var(--color-interaction-on-medium-background-focus)}.ds-interaction-fill--on-bold.sc-ds-select-multi-h,.ds-interaction-fill--on-bold.sc-ds-select-multi{--ds-interaction-hover:var(--color-interaction-on-bold-background-hover);--ds-interaction-pressed:var(--color-interaction-on-bold-background-pressed);--ds-interaction-active:var(--color-interaction-on-bold-background-active);--ds-focus-ring-color:var(--color-interaction-on-bold-background-focus)}.ds-interaction-fill--on-strong.sc-ds-select-multi-h,.ds-interaction-fill--on-strong.sc-ds-select-multi{--ds-interaction-hover:var(--color-interaction-on-strong-background-hover);--ds-interaction-pressed:var(--color-interaction-on-strong-background-pressed);--ds-interaction-active:var(--color-interaction-on-strong-background-active);--ds-focus-ring-color:var(--color-interaction-on-strong-background-focus)}.ds-interaction-fill--on-translucent.sc-ds-select-multi-h,.ds-interaction-fill--on-translucent.sc-ds-select-multi{--ds-interaction-hover:var(--color-translucent-interaction-hover);--ds-interaction-pressed:var(--color-translucent-interaction-pressed);--ds-interaction-active:var(--color-translucent-interaction-active);--ds-focus-ring-color:var(--color-translucent-interaction-focus)}.ds-interaction-fill--on-inverted.sc-ds-select-multi-h,.ds-interaction-fill--on-inverted.sc-ds-select-multi{--ds-interaction-hover:var(--color-inverted-interaction-hover);--ds-interaction-pressed:var(--color-inverted-interaction-pressed);--ds-interaction-active:var(--color-inverted-interaction-active);--ds-focus-ring-color:var(--color-inverted-interaction-focus)}.ds-interaction-fill--on-media.sc-ds-select-multi-h,.ds-interaction-fill--on-media.sc-ds-select-multi{--ds-interaction-hover:var(--color-media-interaction-hover);--ds-interaction-pressed:var(--color-media-interaction-pressed);--ds-interaction-active:var(--color-media-interaction-active);--ds-focus-ring-color:var(--color-media-interaction-focus)}.ds-interaction-fill--on-always-dark.sc-ds-select-multi-h,.ds-interaction-fill--on-always-dark.sc-ds-select-multi{--ds-interaction-hover:var(--color-always-dark-interaction-hover);--ds-interaction-pressed:var(--color-always-dark-interaction-pressed);--ds-interaction-active:var(--color-always-dark-interaction-active);--ds-focus-ring-color:var(--color-always-dark-interaction-focus)}.ds-interaction-fill--on-navigation.sc-ds-select-multi-h,.ds-interaction-fill--on-navigation.sc-ds-select-multi{--ds-interaction-hover:var(--color-navigation-interaction-hover);--ds-interaction-pressed:var(--color-navigation-interaction-pressed);--ds-interaction-active:var(--color-navigation-interaction-active);--ds-focus-ring-color:var(--color-navigation-interaction-focus)}.ds-control-inactive.sc-ds-select-multi-h,.ds-control-inactive.sc-ds-select-multi{opacity:0.5;pointer-events:none;cursor:not-allowed}.ds-control--lg.sc-ds-select-multi,.ds-control--lg.sc-ds-select-multi-h,.ds-control--md.sc-ds-select-multi-h,.ds-control--md.sc-ds-select-multi,.ds-control--sm.sc-ds-select-multi-h,.ds-control--sm.sc-ds-select-multi,.ds-control--xs.sc-ds-select-multi-h,.ds-control--xs.sc-ds-select-multi{--ds-control-radius:var(--dimension-radius-025)}.ds-control--lg.sc-ds-select-multi-h,.ds-control--lg.sc-ds-select-multi{--ds-control-height:var(--dimension-size-500);--ds-control-icon:var(--dimension-iconography-lg);--ds-control-padding-inline:var(--dimension-space-100);--ds-control-label-inset:var(--dimension-space-050);--ds-control-gap:var(--dimension-space-050)}.ds-control--md.sc-ds-select-multi-h,.ds-control--md.sc-ds-select-multi{--ds-control-height:var(--dimension-size-400);--ds-control-icon:var(--dimension-iconography-md);--ds-control-padding-inline:var(--dimension-space-075);--ds-control-label-inset:var(--dimension-space-025);--ds-control-gap:var(--dimension-space-050)}.ds-control--sm.sc-ds-select-multi-h,.ds-control--sm.sc-ds-select-multi{--ds-control-height:var(--dimension-size-300);--ds-control-icon:var(--dimension-iconography-sm);--ds-control-padding-inline:var(--dimension-space-050);--ds-control-label-inset:var(--dimension-space-025);--ds-control-gap:var(--dimension-space-025)}.ds-control--xs.sc-ds-select-multi-h,.ds-control--xs.sc-ds-select-multi{--ds-control-height:var(--dimension-size-200);--ds-control-icon:var(--dimension-iconography-xs);--ds-control-padding-inline:var(--dimension-space-025);--ds-control-label-inset:var(--dimension-space-025);--ds-control-gap:0}.ds-choice-popup.sc-ds-select-multi{box-sizing:border-box;display:flex;flex-direction:column;min-width:var(--dimension-menu-width-xs);max-width:min( var(--dimension-panel-width-lg), calc(100vw - var(--dimension-space-200)) );max-height:calc(100vh - var(--dimension-space-200));overflow:hidden;inset:auto;margin:0;padding:0;border:0;background-color:var(--color-background-primary);border-radius:var(--dimension-radius-075);box-shadow:var(--effect-shadow-elevated-floating);animation:dsChoiceFadeIn var(--effect-motion-short-2) forwards;backface-visibility:hidden;will-change:transform;text-align:start}.ds-choice-popup.sc-ds-select-multi::after{content:'';position:absolute;inset:0;border-radius:inherit;pointer-events:none;box-shadow:var(--effect-highlight-elevated-floating)}.ds-choice-popup--closing.sc-ds-select-multi{animation:dsChoiceFadeOut var(--effect-motion-short-2) forwards}@keyframes dsChoiceFadeIn{from{opacity:0;transform:inherit scale(0.97)}to{opacity:1}}@keyframes dsChoiceFadeOut{from{opacity:1}to{opacity:0}}@media (prefers-reduced-motion: reduce){.ds-choice-popup.sc-ds-select-multi{animation:none;opacity:1}.ds-choice-popup--closing.sc-ds-select-multi{opacity:0}}.ds-choice-list.sc-ds-select-multi{display:flex;flex-direction:column;min-height:0;overflow-y:auto;overscroll-behavior:contain}.ds-choice-section.sc-ds-select-multi{display:flex;flex-direction:column;gap:var(--dimension-space-050);padding:var(--dimension-space-050)}.ds-choice-section--divided.sc-ds-select-multi{border-bottom:var(--dimension-stroke-width-015) solid var(--color-border-tertiary)}ds-text.ds-choice-section__header.sc-ds-select-multi{display:flex;align-items:center;box-sizing:border-box;height:var(--ds-control-height, var(--dimension-size-400));padding:0 calc( var(--ds-control-padding-inline, var(--dimension-space-075)) + var(--ds-control-label-inset, var(--dimension-space-025)) );text-align:start;-webkit-user-select:none;user-select:none}.ds-choice-item.sc-ds-select-multi{display:flex;align-items:center;gap:var(--ds-control-gap, var(--dimension-space-050));width:100%;height:var(--ds-control-height, var(--dimension-size-400));padding:0 var(--ds-control-padding-inline, var(--dimension-space-075));box-sizing:border-box;border:none;border-radius:var(--ds-control-radius, var(--dimension-radius-025));background:transparent;cursor:default;-webkit-user-select:none;user-select:none;text-align:left;color:inherit}.ds-choice-item.sc-ds-select-multi:has(.ds-choice-item__subtext){height:auto;min-height:var(--ds-control-height, var(--dimension-size-400));padding-block:var(--ds-control-padding-inline, var(--dimension-space-075));align-items:flex-start}.ds-choice-item__content.sc-ds-select-multi{display:flex;flex:1;flex-direction:column;gap:var(--dimension-space-025);min-width:0}ds-text.ds-choice-item__label.sc-ds-select-multi,.ds-choice-item__subtext.sc-ds-select-multi,ds-text.ds-choice-item__subtext.sc-ds-select-multi{padding:0 var(--ds-control-label-inset, var(--dimension-space-025))}ds-text.ds-choice-item__label.sc-ds-select-multi{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}ds-text.ds-choice-item__subtext.sc-ds-select-multi{display:-webkit-box;overflow:hidden;white-space:normal;-webkit-box-orient:vertical;-webkit-line-clamp:2}.ds-choice-item__icon.sc-ds-select-multi,.ds-choice-item__suffix.sc-ds-select-multi{display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;width:var(--ds-control-icon, var(--dimension-iconography-md));height:var(--ds-control-icon, var(--dimension-iconography-md));pointer-events:none}.ds-choice-empty.sc-ds-select-multi,.ds-choice-loading.sc-ds-select-multi{display:flex;align-items:center;justify-content:center;box-sizing:border-box;min-height:var(--dimension-size-600);padding:var(--dimension-space-100)}.ds-choice-footer.sc-ds-select-multi{position:relative;box-sizing:border-box;padding-block:var(--dimension-space-050)}.ds-choice-footer.sc-ds-select-multi::before{content:'';position:absolute;inset:0 0 auto;height:var(--dimension-stroke-width-012);background-color:var(--color-border-tertiary);pointer-events:none}.ds-choice-footer__content.sc-ds-select-multi{display:flex;align-items:center;justify-content:space-between;box-sizing:border-box;height:var(--dimension-size-400)}.ds-choice-footer__summary.sc-ds-select-multi,.ds-choice-footer__clear.sc-ds-select-multi ds-text.sc-ds-select-multi{padding-inline:calc( var(--dimension-space-050) + var(--ds-control-padding-inline, var(--dimension-space-075)) + var(--ds-control-label-inset, var(--dimension-space-025)) )}.ds-choice-footer__clear.sc-ds-select-multi{appearance:none;display:inline-flex;align-items:center;padding:0;border:0;border-radius:var(--dimension-radius-025);background:transparent;color:var(--color-foreground-bold-brand);cursor:default}.ds-choice-footer__clear.sc-ds-select-multi:hover{text-decoration:underline;text-decoration-color:var(--color-foreground-tertiary)}.ds-control-width--hug.sc-ds-select-multi-h,.ds-control-width--hug.sc-ds-select-multi{width:fit-content;max-width:100%;flex:0 0 auto;align-self:flex-start}.ds-control-width--fill.sc-ds-select-multi-h,.ds-control-width--fill.sc-ds-select-multi{width:100%;min-width:0;flex:1 1 auto;align-self:stretch}.select-search.sc-ds-select-multi{position:relative;box-sizing:border-box;padding:var(--dimension-space-050);background:transparent}.select-search.sc-ds-select-multi::after{content:'';position:absolute;inset:auto 0 0;height:var(--dimension-stroke-width-012);background-color:var(--color-border-tertiary);pointer-events:none}.select-search.sc-ds-select-multi:focus-within::after{height:var(--dimension-stroke-width-018);background-color:var(--color-border-bold-brand)}.select-search__control.sc-ds-select-multi{display:flex;align-items:center;box-sizing:border-box;gap:var(--ds-control-gap, var(--dimension-space-050));height:var(--ds-control-height, var(--dimension-size-400));padding:0 var(--ds-control-padding-inline, var(--dimension-space-075));border:0;border-radius:var(--ds-control-radius, var(--dimension-radius-025))}.select-search__control.sc-ds-select-multi:has(.select-search__clear){padding-right:0}.select-search__control.sc-ds-select-multi>ds-icon.sc-ds-select-multi{flex-shrink:0;color:var(--color-foreground-secondary)}.select-search.sc-ds-select-multi .select-search__control.sc-ds-select-multi .select-search__clear.sc-ds-select-multi{align-self:center;flex-shrink:0;margin-right:var(--dimension-space-050)}.select-search__control.sc-ds-select-multi input.sc-ds-select-multi{flex:1;min-width:0;height:100%;padding:0 var(--ds-control-label-inset, var(--dimension-space-025));border:0;outline:none;background:transparent;color:var(--color-foreground-primary);font-family:inherit}.select-search__control.sc-ds-select-multi input.sc-ds-select-multi::placeholder{color:var(--color-foreground-secondary)}.select-search__control.sc-ds-select-multi input.sc-ds-select-multi:focus::placeholder{color:var(--color-foreground-quaternary)}.select-search__control.sc-ds-select-multi input[type='search'].sc-ds-select-multi::-webkit-search-cancel-button,.select-search__control.sc-ds-select-multi input[type='search'].sc-ds-select-multi::-webkit-search-decoration{display:none}.ds-text--display-medium.sc-ds-select-multi-h,.ds-text--display-medium.sc-ds-select-multi{font-size:var(--typography-fontsize-3xl);line-height:var(--typography-lineheight-3xl)}.ds-text--display-small.sc-ds-select-multi-h,.ds-text--display-small.sc-ds-select-multi{font-size:var(--typography-fontsize-2xl);line-height:var(--typography-lineheight-2xl)}.ds-text--title-large.sc-ds-select-multi-h,.ds-text--title-large.sc-ds-select-multi{font-size:var(--typography-fontsize-xl);line-height:var(--typography-lineheight-xl)}.ds-text--title-medium.sc-ds-select-multi-h,.ds-text--title-medium.sc-ds-select-multi{font-size:var(--typography-fontsize-lg);line-height:var(--typography-lineheight-lg)}.ds-text--title-small.sc-ds-select-multi-h,.ds-text--title-small.sc-ds-select-multi{font-size:var(--typography-fontsize-md);line-height:var(--typography-lineheight-md)}.ds-text--body-large.sc-ds-select-multi-h,.ds-text--body-large.sc-ds-select-multi{font-size:var(--typography-fontsize-lg);line-height:var(--typography-lineheight-lg)}.ds-text--body-medium.sc-ds-select-multi-h,.ds-text--body-medium.sc-ds-select-multi{font-size:var(--typography-fontsize-md);line-height:var(--typography-lineheight-md)}.ds-text--body-small.sc-ds-select-multi-h,.ds-text--body-small.sc-ds-select-multi{font-size:var(--typography-fontsize-sm);line-height:var(--typography-lineheight-sm)}.ds-text--caption.sc-ds-select-multi-h,.ds-text--caption.sc-ds-select-multi{font-size:var(--typography-fontsize-xs);line-height:var(--typography-lineheight-xs);text-transform:uppercase}.ds-text--display-medium.ds-text--emphasis.sc-ds-select-multi-h,.ds-text--display-small.ds-text--emphasis.sc-ds-select-multi-h,.ds-text--display-medium.ds-text--emphasis.sc-ds-select-multi,.ds-text--display-small.ds-text--emphasis.sc-ds-select-multi{font-weight:var(--typography-weight-bold);letter-spacing:var(--typography-letterspacing-negative-double)}.ds-text--display-medium.ds-text--regular.sc-ds-select-multi-h,.ds-text--display-small.ds-text--regular.sc-ds-select-multi-h,.ds-text--display-medium.ds-text--regular.sc-ds-select-multi,.ds-text--display-small.ds-text--regular.sc-ds-select-multi{font-weight:var(--typography-weight-semibold);letter-spacing:var(--typography-letterspacing-negative)}.ds-text--title-large.ds-text--emphasis.sc-ds-select-multi-h,.ds-text--title-large.ds-text--emphasis.sc-ds-select-multi{font-weight:var(--typography-weight-semibold);letter-spacing:var(--typography-letterspacing-negative-double)}.ds-text--title-large.ds-text--regular.sc-ds-select-multi-h,.ds-text--title-large.ds-text--regular.sc-ds-select-multi{font-weight:var(--typography-weight-medium);letter-spacing:var(--typography-letterspacing-negative)}.ds-text--title-medium.ds-text--emphasis.sc-ds-select-multi-h,.ds-text--title-small.ds-text--emphasis.sc-ds-select-multi-h,.ds-text--title-medium.ds-text--emphasis.sc-ds-select-multi,.ds-text--title-small.ds-text--emphasis.sc-ds-select-multi{font-weight:var(--typography-weight-semibold);letter-spacing:var(--typography-letterspacing-negative)}.ds-text--title-medium.ds-text--regular.sc-ds-select-multi-h,.ds-text--title-small.ds-text--regular.sc-ds-select-multi-h,.ds-text--title-medium.ds-text--regular.sc-ds-select-multi,.ds-text--title-small.ds-text--regular.sc-ds-select-multi{font-weight:var(--typography-weight-medium);letter-spacing:var(--typography-letterspacing-negative-half)}.ds-text--body-large.ds-text--emphasis.sc-ds-select-multi-h,.ds-text--body-medium.ds-text--emphasis.sc-ds-select-multi-h,.ds-text--body-large.ds-text--emphasis.sc-ds-select-multi,.ds-text--body-medium.ds-text--emphasis.sc-ds-select-multi{font-weight:var(--typography-weight-medium);letter-spacing:var(--typography-letterspacing-negative)}.ds-text--body-large.ds-text--regular.sc-ds-select-multi-h,.ds-text--body-medium.ds-text--regular.sc-ds-select-multi-h,.ds-text--body-large.ds-text--regular.sc-ds-select-multi,.ds-text--body-medium.ds-text--regular.sc-ds-select-multi{font-weight:var(--typography-weight-regular);letter-spacing:var(--typography-letterspacing-negative-half)}.ds-text--body-small.ds-text--emphasis.sc-ds-select-multi-h,.ds-text--body-small.ds-text--emphasis.sc-ds-select-multi{font-weight:var(--typography-weight-medium);letter-spacing:var(--typography-letterspacing-negative-half)}.ds-text--body-small.ds-text--regular.sc-ds-select-multi-h,.ds-text--body-small.ds-text--regular.sc-ds-select-multi{font-weight:var(--typography-weight-regular);letter-spacing:var(--typography-letterspacing-none)}.ds-text--caption.ds-text--emphasis.sc-ds-select-multi-h,.ds-text--caption.ds-text--emphasis.sc-ds-select-multi{font-weight:var(--typography-weight-semibold);letter-spacing:var(--typography-letterspacing-positive)}.ds-text--caption.ds-text--regular.sc-ds-select-multi-h,.ds-text--caption.ds-text--regular.sc-ds-select-multi{font-weight:var(--typography-weight-medium);letter-spacing:var(--typography-letterspacing-positive)}.select-host.sc-ds-select-multi-h{display:inline-flex;flex-direction:column;gap:var(--dimension-space-050);position:relative;outline:none;--ds-select-fg:var(--color-foreground-secondary);--ds-select-fg-active:var(--color-foreground-primary);--ds-select-prefix-fg:var(--ds-select-fg);--ds-select-chevron-fg:var(--ds-select-fg);--ds-select-border:var(--color-border-secondary)}.ds-control-width--fill.sc-ds-select-multi-h,.ds-control-width--fill.sc-ds-select-multi-h .trigger.sc-ds-select-multi{width:100%}.trigger.sc-ds-select-multi{display:inline-flex;align-items:center;justify-content:flex-start;box-sizing:border-box;height:var(--ds-control-height, var(--dimension-size-400));padding:0 var(--ds-control-padding-inline, var(--dimension-space-075));gap:var(--ds-control-gap, var(--dimension-space-050));background:transparent;border:none;border-radius:var(--ds-control-radius, var(--dimension-radius-025));color:var(--ds-select-fg);cursor:default;font-family:inherit;-webkit-user-select:none;user-select:none;overflow:hidden;transition:color var(--effect-motion-short-2)}.trigger--bordered.sc-ds-select-multi{--ds-interaction-border-width:var(--dimension-stroke-width-012);--ds-interaction-border-color:var(--ds-select-border)}.trigger--has-value.sc-ds-select-multi .trigger__label.sc-ds-select-multi{color:var(--ds-select-fg-active)}.wrapper--error.sc-ds-select-multi{--ds-interaction-border-width:var(--dimension-stroke-width-018);--ds-interaction-border-color:var(--color-border-bold-negative)}.trigger__prefix.sc-ds-select-multi,.trigger__chevron.sc-ds-select-multi{position:relative;z-index:2;flex-shrink:0;width:var(--ds-control-icon, var(--dimension-iconography-md));height:var(--ds-control-icon, var(--dimension-iconography-md));display:inline-flex;align-items:center;justify-content:center}.trigger__prefix.sc-ds-select-multi{color:var(--ds-select-prefix-fg)}.trigger__chevron.sc-ds-select-multi{color:var(--ds-select-chevron-fg)}.trigger__label.sc-ds-select-multi{position:relative;z-index:2;flex:1 1 auto;min-width:0;padding:0 var(--ds-control-label-inset, var(--dimension-space-025));text-align:left;color:inherit;transition:color var(--effect-motion-short-2)}.select-popup.sc-ds-select-multi{color:var(--color-foreground-secondary)}.select-option[aria-selected='true'].sc-ds-select-multi .ds-choice-item__icon.sc-ds-select-multi{color:var(--color-foreground-primary)}.error-text.sc-ds-select-multi{width:100%}.select-host--background-medium.sc-ds-select-multi-h{--ds-select-fg:var(--color-foreground-on-medium-background-secondary);--ds-select-fg-active:var(--color-foreground-on-medium-background-primary);--ds-select-border:var(--color-border-on-medium-background-secondary)}.select-host--background-bold.sc-ds-select-multi-h{--ds-select-fg:var(--color-foreground-on-bold-background-secondary);--ds-select-fg-active:var(--color-foreground-on-bold-background-primary);--ds-select-border:var(--color-border-on-bold-background-secondary)}.select-host--background-strong.sc-ds-select-multi-h{--ds-select-fg:var(--color-foreground-on-strong-background-secondary);--ds-select-fg-active:var(--color-foreground-on-strong-background-primary);--ds-select-border:var(--color-border-on-strong-background-secondary)}.select-host--background-translucent.sc-ds-select-multi-h{--ds-select-fg:var(--color-translucent-foreground-secondary);--ds-select-fg-active:var(--color-translucent-foreground-primary);--ds-select-border:var(--color-translucent-border-secondary)}.select-host--background-inverted.sc-ds-select-multi-h{--ds-select-fg:var(--color-inverted-foreground-secondary);--ds-select-fg-active:var(--color-inverted-foreground-primary);--ds-select-border:var(--color-inverted-border-secondary)}.select-host--background-media.sc-ds-select-multi-h{--ds-select-fg:var(--color-media-foreground-secondary);--ds-select-fg-active:var(--color-media-foreground-primary);--ds-select-border:var(--color-media-border-secondary)}.select-host--background-always-dark.sc-ds-select-multi-h{--ds-select-fg:var(--color-always-dark-foreground-secondary);--ds-select-fg-active:var(--color-always-dark-foreground-primary);--ds-select-border:var(--color-always-dark-border-secondary)}`;const E={md:"md",sm:"sm",xs:"xs"};let P=0;const q=8;const T=e(class e extends t{constructor(e){super();if(e!==false){this.__registerHost()}this.dsChange=s(this,"dsChange");this.dsClear=s(this,"dsClear");this.dsOpenChange=s(this,"dsOpenChange");this.internals=this.attachInternals();this.options=[];this.sections=[];this.values=[];this.open=false;this.disabled=false;this.required=false;this.requiredMessage=A;this.placeholder="Select";this.size="md";this.width="hug";this.isInactive=false;this.isLoading=false;this.activeFill=true;this.hasBorder=true;this.allowClear=true;this.clearLabel="Clear";this.selectedLabel="selected";this.searchable=false;this.searchPlaceholder="Search";this.noResultsText="No results found";this.loadingLabel="Loading";this.error=false;this.ariaLabel=null;this.activeIndex=-1;this.searchTerm="";this.formDisabled=false;this.position={x:0,y:0};this.positionReady=false;this.focusRingVisible=false;this.generatedId=`ds-select-multi-${++P}`;this.listboxId=`${this.generatedId}-listbox`;this.errorId=`${this.generatedId}-error`;this.triggerEl=null;this.popupEl=null;this.searchEl=null;this.initialValues=[];this.typeahead="";this.typeaheadTimer=null;this.outsideHandler=null;this.repositionHandler=null;this.positionRetryRaf=null;this.clearSelection=e=>{e.preventDefault();e.stopPropagation();this.values=[];this.dsChange.emit([]);this.dsClear.emit();requestAnimationFrame((()=>this.searchable?this.searchEl?.focus():this.triggerEl?.focus()))};this.handleTriggerKeyDown=e=>{if(!this.open){if(["ArrowDown","ArrowUp","Enter"," "].includes(e.key)){e.preventDefault();this.openPopup(true,e.key==="ArrowUp"?"last":"first")}else if(e.key.length===1&&!e.metaKey&&!e.ctrlKey&&!e.altKey){e.preventDefault();this.openPopup(true);if(this.searchable)this.searchTerm=e.key;else this.handleTypeahead(e.key)}return}this.handleListKeyDown(e)}}componentWillLoad(){this.initialValues=[...this.values];this.syncFormValue()}componentDidLoad(){if(this.open)this.onOpenChange(true)}disconnectedCallback(){this.cancelPositionRetry();this.unbindPopupListeners();if(this.typeaheadTimer)clearTimeout(this.typeaheadTimer)}syncFormValue(){const e=this.resolvedValues;if(this.isDisabled||!this.name||e.length===0){this.internals.setFormValue(null)}else{const t=new FormData;e.forEach((e=>t.append(this.name,e)));this.internals.setFormValue(t,JSON.stringify(e))}const t=this.required&&!this.isDisabled&&e.length===0;V(this.internals,t,this.requiredMessage);if(this.open){const e=u(this.visibleOptions);if(!e.includes(this.activeIndex))this.activeIndex=e[0]??-1;requestAnimationFrame((()=>this.updatePosition()))}}onLoadingChange(){if(this.open)requestAnimationFrame((()=>this.updatePosition()))}onOpenChange(e){this.dsOpenChange.emit(e);if(e){this.bindPopupListeners();this.schedulePositionUpdate((()=>{this.scrollActiveOptionIntoView();if(this.searchable)this.searchEl?.focus()}))}else{this.cancelPositionRetry();this.unbindPopupListeners();this.searchTerm="";this.positionReady=false}}onSearchTermChange(){this.activeIndex=u(this.visibleOptions)[0]??-1;requestAnimationFrame((()=>{this.updatePosition();this.scrollActiveOptionIntoView()}))}onActiveIndexChange(){requestAnimationFrame((()=>this.scrollActiveOptionIntoView()))}formDisabledCallback(e){this.formDisabled=e;this.syncFormValue()}formResetCallback(){this.values=[...this.initialValues];this.closePopup()}formStateRestoreCallback(e){if(typeof e!=="string"){this.values=[];return}try{const t=JSON.parse(e);this.values=Array.isArray(t)?t.filter((e=>typeof e==="string")):[]}catch{this.values=[]}}async setFocus(){this.triggerEl?.focus()}get isDisabled(){return this.disabled||this.isInactive||this.formDisabled}get allSections(){return m(this.options,this.sections)}get allOptions(){return g(this.allSections)}get visibleSections(){return this.searchable?p(this.allSections,this.searchTerm):this.allSections}get visibleOptions(){return g(this.visibleSections)}get resolvedValues(){const e=new Set(this.allOptions.map((e=>e.value)));return[...new Set(this.values.filter((t=>e.has(t))))]}get hasSelection(){return this.resolvedValues.length>0}get activeOptionId(){return!this.isLoading&&this.activeIndex>=0?`${this.generatedId}-option-${this.activeIndex}`:undefined}scrollActiveOptionIntoView(){if(!this.open||!this.activeOptionId)return;this.el.querySelector(`#${this.activeOptionId}`)?.scrollIntoView({block:"nearest",inline:"nearest"})}bindPopupListeners(){this.unbindPopupListeners();this.outsideHandler=e=>{if(this.el.contains(e.target))return;this.closePopup()};this.repositionHandler=()=>this.updatePosition();document.addEventListener("mousedown",this.outsideHandler,true);window.addEventListener("scroll",this.repositionHandler,true);window.addEventListener("resize",this.repositionHandler)}unbindPopupListeners(){if(this.outsideHandler){document.removeEventListener("mousedown",this.outsideHandler,true);this.outsideHandler=null}if(this.repositionHandler){window.removeEventListener("scroll",this.repositionHandler,true);window.removeEventListener("resize",this.repositionHandler);this.repositionHandler=null}}cancelPositionRetry(){if(this.positionRetryRaf!==null){cancelAnimationFrame(this.positionRetryRaf);this.positionRetryRaf=null}}schedulePositionUpdate(e){if(!this.open)return;this.cancelPositionRetry();this.positionReady=false;let t=q;const s=()=>{this.positionRetryRaf=null;if(!this.open)return;if(this.updatePosition()){e?.();return}if(t>0){t-=1;this.positionRetryRaf=requestAnimationFrame(s)}};this.positionRetryRaf=requestAnimationFrame(s)}updatePosition(){if(!this.open||!this.triggerEl||!this.popupEl||!this.popupEl.isConnected||!this.el.contains(this.popupEl))return false;const e=I($.space050,$.space050);this.popupEl.style.minWidth=`${n(this.triggerEl.offsetWidth,e)}px`;this.position=c({anchorRect:this.triggerEl.getBoundingClientRect(),popupWidth:this.popupEl.offsetWidth,popupHeight:this.popupEl.offsetHeight,side:"bottom",align:"start",sideOffsetPx:e,alignOffsetPx:l({align:"start",alignOffsetPx:0,sectionInsetPx:e}),viewportPadPx:e,viewportWidth:window.innerWidth,viewportHeight:window.innerHeight});this.positionReady=true;return true}openPopup(e,t){if(this.isDisabled||!this.allOptions.length&&!this.isLoading)return;const s=u(this.visibleOptions);this.activeIndex=t==="last"?s[s.length-1]??-1:s[0]??-1;this.focusRingVisible=e;this.open=true}closePopup(e=false){if(!this.open)return;this.open=false;if(e)requestAnimationFrame((()=>this.triggerEl?.focus()))}toggleOption(e){if(e.isInactive||this.isLoading)return;const t=this.resolvedValues;const s=t.includes(e.value)?t.filter((t=>t!==e.value)):[...t,e.value];this.values=s;this.dsChange.emit([...s])}handleTypeahead(e){if(this.typeaheadTimer)clearTimeout(this.typeaheadTimer);this.focusRingVisible=true;const t=e.toLocaleLowerCase();const s=this.typeahead.length>0&&[...this.typeahead].every((e=>e===t));this.typeahead=s?t:`${this.typeahead}${t}`;const i=f(this.visibleOptions,this.typeahead,this.activeIndex);if(i>=0)this.activeIndex=i;const r=L($.animationDurationMedium1,$.animationDurationMedium1);this.typeaheadTimer=setTimeout((()=>{this.typeahead="";this.typeaheadTimer=null}),r)}handleListKeyDown(e){switch(e.key){case"ArrowDown":e.preventDefault();this.focusRingVisible=true;this.activeIndex=v(this.visibleOptions,this.activeIndex,1);break;case"ArrowUp":e.preventDefault();this.focusRingVisible=true;this.activeIndex=v(this.visibleOptions,this.activeIndex,-1);break;case"Home":e.preventDefault();this.focusRingVisible=true;this.activeIndex=u(this.visibleOptions)[0]??-1;break;case"End":{e.preventDefault();this.focusRingVisible=true;const t=u(this.visibleOptions);this.activeIndex=t[t.length-1]??-1;break}case"Enter":case" ":{if(e.key===" "&&this.searchable&&e.target===this.searchEl)break;e.preventDefault();const t=this.visibleOptions[this.activeIndex];if(t)this.toggleOption(t);break}case"Escape":e.preventDefault();this.closePopup(true);break;case"Tab":this.closePopup();break;default:if(!this.searchable&&e.key.length===1&&!e.metaKey&&!e.ctrlKey&&!e.altKey){this.handleTypeahead(e.key)}}}renderOption(e,t,s){const r=this.values.includes(e.value);const o=this.activeIndex===t;return i(a,{id:`${this.generatedId}-option-${t}`,option:e,selected:r,active:o,focusRingVisible:this.focusRingVisible,usesSubtext:s,leading:i("span",{class:"ds-choice-item__icon ds-interaction-fill__content","aria-hidden":"true"},i("ds-checkbox",{class:"select-option__checkbox",label:"",size:"md",checked:r,presentation:true})),onHover:()=>{this.focusRingVisible=false;this.activeIndex=t},onSelect:()=>this.toggleOption(e)})}render(){const e=this.isDisabled;const t=this.resolvedValues.length;const s=D[this.size];const o=E[this.size];const n=b(this.allOptions);const c=this.error&&Boolean(this.errorMessage);const l=[this.ariaDescribedby,c?this.errorId:undefined].filter(Boolean).join(" ")||undefined;const a={position:"fixed",left:"0",top:"0",transform:`translate(${Math.round(this.position.x)}px, ${Math.round(this.position.y)}px)`,zIndex:"var(--dimension-z-index-floating)",visibility:this.positionReady?"visible":"hidden"};let u=0;return i(r,{key:"5bb5dee514d53580e7b21a5cb50c247cc2f62ada",class:{"select-host":true,"ds-control-inactive":e,"ds-control--md":this.size==="md","ds-control--sm":this.size==="sm","ds-control--xs":this.size==="xs",...O(this.width),[`select-host--background-${this.background}`]:!!this.background}},i("button",{key:"3d9fbf2783839c2eed24dc8ad4dc3f79054e017b",ref:e=>{this.triggerEl=e??null},id:this.inputId??this.generatedId,type:"button",class:{trigger:true,"ds-focus-ring-inset":true,"ds-interaction-fill":true,"ds-interaction-fill--selected":!e&&this.activeFill&&this.hasSelection,"trigger--bordered":this.hasBorder||this.error,"trigger--has-value":this.hasSelection,"wrapper--error":this.error,[`ds-control--${this.size}`]:true,...y(this.background)},disabled:e,role:"combobox","aria-haspopup":"listbox","aria-expanded":String(this.open),"aria-controls":this.open?this.listboxId:undefined,"aria-activedescendant":this.open&&!this.searchable?this.activeOptionId:undefined,"aria-label":this.ariaLabel,"aria-labelledby":this.ariaLabelledby,"aria-describedby":l,"aria-invalid":this.error?"true":undefined,"aria-required":this.required||undefined,"aria-busy":this.isLoading?"true":undefined,onClick:()=>this.open?this.closePopup():this.openPopup(false),onKeyDown:this.handleTriggerKeyDown},(this.icon||this.isLoading)&&i("span",{key:"b88719f161ca9b90185f7e5a8c0d630acff25ab1",class:"trigger__prefix ds-interaction-fill__content","aria-hidden":"true"},this.isLoading?i("ds-loader",{size:o,color:"inherit"}):i("ds-icon",{name:this.icon,size:o,color:"inherit"})),i("ds-text",{key:"a6aef154d4d577dfdea6df2a8d8edd695493f8ca",class:"trigger__label ds-interaction-fill__content",as:"span",variant:s,color:"inherit",lineTruncation:1},`${this.placeholder}${t>0?` · ${t}`:""}`),i("span",{key:"c3a08976c6a65afc9fba37ad3df942686f66eebc",class:"trigger__chevron ds-interaction-fill__content","aria-hidden":"true"},i("ds-icon",{key:"d245ecafb9aee5e3a357839d4b6a7cc155fcadb9",name:"ChevronDown",size:o,color:"inherit"}))),this.open&&i("div",{key:"d5bac77d9e2bfa0c23a77157048ae2057963fe59",ref:e=>{this.popupEl=e??null},class:"select-popup ds-choice-popup",style:a},this.searchable&&i(d,{key:"65ce1fbbd6225c0318c2666aefae84ddfb8f0f9f",value:this.searchTerm,placeholder:this.searchPlaceholder,controls:this.listboxId,activeDescendant:this.activeOptionId,inputRef:e=>{this.searchEl=e},clearLabel:this.clearLabel,onValueChange:e=>{this.searchTerm=e},onKeyDown:e=>this.handleListKeyDown(e)}),i("div",{key:"2152419f19c3d5ec3004e2e3353d4cabcac37d91",id:this.listboxId,class:"ds-choice-list",role:"listbox","aria-multiselectable":"true","aria-label":this.ariaLabel??this.placeholder,"aria-busy":this.isLoading?"true":undefined},this.isLoading?i("div",{class:"ds-choice-loading",role:"option","aria-selected":"false","aria-disabled":"true","aria-label":this.loadingLabel,"aria-live":"polite"},i("ds-loader",{size:"md",color:"inherit"})):this.visibleOptions.length===0?i("div",{class:"ds-choice-empty",role:"option","aria-selected":"false","aria-disabled":"true","aria-label":this.noResultsText,"aria-live":"polite"},i("ds-empty-state",{body:this.noResultsText})):this.visibleSections.map((e=>i("div",{class:{"ds-choice-section":true,"ds-choice-section--divided":!!e.divider},role:e.header?"group":undefined,"aria-label":e.header},e.header&&i("ds-text",{class:"ds-choice-section__header ds-control--md",as:"span",variant:"text-body-small",emphasis:true,color:"primary","aria-hidden":"true"},e.header),e.options.map((e=>this.renderOption(e,u++,n))))))),this.allowClear&&this.hasSelection&&!this.isLoading&&i(h,{key:"f01ca9b0d5cd1e0a69d8d9c9b8f30cac57a484a0",summary:`${t} ${this.selectedLabel}`,clearLabel:this.clearLabel,onClear:this.clearSelection})),c&&i("ds-text",{key:"91a41c779a0199e257ed5b4dc8c8e9d9e3143232",class:"error-text",as:"div",variant:"text-body-small",color:"negative",textId:this.errorId,role:"alert"},this.errorMessage))}static get formAssociated(){return true}get el(){return this}static get watchers(){return{values:[{syncFormValue:0}],disabled:[{syncFormValue:0}],isInactive:[{syncFormValue:0}],required:[{syncFormValue:0}],name:[{syncFormValue:0}],options:[{syncFormValue:0}],sections:[{syncFormValue:0}],isLoading:[{onLoadingChange:0}],open:[{onOpenChange:0}],searchTerm:[{onSearchTermChange:0}],activeIndex:[{onActiveIndexChange:0}]}}static get style(){return S()}},[66,"ds-select-multi",{options:[16],sections:[16],values:[1040],open:[1540],name:[513],disabled:[516],required:[516],requiredMessage:[1,"required-message"],placeholder:[1],size:[1],width:[1],isInactive:[4,"is-inactive"],isLoading:[4,"is-loading"],activeFill:[4,"active-fill"],hasBorder:[4,"has-border"],icon:[1],allowClear:[4,"allow-clear"],clearLabel:[1,"clear-label"],selectedLabel:[1,"selected-label"],searchable:[4],searchPlaceholder:[1,"search-placeholder"],noResultsText:[1,"no-results-text"],loadingLabel:[1,"loading-label"],background:[1],error:[4],errorMessage:[1,"error-message"],inputId:[1,"input-id"],ariaLabel:[1,"aria-label"],ariaLabelledby:[1,"aria-labelledby"],ariaDescribedby:[1,"aria-describedby"],activeIndex:[32],searchTerm:[32],formDisabled:[32],position:[32],positionReady:[32],focusRingVisible:[32],setFocus:[64]},undefined,{values:[{syncFormValue:0}],disabled:[{syncFormValue:0}],isInactive:[{syncFormValue:0}],required:[{syncFormValue:0}],name:[{syncFormValue:0}],options:[{syncFormValue:0}],sections:[{syncFormValue:0}],isLoading:[{onLoadingChange:0}],open:[{onOpenChange:0}],searchTerm:[{onSearchTermChange:0}],activeIndex:[{onActiveIndexChange:0}]}]);function B(){if(typeof customElements==="undefined"){return}const e=["ds-select-multi","ds-badge","ds-button-unfilled","ds-checkbox","ds-empty-state","ds-icon","ds-loader","ds-text","ds-tooltip"];e.forEach((e=>{switch(e){case"ds-select-multi":if(!customElements.get(o(e))){customElements.define(o(e),T)}break;case"ds-badge":if(!customElements.get(o(e))){x()}break;case"ds-button-unfilled":if(!customElements.get(o(e))){w()}break;case"ds-checkbox":if(!customElements.get(o(e))){k()}break;case"ds-empty-state":if(!customElements.get(o(e))){_()}break;case"ds-icon":if(!customElements.get(o(e))){z()}break;case"ds-loader":if(!customElements.get(o(e))){C()}break;case"ds-text":if(!customElements.get(o(e))){F()}break;case"ds-tooltip":if(!customElements.get(o(e))){j()}break}}))}B();const R=T;const M=B;export{R as DsSelectMulti,M as defineCustomElement};
|
|
2
2
|
//# sourceMappingURL=ds-select-multi.js.map
|