@kerfjs/ui 4.4.1 → 5.0.0-beta.4

package/dist/chunk-7LDCTU7D.js

@@ -0,0 +1,134 @@
+import { LucideIcon } from './chunk-W2FK7ZNY.js';
+import { Search, X } from 'lucide';
+import { jsx, jsxs, Fragment } from 'kerfjs/jsx-runtime';
+
+function orderedParts(query, tokens) {
+  const ordered = tokens.map((token, index) => ({ token, index, offset: Math.max(0, Math.min(query.length, token.offset ?? query.length)) })).sort((left, right) => left.offset - right.offset || left.index - right.index);
+  const parts = [];
+  let cursor = 0;
+  for (const { token, offset } of ordered) {
+    parts.push({ kind: "text", value: query.slice(cursor, offset) });
+    parts.push({ kind: "token", token: { ...token, offset } });
+    cursor = offset;
+  }
+  parts.push({ kind: "text", value: query.slice(cursor) });
+  return parts;
+}
+function CloseIcon() {
+  return /* @__PURE__ */ jsx(LucideIcon, { icon: X, name: "x" });
+}
+function TokenSearchField({
+  id,
+  label,
+  query = "",
+  tokens = [],
+  placeholder = "Search",
+  tokenPlaceholder = "Add search\u2026",
+  disabled = false,
+  autofocus = false,
+  collapsible = false,
+  expanded = false,
+  expandAction = "expand-token-search",
+  expandLabel,
+  leading,
+  trailing,
+  editAction = "edit-search-token",
+  removeAction = "remove-search-token",
+  clearAction = "clear-token-search",
+  clearLabel = "Clear search",
+  className = "",
+  editorAttributes = {}
+}) {
+  const parts = orderedParts(query, tokens);
+  const key = `${id}:${tokens.map((token) => token.value).join("|")}`;
+  const resolvedExpanded = !collapsible || expanded || query.length > 0 || tokens.length > 0;
+  return /* @__PURE__ */ jsx("div", { class: `kui-token-search ${className}`.trim(), "data-component": "token-search-field", "data-token-search-id": id, "data-disabled": String(disabled), "data-collapsible": String(collapsible), "data-expanded": String(resolvedExpanded), "data-has-trailing": String(Boolean(trailing)), children: !resolvedExpanded ? /* @__PURE__ */ jsx("button", { type: "button", class: "kui-token-search__expand", "data-action": expandAction, "aria-label": expandLabel ?? label, title: expandLabel ?? label, disabled, children: /* @__PURE__ */ jsx(LucideIcon, { icon: Search, name: "search" }) }) : /* @__PURE__ */ jsxs(Fragment, { children: [
+    /* @__PURE__ */ jsx("span", { class: "kui-token-search__leading", "aria-hidden": "true", children: leading ?? /* @__PURE__ */ jsx(LucideIcon, { icon: Search, name: "search" }) }),
+    /* @__PURE__ */ jsx(
+      "div",
+      {
+        ...editorAttributes,
+        class: "kui-token-search__editor",
+        "data-key": key,
+        "data-morph-skip": true,
+        "data-token-search-editor": id,
+        "data-token-count": tokens.length,
+        "data-placeholder": tokens.length ? tokenPlaceholder : placeholder,
+        role: "searchbox",
+        "aria-label": label,
+        "aria-disabled": disabled ? "true" : void 0,
+        contenteditable: disabled ? "false" : "true",
+        spellcheck: "false",
+        autofocus,
+        children: parts.map((part) => part.kind === "text" ? /* @__PURE__ */ jsx("span", { "data-token-search-text": true, "data-empty": String(part.value.length === 0), children: part.value || (tokens.length ? "\u200B" : "") }) : /* @__PURE__ */ jsxs("span", { class: "kui-token-search__token", contenteditable: "false", "data-component": "token-search-token", "data-token-value": part.token.value, children: [
+          /* @__PURE__ */ jsx("button", { type: "button", class: "kui-token-search__token-edit", "data-action": editAction, "data-token-value": part.token.value, "aria-label": `Edit ${part.token.accessibleLabel ?? part.token.label}`, disabled, children: part.token.label }),
+          /* @__PURE__ */ jsx("button", { type: "button", class: "kui-token-search__token-remove", "data-action": removeAction, "data-token-value": part.token.value, "aria-label": `Remove ${part.token.accessibleLabel ?? part.token.label}`, disabled, children: /* @__PURE__ */ jsx(CloseIcon, {}) })
+        ] }))
+      }
+    ),
+    (query || tokens.length > 0) && /* @__PURE__ */ jsx("button", { type: "button", class: "kui-token-search__clear", "data-action": clearAction, "aria-label": clearLabel, title: clearLabel, disabled, children: /* @__PURE__ */ jsx(CloseIcon, {}) }),
+    trailing && /* @__PURE__ */ jsx("span", { class: "kui-token-search__trailing", children: trailing })
+  ] }) });
+}
+function readTokenSearchField(editor, knownTokens = []) {
+  let query = "";
+  const tokens = [];
+  const visit = (node) => {
+    if (node.nodeType === Node.TEXT_NODE) {
+      query += (node.textContent ?? "").replaceAll("\xA0", " ").replaceAll("\u200B", "");
+      return;
+    }
+    if (!(node instanceof HTMLElement)) return;
+    if (node.matches('[data-component="token-search-token"]')) {
+      const value = node.dataset.tokenValue;
+      const known = knownTokens.find((token) => token.value === value);
+      if (known) tokens.push({ ...known, offset: query.length });
+      else if (value) tokens.push({ value, label: value, offset: query.length });
+      return;
+    }
+    if (node.tagName === "BR") {
+      query += " ";
+      return;
+    }
+    for (const child of node.childNodes) visit(child);
+  };
+  for (const child of editor.childNodes) visit(child);
+  return { query, tokens };
+}
+function placeTokenSearchCaret(editor, offset) {
+  editor.focus({ preventScroll: true });
+  const selection = globalThis.getSelection();
+  if (!selection) return;
+  const range = document.createRange();
+  if (offset === void 0) {
+    range.selectNodeContents(editor);
+    range.collapse(false);
+  } else {
+    let remaining = Math.max(0, offset);
+    let found = false;
+    const walker = document.createTreeWalker(editor, NodeFilter.SHOW_TEXT, {
+      acceptNode: (node) => node.parentElement?.closest('[data-component="token-search-token"]') ? NodeFilter.FILTER_REJECT : NodeFilter.FILTER_ACCEPT
+    });
+    for (let node = walker.nextNode(); node; node = walker.nextNode()) {
+      const source = node.textContent ?? "";
+      const length = source.replaceAll("\u200B", "").length;
+      if (remaining <= length) {
+        range.setStart(node, source === "\u200B" ? 0 : Math.min(remaining, source.length));
+        range.collapse(true);
+        found = true;
+        break;
+      }
+      remaining -= length;
+    }
+    if (!found) {
+      range.selectNodeContents(editor);
+      range.collapse(false);
+    }
+  }
+  selection.removeAllRanges();
+  selection.addRange(range);
+}
+
+export { TokenSearchField, placeTokenSearchCaret, readTokenSearchField };
+
+//# sourceMappingURL=chunk-7LDCTU7D.js.map

package/dist/chunk-7LDCTU7D.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/token-search-field.tsx"],"names":[],"mappings":"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","file":"chunk-7LDCTU7D.js","sourcesContent":["import type { SafeHtml } from 'kerfjs';\nimport { Search, X } from 'lucide';\n\nimport { LucideIcon } from './lucide-icon.js';\n\nexport interface TokenSearchToken {\n  value: string;\n  label: string;\n  offset?: number;\n  accessibleLabel?: string;\n}\n\nexport interface TokenSearchFieldProps {\n  id: string;\n  label: string;\n  query?: string;\n  tokens?: readonly TokenSearchToken[];\n  placeholder?: string;\n  tokenPlaceholder?: string;\n  disabled?: boolean;\n  autofocus?: boolean;\n  /** Allow an empty field to render as one iconic action. */\n  collapsible?: boolean;\n  /** Keep an empty collapsible field open while the application owns focus. */\n  expanded?: boolean;\n  expandAction?: string;\n  expandLabel?: string;\n  leading?: SafeHtml;\n  trailing?: SafeHtml;\n  editAction?: string;\n  removeAction?: string;\n  clearAction?: string;\n  clearLabel?: string;\n  className?: string;\n  editorAttributes?: Readonly<Record<`data-${string}`, string>>;\n}\n\nexport interface TokenSearchFieldValue {\n  query: string;\n  tokens: TokenSearchToken[];\n}\n\ntype TokenSearchPart =\n  | { kind: 'text'; value: string }\n  | { kind: 'token'; token: TokenSearchToken };\n\nfunction orderedParts(query: string, tokens: readonly TokenSearchToken[]): TokenSearchPart[] {\n  const ordered = tokens\n    .map((token, index) => ({ token, index, offset: Math.max(0, Math.min(query.length, token.offset ?? query.length)) }))\n    .sort((left, right) => left.offset - right.offset || left.index - right.index);\n  const parts: TokenSearchPart[] = [];\n  let cursor = 0;\n  for (const { token, offset } of ordered) {\n    parts.push({ kind: 'text', value: query.slice(cursor, offset) });\n    parts.push({ kind: 'token', token: { ...token, offset } });\n    cursor = offset;\n  }\n  parts.push({ kind: 'text', value: query.slice(cursor) });\n  return parts;\n}\n\nfunction CloseIcon() {\n  return <LucideIcon icon={X} name=\"x\" />;\n}\n\nexport function TokenSearchField({\n  id,\n  label,\n  query = '',\n  tokens = [],\n  placeholder = 'Search',\n  tokenPlaceholder = 'Add search…',\n  disabled = false,\n  autofocus = false,\n  collapsible = false,\n  expanded = false,\n  expandAction = 'expand-token-search',\n  expandLabel,\n  leading,\n  trailing,\n  editAction = 'edit-search-token',\n  removeAction = 'remove-search-token',\n  clearAction = 'clear-token-search',\n  clearLabel = 'Clear search',\n  className = '',\n  editorAttributes = {},\n}: TokenSearchFieldProps) {\n  const parts = orderedParts(query, tokens);\n  const key = `${id}:${tokens.map((token) => token.value).join('|')}`;\n  const resolvedExpanded = !collapsible || expanded || query.length > 0 || tokens.length > 0;\n  return <div class={`kui-token-search ${className}`.trim()} data-component=\"token-search-field\" data-token-search-id={id} data-disabled={String(disabled)} data-collapsible={String(collapsible)} data-expanded={String(resolvedExpanded)} data-has-trailing={String(Boolean(trailing))}>\n    {!resolvedExpanded\n      ? <button type=\"button\" class=\"kui-token-search__expand\" data-action={expandAction} aria-label={expandLabel ?? label} title={expandLabel ?? label} disabled={disabled}><LucideIcon icon={Search} name=\"search\" /></button>\n      : <>\n        <span class=\"kui-token-search__leading\" aria-hidden=\"true\">{leading ?? <LucideIcon icon={Search} name=\"search\" />}</span>\n        <div\n          {...editorAttributes}\n          class=\"kui-token-search__editor\"\n          data-key={key}\n          data-morph-skip\n          data-token-search-editor={id}\n          data-token-count={tokens.length}\n          data-placeholder={tokens.length ? tokenPlaceholder : placeholder}\n          role=\"searchbox\"\n          aria-label={label}\n          aria-disabled={disabled ? 'true' : undefined}\n          contenteditable={disabled ? 'false' : 'true'}\n          spellcheck=\"false\"\n          autofocus={autofocus}\n        >{parts.map((part) => part.kind === 'text'\n          ? <span data-token-search-text data-empty={String(part.value.length === 0)}>{part.value || (tokens.length ? '\\u200b' : '')}</span>\n          : <span class=\"kui-token-search__token\" contenteditable=\"false\" data-component=\"token-search-token\" data-token-value={part.token.value}>\n            <button type=\"button\" class=\"kui-token-search__token-edit\" data-action={editAction} data-token-value={part.token.value} aria-label={`Edit ${part.token.accessibleLabel ?? part.token.label}`} disabled={disabled}>{part.token.label}</button>\n            <button type=\"button\" class=\"kui-token-search__token-remove\" data-action={removeAction} data-token-value={part.token.value} aria-label={`Remove ${part.token.accessibleLabel ?? part.token.label}`} disabled={disabled}><CloseIcon /></button>\n          </span>)}</div>\n        {(query || tokens.length > 0) && <button type=\"button\" class=\"kui-token-search__clear\" data-action={clearAction} aria-label={clearLabel} title={clearLabel} disabled={disabled}><CloseIcon /></button>}\n        {trailing && <span class=\"kui-token-search__trailing\">{trailing}</span>}\n      </>}\n  </div>;\n}\n\n/** Read editable text and ordered token offsets from a rendered TokenSearchField editor. */\nexport function readTokenSearchField(editor: HTMLElement, knownTokens: readonly TokenSearchToken[] = []): TokenSearchFieldValue {\n  let query = '';\n  const tokens: TokenSearchToken[] = [];\n  const visit = (node: Node): void => {\n    if (node.nodeType === Node.TEXT_NODE) {\n      query += (node.textContent ?? '').replaceAll('\\u00a0', ' ').replaceAll('\\u200b', '');\n      return;\n    }\n    if (!(node instanceof HTMLElement)) return;\n    if (node.matches('[data-component=\"token-search-token\"]')) {\n      const value = node.dataset.tokenValue;\n      const known = knownTokens.find((token) => token.value === value);\n      if (known) tokens.push({ ...known, offset: query.length });\n      else if (value) tokens.push({ value, label: value, offset: query.length });\n      return;\n    }\n    if (node.tagName === 'BR') {\n      query += ' ';\n      return;\n    }\n    for (const child of node.childNodes) visit(child);\n  };\n  for (const child of editor.childNodes) visit(child);\n  return { query, tokens };\n}\n\n/** Focus an editor and place its caret at a text offset, skipping atomic token chips. */\nexport function placeTokenSearchCaret(editor: HTMLElement, offset?: number): void {\n  editor.focus({ preventScroll: true });\n  const selection = globalThis.getSelection();\n  if (!selection) return;\n  const range = document.createRange();\n  if (offset === undefined) {\n    range.selectNodeContents(editor);\n    range.collapse(false);\n  } else {\n    let remaining = Math.max(0, offset);\n    let found = false;\n    const walker = document.createTreeWalker(editor, NodeFilter.SHOW_TEXT, {\n      acceptNode: (node) => node.parentElement?.closest('[data-component=\"token-search-token\"]')\n        ? NodeFilter.FILTER_REJECT\n        : NodeFilter.FILTER_ACCEPT,\n    });\n    for (let node = walker.nextNode(); node; node = walker.nextNode()) {\n      const source = node.textContent ?? '';\n      const length = source.replaceAll('\\u200b', '').length;\n      if (remaining <= length) {\n        range.setStart(node, source === '\\u200b' ? 0 : Math.min(remaining, source.length));\n        range.collapse(true);\n        found = true;\n        break;\n      }\n      remaining -= length;\n    }\n    if (!found) {\n      range.selectNodeContents(editor);\n      range.collapse(false);\n    }\n  }\n  selection.removeAllRanges();\n  selection.addRange(range);\n}\n"]}

