@ds-mo/ui 10.0.0 → 11.1.0

package/dist/components/{p-DhsO0939.js.map → p-BsnezUUC.js.map}

@@ -1 +1 @@
-{"version":3,"names":["computeMenuPosition","computeAnchoredPopupPosition","isMenuGradientPickerSection","section","variant","isMenuSwatchPickerSection","isMenuPickerSection","menuCss","POSITION_RETRY_BUDGET","MENU_FOCUSABLE_SELECTOR","join","snapshotMenuSections","sections","map","options","option","swatchSection","items","item","Menu","__stencil_proxyCustomElement","HTMLElement","constructor","registerHost","this","open","selectionMode","side","align","anchorAlignment","sideOffset","TOKEN_CSS_LENGTHS","space050","alignOffset","initialFocusVisible","menuLabel","shouldRender","closing","pos","x","y","focusedIndex","positionReady","focusRingVisible","clickOutsideHandler","scrollResizeHandler","closeTimer","itemEls","positionRetryRaf","listenersReady","lastRenderedSections","closingSections","componentDidLoad","onOpenChange","disconnectedCallback","cancelPositionRetry","teardownListeners","isOpen","setupListeners","schedulePositionUpdate","focusInitialItem","captureClosingSections","closeAnimationMs","finishClose","setTimeout","onAnchorChange","onPositionPropsChange","viewportPadPx","resolveCssLengthPx","TOKEN_DEFAULTS","sideOffsetPx","alignOffsetPx","popupFallbackWidthPx","menuWidthXs","popupFallbackHeightPx","menuFallbackHeight","resolveMotionTimeMs","motionShort2","animationDurationShort3","dsAfterClose","emit","visibleSections","length","activeSections","resolvedAnchor","anchor","anchorId","document","getElementById","anchorFocusTarget","matches","querySelector","focusAnchor","setFocus","focus","moveFocusAfterTab","backwards","candidates","Array","from","querySelectorAll","filter","element","closest","getClientRects","index","indexOf","compositeTabLeavesPopup","event","popup","el","focusables","currentIndex","target","shiftKey","flatItems","flatMap","hasCompositeSections","some","cancelAnimationFrame","onReady","remaining","attempt","calculatePosition","requestAnimationFrame","anchorEl","anchorRect","getBoundingClientRect","sectionInsetPx","minWidth","style","choicePopupMinWidth","width","removeProperty","popupWidth","offsetWidth","popupHeight","offsetHeight","resolveChoicePopupAlignOffset","viewportWidth","window","innerWidth","viewportHeight","innerHeight","flat","selectedIdx","findIndex","it","isSelected","isInactive","firstEnabledIdx","btns","e","t","contains","close","addEventListener","removeEventListener","clearTimeout","restoreFocus","dsClose","handleKeyDown","key","preventDefault","enabled","i","cur","safe","stopPropagation","focusItem","idx","handleItemClick","dsSelect","handleGradientSelect","preset","dsGradientSelect","handleSwatchSelect","value","dsSwatchSelect","render","h","Host","display","flatIdx","popupStyle","position","left","top","transform","Math","round","zIndex","visibility","menuWidth","class","role","undefined","si","header","as","emphasis","color","groupLabel","shellGradientPickerSections","onDsChange","detail","isFocused","isRadioItem","showSwitch","type","isDestructive","String","switchValue","disabled","tabIndex","onMouseDown","onClick","onFocus","label","subtext","dot","hasRing","size","checked","presentation"],"sources":["src/wc/components/Menu/menu-position.ts","src/wc/components/Menu/menu-types.ts","src/wc/components/Menu/Menu.css?tag=ds-menu&encapsulation=scoped","src/wc/components/Menu/Menu.tsx"],"sourcesContent":["import {\n  computeAnchoredPopupPosition,\n  type AnchoredPopupAlign,\n  type AnchoredPopupPositionInput,\n  type AnchoredPopupSide,\n} from '../../utils/anchored-popup';\n\nexport type MenuSide = AnchoredPopupSide;\nexport type MenuAlign = AnchoredPopupAlign;\nexport type MenuPositionInput = AnchoredPopupPositionInput;\n\n/** Backward-compatible menu alias for the shared anchored-popup layout math. */\nexport const computeMenuPosition = computeAnchoredPopupPosition;\n","import type { ShellGradientPreset } from '../../shell/shell-gradient-presets';\nimport type { SwatchPickerOption, SwatchPickerSection } from '../SwatchPicker/swatch-picker-types';\n\nexport type { MenuAlign, MenuSide } from './menu-position';\nexport {\n  PANEL_NAV_USER_MENU_PLACEMENT,\n  PANEL_TOOLS_HEADER_MENU_PLACEMENT,\n  type MenuPlacement,\n} from './menu-placement';\n\nexport interface MenuItemData {\n  label: string;\n  value?: string;\n  subtext?: string;\n  /** Show a supplemental brand notification dot. */\n  dot?: boolean;\n  isSelected?: boolean;\n  isInactive?: boolean;\n  isDestructive?: boolean;\n  /** Render a compact switch indicator; the menu row owns interaction. */\n  showSwitch?: boolean;\n  switchValue?: boolean;\n}\n\nexport interface MenuItemsSection {\n  header?: string;\n  items: MenuItemData[];\n}\n\nexport interface MenuGradientPickerSection {\n  header?: string;\n  /** @deprecated Use the generic `swatch-picker` section. */\n  variant: 'gradient-picker';\n  value: ShellGradientPreset;\n}\n\nexport interface MenuSwatchPickerSection {\n  header?: string;\n  variant: 'swatch-picker';\n  value: string;\n  options?: SwatchPickerOption[];\n  sections?: SwatchPickerSection[];\n  groupLabel?: string;\n}\n\nexport type MenuSection =\n  | MenuItemsSection\n  | MenuGradientPickerSection\n  | MenuSwatchPickerSection;\n\nexport function isMenuGradientPickerSection(\n  section: MenuSection,\n): section is MenuGradientPickerSection {\n  return 'variant' in section && section.variant === 'gradient-picker';\n}\n\nexport function isMenuSwatchPickerSection(\n  section: MenuSection,\n): section is MenuSwatchPickerSection {\n  return 'variant' in section && section.variant === 'swatch-picker';\n}\n\nexport function isMenuPickerSection(\n  section: MenuSection,\n): section is MenuGradientPickerSection | MenuSwatchPickerSection {\n  return isMenuGradientPickerSection(section) || isMenuSwatchPickerSection(section);\n}\n\nexport type { ShellGradientPreset };\nexport type { SwatchPickerOption, SwatchPickerSection };\n","@import '../../utils/choice-list.css';\n\n/* Inactive: `.ds-control-inactive` (25% opacity). */\n\n.menu-item--destructive .menu-item__label {\n  /* Beat ds-text color-* host classes for destructive rows. */\n  color: var(--color-foreground-bold-negative) !important;\n}\n\n/* Standard md icon zone keeps the dot aligned with other control suffixes. */\n.menu-item__dot-box {\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  flex-shrink: 0;\n  width: var(--ds-control-icon, var(--dimension-iconography-md));\n  height: var(--ds-control-icon, var(--dimension-iconography-md));\n  pointer-events: none;\n}\n\n/* ── Switch suffix ───────────────────────────────────────────────────────── */\n\n.menu-item__switch {\n  flex-shrink: 0;\n}\n\n/* ── Single-selection radio indicator ───────────────────────────────────── */\n\n.menu-item__radio-box {\n  display: inline-flex;\n  align-items: center;\n  justify-content: center;\n  flex-shrink: 0;\n  width: var(--ds-control-icon, var(--dimension-iconography-md));\n  height: var(--ds-control-icon, var(--dimension-iconography-md));\n  pointer-events: none;\n}\n\n.menu-item__radio {\n  display: inline-flex;\n  align-items: center;\n  justify-content: center;\n  box-sizing: border-box;\n  width: var(--dimension-iconography-sm);\n  height: var(--dimension-iconography-sm);\n  border-radius: var(--dimension-radius-half);\n  box-shadow: inset 0 0 0 var(--dimension-stroke-width-015) var(--color-foreground-tertiary);\n}\n\n.menu-item__radio--checked {\n  background-color: var(--color-background-bold-brand);\n  box-shadow: none;\n}\n\n.menu-item__radio-dot {\n  width: var(--dimension-size-100);\n  height: var(--dimension-size-100);\n  border-radius: var(--dimension-radius-half);\n  background-color: var(--color-foreground-on-bold-background-primary);\n}\n","import {\n  Component,\n  Prop,\n  State,\n  Event,\n  EventEmitter,\n  Element,\n  Watch,\n  Listen,\n  h,\n  Host,\n} from '@stencil/core';\nimport {\n  choicePopupMinWidth,\n  resolveChoicePopupAlignOffset,\n  resolveCssLengthPx,\n  resolveMotionTimeMs,\n  TOKEN_CSS_LENGTHS,\n  TOKEN_DEFAULTS,\n  type ChoicePopupAnchorAlignment,\n} from '../../utils';\nimport { computeMenuPosition, type MenuAlign, type MenuSide } from './menu-position';\nimport type { MenuItemData, MenuSection } from './menu-types';\n\nexport type MenuSelectionMode = 'none' | 'single';\nimport {\n  isMenuGradientPickerSection,\n  isMenuPickerSection,\n  isMenuSwatchPickerSection,\n} from './menu-types';\nimport {\n  shellGradientPickerSections,\n  type ShellGradientPreset,\n} from '../../shell/shell-gradient-presets';\n\n/** rAF retries while the popup mounts or the anchor resolves. */\nconst POSITION_RETRY_BUDGET = 8;\nconst MENU_FOCUSABLE_SELECTOR = [\n  'a[href]',\n  'button:not([disabled])',\n  'input:not([disabled]):not([type=\"hidden\"])',\n  'select:not([disabled])',\n  'textarea:not([disabled])',\n  '[tabindex]:not([tabindex=\"-1\"])',\n].join(',');\n\nfunction snapshotMenuSections(sections: MenuSection[]): MenuSection[] {\n  return sections.map(section => {\n    if (isMenuGradientPickerSection(section)) return { ...section };\n    if (isMenuSwatchPickerSection(section)) {\n      return {\n        ...section,\n        options: section.options?.map(option => ({ ...option })),\n        sections: section.sections?.map(swatchSection => ({\n          ...swatchSection,\n          options: swatchSection.options.map(option => ({ ...option })),\n        })),\n      };\n    }\n    return { ...section, items: section.items.map(item => ({ ...item })) };\n  });\n}\n\n@Component({\n  tag: 'ds-menu',\n  styleUrl: 'Menu.css',\n  scoped: true,\n})\nexport class Menu {\n  @Element() el!: HTMLElement;\n\n  @Prop({ mutable: true }) open: boolean = false;\n  @Prop() items: MenuItemData[] = [];\n  /** Give ordinary rows mutually-exclusive radio-menu semantics using isSelected. */\n  @Prop() selectionMode: MenuSelectionMode = 'none';\n  @Prop() sections: MenuSection[] = [];\n  @Prop() side: MenuSide = 'bottom';\n  @Prop() align: MenuAlign = 'start';\n  /** Align choice-row edges to the anchor by default; use `popup-frame` only for custom frame geometry. */\n  @Prop() anchorAlignment: ChoicePopupAnchorAlignment = 'choice-cell';\n  /** Gap between anchor and menu — number (px) or TokoMo length (`var(--dimension-space-050)`, etc.). */\n  @Prop() sideOffset: number | string = TOKEN_CSS_LENGTHS.space050;\n  /** Cross-axis offset — number (px) or TokoMo length. */\n  @Prop() alignOffset: number | string = 0;\n  @Prop() menuWidth: string | undefined;\n  @Prop() minWidth: string | undefined;\n  /** External trigger element to position against. Set via JS: menuEl.anchor = buttonEl */\n  @Prop() anchor: HTMLElement | undefined;\n  /** ID of the external trigger element for positioning */\n  @Prop() anchorId: string | undefined;\n  /** Show a visible ring on the initially focused menu item. Use only when the opener was keyboard-driven. */\n  @Prop() initialFocusVisible: boolean = false;\n  /** Accessible name for the popup menu. */\n  @Prop() menuLabel: string = 'Menu';\n\n  @State() private shouldRender: boolean = false;\n  @State() private closing: boolean = false;\n  @State() private pos: { x: number; y: number } = { x: 0, y: 0 };\n  @State() private focusedIndex: number = 0;\n  @State() private positionReady: boolean = false;\n  @State() private focusRingVisible: boolean = false;\n\n  @Event() dsClose!: EventEmitter<void>;\n  /** Emitted after the popup's exit motion is complete and its rendered content is removed. */\n  @Event() dsAfterClose!: EventEmitter<void>;\n  @Event() dsSelect!: EventEmitter<MenuItemData>;\n  /** Emitted when a `gradient-picker` section swatch is chosen. */\n  @Event() dsGradientSelect!: EventEmitter<ShellGradientPreset>;\n  /** Emitted when a generic `swatch-picker` section option is chosen. */\n  @Event() dsSwatchSelect!: EventEmitter<string>;\n\n  private clickOutsideHandler: ((e: MouseEvent) => void) | null = null;\n  private scrollResizeHandler: (() => void) | null = null;\n  private closeTimer: ReturnType<typeof setTimeout> | null = null;\n  private itemEls: HTMLElement[] = [];\n  private positionRetryRaf: number | null = null;\n  private listenersReady = false;\n  /** Last content actually painted while open; retained unchanged through exit motion. */\n  private lastRenderedSections: MenuSection[] = [];\n  private closingSections: MenuSection[] | null = null;\n\n  componentDidLoad() {\n    if (this.open) this.onOpenChange(true);\n  }\n\n  disconnectedCallback() {\n    this.cancelPositionRetry();\n    this.teardownListeners();\n  }\n\n  @Watch('open')\n  onOpenChange(isOpen: boolean) {\n    if (isOpen) {\n      this.teardownListeners();\n      this.closingSections = null;\n      this.shouldRender = true;\n      this.closing = false;\n      this.positionReady = false;\n      this.listenersReady = false;\n      this.focusRingVisible = this.initialFocusVisible;\n      this.listenersReady = true;\n      this.setupListeners();\n      this.schedulePositionUpdate(() => {\n        this.focusInitialItem();\n      });\n    } else if (this.shouldRender) {\n      this.cancelPositionRetry();\n      this.captureClosingSections();\n      this.closing = true;\n      this.teardownListeners();\n      this.listenersReady = false;\n      const closeAnimationMs = this.closeAnimationMs;\n      if (closeAnimationMs <= 0) {\n        this.finishClose();\n        return;\n      }\n      this.closeTimer = setTimeout(() => {\n        this.closeTimer = null;\n        this.finishClose();\n      }, closeAnimationMs);\n    }\n  }\n\n  @Watch('anchor')\n  @Watch('anchorId')\n  onAnchorChange() {\n    if (this.open) this.schedulePositionUpdate();\n  }\n\n  @Watch('side')\n  @Watch('align')\n  @Watch('anchorAlignment')\n  @Watch('sideOffset')\n  @Watch('alignOffset')\n  onPositionPropsChange() {\n    if (this.open) this.schedulePositionUpdate();\n  }\n\n  private get viewportPadPx(): number {\n    return resolveCssLengthPx(TOKEN_DEFAULTS.space050, TOKEN_DEFAULTS.space050);\n  }\n\n  private get sideOffsetPx(): number {\n    return resolveCssLengthPx(this.sideOffset, TOKEN_DEFAULTS.space050);\n  }\n\n  private get alignOffsetPx(): number {\n    return resolveCssLengthPx(this.alignOffset, 0);\n  }\n\n  private get popupFallbackWidthPx(): number {\n    return resolveCssLengthPx(TOKEN_DEFAULTS.menuWidthXs, TOKEN_DEFAULTS.menuWidthXs);\n  }\n\n  private get popupFallbackHeightPx(): number {\n    return resolveCssLengthPx(TOKEN_DEFAULTS.menuFallbackHeight, TOKEN_DEFAULTS.menuFallbackHeight);\n  }\n\n  private get closeAnimationMs(): number {\n    return resolveMotionTimeMs(TOKEN_DEFAULTS.motionShort2, TOKEN_DEFAULTS.animationDurationShort3);\n  }\n\n  private finishClose() {\n    this.shouldRender = false;\n    this.closing = false;\n    this.lastRenderedSections = [];\n    this.closingSections = null;\n    this.dsAfterClose.emit();\n  }\n\n  private captureClosingSections() {\n    if (this.closingSections) return;\n    const visibleSections = this.lastRenderedSections.length\n      ? this.lastRenderedSections\n      : this.activeSections;\n    this.closingSections = snapshotMenuSections(visibleSections);\n  }\n\n  private get resolvedAnchor(): HTMLElement | null {\n    if (this.anchor) return this.anchor;\n    if (this.anchorId) return document.getElementById(this.anchorId);\n    return null;\n  }\n\n  private get anchorFocusTarget(): HTMLElement | null {\n    const anchor = this.resolvedAnchor;\n    if (!anchor) return null;\n    if (anchor.matches(MENU_FOCUSABLE_SELECTOR)) return anchor;\n    return anchor.querySelector<HTMLElement>(MENU_FOCUSABLE_SELECTOR) ?? anchor;\n  }\n\n  private focusAnchor() {\n    const anchor = this.resolvedAnchor as\n      | (HTMLElement & { setFocus?: () => Promise<void> | void })\n      | null;\n    if (anchor?.setFocus) {\n      anchor.setFocus();\n      return;\n    }\n    this.anchorFocusTarget?.focus();\n  }\n\n  private moveFocusAfterTab(backwards: boolean) {\n    const anchor = this.anchorFocusTarget;\n    if (!anchor) return;\n    if (backwards) {\n      anchor.focus();\n      return;\n    }\n\n    const candidates = Array.from(\n      document.querySelectorAll<HTMLElement>(MENU_FOCUSABLE_SELECTOR)\n    ).filter(\n      element =>\n        !element.closest('.menu-popup') &&\n        !element.closest('[inert]') &&\n        element.getClientRects().length > 0\n    );\n    const index = candidates.indexOf(anchor);\n    (candidates[index + 1] ?? anchor).focus();\n  }\n\n  private compositeTabLeavesPopup(event: KeyboardEvent): boolean {\n    const popup = this.el.querySelector<HTMLElement>('.menu-popup');\n    if (!popup) return true;\n    const focusables = Array.from(\n      popup.querySelectorAll<HTMLElement>(MENU_FOCUSABLE_SELECTOR)\n    ).filter(element => element.getClientRects().length > 0);\n    const currentIndex = focusables.indexOf(event.target as HTMLElement);\n    if (currentIndex < 0) return true;\n    return event.shiftKey ? currentIndex === 0 : currentIndex === focusables.length - 1;\n  }\n\n  private get activeSections(): MenuSection[] {\n    if (this.sections.length > 0) return this.sections;\n    if (this.items.length > 0) return [{ items: this.items }];\n    return [];\n  }\n\n  private get flatItems(): MenuItemData[] {\n    return this.activeSections.flatMap(section =>\n      isMenuPickerSection(section) ? [] : section.items\n    );\n  }\n\n  /** Rich preference content is a non-modal dialog, not an ARIA action menu. */\n  private get hasCompositeSections(): boolean {\n    return this.activeSections.some(isMenuPickerSection);\n  }\n\n  private cancelPositionRetry() {\n    if (this.positionRetryRaf !== null) {\n      cancelAnimationFrame(this.positionRetryRaf);\n      this.positionRetryRaf = null;\n    }\n  }\n\n  /** Retry until anchor + popup exist — do not reveal at 0,0 on a failed first pass. */\n  private schedulePositionUpdate(onReady?: () => void) {\n    if (!this.open) return;\n\n    this.cancelPositionRetry();\n    this.positionReady = false;\n\n    let remaining = POSITION_RETRY_BUDGET;\n\n    const attempt = () => {\n      this.positionRetryRaf = null;\n      if (!this.open) return;\n\n      if (this.calculatePosition()) {\n        this.positionReady = true;\n        onReady?.();\n        return;\n      }\n\n      if (remaining > 0) {\n        remaining -= 1;\n        this.positionRetryRaf = requestAnimationFrame(attempt);\n      }\n    };\n\n    this.positionRetryRaf = requestAnimationFrame(attempt);\n  }\n\n  /** @returns `true` when anchor and popup were found and `pos` was updated. */\n  private calculatePosition(): boolean {\n    const anchorEl = this.resolvedAnchor;\n    if (!anchorEl) return false;\n    const popup = this.el.querySelector('.menu-popup') as HTMLElement | null;\n    if (!popup) return false;\n\n    const anchorRect = anchorEl.getBoundingClientRect();\n    const sectionInsetPx = this.viewportPadPx;\n    if (!this.minWidth) {\n      if (\n        this.anchorAlignment === 'choice-cell' &&\n        (this.side === 'top' || this.side === 'bottom')\n      ) {\n        popup.style.minWidth = `max(var(--dimension-menu-width-xs), ${choicePopupMinWidth(\n          anchorRect.width,\n          sectionInsetPx\n        )}px)`;\n      } else {\n        popup.style.removeProperty('min-width');\n      }\n    }\n\n    this.pos = computeMenuPosition({\n      anchorRect,\n      popupWidth: popup.offsetWidth || this.popupFallbackWidthPx,\n      popupHeight: popup.offsetHeight || this.popupFallbackHeightPx,\n      side: this.side,\n      align: this.align,\n      sideOffsetPx: this.sideOffsetPx,\n      alignOffsetPx: resolveChoicePopupAlignOffset({\n        align: this.align,\n        alignOffsetPx: this.alignOffsetPx,\n        sectionInsetPx,\n        anchorAlignment: this.anchorAlignment,\n      }),\n      viewportPadPx: this.viewportPadPx,\n      viewportWidth: window.innerWidth,\n      viewportHeight: window.innerHeight,\n    });\n    return true;\n  }\n\n  /** Focus the selected item when present, otherwise the first enabled item. */\n  private focusInitialItem() {\n    if (this.hasCompositeSections) {\n      requestAnimationFrame(() => {\n        this.el.querySelector<HTMLElement>('.menu-popup [tabindex=\"0\"]')?.focus();\n      });\n      return;\n    }\n\n    const flat = this.flatItems;\n    const selectedIdx = flat.findIndex(it => it.isSelected && !it.isInactive);\n    const firstEnabledIdx = flat.findIndex(it => !it.isInactive);\n    this.focusedIndex = selectedIdx >= 0 ? selectedIdx : firstEnabledIdx >= 0 ? firstEnabledIdx : 0;\n\n    requestAnimationFrame(() => {\n      const btns = this.el.querySelectorAll<HTMLElement>('.menu-item');\n      btns[this.focusedIndex]?.focus();\n    });\n  }\n\n  private setupListeners() {\n    this.clickOutsideHandler = (e: MouseEvent) => {\n      const t = e.target as Node;\n      const popup = this.el.querySelector('.menu-popup');\n      const anchorEl = this.resolvedAnchor;\n      if (popup?.contains(t) || anchorEl?.contains(t)) return;\n      this.close();\n    };\n\n    this.scrollResizeHandler = () => {\n      if (this.shouldRender && !this.closing) this.calculatePosition();\n    };\n\n    document.addEventListener('mousedown', this.clickOutsideHandler, true);\n    window.addEventListener('scroll', this.scrollResizeHandler, true);\n    window.addEventListener('resize', this.scrollResizeHandler);\n  }\n\n  private teardownListeners() {\n    if (this.clickOutsideHandler) {\n      document.removeEventListener('mousedown', this.clickOutsideHandler, true);\n      this.clickOutsideHandler = null;\n    }\n    if (this.scrollResizeHandler) {\n      window.removeEventListener('scroll', this.scrollResizeHandler, true);\n      window.removeEventListener('resize', this.scrollResizeHandler);\n      this.scrollResizeHandler = null;\n    }\n    if (this.closeTimer) {\n      clearTimeout(this.closeTimer);\n      this.closeTimer = null;\n    }\n  }\n\n  private close(restoreFocus = true) {\n    this.captureClosingSections();\n    if (restoreFocus) this.focusAnchor();\n    this.dsClose.emit();\n    this.open = false;\n    this.onOpenChange(false);\n  }\n\n  @Listen('keydown')\n  handleKeyDown(e: KeyboardEvent) {\n    if (!this.shouldRender || this.closing) return;\n\n    if (e.key === 'Escape') {\n      e.preventDefault();\n      this.close();\n      return;\n    }\n\n    if (e.key === 'Tab') {\n      if (this.hasCompositeSections && !this.compositeTabLeavesPopup(e)) return;\n      e.preventDefault();\n      this.close(false);\n      this.moveFocusAfterTab(e.shiftKey);\n      return;\n    }\n\n    if (this.hasCompositeSections) return;\n\n    const flat = this.flatItems;\n    const enabled = flat\n      .map((it, i) => ({ it, i }))\n      .filter(({ it }) => !it.isInactive)\n      .map(({ i }) => i);\n    if (!enabled.length) return;\n\n    const cur = enabled.indexOf(this.focusedIndex);\n    const safe = cur < 0 ? 0 : cur;\n\n    switch (e.key) {\n      case 'ArrowDown':\n        e.preventDefault();\n        e.stopPropagation();\n        this.focusRingVisible = true;\n        this.focusedIndex = enabled[(safe + 1) % enabled.length];\n        this.focusItem(this.focusedIndex);\n        break;\n      case 'ArrowUp':\n        e.preventDefault();\n        e.stopPropagation();\n        this.focusRingVisible = true;\n        this.focusedIndex = enabled[(safe - 1 + enabled.length) % enabled.length];\n        this.focusItem(this.focusedIndex);\n        break;\n      case 'Home':\n        e.preventDefault();\n        e.stopPropagation();\n        this.focusRingVisible = true;\n        this.focusedIndex = enabled[0];\n        this.focusItem(this.focusedIndex);\n        break;\n      case 'End':\n        e.preventDefault();\n        e.stopPropagation();\n        this.focusRingVisible = true;\n        this.focusedIndex = enabled[enabled.length - 1];\n        this.focusItem(this.focusedIndex);\n        break;\n    }\n  }\n\n  private focusItem(idx: number) {\n    const btns = this.el.querySelectorAll<HTMLElement>('.menu-item');\n    btns[idx]?.focus();\n  }\n\n  private handleItemClick(item: MenuItemData) {\n    if (item.isInactive) return;\n    // Consumers commonly change the item source while handling selection.\n    // Capture first so the exit animation never paints the next menu context.\n    this.captureClosingSections();\n    this.dsSelect.emit(item);\n  }\n\n  private handleGradientSelect(preset: ShellGradientPreset) {\n    this.dsGradientSelect.emit(preset);\n  }\n\n  private handleSwatchSelect(value: string) {\n    this.dsSwatchSelect.emit(value);\n  }\n\n  render() {\n    if (!this.shouldRender) return <Host style={{ display: 'contents' }} />;\n\n    const sections = this.closing\n      ? (this.closingSections ?? this.lastRenderedSections)\n      : this.activeSections;\n    const hasCompositeSections = sections.some(isMenuPickerSection);\n    if (!this.closing) {\n      this.lastRenderedSections = snapshotMenuSections(sections);\n      this.closingSections = null;\n    }\n    let flatIdx = 0;\n\n    const popupStyle: Record<string, string> = {\n      position: 'fixed',\n      left: '0',\n      top: '0',\n      transform: `translate(${Math.round(this.pos.x)}px, ${Math.round(this.pos.y)}px)`,\n      zIndex: '9998',\n      visibility: this.positionReady ? 'visible' : 'hidden',\n    };\n\n    if (this.menuWidth) popupStyle['width'] = this.menuWidth;\n    if (this.minWidth) popupStyle['min-width'] = this.minWidth;\n\n    return (\n      <Host style={{ display: 'contents' }}>\n        <div\n          class={{\n            'menu-popup': true,\n            'menu-popup--closing': this.closing,\n            'ds-choice-popup': true,\n            'ds-choice-popup--closing': this.closing,\n          }}\n          style={popupStyle}\n          role={hasCompositeSections ? 'dialog' : 'menu'}\n          aria-label={this.menuLabel}\n          aria-orientation={hasCompositeSections ? undefined : 'vertical'}\n        >\n          <div class=\"ds-choice-list\">\n            {sections.map((section, si) => (\n              <div\n                key={si}\n                class={{\n                  'menu-section': true,\n                  'menu-section--divided': si < sections.length - 1,\n                  'menu-section--gradient-picker': isMenuPickerSection(section),\n                  'ds-choice-section': true,\n                  'ds-choice-section--divided': si < sections.length - 1,\n                }}\n                role={section.header ? 'group' : undefined}\n                aria-label={section.header}\n              >\n                {section.header && (\n                  <ds-text\n                    class=\"section-header ds-choice-section__header ds-control--md\"\n                    as=\"span\"\n                    variant=\"text-body-small\"\n                    emphasis\n                    color=\"primary\"\n                    aria-hidden=\"true\"\n                  >\n                    {section.header}\n                  </ds-text>\n                )}\n                {isMenuGradientPickerSection(section) ? (\n                  <ds-swatch-picker\n                    value={section.value}\n                    groupLabel={section.header ?? 'Shell gradient theme'}\n                    sections={shellGradientPickerSections()}\n                    onDsChange={(e: CustomEvent<string>) => {\n                      e.stopPropagation();\n                      this.handleGradientSelect(e.detail as ShellGradientPreset);\n                    }}\n                  />\n                ) : isMenuSwatchPickerSection(section) ? (\n                  <ds-swatch-picker\n                    value={section.value}\n                    groupLabel={section.groupLabel ?? section.header ?? 'Swatch options'}\n                    options={section.options ?? []}\n                    sections={section.sections ?? []}\n                    onDsChange={(e: CustomEvent<string>) => {\n                      e.stopPropagation();\n                      this.handleSwatchSelect(e.detail);\n                    }}\n                  />\n                ) : (\n                  section.items.map(item => {\n                    const idx = flatIdx++;\n                    const isFocused = this.focusedIndex === idx;\n                    const isRadioItem =\n                      !hasCompositeSections &&\n                      this.selectionMode === 'single' &&\n                      !item.showSwitch;\n                    return (\n                      <button\n                        key={idx}\n                        type=\"button\"\n                        class={{\n                          'menu-item': true,\n                          'ds-choice-item': true,\n                          'ds-control--md': true,\n                          'ds-focus-ring-inset': true,\n                          'ds-focus-ring--visible': isFocused && this.focusRingVisible,\n                          'ds-interaction-fill': !item.isInactive,\n                          'ds-interaction-fill--selected': !!item.isSelected && !item.isInactive,\n                          'menu-item--selected': !!item.isSelected,\n                          'ds-control-inactive': !!item.isInactive,\n                          'menu-item--destructive': !!item.isDestructive,\n                          'menu-item--focused': isFocused,\n                        }}\n                        role={\n                          hasCompositeSections\n                            ? undefined\n                            : item.showSwitch\n                            ? 'menuitemcheckbox'\n                            : isRadioItem\n                            ? 'menuitemradio'\n                            : 'menuitem'\n                        }\n                        aria-checked={\n                          !hasCompositeSections && item.showSwitch\n                            ? String(!!item.switchValue)\n                            : isRadioItem\n                            ? String(!!item.isSelected)\n                            : undefined\n                        }\n                        aria-pressed={\n                          hasCompositeSections\n                            ? String(item.showSwitch ? !!item.switchValue : !!item.isSelected)\n                            : undefined\n                        }\n                        aria-current={\n                          !hasCompositeSections &&\n                          !item.showSwitch &&\n                          !isRadioItem &&\n                          item.isSelected\n                            ? 'true'\n                            : undefined\n                        }\n                        disabled={item.isInactive}\n                        tabIndex={hasCompositeSections ? 0 : isFocused ? 0 : -1}\n                        onMouseDown={() => {\n                          this.focusRingVisible = false;\n                        }}\n                        onClick={() => this.handleItemClick(item)}\n                        onFocus={() => {\n                          this.focusedIndex = idx;\n                        }}\n                      >\n                        {isRadioItem && (\n                          <span\n                            class=\"menu-item__radio-box ds-interaction-fill__content\"\n                            aria-hidden=\"true\"\n                          >\n                            <span\n                              class={{\n                                'menu-item__radio': true,\n                                'menu-item__radio--checked': !!item.isSelected,\n                              }}\n                            >\n                              {item.isSelected && <span class=\"menu-item__radio-dot\" />}\n                            </span>\n                          </span>\n                        )}\n                        <div class=\"menu-item__content ds-choice-item__content ds-interaction-fill__content\">\n                          <ds-text\n                            class=\"menu-item__label ds-choice-item__label\"\n                            as=\"span\"\n                            variant=\"text-body-medium\"\n                            color={item.isSelected ? 'primary' : 'secondary'}\n                          >\n                            {item.label}\n                          </ds-text>\n                          {item.subtext && (\n                            <ds-text\n                              class=\"menu-item__subtext ds-choice-item__subtext\"\n                              as=\"span\"\n                              variant=\"text-body-small\"\n                              color=\"secondary\"\n                            >\n                              {item.subtext}\n                            </ds-text>\n                          )}\n                        </div>\n                        {item.dot && (\n                          <span\n                            class=\"menu-item__dot-box ds-interaction-fill__content\"\n                            aria-hidden=\"true\"\n                          >\n                            <ds-badge\n                              class=\"menu-item__dot\"\n                              variant=\"dot\"\n                              hasRing={false}\n                              label=\"\"\n                            />\n                          </span>\n                        )}\n                        {item.showSwitch && (\n                          <ds-switch\n                            class=\"menu-item__switch ds-interaction-fill__content\"\n                            size=\"md\"\n                            checked={!!item.switchValue}\n                            presentation\n                          />\n                        )}\n                      </button>\n                    );\n                  })\n                )}\n              </div>\n            ))}\n          </div>\n        </div>\n      </Host>\n    );\n  }\n}\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"names":["computeMenuPosition","computeAnchoredPopupPosition","isMenuGradientPickerSection","section","variant","isMenuSwatchPickerSection","isMenuPickerSection","menuCss","POSITION_RETRY_BUDGET","MENU_FOCUSABLE_SELECTOR","join","snapshotMenuSections","sections","map","options","option","swatchSection","items","item","Menu","__stencil_proxyCustomElement","HTMLElement","constructor","registerHost","this","open","selectionMode","side","align","anchorAlignment","sideOffset","TOKEN_CSS_LENGTHS","space050","alignOffset","initialFocusVisible","menuLabel","shouldRender","closing","pos","x","y","focusedIndex","positionReady","focusRingVisible","clickOutsideHandler","scrollResizeHandler","closeTimer","itemEls","positionRetryRaf","listenersReady","lastRenderedSections","closingSections","componentDidLoad","onOpenChange","disconnectedCallback","cancelPositionRetry","teardownListeners","isOpen","setupListeners","schedulePositionUpdate","focusInitialItem","captureClosingSections","closeAnimationMs","finishClose","setTimeout","onAnchorChange","onPositionPropsChange","viewportPadPx","resolveCssLengthPx","TOKEN_DEFAULTS","sideOffsetPx","alignOffsetPx","popupFallbackWidthPx","menuWidthXs","popupFallbackHeightPx","menuFallbackHeight","resolveMotionTimeMs","motionShort2","animationDurationShort3","dsAfterClose","emit","visibleSections","length","activeSections","resolvedAnchor","anchor","anchorId","document","getElementById","anchorFocusTarget","matches","querySelector","focusAnchor","setFocus","focus","moveFocusAfterTab","backwards","candidates","Array","from","querySelectorAll","filter","element","closest","getClientRects","index","indexOf","compositeTabLeavesPopup","event","popup","el","focusables","currentIndex","target","shiftKey","flatItems","flatMap","hasCompositeSections","some","cancelAnimationFrame","onReady","remaining","attempt","calculatePosition","requestAnimationFrame","anchorEl","anchorRect","getBoundingClientRect","sectionInsetPx","minWidth","style","choicePopupMinWidth","width","removeProperty","popupWidth","offsetWidth","popupHeight","offsetHeight","resolveChoicePopupAlignOffset","viewportWidth","window","innerWidth","viewportHeight","innerHeight","flat","selectedIdx","findIndex","it","isSelected","isInactive","firstEnabledIdx","btns","e","t","contains","close","addEventListener","removeEventListener","clearTimeout","restoreFocus","dsClose","handleKeyDown","key","preventDefault","enabled","i","cur","safe","stopPropagation","focusItem","idx","handleItemClick","dsSelect","handleGradientSelect","preset","dsGradientSelect","handleSwatchSelect","value","dsSwatchSelect","render","h","Host","display","flatIdx","popupStyle","position","left","top","transform","Math","round","zIndex","visibility","menuWidth","class","role","undefined","si","header","as","emphasis","color","groupLabel","shellGradientPickerSections","onDsChange","detail","isFocused","isRadioItem","showSwitch","type","isDestructive","String","switchValue","disabled","tabIndex","onMouseDown","onClick","onFocus","label","subtext","dot","hasRing","size","checked","presentation"],"sources":["src/wc/components/Menu/menu-position.ts","src/wc/components/Menu/menu-types.ts","src/wc/components/Menu/Menu.css?tag=ds-menu&encapsulation=scoped","src/wc/components/Menu/Menu.tsx"],"sourcesContent":["import {\n  computeAnchoredPopupPosition,\n  type AnchoredPopupAlign,\n  type AnchoredPopupPositionInput,\n  type AnchoredPopupSide,\n} from '../../utils/anchored-popup';\n\nexport type MenuSide = AnchoredPopupSide;\nexport type MenuAlign = AnchoredPopupAlign;\nexport type MenuPositionInput = AnchoredPopupPositionInput;\n\n/** Backward-compatible menu alias for the shared anchored-popup layout math. */\nexport const computeMenuPosition = computeAnchoredPopupPosition;\n","import type { ShellGradientPreset } from '../../shell/shell-gradient-presets';\nimport type { SwatchPickerOption, SwatchPickerSection } from '../SwatchPicker/swatch-picker-types';\n\nexport type { MenuAlign, MenuSide } from './menu-position';\nexport {\n  PANEL_NAV_USER_MENU_PLACEMENT,\n  PANEL_TOOLS_HEADER_MENU_PLACEMENT,\n  type MenuPlacement,\n} from './menu-placement';\n\nexport interface MenuItemData {\n  label: string;\n  value?: string;\n  subtext?: string;\n  /** Show a supplemental brand notification dot. */\n  dot?: boolean;\n  isSelected?: boolean;\n  isInactive?: boolean;\n  isDestructive?: boolean;\n  /** Render a compact switch indicator; the menu row owns interaction. */\n  showSwitch?: boolean;\n  switchValue?: boolean;\n}\n\nexport interface MenuItemsSection {\n  header?: string;\n  items: MenuItemData[];\n}\n\nexport interface MenuGradientPickerSection {\n  header?: string;\n  /** @deprecated Use the generic `swatch-picker` section. */\n  variant: 'gradient-picker';\n  value: ShellGradientPreset;\n}\n\nexport interface MenuSwatchPickerSection {\n  header?: string;\n  variant: 'swatch-picker';\n  value: string;\n  options?: SwatchPickerOption[];\n  sections?: SwatchPickerSection[];\n  groupLabel?: string;\n}\n\nexport type MenuSection =\n  | MenuItemsSection\n  | MenuGradientPickerSection\n  | MenuSwatchPickerSection;\n\nexport function isMenuGradientPickerSection(\n  section: MenuSection,\n): section is MenuGradientPickerSection {\n  return 'variant' in section && section.variant === 'gradient-picker';\n}\n\nexport function isMenuSwatchPickerSection(\n  section: MenuSection,\n): section is MenuSwatchPickerSection {\n  return 'variant' in section && section.variant === 'swatch-picker';\n}\n\nexport function isMenuPickerSection(\n  section: MenuSection,\n): section is MenuGradientPickerSection | MenuSwatchPickerSection {\n  return isMenuGradientPickerSection(section) || isMenuSwatchPickerSection(section);\n}\n\nexport type { ShellGradientPreset };\nexport type { SwatchPickerOption, SwatchPickerSection };\n","@import '../../utils/choice-list.css';\n\n/* Inactive: `.ds-control-inactive` (25% opacity). */\n\n.menu-item--destructive .menu-item__label {\n  /* Beat ds-text color-* host classes for destructive rows. */\n  color: var(--color-foreground-bold-negative) !important;\n}\n\n/* Standard md icon zone keeps the dot aligned with other control suffixes. */\n.menu-item__dot-box {\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  flex-shrink: 0;\n  width: var(--ds-control-icon, var(--dimension-iconography-md));\n  height: var(--ds-control-icon, var(--dimension-iconography-md));\n  pointer-events: none;\n}\n\n/* ── Switch suffix ───────────────────────────────────────────────────────── */\n\n.menu-item__switch {\n  flex-shrink: 0;\n}\n\n/* ── Single-selection radio indicator ───────────────────────────────────── */\n\n.menu-item__radio-box {\n  display: inline-flex;\n  align-items: center;\n  justify-content: center;\n  flex-shrink: 0;\n  width: var(--ds-control-icon, var(--dimension-iconography-md));\n  height: var(--ds-control-icon, var(--dimension-iconography-md));\n  pointer-events: none;\n}\n\n.menu-item__radio {\n  display: inline-flex;\n  align-items: center;\n  justify-content: center;\n  box-sizing: border-box;\n  width: var(--dimension-iconography-sm);\n  height: var(--dimension-iconography-sm);\n  border-radius: var(--dimension-radius-half);\n  box-shadow: inset 0 0 0 var(--dimension-stroke-width-015) var(--color-foreground-tertiary);\n}\n\n.menu-item__radio--checked {\n  background-color: var(--color-background-bold-brand);\n  box-shadow: none;\n}\n\n.menu-item__radio-dot {\n  width: var(--dimension-size-100);\n  height: var(--dimension-size-100);\n  border-radius: var(--dimension-radius-half);\n  background-color: var(--color-foreground-on-bold-background-primary);\n}\n","import {\n  Component,\n  Prop,\n  State,\n  Event,\n  EventEmitter,\n  Element,\n  Watch,\n  Listen,\n  h,\n  Host,\n} from '@stencil/core';\nimport {\n  choicePopupMinWidth,\n  resolveChoicePopupAlignOffset,\n  resolveCssLengthPx,\n  resolveMotionTimeMs,\n  TOKEN_CSS_LENGTHS,\n  TOKEN_DEFAULTS,\n  type ChoicePopupAnchorAlignment,\n} from '../../utils';\nimport { computeMenuPosition, type MenuAlign, type MenuSide } from './menu-position';\nimport type { MenuItemData, MenuSection } from './menu-types';\n\nexport type MenuSelectionMode = 'none' | 'single';\nimport {\n  isMenuGradientPickerSection,\n  isMenuPickerSection,\n  isMenuSwatchPickerSection,\n} from './menu-types';\nimport {\n  shellGradientPickerSections,\n  type ShellGradientPreset,\n} from '../../shell/shell-gradient-presets';\n\n/** rAF retries while the popup mounts or the anchor resolves. */\nconst POSITION_RETRY_BUDGET = 8;\nconst MENU_FOCUSABLE_SELECTOR = [\n  'a[href]',\n  'button:not([disabled])',\n  'input:not([disabled]):not([type=\"hidden\"])',\n  'select:not([disabled])',\n  'textarea:not([disabled])',\n  '[tabindex]:not([tabindex=\"-1\"])',\n].join(',');\n\nfunction snapshotMenuSections(sections: MenuSection[]): MenuSection[] {\n  return sections.map(section => {\n    if (isMenuGradientPickerSection(section)) return { ...section };\n    if (isMenuSwatchPickerSection(section)) {\n      return {\n        ...section,\n        options: section.options?.map(option => ({ ...option })),\n        sections: section.sections?.map(swatchSection => ({\n          ...swatchSection,\n          options: swatchSection.options.map(option => ({ ...option })),\n        })),\n      };\n    }\n    return { ...section, items: section.items.map(item => ({ ...item })) };\n  });\n}\n\n@Component({\n  tag: 'ds-menu',\n  styleUrl: 'Menu.css',\n  scoped: true,\n})\nexport class Menu {\n  @Element() el!: HTMLElement;\n\n  @Prop({ mutable: true }) open: boolean = false;\n  @Prop() items: MenuItemData[] = [];\n  /** Give ordinary rows mutually-exclusive radio-menu semantics using isSelected. */\n  @Prop() selectionMode: MenuSelectionMode = 'none';\n  @Prop() sections: MenuSection[] = [];\n  @Prop() side: MenuSide = 'bottom';\n  @Prop() align: MenuAlign = 'start';\n  /** Align choice-row edges to the anchor by default; use `popup-frame` only for custom frame geometry. */\n  @Prop() anchorAlignment: ChoicePopupAnchorAlignment = 'choice-cell';\n  /** Gap between anchor and menu — number (px) or TokoMo length (`var(--dimension-space-050)`, etc.). */\n  @Prop() sideOffset: number | string = TOKEN_CSS_LENGTHS.space050;\n  /** Cross-axis offset — number (px) or TokoMo length. */\n  @Prop() alignOffset: number | string = 0;\n  @Prop() menuWidth: string | undefined;\n  @Prop() minWidth: string | undefined;\n  /** External trigger element to position against. Set via JS: menuEl.anchor = buttonEl */\n  @Prop() anchor: HTMLElement | undefined;\n  /** ID of the external trigger element for positioning */\n  @Prop() anchorId: string | undefined;\n  /** Show a visible ring on the initially focused menu item. Use only when the opener was keyboard-driven. */\n  @Prop() initialFocusVisible: boolean = false;\n  /** Accessible name for the popup menu. */\n  @Prop() menuLabel: string = 'Menu';\n\n  @State() private shouldRender: boolean = false;\n  @State() private closing: boolean = false;\n  @State() private pos: { x: number; y: number } = { x: 0, y: 0 };\n  @State() private focusedIndex: number = 0;\n  @State() private positionReady: boolean = false;\n  @State() private focusRingVisible: boolean = false;\n\n  @Event() dsClose!: EventEmitter<void>;\n  /** Emitted after the popup's exit motion is complete and its rendered content is removed. */\n  @Event() dsAfterClose!: EventEmitter<void>;\n  @Event() dsSelect!: EventEmitter<MenuItemData>;\n  /** Emitted when a `gradient-picker` section swatch is chosen. */\n  @Event() dsGradientSelect!: EventEmitter<ShellGradientPreset>;\n  /** Emitted when a generic `swatch-picker` section option is chosen. */\n  @Event() dsSwatchSelect!: EventEmitter<string>;\n\n  private clickOutsideHandler: ((e: MouseEvent) => void) | null = null;\n  private scrollResizeHandler: (() => void) | null = null;\n  private closeTimer: ReturnType<typeof setTimeout> | null = null;\n  private itemEls: HTMLElement[] = [];\n  private positionRetryRaf: number | null = null;\n  private listenersReady = false;\n  /** Last content actually painted while open; retained unchanged through exit motion. */\n  private lastRenderedSections: MenuSection[] = [];\n  private closingSections: MenuSection[] | null = null;\n\n  componentDidLoad() {\n    if (this.open) this.onOpenChange(true);\n  }\n\n  disconnectedCallback() {\n    this.cancelPositionRetry();\n    this.teardownListeners();\n  }\n\n  @Watch('open')\n  onOpenChange(isOpen: boolean) {\n    if (isOpen) {\n      this.teardownListeners();\n      this.closingSections = null;\n      this.shouldRender = true;\n      this.closing = false;\n      this.positionReady = false;\n      this.listenersReady = false;\n      this.focusRingVisible = this.initialFocusVisible;\n      this.listenersReady = true;\n      this.setupListeners();\n      this.schedulePositionUpdate(() => {\n        this.focusInitialItem();\n      });\n    } else if (this.shouldRender) {\n      this.cancelPositionRetry();\n      this.captureClosingSections();\n      this.closing = true;\n      this.teardownListeners();\n      this.listenersReady = false;\n      const closeAnimationMs = this.closeAnimationMs;\n      if (closeAnimationMs <= 0) {\n        this.finishClose();\n        return;\n      }\n      this.closeTimer = setTimeout(() => {\n        this.closeTimer = null;\n        this.finishClose();\n      }, closeAnimationMs);\n    }\n  }\n\n  @Watch('anchor')\n  @Watch('anchorId')\n  onAnchorChange() {\n    if (this.open) this.schedulePositionUpdate();\n  }\n\n  @Watch('side')\n  @Watch('align')\n  @Watch('anchorAlignment')\n  @Watch('sideOffset')\n  @Watch('alignOffset')\n  onPositionPropsChange() {\n    if (this.open) this.schedulePositionUpdate();\n  }\n\n  private get viewportPadPx(): number {\n    return resolveCssLengthPx(TOKEN_DEFAULTS.space050, TOKEN_DEFAULTS.space050);\n  }\n\n  private get sideOffsetPx(): number {\n    return resolveCssLengthPx(this.sideOffset, TOKEN_DEFAULTS.space050);\n  }\n\n  private get alignOffsetPx(): number {\n    return resolveCssLengthPx(this.alignOffset, 0);\n  }\n\n  private get popupFallbackWidthPx(): number {\n    return resolveCssLengthPx(TOKEN_DEFAULTS.menuWidthXs, TOKEN_DEFAULTS.menuWidthXs);\n  }\n\n  private get popupFallbackHeightPx(): number {\n    return resolveCssLengthPx(TOKEN_DEFAULTS.menuFallbackHeight, TOKEN_DEFAULTS.menuFallbackHeight);\n  }\n\n  private get closeAnimationMs(): number {\n    return resolveMotionTimeMs(TOKEN_DEFAULTS.motionShort2, TOKEN_DEFAULTS.animationDurationShort3);\n  }\n\n  private finishClose() {\n    this.shouldRender = false;\n    this.closing = false;\n    this.lastRenderedSections = [];\n    this.closingSections = null;\n    this.dsAfterClose.emit();\n  }\n\n  private captureClosingSections() {\n    if (this.closingSections) return;\n    const visibleSections = this.lastRenderedSections.length\n      ? this.lastRenderedSections\n      : this.activeSections;\n    this.closingSections = snapshotMenuSections(visibleSections);\n  }\n\n  private get resolvedAnchor(): HTMLElement | null {\n    if (this.anchor) return this.anchor;\n    if (this.anchorId) return document.getElementById(this.anchorId);\n    return null;\n  }\n\n  private get anchorFocusTarget(): HTMLElement | null {\n    const anchor = this.resolvedAnchor;\n    if (!anchor) return null;\n    if (anchor.matches(MENU_FOCUSABLE_SELECTOR)) return anchor;\n    return anchor.querySelector<HTMLElement>(MENU_FOCUSABLE_SELECTOR) ?? anchor;\n  }\n\n  private focusAnchor() {\n    const anchor = this.resolvedAnchor as\n      | (HTMLElement & { setFocus?: () => Promise<void> | void })\n      | null;\n    if (anchor?.setFocus) {\n      anchor.setFocus();\n      return;\n    }\n    this.anchorFocusTarget?.focus();\n  }\n\n  private moveFocusAfterTab(backwards: boolean) {\n    const anchor = this.anchorFocusTarget;\n    if (!anchor) return;\n    if (backwards) {\n      anchor.focus();\n      return;\n    }\n\n    const candidates = Array.from(\n      document.querySelectorAll<HTMLElement>(MENU_FOCUSABLE_SELECTOR)\n    ).filter(\n      element =>\n        !element.closest('.menu-popup') &&\n        !element.closest('[inert]') &&\n        element.getClientRects().length > 0\n    );\n    const index = candidates.indexOf(anchor);\n    (candidates[index + 1] ?? anchor).focus();\n  }\n\n  private compositeTabLeavesPopup(event: KeyboardEvent): boolean {\n    const popup = this.el.querySelector<HTMLElement>('.menu-popup');\n    if (!popup) return true;\n    const focusables = Array.from(\n      popup.querySelectorAll<HTMLElement>(MENU_FOCUSABLE_SELECTOR)\n    ).filter(element => element.getClientRects().length > 0);\n    const currentIndex = focusables.indexOf(event.target as HTMLElement);\n    if (currentIndex < 0) return true;\n    return event.shiftKey ? currentIndex === 0 : currentIndex === focusables.length - 1;\n  }\n\n  private get activeSections(): MenuSection[] {\n    if (this.sections.length > 0) return this.sections;\n    if (this.items.length > 0) return [{ items: this.items }];\n    return [];\n  }\n\n  private get flatItems(): MenuItemData[] {\n    return this.activeSections.flatMap(section =>\n      isMenuPickerSection(section) ? [] : section.items\n    );\n  }\n\n  /** Rich preference content is a non-modal dialog, not an ARIA action menu. */\n  private get hasCompositeSections(): boolean {\n    return this.activeSections.some(isMenuPickerSection);\n  }\n\n  private cancelPositionRetry() {\n    if (this.positionRetryRaf !== null) {\n      cancelAnimationFrame(this.positionRetryRaf);\n      this.positionRetryRaf = null;\n    }\n  }\n\n  /** Retry until anchor + popup exist — do not reveal at 0,0 on a failed first pass. */\n  private schedulePositionUpdate(onReady?: () => void) {\n    if (!this.open) return;\n\n    this.cancelPositionRetry();\n    this.positionReady = false;\n\n    let remaining = POSITION_RETRY_BUDGET;\n\n    const attempt = () => {\n      this.positionRetryRaf = null;\n      if (!this.open) return;\n\n      if (this.calculatePosition()) {\n        this.positionReady = true;\n        onReady?.();\n        return;\n      }\n\n      if (remaining > 0) {\n        remaining -= 1;\n        this.positionRetryRaf = requestAnimationFrame(attempt);\n      }\n    };\n\n    this.positionRetryRaf = requestAnimationFrame(attempt);\n  }\n\n  /** @returns `true` when anchor and popup were found and `pos` was updated. */\n  private calculatePosition(): boolean {\n    const anchorEl = this.resolvedAnchor;\n    if (!anchorEl) return false;\n    const popup = this.el.querySelector('.menu-popup') as HTMLElement | null;\n    if (!popup) return false;\n\n    const anchorRect = anchorEl.getBoundingClientRect();\n    const sectionInsetPx = this.viewportPadPx;\n    if (!this.minWidth) {\n      if (\n        this.anchorAlignment === 'choice-cell' &&\n        (this.side === 'top' || this.side === 'bottom')\n      ) {\n        popup.style.minWidth = `max(var(--dimension-menu-width-xs), ${choicePopupMinWidth(\n          anchorRect.width,\n          sectionInsetPx\n        )}px)`;\n      } else {\n        popup.style.removeProperty('min-width');\n      }\n    }\n\n    this.pos = computeMenuPosition({\n      anchorRect,\n      popupWidth: popup.offsetWidth || this.popupFallbackWidthPx,\n      popupHeight: popup.offsetHeight || this.popupFallbackHeightPx,\n      side: this.side,\n      align: this.align,\n      sideOffsetPx: this.sideOffsetPx,\n      alignOffsetPx: resolveChoicePopupAlignOffset({\n        align: this.align,\n        alignOffsetPx: this.alignOffsetPx,\n        sectionInsetPx,\n        anchorAlignment: this.anchorAlignment,\n      }),\n      viewportPadPx: this.viewportPadPx,\n      viewportWidth: window.innerWidth,\n      viewportHeight: window.innerHeight,\n    });\n    return true;\n  }\n\n  /** Focus the selected item when present, otherwise the first enabled item. */\n  private focusInitialItem() {\n    if (this.hasCompositeSections) {\n      requestAnimationFrame(() => {\n        this.el.querySelector<HTMLElement>('.menu-popup [tabindex=\"0\"]')?.focus();\n      });\n      return;\n    }\n\n    const flat = this.flatItems;\n    const selectedIdx = flat.findIndex(it => it.isSelected && !it.isInactive);\n    const firstEnabledIdx = flat.findIndex(it => !it.isInactive);\n    this.focusedIndex = selectedIdx >= 0 ? selectedIdx : firstEnabledIdx >= 0 ? firstEnabledIdx : 0;\n\n    requestAnimationFrame(() => {\n      const btns = this.el.querySelectorAll<HTMLElement>('.menu-item');\n      btns[this.focusedIndex]?.focus();\n    });\n  }\n\n  private setupListeners() {\n    this.clickOutsideHandler = (e: MouseEvent) => {\n      const t = e.target as Node;\n      const popup = this.el.querySelector('.menu-popup');\n      const anchorEl = this.resolvedAnchor;\n      if (popup?.contains(t) || anchorEl?.contains(t)) return;\n      this.close();\n    };\n\n    this.scrollResizeHandler = () => {\n      if (this.shouldRender && !this.closing) this.calculatePosition();\n    };\n\n    document.addEventListener('mousedown', this.clickOutsideHandler, true);\n    window.addEventListener('scroll', this.scrollResizeHandler, true);\n    window.addEventListener('resize', this.scrollResizeHandler);\n  }\n\n  private teardownListeners() {\n    if (this.clickOutsideHandler) {\n      document.removeEventListener('mousedown', this.clickOutsideHandler, true);\n      this.clickOutsideHandler = null;\n    }\n    if (this.scrollResizeHandler) {\n      window.removeEventListener('scroll', this.scrollResizeHandler, true);\n      window.removeEventListener('resize', this.scrollResizeHandler);\n      this.scrollResizeHandler = null;\n    }\n    if (this.closeTimer) {\n      clearTimeout(this.closeTimer);\n      this.closeTimer = null;\n    }\n  }\n\n  private close(restoreFocus = true) {\n    this.captureClosingSections();\n    if (restoreFocus) this.focusAnchor();\n    this.dsClose.emit();\n    this.open = false;\n    this.onOpenChange(false);\n  }\n\n  @Listen('keydown')\n  handleKeyDown(e: KeyboardEvent) {\n    if (!this.shouldRender || this.closing) return;\n\n    if (e.key === 'Escape') {\n      e.preventDefault();\n      this.close();\n      return;\n    }\n\n    if (e.key === 'Tab') {\n      if (this.hasCompositeSections && !this.compositeTabLeavesPopup(e)) return;\n      e.preventDefault();\n      this.close(false);\n      this.moveFocusAfterTab(e.shiftKey);\n      return;\n    }\n\n    if (this.hasCompositeSections) return;\n\n    const flat = this.flatItems;\n    const enabled = flat\n      .map((it, i) => ({ it, i }))\n      .filter(({ it }) => !it.isInactive)\n      .map(({ i }) => i);\n    if (!enabled.length) return;\n\n    const cur = enabled.indexOf(this.focusedIndex);\n    const safe = cur < 0 ? 0 : cur;\n\n    switch (e.key) {\n      case 'ArrowDown':\n        e.preventDefault();\n        e.stopPropagation();\n        this.focusRingVisible = true;\n        this.focusedIndex = enabled[(safe + 1) % enabled.length];\n        this.focusItem(this.focusedIndex);\n        break;\n      case 'ArrowUp':\n        e.preventDefault();\n        e.stopPropagation();\n        this.focusRingVisible = true;\n        this.focusedIndex = enabled[(safe - 1 + enabled.length) % enabled.length];\n        this.focusItem(this.focusedIndex);\n        break;\n      case 'Home':\n        e.preventDefault();\n        e.stopPropagation();\n        this.focusRingVisible = true;\n        this.focusedIndex = enabled[0];\n        this.focusItem(this.focusedIndex);\n        break;\n      case 'End':\n        e.preventDefault();\n        e.stopPropagation();\n        this.focusRingVisible = true;\n        this.focusedIndex = enabled[enabled.length - 1];\n        this.focusItem(this.focusedIndex);\n        break;\n    }\n  }\n\n  private focusItem(idx: number) {\n    const btns = this.el.querySelectorAll<HTMLElement>('.menu-item');\n    btns[idx]?.focus();\n  }\n\n  private handleItemClick(item: MenuItemData) {\n    if (item.isInactive) return;\n    // Consumers commonly change the item source while handling selection.\n    // Capture first so the exit animation never paints the next menu context.\n    this.captureClosingSections();\n    this.dsSelect.emit(item);\n  }\n\n  private handleGradientSelect(preset: ShellGradientPreset) {\n    this.dsGradientSelect.emit(preset);\n  }\n\n  private handleSwatchSelect(value: string) {\n    this.dsSwatchSelect.emit(value);\n  }\n\n  render() {\n    if (!this.shouldRender) return <Host style={{ display: 'contents' }} />;\n\n    const sections = this.closing\n      ? (this.closingSections ?? this.lastRenderedSections)\n      : this.activeSections;\n    const hasCompositeSections = sections.some(isMenuPickerSection);\n    if (!this.closing) {\n      this.lastRenderedSections = snapshotMenuSections(sections);\n      this.closingSections = null;\n    }\n    let flatIdx = 0;\n\n    const popupStyle: Record<string, string> = {\n      position: 'fixed',\n      left: '0',\n      top: '0',\n      transform: `translate(${Math.round(this.pos.x)}px, ${Math.round(this.pos.y)}px)`,\n      zIndex: '9998',\n      visibility: this.positionReady ? 'visible' : 'hidden',\n    };\n\n    if (this.menuWidth) popupStyle['width'] = this.menuWidth;\n    if (this.minWidth) popupStyle['min-width'] = this.minWidth;\n\n    return (\n      <Host style={{ display: 'contents' }}>\n        <div\n          class={{\n            'menu-popup': true,\n            'menu-popup--closing': this.closing,\n            'ds-choice-popup': true,\n            'ds-choice-popup--closing': this.closing,\n          }}\n          style={popupStyle}\n          role={hasCompositeSections ? 'dialog' : 'menu'}\n          aria-label={this.menuLabel}\n          aria-orientation={hasCompositeSections ? undefined : 'vertical'}\n        >\n          <div class=\"ds-choice-list\">\n            {sections.map((section, si) => (\n              <div\n                key={si}\n                class={{\n                  'menu-section': true,\n                  'menu-section--divided': si < sections.length - 1,\n                  'menu-section--gradient-picker': isMenuPickerSection(section),\n                  'ds-choice-section': true,\n                  'ds-choice-section--divided': si < sections.length - 1,\n                }}\n                role={section.header ? 'group' : undefined}\n                aria-label={section.header}\n              >\n                {section.header && (\n                  <ds-text\n                    class=\"section-header ds-choice-section__header ds-control--md\"\n                    as=\"span\"\n                    variant=\"text-body-small\"\n                    emphasis\n                    color=\"primary\"\n                    aria-hidden=\"true\"\n                  >\n                    {section.header}\n                  </ds-text>\n                )}\n                {isMenuGradientPickerSection(section) ? (\n                  <ds-swatch-picker\n                    value={section.value}\n                    groupLabel={section.header ?? 'Shell gradient theme'}\n                    sections={shellGradientPickerSections()}\n                    onDsChange={(e: CustomEvent<string>) => {\n                      e.stopPropagation();\n                      this.handleGradientSelect(e.detail as ShellGradientPreset);\n                    }}\n                  />\n                ) : isMenuSwatchPickerSection(section) ? (\n                  <ds-swatch-picker\n                    value={section.value}\n                    groupLabel={section.groupLabel ?? section.header ?? 'Swatch options'}\n                    options={section.options ?? []}\n                    sections={section.sections ?? []}\n                    onDsChange={(e: CustomEvent<string>) => {\n                      e.stopPropagation();\n                      this.handleSwatchSelect(e.detail);\n                    }}\n                  />\n                ) : (\n                  section.items.map(item => {\n                    const idx = flatIdx++;\n                    const isFocused = this.focusedIndex === idx;\n                    const isRadioItem =\n                      !hasCompositeSections &&\n                      this.selectionMode === 'single' &&\n                      !item.showSwitch;\n                    return (\n                      <button\n                        key={idx}\n                        type=\"button\"\n                        class={{\n                          'menu-item': true,\n                          'ds-choice-item': true,\n                          'ds-control--md': true,\n                          'ds-focus-ring-inset': true,\n                          'ds-focus-ring--visible': isFocused && this.focusRingVisible,\n                          'ds-interaction-fill': !item.isInactive,\n                          'ds-interaction-fill--selected': !!item.isSelected && !item.isInactive,\n                          'menu-item--selected': !!item.isSelected,\n                          'ds-control-inactive': !!item.isInactive,\n                          'menu-item--destructive': !!item.isDestructive,\n                          'menu-item--focused': isFocused,\n                        }}\n                        role={\n                          hasCompositeSections\n                            ? undefined\n                            : item.showSwitch\n                            ? 'menuitemcheckbox'\n                            : isRadioItem\n                            ? 'menuitemradio'\n                            : 'menuitem'\n                        }\n                        aria-checked={\n                          !hasCompositeSections && item.showSwitch\n                            ? String(!!item.switchValue)\n                            : isRadioItem\n                            ? String(!!item.isSelected)\n                            : undefined\n                        }\n                        aria-pressed={\n                          hasCompositeSections\n                            ? String(item.showSwitch ? !!item.switchValue : !!item.isSelected)\n                            : undefined\n                        }\n                        aria-current={\n                          !hasCompositeSections &&\n                          !item.showSwitch &&\n                          !isRadioItem &&\n                          item.isSelected\n                            ? 'true'\n                            : undefined\n                        }\n                        disabled={item.isInactive}\n                        tabIndex={hasCompositeSections ? 0 : isFocused ? 0 : -1}\n                        onMouseDown={() => {\n                          this.focusRingVisible = false;\n                        }}\n                        onClick={() => this.handleItemClick(item)}\n                        onFocus={() => {\n                          this.focusedIndex = idx;\n                        }}\n                      >\n                        {isRadioItem && (\n                          <span\n                            class=\"menu-item__radio-box ds-interaction-fill__content\"\n                            aria-hidden=\"true\"\n                          >\n                            <span\n                              class={{\n                                'menu-item__radio': true,\n                                'menu-item__radio--checked': !!item.isSelected,\n                              }}\n                            >\n                              {item.isSelected && <span class=\"menu-item__radio-dot\" />}\n                            </span>\n                          </span>\n                        )}\n                        <div class=\"menu-item__content ds-choice-item__content ds-interaction-fill__content\">\n                          <ds-text\n                            class=\"menu-item__label ds-choice-item__label\"\n                            as=\"span\"\n                            variant=\"text-body-medium\"\n                            color={item.isSelected ? 'primary' : 'secondary'}\n                          >\n                            {item.label}\n                          </ds-text>\n                          {item.subtext && (\n                            <ds-text\n                              class=\"menu-item__subtext ds-choice-item__subtext\"\n                              as=\"span\"\n                              variant=\"text-body-small\"\n                              color=\"secondary\"\n                            >\n                              {item.subtext}\n                            </ds-text>\n                          )}\n                        </div>\n                        {item.dot && (\n                          <span\n                            class=\"menu-item__dot-box ds-interaction-fill__content\"\n                            aria-hidden=\"true\"\n                          >\n                            <ds-badge\n                              class=\"menu-item__dot\"\n                              variant=\"dot\"\n                              hasRing={false}\n                              label=\"\"\n                            />\n                          </span>\n                        )}\n                        {item.showSwitch && (\n                          <ds-switch\n                            class=\"menu-item__switch ds-interaction-fill__content\"\n                            size=\"md\"\n                            checked={!!item.switchValue}\n                            presentation\n                          />\n                        )}\n                      </button>\n                    );\n                  })\n                )}\n              </div>\n            ))}\n          </div>\n        </div>\n      </Host>\n    );\n  }\n}\n"],"mappings":"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","ignoreList":[]}

package/dist/components/{p-B4RQoNmL.js → p-C1K5QGUZ.js}

@@ -1,2 +1,2 @@
-import{p as e,H as s,h as o,a as t,t as a}from"./index.js";import{d as i}from"./p-DrDHC7V6.js";import{d as c}from"./p-CKnoWZd9.js";import{d}from"./p-DuNZGFkV.js";import{d as r}from"./p-Cpr3K41-.js";import{d as n}from"./p-CZZYGqKz.js";const l=()=>`.sc-ds-code-block-h{display:block;width:100%;min-width:0;box-sizing:border-box;-webkit-user-select:none;user-select:none}.code-block.sc-ds-code-block{width:100%;min-width:0;margin:0;overflow:hidden;border-radius:var(--dimension-radius-050);background:var(--color-background-strong-neutral);color:var(--color-foreground-faint-neutral);box-sizing:border-box}.code-block__header.sc-ds-code-block{display:flex;align-items:center;justify-content:space-between;gap:var(--dimension-space-100);min-height:var(--dimension-size-400);padding:var(--dimension-space-050) var(--dimension-space-100);background:var(--color-background-strong-neutral);box-sizing:border-box}pre.sc-ds-code-block{margin:0;padding:var(--dimension-space-150);overflow:auto;font-family:var(--typography-fontfamily-mono);font-size:var(--typography-fontsize-sm);line-height:var(--typography-lineheight-sm);tab-size:2;-webkit-user-select:text;user-select:text}code.sc-ds-code-block{font:inherit;white-space:pre}`;const f=e(class e extends s{constructor(e){super();if(e!==false){this.__registerHost()}this.code="";this.language="";this.filename="";this.copied=false;this.copy=async()=>{if(!navigator.clipboard||!this.code)return;await navigator.clipboard.writeText(this.code);this.copied=true;if(this.copiedTimer)clearTimeout(this.copiedTimer);this.copiedTimer=setTimeout((()=>{this.copied=false}),2e3)}}disconnectedCallback(){if(this.copiedTimer)clearTimeout(this.copiedTimer)}render(){const e=this.filename||this.language||"Code";return o(t,{key:"088508dc9f7bb1a89d2660f78a5efe9f3556e4fe"},o("figure",{key:"79fa3045d4b3c6b86e88fe61648aea662859a921",class:"code-block"},o("figcaption",{key:"f0352f343f8bf670d5b5270da440d31b80ba7702",class:"code-block__header"},o("ds-text",{key:"a20657dd9fce663a20329dcfd49fbaacb965e8ad",as:"span",variant:"text-caption",emphasis:true,color:"on-strong"},e),o("ds-button-unfilled",{key:"343a61d618dc777e51382fdcc61bc3e955af2315",variant:"icon",icon:this.copied?"Check":"Copy",size:"xs","aria-label":this.copied?"Copied":"Copy code",hasBorder:false,onDsClick:this.copy})),o("pre",{key:"e079679bee2ffe31fe9e4c08e08dde96b8c1b2a7"},o("code",{key:"ad5a6ec1b138502a6ec453f4e561edec152b2f7f"},this.code))))}static get style(){return l()}},[2,"ds-code-block",{code:[1],language:[1],filename:[1],copied:[32]}]);function b(){if(typeof customElements==="undefined"){return}const e=["ds-code-block","ds-badge","ds-button-unfilled","ds-icon","ds-loader","ds-text"];e.forEach((e=>{switch(e){case"ds-code-block":if(!customElements.get(a(e))){customElements.define(a(e),f)}break;case"ds-badge":if(!customElements.get(a(e))){i()}break;case"ds-button-unfilled":if(!customElements.get(a(e))){c()}break;case"ds-icon":if(!customElements.get(a(e))){d()}break;case"ds-loader":if(!customElements.get(a(e))){r()}break;case"ds-text":if(!customElements.get(a(e))){n()}break}}))}b();export{f as C,b as d};
-//# sourceMappingURL=p-B4RQoNmL.js.map
+import{p as e,H as s,h as o,a as t,t as a}from"./index.js";import{d as i}from"./p-DrDHC7V6.js";import{d as c}from"./p-DTqCBjUj.js";import{d}from"./p-DuNZGFkV.js";import{d as r}from"./p-Cpr3K41-.js";import{d as n}from"./p-CZZYGqKz.js";const l=()=>`.sc-ds-code-block-h{display:block;width:100%;min-width:0;box-sizing:border-box;-webkit-user-select:none;user-select:none}.code-block.sc-ds-code-block{width:100%;min-width:0;margin:0;overflow:hidden;border-radius:var(--dimension-radius-050);background:var(--color-background-strong-neutral);color:var(--color-foreground-faint-neutral);box-sizing:border-box}.code-block__header.sc-ds-code-block{display:flex;align-items:center;justify-content:space-between;gap:var(--dimension-space-100);min-height:var(--dimension-size-400);padding:var(--dimension-space-050) var(--dimension-space-100);background:var(--color-background-strong-neutral);box-sizing:border-box}pre.sc-ds-code-block{margin:0;padding:var(--dimension-space-150);overflow:auto;font-family:var(--typography-fontfamily-mono);font-size:var(--typography-fontsize-sm);line-height:var(--typography-lineheight-sm);tab-size:2;-webkit-user-select:text;user-select:text}code.sc-ds-code-block{font:inherit;white-space:pre}`;const f=e(class e extends s{constructor(e){super();if(e!==false){this.__registerHost()}this.code="";this.language="";this.filename="";this.copied=false;this.copy=async()=>{if(!navigator.clipboard||!this.code)return;await navigator.clipboard.writeText(this.code);this.copied=true;if(this.copiedTimer)clearTimeout(this.copiedTimer);this.copiedTimer=setTimeout((()=>{this.copied=false}),2e3)}}disconnectedCallback(){if(this.copiedTimer)clearTimeout(this.copiedTimer)}render(){const e=this.filename||this.language||"Code";return o(t,{key:"088508dc9f7bb1a89d2660f78a5efe9f3556e4fe"},o("figure",{key:"79fa3045d4b3c6b86e88fe61648aea662859a921",class:"code-block"},o("figcaption",{key:"f0352f343f8bf670d5b5270da440d31b80ba7702",class:"code-block__header"},o("ds-text",{key:"a20657dd9fce663a20329dcfd49fbaacb965e8ad",as:"span",variant:"text-caption",emphasis:true,color:"on-strong"},e),o("ds-button-unfilled",{key:"343a61d618dc777e51382fdcc61bc3e955af2315",variant:"icon",icon:this.copied?"Check":"Copy",size:"xs","aria-label":this.copied?"Copied":"Copy code",hasBorder:false,onDsClick:this.copy})),o("pre",{key:"e079679bee2ffe31fe9e4c08e08dde96b8c1b2a7"},o("code",{key:"ad5a6ec1b138502a6ec453f4e561edec152b2f7f"},this.code))))}static get style(){return l()}},[2,"ds-code-block",{code:[1],language:[1],filename:[1],copied:[32]}]);function b(){if(typeof customElements==="undefined"){return}const e=["ds-code-block","ds-badge","ds-button-unfilled","ds-icon","ds-loader","ds-text"];e.forEach((e=>{switch(e){case"ds-code-block":if(!customElements.get(a(e))){customElements.define(a(e),f)}break;case"ds-badge":if(!customElements.get(a(e))){i()}break;case"ds-button-unfilled":if(!customElements.get(a(e))){c()}break;case"ds-icon":if(!customElements.get(a(e))){d()}break;case"ds-loader":if(!customElements.get(a(e))){r()}break;case"ds-text":if(!customElements.get(a(e))){n()}break}}))}b();export{f as C,b as d};
+//# sourceMappingURL=p-C1K5QGUZ.js.map

package/dist/components/p-CjP8sYlo.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-CZZYGqKz.js";const r=()=>`.ds-control-inactive.sc-ds-checkbox-h,.ds-control-inactive.sc-ds-checkbox{opacity:0.25;pointer-events:none;cursor:not-allowed}.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--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: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;--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;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)}.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}.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:pointer;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--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)}`;const d={md:"text-body-medium",sm:"text-body-small",xs:"text-caption"};let a=0;const l=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-${++a}`;this.checked=false;this.size="md";this.value="on";this.disabled=false;this.required=false;this.requiredMessage="This field is required.";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;this.internals.setFormValue(!o&&this.checked?this.value:null);const s=this.required&&!o&&!this.checked;this.internals.setValidity(s?{valueMissing:true}:{},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:"3db862399abe1c36e3e7da80d15473083a1ac2c6",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:"2069b23342167cd236d9c7653194219291abc54c",class:"checkbox__placement ds-interaction-fill__content","aria-hidden":"true"},i("span",{key:"5cada1f567c5fd4ba32385cce37d3ee0532c7ada",class:{box:true,"box--marked":s}},s&&i("svg",{key:"7b1993b783ac0456428e39d8189353cfdf7aea2d",class:{checkbox__mark:true,"checkbox__mark--checked":!this.indeterminate},viewBox:"0 0 16 16",fill:"none",focusable:"false"},i("path",{key:"843c9857b377125f9d009b206ded76094889dcb9",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:"7cf32b0526ce0a0160fb7a8b925cc798bff5bda4",class:"checkbox__label ds-interaction-fill__content",as:"span",variant:d[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 r()}},[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 h(){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),l)}break;case"ds-text":if(!customElements.get(n(o))){t()}break}}))}h();export{l as C,h as d};
+//# sourceMappingURL=p-CjP8sYlo.js.map

package/dist/components/{p-CS12e52R.js.map → p-CjP8sYlo.js.map}

@@ -1 +1 @@
-{"version":3,"names":["checkboxCss","LABEL_VARIANT","md","sm","xs","idCounter","Checkbox","__stencil_proxyCustomElement","HTMLElement","constructor","registerHost","this","labelId","checked","size","value","disabled","required","requiredMessage","indeterminate","isInactive","presentation","initialChecked","initialIndeterminate","formDisabled","handleActivate","dsChange","emit","handleKeyDown","e","key","preventDefault","componentWillLoad","syncFormValue","inactive","internals","setFormValue","missing","setValidity","valueMissing","formDisabledCallback","formResetCallback","render","isMarked","invalid","h","Host","role","undefined","String","tabIndex","class","checkbox","onClick","onKeyDown","box","checkbox__mark","viewBox","fill","focusable","d","as","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: pointer;\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` (25% opacity). */\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';\n\nexport type CheckboxSize = 'md' | 'sm' | 'xs';\n\nconst LABEL_VARIANT: Record<CheckboxSize, 'text-body-medium' | 'text-body-small' | 'text-caption'> = {\n  md: 'text-body-medium',\n  sm: 'text-body-small',\n  xs: 'text-caption',\n};\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 = 'This field is required.';\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    this.internals.setFormValue(!inactive && this.checked ? this.value : null);\n    const missing = this.required && !inactive && !this.checked;\n    this.internals.setValidity(missing ? { valueMissing: true } : {}, 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={LABEL_VARIANT[this.size]}\n            textId={this.labelId}\n          >\n            {this.label}\n          </ds-text>\n        )}\n      </Host>\n    );\n  }\n}\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"names":["checkboxCss","LABEL_VARIANT","md","sm","xs","idCounter","Checkbox","__stencil_proxyCustomElement","HTMLElement","constructor","registerHost","this","labelId","checked","size","value","disabled","required","requiredMessage","indeterminate","isInactive","presentation","initialChecked","initialIndeterminate","formDisabled","handleActivate","dsChange","emit","handleKeyDown","e","key","preventDefault","componentWillLoad","syncFormValue","inactive","internals","setFormValue","missing","setValidity","valueMissing","formDisabledCallback","formResetCallback","render","isMarked","invalid","h","Host","role","undefined","String","tabIndex","class","checkbox","onClick","onKeyDown","box","checkbox__mark","viewBox","fill","focusable","d","as","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: pointer;\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` (25% opacity). */\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';\n\nexport type CheckboxSize = 'md' | 'sm' | 'xs';\n\nconst LABEL_VARIANT: Record<CheckboxSize, 'text-body-medium' | 'text-body-small' | 'text-caption'> = {\n  md: 'text-body-medium',\n  sm: 'text-body-small',\n  xs: 'text-caption',\n};\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 = 'This field is required.';\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    this.internals.setFormValue(!inactive && this.checked ? this.value : null);\n    const missing = this.required && !inactive && !this.checked;\n    this.internals.setValidity(missing ? { valueMissing: true } : {}, 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={LABEL_VARIANT[this.size]}\n            textId={this.labelId}\n          >\n            {this.label}\n          </ds-text>\n        )}\n      </Host>\n    );\n  }\n}\n"],"mappings":"sGAAA,MAAMA,EAAc,IAAM,m7SCI1B,MAAMC,EAA+F,CACnGC,GAAI,mBACJC,GAAI,kBACJC,GAAI,gBAGN,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,gBAA0B,0BAETP,KAAAQ,cAAyB,MAE1CR,KAAAS,WAAsB,MAEtBT,KAAAU,aAAwB,MAKxBV,KAAAW,eAAiB,MACjBX,KAAAY,qBAAuB,MACdZ,KAAAa,aAAe,MA+BxBb,KAAAc,eAAiB,KACvB,GAAId,KAAKS,YAAcT,KAAKK,UAAYL,KAAKa,cAAgBb,KAAKU,aAAc,OAChF,GAAIV,KAAKQ,cAAeR,KAAKQ,cAAgB,MAC7CR,KAAKE,SAAWF,KAAKE,QACrBF,KAAKe,SAASC,KAAKhB,KAAKE,QAAQ,EAG1BF,KAAAiB,cAAiBC,IACvB,GAAIA,EAAEC,MAAQ,SAAWD,EAAEC,MAAQ,IAAK,CACtCD,EAAEE,iBACFpB,KAAKc,gB,EAiEV,CAxGC,iBAAAO,GACErB,KAAKW,eAAiBX,KAAKE,QAC3BF,KAAKY,qBAAuBZ,KAAKQ,cACjCR,KAAKsB,e,CASP,aAAAA,GACE,MAAMC,EAAWvB,KAAKS,YAAcT,KAAKK,UAAYL,KAAKa,cAAgBb,KAAKU,aAC/EV,KAAKwB,UAAUC,cAAcF,GAAYvB,KAAKE,QAAUF,KAAKI,MAAQ,MACrE,MAAMsB,EAAU1B,KAAKM,WAAaiB,IAAavB,KAAKE,QACpDF,KAAKwB,UAAUG,YAAYD,EAAU,CAAEE,aAAc,MAAS,GAAIF,EAAU1B,KAAKO,gBAAkB,G,CAGrG,oBAAAsB,CAAqBxB,GACnBL,KAAKa,aAAeR,EACpBL,KAAKsB,e,CAGP,iBAAAQ,GACE9B,KAAKE,QAAUF,KAAKW,eACpBX,KAAKQ,cAAgBR,KAAKY,oB,CAiB5B,MAAAmB,GACE,MAAMR,EAAWvB,KAAKS,YAAcT,KAAKK,UAAYL,KAAKa,aAC1D,MAAMmB,EAAWhC,KAAKE,SAAWF,KAAKQ,cACtC,MAAMyB,EAAUjC,KAAKM,WAAaiB,IAAavB,KAAKE,QAEpD,OACEgC,EAACC,EAAI,CAAAhB,IAAA,2CACHiB,KAAMpC,KAAKU,aAAe2B,UAAY,WAAU,eAClCrC,KAAKU,aAAe2B,UAAYrC,KAAKQ,cAAgB,QAAU8B,OAAOtC,KAAKE,SAAQ,iBACjFF,KAAKU,cAAgBa,EAAW,OAASc,UAAS,iBAClDrC,KAAKU,cAAgBV,KAAKM,SAAW,OAAS+B,UAAS,gBACxDrC,KAAKU,cAAgBuB,EAAU,OAASI,UAAS,kBAC/CrC,KAAKU,aAAe2B,UAAYrC,KAAKC,QAAO,cAChDD,KAAKU,aAAe,OAAS2B,UAC1CE,SAAUvC,KAAKU,cAAgBa,GAAW,EAAK,EAC/CiB,MAAO,CACLC,SAAU,KACV,yBAA0BzC,KAAKU,aAC/B,CAAC,aAAaV,KAAKG,QAAS,KAC5B,CAAC,eAAeH,KAAKG,QAAS,KAC9B,sBAAuBoB,IAAavB,KAAKU,aACzC,uBAAwBV,KAAKU,aAC7B,uBAAwBa,IAAavB,KAAKU,cAE5CgC,QAAS1C,KAAKU,aAAe2B,UAAYrC,KAAKc,eAC9C6B,UAAW3C,KAAKU,aAAe2B,UAAYrC,KAAKiB,eAEhDiB,EAAA,QAAAf,IAAA,2CAAMqB,MAAM,mDAAkD,cAAa,QACzEN,EAAA,QAAAf,IAAA,2CAAMqB,MAAO,CAAEI,IAAK,KAAM,cAAeZ,IACtCA,GAECE,EAAA,OAAAf,IAAA,2CACEqB,MAAO,CACLK,eAAgB,KAChB,2BAA4B7C,KAAKQ,eAEnCsC,QAAQ,YACRC,KAAK,OACLC,UAAU,SAEVd,EAAA,QAAAf,IAAA,2CACE8B,EAAGjD,KAAKQ,cAAgB,UAAY,gCAA+B,gBACrD,2BAMtBR,KAAKU,cACLwB,EAAA,WAAAf,IAAA,2CACEqB,MAAM,+CACNU,GAAG,OACHC,QAAS7D,EAAcU,KAAKG,MAC5BiD,OAAQpD,KAAKC,SAEZD,KAAKqD,O","ignoreList":[]}

package/dist/components/p-CrwU83-g.js

@@ -0,0 +1,2 @@
+function n(n,t){const i=n.trim().split(/\s+/)[0]??"";const e=parseFloat(i);if(Number.isNaN(e))return t;if(/ms\s*$/.test(i))return e;if(/s\s*$/.test(i))return e*1e3;return e}function t(n){const t=n.match(/^var\(\s*(--[^),]+)/);if(t)return t[1].trim();if(n.startsWith("--"))return n.trim();return null}function i(i,e){if(typeof document==="undefined")return e;const o=t(i);if(!o)return n(i,e);const s=getComputedStyle(document.documentElement).getPropertyValue(o).trim();return n(s,e)}function e(e,o){if(typeof e==="number")return e;const s=typeof e==="string"&&e.trim()?e.trim():o;const a=t(s);if(a){return i(s,i(o,200))}return n(s,i(o,200))}function o(){return typeof window!=="undefined"&&typeof window.matchMedia==="function"&&window.matchMedia("(prefers-reduced-motion: reduce)").matches}function s(n,t){return o()?0:e(n,t)}const a="--dimension-menu-width-xs";const r="--dimension-radius-025";const c="--dimension-size-200";const u="--dimension-size-300";const d="--dimension-size-400";const m="--dimension-space-050";const f="--dimension-space-200";const l="--effect-animation-delay-instant";const h="--effect-animation-delay-long-2";const p="--effect-animation-delay-medium-3";const y="--effect-animation-duration-medium-1";const g="--effect-animation-duration-short-3";const z="--effect-motion-short-2";const b="--effect-motion-short-3";const v="--typography-lineheight-md";const w="--typography-lineheight-xl";const D={space050:m,space200:f,radius025:r,size200:c,size300:u,size400:d,menuWidthXs:a,lineheightMd:v,lineheightXl:w,motionShort2:z,motionShort3:b,animationDurationShort3:g,animationDurationMedium1:y,animationDelayInstant:l,animationDelayMedium3:p,animationDelayLong2:h,menuFallbackHeight:"calc(var(--dimension-size-base) * 20)",tooltipFallbackWidth:"calc(var(--dimension-size-800) + var(--dimension-size-200))",donutFillMin:"calc(var(--dimension-size-base) * 16)",donutFillMax:"calc(var(--dimension-size-base) * 24)"};const F={space050:`var(${m})`};export{D as T,s as a,F as b,o as c,n as p,e as r};
+//# sourceMappingURL=p-CrwU83-g.js.map