@ds-mo/ui 14.36.0 → 15.1.0

package/dist/components/p-J5x-QtlD.js.map

@@ -1 +0,0 @@
-{"version":3,"names":["scrollEdgeFadeClassMap","opts","edges","Array","isArray","classes","scrollAware","hidden","edge","atEnd","PANEL_NAV_USER_MENU_PLACEMENT","side","align","anchorAlignment","sideOffset","alignOffset","PANEL_NAV_CHILD_MENU_PLACEMENT","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","nextPanelNavInstanceId","PanelNav","__stencil_proxyCustomElement","HTMLElement","constructor","registerHost","this","instanceId","navStyle","disableViewTransition","groups","presentation","routerMode","activeId","activeChildId","collapsed","breakpoint","storageKey","currentUrl","userName","userInitial","dashboardLabel","settingsLabel","accountLabel","accountMenuExpanded","dashboardNavigationLabel","settingsNavigationLabel","expandNavigationLabel","collapseNavigationLabel","navigationItemsLabel","parsedGroups","isAnimating","rovingIndex","viewportNarrow","urlDerivedActiveId","urlDerivedActiveChildId","bodyScrollable","expandedParentId","inlineChildrenExpansionReady","flyoutParentId","flyoutOpen","flyoutInitialFocusVisible","transitionFallbackTimer","initialRenderComplete","inlineChildrenExpansionFrame","isDragging","dragStartX","didSnap","lastDeltaX","edgeOverlayTimer","showEdgeOverlay","closeFlyout","handleFlyoutAfterClose","handleFlyoutSelect","event","parent","getAllItems","find","item","id","child","children","detail","value","emitChildSelect","followFlyoutAnchor","effectiveActiveId","effectiveActiveChildId","collapsedPresentation","effectiveDisableViewTransition","resolvePanelNavDisableVt","el","onCollapsedChange","next","prev","stageInlineChildrenExpansion","syncExpandedParent","getFirstRovingIndex","startCollapseAnimation","onViewportNarrowChange","getVisibleRovingEntries","length","onBreakpointChange","disconnectResizeObserver","effectiveBreakpoint","connectResizeObserver","onGroupsChange","val","parsePanelNavGroups","syncActiveFromUrl","onPresentationChange","onActiveIdChange","onCurrentUrlChange","onNavStyleChange","newVal","componentWillLoad","resolvePanelNavStyle","isViewportNarrow","stored","localStorage","getItem","componentDidLoad","syncHostPropsIfNeeded","scheduleDeferredHostPropSync","connectScrollRegionObserver","updateBodyScrollable","componentDidRender","scheduleInlineChildrenExpansion","disconnectedCallback","disconnectScrollRegionObserver","clearInlineChildrenExpansionFrame","clearCollapseAnimationCompletion","querySelector","clearEdgeOverlayTimer","globalMouseMoveHandler","window","removeEventListener","globalMouseUpHandler","dsChromeTransitionStart","emit","source","panel","transitionCompletionHandler","e","target","propertyName","finishCollapseAnimation","addEventListener","requestAnimationFrame","fallbackMs","panelNavWidthTransitionMs","getComputedStyle","setTimeout","stage","getBoundingClientRect","cancelAnimationFrame","wasAnimating","dsChromeTransitionEnd","clearTimeout","attributeValue","Number","isFinite","innerWidth","resizeObserver","ResizeObserver","observe","disconnect","bodyEl","scrollRegionObserver","Boolean","scrollHeight","clientHeight","selection","derivePanelNavSelectionFromUrl","parentId","childId","active","shouldResyncPanelNavStyle","shouldResyncPanelNavGroups","remaining","HOST_PROP_SYNC_BUDGET","tick","queueMicrotask","applyToggle","setItem","String","dsNavToggle","flatMap","g","items","kind","filter","isInactive","map","getFooterRovingIndex","getUserRovingIndex","getRovingElement","index","itemCount","querySelectorAll","focusRovingAt","focus","preventScroll","activateRovingIndex","keyboard","entries","handleToggle","entry","activateParent","handleItemClick","handleFooterAction","anchor","dsNavUserAction","menuPlacement","handleRovingKeyDown","key","preventDefault","footerIdx","userIdx","firstIdx","dsNavSelect","dsNavChildSelect","href","resolveSafeUrl","ownerDocument","createElement","append","click","remove","firstEnabledPanelNavChild","parentAnchorId","replace","childListId","resolvePanelNavToggle","toggleCollapsed","dsNavFooterAction","handleUserAction","currentTarget","handleResizeHandleMouseEnter","prefersReducedMotion","handleResizeHandleMouseLeave","handleResizeHandleMouseDown","stopPropagation","wasCollapsed","clientX","body","cursor","userSelect","onMove","ev","deltaX","Math","abs","onUp","renderFooterAction","isDashboardChrome","footerLabel","h","label","size","variant","class","icon","activeFill","hasBorder","focusTabIndex","onDsClick","onKeyDown","onFocusin","renderFooterUser","tipLabel","userButton","type","accountMenuSurfaceOpen","tabIndex","onClick","onFocus","as","emphasis","color","lineTruncation","name","renderParentItem","rovingPosition","isActive","hasChildRoutes","disclosure","expanded","itemContent","dot","hasRing","sharedProps","useAnchor","control","renderChildItem","childIndex","childReverseIndex","inactive","content","disabled","renderFlyout","open","anchorId","selectionMode","menuLabel","initialFocusVisible","sections","isSelected","onDsSelect","onDsClose","onDsAfterClose","render","chromeStyle","isDashboard","navCls","Host","display","position","viewBox","fill","xmlns","focusable","d","ref","element","role","group","itemIndex","parentPosition","hasGroupSiblings","hasDividerBefore","hasDividerAfter","showBranchDividers","hasInlineChildren","childPosition","inert","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 PanelNav's collapsed child-route flyout.\n * The parent control is 8px inside the panel edge, so a 12px side offset leaves\n * a 4px visual gap outside the panel. Start choice-cell alignment places the\n * first flyout row on the same block axis as its parent control.\n */\nexport const PANEL_NAV_CHILD_MENU_PLACEMENT = {\n  side: 'right',\n  align: 'start',\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';\nexport type PanelNavPresentation = 'flat' | 'nested';\n\nexport interface PanelNavChildItem {\n  id: string;\n  label: string;\n  /** Show a notification dot badge on the child route. */\n  dot?: boolean;\n  /** Prevent activation while keeping the route visible. */\n  isInactive?: boolean;\n  /** Route path used for URL matching and native anchor navigation. */\n  href?: string;\n}\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  /** Optional route sections. Parents with children resolve through a child, not their own href. */\n  children?: PanelNavChildItem[];\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\n/** Navigation intent for a child route rendered inline or in the collapsed flyout. */\nexport interface PanelNavChildSelectDetail {\n  parentId: string;\n  childId: string;\n  href?: string;\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/radius.css';\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@import '../../utils/nav-disclosure.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/* ── Scrollable body ─────────────────────────────────────────────────────── */\n\n.panel-nav__body {\n  flex: 1;\n  overflow-y: auto;\n  overflow-x: hidden;\n}\n\n/* The collapsed rail's outer width includes its 1px divider. Return that pixel\n   to the content box so body items match the other 32px rail controls. */\n.panel-nav--collapsed .panel-nav__body {\n  padding-inline-end: calc(var(--_nav-padding-x) - var(--dimension-stroke-width-012));\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.panel-nav__branch {\n  display: flex;\n  flex-direction: column;\n}\n\n.panel-nav__branch-divider-line {\n  display: block;\n  height: var(--dimension-stroke-width-012);\n  margin-inline: var(--dimension-space-075);\n  background: var(--_nav-divider);\n}\n\n.panel-nav__branch-divider--before .panel-nav__branch-divider-line {\n  margin-block: var(--dimension-space-050) var(--dimension-space-100);\n}\n\n.panel-nav__branch-divider--after .panel-nav__branch-divider-line {\n  margin-block: var(--dimension-space-100) var(--dimension-space-050);\n}\n\n.panel-nav__children-accordion,\n.panel-nav__branch-divider {\n  --ds-nav-disclosure-duration: var(\n    --_panel-nav-nested-section-duration,\n    calc(var(--effect-animation-duration-short-3) * 2 + var(--effect-animation-duration-short-2))\n  );\n  --ds-nav-disclosure-wait: var(\n    --_panel-nav-nested-transition-wait,\n    calc(var(--effect-animation-duration-short-3) + var(--effect-animation-duration-short-1))\n  );\n  --ds-nav-disclosure-fade: var(\n    --_panel-nav-nested-child-fade-duration,\n    var(--ds-nav-disclosure-duration)\n  );\n  --ds-nav-disclosure-stagger: var(\n    --_panel-nav-nested-child-stagger,\n    var(--effect-animation-duration-short-1)\n  );\n}\n\n.panel-nav__children {\n  display: flex;\n  flex-direction: column;\n  gap: var(--dimension-space-050, 4px);\n  min-height: 0;\n  overflow: hidden;\n}\n\n/* Margin lives on the first child so closed 0fr accordions still collapse to 0. */\n.panel-nav__children > .panel-nav__child:first-child {\n  margin-block-start: 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.panel-nav__parent--muted {\n  color: var(--_nav-fg-secondary);\n}\n\n.panel-nav__child {\n  flex: 0 0 var(--_nav-item-height);\n  padding-inline-start: calc(\n    var(--dimension-space-075, 6px) + var(--dimension-iconography-md) + var(--dimension-space-050)\n  );\n}\n\n.panel-nav__children-accordion:not(.panel-nav__children-accordion--open) .panel-nav__child {\n  color: var(--_nav-fg-secondary);\n}\n\n.panel-nav__child-dot {\n  position: relative;\n  z-index: 2;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  flex: 0 0 var(--dimension-iconography-md);\n  width: var(--dimension-iconography-md);\n  height: var(--dimension-iconography-md);\n}\n\n.panel-nav__child--inactive {\n  color: var(--_nav-fg-tertiary);\n}\n\n.panel-nav__child--inactive::after {\n  display: none;\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.panel-nav--animating .panel-nav__children-accordion {\n  transition-duration: var(--_nav-expand-dur);\n  transition-delay: var(--effect-animation-duration-instant);\n}\n\n.panel-nav--animating .panel-nav__branch-divider {\n  transition-duration: var(--_nav-expand-dur), var(--_nav-expand-dur);\n  transition-delay:\n    var(--effect-animation-duration-instant), var(--effect-animation-duration-instant);\n}\n\n.panel-nav--collapsed:not(.panel-nav--animating) .panel-nav__children {\n  display: none;\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.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  derivePanelNavSelectionFromUrl,\n  firstEnabledPanelNavChild,\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 PanelNavChildItem,\n  type PanelNavChildSelectDetail,\n  type PanelNavGroup,\n  type PanelNavItem,\n  type PanelNavPresentation,\n  type PanelNavRouterMode,\n  type PanelNavUserActionDetail,\n} from './panel-nav-types';\nimport { PANEL_NAV_CHILD_MENU_PLACEMENT } from '../Menu/menu-placement';\nimport type { MenuItemData } from '../Menu/menu-types';\nimport { scrollEdgeFadeClassMap } from '../../utils/scroll-edge-fade';\nimport { prefersReducedMotion } from '../../utils/resolve-css-time-ms';\nimport { resolveSafeUrl } from '../../utils/safe-url';\n\ntype PanelNavRovingEntry =\n  | { kind: 'parent'; item: PanelNavItem }\n  | { kind: 'child'; parent: PanelNavItem; child: PanelNavChildItem };\n\nlet nextPanelNavInstanceId = 0;\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  private readonly instanceId = nextPanelNavInstanceId++;\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  /** Flat primary destinations, or nested child-route disclosure. */\n  @Prop({ reflect: true }) presentation: PanelNavPresentation = 'flat';\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  /** ID of the active child route when URL matching is unavailable. */\n  @Prop() activeChildId: 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  /** Account disclosure state. Expanded-derived styling is deprecated; use accountMenuSurfaceOpen for the rendered lifetime. */\n  @Prop() accountMenuExpanded: boolean = false;\n  /** External account surface is visible, including exit motion. Omission\n   * preserves the deprecated accountMenuExpanded-derived wash. */\n  @Prop() accountMenuSurfaceOpen: boolean | undefined;\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 a nested child route is selected. */\n  @Event() dsNavChildSelect!: EventEmitter<PanelNavChildSelectDetail>;\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 urlDerivedActiveChildId: string = '';\n  @State() private bodyScrollable = false;\n  @State() private expandedParentId: string = '';\n  @State() private inlineChildrenExpansionReady = true;\n  @State() private flyoutParentId: string = '';\n  @State() private flyoutOpen = false;\n  @State() private flyoutInitialFocusVisible = 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  private inlineChildrenExpansionFrame: number | null = null;\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 effectiveActiveChildId(): string {\n    return this.urlDerivedActiveChildId || this.activeChildId;\n  }\n\n  private get collapsedPresentation(): boolean {\n    return this.collapsed || this.viewportNarrow;\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.stageInlineChildrenExpansion(\n      prev && !next && !this.viewportNarrow && this.presentation === 'nested'\n    );\n    this.flyoutParentId = '';\n    this.flyoutOpen = false;\n    this.syncExpandedParent();\n    this.rovingIndex = this.getFirstRovingIndex();\n    this.startCollapseAnimation();\n  }\n\n  @Watch('viewportNarrow')\n  onViewportNarrowChange(next: boolean, prev: boolean | undefined) {\n    if (prev === undefined || !this.initialRenderComplete) return;\n    this.stageInlineChildrenExpansion(\n      prev && !next && !this.collapsed && this.presentation === 'nested'\n    );\n    this.flyoutParentId = '';\n    this.flyoutOpen = false;\n    if (next || this.rovingIndex > this.getVisibleRovingEntries().length) {\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    this.syncExpandedParent();\n  }\n\n  @Watch('presentation')\n  onPresentationChange() {\n    this.stageInlineChildrenExpansion(false);\n    this.flyoutParentId = '';\n    this.flyoutOpen = false;\n    this.syncExpandedParent();\n    this.rovingIndex = this.getFirstRovingIndex();\n  }\n\n  @Watch('activeId')\n  @Watch('activeChildId')\n  @Watch('urlDerivedActiveId')\n  @Watch('urlDerivedActiveChildId')\n  onActiveIdChange() {\n    this.syncExpandedParent();\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    this.scheduleInlineChildrenExpansion();\n  }\n\n  disconnectedCallback() {\n    this.disconnectResizeObserver();\n    this.disconnectScrollRegionObserver();\n    this.clearInlineChildrenExpansionFrame();\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    this.clearCollapseAnimationCompletion(panel);\n    this.transitionCompletionHandler = (e: TransitionEvent) => {\n      if (e.target === panel && (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        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 stageInlineChildrenExpansion(stage: boolean) {\n    this.clearInlineChildrenExpansionFrame();\n    this.inlineChildrenExpansionReady = !stage;\n  }\n\n  private scheduleInlineChildrenExpansion() {\n    if (this.inlineChildrenExpansionReady || this.collapsedPresentation) return;\n    this.clearInlineChildrenExpansionFrame();\n    this.inlineChildrenExpansionFrame = requestAnimationFrame(() => {\n      this.inlineChildrenExpansionFrame = null;\n      if (this.collapsedPresentation) return;\n\n      // Commit the newly mounted accordion's closed geometry before opening it.\n      // Without this read, the browser can insert it directly at 1fr and skip motion.\n      this.el.querySelector<HTMLElement>('.panel-nav__children-accordion')?.getBoundingClientRect();\n      this.inlineChildrenExpansionReady = true;\n    });\n  }\n\n  private clearInlineChildrenExpansionFrame() {\n    if (this.inlineChildrenExpansionFrame === null) return;\n    cancelAnimationFrame(this.inlineChildrenExpansionFrame);\n    this.inlineChildrenExpansionFrame = null;\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      this.urlDerivedActiveChildId = '';\n      return;\n    }\n    const selection = derivePanelNavSelectionFromUrl(this.currentUrl, this.getAllItems());\n    this.urlDerivedActiveId = selection.parentId;\n    this.urlDerivedActiveChildId = selection.childId;\n  }\n\n  private syncExpandedParent() {\n    const active = this.getAllItems().find(item => item.id === this.effectiveActiveId);\n    this.expandedParentId =\n      this.presentation === 'nested' && active?.children?.length ? active.id : '';\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 getVisibleRovingEntries(): PanelNavRovingEntry[] {\n    return this.getAllItems().flatMap<PanelNavRovingEntry>(item => {\n      const parent: PanelNavRovingEntry = { kind: 'parent', item };\n      if (\n        this.presentation !== 'nested' ||\n        this.collapsedPresentation ||\n        item.id !== this.expandedParentId ||\n        !item.children?.length\n      ) {\n        return [parent];\n      }\n      return [\n        parent,\n        ...item.children\n          .filter(child => !child.isInactive)\n          .map<PanelNavRovingEntry>(child => ({ kind: 'child', parent: item, child })),\n      ];\n    });\n  }\n\n  private getFirstRovingIndex(): number {\n    return this.viewportNarrow ? 1 : 0;\n  }\n\n  private getFooterRovingIndex(): number {\n    return 1 + this.getVisibleRovingEntries().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.getVisibleRovingEntries().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>(\n        '.panel-nav__body [data-panel-nav-roving]'\n      );\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, keyboard = false) {\n    const entries = this.getVisibleRovingEntries();\n    const itemCount = entries.length;\n    if (index === 0) {\n      this.handleToggle();\n      return;\n    }\n    if (index >= 1 && index <= itemCount) {\n      const entry = entries[index - 1];\n      if (!entry) return;\n      if (entry.kind === 'child') {\n        this.emitChildSelect(entry.parent, entry.child);\n      } else if (entry.item.children?.length) {\n        this.activateParent(entry.item, keyboard);\n      } else {\n        this.handleItemClick(entry.item.id);\n      }\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, true);\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 emitChildSelect(parent: PanelNavItem, child: PanelNavChildItem) {\n    if (child.isInactive) return;\n    this.dsNavChildSelect.emit({\n      parentId: parent.id,\n      childId: child.id,\n      href: child.href,\n    });\n  }\n\n  private followFlyoutAnchor(child: PanelNavChildItem) {\n    const href = resolveSafeUrl(child.href);\n    if (this.routerMode !== 'anchor' || !href) return;\n    const anchor = this.el.ownerDocument.createElement('a');\n    anchor.href = href;\n    anchor.hidden = true;\n    this.el.append(anchor);\n    anchor.click();\n    anchor.remove();\n  }\n\n  private activateParent(parent: PanelNavItem, keyboard = false) {\n    if (this.presentation === 'nested') {\n      this.expandedParentId = parent.id;\n      if (this.collapsedPresentation) {\n        if (this.flyoutParentId === parent.id && this.flyoutOpen) {\n          this.closeFlyout();\n          return;\n        }\n        this.flyoutInitialFocusVisible = keyboard;\n        this.flyoutParentId = parent.id;\n        this.flyoutOpen = true;\n        return;\n      }\n    }\n\n    const child = firstEnabledPanelNavChild(parent.children);\n    if (child) this.emitChildSelect(parent, child);\n  }\n\n  private parentAnchorId(parentId: string): string {\n    return `panel-nav-parent-${this.instanceId}-${parentId.replace(/[^a-zA-Z0-9_-]/g, '-')}`;\n  }\n\n  private childListId(parentId: string): string {\n    return `panel-nav-children-${this.instanceId}-${parentId.replace(/[^a-zA-Z0-9_-]/g, '-')}`;\n  }\n\n  private closeFlyout = () => {\n    this.flyoutOpen = false;\n    this.flyoutInitialFocusVisible = false;\n  };\n\n  private handleFlyoutAfterClose = () => {\n    if (!this.flyoutOpen) this.flyoutParentId = '';\n  };\n\n  private handleFlyoutSelect = (event: CustomEvent<MenuItemData>) => {\n    const parent = this.getAllItems().find(item => item.id === this.flyoutParentId);\n    const child = parent?.children?.find(item => item.id === event.detail?.value);\n    if (!parent || !child) return;\n    this.emitChildSelect(parent, child);\n    this.followFlyoutAnchor(child);\n    this.closeFlyout();\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-interaction-fill--surface-open':\n            this.accountMenuSurfaceOpen ?? 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 renderParentItem(item: PanelNavItem, rovingPosition: number, collapsed: boolean) {\n    const isActive = item.id === this.effectiveActiveId;\n    const hasChildRoutes = (item.children?.length ?? 0) > 0;\n    const disclosure = this.presentation === 'nested' && hasChildRoutes;\n    const expanded = disclosure\n      ? collapsed\n        ? this.flyoutParentId === item.id\n        : this.expandedParentId === item.id\n      : false;\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      id: disclosure ? this.parentAnchorId(item.id) : undefined,\n      class: {\n        'panel-nav__item': true,\n        'panel-nav__parent': disclosure,\n        'panel-nav__parent--expanded': expanded,\n        'panel-nav__parent--flyout-active': collapsed && this.flyoutParentId === item.id,\n        'ds-interaction-fill--surface-open': collapsed && this.flyoutParentId === item.id,\n        'panel-nav__parent--muted':\n          this.presentation === 'nested' &&\n          !collapsed &&\n          this.expandedParentId !== '' &&\n          this.expandedParentId !== item.id,\n        'panel-nav__item--active': isActive,\n        'ds-focus-ring-inset': true,\n        'ds-interaction-fill': true,\n      },\n      'aria-current': !disclosure && isActive ? ('page' as const) : undefined,\n      'aria-expanded': disclosure ? String(expanded) : undefined,\n      'aria-controls': disclosure && expanded ? this.childListId(item.id) : undefined,\n      'aria-haspopup': disclosure && collapsed ? ('menu' as const) : undefined,\n      'data-panel-nav-roving': '',\n      tabIndex: rovingPosition === this.rovingIndex ? 0 : -1,\n      onClick: (event: MouseEvent) =>\n        hasChildRoutes\n          ? this.activateParent(item, event.detail === 0)\n          : 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(\n      hasChildRoutes ? firstEnabledPanelNavChild(item.children)?.href : item.href\n    );\n    const useAnchor = this.routerMode === 'anchor' && href && !(disclosure && collapsed);\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  private renderChildItem(\n    parent: PanelNavItem,\n    child: PanelNavChildItem,\n    rovingPosition: number | undefined,\n    childIndex: number,\n    childReverseIndex: number\n  ) {\n    const isActive =\n      parent.id === this.effectiveActiveId && child.id === this.effectiveActiveChildId;\n    const inactive = child.isInactive === true;\n    const content = [\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        {child.label}\n      </ds-text>,\n      child.dot && (\n        <span class=\"panel-nav__child-dot\" aria-hidden=\"true\">\n          <ds-badge variant=\"dot\" label=\"\" />\n        </span>\n      ),\n    ];\n    const sharedProps = {\n      class: {\n        'panel-nav__item': true,\n        'panel-nav__child': true,\n        'ds-nav-disclosure__item': true,\n        'panel-nav__child--active': isActive,\n        'panel-nav__child--inactive': inactive,\n        'panel-nav__item--active': isActive,\n        'ds-focus-ring-inset': !inactive,\n        'ds-interaction-fill': !inactive,\n      },\n      'aria-current': isActive ? ('page' as const) : undefined,\n      'aria-disabled': inactive ? 'true' : undefined,\n      'data-panel-nav-roving': inactive || rovingPosition === undefined ? undefined : '',\n      style: {\n        '--_panel-nav-child-index': String(childIndex),\n        '--_panel-nav-child-reverse-index': String(childReverseIndex),\n        '--ds-nav-disclosure-index': String(childIndex),\n        '--ds-nav-disclosure-reverse-index': String(childReverseIndex),\n      },\n      tabIndex: !inactive && rovingPosition === this.rovingIndex ? 0 : -1,\n      onClick: () => this.emitChildSelect(parent, child),\n      onKeyDown: (event: KeyboardEvent) =>\n        rovingPosition === undefined ? undefined : this.handleRovingKeyDown(event, rovingPosition),\n      onFocus: () => {\n        if (rovingPosition !== undefined) this.rovingIndex = rovingPosition;\n      },\n    };\n    const href = resolveSafeUrl(child.href);\n    const useAnchor = !inactive && this.routerMode === 'anchor' && href;\n\n    return useAnchor ? (\n      <a {...sharedProps} href={href}>\n        {content}\n      </a>\n    ) : (\n      <button {...sharedProps} type=\"button\" disabled={inactive}>\n        {content}\n      </button>\n    );\n  }\n\n  private renderFlyout() {\n    const parent = this.getAllItems().find(item => item.id === this.flyoutParentId);\n    if (!parent?.children?.length) return null;\n    return (\n      <ds-menu\n        id={this.childListId(parent.id)}\n        open={this.flyoutOpen}\n        side={PANEL_NAV_CHILD_MENU_PLACEMENT.side}\n        align={PANEL_NAV_CHILD_MENU_PLACEMENT.align}\n        anchorAlignment={PANEL_NAV_CHILD_MENU_PLACEMENT.anchorAlignment}\n        sideOffset={PANEL_NAV_CHILD_MENU_PLACEMENT.sideOffset}\n        alignOffset={PANEL_NAV_CHILD_MENU_PLACEMENT.alignOffset}\n        anchorId={this.parentAnchorId(parent.id)}\n        selectionMode=\"single\"\n        menuLabel={`${parent.label} sections`}\n        initialFocusVisible={this.flyoutInitialFocusVisible}\n        sections={[\n          {\n            items: parent.children.map(child => ({\n              label: child.label,\n              value: child.id,\n              dot: child.dot,\n              isInactive: child.isInactive,\n              isSelected:\n                parent.id === this.effectiveActiveId && child.id === this.effectiveActiveChildId,\n            })),\n          },\n        ]}\n        onDsSelect={this.handleFlyoutSelect}\n        onDsClose={this.closeFlyout}\n        onDsAfterClose={this.handleFlyoutAfterClose}\n      />\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 rovingPosition = 1;\n                return this.parsedGroups.map(group => (\n                  <div class=\"panel-nav__group\" key={group.id ?? group.label}>\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, itemIndex) => {\n                      const parentPosition = rovingPosition++;\n                      const expanded =\n                        !collapsed &&\n                        this.inlineChildrenExpansionReady &&\n                        item.id === this.expandedParentId &&\n                        (item.children?.length ?? 0) > 0;\n                      const hasGroupSiblings = group.items.length > 1;\n                      const hasDividerBefore = hasGroupSiblings && itemIndex > 0;\n                      const hasDividerAfter =\n                        hasGroupSiblings && itemIndex < group.items.length - 1;\n                      const showBranchDividers = expanded && hasGroupSiblings;\n                      const hasInlineChildren =\n                        this.presentation === 'nested' &&\n                        (!collapsed || this.isAnimating) &&\n                        (item.children?.length ?? 0) > 0;\n                      const children = hasInlineChildren\n                        ? item.children?.map((child, childIndex) => {\n                            const childPosition =\n                              !expanded || child.isInactive ? undefined : rovingPosition++;\n                            return this.renderChildItem(\n                              item,\n                              child,\n                              childPosition,\n                              childIndex,\n                              (item.children?.length ?? 0) - childIndex - 1\n                            );\n                          })\n                        : null;\n                      return (\n                        <div class=\"panel-nav__branch\" key={item.id}>\n                          {hasDividerBefore ? (\n                            <div\n                              key={`${item.id}-divider-before`}\n                              class={{\n                                'panel-nav__branch-divider': true,\n                                'panel-nav__branch-divider--before': true,\n                                'panel-nav__branch-divider--open': showBranchDividers,\n                                'ds-nav-disclosure-divider': true,\n                                'ds-nav-disclosure-divider--open': showBranchDividers,\n                              }}\n                              aria-hidden=\"true\"\n                            >\n                              <div class=\"panel-nav__branch-divider-clip ds-nav-disclosure-divider__clip\">\n                                <span class=\"panel-nav__branch-divider-line\"></span>\n                              </div>\n                            </div>\n                          ) : null}\n                          {this.renderParentItem(item, parentPosition, collapsed)}\n                          {hasInlineChildren ? (\n                            <div\n                              key={`${item.id}-children`}\n                              class={{\n                                'panel-nav__children-accordion': true,\n                                'panel-nav__children-accordion--open': expanded,\n                                'ds-nav-disclosure': true,\n                                'ds-nav-disclosure--open': expanded,\n                              }}\n                              aria-hidden={expanded ? undefined : 'true'}\n                              inert={expanded ? undefined : true}\n                            >\n                              <div\n                                id={this.childListId(item.id)}\n                                class=\"panel-nav__children\"\n                                role=\"group\"\n                                aria-labelledby={this.parentAnchorId(item.id)}\n                              >\n                                {children}\n                              </div>\n                            </div>\n                          ) : null}\n                          {hasDividerAfter ? (\n                            <div\n                              key={`${item.id}-divider-after`}\n                              class={{\n                                'panel-nav__branch-divider': true,\n                                'panel-nav__branch-divider--after': true,\n                                'panel-nav__branch-divider--open': showBranchDividers,\n                                'ds-nav-disclosure-divider': true,\n                                'ds-nav-disclosure-divider--open': showBranchDividers,\n                              }}\n                              aria-hidden=\"true\"\n                            >\n                              <div class=\"panel-nav__branch-divider-clip ds-nav-disclosure-divider__clip\">\n                                <span class=\"panel-nav__branch-divider-line\"></span>\n                              </div>\n                            </div>\n                          ) : null}\n                        </div>\n                      );\n                    })}\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        {this.renderFlyout()}\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":"2jBAgHM,SAAUA,EAAuBC,GACrC,MAAMC,EAAQC,MAAMC,QAAQH,EAAKC,OAASD,EAAKC,MAAQ,CAACD,EAAKC,OAC7D,MAAMG,EAAmC,CACvC,mBAAoB,KACpB,iCAAkCJ,EAAKK,cAAgB,KACvD,2BAA4BL,EAAKM,SAAW,MAG9C,IAAK,MAAMC,KAAQN,EAAO,CACxBG,EAAQ,qBAAqBG,KAAU,I,CAGzC,MAAMC,MAAEA,GAAUR,EAClB,GAAIQ,IAAU,KAAM,CAClBJ,EAAQ,4BAA8B,I,MACjC,GAAII,UAAgBA,IAAU,SAAU,CAC7C,IAAK,MAAMD,KAAQN,EAAO,CACxB,GAAIO,EAAMD,GAAO,CACfH,EAAQ,qBAAqBG,aAAkB,I,GAKrD,OAAOH,CACT,CCnHO,MAAMK,EAAgC,CAC3CC,KAAM,QACNC,MAAO,MACPC,gBAAiB,cACjBC,WAAY,gEACZC,YAAa,GASR,MAAMC,EAAiC,CAC5CL,KAAM,QACNC,MAAO,QACPC,gBAAiB,cACjBC,WAAY,gEACZC,YAAa,GCpCR,MAAME,EAAsB,iBAE7B,SAAUC,EAAiBC,GAC/B,GAAIA,IAAS,aAAeA,IAAS,WAAY,OAAOA,EACxD,OAAOC,SACT,C,SAYgBC,EACdC,EACAC,EACAC,GAEA,MAAMC,EAAWP,EAAiBK,GAClC,GAAIE,EAAU,OAAOA,EAErB,MAAMC,SAGOC,WAAa,YAClBA,SAASC,gBAAgBC,aAAaZ,GACtC,KACR,MAAMa,EAAWZ,EAAiBQ,GAClC,GAAII,EAAU,OAAOA,EAErB,OAAOR,CACT,CAEM,SAAUS,EACdC,EACAC,GAEA,OAAOD,IAAkBC,CAC3B,CCPO,MAAMC,EAAgC,gCCvC7C,MAAMC,EAAoB,IAAM,i6ICAhC,MAAMC,EAAc,IAAM,6shCC8C1B,IAAIC,EAAyB,E,MAQhBC,EAAQC,EAAA,MAAAD,UAAAE,EANrB,WAAAC,CAAAC,G,qZAOmBC,KAAAC,WAAaP,IAGmBM,KAAAE,SAA2B,YAGpEF,KAAAG,sBAAiC,MAGjCH,KAAAI,OAAmC,KAGlBJ,KAAAK,aAAqC,OAKtDL,KAAAM,WAAiC,SAGjCN,KAAAO,SAAmB,GAGnBP,KAAAQ,cAAwB,GAIPR,KAAAS,UAAqB,MAGtCT,KAAAU,WAAqB,EAIrBV,KAAAW,WAAqB,GAKrBX,KAAAY,WAAqB,GAGrBZ,KAAAa,SAAmB,GAGnBb,KAAAc,YAAsB,GAEtBd,KAAAe,eAAyB,YACzBf,KAAAgB,cAAwB,WACxBhB,KAAAiB,aAAuB,UAEvBjB,KAAAkB,oBAA+B,MAI/BlB,KAAAmB,yBAAmC,uBACnCnB,KAAAoB,wBAAkC,sBAClCpB,KAAAqB,sBAAgC,oBAChCrB,KAAAsB,wBAAkC,sBAElCtB,KAAAuB,qBAA+B,mBA0BtBvB,KAAAX,cAAgC,YAChCW,KAAAwB,aAAgC,GAChCxB,KAAAyB,YAAc,MACdzB,KAAA0B,YAAsB,EACtB1B,KAAA2B,eAA0B,MAC1B3B,KAAA4B,mBAA6B,GAC7B5B,KAAA6B,wBAAkC,GAClC7B,KAAA8B,eAAiB,MACjB9B,KAAA+B,iBAA2B,GAC3B/B,KAAAgC,6BAA+B,KAC/BhC,KAAAiC,eAAyB,GACzBjC,KAAAkC,WAAa,MACblC,KAAAmC,0BAA4B,MAGrCnC,KAAAoC,wBAAyC,KAIzCpC,KAAAqC,sBAAwB,MACxBrC,KAAAsC,6BAA8C,KAG9CtC,KAAAuC,WAAa,MACbvC,KAAAwC,WAAa,EACbxC,KAAAyC,QAAU,MACVzC,KAAA0C,WAAa,EACb1C,KAAA2C,iBAAkC,KAIzB3C,KAAA4C,gBAAkB,MA4f3B5C,KAAA6C,YAAc,KACpB7C,KAAKkC,WAAa,MAClBlC,KAAKmC,0BAA4B,KAAK,EAGhCnC,KAAA8C,uBAAyB,KAC/B,IAAK9C,KAAKkC,WAAYlC,KAAKiC,eAAiB,EAAE,EAGxCjC,KAAA+C,mBAAsBC,IAC5B,MAAMC,EAASjD,KAAKkD,cAAcC,MAAKC,GAAQA,EAAKC,KAAOrD,KAAKiC,iBAChE,MAAMqB,EAAQL,GAAQM,UAAUJ,MAAKC,GAAQA,EAAKC,KAAOL,EAAMQ,QAAQC,QACvE,IAAKR,IAAWK,EAAO,OACvBtD,KAAK0D,gBAAgBT,EAAQK,GAC7BtD,KAAK2D,mBAAmBL,GACxBtD,KAAK6C,aAAa,CAwlBrB,CA7lCC,qBAAYe,GACV,OAAO5D,KAAK4B,oBAAsB5B,KAAKO,Q,CAGzC,0BAAYsD,GACV,OAAO7D,KAAK6B,yBAA2B7B,KAAKQ,a,CAG9C,yBAAYsD,GACV,OAAO9D,KAAKS,WAAaT,KAAK2B,c,CAGhC,kCAAYoC,GACV,OAAOC,EACLhE,KAAKG,sBACLH,KAAKiE,GAAG/E,aAAa,2B,CAKzB,iBAAAgF,CAAkBC,EAAeC,GAC/B,GAAIA,IAAS3F,YAAcuB,KAAKqC,sBAAuB,OACvDrC,KAAKqE,6BACHD,IAASD,IAASnE,KAAK2B,gBAAkB3B,KAAKK,eAAiB,UAEjEL,KAAKiC,eAAiB,GACtBjC,KAAKkC,WAAa,MAClBlC,KAAKsE,qBACLtE,KAAK0B,YAAc1B,KAAKuE,sBACxBvE,KAAKwE,wB,CAIP,sBAAAC,CAAuBN,EAAeC,GACpC,GAAIA,IAAS3F,YAAcuB,KAAKqC,sBAAuB,OACvDrC,KAAKqE,6BACHD,IAASD,IAASnE,KAAKS,WAAaT,KAAKK,eAAiB,UAE5DL,KAAKiC,eAAiB,GACtBjC,KAAKkC,WAAa,MAClB,GAAIiC,GAAQnE,KAAK0B,YAAc1B,KAAK0E,0BAA0BC,OAAQ,CACpE3E,KAAK0B,YAAc1B,KAAKuE,qB,CAE1BvE,KAAKwE,wB,CAIP,kBAAAI,GACE5E,KAAK6E,2BACL,GAAI7E,KAAK8E,sBAAwB,EAAG9E,KAAK+E,uB,CAI3C,cAAAC,CAAeC,GACbjF,KAAKwB,aAAe0D,EAAoBD,GACxCjF,KAAK0B,YAAc,EACnB1B,KAAKmF,oBACLnF,KAAKsE,oB,CAIP,oBAAAc,GACEpF,KAAKqE,6BAA6B,OAClCrE,KAAKiC,eAAiB,GACtBjC,KAAKkC,WAAa,MAClBlC,KAAKsE,qBACLtE,KAAK0B,YAAc1B,KAAKuE,qB,CAO1B,gBAAAc,GACErF,KAAKsE,oB,CAIP,kBAAAgB,GACEtF,KAAKmF,mB,CAIP,gBAAAI,CAAiBC,GACfxF,KAAKX,cAAgBmG,C,CAGvB,iBAAAC,GACEzF,KAAKX,cAAgBqG,EAAqB1F,KAAKE,SAAUF,KAAKiE,GAAG/E,aAAa,cAC9Ec,KAAK2B,eAAiB3B,KAAK2F,mBAC3B,GAAI3F,KAAKW,WAAY,CACnB,IACE,MAAMiF,EAASC,aAAaC,QAAQ9F,KAAKW,YACzC,GAAIiF,IAAW,KAAM5F,KAAKS,UAAYmF,IAAW,M,CACjD,M,EAIJ5F,KAAKgF,eAAehF,KAAKI,QACzBJ,KAAKmF,mB,CAGP,gBAAAY,GACE/F,KAAKgG,wBACLhG,KAAKiG,+BACL,GAAIjG,KAAK8E,sBAAwB,EAAG9E,KAAK+E,wBACzC/E,KAAKkG,8BACLlG,KAAKmG,uBACLnG,KAAKqC,sBAAwB,I,CAG/B,kBAAA+D,GACEpG,KAAKmG,uBACLnG,KAAKqG,iC,CAGP,oBAAAC,GACEtG,KAAK6E,2BACL7E,KAAKuG,iCACLvG,KAAKwG,oCACLxG,KAAKyG,iCACHzG,KAAKiE,GAAGyC,cAAc,eAExB1G,KAAK2G,wBACL,GAAI3G,KAAK4G,uBAAwB,CAC/BC,OAAOC,oBAAoB,YAAa9G,KAAK4G,uB,CAE/C,GAAI5G,KAAK+G,qBAAsB,CAC7BF,OAAOC,oBAAoB,UAAW9G,KAAK+G,qB,EAIvC,sBAAAvC,GACN,GAAIxE,KAAKyB,YAAa,OACtBzB,KAAKyB,YAAc,KACnBzB,KAAKgH,wBAAwBC,KAAK,CAAEC,OAAQ,cAC5C,MAAMC,EAAQnH,KAAKiE,GAAGyC,cAAc,cACpC1G,KAAKyG,iCAAiCU,GACtCnH,KAAKoH,4BAA+BC,IAClC,GAAIA,EAAEC,SAAWH,IAAUE,EAAEE,eAAiB,SAAWF,EAAEE,eAAiB,aAAc,CACxFvH,KAAKwH,wBAAwBL,E,GAGjCA,GAAOM,iBAAiB,gBAAiBzH,KAAKoH,6BAC9CD,GAAOM,iBAAiB,mBAAoBzH,KAAKoH,6BACjDM,uBAAsB,KACpBA,uBAAsB,KACpB,IAAK1H,KAAKyB,YAAa,OACvB,IAAK0F,EAAO,CACVnH,KAAKwH,wBAAwBL,GAC7B,M,CAGF,MAAMQ,EAAaC,EAA0BC,iBAAiBV,IAC9D,GAAIQ,GAAc,EAAG,CACnB3H,KAAKwH,wBAAwBL,GAC7B,M,CAEFnH,KAAKoC,wBAA0ByE,OAAOiB,YAAW,KAC/C9H,KAAKwH,wBAAwBL,EAAM,GAClCQ,EAAW,GACd,G,CAIE,4BAAAtD,CAA6B0D,GACnC/H,KAAKwG,oCACLxG,KAAKgC,8BAAgC+F,C,CAG/B,+BAAA1B,GACN,GAAIrG,KAAKgC,8BAAgChC,KAAK8D,sBAAuB,OACrE9D,KAAKwG,oCACLxG,KAAKsC,6BAA+BoF,uBAAsB,KACxD1H,KAAKsC,6BAA+B,KACpC,GAAItC,KAAK8D,sBAAuB,OAIhC9D,KAAKiE,GAAGyC,cAA2B,mCAAmCsB,wBACtEhI,KAAKgC,6BAA+B,IAAI,G,CAIpC,iCAAAwE,GACN,GAAIxG,KAAKsC,+BAAiC,KAAM,OAChD2F,qBAAqBjI,KAAKsC,8BAC1BtC,KAAKsC,6BAA+B,I,CAG9B,uBAAAkF,CAAwBL,GAC9B,MAAMe,EAAelI,KAAKyB,YAC1BzB,KAAKyG,iCAAiCU,GACtC,IAAKe,EAAc,OACnBlI,KAAKyB,YAAc,MACnBzB,KAAKmI,sBAAsBlB,KAAK,CAAEC,OAAQ,a,CAGpC,gCAAAT,CAAiCU,GACvC,GAAInH,KAAKoH,4BAA6B,CACpCD,GAAOL,oBAAoB,gBAAiB9G,KAAKoH,6BACjDD,GAAOL,oBAAoB,mBAAoB9G,KAAKoH,6BACpDpH,KAAKoH,4BAA8B3I,S,CAErC,GAAIuB,KAAKoC,0BAA4B,KAAM,CACzCyE,OAAOuB,aAAapI,KAAKoC,yBACzBpC,KAAKoC,wBAA0B,I,EAI3B,mBAAA0C,GACN,GAAI9E,KAAKU,WAAa,EAAG,OAAOV,KAAKU,WACrC,MAAM2H,EAAiBC,OAAOtI,KAAKiE,GAAG/E,aAAa,eAAiB,GACpE,OAAOoJ,OAAOC,SAASF,IAAmBA,EAAiB,EAAIA,EAAiB,C,CAG1E,gBAAA1C,GACN,MAAMjF,EAAaV,KAAK8E,sBACxB,cAAc+B,SAAW,aAAenG,EAAa,GAAKmG,OAAO2B,WAAa9H,C,CAGxE,qBAAAqE,GACN/E,KAAK2B,eAAiB3B,KAAK2F,mBAC3B3F,KAAKyI,eAAiB,IAAIC,gBAAe,KACvC1I,KAAK2B,eAAiB3B,KAAK2F,kBAAkB,IAE/C3F,KAAKyI,eAAeE,QAAQ3J,SAASC,gB,CAG/B,wBAAA4F,GACN7E,KAAKyI,gBAAgBG,aACrB5I,KAAKyI,eAAiBhK,S,CAGhB,2BAAAyH,GACNlG,KAAKuG,iCACL,IAAKvG,KAAK6I,eAAiBH,iBAAmB,YAAa,OAC3D1I,KAAK8I,qBAAuB,IAAIJ,gBAAe,IAAM1I,KAAKmG,yBAC1DnG,KAAK8I,qBAAqBH,QAAQ3I,KAAK6I,O,CAGjC,8BAAAtC,GACNvG,KAAK8I,sBAAsBF,aAC3B5I,KAAK8I,qBAAuBrK,S,CAGtB,oBAAA0H,GACN,MAAMhC,EAAO4E,QAAQ/I,KAAK6I,QAAU7I,KAAK6I,OAAOG,aAAehJ,KAAK6I,OAAOI,aAAe,GAC1F,GAAI9E,IAASnE,KAAK8B,eAAgB9B,KAAK8B,eAAiBqC,C,CAKlD,iBAAAgB,GACN,IAAKnF,KAAKY,WAAY,CACpBZ,KAAK4B,mBAAqB,GAC1B5B,KAAK6B,wBAA0B,GAC/B,M,CAEF,MAAMqH,EAAYC,EAA+BnJ,KAAKY,WAAYZ,KAAKkD,eACvElD,KAAK4B,mBAAqBsH,EAAUE,SACpCpJ,KAAK6B,wBAA0BqH,EAAUG,O,CAGnC,kBAAA/E,GACN,MAAMgF,EAAStJ,KAAKkD,cAAcC,MAAKC,GAAQA,EAAKC,KAAOrD,KAAK4D,oBAChE5D,KAAK+B,iBACH/B,KAAKK,eAAiB,UAAYiJ,GAAQ/F,UAAUoB,OAAS2E,EAAOjG,GAAK,E,CAIrE,qBAAA2C,GACN,GAAIuD,EAA0BvJ,KAAKX,cAAeW,KAAKE,UAAW,CAChEF,KAAKX,cAAgBW,KAAKE,Q,CAG5B,GAAIsJ,EAA2BxJ,KAAKwB,aAAcxB,KAAKI,QAAS,CAC9DJ,KAAKgF,eAAehF,KAAKI,O,MACpB,GAAIJ,KAAKY,WAAY,CAC1BZ,KAAKmF,mB,EAKD,4BAAAc,GACN,IAAIwD,EAAY9J,EAAS+J,sBACzB,MAAMC,EAAO,KACX3J,KAAKgG,wBACL,KAAMyD,EAAY,EAAG,CACnB/B,sBAAsBiC,E,GAG1BC,eAAeD,E,CAIT,WAAAE,CAAY1F,GAClB,GAAInE,KAAK2B,eAAgB,OACzB3B,KAAKS,UAAY0D,EACjB,GAAInE,KAAKW,WAAY,CACnB,IACEkF,aAAaiE,QAAQ9J,KAAKW,WAAYoJ,OAAO5F,G,CAC7C,M,EAIJnE,KAAKgK,YAAY/C,KAAK9C,E,CAGhB,WAAAjB,GACN,OAAOlD,KAAKwB,aAAayI,SAAQC,GAAKA,EAAEC,O,CAGlC,uBAAAzF,GACN,OAAO1E,KAAKkD,cAAc+G,SAA6B7G,IACrD,MAAMH,EAA8B,CAAEmH,KAAM,SAAUhH,QACtD,GACEpD,KAAKK,eAAiB,UACtBL,KAAK8D,uBACLV,EAAKC,KAAOrD,KAAK+B,mBAChBqB,EAAKG,UAAUoB,OAChB,CACA,MAAO,CAAC1B,E,CAEV,MAAO,CACLA,KACGG,EAAKG,SACL8G,QAAO/G,IAAUA,EAAMgH,aACvBC,KAAyBjH,IAAK,CAAO8G,KAAM,QAASnH,OAAQG,EAAME,YACtE,G,CAIG,mBAAAiB,GACN,OAAOvE,KAAK2B,eAAiB,EAAI,C,CAG3B,oBAAA6I,GACN,OAAO,EAAIxK,KAAK0E,0BAA0BC,M,CAGpC,kBAAA8F,GACN,OAAOzK,KAAKwK,uBAAyB,C,CAG/B,gBAAAE,CAAiBC,GACvB,MAAMC,EAAY5K,KAAK0E,0BAA0BC,OACjD,GAAIgG,IAAU,EAAG,CACf,OAAO3K,KAAK2B,eAAiB,KAAO3B,KAAKiE,GAAGyC,cAAc,yB,CAE5D,GAAIiE,GAAS,GAAKA,GAASC,EAAW,CACpC,MAAMT,EAAQnK,KAAKiE,GAAG4G,iBACpB,4CAEF,OAAOV,EAAMQ,EAAQ,IAAM,I,CAE7B,GAAIA,IAAU3K,KAAKwK,uBAAwB,CACzC,OAAOxK,KAAKiE,GAAGyC,cAAc,0C,CAE/B,GAAIiE,IAAU3K,KAAKyK,qBAAsB,CACvC,OAAOzK,KAAKiE,GAAGyC,cAAc,0B,CAE/B,OAAO,I,CAGD,aAAAoE,CAAcH,GACpB3K,KAAK0B,YAAciJ,EACnB3K,KAAK0K,iBAAiBC,IAAQI,MAAM,CAAEC,cAAe,M,CAG/C,mBAAAC,CAAoBN,EAAeO,EAAW,OACpD,MAAMC,EAAUnL,KAAK0E,0BACrB,MAAMkG,EAAYO,EAAQxG,OAC1B,GAAIgG,IAAU,EAAG,CACf3K,KAAKoL,eACL,M,CAEF,GAAIT,GAAS,GAAKA,GAASC,EAAW,CACpC,MAAMS,EAAQF,EAAQR,EAAQ,GAC9B,IAAKU,EAAO,OACZ,GAAIA,EAAMjB,OAAS,QAAS,CAC1BpK,KAAK0D,gBAAgB2H,EAAMpI,OAAQoI,EAAM/H,M,MACpC,GAAI+H,EAAMjI,KAAKG,UAAUoB,OAAQ,CACtC3E,KAAKsL,eAAeD,EAAMjI,KAAM8H,E,KAC3B,CACLlL,KAAKuL,gBAAgBF,EAAMjI,KAAKC,G,CAElC,M,CAEF,GAAIsH,IAAU3K,KAAKwK,uBAAwB,CACzCxK,KAAKwL,qBACL,M,CAEF,GAAIb,IAAU3K,KAAKyK,qBAAsB,CACvC,MAAMgB,EAASzL,KAAKiE,GAAGyC,cACrB,IAAInH,KAEN,GAAIkM,EACFzL,KAAK0L,gBAAgBzE,KAAK,CAAEwE,SAAQE,cAAe5N,G,EAIjD,mBAAA6N,CAAoBvE,EAAkBsD,GAC5C,GAAItD,EAAEwE,MAAQ,SAAWxE,EAAEwE,MAAQ,IAAK,CACtCxE,EAAEyE,iBACF9L,KAAKiL,oBAAoBN,EAAO,MAChC,M,CAGF,MAAMoB,EAAY/L,KAAKwK,uBACvB,MAAMwB,EAAUhM,KAAKyK,qBACrB,MAAMwB,EAAWjM,KAAKuE,sBACtB,IAAIJ,EAEJ,OAAQkD,EAAEwE,KACR,IAAK,YACH,GAAIlB,IAAUqB,EAAS,OACvB,GAAIrB,IAAUoB,EAAW5H,EAAO6H,OAC3B7H,EAAOwG,EAAQ,EACpB,MACF,IAAK,UACH,GAAIA,IAAUsB,EAAU,OACxB,GAAItB,IAAUqB,EAAS7H,EAAO4H,OACzB,GAAIpB,IAAUoB,EAAW5H,EAAO4H,EAAY,OAC5C5H,EAAOwG,EAAQ,EACpB,MACF,IAAK,aACH,GAAIA,IAAUoB,EAAW5H,EAAO6H,OAC3B,OACL,MACF,IAAK,YACH,GAAIrB,IAAUqB,EAAS7H,EAAO4H,OACzB,OACL,MACF,IAAK,OACH1E,EAAEyE,iBACF3H,EAAO8H,EACP,MACF,IAAK,MACH5E,EAAEyE,iBACF3H,EAAO6H,EACP,MACF,QACE,OAGJ,GAAI7H,IAAS1F,WAAa0F,IAASwG,EAAO,OAC1CtD,EAAEyE,iBACF9L,KAAK8K,cAAc3G,E,CAGb,eAAAoH,CAAgBlI,GACtBrD,KAAKkM,YAAYjF,KAAK5D,E,CAGhB,eAAAK,CAAgBT,EAAsBK,GAC5C,GAAIA,EAAMgH,WAAY,OACtBtK,KAAKmM,iBAAiBlF,KAAK,CACzBmC,SAAUnG,EAAOI,GACjBgG,QAAS/F,EAAMD,GACf+I,KAAM9I,EAAM8I,M,CAIR,kBAAAzI,CAAmBL,GACzB,MAAM8I,EAAOC,EAAe/I,EAAM8I,MAClC,GAAIpM,KAAKM,aAAe,WAAa8L,EAAM,OAC3C,MAAMX,EAASzL,KAAKiE,GAAGqI,cAAcC,cAAc,KACnDd,EAAOW,KAAOA,EACdX,EAAO7N,OAAS,KAChBoC,KAAKiE,GAAGuI,OAAOf,GACfA,EAAOgB,QACPhB,EAAOiB,Q,CAGD,cAAApB,CAAerI,EAAsBiI,EAAW,OACtD,GAAIlL,KAAKK,eAAiB,SAAU,CAClCL,KAAK+B,iBAAmBkB,EAAOI,GAC/B,GAAIrD,KAAK8D,sBAAuB,CAC9B,GAAI9D,KAAKiC,iBAAmBgB,EAAOI,IAAMrD,KAAKkC,WAAY,CACxDlC,KAAK6C,cACL,M,CAEF7C,KAAKmC,0BAA4B+I,EACjClL,KAAKiC,eAAiBgB,EAAOI,GAC7BrD,KAAKkC,WAAa,KAClB,M,EAIJ,MAAMoB,EAAQqJ,EAA0B1J,EAAOM,UAC/C,GAAID,EAAOtD,KAAK0D,gBAAgBT,EAAQK,E,CAGlC,cAAAsJ,CAAexD,GACrB,MAAO,oBAAoBpJ,KAAKC,cAAcmJ,EAASyD,QAAQ,kBAAmB,M,CAG5E,WAAAC,CAAY1D,GAClB,MAAO,sBAAsBpJ,KAAKC,cAAcmJ,EAASyD,QAAQ,kBAAmB,M,CAqB9E,YAAAzB,GACN,MAAMjH,EAAO4I,EAAsB/M,KAAKS,UAAWT,KAAK2B,gBACxD,GAAIwC,IAAS,KAAMnE,KAAK6J,YAAY1F,E,CAKtC,qBAAM6I,GACJhN,KAAKoL,c,CAGC,kBAAAI,GACNxL,KAAKiN,kBAAkBhG,M,CAGjB,gBAAAiG,CAAiB7F,GACvB,MAAMoE,EAASpE,EAAE8F,cACjBnN,KAAK0L,gBAAgBzE,KAAK,CAAEwE,SAAQE,cAAe5N,G,CAG7C,qBAAA4I,GACN,GAAI3G,KAAK2C,mBAAqB,KAAM,CAClCkE,OAAOuB,aAAapI,KAAK2C,kBACzB3C,KAAK2C,iBAAmB,I,EAIpB,4BAAAyK,GACNpN,KAAK2G,wBACL,GAAI0G,IAAwB,CAC1BrN,KAAK4C,gBAAkB,KACvB,M,CAEF5C,KAAK2C,iBAAmBkE,OAAOiB,YAAW,KACxC9H,KAAK4C,gBAAkB,KACvB5C,KAAK2C,iBAAmB,IAAI,GAC3B,I,CAGG,4BAAA2K,GACN,GAAItN,KAAKuC,WAAY,OACrBvC,KAAK2G,wBACL3G,KAAK4C,gBAAkB,K,CAGjB,2BAAA2K,CAA4BlG,GAClCA,EAAEyE,iBACFzE,EAAEmG,kBAEF,MAAMC,EAAezN,KAAKS,WAAaT,KAAK2B,eAC5C3B,KAAKuC,WAAa,KAClBvC,KAAKwC,WAAa6E,EAAEqG,QACpB1N,KAAKyC,QAAU,MACfzC,KAAK0C,WAAa,EAClB1C,KAAK2G,wBACL3G,KAAK4C,gBAAkB,MAEvB5D,SAAS2O,KAAKrO,MAAMsO,OAAS,YAC7B5O,SAAS2O,KAAKrO,MAAMuO,WAAa,OAEjC,MAAMC,EAAUC,IACd,MAAMC,EAASD,EAAGL,QAAU1N,KAAKwC,WACjCxC,KAAK0C,WAAauL,KAAKC,IAAIF,GAC3B,GAAIhO,KAAKyC,QAAS,OAClB,IAAKgL,GAAgBO,GAAS,EAAI,CAChChO,KAAK6J,YAAY,MACjB7J,KAAKyC,QAAU,I,MACV,GAAIgL,GAAgBO,EAAS,EAAG,CACrChO,KAAK6J,YAAY,OACjB7J,KAAKyC,QAAU,I,GAInB,MAAM0L,EAAO,KACX,IAAKnO,KAAKyC,SAAWzC,KAAK0C,WAAa,EAAG,CACxC1C,KAAK6J,aAAa4D,E,CAEpBzN,KAAKuC,WAAa,MAClBvC,KAAK4C,gBAAkB,MACvB5D,SAAS2O,KAAKrO,MAAMsO,OAAS,GAC7B5O,SAAS2O,KAAKrO,MAAMuO,WAAa,GACjChH,OAAOC,oBAAoB,YAAagH,GACxCjH,OAAOC,oBAAoB,UAAWqH,GACtCnO,KAAK4G,uBAAyBnI,UAC9BuB,KAAK+G,qBAAuBtI,SAAS,EAGvCuB,KAAK4G,uBAAyBkH,EAC9B9N,KAAK+G,qBAAuBoH,EAC5BtH,OAAOY,iBAAiB,YAAaqG,GACrCjH,OAAOY,iBAAiB,UAAW0G,E,CAG7B,kBAAAC,CAAmBC,GAEzB,MAAMC,EAAcD,EAAoBrO,KAAKgB,cAAgBhB,KAAKe,eAClE,OACEwN,EAAA,cAAYC,MAAOF,EAAatQ,KAAK,QAAQyQ,KAAK,MAChDF,EAAA,sBACEG,QAAQ,OACRC,MAAM,wBACNC,KAAMP,EAAoB,OAAS,YACnCQ,WAAY,MACZC,UAAW,MACXC,cAAe/O,KAAK0B,cAAgB1B,KAAKwK,uBAAyB,GAAI,EAAE,aAC5D8D,EACZU,UAAW,IAAMhP,KAAKwL,qBACtByD,UAAY5H,GAAqBrH,KAAK4L,oBAAoBvE,EAAGrH,KAAKwK,wBAClE0E,UAAW,KACTlP,KAAK0B,YAAc1B,KAAKwK,sBAAsB,I,CAOhD,gBAAA2E,CAAiB1O,EAAoBI,EAAkBC,GAG7D,MAAMsO,EAAW3O,EAAYT,KAAKiB,aAAe,GACjD,MAAMoO,EACJd,EAAA,UACEe,KAAK,SACLjM,GAAI9D,EACJoP,MAAO,CACL,kBAAmB,KACnB,yBAA0B,KAC1B,wCAAyC3O,KAAKkB,oBAC9C,oCACElB,KAAKuP,wBAA0BvP,KAAKkB,oBACtC,sBAAuB,KACvB,sBAAuB,MAEzBsO,SAAUxP,KAAK0B,cAAgB1B,KAAKyK,qBAAuB,GAAI,EAAE,aACrDzK,KAAKiB,aAAY,gBACf,OAAM,gBACL8I,OAAO/J,KAAKkB,qBAC3BuO,QAASpI,GAAKrH,KAAKkN,iBAAiB7F,GACpC4H,UAAY5H,GAAqBrH,KAAK4L,oBAAoBvE,EAAGrH,KAAKyK,sBAClEiF,QAAS,KACP1P,KAAK0B,YAAc1B,KAAKyK,oBAAoB,GAG9C8D,EAAA,WACEI,MAAM,+FACNgB,GAAG,OACHjB,QAAQ,mBACRkB,SAAQ,KACRC,MAAM,UACNC,eAAgB,GAEfjP,GAEH0N,EAAA,QAAMI,MAAM,mDAAkD,cAAa,QACzEJ,EAAA,QAAMI,MAAM,mCACVJ,EAAA,WAASwB,KAAK,gBAAgBtB,KAAK,KAAKoB,MAAM,aAEhDtB,EAAA,QAAMI,MAAM,oCACVJ,EAAA,WAASwB,KAAK,SAAStB,KAAK,KAAKoB,MAAM,YACvCtB,EAAA,WACEI,MAAM,0BACNgB,GAAG,OACHjB,QAAQ,eACRkB,SAAQ,KACR3R,MAAM,SACN4R,MAAM,WAEL/O,MAOX,OACEyN,EAAA,cAAYC,MAAOY,EAAUpR,KAAK,QAAQyQ,KAAK,MAC5CY,E,CAKC,gBAAAW,CAAiB5M,EAAoB6M,EAAwBxP,GACnE,MAAMyP,EAAW9M,EAAKC,KAAOrD,KAAK4D,kBAClC,MAAMuM,GAAkB/M,EAAKG,UAAUoB,QAAU,GAAK,EACtD,MAAMyL,EAAapQ,KAAKK,eAAiB,UAAY8P,EACrD,MAAME,EAAWD,EACb3P,EACET,KAAKiC,iBAAmBmB,EAAKC,GAC7BrD,KAAK+B,mBAAqBqB,EAAKC,GACjC,MAEJ,MAAMiN,EAAc,CAClB/B,EAAA,QAAMI,MAAM,wBACVJ,EAAA,WAASwB,KAAM3M,EAAKwL,KAAMH,KAAK,KAAKoB,MAAM,aAE5CtB,EAAA,WACEI,MAAM,kEACNgB,GAAG,OACHjB,QAAQ,mBACRkB,SAAUM,EACVL,MAAM,UACNC,eAAgB,GAEf1M,EAAKoL,OAERpL,EAAKmN,KACHhC,EAAA,QAAMI,MAAM,0BAAyB,cAAa,QAChDJ,EAAA,YAAUI,MAAM,sBAAsBD,QAAQ,MAAM8B,QAAS/P,EAAW+N,MAAM,OAKpF,MAAMiC,EAAc,CAClBpN,GAAI+M,EAAapQ,KAAK4M,eAAexJ,EAAKC,IAAM5E,UAChDkQ,MAAO,CACL,kBAAmB,KACnB,oBAAqByB,EACrB,8BAA+BC,EAC/B,mCAAoC5P,GAAaT,KAAKiC,iBAAmBmB,EAAKC,GAC9E,oCAAqC5C,GAAaT,KAAKiC,iBAAmBmB,EAAKC,GAC/E,2BACErD,KAAKK,eAAiB,WACrBI,GACDT,KAAK+B,mBAAqB,IAC1B/B,KAAK+B,mBAAqBqB,EAAKC,GACjC,0BAA2B6M,EAC3B,sBAAuB,KACvB,sBAAuB,MAEzB,gBAAiBE,GAAcF,EAAY,OAAmBzR,UAC9D,gBAAiB2R,EAAarG,OAAOsG,GAAY5R,UACjD,gBAAiB2R,GAAcC,EAAWrQ,KAAK8M,YAAY1J,EAAKC,IAAM5E,UACtE,gBAAiB2R,GAAc3P,EAAa,OAAmBhC,UAC/D,wBAAyB,GACzB+Q,SAAUS,IAAmBjQ,KAAK0B,YAAc,GAAI,EACpD+N,QAAUzM,GACRmN,EACInQ,KAAKsL,eAAelI,EAAMJ,EAAMQ,SAAW,GAC3CxD,KAAKuL,gBAAgBnI,EAAKC,IAChC4L,UAAY5H,GAAqBrH,KAAK4L,oBAAoBvE,EAAG4I,GAC7DP,QAAS,KACP1P,KAAK0B,YAAcuO,CAAc,GAIrC,MAAM7D,EAAOC,EACX8D,EAAiBxD,EAA0BvJ,EAAKG,WAAW6I,KAAOhJ,EAAKgJ,MAEzE,MAAMsE,EAAY1Q,KAAKM,aAAe,UAAY8L,KAAUgE,GAAc3P,GAC1E,MAAMkQ,EAAUD,EACdnC,EAAA,QAAOkC,EAAarE,KAAMA,GACvBkE,GAGH/B,EAAA,aAAYkC,EAAanB,KAAK,UAC3BgB,GAML,OACE/B,EAAA,cAAYC,MAAO/N,EAAY2C,EAAKoL,MAAQ,GAAIxQ,KAAK,QAAQyQ,KAAK,MAC/DkC,E,CAKC,eAAAC,CACN3N,EACAK,EACA2M,EACAY,EACAC,GAEA,MAAMZ,EACJjN,EAAOI,KAAOrD,KAAK4D,mBAAqBN,EAAMD,KAAOrD,KAAK6D,uBAC5D,MAAMkN,EAAWzN,EAAMgH,aAAe,KACtC,MAAM0G,EAAU,CACdzC,EAAA,WACEI,MAAM,kEACNgB,GAAG,OACHjB,QAAQ,mBACRkB,SAAUM,EACVL,MAAM,UACNC,eAAgB,GAEfxM,EAAMkL,OAETlL,EAAMiN,KACJhC,EAAA,QAAMI,MAAM,uBAAsB,cAAa,QAC7CJ,EAAA,YAAUG,QAAQ,MAAMF,MAAM,OAIpC,MAAMiC,EAAc,CAClB9B,MAAO,CACL,kBAAmB,KACnB,mBAAoB,KACpB,0BAA2B,KAC3B,2BAA4BuB,EAC5B,6BAA8Ba,EAC9B,0BAA2Bb,EAC3B,uBAAwBa,EACxB,uBAAwBA,GAE1B,eAAgBb,EAAY,OAAmBzR,UAC/C,gBAAiBsS,EAAW,OAAStS,UACrC,wBAAyBsS,GAAYd,IAAmBxR,UAAYA,UAAY,GAChFa,MAAO,CACL,2BAA4ByK,OAAO8G,GACnC,mCAAoC9G,OAAO+G,GAC3C,4BAA6B/G,OAAO8G,GACpC,oCAAqC9G,OAAO+G,IAE9CtB,UAAWuB,GAAYd,IAAmBjQ,KAAK0B,YAAc,GAAI,EACjE+N,QAAS,IAAMzP,KAAK0D,gBAAgBT,EAAQK,GAC5C2L,UAAYjM,GACViN,IAAmBxR,UAAYA,UAAYuB,KAAK4L,oBAAoB5I,EAAOiN,GAC7EP,QAAS,KACP,GAAIO,IAAmBxR,UAAWuB,KAAK0B,YAAcuO,CAAc,GAGvE,MAAM7D,EAAOC,EAAe/I,EAAM8I,MAClC,MAAMsE,GAAaK,GAAY/Q,KAAKM,aAAe,UAAY8L,EAE/D,OAAOsE,EACLnC,EAAA,QAAOkC,EAAarE,KAAMA,GACvB4E,GAGHzC,EAAA,aAAYkC,EAAanB,KAAK,SAAS2B,SAAUF,GAC9CC,E,CAKC,YAAAE,GACN,MAAMjO,EAASjD,KAAKkD,cAAcC,MAAKC,GAAQA,EAAKC,KAAOrD,KAAKiC,iBAChE,IAAKgB,GAAQM,UAAUoB,OAAQ,OAAO,KACtC,OACE4J,EAAA,WACElL,GAAIrD,KAAK8M,YAAY7J,EAAOI,IAC5B8N,KAAMnR,KAAKkC,WACXlE,KAAMK,EAA+BL,KACrCC,MAAOI,EAA+BJ,MACtCC,gBAAiBG,EAA+BH,gBAChDC,WAAYE,EAA+BF,WAC3CC,YAAaC,EAA+BD,YAC5CgT,SAAUpR,KAAK4M,eAAe3J,EAAOI,IACrCgO,cAAc,SACdC,UAAW,GAAGrO,EAAOuL,iBACrB+C,oBAAqBvR,KAAKmC,0BAC1BqP,SAAU,CACR,CACErH,MAAOlH,EAAOM,SAASgH,KAAIjH,IAAK,CAC9BkL,MAAOlL,EAAMkL,MACb/K,MAAOH,EAAMD,GACbkN,IAAKjN,EAAMiN,IACXjG,WAAYhH,EAAMgH,WAClBmH,WACExO,EAAOI,KAAOrD,KAAK4D,mBAAqBN,EAAMD,KAAOrD,KAAK6D,6BAIlE6N,WAAY1R,KAAK+C,mBACjB4O,UAAW3R,KAAK6C,YAChB+O,eAAgB5R,KAAK8C,wB,CAK3B,MAAA+O,GACE,MAAMC,EAAc9R,KAAKX,cACzB,MAAMgP,EAAoByD,IAAgB,YAC1C,MAAMC,EAAc/R,KAAKE,WAAa,YACtC,MAAMO,EAAYT,KAAKS,WAAaT,KAAK2B,eACzC,MAAMd,SAAEA,EAAQC,YAAEA,GAAgBd,KAElC,MAAMgS,EAAkC,CACtC,YAAa,KACb,iBAAkB,KAClB,uBAAwBD,EACxB,uBAAwBA,EACxB,uBAAwBtR,EACxB,+BAAgCT,KAAK2B,eACrC,uBAAwB3B,KAAKyB,aAG/B,OACE8M,EAAC0D,EAAI,CAAApG,IAAA,2CAACvM,MAAO,CAAE4S,QAAS,QAASC,SAAU,aACzC5D,EAAA,OAAA1C,IAAA,2CACE8C,MAAOqD,EAAM,aAEX3D,EAAoBrO,KAAKmB,yBAA2BnB,KAAKoB,yBAI3DmN,EAAA,OAAA1C,IAAA,2CAAK8C,MAAM,uDACTJ,EAAA,UAAA1C,IAAA,2CACEyD,KAAK,SACLX,MAAM,gEACNsC,SAAUjR,KAAK2B,eACf6N,UAAWxP,KAAK2B,gBAAkB3B,KAAK0B,cAAgB,EAAI,GAAI,EAC/D+N,QAAS,IAAMzP,KAAKoL,eACpB6D,UAAY5H,GAAqBrH,KAAK4L,oBAAoBvE,EAAG,GAC7DqI,QAAS,KACP1P,KAAK0B,YAAc,CAAC,EACrB,aACWjB,EAAYT,KAAKqB,sBAAwBrB,KAAKsB,wBAAuB,gBAClEb,EAAY,QAAU,QAGrC8N,EAAA,QAAA1C,IAAA,2CAAM8C,MAAM,yBAAwB,cAAa,QAC/CJ,EAAA,OAAA1C,IAAA,2CACE8C,MAAM,oBACNyD,QAAQ,YACRC,KAAK,OACLC,MAAM,6BACNC,UAAU,QAAO,cACL,QAEZhE,EAAA,QAAA1C,IAAA,2CACE2G,EAAE,qKACFH,KAAK,mBAKX9D,EAAA,QAAA1C,IAAA,2CAAM8C,MAAM,2BAA0B,cAAa,QACjDJ,EAAA,WAAA1C,IAAA,2CACEkE,KAAMtP,EAAY,cAAgB,gBAClCgO,KAAK,KACLoB,MAAM,eAOdtB,EAAA,OAAA1C,IAAA,2CACE8C,MAAO,CACL,kBAAmB,KACnB,mBAAoB,KACpB,sBAAuB,KACvB,sBAAuB,KACvB,gBAAiB3O,KAAK8B,kBACnBzE,EAAuB,CAAEE,MAAO,YAErCkV,IAAKC,IACH,MAAMvO,EAAQuO,GAA2BjU,UACzC,GAAI0F,IAASnE,KAAK6I,OAAQ,OAC1B7I,KAAK6I,OAAS1E,EACdnE,KAAKkG,6BAA6B,EAEpCyM,KAAM3S,KAAK8B,eAAiB,SAAWrD,UAAS,aACpCuB,KAAK8B,eAAiB9B,KAAKuB,qBAAuB9C,UAC9D+Q,SAAUxP,KAAK8B,eAAiB,EAAIrD,WAEpC8P,EAAA,OAAA1C,IAAA,2CAAK8C,MAAM,uBACR,MACC,IAAIsB,EAAiB,EACrB,OAAOjQ,KAAKwB,aAAa+I,KAAIqI,GAC3BrE,EAAA,OAAKI,MAAM,mBAAmB9C,IAAK+G,EAAMvP,IAAMuP,EAAMpE,OAClDoE,EAAMpE,OACLD,EAAA,WACEI,MAAM,wCACNgB,GAAG,OACHjB,QAAQ,eACRkB,SAAQ,KACRC,MAAM,WAEL+C,EAAMpE,OAGVoE,EAAMzI,MAAMI,KAAI,CAACnH,EAAMyP,KACtB,MAAMC,EAAiB7C,IACvB,MAAMI,GACH5P,GACDT,KAAKgC,8BACLoB,EAAKC,KAAOrD,KAAK+B,mBAChBqB,EAAKG,UAAUoB,QAAU,GAAK,EACjC,MAAMoO,EAAmBH,EAAMzI,MAAMxF,OAAS,EAC9C,MAAMqO,EAAmBD,GAAoBF,EAAY,EACzD,MAAMI,EACJF,GAAoBF,EAAYD,EAAMzI,MAAMxF,OAAS,EACvD,MAAMuO,EAAqB7C,GAAY0C,EACvC,MAAMI,EACJnT,KAAKK,eAAiB,YACpBI,GAAaT,KAAKyB,eACnB2B,EAAKG,UAAUoB,QAAU,GAAK,EACjC,MAAMpB,EAAW4P,EACb/P,EAAKG,UAAUgH,KAAI,CAACjH,EAAOuN,KACzB,MAAMuC,GACH/C,GAAY/M,EAAMgH,WAAa7L,UAAYwR,IAC9C,OAAOjQ,KAAK4Q,gBACVxN,EACAE,EACA8P,EACAvC,GACCzN,EAAKG,UAAUoB,QAAU,GAAKkM,EAAa,EAC7C,IAEH,KACJ,OACEtC,EAAA,OAAKI,MAAM,oBAAoB9C,IAAKzI,EAAKC,IACtC2P,EACCzE,EAAA,OACE1C,IAAK,GAAGzI,EAAKC,oBACbsL,MAAO,CACL,4BAA6B,KAC7B,oCAAqC,KACrC,kCAAmCuE,EACnC,4BAA6B,KAC7B,kCAAmCA,GACpC,cACW,QAEZ3E,EAAA,OAAKI,MAAM,kEACTJ,EAAA,QAAMI,MAAM,qCAGd,KACH3O,KAAKgQ,iBAAiB5M,EAAM0P,EAAgBrS,GAC5C0S,EACC5E,EAAA,OACE1C,IAAK,GAAGzI,EAAKC,cACbsL,MAAO,CACL,gCAAiC,KACjC,sCAAuC0B,EACvC,oBAAqB,KACrB,0BAA2BA,GAC5B,cACYA,EAAW5R,UAAY,OACpC4U,MAAOhD,EAAW5R,UAAY,MAE9B8P,EAAA,OACElL,GAAIrD,KAAK8M,YAAY1J,EAAKC,IAC1BsL,MAAM,sBACNgE,KAAK,QAAO,kBACK3S,KAAK4M,eAAexJ,EAAKC,KAEzCE,IAGH,KACH0P,EACC1E,EAAA,OACE1C,IAAK,GAAGzI,EAAKC,mBACbsL,MAAO,CACL,4BAA6B,KAC7B,mCAAoC,KACpC,kCAAmCuE,EACnC,4BAA6B,KAC7B,kCAAmCA,GACpC,cACW,QAEZ3E,EAAA,OAAKI,MAAM,kEACTJ,EAAA,QAAMI,MAAM,qCAGd,KACA,MAKf,EA5GA,KAiHLJ,EAAA,OAAA1C,IAAA,2CAAK8C,MAAM,qBACR3O,KAAKoO,mBAAmBC,GACxBrO,KAAKmP,iBAAiB1O,EAAWI,EAAUC,KAI/Cd,KAAKkR,gBAGJlR,KAAK2B,gBACL4M,EAAA,OAAA1C,IAAA,2CACE8C,MAAO,CACL,2BAA4B,KAC5B,oCAAqC3O,KAAK4C,iBAE5C0Q,aAAc,IAAMtT,KAAKoN,+BACzBmG,aAAc,IAAMvT,KAAKsN,+BACzBkG,YAAcnM,GAAkBrH,KAAKuN,4BAA4BlG,GAAE,cACvD,S,4iEA3lCE1H,EAAA+J,sBAAwB,E","ignoreList":[]}

package/dist/components/p-KBrC9IG4.js

@@ -1,2 +0,0 @@
-let n=0;function t(){n+=1;return`ds-table-column-customizer-${n}`}function e(n){return n.kind==="action"}function r(n){return n.header.trim()||n.headerLabel?.trim()||n.id}function o(n){return n.filter((n=>!e(n)))}function c(n,t){const e=o(n).map((n=>n.id));const r=new Set(e);const c=new Set;const u=[];for(const n of t??[]){if(!r.has(n)||c.has(n))continue;c.add(n);u.push(n)}for(const n of e){if(c.has(n))continue;u.push(n)}return u}function u(n,t){const e=o(n).map((n=>n.id));const r=new Set(e);const c=[...new Set((t??[]).filter((n=>r.has(n))))];if(e.length===0||c.length<e.length)return c;const u=e[0];return c.filter((n=>n!==u))}function s(n,t={}){if(!t.columnCustomizer)return n;const r=new Map(n.map((n=>[n.id,n])));const o=new Set(u(n,t.hiddenColumnIds));const s=c(n,t.columnOrder).map((n=>r.get(n))).filter((n=>!!n&&!o.has(n.id)));return[...s,...n.filter(e)]}function i(n,t,r){const c=n.find((n=>n.id===r));if(!c||e(c))return false;const s=new Set(u(n,t));if(s.has(r))return true;const i=o(n).filter((n=>!s.has(n.id)));return i.length>1}function f(n,t,e){const r=u(n,t);if(!i(n,r,e))return r;const o=new Set(r);if(o.has(e))o.delete(e);else o.add(e);return u(n,[...o])}function a(n,t,e){const o=new Map(n.map((n=>[n.id,n])));const s=u(n,t);const f=new Set(s);const a=c(n,e).flatMap((t=>{const e=o.get(t);if(!e)return[];return[{column:e,label:r(e),visible:!f.has(t),hideable:i(n,s,t),reorderable:true}]}));return a}function l(n,t,e){return a(n,t,e).map((n=>({label:n.label,value:n.column.id,showSwitch:true,switchValue:n.visible,isInactive:!n.hideable,reorderable:n.reorderable})))}export{f as a,s as b,u as c,e as i,t as n,c as r,l as t};
-//# sourceMappingURL=p-KBrC9IG4.js.map

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

@@ -1 +0,0 @@
-{"version":3,"names":["columnCustomizerSeq","nextTableColumnCustomizerElementId","isTableActionColumn","column","kind","tableColumnCustomizerLabel","header","trim","headerLabel","id","tableDataColumns","columns","filter","resolveTableColumnOrder","columnOrder","catalogIds","map","catalog","Set","seen","ordered","has","add","push","resolveTableHiddenColumnIds","hiddenColumnIds","dataIds","data","hidden","length","keep","resolveTableVisibleColumns","options","columnCustomizer","byId","Map","visibleData","get","canToggleTableColumnHidden","columnId","find","candidate","toggleTableColumnHidden","resolved","delete","tableColumnCustomizerItems","resolvedHidden","dataItems","flatMap","label","visible","hideable","reorderable","tableColumnCustomizerMenuItems","item","value","showSwitch","switchValue","isInactive"],"sources":["src/wc/components/Table/table-column-customizer.ts"],"sourcesContent":["import type { MenuItemData } from '../Menu/menu-types';\nimport type { TableColumn } from './table-types';\n\nlet columnCustomizerSeq = 0;\n\nexport function nextTableColumnCustomizerElementId(): string {\n  columnCustomizerSeq += 1;\n  return `ds-table-column-customizer-${columnCustomizerSeq}`;\n}\n\nexport function isTableActionColumn(column: TableColumn): boolean {\n  return column.kind === 'action';\n}\n\nexport function tableColumnCustomizerLabel(column: TableColumn): string {\n  return column.header.trim() || column.headerLabel?.trim() || column.id;\n}\n\nexport function tableDataColumns(columns: TableColumn[]): TableColumn[] {\n  return columns.filter(column => !isTableActionColumn(column));\n}\n\n/** Data-column ids in display order. Unknown, duplicate, and action ids are ignored. */\nexport function resolveTableColumnOrder(\n  columns: TableColumn[],\n  columnOrder: string[] | undefined\n): string[] {\n  const catalogIds = tableDataColumns(columns).map(column => column.id);\n  const catalog = new Set(catalogIds);\n  const seen = new Set<string>();\n  const ordered: string[] = [];\n\n  for (const id of columnOrder ?? []) {\n    if (!catalog.has(id) || seen.has(id)) continue;\n    seen.add(id);\n    ordered.push(id);\n  }\n\n  for (const id of catalogIds) {\n    if (seen.has(id)) continue;\n    ordered.push(id);\n  }\n\n  return ordered;\n}\n\n/**\n * Hidden data-column ids. Action and unknown ids are dropped. At least one data\n * column remains visible when the catalog has any data columns.\n */\nexport function resolveTableHiddenColumnIds(\n  columns: TableColumn[],\n  hiddenColumnIds: string[] | undefined\n): string[] {\n  const dataIds = tableDataColumns(columns).map(column => column.id);\n  const data = new Set(dataIds);\n  const hidden = [...new Set((hiddenColumnIds ?? []).filter(id => data.has(id)))];\n  if (dataIds.length === 0 || hidden.length < dataIds.length) return hidden;\n\n  const keep = dataIds[0];\n  return hidden.filter(id => id !== keep);\n}\n\nexport function resolveTableVisibleColumns(\n  columns: TableColumn[],\n  options: {\n    columnCustomizer?: boolean;\n    hiddenColumnIds?: string[];\n    columnOrder?: string[];\n  } = {}\n): TableColumn[] {\n  if (!options.columnCustomizer) return columns;\n\n  const byId = new Map(columns.map(column => [column.id, column]));\n  const hidden = new Set(resolveTableHiddenColumnIds(columns, options.hiddenColumnIds));\n  const visibleData = resolveTableColumnOrder(columns, options.columnOrder)\n    .map(id => byId.get(id))\n    .filter((column): column is TableColumn => !!column && !hidden.has(column.id));\n\n  return [...visibleData, ...columns.filter(isTableActionColumn)];\n}\n\nexport function canToggleTableColumnHidden(\n  columns: TableColumn[],\n  hiddenColumnIds: string[] | undefined,\n  columnId: string\n): boolean {\n  const column = columns.find(candidate => candidate.id === columnId);\n  if (!column || isTableActionColumn(column)) return false;\n\n  const hidden = new Set(resolveTableHiddenColumnIds(columns, hiddenColumnIds));\n  if (hidden.has(columnId)) return true;\n\n  const visibleData = tableDataColumns(columns).filter(candidate => !hidden.has(candidate.id));\n  return visibleData.length > 1;\n}\n\nexport function toggleTableColumnHidden(\n  columns: TableColumn[],\n  hiddenColumnIds: string[] | undefined,\n  columnId: string\n): string[] {\n  const resolved = resolveTableHiddenColumnIds(columns, hiddenColumnIds);\n  if (!canToggleTableColumnHidden(columns, resolved, columnId)) return resolved;\n\n  const hidden = new Set(resolved);\n  if (hidden.has(columnId)) hidden.delete(columnId);\n  else hidden.add(columnId);\n  return resolveTableHiddenColumnIds(columns, [...hidden]);\n}\n\nexport function moveTableColumnOrder(order: string[], fromId: string, toId: string): string[] {\n  const from = order.indexOf(fromId);\n  const to = order.indexOf(toId);\n  if (from < 0 || to < 0 || from === to) return order;\n\n  const next = [...order];\n  next.splice(from, 1);\n  next.splice(to, 0, fromId);\n  return next;\n}\n\nexport function moveTableColumnInOrder(\n  order: string[],\n  columnId: string,\n  offset: number\n): string[] {\n  const from = order.indexOf(columnId);\n  if (from < 0 || offset === 0) return order;\n  return moveTableColumnOrder(order, columnId, order[from + offset] ?? columnId);\n}\n\nexport interface TableColumnCustomizerItem {\n  column: TableColumn;\n  label: string;\n  visible: boolean;\n  hideable: boolean;\n  reorderable: boolean;\n}\n\nexport function tableColumnCustomizerItems(\n  columns: TableColumn[],\n  hiddenColumnIds: string[] | undefined,\n  columnOrder: string[] | undefined\n): TableColumnCustomizerItem[] {\n  const byId = new Map(columns.map(column => [column.id, column]));\n  const resolvedHidden = resolveTableHiddenColumnIds(columns, hiddenColumnIds);\n  const hidden = new Set(resolvedHidden);\n  const dataItems = resolveTableColumnOrder(columns, columnOrder).flatMap(id => {\n    const column = byId.get(id);\n    if (!column) return [];\n    return [\n      {\n        column,\n        label: tableColumnCustomizerLabel(column),\n        visible: !hidden.has(id),\n        hideable: canToggleTableColumnHidden(columns, resolvedHidden, id),\n        reorderable: true,\n      },\n    ];\n  });\n  return dataItems;\n}\n\n/** Menu switch rows for the table-owned column customizer. */\nexport function tableColumnCustomizerMenuItems(\n  columns: TableColumn[],\n  hiddenColumnIds: string[] | undefined,\n  columnOrder: string[] | undefined\n): MenuItemData[] {\n  return tableColumnCustomizerItems(columns, hiddenColumnIds, columnOrder).map(item => ({\n    label: item.label,\n    value: item.column.id,\n    showSwitch: true,\n    switchValue: item.visible,\n    isInactive: !item.hideable,\n    reorderable: item.reorderable,\n  }));\n}\n"],"mappings":"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","ignoreList":[]}

package/dist/components/p-MQ36mEgn.js

@@ -1,2 +0,0 @@
-import{p as e,H as o,c as i,h as s,a as t,t as r}from"./index.js";import{A as n,r as a}from"./p-B8ZonS3S.js";import{r as d,A as c}from"./p-etg-Uk1u.js";import{b as l,C as u}from"./p-CDJ2Ntcq.js";import{d as p}from"./p-DBwa1OXP.js";import{d as g}from"./p-BOhpMUwO.js";import{d as h}from"./p-Ds51RgCi.js";import{d as b}from"./p-C0CE2v5D.js";import{d as f}from"./p-Cea7rROU.js";import{d as v}from"./p-DkikNSSO.js";import{d as m}from"./p-0XTyQNRG.js";import{d as x}from"./p-BgLI9JoT.js";import{d as w}from"./p-CbSUyv5B.js";import{r as y}from"./p-CochmPyg.js";import{b as _,T as k,a as z}from"./p-CeXf9-X3.js";const C=()=>`.sc-ds-table-group-h,.sc-ds-table-group:where(.ds-table),.sc-ds-table-group:where(.tooltip-popup),.sc-ds-table-group:where(.ds-radius){--ds-radius-control:var(--dimension-radius-025);--ds-radius-card:var(--dimension-radius-050);--ds-radius-modal:var(--dimension-radius-050);--ds-radius-menu:var(--dimension-radius-075);--ds-radius-tooltip-control:var(--dimension-radius-025);--ds-radius-tooltip-menu:var(--dimension-radius-075);--ds-radius-table:var(--dimension-radius-050)}@media (forced-colors: active){.sc-ds-table-group:root,.sc-ds-table-group-h,.ds-forced-colors-scope.sc-ds-table-group{--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-table-group-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-table-group-h,.ds-focus-ring.sc-ds-table-group,.ds-focus-ring-inset.sc-ds-table-group-h,.ds-focus-ring-inset.sc-ds-table-group{outline:none;-webkit-tap-highlight-color:transparent;touch-action:manipulation}.ds-focus-ring.sc-ds-table-group-h:focus-visible,.ds-focus-ring.sc-ds-table-group: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-table-group-h,.ds-focus-ring.ds-focus-ring--visible.sc-ds-table-group{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-table-group-h:focus-visible,.ds-focus-ring-inset.sc-ds-table-group:focus-visible{outline:none}.ds-focus-ring-inset.sc-ds-table-group-h:focus-visible::after,.ds-focus-ring-inset.sc-ds-table-group: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-table-group-h,.ds-focus-ring-inset.ds-focus-ring--visible.sc-ds-table-group{outline:none}.ds-focus-ring-inset.ds-focus-ring--visible.sc-ds-table-group-h::after,.ds-focus-ring-inset.ds-focus-ring--visible.sc-ds-table-group::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-table-group-h{--ds-focus-ring-color:var(--ds-forced-color-selected)}}@media (forced-colors: active){.sc-ds-table-group:root,.sc-ds-table-group-h,.ds-forced-colors-scope.sc-ds-table-group{--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}}@media (forced-colors: active){.sc-ds-table-group:root,.sc-ds-table-group-h,.ds-forced-colors-scope.sc-ds-table-group{--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-table-group-h,.ds-interaction-fill.sc-ds-table-group{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-table-group-h::before,.ds-interaction-fill.sc-ds-table-group::before,.ds-interaction-fill.sc-ds-table-group-h::after,.ds-interaction-fill.sc-ds-table-group::after{content:'';position:absolute;inset:0;border-radius:inherit;background:transparent;pointer-events:none;cursor:inherit;transition:none}.ds-interaction-fill.sc-ds-table-group-h::before,.ds-interaction-fill.sc-ds-table-group::before{z-index:1}.ds-interaction-fill.sc-ds-table-group-h::after,.ds-interaction-fill.sc-ds-table-group::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-table-group-h,.ds-interaction-fill--bordered.sc-ds-table-group{--ds-interaction-border-width:var(--dimension-stroke-width-012);--ds-interaction-border-color:var(--color-border-secondary)}.ds-interaction-fill--selected.sc-ds-table-group-h::before,.ds-interaction-fill--selected.sc-ds-table-group::before{background:var(--ds-interaction-active)}.ds-interaction-fill--selected.sc-ds-table-group-h,.ds-interaction-fill--selected.sc-ds-table-group{--ds-interaction-dot-ring:var(--ds-interaction-active)}@media (hover: hover) and (pointer: fine){.ds-interaction-fill.sc-ds-table-group-h:hover:not(:disabled)::after,.ds-interaction-fill.sc-ds-table-group:hover:not(:disabled)::after{background:var(--ds-interaction-hover)}}.ds-interaction-fill.sc-ds-table-group-h:active:not(:disabled)::after,.ds-interaction-fill.sc-ds-table-group:active:not(:disabled)::after{background:var(--ds-interaction-pressed)}.ds-interaction-fill--grouped.sc-ds-table-group-h::after,.ds-interaction-fill--grouped.sc-ds-table-group::after,.ds-interaction-fill--grouped.sc-ds-table-group-h:active:not(:disabled)::after,.ds-interaction-fill--grouped.sc-ds-table-group:active:not(:disabled)::after{background:var(--ds-interaction-group-fill, transparent)}@media (hover: hover) and (pointer: fine){.ds-interaction-fill--grouped.sc-ds-table-group-h:hover:not(:disabled)::after,.ds-interaction-fill--grouped.sc-ds-table-group:hover:not(:disabled)::after{background:var(--ds-interaction-group-fill, transparent)}}.ds-interaction-fill--grouped.sc-ds-table-group-h,.ds-interaction-fill--grouped.sc-ds-table-group{--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-table-group-h>.ds-interaction-fill__content.sc-ds-table-group,.ds-interaction-fill.sc-ds-table-group>.ds-interaction-fill__content.sc-ds-table-group,.ds-interaction-fill__content.sc-ds-table-group{position:relative;z-index:2;cursor:inherit}.ds-interaction-fill--on-faint.sc-ds-table-group-h,.ds-interaction-fill--on-faint.sc-ds-table-group{--ds-interaction-active:var(--color-interaction-active)}.ds-interaction-fill--on-medium.sc-ds-table-group-h,.ds-interaction-fill--on-medium.sc-ds-table-group{--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-table-group-h,.ds-interaction-fill--on-bold.sc-ds-table-group{--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-table-group-h,.ds-interaction-fill--on-strong.sc-ds-table-group{--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-table-group-h,.ds-interaction-fill--on-translucent.sc-ds-table-group{--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-table-group-h,.ds-interaction-fill--on-inverted.sc-ds-table-group{--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-table-group-h,.ds-interaction-fill--on-media.sc-ds-table-group{--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-table-group-h,.ds-interaction-fill--on-always-dark.sc-ds-table-group{--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-table-group-h,.ds-interaction-fill--on-navigation.sc-ds-table-group{--ds-interaction-hover:var(--color-navigation-interaction-hover);--ds-interaction-pressed:var(--color-navigation-interaction-pressed);--ds-interaction-active:var(--color-navigation-interaction-active);--ds-focus-ring-color:var(--color-navigation-interaction-focus)}.ds-interaction-fill.ds-interaction-fill--surface-open.sc-ds-table-group-h:not(:disabled)::after,.ds-interaction-fill.ds-interaction-fill--surface-open.sc-ds-table-group:not(:disabled)::after{background:var(--ds-interaction-pressed)}@media (forced-colors: active){.ds-interaction-fill.sc-ds-table-group-h::after,.ds-interaction-fill.sc-ds-table-group::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--surface-open.sc-ds-table-group-h:not(:disabled):not(:focus-visible):not(:focus-within):not(.ds-focus-ring--visible)::after,.ds-interaction-fill--surface-open.sc-ds-table-group:not(:disabled):not(:focus-visible):not(:focus-within):not(.ds-focus-ring--visible)::after{outline:var(--dimension-stroke-width-025) dashed var(--ds-forced-color-control-boundary);outline-offset:calc(-1 * var(--dimension-stroke-width-025))}.ds-interaction-fill--selected.sc-ds-table-group-h::before,.ds-interaction-fill--selected.sc-ds-table-group::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-table-group-h:hover:not(:disabled):not(:focus-visible):not(:focus-within):not(.ds-focus-ring--visible)::after,.ds-interaction-fill.sc-ds-table-group: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)}}@media (forced-colors: active){.sc-ds-table-group:root,.sc-ds-table-group-h,.ds-forced-colors-scope.sc-ds-table-group{--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-control-inactive.sc-ds-table-group-h,.ds-control-inactive.sc-ds-table-group{opacity:var(--effect-opacity-medium);pointer-events:none;cursor:not-allowed}@media (forced-colors: active){.ds-control-inactive.sc-ds-table-group-h,.ds-control-inactive.sc-ds-table-group{color:var(--ds-forced-color-disabled);opacity:1}}.ds-control--lg.sc-ds-table-group,.ds-control--lg.sc-ds-table-group-h,.ds-control--md.sc-ds-table-group-h,.ds-control--md.sc-ds-table-group,.ds-control--sm.sc-ds-table-group-h,.ds-control--sm.sc-ds-table-group,.ds-control--xs.sc-ds-table-group-h,.ds-control--xs.sc-ds-table-group{--ds-control-radius:var(--ds-radius-control)}.ds-control--lg.sc-ds-table-group-h,.ds-control--lg.sc-ds-table-group{--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-table-group-h,.ds-control--md.sc-ds-table-group{--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-table-group-h,.ds-control--sm.sc-ds-table-group{--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-table-group-h,.ds-control--xs.sc-ds-table-group{--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-table-group-h,.ds-chrome-space--sm.sc-ds-table-group{--ds-chrome-padding:var(--dimension-space-050);--ds-chrome-gap:var(--dimension-space-050)}.ds-chrome-space--md.sc-ds-table-group-h,.ds-chrome-space--md.sc-ds-table-group{--ds-chrome-padding:var(--dimension-space-100);--ds-chrome-gap:var(--dimension-space-100)}.ds-chrome-space--lg.sc-ds-table-group-h,.ds-chrome-space--lg.sc-ds-table-group{--ds-chrome-padding:var(--dimension-space-200);--ds-chrome-gap:var(--dimension-space-200)}.ds-chrome-row.sc-ds-table-group-h,.ds-chrome-row.sc-ds-table-group,.ds-chrome-column.sc-ds-table-group-h,.ds-chrome-column.sc-ds-table-group,.ds-chrome-grid.sc-ds-table-group-h,.ds-chrome-grid.sc-ds-table-group{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-table-group-h,.ds-chrome-row.sc-ds-table-group{flex-direction:row;align-items:center}.ds-chrome-column.sc-ds-table-group-h,.ds-chrome-column.sc-ds-table-group{flex-direction:column}.ds-chrome-grid.sc-ds-table-group-h,.ds-chrome-grid.sc-ds-table-group{display:grid;align-items:center}.ds-control-frame.sc-ds-table-group{display:inline-flex;align-items:center;box-sizing:border-box;height:var(--ds-control-height, var(--dimension-size-400));padding-inline:var(--ds-control-padding-inline, var(--dimension-space-075));gap:var(--ds-control-gap, var(--dimension-space-050));border-radius:var(--ds-control-radius, var(--dimension-radius-025))}.ds-control-section-heading.sc-ds-table-group{display:flex;align-items:center;box-sizing:border-box;height:var(--ds-control-height, var(--dimension-size-400));padding-inline:calc(     var(--ds-control-padding-inline, var(--dimension-space-075)) +       var(--ds-control-label-inset, var(--dimension-space-025))   )}.ds-control-icon-box.sc-ds-table-group{display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;width:var(--ds-control-icon, var(--dimension-iconography-md));height:var(--ds-control-icon, var(--dimension-iconography-md))}.ds-control-label-box.sc-ds-table-group{min-width:0;padding-inline:var(--ds-control-label-inset, var(--dimension-space-025))}.ds-control-label-dot.sc-ds-table-group{position:relative;padding-inline-end:calc(     var(--ds-control-label-inset, var(--dimension-space-025)) +       var(--ds-control-gap, var(--dimension-space-050))   )}.ds-control-label-dot__badge.sc-ds-table-group{position:absolute;inset-block-start:0;inset-inline-end:0;pointer-events:none}.ds-empty-region.sc-ds-table-group{display:flex;flex:1 1 auto;align-items:center;justify-content:center;box-sizing:border-box;min-width:0;min-height:0}.ds-empty-region--padded.sc-ds-table-group{padding:var(--dimension-space-200)}.sc-ds-table-group:where(.ds-text-decoration,.ds-text-action).sc-ds-table-group{text-decoration-color:var(--ds-text-decoration-color, var(--color-foreground-tertiary));text-decoration-thickness:var(--ds-text-decoration-thickness, var(--dimension-stroke-width-012));text-underline-offset:var(--ds-text-decoration-offset, var(--dimension-space-025))}.ds-text-action.sc-ds-table-group{--ds-text-action-foreground:var(--color-foreground-bold-brand);--ds-text-decoration-color:var(--ds-text-action-foreground);color:var(--ds-text-action-foreground);text-decoration-line:none}.ds-text-action--on-medium.sc-ds-table-group{--ds-text-action-foreground:var(--color-foreground-on-medium-background-primary);--ds-text-decoration-color:var(--color-foreground-on-medium-background-secondary);text-decoration-line:underline}.ds-text-action--on-strong.sc-ds-table-group{--ds-text-action-foreground:var(--color-foreground-on-strong-background-primary);--ds-text-decoration-color:var(--color-foreground-on-strong-background-secondary);text-decoration-line:underline}.ds-text-action--on-bold.sc-ds-table-group{--ds-text-action-foreground:var(--color-foreground-on-bold-background-primary);--ds-text-decoration-color:var(--color-foreground-on-bold-background-secondary);text-decoration-line:underline}@media (hover: hover) and (pointer: fine){.ds-text-action.sc-ds-table-group:hover{text-decoration-line:underline}}@media (forced-colors: active){.ds-text-action.sc-ds-table-group{text-decoration-line:underline;text-decoration-color:currentcolor}}.ds-choice-popup.sc-ds-table-group{box-sizing:border-box;display:flex;flex-direction:column;min-width:var(--ds-choice-popup-min-inline-size, var(--dimension-menu-width-xs));max-width:min(var(--dimension-panel-width-lg), calc(100vw - var(--dimension-space-200)));max-height:calc(100vh - var(--dimension-space-200));overflow:hidden;inset:auto;margin:0;padding:0;border:0;background-color:var(--color-background-primary);border-radius:var(--ds-radius-menu);box-shadow:var(--effect-shadow-elevated-floating);color:var(--color-foreground-secondary);animation:dsChoiceFadeIn var(--effect-motion-short-2) forwards;backface-visibility:hidden;will-change:transform;text-align:start}.ds-choice-popup.sc-ds-table-group::after{content:'';position:absolute;inset:0;border-radius:inherit;pointer-events:none;box-shadow:var(--effect-highlight-elevated-floating)}.ds-choice-popup--closing.sc-ds-table-group{animation:dsChoiceFadeOut var(--effect-motion-short-2) forwards}@keyframes dsChoiceFadeIn{from{opacity:0;transform:inherit scale(0.97)}to{opacity:1}}@keyframes dsChoiceFadeOut{from{opacity:1}to{opacity:0}}@media (prefers-reduced-motion: reduce){.ds-choice-popup.sc-ds-table-group{animation:none;opacity:1}.ds-choice-popup--closing.sc-ds-table-group{opacity:0}}@media (forced-colors: active){.ds-choice-popup.sc-ds-table-group{outline:var(--dimension-stroke-width-012) solid var(--ds-forced-color-content);outline-offset:calc(-1 * var(--dimension-stroke-width-012))}.ds-choice-popup.sc-ds-table-group::after{box-shadow:none}}.ds-choice-list.sc-ds-table-group{display:flex;flex-direction:column;min-height:0;overflow-y:auto;overscroll-behavior:contain}.ds-choice-section--divided.sc-ds-table-group{border-bottom:var(--dimension-stroke-width-015) solid var(--color-border-tertiary)}ds-text.ds-choice-section__header.sc-ds-table-group{text-align:start;-webkit-user-select:none;user-select:none}.ds-choice-section--headed-after-first.sc-ds-table-group{margin-block-start:var(--dimension-space-050)}.select-option-row.sc-ds-table-group{display:flex;flex-direction:column;min-width:0}.ds-choice-item.sc-ds-table-group{width:100%;border:none;border-radius:var(--ds-control-radius, var(--dimension-radius-025));background:transparent;cursor:default;-webkit-user-select:none;user-select:none;text-align:left;color:inherit}.ds-choice-item.sc-ds-table-group:has(.ds-choice-item__subtext){height:auto;min-height:var(--ds-control-height, var(--dimension-size-400));padding-block:var(--ds-control-padding-inline, var(--dimension-space-075));align-items:flex-start}.ds-choice-item.ds-control--xs.sc-ds-table-group:has(.ds-choice-item__subtext){padding-block:0}.ds-choice-item__content.sc-ds-table-group{display:flex;flex:1;flex-direction:column;gap:var(--dimension-space-025);min-width:0}ds-text.ds-choice-item__label.sc-ds-table-group{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}ds-text.ds-choice-item__subtext.sc-ds-table-group{display:-webkit-box;overflow:hidden;white-space:normal;-webkit-box-orient:vertical;-webkit-line-clamp:2}.ds-choice-item__icon.sc-ds-table-group,.ds-choice-item__suffix.sc-ds-table-group{display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;width:var(--ds-control-icon, var(--dimension-iconography-md));height:var(--ds-control-icon, var(--dimension-iconography-md));pointer-events:none}.ds-choice-item.ds-interaction-fill--selected.sc-ds-table-group .ds-choice-item__icon.sc-ds-table-group{color:var(--color-foreground-primary)}.ds-choice-item__tag.sc-ds-table-group{flex-shrink:0;pointer-events:none}.ds-choice-empty.sc-ds-table-group,.ds-choice-loading.sc-ds-table-group{min-height:var(--dimension-size-600);padding:var(--dimension-space-100)}.ds-choice-footer.sc-ds-table-group{position:relative;box-sizing:border-box;padding-block:var(--dimension-space-050)}.ds-choice-footer.sc-ds-table-group::before{content:'';position:absolute;inset:0 0 auto;height:var(--dimension-stroke-width-012);background-color:var(--color-border-tertiary);pointer-events:none}.ds-choice-footer__content.sc-ds-table-group{display:flex;align-items:center;justify-content:space-between;column-gap:var(--dimension-space-050);box-sizing:border-box;height:var(--ds-control-height, var(--dimension-size-400))}.ds-choice-footer__summary.sc-ds-table-group,.ds-choice-footer__summary-measure.sc-ds-table-group,.ds-choice-footer__clear.sc-ds-table-group ds-text.sc-ds-table-group,.ds-choice-footer__action.sc-ds-table-group ds-text.sc-ds-table-group{padding-inline:calc(     var(--dimension-space-050) + var(--ds-control-padding-inline, var(--dimension-space-075)) +       var(--ds-control-label-inset, var(--dimension-space-025))   )}.ds-choice-footer__summary.sc-ds-table-group,.ds-choice-footer__summary-measure.sc-ds-table-group,.ds-choice-footer__clear.sc-ds-table-group,.ds-choice-footer__action.sc-ds-table-group{white-space:nowrap}.ds-choice-footer__summary-measure.sc-ds-table-group{position:absolute;visibility:hidden;pointer-events:none}.ds-choice-footer__clear.sc-ds-table-group,.ds-choice-footer__action.sc-ds-table-group{appearance:none;display:inline-flex;align-items:center;padding:0;border:0;border-radius:var(--dimension-radius-025);background:transparent;cursor:default}@media (forced-colors: active){.ds-choice-section--divided.sc-ds-table-group{border-bottom-color:var(--ds-forced-color-content)}.ds-choice-footer.sc-ds-table-group::before{background-color:var(--ds-forced-color-content)}}.ds-control-frame.sc-ds-table-group{display:inline-flex;align-items:center;box-sizing:border-box;height:var(--ds-control-height, var(--dimension-size-400));padding-inline:var(--ds-control-padding-inline, var(--dimension-space-075));gap:var(--ds-control-gap, var(--dimension-space-050));border-radius:var(--ds-control-radius, var(--dimension-radius-025))}.ds-control-section-heading.sc-ds-table-group{display:flex;align-items:center;box-sizing:border-box;height:var(--ds-control-height, var(--dimension-size-400));padding-inline:calc(     var(--ds-control-padding-inline, var(--dimension-space-075)) +       var(--ds-control-label-inset, var(--dimension-space-025))   )}.ds-control-icon-box.sc-ds-table-group{display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;width:var(--ds-control-icon, var(--dimension-iconography-md));height:var(--ds-control-icon, var(--dimension-iconography-md))}.ds-control-label-box.sc-ds-table-group{min-width:0;padding-inline:var(--ds-control-label-inset, var(--dimension-space-025))}.ds-control-label-dot.sc-ds-table-group{position:relative;padding-inline-end:calc(     var(--ds-control-label-inset, var(--dimension-space-025)) +       var(--ds-control-gap, var(--dimension-space-050))   )}.ds-control-label-dot__badge.sc-ds-table-group{position:absolute;inset-block-start:0;inset-inline-end:0;pointer-events:none}.ds-table-caption-control.sc-ds-table-group-h{--ds-choice-popup-min-inline-size:var(--dimension-menu-width-xs)}.ds-table-caption-control.ds-table-caption-control--compact.sc-ds-table-group-h{flex:0 0 auto;width:var(--ds-control-height, var(--dimension-size-400));height:var(--ds-control-height, var(--dimension-size-400));min-width:var(--ds-control-height, var(--dimension-size-400));min-height:var(--ds-control-height, var(--dimension-size-400));max-width:var(--ds-control-height, var(--dimension-size-400));inline-size:var(--ds-control-height, var(--dimension-size-400));min-inline-size:var(--ds-control-height, var(--dimension-size-400));max-inline-size:var(--ds-control-height, var(--dimension-size-400))}.ds-table-caption-control.ds-table-caption-control--compact.sc-ds-table-group-h .trigger.sc-ds-table-group{justify-content:center;inline-size:100%;min-inline-size:100%;height:100%;padding-inline:0}.ds-table-caption-control.ds-table-caption-control--compact.sc-ds-table-group-h .trigger--has-value.sc-ds-table-group:not(.trigger--label-placeholder){--ds-select-prefix-fg:var(--ds-select-fg-active)}@container ds-table (max-width: 899px){.sc-ds-table-group-h.ds-table-caption-control{flex:0 0 auto;inline-size:var(--ds-control-height, var(--dimension-size-400));min-inline-size:var(--ds-control-height, var(--dimension-size-400));max-inline-size:var(--ds-control-height, var(--dimension-size-400))}.sc-ds-table-group-h.ds-table-caption-control .trigger{justify-content:center;inline-size:100%;min-inline-size:100%;padding-inline:0}.sc-ds-table-group-h.ds-table-caption-control .trigger--has-value:not(.trigger--label-placeholder){--ds-select-prefix-fg:var(--ds-select-fg-active)}}.sc-ds-table-group-h{display:inline-flex;min-inline-size:0;max-inline-size:var(--dimension-menu-width-xs)}[hidden].sc-ds-table-group-h{display:none}.table-group__body.sc-ds-table-group{display:grid;grid-template-columns:var(--dimension-menu-width-xs) var(--dimension-menu-width-sm);min-height:calc(var(--dimension-size-800) * 4 + var(--dimension-space-150));max-height:calc(100vh - var(--dimension-size-800) - var(--dimension-size-600))}.table-group__data-pane.sc-ds-table-group,.table-group__order-pane.sc-ds-table-group{display:flex;min-width:0;min-height:0;flex-direction:column}.table-group__data-pane.sc-ds-table-group{border-inline-end:var(--dimension-stroke-width-012) solid var(--color-border-tertiary)}.table-group__list.sc-ds-table-group{flex:1 1 auto}.table-group__empty.sc-ds-table-group{flex:1 1 auto}.table-group__footer.sc-ds-table-group{flex:0 0 auto}.table-group__footer.sc-ds-table-group .ds-choice-footer__content.sc-ds-table-group{justify-content:flex-start}.table-group__footer[aria-hidden='true'].sc-ds-table-group::before{visibility:hidden}.table-group__footer[aria-hidden='true'].sc-ds-table-group .ds-choice-footer__content.sc-ds-table-group{visibility:hidden}@media (forced-colors: active){.table-group__data-pane.sc-ds-table-group{border-inline-end-color:var(--ds-forced-color-content)}}.table-preferences-embedded.sc-ds-table-group{display:flex;flex-direction:column;min-width:0;min-height:0;color:var(--color-foreground-secondary)}.sc-ds-table-group-h:has(.table-preferences-embedded){display:block;max-inline-size:none}.table-preferences-embedded.sc-ds-table-group .table-group__body.sc-ds-table-group{grid-template-columns:min(var(--dimension-menu-width-xs), 40%) minmax(0, 1fr)}.table-group-vertical.sc-ds-table-group-h .table-group__body.sc-ds-table-group{grid-template-columns:minmax(0, 1fr)}.table-group-vertical.sc-ds-table-group-h .table-group__data-pane.sc-ds-table-group{border-inline-end:0}.table-group-vertical.sc-ds-table-group-h .table-group__footer.sc-ds-table-group{display:none}`;const O=[{label:"Ascending",direction:"asc"},{label:"Descending",direction:"desc"}];let T=0;const j=e(class e extends o{constructor(e){super();if(e!==false){this.__registerHost()}this.dsGroupChange=i(this,"dsGroupChange",7);this.dsClear=i(this,"dsClear",7);this.dsOpenChange=i(this,"dsOpenChange",7);this.hasBorder=true;this.vertical=false;this.embedded=false;this.options=[];this.grouping=null;this.ariaLabel=null;this.open=false;this.emptyMessage="Select a group to choose its order.";this.clearLabel="Clear";this.shouldRender=false;this.closing=false;this.positionReady=false;this.pos={x:0,y:0};this.focusRingVisible=false;this.componentId=`ds-table-group-${++T}`;this.triggerId=`${this.componentId}-trigger`;this.popupId=`${this.componentId}-popup`;this.triggerElement=null;this.pendingInitialFocusVisible=false;this.closeTimer=null;this.position=new n({getAnchor:()=>this.triggerElement,getPopup:()=>this.el.querySelector(".table-group-popup"),getOwnerDocument:()=>this.el.ownerDocument,measure:(e,o)=>{if(!this.open)return null;const i=y(k.space050,k.space050);return{anchorRect:e.getBoundingClientRect(),popupWidth:o.offsetWidth||this.popupFallbackWidth,popupHeight:o.offsetHeight||this.popupFallbackHeight,side:"bottom",align:"end",sideOffsetPx:y(z.space050,k.space050),alignOffsetPx:d({align:"end",alignOffsetPx:0,sectionInsetPx:i}),viewportPadPx:y(k.space050,k.space050),viewportWidth:window.innerWidth,viewportHeight:window.innerHeight,collisionRect:a(e)}},apply:({x:e,y:o})=>{this.pos={x:e,y:o}},onReady:()=>{this.positionReady=true},liveUpdate:"double-frame",observeResize:true,topLayer:true});this.interaction=new c({getAnchor:()=>this.triggerElement,getPopup:()=>this.el.querySelector(".table-group-popup"),getOwnerDocument:()=>this.el.ownerDocument,onOutsideActivation:()=>this.close()})}componentDidLoad(){if(this.open)this.onOpenChange(true)}disconnectedCallback(){this.position.unobserve();this.interaction.disconnect();if(this.closeTimer)clearTimeout(this.closeTimer)}onOpenChange(e){if(this.embedded)return;if(e){this.teardown();this.shouldRender=true;this.closing=false;this.positionReady=false;this.focusRingVisible=this.pendingInitialFocusVisible;this.interaction.connect();this.position.observe();this.position.schedule((()=>this.focusInitialDataPoint()));return}if(!this.shouldRender)return;this.position.cancel();this.closing=true;this.interaction.disconnect();this.position.unobserve();const o=_(k.motionShort2,k.animationDurationShort3);if(o<=0)this.finishClose();else this.closeTimer=setTimeout((()=>this.finishClose()),o)}handleKeyDown(e){if(this.embedded&&(e.key==="Escape"||e.key==="Tab"))return;if(!this.shouldRender&&!this.embedded||this.closing)return;if(e.key==="Escape"){e.preventDefault();this.close();return}if(e.key!=="Tab"||!this.interaction.tabLeavesPopup(e))return;e.preventDefault();this.close(false);this.interaction.moveFocusAfterTab(e.shiftKey)}get popupFallbackWidth(){return y(k.menuWidthLg,k.menuWidthLg)}get popupFallbackHeight(){return y(k.menuFallbackHeight,k.menuFallbackHeight)}teardown(){this.position.unobserve();this.interaction.disconnect();if(this.closeTimer){clearTimeout(this.closeTimer);this.closeTimer=null}}toggle(e=false){if(this.open){this.close();return}this.pendingInitialFocusVisible=e;this.open=true;this.dsOpenChange.emit(true);this.onOpenChange(true)}close(e=true){if(e)this.interaction.focusAnchor();this.open=false;this.dsOpenChange.emit(false);this.onOpenChange(false)}finishClose(){const e=this.el.querySelector(".table-group-popup");if(e?.matches(":popover-open"))e.hidePopover();this.shouldRender=false;this.closing=false;this.closeTimer=null}focusInitialDataPoint(){requestAnimationFrame((()=>{const e=this.grouping?this.el.querySelector(`[data-group-value="${CSS.escape(this.grouping.columnId)}"] [role="option"]`):null;const o=e??this.el.querySelector('[data-group-value] [role="option"]:not([aria-disabled="true"])');o?.focus();this.pendingInitialFocusVisible=false}))}selectData(e){if(e.value==="__none__"){this.dsClear.emit();return}if(e.isInactive)return;if(this.grouping?.columnId===e.value){this.dsGroupChange.emit({...this.grouping});return}const o=e.orderOptions?.[0];this.dsGroupChange.emit({columnId:e.value,direction:o?.direction??"asc",...o?.orderBy?{orderBy:o.orderBy}:{}})}get activeOrderOptions(){const e=this.options.find((e=>e.value===this.grouping?.columnId))?.orderOptions;return e?.length?e:O}get selectedOrderIndex(){if(!this.grouping)return-1;const e=this.activeOrderOptions.findIndex((e=>e.direction===this.grouping?.direction&&e.orderBy===this.grouping?.orderBy));if(e>=0)return e;if(this.grouping.orderBy===undefined){return this.activeOrderOptions.findIndex((e=>e.direction===this.grouping?.direction))}return-1}selectOrder(e,o){if(!this.grouping||this.selectedOrderIndex===o)return;const i={columnId:this.grouping.columnId,direction:e.direction};if(e.orderBy)i.orderBy=e.orderBy;this.dsGroupChange.emit(i)}moveFocus(e,o,i,s){if(s&&(e.key==="ArrowLeft"||e.key==="ArrowRight")){e.preventDefault();this.focusRingVisible=true;this.el.querySelector(s)?.focus();return}if(!["ArrowDown","ArrowUp","Home","End"].includes(e.key))return;e.preventDefault();const t=Array.from(this.el.querySelectorAll(o)).filter((e=>e.getAttribute("aria-disabled")!=="true"));if(!t.length)return;let r;if(e.key==="Home")r=0;else if(e.key==="End")r=t.length-1;else r=(i+(e.key==="ArrowDown"?1:-1)+t.length)%t.length;this.focusRingVisible=true;t[r]?.focus()}renderDataOption(e,o){const i=e.value==="__none__"?!this.grouping:e.value===this.grouping?.columnId;return s(u,{id:`${this.componentId}-data-${o}`,option:{...e},selected:i,active:i,focusRingVisible:this.focusRingVisible,usesSubtext:Boolean(e.description),tabIndex:i||!this.grouping&&o===0?0:-1,onHover:()=>{this.focusRingVisible=false},onSelect:()=>this.selectData(e),onKeyDown:o=>{if(o.key==="Enter"||o.key===" "){o.preventDefault();this.selectData(e);return}this.moveFocus(o,'[data-group-value] [role="option"]',this.options.filter((e=>!e.isInactive)).findIndex((o=>o.value===e.value)),this.grouping?`[data-group-order-index="${this.selectedOrderIndex}"] [role="option"]`:undefined)}})}renderOrder(e,o){const i=o===this.selectedOrderIndex;return s(u,{id:`${this.componentId}-order-${o}`,option:{label:e.label,value:String(o)},selected:i,active:i,focusRingVisible:this.focusRingVisible,usesSubtext:false,tabIndex:i?0:-1,onHover:()=>{this.focusRingVisible=false},onSelect:()=>this.selectOrder(e,o),onKeyDown:i=>{if(i.key==="Enter"||i.key===" "){i.preventDefault();this.selectOrder(e,o);return}this.moveFocus(i,'[data-group-order-index] [role="option"]',o,`[data-group-value="${CSS.escape(this.grouping?.columnId??"")}"] [role="option"]`)}})}render(){const e=this.ariaLabel?.trim()||"Group table";const o={position:"fixed",left:"0",top:"0",transform:`translate(${Math.round(this.pos.x)}px, ${Math.round(this.pos.y)}px)`,zIndex:"9998",visibility:this.positionReady?"visible":"hidden"};return s(t,{key:"3b667692e91528c209c322a5ec1056d99e80d686",class:{"table-group-vertical":this.vertical},hidden:this.options.length===0?true:undefined},this.options.length&&!this.embedded?s("ds-button-unfilled",{hasBorder:this.hasBorder,ref:e=>{this.triggerElement=e??null},id:this.triggerId,variant:"icon-label",size:"md",icon:"SectionList",label:"Group",labelEmphasis:false,pressScale:false,"aria-label":e,haspopup:"dialog",collapseLabel:true,expanded:this.open,surfaceOpen:this.open||this.closing,controls:this.popupId,onDsClick:e=>this.toggle(e.detail.detail===0)}):null,this.shouldRender||this.embedded?s("div",{id:this.popupId,popover:this.embedded?undefined:"manual",class:{"table-group-popup":true,"ds-choice-popup":!this.embedded,"table-preferences-embedded":this.embedded,"ds-choice-popup--closing":this.closing},style:this.embedded?undefined:o,role:"dialog","aria-label":e},s("div",{class:"table-group__body"},s("div",{class:"table-group__data-pane"},s(l,{heading:"Data",ariaLabel:"Group data",className:"table-group__list"},this.vertical&&this.renderDataOption({label:"No grouping",value:"__none__"},-1),this.options.map(((e,o)=>s("div",{"data-group-value":e.value},this.renderDataOption(e,o))))),s("div",{hidden:this.vertical,class:"table-group__footer ds-choice-footer","aria-hidden":!this.grouping?"true":undefined},s("div",{class:"ds-choice-footer__content ds-control--md"},this.grouping?s("button",{class:"ds-choice-footer__clear ds-text-action ds-focus-ring",type:"button",onClick:()=>this.dsClear.emit()},s("ds-text",{as:"span",variant:"text-body-medium",color:"inherit"},this.clearLabel)):null))),s("div",{class:"table-group__order-pane"},this.grouping?s(l,{heading:"Order",ariaLabel:"Group order",className:"table-group__list"},this.activeOrderOptions.map(((e,o)=>s("div",{"data-group-order-index":o},this.renderOrder(e,o))))):s("div",{class:"table-group__empty ds-choice-empty ds-empty-region"},s("ds-empty-state",{body:this.emptyMessage}))))):null)}get el(){return this}static get watchers(){return{open:[{onOpenChange:0}]}}static get style(){return C()}},[2,"ds-table-group",{hasBorder:[4,"has-border"],vertical:[4],embedded:[4],options:[16],grouping:[16],ariaLabel:[1,"aria-label"],open:[1028],emptyMessage:[1,"empty-message"],clearLabel:[1,"clear-label"],shouldRender:[32],closing:[32],positionReady:[32],pos:[32],focusRingVisible:[32]},[[0,"keydown","handleKeyDown"]],{open:[{onOpenChange:0}]}]);function D(){if(typeof customElements==="undefined"){return}const e=["ds-table-group","ds-badge","ds-button-unfilled","ds-divider","ds-empty-state","ds-icon","ds-input","ds-loader","ds-text","ds-tooltip"];e.forEach((e=>{switch(e){case"ds-table-group":if(!customElements.get(r(e))){customElements.define(r(e),j)}break;case"ds-badge":if(!customElements.get(r(e))){p()}break;case"ds-button-unfilled":if(!customElements.get(r(e))){g()}break;case"ds-divider":if(!customElements.get(r(e))){h()}break;case"ds-empty-state":if(!customElements.get(r(e))){b()}break;case"ds-icon":if(!customElements.get(r(e))){f()}break;case"ds-input":if(!customElements.get(r(e))){v()}break;case"ds-loader":if(!customElements.get(r(e))){m()}break;case"ds-text":if(!customElements.get(r(e))){x()}break;case"ds-tooltip":if(!customElements.get(r(e))){w()}break}}))}D();export{j as T,D as d};
-//# sourceMappingURL=p-MQ36mEgn.js.map

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

@@ -1 +0,0 @@
-{"version":3,"names":["tableGroupCss","DEFAULT_ORDER_OPTIONS","label","direction","tableGroupSeq","TableGroup","__stencil_proxyCustomElement","HTMLElement","constructor","registerHost","this","hasBorder","vertical","embedded","options","grouping","ariaLabel","open","emptyMessage","clearLabel","shouldRender","closing","positionReady","pos","x","y","focusRingVisible","componentId","triggerId","popupId","triggerElement","pendingInitialFocusVisible","closeTimer","position","AnchoredPositionController","getAnchor","getPopup","el","querySelector","getOwnerDocument","ownerDocument","measure","anchor","popup","sectionInsetPx","resolveCssLengthPx","TOKEN_DEFAULTS","space050","anchorRect","getBoundingClientRect","popupWidth","offsetWidth","popupFallbackWidth","popupHeight","offsetHeight","popupFallbackHeight","side","align","sideOffsetPx","TOKEN_CSS_LENGTHS","alignOffsetPx","resolveChoicePopupAlignOffset","viewportPadPx","viewportWidth","window","innerWidth","viewportHeight","innerHeight","collisionRect","resolveAnchoredOverlayBoundaryRect","apply","onReady","liveUpdate","observeResize","topLayer","interaction","AnchoredOverlayInteractionController","onOutsideActivation","close","componentDidLoad","onOpenChange","disconnectedCallback","unobserve","disconnect","clearTimeout","isOpen","teardown","connect","observe","schedule","focusInitialDataPoint","cancel","duration","resolveMotionTimeMs","motionShort2","animationDurationShort3","finishClose","setTimeout","handleKeyDown","event","key","preventDefault","tabLeavesPopup","moveFocusAfterTab","shiftKey","menuWidthLg","menuFallbackHeight","toggle","fromKeyboard","dsOpenChange","emit","restoreFocus","focusAnchor","matches","hidePopover","requestAnimationFrame","selected","CSS","escape","columnId","initial","focus","selectData","option","value","dsClear","isInactive","dsGroupChange","initialOrder","orderOptions","orderBy","activeOrderOptions","configured","find","length","selectedOrderIndex","exact","findIndex","undefined","selectOrder","index","moveFocus","selector","currentIndex","oppositeSelector","includes","items","Array","from","querySelectorAll","filter","item","getAttribute","next","renderDataOption","h","ChoiceOptionRow","id","active","usesSubtext","Boolean","description","tabIndex","onHover","onSelect","onKeyDown","candidate","renderOrder","String","render","name","trim","popupStyle","left","top","transform","Math","round","zIndex","visibility","Host","class","hidden","ref","element","variant","size","icon","labelEmphasis","pressScale","haspopup","collapseLabel","expanded","surfaceOpen","controls","onDsClick","detail","popover","style","role","ChoiceListSection","heading","className","map","type","onClick","as","color","body"],"sources":["src/wc/components/TableGroup/TableGroup.css?tag=ds-table-group&encapsulation=scoped","src/wc/components/TableGroup/TableGroup.tsx"],"sourcesContent":["@import '../../utils/radius.css';\n@import '../../utils/choice-list.css';\n@import '../../utils/control-parts.css';\n@import '../../utils/table-caption-control.css';\n\n:host {\n  display: inline-flex;\n  min-inline-size: 0;\n  max-inline-size: var(--dimension-menu-width-xs);\n}\n\n:host([hidden]) {\n  display: none;\n}\n\n.table-group__body {\n  display: grid;\n  grid-template-columns: var(--dimension-menu-width-xs) var(--dimension-menu-width-sm);\n  min-height: calc(var(--dimension-size-800) * 4 + var(--dimension-space-150));\n  max-height: calc(100vh - var(--dimension-size-800) - var(--dimension-size-600));\n}\n\n.table-group__data-pane,\n.table-group__order-pane {\n  display: flex;\n  min-width: 0;\n  min-height: 0;\n  flex-direction: column;\n}\n\n.table-group__data-pane {\n  border-inline-end: var(--dimension-stroke-width-012) solid var(--color-border-tertiary);\n}\n\n.table-group__list {\n  flex: 1 1 auto;\n}\n\n.table-group__empty {\n  flex: 1 1 auto;\n}\n\n.table-group__footer {\n  flex: 0 0 auto;\n}\n\n.table-group__footer .ds-choice-footer__content {\n  justify-content: flex-start;\n}\n\n.table-group__footer[aria-hidden='true']::before {\n  visibility: hidden;\n}\n\n.table-group__footer[aria-hidden='true'] .ds-choice-footer__content {\n  visibility: hidden;\n}\n\n@media (forced-colors: active) {\n  .table-group__data-pane {\n    border-inline-end-color: var(--ds-forced-color-content);\n  }\n}\n\n.table-preferences-embedded {\n  display: flex;\n  flex-direction: column;\n  min-width: 0;\n  min-height: 0;\n  color: var(--color-foreground-secondary);\n}\n\n:host:has(.table-preferences-embedded) {\n  display: block;\n  max-inline-size: none;\n}\n.table-preferences-embedded .table-group__body {\n  grid-template-columns: min(var(--dimension-menu-width-xs), 40%) minmax(0, 1fr);\n}\n\n:host(.table-group-vertical) .table-group__body {\n  grid-template-columns: minmax(0, 1fr);\n}\n:host(.table-group-vertical) .table-group__data-pane {\n  border-inline-end: 0;\n}\n\n:host(.table-group-vertical) .table-group__footer {\n  display: none;\n}\n","import {\n  Component,\n  Element,\n  Event,\n  EventEmitter,\n  h,\n  Host,\n  Listen,\n  Prop,\n  State,\n  Watch,\n} from '@stencil/core';\nimport {\n  resolveChoicePopupAlignOffset,\n  resolveCssLengthPx,\n  resolveMotionTimeMs,\n  TOKEN_CSS_LENGTHS,\n  TOKEN_DEFAULTS,\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 { ChoiceListSection, ChoiceOptionRow } from '../../utils/choice-list-parts';\nimport type { TableGroupingState, TableSortDirection } from '../Table/table-types';\n\nexport interface TableGroupOrderOption {\n  label: string;\n  direction: TableSortDirection;\n  /** Optional application-owned data point used to order the group sections. */\n  orderBy?: string;\n}\n\nexport interface TableGroupOption {\n  label: string;\n  value: string;\n  description?: string;\n  isInactive?: boolean;\n  /** Product-owned order choices for this grouping data point. */\n  orderOptions?: TableGroupOrderOption[];\n}\n\nconst DEFAULT_ORDER_OPTIONS: TableGroupOrderOption[] = [\n  { label: 'Ascending', direction: 'asc' },\n  { label: 'Descending', direction: 'desc' },\n];\n\nlet tableGroupSeq = 0;\n\n@Component({\n  tag: 'ds-table-group',\n  styleUrl: 'TableGroup.css',\n  scoped: true,\n})\nexport class TableGroup {\n  @Element() private el!: HTMLElement;\n\n  /** Product-owned data points that may group the table. */\n  /** Render content inside a parent-owned surface; the parent owns dismissal and positioning. */\n  /** Show the trigger border. */\n  @Prop() hasBorder: boolean = true;\n  @Prop() vertical: boolean = false;\n  @Prop() embedded: boolean = false;\n  @Prop() options: TableGroupOption[] = [];\n  /** Controlled grouping field and the order of its group sections. */\n  @Prop() grouping: TableGroupingState | null = null;\n  /** Accessible name for the trigger and non-modal dialog. */\n  @Prop({ attribute: 'aria-label' }) ariaLabel: string | null = null;\n  /** Controlled popup visibility. */\n  @Prop({ mutable: true }) open = false;\n  /** Empty message kept in the order pane until a grouping data point is selected. */\n  @Prop() emptyMessage = 'Select a group to choose its order.';\n  /** Clear action label. */\n  @Prop() clearLabel = 'Clear';\n\n  /** Requests replacement of the complete controlled grouping state. */\n  @Event() dsGroupChange!: EventEmitter<TableGroupingState>;\n  /** Requests removal of the controlled grouping state. */\n  @Event() dsClear!: EventEmitter<void>;\n  /** Reports controlled popup visibility changes. */\n  @Event() dsOpenChange!: EventEmitter<boolean>;\n\n  @State() private shouldRender = false;\n  @State() private closing = false;\n  @State() private positionReady = false;\n  @State() private pos = { x: 0, y: 0 };\n  @State() private focusRingVisible = false;\n\n  private readonly componentId = `ds-table-group-${++tableGroupSeq}`;\n  private readonly triggerId = `${this.componentId}-trigger`;\n  private readonly popupId = `${this.componentId}-popup`;\n  private triggerElement: HTMLElement | null = null;\n  private pendingInitialFocusVisible = false;\n  private closeTimer: ReturnType<typeof setTimeout> | null = null;\n\n  private readonly position = new AnchoredPositionController({\n    getAnchor: () => this.triggerElement,\n    getPopup: () => this.el.querySelector<HTMLElement>('.table-group-popup'),\n    getOwnerDocument: () => this.el.ownerDocument,\n    measure: (anchor, popup) => {\n      if (!this.open) return null;\n      const sectionInsetPx = resolveCssLengthPx(TOKEN_DEFAULTS.space050, TOKEN_DEFAULTS.space050);\n      return {\n        anchorRect: anchor.getBoundingClientRect(),\n        popupWidth: popup.offsetWidth || this.popupFallbackWidth,\n        popupHeight: popup.offsetHeight || this.popupFallbackHeight,\n        side: 'bottom',\n        align: 'end',\n        sideOffsetPx: resolveCssLengthPx(TOKEN_CSS_LENGTHS.space050, TOKEN_DEFAULTS.space050),\n        alignOffsetPx: resolveChoicePopupAlignOffset({\n          align: 'end',\n          alignOffsetPx: 0,\n          sectionInsetPx,\n        }),\n        viewportPadPx: resolveCssLengthPx(TOKEN_DEFAULTS.space050, TOKEN_DEFAULTS.space050),\n        viewportWidth: window.innerWidth,\n        viewportHeight: window.innerHeight,\n        collisionRect: resolveAnchoredOverlayBoundaryRect(anchor),\n      };\n    },\n    apply: ({ x, y }) => {\n      this.pos = { x, y };\n    },\n    onReady: () => {\n      this.positionReady = true;\n    },\n    liveUpdate: 'double-frame',\n    observeResize: true,\n    topLayer: true,\n  });\n\n  private readonly interaction = new AnchoredOverlayInteractionController({\n    getAnchor: () => this.triggerElement,\n    getPopup: () => this.el.querySelector<HTMLElement>('.table-group-popup'),\n    getOwnerDocument: () => this.el.ownerDocument,\n    onOutsideActivation: () => this.close(),\n  });\n\n  componentDidLoad() {\n    if (this.open) this.onOpenChange(true);\n  }\n\n  disconnectedCallback() {\n    this.position.unobserve();\n    this.interaction.disconnect();\n    if (this.closeTimer) clearTimeout(this.closeTimer);\n  }\n\n  @Watch('open')\n  onOpenChange(isOpen: boolean) {\n    if (this.embedded) return;\n    if (isOpen) {\n      this.teardown();\n      this.shouldRender = true;\n      this.closing = false;\n      this.positionReady = false;\n      this.focusRingVisible = this.pendingInitialFocusVisible;\n      this.interaction.connect();\n      this.position.observe();\n      this.position.schedule(() => this.focusInitialDataPoint());\n      return;\n    }\n    if (!this.shouldRender) return;\n    this.position.cancel();\n    this.closing = true;\n    this.interaction.disconnect();\n    this.position.unobserve();\n    const duration = resolveMotionTimeMs(\n      TOKEN_DEFAULTS.motionShort2,\n      TOKEN_DEFAULTS.animationDurationShort3\n    );\n    if (duration <= 0) this.finishClose();\n    else this.closeTimer = setTimeout(() => this.finishClose(), duration);\n  }\n\n  @Listen('keydown')\n  handleKeyDown(event: KeyboardEvent) {\n    if (this.embedded && (event.key === 'Escape' || event.key === 'Tab')) return;\n    if ((!this.shouldRender && !this.embedded) || this.closing) return;\n    if (event.key === 'Escape') {\n      event.preventDefault();\n      this.close();\n      return;\n    }\n    if (event.key !== 'Tab' || !this.interaction.tabLeavesPopup(event)) return;\n    event.preventDefault();\n    this.close(false);\n    this.interaction.moveFocusAfterTab(event.shiftKey);\n  }\n\n  private get popupFallbackWidth(): number {\n    return resolveCssLengthPx(TOKEN_DEFAULTS.menuWidthLg, TOKEN_DEFAULTS.menuWidthLg);\n  }\n\n  private get popupFallbackHeight(): number {\n    return resolveCssLengthPx(TOKEN_DEFAULTS.menuFallbackHeight, TOKEN_DEFAULTS.menuFallbackHeight);\n  }\n\n  private teardown() {\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 toggle(fromKeyboard = false) {\n    if (this.open) {\n      this.close();\n      return;\n    }\n    this.pendingInitialFocusVisible = fromKeyboard;\n    this.open = true;\n    this.dsOpenChange.emit(true);\n    this.onOpenChange(true);\n  }\n\n  private close(restoreFocus = true) {\n    if (restoreFocus) this.interaction.focusAnchor();\n    this.open = false;\n    this.dsOpenChange.emit(false);\n    this.onOpenChange(false);\n  }\n\n  private finishClose() {\n    const popup = this.el.querySelector<HTMLElement>('.table-group-popup');\n    if (popup?.matches(':popover-open')) popup.hidePopover();\n    this.shouldRender = false;\n    this.closing = false;\n    this.closeTimer = null;\n  }\n\n  private focusInitialDataPoint() {\n    requestAnimationFrame(() => {\n      const selected = this.grouping\n        ? this.el.querySelector<HTMLElement>(\n            `[data-group-value=\"${CSS.escape(this.grouping.columnId)}\"] [role=\"option\"]`\n          )\n        : null;\n      const initial =\n        selected ??\n        this.el.querySelector<HTMLElement>(\n          '[data-group-value] [role=\"option\"]:not([aria-disabled=\"true\"])'\n        );\n      initial?.focus();\n      this.pendingInitialFocusVisible = false;\n    });\n  }\n\n  private selectData(option: TableGroupOption) {\n    if (option.value === '__none__') {\n      this.dsClear.emit();\n      return;\n    }\n    if (option.isInactive) return;\n    if (this.grouping?.columnId === option.value) {\n      this.dsGroupChange.emit({ ...this.grouping });\n      return;\n    }\n    const initialOrder = option.orderOptions?.[0];\n    this.dsGroupChange.emit({\n      columnId: option.value,\n      direction: initialOrder?.direction ?? 'asc',\n      ...(initialOrder?.orderBy ? { orderBy: initialOrder.orderBy } : {}),\n    });\n  }\n\n  private get activeOrderOptions(): TableGroupOrderOption[] {\n    const configured = this.options.find(\n      option => option.value === this.grouping?.columnId\n    )?.orderOptions;\n    return configured?.length ? configured : DEFAULT_ORDER_OPTIONS;\n  }\n\n  private get selectedOrderIndex(): number {\n    if (!this.grouping) return -1;\n    const exact = this.activeOrderOptions.findIndex(\n      option =>\n        option.direction === this.grouping?.direction && option.orderBy === this.grouping?.orderBy\n    );\n    if (exact >= 0) return exact;\n    if (this.grouping.orderBy === undefined) {\n      return this.activeOrderOptions.findIndex(\n        option => option.direction === this.grouping?.direction\n      );\n    }\n    return -1;\n  }\n\n  private selectOrder(option: TableGroupOrderOption, index: number) {\n    if (!this.grouping || this.selectedOrderIndex === index) return;\n    const grouping: TableGroupingState = {\n      columnId: this.grouping.columnId,\n      direction: option.direction,\n    };\n    if (option.orderBy) grouping.orderBy = option.orderBy;\n    this.dsGroupChange.emit(grouping);\n  }\n\n  private moveFocus(\n    event: KeyboardEvent,\n    selector: string,\n    currentIndex: number,\n    oppositeSelector?: string\n  ) {\n    if (oppositeSelector && (event.key === 'ArrowLeft' || event.key === 'ArrowRight')) {\n      event.preventDefault();\n      this.focusRingVisible = true;\n      this.el.querySelector<HTMLElement>(oppositeSelector)?.focus();\n      return;\n    }\n    if (!['ArrowDown', 'ArrowUp', 'Home', 'End'].includes(event.key)) return;\n    event.preventDefault();\n    const items = Array.from(this.el.querySelectorAll<HTMLElement>(selector)).filter(\n      item => item.getAttribute('aria-disabled') !== 'true'\n    );\n    if (!items.length) return;\n    let next: number;\n    if (event.key === 'Home') next = 0;\n    else if (event.key === 'End') next = items.length - 1;\n    else next = (currentIndex + (event.key === 'ArrowDown' ? 1 : -1) + items.length) % items.length;\n    this.focusRingVisible = true;\n    items[next]?.focus();\n  }\n\n  private renderDataOption(option: TableGroupOption, index: number) {\n    const selected =\n      option.value === '__none__' ? !this.grouping : option.value === this.grouping?.columnId;\n    return (\n      <ChoiceOptionRow\n        id={`${this.componentId}-data-${index}`}\n        option={{ ...option }}\n        selected={selected}\n        active={selected}\n        focusRingVisible={this.focusRingVisible}\n        usesSubtext={Boolean(option.description)}\n        tabIndex={selected || (!this.grouping && index === 0) ? 0 : -1}\n        onHover={() => {\n          this.focusRingVisible = false;\n        }}\n        onSelect={() => this.selectData(option)}\n        onKeyDown={(event: KeyboardEvent) => {\n          if (event.key === 'Enter' || event.key === ' ') {\n            event.preventDefault();\n            this.selectData(option);\n            return;\n          }\n          this.moveFocus(\n            event,\n            '[data-group-value] [role=\"option\"]',\n            this.options\n              .filter(candidate => !candidate.isInactive)\n              .findIndex(candidate => candidate.value === option.value),\n            this.grouping\n              ? `[data-group-order-index=\"${this.selectedOrderIndex}\"] [role=\"option\"]`\n              : undefined\n          );\n        }}\n      />\n    );\n  }\n\n  private renderOrder(option: TableGroupOrderOption, index: number) {\n    const selected = index === this.selectedOrderIndex;\n    return (\n      <ChoiceOptionRow\n        id={`${this.componentId}-order-${index}`}\n        option={{ label: option.label, value: String(index) }}\n        selected={selected}\n        active={selected}\n        focusRingVisible={this.focusRingVisible}\n        usesSubtext={false}\n        tabIndex={selected ? 0 : -1}\n        onHover={() => {\n          this.focusRingVisible = false;\n        }}\n        onSelect={() => this.selectOrder(option, index)}\n        onKeyDown={(event: KeyboardEvent) => {\n          if (event.key === 'Enter' || event.key === ' ') {\n            event.preventDefault();\n            this.selectOrder(option, index);\n            return;\n          }\n          this.moveFocus(\n            event,\n            '[data-group-order-index] [role=\"option\"]',\n            index,\n            `[data-group-value=\"${CSS.escape(this.grouping?.columnId ?? '')}\"] [role=\"option\"]`\n          );\n        }}\n      />\n    );\n  }\n\n  render() {\n    const name = this.ariaLabel?.trim() || 'Group table';\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    return (\n      <Host\n        class={{ 'table-group-vertical': this.vertical }}\n        hidden={this.options.length === 0 ? true : undefined}\n      >\n        {this.options.length && !this.embedded ? (\n          <ds-button-unfilled\n            hasBorder={this.hasBorder}\n            ref={element => {\n              this.triggerElement = (element as HTMLElement) ?? null;\n            }}\n            id={this.triggerId}\n            variant=\"icon-label\"\n            size=\"md\"\n            icon=\"SectionList\"\n            label=\"Group\"\n            labelEmphasis={false}\n            pressScale={false}\n            aria-label={name}\n            haspopup=\"dialog\"\n            collapseLabel={true}\n            expanded={this.open}\n            surfaceOpen={this.open || this.closing}\n            controls={this.popupId}\n            onDsClick={(event: CustomEvent<MouseEvent>) => this.toggle(event.detail.detail === 0)}\n          />\n        ) : null}\n\n        {this.shouldRender || this.embedded ? (\n          <div\n            id={this.popupId}\n            popover={this.embedded ? undefined : 'manual'}\n            class={{\n              'table-group-popup': true,\n              'ds-choice-popup': !this.embedded,\n              'table-preferences-embedded': this.embedded,\n              'ds-choice-popup--closing': this.closing,\n            }}\n            style={this.embedded ? undefined : popupStyle}\n            role=\"dialog\"\n            aria-label={name}\n          >\n            <div class=\"table-group__body\">\n              <div class=\"table-group__data-pane\">\n                <ChoiceListSection\n                  heading=\"Data\"\n                  ariaLabel=\"Group data\"\n                  className=\"table-group__list\"\n                >\n                  {this.vertical &&\n                    this.renderDataOption({ label: 'No grouping', value: '__none__' }, -1)}\n                  {this.options.map((option, index) => (\n                    <div data-group-value={option.value}>\n                      {this.renderDataOption(option, index)}\n                    </div>\n                  ))}\n                </ChoiceListSection>\n                <div\n                  hidden={this.vertical}\n                  class=\"table-group__footer ds-choice-footer\"\n                  aria-hidden={!this.grouping ? 'true' : undefined}\n                >\n                  <div class=\"ds-choice-footer__content ds-control--md\">\n                    {this.grouping ? (\n                      <button\n                        class=\"ds-choice-footer__clear ds-text-action ds-focus-ring\"\n                        type=\"button\"\n                        onClick={() => this.dsClear.emit()}\n                      >\n                        <ds-text as=\"span\" variant=\"text-body-medium\" color=\"inherit\">\n                          {this.clearLabel}\n                        </ds-text>\n                      </button>\n                    ) : null}\n                  </div>\n                </div>\n              </div>\n\n              <div class=\"table-group__order-pane\">\n                {this.grouping ? (\n                  <ChoiceListSection\n                    heading=\"Order\"\n                    ariaLabel=\"Group order\"\n                    className=\"table-group__list\"\n                  >\n                    {this.activeOrderOptions.map((option, index) => (\n                      <div data-group-order-index={index}>{this.renderOrder(option, index)}</div>\n                    ))}\n                  </ChoiceListSection>\n                ) : (\n                  <div class=\"table-group__empty ds-choice-empty ds-empty-region\">\n                    <ds-empty-state body={this.emptyMessage} />\n                  </div>\n                )}\n              </div>\n            </div>\n          </div>\n        ) : null}\n      </Host>\n    );\n  }\n}\n"],"mappings":"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","ignoreList":[]}

package/dist/components/p-TjXGRPik.js

@@ -1,2 +0,0 @@
-import{p as s,H as e,c as i,h as t,a,t as r}from"./index.js";import{g as n,i as o}from"./p-BQq26pt9.js";import{C as d,c,a as l,b as h,t as b,v,e as u,f,r as p,d as m}from"./p-BxduVc5g.js";import{d as g}from"./p-DBwa1OXP.js";import{d as _}from"./p-BOhpMUwO.js";import{d as y}from"./p-Cea7rROU.js";import{d as w}from"./p-0XTyQNRG.js";import{d as x}from"./p-CQIh2yRP.js";import{d as k}from"./p-BV5T1hzN.js";import{d as T}from"./p-tNQ0YulU.js";import{d as C}from"./p-ji09W9el.js";import{d as O}from"./p-BgLI9JoT.js";import{d as S}from"./p-CbSUyv5B.js";function E(s,e,i){if(!s||!e){return{value:"",hideTabs:false}}if(s!==e&&!s.startsWith(`${e}/`)){return{value:"",hideTabs:false}}const t=s.slice(e.length);const a=t.startsWith("/")?t.slice(1).split("/")[0]:"";const r=n(i);if(!a){return{value:r[0]?.id??"",hideTabs:false}}const o=r.find((s=>s.id===a));if(o){return{value:o.id,hideTabs:false}}return{value:"",hideTabs:true}}function F(s,e){return s.length===0&&(e?.length??0)>0}const j=()=>`.sc-ds-bar-nav-h,.sc-ds-bar-nav:where(.ds-table),.sc-ds-bar-nav:where(.tooltip-popup),.sc-ds-bar-nav:where(.ds-radius){--ds-radius-control:var(--dimension-radius-025);--ds-radius-card:var(--dimension-radius-050);--ds-radius-modal:var(--dimension-radius-050);--ds-radius-menu:var(--dimension-radius-075);--ds-radius-tooltip-control:var(--dimension-radius-025);--ds-radius-tooltip-menu:var(--dimension-radius-075);--ds-radius-table:var(--dimension-radius-050)}.ds-control--lg.sc-ds-bar-nav,.ds-control--lg.sc-ds-bar-nav-h,.ds-control--md.sc-ds-bar-nav-h,.ds-control--md.sc-ds-bar-nav,.ds-control--sm.sc-ds-bar-nav-h,.ds-control--sm.sc-ds-bar-nav,.ds-control--xs.sc-ds-bar-nav-h,.ds-control--xs.sc-ds-bar-nav{--ds-control-radius:var(--ds-radius-control)}.ds-control--lg.sc-ds-bar-nav-h,.ds-control--lg.sc-ds-bar-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-bar-nav-h,.ds-control--md.sc-ds-bar-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-bar-nav-h,.ds-control--sm.sc-ds-bar-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-bar-nav-h,.ds-control--xs.sc-ds-bar-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-control-frame.sc-ds-bar-nav{display:inline-flex;align-items:center;box-sizing:border-box;height:var(--ds-control-height, var(--dimension-size-400));padding-inline:var(--ds-control-padding-inline, var(--dimension-space-075));gap:var(--ds-control-gap, var(--dimension-space-050));border-radius:var(--ds-control-radius, var(--dimension-radius-025))}.ds-control-section-heading.sc-ds-bar-nav{display:flex;align-items:center;box-sizing:border-box;height:var(--ds-control-height, var(--dimension-size-400));padding-inline:calc(     var(--ds-control-padding-inline, var(--dimension-space-075)) +       var(--ds-control-label-inset, var(--dimension-space-025))   )}.ds-control-icon-box.sc-ds-bar-nav{display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;width:var(--ds-control-icon, var(--dimension-iconography-md));height:var(--ds-control-icon, var(--dimension-iconography-md))}.ds-control-label-box.sc-ds-bar-nav{min-width:0;padding-inline:var(--ds-control-label-inset, var(--dimension-space-025))}.ds-control-label-dot.sc-ds-bar-nav{position:relative;padding-inline-end:calc(     var(--ds-control-label-inset, var(--dimension-space-025)) +       var(--ds-control-gap, var(--dimension-space-050))   )}.ds-control-label-dot__badge.sc-ds-bar-nav{position:absolute;inset-block-start:0;inset-inline-end:0;pointer-events:none}.ds-chrome-space--sm.sc-ds-bar-nav-h,.ds-chrome-space--sm.sc-ds-bar-nav{--ds-chrome-padding:var(--dimension-space-050);--ds-chrome-gap:var(--dimension-space-050)}.ds-chrome-space--md.sc-ds-bar-nav-h,.ds-chrome-space--md.sc-ds-bar-nav{--ds-chrome-padding:var(--dimension-space-100);--ds-chrome-gap:var(--dimension-space-100)}.ds-chrome-space--lg.sc-ds-bar-nav-h,.ds-chrome-space--lg.sc-ds-bar-nav{--ds-chrome-padding:var(--dimension-space-200);--ds-chrome-gap:var(--dimension-space-200)}.ds-chrome-row.sc-ds-bar-nav-h,.ds-chrome-row.sc-ds-bar-nav,.ds-chrome-column.sc-ds-bar-nav-h,.ds-chrome-column.sc-ds-bar-nav,.ds-chrome-grid.sc-ds-bar-nav-h,.ds-chrome-grid.sc-ds-bar-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-bar-nav-h,.ds-chrome-row.sc-ds-bar-nav{flex-direction:row;align-items:center}.ds-chrome-column.sc-ds-bar-nav-h,.ds-chrome-column.sc-ds-bar-nav{flex-direction:column}.ds-chrome-grid.sc-ds-bar-nav-h,.ds-chrome-grid.sc-ds-bar-nav{display:grid;align-items:center}@media (forced-colors: active){.sc-ds-bar-nav:root,.sc-ds-bar-nav-h,.ds-forced-colors-scope.sc-ds-bar-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-bar-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-bar-nav-h,.ds-focus-ring.sc-ds-bar-nav,.ds-focus-ring-inset.sc-ds-bar-nav-h,.ds-focus-ring-inset.sc-ds-bar-nav{outline:none;-webkit-tap-highlight-color:transparent;touch-action:manipulation}.ds-focus-ring.sc-ds-bar-nav-h:focus-visible,.ds-focus-ring.sc-ds-bar-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-bar-nav-h,.ds-focus-ring.ds-focus-ring--visible.sc-ds-bar-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-bar-nav-h:focus-visible,.ds-focus-ring-inset.sc-ds-bar-nav:focus-visible{outline:none}.ds-focus-ring-inset.sc-ds-bar-nav-h:focus-visible::after,.ds-focus-ring-inset.sc-ds-bar-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-bar-nav-h,.ds-focus-ring-inset.ds-focus-ring--visible.sc-ds-bar-nav{outline:none}.ds-focus-ring-inset.ds-focus-ring--visible.sc-ds-bar-nav-h::after,.ds-focus-ring-inset.ds-focus-ring--visible.sc-ds-bar-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-bar-nav-h{--ds-focus-ring-color:var(--ds-forced-color-selected)}}@media (forced-colors: active){.sc-ds-bar-nav:root,.sc-ds-bar-nav-h,.ds-forced-colors-scope.sc-ds-bar-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-control-inactive.sc-ds-bar-nav-h,.ds-control-inactive.sc-ds-bar-nav{opacity:var(--effect-opacity-medium);pointer-events:none;cursor:not-allowed}@media (forced-colors: active){.ds-control-inactive.sc-ds-bar-nav-h,.ds-control-inactive.sc-ds-bar-nav{color:var(--ds-forced-color-disabled);opacity:1}}.sc-ds-bar-nav-h{display:block}.bar-nav.sc-ds-bar-nav{position:relative;height:var(--dimension-size-600);border-bottom:var(--dimension-stroke-width-012) solid var(--_bar-nav-border);background-color:var(--_bar-nav-bg);color:var(--_bar-nav-fg-primary);-webkit-user-select:none;user-select:none;overflow:hidden;transition:background-color var(--effect-motion-short-3),     border-color var(--effect-motion-short-3),     color var(--effect-motion-short-3);isolation:isolate;--_bar-nav-bg:var(--color-background-secondary);--_bar-nav-border:var(--color-border-tertiary);--_bar-nav-fg-primary:var(--color-foreground-primary);--_bar-nav-fg-secondary:var(--color-foreground-secondary);--_bar-nav-hover:var(--color-interaction-hover);--_bar-nav-pressed:var(--color-interaction-pressed);--_bar-nav-focus:var(--color-interaction-focus);--_bar-nav-dot:var(--color-foreground-bold-brand);--ds-focus-ring-color:var(--_bar-nav-focus)}.bar-nav--dashboard.sc-ds-bar-nav,.bar-nav--settings.sc-ds-bar-nav{--_bar-nav-bg:var(--color-background-secondary);--_bar-nav-border:var(--color-border-tertiary);--_bar-nav-fg-primary:var(--color-foreground-primary);--_bar-nav-fg-secondary:var(--color-foreground-secondary);--_bar-nav-hover:var(--color-interaction-hover);--_bar-nav-pressed:var(--color-interaction-pressed);--_bar-nav-focus:var(--color-interaction-focus);--_bar-nav-dot:var(--color-foreground-bold-brand)}ds-shell-app.sc-ds-bar-nav-h:not([gradient-preset='none']) .bar-nav.sc-ds-bar-nav,ds-shell-app:not([gradient-preset='none']) .sc-ds-bar-nav-h .bar-nav.sc-ds-bar-nav,ds-shell-app.shell-app--paper-texture.sc-ds-bar-nav-h .bar-nav.sc-ds-bar-nav,ds-shell-app.shell-app--paper-texture .sc-ds-bar-nav-h .bar-nav.sc-ds-bar-nav{background-color:transparent}.bar-nav.sc-ds-bar-nav>.sc-ds-bar-nav:not(.bar-nav__tabs-probe){position:relative;z-index:3}.bar-nav--tabs-collapsed.sc-ds-bar-nav{display:flex;gap:var(--dimension-space-100);align-items:center}.bar-nav__left.sc-ds-bar-nav{position:relative;flex:1 1 0%;min-width:0;width:0;display:flex;align-items:center}.bar-nav__tabs-visible.sc-ds-bar-nav{flex:1;min-width:0;width:100%}.bar-nav__tabs-probe.sc-ds-bar-nav{position:absolute;left:0;top:0;visibility:hidden;pointer-events:none;overflow:visible;width:max-content;max-width:none;z-index:-1}.bar-nav__tabs-probe.sc-ds-bar-nav>div.sc-ds-bar-nav{width:max-content}.bar-nav__tab-list.sc-ds-bar-nav{display:flex;align-items:center;gap:var(--dimension-space-050);position:relative;width:max-content}.bar-nav__tab.sc-ds-bar-nav{display:flex;align-items:center;justify-content:center;gap:var(--ds-control-gap);height:var(--ds-control-height);min-width:var(--ds-control-height);padding:0 var(--ds-control-padding-inline);box-sizing:border-box;border:none;border-radius:var(--ds-control-radius);background-color:transparent;color:var(--_bar-nav-fg-secondary);cursor:default;position:relative;flex-shrink:0;-webkit-user-select:none;user-select:none;transition:color var(--effect-motion-short-2)}.bar-nav__tab.sc-ds-bar-nav::after{content:'';position:absolute;inset:0;border-radius:var(--ds-control-radius);background:transparent;pointer-events:none;cursor:inherit}@media (hover: hover) and (pointer: fine){.bar-nav__tab.sc-ds-bar-nav:hover::after{background:var(--_bar-nav-hover)}}.bar-nav__tab.sc-ds-bar-nav:active::after{background:var(--_bar-nav-pressed)}.bar-nav__tab--selected.sc-ds-bar-nav{color:var(--_bar-nav-fg-primary)}.bar-nav__tab-label.sc-ds-bar-nav{display:inline-flex;align-items:center;white-space:nowrap}.bar-nav__tab-divider.sc-ds-bar-nav{display:flex;align-items:center;justify-content:center;box-sizing:border-box;width:var(--dimension-space-100);height:var(--ds-control-height);padding-block:var(--ds-control-padding-inline);flex-shrink:0;pointer-events:none}.bar-nav__tab-divider-line.sc-ds-bar-nav{width:var(--dimension-stroke-width-012);align-self:stretch;background-color:var(--_bar-nav-border)}.bar-nav__tabs-pending.sc-ds-bar-nav{flex:1;min-width:0;height:var(--ds-control-height);visibility:hidden;pointer-events:none}.bar-nav__overflow-trigger.sc-ds-bar-nav{margin-left:auto;--ds-button-unfilled-fg:var(--_bar-nav-fg-secondary);--ds-button-unfilled-fg-active:var(--_bar-nav-fg-primary);--ds-interaction-hover:var(--_bar-nav-hover);--ds-interaction-pressed:var(--_bar-nav-pressed);--ds-focus-ring-color:var(--_bar-nav-focus)}ds-text.bar-nav__heading.sc-ds-bar-nav{display:inline-flex;align-items:center;height:var(--ds-control-height);padding-inline:calc(var(--ds-control-padding-inline) + var(--ds-control-label-inset));-webkit-user-select:none;user-select:none}`;const z=s(class s extends e{constructor(s){super();if(s!==false){this.__registerHost()}this.dsTabChange=i(this,"dsTabChange",7);this.navStyle="dashboard";this.tabs=[];this.value="";this.basePath="";this.currentUrl="";this.moreTabsLabel="More tabs";this.resolvedTabs=[];this.urlDerivedValue="";this.hideTabsForDetailRoute=false;this.tabsCollapsed=false;this.menuOpen=false;this.menuTriggerActive=false;this.tabLayoutCommitted=false;this.visibleTabs=[];this.overflowTabs=[];this.menuInitialFocusVisible=false;this.overflowRovingFocused=false;this.focusedTabId="";this.headerEl=null;this.triggerEl=null;this.menuEl=null;this.visibleTabListEl=null;this.probeTabListEl=null;this.resizeObserver=null;this.intrinsicWidthRetryCount=0;this.tabLayoutPendingFrames=0;this.panelNavTransition=new d;this.panelToolsTransition=new d;this.overflowCoalescer=c((()=>{this.updateTabsCollapsed()}));this.chromeTransitionShell=null;this.committedSection="";this.pendingSection="";this.onChromeTransitionStart=s=>{const e=p(s);if(e==="panel-nav"){this.panelNavTransition.enter();return}if(e==="panel-tools"){const e=m(s)??"opening";if(e==="closing"){this.panelToolsTransition.enter()}}};this.onChromeTransitionEnd=s=>{const e=p(s);if(e==="panel-nav"){this.panelNavTransition.exit();if(!this.panelNavTransition.isActive){this.scheduleOverflowCheck()}return}if(e==="panel-tools"){this.panelToolsTransition.exit();this.scheduleOverflowCheck()}};this.handleOverflowFocus=()=>{this.overflowRovingFocused=true};this.handleOverflowBlur=()=>{this.overflowRovingFocused=false}}get effectiveValue(){if(this.currentUrl&&this.basePath){return this.urlDerivedValue}return this.value}get renderedSelectableTabs(){const s=this.hasOverflowTabs?this.visibleTabs:this.resolvedTabs;return n(s)}get hasOverflowTabs(){return this.tabLayoutCommitted&&this.tabsCollapsed&&this.overflowTabs.length>0}syncFocusedTabId(s,e){if(e.some((e=>e.id===s&&!e.isInactive))){this.focusedTabId=s;return}const i=e.find((s=>!s.isInactive));this.focusedTabId=i?.id??""}digestTabsConfig(s){return s.map((s=>o(s)?"|":s.id)).join(",")}resetTabOverflowLayout(){this.tabLayoutCommitted=false;this.tabsCollapsed=false;this.menuOpen=false;this.menuTriggerActive=false;this.menuInitialFocusVisible=false;this.intrinsicWidthRetryCount=0;this.tabLayoutPendingFrames=0;this.visibleTabs=[];this.overflowTabs=[]}onHostPropsChange(){this.applyHostProps()}onSelectionChange(){this.syncFocusedTabId(this.effectiveValue,this.renderedSelectableTabs);this.syncMenuSections();this.scheduleOverflowCheck()}onMenuOpenChange(s){if(this.menuEl){this.menuEl.open=s}}onTabsCollapsedChange(s,e){if(!s){this.menuOpen=false;this.menuTriggerActive=false;this.menuInitialFocusVisible=false;this.menuEl=null}this.scheduleOverflowCheck();if(s){requestAnimationFrame((()=>{this.scheduleOverflowCheck()}))}if(s||e===undefined||e===s)return;requestAnimationFrame((()=>this.scheduleOverflowCheck()));queueMicrotask((()=>this.focusVisibleSelectedTab()))}componentWillLoad(){this.applyHostProps();this.syncFocusedTabId(this.effectiveValue,n(this.resolvedTabs))}componentDidLoad(){this.syncHostPropsIfNeeded();this.scheduleDeferredHostPropSync();this.setupOverflowObserver();this.bindChromeTransitionListeners();this.scheduleOverflowCheck()}componentDidRender(){if(this.chromeOverflowPaused()){this.syncMenuAnchor();return}this.scheduleOverflowCheck();this.syncMenuAnchor()}disconnectedCallback(){this.resizeObserver?.disconnect();this.resizeObserver=null;this.overflowCoalescer.cancel();this.unbindChromeTransitionListeners()}bindChromeTransitionListeners(){const s=this.el.closest("ds-shell-app");if(!s)return;this.chromeTransitionShell=s;s.addEventListener(l,this.onChromeTransitionStart);s.addEventListener(h,this.onChromeTransitionEnd)}unbindChromeTransitionListeners(){if(!this.chromeTransitionShell)return;this.chromeTransitionShell.removeEventListener(l,this.onChromeTransitionStart);this.chromeTransitionShell.removeEventListener(h,this.onChromeTransitionEnd);this.chromeTransitionShell=null}chromeOverflowPaused(){return this.panelNavTransition.isActive||this.panelToolsTransition.isActive}syncHostPropsIfNeeded(){if(F(this.resolvedTabs,this.tabs)){this.applyHostProps()}else if(this.currentUrl&&this.basePath){this.syncValueFromUrl()}}scheduleDeferredHostPropSync(){let e=s.HOST_PROP_SYNC_BUDGET;const i=()=>{this.syncHostPropsIfNeeded();if(--e>0){requestAnimationFrame(i)}};queueMicrotask(i)}setupOverflowObserver(){if(typeof ResizeObserver==="undefined"||!this.headerEl)return;this.resizeObserver?.disconnect();this.resizeObserver=new ResizeObserver((()=>{if(this.chromeOverflowPaused())return;this.scheduleOverflowCheck()}));this.resizeObserver.observe(this.headerEl)}scheduleOverflowCheck(){if(this.chromeOverflowPaused())return;this.overflowCoalescer.schedule()}getLeftZoneAvailableWidth(){if(!this.headerEl)return 0;const s=getComputedStyle(this.headerEl);const e=(parseFloat(s.paddingLeft)||0)+(parseFloat(s.paddingRight)||0);return Math.max(0,this.headerEl.clientWidth-e)}getTabsIntrinsicWidth(){return this.probeTabListEl?.scrollWidth??0}getHeaderGap(){if(!this.headerEl)return 0;const s=getComputedStyle(this.headerEl);return parseFloat(s.columnGap||s.gap)||0}getOverflowTriggerReserveWidth(){if(!this.triggerEl){return 40}return this.triggerEl.getBoundingClientRect().width+this.getHeaderGap()}getProbeTabMetrics(){const s=this.probeTabListEl;if(!s)return null;const e=Array.from(s.children);const i=e.map((s=>s.getBoundingClientRect().width));if(i.length===0||i.some((s=>s===0)))return null;const t=getComputedStyle(s);const a=parseFloat(t.columnGap||t.gap)||0;const r=i.reduce(((s,e)=>s+e),0);const n=a*Math.max(0,i.length-1);const o=Math.max(0,s.scrollWidth-r-n);return{itemWidths:i,itemGap:a,listExtraWidth:o}}setOverflowTabLayout(s,e){const i=e.length>0;const t=this.digestTabsConfig(s)!==this.digestTabsConfig(this.visibleTabs);const a=this.digestTabsConfig(e)!==this.digestTabsConfig(this.overflowTabs);if(t){this.visibleTabs=s}if(a){this.overflowTabs=e}if(i!==this.tabsCollapsed){this.tabsCollapsed=i;if(!i){this.menuOpen=false;this.menuTriggerActive=false}}this.syncFocusedTabId(this.effectiveValue,n(i?s:this.resolvedTabs))}scheduleIntrinsicWidthRetry(){if(this.intrinsicWidthRetryCount>=s.INTRINSIC_WIDTH_RETRY_MAX)return;this.intrinsicWidthRetryCount++;requestAnimationFrame((()=>this.scheduleOverflowCheck()))}forceTabLayoutCommit(s){this.intrinsicWidthRetryCount=0;this.tabLayoutPendingFrames=0;this.setOverflowTabLayout(s?[]:this.resolvedTabs,s?this.resolvedTabs:[]);this.tabLayoutCommitted=true}updateTabsCollapsed(){if(!this.headerEl||this.resolvedTabs.length===0||this.hideTabsForDetailRoute){if(this.tabsCollapsed){this.setOverflowTabLayout([],[])}this.intrinsicWidthRetryCount=0;this.tabLayoutPendingFrames=0;this.tabLayoutCommitted=true;return}const e=this.getProbeTabMetrics();const i=this.getTabsIntrinsicWidth();if(!e||i===0){this.tabLayoutPendingFrames+=1;if(this.intrinsicWidthRetryCount>=s.INTRINSIC_WIDTH_RETRY_MAX){this.forceTabLayoutCommit(false)}else if(this.tabLayoutPendingFrames>=s.TAB_LAYOUT_COMMIT_MAX_FRAMES){this.forceTabLayoutCommit(false)}else{this.scheduleIntrinsicWidthRetry()}return}this.intrinsicWidthRetryCount=0;this.tabLayoutPendingFrames=0;const t=b(i,this.getLeftZoneAvailableWidth(),this.tabsCollapsed,s.OVERFLOW_HYSTERESIS_PX);if(!t){this.setOverflowTabLayout(this.resolvedTabs,[]);this.tabLayoutCommitted=true;return}const a=v(e.itemWidths,this.getLeftZoneAvailableWidth(),this.getOverflowTriggerReserveWidth(),e.itemGap,e.listExtraWidth);const r=u(this.resolvedTabs.slice(0,a));const n=this.resolvedTabs.slice(r.length);this.setOverflowTabLayout(r,n);this.tabLayoutCommitted=true}syncMenuAnchor(){if(!this.menuEl||!this.triggerEl||!this.hasOverflowTabs)return;this.menuEl.anchor=this.triggerEl;this.syncMenuSections()}handleMenuSelect(s){const e=s.detail;if(e?.value!==undefined){this.selectTab(String(e.value))}this.menuOpen=false;this.menuInitialFocusVisible=false}handleMenuClose(){this.menuOpen=false;this.menuInitialFocusVisible=false}handleMenuAfterClose(){if(!this.menuOpen)this.menuTriggerActive=false}incomingTabs(){return this.tabs??[]}applyHostProps(){const s=this.basePath;const e=s!==""&&this.committedSection!==""&&s!==this.committedSection;if(e){this.urlDerivedValue="";this.committedSection="";this.pendingSection=s;this.resolvedTabs=[];this.resetTabOverflowLayout();return}if(this.pendingSection){if(!s||s!==this.pendingSection){return}if(!this.currentUrl.startsWith(this.pendingSection)){return}const e=this.incomingTabs();if(e.length===0){return}this.pendingSection=""}const i=this.incomingTabs();const t=this.digestTabsConfig(i)!==this.digestTabsConfig(this.resolvedTabs);this.resolvedTabs=i;this.syncValueFromUrl();this.committedSection=s;if(t){this.resetTabOverflowLayout()}this.scheduleOverflowCheck()}syncMenuSections(){if(!this.menuEl)return;this.menuEl.sections=f(this.overflowTabs,this.effectiveValue)}syncValueFromUrl(){const s=this.incomingTabs();if(!this.currentUrl||!this.basePath){this.urlDerivedValue="";this.hideTabsForDetailRoute=false;return}if(!this.currentUrl.startsWith(this.basePath)){this.urlDerivedValue="";this.hideTabsForDetailRoute=false;return}const{value:e,hideTabs:i}=E(this.currentUrl,this.basePath,s);this.urlDerivedValue=e;this.hideTabsForDetailRoute=i}selectTab(s){this.value=s;this.dsTabChange.emit(s)}focusVisibleSelectedTab(){const s=this.visibleTabListEl?.querySelector(`[data-tab-id="${this.effectiveValue}"]`);s?.focus({preventScroll:true})}focusVisibleTab(s){this.focusedTabId=s;const e=this.visibleTabListEl?.querySelector(`[data-tab-id="${s}"]`);e?.focus({preventScroll:true})}focusLastVisibleTab(){const s=[...this.renderedSelectableTabs].reverse().find((s=>!s.isInactive));if(s)this.focusVisibleTab(s.id)}findEnabledVisibleTab(s,e){const i=this.renderedSelectableTabs;for(let t=s+e;t>=0&&t<i.length;t+=e){if(!i[t]?.isInactive)return t}return null}handleTabKeyDown(s){const e=this.renderedSelectableTabs;if(!e.length)return;const i=s.target?.getAttribute("data-tab-id");const t=i??this.focusedTabId;if(s.key==="Enter"||s.key===" "){const i=e.find((s=>s.id===t));if(!i||i.isInactive)return;s.preventDefault();this.selectTab(i.id);return}const a=e.findIndex((s=>s.id===t));if(a<0)return;let r;if(s.key==="ArrowRight"){r=this.findEnabledVisibleTab(a,1);if(r===null&&this.hasOverflowTabs){s.preventDefault();this.overflowRovingFocused=true;void this.triggerEl?.setFocus?.();return}}else if(s.key==="ArrowLeft"){r=this.findEnabledVisibleTab(a,-1)}else if(s.key==="Home"){r=e.findIndex((s=>!s.isInactive))}else if(s.key==="End"){const s=[...e].reverse().findIndex((s=>!s.isInactive));r=s<0?null:e.length-1-s}else{return}if(r===null||r<0||r===a)return;s.preventDefault();this.focusVisibleTab(e[r].id)}toggleTabMenu(s){if(this.menuOpen){this.menuOpen=false;this.menuInitialFocusVisible=false;return}if(this.menuEl&&this.triggerEl){this.menuEl.anchor=this.triggerEl;this.menuEl.minWidth="";this.syncMenuSections()}this.menuInitialFocusVisible=s?.focusVisible??false;this.menuTriggerActive=true;this.menuOpen=true}handleTriggerKeyDown(s){if(!this.hasOverflowTabs)return;if(!this.menuOpen){if(s.key==="ArrowLeft"){s.preventDefault();this.overflowRovingFocused=false;this.focusLastVisibleTab();return}if(s.key==="Enter"||s.key===" "){s.preventDefault();this.toggleTabMenu({focusVisible:true})}return}if(s.key==="Escape"){s.preventDefault();this.menuOpen=false;this.menuInitialFocusVisible=false;void this.triggerEl?.setFocus?.()}}renderTabList(s,e){return t("div",{role:"tablist",class:"bar-nav__tab-list","aria-label":this.heading,ref:s=>{if(e){const e=s??null;if(e===this.probeTabListEl)return;this.probeTabListEl=e;if(e){this.intrinsicWidthRetryCount=0;this.tabLayoutPendingFrames=0;this.scheduleOverflowCheck()}}else{this.visibleTabListEl=s??null}},onKeyDown:e?undefined:s=>this.handleTabKeyDown(s),onFocusin:e?undefined:()=>{this.overflowRovingFocused=false}},s.map(((s,i)=>{if(o(s)){return t("div",{class:"bar-nav__tab-divider",key:`divider-${i}`,"aria-hidden":"true"},t("div",{class:"bar-nav__tab-divider-line"}))}const a=s.id===this.effectiveValue;return t("button",{key:s.id,type:"button",role:"tab","data-tab-id":s.id,class:{"bar-nav__tab":true,"bar-nav__tab--selected":a,"ds-control--md":true,"ds-focus-ring-inset":true,"ds-control-inactive":!!s.isInactive},"aria-selected":a?"true":"false","aria-disabled":s.isInactive?"true":undefined,"aria-controls":s.panelId??undefined,disabled:s.isInactive,tabIndex:!e&&!this.overflowRovingFocused&&s.id===this.focusedTabId?0:-1,onClick:()=>!e&&!s.isInactive&&this.selectTab(s.id),onFocus:()=>{if(!e)this.focusedTabId=s.id}},t("span",{class:{"bar-nav__tab-label":true,"ds-control-label-box":true,"ds-control-label-dot":!!s.dot,"bar-nav__tab-label--dot":!!s.dot}},t("ds-text",{as:"span",variant:"text-body-medium",emphasis:a,color:"inherit"},s.label),s.dot&&t("ds-badge",{class:"bar-nav__tab-dot ds-control-label-dot__badge",variant:"dot",hasRing:false,label:"","aria-hidden":"true"})))})))}render(){const s=this.basePath===""||this.committedSection===this.basePath;const e=s&&this.resolvedTabs.length>0&&!this.hideTabsForDetailRoute;const i=this.basePath||"no-section";const r=this.hasOverflowTabs?this.visibleTabs:this.resolvedTabs;return t(a,{key:"c7cd0601e08cb1f85a854c75d70691618f461a2b"},t("header",{key:"ded55c44323afc79200c35fa8376e56320ce5327",class:{"bar-nav":true,"ds-control--md":true,"ds-chrome-row":true,"ds-chrome-space--md":true,"bar-nav--dashboard":this.navStyle==="dashboard","bar-nav--settings":this.navStyle==="settings","bar-nav--tabs-collapsed":e&&this.hasOverflowTabs},ref:s=>{this.headerEl=s;if(s&&!this.resizeObserver){this.setupOverflowObserver()}}},e&&t("div",{key:"3a778420b67d739b5ebe181cc6d9197376dd67d3",class:"bar-nav__tabs-probe","aria-hidden":"true",inert:true},t("div",{key:`probe-${i}`},this.renderTabList(this.resolvedTabs,true))),e&&this.tabLayoutCommitted&&r.length>0&&t("div",{key:"7abe4946e7ea62415a405f2e78cddc95a0783431",class:"bar-nav__left"},t("div",{key:`visible-${i}`,class:"bar-nav__tabs-visible"},this.renderTabList(r,false))),e&&!this.tabLayoutCommitted&&t("div",{key:"737558616e256a7d9c1e20f383efe4a5410e9838",class:"bar-nav__tabs-pending","aria-hidden":"true"}),!e&&this.heading&&t("ds-text",{key:"188407eea0bb39667df16d72e494cf1dff7fde0c",class:"bar-nav__heading",lineTruncation:1,as:"span",variant:"text-body-medium",emphasis:true,color:"primary",wrap:"nowrap"},this.heading),e&&this.hasOverflowTabs&&t("ds-button-unfilled",{key:"1a0f538634ba1d88ed19936354a01793b8a17217",variant:"icon",class:{"bar-nav__overflow-trigger":true},icon:"ChevronDown",activeFill:false,hasBorder:false,focusTabIndex:this.overflowRovingFocused?0:-1,ref:s=>{this.triggerEl=s??null},haspopup:"menu",expanded:this.menuOpen,surfaceOpen:this.menuTriggerActive,"aria-label":this.moreTabsLabel,onDsClick:()=>this.toggleTabMenu({focusVisible:false}),onFocusin:this.handleOverflowFocus,onFocusout:this.handleOverflowBlur,onKeyDown:s=>this.handleTriggerKeyDown(s)})),e&&this.hasOverflowTabs&&t("ds-menu",{key:"6cc61bcb2a998ad74cca418ad9719e7ed59826b3",ref:s=>{this.menuEl=s??null},open:this.menuOpen,sections:f(this.overflowTabs,this.effectiveValue),side:"bottom",align:"end",sideOffset:"calc(var(--dimension-space-100) + var(--dimension-space-050))",initialFocusVisible:this.menuInitialFocusVisible,onDsSelect:s=>this.handleMenuSelect(s),onDsClose:()=>this.handleMenuClose(),onDsAfterClose:()=>this.handleMenuAfterClose()}))}get el(){return this}static get watchers(){return{tabs:[{onHostPropsChange:0}],currentUrl:[{onHostPropsChange:0}],basePath:[{onHostPropsChange:0}],value:[{onSelectionChange:0}],urlDerivedValue:[{onSelectionChange:0}],menuOpen:[{onMenuOpenChange:0}],tabsCollapsed:[{onTabsCollapsedChange:0}]}}static get style(){return j()}},[2,"ds-bar-nav",{navStyle:[513,"nav-style"],tabs:[16],value:[1025],heading:[1],basePath:[1,"base-path"],currentUrl:[1,"current-url"],moreTabsLabel:[1,"more-tabs-label"],resolvedTabs:[32],urlDerivedValue:[32],hideTabsForDetailRoute:[32],tabsCollapsed:[32],menuOpen:[32],menuTriggerActive:[32],tabLayoutCommitted:[32],visibleTabs:[32],overflowTabs:[32],menuInitialFocusVisible:[32],overflowRovingFocused:[32],focusedTabId:[32],committedSection:[32],pendingSection:[32]},undefined,{tabs:[{onHostPropsChange:0}],currentUrl:[{onHostPropsChange:0}],basePath:[{onHostPropsChange:0}],value:[{onSelectionChange:0}],urlDerivedValue:[{onSelectionChange:0}],menuOpen:[{onMenuOpenChange:0}],tabsCollapsed:[{onTabsCollapsedChange:0}]}]);z.HOST_PROP_SYNC_BUDGET=8;z.INTRINSIC_WIDTH_RETRY_MAX=3;z.TAB_LAYOUT_COMMIT_MAX_FRAMES=16;z.OVERFLOW_HYSTERESIS_PX=8;function D(){if(typeof customElements==="undefined"){return}const s=["ds-bar-nav","ds-badge","ds-button-unfilled","ds-icon","ds-loader","ds-menu","ds-swatch-picker","ds-switch","ds-tag","ds-text","ds-tooltip"];s.forEach((s=>{switch(s){case"ds-bar-nav":if(!customElements.get(r(s))){customElements.define(r(s),z)}break;case"ds-badge":if(!customElements.get(r(s))){g()}break;case"ds-button-unfilled":if(!customElements.get(r(s))){_()}break;case"ds-icon":if(!customElements.get(r(s))){y()}break;case"ds-loader":if(!customElements.get(r(s))){w()}break;case"ds-menu":if(!customElements.get(r(s))){x()}break;case"ds-swatch-picker":if(!customElements.get(r(s))){k()}break;case"ds-switch":if(!customElements.get(r(s))){T()}break;case"ds-tag":if(!customElements.get(r(s))){C()}break;case"ds-text":if(!customElements.get(r(s))){O()}break;case"ds-tooltip":if(!customElements.get(r(s))){S()}break}}))}D();export{z as B,D as d};
-//# sourceMappingURL=p-TjXGRPik.js.map