@vielzeug/refine 3.1.0 → 3.2.1

package/dist/sidebar.cjs

@@ -6,7 +6,12 @@ Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=requi
         aria-label="${e[`mobile-close-label`]}"
         ?hidden=${()=>!_.value||!v.value}
         @click=${()=>P(!1,`toggle`)}></button>
-      <nav aria-label="${e.label}" part="nav" tabindex="-1">
+      <nav
+        aria-label="${e.label}"
+        aria-hidden=${()=>_.value&&!v.value?`true`:null}
+        part="nav"
+        tabindex="-1"
+        ?inert=${()=>_.value&&!v.value}>
         <div class="sidebar-header" part="header" ?hidden=${()=>!i()&&!e.collapsible.value}>
           <span class="sidebar-logo" ?hidden=${()=>!m()}>
             <slot name="logo"></slot>
@@ -84,7 +89,7 @@ Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=requi
           <slot></slot>
         </div>
       </details>
-    `},styles:[e.reducedMotionMixin,r.default]});var h=`ore-sidebar-item`;(0,a.define)(h,{props:{active:a.prop.bool(!1),"bottom-nav":a.prop.bool(!1),"bottom-nav-label":a.prop.string(),disabled:a.prop.bool(!1),href:a.prop.string(),rel:a.prop.string(),target:a.prop.string()},setup(e){let n=(0,a.useSlots)(),r=()=>n.has(`icon`).value,i=()=>n.has(`end`).value,s=(0,a.inject)(f);(0,a.bind)({attr:{"sidebar-bottom-nav":()=>s?.mode.value===`bottom-nav`&&!s?.mobileOpen.value||void 0,"sidebar-collapsed":()=>s?.collapsed.value?!0:void 0}});let c=()=>!!e.href.value&&!e.disabled.value,l=(0,o.computed)(()=>t.computeSafeRel(e.rel.value,e.target.value)),u=e=>{s?.closeOnSelect.value&&s.mobileOpen.value&&(e.button!==0||e.metaKey||e.ctrlKey||e.shiftKey||e.altKey||queueMicrotask(s.closeMobile))},d=()=>a.html`
+    `},styles:[e.reducedMotionMixin,r.default]});var h=`ore-sidebar-item`;(0,a.define)(h,{props:{active:a.prop.bool(!1),"bottom-nav":a.prop.bool(!1),"bottom-nav-label":a.prop.string(),disabled:a.prop.bool(!1),href:a.prop.string(),label:a.prop.string(),rel:a.prop.string(),target:a.prop.string()},setup(e){let n=(0,a.useSlots)(),r=()=>n.has(`icon`).value,i=()=>n.has(`end`).value,s=(0,a.inject)(f);(0,a.bind)({attr:{"sidebar-bottom-nav":()=>s?.mode.value===`bottom-nav`&&!s?.mobileOpen.value||void 0,"sidebar-collapsed":()=>s?.collapsed.value?!0:void 0}});let c=()=>!!e.href.value&&!e.disabled.value,l=(0,o.computed)(()=>t.computeSafeRel(e.rel.value,e.target.value)),u=e=>{s?.closeOnSelect.value&&s.mobileOpen.value&&(e.button!==0||e.metaKey||e.ctrlKey||e.shiftKey||e.altKey||queueMicrotask(s.closeMobile))},d=()=>a.html`
       <span class="item-icon" part="item-icon" ?hidden=${()=>!r()} aria-hidden="true">
         <slot name="icon"></slot>
       </span>
@@ -100,6 +105,7 @@ Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=requi
               href="${e.href}"
               rel="${l}"
               target="${e.target}"
+              aria-label="${e.label}"
               aria-current="${()=>e.active.value?`page`:null}"
               @click=${u}>
               ${d()}
@@ -110,6 +116,7 @@ Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=requi
               part="item"
               aria-disabled="true"
               tabindex="-1"
+              aria-label="${e.label}"
               aria-current="${()=>e.active.value?`page`:null}">
               ${d()}
             </div>
@@ -119,6 +126,7 @@ Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=requi
             part="item"
             type="button"
             ?disabled="${e.disabled}"
+            aria-label="${e.label}"
             aria-current="${()=>e.active.value?`page`:null}"
             @click=${u}>
             ${d()}

