@kerfjs/ui 5.0.0-beta.9 → 5.0.0-beta.90

package/dist/chunk-O27D24CA.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/integrations/webawesome/help-tags/install-help-tag.ts"],"names":[],"mappings":"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","file":"chunk-O27D24CA.js","sourcesContent":["// Hover and keyboard-focus help tags for icon-only controls.\n//\n// An icon-only `Select` (single `selectedPresentation=\"icon-only\"` or the\n// multiple `triggerIcon` filter), an icon-only `PopupMenu` (a `label` instead\n// of visible `text`), and an icon-only `<button>` or link inside a\n// `ToolbarControlGroup` (named only by `aria-label`) carry their purpose — and\n// a Select its current choice — only in the accessible name. Sighted pointer\n// and keyboard users see just the icon, so the registration boundary shows a\n// Web Awesome `wa-tooltip` naming the control (Apple HIG \"help tag\"):\n//\n// - after a short hover delay, or immediately when a previous tag just closed\n//   (moving along a toolbar), and at once on keyboard (`:focus-visible`) focus;\n// - never while the control's popup is open, and not again after a press or\n//   Escape until the pointer or focus leaves and returns;\n// - with the same text the accessible name already announces, so the tag is\n//   `aria-hidden` and never joins the control's `aria-labelledby` (a manual\n//   trigger with a programmatic anchor, not `for`, so Web Awesome does not\n//   add it) — assistive technology hears the name once.\n//\n// A Select's or PopupMenu's tag lives in the control's open shadow root, so\n// the morph never sees it, `:has([open])` selectors on the light DOM ignore\n// it, and it inherits the control's theme. A plain button cannot host a shadow\n// root, so its tag lives in one body-level layer (re-attached if a body morph\n// drops it, and removed again once hidden) and copies the button's\n// `color-scheme`; the tag's Popover-API popup renders in the top layer, so its\n// place in the document does not affect where or above what it shows. A\n// button that already has a native `title`, or a Web Awesome tooltip `for` it,\n// keeps that and gets no second tag. Each tag's own lifecycle events stop at\n// the tag so an application listening for the control's `wa-show` / `wa-hide`\n// never hears the tag's.\n\n/** Hover delay before a help tag appears. */\nexport const HELP_TAG_SHOW_DELAY = 500;\n/** After a tag closes, a neighboring trigger shows its tag at once for this long. */\nexport const HELP_TAG_WARM_WINDOW = 400;\n/** A tag shifted inward stays this far from the viewport edge. */\nexport const HELP_TAG_VIEWPORT_MARGIN = 8;\n\ninterface HelpTagHost extends HTMLElement {\n  open?: boolean;\n  selectedOptions?: readonly (HTMLElement & { label?: string })[];\n}\n\ninterface HelpTag extends HTMLElement {\n  open: boolean;\n  readonly updateComplete: Promise<unknown>;\n  anchor: Element | null;\n  trigger: string;\n  placement: string;\n}\n\nexport interface HelpTagOptions {\n  /** Whether a newly focused element shows keyboard focus. */\n  focusVisible?: (element: Element) => boolean;\n}\n\nconst LIFECYCLE_EVENTS = [\n  'wa-show',\n  'wa-after-show',\n  'wa-hide',\n  'wa-after-hide',\n] as const;\n\nconst installed = new WeakSet<Document>();\n\nfunction isFocusVisible(element: Element): boolean {\n  try {\n    return element.matches(':focus-visible');\n  } catch {\n    return false;\n  }\n}\n\nconst MENU_LABEL = ':scope > [slot=\"trigger\"] .kui-popup-menu__label';\n\n/** A plain control (not a Web Awesome popup host) gets a body-layer tag. */\nconst isPlainControl = (host: HelpTagHost): boolean =>\n  host.localName === 'button' || host.localName === 'a';\n\n/** An element's text with whitespace collapsed (an element's is never null). */\nconst words = (node: Element): string =>\n  (node.textContent as string).replace(/\\s+/g, ' ').trim();\n\n/** The trimmed `aria-label` of a plain control. */\nconst ariaLabel = (control: Element): string =>\n  (control.getAttribute('aria-label') ?? '').replace(/\\s+/g, ' ').trim();\n\n/**\n * An icon-only toolbar button or link: inside a `ToolbarControlGroup`, named\n * by `aria-label`, with no visible text, and without a native `title` or a Web\n * Awesome tooltip of its own that a second tag would duplicate.\n */\nfunction isToolbarIconControl(target: HTMLElement): boolean {\n  if (!target.matches('button, a[href]')) return false;\n  if (!ariaLabel(target) || target.hasAttribute('title') || words(target))\n    return false;\n  if (!target.closest('.kui-toolbar-control-group')) return false;\n  return !(\n    target.id &&\n    target.ownerDocument.querySelector(\n      `wa-tooltip[for=\"${CSS.escape(target.id)}\"]`,\n    )\n  );\n}\n\n/** The icon-only Kerf control on an event path, if any. */\nfunction helpTagHost(path: readonly EventTarget[]): HelpTagHost | null {\n  for (const target of path) {\n    if (!(target instanceof HTMLElement)) continue;\n    if (isToolbarIconControl(target)) return target;\n    const { component, selectedPresentation } = target.dataset;\n    if (\n      component === 'select' &&\n      target.localName === 'wa-select' &&\n      selectedPresentation === 'icon-only'\n    )\n      return target;\n    if (component === 'popup-menu' && target.querySelector(MENU_LABEL))\n      return target;\n  }\n  return null;\n}\n\n/** The visible trigger the tag describes and anchors to. */\nfunction anchorOf(host: HelpTagHost): Element | null {\n  if (isPlainControl(host)) return host;\n  if (host.dataset.component === 'select')\n    return host.shadowRoot?.querySelector('[part~=\"combobox\"]') ?? null;\n  return host.querySelector(':scope > [slot=\"trigger\"]');\n}\n\n/** The tag text: the same words as the trigger's accessible name. */\nfunction helpText(host: HelpTagHost): string {\n  if (isPlainControl(host)) return ariaLabel(host);\n  // An icon-only PopupMenu's visually hidden label, or a multiple icon\n  // trigger's label slot (it already ends with the chosen labels).\n  const label =\n    host.querySelector(MENU_LABEL) ??\n    host.querySelector(':scope > [slot=\"label\"]');\n  if (label) return words(label);\n  const name = host.getAttribute('label') ?? '';\n  const chosen = host.selectedOptions?.[0];\n  const choice = chosen ? chosen.label || words(chosen) : '';\n  return choice && choice !== name ? `${name}: ${choice}` : name;\n}\n\n/**\n * Install once at an explicit registration boundary. Idempotent per document.\n */\nexport function installHelpTags(\n  doc: Document = document,\n  { focusVisible = isFocusVisible }: HelpTagOptions = {},\n): void {\n  if (installed.has(doc)) return;\n  installed.add(doc);\n  const tags = new WeakMap<HelpTagHost, HelpTag>();\n  let hovered: HelpTagHost | null = null;\n  let focused: HelpTagHost | null = null;\n  // The trigger whose tag is open, with that tag.\n  let shown: { host: HelpTagHost; tag: HelpTag } | null = null;\n  // A press, Escape, or an opened popup suppresses that trigger's tag.\n  let dismissed: HelpTagHost | null = null;\n  let timer: number | undefined;\n  let warmUntil = 0;\n  let layer: HTMLElement | null = null;\n\n  // The body-level home of plain controls' tags. Its fixed, zero-size box\n  // keeps it out of a grid or flex body's flow; a body morph that drops it is\n  // repaired on the next show.\n  const layerRoot = (): HTMLElement => {\n    if (!layer) {\n      layer = doc.createElement('div');\n      layer.className = 'kui-help-tag-layer';\n      layer.setAttribute('aria-hidden', 'true');\n      layer.setAttribute('data-morph-skip', '');\n      Object.assign(layer.style, {\n        position: 'fixed',\n        top: '0',\n        left: '0',\n        width: '0',\n        height: '0',\n      });\n    }\n    if (!layer.isConnected) doc.body.append(layer);\n    return layer;\n  };\n\n  const tagFor = (host: HelpTagHost): HelpTag | null => {\n    const plain = isPlainControl(host);\n    const root = plain ? layerRoot() : host.shadowRoot;\n    if (!root) return null;\n    let tag = tags.get(host);\n    if (!tag) {\n      tag = doc.createElement('wa-tooltip') as HelpTag;\n      tag.className = 'kui-help-tag';\n      tag.setAttribute('aria-hidden', 'true');\n      tag.setAttribute('trigger', 'manual');\n      tag.setAttribute('placement', 'bottom');\n      tag.style.pointerEvents = 'none';\n      for (const type of LIFECYCLE_EVENTS)\n        tag.addEventListener(type, (event) => event.stopPropagation());\n      if (plain) {\n        // A hidden button tag leaves the layer, so tags for buttons that a\n        // re-render replaced never accumulate there.\n        const created = tag;\n        created.addEventListener('wa-after-hide', () => {\n          if (created.open) return;\n          created.remove();\n          tags.delete(host);\n        });\n      }\n      root.append(tag);\n      tags.set(host, tag);\n    }\n    return tag;\n  };\n\n  const hide = (host: HelpTagHost) => {\n    if (shown?.host !== host) return;\n    shown.tag.open = false;\n    shown = null;\n    warmUntil = Date.now() + HELP_TAG_WARM_WINDOW;\n  };\n\n  const show = (host: HelpTagHost) => {\n    window.clearTimeout(timer);\n    timer = undefined;\n    if (host.open || dismissed === host || !host.isConnected) return;\n    const anchor = anchorOf(host);\n    const text = helpText(host);\n    if (!anchor || !text) return;\n    const tag = tagFor(host);\n    if (!tag) return;\n    if (shown) hide(shown.host);\n    // A body-layer tag takes its button's light or dark scheme, which a\n    // subtree theme (`.wa-dark`) may set below the document root.\n    if (anchor === host)\n      tag.style.colorScheme = window.getComputedStyle(host).colorScheme;\n    tag.anchor = anchor;\n    tag.textContent = text;\n    tag.open = true;\n    shown = { host, tag };\n    // A new tag's first update resets `anchor` from its (null) `for`. Its\n    // popup also keeps the standard 8px clear of the viewport edge when it\n    // shifts a long tag inward (Web Awesome's tooltip leaves this at 0).\n    void tag.updateComplete.then(() => {\n      if (tag.anchor !== anchor) tag.anchor = anchor;\n      const popup = tag.shadowRoot?.querySelector<\n        HTMLElement & { shiftPadding: number }\n      >('wa-popup');\n      if (popup) popup.shiftPadding = HELP_TAG_VIEWPORT_MARGIN;\n    });\n  };\n\n  /** The tagged host whose trigger (not its popup) is on the path. */\n  const triggerHost = (event: Event): HelpTagHost | null => {\n    const path = event.composedPath();\n    const host = helpTagHost(path);\n    if (!host) return null;\n    const anchor = anchorOf(host);\n    return anchor && path.includes(anchor) ? host : null;\n  };\n\n  // A pending hover belongs to the hovered trigger; a tag stays while either\n  // the pointer or keyboard focus is still on its trigger.\n  const leave = (host: HelpTagHost) => {\n    if (hovered !== host) {\n      window.clearTimeout(timer);\n      timer = undefined;\n    }\n    if (hovered !== host && focused !== host) hide(host);\n  };\n\n  // A press, Escape, or an opened popup dismisses a trigger's tag until the\n  // pointer moves onto something else while the popup is closed, or focus\n  // leaves the control.\n  const release = (host: HelpTagHost | null) => {\n    if (dismissed && dismissed !== host && !dismissed.open) dismissed = null;\n  };\n\n  doc.addEventListener(\n    'pointerover',\n    (event) => {\n      if ((event as PointerEvent).pointerType === 'touch') return;\n      const host = triggerHost(event);\n      release(host);\n      if (host === hovered) return;\n      const previous = hovered;\n      hovered = host;\n      if (previous) leave(previous);\n      if (!host || host.open || dismissed === host || shown?.host === host)\n        return;\n      window.clearTimeout(timer);\n      if (Date.now() < warmUntil) show(host);\n      else timer = window.setTimeout(() => show(host), HELP_TAG_SHOW_DELAY);\n    },\n    true,\n  );\n\n  doc.addEventListener(\n    'pointerout',\n    (event) => {\n      // Leaving the window: nothing new is hovered.\n      if ((event as PointerEvent).relatedTarget !== null || !hovered) return;\n      const previous = hovered;\n      hovered = null;\n      leave(previous);\n    },\n    true,\n  );\n\n  // A pending hover show for this host re-checks the dismissal and no-ops.\n  const dismiss = (host: HelpTagHost) => {\n    dismissed = host;\n    hide(host);\n  };\n\n  doc.addEventListener(\n    'pointerdown',\n    (event) => {\n      const host = helpTagHost(event.composedPath());\n      if (host) dismiss(host);\n    },\n    true,\n  );\n\n  doc.addEventListener(\n    'focusin',\n    (event) => {\n      // Only keyboard focus (`:focus-visible`) shows a tag; a click focuses\n      // the trigger without one.\n      const target = event.composedPath()[0];\n      const host =\n        target instanceof Element && focusVisible(target)\n          ? triggerHost(event)\n          : null;\n      if (host === focused) return;\n      const previous = focused;\n      focused = host;\n      if (previous) leave(previous);\n      if (host && dismissed !== host) show(host);\n    },\n    true,\n  );\n\n  doc.addEventListener(\n    'focusout',\n    (event) => {\n      const host = helpTagHost(event.composedPath());\n      // Focus moving within the control (into its popup and back) is handled\n      // by focusin; only focus leaving the control ends a dismissal.\n      const next = (event as FocusEvent).relatedTarget;\n      if (!host || (next instanceof Node && host.contains(next))) return;\n      if (dismissed === host) dismissed = null;\n      if (host !== focused) return;\n      focused = null;\n      leave(host);\n    },\n    true,\n  );\n\n  doc.addEventListener(\n    'keydown',\n    (event) => {\n      if (event.key === 'Escape' && shown) dismiss(shown.host);\n    },\n    true,\n  );\n\n  // Opening the popup hides the tag: the menu itself now shows the choices.\n  doc.addEventListener(\n    'wa-show',\n    (event) => {\n      const host = helpTagHost(event.composedPath());\n      if (host && event.composedPath()[0] === host) dismiss(host);\n    },\n    true,\n  );\n\n  // Keep a visible tag's text in step with the selection.\n  const refresh = (event: Event) => {\n    const host = helpTagHost(event.composedPath());\n    if (shown && host === shown.host) shown.tag.textContent = helpText(host);\n  };\n  doc.addEventListener('change', refresh, true);\n  doc.addEventListener('input', refresh, true);\n}\n"]}

