@kerfjs/ui 5.0.0-beta.7 → 5.0.0-beta.70

package/dist/chunk-RVERAFFY.js

@@ -0,0 +1,291 @@
+import { LucideIcon } from './chunk-WTSNV5RG.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 = [],
+  model,
+  revision,
+  placeholder = "Search",
+  tokenPlaceholder = "Add search\u2026",
+  disabled = false,
+  autofocus = false,
+  fill = false,
+  collapsible = false,
+  expanded = false,
+  expandAction = "expand-token-search",
+  expandLabel,
+  leading,
+  trailing,
+  trailingAction,
+  presentation = "standalone",
+  hint,
+  required = false,
+  editAction = "edit-search-token",
+  removeAction = "remove-search-token",
+  clearAction = "clear-token-search",
+  clearLabel = "Clear search",
+  clearIcon,
+  className = "",
+  editorAttributes = {},
+  slot
+}) {
+  if (model) {
+    query = model.state.value.query;
+    tokens = model.state.value.tokens;
+  }
+  const suggestions = model?.suggestions.value ?? [];
+  const parts = orderedParts(query, tokens);
+  const tokenKey = tokens.map((token) => token.value).join("|");
+  const key = model ? `${id}@${String(revision ?? "")}:${model.editorRevision.value}:${tokenKey}` : revision === void 0 ? `${id}:${tokenKey}` : `${id}@${String(revision)}:${tokenKey}`;
+  const resolvedExpanded = !collapsible || expanded || query.length > 0 || tokens.length > 0;
+  const control = /* @__PURE__ */ jsx(
+    "div",
+    {
+      class: `kui-token-search ${presentation === "form-field" ? "" : 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-fill": String(fill),
+      "data-has-trailing": String(Boolean(trailing || trailingAction)),
+      "data-presentation": presentation,
+      slot,
+      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": presentation === "form-field" ? void 0 : label,
+            "aria-labelledby": presentation === "form-field" ? `${id}-label` : void 0,
+            "aria-describedby": presentation === "form-field" && hint ? `${id}-hint` : void 0,
+            "aria-required": required ? "true" : void 0,
+            "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: clearIcon ?? /* @__PURE__ */ jsx(CloseIcon, {})
+          }
+        ),
+        trailingAction ? /* @__PURE__ */ jsx(
+          "button",
+          {
+            type: "button",
+            class: "kui-token-search__trailing-action",
+            id: trailingAction.id,
+            "data-action": trailingAction.action,
+            "aria-label": trailingAction.label,
+            title: trailingAction.label,
+            disabled,
+            children: trailingAction.icon
+          }
+        ) : trailing ? /* @__PURE__ */ jsx("span", { class: "kui-token-search__trailing", children: trailing }) : null,
+        !disabled && suggestions.length > 0 && /* @__PURE__ */ jsx(
+          "div",
+          {
+            class: "kui-token-search__suggestions",
+            "data-token-search-keep-open": true,
+            children: suggestions.map((suggestion) => /* @__PURE__ */ jsx(
+              "button",
+              {
+                type: "button",
+                class: "kui-token-search__suggestion",
+                "data-token-search-suggestion": suggestion.value,
+                children: suggestion.label
+              }
+            ))
+          }
+        )
+      ] })
+    }
+  );
+  if (presentation !== "form-field") return control;
+  return /* @__PURE__ */ jsxs(
+    "div",
+    {
+      class: `kui-token-search__field ${className}`.trim(),
+      "data-token-search-form-field": id,
+      children: [
+        /* @__PURE__ */ jsxs(
+          "div",
+          {
+            class: "kui-token-search__field-label",
+            id: `${id}-label`,
+            "data-token-search-form-label": id,
+            children: [
+              label,
+              required && /* @__PURE__ */ jsx("span", { class: "kui-token-search__field-required", "aria-hidden": "true", children: "*" })
+            ]
+          }
+        ),
+        control,
+        hint && /* @__PURE__ */ jsx("div", { class: "kui-token-search__field-hint", id: `${id}-hint`, children: hint })
+      ]
+    }
+  );
+}
+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-RVERAFFY.js.map

package/dist/chunk-RVERAFFY.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/token-search-field.tsx"],"names":[],"mappings":"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","file":"chunk-RVERAFFY.js","sourcesContent":["import type { SafeHtml } from 'kerfjs';\nimport { Search, X } from 'lucide';\n\nimport { LucideIcon } from './lucide-icon.js';\nimport type { KerfUiContent } from './semantic-content.js';\nimport type { TokenSearchModel } from './token-search-model.js';\n\nexport interface TokenSearchToken {\n  value: string;\n  label: string;\n  offset?: number;\n  accessibleLabel?: string;\n}\n\nexport interface TokenSearchTrailingAction {\n  icon: SafeHtml;\n  label: string;\n  action: string;\n  id?: string;\n}\n\nexport type TokenSearchEditorAttributes = Readonly<\n  Record<`data-${string}`, string | undefined> & {\n    'data-component'?: never;\n    'data-key'?: never;\n    'data-morph-skip'?: never;\n    'data-token-search-editor'?: never;\n    'data-token-count'?: never;\n    'data-placeholder'?: never;\n  }\n>;\n\ninterface TokenSearchFieldBaseProps {\n  id: string;\n  label: string;\n  query?: string;\n  tokens?: readonly TokenSearchToken[];\n  /** Opt-in grammar, suggestion, and evaluation state. Overrides `query` and `tokens`. */\n  model?: TokenSearchModel;\n  /**\n   * Editor identity for a programmatic text replacement. The editor's text is\n   * DOM-owned between token changes, so a new `query` with the same tokens\n   * does not re-render it (that would reset the caret on every keystroke).\n   * Change `revision` when the app replaces the text itself — reseeding a\n   * persistent dialog's field on reopen, applying a saved search — and the\n   * editor is rebuilt from `query` and `tokens`.\n   */\n  revision?: string | number;\n  placeholder?: string;\n  tokenPlaceholder?: string;\n  disabled?: boolean;\n  autofocus?: boolean;\n  /** Let an expanded collapsible field consume the available inline width. */\n  fill?: boolean;\n  leading?: KerfUiContent;\n  editAction?: string;\n  removeAction?: string;\n  clearAction?: string;\n  clearLabel?: string;\n  /** Icon for the clear button. Default: the Lucide `x` glyph token chips also use. */\n  clearIcon?: SafeHtml;\n  className?: string;\n  editorAttributes?: TokenSearchEditorAttributes;\n  /** Native named-slot assignment when composed inside a web component. */\n  slot?: string;\n}\n\ntype TokenSearchTrailingProps =\n  | { trailing?: KerfUiContent; trailingAction?: never }\n  | { trailing?: never; trailingAction: TokenSearchTrailingAction };\n\ntype TokenSearchPresentationProps =\n  | {\n      /** Standalone field chrome or the inset visual layer of a configured toolbar group. */\n      presentation?: 'standalone' | 'toolbar-group';\n      hint?: never;\n      required?: never;\n    }\n  | {\n      /** Visible form label and optional hint around the full-width standalone control. */\n      presentation: 'form-field';\n      hint?: string;\n      /** Marks the editor required; the app validates its value. */\n      required?: boolean;\n    };\n\ntype TokenSearchCollapsibleProps =\n  | {\n      /** Allow an empty field to render as one iconic action. */\n      collapsible: true;\n      /** Keep an empty collapsible field open while the application owns focus. */\n      expanded?: boolean;\n      expandAction?: string;\n      expandLabel?: string;\n    }\n  | {\n      collapsible?: false;\n      expanded?: never;\n      expandAction?: never;\n      expandLabel?: never;\n    };\n\nexport type TokenSearchFieldProps = TokenSearchFieldBaseProps &\n  TokenSearchCollapsibleProps &\n  TokenSearchTrailingProps &\n  TokenSearchPresentationProps;\n\nexport interface TokenSearchFieldValue {\n  query: string;\n  tokens: TokenSearchToken[];\n}\n\ntype TokenSearchPart =\n  { kind: 'text'; value: string } | { kind: 'token'; token: TokenSearchToken };\n\nfunction orderedParts(\n  query: string,\n  tokens: readonly TokenSearchToken[],\n): TokenSearchPart[] {\n  const ordered = tokens\n    .map((token, index) => ({\n      token,\n      index,\n      offset: Math.max(0, Math.min(query.length, token.offset ?? query.length)),\n    }))\n    .sort(\n      (left, right) => left.offset - right.offset || left.index - right.index,\n    );\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  model,\n  revision,\n  placeholder = 'Search',\n  tokenPlaceholder = 'Add search…',\n  disabled = false,\n  autofocus = false,\n  fill = false,\n  collapsible = false,\n  expanded = false,\n  expandAction = 'expand-token-search',\n  expandLabel,\n  leading,\n  trailing,\n  trailingAction,\n  presentation = 'standalone',\n  hint,\n  required = false,\n  editAction = 'edit-search-token',\n  removeAction = 'remove-search-token',\n  clearAction = 'clear-token-search',\n  clearLabel = 'Clear search',\n  clearIcon,\n  className = '',\n  editorAttributes = {},\n  slot,\n}: TokenSearchFieldProps) {\n  if (model) {\n    query = model.state.value.query;\n    tokens = model.state.value.tokens;\n  }\n  const suggestions = model?.suggestions.value ?? [];\n  const parts = orderedParts(query, tokens);\n  const tokenKey = tokens.map((token) => token.value).join('|');\n  const key = model\n    ? `${id}@${String(revision ?? '')}:${model.editorRevision.value}:${tokenKey}`\n    : revision === undefined\n      ? `${id}:${tokenKey}`\n      : `${id}@${String(revision)}:${tokenKey}`;\n  const resolvedExpanded =\n    !collapsible || expanded || query.length > 0 || tokens.length > 0;\n  const control = (\n    <div\n      class={`kui-token-search ${presentation === 'form-field' ? '' : className}`.trim()}\n      data-component=\"token-search-field\"\n      data-token-search-id={id}\n      data-disabled={String(disabled)}\n      data-collapsible={String(collapsible)}\n      data-expanded={String(resolvedExpanded)}\n      data-fill={String(fill)}\n      data-has-trailing={String(Boolean(trailing || trailingAction))}\n      data-presentation={presentation}\n      slot={slot}\n    >\n      {!resolvedExpanded ? (\n        <button\n          type=\"button\"\n          class=\"kui-token-search__expand\"\n          data-action={expandAction}\n          aria-label={expandLabel ?? label}\n          title={expandLabel ?? label}\n          disabled={disabled}\n        >\n          <LucideIcon icon={Search} name=\"search\" />\n        </button>\n      ) : (\n        <>\n          <span class=\"kui-token-search__leading\" aria-hidden=\"true\">\n            {leading ?? <LucideIcon icon={Search} name=\"search\" />}\n          </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={presentation === 'form-field' ? undefined : label}\n            aria-labelledby={\n              presentation === 'form-field' ? `${id}-label` : undefined\n            }\n            aria-describedby={\n              presentation === 'form-field' && hint ? `${id}-hint` : undefined\n            }\n            aria-required={required ? 'true' : undefined}\n            aria-disabled={disabled ? 'true' : undefined}\n            contenteditable={disabled ? 'false' : 'true'}\n            spellcheck=\"false\"\n            autofocus={autofocus}\n          >\n            {parts.map((part) =>\n              part.kind === 'text' ? (\n                <span\n                  data-token-search-text\n                  data-empty={String(part.value.length === 0)}\n                >\n                  {part.value || (tokens.length ? '\\u200b' : '')}\n                </span>\n              ) : (\n                <span\n                  class=\"kui-token-search__token\"\n                  contenteditable=\"false\"\n                  data-component=\"token-search-token\"\n                  data-token-value={part.token.value}\n                >\n                  <button\n                    type=\"button\"\n                    class=\"kui-token-search__token-edit\"\n                    data-action={editAction}\n                    data-token-value={part.token.value}\n                    aria-label={`Edit ${part.token.accessibleLabel ?? part.token.label}`}\n                    disabled={disabled}\n                  >\n                    {part.token.label}\n                  </button>\n                  <button\n                    type=\"button\"\n                    class=\"kui-token-search__token-remove\"\n                    data-action={removeAction}\n                    data-token-value={part.token.value}\n                    aria-label={`Remove ${part.token.accessibleLabel ?? part.token.label}`}\n                    disabled={disabled}\n                  >\n                    <CloseIcon />\n                  </button>\n                </span>\n              ),\n            )}\n          </div>\n          {(query || tokens.length > 0) && (\n            <button\n              type=\"button\"\n              class=\"kui-token-search__clear\"\n              data-action={clearAction}\n              aria-label={clearLabel}\n              title={clearLabel}\n              disabled={disabled}\n            >\n              {clearIcon ?? <CloseIcon />}\n            </button>\n          )}\n          {trailingAction ? (\n            <button\n              type=\"button\"\n              class=\"kui-token-search__trailing-action\"\n              id={trailingAction.id}\n              data-action={trailingAction.action}\n              aria-label={trailingAction.label}\n              title={trailingAction.label}\n              disabled={disabled}\n            >\n              {trailingAction.icon}\n            </button>\n          ) : trailing ? (\n            <span class=\"kui-token-search__trailing\">{trailing}</span>\n          ) : null}\n          {!disabled && suggestions.length > 0 && (\n            <div\n              class=\"kui-token-search__suggestions\"\n              data-token-search-keep-open\n            >\n              {suggestions.map((suggestion) => (\n                <button\n                  type=\"button\"\n                  class=\"kui-token-search__suggestion\"\n                  data-token-search-suggestion={suggestion.value}\n                >\n                  {suggestion.label}\n                </button>\n              ))}\n            </div>\n          )}\n        </>\n      )}\n    </div>\n  );\n  if (presentation !== 'form-field') return control;\n  return (\n    <div\n      class={`kui-token-search__field ${className}`.trim()}\n      data-token-search-form-field={id}\n    >\n      <div\n        class=\"kui-token-search__field-label\"\n        id={`${id}-label`}\n        data-token-search-form-label={id}\n      >\n        {label}\n        {required && (\n          <span class=\"kui-token-search__field-required\" aria-hidden=\"true\">\n            *\n          </span>\n        )}\n      </div>\n      {control}\n      {hint && (\n        <div class=\"kui-token-search__field-hint\" id={`${id}-hint`}>\n          {hint}\n        </div>\n      )}\n    </div>\n  );\n}\n\n/** Read editable text and ordered token offsets from a rendered TokenSearchField editor. */\nexport function readTokenSearchField(\n  editor: HTMLElement,\n  knownTokens: readonly TokenSearchToken[] = [],\n): 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 ?? '')\n        .replaceAll('\\u00a0', ' ')\n        .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)\n        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(\n  editor: HTMLElement,\n  offset?: number,\n): 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) =>\n        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(\n          node,\n          source === '\\u200b' ? 0 : Math.min(remaining, source.length),\n        );\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-SMZGAPCU.js

@@ -0,0 +1,70 @@
+import { jsxs, jsx } from 'kerfjs/jsx-runtime';
+
+// src/chip.tsx
+function Chip({
+  children,
+  icon,
+  truncate = false,
+  tone = "neutral",
+  appearance = "quiet",
+  shape = "pill",
+  size = "default",
+  disabled = false,
+  itemId,
+  className = "",
+  slot,
+  ...remove
+}) {
+  if (truncate && typeof children !== "string")
+    throw new TypeError("Chip truncate requires a plain text label");
+  return /* @__PURE__ */ jsxs(
+    "span",
+    {
+      class: `kui-chip ${className}`.trim(),
+      "data-component": "chip",
+      "data-tone": tone,
+      "data-appearance": appearance,
+      "data-shape": shape,
+      "data-size": size,
+      "data-disabled": disabled ? "" : void 0,
+      "data-truncate": truncate ? "" : void 0,
+      "data-item-id": itemId,
+      slot,
+      children: [
+        icon === void 0 ? null : /* @__PURE__ */ jsx("span", { class: "kui-chip__icon", "aria-hidden": "true", children: icon }),
+        /* @__PURE__ */ jsx(
+          "span",
+          {
+            class: "kui-chip__label",
+            title: truncate ? String(children) : void 0,
+            children
+          }
+        ),
+        remove.removeAction !== void 0 ? /* @__PURE__ */ jsx(
+          "button",
+          {
+            class: "kui-chip__remove",
+            type: "button",
+            "data-action": remove.removeAction,
+            "aria-label": remove.removeLabel,
+            disabled,
+            children: /* @__PURE__ */ jsx("svg", { viewBox: "0 0 16 16", width: "12", height: "12", "aria-hidden": "true", children: /* @__PURE__ */ jsx(
+              "path",
+              {
+                d: "M3.5 3.5 12.5 12.5M12.5 3.5 3.5 12.5",
+                fill: "none",
+                stroke: "currentColor",
+                "stroke-width": "1.75",
+                "stroke-linecap": "round"
+              }
+            ) })
+          }
+        ) : null
+      ]
+    }
+  );
+}
+
+export { Chip };
+
+//# sourceMappingURL=chunk-SMZGAPCU.js.map

package/dist/chunk-SMZGAPCU.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/chip.tsx"],"names":[],"mappings":";;;AAoCO,SAAS,IAAA,CAAK;AAAA,EACnB,QAAA;AAAA,EACA,IAAA;AAAA,EACA,QAAA,GAAW,KAAA;AAAA,EACX,IAAA,GAAO,SAAA;AAAA,EACP,UAAA,GAAa,OAAA;AAAA,EACb,KAAA,GAAQ,MAAA;AAAA,EACR,IAAA,GAAO,SAAA;AAAA,EACP,QAAA,GAAW,KAAA;AAAA,EACX,MAAA;AAAA,EACA,SAAA,GAAY,EAAA;AAAA,EACZ,IAAA;AAAA,EACA,GAAG;AACL,CAAA,EAAc;AACZ,EAAA,IAAI,QAAA,IAAY,OAAO,QAAA,KAAa,QAAA;AAClC,IAAA,MAAM,IAAI,UAAU,2CAA2C,CAAA;AACjE,EAAA,uBACE,IAAA;AAAA,IAAC,MAAA;AAAA,IAAA;AAAA,MACC,KAAA,EAAO,CAAA,SAAA,EAAY,SAAS,CAAA,CAAA,CAAG,IAAA,EAAK;AAAA,MACpC,gBAAA,EAAe,MAAA;AAAA,MACf,WAAA,EAAW,IAAA;AAAA,MACX,iBAAA,EAAiB,UAAA;AAAA,MACjB,YAAA,EAAY,KAAA;AAAA,MACZ,WAAA,EAAW,IAAA;AAAA,MACX,eAAA,EAAe,WAAW,EAAA,GAAK,MAAA;AAAA,MAC/B,eAAA,EAAe,WAAW,EAAA,GAAK,MAAA;AAAA,MAC/B,cAAA,EAAc,MAAA;AAAA,MACd,IAAA;AAAA,MAEC,QAAA,EAAA;AAAA,QAAA,IAAA,KAAS,MAAA,GAAY,uBACpB,GAAA,CAAC,MAAA,EAAA,EAAK,OAAM,gBAAA,EAAiB,aAAA,EAAY,QACtC,QAAA,EAAA,IAAA,EACH,CAAA;AAAA,wBAEF,GAAA;AAAA,UAAC,MAAA;AAAA,UAAA;AAAA,YACC,KAAA,EAAM,iBAAA;AAAA,YACN,KAAA,EAAO,QAAA,GAAW,MAAA,CAAO,QAAQ,CAAA,GAAI,MAAA;AAAA,YAEpC;AAAA;AAAA,SACH;AAAA,QACC,MAAA,CAAO,iBAAiB,MAAA,mBACvB,GAAA;AAAA,UAAC,QAAA;AAAA,UAAA;AAAA,YACC,KAAA,EAAM,kBAAA;AAAA,YACN,IAAA,EAAK,QAAA;AAAA,YACL,eAAa,MAAA,CAAO,YAAA;AAAA,YACpB,cAAY,MAAA,CAAO,WAAA;AAAA,YACnB,QAAA;AAAA,YAEA,QAAA,kBAAA,GAAA,CAAC,SAAI,OAAA,EAAQ,WAAA,EAAY,OAAM,IAAA,EAAK,MAAA,EAAO,IAAA,EAAK,aAAA,EAAY,MAAA,EAC1D,QAAA,kBAAA,GAAA;AAAA,cAAC,MAAA;AAAA,cAAA;AAAA,gBACC,CAAA,EAAE,sCAAA;AAAA,gBACF,IAAA,EAAK,MAAA;AAAA,gBACL,MAAA,EAAO,cAAA;AAAA,gBACP,cAAA,EAAa,MAAA;AAAA,gBACb,gBAAA,EAAe;AAAA;AAAA,aACjB,EACF;AAAA;AAAA,SACF,GACE;AAAA;AAAA;AAAA,GACN;AAEJ","file":"chunk-SMZGAPCU.js","sourcesContent":["import type { SafeHtml } from 'kerfjs';\n\nimport type {\n  BadgeAppearance,\n  BadgeShape,\n  BadgeSize,\n  BadgeTone,\n} from './badge.js';\n\ninterface ChipCommonProps {\n  /** Decorative leading icon, normally an unsized LucideIcon. */\n  icon?: SafeHtml;\n  tone?: BadgeTone;\n  appearance?: BadgeAppearance;\n  shape?: BadgeShape;\n  size?: BadgeSize;\n  disabled?: boolean;\n  /** Record identifier available to an application delegated action handler. */\n  itemId?: string;\n  className?: string;\n  /** Native named-slot assignment when composed inside a web component. */\n  slot?: string;\n}\n\n/** A removable chip needs both a delegated action and a specific accessible name. */\nexport type ChipProps = ChipCommonProps &\n  (\n    | { children: SafeHtml | string | number; truncate?: false }\n    | { children: string; truncate: true }\n  ) &\n  (\n    | { removeAction: string; removeLabel: string }\n    | { removeAction?: never; removeLabel?: never }\n  );\n\n/** A short label with an optional native remove button. The application owns removal. */\nexport function Chip({\n  children,\n  icon,\n  truncate = false,\n  tone = 'neutral',\n  appearance = 'quiet',\n  shape = 'pill',\n  size = 'default',\n  disabled = false,\n  itemId,\n  className = '',\n  slot,\n  ...remove\n}: ChipProps) {\n  if (truncate && typeof children !== 'string')\n    throw new TypeError('Chip truncate requires a plain text label');\n  return (\n    <span\n      class={`kui-chip ${className}`.trim()}\n      data-component=\"chip\"\n      data-tone={tone}\n      data-appearance={appearance}\n      data-shape={shape}\n      data-size={size}\n      data-disabled={disabled ? '' : undefined}\n      data-truncate={truncate ? '' : undefined}\n      data-item-id={itemId}\n      slot={slot}\n    >\n      {icon === undefined ? null : (\n        <span class=\"kui-chip__icon\" aria-hidden=\"true\">\n          {icon}\n        </span>\n      )}\n      <span\n        class=\"kui-chip__label\"\n        title={truncate ? String(children) : undefined}\n      >\n        {children}\n      </span>\n      {remove.removeAction !== undefined ? (\n        <button\n          class=\"kui-chip__remove\"\n          type=\"button\"\n          data-action={remove.removeAction}\n          aria-label={remove.removeLabel}\n          disabled={disabled}\n        >\n          <svg viewBox=\"0 0 16 16\" width=\"12\" height=\"12\" aria-hidden=\"true\">\n            <path\n              d=\"M3.5 3.5 12.5 12.5M12.5 3.5 3.5 12.5\"\n              fill=\"none\"\n              stroke=\"currentColor\"\n              stroke-width=\"1.75\"\n              stroke-linecap=\"round\"\n            />\n          </svg>\n        </button>\n      ) : null}\n    </span>\n  );\n}\n"]}

package/dist/{chunk-7BR3DO2A.js → chunk-SRSJO5QE.js}

@@ -1,7 +1,14 @@
 // src/extension-attributes.ts
 var DATA_ATTRIBUTE_NAME = /^data-[a-z0-9_.:-]+$/;
 var POPOVER_TARGET_ACTIONS = /* @__PURE__ */ new Set(["toggle", "show", "hide"]);
-var ARIA_HASPOPUP_VALUES = /* @__PURE__ */ new Set(["dialog", "menu", "listbox", "tree", "grid", "true"]);
+var ARIA_HASPOPUP_VALUES = /* @__PURE__ */ new Set([
+  "dialog",
+  "menu",
+  "listbox",
+  "tree",
+  "grid",
+  "true"
+]);
 function filterDataAttributes(attributes, protectedNames) {
   const filtered = {};
   for (const [name, value] of Object.entries(attributes)) {
@@ -15,11 +22,13 @@ function filterDataAttributes(attributes, protectedNames) {
 function filterControlAttributes(attributes, protectedDataNames) {
   const source = attributes;
   const filtered = filterDataAttributes(attributes, protectedDataNames);
-  if (typeof source.popoverTarget === "string") filtered.popoverTarget = source.popoverTarget;
+  if (typeof source.popoverTarget === "string")
+    filtered.popoverTarget = source.popoverTarget;
   if (POPOVER_TARGET_ACTIONS.has(source.popoverTargetAction)) {
     filtered.popoverTargetAction = source.popoverTargetAction;
   }
-  if (typeof source["aria-controls"] === "string") filtered["aria-controls"] = source["aria-controls"];
+  if (typeof source["aria-controls"] === "string")
+    filtered["aria-controls"] = source["aria-controls"];
   if (ARIA_HASPOPUP_VALUES.has(source["aria-haspopup"])) {
     filtered["aria-haspopup"] = source["aria-haspopup"];
   }
@@ -28,4 +37,4 @@ function filterControlAttributes(attributes, protectedDataNames) {
 
 export { filterControlAttributes, filterDataAttributes };
 
-//# sourceMappingURL=chunk-7BR3DO2A.js.map
+//# sourceMappingURL=chunk-SRSJO5QE.js.map

package/dist/chunk-SRSJO5QE.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/extension-attributes.ts"],"names":[],"mappings":";AAEA,IAAM,mBAAA,GAAsB,sBAAA;AAC5B,IAAM,yCAAyB,IAAI,GAAA,CAAI,CAAC,QAAA,EAAU,MAAA,EAAQ,MAAM,CAAC,CAAA;AACjE,IAAM,oBAAA,uBAA2B,GAAA,CAAI;AAAA,EACnC,QAAA;AAAA,EACA,MAAA;AAAA,EACA,SAAA;AAAA,EACA,MAAA;AAAA,EACA,MAAA;AAAA,EACA;AACF,CAAC,CAAA;AAEM,SAAS,oBAAA,CACd,YACA,cAAA,EACwB;AACxB,EAAA,MAAM,WAAmC,EAAC;AAE1C,EAAA,KAAA,MAAW,CAAC,IAAA,EAAM,KAAK,KAAK,MAAA,CAAO,OAAA,CAAQ,UAA0B,CAAA,EAAG;AACtE,IAAA,MAAM,cAAA,GAAiB,KAAK,WAAA,EAAY;AACxC,IAAA,IACE,OAAO,KAAA,KAAU,QAAA,IACjB,mBAAA,CAAoB,IAAA,CAAK,cAAc,CAAA,IACvC,CAAC,cAAA,CAAe,GAAA,CAAI,cAAc,CAAA,EAClC;AACA,MAAA,QAAA,CAAS,cAAc,CAAA,GAAI,KAAA;AAAA,IAC7B;AAAA,EACF;AAEA,EAAA,OAAO,QAAA;AACT;AAEO,SAAS,uBAAA,CACd,YACA,kBAAA,EACwB;AACxB,EAAA,MAAM,MAAA,GAAS,UAAA;AACf,EAAA,MAAM,QAAA,GAAW,oBAAA,CAAqB,UAAA,EAAY,kBAAkB,CAAA;AAEpE,EAAA,IAAI,OAAO,OAAO,aAAA,KAAkB,QAAA;AAClC,IAAA,QAAA,CAAS,gBAAgB,MAAA,CAAO,aAAA;AAClC,EAAA,IAAI,sBAAA,CAAuB,GAAA,CAAI,MAAA,CAAO,mBAA6B,CAAA,EAAG;AACpE,IAAA,QAAA,CAAS,sBAAsB,MAAA,CAAO,mBAAA;AAAA,EACxC;AACA,EAAA,IAAI,OAAO,MAAA,CAAO,eAAe,CAAA,KAAM,QAAA;AACrC,IAAA,QAAA,CAAS,eAAe,CAAA,GAAI,MAAA,CAAO,eAAe,CAAA;AACpD,EAAA,IAAI,oBAAA,CAAqB,GAAA,CAAI,MAAA,CAAO,eAAe,CAAW,CAAA,EAAG;AAC/D,IAAA,QAAA,CAAS,eAAe,CAAA,GAAI,MAAA,CAAO,eAAe,CAAA;AAAA,EACpD;AAEA,EAAA,OAAO,QAAA;AACT","file":"chunk-SRSJO5QE.js","sourcesContent":["type AttributeBag = Readonly<Record<string, unknown>>;\n\nconst DATA_ATTRIBUTE_NAME = /^data-[a-z0-9_.:-]+$/;\nconst POPOVER_TARGET_ACTIONS = new Set(['toggle', 'show', 'hide']);\nconst ARIA_HASPOPUP_VALUES = new Set([\n  'dialog',\n  'menu',\n  'listbox',\n  'tree',\n  'grid',\n  'true',\n]);\n\nexport function filterDataAttributes(\n  attributes: object,\n  protectedNames: ReadonlySet<string>,\n): Record<string, string> {\n  const filtered: Record<string, string> = {};\n\n  for (const [name, value] of Object.entries(attributes as AttributeBag)) {\n    const normalizedName = name.toLowerCase();\n    if (\n      typeof value === 'string' &&\n      DATA_ATTRIBUTE_NAME.test(normalizedName) &&\n      !protectedNames.has(normalizedName)\n    ) {\n      filtered[normalizedName] = value;\n    }\n  }\n\n  return filtered;\n}\n\nexport function filterControlAttributes(\n  attributes: object,\n  protectedDataNames: ReadonlySet<string>,\n): Record<string, string> {\n  const source = attributes as AttributeBag;\n  const filtered = filterDataAttributes(attributes, protectedDataNames);\n\n  if (typeof source.popoverTarget === 'string')\n    filtered.popoverTarget = source.popoverTarget;\n  if (POPOVER_TARGET_ACTIONS.has(source.popoverTargetAction as string)) {\n    filtered.popoverTargetAction = source.popoverTargetAction as string;\n  }\n  if (typeof source['aria-controls'] === 'string')\n    filtered['aria-controls'] = source['aria-controls'];\n  if (ARIA_HASPOPUP_VALUES.has(source['aria-haspopup'] as string)) {\n    filtered['aria-haspopup'] = source['aria-haspopup'] as string;\n  }\n\n  return filtered;\n}\n"]}