package/dist/sidebar.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"sidebar.cjs","names":[],"sources":["../src/layout/sidebar/sidebar.ts"],"sourcesContent":["import {\n  bind,\n  createContext,\n  define,\n  getHost,\n  html,\n  inject,\n  onCleanup,\n  onMounted,\n  prop,\n  provide,\n  useEmit,\n  useSlots,\n} from '@vielzeug/ore';\nimport { computed, fromSubscribable, type Readable, signal, watch } from '@vielzeug/ripple';\nimport { createElementSize, createMediaQuery, SentinelUnavailableError } from '@vielzeug/sentinel';\n\nimport '../../content/icon/icon';\nimport { coarsePointerMixin, reducedMotionMixin } from '../../styles';\nimport { computeSafeRel } from '../../utils';\nimport sidebarStyles from './sidebar.css?inline';\nimport groupStyles from './sidebar-group.css?inline';\nimport itemStyles from './sidebar-item.css?inline';\n\n// ─── Types ────────────────────────────────────────────────────────────────\n\ntype SidebarVariant = 'floating' | 'inset';\ntype SidebarCollapseSource = 'api' | 'responsive' | 'toggle';\ntype SidebarMobileSource = 'api' | 'responsive' | 'toggle';\ntype SidebarMode = 'bottom-nav' | 'collapsed' | 'default';\n\ntype BottomNavItem = {\n  active: boolean;\n  disabled: boolean;\n  href?: string;\n  iconName?: string;\n  label: string;\n  source: HTMLElement;\n};\n\nconst parseMaxWidthPx = (query: string | undefined): number | undefined => {\n  const value = String(query ?? '').trim();\n\n  if (!value) return undefined;\n\n  const match = /max-width\\s*:\\s*([0-9]+(?:\\.[0-9]+)?)px/i.exec(value);\n\n  if (!match) return undefined;\n\n  const parsed = Number.parseFloat(match[1]);\n\n  return Number.isFinite(parsed) ? parsed : undefined;\n};\n\nconst resolveContainerElement = (el: HTMLElement): HTMLElement | null => {\n  let container = el.parentElement;\n\n  while (container?.tagName.toLowerCase() === 'ore-grid-item') {\n    container = container.parentElement;\n  }\n\n  return container;\n};\n\nconst readContainerWidth = (el: HTMLElement): number => {\n  const parentWidth = resolveContainerElement(el)?.clientWidth ?? 0;\n\n  if (parentWidth > 0) return parentWidth;\n\n  return el.offsetWidth;\n};\n\nconst deepActiveElement = (): HTMLElement | null => {\n  let active = document.activeElement as HTMLElement | null;\n\n  while (active?.shadowRoot?.activeElement instanceof HTMLElement) {\n    active = active.shadowRoot.activeElement;\n  }\n\n  return active;\n};\n\n/** Context provided by `ore-sidebar` to its `ore-sidebar-group` and `ore-sidebar-item` children. */\nexport type SidebarContext = {\n  closeMobile: () => void;\n  closeOnSelect: Readable<boolean>;\n  collapsed: Readable<boolean>;\n  mobileOpen: Readable<boolean>;\n  mode: Readable<SidebarMode>;\n  variant: Readable<SidebarVariant | undefined>;\n};\n\n/** Injection key for the sidebar context. */\nexport const SIDEBAR_CTX = createContext<SidebarContext>('SidebarContext');\n\n// ─── ore-sidebar styles ──────────────────────────────────────────────────────\n\n/** ore-sidebar element interface */\nexport type SidebarElement = HTMLElement &\n  OreSidebarProps & {\n    /** Close the drawer in bottom-nav mode. */\n    closeMobile(): void;\n    /** Open the drawer in bottom-nav mode. */\n    openMobile(): void;\n    /** Set collapsed state imperatively. */\n    setCollapsed(next: boolean): void;\n    /** Toggle between collapsed and expanded. */\n    toggle(): void;\n    /** Toggle the drawer in bottom-nav mode. */\n    toggleMobile(): void;\n  };\n\n/** Sidebar component properties */\n\nexport type OreSidebarEvents = {\n  'collapsed-change': { collapsed: boolean; source: SidebarCollapseSource };\n  'mobile-open-change': { open: boolean; source: SidebarMobileSource };\n};\n\nexport type OreSidebarGroupEvents = {\n  'open-change': { open: boolean };\n};\n\nexport type OreSidebarProps = {\n  /** CSS media query that switches the sidebar to bottom navigation mode */\n  'bottom-nav-at'?: string;\n  'close-on-select'?: boolean;\n  /** Controlled collapsed state */\n  collapsed?: boolean;\n  /** Whether the sidebar supports collapsing */\n  collapsible?: boolean;\n  'collapse-label'?: string;\n  /** Evaluate responsive and bottom-nav breakpoints against container width only. */\n  'container-breakpoints'?: boolean;\n  /** Initial collapsed state in uncontrolled mode */\n  'default-collapsed'?: boolean;\n  'expand-label'?: string;\n  /**\n   * Accessible label for the navigation landmark.\n   * Use to distinguish multiple navigation regions on a page.\n   * @default 'Sidebar navigation'\n   */\n  label?: string;\n  'mobile-close-label'?: string;\n  /**\n   * CSS media query that, when it matches, automatically collapses the sidebar.\n   * Unset by default — no automatic collapse.\n   * @example 'responsive=\"(max-width: 768px)\"'\n   */\n  responsive?: string;\n  /** Visual style variant */\n  variant?: SidebarVariant;\n};\n\n/**\n * `ore-sidebar` — A collapsible navigation sidebar with group and item support.\n *\n * @element ore-sidebar\n * @element ore-sidebar-group - Labelled group of navigation items\n * @element ore-sidebar-item - Individual navigation link or button\n *\n * @attr {boolean} collapsed - Controlled collapsed state\n * @attr {boolean} default-collapsed - Initial collapsed state for uncontrolled sidebars\n * @attr {boolean} collapsible - Show the collapse toggle button\n * @attr {string} variant - Visual variant: 'floating' | 'inset'\n * @attr {string} label - Accessible aria-label for the nav landmark\n *\n * @fires collapsed-change - Fired when collapsed state changes. detail: { collapsed: boolean; source: string }\n * @fires mobile-open-change - Fired when mobile overlay open state changes. detail: { open: boolean; source: string }\n *\n * @slot header - Branding or logo content above the nav\n * @slot - Navigation content (ore-sidebar-group / ore-sidebar-item)\n * @slot footer - Footer content below the nav (user info, settings, etc.)\n *\n * @cssprop --sidebar-width - Expanded sidebar width (default: 16rem)\n * @cssprop --sidebar-collapsed-width - Collapsed sidebar width (default: 3.5rem)\n * @cssprop --sidebar-bg - Sidebar background color\n * @cssprop --sidebar-border-color - Border color\n *\n * @part mobile-backdrop - Backdrop shown for mobile overlays.\n * @part nav - Navigation container.\n * @part header - Header container.\n * @part toggle-btn - Shadow part for the `toggle-btn` element.\n * @part content - Content container.\n * @part footer - Footer container.\n * @part bottom-bar - Bottom bar container.\n * @part group - Group container.\n * @part group-header - Group header container.\n * @part group-icon - Group icon container.\n * @part group-label - Group label container.\n * @part group-items - Group items container.\n * @part item-icon - Leading item icon container.\n * @part item-label - Item label container.\n * @part item-end - Trailing item content container.\n * @part item - Item root element.\n * @example\n * ```html\n * <ore-sidebar collapsible label=\"App navigation\">\n *   <span slot=\"header\">My App</span>\n *   <ore-sidebar-group label=\"Main\">\n *     <ore-sidebar-item href=\"/dashboard\" active>Dashboard</ore-sidebar-item>\n *     <ore-sidebar-item href=\"/settings\">Settings</ore-sidebar-item>\n *   </ore-sidebar-group>\n * </ore-sidebar>\n *\n * <!-- Auto-collapse on mobile -->\n * <ore-sidebar collapsible responsive=\"(max-width: 768px)\">...</ore-sidebar>\n * ```\n */\nexport const SIDEBAR_TAG = 'ore-sidebar' as const;\ndefine<OreSidebarProps>(SIDEBAR_TAG, {\n  props: {\n    'bottom-nav-at': prop.string(),\n    'close-on-select': prop.bool(false),\n    'collapse-label': prop.string('Collapse sidebar'),\n    collapsed: prop.bool(false),\n    collapsible: prop.bool(false),\n    'container-breakpoints': prop.bool(false),\n    'default-collapsed': prop.bool(false),\n    'expand-label': prop.string('Expand sidebar'),\n    label: prop.string('Sidebar navigation'),\n    'mobile-close-label': prop.string('Close sidebar'),\n    responsive: prop.string(),\n    variant: prop.string<SidebarVariant>(),\n  },\n  setup(props) {\n    const el = getHost();\n    const emit = useEmit<OreSidebarEvents>();\n    const slots = useSlots();\n\n    const hasHeader = () => slots.has('header').value;\n    const hasFooter = () => slots.has('footer').value;\n    const hasLogo = () => slots.has('logo').value;\n\n    const isControlled = signal(el.hasAttribute('collapsed'));\n    const collapsedState = signal(isControlled.value ? el.hasAttribute('collapsed') : props['default-collapsed'].value);\n    const isBottomNav = signal(false);\n    const isMobileOpen = signal(false);\n    const bottomNavItems = signal<BottomNavItem[]>([]);\n    const responsiveMediaMatches = signal(false);\n    const responsiveSizeMatches = signal(false);\n    const responsiveMaxWidthPx = signal<number | undefined>(parseMaxWidthPx(props.responsive.value));\n    const hasResponsiveQuery = signal(Boolean(String(props.responsive.value ?? '').trim()));\n    const bottomNavMediaMatches = signal(false);\n    const bottomNavSizeMatches = signal(false);\n    const bottomNavMaxWidthPx = signal<number | undefined>(parseMaxWidthPx(props['bottom-nav-at'].value));\n    const isPreviewMode = signal(false);\n    let focusReturnTarget: HTMLElement | null = null;\n\n    const isCollapsed = () => collapsedState.value;\n    const mode = computed<SidebarMode>(() => {\n      if (isBottomNav.value) return 'bottom-nav';\n\n      return collapsedState.value ? 'collapsed' : 'default';\n    });\n\n    const applyResponsiveState = () => {\n      const useContainerBreakpoints = props['container-breakpoints'].value;\n      const responsiveMatched = useContainerBreakpoints\n        ? responsiveSizeMatches.value\n        : responsiveMediaMatches.value || responsiveSizeMatches.value;\n      const bottomMatched = useContainerBreakpoints\n        ? bottomNavSizeMatches.value\n        : bottomNavMediaMatches.value || bottomNavSizeMatches.value;\n\n      // If the mobile drawer is currently open, stay in bottom-nav mode\n      // regardless of the responsive match. This prevents the drawer from\n      // disappearing mid-animation or if forced open via the API on desktop.\n      if (!isMobileOpen.value) {\n        isBottomNav.value = bottomMatched;\n      }\n\n      if (!bottomMatched && !isMobileOpen.value) {\n        setMobileOpen(false, 'responsive');\n      }\n\n      if (hasResponsiveQuery.value) {\n        setCollapsed(responsiveMatched, 'responsive');\n      }\n    };\n\n    const readBottomNavItems = () => {\n      const directItems = slots\n        .elements()\n        .value.filter(\n          (item): item is HTMLElement =>\n            item instanceof HTMLElement && item.tagName.toLowerCase() === 'ore-sidebar-item',\n        );\n      const promotedItems = [...el.querySelectorAll<HTMLElement>('ore-sidebar-item[bottom-nav]')];\n      const sourceItems = promotedItems.length > 0 ? promotedItems : directItems;\n      const next = sourceItems.map((item, index) => {\n        const el = item;\n        const iconSlotEl =\n          (el.querySelector(':scope > [slot=\"icon\"]') as HTMLElement | null) ??\n          (el.querySelector('[slot=\"icon\"]') as HTMLElement | null);\n        const directIconName =\n          iconSlotEl?.tagName.toLowerCase() === 'ore-icon' ? iconSlotEl.getAttribute('name') : null;\n        const nestedIconName = iconSlotEl?.querySelector('ore-icon')?.getAttribute('name') ?? null;\n        const rawLabel = (el.textContent ?? '').trim();\n\n        return {\n          active: el.hasAttribute('active'),\n          disabled: el.hasAttribute('disabled'),\n          href: el.getAttribute('href') ?? undefined,\n          iconName: directIconName ?? nestedIconName ?? undefined,\n          label: el.getAttribute('bottom-nav-label')?.trim() || rawLabel || `Item ${index + 1}`,\n          source: el,\n        } satisfies BottomNavItem;\n      });\n\n      bottomNavItems.value = next;\n    };\n\n    provide(SIDEBAR_CTX, {\n      closeMobile: () => setMobileOpen(false, 'toggle'),\n      closeOnSelect: props['close-on-select'],\n      collapsed: computed(() => !isBottomNav.value && collapsedState.value) as Readable<boolean>,\n      mobileOpen: computed(() => isBottomNav.value && isMobileOpen.value) as Readable<boolean>,\n      mode: mode as Readable<SidebarMode>,\n      variant: props.variant,\n    });\n\n    const setCollapsed = (next: boolean, source: SidebarCollapseSource) => {\n      if (isCollapsed() === next) return;\n\n      if (!isControlled.value) {\n        collapsedState.value = next;\n      }\n\n      emit('collapsed-change', { collapsed: next, source });\n    };\n\n    const setMobileOpen = (next: boolean, source: SidebarMobileSource) => {\n      const open = Boolean(next);\n\n      if (open && !isBottomNav.value) {\n        isBottomNav.value = true;\n      }\n\n      if (!isBottomNav.value && !open) {\n        if (isMobileOpen.value) {\n          isMobileOpen.value = false;\n        }\n\n        return;\n      }\n\n      if (isMobileOpen.value === open) return;\n\n      if (open) focusReturnTarget = deepActiveElement();\n\n      isMobileOpen.value = open;\n\n      // If closing, re-evaluate responsive state to potentially exit forced bottom-nav mode\n      if (!open) {\n        applyResponsiveState();\n        queueMicrotask(() => {\n          if (focusReturnTarget?.isConnected) focusReturnTarget.focus();\n          focusReturnTarget = null;\n        });\n      } else {\n        queueMicrotask(() => el.shadowRoot?.querySelector<HTMLElement>('nav')?.focus());\n      }\n\n      emit('mobile-open-change', { open, source });\n    };\n\n    const doToggle = () => {\n      setCollapsed(!isCollapsed(), 'toggle');\n    };\n\n    const sidebarEl = el as SidebarElement;\n\n    sidebarEl.setCollapsed = (next) => setCollapsed(Boolean(next), 'api');\n    sidebarEl.toggle = doToggle;\n    sidebarEl.openMobile = () => setMobileOpen(true, 'api');\n    sidebarEl.closeMobile = () => setMobileOpen(false, 'api');\n    sidebarEl.toggleMobile = () => setMobileOpen(!isMobileOpen.value, 'toggle');\n\n    bind({\n      attr: {\n        'data-bottom-nav': () => (isBottomNav.value ? true : undefined),\n        'data-collapsed': () => (isCollapsed() && !isBottomNav.value ? true : undefined),\n        'data-has-logo': () => (hasLogo() ? true : undefined),\n        'data-mobile-open': () => (isBottomNav.value && isMobileOpen.value ? true : undefined),\n        'data-preview-mode': () => (isPreviewMode.value ? true : undefined),\n      },\n    });\n\n    onMounted(() => {\n      // Suppress transitions during initial layout so the sidebar doesn't\n      // animate from a collapsed/0 state before the first ResizeObserver fires.\n      el.setAttribute('data-no-transition', '');\n\n      let transitionUnlocked = false;\n      const unlockTransition = () => {\n        if (transitionUnlocked) return;\n\n        transitionUnlocked = true;\n        el.removeAttribute('data-no-transition');\n      };\n\n      // Fallback: unlock after two frames in case ResizeObserver doesn't fire.\n      requestAnimationFrame(() => requestAnimationFrame(unlockTransition));\n\n      let mediaCleanup: (() => void) | undefined;\n      let bottomNavCleanup: (() => void) | undefined;\n      const itemObservers = new Map<HTMLElement, MutationObserver>();\n      const observer = new MutationObserver(() => {\n        if (!el.hasAttribute('collapsed') && !isControlled.value) return;\n\n        isControlled.value = true;\n        collapsedState.value = el.hasAttribute('collapsed');\n      });\n\n      observer.observe(el, {\n        attributeFilter: ['collapsed'],\n        attributes: true,\n      });\n      const closeOnEscape = (event: KeyboardEvent) => {\n        if (event.key !== 'Escape' || !isMobileOpen.value) return;\n\n        event.preventDefault();\n        setMobileOpen(false, 'toggle');\n      };\n      el.addEventListener('keydown', closeOnEscape);\n\n      watch(\n        props.responsive,\n        (query) => {\n          mediaCleanup?.();\n          mediaCleanup = undefined;\n\n          const mediaQuery = String(query ?? '').trim();\n\n          hasResponsiveQuery.value = Boolean(mediaQuery);\n          responsiveMaxWidthPx.value = parseMaxWidthPx(mediaQuery);\n          responsiveMediaMatches.value = false;\n\n          const width = readContainerWidth(el);\n\n          responsiveSizeMatches.value =\n            width > 0 && responsiveMaxWidthPx.value != null ? width <= responsiveMaxWidthPx.value : false;\n          applyResponsiveState();\n\n          // For parseable max-width queries, keep behavior container-driven.\n          // This avoids preview viewport controls being overridden by window width.\n          if (props['container-breakpoints'].value && responsiveMaxWidthPx.value != null) {\n            return;\n          }\n\n          if (!mediaQuery) {\n            return;\n          }\n\n          try {\n            const mediaHandle = createMediaQuery(mediaQuery);\n            const syncMedia = (state: ReturnType<typeof mediaHandle.getSnapshot>) => {\n              if (state) {\n                responsiveMediaMatches.value = state.matches;\n                applyResponsiveState();\n              }\n            };\n\n            syncMedia(mediaHandle.getSnapshot());\n\n            const mediaCleanupFn = watch(\n              fromSubscribable(mediaHandle, { signal: mediaHandle.disposalSignal }),\n              syncMedia,\n            );\n            mediaCleanup = () => {\n              mediaCleanupFn.dispose();\n              mediaHandle.dispose();\n            };\n          } catch (error) {\n            if (!(error instanceof SentinelUnavailableError)) throw error;\n          }\n        },\n        { immediate: true },\n      );\n\n      watch(\n        props['bottom-nav-at'],\n        (query) => {\n          bottomNavCleanup?.();\n          bottomNavCleanup = undefined;\n\n          const mediaQuery = String(query ?? '').trim();\n\n          bottomNavMaxWidthPx.value = parseMaxWidthPx(mediaQuery);\n          bottomNavMediaMatches.value = false;\n\n          const width = readContainerWidth(el);\n\n          bottomNavSizeMatches.value =\n            width > 0 && bottomNavMaxWidthPx.value != null ? width <= bottomNavMaxWidthPx.value : false;\n          applyResponsiveState();\n\n          // For parseable max-width queries, keep behavior container-driven.\n          // This avoids preview viewport controls being overridden by window width.\n          if (props['container-breakpoints'].value && bottomNavMaxWidthPx.value != null) {\n            return;\n          }\n\n          if (!mediaQuery) {\n            return;\n          }\n\n          try {\n            const mediaHandle = createMediaQuery(mediaQuery);\n            const syncMedia = (state: ReturnType<typeof mediaHandle.getSnapshot>) => {\n              if (state) {\n                bottomNavMediaMatches.value = state.matches;\n                applyResponsiveState();\n              }\n            };\n\n            syncMedia(mediaHandle.getSnapshot());\n\n            const mediaCleanupFn = watch(\n              fromSubscribable(mediaHandle, { signal: mediaHandle.disposalSignal }),\n              syncMedia,\n            );\n            bottomNavCleanup = () => {\n              mediaCleanupFn.dispose();\n              mediaHandle.dispose();\n            };\n          } catch (error) {\n            if (!(error instanceof SentinelUnavailableError)) throw error;\n          }\n        },\n        { immediate: true },\n      );\n\n      const stopResizeEffect =\n        typeof ResizeObserver === 'function'\n          ? (() => {\n              const hostSize = createElementSize(el);\n              onCleanup(() => hostSize.dispose());\n              const hostSizeSignal = fromSubscribable(hostSize, { signal: hostSize.disposalSignal });\n\n              const wrapperEl = el.parentElement;\n              const containerEl = resolveContainerElement(el);\n              const wrapperSize = wrapperEl ? createElementSize(wrapperEl) : undefined;\n              const parentSize = containerEl && containerEl !== wrapperEl ? createElementSize(containerEl) : undefined;\n\n              if (wrapperSize) {\n                onCleanup(() => wrapperSize.dispose());\n              }\n              if (parentSize) {\n                onCleanup(() => parentSize.dispose());\n              }\n\n              const wrapperSizeSignal = wrapperSize\n                ? fromSubscribable(wrapperSize, { signal: wrapperSize.disposalSignal })\n                : undefined;\n              const parentSizeSignal = parentSize\n                ? fromSubscribable(parentSize, { signal: parentSize.disposalSignal })\n                : undefined;\n\n              let rafId: number | undefined;\n\n              const onResize = () => {\n                if (rafId !== undefined) cancelAnimationFrame(rafId);\n\n                rafId = requestAnimationFrame(() => {\n                  const resolvedContainer = resolveContainerElement(el);\n                  const width = readContainerWidth(el);\n                  const responsiveWasMatched = responsiveSizeMatches.value;\n                  const bottomNavWasMatched = bottomNavSizeMatches.value;\n                  const parentWidth = resolvedContainer?.clientWidth ?? 0;\n\n                  isPreviewMode.value = parentWidth > 0 && parentWidth < window.innerWidth;\n\n                  responsiveSizeMatches.value =\n                    width > 0 && responsiveMaxWidthPx.value != null ? width <= responsiveMaxWidthPx.value : false;\n                  bottomNavSizeMatches.value =\n                    width > 0 && bottomNavMaxWidthPx.value != null ? width <= bottomNavMaxWidthPx.value : false;\n\n                  if (\n                    responsiveWasMatched !== responsiveSizeMatches.value ||\n                    bottomNavWasMatched !== bottomNavSizeMatches.value\n                  ) {\n                    applyResponsiveState();\n                  }\n\n                  unlockTransition();\n                });\n              };\n\n              return watch(\n                computed(() => [\n                  hostSizeSignal.value?.width,\n                  hostSizeSignal.value?.height,\n                  wrapperSizeSignal?.value?.width,\n                  wrapperSizeSignal?.value?.height,\n                  parentSizeSignal?.value?.width,\n                  parentSizeSignal?.value?.height,\n                ]),\n                onResize,\n              );\n            })()\n          : undefined;\n\n      const bindItemObservers = (items: HTMLElement[]) => {\n        const set = new Set(items);\n\n        for (const [item, cleanup] of itemObservers) {\n          if (set.has(item)) continue;\n\n          cleanup.disconnect();\n          itemObservers.delete(item);\n        }\n\n        for (const item of items) {\n          if (itemObservers.has(item)) continue;\n\n          const itemObserver = new MutationObserver(() => {\n            // Only update if in bottom-nav mode to minimize re-renders\n            if (isBottomNav.value) {\n              readBottomNavItems();\n            }\n          });\n\n          // Watch attributes and content that affect bottom-nav rendering.\n          itemObserver.observe(item, {\n            attributeFilter: ['active', 'bottom-nav', 'bottom-nav-label', 'disabled', 'href'],\n            attributes: true,\n            characterData: true,\n            childList: true,\n            subtree: true,\n          });\n          itemObservers.set(item, itemObserver);\n        }\n      };\n\n      const syncBottomNavItems = () => {\n        bindItemObservers([...el.querySelectorAll<HTMLElement>('ore-sidebar-item')]);\n        readBottomNavItems();\n      };\n      watch(slots.elements(), syncBottomNavItems, { immediate: true });\n      const nestedItemsObserver = new MutationObserver(syncBottomNavItems);\n      nestedItemsObserver.observe(el, { childList: true, subtree: true });\n\n      return () => {\n        observer.disconnect();\n        nestedItemsObserver.disconnect();\n        el.removeEventListener('keydown', closeOnEscape);\n        mediaCleanup?.();\n        bottomNavCleanup?.();\n        stopResizeEffect?.dispose();\n\n        for (const itemObserver of itemObservers.values()) {\n          itemObserver.disconnect();\n        }\n\n        itemObservers.clear();\n      };\n    });\n\n    return html`\n      <button\n        class=\"mobile-backdrop\"\n        part=\"mobile-backdrop\"\n        type=\"button\"\n        aria-label=\"${props['mobile-close-label']}\"\n        ?hidden=${() => !isBottomNav.value || !isMobileOpen.value}\n        @click=${() => setMobileOpen(false, 'toggle')}></button>\n      <nav aria-label=\"${props.label}\" part=\"nav\" tabindex=\"-1\">\n        <div class=\"sidebar-header\" part=\"header\" ?hidden=${() => !hasHeader() && !props.collapsible.value}>\n          <span class=\"sidebar-logo\" ?hidden=${() => !hasLogo()}>\n            <slot name=\"logo\"></slot>\n          </span>\n          <span class=\"sidebar-header-content\">\n            <slot name=\"header\"></slot>\n          </span>\n          <button\n            class=\"toggle-btn\"\n            part=\"toggle-btn\"\n            type=\"button\"\n            ?hidden=${() => !props.collapsible.value}\n            aria-label=\"${() => (isCollapsed() ? props['expand-label'].value : props['collapse-label'].value)}\"\n            aria-expanded=\"${() => !isCollapsed()}\"\n            @click=\"${doToggle}\">\n            <ore-icon\n              class=\"toggle-icon\"\n              name=${() => (isCollapsed() ? 'panel-left-open' : 'panel-left-close')}\n              size=\"18\"\n              stroke-width=\"2\"\n              aria-hidden=\"true\"></ore-icon>\n          </button>\n        </div>\n        <div class=\"sidebar-content\" part=\"content\">\n          <slot></slot>\n        </div>\n        <div class=\"sidebar-footer\" part=\"footer\" ?hidden=${() => !hasFooter()}>\n          <slot name=\"footer\"></slot>\n        </div>\n      </nav>\n\n      <div class=\"bottom-bar\" part=\"bottom-bar\" ?hidden=${() => !isBottomNav.value}>\n        ${() =>\n          bottomNavItems.value.map((item) => {\n            const className = `bottom-tab${item.active ? ' bottom-tab-active' : ''}`;\n\n            if (item.href && !item.disabled) {\n              return html`\n                <a\n                  class=\"${className}\"\n                  href=\"${item.href}\"\n                  aria-current=\"${item.active ? 'page' : null}\"\n                  data-active=\"${item.active ? 'true' : null}\">\n                  <span class=\"bottom-tab-icon\" aria-hidden=\"true\" ?hidden=${() => !item.iconName}>\n                    <ore-icon name=\"${item.iconName}\" size=\"18\" stroke-width=\"2\"></ore-icon>\n                  </span>\n                  <span class=\"bottom-tab-label\">${item.label}</span>\n                </a>\n              `;\n            }\n\n            return html`\n              <button\n                class=\"${className}\"\n                type=\"button\"\n                ?disabled=${item.disabled}\n                aria-current=\"${item.active ? 'page' : null}\"\n                data-active=\"${item.active ? 'true' : null}\"\n                @click=${() => item.source.click()}>\n                <span class=\"bottom-tab-icon\" aria-hidden=\"true\" ?hidden=${() => !item.iconName}>\n                  <ore-icon name=\"${item.iconName}\" size=\"18\" stroke-width=\"2\"></ore-icon>\n                </span>\n                <span class=\"bottom-tab-label\">${item.label}</span>\n              </button>\n            `;\n          })}\n      </div>\n    `;\n  },\n  styles: [coarsePointerMixin, reducedMotionMixin, sidebarStyles],\n});\n\n// ─── ore-sidebar-group styles ────────────────────────────────────────────────\n\n/** Sidebar group properties */\nexport type OreSidebarGroupProps = {\n  /** Whether this group can be collapsed */\n  collapsible?: boolean;\n  /** Initial open state in uncontrolled mode */\n  'default-open'?: boolean;\n  /** Accessible label for the group */\n  label?: string;\n  /** Controlled open state */\n  open?: boolean;\n};\n\n/**\n * `ore-sidebar-group` — A labelled section within `ore-sidebar`.\n *\n * @element ore-sidebar-group\n *\n * @attr {string} label - Group label text\n * @attr {boolean} collapsible - Whether this group can be toggled open/closed\n * @attr {boolean} open - Controlled expanded state\n * @attr {boolean} default-open - Initial expanded state in uncontrolled mode\n *\n * @fires open-change - Fired when the group open state changes (collapsible groups only). detail: { open: boolean }\n *\n * @slot - Navigation items (`ore-sidebar-item`)\n * @slot icon - Icon displayed before the label\n *\n * @example\n * ```html\n * <ore-sidebar-group label=\"Main\" collapsible open>\n *   <ore-sidebar-item href=\"/home\">Home</ore-sidebar-item>\n * </ore-sidebar-group>\n * ```\n */\nexport const SIDEBAR_GROUP_TAG = 'ore-sidebar-group' as const;\ndefine<OreSidebarGroupProps>(SIDEBAR_GROUP_TAG, {\n  props: {\n    collapsible: prop.bool(false),\n    'default-open': prop.bool(true),\n    label: prop.string(),\n    open: {\n      default: undefined as boolean | undefined,\n      parse: (value: string | null) => (value == null ? undefined : value === '' || value === 'true'),\n      reflect: false,\n    },\n  },\n  setup(props) {\n    const slots = useSlots();\n\n    const hasIcon = () => slots.has('icon').value;\n    const sidebarCtx = inject(SIDEBAR_CTX);\n\n    bind({\n      attr: {\n        'sidebar-bottom-nav': () =>\n          sidebarCtx?.mode.value === 'bottom-nav' && !sidebarCtx?.mobileOpen.value ? true : undefined,\n        'sidebar-collapsed': () => (sidebarCtx?.collapsed.value ? true : undefined),\n      },\n    });\n\n    const isControlled = () => props.open.value !== undefined;\n    const openState = signal(props['default-open'].value);\n    const isOpen = computed(() => {\n      if (!props.collapsible.value) return true;\n\n      if (isControlled()) return props.open.value ?? false;\n\n      return openState.value;\n    });\n\n    watch(props.open, (value) => {\n      if (value === undefined) return;\n\n      openState.value = value;\n    });\n\n    bind({\n      attr: {\n        open: () => (isOpen.value ? true : undefined),\n      },\n    });\n\n    return html`\n      <details class=\"group\" part=\"group\" ?open=${isOpen}>\n        <summary\n          class=\"group-header\"\n          part=\"group-header\"\n          aria-expanded=\"${() => (props.collapsible.value ? String(props.open.value) : null)}\"\n          @click=${(e: MouseEvent) => {\n            if (!props.collapsible.value) {\n              e.preventDefault();\n            }\n          }}>\n          <span class=\"group-icon\" part=\"group-icon\" ?hidden=${() => !hasIcon()} aria-hidden=\"true\">\n            <slot name=\"icon\"></slot>\n          </span>\n          <span class=\"group-label\" part=\"group-label\">${props.label}</span>\n          <span class=\"chevron\" ?hidden=${() => !props.collapsible.value} aria-hidden=\"true\">\n            <ore-icon name=\"chevron-right\" size=\"12\" stroke-width=\"2\" aria-hidden=\"true\"></ore-icon>\n          </span>\n        </summary>\n        <div class=\"group-items\" part=\"group-items\" role=\"list\">\n          <slot></slot>\n        </div>\n      </details>\n    `;\n  },\n  styles: [reducedMotionMixin, groupStyles],\n});\n\n// ─── ore-sidebar-item styles ─────────────────────────────────────────────────\n\n/** Sidebar item properties */\nexport type OreSidebarItemProps = {\n  /** Whether this item represents the current page/section */\n  active?: boolean;\n  'bottom-nav'?: boolean;\n  'bottom-nav-label'?: string;\n  /** Whether this item is disabled */\n  disabled?: boolean;\n  /** Navigation href — renders an `<a>` when set, otherwise a `<button>` */\n  href?: string;\n  /**\n   * Relationship of the linked URL (`rel` attribute on the inner `<a>`).\n   * Only applies when `href` is set.\n   */\n  rel?: string;\n  /**\n   * Browsing context for the link (`target` attribute on the inner `<a>`).\n   * Only applies when `href` is set.\n   */\n  target?: string;\n};\n\n/**\n * `ore-sidebar-item` — An individual navigation item in a `ore-sidebar`.\n *\n * Renders as an `<a>` when `href` is provided, otherwise as a `<button>`.\n * Marks the active page via `aria-current=\"page\"` when the `active` attribute is set.\n *\n * @element ore-sidebar-item\n *\n * @attr {string} href - Link URL; renders an anchor when set\n * @attr {boolean} active - Marks the item as the current page\n * @attr {boolean} disabled - Disables the item\n * @attr {string} rel - Anchor `rel` attribute (links only)\n * @attr {string} target - Anchor `target` attribute (links only)\n *\n * @slot - Label text\n * @slot icon - Leading icon\n * @slot end - Trailing content (badge, shortcut, arrow, etc.)\n *\n * @cssprop --sidebar-item-color - Default text color\n * @cssprop --sidebar-item-hover-bg - Hover background\n * @cssprop --sidebar-item-hover-color - Hover text color\n * @cssprop --sidebar-item-active-bg - Active background\n * @cssprop --sidebar-item-active-color - Active text color\n * @cssprop --sidebar-item-indicator - Active indicator bar color\n *\n * @part item - The inner anchor or button element\n * @part item-icon - The icon wrapper\n * @part item-label - The label wrapper\n * @part item-end - The trailing content wrapper\n *\n * @example\n * ```html\n * <ore-sidebar-item href=\"/dashboard\" active>\n *   <span slot=\"icon\">🏠</span>\n *   Dashboard\n * </ore-sidebar-item>\n *\n * <ore-sidebar-item href=\"/users\">\n *   <span slot=\"icon\">👤</span>\n *   Users\n *   <ore-badge slot=\"end\" color=\"primary\">3</ore-badge>\n * </ore-sidebar-item>\n * ```\n */\nexport const SIDEBAR_ITEM_TAG = 'ore-sidebar-item' as const;\ndefine<OreSidebarItemProps>(SIDEBAR_ITEM_TAG, {\n  props: {\n    active: prop.bool(false),\n    'bottom-nav': prop.bool(false),\n    'bottom-nav-label': prop.string(),\n    disabled: prop.bool(false),\n    href: prop.string(),\n    rel: prop.string(),\n    target: prop.string(),\n  },\n  setup(props) {\n    const slots = useSlots();\n\n    const hasIcon = () => slots.has('icon').value;\n    const hasEnd = () => slots.has('end').value;\n    const sidebarCtx = inject(SIDEBAR_CTX);\n\n    bind({\n      attr: {\n        'sidebar-bottom-nav': () =>\n          sidebarCtx?.mode.value === 'bottom-nav' && !sidebarCtx?.mobileOpen.value ? true : undefined,\n        'sidebar-collapsed': () => (sidebarCtx?.collapsed.value ? true : undefined),\n      },\n    });\n\n    const isLink = () => !!props.href.value && !props.disabled.value;\n\n    // Prevent reverse tabnapping: auto-inject noopener + noreferrer for _blank links.\n    const effectiveRel = computed(() => computeSafeRel(props.rel.value, props.target.value));\n    const closeMobileOnSelect = (event: MouseEvent) => {\n      if (!sidebarCtx?.closeOnSelect.value || !sidebarCtx.mobileOpen.value) return;\n      if (event.button !== 0 || event.metaKey || event.ctrlKey || event.shiftKey || event.altKey) return;\n\n      queueMicrotask(sidebarCtx.closeMobile);\n    };\n\n    const renderItemContent = () => html`\n      <span class=\"item-icon\" part=\"item-icon\" ?hidden=${() => !hasIcon()} aria-hidden=\"true\">\n        <slot name=\"icon\"></slot>\n      </span>\n      <span class=\"item-label\" part=\"item-label\"><slot></slot></span>\n      <span class=\"item-end\" part=\"item-end\" ?hidden=${() => !hasEnd()}>\n        <slot name=\"end\"></slot>\n      </span>\n    `;\n\n    return html`\n      ${() => {\n        if (isLink()) {\n          return html`\n            <a\n              class=\"item\"\n              part=\"item\"\n              href=\"${props.href}\"\n              rel=\"${effectiveRel}\"\n              target=\"${props.target}\"\n              aria-current=\"${() => (props.active.value ? 'page' : null)}\"\n              @click=${closeMobileOnSelect}>\n              ${renderItemContent()}\n            </a>\n          `;\n        }\n\n        if (props.disabled.value) {\n          return html`\n            <div\n              class=\"item\"\n              part=\"item\"\n              aria-disabled=\"true\"\n              tabindex=\"-1\"\n              aria-current=\"${() => (props.active.value ? 'page' : null)}\">\n              ${renderItemContent()}\n            </div>\n          `;\n        }\n\n        return html`\n          <button\n            class=\"item\"\n            part=\"item\"\n            type=\"button\"\n            ?disabled=\"${props.disabled}\"\n            aria-current=\"${() => (props.active.value ? 'page' : null)}\"\n            @click=${closeMobileOnSelect}>\n            ${renderItemContent()}\n          </button>\n        `;\n      }}\n    `;\n  },\n  styles: [coarsePointerMixin, itemStyles],\n});\n"],"mappings":"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"}
+{"version":3,"file":"sidebar.cjs","names":[],"sources":["../src/layout/sidebar/sidebar.ts"],"sourcesContent":["import {\n  bind,\n  createContext,\n  define,\n  getHost,\n  html,\n  inject,\n  onCleanup,\n  onMounted,\n  prop,\n  provide,\n  useEmit,\n  useSlots,\n} from '@vielzeug/ore';\nimport { computed, fromSubscribable, type Readable, signal, watch } from '@vielzeug/ripple';\nimport { createElementSize, createMediaQuery, SentinelUnavailableError } from '@vielzeug/sentinel';\n\nimport '../../content/icon/icon';\nimport { coarsePointerMixin, reducedMotionMixin } from '../../styles';\nimport { computeSafeRel } from '../../utils';\nimport sidebarStyles from './sidebar.css?inline';\nimport groupStyles from './sidebar-group.css?inline';\nimport itemStyles from './sidebar-item.css?inline';\n\n// ─── Types ────────────────────────────────────────────────────────────────\n\ntype SidebarVariant = 'floating' | 'inset';\ntype SidebarCollapseSource = 'api' | 'responsive' | 'toggle';\ntype SidebarMobileSource = 'api' | 'responsive' | 'toggle';\ntype SidebarMode = 'bottom-nav' | 'collapsed' | 'default';\n\ntype BottomNavItem = {\n  active: boolean;\n  disabled: boolean;\n  href?: string;\n  iconName?: string;\n  label: string;\n  source: HTMLElement;\n};\n\nconst parseMaxWidthPx = (query: string | undefined): number | undefined => {\n  const value = String(query ?? '').trim();\n\n  if (!value) return undefined;\n\n  const match = /max-width\\s*:\\s*([0-9]+(?:\\.[0-9]+)?)px/i.exec(value);\n\n  if (!match) return undefined;\n\n  const parsed = Number.parseFloat(match[1]);\n\n  return Number.isFinite(parsed) ? parsed : undefined;\n};\n\nconst resolveContainerElement = (el: HTMLElement): HTMLElement | null => {\n  let container = el.parentElement;\n\n  while (container?.tagName.toLowerCase() === 'ore-grid-item') {\n    container = container.parentElement;\n  }\n\n  return container;\n};\n\nconst readContainerWidth = (el: HTMLElement): number => {\n  const parentWidth = resolveContainerElement(el)?.clientWidth ?? 0;\n\n  if (parentWidth > 0) return parentWidth;\n\n  return el.offsetWidth;\n};\n\nconst deepActiveElement = (): HTMLElement | null => {\n  let active = document.activeElement as HTMLElement | null;\n\n  while (active?.shadowRoot?.activeElement instanceof HTMLElement) {\n    active = active.shadowRoot.activeElement;\n  }\n\n  return active;\n};\n\n/** Context provided by `ore-sidebar` to its `ore-sidebar-group` and `ore-sidebar-item` children. */\nexport type SidebarContext = {\n  closeMobile: () => void;\n  closeOnSelect: Readable<boolean>;\n  collapsed: Readable<boolean>;\n  mobileOpen: Readable<boolean>;\n  mode: Readable<SidebarMode>;\n  variant: Readable<SidebarVariant | undefined>;\n};\n\n/** Injection key for the sidebar context. */\nexport const SIDEBAR_CTX = createContext<SidebarContext>('SidebarContext');\n\n// ─── ore-sidebar styles ──────────────────────────────────────────────────────\n\n/** ore-sidebar element interface */\nexport type SidebarElement = HTMLElement &\n  OreSidebarProps & {\n    /** Close the drawer in bottom-nav mode. */\n    closeMobile(): void;\n    /** Open the drawer in bottom-nav mode. */\n    openMobile(): void;\n    /** Set collapsed state imperatively. */\n    setCollapsed(next: boolean): void;\n    /** Toggle between collapsed and expanded. */\n    toggle(): void;\n    /** Toggle the drawer in bottom-nav mode. */\n    toggleMobile(): void;\n  };\n\n/** Sidebar component properties */\n\nexport type OreSidebarEvents = {\n  'collapsed-change': { collapsed: boolean; source: SidebarCollapseSource };\n  'mobile-open-change': { open: boolean; source: SidebarMobileSource };\n};\n\nexport type OreSidebarGroupEvents = {\n  'open-change': { open: boolean };\n};\n\nexport type OreSidebarProps = {\n  /** CSS media query that switches the sidebar to bottom navigation mode */\n  'bottom-nav-at'?: string;\n  'close-on-select'?: boolean;\n  /** Controlled collapsed state */\n  collapsed?: boolean;\n  /** Whether the sidebar supports collapsing */\n  collapsible?: boolean;\n  'collapse-label'?: string;\n  /** Evaluate responsive and bottom-nav breakpoints against container width only. */\n  'container-breakpoints'?: boolean;\n  /** Initial collapsed state in uncontrolled mode */\n  'default-collapsed'?: boolean;\n  'expand-label'?: string;\n  /**\n   * Accessible label for the navigation landmark.\n   * Use to distinguish multiple navigation regions on a page.\n   * @default 'Sidebar navigation'\n   */\n  label?: string;\n  'mobile-close-label'?: string;\n  /**\n   * CSS media query that, when it matches, automatically collapses the sidebar.\n   * Unset by default — no automatic collapse.\n   * @example 'responsive=\"(max-width: 768px)\"'\n   */\n  responsive?: string;\n  /** Visual style variant */\n  variant?: SidebarVariant;\n};\n\n/**\n * `ore-sidebar` — A collapsible navigation sidebar with group and item support.\n *\n * @element ore-sidebar\n * @element ore-sidebar-group - Labelled group of navigation items\n * @element ore-sidebar-item - Individual navigation link or button\n *\n * @attr {boolean} collapsed - Controlled collapsed state\n * @attr {boolean} default-collapsed - Initial collapsed state for uncontrolled sidebars\n * @attr {boolean} collapsible - Show the collapse toggle button\n * @attr {string} variant - Visual variant: 'floating' | 'inset'\n * @attr {string} label - Accessible aria-label for the nav landmark\n *\n * @fires collapsed-change - Fired when collapsed state changes. detail: { collapsed: boolean; source: string }\n * @fires mobile-open-change - Fired when mobile overlay open state changes. detail: { open: boolean; source: string }\n *\n * @slot header - Branding or logo content above the nav\n * @slot - Navigation content (ore-sidebar-group / ore-sidebar-item)\n * @slot footer - Footer content below the nav (user info, settings, etc.)\n *\n * @cssprop --sidebar-width - Expanded sidebar width (default: 16rem)\n * @cssprop --sidebar-collapsed-width - Collapsed sidebar width (default: 3.5rem)\n * @cssprop --sidebar-bg - Sidebar background color\n * @cssprop --sidebar-border-color - Border color\n *\n * @part mobile-backdrop - Backdrop shown for mobile overlays.\n * @part nav - Navigation container.\n * @part header - Header container.\n * @part toggle-btn - Shadow part for the `toggle-btn` element.\n * @part content - Content container.\n * @part footer - Footer container.\n * @part bottom-bar - Bottom bar container.\n * @part group - Group container.\n * @part group-header - Group header container.\n * @part group-icon - Group icon container.\n * @part group-label - Group label container.\n * @part group-items - Group items container.\n * @part item-icon - Leading item icon container.\n * @part item-label - Item label container.\n * @part item-end - Trailing item content container.\n * @part item - Item root element.\n * @example\n * ```html\n * <ore-sidebar collapsible label=\"App navigation\">\n *   <span slot=\"header\">My App</span>\n *   <ore-sidebar-group label=\"Main\">\n *     <ore-sidebar-item href=\"/dashboard\" active>Dashboard</ore-sidebar-item>\n *     <ore-sidebar-item href=\"/settings\">Settings</ore-sidebar-item>\n *   </ore-sidebar-group>\n * </ore-sidebar>\n *\n * <!-- Auto-collapse on mobile -->\n * <ore-sidebar collapsible responsive=\"(max-width: 768px)\">...</ore-sidebar>\n * ```\n */\nexport const SIDEBAR_TAG = 'ore-sidebar' as const;\ndefine<OreSidebarProps>(SIDEBAR_TAG, {\n  props: {\n    'bottom-nav-at': prop.string(),\n    'close-on-select': prop.bool(false),\n    'collapse-label': prop.string('Collapse sidebar'),\n    collapsed: prop.bool(false),\n    collapsible: prop.bool(false),\n    'container-breakpoints': prop.bool(false),\n    'default-collapsed': prop.bool(false),\n    'expand-label': prop.string('Expand sidebar'),\n    label: prop.string('Sidebar navigation'),\n    'mobile-close-label': prop.string('Close sidebar'),\n    responsive: prop.string(),\n    variant: prop.string<SidebarVariant>(),\n  },\n  setup(props) {\n    const el = getHost();\n    const emit = useEmit<OreSidebarEvents>();\n    const slots = useSlots();\n\n    const hasHeader = () => slots.has('header').value;\n    const hasFooter = () => slots.has('footer').value;\n    const hasLogo = () => slots.has('logo').value;\n\n    const isControlled = signal(el.hasAttribute('collapsed'));\n    const collapsedState = signal(isControlled.value ? el.hasAttribute('collapsed') : props['default-collapsed'].value);\n    const isBottomNav = signal(false);\n    const isMobileOpen = signal(false);\n    const bottomNavItems = signal<BottomNavItem[]>([]);\n    const responsiveMediaMatches = signal(false);\n    const responsiveSizeMatches = signal(false);\n    const responsiveMaxWidthPx = signal<number | undefined>(parseMaxWidthPx(props.responsive.value));\n    const hasResponsiveQuery = signal(Boolean(String(props.responsive.value ?? '').trim()));\n    const bottomNavMediaMatches = signal(false);\n    const bottomNavSizeMatches = signal(false);\n    const bottomNavMaxWidthPx = signal<number | undefined>(parseMaxWidthPx(props['bottom-nav-at'].value));\n    const isPreviewMode = signal(false);\n    let focusReturnTarget: HTMLElement | null = null;\n\n    const isCollapsed = () => collapsedState.value;\n    const mode = computed<SidebarMode>(() => {\n      if (isBottomNav.value) return 'bottom-nav';\n\n      return collapsedState.value ? 'collapsed' : 'default';\n    });\n\n    const applyResponsiveState = () => {\n      const useContainerBreakpoints = props['container-breakpoints'].value;\n      const responsiveMatched = useContainerBreakpoints\n        ? responsiveSizeMatches.value\n        : responsiveMediaMatches.value || responsiveSizeMatches.value;\n      const bottomMatched = useContainerBreakpoints\n        ? bottomNavSizeMatches.value\n        : bottomNavMediaMatches.value || bottomNavSizeMatches.value;\n\n      // If the mobile drawer is currently open, stay in bottom-nav mode\n      // regardless of the responsive match. This prevents the drawer from\n      // disappearing mid-animation or if forced open via the API on desktop.\n      if (!isMobileOpen.value) {\n        isBottomNav.value = bottomMatched;\n      }\n\n      if (!bottomMatched && !isMobileOpen.value) {\n        setMobileOpen(false, 'responsive');\n      }\n\n      if (hasResponsiveQuery.value) {\n        setCollapsed(responsiveMatched, 'responsive');\n      }\n    };\n\n    const readBottomNavItems = () => {\n      const directItems = slots\n        .elements()\n        .value.filter(\n          (item): item is HTMLElement =>\n            item instanceof HTMLElement && item.tagName.toLowerCase() === 'ore-sidebar-item',\n        );\n      const promotedItems = [...el.querySelectorAll<HTMLElement>('ore-sidebar-item[bottom-nav]')];\n      const sourceItems = promotedItems.length > 0 ? promotedItems : directItems;\n      const next = sourceItems.map((item, index) => {\n        const el = item;\n        const iconSlotEl =\n          (el.querySelector(':scope > [slot=\"icon\"]') as HTMLElement | null) ??\n          (el.querySelector('[slot=\"icon\"]') as HTMLElement | null);\n        const directIconName =\n          iconSlotEl?.tagName.toLowerCase() === 'ore-icon' ? iconSlotEl.getAttribute('name') : null;\n        const nestedIconName = iconSlotEl?.querySelector('ore-icon')?.getAttribute('name') ?? null;\n        const rawLabel = (el.textContent ?? '').trim();\n\n        return {\n          active: el.hasAttribute('active'),\n          disabled: el.hasAttribute('disabled'),\n          href: el.getAttribute('href') ?? undefined,\n          iconName: directIconName ?? nestedIconName ?? undefined,\n          label: el.getAttribute('bottom-nav-label')?.trim() || rawLabel || `Item ${index + 1}`,\n          source: el,\n        } satisfies BottomNavItem;\n      });\n\n      bottomNavItems.value = next;\n    };\n\n    provide(SIDEBAR_CTX, {\n      closeMobile: () => setMobileOpen(false, 'toggle'),\n      closeOnSelect: props['close-on-select'],\n      collapsed: computed(() => !isBottomNav.value && collapsedState.value) as Readable<boolean>,\n      mobileOpen: computed(() => isBottomNav.value && isMobileOpen.value) as Readable<boolean>,\n      mode: mode as Readable<SidebarMode>,\n      variant: props.variant,\n    });\n\n    const setCollapsed = (next: boolean, source: SidebarCollapseSource) => {\n      if (isCollapsed() === next) return;\n\n      if (!isControlled.value) {\n        collapsedState.value = next;\n      }\n\n      emit('collapsed-change', { collapsed: next, source });\n    };\n\n    const setMobileOpen = (next: boolean, source: SidebarMobileSource) => {\n      const open = Boolean(next);\n\n      if (open && !isBottomNav.value) {\n        isBottomNav.value = true;\n      }\n\n      if (!isBottomNav.value && !open) {\n        if (isMobileOpen.value) {\n          isMobileOpen.value = false;\n        }\n\n        return;\n      }\n\n      if (isMobileOpen.value === open) return;\n\n      if (open) focusReturnTarget = deepActiveElement();\n\n      isMobileOpen.value = open;\n\n      // If closing, re-evaluate responsive state to potentially exit forced bottom-nav mode\n      if (!open) {\n        applyResponsiveState();\n        queueMicrotask(() => {\n          if (focusReturnTarget?.isConnected) focusReturnTarget.focus();\n          focusReturnTarget = null;\n        });\n      } else {\n        queueMicrotask(() => el.shadowRoot?.querySelector<HTMLElement>('nav')?.focus());\n      }\n\n      emit('mobile-open-change', { open, source });\n    };\n\n    const doToggle = () => {\n      setCollapsed(!isCollapsed(), 'toggle');\n    };\n\n    const sidebarEl = el as SidebarElement;\n\n    sidebarEl.setCollapsed = (next) => setCollapsed(Boolean(next), 'api');\n    sidebarEl.toggle = doToggle;\n    sidebarEl.openMobile = () => setMobileOpen(true, 'api');\n    sidebarEl.closeMobile = () => setMobileOpen(false, 'api');\n    sidebarEl.toggleMobile = () => setMobileOpen(!isMobileOpen.value, 'toggle');\n\n    bind({\n      attr: {\n        'data-bottom-nav': () => (isBottomNav.value ? true : undefined),\n        'data-collapsed': () => (isCollapsed() && !isBottomNav.value ? true : undefined),\n        'data-has-logo': () => (hasLogo() ? true : undefined),\n        'data-mobile-open': () => (isBottomNav.value && isMobileOpen.value ? true : undefined),\n        'data-preview-mode': () => (isPreviewMode.value ? true : undefined),\n      },\n    });\n\n    onMounted(() => {\n      // Suppress transitions during initial layout so the sidebar doesn't\n      // animate from a collapsed/0 state before the first ResizeObserver fires.\n      el.setAttribute('data-no-transition', '');\n\n      let transitionUnlocked = false;\n      const unlockTransition = () => {\n        if (transitionUnlocked) return;\n\n        transitionUnlocked = true;\n        el.removeAttribute('data-no-transition');\n      };\n\n      // Fallback: unlock after two frames in case ResizeObserver doesn't fire.\n      requestAnimationFrame(() => requestAnimationFrame(unlockTransition));\n\n      let mediaCleanup: (() => void) | undefined;\n      let bottomNavCleanup: (() => void) | undefined;\n      const itemObservers = new Map<HTMLElement, MutationObserver>();\n      const observer = new MutationObserver(() => {\n        if (!el.hasAttribute('collapsed') && !isControlled.value) return;\n\n        isControlled.value = true;\n        collapsedState.value = el.hasAttribute('collapsed');\n      });\n\n      observer.observe(el, {\n        attributeFilter: ['collapsed'],\n        attributes: true,\n      });\n      const closeOnEscape = (event: KeyboardEvent) => {\n        if (event.key !== 'Escape' || !isMobileOpen.value) return;\n\n        event.preventDefault();\n        setMobileOpen(false, 'toggle');\n      };\n      el.addEventListener('keydown', closeOnEscape);\n\n      watch(\n        props.responsive,\n        (query) => {\n          mediaCleanup?.();\n          mediaCleanup = undefined;\n\n          const mediaQuery = String(query ?? '').trim();\n\n          hasResponsiveQuery.value = Boolean(mediaQuery);\n          responsiveMaxWidthPx.value = parseMaxWidthPx(mediaQuery);\n          responsiveMediaMatches.value = false;\n\n          const width = readContainerWidth(el);\n\n          responsiveSizeMatches.value =\n            width > 0 && responsiveMaxWidthPx.value != null ? width <= responsiveMaxWidthPx.value : false;\n          applyResponsiveState();\n\n          // For parseable max-width queries, keep behavior container-driven.\n          // This avoids preview viewport controls being overridden by window width.\n          if (props['container-breakpoints'].value && responsiveMaxWidthPx.value != null) {\n            return;\n          }\n\n          if (!mediaQuery) {\n            return;\n          }\n\n          try {\n            const mediaHandle = createMediaQuery(mediaQuery);\n            const syncMedia = (state: ReturnType<typeof mediaHandle.getSnapshot>) => {\n              if (state) {\n                responsiveMediaMatches.value = state.matches;\n                applyResponsiveState();\n              }\n            };\n\n            syncMedia(mediaHandle.getSnapshot());\n\n            const mediaCleanupFn = watch(\n              fromSubscribable(mediaHandle, { signal: mediaHandle.disposalSignal }),\n              syncMedia,\n            );\n            mediaCleanup = () => {\n              mediaCleanupFn.dispose();\n              mediaHandle.dispose();\n            };\n          } catch (error) {\n            if (!(error instanceof SentinelUnavailableError)) throw error;\n          }\n        },\n        { immediate: true },\n      );\n\n      watch(\n        props['bottom-nav-at'],\n        (query) => {\n          bottomNavCleanup?.();\n          bottomNavCleanup = undefined;\n\n          const mediaQuery = String(query ?? '').trim();\n\n          bottomNavMaxWidthPx.value = parseMaxWidthPx(mediaQuery);\n          bottomNavMediaMatches.value = false;\n\n          const width = readContainerWidth(el);\n\n          bottomNavSizeMatches.value =\n            width > 0 && bottomNavMaxWidthPx.value != null ? width <= bottomNavMaxWidthPx.value : false;\n          applyResponsiveState();\n\n          // For parseable max-width queries, keep behavior container-driven.\n          // This avoids preview viewport controls being overridden by window width.\n          if (props['container-breakpoints'].value && bottomNavMaxWidthPx.value != null) {\n            return;\n          }\n\n          if (!mediaQuery) {\n            return;\n          }\n\n          try {\n            const mediaHandle = createMediaQuery(mediaQuery);\n            const syncMedia = (state: ReturnType<typeof mediaHandle.getSnapshot>) => {\n              if (state) {\n                bottomNavMediaMatches.value = state.matches;\n                applyResponsiveState();\n              }\n            };\n\n            syncMedia(mediaHandle.getSnapshot());\n\n            const mediaCleanupFn = watch(\n              fromSubscribable(mediaHandle, { signal: mediaHandle.disposalSignal }),\n              syncMedia,\n            );\n            bottomNavCleanup = () => {\n              mediaCleanupFn.dispose();\n              mediaHandle.dispose();\n            };\n          } catch (error) {\n            if (!(error instanceof SentinelUnavailableError)) throw error;\n          }\n        },\n        { immediate: true },\n      );\n\n      const stopResizeEffect =\n        typeof ResizeObserver === 'function'\n          ? (() => {\n              const hostSize = createElementSize(el);\n              onCleanup(() => hostSize.dispose());\n              const hostSizeSignal = fromSubscribable(hostSize, { signal: hostSize.disposalSignal });\n\n              const wrapperEl = el.parentElement;\n              const containerEl = resolveContainerElement(el);\n              const wrapperSize = wrapperEl ? createElementSize(wrapperEl) : undefined;\n              const parentSize = containerEl && containerEl !== wrapperEl ? createElementSize(containerEl) : undefined;\n\n              if (wrapperSize) {\n                onCleanup(() => wrapperSize.dispose());\n              }\n              if (parentSize) {\n                onCleanup(() => parentSize.dispose());\n              }\n\n              const wrapperSizeSignal = wrapperSize\n                ? fromSubscribable(wrapperSize, { signal: wrapperSize.disposalSignal })\n                : undefined;\n              const parentSizeSignal = parentSize\n                ? fromSubscribable(parentSize, { signal: parentSize.disposalSignal })\n                : undefined;\n\n              let rafId: number | undefined;\n\n              const onResize = () => {\n                if (rafId !== undefined) cancelAnimationFrame(rafId);\n\n                rafId = requestAnimationFrame(() => {\n                  const resolvedContainer = resolveContainerElement(el);\n                  const width = readContainerWidth(el);\n                  const responsiveWasMatched = responsiveSizeMatches.value;\n                  const bottomNavWasMatched = bottomNavSizeMatches.value;\n                  const parentWidth = resolvedContainer?.clientWidth ?? 0;\n\n                  isPreviewMode.value = parentWidth > 0 && parentWidth < window.innerWidth;\n\n                  responsiveSizeMatches.value =\n                    width > 0 && responsiveMaxWidthPx.value != null ? width <= responsiveMaxWidthPx.value : false;\n                  bottomNavSizeMatches.value =\n                    width > 0 && bottomNavMaxWidthPx.value != null ? width <= bottomNavMaxWidthPx.value : false;\n\n                  if (\n                    responsiveWasMatched !== responsiveSizeMatches.value ||\n                    bottomNavWasMatched !== bottomNavSizeMatches.value\n                  ) {\n                    applyResponsiveState();\n                  }\n\n                  unlockTransition();\n                });\n              };\n\n              return watch(\n                computed(() => [\n                  hostSizeSignal.value?.width,\n                  hostSizeSignal.value?.height,\n                  wrapperSizeSignal?.value?.width,\n                  wrapperSizeSignal?.value?.height,\n                  parentSizeSignal?.value?.width,\n                  parentSizeSignal?.value?.height,\n                ]),\n                onResize,\n              );\n            })()\n          : undefined;\n\n      const bindItemObservers = (items: HTMLElement[]) => {\n        const set = new Set(items);\n\n        for (const [item, cleanup] of itemObservers) {\n          if (set.has(item)) continue;\n\n          cleanup.disconnect();\n          itemObservers.delete(item);\n        }\n\n        for (const item of items) {\n          if (itemObservers.has(item)) continue;\n\n          const itemObserver = new MutationObserver(() => {\n            // Only update if in bottom-nav mode to minimize re-renders\n            if (isBottomNav.value) {\n              readBottomNavItems();\n            }\n          });\n\n          // Watch attributes and content that affect bottom-nav rendering.\n          itemObserver.observe(item, {\n            attributeFilter: ['active', 'bottom-nav', 'bottom-nav-label', 'disabled', 'href'],\n            attributes: true,\n            characterData: true,\n            childList: true,\n            subtree: true,\n          });\n          itemObservers.set(item, itemObserver);\n        }\n      };\n\n      const syncBottomNavItems = () => {\n        bindItemObservers([...el.querySelectorAll<HTMLElement>('ore-sidebar-item')]);\n        readBottomNavItems();\n      };\n      watch(slots.elements(), syncBottomNavItems, { immediate: true });\n      const nestedItemsObserver = new MutationObserver(syncBottomNavItems);\n      nestedItemsObserver.observe(el, { childList: true, subtree: true });\n\n      return () => {\n        observer.disconnect();\n        nestedItemsObserver.disconnect();\n        el.removeEventListener('keydown', closeOnEscape);\n        mediaCleanup?.();\n        bottomNavCleanup?.();\n        stopResizeEffect?.dispose();\n\n        for (const itemObserver of itemObservers.values()) {\n          itemObserver.disconnect();\n        }\n\n        itemObservers.clear();\n      };\n    });\n\n    return html`\n      <button\n        class=\"mobile-backdrop\"\n        part=\"mobile-backdrop\"\n        type=\"button\"\n        aria-label=\"${props['mobile-close-label']}\"\n        ?hidden=${() => !isBottomNav.value || !isMobileOpen.value}\n        @click=${() => setMobileOpen(false, 'toggle')}></button>\n      <nav\n        aria-label=\"${props.label}\"\n        aria-hidden=${() => (isBottomNav.value && !isMobileOpen.value ? 'true' : null)}\n        part=\"nav\"\n        tabindex=\"-1\"\n        ?inert=${() => isBottomNav.value && !isMobileOpen.value}>\n        <div class=\"sidebar-header\" part=\"header\" ?hidden=${() => !hasHeader() && !props.collapsible.value}>\n          <span class=\"sidebar-logo\" ?hidden=${() => !hasLogo()}>\n            <slot name=\"logo\"></slot>\n          </span>\n          <span class=\"sidebar-header-content\">\n            <slot name=\"header\"></slot>\n          </span>\n          <button\n            class=\"toggle-btn\"\n            part=\"toggle-btn\"\n            type=\"button\"\n            ?hidden=${() => !props.collapsible.value}\n            aria-label=\"${() => (isCollapsed() ? props['expand-label'].value : props['collapse-label'].value)}\"\n            aria-expanded=\"${() => !isCollapsed()}\"\n            @click=\"${doToggle}\">\n            <ore-icon\n              class=\"toggle-icon\"\n              name=${() => (isCollapsed() ? 'panel-left-open' : 'panel-left-close')}\n              size=\"18\"\n              stroke-width=\"2\"\n              aria-hidden=\"true\"></ore-icon>\n          </button>\n        </div>\n        <div class=\"sidebar-content\" part=\"content\">\n          <slot></slot>\n        </div>\n        <div class=\"sidebar-footer\" part=\"footer\" ?hidden=${() => !hasFooter()}>\n          <slot name=\"footer\"></slot>\n        </div>\n      </nav>\n\n      <div class=\"bottom-bar\" part=\"bottom-bar\" ?hidden=${() => !isBottomNav.value}>\n        ${() =>\n          bottomNavItems.value.map((item) => {\n            const className = `bottom-tab${item.active ? ' bottom-tab-active' : ''}`;\n\n            if (item.href && !item.disabled) {\n              return html`\n                <a\n                  class=\"${className}\"\n                  href=\"${item.href}\"\n                  aria-current=\"${item.active ? 'page' : null}\"\n                  data-active=\"${item.active ? 'true' : null}\">\n                  <span class=\"bottom-tab-icon\" aria-hidden=\"true\" ?hidden=${() => !item.iconName}>\n                    <ore-icon name=\"${item.iconName}\" size=\"18\" stroke-width=\"2\"></ore-icon>\n                  </span>\n                  <span class=\"bottom-tab-label\">${item.label}</span>\n                </a>\n              `;\n            }\n\n            return html`\n              <button\n                class=\"${className}\"\n                type=\"button\"\n                ?disabled=${item.disabled}\n                aria-current=\"${item.active ? 'page' : null}\"\n                data-active=\"${item.active ? 'true' : null}\"\n                @click=${() => item.source.click()}>\n                <span class=\"bottom-tab-icon\" aria-hidden=\"true\" ?hidden=${() => !item.iconName}>\n                  <ore-icon name=\"${item.iconName}\" size=\"18\" stroke-width=\"2\"></ore-icon>\n                </span>\n                <span class=\"bottom-tab-label\">${item.label}</span>\n              </button>\n            `;\n          })}\n      </div>\n    `;\n  },\n  styles: [coarsePointerMixin, reducedMotionMixin, sidebarStyles],\n});\n\n// ─── ore-sidebar-group styles ────────────────────────────────────────────────\n\n/** Sidebar group properties */\nexport type OreSidebarGroupProps = {\n  /** Whether this group can be collapsed */\n  collapsible?: boolean;\n  /** Initial open state in uncontrolled mode */\n  'default-open'?: boolean;\n  /** Accessible label for the group */\n  label?: string;\n  /** Controlled open state */\n  open?: boolean;\n};\n\n/**\n * `ore-sidebar-group` — A labelled section within `ore-sidebar`.\n *\n * @element ore-sidebar-group\n *\n * @attr {string} label - Group label text\n * @attr {boolean} collapsible - Whether this group can be toggled open/closed\n * @attr {boolean} open - Controlled expanded state\n * @attr {boolean} default-open - Initial expanded state in uncontrolled mode\n *\n * @fires open-change - Fired when the group open state changes (collapsible groups only). detail: { open: boolean }\n *\n * @slot - Navigation items (`ore-sidebar-item`)\n * @slot icon - Icon displayed before the label\n *\n * @example\n * ```html\n * <ore-sidebar-group label=\"Main\" collapsible open>\n *   <ore-sidebar-item href=\"/home\">Home</ore-sidebar-item>\n * </ore-sidebar-group>\n * ```\n */\nexport const SIDEBAR_GROUP_TAG = 'ore-sidebar-group' as const;\ndefine<OreSidebarGroupProps>(SIDEBAR_GROUP_TAG, {\n  props: {\n    collapsible: prop.bool(false),\n    'default-open': prop.bool(true),\n    label: prop.string(),\n    open: {\n      default: undefined as boolean | undefined,\n      parse: (value: string | null) => (value == null ? undefined : value === '' || value === 'true'),\n      reflect: false,\n    },\n  },\n  setup(props) {\n    const slots = useSlots();\n\n    const hasIcon = () => slots.has('icon').value;\n    const sidebarCtx = inject(SIDEBAR_CTX);\n\n    bind({\n      attr: {\n        'sidebar-bottom-nav': () =>\n          sidebarCtx?.mode.value === 'bottom-nav' && !sidebarCtx?.mobileOpen.value ? true : undefined,\n        'sidebar-collapsed': () => (sidebarCtx?.collapsed.value ? true : undefined),\n      },\n    });\n\n    const isControlled = () => props.open.value !== undefined;\n    const openState = signal(props['default-open'].value);\n    const isOpen = computed(() => {\n      if (!props.collapsible.value) return true;\n\n      if (isControlled()) return props.open.value ?? false;\n\n      return openState.value;\n    });\n\n    watch(props.open, (value) => {\n      if (value === undefined) return;\n\n      openState.value = value;\n    });\n\n    bind({\n      attr: {\n        open: () => (isOpen.value ? true : undefined),\n      },\n    });\n\n    return html`\n      <details class=\"group\" part=\"group\" ?open=${isOpen}>\n        <summary\n          class=\"group-header\"\n          part=\"group-header\"\n          aria-expanded=\"${() => (props.collapsible.value ? String(props.open.value) : null)}\"\n          @click=${(e: MouseEvent) => {\n            if (!props.collapsible.value) {\n              e.preventDefault();\n            }\n          }}>\n          <span class=\"group-icon\" part=\"group-icon\" ?hidden=${() => !hasIcon()} aria-hidden=\"true\">\n            <slot name=\"icon\"></slot>\n          </span>\n          <span class=\"group-label\" part=\"group-label\">${props.label}</span>\n          <span class=\"chevron\" ?hidden=${() => !props.collapsible.value} aria-hidden=\"true\">\n            <ore-icon name=\"chevron-right\" size=\"12\" stroke-width=\"2\" aria-hidden=\"true\"></ore-icon>\n          </span>\n        </summary>\n        <div class=\"group-items\" part=\"group-items\" role=\"list\">\n          <slot></slot>\n        </div>\n      </details>\n    `;\n  },\n  styles: [reducedMotionMixin, groupStyles],\n});\n\n// ─── ore-sidebar-item styles ─────────────────────────────────────────────────\n\n/** Sidebar item properties */\nexport type OreSidebarItemProps = {\n  /** Whether this item represents the current page/section */\n  active?: boolean;\n  'bottom-nav'?: boolean;\n  'bottom-nav-label'?: string;\n  /** Whether this item is disabled */\n  disabled?: boolean;\n  /** Navigation href — renders an `<a>` when set, otherwise a `<button>` */\n  href?: string;\n  label?: string;\n  /**\n   * Relationship of the linked URL (`rel` attribute on the inner `<a>`).\n   * Only applies when `href` is set.\n   */\n  rel?: string;\n  /**\n   * Browsing context for the link (`target` attribute on the inner `<a>`).\n   * Only applies when `href` is set.\n   */\n  target?: string;\n};\n\n/**\n * `ore-sidebar-item` — An individual navigation item in a `ore-sidebar`.\n *\n * Renders as an `<a>` when `href` is provided, otherwise as a `<button>`.\n * Marks the active page via `aria-current=\"page\"` when the `active` attribute is set.\n *\n * @element ore-sidebar-item\n *\n * @attr {string} href - Link URL; renders an anchor when set\n * @attr {boolean} active - Marks the item as the current page\n * @attr {boolean} disabled - Disables the item\n * @attr {string} rel - Anchor `rel` attribute (links only)\n * @attr {string} target - Anchor `target` attribute (links only)\n *\n * @slot - Label text\n * @slot icon - Leading icon\n * @slot end - Trailing content (badge, shortcut, arrow, etc.)\n *\n * @cssprop --sidebar-item-color - Default text color\n * @cssprop --sidebar-item-hover-bg - Hover background\n * @cssprop --sidebar-item-hover-color - Hover text color\n * @cssprop --sidebar-item-active-bg - Active background\n * @cssprop --sidebar-item-active-color - Active text color\n * @cssprop --sidebar-item-indicator - Active indicator bar color\n *\n * @part item - The inner anchor or button element\n * @part item-icon - The icon wrapper\n * @part item-label - The label wrapper\n * @part item-end - The trailing content wrapper\n *\n * @example\n * ```html\n * <ore-sidebar-item href=\"/dashboard\" active>\n *   <span slot=\"icon\">🏠</span>\n *   Dashboard\n * </ore-sidebar-item>\n *\n * <ore-sidebar-item href=\"/users\">\n *   <span slot=\"icon\">👤</span>\n *   Users\n *   <ore-badge slot=\"end\" color=\"primary\">3</ore-badge>\n * </ore-sidebar-item>\n * ```\n */\nexport const SIDEBAR_ITEM_TAG = 'ore-sidebar-item' as const;\ndefine<OreSidebarItemProps>(SIDEBAR_ITEM_TAG, {\n  props: {\n    active: prop.bool(false),\n    'bottom-nav': prop.bool(false),\n    'bottom-nav-label': prop.string(),\n    disabled: prop.bool(false),\n    href: prop.string(),\n    label: prop.string(),\n    rel: prop.string(),\n    target: prop.string(),\n  },\n  setup(props) {\n    const slots = useSlots();\n\n    const hasIcon = () => slots.has('icon').value;\n    const hasEnd = () => slots.has('end').value;\n    const sidebarCtx = inject(SIDEBAR_CTX);\n\n    bind({\n      attr: {\n        'sidebar-bottom-nav': () =>\n          sidebarCtx?.mode.value === 'bottom-nav' && !sidebarCtx?.mobileOpen.value ? true : undefined,\n        'sidebar-collapsed': () => (sidebarCtx?.collapsed.value ? true : undefined),\n      },\n    });\n\n    const isLink = () => !!props.href.value && !props.disabled.value;\n\n    // Prevent reverse tabnapping: auto-inject noopener + noreferrer for _blank links.\n    const effectiveRel = computed(() => computeSafeRel(props.rel.value, props.target.value));\n    const closeMobileOnSelect = (event: MouseEvent) => {\n      if (!sidebarCtx?.closeOnSelect.value || !sidebarCtx.mobileOpen.value) return;\n      if (event.button !== 0 || event.metaKey || event.ctrlKey || event.shiftKey || event.altKey) return;\n\n      queueMicrotask(sidebarCtx.closeMobile);\n    };\n\n    const renderItemContent = () => html`\n      <span class=\"item-icon\" part=\"item-icon\" ?hidden=${() => !hasIcon()} aria-hidden=\"true\">\n        <slot name=\"icon\"></slot>\n      </span>\n      <span class=\"item-label\" part=\"item-label\"><slot></slot></span>\n      <span class=\"item-end\" part=\"item-end\" ?hidden=${() => !hasEnd()}>\n        <slot name=\"end\"></slot>\n      </span>\n    `;\n\n    return html`\n      ${() => {\n        if (isLink()) {\n          return html`\n            <a\n              class=\"item\"\n              part=\"item\"\n              href=\"${props.href}\"\n              rel=\"${effectiveRel}\"\n              target=\"${props.target}\"\n              aria-label=\"${props.label}\"\n              aria-current=\"${() => (props.active.value ? 'page' : null)}\"\n              @click=${closeMobileOnSelect}>\n              ${renderItemContent()}\n            </a>\n          `;\n        }\n\n        if (props.disabled.value) {\n          return html`\n            <div\n              class=\"item\"\n              part=\"item\"\n              aria-disabled=\"true\"\n              tabindex=\"-1\"\n              aria-label=\"${props.label}\"\n              aria-current=\"${() => (props.active.value ? 'page' : null)}\">\n              ${renderItemContent()}\n            </div>\n          `;\n        }\n\n        return html`\n          <button\n            class=\"item\"\n            part=\"item\"\n            type=\"button\"\n            ?disabled=\"${props.disabled}\"\n            aria-label=\"${props.label}\"\n            aria-current=\"${() => (props.active.value ? 'page' : null)}\"\n            @click=${closeMobileOnSelect}>\n            ${renderItemContent()}\n          </button>\n        `;\n      }}\n    `;\n  },\n  styles: [coarsePointerMixin, itemStyles],\n});\n"],"mappings":"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"}