package/dist/chunk-PGL6TXFW.js

@@ -0,0 +1,48 @@
+import { Skeleton } from './chunk-Y43B6DS3.js';
+import { Badge } from './chunk-J3AWE5I4.js';
+import { em } from './chunk-U657IHFB.js';
+import { jsxs, jsx } from 'kerfjs/jsx-runtime';
+
+function StateBanner({
+  title,
+  detail,
+  badge,
+  icon,
+  action,
+  tone = "info",
+  urgency = "status",
+  copyLayout = "inline",
+  actionPlacement = "trailing",
+  className = "",
+  placeholder = false,
+  slot
+}) {
+  return /* @__PURE__ */ jsxs(
+    "section",
+    {
+      class: `kui-state-banner ${className}`.trim(),
+      "data-component": "state-banner",
+      "data-tone": tone,
+      "data-copy-layout": copyLayout,
+      "data-action-placement": actionPlacement,
+      "data-placeholder": placeholder ? "true" : void 0,
+      role: urgency,
+      "aria-live": urgency === "alert" ? "assertive" : "polite",
+      "aria-busy": placeholder ? "true" : void 0,
+      slot,
+      children: [
+        icon && /* @__PURE__ */ jsx("span", { class: "kui-state-banner__icon", children: icon }),
+        /* @__PURE__ */ jsxs("div", { class: "kui-state-banner__copy", children: [
+          /* @__PURE__ */ jsx("strong", { children: placeholder ? /* @__PURE__ */ jsx(Skeleton, { width: em(10) }) : title }),
+          badge && /* @__PURE__ */ jsx(Badge, { appearance: "solid", size: "compact", tone, children: placeholder ? /* @__PURE__ */ jsx(Skeleton, { width: em(1.75) }) : badge }),
+          detail && /* @__PURE__ */ jsx("span", { class: "kui-state-banner__detail", children: /* @__PURE__ */ jsx("span", { children: placeholder ? /* @__PURE__ */ jsx(Skeleton, { width: em(16) }) : detail }) })
+        ] }),
+        action && /* @__PURE__ */ jsx("div", { class: "kui-state-banner__action", children: action })
+      ]
+    }
+  );
+}
+
+export { StateBanner };
+
+//# sourceMappingURL=chunk-PGL6TXFW.js.map

