@ds-mo/ui 13.0.0 → 13.2.0

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

@@ -1 +1 @@
-{"version":3,"names":["tagCss","ICON_SIZE","md","sm","xs","Tag","__stencil_proxyCustomElement","HTMLElement","constructor","registerHost","this","icon","intent","contrast","size","rounded","interactive","expanded","isInactive","handleClick","event","dsClick","emit","render","textVariant","CONTROL_TEXT_VARIANT","iconSize","maxWidthStyle","maxWidth","undefined","hostClass","tag","content","h","class","name","color","as","variant","label","Host","style","type","tag__button","ariaControls","disabled","onClick"],"sources":["src/wc/components/Tag/Tag.css?tag=ds-tag&encapsulation=scoped","src/wc/components/Tag/Tag.tsx"],"sourcesContent":["@import '../../utils/tag-chip.css';\n\n/* ── Intent × Contrast — strong ─────────────────────────────────────────── */\n\n:host(.tag--intent-neutral.tag--contrast-strong)  { background-color: var(--color-background-strong-neutral);  color: var(--color-foreground-medium-neutral);  }\n:host(.tag--intent-brand.tag--contrast-strong)    { background-color: var(--color-background-strong-brand);    color: var(--color-foreground-on-strong-background-primary); }\n:host(.tag--intent-ai.tag--contrast-strong)       { background-color: var(--color-background-strong-ai);       color: var(--color-foreground-medium-ai);       }\n:host(.tag--intent-negative.tag--contrast-strong) { background-color: var(--color-background-strong-negative); color: var(--color-foreground-medium-negative); }\n:host(.tag--intent-warning.tag--contrast-strong)  { background-color: var(--color-background-strong-warning);  color: var(--color-foreground-medium-warning);  }\n:host(.tag--intent-caution.tag--contrast-strong)  { background-color: var(--color-background-strong-caution);  color: var(--color-foreground-medium-caution);  }\n:host(.tag--intent-positive.tag--contrast-strong) { background-color: var(--color-background-strong-positive); color: var(--color-foreground-medium-positive); }\n\n/* ── Intent × Contrast — bold ───────────────────────────────────────────── */\n\n:host(.tag--intent-neutral.tag--contrast-bold)  { background-color: var(--color-background-bold-neutral);  color: var(--color-foreground-on-bold-background-primary); }\n:host(.tag--intent-brand.tag--contrast-bold)    { background-color: var(--color-background-bold-brand);    color: var(--color-foreground-on-bold-background-primary); }\n:host(.tag--intent-ai.tag--contrast-bold)       { background-color: var(--color-background-bold-ai);       color: var(--color-foreground-on-bold-background-primary); }\n:host(.tag--intent-negative.tag--contrast-bold) { background-color: var(--color-background-bold-negative); color: var(--color-foreground-on-bold-background-primary); }\n:host(.tag--intent-warning.tag--contrast-bold)  { background-color: var(--color-background-bold-warning);  color: var(--color-foreground-on-bold-background-primary); }\n:host(.tag--intent-caution.tag--contrast-bold)  { background-color: var(--color-background-bold-caution);  color: var(--color-foreground-on-bold-background-primary); }\n:host(.tag--intent-positive.tag--contrast-bold) { background-color: var(--color-background-bold-positive); color: var(--color-foreground-on-bold-background-primary); }\n\n/* ── Intent × Contrast — medium ─────────────────────────────────────────── */\n\n:host(.tag--intent-neutral.tag--contrast-medium)  { background-color: var(--color-background-medium-neutral);  color: var(--color-foreground-strong-neutral);  }\n:host(.tag--intent-brand.tag--contrast-medium)    { background-color: var(--color-background-medium-brand);    color: var(--color-foreground-on-medium-background-primary); }\n:host(.tag--intent-ai.tag--contrast-medium)       { background-color: var(--color-background-medium-ai);       color: var(--color-foreground-strong-ai);       }\n:host(.tag--intent-negative.tag--contrast-medium) { background-color: var(--color-background-medium-negative); color: var(--color-foreground-strong-negative); }\n:host(.tag--intent-warning.tag--contrast-medium)  { background-color: var(--color-background-medium-warning);  color: var(--color-foreground-strong-warning);  }\n:host(.tag--intent-caution.tag--contrast-medium)  { background-color: var(--color-background-medium-caution);  color: var(--color-foreground-strong-caution);  }\n:host(.tag--intent-positive.tag--contrast-medium) { background-color: var(--color-background-medium-positive); color: var(--color-foreground-strong-positive); }\n\n/* ── Intent × Contrast — faint ──────────────────────────────────────────── */\n\n:host(.tag--intent-neutral.tag--contrast-faint)  { background-color: var(--color-background-faint-neutral);  color: var(--color-foreground-bold-neutral);  }\n:host(.tag--intent-brand.tag--contrast-faint)    { background-color: var(--color-background-faint-brand);    color: var(--color-foreground-bold-brand);    }\n:host(.tag--intent-ai.tag--contrast-faint)       { background-color: var(--color-background-faint-ai);       color: var(--color-foreground-bold-ai);       }\n:host(.tag--intent-negative.tag--contrast-faint) { background-color: var(--color-background-faint-negative); color: var(--color-foreground-bold-negative); }\n:host(.tag--intent-warning.tag--contrast-faint)  { background-color: var(--color-background-faint-warning);  color: var(--color-foreground-bold-warning);  }\n:host(.tag--intent-caution.tag--contrast-faint)  { background-color: var(--color-background-faint-caution);  color: var(--color-foreground-bold-caution);  }\n:host(.tag--intent-positive.tag--contrast-faint) { background-color: var(--color-background-faint-positive); color: var(--color-foreground-bold-positive); }\n\n/* ── Interactive menu trigger ───────────────────────────────────────────── */\n\n:host(.tag--interactive) {\n  padding: 0;\n  gap: 0;\n}\n\n.tag__button {\n  all: unset;\n  position: relative;\n  z-index: 0;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  box-sizing: border-box;\n  min-width: 0;\n  max-width: 100%;\n  height: 100%;\n  padding: 0 var(--ds-control-padding-inline);\n  gap: var(--ds-control-gap);\n  border-radius: inherit;\n  color: inherit;\n  cursor: default;\n}\n\n.tag__button:disabled {\n  cursor: not-allowed;\n}\n\n.tag__button--expanded::after {\n  background: var(--ds-interaction-pressed);\n}\n\n/* Hover/press wash stays above the Tag's semantic background. */\n\n/* ── Icons ──────────────────────────────────────────────────────────────── */\n\n.tag__prefix-icon,\n.tag__suffix-icon {\n  position: relative;\n  z-index: 2;\n  display: inline-flex;\n  flex-shrink: 0;\n  width: var(--ds-control-icon);\n  height: var(--ds-control-icon);\n}\n","import { Component, Event, EventEmitter, Prop, h, Host } from '@stencil/core';\nimport { CONTROL_TEXT_VARIANT } from '../../utils';\n\nexport type TagIntent   = 'neutral' | 'brand' | 'ai' | 'negative' | 'warning' | 'caution' | 'positive';\nexport type TagContrast = 'strong' | 'bold' | 'medium' | 'faint';\nexport type TagSize     = 'md' | 'sm' | 'xs';\n\n/**\n * `ds-icon` size prop matching control-density icon metrics\n * (md→20 / sm→16 / xs→12 via `--dimension-iconography-*`).\n */\nconst ICON_SIZE: Record<TagSize, 'md' | 'sm' | 'xs'> = {\n  md: 'md',\n  sm: 'sm',\n  xs: 'xs',\n};\n\n@Component({\n  tag: 'ds-tag',\n  styleUrl: 'Tag.css',\n  scoped: true,\n})\nexport class Tag {\n  @Prop() label!: string;\n  /** Canonical icon name rendered before the visible label. */\n  @Prop() icon: string = '';\n  @Prop() intent: TagIntent = 'neutral';\n  @Prop() contrast: TagContrast = 'faint';\n  @Prop() size: TagSize = 'md';\n  @Prop() rounded: boolean = false;\n  @Prop() maxWidth: string | number | undefined;\n  /** Render a menu-trigger button with a fixed ChevronUpDown suffix. */\n  @Prop() interactive: boolean = false;\n  /** Controlled open state for the menu triggered by an interactive Tag. */\n  @Prop() expanded: boolean = false;\n  /** ID of the menu controlled by an interactive Tag. */\n  @Prop() ariaControls: string | undefined;\n  /** Disable an interactive Tag and apply the shared inactive treatment. */\n  @Prop() isInactive: boolean = false;\n\n  /** Fired when the interactive Tag button is activated. */\n  @Event() dsClick!: EventEmitter<MouseEvent>;\n\n  private handleClick = (event: MouseEvent) => {\n    if (!this.interactive || this.isInactive) return;\n    this.dsClick.emit(event);\n  };\n\n  render() {\n    const textVariant = CONTROL_TEXT_VARIANT[this.size];\n    const iconSize = ICON_SIZE[this.size];\n\n    const maxWidthStyle = this.maxWidth != null\n      ? { maxWidth: typeof this.maxWidth === 'number' ? `${this.maxWidth}px` : this.maxWidth }\n      : undefined;\n    const hostClass = {\n      'tag': true,\n      [`tag--intent-${this.intent}`]: true,\n      [`tag--contrast-${this.contrast}`]: true,\n      [`tag--size-${this.size}`]: true,\n      'ds-control--md': this.size === 'md',\n      'ds-control--sm': this.size === 'sm',\n      'ds-control--xs': this.size === 'xs',\n      'tag--rounded': this.rounded,\n      'tag--interactive': this.interactive,\n      'ds-control-inactive': this.interactive && this.isInactive,\n    };\n    const content = [\n      this.icon && (\n        <ds-icon\n          class=\"tag__prefix-icon\"\n          name={this.icon}\n          size={iconSize}\n          color=\"inherit\"\n        ></ds-icon>\n      ),\n      <ds-text class=\"tag__label\" as=\"span\" variant={textVariant} color=\"inherit\">\n        {this.label}\n      </ds-text>,\n    ];\n\n    if (!this.interactive) {\n      return <Host class={hostClass} style={maxWidthStyle}>{content}</Host>;\n    }\n\n    return (\n      <Host class={hostClass} style={maxWidthStyle}>\n        <button\n          type=\"button\"\n          class={{\n            'tag__button': true,\n            'tag__button--expanded': this.expanded,\n            'ds-interaction-fill': true,\n            'ds-focus-ring-inset': true,\n          }}\n          aria-haspopup=\"menu\"\n          aria-expanded={this.expanded ? 'true' : 'false'}\n          aria-controls={this.ariaControls}\n          disabled={this.isInactive || undefined}\n          onClick={this.handleClick}\n        >\n          {content}\n          <ds-icon\n            class=\"tag__suffix-icon\"\n            name=\"ChevronUpDown\"\n            size={iconSize}\n            color=\"inherit\"\n          ></ds-icon>\n        </button>\n      </Host>\n    );\n  }\n}\n"],"mappings":"yKAAA,MAAMA,EAAS,IAAM,04aCWrB,MAAMC,EAAiD,CACrDC,GAAI,KACJC,GAAI,KACJC,GAAI,M,MAQOC,EAAGC,EAAA,MAAAD,UAAAE,EALhB,WAAAC,CAAAC,G,2EAQUC,KAAAC,KAAe,GACfD,KAAAE,OAAoB,UACpBF,KAAAG,SAAwB,QACxBH,KAAAI,KAAgB,KAChBJ,KAAAK,QAAmB,MAGnBL,KAAAM,YAAuB,MAEvBN,KAAAO,SAAoB,MAIpBP,KAAAQ,WAAsB,MAKtBR,KAAAS,YAAeC,IACrB,IAAKV,KAAKM,aAAeN,KAAKQ,WAAY,OAC1CR,KAAKW,QAAQC,KAAKF,EAAM,CAmE3B,CAhEC,MAAAG,GACE,MAAMC,EAAcC,EAAqBf,KAAKI,MAC9C,MAAMY,EAAWzB,EAAUS,KAAKI,MAEhC,MAAMa,EAAgBjB,KAAKkB,UAAY,KACnC,CAAEA,gBAAiBlB,KAAKkB,WAAa,SAAW,GAAGlB,KAAKkB,aAAelB,KAAKkB,UAC5EC,UACJ,MAAMC,EAAY,CAChBC,IAAO,KACP,CAAC,eAAerB,KAAKE,UAAW,KAChC,CAAC,iBAAiBF,KAAKG,YAAa,KACpC,CAAC,aAAaH,KAAKI,QAAS,KAC5B,iBAAkBJ,KAAKI,OAAS,KAChC,iBAAkBJ,KAAKI,OAAS,KAChC,iBAAkBJ,KAAKI,OAAS,KAChC,eAAgBJ,KAAKK,QACrB,mBAAoBL,KAAKM,YACzB,sBAAuBN,KAAKM,aAAeN,KAAKQ,YAElD,MAAMc,EAAU,CACdtB,KAAKC,MACHsB,EAAA,WACEC,MAAM,mBACNC,KAAMzB,KAAKC,KACXG,KAAMY,EACNU,MAAM,YAGVH,EAAA,WAASC,MAAM,aAAaG,GAAG,OAAOC,QAASd,EAAaY,MAAM,WAC/D1B,KAAK6B,QAIV,IAAK7B,KAAKM,YAAa,CACrB,OAAOiB,EAACO,EAAI,CAACN,MAAOJ,EAAWW,MAAOd,GAAgBK,E,CAGxD,OACEC,EAACO,EAAI,CAACN,MAAOJ,EAAWW,MAAOd,GAC7BM,EAAA,UACES,KAAK,SACLR,MAAO,CACLS,YAAe,KACf,wBAAyBjC,KAAKO,SAC9B,sBAAuB,KACvB,sBAAuB,MACxB,gBACa,OAAM,gBACLP,KAAKO,SAAW,OAAS,QAAO,gBAChCP,KAAKkC,aACpBC,SAAUnC,KAAKQ,YAAcW,UAC7BiB,QAASpC,KAAKS,aAEba,EACDC,EAAA,WACEC,MAAM,mBACNC,KAAK,gBACLrB,KAAMY,EACNU,MAAM,a","ignoreList":[]}
+{"version":3,"names":["tagCss","ICON_SIZE","md","sm","xs","Tag","__stencil_proxyCustomElement","HTMLElement","constructor","registerHost","this","icon","intent","contrast","size","rounded","interactive","expanded","isInactive","handleClick","event","dsClick","emit","render","textVariant","CONTROL_TEXT_VARIANT","iconSize","maxWidthStyle","maxWidth","undefined","hostClass","tag","content","h","class","name","color","as","variant","label","Host","style","type","tag__button","ariaControls","disabled","onClick"],"sources":["src/wc/components/Tag/Tag.css?tag=ds-tag&encapsulation=scoped","src/wc/components/Tag/Tag.tsx"],"sourcesContent":["@import '../../utils/tag-chip.css';\n\n/* ── Intent × Contrast — strong ─────────────────────────────────────────── */\n\n:host(.tag--intent-neutral.tag--contrast-strong)  { background-color: var(--color-background-strong-neutral);  color: var(--color-foreground-medium-neutral);  }\n:host(.tag--intent-brand.tag--contrast-strong)    { background-color: var(--color-background-strong-brand);    color: var(--color-foreground-on-strong-background-primary); }\n:host(.tag--intent-ai.tag--contrast-strong)       { background-color: var(--color-background-strong-ai);       color: var(--color-foreground-medium-ai);       }\n:host(.tag--intent-negative.tag--contrast-strong) { background-color: var(--color-background-strong-negative); color: var(--color-foreground-medium-negative); }\n:host(.tag--intent-warning.tag--contrast-strong)  { background-color: var(--color-background-strong-warning);  color: var(--color-foreground-medium-warning);  }\n:host(.tag--intent-caution.tag--contrast-strong)  { background-color: var(--color-background-strong-caution);  color: var(--color-foreground-medium-caution);  }\n:host(.tag--intent-positive.tag--contrast-strong) { background-color: var(--color-background-strong-positive); color: var(--color-foreground-medium-positive); }\n\n/* ── Intent × Contrast — bold ───────────────────────────────────────────── */\n\n:host(.tag--intent-neutral.tag--contrast-bold)  { background-color: var(--color-background-bold-neutral);  color: var(--color-foreground-on-bold-background-primary); }\n:host(.tag--intent-brand.tag--contrast-bold)    { background-color: var(--color-background-bold-brand);    color: var(--color-foreground-on-bold-background-primary); }\n:host(.tag--intent-ai.tag--contrast-bold)       { background-color: var(--color-background-bold-ai);       color: var(--color-foreground-on-bold-background-primary); }\n:host(.tag--intent-negative.tag--contrast-bold) { background-color: var(--color-background-bold-negative); color: var(--color-foreground-on-bold-background-primary); }\n:host(.tag--intent-warning.tag--contrast-bold)  { background-color: var(--color-background-bold-warning);  color: var(--color-foreground-on-bold-background-primary); }\n:host(.tag--intent-caution.tag--contrast-bold)  { background-color: var(--color-background-bold-caution);  color: var(--color-foreground-on-bold-background-primary); }\n:host(.tag--intent-positive.tag--contrast-bold) { background-color: var(--color-background-bold-positive); color: var(--color-foreground-on-bold-background-primary); }\n\n/* ── Intent × Contrast — medium ─────────────────────────────────────────── */\n\n:host(.tag--intent-neutral.tag--contrast-medium)  { background-color: var(--color-background-medium-neutral);  color: var(--color-foreground-strong-neutral);  }\n:host(.tag--intent-brand.tag--contrast-medium)    { background-color: var(--color-background-medium-brand);    color: var(--color-foreground-on-medium-background-primary); }\n:host(.tag--intent-ai.tag--contrast-medium)       { background-color: var(--color-background-medium-ai);       color: var(--color-foreground-strong-ai);       }\n:host(.tag--intent-negative.tag--contrast-medium) { background-color: var(--color-background-medium-negative); color: var(--color-foreground-strong-negative); }\n:host(.tag--intent-warning.tag--contrast-medium)  { background-color: var(--color-background-medium-warning);  color: var(--color-foreground-strong-warning);  }\n:host(.tag--intent-caution.tag--contrast-medium)  { background-color: var(--color-background-medium-caution);  color: var(--color-foreground-strong-caution);  }\n:host(.tag--intent-positive.tag--contrast-medium) { background-color: var(--color-background-medium-positive); color: var(--color-foreground-strong-positive); }\n\n/* ── Intent × Contrast — faint ──────────────────────────────────────────── */\n\n:host(.tag--intent-neutral.tag--contrast-faint)  { background-color: var(--color-background-faint-neutral);  color: var(--color-foreground-bold-neutral);  }\n:host(.tag--intent-brand.tag--contrast-faint)    { background-color: var(--color-background-faint-brand);    color: var(--color-foreground-bold-brand);    }\n:host(.tag--intent-ai.tag--contrast-faint)       { background-color: var(--color-background-faint-ai);       color: var(--color-foreground-bold-ai);       }\n:host(.tag--intent-negative.tag--contrast-faint) { background-color: var(--color-background-faint-negative); color: var(--color-foreground-bold-negative); }\n:host(.tag--intent-warning.tag--contrast-faint)  { background-color: var(--color-background-faint-warning);  color: var(--color-foreground-bold-warning);  }\n:host(.tag--intent-caution.tag--contrast-faint)  { background-color: var(--color-background-faint-caution);  color: var(--color-foreground-bold-caution);  }\n:host(.tag--intent-positive.tag--contrast-faint) { background-color: var(--color-background-faint-positive); color: var(--color-foreground-bold-positive); }\n\n/* ── Interactive menu trigger ───────────────────────────────────────────── */\n\n:host(.tag--interactive) {\n  padding: 0;\n  gap: 0;\n}\n\n.tag__button {\n  all: unset;\n  position: relative;\n  z-index: 0;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  box-sizing: border-box;\n  min-width: 0;\n  max-width: 100%;\n  height: 100%;\n  padding: 0 var(--ds-control-padding-inline);\n  gap: var(--ds-control-gap);\n  border-radius: inherit;\n  color: inherit;\n  cursor: default;\n}\n\n.tag__button:disabled {\n  cursor: not-allowed;\n}\n\n.tag__button--expanded::after {\n  background: var(--ds-interaction-pressed);\n}\n\n/* Hover/press wash stays above the Tag's semantic background. */\n\n/* ── Icons ──────────────────────────────────────────────────────────────── */\n\n.tag__prefix-icon,\n.tag__suffix-icon {\n  position: relative;\n  z-index: 2;\n  display: inline-flex;\n  flex-shrink: 0;\n  width: var(--ds-control-icon);\n  height: var(--ds-control-icon);\n}\n","import { Component, Event, EventEmitter, Prop, h, Host } from '@stencil/core';\nimport { CONTROL_TEXT_VARIANT } from '../../utils';\n\nexport type TagIntent   = 'neutral' | 'brand' | 'ai' | 'negative' | 'warning' | 'caution' | 'positive';\nexport type TagContrast = 'strong' | 'bold' | 'medium' | 'faint';\nexport type TagSize     = 'md' | 'sm' | 'xs';\n\n/**\n * `ds-icon` size prop matching control-density icon metrics\n * (md→20 / sm→16 / xs→12 via `--dimension-iconography-*`).\n */\nconst ICON_SIZE: Record<TagSize, 'md' | 'sm' | 'xs'> = {\n  md: 'md',\n  sm: 'sm',\n  xs: 'xs',\n};\n\n@Component({\n  tag: 'ds-tag',\n  styleUrl: 'Tag.css',\n  scoped: true,\n})\nexport class Tag {\n  @Prop() label!: string;\n  /** Canonical icon name rendered before the visible label. */\n  @Prop() icon: string = '';\n  @Prop() intent: TagIntent = 'neutral';\n  @Prop() contrast: TagContrast = 'faint';\n  @Prop() size: TagSize = 'md';\n  @Prop() rounded: boolean = false;\n  @Prop() maxWidth: string | number | undefined;\n  /** Render a menu-trigger button with a fixed ChevronUpDown suffix. */\n  @Prop() interactive: boolean = false;\n  /** Controlled open state for the menu triggered by an interactive Tag. */\n  @Prop() expanded: boolean = false;\n  /** ID of the menu controlled by an interactive Tag. */\n  @Prop() ariaControls: string | undefined;\n  /** Disable an interactive Tag and apply the shared inactive treatment. */\n  @Prop() isInactive: boolean = false;\n\n  /** Fired when the interactive Tag button is activated. */\n  @Event() dsClick!: EventEmitter<MouseEvent>;\n\n  private handleClick = (event: MouseEvent) => {\n    if (!this.interactive || this.isInactive) return;\n    this.dsClick.emit(event);\n  };\n\n  render() {\n    const textVariant = CONTROL_TEXT_VARIANT[this.size];\n    const iconSize = ICON_SIZE[this.size];\n\n    const maxWidthStyle = this.maxWidth != null\n      ? { maxWidth: typeof this.maxWidth === 'number' ? `${this.maxWidth}px` : this.maxWidth }\n      : undefined;\n    const hostClass = {\n      'tag': true,\n      [`tag--intent-${this.intent}`]: true,\n      [`tag--contrast-${this.contrast}`]: true,\n      [`tag--size-${this.size}`]: true,\n      'ds-control--md': this.size === 'md',\n      'ds-control--sm': this.size === 'sm',\n      'ds-control--xs': this.size === 'xs',\n      'tag--rounded': this.rounded,\n      'tag--interactive': this.interactive,\n      'ds-control-inactive': this.interactive && this.isInactive,\n    };\n    const content = [\n      this.icon && (\n        <ds-icon\n          class=\"tag__prefix-icon\"\n          name={this.icon}\n          size={iconSize}\n          color=\"inherit\"\n        ></ds-icon>\n      ),\n      <ds-text class=\"tag__label\" as=\"span\" variant={textVariant} color=\"inherit\">\n        {this.label}\n      </ds-text>,\n    ];\n\n    if (!this.interactive) {\n      return <Host class={hostClass} style={maxWidthStyle}>{content}</Host>;\n    }\n\n    return (\n      <Host class={hostClass} style={maxWidthStyle}>\n        <button\n          type=\"button\"\n          class={{\n            'tag__button': true,\n            'tag__button--expanded': this.expanded,\n            'ds-interaction-fill': true,\n            'ds-focus-ring-inset': true,\n          }}\n          aria-haspopup=\"menu\"\n          aria-expanded={this.expanded ? 'true' : 'false'}\n          aria-controls={this.ariaControls}\n          disabled={this.isInactive || undefined}\n          onClick={this.handleClick}\n        >\n          {content}\n          <ds-icon\n            class=\"tag__suffix-icon\"\n            name=\"ChevronUpDown\"\n            size={iconSize}\n            color=\"inherit\"\n          ></ds-icon>\n        </button>\n      </Host>\n    );\n  }\n}\n"],"mappings":"yKAAA,MAAMA,EAAS,IAAM,m6aCWrB,MAAMC,EAAiD,CACrDC,GAAI,KACJC,GAAI,KACJC,GAAI,M,MAQOC,EAAGC,EAAA,MAAAD,UAAAE,EALhB,WAAAC,CAAAC,G,2EAQUC,KAAAC,KAAe,GACfD,KAAAE,OAAoB,UACpBF,KAAAG,SAAwB,QACxBH,KAAAI,KAAgB,KAChBJ,KAAAK,QAAmB,MAGnBL,KAAAM,YAAuB,MAEvBN,KAAAO,SAAoB,MAIpBP,KAAAQ,WAAsB,MAKtBR,KAAAS,YAAeC,IACrB,IAAKV,KAAKM,aAAeN,KAAKQ,WAAY,OAC1CR,KAAKW,QAAQC,KAAKF,EAAM,CAmE3B,CAhEC,MAAAG,GACE,MAAMC,EAAcC,EAAqBf,KAAKI,MAC9C,MAAMY,EAAWzB,EAAUS,KAAKI,MAEhC,MAAMa,EAAgBjB,KAAKkB,UAAY,KACnC,CAAEA,gBAAiBlB,KAAKkB,WAAa,SAAW,GAAGlB,KAAKkB,aAAelB,KAAKkB,UAC5EC,UACJ,MAAMC,EAAY,CAChBC,IAAO,KACP,CAAC,eAAerB,KAAKE,UAAW,KAChC,CAAC,iBAAiBF,KAAKG,YAAa,KACpC,CAAC,aAAaH,KAAKI,QAAS,KAC5B,iBAAkBJ,KAAKI,OAAS,KAChC,iBAAkBJ,KAAKI,OAAS,KAChC,iBAAkBJ,KAAKI,OAAS,KAChC,eAAgBJ,KAAKK,QACrB,mBAAoBL,KAAKM,YACzB,sBAAuBN,KAAKM,aAAeN,KAAKQ,YAElD,MAAMc,EAAU,CACdtB,KAAKC,MACHsB,EAAA,WACEC,MAAM,mBACNC,KAAMzB,KAAKC,KACXG,KAAMY,EACNU,MAAM,YAGVH,EAAA,WAASC,MAAM,aAAaG,GAAG,OAAOC,QAASd,EAAaY,MAAM,WAC/D1B,KAAK6B,QAIV,IAAK7B,KAAKM,YAAa,CACrB,OAAOiB,EAACO,EAAI,CAACN,MAAOJ,EAAWW,MAAOd,GAAgBK,E,CAGxD,OACEC,EAACO,EAAI,CAACN,MAAOJ,EAAWW,MAAOd,GAC7BM,EAAA,UACES,KAAK,SACLR,MAAO,CACLS,YAAe,KACf,wBAAyBjC,KAAKO,SAC9B,sBAAuB,KACvB,sBAAuB,MACxB,gBACa,OAAM,gBACLP,KAAKO,SAAW,OAAS,QAAO,gBAChCP,KAAKkC,aACpBC,SAAUnC,KAAKQ,YAAcW,UAC7BiB,QAASpC,KAAKS,aAEba,EACDC,EAAA,WACEC,MAAM,mBACNC,KAAK,gBACLrB,KAAMY,EACNU,MAAM,a","ignoreList":[]}

