@ds-mo/ui 11.0.0 → 12.0.0

package/dist/components/ds-select.js

@@ -1,2 +1,2 @@
-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,a as c,r as a}from"./p-l6PmnW_P.js";import{a as d,C as l,b as h}from"./p-CKaJx0IX.js";import{e as g,r as p,f,a as u,m as v,b as m,c as b,d as y,g as x}from"./p-BhC1YyId.js";import{d as w}from"./p-DrDHC7V6.js";import{d as k}from"./p-DTqCBjUj.js";import{d as _}from"./p-C8e2A66f.js";import{d as z}from"./p-DuNZGFkV.js";import{d as C}from"./p-Cpr3K41-.js";import{d as F}from"./p-CZZYGqKz.js";import{r as j}from"./p-BWUTr_XN.js";import{a as A}from"./p-BHtg1fh3.js";import{C as I}from"./p-Cx-ywr1e.js";import{T as V}from"./p-C_0Q8Cnp.js";import{c as q}from"./p-DuFm-ieS.js";const L=()=>`.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--sm.sc-ds-select-h,.ds-control--sm.sc-ds-select,.ds-control--xs.sc-ds-select-h,.ds-control--xs.sc-ds-select{--ds-control-radius:var(--dimension-radius-025)}.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--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--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-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-block: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)}.ds-choice-footer__summary.sc-ds-select,.ds-choice-footer__clear.sc-ds-select ds-text.sc-ds-select{padding-inline:calc(     var(--dimension-space-050) +       var(--ds-control-padding-inline, var(--dimension-space-075)) +       var(--ds-control-label-inset, var(--dimension-space-025))   )}.ds-choice-footer__clear.sc-ds-select{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}.select-search.sc-ds-select{position:relative;box-sizing:border-box;padding:var(--dimension-space-050);background:transparent}.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__control.sc-ds-select>ds-icon.sc-ds-select{flex-shrink:0;color:var(--color-foreground-secondary)}.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}.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)}.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 D={md:"md",sm:"sm",xs:"xs"};let T=0;const O=8;const P=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=g(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=g(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=g(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 p(this.options,this.sections)}get allOptions(){return f(this.allSections)}get visibleSections(){return this.searchable?u(this.allSections,this.searchTerm):this.allSections}get visibleOptions(){return f(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=O;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=j(V.space050,V.space050);this.popupEl.style.minWidth=`${n(this.triggerEl.offsetWidth,e)}px`;this.position=c({anchorRect:this.triggerEl.getBoundingClientRect(),popupWidth:this.popupEl.offsetWidth,popupHeight:this.popupEl.offsetHeight,side:"bottom",align:"start",sideOffsetPx:e,alignOffsetPx:a({align:"start",alignOffsetPx:0,sectionInsetPx: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=g(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=v(this.visibleOptions,this.activeIndex,e)}setActiveEdge(e){const s=g(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=m(this.visibleOptions,this.typeahead,this.activeIndex);if(i>=0)this.activeIndex=i;const r=A(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(d,{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=I[this.size];const n=D[this.size];const c=b(this.allOptions);const a=y(this.allOptions);const d=this.error&&Boolean(this.errorMessage);const g=[this.ariaDescribedby,d?this.errorId:undefined].filter(Boolean).join(" ")||undefined;const p={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 f=0;return i(r,{key:"ef0b0c406c1fb3068df1a4ffaeb0c943efd86bda",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",...q(this.width),[`select-host--background-${this.background}`]:!!this.background}},i("button",{key:"84e084ba71d93c7ee9c2d5790f1de30a4cb990bf",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,...x(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":g,"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:"98f6075bc47741de64f045a75c6c81c240ea77df",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:"6a93223fd55a8d85783bc2b28b480ee266fab0c3",class:"trigger__label ds-interaction-fill__content",as:"span",variant:o,color:"inherit",lineTruncation:1},t),i("span",{key:"deffcd522b80eac0ed0ee3b1a203a81f41418de3",class:"trigger__chevron ds-interaction-fill__content","aria-hidden":"true"},i("ds-icon",{key:"f4cc55ff5fcb90826b35b143bf5cdeec3c2f0c8e",name:"ChevronDown",size:n,color:"inherit"}))),this.open&&i("div",{key:"670ffc74088763676b969c5c51c54ea47333d998",ref:e=>{this.popupEl=e??null},class:"select-popup ds-choice-popup",style:p},this.searchable&&i(l,{key:"e1dbb64d7b6766cbce8b3a1dcd5aed4d394ec7de",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:"660eb1da86cc4d186e91895e964377b03c44b295",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,f++,c,a))))))),this.allowClear&&this.hasSelection&&!this.isLoading&&i(h,{key:"d8d2c75a06ee0980edb546d1c4cf56e898d8706b",clearLabel:this.clearLabel,onClear:this.clearSelection})),d&&i("ds-text",{key:"9e69733b1195abf0f0965b2481f7655507209648",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 L()}},[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 $(){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),P)}break;case"ds-badge":if(!customElements.get(o(e))){w()}break;case"ds-button-unfilled":if(!customElements.get(o(e))){k()}break;case"ds-empty-state":if(!customElements.get(o(e))){_()}break;case"ds-icon":if(!customElements.get(o(e))){z()}break;case"ds-loader":if(!customElements.get(o(e))){C()}break;case"ds-text":if(!customElements.get(o(e))){F()}break}}))}$();const E=P;const S=$;export{E as DsSelect,S as defineCustomElement};
+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,a as c,r as a}from"./p-l6PmnW_P.js";import{a as d,C as l,b as h}from"./p-CUik7PCi.js";import{e as g,r as f,f as p,a as u,m as v,b as m,c as b,d as y,g as x}from"./p-BhC1YyId.js";import{d as w}from"./p-DxeHimqk.js";import{d as k}from"./p-DUHcJWTQ.js";import{d as _}from"./p-Cf2J9MEo.js";import{d as z}from"./p-DuNZGFkV.js";import{d as C}from"./p-Cpr3K41-.js";import{d as F}from"./p-Bs6SS34m.js";import{d as A}from"./p-DfIch2Dk.js";import{r as j}from"./p-BWUTr_XN.js";import{r as D,T as I}from"./p-Dg3xLna0.js";import{C as L}from"./p-Cx-ywr1e.js";import{c as V}from"./p-DuFm-ieS.js";const q=()=>`.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--sm.sc-ds-select-h,.ds-control--sm.sc-ds-select,.ds-control--xs.sc-ds-select-h,.ds-control--xs.sc-ds-select{--ds-control-radius:var(--dimension-radius-025)}.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--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--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-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;inset:auto;margin:0;background-color:var(--color-background-primary);border-radius:var(--dimension-radius-075);box-shadow:var(--effect-shadow-elevated-floating);animation:dsChoiceFadeIn var(--effect-motion-short-2) forwards;backface-visibility:hidden;will-change:transform;text-align:start}.ds-choice-popup.sc-ds-select::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-block: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)}.ds-choice-footer__summary.sc-ds-select,.ds-choice-footer__clear.sc-ds-select ds-text.sc-ds-select{padding-inline:calc(     var(--dimension-space-050) +       var(--ds-control-padding-inline, var(--dimension-space-075)) +       var(--ds-control-label-inset, var(--dimension-space-025))   )}.ds-choice-footer__clear.sc-ds-select{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}.select-search.sc-ds-select{position:relative;box-sizing:border-box;padding:var(--dimension-space-050);background:transparent}.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__control.sc-ds-select>ds-icon.sc-ds-select{flex-shrink:0;color:var(--color-foreground-secondary)}.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}.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)}.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 P={md:"md",sm:"sm",xs:"xs"};let T=0;const E=8;const O=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=g(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=g(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=g(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 f(this.options,this.sections)}get allOptions(){return p(this.allSections)}get visibleSections(){return this.searchable?u(this.allSections,this.searchTerm):this.allSections}get visibleOptions(){return p(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=E;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=j(I.space050,I.space050);this.popupEl.style.minWidth=`${n(this.triggerEl.offsetWidth,e)}px`;this.position=c({anchorRect:this.triggerEl.getBoundingClientRect(),popupWidth:this.popupEl.offsetWidth,popupHeight:this.popupEl.offsetHeight,side:"bottom",align:"start",sideOffsetPx:e,alignOffsetPx:a({align:"start",alignOffsetPx:0,sectionInsetPx: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=g(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=v(this.visibleOptions,this.activeIndex,e)}setActiveEdge(e){const s=g(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=m(this.visibleOptions,this.typeahead,this.activeIndex);if(i>=0)this.activeIndex=i;const r=D(I.animationDurationMedium1,I.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(d,{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=L[this.size];const n=P[this.size];const c=b(this.allOptions);const a=y(this.allOptions);const d=this.error&&Boolean(this.errorMessage);const g=[this.ariaDescribedby,d?this.errorId:undefined].filter(Boolean).join(" ")||undefined;const f={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 p=0;return i(r,{key:"4c4b5f6e8f336d944b00f92594d9f477ac5ab621",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",...V(this.width),[`select-host--background-${this.background}`]:!!this.background}},i("button",{key:"cfa55eb53b6118c8f3bb3cfdff818a0efd57fe32",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,...x(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":g,"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:"6b50ff6ca65a511876c7e9705c370bdad37fbff2",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:"47a0081f9f82dcfdff88f80dc2bcb023aa575ed0",class:"trigger__label ds-interaction-fill__content",as:"span",variant:o,color:"inherit",lineTruncation:1},t),i("span",{key:"7e644d20f27fc1bad69bc067b17da87f6d9001c9",class:"trigger__chevron ds-interaction-fill__content","aria-hidden":"true"},i("ds-icon",{key:"c768862287703889bdbc2814c26187a38be2af29",name:"ChevronDown",size:n,color:"inherit"}))),this.open&&i("div",{key:"841547679835097f16f6ab1f21d186b8aab5da8b",ref:e=>{this.popupEl=e??null},class:"select-popup ds-choice-popup",style:f},this.searchable&&i(l,{key:"b30979d6ef072b98915188db4495a349fdfedb32",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:"3ddef7be42bb3fd0f8659fdf1cce8e8d5610b023",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,p++,c,a))))))),this.allowClear&&this.hasSelection&&!this.isLoading&&i(h,{key:"9c73f4c1243b87b8192780ec16d96b11919f62ad",clearLabel:this.clearLabel,onClear:this.clearSelection})),d&&i("ds-text",{key:"a62b7af012266e997af1592e336bcc3e3a9a949d",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 q()}},[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 S(){if(typeof customElements==="undefined"){return}const e=["ds-select","ds-badge","ds-button-unfilled","ds-empty-state","ds-icon","ds-loader","ds-text","ds-tooltip"];e.forEach((e=>{switch(e){case"ds-select":if(!customElements.get(o(e))){customElements.define(o(e),O)}break;case"ds-badge":if(!customElements.get(o(e))){w()}break;case"ds-button-unfilled":if(!customElements.get(o(e))){k()}break;case"ds-empty-state":if(!customElements.get(o(e))){_()}break;case"ds-icon":if(!customElements.get(o(e))){z()}break;case"ds-loader":if(!customElements.get(o(e))){C()}break;case"ds-text":if(!customElements.get(o(e))){F()}break;case"ds-tooltip":if(!customElements.get(o(e))){A()}break}}))}S();const $=O;const R=S;export{$ as DsSelect,R as defineCustomElement};
 //# sourceMappingURL=ds-select.js.map

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

@@ -1 +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","choicePopupMinWidth","offsetWidth","computeAnchoredPopupPosition","anchorRect","getBoundingClientRect","popupWidth","popupHeight","offsetHeight","side","align","sideOffsetPx","alignOffsetPx","resolveChoicePopupAlignOffset","sectionInsetPx","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/search-control.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.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  choicePopupMinWidth,\n  resolveCssLengthPx,\n  resolveCssTimeMs,\n  resolveChoicePopupAlignOffset,\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 = `${choicePopupMinWidth(this.triggerEl.offsetWidth, sectionPadding)}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: resolveChoicePopupAlignOffset({\n        align: 'start',\n        alignOffsetPx: 0,\n        sectionInsetPx: sectionPadding,\n      }),\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":"yoBAAA,MAAMA,EAAY,IAAM,qotBC8CxB,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,KA6PlC1C,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,CAtkBC,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,GAAGC,EAAoBlI,KAAKkC,UAAUiG,YAAaP,OACjF5H,KAAK0B,SAAW0G,EAA6B,CAC3CC,WAAYrI,KAAKkC,UAAUoG,wBAC3BC,WAAYvI,KAAKmC,QAAQgG,YACzBK,YAAaxI,KAAKmC,QAAQsG,aAC1BC,KAAM,SACNC,MAAO,QACPC,aAAchB,EACdiB,cAAeC,EAA8B,CAC3CH,MAAO,QACPE,cAAe,EACfE,eAAgBnB,IAElBoB,cAAepB,EACfqB,cAAe5B,OAAO6B,WACtBC,eAAgB9B,OAAO+B,cAEzBpJ,KAAK6B,cAAgB,KACrB,OAAO,I,CAGD,SAAA6B,CAAU2F,EAAuBC,GACvC,GAAItJ,KAAK0E,aAAgB1E,KAAKkG,WAAWvC,SAAW3D,KAAKY,UAAY,OACrE,MAAMsC,EAAUC,EAAqBnD,KAAKoD,gBAC1C,MAAMmG,EAAgBvJ,KAAKoD,eAAeoG,WACxChD,GAAUA,EAAOrG,QAAUH,KAAKG,QAAUqG,EAAO7F,aAEnDX,KAAKuB,YACH+H,IAAS,OACJpG,EAAQA,EAAQS,OAAS,KAAM,EAChC4F,GAAiB,EACfA,EACCrG,EAAQ,KAAM,EACvBlD,KAAK8B,iBAAmBuH,EACxBrJ,KAAKI,KAAO,I,CAGN,UAAAwF,CAAW6D,EAAe,OAChC,IAAKzJ,KAAKI,KAAM,OAChBJ,KAAKI,KAAO,MACZ,GAAIqJ,EAAcpG,uBAAsB,IAAMrD,KAAKkC,WAAWoB,S,CAGxD,YAAAoG,CAAalD,GACnB,GAAIA,EAAO7F,YAAcX,KAAKY,UAAW,OACzCZ,KAAKG,MAAQqG,EAAOrG,MACpBH,KAAK+C,SAASC,KAAKhD,KAAKG,OACxBH,KAAK4F,WAAW,K,CAcV,UAAA+D,CAAWC,GACjB5J,KAAKuB,YAAcsI,EAAgB7J,KAAKoD,eAAgBpD,KAAKuB,YAAaqI,E,CAGpE,aAAAE,CAAcR,GACpB,MAAMpG,EAAUC,EAAqBnD,KAAKoD,gBAC1CpD,KAAKuB,YACH+H,IAAS,QAAWpG,EAAQ,KAAM,EAAOA,EAAQA,EAAQS,OAAS,KAAM,C,CAGpE,eAAAI,CAAgBN,GACtB,GAAIzD,KAAKuC,eAAgBiC,aAAaxE,KAAKuC,gBAC3CvC,KAAK8B,iBAAmB,KACxB,MAAMiI,EAAatG,EAAIuG,oBACvB,MAAMC,EACJjK,KAAKsC,UAAUqB,OAAS,GACxB,IAAI3D,KAAKsC,WAAW4H,OAAMC,GAAaA,IAAcJ,IACvD/J,KAAKsC,UAAY2H,EAAoBF,EAAa,GAAG/J,KAAKsC,YAAYyH,IACtE,MAAMK,EAAQC,EAAyBrK,KAAKoD,eAAgBpD,KAAKsC,UAAWtC,KAAKuB,aACjF,GAAI6I,GAAS,EAAGpK,KAAKuB,YAAc6I,EACnC,MAAME,EAAUC,EACdzC,EAAe0C,yBACf1C,EAAe0C,0BAEjBxK,KAAKuC,eAAiBkI,YAAW,KAC/BzK,KAAKsC,UAAY,GACjBtC,KAAKuC,eAAiB,IAAI,GACzB+H,E,CAGG,iBAAAtG,CAAkBpB,GACxB,OAAQA,EAAMa,KACZ,IAAK,YACHb,EAAMC,iBACN7C,KAAK8B,iBAAmB,KACxB9B,KAAK2J,WAAW,GAChB,MACF,IAAK,UACH/G,EAAMC,iBACN7C,KAAK8B,iBAAmB,KACxB9B,KAAK2J,YAAW,GAChB,MACF,IAAK,OACH/G,EAAMC,iBACN7C,KAAK8B,iBAAmB,KACxB9B,KAAK8J,cAAc,SACnB,MACF,IAAK,MACHlH,EAAMC,iBACN7C,KAAK8B,iBAAmB,KACxB9B,KAAK8J,cAAc,QACnB,MACF,IAAK,QACL,IAAK,IAAK,CACR,GAAIlH,EAAMa,MAAQ,KAAOzD,KAAKiB,YAAc2B,EAAMqE,SAAWjH,KAAKoC,SAAU,MAC5EQ,EAAMC,iBACN,MAAM2D,EAASxG,KAAKoD,eAAepD,KAAKuB,aACxC,GAAIiF,EAAQxG,KAAK0J,aAAalD,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,YAAAiH,CACNlE,EACAmE,EACAC,EACAC,GAEA,MAAMC,EAAWtE,EAAOrG,QAAUH,KAAKG,MACvC,MAAM4K,EAASJ,IAAU3K,KAAKuB,YAC9B,OACEyJ,EAACC,EAAe,CACdC,GAAI,GAAGlL,KAAK+B,sBAAsB4I,IAClCnE,OAAQA,EACRsE,SAAUA,EACVC,OAAQA,EACRjJ,iBAAkB9B,KAAK8B,iBACvB+I,YAAaA,EACbM,QAASP,GAAapE,EAAO4E,KAC3BJ,EAAA,QAAMK,MAAM,oDAAmD,cAAa,QAC1EL,EAAA,WAASM,KAAM9E,EAAO4E,KAAM3K,KAAK,KAAK8K,MAAM,aAE5C5E,UACJ6E,QAAS,KACLxL,KAAK8B,iBAAmB,MACxB9B,KAAKuB,YAAcoJ,CAAK,EAE5Bc,SAAU,IAAMzL,KAAK0J,aAAalD,I,CAKxC,MAAAkF,GACE,MAAMjH,EAAWzE,KAAK0E,WACtB,MAAMiH,GAAmB3L,KAAK4E,aAC9B,MAAMgH,EAAQD,EAAkB3L,KAAKQ,YAAcR,KAAKsG,gBAAgBsF,MACxE,MAAMC,EAAcC,EAAqB9L,KAAKS,MAC9C,MAAMsL,EAAW1M,EAAUW,KAAKS,MAChC,MAAMuL,EAAkBC,EAAoBjM,KAAKkG,YACjD,MAAMgG,EAAoBC,EAAsBnM,KAAKkG,YACrD,MAAMkG,EAAYpM,KAAKqB,OAASoF,QAAQzG,KAAKqM,cAC7C,MAAMC,EAAc,CAACtM,KAAKuM,gBAAiBH,EAAYpM,KAAKiC,QAAU0E,WACnE6F,OAAO/F,SACPgG,KAAK,MAAQ9F,UAChB,MAAM+F,EAAa,CACjBhL,SAAU,QACViL,KAAM,IACNC,IAAK,IACLC,UAAW,aAAaC,KAAKC,MAAM/M,KAAK0B,SAASC,SAASmL,KAAKC,MAAM/M,KAAK0B,SAASE,QACnFoL,OAAQ,oCACRC,WAAYjN,KAAK6B,cAAgB,UAAY,UAE/C,IAAIqL,EAAY,EAEhB,OACElC,EAACmC,EAAI,CAAA1J,IAAA,2CACH4H,MAAO,CACL,cAAe,KACf,sBAAuB5G,EACvB,iBAAkBzE,KAAKS,OAAS,KAChC,iBAAkBT,KAAKS,OAAS,KAChC,iBAAkBT,KAAKS,OAAS,QAC7B2M,EAAkBpN,KAAKU,OAC1B,CAAC,2BAA2BV,KAAKqN,gBAAiBrN,KAAKqN,aAGzDrC,EAAA,UAAAvH,IAAA,2CACE6J,IAAKC,IACHvN,KAAKkC,UAAaqL,GAAiC,IAAI,EAEzDrC,GAAIlL,KAAKwN,SAAWxN,KAAK+B,YACzB0L,KAAK,SACLpC,MAAO,CACLqC,QAAS,KACT,sBAAuB,KACvB,sBAAuB,KACvB,iCACGjJ,GAAYzE,KAAKa,YAAcb,KAAK4E,aACvC,oBAAqB5E,KAAKc,WAAad,KAAKqB,MAC5C,uBAAwBsK,EACxB,qBAAsB3L,KAAK4E,aAC3B,iBAAkB5E,KAAKqB,MACvB,CAAC,eAAerB,KAAKS,QAAS,QAC3BkN,EAAyB3N,KAAKqN,aAEnChN,SAAUoE,EACVmJ,KAAK,WAAU,gBACD,UAAS,gBACRC,OAAO7N,KAAKI,MAAK,gBACjBJ,KAAKI,KAAOJ,KAAKgC,UAAY2E,UAAS,wBAC9B3G,KAAKI,OAASJ,KAAKiB,WAAajB,KAAK0G,eAAiBC,UAAS,aAC1E3G,KAAKsB,UAAS,kBACTtB,KAAK8N,eAAc,mBAClBxB,EAAW,eACftM,KAAKqB,MAAQ,OAASsF,UAAS,gBAC9B3G,KAAKM,UAAYqG,UAAS,YAC9B3G,KAAKY,UAAY,OAAS+F,UACrCoH,QAAS,IAAO/N,KAAKI,KAAOJ,KAAK4F,aAAe5F,KAAK0D,UAAU,OAC/DsK,UAAWhO,KAAKuD,uBAEdvD,KAAKoL,MAAQpL,KAAKY,YAClBoK,EAAA,QAAAvH,IAAA,2CAAM4H,MAAM,+CAA8C,cAAa,QACpErL,KAAKY,UACJoK,EAAA,aAAWvK,KAAMsL,EAAUR,MAAM,YAEjCP,EAAA,WAASM,KAAMtL,KAAKoL,KAAM3K,KAAMsL,EAAUR,MAAM,aAItDP,EAAA,WAAAvH,IAAA,2CACE4H,MAAM,8CACN4C,GAAG,OACHC,QAASrC,EACTN,MAAM,UACN4C,eAAgB,GAEfvC,GAEHZ,EAAA,QAAAvH,IAAA,2CAAM4H,MAAM,gDAA+C,cAAa,QACtEL,EAAA,WAAAvH,IAAA,2CAAS6H,KAAK,cAAc7K,KAAMsL,EAAUR,MAAM,cAIrDvL,KAAKI,MACJ4K,EAAA,OAAAvH,IAAA,2CACE6J,IAAKC,IACHvN,KAAKmC,QAAWoL,GAA8B,IAAI,EAEpDlC,MAAM,+BACNrD,MAAO0E,GAEN1M,KAAKiB,YACJ+J,EAACoD,EAAY,CAAA3K,IAAA,2CACXtD,MAAOH,KAAKwB,WACZhB,YAAaR,KAAKkB,kBAClBmN,SAAUrO,KAAKgC,UACfsM,iBAAkBtO,KAAK0G,eACvB6H,SAAUhB,IACRvN,KAAKoC,SAAWmL,CAAO,EAEzBvM,WAAYhB,KAAKgB,WACjBwN,cAAerO,IACbH,KAAKwB,WAAarB,CAAK,EAEzB6N,UAAWpL,GAAS5C,KAAKgE,kBAAkBpB,KAG/CoI,EAAA,OAAAvH,IAAA,2CACEyH,GAAIlL,KAAKgC,UACTqJ,MAAM,iBACNuC,KAAK,UAAS,aACF5N,KAAKsB,WAAatB,KAAKQ,YAAW,YACnCR,KAAKY,UAAY,OAAS+F,WAEpC3G,KAAKY,UACJoK,EAAA,OACEK,MAAM,oBACNuC,KAAK,SAAQ,gBACC,QAAO,gBACP,OAAM,aACR5N,KAAKoB,aAAY,YACnB,UAEV4J,EAAA,aAAWvK,KAAK,KAAK8K,MAAM,aAE3BvL,KAAKoD,eAAeO,SAAW,EACjCqH,EAAA,OACEK,MAAM,kBACNuC,KAAK,SAAQ,gBACC,QAAO,gBACP,OAAM,aACR5N,KAAKmB,cAAa,YACpB,UAEV6J,EAAA,kBAAgByD,KAAMzO,KAAKmB,iBAG7BnB,KAAKoG,gBAAgBsI,KAAIC,GACvB3D,EAAA,OACEK,MAAO,CACL,oBAAqB,KACrB,+BAAgCsD,EAAQC,SAE1ChB,KAAMe,EAAQE,OAAS,QAAUlI,UAAS,aAC9BgI,EAAQE,QAEnBF,EAAQE,QACP7D,EAAA,WACEK,MAAM,2CACN4C,GAAG,OACHC,QAAQ,kBACRY,SAAQ,KACRvD,MAAM,UAAS,cACH,QAEXoD,EAAQE,QAGZF,EAAQ1O,QAAQyO,KAAIlI,GAAUxG,KAAK0K,aAClClE,EACA0G,IACAlB,EACAE,SAMTlM,KAAKe,YAAcf,KAAK4E,eAAiB5E,KAAKY,WAC7CoK,EAAC+D,EAAY,CAAAtL,IAAA,2CAACzC,WAAYhB,KAAKgB,WAAYgO,QAAShP,KAAK2C,kBAK9DyJ,GACCpB,EAAA,WAAAvH,IAAA,2CACE4H,MAAM,aACN4C,GAAG,MACHC,QAAQ,kBACR3C,MAAM,WACN0D,OAAQjP,KAAKiC,QACb2L,KAAK,SAEJ5N,KAAKqM,c","ignoreList":[]}
+{"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","choicePopupMinWidth","offsetWidth","computeAnchoredPopupPosition","anchorRect","getBoundingClientRect","popupWidth","popupHeight","offsetHeight","side","align","sideOffsetPx","alignOffsetPx","resolveChoicePopupAlignOffset","sectionInsetPx","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/search-control.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.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  choicePopupMinWidth,\n  resolveCssLengthPx,\n  resolveCssTimeMs,\n  resolveChoicePopupAlignOffset,\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 = `${choicePopupMinWidth(this.triggerEl.offsetWidth, sectionPadding)}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: resolveChoicePopupAlignOffset({\n        align: 'start',\n        alignOffsetPx: 0,\n        sectionInsetPx: sectionPadding,\n      }),\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":"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","ignoreList":[]}

package/dist/components/ds-shell-app.d.ts

@@ -0,0 +1,11 @@
+import type { Components, JSX } from "../types/components";
+
+interface DsShellApp extends Components.DsShellApp, HTMLElement {}
+export const DsShellApp: {
+    prototype: DsShellApp;
+    new (): DsShellApp;
+};
+/**
+ * Used to define this component and all nested components recursively.
+ */
+export const defineCustomElement: () => void;

package/dist/components/ds-shell-app.js

@@ -0,0 +1,2 @@
+import{p as e,H as s,h as t,a as n,t as i}from"./index.js";import{D as l,b as a,n as o,a as r}from"./p-D1HFMTdC.js";import{e as h,c,r as d,a as p,b as f}from"./p-D2x17ei-.js";const u="--ds-shell-gradient-image";const b="--ds-shell-gradient-size";const g="--ds-shell-gradient-position-panel";const v="--ds-shell-gradient-position-bar";const m="--ds-shell-gradient-opacity";function y(e=l){return a(e)}function _(e){const s=typeof globalThis.window!=="undefined"?globalThis.window:undefined;if(!s)return{width:0,height:0};const t=s.visualViewport;return{width:Math.round(t?.width??s.innerWidth),height:Math.round(t?.height??s.innerHeight)}}function w(e){return`${Math.round(e.width)}px ${Math.round(e.height)}px`}function x(){return"0 0"}function k(e){return`${-Math.round(e)}px 0`}const P={k:"search",a:"agents",s:"stacks",m:"messages",n:"activity","/":"help"};function z(e){return!e.metaKey&&!e.ctrlKey&&!e.altKey&&!e.shiftKey}function C(e){if(!e||typeof e!=="object")return false;if(!("closest"in e)||typeof e.closest!=="function")return false;const s=e;const t=s.closest('input, textarea, select, [contenteditable=""], [contenteditable="true"], [contenteditable="plaintext-only"]');if(t)return true;const n=s.getAttribute("role");if(n==="textbox"||n==="combobox"||n==="searchbox")return true;return Boolean(s.isContentEditable)}function S(e){if(e.key==="["||e.code==="BracketLeft")return"[";if(e.key==="]"||e.code==="BracketRight")return"]";return e.key.length===1?e.key.toLowerCase():e.key.toLowerCase()}function D(e){if(!z(e))return null;const s=S(e);if(s==="[")return"toggle-panel-nav";if(s==="]")return"close-panel-tools";const t=P[s];if(t)return`open-tool:${t}`;return null}function M(e,s){if(typeof document==="undefined")return 0;const t=document.createElement("div");t.style.cssText="position:absolute;visibility:hidden;pointer-events:none;height:0;width:var("+s+");";e.appendChild(t);const n=t.getBoundingClientRect().width;e.removeChild(t);return n}function L(e){return{expandedPx:M(e,"--_nav-width"),collapsedPx:M(e,"--_nav-width-collapsed")}}function T(e,s){if(s?.classList.contains("panel-nav--collapsed"))return true;const t=e?.collapsed;return t===true}function V(e,s){return s?e.collapsedPx:e.expandedPx}const j=()=>`.sc-ds-shell-app-h{display:block;height:100%;min-height:0;box-sizing:border-box;overflow:hidden;overscroll-behavior:none;--ds-shell-panel-tools-width:var(--dimension-panel-width-xs)}.shell-app.sc-ds-shell-app{display:flex;flex-direction:column;height:100%;min-height:0;box-sizing:border-box;overflow:hidden;overscroll-behavior:none;font-family:var(--typography-font-family, system-ui)}.sc-ds-shell-app-h{--_shell-chrome-bg:var(--color-background-secondary)}.shell-app__row.sc-ds-shell-app{display:flex;flex:1 1 auto;min-height:0;height:100%;position:relative}.shell-app__chrome.sc-ds-shell-app{position:absolute;inset:0;pointer-events:none;z-index:0;background-color:var(--_shell-chrome-bg)}.shell-app--gradient.sc-ds-shell-app-h .shell-app__chrome.sc-ds-shell-app::before{content:'';position:absolute;inset:0;pointer-events:none;background-position:0 0;background-attachment:fixed;z-index:1;opacity:var(--ds-shell-gradient-opacity, 1);background-image:var(--ds-shell-gradient-image, none);background-size:var(--ds-shell-gradient-size, auto);background-repeat:no-repeat}.shell-app__panel.sc-ds-shell-app{flex:0 0 auto;min-height:0;height:100%;position:relative;z-index:2}.shell-app__panel.sc-ds-shell-app-s>ds-panel-nav,.shell-app__panel .sc-ds-shell-app-s>ds-panel-nav{display:block;height:100%}.shell-app__main.sc-ds-shell-app{flex:1 1 auto;min-width:0;min-height:0;display:grid;grid-template-columns:minmax(0, 1fr) auto;grid-template-rows:auto minmax(0, 1fr);grid-template-areas:'bar tools'     'content tools';position:relative;z-index:1}.shell-app__bar.sc-ds-shell-app{grid-area:bar;flex:0 0 auto;min-width:0}.shell-app__bar.sc-ds-shell-app-s>ds-bar-nav,.shell-app__bar .sc-ds-shell-app-s>ds-bar-nav{display:block}.shell-app__content.sc-ds-shell-app{grid-area:content;flex:1 1 auto;min-width:0;min-height:0;overflow:auto;overscroll-behavior:none;contain:layout}.shell-app__content.sc-ds-shell-app{position:relative;z-index:1;background-color:var(--color-background-primary)}.shell-app__tools.sc-ds-shell-app{grid-area:tools;flex:0 0 auto;min-width:0;min-height:0;height:100%;display:flex;position:relative;z-index:0;overflow:hidden}.shell-app__tools.sc-ds-shell-app-s>ds-panel-tools,.shell-app__tools .sc-ds-shell-app-s>ds-panel-tools{display:block;height:100%;min-height:0}.shell-app--tools-fullscreen.sc-ds-shell-app-h .shell-app__panel.sc-ds-shell-app,.shell-app--tools-fullscreen.sc-ds-shell-app-h .shell-app__bar.sc-ds-shell-app,.shell-app--tools-fullscreen.sc-ds-shell-app-h .shell-app__content.sc-ds-shell-app{visibility:hidden}`;const $=e(class e extends s{constructor(e){super();if(e!==false){this.__registerHost()}this.navStyle="dashboard";this.gradientPreset=l;this.shortcutsEnabled=true;this.toolsFullscreen=false;this.resizeObserver=null;this.panelNavTransition=new h;this.chromeSyncCoalescer=c((()=>this.syncChrome()));this.panelWidthTokens={expandedPx:0,collapsedPx:0};this.cachedViewportWidth=0;this.cachedViewportHeight=0;this.onWindowResize=()=>{if(this.panelNavTransition.isActive)return;this.scheduleChromeSync()};this.onVisualViewportChange=()=>{if(this.panelNavTransition.isActive)return;this.scheduleChromeSync()};this.onChromeTransitionStart=e=>{if(d(e)!=="panel-nav")return;this.panelNavTransition.enter();const s=_();this.cachedViewportWidth=s.width;this.cachedViewportHeight=s.height;this.syncChrome()};this.onChromeTransitionEnd=e=>{if(d(e)!=="panel-nav")return;this.panelNavTransition.exit();if(!this.panelNavTransition.isActive){this.scheduleChromeSync()}}}componentDidLoad(){this.syncSlottedNavStyle();this.connectMetricsObserver();this.connectViewportListeners();this.el.addEventListener(p,this.onChromeTransitionStart);this.el.addEventListener(f,this.onChromeTransitionEnd);requestAnimationFrame((()=>{this.cachePanelWidthTokens();this.scheduleChromeSync()}));const e=this.el.querySelector("ds-panel-tools");this.toolsFullscreen=e?.getAttribute("presentation")==="fullscreen"}handleToolsPresentation(e){this.toolsFullscreen=e.detail?.presentation==="fullscreen"}disconnectedCallback(){this.resizeObserver?.disconnect();this.resizeObserver=null;this.disconnectViewportListeners();this.chromeSyncCoalescer.cancel();this.el.removeEventListener(p,this.onChromeTransitionStart);this.el.removeEventListener(f,this.onChromeTransitionEnd)}onShellPropsChange(){this.syncSlottedNavStyle();this.scheduleChromeSync()}scheduleChromeSync(){this.chromeSyncCoalescer.schedule()}syncSlottedNavStyle(){const e=this.el.querySelector("ds-panel-nav");const s=this.el.querySelector("ds-bar-nav");if(e){e.setAttribute("nav-style",this.navStyle);e.navStyle=this.navStyle}if(s){s.setAttribute("nav-style",this.navStyle);s.navStyle=this.navStyle}}connectMetricsObserver(){this.resizeObserver=new ResizeObserver((()=>{if(this.panelNavTransition.isActive)return;this.scheduleChromeSync()}));this.resizeObserver.observe(this.el);const e=this.el.querySelector(".shell-app__panel");if(e)this.resizeObserver.observe(e)}connectViewportListeners(){if(typeof window==="undefined")return;window.addEventListener("resize",this.onWindowResize,{passive:true});const e=window.visualViewport;if(e){e.addEventListener("resize",this.onVisualViewportChange,{passive:true});e.addEventListener("scroll",this.onVisualViewportChange,{passive:true})}}disconnectViewportListeners(){if(typeof window==="undefined")return;window.removeEventListener("resize",this.onWindowResize);const e=window.visualViewport;if(e){e.removeEventListener("resize",this.onVisualViewportChange);e.removeEventListener("scroll",this.onVisualViewportChange)}}cachePanelWidthTokens(){const e=this.el.querySelector("ds-panel-nav .panel-nav");if(!e)return;this.panelWidthTokens=L(e)}applyGradientVars(e,s){const t=e.style;for(const[e,n]of Object.entries(s)){if(n===null)t.removeProperty(e);else t.setProperty(e,n)}}clearGradientPaintVars(e){const s=[u,b,m];for(const t of e){for(const e of s)t.style.removeProperty(e)}}syncChromeLayoutVars(e,s,t,n){if(e){e.style.setProperty(g,t)}if(s){s.style.setProperty(v,n)}}resolvePanelWidthPx(e){const s=e?.querySelector(".panel-nav");if(this.panelNavTransition.isActive&&this.panelWidthTokens.expandedPx>0){const t=T(e,s);return V(this.panelWidthTokens,t)}const t=this.el.querySelector(".shell-app__panel");const n=t?.getBoundingClientRect().width??0;if(n>0)return n;if(this.panelWidthTokens.expandedPx>0){const t=T(e,s);return V(this.panelWidthTokens,t)}return 0}resolveViewportDimensions(){if(this.panelNavTransition.isActive&&this.cachedViewportWidth>0){return{width:this.cachedViewportWidth,height:this.cachedViewportHeight}}return _()}chromeLayerActive(){return o(this.gradientPreset)!=="none"}handleWindowKeyDown(e){if(!this.shortcutsEnabled)return;if(C(e.target))return;const s=D(e);if(!s)return;e.preventDefault();const t=this.el.querySelector("ds-panel-nav");const n=this.el.querySelector("ds-panel-tools");if(s==="toggle-panel-nav"){void t?.toggleCollapsed();return}if(s==="close-panel-tools"){void n?.closeDrawer();return}if(s.startsWith("open-tool:")&&n){const e=s.slice("open-tool:".length);void n.activateTool(e)}}syncChrome(){const e=this.el.querySelector("ds-panel-nav");const s=this.el.querySelector("ds-bar-nav");const t=[this.el,e,s].filter((e=>e!==null));const n=()=>{if(e)e.style.removeProperty(g);if(s)s.style.removeProperty(v)};const i=o(this.gradientPreset);if(i==="none"){this.clearGradientPaintVars(t);n();return}const l=this.resolveViewportDimensions();const a=this.resolvePanelWidthPx(e);const h=x();const c=k(a);this.syncChromeLayoutVars(e,s,h,c);const d=y(i);const p=w({width:l.width,height:l.height});const f=r(i);for(const e of t){if(e===this.el){this.applyGradientVars(e,{[u]:d,[b]:p,[g]:h,[v]:c,[m]:f});continue}const s=e.tagName.toLowerCase()==="ds-bar-nav";this.applyGradientVars(e,{[u]:d,[b]:p,[m]:f,[g]:s?null:h,[v]:s?c:null})}}render(){const e=this.chromeLayerActive();const s={"shell-app":true,"shell-app--gradient":e,[`shell-app--${this.navStyle}`]:true,"shell-app--tools-fullscreen":this.toolsFullscreen};return t(n,{key:"709712c622c8e9ec29f1ea874e8c80857f9a7c65",class:s},t("div",{key:"6823e3c9f73fab8ba18f0e687ecf1b28358bfda6",class:"shell-app__row"},t("div",{key:"d5795493d89b242304464af5d48b3604c7a95739",class:"shell-app__chrome","aria-hidden":"true"}),t("div",{key:"7ab3de15e52000d1982068f132cf93bdecb068e5",class:"shell-app__panel","aria-hidden":this.toolsFullscreen?"true":undefined,inert:this.toolsFullscreen?true:undefined},t("slot",{key:"6d636b5f527dede260273a666352224cf1ea51eb",name:"panel"})),t("div",{key:"1f5f871f8d8ef5833d2b03a4e747398f7229ff7d",class:"shell-app__main"},t("div",{key:"627cc0bfafc3847fdb5b4f1441cba55cbd22a19e",class:"shell-app__bar","aria-hidden":this.toolsFullscreen?"true":undefined,inert:this.toolsFullscreen?true:undefined},t("slot",{key:"ae6cfb0e7c5afcc0d31a41612c363c83c1677f58",name:"bar"})),t("div",{key:"451bb4dc6355c10d81b549decbb3630987484ba1",class:"shell-app__tools"},t("slot",{key:"356ead976b9d341e3eb7ad28aa9110d7decedb2a",name:"tools"})),t("div",{key:"170f4c524b0a5b735efb30121361e67e4db491b5",class:"shell-app__content","aria-hidden":this.toolsFullscreen?"true":undefined,inert:this.toolsFullscreen?true:undefined},t("slot",{key:"c8b384e56e93b44005ac8272919a30adab955b51"})))))}get el(){return this}static get watchers(){return{navStyle:[{onShellPropsChange:0}],gradientPreset:[{onShellPropsChange:0}]}}static get style(){return j()}},[262,"ds-shell-app",{navStyle:[513,"nav-style"],gradientPreset:[513,"gradient-preset"],shortcutsEnabled:[4,"shortcuts-enabled"],toolsFullscreen:[32]},[[0,"dsPresentationChange","handleToolsPresentation"],[10,"keydown","handleWindowKeyDown"]],{navStyle:[{onShellPropsChange:0}],gradientPreset:[{onShellPropsChange:0}]}]);function E(){if(typeof customElements==="undefined"){return}const e=["ds-shell-app"];e.forEach((e=>{switch(e){case"ds-shell-app":if(!customElements.get(i(e))){customElements.define(i(e),$)}break}}))}E();const W=$;const B=E;export{W as DsShellApp,B as defineCustomElement};
+//# sourceMappingURL=ds-shell-app.js.map

package/dist/components/ds-shell-app.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["SHELL_GRADIENT_IMAGE_VAR","SHELL_GRADIENT_SIZE_VAR","SHELL_GRADIENT_POSITION_PANEL_VAR","SHELL_GRADIENT_POSITION_BAR_VAR","SHELL_GRADIENT_OPACITY_VAR","buildShellRadialGradient","preset","DEFAULT_SHELL_GRADIENT_PRESET","buildShellRadialGradientForPreset","readShellViewportDimensions","win","w","globalThis","window","undefined","width","height","visual","visualViewport","Math","round","innerWidth","innerHeight","shellGradientSize","layout","shellGradientPositionPanel","shellGradientPositionBar","panelWidth","TOOL_SHORTCUT_KEYS","k","a","s","m","n","isBareShellShortcutKey","e","metaKey","ctrlKey","altKey","shiftKey","isEditableShortcutTarget","target","closest","el","editable","role","getAttribute","Boolean","isContentEditable","normalizedShortcutKey","key","code","length","toLowerCase","resolveShellShortcut","toolId","readCssVarWidthPx","context","cssVarName","document","probe","createElement","style","cssText","appendChild","getBoundingClientRect","removeChild","readPanelNavWidthTokens","navRoot","expandedPx","collapsedPx","isPanelNavCollapsed","panelNavHost","classList","contains","collapsedProp","collapsed","panelWidthPxFromTokens","tokens","shellAppCss","ShellApp","__stencil_proxyCustomElement","HTMLElement","constructor","registerHost","this","navStyle","gradientPreset","shortcutsEnabled","toolsFullscreen","resizeObserver","panelNavTransition","ChromeTransitionDepth","chromeSyncCoalescer","createRafCoalescer","syncChrome","panelWidthTokens","cachedViewportWidth","cachedViewportHeight","onWindowResize","isActive","scheduleChromeSync","onVisualViewportChange","onChromeTransitionStart","event","readChromeTransitionSource","enter","viewport","onChromeTransitionEnd","exit","componentDidLoad","syncSlottedNavStyle","connectMetricsObserver","connectViewportListeners","addEventListener","CHROME_TRANSITION_START","CHROME_TRANSITION_END","requestAnimationFrame","cachePanelWidthTokens","tools","querySelector","handleToolsPresentation","detail","presentation","disconnectedCallback","disconnect","disconnectViewportListeners","cancel","removeEventListener","onShellPropsChange","schedule","panel","bar","setAttribute","ResizeObserver","observe","panelWrap","passive","applyGradientVars","vars","name","value","Object","entries","removeProperty","setProperty","clearGradientPaintVars","targets","keys","syncChromeLayoutVars","panelPosition","barPosition","resolvePanelWidthPx","panelNav","measured","resolveViewportDimensions","chromeLayerActive","normalizeShellGradientPreset","handleWindowKeyDown","action","preventDefault","toggleCollapsed","closeDrawer","startsWith","slice","activateTool","filter","clearLayoutVars","image","size","opacity","shellGradientPresetOpacity","isBar","tagName","render","chromeActive","shellCls","h","Host","class","inert"],"sources":["src/wc/shell/shell-gradient.ts","src/wc/shell/shell-shortcuts.ts","src/wc/shell/shell-chrome-metrics.ts","src/wc/components/ShellApp/ShellApp.css?tag=ds-shell-app&encapsulation=scoped","src/wc/components/ShellApp/ShellApp.tsx"],"sourcesContent":["/** CSS var names consumed by `ds-panel-nav` / `ds-bar-nav` inside `ds-shell-app`. */\nimport type { ShellGradientPreset } from './shell-gradient-presets';\nimport {\n  DEFAULT_SHELL_GRADIENT_PRESET,\n  buildShellRadialGradientForPreset,\n  normalizeShellGradientPreset,\n} from './shell-gradient-presets';\n\nexport type { ShellGradientPreset } from './shell-gradient-presets';\nexport {\n  DEFAULT_SHELL_GRADIENT_PRESET,\n  SHELL_GRADIENT_PRESETS,\n  SHELL_GRADIENT_PRESET_LABELS,\n  buildShellRadialGradientForPreset,\n  buildShellRadialGradientFromStops,\n  isShellGradientPreset,\n  shellGradientPresetOpacity,\n  shellGradientPresetRecipe,\n  shellGradientPresetStopToken,\n} from './shell-gradient-presets';\n\nexport const SHELL_GRADIENT_IMAGE_VAR = '--ds-shell-gradient-image';\nexport const SHELL_GRADIENT_SIZE_VAR = '--ds-shell-gradient-size';\nexport const SHELL_GRADIENT_POSITION_PANEL_VAR = '--ds-shell-gradient-position-panel';\nexport const SHELL_GRADIENT_POSITION_BAR_VAR = '--ds-shell-gradient-position-bar';\nexport const SHELL_GRADIENT_OPACITY_VAR = '--ds-shell-gradient-opacity';\n/** Per chrome-surface background-position — offsets wash + grid to shell row origin. */\nexport const SHELL_CHROME_SURFACE_POSITION_VAR = '--ds-shell-chrome-surface-position';\n\n/** Whether the shared chrome layer (secondary bg + optional wash) should mount. */\nexport function shellChromeLayerActive(preset: ShellGradientPreset): boolean {\n  return normalizeShellGradientPreset(preset) !== 'none';\n}\n\n/**\n * Shell radial wash — same for panel and bar nav.\n * Tokens follow `data-theme` (light/dark intent stops).\n */\nexport function buildShellRadialGradient(\n  preset: ShellGradientPreset = DEFAULT_SHELL_GRADIENT_PRESET,\n): string {\n  return buildShellRadialGradientForPreset(preset);\n}\n\n/** Built-in radial image for the selected shell preset. */\nexport function shellGradientImage(\n  preset: ShellGradientPreset = DEFAULT_SHELL_GRADIENT_PRESET,\n): string {\n  return buildShellRadialGradient(preset);\n}\n\nexport interface ShellViewportDimensions {\n  width: number;\n  height: number;\n}\n\n/**\n * Viewport size for shell chrome with `background-attachment: fixed`.\n * Must not use the `ds-shell-app` element box — the shell can be shorter or\n * taller than the viewport when host height chains break or content overflows.\n */\nexport function readShellViewportDimensions(win?: Window): ShellViewportDimensions {\n  const w = win ?? (typeof globalThis.window !== 'undefined' ? globalThis.window : undefined);\n  if (!w) return { width: 0, height: 0 };\n\n  const visual = w.visualViewport;\n  return {\n    width: Math.round(visual?.width ?? w.innerWidth),\n    height: Math.round(visual?.height ?? w.innerHeight),\n  };\n}\n\nexport interface ShellGradientLayout {\n  width: number;\n  height: number;\n  panelWidth: number;\n}\n\n/** Pixel `background-size` for the fixed-attachment radial wash. */\nexport function shellGradientSize(layout: Pick<ShellGradientLayout, 'width' | 'height'>): string {\n  return `${Math.round(layout.width)}px ${Math.round(layout.height)}px`;\n}\n\nexport function shellGradientPositionPanel(): string {\n  return '0 0';\n}\n\nexport function shellGradientPositionBar(panelWidth: number): string {\n  return `${-Math.round(panelWidth)}px 0`;\n}\n\n/** Phase-lock a chrome rect to the shell row coordinate system (wash + grid). */\nexport function shellChromeSurfacePosition(leftPx: number, topPx: number): string {\n  return `${-Math.round(leftPx)}px ${-Math.round(topPx)}px`;\n}\n","import type { PanelToolsToolId } from '../components/PanelTools/panel-tools-types';\n\nexport type ShellShortcutAction =\n  | 'toggle-panel-nav'\n  | 'close-panel-tools'\n  | `open-tool:${PanelToolsToolId}`;\n\nconst TOOL_SHORTCUT_KEYS: Record<string, PanelToolsToolId> = {\n  k: 'search',\n  a: 'agents',\n  s: 'stacks',\n  m: 'messages',\n  n: 'activity',\n  '/': 'help',\n};\n\n/** Tool shortcut keys (K, A, S, M, N, /) toggle open/closed via `ds-panel-tools.activateTool`. */\n\n/** True when no modifier keys are held — avoids browser/app chords like ⌘N. */\nexport function isBareShellShortcutKey(\n  e: Pick<KeyboardEvent, 'metaKey' | 'ctrlKey' | 'altKey' | 'shiftKey'>,\n): boolean {\n  return !e.metaKey && !e.ctrlKey && !e.altKey && !e.shiftKey;\n}\n\n/** Skip shell shortcuts while typing in an editable control. */\nexport function isEditableShortcutTarget(target: EventTarget | null): boolean {\n  if (!target || typeof target !== 'object') return false;\n  if (!('closest' in target) || typeof target.closest !== 'function') return false;\n\n  const el = target as Element & { isContentEditable?: boolean };\n\n  const editable = el.closest(\n    'input, textarea, select, [contenteditable=\"\"], [contenteditable=\"true\"], [contenteditable=\"plaintext-only\"]',\n  );\n  if (editable) return true;\n\n  const role = el.getAttribute('role');\n  if (role === 'textbox' || role === 'combobox' || role === 'searchbox') return true;\n\n  return Boolean(el.isContentEditable);\n}\n\nfunction normalizedShortcutKey(e: Pick<KeyboardEvent, 'key' | 'code'>): string {\n  if (e.key === '[' || e.code === 'BracketLeft') return '[';\n  if (e.key === ']' || e.code === 'BracketRight') return ']';\n  return e.key.length === 1 ? e.key.toLowerCase() : e.key.toLowerCase();\n}\n\n/** Resolve a shell chrome shortcut, or `null` when the key is not handled. */\nexport function resolveShellShortcut(\n  e: Pick<KeyboardEvent, 'key' | 'code' | 'metaKey' | 'ctrlKey' | 'altKey' | 'shiftKey'>,\n): ShellShortcutAction | null {\n  if (!isBareShellShortcutKey(e)) return null;\n\n  const key = normalizedShortcutKey(e);\n  if (key === '[') return 'toggle-panel-nav';\n  if (key === ']') return 'close-panel-tools';\n\n  const toolId = TOOL_SHORTCUT_KEYS[key];\n  if (toolId) return `open-tool:${toolId}`;\n\n  return null;\n}\n","import { shellGradientPositionBar } from './shell-gradient';\n\n/** Read a `var(--token)` width in px using a hidden probe (works with calc() tokens). */\nexport function readCssVarWidthPx(context: HTMLElement, cssVarName: string): number {\n  if (typeof document === 'undefined') return 0;\n\n  const probe = document.createElement('div');\n  probe.style.cssText =\n    'position:absolute;visibility:hidden;pointer-events:none;height:0;width:var(' +\n    cssVarName +\n    ');';\n  context.appendChild(probe);\n  const width = probe.getBoundingClientRect().width;\n  context.removeChild(probe);\n  return width;\n}\n\nexport interface PanelNavWidthTokens {\n  expandedPx: number;\n  collapsedPx: number;\n}\n\n/** Resolve panel-nav expanded/collapsed widths from scoped CSS vars on `.panel-nav`. */\nexport function readPanelNavWidthTokens(navRoot: HTMLElement): PanelNavWidthTokens {\n  return {\n    expandedPx: readCssVarWidthPx(navRoot, '--_nav-width'),\n    collapsedPx: readCssVarWidthPx(navRoot, '--_nav-width-collapsed'),\n  };\n}\n\nexport function isPanelNavCollapsed(\n  panelNavHost: HTMLElement | null,\n  navRoot: HTMLElement | null,\n): boolean {\n  if (navRoot?.classList.contains('panel-nav--collapsed')) return true;\n  const collapsedProp = (panelNavHost as (HTMLElement & { collapsed?: boolean }) | null)?.collapsed;\n  return collapsedProp === true;\n}\n\nexport function panelWidthPxFromTokens(\n  tokens: PanelNavWidthTokens,\n  collapsed: boolean,\n): number {\n  return collapsed ? tokens.collapsedPx : tokens.expandedPx;\n}\n\nexport function barGradientPositionFromPanelWidth(panelWidthPx: number): string {\n  return shellGradientPositionBar(panelWidthPx);\n}\n",":host {\n  display: block;\n  height: 100%;\n  min-height: 0;\n  box-sizing: border-box;\n  overflow: hidden;\n  overscroll-behavior: none;\n  --ds-shell-panel-tools-width: var(--dimension-panel-width-xs);\n}\n\n.shell-app {\n  display: flex;\n  flex-direction: column;\n  height: 100%;\n  min-height: 0;\n  box-sizing: border-box;\n  overflow: hidden;\n  overscroll-behavior: none;\n  font-family: var(--typography-font-family, system-ui);\n}\n\n:host {\n  --_shell-chrome-bg: var(--color-background-secondary);\n}\n\n.shell-app__row {\n  display: flex;\n  flex: 1 1 auto;\n  min-height: 0;\n  height: 100%;\n  position: relative;\n}\n\n/*\n * One chrome layer behind the shell row. Wash uses background-attachment: fixed\n * so the pattern is locked to the viewport — panel/tools collapse only changes the\n * transparent window, not the pattern phase. JS sets wash background-size from\n * readShellViewportDimensions(), not the shell element box.\n */\n.shell-app__chrome {\n  position: absolute;\n  inset: 0;\n  pointer-events: none;\n  z-index: 0;\n  background-color: var(--_shell-chrome-bg);\n}\n\n:host(.shell-app--gradient) .shell-app__chrome::before {\n  content: '';\n  position: absolute;\n  inset: 0;\n  pointer-events: none;\n  background-position: 0 0;\n  background-attachment: fixed;\n  z-index: 1;\n  opacity: var(--ds-shell-gradient-opacity, 1);\n  background-image: var(--ds-shell-gradient-image, none);\n  background-size: var(--ds-shell-gradient-size, auto);\n  background-repeat: no-repeat;\n}\n\n.shell-app__panel {\n  flex: 0 0 auto;\n  min-height: 0;\n  height: 100%;\n  position: relative;\n  /* Above main so resize handle line can paint over the workspace edge */\n  z-index: 2;\n}\n\n.shell-app__panel ::slotted(ds-panel-nav) {\n  display: block;\n  height: 100%;\n}\n\n.shell-app__main {\n  flex: 1 1 auto;\n  min-width: 0;\n  min-height: 0;\n  display: grid;\n  grid-template-columns: minmax(0, 1fr) auto;\n  grid-template-rows: auto minmax(0, 1fr);\n  grid-template-areas:\n    'bar tools'\n    'content tools';\n  position: relative;\n  z-index: 1;\n}\n\n.shell-app__bar {\n  grid-area: bar;\n  flex: 0 0 auto;\n  min-width: 0;\n}\n\n.shell-app__bar ::slotted(ds-bar-nav) {\n  display: block;\n}\n\n.shell-app__content {\n  grid-area: content;\n  flex: 1 1 auto;\n  min-width: 0;\n  min-height: 0;\n  overflow: auto;\n  overscroll-behavior: none;\n  /* Limit reflow to the page column — not on __main (breaks tools flex shrink). */\n  contain: layout;\n}\n\n/* Opaque page surface — masks the fixed chrome layer in the content column. */\n.shell-app__content {\n  position: relative;\n  z-index: 1;\n  background-color: var(--color-background-primary);\n}\n\n.shell-app__tools {\n  grid-area: tools;\n  flex: 0 0 auto;\n  min-width: 0;\n  min-height: 0;\n  height: 100%;\n  display: flex;\n  position: relative;\n  z-index: 0;\n  overflow: hidden;\n}\n\n.shell-app__tools ::slotted(ds-panel-tools) {\n  display: block;\n  height: 100%;\n  min-height: 0;\n}\n\n:host(.shell-app--tools-fullscreen) .shell-app__panel,\n:host(.shell-app--tools-fullscreen) .shell-app__bar,\n:host(.shell-app--tools-fullscreen) .shell-app__content {\n  visibility: hidden;\n}\n","import { Component, Prop, Element, State, Watch, Listen, h, Host } from '@stencil/core';\nimport type { NavChromeStyle } from '../../shell/nav-chrome';\nimport {\n  isEditableShortcutTarget,\n  resolveShellShortcut,\n} from '../../shell/shell-shortcuts';\nimport type { PanelToolsToolId } from '../PanelTools/panel-tools-types';\nimport {\n  DEFAULT_SHELL_GRADIENT_PRESET,\n  normalizeShellGradientPreset,\n  type ShellGradientPreset,\n} from '../../shell/shell-gradient-presets';\nimport {\n  CHROME_TRANSITION_END,\n  CHROME_TRANSITION_START,\n  ChromeTransitionDepth,\n  createRafCoalescer,\n  readChromeTransitionSource,\n} from '../../shell/chrome-transition';\nimport {\n  isPanelNavCollapsed,\n  panelWidthPxFromTokens,\n  readPanelNavWidthTokens,\n  type PanelNavWidthTokens,\n} from '../../shell/shell-chrome-metrics';\nimport {\n  SHELL_GRADIENT_IMAGE_VAR,\n  SHELL_GRADIENT_OPACITY_VAR,\n  SHELL_GRADIENT_POSITION_BAR_VAR,\n  SHELL_GRADIENT_POSITION_PANEL_VAR,\n  SHELL_GRADIENT_SIZE_VAR,\n  buildShellRadialGradient,\n  readShellViewportDimensions,\n  shellGradientPositionBar,\n  shellGradientPositionPanel,\n  shellGradientPresetOpacity,\n  shellGradientSize,\n} from '../../shell/shell-gradient';\n\n@Component({\n  tag: 'ds-shell-app',\n  styleUrl: 'ShellApp.css',\n  scoped: true,\n})\nexport class ShellApp {\n  /** Chrome style propagated to slotted `ds-panel-nav` and `ds-bar-nav`. */\n  @Prop({ attribute: 'nav-style', reflect: true }) navStyle: NavChromeStyle = 'dashboard';\n\n  /**\n   * Shell chrome wash preset. `none` renders solid chrome; the remaining\n   * presets use token-based washes that adapt to the active color theme.\n   */\n  @Prop({ attribute: 'gradient-preset', reflect: true }) gradientPreset: ShellGradientPreset =\n    DEFAULT_SHELL_GRADIENT_PRESET;\n\n  /** When `true` (default), registers global shell keyboard shortcuts. `[` toggles panel nav; `]` closes tools; K, A, S, M, N, and / toggle tool drawers. Modifiers are ignored so browser chords like ⌘N stay native. */\n  @Prop({ attribute: 'shortcuts-enabled' }) shortcutsEnabled: boolean = true;\n\n  @Element() el!: HTMLElement;\n  @State() private toolsFullscreen = false;\n\n  private resizeObserver: ResizeObserver | null = null;\n  private readonly panelNavTransition = new ChromeTransitionDepth();\n  private readonly chromeSyncCoalescer = createRafCoalescer(() => this.syncChrome());\n  private panelWidthTokens: PanelNavWidthTokens = { expandedPx: 0, collapsedPx: 0 };\n  private cachedViewportWidth = 0;\n  private cachedViewportHeight = 0;\n  private onWindowResize = () => {\n    if (this.panelNavTransition.isActive) return;\n    this.scheduleChromeSync();\n  };\n  private onVisualViewportChange = () => {\n    if (this.panelNavTransition.isActive) return;\n    this.scheduleChromeSync();\n  };\n\n  componentDidLoad() {\n    this.syncSlottedNavStyle();\n    this.connectMetricsObserver();\n    this.connectViewportListeners();\n    this.el.addEventListener(CHROME_TRANSITION_START, this.onChromeTransitionStart);\n    this.el.addEventListener(CHROME_TRANSITION_END, this.onChromeTransitionEnd);\n    requestAnimationFrame(() => {\n      this.cachePanelWidthTokens();\n      this.scheduleChromeSync();\n    });\n    const tools = this.el.querySelector('ds-panel-tools');\n    this.toolsFullscreen = tools?.getAttribute('presentation') === 'fullscreen';\n  }\n\n  @Listen('dsPresentationChange')\n  handleToolsPresentation(event: CustomEvent<{ presentation?: string }>) {\n    this.toolsFullscreen = event.detail?.presentation === 'fullscreen';\n  }\n\n  disconnectedCallback() {\n    this.resizeObserver?.disconnect();\n    this.resizeObserver = null;\n    this.disconnectViewportListeners();\n    this.chromeSyncCoalescer.cancel();\n    this.el.removeEventListener(CHROME_TRANSITION_START, this.onChromeTransitionStart);\n    this.el.removeEventListener(CHROME_TRANSITION_END, this.onChromeTransitionEnd);\n  }\n\n  @Watch('navStyle')\n  @Watch('gradientPreset')\n  onShellPropsChange() {\n    this.syncSlottedNavStyle();\n    this.scheduleChromeSync();\n  }\n\n  private onChromeTransitionStart = (event: Event) => {\n    if (readChromeTransitionSource(event) !== 'panel-nav') return;\n\n    this.panelNavTransition.enter();\n    const viewport = readShellViewportDimensions();\n    this.cachedViewportWidth = viewport.width;\n    this.cachedViewportHeight = viewport.height;\n    this.syncChrome();\n  };\n\n  private onChromeTransitionEnd = (event: Event) => {\n    if (readChromeTransitionSource(event) !== 'panel-nav') return;\n\n    this.panelNavTransition.exit();\n    if (!this.panelNavTransition.isActive) {\n      this.scheduleChromeSync();\n    }\n  };\n\n  /** Coalesce ResizeObserver bursts to one layout read per frame. */\n  private scheduleChromeSync() {\n    this.chromeSyncCoalescer.schedule();\n  }\n\n  private syncSlottedNavStyle() {\n    const panel = this.el.querySelector('ds-panel-nav') as (HTMLElement & { navStyle: NavChromeStyle }) | null;\n    const bar = this.el.querySelector('ds-bar-nav') as (HTMLElement & { navStyle: NavChromeStyle }) | null;\n    if (panel) {\n      panel.setAttribute('nav-style', this.navStyle);\n      panel.navStyle = this.navStyle;\n    }\n    if (bar) {\n      bar.setAttribute('nav-style', this.navStyle);\n      bar.navStyle = this.navStyle;\n    }\n  }\n\n  private connectMetricsObserver() {\n    this.resizeObserver = new ResizeObserver(() => {\n      if (this.panelNavTransition.isActive) return;\n      this.scheduleChromeSync();\n    });\n    this.resizeObserver.observe(this.el);\n    const panelWrap = this.el.querySelector('.shell-app__panel');\n    if (panelWrap) this.resizeObserver.observe(panelWrap);\n  }\n\n  private connectViewportListeners() {\n    if (typeof window === 'undefined') return;\n\n    window.addEventListener('resize', this.onWindowResize, { passive: true });\n\n    const visual = window.visualViewport;\n    if (visual) {\n      visual.addEventListener('resize', this.onVisualViewportChange, { passive: true });\n      visual.addEventListener('scroll', this.onVisualViewportChange, { passive: true });\n    }\n  }\n\n  private disconnectViewportListeners() {\n    if (typeof window === 'undefined') return;\n\n    window.removeEventListener('resize', this.onWindowResize);\n\n    const visual = window.visualViewport;\n    if (visual) {\n      visual.removeEventListener('resize', this.onVisualViewportChange);\n      visual.removeEventListener('scroll', this.onVisualViewportChange);\n    }\n  }\n\n  private cachePanelWidthTokens() {\n    const navRoot = this.el.querySelector('ds-panel-nav .panel-nav') as HTMLElement | null;\n    if (!navRoot) return;\n    this.panelWidthTokens = readPanelNavWidthTokens(navRoot);\n  }\n\n  private applyGradientVars(target: HTMLElement, vars: Record<string, string | null>) {\n    const style = target.style;\n    for (const [name, value] of Object.entries(vars)) {\n      if (value === null) style.removeProperty(name);\n      else style.setProperty(name, value);\n    }\n  }\n\n  private clearGradientPaintVars(targets: HTMLElement[]) {\n    const keys = [\n      SHELL_GRADIENT_IMAGE_VAR,\n      SHELL_GRADIENT_SIZE_VAR,\n      SHELL_GRADIENT_OPACITY_VAR,\n    ];\n    for (const target of targets) {\n      for (const key of keys) target.style.removeProperty(key);\n    }\n  }\n\n  /** Panel/bar wash offsets for scroll fades and badge rings. */\n  private syncChromeLayoutVars(\n    panel: HTMLElement | null,\n    bar: HTMLElement | null,\n    panelPosition: string,\n    barPosition: string,\n  ) {\n    if (panel) {\n      panel.style.setProperty(SHELL_GRADIENT_POSITION_PANEL_VAR, panelPosition);\n    }\n    if (bar) {\n      bar.style.setProperty(SHELL_GRADIENT_POSITION_BAR_VAR, barPosition);\n    }\n  }\n\n  private resolvePanelWidthPx(panelNav: HTMLElement | null): number {\n    const navRoot = panelNav?.querySelector('.panel-nav') as HTMLElement | null;\n\n    if (this.panelNavTransition.isActive && this.panelWidthTokens.expandedPx > 0) {\n      const collapsed = isPanelNavCollapsed(panelNav, navRoot);\n      return panelWidthPxFromTokens(this.panelWidthTokens, collapsed);\n    }\n\n    const panelWrap = this.el.querySelector('.shell-app__panel') as HTMLElement | null;\n    const measured = panelWrap?.getBoundingClientRect().width ?? 0;\n    if (measured > 0) return measured;\n\n    if (this.panelWidthTokens.expandedPx > 0) {\n      const collapsed = isPanelNavCollapsed(panelNav, navRoot);\n      return panelWidthPxFromTokens(this.panelWidthTokens, collapsed);\n    }\n\n    return 0;\n  }\n\n  /** Fixed-attachment wash/grid size — always the viewport, never the shell element box. */\n  private resolveViewportDimensions(): { width: number; height: number } {\n    if (this.panelNavTransition.isActive && this.cachedViewportWidth > 0) {\n      return {\n        width: this.cachedViewportWidth,\n        height: this.cachedViewportHeight,\n      };\n    }\n\n    return readShellViewportDimensions();\n  }\n\n  private chromeLayerActive(): boolean {\n    return normalizeShellGradientPreset(this.gradientPreset) !== 'none';\n  }\n\n  @Listen('keydown', { target: 'window', capture: true })\n  handleWindowKeyDown(e: KeyboardEvent) {\n    if (!this.shortcutsEnabled) return;\n    if (isEditableShortcutTarget(e.target)) return;\n\n    const action = resolveShellShortcut(e);\n    if (!action) return;\n\n    e.preventDefault();\n\n    const panel = this.el.querySelector('ds-panel-nav') as HTMLDsPanelNavElement | null;\n    const tools = this.el.querySelector('ds-panel-tools') as HTMLDsPanelToolsElement | null;\n\n    if (action === 'toggle-panel-nav') {\n      void panel?.toggleCollapsed();\n      return;\n    }\n\n    if (action === 'close-panel-tools') {\n      void tools?.closeDrawer();\n      return;\n    }\n\n    if (action.startsWith('open-tool:') && tools) {\n      const toolId = action.slice('open-tool:'.length) as PanelToolsToolId;\n      void tools.activateTool(toolId);\n    }\n  }\n\n  private syncChrome() {\n    const panelNav = this.el.querySelector('ds-panel-nav') as HTMLElement | null;\n    const bar = this.el.querySelector('ds-bar-nav') as HTMLElement | null;\n    const targets = [this.el, panelNav, bar].filter((el): el is HTMLElement => el !== null);\n\n    const clearLayoutVars = () => {\n      if (panelNav) panelNav.style.removeProperty(SHELL_GRADIENT_POSITION_PANEL_VAR);\n      if (bar) bar.style.removeProperty(SHELL_GRADIENT_POSITION_BAR_VAR);\n    };\n\n    const preset = normalizeShellGradientPreset(this.gradientPreset);\n    if (preset === 'none') {\n      this.clearGradientPaintVars(targets);\n      clearLayoutVars();\n      return;\n    }\n\n    const viewport = this.resolveViewportDimensions();\n    const panelWidth = this.resolvePanelWidthPx(panelNav);\n\n    const panelPosition = shellGradientPositionPanel();\n    const barPosition = shellGradientPositionBar(panelWidth);\n\n    this.syncChromeLayoutVars(panelNav, bar, panelPosition, barPosition);\n\n    const image = buildShellRadialGradient(preset);\n\n    const size = shellGradientSize({\n      width: viewport.width,\n      height: viewport.height,\n    });\n    const opacity = shellGradientPresetOpacity(preset);\n\n    for (const target of targets) {\n      if (target === this.el) {\n        this.applyGradientVars(target, {\n          [SHELL_GRADIENT_IMAGE_VAR]: image,\n          [SHELL_GRADIENT_SIZE_VAR]: size,\n          [SHELL_GRADIENT_POSITION_PANEL_VAR]: panelPosition,\n          [SHELL_GRADIENT_POSITION_BAR_VAR]: barPosition,\n          [SHELL_GRADIENT_OPACITY_VAR]: opacity,\n        });\n        continue;\n      }\n\n      const isBar = target.tagName.toLowerCase() === 'ds-bar-nav';\n      this.applyGradientVars(target, {\n        [SHELL_GRADIENT_IMAGE_VAR]: image,\n        [SHELL_GRADIENT_SIZE_VAR]: size,\n        [SHELL_GRADIENT_OPACITY_VAR]: opacity,\n        [SHELL_GRADIENT_POSITION_PANEL_VAR]: isBar ? null : panelPosition,\n        [SHELL_GRADIENT_POSITION_BAR_VAR]: isBar ? barPosition : null,\n      });\n    }\n  }\n\n  render() {\n    const chromeActive = this.chromeLayerActive();\n    const shellCls: Record<string, boolean> = {\n      'shell-app': true,\n      'shell-app--gradient': chromeActive,\n      [`shell-app--${this.navStyle}`]: true,\n      'shell-app--tools-fullscreen': this.toolsFullscreen,\n    };\n\n    return (\n      <Host class={shellCls}>\n        <div class=\"shell-app__row\">\n          <div class=\"shell-app__chrome\" aria-hidden=\"true\" />\n          <div class=\"shell-app__panel\" aria-hidden={this.toolsFullscreen ? 'true' : undefined} inert={this.toolsFullscreen ? true : undefined}>\n            <slot name=\"panel\" />\n          </div>\n          <div class=\"shell-app__main\">\n            <div class=\"shell-app__bar\" aria-hidden={this.toolsFullscreen ? 'true' : undefined} inert={this.toolsFullscreen ? true : undefined}>\n              <slot name=\"bar\" />\n            </div>\n            <div class=\"shell-app__tools\">\n              <slot name=\"tools\" />\n            </div>\n            <div class=\"shell-app__content\" aria-hidden={this.toolsFullscreen ? 'true' : undefined} inert={this.toolsFullscreen ? true : undefined}>\n              <slot />\n            </div>\n          </div>\n        </div>\n      </Host>\n    );\n  }\n}\n"],"mappings":"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","ignoreList":[]}

package/dist/components/ds-shell-gradient-picker.js

@@ -1,2 +1,2 @@
-import{p as s,H as e,c as t,h as a,a as i,t as c}from"./index.js";import{D as r,n,s as o}from"./p-D1HFMTdC.js";import{d as h}from"./p-bDx_rlLm.js";const l=()=>`.sc-ds-shell-gradient-picker-h{display:block;width:100%}`;const d=s(class s extends e{constructor(s){super();if(s!==false){this.__registerHost()}this.dsChange=t(this,"dsChange");this.value=r;this.groupLabel="Shell gradient theme";this.handleChange=s=>{const e=n(s);if(e===n(this.value))return;this.value=e;this.dsChange.emit(e)}}render(){return a(i,{key:"83552a7a48ec021fa89cb85304d8cb8729e774a8"},a("ds-swatch-picker",{key:"75c70cad8967bac90973218adc0a7ef5a3b56402",value:n(this.value),groupLabel:this.groupLabel,sections:o(),onDsChange:s=>{s.stopPropagation();this.handleChange(s.detail)}}))}static get style(){return l()}},[2,"ds-shell-gradient-picker",{value:[1537],groupLabel:[1,"group-label"]}]);function p(){if(typeof customElements==="undefined"){return}const s=["ds-shell-gradient-picker","ds-swatch-picker"];s.forEach((s=>{switch(s){case"ds-shell-gradient-picker":if(!customElements.get(c(s))){customElements.define(c(s),d)}break;case"ds-swatch-picker":if(!customElements.get(c(s))){h()}break}}))}p();const u=d;const m=p;export{u as DsShellGradientPicker,m as defineCustomElement};
+import{p as s,H as e,c as t,h as i,a as r,t as a}from"./index.js";import{D as c,n,s as d}from"./p-D1HFMTdC.js";import{d as o}from"./p-CwTVEAl2.js";const h=()=>`.sc-ds-shell-gradient-picker-h{display:block;width:100%}`;const l=s(class s extends e{constructor(s){super();if(s!==false){this.__registerHost()}this.dsChange=t(this,"dsChange");this.value=c;this.groupLabel="Shell gradient theme";this.handleChange=s=>{const e=n(s);if(e===n(this.value))return;this.value=e;this.dsChange.emit(e)}}render(){return i(r,{key:"9f3543050d3d365a2064e7b67f8db4e6a83f4364"},i("ds-swatch-picker",{key:"c989e4e3847e359548cc2ea10f7711027f2dd6d1",value:n(this.value),groupLabel:this.groupLabel,sections:d(),onDsChange:s=>{s.stopPropagation();this.handleChange(s.detail)}}))}static get style(){return h()}},[2,"ds-shell-gradient-picker",{value:[1537],groupLabel:[1,"group-label"]}]);function p(){if(typeof customElements==="undefined"){return}const s=["ds-shell-gradient-picker","ds-swatch-picker"];s.forEach((s=>{switch(s){case"ds-shell-gradient-picker":if(!customElements.get(a(s))){customElements.define(a(s),l)}break;case"ds-swatch-picker":if(!customElements.get(a(s))){o()}break}}))}p();const f=l;const u=p;export{f as DsShellGradientPicker,u as defineCustomElement};
 //# sourceMappingURL=ds-shell-gradient-picker.js.map