package/dist/chunk-PGL6TXFW.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/feedback/state-banner/state-banner.tsx"],"names":[],"mappings":";;;;;AAmCO,SAAS,WAAA,CAAY;AAAA,EAC1B,KAAA;AAAA,EACA,MAAA;AAAA,EACA,KAAA;AAAA,EACA,IAAA;AAAA,EACA,MAAA;AAAA,EACA,IAAA,GAAO,MAAA;AAAA,EACP,OAAA,GAAU,QAAA;AAAA,EACV,UAAA,GAAa,QAAA;AAAA,EACb,eAAA,GAAkB,UAAA;AAAA,EAClB,SAAA,GAAY,EAAA;AAAA,EACZ,WAAA,GAAc,KAAA;AAAA,EACd;AACF,CAAA,EAAqB;AACnB,EAAA,uBACE,IAAA;AAAA,IAAC,SAAA;AAAA,IAAA;AAAA,MACC,KAAA,EAAO,CAAA,iBAAA,EAAoB,SAAS,CAAA,CAAA,CAAG,IAAA,EAAK;AAAA,MAC5C,gBAAA,EAAe,cAAA;AAAA,MACf,WAAA,EAAW,IAAA;AAAA,MACX,kBAAA,EAAkB,UAAA;AAAA,MAClB,uBAAA,EAAuB,eAAA;AAAA,MACvB,kBAAA,EAAkB,cAAc,MAAA,GAAS,MAAA;AAAA,MACzC,IAAA,EAAM,OAAA;AAAA,MACN,WAAA,EAAW,OAAA,KAAY,OAAA,GAAU,WAAA,GAAc,QAAA;AAAA,MAC/C,WAAA,EAAW,cAAc,MAAA,GAAS,MAAA;AAAA,MAClC,IAAA;AAAA,MAEC,QAAA,EAAA;AAAA,QAAA,IAAA,oBAAQ,GAAA,CAAC,MAAA,EAAA,EAAK,KAAA,EAAM,wBAAA,EAA0B,QAAA,EAAA,IAAA,EAAK,CAAA;AAAA,wBACpD,IAAA,CAAC,KAAA,EAAA,EAAI,KAAA,EAAM,wBAAA,EACT,QAAA,EAAA;AAAA,0BAAA,GAAA,CAAC,QAAA,EAAA,EAAQ,wCAAc,GAAA,CAAC,QAAA,EAAA,EAAS,OAAO,EAAA,CAAG,EAAE,CAAA,EAAG,CAAA,GAAK,KAAA,EAAM,CAAA;AAAA,UAC1D,yBACC,GAAA,CAAC,KAAA,EAAA,EAAM,UAAA,EAAW,OAAA,EAAQ,MAAK,SAAA,EAAU,IAAA,EACtC,QAAA,EAAA,WAAA,mBAAc,GAAA,CAAC,YAAS,KAAA,EAAO,EAAA,CAAG,IAAI,CAAA,EAAG,IAAK,KAAA,EACjD,CAAA;AAAA,UAED,0BACC,GAAA,CAAC,MAAA,EAAA,EAAK,KAAA,EAAM,0BAAA,EACV,8BAAC,MAAA,EAAA,EAAM,QAAA,EAAA,WAAA,mBAAc,GAAA,CAAC,QAAA,EAAA,EAAS,OAAO,EAAA,CAAG,EAAE,CAAA,EAAG,CAAA,GAAK,QAAO,CAAA,EAC5D;AAAA,SAAA,EAEJ,CAAA;AAAA,QACC,MAAA,oBAAU,GAAA,CAAC,KAAA,EAAA,EAAI,KAAA,EAAM,4BAA4B,QAAA,EAAA,MAAA,EAAO;AAAA;AAAA;AAAA,GAC3D;AAEJ","file":"chunk-PGL6TXFW.js","sourcesContent":["import type { SafeHtml } from 'kerfjs';\n\nimport type { KerfUiContent } from '../../../shared/content/semantic-content.js';\nimport { em } from '../../../shared/styles/css-values.js';\nimport type { SemanticTone } from '../../../shared/styles/semantic-tone.js';\nimport { Badge } from '../badge/badge.js';\nimport { Skeleton } from '../skeleton/skeleton.js';\n\nexport type { SemanticTone } from '../../../shared/styles/semantic-tone.js';\n/** @deprecated Use SemanticTone. */\nexport type StateBannerTone = SemanticTone;\nexport type StateBannerUrgency = 'status' | 'alert';\nexport type StateBannerCopyLayout = 'inline' | 'stacked';\nexport type StateBannerActionPlacement = 'trailing' | 'below';\n\nexport interface StateBannerProps {\n  title: string;\n  detail?: string;\n  /** Optional compact status or count shown beside the title. */\n  badge?: string;\n  icon?: SafeHtml;\n  action?: KerfUiContent;\n  tone?: SemanticTone;\n  urgency?: StateBannerUrgency;\n  /** Keep the detail beside the title, or give it its own line. */\n  copyLayout?: StateBannerCopyLayout;\n  /** Place the action beside the copy or on a separate trailing row. */\n  actionPlacement?: StateBannerActionPlacement;\n  className?: string;\n  /** Render the title, badge, and detail as unanimated loading skeletons, keeping the icon and tone. The detail line appears only when `detail` is set, as in the live banner. */\n  placeholder?: boolean;\n  /** Native named-slot assignment when composed inside a web component. */\n  slot?: string;\n}\n\nexport function StateBanner({\n  title,\n  detail,\n  badge,\n  icon,\n  action,\n  tone = 'info',\n  urgency = 'status',\n  copyLayout = 'inline',\n  actionPlacement = 'trailing',\n  className = '',\n  placeholder = false,\n  slot,\n}: StateBannerProps) {\n  return (\n    <section\n      class={`kui-state-banner ${className}`.trim()}\n      data-component=\"state-banner\"\n      data-tone={tone}\n      data-copy-layout={copyLayout}\n      data-action-placement={actionPlacement}\n      data-placeholder={placeholder ? 'true' : undefined}\n      role={urgency}\n      aria-live={urgency === 'alert' ? 'assertive' : 'polite'}\n      aria-busy={placeholder ? 'true' : undefined}\n      slot={slot}\n    >\n      {icon && <span class=\"kui-state-banner__icon\">{icon}</span>}\n      <div class=\"kui-state-banner__copy\">\n        <strong>{placeholder ? <Skeleton width={em(10)} /> : title}</strong>\n        {badge && (\n          <Badge appearance=\"solid\" size=\"compact\" tone={tone}>\n            {placeholder ? <Skeleton width={em(1.75)} /> : badge}\n          </Badge>\n        )}\n        {detail && (\n          <span class=\"kui-state-banner__detail\">\n            <span>{placeholder ? <Skeleton width={em(16)} /> : detail}</span>\n          </span>\n        )}\n      </div>\n      {action && <div class=\"kui-state-banner__action\">{action}</div>}\n    </section>\n  );\n}\n"]}

package/dist/chunk-QQICWWNX.js

@@ -0,0 +1,71 @@
+import { verticalAlignment, horizontalAlignment } from './chunk-MXNIVEVL.js';
+import { gapLength } from './chunk-6IVNMC6R.js';
+import { filterDataAttributes } from './chunk-LAZLBC2Q.js';
+import { jsx } from 'kerfjs/jsx-runtime';
+
+var listProtectedAttributes = /* @__PURE__ */ new Set([
+  "data-component",
+  "data-gap",
+  "data-flex",
+  "data-fill",
+  "data-h-align",
+  "data-v-align",
+  "data-scrollable",
+  "data-text-insets",
+  "data-control-insets"
+]);
+function List({
+  children,
+  selectionMode,
+  ariaLabel,
+  gap = false,
+  flex = false,
+  fill = false,
+  hAlign = "full",
+  vAlign = "top",
+  scrollable = false,
+  dividerSides = "",
+  textInsets = "",
+  controlInsets = "",
+  className = "",
+  rootAttributes = {},
+  slot
+}) {
+  if (selectionMode === "multiple" && !ariaLabel) {
+    throw new Error("Multi-select List requires an ariaLabel");
+  }
+  const safeRootAttributes = filterDataAttributes(
+    rootAttributes,
+    listProtectedAttributes
+  );
+  const gapStyle = gap === true ? "--_kui-list-gap:var(--kui-list-gap)" : gap === false ? "" : typeof gap === "string" ? `--_kui-list-gap:${gapLength(gap)}` : `--_kui-list-column-gap:${gapLength(gap.column)};--_kui-list-row-gap:${gapLength(gap.row)}`;
+  const flexValue = flex === true ? "1 1 auto" : flex || void 0;
+  const style = [gapStyle, flexValue ? `--_kui-list-flex:${flexValue}` : ""].filter(Boolean).join(";");
+  return /* @__PURE__ */ jsx(
+    "div",
+    {
+      ...safeRootAttributes,
+      class: `kui-list ${className}`.trim(),
+      "data-component": "list",
+      role: selectionMode === "multiple" ? "grid" : void 0,
+      "aria-label": selectionMode === "multiple" ? ariaLabel : void 0,
+      "aria-multiselectable": selectionMode === "multiple" ? "true" : void 0,
+      "data-gap": String(Boolean(gap)),
+      "data-flex": String(Boolean(flex)),
+      "data-fill": fill ? "true" : void 0,
+      "data-h-align": horizontalAlignment(hAlign),
+      "data-v-align": verticalAlignment(vAlign),
+      "data-scrollable": String(scrollable),
+      "divider-sides": dividerSides || void 0,
+      "data-text-insets": textInsets || void 0,
+      "data-control-insets": controlInsets || void 0,
+      style: style || void 0,
+      slot,
+      children
+    }
+  );
+}
+
+export { List };
+
+//# sourceMappingURL=chunk-QQICWWNX.js.map