package/dist/components/ds-toast.js

@@ -1,2 +1,2 @@
-import{p as t,H as s,c as i,h as e,a as n,t as o}from"./index.js";import{c as a}from"./p-BX0BMhgz.js";import{d as r}from"./p-BsoqsbBh.js";import{d as h}from"./p-DsiCDzoF.js";import{d as c}from"./p-BAfG3M8z.js";import{d}from"./p-Ca-I2UnB.js";import{d as l}from"./p-Ay1AX7Ql.js";import{T as f}from"./p-C4uYvyq6.js";import{r as u,a as m}from"./p-B6Vuayt6.js";import{r as p}from"./p-BJMRBHKW.js";function v(t,s){const i=typeof t==="function"?t(s):t;return typeof i==="string"?{description:i}:i}class g{constructor(){this.records=[];this.listeners=new Set;this.nextId=0}add(t){const s=t.id||`ds-toast-${++this.nextId}`;const i=this.records.findIndex((t=>t.id===s));if(!t.title?.trim()&&!t.description?.trim()){console.warn(`[ds-toast] Toast "${s}" should provide a title or description.`)}if(i>=0){const e=this.records[i];const n={...e,...t,id:s,priority:t.priority??e.priority,transitionStatus:"active",closeReason:undefined,updateKey:e.updateKey+1,timerKey:e.timerKey+1};this.records=[n,...this.records.filter(((t,s)=>s!==i))];this.emit();return s}const e={...t,id:s,priority:t.priority??"low",transitionStatus:"starting",updateKey:0,timerKey:0};this.records=[e,...this.records];this.emit();return s}update(t,s){const i=this.records.findIndex((s=>s.id===t));if(i<0)return;const e=this.records[i];const n=Object.prototype.hasOwnProperty.call(s,"timeout")||e.type==="loading"&&s.type!==undefined&&s.type!=="loading";const o={...e,...s,id:t,priority:s.priority??e.priority,updateKey:e.updateKey+1,timerKey:n?e.timerKey+1:e.timerKey};this.records=this.records.map(((t,s)=>s===i?o:t));this.emit()}close(t,s="programmatic"){const i=this.records.findIndex((s=>s.id===t));if(i<0||this.records[i].transitionStatus==="ending")return;const e={...this.records[i],transitionStatus:"ending",closeReason:s};this.records=this.records.map(((t,s)=>s===i?e:t));this.emit();e.onClose?.({id:t,reason:s,toast:e})}closeAll(t="programmatic"){for(const s of[...this.records])this.close(s.id,t)}async promise(t,s){const i=v(s.loading,undefined);const e=this.add({...i,type:i.type??"loading",timeout:0});try{const i=await t;const n=v(s.success,i);this.update(e,{...n,type:n.type??"success",timeout:n.timeout});return i}catch(t){const i=v(s.error,t);this.update(e,{...i,type:i.type??"error",timeout:i.timeout});throw t}}subscribe(t){this.listeners.add(t);t(this.getSnapshot());return()=>{this.listeners.delete(t)}}getSnapshot(){return this.records.map((t=>({...t})))}activate(t){const s=this.records.find((s=>s.id===t));if(!s||s.transitionStatus!=="starting")return;this.records=this.records.map((s=>s.id===t?{...s,transitionStatus:"active"}:s));this.emit()}remove(t){const s=this.records.find((s=>s.id===t));if(!s||s.transitionStatus!=="ending")return null;const i=s.closeReason??"programmatic";this.records=this.records.filter((s=>s.id!==t));this.emit();const e={id:t,reason:i,toast:s};return e}notifyRemove(t){const{toast:s}=t;s.onRemove?.(t)}emit(){const t=this.getSnapshot();for(const s of this.listeners)s(t)}}function w(){return new g}const b=Symbol.for("@ds-mo/ui/default-toast-manager");const y=globalThis;const x=y[b];const M=x??w();if(!x)y[b]=M;const T=()=>`.ds-visually-hidden.sc-ds-toast-h,.ds-visually-hidden.sc-ds-toast{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0, 0, 0, 0);white-space:nowrap;border:0}.sc-ds-toast-h{display:contents}.toast-region.sc-ds-toast{position:fixed;inset:0;z-index:var(--dimension-z-index-floating);pointer-events:none;outline:none}.toast-viewport.sc-ds-toast{position:absolute;right:var(--dimension-space-200);bottom:var(--dimension-space-200);display:grid;width:min(     var(--dimension-card-width-sm),     calc(100vw - 2 * var(--dimension-space-200))   )}@media (max-width: 767px){[avoid-mobile-shell-bar].sc-ds-toast-h .toast-viewport.sc-ds-toast{bottom:calc(       var(--dimension-space-200) +       var(--dimension-stroke-width-012) +       var(--dimension-space-100) +       var(--dimension-size-500) +       max(var(--dimension-space-100), env(safe-area-inset-bottom))     )}}.toast-positioner.sc-ds-toast{grid-area:1 / 1;align-self:end;justify-self:center;width:100%;pointer-events:auto;transform:translateY(     calc(-1 * var(--toast-index) * var(--dimension-space-100))   );transition:transform var(--effect-motion-short-3),     width var(--effect-motion-short-3)}.toast-viewport.sc-ds-toast:not([data-expanded]) .toast-positioner.sc-ds-toast{width:calc(     100% - 2 * var(--toast-index) * var(--dimension-space-100)   )}.toast-viewport[data-expanded].sc-ds-toast .toast-positioner.sc-ds-toast{transform:translateY(calc(-1 * var(--toast-offset-y)))}.toast-positioner[data-limited].sc-ds-toast{visibility:hidden;pointer-events:none}.toast-positioner--anchored.sc-ds-toast{position:fixed;width:min(     var(--dimension-card-width-sm),     calc(100vw - 2 * var(--dimension-space-200))   );transform:none}.toast-positioner--anchored[data-positioned='false'].sc-ds-toast{visibility:hidden}.toast-surface.sc-ds-toast{position:relative;display:block;box-sizing:border-box;width:100%;height:var(--toast-height, auto);padding:var(--dimension-space-200);overflow:hidden;color:var(--color-foreground-primary);background-color:var(--color-background-primary);border-radius:var(--dimension-radius-050);box-shadow:var(--effect-elevation-elevated-floating);transform:translate(     var(--toast-swipe-movement-x),     var(--toast-swipe-movement-y)   );animation:toast-enter var(--effect-motion-short-2) both}.toast-positioner--ending.sc-ds-toast .toast-surface.sc-ds-toast{animation:toast-exit var(--effect-motion-short-3) both}.toast-surface--swiping.sc-ds-toast{transition:none;user-select:none}.toast-content.sc-ds-toast{display:flex;flex-direction:column;min-width:0;padding-inline-end:var(--dimension-size-500);transition:opacity var(--effect-motion-short-3)}.toast-copy.sc-ds-toast{display:flex;flex-direction:column;min-width:0;min-height:var(--typography-lineheight-md);margin-block:calc(-1 * var(--dimension-space-025));gap:var(--dimension-space-050)}.toast-title.sc-ds-toast,.toast-description.sc-ds-toast{min-width:0}.toast-action.sc-ds-toast{align-self:start;margin-top:calc(     var(--dimension-space-200) + var(--dimension-space-025)   )}.toast-close.sc-ds-toast{position:absolute;top:var(--dimension-space-100);right:var(--dimension-space-100);transition:opacity var(--effect-motion-short-3)}.toast-viewport.sc-ds-toast:not([data-expanded]) .toast-positioner[data-behind].sc-ds-toast .toast-content.sc-ds-toast,.toast-viewport.sc-ds-toast:not([data-expanded]) .toast-positioner[data-behind].sc-ds-toast .toast-close.sc-ds-toast{opacity:0}@keyframes toast-enter{from{opacity:0;transform:translateY(var(--dimension-space-100))}to{opacity:1;transform:translateY(0)}}@keyframes toast-exit{from{opacity:1}to{opacity:0}}@media (prefers-reduced-motion: reduce){.toast-positioner.sc-ds-toast,.toast-surface.sc-ds-toast,.toast-content.sc-ds-toast,.toast-close.sc-ds-toast,.toast-positioner--ending.sc-ds-toast .toast-surface.sc-ds-toast{transition:none;animation:none}.toast-positioner--ending.sc-ds-toast .toast-surface.sc-ds-toast{opacity:0}}`;const A=40;const k=10;const C="__global-stack__";const P='button,a,input,textarea,select,[role="button"],[data-ds-toast-swipe-ignore]';const S=new WeakMap;const E=new Set;let F=null;let z=0;const D=t(class t extends s{constructor(t){super();if(t!==false){this.__registerHost()}this.dsToastClose=i(this,"dsToastClose");this.dsToastRemove=i(this,"dsToastRemove");this.dsToastAction=i(this,"dsToastAction");this.manager=M;this.limit=3;this.timeout=f.animationDelayLong2;this.label="Notifications";this.closeLabel="Close notification";this.avoidMobileShellBar=false;this.swipeDirections=["down","right"];this.records=[];this.expanded=false;this.keyboardActive=false;this.swipe=null;this.layoutVersion=0;this.instanceId=++z;this.domIds=new Map;this.timers=new Map;this.closeWatchdogs=new Map;this.closeFrames=new Map;this.closeEvents=new Set;this.activationFrames=new Map;this.pauseReasons=new Set;this.hoveredIds=new Set;this.heights=new Map;this.measuredUpdateKeys=new Map;this.anchoredPositions=new Map;this.dismissedSwipeDirections=new Map;this.observedElements=new Set;this.pendingRemovals=[];this.unsubscribe=null;this.attachedManager=null;this.previousFocus=null;this.resizeObserver=null;this.mutationObserver=null;this.layoutFrame=null;this.activeSwipe=null;this.nextDomId=0;this.connected=false;this.pendingHoverLeave=false;this.handleWindowBlur=()=>this.pauseTimers("window");this.handleWindowFocus=()=>this.resumeTimers("window");this.handleVisibilityChange=()=>{if(document.hidden)this.pauseTimers("document");else this.resumeTimers("document")};this.handleFocusIn=()=>{const t=document.activeElement;if(!(t instanceof s)||!t.matches(":focus-visible"))return;F=this;this.keyboardActive=true;this.expanded=true;this.pauseTimers("focus")};this.handleFocusOut=t=>{const s=t.relatedTarget;if(s instanceof Node&&this.el.contains(s))return;if(!this.keyboardActive)return;this.keyboardActive=false;this.expanded=this.hoveredIds.size>0;this.resumeTimers("focus")};this.handleDocumentKeyDown=t=>{if(t.key!=="F6")return;const s=Array.from(E).filter((t=>t.activeRecords.length>0));const i=F&&F.activeRecords.length?F:s[s.length-1];if(i!==this)return;t.preventDefault();if(!this.el.contains(document.activeElement)){this.previousFocus=document.activeElement}this.keyboardActive=true;this.regionElement?.focus()};this.handleRegionKeyDown=t=>{if(t.key==="Escape"){const s=t.target;const i=s.closest(".toast-positioner");const e=i?.dataset["toastId"]??this.activeRecords[0]?.id;if(e){t.preventDefault();this.manager.close(e,"escape")}return}if(t.key==="Tab"&&t.shiftKey&&t.target===this.regionElement){t.preventDefault();this.restorePreviousFocus()}};this.handleWindowResize=()=>{this.heights.clear();this.measuredUpdateKeys.clear();this.layoutVersion+=1;this.scheduleLayout()};this.scheduleLayout=()=>{if(this.layoutFrame!==null)return;this.layoutFrame=requestAnimationFrame((()=>{this.layoutFrame=null;this.measureLayout()}))}}connectedCallback(){this.connect()}componentDidLoad(){this.connect()}connect(){if(this.connected)return;this.connected=true;this.resizeObserver??(this.resizeObserver=new ResizeObserver((()=>this.scheduleLayout())));this.mutationObserver??(this.mutationObserver=new MutationObserver((()=>this.scheduleLayout())));this.mutationObserver.observe(document.body,{childList:true,subtree:true});if(!this.unsubscribe)this.attachManager(this.manager);window.addEventListener("blur",this.handleWindowBlur);window.addEventListener("focus",this.handleWindowFocus);window.addEventListener("resize",this.handleWindowResize);window.addEventListener("scroll",this.scheduleLayout,true);document.addEventListener("keydown",this.handleDocumentKeyDown);document.addEventListener("visibilitychange",this.handleVisibilityChange);E.add(this);if(!F)F=this}componentDidRender(){this.syncObservedElements();this.flushPendingRemovals();this.scheduleLayout()}disconnectedCallback(){this.connected=false;this.flushPendingRemovals();this.detachManager();this.resetManagerState();this.resizeObserver?.disconnect();this.resizeObserver=null;this.mutationObserver?.disconnect();this.mutationObserver=null;this.observedElements.clear();if(this.layoutFrame!==null)cancelAnimationFrame(this.layoutFrame);this.layoutFrame=null;window.removeEventListener("blur",this.handleWindowBlur);window.removeEventListener("focus",this.handleWindowFocus);window.removeEventListener("resize",this.handleWindowResize);window.removeEventListener("scroll",this.scheduleLayout,true);document.removeEventListener("keydown",this.handleDocumentKeyDown);document.removeEventListener("visibilitychange",this.handleVisibilityChange);E.delete(this);if(F===this){const t=Array.from(E);F=t[t.length-1]??null}}onManagerChange(t){this.detachManager();this.resetManagerState();if(this.connected)this.attachManager(t)}onTimeoutChange(){for(const t of this.timers.values()){if(t.handle)clearTimeout(t.handle)}this.timers.clear();this.syncTimers()}attachManager(t){const s=S.get(t);if(s&&s!==this){console.warn("[ds-toast] A manager can control only one connected ds-toast instance.");return}S.set(t,this);this.attachedManager=t;this.unsubscribe=t.subscribe((t=>{this.records=t;this.syncLifecycle(t);this.scheduleLayout()}))}detachManager(){this.unsubscribe?.();this.unsubscribe=null;if(this.attachedManager&&S.get(this.attachedManager)===this){S.delete(this.attachedManager)}this.attachedManager=null}resetManagerState(){this.flushPendingRemovals();if(this.el.contains(document.activeElement))this.restorePreviousFocus();this.clearAllTimers();for(const t of this.activationFrames.values())cancelAnimationFrame(t);for(const t of this.closeFrames.values())cancelAnimationFrame(t);this.activationFrames.clear();this.closeFrames.clear();this.closeEvents.clear();this.pauseReasons.clear();this.hoveredIds.clear();this.pendingHoverLeave=false;this.heights.clear();this.measuredUpdateKeys.clear();this.anchoredPositions.clear();this.dismissedSwipeDirections.clear();this.domIds.clear();this.activeSwipe=null;this.swipe=null;this.expanded=false;this.keyboardActive=false;this.records=[];this.resizeObserver?.disconnect();this.observedElements.clear()}syncObservedElements(){const t=new Set(this.el.querySelectorAll(".toast-positioner"));for(const s of this.records){if(!s.positioner)continue;const i=this.resolveAnchor(s.positioner.anchor);if(i)t.add(i)}for(const s of this.observedElements){if(!t.has(s)){this.resizeObserver?.unobserve(s);this.observedElements.delete(s)}}for(const s of t){if(this.observedElements.has(s))continue;this.resizeObserver?.observe(s);this.observedElements.add(s)}}flushPendingRemovals(){for(const t of this.pendingRemovals.splice(0)){t.manager.notifyRemove(t.context);this.dsToastRemove.emit({id:t.context.id,toast:t.context.toast})}}syncLifecycle(t){const s=new Set(t.map((t=>t.id)));for(const t of this.hoveredIds){if(t!==C&&!s.has(t))this.hoveredIds.delete(t)}const i=t.some((t=>t.transitionStatus==="ending"));if(this.pendingHoverLeave&&!i&&!this.hoveredIds.size){this.pendingHoverLeave=false;this.expanded=false;this.resumeTimers("hover")}else if(!this.hoveredIds.size&&!this.pendingHoverLeave){this.resumeTimers("hover")}for(const[t,i]of this.timers){if(s.has(t))continue;if(i.handle)clearTimeout(i.handle);this.timers.delete(t)}for(const[t,i]of this.closeWatchdogs){if(s.has(t))continue;clearTimeout(i);this.closeWatchdogs.delete(t)}for(const[t,i]of this.activationFrames){if(s.has(t))continue;cancelAnimationFrame(i);this.activationFrames.delete(t)}for(const[t,i]of this.closeFrames){if(s.has(t))continue;cancelAnimationFrame(i);this.closeFrames.delete(t)}for(const t of this.domIds.keys()){if(s.has(t))continue;this.closeEvents.delete(t);this.domIds.delete(t);this.heights.delete(t);this.measuredUpdateKeys.delete(t);this.anchoredPositions.delete(t);this.dismissedSwipeDirections.delete(t)}for(const s of t){this.ensureDomId(s.id);if(s.transitionStatus==="starting"&&!this.activationFrames.has(s.id)){const t=this.attachedManager;const i=requestAnimationFrame((()=>{this.activationFrames.delete(s.id);t?.activate(s.id)}));this.activationFrames.set(s.id,i)}if(s.transitionStatus==="ending"){this.clearToastTimer(s.id);this.beginRemoval(s)}else{const t=this.closeWatchdogs.get(s.id);if(t)clearTimeout(t);this.closeWatchdogs.delete(s.id);const i=this.closeFrames.get(s.id);if(i)cancelAnimationFrame(i);this.closeFrames.delete(s.id);this.closeEvents.delete(s.id)}}this.syncTimers()}syncTimers(){const t=new Set;for(const s of this.records){if(s.transitionStatus!=="active")continue;t.add(s.id);const i=this.resolveToastTimeout(s);if(i<=0){this.clearToastTimer(s.id);continue}const e=this.timers.get(s.id);if(!e||e.timerKey!==s.timerKey){this.clearToastTimer(s.id);this.timers.set(s.id,{timerKey:s.timerKey,remaining:i,startedAt:0,handle:null})}if(!this.isPaused)this.startToastTimer(s.id)}for(const s of this.timers.keys()){if(!t.has(s))this.clearToastTimer(s)}}resolveToastTimeout(t){const s=t.timeout??this.timeout;if(typeof s==="number")return Math.max(0,s);return u(s,f.animationDelayLong2)}startToastTimer(t){const s=this.timers.get(t);if(!s||s.handle||s.remaining<=0)return;s.startedAt=Date.now();s.handle=setTimeout((()=>{s.handle=null;s.remaining=0;this.manager.close(t,"timeout")}),s.remaining)}pauseTimers(t){const s=this.isPaused;this.pauseReasons.add(t);if(s)return;const i=Date.now();for(const t of this.timers.values()){if(!t.handle)continue;clearTimeout(t.handle);t.handle=null;t.remaining=Math.max(0,t.remaining-(i-t.startedAt))}}resumeTimers(t){this.pauseReasons.delete(t);if(this.isPaused)return;for(const t of this.timers.keys())this.startToastTimer(t)}get isPaused(){return this.pauseReasons.size>0}clearToastTimer(t){const s=this.timers.get(t);if(s?.handle)clearTimeout(s.handle);this.timers.delete(t)}clearAllTimers(){for(const t of this.timers.values()){if(t.handle)clearTimeout(t.handle)}for(const t of this.closeWatchdogs.values())clearTimeout(t);this.timers.clear();this.closeWatchdogs.clear()}beginRemoval(t){if(!this.closeEvents.has(t.id)){this.closeEvents.add(t.id);this.dsToastClose.emit({id:t.id,reason:t.closeReason??"programmatic",toast:t});this.moveFocusAfterClose(t.id)}if(this.closeWatchdogs.has(t.id)||this.closeFrames.has(t.id))return;const s=m(f.motionShort3,f.animationDurationShort3);if(s<=0){queueMicrotask((()=>this.completeRemoval(t)));return}const i=requestAnimationFrame((()=>{this.closeFrames.delete(t.id);const i=this.records.find((s=>s.id===t.id));if(!i||i.transitionStatus!=="ending")return;this.closeWatchdogs.set(t.id,setTimeout((()=>this.completeRemoval(i)),s))}));this.closeFrames.set(t.id,i)}completeRemoval(t){const s=this.records.find((s=>s.id===t.id));if(!s||s.transitionStatus!=="ending")return;const i=this.closeWatchdogs.get(t.id);if(i)clearTimeout(i);this.closeWatchdogs.delete(t.id);const e=this.closeFrames.get(t.id);if(e)cancelAnimationFrame(e);this.closeFrames.delete(t.id);const n=this.attachedManager;const o=n?.remove(t.id);if(n&&o)this.pendingRemovals.push({manager:n,context:o})}handleAnimationComplete(t){if(t.transitionStatus==="ending")this.completeRemoval(t)}bindAnimationCancel(t,s){if(!t||t.dataset["cancelBound"]==="true")return;t.dataset["cancelBound"]="true";t.addEventListener("animationcancel",(()=>{const t=this.records.find((t=>t.id===s));if(t)this.handleAnimationComplete(t)}))}handlePointerEnter(t){F=this;this.pendingHoverLeave=false;this.hoveredIds.add(t);this.expanded=true;this.pauseTimers("hover")}handlePointerLeave(t){this.hoveredIds.delete(t);if(this.hoveredIds.size)return;if(this.records.some((t=>t.transitionStatus==="ending"))){this.pendingHoverLeave=true;return}this.expanded=false;this.resumeTimers("hover")}get regionElement(){return this.el.querySelector(".toast-region")}restorePreviousFocus(){this.previousFocus?.focus?.();this.previousFocus=null;this.keyboardActive=false}moveFocusAfterClose(t){const s=document.activeElement;const i=this.positionerElement(t);if(!s||!i?.contains(s))return;requestAnimationFrame((()=>{const s=this.activeRecords.find((s=>s.id!==t));const i=s?this.positionerElement(s.id)?.querySelector("ds-button-unfilled"):null;if(i?.setFocus)void i.setFocus();else if(s)this.regionElement?.focus();else this.restorePreviousFocus()}))}handleAction(t,s){const i={id:t.id,toast:t,originalEvent:s.detail};this.dsToastAction.emit(i);t.action?.onAction?.({id:t.id,data:t.data,manager:this.manager,originalEvent:s.detail})}handlePointerDown(t,s){if(s.button!==0)return;const i=s.target;if(i.closest(P))return;const e=s.currentTarget;e.setPointerCapture(s.pointerId);this.activeSwipe={id:t.id,pointerId:s.pointerId,pointerType:s.pointerType,startX:s.clientX,startY:s.clientY,maxDistance:0,cancelled:false,axis:null};this.swipe={id:t.id,x:0,y:0};if(s.pointerType==="touch")this.pauseTimers("swipe")}handlePointerMove(t){const s=this.activeSwipe;if(!s||s.pointerId!==t.pointerId||s.cancelled)return;const i=t.clientX-s.startX;const e=t.clientY-s.startY;if(!s.axis&&Math.max(Math.abs(i),Math.abs(e))>1){s.axis=Math.abs(i)>=Math.abs(e)?"x":"y"}if(!s.axis)return;const n=s.axis==="x";const o=n?i>=0?"right":"left":e>=0?"down":"up";const a=this.swipeDirections.includes(o);const r=n?Math.abs(i):Math.abs(e);const h=a?r:Math.sqrt(r);const c=(n?i:e)<0?-h:h;const d=n?c:0;const l=n?0:c;if(s.maxDistance-h>=k){s.cancelled=true;this.cancelSwipe();return}s.maxDistance=Math.max(s.maxDistance,h);if(r>1)t.preventDefault();this.swipe={id:s.id,x:d,y:l,direction:a?o:undefined}}handlePointerUp(t){const s=this.activeSwipe;if(!s||s.pointerId!==t.pointerId)return;const i=this.swipe;const e=i?Math.max(Math.abs(i.x),Math.abs(i.y)):0;const n=!s.cancelled&&!!i?.direction&&e>=A;const o=s.id;const a=s.pointerType==="touch";this.activeSwipe=null;this.swipe=null;if(a)this.resumeTimers("swipe");if(n&&i.direction){this.dismissedSwipeDirections.set(o,i.direction);this.manager.close(o,"swipe")}}handlePointerCancel(t){if(this.activeSwipe?.pointerId!==t.pointerId)return;this.cancelSwipe()}cancelSwipe(){const t=this.activeSwipe?.pointerType==="touch";this.activeSwipe=null;this.swipe=null;if(t)this.resumeTimers("swipe")}get touchAction(){const t=this.swipeDirections.includes("left")||this.swipeDirections.includes("right");const s=this.swipeDirections.includes("up")||this.swipeDirections.includes("down");if(t&&s)return"none";if(t)return"pan-y";if(s)return"pan-x";return"auto"}measureNaturalHeight(t,s){const i=t.querySelector(".toast-surface");if(!i)return 0;const e=t.style.width;const n=t.style.transition;const o=i.style.height;if(s){t.style.transition="none";t.style.width="100%"}i.style.height="auto";const a=i.getBoundingClientRect().height;i.style.height=o;if(s){t.style.width=e;t.getBoundingClientRect();t.style.transition=n}return a}measureLayout(){let t=false;for(const s of this.records){const i=this.positionerElement(s.id);if(!i)continue;let e=this.heights.get(s.id)??0;const n=e<=0||this.measuredUpdateKeys.get(s.id)!==s.updateKey;if(n){e=this.measureNaturalHeight(i,!s.positioner);if(e>0){if(this.heights.get(s.id)!==e)t=true;this.heights.set(s.id,e);this.measuredUpdateKeys.set(s.id,s.updateKey)}}if(!s.positioner)continue;const o=this.resolveAnchor(s.positioner.anchor);if(!o||e<=0){if(this.anchoredPositions.delete(s.id))t=true;continue}const r=i.getBoundingClientRect();const h=p(s.positioner.sideOffset,f.space050);const c=p(s.positioner.alignOffset,0);const d=a({anchorRect:o.getBoundingClientRect(),popupWidth:r.width,popupHeight:e,side:s.positioner.side??"top",align:s.positioner.align??"center",sideOffsetPx:h,alignOffsetPx:c,viewportPadPx:p(undefined,f.space200),viewportWidth:window.innerWidth,viewportHeight:window.innerHeight});const l=this.anchoredPositions.get(s.id);if(!l||l.x!==d.x||l.y!==d.y||l.side!==d.resolvedSide){this.anchoredPositions.set(s.id,{x:d.x,y:d.y,side:d.resolvedSide});t=true}}if(t)this.layoutVersion+=1}resolveAnchor(t){return typeof t==="string"?document.getElementById(t):t}positionerElement(t){return Array.from(this.el.querySelectorAll(".toast-positioner")).find((s=>s.dataset["toastId"]===t))??null}ensureDomId(t){const s=this.domIds.get(t);if(s)return s;const i=++this.nextDomId;this.domIds.set(t,i);return i}get activeRecords(){return this.records.filter((t=>t.transitionStatus!=="ending"))}globalLayout(){const t=this.records.filter((t=>!t.positioner));let s=0;let i=0;const e=p(undefined,f.space200);const n=new Map;t.forEach(((t,o)=>{if(t.transitionStatus==="ending"){n.set(t.id,{index:o,offset:s,limited:false});return}const a=i>=Math.max(1,this.limit);n.set(t.id,{index:i,offset:s,limited:a});s+=(this.heights.get(t.id)??0)+e;i+=1}));return n}renderToast(t,s){const i=this.ensureDomId(t.id);const n=`ds-toast-${this.instanceId}-${i}-title`;const o=`ds-toast-${this.instanceId}-${i}-description`;const a=this.swipe?.id===t.id?this.swipe:null;const r=a?.direction??this.dismissedSwipeDirections.get(t.id);const h=!!t.positioner;const c=this.anchoredPositions.get(t.id);const d=t.priority==="high"&&!this.keyboardActive;const l=this.keyboardActive&&!s.limited?0:-1;const f=this.heights.get(t.id);return e("div",{ref:s=>this.bindAnimationCancel(s,t.id),class:{"toast-positioner":true,"toast-positioner--anchored":h,"toast-positioner--ending":t.transitionStatus==="ending"},"data-toast-id":t.id,"data-behind":!h&&s.index>0?"":undefined,"data-limited":s.limited?"":undefined,"data-positioned":h?String(!!c):undefined,"data-side":c?.side,inert:s.limited?true:undefined,"aria-hidden":s.limited?"true":undefined,style:{"--toast-index":String(s.index),"--toast-offset-y":`${s.offset}px`,"--toast-height":f?`${f}px`:undefined,zIndex:String(this.records.length-s.index),left:c?`${c.x}px`:undefined,top:c?`${c.y}px`:undefined},onAnimationEnd:()=>this.handleAnimationComplete(t)},e("div",{class:{"toast-surface":true,"toast-surface--swiping":!!a},role:t.priority==="high"?"alertdialog":"dialog","aria-modal":"false","aria-labelledby":t.title?n:t.description?o:undefined,"aria-describedby":t.title&&t.description?o:undefined,"aria-hidden":d?"true":undefined,"data-type":t.type,"data-priority":t.priority,"data-transition-status":t.transitionStatus,"data-swiping":a?"":undefined,"data-swipe-direction":r,style:{"--toast-swipe-movement-x":`${a?.x??0}px`,"--toast-swipe-movement-y":`${a?.y??0}px`,touchAction:this.touchAction},onPointerDown:s=>this.handlePointerDown(t,s),onPointerMove:t=>this.handlePointerMove(t),onPointerUp:t=>this.handlePointerUp(t),onPointerCancel:t=>this.handlePointerCancel(t),onPointerEnter:h?()=>this.handlePointerEnter(t.id):undefined,onPointerLeave:h?()=>this.handlePointerLeave(t.id):undefined},e("div",{class:"toast-content"},e("div",{class:"toast-copy"},t.title&&e("ds-text",{class:"toast-title",as:"div",variant:"text-title-small",color:"primary",textId:n},t.title),t.description&&e("ds-text",{class:"toast-description",as:"div",variant:"text-body-medium",color:"secondary",textId:o},t.description)),t.action&&e("ds-button-unfilled",{class:"toast-action",variant:"label",size:"md",type:"button",label:t.action.label,"aria-label":t.action.ariaLabel,hasBorder:true,focusTabIndex:l,"aria-hidden":!this.keyboardActive?"true":undefined,onDsClick:s=>this.handleAction(t,s)})),e("ds-button-unfilled",{class:"toast-close",variant:"icon",size:"md",type:"button",icon:"Cross","aria-label":this.closeLabel,hasBorder:false,activeFill:false,focusTabIndex:l,"aria-hidden":!this.keyboardActive?"true":undefined,onDsClick:()=>this.manager.close(t.id,"close-button")})))}render(){const t=this.globalLayout();const s=this.records.filter((t=>!t.positioner));const i=this.records.filter((t=>!!t.positioner));const o=this.records.filter((s=>s.priority==="high"&&s.transitionStatus!=="ending"&&!t.get(s.id)?.limited));return e(n,{key:"98bbb1e259fd404c4014f4347baf66d3e3264036"},e("section",{key:"32538d32f6b047b683cfa847d8abd0693128178a",class:"toast-region",role:"region","aria-label":this.label,"aria-live":"polite","aria-atomic":"false","aria-relevant":"additions text",tabIndex:-1,onFocusin:this.handleFocusIn,onFocusout:t=>this.handleFocusOut(t),onKeyDown:t=>this.handleRegionKeyDown(t)},e("div",{key:"4fd080b798ba78d8de7149a467b336d00589ab62",class:"toast-viewport","data-expanded":this.expanded?"":undefined,onPointerEnter:()=>this.handlePointerEnter(C),onPointerLeave:()=>this.handlePointerLeave(C)},s.map((s=>this.renderToast(s,t.get(s.id)??{index:0,offset:0,limited:false})))),e("div",{key:"368f36b10e28257105350ecfcbfe4a2c0ed1e3eb",class:"toast-anchored-layer"},i.map((t=>this.renderToast(t,{index:0,offset:0,limited:false})))),e("div",{key:"551274399712ffcf031c87a1bf2dba9ad3a29f0f",class:"toast-assertive-announcer ds-visually-hidden"},o.map((t=>e("div",{role:"alert","aria-atomic":"true"},[t.title,t.description].filter(Boolean).join(". ")))))))}get el(){return this}static get watchers(){return{manager:[{onManagerChange:0}],timeout:[{onTimeoutChange:0}]}}static get style(){return T()}},[2,"ds-toast",{manager:[16],limit:[2],timeout:[8],label:[1],closeLabel:[1,"close-label"],avoidMobileShellBar:[516,"avoid-mobile-shell-bar"],swipeDirections:[16],records:[32],expanded:[32],keyboardActive:[32],swipe:[32],layoutVersion:[32]},undefined,{manager:[{onManagerChange:0}],timeout:[{onTimeoutChange:0}]}]);function B(){if(typeof customElements==="undefined"){return}const t=["ds-toast","ds-badge","ds-button-unfilled","ds-icon","ds-loader","ds-text"];t.forEach((t=>{switch(t){case"ds-toast":if(!customElements.get(o(t))){customElements.define(o(t),D)}break;case"ds-badge":if(!customElements.get(o(t))){r()}break;case"ds-button-unfilled":if(!customElements.get(o(t))){h()}break;case"ds-icon":if(!customElements.get(o(t))){c()}break;case"ds-loader":if(!customElements.get(o(t))){d()}break;case"ds-text":if(!customElements.get(o(t))){l()}break}}))}B();const j=D;const R=B;export{j as DsToast,R as defineCustomElement};
+import{p as t,H as s,c as i,h as e,a as n,t as o}from"./index.js";import{c as a}from"./p-BX0BMhgz.js";import{d as r}from"./p-BsoqsbBh.js";import{d as h}from"./p-eAfNzlMa.js";import{d as c}from"./p-BAfG3M8z.js";import{d}from"./p-Ca-I2UnB.js";import{d as l}from"./p-Ay1AX7Ql.js";import{T as f}from"./p-C4uYvyq6.js";import{r as u,a as m}from"./p-B6Vuayt6.js";import{r as p}from"./p-BJMRBHKW.js";function v(t,s){const i=typeof t==="function"?t(s):t;return typeof i==="string"?{description:i}:i}class g{constructor(){this.records=[];this.listeners=new Set;this.nextId=0}add(t){const s=t.id||`ds-toast-${++this.nextId}`;const i=this.records.findIndex((t=>t.id===s));if(!t.title?.trim()&&!t.description?.trim()){console.warn(`[ds-toast] Toast "${s}" should provide a title or description.`)}if(i>=0){const e=this.records[i];const n={...e,...t,id:s,priority:t.priority??e.priority,transitionStatus:"active",closeReason:undefined,updateKey:e.updateKey+1,timerKey:e.timerKey+1};this.records=[n,...this.records.filter(((t,s)=>s!==i))];this.emit();return s}const e={...t,id:s,priority:t.priority??"low",transitionStatus:"starting",updateKey:0,timerKey:0};this.records=[e,...this.records];this.emit();return s}update(t,s){const i=this.records.findIndex((s=>s.id===t));if(i<0)return;const e=this.records[i];const n=Object.prototype.hasOwnProperty.call(s,"timeout")||e.type==="loading"&&s.type!==undefined&&s.type!=="loading";const o={...e,...s,id:t,priority:s.priority??e.priority,updateKey:e.updateKey+1,timerKey:n?e.timerKey+1:e.timerKey};this.records=this.records.map(((t,s)=>s===i?o:t));this.emit()}close(t,s="programmatic"){const i=this.records.findIndex((s=>s.id===t));if(i<0||this.records[i].transitionStatus==="ending")return;const e={...this.records[i],transitionStatus:"ending",closeReason:s};this.records=this.records.map(((t,s)=>s===i?e:t));this.emit();e.onClose?.({id:t,reason:s,toast:e})}closeAll(t="programmatic"){for(const s of[...this.records])this.close(s.id,t)}async promise(t,s){const i=v(s.loading,undefined);const e=this.add({...i,type:i.type??"loading",timeout:0});try{const i=await t;const n=v(s.success,i);this.update(e,{...n,type:n.type??"success",timeout:n.timeout});return i}catch(t){const i=v(s.error,t);this.update(e,{...i,type:i.type??"error",timeout:i.timeout});throw t}}subscribe(t){this.listeners.add(t);t(this.getSnapshot());return()=>{this.listeners.delete(t)}}getSnapshot(){return this.records.map((t=>({...t})))}activate(t){const s=this.records.find((s=>s.id===t));if(!s||s.transitionStatus!=="starting")return;this.records=this.records.map((s=>s.id===t?{...s,transitionStatus:"active"}:s));this.emit()}remove(t){const s=this.records.find((s=>s.id===t));if(!s||s.transitionStatus!=="ending")return null;const i=s.closeReason??"programmatic";this.records=this.records.filter((s=>s.id!==t));this.emit();const e={id:t,reason:i,toast:s};return e}notifyRemove(t){const{toast:s}=t;s.onRemove?.(t)}emit(){const t=this.getSnapshot();for(const s of this.listeners)s(t)}}function w(){return new g}const b=Symbol.for("@ds-mo/ui/default-toast-manager");const y=globalThis;const x=y[b];const M=x??w();if(!x)y[b]=M;const T=()=>`.ds-visually-hidden.sc-ds-toast-h,.ds-visually-hidden.sc-ds-toast{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0, 0, 0, 0);white-space:nowrap;border:0}.sc-ds-toast-h{display:contents}.toast-region.sc-ds-toast{position:fixed;inset:0;z-index:var(--dimension-z-index-floating);pointer-events:none;outline:none}.toast-viewport.sc-ds-toast{position:absolute;right:var(--dimension-space-200);bottom:var(--dimension-space-200);display:grid;width:min(     var(--dimension-card-width-sm),     calc(100vw - 2 * var(--dimension-space-200))   )}@media (max-width: 767px){[avoid-mobile-shell-bar].sc-ds-toast-h .toast-viewport.sc-ds-toast{bottom:calc(       var(--dimension-space-200) +       var(--dimension-stroke-width-012) +       var(--dimension-space-100) +       var(--dimension-size-500) +       max(var(--dimension-space-100), env(safe-area-inset-bottom))     )}}.toast-positioner.sc-ds-toast{grid-area:1 / 1;align-self:end;justify-self:center;width:100%;pointer-events:auto;transform:translateY(     calc(-1 * var(--toast-index) * var(--dimension-space-100))   );transition:transform var(--effect-motion-short-3),     width var(--effect-motion-short-3)}.toast-viewport.sc-ds-toast:not([data-expanded]) .toast-positioner.sc-ds-toast{width:calc(     100% - 2 * var(--toast-index) * var(--dimension-space-100)   )}.toast-viewport[data-expanded].sc-ds-toast .toast-positioner.sc-ds-toast{transform:translateY(calc(-1 * var(--toast-offset-y)))}.toast-positioner[data-limited].sc-ds-toast{visibility:hidden;pointer-events:none}.toast-positioner--anchored.sc-ds-toast{position:fixed;width:min(     var(--dimension-card-width-sm),     calc(100vw - 2 * var(--dimension-space-200))   );transform:none}.toast-positioner--anchored[data-positioned='false'].sc-ds-toast{visibility:hidden}.toast-surface.sc-ds-toast{position:relative;display:block;box-sizing:border-box;width:100%;height:var(--toast-height, auto);padding:var(--dimension-space-200);overflow:hidden;color:var(--color-foreground-primary);background-color:var(--color-background-primary);border-radius:var(--dimension-radius-050);box-shadow:var(--effect-elevation-elevated-floating);transform:translate(     var(--toast-swipe-movement-x),     var(--toast-swipe-movement-y)   );animation:toast-enter var(--effect-motion-short-2) both}.toast-positioner--ending.sc-ds-toast .toast-surface.sc-ds-toast{animation:toast-exit var(--effect-motion-short-3) both}.toast-surface--swiping.sc-ds-toast{transition:none;user-select:none}.toast-content.sc-ds-toast{display:flex;flex-direction:column;min-width:0;padding-inline-end:var(--dimension-size-500);transition:opacity var(--effect-motion-short-3)}.toast-copy.sc-ds-toast{display:flex;flex-direction:column;min-width:0;min-height:var(--typography-lineheight-md);margin-block:calc(-1 * var(--dimension-space-025));gap:var(--dimension-space-050)}.toast-title.sc-ds-toast,.toast-description.sc-ds-toast{min-width:0}.toast-action.sc-ds-toast{align-self:start;margin-top:calc(     var(--dimension-space-200) + var(--dimension-space-025)   )}.toast-close.sc-ds-toast{position:absolute;top:var(--dimension-space-100);right:var(--dimension-space-100);transition:opacity var(--effect-motion-short-3)}.toast-viewport.sc-ds-toast:not([data-expanded]) .toast-positioner[data-behind].sc-ds-toast .toast-content.sc-ds-toast,.toast-viewport.sc-ds-toast:not([data-expanded]) .toast-positioner[data-behind].sc-ds-toast .toast-close.sc-ds-toast{opacity:0}@keyframes toast-enter{from{opacity:0;transform:translateY(var(--dimension-space-100))}to{opacity:1;transform:translateY(0)}}@keyframes toast-exit{from{opacity:1}to{opacity:0}}@media (prefers-reduced-motion: reduce){.toast-positioner.sc-ds-toast,.toast-surface.sc-ds-toast,.toast-content.sc-ds-toast,.toast-close.sc-ds-toast,.toast-positioner--ending.sc-ds-toast .toast-surface.sc-ds-toast{transition:none;animation:none}.toast-positioner--ending.sc-ds-toast .toast-surface.sc-ds-toast{opacity:0}}`;const A=40;const k=10;const P="__global-stack__";const S='button,a,input,textarea,select,[role="button"],[data-ds-toast-swipe-ignore]';const C=new WeakMap;const E=new Set;let F=null;let z=0;const B=t(class t extends s{constructor(t){super();if(t!==false){this.__registerHost()}this.dsToastClose=i(this,"dsToastClose");this.dsToastRemove=i(this,"dsToastRemove");this.dsToastAction=i(this,"dsToastAction");this.manager=M;this.limit=3;this.timeout=f.animationDelayLong2;this.label="Notifications";this.closeLabel="Close notification";this.avoidMobileShellBar=false;this.swipeDirections=["down","right"];this.records=[];this.expanded=false;this.keyboardActive=false;this.swipe=null;this.layoutVersion=0;this.instanceId=++z;this.domIds=new Map;this.timers=new Map;this.closeWatchdogs=new Map;this.closeFrames=new Map;this.closeEvents=new Set;this.activationFrames=new Map;this.pauseReasons=new Set;this.hoveredIds=new Set;this.heights=new Map;this.measuredUpdateKeys=new Map;this.anchoredPositions=new Map;this.dismissedSwipeDirections=new Map;this.observedElements=new Set;this.pendingRemovals=[];this.unsubscribe=null;this.attachedManager=null;this.previousFocus=null;this.resizeObserver=null;this.mutationObserver=null;this.layoutFrame=null;this.activeSwipe=null;this.nextDomId=0;this.connected=false;this.pendingHoverLeave=false;this.handleWindowBlur=()=>this.pauseTimers("window");this.handleWindowFocus=()=>this.resumeTimers("window");this.handleVisibilityChange=()=>{if(document.hidden)this.pauseTimers("document");else this.resumeTimers("document")};this.handleFocusIn=()=>{const t=document.activeElement;if(!(t instanceof s)||!t.matches(":focus-visible"))return;F=this;this.keyboardActive=true;this.expanded=true;this.pauseTimers("focus")};this.handleFocusOut=t=>{const s=t.relatedTarget;if(s instanceof Node&&this.el.contains(s))return;if(!this.keyboardActive)return;this.keyboardActive=false;this.expanded=this.hoveredIds.size>0;this.resumeTimers("focus")};this.handleDocumentKeyDown=t=>{if(t.key!=="F6")return;const s=Array.from(E).filter((t=>t.activeRecords.length>0));const i=F&&F.activeRecords.length?F:s[s.length-1];if(i!==this)return;t.preventDefault();if(!this.el.contains(document.activeElement)){this.previousFocus=document.activeElement}this.keyboardActive=true;this.regionElement?.focus()};this.handleRegionKeyDown=t=>{if(t.key==="Escape"){const s=t.target;const i=s.closest(".toast-positioner");const e=i?.dataset["toastId"]??this.activeRecords[0]?.id;if(e){t.preventDefault();this.manager.close(e,"escape")}return}if(t.key==="Tab"&&t.shiftKey&&t.target===this.regionElement){t.preventDefault();this.restorePreviousFocus()}};this.handleWindowResize=()=>{this.heights.clear();this.measuredUpdateKeys.clear();this.layoutVersion+=1;this.scheduleLayout()};this.scheduleLayout=()=>{if(this.layoutFrame!==null)return;this.layoutFrame=requestAnimationFrame((()=>{this.layoutFrame=null;this.measureLayout()}))}}connectedCallback(){this.connect()}componentDidLoad(){this.connect()}connect(){if(this.connected)return;this.connected=true;this.resizeObserver??(this.resizeObserver=new ResizeObserver((()=>this.scheduleLayout())));this.mutationObserver??(this.mutationObserver=new MutationObserver((()=>this.scheduleLayout())));this.mutationObserver.observe(document.body,{childList:true,subtree:true});if(!this.unsubscribe)this.attachManager(this.manager);window.addEventListener("blur",this.handleWindowBlur);window.addEventListener("focus",this.handleWindowFocus);window.addEventListener("resize",this.handleWindowResize);window.addEventListener("scroll",this.scheduleLayout,true);document.addEventListener("keydown",this.handleDocumentKeyDown);document.addEventListener("visibilitychange",this.handleVisibilityChange);E.add(this);if(!F)F=this}componentDidRender(){this.syncObservedElements();this.flushPendingRemovals();this.scheduleLayout()}disconnectedCallback(){this.connected=false;this.flushPendingRemovals();this.detachManager();this.resetManagerState();this.resizeObserver?.disconnect();this.resizeObserver=null;this.mutationObserver?.disconnect();this.mutationObserver=null;this.observedElements.clear();if(this.layoutFrame!==null)cancelAnimationFrame(this.layoutFrame);this.layoutFrame=null;window.removeEventListener("blur",this.handleWindowBlur);window.removeEventListener("focus",this.handleWindowFocus);window.removeEventListener("resize",this.handleWindowResize);window.removeEventListener("scroll",this.scheduleLayout,true);document.removeEventListener("keydown",this.handleDocumentKeyDown);document.removeEventListener("visibilitychange",this.handleVisibilityChange);E.delete(this);if(F===this){const t=Array.from(E);F=t[t.length-1]??null}}onManagerChange(t){this.detachManager();this.resetManagerState();if(this.connected)this.attachManager(t)}onTimeoutChange(){for(const t of this.timers.values()){if(t.handle)clearTimeout(t.handle)}this.timers.clear();this.syncTimers()}attachManager(t){const s=C.get(t);if(s&&s!==this){console.warn("[ds-toast] A manager can control only one connected ds-toast instance.");return}C.set(t,this);this.attachedManager=t;this.unsubscribe=t.subscribe((t=>{this.records=t;this.syncLifecycle(t);this.scheduleLayout()}))}detachManager(){this.unsubscribe?.();this.unsubscribe=null;if(this.attachedManager&&C.get(this.attachedManager)===this){C.delete(this.attachedManager)}this.attachedManager=null}resetManagerState(){this.flushPendingRemovals();if(this.el.contains(document.activeElement))this.restorePreviousFocus();this.clearAllTimers();for(const t of this.activationFrames.values())cancelAnimationFrame(t);for(const t of this.closeFrames.values())cancelAnimationFrame(t);this.activationFrames.clear();this.closeFrames.clear();this.closeEvents.clear();this.pauseReasons.clear();this.hoveredIds.clear();this.pendingHoverLeave=false;this.heights.clear();this.measuredUpdateKeys.clear();this.anchoredPositions.clear();this.dismissedSwipeDirections.clear();this.domIds.clear();this.activeSwipe=null;this.swipe=null;this.expanded=false;this.keyboardActive=false;this.records=[];this.resizeObserver?.disconnect();this.observedElements.clear()}syncObservedElements(){const t=new Set(this.el.querySelectorAll(".toast-positioner"));for(const s of this.records){if(!s.positioner)continue;const i=this.resolveAnchor(s.positioner.anchor);if(i)t.add(i)}for(const s of this.observedElements){if(!t.has(s)){this.resizeObserver?.unobserve(s);this.observedElements.delete(s)}}for(const s of t){if(this.observedElements.has(s))continue;this.resizeObserver?.observe(s);this.observedElements.add(s)}}flushPendingRemovals(){for(const t of this.pendingRemovals.splice(0)){t.manager.notifyRemove(t.context);this.dsToastRemove.emit({id:t.context.id,toast:t.context.toast})}}syncLifecycle(t){const s=new Set(t.map((t=>t.id)));for(const t of this.hoveredIds){if(t!==P&&!s.has(t))this.hoveredIds.delete(t)}const i=t.some((t=>t.transitionStatus==="ending"));if(this.pendingHoverLeave&&!i&&!this.hoveredIds.size){this.pendingHoverLeave=false;this.expanded=false;this.resumeTimers("hover")}else if(!this.hoveredIds.size&&!this.pendingHoverLeave){this.resumeTimers("hover")}for(const[t,i]of this.timers){if(s.has(t))continue;if(i.handle)clearTimeout(i.handle);this.timers.delete(t)}for(const[t,i]of this.closeWatchdogs){if(s.has(t))continue;clearTimeout(i);this.closeWatchdogs.delete(t)}for(const[t,i]of this.activationFrames){if(s.has(t))continue;cancelAnimationFrame(i);this.activationFrames.delete(t)}for(const[t,i]of this.closeFrames){if(s.has(t))continue;cancelAnimationFrame(i);this.closeFrames.delete(t)}for(const t of this.domIds.keys()){if(s.has(t))continue;this.closeEvents.delete(t);this.domIds.delete(t);this.heights.delete(t);this.measuredUpdateKeys.delete(t);this.anchoredPositions.delete(t);this.dismissedSwipeDirections.delete(t)}for(const s of t){this.ensureDomId(s.id);if(s.transitionStatus==="starting"&&!this.activationFrames.has(s.id)){const t=this.attachedManager;const i=requestAnimationFrame((()=>{this.activationFrames.delete(s.id);t?.activate(s.id)}));this.activationFrames.set(s.id,i)}if(s.transitionStatus==="ending"){this.clearToastTimer(s.id);this.beginRemoval(s)}else{const t=this.closeWatchdogs.get(s.id);if(t)clearTimeout(t);this.closeWatchdogs.delete(s.id);const i=this.closeFrames.get(s.id);if(i)cancelAnimationFrame(i);this.closeFrames.delete(s.id);this.closeEvents.delete(s.id)}}this.syncTimers()}syncTimers(){const t=new Set;for(const s of this.records){if(s.transitionStatus!=="active")continue;t.add(s.id);const i=this.resolveToastTimeout(s);if(i<=0){this.clearToastTimer(s.id);continue}const e=this.timers.get(s.id);if(!e||e.timerKey!==s.timerKey){this.clearToastTimer(s.id);this.timers.set(s.id,{timerKey:s.timerKey,remaining:i,startedAt:0,handle:null})}if(!this.isPaused)this.startToastTimer(s.id)}for(const s of this.timers.keys()){if(!t.has(s))this.clearToastTimer(s)}}resolveToastTimeout(t){const s=t.timeout??this.timeout;if(typeof s==="number")return Math.max(0,s);return u(s,f.animationDelayLong2)}startToastTimer(t){const s=this.timers.get(t);if(!s||s.handle||s.remaining<=0)return;s.startedAt=Date.now();s.handle=setTimeout((()=>{s.handle=null;s.remaining=0;this.manager.close(t,"timeout")}),s.remaining)}pauseTimers(t){const s=this.isPaused;this.pauseReasons.add(t);if(s)return;const i=Date.now();for(const t of this.timers.values()){if(!t.handle)continue;clearTimeout(t.handle);t.handle=null;t.remaining=Math.max(0,t.remaining-(i-t.startedAt))}}resumeTimers(t){this.pauseReasons.delete(t);if(this.isPaused)return;for(const t of this.timers.keys())this.startToastTimer(t)}get isPaused(){return this.pauseReasons.size>0}clearToastTimer(t){const s=this.timers.get(t);if(s?.handle)clearTimeout(s.handle);this.timers.delete(t)}clearAllTimers(){for(const t of this.timers.values()){if(t.handle)clearTimeout(t.handle)}for(const t of this.closeWatchdogs.values())clearTimeout(t);this.timers.clear();this.closeWatchdogs.clear()}beginRemoval(t){if(!this.closeEvents.has(t.id)){this.closeEvents.add(t.id);this.dsToastClose.emit({id:t.id,reason:t.closeReason??"programmatic",toast:t});this.moveFocusAfterClose(t.id)}if(this.closeWatchdogs.has(t.id)||this.closeFrames.has(t.id))return;const s=m(f.motionShort3,f.animationDurationShort3);if(s<=0){queueMicrotask((()=>this.completeRemoval(t)));return}const i=requestAnimationFrame((()=>{this.closeFrames.delete(t.id);const i=this.records.find((s=>s.id===t.id));if(!i||i.transitionStatus!=="ending")return;this.closeWatchdogs.set(t.id,setTimeout((()=>this.completeRemoval(i)),s))}));this.closeFrames.set(t.id,i)}completeRemoval(t){const s=this.records.find((s=>s.id===t.id));if(!s||s.transitionStatus!=="ending")return;const i=this.closeWatchdogs.get(t.id);if(i)clearTimeout(i);this.closeWatchdogs.delete(t.id);const e=this.closeFrames.get(t.id);if(e)cancelAnimationFrame(e);this.closeFrames.delete(t.id);const n=this.attachedManager;const o=n?.remove(t.id);if(n&&o)this.pendingRemovals.push({manager:n,context:o})}handleAnimationComplete(t){if(t.transitionStatus==="ending")this.completeRemoval(t)}bindAnimationCancel(t,s){if(!t||t.dataset["cancelBound"]==="true")return;t.dataset["cancelBound"]="true";t.addEventListener("animationcancel",(()=>{const t=this.records.find((t=>t.id===s));if(t)this.handleAnimationComplete(t)}))}handlePointerEnter(t){F=this;this.pendingHoverLeave=false;this.hoveredIds.add(t);this.expanded=true;this.pauseTimers("hover")}handlePointerLeave(t){this.hoveredIds.delete(t);if(this.hoveredIds.size)return;if(this.records.some((t=>t.transitionStatus==="ending"))){this.pendingHoverLeave=true;return}this.expanded=false;this.resumeTimers("hover")}get regionElement(){return this.el.querySelector(".toast-region")}restorePreviousFocus(){this.previousFocus?.focus?.();this.previousFocus=null;this.keyboardActive=false}moveFocusAfterClose(t){const s=document.activeElement;const i=this.positionerElement(t);if(!s||!i?.contains(s))return;requestAnimationFrame((()=>{const s=this.activeRecords.find((s=>s.id!==t));const i=s?this.positionerElement(s.id)?.querySelector("ds-button-unfilled"):null;if(i?.setFocus)void i.setFocus();else if(s)this.regionElement?.focus();else this.restorePreviousFocus()}))}handleAction(t,s){const i={id:t.id,toast:t,originalEvent:s.detail};this.dsToastAction.emit(i);t.action?.onAction?.({id:t.id,data:t.data,manager:this.manager,originalEvent:s.detail})}handlePointerDown(t,s){if(s.button!==0)return;const i=s.target;if(i.closest(S))return;const e=s.currentTarget;e.setPointerCapture(s.pointerId);this.activeSwipe={id:t.id,pointerId:s.pointerId,pointerType:s.pointerType,startX:s.clientX,startY:s.clientY,maxDistance:0,cancelled:false,axis:null};this.swipe={id:t.id,x:0,y:0};if(s.pointerType==="touch")this.pauseTimers("swipe")}handlePointerMove(t){const s=this.activeSwipe;if(!s||s.pointerId!==t.pointerId||s.cancelled)return;const i=t.clientX-s.startX;const e=t.clientY-s.startY;if(!s.axis&&Math.max(Math.abs(i),Math.abs(e))>1){s.axis=Math.abs(i)>=Math.abs(e)?"x":"y"}if(!s.axis)return;const n=s.axis==="x";const o=n?i>=0?"right":"left":e>=0?"down":"up";const a=this.swipeDirections.includes(o);const r=n?Math.abs(i):Math.abs(e);const h=a?r:Math.sqrt(r);const c=(n?i:e)<0?-h:h;const d=n?c:0;const l=n?0:c;if(s.maxDistance-h>=k){s.cancelled=true;this.cancelSwipe();return}s.maxDistance=Math.max(s.maxDistance,h);if(r>1)t.preventDefault();this.swipe={id:s.id,x:d,y:l,direction:a?o:undefined}}handlePointerUp(t){const s=this.activeSwipe;if(!s||s.pointerId!==t.pointerId)return;const i=this.swipe;const e=i?Math.max(Math.abs(i.x),Math.abs(i.y)):0;const n=!s.cancelled&&!!i?.direction&&e>=A;const o=s.id;const a=s.pointerType==="touch";this.activeSwipe=null;this.swipe=null;if(a)this.resumeTimers("swipe");if(n&&i.direction){this.dismissedSwipeDirections.set(o,i.direction);this.manager.close(o,"swipe")}}handlePointerCancel(t){if(this.activeSwipe?.pointerId!==t.pointerId)return;this.cancelSwipe()}cancelSwipe(){const t=this.activeSwipe?.pointerType==="touch";this.activeSwipe=null;this.swipe=null;if(t)this.resumeTimers("swipe")}get touchAction(){const t=this.swipeDirections.includes("left")||this.swipeDirections.includes("right");const s=this.swipeDirections.includes("up")||this.swipeDirections.includes("down");if(t&&s)return"none";if(t)return"pan-y";if(s)return"pan-x";return"auto"}measureNaturalHeight(t,s){const i=t.querySelector(".toast-surface");if(!i)return 0;const e=t.style.width;const n=t.style.transition;const o=i.style.height;if(s){t.style.transition="none";t.style.width="100%"}i.style.height="auto";const a=i.getBoundingClientRect().height;i.style.height=o;if(s){t.style.width=e;t.getBoundingClientRect();t.style.transition=n}return a}measureLayout(){let t=false;for(const s of this.records){const i=this.positionerElement(s.id);if(!i)continue;let e=this.heights.get(s.id)??0;const n=e<=0||this.measuredUpdateKeys.get(s.id)!==s.updateKey;if(n){e=this.measureNaturalHeight(i,!s.positioner);if(e>0){if(this.heights.get(s.id)!==e)t=true;this.heights.set(s.id,e);this.measuredUpdateKeys.set(s.id,s.updateKey)}}if(!s.positioner)continue;const o=this.resolveAnchor(s.positioner.anchor);if(!o||e<=0){if(this.anchoredPositions.delete(s.id))t=true;continue}const r=i.getBoundingClientRect();const h=p(s.positioner.sideOffset,f.space050);const c=p(s.positioner.alignOffset,0);const d=a({anchorRect:o.getBoundingClientRect(),popupWidth:r.width,popupHeight:e,side:s.positioner.side??"top",align:s.positioner.align??"center",sideOffsetPx:h,alignOffsetPx:c,viewportPadPx:p(undefined,f.space200),viewportWidth:window.innerWidth,viewportHeight:window.innerHeight});const l=this.anchoredPositions.get(s.id);if(!l||l.x!==d.x||l.y!==d.y||l.side!==d.resolvedSide){this.anchoredPositions.set(s.id,{x:d.x,y:d.y,side:d.resolvedSide});t=true}}if(t)this.layoutVersion+=1}resolveAnchor(t){return typeof t==="string"?document.getElementById(t):t}positionerElement(t){return Array.from(this.el.querySelectorAll(".toast-positioner")).find((s=>s.dataset["toastId"]===t))??null}ensureDomId(t){const s=this.domIds.get(t);if(s)return s;const i=++this.nextDomId;this.domIds.set(t,i);return i}get activeRecords(){return this.records.filter((t=>t.transitionStatus!=="ending"))}globalLayout(){const t=this.records.filter((t=>!t.positioner));let s=0;let i=0;const e=p(undefined,f.space200);const n=new Map;t.forEach(((t,o)=>{if(t.transitionStatus==="ending"){n.set(t.id,{index:o,offset:s,limited:false});return}const a=i>=Math.max(1,this.limit);n.set(t.id,{index:i,offset:s,limited:a});s+=(this.heights.get(t.id)??0)+e;i+=1}));return n}renderToast(t,s){const i=this.ensureDomId(t.id);const n=`ds-toast-${this.instanceId}-${i}-title`;const o=`ds-toast-${this.instanceId}-${i}-description`;const a=this.swipe?.id===t.id?this.swipe:null;const r=a?.direction??this.dismissedSwipeDirections.get(t.id);const h=!!t.positioner;const c=this.anchoredPositions.get(t.id);const d=t.priority==="high"&&!this.keyboardActive;const l=this.keyboardActive&&!s.limited?0:-1;const f=this.heights.get(t.id);return e("div",{ref:s=>this.bindAnimationCancel(s,t.id),class:{"toast-positioner":true,"toast-positioner--anchored":h,"toast-positioner--ending":t.transitionStatus==="ending"},"data-toast-id":t.id,"data-behind":!h&&s.index>0?"":undefined,"data-limited":s.limited?"":undefined,"data-positioned":h?String(!!c):undefined,"data-side":c?.side,inert:s.limited?true:undefined,"aria-hidden":s.limited?"true":undefined,style:{"--toast-index":String(s.index),"--toast-offset-y":`${s.offset}px`,"--toast-height":f?`${f}px`:undefined,zIndex:String(this.records.length-s.index),left:c?`${c.x}px`:undefined,top:c?`${c.y}px`:undefined},onAnimationEnd:()=>this.handleAnimationComplete(t)},e("div",{class:{"toast-surface":true,"toast-surface--swiping":!!a},role:t.priority==="high"?"alertdialog":"dialog","aria-modal":"false","aria-labelledby":t.title?n:t.description?o:undefined,"aria-describedby":t.title&&t.description?o:undefined,"aria-hidden":d?"true":undefined,"data-type":t.type,"data-priority":t.priority,"data-transition-status":t.transitionStatus,"data-swiping":a?"":undefined,"data-swipe-direction":r,style:{"--toast-swipe-movement-x":`${a?.x??0}px`,"--toast-swipe-movement-y":`${a?.y??0}px`,touchAction:this.touchAction},onPointerDown:s=>this.handlePointerDown(t,s),onPointerMove:t=>this.handlePointerMove(t),onPointerUp:t=>this.handlePointerUp(t),onPointerCancel:t=>this.handlePointerCancel(t),onPointerEnter:h?()=>this.handlePointerEnter(t.id):undefined,onPointerLeave:h?()=>this.handlePointerLeave(t.id):undefined},e("div",{class:"toast-content"},e("div",{class:"toast-copy"},t.title&&e("ds-text",{class:"toast-title",as:"div",variant:"text-title-small",color:"primary",textId:n},t.title),t.description&&e("ds-text",{class:"toast-description",as:"div",variant:"text-body-medium",color:"secondary",textId:o},t.description)),t.action&&e("ds-button-unfilled",{class:"toast-action",variant:"label",size:"md",type:"button",label:t.action.label,"aria-label":t.action.ariaLabel,hasBorder:true,focusTabIndex:l,"aria-hidden":!this.keyboardActive?"true":undefined,onDsClick:s=>this.handleAction(t,s)})),e("ds-button-unfilled",{class:"toast-close",variant:"icon",size:"md",type:"button",icon:"Cross","aria-label":this.closeLabel,hasBorder:false,activeFill:false,focusTabIndex:l,"aria-hidden":!this.keyboardActive?"true":undefined,onDsClick:()=>this.manager.close(t.id,"close-button")})))}render(){const t=this.globalLayout();const s=this.records.filter((t=>!t.positioner));const i=this.records.filter((t=>!!t.positioner));const o=this.records.filter((s=>s.priority==="high"&&s.transitionStatus!=="ending"&&!t.get(s.id)?.limited));return e(n,{key:"98bbb1e259fd404c4014f4347baf66d3e3264036"},e("section",{key:"32538d32f6b047b683cfa847d8abd0693128178a",class:"toast-region",role:"region","aria-label":this.label,"aria-live":"polite","aria-atomic":"false","aria-relevant":"additions text",tabIndex:-1,onFocusin:this.handleFocusIn,onFocusout:t=>this.handleFocusOut(t),onKeyDown:t=>this.handleRegionKeyDown(t)},e("div",{key:"4fd080b798ba78d8de7149a467b336d00589ab62",class:"toast-viewport","data-expanded":this.expanded?"":undefined,onPointerEnter:()=>this.handlePointerEnter(P),onPointerLeave:()=>this.handlePointerLeave(P)},s.map((s=>this.renderToast(s,t.get(s.id)??{index:0,offset:0,limited:false})))),e("div",{key:"368f36b10e28257105350ecfcbfe4a2c0ed1e3eb",class:"toast-anchored-layer"},i.map((t=>this.renderToast(t,{index:0,offset:0,limited:false})))),e("div",{key:"551274399712ffcf031c87a1bf2dba9ad3a29f0f",class:"toast-assertive-announcer ds-visually-hidden"},o.map((t=>e("div",{role:"alert","aria-atomic":"true"},[t.title,t.description].filter(Boolean).join(". ")))))))}get el(){return this}static get watchers(){return{manager:[{onManagerChange:0}],timeout:[{onTimeoutChange:0}]}}static get style(){return T()}},[2,"ds-toast",{manager:[16],limit:[2],timeout:[8],label:[1],closeLabel:[1,"close-label"],avoidMobileShellBar:[516,"avoid-mobile-shell-bar"],swipeDirections:[16],records:[32],expanded:[32],keyboardActive:[32],swipe:[32],layoutVersion:[32]},undefined,{manager:[{onManagerChange:0}],timeout:[{onTimeoutChange:0}]}]);function j(){if(typeof customElements==="undefined"){return}const t=["ds-toast","ds-badge","ds-button-unfilled","ds-icon","ds-loader","ds-text"];t.forEach((t=>{switch(t){case"ds-toast":if(!customElements.get(o(t))){customElements.define(o(t),B)}break;case"ds-badge":if(!customElements.get(o(t))){r()}break;case"ds-button-unfilled":if(!customElements.get(o(t))){h()}break;case"ds-icon":if(!customElements.get(o(t))){c()}break;case"ds-loader":if(!customElements.get(o(t))){d()}break;case"ds-text":if(!customElements.get(o(t))){l()}break}}))}j();const D=B;const R=j;export{D as DsToast,R as defineCustomElement};
 //# sourceMappingURL=ds-toast.js.map

