@ds-mo/ui 14.19.0 → 14.19.1

package/dist/components/p-CKtJ6FHM.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["isMenuSwatchPickerSection","section","variant","isMenuPickerSection","snapshotMenuSections","sections","map","options","option","swatchSection","items","item","menuReorderableRange","index","reorderable","start","end","length","moveReorderableMenuItemBefore","fromIndex","insertBefore","range","clamped","Math","min","max","toIndex","next","splice","moveReorderableMenuItemBy","offset","locateMenuItem","flatIndex","remaining","sectionIndex","itemIndex","createMenuReorderDetail","nextItems","indexOf","value","matched","findIndex","candidate","menuCss","MENU_ITEM_TAG_SIZE","lg","md","sm","xs","Menu","__stencil_proxyCustomElement","HTMLElement","constructor","registerHost","this","open","size","selectionMode","side","align","anchorAlignment","sideOffset","TOKEN_CSS_LENGTHS","space050","alignOffset","initialFocusVisible","menuLabel","shouldRender","closing","pos","x","y","focusedIndex","positionReady","availableHeight","focusRingVisible","reorderFromFlat","reorderInsertBefore","reorderAnnouncement","closeTimer","suppressItemClick","reorderPointer","position","AnchoredPositionController","getAnchor","resolvedAnchor","getPopup","el","querySelector","getOwnerDocument","ownerDocument","measure","anchorEl","popup","anchorRect","getBoundingClientRect","sectionInsetPx","viewportPadPx","minWidth","style","choicePopupMinWidth","width","removeProperty","list","naturalPopupHeight","offsetHeight","scrollHeight","window","innerHeight","input","popupWidth","offsetWidth","popupFallbackWidthPx","popupHeight","popupFallbackHeightPx","sideOffsetPx","alignOffsetPx","resolveChoicePopupAlignOffset","viewportWidth","innerWidth","viewportHeight","collisionRect","resolveAnchoredOverlayBoundaryRect","boundary","unconstrained","computeAnchoredPosition","apply","onReady","liveUpdate","topLayer","observeResize","observeAnchorMotion","interaction","AnchoredOverlayInteractionController","onOutsideActivation","close","lastRenderedSections","closingSections","onReorderPointerMove","event","drag","pointerId","activeSections","resolveReorderInsertBefore","clientY","onReorderPointerUp","clearReorderPointer","queueMicrotask","emitReorder","onReorderPointerCancel","componentDidLoad","onOpenChange","disconnectedCallback","cancelPositionRetry","cancelLivePositionUpdate","teardownListeners","isOpen","setupListeners","schedulePositionUpdate","focusInitialItem","positionReadyCallback","undefined","captureClosingSections","closeAnimationMs","finishClose","setTimeout","onAnchorChange","onPositionPropsChange","resolveCssLengthPx","TOKEN_DEFAULTS","menuWidthXs","menuFallbackHeight","resolveMotionTimeMs","motionShort2","animationDurationShort3","matches","hidePopover","dsAfterClose","emit","visibleSections","anchor","anchorId","document","getElementById","compositeTabLeavesPopup","tabLeavesPopup","flatItems","flatMap","hasCompositeSections","some","cancel","scheduleLivePositionUpdate","scheduleLiveUpdate","callback","schedule","calculatePosition","update","requestAnimationFrame","focus","flat","selectedIdx","it","isSelected","isInactive","firstEnabledIdx","btns","querySelectorAll","connect","observe","unobserve","disconnect","clearTimeout","restoreFocus","focusAnchor","dsClose","handleKeyDown","e","key","preventDefault","moveFocusAfterTab","shiftKey","altKey","ctrlKey","handleReorderKey","enabled","i","filter","cur","safe","stopPropagation","focusItem","idx","handleItemClick","dsSelect","handleSwatchSelect","dsSwatchSelect","located","detail","flatIndexFor","announceReorder","dsReorder","count","label","onReorderPointerDown","button","addEventListener","buttons","sectionStart","row","rect","top","height","removeEventListener","render","h","Host","display","flatIdx","dragLocated","dragRange","popupStyle","left","transform","round","zIndex","visibility","menuWidth","floor","popover","class","role","si","Boolean","header","as","CONTROL_SUPPORTING_TEXT_VARIANT","emphasis","color","groupLabel","onDsChange","isFocused","isSingleSelectionItem","showSwitch","usesLeading","icon","locked","dragging","dropBefore","dropAfter","type","isDestructive","String","switchValue","disabled","tabIndex","onMouseDown","onClick","onFocus","onPointerDown","name","CONTROL_TEXT_VARIANT","subtext","tag","intent","contrast","rounded","isInset","dot","hasRing","checked","presentation"],"sources":["src/wc/components/Menu/menu-types.ts","src/wc/components/Menu/menu-sections.ts","src/wc/components/Menu/menu-reorder.ts","src/wc/components/Menu/Menu.css?tag=ds-menu&encapsulation=scoped","src/wc/components/Menu/Menu.tsx"],"sourcesContent":["import type { SwatchPickerOption, SwatchPickerSection } from '../SwatchPicker/swatch-picker-types';\nimport type { TagContrast, TagIntent } from '../Tag/Tag';\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 MenuItemTagData {\n  label: string;\n  intent?: TagIntent;\n  contrast?: TagContrast;\n  rounded?: boolean;\n}\n\nexport interface MenuItemData {\n  label: string;\n  value?: string;\n  subtext?: string;\n  /** Leading decorative icon. Ignored when `reorderable` is true. */\n  icon?: string;\n  /** Show a supplemental brand notification dot. */\n  dot?: boolean;\n  /** Show a non-interactive tag at the trailing edge of the row. */\n  tag?: MenuItemTagData;\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  /** Prefix a drag handle and allow pointer and keyboard reorder within the contiguous reorderable run. */\n  reorderable?: boolean;\n}\n\n/** Next section item order after a pointer or keyboard reorder. */\nexport interface MenuReorderDetail {\n  item: MenuItemData;\n  fromIndex: number;\n  toIndex: number;\n  sectionIndex: number;\n  items: MenuItemData[];\n}\n\nexport interface MenuItemsSection {\n  header?: string;\n  items: MenuItemData[];\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 = MenuItemsSection | MenuSwatchPickerSection;\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(section: MenuSection): section is MenuSwatchPickerSection {\n  return isMenuSwatchPickerSection(section);\n}\n\nexport type { SwatchPickerOption, SwatchPickerSection };\n","import type { MenuSection } from './menu-types';\nimport { isMenuSwatchPickerSection } from './menu-types';\n\n/** Preserve the exact menu context painted during exit motion. */\nexport function snapshotMenuSections(sections: readonly MenuSection[]): MenuSection[] {\n  return sections.map(section => {\n    if (isMenuSwatchPickerSection(section)) {\n      return {\n        ...section,\n        ...(section.options ? { options: section.options.map(option => ({ ...option })) } : {}),\n        ...(section.sections\n          ? {\n              sections: section.sections.map(swatchSection => ({\n                ...swatchSection,\n                options: swatchSection.options.map(option => ({ ...option })),\n              })),\n            }\n          : {}),\n      };\n    }\n    return { ...section, items: section.items.map(item => ({ ...item })) };\n  });\n}\n","import {\n  isMenuPickerSection,\n  type MenuItemData,\n  type MenuReorderDetail,\n  type MenuSection,\n} from './menu-types';\n\nexport interface MenuReorderRange {\n  start: number;\n  end: number;\n}\n\n/** Contiguous reorderable run containing `index`, or null when that row cannot move. */\nexport function menuReorderableRange(\n  items: readonly MenuItemData[],\n  index: number\n): MenuReorderRange | null {\n  if (!items[index]?.reorderable) return null;\n\n  let start = index;\n  while (start > 0 && items[start - 1]?.reorderable) start -= 1;\n\n  let end = index;\n  while (end < items.length - 1 && items[end + 1]?.reorderable) end += 1;\n\n  return { start, end };\n}\n\n/**\n * Move a reorderable row so it would be inserted before `insertBefore`.\n * `insertBefore` is clamped to the contiguous reorderable run.\n */\nexport function moveReorderableMenuItemBefore(\n  items: readonly MenuItemData[],\n  fromIndex: number,\n  insertBefore: number\n): MenuItemData[] | null {\n  const range = menuReorderableRange(items, fromIndex);\n  if (!range) return null;\n\n  const clamped = Math.min(Math.max(insertBefore, range.start), range.end + 1);\n  let toIndex = clamped;\n  if (fromIndex < toIndex) toIndex -= 1;\n  if (toIndex === fromIndex || toIndex < range.start || toIndex > range.end) return null;\n\n  const next = [...items];\n  const [item] = next.splice(fromIndex, 1);\n  next.splice(toIndex, 0, item);\n  return next;\n}\n\n/** Keyboard step: move one slot within the reorderable run. */\nexport function moveReorderableMenuItemBy(\n  items: readonly MenuItemData[],\n  fromIndex: number,\n  offset: number\n): MenuItemData[] | null {\n  if (offset === 0) return null;\n  return moveReorderableMenuItemBefore(\n    items,\n    fromIndex,\n    fromIndex + (offset < 0 ? offset : offset + 1)\n  );\n}\n\nexport function locateMenuItem(\n  sections: readonly MenuSection[],\n  flatIndex: number\n): { sectionIndex: number; itemIndex: number; items: MenuItemData[] } | null {\n  let remaining = flatIndex;\n  for (let sectionIndex = 0; sectionIndex < sections.length; sectionIndex += 1) {\n    const section = sections[sectionIndex];\n    if (isMenuPickerSection(section)) continue;\n    if (remaining < section.items.length) {\n      return { sectionIndex, itemIndex: remaining, items: section.items };\n    }\n    remaining -= section.items.length;\n  }\n  return null;\n}\n\nexport function createMenuReorderDetail(\n  items: MenuItemData[],\n  fromIndex: number,\n  nextItems: MenuItemData[],\n  sectionIndex: number\n): MenuReorderDetail | null {\n  const item = items[fromIndex];\n  if (!item) return null;\n  const toIndex = nextItems.indexOf(item);\n  if (toIndex < 0) {\n    const value = item.value;\n    const matched = value ? nextItems.findIndex(candidate => candidate.value === value) : -1;\n    if (matched < 0) return null;\n    return { item, fromIndex, toIndex: matched, sectionIndex, items: nextItems };\n  }\n  return { item, fromIndex, toIndex, sectionIndex, items: nextItems };\n}\n","@import '../../utils/choice-list.css';\n@import '../../utils/visually-hidden.css';\n@import '../../utils/forced-colors.css';\n\n/* Inactive: `.ds-control-inactive` (50% 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 keeps an 8px label-to-control gap without changing the\n   density gap between a prefix icon or drag handle and the label. */\n.menu-item__switch {\n  flex-shrink: 0;\n  margin-inline-start: calc(\n    var(--dimension-space-100) - var(--ds-control-gap, var(--dimension-space-050))\n  );\n}\n\n/* ── Prefix icon / reorder handle ────────────────────────────────────────── */\n\n.menu-item > .menu-item__handle {\n  pointer-events: auto;\n  cursor: grab;\n  touch-action: none;\n}\n\n.menu-item > .menu-item__handle:active,\n.menu-item--dragging > .menu-item__handle {\n  cursor: grabbing;\n}\n\n.menu-item--dragging {\n  opacity: var(--effect-opacity-medium);\n}\n\n.menu-item__drop-rail {\n  position: absolute;\n  z-index: var(--dimension-z-index-raised);\n  inset-inline: var(--dimension-space-050);\n  block-size: var(--dimension-stroke-width-025);\n  border-radius: var(--dimension-radius-half);\n  background: var(--color-border-bold-brand);\n  pointer-events: none;\n}\n\n.menu-item__drop-rail--before {\n  inset-block-start: calc(-1 * var(--dimension-space-025));\n  transform: translateY(-50%);\n}\n\n.menu-item__drop-rail--after {\n  inset-block-end: calc(-1 * var(--dimension-space-025));\n  transform: translateY(50%);\n}\n\n@media (forced-colors: active) {\n  .menu-item__drop-rail {\n    background: var(--ds-forced-color-selected);\n  }\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  CONTROL_SUPPORTING_TEXT_VARIANT,\n  CONTROL_TEXT_VARIANT,\n  resolveChoicePopupAlignOffset,\n  resolveCssLengthPx,\n  resolveMotionTimeMs,\n  TOKEN_CSS_LENGTHS,\n  TOKEN_DEFAULTS,\n  type ChoicePopupAnchorAlignment,\n  type ControlSize,\n} from '../../utils';\nimport { AnchoredPositionController } from '../../utils/anchored-position-controller';\nimport { AnchoredOverlayInteractionController } from '../../utils/anchored-overlay-interaction-controller';\nimport { resolveAnchoredOverlayBoundaryRect } from '../../utils/anchored-overlay-boundary';\nimport { computeAnchoredPosition, type AnchoredPositionInput } from '../../utils/anchored-position';\nimport type { MenuAlign, MenuSide } from './menu-position';\nimport {\n  isMenuPickerSection,\n  isMenuSwatchPickerSection,\n  type MenuItemData,\n  type MenuReorderDetail,\n  type MenuSection,\n} from './menu-types';\nimport { snapshotMenuSections } from './menu-sections';\nimport {\n  createMenuReorderDetail,\n  locateMenuItem,\n  menuReorderableRange,\n  moveReorderableMenuItemBefore,\n  moveReorderableMenuItemBy,\n} from './menu-reorder';\n\nexport type MenuSelectionMode = 'none' | 'single';\nexport type MenuSize = ControlSize;\nconst MENU_ITEM_TAG_SIZE: Record<MenuSize, 'md' | 'sm' | 'xs'> = {\n  lg: 'md',\n  md: 'sm',\n  sm: 'xs',\n  xs: 'xs',\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  /** Choice-row density. */\n  @Prop() size: MenuSize = 'md';\n  /** Give ordinary rows mutually-exclusive menu semantics using isSelected. */\n  @Prop() selectionMode: MenuSelectionMode = 'none';\n  @Prop() sections: MenuSection[] = [];\n  /** Preferred side; placement flips to the opposite side when that offers a better fit. */\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  /** Explicit collision owner; otherwise the nearest data-ds-overlay-boundary ancestor is used. */\n  @Prop() boundary: HTMLElement | 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 availableHeight: number | null = null;\n  @State() private focusRingVisible: boolean = false;\n  @State() private reorderFromFlat: number | null = null;\n  @State() private reorderInsertBefore: number | null = null;\n  @State() private reorderAnnouncement = '';\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 generic `swatch-picker` section option is chosen. */\n  @Event() dsSwatchSelect!: EventEmitter<string>;\n  /** Emitted after a pointer drop or keyboard move; Menu never mutates item order. */\n  @Event() dsReorder!: EventEmitter<MenuReorderDetail>;\n\n  private closeTimer: ReturnType<typeof setTimeout> | null = null;\n  private positionReadyCallback: (() => void) | undefined;\n  private suppressItemClick = false;\n  private reorderPointer: {\n    pointerId: number;\n    sectionIndex: number;\n    fromIndex: number;\n  } | null = null;\n  /**\n   * Anchored placement. The choice-cell measurement stays here on purpose: the\n   * inner-cell align offset and the `--dimension-menu-width-xs` floor are Menu\n   * semantics, not shared geometry.\n   */\n  private readonly position = new AnchoredPositionController({\n    getAnchor: () => this.resolvedAnchor ?? null,\n    getPopup: () => this.el.querySelector<HTMLElement>('.menu-popup'),\n    getOwnerDocument: () => this.el.ownerDocument,\n    measure: (anchorEl, popup) => {\n      if (!this.open) return null;\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      const viewportPadPx = this.viewportPadPx;\n      const list = popup.querySelector<HTMLElement>('.ds-choice-list');\n      const naturalPopupHeight = Math.min(\n        Math.max(popup.offsetHeight, list?.scrollHeight ?? 0),\n        window.innerHeight - viewportPadPx * 2\n      );\n      const input: AnchoredPositionInput = {\n        anchorRect,\n        popupWidth: popup.offsetWidth || this.popupFallbackWidthPx,\n        popupHeight: naturalPopupHeight || 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,\n        viewportWidth: window.innerWidth,\n        viewportHeight: window.innerHeight,\n        collisionRect: resolveAnchoredOverlayBoundaryRect(anchorEl, this.boundary),\n      };\n      const unconstrained = computeAnchoredPosition(input);\n      return {\n        ...input,\n        popupHeight: Math.min(input.popupHeight, unconstrained.availableHeight),\n      };\n    },\n    apply: ({ x, y, availableHeight }) => {\n      this.pos = { x, y };\n      this.availableHeight = availableHeight;\n    },\n    onReady: () => {\n      this.positionReady = true;\n    },\n    liveUpdate: 'double-frame',\n    topLayer: true,\n    observeResize: true,\n    observeAnchorMotion: true,\n  });\n  private readonly interaction = new AnchoredOverlayInteractionController({\n    getAnchor: () => this.resolvedAnchor,\n    getPopup: () => this.el.querySelector<HTMLElement>('.menu-popup'),\n    getOwnerDocument: () => this.el.ownerDocument,\n    onOutsideActivation: () => this.close(),\n  });\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.cancelLivePositionUpdate();\n    this.clearReorderPointer();\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.availableHeight = null;\n      this.focusRingVisible = this.initialFocusVisible;\n      this.setupListeners();\n      this.schedulePositionUpdate(() => {\n        this.focusInitialItem();\n      });\n    } else if (this.shouldRender) {\n      this.positionReadyCallback = undefined;\n      this.cancelPositionRetry();\n      this.captureClosingSections();\n      this.closing = true;\n      this.teardownListeners();\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  @Watch('boundary')\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    const popup = this.el.querySelector<HTMLElement>('.menu-popup');\n    if (popup?.matches(':popover-open')) popup.hidePopover();\n    this.shouldRender = false;\n    this.closing = false;\n    this.lastRenderedSections = [];\n    this.closingSections = null;\n    this.clearReorderPointer();\n    this.reorderAnnouncement = '';\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 compositeTabLeavesPopup(event: KeyboardEvent): boolean {\n    return this.interaction.tabLeavesPopup(event);\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    this.position.cancel();\n  }\n\n  private cancelLivePositionUpdate() {\n    this.position.cancel();\n  }\n\n  /** Reposition after the current scroll/layout frame without hiding the open popup. */\n  private scheduleLivePositionUpdate() {\n    this.position.scheduleLiveUpdate();\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    this.positionReady = false;\n    // Opening often sets `open` and `anchorId` together. Each Watch reschedules\n    // placement; keep the open-path ready callback so initial focus is not dropped.\n    if (onReady) this.positionReadyCallback = onReady;\n    const callback = this.positionReadyCallback;\n    this.position.schedule(() => {\n      if (this.positionReadyCallback === callback) {\n        this.positionReadyCallback = undefined;\n      }\n      callback?.();\n    });\n  }\n\n  /** @returns `true` when anchor and popup were found and `pos` was updated. */\n  private calculatePosition(): boolean {\n    return this.position.update();\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 || !!it.reorderable);\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.interaction.connect();\n    this.position.observe();\n  }\n\n  private teardownListeners() {\n    this.position.unobserve();\n    this.interaction.disconnect();\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.interaction.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.interaction.moveFocusAfterTab(e.shiftKey);\n      return;\n    }\n\n    if (this.hasCompositeSections) return;\n\n    if ((e.key === 'ArrowUp' || e.key === 'ArrowDown') && e.altKey && !e.ctrlKey && !e.shiftKey) {\n      this.handleReorderKey(e);\n      return;\n    }\n\n    const flat = this.flatItems;\n    const enabled = flat\n      .map((it, i) => ({ it, i }))\n      .filter(({ it }) => !it.isInactive || !!it.reorderable)\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 (this.suppressItemClick) {\n      this.suppressItemClick = false;\n      return;\n    }\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 handleSwatchSelect(value: string) {\n    this.dsSwatchSelect.emit(value);\n  }\n\n  private handleReorderKey(event: KeyboardEvent): void {\n    const located = locateMenuItem(this.activeSections, this.focusedIndex);\n    if (!located || !located.items[located.itemIndex]?.reorderable) return;\n\n    const nextItems = moveReorderableMenuItemBy(\n      located.items,\n      located.itemIndex,\n      event.key === 'ArrowUp' ? -1 : 1\n    );\n    if (!nextItems) return;\n\n    event.preventDefault();\n    event.stopPropagation();\n    this.emitReorder(located.items, located.itemIndex, nextItems, located.sectionIndex);\n  }\n\n  private emitReorder(\n    items: MenuItemData[],\n    fromIndex: number,\n    nextItems: MenuItemData[],\n    sectionIndex: number\n  ): void {\n    const detail = createMenuReorderDetail(items, fromIndex, nextItems, sectionIndex);\n    if (!detail) return;\n    this.focusedIndex = this.flatIndexFor(sectionIndex, detail.toIndex);\n    this.announceReorder(detail);\n    this.dsReorder.emit(detail);\n  }\n\n  private flatIndexFor(sectionIndex: number, itemIndex: number): number {\n    let flat = 0;\n    for (let index = 0; index < this.activeSections.length; index += 1) {\n      const section = this.activeSections[index];\n      if (isMenuPickerSection(section)) continue;\n      if (index === sectionIndex) return flat + itemIndex;\n      flat += section.items.length;\n    }\n    return itemIndex;\n  }\n\n  private announceReorder(detail: MenuReorderDetail): void {\n    const range = menuReorderableRange(detail.items, detail.toIndex);\n    const count = range ? range.end - range.start + 1 : detail.items.length;\n    const position = range ? detail.toIndex - range.start + 1 : detail.toIndex + 1;\n    this.reorderAnnouncement = `${detail.item.label} moved to position ${position} of ${count}`;\n  }\n\n  private onReorderPointerDown(\n    event: PointerEvent,\n    sectionIndex: number,\n    itemIndex: number,\n    flatIndex: number\n  ): void {\n    if (event.button !== 0) return;\n    const section = this.activeSections[sectionIndex];\n    if (!section || isMenuPickerSection(section)) return;\n    if (!section.items[itemIndex]?.reorderable) return;\n\n    event.preventDefault();\n    event.stopPropagation();\n    this.suppressItemClick = true;\n    this.focusRingVisible = false;\n    this.focusedIndex = flatIndex;\n    this.focusItem(flatIndex);\n    this.reorderPointer = {\n      pointerId: event.pointerId,\n      sectionIndex,\n      fromIndex: itemIndex,\n    };\n    this.reorderFromFlat = flatIndex;\n    this.reorderInsertBefore = itemIndex;\n    window.addEventListener('pointermove', this.onReorderPointerMove);\n    window.addEventListener('pointerup', this.onReorderPointerUp);\n    window.addEventListener('pointercancel', this.onReorderPointerCancel);\n  }\n\n  private onReorderPointerMove = (event: PointerEvent) => {\n    const drag = this.reorderPointer;\n    if (!drag || event.pointerId !== drag.pointerId) return;\n    const section = this.activeSections[drag.sectionIndex];\n    if (!section || isMenuPickerSection(section)) return;\n\n    const insertBefore = this.resolveReorderInsertBefore(\n      event.clientY,\n      drag.sectionIndex,\n      drag.fromIndex,\n      section.items\n    );\n    if (insertBefore !== this.reorderInsertBefore) this.reorderInsertBefore = insertBefore;\n  };\n\n  private onReorderPointerUp = (event: PointerEvent) => {\n    const drag = this.reorderPointer;\n    if (!drag || event.pointerId !== drag.pointerId) return;\n\n    const section = this.activeSections[drag.sectionIndex];\n    const insertBefore = this.reorderInsertBefore;\n    this.clearReorderPointer();\n    queueMicrotask(() => {\n      this.suppressItemClick = false;\n    });\n    if (!section || isMenuPickerSection(section) || insertBefore === null) return;\n\n    const nextItems = moveReorderableMenuItemBefore(section.items, drag.fromIndex, insertBefore);\n    if (!nextItems) return;\n    this.emitReorder(section.items, drag.fromIndex, nextItems, drag.sectionIndex);\n  };\n\n  private onReorderPointerCancel = (event: PointerEvent) => {\n    if (!this.reorderPointer || event.pointerId !== this.reorderPointer.pointerId) return;\n    this.clearReorderPointer();\n    queueMicrotask(() => {\n      this.suppressItemClick = false;\n    });\n  };\n\n  private resolveReorderInsertBefore(\n    clientY: number,\n    sectionIndex: number,\n    fromIndex: number,\n    items: MenuItemData[]\n  ): number {\n    const range = menuReorderableRange(items, fromIndex);\n    if (!range) return fromIndex;\n\n    const buttons = [...this.el.querySelectorAll<HTMLElement>('.menu-item')];\n    const sectionStart = this.flatIndexFor(sectionIndex, 0);\n    let insertBefore = range.end + 1;\n    for (let itemIndex = range.start; itemIndex <= range.end; itemIndex += 1) {\n      const row = buttons[sectionStart + itemIndex];\n      if (!row) continue;\n      const rect = row.getBoundingClientRect();\n      if (clientY < rect.top + rect.height / 2) {\n        insertBefore = itemIndex;\n        break;\n      }\n    }\n    return Math.min(Math.max(insertBefore, range.start), range.end + 1);\n  }\n\n  private clearReorderPointer(): void {\n    if (this.reorderPointer) {\n      window.removeEventListener('pointermove', this.onReorderPointerMove);\n      window.removeEventListener('pointerup', this.onReorderPointerUp);\n      window.removeEventListener('pointercancel', this.onReorderPointerCancel);\n    }\n    this.reorderPointer = null;\n    this.reorderFromFlat = null;\n    this.reorderInsertBefore = null;\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    const dragLocated =\n      this.reorderFromFlat === null ? null : locateMenuItem(sections, this.reorderFromFlat);\n    const dragRange = dragLocated\n      ? menuReorderableRange(dragLocated.items, dragLocated.itemIndex)\n      : null;\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    if (this.availableHeight !== null) {\n      popupStyle['max-height'] = `${Math.floor(this.availableHeight)}px`;\n    }\n\n    return (\n      <Host style={{ display: 'contents' }}>\n        <div\n          popover=\"manual\"\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--swatch-picker': isMenuPickerSection(section),\n                  'ds-choice-section': true,\n                  'ds-chrome-column': true,\n                  'ds-chrome-space--sm': true,\n                  'ds-choice-section--divided': si < sections.length - 1,\n                  'ds-choice-section--headed-after-first': si > 0 && Boolean(section.header),\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-section-heading ds-control--${this.size}`}\n                    as=\"span\"\n                    variant={CONTROL_SUPPORTING_TEXT_VARIANT[this.size]}\n                    emphasis\n                    color=\"primary\"\n                    aria-hidden=\"true\"\n                  >\n                    <span class=\"ds-choice-section__header-label\">{section.header}</span>\n                  </ds-text>\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, itemIndex) => {\n                    const idx = flatIdx++;\n                    const isFocused = this.focusedIndex === idx;\n                    const isSingleSelectionItem =\n                      !hasCompositeSections && this.selectionMode === 'single' && !item.showSwitch;\n                    const usesLeading = section.items.some(\n                      candidate => candidate.reorderable || !!candidate.icon\n                    );\n                    const locked = !!item.isInactive && !item.reorderable;\n                    const dragging = this.reorderFromFlat === idx;\n                    const dropBefore =\n                      dragLocated?.sectionIndex === si &&\n                      dragRange !== null &&\n                      itemIndex <= dragRange.end &&\n                      this.reorderInsertBefore === itemIndex;\n                    const dropAfter =\n                      dragLocated?.sectionIndex === si &&\n                      dragRange !== null &&\n                      this.reorderInsertBefore === dragRange.end + 1 &&\n                      itemIndex === dragRange.end;\n                    return (\n                      <button\n                        key={item.value ?? `${si}-${item.label}`}\n                        type=\"button\"\n                        class={{\n                          'menu-item': true,\n                          'ds-choice-item': true,\n                          'ds-control-frame': true,\n                          [`ds-control--${this.size}`]: true,\n                          'ds-focus-ring-inset': true,\n                          'ds-focus-ring--visible': isFocused && this.focusRingVisible,\n                          'ds-interaction-fill': !locked,\n                          'ds-interaction-fill--selected': !!item.isSelected && !locked,\n                          'menu-item--selected': !!item.isSelected,\n                          'menu-item--switch': !!item.showSwitch,\n                          'ds-control-inactive': locked,\n                          'menu-item--destructive': !!item.isDestructive,\n                          'menu-item--focused': isFocused,\n                          'menu-item--dragging': dragging,\n                        }}\n                        role={\n                          hasCompositeSections\n                            ? undefined\n                            : item.showSwitch\n                              ? 'menuitemcheckbox'\n                              : isSingleSelectionItem\n                                ? 'menuitemradio'\n                                : 'menuitem'\n                        }\n                        aria-checked={\n                          !hasCompositeSections && item.showSwitch\n                            ? String(!!item.switchValue)\n                            : isSingleSelectionItem\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                          !isSingleSelectionItem &&\n                          item.isSelected\n                            ? 'true'\n                            : undefined\n                        }\n                        aria-description={\n                          item.reorderable\n                            ? item.isInactive\n                              ? 'Visibility cannot be changed. Alt + Arrow Up or Alt + Arrow Down moves this row.'\n                              : 'Drag to reorder. Alt + Arrow Up or Alt + Arrow Down moves this row.'\n                            : undefined\n                        }\n                        aria-disabled={item.isInactive ? 'true' : undefined}\n                        disabled={locked}\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                        {(dropBefore || dropAfter) && (\n                          <span\n                            class={{\n                              'menu-item__drop-rail': true,\n                              'menu-item__drop-rail--before': dropBefore,\n                              'menu-item__drop-rail--after': dropAfter,\n                            }}\n                            data-menu-drop-rail\n                            aria-hidden=\"true\"\n                          />\n                        )}\n                        {item.reorderable ? (\n                          <span\n                            class=\"menu-item__handle ds-choice-item__icon ds-control-icon-box ds-interaction-fill__content\"\n                            data-menu-handle\n                            aria-hidden=\"true\"\n                            onPointerDown={event =>\n                              this.onReorderPointerDown(event, si, itemIndex, idx)\n                            }\n                            onClick={event => {\n                              event.preventDefault();\n                              event.stopPropagation();\n                            }}\n                          >\n                            <ds-icon name=\"Drag\" size={this.size} color=\"inherit\" />\n                          </span>\n                        ) : usesLeading && item.icon ? (\n                          <span\n                            class=\"menu-item__icon ds-choice-item__icon ds-control-icon-box ds-interaction-fill__content\"\n                            aria-hidden=\"true\"\n                          >\n                            <ds-icon name={item.icon} size={this.size} color=\"inherit\" />\n                          </span>\n                        ) : usesLeading ? (\n                          <span\n                            class=\"menu-item__icon-spacer ds-choice-item__icon ds-control-icon-box\"\n                            aria-hidden=\"true\"\n                          />\n                        ) : null}\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 ds-control-label-box\"\n                            as=\"span\"\n                            variant={CONTROL_TEXT_VARIANT[this.size]}\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 ds-control-label-box\"\n                              as=\"span\"\n                              variant={CONTROL_SUPPORTING_TEXT_VARIANT[this.size]}\n                              color=\"secondary\"\n                            >\n                              {item.subtext}\n                            </ds-text>\n                          )}\n                        </div>\n                        {item.tag && (\n                          <ds-tag\n                            class=\"ds-choice-item__tag ds-interaction-fill__content\"\n                            label={item.tag.label}\n                            size={MENU_ITEM_TAG_SIZE[this.size]}\n                            intent={item.tag.intent ?? 'neutral'}\n                            contrast={item.tag.contrast ?? 'faint'}\n                            rounded={item.tag.rounded ?? false}\n                            isInset\n                          />\n                        )}\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={this.size}\n                            checked={!!item.switchValue}\n                            isInactive={!!item.isInactive}\n                            presentation\n                          />\n                        )}\n                      </button>\n                    );\n                  })\n                )}\n              </div>\n            ))}\n          </div>\n        </div>\n        <div class=\"ds-visually-hidden\" role=\"status\" aria-live=\"polite\">\n          {this.reorderAnnouncement}\n        </div>\n      </Host>\n    );\n  }\n}\n"],"mappings":"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","ignoreList":[]}