package/dist/chunk-QQICWWNX.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/collections/list/list.tsx"],"names":[],"mappings":";;;;;AAgBA,IAAM,uBAAA,uBAA8B,GAAA,CAAI;AAAA,EACtC,gBAAA;AAAA,EACA,UAAA;AAAA,EACA,WAAA;AAAA,EACA,WAAA;AAAA,EACA,cAAA;AAAA,EACA,cAAA;AAAA,EACA,iBAAA;AAAA,EACA,kBAAA;AAAA,EACA;AACF,CAAC,CAAA;AA+DM,SAAS,IAAA,CAAK;AAAA,EACnB,QAAA;AAAA,EACA,aAAA;AAAA,EACA,SAAA;AAAA,EACA,GAAA,GAAM,KAAA;AAAA,EACN,IAAA,GAAO,KAAA;AAAA,EACP,IAAA,GAAO,KAAA;AAAA,EACP,MAAA,GAAS,MAAA;AAAA,EACT,MAAA,GAAS,KAAA;AAAA,EACT,UAAA,GAAa,KAAA;AAAA,EACb,YAAA,GAAe,EAAA;AAAA,EACf,UAAA,GAAa,EAAA;AAAA,EACb,aAAA,GAAgB,EAAA;AAAA,EAChB,SAAA,GAAY,EAAA;AAAA,EACZ,iBAAiB,EAAC;AAAA,EAClB;AACF,CAAA,EAAc;AACZ,EAAA,IAAI,aAAA,KAAkB,UAAA,IAAc,CAAC,SAAA,EAAW;AAC9C,IAAA,MAAM,IAAI,MAAM,yCAAyC,CAAA;AAAA,EAC3D;AACA,EAAA,MAAM,kBAAA,GAAqB,oBAAA;AAAA,IACzB,cAAA;AAAA,IACA;AAAA,GACF;AACA,EAAA,MAAM,QAAA,GACJ,GAAA,KAAQ,IAAA,GACJ,qCAAA,GACA,GAAA,KAAQ,QACN,EAAA,GACA,OAAO,GAAA,KAAQ,QAAA,GACb,CAAA,gBAAA,EAAmB,SAAA,CAAU,GAAG,CAAC,CAAA,CAAA,GACjC,CAAA,uBAAA,EAA0B,SAAA,CAAU,GAAA,CAAI,MAAM,CAAC,CAAA,qBAAA,EAAwB,SAAA,CAAU,GAAA,CAAI,GAAG,CAAC,CAAA,CAAA;AACnG,EAAA,MAAM,SAAA,GAAY,IAAA,KAAS,IAAA,GAAO,UAAA,GAAa,IAAA,IAAQ,MAAA;AACvD,EAAA,MAAM,KAAA,GAAQ,CAAC,QAAA,EAAU,SAAA,GAAY,CAAA,iBAAA,EAAoB,SAAS,CAAA,CAAA,GAAK,EAAE,CAAA,CACtE,MAAA,CAAO,OAAO,CAAA,CACd,KAAK,GAAG,CAAA;AAEX,EAAA,uBACE,GAAA;AAAA,IAAC,KAAA;AAAA,IAAA;AAAA,MACE,GAAG,kBAAA;AAAA,MACJ,KAAA,EAAO,CAAA,SAAA,EAAY,SAAS,CAAA,CAAA,CAAG,IAAA,EAAK;AAAA,MACpC,gBAAA,EAAe,MAAA;AAAA,MACf,IAAA,EAAM,aAAA,KAAkB,UAAA,GAAa,MAAA,GAAS,MAAA;AAAA,MAC9C,YAAA,EAAY,aAAA,KAAkB,UAAA,GAAa,SAAA,GAAY,MAAA;AAAA,MACvD,sBAAA,EAAsB,aAAA,KAAkB,UAAA,GAAa,MAAA,GAAS,MAAA;AAAA,MAC9D,UAAA,EAAU,MAAA,CAAO,OAAA,CAAQ,GAAG,CAAC,CAAA;AAAA,MAC7B,WAAA,EAAW,MAAA,CAAO,OAAA,CAAQ,IAAI,CAAC,CAAA;AAAA,MAC/B,WAAA,EAAW,OAAO,MAAA,GAAS,MAAA;AAAA,MAC3B,cAAA,EAAc,oBAAoB,MAAM,CAAA;AAAA,MACxC,cAAA,EAAc,kBAAkB,MAAM,CAAA;AAAA,MACtC,iBAAA,EAAiB,OAAO,UAAU,CAAA;AAAA,MAClC,iBAAe,YAAA,IAAgB,MAAA;AAAA,MAC/B,oBAAkB,UAAA,IAAc,MAAA;AAAA,MAChC,uBAAqB,aAAA,IAAiB,MAAA;AAAA,MACtC,OAAO,KAAA,IAAS,MAAA;AAAA,MAChB,IAAA;AAAA,MAEC;AAAA;AAAA,GACH;AAEJ","file":"chunk-QQICWWNX.js","sourcesContent":["import type { KerfUiContent } from '../../../shared/content/semantic-content.js';\nimport { filterDataAttributes } from '../../../shared/dom/extension-attributes.js';\nimport {\n  type HorizontalAlignment,\n  horizontalAlignment,\n  type ListVerticalAlignment,\n  verticalAlignment,\n} from '../../../shared/layout/flex-alignment.js';\nimport { gapLength } from '../../../shared/layout/gap.js';\nimport type { Sides } from '../../../shared/layout/sides.js';\nimport {\n  type CssFlex,\n  type CssFlexKeyword,\n  type UiGap,\n} from '../../../shared/styles/css-values.js';\n\nconst listProtectedAttributes = new Set([\n  'data-component',\n  'data-gap',\n  'data-flex',\n  'data-fill',\n  'data-h-align',\n  'data-v-align',\n  'data-scrollable',\n  'data-text-insets',\n  'data-control-insets',\n]);\n\ntype ListRootAttributes = Readonly<\n  Record<`data-${string}`, string | undefined> & {\n    'data-component'?: never;\n    'data-gap'?: never;\n    'data-flex'?: never;\n    'data-fill'?: never;\n    'data-h-align'?: never;\n    'data-v-align'?: never;\n    'data-scrollable'?: never;\n    'data-text-insets'?: never;\n    'data-control-insets'?: never;\n  }\n>;\n\nexport interface ListProps {\n  children?: KerfUiContent;\n  /** Make this list a labeled multi-select grid for `ContentItem selectionMode=\"multiple\"` rows. */\n  selectionMode?: 'multiple';\n  /** Accessible name for the multi-select grid. */\n  ariaLabel?: string;\n  /** Standard gap (`true`), one spacing value, or separate column and row values. Defaults to no gap. */\n  gap?: boolean | UiGap;\n  /** Allow this list to grow/shrink, use a keyword, or supply a typed CSS flex shorthand. */\n  flex?: boolean | CssFlexKeyword | CssFlex;\n  /**\n   * Fill the height of a parent with a definite height, such as an app root or\n   * a fixed-height frame, when this list is that parent's layout root. Inside a\n   * flex layout use `flex` instead. Defaults to false.\n   */\n  fill?: boolean;\n  /** Horizontal alignment. Defaults to full to preserve stretch-aligned list children. */\n  hAlign?: HorizontalAlignment;\n  /** Vertical distribution. Defaults to top. */\n  vAlign?: ListVerticalAlignment;\n  /** Own vertical scrolling and overscroll containment. */\n  scrollable?: boolean;\n  /** Physical divider edges in canonical top/right/bottom/left order. */\n  dividerSides?: Sides;\n  /** Physical sides that receive the standard 17px text inset. */\n  textInsets?: Sides;\n  /** Physical sides that receive the standard 8px control inset. Text insets win on overlap. */\n  controlInsets?: Sides;\n  className?: string;\n  /** Safe `data-*` metadata; List-owned structural attributes remain protected. */\n  rootAttributes?: ListRootAttributes;\n  /** Native named-slot assignment when composed inside a web component. */\n  slot?: string;\n}\n\n/**\n * A list's configuration, apart from its content and styling hooks: the props a\n * composite that renders a `List` for the app (the Workbench's `mainHeader` /\n * `mainFooter` chrome) forwards, so the app configures that list instead of\n * styling it. An omitted or `undefined` field keeps the composite's default.\n */\nexport type ListConfig = Pick<\n  ListProps,\n  'gap' | 'hAlign' | 'vAlign' | 'dividerSides' | 'textInsets' | 'controlInsets'\n>;\n\n/** A stretch-aligned vertical stack with optional gap, flex, fill, scroll, and dividers. */\nexport function List({\n  children,\n  selectionMode,\n  ariaLabel,\n  gap = false,\n  flex = false,\n  fill = false,\n  hAlign = 'full',\n  vAlign = 'top',\n  scrollable = false,\n  dividerSides = '',\n  textInsets = '',\n  controlInsets = '',\n  className = '',\n  rootAttributes = {},\n  slot,\n}: ListProps) {\n  if (selectionMode === 'multiple' && !ariaLabel) {\n    throw new Error('Multi-select List requires an ariaLabel');\n  }\n  const safeRootAttributes = filterDataAttributes(\n    rootAttributes,\n    listProtectedAttributes,\n  );\n  const gapStyle =\n    gap === true\n      ? '--_kui-list-gap:var(--kui-list-gap)'\n      : gap === false\n        ? ''\n        : typeof gap === 'string'\n          ? `--_kui-list-gap:${gapLength(gap)}`\n          : `--_kui-list-column-gap:${gapLength(gap.column)};--_kui-list-row-gap:${gapLength(gap.row)}`;\n  const flexValue = flex === true ? '1 1 auto' : flex || undefined;\n  const style = [gapStyle, flexValue ? `--_kui-list-flex:${flexValue}` : '']\n    .filter(Boolean)\n    .join(';');\n\n  return (\n    <div\n      {...safeRootAttributes}\n      class={`kui-list ${className}`.trim()}\n      data-component=\"list\"\n      role={selectionMode === 'multiple' ? 'grid' : undefined}\n      aria-label={selectionMode === 'multiple' ? ariaLabel : undefined}\n      aria-multiselectable={selectionMode === 'multiple' ? 'true' : undefined}\n      data-gap={String(Boolean(gap))}\n      data-flex={String(Boolean(flex))}\n      data-fill={fill ? 'true' : undefined}\n      data-h-align={horizontalAlignment(hAlign)}\n      data-v-align={verticalAlignment(vAlign)}\n      data-scrollable={String(scrollable)}\n      divider-sides={dividerSides || undefined}\n      data-text-insets={textInsets || undefined}\n      data-control-insets={controlInsets || undefined}\n      style={style || undefined}\n      slot={slot}\n    >\n      {children}\n    </div>\n  );\n}\n\nexport type {\n  HorizontalAlignment,\n  ListVerticalAlignment,\n  VerticalAlignment,\n} from '../../../shared/layout/flex-alignment.js';\nexport type { Sides } from '../../../shared/layout/sides.js';\nexport type {\n  CssFlex,\n  CssFlexKeyword,\n  CssLength,\n  UiGap,\n  UiGapValue,\n  UiSpaceName,\n} from '../../../shared/styles/css-values.js';\n"]}