package/dist/components/{p-B1cbQ0SG.js → p-B1XW4VSn.js}

@@ -1,2 +1,2 @@
-import{p as e,H as s,c as o,h as a,a as d,t as n}from"./index.js";import{d as l}from"./p-BsoqsbBh.js";import{d as i}from"./p-DsiCDzoF.js";import{d as r}from"./p-BAfG3M8z.js";import{d as t}from"./p-Ca-I2UnB.js";import{d as c}from"./p-Ay1AX7Ql.js";import{d as h}from"./p-ohsLFap_.js";const p=()=>`.ds-control--lg.sc-ds-panel-tool-header,.ds-control--lg.sc-ds-panel-tool-header-h,.ds-control--md.sc-ds-panel-tool-header-h,.ds-control--md.sc-ds-panel-tool-header,.ds-control--sm.sc-ds-panel-tool-header-h,.ds-control--sm.sc-ds-panel-tool-header,.ds-control--xs.sc-ds-panel-tool-header-h,.ds-control--xs.sc-ds-panel-tool-header{--ds-control-radius:var(--dimension-radius-025)}.ds-control--lg.sc-ds-panel-tool-header-h,.ds-control--lg.sc-ds-panel-tool-header{--ds-control-height:var(--dimension-size-500);--ds-control-icon:var(--dimension-iconography-lg);--ds-control-padding-inline:var(--dimension-space-100);--ds-control-label-inset:var(--dimension-space-050);--ds-control-gap:var(--dimension-space-050)}.ds-control--md.sc-ds-panel-tool-header-h,.ds-control--md.sc-ds-panel-tool-header{--ds-control-height:var(--dimension-size-400);--ds-control-icon:var(--dimension-iconography-md);--ds-control-padding-inline:var(--dimension-space-075);--ds-control-label-inset:var(--dimension-space-025);--ds-control-gap:var(--dimension-space-050)}.ds-control--sm.sc-ds-panel-tool-header-h,.ds-control--sm.sc-ds-panel-tool-header{--ds-control-height:var(--dimension-size-300);--ds-control-icon:var(--dimension-iconography-sm);--ds-control-padding-inline:var(--dimension-space-050);--ds-control-label-inset:var(--dimension-space-025);--ds-control-gap:var(--dimension-space-025)}.ds-control--xs.sc-ds-panel-tool-header-h,.ds-control--xs.sc-ds-panel-tool-header{--ds-control-height:var(--dimension-size-200);--ds-control-icon:var(--dimension-iconography-xs);--ds-control-padding-inline:var(--dimension-space-025);--ds-control-label-inset:var(--dimension-space-025);--ds-control-gap:0}.ds-chrome-space--sm.sc-ds-panel-tool-header-h,.ds-chrome-space--sm.sc-ds-panel-tool-header{--ds-chrome-padding:var(--dimension-space-050);--ds-chrome-gap:var(--dimension-space-050)}.ds-chrome-space--md.sc-ds-panel-tool-header-h,.ds-chrome-space--md.sc-ds-panel-tool-header{--ds-chrome-padding:var(--dimension-space-100);--ds-chrome-gap:var(--dimension-space-100)}.ds-chrome-space--lg.sc-ds-panel-tool-header-h,.ds-chrome-space--lg.sc-ds-panel-tool-header{--ds-chrome-padding:var(--dimension-space-200);--ds-chrome-gap:var(--dimension-space-200)}.ds-chrome-row.sc-ds-panel-tool-header-h,.ds-chrome-row.sc-ds-panel-tool-header,.ds-chrome-column.sc-ds-panel-tool-header-h,.ds-chrome-column.sc-ds-panel-tool-header,.ds-chrome-grid.sc-ds-panel-tool-header-h,.ds-chrome-grid.sc-ds-panel-tool-header{display:flex;box-sizing:border-box;gap:var(--ds-chrome-gap, var(--dimension-space-100));padding:var(--ds-chrome-padding, var(--dimension-space-100))}.ds-chrome-row.sc-ds-panel-tool-header-h,.ds-chrome-row.sc-ds-panel-tool-header{flex-direction:row;align-items:center}.ds-chrome-column.sc-ds-panel-tool-header-h,.ds-chrome-column.sc-ds-panel-tool-header{flex-direction:column}.ds-chrome-grid.sc-ds-panel-tool-header-h,.ds-chrome-grid.sc-ds-panel-tool-header{display:grid;align-items:center}.sc-ds-panel-tool-header-h{display:block;flex:0 0 auto;box-sizing:border-box}.panel-tool-header.sc-ds-panel-tool-header{height:var(--dimension-size-600);border-bottom:var(--dimension-stroke-width-012) solid var(--color-border-tertiary);color:var(--color-foreground-primary);-webkit-user-select:none;user-select:none}.panel-tool-header__leading.sc-ds-panel-tool-header,.panel-tool-header__trailing.sc-ds-panel-tool-header{display:flex;align-items:center;min-width:0}.panel-tool-header__leading.sc-ds-panel-tool-header:empty,.panel-tool-header__trailing.sc-ds-panel-tool-header:empty{display:none}.panel-tool-header__leading.sc-ds-panel-tool-header{flex:0 0 auto}.panel-tool-header__trailing.sc-ds-panel-tool-header{flex:0 0 auto;gap:var(--dimension-space-050);justify-content:flex-end}ds-text.panel-tool-header__heading.sc-ds-panel-tool-header{display:inline-flex;flex:1 1 0;align-items:center;width:auto;min-width:0;height:var(--ds-control-height);padding-inline:calc(var(--ds-control-padding-inline) + var(--ds-control-label-inset));box-sizing:border-box;text-align:left;-webkit-user-select:none;user-select:none}`;const m=e(class e extends s{constructor(e){super();if(e!==false){this.__registerHost()}this.dsBack=o(this,"dsBack");this.dsMenuToggle=o(this,"dsMenuToggle");this.dsAction=o(this,"dsAction");this.heading="";this.showBack=false;this.backIcon="ChevronLeft";this.backAriaLabel="Back";this.showMenu=true;this.menuAriaLabel="More options";this.menuTriggerId="";this.menuExpanded=false;this.actions=[]}async focusMenuTrigger(){const e=this.el.querySelector('ds-button-unfilled.panel-tool-header__menu, ds-button-unfilled[data-header-action-id="menu"]');await(e?.setFocus?.())}render(){const e=this.actions.length>0;const s=e?this.actions:this.showMenu?[{id:"menu",icon:"Ellipses",ariaLabel:this.menuAriaLabel,triggerId:this.menuTriggerId,controls:this.menuControls,expanded:this.menuExpanded,haspopup:"menu"}]:[];return a(d,{key:"d6c0245fafe67140abd8b666345beb85e129b660"},a("header",{key:"2c423e71c59e014b26e3de108388a3468418415f",class:"panel-tool-header ds-chrome-row ds-chrome-space--md"},a("div",{key:"afb8bd928a0562fba617d00915724d267df1d94c",class:"panel-tool-header__leading"},this.showBack?a("ds-tooltip",{label:this.backAriaLabel,side:"bottom",size:"sm"},a("ds-button-unfilled",{class:"panel-tool-header__back",variant:"icon",icon:this.backIcon,size:"md","aria-label":this.backAriaLabel,activeFill:false,hasBorder:false,onDsClick:e=>this.dsBack.emit(e.detail)})):null),a("ds-text",{key:"b4e552a1005d53042715a20e59f2228136a41baa",class:"panel-tool-header__heading ds-control--md",as:"h2",variant:"text-body-medium",emphasis:true,color:"primary",lineTruncation:1},this.heading),a("div",{key:"1df00dec4bab667d6b8d7508a916ff781aa40295",class:"panel-tool-header__trailing"},s.map((s=>a("ds-tooltip",{key:s.id,label:s.ariaLabel,side:"bottom",size:"sm"},a("ds-button-unfilled",{id:s.triggerId||undefined,"data-header-action-id":s.id,class:{"panel-tool-header__action":true,"panel-tool-header__menu":s.id==="menu"},variant:"icon",icon:s.icon,size:"md","aria-label":s.ariaLabel,haspopup:s.haspopup,controls:s.controls,expanded:s.expanded,pressed:s.pressed,isActive:!!s.expanded,isInactive:s.isInactive,activeFill:false,hasBorder:false,onDsClick:o=>{if(!e&&s.id==="menu")this.dsMenuToggle.emit(o.detail);this.dsAction.emit({id:s.id,originalEvent:o.detail})}})))))))}get el(){return this}static get style(){return p()}},[2,"ds-panel-tool-header",{heading:[1],showBack:[4,"show-back"],backIcon:[1,"back-icon"],backAriaLabel:[1,"back-aria-label"],showMenu:[4,"show-menu"],menuAriaLabel:[1,"menu-aria-label"],menuTriggerId:[1,"menu-trigger-id"],menuControls:[1,"menu-controls"],menuExpanded:[4,"menu-expanded"],actions:[16],focusMenuTrigger:[64]}]);function g(){if(typeof customElements==="undefined"){return}const e=["ds-panel-tool-header","ds-badge","ds-button-unfilled","ds-icon","ds-loader","ds-text","ds-tooltip"];e.forEach((e=>{switch(e){case"ds-panel-tool-header":if(!customElements.get(n(e))){customElements.define(n(e),m)}break;case"ds-badge":if(!customElements.get(n(e))){l()}break;case"ds-button-unfilled":if(!customElements.get(n(e))){i()}break;case"ds-icon":if(!customElements.get(n(e))){r()}break;case"ds-loader":if(!customElements.get(n(e))){t()}break;case"ds-text":if(!customElements.get(n(e))){c()}break;case"ds-tooltip":if(!customElements.get(n(e))){h()}break}}))}g();export{m as P,g as d};
-//# sourceMappingURL=p-B1cbQ0SG.js.map
+import{p as e,H as s,c as o,h as a,a as d,t as n}from"./index.js";import{d as l}from"./p-BsoqsbBh.js";import{d as i}from"./p-eAfNzlMa.js";import{d as r}from"./p-BAfG3M8z.js";import{d as t}from"./p-Ca-I2UnB.js";import{d as c}from"./p-Ay1AX7Ql.js";import{d as h}from"./p-ohsLFap_.js";const p=()=>`.ds-control--lg.sc-ds-panel-tool-header,.ds-control--lg.sc-ds-panel-tool-header-h,.ds-control--md.sc-ds-panel-tool-header-h,.ds-control--md.sc-ds-panel-tool-header,.ds-control--sm.sc-ds-panel-tool-header-h,.ds-control--sm.sc-ds-panel-tool-header,.ds-control--xs.sc-ds-panel-tool-header-h,.ds-control--xs.sc-ds-panel-tool-header{--ds-control-radius:var(--dimension-radius-025)}.ds-control--lg.sc-ds-panel-tool-header-h,.ds-control--lg.sc-ds-panel-tool-header{--ds-control-height:var(--dimension-size-500);--ds-control-icon:var(--dimension-iconography-lg);--ds-control-padding-inline:var(--dimension-space-100);--ds-control-label-inset:var(--dimension-space-050);--ds-control-gap:var(--dimension-space-050)}.ds-control--md.sc-ds-panel-tool-header-h,.ds-control--md.sc-ds-panel-tool-header{--ds-control-height:var(--dimension-size-400);--ds-control-icon:var(--dimension-iconography-md);--ds-control-padding-inline:var(--dimension-space-075);--ds-control-label-inset:var(--dimension-space-025);--ds-control-gap:var(--dimension-space-050)}.ds-control--sm.sc-ds-panel-tool-header-h,.ds-control--sm.sc-ds-panel-tool-header{--ds-control-height:var(--dimension-size-300);--ds-control-icon:var(--dimension-iconography-sm);--ds-control-padding-inline:var(--dimension-space-050);--ds-control-label-inset:var(--dimension-space-025);--ds-control-gap:var(--dimension-space-025)}.ds-control--xs.sc-ds-panel-tool-header-h,.ds-control--xs.sc-ds-panel-tool-header{--ds-control-height:var(--dimension-size-200);--ds-control-icon:var(--dimension-iconography-xs);--ds-control-padding-inline:var(--dimension-space-025);--ds-control-label-inset:var(--dimension-space-025);--ds-control-gap:0}.ds-chrome-space--sm.sc-ds-panel-tool-header-h,.ds-chrome-space--sm.sc-ds-panel-tool-header{--ds-chrome-padding:var(--dimension-space-050);--ds-chrome-gap:var(--dimension-space-050)}.ds-chrome-space--md.sc-ds-panel-tool-header-h,.ds-chrome-space--md.sc-ds-panel-tool-header{--ds-chrome-padding:var(--dimension-space-100);--ds-chrome-gap:var(--dimension-space-100)}.ds-chrome-space--lg.sc-ds-panel-tool-header-h,.ds-chrome-space--lg.sc-ds-panel-tool-header{--ds-chrome-padding:var(--dimension-space-200);--ds-chrome-gap:var(--dimension-space-200)}.ds-chrome-row.sc-ds-panel-tool-header-h,.ds-chrome-row.sc-ds-panel-tool-header,.ds-chrome-column.sc-ds-panel-tool-header-h,.ds-chrome-column.sc-ds-panel-tool-header,.ds-chrome-grid.sc-ds-panel-tool-header-h,.ds-chrome-grid.sc-ds-panel-tool-header{display:flex;box-sizing:border-box;gap:var(--ds-chrome-gap, var(--dimension-space-100));padding:var(--ds-chrome-padding, var(--dimension-space-100))}.ds-chrome-row.sc-ds-panel-tool-header-h,.ds-chrome-row.sc-ds-panel-tool-header{flex-direction:row;align-items:center}.ds-chrome-column.sc-ds-panel-tool-header-h,.ds-chrome-column.sc-ds-panel-tool-header{flex-direction:column}.ds-chrome-grid.sc-ds-panel-tool-header-h,.ds-chrome-grid.sc-ds-panel-tool-header{display:grid;align-items:center}.sc-ds-panel-tool-header-h{display:block;flex:0 0 auto;box-sizing:border-box}.panel-tool-header.sc-ds-panel-tool-header{height:var(--dimension-size-600);border-bottom:var(--dimension-stroke-width-012) solid var(--color-border-tertiary);color:var(--color-foreground-primary);-webkit-user-select:none;user-select:none}.panel-tool-header__leading.sc-ds-panel-tool-header,.panel-tool-header__trailing.sc-ds-panel-tool-header{display:flex;align-items:center;min-width:0}.panel-tool-header__leading.sc-ds-panel-tool-header:empty,.panel-tool-header__trailing.sc-ds-panel-tool-header:empty{display:none}.panel-tool-header__leading.sc-ds-panel-tool-header{flex:0 0 auto}.panel-tool-header__trailing.sc-ds-panel-tool-header{flex:0 0 auto;gap:var(--dimension-space-050);justify-content:flex-end}ds-text.panel-tool-header__heading.sc-ds-panel-tool-header{display:inline-flex;flex:1 1 0;align-items:center;width:auto;min-width:0;height:var(--ds-control-height);padding-inline:calc(var(--ds-control-padding-inline) + var(--ds-control-label-inset));box-sizing:border-box;text-align:left;-webkit-user-select:none;user-select:none}`;const m=e(class e extends s{constructor(e){super();if(e!==false){this.__registerHost()}this.dsBack=o(this,"dsBack");this.dsMenuToggle=o(this,"dsMenuToggle");this.dsAction=o(this,"dsAction");this.heading="";this.showBack=false;this.backIcon="ChevronLeft";this.backAriaLabel="Back";this.showMenu=true;this.menuAriaLabel="More options";this.menuTriggerId="";this.menuExpanded=false;this.actions=[]}async focusMenuTrigger(){const e=this.el.querySelector('ds-button-unfilled.panel-tool-header__menu, ds-button-unfilled[data-header-action-id="menu"]');await(e?.setFocus?.())}render(){const e=this.actions.length>0;const s=e?this.actions:this.showMenu?[{id:"menu",icon:"Ellipses",ariaLabel:this.menuAriaLabel,triggerId:this.menuTriggerId,controls:this.menuControls,expanded:this.menuExpanded,haspopup:"menu"}]:[];return a(d,{key:"d6c0245fafe67140abd8b666345beb85e129b660"},a("header",{key:"2c423e71c59e014b26e3de108388a3468418415f",class:"panel-tool-header ds-chrome-row ds-chrome-space--md"},a("div",{key:"afb8bd928a0562fba617d00915724d267df1d94c",class:"panel-tool-header__leading"},this.showBack?a("ds-tooltip",{label:this.backAriaLabel,side:"bottom",size:"sm"},a("ds-button-unfilled",{class:"panel-tool-header__back",variant:"icon",icon:this.backIcon,size:"md","aria-label":this.backAriaLabel,activeFill:false,hasBorder:false,onDsClick:e=>this.dsBack.emit(e.detail)})):null),a("ds-text",{key:"b4e552a1005d53042715a20e59f2228136a41baa",class:"panel-tool-header__heading ds-control--md",as:"h2",variant:"text-body-medium",emphasis:true,color:"primary",lineTruncation:1},this.heading),a("div",{key:"1df00dec4bab667d6b8d7508a916ff781aa40295",class:"panel-tool-header__trailing"},s.map((s=>a("ds-tooltip",{key:s.id,label:s.ariaLabel,side:"bottom",size:"sm"},a("ds-button-unfilled",{id:s.triggerId||undefined,"data-header-action-id":s.id,class:{"panel-tool-header__action":true,"panel-tool-header__menu":s.id==="menu"},variant:"icon",icon:s.icon,size:"md","aria-label":s.ariaLabel,haspopup:s.haspopup,controls:s.controls,expanded:s.expanded,pressed:s.pressed,isActive:!!s.expanded,isInactive:s.isInactive,activeFill:false,hasBorder:false,onDsClick:o=>{if(!e&&s.id==="menu")this.dsMenuToggle.emit(o.detail);this.dsAction.emit({id:s.id,originalEvent:o.detail})}})))))))}get el(){return this}static get style(){return p()}},[2,"ds-panel-tool-header",{heading:[1],showBack:[4,"show-back"],backIcon:[1,"back-icon"],backAriaLabel:[1,"back-aria-label"],showMenu:[4,"show-menu"],menuAriaLabel:[1,"menu-aria-label"],menuTriggerId:[1,"menu-trigger-id"],menuControls:[1,"menu-controls"],menuExpanded:[4,"menu-expanded"],actions:[16],focusMenuTrigger:[64]}]);function g(){if(typeof customElements==="undefined"){return}const e=["ds-panel-tool-header","ds-badge","ds-button-unfilled","ds-icon","ds-loader","ds-text","ds-tooltip"];e.forEach((e=>{switch(e){case"ds-panel-tool-header":if(!customElements.get(n(e))){customElements.define(n(e),m)}break;case"ds-badge":if(!customElements.get(n(e))){l()}break;case"ds-button-unfilled":if(!customElements.get(n(e))){i()}break;case"ds-icon":if(!customElements.get(n(e))){r()}break;case"ds-loader":if(!customElements.get(n(e))){t()}break;case"ds-text":if(!customElements.get(n(e))){c()}break;case"ds-tooltip":if(!customElements.get(n(e))){h()}break}}))}g();export{m as P,g as d};
+//# sourceMappingURL=p-B1XW4VSn.js.map

