@kerfjs/ui 5.0.0-beta.54 → 5.0.0-beta.55

package/dist/wire-workbench.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/workbench-overlays.ts","../src/wire-workbench.ts"],"names":["active","effect","selector"],"mappings":"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","file":"wire-workbench.js","sourcesContent":["// The transient-overlay behavior `wireWorkbench` gives Workbench panels that\n// present as overlays: a responsive overlay starts collapsed when its\n// breakpoint begins to apply, an open overlay takes focus and keeps Tab inside\n// it, and it closes on Escape or a press outside it. It mirrors `wireSidebar`'s\n// compact overlay (the ARIA dialog pattern). Internal.\n\nimport { effect, type Signal } from 'kerfjs';\n\nimport type { WorkbenchPanelKey } from './workbench-resize.js';\n\n/** A Workbench panel whose app-owned `collapsed` signal the wiring may write. */\nexport interface WorkbenchOverlayPanel {\n  key: WorkbenchPanelKey;\n  collapsed: Signal<boolean>;\n}\n\n/** Each panel's own element, never a nested Workbench's. */\nconst PANEL_SELECTORS: Record<WorkbenchPanelKey, string> = {\n  leftRail: ':scope > [data-workbench-rail=\"left\"]',\n  rightRail: ':scope > [data-workbench-rail=\"right\"]',\n  bottomDrawer: ':scope > .kui-workbench__center > [data-workbench-drawer]',\n};\n\nconst RESTORE_PANELS: Record<WorkbenchPanelKey, string> = {\n  leftRail: 'left',\n  rightRail: 'right',\n  bottomDrawer: 'bottom',\n};\n\nconst FOCUSABLE =\n  'a[href],area[href],button:not([disabled]),input:not([disabled]),select:not([disabled]),textarea:not([disabled]),[tabindex]:not([tabindex=\"-1\"])';\n\n/**\n * The panel's focusable controls, in tab order. Only an open panel is ever\n * asked. The selector drops disabled controls and `tabindex=\"-1\"`; a\n * rendered control the CSS hides (the separator of a panel whose responsive\n * overlay breakpoint applies is `display: none`) is dropped too, or Tab would\n * wrap from a control focus can never reach. Where `checkVisibility` is\n * missing, every matched control counts.\n */\nconst focusables = (element: HTMLElement): HTMLElement[] =>\n  [...element.querySelectorAll<HTMLElement>(FOCUSABLE)].filter(\n    (control) =>\n      typeof control.checkVisibility !== 'function' ||\n      control.checkVisibility(),\n  );\n\n/**\n * Wire transient overlay behavior for the given panels of the Workbench that\n * `findWorkbench` returns (looked up on use, so the Workbench may render after\n * wire-up). The app still owns each `collapsed` signal; this wiring only\n * writes it:\n *\n * - When a panel's `responsiveOverlayAt` breakpoint begins to apply (at\n *   wire-up, on first render, or on a crossing), its inline collapsed state is\n *   remembered and the panel collapses, so no overlay covers the work area\n *   until the user opens it. When the breakpoint stops applying (or on\n *   disposal) the remembered state comes back. These presentation changes\n *   skip the collapse motion.\n * - A panel that opens while it presents as an overlay takes focus: its\n *   first focusable control (else the panel itself) is focused, without\n *   scrolling its sliding content. While an overlay is open, Tab and\n *   Shift+Tab cycle through the controls of the overlay that holds focus\n *   (else the most recently opened one) and never reach the work area it\n *   covers — the ARIA dialog pattern `wireSidebar`'s compact overlay follows.\n *   Inline panels are left alone.\n * - Escape closes the open overlay panel that holds focus, else the most\n *   recently opened one; a press that starts and ends outside an open overlay\n *   panel closes it. Static `presentation: \"overlay\"` panels are included.\n * - Focus stranded in a panel that closes — however it closed, including\n *   through the app's own control inside it — returns to the control that\n *   had it when the panel opened, else to the panel's restore control, else\n *   to a control outside it whose `aria-controls` names the panel (or an\n *   element inside it). The last covers a panel that was already open at\n *   wire-up, which has no recorded opener. Focus a press inside the panel\n *   dropped to the body counts as stranded too: Safari and macOS WebKit\n *   never focus a clicked button, so pressing the panel's own close control\n *   blurs the focused control before the click closes the panel. Focus the\n *   user has since moved to any element is left where it is.\n * - With `exclusive`, a panel that opens while it presents as an overlay\n *   closes every other open overlay panel, so overlays never cover each\n *   other's controls. Inline panels are never closed by it.\n *\n * Returns a disposer.\n */\nexport function wireWorkbenchOverlays(\n  root: HTMLElement,\n  findWorkbench: () => HTMLElement | null,\n  panels: readonly WorkbenchOverlayPanel[],\n  exclusive = false,\n): () => void {\n  const ownerDocument = root.ownerDocument;\n  const disposers: Array<() => void> = [];\n  // Open panels, most recently opened last, and each one's opener: the\n  // control that had focus when it opened.\n  const openOrder: WorkbenchOverlayPanel[] = [];\n  const openers = new Map<WorkbenchOverlayPanel, HTMLElement>();\n  // The open panel the latest press started in while focus was inside it,\n  // until focus next lands anywhere. Safari and macOS WebKit never focus a\n  // clicked button, so pressing a panel's own close control blurs the focused\n  // control to the body before the click closes the panel; this is how the\n  // close still counts as leaving focus stranded in it.\n  let pressedFocus: WorkbenchOverlayPanel | undefined;\n\n  const panelElement = (panel: WorkbenchOverlayPanel): HTMLElement | null =>\n    findWorkbench()?.querySelector<HTMLElement>(PANEL_SELECTORS[panel.key]) ??\n    null;\n  /** Whether the panel's responsive overlay breakpoint currently applies. */\n  const responsive = (element: HTMLElement): boolean =>\n    element.dataset.presentation === 'inline' &&\n    element.hasAttribute('data-responsive-overlay-at') &&\n    globalThis.getComputedStyle(element).position === 'absolute';\n  const overlaid = (element: HTMLElement): boolean =>\n    element.dataset.presentation === 'overlay' || responsive(element);\n\n  /** Where focus goes when a panel it was in closes. */\n  const restoreTarget = (\n    panel: WorkbenchOverlayPanel,\n    element: HTMLElement | null,\n  ): HTMLElement | undefined => {\n    const opener = openers.get(panel);\n    // An opener inside another panel that has closed since (an exclusive\n    // overlay closes the one it was opened from) would strand focus there too.\n    if (\n      opener?.isConnected &&\n      !element?.contains(opener) &&\n      !panels.some(\n        (other) =>\n          other.collapsed.peek() && panelElement(other)?.contains(opener),\n      )\n    )\n      return opener;\n    const side = RESTORE_PANELS[panel.key];\n    const restore = findWorkbench()\n      ?.querySelector<HTMLElement>(\n        `.kui-workbench__restore[data-panel=\"${side}\"]`,\n      )\n      ?.querySelector<HTMLElement>(FOCUSABLE);\n    return restore ?? (element ? controller(element) : undefined);\n  };\n  /**\n   * A control outside the panel that names it, or an element inside it, in\n   * its `aria-controls`: the app's toggle for a panel with no opener.\n   */\n  const controller = (element: HTMLElement): HTMLElement | undefined => {\n    const ids = new Set(\n      [element, ...element.querySelectorAll('[id]')].map((node) => node.id),\n    );\n    ids.delete('');\n    return [\n      ...ownerDocument.querySelectorAll<HTMLElement>('[aria-controls]'),\n    ].find(\n      (control) =>\n        !element.contains(control) &&\n        control.matches(FOCUSABLE) &&\n        control\n          .getAttribute('aria-controls')!\n          .split(/\\s+/)\n          .some((id) => ids.has(id)),\n    );\n  };\n  const rescueFocus = (panel: WorkbenchOverlayPanel): void => {\n    const element = panelElement(panel);\n    const target = restoreTarget(panel, element);\n    if (target) {\n      target.focus();\n      return;\n    }\n    // An app that renders its restore control after this write has not\n    // produced it yet; look again once the current batch settles.\n    globalThis.queueMicrotask(() => {\n      if (!panel.collapsed.peek()) return;\n      const later = restoreTarget(panel, panelElement(panel));\n      const active = ownerDocument.activeElement;\n      if (later) later.focus();\n      else if (active instanceof HTMLElement && element?.contains(active))\n        active.blur();\n    });\n  };\n\n  /**\n   * A presentation-driven write: no collapse motion, because nothing the user\n   * did moved the panel. The app's render has normally applied the new state\n   * by the time the write returns, so the content's transition is suspended\n   * across one style flush.\n   */\n  const adapt = (\n    panel: WorkbenchOverlayPanel,\n    element: HTMLElement,\n    collapsed: boolean,\n  ): void => {\n    if (panel.collapsed.peek() === collapsed) return;\n    const stranded = collapsed && element.contains(ownerDocument.activeElement);\n    panel.collapsed.value = collapsed;\n    // Every Workbench panel renders its content wrapper, and never with a\n    // style of its own, so the attribute goes again once the flush is done.\n    const content = element.querySelector<HTMLElement>(\n      ':scope > .kui-workbench__panel-content',\n    )!;\n    content.style.transition = 'none';\n    void globalThis.getComputedStyle(content).transform;\n    content.removeAttribute('style');\n    // The collapse effect has normally returned the focus already; on\n    // disposal, after the effects are gone, this is what returns it.\n    if (stranded && element.contains(ownerDocument.activeElement))\n      rescueFocus(panel);\n  };\n\n  // The inline collapsed state of each panel whose responsive overlay\n  // currently applies, restored when it stops applying.\n  const inlineState = new Map<WorkbenchOverlayPanel, boolean>();\n  const sync = (): void => {\n    for (const panel of panels) {\n      const element = panelElement(panel);\n      if (!element) continue;\n      const active = responsive(element);\n      if (active && !inlineState.has(panel)) {\n        inlineState.set(panel, panel.collapsed.peek());\n        adapt(panel, element, true);\n      } else if (!active && inlineState.has(panel)) {\n        const remembered = inlineState.get(panel)!;\n        inlineState.delete(panel);\n        adapt(panel, element, remembered);\n      }\n    }\n  };\n\n  // The Workbench is its own breakpoint container, so its size is what moves a\n  // panel across the breakpoint. It may render after wire-up or be replaced,\n  // and the app may change a presentation, so both are observed too.\n  let observed: HTMLElement | null = null;\n  const resizeObserver =\n    typeof globalThis.ResizeObserver === 'function'\n      ? new globalThis.ResizeObserver(() => sync())\n      : undefined;\n  /** Observe the current Workbench; whether it changed. */\n  const track = (): boolean => {\n    const workbench = findWorkbench();\n    if (workbench === observed) return false;\n    if (observed) resizeObserver?.unobserve(observed);\n    observed = workbench;\n    if (workbench) resizeObserver?.observe(workbench);\n    return true;\n  };\n  const mutationObserver = new MutationObserver((records) => {\n    if (track() || records.some((record) => record.type === 'attributes'))\n      sync();\n  });\n  mutationObserver.observe(root, {\n    attributes: true,\n    attributeFilter: ['data-presentation', 'data-responsive-overlay-at'],\n    childList: true,\n    subtree: true,\n  });\n  disposers.push(() => {\n    mutationObserver.disconnect();\n    resizeObserver?.disconnect();\n  });\n  track();\n  sync();\n\n  for (const panel of panels) {\n    let previous = panel.collapsed.peek();\n    if (!previous) openOrder.push(panel);\n    disposers.push(\n      effect(() => {\n        const collapsed = panel.collapsed.value;\n        if (collapsed === previous) return;\n        previous = collapsed;\n        const index = openOrder.indexOf(panel);\n        if (index >= 0) openOrder.splice(index, 1);\n        if (collapsed) {\n          // Whatever closed the panel — Escape, an outside press, a\n          // breakpoint, or the app's own control inside it — focus left in\n          // it would be stranded in a hidden panel. So would focus that a\n          // press inside it dropped to the body (see `pressedFocus`).\n          const active = ownerDocument.activeElement;\n          if (\n            panelElement(panel)?.contains(active) ||\n            (pressedFocus === panel &&\n              (active === null || active === ownerDocument.body))\n          )\n            rescueFocus(panel);\n          return;\n        }\n        openOrder.push(panel);\n        const element = panelElement(panel);\n        const active = ownerDocument.activeElement;\n        if (\n          active instanceof HTMLElement &&\n          active !== ownerDocument.body &&\n          !element?.contains(active)\n        )\n          openers.set(panel, active);\n        else openers.delete(panel);\n        if (!element || !overlaid(element)) return;\n        // Opening an overlay closes the others. Their collapse effects run\n        // after this one, by which time focus has moved into this panel, so\n        // none of them hands it back to an opener.\n        if (exclusive)\n          for (const [other] of openOverlays())\n            if (other !== panel) other.collapsed.value = true;\n        // An overlay covers the work area, so focus moves in with it rather\n        // than staying on a control it may cover. Without preventScroll the\n        // browser scrolls the panel's clipped, still-sliding content to reveal\n        // the target, which then unwinds as the slide finishes.\n        (focusables(element)[0] ?? element).focus({ preventScroll: true });\n      }),\n    );\n  }\n\n  /** The open overlay panels with their elements, most recent last. */\n  const openOverlays = (): Array<[WorkbenchOverlayPanel, HTMLElement]> =>\n    openOrder.flatMap((panel): Array<[WorkbenchOverlayPanel, HTMLElement]> => {\n      const element = panelElement(panel);\n      return !panel.collapsed.peek() && element && overlaid(element)\n        ? [[panel, element]]\n        : [];\n    });\n\n  const onKeydown = (event: KeyboardEvent): void => {\n    if (\n      (event.key !== 'Escape' && event.key !== 'Tab') ||\n      event.defaultPrevented\n    )\n      return;\n    const open = openOverlays();\n    if (open.length === 0) return;\n    const active = ownerDocument.activeElement;\n    const [panel, element] =\n      open.find(([, candidate]) => candidate.contains(active)) ??\n      open[open.length - 1]!;\n    if (event.key === 'Escape') {\n      event.preventDefault();\n      // The collapse effect returns focus stranded inside it.\n      panel.collapsed.value = true;\n      return;\n    }\n    // Tab stays inside the open overlay: it wraps at either end, and focus\n    // that is somewhere else (the app moved it, or the panel had no control\n    // to take it when it opened) comes back in.\n    const items = focusables(element);\n    if (items.length === 0) return;\n    const first = items[0]!;\n    const last = items[items.length - 1]!;\n    const inside = element.contains(active);\n    if (event.shiftKey && (!inside || active === first)) {\n      event.preventDefault();\n      last.focus();\n    } else if (!event.shiftKey && (!inside || active === last)) {\n      event.preventDefault();\n      first.focus();\n    }\n  };\n\n  // An outside press closes an open overlay when it both starts and ends\n  // outside it. Deciding at the click lets an app toggle that closes the panel\n  // run first, and a press that opens a panel never closes it.\n  let pressed: WorkbenchOverlayPanel[] = [];\n  const onPointerdown = (event: PointerEvent): void => {\n    const path = event.composedPath();\n    pressed = openOverlays()\n      .filter(([, element]) => !path.includes(element))\n      .map(([panel]) => panel);\n    // Before the press's default action moves focus: the open panel it\n    // started in, when focus was inside that panel too.\n    const active = ownerDocument.activeElement;\n    pressedFocus = panels.find((panel) => {\n      if (panel.collapsed.peek()) return false;\n      const element = panelElement(panel);\n      return !!element && path.includes(element) && element.contains(active);\n    });\n  };\n  // Focus landing anywhere is a deliberate move the rescue must not undo.\n  const onFocusin = (): void => {\n    pressedFocus = undefined;\n  };\n  const onClick = (event: MouseEvent): void => {\n    const candidates = pressed;\n    pressed = [];\n    const path = event.composedPath();\n    for (const [panel, element] of openOverlays())\n      if (candidates.includes(panel) && !path.includes(element))\n        panel.collapsed.value = true;\n  };\n  ownerDocument.addEventListener('keydown', onKeydown);\n  ownerDocument.addEventListener('pointerdown', onPointerdown, true);\n  ownerDocument.addEventListener('click', onClick);\n  ownerDocument.addEventListener('focusin', onFocusin, true);\n  disposers.push(() => {\n    ownerDocument.removeEventListener('keydown', onKeydown);\n    ownerDocument.removeEventListener('pointerdown', onPointerdown, true);\n    ownerDocument.removeEventListener('click', onClick);\n    ownerDocument.removeEventListener('focusin', onFocusin, true);\n  });\n\n  return () => {\n    for (const dispose of disposers.splice(0)) dispose();\n    // After every observer and effect is gone, so handing the inline state\n    // back cannot re-enter the wiring.\n    for (const [panel, remembered] of inlineState) {\n      const element = panelElement(panel);\n      if (element) adapt(panel, element, remembered);\n      else panel.collapsed.value = remembered;\n    }\n    inlineState.clear();\n  };\n}\n","import { effect, type ReadonlySignal, type Signal } from 'kerfjs';\n\nimport type { DeviceClass } from './device-class.js';\nimport { type ResizeLimit, wireResizeHandles } from './resize-wiring.js';\nimport {\n  wireWorkbenchOverlays,\n  type WorkbenchOverlayPanel,\n} from './workbench-overlays.js';\nimport {\n  type WorkbenchPanelKey,\n  workbenchRegionId,\n} from './workbench-resize.js';\n\nexport type { WorkbenchPanelKey };\n\n/** Minimal `localStorage`-shaped store, so the persistence hook is testable. */\nexport interface WorkbenchStorage {\n  getItem(key: string): string | null;\n  setItem(key: string, value: string): void;\n}\n\n/** One Workbench panel's app-owned state. */\nexport interface WireWorkbenchPanel {\n  /**\n   * The app-owned size signal a `resizable` panel renders as its `size`.\n   * `wireWorkbench` writes each committed resize here; collapsing never\n   * touches it, so an expanded panel returns at the size it had. Omit it for\n   * a panel that is not resizable.\n   */\n  size?: Signal<number>;\n  /**\n   * When set with `size`, the size is loaded from and saved to `storage`\n   * under this key, so the panel remembers the user's size.\n   */\n  storageKey?: string;\n  /**\n   * The app-owned signal the panel renders as its `collapsed`. With it (and\n   * `dismissOverlays`, on by default) `wireWorkbench` treats the panel as a\n   * transient overlay while it presents as one: it collapses when its\n   * `responsiveOverlayAt` breakpoint begins to apply and gets its inline state\n   * back when the breakpoint stops applying, an open overlay takes focus and\n   * keeps Tab inside it, and it closes on Escape or a press outside it.\n   */\n  collapsed?: Signal<boolean>;\n}\n\n/** A resize the user made, after `wireWorkbench` wrote it to the size signal. */\nexport interface WorkbenchResize {\n  panel: WorkbenchPanelKey;\n  size: number;\n  source: 'keyboard' | 'pointer';\n}\n\nexport interface WireWorkbenchOptions {\n  /** The `id` the `Workbench` was rendered with. */\n  id: string;\n  /**\n   * The wired panels, keyed like the `Workbench` props. Render a panel given\n   * a `size` with `resizable` and `size={panel.size.value}`, and one given a\n   * `collapsed` signal with `collapsed={panel.collapsed.value}`.\n   */\n  panels: Partial<Record<WorkbenchPanelKey, WireWorkbenchPanel>>;\n  /**\n   * When provided, resizing is suspended while `deviceClass.compact` is true —\n   * the classes where rails become overlay drawers or are replaced.\n   */\n  deviceClass?: ReadonlySignal<DeviceClass>;\n  /** Persistence store (default `globalThis.localStorage`, if present). */\n  storage?: WorkbenchStorage;\n  /** Keyboard step in px (default 16). */\n  step?: number;\n  /** Shift+arrow step in px (default 64). */\n  largeStep?: number;\n  /** Called after each committed resize. */\n  onResize?: (change: WorkbenchResize) => void;\n  /**\n   * Treat the panels given a `collapsed` signal as transient overlays while\n   * they present as overlays (default `true`), like `wireSidebar`'s compact\n   * overlay: a panel whose `responsiveOverlayAt` breakpoint begins to apply\n   * starts collapsed, with no collapse motion, and gets its inline collapsed\n   * state back when the breakpoint stops applying (and on disposal); an open\n   * overlay panel, responsive or `presentation: \"overlay\"`, closes on Escape\n   * or a press that starts and ends outside it. A panel that opens as an\n   * overlay takes focus on its first focusable control, and while it is open\n   * Tab and Shift+Tab cycle through its controls instead of reaching the\n   * work area it covers (the ARIA dialog pattern of `wireSidebar`'s compact\n   * overlay); inline panels never move focus. Focus stranded in a closing\n   * panel — however it closed, the app's own control inside it included —\n   * returns to the control that had it when the panel opened, else to the\n   * panel's restore control, else to a control outside the panel whose\n   * `aria-controls` names it (each panel's `id` is its region id, e.g.\n   * `studio-left-rail`) — the fallback for a panel already open at wire-up.\n   * An opener inside a panel that has closed since is skipped. `false` leaves\n   * every `collapsed` write and all focus handling to the app.\n   */\n  dismissOverlays?: boolean;\n  /**\n   * Keep overlays exclusive (default `true`), like `wireSidebar`'s\n   * `exclusiveCompact`: when a panel opens while it presents as an overlay,\n   * every other open overlay panel — rails and the bottom drawer alike —\n   * closes, so one overlay never covers another's controls. Panels presenting\n   * inline are never closed by it. Applies only with `dismissOverlays`.\n   */\n  exclusiveOverlays?: boolean;\n}\n\nfunction defaultStorage(): WorkbenchStorage | undefined {\n  try {\n    return globalThis.localStorage ?? undefined;\n  } catch {\n    return undefined;\n  }\n}\n\n/** A stored size, or undefined when the stored text is not a usable size. */\nfunction storedSize(text: string | null) {\n  if (text === null) return undefined;\n  const size = Number(text);\n  return Number.isFinite(size) && size > 0 ? Math.round(size) : undefined;\n}\n\n/** A double-quoted CSS attribute-selector value. */\nconst quoted = (value: string) =>\n  `\"${value.replaceAll('\\\\', '\\\\\\\\').replaceAll('\"', '\\\\\"')}\"`;\n\nconst px = (value: string) => Number.parseFloat(value) || 0;\n\n/**\n * The largest size a resizable panel may take while the work area keeps its\n * minimum: for a rail, its minimum width (the Workbench's `mainMinSize`,\n * rendered as `data-main-min-size`) — the Workbench width, less that minimum,\n * the other in-flow rails as shown, and the rail's own safe-area extent and\n * border; for the bottom drawer, its minimum height (`mainMinHeight`, rendered\n * as `data-main-min-height`) — the work-area column's height, less that\n * minimum and the drawer's own safe-area extent and border. A panel the\n * container has already squeezed is held at the size it shows, so it can\n * shrink but not grow. Without layout (no box yet) or a minimum, the panel's\n * own maximum stands.\n */\nconst mainRoomLimit: ResizeLimit = (region, { max }) => {\n  const horizontal = region.dataset.axis === 'horizontal';\n  // A rail's parent is the Workbench; the drawer's is the work-area column.\n  const container = region.parentElement;\n  const workbench = horizontal ? container : container?.parentElement;\n  const mainMin = Number(\n    horizontal\n      ? workbench?.dataset.mainMinSize\n      : workbench?.dataset.mainMinHeight,\n  );\n  if (!container || !(mainMin > 0)) return max;\n  const box = container.getBoundingClientRect();\n  const room = horizontal ? box.width : box.height;\n  if (room <= 0) return max;\n  let others = 0;\n  if (horizontal)\n    for (const rail of container.children) {\n      if (\n        rail === region ||\n        !rail.matches('.kui-workbench__rail') ||\n        globalThis.getComputedStyle(rail).position === 'absolute'\n      )\n        continue;\n      others += rail.getBoundingClientRect().width;\n    }\n  const style = globalThis.getComputedStyle(region);\n  const size = px(region.style.getPropertyValue('--kui-resizable-region-size'));\n  const border =\n    style.boxSizing === 'border-box'\n      ? 0\n      : horizontal\n        ? px(style.borderInlineStartWidth) + px(style.borderInlineEndWidth)\n        : px(style.borderBlockStartWidth) + px(style.borderBlockEndWidth);\n  // The track is the size plus the panel's safe-area extent (its flex basis).\n  const extent = px(style.flexBasis) - size + border;\n  return Math.floor(room - Math.min(mainMin, room) - others - extent);\n};\n\n/**\n * Wire a `Workbench`'s panels. For `resizable` panels given a `size` signal:\n * pointer drags and arrow / Shift+arrow / Home / End on each panel's\n * separator, clamped to the panel's limits and to the room that leaves the\n * work area its minimum width and height, committed to the app-owned size signals.\n * Optional persistence loads and saves each size; optional `deviceClass`\n * suspends resizing on compact classes. Collapse stays the app's `collapsed`\n * flag and never changes a size. For panels given a `collapsed` signal,\n * overlays are transient (`dismissOverlays`): a responsive overlay starts\n * collapsed, an open overlay takes focus and keeps Tab inside it, it closes\n * on Escape or an outside press, and\n * opening one overlay closes the others (`exclusiveOverlays`). Returns a disposer. See `docs/23-app-layouts.md` §3.3.\n */\nexport function wireWorkbench(\n  root: HTMLElement,\n  {\n    id,\n    panels,\n    deviceClass,\n    storage = defaultStorage(),\n    step,\n    largeStep,\n    onResize,\n    dismissOverlays = true,\n    exclusiveOverlays = true,\n  }: WireWorkbenchOptions,\n): () => void {\n  const keys = Object.keys(panels) as WorkbenchPanelKey[];\n  const entries = keys.flatMap((key) => {\n    const size = panels[key]?.size;\n    return size\n      ? [\n          {\n            key,\n            size,\n            storageKey: panels[key]!.storageKey,\n            regionId: workbenchRegionId(id, key),\n          },\n        ]\n      : [];\n  });\n  const byRegion = new Map(entries.map((entry) => [entry.regionId, entry]));\n  const disposers: Array<() => void> = [];\n\n  // Seed from storage before any effect runs, so the first render after\n  // wire-up already has the remembered size; then mirror every size change.\n  for (const { size, storageKey } of entries) {\n    if (!storageKey || !storage) continue;\n    const seed = storedSize(storage.getItem(storageKey));\n    if (seed !== undefined) size.value = seed;\n    disposers.push(\n      effect(() => {\n        storage.setItem(storageKey, String(size.value));\n      }),\n    );\n  }\n\n  // Each panel is matched by its own region id, so this wiring never drives a\n  // ResizableRegion or another Workbench below the same root.\n  const selector = entries\n    .map(\n      ({ regionId }) =>\n        `[data-resizable=\"true\"][data-region-id=${quoted(regionId)}]`,\n    )\n    .join(', ');\n  const start = () =>\n    wireResizeHandles(\n      root,\n      {\n        step,\n        largeStep,\n        onCommit: ({ id: regionId, size, source }) => {\n          // The selector only matches configured panels.\n          const entry = byRegion.get(regionId)!;\n          entry.size.value = size;\n          onResize?.({ panel: entry.key, size, source });\n        },\n      },\n      selector,\n      mainRoomLimit,\n    );\n\n  let stopResize: (() => void) | undefined;\n  if (selector) {\n    if (deviceClass) {\n      disposers.push(\n        effect(() => {\n          const compact = deviceClass.value.compact;\n          stopResize?.();\n          stopResize = compact ? undefined : start();\n        }),\n      );\n    } else {\n      stopResize = start();\n    }\n  }\n\n  const overlayPanels = keys.flatMap((key): WorkbenchOverlayPanel[] => {\n    const collapsed = panels[key]?.collapsed;\n    return collapsed ? [{ key, collapsed }] : [];\n  });\n  if (dismissOverlays && overlayPanels.length > 0) {\n    const selector = `[data-component=\"workbench\"][id=${quoted(id)}]`;\n    disposers.push(\n      wireWorkbenchOverlays(\n        root,\n        () =>\n          root.matches(selector)\n            ? root\n            : root.querySelector<HTMLElement>(selector),\n        overlayPanels,\n        exclusiveOverlays,\n      ),\n    );\n  }\n\n  return () => {\n    stopResize?.();\n    stopResize = undefined;\n    for (const dispose of disposers.splice(0)) dispose();\n  };\n}\n"]}
+{"version":3,"sources":[],"names":[],"mappings":"","file":"wire-workbench.js"}