package/dist/chunk-S3ECMF23.js

@@ -0,0 +1,33 @@
+import { jsx } from 'kerfjs/jsx-runtime';
+
+// src/components/actions/floating-toolbar/floating-toolbar.tsx
+function FloatingToolbar({
+  children,
+  label,
+  position = "bottom-end",
+  placement = "floating",
+  inset,
+  safeAreaInsets = false,
+  className = "",
+  slot
+}) {
+  return /* @__PURE__ */ jsx(
+    "div",
+    {
+      class: `kui-floating-toolbar ${className}`.trim(),
+      "data-component": "floating-toolbar",
+      "data-position": position,
+      "data-placement": placement,
+      "data-safe-area-insets": safeAreaInsets ? "true" : void 0,
+      role: "toolbar",
+      "aria-label": label,
+      style: inset ? `--kui-floating-toolbar-inset:${inset}` : void 0,
+      slot,
+      children
+    }
+  );
+}
+
+export { FloatingToolbar };
+
+//# sourceMappingURL=chunk-S3ECMF23.js.map

package/dist/chunk-S3ECMF23.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/actions/floating-toolbar/floating-toolbar.tsx"],"names":[],"mappings":";;;AAkDO,SAAS,eAAA,CAAgB;AAAA,EAC9B,QAAA;AAAA,EACA,KAAA;AAAA,EACA,QAAA,GAAW,YAAA;AAAA,EACX,SAAA,GAAY,UAAA;AAAA,EACZ,KAAA;AAAA,EACA,cAAA,GAAiB,KAAA;AAAA,EACjB,SAAA,GAAY,EAAA;AAAA,EACZ;AACF,CAAA,EAAyB;AACvB,EAAA,uBACE,GAAA;AAAA,IAAC,KAAA;AAAA,IAAA;AAAA,MACC,KAAA,EAAO,CAAA,qBAAA,EAAwB,SAAS,CAAA,CAAA,CAAG,IAAA,EAAK;AAAA,MAChD,gBAAA,EAAe,kBAAA;AAAA,MACf,eAAA,EAAe,QAAA;AAAA,MACf,gBAAA,EAAgB,SAAA;AAAA,MAChB,uBAAA,EAAuB,iBAAiB,MAAA,GAAS,MAAA;AAAA,MACjD,IAAA,EAAK,SAAA;AAAA,MACL,YAAA,EAAY,KAAA;AAAA,MACZ,KAAA,EAAO,KAAA,GAAQ,CAAA,6BAAA,EAAgC,KAAK,CAAA,CAAA,GAAK,MAAA;AAAA,MACzD,IAAA;AAAA,MAEC;AAAA;AAAA,GACH;AAEJ","file":"chunk-S3ECMF23.js","sourcesContent":["import type { KerfUiContent } from '../../../shared/content/semantic-content.js';\nimport type { CssLength } from '../../../shared/styles/css-values.js';\n\n/** Where a {@link FloatingToolbar} floats within its positioned container. */\nexport type FloatingToolbarPosition =\n  'bottom' | 'bottom-start' | 'bottom-end' | 'top' | 'top-start' | 'top-end';\n\nexport interface FloatingToolbarProps {\n  /** Toolbar contents — normally one or more `ToolbarControlGroup`s. */\n  children: KerfUiContent;\n  /** Accessible name for the toolbar (required — it exposes `role=\"toolbar\"`). */\n  label: string;\n  /**\n   * Corner or edge it floats to inside its nearest positioned ancestor.\n   * Default: `'bottom-end'`.\n   */\n  position?: FloatingToolbarPosition;\n  /** Keep the toolbar in normal document flow instead of floating over content. */\n  placement?: 'floating' | 'inline';\n  /**\n   * Distance from the container edges named by `position`. Default:\n   * `space('m')` (16px, 8px past a top toolbar's own inset). Omit it inside a\n   * `Workbench`, `CollapsiblePanel`, or `ResizableRegion` restore corner: the\n   * corner owns the inset there and sets it to zero.\n   */\n  inset?: CssLength;\n  /** Add device or layout-routed safe-area insets to the positioned edges. */\n  safeAreaInsets?: boolean;\n  className?: string;\n  /** Native named-slot assignment when composed inside a web component. */\n  slot?: string;\n}\n\n/**\n * A toolbar that floats above the main content of its nearest positioned\n * ancestor — a transparent, forced-dark cluster of controls (e.g. a drawer\n * restore button) that sits over the content but NOT over dialogs or overlays\n * (it is not in the top layer). It is inset from the container edges by\n * `inset` (default `--kui-space-m`, i.e. 8px more than a top toolbar's own\n * inset); pass a typed length to move it. Inside a `Workbench`, `CollapsiblePanel`, or\n * `ResizableRegion` restore corner the corner owns the inset, so the toolbar\n * floats from the corner's own position. While one of those layouts has a\n * side overlay open over the toolbar's region (a Workbench rail overlay, a\n * `wireSidebar` compact overlay, an overlay `CollapsiblePanel` or horizontal\n * `ResizableRegion`), the toolbar is hidden — unfocusable and out of the\n * accessibility tree — until the overlay closes. The app owns the controls\n * and their behavior — wire them with `delegate()` as usual. Set\n * `placement=\"inline\"` for normal flow when an owner already positions the\n * control; floating placement can add safe-area insets to its per-edge tokens.\n */\nexport function FloatingToolbar({\n  children,\n  label,\n  position = 'bottom-end',\n  placement = 'floating',\n  inset,\n  safeAreaInsets = false,\n  className = '',\n  slot,\n}: FloatingToolbarProps) {\n  return (\n    <div\n      class={`kui-floating-toolbar ${className}`.trim()}\n      data-component=\"floating-toolbar\"\n      data-position={position}\n      data-placement={placement}\n      data-safe-area-insets={safeAreaInsets ? 'true' : undefined}\n      role=\"toolbar\"\n      aria-label={label}\n      style={inset ? `--kui-floating-toolbar-inset:${inset}` : undefined}\n      slot={slot}\n    >\n      {children}\n    </div>\n  );\n}\n"]}