package/dist/components/p-B9p6w-_T.js

@@ -0,0 +1,2 @@
+import{p as o,H as s,c as e,h as i,a as c,t as n}from"./index.js";import{d as t}from"./p-Ay1AX7Ql.js";import{D as r,s as d}from"./p-DOUk4KoT.js";import{s as a}from"./p-D2xWcVv6.js";import{C as l}from"./p-CuwopElg.js";const h=()=>`.ds-control-inactive.sc-ds-checkbox-h,.ds-control-inactive.sc-ds-checkbox{opacity:var(--effect-opacity-medium);pointer-events:none;cursor:not-allowed}.ds-control--lg.sc-ds-checkbox,.ds-control--lg.sc-ds-checkbox-h,.ds-control--md.sc-ds-checkbox-h,.ds-control--md.sc-ds-checkbox,.ds-control--sm.sc-ds-checkbox-h,.ds-control--sm.sc-ds-checkbox,.ds-control--xs.sc-ds-checkbox-h,.ds-control--xs.sc-ds-checkbox{--ds-control-radius:var(--dimension-radius-025)}.ds-control--lg.sc-ds-checkbox-h,.ds-control--lg.sc-ds-checkbox{--ds-control-height:var(--dimension-size-500);--ds-control-icon:var(--dimension-iconography-lg);--ds-control-padding-inline:var(--dimension-space-100);--ds-control-label-inset:var(--dimension-space-050);--ds-control-gap:var(--dimension-space-050)}.ds-control--md.sc-ds-checkbox-h,.ds-control--md.sc-ds-checkbox{--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-checkbox-h,.ds-control--sm.sc-ds-checkbox{--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-checkbox-h,.ds-control--xs.sc-ds-checkbox{--ds-control-height:var(--dimension-size-200);--ds-control-icon:var(--dimension-iconography-xs);--ds-control-padding-inline:var(--dimension-space-025);--ds-control-label-inset:var(--dimension-space-025);--ds-control-gap:0}.sc-ds-checkbox-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-checkbox-h,.ds-focus-ring.sc-ds-checkbox,.ds-focus-ring-inset.sc-ds-checkbox-h,.ds-focus-ring-inset.sc-ds-checkbox{outline:none;-webkit-tap-highlight-color:transparent;touch-action:manipulation}.ds-focus-ring.sc-ds-checkbox-h:focus-visible,.ds-focus-ring.sc-ds-checkbox: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-checkbox-h,.ds-focus-ring.ds-focus-ring--visible.sc-ds-checkbox{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-checkbox-h:focus-visible,.ds-focus-ring-inset.sc-ds-checkbox:focus-visible{outline:none}.ds-focus-ring-inset.sc-ds-checkbox-h:focus-visible::after,.ds-focus-ring-inset.sc-ds-checkbox: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-checkbox-h,.ds-focus-ring-inset.ds-focus-ring--visible.sc-ds-checkbox{outline:none}.ds-focus-ring-inset.ds-focus-ring--visible.sc-ds-checkbox-h::after,.ds-focus-ring-inset.ds-focus-ring--visible.sc-ds-checkbox::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-checkbox-h,.ds-interaction-fill.sc-ds-checkbox{position:relative;z-index:0;cursor:default;--ds-interaction-hover:var(--color-interaction-hover);--ds-interaction-pressed:var(--color-interaction-pressed);--ds-interaction-active:var(--color-interaction-active-brand);--ds-interaction-border-width:0px;--ds-interaction-border-color:transparent}.ds-interaction-fill.sc-ds-checkbox-h::before,.ds-interaction-fill.sc-ds-checkbox::before,.ds-interaction-fill.sc-ds-checkbox-h::after,.ds-interaction-fill.sc-ds-checkbox::after{content:'';position:absolute;inset:0;border-radius:inherit;background:transparent;pointer-events:none;cursor:inherit;transition:none}.ds-interaction-fill.sc-ds-checkbox-h::before,.ds-interaction-fill.sc-ds-checkbox::before{z-index:1}.ds-interaction-fill.sc-ds-checkbox-h::after,.ds-interaction-fill.sc-ds-checkbox::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-checkbox-h,.ds-interaction-fill--bordered.sc-ds-checkbox{--ds-interaction-border-width:var(--dimension-stroke-width-012);--ds-interaction-border-color:var(--color-border-secondary)}.ds-interaction-fill--selected.sc-ds-checkbox-h::before,.ds-interaction-fill--selected.sc-ds-checkbox::before{background:var(--ds-interaction-active)}.ds-interaction-fill--selected.sc-ds-checkbox-h,.ds-interaction-fill--selected.sc-ds-checkbox{--ds-interaction-dot-ring:var(--ds-interaction-active)}@media (hover: hover) and (pointer: fine){.ds-interaction-fill.sc-ds-checkbox-h:hover:not(:disabled)::after,.ds-interaction-fill.sc-ds-checkbox:hover:not(:disabled)::after{background:var(--ds-interaction-hover)}}.ds-interaction-fill.sc-ds-checkbox-h:active:not(:disabled)::after,.ds-interaction-fill.sc-ds-checkbox:active:not(:disabled)::after{background:var(--ds-interaction-pressed)}.ds-interaction-fill.sc-ds-checkbox-h>.ds-interaction-fill__content.sc-ds-checkbox,.ds-interaction-fill.sc-ds-checkbox>.ds-interaction-fill__content.sc-ds-checkbox,.ds-interaction-fill__content.sc-ds-checkbox{position:relative;z-index:2;cursor:inherit}.ds-interaction-fill--on-faint.sc-ds-checkbox-h,.ds-interaction-fill--on-faint.sc-ds-checkbox{--ds-interaction-active:var(--color-interaction-active)}.ds-interaction-fill--on-medium.sc-ds-checkbox-h,.ds-interaction-fill--on-medium.sc-ds-checkbox{--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-checkbox-h,.ds-interaction-fill--on-bold.sc-ds-checkbox{--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-checkbox-h,.ds-interaction-fill--on-strong.sc-ds-checkbox{--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-checkbox-h,.ds-interaction-fill--on-translucent.sc-ds-checkbox{--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-checkbox-h,.ds-interaction-fill--on-inverted.sc-ds-checkbox{--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-checkbox-h,.ds-interaction-fill--on-media.sc-ds-checkbox{--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-checkbox-h,.ds-interaction-fill--on-always-dark.sc-ds-checkbox{--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-checkbox-h,.ds-interaction-fill--on-navigation.sc-ds-checkbox{--ds-interaction-hover:var(--color-navigation-interaction-hover);--ds-interaction-pressed:var(--color-navigation-interaction-pressed);--ds-interaction-active:var(--color-navigation-interaction-active);--ds-focus-ring-color:var(--color-navigation-interaction-focus)}.sc-ds-checkbox-h{display:inline-flex;align-items:center;box-sizing:border-box;gap:var(--ds-control-gap);height:var(--ds-control-height);padding:0 var(--ds-control-padding-inline);border-radius:var(--ds-control-radius);cursor:default;user-select:none}.checkbox--presentation.sc-ds-checkbox-h{width:var(--ds-control-icon);height:var(--ds-control-icon);padding:0;gap:0;pointer-events:none}.checkbox--lg.sc-ds-checkbox-h{--_checkbox-box:var(--dimension-iconography-md);--_checkbox-stroke:var(--dimension-stroke-width-018)}.checkbox--md.sc-ds-checkbox-h{--_checkbox-box:var(--dimension-iconography-sm);--_checkbox-stroke:var(--dimension-stroke-width-015)}.checkbox--sm.sc-ds-checkbox-h{--_checkbox-box:var(--dimension-iconography-xs);--_checkbox-stroke:var(--dimension-stroke-width-012)}.checkbox--xs.sc-ds-checkbox-h{--_checkbox-box:var(--dimension-size-100);--_checkbox-stroke:calc(var(--dimension-stroke-width-base) * 3 / 32)}.checkbox__placement.sc-ds-checkbox{display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;width:var(--ds-control-icon);height:var(--ds-control-icon)}.box.sc-ds-checkbox{display:inline-flex;align-items:center;justify-content:center;box-sizing:border-box;width:var(--_checkbox-box);height:var(--_checkbox-box);border:0;border-radius:var(--dimension-radius-025);box-shadow:inset 0 0 0 var(--_checkbox-stroke) var(--color-foreground-tertiary);transition:background-color var(--effect-motion-short-2),     box-shadow var(--effect-motion-short-2)}.box--marked.sc-ds-checkbox{color:var(--color-foreground-on-bold-background-primary);background-color:var(--color-background-bold-brand);box-shadow:none}.checkbox__mark.sc-ds-checkbox{width:100%;height:100%;flex-shrink:0;stroke:currentColor;stroke-width:var(--_checkbox-stroke);stroke-linecap:butt;stroke-linejoin:round}.checkbox__mark--checked.sc-ds-checkbox{transform:translateY(-0.5px)}.checkbox__label.sc-ds-checkbox{flex:1;min-width:0;padding:0 var(--ds-control-label-inset)}`;let b=0;const f=o(class o extends s{constructor(o){super();if(o!==false){this.__registerHost()}this.dsChange=e(this,"dsChange");this.internals=this.attachInternals();this.labelId=`ds-checkbox-label-${++b}`;this.checked=false;this.size="md";this.value="on";this.disabled=false;this.required=false;this.requiredMessage=r;this.indeterminate=false;this.isInactive=false;this.presentation=false;this.initialChecked=false;this.initialIndeterminate=false;this.formDisabled=false;this.handleActivate=()=>{if(this.isInactive||this.disabled||this.formDisabled||this.presentation)return;if(this.indeterminate)this.indeterminate=false;this.checked=!this.checked;this.dsChange.emit(this.checked)};this.handleKeyDown=o=>{if(o.key==="Enter"||o.key===" "){o.preventDefault();this.handleActivate()}}}componentWillLoad(){this.initialChecked=this.checked;this.initialIndeterminate=this.indeterminate;this.syncFormValue()}syncFormValue(){const o=this.isInactive||this.disabled||this.formDisabled||this.presentation;a(this.internals,this.checked?this.value:null,{inactive:o});const s=this.required&&!o&&!this.checked;d(this.internals,s,this.requiredMessage)}formDisabledCallback(o){this.formDisabled=o;this.syncFormValue()}formResetCallback(){this.checked=this.initialChecked;this.indeterminate=this.initialIndeterminate}render(){const o=this.isInactive||this.disabled||this.formDisabled;const s=this.checked||this.indeterminate;const e=this.required&&!o&&!this.checked;return i(c,{key:"adfff32b3f14338ee80d02eb1a68f9b6f9776288",role:this.presentation?undefined:"checkbox","aria-checked":this.presentation?undefined:this.indeterminate?"mixed":String(this.checked),"aria-disabled":!this.presentation&&o?"true":undefined,"aria-required":!this.presentation&&this.required?"true":undefined,"aria-invalid":!this.presentation&&e?"true":undefined,"aria-labelledby":this.presentation?undefined:this.labelId,"aria-hidden":this.presentation?"true":undefined,tabIndex:this.presentation||o?-1:0,class:{checkbox:true,"checkbox--presentation":this.presentation,[`checkbox--${this.size}`]:true,[`ds-control--${this.size}`]:true,"ds-control-inactive":o&&!this.presentation,"ds-focus-ring-inset":!this.presentation,"ds-interaction-fill":!o&&!this.presentation},onClick:this.presentation?undefined:this.handleActivate,onKeyDown:this.presentation?undefined:this.handleKeyDown},i("span",{key:"8a36cd24e94e559ffb2db67e6910aac0eefe2945",class:"checkbox__placement ds-interaction-fill__content","aria-hidden":"true"},i("span",{key:"526aaad8d9938a36225139b3d515a8388f9e6830",class:{box:true,"box--marked":s}},s&&i("svg",{key:"6c85f0f3e19f683fb0fd997f5009c5f32631419f",class:{checkbox__mark:true,"checkbox__mark--checked":!this.indeterminate},viewBox:"0 0 16 16",fill:"none",focusable:"false"},i("path",{key:"45ef7aa88c193037f0976d9ae771b966664c6670",d:this.indeterminate?"M4 8H12":"M3.5 8.25L6.75 11.5L12.5 4.75","vector-effect":"non-scaling-stroke"})))),!this.presentation&&i("ds-text",{key:"6e4e4dfb7813e423c5bfb75a49e4f217d6fdb730",class:"checkbox__label ds-interaction-fill__content",as:"span",variant:l[this.size],textId:this.labelId},this.label))}static get formAssociated(){return true}static get watchers(){return{checked:[{syncFormValue:0}],value:[{syncFormValue:0}],disabled:[{syncFormValue:0}],isInactive:[{syncFormValue:0}],required:[{syncFormValue:0}],presentation:[{syncFormValue:0}]}}static get style(){return h()}},[66,"ds-checkbox",{label:[1],checked:[1028],size:[1],name:[513],value:[1],disabled:[516],required:[516],requiredMessage:[1,"required-message"],indeterminate:[1028],isInactive:[4,"is-inactive"],presentation:[4],formDisabled:[32]},undefined,{checked:[{syncFormValue:0}],value:[{syncFormValue:0}],disabled:[{syncFormValue:0}],isInactive:[{syncFormValue:0}],required:[{syncFormValue:0}],presentation:[{syncFormValue:0}]}]);function v(){if(typeof customElements==="undefined"){return}const o=["ds-checkbox","ds-text"];o.forEach((o=>{switch(o){case"ds-checkbox":if(!customElements.get(n(o))){customElements.define(n(o),f)}break;case"ds-text":if(!customElements.get(n(o))){t()}break}}))}v();export{f as C,v as d};
+//# sourceMappingURL=p-B9p6w-_T.js.map

