@kerfjs/ui 5.0.0-beta.6 → 5.0.0-beta.61

package/dist/chunk-NNMLEDMD.js

@@ -0,0 +1,399 @@
+import { wireResizeHandles } from './chunk-IA7TMD4Y.js';
+import { workbenchRegionId } from './chunk-PSHUSWQH.js';
+import { effect } from 'kerfjs';
+
+var PANEL_SELECTORS = {
+  leftRail: ':scope > [data-workbench-rail="left"]',
+  rightRail: ':scope > [data-workbench-rail="right"]',
+  bottomDrawer: ":scope > .kui-workbench__center > [data-workbench-drawer]"
+};
+var RESTORE_PANELS = {
+  leftRail: "left",
+  rightRail: "right",
+  bottomDrawer: "bottom"
+};
+var FOCUSABLE = 'a[href],area[href],button:not([disabled]),input:not([disabled]),select:not([disabled]),textarea:not([disabled]),[tabindex]:not([tabindex="-1"])';
+var focusables = (element) => [...element.querySelectorAll(FOCUSABLE)].filter(
+  (control) => typeof control.checkVisibility !== "function" || control.checkVisibility()
+);
+function wireWorkbenchOverlays(root, findWorkbench, panels, exclusive = false) {
+  const ownerDocument = root.ownerDocument;
+  const disposers = [];
+  const openOrder = [];
+  const openers = /* @__PURE__ */ new Map();
+  let pressedFocus;
+  let activated;
+  const panelElement = (panel) => findWorkbench()?.querySelector(PANEL_SELECTORS[panel.key]) ?? null;
+  const responsive = (element) => element.dataset.presentation === "inline" && element.hasAttribute("data-responsive-overlay-at") && globalThis.getComputedStyle(element).position === "absolute";
+  const overlaid = (element) => element.dataset.presentation === "overlay" || responsive(element);
+  const restoreTarget = (panel, element) => {
+    const opener = openers.get(panel);
+    if (opener?.isConnected && !element?.contains(opener) && !panels.some(
+      (other) => other.collapsed.peek() && panelElement(other)?.contains(opener)
+    ))
+      return opener;
+    const side = RESTORE_PANELS[panel.key];
+    const restore = findWorkbench()?.querySelector(
+      `.kui-workbench__restore[data-panel="${side}"]`
+    )?.querySelector(FOCUSABLE);
+    return restore ?? (element ? controller(element) : void 0);
+  };
+  const controller = (element) => {
+    const ids = new Set(
+      [element, ...element.querySelectorAll("[id]")].map((node) => node.id)
+    );
+    ids.delete("");
+    return [
+      ...ownerDocument.querySelectorAll("[aria-controls]")
+    ].find(
+      (control) => !element.contains(control) && control.matches(FOCUSABLE) && control.getAttribute("aria-controls").split(/\s+/).some((id) => ids.has(id))
+    );
+  };
+  const namesPanel = (control, id) => control.getAttribute("aria-controls").split(/\s+/).includes(id);
+  const controlInside = (element) => [...element.querySelectorAll("[aria-controls]")].find(
+    (control) => control.matches(FOCUSABLE) && namesPanel(control, element.id)
+  );
+  const rescueFocus = (panel) => {
+    const element = panelElement(panel);
+    const target = restoreTarget(panel, element);
+    if (target) {
+      target.focus();
+      return;
+    }
+    globalThis.queueMicrotask(() => {
+      if (!panel.collapsed.peek()) return;
+      const later = restoreTarget(panel, panelElement(panel));
+      const active = ownerDocument.activeElement;
+      if (later) later.focus();
+      else if (active instanceof HTMLElement && element?.contains(active))
+        active.blur();
+    });
+  };
+  const adapt = (panel, element, collapsed) => {
+    if (panel.collapsed.peek() === collapsed) return;
+    const stranded = collapsed && element.contains(ownerDocument.activeElement);
+    panel.collapsed.value = collapsed;
+    const content = element.querySelector(
+      ":scope > .kui-workbench__panel-content"
+    );
+    content.style.transition = "none";
+    void globalThis.getComputedStyle(content).transform;
+    content.removeAttribute("style");
+    if (stranded && element.contains(ownerDocument.activeElement))
+      rescueFocus(panel);
+  };
+  const inlineState = /* @__PURE__ */ new Map();
+  const sync = () => {
+    for (const panel of panels) {
+      const element = panelElement(panel);
+      if (!element) continue;
+      const active = responsive(element);
+      if (active && !inlineState.has(panel)) {
+        inlineState.set(panel, panel.collapsed.peek());
+        adapt(panel, element, true);
+      } else if (!active && inlineState.has(panel)) {
+        const remembered = inlineState.get(panel);
+        inlineState.delete(panel);
+        adapt(panel, element, remembered);
+      }
+    }
+  };
+  let observed = null;
+  const resizeObserver = typeof globalThis.ResizeObserver === "function" ? new globalThis.ResizeObserver(() => sync()) : void 0;
+  const track = () => {
+    const workbench = findWorkbench();
+    if (workbench === observed) return false;
+    if (observed) resizeObserver?.unobserve(observed);
+    observed = workbench;
+    if (workbench) resizeObserver?.observe(workbench);
+    return true;
+  };
+  const mutationObserver = new MutationObserver((records) => {
+    if (track() || records.some((record) => record.type === "attributes"))
+      sync();
+  });
+  mutationObserver.observe(root, {
+    attributes: true,
+    attributeFilter: ["data-presentation", "data-responsive-overlay-at"],
+    childList: true,
+    subtree: true
+  });
+  const remProbe = ownerDocument.createElement("div");
+  remProbe.setAttribute("aria-hidden", "true");
+  remProbe.style.cssText = "position:absolute;width:1rem;height:0;overflow:hidden;visibility:hidden;pointer-events:none";
+  if (resizeObserver) {
+    ownerDocument.body.append(remProbe);
+    resizeObserver.observe(remProbe);
+  }
+  disposers.push(() => {
+    mutationObserver.disconnect();
+    resizeObserver?.disconnect();
+    remProbe.remove();
+  });
+  track();
+  sync();
+  for (const panel of panels) {
+    let previous = panel.collapsed.peek();
+    if (!previous) openOrder.push(panel);
+    disposers.push(
+      effect(() => {
+        const collapsed = panel.collapsed.value;
+        if (collapsed === previous) return;
+        previous = collapsed;
+        const index = openOrder.indexOf(panel);
+        if (index >= 0) openOrder.splice(index, 1);
+        if (collapsed) {
+          const active2 = ownerDocument.activeElement;
+          const element2 = panelElement(panel);
+          if (element2?.contains(active2) || // The panel's own control closed it (focused or not), so hand
+          // focus to the control that reopens it.
+          activated !== void 0 && element2?.contains(activated) || pressedFocus === panel && (active2 === null || active2 === ownerDocument.body))
+            rescueFocus(panel);
+          return;
+        }
+        openOrder.push(panel);
+        const element = panelElement(panel);
+        const active = ownerDocument.activeElement;
+        if (active instanceof HTMLElement && active !== ownerDocument.body && !element?.contains(active))
+          openers.set(panel, active);
+        else openers.delete(panel);
+        const toggle = openers.get(panel) ?? (activated && element && namesPanel(activated, element.id) ? activated : void 0);
+        if (toggle) {
+          const handOff = (frames) => {
+            const focused = ownerDocument.activeElement;
+            if (panel.collapsed.peek()) return;
+            if (toggle.isConnected) {
+              if (toggle === focused && frames > 0)
+                globalThis.requestAnimationFrame(() => handOff(frames - 1));
+              return;
+            }
+            if (focused !== null && focused !== ownerDocument.body) return;
+            const current = panelElement(panel);
+            if (current) controlInside(current)?.focus({ preventScroll: true });
+          };
+          globalThis.queueMicrotask(() => handOff(5));
+        }
+        if (!element || !overlaid(element)) return;
+        if (exclusive) {
+          for (const [other] of openOverlays())
+            if (other !== panel) other.collapsed.value = true;
+        }
+        (focusables(element)[0] ?? element).focus({ preventScroll: true });
+      })
+    );
+  }
+  const openOverlays = () => openOrder.flatMap((panel) => {
+    const element = panelElement(panel);
+    return !panel.collapsed.peek() && element && overlaid(element) ? [[panel, element]] : [];
+  });
+  const onKeydown = (event) => {
+    if (event.key !== "Escape" && event.key !== "Tab" || event.defaultPrevented)
+      return;
+    const open = openOverlays();
+    if (open.length === 0) return;
+    const active = ownerDocument.activeElement;
+    const [panel, element] = open.find(([, candidate]) => candidate.contains(active)) ?? open[open.length - 1];
+    if (event.key === "Escape") {
+      event.preventDefault();
+      panel.collapsed.value = true;
+      return;
+    }
+    const items = focusables(element);
+    if (items.length === 0) return;
+    const first = items[0];
+    const last = items[items.length - 1];
+    const inside = element.contains(active);
+    if (event.shiftKey && (!inside || active === first)) {
+      event.preventDefault();
+      last.focus();
+    } else if (!event.shiftKey && (!inside || active === last)) {
+      event.preventDefault();
+      first.focus();
+    }
+  };
+  let pressed = [];
+  const onPointerdown = (event) => {
+    const path = event.composedPath();
+    pressed = openOverlays().filter(([, element]) => !path.includes(element)).map(([panel]) => panel);
+    const active = ownerDocument.activeElement;
+    pressedFocus = panels.find((panel) => {
+      if (panel.collapsed.peek()) return false;
+      const element = panelElement(panel);
+      return !!element && path.includes(element) && element.contains(active);
+    });
+  };
+  const onFocusin = () => {
+    pressedFocus = void 0;
+  };
+  const onClick = (event) => {
+    const candidates = pressed;
+    pressed = [];
+    const path = event.composedPath();
+    for (const [panel, element] of openOverlays())
+      if (candidates.includes(panel) && !path.includes(element))
+        panel.collapsed.value = true;
+  };
+  const onActivate = (event) => {
+    const target = event.target;
+    const control = target instanceof Element ? target.closest("[aria-controls]") : null;
+    if (!control) return;
+    activated = control;
+    globalThis.requestAnimationFrame(
+      () => globalThis.requestAnimationFrame(() => {
+        if (activated === control) activated = void 0;
+      })
+    );
+  };
+  ownerDocument.addEventListener("keydown", onKeydown);
+  ownerDocument.addEventListener("pointerdown", onPointerdown, true);
+  ownerDocument.addEventListener("click", onActivate, true);
+  ownerDocument.addEventListener("click", onClick);
+  ownerDocument.addEventListener("focusin", onFocusin, true);
+  disposers.push(() => {
+    ownerDocument.removeEventListener("keydown", onKeydown);
+    ownerDocument.removeEventListener("pointerdown", onPointerdown, true);
+    ownerDocument.removeEventListener("click", onActivate, true);
+    ownerDocument.removeEventListener("click", onClick);
+    ownerDocument.removeEventListener("focusin", onFocusin, true);
+  });
+  return () => {
+    for (const dispose of disposers.splice(0)) dispose();
+    for (const [panel, remembered] of inlineState) {
+      const element = panelElement(panel);
+      if (element) adapt(panel, element, remembered);
+      else panel.collapsed.value = remembered;
+    }
+    inlineState.clear();
+  };
+}
+
+// src/wire-workbench.ts
+function defaultStorage() {
+  try {
+    return globalThis.localStorage ?? void 0;
+  } catch {
+    return void 0;
+  }
+}
+function storedSize(text) {
+  if (text === null) return void 0;
+  const size = Number(text);
+  return Number.isFinite(size) && size > 0 ? Math.round(size) : void 0;
+}
+var quoted = (value) => `"${value.replaceAll("\\", "\\\\").replaceAll('"', '\\"')}"`;
+var px = (value) => Number.parseFloat(value) || 0;
+var mainRoomLimit = (region, { max }) => {
+  const horizontal = region.dataset.axis === "horizontal";
+  const container = region.parentElement;
+  const workbench = horizontal ? container : container?.parentElement;
+  const mainMin = Number(
+    horizontal ? workbench?.dataset.mainMinSize : workbench?.dataset.mainMinHeight
+  );
+  if (!container || !(mainMin > 0)) return max;
+  const box = container.getBoundingClientRect();
+  const room = horizontal ? box.width : box.height;
+  if (room <= 0) return max;
+  let others = 0;
+  if (horizontal)
+    for (const rail of container.children) {
+      if (rail === region || !rail.matches(".kui-workbench__rail") || globalThis.getComputedStyle(rail).position === "absolute")
+        continue;
+      others += rail.getBoundingClientRect().width;
+    }
+  const style = globalThis.getComputedStyle(region);
+  const size = px(region.style.getPropertyValue("--kui-resizable-region-size"));
+  const border = style.boxSizing === "border-box" ? 0 : horizontal ? px(style.borderInlineStartWidth) + px(style.borderInlineEndWidth) : px(style.borderBlockStartWidth) + px(style.borderBlockEndWidth);
+  const extent = px(style.flexBasis) - size + border;
+  return Math.floor(room - Math.min(mainMin, room) - others - extent);
+};
+function wireWorkbench(root, {
+  id,
+  panels,
+  deviceClass,
+  storage = defaultStorage(),
+  step,
+  largeStep,
+  onResize,
+  dismissOverlays = true,
+  exclusiveOverlays = true
+}) {
+  const keys = Object.keys(panels);
+  const entries = keys.flatMap((key) => {
+    const size = panels[key]?.size;
+    return size ? [
+      {
+        key,
+        size,
+        storageKey: panels[key].storageKey,
+        regionId: workbenchRegionId(id, key)
+      }
+    ] : [];
+  });
+  const byRegion = new Map(entries.map((entry) => [entry.regionId, entry]));
+  const disposers = [];
+  for (const { size, storageKey } of entries) {
+    if (!storageKey || !storage) continue;
+    const seed = storedSize(storage.getItem(storageKey));
+    if (seed !== void 0) size.value = seed;
+    disposers.push(
+      effect(() => {
+        storage.setItem(storageKey, String(size.value));
+      })
+    );
+  }
+  const selector = entries.map(
+    ({ regionId }) => `[data-resizable="true"][data-region-id=${quoted(regionId)}]`
+  ).join(", ");
+  const start = () => wireResizeHandles(
+    root,
+    {
+      step,
+      largeStep,
+      onCommit: ({ id: regionId, size, source }) => {
+        const entry = byRegion.get(regionId);
+        entry.size.value = size;
+        onResize?.({ panel: entry.key, size, source });
+      }
+    },
+    selector,
+    mainRoomLimit
+  );
+  let stopResize;
+  if (selector) {
+    if (deviceClass) {
+      disposers.push(
+        effect(() => {
+          const compact = deviceClass.value.compact;
+          stopResize?.();
+          stopResize = compact ? void 0 : start();
+        })
+      );
+    } else {
+      stopResize = start();
+    }
+  }
+  const overlayPanels = keys.flatMap((key) => {
+    const collapsed = panels[key]?.collapsed;
+    return collapsed ? [{ key, collapsed }] : [];
+  });
+  if (dismissOverlays && overlayPanels.length > 0) {
+    const selector2 = `[data-component="workbench"][id=${quoted(id)}]`;
+    disposers.push(
+      wireWorkbenchOverlays(
+        root,
+        () => root.matches(selector2) ? root : root.querySelector(selector2),
+        overlayPanels,
+        exclusiveOverlays
+      )
+    );
+  }
+  return () => {
+    stopResize?.();
+    stopResize = void 0;
+    for (const dispose of disposers.splice(0)) dispose();
+  };
+}
+
+export { wireWorkbench };
+
+//# sourceMappingURL=chunk-NNMLEDMD.js.map

