@k2b/ui 0.10.0 → 0.11.0

package/dist/browser/feedback/HoverPreview.js

@@ -327,14 +327,14 @@ export function createHoverPreview(options = {}) {
       leave,
       focusOut,
       toggled: visible => {
-        if (!visible) {
-          // Light dismissal by the browser: an outside click or another popover.
+        // Light dismissal by the browser: an outside click or another popover.
+        // The event of a close this controller made itself arrives later, when
+        // the pointer may already wait on the next anchor; that delay stays.
+        if (!visible && open()) {
           clear();
           pinned = undefined;
-          if (open()) {
-            setOpen(false);
-            listen(false);
-          }
+          setOpen(false);
+          listen(false);
         }
         options.onOpenChange?.(visible);
       }

package/dist/browser/feedback/HoverPreview.js.map

@@ -1 +1 @@
-{"version":3,"names":[],"sources":["feedback/HoverPreview.tsx"],"sourcesContent":["import { type Accessor, createEffect, createSignal, createUniqueId, type JSX, onCleanup, onMount, Show } from \"solid-js\";\nimport { returnFocus, ringOnReturn } from \"../internal/focus-return\";\nimport { positionTooltipSurface } from \"./tooltip-position\";\n\n/** A resting pointer moving from one anchor to another swaps the card this fast. */\nconst SWAP_DELAY = 90;\n/** Grace period for the pointer to travel from an anchor into the card. */\nconst CLOSE_DELAY = 180;\n/** Distance to the region and to the boundary edges. */\nconst GAP = 8;\n/** Keys the wiring between a controller and its `<HoverPreview>`. */\nconst INTERNALS = Symbol(\"k2b-hover-preview\");\n\n/**\n * Where the card opens. By default it opens to the right of its anchor,\n * centered on it or aligned with its bottom edge, and flips or clamps to stay\n * in the viewport. With `beside`, it opens right of that region, such as a list\n * column, top-aligned with the anchor and clamped into `within` (default: the\n * viewport); when the card does not fit there, it does not open at all.\n */\nexport type HoverPreviewPlacement =\n  | { align?: \"center\" | \"end\" }\n  | { beside: () => HTMLElement | null | undefined; within?: () => HTMLElement | null | undefined };\n\nexport type HoverPreviewOptions<T> = {\n  /** Milliseconds a resting mouse waits on an anchor before the card opens. Defaults to 250. */\n  openDelay?: number;\n  /**\n   * How keyboard users open the card: `\"space\"` (default) toggles it with Space\n   * on the focused anchor and leaves focus there; `\"focus\"` opens it after the\n   * open delay whenever an anchor receives focus.\n   */\n  keyboard?: \"space\" | \"focus\";\n  placement?: HoverPreviewPlacement;\n  /** Anchors whose value is disabled open no card; an open card closes once its value becomes disabled. */\n  disabled?: (value: T) => boolean;\n  /** Runs whenever the card opens or closes, including light dismissal by the browser. */\n  onOpenChange?: (open: boolean) => void;\n};\n\nexport type HoverPreviewController<T> = {\n  /** Id of the card element, for `aria-controls`. */\n  readonly id: string;\n  /**\n   * Registers an anchor element for `value`; use the result as a `ref`.\n   * `trigger` is the control that toggles the card for this anchor; Escape\n   * returns focus there when focus is inside the card. Defaults to the anchor.\n   */\n  anchor: (value: T, trigger?: () => HTMLElement | null | undefined) => (element: HTMLElement) => void;\n  /** The value whose card is open, or `undefined` while closed. */\n  active: Accessor<T | undefined>;\n  /** Opens the card for `value` at once and moves focus into it, or closes it when it is already pinned open. */\n  toggle: (value: T) => void;\n  /** Closes the card; it reopens for the same anchor only after the pointer left it. */\n  close: () => void;\n  /** Wiring for `<HoverPreview>`; not part of the public contract. */\n  readonly [INTERNALS]: Internals<T>;\n};\n\ntype Anchor<T> = { value: T; element: HTMLElement; trigger?: () => HTMLElement | null | undefined };\n\ntype Internals<T> = {\n  current: Accessor<Anchor<T> | undefined>;\n  bind: (surface: HTMLElement) => void;\n  enterSurface: () => void;\n  leave: () => void;\n  focusOut: (event: FocusEvent) => void;\n  toggled: (open: boolean) => void;\n};\n\n/** Elements that use Space themselves; Space on them never toggles the card. */\nconst OWNS_SPACE = [\n  \"button, input, select, textarea, summary, [contenteditable]:not([contenteditable='false'])\",\n  ...[\"button\", \"checkbox\", \"switch\", \"radio\", \"option\", \"menuitem\", \"menuitemcheckbox\", \"menuitemradio\", \"tab\", \"treeitem\"].map(\n    (role) => `[role='${role}']`,\n  ),\n].join(\", \");\n\n/** Open light-dismiss popovers, such as a menu or a date picker, close when another one opens. */\nconst AUTO_POPOVER = \":is([popover=''], [popover='auto' i]):popover-open\";\n\n/**\n * Creates the behavior of one hover preview card shared by a group of anchors,\n * such as the rows of a list. Render the card with `<HoverPreview preview={…}>`.\n */\nexport function createHoverPreview<T>(options: HoverPreviewOptions<T> = {}): HoverPreviewController<T> {\n  const id = `k2b-hover-preview-${createUniqueId()}`;\n  const anchors = new Set<Anchor<T>>();\n  const [current, setCurrent] = createSignal<Anchor<T>>();\n  const [open, setOpen] = createSignal(false);\n  let surface: HTMLElement | undefined;\n  let timer: ReturnType<typeof setTimeout> | undefined;\n  /** The anchor whose open delay runs while the card is closed. */\n  let pending: Anchor<T> | undefined;\n  /** The anchor that Space or `toggle()` opened the card for; only it outlasts the pointer leaving. */\n  let pinned: Anchor<T> | undefined;\n  let dismissed: Anchor<T> | undefined;\n  let ring = true;\n  let observer: ResizeObserver | undefined;\n\n  const placement = (): HoverPreviewPlacement => options.placement ?? {};\n  const region = () => {\n    const value = placement();\n    return \"beside\" in value ? value : undefined;\n  };\n  const focusTarget = (anchor: Anchor<T>) => anchor.trigger?.() ?? anchor.element;\n  const anchorOf = (node: Node) => [...anchors].find((anchor) => anchor.element.contains(node));\n  const clear = () => {\n    clearTimeout(timer);\n    timer = undefined;\n    if (pending && !open()) document.removeEventListener(\"keydown\", escape);\n    pending = undefined;\n  };\n  /** A passive card never closes a menu or another popover someone opened on purpose. */\n  const blocked = () =>\n    [...document.querySelectorAll(AUTO_POPOVER)].some((popover) => popover !== surface && !(surface && popover.contains(surface)));\n\n  /** The boundary rectangle, never larger than the viewport. */\n  const bounds = (within: Element | null | undefined) => {\n    const rect = within?.getBoundingClientRect();\n    return {\n      top: Math.max(0, rect?.top ?? 0),\n      right: Math.min(window.innerWidth, rect?.right ?? window.innerWidth),\n      bottom: Math.min(window.innerHeight, rect?.bottom ?? window.innerHeight),\n    };\n  };\n  /** Room right of the region for the card plus a gap on both sides. Works while the card is hidden. */\n  const hasRoom = () => {\n    const beside = region();\n    if (!beside || !surface) return true;\n    const area = beside.beside()?.getBoundingClientRect();\n    if (!area) return false;\n    const width = surface.getBoundingClientRect().width || Number.parseFloat(getComputedStyle(surface).width) || 0;\n    return bounds(beside.within?.()).right - area.right >= width + 2 * GAP;\n  };\n  const position = () => {\n    const anchor = current();\n    if (!surface || !anchor) return;\n    const beside = region();\n    if (beside) {\n      const area = beside.beside()?.getBoundingClientRect() ?? anchor.element.getBoundingClientRect();\n      const box = bounds(beside.within?.());\n      const height = surface.getBoundingClientRect().height;\n      const top = anchor.element.getBoundingClientRect().top;\n      surface.style.left = `${Math.round(area.right + GAP)}px`;\n      surface.style.top = `${Math.round(Math.max(box.top + GAP, Math.min(top, box.bottom - height - GAP)))}px`;\n      return;\n    }\n    positionTooltipSurface(surface, anchor.element, \"right\");\n    const value = placement();\n    if (!(\"beside\" in value) && value.align === \"end\") {\n      const height = surface.getBoundingClientRect().height;\n      const bottom = anchor.element.getBoundingClientRect().bottom;\n      surface.style.top = `${Math.round(Math.max(8, Math.min(bottom - height, window.innerHeight - height - 8)))}px`;\n    }\n  };\n\n  const escape = (event: KeyboardEvent) => {\n    if (event.key !== \"Escape\") return;\n    if (!open()) {\n      // Escape during the open delay works as if the card had opened and closed.\n      if (pending) dismissed = pending;\n      clear();\n      return;\n    }\n    // Focus in the card goes back to the trigger: handled here, so the browser\n    // neither returns it itself nor lights the ring for this key. A card the\n    // pointer opened leaves the key to other handlers, such as an open modeless dialog.\n    if (surface?.contains(document.activeElement)) event.preventDefault();\n    dismiss();\n  };\n  // A card beside a region belongs to a row of a scrolling list: once the list\n  // scrolls, another row sits under the pointer, so the card closes. A card\n  // beside its anchor follows it.\n  const scroll = (event: Event) => {\n    const target = event.target;\n    if (!region()) return position();\n    if (!(target instanceof Node) || surface?.contains(target)) return;\n    const anchor = current();\n    if (!anchor || target.contains(anchor.element)) hide();\n  };\n  const resize = () => {\n    if (hasRoom()) position();\n    else hide();\n  };\n  const listen = (on: boolean) => {\n    if (on) {\n      document.addEventListener(\"keydown\", escape);\n      window.addEventListener(\"scroll\", scroll, true);\n      window.addEventListener(\"resize\", resize);\n      return;\n    }\n    document.removeEventListener(\"keydown\", escape);\n    window.removeEventListener(\"scroll\", scroll, true);\n    window.removeEventListener(\"resize\", resize);\n  };\n\n  const hide = () => {\n    clear();\n    pinned = undefined;\n    if (!open()) return;\n    setOpen(false);\n    listen(false);\n    try {\n      surface?.hidePopover();\n    } catch {\n      // The card may already be disconnected during cleanup.\n    }\n  };\n  const dismiss = () => {\n    const anchor = current();\n    dismissed = anchor;\n    // Before hiding, so the popover does not return focus on its own.\n    if (anchor && surface?.contains(document.activeElement)) returnFocus(focusTarget(anchor), ring);\n    hide();\n  };\n  /**\n   * Opens the card for `anchor` or moves it there; `pin` keeps it open after\n   * the pointer leaves. Moving the card to another anchor drops an earlier pin.\n   * Returns whether it is open for `anchor`.\n   */\n  const show = (anchor: Anchor<T>, pin: boolean): boolean => {\n    clear();\n    if (!surface || dismissed === anchor) return false;\n    if (options.disabled?.(anchor.value) || !hasRoom()) {\n      hide();\n      return false;\n    }\n    if (!open() || current() !== anchor) {\n      ring = ringOnReturn(focusTarget(anchor));\n      setCurrent(anchor);\n      if (!open()) {\n        try {\n          surface.showPopover();\n        } catch {\n          return false;\n        }\n        setOpen(true);\n        listen(true);\n      }\n      position();\n      pinned = undefined;\n    }\n    if (pin) pinned = anchor;\n    return true;\n  };\n  /** Shows `anchor` after `delay`; a keyboard swap (`follow`) carries an existing pin along. */\n  const schedule = (anchor: Anchor<T>, delay: number, follow = false) => {\n    clear();\n    if (!open()) {\n      pending = anchor;\n      document.addEventListener(\"keydown\", escape);\n    }\n    timer = setTimeout(() => {\n      if (open()) show(anchor, follow && pinned !== undefined);\n      else if (blocked()) clear();\n      else show(anchor, false);\n    }, delay);\n  };\n  const leave = () => {\n    clear();\n    dismissed = undefined;\n    if (pinned && pinned === current()) return;\n    timer = setTimeout(() => {\n      // Focus holds the card open inside it, and on the anchor where focus opens it.\n      const focused = document.activeElement;\n      const held = surface?.contains(focused) || (options.keyboard === \"focus\" && current()?.element.contains(focused));\n      if (!held) hide();\n    }, CLOSE_DELAY);\n  };\n  const focusOut = (event: FocusEvent) => {\n    const next = event.relatedTarget;\n    if (next instanceof Node && (surface?.contains(next) || anchorOf(next))) return;\n    pinned = undefined;\n    leave();\n  };\n\n  createEffect(() => {\n    const anchor = current();\n    if (open() && anchor && options.disabled?.(anchor.value)) hide();\n  });\n  // Only an open card holds global listeners, so a server render that\n  // disposes the controller touches no browser globals.\n  onCleanup(() => {\n    hide();\n    observer?.disconnect();\n  });\n\n  const anchor =\n    (value: T, trigger?: () => HTMLElement | null | undefined) =>\n    (element: HTMLElement): void => {\n      const entry: Anchor<T> = { value, element, trigger };\n      anchors.add(entry);\n      const pointerEnter = (event: PointerEvent) => {\n        // Touch and pen have no resting hover; the card stays a mouse affordance.\n        if (event.pointerType !== \"mouse\") return;\n        clear();\n        if ((open() && current() === entry) || dismissed === entry) return;\n        schedule(entry, open() ? SWAP_DELAY : (options.openDelay ?? 250));\n      };\n      // The open delay counts from the moment the mouse rests. An open card\n      // swaps on entering another anchor and ignores movement inside it.\n      const pointerMove = (event: PointerEvent) => {\n        if (event.pointerType === \"mouse\" && !open() && dismissed !== entry) schedule(entry, options.openDelay ?? 250);\n      };\n      // A press acts on the row, such as opening it or its menu; a card about to open stays closed.\n      const pointerDown = () => clear();\n      const focusIn = () => {\n        if (open()) {\n          if (current() === entry) clear();\n          else schedule(entry, SWAP_DELAY, true);\n          return;\n        }\n        clear();\n        if (options.keyboard === \"focus\" && dismissed !== entry) schedule(entry, options.openDelay ?? 250);\n      };\n      const keyDown = (event: KeyboardEvent) => {\n        if (options.keyboard === \"focus\" || event.key !== \" \" || event.defaultPrevented) return;\n        // Shift+Space keeps scrolling up; other modifiers belong to shortcuts.\n        if (event.shiftKey || event.ctrlKey || event.altKey || event.metaKey) return;\n        if (event.target instanceof Element && event.target.matches(OWNS_SPACE)) return;\n        event.preventDefault();\n        // A held key toggles once; its repeats only keep the page from scrolling.\n        if (event.repeat) return;\n        if (open() && current() === entry) {\n          dismiss();\n          return;\n        }\n        dismissed = undefined;\n        show(entry, true);\n      };\n      element.addEventListener(\"pointerenter\", pointerEnter);\n      element.addEventListener(\"pointermove\", pointerMove);\n      element.addEventListener(\"pointerdown\", pointerDown);\n      element.addEventListener(\"pointerleave\", leave);\n      element.addEventListener(\"focusin\", focusIn);\n      element.addEventListener(\"focusout\", focusOut);\n      element.addEventListener(\"keydown\", keyDown);\n      onCleanup(() => {\n        anchors.delete(entry);\n        if (current() === entry) hide();\n        element.removeEventListener(\"pointerenter\", pointerEnter);\n        element.removeEventListener(\"pointermove\", pointerMove);\n        element.removeEventListener(\"pointerdown\", pointerDown);\n        element.removeEventListener(\"pointerleave\", leave);\n        element.removeEventListener(\"focusin\", focusIn);\n        element.removeEventListener(\"focusout\", focusOut);\n        element.removeEventListener(\"keydown\", keyDown);\n      });\n    };\n\n  return {\n    id,\n    anchor,\n    active: () => (open() ? current()?.value : undefined),\n    toggle: (value) => {\n      const entry = [...anchors].find((candidate) => candidate.value === value);\n      if (!entry || !surface) return;\n      clear();\n      if (open() && pinned === entry && current() === entry) {\n        dismiss();\n        return;\n      }\n      // A hover may have opened the card before this click or key press pinned it.\n      ring = ringOnReturn(focusTarget(entry));\n      dismissed = undefined;\n      if (show(entry, true)) surface.focus();\n    },\n    close: dismiss,\n    [INTERNALS]: {\n      current,\n      bind: (element) => {\n        surface = element;\n        observer = new ResizeObserver(() => {\n          if (open()) position();\n        });\n        observer.observe(element);\n      },\n      enterSurface: clear,\n      leave,\n      focusOut,\n      toggled: (visible) => {\n        if (!visible) {\n          // Light dismissal by the browser: an outside click or another popover.\n          clear();\n          pinned = undefined;\n          if (open()) {\n            setOpen(false);\n            listen(false);\n          }\n        }\n        options.onOpenChange?.(visible);\n      },\n    },\n  };\n}\n\nexport type HoverPreviewProps<T> = {\n  preview: HoverPreviewController<T>;\n  /** Accessible name of the card. */\n  label: string;\n  /** `\"content\"` (default) sizes the card to its content up to 32rem; `\"fixed\"` keeps one 22rem × 20rem box for every anchor. */\n  size?: \"content\" | \"fixed\";\n  class?: string;\n  /** Plain content stays mounted while the card is closed; a function renders the open anchor's value. */\n  children: JSX.Element | ((value: T) => JSX.Element);\n};\n\n/**\n * A non-modal card that opens beside the anchor a resting mouse points at.\n * Native popover owns the top layer and light dismissal.\n */\nexport function HoverPreview<T>(props: HoverPreviewProps<T>): JSX.Element {\n  const state = props.preview[INTERNALS];\n  let surface!: HTMLDivElement;\n  onMount(() => state.bind(surface));\n  const content = () => {\n    const children = props.children;\n    if (typeof children !== \"function\") return children;\n    return (\n      <Show when={state.current()} keyed>\n        {(anchor) => children(anchor.value)}\n      </Show>\n    );\n  };\n  return (\n    <div\n      ref={surface}\n      id={props.preview.id}\n      popover=\"auto\"\n      role=\"dialog\"\n      aria-label={props.label}\n      tabIndex={-1}\n      class={props.class ? `k2b-hover-preview ${props.class}` : \"k2b-hover-preview\"}\n      data-size={props.size ?? \"content\"}\n      onPointerEnter={() => state.enterSurface()}\n      onPointerLeave={() => state.leave()}\n      on:focusout={(event) => state.focusOut(event)}\n      onToggle={(event) => state.toggled(event.newState === \"open\")}\n    >\n      {content()}\n    </div>\n  );\n}\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"names":[],"sources":["feedback/HoverPreview.tsx"],"sourcesContent":["import { type Accessor, createEffect, createSignal, createUniqueId, type JSX, onCleanup, onMount, Show } from \"solid-js\";\nimport { returnFocus, ringOnReturn } from \"../internal/focus-return\";\nimport { positionTooltipSurface } from \"./tooltip-position\";\n\n/** A resting pointer moving from one anchor to another swaps the card this fast. */\nconst SWAP_DELAY = 90;\n/** Grace period for the pointer to travel from an anchor into the card. */\nconst CLOSE_DELAY = 180;\n/** Distance to the region and to the boundary edges. */\nconst GAP = 8;\n/** Keys the wiring between a controller and its `<HoverPreview>`. */\nconst INTERNALS = Symbol(\"k2b-hover-preview\");\n\n/**\n * Where the card opens. By default it opens to the right of its anchor,\n * centered on it or aligned with its bottom edge, and flips or clamps to stay\n * in the viewport. With `beside`, it opens right of that region, such as a list\n * column, top-aligned with the anchor and clamped into `within` (default: the\n * viewport); when the card does not fit there, it does not open at all.\n */\nexport type HoverPreviewPlacement =\n  | { align?: \"center\" | \"end\" }\n  | { beside: () => HTMLElement | null | undefined; within?: () => HTMLElement | null | undefined };\n\nexport type HoverPreviewOptions<T> = {\n  /** Milliseconds a resting mouse waits on an anchor before the card opens. Defaults to 250. */\n  openDelay?: number;\n  /**\n   * How keyboard users open the card: `\"space\"` (default) toggles it with Space\n   * on the focused anchor and leaves focus there; `\"focus\"` opens it after the\n   * open delay whenever an anchor receives focus.\n   */\n  keyboard?: \"space\" | \"focus\";\n  placement?: HoverPreviewPlacement;\n  /** Anchors whose value is disabled open no card; an open card closes once its value becomes disabled. */\n  disabled?: (value: T) => boolean;\n  /** Runs whenever the card opens or closes, including light dismissal by the browser. */\n  onOpenChange?: (open: boolean) => void;\n};\n\nexport type HoverPreviewController<T> = {\n  /** Id of the card element, for `aria-controls`. */\n  readonly id: string;\n  /**\n   * Registers an anchor element for `value`; use the result as a `ref`.\n   * `trigger` is the control that toggles the card for this anchor; Escape\n   * returns focus there when focus is inside the card. Defaults to the anchor.\n   */\n  anchor: (value: T, trigger?: () => HTMLElement | null | undefined) => (element: HTMLElement) => void;\n  /** The value whose card is open, or `undefined` while closed. */\n  active: Accessor<T | undefined>;\n  /** Opens the card for `value` at once and moves focus into it, or closes it when it is already pinned open. */\n  toggle: (value: T) => void;\n  /** Closes the card; it reopens for the same anchor only after the pointer left it. */\n  close: () => void;\n  /** Wiring for `<HoverPreview>`; not part of the public contract. */\n  readonly [INTERNALS]: Internals<T>;\n};\n\ntype Anchor<T> = { value: T; element: HTMLElement; trigger?: () => HTMLElement | null | undefined };\n\ntype Internals<T> = {\n  current: Accessor<Anchor<T> | undefined>;\n  bind: (surface: HTMLElement) => void;\n  enterSurface: () => void;\n  leave: () => void;\n  focusOut: (event: FocusEvent) => void;\n  toggled: (open: boolean) => void;\n};\n\n/** Elements that use Space themselves; Space on them never toggles the card. */\nconst OWNS_SPACE = [\n  \"button, input, select, textarea, summary, [contenteditable]:not([contenteditable='false'])\",\n  ...[\"button\", \"checkbox\", \"switch\", \"radio\", \"option\", \"menuitem\", \"menuitemcheckbox\", \"menuitemradio\", \"tab\", \"treeitem\"].map(\n    (role) => `[role='${role}']`,\n  ),\n].join(\", \");\n\n/** Open light-dismiss popovers, such as a menu or a date picker, close when another one opens. */\nconst AUTO_POPOVER = \":is([popover=''], [popover='auto' i]):popover-open\";\n\n/**\n * Creates the behavior of one hover preview card shared by a group of anchors,\n * such as the rows of a list. Render the card with `<HoverPreview preview={…}>`.\n */\nexport function createHoverPreview<T>(options: HoverPreviewOptions<T> = {}): HoverPreviewController<T> {\n  const id = `k2b-hover-preview-${createUniqueId()}`;\n  const anchors = new Set<Anchor<T>>();\n  const [current, setCurrent] = createSignal<Anchor<T>>();\n  const [open, setOpen] = createSignal(false);\n  let surface: HTMLElement | undefined;\n  let timer: ReturnType<typeof setTimeout> | undefined;\n  /** The anchor whose open delay runs while the card is closed. */\n  let pending: Anchor<T> | undefined;\n  /** The anchor that Space or `toggle()` opened the card for; only it outlasts the pointer leaving. */\n  let pinned: Anchor<T> | undefined;\n  let dismissed: Anchor<T> | undefined;\n  let ring = true;\n  let observer: ResizeObserver | undefined;\n\n  const placement = (): HoverPreviewPlacement => options.placement ?? {};\n  const region = () => {\n    const value = placement();\n    return \"beside\" in value ? value : undefined;\n  };\n  const focusTarget = (anchor: Anchor<T>) => anchor.trigger?.() ?? anchor.element;\n  const anchorOf = (node: Node) => [...anchors].find((anchor) => anchor.element.contains(node));\n  const clear = () => {\n    clearTimeout(timer);\n    timer = undefined;\n    if (pending && !open()) document.removeEventListener(\"keydown\", escape);\n    pending = undefined;\n  };\n  /** A passive card never closes a menu or another popover someone opened on purpose. */\n  const blocked = () =>\n    [...document.querySelectorAll(AUTO_POPOVER)].some((popover) => popover !== surface && !(surface && popover.contains(surface)));\n\n  /** The boundary rectangle, never larger than the viewport. */\n  const bounds = (within: Element | null | undefined) => {\n    const rect = within?.getBoundingClientRect();\n    return {\n      top: Math.max(0, rect?.top ?? 0),\n      right: Math.min(window.innerWidth, rect?.right ?? window.innerWidth),\n      bottom: Math.min(window.innerHeight, rect?.bottom ?? window.innerHeight),\n    };\n  };\n  /** Room right of the region for the card plus a gap on both sides. Works while the card is hidden. */\n  const hasRoom = () => {\n    const beside = region();\n    if (!beside || !surface) return true;\n    const area = beside.beside()?.getBoundingClientRect();\n    if (!area) return false;\n    const width = surface.getBoundingClientRect().width || Number.parseFloat(getComputedStyle(surface).width) || 0;\n    return bounds(beside.within?.()).right - area.right >= width + 2 * GAP;\n  };\n  const position = () => {\n    const anchor = current();\n    if (!surface || !anchor) return;\n    const beside = region();\n    if (beside) {\n      const area = beside.beside()?.getBoundingClientRect() ?? anchor.element.getBoundingClientRect();\n      const box = bounds(beside.within?.());\n      const height = surface.getBoundingClientRect().height;\n      const top = anchor.element.getBoundingClientRect().top;\n      surface.style.left = `${Math.round(area.right + GAP)}px`;\n      surface.style.top = `${Math.round(Math.max(box.top + GAP, Math.min(top, box.bottom - height - GAP)))}px`;\n      return;\n    }\n    positionTooltipSurface(surface, anchor.element, \"right\");\n    const value = placement();\n    if (!(\"beside\" in value) && value.align === \"end\") {\n      const height = surface.getBoundingClientRect().height;\n      const bottom = anchor.element.getBoundingClientRect().bottom;\n      surface.style.top = `${Math.round(Math.max(8, Math.min(bottom - height, window.innerHeight - height - 8)))}px`;\n    }\n  };\n\n  const escape = (event: KeyboardEvent) => {\n    if (event.key !== \"Escape\") return;\n    if (!open()) {\n      // Escape during the open delay works as if the card had opened and closed.\n      if (pending) dismissed = pending;\n      clear();\n      return;\n    }\n    // Focus in the card goes back to the trigger: handled here, so the browser\n    // neither returns it itself nor lights the ring for this key. A card the\n    // pointer opened leaves the key to other handlers, such as an open modeless dialog.\n    if (surface?.contains(document.activeElement)) event.preventDefault();\n    dismiss();\n  };\n  // A card beside a region belongs to a row of a scrolling list: once the list\n  // scrolls, another row sits under the pointer, so the card closes. A card\n  // beside its anchor follows it.\n  const scroll = (event: Event) => {\n    const target = event.target;\n    if (!region()) return position();\n    if (!(target instanceof Node) || surface?.contains(target)) return;\n    const anchor = current();\n    if (!anchor || target.contains(anchor.element)) hide();\n  };\n  const resize = () => {\n    if (hasRoom()) position();\n    else hide();\n  };\n  const listen = (on: boolean) => {\n    if (on) {\n      document.addEventListener(\"keydown\", escape);\n      window.addEventListener(\"scroll\", scroll, true);\n      window.addEventListener(\"resize\", resize);\n      return;\n    }\n    document.removeEventListener(\"keydown\", escape);\n    window.removeEventListener(\"scroll\", scroll, true);\n    window.removeEventListener(\"resize\", resize);\n  };\n\n  const hide = () => {\n    clear();\n    pinned = undefined;\n    if (!open()) return;\n    setOpen(false);\n    listen(false);\n    try {\n      surface?.hidePopover();\n    } catch {\n      // The card may already be disconnected during cleanup.\n    }\n  };\n  const dismiss = () => {\n    const anchor = current();\n    dismissed = anchor;\n    // Before hiding, so the popover does not return focus on its own.\n    if (anchor && surface?.contains(document.activeElement)) returnFocus(focusTarget(anchor), ring);\n    hide();\n  };\n  /**\n   * Opens the card for `anchor` or moves it there; `pin` keeps it open after\n   * the pointer leaves. Moving the card to another anchor drops an earlier pin.\n   * Returns whether it is open for `anchor`.\n   */\n  const show = (anchor: Anchor<T>, pin: boolean): boolean => {\n    clear();\n    if (!surface || dismissed === anchor) return false;\n    if (options.disabled?.(anchor.value) || !hasRoom()) {\n      hide();\n      return false;\n    }\n    if (!open() || current() !== anchor) {\n      ring = ringOnReturn(focusTarget(anchor));\n      setCurrent(anchor);\n      if (!open()) {\n        try {\n          surface.showPopover();\n        } catch {\n          return false;\n        }\n        setOpen(true);\n        listen(true);\n      }\n      position();\n      pinned = undefined;\n    }\n    if (pin) pinned = anchor;\n    return true;\n  };\n  /** Shows `anchor` after `delay`; a keyboard swap (`follow`) carries an existing pin along. */\n  const schedule = (anchor: Anchor<T>, delay: number, follow = false) => {\n    clear();\n    if (!open()) {\n      pending = anchor;\n      document.addEventListener(\"keydown\", escape);\n    }\n    timer = setTimeout(() => {\n      if (open()) show(anchor, follow && pinned !== undefined);\n      else if (blocked()) clear();\n      else show(anchor, false);\n    }, delay);\n  };\n  const leave = () => {\n    clear();\n    dismissed = undefined;\n    if (pinned && pinned === current()) return;\n    timer = setTimeout(() => {\n      // Focus holds the card open inside it, and on the anchor where focus opens it.\n      const focused = document.activeElement;\n      const held = surface?.contains(focused) || (options.keyboard === \"focus\" && current()?.element.contains(focused));\n      if (!held) hide();\n    }, CLOSE_DELAY);\n  };\n  const focusOut = (event: FocusEvent) => {\n    const next = event.relatedTarget;\n    if (next instanceof Node && (surface?.contains(next) || anchorOf(next))) return;\n    pinned = undefined;\n    leave();\n  };\n\n  createEffect(() => {\n    const anchor = current();\n    if (open() && anchor && options.disabled?.(anchor.value)) hide();\n  });\n  // Only an open card holds global listeners, so a server render that\n  // disposes the controller touches no browser globals.\n  onCleanup(() => {\n    hide();\n    observer?.disconnect();\n  });\n\n  const anchor =\n    (value: T, trigger?: () => HTMLElement | null | undefined) =>\n    (element: HTMLElement): void => {\n      const entry: Anchor<T> = { value, element, trigger };\n      anchors.add(entry);\n      const pointerEnter = (event: PointerEvent) => {\n        // Touch and pen have no resting hover; the card stays a mouse affordance.\n        if (event.pointerType !== \"mouse\") return;\n        clear();\n        if ((open() && current() === entry) || dismissed === entry) return;\n        schedule(entry, open() ? SWAP_DELAY : (options.openDelay ?? 250));\n      };\n      // The open delay counts from the moment the mouse rests. An open card\n      // swaps on entering another anchor and ignores movement inside it.\n      const pointerMove = (event: PointerEvent) => {\n        if (event.pointerType === \"mouse\" && !open() && dismissed !== entry) schedule(entry, options.openDelay ?? 250);\n      };\n      // A press acts on the row, such as opening it or its menu; a card about to open stays closed.\n      const pointerDown = () => clear();\n      const focusIn = () => {\n        if (open()) {\n          if (current() === entry) clear();\n          else schedule(entry, SWAP_DELAY, true);\n          return;\n        }\n        clear();\n        if (options.keyboard === \"focus\" && dismissed !== entry) schedule(entry, options.openDelay ?? 250);\n      };\n      const keyDown = (event: KeyboardEvent) => {\n        if (options.keyboard === \"focus\" || event.key !== \" \" || event.defaultPrevented) return;\n        // Shift+Space keeps scrolling up; other modifiers belong to shortcuts.\n        if (event.shiftKey || event.ctrlKey || event.altKey || event.metaKey) return;\n        if (event.target instanceof Element && event.target.matches(OWNS_SPACE)) return;\n        event.preventDefault();\n        // A held key toggles once; its repeats only keep the page from scrolling.\n        if (event.repeat) return;\n        if (open() && current() === entry) {\n          dismiss();\n          return;\n        }\n        dismissed = undefined;\n        show(entry, true);\n      };\n      element.addEventListener(\"pointerenter\", pointerEnter);\n      element.addEventListener(\"pointermove\", pointerMove);\n      element.addEventListener(\"pointerdown\", pointerDown);\n      element.addEventListener(\"pointerleave\", leave);\n      element.addEventListener(\"focusin\", focusIn);\n      element.addEventListener(\"focusout\", focusOut);\n      element.addEventListener(\"keydown\", keyDown);\n      onCleanup(() => {\n        anchors.delete(entry);\n        if (current() === entry) hide();\n        element.removeEventListener(\"pointerenter\", pointerEnter);\n        element.removeEventListener(\"pointermove\", pointerMove);\n        element.removeEventListener(\"pointerdown\", pointerDown);\n        element.removeEventListener(\"pointerleave\", leave);\n        element.removeEventListener(\"focusin\", focusIn);\n        element.removeEventListener(\"focusout\", focusOut);\n        element.removeEventListener(\"keydown\", keyDown);\n      });\n    };\n\n  return {\n    id,\n    anchor,\n    active: () => (open() ? current()?.value : undefined),\n    toggle: (value) => {\n      const entry = [...anchors].find((candidate) => candidate.value === value);\n      if (!entry || !surface) return;\n      clear();\n      if (open() && pinned === entry && current() === entry) {\n        dismiss();\n        return;\n      }\n      // A hover may have opened the card before this click or key press pinned it.\n      ring = ringOnReturn(focusTarget(entry));\n      dismissed = undefined;\n      if (show(entry, true)) surface.focus();\n    },\n    close: dismiss,\n    [INTERNALS]: {\n      current,\n      bind: (element) => {\n        surface = element;\n        observer = new ResizeObserver(() => {\n          if (open()) position();\n        });\n        observer.observe(element);\n      },\n      enterSurface: clear,\n      leave,\n      focusOut,\n      toggled: (visible) => {\n        // Light dismissal by the browser: an outside click or another popover.\n        // The event of a close this controller made itself arrives later, when\n        // the pointer may already wait on the next anchor; that delay stays.\n        if (!visible && open()) {\n          clear();\n          pinned = undefined;\n          setOpen(false);\n          listen(false);\n        }\n        options.onOpenChange?.(visible);\n      },\n    },\n  };\n}\n\nexport type HoverPreviewProps<T> = {\n  preview: HoverPreviewController<T>;\n  /** Accessible name of the card. */\n  label: string;\n  /** `\"content\"` (default) sizes the card to its content up to 32rem; `\"fixed\"` keeps one 22rem × 20rem box for every anchor. */\n  size?: \"content\" | \"fixed\";\n  class?: string;\n  /** Plain content stays mounted while the card is closed; a function renders the open anchor's value. */\n  children: JSX.Element | ((value: T) => JSX.Element);\n};\n\n/**\n * A non-modal card that opens beside the anchor a resting mouse points at.\n * Native popover owns the top layer and light dismissal.\n */\nexport function HoverPreview<T>(props: HoverPreviewProps<T>): JSX.Element {\n  const state = props.preview[INTERNALS];\n  let surface!: HTMLDivElement;\n  onMount(() => state.bind(surface));\n  const content = () => {\n    const children = props.children;\n    if (typeof children !== \"function\") return children;\n    return (\n      <Show when={state.current()} keyed>\n        {(anchor) => children(anchor.value)}\n      </Show>\n    );\n  };\n  return (\n    <div\n      ref={surface}\n      id={props.preview.id}\n      popover=\"auto\"\n      role=\"dialog\"\n      aria-label={props.label}\n      tabIndex={-1}\n      class={props.class ? `k2b-hover-preview ${props.class}` : \"k2b-hover-preview\"}\n      data-size={props.size ?? \"content\"}\n      onPointerEnter={() => state.enterSurface()}\n      onPointerLeave={() => state.leave()}\n      on:focusout={(event) => state.focusOut(event)}\n      onToggle={(event) => state.toggled(event.newState === \"open\")}\n    >\n      {content()}\n    </div>\n  );\n}\n"],"mappings":"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","ignoreList":[]}

package/dist/browser/layout/AppWorkspace.js

@@ -21,7 +21,7 @@ var _tmpl$ = /*#__PURE__*/_$template(`<button type=button class=k2b-app-workspac
   _tmpl$3 = /*#__PURE__*/_$template(`<div class=k2b-app-workspace__main-primary data-workspace-main-region=main>`),
   _tmpl$4 = /*#__PURE__*/_$template(`<section>`),
   _tmpl$5 = /*#__PURE__*/_$template(`<aside>`),
-  _tmpl$6 = /*#__PURE__*/_$template(`<aside><div class=k2b-app-workspace__sidebar-desktop>`),
+  _tmpl$6 = /*#__PURE__*/_$template(`<div class=k2b-app-workspace__sidebar-desktop>`),
   _tmpl$7 = /*#__PURE__*/_$template(`<script>`),
   _tmpl$8 = /*#__PURE__*/_$template(`<footer>`),
   _tmpl$9 = /*#__PURE__*/_$template(`<span aria-hidden=true><i>`),
@@ -57,7 +57,7 @@ var _tmpl$ = /*#__PURE__*/_$template(`<button type=button class=k2b-app-workspac
 import { Link } from "@k2b/ssr/nav";
 import { children, createContext, createMemo, createSignal, createUniqueId, For, mergeProps, onCleanup, onMount, Show, useContext } from "solid-js";
 import { useUiMessages } from "../intl/messages";
-import { installAppWorkspaceController } from "./app-workspace-controller";
+import { APP_WORKSPACE_SIDEBAR_HIDE_EVENT, installAppWorkspaceController } from "./app-workspace-controller";
 import { APP_WORKSPACE_DETAIL_DEFAULT, APP_WORKSPACE_DETAIL_MAX, APP_WORKSPACE_DETAIL_MIN, APP_WORKSPACE_DRAWER_DEFAULT, APP_WORKSPACE_DRAWER_MAX, APP_WORKSPACE_DRAWER_MIN, APP_WORKSPACE_PANE_DEFAULT, APP_WORKSPACE_PANE_MAX, APP_WORKSPACE_PANE_MIN, APP_WORKSPACE_SIDEBAR_COLLAPSED, APP_WORKSPACE_SIDEBAR_DEFAULT, APP_WORKSPACE_SIDEBAR_MAX, APP_WORKSPACE_SIDEBAR_MIN, appWorkspaceLayoutStyle, appWorkspacePanelVariable } from "./app-workspace-state";
 import { SidebarItemPreview } from "./SidebarItemPreview";
 import { createScrollFade } from "./scroll-fade";
@@ -512,44 +512,72 @@ function AppWorkspaceSidebar(props) {
   const minSize = () => props.minSize ?? (props.collapsible ? APP_WORKSPACE_SIDEBAR_COLLAPSED : APP_WORKSPACE_SIDEBAR_MIN);
   const maxSize = () => props.maxSize ?? APP_WORKSPACE_SIDEBAR_MAX;
   const generatedId = createUniqueId();
-  const domId = `k2b-workspace-sidebar-${generatedId}`;
-  const resolved = children(() => props.children);
+  const domId = () => props.id ?? `k2b-workspace-sidebar-${generatedId}`;
+  // Hidden navigation is not rendered at all, so its labels are neither shown
+  // nor reachable; reading the children lazily keeps them from being created.
+  const resolved = children(() => props.hidden ? undefined : props.children);
   const slots = createMemo(() => flatten(resolved()).filter(sidebarChildSlot));
   const desktop = createMemo(() => slots().find(slot => slot.kind === SIDEBAR_DESKTOP));
+  let aside;
+  onMount(() => {
+    const requestHide = () => props.onHiddenChange?.(true);
+    aside?.addEventListener(APP_WORKSPACE_SIDEBAR_HIDE_EVENT, requestHide);
+    onCleanup(() => aside?.removeEventListener(APP_WORKSPACE_SIDEBAR_HIDE_EVENT, requestHide));
+  });
   return [(() => {
-    var _el$7 = _$getNextElement(_tmpl$6),
-      _el$8 = _el$7.firstChild;
-    _$setAttribute(_el$7, "id", domId);
-    _$insert(_el$8, () => desktop()?.children);
+    var _el$7 = _$getNextElement(_tmpl$5);
+    var _ref$ = aside;
+    typeof _ref$ === "function" ? _$use(_ref$, _el$7) : aside = _el$7;
+    _$insert(_el$7, _$createComponent(Show, {
+      get when() {
+        return !props.hidden;
+      },
+      get children() {
+        var _el$8 = _$getNextElement(_tmpl$6);
+        _$insert(_el$8, () => desktop()?.children);
+        return _el$8;
+      }
+    }));
     _$effect(_p$ => {
-      var _v$39 = `k2b-app-workspace__sidebar ${props.class ?? ""}`,
-        _v$40 = props.label,
-        _v$41 = props.mobile === "stacked" ? "stacked" : undefined,
-        _v$42 = resizable() ? "true" : "false",
-        _v$43 = props.collapsible ? "true" : "false";
-      _v$39 !== _p$.e && _$className(_el$7, _p$.e = _v$39);
-      _v$40 !== _p$.t && _$setAttribute(_el$7, "aria-label", _p$.t = _v$40);
-      _v$41 !== _p$.a && _$setAttribute(_el$7, "data-mobile", _p$.a = _v$41);
-      _v$42 !== _p$.o && _$setAttribute(_el$7, "data-workspace-resizable", _p$.o = _v$42);
-      _v$43 !== _p$.i && _$setAttribute(_el$7, "data-workspace-collapsible", _p$.i = _v$43);
+      var _v$39 = domId(),
+        _v$40 = `k2b-app-workspace__sidebar ${props.class ?? ""}`,
+        _v$41 = props.label,
+        _v$42 = props.hidden || undefined,
+        _v$43 = props.mobile === "stacked" ? "stacked" : undefined,
+        _v$44 = resizable() ? "true" : "false",
+        _v$45 = props.collapsible ? "true" : "false",
+        _v$46 = props.onHiddenChange ? "true" : undefined;
+      _v$39 !== _p$.e && _$setAttribute(_el$7, "id", _p$.e = _v$39);
+      _v$40 !== _p$.t && _$className(_el$7, _p$.t = _v$40);
+      _v$41 !== _p$.a && _$setAttribute(_el$7, "aria-label", _p$.a = _v$41);
+      _v$42 !== _p$.o && _$setProperty(_el$7, "hidden", _p$.o = _v$42);
+      _v$43 !== _p$.i && _$setAttribute(_el$7, "data-mobile", _p$.i = _v$43);
+      _v$44 !== _p$.n && _$setAttribute(_el$7, "data-workspace-resizable", _p$.n = _v$44);
+      _v$45 !== _p$.s && _$setAttribute(_el$7, "data-workspace-collapsible", _p$.s = _v$45);
+      _v$46 !== _p$.h && _$setAttribute(_el$7, "data-workspace-hideable", _p$.h = _v$46);
       return _p$;
     }, {
       e: undefined,
       t: undefined,
       a: undefined,
       o: undefined,
-      i: undefined
+      i: undefined,
+      n: undefined,
+      s: undefined,
+      h: undefined
     });
     return _el$7;
   })(), _$createComponent(Show, {
     get when() {
-      return resizable();
+      return _$memo(() => !!resizable())() && !props.hidden;
     },
     get children() {
       return _$createComponent(ResizeHandle, {
         kind: "sidebar",
         edge: "end",
-        controls: domId,
+        get controls() {
+          return domId();
+        },
         get defaultSize() {
           return defaultSize();
         },
@@ -586,8 +614,8 @@ const AppWorkspaceSidebarBody = props => {
   createScrollFade(() => body, () => props.scrollFade !== false);
   return [(() => {
     var _el$9 = _$getNextElement(_tmpl$2);
-    var _ref$ = body;
-    typeof _ref$ === "function" ? _$use(_ref$, _el$9) : body = _el$9;
+    var _ref$2 = body;
+    typeof _ref$2 === "function" ? _$use(_ref$2, _el$9) : body = _el$9;
     _$spread(_el$9, _$mergeProps({
       get ["class"]() {
         return `k2b-app-workspace__sidebar-body ${props.class ?? ""}`;
@@ -692,10 +720,10 @@ const AppWorkspaceSidebarSection = props => {
             _$setAttribute(_el$15, "aria-controls", id);
             _$insert(_el$15, title, _el$18, _co$);
             _$effect(_p$ => {
-              var _v$44 = open(),
-                _v$45 = open() ? "ti ti-chevron-down" : "ti ti-chevron-right";
-              _v$44 !== _p$.e && _$setAttribute(_el$15, "aria-expanded", _p$.e = _v$44);
-              _v$45 !== _p$.t && _$className(_el$16, _p$.t = _v$45);
+              var _v$47 = open(),
+                _v$48 = open() ? "ti ti-chevron-down" : "ti ti-chevron-right";
+              _v$47 !== _p$.e && _$setAttribute(_el$15, "aria-expanded", _p$.e = _v$47);
+              _v$48 !== _p$.t && _$className(_el$16, _p$.t = _v$48);
               return _p$;
             }, {
               e: undefined,
@@ -994,12 +1022,12 @@ function AppWorkspaceSidebarItem(props) {
               _el$54.$$click = select;
               _$insert(_el$54, content);
               _$effect(_p$ => {
-                var _v$49 = actionSlot()?.disabled,
-                  _v$50 = actionSlot()?.visibility === "hover" ? "hover" : undefined,
-                  _v$51 = label();
-                _v$49 !== _p$.e && _$setProperty(_el$54, "disabled", _p$.e = _v$49);
-                _v$50 !== _p$.t && _$setAttribute(_el$54, "data-visibility", _p$.t = _v$50);
-                _v$51 !== _p$.a && _$setAttribute(_el$54, "aria-label", _p$.a = _v$51);
+                var _v$52 = actionSlot()?.disabled,
+                  _v$53 = actionSlot()?.visibility === "hover" ? "hover" : undefined,
+                  _v$54 = label();
+                _v$52 !== _p$.e && _$setProperty(_el$54, "disabled", _p$.e = _v$52);
+                _v$53 !== _p$.t && _$setAttribute(_el$54, "data-visibility", _p$.t = _v$53);
+                _v$54 !== _p$.a && _$setAttribute(_el$54, "aria-label", _p$.a = _v$54);
                 return _p$;
               }, {
                 e: undefined,
@@ -1015,12 +1043,12 @@ function AppWorkspaceSidebarItem(props) {
             _el$53.$$click = select;
             _$insert(_el$53, content);
             _$effect(_p$ => {
-              var _v$46 = actionSlot()?.href,
-                _v$47 = actionSlot()?.visibility === "hover" ? "hover" : undefined,
-                _v$48 = label();
-              _v$46 !== _p$.e && _$setAttribute(_el$53, "href", _p$.e = _v$46);
-              _v$47 !== _p$.t && _$setAttribute(_el$53, "data-visibility", _p$.t = _v$47);
-              _v$48 !== _p$.a && _$setAttribute(_el$53, "aria-label", _p$.a = _v$48);
+              var _v$49 = actionSlot()?.href,
+                _v$50 = actionSlot()?.visibility === "hover" ? "hover" : undefined,
+                _v$51 = label();
+              _v$49 !== _p$.e && _$setAttribute(_el$53, "href", _p$.e = _v$49);
+              _v$50 !== _p$.t && _$setAttribute(_el$53, "data-visibility", _p$.t = _v$50);
+              _v$51 !== _p$.a && _$setAttribute(_el$53, "aria-label", _p$.a = _v$51);
               return _p$;
             }, {
               e: undefined,
@@ -1267,10 +1295,10 @@ const AppWorkspaceNavTree = props => {
           var _el$55 = _$getNextElement(_tmpl$27),
             _el$56 = _el$55.firstChild;
           _$effect(_p$ => {
-            var _v$52 = usesIconDisclosure() ? "" : undefined,
-              _v$53 = iconClass(rowIcon());
-            _v$52 !== _p$.e && _$setAttribute(_el$55, "data-k2b-nav-tree-toggle", _p$.e = _v$52);
-            _v$53 !== _p$.t && _$className(_el$56, _p$.t = _v$53);
+            var _v$55 = usesIconDisclosure() ? "" : undefined,
+              _v$56 = iconClass(rowIcon());
+            _v$55 !== _p$.e && _$setAttribute(_el$55, "data-k2b-nav-tree-toggle", _p$.e = _v$55);
+            _v$56 !== _p$.t && _$className(_el$56, _p$.t = _v$56);
             return _p$;
           }, {
             e: undefined,
@@ -1291,10 +1319,10 @@ const AppWorkspaceNavTree = props => {
           var _el$59 = _$getNextElement(_tmpl$29);
           _$insert(_el$59, () => item.meta);
           _$effect(_p$ => {
-            var _v$54 = `k2b-app-workspace__sidebar-item-meta ${hasChildren() ? "" : "k2b-app-workspace__nav-tree-leaf-meta"}`,
-              _v$55 = item.metaVisibility === "hover" ? "hover" : undefined;
-            _v$54 !== _p$.e && _$className(_el$59, _p$.e = _v$54);
-            _v$55 !== _p$.t && _$setAttribute(_el$59, "data-visibility", _p$.t = _v$55);
+            var _v$57 = `k2b-app-workspace__sidebar-item-meta ${hasChildren() ? "" : "k2b-app-workspace__nav-tree-leaf-meta"}`,
+              _v$58 = item.metaVisibility === "hover" ? "hover" : undefined;
+            _v$57 !== _p$.e && _$className(_el$59, _p$.e = _v$57);
+            _v$58 !== _p$.t && _$setAttribute(_el$59, "data-visibility", _p$.t = _v$58);
             return _p$;
           }, {
             e: undefined,
@@ -1377,8 +1405,8 @@ const AppWorkspaceNavTree = props => {
         _$addEventListener(_el$62, "dragenter", item.onDragEnter);
         _el$62.$$keydown = onKeyDown;
         _el$62.addEventListener("focus", () => setFocusedId(item.id));
-        var _ref$2 = treeItem;
-        typeof _ref$2 === "function" ? _$use(_ref$2, _el$62) : treeItem = _el$62;
+        var _ref$3 = treeItem;
+        typeof _ref$3 === "function" ? _$use(_ref$3, _el$62) : treeItem = _el$62;
         _$setAttribute(_el$62, "aria-level", depth + 1);
         _$setAttribute(_el$62, "data-k2b-nav-tree-parent-id", parentId);
         _$insert(_el$62, row, _el$65, _co$0);
@@ -1393,16 +1421,16 @@ const AppWorkspaceNavTree = props => {
           }
         }), _el$67, _co$1);
         _$effect(_p$ => {
-          var _v$56 = selected(),
-            _v$57 = hasChildren() ? isExpanded(item.id) : undefined,
-            _v$58 = item.disabled ? "true" : undefined,
-            _v$59 = item.disabled ? -1 : tabStopId() === item.id ? 0 : -1,
-            _v$60 = item.id;
-          _v$56 !== _p$.e && _$setAttribute(_el$62, "aria-selected", _p$.e = _v$56);
-          _v$57 !== _p$.t && _$setAttribute(_el$62, "aria-expanded", _p$.t = _v$57);
-          _v$58 !== _p$.a && _$setAttribute(_el$62, "aria-disabled", _p$.a = _v$58);
-          _v$59 !== _p$.o && _$setAttribute(_el$62, "tabindex", _p$.o = _v$59);
-          _v$60 !== _p$.i && _$setAttribute(_el$62, "data-k2b-nav-tree-id", _p$.i = _v$60);
+          var _v$59 = selected(),
+            _v$60 = hasChildren() ? isExpanded(item.id) : undefined,
+            _v$61 = item.disabled ? "true" : undefined,
+            _v$62 = item.disabled ? -1 : tabStopId() === item.id ? 0 : -1,
+            _v$63 = item.id;
+          _v$59 !== _p$.e && _$setAttribute(_el$62, "aria-selected", _p$.e = _v$59);
+          _v$60 !== _p$.t && _$setAttribute(_el$62, "aria-expanded", _p$.t = _v$60);
+          _v$61 !== _p$.a && _$setAttribute(_el$62, "aria-disabled", _p$.a = _v$61);
+          _v$62 !== _p$.o && _$setAttribute(_el$62, "tabindex", _p$.o = _v$62);
+          _v$63 !== _p$.i && _$setAttribute(_el$62, "data-k2b-nav-tree-id", _p$.i = _v$63);
           return _p$;
         }, {
           e: undefined,
@@ -1418,14 +1446,14 @@ const AppWorkspaceNavTree = props => {
   });
   return (() => {
     var _el$68 = _$getNextElement(_tmpl$33);
-    var _ref$3 = root;
-    typeof _ref$3 === "function" ? _$use(_ref$3, _el$68) : root = _el$68;
+    var _ref$4 = root;
+    typeof _ref$4 === "function" ? _$use(_ref$4, _el$68) : root = _el$68;
     _$insert(_el$68, () => renderItems(roots, 0));
     _$effect(_p$ => {
-      var _v$61 = `k2b-app-workspace__nav-tree ${props.class ?? ""}`,
-        _v$62 = props.ariaLabel;
-      _v$61 !== _p$.e && _$className(_el$68, _p$.e = _v$61);
-      _v$62 !== _p$.t && _$setAttribute(_el$68, "aria-label", _p$.t = _v$62);
+      var _v$64 = `k2b-app-workspace__nav-tree ${props.class ?? ""}`,
+        _v$65 = props.ariaLabel;
+      _v$64 !== _p$.e && _$className(_el$68, _p$.e = _v$64);
+      _v$65 !== _p$.t && _$setAttribute(_el$68, "aria-label", _p$.t = _v$65);
       return _p$;
     }, {
       e: undefined,
@@ -1549,20 +1577,20 @@ const AppWorkspace = props => {
     },
     get children() {
       var _el$77 = _$getNextElement(_tmpl$36);
-      var _ref$4 = root;
-      typeof _ref$4 === "function" ? _$use(_ref$4, _el$77) : root = _el$77;
+      var _ref$5 = root;
+      typeof _ref$5 === "function" ? _$use(_ref$5, _el$77) : root = _el$77;
       _$insert(_el$77, () => props.children);
       _$effect(_p$ => {
-        var _v$63 = `k2b-app-workspace ${props.class ?? ""}`,
-          _v$64 = props.mobileSurface,
-          _v$65 = initialLayoutState()?.sidebarCollapsed === undefined ? undefined : String(initialLayoutState()?.sidebarCollapsed),
-          _v$66 = props.resizable === false ? "false" : "true",
-          _v$67 = appWorkspaceLayoutStyle(initialLayoutState());
-        _v$63 !== _p$.e && _$className(_el$77, _p$.e = _v$63);
-        _v$64 !== _p$.t && _$setAttribute(_el$77, "data-mobile-surface", _p$.t = _v$64);
-        _v$65 !== _p$.a && _$setAttribute(_el$77, "data-sidebar-collapsed", _p$.a = _v$65);
-        _v$66 !== _p$.o && _$setAttribute(_el$77, "data-workspace-resizable", _p$.o = _v$66);
-        _p$.i = _$style(_el$77, _v$67, _p$.i);
+        var _v$66 = `k2b-app-workspace ${props.class ?? ""}`,
+          _v$67 = props.mobileSurface,
+          _v$68 = initialLayoutState()?.sidebarCollapsed === undefined ? undefined : String(initialLayoutState()?.sidebarCollapsed),
+          _v$69 = props.resizable === false ? "false" : "true",
+          _v$70 = appWorkspaceLayoutStyle(initialLayoutState());
+        _v$66 !== _p$.e && _$className(_el$77, _p$.e = _v$66);
+        _v$67 !== _p$.t && _$setAttribute(_el$77, "data-mobile-surface", _p$.t = _v$67);
+        _v$68 !== _p$.a && _$setAttribute(_el$77, "data-sidebar-collapsed", _p$.a = _v$68);
+        _v$69 !== _p$.o && _$setAttribute(_el$77, "data-workspace-resizable", _p$.o = _v$69);
+        _p$.i = _$style(_el$77, _v$70, _p$.i);
         return _p$;
       }, {
         e: undefined,