package/dist/{chunk-4HHCYSGT.js → chunk-AQNKJRFH.js}

@@ -1,4 +1,4 @@
-import { resizeRegionFromPointer, clampRegionSize } from './chunk-3O7ZEUW2.js';
+import { resizeRegionFromPointer, clampRegionSize } from './chunk-M5JRI6MN.js';
 import { delegate } from 'kerfjs';
 
 function regionState(handle) {
@@ -76,4 +76,4 @@ function wireResizableRegions(root, { step = 16, largeStep = 64, onPreview, onCo
 
 export { wireResizableRegions };
 
-//# sourceMappingURL=chunk-4HHCYSGT.js.map
+//# sourceMappingURL=chunk-AQNKJRFH.js.map

package/dist/{chunk-4HHCYSGT.js.map → chunk-AQNKJRFH.js.map}

@@ -1 +1 @@
-{"version":3,"sources":["../src/wire-resizable-regions.ts"],"names":[],"mappings":"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","file":"chunk-4HHCYSGT.js","sourcesContent":["import { delegate } from 'kerfjs';\n\nimport { clampRegionSize, type ResizableRegionAxis, type ResizableRegionEdge, resizeRegionFromPointer } from './resizable-region.js';\n\nexport interface ResizeCommit {\n  id: string;\n  size: number;\n  source: 'keyboard' | 'pointer';\n}\n\nexport interface WireResizableRegionsOptions {\n  step?: number;\n  largeStep?: number;\n  onPreview?: (change: ResizeCommit) => void;\n  onCommit: (change: ResizeCommit) => void;\n}\n\ninterface RegionState {\n  region: HTMLElement;\n  handle: HTMLElement;\n  id: string;\n  axis: ResizableRegionAxis;\n  edge: ResizableRegionEdge;\n  min: number;\n  max: number;\n  size: number;\n}\n\nfunction regionState(handle: Element): RegionState | undefined {\n  const region = handle.closest<HTMLElement>('[data-component=\"resizable-region\"]');\n  if (!(region instanceof HTMLElement) || !(handle instanceof HTMLElement)) return undefined;\n  const id = region.dataset.regionId;\n  const axis = region.dataset.axis;\n  const edge = region.dataset.edge;\n  const min = Number(handle.getAttribute('aria-valuemin'));\n  const max = Number(handle.getAttribute('aria-valuemax'));\n  const size = Number(handle.getAttribute('aria-valuenow'));\n  if (!id || (axis !== 'horizontal' && axis !== 'vertical') || (edge !== 'start' && edge !== 'end') || !Number.isFinite(min) || !Number.isFinite(max) || !Number.isFinite(size)) return undefined;\n  return { region, handle, id, axis, edge, min, max, size };\n}\n\nfunction preview(state: RegionState, size: number, onPreview?: (change: ResizeCommit) => void) {\n  const next = clampRegionSize(size, state.min, state.max);\n  state.region.style.setProperty('--kui-resizable-region-size', `${next}px`);\n  state.handle.setAttribute('aria-valuenow', String(next));\n  onPreview?.({ id: state.id, size: next, source: 'pointer' });\n  return next;\n}\n\n/** Wire pointer and separator-keyboard behavior for every ResizableRegion below root. */\nexport function wireResizableRegions(root: HTMLElement, { step = 16, largeStep = 64, onPreview, onCommit }: WireResizableRegionsOptions) {\n  let stopPointer: (() => void) | undefined;\n\n  const stopKeydown = delegate(root, 'keydown', '[data-kui-resize-handle]', (event, handle) => {\n    const keyboardEvent = event as KeyboardEvent;\n    const state = regionState(handle);\n    if (!state) return;\n    let next: number | undefined;\n    if (keyboardEvent.key === 'Home') next = state.min;\n    if (keyboardEvent.key === 'End') next = state.max;\n    const increment = keyboardEvent.shiftKey ? largeStep : step;\n    if (state.axis === 'horizontal' && keyboardEvent.key === 'ArrowLeft') next = resizeRegionFromPointer(state.size, -increment, state.edge);\n    if (state.axis === 'horizontal' && keyboardEvent.key === 'ArrowRight') next = resizeRegionFromPointer(state.size, increment, state.edge);\n    if (state.axis === 'vertical' && keyboardEvent.key === 'ArrowUp') next = resizeRegionFromPointer(state.size, -increment, state.edge);\n    if (state.axis === 'vertical' && keyboardEvent.key === 'ArrowDown') next = resizeRegionFromPointer(state.size, increment, state.edge);\n    if (next === undefined) return;\n    keyboardEvent.preventDefault();\n    const size = clampRegionSize(next, state.min, state.max);\n    state.region.style.setProperty('--kui-resizable-region-size', `${size}px`);\n    state.handle.setAttribute('aria-valuenow', String(size));\n    onCommit({ id: state.id, size, source: 'keyboard' });\n  });\n\n  const stopPointerDown = delegate(root, 'pointerdown', '[data-kui-resize-handle]', (event, handle) => {\n    const pointerEvent = event as PointerEvent;\n    if (pointerEvent.button !== 0) return;\n    const state = regionState(handle);\n    if (!state) return;\n    pointerEvent.preventDefault();\n    state.handle.setPointerCapture?.(pointerEvent.pointerId);\n    const startCoordinate = state.axis === 'horizontal' ? pointerEvent.clientX : pointerEvent.clientY;\n    let next = state.size;\n    const move = (moveEvent: PointerEvent) => {\n      const coordinate = state.axis === 'horizontal' ? moveEvent.clientX : moveEvent.clientY;\n      next = preview(state, resizeRegionFromPointer(state.size, coordinate - startCoordinate, state.edge), onPreview);\n    };\n    const finish = () => {\n      root.removeEventListener('pointermove', move);\n      root.removeEventListener('pointerup', finish);\n      root.removeEventListener('pointercancel', finish);\n      stopPointer = undefined;\n      onCommit({ id: state.id, size: next, source: 'pointer' });\n    };\n    stopPointer?.();\n    stopPointer = finish;\n    root.addEventListener('pointermove', move);\n    root.addEventListener('pointerup', finish, { once: true });\n    root.addEventListener('pointercancel', finish, { once: true });\n  });\n\n  return () => {\n    stopPointer?.();\n    stopKeydown();\n    stopPointerDown();\n  };\n}\n"]}
+{"version":3,"sources":["../src/wire-resizable-regions.ts"],"names":[],"mappings":"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","file":"chunk-AQNKJRFH.js","sourcesContent":["import { delegate } from 'kerfjs';\n\nimport { clampRegionSize, type ResizableRegionAxis, type ResizableRegionEdge, resizeRegionFromPointer } from './resizable-region.js';\n\nexport interface ResizeCommit {\n  id: string;\n  size: number;\n  source: 'keyboard' | 'pointer';\n}\n\nexport interface WireResizableRegionsOptions {\n  step?: number;\n  largeStep?: number;\n  onPreview?: (change: ResizeCommit) => void;\n  onCommit: (change: ResizeCommit) => void;\n}\n\ninterface RegionState {\n  region: HTMLElement;\n  handle: HTMLElement;\n  id: string;\n  axis: ResizableRegionAxis;\n  edge: ResizableRegionEdge;\n  min: number;\n  max: number;\n  size: number;\n}\n\nfunction regionState(handle: Element): RegionState | undefined {\n  const region = handle.closest<HTMLElement>('[data-component=\"resizable-region\"]');\n  if (!(region instanceof HTMLElement) || !(handle instanceof HTMLElement)) return undefined;\n  const id = region.dataset.regionId;\n  const axis = region.dataset.axis;\n  const edge = region.dataset.edge;\n  const min = Number(handle.getAttribute('aria-valuemin'));\n  const max = Number(handle.getAttribute('aria-valuemax'));\n  const size = Number(handle.getAttribute('aria-valuenow'));\n  if (!id || (axis !== 'horizontal' && axis !== 'vertical') || (edge !== 'start' && edge !== 'end') || !Number.isFinite(min) || !Number.isFinite(max) || !Number.isFinite(size)) return undefined;\n  return { region, handle, id, axis, edge, min, max, size };\n}\n\nfunction preview(state: RegionState, size: number, onPreview?: (change: ResizeCommit) => void) {\n  const next = clampRegionSize(size, state.min, state.max);\n  state.region.style.setProperty('--kui-resizable-region-size', `${next}px`);\n  state.handle.setAttribute('aria-valuenow', String(next));\n  onPreview?.({ id: state.id, size: next, source: 'pointer' });\n  return next;\n}\n\n/** Wire pointer and separator-keyboard behavior for every ResizableRegion below root. */\nexport function wireResizableRegions(root: HTMLElement, { step = 16, largeStep = 64, onPreview, onCommit }: WireResizableRegionsOptions) {\n  let stopPointer: (() => void) | undefined;\n\n  const stopKeydown = delegate(root, 'keydown', '[data-kui-resize-handle]', (event, handle) => {\n    const keyboardEvent = event as KeyboardEvent;\n    const state = regionState(handle);\n    if (!state) return;\n    let next: number | undefined;\n    if (keyboardEvent.key === 'Home') next = state.min;\n    if (keyboardEvent.key === 'End') next = state.max;\n    const increment = keyboardEvent.shiftKey ? largeStep : step;\n    if (state.axis === 'horizontal' && keyboardEvent.key === 'ArrowLeft') next = resizeRegionFromPointer(state.size, -increment, state.edge);\n    if (state.axis === 'horizontal' && keyboardEvent.key === 'ArrowRight') next = resizeRegionFromPointer(state.size, increment, state.edge);\n    if (state.axis === 'vertical' && keyboardEvent.key === 'ArrowUp') next = resizeRegionFromPointer(state.size, -increment, state.edge);\n    if (state.axis === 'vertical' && keyboardEvent.key === 'ArrowDown') next = resizeRegionFromPointer(state.size, increment, state.edge);\n    if (next === undefined) return;\n    keyboardEvent.preventDefault();\n    const size = clampRegionSize(next, state.min, state.max);\n    state.region.style.setProperty('--kui-resizable-region-size', `${size}px`);\n    state.handle.setAttribute('aria-valuenow', String(size));\n    onCommit({ id: state.id, size, source: 'keyboard' });\n  });\n\n  const stopPointerDown = delegate(root, 'pointerdown', '[data-kui-resize-handle]', (event, handle) => {\n    const pointerEvent = event as PointerEvent;\n    if (pointerEvent.button !== 0) return;\n    const state = regionState(handle);\n    if (!state) return;\n    pointerEvent.preventDefault();\n    state.handle.setPointerCapture?.(pointerEvent.pointerId);\n    const startCoordinate = state.axis === 'horizontal' ? pointerEvent.clientX : pointerEvent.clientY;\n    let next = state.size;\n    const move = (moveEvent: PointerEvent) => {\n      const coordinate = state.axis === 'horizontal' ? moveEvent.clientX : moveEvent.clientY;\n      next = preview(state, resizeRegionFromPointer(state.size, coordinate - startCoordinate, state.edge), onPreview);\n    };\n    const finish = () => {\n      root.removeEventListener('pointermove', move);\n      root.removeEventListener('pointerup', finish);\n      root.removeEventListener('pointercancel', finish);\n      stopPointer = undefined;\n      onCommit({ id: state.id, size: next, source: 'pointer' });\n    };\n    stopPointer?.();\n    stopPointer = finish;\n    root.addEventListener('pointermove', move);\n    root.addEventListener('pointerup', finish, { once: true });\n    root.addEventListener('pointercancel', finish, { once: true });\n  });\n\n  return () => {\n    stopPointer?.();\n    stopKeydown();\n    stopPointerDown();\n  };\n}\n"]}

package/dist/{chunk-NHXX4JI5.js → chunk-CTQKI2XL.js}

@@ -3,7 +3,7 @@ import { jsxs, jsx, Fragment } from 'kerfjs/jsx-runtime';
 
 function Select({ name, value, label, ariaLabel, choices, className = "", placeholder, disabled = false, fitMenu = false, renderSelected }) {
   const selected = choices.find((choice) => choice.value === value);
-  const icon = (choice, selectedIcon = false) => /* @__PURE__ */ jsx("span", { slot: "start", class: `kui-select__icon${selectedIcon ? " kui-select__icon--selected" : ""}`, style: choice.color ? `color:${choice.color}` : void 0, children: choice.icon ? /* @__PURE__ */ jsx(LucideIcon, { icon: choice.icon, name: choice.iconName ?? choice.label.toLowerCase().replaceAll(" ", "-") }) : null });
+  const icon = (choice, selectedIcon = false) => /* @__PURE__ */ jsx("span", { "data-key": `${name}:${choice.value}:${selectedIcon ? "selected" : "option"}`, "data-morph-skip": true, slot: "start", class: `kui-select__icon${selectedIcon ? " kui-select__icon--selected" : ""}`, style: choice.color ? `color:${choice.color}` : void 0, children: choice.icon ? /* @__PURE__ */ jsx(LucideIcon, { icon: choice.icon, name: choice.iconName ?? choice.label.toLowerCase().replaceAll(" ", "-") }) : null });
   const option = (choice) => /* @__PURE__ */ jsxs(Fragment, { children: [
     choice.separatorBefore && /* @__PURE__ */ jsx("wa-divider", {}),
     /* @__PURE__ */ jsxs("wa-option", { value: choice.value, children: [
@@ -14,7 +14,7 @@ function Select({ name, value, label, ariaLabel, choices, className = "", placeh
   const groups = [...new Set(choices.map((choice) => choice.group).filter((group) => Boolean(group)))];
   const ungrouped = choices.filter((choice) => !choice.group);
   return /* @__PURE__ */ jsxs("wa-select", { class: `kui-select${renderSelected ? " kui-select--custom-selected" : ""}${fitMenu ? " kui-select--fit-menu" : ""} ${className}`.trim(), "data-component": "select", name, label, "aria-label": ariaLabel, value, placeholder, disabled, children: [
-    selected && (renderSelected ? /* @__PURE__ */ jsx("span", { slot: "start", class: "kui-select__custom-selected", children: renderSelected(selected) }) : selected.icon ? icon(selected, true) : null),
+    selected && (renderSelected ? /* @__PURE__ */ jsx("span", { "data-key": `${name}:${value}:custom-selected`, slot: "start", class: "kui-select__custom-selected", children: renderSelected(selected) }) : selected.icon ? icon(selected, true) : null),
     ungrouped.map(option),
     groups.map((group, index) => /* @__PURE__ */ jsxs("div", { class: `kui-select__group${index > 0 || ungrouped.length > 0 ? " kui-select__group--separated" : ""}`, role: "group", "aria-label": group, children: [
       /* @__PURE__ */ jsx("span", { class: "kui-select__group-title", children: group }),
@@ -25,4 +25,4 @@ function Select({ name, value, label, ariaLabel, choices, className = "", placeh
 
 export { Select };
 
-//# sourceMappingURL=chunk-NHXX4JI5.js.map
+//# sourceMappingURL=chunk-CTQKI2XL.js.map

package/dist/chunk-CTQKI2XL.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/select.tsx"],"names":[],"mappings":"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","file":"chunk-CTQKI2XL.js","sourcesContent":["import type { SafeHtml } from 'kerfjs';\n\nimport { LucideIcon, type LucideNode } from './lucide-icon.js';\n\nexport interface SelectChoice<Value extends string = string> {\n  value: Value;\n  label: string;\n  icon?: LucideNode;\n  iconName?: string;\n  color?: string;\n  group?: string;\n  separatorBefore?: boolean;\n}\n\nexport interface SelectProps<Value extends string = string> {\n  name: string;\n  value: Value;\n  label?: string;\n  ariaLabel?: string;\n  choices: readonly SelectChoice<Value>[];\n  className?: string;\n  placeholder?: string;\n  disabled?: boolean;\n  fitMenu?: boolean;\n  renderSelected?: (choice: SelectChoice<Value>) => SafeHtml;\n}\n\nexport function Select<Value extends string>({ name, value, label, ariaLabel, choices, className = '', placeholder, disabled = false, fitMenu = false, renderSelected }: SelectProps<Value>) {\n  const selected = choices.find((choice) => choice.value === value);\n  const icon = (choice: SelectChoice<Value>, selectedIcon = false) => <span data-key={`${name}:${choice.value}:${selectedIcon ? 'selected' : 'option'}`} data-morph-skip slot=\"start\" class={`kui-select__icon${selectedIcon ? ' kui-select__icon--selected' : ''}`} style={choice.color ? `color:${choice.color}` : undefined}>{choice.icon ? <LucideIcon icon={choice.icon} name={choice.iconName ?? choice.label.toLowerCase().replaceAll(' ', '-')} /> : null}</span>;\n  const option = (choice: SelectChoice<Value>) => <>{choice.separatorBefore && <wa-divider></wa-divider>}<wa-option value={choice.value}>{choice.icon ? icon(choice) : null}{choice.label}</wa-option></>;\n  const groups = [...new Set(choices.map((choice) => choice.group).filter((group): group is string => Boolean(group)))];\n  const ungrouped = choices.filter((choice) => !choice.group);\n  return <wa-select class={`kui-select${renderSelected ? ' kui-select--custom-selected' : ''}${fitMenu ? ' kui-select--fit-menu' : ''} ${className}`.trim()} data-component=\"select\" name={name} label={label} aria-label={ariaLabel} value={value} placeholder={placeholder} disabled={disabled}>\n    {selected && (renderSelected ? <span data-key={`${name}:${value}:custom-selected`} slot=\"start\" class=\"kui-select__custom-selected\">{renderSelected(selected)}</span> : selected.icon ? icon(selected, true) : null)}\n    {ungrouped.map(option)}\n    {groups.map((group, index) => <div class={`kui-select__group${index > 0 || ungrouped.length > 0 ? ' kui-select__group--separated' : ''}`} role=\"group\" aria-label={group}><span class=\"kui-select__group-title\">{group}</span>{choices.filter((choice) => choice.group === group).map(option)}</div>)}\n  </wa-select>;\n}\n"]}

package/dist/chunk-EGHL5S4P.js

@@ -0,0 +1,33 @@
+import { filterDataAttributes, filterControlAttributes } from './chunk-7BR3DO2A.js';
+import { jsxs, jsx } from 'kerfjs/jsx-runtime';
+
+var PROTECTED_ROOT_DATA_ATTRIBUTES = /* @__PURE__ */ new Set([
+  "data-component",
+  "data-action",
+  "data-item-id",
+  "data-has-icon",
+  "data-multiline",
+  "data-state",
+  "data-selected",
+  "data-pressed"
+]);
+var PROTECTED_TRAILING_DATA_ATTRIBUTES = /* @__PURE__ */ new Set([
+  "data-component",
+  "data-action",
+  "data-item-id"
+]);
+function MenuActionRow({ label, icon, action, itemId, selected = false, pressed, accessibleLabel, title, multiline = false, state, disabled = false, tabIndex, trailingAction, trailingActionLabel, trailingActionIcon, trailingActionDisabled = false, trailingActionTitle, className = "", style, rootAttributes = {}, trailingActionAttributes = {} }) {
+  const extensionRootAttributes = filterDataAttributes(rootAttributes, PROTECTED_ROOT_DATA_ATTRIBUTES);
+  const extensionTrailingAttributes = filterControlAttributes(trailingActionAttributes, PROTECTED_TRAILING_DATA_ATTRIBUTES);
+  return /* @__PURE__ */ jsxs("div", { ...extensionRootAttributes, class: `kui-menu-action-row ${className}`.trim(), style, "data-component": "menu-action-row", "data-item-id": itemId, "data-has-icon": String(Boolean(icon)), "data-multiline": multiline ? "true" : void 0, "data-state": state, "data-selected": String(selected), "data-pressed": pressed === void 0 ? void 0 : String(pressed), children: [
+    /* @__PURE__ */ jsxs("button", { type: "button", class: "kui-menu-action-row__primary", title, disabled, tabindex: tabIndex, "data-action": action, "data-item-id": itemId, "aria-label": accessibleLabel, "aria-current": selected ? "page" : void 0, "aria-pressed": pressed === void 0 ? void 0 : String(pressed), children: [
+      icon && /* @__PURE__ */ jsx("span", { class: "kui-menu-action-row__icon", children: icon }),
+      /* @__PURE__ */ jsx("span", { class: "kui-menu-action-row__label", children: label })
+    ] }),
+    /* @__PURE__ */ jsx("button", { ...extensionTrailingAttributes, type: "button", class: "kui-menu-action-row__trailing-action", "data-action": trailingAction, "data-item-id": itemId, "aria-label": trailingActionLabel, title: trailingActionTitle ?? trailingActionLabel, disabled: trailingActionDisabled || void 0, children: trailingActionIcon })
+  ] });
+}
+
+export { MenuActionRow };
+
+//# sourceMappingURL=chunk-EGHL5S4P.js.map

package/dist/chunk-EGHL5S4P.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/menu-action-row.tsx"],"names":[],"mappings":";;;AAIA,IAAM,8BAAA,uBAAqC,GAAA,CAAI;AAAA,EAC7C,gBAAA;AAAA,EACA,aAAA;AAAA,EACA,cAAA;AAAA,EACA,eAAA;AAAA,EACA,gBAAA;AAAA,EACA,YAAA;AAAA,EACA,eAAA;AAAA,EACA;AACF,CAAC,CAAA;AACD,IAAM,kCAAA,uBAAyC,GAAA,CAAI;AAAA,EACjD,gBAAA;AAAA,EACA,aAAA;AAAA,EACA;AACF,CAAC,CAAA;AAsDM,SAAS,aAAA,CAAc,EAAE,KAAA,EAAO,IAAA,EAAM,QAAQ,MAAA,EAAQ,QAAA,GAAW,KAAA,EAAO,OAAA,EAAS,eAAA,EAAiB,KAAA,EAAO,SAAA,GAAY,KAAA,EAAO,OAAO,QAAA,GAAW,KAAA,EAAO,QAAA,EAAU,cAAA,EAAgB,mBAAA,EAAqB,kBAAA,EAAoB,sBAAA,GAAyB,KAAA,EAAO,qBAAqB,SAAA,GAAY,EAAA,EAAI,KAAA,EAAO,cAAA,GAAiB,EAAC,EAAG,wBAAA,GAA2B,IAAG,EAAuB;AACnX,EAAA,MAAM,uBAAA,GAA0B,oBAAA,CAAqB,cAAA,EAAgB,8BAA8B,CAAA;AACnG,EAAA,MAAM,2BAAA,GAA8B,uBAAA,CAAwB,wBAAA,EAA0B,kCAAkC,CAAA;AAExH,EAAA,4BAAQ,KAAA,EAAA,EAAK,GAAG,uBAAA,EAAyB,KAAA,EAAO,uBAAuB,SAAS,CAAA,CAAA,CAAG,IAAA,EAAK,EAAG,OAAc,gBAAA,EAAe,iBAAA,EAAkB,cAAA,EAAc,MAAA,EAAQ,iBAAe,MAAA,CAAO,OAAA,CAAQ,IAAI,CAAC,GAAG,gBAAA,EAAgB,SAAA,GAAY,MAAA,GAAS,MAAA,EAAW,cAAY,KAAA,EAAO,eAAA,EAAe,MAAA,CAAO,QAAQ,GAAG,cAAA,EAAc,OAAA,KAAY,SAAY,MAAA,GAAY,MAAA,CAAO,OAAO,CAAA,EACxW,QAAA,EAAA;AAAA,oBAAA,IAAA,CAAC,QAAA,EAAA,EAAO,IAAA,EAAK,QAAA,EAAS,KAAA,EAAM,8BAAA,EAA+B,OAAc,QAAA,EAAoB,QAAA,EAAU,QAAA,EAAU,aAAA,EAAa,MAAA,EAAQ,cAAA,EAAc,QAAQ,YAAA,EAAY,eAAA,EAAiB,cAAA,EAAc,QAAA,GAAW,MAAA,GAAS,MAAA,EAAW,cAAA,EAAc,OAAA,KAAY,MAAA,GAAY,MAAA,GAAY,MAAA,CAAO,OAAO,CAAA,EACnS,QAAA,EAAA;AAAA,MAAA,IAAA,oBAAQ,GAAA,CAAC,MAAA,EAAA,EAAK,KAAA,EAAM,2BAAA,EAA6B,QAAA,EAAA,IAAA,EAAK,CAAA;AAAA,sBACvD,GAAA,CAAC,MAAA,EAAA,EAAK,KAAA,EAAM,4BAAA,EAA8B,QAAA,EAAA,KAAA,EAAM;AAAA,KAAA,EAClD,CAAA;AAAA,oBACA,GAAA,CAAC,YAAQ,GAAG,2BAAA,EAA6B,MAAK,QAAA,EAAS,KAAA,EAAM,wCAAuC,aAAA,EAAa,cAAA,EAAgB,gBAAc,MAAA,EAAQ,YAAA,EAAY,qBAAqB,KAAA,EAAO,mBAAA,IAAuB,qBAAqB,QAAA,EAAU,sBAAA,IAA0B,QAAY,QAAA,EAAA,kBAAA,EAAmB;AAAA,GAAA,EAChT,CAAA;AACF","file":"chunk-EGHL5S4P.js","sourcesContent":["import type { SafeHtml } from 'kerfjs';\n\nimport { filterControlAttributes, filterDataAttributes } from './extension-attributes.js';\n\nconst PROTECTED_ROOT_DATA_ATTRIBUTES = new Set([\n  'data-component',\n  'data-action',\n  'data-item-id',\n  'data-has-icon',\n  'data-multiline',\n  'data-state',\n  'data-selected',\n  'data-pressed',\n]);\nconst PROTECTED_TRAILING_DATA_ATTRIBUTES = new Set([\n  'data-component',\n  'data-action',\n  'data-item-id',\n]);\n\ntype MenuActionRowRootAttributes = Readonly<\n  Record<`data-${string}`, string | undefined> & {\n    'data-component'?: never;\n    'data-action'?: never;\n    'data-item-id'?: never;\n    'data-has-icon'?: never;\n    'data-multiline'?: never;\n    'data-state'?: never;\n    'data-selected'?: never;\n    'data-pressed'?: never;\n  }\n>;\n\ntype MenuActionRowTrailingAttributes = Readonly<\n  Record<`data-${string}`, string | undefined> & {\n    'data-component'?: never;\n    'data-action'?: never;\n    'data-item-id'?: never;\n    popoverTarget?: string;\n    popoverTargetAction?: 'toggle' | 'show' | 'hide';\n    'aria-controls'?: string;\n    'aria-haspopup'?: 'dialog' | 'menu' | 'listbox' | 'tree' | 'grid' | 'true';\n  }\n>;\n\nexport interface MenuActionRowProps {\n  /** Visible dormant content for the primary button. Must not contain interactive descendants. */\n  label: string | SafeHtml;\n  /** Decorative dormant content for the primary button. Must not contain interactive descendants. */\n  icon?: SafeHtml;\n  action: string;\n  itemId?: string;\n  selected?: boolean;\n  pressed?: boolean;\n  accessibleLabel?: string;\n  title?: string;\n  multiline?: boolean;\n  state?: string;\n  disabled?: boolean;\n  tabIndex?: number;\n  trailingAction: string;\n  trailingActionLabel: string;\n  /** Decorative dormant content for the trailing button. Must not contain interactive descendants. */\n  trailingActionIcon: SafeHtml;\n  trailingActionDisabled?: boolean;\n  trailingActionTitle?: string;\n  className?: string;\n  style?: string;\n  rootAttributes?: MenuActionRowRootAttributes;\n  trailingActionAttributes?: MenuActionRowTrailingAttributes;\n}\n\nexport function MenuActionRow({ label, icon, action, itemId, selected = false, pressed, accessibleLabel, title, multiline = false, state, disabled = false, tabIndex, trailingAction, trailingActionLabel, trailingActionIcon, trailingActionDisabled = false, trailingActionTitle, className = '', style, rootAttributes = {}, trailingActionAttributes = {} }: MenuActionRowProps) {\n  const extensionRootAttributes = filterDataAttributes(rootAttributes, PROTECTED_ROOT_DATA_ATTRIBUTES);\n  const extensionTrailingAttributes = filterControlAttributes(trailingActionAttributes, PROTECTED_TRAILING_DATA_ATTRIBUTES);\n\n  return <div {...extensionRootAttributes} class={`kui-menu-action-row ${className}`.trim()} style={style} data-component=\"menu-action-row\" data-item-id={itemId} data-has-icon={String(Boolean(icon))} data-multiline={multiline ? 'true' : undefined} data-state={state} data-selected={String(selected)} data-pressed={pressed === undefined ? undefined : String(pressed)}>\n    <button type=\"button\" class=\"kui-menu-action-row__primary\" title={title} disabled={disabled} tabindex={tabIndex} data-action={action} data-item-id={itemId} aria-label={accessibleLabel} aria-current={selected ? 'page' : undefined} aria-pressed={pressed === undefined ? undefined : String(pressed)}>\n      {icon && <span class=\"kui-menu-action-row__icon\">{icon}</span>}\n      <span class=\"kui-menu-action-row__label\">{label}</span>\n    </button>\n    <button {...extensionTrailingAttributes} type=\"button\" class=\"kui-menu-action-row__trailing-action\" data-action={trailingAction} data-item-id={itemId} aria-label={trailingActionLabel} title={trailingActionTitle ?? trailingActionLabel} disabled={trailingActionDisabled || undefined}>{trailingActionIcon}</button>\n  </div>;\n}\n"]}

package/dist/chunk-H5AGGVU5.js

@@ -0,0 +1,75 @@
+import { placeTokenSearchCaret, readTokenSearchField } from './chunk-7LDCTU7D.js';
+import { delegate } from 'kerfjs';
+
+function editorFromEvent(root, event) {
+  const target = event.target;
+  if (!(target instanceof Element)) return;
+  const editor = target.closest("[data-token-search-editor]");
+  return editor && root.contains(editor) ? editor : void 0;
+}
+function caretQueryOffset(editor) {
+  const selection = editor.ownerDocument.getSelection();
+  if (!selection || selection.rangeCount === 0) return;
+  const selectionRange = selection.getRangeAt(0);
+  if (!editor.contains(selectionRange.startContainer)) return;
+  const prefixRange = editor.ownerDocument.createRange();
+  prefixRange.selectNodeContents(editor);
+  prefixRange.setEnd(selectionRange.startContainer, selectionRange.startOffset);
+  const prefix = editor.ownerDocument.createElement("div");
+  prefix.append(prefixRange.cloneContents());
+  return readTokenSearchField(prefix).query.length;
+}
+function replacementEditor(root, id) {
+  return [...root.querySelectorAll("[data-token-search-editor]")].find((editor) => editor.dataset.tokenSearchEditor === id);
+}
+function wireTokenSearchFields(root, { onSubmit }) {
+  const pending = /* @__PURE__ */ new WeakMap();
+  const onBeforeInput = (event) => {
+    const inputEvent = event;
+    const editor = editorFromEvent(root, event);
+    if (!editor || !inputEvent.inputType.startsWith("delete") || editor.ownerDocument.activeElement !== editor) return;
+    const field = editor.closest('[data-component="token-search-field"]');
+    const id = field?.dataset.tokenSearchId;
+    const offset = caretQueryOffset(editor);
+    if (!id || offset === void 0 || field?.dataset.disabled === "true") return;
+    pending.set(editor, {
+      id,
+      offset,
+      tokenCount: editor.querySelectorAll('[data-component="token-search-token"]').length
+    });
+  };
+  const onInput = (event) => {
+    const editor = editorFromEvent(root, event);
+    if (!editor) return;
+    const deletion = pending.get(editor);
+    pending.delete(editor);
+    if (!deletion || editor.querySelectorAll('[data-component="token-search-token"]').length >= deletion.tokenCount) return;
+    editor.ownerDocument.defaultView.requestAnimationFrame(() => {
+      const replacement = replacementEditor(root, deletion.id);
+      if (!replacement) return;
+      const active = replacement.ownerDocument.activeElement;
+      if (active !== editor && active !== replacement && active !== replacement.ownerDocument.body) return;
+      placeTokenSearchCaret(replacement, deletion.offset);
+    });
+  };
+  root.addEventListener("beforeinput", onBeforeInput, true);
+  root.addEventListener("input", onInput, true);
+  const stopSubmit = delegate(root, "keydown", "[data-token-search-editor]", (event, element) => {
+    const keyboardEvent = event;
+    const editor = element;
+    const field = editor.closest('[data-component="token-search-field"]');
+    const id = field?.dataset.tokenSearchId;
+    if (keyboardEvent.key !== "Enter" || keyboardEvent.isComposing || !id || field?.dataset.disabled === "true") return;
+    keyboardEvent.preventDefault();
+    onSubmit({ id, editor });
+  });
+  return () => {
+    root.removeEventListener("beforeinput", onBeforeInput, true);
+    root.removeEventListener("input", onInput, true);
+    stopSubmit();
+  };
+}
+
+export { wireTokenSearchFields };
+
+//# sourceMappingURL=chunk-H5AGGVU5.js.map

package/dist/chunk-H5AGGVU5.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/wire-token-search-fields.ts"],"names":[],"mappings":"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","file":"chunk-H5AGGVU5.js","sourcesContent":["import { delegate } from 'kerfjs';\n\nimport { placeTokenSearchCaret, readTokenSearchField } from './token-search-field.js';\n\nexport interface TokenSearchSubmit {\n  id: string;\n  editor: HTMLElement;\n}\n\nexport interface WireTokenSearchFieldsOptions {\n  onSubmit: (submission: TokenSearchSubmit) => void;\n}\n\ninterface PendingTokenDeletion {\n  id: string;\n  offset: number;\n  tokenCount: number;\n}\n\nfunction editorFromEvent(root: HTMLElement, event: Event): HTMLElement | undefined {\n  const target = event.target;\n  if (!(target instanceof Element)) return;\n  const editor = target.closest<HTMLElement>('[data-token-search-editor]');\n  return editor && root.contains(editor) ? editor : undefined;\n}\n\nfunction caretQueryOffset(editor: HTMLElement): number | undefined {\n  const selection = editor.ownerDocument.getSelection();\n  if (!selection || selection.rangeCount === 0) return;\n  const selectionRange = selection.getRangeAt(0);\n  if (!editor.contains(selectionRange.startContainer)) return;\n  const prefixRange = editor.ownerDocument.createRange();\n  prefixRange.selectNodeContents(editor);\n  prefixRange.setEnd(selectionRange.startContainer, selectionRange.startOffset);\n  const prefix = editor.ownerDocument.createElement('div');\n  prefix.append(prefixRange.cloneContents());\n  return readTokenSearchField(prefix).query.length;\n}\n\nfunction replacementEditor(root: HTMLElement, id: string): HTMLElement | undefined {\n  return [...root.querySelectorAll<HTMLElement>('[data-token-search-editor]')]\n    .find((editor) => editor.dataset.tokenSearchEditor === id);\n}\n\n/** Keep TokenSearchField wrapping, submit Enter, and preserve its caret across controlled token deletion. */\nexport function wireTokenSearchFields(root: HTMLElement, { onSubmit }: WireTokenSearchFieldsOptions) {\n  const pending = new WeakMap<HTMLElement, PendingTokenDeletion>();\n  const onBeforeInput = (event: Event) => {\n    const inputEvent = event as InputEvent;\n    const editor = editorFromEvent(root, event);\n    if (!editor || !inputEvent.inputType.startsWith('delete') || editor.ownerDocument.activeElement !== editor) return;\n    const field = editor.closest<HTMLElement>('[data-component=\"token-search-field\"]');\n    const id = field?.dataset.tokenSearchId;\n    const offset = caretQueryOffset(editor);\n    if (!id || offset === undefined || field?.dataset.disabled === 'true') return;\n    pending.set(editor, {\n      id,\n      offset,\n      tokenCount: editor.querySelectorAll('[data-component=\"token-search-token\"]').length,\n    });\n  };\n  const onInput = (event: Event) => {\n    const editor = editorFromEvent(root, event);\n    if (!editor) return;\n    const deletion = pending.get(editor);\n    pending.delete(editor);\n    if (!deletion || editor.querySelectorAll('[data-component=\"token-search-token\"]').length >= deletion.tokenCount) return;\n    editor.ownerDocument.defaultView!.requestAnimationFrame(() => {\n      const replacement = replacementEditor(root, deletion.id);\n      if (!replacement) return;\n      const active = replacement.ownerDocument.activeElement;\n      if (active !== editor && active !== replacement && active !== replacement.ownerDocument.body) return;\n      placeTokenSearchCaret(replacement, deletion.offset);\n    });\n  };\n  root.addEventListener('beforeinput', onBeforeInput, true);\n  root.addEventListener('input', onInput, true);\n\n  const stopSubmit = delegate(root, 'keydown', '[data-token-search-editor]', (event, element) => {\n    const keyboardEvent = event as KeyboardEvent;\n    const editor = element as HTMLElement;\n    const field = editor.closest<HTMLElement>('[data-component=\"token-search-field\"]');\n    const id = field?.dataset.tokenSearchId;\n    if (keyboardEvent.key !== 'Enter' || keyboardEvent.isComposing || !id || field?.dataset.disabled === 'true') return;\n    keyboardEvent.preventDefault();\n    onSubmit({ id, editor });\n  });\n  return () => {\n    root.removeEventListener('beforeinput', onBeforeInput, true);\n    root.removeEventListener('input', onInput, true);\n    stopSubmit();\n  };\n}\n"]}

package/dist/chunk-K3G72I6D.js

@@ -0,0 +1,24 @@
+import { ToolbarControlGroup } from './chunk-MFKMHK5W.js';
+import { Toolbar } from './chunk-DAFFDO33.js';
+import { jsxs, jsx } from 'kerfjs/jsx-runtime';
+
+function DialogHeader({ title, titleId, summary, summaryId, icon, iconClassName = "", actions, actionsLabel }) {
+  const titleContent = /* @__PURE__ */ jsx("div", { class: "kui-dialog-header__copy", children: /* @__PURE__ */ jsx("h2", { id: titleId, children: title }) });
+  const identity = /* @__PURE__ */ jsx(
+    ToolbarControlGroup,
+    {
+      appearance: "borderless",
+      className: "kui-dialog-header__identity",
+      children: icon ? [/* @__PURE__ */ jsx("span", { class: `kui-dialog-header__icon ${iconClassName}`.trim(), children: icon }), titleContent] : titleContent
+    }
+  );
+  const actionGroup = actions && /* @__PURE__ */ jsx(ToolbarControlGroup, { className: "kui-dialog-header__actions", label: actionsLabel, children: actions });
+  return /* @__PURE__ */ jsxs("div", { class: "kui-dialog-header", "data-component": "dialog-header", "data-has-icon": String(Boolean(icon)), "data-has-actions": String(Boolean(actions)), "data-has-summary": String(Boolean(summary)), children: [
+    /* @__PURE__ */ jsx(Toolbar, { leading: identity, trailing: actionGroup, divider: false, className: "kui-dialog-header__toolbar" }),
+    summary && /* @__PURE__ */ jsx("p", { class: "kui-dialog-header__summary", id: summaryId, children: summary })
+  ] });
+}
+
+export { DialogHeader };
+
+//# sourceMappingURL=chunk-K3G72I6D.js.map

package/dist/chunk-K3G72I6D.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/dialog-header.tsx"],"names":[],"mappings":";;;;AAgBO,SAAS,YAAA,CAAa,EAAE,KAAA,EAAO,OAAA,EAAS,OAAA,EAAS,SAAA,EAAW,IAAA,EAAM,aAAA,GAAgB,EAAA,EAAI,OAAA,EAAS,YAAA,EAAa,EAAsB;AACvI,EAAA,MAAM,YAAA,mBAAe,GAAA,CAAC,KAAA,EAAA,EAAI,KAAA,EAAM,yBAAA,EAA0B,8BAAC,IAAA,EAAA,EAAG,EAAA,EAAI,OAAA,EAAU,QAAA,EAAA,KAAA,EAAM,CAAA,EAAK,CAAA;AACvF,EAAA,MAAM,QAAA,mBAAW,GAAA;AAAA,IAAC,mBAAA;AAAA,IAAA;AAAA,MAChB,UAAA,EAAW,YAAA;AAAA,MACX,SAAA,EAAU,6BAAA;AAAA,MACV,QAAA,EAAU,IAAA,GAAO,iBAAC,GAAA,CAAC,UAAK,KAAA,EAAO,CAAA,wBAAA,EAA2B,aAAa,CAAA,CAAA,CAAG,IAAA,EAAK,EAAI,QAAA,EAAA,IAAA,EAAK,CAAA,EAAS,YAAY,CAAA,GAAI;AAAA;AAAA,GACnH;AACA,EAAA,MAAM,WAAA,GAAc,2BAAW,GAAA,CAAC,mBAAA,EAAA,EAAoB,WAAU,4BAAA,EAA6B,KAAA,EAAO,cAAe,QAAA,EAAA,OAAA,EAAQ,CAAA;AAEzH,EAAA,uBAAO,IAAA,CAAC,SAAI,KAAA,EAAM,mBAAA,EAAoB,kBAAe,eAAA,EAAgB,eAAA,EAAe,MAAA,CAAO,OAAA,CAAQ,IAAI,CAAC,GAAG,kBAAA,EAAkB,MAAA,CAAO,OAAA,CAAQ,OAAO,CAAC,CAAA,EAAG,oBAAkB,MAAA,CAAO,OAAA,CAAQ,OAAO,CAAC,CAAA,EAC9L,QAAA,EAAA;AAAA,oBAAA,GAAA,CAAC,OAAA,EAAA,EAAQ,SAAS,QAAA,EAAU,QAAA,EAAU,aAAa,OAAA,EAAS,KAAA,EAAO,WAAU,4BAAA,EAA6B,CAAA;AAAA,IACzG,2BAAW,GAAA,CAAC,GAAA,EAAA,EAAE,OAAM,4BAAA,EAA6B,EAAA,EAAI,WAAY,QAAA,EAAA,OAAA,EAAQ;AAAA,GAAA,EAC5E,CAAA;AACF","file":"chunk-K3G72I6D.js","sourcesContent":["import type { SafeHtml } from 'kerfjs';\n\nimport { Toolbar } from './toolbar.js';\nimport { ToolbarControlGroup } from './toolbar-control-group.js';\n\nexport interface DialogHeaderProps {\n  title: string;\n  titleId: string;\n  summary?: string;\n  summaryId?: string;\n  icon?: SafeHtml;\n  iconClassName?: string;\n  actions?: SafeHtml;\n  actionsLabel?: string;\n}\n\nexport function DialogHeader({ title, titleId, summary, summaryId, icon, iconClassName = '', actions, actionsLabel }: DialogHeaderProps) {\n  const titleContent = <div class=\"kui-dialog-header__copy\"><h2 id={titleId}>{title}</h2></div>;\n  const identity = <ToolbarControlGroup\n    appearance=\"borderless\"\n    className=\"kui-dialog-header__identity\"\n    children={icon ? [<span class={`kui-dialog-header__icon ${iconClassName}`.trim()}>{icon}</span>, titleContent] : titleContent}\n  />;\n  const actionGroup = actions && <ToolbarControlGroup className=\"kui-dialog-header__actions\" label={actionsLabel}>{actions}</ToolbarControlGroup>;\n\n  return <div class=\"kui-dialog-header\" data-component=\"dialog-header\" data-has-icon={String(Boolean(icon))} data-has-actions={String(Boolean(actions))} data-has-summary={String(Boolean(summary))}>\n    <Toolbar leading={identity} trailing={actionGroup} divider={false} className=\"kui-dialog-header__toolbar\" />\n    {summary && <p class=\"kui-dialog-header__summary\" id={summaryId}>{summary}</p>}\n  </div>;\n}\n"]}

package/dist/{chunk-3O7ZEUW2.js → chunk-M5JRI6MN.js}

@@ -12,16 +12,16 @@ function ResizeGrip({ axis }) {
     /* @__PURE__ */ jsx("path", { d: "M6 15h12" })
   ] }) });
 }
-function ResizableRegion({ id, label, size, min, max, axis = "horizontal", edge = "end", collapsed = false, transitioning = false, children }) {
+function ResizableRegion({ id, label, size, min, max, axis = "horizontal", edge = "end", collapsed = false, transitioning = false, handleIcon, children }) {
   const expandedSize = clampRegionSize(size, min, max);
   const resolved = collapsed ? 0 : expandedSize;
   const orientation = axis === "horizontal" ? "vertical" : "horizontal";
   return /* @__PURE__ */ jsxs("section", { class: "kui-resizable-region", "data-component": "resizable-region", "data-region-id": id, "data-axis": axis, "data-edge": edge, "data-collapsed": String(collapsed), "data-transitioning": String(transitioning), style: `--kui-resizable-region-size:${resolved}px;--kui-resizable-region-expanded-size:${expandedSize}px`, "aria-label": label, children: [
     /* @__PURE__ */ jsx("div", { class: "kui-resizable-region__content", children }),
-    /* @__PURE__ */ jsx("div", { class: "kui-resizable-region__handle", role: "separator", tabindex: "0", "aria-label": `Resize ${label}`, "aria-orientation": orientation, "aria-valuemin": collapsed ? 0 : min, "aria-valuemax": max, "aria-valuenow": resolved, "data-kui-resize-handle": true, "data-region-id": id, children: /* @__PURE__ */ jsx(ResizeGrip, { axis }) })
+    /* @__PURE__ */ jsx("div", { class: "kui-resizable-region__handle", role: "separator", tabindex: "0", "aria-label": `Resize ${label}`, "aria-orientation": orientation, "aria-valuemin": collapsed ? 0 : min, "aria-valuemax": max, "aria-valuenow": resolved, "data-kui-resize-handle": true, "data-region-id": id, children: /* @__PURE__ */ jsx("span", { class: "kui-resizable-region__handle-icon", "aria-hidden": "true", children: handleIcon ?? /* @__PURE__ */ jsx(ResizeGrip, { axis }) }) })
   ] });
 }
 
 export { ResizableRegion, clampRegionSize, resizeRegionFromPointer };
 
-//# sourceMappingURL=chunk-3O7ZEUW2.js.map
+//# sourceMappingURL=chunk-M5JRI6MN.js.map

package/dist/chunk-M5JRI6MN.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/resizable-region.tsx"],"names":[],"mappings":";;;AAoBO,IAAM,eAAA,GAAkB,CAAC,IAAA,EAAc,GAAA,EAAa,QAAgB,IAAA,CAAK,GAAA,CAAI,GAAA,EAAK,IAAA,CAAK,IAAI,GAAA,EAAK,IAAA,CAAK,KAAA,CAAM,IAAI,CAAC,CAAC;AACjH,IAAM,uBAAA,GAA0B,CAAC,SAAA,EAAmB,KAAA,EAAe,SAA8B,SAAA,GAAY,KAAA,IAAS,IAAA,KAAS,OAAA,GAAU,EAAA,GAAK,CAAA;AAErJ,SAAS,UAAA,CAAW,EAAE,IAAA,EAAK,EAAkC;AAC3D,EAAA,2BAAQ,KAAA,EAAA,EAAI,aAAA,EAAY,MAAA,EAAO,OAAA,EAAQ,aAAY,IAAA,EAAK,MAAA,EAAO,MAAA,EAAO,cAAA,EAAe,gBAAa,GAAA,EAAI,gBAAA,EAAe,OAAA,EAClH,QAAA,EAAA,IAAA,KAAS,+BACN,IAAA,CAAA,QAAA,EAAA,EAAE,QAAA,EAAA;AAAA,oBAAA,GAAA,CAAC,MAAA,EAAA,EAAK,GAAE,SAAA,EAAU,CAAA;AAAA,oBAAO,GAAA,CAAC,MAAA,EAAA,EAAK,CAAA,EAAE,UAAA,EAAW;AAAA,GAAA,EAAO,oBACrD,IAAA,CAAA,QAAA,EAAA,EAAE,QAAA,EAAA;AAAA,oBAAA,GAAA,CAAC,MAAA,EAAA,EAAK,GAAE,SAAA,EAAU,CAAA;AAAA,oBAAO,GAAA,CAAC,MAAA,EAAA,EAAK,CAAA,EAAE,UAAA,EAAW;AAAA,GAAA,EAAO,CAAA,EAC3D,CAAA;AACF;AAEO,SAAS,gBAAgB,EAAE,EAAA,EAAI,KAAA,EAAO,IAAA,EAAM,KAAK,GAAA,EAAK,IAAA,GAAO,YAAA,EAAc,IAAA,GAAO,OAAO,SAAA,GAAY,KAAA,EAAO,gBAAgB,KAAA,EAAO,UAAA,EAAY,UAAS,EAAyB;AACtL,EAAA,MAAM,YAAA,GAAe,eAAA,CAAgB,IAAA,EAAM,GAAA,EAAK,GAAG,CAAA;AACnD,EAAA,MAAM,QAAA,GAAW,YAAY,CAAA,GAAI,YAAA;AACjC,EAAA,MAAM,WAAA,GAAc,IAAA,KAAS,YAAA,GAAe,UAAA,GAAa,YAAA;AACzD,EAAA,uBAAO,IAAA,CAAC,SAAA,EAAA,EAAQ,KAAA,EAAM,sBAAA,EAAuB,gBAAA,EAAe,kBAAA,EAAmB,gBAAA,EAAgB,EAAA,EAAI,WAAA,EAAW,IAAA,EAAM,WAAA,EAAW,IAAA,EAAM,gBAAA,EAAgB,MAAA,CAAO,SAAS,CAAA,EAAG,oBAAA,EAAoB,MAAA,CAAO,aAAa,CAAA,EAAG,KAAA,EAAO,CAAA,4BAAA,EAA+B,QAAQ,CAAA,wCAAA,EAA2C,YAAY,CAAA,EAAA,CAAA,EAAM,YAAA,EAAY,KAAA,EACxU,QAAA,EAAA;AAAA,oBAAA,GAAA,CAAC,KAAA,EAAA,EAAI,KAAA,EAAM,+BAAA,EAAiC,QAAA,EAAS,CAAA;AAAA,wBACpD,KAAA,EAAA,EAAI,KAAA,EAAM,8BAAA,EAA+B,IAAA,EAAK,aAAY,QAAA,EAAS,GAAA,EAAI,YAAA,EAAY,CAAA,OAAA,EAAU,KAAK,CAAA,CAAA,EAAI,kBAAA,EAAkB,WAAA,EAAa,eAAA,EAAe,YAAY,CAAA,GAAI,GAAA,EAAK,eAAA,EAAe,GAAA,EAAK,iBAAe,QAAA,EAAU,wBAAA,EAAsB,IAAA,EAAC,gBAAA,EAAgB,IAC5P,QAAA,kBAAA,GAAA,CAAC,MAAA,EAAA,EAAK,KAAA,EAAM,mCAAA,EAAoC,eAAY,MAAA,EAAQ,QAAA,EAAA,UAAA,wBAAe,UAAA,EAAA,EAAW,IAAA,EAAY,GAAG,CAAA,EAC/G;AAAA,GAAA,EACF,CAAA;AACF","file":"chunk-M5JRI6MN.js","sourcesContent":["import type { SafeHtml } from 'kerfjs';\n\nexport type ResizableRegionAxis = 'horizontal' | 'vertical';\nexport type ResizableRegionEdge = 'start' | 'end';\n\nexport interface ResizableRegionProps {\n  id: string;\n  label: string;\n  size: number;\n  min: number;\n  max: number;\n  axis?: ResizableRegionAxis;\n  edge?: ResizableRegionEdge;\n  collapsed?: boolean;\n  transitioning?: boolean;\n  /** Decorative dormant content for the separator handle. Must not contain interactive descendants. */\n  handleIcon?: SafeHtml;\n  children: SafeHtml | SafeHtml[];\n}\n\nexport const clampRegionSize = (size: number, min: number, max: number) => Math.min(max, Math.max(min, Math.round(size)));\nexport const resizeRegionFromPointer = (startSize: number, delta: number, edge: ResizableRegionEdge) => startSize + delta * (edge === 'start' ? -1 : 1);\n\nfunction ResizeGrip({ axis }: { axis: ResizableRegionAxis }) {\n  return <svg aria-hidden=\"true\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\">\n    {axis === 'horizontal'\n      ? <><path d=\"M9 6v12\"></path><path d=\"M15 6v12\"></path></>\n      : <><path d=\"M6 9h12\"></path><path d=\"M6 15h12\"></path></>}\n  </svg>;\n}\n\nexport function ResizableRegion({ id, label, size, min, max, axis = 'horizontal', edge = 'end', collapsed = false, transitioning = false, handleIcon, children }: ResizableRegionProps) {\n  const expandedSize = clampRegionSize(size, min, max);\n  const resolved = collapsed ? 0 : expandedSize;\n  const orientation = axis === 'horizontal' ? 'vertical' : 'horizontal';\n  return <section class=\"kui-resizable-region\" data-component=\"resizable-region\" data-region-id={id} data-axis={axis} data-edge={edge} data-collapsed={String(collapsed)} data-transitioning={String(transitioning)} style={`--kui-resizable-region-size:${resolved}px;--kui-resizable-region-expanded-size:${expandedSize}px`} aria-label={label}>\n    <div class=\"kui-resizable-region__content\">{children}</div>\n    <div class=\"kui-resizable-region__handle\" role=\"separator\" tabindex=\"0\" aria-label={`Resize ${label}`} aria-orientation={orientation} aria-valuemin={collapsed ? 0 : min} aria-valuemax={max} aria-valuenow={resolved} data-kui-resize-handle data-region-id={id}>\n      <span class=\"kui-resizable-region__handle-icon\" aria-hidden=\"true\">{handleIcon ?? <ResizeGrip axis={axis} />}</span>\n    </div>\n  </section>;\n}\n"]}

package/dist/chunk-NPPD2A6O.js

@@ -0,0 +1,40 @@
+import { DisclosureArrow } from './chunk-56RJXPHG.js';
+import { filterDataAttributes, filterControlAttributes } from './chunk-7BR3DO2A.js';
+import { jsx, jsxs } from 'kerfjs/jsx-runtime';
+
+var PROTECTED_ROOT_DATA_ATTRIBUTES = /* @__PURE__ */ new Set([
+  "data-component",
+  "data-action",
+  "data-has-badge",
+  "data-has-count",
+  "data-toggle"
+]);
+var PROTECTED_TRIGGER_DATA_ATTRIBUTES = /* @__PURE__ */ new Set(["data-action"]);
+function MenuHeader({ label, count, countLabel, badge, action, actionLabel, actionIcon, actionDisabled = false, disabledReason, expanded, toggle = false, rootAttributes = {}, triggerAttributes = {} }) {
+  const extensionRootAttributes = filterDataAttributes(rootAttributes, PROTECTED_ROOT_DATA_ATTRIBUTES);
+  const extensionTriggerAttributes = filterControlAttributes(triggerAttributes, PROTECTED_TRIGGER_DATA_ATTRIBUTES);
+  const normalizedCount = typeof count === "number" && Number.isSafeInteger(count) && count >= 0 ? count : void 0;
+  const normalizedCountLabel = normalizedCount === void 0 ? void 0 : typeof countLabel === "string" && countLabel.trim() ? countLabel : String(normalizedCount);
+  const renderedBadge = normalizedCount === void 0 ? badge : void 0;
+  const renderedActionIcon = actionIcon ?? (toggle ? /* @__PURE__ */ jsx(DisclosureArrow, { open: Boolean(expanded) }) : void 0);
+  const accessibleLabel = normalizedCount === void 0 ? void 0 : `${label}, ${normalizedCountLabel}`;
+  const indicator = normalizedCount === void 0 ? renderedBadge && /* @__PURE__ */ jsx("span", { class: "kui-menu-header__badge", children: renderedBadge }) : /* @__PURE__ */ jsx("span", { class: "kui-menu-header__count", "aria-hidden": "true", children: normalizedCount });
+  if (toggle) {
+    return /* @__PURE__ */ jsx("header", { ...extensionRootAttributes, class: "kui-menu-header", "data-component": "menu-header", "data-has-badge": String(Boolean(renderedBadge)), "data-has-count": String(normalizedCount !== void 0), "data-toggle": "true", children: /* @__PURE__ */ jsxs("button", { ...extensionTriggerAttributes, type: "button", class: "kui-menu-header__title kui-menu-header__toggle", "data-action": action, "aria-label": accessibleLabel, "aria-expanded": String(Boolean(expanded)), children: [
+      /* @__PURE__ */ jsx("span", { class: "kui-menu-header__label", children: label }),
+      indicator,
+      renderedActionIcon && /* @__PURE__ */ jsx("span", { class: "kui-menu-header__action-layer", children: renderedActionIcon })
+    ] }) });
+  }
+  return /* @__PURE__ */ jsxs("header", { ...extensionRootAttributes, class: "kui-menu-header", "data-component": "menu-header", "data-has-badge": String(Boolean(renderedBadge)), "data-has-count": String(normalizedCount !== void 0), "data-toggle": "false", children: [
+    /* @__PURE__ */ jsxs("div", { class: "kui-menu-header__title", children: [
+      /* @__PURE__ */ jsx("h2", { class: "kui-menu-header__label", "aria-label": accessibleLabel, children: label }),
+      indicator
+    ] }),
+    action && /* @__PURE__ */ jsx("button", { ...extensionTriggerAttributes, type: "button", class: "kui-menu-header__action", "data-action": action, "aria-label": actionLabel, title: actionDisabled ? disabledReason : actionLabel, disabled: actionDisabled || void 0, children: renderedActionIcon })
+  ] });
+}
+
+export { MenuHeader };
+
+//# sourceMappingURL=chunk-NPPD2A6O.js.map

package/dist/chunk-NPPD2A6O.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/menu-header.tsx"],"names":[],"mappings":";;;;AAKA,IAAM,8BAAA,uBAAqC,GAAA,CAAI;AAAA,EAC7C,gBAAA;AAAA,EACA,aAAA;AAAA,EACA,gBAAA;AAAA,EACA,gBAAA;AAAA,EACA;AACF,CAAC,CAAA;AACD,IAAM,iCAAA,mBAAoC,IAAI,GAAA,CAAI,CAAC,aAAa,CAAC,CAAA;AAyC1D,SAAS,UAAA,CAAW,EAAE,KAAA,EAAO,KAAA,EAAO,YAAY,KAAA,EAAO,MAAA,EAAQ,aAAa,UAAA,EAAY,cAAA,GAAiB,OAAO,cAAA,EAAgB,QAAA,EAAU,SAAS,KAAA,EAAO,cAAA,GAAiB,EAAC,EAAG,iBAAA,GAAoB,EAAC,EAAE,EAAoB;AAC/N,EAAA,MAAM,uBAAA,GAA0B,oBAAA,CAAqB,cAAA,EAAgB,8BAA8B,CAAA;AACnG,EAAA,MAAM,0BAAA,GAA6B,uBAAA,CAAwB,iBAAA,EAAmB,iCAAiC,CAAA;AAC/G,EAAA,MAAM,eAAA,GAAkB,OAAO,KAAA,KAAU,QAAA,IAAY,MAAA,CAAO,cAAc,KAAK,CAAA,IAAK,KAAA,IAAS,CAAA,GAAI,KAAA,GAAQ,MAAA;AACzG,EAAA,MAAM,oBAAA,GAAuB,eAAA,KAAoB,MAAA,GAC7C,MAAA,GACA,OAAO,UAAA,KAAe,QAAA,IAAY,UAAA,CAAW,IAAA,EAAK,GAAI,UAAA,GAAa,MAAA,CAAO,eAAe,CAAA;AAC7F,EAAA,MAAM,aAAA,GAAgB,eAAA,KAAoB,MAAA,GAAY,KAAA,GAAQ,MAAA;AAC9D,EAAA,MAAM,kBAAA,GAAqB,eAAe,MAAA,mBAAS,GAAA,CAAC,mBAAgB,IAAA,EAAM,OAAA,CAAQ,QAAQ,CAAA,EAAG,CAAA,GAAK,MAAA,CAAA;AAClG,EAAA,MAAM,kBAAkB,eAAA,KAAoB,MAAA,GAAY,SAAY,CAAA,EAAG,KAAK,KAAK,oBAAoB,CAAA,CAAA;AACrG,EAAA,MAAM,YAAY,eAAA,KAAoB,MAAA,GAClC,aAAA,oBAAiB,GAAA,CAAC,UAAK,KAAA,EAAM,wBAAA,EAA0B,QAAA,EAAA,aAAA,EAAc,CAAA,uBACpE,MAAA,EAAA,EAAK,KAAA,EAAM,wBAAA,EAAyB,aAAA,EAAY,QAAQ,QAAA,EAAA,eAAA,EAAgB,CAAA;AAC7E,EAAA,IAAI,MAAA,EAAQ;AACV,IAAA,2BAAQ,QAAA,EAAA,EAAQ,GAAG,uBAAA,EAAyB,KAAA,EAAM,mBAAkB,gBAAA,EAAe,aAAA,EAAc,gBAAA,EAAgB,MAAA,CAAO,QAAQ,aAAa,CAAC,GAAG,gBAAA,EAAgB,MAAA,CAAO,oBAAoB,MAAS,CAAA,EAAG,aAAA,EAAY,MAAA,EAAO,+BAAC,QAAA,EAAA,EAAQ,GAAG,0BAAA,EAA4B,IAAA,EAAK,UAAS,KAAA,EAAM,gDAAA,EAAiD,aAAA,EAAa,MAAA,EAAQ,cAAY,eAAA,EAAiB,eAAA,EAAe,OAAO,OAAA,CAAQ,QAAQ,CAAC,CAAA,EAAG,QAAA,EAAA;AAAA,sBAAA,GAAA,CAAC,MAAA,EAAA,EAAK,KAAA,EAAM,wBAAA,EAA0B,QAAA,EAAA,KAAA,EAAM,CAAA;AAAA,MAAQ,SAAA;AAAA,MAAW,kBAAA,oBAAsB,GAAA,CAAC,MAAA,EAAA,EAAK,KAAA,EAAM,iCAAiC,QAAA,EAAA,kBAAA,EAAmB;AAAA,KAAA,EAAQ,CAAA,EAAS,CAAA;AAAA,EAC5kB;AACA,EAAA,uBAAO,IAAA,CAAC,YAAQ,GAAG,uBAAA,EAAyB,OAAM,iBAAA,EAAkB,gBAAA,EAAe,eAAc,gBAAA,EAAgB,MAAA,CAAO,QAAQ,aAAa,CAAC,GAAG,gBAAA,EAAgB,MAAA,CAAO,oBAAoB,MAAS,CAAA,EAAG,eAAY,OAAA,EAAQ,QAAA,EAAA;AAAA,oBAAA,IAAA,CAAC,KAAA,EAAA,EAAI,OAAM,wBAAA,EAAyB,QAAA,EAAA;AAAA,sBAAA,GAAA,CAAC,IAAA,EAAA,EAAG,KAAA,EAAM,wBAAA,EAAyB,YAAA,EAAY,iBAAkB,QAAA,EAAA,KAAA,EAAM,CAAA;AAAA,MAAM;AAAA,KAAA,EAAU,CAAA;AAAA,IAAO,MAAA,wBAAW,QAAA,EAAA,EAAQ,GAAG,4BAA4B,IAAA,EAAK,QAAA,EAAS,OAAM,yBAAA,EAA0B,aAAA,EAAa,QAAQ,YAAA,EAAY,WAAA,EAAa,OAAO,cAAA,GAAiB,cAAA,GAAiB,aAAa,QAAA,EAAU,cAAA,IAAkB,QAAY,QAAA,EAAA,kBAAA,EAAmB;AAAA,GAAA,EAAU,CAAA;AACzmB","file":"chunk-NPPD2A6O.js","sourcesContent":["import type { SafeHtml } from 'kerfjs';\n\nimport { DisclosureArrow } from './disclosure-arrow.js';\nimport { filterControlAttributes, filterDataAttributes } from './extension-attributes.js';\n\nconst PROTECTED_ROOT_DATA_ATTRIBUTES = new Set([\n  'data-component',\n  'data-action',\n  'data-has-badge',\n  'data-has-count',\n  'data-toggle',\n]);\nconst PROTECTED_TRIGGER_DATA_ATTRIBUTES = new Set(['data-action']);\n\ntype MenuHeaderRootAttributes = Readonly<\n  Record<`data-${string}`, string | undefined> & {\n    'data-component'?: never;\n    'data-action'?: never;\n    'data-has-badge'?: never;\n    'data-has-count'?: never;\n    'data-toggle'?: never;\n  }\n>;\n\ntype MenuHeaderTriggerAttributes = Readonly<\n  Record<`data-${string}`, string | undefined> & {\n    'data-action'?: never;\n    popoverTarget?: string;\n    popoverTargetAction?: 'toggle' | 'show' | 'hide';\n    'aria-controls'?: string;\n    'aria-haspopup'?: 'dialog' | 'menu' | 'listbox' | 'tree' | 'grid' | 'true';\n  }\n>;\n\ninterface MenuHeaderBaseProps {\n  label: string;\n  action?: string;\n  actionLabel?: string;\n  actionIcon?: SafeHtml;\n  actionDisabled?: boolean;\n  disabledReason?: string;\n  expanded?: boolean;\n  toggle?: boolean;\n  rootAttributes?: MenuHeaderRootAttributes;\n  triggerAttributes?: MenuHeaderTriggerAttributes;\n}\n\ntype MenuHeaderIndicatorProps =\n  | { count: number; countLabel: string; badge?: never }\n  | { count?: never; countLabel?: never; badge?: SafeHtml };\n\nexport type MenuHeaderProps = MenuHeaderBaseProps & MenuHeaderIndicatorProps;\n\nexport function MenuHeader({ label, count, countLabel, badge, action, actionLabel, actionIcon, actionDisabled = false, disabledReason, expanded, toggle = false, rootAttributes = {}, triggerAttributes = {} }: MenuHeaderProps) {\n  const extensionRootAttributes = filterDataAttributes(rootAttributes, PROTECTED_ROOT_DATA_ATTRIBUTES);\n  const extensionTriggerAttributes = filterControlAttributes(triggerAttributes, PROTECTED_TRIGGER_DATA_ATTRIBUTES);\n  const normalizedCount = typeof count === 'number' && Number.isSafeInteger(count) && count >= 0 ? count : undefined;\n  const normalizedCountLabel = normalizedCount === undefined\n    ? undefined\n    : typeof countLabel === 'string' && countLabel.trim() ? countLabel : String(normalizedCount);\n  const renderedBadge = normalizedCount === undefined ? badge : undefined;\n  const renderedActionIcon = actionIcon ?? (toggle ? <DisclosureArrow open={Boolean(expanded)} /> : undefined);\n  const accessibleLabel = normalizedCount === undefined ? undefined : `${label}, ${normalizedCountLabel}`;\n  const indicator = normalizedCount === undefined\n    ? renderedBadge && <span class=\"kui-menu-header__badge\">{renderedBadge}</span>\n    : <span class=\"kui-menu-header__count\" aria-hidden=\"true\">{normalizedCount}</span>;\n  if (toggle) {\n    return <header {...extensionRootAttributes} class=\"kui-menu-header\" data-component=\"menu-header\" data-has-badge={String(Boolean(renderedBadge))} data-has-count={String(normalizedCount !== undefined)} data-toggle=\"true\"><button {...extensionTriggerAttributes} type=\"button\" class=\"kui-menu-header__title kui-menu-header__toggle\" data-action={action} aria-label={accessibleLabel} aria-expanded={String(Boolean(expanded))}><span class=\"kui-menu-header__label\">{label}</span>{indicator}{renderedActionIcon && <span class=\"kui-menu-header__action-layer\">{renderedActionIcon}</span>}</button></header>;\n  }\n  return <header {...extensionRootAttributes} class=\"kui-menu-header\" data-component=\"menu-header\" data-has-badge={String(Boolean(renderedBadge))} data-has-count={String(normalizedCount !== undefined)} data-toggle=\"false\"><div class=\"kui-menu-header__title\"><h2 class=\"kui-menu-header__label\" aria-label={accessibleLabel}>{label}</h2>{indicator}</div>{action && <button {...extensionTriggerAttributes} type=\"button\" class=\"kui-menu-header__action\" data-action={action} aria-label={actionLabel} title={actionDisabled ? disabledReason : actionLabel} disabled={actionDisabled || undefined}>{renderedActionIcon}</button>}</header>;\n}\n"]}

package/dist/chunk-R6JHHBKQ.js

@@ -0,0 +1,19 @@
+import { jsxs, jsx } from 'kerfjs/jsx-runtime';
+
+// src/value-table-row.tsx
+function ValueTableRow({ label, value, icon, className = "" }) {
+  return /* @__PURE__ */ jsxs("div", { class: `kui-value-table__row ${className}`.trim(), "data-has-icon": String(Boolean(icon)), children: [
+    /* @__PURE__ */ jsxs("dt", { children: [
+      icon && /* @__PURE__ */ jsx("span", { class: "kui-value-table__icon", children: icon }),
+      /* @__PURE__ */ jsx("span", { class: "kui-value-table__label", children: label })
+    ] }),
+    /* @__PURE__ */ jsx("dd", { children: value })
+  ] });
+}
+function ValueTable({ label, className = "", children }) {
+  return /* @__PURE__ */ jsx("dl", { class: `kui-value-table ${className}`.trim(), "data-component": "value-table", "aria-label": label, children });
+}
+
+export { ValueTable, ValueTableRow };
+
+//# sourceMappingURL=chunk-R6JHHBKQ.js.map

package/dist/chunk-R6JHHBKQ.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/value-table-row.tsx","../src/value-table.tsx"],"names":["jsx"],"mappings":";;;AASO,SAAS,cAAc,EAAE,KAAA,EAAO,OAAO,IAAA,EAAM,SAAA,GAAY,IAAG,EAAuB;AACxF,EAAA,uBAAO,IAAA,CAAC,KAAA,EAAA,EAAI,KAAA,EAAO,CAAA,qBAAA,EAAwB,SAAS,CAAA,CAAA,CAAG,IAAA,EAAK,EAAG,eAAA,EAAe,MAAA,CAAO,OAAA,CAAQ,IAAI,CAAC,CAAA,EAChG,QAAA,EAAA;AAAA,oBAAA,IAAA,CAAC,IAAA,EAAA,EACE,QAAA,EAAA;AAAA,MAAA,IAAA,oBAAQ,GAAA,CAAC,MAAA,EAAA,EAAK,KAAA,EAAM,uBAAA,EAAyB,QAAA,EAAA,IAAA,EAAK,CAAA;AAAA,sBACnD,GAAA,CAAC,MAAA,EAAA,EAAK,KAAA,EAAM,wBAAA,EAA0B,QAAA,EAAA,KAAA,EAAM;AAAA,KAAA,EAC9C,CAAA;AAAA,oBACA,GAAA,CAAC,QAAI,QAAA,EAAA,KAAA,EAAM;AAAA,GAAA,EACb,CAAA;AACF;ACPO,SAAS,WAAW,EAAE,KAAA,EAAO,SAAA,GAAY,EAAA,EAAI,UAAS,EAAoB;AAC/E,EAAA,uBAAOA,GAAAA,CAAC,IAAA,EAAA,EAAG,KAAA,EAAO,CAAA,gBAAA,EAAmB,SAAS,CAAA,CAAA,CAAG,IAAA,EAAK,EAAG,gBAAA,EAAe,aAAA,EAAc,YAAA,EAAY,OAAQ,QAAA,EAAS,CAAA;AACrH","file":"chunk-R6JHHBKQ.js","sourcesContent":["import type { SafeHtml } from 'kerfjs';\n\nexport interface ValueTableRowProps {\n  label: string | SafeHtml;\n  value: string | SafeHtml;\n  icon?: SafeHtml;\n  className?: string;\n}\n\nexport function ValueTableRow({ label, value, icon, className = '' }: ValueTableRowProps) {\n  return <div class={`kui-value-table__row ${className}`.trim()} data-has-icon={String(Boolean(icon))}>\n    <dt>\n      {icon && <span class=\"kui-value-table__icon\">{icon}</span>}\n      <span class=\"kui-value-table__label\">{label}</span>\n    </dt>\n    <dd>{value}</dd>\n  </div>;\n}\n","import type { SafeHtml } from 'kerfjs';\n\nexport { ValueTableRow, type ValueTableRowProps } from './value-table-row.js';\n\nexport interface ValueTableProps {\n  label: string;\n  className?: string;\n  children: SafeHtml | readonly SafeHtml[];\n}\n\nexport function ValueTable({ label, className = '', children }: ValueTableProps) {\n  return <dl class={`kui-value-table ${className}`.trim()} data-component=\"value-table\" aria-label={label}>{children}</dl>;\n}\n"]}

package/dist/chunk-S3TPM2LP.js

@@ -0,0 +1,23 @@
+import { filterDataAttributes } from './chunk-7BR3DO2A.js';
+import { jsxs, jsx } from 'kerfjs/jsx-runtime';
+
+var PROTECTED_ROOT_DATA_ATTRIBUTES = /* @__PURE__ */ new Set([
+  "data-component",
+  "data-action",
+  "data-item-id",
+  "data-has-icon",
+  "data-multiline",
+  "data-state"
+]);
+function MenuItem({ label, icon, trailing, selected = false, action, itemId, className = "", style, pressed, accessibleLabel, title, multiline = false, state, disabled = false, tabIndex, rootAttributes = {} }) {
+  const extensionAttributes = filterDataAttributes(rootAttributes, PROTECTED_ROOT_DATA_ATTRIBUTES);
+  return /* @__PURE__ */ jsxs("button", { ...extensionAttributes, type: "button", class: `kui-menu-item ${className}`.trim(), style, title, disabled, tabindex: tabIndex, "data-component": "menu-item", "data-action": action, "data-item-id": itemId, "data-has-icon": String(Boolean(icon)), "data-multiline": multiline ? "true" : void 0, "data-state": state, "aria-label": accessibleLabel, "aria-current": selected ? "page" : void 0, "aria-pressed": pressed === void 0 ? void 0 : String(pressed), children: [
+    icon && /* @__PURE__ */ jsx("span", { class: "kui-menu-item__icon", children: icon }),
+    /* @__PURE__ */ jsx("span", { class: "kui-menu-item__label", children: label }),
+    trailing && /* @__PURE__ */ jsx("span", { class: "kui-menu-item__trailing", children: trailing })
+  ] });
+}
+
+export { MenuItem };
+
+//# sourceMappingURL=chunk-S3TPM2LP.js.map