package/dist/chunk-NNMLEDMD.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/workbench-overlays.ts","../src/wire-workbench.ts"],"names":["active","element","effect","selector"],"mappings":"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","file":"chunk-NNMLEDMD.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   * The `aria-controls` control a click just activated, kept for a couple of\n   * frames: the toggle a panel opens or closes from, even once the app's\n   * render has removed it.\n   */\n  let activated: HTMLElement | 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  /** Whether a control's `aria-controls` (always present) names panel `id`. */\n  const namesPanel = (control: Element, id: string): boolean =>\n    control.getAttribute('aria-controls')!.split(/\\s+/).includes(id);\n  /** The panel's own control for itself: its toggle inside it. */\n  const controlInside = (element: HTMLElement): HTMLElement | undefined =>\n    [...element.querySelectorAll<HTMLElement>('[aria-controls]')].find(\n      (control) =>\n        control.matches(FOCUSABLE) && namesPanel(control, element.id),\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  // The breakpoints are in rem, so a root font-size change (a text-size\n  // setting applied after load) moves a panel across them without resizing\n  // the Workbench. A 1rem probe outside the app's tree reports that change.\n  const remProbe = ownerDocument.createElement('div');\n  remProbe.setAttribute('aria-hidden', 'true');\n  remProbe.style.cssText =\n    'position:absolute;width:1rem;height:0;overflow:hidden;visibility:hidden;pointer-events:none';\n  if (resizeObserver) {\n    ownerDocument.body.append(remProbe);\n    resizeObserver.observe(remProbe);\n  }\n  disposers.push(() => {\n    mutationObserver.disconnect();\n    resizeObserver?.disconnect();\n    remProbe.remove();\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          const element = panelElement(panel);\n          if (\n            element?.contains(active) ||\n            // The panel's own control closed it (focused or not), so hand\n            // focus to the control that reopens it.\n            (activated !== undefined && element?.contains(activated)) ||\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        // A focused toggle the app's render removes as the panel opens — a\n        // Workbench toolbar toggle leaves the work-area toolbar for the\n        // panel's own — would drop focus to the body. Hand it to the panel's\n        // own control for it, so a keyboard user keeps their place. The\n        // render may land before this effect (the toggle is gone already, so\n        // the activated control stands in for the opener) or after it, in a\n        // microtask or a later frame.\n        const toggle =\n          openers.get(panel) ??\n          (activated && element && namesPanel(activated, element.id)\n            ? activated\n            : undefined);\n        if (toggle) {\n          const handOff = (frames: number): void => {\n            const focused = ownerDocument.activeElement;\n            if (panel.collapsed.peek()) return;\n            if (toggle.isConnected) {\n              if (toggle === focused && frames > 0)\n                globalThis.requestAnimationFrame(() => handOff(frames - 1));\n              return;\n            }\n            if (focused !== null && focused !== ownerDocument.body) return;\n            const current = panelElement(panel);\n            if (current) controlInside(current)?.focus({ preventScroll: true });\n          };\n          globalThis.queueMicrotask(() => handOff(5));\n        }\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  const onActivate = (event: MouseEvent): void => {\n    const target = event.target;\n    const control =\n      target instanceof Element\n        ? target.closest<HTMLElement>('[aria-controls]')\n        : null;\n    // Recorded whether or not it took focus: Safari and macOS WebKit never\n    // focus a clicked button.\n    if (!control) return;\n    activated = control;\n    // The collapse effect may run after the click's dispatch (the app can\n    // batch its write), so keep the control for a couple of frames.\n    globalThis.requestAnimationFrame(() =>\n      globalThis.requestAnimationFrame(() => {\n        if (activated === control) activated = undefined;\n      }),\n    );\n  };\n  ownerDocument.addEventListener('keydown', onKeydown);\n  ownerDocument.addEventListener('pointerdown', onPointerdown, true);\n  ownerDocument.addEventListener('click', onActivate, 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', onActivate, 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"]}

package/dist/chunk-NYL63PSD.js

@@ -0,0 +1,95 @@
+import { Pane } from './chunk-EZVNC4J6.js';
+import { isRelocatableGroup, ToolbarControlGroup } from './chunk-7JUBXOIV.js';
+import { Toolbar } from './chunk-MERWRTBG.js';
+import { LucideIcon } from './chunk-4R777DUZ.js';
+import { PanelLeftOpen, PanelLeftClose, PanelRightOpen, PanelRightClose, PanelBottomOpen, PanelBottomClose } from 'lucide';
+import { jsx, jsxs, Fragment } from 'kerfjs/jsx-runtime';
+
+function collapsiblePanelToggleIcon(side, collapsed) {
+  if (side === "left")
+    return collapsed ? { icon: PanelLeftOpen, name: "panel-left-open" } : { icon: PanelLeftClose, name: "panel-left-close" };
+  if (side === "right")
+    return collapsed ? { icon: PanelRightOpen, name: "panel-right-open" } : { icon: PanelRightClose, name: "panel-right-close" };
+  return collapsed ? { icon: PanelBottomOpen, name: "panel-bottom-open" } : { icon: PanelBottomClose, name: "panel-bottom-close" };
+}
+function panelToggleGroup(side, toggle, collapsed, attributes) {
+  const glyph = collapsiblePanelToggleIcon(side, collapsed);
+  return /* @__PURE__ */ jsx(ToolbarControlGroup, { label: toggle.name, appearance: "borderless", single: true, children: /* @__PURE__ */ jsx(
+    "button",
+    {
+      type: "button",
+      ...attributes,
+      "data-action": toggle.action,
+      "aria-expanded": String(!collapsed),
+      "aria-label": collapsed ? toggle.showLabel ?? `Show ${toggle.name}` : toggle.hideLabel ?? `Hide ${toggle.name}`,
+      children: /* @__PURE__ */ jsx(LucideIcon, { icon: glyph.icon, name: glyph.name })
+    }
+  ) });
+}
+function composedPanelToolbar(toolbar, side, collapsed, attributes) {
+  return /* @__PURE__ */ jsx(
+    Toolbar,
+    {
+      label: toolbar.label,
+      dividerSides: toolbar.dividerSides,
+      centerAlign: toolbar.centerAlign,
+      responsive: toolbar.responsive,
+      responsiveAt: toolbar.responsiveAt,
+      safeAreaEdges: toolbar.safeAreaEdges,
+      center: toolbar.center,
+      leading: /* @__PURE__ */ jsxs(Fragment, { children: [
+        toolbar.title,
+        toolbar.leading
+      ] }),
+      trailing: /* @__PURE__ */ jsxs(Fragment, { children: [
+        toolbar.trailing,
+        toolbar.toggle ? panelToggleGroup(side, toolbar.toggle, collapsed, attributes) : null
+      ] })
+    }
+  );
+}
+function composedPanelBody({
+  toolbar,
+  side,
+  collapsed,
+  attributes,
+  pane,
+  footer,
+  content
+}) {
+  return /* @__PURE__ */ jsx(
+    Pane,
+    {
+      header: composedPanelToolbar(toolbar, side, collapsed, attributes),
+      footer,
+      contentElement: pane?.contentElement,
+      contentLabel: pane?.contentLabel,
+      separators: pane?.separators,
+      safeAreaEdges: pane?.safeAreaEdges,
+      chromeDividers: pane?.chromeDividers,
+      children: content
+    }
+  );
+}
+function relocatedPanelGroups(toolbar, side, collapsed, attributes) {
+  if (!collapsed || !toolbar) return [];
+  const groups = [];
+  const collect = (content) => {
+    if (Array.isArray(content)) {
+      for (const item of content) collect(item);
+    } else if (isRelocatableGroup(content)) {
+      groups.push(content);
+    }
+  };
+  collect(toolbar.leading);
+  collect(toolbar.center);
+  collect(toolbar.trailing);
+  return [
+    ...groups,
+    toolbar.toggle ? panelToggleGroup(side, toolbar.toggle, true, attributes) : null
+  ].filter((group) => group !== void 0 && group !== null && group !== false);
+}
+
+export { collapsiblePanelToggleIcon, composedPanelBody, relocatedPanelGroups };
+
+//# sourceMappingURL=chunk-NYL63PSD.js.map

package/dist/chunk-NYL63PSD.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/panel-toolbar.tsx"],"names":[],"mappings":";;;;;;;AA2BO,SAAS,0BAAA,CACd,MACA,SAAA,EACkE;AAClE,EAAA,IAAI,IAAA,KAAS,MAAA;AACX,IAAA,OAAO,SAAA,GACH,EAAE,IAAA,EAAM,aAAA,EAAe,IAAA,EAAM,iBAAA,EAAkB,GAC/C,EAAE,IAAA,EAAM,cAAA,EAAgB,IAAA,EAAM,kBAAA,EAAmB;AACvD,EAAA,IAAI,IAAA,KAAS,OAAA;AACX,IAAA,OAAO,SAAA,GACH,EAAE,IAAA,EAAM,cAAA,EAAgB,IAAA,EAAM,kBAAA,EAAmB,GACjD,EAAE,IAAA,EAAM,eAAA,EAAiB,IAAA,EAAM,mBAAA,EAAoB;AACzD,EAAA,OAAO,SAAA,GACH,EAAE,IAAA,EAAM,eAAA,EAAiB,IAAA,EAAM,mBAAA,EAAoB,GACnD,EAAE,IAAA,EAAM,gBAAA,EAAkB,IAAA,EAAM,oBAAA,EAAqB;AAC3D;AAoDO,SAAS,gBAAA,CACd,IAAA,EACA,MAAA,EACA,SAAA,EACA,UAAA,EACU;AACV,EAAA,MAAM,KAAA,GAAQ,0BAAA,CAA2B,IAAA,EAAM,SAAS,CAAA;AACxD,EAAA,uBACE,GAAA,CAAC,uBAAoB,KAAA,EAAO,MAAA,CAAO,MAAM,UAAA,EAAW,YAAA,EAAa,QAAM,IAAA,EACrE,QAAA,kBAAA,GAAA;AAAA,IAAC,QAAA;AAAA,IAAA;AAAA,MACC,IAAA,EAAK,QAAA;AAAA,MACJ,GAAG,UAAA;AAAA,MACJ,eAAa,MAAA,CAAO,MAAA;AAAA,MACpB,eAAA,EAAe,MAAA,CAAO,CAAC,SAAS,CAAA;AAAA,MAChC,YAAA,EACE,SAAA,GACK,MAAA,CAAO,SAAA,IAAa,CAAA,KAAA,EAAQ,MAAA,CAAO,IAAI,CAAA,CAAA,GACvC,MAAA,CAAO,SAAA,IAAa,CAAA,KAAA,EAAQ,MAAA,CAAO,IAAI,CAAA,CAAA;AAAA,MAG9C,8BAAC,UAAA,EAAA,EAAW,IAAA,EAAM,MAAM,IAAA,EAAM,IAAA,EAAM,MAAM,IAAA,EAAM;AAAA;AAAA,GAClD,EACF,CAAA;AAEJ;AAKO,SAAS,oBAAA,CACd,OAAA,EACA,IAAA,EACA,SAAA,EACA,UAAA,EACU;AACV,EAAA,uBACE,GAAA;AAAA,IAAC,OAAA;AAAA,IAAA;AAAA,MACC,OAAO,OAAA,CAAQ,KAAA;AAAA,MACf,cAAc,OAAA,CAAQ,YAAA;AAAA,MACtB,aAAa,OAAA,CAAQ,WAAA;AAAA,MACrB,YAAY,OAAA,CAAQ,UAAA;AAAA,MACpB,cAAc,OAAA,CAAQ,YAAA;AAAA,MACtB,eAAe,OAAA,CAAQ,aAAA;AAAA,MACvB,QAAQ,OAAA,CAAQ,MAAA;AAAA,MAChB,yBACE,IAAA,CAAA,QAAA,EAAA,EACG,QAAA,EAAA;AAAA,QAAA,OAAA,CAAQ,KAAA;AAAA,QACR,OAAA,CAAQ;AAAA,OAAA,EACX,CAAA;AAAA,MAEF,0BACE,IAAA,CAAA,QAAA,EAAA,EACG,QAAA,EAAA;AAAA,QAAA,OAAA,CAAQ,QAAA;AAAA,QACR,OAAA,CAAQ,SACL,gBAAA,CAAiB,IAAA,EAAM,QAAQ,MAAA,EAAQ,SAAA,EAAW,UAAU,CAAA,GAC5D;AAAA,OAAA,EACN;AAAA;AAAA,GAEJ;AAEJ;AAOO,SAAS,iBAAA,CAAkB;AAAA,EAChC,OAAA;AAAA,EACA,IAAA;AAAA,EACA,SAAA;AAAA,EACA,UAAA;AAAA,EACA,IAAA;AAAA,EACA,MAAA;AAAA,EACA;AACF,CAAA,EAQa;AACX,EAAA,uBACE,GAAA;AAAA,IAAC,IAAA;AAAA,IAAA;AAAA,MACC,MAAA,EAAQ,oBAAA,CAAqB,OAAA,EAAS,IAAA,EAAM,WAAW,UAAU,CAAA;AAAA,MACjE,MAAA;AAAA,MACA,gBAAgB,IAAA,EAAM,cAAA;AAAA,MACtB,cAAc,IAAA,EAAM,YAAA;AAAA,MACpB,YAAY,IAAA,EAAM,UAAA;AAAA,MAClB,eAAe,IAAA,EAAM,aAAA;AAAA,MACrB,gBAAgB,IAAA,EAAM,cAAA;AAAA,MAErB,QAAA,EAAA;AAAA;AAAA,GACH;AAEJ;AAMO,SAAS,oBAAA,CACd,OAAA,EACA,IAAA,EACA,SAAA,EACA,UAAA,EACiB;AACjB,EAAA,IAAI,CAAC,SAAA,IAAa,CAAC,OAAA,SAAgB,EAAC;AACpC,EAAA,MAAM,SAA0B,EAAC;AACjC,EAAA,MAAM,OAAA,GAAU,CAAC,OAAA,KAAiC;AAChD,IAAA,IAAI,KAAA,CAAM,OAAA,CAAQ,OAAO,CAAA,EAAG;AAC1B,MAAA,KAAA,MAAW,IAAA,IAAQ,OAAA,EAAS,OAAA,CAAQ,IAAI,CAAA;AAAA,IAC1C,CAAA,MAAA,IAAW,kBAAA,CAAmB,OAAO,CAAA,EAAG;AACtC,MAAA,MAAA,CAAO,KAAK,OAAO,CAAA;AAAA,IACrB;AAAA,EACF,CAAA;AACA,EAAA,OAAA,CAAQ,QAAQ,OAAO,CAAA;AACvB,EAAA,OAAA,CAAQ,QAAQ,MAAM,CAAA;AACtB,EAAA,OAAA,CAAQ,QAAQ,QAAQ,CAAA;AACxB,EAAA,OAAO;AAAA,IACL,GAAG,MAAA;AAAA,IACH,OAAA,CAAQ,SACJ,gBAAA,CAAiB,IAAA,EAAM,QAAQ,MAAA,EAAQ,IAAA,EAAM,UAAU,CAAA,GACvD;AAAA,GACN,CAAE,OAAO,CAAC,KAAA,KAAU,UAAU,MAAA,IAAa,KAAA,KAAU,IAAA,IAAQ,KAAA,KAAU,KAAK,CAAA;AAC9E","file":"chunk-NYL63PSD.js","sourcesContent":["import type { SafeHtml } from 'kerfjs';\nimport {\n  PanelBottomClose,\n  PanelBottomOpen,\n  PanelLeftClose,\n  PanelLeftOpen,\n  PanelRightClose,\n  PanelRightOpen,\n} from 'lucide';\n\nimport { LucideIcon } from './lucide-icon.js';\nimport { Pane, type PaneConfig } from './pane.js';\nimport { isRelocatableGroup } from './panel-toolbar-group.js';\nimport type { KerfUiContent } from './semantic-content.js';\nimport { Toolbar, type ToolbarConfig } from './toolbar.js';\nimport { ToolbarControlGroup } from './toolbar-control-group.js';\n\n/** Which edge a collapsible panel docks to. */\nexport type PanelSide = 'left' | 'right' | 'bottom';\n\n/**\n * The standard collapse/expand icon for a panel `side` and `collapsed` state,\n * so every app's sidebars and drawers use one recognizable convention:\n * `PanelLeft*` for a left rail, `PanelRight*` for a right rail, `PanelBottom*`\n * for a bottom drawer — the `Close` glyph while open, the `Open` glyph while\n * collapsed. Exposed so an app can render its own toggle affordance.\n */\nexport function collapsiblePanelToggleIcon(\n  side: PanelSide,\n  collapsed: boolean,\n): { icon: Parameters<typeof LucideIcon>[0]['icon']; name: string } {\n  if (side === 'left')\n    return collapsed\n      ? { icon: PanelLeftOpen, name: 'panel-left-open' }\n      : { icon: PanelLeftClose, name: 'panel-left-close' };\n  if (side === 'right')\n    return collapsed\n      ? { icon: PanelRightOpen, name: 'panel-right-open' }\n      : { icon: PanelRightClose, name: 'panel-right-close' };\n  return collapsed\n    ? { icon: PanelBottomOpen, name: 'panel-bottom-open' }\n    : { icon: PanelBottomClose, name: 'panel-bottom-close' };\n}\n\n/**\n * The standard collapse toggle a panel toolbar renders. The app handles the\n * button's `data-action` and flips its own `collapsed` flag.\n */\nexport interface PanelToggle {\n  /** The `data-action` the toggle button carries. */\n  action: string;\n  /** The panel's short name, for the accessible \"Show …\" / \"Hide …\" label. */\n  name: string;\n  /** Accessible label while the panel is collapsed. Defaults to `Show {name}`. */\n  showLabel?: string;\n  /** Accessible label while the panel is open. Defaults to `Hide {name}`. */\n  hideLabel?: string;\n}\n\n/**\n * A collapsible panel's top toolbar, composed so its groups follow the\n * panel's open state.\n *\n * - `title` precedes the `leading` zone. Groups may appear in any of the\n *   `leading`, `center`, and `trailing` zones while the panel is open.\n * - Groups marked `relocateOnCollapse` move to the work area's toolbar while\n *   the panel is collapsed, preserving their order across the three zones.\n * - `toggle` is always the last group: in the panel's toolbar while it is\n *   open, and right after the relocated groups in the work area's toolbar\n *   while it is collapsed.\n *\n * Relocated content renders in both places while the panel is collapsed (the\n * panel's copy is inert), so give it no `id`s. Pass groups directly or in\n * arrays so their render-time annotation remains available to the panel.\n *\n * The toolbar's configuration (`dividerSides`, `centerAlign`, `responsive`,\n * `responsiveAt`, `safeAreaEdges`) forwards to its `Toolbar`. It draws no\n * divider of its own: the panel's `Pane` draws the line under it while the\n * content is scrolled (its `chromeDividers`, wired by `wireScrollDividers`).\n */\nexport interface PanelToolbar extends ToolbarConfig {\n  /** Accessible name of the panel's toolbar. */\n  label: string;\n  title?: KerfUiContent;\n  leading?: KerfUiContent;\n  center?: KerfUiContent;\n  trailing?: KerfUiContent;\n  toggle?: PanelToggle;\n}\n\n/** Owner-specific attributes a toggle button carries (its wiring hooks). */\nexport type PanelToggleAttributes = Readonly<Record<string, string>>;\n\n/** The standard toggle, alone in a borderless group. */\nexport function panelToggleGroup(\n  side: PanelSide,\n  toggle: PanelToggle,\n  collapsed: boolean,\n  attributes: PanelToggleAttributes,\n): SafeHtml {\n  const glyph = collapsiblePanelToggleIcon(side, collapsed);\n  return (\n    <ToolbarControlGroup label={toggle.name} appearance=\"borderless\" single>\n      <button\n        type=\"button\"\n        {...attributes}\n        data-action={toggle.action}\n        aria-expanded={String(!collapsed)}\n        aria-label={\n          collapsed\n            ? (toggle.showLabel ?? `Show ${toggle.name}`)\n            : (toggle.hideLabel ?? `Hide ${toggle.name}`)\n        }\n      >\n        <LucideIcon icon={glyph.icon} name={glyph.name} />\n      </button>\n    </ToolbarControlGroup>\n  );\n}\n\n/**\n * The panel's own toolbar: content keeps its chosen zones and the toggle trails.\n */\nexport function composedPanelToolbar(\n  toolbar: PanelToolbar,\n  side: PanelSide,\n  collapsed: boolean,\n  attributes: PanelToggleAttributes,\n): SafeHtml {\n  return (\n    <Toolbar\n      label={toolbar.label}\n      dividerSides={toolbar.dividerSides}\n      centerAlign={toolbar.centerAlign}\n      responsive={toolbar.responsive}\n      responsiveAt={toolbar.responsiveAt}\n      safeAreaEdges={toolbar.safeAreaEdges}\n      center={toolbar.center}\n      leading={\n        <>\n          {toolbar.title}\n          {toolbar.leading}\n        </>\n      }\n      trailing={\n        <>\n          {toolbar.trailing}\n          {toolbar.toggle\n            ? panelToggleGroup(side, toolbar.toggle, collapsed, attributes)\n            : null}\n        </>\n      }\n    />\n  );\n}\n\n/**\n * A toolbar panel's body: its content in a `Pane` under its composed toolbar,\n * with its optional `footer` below. The panel's `pane` configuration forwards\n * to that `Pane`; an omitted or `undefined` field keeps the `Pane` default.\n */\nexport function composedPanelBody({\n  toolbar,\n  side,\n  collapsed,\n  attributes,\n  pane,\n  footer,\n  content,\n}: {\n  toolbar: PanelToolbar;\n  side: PanelSide;\n  collapsed: boolean;\n  attributes: PanelToggleAttributes;\n  pane: PaneConfig | undefined;\n  footer: KerfUiContent;\n  content: KerfUiContent;\n}): SafeHtml {\n  return (\n    <Pane\n      header={composedPanelToolbar(toolbar, side, collapsed, attributes)}\n      footer={footer}\n      contentElement={pane?.contentElement}\n      contentLabel={pane?.contentLabel}\n      separators={pane?.separators}\n      safeAreaEdges={pane?.safeAreaEdges}\n      chromeDividers={pane?.chromeDividers}\n    >\n      {content}\n    </Pane>\n  );\n}\n\n/**\n * The groups a collapsed panel hands to the work area, in zone order, then its\n * toggle. Empty while the panel is open or has no toolbar.\n */\nexport function relocatedPanelGroups(\n  toolbar: PanelToolbar | undefined,\n  side: PanelSide,\n  collapsed: boolean,\n  attributes: PanelToggleAttributes,\n): KerfUiContent[] {\n  if (!collapsed || !toolbar) return [];\n  const groups: KerfUiContent[] = [];\n  const collect = (content: KerfUiContent): void => {\n    if (Array.isArray(content)) {\n      for (const item of content) collect(item);\n    } else if (isRelocatableGroup(content)) {\n      groups.push(content);\n    }\n  };\n  collect(toolbar.leading);\n  collect(toolbar.center);\n  collect(toolbar.trailing);\n  return [\n    ...groups,\n    toolbar.toggle\n      ? panelToggleGroup(side, toolbar.toggle, true, attributes)\n      : null,\n  ].filter((group) => group !== undefined && group !== null && group !== false);\n}\n"]}