package/dist/chunk-S4ZGTDSG.js

@@ -0,0 +1,18 @@
+// src/components/layout/workbench/internal/workbench-resize.ts
+var SLUGS = {
+  leftRail: "left-rail",
+  rightRail: "right-rail",
+  bottomDrawer: "bottom-drawer"
+};
+var workbenchRegionId = (id, panel) => `${id}-${SLUGS[panel]}`;
+var WORKBENCH_RESIZE_DEFAULTS = {
+  leftRail: { size: 280, min: 180, max: 480 },
+  rightRail: { size: 280, min: 180, max: 480 },
+  bottomDrawer: { size: 220, min: 120, max: 480 }
+};
+var WORKBENCH_MAIN_MIN_SIZE = 320;
+var WORKBENCH_MAIN_MIN_HEIGHT = 120;
+
+export { WORKBENCH_MAIN_MIN_HEIGHT, WORKBENCH_MAIN_MIN_SIZE, WORKBENCH_RESIZE_DEFAULTS, workbenchRegionId };
+
+//# sourceMappingURL=chunk-S4ZGTDSG.js.map

package/dist/chunk-S4ZGTDSG.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/layout/workbench/internal/workbench-resize.ts"],"names":[],"mappings":";AAMA,IAAM,KAAA,GAA2C;AAAA,EAC/C,QAAA,EAAU,WAAA;AAAA,EACV,SAAA,EAAW,YAAA;AAAA,EACX,YAAA,EAAc;AAChB,CAAA;AAGO,IAAM,iBAAA,GAAoB,CAAC,EAAA,EAAY,KAAA,KAC5C,GAAG,EAAE,CAAA,CAAA,EAAI,KAAA,CAAM,KAAK,CAAC,CAAA;AAGhB,IAAM,yBAAA,GAGT;AAAA,EACF,UAAU,EAAE,IAAA,EAAM,KAAK,GAAA,EAAK,GAAA,EAAK,KAAK,GAAA,EAAI;AAAA,EAC1C,WAAW,EAAE,IAAA,EAAM,KAAK,GAAA,EAAK,GAAA,EAAK,KAAK,GAAA,EAAI;AAAA,EAC3C,cAAc,EAAE,IAAA,EAAM,KAAK,GAAA,EAAK,GAAA,EAAK,KAAK,GAAA;AAC5C;AAOO,IAAM,uBAAA,GAA0B;AAOhC,IAAM,yBAAA,GAA4B","file":"chunk-S4ZGTDSG.js","sourcesContent":["// The resizable-panel contract shared by `Workbench` (which renders it) and\n// `wireWorkbench` (which drives it). Internal.\n\n/** A Workbench panel slot, named after its `WorkbenchProps` prop. */\nexport type WorkbenchPanelKey = 'leftRail' | 'rightRail' | 'bottomDrawer';\n\nconst SLUGS: Record<WorkbenchPanelKey, string> = {\n  leftRail: 'left-rail',\n  rightRail: 'right-rail',\n  bottomDrawer: 'bottom-drawer',\n};\n\n/** The `data-region-id` a resizable panel carries, e.g. `studio-left-rail`. */\nexport const workbenchRegionId = (id: string, panel: WorkbenchPanelKey) =>\n  `${id}-${SLUGS[panel]}`;\n\n/** Default size and limits (px) for a panel whose `resizable` omits them. */\nexport const WORKBENCH_RESIZE_DEFAULTS: Record<\n  WorkbenchPanelKey,\n  { size: number; min: number; max: number }\n> = {\n  leftRail: { size: 280, min: 180, max: 480 },\n  rightRail: { size: 280, min: 180, max: 480 },\n  bottomDrawer: { size: 220, min: 120, max: 480 },\n};\n\n/**\n * Default minimum width (px) a Workbench keeps for its work area beside its\n * inline rails, fixed or resizable: resizable rails stop growing there, and\n * every inline rail shrinks proportionally when the container narrows.\n */\nexport const WORKBENCH_MAIN_MIN_SIZE = 320;\n\n/**\n * Default minimum height (px) a Workbench keeps for its work area above an\n * inline bottom drawer: a resizable drawer stops growing there, and the drawer\n * shrinks when the Workbench gets shorter.\n */\nexport const WORKBENCH_MAIN_MIN_HEIGHT = 120;\n"]}

package/dist/chunk-SJW5BCEQ.js

@@ -0,0 +1,174 @@
+import { ToolbarText } from './chunk-3DXHNLME.js';
+import { ToolbarControlGroup } from './chunk-MTCTX25G.js';
+import { Toolbar } from './chunk-BYHGRKC3.js';
+import { Pane } from './chunk-FL6J644M.js';
+import { List } from './chunk-QQICWWNX.js';
+import { LucideIcon } from './chunk-NP3FSLNX.js';
+import { ChevronLeft } from 'lucide';
+import { jsxs, jsx, Fragment } from 'kerfjs/jsx-runtime';
+
+var DEFAULT_SAFE_AREA_EDGES = [
+  "block-start",
+  "inline-start",
+  "inline-end"
+];
+var DEFAULT_BOTTOM_SAFE_AREA_EDGES = [
+  "block-end",
+  "inline-start",
+  "inline-end"
+];
+function chromeList(content, config) {
+  return /* @__PURE__ */ jsx(
+    List,
+    {
+      dividerSides: config?.dividerSides,
+      gap: config?.gap,
+      hAlign: config?.hAlign,
+      vAlign: config?.vAlign,
+      textInsets: config?.textInsets,
+      controlInsets: config?.controlInsets,
+      children: content
+    }
+  );
+}
+function NavStack({
+  id,
+  label,
+  views,
+  backLabel = "Back",
+  backIcon,
+  backText,
+  toolbarConfig = {},
+  panelToggle,
+  hideToolbar = false,
+  bottomToolbar,
+  separator = "auto",
+  chromeDividers = "scroll",
+  className = "",
+  slot
+}) {
+  const topIndex = views.length - 1;
+  const top = views[topIndex];
+  const topToolbar = top?.toolbar;
+  const bottom = top?.bottomToolbar ?? bottomToolbar;
+  const canPop = views.length > 1;
+  return /* @__PURE__ */ jsxs(
+    "section",
+    {
+      class: `kui-nav-stack ${className}`.trim(),
+      id,
+      "data-component": "nav-stack",
+      "data-nav-stack-id": id,
+      "data-depth": String(views.length),
+      "data-separator": separator,
+      "data-chrome-dividers": chromeDividers === "always" || chromeDividers === "none" ? chromeDividers : void 0,
+      "aria-label": label,
+      slot,
+      children: [
+        !hideToolbar && /* @__PURE__ */ jsx("div", { class: "kui-nav-stack__chrome", "data-nav-stack-chrome": true, children: /* @__PURE__ */ jsx(
+          Toolbar,
+          {
+            label: topToolbar?.label ?? toolbarConfig.label,
+            dividerSides: topToolbar?.dividerSides ?? toolbarConfig.dividerSides,
+            centerAlign: topToolbar?.centerAlign ?? toolbarConfig.centerAlign,
+            responsive: topToolbar?.responsive ?? toolbarConfig.responsive,
+            responsiveAt: topToolbar?.responsiveAt ?? toolbarConfig.responsiveAt,
+            safeAreaEdges: topToolbar?.safeAreaEdges ?? toolbarConfig.safeAreaEdges ?? DEFAULT_SAFE_AREA_EDGES,
+            leading: /* @__PURE__ */ jsxs(Fragment, { children: [
+              canPop && /* @__PURE__ */ jsx(
+                ToolbarControlGroup,
+                {
+                  appearance: "borderless",
+                  shape: "rounded",
+                  content: backText ? "mixed" : "icon",
+                  single: true,
+                  children: /* @__PURE__ */ jsxs(
+                    "button",
+                    {
+                      type: "button",
+                      class: "kui-nav-stack__back",
+                      "data-nav-back": true,
+                      "aria-label": backText ? void 0 : backLabel,
+                      children: [
+                        backIcon ?? /* @__PURE__ */ jsx(
+                          LucideIcon,
+                          {
+                            icon: ChevronLeft,
+                            name: "chevron-left",
+                            className: "kui-nav-stack__back-icon"
+                          }
+                        ),
+                        backText ? /* @__PURE__ */ jsx("span", { children: backText }) : null
+                      ]
+                    }
+                  )
+                }
+              ),
+              topToolbar?.leading,
+              /* @__PURE__ */ jsx(
+                ToolbarText,
+                {
+                  text: topToolbar?.title ?? "",
+                  size: topToolbar?.titleSize ?? toolbarConfig.titleSize ?? "large",
+                  headingLevel: topToolbar?.headingLevel ?? toolbarConfig.headingLevel,
+                  fill: true
+                }
+              )
+            ] }),
+            center: topToolbar?.center,
+            trailing: /* @__PURE__ */ jsxs(Fragment, { children: [
+              topToolbar?.trailing,
+              panelToggle
+            ] })
+          }
+        ) }),
+        /* @__PURE__ */ jsx("div", { class: "kui-nav-stack__viewport", "data-nav-stack-viewport": true, children: views.map((view, index) => /* @__PURE__ */ jsx(
+          "article",
+          {
+            class: "kui-nav-stack__view",
+            "data-key": view.key,
+            "data-nav-key": view.key,
+            "data-nav-active": String(index === topIndex),
+            "aria-hidden": String(index !== topIndex),
+            children: view.pane || view.header !== void 0 || view.footer !== void 0 ? /* @__PURE__ */ jsx(
+              Pane,
+              {
+                appearance: view.pane?.appearance,
+                deepInset: view.pane?.deepInset,
+                tabIndex: view.pane?.tabIndex,
+                outlined: view.pane?.outlined,
+                contentElement: view.pane?.contentElement,
+                contentLabel: view.pane?.contentLabel,
+                separators: view.pane?.separators,
+                safeAreaEdges: view.pane?.safeAreaEdges,
+                chromeDividers: view.pane?.chromeDividers,
+                header: view.header === void 0 ? void 0 : /* @__PURE__ */ jsx("div", { "data-nav-stack-header": true, children: chromeList(view.header, view.headerList) }),
+                footer: view.footer === void 0 ? void 0 : /* @__PURE__ */ jsx("div", { "data-nav-stack-footer": true, children: chromeList(view.footer, view.footerList) }),
+                children: view.content
+              }
+            ) : view.content
+          }
+        )) }),
+        bottom && /* @__PURE__ */ jsx("footer", { class: "kui-nav-stack__bottom", "data-nav-stack-bottom": true, children: /* @__PURE__ */ jsx(
+          Toolbar,
+          {
+            position: "footer",
+            label: bottom.label,
+            dividerSides: bottom.dividerSides,
+            centerAlign: bottom.centerAlign,
+            responsive: bottom.responsive,
+            responsiveAt: bottom.responsiveAt,
+            safeAreaEdges: bottom.safeAreaEdges ?? DEFAULT_BOTTOM_SAFE_AREA_EDGES,
+            leading: bottom.leading,
+            center: bottom.center,
+            trailing: bottom.trailing
+          }
+        ) })
+      ]
+    }
+  );
+}
+
+export { NavStack };
+
+//# sourceMappingURL=chunk-SJW5BCEQ.js.map