package/dist/workbench.d.ts

@@ -1,13 +1,68 @@
 import { SafeHtml } from 'kerfjs';
 import { ResizableRegionSeparator, ResizableRegionCollapseMotion, ResizableRegionContentOverflow, ResizableRegionPresentation, ResizableRegionRestorePosition } from './resizable-region.js';
 import { K as KerfUiContent } from './semantic-content-BbzjvSu9.js';
+import { a as PanelToolbar, b as PanelToggle } from './panel-toolbar-BFQxFITu.js';
+import { ToolbarProps } from './toolbar.js';
+import './lucide-icon.js';
+import 'lucide';
+import './divider-sides-BzB6rphT.js';
+import './pane.js';
+
+/** The standard toggle a Workbench renders for a panel (see {@link PanelToggle}). */
+type WorkbenchPanelToggle = PanelToggle;
+/**
+ * A Workbench panel's top toolbar, composed by the Workbench so its groups can
+ * follow the panel's open state (see {@link PanelToolbar} for the roles).
+ * A collapsed rail's `constant` groups and toggle go to the leading edge of
+ * `mainToolbar` (left rail) or its trailing edge (right rail); a collapsed
+ * drawer's go to the trailing edge of `mainBottomToolbar`, else to a
+ * `FloatingToolbar` in the work area's bottom-end corner.
+ */
+type WorkbenchPanelToolbar = PanelToolbar;
+/** The work area's top toolbar; collapsed rails add their groups to it. */
+interface WorkbenchMainToolbar {
+    label: string;
+    /** The work area's title, usually an extra-large `ToolbarText`. */
+    title?: KerfUiContent;
+    /** Groups after the title. */
+    leading?: KerfUiContent;
+    center?: KerfUiContent;
+    /** Groups at the trailing edge, before a collapsed right rail's groups. */
+    trailing?: KerfUiContent;
+    /** The toolbar's narrow-width policy (see `Toolbar.responsive`). */
+    responsive?: ToolbarProps['responsive'];
+    responsiveAt?: ToolbarProps['responsiveAt'];
+}
+/** The work area's bottom toolbar; a collapsed drawer adds its groups to it. */
+interface WorkbenchMainBottomToolbar {
+    label: string;
+    leading?: KerfUiContent;
+    trailing?: KerfUiContent;
+}
+/**
+ * The work area: the app's `main` under `mainToolbar` (and above
+ * `mainBottomToolbar`), with each collapsed panel's groups added to the
+ * toolbar on its side. Without either toolbar, `main` renders as given.
+ */
+/**
+ * Whether the work area's header or footer chrome stays pinned (`fixed`) or
+ * scrolls away with the content (`scroll`).
+ */
+type WorkbenchChromePlacement = 'fixed' | 'scroll';
 
 /**
  * The Workbench container breakpoint below which a panel presents as an
  * overlay: `narrow` (704px or less) or `compact` (448px or less) — the same
- * breakpoints as `ResizableRegion`'s `responsiveFillAt`.
+ * breakpoints as `ResizableRegion`'s `responsiveFillAt` — or `never` to keep
+ * it inline at every width.
  */