package/dist/components/p-CRSwNbPk.js

@@ -0,0 +1,2 @@
+import{p as e,H as n,c as a,h as s,a as i,t}from"./index.js";import{r as o,p as r,a as d,d as l,s as c,b as v}from"./p-BWwiCvep.js";import{c as p}from"./p-1YHFQeI7.js";import{r as h}from"./p-rCeztgVn.js";import{d as f}from"./p-caLOcQUK.js";import{d as g}from"./p-DIqT1m2r.js";import{d as u}from"./p-Cea7rROU.js";import{d as m}from"./p-0XTyQNRG.js";import{d as b}from"./p-B-HsfQOK.js";import{d as _}from"./p-Cp5Hr7Vz.js";function x(e){const n=Array.isArray(e.edges)?e.edges:[e.edges];const a={"scroll-edge-fade":true,"scroll-edge-fade--scroll-aware":e.scrollAware===true,"scroll-edge-fade--hidden":e.hidden===true};for(const e of n){a[`scroll-edge-fade--${e}`]=true}const{atEnd:s}=e;if(s===true){a["scroll-edge-fade--at-end"]=true}else if(s&&typeof s==="object"){for(const e of n){if(s[e]){a[`scroll-edge-fade--${e}-at-edge`]=true}}}return a}const w={side:"right",align:"end",anchorAlignment:"choice-cell",sideOffset:"calc(var(--dimension-space-100) + var(--dimension-space-050))",alignOffset:0};const y="data-nav-style";function k(e){if(e==="dashboard"||e==="settings")return e;return undefined}function z(e,n,a){const s=k(n);if(s)return s;const i=typeof document!=="undefined"?document.documentElement.getAttribute(y):null;const t=k(i);if(t)return t;return e}function C(e,n){return e!==n}const A="ds-panel-nav-user-menu-anchor";const I=()=>`@property --ds-scroll-edge-fade-top{syntax:'<length-percentage>';inherits:false;initial-value:0px}@property --ds-scroll-edge-fade-bottom{syntax:'<length-percentage>';inherits:false;initial-value:0px}@property --ds-scroll-edge-fade-left{syntax:'<length-percentage>';inherits:false;initial-value:0px}@property --ds-scroll-edge-fade-right{syntax:'<length-percentage>';inherits:false;initial-value:0px}@keyframes ds-scroll-edge-fade-reveal-top{from{--ds-scroll-edge-fade-top:0px}to{--ds-scroll-edge-fade-top:var(--ds-scroll-edge-fade-target-top)}}@keyframes ds-scroll-edge-fade-reveal-bottom{from{--ds-scroll-edge-fade-bottom:var(--ds-scroll-edge-fade-target-bottom)}to{--ds-scroll-edge-fade-bottom:0px}}@keyframes ds-scroll-edge-fade-reveal-left{from{--ds-scroll-edge-fade-left:0px}to{--ds-scroll-edge-fade-left:var(--ds-scroll-edge-fade-target-left)}}@keyframes ds-scroll-edge-fade-reveal-right{from{--ds-scroll-edge-fade-right:var(--ds-scroll-edge-fade-target-right)}to{--ds-scroll-edge-fade-right:0px}}.scroll-edge-fade.sc-ds-panel-nav{--ds-scroll-edge-fade-size:var(--dimension-size-600);--ds-scroll-edge-fade-reveal-distance:var(--dimension-size-800);--ds-scroll-edge-fade-target-top:0px;--ds-scroll-edge-fade-target-bottom:0px;--ds-scroll-edge-fade-target-left:0px;--ds-scroll-edge-fade-target-right:0px;--ds-scroll-edge-fade-top:var(--ds-scroll-edge-fade-target-top);--ds-scroll-edge-fade-bottom:var(--ds-scroll-edge-fade-target-bottom);--ds-scroll-edge-fade-left:var(--ds-scroll-edge-fade-target-left);--ds-scroll-edge-fade-right:var(--ds-scroll-edge-fade-target-right);--ds-scroll-edge-fade-block-mask:linear-gradient(     to bottom,     transparent 0,     #000 var(--ds-scroll-edge-fade-top),     #000 calc(100% - var(--ds-scroll-edge-fade-bottom)),     transparent 100%   );--ds-scroll-edge-fade-inline-mask:linear-gradient(     to right,     transparent 0,     #000 var(--ds-scroll-edge-fade-left),     #000 calc(100% - var(--ds-scroll-edge-fade-right)),     transparent 100%   );-webkit-mask-image:var(--ds-scroll-edge-fade-block-mask), var(--ds-scroll-edge-fade-inline-mask);mask-image:var(--ds-scroll-edge-fade-block-mask), var(--ds-scroll-edge-fade-inline-mask);-webkit-mask-composite:source-in;mask-composite:intersect;-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask-size:100% 100%;mask-size:100% 100%}.scroll-edge-fade--top.sc-ds-panel-nav{--ds-scroll-edge-fade-target-top:var(--ds-scroll-edge-fade-size)}.scroll-edge-fade--bottom.sc-ds-panel-nav{--ds-scroll-edge-fade-target-bottom:var(--ds-scroll-edge-fade-size)}.scroll-edge-fade--left.sc-ds-panel-nav{--ds-scroll-edge-fade-target-left:var(--ds-scroll-edge-fade-size)}.scroll-edge-fade--right.sc-ds-panel-nav{--ds-scroll-edge-fade-target-right:var(--ds-scroll-edge-fade-size)}.scroll-edge-fade--top-at-edge.sc-ds-panel-nav{--ds-scroll-edge-fade-target-top:0px}.scroll-edge-fade--bottom-at-edge.sc-ds-panel-nav{--ds-scroll-edge-fade-target-bottom:0px}.scroll-edge-fade--left-at-edge.sc-ds-panel-nav{--ds-scroll-edge-fade-target-left:0px}.scroll-edge-fade--right-at-edge.sc-ds-panel-nav{--ds-scroll-edge-fade-target-right:0px}@supports (animation-timeline: scroll()){.scroll-edge-fade--scroll-aware.sc-ds-panel-nav{animation-name:ds-scroll-edge-fade-reveal-top, ds-scroll-edge-fade-reveal-bottom,       ds-scroll-edge-fade-reveal-left, ds-scroll-edge-fade-reveal-right;animation-duration:1ms;animation-timing-function:ease-in-out;animation-fill-mode:both;animation-timeline:scroll(self y), scroll(self y), scroll(self x), scroll(self x);animation-range:0 var(--ds-scroll-edge-fade-reveal-distance),       calc(100% - var(--ds-scroll-edge-fade-reveal-distance)) 100%,       0 var(--ds-scroll-edge-fade-reveal-distance),       calc(100% - var(--ds-scroll-edge-fade-reveal-distance)) 100%}@media (prefers-reduced-motion: reduce){.scroll-edge-fade--scroll-aware.sc-ds-panel-nav{animation:none}}}.scroll-edge-fade--at-end.sc-ds-panel-nav,.scroll-edge-fade--hidden.sc-ds-panel-nav{-webkit-mask-image:none;mask-image:none}.scroll-edge-fade--block-window.sc-ds-panel-nav{--ds-scroll-edge-fade-window-start:100%;--ds-scroll-edge-fade-window-end:100%;-webkit-mask-image:linear-gradient(     to bottom,     #000 0,     #000 var(--ds-scroll-edge-fade-window-start),     transparent var(--ds-scroll-edge-fade-window-end)   );mask-image:linear-gradient(     to bottom,     #000 0,     #000 var(--ds-scroll-edge-fade-window-start),     transparent var(--ds-scroll-edge-fade-window-end)   );-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat}`;const N=()=>`.ds-control--lg.sc-ds-panel-nav,.ds-control--lg.sc-ds-panel-nav-h,.ds-control--md.sc-ds-panel-nav-h,.ds-control--md.sc-ds-panel-nav,.ds-control--sm.sc-ds-panel-nav-h,.ds-control--sm.sc-ds-panel-nav,.ds-control--xs.sc-ds-panel-nav-h,.ds-control--xs.sc-ds-panel-nav{--ds-control-radius:var(--dimension-radius-025)}.ds-control--lg.sc-ds-panel-nav-h,.ds-control--lg.sc-ds-panel-nav{--ds-control-height:var(--dimension-size-500);--ds-control-icon:var(--dimension-iconography-lg);--ds-control-padding-inline:var(--dimension-space-100);--ds-control-label-inset:var(--dimension-space-050);--ds-control-gap:var(--dimension-space-050)}.ds-control--md.sc-ds-panel-nav-h,.ds-control--md.sc-ds-panel-nav{--ds-control-height:var(--dimension-size-400);--ds-control-icon:var(--dimension-iconography-md);--ds-control-padding-inline:var(--dimension-space-075);--ds-control-label-inset:var(--dimension-space-025);--ds-control-gap:var(--dimension-space-050)}.ds-control--sm.sc-ds-panel-nav-h,.ds-control--sm.sc-ds-panel-nav{--ds-control-height:var(--dimension-size-300);--ds-control-icon:var(--dimension-iconography-sm);--ds-control-padding-inline:var(--dimension-space-050);--ds-control-label-inset:var(--dimension-space-025);--ds-control-gap:var(--dimension-space-025)}.ds-control--xs.sc-ds-panel-nav-h,.ds-control--xs.sc-ds-panel-nav{--ds-control-height:var(--dimension-size-200);--ds-control-icon:var(--dimension-iconography-xs);--ds-control-padding-inline:var(--dimension-space-025);--ds-control-label-inset:var(--dimension-space-025);--ds-control-gap:0}.ds-chrome-space--sm.sc-ds-panel-nav-h,.ds-chrome-space--sm.sc-ds-panel-nav{--ds-chrome-padding:var(--dimension-space-050);--ds-chrome-gap:var(--dimension-space-050)}.ds-chrome-space--md.sc-ds-panel-nav-h,.ds-chrome-space--md.sc-ds-panel-nav{--ds-chrome-padding:var(--dimension-space-100);--ds-chrome-gap:var(--dimension-space-100)}.ds-chrome-space--lg.sc-ds-panel-nav-h,.ds-chrome-space--lg.sc-ds-panel-nav{--ds-chrome-padding:var(--dimension-space-200);--ds-chrome-gap:var(--dimension-space-200)}.ds-chrome-row.sc-ds-panel-nav-h,.ds-chrome-row.sc-ds-panel-nav,.ds-chrome-column.sc-ds-panel-nav-h,.ds-chrome-column.sc-ds-panel-nav,.ds-chrome-grid.sc-ds-panel-nav-h,.ds-chrome-grid.sc-ds-panel-nav{display:flex;box-sizing:border-box;gap:var(--ds-chrome-gap, var(--dimension-space-100));padding:var(--ds-chrome-padding, var(--dimension-space-100))}.ds-chrome-row.sc-ds-panel-nav-h,.ds-chrome-row.sc-ds-panel-nav{flex-direction:row;align-items:center}.ds-chrome-column.sc-ds-panel-nav-h,.ds-chrome-column.sc-ds-panel-nav{flex-direction:column}.ds-chrome-grid.sc-ds-panel-nav-h,.ds-chrome-grid.sc-ds-panel-nav{display:grid;align-items:center}@media (forced-colors: active){.sc-ds-panel-nav:root,.sc-ds-panel-nav-h,.ds-forced-colors-scope.sc-ds-panel-nav{--ds-forced-color-surface:Canvas;--ds-forced-color-content:CanvasText;--ds-forced-color-control-boundary:ButtonText;--ds-forced-color-selected:Highlight;--ds-forced-color-on-selected:HighlightText;--ds-forced-color-disabled:GrayText}}.sc-ds-panel-nav-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-panel-nav-h,.ds-focus-ring.sc-ds-panel-nav,.ds-focus-ring-inset.sc-ds-panel-nav-h,.ds-focus-ring-inset.sc-ds-panel-nav{outline:none;-webkit-tap-highlight-color:transparent;touch-action:manipulation}.ds-focus-ring.sc-ds-panel-nav-h:focus-visible,.ds-focus-ring.sc-ds-panel-nav: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-panel-nav-h,.ds-focus-ring.ds-focus-ring--visible.sc-ds-panel-nav{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-panel-nav-h:focus-visible,.ds-focus-ring-inset.sc-ds-panel-nav:focus-visible{outline:none}.ds-focus-ring-inset.sc-ds-panel-nav-h:focus-visible::after,.ds-focus-ring-inset.sc-ds-panel-nav: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-panel-nav-h,.ds-focus-ring-inset.ds-focus-ring--visible.sc-ds-panel-nav{outline:none}.ds-focus-ring-inset.ds-focus-ring--visible.sc-ds-panel-nav-h::after,.ds-focus-ring-inset.ds-focus-ring--visible.sc-ds-panel-nav::after{outline:var(--ds-focus-ring-width) solid var(--ds-focus-ring-color);outline-offset:calc(-1 * var(--ds-focus-ring-width))}@media (forced-colors: active){.sc-ds-panel-nav-h{--ds-focus-ring-color:var(--ds-forced-color-selected)}}@media (forced-colors: active){.sc-ds-panel-nav:root,.sc-ds-panel-nav-h,.ds-forced-colors-scope.sc-ds-panel-nav{--ds-forced-color-surface:Canvas;--ds-forced-color-content:CanvasText;--ds-forced-color-control-boundary:ButtonText;--ds-forced-color-selected:Highlight;--ds-forced-color-on-selected:HighlightText;--ds-forced-color-disabled:GrayText}}.ds-interaction-fill.sc-ds-panel-nav-h,.ds-interaction-fill.sc-ds-panel-nav{position:var(--ds-interaction-position, relative);z-index:var(--ds-interaction-z-index, 0);cursor:default;--ds-interaction-hover:var(--color-interaction-hover);--ds-interaction-pressed:var(--color-interaction-pressed);--ds-interaction-active:var(--color-interaction-active-brand);--ds-interaction-border-width:0px;--ds-interaction-border-color:transparent;--ds-interaction-divider-width:0px;--ds-interaction-divider-color:transparent;--ds-interaction-divider-inline-start-width:0px;--ds-interaction-divider-inline-start-color:transparent;--ds-interaction-divider-inline-end-width:0px;--ds-interaction-divider-inline-end-color:transparent}.ds-interaction-fill.sc-ds-panel-nav-h::before,.ds-interaction-fill.sc-ds-panel-nav::before,.ds-interaction-fill.sc-ds-panel-nav-h::after,.ds-interaction-fill.sc-ds-panel-nav::after{content:'';position:absolute;inset:0;border-radius:inherit;background:transparent;pointer-events:none;cursor:inherit;transition:none}.ds-interaction-fill.sc-ds-panel-nav-h::before,.ds-interaction-fill.sc-ds-panel-nav::before{z-index:1}.ds-interaction-fill.sc-ds-panel-nav-h::after,.ds-interaction-fill.sc-ds-panel-nav::after{z-index:3;box-shadow:inset 0 calc(-1 * var(--ds-interaction-divider-width)) 0 var(--ds-interaction-divider-color),     inset var(--ds-interaction-divider-inline-start-width) 0 0       var(--ds-interaction-divider-inline-start-color),     inset calc(-1 * var(--ds-interaction-divider-inline-end-width)) 0 0       var(--ds-interaction-divider-inline-end-color),     inset 0 0 0 var(--ds-interaction-border-width) var(--ds-interaction-border-color)}.ds-interaction-fill--bordered.sc-ds-panel-nav-h,.ds-interaction-fill--bordered.sc-ds-panel-nav{--ds-interaction-border-width:var(--dimension-stroke-width-012);--ds-interaction-border-color:var(--color-border-secondary)}.ds-interaction-fill--selected.sc-ds-panel-nav-h::before,.ds-interaction-fill--selected.sc-ds-panel-nav::before{background:var(--ds-interaction-active)}.ds-interaction-fill--selected.sc-ds-panel-nav-h,.ds-interaction-fill--selected.sc-ds-panel-nav{--ds-interaction-dot-ring:var(--ds-interaction-active)}@media (hover: hover) and (pointer: fine){.ds-interaction-fill.sc-ds-panel-nav-h:hover:not(:disabled)::after,.ds-interaction-fill.sc-ds-panel-nav:hover:not(:disabled)::after{background:var(--ds-interaction-hover)}}.ds-interaction-fill.sc-ds-panel-nav-h:active:not(:disabled)::after,.ds-interaction-fill.sc-ds-panel-nav:active:not(:disabled)::after{background:var(--ds-interaction-pressed)}.ds-interaction-fill--grouped.sc-ds-panel-nav-h::after,.ds-interaction-fill--grouped.sc-ds-panel-nav::after,.ds-interaction-fill--grouped.sc-ds-panel-nav-h:active:not(:disabled)::after,.ds-interaction-fill--grouped.sc-ds-panel-nav:active:not(:disabled)::after{background:var(--ds-interaction-group-fill, transparent)}@media (hover: hover) and (pointer: fine){.ds-interaction-fill--grouped.sc-ds-panel-nav-h:hover:not(:disabled)::after,.ds-interaction-fill--grouped.sc-ds-panel-nav:hover:not(:disabled)::after{background:var(--ds-interaction-group-fill, transparent)}}.ds-interaction-fill--grouped.sc-ds-panel-nav-h,.ds-interaction-fill--grouped.sc-ds-panel-nav{--ds-interaction-divider-width:var(--ds-interaction-group-divider-width, 0px);--ds-interaction-divider-color:var(--ds-interaction-group-divider-color, transparent);--ds-interaction-divider-inline-start-width:var(     --ds-interaction-group-divider-inline-start-width,     0px   );--ds-interaction-divider-inline-start-color:var(     --ds-interaction-group-divider-inline-start-color,     transparent   );--ds-interaction-divider-inline-end-width:var(     --ds-interaction-group-divider-inline-end-width,     0px   );--ds-interaction-divider-inline-end-color:var(     --ds-interaction-group-divider-inline-end-color,     transparent   )}.ds-interaction-fill.sc-ds-panel-nav-h>.ds-interaction-fill__content.sc-ds-panel-nav,.ds-interaction-fill.sc-ds-panel-nav>.ds-interaction-fill__content.sc-ds-panel-nav,.ds-interaction-fill__content.sc-ds-panel-nav{position:relative;z-index:2;cursor:inherit}.ds-interaction-fill--on-faint.sc-ds-panel-nav-h,.ds-interaction-fill--on-faint.sc-ds-panel-nav{--ds-interaction-active:var(--color-interaction-active)}.ds-interaction-fill--on-medium.sc-ds-panel-nav-h,.ds-interaction-fill--on-medium.sc-ds-panel-nav{--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-panel-nav-h,.ds-interaction-fill--on-bold.sc-ds-panel-nav{--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-panel-nav-h,.ds-interaction-fill--on-strong.sc-ds-panel-nav{--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-panel-nav-h,.ds-interaction-fill--on-translucent.sc-ds-panel-nav{--ds-interaction-hover:var(--color-translucent-interaction-hover);--ds-interaction-pressed:var(--color-translucent-interaction-pressed);--ds-interaction-active:var(--color-translucent-interaction-active-brand);--ds-focus-ring-color:var(--color-translucent-interaction-focus)}.ds-interaction-fill--on-inverted.sc-ds-panel-nav-h,.ds-interaction-fill--on-inverted.sc-ds-panel-nav{--ds-interaction-hover:var(--color-inverted-interaction-hover);--ds-interaction-pressed:var(--color-inverted-interaction-pressed);--ds-interaction-active:var(--color-inverted-interaction-active-brand);--ds-focus-ring-color:var(--color-inverted-interaction-focus)}.ds-interaction-fill--on-media.sc-ds-panel-nav-h,.ds-interaction-fill--on-media.sc-ds-panel-nav{--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-panel-nav-h,.ds-interaction-fill--on-always-dark.sc-ds-panel-nav{--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-brand);--ds-focus-ring-color:var(--color-always-dark-interaction-focus)}.ds-interaction-fill--on-navigation.sc-ds-panel-nav-h,.ds-interaction-fill--on-navigation.sc-ds-panel-nav{--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)}@media (forced-colors: active){.ds-interaction-fill.sc-ds-panel-nav-h::after,.ds-interaction-fill.sc-ds-panel-nav::after{box-shadow:none;outline:var(--ds-interaction-border-width) solid var(--ds-forced-color-control-boundary);outline-offset:calc(-1 * var(--ds-interaction-border-width))}.ds-interaction-fill--selected.sc-ds-panel-nav-h::before,.ds-interaction-fill--selected.sc-ds-panel-nav::before{background:transparent;outline:var(--dimension-stroke-width-025) solid var(--ds-forced-color-selected);outline-offset:calc(-1 * var(--dimension-stroke-width-025))}}@media (forced-colors: active) and (hover: hover) and (pointer: fine){.ds-interaction-fill.sc-ds-panel-nav-h:hover:not(:disabled):not(:focus-visible):not(:focus-within):not(.ds-focus-ring--visible)::after,.ds-interaction-fill.sc-ds-panel-nav:hover:not(:disabled):not(:focus-visible):not(:focus-within):not(.ds-focus-ring--visible)::after{outline-color:var(--ds-forced-color-selected);outline-width:var(--dimension-stroke-width-012)}}.ds-scrollbar-hidden.sc-ds-panel-nav-h,.ds-scrollbar-hidden.sc-ds-panel-nav{scrollbar-width:none}.ds-scrollbar-hidden.sc-ds-panel-nav-h::-webkit-scrollbar,.ds-scrollbar-hidden.sc-ds-panel-nav::-webkit-scrollbar{display:none}.panel-nav.sc-ds-panel-nav{--_nav-width:var(--dimension-panel-width-2xs);--_nav-width-collapsed:var(--dimension-size-600);--_nav-item-height:var(--dimension-size-400, 32px);--_nav-padding-x:var(--dimension-space-100, 8px);--_nav-padding-y:var(--dimension-space-100, 8px);--_nav-footer-btn-w:calc(     var(--dimension-space-075, 6px) * 2 + var(--dimension-iconography-md, 20px)   );--_nav-speed:var(--ds-panel-nav-speed, 1);--_nav-expand-dur:calc(var(--_nav-speed) * var(--effect-animation-duration-medium-1, 300ms));--_nav-expand-motion:var(--_nav-expand-dur) var(--effect-animation-easing-ease-in-out, ease);--_nav-label-fade-dur:calc(var(--_nav-speed) * var(--effect-animation-duration-medium-1, 300ms));--_nav-label-fade-motion:var(--_nav-label-fade-dur)     var(--effect-animation-easing-ease-in-out, ease);--_nav-label-fade-out-dur:calc(     var(--_nav-speed) * var(--effect-animation-duration-medium-1, 300ms)   );--_nav-label-fade-out-motion:var(--_nav-label-fade-out-dur)     var(--effect-animation-easing-ease-in-out, ease);--_nav-bg:var(--color-background-secondary);--_nav-border:var(--color-border-tertiary);--_nav-divider:var(--color-border-tertiary);--_nav-fg-primary:var(--color-foreground-primary);--_nav-fg-secondary:var(--color-foreground-secondary);--_nav-fg-tertiary:var(--color-foreground-tertiary);--_nav-hover:var(--color-interaction-hover);--_nav-pressed:var(--color-interaction-pressed);--_nav-focus:var(--color-interaction-focus);--_nav-dot:var(--color-foreground-bold-brand);--ds-interaction-hover:var(--_nav-hover);--ds-interaction-pressed:var(--_nav-pressed);--ds-focus-ring-color:var(--_nav-focus)}ds-shell-app.sc-ds-panel-nav-h:not([gradient-preset='none']) .panel-nav.sc-ds-panel-nav,ds-shell-app:not([gradient-preset='none']) .sc-ds-panel-nav-h .panel-nav.sc-ds-panel-nav,ds-shell-app.shell-app--paper-texture.sc-ds-panel-nav-h .panel-nav.sc-ds-panel-nav,ds-shell-app.shell-app--paper-texture .sc-ds-panel-nav-h .panel-nav.sc-ds-panel-nav{background-color:transparent}.panel-nav--dashboard.sc-ds-panel-nav,.panel-nav--settings.sc-ds-panel-nav{--_nav-bg:var(--color-background-secondary);--_nav-border:var(--color-border-tertiary);--_nav-divider:var(--color-border-tertiary);--_nav-fg-primary:var(--color-foreground-primary);--_nav-fg-secondary:var(--color-foreground-secondary);--_nav-fg-tertiary:var(--color-foreground-tertiary);--_nav-hover:var(--color-interaction-hover);--_nav-pressed:var(--color-interaction-pressed);--_nav-focus:var(--color-interaction-focus);--_nav-dot:var(--color-foreground-bold-brand);--ds-interaction-hover:var(--_nav-hover);--ds-interaction-pressed:var(--_nav-pressed);--ds-focus-ring-color:var(--_nav-focus)}.panel-nav.sc-ds-panel-nav{display:flex;flex-direction:column;position:relative;width:var(--_nav-width);min-width:var(--_nav-width);height:100%;background-color:var(--_nav-bg);border-right:var(--dimension-stroke-width-012, 1px) solid var(--_nav-border);box-sizing:border-box;overflow:visible;transition:width var(--_nav-expand-motion),     min-width var(--_nav-expand-motion),     background-color var(--effect-motion-short-3, 200ms ease),     border-color var(--effect-motion-short-3, 200ms ease);font-family:var(--typography-font-family-ui, system-ui);isolation:isolate}.panel-nav__header.sc-ds-panel-nav,.panel-nav__body.sc-ds-panel-nav,.panel-nav__footer.sc-ds-panel-nav{position:relative;z-index:3}.panel-nav--collapsed.sc-ds-panel-nav{width:var(--_nav-width-collapsed);min-width:var(--_nav-width-collapsed)}.panel-nav__header.sc-ds-panel-nav{height:var(--dimension-size-600, 48px);flex-shrink:0;border-bottom:var(--dimension-stroke-width-012, 1px) solid var(--_nav-divider);transition:border-color var(--effect-motion-short-3, 200ms ease)}.panel-nav__header-btn.sc-ds-panel-nav{all:unset;position:relative;z-index:0;display:flex;align-items:center;justify-content:center;padding:var(--dimension-space-075, 6px);border-radius:var(--ds-control-radius, var(--dimension-radius-025, 2px));cursor:default;color:var(--_nav-fg-primary);flex-shrink:0;box-sizing:border-box;transition:color var(--effect-motion-short-3, 200ms ease)}.panel-nav--breakpoint-locked.sc-ds-panel-nav .panel-nav__header-btn.sc-ds-panel-nav{cursor:default}.panel-nav__header-logo.sc-ds-panel-nav{display:flex;align-items:center;justify-content:center;position:relative;z-index:2;opacity:1}.panel-nav__m-mark.sc-ds-panel-nav{width:var(--dimension-iconography-md, 20px);height:var(--dimension-iconography-md, 20px);display:block}.panel-nav__header-toggle.sc-ds-panel-nav{display:flex;align-items:center;justify-content:center;position:absolute;inset:0;z-index:2;opacity:0;pointer-events:none}@media (hover: hover) and (pointer: fine){.panel-nav.sc-ds-panel-nav:not(.panel-nav--breakpoint-locked) .panel-nav__header-btn.sc-ds-panel-nav:hover .panel-nav__header-logo.sc-ds-panel-nav{opacity:0}.panel-nav.sc-ds-panel-nav:not(.panel-nav--breakpoint-locked) .panel-nav__header-btn.sc-ds-panel-nav:hover .panel-nav__header-toggle.sc-ds-panel-nav{opacity:1}}.panel-nav__body.sc-ds-panel-nav{flex:1;overflow-y:auto;overflow-x:hidden}.panel-nav__sections.sc-ds-panel-nav{display:flex;flex-direction:column;gap:var(--dimension-space-200, 16px);width:100%}.panel-nav__group.sc-ds-panel-nav{display:flex;flex-direction:column;gap:var(--dimension-space-050, 4px)}ds-text.panel-nav__group-label.sc-ds-panel-nav{display:flex;align-items:center;box-sizing:border-box;text-transform:uppercase;color:var(--_nav-fg-secondary);user-select:none;height:var(--dimension-size-300, 24px);padding:0 calc(var(--dimension-space-075, 6px) + var(--ds-control-label-inset));white-space:nowrap;overflow:hidden;max-height:var(--dimension-size-300, 24px);opacity:1;transition:opacity var(--_nav-label-fade-motion) 0ms,     max-height var(--_nav-label-fade-motion) 0ms,     padding var(--_nav-label-fade-motion) 0ms,     color var(--effect-motion-short-3, 200ms ease)}.panel-nav__item.sc-ds-panel-nav{all:unset;position:relative;z-index:0;display:flex;align-items:center;gap:var(--dimension-space-050, 4px);padding:0 var(--dimension-space-075, 6px);height:var(--dimension-size-400, 32px);border-radius:var(--ds-control-radius, var(--dimension-radius-025, 2px));cursor:default;color:var(--_nav-fg-secondary);box-sizing:border-box;width:100%;user-select:none;transition:color var(--effect-motion-short-1, 50ms ease-in-out)}.panel-nav__item--active.sc-ds-panel-nav{color:var(--_nav-fg-primary)}.panel-nav__item-icon.sc-ds-panel-nav{display:flex;align-items:center;justify-content:center;flex-shrink:0;width:var(--dimension-iconography-md, 20px);height:var(--dimension-iconography-md, 20px);position:relative;z-index:2}.panel-nav__item-label.sc-ds-panel-nav{position:relative;z-index:2;flex:1;min-width:0;height:var(--typography-lineheight-md, 20px);opacity:1;mask-image:linear-gradient(to right, black 50%, transparent 100%);-webkit-mask-image:linear-gradient(to right, black 50%, transparent 100%);mask-size:200% 100%;-webkit-mask-size:200% 100%;mask-position:0% 0;-webkit-mask-position:0% 0;transition:opacity var(--_nav-label-fade-motion) 0ms,     mask-position var(--_nav-label-fade-motion) 0ms,     -webkit-mask-position var(--_nav-label-fade-motion) 0ms}.panel-nav__item-label-text.sc-ds-panel-nav{padding:0 var(--ds-control-label-inset)}.panel-nav__item-dot-box.sc-ds-panel-nav{position:absolute;z-index:2;right:var(--dimension-space-075, 6px);top:var(--dimension-space-075, 6px);display:flex;align-items:center;justify-content:center;width:var(--dimension-iconography-md, 20px);height:var(--dimension-iconography-md, 20px);pointer-events:none}.panel-nav__item-dot.sc-ds-panel-nav{transition:transform var(--_nav-expand-motion)}.panel-nav--collapsed.sc-ds-panel-nav .panel-nav__item-dot.sc-ds-panel-nav{transform:translate(     calc(var(--dimension-space-075, 6px) + var(--dimension-stroke-width-012, 1px)),     calc(0px - var(--dimension-space-075, 6px) - var(--dimension-stroke-width-012, 1px))   )}.panel-nav--animating.sc-ds-panel-nav .panel-nav__item-label.sc-ds-panel-nav{text-overflow:clip}.panel-nav--collapsed.sc-ds-panel-nav .panel-nav__item-label.sc-ds-panel-nav{opacity:0;pointer-events:none;text-overflow:clip;mask-position:100% 0;-webkit-mask-position:100% 0;transition:opacity var(--_nav-label-fade-out-motion) 0ms,     mask-position var(--_nav-label-fade-out-motion) 0ms,     -webkit-mask-position var(--_nav-label-fade-out-motion) 0ms}.panel-nav--collapsed.sc-ds-panel-nav ds-text.panel-nav__group-label.sc-ds-panel-nav{opacity:0;max-height:0;padding:0 calc(var(--dimension-space-075, 6px) + var(--ds-control-label-inset));pointer-events:none;transition:opacity var(--_nav-label-fade-out-motion) 0ms,     max-height var(--_nav-label-fade-out-motion) 0ms,     padding var(--_nav-label-fade-out-motion) 0ms,     color var(--effect-motion-short-3, 200ms ease)}.panel-nav__footer.sc-ds-panel-nav{position:relative;flex-shrink:0;height:calc(var(--_nav-padding-y) * 2 + var(--_nav-item-height));transition:height var(--_nav-expand-motion)}.panel-nav--collapsed.sc-ds-panel-nav .panel-nav__footer.sc-ds-panel-nav{height:calc(     var(--_nav-padding-y) * 2 + var(--_nav-item-height) * 2 + var(--dimension-space-050, 4px)   )}.panel-nav__footer-btn.sc-ds-panel-nav{position:absolute;left:var(--_nav-padding-x);top:var(--_nav-padding-y);--ds-button-unfilled-fg:var(--_nav-fg-secondary);--ds-button-unfilled-fg-active:var(--_nav-fg-primary);--ds-interaction-hover:var(--_nav-hover);--ds-interaction-pressed:var(--_nav-pressed);--ds-focus-ring-color:var(--_nav-focus)}.panel-nav__footer-user.sc-ds-panel-nav{position:absolute;left:calc(var(--_nav-padding-x) + var(--_nav-footer-btn-w) + var(--dimension-space-100, 8px));right:var(--_nav-padding-x);top:var(--_nav-padding-y);width:auto;min-width:0;transition:left var(--_nav-expand-motion),     right var(--_nav-expand-motion),     top var(--_nav-expand-motion)}.panel-nav__footer-user--menu-expanded.sc-ds-panel-nav::after{background:var(--_nav-pressed)}.panel-nav__footer-user--menu-expanded.sc-ds-panel-nav{--ds-interaction-hover:var(--_nav-pressed)}.panel-nav--collapsed.sc-ds-panel-nav .panel-nav__footer-user.sc-ds-panel-nav{left:var(--_nav-padding-x);right:calc(100% - var(--_nav-padding-x) - var(--_nav-item-height));top:calc(var(--_nav-padding-y) + var(--_nav-item-height) + var(--dimension-space-050, 4px))}.panel-nav__footer-user-label.sc-ds-panel-nav{text-align:right;position:absolute;left:var(--dimension-space-075, 6px);right:calc(     var(--dimension-space-075, 6px) + var(--dimension-iconography-md, 20px) +       var(--dimension-space-050, 4px)   );top:50%;transform:translateY(-50%);flex:none;height:var(--typography-lineheight-md, 20px);mask-image:none;-webkit-mask-image:none;transition:opacity var(--_nav-label-fade-motion)}.panel-nav--collapsed.sc-ds-panel-nav .panel-nav__footer-user-label.sc-ds-panel-nav{opacity:0;pointer-events:none;mask-position:0% 0;-webkit-mask-position:0% 0}.panel-nav__footer-user-icon.sc-ds-panel-nav{position:absolute;left:calc(100% - var(--dimension-iconography-md, 20px) - var(--dimension-space-075, 6px));top:0;bottom:0;height:auto;display:flex;align-items:center;justify-content:center;transition:left var(--_nav-expand-motion)}.panel-nav--collapsed.sc-ds-panel-nav .panel-nav__footer-user-icon.sc-ds-panel-nav{left:var(--dimension-space-075, 6px)}.panel-nav__footer-icon-expanded.sc-ds-panel-nav,.panel-nav__footer-icon-collapsed.sc-ds-panel-nav{position:absolute;inset:0;display:flex;align-items:center;justify-content:center}.panel-nav__footer-icon-expanded.sc-ds-panel-nav{opacity:1;transition:opacity var(--_nav-label-fade-motion)}.panel-nav__footer-icon-collapsed.sc-ds-panel-nav{opacity:0;transition:opacity var(--_nav-label-fade-motion)}.panel-nav--collapsed.sc-ds-panel-nav .panel-nav__footer-icon-expanded.sc-ds-panel-nav{opacity:0;transition:opacity var(--_nav-label-fade-out-motion)}.panel-nav--collapsed.sc-ds-panel-nav .panel-nav__footer-icon-collapsed.sc-ds-panel-nav{opacity:1;transition:opacity var(--_nav-label-fade-out-motion)}ds-text.panel-nav__user-initial.sc-ds-panel-nav,ds-text.panel-nav__user-initial.ds-text--caption.sc-ds-panel-nav{position:absolute;top:50%;left:50%;right:auto;bottom:auto;transform:translate(-50%, -50%);display:block;width:max-content;max-width:none;min-width:0;text-align:center;color:inherit;pointer-events:none}.panel-nav__resize-handle.sc-ds-panel-nav{position:absolute;top:0;right:var(--dimension-space-n050, -4px);bottom:0;width:var(--dimension-space-100, 8px);z-index:20;cursor:ew-resize;touch-action:none;background:transparent}.panel-nav__resize-handle.sc-ds-panel-nav::before{content:'';position:absolute;inset:0;background:rgba(0, 0, 0, 0.001)}.panel-nav__resize-handle.sc-ds-panel-nav::after{content:'';position:absolute;top:0;bottom:0;left:50%;transform:translateX(-50%);width:var(--dimension-stroke-width-025, 2px);background:var(--color-foreground-primary);opacity:0;pointer-events:none;transition:opacity var(--effect-motion-short-2, 100ms ease-in-out)}.panel-nav__resize-handle--overlay.sc-ds-panel-nav::after{opacity:1}@media (prefers-reduced-motion: reduce){.panel-nav.sc-ds-panel-nav,.panel-nav.sc-ds-panel-nav *.sc-ds-panel-nav,.panel-nav.sc-ds-panel-nav *.sc-ds-panel-nav::before,.panel-nav.sc-ds-panel-nav *.sc-ds-panel-nav::after,.panel-nav__resize-handle.sc-ds-panel-nav,.panel-nav__resize-handle.sc-ds-panel-nav::before,.panel-nav__resize-handle.sc-ds-panel-nav::after{transition-duration:var(--effect-animation-duration-instant) !important;animation-duration:var(--effect-animation-duration-instant) !important;transition-delay:var(--effect-animation-duration-instant) !important}}`;const R=e(class e extends n{constructor(e){super();if(e!==false){this.__registerHost()}this.dsNavSelect=a(this,"dsNavSelect",7);this.dsNavToggle=a(this,"dsNavToggle",7);this.dsChromeTransitionStart=a(this,"dsChromeTransitionStart",7);this.dsChromeTransitionEnd=a(this,"dsChromeTransitionEnd",7);this.dsNavFooterAction=a(this,"dsNavFooterAction",7);this.dsNavUserAction=a(this,"dsNavUserAction",7);this.navStyle="dashboard";this.disableViewTransition=false;this.groups="[]";this.routerMode="anchor";this.activeId="";this.collapsed=false;this.breakpoint=0;this.storageKey="";this.currentUrl="";this.userName="";this.userInitial="";this.dashboardLabel="Dashboard";this.settingsLabel="Settings";this.accountLabel="Account";this.accountMenuExpanded=false;this.dashboardNavigationLabel="Dashboard navigation";this.settingsNavigationLabel="Settings navigation";this.expandNavigationLabel="Expand navigation";this.collapseNavigationLabel="Collapse navigation";this.navigationItemsLabel="Navigation items";this.renderedStyle="dashboard";this.parsedGroups=[];this.isAnimating=false;this.rovingIndex=0;this.viewportNarrow=false;this.urlDerivedActiveId="";this.bodyScrollable=false;this.transitionFallbackTimer=null;this.initialRenderComplete=false;this.isDragging=false;this.dragStartX=0;this.didSnap=false;this.lastDeltaX=0;this.edgeOverlayTimer=null;this.showEdgeOverlay=false}get effectiveActiveId(){return this.urlDerivedActiveId||this.activeId}get effectiveDisableViewTransition(){return o(this.disableViewTransition,this.el.getAttribute("disable-view-transition"))}onCollapsedChange(e,n){if(n===undefined||!this.initialRenderComplete)return;this.startCollapseAnimation()}onViewportNarrowChange(e,n){if(n===undefined||!this.initialRenderComplete)return;if(e&&this.rovingIndex===0){this.rovingIndex=this.getFirstRovingIndex()}this.startCollapseAnimation()}onBreakpointChange(){this.disconnectResizeObserver();if(this.effectiveBreakpoint()>0)this.connectResizeObserver()}onGroupsChange(e){this.parsedGroups=r(e);this.rovingIndex=0;this.syncActiveFromUrl()}onActiveIdChange(){}onCurrentUrlChange(){this.syncActiveFromUrl()}onNavStyleChange(e){this.renderedStyle=e}componentWillLoad(){this.renderedStyle=z(this.navStyle,this.el.getAttribute("nav-style"));this.viewportNarrow=this.isViewportNarrow();if(this.storageKey){try{const e=localStorage.getItem(this.storageKey);if(e!==null)this.collapsed=e==="true"}catch{}}this.onGroupsChange(this.groups);this.syncActiveFromUrl()}componentDidLoad(){this.syncHostPropsIfNeeded();this.scheduleDeferredHostPropSync();if(this.effectiveBreakpoint()>0)this.connectResizeObserver();this.connectScrollRegionObserver();this.updateBodyScrollable();this.initialRenderComplete=true}componentDidRender(){this.updateBodyScrollable()}disconnectedCallback(){this.disconnectResizeObserver();this.disconnectScrollRegionObserver();this.clearCollapseAnimationCompletion(this.el.querySelector(".panel-nav"));this.clearEdgeOverlayTimer();if(this.globalMouseMoveHandler){window.removeEventListener("mousemove",this.globalMouseMoveHandler)}if(this.globalMouseUpHandler){window.removeEventListener("mouseup",this.globalMouseUpHandler)}}startCollapseAnimation(){if(this.isAnimating)return;this.isAnimating=true;this.dsChromeTransitionStart.emit({source:"panel-nav"});const e=this.el.querySelector(".panel-nav");const n=e?.getBoundingClientRect().width??0;this.clearCollapseAnimationCompletion(e);this.transitionCompletionHandler=n=>{if(n.propertyName==="width"||n.propertyName==="min-width"){this.finishCollapseAnimation(e)}};e?.addEventListener("transitionend",this.transitionCompletionHandler);e?.addEventListener("transitioncancel",this.transitionCompletionHandler);requestAnimationFrame((()=>{requestAnimationFrame((()=>{if(!this.isAnimating)return;const a=e?.getBoundingClientRect().width??0;if(Math.abs(a-n)<1){this.finishCollapseAnimation(e);return}if(!e){this.finishCollapseAnimation(e);return}const s=d(getComputedStyle(e));if(s<=0){this.finishCollapseAnimation(e);return}this.transitionFallbackTimer=window.setTimeout((()=>{this.finishCollapseAnimation(e)}),s)}))}))}finishCollapseAnimation(e){const n=this.isAnimating;this.clearCollapseAnimationCompletion(e);if(!n)return;this.isAnimating=false;this.dsChromeTransitionEnd.emit({source:"panel-nav"})}clearCollapseAnimationCompletion(e){if(this.transitionCompletionHandler){e?.removeEventListener("transitionend",this.transitionCompletionHandler);e?.removeEventListener("transitioncancel",this.transitionCompletionHandler);this.transitionCompletionHandler=undefined}if(this.transitionFallbackTimer!==null){window.clearTimeout(this.transitionFallbackTimer);this.transitionFallbackTimer=null}}effectiveBreakpoint(){if(this.breakpoint>0)return this.breakpoint;const e=Number(this.el.getAttribute("breakpoint")??0);return Number.isFinite(e)&&e>0?e:0}isViewportNarrow(){const e=this.effectiveBreakpoint();return typeof window!=="undefined"&&e>0&&window.innerWidth<e}connectResizeObserver(){this.viewportNarrow=this.isViewportNarrow();this.resizeObserver=new ResizeObserver((()=>{this.viewportNarrow=this.isViewportNarrow()}));this.resizeObserver.observe(document.documentElement)}disconnectResizeObserver(){this.resizeObserver?.disconnect();this.resizeObserver=undefined}connectScrollRegionObserver(){this.disconnectScrollRegionObserver();if(!this.bodyEl||typeof ResizeObserver==="undefined")return;this.scrollRegionObserver=new ResizeObserver((()=>this.updateBodyScrollable()));this.scrollRegionObserver.observe(this.bodyEl)}disconnectScrollRegionObserver(){this.scrollRegionObserver?.disconnect();this.scrollRegionObserver=undefined}updateBodyScrollable(){const e=Boolean(this.bodyEl&&this.bodyEl.scrollHeight>this.bodyEl.clientHeight+1);if(e!==this.bodyScrollable)this.bodyScrollable=e}syncActiveFromUrl(){if(!this.currentUrl){this.urlDerivedActiveId="";return}this.urlDerivedActiveId=l(this.currentUrl,this.getAllItems())}syncHostPropsIfNeeded(){if(C(this.renderedStyle,this.navStyle)){this.renderedStyle=this.navStyle}if(c(this.parsedGroups,this.groups)){this.onGroupsChange(this.groups)}else if(this.currentUrl){this.syncActiveFromUrl()}}scheduleDeferredHostPropSync(){let n=e.HOST_PROP_SYNC_BUDGET;const a=()=>{this.syncHostPropsIfNeeded();if(--n>0){requestAnimationFrame(a)}};queueMicrotask(a)}applyToggle(e){if(this.viewportNarrow)return;this.collapsed=e;if(this.storageKey){try{localStorage.setItem(this.storageKey,String(e))}catch{}}this.dsNavToggle.emit(e)}getAllItems(){return this.parsedGroups.flatMap((e=>e.items))}getFirstRovingIndex(){return this.viewportNarrow?1:0}getFooterRovingIndex(){return 1+this.getAllItems().length}getUserRovingIndex(){return this.getFooterRovingIndex()+1}getRovingElement(e){const n=this.getAllItems().length;if(e===0){return this.viewportNarrow?null:this.el.querySelector(".panel-nav__header-btn")}if(e>=1&&e<=n){const n=this.el.querySelectorAll(".panel-nav__body .panel-nav__item");return n[e-1]??null}if(e===this.getFooterRovingIndex()){return this.el.querySelector(".panel-nav__footer-btn .button-unfilled")}if(e===this.getUserRovingIndex()){return this.el.querySelector(".panel-nav__footer-user")}return null}focusRovingAt(e){this.rovingIndex=e;this.getRovingElement(e)?.focus({preventScroll:true})}activateRovingIndex(e){const n=this.getAllItems().length;const a=this.getAllItems();if(e===0){this.handleToggle();return}if(e>=1&&e<=n){this.handleItemClick(a[e-1].id);return}if(e===this.getFooterRovingIndex()){this.handleFooterAction();return}if(e===this.getUserRovingIndex()){const e=this.el.querySelector(`#${A}`);if(e)this.dsNavUserAction.emit({anchor:e,menuPlacement:w})}}handleRovingKeyDown(e,n){if(e.key==="Enter"||e.key===" "){e.preventDefault();this.activateRovingIndex(n);return}const a=this.getFooterRovingIndex();const s=this.getUserRovingIndex();const i=this.getFirstRovingIndex();let t;switch(e.key){case"ArrowDown":if(n===s)return;if(n===a)t=s;else t=n+1;break;case"ArrowUp":if(n===i)return;if(n===s)t=a;else if(n===a)t=a-1;else t=n-1;break;case"ArrowRight":if(n===a)t=s;else return;break;case"ArrowLeft":if(n===s)t=a;else return;break;case"Home":e.preventDefault();t=i;break;case"End":e.preventDefault();t=s;break;default:return}if(t===undefined||t===n)return;e.preventDefault();this.focusRovingAt(t)}handleItemClick(e){this.dsNavSelect.emit(e)}handleToggle(){const e=v(this.collapsed,this.viewportNarrow);if(e!==null)this.applyToggle(e)}async toggleCollapsed(){this.handleToggle()}handleFooterAction(){this.dsNavFooterAction.emit()}handleUserAction(e){const n=e.currentTarget;this.dsNavUserAction.emit({anchor:n,menuPlacement:w})}clearEdgeOverlayTimer(){if(this.edgeOverlayTimer!==null){window.clearTimeout(this.edgeOverlayTimer);this.edgeOverlayTimer=null}}handleResizeHandleMouseEnter(){this.clearEdgeOverlayTimer();if(p()){this.showEdgeOverlay=true;return}this.edgeOverlayTimer=window.setTimeout((()=>{this.showEdgeOverlay=true;this.edgeOverlayTimer=null}),500)}handleResizeHandleMouseLeave(){if(this.isDragging)return;this.clearEdgeOverlayTimer();this.showEdgeOverlay=false}handleResizeHandleMouseDown(e){e.preventDefault();e.stopPropagation();const n=this.collapsed||this.viewportNarrow;this.isDragging=true;this.dragStartX=e.clientX;this.didSnap=false;this.lastDeltaX=0;this.clearEdgeOverlayTimer();this.showEdgeOverlay=false;document.body.style.cursor="ew-resize";document.body.style.userSelect="none";const a=e=>{const a=e.clientX-this.dragStartX;this.lastDeltaX=Math.abs(a);if(this.didSnap)return;if(!n&&a<-8){this.applyToggle(true);this.didSnap=true}else if(n&&a>8){this.applyToggle(false);this.didSnap=true}};const s=()=>{if(!this.didSnap&&this.lastDeltaX<3){this.applyToggle(!n)}this.isDragging=false;this.showEdgeOverlay=false;document.body.style.cursor="";document.body.style.userSelect="";window.removeEventListener("mousemove",a);window.removeEventListener("mouseup",s);this.globalMouseMoveHandler=undefined;this.globalMouseUpHandler=undefined};this.globalMouseMoveHandler=a;this.globalMouseUpHandler=s;window.addEventListener("mousemove",a);window.addEventListener("mouseup",s)}renderFooterAction(e){const n=e?this.settingsLabel:this.dashboardLabel;return s("ds-tooltip",{label:n,side:"right",size:"sm"},s("ds-button-unfilled",{variant:"icon",class:"panel-nav__footer-btn",icon:e?"Gear":"Dashboard",activeFill:false,hasBorder:false,focusTabIndex:this.rovingIndex===this.getFooterRovingIndex()?0:-1,"aria-label":n,onDsClick:()=>this.handleFooterAction(),onKeyDown:e=>this.handleRovingKeyDown(e,this.getFooterRovingIndex()),onFocusin:()=>{this.rovingIndex=this.getFooterRovingIndex()}}))}renderFooterUser(e,n,a){const i=e?this.accountLabel:"";const t=s("button",{type:"button",id:A,class:{"panel-nav__item":true,"panel-nav__footer-user":true,"panel-nav__footer-user--menu-expanded":this.accountMenuExpanded,"ds-focus-ring-inset":true,"ds-interaction-fill":true},tabIndex:this.rovingIndex===this.getUserRovingIndex()?0:-1,"aria-label":this.accountLabel,"aria-haspopup":"menu","aria-expanded":String(this.accountMenuExpanded),onClick:e=>this.handleUserAction(e),onKeyDown:e=>this.handleRovingKeyDown(e,this.getUserRovingIndex()),onFocus:()=>{this.rovingIndex=this.getUserRovingIndex()}},s("ds-text",{class:"panel-nav__item-label panel-nav__footer-user-label panel-nav__item-label-text ds-control--md",as:"span",variant:"text-body-medium",emphasis:true,color:"inherit",lineTruncation:1},n),s("span",{class:"panel-nav__item-icon panel-nav__footer-user-icon","aria-hidden":"true"},s("span",{class:"panel-nav__footer-icon-expanded"},s("ds-icon",{name:"ChevronUpDown",size:"md",color:"inherit"})),s("span",{class:"panel-nav__footer-icon-collapsed"},s("ds-icon",{name:"Circle",size:"md",color:"inherit"}),s("ds-text",{class:"panel-nav__user-initial",as:"span",variant:"text-caption",emphasis:true,align:"center",color:"inherit"},a))));return s("ds-tooltip",{label:i,side:"right",size:"sm"},t)}renderNavItem(e,n,a){const i=e.id===this.effectiveActiveId;const t=n+1;const o=[s("span",{class:"panel-nav__item-icon"},s("ds-icon",{name:e.icon,size:"md",color:"inherit"})),s("ds-text",{class:"panel-nav__item-label panel-nav__item-label-text ds-control--md",as:"span",variant:"text-body-medium",emphasis:i,color:"inherit",lineTruncation:1},e.label),e.dot&&s("span",{class:"panel-nav__item-dot-box","aria-hidden":"true"},s("ds-badge",{class:"panel-nav__item-dot",variant:"dot",hasRing:a,label:""}))];const r={class:{"panel-nav__item":true,"panel-nav__item--active":i,"ds-focus-ring-inset":true,"ds-interaction-fill":true},"aria-current":i?"page":undefined,tabIndex:t===this.rovingIndex?0:-1,onClick:()=>this.handleItemClick(e.id),onKeyDown:e=>this.handleRovingKeyDown(e,t),onFocus:()=>{this.rovingIndex=t}};const d=h(e.href);const l=this.routerMode==="anchor"&&d;const c=l?s("a",{...r,href:d},o):s("button",{...r,type:"button"},o);return s("ds-tooltip",{label:a?e.label:"",side:"right",size:"sm"},c)}render(){const e=this.renderedStyle;const n=e==="dashboard";const a=this.navStyle==="dashboard";const t=this.collapsed||this.viewportNarrow;const{userName:o,userInitial:r}=this;const d={"panel-nav":true,"ds-control--md":true,"panel-nav--dashboard":a,"panel-nav--settings":!a,"panel-nav--collapsed":t,"panel-nav--breakpoint-locked":this.viewportNarrow,"panel-nav--animating":this.isAnimating};return s(i,{key:"664df166529cf40c8dfdf189f552185d30615342",style:{display:"block",position:"relative"}},s("nav",{key:"d8fe43e89e03d7eaed1a074256893498a317163c",class:d,"aria-label":n?this.dashboardNavigationLabel:this.settingsNavigationLabel},s("div",{key:"cc56d24a04de999133803be5f2a17a6c1add957d",class:"panel-nav__header ds-chrome-row ds-chrome-space--md"},s("button",{key:"59410058e46446c2d7446467457f22f18f723446",type:"button",class:"panel-nav__header-btn ds-focus-ring-inset ds-interaction-fill",disabled:this.viewportNarrow,tabIndex:!this.viewportNarrow&&this.rovingIndex===0?0:-1,onClick:()=>this.handleToggle(),onKeyDown:e=>this.handleRovingKeyDown(e,0),onFocus:()=>{this.rovingIndex=0},"aria-label":t?this.expandNavigationLabel:this.collapseNavigationLabel,"aria-expanded":t?"false":"true"},s("span",{key:"620c6dcb7d8e33f71995ba98d5c33d92811fc727",class:"panel-nav__header-logo","aria-hidden":"true"},s("svg",{key:"cc667664f91ac628b8b166cc33d060f3f3dfb194",class:"panel-nav__m-mark",viewBox:"0 0 20 20",fill:"none",xmlns:"http://www.w3.org/2000/svg",focusable:"false","aria-hidden":"true"},s("path",{key:"613e4591c9ec9bd04485be22f52119dd741aefc4",d:"M11.1159 4.31537H7.67021L2.53401 13.0703H0V15.6875H4.02716L8.24319 8.49978V15.6846H11.6342L15.8289 8.47829V15.6846H18.7122V4.3125H15.2559L11.1159 11.3648V4.31537Z",fill:"currentColor"}))),s("span",{key:"c47f1e3faef7f6822548a8e1d3b32d5db2b703ba",class:"panel-nav__header-toggle","aria-hidden":"true"},s("ds-icon",{key:"8d743efcfef0858812c05db3e8b15e0f7f07ea5a",name:t?"LeftExpandB":"LeftCollapseB",size:"md",color:"inherit"})))),s("div",{key:"30fb9d6667f48dd94f5d061a9982bccfaa447dee",class:{"panel-nav__body":true,"ds-chrome-column":true,"ds-chrome-space--md":true,"ds-scrollbar-hidden":true,"ds-focus-ring":this.bodyScrollable,...x({edges:"bottom"})},ref:e=>{const n=e??undefined;if(n===this.bodyEl)return;this.bodyEl=n;this.connectScrollRegionObserver()},role:this.bodyScrollable?"region":undefined,"aria-label":this.bodyScrollable?this.navigationItemsLabel:undefined,tabIndex:this.bodyScrollable?0:undefined},s("div",{key:"f6d979ba6cd636833a4fde68a17775de430e7115",class:"panel-nav__sections"},(()=>{let e=0;return this.parsedGroups.map((n=>s("div",{class:"panel-nav__group"},n.label&&s("ds-text",{class:"panel-nav__group-label ds-control--md",as:"span",variant:"text-caption",emphasis:true,color:"inherit"},n.label),n.items.map((n=>this.renderNavItem(n,e++,t))))))})())),s("div",{key:"a10803263bff77f4525d99fb2d38a7051331fa52",class:"panel-nav__footer"},this.renderFooterAction(n),this.renderFooterUser(t,o,r))),!this.viewportNarrow&&s("div",{key:"23753eac47b1d61682ea239627f9ef565b3d32e0",class:{"panel-nav__resize-handle":true,"panel-nav__resize-handle--overlay":this.showEdgeOverlay},onMouseEnter:()=>this.handleResizeHandleMouseEnter(),onMouseLeave:()=>this.handleResizeHandleMouseLeave(),onMouseDown:e=>this.handleResizeHandleMouseDown(e),"aria-hidden":"true"}))}get el(){return this}static get watchers(){return{collapsed:[{onCollapsedChange:0}],viewportNarrow:[{onViewportNarrowChange:0}],breakpoint:[{onBreakpointChange:0}],groups:[{onGroupsChange:0}],activeId:[{onActiveIdChange:0}],urlDerivedActiveId:[{onActiveIdChange:0}],currentUrl:[{onCurrentUrlChange:0}],navStyle:[{onNavStyleChange:0}]}}static get style(){return I()+N()}},[2,"ds-panel-nav",{navStyle:[513,"nav-style"],disableViewTransition:[4,"disable-view-transition"],groups:[1],routerMode:[1,"router-mode"],activeId:[1,"active-id"],collapsed:[1028],breakpoint:[2],storageKey:[1,"storage-key"],currentUrl:[1,"current-url"],userName:[1,"user-name"],userInitial:[1,"user-initial"],dashboardLabel:[1,"dashboard-label"],settingsLabel:[1,"settings-label"],accountLabel:[1,"account-label"],accountMenuExpanded:[4,"account-menu-expanded"],dashboardNavigationLabel:[1,"dashboard-navigation-label"],settingsNavigationLabel:[1,"settings-navigation-label"],expandNavigationLabel:[1,"expand-navigation-label"],collapseNavigationLabel:[1,"collapse-navigation-label"],navigationItemsLabel:[1,"navigation-items-label"],renderedStyle:[32],parsedGroups:[32],isAnimating:[32],rovingIndex:[32],viewportNarrow:[32],urlDerivedActiveId:[32],bodyScrollable:[32],showEdgeOverlay:[32],toggleCollapsed:[64]},undefined,{collapsed:[{onCollapsedChange:0}],viewportNarrow:[{onViewportNarrowChange:0}],breakpoint:[{onBreakpointChange:0}],groups:[{onGroupsChange:0}],activeId:[{onActiveIdChange:0}],urlDerivedActiveId:[{onActiveIdChange:0}],currentUrl:[{onCurrentUrlChange:0}],navStyle:[{onNavStyleChange:0}]}]);R.HOST_PROP_SYNC_BUDGET=8;function S(){if(typeof customElements==="undefined"){return}const e=["ds-panel-nav","ds-badge","ds-button-unfilled","ds-icon","ds-loader","ds-text","ds-tooltip"];e.forEach((e=>{switch(e){case"ds-panel-nav":if(!customElements.get(t(e))){customElements.define(t(e),R)}break;case"ds-badge":if(!customElements.get(t(e))){f()}break;case"ds-button-unfilled":if(!customElements.get(t(e))){g()}break;case"ds-icon":if(!customElements.get(t(e))){u()}break;case"ds-loader":if(!customElements.get(t(e))){m()}break;case"ds-text":if(!customElements.get(t(e))){b()}break;case"ds-tooltip":if(!customElements.get(t(e))){_()}break}}))}S();export{R as P,S as d};
+//# sourceMappingURL=p-CRSwNbPk.js.map