package/dist/chunk-SJW5BCEQ.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/navigation/nav-stack/nav-stack.tsx"],"names":[],"mappings":"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","file":"chunk-SJW5BCEQ.js","sourcesContent":["import { ChevronLeft } from 'lucide';\n\nimport type { KerfUiContent } from '../../../shared/content/semantic-content.js';\nimport type { NavPane } from '../../../shared/panels/nav-pane.js';\nimport type { PanelBottomToolbar } from '../../../shared/panels/panel-toolbar.js';\nimport { Toolbar, type ToolbarConfig } from '../../actions/toolbar/toolbar.js';\nimport { ToolbarControlGroup } from '../../actions/toolbar-control-group/toolbar-control-group.js';\nimport {\n  type HeadingLevel,\n  ToolbarText,\n  type ToolbarTextSize,\n} from '../../actions/toolbar-text/toolbar-text.js';\nimport { List, type ListConfig } from '../../collections/list/list.js';\nimport { Pane } from '../../layout/pane/pane.js';\nimport { LucideIcon } from '../../media/lucide-icon/lucide-icon.js';\n\n/**\n * One entry in a {@link NavStack}. The app owns the stack as an array (usually a\n * signal); `NavStack` renders it and `wireNavStack` animates the transitions.\n */\nexport interface NavStackView extends NavPane<\n  NavStackViewToolbar,\n  PanelBottomToolbar\n> {\n  /** Stable identity for keyed reconcile and transition direction. */\n  key: string;\n}\n\n/** Per-view top toolbar. The stack supplies its back control before `leading`. */\nexport interface NavStackViewToolbar extends NavStackToolbarConfig {\n  title?: string;\n  leading?: KerfUiContent;\n  center?: KerfUiContent;\n  trailing?: KerfUiContent;\n}\n\n/** A view's structured bottom toolbar; it cross-fades on navigation. */\nexport type NavStackViewBottomToolbar = PanelBottomToolbar;\n\n/**\n * The top toolbar's configuration. Its `ToolbarConfig` forwards to the real\n * `Toolbar` the stack renders; by default that toolbar draws no divider and\n * claims the top and side safe-area edges the stack still touches.\n */\nexport interface NavStackToolbarConfig extends ToolbarConfig {\n  /** Accessible name of the top toolbar (default: none). */\n  label?: string;\n  /** Size of the view title's `ToolbarText` (default `large`). */\n  titleSize?: ToolbarTextSize;\n  /** Expose the view title as a heading at this level (default: a plain span). */\n  headingLevel?: HeadingLevel;\n}\n\nexport interface NavStackProps {\n  id: string;\n  /** Accessible name for the stack region. */\n  label: string;\n  /** The stack, root first; the last entry is the active top view. */\n  views: NavStackView[];\n  /** Accessible label for the icon-only back control (default \"Back\"). */\n  backLabel?: string;\n  /** The back control's icon (default a chevron-left `LucideIcon`). */\n  backIcon?: KerfUiContent;\n  /**\n   * Visible text beside the back icon, such as the previous view's title\n   * (default: icon only). When set, the text names the control and\n   * `backLabel` is not used.\n   */\n  backText?: string;\n  /** The top toolbar's configuration, forwarded to its `Toolbar`. */\n  toolbarConfig?: NavStackToolbarConfig;\n  /** Persistent last group in every view's top toolbar, supplied by a hosting panel. */\n  panelToggle?: KerfUiContent;\n  /** Hide the top toolbar entirely (rare — a fully custom-chrome view). */\n  hideToolbar?: boolean;\n  /** Optional persistent bottom toolbar used when the active view does not provide one. */\n  bottomToolbar?: NavStackViewBottomToolbar;\n  /**\n   * Stack chrome separator. `auto` (default) draws both available edges\n   * against a sunken active Pane and otherwise follows `chromeDividers`;\n   * `hidden` suppresses the stack-owned edges.\n   */\n  separator?: 'auto' | 'hidden';\n  /**\n   * The line under the top chrome and over the bottom toolbar, where they\n   * meet the active view. `scroll` (default) shows the chrome's line only\n   * while the view's content is scrolled beneath it, and the bottom\n   * toolbar's only while more content lies below — never when the content\n   * fits — once `wireScrollDividers` (`@kerfjs/ui/wire-scroll-dividers`) is\n   * wired above the stack; unwired, neither shows. `always` shows both\n   * without the wiring; `none` neither, even when wired. The line is drawn\n   * inside the chrome, so no state moves the chrome or the content. A\n   * A sunken active Pane still draws the separator unless\n   * `separator=\"hidden\"`. A `toolbarConfig.dividerSides` edge is the Toolbar's\n   * own and is unaffected.\n   */\n  chromeDividers?: 'scroll' | 'always' | 'none';\n  className?: string;\n  /** Native named-slot assignment when composed inside a web component. */\n  slot?: string;\n}\n\nconst DEFAULT_SAFE_AREA_EDGES = [\n  'block-start',\n  'inline-start',\n  'inline-end',\n] as const;\n\nconst DEFAULT_BOTTOM_SAFE_AREA_EDGES = [\n  'block-end',\n  'inline-start',\n  'inline-end',\n] as const;\n\nfunction chromeList(content: KerfUiContent, config?: ListConfig) {\n  return (\n    <List\n      dividerSides={config?.dividerSides}\n      gap={config?.gap}\n      hAlign={config?.hAlign}\n      vAlign={config?.vAlign}\n      textInsets={config?.textInsets}\n      controlInsets={config?.controlInsets}\n    >\n      {content}\n    </List>\n  );\n}\n\n/**\n * A navigation stack (iOS-style push/pop). Renders every entry stacked, the last\n * one active; `@kerfjs/ui/wire-nav-stack`'s `wireNavStack` slides the content and\n * cross-fades the chrome across a change. Its top chrome is a real `Toolbar`: the\n * back control and title lead, the active view's `toolbar` fills the zones,\n * and `toolbarConfig` supplies defaults. A single-pane\n * layout is a `NavStack` with one entry. See `docs/23-app-layouts.md` §3.1.\n */\nexport function NavStack({\n  id,\n  label,\n  views,\n  backLabel = 'Back',\n  backIcon,\n  backText,\n  toolbarConfig = {},\n  panelToggle,\n  hideToolbar = false,\n  bottomToolbar,\n  separator = 'auto',\n  chromeDividers = 'scroll',\n  className = '',\n  slot,\n}: NavStackProps) {\n  const topIndex = views.length - 1;\n  const top = views[topIndex];\n  const topToolbar = top?.toolbar;\n  const bottom = top?.bottomToolbar ?? bottomToolbar;\n  const canPop = views.length > 1;\n  return (\n    <section\n      class={`kui-nav-stack ${className}`.trim()}\n      id={id}\n      data-component=\"nav-stack\"\n      data-nav-stack-id={id}\n      data-depth={String(views.length)}\n      data-separator={separator}\n      data-chrome-dividers={\n        chromeDividers === 'always' || chromeDividers === 'none'\n          ? chromeDividers\n          : undefined\n      }\n      aria-label={label}\n      slot={slot}\n    >\n      {!hideToolbar && (\n        <div class=\"kui-nav-stack__chrome\" data-nav-stack-chrome>\n          <Toolbar\n            label={topToolbar?.label ?? toolbarConfig.label}\n            dividerSides={\n              topToolbar?.dividerSides ?? toolbarConfig.dividerSides\n            }\n            centerAlign={topToolbar?.centerAlign ?? toolbarConfig.centerAlign}\n            responsive={topToolbar?.responsive ?? toolbarConfig.responsive}\n            responsiveAt={\n              topToolbar?.responsiveAt ?? toolbarConfig.responsiveAt\n            }\n            safeAreaEdges={\n              topToolbar?.safeAreaEdges ??\n              toolbarConfig.safeAreaEdges ??\n              DEFAULT_SAFE_AREA_EDGES\n            }\n            leading={\n              <>\n                {canPop && (\n                  <ToolbarControlGroup\n                    appearance=\"borderless\"\n                    shape=\"rounded\"\n                    content={backText ? 'mixed' : 'icon'}\n                    single\n                  >\n                    <button\n                      type=\"button\"\n                      class=\"kui-nav-stack__back\"\n                      data-nav-back\n                      aria-label={backText ? undefined : backLabel}\n                    >\n                      {backIcon ?? (\n                        <LucideIcon\n                          icon={ChevronLeft}\n                          name=\"chevron-left\"\n                          className=\"kui-nav-stack__back-icon\"\n                        />\n                      )}\n                      {backText ? <span>{backText}</span> : null}\n                    </button>\n                  </ToolbarControlGroup>\n                )}\n                {topToolbar?.leading}\n                <ToolbarText\n                  text={topToolbar?.title ?? ''}\n                  size={\n                    topToolbar?.titleSize ?? toolbarConfig.titleSize ?? 'large'\n                  }\n                  headingLevel={\n                    topToolbar?.headingLevel ?? toolbarConfig.headingLevel\n                  }\n                  fill\n                />\n              </>\n            }\n            center={topToolbar?.center}\n            trailing={\n              <>\n                {topToolbar?.trailing}\n                {panelToggle}\n              </>\n            }\n          />\n        </div>\n      )}\n      <div class=\"kui-nav-stack__viewport\" data-nav-stack-viewport>\n        {views.map((view, index) => (\n          <article\n            class=\"kui-nav-stack__view\"\n            data-key={view.key}\n            data-nav-key={view.key}\n            data-nav-active={String(index === topIndex)}\n            aria-hidden={String(index !== topIndex)}\n          >\n            {view.pane ||\n            view.header !== undefined ||\n            view.footer !== undefined ? (\n              <Pane\n                appearance={view.pane?.appearance}\n                deepInset={view.pane?.deepInset}\n                tabIndex={view.pane?.tabIndex}\n                outlined={view.pane?.outlined}\n                contentElement={view.pane?.contentElement}\n                contentLabel={view.pane?.contentLabel}\n                separators={view.pane?.separators}\n                safeAreaEdges={view.pane?.safeAreaEdges}\n                chromeDividers={view.pane?.chromeDividers}\n                header={\n                  view.header === undefined ? undefined : (\n                    <div data-nav-stack-header>\n                      {chromeList(view.header, view.headerList)}\n                    </div>\n                  )\n                }\n                footer={\n                  view.footer === undefined ? undefined : (\n                    <div data-nav-stack-footer>\n                      {chromeList(view.footer, view.footerList)}\n                    </div>\n                  )\n                }\n              >\n                {view.content}\n              </Pane>\n            ) : (\n              view.content\n            )}\n          </article>\n        ))}\n      </div>\n      {bottom && (\n        <footer class=\"kui-nav-stack__bottom\" data-nav-stack-bottom>\n          <Toolbar\n            position=\"footer\"\n            label={bottom.label}\n            dividerSides={bottom.dividerSides}\n            centerAlign={bottom.centerAlign}\n            responsive={bottom.responsive}\n            responsiveAt={bottom.responsiveAt}\n            safeAreaEdges={\n              bottom.safeAreaEdges ?? DEFAULT_BOTTOM_SAFE_AREA_EDGES\n            }\n            leading={bottom.leading}\n            center={bottom.center}\n            trailing={bottom.trailing}\n          />\n        </footer>\n      )}\n    </section>\n  );\n}\n"]}