package/dist/components/{p-z5RIrXuX.js.map → p-B9p6w-_T.js.map}

@@ -1 +1 @@
-{"version":3,"names":["checkboxCss","idCounter","Checkbox","__stencil_proxyCustomElement","HTMLElement","constructor","registerHost","this","labelId","checked","size","value","disabled","required","requiredMessage","DEFAULT_REQUIRED_MESSAGE","indeterminate","isInactive","presentation","initialChecked","initialIndeterminate","formDisabled","handleActivate","dsChange","emit","handleKeyDown","e","key","preventDefault","componentWillLoad","syncFormValue","inactive","setFormControlValue","internals","missing","setRequiredValidity","formDisabledCallback","formResetCallback","render","isMarked","invalid","h","Host","role","undefined","String","tabIndex","class","checkbox","onClick","onKeyDown","box","checkbox__mark","viewBox","fill","focusable","d","as","variant","CONTROL_TEXT_VARIANT","textId","label"],"sources":["src/wc/components/Checkbox/Checkbox.css?tag=ds-checkbox&encapsulation=scoped","src/wc/components/Checkbox/Checkbox.tsx"],"sourcesContent":["@import '../../utils/control-inactive.css';\n@import '../../utils/control-density.css';\n@import '../../utils/focus-ring.css';\n@import '../../utils/interaction-fill.css';\n\n:host {\n  display: inline-flex;\n  align-items: center;\n  box-sizing: border-box;\n  gap: var(--ds-control-gap);\n  height: var(--ds-control-height);\n  padding: 0 var(--ds-control-padding-inline);\n  border-radius: var(--ds-control-radius);\n  cursor: default;\n  user-select: none;\n}\n\n:host(.checkbox--presentation) {\n  width: var(--ds-control-icon);\n  height: var(--ds-control-icon);\n  padding: 0;\n  gap: 0;\n  pointer-events: none;\n}\n\n/* Inactive: `.ds-control-inactive` (50% opacity). */\n\n:host(.checkbox--lg) {\n  --_checkbox-box: var(--dimension-iconography-md);\n  --_checkbox-stroke: var(--dimension-stroke-width-018);\n}\n\n:host(.checkbox--md) {\n  --_checkbox-box: var(--dimension-iconography-sm);\n  --_checkbox-stroke: var(--dimension-stroke-width-015);\n}\n\n:host(.checkbox--sm) {\n  --_checkbox-box: var(--dimension-iconography-xs);\n  --_checkbox-stroke: var(--dimension-stroke-width-012);\n}\n\n:host(.checkbox--xs) {\n  --_checkbox-box: var(--dimension-size-100);\n  --_checkbox-stroke: calc(var(--dimension-stroke-width-base) * 3 / 32);\n}\n\n.checkbox__placement {\n  display: inline-flex;\n  align-items: center;\n  justify-content: center;\n  flex-shrink: 0;\n  width: var(--ds-control-icon);\n  height: var(--ds-control-icon);\n}\n\n.box {\n  display: inline-flex;\n  align-items: center;\n  justify-content: center;\n  box-sizing: border-box;\n  width: var(--_checkbox-box);\n  height: var(--_checkbox-box);\n  border: 0;\n  border-radius: var(--dimension-radius-025);\n  box-shadow: inset 0 0 0 var(--_checkbox-stroke) var(--color-foreground-tertiary);\n  transition:\n    background-color var(--effect-motion-short-2),\n    box-shadow var(--effect-motion-short-2);\n}\n\n.box--marked {\n  color: var(--color-foreground-on-bold-background-primary);\n  background-color: var(--color-background-bold-brand);\n  box-shadow: none;\n}\n\n.checkbox__mark {\n  width: 100%;\n  height: 100%;\n  flex-shrink: 0;\n  stroke: currentColor;\n  stroke-width: var(--_checkbox-stroke);\n  stroke-linecap: butt;\n  stroke-linejoin: round;\n}\n\n.checkbox__mark--checked {\n  transform: translateY(-0.5px);\n}\n\n.checkbox__label {\n  flex: 1;\n  min-width: 0;\n  padding: 0 var(--ds-control-label-inset);\n}\n","import { AttachInternals, Component, Prop, State, Event, EventEmitter, Watch, h, Host } from '@stencil/core';\nimport {\n  CONTROL_TEXT_VARIANT,\n  DEFAULT_REQUIRED_MESSAGE,\n  setFormControlValue,\n  setRequiredValidity,\n} from '../../utils';\n\nexport type CheckboxSize = 'lg' | 'md' | 'sm' | 'xs';\n\nlet idCounter = 0;\n\n@Component({\n  tag: 'ds-checkbox',\n  styleUrl: 'Checkbox.css',\n  scoped: true,\n  formAssociated: true,\n})\nexport class Checkbox {\n  @AttachInternals() internals!: ElementInternals;\n  private labelId = `ds-checkbox-label-${++idCounter}`;\n\n  /** Visible label and accessible name. Omitted only in presentation mode. */\n  @Prop() label!: string;\n  /** Current checked state. */\n  @Prop({ mutable: true }) checked: boolean = false;\n  /** Visual and placement density. */\n  @Prop() size: CheckboxSize = 'md';\n  /** Native form field name. */\n  @Prop({ reflect: true }) name: string | undefined;\n  /** Submitted value when checked. */\n  @Prop() value: string = 'on';\n  /** Native disabled state. */\n  @Prop({ reflect: true }) disabled: boolean = false;\n  /** Require the checkbox to be checked for form validity. */\n  @Prop({ reflect: true }) required: boolean = false;\n  /** Validation message used when a required checkbox is unchecked. */\n  @Prop() requiredMessage: string = DEFAULT_REQUIRED_MESSAGE;\n  /** Mixed visual state. Activation clears it before toggling checked. */\n  @Prop({ mutable: true }) indeterminate: boolean = false;\n  /** Design-system inactive state. */\n  @Prop() isInactive: boolean = false;\n  /** Visual-only indicator for a composite control that owns selection semantics. */\n  @Prop() presentation: boolean = false;\n\n  /** Emitted after user activation with the new checked state. */\n  @Event() dsChange!: EventEmitter<boolean>;\n\n  private initialChecked = false;\n  private initialIndeterminate = false;\n  @State() private formDisabled = false;\n\n  componentWillLoad() {\n    this.initialChecked = this.checked;\n    this.initialIndeterminate = this.indeterminate;\n    this.syncFormValue();\n  }\n\n  @Watch('checked')\n  @Watch('value')\n  @Watch('disabled')\n  @Watch('isInactive')\n  @Watch('required')\n  @Watch('presentation')\n  syncFormValue() {\n    const inactive = this.isInactive || this.disabled || this.formDisabled || this.presentation;\n    setFormControlValue(this.internals, this.checked ? this.value : null, { inactive });\n    const missing = this.required && !inactive && !this.checked;\n    setRequiredValidity(this.internals, missing, this.requiredMessage);\n  }\n\n  formDisabledCallback(disabled: boolean) {\n    this.formDisabled = disabled;\n    this.syncFormValue();\n  }\n\n  formResetCallback() {\n    this.checked = this.initialChecked;\n    this.indeterminate = this.initialIndeterminate;\n  }\n\n  private handleActivate = () => {\n    if (this.isInactive || this.disabled || this.formDisabled || this.presentation) return;\n    if (this.indeterminate) this.indeterminate = false;\n    this.checked = !this.checked;\n    this.dsChange.emit(this.checked);\n  };\n\n  private handleKeyDown = (e: KeyboardEvent) => {\n    if (e.key === 'Enter' || e.key === ' ') {\n      e.preventDefault();\n      this.handleActivate();\n    }\n  };\n\n  render() {\n    const inactive = this.isInactive || this.disabled || this.formDisabled;\n    const isMarked = this.checked || this.indeterminate;\n    const invalid = this.required && !inactive && !this.checked;\n\n    return (\n      <Host\n        role={this.presentation ? undefined : 'checkbox'}\n        aria-checked={this.presentation ? undefined : this.indeterminate ? 'mixed' : String(this.checked)}\n        aria-disabled={!this.presentation && inactive ? 'true' : undefined}\n        aria-required={!this.presentation && this.required ? 'true' : undefined}\n        aria-invalid={!this.presentation && invalid ? 'true' : undefined}\n        aria-labelledby={this.presentation ? undefined : this.labelId}\n        aria-hidden={this.presentation ? 'true' : undefined}\n        tabIndex={this.presentation || inactive ? -1 : 0}\n        class={{\n          checkbox: true,\n          'checkbox--presentation': this.presentation,\n          [`checkbox--${this.size}`]: true,\n          [`ds-control--${this.size}`]: true,\n          'ds-control-inactive': inactive && !this.presentation,\n          'ds-focus-ring-inset': !this.presentation,\n          'ds-interaction-fill': !inactive && !this.presentation,\n        }}\n        onClick={this.presentation ? undefined : this.handleActivate}\n        onKeyDown={this.presentation ? undefined : this.handleKeyDown}\n      >\n        <span class=\"checkbox__placement ds-interaction-fill__content\" aria-hidden=\"true\">\n          <span class={{ box: true, 'box--marked': isMarked }}>\n            {isMarked && (\n              // eslint-disable-next-line local/prefer-ds-icon -- Checkbox owns this density-specific state mark and its optical stroke.\n              <svg\n                class={{\n                  checkbox__mark: true,\n                  'checkbox__mark--checked': !this.indeterminate,\n                }}\n                viewBox=\"0 0 16 16\"\n                fill=\"none\"\n                focusable=\"false\"\n              >\n                <path\n                  d={this.indeterminate ? 'M4 8H12' : 'M3.5 8.25L6.75 11.5L12.5 4.75'}\n                  vector-effect=\"non-scaling-stroke\"\n                />\n              </svg>\n            )}\n          </span>\n        </span>\n        {!this.presentation && (\n          <ds-text\n            class=\"checkbox__label ds-interaction-fill__content\"\n            as=\"span\"\n            variant={CONTROL_TEXT_VARIANT[this.size]}\n            textId={this.labelId}\n          >\n            {this.label}\n          </ds-text>\n        )}\n      </Host>\n    );\n  }\n}\n"],"mappings":"yNAAA,MAAMA,EAAc,IAAM,4tUCU1B,IAAIC,EAAY,E,MAQHC,EAAQC,EAAA,MAAAD,UAAAE,EANrB,WAAAC,CAAAC,G,mHAQUC,KAAAC,QAAU,uBAAuBP,IAKhBM,KAAAE,QAAmB,MAEpCF,KAAAG,KAAqB,KAIrBH,KAAAI,MAAgB,KAECJ,KAAAK,SAAoB,MAEpBL,KAAAM,SAAoB,MAErCN,KAAAO,gBAA0BC,EAETR,KAAAS,cAAyB,MAE1CT,KAAAU,WAAsB,MAEtBV,KAAAW,aAAwB,MAKxBX,KAAAY,eAAiB,MACjBZ,KAAAa,qBAAuB,MACdb,KAAAc,aAAe,MA+BxBd,KAAAe,eAAiB,KACvB,GAAIf,KAAKU,YAAcV,KAAKK,UAAYL,KAAKc,cAAgBd,KAAKW,aAAc,OAChF,GAAIX,KAAKS,cAAeT,KAAKS,cAAgB,MAC7CT,KAAKE,SAAWF,KAAKE,QACrBF,KAAKgB,SAASC,KAAKjB,KAAKE,QAAQ,EAG1BF,KAAAkB,cAAiBC,IACvB,GAAIA,EAAEC,MAAQ,SAAWD,EAAEC,MAAQ,IAAK,CACtCD,EAAEE,iBACFrB,KAAKe,gB,EAiEV,CAxGC,iBAAAO,GACEtB,KAAKY,eAAiBZ,KAAKE,QAC3BF,KAAKa,qBAAuBb,KAAKS,cACjCT,KAAKuB,e,CASP,aAAAA,GACE,MAAMC,EAAWxB,KAAKU,YAAcV,KAAKK,UAAYL,KAAKc,cAAgBd,KAAKW,aAC/Ec,EAAoBzB,KAAK0B,UAAW1B,KAAKE,QAAUF,KAAKI,MAAQ,KAAM,CAAEoB,aACxE,MAAMG,EAAU3B,KAAKM,WAAakB,IAAaxB,KAAKE,QACpD0B,EAAoB5B,KAAK0B,UAAWC,EAAS3B,KAAKO,gB,CAGpD,oBAAAsB,CAAqBxB,GACnBL,KAAKc,aAAeT,EACpBL,KAAKuB,e,CAGP,iBAAAO,GACE9B,KAAKE,QAAUF,KAAKY,eACpBZ,KAAKS,cAAgBT,KAAKa,oB,CAiB5B,MAAAkB,GACE,MAAMP,EAAWxB,KAAKU,YAAcV,KAAKK,UAAYL,KAAKc,aAC1D,MAAMkB,EAAWhC,KAAKE,SAAWF,KAAKS,cACtC,MAAMwB,EAAUjC,KAAKM,WAAakB,IAAaxB,KAAKE,QAEpD,OACEgC,EAACC,EAAI,CAAAf,IAAA,2CACHgB,KAAMpC,KAAKW,aAAe0B,UAAY,WAAU,eAClCrC,KAAKW,aAAe0B,UAAYrC,KAAKS,cAAgB,QAAU6B,OAAOtC,KAAKE,SAAQ,iBACjFF,KAAKW,cAAgBa,EAAW,OAASa,UAAS,iBAClDrC,KAAKW,cAAgBX,KAAKM,SAAW,OAAS+B,UAAS,gBACxDrC,KAAKW,cAAgBsB,EAAU,OAASI,UAAS,kBAC/CrC,KAAKW,aAAe0B,UAAYrC,KAAKC,QAAO,cAChDD,KAAKW,aAAe,OAAS0B,UAC1CE,SAAUvC,KAAKW,cAAgBa,GAAW,EAAK,EAC/CgB,MAAO,CACLC,SAAU,KACV,yBAA0BzC,KAAKW,aAC/B,CAAC,aAAaX,KAAKG,QAAS,KAC5B,CAAC,eAAeH,KAAKG,QAAS,KAC9B,sBAAuBqB,IAAaxB,KAAKW,aACzC,uBAAwBX,KAAKW,aAC7B,uBAAwBa,IAAaxB,KAAKW,cAE5C+B,QAAS1C,KAAKW,aAAe0B,UAAYrC,KAAKe,eAC9C4B,UAAW3C,KAAKW,aAAe0B,UAAYrC,KAAKkB,eAEhDgB,EAAA,QAAAd,IAAA,2CAAMoB,MAAM,mDAAkD,cAAa,QACzEN,EAAA,QAAAd,IAAA,2CAAMoB,MAAO,CAAEI,IAAK,KAAM,cAAeZ,IACtCA,GAECE,EAAA,OAAAd,IAAA,2CACEoB,MAAO,CACLK,eAAgB,KAChB,2BAA4B7C,KAAKS,eAEnCqC,QAAQ,YACRC,KAAK,OACLC,UAAU,SAEVd,EAAA,QAAAd,IAAA,2CACE6B,EAAGjD,KAAKS,cAAgB,UAAY,gCAA+B,gBACrD,2BAMtBT,KAAKW,cACLuB,EAAA,WAAAd,IAAA,2CACEoB,MAAM,+CACNU,GAAG,OACHC,QAASC,EAAqBpD,KAAKG,MACnCkD,OAAQrD,KAAKC,SAEZD,KAAKsD,O","ignoreList":[]}
+{"version":3,"names":["checkboxCss","idCounter","Checkbox","__stencil_proxyCustomElement","HTMLElement","constructor","registerHost","this","labelId","checked","size","value","disabled","required","requiredMessage","DEFAULT_REQUIRED_MESSAGE","indeterminate","isInactive","presentation","initialChecked","initialIndeterminate","formDisabled","handleActivate","dsChange","emit","handleKeyDown","e","key","preventDefault","componentWillLoad","syncFormValue","inactive","setFormControlValue","internals","missing","setRequiredValidity","formDisabledCallback","formResetCallback","render","isMarked","invalid","h","Host","role","undefined","String","tabIndex","class","checkbox","onClick","onKeyDown","box","checkbox__mark","viewBox","fill","focusable","d","as","variant","CONTROL_TEXT_VARIANT","textId","label"],"sources":["src/wc/components/Checkbox/Checkbox.css?tag=ds-checkbox&encapsulation=scoped","src/wc/components/Checkbox/Checkbox.tsx"],"sourcesContent":["@import '../../utils/control-inactive.css';\n@import '../../utils/control-density.css';\n@import '../../utils/focus-ring.css';\n@import '../../utils/interaction-fill.css';\n\n:host {\n  display: inline-flex;\n  align-items: center;\n  box-sizing: border-box;\n  gap: var(--ds-control-gap);\n  height: var(--ds-control-height);\n  padding: 0 var(--ds-control-padding-inline);\n  border-radius: var(--ds-control-radius);\n  cursor: default;\n  user-select: none;\n}\n\n:host(.checkbox--presentation) {\n  width: var(--ds-control-icon);\n  height: var(--ds-control-icon);\n  padding: 0;\n  gap: 0;\n  pointer-events: none;\n}\n\n/* Inactive: `.ds-control-inactive` (50% opacity). */\n\n:host(.checkbox--lg) {\n  --_checkbox-box: var(--dimension-iconography-md);\n  --_checkbox-stroke: var(--dimension-stroke-width-018);\n}\n\n:host(.checkbox--md) {\n  --_checkbox-box: var(--dimension-iconography-sm);\n  --_checkbox-stroke: var(--dimension-stroke-width-015);\n}\n\n:host(.checkbox--sm) {\n  --_checkbox-box: var(--dimension-iconography-xs);\n  --_checkbox-stroke: var(--dimension-stroke-width-012);\n}\n\n:host(.checkbox--xs) {\n  --_checkbox-box: var(--dimension-size-100);\n  --_checkbox-stroke: calc(var(--dimension-stroke-width-base) * 3 / 32);\n}\n\n.checkbox__placement {\n  display: inline-flex;\n  align-items: center;\n  justify-content: center;\n  flex-shrink: 0;\n  width: var(--ds-control-icon);\n  height: var(--ds-control-icon);\n}\n\n.box {\n  display: inline-flex;\n  align-items: center;\n  justify-content: center;\n  box-sizing: border-box;\n  width: var(--_checkbox-box);\n  height: var(--_checkbox-box);\n  border: 0;\n  border-radius: var(--dimension-radius-025);\n  box-shadow: inset 0 0 0 var(--_checkbox-stroke) var(--color-foreground-tertiary);\n  transition:\n    background-color var(--effect-motion-short-2),\n    box-shadow var(--effect-motion-short-2);\n}\n\n.box--marked {\n  color: var(--color-foreground-on-bold-background-primary);\n  background-color: var(--color-background-bold-brand);\n  box-shadow: none;\n}\n\n.checkbox__mark {\n  width: 100%;\n  height: 100%;\n  flex-shrink: 0;\n  stroke: currentColor;\n  stroke-width: var(--_checkbox-stroke);\n  stroke-linecap: butt;\n  stroke-linejoin: round;\n}\n\n.checkbox__mark--checked {\n  transform: translateY(-0.5px);\n}\n\n.checkbox__label {\n  flex: 1;\n  min-width: 0;\n  padding: 0 var(--ds-control-label-inset);\n}\n","import { AttachInternals, Component, Prop, State, Event, EventEmitter, Watch, h, Host } from '@stencil/core';\nimport {\n  CONTROL_TEXT_VARIANT,\n  DEFAULT_REQUIRED_MESSAGE,\n  setFormControlValue,\n  setRequiredValidity,\n} from '../../utils';\n\nexport type CheckboxSize = 'lg' | 'md' | 'sm' | 'xs';\n\nlet idCounter = 0;\n\n@Component({\n  tag: 'ds-checkbox',\n  styleUrl: 'Checkbox.css',\n  scoped: true,\n  formAssociated: true,\n})\nexport class Checkbox {\n  @AttachInternals() internals!: ElementInternals;\n  private labelId = `ds-checkbox-label-${++idCounter}`;\n\n  /** Visible label and accessible name. Omitted only in presentation mode. */\n  @Prop() label!: string;\n  /** Current checked state. */\n  @Prop({ mutable: true }) checked: boolean = false;\n  /** Visual and placement density. */\n  @Prop() size: CheckboxSize = 'md';\n  /** Native form field name. */\n  @Prop({ reflect: true }) name: string | undefined;\n  /** Submitted value when checked. */\n  @Prop() value: string = 'on';\n  /** Native disabled state. */\n  @Prop({ reflect: true }) disabled: boolean = false;\n  /** Require the checkbox to be checked for form validity. */\n  @Prop({ reflect: true }) required: boolean = false;\n  /** Validation message used when a required checkbox is unchecked. */\n  @Prop() requiredMessage: string = DEFAULT_REQUIRED_MESSAGE;\n  /** Mixed visual state. Activation clears it before toggling checked. */\n  @Prop({ mutable: true }) indeterminate: boolean = false;\n  /** Design-system inactive state. */\n  @Prop() isInactive: boolean = false;\n  /** Visual-only indicator for a composite control that owns selection semantics. */\n  @Prop() presentation: boolean = false;\n\n  /** Emitted after user activation with the new checked state. */\n  @Event() dsChange!: EventEmitter<boolean>;\n\n  private initialChecked = false;\n  private initialIndeterminate = false;\n  @State() private formDisabled = false;\n\n  componentWillLoad() {\n    this.initialChecked = this.checked;\n    this.initialIndeterminate = this.indeterminate;\n    this.syncFormValue();\n  }\n\n  @Watch('checked')\n  @Watch('value')\n  @Watch('disabled')\n  @Watch('isInactive')\n  @Watch('required')\n  @Watch('presentation')\n  syncFormValue() {\n    const inactive = this.isInactive || this.disabled || this.formDisabled || this.presentation;\n    setFormControlValue(this.internals, this.checked ? this.value : null, { inactive });\n    const missing = this.required && !inactive && !this.checked;\n    setRequiredValidity(this.internals, missing, this.requiredMessage);\n  }\n\n  formDisabledCallback(disabled: boolean) {\n    this.formDisabled = disabled;\n    this.syncFormValue();\n  }\n\n  formResetCallback() {\n    this.checked = this.initialChecked;\n    this.indeterminate = this.initialIndeterminate;\n  }\n\n  private handleActivate = () => {\n    if (this.isInactive || this.disabled || this.formDisabled || this.presentation) return;\n    if (this.indeterminate) this.indeterminate = false;\n    this.checked = !this.checked;\n    this.dsChange.emit(this.checked);\n  };\n\n  private handleKeyDown = (e: KeyboardEvent) => {\n    if (e.key === 'Enter' || e.key === ' ') {\n      e.preventDefault();\n      this.handleActivate();\n    }\n  };\n\n  render() {\n    const inactive = this.isInactive || this.disabled || this.formDisabled;\n    const isMarked = this.checked || this.indeterminate;\n    const invalid = this.required && !inactive && !this.checked;\n\n    return (\n      <Host\n        role={this.presentation ? undefined : 'checkbox'}\n        aria-checked={this.presentation ? undefined : this.indeterminate ? 'mixed' : String(this.checked)}\n        aria-disabled={!this.presentation && inactive ? 'true' : undefined}\n        aria-required={!this.presentation && this.required ? 'true' : undefined}\n        aria-invalid={!this.presentation && invalid ? 'true' : undefined}\n        aria-labelledby={this.presentation ? undefined : this.labelId}\n        aria-hidden={this.presentation ? 'true' : undefined}\n        tabIndex={this.presentation || inactive ? -1 : 0}\n        class={{\n          checkbox: true,\n          'checkbox--presentation': this.presentation,\n          [`checkbox--${this.size}`]: true,\n          [`ds-control--${this.size}`]: true,\n          'ds-control-inactive': inactive && !this.presentation,\n          'ds-focus-ring-inset': !this.presentation,\n          'ds-interaction-fill': !inactive && !this.presentation,\n        }}\n        onClick={this.presentation ? undefined : this.handleActivate}\n        onKeyDown={this.presentation ? undefined : this.handleKeyDown}\n      >\n        <span class=\"checkbox__placement ds-interaction-fill__content\" aria-hidden=\"true\">\n          <span class={{ box: true, 'box--marked': isMarked }}>\n            {isMarked && (\n              // eslint-disable-next-line local/prefer-ds-icon -- Checkbox owns this density-specific state mark and its optical stroke.\n              <svg\n                class={{\n                  checkbox__mark: true,\n                  'checkbox__mark--checked': !this.indeterminate,\n                }}\n                viewBox=\"0 0 16 16\"\n                fill=\"none\"\n                focusable=\"false\"\n              >\n                <path\n                  d={this.indeterminate ? 'M4 8H12' : 'M3.5 8.25L6.75 11.5L12.5 4.75'}\n                  vector-effect=\"non-scaling-stroke\"\n                />\n              </svg>\n            )}\n          </span>\n        </span>\n        {!this.presentation && (\n          <ds-text\n            class=\"checkbox__label ds-interaction-fill__content\"\n            as=\"span\"\n            variant={CONTROL_TEXT_VARIANT[this.size]}\n            textId={this.labelId}\n          >\n            {this.label}\n          </ds-text>\n        )}\n      </Host>\n    );\n  }\n}\n"],"mappings":"yNAAA,MAAMA,EAAc,IAAM,qvUCU1B,IAAIC,EAAY,E,MAQHC,EAAQC,EAAA,MAAAD,UAAAE,EANrB,WAAAC,CAAAC,G,mHAQUC,KAAAC,QAAU,uBAAuBP,IAKhBM,KAAAE,QAAmB,MAEpCF,KAAAG,KAAqB,KAIrBH,KAAAI,MAAgB,KAECJ,KAAAK,SAAoB,MAEpBL,KAAAM,SAAoB,MAErCN,KAAAO,gBAA0BC,EAETR,KAAAS,cAAyB,MAE1CT,KAAAU,WAAsB,MAEtBV,KAAAW,aAAwB,MAKxBX,KAAAY,eAAiB,MACjBZ,KAAAa,qBAAuB,MACdb,KAAAc,aAAe,MA+BxBd,KAAAe,eAAiB,KACvB,GAAIf,KAAKU,YAAcV,KAAKK,UAAYL,KAAKc,cAAgBd,KAAKW,aAAc,OAChF,GAAIX,KAAKS,cAAeT,KAAKS,cAAgB,MAC7CT,KAAKE,SAAWF,KAAKE,QACrBF,KAAKgB,SAASC,KAAKjB,KAAKE,QAAQ,EAG1BF,KAAAkB,cAAiBC,IACvB,GAAIA,EAAEC,MAAQ,SAAWD,EAAEC,MAAQ,IAAK,CACtCD,EAAEE,iBACFrB,KAAKe,gB,EAiEV,CAxGC,iBAAAO,GACEtB,KAAKY,eAAiBZ,KAAKE,QAC3BF,KAAKa,qBAAuBb,KAAKS,cACjCT,KAAKuB,e,CASP,aAAAA,GACE,MAAMC,EAAWxB,KAAKU,YAAcV,KAAKK,UAAYL,KAAKc,cAAgBd,KAAKW,aAC/Ec,EAAoBzB,KAAK0B,UAAW1B,KAAKE,QAAUF,KAAKI,MAAQ,KAAM,CAAEoB,aACxE,MAAMG,EAAU3B,KAAKM,WAAakB,IAAaxB,KAAKE,QACpD0B,EAAoB5B,KAAK0B,UAAWC,EAAS3B,KAAKO,gB,CAGpD,oBAAAsB,CAAqBxB,GACnBL,KAAKc,aAAeT,EACpBL,KAAKuB,e,CAGP,iBAAAO,GACE9B,KAAKE,QAAUF,KAAKY,eACpBZ,KAAKS,cAAgBT,KAAKa,oB,CAiB5B,MAAAkB,GACE,MAAMP,EAAWxB,KAAKU,YAAcV,KAAKK,UAAYL,KAAKc,aAC1D,MAAMkB,EAAWhC,KAAKE,SAAWF,KAAKS,cACtC,MAAMwB,EAAUjC,KAAKM,WAAakB,IAAaxB,KAAKE,QAEpD,OACEgC,EAACC,EAAI,CAAAf,IAAA,2CACHgB,KAAMpC,KAAKW,aAAe0B,UAAY,WAAU,eAClCrC,KAAKW,aAAe0B,UAAYrC,KAAKS,cAAgB,QAAU6B,OAAOtC,KAAKE,SAAQ,iBACjFF,KAAKW,cAAgBa,EAAW,OAASa,UAAS,iBAClDrC,KAAKW,cAAgBX,KAAKM,SAAW,OAAS+B,UAAS,gBACxDrC,KAAKW,cAAgBsB,EAAU,OAASI,UAAS,kBAC/CrC,KAAKW,aAAe0B,UAAYrC,KAAKC,QAAO,cAChDD,KAAKW,aAAe,OAAS0B,UAC1CE,SAAUvC,KAAKW,cAAgBa,GAAW,EAAK,EAC/CgB,MAAO,CACLC,SAAU,KACV,yBAA0BzC,KAAKW,aAC/B,CAAC,aAAaX,KAAKG,QAAS,KAC5B,CAAC,eAAeH,KAAKG,QAAS,KAC9B,sBAAuBqB,IAAaxB,KAAKW,aACzC,uBAAwBX,KAAKW,aAC7B,uBAAwBa,IAAaxB,KAAKW,cAE5C+B,QAAS1C,KAAKW,aAAe0B,UAAYrC,KAAKe,eAC9C4B,UAAW3C,KAAKW,aAAe0B,UAAYrC,KAAKkB,eAEhDgB,EAAA,QAAAd,IAAA,2CAAMoB,MAAM,mDAAkD,cAAa,QACzEN,EAAA,QAAAd,IAAA,2CAAMoB,MAAO,CAAEI,IAAK,KAAM,cAAeZ,IACtCA,GAECE,EAAA,OAAAd,IAAA,2CACEoB,MAAO,CACLK,eAAgB,KAChB,2BAA4B7C,KAAKS,eAEnCqC,QAAQ,YACRC,KAAK,OACLC,UAAU,SAEVd,EAAA,QAAAd,IAAA,2CACE6B,EAAGjD,KAAKS,cAAgB,UAAY,gCAA+B,gBACrD,2BAMtBT,KAAKW,cACLuB,EAAA,WAAAd,IAAA,2CACEoB,MAAM,+CACNU,GAAG,OACHC,QAASC,EAAqBpD,KAAKG,MACnCkD,OAAQrD,KAAKC,SAEZD,KAAKsD,O","ignoreList":[]}