package/dist/components/p-CRSwNbPk.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["scrollEdgeFadeClassMap","opts","edges","Array","isArray","classes","scrollAware","hidden","edge","atEnd","PANEL_NAV_USER_MENU_PLACEMENT","side","align","anchorAlignment","sideOffset","alignOffset","NAV_STYLE_HINT_ATTR","readNavStyleAttr","attr","undefined","resolveNavChromeStyle","styleProp","hostAttr","docHint","fromHost","hint","document","documentElement","getAttribute","fromHint","shouldResyncNavChromeStyle","renderedStyle","style","PANEL_NAV_USER_MENU_ANCHOR_ID","scrollEdgeFadeCss","panelNavCss","PanelNav","__stencil_proxyCustomElement","HTMLElement","constructor","registerHost","this","navStyle","disableViewTransition","groups","routerMode","activeId","collapsed","breakpoint","storageKey","currentUrl","userName","userInitial","dashboardLabel","settingsLabel","accountLabel","accountMenuExpanded","dashboardNavigationLabel","settingsNavigationLabel","expandNavigationLabel","collapseNavigationLabel","navigationItemsLabel","parsedGroups","isAnimating","rovingIndex","viewportNarrow","urlDerivedActiveId","bodyScrollable","transitionFallbackTimer","initialRenderComplete","isDragging","dragStartX","didSnap","lastDeltaX","edgeOverlayTimer","showEdgeOverlay","effectiveActiveId","effectiveDisableViewTransition","resolvePanelNavDisableVt","el","onCollapsedChange","_next","prev","startCollapseAnimation","onViewportNarrowChange","next","getFirstRovingIndex","onBreakpointChange","disconnectResizeObserver","effectiveBreakpoint","connectResizeObserver","onGroupsChange","val","parsePanelNavGroups","syncActiveFromUrl","onActiveIdChange","onCurrentUrlChange","onNavStyleChange","newVal","componentWillLoad","resolvePanelNavStyle","isViewportNarrow","stored","localStorage","getItem","componentDidLoad","syncHostPropsIfNeeded","scheduleDeferredHostPropSync","connectScrollRegionObserver","updateBodyScrollable","componentDidRender","disconnectedCallback","disconnectScrollRegionObserver","clearCollapseAnimationCompletion","querySelector","clearEdgeOverlayTimer","globalMouseMoveHandler","window","removeEventListener","globalMouseUpHandler","dsChromeTransitionStart","emit","source","panel","widthBefore","getBoundingClientRect","width","transitionCompletionHandler","e","propertyName","finishCollapseAnimation","addEventListener","requestAnimationFrame","widthAfter","Math","abs","fallbackMs","panelNavWidthTransitionMs","getComputedStyle","setTimeout","wasAnimating","dsChromeTransitionEnd","clearTimeout","attributeValue","Number","isFinite","innerWidth","resizeObserver","ResizeObserver","observe","disconnect","bodyEl","scrollRegionObserver","Boolean","scrollHeight","clientHeight","deriveActiveIdFromUrl","getAllItems","shouldResyncPanelNavStyle","shouldResyncPanelNavGroups","remaining","HOST_PROP_SYNC_BUDGET","tick","queueMicrotask","applyToggle","setItem","String","dsNavToggle","flatMap","g","items","getFooterRovingIndex","length","getUserRovingIndex","getRovingElement","index","itemCount","querySelectorAll","focusRovingAt","focus","preventScroll","activateRovingIndex","handleToggle","handleItemClick","id","handleFooterAction","anchor","dsNavUserAction","menuPlacement","handleRovingKeyDown","key","preventDefault","footerIdx","userIdx","firstIdx","dsNavSelect","resolvePanelNavToggle","toggleCollapsed","dsNavFooterAction","handleUserAction","currentTarget","handleResizeHandleMouseEnter","prefersReducedMotion","handleResizeHandleMouseLeave","handleResizeHandleMouseDown","stopPropagation","wasCollapsed","clientX","body","cursor","userSelect","onMove","ev","deltaX","onUp","renderFooterAction","isDashboardChrome","footerLabel","h","label","size","variant","class","icon","activeFill","hasBorder","focusTabIndex","onDsClick","onKeyDown","onFocusin","renderFooterUser","tipLabel","userButton","type","tabIndex","onClick","onFocus","as","emphasis","color","lineTruncation","name","renderNavItem","item","idx","isActive","rovingPosition","itemContent","dot","hasRing","sharedProps","href","resolveSafeUrl","useAnchor","control","render","chromeStyle","isDashboard","navCls","Host","display","position","disabled","viewBox","fill","xmlns","focusable","d","ref","element","role","flatIdx","map","group","onMouseEnter","onMouseLeave","onMouseDown"],"sources":["src/wc/utils/scroll-edge-fade.ts","src/wc/components/Menu/menu-placement.ts","src/wc/shell/nav-chrome.ts","src/wc/components/PanelNav/panel-nav-types.ts","src/wc/utils/scroll-edge-fade.css?tag=ds-panel-nav&encapsulation=scoped","src/wc/components/PanelNav/PanelNav.css?tag=ds-panel-nav&encapsulation=scoped","src/wc/components/PanelNav/PanelNav.tsx"],"sourcesContent":["/** CSS custom property for scroll-edge fade depth (dimension token or length). */\nexport const SCROLL_EDGE_FADE_SIZE_VAR = '--ds-scroll-edge-fade-size';\n\nexport const SCROLL_EDGE_FADE_DEFAULT_SIZE = 'var(--dimension-size-600)';\n\nexport type ScrollEdgeFadeEdge = 'top' | 'bottom' | 'left' | 'right';\n\nexport type ScrollEdgeFadeSizeToken =\n  | 'size-000'\n  | 'size-050'\n  | 'size-075'\n  | 'size-100'\n  | 'size-150'\n  | 'size-200'\n  | 'size-250'\n  | 'size-300'\n  | 'size-400'\n  | 'size-500'\n  | 'size-600'\n  | 'size-800';\n\nexport type ScrollEdgeFadeSize = ScrollEdgeFadeSizeToken | (string & {});\n\nconst SIZE_VALUE: Record<ScrollEdgeFadeSizeToken, string> = {\n  'size-000': 'var(--dimension-size-000)',\n  'size-050': 'var(--dimension-size-050)',\n  'size-075': 'var(--dimension-size-075)',\n  'size-100': 'var(--dimension-size-100)',\n  'size-150': 'var(--dimension-size-150)',\n  'size-200': 'var(--dimension-size-200)',\n  'size-250': 'var(--dimension-size-250)',\n  'size-300': 'var(--dimension-size-300)',\n  'size-400': 'var(--dimension-size-400)',\n  'size-500': 'var(--dimension-size-500)',\n  'size-600': 'var(--dimension-size-600)',\n  'size-800': 'var(--dimension-size-800)',\n};\n\nconst SIZE_REF = `var(${SCROLL_EDGE_FADE_SIZE_VAR}, ${SCROLL_EDGE_FADE_DEFAULT_SIZE})`;\n\nexport interface ScrollEdgeFadeOptions {\n  /** One or more edges to fade. */\n  edges: ScrollEdgeFadeEdge | ScrollEdgeFadeEdge[];\n  /**\n   * Reveal and hide configured fades from the container's own scroll position.\n   * Uses CSS scroll-driven animations with a static-fade fallback; no listener required.\n   */\n  scrollAware?: boolean;\n  /**\n   * When true, removes the complete mask. Pass a map to remove only configured\n   * edges that are flush when scroll state already lives in JavaScript.\n   */\n  atEnd?: boolean | Partial<Record<ScrollEdgeFadeEdge, boolean>>;\n  /** Force the mask off regardless of scroll position (`ds-fade` `visible={false}`). */\n  hidden?: boolean;\n}\n\n/** Resolve a dimension size token name or raw CSS length for `--ds-scroll-edge-fade-size`. */\nexport function resolveScrollEdgeFadeSize(\n  size: ScrollEdgeFadeSize = 'size-600',\n  height?: string\n): string {\n  if (height) return height;\n  return Object.prototype.hasOwnProperty.call(SIZE_VALUE, size)\n    ? SIZE_VALUE[size as ScrollEdgeFadeSizeToken]\n    : size;\n}\n\n/** Inline style map setting fade depth on a scroll container. */\nexport function scrollEdgeFadeSizeStyle(\n  size: ScrollEdgeFadeSize = 'size-600',\n  height?: string\n): Record<string, string> {\n  return {\n    [SCROLL_EDGE_FADE_SIZE_VAR]: resolveScrollEdgeFadeSize(size, height),\n  };\n}\n\n/**\n * Alpha mask for a scroll container edge — content fades to transparent so\n * textured backgrounds (shell gradients, images) show through.\n */\nexport function scrollEdgeFadeMaskImage(edge: ScrollEdgeFadeEdge): string {\n  switch (edge) {\n    case 'top':\n      return `linear-gradient(to bottom, transparent 0, #000 ${SIZE_REF}, #000 100%)`;\n    case 'bottom':\n      return `linear-gradient(to bottom, #000 0, #000 calc(100% - ${SIZE_REF}), transparent 100%)`;\n    case 'left':\n      return `linear-gradient(to right, transparent 0, #000 ${SIZE_REF}, #000 100%)`;\n    case 'right':\n      return `linear-gradient(to right, #000 0, #000 calc(100% - ${SIZE_REF}), transparent 100%)`;\n  }\n}\n\n/** Inline style map for a masked scroll region (single edge). */\nexport function scrollEdgeFadeMaskStyle(\n  edge: ScrollEdgeFadeEdge,\n  size: ScrollEdgeFadeSize = 'size-600',\n  height?: string\n): Record<string, string> {\n  const mask = scrollEdgeFadeMaskImage(edge);\n  return {\n    ...scrollEdgeFadeSizeStyle(size, height),\n    WebkitMaskImage: mask,\n    maskImage: mask,\n    WebkitMaskSize: '100% 100%',\n    maskSize: '100% 100%',\n  };\n}\n\n/** Class map for `scroll-edge-fade` modifiers — pair with `scroll-edge-fade.css`. */\nexport function scrollEdgeFadeClassMap(opts: ScrollEdgeFadeOptions): Record<string, boolean> {\n  const edges = Array.isArray(opts.edges) ? opts.edges : [opts.edges];\n  const classes: Record<string, boolean> = {\n    'scroll-edge-fade': true,\n    'scroll-edge-fade--scroll-aware': opts.scrollAware === true,\n    'scroll-edge-fade--hidden': opts.hidden === true,\n  };\n\n  for (const edge of edges) {\n    classes[`scroll-edge-fade--${edge}`] = true;\n  }\n\n  const { atEnd } = opts;\n  if (atEnd === true) {\n    classes['scroll-edge-fade--at-end'] = true;\n  } else if (atEnd && typeof atEnd === 'object') {\n    for (const edge of edges) {\n      if (atEnd[edge]) {\n        classes[`scroll-edge-fade--${edge}-at-edge`] = true;\n      }\n    }\n  }\n\n  return classes;\n}\n\n/** Whether a scroll container is flush with the given edge (within `threshold` px). */\nexport function isScrollAtEdge(el: HTMLElement, edge: ScrollEdgeFadeEdge, threshold = 2): boolean {\n  switch (edge) {\n    case 'top':\n      return el.scrollTop <= threshold;\n    case 'bottom':\n      return el.scrollHeight - el.scrollTop - el.clientHeight <= threshold;\n    case 'left':\n      return el.scrollLeft <= threshold;\n    case 'right':\n      return el.scrollWidth - el.scrollLeft - el.clientWidth <= threshold;\n  }\n}\n","import type { ChoicePopupAnchorAlignment } from '../../utils/choice-popup-alignment';\nimport type { MenuAlign, MenuSide } from './menu-position';\n\n/** Placement props bindable on `ds-menu` (side, align, offsets). */\nexport interface MenuPlacement {\n  side: MenuSide;\n  align: MenuAlign;\n  anchorAlignment: ChoicePopupAnchorAlignment;\n  sideOffset: number | string;\n  alignOffset: number | string;\n}\n\n/**\n * Canonical `ds-menu` placement for the **panel-nav footer user menu**.\n * Anchor from `dsNavUserAction` detail `{ anchor }` (id `ds-panel-nav-user-menu-anchor`).\n *\n * Not for BarNav overflow menus — those use `side=\"bottom\"` / `align=\"end\"` internally.\n * `align: 'end'` bottom-aligns the last choice cell on the anchor; the side offset nudges into the content area:\n * - `sideOffset` space-100 + space-050 (12px): 4px past the panel-nav outer edge (anchor is ~8px inset).\n * - `anchorAlignment: 'choice-cell'`: the shared section inset puts the last row edge on the footer user row.\n */\nexport const PANEL_NAV_USER_MENU_PLACEMENT = {\n  side: 'right',\n  align: 'end',\n  anchorAlignment: 'choice-cell',\n  sideOffset: 'calc(var(--dimension-space-100) + var(--dimension-space-050))',\n  alignOffset: 0,\n} as const satisfies MenuPlacement;\n\n/**\n * Canonical placement for a menu opened by a PanelTools header action.\n * Matches BarNav overflow: the 32px trigger is 8px inside the 48px header, so\n * a 12px side offset places the popup 4px below the header edge. Choice-cell\n * alignment keeps the final menu item edge aligned with the trigger.\n */\nexport const PANEL_TOOLS_HEADER_MENU_PLACEMENT = {\n  side: 'bottom',\n  align: 'end',\n  anchorAlignment: 'choice-cell',\n  sideOffset: 'calc(var(--dimension-space-100) + var(--dimension-space-050))',\n  alignOffset: 0,\n} as const satisfies MenuPlacement;\n","/** Nav chrome style slot — dashboard vs settings. Colors unified for now; texture hooks use the class. */\nexport type NavChromeStyle = 'dashboard' | 'settings';\n\n/** Document hint for first paint before framework props land. */\nexport const NAV_STYLE_HINT_ATTR = 'data-nav-style';\n\nexport function readNavStyleAttr(attr: string | null): NavChromeStyle | undefined {\n  if (attr === 'dashboard' || attr === 'settings') return attr;\n  return undefined;\n}\n\nexport function setNavStyleHint(style: NavChromeStyle): void {\n  if (typeof document === 'undefined') return;\n  document.documentElement.setAttribute(NAV_STYLE_HINT_ATTR, style);\n}\n\nexport function clearNavStyleHint(): void {\n  if (typeof document === 'undefined') return;\n  document.documentElement.removeAttribute(NAV_STYLE_HINT_ATTR);\n}\n\nexport function resolveNavChromeStyle(\n  styleProp: NavChromeStyle,\n  hostAttr: string | null,\n  docHint?: string | null\n): NavChromeStyle {\n  const fromHost = readNavStyleAttr(hostAttr);\n  if (fromHost) return fromHost;\n\n  const hint =\n    docHint !== undefined\n      ? docHint\n      : typeof document !== 'undefined'\n        ? document.documentElement.getAttribute(NAV_STYLE_HINT_ATTR)\n        : null;\n  const fromHint = readNavStyleAttr(hint);\n  if (fromHint) return fromHint;\n\n  return styleProp;\n}\n\nexport function shouldResyncNavChromeStyle(\n  renderedStyle: NavChromeStyle,\n  style: NavChromeStyle\n): boolean {\n  return renderedStyle !== style;\n}\n","import type { MenuPlacement } from '../Menu/menu-placement';\nimport { PANEL_NAV_USER_MENU_PLACEMENT } from '../Menu/menu-placement';\nimport type { NavChromeStyle } from '../../shell/nav-chrome';\n\nexport type { NavChromeStyle };\nexport type PanelNavRouterMode = 'anchor' | 'event';\n\nexport interface PanelNavItem {\n  id: string;\n  icon: string;\n  label: string;\n  /** Show a notification dot badge on the item */\n  dot?: boolean;\n  /** Route path used for `currentUrl` matching. In `anchor` mode also sets `<a href>`.\n   *  In `event` mode navigation is delegated to the host via `dsNavSelect`. */\n  href?: string;\n}\n\nexport interface PanelNavGroup {\n  id?: string;\n  label?: string;\n  items: PanelNavItem[];\n}\n\n/** Stable `id` on the footer user button — use with `ds-menu` `anchor-id`. */\nexport const PANEL_NAV_USER_MENU_ANCHOR_ID = 'ds-panel-nav-user-menu-anchor';\n\n/** Detail for `dsNavUserAction` — anchor element for an external `ds-menu`. */\nexport interface PanelNavUserActionDetail {\n  anchor: HTMLElement;\n  /** Recommended `ds-menu` placement — spread onto external user menu instance. */\n  menuPlacement: MenuPlacement;\n}\n\nexport { PANEL_NAV_USER_MENU_PLACEMENT };\n","/**\n * Scroll-edge alpha fade — the single edge-fade utility for overflow containers.\n * Masks scrolling content to transparent so flat surfaces, shell gradients, and\n * images show through.\n *\n * Static fades are the default (PanelNav intentionally keeps its bottom fade).\n * Add `.scroll-edge-fade--scroll-aware` to reveal/hide each configured edge from\n * the container's own scroll position without JavaScript. Browsers without CSS\n * scroll-driven animations retain the configured static fades.\n *\n * @see scroll-edge-fade.ts — `scrollEdgeFadeClassMap`, `isScrollAtEdge`, size helpers.\n */\n\n@property --ds-scroll-edge-fade-top {\n  syntax: '<length-percentage>';\n  inherits: false;\n  /* stylelint-disable-next-line length-zero-no-unit -- @property requires a unit-compatible initial value. */\n  initial-value: 0px;\n}\n\n@property --ds-scroll-edge-fade-bottom {\n  syntax: '<length-percentage>';\n  inherits: false;\n  /* stylelint-disable-next-line length-zero-no-unit -- @property requires a unit-compatible initial value. */\n  initial-value: 0px;\n}\n\n@property --ds-scroll-edge-fade-left {\n  syntax: '<length-percentage>';\n  inherits: false;\n  /* stylelint-disable-next-line length-zero-no-unit -- @property requires a unit-compatible initial value. */\n  initial-value: 0px;\n}\n\n@property --ds-scroll-edge-fade-right {\n  syntax: '<length-percentage>';\n  inherits: false;\n  /* stylelint-disable-next-line length-zero-no-unit -- @property requires a unit-compatible initial value. */\n  initial-value: 0px;\n}\n\n@keyframes ds-scroll-edge-fade-reveal-top {\n  from {\n    --ds-scroll-edge-fade-top: 0px;\n  }\n  to {\n    --ds-scroll-edge-fade-top: var(--ds-scroll-edge-fade-target-top);\n  }\n}\n\n@keyframes ds-scroll-edge-fade-reveal-bottom {\n  from {\n    --ds-scroll-edge-fade-bottom: var(--ds-scroll-edge-fade-target-bottom);\n  }\n  to {\n    --ds-scroll-edge-fade-bottom: 0px;\n  }\n}\n\n@keyframes ds-scroll-edge-fade-reveal-left {\n  from {\n    --ds-scroll-edge-fade-left: 0px;\n  }\n  to {\n    --ds-scroll-edge-fade-left: var(--ds-scroll-edge-fade-target-left);\n  }\n}\n\n@keyframes ds-scroll-edge-fade-reveal-right {\n  from {\n    --ds-scroll-edge-fade-right: var(--ds-scroll-edge-fade-target-right);\n  }\n  to {\n    --ds-scroll-edge-fade-right: 0px;\n  }\n}\n\n/* Mask gradients use #000 / transparent as alpha stops — not theme colors. */\n/* stylelint-disable color-no-hex */\n\n.scroll-edge-fade {\n  --ds-scroll-edge-fade-size: var(--dimension-size-600);\n  --ds-scroll-edge-fade-reveal-distance: var(--dimension-size-800);\n  --ds-scroll-edge-fade-target-top: 0px;\n  --ds-scroll-edge-fade-target-bottom: 0px;\n  --ds-scroll-edge-fade-target-left: 0px;\n  --ds-scroll-edge-fade-target-right: 0px;\n  --ds-scroll-edge-fade-top: var(--ds-scroll-edge-fade-target-top);\n  --ds-scroll-edge-fade-bottom: var(--ds-scroll-edge-fade-target-bottom);\n  --ds-scroll-edge-fade-left: var(--ds-scroll-edge-fade-target-left);\n  --ds-scroll-edge-fade-right: var(--ds-scroll-edge-fade-target-right);\n  --ds-scroll-edge-fade-block-mask: linear-gradient(\n    to bottom,\n    transparent 0,\n    #000 var(--ds-scroll-edge-fade-top),\n    #000 calc(100% - var(--ds-scroll-edge-fade-bottom)),\n    transparent 100%\n  );\n  --ds-scroll-edge-fade-inline-mask: linear-gradient(\n    to right,\n    transparent 0,\n    #000 var(--ds-scroll-edge-fade-left),\n    #000 calc(100% - var(--ds-scroll-edge-fade-right)),\n    transparent 100%\n  );\n\n  /* Intersecting the block and inline masks lets every edge compose correctly. */\n  -webkit-mask-image: var(--ds-scroll-edge-fade-block-mask), var(--ds-scroll-edge-fade-inline-mask);\n  mask-image: var(--ds-scroll-edge-fade-block-mask), var(--ds-scroll-edge-fade-inline-mask);\n  -webkit-mask-composite: source-in;\n  mask-composite: intersect;\n  -webkit-mask-repeat: no-repeat;\n  mask-repeat: no-repeat;\n  -webkit-mask-size: 100% 100%;\n  mask-size: 100% 100%;\n}\n\n.scroll-edge-fade--top {\n  --ds-scroll-edge-fade-target-top: var(--ds-scroll-edge-fade-size);\n}\n\n.scroll-edge-fade--bottom {\n  --ds-scroll-edge-fade-target-bottom: var(--ds-scroll-edge-fade-size);\n}\n\n.scroll-edge-fade--left {\n  --ds-scroll-edge-fade-target-left: var(--ds-scroll-edge-fade-size);\n}\n\n.scroll-edge-fade--right {\n  --ds-scroll-edge-fade-target-right: var(--ds-scroll-edge-fade-size);\n}\n\n/* Manual per-edge state remains available when scroll state already lives in JS. */\n.scroll-edge-fade--top-at-edge {\n  --ds-scroll-edge-fade-target-top: 0px;\n}\n\n.scroll-edge-fade--bottom-at-edge {\n  --ds-scroll-edge-fade-target-bottom: 0px;\n}\n\n.scroll-edge-fade--left-at-edge {\n  --ds-scroll-edge-fade-target-left: 0px;\n}\n\n.scroll-edge-fade--right-at-edge {\n  --ds-scroll-edge-fade-target-right: 0px;\n}\n\n@supports (animation-timeline: scroll()) {\n  .scroll-edge-fade--scroll-aware {\n    animation-name:\n      ds-scroll-edge-fade-reveal-top, ds-scroll-edge-fade-reveal-bottom,\n      ds-scroll-edge-fade-reveal-left, ds-scroll-edge-fade-reveal-right;\n    /* stylelint-disable-next-line declaration-property-value-disallowed-list -- scroll timelines require a nonzero sentinel duration; elapsed time is ignored. */\n    animation-duration: 1ms;\n    animation-timing-function: ease-in-out;\n    animation-fill-mode: both;\n    animation-timeline: scroll(self y), scroll(self y), scroll(self x), scroll(self x);\n    animation-range:\n      0 var(--ds-scroll-edge-fade-reveal-distance),\n      calc(100% - var(--ds-scroll-edge-fade-reveal-distance)) 100%,\n      0 var(--ds-scroll-edge-fade-reveal-distance),\n      calc(100% - var(--ds-scroll-edge-fade-reveal-distance)) 100%;\n  }\n\n  @media (prefers-reduced-motion: reduce) {\n    .scroll-edge-fade--scroll-aware {\n      animation: none;\n    }\n  }\n}\n\n.scroll-edge-fade--at-end,\n.scroll-edge-fade--hidden {\n  -webkit-mask-image: none;\n  mask-image: none;\n}\n\n/**\n * Masks a long content element against a scrollport-relative block window.\n * The owner updates the start/end offsets as the scrollport moves. Keeping the\n * mask on the content instead of the overflow element leaves native scrollbars\n * outside the fade.\n */\n.scroll-edge-fade--block-window {\n  --ds-scroll-edge-fade-window-start: 100%;\n  --ds-scroll-edge-fade-window-end: 100%;\n\n  -webkit-mask-image: linear-gradient(\n    to bottom,\n    #000 0,\n    #000 var(--ds-scroll-edge-fade-window-start),\n    transparent var(--ds-scroll-edge-fade-window-end)\n  );\n  mask-image: linear-gradient(\n    to bottom,\n    #000 0,\n    #000 var(--ds-scroll-edge-fade-window-start),\n    transparent var(--ds-scroll-edge-fade-window-end)\n  );\n  -webkit-mask-repeat: no-repeat;\n  mask-repeat: no-repeat;\n}\n\n/* stylelint-enable color-no-hex */\n","@import '../../utils/control-density.css';\n@import '../../utils/chrome-layout.css';\n@import '../../utils/focus-ring.css';\n@import '../../utils/interaction-fill.css';\n@import '../../utils/scrollbar-hidden.css';\n\n/* ── Theme variables ──────────────────────────────────────────────────────── */\n\n.panel-nav {\n  /* ─ Sizes ─ */\n  --_nav-width: var(--dimension-panel-width-2xs);\n  --_nav-width-collapsed: var(--dimension-size-600);\n  --_nav-item-height: var(--dimension-size-400, 32px);\n  --_nav-padding-x: var(--dimension-space-100, 8px);\n  --_nav-padding-y: var(--dimension-space-100, 8px);\n  /* gear button outer width = padding*2 + icon */\n  --_nav-footer-btn-w: calc(\n    var(--dimension-space-075, 6px) * 2 + var(--dimension-iconography-md, 20px)\n  );\n\n  /* ─ Motion ─ */\n  /* --ds-panel-nav-speed: unitless multiplier; override in Storybook to slow-mo (e.g. 10 = 10×).\n     *-dur vars are duration-only (needed for calc); *-motion vars add easing for use in transitions. */\n  --_nav-speed: var(--ds-panel-nav-speed, 1);\n  --_nav-expand-dur: calc(var(--_nav-speed) * var(--effect-animation-duration-medium-1, 300ms));\n  --_nav-expand-motion: var(--_nav-expand-dur) var(--effect-animation-easing-ease-in-out, ease);\n  --_nav-label-fade-dur: calc(var(--_nav-speed) * var(--effect-animation-duration-medium-1, 300ms));\n  --_nav-label-fade-motion: var(--_nav-label-fade-dur)\n    var(--effect-animation-easing-ease-in-out, ease);\n  --_nav-label-fade-out-dur: calc(\n    var(--_nav-speed) * var(--effect-animation-duration-medium-1, 300ms)\n  );\n  --_nav-label-fade-out-motion: var(--_nav-label-fade-out-dur)\n    var(--effect-animation-easing-ease-in-out, ease);\n\n  /* ─ Colours – default chrome (app surfaces) ─ */\n  --_nav-bg: var(--color-background-secondary);\n  --_nav-border: var(--color-border-tertiary);\n  --_nav-divider: var(--color-border-tertiary);\n  --_nav-fg-primary: var(--color-foreground-primary);\n  --_nav-fg-secondary: var(--color-foreground-secondary);\n  --_nav-fg-tertiary: var(--color-foreground-tertiary);\n  --_nav-hover: var(--color-interaction-hover);\n  --_nav-pressed: var(--color-interaction-pressed);\n  --_nav-focus: var(--color-interaction-focus);\n  --_nav-dot: var(--color-foreground-bold-brand);\n  --ds-interaction-hover: var(--_nav-hover);\n  --ds-interaction-pressed: var(--_nav-pressed);\n  --ds-focus-ring-color: var(--_nav-focus);\n}\n\n/* ── Default chrome overrides ────────────────────────────────────────────── */\n\n/* Shell-owned chrome (bg + wash) — panel is a transparent frame. */\n:host-context(ds-shell-app:not([gradient-preset='none'])) .panel-nav,\n:host-context(ds-shell-app.shell-app--paper-texture) .panel-nav {\n  background-color: transparent;\n}\n\n/* Style slots — same app tokens for now; hook texture/glyph layers on these classes later. */\n.panel-nav--dashboard,\n.panel-nav--settings {\n  --_nav-bg: var(--color-background-secondary);\n  --_nav-border: var(--color-border-tertiary);\n  --_nav-divider: var(--color-border-tertiary);\n  --_nav-fg-primary: var(--color-foreground-primary);\n  --_nav-fg-secondary: var(--color-foreground-secondary);\n  --_nav-fg-tertiary: var(--color-foreground-tertiary);\n  --_nav-hover: var(--color-interaction-hover);\n  --_nav-pressed: var(--color-interaction-pressed);\n  --_nav-focus: var(--color-interaction-focus);\n  --_nav-dot: var(--color-foreground-bold-brand);\n  --ds-interaction-hover: var(--_nav-hover);\n  --ds-interaction-pressed: var(--_nav-pressed);\n  --ds-focus-ring-color: var(--_nav-focus);\n}\n\n/* ── Shell ───────────────────────────────────────────────────────────────── */\n\n.panel-nav {\n  display: flex;\n  flex-direction: column;\n  position: relative;\n  width: var(--_nav-width);\n  min-width: var(--_nav-width);\n  height: 100%;\n  background-color: var(--_nav-bg);\n  border-right: var(--dimension-stroke-width-012, 1px) solid var(--_nav-border);\n  box-sizing: border-box;\n  overflow: visible;\n  transition:\n    width var(--_nav-expand-motion),\n    min-width var(--_nav-expand-motion),\n    background-color var(--effect-motion-short-3, 200ms ease),\n    border-color var(--effect-motion-short-3, 200ms ease);\n  font-family: var(--typography-font-family-ui, system-ui);\n  isolation: isolate;\n}\n\n.panel-nav__header,\n.panel-nav__body,\n.panel-nav__footer {\n  position: relative;\n  z-index: 3;\n}\n\n.panel-nav--collapsed {\n  width: var(--_nav-width-collapsed);\n  min-width: var(--_nav-width-collapsed);\n}\n\n/* ── Header ──────────────────────────────────────────────────────────────── */\n\n.panel-nav__header {\n  height: var(--dimension-size-600, 48px);\n  flex-shrink: 0;\n  border-bottom: var(--dimension-stroke-width-012, 1px) solid var(--_nav-divider);\n  transition: border-color var(--effect-motion-short-3, 200ms ease);\n}\n\n.panel-nav__header-btn {\n  all: unset;\n  /* Re-assert after unset — required for `.ds-interaction-fill` stacking. */\n  position: relative;\n  z-index: 0;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  padding: var(--dimension-space-075, 6px);\n  border-radius: var(--ds-control-radius, var(--dimension-radius-025, 2px));\n  cursor: default;\n  color: var(--_nav-fg-primary);\n  flex-shrink: 0;\n  box-sizing: border-box;\n  transition: color var(--effect-motion-short-3, 200ms ease);\n  /* Hover/press: `.ds-interaction-fill` (tokens from --_nav-* via --ds-interaction-*). */\n}\n\n.panel-nav--breakpoint-locked .panel-nav__header-btn {\n  cursor: default;\n}\n\n/* Logo — visible by default; instant swap to toggle on hover (no crossfade overlap) */\n.panel-nav__header-logo {\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  position: relative;\n  z-index: 2;\n  opacity: 1;\n}\n\n.panel-nav__m-mark {\n  width: var(--dimension-iconography-md, 20px);\n  height: var(--dimension-iconography-md, 20px);\n  display: block;\n}\n\n/* Toggle icon — stacked on logo; under hover wash (::after z-index 3) */\n.panel-nav__header-toggle {\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  position: absolute;\n  inset: 0;\n  z-index: 2;\n  opacity: 0;\n  pointer-events: none;\n}\n\n@media (hover: hover) and (pointer: fine) {\n  .panel-nav:not(.panel-nav--breakpoint-locked)\n    .panel-nav__header-btn:hover\n    .panel-nav__header-logo {\n    opacity: 0;\n  }\n\n  .panel-nav:not(.panel-nav--breakpoint-locked)\n    .panel-nav__header-btn:hover\n    .panel-nav__header-toggle {\n    opacity: 1;\n  }\n}\n\n/* ── Scrollable body ─────────────────────────────────────────────────────── */\n\n.panel-nav__body {\n  flex: 1;\n  overflow-y: auto;\n  overflow-x: hidden;\n}\n\n.panel-nav__sections {\n  display: flex;\n  flex-direction: column;\n  gap: var(--dimension-space-200, 16px);\n  width: 100%;\n}\n\n/* ── Group ───────────────────────────────────────────────────────────────── */\n\n.panel-nav__group {\n  display: flex;\n  flex-direction: column;\n  gap: var(--dimension-space-050, 4px);\n}\n\n/*\n * Section headers — typography via ds-text (text-caption + emphasis).\n * Element selector so display:flex beats Text's inline-block, and padding\n * isn't clobbered by sharing `.panel-nav__item-label-text` on the same host.\n */\nds-text.panel-nav__group-label {\n  display: flex;\n  align-items: center;\n  box-sizing: border-box;\n  text-transform: uppercase;\n  color: var(--_nav-fg-secondary);\n  user-select: none;\n  height: var(--dimension-size-300, 24px);\n  /* Former nested pad: group-label (075) + item-label-text (025). */\n  padding: 0 calc(var(--dimension-space-075, 6px) + var(--ds-control-label-inset));\n  white-space: nowrap;\n  overflow: hidden;\n  max-height: var(--dimension-size-300, 24px);\n  opacity: 1;\n  transition:\n    opacity var(--_nav-label-fade-motion) 0ms,\n    max-height var(--_nav-label-fade-motion) 0ms,\n    padding var(--_nav-label-fade-motion) 0ms,\n    color var(--effect-motion-short-3, 200ms ease);\n}\n\n/* ── Item ────────────────────────────────────────────────────────────────── */\n\n.panel-nav__item {\n  all: unset;\n  /* Re-assert after unset — required for `.ds-interaction-fill` stacking. */\n  position: relative;\n  z-index: 0;\n  display: flex;\n  align-items: center;\n  gap: var(--dimension-space-050, 4px);\n  padding: 0 var(--dimension-space-075, 6px);\n  height: var(--dimension-size-400, 32px);\n  border-radius: var(--ds-control-radius, var(--dimension-radius-025, 2px));\n  cursor: default;\n  color: var(--_nav-fg-secondary);\n  box-sizing: border-box;\n  width: 100%;\n  user-select: none;\n  transition: color var(--effect-motion-short-1, 50ms ease-in-out);\n  /* Hover/press: `.ds-interaction-fill` — no --selected (icon/type weight only). */\n}\n\n/* ── Active item ─────────────────────────────────────────────────────────── */\n\n.panel-nav__item--active {\n  color: var(--_nav-fg-primary);\n  /* Bold typography via ds-text (text-body-medium + emphasis) on the label */\n}\n\n/* ── Item icon ───────────────────────────────────────────────────────────── */\n\n.panel-nav__item-icon {\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  flex-shrink: 0;\n  width: var(--dimension-iconography-md, 20px);\n  height: var(--dimension-iconography-md, 20px);\n  position: relative;\n  z-index: 2;\n}\n\n/* ── Item label ──────────────────────────────────────────────────────────── */\n\n.panel-nav__item-label {\n  position: relative;\n  z-index: 2;\n  flex: 1;\n  min-width: 0;\n  height: var(--typography-lineheight-md, 20px);\n  opacity: 1;\n  /* Gradient wipe: mask sweeps left-to-right on expand, right-to-left on collapse */\n  /* stylelint-disable-next-line color-named -- mask luminance stops, not theme colors */\n  mask-image: linear-gradient(to right, black 50%, transparent 100%);\n  /* stylelint-disable-next-line color-named -- mask luminance stops, not theme colors */\n  -webkit-mask-image: linear-gradient(to right, black 50%, transparent 100%);\n  mask-size: 200% 100%;\n  -webkit-mask-size: 200% 100%;\n  mask-position: 0% 0;\n  -webkit-mask-position: 0% 0;\n  transition:\n    opacity var(--_nav-label-fade-motion) 0ms,\n    mask-position var(--_nav-label-fade-motion) 0ms,\n    -webkit-mask-position var(--_nav-label-fade-motion) 0ms;\n}\n\n.panel-nav__item-label-text {\n  padding: 0 var(--ds-control-label-inset);\n}\n\n/* ── Item notification dot — 20px suffix zone matches the icon geometry ──── */\n\n.panel-nav__item-dot-box {\n  position: absolute;\n  z-index: 2;\n  right: var(--dimension-space-075, 6px);\n  top: var(--dimension-space-075, 6px);\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  width: var(--dimension-iconography-md, 20px);\n  height: var(--dimension-iconography-md, 20px);\n  pointer-events: none;\n}\n\n.panel-nav__item-dot {\n  transition: transform var(--_nav-expand-motion);\n}\n\n.panel-nav--collapsed .panel-nav__item-dot {\n  transform: translate(\n    calc(var(--dimension-space-075, 6px) + var(--dimension-stroke-width-012, 1px)),\n    calc(0px - var(--dimension-space-075, 6px) - var(--dimension-stroke-width-012, 1px))\n  );\n}\n\n.panel-nav--animating .panel-nav__item-label {\n  text-overflow: clip;\n}\n\n.panel-nav--collapsed .panel-nav__item-label {\n  opacity: 0;\n  pointer-events: none;\n  text-overflow: clip;\n  mask-position: 100% 0;\n  -webkit-mask-position: 100% 0;\n  transition:\n    opacity var(--_nav-label-fade-out-motion) 0ms,\n    mask-position var(--_nav-label-fade-out-motion) 0ms,\n    -webkit-mask-position var(--_nav-label-fade-out-motion) 0ms;\n}\n\n.panel-nav--collapsed ds-text.panel-nav__group-label {\n  opacity: 0;\n  max-height: 0;\n  padding: 0 calc(var(--dimension-space-075, 6px) + var(--ds-control-label-inset));\n  pointer-events: none;\n  transition:\n    opacity var(--_nav-label-fade-out-motion) 0ms,\n    max-height var(--_nav-label-fade-out-motion) 0ms,\n    padding var(--_nav-label-fade-out-motion) 0ms,\n    color var(--effect-motion-short-3, 200ms ease);\n}\n\n/* ── Footer ──────────────────────────────────────────────────────────────── */\n\n.panel-nav__footer {\n  position: relative;\n  flex-shrink: 0;\n  /* single row: padding*2 + item */\n  height: calc(var(--_nav-padding-y) * 2 + var(--_nav-item-height));\n  transition: height var(--_nav-expand-motion);\n}\n\n.panel-nav--collapsed .panel-nav__footer {\n  /* two rows: padding*2 + item*2 + gap */\n  height: calc(\n    var(--_nav-padding-y) * 2 + var(--_nav-item-height) * 2 + var(--dimension-space-050, 4px)\n  );\n}\n\n/* ── Footer icon button (gear / dashboard) ───────────────────────────────── */\n\n.panel-nav__footer-btn {\n  position: absolute;\n  left: var(--_nav-padding-x);\n  top: var(--_nav-padding-y);\n  --ds-button-unfilled-fg: var(--_nav-fg-secondary);\n  --ds-button-unfilled-fg-active: var(--_nav-fg-primary);\n  --ds-interaction-hover: var(--_nav-hover);\n  --ds-interaction-pressed: var(--_nav-pressed);\n  --ds-focus-ring-color: var(--_nav-focus);\n}\n\n/* ── Footer user — absolutely positioned, slides from row to below gear ───── */\n\n.panel-nav__footer-user {\n  position: absolute;\n  /* Expanded row: balanced shell inset with an 8px gear-to-user gap. */\n  left: calc(var(--_nav-padding-x) + var(--_nav-footer-btn-w) + var(--dimension-space-100, 8px));\n  right: var(--_nav-padding-x);\n  top: var(--_nav-padding-y);\n  width: auto;\n  min-width: 0;\n  transition:\n    left var(--_nav-expand-motion),\n    right var(--_nav-expand-motion),\n    top var(--_nav-expand-motion);\n}\n\n/* Popup-open state keeps the native footer trigger visibly pressed. */\n.panel-nav__footer-user--menu-expanded::after {\n  background: var(--_nav-pressed);\n}\n\n.panel-nav__footer-user--menu-expanded {\n  --ds-interaction-hover: var(--_nav-pressed);\n}\n\n.panel-nav--collapsed .panel-nav__footer-user {\n  /* Resolve one shared square control while keeping both inline edges animatable. */\n  left: var(--_nav-padding-x);\n  right: calc(100% - var(--_nav-padding-x) - var(--_nav-item-height));\n  top: calc(var(--_nav-padding-y) + var(--_nav-item-height) + var(--dimension-space-050, 4px));\n}\n\n/* Label: absolute so it stays in place and only fades — no mask slide */\n.panel-nav__footer-user-label {\n  text-align: right;\n  position: absolute;\n  left: var(--dimension-space-075, 6px);\n  right: calc(\n    var(--dimension-space-075, 6px) + var(--dimension-iconography-md, 20px) +\n      var(--dimension-space-050, 4px)\n  );\n  top: 50%;\n  transform: translateY(-50%);\n  flex: none;\n  height: var(--typography-lineheight-md, 20px);\n  mask-image: none;\n  -webkit-mask-image: none;\n  transition: opacity var(--_nav-label-fade-motion);\n}\n\n.panel-nav--collapsed .panel-nav__footer-user-label {\n  opacity: 0;\n  pointer-events: none;\n  mask-position: 0% 0;\n  -webkit-mask-position: 0% 0;\n}\n\n/* ── Footer user icon — cross-fades chevron ↔ circle+initial ────────────── */\n\n/* Absolute — right-anchored in expanded, left-anchored in collapsed to match regular item icon position */\n.panel-nav__footer-user-icon {\n  position: absolute;\n  left: calc(100% - var(--dimension-iconography-md, 20px) - var(--dimension-space-075, 6px));\n  top: 0;\n  bottom: 0;\n  height: auto;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  transition: left var(--_nav-expand-motion);\n}\n\n.panel-nav--collapsed .panel-nav__footer-user-icon {\n  left: var(--dimension-space-075, 6px);\n}\n\n.panel-nav__footer-icon-expanded,\n.panel-nav__footer-icon-collapsed {\n  position: absolute;\n  inset: 0;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n}\n\n.panel-nav__footer-icon-expanded {\n  opacity: 1;\n  transition: opacity var(--_nav-label-fade-motion);\n}\n\n.panel-nav__footer-icon-collapsed {\n  opacity: 0;\n  transition: opacity var(--_nav-label-fade-motion);\n}\n\n.panel-nav--collapsed .panel-nav__footer-icon-expanded {\n  opacity: 0;\n  transition: opacity var(--_nav-label-fade-out-motion);\n}\n\n.panel-nav--collapsed .panel-nav__footer-icon-collapsed {\n  opacity: 1;\n  transition: opacity var(--_nav-label-fade-out-motion);\n}\n\n/* ── User initial — overlaid on the circle icon ─────────────────────────── */\n\n/*\n * Center the caption glyph on the Circle icon. Don't use inset:0 + flex — the\n * inner `.ds-text__element { width: 100% }` stretches and left-aligns the letter.\n * Translate-centering keeps the complete caption metric box on the icon center;\n * the caption variant remains the sole owner of its line-height.\n * (Do not set `inset: auto` after top/left — it resets them.)\n */\nds-text.panel-nav__user-initial,\nds-text.panel-nav__user-initial.ds-text--caption {\n  position: absolute;\n  top: 50%;\n  left: 50%;\n  right: auto;\n  bottom: auto;\n  transform: translate(-50%, -50%);\n  display: block;\n  width: max-content;\n  max-width: none;\n  min-width: 0;\n  text-align: center;\n  color: inherit;\n  pointer-events: none;\n}\n\n/* ── Drag-to-resize handle ───────────────────────────────────────────────── */\n\n/* The resize overlay line — extends past the right edge; keep above workspace content */\n.panel-nav__resize-handle {\n  position: absolute;\n  top: 0;\n  /* Centered on the right edge: --dimension-space-050 outside + inside = --dimension-space-100 hit zone */\n  right: var(--dimension-space-n050, -4px);\n  bottom: 0;\n  width: var(--dimension-space-100, 8px);\n  z-index: 20;\n  cursor: ew-resize;\n  touch-action: none;\n  /* Needs a real background for Safari hit-testing */\n  background: transparent;\n}\n\n/* Safari requires non-transparent fill for hit testing */\n.panel-nav__resize-handle::before {\n  content: '';\n  position: absolute;\n  inset: 0;\n  /* stylelint-disable-next-line color-named -- near-invisible hit-test fill; not a theme color */\n  background: rgba(0, 0, 0, 0.001);\n}\n\n/* Resize overlay line */\n.panel-nav__resize-handle::after {\n  content: '';\n  position: absolute;\n  top: 0;\n  bottom: 0;\n  left: 50%;\n  transform: translateX(-50%);\n  width: var(--dimension-stroke-width-025, 2px);\n  background: var(--color-foreground-primary);\n  opacity: 0;\n  pointer-events: none;\n  transition: opacity var(--effect-motion-short-2, 100ms ease-in-out);\n}\n\n.panel-nav__resize-handle--overlay::after {\n  opacity: 1;\n}\n\n/* ── Reduced motion ──────────────────────────────────────────────────────── */\n\n@media (prefers-reduced-motion: reduce) {\n  .panel-nav,\n  .panel-nav *,\n  .panel-nav *::before,\n  .panel-nav *::after,\n  .panel-nav__resize-handle,\n  .panel-nav__resize-handle::before,\n  .panel-nav__resize-handle::after {\n    /* Near-instant — browsers treat 0 as \"no transition\" and can skip the end state. */\n    transition-duration: var(--effect-animation-duration-instant) !important;\n    animation-duration: var(--effect-animation-duration-instant) !important;\n    transition-delay: var(--effect-animation-duration-instant) !important;\n  }\n}\n","import {\n  Component,\n  Prop,\n  Event,\n  EventEmitter,\n  Watch,\n  State,\n  Element,\n  Method,\n  h,\n  Host,\n} from '@stencil/core';\nimport type { ChromeTransitionDetail } from '../../shell/chrome-transition';\nimport type { NavChromeStyle } from '../../shell/nav-chrome';\nimport {\n  deriveActiveIdFromUrl,\n  panelNavWidthTransitionMs,\n  parsePanelNavGroups,\n  resolvePanelNavDisableVt,\n  resolvePanelNavStyle,\n  resolvePanelNavToggle,\n  shouldResyncPanelNavGroups,\n  shouldResyncPanelNavStyle,\n} from './panel-nav-utils';\nimport {\n  PANEL_NAV_USER_MENU_ANCHOR_ID,\n  PANEL_NAV_USER_MENU_PLACEMENT,\n  type PanelNavGroup,\n  type PanelNavItem,\n  type PanelNavRouterMode,\n  type PanelNavUserActionDetail,\n} from './panel-nav-types';\nimport { scrollEdgeFadeClassMap } from '../../utils/scroll-edge-fade';\nimport { prefersReducedMotion } from '../../utils/resolve-css-time-ms';\nimport { resolveSafeUrl } from '../../utils/safe-url';\n\n@Component({\n  tag: 'ds-panel-nav',\n  styleUrl: 'PanelNav.css',\n  styleUrls: ['../../utils/scroll-edge-fade.css'],\n  scoped: true,\n})\nexport class PanelNav {\n  /** Style slot: `dashboard` or `settings`. Colors match for now;\n   *  class hooks reserved for texture/glyph layers. Property: `navStyle`. Attribute: `nav-style`. */\n  @Prop({ attribute: 'nav-style', reflect: true }) navStyle: NavChromeStyle = 'dashboard';\n\n  /** When `true`, style changes apply synchronously — host app owns view transitions. */\n  @Prop() disableViewTransition: boolean = false;\n\n  /** Nav groups — set via JS property (`el.groups = [...]`) or JSON string attribute. */\n  @Prop() groups: string | PanelNavGroup[] = '[]';\n\n  /** How items with `href` render:\n   *  - `anchor` (default): native `<a href>` — works with routers that intercept anchors.\n   *  - `event`: always `<button>`; host handles navigation via `dsNavSelect`. */\n  @Prop() routerMode: PanelNavRouterMode = 'anchor';\n\n  /** ID of the currently active/selected nav item. Overridden by `currentUrl` matching when set. */\n  @Prop() activeId: string = '';\n\n  /** Whether the nav is in collapsed (icon-only) state.\n   *  Set `storageKey` to persist across reloads. `dsNavToggle` still fires on change. */\n  @Prop({ mutable: true }) collapsed: boolean = false;\n\n  /** Viewport width (px) below which the nav locks in icon-only mode. 0 = disabled. */\n  @Prop() breakpoint: number = 0;\n\n  /** `localStorage` key used to persist the collapsed state across page loads.\n   *  When set, collapsed state is restored on mount and written on each toggle. */\n  @Prop() storageKey: string = '';\n\n  /** Current route URL (e.g. `window.location.pathname` or the router's active URL).\n   *  When set the component derives the active item by matching item `href` values\n   *  against this string (longest segment-boundary prefix wins), overriding `activeId`. */\n  @Prop() currentUrl: string = '';\n\n  /** Display name for the footer user section */\n  @Prop() userName: string = '';\n\n  /** Single character shown in the collapsed avatar */\n  @Prop() userInitial: string = '';\n\n  @Prop() dashboardLabel: string = 'Dashboard';\n  @Prop() settingsLabel: string = 'Settings';\n  @Prop() accountLabel: string = 'Account';\n  /** Keep the account-menu trigger visually pressed while its popup is open or closing. */\n  @Prop() accountMenuExpanded: boolean = false;\n  @Prop() dashboardNavigationLabel: string = 'Dashboard navigation';\n  @Prop() settingsNavigationLabel: string = 'Settings navigation';\n  @Prop() expandNavigationLabel: string = 'Expand navigation';\n  @Prop() collapseNavigationLabel: string = 'Collapse navigation';\n  /** Localized name for the body when overflow makes it a keyboard-scrollable region. */\n  @Prop() navigationItemsLabel: string = 'Navigation items';\n\n  /** Emitted when a nav item is clicked. Detail = the item's `id`. */\n  @Event() dsNavSelect!: EventEmitter<string>;\n\n  /** Emitted when the collapse toggle is clicked. Detail = new collapsed state. */\n  @Event() dsNavToggle!: EventEmitter<boolean>;\n\n  /** Bubbling lifecycle — `ds-shell-app` pauses chrome metrics during width motion. */\n  @Event({ bubbles: true, composed: true })\n  dsChromeTransitionStart!: EventEmitter<ChromeTransitionDetail>;\n\n  @Event({ bubbles: true, composed: true })\n  dsChromeTransitionEnd!: EventEmitter<ChromeTransitionDetail>;\n\n  /** Emitted when the footer left button (gear / dashboard) is clicked. */\n  @Event() dsNavFooterAction!: EventEmitter<void>;\n\n  /** Emitted when the footer user button is clicked. Detail includes the anchor for `ds-menu`. */\n  @Event() dsNavUserAction!: EventEmitter<PanelNavUserActionDetail>;\n\n  @Element() el!: HTMLElement;\n\n  @State() private renderedStyle: NavChromeStyle = 'dashboard';\n  @State() private parsedGroups: PanelNavGroup[] = [];\n  @State() private isAnimating = false;\n  @State() private rovingIndex: number = 0;\n  @State() private viewportNarrow: boolean = false;\n  @State() private urlDerivedActiveId: string = '';\n  @State() private bodyScrollable = false;\n\n  private transitionCompletionHandler?: (e: TransitionEvent) => void;\n  private transitionFallbackTimer: number | null = null;\n  private resizeObserver?: ResizeObserver;\n  private scrollRegionObserver?: ResizeObserver;\n  private bodyEl?: HTMLElement;\n  private initialRenderComplete = false;\n\n  // Drag-to-resize state (not @State — no re-render needed)\n  private isDragging = false;\n  private dragStartX = 0;\n  private didSnap = false;\n  private lastDeltaX = 0;\n  private edgeOverlayTimer: number | null = null;\n  private globalMouseMoveHandler?: (e: MouseEvent) => void;\n  private globalMouseUpHandler?: () => void;\n\n  @State() private showEdgeOverlay = false;\n\n  private static readonly HOST_PROP_SYNC_BUDGET = 8;\n\n  /** The ID that should be treated as active. `currentUrl` matching takes precedence\n   *  over `activeId` when both are present. */\n  private get effectiveActiveId(): string {\n    return this.urlDerivedActiveId || this.activeId;\n  }\n\n  private get effectiveDisableViewTransition(): boolean {\n    return resolvePanelNavDisableVt(\n      this.disableViewTransition,\n      this.el.getAttribute('disable-view-transition')\n    );\n  }\n\n  @Watch('collapsed')\n  onCollapsedChange(_next: boolean, prev: boolean | undefined) {\n    if (prev === undefined || !this.initialRenderComplete) return;\n    this.startCollapseAnimation();\n  }\n\n  @Watch('viewportNarrow')\n  onViewportNarrowChange(next: boolean, prev: boolean | undefined) {\n    if (prev === undefined || !this.initialRenderComplete) return;\n    if (next && this.rovingIndex === 0) {\n      this.rovingIndex = this.getFirstRovingIndex();\n    }\n    this.startCollapseAnimation();\n  }\n\n  @Watch('breakpoint')\n  onBreakpointChange() {\n    this.disconnectResizeObserver();\n    if (this.effectiveBreakpoint() > 0) this.connectResizeObserver();\n  }\n\n  @Watch('groups')\n  onGroupsChange(val: string | PanelNavGroup[]) {\n    this.parsedGroups = parsePanelNavGroups(val);\n    this.rovingIndex = 0;\n    this.syncActiveFromUrl();\n  }\n\n  @Watch('activeId')\n  @Watch('urlDerivedActiveId')\n  onActiveIdChange() {\n    /* Active route updates aria-current only — roving tab stop stays user-controlled. */\n  }\n\n  @Watch('currentUrl')\n  onCurrentUrlChange() {\n    this.syncActiveFromUrl();\n  }\n\n  @Watch('navStyle')\n  onNavStyleChange(newVal: NavChromeStyle) {\n    this.renderedStyle = newVal;\n  }\n\n  componentWillLoad() {\n    this.renderedStyle = resolvePanelNavStyle(this.navStyle, this.el.getAttribute('nav-style'));\n    this.viewportNarrow = this.isViewportNarrow();\n    if (this.storageKey) {\n      try {\n        const stored = localStorage.getItem(this.storageKey);\n        if (stored !== null) this.collapsed = stored === 'true';\n      } catch {\n        /* localStorage unavailable */\n      }\n    }\n    this.onGroupsChange(this.groups);\n    this.syncActiveFromUrl();\n  }\n\n  componentDidLoad() {\n    this.syncHostPropsIfNeeded();\n    this.scheduleDeferredHostPropSync();\n    if (this.effectiveBreakpoint() > 0) this.connectResizeObserver();\n    this.connectScrollRegionObserver();\n    this.updateBodyScrollable();\n    this.initialRenderComplete = true;\n  }\n\n  componentDidRender() {\n    this.updateBodyScrollable();\n  }\n\n  disconnectedCallback() {\n    this.disconnectResizeObserver();\n    this.disconnectScrollRegionObserver();\n    this.clearCollapseAnimationCompletion(\n      this.el.querySelector('.panel-nav') as HTMLElement | null\n    );\n    this.clearEdgeOverlayTimer();\n    if (this.globalMouseMoveHandler) {\n      window.removeEventListener('mousemove', this.globalMouseMoveHandler);\n    }\n    if (this.globalMouseUpHandler) {\n      window.removeEventListener('mouseup', this.globalMouseUpHandler);\n    }\n  }\n\n  private startCollapseAnimation() {\n    if (this.isAnimating) return;\n    this.isAnimating = true;\n    this.dsChromeTransitionStart.emit({ source: 'panel-nav' });\n    const panel = this.el.querySelector('.panel-nav') as HTMLElement | null;\n    const widthBefore = panel?.getBoundingClientRect().width ?? 0;\n    this.clearCollapseAnimationCompletion(panel);\n    this.transitionCompletionHandler = (e: TransitionEvent) => {\n      if (e.propertyName === 'width' || e.propertyName === 'min-width') {\n        this.finishCollapseAnimation(panel);\n      }\n    };\n    panel?.addEventListener('transitionend', this.transitionCompletionHandler);\n    panel?.addEventListener('transitioncancel', this.transitionCompletionHandler);\n    requestAnimationFrame(() => {\n      requestAnimationFrame(() => {\n        if (!this.isAnimating) return;\n        const widthAfter = panel?.getBoundingClientRect().width ?? 0;\n        if (Math.abs(widthAfter - widthBefore) < 1) {\n          this.finishCollapseAnimation(panel);\n          return;\n        }\n        if (!panel) {\n          this.finishCollapseAnimation(panel);\n          return;\n        }\n\n        const fallbackMs = panelNavWidthTransitionMs(getComputedStyle(panel));\n        if (fallbackMs <= 0) {\n          this.finishCollapseAnimation(panel);\n          return;\n        }\n        this.transitionFallbackTimer = window.setTimeout(() => {\n          this.finishCollapseAnimation(panel);\n        }, fallbackMs);\n      });\n    });\n  }\n\n  private finishCollapseAnimation(panel: HTMLElement | null) {\n    const wasAnimating = this.isAnimating;\n    this.clearCollapseAnimationCompletion(panel);\n    if (!wasAnimating) return;\n    this.isAnimating = false;\n    this.dsChromeTransitionEnd.emit({ source: 'panel-nav' });\n  }\n\n  private clearCollapseAnimationCompletion(panel: HTMLElement | null) {\n    if (this.transitionCompletionHandler) {\n      panel?.removeEventListener('transitionend', this.transitionCompletionHandler);\n      panel?.removeEventListener('transitioncancel', this.transitionCompletionHandler);\n      this.transitionCompletionHandler = undefined;\n    }\n    if (this.transitionFallbackTimer !== null) {\n      window.clearTimeout(this.transitionFallbackTimer);\n      this.transitionFallbackTimer = null;\n    }\n  }\n\n  private effectiveBreakpoint(): number {\n    if (this.breakpoint > 0) return this.breakpoint;\n    const attributeValue = Number(this.el.getAttribute('breakpoint') ?? 0);\n    return Number.isFinite(attributeValue) && attributeValue > 0 ? attributeValue : 0;\n  }\n\n  private isViewportNarrow(): boolean {\n    const breakpoint = this.effectiveBreakpoint();\n    return typeof window !== 'undefined' && breakpoint > 0 && window.innerWidth < breakpoint;\n  }\n\n  private connectResizeObserver() {\n    this.viewportNarrow = this.isViewportNarrow();\n    this.resizeObserver = new ResizeObserver(() => {\n      this.viewportNarrow = this.isViewportNarrow();\n    });\n    this.resizeObserver.observe(document.documentElement);\n  }\n\n  private disconnectResizeObserver() {\n    this.resizeObserver?.disconnect();\n    this.resizeObserver = undefined;\n  }\n\n  private connectScrollRegionObserver() {\n    this.disconnectScrollRegionObserver();\n    if (!this.bodyEl || typeof ResizeObserver === 'undefined') return;\n    this.scrollRegionObserver = new ResizeObserver(() => this.updateBodyScrollable());\n    this.scrollRegionObserver.observe(this.bodyEl);\n  }\n\n  private disconnectScrollRegionObserver() {\n    this.scrollRegionObserver?.disconnect();\n    this.scrollRegionObserver = undefined;\n  }\n\n  private updateBodyScrollable() {\n    const next = Boolean(this.bodyEl && this.bodyEl.scrollHeight > this.bodyEl.clientHeight + 1);\n    if (next !== this.bodyScrollable) this.bodyScrollable = next;\n  }\n\n  /** Derive active ID from the current URL by matching item `href` values.\n   *  Uses longest segment-boundary prefix match. */\n  private syncActiveFromUrl() {\n    if (!this.currentUrl) {\n      this.urlDerivedActiveId = '';\n      return;\n    }\n    this.urlDerivedActiveId = deriveActiveIdFromUrl(this.currentUrl, this.getAllItems());\n  }\n\n  /** Re-parse props assigned by the host after componentWillLoad (Angular ngAfterViewInit). */\n  private syncHostPropsIfNeeded() {\n    if (shouldResyncPanelNavStyle(this.renderedStyle, this.navStyle)) {\n      this.renderedStyle = this.navStyle;\n    }\n\n    if (shouldResyncPanelNavGroups(this.parsedGroups, this.groups)) {\n      this.onGroupsChange(this.groups);\n    } else if (this.currentUrl) {\n      this.syncActiveFromUrl();\n    }\n  }\n\n  /** Poll across animation frames — host props may land without triggering @Watch. */\n  private scheduleDeferredHostPropSync() {\n    let remaining = PanelNav.HOST_PROP_SYNC_BUDGET;\n    const tick = () => {\n      this.syncHostPropsIfNeeded();\n      if (--remaining > 0) {\n        requestAnimationFrame(tick);\n      }\n    };\n    queueMicrotask(tick);\n  }\n\n  /** Centralised toggle: updates the desktop preference unless breakpoint-locked. */\n  private applyToggle(next: boolean) {\n    if (this.viewportNarrow) return;\n    this.collapsed = next;\n    if (this.storageKey) {\n      try {\n        localStorage.setItem(this.storageKey, String(next));\n      } catch {\n        /* unavailable */\n      }\n    }\n    this.dsNavToggle.emit(next);\n  }\n\n  private getAllItems(): PanelNavItem[] {\n    return this.parsedGroups.flatMap(g => g.items);\n  }\n\n  private getFirstRovingIndex(): number {\n    return this.viewportNarrow ? 1 : 0;\n  }\n\n  private getFooterRovingIndex(): number {\n    return 1 + this.getAllItems().length;\n  }\n\n  private getUserRovingIndex(): number {\n    return this.getFooterRovingIndex() + 1;\n  }\n\n  private getRovingElement(index: number): HTMLElement | null {\n    const itemCount = this.getAllItems().length;\n    if (index === 0) {\n      return this.viewportNarrow ? null : this.el.querySelector('.panel-nav__header-btn');\n    }\n    if (index >= 1 && index <= itemCount) {\n      const items = this.el.querySelectorAll<HTMLElement>('.panel-nav__body .panel-nav__item');\n      return items[index - 1] ?? null;\n    }\n    if (index === this.getFooterRovingIndex()) {\n      return this.el.querySelector('.panel-nav__footer-btn .button-unfilled');\n    }\n    if (index === this.getUserRovingIndex()) {\n      return this.el.querySelector('.panel-nav__footer-user');\n    }\n    return null;\n  }\n\n  private focusRovingAt(index: number) {\n    this.rovingIndex = index;\n    this.getRovingElement(index)?.focus({ preventScroll: true });\n  }\n\n  private activateRovingIndex(index: number) {\n    const itemCount = this.getAllItems().length;\n    const items = this.getAllItems();\n    if (index === 0) {\n      this.handleToggle();\n      return;\n    }\n    if (index >= 1 && index <= itemCount) {\n      this.handleItemClick(items[index - 1].id);\n      return;\n    }\n    if (index === this.getFooterRovingIndex()) {\n      this.handleFooterAction();\n      return;\n    }\n    if (index === this.getUserRovingIndex()) {\n      const anchor = this.el.querySelector(\n        `#${PANEL_NAV_USER_MENU_ANCHOR_ID}`\n      ) as HTMLElement | null;\n      if (anchor)\n        this.dsNavUserAction.emit({ anchor, menuPlacement: PANEL_NAV_USER_MENU_PLACEMENT });\n    }\n  }\n\n  private handleRovingKeyDown(e: KeyboardEvent, index: number) {\n    if (e.key === 'Enter' || e.key === ' ') {\n      e.preventDefault();\n      this.activateRovingIndex(index);\n      return;\n    }\n\n    const footerIdx = this.getFooterRovingIndex();\n    const userIdx = this.getUserRovingIndex();\n    const firstIdx = this.getFirstRovingIndex();\n    let next: number | undefined;\n\n    switch (e.key) {\n      case 'ArrowDown':\n        if (index === userIdx) return;\n        if (index === footerIdx) next = userIdx;\n        else next = index + 1;\n        break;\n      case 'ArrowUp':\n        if (index === firstIdx) return;\n        if (index === userIdx) next = footerIdx;\n        else if (index === footerIdx) next = footerIdx - 1;\n        else next = index - 1;\n        break;\n      case 'ArrowRight':\n        if (index === footerIdx) next = userIdx;\n        else return;\n        break;\n      case 'ArrowLeft':\n        if (index === userIdx) next = footerIdx;\n        else return;\n        break;\n      case 'Home':\n        e.preventDefault();\n        next = firstIdx;\n        break;\n      case 'End':\n        e.preventDefault();\n        next = userIdx;\n        break;\n      default:\n        return;\n    }\n\n    if (next === undefined || next === index) return;\n    e.preventDefault();\n    this.focusRovingAt(next);\n  }\n\n  private handleItemClick(id: string) {\n    this.dsNavSelect.emit(id);\n  }\n\n  private handleToggle() {\n    const next = resolvePanelNavToggle(this.collapsed, this.viewportNarrow);\n    if (next !== null) this.applyToggle(next);\n  }\n\n  /** Toggle the desktop preference. No-op while the breakpoint locks the panel collapsed. */\n  @Method()\n  async toggleCollapsed() {\n    this.handleToggle();\n  }\n\n  private handleFooterAction() {\n    this.dsNavFooterAction.emit();\n  }\n\n  private handleUserAction(e: MouseEvent) {\n    const anchor = e.currentTarget as HTMLElement;\n    this.dsNavUserAction.emit({ anchor, menuPlacement: PANEL_NAV_USER_MENU_PLACEMENT });\n  }\n\n  private clearEdgeOverlayTimer() {\n    if (this.edgeOverlayTimer !== null) {\n      window.clearTimeout(this.edgeOverlayTimer);\n      this.edgeOverlayTimer = null;\n    }\n  }\n\n  private handleResizeHandleMouseEnter() {\n    this.clearEdgeOverlayTimer();\n    if (prefersReducedMotion()) {\n      this.showEdgeOverlay = true;\n      return;\n    }\n    this.edgeOverlayTimer = window.setTimeout(() => {\n      this.showEdgeOverlay = true;\n      this.edgeOverlayTimer = null;\n    }, 500);\n  }\n\n  private handleResizeHandleMouseLeave() {\n    if (this.isDragging) return;\n    this.clearEdgeOverlayTimer();\n    this.showEdgeOverlay = false;\n  }\n\n  private handleResizeHandleMouseDown(e: MouseEvent) {\n    e.preventDefault();\n    e.stopPropagation();\n\n    const wasCollapsed = this.collapsed || this.viewportNarrow;\n    this.isDragging = true;\n    this.dragStartX = e.clientX;\n    this.didSnap = false;\n    this.lastDeltaX = 0;\n    this.clearEdgeOverlayTimer();\n    this.showEdgeOverlay = false;\n\n    document.body.style.cursor = 'ew-resize';\n    document.body.style.userSelect = 'none';\n\n    const onMove = (ev: MouseEvent) => {\n      const deltaX = ev.clientX - this.dragStartX;\n      this.lastDeltaX = Math.abs(deltaX);\n      if (this.didSnap) return;\n      if (!wasCollapsed && deltaX < -8) {\n        this.applyToggle(true);\n        this.didSnap = true;\n      } else if (wasCollapsed && deltaX > 8) {\n        this.applyToggle(false);\n        this.didSnap = true;\n      }\n    };\n\n    const onUp = () => {\n      if (!this.didSnap && this.lastDeltaX < 3) {\n        this.applyToggle(!wasCollapsed);\n      }\n      this.isDragging = false;\n      this.showEdgeOverlay = false;\n      document.body.style.cursor = '';\n      document.body.style.userSelect = '';\n      window.removeEventListener('mousemove', onMove);\n      window.removeEventListener('mouseup', onUp);\n      this.globalMouseMoveHandler = undefined;\n      this.globalMouseUpHandler = undefined;\n    };\n\n    this.globalMouseMoveHandler = onMove;\n    this.globalMouseUpHandler = onUp;\n    window.addEventListener('mousemove', onMove);\n    window.addEventListener('mouseup', onUp);\n  }\n\n  private renderFooterAction(isDashboardChrome: boolean) {\n    // Short chrome labels — same string for tip + aria (not \"Open/Go to …\").\n    const footerLabel = isDashboardChrome ? this.settingsLabel : this.dashboardLabel;\n    return (\n      <ds-tooltip label={footerLabel} side=\"right\" size=\"sm\">\n        <ds-button-unfilled\n          variant=\"icon\"\n          class=\"panel-nav__footer-btn\"\n          icon={isDashboardChrome ? 'Gear' : 'Dashboard'}\n          activeFill={false}\n          hasBorder={false}\n          focusTabIndex={this.rovingIndex === this.getFooterRovingIndex() ? 0 : -1}\n          aria-label={footerLabel}\n          onDsClick={() => this.handleFooterAction()}\n          onKeyDown={(e: KeyboardEvent) => this.handleRovingKeyDown(e, this.getFooterRovingIndex())}\n          onFocusin={() => {\n            this.rovingIndex = this.getFooterRovingIndex();\n          }}\n        />\n      </ds-tooltip>\n    );\n  }\n\n  private renderFooterUser(collapsed: boolean, userName: string, userInitial: string) {\n    // Always wrap so collapse morph CSS can transition on a stable button node.\n    // Tip only when collapsed (empty label → ds-tooltip skips show).\n    const tipLabel = collapsed ? this.accountLabel : '';\n    const userButton = (\n      <button\n        type=\"button\"\n        id={PANEL_NAV_USER_MENU_ANCHOR_ID}\n        class={{\n          'panel-nav__item': true,\n          'panel-nav__footer-user': true,\n          'panel-nav__footer-user--menu-expanded': this.accountMenuExpanded,\n          'ds-focus-ring-inset': true,\n          'ds-interaction-fill': true,\n        }}\n        tabIndex={this.rovingIndex === this.getUserRovingIndex() ? 0 : -1}\n        aria-label={this.accountLabel}\n        aria-haspopup=\"menu\"\n        aria-expanded={String(this.accountMenuExpanded)}\n        onClick={e => this.handleUserAction(e)}\n        onKeyDown={(e: KeyboardEvent) => this.handleRovingKeyDown(e, this.getUserRovingIndex())}\n        onFocus={() => {\n          this.rovingIndex = this.getUserRovingIndex();\n        }}\n      >\n        <ds-text\n          class=\"panel-nav__item-label panel-nav__footer-user-label panel-nav__item-label-text ds-control--md\"\n          as=\"span\"\n          variant=\"text-body-medium\"\n          emphasis\n          color=\"inherit\"\n          lineTruncation={1}\n        >\n          {userName}\n        </ds-text>\n        <span class=\"panel-nav__item-icon panel-nav__footer-user-icon\" aria-hidden=\"true\">\n          <span class=\"panel-nav__footer-icon-expanded\">\n            <ds-icon name=\"ChevronUpDown\" size=\"md\" color=\"inherit\" />\n          </span>\n          <span class=\"panel-nav__footer-icon-collapsed\">\n            <ds-icon name=\"Circle\" size=\"md\" color=\"inherit\" />\n            <ds-text\n              class=\"panel-nav__user-initial\"\n              as=\"span\"\n              variant=\"text-caption\"\n              emphasis\n              align=\"center\"\n              color=\"inherit\"\n            >\n              {userInitial}\n            </ds-text>\n          </span>\n        </span>\n      </button>\n    );\n\n    return (\n      <ds-tooltip label={tipLabel} side=\"right\" size=\"sm\">\n        {userButton}\n      </ds-tooltip>\n    );\n  }\n\n  private renderNavItem(item: PanelNavItem, idx: number, collapsed: boolean) {\n    const isActive = item.id === this.effectiveActiveId;\n    const rovingPosition = idx + 1;\n\n    const itemContent = [\n      <span class=\"panel-nav__item-icon\">\n        <ds-icon name={item.icon} size=\"md\" color=\"inherit\" />\n      </span>,\n      <ds-text\n        class=\"panel-nav__item-label panel-nav__item-label-text ds-control--md\"\n        as=\"span\"\n        variant=\"text-body-medium\"\n        emphasis={isActive}\n        color=\"inherit\"\n        lineTruncation={1}\n      >\n        {item.label}\n      </ds-text>,\n      item.dot && (\n        <span class=\"panel-nav__item-dot-box\" aria-hidden=\"true\">\n          <ds-badge class=\"panel-nav__item-dot\" variant=\"dot\" hasRing={collapsed} label=\"\" />\n        </span>\n      ),\n    ];\n\n    const sharedProps = {\n      class: {\n        'panel-nav__item': true,\n        'panel-nav__item--active': isActive,\n        'ds-focus-ring-inset': true,\n        'ds-interaction-fill': true,\n      },\n      'aria-current': isActive ? ('page' as const) : undefined,\n      tabIndex: rovingPosition === this.rovingIndex ? 0 : -1,\n      onClick: () => this.handleItemClick(item.id),\n      onKeyDown: (e: KeyboardEvent) => this.handleRovingKeyDown(e, rovingPosition),\n      onFocus: () => {\n        this.rovingIndex = rovingPosition;\n      },\n    };\n\n    const href = resolveSafeUrl(item.href);\n    const useAnchor = this.routerMode === 'anchor' && href;\n    const control = useAnchor ? (\n      <a {...sharedProps} href={href}>\n        {itemContent}\n      </a>\n    ) : (\n      <button {...sharedProps} type=\"button\">\n        {itemContent}\n      </button>\n    );\n\n    // Always wrap so label fade CSS can transition on a stable item node.\n    // Tip only when collapsed (empty label → ds-tooltip skips show).\n    return (\n      <ds-tooltip label={collapsed ? item.label : ''} side=\"right\" size=\"sm\">\n        {control}\n      </ds-tooltip>\n    );\n  }\n\n  render() {\n    const chromeStyle = this.renderedStyle;\n    const isDashboardChrome = chromeStyle === 'dashboard';\n    const isDashboard = this.navStyle === 'dashboard';\n    const collapsed = this.collapsed || this.viewportNarrow;\n    const { userName, userInitial } = this;\n\n    const navCls: Record<string, boolean> = {\n      'panel-nav': true,\n      'ds-control--md': true,\n      'panel-nav--dashboard': isDashboard,\n      'panel-nav--settings': !isDashboard,\n      'panel-nav--collapsed': collapsed,\n      'panel-nav--breakpoint-locked': this.viewportNarrow,\n      'panel-nav--animating': this.isAnimating,\n    };\n\n    return (\n      <Host style={{ display: 'block', position: 'relative' }}>\n        <nav\n          class={navCls}\n          aria-label={\n            isDashboardChrome ? this.dashboardNavigationLabel : this.settingsNavigationLabel\n          }\n        >\n          {/* ── Header: Motive logo, reveals collapse toggle on hover ── */}\n          <div class=\"panel-nav__header ds-chrome-row ds-chrome-space--md\">\n            <button\n              type=\"button\"\n              class=\"panel-nav__header-btn ds-focus-ring-inset ds-interaction-fill\"\n              disabled={this.viewportNarrow}\n              tabIndex={!this.viewportNarrow && this.rovingIndex === 0 ? 0 : -1}\n              onClick={() => this.handleToggle()}\n              onKeyDown={(e: KeyboardEvent) => this.handleRovingKeyDown(e, 0)}\n              onFocus={() => {\n                this.rovingIndex = 0;\n              }}\n              aria-label={collapsed ? this.expandNavigationLabel : this.collapseNavigationLabel}\n              aria-expanded={collapsed ? 'false' : 'true'}\n            >\n              {/* Motive M mark — fades out on hover to reveal collapse toggle */}\n              <span class=\"panel-nav__header-logo\" aria-hidden=\"true\">\n                <svg\n                  class=\"panel-nav__m-mark\"\n                  viewBox=\"0 0 20 20\"\n                  fill=\"none\"\n                  xmlns=\"http://www.w3.org/2000/svg\"\n                  focusable=\"false\"\n                  aria-hidden=\"true\"\n                >\n                  <path\n                    d=\"M11.1159 4.31537H7.67021L2.53401 13.0703H0V15.6875H4.02716L8.24319 8.49978V15.6846H11.6342L15.8289 8.47829V15.6846H18.7122V4.3125H15.2559L11.1159 11.3648V4.31537Z\"\n                    fill=\"currentColor\"\n                  />\n                </svg>\n              </span>\n              {/* Collapse / expand icon — revealed on hover via CSS */}\n              <span class=\"panel-nav__header-toggle\" aria-hidden=\"true\">\n                <ds-icon\n                  name={collapsed ? 'LeftExpandB' : 'LeftCollapseB'}\n                  size=\"md\"\n                  color=\"inherit\"\n                />\n              </span>\n            </button>\n          </div>\n\n          {/* ── Scrollable body ── */}\n          <div\n            class={{\n              'panel-nav__body': true,\n              'ds-chrome-column': true,\n              'ds-chrome-space--md': true,\n              'ds-scrollbar-hidden': true,\n              'ds-focus-ring': this.bodyScrollable,\n              ...scrollEdgeFadeClassMap({ edges: 'bottom' }),\n            }}\n            ref={element => {\n              const next = (element as HTMLElement) ?? undefined;\n              if (next === this.bodyEl) return;\n              this.bodyEl = next;\n              this.connectScrollRegionObserver();\n            }}\n            role={this.bodyScrollable ? 'region' : undefined}\n            aria-label={this.bodyScrollable ? this.navigationItemsLabel : undefined}\n            tabIndex={this.bodyScrollable ? 0 : undefined}\n          >\n            <div class=\"panel-nav__sections\">\n              {(() => {\n                let flatIdx = 0;\n                return this.parsedGroups.map(group => (\n                  <div class=\"panel-nav__group\">\n                    {group.label && (\n                      <ds-text\n                        class=\"panel-nav__group-label ds-control--md\"\n                        as=\"span\"\n                        variant=\"text-caption\"\n                        emphasis\n                        color=\"inherit\"\n                      >\n                        {group.label}\n                      </ds-text>\n                    )}\n                    {group.items.map(item => this.renderNavItem(item, flatIdx++, collapsed))}\n                  </div>\n                ));\n              })()}\n            </div>\n          </div>\n\n          {/* ── Footer ── */}\n          <div class=\"panel-nav__footer\">\n            {this.renderFooterAction(isDashboardChrome)}\n            {this.renderFooterUser(collapsed, userName, userInitial)}\n          </div>\n        </nav>\n\n        {/* Drag-to-resize handle — always rendered, hidden only when auto-collapsed by breakpoint */}\n        {!this.viewportNarrow && (\n          <div\n            class={{\n              'panel-nav__resize-handle': true,\n              'panel-nav__resize-handle--overlay': this.showEdgeOverlay,\n            }}\n            onMouseEnter={() => this.handleResizeHandleMouseEnter()}\n            onMouseLeave={() => this.handleResizeHandleMouseLeave()}\n            onMouseDown={(e: MouseEvent) => this.handleResizeHandleMouseDown(e)}\n            aria-hidden=\"true\"\n          />\n        )}\n      </Host>\n    );\n  }\n}\n"],"mappings":"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","ignoreList":[]}