@ds-mo/ui 8.3.0 → 8.3.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/.build-stamp +1 -1
- package/dist/agent.json +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/docs/components.json +1 -1
- package/dist/types/components/Select/Select.d.ts +5 -0
- package/dist/types/components/SelectMulti/SelectMulti.d.ts +5 -0
- package/package.json +1 -1
package/dist/.build-stamp
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
|
|
1
|
+
1784320108642
|
package/dist/agent.json
CHANGED
|
@@ -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}from"./p-C_cu-HIT.js";import{e as c,r as a,f as l,a as d,b as h,m as u,C as m,d as g,g as p,h as f,i as v}from"./p-VKIsOVza.js";import{d as b}from"./p-DAuadHYu.js";import{d as y}from"./p-DV23KMU-.js";import{d as x}from"./p-_y99wWNU.js";import{d as w}from"./p-DxQ4gzbA.js";import{d as k}from"./p-CXF8yd-g.js";import{d as _}from"./p-Cpr3K41-.js";import{d as z}from"./p-BKA6houZ.js";import{r as C}from"./p-BWUTr_XN.js";import{a as F}from"./p-BHtg1fh3.js";import{C as V}from"./p-Cx-ywr1e.js";import{T as A}from"./p-drBA73M_.js";import{c as j}from"./p-DuFm-ieS.js";const $=()=>`.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.25;pointer-events:none;cursor:not-allowed}.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-radius:var(--dimension-radius-025)}.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-radius:var(--dimension-radius-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-control-radius:var(--dimension-radius-025)}.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;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: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);padding:0 var(--ds-control-padding-inline, var(--dimension-space-075))}.ds-choice-footer__summary.sc-ds-select-multi,.ds-choice-footer__clear.sc-ds-select-multi ds-text.sc-ds-select-multi{padding:0 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}.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}.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));overflow:hidden;text-overflow:ellipsis;white-space:nowrap;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)}.select-search.sc-ds-select-multi{position:relative;box-sizing:border-box;padding:var(--dimension-space-050)}.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.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}.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 L={md:"md",sm:"sm",xs:"xs"};let I=0;const D=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="This field is required.";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-${++I}`;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.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.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;this.internals.setValidity(t?{valueMissing:true}:{},t?this.requiredMessage:"");if(this.open){const e=c(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.positionReady=false;requestAnimationFrame((()=>{this.updatePosition();this.scrollActiveOptionIntoView();if(this.searchable)this.searchEl?.focus()}))}else{this.unbindPopupListeners();this.searchTerm="";this.positionReady=false}}onSearchTermChange(){this.activeIndex=c(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 a(this.options,this.sections)}get allOptions(){return l(this.allSections)}get visibleSections(){return this.searchable?d(this.allSections,this.searchTerm):this.allSections}get visibleOptions(){return l(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}}updatePosition(){if(!this.open||!this.triggerEl||!this.popupEl)return;const e=C(A.space050,A.space050);this.popupEl.style.minWidth=`${this.triggerEl.offsetWidth+e*2}px`;this.position=n({anchorRect:this.triggerEl.getBoundingClientRect(),popupWidth:this.popupEl.offsetWidth,popupHeight:this.popupEl.offsetHeight,side:"bottom",align:"start",sideOffsetPx:e,alignOffsetPx:-e,viewportPadPx:e,viewportWidth:window.innerWidth,viewportHeight:window.innerHeight});this.positionReady=true}openPopup(e,t){if(this.isDisabled||!this.allOptions.length&&!this.isLoading)return;const s=c(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=h(this.visibleOptions,this.typeahead,this.activeIndex);if(i>=0)this.activeIndex=i;const r=F(A.animationDurationMedium1,A.animationDurationMedium1);this.typeaheadTimer=setTimeout((()=>{this.typeahead="";this.typeaheadTimer=null}),r)}handleListKeyDown(e){switch(e.key){case"ArrowDown":e.preventDefault();this.focusRingVisible=true;this.activeIndex=u(this.visibleOptions,this.activeIndex,1);break;case"ArrowUp":e.preventDefault();this.focusRingVisible=true;this.activeIndex=u(this.visibleOptions,this.activeIndex,-1);break;case"Home":e.preventDefault();this.focusRingVisible=true;this.activeIndex=c(this.visibleOptions)[0]??-1;break;case"End":{e.preventDefault();this.focusRingVisible=true;const t=c(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(m,{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=V[this.size];const o=L[this.size];const n=g(this.allOptions);const c=this.error&&Boolean(this.errorMessage);const a=[this.ariaDescribedby,c?this.errorId:undefined].filter(Boolean).join(" ")||undefined;const l={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 d=0;return i(r,{key:"9c5288825f37d6c02792ff2455f82a19c0d65517",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",...j(this.width),[`select-host--background-${this.background}`]:!!this.background}},i("button",{key:"d73080a2579894758180c194cfc2de32c17f1b51",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,...v(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":a,"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:"a84821d3c4a91928dccd773cf8f3863484679ab8",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:"fc853166a8b89c5720eacff8c02021263b03c526",class:"trigger__label ds-interaction-fill__content",as:"span",variant:s,color:"inherit",lineTruncation:1},`${this.placeholder}${t>0?` · ${t}`:""}`),i("span",{key:"906ca794bc40711eab392593c853ef87a625f899",class:"trigger__chevron ds-interaction-fill__content","aria-hidden":"true"},i("ds-icon",{key:"f9441da6ff962857455fc04d6514b47fcc9d055a",name:"ChevronDown",size:o,color:"inherit"}))),this.open&&i("div",{key:"520b5dc89c7df7ed3836bc940ac10c3220c46406",ref:e=>{this.popupEl=e??null},class:"select-popup ds-choice-popup",style:l},this.searchable&&i(p,{key:"adc6e3175910f7a7c7c6a53d5e3c8bd4c3e8ccaa",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:"c05a609653d1220a98d3e9ed0981854ee848b3bb",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,d++,n))))))),this.allowClear&&this.hasSelection&&!this.isLoading&&i(f,{key:"a7e22d7298f7c2e45ae5e0a20460312f43ff1a2c",summary:`${t} ${this.selectedLabel}`,clearLabel:this.clearLabel,onClear:this.clearSelection})),c&&i("ds-text",{key:"d398e6cfde22a55cd618131444ec4e99c5e736ac",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 $()}},[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 O(){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"];e.forEach((e=>{switch(e){case"ds-select-multi":if(!customElements.get(o(e))){customElements.define(o(e),D)}break;case"ds-badge":if(!customElements.get(o(e))){b()}break;case"ds-button-unfilled":if(!customElements.get(o(e))){y()}break;case"ds-checkbox":if(!customElements.get(o(e))){x()}break;case"ds-empty-state":if(!customElements.get(o(e))){w()}break;case"ds-icon":if(!customElements.get(o(e))){k()}break;case"ds-loader":if(!customElements.get(o(e))){_()}break;case"ds-text":if(!customElements.get(o(e))){z()}break}}))}O();const S=D;const T=O;export{S as DsSelectMulti,T 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}from"./p-C_cu-HIT.js";import{e as c,r as a,f as l,a as d,b as h,m as u,C as m,d as g,g as p,h as f,i as v}from"./p-VKIsOVza.js";import{d as b}from"./p-DAuadHYu.js";import{d as y}from"./p-DV23KMU-.js";import{d as x}from"./p-_y99wWNU.js";import{d as w}from"./p-DxQ4gzbA.js";import{d as k}from"./p-CXF8yd-g.js";import{d as _}from"./p-Cpr3K41-.js";import{d as z}from"./p-BKA6houZ.js";import{r as C}from"./p-BWUTr_XN.js";import{a as F}from"./p-BHtg1fh3.js";import{C as A}from"./p-Cx-ywr1e.js";import{T as V}from"./p-drBA73M_.js";import{c as j}from"./p-DuFm-ieS.js";const $=()=>`.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.25;pointer-events:none;cursor:not-allowed}.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-radius:var(--dimension-radius-025)}.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-radius:var(--dimension-radius-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-control-radius:var(--dimension-radius-025)}.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;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: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);padding:0 var(--ds-control-padding-inline, var(--dimension-space-075))}.ds-choice-footer__summary.sc-ds-select-multi,.ds-choice-footer__clear.sc-ds-select-multi ds-text.sc-ds-select-multi{padding:0 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}.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}.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));overflow:hidden;text-overflow:ellipsis;white-space:nowrap;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)}.select-search.sc-ds-select-multi{position:relative;box-sizing:border-box;padding:var(--dimension-space-050)}.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.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}.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 L={md:"md",sm:"sm",xs:"xs"};let I=0;const D=8;const O=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="This field is required.";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-${++I}`;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;this.internals.setValidity(t?{valueMissing:true}:{},t?this.requiredMessage:"");if(this.open){const e=c(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=c(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 a(this.options,this.sections)}get allOptions(){return l(this.allSections)}get visibleSections(){return this.searchable?d(this.allSections,this.searchTerm):this.allSections}get visibleOptions(){return l(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=D;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=C(V.space050,V.space050);this.popupEl.style.minWidth=`${this.triggerEl.offsetWidth+e*2}px`;this.position=n({anchorRect:this.triggerEl.getBoundingClientRect(),popupWidth:this.popupEl.offsetWidth,popupHeight:this.popupEl.offsetHeight,side:"bottom",align:"start",sideOffsetPx:e,alignOffsetPx:-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=c(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=h(this.visibleOptions,this.typeahead,this.activeIndex);if(i>=0)this.activeIndex=i;const r=F(V.animationDurationMedium1,V.animationDurationMedium1);this.typeaheadTimer=setTimeout((()=>{this.typeahead="";this.typeaheadTimer=null}),r)}handleListKeyDown(e){switch(e.key){case"ArrowDown":e.preventDefault();this.focusRingVisible=true;this.activeIndex=u(this.visibleOptions,this.activeIndex,1);break;case"ArrowUp":e.preventDefault();this.focusRingVisible=true;this.activeIndex=u(this.visibleOptions,this.activeIndex,-1);break;case"Home":e.preventDefault();this.focusRingVisible=true;this.activeIndex=c(this.visibleOptions)[0]??-1;break;case"End":{e.preventDefault();this.focusRingVisible=true;const t=c(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(m,{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=A[this.size];const o=L[this.size];const n=g(this.allOptions);const c=this.error&&Boolean(this.errorMessage);const a=[this.ariaDescribedby,c?this.errorId:undefined].filter(Boolean).join(" ")||undefined;const l={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 d=0;return i(r,{key:"1685293bad9bb4861abd25ad9f8fbb2cb52e8fd5",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",...j(this.width),[`select-host--background-${this.background}`]:!!this.background}},i("button",{key:"47fb2692dfc9cb2ad156236dcfbd3a06b88180a8",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,...v(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":a,"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:"58b31453efa2982bb1a520bfa0d5ac3c8b89331a",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:"2a910ddc9e592630e34fcaff14afaf0c1d29eb32",class:"trigger__label ds-interaction-fill__content",as:"span",variant:s,color:"inherit",lineTruncation:1},`${this.placeholder}${t>0?` · ${t}`:""}`),i("span",{key:"8701bc7642cc21cefd026382b5fdd90f454d5248",class:"trigger__chevron ds-interaction-fill__content","aria-hidden":"true"},i("ds-icon",{key:"5346afc4c9dad0023fa8adb233e3976c6dfa1df4",name:"ChevronDown",size:o,color:"inherit"}))),this.open&&i("div",{key:"e8ef0d181eb4e932ef85114b9ef86ad3ff1a08bf",ref:e=>{this.popupEl=e??null},class:"select-popup ds-choice-popup",style:l},this.searchable&&i(p,{key:"e8ef82b713d6602dae951587761e6a6e79b837bd",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:"8a001e44983a2543c07ccbc264957b9b1f939738",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,d++,n))))))),this.allowClear&&this.hasSelection&&!this.isLoading&&i(f,{key:"f605e5333907608687675c8985099f74bdfbddc1",summary:`${t} ${this.selectedLabel}`,clearLabel:this.clearLabel,onClear:this.clearSelection})),c&&i("ds-text",{key:"a7f69e5f06caf8112b7dd4b1e772de8a7fd24782",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 $()}},[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 S(){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"];e.forEach((e=>{switch(e){case"ds-select-multi":if(!customElements.get(o(e))){customElements.define(o(e),O)}break;case"ds-badge":if(!customElements.get(o(e))){b()}break;case"ds-button-unfilled":if(!customElements.get(o(e))){y()}break;case"ds-checkbox":if(!customElements.get(o(e))){x()}break;case"ds-empty-state":if(!customElements.get(o(e))){w()}break;case"ds-icon":if(!customElements.get(o(e))){k()}break;case"ds-loader":if(!customElements.get(o(e))){_()}break;case"ds-text":if(!customElements.get(o(e))){z()}break}}))}S();const T=O;const q=S;export{T as DsSelectMulti,q as defineCustomElement};
|
|
2
2
|
//# sourceMappingURL=ds-select-multi.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["selectMultiCss","ICON_SIZE","md","sm","xs","selectMultiId","SelectMulti","__stencil_proxyCustomElement","HTMLElement","constructor","registerHost","this","options","sections","values","open","disabled","required","requiredMessage","placeholder","size","width","isInactive","isLoading","activeFill","hasBorder","allowClear","clearLabel","selectedLabel","searchable","searchPlaceholder","noResultsText","loadingLabel","error","ariaLabel","activeIndex","searchTerm","formDisabled","position","x","y","positionReady","focusRingVisible","generatedId","listboxId","errorId","triggerEl","popupEl","searchEl","initialValues","typeahead","typeaheadTimer","outsideHandler","repositionHandler","clearSelection","event","preventDefault","stopPropagation","dsChange","emit","dsClear","requestAnimationFrame","focus","handleTriggerKeyDown","includes","key","openPopup","length","metaKey","ctrlKey","altKey","handleTypeahead","handleListKeyDown","componentWillLoad","syncFormValue","componentDidLoad","onOpenChange","disconnectedCallback","unbindPopupListeners","clearTimeout","resolvedValues","isDisabled","name","internals","setFormValue","data","FormData","forEach","value","append","JSON","stringify","missing","setValidity","valueMissing","enabled","enabledChoiceIndexes","visibleOptions","updatePosition","onLoadingChange","dsOpenChange","bindPopupListeners","scrollActiveOptionIntoView","onSearchTermChange","onActiveIndexChange","formDisabledCallback","formResetCallback","closePopup","formStateRestoreCallback","state","restored","parse","Array","isArray","filter","setFocus","allSections","resolveChoiceSections","allOptions","flattenChoiceSections","visibleSections","filterChoiceSections","valid","Set","map","option","has","hasSelection","activeOptionId","undefined","el","querySelector","scrollIntoView","block","inline","contains","target","document","addEventListener","window","removeEventListener","sectionPadding","resolveCssLengthPx","TOKEN_DEFAULTS","space050","style","minWidth","offsetWidth","computeAnchoredPopupPosition","anchorRect","getBoundingClientRect","popupWidth","popupHeight","offsetHeight","side","align","sideOffsetPx","alignOffsetPx","viewportPadPx","viewportWidth","innerWidth","viewportHeight","innerHeight","focusVisible","edge","restoreFocus","toggleOption","current","next","normalized","toLocaleLowerCase","repeatedCharacter","every","character","match","findChoiceTypeaheadMatch","resetMs","resolveCssTimeMs","animationDurationMedium1","setTimeout","moveChoiceIndex","renderOption","index","usesSubtext","selected","active","h","ChoiceOptionRow","id","leading","class","label","checked","presentation","onHover","onSelect","render","inactive","count","textVariant","CONTROL_TEXT_VARIANT","iconSize","usesOptionSubtext","choiceListUsesSubtext","showError","Boolean","errorMessage","describedBy","ariaDescribedby","join","popupStyle","left","top","transform","Math","round","zIndex","visibility","flatIndex","Host","controlWidthClass","background","ref","element","inputId","type","trigger","choiceBackgroundClassMap","role","String","ariaLabelledby","onClick","onKeyDown","icon","color","as","variant","lineTruncation","ChoiceSearch","controls","activeDescendant","inputRef","onValueChange","body","section","divider","header","emphasis","ChoiceFooter","summary","onClear","textId"],"sources":["src/wc/components/SelectMulti/SelectMulti.css?tag=ds-select-multi&encapsulation=scoped","src/wc/components/SelectMulti/SelectMulti.tsx"],"sourcesContent":["@import '../Select/Select.css';\n","import {\n AttachInternals,\n Component,\n Element,\n Event,\n EventEmitter,\n h,\n Host,\n Method,\n Prop,\n State,\n Watch,\n} from '@stencil/core';\nimport {\n controlWidthClass,\n CONTROL_TEXT_VARIANT,\n resolveCssLengthPx,\n resolveCssTimeMs,\n TOKEN_DEFAULTS,\n type ControlWidth,\n} from '../../utils';\nimport { computeAnchoredPopupPosition } from '../../utils/anchored-popup';\nimport { ChoiceFooter, ChoiceOptionRow, ChoiceSearch } from '../../utils/choice-list-parts';\nimport {\n choiceBackgroundClassMap,\n choiceListUsesSubtext,\n enabledChoiceIndexes,\n filterChoiceSections,\n findChoiceTypeaheadMatch,\n flattenChoiceSections,\n moveChoiceIndex,\n resolveChoiceSections,\n} from '../../utils/choice-list';\nimport type {\n SelectBackground,\n SelectOption,\n SelectSection,\n SelectSize,\n} from '../Select/Select';\n\nexport type SelectMultiOption = Omit<SelectOption, 'icon'>;\nexport type SelectMultiSection = Omit<SelectSection, 'options'> & {\n options: SelectMultiOption[];\n};\nexport type SelectMultiBackground = SelectBackground;\nexport type SelectMultiSize = SelectSize;\nexport type SelectMultiWidth = ControlWidth;\n\nconst ICON_SIZE: Record<SelectMultiSize, 'md' | 'sm' | 'xs'> = {\n md: 'md',\n sm: 'sm',\n xs: 'xs',\n};\n\nlet selectMultiId = 0;\n\n@Component({\n tag: 'ds-select-multi',\n styleUrl: 'SelectMulti.css',\n scoped: true,\n formAssociated: true,\n})\nexport class SelectMulti {\n @Element() el!: HTMLElement;\n @AttachInternals() internals!: ElementInternals;\n\n /** Flat choices. Assign arrays through the JavaScript property. */\n @Prop() options: SelectMultiOption[] = [];\n /** Grouped choices; takes precedence over options. Assign through JavaScript. */\n @Prop() sections: SelectMultiSection[] = [];\n /** Selected values. Assign arrays through the JavaScript property. */\n @Prop({ mutable: true }) values: string[] = [];\n /** Controlled popup visibility. */\n @Prop({ mutable: true, reflect: true }) open: boolean = false;\n /** Native form field name used for each repeated selected-value entry. */\n @Prop({ reflect: true }) name: string | undefined;\n /** Native disabled state. */\n @Prop({ reflect: true }) disabled: boolean = false;\n /** Require at least one valid selected value. */\n @Prop({ reflect: true }) required: boolean = false;\n /** Validation message used when required is missing. */\n @Prop() requiredMessage: string = 'This field is required.';\n /** Persistent trigger label; selected option labels never replace it. */\n @Prop() placeholder: string = 'Select';\n /** Control density. */\n @Prop() size: SelectMultiSize = 'md';\n /** Width fit — hug content (default) or fill the parent. */\n @Prop() width: SelectMultiWidth = 'hug';\n /** Shared inactive treatment; removes interaction and form submission. */\n @Prop() isInactive: boolean = false;\n /** Replace the prefix with a loader and disable option interaction. */\n @Prop() isLoading: boolean = false;\n /** Show the selected interaction fill when at least one value exists. */\n @Prop() activeFill: boolean = true;\n /** Show the surface-aware inset border. */\n @Prop() hasBorder: boolean = true;\n /** Optional trigger prefix icon name. */\n @Prop() icon: string | undefined;\n /** Show the clear-all footer action when values exist. */\n @Prop() allowClear: boolean = true;\n /** Localized clear-all action label. */\n @Prop() clearLabel: string = 'Clear';\n /** Localized noun displayed after the selected count. */\n @Prop() selectedLabel: string = 'selected';\n /** Show immediate local filtering over option labels, subtext, and section headings. */\n @Prop() searchable: boolean = false;\n /** Localized search-field placeholder and accessible name. */\n @Prop() searchPlaceholder: string = 'Search';\n /** Localized empty-filter result text. */\n @Prop() noResultsText: string = 'No results found';\n /** Accessible loading status label. */\n @Prop() loadingLabel: string = 'Loading';\n /** Actual parent surface context; omit on primary and secondary surfaces. */\n @Prop() background: SelectMultiBackground | undefined;\n /** Show invalid visual state. */\n @Prop() error: boolean = false;\n /** Error text rendered below the trigger when error is true. */\n @Prop() errorMessage: string | undefined;\n /** ID applied to the internal combobox trigger for external labels. */\n @Prop() inputId: string | undefined;\n /** Direct accessible name when no external label is available. */\n @Prop({ attribute: 'aria-label' }) ariaLabel: string | null = null;\n /** IDs of elements that label the combobox. */\n @Prop({ attribute: 'aria-labelledby' }) ariaLabelledby: string | undefined;\n /** Additional IDs that describe the combobox. */\n @Prop({ attribute: 'aria-describedby' }) ariaDescribedby: string | undefined;\n\n /** Emitted after user toggles or clearing with a new values array. */\n @Event() dsChange!: EventEmitter<string[]>;\n /** Emitted after the footer clear-all action. */\n @Event() dsClear!: EventEmitter<void>;\n /** Emitted whenever popup visibility changes. */\n @Event() dsOpenChange!: EventEmitter<boolean>;\n\n @State() private activeIndex = -1;\n @State() private searchTerm = '';\n @State() private formDisabled = false;\n @State() private position = { x: 0, y: 0 };\n @State() private positionReady = false;\n @State() private focusRingVisible = false;\n\n private readonly generatedId = `ds-select-multi-${++selectMultiId}`;\n private readonly listboxId = `${this.generatedId}-listbox`;\n private readonly errorId = `${this.generatedId}-error`;\n private triggerEl: HTMLButtonElement | null = null;\n private popupEl: HTMLDivElement | null = null;\n private searchEl: HTMLInputElement | null = null;\n private initialValues: string[] = [];\n private typeahead = '';\n private typeaheadTimer: ReturnType<typeof setTimeout> | null = null;\n private outsideHandler: ((event: MouseEvent) => void) | null = null;\n private repositionHandler: (() => void) | null = null;\n\n componentWillLoad() {\n this.initialValues = [...this.values];\n this.syncFormValue();\n }\n\n componentDidLoad() {\n if (this.open) this.onOpenChange(true);\n }\n\n disconnectedCallback() {\n this.unbindPopupListeners();\n if (this.typeaheadTimer) clearTimeout(this.typeaheadTimer);\n }\n\n @Watch('values')\n @Watch('disabled')\n @Watch('isInactive')\n @Watch('required')\n @Watch('name')\n @Watch('options')\n @Watch('sections')\n syncFormValue() {\n const resolvedValues = this.resolvedValues;\n if (this.isDisabled || !this.name || resolvedValues.length === 0) {\n this.internals.setFormValue(null);\n } else {\n const data = new FormData();\n resolvedValues.forEach(value => data.append(this.name as string, value));\n this.internals.setFormValue(data, JSON.stringify(resolvedValues));\n }\n const missing = this.required && !this.isDisabled && resolvedValues.length === 0;\n this.internals.setValidity(missing ? { valueMissing: true } : {}, missing ? this.requiredMessage : '');\n if (this.open) {\n const enabled = enabledChoiceIndexes(this.visibleOptions);\n if (!enabled.includes(this.activeIndex)) this.activeIndex = enabled[0] ?? -1;\n requestAnimationFrame(() => this.updatePosition());\n }\n }\n\n @Watch('isLoading')\n onLoadingChange() {\n if (this.open) requestAnimationFrame(() => this.updatePosition());\n }\n\n @Watch('open')\n onOpenChange(open: boolean) {\n this.dsOpenChange.emit(open);\n if (open) {\n this.bindPopupListeners();\n this.positionReady = false;\n requestAnimationFrame(() => {\n this.updatePosition();\n this.scrollActiveOptionIntoView();\n if (this.searchable) this.searchEl?.focus();\n });\n } else {\n this.unbindPopupListeners();\n this.searchTerm = '';\n this.positionReady = false;\n }\n }\n\n @Watch('searchTerm')\n onSearchTermChange() {\n this.activeIndex = enabledChoiceIndexes(this.visibleOptions)[0] ?? -1;\n requestAnimationFrame(() => {\n this.updatePosition();\n this.scrollActiveOptionIntoView();\n });\n }\n\n @Watch('activeIndex')\n onActiveIndexChange() {\n requestAnimationFrame(() => this.scrollActiveOptionIntoView());\n }\n\n formDisabledCallback(disabled: boolean) {\n this.formDisabled = disabled;\n this.syncFormValue();\n }\n\n formResetCallback() {\n this.values = [...this.initialValues];\n this.closePopup();\n }\n\n formStateRestoreCallback(state: string | File | FormData | null) {\n if (typeof state !== 'string') {\n this.values = [];\n return;\n }\n try {\n const restored = JSON.parse(state);\n this.values = Array.isArray(restored)\n ? restored.filter((value): value is string => typeof value === 'string')\n : [];\n } catch {\n this.values = [];\n }\n }\n\n @Method()\n async setFocus() {\n this.triggerEl?.focus();\n }\n\n private get isDisabled(): boolean {\n return this.disabled || this.isInactive || this.formDisabled;\n }\n\n private get allSections(): SelectMultiSection[] {\n return resolveChoiceSections(this.options, this.sections);\n }\n\n private get allOptions(): SelectMultiOption[] {\n return flattenChoiceSections(this.allSections);\n }\n\n private get visibleSections(): SelectMultiSection[] {\n return this.searchable\n ? filterChoiceSections(this.allSections, this.searchTerm)\n : this.allSections;\n }\n\n private get visibleOptions(): SelectMultiOption[] {\n return flattenChoiceSections(this.visibleSections);\n }\n\n private get resolvedValues(): string[] {\n const valid = new Set(this.allOptions.map(option => option.value));\n return [...new Set(this.values.filter(value => valid.has(value)))];\n }\n\n private get hasSelection(): boolean {\n return this.resolvedValues.length > 0;\n }\n\n private get activeOptionId(): string | undefined {\n return !this.isLoading && this.activeIndex >= 0\n ? `${this.generatedId}-option-${this.activeIndex}`\n : undefined;\n }\n\n private scrollActiveOptionIntoView() {\n if (!this.open || !this.activeOptionId) return;\n this.el\n .querySelector<HTMLElement>(`#${this.activeOptionId}`)\n ?.scrollIntoView({ block: 'nearest', inline: 'nearest' });\n }\n\n private bindPopupListeners() {\n this.unbindPopupListeners();\n this.outsideHandler = event => {\n if (this.el.contains(event.target as Node)) return;\n this.closePopup();\n };\n this.repositionHandler = () => this.updatePosition();\n document.addEventListener('mousedown', this.outsideHandler, true);\n window.addEventListener('scroll', this.repositionHandler, true);\n window.addEventListener('resize', this.repositionHandler);\n }\n\n private unbindPopupListeners() {\n if (this.outsideHandler) {\n document.removeEventListener('mousedown', this.outsideHandler, true);\n this.outsideHandler = null;\n }\n if (this.repositionHandler) {\n window.removeEventListener('scroll', this.repositionHandler, true);\n window.removeEventListener('resize', this.repositionHandler);\n this.repositionHandler = null;\n }\n }\n\n private updatePosition() {\n if (!this.open || !this.triggerEl || !this.popupEl) return;\n const sectionPadding = resolveCssLengthPx(TOKEN_DEFAULTS.space050, TOKEN_DEFAULTS.space050);\n this.popupEl.style.minWidth = `${this.triggerEl.offsetWidth + sectionPadding * 2}px`;\n this.position = computeAnchoredPopupPosition({\n anchorRect: this.triggerEl.getBoundingClientRect(),\n popupWidth: this.popupEl.offsetWidth,\n popupHeight: this.popupEl.offsetHeight,\n side: 'bottom',\n align: 'start',\n sideOffsetPx: sectionPadding,\n alignOffsetPx: -sectionPadding,\n viewportPadPx: sectionPadding,\n viewportWidth: window.innerWidth,\n viewportHeight: window.innerHeight,\n });\n this.positionReady = true;\n }\n\n private openPopup(focusVisible: boolean, edge?: 'first' | 'last') {\n if (this.isDisabled || (!this.allOptions.length && !this.isLoading)) return;\n const enabled = enabledChoiceIndexes(this.visibleOptions);\n this.activeIndex =\n edge === 'last'\n ? (enabled[enabled.length - 1] ?? -1)\n : (enabled[0] ?? -1);\n this.focusRingVisible = focusVisible;\n this.open = true;\n }\n\n private closePopup(restoreFocus = false) {\n if (!this.open) return;\n this.open = false;\n if (restoreFocus) requestAnimationFrame(() => this.triggerEl?.focus());\n }\n\n private toggleOption(option: SelectMultiOption) {\n if (option.isInactive || this.isLoading) return;\n const current = this.resolvedValues;\n const next = current.includes(option.value)\n ? current.filter(value => value !== option.value)\n : [...current, option.value];\n this.values = next;\n this.dsChange.emit([...next]);\n }\n\n private clearSelection = (event: Event) => {\n event.preventDefault();\n event.stopPropagation();\n this.values = [];\n this.dsChange.emit([]);\n this.dsClear.emit();\n requestAnimationFrame(() => (this.searchable ? this.searchEl?.focus() : this.triggerEl?.focus()));\n };\n\n private handleTypeahead(key: string) {\n if (this.typeaheadTimer) clearTimeout(this.typeaheadTimer);\n this.focusRingVisible = true;\n const normalized = key.toLocaleLowerCase();\n const repeatedCharacter =\n this.typeahead.length > 0 &&\n [...this.typeahead].every(character => character === normalized);\n this.typeahead = repeatedCharacter ? normalized : `${this.typeahead}${normalized}`;\n const match = findChoiceTypeaheadMatch(this.visibleOptions, this.typeahead, this.activeIndex);\n if (match >= 0) this.activeIndex = match;\n const resetMs = resolveCssTimeMs(\n TOKEN_DEFAULTS.animationDurationMedium1,\n TOKEN_DEFAULTS.animationDurationMedium1,\n );\n this.typeaheadTimer = setTimeout(() => {\n this.typeahead = '';\n this.typeaheadTimer = null;\n }, resetMs);\n }\n\n private handleListKeyDown(event: KeyboardEvent) {\n switch (event.key) {\n case 'ArrowDown':\n event.preventDefault();\n this.focusRingVisible = true;\n this.activeIndex = moveChoiceIndex(this.visibleOptions, this.activeIndex, 1);\n break;\n case 'ArrowUp':\n event.preventDefault();\n this.focusRingVisible = true;\n this.activeIndex = moveChoiceIndex(this.visibleOptions, this.activeIndex, -1);\n break;\n case 'Home':\n event.preventDefault();\n this.focusRingVisible = true;\n this.activeIndex = enabledChoiceIndexes(this.visibleOptions)[0] ?? -1;\n break;\n case 'End': {\n event.preventDefault();\n this.focusRingVisible = true;\n const enabled = enabledChoiceIndexes(this.visibleOptions);\n this.activeIndex = enabled[enabled.length - 1] ?? -1;\n break;\n }\n case 'Enter':\n case ' ': {\n if (event.key === ' ' && this.searchable && event.target === this.searchEl) break;\n event.preventDefault();\n const option = this.visibleOptions[this.activeIndex];\n if (option) this.toggleOption(option);\n break;\n }\n case 'Escape':\n event.preventDefault();\n this.closePopup(true);\n break;\n case 'Tab':\n this.closePopup();\n break;\n default:\n if (!this.searchable && event.key.length === 1 && !event.metaKey && !event.ctrlKey && !event.altKey) {\n this.handleTypeahead(event.key);\n }\n }\n }\n\n private handleTriggerKeyDown = (event: KeyboardEvent) => {\n if (!this.open) {\n if (['ArrowDown', 'ArrowUp', 'Enter', ' '].includes(event.key)) {\n event.preventDefault();\n this.openPopup(true, event.key === 'ArrowUp' ? 'last' : 'first');\n } else if (event.key.length === 1 && !event.metaKey && !event.ctrlKey && !event.altKey) {\n event.preventDefault();\n this.openPopup(true);\n if (this.searchable) this.searchTerm = event.key;\n else this.handleTypeahead(event.key);\n }\n return;\n }\n this.handleListKeyDown(event);\n };\n\n private renderOption(option: SelectMultiOption, index: number, usesSubtext: boolean) {\n const selected = this.values.includes(option.value);\n const active = this.activeIndex === index;\n return (\n <ChoiceOptionRow\n id={`${this.generatedId}-option-${index}`}\n option={option}\n selected={selected}\n active={active}\n focusRingVisible={this.focusRingVisible}\n usesSubtext={usesSubtext}\n leading={(\n <span class=\"ds-choice-item__icon ds-interaction-fill__content\" aria-hidden=\"true\">\n <ds-checkbox\n class=\"select-option__checkbox\"\n label=\"\"\n size=\"md\"\n checked={selected}\n presentation\n />\n </span>\n )}\n onHover={() => {\n this.focusRingVisible = false;\n this.activeIndex = index;\n }}\n onSelect={() => this.toggleOption(option)}\n />\n );\n }\n\n render() {\n const inactive = this.isDisabled;\n const count = this.resolvedValues.length;\n const textVariant = CONTROL_TEXT_VARIANT[this.size];\n const iconSize = ICON_SIZE[this.size];\n const usesOptionSubtext = choiceListUsesSubtext(this.allOptions);\n const showError = this.error && Boolean(this.errorMessage);\n const describedBy = [this.ariaDescribedby, showError ? this.errorId : undefined]\n .filter(Boolean)\n .join(' ') || undefined;\n const popupStyle = {\n position: 'fixed',\n left: '0',\n top: '0',\n transform: `translate(${Math.round(this.position.x)}px, ${Math.round(this.position.y)}px)`,\n zIndex: 'var(--dimension-z-index-floating)',\n visibility: this.positionReady ? 'visible' : 'hidden',\n };\n let flatIndex = 0;\n\n return (\n <Host\n class={{\n 'select-host': true,\n 'ds-control-inactive': inactive,\n 'ds-control--md': this.size === 'md',\n 'ds-control--sm': this.size === 'sm',\n 'ds-control--xs': this.size === 'xs',\n ...controlWidthClass(this.width),\n [`select-host--background-${this.background}`]: !!this.background,\n }}\n >\n <button\n ref={element => {\n this.triggerEl = (element as HTMLButtonElement) ?? null;\n }}\n id={this.inputId ?? this.generatedId}\n type=\"button\"\n class={{\n trigger: true,\n 'ds-focus-ring-inset': true,\n 'ds-interaction-fill': true,\n 'ds-interaction-fill--selected':\n !inactive && this.activeFill && this.hasSelection,\n 'trigger--bordered': this.hasBorder || this.error,\n 'trigger--has-value': this.hasSelection,\n 'wrapper--error': this.error,\n [`ds-control--${this.size}`]: true,\n ...choiceBackgroundClassMap(this.background),\n }}\n disabled={inactive}\n role=\"combobox\"\n aria-haspopup=\"listbox\"\n aria-expanded={String(this.open)}\n aria-controls={this.open ? this.listboxId : undefined}\n aria-activedescendant={this.open && !this.searchable ? this.activeOptionId : undefined}\n aria-label={this.ariaLabel}\n aria-labelledby={this.ariaLabelledby}\n aria-describedby={describedBy}\n aria-invalid={this.error ? 'true' : undefined}\n aria-required={this.required || undefined}\n aria-busy={this.isLoading ? 'true' : undefined}\n onClick={() => (this.open ? this.closePopup() : this.openPopup(false))}\n onKeyDown={this.handleTriggerKeyDown}\n >\n {(this.icon || this.isLoading) && (\n <span class=\"trigger__prefix ds-interaction-fill__content\" aria-hidden=\"true\">\n {this.isLoading ? (\n <ds-loader size={iconSize} color=\"inherit\" />\n ) : (\n <ds-icon name={this.icon} size={iconSize} color=\"inherit\" />\n )}\n </span>\n )}\n <ds-text\n class=\"trigger__label ds-interaction-fill__content\"\n as=\"span\"\n variant={textVariant}\n color=\"inherit\"\n lineTruncation={1}\n >\n {`${this.placeholder}${count > 0 ? ` · ${count}` : ''}`}\n </ds-text>\n <span class=\"trigger__chevron ds-interaction-fill__content\" aria-hidden=\"true\">\n <ds-icon name=\"ChevronDown\" size={iconSize} color=\"inherit\" />\n </span>\n </button>\n\n {this.open && (\n <div\n ref={element => {\n this.popupEl = (element as HTMLDivElement) ?? null;\n }}\n class=\"select-popup ds-choice-popup\"\n style={popupStyle}\n >\n {this.searchable && (\n <ChoiceSearch\n value={this.searchTerm}\n placeholder={this.searchPlaceholder}\n controls={this.listboxId}\n activeDescendant={this.activeOptionId}\n inputRef={element => {\n this.searchEl = element;\n }}\n clearLabel={this.clearLabel}\n onValueChange={value => {\n this.searchTerm = value;\n }}\n onKeyDown={event => this.handleListKeyDown(event)}\n />\n )}\n <div\n id={this.listboxId}\n class=\"ds-choice-list\"\n role=\"listbox\"\n aria-multiselectable=\"true\"\n aria-label={this.ariaLabel ?? this.placeholder}\n aria-busy={this.isLoading ? 'true' : undefined}\n >\n {this.isLoading ? (\n <div\n class=\"ds-choice-loading\"\n role=\"option\"\n aria-selected=\"false\"\n aria-disabled=\"true\"\n aria-label={this.loadingLabel}\n aria-live=\"polite\"\n >\n <ds-loader size=\"md\" color=\"inherit\" />\n </div>\n ) : this.visibleOptions.length === 0 ? (\n <div\n class=\"ds-choice-empty\"\n role=\"option\"\n aria-selected=\"false\"\n aria-disabled=\"true\"\n aria-label={this.noResultsText}\n aria-live=\"polite\"\n >\n <ds-empty-state body={this.noResultsText} />\n </div>\n ) : (\n this.visibleSections.map(section => (\n <div\n class={{\n 'ds-choice-section': true,\n 'ds-choice-section--divided': !!section.divider,\n }}\n role={section.header ? 'group' : undefined}\n aria-label={section.header}\n >\n {section.header && (\n <ds-text\n class=\"ds-choice-section__header ds-control--md\"\n as=\"span\"\n variant=\"text-body-small\"\n emphasis\n color=\"primary\"\n aria-hidden=\"true\"\n >\n {section.header}\n </ds-text>\n )}\n {section.options.map(option => this.renderOption(\n option,\n flatIndex++,\n usesOptionSubtext,\n ))}\n </div>\n ))\n )}\n </div>\n {this.allowClear && this.hasSelection && !this.isLoading && (\n <ChoiceFooter\n summary={`${count} ${this.selectedLabel}`}\n clearLabel={this.clearLabel}\n onClear={this.clearSelection}\n />\n )}\n </div>\n )}\n\n {showError && (\n <ds-text\n class=\"error-text\"\n as=\"div\"\n variant=\"text-body-small\"\n color=\"negative\"\n textId={this.errorId}\n role=\"alert\"\n >\n {this.errorMessage}\n </ds-text>\n )}\n </Host>\n );\n }\n}\n"],"mappings":"goBAAA,MAAMA,EAAiB,IAAM,4/uBCgD7B,MAAMC,EAAyD,CAC7DC,GAAI,KACJC,GAAI,KACJC,GAAI,MAGN,IAAIC,EAAgB,E,MAQPC,EAAWC,EAAA,MAAAD,UAAAE,EANxB,WAAAC,CAAAC,G,2LAWUC,KAAAC,QAA+B,GAE/BD,KAAAE,SAAiC,GAEhBF,KAAAG,OAAmB,GAEJH,KAAAI,KAAgB,MAI/BJ,KAAAK,SAAoB,MAEpBL,KAAAM,SAAoB,MAErCN,KAAAO,gBAA0B,0BAE1BP,KAAAQ,YAAsB,SAEtBR,KAAAS,KAAwB,KAExBT,KAAAU,MAA0B,MAE1BV,KAAAW,WAAsB,MAEtBX,KAAAY,UAAqB,MAErBZ,KAAAa,WAAsB,KAEtBb,KAAAc,UAAqB,KAIrBd,KAAAe,WAAsB,KAEtBf,KAAAgB,WAAqB,QAErBhB,KAAAiB,cAAwB,WAExBjB,KAAAkB,WAAsB,MAEtBlB,KAAAmB,kBAA4B,SAE5BnB,KAAAoB,cAAwB,mBAExBpB,KAAAqB,aAAuB,UAIvBrB,KAAAsB,MAAiB,MAMUtB,KAAAuB,UAA2B,KAa7CvB,KAAAwB,aAAc,EACdxB,KAAAyB,WAAa,GACbzB,KAAA0B,aAAe,MACf1B,KAAA2B,SAAW,CAAEC,EAAG,EAAGC,EAAG,GACtB7B,KAAA8B,cAAgB,MAChB9B,KAAA+B,iBAAmB,MAEnB/B,KAAAgC,YAAc,qBAAqBtC,IACnCM,KAAAiC,UAAY,GAAGjC,KAAKgC,sBACpBhC,KAAAkC,QAAU,GAAGlC,KAAKgC,oBAC3BhC,KAAAmC,UAAsC,KACtCnC,KAAAoC,QAAiC,KACjCpC,KAAAqC,SAAoC,KACpCrC,KAAAsC,cAA0B,GAC1BtC,KAAAuC,UAAY,GACZvC,KAAAwC,eAAuD,KACvDxC,KAAAyC,eAAuD,KACvDzC,KAAA0C,kBAAyC,KA8NzC1C,KAAA2C,eAAkBC,IACxBA,EAAMC,iBACND,EAAME,kBACN9C,KAAKG,OAAS,GACdH,KAAK+C,SAASC,KAAK,IACnBhD,KAAKiD,QAAQD,OACbE,uBAAsB,IAAOlD,KAAKkB,WAAalB,KAAKqC,UAAUc,QAAUnD,KAAKmC,WAAWgB,SAAS,EAqE3FnD,KAAAoD,qBAAwBR,IAC9B,IAAK5C,KAAKI,KAAM,CACd,GAAI,CAAC,YAAa,UAAW,QAAS,KAAKiD,SAAST,EAAMU,KAAM,CAC9DV,EAAMC,iBACN7C,KAAKuD,UAAU,KAAMX,EAAMU,MAAQ,UAAY,OAAS,Q,MACnD,GAAIV,EAAMU,IAAIE,SAAW,IAAMZ,EAAMa,UAAYb,EAAMc,UAAYd,EAAMe,OAAQ,CACtFf,EAAMC,iBACN7C,KAAKuD,UAAU,MACf,GAAIvD,KAAKkB,WAAYlB,KAAKyB,WAAamB,EAAMU,SACxCtD,KAAK4D,gBAAgBhB,EAAMU,I,CAElC,M,CAEFtD,KAAK6D,kBAAkBjB,EAAM,CAwOhC,CA5hBC,iBAAAkB,GACE9D,KAAKsC,cAAgB,IAAItC,KAAKG,QAC9BH,KAAK+D,e,CAGP,gBAAAC,GACE,GAAIhE,KAAKI,KAAMJ,KAAKiE,aAAa,K,CAGnC,oBAAAC,GACElE,KAAKmE,uBACL,GAAInE,KAAKwC,eAAgB4B,aAAapE,KAAKwC,e,CAU7C,aAAAuB,GACE,MAAMM,EAAiBrE,KAAKqE,eAC5B,GAAIrE,KAAKsE,aAAetE,KAAKuE,MAAQF,EAAeb,SAAW,EAAG,CAChExD,KAAKwE,UAAUC,aAAa,K,KACvB,CACL,MAAMC,EAAO,IAAIC,SACjBN,EAAeO,SAAQC,GAASH,EAAKI,OAAO9E,KAAKuE,KAAgBM,KACjE7E,KAAKwE,UAAUC,aAAaC,EAAMK,KAAKC,UAAUX,G,CAEnD,MAAMY,EAAUjF,KAAKM,WAAaN,KAAKsE,YAAcD,EAAeb,SAAW,EAC/ExD,KAAKwE,UAAUU,YAAYD,EAAU,CAAEE,aAAc,MAAS,GAAIF,EAAUjF,KAAKO,gBAAkB,IACnG,GAAIP,KAAKI,KAAM,CACb,MAAMgF,EAAUC,EAAqBrF,KAAKsF,gBAC1C,IAAKF,EAAQ/B,SAASrD,KAAKwB,aAAcxB,KAAKwB,YAAc4D,EAAQ,KAAM,EAC1ElC,uBAAsB,IAAMlD,KAAKuF,kB,EAKrC,eAAAC,GACE,GAAIxF,KAAKI,KAAM8C,uBAAsB,IAAMlD,KAAKuF,kB,CAIlD,YAAAtB,CAAa7D,GACXJ,KAAKyF,aAAazC,KAAK5C,GACvB,GAAIA,EAAM,CACRJ,KAAK0F,qBACL1F,KAAK8B,cAAgB,MACrBoB,uBAAsB,KACpBlD,KAAKuF,iBACLvF,KAAK2F,6BACL,GAAI3F,KAAKkB,WAAYlB,KAAKqC,UAAUc,OAAO,G,KAExC,CACLnD,KAAKmE,uBACLnE,KAAKyB,WAAa,GAClBzB,KAAK8B,cAAgB,K,EAKzB,kBAAA8D,GACE5F,KAAKwB,YAAc6D,EAAqBrF,KAAKsF,gBAAgB,KAAM,EACnEpC,uBAAsB,KACpBlD,KAAKuF,iBACLvF,KAAK2F,4BAA4B,G,CAKrC,mBAAAE,GACE3C,uBAAsB,IAAMlD,KAAK2F,8B,CAGnC,oBAAAG,CAAqBzF,GACnBL,KAAK0B,aAAerB,EACpBL,KAAK+D,e,CAGP,iBAAAgC,GACE/F,KAAKG,OAAS,IAAIH,KAAKsC,eACvBtC,KAAKgG,Y,CAGP,wBAAAC,CAAyBC,GACvB,UAAWA,IAAU,SAAU,CAC7BlG,KAAKG,OAAS,GACd,M,CAEF,IACE,MAAMgG,EAAWpB,KAAKqB,MAAMF,GAC5BlG,KAAKG,OAASkG,MAAMC,QAAQH,GACxBA,EAASI,QAAQ1B,UAAkCA,IAAU,WAC7D,E,CACJ,MACA7E,KAAKG,OAAS,E,EAKlB,cAAMqG,GACJxG,KAAKmC,WAAWgB,O,CAGlB,cAAYmB,GACV,OAAOtE,KAAKK,UAAYL,KAAKW,YAAcX,KAAK0B,Y,CAGlD,eAAY+E,GACV,OAAOC,EAAsB1G,KAAKC,QAASD,KAAKE,S,CAGlD,cAAYyG,GACV,OAAOC,EAAsB5G,KAAKyG,Y,CAGpC,mBAAYI,GACV,OAAO7G,KAAKkB,WACR4F,EAAqB9G,KAAKyG,YAAazG,KAAKyB,YAC5CzB,KAAKyG,W,CAGX,kBAAYnB,GACV,OAAOsB,EAAsB5G,KAAK6G,gB,CAGpC,kBAAYxC,GACV,MAAM0C,EAAQ,IAAIC,IAAIhH,KAAK2G,WAAWM,KAAIC,GAAUA,EAAOrC,SAC3D,MAAO,IAAI,IAAImC,IAAIhH,KAAKG,OAAOoG,QAAO1B,GAASkC,EAAMI,IAAItC,M,CAG3D,gBAAYuC,GACV,OAAOpH,KAAKqE,eAAeb,OAAS,C,CAGtC,kBAAY6D,GACV,OAAQrH,KAAKY,WAAaZ,KAAKwB,aAAe,EAC1C,GAAGxB,KAAKgC,sBAAsBhC,KAAKwB,cACnC8F,S,CAGE,0BAAA3B,GACN,IAAK3F,KAAKI,OAASJ,KAAKqH,eAAgB,OACxCrH,KAAKuH,GACFC,cAA2B,IAAIxH,KAAKqH,mBACnCI,eAAe,CAAEC,MAAO,UAAWC,OAAQ,W,CAGzC,kBAAAjC,GACN1F,KAAKmE,uBACLnE,KAAKyC,eAAiBG,IACpB,GAAI5C,KAAKuH,GAAGK,SAAShF,EAAMiF,QAAiB,OAC5C7H,KAAKgG,YAAY,EAEnBhG,KAAK0C,kBAAoB,IAAM1C,KAAKuF,iBACpCuC,SAASC,iBAAiB,YAAa/H,KAAKyC,eAAgB,MAC5DuF,OAAOD,iBAAiB,SAAU/H,KAAK0C,kBAAmB,MAC1DsF,OAAOD,iBAAiB,SAAU/H,KAAK0C,kB,CAGjC,oBAAAyB,GACN,GAAInE,KAAKyC,eAAgB,CACvBqF,SAASG,oBAAoB,YAAajI,KAAKyC,eAAgB,MAC/DzC,KAAKyC,eAAiB,I,CAExB,GAAIzC,KAAK0C,kBAAmB,CAC1BsF,OAAOC,oBAAoB,SAAUjI,KAAK0C,kBAAmB,MAC7DsF,OAAOC,oBAAoB,SAAUjI,KAAK0C,mBAC1C1C,KAAK0C,kBAAoB,I,EAIrB,cAAA6C,GACN,IAAKvF,KAAKI,OAASJ,KAAKmC,YAAcnC,KAAKoC,QAAS,OACpD,MAAM8F,EAAiBC,EAAmBC,EAAeC,SAAUD,EAAeC,UAClFrI,KAAKoC,QAAQkG,MAAMC,SAAW,GAAGvI,KAAKmC,UAAUqG,YAAcN,EAAiB,MAC/ElI,KAAK2B,SAAW8G,EAA6B,CAC3CC,WAAY1I,KAAKmC,UAAUwG,wBAC3BC,WAAY5I,KAAKoC,QAAQoG,YACzBK,YAAa7I,KAAKoC,QAAQ0G,aAC1BC,KAAM,SACNC,MAAO,QACPC,aAAcf,EACdgB,eAAgBhB,EAChBiB,cAAejB,EACfkB,cAAepB,OAAOqB,WACtBC,eAAgBtB,OAAOuB,cAEzBvJ,KAAK8B,cAAgB,I,CAGf,SAAAyB,CAAUiG,EAAuBC,GACvC,GAAIzJ,KAAKsE,aAAgBtE,KAAK2G,WAAWnD,SAAWxD,KAAKY,UAAY,OACrE,MAAMwE,EAAUC,EAAqBrF,KAAKsF,gBAC1CtF,KAAKwB,YACHiI,IAAS,OACJrE,EAAQA,EAAQ5B,OAAS,KAAM,EAC/B4B,EAAQ,KAAM,EACrBpF,KAAK+B,iBAAmByH,EACxBxJ,KAAKI,KAAO,I,CAGN,UAAA4F,CAAW0D,EAAe,OAChC,IAAK1J,KAAKI,KAAM,OAChBJ,KAAKI,KAAO,MACZ,GAAIsJ,EAAcxG,uBAAsB,IAAMlD,KAAKmC,WAAWgB,S,CAGxD,YAAAwG,CAAazC,GACnB,GAAIA,EAAOvG,YAAcX,KAAKY,UAAW,OACzC,MAAMgJ,EAAU5J,KAAKqE,eACrB,MAAMwF,EAAOD,EAAQvG,SAAS6D,EAAOrC,OACjC+E,EAAQrD,QAAO1B,GAASA,IAAUqC,EAAOrC,QACzC,IAAI+E,EAAS1C,EAAOrC,OACxB7E,KAAKG,OAAS0J,EACd7J,KAAK+C,SAASC,KAAK,IAAI6G,G,CAYjB,eAAAjG,CAAgBN,GACtB,GAAItD,KAAKwC,eAAgB4B,aAAapE,KAAKwC,gBAC3CxC,KAAK+B,iBAAmB,KACxB,MAAM+H,EAAaxG,EAAIyG,oBACvB,MAAMC,EACJhK,KAAKuC,UAAUiB,OAAS,GACxB,IAAIxD,KAAKuC,WAAW0H,OAAMC,GAAaA,IAAcJ,IACvD9J,KAAKuC,UAAYyH,EAAoBF,EAAa,GAAG9J,KAAKuC,YAAYuH,IACtE,MAAMK,EAAQC,EAAyBpK,KAAKsF,eAAgBtF,KAAKuC,UAAWvC,KAAKwB,aACjF,GAAI2I,GAAS,EAAGnK,KAAKwB,YAAc2I,EACnC,MAAME,EAAUC,EACdlC,EAAemC,yBACfnC,EAAemC,0BAEjBvK,KAAKwC,eAAiBgI,YAAW,KAC/BxK,KAAKuC,UAAY,GACjBvC,KAAKwC,eAAiB,IAAI,GACzB6H,E,CAGG,iBAAAxG,CAAkBjB,GACxB,OAAQA,EAAMU,KACZ,IAAK,YACHV,EAAMC,iBACN7C,KAAK+B,iBAAmB,KACxB/B,KAAKwB,YAAciJ,EAAgBzK,KAAKsF,eAAgBtF,KAAKwB,YAAa,GAC1E,MACF,IAAK,UACHoB,EAAMC,iBACN7C,KAAK+B,iBAAmB,KACxB/B,KAAKwB,YAAciJ,EAAgBzK,KAAKsF,eAAgBtF,KAAKwB,aAAa,GAC1E,MACF,IAAK,OACHoB,EAAMC,iBACN7C,KAAK+B,iBAAmB,KACxB/B,KAAKwB,YAAc6D,EAAqBrF,KAAKsF,gBAAgB,KAAM,EACnE,MACF,IAAK,MAAO,CACV1C,EAAMC,iBACN7C,KAAK+B,iBAAmB,KACxB,MAAMqD,EAAUC,EAAqBrF,KAAKsF,gBAC1CtF,KAAKwB,YAAc4D,EAAQA,EAAQ5B,OAAS,KAAM,EAClD,K,CAEF,IAAK,QACL,IAAK,IAAK,CACR,GAAIZ,EAAMU,MAAQ,KAAOtD,KAAKkB,YAAc0B,EAAMiF,SAAW7H,KAAKqC,SAAU,MAC5EO,EAAMC,iBACN,MAAMqE,EAASlH,KAAKsF,eAAetF,KAAKwB,aACxC,GAAI0F,EAAQlH,KAAK2J,aAAazC,GAC9B,K,CAEF,IAAK,SACHtE,EAAMC,iBACN7C,KAAKgG,WAAW,MAChB,MACF,IAAK,MACHhG,KAAKgG,aACL,MACF,QACE,IAAKhG,KAAKkB,YAAc0B,EAAMU,IAAIE,SAAW,IAAMZ,EAAMa,UAAYb,EAAMc,UAAYd,EAAMe,OAAQ,CACnG3D,KAAK4D,gBAAgBhB,EAAMU,I,GAqB3B,YAAAoH,CAAaxD,EAA2ByD,EAAeC,GAC7D,MAAMC,EAAW7K,KAAKG,OAAOkD,SAAS6D,EAAOrC,OAC7C,MAAMiG,EAAS9K,KAAKwB,cAAgBmJ,EACpC,OACEI,EAACC,EAAe,CACdC,GAAI,GAAGjL,KAAKgC,sBAAsB2I,IAClCzD,OAAQA,EACR2D,SAAUA,EACVC,OAAQA,EACR/I,iBAAkB/B,KAAK+B,iBACvB6I,YAAaA,EACbM,QACEH,EAAA,QAAMI,MAAM,oDAAmD,cAAa,QAC1EJ,EAAA,eACEI,MAAM,0BACNC,MAAM,GACN3K,KAAK,KACL4K,QAASR,EACTS,aAAY,QAIlBC,QAAS,KACLvL,KAAK+B,iBAAmB,MACxB/B,KAAKwB,YAAcmJ,CAAK,EAE5Ba,SAAU,IAAMxL,KAAK2J,aAAazC,I,CAKxC,MAAAuE,GACE,MAAMC,EAAW1L,KAAKsE,WACtB,MAAMqH,EAAQ3L,KAAKqE,eAAeb,OAClC,MAAMoI,EAAcC,EAAqB7L,KAAKS,MAC9C,MAAMqL,EAAWxM,EAAUU,KAAKS,MAChC,MAAMsL,EAAoBC,EAAsBhM,KAAK2G,YACrD,MAAMsF,EAAYjM,KAAKsB,OAAS4K,QAAQlM,KAAKmM,cAC7C,MAAMC,EAAc,CAACpM,KAAKqM,gBAAiBJ,EAAYjM,KAAKkC,QAAUoF,WACnEf,OAAO2F,SACPI,KAAK,MAAQhF,UAChB,MAAMiF,EAAa,CACjB5K,SAAU,QACV6K,KAAM,IACNC,IAAK,IACLC,UAAW,aAAaC,KAAKC,MAAM5M,KAAK2B,SAASC,SAAS+K,KAAKC,MAAM5M,KAAK2B,SAASE,QACnFgL,OAAQ,oCACRC,WAAY9M,KAAK8B,cAAgB,UAAY,UAE/C,IAAIiL,EAAY,EAEhB,OACEhC,EAACiC,EAAI,CAAA1J,IAAA,2CACH6H,MAAO,CACL,cAAe,KACf,sBAAuBO,EACvB,iBAAkB1L,KAAKS,OAAS,KAChC,iBAAkBT,KAAKS,OAAS,KAChC,iBAAkBT,KAAKS,OAAS,QAC7BwM,EAAkBjN,KAAKU,OAC1B,CAAC,2BAA2BV,KAAKkN,gBAAiBlN,KAAKkN,aAGzDnC,EAAA,UAAAzH,IAAA,2CACE6J,IAAKC,IACHpN,KAAKmC,UAAaiL,GAAiC,IAAI,EAEzDnC,GAAIjL,KAAKqN,SAAWrN,KAAKgC,YACzBsL,KAAK,SACLnC,MAAO,CACLoC,QAAS,KACT,sBAAuB,KACvB,sBAAuB,KACvB,iCACG7B,GAAY1L,KAAKa,YAAcb,KAAKoH,aACvC,oBAAqBpH,KAAKc,WAAad,KAAKsB,MAC5C,qBAAsBtB,KAAKoH,aAC3B,iBAAkBpH,KAAKsB,MACvB,CAAC,eAAetB,KAAKS,QAAS,QAC3B+M,EAAyBxN,KAAKkN,aAEnC7M,SAAUqL,EACV+B,KAAK,WAAU,gBACD,UAAS,gBACRC,OAAO1N,KAAKI,MAAK,gBACjBJ,KAAKI,KAAOJ,KAAKiC,UAAYqF,UAAS,wBAC9BtH,KAAKI,OAASJ,KAAKkB,WAAalB,KAAKqH,eAAiBC,UAAS,aAC1EtH,KAAKuB,UAAS,kBACTvB,KAAK2N,eAAc,mBAClBvB,EAAW,eACfpM,KAAKsB,MAAQ,OAASgG,UAAS,gBAC9BtH,KAAKM,UAAYgH,UAAS,YAC9BtH,KAAKY,UAAY,OAAS0G,UACrCsG,QAAS,IAAO5N,KAAKI,KAAOJ,KAAKgG,aAAehG,KAAKuD,UAAU,OAC/DsK,UAAW7N,KAAKoD,uBAEdpD,KAAK8N,MAAQ9N,KAAKY,YAClBmK,EAAA,QAAAzH,IAAA,2CAAM6H,MAAM,+CAA8C,cAAa,QACpEnL,KAAKY,UACJmK,EAAA,aAAWtK,KAAMqL,EAAUiC,MAAM,YAEjChD,EAAA,WAASxG,KAAMvE,KAAK8N,KAAMrN,KAAMqL,EAAUiC,MAAM,aAItDhD,EAAA,WAAAzH,IAAA,2CACE6H,MAAM,8CACN6C,GAAG,OACHC,QAASrC,EACTmC,MAAM,UACNG,eAAgB,GAEf,GAAGlO,KAAKQ,cAAcmL,EAAQ,EAAI,MAAMA,IAAU,MAErDZ,EAAA,QAAAzH,IAAA,2CAAM6H,MAAM,gDAA+C,cAAa,QACtEJ,EAAA,WAAAzH,IAAA,2CAASiB,KAAK,cAAc9D,KAAMqL,EAAUiC,MAAM,cAIrD/N,KAAKI,MACJ2K,EAAA,OAAAzH,IAAA,2CACE6J,IAAKC,IACHpN,KAAKoC,QAAWgL,GAA8B,IAAI,EAEpDjC,MAAM,+BACN7C,MAAOiE,GAENvM,KAAKkB,YACJ6J,EAACoD,EAAY,CAAA7K,IAAA,2CACXuB,MAAO7E,KAAKyB,WACZjB,YAAaR,KAAKmB,kBAClBiN,SAAUpO,KAAKiC,UACfoM,iBAAkBrO,KAAKqH,eACvBiH,SAAUlB,IACRpN,KAAKqC,SAAW+K,CAAO,EAEzBpM,WAAYhB,KAAKgB,WACjBuN,cAAe1J,IACb7E,KAAKyB,WAAaoD,CAAK,EAEzBgJ,UAAWjL,GAAS5C,KAAK6D,kBAAkBjB,KAG/CmI,EAAA,OAAAzH,IAAA,2CACE2H,GAAIjL,KAAKiC,UACTkJ,MAAM,iBACNsC,KAAK,UAAS,uBACO,OAAM,aACfzN,KAAKuB,WAAavB,KAAKQ,YAAW,YACnCR,KAAKY,UAAY,OAAS0G,WAEpCtH,KAAKY,UACJmK,EAAA,OACEI,MAAM,oBACNsC,KAAK,SAAQ,gBACC,QAAO,gBACP,OAAM,aACRzN,KAAKqB,aAAY,YACnB,UAEV0J,EAAA,aAAWtK,KAAK,KAAKsN,MAAM,aAE3B/N,KAAKsF,eAAe9B,SAAW,EACjCuH,EAAA,OACEI,MAAM,kBACNsC,KAAK,SAAQ,gBACC,QAAO,gBACP,OAAM,aACRzN,KAAKoB,cAAa,YACpB,UAEV2J,EAAA,kBAAgByD,KAAMxO,KAAKoB,iBAG7BpB,KAAK6G,gBAAgBI,KAAIwH,GACvB1D,EAAA,OACEI,MAAO,CACL,oBAAqB,KACrB,+BAAgCsD,EAAQC,SAE1CjB,KAAMgB,EAAQE,OAAS,QAAUrH,UAAS,aAC9BmH,EAAQE,QAEnBF,EAAQE,QACP5D,EAAA,WACEI,MAAM,2CACN6C,GAAG,OACHC,QAAQ,kBACRW,SAAQ,KACRb,MAAM,UAAS,cACH,QAEXU,EAAQE,QAGZF,EAAQxO,QAAQgH,KAAIC,GAAUlH,KAAK0K,aAClCxD,EACA6F,IACAhB,SAMT/L,KAAKe,YAAcf,KAAKoH,eAAiBpH,KAAKY,WAC7CmK,EAAC8D,EAAY,CAAAvL,IAAA,2CACXwL,QAAS,GAAGnD,KAAS3L,KAAKiB,gBAC1BD,WAAYhB,KAAKgB,WACjB+N,QAAS/O,KAAK2C,kBAMrBsJ,GACClB,EAAA,WAAAzH,IAAA,2CACE6H,MAAM,aACN6C,GAAG,MACHC,QAAQ,kBACRF,MAAM,WACNiB,OAAQhP,KAAKkC,QACbuL,KAAK,SAEJzN,KAAKmM,c","ignoreList":[]}
|
|
1
|
+
{"version":3,"names":["selectMultiCss","ICON_SIZE","md","sm","xs","selectMultiId","POSITION_RETRY_BUDGET","SelectMulti","__stencil_proxyCustomElement","HTMLElement","constructor","registerHost","this","options","sections","values","open","disabled","required","requiredMessage","placeholder","size","width","isInactive","isLoading","activeFill","hasBorder","allowClear","clearLabel","selectedLabel","searchable","searchPlaceholder","noResultsText","loadingLabel","error","ariaLabel","activeIndex","searchTerm","formDisabled","position","x","y","positionReady","focusRingVisible","generatedId","listboxId","errorId","triggerEl","popupEl","searchEl","initialValues","typeahead","typeaheadTimer","outsideHandler","repositionHandler","positionRetryRaf","clearSelection","event","preventDefault","stopPropagation","dsChange","emit","dsClear","requestAnimationFrame","focus","handleTriggerKeyDown","includes","key","openPopup","length","metaKey","ctrlKey","altKey","handleTypeahead","handleListKeyDown","componentWillLoad","syncFormValue","componentDidLoad","onOpenChange","disconnectedCallback","cancelPositionRetry","unbindPopupListeners","clearTimeout","resolvedValues","isDisabled","name","internals","setFormValue","data","FormData","forEach","value","append","JSON","stringify","missing","setValidity","valueMissing","enabled","enabledChoiceIndexes","visibleOptions","updatePosition","onLoadingChange","dsOpenChange","bindPopupListeners","schedulePositionUpdate","scrollActiveOptionIntoView","onSearchTermChange","onActiveIndexChange","formDisabledCallback","formResetCallback","closePopup","formStateRestoreCallback","state","restored","parse","Array","isArray","filter","setFocus","allSections","resolveChoiceSections","allOptions","flattenChoiceSections","visibleSections","filterChoiceSections","valid","Set","map","option","has","hasSelection","activeOptionId","undefined","el","querySelector","scrollIntoView","block","inline","contains","target","document","addEventListener","window","removeEventListener","cancelAnimationFrame","onReady","remaining","attempt","isConnected","sectionPadding","resolveCssLengthPx","TOKEN_DEFAULTS","space050","style","minWidth","offsetWidth","computeAnchoredPopupPosition","anchorRect","getBoundingClientRect","popupWidth","popupHeight","offsetHeight","side","align","sideOffsetPx","alignOffsetPx","viewportPadPx","viewportWidth","innerWidth","viewportHeight","innerHeight","focusVisible","edge","restoreFocus","toggleOption","current","next","normalized","toLocaleLowerCase","repeatedCharacter","every","character","match","findChoiceTypeaheadMatch","resetMs","resolveCssTimeMs","animationDurationMedium1","setTimeout","moveChoiceIndex","renderOption","index","usesSubtext","selected","active","h","ChoiceOptionRow","id","leading","class","label","checked","presentation","onHover","onSelect","render","inactive","count","textVariant","CONTROL_TEXT_VARIANT","iconSize","usesOptionSubtext","choiceListUsesSubtext","showError","Boolean","errorMessage","describedBy","ariaDescribedby","join","popupStyle","left","top","transform","Math","round","zIndex","visibility","flatIndex","Host","controlWidthClass","background","ref","element","inputId","type","trigger","choiceBackgroundClassMap","role","String","ariaLabelledby","onClick","onKeyDown","icon","color","as","variant","lineTruncation","ChoiceSearch","controls","activeDescendant","inputRef","onValueChange","body","section","divider","header","emphasis","ChoiceFooter","summary","onClear","textId"],"sources":["src/wc/components/SelectMulti/SelectMulti.css?tag=ds-select-multi&encapsulation=scoped","src/wc/components/SelectMulti/SelectMulti.tsx"],"sourcesContent":["@import '../Select/Select.css';\n","import {\n AttachInternals,\n Component,\n Element,\n Event,\n EventEmitter,\n h,\n Host,\n Method,\n Prop,\n State,\n Watch,\n} from '@stencil/core';\nimport {\n controlWidthClass,\n CONTROL_TEXT_VARIANT,\n resolveCssLengthPx,\n resolveCssTimeMs,\n TOKEN_DEFAULTS,\n type ControlWidth,\n} from '../../utils';\nimport { computeAnchoredPopupPosition } from '../../utils/anchored-popup';\nimport { ChoiceFooter, ChoiceOptionRow, ChoiceSearch } from '../../utils/choice-list-parts';\nimport {\n choiceBackgroundClassMap,\n choiceListUsesSubtext,\n enabledChoiceIndexes,\n filterChoiceSections,\n findChoiceTypeaheadMatch,\n flattenChoiceSections,\n moveChoiceIndex,\n resolveChoiceSections,\n} from '../../utils/choice-list';\nimport type {\n SelectBackground,\n SelectOption,\n SelectSection,\n SelectSize,\n} from '../Select/Select';\n\nexport type SelectMultiOption = Omit<SelectOption, 'icon'>;\nexport type SelectMultiSection = Omit<SelectSection, 'options'> & {\n options: SelectMultiOption[];\n};\nexport type SelectMultiBackground = SelectBackground;\nexport type SelectMultiSize = SelectSize;\nexport type SelectMultiWidth = ControlWidth;\n\nconst ICON_SIZE: Record<SelectMultiSize, 'md' | 'sm' | 'xs'> = {\n md: 'md',\n sm: 'sm',\n xs: 'xs',\n};\n\nlet selectMultiId = 0;\n/** rAF retries while the conditionally rendered popup mounts. */\nconst POSITION_RETRY_BUDGET = 8;\n\n@Component({\n tag: 'ds-select-multi',\n styleUrl: 'SelectMulti.css',\n scoped: true,\n formAssociated: true,\n})\nexport class SelectMulti {\n @Element() el!: HTMLElement;\n @AttachInternals() internals!: ElementInternals;\n\n /** Flat choices. Assign arrays through the JavaScript property. */\n @Prop() options: SelectMultiOption[] = [];\n /** Grouped choices; takes precedence over options. Assign through JavaScript. */\n @Prop() sections: SelectMultiSection[] = [];\n /** Selected values. Assign arrays through the JavaScript property. */\n @Prop({ mutable: true }) values: string[] = [];\n /** Controlled popup visibility. */\n @Prop({ mutable: true, reflect: true }) open: boolean = false;\n /** Native form field name used for each repeated selected-value entry. */\n @Prop({ reflect: true }) name: string | undefined;\n /** Native disabled state. */\n @Prop({ reflect: true }) disabled: boolean = false;\n /** Require at least one valid selected value. */\n @Prop({ reflect: true }) required: boolean = false;\n /** Validation message used when required is missing. */\n @Prop() requiredMessage: string = 'This field is required.';\n /** Persistent trigger label; selected option labels never replace it. */\n @Prop() placeholder: string = 'Select';\n /** Control density. */\n @Prop() size: SelectMultiSize = 'md';\n /** Width fit — hug content (default) or fill the parent. */\n @Prop() width: SelectMultiWidth = 'hug';\n /** Shared inactive treatment; removes interaction and form submission. */\n @Prop() isInactive: boolean = false;\n /** Replace the prefix with a loader and disable option interaction. */\n @Prop() isLoading: boolean = false;\n /** Show the selected interaction fill when at least one value exists. */\n @Prop() activeFill: boolean = true;\n /** Show the surface-aware inset border. */\n @Prop() hasBorder: boolean = true;\n /** Optional trigger prefix icon name. */\n @Prop() icon: string | undefined;\n /** Show the clear-all footer action when values exist. */\n @Prop() allowClear: boolean = true;\n /** Localized clear-all action label. */\n @Prop() clearLabel: string = 'Clear';\n /** Localized noun displayed after the selected count. */\n @Prop() selectedLabel: string = 'selected';\n /** Show immediate local filtering over option labels, subtext, and section headings. */\n @Prop() searchable: boolean = false;\n /** Localized search-field placeholder and accessible name. */\n @Prop() searchPlaceholder: string = 'Search';\n /** Localized empty-filter result text. */\n @Prop() noResultsText: string = 'No results found';\n /** Accessible loading status label. */\n @Prop() loadingLabel: string = 'Loading';\n /** Actual parent surface context; omit on primary and secondary surfaces. */\n @Prop() background: SelectMultiBackground | undefined;\n /** Show invalid visual state. */\n @Prop() error: boolean = false;\n /** Error text rendered below the trigger when error is true. */\n @Prop() errorMessage: string | undefined;\n /** ID applied to the internal combobox trigger for external labels. */\n @Prop() inputId: string | undefined;\n /** Direct accessible name when no external label is available. */\n @Prop({ attribute: 'aria-label' }) ariaLabel: string | null = null;\n /** IDs of elements that label the combobox. */\n @Prop({ attribute: 'aria-labelledby' }) ariaLabelledby: string | undefined;\n /** Additional IDs that describe the combobox. */\n @Prop({ attribute: 'aria-describedby' }) ariaDescribedby: string | undefined;\n\n /** Emitted after user toggles or clearing with a new values array. */\n @Event() dsChange!: EventEmitter<string[]>;\n /** Emitted after the footer clear-all action. */\n @Event() dsClear!: EventEmitter<void>;\n /** Emitted whenever popup visibility changes. */\n @Event() dsOpenChange!: EventEmitter<boolean>;\n\n @State() private activeIndex = -1;\n @State() private searchTerm = '';\n @State() private formDisabled = false;\n @State() private position = { x: 0, y: 0 };\n @State() private positionReady = false;\n @State() private focusRingVisible = false;\n\n private readonly generatedId = `ds-select-multi-${++selectMultiId}`;\n private readonly listboxId = `${this.generatedId}-listbox`;\n private readonly errorId = `${this.generatedId}-error`;\n private triggerEl: HTMLButtonElement | null = null;\n private popupEl: HTMLDivElement | null = null;\n private searchEl: HTMLInputElement | null = null;\n private initialValues: string[] = [];\n private typeahead = '';\n private typeaheadTimer: ReturnType<typeof setTimeout> | null = null;\n private outsideHandler: ((event: MouseEvent) => void) | null = null;\n private repositionHandler: (() => void) | null = null;\n private positionRetryRaf: number | null = null;\n\n componentWillLoad() {\n this.initialValues = [...this.values];\n this.syncFormValue();\n }\n\n componentDidLoad() {\n if (this.open) this.onOpenChange(true);\n }\n\n disconnectedCallback() {\n this.cancelPositionRetry();\n this.unbindPopupListeners();\n if (this.typeaheadTimer) clearTimeout(this.typeaheadTimer);\n }\n\n @Watch('values')\n @Watch('disabled')\n @Watch('isInactive')\n @Watch('required')\n @Watch('name')\n @Watch('options')\n @Watch('sections')\n syncFormValue() {\n const resolvedValues = this.resolvedValues;\n if (this.isDisabled || !this.name || resolvedValues.length === 0) {\n this.internals.setFormValue(null);\n } else {\n const data = new FormData();\n resolvedValues.forEach(value => data.append(this.name as string, value));\n this.internals.setFormValue(data, JSON.stringify(resolvedValues));\n }\n const missing = this.required && !this.isDisabled && resolvedValues.length === 0;\n this.internals.setValidity(missing ? { valueMissing: true } : {}, missing ? this.requiredMessage : '');\n if (this.open) {\n const enabled = enabledChoiceIndexes(this.visibleOptions);\n if (!enabled.includes(this.activeIndex)) this.activeIndex = enabled[0] ?? -1;\n requestAnimationFrame(() => this.updatePosition());\n }\n }\n\n @Watch('isLoading')\n onLoadingChange() {\n if (this.open) requestAnimationFrame(() => this.updatePosition());\n }\n\n @Watch('open')\n onOpenChange(open: boolean) {\n this.dsOpenChange.emit(open);\n if (open) {\n this.bindPopupListeners();\n this.schedulePositionUpdate(() => {\n this.scrollActiveOptionIntoView();\n if (this.searchable) this.searchEl?.focus();\n });\n } else {\n this.cancelPositionRetry();\n this.unbindPopupListeners();\n this.searchTerm = '';\n this.positionReady = false;\n }\n }\n\n @Watch('searchTerm')\n onSearchTermChange() {\n this.activeIndex = enabledChoiceIndexes(this.visibleOptions)[0] ?? -1;\n requestAnimationFrame(() => {\n this.updatePosition();\n this.scrollActiveOptionIntoView();\n });\n }\n\n @Watch('activeIndex')\n onActiveIndexChange() {\n requestAnimationFrame(() => this.scrollActiveOptionIntoView());\n }\n\n formDisabledCallback(disabled: boolean) {\n this.formDisabled = disabled;\n this.syncFormValue();\n }\n\n formResetCallback() {\n this.values = [...this.initialValues];\n this.closePopup();\n }\n\n formStateRestoreCallback(state: string | File | FormData | null) {\n if (typeof state !== 'string') {\n this.values = [];\n return;\n }\n try {\n const restored = JSON.parse(state);\n this.values = Array.isArray(restored)\n ? restored.filter((value): value is string => typeof value === 'string')\n : [];\n } catch {\n this.values = [];\n }\n }\n\n @Method()\n async setFocus() {\n this.triggerEl?.focus();\n }\n\n private get isDisabled(): boolean {\n return this.disabled || this.isInactive || this.formDisabled;\n }\n\n private get allSections(): SelectMultiSection[] {\n return resolveChoiceSections(this.options, this.sections);\n }\n\n private get allOptions(): SelectMultiOption[] {\n return flattenChoiceSections(this.allSections);\n }\n\n private get visibleSections(): SelectMultiSection[] {\n return this.searchable\n ? filterChoiceSections(this.allSections, this.searchTerm)\n : this.allSections;\n }\n\n private get visibleOptions(): SelectMultiOption[] {\n return flattenChoiceSections(this.visibleSections);\n }\n\n private get resolvedValues(): string[] {\n const valid = new Set(this.allOptions.map(option => option.value));\n return [...new Set(this.values.filter(value => valid.has(value)))];\n }\n\n private get hasSelection(): boolean {\n return this.resolvedValues.length > 0;\n }\n\n private get activeOptionId(): string | undefined {\n return !this.isLoading && this.activeIndex >= 0\n ? `${this.generatedId}-option-${this.activeIndex}`\n : undefined;\n }\n\n private scrollActiveOptionIntoView() {\n if (!this.open || !this.activeOptionId) return;\n this.el\n .querySelector<HTMLElement>(`#${this.activeOptionId}`)\n ?.scrollIntoView({ block: 'nearest', inline: 'nearest' });\n }\n\n private bindPopupListeners() {\n this.unbindPopupListeners();\n this.outsideHandler = event => {\n if (this.el.contains(event.target as Node)) return;\n this.closePopup();\n };\n this.repositionHandler = () => this.updatePosition();\n document.addEventListener('mousedown', this.outsideHandler, true);\n window.addEventListener('scroll', this.repositionHandler, true);\n window.addEventListener('resize', this.repositionHandler);\n }\n\n private unbindPopupListeners() {\n if (this.outsideHandler) {\n document.removeEventListener('mousedown', this.outsideHandler, true);\n this.outsideHandler = null;\n }\n if (this.repositionHandler) {\n window.removeEventListener('scroll', this.repositionHandler, true);\n window.removeEventListener('resize', this.repositionHandler);\n this.repositionHandler = null;\n }\n }\n\n private cancelPositionRetry() {\n if (this.positionRetryRaf !== null) {\n cancelAnimationFrame(this.positionRetryRaf);\n this.positionRetryRaf = null;\n }\n }\n\n /** Retry until the conditionally rendered popup is mounted and measurable. */\n private schedulePositionUpdate(onReady?: () => void) {\n if (!this.open) return;\n\n this.cancelPositionRetry();\n this.positionReady = false;\n let remaining = POSITION_RETRY_BUDGET;\n\n const attempt = () => {\n this.positionRetryRaf = null;\n if (!this.open) return;\n\n if (this.updatePosition()) {\n onReady?.();\n return;\n }\n\n if (remaining > 0) {\n remaining -= 1;\n this.positionRetryRaf = requestAnimationFrame(attempt);\n }\n };\n\n this.positionRetryRaf = requestAnimationFrame(attempt);\n }\n\n /** @returns `true` when the current popup was found and positioned. */\n private updatePosition(): boolean {\n if (\n !this.open ||\n !this.triggerEl ||\n !this.popupEl ||\n !this.popupEl.isConnected ||\n !this.el.contains(this.popupEl)\n ) return false;\n const sectionPadding = resolveCssLengthPx(TOKEN_DEFAULTS.space050, TOKEN_DEFAULTS.space050);\n this.popupEl.style.minWidth = `${this.triggerEl.offsetWidth + sectionPadding * 2}px`;\n this.position = computeAnchoredPopupPosition({\n anchorRect: this.triggerEl.getBoundingClientRect(),\n popupWidth: this.popupEl.offsetWidth,\n popupHeight: this.popupEl.offsetHeight,\n side: 'bottom',\n align: 'start',\n sideOffsetPx: sectionPadding,\n alignOffsetPx: -sectionPadding,\n viewportPadPx: sectionPadding,\n viewportWidth: window.innerWidth,\n viewportHeight: window.innerHeight,\n });\n this.positionReady = true;\n return true;\n }\n\n private openPopup(focusVisible: boolean, edge?: 'first' | 'last') {\n if (this.isDisabled || (!this.allOptions.length && !this.isLoading)) return;\n const enabled = enabledChoiceIndexes(this.visibleOptions);\n this.activeIndex =\n edge === 'last'\n ? (enabled[enabled.length - 1] ?? -1)\n : (enabled[0] ?? -1);\n this.focusRingVisible = focusVisible;\n this.open = true;\n }\n\n private closePopup(restoreFocus = false) {\n if (!this.open) return;\n this.open = false;\n if (restoreFocus) requestAnimationFrame(() => this.triggerEl?.focus());\n }\n\n private toggleOption(option: SelectMultiOption) {\n if (option.isInactive || this.isLoading) return;\n const current = this.resolvedValues;\n const next = current.includes(option.value)\n ? current.filter(value => value !== option.value)\n : [...current, option.value];\n this.values = next;\n this.dsChange.emit([...next]);\n }\n\n private clearSelection = (event: Event) => {\n event.preventDefault();\n event.stopPropagation();\n this.values = [];\n this.dsChange.emit([]);\n this.dsClear.emit();\n requestAnimationFrame(() => (this.searchable ? this.searchEl?.focus() : this.triggerEl?.focus()));\n };\n\n private handleTypeahead(key: string) {\n if (this.typeaheadTimer) clearTimeout(this.typeaheadTimer);\n this.focusRingVisible = true;\n const normalized = key.toLocaleLowerCase();\n const repeatedCharacter =\n this.typeahead.length > 0 &&\n [...this.typeahead].every(character => character === normalized);\n this.typeahead = repeatedCharacter ? normalized : `${this.typeahead}${normalized}`;\n const match = findChoiceTypeaheadMatch(this.visibleOptions, this.typeahead, this.activeIndex);\n if (match >= 0) this.activeIndex = match;\n const resetMs = resolveCssTimeMs(\n TOKEN_DEFAULTS.animationDurationMedium1,\n TOKEN_DEFAULTS.animationDurationMedium1,\n );\n this.typeaheadTimer = setTimeout(() => {\n this.typeahead = '';\n this.typeaheadTimer = null;\n }, resetMs);\n }\n\n private handleListKeyDown(event: KeyboardEvent) {\n switch (event.key) {\n case 'ArrowDown':\n event.preventDefault();\n this.focusRingVisible = true;\n this.activeIndex = moveChoiceIndex(this.visibleOptions, this.activeIndex, 1);\n break;\n case 'ArrowUp':\n event.preventDefault();\n this.focusRingVisible = true;\n this.activeIndex = moveChoiceIndex(this.visibleOptions, this.activeIndex, -1);\n break;\n case 'Home':\n event.preventDefault();\n this.focusRingVisible = true;\n this.activeIndex = enabledChoiceIndexes(this.visibleOptions)[0] ?? -1;\n break;\n case 'End': {\n event.preventDefault();\n this.focusRingVisible = true;\n const enabled = enabledChoiceIndexes(this.visibleOptions);\n this.activeIndex = enabled[enabled.length - 1] ?? -1;\n break;\n }\n case 'Enter':\n case ' ': {\n if (event.key === ' ' && this.searchable && event.target === this.searchEl) break;\n event.preventDefault();\n const option = this.visibleOptions[this.activeIndex];\n if (option) this.toggleOption(option);\n break;\n }\n case 'Escape':\n event.preventDefault();\n this.closePopup(true);\n break;\n case 'Tab':\n this.closePopup();\n break;\n default:\n if (!this.searchable && event.key.length === 1 && !event.metaKey && !event.ctrlKey && !event.altKey) {\n this.handleTypeahead(event.key);\n }\n }\n }\n\n private handleTriggerKeyDown = (event: KeyboardEvent) => {\n if (!this.open) {\n if (['ArrowDown', 'ArrowUp', 'Enter', ' '].includes(event.key)) {\n event.preventDefault();\n this.openPopup(true, event.key === 'ArrowUp' ? 'last' : 'first');\n } else if (event.key.length === 1 && !event.metaKey && !event.ctrlKey && !event.altKey) {\n event.preventDefault();\n this.openPopup(true);\n if (this.searchable) this.searchTerm = event.key;\n else this.handleTypeahead(event.key);\n }\n return;\n }\n this.handleListKeyDown(event);\n };\n\n private renderOption(option: SelectMultiOption, index: number, usesSubtext: boolean) {\n const selected = this.values.includes(option.value);\n const active = this.activeIndex === index;\n return (\n <ChoiceOptionRow\n id={`${this.generatedId}-option-${index}`}\n option={option}\n selected={selected}\n active={active}\n focusRingVisible={this.focusRingVisible}\n usesSubtext={usesSubtext}\n leading={(\n <span class=\"ds-choice-item__icon ds-interaction-fill__content\" aria-hidden=\"true\">\n <ds-checkbox\n class=\"select-option__checkbox\"\n label=\"\"\n size=\"md\"\n checked={selected}\n presentation\n />\n </span>\n )}\n onHover={() => {\n this.focusRingVisible = false;\n this.activeIndex = index;\n }}\n onSelect={() => this.toggleOption(option)}\n />\n );\n }\n\n render() {\n const inactive = this.isDisabled;\n const count = this.resolvedValues.length;\n const textVariant = CONTROL_TEXT_VARIANT[this.size];\n const iconSize = ICON_SIZE[this.size];\n const usesOptionSubtext = choiceListUsesSubtext(this.allOptions);\n const showError = this.error && Boolean(this.errorMessage);\n const describedBy = [this.ariaDescribedby, showError ? this.errorId : undefined]\n .filter(Boolean)\n .join(' ') || undefined;\n const popupStyle = {\n position: 'fixed',\n left: '0',\n top: '0',\n transform: `translate(${Math.round(this.position.x)}px, ${Math.round(this.position.y)}px)`,\n zIndex: 'var(--dimension-z-index-floating)',\n visibility: this.positionReady ? 'visible' : 'hidden',\n };\n let flatIndex = 0;\n\n return (\n <Host\n class={{\n 'select-host': true,\n 'ds-control-inactive': inactive,\n 'ds-control--md': this.size === 'md',\n 'ds-control--sm': this.size === 'sm',\n 'ds-control--xs': this.size === 'xs',\n ...controlWidthClass(this.width),\n [`select-host--background-${this.background}`]: !!this.background,\n }}\n >\n <button\n ref={element => {\n this.triggerEl = (element as HTMLButtonElement) ?? null;\n }}\n id={this.inputId ?? this.generatedId}\n type=\"button\"\n class={{\n trigger: true,\n 'ds-focus-ring-inset': true,\n 'ds-interaction-fill': true,\n 'ds-interaction-fill--selected':\n !inactive && this.activeFill && this.hasSelection,\n 'trigger--bordered': this.hasBorder || this.error,\n 'trigger--has-value': this.hasSelection,\n 'wrapper--error': this.error,\n [`ds-control--${this.size}`]: true,\n ...choiceBackgroundClassMap(this.background),\n }}\n disabled={inactive}\n role=\"combobox\"\n aria-haspopup=\"listbox\"\n aria-expanded={String(this.open)}\n aria-controls={this.open ? this.listboxId : undefined}\n aria-activedescendant={this.open && !this.searchable ? this.activeOptionId : undefined}\n aria-label={this.ariaLabel}\n aria-labelledby={this.ariaLabelledby}\n aria-describedby={describedBy}\n aria-invalid={this.error ? 'true' : undefined}\n aria-required={this.required || undefined}\n aria-busy={this.isLoading ? 'true' : undefined}\n onClick={() => (this.open ? this.closePopup() : this.openPopup(false))}\n onKeyDown={this.handleTriggerKeyDown}\n >\n {(this.icon || this.isLoading) && (\n <span class=\"trigger__prefix ds-interaction-fill__content\" aria-hidden=\"true\">\n {this.isLoading ? (\n <ds-loader size={iconSize} color=\"inherit\" />\n ) : (\n <ds-icon name={this.icon} size={iconSize} color=\"inherit\" />\n )}\n </span>\n )}\n <ds-text\n class=\"trigger__label ds-interaction-fill__content\"\n as=\"span\"\n variant={textVariant}\n color=\"inherit\"\n lineTruncation={1}\n >\n {`${this.placeholder}${count > 0 ? ` · ${count}` : ''}`}\n </ds-text>\n <span class=\"trigger__chevron ds-interaction-fill__content\" aria-hidden=\"true\">\n <ds-icon name=\"ChevronDown\" size={iconSize} color=\"inherit\" />\n </span>\n </button>\n\n {this.open && (\n <div\n ref={element => {\n this.popupEl = (element as HTMLDivElement) ?? null;\n }}\n class=\"select-popup ds-choice-popup\"\n style={popupStyle}\n >\n {this.searchable && (\n <ChoiceSearch\n value={this.searchTerm}\n placeholder={this.searchPlaceholder}\n controls={this.listboxId}\n activeDescendant={this.activeOptionId}\n inputRef={element => {\n this.searchEl = element;\n }}\n clearLabel={this.clearLabel}\n onValueChange={value => {\n this.searchTerm = value;\n }}\n onKeyDown={event => this.handleListKeyDown(event)}\n />\n )}\n <div\n id={this.listboxId}\n class=\"ds-choice-list\"\n role=\"listbox\"\n aria-multiselectable=\"true\"\n aria-label={this.ariaLabel ?? this.placeholder}\n aria-busy={this.isLoading ? 'true' : undefined}\n >\n {this.isLoading ? (\n <div\n class=\"ds-choice-loading\"\n role=\"option\"\n aria-selected=\"false\"\n aria-disabled=\"true\"\n aria-label={this.loadingLabel}\n aria-live=\"polite\"\n >\n <ds-loader size=\"md\" color=\"inherit\" />\n </div>\n ) : this.visibleOptions.length === 0 ? (\n <div\n class=\"ds-choice-empty\"\n role=\"option\"\n aria-selected=\"false\"\n aria-disabled=\"true\"\n aria-label={this.noResultsText}\n aria-live=\"polite\"\n >\n <ds-empty-state body={this.noResultsText} />\n </div>\n ) : (\n this.visibleSections.map(section => (\n <div\n class={{\n 'ds-choice-section': true,\n 'ds-choice-section--divided': !!section.divider,\n }}\n role={section.header ? 'group' : undefined}\n aria-label={section.header}\n >\n {section.header && (\n <ds-text\n class=\"ds-choice-section__header ds-control--md\"\n as=\"span\"\n variant=\"text-body-small\"\n emphasis\n color=\"primary\"\n aria-hidden=\"true\"\n >\n {section.header}\n </ds-text>\n )}\n {section.options.map(option => this.renderOption(\n option,\n flatIndex++,\n usesOptionSubtext,\n ))}\n </div>\n ))\n )}\n </div>\n {this.allowClear && this.hasSelection && !this.isLoading && (\n <ChoiceFooter\n summary={`${count} ${this.selectedLabel}`}\n clearLabel={this.clearLabel}\n onClear={this.clearSelection}\n />\n )}\n </div>\n )}\n\n {showError && (\n <ds-text\n class=\"error-text\"\n as=\"div\"\n variant=\"text-body-small\"\n color=\"negative\"\n textId={this.errorId}\n role=\"alert\"\n >\n {this.errorMessage}\n </ds-text>\n )}\n </Host>\n );\n }\n}\n"],"mappings":"goBAAA,MAAMA,EAAiB,IAAM,4/uBCgD7B,MAAMC,EAAyD,CAC7DC,GAAI,KACJC,GAAI,KACJC,GAAI,MAGN,IAAIC,EAAgB,EAEpB,MAAMC,EAAwB,E,MAQjBC,EAAWC,EAAA,MAAAD,UAAAE,EANxB,WAAAC,CAAAC,G,2LAWUC,KAAAC,QAA+B,GAE/BD,KAAAE,SAAiC,GAEhBF,KAAAG,OAAmB,GAEJH,KAAAI,KAAgB,MAI/BJ,KAAAK,SAAoB,MAEpBL,KAAAM,SAAoB,MAErCN,KAAAO,gBAA0B,0BAE1BP,KAAAQ,YAAsB,SAEtBR,KAAAS,KAAwB,KAExBT,KAAAU,MAA0B,MAE1BV,KAAAW,WAAsB,MAEtBX,KAAAY,UAAqB,MAErBZ,KAAAa,WAAsB,KAEtBb,KAAAc,UAAqB,KAIrBd,KAAAe,WAAsB,KAEtBf,KAAAgB,WAAqB,QAErBhB,KAAAiB,cAAwB,WAExBjB,KAAAkB,WAAsB,MAEtBlB,KAAAmB,kBAA4B,SAE5BnB,KAAAoB,cAAwB,mBAExBpB,KAAAqB,aAAuB,UAIvBrB,KAAAsB,MAAiB,MAMUtB,KAAAuB,UAA2B,KAa7CvB,KAAAwB,aAAc,EACdxB,KAAAyB,WAAa,GACbzB,KAAA0B,aAAe,MACf1B,KAAA2B,SAAW,CAAEC,EAAG,EAAGC,EAAG,GACtB7B,KAAA8B,cAAgB,MAChB9B,KAAA+B,iBAAmB,MAEnB/B,KAAAgC,YAAc,qBAAqBvC,IACnCO,KAAAiC,UAAY,GAAGjC,KAAKgC,sBACpBhC,KAAAkC,QAAU,GAAGlC,KAAKgC,oBAC3BhC,KAAAmC,UAAsC,KACtCnC,KAAAoC,QAAiC,KACjCpC,KAAAqC,SAAoC,KACpCrC,KAAAsC,cAA0B,GAC1BtC,KAAAuC,UAAY,GACZvC,KAAAwC,eAAuD,KACvDxC,KAAAyC,eAAuD,KACvDzC,KAAA0C,kBAAyC,KACzC1C,KAAA2C,iBAAkC,KAuQlC3C,KAAA4C,eAAkBC,IACxBA,EAAMC,iBACND,EAAME,kBACN/C,KAAKG,OAAS,GACdH,KAAKgD,SAASC,KAAK,IACnBjD,KAAKkD,QAAQD,OACbE,uBAAsB,IAAOnD,KAAKkB,WAAalB,KAAKqC,UAAUe,QAAUpD,KAAKmC,WAAWiB,SAAS,EAqE3FpD,KAAAqD,qBAAwBR,IAC9B,IAAK7C,KAAKI,KAAM,CACd,GAAI,CAAC,YAAa,UAAW,QAAS,KAAKkD,SAAST,EAAMU,KAAM,CAC9DV,EAAMC,iBACN9C,KAAKwD,UAAU,KAAMX,EAAMU,MAAQ,UAAY,OAAS,Q,MACnD,GAAIV,EAAMU,IAAIE,SAAW,IAAMZ,EAAMa,UAAYb,EAAMc,UAAYd,EAAMe,OAAQ,CACtFf,EAAMC,iBACN9C,KAAKwD,UAAU,MACf,GAAIxD,KAAKkB,WAAYlB,KAAKyB,WAAaoB,EAAMU,SACxCvD,KAAK6D,gBAAgBhB,EAAMU,I,CAElC,M,CAEFvD,KAAK8D,kBAAkBjB,EAAM,CAwOhC,CArkBC,iBAAAkB,GACE/D,KAAKsC,cAAgB,IAAItC,KAAKG,QAC9BH,KAAKgE,e,CAGP,gBAAAC,GACE,GAAIjE,KAAKI,KAAMJ,KAAKkE,aAAa,K,CAGnC,oBAAAC,GACEnE,KAAKoE,sBACLpE,KAAKqE,uBACL,GAAIrE,KAAKwC,eAAgB8B,aAAatE,KAAKwC,e,CAU7C,aAAAwB,GACE,MAAMO,EAAiBvE,KAAKuE,eAC5B,GAAIvE,KAAKwE,aAAexE,KAAKyE,MAAQF,EAAed,SAAW,EAAG,CAChEzD,KAAK0E,UAAUC,aAAa,K,KACvB,CACL,MAAMC,EAAO,IAAIC,SACjBN,EAAeO,SAAQC,GAASH,EAAKI,OAAOhF,KAAKyE,KAAgBM,KACjE/E,KAAK0E,UAAUC,aAAaC,EAAMK,KAAKC,UAAUX,G,CAEnD,MAAMY,EAAUnF,KAAKM,WAAaN,KAAKwE,YAAcD,EAAed,SAAW,EAC/EzD,KAAK0E,UAAUU,YAAYD,EAAU,CAAEE,aAAc,MAAS,GAAIF,EAAUnF,KAAKO,gBAAkB,IACnG,GAAIP,KAAKI,KAAM,CACb,MAAMkF,EAAUC,EAAqBvF,KAAKwF,gBAC1C,IAAKF,EAAQhC,SAAStD,KAAKwB,aAAcxB,KAAKwB,YAAc8D,EAAQ,KAAM,EAC1EnC,uBAAsB,IAAMnD,KAAKyF,kB,EAKrC,eAAAC,GACE,GAAI1F,KAAKI,KAAM+C,uBAAsB,IAAMnD,KAAKyF,kB,CAIlD,YAAAvB,CAAa9D,GACXJ,KAAK2F,aAAa1C,KAAK7C,GACvB,GAAIA,EAAM,CACRJ,KAAK4F,qBACL5F,KAAK6F,wBAAuB,KAC1B7F,KAAK8F,6BACL,GAAI9F,KAAKkB,WAAYlB,KAAKqC,UAAUe,OAAO,G,KAExC,CACLpD,KAAKoE,sBACLpE,KAAKqE,uBACLrE,KAAKyB,WAAa,GAClBzB,KAAK8B,cAAgB,K,EAKzB,kBAAAiE,GACE/F,KAAKwB,YAAc+D,EAAqBvF,KAAKwF,gBAAgB,KAAM,EACnErC,uBAAsB,KACpBnD,KAAKyF,iBACLzF,KAAK8F,4BAA4B,G,CAKrC,mBAAAE,GACE7C,uBAAsB,IAAMnD,KAAK8F,8B,CAGnC,oBAAAG,CAAqB5F,GACnBL,KAAK0B,aAAerB,EACpBL,KAAKgE,e,CAGP,iBAAAkC,GACElG,KAAKG,OAAS,IAAIH,KAAKsC,eACvBtC,KAAKmG,Y,CAGP,wBAAAC,CAAyBC,GACvB,UAAWA,IAAU,SAAU,CAC7BrG,KAAKG,OAAS,GACd,M,CAEF,IACE,MAAMmG,EAAWrB,KAAKsB,MAAMF,GAC5BrG,KAAKG,OAASqG,MAAMC,QAAQH,GACxBA,EAASI,QAAQ3B,UAAkCA,IAAU,WAC7D,E,CACJ,MACA/E,KAAKG,OAAS,E,EAKlB,cAAMwG,GACJ3G,KAAKmC,WAAWiB,O,CAGlB,cAAYoB,GACV,OAAOxE,KAAKK,UAAYL,KAAKW,YAAcX,KAAK0B,Y,CAGlD,eAAYkF,GACV,OAAOC,EAAsB7G,KAAKC,QAASD,KAAKE,S,CAGlD,cAAY4G,GACV,OAAOC,EAAsB/G,KAAK4G,Y,CAGpC,mBAAYI,GACV,OAAOhH,KAAKkB,WACR+F,EAAqBjH,KAAK4G,YAAa5G,KAAKyB,YAC5CzB,KAAK4G,W,CAGX,kBAAYpB,GACV,OAAOuB,EAAsB/G,KAAKgH,gB,CAGpC,kBAAYzC,GACV,MAAM2C,EAAQ,IAAIC,IAAInH,KAAK8G,WAAWM,KAAIC,GAAUA,EAAOtC,SAC3D,MAAO,IAAI,IAAIoC,IAAInH,KAAKG,OAAOuG,QAAO3B,GAASmC,EAAMI,IAAIvC,M,CAG3D,gBAAYwC,GACV,OAAOvH,KAAKuE,eAAed,OAAS,C,CAGtC,kBAAY+D,GACV,OAAQxH,KAAKY,WAAaZ,KAAKwB,aAAe,EAC1C,GAAGxB,KAAKgC,sBAAsBhC,KAAKwB,cACnCiG,S,CAGE,0BAAA3B,GACN,IAAK9F,KAAKI,OAASJ,KAAKwH,eAAgB,OACxCxH,KAAK0H,GACFC,cAA2B,IAAI3H,KAAKwH,mBACnCI,eAAe,CAAEC,MAAO,UAAWC,OAAQ,W,CAGzC,kBAAAlC,GACN5F,KAAKqE,uBACLrE,KAAKyC,eAAiBI,IACpB,GAAI7C,KAAK0H,GAAGK,SAASlF,EAAMmF,QAAiB,OAC5ChI,KAAKmG,YAAY,EAEnBnG,KAAK0C,kBAAoB,IAAM1C,KAAKyF,iBACpCwC,SAASC,iBAAiB,YAAalI,KAAKyC,eAAgB,MAC5D0F,OAAOD,iBAAiB,SAAUlI,KAAK0C,kBAAmB,MAC1DyF,OAAOD,iBAAiB,SAAUlI,KAAK0C,kB,CAGjC,oBAAA2B,GACN,GAAIrE,KAAKyC,eAAgB,CACvBwF,SAASG,oBAAoB,YAAapI,KAAKyC,eAAgB,MAC/DzC,KAAKyC,eAAiB,I,CAExB,GAAIzC,KAAK0C,kBAAmB,CAC1ByF,OAAOC,oBAAoB,SAAUpI,KAAK0C,kBAAmB,MAC7DyF,OAAOC,oBAAoB,SAAUpI,KAAK0C,mBAC1C1C,KAAK0C,kBAAoB,I,EAIrB,mBAAA0B,GACN,GAAIpE,KAAK2C,mBAAqB,KAAM,CAClC0F,qBAAqBrI,KAAK2C,kBAC1B3C,KAAK2C,iBAAmB,I,EAKpB,sBAAAkD,CAAuByC,GAC7B,IAAKtI,KAAKI,KAAM,OAEhBJ,KAAKoE,sBACLpE,KAAK8B,cAAgB,MACrB,IAAIyG,EAAY7I,EAEhB,MAAM8I,EAAU,KACdxI,KAAK2C,iBAAmB,KACxB,IAAK3C,KAAKI,KAAM,OAEhB,GAAIJ,KAAKyF,iBAAkB,CACzB6C,MACA,M,CAGF,GAAIC,EAAY,EAAG,CACjBA,GAAa,EACbvI,KAAK2C,iBAAmBQ,sBAAsBqF,E,GAIlDxI,KAAK2C,iBAAmBQ,sBAAsBqF,E,CAIxC,cAAA/C,GACN,IACGzF,KAAKI,OACLJ,KAAKmC,YACLnC,KAAKoC,UACLpC,KAAKoC,QAAQqG,cACbzI,KAAK0H,GAAGK,SAAS/H,KAAKoC,SACvB,OAAO,MACT,MAAMsG,EAAiBC,EAAmBC,EAAeC,SAAUD,EAAeC,UAClF7I,KAAKoC,QAAQ0G,MAAMC,SAAW,GAAG/I,KAAKmC,UAAU6G,YAAcN,EAAiB,MAC/E1I,KAAK2B,SAAWsH,EAA6B,CAC3CC,WAAYlJ,KAAKmC,UAAUgH,wBAC3BC,WAAYpJ,KAAKoC,QAAQ4G,YACzBK,YAAarJ,KAAKoC,QAAQkH,aAC1BC,KAAM,SACNC,MAAO,QACPC,aAAcf,EACdgB,eAAgBhB,EAChBiB,cAAejB,EACfkB,cAAezB,OAAO0B,WACtBC,eAAgB3B,OAAO4B,cAEzB/J,KAAK8B,cAAgB,KACrB,OAAO,I,CAGD,SAAA0B,CAAUwG,EAAuBC,GACvC,GAAIjK,KAAKwE,aAAgBxE,KAAK8G,WAAWrD,SAAWzD,KAAKY,UAAY,OACrE,MAAM0E,EAAUC,EAAqBvF,KAAKwF,gBAC1CxF,KAAKwB,YACHyI,IAAS,OACJ3E,EAAQA,EAAQ7B,OAAS,KAAM,EAC/B6B,EAAQ,KAAM,EACrBtF,KAAK+B,iBAAmBiI,EACxBhK,KAAKI,KAAO,I,CAGN,UAAA+F,CAAW+D,EAAe,OAChC,IAAKlK,KAAKI,KAAM,OAChBJ,KAAKI,KAAO,MACZ,GAAI8J,EAAc/G,uBAAsB,IAAMnD,KAAKmC,WAAWiB,S,CAGxD,YAAA+G,CAAa9C,GACnB,GAAIA,EAAO1G,YAAcX,KAAKY,UAAW,OACzC,MAAMwJ,EAAUpK,KAAKuE,eACrB,MAAM8F,EAAOD,EAAQ9G,SAAS+D,EAAOtC,OACjCqF,EAAQ1D,QAAO3B,GAASA,IAAUsC,EAAOtC,QACzC,IAAIqF,EAAS/C,EAAOtC,OACxB/E,KAAKG,OAASkK,EACdrK,KAAKgD,SAASC,KAAK,IAAIoH,G,CAYjB,eAAAxG,CAAgBN,GACtB,GAAIvD,KAAKwC,eAAgB8B,aAAatE,KAAKwC,gBAC3CxC,KAAK+B,iBAAmB,KACxB,MAAMuI,EAAa/G,EAAIgH,oBACvB,MAAMC,EACJxK,KAAKuC,UAAUkB,OAAS,GACxB,IAAIzD,KAAKuC,WAAWkI,OAAMC,GAAaA,IAAcJ,IACvDtK,KAAKuC,UAAYiI,EAAoBF,EAAa,GAAGtK,KAAKuC,YAAY+H,IACtE,MAAMK,EAAQC,EAAyB5K,KAAKwF,eAAgBxF,KAAKuC,UAAWvC,KAAKwB,aACjF,GAAImJ,GAAS,EAAG3K,KAAKwB,YAAcmJ,EACnC,MAAME,EAAUC,EACdlC,EAAemC,yBACfnC,EAAemC,0BAEjB/K,KAAKwC,eAAiBwI,YAAW,KAC/BhL,KAAKuC,UAAY,GACjBvC,KAAKwC,eAAiB,IAAI,GACzBqI,E,CAGG,iBAAA/G,CAAkBjB,GACxB,OAAQA,EAAMU,KACZ,IAAK,YACHV,EAAMC,iBACN9C,KAAK+B,iBAAmB,KACxB/B,KAAKwB,YAAcyJ,EAAgBjL,KAAKwF,eAAgBxF,KAAKwB,YAAa,GAC1E,MACF,IAAK,UACHqB,EAAMC,iBACN9C,KAAK+B,iBAAmB,KACxB/B,KAAKwB,YAAcyJ,EAAgBjL,KAAKwF,eAAgBxF,KAAKwB,aAAa,GAC1E,MACF,IAAK,OACHqB,EAAMC,iBACN9C,KAAK+B,iBAAmB,KACxB/B,KAAKwB,YAAc+D,EAAqBvF,KAAKwF,gBAAgB,KAAM,EACnE,MACF,IAAK,MAAO,CACV3C,EAAMC,iBACN9C,KAAK+B,iBAAmB,KACxB,MAAMuD,EAAUC,EAAqBvF,KAAKwF,gBAC1CxF,KAAKwB,YAAc8D,EAAQA,EAAQ7B,OAAS,KAAM,EAClD,K,CAEF,IAAK,QACL,IAAK,IAAK,CACR,GAAIZ,EAAMU,MAAQ,KAAOvD,KAAKkB,YAAc2B,EAAMmF,SAAWhI,KAAKqC,SAAU,MAC5EQ,EAAMC,iBACN,MAAMuE,EAASrH,KAAKwF,eAAexF,KAAKwB,aACxC,GAAI6F,EAAQrH,KAAKmK,aAAa9C,GAC9B,K,CAEF,IAAK,SACHxE,EAAMC,iBACN9C,KAAKmG,WAAW,MAChB,MACF,IAAK,MACHnG,KAAKmG,aACL,MACF,QACE,IAAKnG,KAAKkB,YAAc2B,EAAMU,IAAIE,SAAW,IAAMZ,EAAMa,UAAYb,EAAMc,UAAYd,EAAMe,OAAQ,CACnG5D,KAAK6D,gBAAgBhB,EAAMU,I,GAqB3B,YAAA2H,CAAa7D,EAA2B8D,EAAeC,GAC7D,MAAMC,EAAWrL,KAAKG,OAAOmD,SAAS+D,EAAOtC,OAC7C,MAAMuG,EAAStL,KAAKwB,cAAgB2J,EACpC,OACEI,EAACC,EAAe,CACdC,GAAI,GAAGzL,KAAKgC,sBAAsBmJ,IAClC9D,OAAQA,EACRgE,SAAUA,EACVC,OAAQA,EACRvJ,iBAAkB/B,KAAK+B,iBACvBqJ,YAAaA,EACbM,QACEH,EAAA,QAAMI,MAAM,oDAAmD,cAAa,QAC1EJ,EAAA,eACEI,MAAM,0BACNC,MAAM,GACNnL,KAAK,KACLoL,QAASR,EACTS,aAAY,QAIlBC,QAAS,KACL/L,KAAK+B,iBAAmB,MACxB/B,KAAKwB,YAAc2J,CAAK,EAE5Ba,SAAU,IAAMhM,KAAKmK,aAAa9C,I,CAKxC,MAAA4E,GACE,MAAMC,EAAWlM,KAAKwE,WACtB,MAAM2H,EAAQnM,KAAKuE,eAAed,OAClC,MAAM2I,EAAcC,EAAqBrM,KAAKS,MAC9C,MAAM6L,EAAWjN,EAAUW,KAAKS,MAChC,MAAM8L,EAAoBC,EAAsBxM,KAAK8G,YACrD,MAAM2F,EAAYzM,KAAKsB,OAASoL,QAAQ1M,KAAK2M,cAC7C,MAAMC,EAAc,CAAC5M,KAAK6M,gBAAiBJ,EAAYzM,KAAKkC,QAAUuF,WACnEf,OAAOgG,SACPI,KAAK,MAAQrF,UAChB,MAAMsF,EAAa,CACjBpL,SAAU,QACVqL,KAAM,IACNC,IAAK,IACLC,UAAW,aAAaC,KAAKC,MAAMpN,KAAK2B,SAASC,SAASuL,KAAKC,MAAMpN,KAAK2B,SAASE,QACnFwL,OAAQ,oCACRC,WAAYtN,KAAK8B,cAAgB,UAAY,UAE/C,IAAIyL,EAAY,EAEhB,OACEhC,EAACiC,EAAI,CAAAjK,IAAA,2CACHoI,MAAO,CACL,cAAe,KACf,sBAAuBO,EACvB,iBAAkBlM,KAAKS,OAAS,KAChC,iBAAkBT,KAAKS,OAAS,KAChC,iBAAkBT,KAAKS,OAAS,QAC7BgN,EAAkBzN,KAAKU,OAC1B,CAAC,2BAA2BV,KAAK0N,gBAAiB1N,KAAK0N,aAGzDnC,EAAA,UAAAhI,IAAA,2CACEoK,IAAKC,IACH5N,KAAKmC,UAAayL,GAAiC,IAAI,EAEzDnC,GAAIzL,KAAK6N,SAAW7N,KAAKgC,YACzB8L,KAAK,SACLnC,MAAO,CACLoC,QAAS,KACT,sBAAuB,KACvB,sBAAuB,KACvB,iCACG7B,GAAYlM,KAAKa,YAAcb,KAAKuH,aACvC,oBAAqBvH,KAAKc,WAAad,KAAKsB,MAC5C,qBAAsBtB,KAAKuH,aAC3B,iBAAkBvH,KAAKsB,MACvB,CAAC,eAAetB,KAAKS,QAAS,QAC3BuN,EAAyBhO,KAAK0N,aAEnCrN,SAAU6L,EACV+B,KAAK,WAAU,gBACD,UAAS,gBACRC,OAAOlO,KAAKI,MAAK,gBACjBJ,KAAKI,KAAOJ,KAAKiC,UAAYwF,UAAS,wBAC9BzH,KAAKI,OAASJ,KAAKkB,WAAalB,KAAKwH,eAAiBC,UAAS,aAC1EzH,KAAKuB,UAAS,kBACTvB,KAAKmO,eAAc,mBAClBvB,EAAW,eACf5M,KAAKsB,MAAQ,OAASmG,UAAS,gBAC9BzH,KAAKM,UAAYmH,UAAS,YAC9BzH,KAAKY,UAAY,OAAS6G,UACrC2G,QAAS,IAAOpO,KAAKI,KAAOJ,KAAKmG,aAAenG,KAAKwD,UAAU,OAC/D6K,UAAWrO,KAAKqD,uBAEdrD,KAAKsO,MAAQtO,KAAKY,YAClB2K,EAAA,QAAAhI,IAAA,2CAAMoI,MAAM,+CAA8C,cAAa,QACpE3L,KAAKY,UACJ2K,EAAA,aAAW9K,KAAM6L,EAAUiC,MAAM,YAEjChD,EAAA,WAAS9G,KAAMzE,KAAKsO,KAAM7N,KAAM6L,EAAUiC,MAAM,aAItDhD,EAAA,WAAAhI,IAAA,2CACEoI,MAAM,8CACN6C,GAAG,OACHC,QAASrC,EACTmC,MAAM,UACNG,eAAgB,GAEf,GAAG1O,KAAKQ,cAAc2L,EAAQ,EAAI,MAAMA,IAAU,MAErDZ,EAAA,QAAAhI,IAAA,2CAAMoI,MAAM,gDAA+C,cAAa,QACtEJ,EAAA,WAAAhI,IAAA,2CAASkB,KAAK,cAAchE,KAAM6L,EAAUiC,MAAM,cAIrDvO,KAAKI,MACJmL,EAAA,OAAAhI,IAAA,2CACEoK,IAAKC,IACH5N,KAAKoC,QAAWwL,GAA8B,IAAI,EAEpDjC,MAAM,+BACN7C,MAAOiE,GAEN/M,KAAKkB,YACJqK,EAACoD,EAAY,CAAApL,IAAA,2CACXwB,MAAO/E,KAAKyB,WACZjB,YAAaR,KAAKmB,kBAClByN,SAAU5O,KAAKiC,UACf4M,iBAAkB7O,KAAKwH,eACvBsH,SAAUlB,IACR5N,KAAKqC,SAAWuL,CAAO,EAEzB5M,WAAYhB,KAAKgB,WACjB+N,cAAehK,IACb/E,KAAKyB,WAAasD,CAAK,EAEzBsJ,UAAWxL,GAAS7C,KAAK8D,kBAAkBjB,KAG/C0I,EAAA,OAAAhI,IAAA,2CACEkI,GAAIzL,KAAKiC,UACT0J,MAAM,iBACNsC,KAAK,UAAS,uBACO,OAAM,aACfjO,KAAKuB,WAAavB,KAAKQ,YAAW,YACnCR,KAAKY,UAAY,OAAS6G,WAEpCzH,KAAKY,UACJ2K,EAAA,OACEI,MAAM,oBACNsC,KAAK,SAAQ,gBACC,QAAO,gBACP,OAAM,aACRjO,KAAKqB,aAAY,YACnB,UAEVkK,EAAA,aAAW9K,KAAK,KAAK8N,MAAM,aAE3BvO,KAAKwF,eAAe/B,SAAW,EACjC8H,EAAA,OACEI,MAAM,kBACNsC,KAAK,SAAQ,gBACC,QAAO,gBACP,OAAM,aACRjO,KAAKoB,cAAa,YACpB,UAEVmK,EAAA,kBAAgByD,KAAMhP,KAAKoB,iBAG7BpB,KAAKgH,gBAAgBI,KAAI6H,GACvB1D,EAAA,OACEI,MAAO,CACL,oBAAqB,KACrB,+BAAgCsD,EAAQC,SAE1CjB,KAAMgB,EAAQE,OAAS,QAAU1H,UAAS,aAC9BwH,EAAQE,QAEnBF,EAAQE,QACP5D,EAAA,WACEI,MAAM,2CACN6C,GAAG,OACHC,QAAQ,kBACRW,SAAQ,KACRb,MAAM,UAAS,cACH,QAEXU,EAAQE,QAGZF,EAAQhP,QAAQmH,KAAIC,GAAUrH,KAAKkL,aAClC7D,EACAkG,IACAhB,SAMTvM,KAAKe,YAAcf,KAAKuH,eAAiBvH,KAAKY,WAC7C2K,EAAC8D,EAAY,CAAA9L,IAAA,2CACX+L,QAAS,GAAGnD,KAASnM,KAAKiB,gBAC1BD,WAAYhB,KAAKgB,WACjBuO,QAASvP,KAAK4C,kBAMrB6J,GACClB,EAAA,WAAAhI,IAAA,2CACEoI,MAAM,aACN6C,GAAG,MACHC,QAAQ,kBACRF,MAAM,WACNiB,OAAQxP,KAAKkC,QACb+L,KAAK,SAEJjO,KAAK2M,c","ignoreList":[]}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{p as e,H as s,c as t,h as i,a as r,t as o}from"./index.js";import{c as n}from"./p-C_cu-HIT.js";import{e as c,r as a,f as d,a as l,m as h,b as g,C as p,c as u,d as f,g as v,h as m,i as b}from"./p-VKIsOVza.js";import{d as y}from"./p-DAuadHYu.js";import{d as x}from"./p-DV23KMU-.js";import{d as w}from"./p-DxQ4gzbA.js";import{d as k}from"./p-CXF8yd-g.js";import{d as _}from"./p-Cpr3K41-.js";import{d as z}from"./p-BKA6houZ.js";import{r as C}from"./p-BWUTr_XN.js";import{a as F}from"./p-BHtg1fh3.js";import{C as A}from"./p-Cx-ywr1e.js";import{T as V}from"./p-drBA73M_.js";import{c as j}from"./p-DuFm-ieS.js";const I=()=>`.sc-ds-select-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-h:focus-visible,.ds-focus-ring.sc-ds-select: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-h,.ds-focus-ring.ds-focus-ring--visible.sc-ds-select{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-h:focus-visible,.ds-focus-ring-inset.sc-ds-select:focus-visible{outline:none}.ds-focus-ring-inset.sc-ds-select-h:focus-visible::after,.ds-focus-ring-inset.sc-ds-select: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-h,.ds-focus-ring-inset.ds-focus-ring--visible.sc-ds-select{outline:none}.ds-focus-ring-inset.ds-focus-ring--visible.sc-ds-select-h::after,.ds-focus-ring-inset.ds-focus-ring--visible.sc-ds-select::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-h,.ds-interaction-fill.sc-ds-select{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-h::before,.ds-interaction-fill.sc-ds-select::before,.ds-interaction-fill.sc-ds-select-h::after,.ds-interaction-fill.sc-ds-select::after{content:'';position:absolute;inset:0;border-radius:inherit;background:transparent;pointer-events:none;transition:none}.ds-interaction-fill.sc-ds-select-h::before,.ds-interaction-fill.sc-ds-select::before{z-index:1}.ds-interaction-fill.sc-ds-select-h::after,.ds-interaction-fill.sc-ds-select::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-h,.ds-interaction-fill--bordered.sc-ds-select{--ds-interaction-border-width:var(--dimension-stroke-width-012);--ds-interaction-border-color:var(--color-border-secondary)}.ds-interaction-fill--selected.sc-ds-select-h::before,.ds-interaction-fill--selected.sc-ds-select::before{background:var(--ds-interaction-active)}.ds-interaction-fill--selected.sc-ds-select-h,.ds-interaction-fill--selected.sc-ds-select{--ds-interaction-dot-ring:var(--ds-interaction-active)}.ds-interaction-fill.sc-ds-select-h:hover:not(:disabled)::after,.ds-interaction-fill.sc-ds-select:hover:not(:disabled)::after{background:var(--ds-interaction-hover)}.ds-interaction-fill.sc-ds-select-h:active:not(:disabled)::after,.ds-interaction-fill.sc-ds-select:active:not(:disabled)::after{background:var(--ds-interaction-pressed)}.ds-interaction-fill.sc-ds-select-h>.ds-interaction-fill__content.sc-ds-select,.ds-interaction-fill.sc-ds-select>.ds-interaction-fill__content.sc-ds-select,.ds-interaction-fill__content.sc-ds-select{position:relative;z-index:2}.ds-interaction-fill--on-faint.sc-ds-select-h,.ds-interaction-fill--on-faint.sc-ds-select{--ds-interaction-active:var(--color-interaction-active)}.ds-interaction-fill--on-medium.sc-ds-select-h,.ds-interaction-fill--on-medium.sc-ds-select{--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-h,.ds-interaction-fill--on-bold.sc-ds-select{--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-h,.ds-interaction-fill--on-strong.sc-ds-select{--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-h,.ds-interaction-fill--on-translucent.sc-ds-select{--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-h,.ds-interaction-fill--on-inverted.sc-ds-select{--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-h,.ds-interaction-fill--on-media.sc-ds-select{--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-h,.ds-interaction-fill--on-always-dark.sc-ds-select{--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-h,.ds-interaction-fill--on-navigation.sc-ds-select{--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-h,.ds-control-inactive.sc-ds-select{opacity:0.25;pointer-events:none;cursor:not-allowed}.ds-control--md.sc-ds-select-h,.ds-control--md.sc-ds-select{--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-radius:var(--dimension-radius-025)}.ds-control--sm.sc-ds-select-h,.ds-control--sm.sc-ds-select{--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-radius:var(--dimension-radius-025)}.ds-control--xs.sc-ds-select-h,.ds-control--xs.sc-ds-select{--ds-control-height:var(--dimension-size-200);--ds-control-icon:var(--dimension-iconography-xs);--ds-control-padding-inline:var(--dimension-space-025);--ds-control-label-inset:var(--dimension-space-025);--ds-control-gap:0;--ds-control-radius:var(--dimension-radius-025)}.ds-choice-popup.sc-ds-select{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;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::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{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{animation:none;opacity:1}.ds-choice-popup--closing.sc-ds-select{opacity:0}}.ds-choice-list.sc-ds-select{display:flex;flex-direction:column;min-height:0;overflow-y:auto;overscroll-behavior:contain}.ds-choice-section.sc-ds-select{display:flex;flex-direction:column;gap:var(--dimension-space-050);padding:var(--dimension-space-050)}.ds-choice-section--divided.sc-ds-select{border-bottom:var(--dimension-stroke-width-015) solid var(--color-border-tertiary)}ds-text.ds-choice-section__header.sc-ds-select{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{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: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{display:flex;flex:1;flex-direction:column;gap:var(--dimension-space-025);min-width:0}ds-text.ds-choice-item__label.sc-ds-select,.ds-choice-item__subtext.sc-ds-select,ds-text.ds-choice-item__subtext.sc-ds-select{padding:0 var(--ds-control-label-inset, var(--dimension-space-025))}ds-text.ds-choice-item__label.sc-ds-select{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}ds-text.ds-choice-item__subtext.sc-ds-select{display:-webkit-box;overflow:hidden;white-space:normal;-webkit-box-orient:vertical;-webkit-line-clamp:2}.ds-choice-item__icon.sc-ds-select,.ds-choice-item__suffix.sc-ds-select{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,.ds-choice-loading.sc-ds-select{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{position:relative;box-sizing:border-box;padding:var(--dimension-space-050)}.ds-choice-footer.sc-ds-select::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{display:flex;align-items:center;justify-content:space-between;box-sizing:border-box;height:var(--dimension-size-400);padding:0 var(--ds-control-padding-inline, var(--dimension-space-075))}.ds-choice-footer__summary.sc-ds-select,.ds-choice-footer__clear.sc-ds-select ds-text.sc-ds-select{padding:0 var(--ds-control-label-inset, var(--dimension-space-025))}.ds-choice-footer__clear.sc-ds-select{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:hover{text-decoration:underline}.ds-control-width--hug.sc-ds-select-h,.ds-control-width--hug.sc-ds-select{width:fit-content;max-width:100%;flex:0 0 auto;align-self:flex-start}.ds-control-width--fill.sc-ds-select-h,.ds-control-width--fill.sc-ds-select{width:100%;min-width:0;flex:1 1 auto;align-self:stretch}.ds-text--display-medium.sc-ds-select-h,.ds-text--display-medium.sc-ds-select{font-size:var(--typography-fontsize-3xl);line-height:var(--typography-lineheight-3xl)}.ds-text--display-small.sc-ds-select-h,.ds-text--display-small.sc-ds-select{font-size:var(--typography-fontsize-2xl);line-height:var(--typography-lineheight-2xl)}.ds-text--title-large.sc-ds-select-h,.ds-text--title-large.sc-ds-select{font-size:var(--typography-fontsize-xl);line-height:var(--typography-lineheight-xl)}.ds-text--title-medium.sc-ds-select-h,.ds-text--title-medium.sc-ds-select{font-size:var(--typography-fontsize-lg);line-height:var(--typography-lineheight-lg)}.ds-text--title-small.sc-ds-select-h,.ds-text--title-small.sc-ds-select{font-size:var(--typography-fontsize-md);line-height:var(--typography-lineheight-md)}.ds-text--body-large.sc-ds-select-h,.ds-text--body-large.sc-ds-select{font-size:var(--typography-fontsize-lg);line-height:var(--typography-lineheight-lg)}.ds-text--body-medium.sc-ds-select-h,.ds-text--body-medium.sc-ds-select{font-size:var(--typography-fontsize-md);line-height:var(--typography-lineheight-md)}.ds-text--body-small.sc-ds-select-h,.ds-text--body-small.sc-ds-select{font-size:var(--typography-fontsize-sm);line-height:var(--typography-lineheight-sm)}.ds-text--caption.sc-ds-select-h,.ds-text--caption.sc-ds-select{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-h,.ds-text--display-small.ds-text--emphasis.sc-ds-select-h,.ds-text--display-medium.ds-text--emphasis.sc-ds-select,.ds-text--display-small.ds-text--emphasis.sc-ds-select{font-weight:var(--typography-weight-bold);letter-spacing:var(--typography-letterspacing-negative-double)}.ds-text--display-medium.ds-text--regular.sc-ds-select-h,.ds-text--display-small.ds-text--regular.sc-ds-select-h,.ds-text--display-medium.ds-text--regular.sc-ds-select,.ds-text--display-small.ds-text--regular.sc-ds-select{font-weight:var(--typography-weight-semibold);letter-spacing:var(--typography-letterspacing-negative)}.ds-text--title-large.ds-text--emphasis.sc-ds-select-h,.ds-text--title-large.ds-text--emphasis.sc-ds-select{font-weight:var(--typography-weight-semibold);letter-spacing:var(--typography-letterspacing-negative-double)}.ds-text--title-large.ds-text--regular.sc-ds-select-h,.ds-text--title-large.ds-text--regular.sc-ds-select{font-weight:var(--typography-weight-medium);letter-spacing:var(--typography-letterspacing-negative)}.ds-text--title-medium.ds-text--emphasis.sc-ds-select-h,.ds-text--title-small.ds-text--emphasis.sc-ds-select-h,.ds-text--title-medium.ds-text--emphasis.sc-ds-select,.ds-text--title-small.ds-text--emphasis.sc-ds-select{font-weight:var(--typography-weight-semibold);letter-spacing:var(--typography-letterspacing-negative)}.ds-text--title-medium.ds-text--regular.sc-ds-select-h,.ds-text--title-small.ds-text--regular.sc-ds-select-h,.ds-text--title-medium.ds-text--regular.sc-ds-select,.ds-text--title-small.ds-text--regular.sc-ds-select{font-weight:var(--typography-weight-medium);letter-spacing:var(--typography-letterspacing-negative-half)}.ds-text--body-large.ds-text--emphasis.sc-ds-select-h,.ds-text--body-medium.ds-text--emphasis.sc-ds-select-h,.ds-text--body-large.ds-text--emphasis.sc-ds-select,.ds-text--body-medium.ds-text--emphasis.sc-ds-select{font-weight:var(--typography-weight-medium);letter-spacing:var(--typography-letterspacing-negative)}.ds-text--body-large.ds-text--regular.sc-ds-select-h,.ds-text--body-medium.ds-text--regular.sc-ds-select-h,.ds-text--body-large.ds-text--regular.sc-ds-select,.ds-text--body-medium.ds-text--regular.sc-ds-select{font-weight:var(--typography-weight-regular);letter-spacing:var(--typography-letterspacing-negative-half)}.ds-text--body-small.ds-text--emphasis.sc-ds-select-h,.ds-text--body-small.ds-text--emphasis.sc-ds-select{font-weight:var(--typography-weight-medium);letter-spacing:var(--typography-letterspacing-negative-half)}.ds-text--body-small.ds-text--regular.sc-ds-select-h,.ds-text--body-small.ds-text--regular.sc-ds-select{font-weight:var(--typography-weight-regular);letter-spacing:var(--typography-letterspacing-none)}.ds-text--caption.ds-text--emphasis.sc-ds-select-h,.ds-text--caption.ds-text--emphasis.sc-ds-select{font-weight:var(--typography-weight-semibold);letter-spacing:var(--typography-letterspacing-positive)}.ds-text--caption.ds-text--regular.sc-ds-select-h,.ds-text--caption.ds-text--regular.sc-ds-select{font-weight:var(--typography-weight-medium);letter-spacing:var(--typography-letterspacing-positive)}.select-host.sc-ds-select-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-h,.ds-control-width--fill.sc-ds-select-h .trigger.sc-ds-select{width:100%}.trigger.sc-ds-select{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{--ds-interaction-border-width:var(--dimension-stroke-width-012);--ds-interaction-border-color:var(--ds-select-border)}.trigger--has-value.sc-ds-select .trigger__label.sc-ds-select{color:var(--ds-select-fg-active)}.wrapper--error.sc-ds-select{--ds-interaction-border-width:var(--dimension-stroke-width-018);--ds-interaction-border-color:var(--color-border-bold-negative)}.trigger__prefix.sc-ds-select,.trigger__chevron.sc-ds-select{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{color:var(--ds-select-prefix-fg)}.trigger__chevron.sc-ds-select{color:var(--ds-select-chevron-fg)}.trigger__label.sc-ds-select{position:relative;z-index:2;flex:1 1 auto;min-width:0;padding:0 var(--ds-control-label-inset, var(--dimension-space-025));overflow:hidden;text-overflow:ellipsis;white-space:nowrap;text-align:left;color:inherit;transition:color var(--effect-motion-short-2)}.select-popup.sc-ds-select{color:var(--color-foreground-secondary)}.select-option[aria-selected='true'].sc-ds-select .ds-choice-item__icon.sc-ds-select{color:var(--color-foreground-primary)}.select-search.sc-ds-select{position:relative;box-sizing:border-box;padding:var(--dimension-space-050)}.select-search.sc-ds-select::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:focus-within::after{height:var(--dimension-stroke-width-018);background-color:var(--color-border-bold-brand)}.select-search__control.sc-ds-select{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:has(.select-search__clear){padding-right:0}.select-search.sc-ds-select .select-search__control.sc-ds-select>.select-search__clear.sc-ds-select{align-self:center;flex-shrink:0;margin-right:var(--dimension-space-050)}.select-search__control.sc-ds-select input.sc-ds-select{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 input.sc-ds-select::placeholder{color:var(--color-foreground-secondary)}.select-search__control.sc-ds-select input.sc-ds-select:focus::placeholder{color:var(--color-foreground-quaternary)}.select-search__control.sc-ds-select input[type='search'].sc-ds-select::-webkit-search-cancel-button,.select-search__control.sc-ds-select input[type='search'].sc-ds-select::-webkit-search-decoration{display:none}.error-text.sc-ds-select{width:100%}.select-host--background-medium.sc-ds-select-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-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-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-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-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-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-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 L={md:"md",sm:"sm",xs:"xs"};let T=0;const D=e(class e extends s{constructor(e){super();if(e!==false){this.__registerHost()}this.dsChange=t(this,"dsChange");this.dsClear=t(this,"dsClear");this.dsOpenChange=t(this,"dsOpenChange");this.internals=this.attachInternals();this.options=[];this.sections=[];this.value="";this.open=false;this.disabled=false;this.required=false;this.requiredMessage="This field is required.";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.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-${++T}`;this.listboxId=`${this.generatedId}-listbox`;this.errorId=`${this.generatedId}-error`;this.triggerEl=null;this.popupEl=null;this.searchEl=null;this.initialValue="";this.typeahead="";this.typeaheadTimer=null;this.outsideHandler=null;this.repositionHandler=null;this.clearSelection=e=>{e.preventDefault();e.stopPropagation();this.value="";this.dsChange.emit("");this.dsClear.emit();const s=c(this.visibleOptions);this.activeIndex=s[0]??-1;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.initialValue=this.value;this.syncFormValue()}componentDidLoad(){if(this.open)this.onOpenChange(true)}disconnectedCallback(){this.unbindPopupListeners();if(this.typeaheadTimer)clearTimeout(this.typeaheadTimer)}syncFormValue(){const e=this.isDisabled;const s=this.hasSelection?this.value:"";this.internals.setFormValue(e?null:s);const t=this.required&&!e&&!s;this.internals.setValidity(t?{valueMissing:true}:{},t?this.requiredMessage:"");if(this.open){const e=c(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.positionReady=false;requestAnimationFrame((()=>{this.updatePosition();this.scrollActiveOptionIntoView();if(this.searchable)this.searchEl?.focus()}))}else{this.unbindPopupListeners();this.searchTerm="";this.positionReady=false}}onSearchTermChange(){const e=c(this.visibleOptions);this.activeIndex=e[0]??-1;requestAnimationFrame((()=>{this.updatePosition();this.scrollActiveOptionIntoView()}))}onActiveIndexChange(){requestAnimationFrame((()=>this.scrollActiveOptionIntoView()))}formDisabledCallback(e){this.formDisabled=e;this.syncFormValue()}formResetCallback(){this.value=this.initialValue;this.closePopup()}formStateRestoreCallback(e){this.value=typeof e==="string"?e:""}async setFocus(){this.triggerEl?.focus()}get isDisabled(){return this.disabled||this.isInactive||this.formDisabled}get allSections(){return a(this.options,this.sections)}get allOptions(){return d(this.allSections)}get visibleSections(){return this.searchable?l(this.allSections,this.searchTerm):this.allSections}get visibleOptions(){return d(this.visibleSections)}get selectedOption(){return this.allOptions.find((e=>e.value===this.value))}get hasSelection(){return Boolean(this.selectedOption)}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=>{const s=e.target;if(this.el.contains(s))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}}updatePosition(){if(!this.open||!this.triggerEl||!this.popupEl)return;const e=C(V.space050,V.space050);this.popupEl.style.minWidth=`${this.triggerEl.offsetWidth+e*2}px`;this.position=n({anchorRect:this.triggerEl.getBoundingClientRect(),popupWidth:this.popupEl.offsetWidth,popupHeight:this.popupEl.offsetHeight,side:"bottom",align:"start",sideOffsetPx:e,alignOffsetPx:-e,viewportPadPx:e,viewportWidth:window.innerWidth,viewportHeight:window.innerHeight});this.positionReady=true}openPopup(e,s){if(this.isDisabled||!this.allOptions.length&&!this.isLoading)return;const t=c(this.visibleOptions);const i=this.visibleOptions.findIndex((e=>e.value===this.value&&!e.isInactive));this.activeIndex=s==="last"?t[t.length-1]??-1:i>=0?i:t[0]??-1;this.focusRingVisible=e;this.open=true}closePopup(e=false){if(!this.open)return;this.open=false;if(e)requestAnimationFrame((()=>this.triggerEl?.focus()))}selectOption(e){if(e.isInactive||this.isLoading)return;this.value=e.value;this.dsChange.emit(this.value);this.closePopup(true)}moveActive(e){this.activeIndex=h(this.visibleOptions,this.activeIndex,e)}setActiveEdge(e){const s=c(this.visibleOptions);this.activeIndex=e==="first"?s[0]??-1:s[s.length-1]??-1}handleTypeahead(e){if(this.typeaheadTimer)clearTimeout(this.typeaheadTimer);this.focusRingVisible=true;const s=e.toLocaleLowerCase();const t=this.typeahead.length>0&&[...this.typeahead].every((e=>e===s));this.typeahead=t?s:`${this.typeahead}${s}`;const i=g(this.visibleOptions,this.typeahead,this.activeIndex);if(i>=0)this.activeIndex=i;const r=F(V.animationDurationMedium1,V.animationDurationMedium1);this.typeaheadTimer=setTimeout((()=>{this.typeahead="";this.typeaheadTimer=null}),r)}handleListKeyDown(e){switch(e.key){case"ArrowDown":e.preventDefault();this.focusRingVisible=true;this.moveActive(1);break;case"ArrowUp":e.preventDefault();this.focusRingVisible=true;this.moveActive(-1);break;case"Home":e.preventDefault();this.focusRingVisible=true;this.setActiveEdge("first");break;case"End":e.preventDefault();this.focusRingVisible=true;this.setActiveEdge("last");break;case"Enter":case" ":{if(e.key===" "&&this.searchable&&e.target===this.searchEl)break;e.preventDefault();const s=this.visibleOptions[this.activeIndex];if(s)this.selectOption(s);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,s,t,r){const o=e.value===this.value;const n=s===this.activeIndex;return i(p,{id:`${this.generatedId}-option-${s}`,option:e,selected:o,active:n,focusRingVisible:this.focusRingVisible,usesSubtext:r,leading:t&&e.icon?i("span",{class:"ds-choice-item__icon ds-interaction-fill__content","aria-hidden":"true"},i("ds-icon",{name:e.icon,size:"md",color:"inherit"})):undefined,onHover:()=>{this.focusRingVisible=false;this.activeIndex=s},onSelect:()=>this.selectOption(e)})}render(){const e=this.isDisabled;const s=!this.hasSelection;const t=s?this.placeholder:this.selectedOption?.label;const o=A[this.size];const n=L[this.size];const c=u(this.allOptions);const a=f(this.allOptions);const d=this.error&&Boolean(this.errorMessage);const l=[this.ariaDescribedby,d?this.errorId:undefined].filter(Boolean).join(" ")||undefined;const h={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 g=0;return i(r,{key:"fc4eeba9fdf983857a67ae4d31a1a5cfc5cd4992",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",...j(this.width),[`select-host--background-${this.background}`]:!!this.background}},i("button",{key:"3be72f0b4c7d42b43148806c5629a352923e3ae2",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--placeholder":s,"trigger--has-value":this.hasSelection,"wrapper--error":this.error,[`ds-control--${this.size}`]:true,...b(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:"1ec4a573f2bf4d4eecb2392906f99b65029ab868",class:"trigger__prefix ds-interaction-fill__content","aria-hidden":"true"},this.isLoading?i("ds-loader",{size:n,color:"inherit"}):i("ds-icon",{name:this.icon,size:n,color:"inherit"})),i("ds-text",{key:"29796079c74250ea01ba160176d9e5dd28df04f4",class:"trigger__label ds-interaction-fill__content",as:"span",variant:o,color:"inherit",lineTruncation:1},t),i("span",{key:"d6982d9f77c66afb2d5176514ad3555f9d6f70b0",class:"trigger__chevron ds-interaction-fill__content","aria-hidden":"true"},i("ds-icon",{key:"f2be3c028e1c0329a6438b16de2581c19be9144d",name:"ChevronDown",size:n,color:"inherit"}))),this.open&&i("div",{key:"013a69b6449d1bc521b109c2a4a9decf1f662b1c",ref:e=>{this.popupEl=e??null},class:"select-popup ds-choice-popup",style:h},this.searchable&&i(v,{key:"49d4faae5ec1050dabfd72233065aed2d329f346",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:"d34d51ed2e3a4f8c39e41572f0495b538f68b33b",id:this.listboxId,class:"ds-choice-list",role:"listbox","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,g++,c,a))))))),this.allowClear&&this.hasSelection&&!this.isLoading&&i(m,{key:"03df82a79702146d8dc170199cf06c4661c76e76",clearLabel:this.clearLabel,onClear:this.clearSelection})),d&&i("ds-text",{key:"8feb6da7b945b40787e7d1a02352c2b05510ff47",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{value:[{syncFormValue:0}],disabled:[{syncFormValue:0}],isInactive:[{syncFormValue:0}],required:[{syncFormValue:0}],options:[{syncFormValue:0}],sections:[{syncFormValue:0}],isLoading:[{onLoadingChange:0}],open:[{onOpenChange:0}],searchTerm:[{onSearchTermChange:0}],activeIndex:[{onActiveIndexChange:0}]}}static get style(){return I()}},[66,"ds-select",{options:[16],sections:[16],value:[1025],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"],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,{value:[{syncFormValue:0}],disabled:[{syncFormValue:0}],isInactive:[{syncFormValue:0}],required:[{syncFormValue:0}],options:[{syncFormValue:0}],sections:[{syncFormValue:0}],isLoading:[{onLoadingChange:0}],open:[{onOpenChange:0}],searchTerm:[{onSearchTermChange:0}],activeIndex:[{onActiveIndexChange:0}]}]);function O(){if(typeof customElements==="undefined"){return}const e=["ds-select","ds-badge","ds-button-unfilled","ds-empty-state","ds-icon","ds-loader","ds-text"];e.forEach((e=>{switch(e){case"ds-select":if(!customElements.get(o(e))){customElements.define(o(e),D)}break;case"ds-badge":if(!customElements.get(o(e))){y()}break;case"ds-button-unfilled":if(!customElements.get(o(e))){x()}break;case"ds-empty-state":if(!customElements.get(o(e))){w()}break;case"ds-icon":if(!customElements.get(o(e))){k()}break;case"ds-loader":if(!customElements.get(o(e))){_()}break;case"ds-text":if(!customElements.get(o(e))){z()}break}}))}O();const q=D;const $=O;export{q as DsSelect,$ as defineCustomElement};
|
|
1
|
+
import{p as e,H as s,c as t,h as i,a as r,t as o}from"./index.js";import{c as n}from"./p-C_cu-HIT.js";import{e as c,r as a,f as d,a as l,m as h,b as g,C as p,c as u,d as f,g as v,h as m,i as b}from"./p-VKIsOVza.js";import{d as y}from"./p-DAuadHYu.js";import{d as x}from"./p-DV23KMU-.js";import{d as w}from"./p-DxQ4gzbA.js";import{d as k}from"./p-CXF8yd-g.js";import{d as _}from"./p-Cpr3K41-.js";import{d as z}from"./p-BKA6houZ.js";import{r as C}from"./p-BWUTr_XN.js";import{a as F}from"./p-BHtg1fh3.js";import{C as A}from"./p-Cx-ywr1e.js";import{T as V}from"./p-drBA73M_.js";import{c as j}from"./p-DuFm-ieS.js";const I=()=>`.sc-ds-select-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-h:focus-visible,.ds-focus-ring.sc-ds-select: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-h,.ds-focus-ring.ds-focus-ring--visible.sc-ds-select{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-h:focus-visible,.ds-focus-ring-inset.sc-ds-select:focus-visible{outline:none}.ds-focus-ring-inset.sc-ds-select-h:focus-visible::after,.ds-focus-ring-inset.sc-ds-select: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-h,.ds-focus-ring-inset.ds-focus-ring--visible.sc-ds-select{outline:none}.ds-focus-ring-inset.ds-focus-ring--visible.sc-ds-select-h::after,.ds-focus-ring-inset.ds-focus-ring--visible.sc-ds-select::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-h,.ds-interaction-fill.sc-ds-select{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-h::before,.ds-interaction-fill.sc-ds-select::before,.ds-interaction-fill.sc-ds-select-h::after,.ds-interaction-fill.sc-ds-select::after{content:'';position:absolute;inset:0;border-radius:inherit;background:transparent;pointer-events:none;transition:none}.ds-interaction-fill.sc-ds-select-h::before,.ds-interaction-fill.sc-ds-select::before{z-index:1}.ds-interaction-fill.sc-ds-select-h::after,.ds-interaction-fill.sc-ds-select::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-h,.ds-interaction-fill--bordered.sc-ds-select{--ds-interaction-border-width:var(--dimension-stroke-width-012);--ds-interaction-border-color:var(--color-border-secondary)}.ds-interaction-fill--selected.sc-ds-select-h::before,.ds-interaction-fill--selected.sc-ds-select::before{background:var(--ds-interaction-active)}.ds-interaction-fill--selected.sc-ds-select-h,.ds-interaction-fill--selected.sc-ds-select{--ds-interaction-dot-ring:var(--ds-interaction-active)}.ds-interaction-fill.sc-ds-select-h:hover:not(:disabled)::after,.ds-interaction-fill.sc-ds-select:hover:not(:disabled)::after{background:var(--ds-interaction-hover)}.ds-interaction-fill.sc-ds-select-h:active:not(:disabled)::after,.ds-interaction-fill.sc-ds-select:active:not(:disabled)::after{background:var(--ds-interaction-pressed)}.ds-interaction-fill.sc-ds-select-h>.ds-interaction-fill__content.sc-ds-select,.ds-interaction-fill.sc-ds-select>.ds-interaction-fill__content.sc-ds-select,.ds-interaction-fill__content.sc-ds-select{position:relative;z-index:2}.ds-interaction-fill--on-faint.sc-ds-select-h,.ds-interaction-fill--on-faint.sc-ds-select{--ds-interaction-active:var(--color-interaction-active)}.ds-interaction-fill--on-medium.sc-ds-select-h,.ds-interaction-fill--on-medium.sc-ds-select{--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-h,.ds-interaction-fill--on-bold.sc-ds-select{--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-h,.ds-interaction-fill--on-strong.sc-ds-select{--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-h,.ds-interaction-fill--on-translucent.sc-ds-select{--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-h,.ds-interaction-fill--on-inverted.sc-ds-select{--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-h,.ds-interaction-fill--on-media.sc-ds-select{--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-h,.ds-interaction-fill--on-always-dark.sc-ds-select{--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-h,.ds-interaction-fill--on-navigation.sc-ds-select{--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-h,.ds-control-inactive.sc-ds-select{opacity:0.25;pointer-events:none;cursor:not-allowed}.ds-control--md.sc-ds-select-h,.ds-control--md.sc-ds-select{--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-radius:var(--dimension-radius-025)}.ds-control--sm.sc-ds-select-h,.ds-control--sm.sc-ds-select{--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-radius:var(--dimension-radius-025)}.ds-control--xs.sc-ds-select-h,.ds-control--xs.sc-ds-select{--ds-control-height:var(--dimension-size-200);--ds-control-icon:var(--dimension-iconography-xs);--ds-control-padding-inline:var(--dimension-space-025);--ds-control-label-inset:var(--dimension-space-025);--ds-control-gap:0;--ds-control-radius:var(--dimension-radius-025)}.ds-choice-popup.sc-ds-select{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;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::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{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{animation:none;opacity:1}.ds-choice-popup--closing.sc-ds-select{opacity:0}}.ds-choice-list.sc-ds-select{display:flex;flex-direction:column;min-height:0;overflow-y:auto;overscroll-behavior:contain}.ds-choice-section.sc-ds-select{display:flex;flex-direction:column;gap:var(--dimension-space-050);padding:var(--dimension-space-050)}.ds-choice-section--divided.sc-ds-select{border-bottom:var(--dimension-stroke-width-015) solid var(--color-border-tertiary)}ds-text.ds-choice-section__header.sc-ds-select{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{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: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{display:flex;flex:1;flex-direction:column;gap:var(--dimension-space-025);min-width:0}ds-text.ds-choice-item__label.sc-ds-select,.ds-choice-item__subtext.sc-ds-select,ds-text.ds-choice-item__subtext.sc-ds-select{padding:0 var(--ds-control-label-inset, var(--dimension-space-025))}ds-text.ds-choice-item__label.sc-ds-select{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}ds-text.ds-choice-item__subtext.sc-ds-select{display:-webkit-box;overflow:hidden;white-space:normal;-webkit-box-orient:vertical;-webkit-line-clamp:2}.ds-choice-item__icon.sc-ds-select,.ds-choice-item__suffix.sc-ds-select{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,.ds-choice-loading.sc-ds-select{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{position:relative;box-sizing:border-box;padding:var(--dimension-space-050)}.ds-choice-footer.sc-ds-select::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{display:flex;align-items:center;justify-content:space-between;box-sizing:border-box;height:var(--dimension-size-400);padding:0 var(--ds-control-padding-inline, var(--dimension-space-075))}.ds-choice-footer__summary.sc-ds-select,.ds-choice-footer__clear.sc-ds-select ds-text.sc-ds-select{padding:0 var(--ds-control-label-inset, var(--dimension-space-025))}.ds-choice-footer__clear.sc-ds-select{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:hover{text-decoration:underline}.ds-control-width--hug.sc-ds-select-h,.ds-control-width--hug.sc-ds-select{width:fit-content;max-width:100%;flex:0 0 auto;align-self:flex-start}.ds-control-width--fill.sc-ds-select-h,.ds-control-width--fill.sc-ds-select{width:100%;min-width:0;flex:1 1 auto;align-self:stretch}.ds-text--display-medium.sc-ds-select-h,.ds-text--display-medium.sc-ds-select{font-size:var(--typography-fontsize-3xl);line-height:var(--typography-lineheight-3xl)}.ds-text--display-small.sc-ds-select-h,.ds-text--display-small.sc-ds-select{font-size:var(--typography-fontsize-2xl);line-height:var(--typography-lineheight-2xl)}.ds-text--title-large.sc-ds-select-h,.ds-text--title-large.sc-ds-select{font-size:var(--typography-fontsize-xl);line-height:var(--typography-lineheight-xl)}.ds-text--title-medium.sc-ds-select-h,.ds-text--title-medium.sc-ds-select{font-size:var(--typography-fontsize-lg);line-height:var(--typography-lineheight-lg)}.ds-text--title-small.sc-ds-select-h,.ds-text--title-small.sc-ds-select{font-size:var(--typography-fontsize-md);line-height:var(--typography-lineheight-md)}.ds-text--body-large.sc-ds-select-h,.ds-text--body-large.sc-ds-select{font-size:var(--typography-fontsize-lg);line-height:var(--typography-lineheight-lg)}.ds-text--body-medium.sc-ds-select-h,.ds-text--body-medium.sc-ds-select{font-size:var(--typography-fontsize-md);line-height:var(--typography-lineheight-md)}.ds-text--body-small.sc-ds-select-h,.ds-text--body-small.sc-ds-select{font-size:var(--typography-fontsize-sm);line-height:var(--typography-lineheight-sm)}.ds-text--caption.sc-ds-select-h,.ds-text--caption.sc-ds-select{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-h,.ds-text--display-small.ds-text--emphasis.sc-ds-select-h,.ds-text--display-medium.ds-text--emphasis.sc-ds-select,.ds-text--display-small.ds-text--emphasis.sc-ds-select{font-weight:var(--typography-weight-bold);letter-spacing:var(--typography-letterspacing-negative-double)}.ds-text--display-medium.ds-text--regular.sc-ds-select-h,.ds-text--display-small.ds-text--regular.sc-ds-select-h,.ds-text--display-medium.ds-text--regular.sc-ds-select,.ds-text--display-small.ds-text--regular.sc-ds-select{font-weight:var(--typography-weight-semibold);letter-spacing:var(--typography-letterspacing-negative)}.ds-text--title-large.ds-text--emphasis.sc-ds-select-h,.ds-text--title-large.ds-text--emphasis.sc-ds-select{font-weight:var(--typography-weight-semibold);letter-spacing:var(--typography-letterspacing-negative-double)}.ds-text--title-large.ds-text--regular.sc-ds-select-h,.ds-text--title-large.ds-text--regular.sc-ds-select{font-weight:var(--typography-weight-medium);letter-spacing:var(--typography-letterspacing-negative)}.ds-text--title-medium.ds-text--emphasis.sc-ds-select-h,.ds-text--title-small.ds-text--emphasis.sc-ds-select-h,.ds-text--title-medium.ds-text--emphasis.sc-ds-select,.ds-text--title-small.ds-text--emphasis.sc-ds-select{font-weight:var(--typography-weight-semibold);letter-spacing:var(--typography-letterspacing-negative)}.ds-text--title-medium.ds-text--regular.sc-ds-select-h,.ds-text--title-small.ds-text--regular.sc-ds-select-h,.ds-text--title-medium.ds-text--regular.sc-ds-select,.ds-text--title-small.ds-text--regular.sc-ds-select{font-weight:var(--typography-weight-medium);letter-spacing:var(--typography-letterspacing-negative-half)}.ds-text--body-large.ds-text--emphasis.sc-ds-select-h,.ds-text--body-medium.ds-text--emphasis.sc-ds-select-h,.ds-text--body-large.ds-text--emphasis.sc-ds-select,.ds-text--body-medium.ds-text--emphasis.sc-ds-select{font-weight:var(--typography-weight-medium);letter-spacing:var(--typography-letterspacing-negative)}.ds-text--body-large.ds-text--regular.sc-ds-select-h,.ds-text--body-medium.ds-text--regular.sc-ds-select-h,.ds-text--body-large.ds-text--regular.sc-ds-select,.ds-text--body-medium.ds-text--regular.sc-ds-select{font-weight:var(--typography-weight-regular);letter-spacing:var(--typography-letterspacing-negative-half)}.ds-text--body-small.ds-text--emphasis.sc-ds-select-h,.ds-text--body-small.ds-text--emphasis.sc-ds-select{font-weight:var(--typography-weight-medium);letter-spacing:var(--typography-letterspacing-negative-half)}.ds-text--body-small.ds-text--regular.sc-ds-select-h,.ds-text--body-small.ds-text--regular.sc-ds-select{font-weight:var(--typography-weight-regular);letter-spacing:var(--typography-letterspacing-none)}.ds-text--caption.ds-text--emphasis.sc-ds-select-h,.ds-text--caption.ds-text--emphasis.sc-ds-select{font-weight:var(--typography-weight-semibold);letter-spacing:var(--typography-letterspacing-positive)}.ds-text--caption.ds-text--regular.sc-ds-select-h,.ds-text--caption.ds-text--regular.sc-ds-select{font-weight:var(--typography-weight-medium);letter-spacing:var(--typography-letterspacing-positive)}.select-host.sc-ds-select-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-h,.ds-control-width--fill.sc-ds-select-h .trigger.sc-ds-select{width:100%}.trigger.sc-ds-select{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{--ds-interaction-border-width:var(--dimension-stroke-width-012);--ds-interaction-border-color:var(--ds-select-border)}.trigger--has-value.sc-ds-select .trigger__label.sc-ds-select{color:var(--ds-select-fg-active)}.wrapper--error.sc-ds-select{--ds-interaction-border-width:var(--dimension-stroke-width-018);--ds-interaction-border-color:var(--color-border-bold-negative)}.trigger__prefix.sc-ds-select,.trigger__chevron.sc-ds-select{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{color:var(--ds-select-prefix-fg)}.trigger__chevron.sc-ds-select{color:var(--ds-select-chevron-fg)}.trigger__label.sc-ds-select{position:relative;z-index:2;flex:1 1 auto;min-width:0;padding:0 var(--ds-control-label-inset, var(--dimension-space-025));overflow:hidden;text-overflow:ellipsis;white-space:nowrap;text-align:left;color:inherit;transition:color var(--effect-motion-short-2)}.select-popup.sc-ds-select{color:var(--color-foreground-secondary)}.select-option[aria-selected='true'].sc-ds-select .ds-choice-item__icon.sc-ds-select{color:var(--color-foreground-primary)}.select-search.sc-ds-select{position:relative;box-sizing:border-box;padding:var(--dimension-space-050)}.select-search.sc-ds-select::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:focus-within::after{height:var(--dimension-stroke-width-018);background-color:var(--color-border-bold-brand)}.select-search__control.sc-ds-select{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:has(.select-search__clear){padding-right:0}.select-search.sc-ds-select .select-search__control.sc-ds-select>.select-search__clear.sc-ds-select{align-self:center;flex-shrink:0;margin-right:var(--dimension-space-050)}.select-search__control.sc-ds-select input.sc-ds-select{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 input.sc-ds-select::placeholder{color:var(--color-foreground-secondary)}.select-search__control.sc-ds-select input.sc-ds-select:focus::placeholder{color:var(--color-foreground-quaternary)}.select-search__control.sc-ds-select input[type='search'].sc-ds-select::-webkit-search-cancel-button,.select-search__control.sc-ds-select input[type='search'].sc-ds-select::-webkit-search-decoration{display:none}.error-text.sc-ds-select{width:100%}.select-host--background-medium.sc-ds-select-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-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-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-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-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-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-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 L={md:"md",sm:"sm",xs:"xs"};let T=0;const q=8;const D=e(class e extends s{constructor(e){super();if(e!==false){this.__registerHost()}this.dsChange=t(this,"dsChange");this.dsClear=t(this,"dsClear");this.dsOpenChange=t(this,"dsOpenChange");this.internals=this.attachInternals();this.options=[];this.sections=[];this.value="";this.open=false;this.disabled=false;this.required=false;this.requiredMessage="This field is required.";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.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-${++T}`;this.listboxId=`${this.generatedId}-listbox`;this.errorId=`${this.generatedId}-error`;this.triggerEl=null;this.popupEl=null;this.searchEl=null;this.initialValue="";this.typeahead="";this.typeaheadTimer=null;this.outsideHandler=null;this.repositionHandler=null;this.positionRetryRaf=null;this.clearSelection=e=>{e.preventDefault();e.stopPropagation();this.value="";this.dsChange.emit("");this.dsClear.emit();const s=c(this.visibleOptions);this.activeIndex=s[0]??-1;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.initialValue=this.value;this.syncFormValue()}componentDidLoad(){if(this.open)this.onOpenChange(true)}disconnectedCallback(){this.cancelPositionRetry();this.unbindPopupListeners();if(this.typeaheadTimer)clearTimeout(this.typeaheadTimer)}syncFormValue(){const e=this.isDisabled;const s=this.hasSelection?this.value:"";this.internals.setFormValue(e?null:s);const t=this.required&&!e&&!s;this.internals.setValidity(t?{valueMissing:true}:{},t?this.requiredMessage:"");if(this.open){const e=c(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(){const e=c(this.visibleOptions);this.activeIndex=e[0]??-1;requestAnimationFrame((()=>{this.updatePosition();this.scrollActiveOptionIntoView()}))}onActiveIndexChange(){requestAnimationFrame((()=>this.scrollActiveOptionIntoView()))}formDisabledCallback(e){this.formDisabled=e;this.syncFormValue()}formResetCallback(){this.value=this.initialValue;this.closePopup()}formStateRestoreCallback(e){this.value=typeof e==="string"?e:""}async setFocus(){this.triggerEl?.focus()}get isDisabled(){return this.disabled||this.isInactive||this.formDisabled}get allSections(){return a(this.options,this.sections)}get allOptions(){return d(this.allSections)}get visibleSections(){return this.searchable?l(this.allSections,this.searchTerm):this.allSections}get visibleOptions(){return d(this.visibleSections)}get selectedOption(){return this.allOptions.find((e=>e.value===this.value))}get hasSelection(){return Boolean(this.selectedOption)}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=>{const s=e.target;if(this.el.contains(s))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 s=q;const t=()=>{this.positionRetryRaf=null;if(!this.open)return;if(this.updatePosition()){e?.();return}if(s>0){s-=1;this.positionRetryRaf=requestAnimationFrame(t)}};this.positionRetryRaf=requestAnimationFrame(t)}updatePosition(){if(!this.open||!this.triggerEl||!this.popupEl||!this.popupEl.isConnected||!this.el.contains(this.popupEl))return false;const e=C(V.space050,V.space050);this.popupEl.style.minWidth=`${this.triggerEl.offsetWidth+e*2}px`;this.position=n({anchorRect:this.triggerEl.getBoundingClientRect(),popupWidth:this.popupEl.offsetWidth,popupHeight:this.popupEl.offsetHeight,side:"bottom",align:"start",sideOffsetPx:e,alignOffsetPx:-e,viewportPadPx:e,viewportWidth:window.innerWidth,viewportHeight:window.innerHeight});this.positionReady=true;return true}openPopup(e,s){if(this.isDisabled||!this.allOptions.length&&!this.isLoading)return;const t=c(this.visibleOptions);const i=this.visibleOptions.findIndex((e=>e.value===this.value&&!e.isInactive));this.activeIndex=s==="last"?t[t.length-1]??-1:i>=0?i:t[0]??-1;this.focusRingVisible=e;this.open=true}closePopup(e=false){if(!this.open)return;this.open=false;if(e)requestAnimationFrame((()=>this.triggerEl?.focus()))}selectOption(e){if(e.isInactive||this.isLoading)return;this.value=e.value;this.dsChange.emit(this.value);this.closePopup(true)}moveActive(e){this.activeIndex=h(this.visibleOptions,this.activeIndex,e)}setActiveEdge(e){const s=c(this.visibleOptions);this.activeIndex=e==="first"?s[0]??-1:s[s.length-1]??-1}handleTypeahead(e){if(this.typeaheadTimer)clearTimeout(this.typeaheadTimer);this.focusRingVisible=true;const s=e.toLocaleLowerCase();const t=this.typeahead.length>0&&[...this.typeahead].every((e=>e===s));this.typeahead=t?s:`${this.typeahead}${s}`;const i=g(this.visibleOptions,this.typeahead,this.activeIndex);if(i>=0)this.activeIndex=i;const r=F(V.animationDurationMedium1,V.animationDurationMedium1);this.typeaheadTimer=setTimeout((()=>{this.typeahead="";this.typeaheadTimer=null}),r)}handleListKeyDown(e){switch(e.key){case"ArrowDown":e.preventDefault();this.focusRingVisible=true;this.moveActive(1);break;case"ArrowUp":e.preventDefault();this.focusRingVisible=true;this.moveActive(-1);break;case"Home":e.preventDefault();this.focusRingVisible=true;this.setActiveEdge("first");break;case"End":e.preventDefault();this.focusRingVisible=true;this.setActiveEdge("last");break;case"Enter":case" ":{if(e.key===" "&&this.searchable&&e.target===this.searchEl)break;e.preventDefault();const s=this.visibleOptions[this.activeIndex];if(s)this.selectOption(s);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,s,t,r){const o=e.value===this.value;const n=s===this.activeIndex;return i(p,{id:`${this.generatedId}-option-${s}`,option:e,selected:o,active:n,focusRingVisible:this.focusRingVisible,usesSubtext:r,leading:t&&e.icon?i("span",{class:"ds-choice-item__icon ds-interaction-fill__content","aria-hidden":"true"},i("ds-icon",{name:e.icon,size:"md",color:"inherit"})):undefined,onHover:()=>{this.focusRingVisible=false;this.activeIndex=s},onSelect:()=>this.selectOption(e)})}render(){const e=this.isDisabled;const s=!this.hasSelection;const t=s?this.placeholder:this.selectedOption?.label;const o=A[this.size];const n=L[this.size];const c=u(this.allOptions);const a=f(this.allOptions);const d=this.error&&Boolean(this.errorMessage);const l=[this.ariaDescribedby,d?this.errorId:undefined].filter(Boolean).join(" ")||undefined;const h={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 g=0;return i(r,{key:"b94536f9f6da81926ba150bfc41ff97175e46450",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",...j(this.width),[`select-host--background-${this.background}`]:!!this.background}},i("button",{key:"2dc717667dfb4beee26597d1ad3f73b7d6f96bc1",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--placeholder":s,"trigger--has-value":this.hasSelection,"wrapper--error":this.error,[`ds-control--${this.size}`]:true,...b(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:"c6ce88d81f231f1575f38b7b10434a3a0ba6ac8e",class:"trigger__prefix ds-interaction-fill__content","aria-hidden":"true"},this.isLoading?i("ds-loader",{size:n,color:"inherit"}):i("ds-icon",{name:this.icon,size:n,color:"inherit"})),i("ds-text",{key:"01b24089f244518d11c452c32bbbedc4a0c6d3e0",class:"trigger__label ds-interaction-fill__content",as:"span",variant:o,color:"inherit",lineTruncation:1},t),i("span",{key:"c180760cd555cacc7e13b2520fba6bca8e32d431",class:"trigger__chevron ds-interaction-fill__content","aria-hidden":"true"},i("ds-icon",{key:"e67ad10794f114cfb319c308ac056cc314d53718",name:"ChevronDown",size:n,color:"inherit"}))),this.open&&i("div",{key:"14719ae8c94a02bf4df194d04a94aa3dd109dc74",ref:e=>{this.popupEl=e??null},class:"select-popup ds-choice-popup",style:h},this.searchable&&i(v,{key:"344e086c9056ce1a95193db325c9247ce291d73c",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:"767bde539f8358d74fd6e2414687f0f54a8a9e6a",id:this.listboxId,class:"ds-choice-list",role:"listbox","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,g++,c,a))))))),this.allowClear&&this.hasSelection&&!this.isLoading&&i(m,{key:"41cade62cf6f591a240ba34212983cb21810652f",clearLabel:this.clearLabel,onClear:this.clearSelection})),d&&i("ds-text",{key:"e3242aa4c247718cd46ea094bd4452c45f36d738",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{value:[{syncFormValue:0}],disabled:[{syncFormValue:0}],isInactive:[{syncFormValue:0}],required:[{syncFormValue:0}],options:[{syncFormValue:0}],sections:[{syncFormValue:0}],isLoading:[{onLoadingChange:0}],open:[{onOpenChange:0}],searchTerm:[{onSearchTermChange:0}],activeIndex:[{onActiveIndexChange:0}]}}static get style(){return I()}},[66,"ds-select",{options:[16],sections:[16],value:[1025],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"],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,{value:[{syncFormValue:0}],disabled:[{syncFormValue:0}],isInactive:[{syncFormValue:0}],required:[{syncFormValue:0}],options:[{syncFormValue:0}],sections:[{syncFormValue:0}],isLoading:[{onLoadingChange:0}],open:[{onOpenChange:0}],searchTerm:[{onSearchTermChange:0}],activeIndex:[{onActiveIndexChange:0}]}]);function O(){if(typeof customElements==="undefined"){return}const e=["ds-select","ds-badge","ds-button-unfilled","ds-empty-state","ds-icon","ds-loader","ds-text"];e.forEach((e=>{switch(e){case"ds-select":if(!customElements.get(o(e))){customElements.define(o(e),D)}break;case"ds-badge":if(!customElements.get(o(e))){y()}break;case"ds-button-unfilled":if(!customElements.get(o(e))){x()}break;case"ds-empty-state":if(!customElements.get(o(e))){w()}break;case"ds-icon":if(!customElements.get(o(e))){k()}break;case"ds-loader":if(!customElements.get(o(e))){_()}break;case"ds-text":if(!customElements.get(o(e))){z()}break}}))}O();const $=D;const E=O;export{$ as DsSelect,E as defineCustomElement};
|
|
2
2
|
//# sourceMappingURL=ds-select.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["selectCss","ICON_SIZE","md","sm","xs","selectId","Select","__stencil_proxyCustomElement","HTMLElement","constructor","registerHost","this","options","sections","value","open","disabled","required","requiredMessage","placeholder","size","width","isInactive","isLoading","activeFill","hasBorder","allowClear","clearLabel","searchable","searchPlaceholder","noResultsText","loadingLabel","error","ariaLabel","activeIndex","searchTerm","formDisabled","position","x","y","positionReady","focusRingVisible","generatedId","listboxId","errorId","triggerEl","popupEl","searchEl","initialValue","typeahead","typeaheadTimer","outsideHandler","repositionHandler","clearSelection","event","preventDefault","stopPropagation","dsChange","emit","dsClear","enabled","enabledChoiceIndexes","visibleOptions","requestAnimationFrame","focus","handleTriggerKeyDown","includes","key","openPopup","length","metaKey","ctrlKey","altKey","handleTypeahead","handleListKeyDown","componentWillLoad","syncFormValue","componentDidLoad","onOpenChange","disconnectedCallback","unbindPopupListeners","clearTimeout","inactive","isDisabled","resolvedValue","hasSelection","internals","setFormValue","missing","setValidity","valueMissing","updatePosition","onLoadingChange","dsOpenChange","bindPopupListeners","scrollActiveOptionIntoView","onSearchTermChange","onActiveIndexChange","formDisabledCallback","formResetCallback","closePopup","formStateRestoreCallback","state","setFocus","allSections","resolveChoiceSections","allOptions","flattenChoiceSections","visibleSections","filterChoiceSections","selectedOption","find","option","Boolean","activeOptionId","undefined","el","querySelector","scrollIntoView","block","inline","target","contains","document","addEventListener","window","removeEventListener","sectionPadding","resolveCssLengthPx","TOKEN_DEFAULTS","space050","style","minWidth","offsetWidth","computeAnchoredPopupPosition","anchorRect","getBoundingClientRect","popupWidth","popupHeight","offsetHeight","side","align","sideOffsetPx","alignOffsetPx","viewportPadPx","viewportWidth","innerWidth","viewportHeight","innerHeight","focusVisible","edge","selectedIndex","findIndex","restoreFocus","selectOption","moveActive","direction","moveChoiceIndex","setActiveEdge","normalized","toLocaleLowerCase","repeatedCharacter","every","character","match","findChoiceTypeaheadMatch","resetMs","resolveCssTimeMs","animationDurationMedium1","setTimeout","renderOption","index","usesIcons","usesSubtext","selected","active","h","ChoiceOptionRow","id","leading","icon","class","name","color","onHover","onSelect","render","showPlaceholder","label","textVariant","CONTROL_TEXT_VARIANT","iconSize","usesOptionIcons","choiceListUsesIcons","usesOptionSubtext","choiceListUsesSubtext","showError","errorMessage","describedBy","ariaDescribedby","filter","join","popupStyle","left","top","transform","Math","round","zIndex","visibility","flatIndex","Host","controlWidthClass","background","ref","element","inputId","type","trigger","choiceBackgroundClassMap","role","String","ariaLabelledby","onClick","onKeyDown","as","variant","lineTruncation","ChoiceSearch","controls","activeDescendant","inputRef","onValueChange","body","map","section","divider","header","emphasis","ChoiceFooter","onClear","textId"],"sources":["src/wc/components/Select/Select.css?tag=ds-select&encapsulation=scoped","src/wc/components/Select/Select.tsx"],"sourcesContent":["@import '../../utils/choice-list.css';\n@import '../../utils/control-width.css';\n@import '../../utils/typography.css';\n\n:host(.select-host) {\n display: inline-flex;\n flex-direction: column;\n gap: var(--dimension-space-050);\n position: relative;\n outline: none;\n --ds-select-fg: var(--color-foreground-secondary);\n --ds-select-fg-active: var(--color-foreground-primary);\n --ds-select-prefix-fg: var(--ds-select-fg);\n --ds-select-chevron-fg: var(--ds-select-fg);\n --ds-select-border: var(--color-border-secondary);\n}\n\n:host(.ds-control-width--fill),\n:host(.ds-control-width--fill) .trigger {\n width: 100%;\n}\n\n.trigger {\n display: inline-flex;\n align-items: center;\n justify-content: flex-start;\n box-sizing: border-box;\n height: var(--ds-control-height, var(--dimension-size-400));\n padding: 0 var(--ds-control-padding-inline, var(--dimension-space-075));\n gap: var(--ds-control-gap, var(--dimension-space-050));\n background: transparent;\n border: none;\n border-radius: var(--ds-control-radius, var(--dimension-radius-025));\n color: var(--ds-select-fg);\n cursor: pointer;\n font-family: inherit;\n -webkit-user-select: none;\n user-select: none;\n overflow: hidden;\n transition: color var(--effect-motion-short-2);\n}\n\n.trigger--bordered {\n --ds-interaction-border-width: var(--dimension-stroke-width-012);\n --ds-interaction-border-color: var(--ds-select-border);\n}\n\n.trigger--has-value .trigger__label {\n color: var(--ds-select-fg-active);\n}\n\n.wrapper--error {\n --ds-interaction-border-width: var(--dimension-stroke-width-018);\n --ds-interaction-border-color: var(--color-border-bold-negative);\n}\n\n.trigger__prefix,\n.trigger__chevron {\n position: relative;\n z-index: 2;\n flex-shrink: 0;\n width: var(--ds-control-icon, var(--dimension-iconography-md));\n height: var(--ds-control-icon, var(--dimension-iconography-md));\n display: inline-flex;\n align-items: center;\n justify-content: center;\n}\n\n.trigger__prefix {\n color: var(--ds-select-prefix-fg);\n}\n\n.trigger__chevron {\n color: var(--ds-select-chevron-fg);\n}\n\n.trigger__label {\n position: relative;\n z-index: 2;\n flex: 1 1 auto;\n min-width: 0;\n padding: 0 var(--ds-control-label-inset, var(--dimension-space-025));\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n text-align: left;\n color: inherit;\n transition: color var(--effect-motion-short-2);\n}\n\n.select-popup {\n color: var(--color-foreground-secondary);\n}\n\n.select-option[aria-selected='true'] .ds-choice-item__icon {\n color: var(--color-foreground-primary);\n}\n\n.select-search {\n position: relative;\n box-sizing: border-box;\n padding: var(--dimension-space-050);\n}\n\n.select-search::after {\n content: '';\n position: absolute;\n inset: auto 0 0;\n height: var(--dimension-stroke-width-012);\n background-color: var(--color-border-tertiary);\n pointer-events: none;\n}\n\n.select-search:focus-within::after {\n height: var(--dimension-stroke-width-018);\n background-color: var(--color-border-bold-brand);\n}\n\n.select-search__control {\n display: flex;\n align-items: center;\n box-sizing: border-box;\n gap: var(--ds-control-gap, var(--dimension-space-050));\n height: var(--ds-control-height, var(--dimension-size-400));\n padding: 0 var(--ds-control-padding-inline, var(--dimension-space-075));\n border: 0;\n border-radius: var(--ds-control-radius, var(--dimension-radius-025));\n}\n\n.select-search__control:has(.select-search__clear) {\n padding-right: 0;\n}\n\n.select-search .select-search__control > .select-search__clear {\n align-self: center;\n flex-shrink: 0;\n margin-right: var(--dimension-space-050);\n}\n\n.select-search__control input {\n flex: 1;\n min-width: 0;\n height: 100%;\n padding: 0 var(--ds-control-label-inset, var(--dimension-space-025));\n border: 0;\n outline: none;\n background: transparent;\n color: var(--color-foreground-primary);\n font-family: inherit;\n}\n\n.select-search__control input::placeholder {\n color: var(--color-foreground-secondary);\n}\n\n.select-search__control input:focus::placeholder {\n color: var(--color-foreground-quaternary);\n}\n\n.select-search__control input[type='search']::-webkit-search-cancel-button,\n.select-search__control input[type='search']::-webkit-search-decoration {\n display: none;\n}\n\n.error-text {\n width: 100%;\n}\n\n:host(.select-host--background-medium) {\n --ds-select-fg: var(--color-foreground-on-medium-background-secondary);\n --ds-select-fg-active: var(--color-foreground-on-medium-background-primary);\n --ds-select-border: var(--color-border-on-medium-background-secondary);\n}\n\n:host(.select-host--background-bold) {\n --ds-select-fg: var(--color-foreground-on-bold-background-secondary);\n --ds-select-fg-active: var(--color-foreground-on-bold-background-primary);\n --ds-select-border: var(--color-border-on-bold-background-secondary);\n}\n\n:host(.select-host--background-strong) {\n --ds-select-fg: var(--color-foreground-on-strong-background-secondary);\n --ds-select-fg-active: var(--color-foreground-on-strong-background-primary);\n --ds-select-border: var(--color-border-on-strong-background-secondary);\n}\n\n:host(.select-host--background-translucent) {\n --ds-select-fg: var(--color-translucent-foreground-secondary);\n --ds-select-fg-active: var(--color-translucent-foreground-primary);\n --ds-select-border: var(--color-translucent-border-secondary);\n}\n\n:host(.select-host--background-inverted) {\n --ds-select-fg: var(--color-inverted-foreground-secondary);\n --ds-select-fg-active: var(--color-inverted-foreground-primary);\n --ds-select-border: var(--color-inverted-border-secondary);\n}\n\n:host(.select-host--background-media) {\n --ds-select-fg: var(--color-media-foreground-secondary);\n --ds-select-fg-active: var(--color-media-foreground-primary);\n --ds-select-border: var(--color-media-border-secondary);\n}\n\n:host(.select-host--background-always-dark) {\n --ds-select-fg: var(--color-always-dark-foreground-secondary);\n --ds-select-fg-active: var(--color-always-dark-foreground-primary);\n --ds-select-border: var(--color-always-dark-border-secondary);\n}\n","import {\n AttachInternals,\n Component,\n Element,\n Event,\n EventEmitter,\n h,\n Host,\n Method,\n Prop,\n State,\n Watch,\n} from '@stencil/core';\nimport {\n controlWidthClass,\n CONTROL_TEXT_VARIANT,\n resolveCssLengthPx,\n resolveCssTimeMs,\n TOKEN_DEFAULTS,\n type ControlWidth,\n} from '../../utils';\nimport { computeAnchoredPopupPosition } from '../../utils/anchored-popup';\nimport { ChoiceFooter, ChoiceOptionRow, ChoiceSearch } from '../../utils/choice-list-parts';\nimport {\n choiceBackgroundClassMap,\n choiceListUsesIcons,\n choiceListUsesSubtext,\n enabledChoiceIndexes,\n filterChoiceSections,\n findChoiceTypeaheadMatch,\n flattenChoiceSections,\n moveChoiceIndex,\n resolveChoiceSections,\n type ChoiceBackground,\n type ChoiceOption,\n type ChoiceSection,\n} from '../../utils/choice-list';\n\nexport type SelectOption = ChoiceOption;\nexport type SelectSection = ChoiceSection;\nexport type SelectBackground = ChoiceBackground;\nexport type SelectSize = 'md' | 'sm' | 'xs';\nexport type SelectWidth = ControlWidth;\n\nconst ICON_SIZE: Record<SelectSize, 'md' | 'sm' | 'xs'> = {\n md: 'md',\n sm: 'sm',\n xs: 'xs',\n};\n\nlet selectId = 0;\n\n@Component({\n tag: 'ds-select',\n styleUrl: 'Select.css',\n scoped: true,\n formAssociated: true,\n})\nexport class Select {\n @Element() el!: HTMLElement;\n @AttachInternals() internals!: ElementInternals;\n\n /** Flat choices. Assign arrays through the JavaScript property. */\n @Prop() options: SelectOption[] = [];\n /** Grouped choices; takes precedence over options. Assign through JavaScript. */\n @Prop() sections: SelectSection[] = [];\n /** Selected string value. Unknown values render the placeholder and are not submitted. */\n @Prop({ mutable: true }) value: string = '';\n /** Controlled popup visibility. */\n @Prop({ mutable: true, reflect: true }) open: boolean = false;\n /** Native form field name. */\n @Prop({ reflect: true }) name: string | undefined;\n /** Native disabled state. */\n @Prop({ reflect: true }) disabled: boolean = false;\n /** Require one valid selected value. */\n @Prop({ reflect: true }) required: boolean = false;\n /** Validation message used when required is missing. */\n @Prop() requiredMessage: string = 'This field is required.';\n /** Trigger text shown when no valid value is selected. */\n @Prop() placeholder: string = 'Select';\n /** Control density. */\n @Prop() size: SelectSize = 'md';\n /** Width fit — hug content (default) or fill the parent. */\n @Prop() width: SelectWidth = 'hug';\n /** Shared inactive treatment; removes interaction and form submission. */\n @Prop() isInactive: boolean = false;\n /** Replace the prefix with a loader and disable option interaction. */\n @Prop() isLoading: boolean = false;\n /** Show the selected interaction fill when a valid value exists. */\n @Prop() activeFill: boolean = true;\n /** Show the surface-aware inset border. */\n @Prop() hasBorder: boolean = true;\n /** Optional trigger prefix icon name. */\n @Prop() icon: string | undefined;\n /** Show the clear footer action when a value exists. */\n @Prop() allowClear: boolean = true;\n /** Localized clear action label. */\n @Prop() clearLabel: string = 'Clear';\n /** Show immediate local filtering over option labels, subtext, and section headings. */\n @Prop() searchable: boolean = false;\n /** Localized search-field placeholder and accessible name. */\n @Prop() searchPlaceholder: string = 'Search';\n /** Localized empty-filter result text. */\n @Prop() noResultsText: string = 'No results found';\n /** Accessible loading status label. */\n @Prop() loadingLabel: string = 'Loading';\n /** Actual parent surface context; omit on primary and secondary surfaces. */\n @Prop() background: SelectBackground | undefined;\n /** Show invalid visual state. */\n @Prop() error: boolean = false;\n /** Error text rendered below the trigger when error is true. */\n @Prop() errorMessage: string | undefined;\n /** ID applied to the internal combobox trigger for external labels. */\n @Prop() inputId: string | undefined;\n /** Direct accessible name when no external label is available. */\n @Prop({ attribute: 'aria-label' }) ariaLabel: string | null = null;\n /** IDs of elements that label the combobox. */\n @Prop({ attribute: 'aria-labelledby' }) ariaLabelledby: string | undefined;\n /** Additional IDs that describe the combobox. */\n @Prop({ attribute: 'aria-describedby' }) ariaDescribedby: string | undefined;\n\n /** Emitted after user selection or clearing with the next scalar value. */\n @Event() dsChange!: EventEmitter<string>;\n /** Emitted after the footer clear action. */\n @Event() dsClear!: EventEmitter<void>;\n /** Emitted whenever popup visibility changes. */\n @Event() dsOpenChange!: EventEmitter<boolean>;\n\n @State() private activeIndex = -1;\n @State() private searchTerm = '';\n @State() private formDisabled = false;\n @State() private position = { x: 0, y: 0 };\n @State() private positionReady = false;\n @State() private focusRingVisible = false;\n\n private readonly generatedId = `ds-select-${++selectId}`;\n private readonly listboxId = `${this.generatedId}-listbox`;\n private readonly errorId = `${this.generatedId}-error`;\n private triggerEl: HTMLButtonElement | null = null;\n private popupEl: HTMLDivElement | null = null;\n private searchEl: HTMLInputElement | null = null;\n private initialValue = '';\n private typeahead = '';\n private typeaheadTimer: ReturnType<typeof setTimeout> | null = null;\n private outsideHandler: ((event: MouseEvent) => void) | null = null;\n private repositionHandler: (() => void) | null = null;\n\n componentWillLoad() {\n this.initialValue = this.value;\n this.syncFormValue();\n }\n\n componentDidLoad() {\n if (this.open) this.onOpenChange(true);\n }\n\n disconnectedCallback() {\n this.unbindPopupListeners();\n if (this.typeaheadTimer) clearTimeout(this.typeaheadTimer);\n }\n\n @Watch('value')\n @Watch('disabled')\n @Watch('isInactive')\n @Watch('required')\n @Watch('options')\n @Watch('sections')\n syncFormValue() {\n const inactive = this.isDisabled;\n const resolvedValue = this.hasSelection ? this.value : '';\n this.internals.setFormValue(inactive ? null : resolvedValue);\n const missing = this.required && !inactive && !resolvedValue;\n this.internals.setValidity(missing ? { valueMissing: true } : {}, missing ? this.requiredMessage : '');\n if (this.open) {\n const enabled = enabledChoiceIndexes(this.visibleOptions);\n if (!enabled.includes(this.activeIndex)) this.activeIndex = enabled[0] ?? -1;\n requestAnimationFrame(() => this.updatePosition());\n }\n }\n\n @Watch('isLoading')\n onLoadingChange() {\n if (this.open) requestAnimationFrame(() => this.updatePosition());\n }\n\n @Watch('open')\n onOpenChange(open: boolean) {\n this.dsOpenChange.emit(open);\n if (open) {\n this.bindPopupListeners();\n this.positionReady = false;\n requestAnimationFrame(() => {\n this.updatePosition();\n this.scrollActiveOptionIntoView();\n if (this.searchable) this.searchEl?.focus();\n });\n } else {\n this.unbindPopupListeners();\n this.searchTerm = '';\n this.positionReady = false;\n }\n }\n\n @Watch('searchTerm')\n onSearchTermChange() {\n const enabled = enabledChoiceIndexes(this.visibleOptions);\n this.activeIndex = enabled[0] ?? -1;\n requestAnimationFrame(() => {\n this.updatePosition();\n this.scrollActiveOptionIntoView();\n });\n }\n\n @Watch('activeIndex')\n onActiveIndexChange() {\n requestAnimationFrame(() => this.scrollActiveOptionIntoView());\n }\n\n formDisabledCallback(disabled: boolean) {\n this.formDisabled = disabled;\n this.syncFormValue();\n }\n\n formResetCallback() {\n this.value = this.initialValue;\n this.closePopup();\n }\n\n formStateRestoreCallback(state: string | File | FormData | null) {\n this.value = typeof state === 'string' ? state : '';\n }\n\n @Method()\n async setFocus() {\n this.triggerEl?.focus();\n }\n\n private get isDisabled(): boolean {\n return this.disabled || this.isInactive || this.formDisabled;\n }\n\n private get allSections(): SelectSection[] {\n return resolveChoiceSections(this.options, this.sections);\n }\n\n private get allOptions(): SelectOption[] {\n return flattenChoiceSections(this.allSections);\n }\n\n private get visibleSections(): SelectSection[] {\n return this.searchable\n ? filterChoiceSections(this.allSections, this.searchTerm)\n : this.allSections;\n }\n\n private get visibleOptions(): SelectOption[] {\n return flattenChoiceSections(this.visibleSections);\n }\n\n private get selectedOption(): SelectOption | undefined {\n return this.allOptions.find(option => option.value === this.value);\n }\n\n private get hasSelection(): boolean {\n return Boolean(this.selectedOption);\n }\n\n private get activeOptionId(): string | undefined {\n return !this.isLoading && this.activeIndex >= 0\n ? `${this.generatedId}-option-${this.activeIndex}`\n : undefined;\n }\n\n private scrollActiveOptionIntoView() {\n if (!this.open || !this.activeOptionId) return;\n this.el\n .querySelector<HTMLElement>(`#${this.activeOptionId}`)\n ?.scrollIntoView({ block: 'nearest', inline: 'nearest' });\n }\n\n private bindPopupListeners() {\n this.unbindPopupListeners();\n this.outsideHandler = event => {\n const target = event.target as Node;\n if (this.el.contains(target)) return;\n this.closePopup();\n };\n this.repositionHandler = () => this.updatePosition();\n document.addEventListener('mousedown', this.outsideHandler, true);\n window.addEventListener('scroll', this.repositionHandler, true);\n window.addEventListener('resize', this.repositionHandler);\n }\n\n private unbindPopupListeners() {\n if (this.outsideHandler) {\n document.removeEventListener('mousedown', this.outsideHandler, true);\n this.outsideHandler = null;\n }\n if (this.repositionHandler) {\n window.removeEventListener('scroll', this.repositionHandler, true);\n window.removeEventListener('resize', this.repositionHandler);\n this.repositionHandler = null;\n }\n }\n\n private updatePosition() {\n if (!this.open || !this.triggerEl || !this.popupEl) return;\n const sectionPadding = resolveCssLengthPx(TOKEN_DEFAULTS.space050, TOKEN_DEFAULTS.space050);\n this.popupEl.style.minWidth = `${this.triggerEl.offsetWidth + sectionPadding * 2}px`;\n this.position = computeAnchoredPopupPosition({\n anchorRect: this.triggerEl.getBoundingClientRect(),\n popupWidth: this.popupEl.offsetWidth,\n popupHeight: this.popupEl.offsetHeight,\n side: 'bottom',\n align: 'start',\n sideOffsetPx: sectionPadding,\n alignOffsetPx: -sectionPadding,\n viewportPadPx: sectionPadding,\n viewportWidth: window.innerWidth,\n viewportHeight: window.innerHeight,\n });\n this.positionReady = true;\n }\n\n private openPopup(focusVisible: boolean, edge?: 'first' | 'last') {\n if (this.isDisabled || (!this.allOptions.length && !this.isLoading)) return;\n const enabled = enabledChoiceIndexes(this.visibleOptions);\n const selectedIndex = this.visibleOptions.findIndex(\n option => option.value === this.value && !option.isInactive,\n );\n this.activeIndex =\n edge === 'last'\n ? (enabled[enabled.length - 1] ?? -1)\n : selectedIndex >= 0\n ? selectedIndex\n : (enabled[0] ?? -1);\n this.focusRingVisible = focusVisible;\n this.open = true;\n }\n\n private closePopup(restoreFocus = false) {\n if (!this.open) return;\n this.open = false;\n if (restoreFocus) requestAnimationFrame(() => this.triggerEl?.focus());\n }\n\n private selectOption(option: SelectOption) {\n if (option.isInactive || this.isLoading) return;\n this.value = option.value;\n this.dsChange.emit(this.value);\n this.closePopup(true);\n }\n\n private clearSelection = (event: Event) => {\n event.preventDefault();\n event.stopPropagation();\n this.value = '';\n this.dsChange.emit('');\n this.dsClear.emit();\n const enabled = enabledChoiceIndexes(this.visibleOptions);\n this.activeIndex = enabled[0] ?? -1;\n requestAnimationFrame(() => (this.searchable ? this.searchEl?.focus() : this.triggerEl?.focus()));\n };\n\n private moveActive(direction: 1 | -1) {\n this.activeIndex = moveChoiceIndex(this.visibleOptions, this.activeIndex, direction);\n }\n\n private setActiveEdge(edge: 'first' | 'last') {\n const enabled = enabledChoiceIndexes(this.visibleOptions);\n this.activeIndex =\n edge === 'first' ? (enabled[0] ?? -1) : (enabled[enabled.length - 1] ?? -1);\n }\n\n private handleTypeahead(key: string) {\n if (this.typeaheadTimer) clearTimeout(this.typeaheadTimer);\n this.focusRingVisible = true;\n const normalized = key.toLocaleLowerCase();\n const repeatedCharacter =\n this.typeahead.length > 0 &&\n [...this.typeahead].every(character => character === normalized);\n this.typeahead = repeatedCharacter ? normalized : `${this.typeahead}${normalized}`;\n const match = findChoiceTypeaheadMatch(this.visibleOptions, this.typeahead, this.activeIndex);\n if (match >= 0) this.activeIndex = match;\n const resetMs = resolveCssTimeMs(\n TOKEN_DEFAULTS.animationDurationMedium1,\n TOKEN_DEFAULTS.animationDurationMedium1,\n );\n this.typeaheadTimer = setTimeout(() => {\n this.typeahead = '';\n this.typeaheadTimer = null;\n }, resetMs);\n }\n\n private handleListKeyDown(event: KeyboardEvent) {\n switch (event.key) {\n case 'ArrowDown':\n event.preventDefault();\n this.focusRingVisible = true;\n this.moveActive(1);\n break;\n case 'ArrowUp':\n event.preventDefault();\n this.focusRingVisible = true;\n this.moveActive(-1);\n break;\n case 'Home':\n event.preventDefault();\n this.focusRingVisible = true;\n this.setActiveEdge('first');\n break;\n case 'End':\n event.preventDefault();\n this.focusRingVisible = true;\n this.setActiveEdge('last');\n break;\n case 'Enter':\n case ' ': {\n if (event.key === ' ' && this.searchable && event.target === this.searchEl) break;\n event.preventDefault();\n const option = this.visibleOptions[this.activeIndex];\n if (option) this.selectOption(option);\n break;\n }\n case 'Escape':\n event.preventDefault();\n this.closePopup(true);\n break;\n case 'Tab':\n this.closePopup();\n break;\n default:\n if (!this.searchable && event.key.length === 1 && !event.metaKey && !event.ctrlKey && !event.altKey) {\n this.handleTypeahead(event.key);\n }\n }\n }\n\n private handleTriggerKeyDown = (event: KeyboardEvent) => {\n if (!this.open) {\n if (['ArrowDown', 'ArrowUp', 'Enter', ' '].includes(event.key)) {\n event.preventDefault();\n this.openPopup(true, event.key === 'ArrowUp' ? 'last' : 'first');\n } else if (event.key.length === 1 && !event.metaKey && !event.ctrlKey && !event.altKey) {\n event.preventDefault();\n this.openPopup(true);\n if (this.searchable) {\n this.searchTerm = event.key;\n } else {\n this.handleTypeahead(event.key);\n }\n }\n return;\n }\n this.handleListKeyDown(event);\n };\n\n private renderOption(\n option: SelectOption,\n index: number,\n usesIcons: boolean,\n usesSubtext: boolean,\n ) {\n const selected = option.value === this.value;\n const active = index === this.activeIndex;\n return (\n <ChoiceOptionRow\n id={`${this.generatedId}-option-${index}`}\n option={option}\n selected={selected}\n active={active}\n focusRingVisible={this.focusRingVisible}\n usesSubtext={usesSubtext}\n leading={usesIcons && option.icon ? (\n <span class=\"ds-choice-item__icon ds-interaction-fill__content\" aria-hidden=\"true\">\n <ds-icon name={option.icon} size=\"md\" color=\"inherit\" />\n </span>\n ) : undefined}\n onHover={() => {\n this.focusRingVisible = false;\n this.activeIndex = index;\n }}\n onSelect={() => this.selectOption(option)}\n />\n );\n }\n\n render() {\n const inactive = this.isDisabled;\n const showPlaceholder = !this.hasSelection;\n const label = showPlaceholder ? this.placeholder : this.selectedOption?.label;\n const textVariant = CONTROL_TEXT_VARIANT[this.size];\n const iconSize = ICON_SIZE[this.size];\n const usesOptionIcons = choiceListUsesIcons(this.allOptions);\n const usesOptionSubtext = choiceListUsesSubtext(this.allOptions);\n const showError = this.error && Boolean(this.errorMessage);\n const describedBy = [this.ariaDescribedby, showError ? this.errorId : undefined]\n .filter(Boolean)\n .join(' ') || undefined;\n const popupStyle = {\n position: 'fixed',\n left: '0',\n top: '0',\n transform: `translate(${Math.round(this.position.x)}px, ${Math.round(this.position.y)}px)`,\n zIndex: 'var(--dimension-z-index-floating)',\n visibility: this.positionReady ? 'visible' : 'hidden',\n };\n let flatIndex = 0;\n\n return (\n <Host\n class={{\n 'select-host': true,\n 'ds-control-inactive': inactive,\n 'ds-control--md': this.size === 'md',\n 'ds-control--sm': this.size === 'sm',\n 'ds-control--xs': this.size === 'xs',\n ...controlWidthClass(this.width),\n [`select-host--background-${this.background}`]: !!this.background,\n }}\n >\n <button\n ref={element => {\n this.triggerEl = (element as HTMLButtonElement) ?? null;\n }}\n id={this.inputId ?? this.generatedId}\n type=\"button\"\n class={{\n trigger: true,\n 'ds-focus-ring-inset': true,\n 'ds-interaction-fill': true,\n 'ds-interaction-fill--selected':\n !inactive && this.activeFill && this.hasSelection,\n 'trigger--bordered': this.hasBorder || this.error,\n 'trigger--placeholder': showPlaceholder,\n 'trigger--has-value': this.hasSelection,\n 'wrapper--error': this.error,\n [`ds-control--${this.size}`]: true,\n ...choiceBackgroundClassMap(this.background),\n }}\n disabled={inactive}\n role=\"combobox\"\n aria-haspopup=\"listbox\"\n aria-expanded={String(this.open)}\n aria-controls={this.open ? this.listboxId : undefined}\n aria-activedescendant={this.open && !this.searchable ? this.activeOptionId : undefined}\n aria-label={this.ariaLabel}\n aria-labelledby={this.ariaLabelledby}\n aria-describedby={describedBy}\n aria-invalid={this.error ? 'true' : undefined}\n aria-required={this.required || undefined}\n aria-busy={this.isLoading ? 'true' : undefined}\n onClick={() => (this.open ? this.closePopup() : this.openPopup(false))}\n onKeyDown={this.handleTriggerKeyDown}\n >\n {(this.icon || this.isLoading) && (\n <span class=\"trigger__prefix ds-interaction-fill__content\" aria-hidden=\"true\">\n {this.isLoading ? (\n <ds-loader size={iconSize} color=\"inherit\" />\n ) : (\n <ds-icon name={this.icon} size={iconSize} color=\"inherit\" />\n )}\n </span>\n )}\n <ds-text\n class=\"trigger__label ds-interaction-fill__content\"\n as=\"span\"\n variant={textVariant}\n color=\"inherit\"\n lineTruncation={1}\n >\n {label}\n </ds-text>\n <span class=\"trigger__chevron ds-interaction-fill__content\" aria-hidden=\"true\">\n <ds-icon name=\"ChevronDown\" size={iconSize} color=\"inherit\" />\n </span>\n </button>\n\n {this.open && (\n <div\n ref={element => {\n this.popupEl = (element as HTMLDivElement) ?? null;\n }}\n class=\"select-popup ds-choice-popup\"\n style={popupStyle}\n >\n {this.searchable && (\n <ChoiceSearch\n value={this.searchTerm}\n placeholder={this.searchPlaceholder}\n controls={this.listboxId}\n activeDescendant={this.activeOptionId}\n inputRef={element => {\n this.searchEl = element;\n }}\n clearLabel={this.clearLabel}\n onValueChange={value => {\n this.searchTerm = value;\n }}\n onKeyDown={event => this.handleListKeyDown(event)}\n />\n )}\n <div\n id={this.listboxId}\n class=\"ds-choice-list\"\n role=\"listbox\"\n aria-label={this.ariaLabel ?? this.placeholder}\n aria-busy={this.isLoading ? 'true' : undefined}\n >\n {this.isLoading ? (\n <div\n class=\"ds-choice-loading\"\n role=\"option\"\n aria-selected=\"false\"\n aria-disabled=\"true\"\n aria-label={this.loadingLabel}\n aria-live=\"polite\"\n >\n <ds-loader size=\"md\" color=\"inherit\" />\n </div>\n ) : this.visibleOptions.length === 0 ? (\n <div\n class=\"ds-choice-empty\"\n role=\"option\"\n aria-selected=\"false\"\n aria-disabled=\"true\"\n aria-label={this.noResultsText}\n aria-live=\"polite\"\n >\n <ds-empty-state body={this.noResultsText} />\n </div>\n ) : (\n this.visibleSections.map(section => (\n <div\n class={{\n 'ds-choice-section': true,\n 'ds-choice-section--divided': !!section.divider,\n }}\n role={section.header ? 'group' : undefined}\n aria-label={section.header}\n >\n {section.header && (\n <ds-text\n class=\"ds-choice-section__header ds-control--md\"\n as=\"span\"\n variant=\"text-body-small\"\n emphasis\n color=\"primary\"\n aria-hidden=\"true\"\n >\n {section.header}\n </ds-text>\n )}\n {section.options.map(option => this.renderOption(\n option,\n flatIndex++,\n usesOptionIcons,\n usesOptionSubtext,\n ))}\n </div>\n ))\n )}\n </div>\n {this.allowClear && this.hasSelection && !this.isLoading && (\n <ChoiceFooter clearLabel={this.clearLabel} onClear={this.clearSelection} />\n )}\n </div>\n )}\n\n {showError && (\n <ds-text\n class=\"error-text\"\n as=\"div\"\n variant=\"text-body-small\"\n color=\"negative\"\n textId={this.errorId}\n role=\"alert\"\n >\n {this.errorMessage}\n </ds-text>\n )}\n </Host>\n );\n }\n}\n"],"mappings":"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","ignoreList":[]}
|
|
1
|
+
{"version":3,"names":["selectCss","ICON_SIZE","md","sm","xs","selectId","POSITION_RETRY_BUDGET","Select","__stencil_proxyCustomElement","HTMLElement","constructor","registerHost","this","options","sections","value","open","disabled","required","requiredMessage","placeholder","size","width","isInactive","isLoading","activeFill","hasBorder","allowClear","clearLabel","searchable","searchPlaceholder","noResultsText","loadingLabel","error","ariaLabel","activeIndex","searchTerm","formDisabled","position","x","y","positionReady","focusRingVisible","generatedId","listboxId","errorId","triggerEl","popupEl","searchEl","initialValue","typeahead","typeaheadTimer","outsideHandler","repositionHandler","positionRetryRaf","clearSelection","event","preventDefault","stopPropagation","dsChange","emit","dsClear","enabled","enabledChoiceIndexes","visibleOptions","requestAnimationFrame","focus","handleTriggerKeyDown","includes","key","openPopup","length","metaKey","ctrlKey","altKey","handleTypeahead","handleListKeyDown","componentWillLoad","syncFormValue","componentDidLoad","onOpenChange","disconnectedCallback","cancelPositionRetry","unbindPopupListeners","clearTimeout","inactive","isDisabled","resolvedValue","hasSelection","internals","setFormValue","missing","setValidity","valueMissing","updatePosition","onLoadingChange","dsOpenChange","bindPopupListeners","schedulePositionUpdate","scrollActiveOptionIntoView","onSearchTermChange","onActiveIndexChange","formDisabledCallback","formResetCallback","closePopup","formStateRestoreCallback","state","setFocus","allSections","resolveChoiceSections","allOptions","flattenChoiceSections","visibleSections","filterChoiceSections","selectedOption","find","option","Boolean","activeOptionId","undefined","el","querySelector","scrollIntoView","block","inline","target","contains","document","addEventListener","window","removeEventListener","cancelAnimationFrame","onReady","remaining","attempt","isConnected","sectionPadding","resolveCssLengthPx","TOKEN_DEFAULTS","space050","style","minWidth","offsetWidth","computeAnchoredPopupPosition","anchorRect","getBoundingClientRect","popupWidth","popupHeight","offsetHeight","side","align","sideOffsetPx","alignOffsetPx","viewportPadPx","viewportWidth","innerWidth","viewportHeight","innerHeight","focusVisible","edge","selectedIndex","findIndex","restoreFocus","selectOption","moveActive","direction","moveChoiceIndex","setActiveEdge","normalized","toLocaleLowerCase","repeatedCharacter","every","character","match","findChoiceTypeaheadMatch","resetMs","resolveCssTimeMs","animationDurationMedium1","setTimeout","renderOption","index","usesIcons","usesSubtext","selected","active","h","ChoiceOptionRow","id","leading","icon","class","name","color","onHover","onSelect","render","showPlaceholder","label","textVariant","CONTROL_TEXT_VARIANT","iconSize","usesOptionIcons","choiceListUsesIcons","usesOptionSubtext","choiceListUsesSubtext","showError","errorMessage","describedBy","ariaDescribedby","filter","join","popupStyle","left","top","transform","Math","round","zIndex","visibility","flatIndex","Host","controlWidthClass","background","ref","element","inputId","type","trigger","choiceBackgroundClassMap","role","String","ariaLabelledby","onClick","onKeyDown","as","variant","lineTruncation","ChoiceSearch","controls","activeDescendant","inputRef","onValueChange","body","map","section","divider","header","emphasis","ChoiceFooter","onClear","textId"],"sources":["src/wc/components/Select/Select.css?tag=ds-select&encapsulation=scoped","src/wc/components/Select/Select.tsx"],"sourcesContent":["@import '../../utils/choice-list.css';\n@import '../../utils/control-width.css';\n@import '../../utils/typography.css';\n\n:host(.select-host) {\n display: inline-flex;\n flex-direction: column;\n gap: var(--dimension-space-050);\n position: relative;\n outline: none;\n --ds-select-fg: var(--color-foreground-secondary);\n --ds-select-fg-active: var(--color-foreground-primary);\n --ds-select-prefix-fg: var(--ds-select-fg);\n --ds-select-chevron-fg: var(--ds-select-fg);\n --ds-select-border: var(--color-border-secondary);\n}\n\n:host(.ds-control-width--fill),\n:host(.ds-control-width--fill) .trigger {\n width: 100%;\n}\n\n.trigger {\n display: inline-flex;\n align-items: center;\n justify-content: flex-start;\n box-sizing: border-box;\n height: var(--ds-control-height, var(--dimension-size-400));\n padding: 0 var(--ds-control-padding-inline, var(--dimension-space-075));\n gap: var(--ds-control-gap, var(--dimension-space-050));\n background: transparent;\n border: none;\n border-radius: var(--ds-control-radius, var(--dimension-radius-025));\n color: var(--ds-select-fg);\n cursor: pointer;\n font-family: inherit;\n -webkit-user-select: none;\n user-select: none;\n overflow: hidden;\n transition: color var(--effect-motion-short-2);\n}\n\n.trigger--bordered {\n --ds-interaction-border-width: var(--dimension-stroke-width-012);\n --ds-interaction-border-color: var(--ds-select-border);\n}\n\n.trigger--has-value .trigger__label {\n color: var(--ds-select-fg-active);\n}\n\n.wrapper--error {\n --ds-interaction-border-width: var(--dimension-stroke-width-018);\n --ds-interaction-border-color: var(--color-border-bold-negative);\n}\n\n.trigger__prefix,\n.trigger__chevron {\n position: relative;\n z-index: 2;\n flex-shrink: 0;\n width: var(--ds-control-icon, var(--dimension-iconography-md));\n height: var(--ds-control-icon, var(--dimension-iconography-md));\n display: inline-flex;\n align-items: center;\n justify-content: center;\n}\n\n.trigger__prefix {\n color: var(--ds-select-prefix-fg);\n}\n\n.trigger__chevron {\n color: var(--ds-select-chevron-fg);\n}\n\n.trigger__label {\n position: relative;\n z-index: 2;\n flex: 1 1 auto;\n min-width: 0;\n padding: 0 var(--ds-control-label-inset, var(--dimension-space-025));\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n text-align: left;\n color: inherit;\n transition: color var(--effect-motion-short-2);\n}\n\n.select-popup {\n color: var(--color-foreground-secondary);\n}\n\n.select-option[aria-selected='true'] .ds-choice-item__icon {\n color: var(--color-foreground-primary);\n}\n\n.select-search {\n position: relative;\n box-sizing: border-box;\n padding: var(--dimension-space-050);\n}\n\n.select-search::after {\n content: '';\n position: absolute;\n inset: auto 0 0;\n height: var(--dimension-stroke-width-012);\n background-color: var(--color-border-tertiary);\n pointer-events: none;\n}\n\n.select-search:focus-within::after {\n height: var(--dimension-stroke-width-018);\n background-color: var(--color-border-bold-brand);\n}\n\n.select-search__control {\n display: flex;\n align-items: center;\n box-sizing: border-box;\n gap: var(--ds-control-gap, var(--dimension-space-050));\n height: var(--ds-control-height, var(--dimension-size-400));\n padding: 0 var(--ds-control-padding-inline, var(--dimension-space-075));\n border: 0;\n border-radius: var(--ds-control-radius, var(--dimension-radius-025));\n}\n\n.select-search__control:has(.select-search__clear) {\n padding-right: 0;\n}\n\n.select-search .select-search__control > .select-search__clear {\n align-self: center;\n flex-shrink: 0;\n margin-right: var(--dimension-space-050);\n}\n\n.select-search__control input {\n flex: 1;\n min-width: 0;\n height: 100%;\n padding: 0 var(--ds-control-label-inset, var(--dimension-space-025));\n border: 0;\n outline: none;\n background: transparent;\n color: var(--color-foreground-primary);\n font-family: inherit;\n}\n\n.select-search__control input::placeholder {\n color: var(--color-foreground-secondary);\n}\n\n.select-search__control input:focus::placeholder {\n color: var(--color-foreground-quaternary);\n}\n\n.select-search__control input[type='search']::-webkit-search-cancel-button,\n.select-search__control input[type='search']::-webkit-search-decoration {\n display: none;\n}\n\n.error-text {\n width: 100%;\n}\n\n:host(.select-host--background-medium) {\n --ds-select-fg: var(--color-foreground-on-medium-background-secondary);\n --ds-select-fg-active: var(--color-foreground-on-medium-background-primary);\n --ds-select-border: var(--color-border-on-medium-background-secondary);\n}\n\n:host(.select-host--background-bold) {\n --ds-select-fg: var(--color-foreground-on-bold-background-secondary);\n --ds-select-fg-active: var(--color-foreground-on-bold-background-primary);\n --ds-select-border: var(--color-border-on-bold-background-secondary);\n}\n\n:host(.select-host--background-strong) {\n --ds-select-fg: var(--color-foreground-on-strong-background-secondary);\n --ds-select-fg-active: var(--color-foreground-on-strong-background-primary);\n --ds-select-border: var(--color-border-on-strong-background-secondary);\n}\n\n:host(.select-host--background-translucent) {\n --ds-select-fg: var(--color-translucent-foreground-secondary);\n --ds-select-fg-active: var(--color-translucent-foreground-primary);\n --ds-select-border: var(--color-translucent-border-secondary);\n}\n\n:host(.select-host--background-inverted) {\n --ds-select-fg: var(--color-inverted-foreground-secondary);\n --ds-select-fg-active: var(--color-inverted-foreground-primary);\n --ds-select-border: var(--color-inverted-border-secondary);\n}\n\n:host(.select-host--background-media) {\n --ds-select-fg: var(--color-media-foreground-secondary);\n --ds-select-fg-active: var(--color-media-foreground-primary);\n --ds-select-border: var(--color-media-border-secondary);\n}\n\n:host(.select-host--background-always-dark) {\n --ds-select-fg: var(--color-always-dark-foreground-secondary);\n --ds-select-fg-active: var(--color-always-dark-foreground-primary);\n --ds-select-border: var(--color-always-dark-border-secondary);\n}\n","import {\n AttachInternals,\n Component,\n Element,\n Event,\n EventEmitter,\n h,\n Host,\n Method,\n Prop,\n State,\n Watch,\n} from '@stencil/core';\nimport {\n controlWidthClass,\n CONTROL_TEXT_VARIANT,\n resolveCssLengthPx,\n resolveCssTimeMs,\n TOKEN_DEFAULTS,\n type ControlWidth,\n} from '../../utils';\nimport { computeAnchoredPopupPosition } from '../../utils/anchored-popup';\nimport { ChoiceFooter, ChoiceOptionRow, ChoiceSearch } from '../../utils/choice-list-parts';\nimport {\n choiceBackgroundClassMap,\n choiceListUsesIcons,\n choiceListUsesSubtext,\n enabledChoiceIndexes,\n filterChoiceSections,\n findChoiceTypeaheadMatch,\n flattenChoiceSections,\n moveChoiceIndex,\n resolveChoiceSections,\n type ChoiceBackground,\n type ChoiceOption,\n type ChoiceSection,\n} from '../../utils/choice-list';\n\nexport type SelectOption = ChoiceOption;\nexport type SelectSection = ChoiceSection;\nexport type SelectBackground = ChoiceBackground;\nexport type SelectSize = 'md' | 'sm' | 'xs';\nexport type SelectWidth = ControlWidth;\n\nconst ICON_SIZE: Record<SelectSize, 'md' | 'sm' | 'xs'> = {\n md: 'md',\n sm: 'sm',\n xs: 'xs',\n};\n\nlet selectId = 0;\n/** rAF retries while the conditionally rendered popup mounts. */\nconst POSITION_RETRY_BUDGET = 8;\n\n@Component({\n tag: 'ds-select',\n styleUrl: 'Select.css',\n scoped: true,\n formAssociated: true,\n})\nexport class Select {\n @Element() el!: HTMLElement;\n @AttachInternals() internals!: ElementInternals;\n\n /** Flat choices. Assign arrays through the JavaScript property. */\n @Prop() options: SelectOption[] = [];\n /** Grouped choices; takes precedence over options. Assign through JavaScript. */\n @Prop() sections: SelectSection[] = [];\n /** Selected string value. Unknown values render the placeholder and are not submitted. */\n @Prop({ mutable: true }) value: string = '';\n /** Controlled popup visibility. */\n @Prop({ mutable: true, reflect: true }) open: boolean = false;\n /** Native form field name. */\n @Prop({ reflect: true }) name: string | undefined;\n /** Native disabled state. */\n @Prop({ reflect: true }) disabled: boolean = false;\n /** Require one valid selected value. */\n @Prop({ reflect: true }) required: boolean = false;\n /** Validation message used when required is missing. */\n @Prop() requiredMessage: string = 'This field is required.';\n /** Trigger text shown when no valid value is selected. */\n @Prop() placeholder: string = 'Select';\n /** Control density. */\n @Prop() size: SelectSize = 'md';\n /** Width fit — hug content (default) or fill the parent. */\n @Prop() width: SelectWidth = 'hug';\n /** Shared inactive treatment; removes interaction and form submission. */\n @Prop() isInactive: boolean = false;\n /** Replace the prefix with a loader and disable option interaction. */\n @Prop() isLoading: boolean = false;\n /** Show the selected interaction fill when a valid value exists. */\n @Prop() activeFill: boolean = true;\n /** Show the surface-aware inset border. */\n @Prop() hasBorder: boolean = true;\n /** Optional trigger prefix icon name. */\n @Prop() icon: string | undefined;\n /** Show the clear footer action when a value exists. */\n @Prop() allowClear: boolean = true;\n /** Localized clear action label. */\n @Prop() clearLabel: string = 'Clear';\n /** Show immediate local filtering over option labels, subtext, and section headings. */\n @Prop() searchable: boolean = false;\n /** Localized search-field placeholder and accessible name. */\n @Prop() searchPlaceholder: string = 'Search';\n /** Localized empty-filter result text. */\n @Prop() noResultsText: string = 'No results found';\n /** Accessible loading status label. */\n @Prop() loadingLabel: string = 'Loading';\n /** Actual parent surface context; omit on primary and secondary surfaces. */\n @Prop() background: SelectBackground | undefined;\n /** Show invalid visual state. */\n @Prop() error: boolean = false;\n /** Error text rendered below the trigger when error is true. */\n @Prop() errorMessage: string | undefined;\n /** ID applied to the internal combobox trigger for external labels. */\n @Prop() inputId: string | undefined;\n /** Direct accessible name when no external label is available. */\n @Prop({ attribute: 'aria-label' }) ariaLabel: string | null = null;\n /** IDs of elements that label the combobox. */\n @Prop({ attribute: 'aria-labelledby' }) ariaLabelledby: string | undefined;\n /** Additional IDs that describe the combobox. */\n @Prop({ attribute: 'aria-describedby' }) ariaDescribedby: string | undefined;\n\n /** Emitted after user selection or clearing with the next scalar value. */\n @Event() dsChange!: EventEmitter<string>;\n /** Emitted after the footer clear action. */\n @Event() dsClear!: EventEmitter<void>;\n /** Emitted whenever popup visibility changes. */\n @Event() dsOpenChange!: EventEmitter<boolean>;\n\n @State() private activeIndex = -1;\n @State() private searchTerm = '';\n @State() private formDisabled = false;\n @State() private position = { x: 0, y: 0 };\n @State() private positionReady = false;\n @State() private focusRingVisible = false;\n\n private readonly generatedId = `ds-select-${++selectId}`;\n private readonly listboxId = `${this.generatedId}-listbox`;\n private readonly errorId = `${this.generatedId}-error`;\n private triggerEl: HTMLButtonElement | null = null;\n private popupEl: HTMLDivElement | null = null;\n private searchEl: HTMLInputElement | null = null;\n private initialValue = '';\n private typeahead = '';\n private typeaheadTimer: ReturnType<typeof setTimeout> | null = null;\n private outsideHandler: ((event: MouseEvent) => void) | null = null;\n private repositionHandler: (() => void) | null = null;\n private positionRetryRaf: number | null = null;\n\n componentWillLoad() {\n this.initialValue = this.value;\n this.syncFormValue();\n }\n\n componentDidLoad() {\n if (this.open) this.onOpenChange(true);\n }\n\n disconnectedCallback() {\n this.cancelPositionRetry();\n this.unbindPopupListeners();\n if (this.typeaheadTimer) clearTimeout(this.typeaheadTimer);\n }\n\n @Watch('value')\n @Watch('disabled')\n @Watch('isInactive')\n @Watch('required')\n @Watch('options')\n @Watch('sections')\n syncFormValue() {\n const inactive = this.isDisabled;\n const resolvedValue = this.hasSelection ? this.value : '';\n this.internals.setFormValue(inactive ? null : resolvedValue);\n const missing = this.required && !inactive && !resolvedValue;\n this.internals.setValidity(missing ? { valueMissing: true } : {}, missing ? this.requiredMessage : '');\n if (this.open) {\n const enabled = enabledChoiceIndexes(this.visibleOptions);\n if (!enabled.includes(this.activeIndex)) this.activeIndex = enabled[0] ?? -1;\n requestAnimationFrame(() => this.updatePosition());\n }\n }\n\n @Watch('isLoading')\n onLoadingChange() {\n if (this.open) requestAnimationFrame(() => this.updatePosition());\n }\n\n @Watch('open')\n onOpenChange(open: boolean) {\n this.dsOpenChange.emit(open);\n if (open) {\n this.bindPopupListeners();\n this.schedulePositionUpdate(() => {\n this.scrollActiveOptionIntoView();\n if (this.searchable) this.searchEl?.focus();\n });\n } else {\n this.cancelPositionRetry();\n this.unbindPopupListeners();\n this.searchTerm = '';\n this.positionReady = false;\n }\n }\n\n @Watch('searchTerm')\n onSearchTermChange() {\n const enabled = enabledChoiceIndexes(this.visibleOptions);\n this.activeIndex = enabled[0] ?? -1;\n requestAnimationFrame(() => {\n this.updatePosition();\n this.scrollActiveOptionIntoView();\n });\n }\n\n @Watch('activeIndex')\n onActiveIndexChange() {\n requestAnimationFrame(() => this.scrollActiveOptionIntoView());\n }\n\n formDisabledCallback(disabled: boolean) {\n this.formDisabled = disabled;\n this.syncFormValue();\n }\n\n formResetCallback() {\n this.value = this.initialValue;\n this.closePopup();\n }\n\n formStateRestoreCallback(state: string | File | FormData | null) {\n this.value = typeof state === 'string' ? state : '';\n }\n\n @Method()\n async setFocus() {\n this.triggerEl?.focus();\n }\n\n private get isDisabled(): boolean {\n return this.disabled || this.isInactive || this.formDisabled;\n }\n\n private get allSections(): SelectSection[] {\n return resolveChoiceSections(this.options, this.sections);\n }\n\n private get allOptions(): SelectOption[] {\n return flattenChoiceSections(this.allSections);\n }\n\n private get visibleSections(): SelectSection[] {\n return this.searchable\n ? filterChoiceSections(this.allSections, this.searchTerm)\n : this.allSections;\n }\n\n private get visibleOptions(): SelectOption[] {\n return flattenChoiceSections(this.visibleSections);\n }\n\n private get selectedOption(): SelectOption | undefined {\n return this.allOptions.find(option => option.value === this.value);\n }\n\n private get hasSelection(): boolean {\n return Boolean(this.selectedOption);\n }\n\n private get activeOptionId(): string | undefined {\n return !this.isLoading && this.activeIndex >= 0\n ? `${this.generatedId}-option-${this.activeIndex}`\n : undefined;\n }\n\n private scrollActiveOptionIntoView() {\n if (!this.open || !this.activeOptionId) return;\n this.el\n .querySelector<HTMLElement>(`#${this.activeOptionId}`)\n ?.scrollIntoView({ block: 'nearest', inline: 'nearest' });\n }\n\n private bindPopupListeners() {\n this.unbindPopupListeners();\n this.outsideHandler = event => {\n const target = event.target as Node;\n if (this.el.contains(target)) return;\n this.closePopup();\n };\n this.repositionHandler = () => this.updatePosition();\n document.addEventListener('mousedown', this.outsideHandler, true);\n window.addEventListener('scroll', this.repositionHandler, true);\n window.addEventListener('resize', this.repositionHandler);\n }\n\n private unbindPopupListeners() {\n if (this.outsideHandler) {\n document.removeEventListener('mousedown', this.outsideHandler, true);\n this.outsideHandler = null;\n }\n if (this.repositionHandler) {\n window.removeEventListener('scroll', this.repositionHandler, true);\n window.removeEventListener('resize', this.repositionHandler);\n this.repositionHandler = null;\n }\n }\n\n private cancelPositionRetry() {\n if (this.positionRetryRaf !== null) {\n cancelAnimationFrame(this.positionRetryRaf);\n this.positionRetryRaf = null;\n }\n }\n\n /** Retry until the conditionally rendered popup is mounted and measurable. */\n private schedulePositionUpdate(onReady?: () => void) {\n if (!this.open) return;\n\n this.cancelPositionRetry();\n this.positionReady = false;\n let remaining = POSITION_RETRY_BUDGET;\n\n const attempt = () => {\n this.positionRetryRaf = null;\n if (!this.open) return;\n\n if (this.updatePosition()) {\n onReady?.();\n return;\n }\n\n if (remaining > 0) {\n remaining -= 1;\n this.positionRetryRaf = requestAnimationFrame(attempt);\n }\n };\n\n this.positionRetryRaf = requestAnimationFrame(attempt);\n }\n\n /** @returns `true` when the current popup was found and positioned. */\n private updatePosition(): boolean {\n if (\n !this.open ||\n !this.triggerEl ||\n !this.popupEl ||\n !this.popupEl.isConnected ||\n !this.el.contains(this.popupEl)\n ) return false;\n const sectionPadding = resolveCssLengthPx(TOKEN_DEFAULTS.space050, TOKEN_DEFAULTS.space050);\n this.popupEl.style.minWidth = `${this.triggerEl.offsetWidth + sectionPadding * 2}px`;\n this.position = computeAnchoredPopupPosition({\n anchorRect: this.triggerEl.getBoundingClientRect(),\n popupWidth: this.popupEl.offsetWidth,\n popupHeight: this.popupEl.offsetHeight,\n side: 'bottom',\n align: 'start',\n sideOffsetPx: sectionPadding,\n alignOffsetPx: -sectionPadding,\n viewportPadPx: sectionPadding,\n viewportWidth: window.innerWidth,\n viewportHeight: window.innerHeight,\n });\n this.positionReady = true;\n return true;\n }\n\n private openPopup(focusVisible: boolean, edge?: 'first' | 'last') {\n if (this.isDisabled || (!this.allOptions.length && !this.isLoading)) return;\n const enabled = enabledChoiceIndexes(this.visibleOptions);\n const selectedIndex = this.visibleOptions.findIndex(\n option => option.value === this.value && !option.isInactive,\n );\n this.activeIndex =\n edge === 'last'\n ? (enabled[enabled.length - 1] ?? -1)\n : selectedIndex >= 0\n ? selectedIndex\n : (enabled[0] ?? -1);\n this.focusRingVisible = focusVisible;\n this.open = true;\n }\n\n private closePopup(restoreFocus = false) {\n if (!this.open) return;\n this.open = false;\n if (restoreFocus) requestAnimationFrame(() => this.triggerEl?.focus());\n }\n\n private selectOption(option: SelectOption) {\n if (option.isInactive || this.isLoading) return;\n this.value = option.value;\n this.dsChange.emit(this.value);\n this.closePopup(true);\n }\n\n private clearSelection = (event: Event) => {\n event.preventDefault();\n event.stopPropagation();\n this.value = '';\n this.dsChange.emit('');\n this.dsClear.emit();\n const enabled = enabledChoiceIndexes(this.visibleOptions);\n this.activeIndex = enabled[0] ?? -1;\n requestAnimationFrame(() => (this.searchable ? this.searchEl?.focus() : this.triggerEl?.focus()));\n };\n\n private moveActive(direction: 1 | -1) {\n this.activeIndex = moveChoiceIndex(this.visibleOptions, this.activeIndex, direction);\n }\n\n private setActiveEdge(edge: 'first' | 'last') {\n const enabled = enabledChoiceIndexes(this.visibleOptions);\n this.activeIndex =\n edge === 'first' ? (enabled[0] ?? -1) : (enabled[enabled.length - 1] ?? -1);\n }\n\n private handleTypeahead(key: string) {\n if (this.typeaheadTimer) clearTimeout(this.typeaheadTimer);\n this.focusRingVisible = true;\n const normalized = key.toLocaleLowerCase();\n const repeatedCharacter =\n this.typeahead.length > 0 &&\n [...this.typeahead].every(character => character === normalized);\n this.typeahead = repeatedCharacter ? normalized : `${this.typeahead}${normalized}`;\n const match = findChoiceTypeaheadMatch(this.visibleOptions, this.typeahead, this.activeIndex);\n if (match >= 0) this.activeIndex = match;\n const resetMs = resolveCssTimeMs(\n TOKEN_DEFAULTS.animationDurationMedium1,\n TOKEN_DEFAULTS.animationDurationMedium1,\n );\n this.typeaheadTimer = setTimeout(() => {\n this.typeahead = '';\n this.typeaheadTimer = null;\n }, resetMs);\n }\n\n private handleListKeyDown(event: KeyboardEvent) {\n switch (event.key) {\n case 'ArrowDown':\n event.preventDefault();\n this.focusRingVisible = true;\n this.moveActive(1);\n break;\n case 'ArrowUp':\n event.preventDefault();\n this.focusRingVisible = true;\n this.moveActive(-1);\n break;\n case 'Home':\n event.preventDefault();\n this.focusRingVisible = true;\n this.setActiveEdge('first');\n break;\n case 'End':\n event.preventDefault();\n this.focusRingVisible = true;\n this.setActiveEdge('last');\n break;\n case 'Enter':\n case ' ': {\n if (event.key === ' ' && this.searchable && event.target === this.searchEl) break;\n event.preventDefault();\n const option = this.visibleOptions[this.activeIndex];\n if (option) this.selectOption(option);\n break;\n }\n case 'Escape':\n event.preventDefault();\n this.closePopup(true);\n break;\n case 'Tab':\n this.closePopup();\n break;\n default:\n if (!this.searchable && event.key.length === 1 && !event.metaKey && !event.ctrlKey && !event.altKey) {\n this.handleTypeahead(event.key);\n }\n }\n }\n\n private handleTriggerKeyDown = (event: KeyboardEvent) => {\n if (!this.open) {\n if (['ArrowDown', 'ArrowUp', 'Enter', ' '].includes(event.key)) {\n event.preventDefault();\n this.openPopup(true, event.key === 'ArrowUp' ? 'last' : 'first');\n } else if (event.key.length === 1 && !event.metaKey && !event.ctrlKey && !event.altKey) {\n event.preventDefault();\n this.openPopup(true);\n if (this.searchable) {\n this.searchTerm = event.key;\n } else {\n this.handleTypeahead(event.key);\n }\n }\n return;\n }\n this.handleListKeyDown(event);\n };\n\n private renderOption(\n option: SelectOption,\n index: number,\n usesIcons: boolean,\n usesSubtext: boolean,\n ) {\n const selected = option.value === this.value;\n const active = index === this.activeIndex;\n return (\n <ChoiceOptionRow\n id={`${this.generatedId}-option-${index}`}\n option={option}\n selected={selected}\n active={active}\n focusRingVisible={this.focusRingVisible}\n usesSubtext={usesSubtext}\n leading={usesIcons && option.icon ? (\n <span class=\"ds-choice-item__icon ds-interaction-fill__content\" aria-hidden=\"true\">\n <ds-icon name={option.icon} size=\"md\" color=\"inherit\" />\n </span>\n ) : undefined}\n onHover={() => {\n this.focusRingVisible = false;\n this.activeIndex = index;\n }}\n onSelect={() => this.selectOption(option)}\n />\n );\n }\n\n render() {\n const inactive = this.isDisabled;\n const showPlaceholder = !this.hasSelection;\n const label = showPlaceholder ? this.placeholder : this.selectedOption?.label;\n const textVariant = CONTROL_TEXT_VARIANT[this.size];\n const iconSize = ICON_SIZE[this.size];\n const usesOptionIcons = choiceListUsesIcons(this.allOptions);\n const usesOptionSubtext = choiceListUsesSubtext(this.allOptions);\n const showError = this.error && Boolean(this.errorMessage);\n const describedBy = [this.ariaDescribedby, showError ? this.errorId : undefined]\n .filter(Boolean)\n .join(' ') || undefined;\n const popupStyle = {\n position: 'fixed',\n left: '0',\n top: '0',\n transform: `translate(${Math.round(this.position.x)}px, ${Math.round(this.position.y)}px)`,\n zIndex: 'var(--dimension-z-index-floating)',\n visibility: this.positionReady ? 'visible' : 'hidden',\n };\n let flatIndex = 0;\n\n return (\n <Host\n class={{\n 'select-host': true,\n 'ds-control-inactive': inactive,\n 'ds-control--md': this.size === 'md',\n 'ds-control--sm': this.size === 'sm',\n 'ds-control--xs': this.size === 'xs',\n ...controlWidthClass(this.width),\n [`select-host--background-${this.background}`]: !!this.background,\n }}\n >\n <button\n ref={element => {\n this.triggerEl = (element as HTMLButtonElement) ?? null;\n }}\n id={this.inputId ?? this.generatedId}\n type=\"button\"\n class={{\n trigger: true,\n 'ds-focus-ring-inset': true,\n 'ds-interaction-fill': true,\n 'ds-interaction-fill--selected':\n !inactive && this.activeFill && this.hasSelection,\n 'trigger--bordered': this.hasBorder || this.error,\n 'trigger--placeholder': showPlaceholder,\n 'trigger--has-value': this.hasSelection,\n 'wrapper--error': this.error,\n [`ds-control--${this.size}`]: true,\n ...choiceBackgroundClassMap(this.background),\n }}\n disabled={inactive}\n role=\"combobox\"\n aria-haspopup=\"listbox\"\n aria-expanded={String(this.open)}\n aria-controls={this.open ? this.listboxId : undefined}\n aria-activedescendant={this.open && !this.searchable ? this.activeOptionId : undefined}\n aria-label={this.ariaLabel}\n aria-labelledby={this.ariaLabelledby}\n aria-describedby={describedBy}\n aria-invalid={this.error ? 'true' : undefined}\n aria-required={this.required || undefined}\n aria-busy={this.isLoading ? 'true' : undefined}\n onClick={() => (this.open ? this.closePopup() : this.openPopup(false))}\n onKeyDown={this.handleTriggerKeyDown}\n >\n {(this.icon || this.isLoading) && (\n <span class=\"trigger__prefix ds-interaction-fill__content\" aria-hidden=\"true\">\n {this.isLoading ? (\n <ds-loader size={iconSize} color=\"inherit\" />\n ) : (\n <ds-icon name={this.icon} size={iconSize} color=\"inherit\" />\n )}\n </span>\n )}\n <ds-text\n class=\"trigger__label ds-interaction-fill__content\"\n as=\"span\"\n variant={textVariant}\n color=\"inherit\"\n lineTruncation={1}\n >\n {label}\n </ds-text>\n <span class=\"trigger__chevron ds-interaction-fill__content\" aria-hidden=\"true\">\n <ds-icon name=\"ChevronDown\" size={iconSize} color=\"inherit\" />\n </span>\n </button>\n\n {this.open && (\n <div\n ref={element => {\n this.popupEl = (element as HTMLDivElement) ?? null;\n }}\n class=\"select-popup ds-choice-popup\"\n style={popupStyle}\n >\n {this.searchable && (\n <ChoiceSearch\n value={this.searchTerm}\n placeholder={this.searchPlaceholder}\n controls={this.listboxId}\n activeDescendant={this.activeOptionId}\n inputRef={element => {\n this.searchEl = element;\n }}\n clearLabel={this.clearLabel}\n onValueChange={value => {\n this.searchTerm = value;\n }}\n onKeyDown={event => this.handleListKeyDown(event)}\n />\n )}\n <div\n id={this.listboxId}\n class=\"ds-choice-list\"\n role=\"listbox\"\n aria-label={this.ariaLabel ?? this.placeholder}\n aria-busy={this.isLoading ? 'true' : undefined}\n >\n {this.isLoading ? (\n <div\n class=\"ds-choice-loading\"\n role=\"option\"\n aria-selected=\"false\"\n aria-disabled=\"true\"\n aria-label={this.loadingLabel}\n aria-live=\"polite\"\n >\n <ds-loader size=\"md\" color=\"inherit\" />\n </div>\n ) : this.visibleOptions.length === 0 ? (\n <div\n class=\"ds-choice-empty\"\n role=\"option\"\n aria-selected=\"false\"\n aria-disabled=\"true\"\n aria-label={this.noResultsText}\n aria-live=\"polite\"\n >\n <ds-empty-state body={this.noResultsText} />\n </div>\n ) : (\n this.visibleSections.map(section => (\n <div\n class={{\n 'ds-choice-section': true,\n 'ds-choice-section--divided': !!section.divider,\n }}\n role={section.header ? 'group' : undefined}\n aria-label={section.header}\n >\n {section.header && (\n <ds-text\n class=\"ds-choice-section__header ds-control--md\"\n as=\"span\"\n variant=\"text-body-small\"\n emphasis\n color=\"primary\"\n aria-hidden=\"true\"\n >\n {section.header}\n </ds-text>\n )}\n {section.options.map(option => this.renderOption(\n option,\n flatIndex++,\n usesOptionIcons,\n usesOptionSubtext,\n ))}\n </div>\n ))\n )}\n </div>\n {this.allowClear && this.hasSelection && !this.isLoading && (\n <ChoiceFooter clearLabel={this.clearLabel} onClear={this.clearSelection} />\n )}\n </div>\n )}\n\n {showError && (\n <ds-text\n class=\"error-text\"\n as=\"div\"\n variant=\"text-body-small\"\n color=\"negative\"\n textId={this.errorId}\n role=\"alert\"\n >\n {this.errorMessage}\n </ds-text>\n )}\n </Host>\n );\n }\n}\n"],"mappings":"mmBAAA,MAAMA,EAAY,IAAM,g3sBC4CxB,MAAMC,EAAoD,CACxDC,GAAI,KACJC,GAAI,KACJC,GAAI,MAGN,IAAIC,EAAW,EAEf,MAAMC,EAAwB,E,MAQjBC,EAAMC,EAAA,MAAAD,UAAAE,EANnB,WAAAC,CAAAC,G,2LAWUC,KAAAC,QAA0B,GAE1BD,KAAAE,SAA4B,GAEXF,KAAAG,MAAgB,GAEDH,KAAAI,KAAgB,MAI/BJ,KAAAK,SAAoB,MAEpBL,KAAAM,SAAoB,MAErCN,KAAAO,gBAA0B,0BAE1BP,KAAAQ,YAAsB,SAEtBR,KAAAS,KAAmB,KAEnBT,KAAAU,MAAqB,MAErBV,KAAAW,WAAsB,MAEtBX,KAAAY,UAAqB,MAErBZ,KAAAa,WAAsB,KAEtBb,KAAAc,UAAqB,KAIrBd,KAAAe,WAAsB,KAEtBf,KAAAgB,WAAqB,QAErBhB,KAAAiB,WAAsB,MAEtBjB,KAAAkB,kBAA4B,SAE5BlB,KAAAmB,cAAwB,mBAExBnB,KAAAoB,aAAuB,UAIvBpB,KAAAqB,MAAiB,MAMUrB,KAAAsB,UAA2B,KAa7CtB,KAAAuB,aAAc,EACdvB,KAAAwB,WAAa,GACbxB,KAAAyB,aAAe,MACfzB,KAAA0B,SAAW,CAAEC,EAAG,EAAGC,EAAG,GACtB5B,KAAA6B,cAAgB,MAChB7B,KAAA8B,iBAAmB,MAEnB9B,KAAA+B,YAAc,eAAetC,IAC7BO,KAAAgC,UAAY,GAAGhC,KAAK+B,sBACpB/B,KAAAiC,QAAU,GAAGjC,KAAK+B,oBAC3B/B,KAAAkC,UAAsC,KACtClC,KAAAmC,QAAiC,KACjCnC,KAAAoC,SAAoC,KACpCpC,KAAAqC,aAAe,GACfrC,KAAAsC,UAAY,GACZtC,KAAAuC,eAAuD,KACvDvC,KAAAwC,eAAuD,KACvDxC,KAAAyC,kBAAyC,KACzCzC,KAAA0C,iBAAkC,KAyPlC1C,KAAA2C,eAAkBC,IACxBA,EAAMC,iBACND,EAAME,kBACN9C,KAAKG,MAAQ,GACbH,KAAK+C,SAASC,KAAK,IACnBhD,KAAKiD,QAAQD,OACb,MAAME,EAAUC,EAAqBnD,KAAKoD,gBAC1CpD,KAAKuB,YAAc2B,EAAQ,KAAM,EACjCG,uBAAsB,IAAOrD,KAAKiB,WAAajB,KAAKoC,UAAUkB,QAAUtD,KAAKkC,WAAWoB,SAAS,EA6E3FtD,KAAAuD,qBAAwBX,IAC9B,IAAK5C,KAAKI,KAAM,CACd,GAAI,CAAC,YAAa,UAAW,QAAS,KAAKoD,SAASZ,EAAMa,KAAM,CAC9Db,EAAMC,iBACN7C,KAAK0D,UAAU,KAAMd,EAAMa,MAAQ,UAAY,OAAS,Q,MACnD,GAAIb,EAAMa,IAAIE,SAAW,IAAMf,EAAMgB,UAAYhB,EAAMiB,UAAYjB,EAAMkB,OAAQ,CACtFlB,EAAMC,iBACN7C,KAAK0D,UAAU,MACf,GAAI1D,KAAKiB,WAAY,CACnBjB,KAAKwB,WAAaoB,EAAMa,G,KACnB,CACLzD,KAAK+D,gBAAgBnB,EAAMa,I,EAG/B,M,CAEFzD,KAAKgE,kBAAkBpB,EAAM,CAsOhC,CAlkBC,iBAAAqB,GACEjE,KAAKqC,aAAerC,KAAKG,MACzBH,KAAKkE,e,CAGP,gBAAAC,GACE,GAAInE,KAAKI,KAAMJ,KAAKoE,aAAa,K,CAGnC,oBAAAC,GACErE,KAAKsE,sBACLtE,KAAKuE,uBACL,GAAIvE,KAAKuC,eAAgBiC,aAAaxE,KAAKuC,e,CAS7C,aAAA2B,GACE,MAAMO,EAAWzE,KAAK0E,WACtB,MAAMC,EAAgB3E,KAAK4E,aAAe5E,KAAKG,MAAQ,GACvDH,KAAK6E,UAAUC,aAAaL,EAAW,KAAOE,GAC9C,MAAMI,EAAU/E,KAAKM,WAAamE,IAAaE,EAC/C3E,KAAK6E,UAAUG,YAAYD,EAAU,CAAEE,aAAc,MAAS,GAAIF,EAAU/E,KAAKO,gBAAkB,IACnG,GAAIP,KAAKI,KAAM,CACb,MAAM8C,EAAUC,EAAqBnD,KAAKoD,gBAC1C,IAAKF,EAAQM,SAASxD,KAAKuB,aAAcvB,KAAKuB,YAAc2B,EAAQ,KAAM,EAC1EG,uBAAsB,IAAMrD,KAAKkF,kB,EAKrC,eAAAC,GACE,GAAInF,KAAKI,KAAMiD,uBAAsB,IAAMrD,KAAKkF,kB,CAIlD,YAAAd,CAAahE,GACXJ,KAAKoF,aAAapC,KAAK5C,GACvB,GAAIA,EAAM,CACRJ,KAAKqF,qBACLrF,KAAKsF,wBAAuB,KAC1BtF,KAAKuF,6BACL,GAAIvF,KAAKiB,WAAYjB,KAAKoC,UAAUkB,OAAO,G,KAExC,CACLtD,KAAKsE,sBACLtE,KAAKuE,uBACLvE,KAAKwB,WAAa,GAClBxB,KAAK6B,cAAgB,K,EAKzB,kBAAA2D,GACE,MAAMtC,EAAUC,EAAqBnD,KAAKoD,gBAC1CpD,KAAKuB,YAAc2B,EAAQ,KAAM,EACjCG,uBAAsB,KACpBrD,KAAKkF,iBACLlF,KAAKuF,4BAA4B,G,CAKrC,mBAAAE,GACEpC,uBAAsB,IAAMrD,KAAKuF,8B,CAGnC,oBAAAG,CAAqBrF,GACnBL,KAAKyB,aAAepB,EACpBL,KAAKkE,e,CAGP,iBAAAyB,GACE3F,KAAKG,MAAQH,KAAKqC,aAClBrC,KAAK4F,Y,CAGP,wBAAAC,CAAyBC,GACvB9F,KAAKG,aAAe2F,IAAU,SAAWA,EAAQ,E,CAInD,cAAMC,GACJ/F,KAAKkC,WAAWoB,O,CAGlB,cAAYoB,GACV,OAAO1E,KAAKK,UAAYL,KAAKW,YAAcX,KAAKyB,Y,CAGlD,eAAYuE,GACV,OAAOC,EAAsBjG,KAAKC,QAASD,KAAKE,S,CAGlD,cAAYgG,GACV,OAAOC,EAAsBnG,KAAKgG,Y,CAGpC,mBAAYI,GACV,OAAOpG,KAAKiB,WACRoF,EAAqBrG,KAAKgG,YAAahG,KAAKwB,YAC5CxB,KAAKgG,W,CAGX,kBAAY5C,GACV,OAAO+C,EAAsBnG,KAAKoG,gB,CAGpC,kBAAYE,GACV,OAAOtG,KAAKkG,WAAWK,MAAKC,GAAUA,EAAOrG,QAAUH,KAAKG,O,CAG9D,gBAAYyE,GACV,OAAO6B,QAAQzG,KAAKsG,e,CAGtB,kBAAYI,GACV,OAAQ1G,KAAKY,WAAaZ,KAAKuB,aAAe,EAC1C,GAAGvB,KAAK+B,sBAAsB/B,KAAKuB,cACnCoF,S,CAGE,0BAAApB,GACN,IAAKvF,KAAKI,OAASJ,KAAK0G,eAAgB,OACxC1G,KAAK4G,GACFC,cAA2B,IAAI7G,KAAK0G,mBACnCI,eAAe,CAAEC,MAAO,UAAWC,OAAQ,W,CAGzC,kBAAA3B,GACNrF,KAAKuE,uBACLvE,KAAKwC,eAAiBI,IACpB,MAAMqE,EAASrE,EAAMqE,OACrB,GAAIjH,KAAK4G,GAAGM,SAASD,GAAS,OAC9BjH,KAAK4F,YAAY,EAEnB5F,KAAKyC,kBAAoB,IAAMzC,KAAKkF,iBACpCiC,SAASC,iBAAiB,YAAapH,KAAKwC,eAAgB,MAC5D6E,OAAOD,iBAAiB,SAAUpH,KAAKyC,kBAAmB,MAC1D4E,OAAOD,iBAAiB,SAAUpH,KAAKyC,kB,CAGjC,oBAAA8B,GACN,GAAIvE,KAAKwC,eAAgB,CACvB2E,SAASG,oBAAoB,YAAatH,KAAKwC,eAAgB,MAC/DxC,KAAKwC,eAAiB,I,CAExB,GAAIxC,KAAKyC,kBAAmB,CAC1B4E,OAAOC,oBAAoB,SAAUtH,KAAKyC,kBAAmB,MAC7D4E,OAAOC,oBAAoB,SAAUtH,KAAKyC,mBAC1CzC,KAAKyC,kBAAoB,I,EAIrB,mBAAA6B,GACN,GAAItE,KAAK0C,mBAAqB,KAAM,CAClC6E,qBAAqBvH,KAAK0C,kBAC1B1C,KAAK0C,iBAAmB,I,EAKpB,sBAAA4C,CAAuBkC,GAC7B,IAAKxH,KAAKI,KAAM,OAEhBJ,KAAKsE,sBACLtE,KAAK6B,cAAgB,MACrB,IAAI4F,EAAY/H,EAEhB,MAAMgI,EAAU,KACd1H,KAAK0C,iBAAmB,KACxB,IAAK1C,KAAKI,KAAM,OAEhB,GAAIJ,KAAKkF,iBAAkB,CACzBsC,MACA,M,CAGF,GAAIC,EAAY,EAAG,CACjBA,GAAa,EACbzH,KAAK0C,iBAAmBW,sBAAsBqE,E,GAIlD1H,KAAK0C,iBAAmBW,sBAAsBqE,E,CAIxC,cAAAxC,GACN,IACGlF,KAAKI,OACLJ,KAAKkC,YACLlC,KAAKmC,UACLnC,KAAKmC,QAAQwF,cACb3H,KAAK4G,GAAGM,SAASlH,KAAKmC,SACvB,OAAO,MACT,MAAMyF,EAAiBC,EAAmBC,EAAeC,SAAUD,EAAeC,UAClF/H,KAAKmC,QAAQ6F,MAAMC,SAAW,GAAGjI,KAAKkC,UAAUgG,YAAcN,EAAiB,MAC/E5H,KAAK0B,SAAWyG,EAA6B,CAC3CC,WAAYpI,KAAKkC,UAAUmG,wBAC3BC,WAAYtI,KAAKmC,QAAQ+F,YACzBK,YAAavI,KAAKmC,QAAQqG,aAC1BC,KAAM,SACNC,MAAO,QACPC,aAAcf,EACdgB,eAAgBhB,EAChBiB,cAAejB,EACfkB,cAAezB,OAAO0B,WACtBC,eAAgB3B,OAAO4B,cAEzBjJ,KAAK6B,cAAgB,KACrB,OAAO,I,CAGD,SAAA6B,CAAUwF,EAAuBC,GACvC,GAAInJ,KAAK0E,aAAgB1E,KAAKkG,WAAWvC,SAAW3D,KAAKY,UAAY,OACrE,MAAMsC,EAAUC,EAAqBnD,KAAKoD,gBAC1C,MAAMgG,EAAgBpJ,KAAKoD,eAAeiG,WACxC7C,GAAUA,EAAOrG,QAAUH,KAAKG,QAAUqG,EAAO7F,aAEnDX,KAAKuB,YACH4H,IAAS,OACJjG,EAAQA,EAAQS,OAAS,KAAM,EAChCyF,GAAiB,EACfA,EACClG,EAAQ,KAAM,EACvBlD,KAAK8B,iBAAmBoH,EACxBlJ,KAAKI,KAAO,I,CAGN,UAAAwF,CAAW0D,EAAe,OAChC,IAAKtJ,KAAKI,KAAM,OAChBJ,KAAKI,KAAO,MACZ,GAAIkJ,EAAcjG,uBAAsB,IAAMrD,KAAKkC,WAAWoB,S,CAGxD,YAAAiG,CAAa/C,GACnB,GAAIA,EAAO7F,YAAcX,KAAKY,UAAW,OACzCZ,KAAKG,MAAQqG,EAAOrG,MACpBH,KAAK+C,SAASC,KAAKhD,KAAKG,OACxBH,KAAK4F,WAAW,K,CAcV,UAAA4D,CAAWC,GACjBzJ,KAAKuB,YAAcmI,EAAgB1J,KAAKoD,eAAgBpD,KAAKuB,YAAakI,E,CAGpE,aAAAE,CAAcR,GACpB,MAAMjG,EAAUC,EAAqBnD,KAAKoD,gBAC1CpD,KAAKuB,YACH4H,IAAS,QAAWjG,EAAQ,KAAM,EAAOA,EAAQA,EAAQS,OAAS,KAAM,C,CAGpE,eAAAI,CAAgBN,GACtB,GAAIzD,KAAKuC,eAAgBiC,aAAaxE,KAAKuC,gBAC3CvC,KAAK8B,iBAAmB,KACxB,MAAM8H,EAAanG,EAAIoG,oBACvB,MAAMC,EACJ9J,KAAKsC,UAAUqB,OAAS,GACxB,IAAI3D,KAAKsC,WAAWyH,OAAMC,GAAaA,IAAcJ,IACvD5J,KAAKsC,UAAYwH,EAAoBF,EAAa,GAAG5J,KAAKsC,YAAYsH,IACtE,MAAMK,EAAQC,EAAyBlK,KAAKoD,eAAgBpD,KAAKsC,UAAWtC,KAAKuB,aACjF,GAAI0I,GAAS,EAAGjK,KAAKuB,YAAc0I,EACnC,MAAME,EAAUC,EACdtC,EAAeuC,yBACfvC,EAAeuC,0BAEjBrK,KAAKuC,eAAiB+H,YAAW,KAC/BtK,KAAKsC,UAAY,GACjBtC,KAAKuC,eAAiB,IAAI,GACzB4H,E,CAGG,iBAAAnG,CAAkBpB,GACxB,OAAQA,EAAMa,KACZ,IAAK,YACHb,EAAMC,iBACN7C,KAAK8B,iBAAmB,KACxB9B,KAAKwJ,WAAW,GAChB,MACF,IAAK,UACH5G,EAAMC,iBACN7C,KAAK8B,iBAAmB,KACxB9B,KAAKwJ,YAAW,GAChB,MACF,IAAK,OACH5G,EAAMC,iBACN7C,KAAK8B,iBAAmB,KACxB9B,KAAK2J,cAAc,SACnB,MACF,IAAK,MACH/G,EAAMC,iBACN7C,KAAK8B,iBAAmB,KACxB9B,KAAK2J,cAAc,QACnB,MACF,IAAK,QACL,IAAK,IAAK,CACR,GAAI/G,EAAMa,MAAQ,KAAOzD,KAAKiB,YAAc2B,EAAMqE,SAAWjH,KAAKoC,SAAU,MAC5EQ,EAAMC,iBACN,MAAM2D,EAASxG,KAAKoD,eAAepD,KAAKuB,aACxC,GAAIiF,EAAQxG,KAAKuJ,aAAa/C,GAC9B,K,CAEF,IAAK,SACH5D,EAAMC,iBACN7C,KAAK4F,WAAW,MAChB,MACF,IAAK,MACH5F,KAAK4F,aACL,MACF,QACE,IAAK5F,KAAKiB,YAAc2B,EAAMa,IAAIE,SAAW,IAAMf,EAAMgB,UAAYhB,EAAMiB,UAAYjB,EAAMkB,OAAQ,CACnG9D,KAAK+D,gBAAgBnB,EAAMa,I,GAwB3B,YAAA8G,CACN/D,EACAgE,EACAC,EACAC,GAEA,MAAMC,EAAWnE,EAAOrG,QAAUH,KAAKG,MACvC,MAAMyK,EAASJ,IAAUxK,KAAKuB,YAC9B,OACEsJ,EAACC,EAAe,CACdC,GAAI,GAAG/K,KAAK+B,sBAAsByI,IAClChE,OAAQA,EACRmE,SAAUA,EACVC,OAAQA,EACR9I,iBAAkB9B,KAAK8B,iBACvB4I,YAAaA,EACbM,QAASP,GAAajE,EAAOyE,KAC3BJ,EAAA,QAAMK,MAAM,oDAAmD,cAAa,QAC1EL,EAAA,WAASM,KAAM3E,EAAOyE,KAAMxK,KAAK,KAAK2K,MAAM,aAE5CzE,UACJ0E,QAAS,KACLrL,KAAK8B,iBAAmB,MACxB9B,KAAKuB,YAAciJ,CAAK,EAE5Bc,SAAU,IAAMtL,KAAKuJ,aAAa/C,I,CAKxC,MAAA+E,GACE,MAAM9G,EAAWzE,KAAK0E,WACtB,MAAM8G,GAAmBxL,KAAK4E,aAC9B,MAAM6G,EAAQD,EAAkBxL,KAAKQ,YAAcR,KAAKsG,gBAAgBmF,MACxE,MAAMC,EAAcC,EAAqB3L,KAAKS,MAC9C,MAAMmL,EAAWvM,EAAUW,KAAKS,MAChC,MAAMoL,EAAkBC,EAAoB9L,KAAKkG,YACjD,MAAM6F,EAAoBC,EAAsBhM,KAAKkG,YACrD,MAAM+F,EAAYjM,KAAKqB,OAASoF,QAAQzG,KAAKkM,cAC7C,MAAMC,EAAc,CAACnM,KAAKoM,gBAAiBH,EAAYjM,KAAKiC,QAAU0E,WACnE0F,OAAO5F,SACP6F,KAAK,MAAQ3F,UAChB,MAAM4F,EAAa,CACjB7K,SAAU,QACV8K,KAAM,IACNC,IAAK,IACLC,UAAW,aAAaC,KAAKC,MAAM5M,KAAK0B,SAASC,SAASgL,KAAKC,MAAM5M,KAAK0B,SAASE,QACnFiL,OAAQ,oCACRC,WAAY9M,KAAK6B,cAAgB,UAAY,UAE/C,IAAIkL,EAAY,EAEhB,OACElC,EAACmC,EAAI,CAAAvJ,IAAA,2CACHyH,MAAO,CACL,cAAe,KACf,sBAAuBzG,EACvB,iBAAkBzE,KAAKS,OAAS,KAChC,iBAAkBT,KAAKS,OAAS,KAChC,iBAAkBT,KAAKS,OAAS,QAC7BwM,EAAkBjN,KAAKU,OAC1B,CAAC,2BAA2BV,KAAKkN,gBAAiBlN,KAAKkN,aAGzDrC,EAAA,UAAApH,IAAA,2CACE0J,IAAKC,IACHpN,KAAKkC,UAAakL,GAAiC,IAAI,EAEzDrC,GAAI/K,KAAKqN,SAAWrN,KAAK+B,YACzBuL,KAAK,SACLpC,MAAO,CACLqC,QAAS,KACT,sBAAuB,KACvB,sBAAuB,KACvB,iCACG9I,GAAYzE,KAAKa,YAAcb,KAAK4E,aACvC,oBAAqB5E,KAAKc,WAAad,KAAKqB,MAC5C,uBAAwBmK,EACxB,qBAAsBxL,KAAK4E,aAC3B,iBAAkB5E,KAAKqB,MACvB,CAAC,eAAerB,KAAKS,QAAS,QAC3B+M,EAAyBxN,KAAKkN,aAEnC7M,SAAUoE,EACVgJ,KAAK,WAAU,gBACD,UAAS,gBACRC,OAAO1N,KAAKI,MAAK,gBACjBJ,KAAKI,KAAOJ,KAAKgC,UAAY2E,UAAS,wBAC9B3G,KAAKI,OAASJ,KAAKiB,WAAajB,KAAK0G,eAAiBC,UAAS,aAC1E3G,KAAKsB,UAAS,kBACTtB,KAAK2N,eAAc,mBAClBxB,EAAW,eACfnM,KAAKqB,MAAQ,OAASsF,UAAS,gBAC9B3G,KAAKM,UAAYqG,UAAS,YAC9B3G,KAAKY,UAAY,OAAS+F,UACrCiH,QAAS,IAAO5N,KAAKI,KAAOJ,KAAK4F,aAAe5F,KAAK0D,UAAU,OAC/DmK,UAAW7N,KAAKuD,uBAEdvD,KAAKiL,MAAQjL,KAAKY,YAClBiK,EAAA,QAAApH,IAAA,2CAAMyH,MAAM,+CAA8C,cAAa,QACpElL,KAAKY,UACJiK,EAAA,aAAWpK,KAAMmL,EAAUR,MAAM,YAEjCP,EAAA,WAASM,KAAMnL,KAAKiL,KAAMxK,KAAMmL,EAAUR,MAAM,aAItDP,EAAA,WAAApH,IAAA,2CACEyH,MAAM,8CACN4C,GAAG,OACHC,QAASrC,EACTN,MAAM,UACN4C,eAAgB,GAEfvC,GAEHZ,EAAA,QAAApH,IAAA,2CAAMyH,MAAM,gDAA+C,cAAa,QACtEL,EAAA,WAAApH,IAAA,2CAAS0H,KAAK,cAAc1K,KAAMmL,EAAUR,MAAM,cAIrDpL,KAAKI,MACJyK,EAAA,OAAApH,IAAA,2CACE0J,IAAKC,IACHpN,KAAKmC,QAAWiL,GAA8B,IAAI,EAEpDlC,MAAM,+BACNlD,MAAOuE,GAENvM,KAAKiB,YACJ4J,EAACoD,EAAY,CAAAxK,IAAA,2CACXtD,MAAOH,KAAKwB,WACZhB,YAAaR,KAAKkB,kBAClBgN,SAAUlO,KAAKgC,UACfmM,iBAAkBnO,KAAK0G,eACvB0H,SAAUhB,IACRpN,KAAKoC,SAAWgL,CAAO,EAEzBpM,WAAYhB,KAAKgB,WACjBqN,cAAelO,IACbH,KAAKwB,WAAarB,CAAK,EAEzB0N,UAAWjL,GAAS5C,KAAKgE,kBAAkBpB,KAG/CiI,EAAA,OAAApH,IAAA,2CACEsH,GAAI/K,KAAKgC,UACTkJ,MAAM,iBACNuC,KAAK,UAAS,aACFzN,KAAKsB,WAAatB,KAAKQ,YAAW,YACnCR,KAAKY,UAAY,OAAS+F,WAEpC3G,KAAKY,UACJiK,EAAA,OACEK,MAAM,oBACNuC,KAAK,SAAQ,gBACC,QAAO,gBACP,OAAM,aACRzN,KAAKoB,aAAY,YACnB,UAEVyJ,EAAA,aAAWpK,KAAK,KAAK2K,MAAM,aAE3BpL,KAAKoD,eAAeO,SAAW,EACjCkH,EAAA,OACEK,MAAM,kBACNuC,KAAK,SAAQ,gBACC,QAAO,gBACP,OAAM,aACRzN,KAAKmB,cAAa,YACpB,UAEV0J,EAAA,kBAAgByD,KAAMtO,KAAKmB,iBAG7BnB,KAAKoG,gBAAgBmI,KAAIC,GACvB3D,EAAA,OACEK,MAAO,CACL,oBAAqB,KACrB,+BAAgCsD,EAAQC,SAE1ChB,KAAMe,EAAQE,OAAS,QAAU/H,UAAS,aAC9B6H,EAAQE,QAEnBF,EAAQE,QACP7D,EAAA,WACEK,MAAM,2CACN4C,GAAG,OACHC,QAAQ,kBACRY,SAAQ,KACRvD,MAAM,UAAS,cACH,QAEXoD,EAAQE,QAGZF,EAAQvO,QAAQsO,KAAI/H,GAAUxG,KAAKuK,aAClC/D,EACAuG,IACAlB,EACAE,SAMT/L,KAAKe,YAAcf,KAAK4E,eAAiB5E,KAAKY,WAC7CiK,EAAC+D,EAAY,CAAAnL,IAAA,2CAACzC,WAAYhB,KAAKgB,WAAY6N,QAAS7O,KAAK2C,kBAK9DsJ,GACCpB,EAAA,WAAApH,IAAA,2CACEyH,MAAM,aACN4C,GAAG,MACHC,QAAQ,kBACR3C,MAAM,WACN0D,OAAQ9O,KAAKiC,QACbwL,KAAK,SAEJzN,KAAKkM,c","ignoreList":[]}
|
|
@@ -90,6 +90,7 @@ export declare class Select {
|
|
|
90
90
|
private typeaheadTimer;
|
|
91
91
|
private outsideHandler;
|
|
92
92
|
private repositionHandler;
|
|
93
|
+
private positionRetryRaf;
|
|
93
94
|
componentWillLoad(): void;
|
|
94
95
|
componentDidLoad(): void;
|
|
95
96
|
disconnectedCallback(): void;
|
|
@@ -113,6 +114,10 @@ export declare class Select {
|
|
|
113
114
|
private scrollActiveOptionIntoView;
|
|
114
115
|
private bindPopupListeners;
|
|
115
116
|
private unbindPopupListeners;
|
|
117
|
+
private cancelPositionRetry;
|
|
118
|
+
/** Retry until the conditionally rendered popup is mounted and measurable. */
|
|
119
|
+
private schedulePositionUpdate;
|
|
120
|
+
/** @returns `true` when the current popup was found and positioned. */
|
|
116
121
|
private updatePosition;
|
|
117
122
|
private openPopup;
|
|
118
123
|
private closePopup;
|
|
@@ -94,6 +94,7 @@ export declare class SelectMulti {
|
|
|
94
94
|
private typeaheadTimer;
|
|
95
95
|
private outsideHandler;
|
|
96
96
|
private repositionHandler;
|
|
97
|
+
private positionRetryRaf;
|
|
97
98
|
componentWillLoad(): void;
|
|
98
99
|
componentDidLoad(): void;
|
|
99
100
|
disconnectedCallback(): void;
|
|
@@ -117,6 +118,10 @@ export declare class SelectMulti {
|
|
|
117
118
|
private scrollActiveOptionIntoView;
|
|
118
119
|
private bindPopupListeners;
|
|
119
120
|
private unbindPopupListeners;
|
|
121
|
+
private cancelPositionRetry;
|
|
122
|
+
/** Retry until the conditionally rendered popup is mounted and measurable. */
|
|
123
|
+
private schedulePositionUpdate;
|
|
124
|
+
/** @returns `true` when the current popup was found and positioned. */
|
|
120
125
|
private updatePosition;
|
|
121
126
|
private openPopup;
|
|
122
127
|
private closePopup;
|