package/dist/components/p-BBFEhNzM.js

@@ -0,0 +1,2 @@
+import{p as e,H as i,c as s,h as n,a as t,t as o}from"./index.js";import{A as r}from"./p-BBxcMVqk.js";import{d as c}from"./p-BsoqsbBh.js";import{d}from"./p-BO4cj3iX.js";import{d as a}from"./p-BYWkksDO.js";import{d as l}from"./p-Ay1AX7Ql.js";import{a as h,T as u}from"./p-C4uYvyq6.js";import{c as m,r as f}from"./p-DhKvqh5G.js";import{r as p}from"./p-BJMRBHKW.js";import{a as v}from"./p-B6Vuayt6.js";import{a as g,C as b}from"./p-CuwopElg.js";function x(e){return"variant"in e&&e.variant==="swatch-picker"}function w(e){return x(e)}function y(e){return e.map((e=>{if(x(e)){return{...e,...e.options?{options:e.options.map((e=>({...e})))}:{},...e.sections?{sections:e.sections.map((e=>({...e,options:e.options.map((e=>({...e})))})))}:{}}}return{...e,items:e.items.map((e=>({...e})))}}))}const k=()=>`.sc-ds-menu-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-menu-h,.ds-focus-ring.sc-ds-menu,.ds-focus-ring-inset.sc-ds-menu-h,.ds-focus-ring-inset.sc-ds-menu{outline:none;-webkit-tap-highlight-color:transparent;touch-action:manipulation}.ds-focus-ring.sc-ds-menu-h:focus-visible,.ds-focus-ring.sc-ds-menu: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-menu-h,.ds-focus-ring.ds-focus-ring--visible.sc-ds-menu{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-menu-h:focus-visible,.ds-focus-ring-inset.sc-ds-menu:focus-visible{outline:none}.ds-focus-ring-inset.sc-ds-menu-h:focus-visible::after,.ds-focus-ring-inset.sc-ds-menu: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-menu-h,.ds-focus-ring-inset.ds-focus-ring--visible.sc-ds-menu{outline:none}.ds-focus-ring-inset.ds-focus-ring--visible.sc-ds-menu-h::after,.ds-focus-ring-inset.ds-focus-ring--visible.sc-ds-menu::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-menu-h,.ds-interaction-fill.sc-ds-menu{position:relative;z-index:0;cursor:default;--ds-interaction-hover:var(--color-interaction-hover);--ds-interaction-pressed:var(--color-interaction-pressed);--ds-interaction-active:var(--color-interaction-active-brand);--ds-interaction-border-width:0px;--ds-interaction-border-color:transparent}.ds-interaction-fill.sc-ds-menu-h::before,.ds-interaction-fill.sc-ds-menu::before,.ds-interaction-fill.sc-ds-menu-h::after,.ds-interaction-fill.sc-ds-menu::after{content:'';position:absolute;inset:0;border-radius:inherit;background:transparent;pointer-events:none;cursor:inherit;transition:none}.ds-interaction-fill.sc-ds-menu-h::before,.ds-interaction-fill.sc-ds-menu::before{z-index:1}.ds-interaction-fill.sc-ds-menu-h::after,.ds-interaction-fill.sc-ds-menu::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-menu-h,.ds-interaction-fill--bordered.sc-ds-menu{--ds-interaction-border-width:var(--dimension-stroke-width-012);--ds-interaction-border-color:var(--color-border-secondary)}.ds-interaction-fill--selected.sc-ds-menu-h::before,.ds-interaction-fill--selected.sc-ds-menu::before{background:var(--ds-interaction-active)}.ds-interaction-fill--selected.sc-ds-menu-h,.ds-interaction-fill--selected.sc-ds-menu{--ds-interaction-dot-ring:var(--ds-interaction-active)}@media (hover: hover) and (pointer: fine){.ds-interaction-fill.sc-ds-menu-h:hover:not(:disabled)::after,.ds-interaction-fill.sc-ds-menu:hover:not(:disabled)::after{background:var(--ds-interaction-hover)}}.ds-interaction-fill.sc-ds-menu-h:active:not(:disabled)::after,.ds-interaction-fill.sc-ds-menu:active:not(:disabled)::after{background:var(--ds-interaction-pressed)}.ds-interaction-fill.sc-ds-menu-h>.ds-interaction-fill__content.sc-ds-menu,.ds-interaction-fill.sc-ds-menu>.ds-interaction-fill__content.sc-ds-menu,.ds-interaction-fill__content.sc-ds-menu{position:relative;z-index:2;cursor:inherit}.ds-interaction-fill--on-faint.sc-ds-menu-h,.ds-interaction-fill--on-faint.sc-ds-menu{--ds-interaction-active:var(--color-interaction-active)}.ds-interaction-fill--on-medium.sc-ds-menu-h,.ds-interaction-fill--on-medium.sc-ds-menu{--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-menu-h,.ds-interaction-fill--on-bold.sc-ds-menu{--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-menu-h,.ds-interaction-fill--on-strong.sc-ds-menu{--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-menu-h,.ds-interaction-fill--on-translucent.sc-ds-menu{--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-menu-h,.ds-interaction-fill--on-inverted.sc-ds-menu{--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-menu-h,.ds-interaction-fill--on-media.sc-ds-menu{--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-menu-h,.ds-interaction-fill--on-always-dark.sc-ds-menu{--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-menu-h,.ds-interaction-fill--on-navigation.sc-ds-menu{--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-menu-h,.ds-control-inactive.sc-ds-menu{opacity:var(--effect-opacity-medium);pointer-events:none;cursor:not-allowed}.ds-control--lg.sc-ds-menu,.ds-control--lg.sc-ds-menu-h,.ds-control--md.sc-ds-menu-h,.ds-control--md.sc-ds-menu,.ds-control--sm.sc-ds-menu-h,.ds-control--sm.sc-ds-menu,.ds-control--xs.sc-ds-menu-h,.ds-control--xs.sc-ds-menu{--ds-control-radius:var(--dimension-radius-025)}.ds-control--lg.sc-ds-menu-h,.ds-control--lg.sc-ds-menu{--ds-control-height:var(--dimension-size-500);--ds-control-icon:var(--dimension-iconography-lg);--ds-control-padding-inline:var(--dimension-space-100);--ds-control-label-inset:var(--dimension-space-050);--ds-control-gap:var(--dimension-space-050)}.ds-control--md.sc-ds-menu-h,.ds-control--md.sc-ds-menu{--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-menu-h,.ds-control--sm.sc-ds-menu{--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-menu-h,.ds-control--xs.sc-ds-menu{--ds-control-height:var(--dimension-size-200);--ds-control-icon:var(--dimension-iconography-xs);--ds-control-padding-inline:var(--dimension-space-025);--ds-control-label-inset:var(--dimension-space-025);--ds-control-gap:0}.ds-chrome-space--sm.sc-ds-menu-h,.ds-chrome-space--sm.sc-ds-menu{--ds-chrome-padding:var(--dimension-space-050);--ds-chrome-gap:var(--dimension-space-050)}.ds-chrome-space--md.sc-ds-menu-h,.ds-chrome-space--md.sc-ds-menu{--ds-chrome-padding:var(--dimension-space-100);--ds-chrome-gap:var(--dimension-space-100)}.ds-chrome-space--lg.sc-ds-menu-h,.ds-chrome-space--lg.sc-ds-menu{--ds-chrome-padding:var(--dimension-space-200);--ds-chrome-gap:var(--dimension-space-200)}.ds-chrome-row.sc-ds-menu-h,.ds-chrome-row.sc-ds-menu,.ds-chrome-column.sc-ds-menu-h,.ds-chrome-column.sc-ds-menu,.ds-chrome-grid.sc-ds-menu-h,.ds-chrome-grid.sc-ds-menu{display:flex;box-sizing:border-box;gap:var(--ds-chrome-gap, var(--dimension-space-100));padding:var(--ds-chrome-padding, var(--dimension-space-100))}.ds-chrome-row.sc-ds-menu-h,.ds-chrome-row.sc-ds-menu{flex-direction:row;align-items:center}.ds-chrome-column.sc-ds-menu-h,.ds-chrome-column.sc-ds-menu{flex-direction:column}.ds-chrome-grid.sc-ds-menu-h,.ds-chrome-grid.sc-ds-menu{display:grid;align-items:center}.ds-control-frame.sc-ds-menu{display:inline-flex;align-items:center;box-sizing:border-box;height:var(--ds-control-height, var(--dimension-size-400));padding-inline:var(--ds-control-padding-inline, var(--dimension-space-075));gap:var(--ds-control-gap, var(--dimension-space-050));border-radius:var(--ds-control-radius, var(--dimension-radius-025))}.ds-control-icon-box.sc-ds-menu{display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;width:var(--ds-control-icon, var(--dimension-iconography-md));height:var(--ds-control-icon, var(--dimension-iconography-md))}.ds-control-label-box.sc-ds-menu{min-width:0;padding-inline:var(--ds-control-label-inset, var(--dimension-space-025))}.ds-empty-region.sc-ds-menu{display:flex;flex:1 1 auto;align-items:center;justify-content:center;box-sizing:border-box;min-width:0;min-height:0}.ds-empty-region--padded.sc-ds-menu{padding:var(--dimension-space-200)}.ds-choice-popup.sc-ds-menu{box-sizing:border-box;display:flex;flex-direction:column;min-width:var(--dimension-menu-width-xs);max-width:min(     var(--dimension-panel-width-lg),     calc(100vw - var(--dimension-space-200))   );max-height:calc(100vh - var(--dimension-space-200));overflow:hidden;inset:auto;margin:0;padding:0;border:0;background-color:var(--color-background-primary);border-radius:var(--dimension-radius-075);box-shadow:var(--effect-shadow-elevated-floating);animation:dsChoiceFadeIn var(--effect-motion-short-2) forwards;backface-visibility:hidden;will-change:transform;text-align:start}.ds-choice-popup.sc-ds-menu::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-menu{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-menu{animation:none;opacity:1}.ds-choice-popup--closing.sc-ds-menu{opacity:0}}.ds-choice-list.sc-ds-menu{display:flex;flex-direction:column;min-height:0;overflow-y:auto;overscroll-behavior:contain}.ds-choice-section--divided.sc-ds-menu{border-bottom:var(--dimension-stroke-width-015) solid var(--color-border-tertiary)}ds-text.ds-choice-section__header.sc-ds-menu{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-menu{width:100%;border:none;border-radius:var(--ds-control-radius, var(--dimension-radius-025));background:transparent;cursor:default;-webkit-user-select:none;user-select:none;text-align:left;color:inherit}.ds-choice-item.sc-ds-menu: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-menu{display:flex;flex:1;flex-direction:column;gap:var(--dimension-space-025);min-width:0}ds-text.ds-choice-item__label.sc-ds-menu{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}ds-text.ds-choice-item__subtext.sc-ds-menu{display:-webkit-box;overflow:hidden;white-space:normal;-webkit-box-orient:vertical;-webkit-line-clamp:2}.ds-choice-item__icon.sc-ds-menu,.ds-choice-item__suffix.sc-ds-menu{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-menu,.ds-choice-loading.sc-ds-menu{min-height:var(--dimension-size-600);padding:var(--dimension-space-100)}.ds-choice-footer.sc-ds-menu{position:relative;box-sizing:border-box;padding-block:var(--dimension-space-050)}.ds-choice-footer.sc-ds-menu::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-menu{display:flex;align-items:center;justify-content:space-between;box-sizing:border-box;height:var(--ds-control-height, var(--dimension-size-400))}.ds-choice-footer__summary.sc-ds-menu,.ds-choice-footer__clear.sc-ds-menu ds-text.sc-ds-menu{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-menu{appearance:none;display:inline-flex;align-items:center;padding:0;border:0;border-radius:var(--dimension-radius-025);background:transparent;color:var(--color-foreground-bold-brand);cursor:default}.ds-choice-footer__clear.sc-ds-menu:hover{text-decoration:underline;text-decoration-color:var(--color-foreground-tertiary)}.menu-item--destructive.sc-ds-menu .menu-item__label.sc-ds-menu{color:var(--color-foreground-bold-negative) !important}.menu-item__dot-box.sc-ds-menu{display: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}.menu-item__switch.sc-ds-menu{flex-shrink:0}`;const _=["a[href]","button:not([disabled])",'input:not([disabled]):not([type="hidden"])',"select:not([disabled])","textarea:not([disabled])",'[tabindex]:not([tabindex="-1"])'].join(",");const P=e(class e extends i{constructor(e){super();if(e!==false){this.__registerHost()}this.dsClose=s(this,"dsClose");this.dsAfterClose=s(this,"dsAfterClose");this.dsSelect=s(this,"dsSelect");this.dsSwatchSelect=s(this,"dsSwatchSelect");this.open=false;this.items=[];this.size="md";this.selectionMode="none";this.sections=[];this.side="bottom";this.align="start";this.anchorAlignment="choice-cell";this.sideOffset=h.space050;this.alignOffset=0;this.initialFocusVisible=false;this.menuLabel="Menu";this.shouldRender=false;this.closing=false;this.pos={x:0,y:0};this.focusedIndex=0;this.positionReady=false;this.focusRingVisible=false;this.clickOutsideHandler=null;this.closeTimer=null;this.position=new r({getAnchor:()=>this.resolvedAnchor??null,getPopup:()=>this.el.querySelector(".menu-popup"),measure:(e,i)=>{if(!this.open)return null;const s=e.getBoundingClientRect();const n=this.viewportPadPx;if(!this.minWidth){if(this.anchorAlignment==="choice-cell"&&(this.side==="top"||this.side==="bottom")){i.style.minWidth=`max(var(--dimension-menu-width-xs), ${m(s.width,n)}px)`}else{i.style.removeProperty("min-width")}}return{anchorRect:s,popupWidth:i.offsetWidth||this.popupFallbackWidthPx,popupHeight:i.offsetHeight||this.popupFallbackHeightPx,side:this.side,align:this.align,sideOffsetPx:this.sideOffsetPx,alignOffsetPx:f({align:this.align,alignOffsetPx:this.alignOffsetPx,sectionInsetPx:n,anchorAlignment:this.anchorAlignment}),viewportPadPx:this.viewportPadPx,viewportWidth:window.innerWidth,viewportHeight:window.innerHeight}},apply:({x:e,y:i})=>{this.pos={x:e,y:i}},onReady:()=>{this.positionReady=true},liveUpdate:"double-frame",topLayer:true});this.lastRenderedSections=[];this.closingSections=null}componentDidLoad(){if(this.open)this.onOpenChange(true)}disconnectedCallback(){this.cancelPositionRetry();this.cancelLivePositionUpdate();this.teardownListeners()}onOpenChange(e){if(e){this.teardownListeners();this.closingSections=null;this.shouldRender=true;this.closing=false;this.positionReady=false;this.focusRingVisible=this.initialFocusVisible;this.setupListeners();this.schedulePositionUpdate((()=>{this.focusInitialItem()}))}else if(this.shouldRender){this.cancelPositionRetry();this.captureClosingSections();this.closing=true;this.teardownListeners();const e=this.closeAnimationMs;if(e<=0){this.finishClose();return}this.closeTimer=setTimeout((()=>{this.closeTimer=null;this.finishClose()}),e)}}onAnchorChange(){if(this.open)this.schedulePositionUpdate()}onPositionPropsChange(){if(this.open)this.schedulePositionUpdate()}get viewportPadPx(){return p(u.space050,u.space050)}get sideOffsetPx(){return p(this.sideOffset,u.space050)}get alignOffsetPx(){return p(this.alignOffset,0)}get popupFallbackWidthPx(){return p(u.menuWidthXs,u.menuWidthXs)}get popupFallbackHeightPx(){return p(u.menuFallbackHeight,u.menuFallbackHeight)}get closeAnimationMs(){return v(u.motionShort2,u.animationDurationShort3)}finishClose(){const e=this.el.querySelector(".menu-popup");if(e?.matches(":popover-open"))e.hidePopover();this.shouldRender=false;this.closing=false;this.lastRenderedSections=[];this.closingSections=null;this.dsAfterClose.emit()}captureClosingSections(){if(this.closingSections)return;const e=this.lastRenderedSections.length?this.lastRenderedSections:this.activeSections;this.closingSections=y(e)}get resolvedAnchor(){if(this.anchor)return this.anchor;if(this.anchorId)return document.getElementById(this.anchorId);return null}get anchorFocusTarget(){const e=this.resolvedAnchor;if(!e)return null;if(e.matches(_))return e;return e.querySelector(_)??e}focusAnchor(){const e=this.resolvedAnchor;if(e?.setFocus){e.setFocus();return}this.anchorFocusTarget?.focus()}moveFocusAfterTab(e){const i=this.anchorFocusTarget;if(!i)return;if(e){i.focus();return}const s=Array.from(document.querySelectorAll(_)).filter((e=>!e.closest(".menu-popup")&&!e.closest("[inert]")&&e.getClientRects().length>0));const n=s.indexOf(i);(s[n+1]??i).focus()}compositeTabLeavesPopup(e){const i=this.el.querySelector(".menu-popup");if(!i)return true;const s=Array.from(i.querySelectorAll(_)).filter((e=>e.getClientRects().length>0));const n=s.indexOf(e.target);if(n<0)return true;return e.shiftKey?n===0:n===s.length-1}get activeSections(){if(this.sections.length>0)return this.sections;if(this.items.length>0)return[{items:this.items}];return[]}get flatItems(){return this.activeSections.flatMap((e=>w(e)?[]:e.items))}get hasCompositeSections(){return this.activeSections.some(w)}cancelPositionRetry(){this.position.cancel()}cancelLivePositionUpdate(){this.position.cancel()}scheduleLivePositionUpdate(){this.position.scheduleLiveUpdate()}schedulePositionUpdate(e){if(!this.open)return;this.positionReady=false;this.position.schedule(e)}calculatePosition(){return this.position.update()}focusInitialItem(){if(this.hasCompositeSections){requestAnimationFrame((()=>{this.el.querySelector('.menu-popup [tabindex="0"]')?.focus()}));return}const e=this.flatItems;const i=e.findIndex((e=>e.isSelected&&!e.isInactive));const s=e.findIndex((e=>!e.isInactive));this.focusedIndex=i>=0?i:s>=0?s:0;requestAnimationFrame((()=>{const e=this.el.querySelectorAll(".menu-item");e[this.focusedIndex]?.focus()}))}setupListeners(){this.clickOutsideHandler=e=>{const i=e.target;const s=this.el.querySelector(".menu-popup");const n=this.resolvedAnchor;if(s?.contains(i)||n?.contains(i))return;this.close()};document.addEventListener("mousedown",this.clickOutsideHandler,true);this.position.observe()}teardownListeners(){this.position.unobserve();if(this.clickOutsideHandler){document.removeEventListener("mousedown",this.clickOutsideHandler,true);this.clickOutsideHandler=null}if(this.closeTimer){clearTimeout(this.closeTimer);this.closeTimer=null}}close(e=true){this.captureClosingSections();if(e)this.focusAnchor();this.dsClose.emit();this.open=false;this.onOpenChange(false)}handleKeyDown(e){if(!this.shouldRender||this.closing)return;if(e.key==="Escape"){e.preventDefault();this.close();return}if(e.key==="Tab"){if(this.hasCompositeSections&&!this.compositeTabLeavesPopup(e))return;e.preventDefault();this.close(false);this.moveFocusAfterTab(e.shiftKey);return}if(this.hasCompositeSections)return;const i=this.flatItems;const s=i.map(((e,i)=>({it:e,i}))).filter((({it:e})=>!e.isInactive)).map((({i:e})=>e));if(!s.length)return;const n=s.indexOf(this.focusedIndex);const t=n<0?0:n;switch(e.key){case"ArrowDown":e.preventDefault();e.stopPropagation();this.focusRingVisible=true;this.focusedIndex=s[(t+1)%s.length];this.focusItem(this.focusedIndex);break;case"ArrowUp":e.preventDefault();e.stopPropagation();this.focusRingVisible=true;this.focusedIndex=s[(t-1+s.length)%s.length];this.focusItem(this.focusedIndex);break;case"Home":e.preventDefault();e.stopPropagation();this.focusRingVisible=true;this.focusedIndex=s[0];this.focusItem(this.focusedIndex);break;case"End":e.preventDefault();e.stopPropagation();this.focusRingVisible=true;this.focusedIndex=s[s.length-1];this.focusItem(this.focusedIndex);break}}focusItem(e){const i=this.el.querySelectorAll(".menu-item");i[e]?.focus()}handleItemClick(e){if(e.isInactive)return;this.captureClosingSections();this.dsSelect.emit(e)}handleSwatchSelect(e){this.dsSwatchSelect.emit(e)}render(){if(!this.shouldRender)return n(t,{style:{display:"contents"}});const e=this.closing?this.closingSections??this.lastRenderedSections:this.activeSections;const i=e.some(w);if(!this.closing){this.lastRenderedSections=y(e);this.closingSections=null}let s=0;const o={position:"fixed",left:"0",top:"0",transform:`translate(${Math.round(this.pos.x)}px, ${Math.round(this.pos.y)}px)`,zIndex:"9998",visibility:this.positionReady?"visible":"hidden"};if(this.menuWidth)o["width"]=this.menuWidth;if(this.minWidth)o["min-width"]=this.minWidth;return n(t,{style:{display:"contents"}},n("div",{popover:"manual",class:{"menu-popup":true,"menu-popup--closing":this.closing,"ds-choice-popup":true,"ds-choice-popup--closing":this.closing},style:o,role:i?"dialog":"menu","aria-label":this.menuLabel,"aria-orientation":i?undefined:"vertical"},n("div",{class:"ds-choice-list"},e.map(((t,o)=>n("div",{key:o,class:{"menu-section":true,"menu-section--divided":o<e.length-1,"menu-section--swatch-picker":w(t),"ds-choice-section":true,"ds-chrome-column":true,"ds-chrome-space--sm":true,"ds-choice-section--divided":o<e.length-1},role:t.header?"group":undefined,"aria-label":t.header},t.header&&n("ds-text",{class:`section-header ds-choice-section__header ds-control--${this.size}`,as:"span",variant:g[this.size],emphasis:true,color:"primary","aria-hidden":"true"},t.header),x(t)?n("ds-swatch-picker",{value:t.value,groupLabel:t.groupLabel??t.header??"Swatch options",options:t.options??[],sections:t.sections??[],onDsChange:e=>{e.stopPropagation();this.handleSwatchSelect(e.detail)}}):t.items.map((e=>{const t=s++;const o=this.focusedIndex===t;const r=!i&&this.selectionMode==="single"&&!e.showSwitch;return n("button",{key:t,type:"button",class:{"menu-item":true,"ds-choice-item":true,"ds-control-frame":true,[`ds-control--${this.size}`]:true,"ds-focus-ring-inset":true,"ds-focus-ring--visible":o&&this.focusRingVisible,"ds-interaction-fill":!e.isInactive,"ds-interaction-fill--selected":!!e.isSelected&&!e.isInactive,"menu-item--selected":!!e.isSelected,"ds-control-inactive":!!e.isInactive,"menu-item--destructive":!!e.isDestructive,"menu-item--focused":o},role:i?undefined:e.showSwitch?"menuitemcheckbox":r?"menuitemradio":"menuitem","aria-checked":!i&&e.showSwitch?String(!!e.switchValue):r?String(!!e.isSelected):undefined,"aria-pressed":i?String(e.showSwitch?!!e.switchValue:!!e.isSelected):undefined,"aria-current":!i&&!e.showSwitch&&!r&&e.isSelected?"true":undefined,disabled:e.isInactive,tabIndex:i?0:o?0:-1,onMouseDown:()=>{this.focusRingVisible=false},onClick:()=>this.handleItemClick(e),onFocus:()=>{this.focusedIndex=t}},n("div",{class:"menu-item__content ds-choice-item__content ds-interaction-fill__content"},n("ds-text",{class:"menu-item__label ds-choice-item__label ds-control-label-box",as:"span",variant:b[this.size],color:e.isSelected?"primary":"secondary"},e.label),e.subtext&&n("ds-text",{class:"menu-item__subtext ds-choice-item__subtext ds-control-label-box",as:"span",variant:g[this.size],color:"secondary"},e.subtext)),e.dot&&n("span",{class:"menu-item__dot-box ds-interaction-fill__content","aria-hidden":"true"},n("ds-badge",{class:"menu-item__dot",variant:"dot",hasRing:false,label:""})),e.showSwitch&&n("ds-switch",{class:"menu-item__switch ds-interaction-fill__content",size:this.size,checked:!!e.switchValue,presentation:true}))}))))))))}get el(){return this}static get watchers(){return{open:[{onOpenChange:0}],anchor:[{onAnchorChange:0}],anchorId:[{onAnchorChange:0}],side:[{onPositionPropsChange:0}],align:[{onPositionPropsChange:0}],anchorAlignment:[{onPositionPropsChange:0}],sideOffset:[{onPositionPropsChange:0}],alignOffset:[{onPositionPropsChange:0}]}}static get style(){return k()}},[2,"ds-menu",{open:[1028],items:[16],size:[1],selectionMode:[1,"selection-mode"],sections:[16],side:[1],align:[1],anchorAlignment:[1,"anchor-alignment"],sideOffset:[8,"side-offset"],alignOffset:[8,"align-offset"],menuWidth:[1,"menu-width"],minWidth:[1,"min-width"],anchor:[16],anchorId:[1,"anchor-id"],initialFocusVisible:[4,"initial-focus-visible"],menuLabel:[1,"menu-label"],shouldRender:[32],closing:[32],pos:[32],focusedIndex:[32],positionReady:[32],focusRingVisible:[32]},[[0,"keydown","handleKeyDown"]],{open:[{onOpenChange:0}],anchor:[{onAnchorChange:0}],anchorId:[{onAnchorChange:0}],side:[{onPositionPropsChange:0}],align:[{onPositionPropsChange:0}],anchorAlignment:[{onPositionPropsChange:0}],sideOffset:[{onPositionPropsChange:0}],alignOffset:[{onPositionPropsChange:0}]}]);function C(){if(typeof customElements==="undefined"){return}const e=["ds-menu","ds-badge","ds-swatch-picker","ds-switch","ds-text"];e.forEach((e=>{switch(e){case"ds-menu":if(!customElements.get(o(e))){customElements.define(o(e),P)}break;case"ds-badge":if(!customElements.get(o(e))){c()}break;case"ds-swatch-picker":if(!customElements.get(o(e))){d()}break;case"ds-switch":if(!customElements.get(o(e))){a()}break;case"ds-text":if(!customElements.get(o(e))){l()}break}}))}C();export{P as M,C as d};
+//# sourceMappingURL=p-BBFEhNzM.js.map