-type WorkbenchResponsiveOverlayAt = 'compact' | 'narrow';
+type WorkbenchResponsiveOverlayAt = 'compact' | 'narrow' | 'never';
+/**
+ * How wide a rail's overlay is in a compact (448px or less) Workbench: `inset`
+ * fills the Workbench less a dismiss margin on the side away from the rail's
+ * edge, so a press beside it closes it; `full` fills the Workbench.
+ */
+type WorkbenchCompactOverlay = 'inset' | 'full';
 /** Drag-resize limits for a resizable Workbench panel, in px. */
 interface WorkbenchPanelResizable {
     /** Smallest size (default 180 for a rail, 120 for the drawer). */
@@ -18,6 +73,14 @@ interface WorkbenchPanelResizable {
 /** A collapsible Workbench panel — a side rail or the bottom drawer. */
 interface WorkbenchPanel {
     content: KerfUiContent;
+    /**
+     * The panel's top toolbar, composed by the Workbench: its `constant` groups
+     * and standard `toggle` move to the work area's toolbar while the panel is
+     * collapsed. With it, `content` renders in a `Pane` below the toolbar.
+     */
+    toolbar?: WorkbenchPanelToolbar;
+    /** Optional bottom toolbar under a `toolbar` panel's content. */
+    footer?: KerfUiContent;
     /** Whether the panel is currently collapsed (the app owns this). */
     collapsed?: boolean;
     /**
@@ -43,13 +106,22 @@ interface WorkbenchPanel {
      * Present the panel as an overlay, without a separator, below a Workbench
      * container breakpoint, and inline above it — the CSS decides, so the app
      * needs no device-class check. A rail overlays from its side at full
-     * height; the bottom drawer overlays the bottom of the work-area column.
+     * height, over the work area and an open drawer; the bottom drawer
+     * overlays the bottom of the work-area column. Rails default to `narrow`
+     * (pass `never` to keep one inline); the drawer defaults to inline.
      */
     responsiveOverlayAt?: WorkbenchResponsiveOverlayAt;
+    /**
+     * A rail's overlay width in a compact Workbench (default `inset`: the
+     * Workbench less `--kui-workbench-overlay-dismiss-margin`, 44px). Ignored
+     * by the drawer.
+     */
+    compactOverlay?: WorkbenchCompactOverlay;
     /**
      * Control shown while collapsed, in a safe-area-aware corner of the
      * Workbench (not the viewport); the bottom drawer's sits in the work-area
-     * column.
+     * column. Prefer `toolbar.toggle`, which the Workbench relocates into the
+     * work area's toolbar (or this corner when that toolbar is absent).
      */
     restoreControl?: SafeHtml;
     restorePosition?: ResizableRegionRestorePosition;
@@ -64,6 +136,35 @@ interface WorkbenchProps {
     label: string;
     /** The central work area. */
     main: KerfUiContent;
+    /**
+     * The work area's top toolbar. A collapsed left rail's `constant` groups
+     * and toggle lead it; a collapsed right rail's trail it. With it, `main`
+     * renders in a `Pane` below the toolbar.
+     */
+    mainToolbar?: WorkbenchMainToolbar;
+    /**
+     * Fixed content under `mainToolbar` — supporting copy such as a
+     * description — divided from the scrolling `main` below it.
+     */
+    mainHeader?: KerfUiContent;
+    /**
+     * Fixed content over `mainBottomToolbar` — a status line or a resource
+     * toolbar — divided from the scrolling `main` above it.
+     */
+    mainFooter?: KerfUiContent;
+    /**
+     * The work area's bottom toolbar. A collapsed drawer's `constant` groups and
+     * toggle trail it; without it they float in the work area's corner.
+     */
+    mainBottomToolbar?: WorkbenchMainBottomToolbar;
+    /**
+     * Whether `mainToolbar` and `mainHeader` stay pinned (`fixed`, default) or
+     * scroll away with `main` (`scroll`) — useful where large text would leave
+     * pinned chrome little room.
+     */
+    mainHeaderPlacement?: WorkbenchChromePlacement;
+    /** The same for `mainFooter` and `mainBottomToolbar` (default `fixed`). */
+    mainFooterPlacement?: WorkbenchChromePlacement;
     leftRail?: WorkbenchPanel;
     rightRail?: WorkbenchPanel;
     bottomDrawer?: WorkbenchPanel;
@@ -100,6 +201,6 @@ interface WorkbenchProps {
  * lives outside it and stays reachable). A panel may opt in to drag and keyboard resizing with
  * `resizable`, which `wireWorkbench` drives. See `docs/23-app-layouts.md` §3.3.
  */
-declare function Workbench({ id, label, main, leftRail, rightRail, bottomDrawer, mainMinSize, mainMinHeight, className, slot, }: WorkbenchProps): SafeHtml;
+declare function Workbench({ id, label, main, leftRail, rightRail, bottomDrawer, mainToolbar, mainHeader, mainFooter, mainBottomToolbar, mainHeaderPlacement, mainFooterPlacement, mainMinSize, mainMinHeight, className, slot, }: WorkbenchProps): SafeHtml;
 
-export { Workbench, type WorkbenchPanel, type WorkbenchPanelResizable, type WorkbenchProps, type WorkbenchResponsiveOverlayAt };
+export { Workbench, type WorkbenchChromePlacement, type WorkbenchCompactOverlay, type WorkbenchMainBottomToolbar, type WorkbenchMainToolbar, type WorkbenchPanel, type WorkbenchPanelResizable, type WorkbenchPanelToggle, type WorkbenchPanelToolbar, type WorkbenchProps, type WorkbenchResponsiveOverlayAt };

package/dist/workbench.js

@@ -1,212 +1,15 @@
-import { WORKBENCH_MAIN_MIN_SIZE, WORKBENCH_MAIN_MIN_HEIGHT, workbenchRegionId, WORKBENCH_RESIZE_DEFAULTS } from './chunk-PSHUSWQH.js';
-import { clampRegionSize, ResizeGrip } from './chunk-VHADGP3B.js';
-import { jsxs, jsx } from 'kerfjs/jsx-runtime';
+export { Workbench } from './chunk-EAX2GSS4.js';
+
+
+
+
+
+
+
+
+
+
 
-var EDGES = {
-  leftRail: "end",
-  rightRail: "start",
-  bottomDrawer: "start"
-};
-var DEFAULT_LABELS = {
-  leftRail: "left rail",
-  rightRail: "right rail",
-  bottomDrawer: "bottom drawer"
-};
-function resolveResize(id, key, panel) {
-  if (!panel.resizable) return void 0;
-  const defaults = WORKBENCH_RESIZE_DEFAULTS[key];
-  const limits = panel.resizable === true ? {} : panel.resizable;
-  const min = limits.min ?? defaults.min;
-  const max = Math.max(min, limits.max ?? defaults.max);
-  return {
-    regionId: workbenchRegionId(id, key),
-    axis: key === "bottomDrawer" ? "vertical" : "horizontal",
-    edge: EDGES[key],
-    size: clampRegionSize(panel.size ?? defaults.size, min, max),
-    min,
-    max
-  };
-}
-var resizeAttributes = (resize) => resize ? {
-  "data-resizable": "true",
-  "data-region-id": resize.regionId,
-  "data-axis": resize.axis,
-  "data-edge": resize.edge
-} : {};
-function panelStyle(panel, resize, sizeProperty) {
-  if (resize) return `--kui-resizable-region-size:${resize.size}px`;
-  return panel.size ? `${sizeProperty}: ${panel.size}px` : void 0;
-}
-function PanelHandle({
-  panel,
-  resize,
-  label
-}) {
-  const inert = Boolean(panel.collapsed) || (panel.presentation ?? "inline") !== "inline";
-  return /* @__PURE__ */ jsx(
-    "div",
-    {
-      class: "kui-workbench__handle",
-      role: "separator",
-      tabindex: inert ? "-1" : "0",
-      "aria-label": `Resize ${label}`,
-      "aria-orientation": resize.axis === "horizontal" ? "vertical" : "horizontal",
-      "aria-valuemin": resize.min,
-      "aria-valuemax": resize.max,
-      "aria-valuenow": resize.size,
-      "aria-hidden": inert ? "true" : void 0,
-      "data-kui-resize-handle": true,
-      "data-region-id": resize.regionId,
-      children: /* @__PURE__ */ jsx("span", { class: "kui-workbench__handle-icon", "aria-hidden": "true", children: /* @__PURE__ */ jsx(ResizeGrip, { axis: resize.axis }) })
-    }
-  );
-}
-function hiddenFromAccessibility(panel) {
-  return panel.collapsed || panel.presentation === "hidden" ? "true" : void 0;
-}
-function Rail({
-  id,
-  side,
-  panel
-}) {
-  const key = side === "left" ? "leftRail" : "rightRail";
-  const resize = resolveResize(id, key, panel);
-  return /* @__PURE__ */ jsxs(
-    "aside",
-    {
-      id: workbenchRegionId(id, key),
-      class: `kui-workbench__rail kui-workbench__rail--${side}`,
-      "data-workbench-rail": side,
-      "data-collapsed": String(panel.collapsed ?? false),
-      "data-separator": panel.separator ?? "auto",
-      "data-collapse-motion": panel.collapseMotion ?? "slide",
-      "data-content-overflow": panel.contentOverflow ?? "clip",
-      "data-presentation": panel.presentation ?? "inline",
-      "data-responsive-overlay-at": panel.responsiveOverlayAt,
-      ...resizeAttributes(resize),
-      "aria-label": panel.label || void 0,
-      "aria-hidden": hiddenFromAccessibility(panel),
-      inert: Boolean(panel.collapsed),
-      style: panelStyle(panel, resize, "--kui-workbench-rail-width"),
-      children: [
-        /* @__PURE__ */ jsx(
-          "div",
-          {
-            class: "kui-workbench__panel-content",
-            inert: Boolean(panel.collapsed),
-            children: panel.content
-          }
-        ),
-        resize && /* @__PURE__ */ jsx(
-          PanelHandle,
-          {
-            panel,
-            resize,
-            label: panel.label || DEFAULT_LABELS[key]
-          }
-        )
-      ]
-    }
-  );
-}
-function Drawer({ id, panel }) {
-  const resize = resolveResize(id, "bottomDrawer", panel);
-  return /* @__PURE__ */ jsxs(
-    "section",
-    {
-      id: workbenchRegionId(id, "bottomDrawer"),
-      class: "kui-workbench__drawer",
-      "data-workbench-drawer": true,
-      "data-collapsed": String(panel.collapsed ?? false),
-      "data-separator": panel.separator ?? "auto",
-      "data-collapse-motion": panel.collapseMotion ?? "slide",
-      "data-content-overflow": panel.contentOverflow ?? "clip",
-      "data-presentation": panel.presentation ?? "inline",
-      "data-responsive-overlay-at": panel.responsiveOverlayAt,
-      ...resizeAttributes(resize),
-      "aria-label": panel.label || void 0,
-      "aria-hidden": hiddenFromAccessibility(panel),
-      inert: Boolean(panel.collapsed),
-      style: panelStyle(panel, resize, "--kui-workbench-drawer-height"),
-      children: [
-        /* @__PURE__ */ jsx(
-          "div",
-          {
-            class: "kui-workbench__panel-content",
-            inert: Boolean(panel.collapsed),
-            children: panel.content
-          }
-        ),
-        resize && /* @__PURE__ */ jsx(
-          PanelHandle,
-          {
-            panel,
-            resize,
-            label: panel.label || DEFAULT_LABELS.bottomDrawer
-          }
-        )
-      ]
-    }
-  );
-}
-function restore(panel, side, position) {
-  if (!panel?.collapsed || !panel.restoreControl || panel.presentation === "hidden")
-    return "";
-  return /* @__PURE__ */ jsx(
-    "div",
-    {
-      class: "kui-workbench__restore",
-      "data-panel": side,
-      "data-position": panel.restorePosition ?? position,
-      children: panel.restoreControl
-    }
-  );
-}
-function Workbench({
-  id,
-  label,
-  main,
-  leftRail,
-  rightRail,
-  bottomDrawer,
-  mainMinSize = WORKBENCH_MAIN_MIN_SIZE,
-  mainMinHeight = WORKBENCH_MAIN_MIN_HEIGHT,
-  className = "",
-  slot
-}) {
-  const px = (value) => Math.max(0, Math.round(value));
-  const mainMin = leftRail || rightRail ? px(mainMinSize) : void 0;
-  const mainMinBlock = bottomDrawer ? px(mainMinHeight) : void 0;
-  const style = [
-    mainMin === void 0 ? "" : `--_kui-workbench-main-min-width:${mainMin}px`,
-    mainMinBlock === void 0 ? "" : `--_kui-workbench-main-min-height:${mainMinBlock}px`
-  ].filter(Boolean).join(";");
-  return /* @__PURE__ */ jsxs(
-    "section",
-    {
-      class: `kui-workbench ${className}`.trim(),
-      id,
-      "data-component": "workbench",
-      "data-main-min-size": mainMin === void 0 ? void 0 : String(mainMin),
-      "data-main-min-height": mainMinBlock === void 0 ? void 0 : String(mainMinBlock),
-      style: style || void 0,
-      "aria-label": label,
-      slot,
-      children: [
-        leftRail && /* @__PURE__ */ jsx(Rail, { id, side: "left", panel: leftRail }),
-        restore(leftRail, "left", "bottom-start"),
-        /* @__PURE__ */ jsxs("div", { class: "kui-workbench__center", children: [
-          /* @__PURE__ */ jsx("div", { class: "kui-workbench__main", "data-workbench-main": true, children: main }),
-          bottomDrawer && /* @__PURE__ */ jsx(Drawer, { id, panel: bottomDrawer }),
-          restore(bottomDrawer, "bottom", "bottom-end")
-        ] }),
-        rightRail && /* @__PURE__ */ jsx(Rail, { id, side: "right", panel: rightRail }),
-        restore(rightRail, "right", "bottom-end")
-      ]
-    }
-  );
-}
 
-export { Workbench };
 
 //# sourceMappingURL=workbench.js.map

package/dist/workbench.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/workbench.tsx"],"names":[],"mappings":"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","file":"workbench.js","sourcesContent":["import type { SafeHtml } from 'kerfjs';\n\nimport {\n  clampRegionSize,\n  type ResizableRegionAxis,\n  type ResizableRegionCollapseMotion,\n  type ResizableRegionContentOverflow,\n  type ResizableRegionEdge,\n  type ResizableRegionPresentation,\n  type ResizableRegionRestorePosition,\n  type ResizableRegionSeparator,\n} from './resizable-region.js';\nimport { ResizeGrip } from './resize-grip.js';\nimport type { KerfUiContent } from './semantic-content.js';\nimport {\n  WORKBENCH_MAIN_MIN_HEIGHT,\n  WORKBENCH_MAIN_MIN_SIZE,\n  WORKBENCH_RESIZE_DEFAULTS,\n  type WorkbenchPanelKey,\n  workbenchRegionId,\n} from './workbench-resize.js';\n\n/**\n * The Workbench container breakpoint below which a panel presents as an\n * overlay: `narrow` (704px or less) or `compact` (448px or less) — the same\n * breakpoints as `ResizableRegion`'s `responsiveFillAt`.\n */\nexport type WorkbenchResponsiveOverlayAt = 'compact' | 'narrow';\n\n/** Drag-resize limits for a resizable Workbench panel, in px. */\nexport interface WorkbenchPanelResizable {\n  /** Smallest size (default 180 for a rail, 120 for the drawer). */\n  min?: number;\n  /** Largest size (default 480). */\n  max?: number;\n}\n\n/** A collapsible Workbench panel — a side rail or the bottom drawer. */\nexport interface WorkbenchPanel {\n  content: KerfUiContent;\n  /** Whether the panel is currently collapsed (the app owns this). */\n  collapsed?: boolean;\n  /**\n   * Rail width, or drawer height, in px. Overrides the CSS default. For a\n   * resizable panel it is the current size (default 280 for a rail, 220 for\n   * the drawer), clamped to the limits; the app owns it and `wireWorkbench`\n   * reports each resize.\n   */\n  size?: number;\n  /**\n   * Opt in to drag and keyboard resizing on the panel's inner separator:\n   * `true` for the default limits, or `{ min, max }`. Off by default. Pair it\n   * with `wireWorkbench` from `@kerfjs/ui/wire-workbench`.\n   */\n  resizable?: boolean | WorkbenchPanelResizable;\n  /** Accessible name for the panel region. */\n  label?: string;\n  separator?: ResizableRegionSeparator;\n  collapseMotion?: ResizableRegionCollapseMotion;\n  contentOverflow?: ResizableRegionContentOverflow;\n  presentation?: ResizableRegionPresentation;\n  /**\n   * Present the panel as an overlay, without a separator, below a Workbench\n   * container breakpoint, and inline above it — the CSS decides, so the app\n   * needs no device-class check. A rail overlays from its side at full\n   * height; the bottom drawer overlays the bottom of the work-area column.\n   */\n  responsiveOverlayAt?: WorkbenchResponsiveOverlayAt;\n  /**\n   * Control shown while collapsed, in a safe-area-aware corner of the\n   * Workbench (not the viewport); the bottom drawer's sits in the work-area\n   * column.\n   */\n  restoreControl?: SafeHtml;\n  restorePosition?: ResizableRegionRestorePosition;\n}\n\nexport interface WorkbenchProps {\n  /**\n   * The Workbench's `id`. Each panel's `id` derives from it —\n   * `<id>-left-rail`, `<id>-right-rail`, `<id>-bottom-drawer` — so a toggle\n   * can name the panel it shows and hides with `aria-controls`.\n   */\n  id: string;\n  label: string;\n  /** The central work area. */\n  main: KerfUiContent;\n  leftRail?: WorkbenchPanel;\n  rightRail?: WorkbenchPanel;\n  bottomDrawer?: WorkbenchPanel;\n  /**\n   * Minimum width, in px, the work area keeps beside the inline rails, fixed\n   * or `resizable` (default 320; `0` turns it off). Resizing a rail stops\n   * where the work area would drop below it, and inline rails shrink\n   * proportionally when the Workbench gets narrower. Workbenches without a\n   * rail ignore it.\n   */\n  mainMinSize?: number;\n  /**\n   * Minimum height, in px, the work area keeps above an inline bottom drawer,\n   * fixed or `resizable` (default 120; `0` turns it off) — the drawer's\n   * counterpart of `mainMinSize`. Resizing the drawer stops where the work\n   * area would drop below it, and the drawer shrinks when the Workbench gets\n   * shorter. Workbenches without a drawer ignore it.\n   */\n  mainMinHeight?: number;\n  className?: string;\n  /** Native named-slot assignment when composed inside a web component. */\n  slot?: string;\n}\n\ninterface ResolvedResize {\n  regionId: string;\n  axis: ResizableRegionAxis;\n  edge: ResizableRegionEdge;\n  size: number;\n  min: number;\n  max: number;\n}\n\n/**\n * Each panel's separator is its inner edge. Growing the left rail moves that\n * edge toward the inline end; growing the right rail or the drawer moves it\n * toward the start — the same edge vocabulary `ResizableRegion` uses.\n */\nconst EDGES: Record<WorkbenchPanelKey, ResizableRegionEdge> = {\n  leftRail: 'end',\n  rightRail: 'start',\n  bottomDrawer: 'start',\n};\n\nconst DEFAULT_LABELS: Record<WorkbenchPanelKey, string> = {\n  leftRail: 'left rail',\n  rightRail: 'right rail',\n  bottomDrawer: 'bottom drawer',\n};\n\nfunction resolveResize(\n  id: string,\n  key: WorkbenchPanelKey,\n  panel: WorkbenchPanel,\n): ResolvedResize | undefined {\n  if (!panel.resizable) return undefined;\n  const defaults = WORKBENCH_RESIZE_DEFAULTS[key];\n  const limits = panel.resizable === true ? {} : panel.resizable;\n  const min = limits.min ?? defaults.min;\n  const max = Math.max(min, limits.max ?? defaults.max);\n  return {\n    regionId: workbenchRegionId(id, key),\n    axis: key === 'bottomDrawer' ? 'vertical' : 'horizontal',\n    edge: EDGES[key],\n    size: clampRegionSize(panel.size ?? defaults.size, min, max),\n    min,\n    max,\n  };\n}\n\n/** The attributes a resizable panel adds for the resize wiring to read. */\nconst resizeAttributes = (resize: ResolvedResize | undefined) =>\n  resize\n    ? {\n        'data-resizable': 'true',\n        'data-region-id': resize.regionId,\n        'data-axis': resize.axis,\n        'data-edge': resize.edge,\n      }\n    : {};\n\n/**\n * A resizable panel's size lives in the resize wiring's track property, so a\n * drag or key press resizes the panel before the app re-renders; the CSS maps\n * it onto the rail width or drawer height.\n */\nfunction panelStyle(\n  panel: WorkbenchPanel,\n  resize: ResolvedResize | undefined,\n  sizeProperty: string,\n) {\n  if (resize) return `--kui-resizable-region-size:${resize.size}px`;\n  return panel.size ? `${sizeProperty}: ${panel.size}px` : undefined;\n}\n\n/**\n * The separator a resizable panel owns: the same focusable `role=\"separator\"`\n * contract a `ResizableRegion` handle carries, so one resize wiring drives\n * both. It leaves the tab order while the panel is collapsed or not inline.\n */\nfunction PanelHandle({\n  panel,\n  resize,\n  label,\n}: {\n  panel: WorkbenchPanel;\n  resize: ResolvedResize;\n  label: string;\n}) {\n  const inert =\n    Boolean(panel.collapsed) || (panel.presentation ?? 'inline') !== 'inline';\n  return (\n    <div\n      class=\"kui-workbench__handle\"\n      role=\"separator\"\n      tabindex={inert ? '-1' : '0'}\n      aria-label={`Resize ${label}`}\n      aria-orientation={\n        resize.axis === 'horizontal' ? 'vertical' : 'horizontal'\n      }\n      aria-valuemin={resize.min}\n      aria-valuemax={resize.max}\n      aria-valuenow={resize.size}\n      aria-hidden={inert ? 'true' : undefined}\n      data-kui-resize-handle\n      data-region-id={resize.regionId}\n    >\n      <span class=\"kui-workbench__handle-icon\" aria-hidden=\"true\">\n        <ResizeGrip axis={resize.axis} />\n      </span>\n    </div>\n  );\n}\n\n/**\n * A collapsed panel leaves the accessibility tree as a whole, like a collapsed\n * `CollapsiblePanel`: its content and separator are already inert or hidden,\n * so the labeled landmark would otherwise stay behind, empty, for a screen\n * reader to land on. Its restore control renders outside it and stays\n * reachable.\n */\nfunction hiddenFromAccessibility(panel: WorkbenchPanel) {\n  return panel.collapsed || panel.presentation === 'hidden'\n    ? ('true' as const)\n    : undefined;\n}\n\nfunction Rail({\n  id,\n  side,\n  panel,\n}: {\n  id: string;\n  side: 'left' | 'right';\n  panel: WorkbenchPanel;\n}) {\n  const key: WorkbenchPanelKey = side === 'left' ? 'leftRail' : 'rightRail';\n  const resize = resolveResize(id, key, panel);\n  return (\n    <aside\n      id={workbenchRegionId(id, key)}\n      class={`kui-workbench__rail kui-workbench__rail--${side}`}\n      data-workbench-rail={side}\n      data-collapsed={String(panel.collapsed ?? false)}\n      data-separator={panel.separator ?? 'auto'}\n      data-collapse-motion={panel.collapseMotion ?? 'slide'}\n      data-content-overflow={panel.contentOverflow ?? 'clip'}\n      data-presentation={panel.presentation ?? 'inline'}\n      data-responsive-overlay-at={panel.responsiveOverlayAt}\n      {...resizeAttributes(resize)}\n      aria-label={panel.label || undefined}\n      aria-hidden={hiddenFromAccessibility(panel)}\n      inert={Boolean(panel.collapsed)}\n      style={panelStyle(panel, resize, '--kui-workbench-rail-width')}\n    >\n      <div\n        class=\"kui-workbench__panel-content\"\n        inert={Boolean(panel.collapsed)}\n      >\n        {panel.content}\n      </div>\n      {resize && (\n        <PanelHandle\n          panel={panel}\n          resize={resize}\n          label={panel.label || DEFAULT_LABELS[key]}\n        />\n      )}\n    </aside>\n  );\n}\n\nfunction Drawer({ id, panel }: { id: string; panel: WorkbenchPanel }) {\n  const resize = resolveResize(id, 'bottomDrawer', panel);\n  return (\n    <section\n      id={workbenchRegionId(id, 'bottomDrawer')}\n      class=\"kui-workbench__drawer\"\n      data-workbench-drawer\n      data-collapsed={String(panel.collapsed ?? false)}\n      data-separator={panel.separator ?? 'auto'}\n      data-collapse-motion={panel.collapseMotion ?? 'slide'}\n      data-content-overflow={panel.contentOverflow ?? 'clip'}\n      data-presentation={panel.presentation ?? 'inline'}\n      data-responsive-overlay-at={panel.responsiveOverlayAt}\n      {...resizeAttributes(resize)}\n      aria-label={panel.label || undefined}\n      aria-hidden={hiddenFromAccessibility(panel)}\n      inert={Boolean(panel.collapsed)}\n      style={panelStyle(panel, resize, '--kui-workbench-drawer-height')}\n    >\n      <div\n        class=\"kui-workbench__panel-content\"\n        inert={Boolean(panel.collapsed)}\n      >\n        {panel.content}\n      </div>\n      {resize && (\n        <PanelHandle\n          panel={panel}\n          resize={resize}\n          label={panel.label || DEFAULT_LABELS.bottomDrawer}\n        />\n      )}\n    </section>\n  );\n}\n\n/** A collapsed panel's restore control, outside the clipped panel. */\nfunction restore(\n  panel: WorkbenchPanel | undefined,\n  side: 'left' | 'right' | 'bottom',\n  position: ResizableRegionRestorePosition,\n) {\n  if (\n    !panel?.collapsed ||\n    !panel.restoreControl ||\n    panel.presentation === 'hidden'\n  )\n    return '';\n  return (\n    <div\n      class=\"kui-workbench__restore\"\n      data-panel={side}\n      data-position={panel.restorePosition ?? position}\n    >\n      {panel.restoreControl}\n    </div>\n  );\n}\n\n/**\n * The Xcode-like multi-panel workspace: a collapsible left rail, right rail, and\n * bottom drawer around a central work area (any absent). Collapsing snaps the\n * panel's track to zero in one reflow while its fixed-size content slides out via\n * a composited transform — the instant-width / sliding-content technique, so the\n * work area relayouts once, not per frame. Bottom-drawer content stays anchored\n * to the shell's stable bottom edge throughout that transition. The app owns\n * each `collapsed` flag; the collapse is pure CSS. A collapsed panel renders\n * `inert` and `aria-hidden`, so neither Tab nor assistive technology reaches\n * controls that have slid out of view or an empty landmark (its restore control\n * lives outside it and stays reachable). A panel may opt in to drag and keyboard resizing with\n * `resizable`, which `wireWorkbench` drives. See `docs/23-app-layouts.md` §3.3.\n */\nexport function Workbench({\n  id,\n  label,\n  main,\n  leftRail,\n  rightRail,\n  bottomDrawer,\n  mainMinSize = WORKBENCH_MAIN_MIN_SIZE,\n  mainMinHeight = WORKBENCH_MAIN_MIN_HEIGHT,\n  className = '',\n  slot,\n}: WorkbenchProps) {\n  // Each work-area minimum applies only on an axis a panel shares with it:\n  // the width beside a rail, the height above the drawer.\n  const px = (value: number) => Math.max(0, Math.round(value));\n  const mainMin = leftRail || rightRail ? px(mainMinSize) : undefined;\n  const mainMinBlock = bottomDrawer ? px(mainMinHeight) : undefined;\n  const style = [\n    mainMin === undefined ? '' : `--_kui-workbench-main-min-width:${mainMin}px`,\n    mainMinBlock === undefined\n      ? ''\n      : `--_kui-workbench-main-min-height:${mainMinBlock}px`,\n  ]\n    .filter(Boolean)\n    .join(';');\n  return (\n    <section\n      class={`kui-workbench ${className}`.trim()}\n      id={id}\n      data-component=\"workbench\"\n      data-main-min-size={mainMin === undefined ? undefined : String(mainMin)}\n      data-main-min-height={\n        mainMinBlock === undefined ? undefined : String(mainMinBlock)\n      }\n      style={style || undefined}\n      aria-label={label}\n      slot={slot}\n    >\n      {leftRail && <Rail id={id} side=\"left\" panel={leftRail} />}\n      {restore(leftRail, 'left', 'bottom-start')}\n      <div class=\"kui-workbench__center\">\n        <div class=\"kui-workbench__main\" data-workbench-main>\n          {main}\n        </div>\n        {bottomDrawer && <Drawer id={id} panel={bottomDrawer} />}\n        {restore(bottomDrawer, 'bottom', 'bottom-end')}\n      </div>\n      {rightRail && <Rail id={id} side=\"right\" panel={rightRail} />}\n      {restore(rightRail, 'right', 'bottom-end')}\n    </section>\n  );\n}\n"]}
+{"version":3,"sources":[],"names":[],"mappings":"","file":"workbench.js"}

package/docs/accessibility.md

@@ -35,7 +35,7 @@ Use `presentation="toolbar-borderless"` inside a `ToolbarControlGroup`, with
 parent paints the composed focus ring. `selectedPresentation="icon-only"` hides
 only the visible selected label—the required `label` or `ariaLabel` still names
 the combobox. An icon-only trigger keeps its disclosure caret: the selected icon
-and caret form one pill with the same geometry as a popup-menu `wa-dropdown`
+and caret form one pill with the same geometry as a `PopupMenu`
 trigger (8px inline padding on both sides, 12px from the icon to the caret, a
 40px default or 32px compact control height), so the caret still signals a
 choice list. Inside a group the trigger is inset evenly on every side (2px in a
@@ -81,6 +81,17 @@ repeated and out-of-order completions, cancellation, instance isolation, and
 removal. `tests/browser/select-lifecycle.spec.ts` repeats animation/resize/reopen
 sequences at wide and narrow widths in Chromium, Firefox, and WebKit.
 
+## PopupMenu
+
+`PopupMenu` renders a Web Awesome dropdown, so the menu roles, arrow-key and
+typeahead navigation, Escape, and focus return to the trigger come from
+`wa-dropdown`. Kerf's part is the trigger's name. A Web Awesome button takes its
+name from its content and ignores an `aria-label` on the host, so an icon-only
+trigger requires `label`, which renders as visually hidden text inside the
+button; a trigger with visible `text` is named by that text. Group headings render as the dropdown's native menu labels, and
+dividers are presentational. A disabled item stays in the menu but cannot be
+chosen; disable the whole trigger only when every command is unavailable.
+
 ## ListActionRow
 
 `ListActionRow` renders a noninteractive visual root containing primary and

package/docs/catalog.md

@@ -6,6 +6,15 @@ footer that the kerf UI catalog itself uses. Point it at your own components and
 you get the same shell without rebuilding it. Like the app layouts, it is a
 subpath-only, tree-shakeable module that adds nothing to the main barrel.
 
+The shell is a [`Workbench`](workbench.md) built entirely from `@kerfjs/ui`
+components: the sidebar is its left rail and the active entry its work area. So
+the sidebar behaves like any Workbench rail — its standard toggle moves into the
+entry toolbar while it is collapsed, and on a small screen (a Workbench narrower
+than 704px) it overlays the stage, one tap from the entry toolbar, filling the
+width less a 44px strip that closes it, instead of squeezing the stage. Pass the
+app's `collapsed` signal to `wireCatalog` so that overlay closes on Escape, on a
+press outside, and when an entry is chosen from it.
+
 ```bash
 npm install @kerfjs/ui # kerfjs is a peer; @kerfjs/ui/select/register is needed only if entries use `related`
 ```
@@ -36,9 +45,9 @@ expanded? }`. When `collapsible`, the label is a disclosure toggle controlling
   sidebar content), and `status` (a footer status line).
 
 Per-entry `resources` render as "open in new tab" links in the footer, and
-`related` renders a "Related entries" popup menu — a `single` `ToolbarControlGroup`
-around a `wa-dropdown` (grouped by each entry's `group`), so register its elements
-with `@kerfjs/ui/select/register` when you use it.
+`related` renders a "Related entries" `PopupMenu` in a `single`
+`ToolbarControlGroup` (grouped by each entry's `group`), so register its elements
+with `@kerfjs/ui/popup-menu/register` when you use it.
 
 ## Catalog demo authoring contract
 
@@ -249,8 +258,8 @@ Set `revealSelection: true` on `wireCatalog` for a long desktop sidebar. After
 `onSelect` updates controlled state, the helper waits one animation frame, finds
 the exact matching `data-item-id`, and scrolls it into view without changing
 focus. A newer selection or disposal cancels the pending reveal. The default
-media guard is the Catalog desktop layout (`min-width: 52.01rem`), so compact
-layouts keep their existing scroll position.
+media guard follows the Workbench's inline sidebar (`min-width: 44.01rem`), so a
+closed phone overlay is never scrolled behind the user's back.
 
 Pass an options object instead of `true` to customize `block`, `inline`,
 `behavior`, or `media`; `media: false` deliberately enables the behavior at all
@@ -384,6 +393,12 @@ revealCatalogEntry(app, initial, { block: "center" });
 - **`active`** is domain state (which entry is shown) — the app's signal, updated in
   `onSelect`, read to compute `content`.
 - **`collapsed`** is transient UI — the app's signal, flipped in `onToggleSidebar`.
+  Pass the same signal as `wireCatalog`'s `collapsed` option so the sidebar is
+  wired as a Workbench rail (transient on small screens, focus handed to the
+  relocated toggle).
+- **`headerPlacement` / `footerPlacement`** choose whether the entry toolbar and the
+  status + resource footer stay pinned (`fixed`, default) or scroll with the preview
+  (`scroll`) — useful where large text would leave pinned chrome little room.
 - **`theme`** is a global preference — the app's signal; `wireCatalog` only reports
   the toggle, the app applies the theme (the shell reads `theme` to show the toggle's
   opposite-state label). Omit `theme` to hide the toggle entirely.
@@ -397,7 +412,10 @@ matching options on `wireCatalog`) if they collide with your own action table.
 
 ## CSS
 
-`Catalog` composes public primitives (`Toolbar`, `ListHeader`, `ListItem`, `Select`,
-…). Import `@kerfjs/ui/styles.css` for the whole layer, or `@kerfjs/ui/catalog.css`
-plus each composed primitive's CSS. The shell is theme-aware and responsive: it
-stacks the sidebar above the detail below ~832px and hides it when collapsed.
+`Catalog` composes public components (`Workbench`, `Pane`, `Toolbar`, `List`,
+`ListHeader`, `ListItem`, `ListInsetText`, `Text`, …) and owns only the preview stage
+(the checkerboard and centered canvas), the geometry overlay, the example viewport
+options, and the brand mark's size. Import `@kerfjs/ui/styles.css` for the whole
+layer, or `@kerfjs/ui/catalog.css` plus `@kerfjs/ui/workbench.css` and each composed
+primitive's CSS. Like any Workbench it needs a definite containing height — the
+`@kerfjs/ui/document.css` baseline's `.kui-app-root`.