package/dist/sidebar.js

@@ -206,7 +206,12 @@ c(A, {
         aria-label="${e["mobile-close-label"]}"
         ?hidden=${() => !m.value || !A.value}
         @click=${() => K(!1, "toggle")}></button>
-      <nav aria-label="${e.label}" part="nav" tabindex="-1">
+      <nav
+        aria-label="${e.label}"
+        aria-hidden=${() => m.value && !A.value ? "true" : null}
+        part="nav"
+        tabindex="-1"
+        ?inert=${() => m.value && !A.value}>
         <div class="sidebar-header" part="header" ?hidden=${() => !i() && !e.collapsible.value}>
           <span class="sidebar-logo" ?hidden=${() => !s()}>
             <slot name="logo"></slot>
@@ -330,6 +335,7 @@ c(M, {
 		"bottom-nav-label": m.string(),
 		disabled: m.bool(!1),
 		href: m.string(),
+		label: m.string(),
 		rel: m.string(),
 		target: m.string()
 	},
@@ -358,6 +364,7 @@ c(M, {
               href="${e.href}"
               rel="${c}"
               target="${e.target}"
+              aria-label="${e.label}"
               aria-current="${() => e.active.value ? "page" : null}"
               @click=${l}>
               ${f()}
@@ -368,6 +375,7 @@ c(M, {
               part="item"
               aria-disabled="true"
               tabindex="-1"
+              aria-label="${e.label}"
               aria-current="${() => e.active.value ? "page" : null}">
               ${f()}
             </div>
@@ -377,6 +385,7 @@ c(M, {
             part="item"
             type="button"
             ?disabled="${e.disabled}"
+            aria-label="${e.label}"
             aria-current="${() => e.active.value ? "page" : null}"
             @click=${l}>
             ${f()}

package/dist/sidebar.js.map

@@ -1 +1 @@
-{"version":3,"file":"sidebar.js","names":[],"sources":["../src/layout/sidebar/sidebar.ts"],"sourcesContent":["import {\n  bind,\n  createContext,\n  define,\n  getHost,\n  html,\n  inject,\n  onCleanup,\n  onMounted,\n  prop,\n  provide,\n  useEmit,\n  useSlots,\n} from '@vielzeug/ore';\nimport { computed, fromSubscribable, type Readable, signal, watch } from '@vielzeug/ripple';\nimport { createElementSize, createMediaQuery, SentinelUnavailableError } from '@vielzeug/sentinel';\n\nimport '../../content/icon/icon';\nimport { coarsePointerMixin, reducedMotionMixin } from '../../styles';\nimport { computeSafeRel } from '../../utils';\nimport sidebarStyles from './sidebar.css?inline';\nimport groupStyles from './sidebar-group.css?inline';\nimport itemStyles from './sidebar-item.css?inline';\n\n// ─── Types ────────────────────────────────────────────────────────────────\n\ntype SidebarVariant = 'floating' | 'inset';\ntype SidebarCollapseSource = 'api' | 'responsive' | 'toggle';\ntype SidebarMobileSource = 'api' | 'responsive' | 'toggle';\ntype SidebarMode = 'bottom-nav' | 'collapsed' | 'default';\n\ntype BottomNavItem = {\n  active: boolean;\n  disabled: boolean;\n  href?: string;\n  iconName?: string;\n  label: string;\n  source: HTMLElement;\n};\n\nconst parseMaxWidthPx = (query: string | undefined): number | undefined => {\n  const value = String(query ?? '').trim();\n\n  if (!value) return undefined;\n\n  const match = /max-width\\s*:\\s*([0-9]+(?:\\.[0-9]+)?)px/i.exec(value);\n\n  if (!match) return undefined;\n\n  const parsed = Number.parseFloat(match[1]);\n\n  return Number.isFinite(parsed) ? parsed : undefined;\n};\n\nconst resolveContainerElement = (el: HTMLElement): HTMLElement | null => {\n  let container = el.parentElement;\n\n  while (container?.tagName.toLowerCase() === 'ore-grid-item') {\n    container = container.parentElement;\n  }\n\n  return container;\n};\n\nconst readContainerWidth = (el: HTMLElement): number => {\n  const parentWidth = resolveContainerElement(el)?.clientWidth ?? 0;\n\n  if (parentWidth > 0) return parentWidth;\n\n  return el.offsetWidth;\n};\n\nconst deepActiveElement = (): HTMLElement | null => {\n  let active = document.activeElement as HTMLElement | null;\n\n  while (active?.shadowRoot?.activeElement instanceof HTMLElement) {\n    active = active.shadowRoot.activeElement;\n  }\n\n  return active;\n};\n\n/** Context provided by `ore-sidebar` to its `ore-sidebar-group` and `ore-sidebar-item` children. */\nexport type SidebarContext = {\n  closeMobile: () => void;\n  closeOnSelect: Readable<boolean>;\n  collapsed: Readable<boolean>;\n  mobileOpen: Readable<boolean>;\n  mode: Readable<SidebarMode>;\n  variant: Readable<SidebarVariant | undefined>;\n};\n\n/** Injection key for the sidebar context. */\nexport const SIDEBAR_CTX = createContext<SidebarContext>('SidebarContext');\n\n// ─── ore-sidebar styles ──────────────────────────────────────────────────────\n\n/** ore-sidebar element interface */\nexport type SidebarElement = HTMLElement &\n  OreSidebarProps & {\n    /** Close the drawer in bottom-nav mode. */\n    closeMobile(): void;\n    /** Open the drawer in bottom-nav mode. */\n    openMobile(): void;\n    /** Set collapsed state imperatively. */\n    setCollapsed(next: boolean): void;\n    /** Toggle between collapsed and expanded. */\n    toggle(): void;\n    /** Toggle the drawer in bottom-nav mode. */\n    toggleMobile(): void;\n  };\n\n/** Sidebar component properties */\n\nexport type OreSidebarEvents = {\n  'collapsed-change': { collapsed: boolean; source: SidebarCollapseSource };\n  'mobile-open-change': { open: boolean; source: SidebarMobileSource };\n};\n\nexport type OreSidebarGroupEvents = {\n  'open-change': { open: boolean };\n};\n\nexport type OreSidebarProps = {\n  /** CSS media query that switches the sidebar to bottom navigation mode */\n  'bottom-nav-at'?: string;\n  'close-on-select'?: boolean;\n  /** Controlled collapsed state */\n  collapsed?: boolean;\n  /** Whether the sidebar supports collapsing */\n  collapsible?: boolean;\n  'collapse-label'?: string;\n  /** Evaluate responsive and bottom-nav breakpoints against container width only. */\n  'container-breakpoints'?: boolean;\n  /** Initial collapsed state in uncontrolled mode */\n  'default-collapsed'?: boolean;\n  'expand-label'?: string;\n  /**\n   * Accessible label for the navigation landmark.\n   * Use to distinguish multiple navigation regions on a page.\n   * @default 'Sidebar navigation'\n   */\n  label?: string;\n  'mobile-close-label'?: string;\n  /**\n   * CSS media query that, when it matches, automatically collapses the sidebar.\n   * Unset by default — no automatic collapse.\n   * @example 'responsive=\"(max-width: 768px)\"'\n   */\n  responsive?: string;\n  /** Visual style variant */\n  variant?: SidebarVariant;\n};\n\n/**\n * `ore-sidebar` — A collapsible navigation sidebar with group and item support.\n *\n * @element ore-sidebar\n * @element ore-sidebar-group - Labelled group of navigation items\n * @element ore-sidebar-item - Individual navigation link or button\n *\n * @attr {boolean} collapsed - Controlled collapsed state\n * @attr {boolean} default-collapsed - Initial collapsed state for uncontrolled sidebars\n * @attr {boolean} collapsible - Show the collapse toggle button\n * @attr {string} variant - Visual variant: 'floating' | 'inset'\n * @attr {string} label - Accessible aria-label for the nav landmark\n *\n * @fires collapsed-change - Fired when collapsed state changes. detail: { collapsed: boolean; source: string }\n * @fires mobile-open-change - Fired when mobile overlay open state changes. detail: { open: boolean; source: string }\n *\n * @slot header - Branding or logo content above the nav\n * @slot - Navigation content (ore-sidebar-group / ore-sidebar-item)\n * @slot footer - Footer content below the nav (user info, settings, etc.)\n *\n * @cssprop --sidebar-width - Expanded sidebar width (default: 16rem)\n * @cssprop --sidebar-collapsed-width - Collapsed sidebar width (default: 3.5rem)\n * @cssprop --sidebar-bg - Sidebar background color\n * @cssprop --sidebar-border-color - Border color\n *\n * @part mobile-backdrop - Backdrop shown for mobile overlays.\n * @part nav - Navigation container.\n * @part header - Header container.\n * @part toggle-btn - Shadow part for the `toggle-btn` element.\n * @part content - Content container.\n * @part footer - Footer container.\n * @part bottom-bar - Bottom bar container.\n * @part group - Group container.\n * @part group-header - Group header container.\n * @part group-icon - Group icon container.\n * @part group-label - Group label container.\n * @part group-items - Group items container.\n * @part item-icon - Leading item icon container.\n * @part item-label - Item label container.\n * @part item-end - Trailing item content container.\n * @part item - Item root element.\n * @example\n * ```html\n * <ore-sidebar collapsible label=\"App navigation\">\n *   <span slot=\"header\">My App</span>\n *   <ore-sidebar-group label=\"Main\">\n *     <ore-sidebar-item href=\"/dashboard\" active>Dashboard</ore-sidebar-item>\n *     <ore-sidebar-item href=\"/settings\">Settings</ore-sidebar-item>\n *   </ore-sidebar-group>\n * </ore-sidebar>\n *\n * <!-- Auto-collapse on mobile -->\n * <ore-sidebar collapsible responsive=\"(max-width: 768px)\">...</ore-sidebar>\n * ```\n */\nexport const SIDEBAR_TAG = 'ore-sidebar' as const;\ndefine<OreSidebarProps>(SIDEBAR_TAG, {\n  props: {\n    'bottom-nav-at': prop.string(),\n    'close-on-select': prop.bool(false),\n    'collapse-label': prop.string('Collapse sidebar'),\n    collapsed: prop.bool(false),\n    collapsible: prop.bool(false),\n    'container-breakpoints': prop.bool(false),\n    'default-collapsed': prop.bool(false),\n    'expand-label': prop.string('Expand sidebar'),\n    label: prop.string('Sidebar navigation'),\n    'mobile-close-label': prop.string('Close sidebar'),\n    responsive: prop.string(),\n    variant: prop.string<SidebarVariant>(),\n  },\n  setup(props) {\n    const el = getHost();\n    const emit = useEmit<OreSidebarEvents>();\n    const slots = useSlots();\n\n    const hasHeader = () => slots.has('header').value;\n    const hasFooter = () => slots.has('footer').value;\n    const hasLogo = () => slots.has('logo').value;\n\n    const isControlled = signal(el.hasAttribute('collapsed'));\n    const collapsedState = signal(isControlled.value ? el.hasAttribute('collapsed') : props['default-collapsed'].value);\n    const isBottomNav = signal(false);\n    const isMobileOpen = signal(false);\n    const bottomNavItems = signal<BottomNavItem[]>([]);\n    const responsiveMediaMatches = signal(false);\n    const responsiveSizeMatches = signal(false);\n    const responsiveMaxWidthPx = signal<number | undefined>(parseMaxWidthPx(props.responsive.value));\n    const hasResponsiveQuery = signal(Boolean(String(props.responsive.value ?? '').trim()));\n    const bottomNavMediaMatches = signal(false);\n    const bottomNavSizeMatches = signal(false);\n    const bottomNavMaxWidthPx = signal<number | undefined>(parseMaxWidthPx(props['bottom-nav-at'].value));\n    const isPreviewMode = signal(false);\n    let focusReturnTarget: HTMLElement | null = null;\n\n    const isCollapsed = () => collapsedState.value;\n    const mode = computed<SidebarMode>(() => {\n      if (isBottomNav.value) return 'bottom-nav';\n\n      return collapsedState.value ? 'collapsed' : 'default';\n    });\n\n    const applyResponsiveState = () => {\n      const useContainerBreakpoints = props['container-breakpoints'].value;\n      const responsiveMatched = useContainerBreakpoints\n        ? responsiveSizeMatches.value\n        : responsiveMediaMatches.value || responsiveSizeMatches.value;\n      const bottomMatched = useContainerBreakpoints\n        ? bottomNavSizeMatches.value\n        : bottomNavMediaMatches.value || bottomNavSizeMatches.value;\n\n      // If the mobile drawer is currently open, stay in bottom-nav mode\n      // regardless of the responsive match. This prevents the drawer from\n      // disappearing mid-animation or if forced open via the API on desktop.\n      if (!isMobileOpen.value) {\n        isBottomNav.value = bottomMatched;\n      }\n\n      if (!bottomMatched && !isMobileOpen.value) {\n        setMobileOpen(false, 'responsive');\n      }\n\n      if (hasResponsiveQuery.value) {\n        setCollapsed(responsiveMatched, 'responsive');\n      }\n    };\n\n    const readBottomNavItems = () => {\n      const directItems = slots\n        .elements()\n        .value.filter(\n          (item): item is HTMLElement =>\n            item instanceof HTMLElement && item.tagName.toLowerCase() === 'ore-sidebar-item',\n        );\n      const promotedItems = [...el.querySelectorAll<HTMLElement>('ore-sidebar-item[bottom-nav]')];\n      const sourceItems = promotedItems.length > 0 ? promotedItems : directItems;\n      const next = sourceItems.map((item, index) => {\n        const el = item;\n        const iconSlotEl =\n          (el.querySelector(':scope > [slot=\"icon\"]') as HTMLElement | null) ??\n          (el.querySelector('[slot=\"icon\"]') as HTMLElement | null);\n        const directIconName =\n          iconSlotEl?.tagName.toLowerCase() === 'ore-icon' ? iconSlotEl.getAttribute('name') : null;\n        const nestedIconName = iconSlotEl?.querySelector('ore-icon')?.getAttribute('name') ?? null;\n        const rawLabel = (el.textContent ?? '').trim();\n\n        return {\n          active: el.hasAttribute('active'),\n          disabled: el.hasAttribute('disabled'),\n          href: el.getAttribute('href') ?? undefined,\n          iconName: directIconName ?? nestedIconName ?? undefined,\n          label: el.getAttribute('bottom-nav-label')?.trim() || rawLabel || `Item ${index + 1}`,\n          source: el,\n        } satisfies BottomNavItem;\n      });\n\n      bottomNavItems.value = next;\n    };\n\n    provide(SIDEBAR_CTX, {\n      closeMobile: () => setMobileOpen(false, 'toggle'),\n      closeOnSelect: props['close-on-select'],\n      collapsed: computed(() => !isBottomNav.value && collapsedState.value) as Readable<boolean>,\n      mobileOpen: computed(() => isBottomNav.value && isMobileOpen.value) as Readable<boolean>,\n      mode: mode as Readable<SidebarMode>,\n      variant: props.variant,\n    });\n\n    const setCollapsed = (next: boolean, source: SidebarCollapseSource) => {\n      if (isCollapsed() === next) return;\n\n      if (!isControlled.value) {\n        collapsedState.value = next;\n      }\n\n      emit('collapsed-change', { collapsed: next, source });\n    };\n\n    const setMobileOpen = (next: boolean, source: SidebarMobileSource) => {\n      const open = Boolean(next);\n\n      if (open && !isBottomNav.value) {\n        isBottomNav.value = true;\n      }\n\n      if (!isBottomNav.value && !open) {\n        if (isMobileOpen.value) {\n          isMobileOpen.value = false;\n        }\n\n        return;\n      }\n\n      if (isMobileOpen.value === open) return;\n\n      if (open) focusReturnTarget = deepActiveElement();\n\n      isMobileOpen.value = open;\n\n      // If closing, re-evaluate responsive state to potentially exit forced bottom-nav mode\n      if (!open) {\n        applyResponsiveState();\n        queueMicrotask(() => {\n          if (focusReturnTarget?.isConnected) focusReturnTarget.focus();\n          focusReturnTarget = null;\n        });\n      } else {\n        queueMicrotask(() => el.shadowRoot?.querySelector<HTMLElement>('nav')?.focus());\n      }\n\n      emit('mobile-open-change', { open, source });\n    };\n\n    const doToggle = () => {\n      setCollapsed(!isCollapsed(), 'toggle');\n    };\n\n    const sidebarEl = el as SidebarElement;\n\n    sidebarEl.setCollapsed = (next) => setCollapsed(Boolean(next), 'api');\n    sidebarEl.toggle = doToggle;\n    sidebarEl.openMobile = () => setMobileOpen(true, 'api');\n    sidebarEl.closeMobile = () => setMobileOpen(false, 'api');\n    sidebarEl.toggleMobile = () => setMobileOpen(!isMobileOpen.value, 'toggle');\n\n    bind({\n      attr: {\n        'data-bottom-nav': () => (isBottomNav.value ? true : undefined),\n        'data-collapsed': () => (isCollapsed() && !isBottomNav.value ? true : undefined),\n        'data-has-logo': () => (hasLogo() ? true : undefined),\n        'data-mobile-open': () => (isBottomNav.value && isMobileOpen.value ? true : undefined),\n        'data-preview-mode': () => (isPreviewMode.value ? true : undefined),\n      },\n    });\n\n    onMounted(() => {\n      // Suppress transitions during initial layout so the sidebar doesn't\n      // animate from a collapsed/0 state before the first ResizeObserver fires.\n      el.setAttribute('data-no-transition', '');\n\n      let transitionUnlocked = false;\n      const unlockTransition = () => {\n        if (transitionUnlocked) return;\n\n        transitionUnlocked = true;\n        el.removeAttribute('data-no-transition');\n      };\n\n      // Fallback: unlock after two frames in case ResizeObserver doesn't fire.\n      requestAnimationFrame(() => requestAnimationFrame(unlockTransition));\n\n      let mediaCleanup: (() => void) | undefined;\n      let bottomNavCleanup: (() => void) | undefined;\n      const itemObservers = new Map<HTMLElement, MutationObserver>();\n      const observer = new MutationObserver(() => {\n        if (!el.hasAttribute('collapsed') && !isControlled.value) return;\n\n        isControlled.value = true;\n        collapsedState.value = el.hasAttribute('collapsed');\n      });\n\n      observer.observe(el, {\n        attributeFilter: ['collapsed'],\n        attributes: true,\n      });\n      const closeOnEscape = (event: KeyboardEvent) => {\n        if (event.key !== 'Escape' || !isMobileOpen.value) return;\n\n        event.preventDefault();\n        setMobileOpen(false, 'toggle');\n      };\n      el.addEventListener('keydown', closeOnEscape);\n\n      watch(\n        props.responsive,\n        (query) => {\n          mediaCleanup?.();\n          mediaCleanup = undefined;\n\n          const mediaQuery = String(query ?? '').trim();\n\n          hasResponsiveQuery.value = Boolean(mediaQuery);\n          responsiveMaxWidthPx.value = parseMaxWidthPx(mediaQuery);\n          responsiveMediaMatches.value = false;\n\n          const width = readContainerWidth(el);\n\n          responsiveSizeMatches.value =\n            width > 0 && responsiveMaxWidthPx.value != null ? width <= responsiveMaxWidthPx.value : false;\n          applyResponsiveState();\n\n          // For parseable max-width queries, keep behavior container-driven.\n          // This avoids preview viewport controls being overridden by window width.\n          if (props['container-breakpoints'].value && responsiveMaxWidthPx.value != null) {\n            return;\n          }\n\n          if (!mediaQuery) {\n            return;\n          }\n\n          try {\n            const mediaHandle = createMediaQuery(mediaQuery);\n            const syncMedia = (state: ReturnType<typeof mediaHandle.getSnapshot>) => {\n              if (state) {\n                responsiveMediaMatches.value = state.matches;\n                applyResponsiveState();\n              }\n            };\n\n            syncMedia(mediaHandle.getSnapshot());\n\n            const mediaCleanupFn = watch(\n              fromSubscribable(mediaHandle, { signal: mediaHandle.disposalSignal }),\n              syncMedia,\n            );\n            mediaCleanup = () => {\n              mediaCleanupFn.dispose();\n              mediaHandle.dispose();\n            };\n          } catch (error) {\n            if (!(error instanceof SentinelUnavailableError)) throw error;\n          }\n        },\n        { immediate: true },\n      );\n\n      watch(\n        props['bottom-nav-at'],\n        (query) => {\n          bottomNavCleanup?.();\n          bottomNavCleanup = undefined;\n\n          const mediaQuery = String(query ?? '').trim();\n\n          bottomNavMaxWidthPx.value = parseMaxWidthPx(mediaQuery);\n          bottomNavMediaMatches.value = false;\n\n          const width = readContainerWidth(el);\n\n          bottomNavSizeMatches.value =\n            width > 0 && bottomNavMaxWidthPx.value != null ? width <= bottomNavMaxWidthPx.value : false;\n          applyResponsiveState();\n\n          // For parseable max-width queries, keep behavior container-driven.\n          // This avoids preview viewport controls being overridden by window width.\n          if (props['container-breakpoints'].value && bottomNavMaxWidthPx.value != null) {\n            return;\n          }\n\n          if (!mediaQuery) {\n            return;\n          }\n\n          try {\n            const mediaHandle = createMediaQuery(mediaQuery);\n            const syncMedia = (state: ReturnType<typeof mediaHandle.getSnapshot>) => {\n              if (state) {\n                bottomNavMediaMatches.value = state.matches;\n                applyResponsiveState();\n              }\n            };\n\n            syncMedia(mediaHandle.getSnapshot());\n\n            const mediaCleanupFn = watch(\n              fromSubscribable(mediaHandle, { signal: mediaHandle.disposalSignal }),\n              syncMedia,\n            );\n            bottomNavCleanup = () => {\n              mediaCleanupFn.dispose();\n              mediaHandle.dispose();\n            };\n          } catch (error) {\n            if (!(error instanceof SentinelUnavailableError)) throw error;\n          }\n        },\n        { immediate: true },\n      );\n\n      const stopResizeEffect =\n        typeof ResizeObserver === 'function'\n          ? (() => {\n              const hostSize = createElementSize(el);\n              onCleanup(() => hostSize.dispose());\n              const hostSizeSignal = fromSubscribable(hostSize, { signal: hostSize.disposalSignal });\n\n              const wrapperEl = el.parentElement;\n              const containerEl = resolveContainerElement(el);\n              const wrapperSize = wrapperEl ? createElementSize(wrapperEl) : undefined;\n              const parentSize = containerEl && containerEl !== wrapperEl ? createElementSize(containerEl) : undefined;\n\n              if (wrapperSize) {\n                onCleanup(() => wrapperSize.dispose());\n              }\n              if (parentSize) {\n                onCleanup(() => parentSize.dispose());\n              }\n\n              const wrapperSizeSignal = wrapperSize\n                ? fromSubscribable(wrapperSize, { signal: wrapperSize.disposalSignal })\n                : undefined;\n              const parentSizeSignal = parentSize\n                ? fromSubscribable(parentSize, { signal: parentSize.disposalSignal })\n                : undefined;\n\n              let rafId: number | undefined;\n\n              const onResize = () => {\n                if (rafId !== undefined) cancelAnimationFrame(rafId);\n\n                rafId = requestAnimationFrame(() => {\n                  const resolvedContainer = resolveContainerElement(el);\n                  const width = readContainerWidth(el);\n                  const responsiveWasMatched = responsiveSizeMatches.value;\n                  const bottomNavWasMatched = bottomNavSizeMatches.value;\n                  const parentWidth = resolvedContainer?.clientWidth ?? 0;\n\n                  isPreviewMode.value = parentWidth > 0 && parentWidth < window.innerWidth;\n\n                  responsiveSizeMatches.value =\n                    width > 0 && responsiveMaxWidthPx.value != null ? width <= responsiveMaxWidthPx.value : false;\n                  bottomNavSizeMatches.value =\n                    width > 0 && bottomNavMaxWidthPx.value != null ? width <= bottomNavMaxWidthPx.value : false;\n\n                  if (\n                    responsiveWasMatched !== responsiveSizeMatches.value ||\n                    bottomNavWasMatched !== bottomNavSizeMatches.value\n                  ) {\n                    applyResponsiveState();\n                  }\n\n                  unlockTransition();\n                });\n              };\n\n              return watch(\n                computed(() => [\n                  hostSizeSignal.value?.width,\n                  hostSizeSignal.value?.height,\n                  wrapperSizeSignal?.value?.width,\n                  wrapperSizeSignal?.value?.height,\n                  parentSizeSignal?.value?.width,\n                  parentSizeSignal?.value?.height,\n                ]),\n                onResize,\n              );\n            })()\n          : undefined;\n\n      const bindItemObservers = (items: HTMLElement[]) => {\n        const set = new Set(items);\n\n        for (const [item, cleanup] of itemObservers) {\n          if (set.has(item)) continue;\n\n          cleanup.disconnect();\n          itemObservers.delete(item);\n        }\n\n        for (const item of items) {\n          if (itemObservers.has(item)) continue;\n\n          const itemObserver = new MutationObserver(() => {\n            // Only update if in bottom-nav mode to minimize re-renders\n            if (isBottomNav.value) {\n              readBottomNavItems();\n            }\n          });\n\n          // Watch attributes and content that affect bottom-nav rendering.\n          itemObserver.observe(item, {\n            attributeFilter: ['active', 'bottom-nav', 'bottom-nav-label', 'disabled', 'href'],\n            attributes: true,\n            characterData: true,\n            childList: true,\n            subtree: true,\n          });\n          itemObservers.set(item, itemObserver);\n        }\n      };\n\n      const syncBottomNavItems = () => {\n        bindItemObservers([...el.querySelectorAll<HTMLElement>('ore-sidebar-item')]);\n        readBottomNavItems();\n      };\n      watch(slots.elements(), syncBottomNavItems, { immediate: true });\n      const nestedItemsObserver = new MutationObserver(syncBottomNavItems);\n      nestedItemsObserver.observe(el, { childList: true, subtree: true });\n\n      return () => {\n        observer.disconnect();\n        nestedItemsObserver.disconnect();\n        el.removeEventListener('keydown', closeOnEscape);\n        mediaCleanup?.();\n        bottomNavCleanup?.();\n        stopResizeEffect?.dispose();\n\n        for (const itemObserver of itemObservers.values()) {\n          itemObserver.disconnect();\n        }\n\n        itemObservers.clear();\n      };\n    });\n\n    return html`\n      <button\n        class=\"mobile-backdrop\"\n        part=\"mobile-backdrop\"\n        type=\"button\"\n        aria-label=\"${props['mobile-close-label']}\"\n        ?hidden=${() => !isBottomNav.value || !isMobileOpen.value}\n        @click=${() => setMobileOpen(false, 'toggle')}></button>\n      <nav aria-label=\"${props.label}\" part=\"nav\" tabindex=\"-1\">\n        <div class=\"sidebar-header\" part=\"header\" ?hidden=${() => !hasHeader() && !props.collapsible.value}>\n          <span class=\"sidebar-logo\" ?hidden=${() => !hasLogo()}>\n            <slot name=\"logo\"></slot>\n          </span>\n          <span class=\"sidebar-header-content\">\n            <slot name=\"header\"></slot>\n          </span>\n          <button\n            class=\"toggle-btn\"\n            part=\"toggle-btn\"\n            type=\"button\"\n            ?hidden=${() => !props.collapsible.value}\n            aria-label=\"${() => (isCollapsed() ? props['expand-label'].value : props['collapse-label'].value)}\"\n            aria-expanded=\"${() => !isCollapsed()}\"\n            @click=\"${doToggle}\">\n            <ore-icon\n              class=\"toggle-icon\"\n              name=${() => (isCollapsed() ? 'panel-left-open' : 'panel-left-close')}\n              size=\"18\"\n              stroke-width=\"2\"\n              aria-hidden=\"true\"></ore-icon>\n          </button>\n        </div>\n        <div class=\"sidebar-content\" part=\"content\">\n          <slot></slot>\n        </div>\n        <div class=\"sidebar-footer\" part=\"footer\" ?hidden=${() => !hasFooter()}>\n          <slot name=\"footer\"></slot>\n        </div>\n      </nav>\n\n      <div class=\"bottom-bar\" part=\"bottom-bar\" ?hidden=${() => !isBottomNav.value}>\n        ${() =>\n          bottomNavItems.value.map((item) => {\n            const className = `bottom-tab${item.active ? ' bottom-tab-active' : ''}`;\n\n            if (item.href && !item.disabled) {\n              return html`\n                <a\n                  class=\"${className}\"\n                  href=\"${item.href}\"\n                  aria-current=\"${item.active ? 'page' : null}\"\n                  data-active=\"${item.active ? 'true' : null}\">\n                  <span class=\"bottom-tab-icon\" aria-hidden=\"true\" ?hidden=${() => !item.iconName}>\n                    <ore-icon name=\"${item.iconName}\" size=\"18\" stroke-width=\"2\"></ore-icon>\n                  </span>\n                  <span class=\"bottom-tab-label\">${item.label}</span>\n                </a>\n              `;\n            }\n\n            return html`\n              <button\n                class=\"${className}\"\n                type=\"button\"\n                ?disabled=${item.disabled}\n                aria-current=\"${item.active ? 'page' : null}\"\n                data-active=\"${item.active ? 'true' : null}\"\n                @click=${() => item.source.click()}>\n                <span class=\"bottom-tab-icon\" aria-hidden=\"true\" ?hidden=${() => !item.iconName}>\n                  <ore-icon name=\"${item.iconName}\" size=\"18\" stroke-width=\"2\"></ore-icon>\n                </span>\n                <span class=\"bottom-tab-label\">${item.label}</span>\n              </button>\n            `;\n          })}\n      </div>\n    `;\n  },\n  styles: [coarsePointerMixin, reducedMotionMixin, sidebarStyles],\n});\n\n// ─── ore-sidebar-group styles ────────────────────────────────────────────────\n\n/** Sidebar group properties */\nexport type OreSidebarGroupProps = {\n  /** Whether this group can be collapsed */\n  collapsible?: boolean;\n  /** Initial open state in uncontrolled mode */\n  'default-open'?: boolean;\n  /** Accessible label for the group */\n  label?: string;\n  /** Controlled open state */\n  open?: boolean;\n};\n\n/**\n * `ore-sidebar-group` — A labelled section within `ore-sidebar`.\n *\n * @element ore-sidebar-group\n *\n * @attr {string} label - Group label text\n * @attr {boolean} collapsible - Whether this group can be toggled open/closed\n * @attr {boolean} open - Controlled expanded state\n * @attr {boolean} default-open - Initial expanded state in uncontrolled mode\n *\n * @fires open-change - Fired when the group open state changes (collapsible groups only). detail: { open: boolean }\n *\n * @slot - Navigation items (`ore-sidebar-item`)\n * @slot icon - Icon displayed before the label\n *\n * @example\n * ```html\n * <ore-sidebar-group label=\"Main\" collapsible open>\n *   <ore-sidebar-item href=\"/home\">Home</ore-sidebar-item>\n * </ore-sidebar-group>\n * ```\n */\nexport const SIDEBAR_GROUP_TAG = 'ore-sidebar-group' as const;\ndefine<OreSidebarGroupProps>(SIDEBAR_GROUP_TAG, {\n  props: {\n    collapsible: prop.bool(false),\n    'default-open': prop.bool(true),\n    label: prop.string(),\n    open: {\n      default: undefined as boolean | undefined,\n      parse: (value: string | null) => (value == null ? undefined : value === '' || value === 'true'),\n      reflect: false,\n    },\n  },\n  setup(props) {\n    const slots = useSlots();\n\n    const hasIcon = () => slots.has('icon').value;\n    const sidebarCtx = inject(SIDEBAR_CTX);\n\n    bind({\n      attr: {\n        'sidebar-bottom-nav': () =>\n          sidebarCtx?.mode.value === 'bottom-nav' && !sidebarCtx?.mobileOpen.value ? true : undefined,\n        'sidebar-collapsed': () => (sidebarCtx?.collapsed.value ? true : undefined),\n      },\n    });\n\n    const isControlled = () => props.open.value !== undefined;\n    const openState = signal(props['default-open'].value);\n    const isOpen = computed(() => {\n      if (!props.collapsible.value) return true;\n\n      if (isControlled()) return props.open.value ?? false;\n\n      return openState.value;\n    });\n\n    watch(props.open, (value) => {\n      if (value === undefined) return;\n\n      openState.value = value;\n    });\n\n    bind({\n      attr: {\n        open: () => (isOpen.value ? true : undefined),\n      },\n    });\n\n    return html`\n      <details class=\"group\" part=\"group\" ?open=${isOpen}>\n        <summary\n          class=\"group-header\"\n          part=\"group-header\"\n          aria-expanded=\"${() => (props.collapsible.value ? String(props.open.value) : null)}\"\n          @click=${(e: MouseEvent) => {\n            if (!props.collapsible.value) {\n              e.preventDefault();\n            }\n          }}>\n          <span class=\"group-icon\" part=\"group-icon\" ?hidden=${() => !hasIcon()} aria-hidden=\"true\">\n            <slot name=\"icon\"></slot>\n          </span>\n          <span class=\"group-label\" part=\"group-label\">${props.label}</span>\n          <span class=\"chevron\" ?hidden=${() => !props.collapsible.value} aria-hidden=\"true\">\n            <ore-icon name=\"chevron-right\" size=\"12\" stroke-width=\"2\" aria-hidden=\"true\"></ore-icon>\n          </span>\n        </summary>\n        <div class=\"group-items\" part=\"group-items\" role=\"list\">\n          <slot></slot>\n        </div>\n      </details>\n    `;\n  },\n  styles: [reducedMotionMixin, groupStyles],\n});\n\n// ─── ore-sidebar-item styles ─────────────────────────────────────────────────\n\n/** Sidebar item properties */\nexport type OreSidebarItemProps = {\n  /** Whether this item represents the current page/section */\n  active?: boolean;\n  'bottom-nav'?: boolean;\n  'bottom-nav-label'?: string;\n  /** Whether this item is disabled */\n  disabled?: boolean;\n  /** Navigation href — renders an `<a>` when set, otherwise a `<button>` */\n  href?: string;\n  /**\n   * Relationship of the linked URL (`rel` attribute on the inner `<a>`).\n   * Only applies when `href` is set.\n   */\n  rel?: string;\n  /**\n   * Browsing context for the link (`target` attribute on the inner `<a>`).\n   * Only applies when `href` is set.\n   */\n  target?: string;\n};\n\n/**\n * `ore-sidebar-item` — An individual navigation item in a `ore-sidebar`.\n *\n * Renders as an `<a>` when `href` is provided, otherwise as a `<button>`.\n * Marks the active page via `aria-current=\"page\"` when the `active` attribute is set.\n *\n * @element ore-sidebar-item\n *\n * @attr {string} href - Link URL; renders an anchor when set\n * @attr {boolean} active - Marks the item as the current page\n * @attr {boolean} disabled - Disables the item\n * @attr {string} rel - Anchor `rel` attribute (links only)\n * @attr {string} target - Anchor `target` attribute (links only)\n *\n * @slot - Label text\n * @slot icon - Leading icon\n * @slot end - Trailing content (badge, shortcut, arrow, etc.)\n *\n * @cssprop --sidebar-item-color - Default text color\n * @cssprop --sidebar-item-hover-bg - Hover background\n * @cssprop --sidebar-item-hover-color - Hover text color\n * @cssprop --sidebar-item-active-bg - Active background\n * @cssprop --sidebar-item-active-color - Active text color\n * @cssprop --sidebar-item-indicator - Active indicator bar color\n *\n * @part item - The inner anchor or button element\n * @part item-icon - The icon wrapper\n * @part item-label - The label wrapper\n * @part item-end - The trailing content wrapper\n *\n * @example\n * ```html\n * <ore-sidebar-item href=\"/dashboard\" active>\n *   <span slot=\"icon\">🏠</span>\n *   Dashboard\n * </ore-sidebar-item>\n *\n * <ore-sidebar-item href=\"/users\">\n *   <span slot=\"icon\">👤</span>\n *   Users\n *   <ore-badge slot=\"end\" color=\"primary\">3</ore-badge>\n * </ore-sidebar-item>\n * ```\n */\nexport const SIDEBAR_ITEM_TAG = 'ore-sidebar-item' as const;\ndefine<OreSidebarItemProps>(SIDEBAR_ITEM_TAG, {\n  props: {\n    active: prop.bool(false),\n    'bottom-nav': prop.bool(false),\n    'bottom-nav-label': prop.string(),\n    disabled: prop.bool(false),\n    href: prop.string(),\n    rel: prop.string(),\n    target: prop.string(),\n  },\n  setup(props) {\n    const slots = useSlots();\n\n    const hasIcon = () => slots.has('icon').value;\n    const hasEnd = () => slots.has('end').value;\n    const sidebarCtx = inject(SIDEBAR_CTX);\n\n    bind({\n      attr: {\n        'sidebar-bottom-nav': () =>\n          sidebarCtx?.mode.value === 'bottom-nav' && !sidebarCtx?.mobileOpen.value ? true : undefined,\n        'sidebar-collapsed': () => (sidebarCtx?.collapsed.value ? true : undefined),\n      },\n    });\n\n    const isLink = () => !!props.href.value && !props.disabled.value;\n\n    // Prevent reverse tabnapping: auto-inject noopener + noreferrer for _blank links.\n    const effectiveRel = computed(() => computeSafeRel(props.rel.value, props.target.value));\n    const closeMobileOnSelect = (event: MouseEvent) => {\n      if (!sidebarCtx?.closeOnSelect.value || !sidebarCtx.mobileOpen.value) return;\n      if (event.button !== 0 || event.metaKey || event.ctrlKey || event.shiftKey || event.altKey) return;\n\n      queueMicrotask(sidebarCtx.closeMobile);\n    };\n\n    const renderItemContent = () => html`\n      <span class=\"item-icon\" part=\"item-icon\" ?hidden=${() => !hasIcon()} aria-hidden=\"true\">\n        <slot name=\"icon\"></slot>\n      </span>\n      <span class=\"item-label\" part=\"item-label\"><slot></slot></span>\n      <span class=\"item-end\" part=\"item-end\" ?hidden=${() => !hasEnd()}>\n        <slot name=\"end\"></slot>\n      </span>\n    `;\n\n    return html`\n      ${() => {\n        if (isLink()) {\n          return html`\n            <a\n              class=\"item\"\n              part=\"item\"\n              href=\"${props.href}\"\n              rel=\"${effectiveRel}\"\n              target=\"${props.target}\"\n              aria-current=\"${() => (props.active.value ? 'page' : null)}\"\n              @click=${closeMobileOnSelect}>\n              ${renderItemContent()}\n            </a>\n          `;\n        }\n\n        if (props.disabled.value) {\n          return html`\n            <div\n              class=\"item\"\n              part=\"item\"\n              aria-disabled=\"true\"\n              tabindex=\"-1\"\n              aria-current=\"${() => (props.active.value ? 'page' : null)}\">\n              ${renderItemContent()}\n            </div>\n          `;\n        }\n\n        return html`\n          <button\n            class=\"item\"\n            part=\"item\"\n            type=\"button\"\n            ?disabled=\"${props.disabled}\"\n            aria-current=\"${() => (props.active.value ? 'page' : null)}\"\n            @click=${closeMobileOnSelect}>\n            ${renderItemContent()}\n          </button>\n        `;\n      }}\n    `;\n  },\n  styles: [coarsePointerMixin, itemStyles],\n});\n"],"mappings":"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"}
+{"version":3,"file":"sidebar.js","names":[],"sources":["../src/layout/sidebar/sidebar.ts"],"sourcesContent":["import {\n  bind,\n  createContext,\n  define,\n  getHost,\n  html,\n  inject,\n  onCleanup,\n  onMounted,\n  prop,\n  provide,\n  useEmit,\n  useSlots,\n} from '@vielzeug/ore';\nimport { computed, fromSubscribable, type Readable, signal, watch } from '@vielzeug/ripple';\nimport { createElementSize, createMediaQuery, SentinelUnavailableError } from '@vielzeug/sentinel';\n\nimport '../../content/icon/icon';\nimport { coarsePointerMixin, reducedMotionMixin } from '../../styles';\nimport { computeSafeRel } from '../../utils';\nimport sidebarStyles from './sidebar.css?inline';\nimport groupStyles from './sidebar-group.css?inline';\nimport itemStyles from './sidebar-item.css?inline';\n\n// ─── Types ────────────────────────────────────────────────────────────────\n\ntype SidebarVariant = 'floating' | 'inset';\ntype SidebarCollapseSource = 'api' | 'responsive' | 'toggle';\ntype SidebarMobileSource = 'api' | 'responsive' | 'toggle';\ntype SidebarMode = 'bottom-nav' | 'collapsed' | 'default';\n\ntype BottomNavItem = {\n  active: boolean;\n  disabled: boolean;\n  href?: string;\n  iconName?: string;\n  label: string;\n  source: HTMLElement;\n};\n\nconst parseMaxWidthPx = (query: string | undefined): number | undefined => {\n  const value = String(query ?? '').trim();\n\n  if (!value) return undefined;\n\n  const match = /max-width\\s*:\\s*([0-9]+(?:\\.[0-9]+)?)px/i.exec(value);\n\n  if (!match) return undefined;\n\n  const parsed = Number.parseFloat(match[1]);\n\n  return Number.isFinite(parsed) ? parsed : undefined;\n};\n\nconst resolveContainerElement = (el: HTMLElement): HTMLElement | null => {\n  let container = el.parentElement;\n\n  while (container?.tagName.toLowerCase() === 'ore-grid-item') {\n    container = container.parentElement;\n  }\n\n  return container;\n};\n\nconst readContainerWidth = (el: HTMLElement): number => {\n  const parentWidth = resolveContainerElement(el)?.clientWidth ?? 0;\n\n  if (parentWidth > 0) return parentWidth;\n\n  return el.offsetWidth;\n};\n\nconst deepActiveElement = (): HTMLElement | null => {\n  let active = document.activeElement as HTMLElement | null;\n\n  while (active?.shadowRoot?.activeElement instanceof HTMLElement) {\n    active = active.shadowRoot.activeElement;\n  }\n\n  return active;\n};\n\n/** Context provided by `ore-sidebar` to its `ore-sidebar-group` and `ore-sidebar-item` children. */\nexport type SidebarContext = {\n  closeMobile: () => void;\n  closeOnSelect: Readable<boolean>;\n  collapsed: Readable<boolean>;\n  mobileOpen: Readable<boolean>;\n  mode: Readable<SidebarMode>;\n  variant: Readable<SidebarVariant | undefined>;\n};\n\n/** Injection key for the sidebar context. */\nexport const SIDEBAR_CTX = createContext<SidebarContext>('SidebarContext');\n\n// ─── ore-sidebar styles ──────────────────────────────────────────────────────\n\n/** ore-sidebar element interface */\nexport type SidebarElement = HTMLElement &\n  OreSidebarProps & {\n    /** Close the drawer in bottom-nav mode. */\n    closeMobile(): void;\n    /** Open the drawer in bottom-nav mode. */\n    openMobile(): void;\n    /** Set collapsed state imperatively. */\n    setCollapsed(next: boolean): void;\n    /** Toggle between collapsed and expanded. */\n    toggle(): void;\n    /** Toggle the drawer in bottom-nav mode. */\n    toggleMobile(): void;\n  };\n\n/** Sidebar component properties */\n\nexport type OreSidebarEvents = {\n  'collapsed-change': { collapsed: boolean; source: SidebarCollapseSource };\n  'mobile-open-change': { open: boolean; source: SidebarMobileSource };\n};\n\nexport type OreSidebarGroupEvents = {\n  'open-change': { open: boolean };\n};\n\nexport type OreSidebarProps = {\n  /** CSS media query that switches the sidebar to bottom navigation mode */\n  'bottom-nav-at'?: string;\n  'close-on-select'?: boolean;\n  /** Controlled collapsed state */\n  collapsed?: boolean;\n  /** Whether the sidebar supports collapsing */\n  collapsible?: boolean;\n  'collapse-label'?: string;\n  /** Evaluate responsive and bottom-nav breakpoints against container width only. */\n  'container-breakpoints'?: boolean;\n  /** Initial collapsed state in uncontrolled mode */\n  'default-collapsed'?: boolean;\n  'expand-label'?: string;\n  /**\n   * Accessible label for the navigation landmark.\n   * Use to distinguish multiple navigation regions on a page.\n   * @default 'Sidebar navigation'\n   */\n  label?: string;\n  'mobile-close-label'?: string;\n  /**\n   * CSS media query that, when it matches, automatically collapses the sidebar.\n   * Unset by default — no automatic collapse.\n   * @example 'responsive=\"(max-width: 768px)\"'\n   */\n  responsive?: string;\n  /** Visual style variant */\n  variant?: SidebarVariant;\n};\n\n/**\n * `ore-sidebar` — A collapsible navigation sidebar with group and item support.\n *\n * @element ore-sidebar\n * @element ore-sidebar-group - Labelled group of navigation items\n * @element ore-sidebar-item - Individual navigation link or button\n *\n * @attr {boolean} collapsed - Controlled collapsed state\n * @attr {boolean} default-collapsed - Initial collapsed state for uncontrolled sidebars\n * @attr {boolean} collapsible - Show the collapse toggle button\n * @attr {string} variant - Visual variant: 'floating' | 'inset'\n * @attr {string} label - Accessible aria-label for the nav landmark\n *\n * @fires collapsed-change - Fired when collapsed state changes. detail: { collapsed: boolean; source: string }\n * @fires mobile-open-change - Fired when mobile overlay open state changes. detail: { open: boolean; source: string }\n *\n * @slot header - Branding or logo content above the nav\n * @slot - Navigation content (ore-sidebar-group / ore-sidebar-item)\n * @slot footer - Footer content below the nav (user info, settings, etc.)\n *\n * @cssprop --sidebar-width - Expanded sidebar width (default: 16rem)\n * @cssprop --sidebar-collapsed-width - Collapsed sidebar width (default: 3.5rem)\n * @cssprop --sidebar-bg - Sidebar background color\n * @cssprop --sidebar-border-color - Border color\n *\n * @part mobile-backdrop - Backdrop shown for mobile overlays.\n * @part nav - Navigation container.\n * @part header - Header container.\n * @part toggle-btn - Shadow part for the `toggle-btn` element.\n * @part content - Content container.\n * @part footer - Footer container.\n * @part bottom-bar - Bottom bar container.\n * @part group - Group container.\n * @part group-header - Group header container.\n * @part group-icon - Group icon container.\n * @part group-label - Group label container.\n * @part group-items - Group items container.\n * @part item-icon - Leading item icon container.\n * @part item-label - Item label container.\n * @part item-end - Trailing item content container.\n * @part item - Item root element.\n * @example\n * ```html\n * <ore-sidebar collapsible label=\"App navigation\">\n *   <span slot=\"header\">My App</span>\n *   <ore-sidebar-group label=\"Main\">\n *     <ore-sidebar-item href=\"/dashboard\" active>Dashboard</ore-sidebar-item>\n *     <ore-sidebar-item href=\"/settings\">Settings</ore-sidebar-item>\n *   </ore-sidebar-group>\n * </ore-sidebar>\n *\n * <!-- Auto-collapse on mobile -->\n * <ore-sidebar collapsible responsive=\"(max-width: 768px)\">...</ore-sidebar>\n * ```\n */\nexport const SIDEBAR_TAG = 'ore-sidebar' as const;\ndefine<OreSidebarProps>(SIDEBAR_TAG, {\n  props: {\n    'bottom-nav-at': prop.string(),\n    'close-on-select': prop.bool(false),\n    'collapse-label': prop.string('Collapse sidebar'),\n    collapsed: prop.bool(false),\n    collapsible: prop.bool(false),\n    'container-breakpoints': prop.bool(false),\n    'default-collapsed': prop.bool(false),\n    'expand-label': prop.string('Expand sidebar'),\n    label: prop.string('Sidebar navigation'),\n    'mobile-close-label': prop.string('Close sidebar'),\n    responsive: prop.string(),\n    variant: prop.string<SidebarVariant>(),\n  },\n  setup(props) {\n    const el = getHost();\n    const emit = useEmit<OreSidebarEvents>();\n    const slots = useSlots();\n\n    const hasHeader = () => slots.has('header').value;\n    const hasFooter = () => slots.has('footer').value;\n    const hasLogo = () => slots.has('logo').value;\n\n    const isControlled = signal(el.hasAttribute('collapsed'));\n    const collapsedState = signal(isControlled.value ? el.hasAttribute('collapsed') : props['default-collapsed'].value);\n    const isBottomNav = signal(false);\n    const isMobileOpen = signal(false);\n    const bottomNavItems = signal<BottomNavItem[]>([]);\n    const responsiveMediaMatches = signal(false);\n    const responsiveSizeMatches = signal(false);\n    const responsiveMaxWidthPx = signal<number | undefined>(parseMaxWidthPx(props.responsive.value));\n    const hasResponsiveQuery = signal(Boolean(String(props.responsive.value ?? '').trim()));\n    const bottomNavMediaMatches = signal(false);\n    const bottomNavSizeMatches = signal(false);\n    const bottomNavMaxWidthPx = signal<number | undefined>(parseMaxWidthPx(props['bottom-nav-at'].value));\n    const isPreviewMode = signal(false);\n    let focusReturnTarget: HTMLElement | null = null;\n\n    const isCollapsed = () => collapsedState.value;\n    const mode = computed<SidebarMode>(() => {\n      if (isBottomNav.value) return 'bottom-nav';\n\n      return collapsedState.value ? 'collapsed' : 'default';\n    });\n\n    const applyResponsiveState = () => {\n      const useContainerBreakpoints = props['container-breakpoints'].value;\n      const responsiveMatched = useContainerBreakpoints\n        ? responsiveSizeMatches.value\n        : responsiveMediaMatches.value || responsiveSizeMatches.value;\n      const bottomMatched = useContainerBreakpoints\n        ? bottomNavSizeMatches.value\n        : bottomNavMediaMatches.value || bottomNavSizeMatches.value;\n\n      // If the mobile drawer is currently open, stay in bottom-nav mode\n      // regardless of the responsive match. This prevents the drawer from\n      // disappearing mid-animation or if forced open via the API on desktop.\n      if (!isMobileOpen.value) {\n        isBottomNav.value = bottomMatched;\n      }\n\n      if (!bottomMatched && !isMobileOpen.value) {\n        setMobileOpen(false, 'responsive');\n      }\n\n      if (hasResponsiveQuery.value) {\n        setCollapsed(responsiveMatched, 'responsive');\n      }\n    };\n\n    const readBottomNavItems = () => {\n      const directItems = slots\n        .elements()\n        .value.filter(\n          (item): item is HTMLElement =>\n            item instanceof HTMLElement && item.tagName.toLowerCase() === 'ore-sidebar-item',\n        );\n      const promotedItems = [...el.querySelectorAll<HTMLElement>('ore-sidebar-item[bottom-nav]')];\n      const sourceItems = promotedItems.length > 0 ? promotedItems : directItems;\n      const next = sourceItems.map((item, index) => {\n        const el = item;\n        const iconSlotEl =\n          (el.querySelector(':scope > [slot=\"icon\"]') as HTMLElement | null) ??\n          (el.querySelector('[slot=\"icon\"]') as HTMLElement | null);\n        const directIconName =\n          iconSlotEl?.tagName.toLowerCase() === 'ore-icon' ? iconSlotEl.getAttribute('name') : null;\n        const nestedIconName = iconSlotEl?.querySelector('ore-icon')?.getAttribute('name') ?? null;\n        const rawLabel = (el.textContent ?? '').trim();\n\n        return {\n          active: el.hasAttribute('active'),\n          disabled: el.hasAttribute('disabled'),\n          href: el.getAttribute('href') ?? undefined,\n          iconName: directIconName ?? nestedIconName ?? undefined,\n          label: el.getAttribute('bottom-nav-label')?.trim() || rawLabel || `Item ${index + 1}`,\n          source: el,\n        } satisfies BottomNavItem;\n      });\n\n      bottomNavItems.value = next;\n    };\n\n    provide(SIDEBAR_CTX, {\n      closeMobile: () => setMobileOpen(false, 'toggle'),\n      closeOnSelect: props['close-on-select'],\n      collapsed: computed(() => !isBottomNav.value && collapsedState.value) as Readable<boolean>,\n      mobileOpen: computed(() => isBottomNav.value && isMobileOpen.value) as Readable<boolean>,\n      mode: mode as Readable<SidebarMode>,\n      variant: props.variant,\n    });\n\n    const setCollapsed = (next: boolean, source: SidebarCollapseSource) => {\n      if (isCollapsed() === next) return;\n\n      if (!isControlled.value) {\n        collapsedState.value = next;\n      }\n\n      emit('collapsed-change', { collapsed: next, source });\n    };\n\n    const setMobileOpen = (next: boolean, source: SidebarMobileSource) => {\n      const open = Boolean(next);\n\n      if (open && !isBottomNav.value) {\n        isBottomNav.value = true;\n      }\n\n      if (!isBottomNav.value && !open) {\n        if (isMobileOpen.value) {\n          isMobileOpen.value = false;\n        }\n\n        return;\n      }\n\n      if (isMobileOpen.value === open) return;\n\n      if (open) focusReturnTarget = deepActiveElement();\n\n      isMobileOpen.value = open;\n\n      // If closing, re-evaluate responsive state to potentially exit forced bottom-nav mode\n      if (!open) {\n        applyResponsiveState();\n        queueMicrotask(() => {\n          if (focusReturnTarget?.isConnected) focusReturnTarget.focus();\n          focusReturnTarget = null;\n        });\n      } else {\n        queueMicrotask(() => el.shadowRoot?.querySelector<HTMLElement>('nav')?.focus());\n      }\n\n      emit('mobile-open-change', { open, source });\n    };\n\n    const doToggle = () => {\n      setCollapsed(!isCollapsed(), 'toggle');\n    };\n\n    const sidebarEl = el as SidebarElement;\n\n    sidebarEl.setCollapsed = (next) => setCollapsed(Boolean(next), 'api');\n    sidebarEl.toggle = doToggle;\n    sidebarEl.openMobile = () => setMobileOpen(true, 'api');\n    sidebarEl.closeMobile = () => setMobileOpen(false, 'api');\n    sidebarEl.toggleMobile = () => setMobileOpen(!isMobileOpen.value, 'toggle');\n\n    bind({\n      attr: {\n        'data-bottom-nav': () => (isBottomNav.value ? true : undefined),\n        'data-collapsed': () => (isCollapsed() && !isBottomNav.value ? true : undefined),\n        'data-has-logo': () => (hasLogo() ? true : undefined),\n        'data-mobile-open': () => (isBottomNav.value && isMobileOpen.value ? true : undefined),\n        'data-preview-mode': () => (isPreviewMode.value ? true : undefined),\n      },\n    });\n\n    onMounted(() => {\n      // Suppress transitions during initial layout so the sidebar doesn't\n      // animate from a collapsed/0 state before the first ResizeObserver fires.\n      el.setAttribute('data-no-transition', '');\n\n      let transitionUnlocked = false;\n      const unlockTransition = () => {\n        if (transitionUnlocked) return;\n\n        transitionUnlocked = true;\n        el.removeAttribute('data-no-transition');\n      };\n\n      // Fallback: unlock after two frames in case ResizeObserver doesn't fire.\n      requestAnimationFrame(() => requestAnimationFrame(unlockTransition));\n\n      let mediaCleanup: (() => void) | undefined;\n      let bottomNavCleanup: (() => void) | undefined;\n      const itemObservers = new Map<HTMLElement, MutationObserver>();\n      const observer = new MutationObserver(() => {\n        if (!el.hasAttribute('collapsed') && !isControlled.value) return;\n\n        isControlled.value = true;\n        collapsedState.value = el.hasAttribute('collapsed');\n      });\n\n      observer.observe(el, {\n        attributeFilter: ['collapsed'],\n        attributes: true,\n      });\n      const closeOnEscape = (event: KeyboardEvent) => {\n        if (event.key !== 'Escape' || !isMobileOpen.value) return;\n\n        event.preventDefault();\n        setMobileOpen(false, 'toggle');\n      };\n      el.addEventListener('keydown', closeOnEscape);\n\n      watch(\n        props.responsive,\n        (query) => {\n          mediaCleanup?.();\n          mediaCleanup = undefined;\n\n          const mediaQuery = String(query ?? '').trim();\n\n          hasResponsiveQuery.value = Boolean(mediaQuery);\n          responsiveMaxWidthPx.value = parseMaxWidthPx(mediaQuery);\n          responsiveMediaMatches.value = false;\n\n          const width = readContainerWidth(el);\n\n          responsiveSizeMatches.value =\n            width > 0 && responsiveMaxWidthPx.value != null ? width <= responsiveMaxWidthPx.value : false;\n          applyResponsiveState();\n\n          // For parseable max-width queries, keep behavior container-driven.\n          // This avoids preview viewport controls being overridden by window width.\n          if (props['container-breakpoints'].value && responsiveMaxWidthPx.value != null) {\n            return;\n          }\n\n          if (!mediaQuery) {\n            return;\n          }\n\n          try {\n            const mediaHandle = createMediaQuery(mediaQuery);\n            const syncMedia = (state: ReturnType<typeof mediaHandle.getSnapshot>) => {\n              if (state) {\n                responsiveMediaMatches.value = state.matches;\n                applyResponsiveState();\n              }\n            };\n\n            syncMedia(mediaHandle.getSnapshot());\n\n            const mediaCleanupFn = watch(\n              fromSubscribable(mediaHandle, { signal: mediaHandle.disposalSignal }),\n              syncMedia,\n            );\n            mediaCleanup = () => {\n              mediaCleanupFn.dispose();\n              mediaHandle.dispose();\n            };\n          } catch (error) {\n            if (!(error instanceof SentinelUnavailableError)) throw error;\n          }\n        },\n        { immediate: true },\n      );\n\n      watch(\n        props['bottom-nav-at'],\n        (query) => {\n          bottomNavCleanup?.();\n          bottomNavCleanup = undefined;\n\n          const mediaQuery = String(query ?? '').trim();\n\n          bottomNavMaxWidthPx.value = parseMaxWidthPx(mediaQuery);\n          bottomNavMediaMatches.value = false;\n\n          const width = readContainerWidth(el);\n\n          bottomNavSizeMatches.value =\n            width > 0 && bottomNavMaxWidthPx.value != null ? width <= bottomNavMaxWidthPx.value : false;\n          applyResponsiveState();\n\n          // For parseable max-width queries, keep behavior container-driven.\n          // This avoids preview viewport controls being overridden by window width.\n          if (props['container-breakpoints'].value && bottomNavMaxWidthPx.value != null) {\n            return;\n          }\n\n          if (!mediaQuery) {\n            return;\n          }\n\n          try {\n            const mediaHandle = createMediaQuery(mediaQuery);\n            const syncMedia = (state: ReturnType<typeof mediaHandle.getSnapshot>) => {\n              if (state) {\n                bottomNavMediaMatches.value = state.matches;\n                applyResponsiveState();\n              }\n            };\n\n            syncMedia(mediaHandle.getSnapshot());\n\n            const mediaCleanupFn = watch(\n              fromSubscribable(mediaHandle, { signal: mediaHandle.disposalSignal }),\n              syncMedia,\n            );\n            bottomNavCleanup = () => {\n              mediaCleanupFn.dispose();\n              mediaHandle.dispose();\n            };\n          } catch (error) {\n            if (!(error instanceof SentinelUnavailableError)) throw error;\n          }\n        },\n        { immediate: true },\n      );\n\n      const stopResizeEffect =\n        typeof ResizeObserver === 'function'\n          ? (() => {\n              const hostSize = createElementSize(el);\n              onCleanup(() => hostSize.dispose());\n              const hostSizeSignal = fromSubscribable(hostSize, { signal: hostSize.disposalSignal });\n\n              const wrapperEl = el.parentElement;\n              const containerEl = resolveContainerElement(el);\n              const wrapperSize = wrapperEl ? createElementSize(wrapperEl) : undefined;\n              const parentSize = containerEl && containerEl !== wrapperEl ? createElementSize(containerEl) : undefined;\n\n              if (wrapperSize) {\n                onCleanup(() => wrapperSize.dispose());\n              }\n              if (parentSize) {\n                onCleanup(() => parentSize.dispose());\n              }\n\n              const wrapperSizeSignal = wrapperSize\n                ? fromSubscribable(wrapperSize, { signal: wrapperSize.disposalSignal })\n                : undefined;\n              const parentSizeSignal = parentSize\n                ? fromSubscribable(parentSize, { signal: parentSize.disposalSignal })\n                : undefined;\n\n              let rafId: number | undefined;\n\n              const onResize = () => {\n                if (rafId !== undefined) cancelAnimationFrame(rafId);\n\n                rafId = requestAnimationFrame(() => {\n                  const resolvedContainer = resolveContainerElement(el);\n                  const width = readContainerWidth(el);\n                  const responsiveWasMatched = responsiveSizeMatches.value;\n                  const bottomNavWasMatched = bottomNavSizeMatches.value;\n                  const parentWidth = resolvedContainer?.clientWidth ?? 0;\n\n                  isPreviewMode.value = parentWidth > 0 && parentWidth < window.innerWidth;\n\n                  responsiveSizeMatches.value =\n                    width > 0 && responsiveMaxWidthPx.value != null ? width <= responsiveMaxWidthPx.value : false;\n                  bottomNavSizeMatches.value =\n                    width > 0 && bottomNavMaxWidthPx.value != null ? width <= bottomNavMaxWidthPx.value : false;\n\n                  if (\n                    responsiveWasMatched !== responsiveSizeMatches.value ||\n                    bottomNavWasMatched !== bottomNavSizeMatches.value\n                  ) {\n                    applyResponsiveState();\n                  }\n\n                  unlockTransition();\n                });\n              };\n\n              return watch(\n                computed(() => [\n                  hostSizeSignal.value?.width,\n                  hostSizeSignal.value?.height,\n                  wrapperSizeSignal?.value?.width,\n                  wrapperSizeSignal?.value?.height,\n                  parentSizeSignal?.value?.width,\n                  parentSizeSignal?.value?.height,\n                ]),\n                onResize,\n              );\n            })()\n          : undefined;\n\n      const bindItemObservers = (items: HTMLElement[]) => {\n        const set = new Set(items);\n\n        for (const [item, cleanup] of itemObservers) {\n          if (set.has(item)) continue;\n\n          cleanup.disconnect();\n          itemObservers.delete(item);\n        }\n\n        for (const item of items) {\n          if (itemObservers.has(item)) continue;\n\n          const itemObserver = new MutationObserver(() => {\n            // Only update if in bottom-nav mode to minimize re-renders\n            if (isBottomNav.value) {\n              readBottomNavItems();\n            }\n          });\n\n          // Watch attributes and content that affect bottom-nav rendering.\n          itemObserver.observe(item, {\n            attributeFilter: ['active', 'bottom-nav', 'bottom-nav-label', 'disabled', 'href'],\n            attributes: true,\n            characterData: true,\n            childList: true,\n            subtree: true,\n          });\n          itemObservers.set(item, itemObserver);\n        }\n      };\n\n      const syncBottomNavItems = () => {\n        bindItemObservers([...el.querySelectorAll<HTMLElement>('ore-sidebar-item')]);\n        readBottomNavItems();\n      };\n      watch(slots.elements(), syncBottomNavItems, { immediate: true });\n      const nestedItemsObserver = new MutationObserver(syncBottomNavItems);\n      nestedItemsObserver.observe(el, { childList: true, subtree: true });\n\n      return () => {\n        observer.disconnect();\n        nestedItemsObserver.disconnect();\n        el.removeEventListener('keydown', closeOnEscape);\n        mediaCleanup?.();\n        bottomNavCleanup?.();\n        stopResizeEffect?.dispose();\n\n        for (const itemObserver of itemObservers.values()) {\n          itemObserver.disconnect();\n        }\n\n        itemObservers.clear();\n      };\n    });\n\n    return html`\n      <button\n        class=\"mobile-backdrop\"\n        part=\"mobile-backdrop\"\n        type=\"button\"\n        aria-label=\"${props['mobile-close-label']}\"\n        ?hidden=${() => !isBottomNav.value || !isMobileOpen.value}\n        @click=${() => setMobileOpen(false, 'toggle')}></button>\n      <nav\n        aria-label=\"${props.label}\"\n        aria-hidden=${() => (isBottomNav.value && !isMobileOpen.value ? 'true' : null)}\n        part=\"nav\"\n        tabindex=\"-1\"\n        ?inert=${() => isBottomNav.value && !isMobileOpen.value}>\n        <div class=\"sidebar-header\" part=\"header\" ?hidden=${() => !hasHeader() && !props.collapsible.value}>\n          <span class=\"sidebar-logo\" ?hidden=${() => !hasLogo()}>\n            <slot name=\"logo\"></slot>\n          </span>\n          <span class=\"sidebar-header-content\">\n            <slot name=\"header\"></slot>\n          </span>\n          <button\n            class=\"toggle-btn\"\n            part=\"toggle-btn\"\n            type=\"button\"\n            ?hidden=${() => !props.collapsible.value}\n            aria-label=\"${() => (isCollapsed() ? props['expand-label'].value : props['collapse-label'].value)}\"\n            aria-expanded=\"${() => !isCollapsed()}\"\n            @click=\"${doToggle}\">\n            <ore-icon\n              class=\"toggle-icon\"\n              name=${() => (isCollapsed() ? 'panel-left-open' : 'panel-left-close')}\n              size=\"18\"\n              stroke-width=\"2\"\n              aria-hidden=\"true\"></ore-icon>\n          </button>\n        </div>\n        <div class=\"sidebar-content\" part=\"content\">\n          <slot></slot>\n        </div>\n        <div class=\"sidebar-footer\" part=\"footer\" ?hidden=${() => !hasFooter()}>\n          <slot name=\"footer\"></slot>\n        </div>\n      </nav>\n\n      <div class=\"bottom-bar\" part=\"bottom-bar\" ?hidden=${() => !isBottomNav.value}>\n        ${() =>\n          bottomNavItems.value.map((item) => {\n            const className = `bottom-tab${item.active ? ' bottom-tab-active' : ''}`;\n\n            if (item.href && !item.disabled) {\n              return html`\n                <a\n                  class=\"${className}\"\n                  href=\"${item.href}\"\n                  aria-current=\"${item.active ? 'page' : null}\"\n                  data-active=\"${item.active ? 'true' : null}\">\n                  <span class=\"bottom-tab-icon\" aria-hidden=\"true\" ?hidden=${() => !item.iconName}>\n                    <ore-icon name=\"${item.iconName}\" size=\"18\" stroke-width=\"2\"></ore-icon>\n                  </span>\n                  <span class=\"bottom-tab-label\">${item.label}</span>\n                </a>\n              `;\n            }\n\n            return html`\n              <button\n                class=\"${className}\"\n                type=\"button\"\n                ?disabled=${item.disabled}\n                aria-current=\"${item.active ? 'page' : null}\"\n                data-active=\"${item.active ? 'true' : null}\"\n                @click=${() => item.source.click()}>\n                <span class=\"bottom-tab-icon\" aria-hidden=\"true\" ?hidden=${() => !item.iconName}>\n                  <ore-icon name=\"${item.iconName}\" size=\"18\" stroke-width=\"2\"></ore-icon>\n                </span>\n                <span class=\"bottom-tab-label\">${item.label}</span>\n              </button>\n            `;\n          })}\n      </div>\n    `;\n  },\n  styles: [coarsePointerMixin, reducedMotionMixin, sidebarStyles],\n});\n\n// ─── ore-sidebar-group styles ────────────────────────────────────────────────\n\n/** Sidebar group properties */\nexport type OreSidebarGroupProps = {\n  /** Whether this group can be collapsed */\n  collapsible?: boolean;\n  /** Initial open state in uncontrolled mode */\n  'default-open'?: boolean;\n  /** Accessible label for the group */\n  label?: string;\n  /** Controlled open state */\n  open?: boolean;\n};\n\n/**\n * `ore-sidebar-group` — A labelled section within `ore-sidebar`.\n *\n * @element ore-sidebar-group\n *\n * @attr {string} label - Group label text\n * @attr {boolean} collapsible - Whether this group can be toggled open/closed\n * @attr {boolean} open - Controlled expanded state\n * @attr {boolean} default-open - Initial expanded state in uncontrolled mode\n *\n * @fires open-change - Fired when the group open state changes (collapsible groups only). detail: { open: boolean }\n *\n * @slot - Navigation items (`ore-sidebar-item`)\n * @slot icon - Icon displayed before the label\n *\n * @example\n * ```html\n * <ore-sidebar-group label=\"Main\" collapsible open>\n *   <ore-sidebar-item href=\"/home\">Home</ore-sidebar-item>\n * </ore-sidebar-group>\n * ```\n */\nexport const SIDEBAR_GROUP_TAG = 'ore-sidebar-group' as const;\ndefine<OreSidebarGroupProps>(SIDEBAR_GROUP_TAG, {\n  props: {\n    collapsible: prop.bool(false),\n    'default-open': prop.bool(true),\n    label: prop.string(),\n    open: {\n      default: undefined as boolean | undefined,\n      parse: (value: string | null) => (value == null ? undefined : value === '' || value === 'true'),\n      reflect: false,\n    },\n  },\n  setup(props) {\n    const slots = useSlots();\n\n    const hasIcon = () => slots.has('icon').value;\n    const sidebarCtx = inject(SIDEBAR_CTX);\n\n    bind({\n      attr: {\n        'sidebar-bottom-nav': () =>\n          sidebarCtx?.mode.value === 'bottom-nav' && !sidebarCtx?.mobileOpen.value ? true : undefined,\n        'sidebar-collapsed': () => (sidebarCtx?.collapsed.value ? true : undefined),\n      },\n    });\n\n    const isControlled = () => props.open.value !== undefined;\n    const openState = signal(props['default-open'].value);\n    const isOpen = computed(() => {\n      if (!props.collapsible.value) return true;\n\n      if (isControlled()) return props.open.value ?? false;\n\n      return openState.value;\n    });\n\n    watch(props.open, (value) => {\n      if (value === undefined) return;\n\n      openState.value = value;\n    });\n\n    bind({\n      attr: {\n        open: () => (isOpen.value ? true : undefined),\n      },\n    });\n\n    return html`\n      <details class=\"group\" part=\"group\" ?open=${isOpen}>\n        <summary\n          class=\"group-header\"\n          part=\"group-header\"\n          aria-expanded=\"${() => (props.collapsible.value ? String(props.open.value) : null)}\"\n          @click=${(e: MouseEvent) => {\n            if (!props.collapsible.value) {\n              e.preventDefault();\n            }\n          }}>\n          <span class=\"group-icon\" part=\"group-icon\" ?hidden=${() => !hasIcon()} aria-hidden=\"true\">\n            <slot name=\"icon\"></slot>\n          </span>\n          <span class=\"group-label\" part=\"group-label\">${props.label}</span>\n          <span class=\"chevron\" ?hidden=${() => !props.collapsible.value} aria-hidden=\"true\">\n            <ore-icon name=\"chevron-right\" size=\"12\" stroke-width=\"2\" aria-hidden=\"true\"></ore-icon>\n          </span>\n        </summary>\n        <div class=\"group-items\" part=\"group-items\" role=\"list\">\n          <slot></slot>\n        </div>\n      </details>\n    `;\n  },\n  styles: [reducedMotionMixin, groupStyles],\n});\n\n// ─── ore-sidebar-item styles ─────────────────────────────────────────────────\n\n/** Sidebar item properties */\nexport type OreSidebarItemProps = {\n  /** Whether this item represents the current page/section */\n  active?: boolean;\n  'bottom-nav'?: boolean;\n  'bottom-nav-label'?: string;\n  /** Whether this item is disabled */\n  disabled?: boolean;\n  /** Navigation href — renders an `<a>` when set, otherwise a `<button>` */\n  href?: string;\n  label?: string;\n  /**\n   * Relationship of the linked URL (`rel` attribute on the inner `<a>`).\n   * Only applies when `href` is set.\n   */\n  rel?: string;\n  /**\n   * Browsing context for the link (`target` attribute on the inner `<a>`).\n   * Only applies when `href` is set.\n   */\n  target?: string;\n};\n\n/**\n * `ore-sidebar-item` — An individual navigation item in a `ore-sidebar`.\n *\n * Renders as an `<a>` when `href` is provided, otherwise as a `<button>`.\n * Marks the active page via `aria-current=\"page\"` when the `active` attribute is set.\n *\n * @element ore-sidebar-item\n *\n * @attr {string} href - Link URL; renders an anchor when set\n * @attr {boolean} active - Marks the item as the current page\n * @attr {boolean} disabled - Disables the item\n * @attr {string} rel - Anchor `rel` attribute (links only)\n * @attr {string} target - Anchor `target` attribute (links only)\n *\n * @slot - Label text\n * @slot icon - Leading icon\n * @slot end - Trailing content (badge, shortcut, arrow, etc.)\n *\n * @cssprop --sidebar-item-color - Default text color\n * @cssprop --sidebar-item-hover-bg - Hover background\n * @cssprop --sidebar-item-hover-color - Hover text color\n * @cssprop --sidebar-item-active-bg - Active background\n * @cssprop --sidebar-item-active-color - Active text color\n * @cssprop --sidebar-item-indicator - Active indicator bar color\n *\n * @part item - The inner anchor or button element\n * @part item-icon - The icon wrapper\n * @part item-label - The label wrapper\n * @part item-end - The trailing content wrapper\n *\n * @example\n * ```html\n * <ore-sidebar-item href=\"/dashboard\" active>\n *   <span slot=\"icon\">🏠</span>\n *   Dashboard\n * </ore-sidebar-item>\n *\n * <ore-sidebar-item href=\"/users\">\n *   <span slot=\"icon\">👤</span>\n *   Users\n *   <ore-badge slot=\"end\" color=\"primary\">3</ore-badge>\n * </ore-sidebar-item>\n * ```\n */\nexport const SIDEBAR_ITEM_TAG = 'ore-sidebar-item' as const;\ndefine<OreSidebarItemProps>(SIDEBAR_ITEM_TAG, {\n  props: {\n    active: prop.bool(false),\n    'bottom-nav': prop.bool(false),\n    'bottom-nav-label': prop.string(),\n    disabled: prop.bool(false),\n    href: prop.string(),\n    label: prop.string(),\n    rel: prop.string(),\n    target: prop.string(),\n  },\n  setup(props) {\n    const slots = useSlots();\n\n    const hasIcon = () => slots.has('icon').value;\n    const hasEnd = () => slots.has('end').value;\n    const sidebarCtx = inject(SIDEBAR_CTX);\n\n    bind({\n      attr: {\n        'sidebar-bottom-nav': () =>\n          sidebarCtx?.mode.value === 'bottom-nav' && !sidebarCtx?.mobileOpen.value ? true : undefined,\n        'sidebar-collapsed': () => (sidebarCtx?.collapsed.value ? true : undefined),\n      },\n    });\n\n    const isLink = () => !!props.href.value && !props.disabled.value;\n\n    // Prevent reverse tabnapping: auto-inject noopener + noreferrer for _blank links.\n    const effectiveRel = computed(() => computeSafeRel(props.rel.value, props.target.value));\n    const closeMobileOnSelect = (event: MouseEvent) => {\n      if (!sidebarCtx?.closeOnSelect.value || !sidebarCtx.mobileOpen.value) return;\n      if (event.button !== 0 || event.metaKey || event.ctrlKey || event.shiftKey || event.altKey) return;\n\n      queueMicrotask(sidebarCtx.closeMobile);\n    };\n\n    const renderItemContent = () => html`\n      <span class=\"item-icon\" part=\"item-icon\" ?hidden=${() => !hasIcon()} aria-hidden=\"true\">\n        <slot name=\"icon\"></slot>\n      </span>\n      <span class=\"item-label\" part=\"item-label\"><slot></slot></span>\n      <span class=\"item-end\" part=\"item-end\" ?hidden=${() => !hasEnd()}>\n        <slot name=\"end\"></slot>\n      </span>\n    `;\n\n    return html`\n      ${() => {\n        if (isLink()) {\n          return html`\n            <a\n              class=\"item\"\n              part=\"item\"\n              href=\"${props.href}\"\n              rel=\"${effectiveRel}\"\n              target=\"${props.target}\"\n              aria-label=\"${props.label}\"\n              aria-current=\"${() => (props.active.value ? 'page' : null)}\"\n              @click=${closeMobileOnSelect}>\n              ${renderItemContent()}\n            </a>\n          `;\n        }\n\n        if (props.disabled.value) {\n          return html`\n            <div\n              class=\"item\"\n              part=\"item\"\n              aria-disabled=\"true\"\n              tabindex=\"-1\"\n              aria-label=\"${props.label}\"\n              aria-current=\"${() => (props.active.value ? 'page' : null)}\">\n              ${renderItemContent()}\n            </div>\n          `;\n        }\n\n        return html`\n          <button\n            class=\"item\"\n            part=\"item\"\n            type=\"button\"\n            ?disabled=\"${props.disabled}\"\n            aria-label=\"${props.label}\"\n            aria-current=\"${() => (props.active.value ? 'page' : null)}\"\n            @click=${closeMobileOnSelect}>\n            ${renderItemContent()}\n          </button>\n        `;\n      }}\n    `;\n  },\n  styles: [coarsePointerMixin, itemStyles],\n});\n"],"mappings":"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"}