package/dist/chunk-TTGIHMDR.js

@@ -0,0 +1,149 @@
+import { ToolbarControlGroup, isRelocatableGroup } from './chunk-MTCTX25G.js';
+import { Toolbar } from './chunk-BYHGRKC3.js';
+import { Pane } from './chunk-FL6J644M.js';
+import { List } from './chunk-QQICWWNX.js';
+import { LucideIcon } from './chunk-NP3FSLNX.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 panelChromeList(content, config) {
+  return /* @__PURE__ */ jsx(
+    List,
+    {
+      dividerSides: config?.dividerSides,
+      gap: config?.gap,
+      hAlign: config?.hAlign,
+      vAlign: config?.vAlign,
+      textInsets: config?.textInsets,
+      controlInsets: config?.controlInsets,
+      children: content
+    }
+  );
+}
+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,
+  header,
+  headerList,
+  headerPlacement = "fixed",
+  footer,
+  footerList,
+  bottomToolbar,
+  footerPlacement = "fixed",
+  content
+}) {
+  const panelHeader = /* @__PURE__ */ jsxs(Fragment, { children: [
+    composedPanelToolbar(toolbar, side, collapsed, attributes),
+    header ? panelChromeList(header, headerList) : null
+  ] });
+  const panelFooter = footer || bottomToolbar ? /* @__PURE__ */ jsxs(Fragment, { children: [
+    footer ? panelChromeList(footer, footerList) : null,
+    bottomToolbar ? /* @__PURE__ */ jsx(
+      Toolbar,
+      {
+        position: "footer",
+        label: bottomToolbar.label,
+        dividerSides: bottomToolbar.dividerSides,
+        centerAlign: bottomToolbar.centerAlign,
+        responsive: bottomToolbar.responsive,
+        responsiveAt: bottomToolbar.responsiveAt,
+        safeAreaEdges: bottomToolbar.safeAreaEdges,
+        leading: bottomToolbar.leading,
+        center: bottomToolbar.center,
+        trailing: bottomToolbar.trailing
+      }
+    ) : null
+  ] }) : void 0;
+  const scrollHeader = headerPlacement === "scroll";
+  const scrollFooter = footerPlacement === "scroll";
+  return /* @__PURE__ */ jsxs(
+    Pane,
+    {
+      header: scrollHeader ? void 0 : panelHeader,
+      footer: scrollFooter ? void 0 : panelFooter,
+      chromePlacement: headerPlacement === "auto" || footerPlacement === "auto" ? "auto" : "fixed",
+      contentElement: pane?.contentElement,
+      contentLabel: pane?.contentLabel,
+      separators: pane?.separators,
+      safeAreaEdges: pane?.safeAreaEdges,
+      chromeDividers: pane?.chromeDividers,
+      appearance: pane?.appearance,
+      deepInset: pane?.deepInset,
+      tabIndex: pane?.tabIndex,
+      outlined: pane?.outlined,
+      children: [
+        scrollHeader ? panelHeader : null,
+        content,
+        scrollFooter ? panelFooter : null
+      ]
+    }
+  );
+}
+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, panelToggleGroup, relocatedPanelGroups };
+
+//# sourceMappingURL=chunk-TTGIHMDR.js.map