@kerfjs/ui 5.0.0-beta.11 → 5.0.0-beta.110

package/dist/chunk-KH4KEMSP.js

@@ -0,0 +1,71 @@
+// src/shared/dom/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"
+]);
+function filterDataAttributes(attributes, protectedNames) {
+  const filtered = {};
+  for (const [name, value] of Object.entries(attributes)) {
+    const normalizedName = name.toLowerCase();
+    if (typeof value === "string" && DATA_ATTRIBUTE_NAME.test(normalizedName) && !protectedNames.has(normalizedName)) {
+      filtered[normalizedName] = value;
+    }
+  }
+  return filtered;
+}
+var ARIA_ATTRIBUTE_NAME = /^aria-[a-z]+$/;
+var STRUCTURAL_ROOT_ROLES = [
+  "region",
+  "group",
+  "list",
+  "feed",
+  "log",
+  "status",
+  "note",
+  "article",
+  "navigation",
+  "complementary",
+  "search",
+  "form",
+  "presentation",
+  "none"
+];
+var STRUCTURAL_ROLES = new Set(STRUCTURAL_ROOT_ROLES);
+function filterRootAttributes(attributes, protectedNames) {
+  const filtered = filterDataAttributes(attributes, protectedNames);
+  for (const [name, value] of Object.entries(attributes)) {
+    const normalizedName = name.toLowerCase();
+    if (typeof value !== "string" || protectedNames.has(normalizedName))
+      continue;
+    if (ARIA_ATTRIBUTE_NAME.test(normalizedName))
+      filtered[normalizedName] = value;
+    else if (normalizedName === "role" && STRUCTURAL_ROLES.has(value))
+      filtered.role = value;
+  }
+  return filtered;
+}
+function filterControlAttributes(attributes, protectedDataNames) {
+  const source = attributes;
+  const filtered = filterDataAttributes(attributes, protectedDataNames);
+  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 (ARIA_HASPOPUP_VALUES.has(source["aria-haspopup"])) {
+    filtered["aria-haspopup"] = source["aria-haspopup"];
+  }
+  return filtered;
+}
+
+export { filterControlAttributes, filterDataAttributes, filterRootAttributes };
+
+//# sourceMappingURL=chunk-KH4KEMSP.js.map

package/dist/chunk-KH4KEMSP.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/shared/dom/extension-attributes.ts"],"names":[],"mappings":"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","file":"chunk-KH4KEMSP.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\nconst ARIA_ATTRIBUTE_NAME = /^aria-[a-z]+$/;\n\n/**\n * Non-widget roles an application may give a layout root: landmarks, named\n * regions, groups, and live regions. Widget roles (button, grid, listbox, …)\n * promise keyboard behavior a layout primitive does not provide.\n */\nexport const STRUCTURAL_ROOT_ROLES = [\n  'region',\n  'group',\n  'list',\n  'feed',\n  'log',\n  'status',\n  'note',\n  'article',\n  'navigation',\n  'complementary',\n  'search',\n  'form',\n  'presentation',\n  'none',\n] as const;\nexport type StructuralRootRole = (typeof STRUCTURAL_ROOT_ROLES)[number];\nconst STRUCTURAL_ROLES = new Set<string>(STRUCTURAL_ROOT_ROLES);\n\n/** Safe `data-*`, `aria-*`, and structural `role` metadata on a layout root. */\nexport type StructuralRootAttributes = Readonly<\n  Record<`data-${string}` | `aria-${string}`, string | undefined> & {\n    role?: StructuralRootRole;\n  }\n>;\n\n/**\n * `filterDataAttributes` plus `aria-*` string attributes and a structural\n * `role`, for layout roots an application names or marks as a region.\n */\nexport function filterRootAttributes(\n  attributes: object,\n  protectedNames: ReadonlySet<string>,\n): Record<string, string> {\n  const filtered = filterDataAttributes(attributes, protectedNames);\n  for (const [name, value] of Object.entries(attributes as AttributeBag)) {\n    const normalizedName = name.toLowerCase();\n    if (typeof value !== 'string' || protectedNames.has(normalizedName))\n      continue;\n    if (ARIA_ATTRIBUTE_NAME.test(normalizedName))\n      filtered[normalizedName] = value;\n    else if (normalizedName === 'role' && STRUCTURAL_ROLES.has(value))\n      filtered.role = value;\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"]}

package/dist/chunk-KK3S5OTW.js

@@ -0,0 +1,98 @@
+// src/components/forms/file-picker/wiring/wire-file-pickers.ts
+var PICKER = '[data-component="file-picker-trigger"], [data-component="file-drop-zone"]';
+var DROP_ZONE = '[data-component="file-drop-zone"]';
+function fileMatchesAccept(file, accept) {
+  const tokens = accept.split(",").map((token) => token.trim().toLowerCase()).filter(Boolean);
+  if (tokens.length === 0) return true;
+  const name = file.name.toLowerCase();
+  const type = file.type.toLowerCase();
+  return tokens.some((token) => {
+    if (token.startsWith(".")) return name.endsWith(token);
+    if (token.endsWith("/*")) return type.startsWith(token.slice(0, -1));
+    return type === token;
+  });
+}
+function pickerOf(input) {
+  return input.closest(PICKER);
+}
+function inputOf(picker) {
+  return picker.querySelector('input[type="file"]');
+}
+function wireFilePickers(root, { onFiles }) {
+  const report = (picker, files, via) => {
+    if (files.length === 0) return;
+    onFiles({ picker, id: picker.dataset.filePickerId, files, via });
+  };
+  const onChange = (event) => {
+    const input = event.target;
+    if (!(input instanceof HTMLInputElement) || input.type !== "file") return;
+    const picker = pickerOf(input);
+    if (!picker) return;
+    report(picker, [...input.files], "browse");
+    input.value = "";
+  };
+  const zoneOf = (event) => {
+    const target = event.target instanceof Element ? event.target : null;
+    if (!target) return null;
+    const direct = target.closest(DROP_ZONE);
+    if (direct)
+      return direct.dataset.disabled === "true" ? null : { zone: direct, area: areaOf(direct) };
+    for (const zone of root.querySelectorAll(
+      `${DROP_ZONE}[data-drop-scope]`
+    )) {
+      const area = areaOf(zone);
+      if (area !== zone && area.contains(target))
+        return zone.dataset.disabled === "true" ? null : { zone, area };
+    }
+    return null;
+  };
+  const areaOf = (zone) => {
+    const scope = zone.dataset.dropScope;
+    return scope && zone.parentElement?.closest(scope) || zone;
+  };
+  const carriesFiles = (event) => [...event.dataTransfer?.types ?? []].includes("Files");
+  const onDragOver = (event) => {
+    const drag = event;
+    const over = zoneOf(drag);
+    if (!over || !carriesFiles(drag)) return;
+    drag.preventDefault();
+    drag.dataTransfer.dropEffect = "copy";
+    over.zone.dataset.dragging = "true";
+  };
+  const onDragLeave = (event) => {
+    const over = zoneOf(event);
+    const related = event.relatedTarget;
+    if (over && !(related instanceof Node && over.area.contains(related)))
+      delete over.zone.dataset.dragging;
+  };
+  const onDrop = (event) => {
+    const drag = event;
+    const over = zoneOf(drag);
+    if (!over) return;
+    const { zone } = over;
+    drag.preventDefault();
+    delete zone.dataset.dragging;
+    const input = inputOf(zone);
+    let files = [...drag.dataTransfer?.files ?? []];
+    if (input?.accept)
+      files = files.filter((file) => fileMatchesAccept(file, input.accept));
+    if (input && !input.multiple) files = files.slice(0, 1);
+    report(zone, files, "drop");
+  };
+  root.addEventListener("change", onChange);
+  root.addEventListener("dragenter", onDragOver);
+  root.addEventListener("dragover", onDragOver);
+  root.addEventListener("dragleave", onDragLeave);
+  root.addEventListener("drop", onDrop);
+  return () => {
+    root.removeEventListener("change", onChange);
+    root.removeEventListener("dragenter", onDragOver);
+    root.removeEventListener("dragover", onDragOver);
+    root.removeEventListener("dragleave", onDragLeave);
+    root.removeEventListener("drop", onDrop);
+  };
+}
+
+export { fileMatchesAccept, wireFilePickers };
+
+//# sourceMappingURL=chunk-KK3S5OTW.js.map

package/dist/chunk-KK3S5OTW.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/forms/file-picker/wiring/wire-file-pickers.ts"],"names":[],"mappings":";AAEA,IAAM,MAAA,GACJ,2EAAA;AACF,IAAM,SAAA,GAAY,mCAAA;AAiBX,SAAS,iBAAA,CAAkB,MAAY,MAAA,EAAyB;AACrE,EAAA,MAAM,MAAA,GAAS,MAAA,CACZ,KAAA,CAAM,GAAG,EACT,GAAA,CAAI,CAAC,KAAA,KAAU,KAAA,CAAM,MAAK,CAAE,WAAA,EAAa,CAAA,CACzC,OAAO,OAAO,CAAA;AACjB,EAAA,IAAI,MAAA,CAAO,MAAA,KAAW,CAAA,EAAG,OAAO,IAAA;AAChC,EAAA,MAAM,IAAA,GAAO,IAAA,CAAK,IAAA,CAAK,WAAA,EAAY;AACnC,EAAA,MAAM,IAAA,GAAO,IAAA,CAAK,IAAA,CAAK,WAAA,EAAY;AACnC,EAAA,OAAO,MAAA,CAAO,IAAA,CAAK,CAAC,KAAA,KAAU;AAC5B,IAAA,IAAI,MAAM,UAAA,CAAW,GAAG,GAAG,OAAO,IAAA,CAAK,SAAS,KAAK,CAAA;AACrD,IAAA,IAAI,KAAA,CAAM,QAAA,CAAS,IAAI,CAAA,EAAG,OAAO,IAAA,CAAK,UAAA,CAAW,KAAA,CAAM,KAAA,CAAM,CAAA,EAAG,EAAE,CAAC,CAAA;AACnE,IAAA,OAAO,IAAA,KAAS,KAAA;AAAA,EAClB,CAAC,CAAA;AACH;AAEA,SAAS,SAAS,KAAA,EAA6C;AAC7D,EAAA,OAAO,KAAA,CAAM,QAAqB,MAAM,CAAA;AAC1C;AAEA,SAAS,QAAQ,MAAA,EAA8C;AAC7D,EAAA,OAAO,MAAA,CAAO,cAAgC,oBAAoB,CAAA;AACpE;AAWO,SAAS,eAAA,CACd,IAAA,EACA,EAAE,OAAA,EAAQ,EACE;AACZ,EAAA,MAAM,MAAA,GAAS,CACb,MAAA,EACA,KAAA,EACA,GAAA,KACG;AACH,IAAA,IAAI,KAAA,CAAM,WAAW,CAAA,EAAG;AACxB,IAAA,OAAA,CAAQ,EAAE,QAAQ,EAAA,EAAI,MAAA,CAAO,QAAQ,YAAA,EAAc,KAAA,EAAO,KAAK,CAAA;AAAA,EACjE,CAAA;AACA,EAAA,MAAM,QAAA,GAAW,CAAC,KAAA,KAAiB;AACjC,IAAA,MAAM,QAAQ,KAAA,CAAM,MAAA;AACpB,IAAA,IAAI,EAAE,KAAA,YAAiB,gBAAA,CAAA,IAAqB,KAAA,CAAM,SAAS,MAAA,EAAQ;AACnE,IAAA,MAAM,MAAA,GAAS,SAAS,KAAK,CAAA;AAC7B,IAAA,IAAI,CAAC,MAAA,EAAQ;AAEb,IAAA,MAAA,CAAO,QAAQ,CAAC,GAAG,KAAA,CAAM,KAAM,GAAG,QAAQ,CAAA;AAC1C,IAAA,KAAA,CAAM,KAAA,GAAQ,EAAA;AAAA,EAChB,CAAA;AAGA,EAAA,MAAM,MAAA,GAAS,CACb,KAAA,KACoD;AACpD,IAAA,MAAM,MAAA,GAAS,KAAA,CAAM,MAAA,YAAkB,OAAA,GAAU,MAAM,MAAA,GAAS,IAAA;AAChE,IAAA,IAAI,CAAC,QAAQ,OAAO,IAAA;AACpB,IAAA,MAAM,MAAA,GAAS,MAAA,CAAO,OAAA,CAAqB,SAAS,CAAA;AACpD,IAAA,IAAI,MAAA;AACF,MAAA,OAAO,MAAA,CAAO,OAAA,CAAQ,QAAA,KAAa,MAAA,GAC/B,IAAA,GACA,EAAE,IAAA,EAAM,MAAA,EAAQ,IAAA,EAAM,MAAA,CAAO,MAAM,CAAA,EAAE;AAC3C,IAAA,KAAA,MAAW,QAAQ,IAAA,CAAK,gBAAA;AAAA,MACtB,GAAG,SAAS,CAAA,iBAAA;AAAA,KACd,EAAG;AACD,MAAA,MAAM,IAAA,GAAO,OAAO,IAAI,CAAA;AACxB,MAAA,IAAI,IAAA,KAAS,IAAA,IAAQ,IAAA,CAAK,QAAA,CAAS,MAAM,CAAA;AACvC,QAAA,OAAO,KAAK,OAAA,CAAQ,QAAA,KAAa,SAAS,IAAA,GAAO,EAAE,MAAM,IAAA,EAAK;AAAA,IAClE;AACA,IAAA,OAAO,IAAA;AAAA,EACT,CAAA;AACA,EAAA,MAAM,MAAA,GAAS,CAAC,IAAA,KAAmC;AACjD,IAAA,MAAM,KAAA,GAAQ,KAAK,OAAA,CAAQ,SAAA;AAC3B,IAAA,OAAQ,KAAA,IAAS,IAAA,CAAK,aAAA,EAAe,OAAA,CAAqB,KAAK,CAAA,IAAM,IAAA;AAAA,EACvE,CAAA;AACA,EAAA,MAAM,YAAA,GAAe,CAAC,KAAA,KACpB,CAAC,GAAI,KAAA,CAAM,YAAA,EAAc,KAAA,IAAS,EAAG,CAAA,CAAE,QAAA,CAAS,OAAO,CAAA;AACzD,EAAA,MAAM,UAAA,GAAa,CAAC,KAAA,KAAiB;AACnC,IAAA,MAAM,IAAA,GAAO,KAAA;AACb,IAAA,MAAM,IAAA,GAAO,OAAO,IAAI,CAAA;AACxB,IAAA,IAAI,CAAC,IAAA,IAAQ,CAAC,YAAA,CAAa,IAAI,CAAA,EAAG;AAClC,IAAA,IAAA,CAAK,cAAA,EAAe;AAEpB,IAAA,IAAA,CAAK,aAAc,UAAA,GAAa,MAAA;AAChC,IAAA,IAAA,CAAK,IAAA,CAAK,QAAQ,QAAA,GAAW,MAAA;AAAA,EAC/B,CAAA;AACA,EAAA,MAAM,WAAA,GAAc,CAAC,KAAA,KAAiB;AACpC,IAAA,MAAM,IAAA,GAAO,OAAO,KAAK,CAAA;AACzB,IAAA,MAAM,UAAW,KAAA,CAAoB,aAAA;AACrC,IAAA,IAAI,QAAQ,EAAE,OAAA,YAAmB,QAAQ,IAAA,CAAK,IAAA,CAAK,SAAS,OAAO,CAAA,CAAA;AACjE,MAAA,OAAO,IAAA,CAAK,KAAK,OAAA,CAAQ,QAAA;AAAA,EAC7B,CAAA;AACA,EAAA,MAAM,MAAA,GAAS,CAAC,KAAA,KAAiB;AAC/B,IAAA,MAAM,IAAA,GAAO,KAAA;AACb,IAAA,MAAM,IAAA,GAAO,OAAO,IAAI,CAAA;AACxB,IAAA,IAAI,CAAC,IAAA,EAAM;AACX,IAAA,MAAM,EAAE,MAAK,GAAI,IAAA;AACjB,IAAA,IAAA,CAAK,cAAA,EAAe;AACpB,IAAA,OAAO,KAAK,OAAA,CAAQ,QAAA;AACpB,IAAA,MAAM,KAAA,GAAQ,QAAQ,IAAI,CAAA;AAC1B,IAAA,IAAI,QAAQ,CAAC,GAAI,KAAK,YAAA,EAAc,KAAA,IAAS,EAAG,CAAA;AAChD,IAAA,IAAI,KAAA,EAAO,MAAA;AACT,MAAA,KAAA,GAAQ,KAAA,CAAM,OAAO,CAAC,IAAA,KAAS,kBAAkB,IAAA,EAAM,KAAA,CAAM,MAAM,CAAC,CAAA;AACtE,IAAA,IAAI,KAAA,IAAS,CAAC,KAAA,CAAM,QAAA,UAAkB,KAAA,CAAM,KAAA,CAAM,GAAG,CAAC,CAAA;AACtD,IAAA,MAAA,CAAO,IAAA,EAAM,OAAO,MAAM,CAAA;AAAA,EAC5B,CAAA;AACA,EAAA,IAAA,CAAK,gBAAA,CAAiB,UAAU,QAAQ,CAAA;AACxC,EAAA,IAAA,CAAK,gBAAA,CAAiB,aAAa,UAAU,CAAA;AAC7C,EAAA,IAAA,CAAK,gBAAA,CAAiB,YAAY,UAAU,CAAA;AAC5C,EAAA,IAAA,CAAK,gBAAA,CAAiB,aAAa,WAAW,CAAA;AAC9C,EAAA,IAAA,CAAK,gBAAA,CAAiB,QAAQ,MAAM,CAAA;AACpC,EAAA,OAAO,MAAM;AACX,IAAA,IAAA,CAAK,mBAAA,CAAoB,UAAU,QAAQ,CAAA;AAC3C,IAAA,IAAA,CAAK,mBAAA,CAAoB,aAAa,UAAU,CAAA;AAChD,IAAA,IAAA,CAAK,mBAAA,CAAoB,YAAY,UAAU,CAAA;AAC/C,IAAA,IAAA,CAAK,mBAAA,CAAoB,aAAa,WAAW,CAAA;AACjD,IAAA,IAAA,CAAK,mBAAA,CAAoB,QAAQ,MAAM,CAAA;AAAA,EACzC,CAAA;AACF","file":"chunk-KK3S5OTW.js","sourcesContent":["type Root = HTMLElement | Document;\n\nconst PICKER =\n  '[data-component=\"file-picker-trigger\"], [data-component=\"file-drop-zone\"]';\nconst DROP_ZONE = '[data-component=\"file-drop-zone\"]';\n\n/** Files a picker reported, and how they arrived. */\nexport interface FilePickerSelection {\n  /** The trigger or drop zone element. */\n  picker: HTMLElement;\n  /** Its `pickerId`, when set. */\n  id?: string;\n  files: File[];\n  via: 'browse' | 'drop';\n}\n\nexport interface WireFilePickersOptions {\n  onFiles: (selection: FilePickerSelection) => void;\n}\n\n/** Whether a file matches a native `accept` list (`.png, image/*, text/plain`). */\nexport function fileMatchesAccept(file: File, accept: string): boolean {\n  const tokens = accept\n    .split(',')\n    .map((token) => token.trim().toLowerCase())\n    .filter(Boolean);\n  if (tokens.length === 0) return true;\n  const name = file.name.toLowerCase();\n  const type = file.type.toLowerCase();\n  return tokens.some((token) => {\n    if (token.startsWith('.')) return name.endsWith(token);\n    if (token.endsWith('/*')) return type.startsWith(token.slice(0, -1));\n    return type === token;\n  });\n}\n\nfunction pickerOf(input: HTMLInputElement): HTMLElement | null {\n  return input.closest<HTMLElement>(PICKER);\n}\n\nfunction inputOf(picker: HTMLElement): HTMLInputElement | null {\n  return picker.querySelector<HTMLInputElement>('input[type=\"file\"]');\n}\n\n/**\n * Report files chosen through any `FilePickerTrigger` or `FileDropZone` below\n * root, or dropped on a `FileDropZone` (or anywhere in the enclosing element\n * its `dropScope` names), and mark a zone `data-dragging` while files are\n * dragged over it or its scope. Dropped files are filtered by the input's\n * `accept` (and to one when it is not `multiple`); a disabled picker ignores\n * drops. The input is reset after each report, so choosing the same file again\n * reports again. Dispose with the owning application.\n */\nexport function wireFilePickers(\n  root: Root,\n  { onFiles }: WireFilePickersOptions,\n): () => void {\n  const report = (\n    picker: HTMLElement,\n    files: File[],\n    via: FilePickerSelection['via'],\n  ) => {\n    if (files.length === 0) return;\n    onFiles({ picker, id: picker.dataset.filePickerId, files, via });\n  };\n  const onChange = (event: Event) => {\n    const input = event.target;\n    if (!(input instanceof HTMLInputElement) || input.type !== 'file') return;\n    const picker = pickerOf(input);\n    if (!picker) return;\n    // A file input always has a FileList.\n    report(picker, [...input.files!], 'browse');\n    input.value = '';\n  };\n  // The zone a drag event targets, and the area that counts as over it: the\n  // zone itself, or the enclosing element its `dropScope` names.\n  const zoneOf = (\n    event: Event,\n  ): { zone: HTMLElement; area: HTMLElement } | null => {\n    const target = event.target instanceof Element ? event.target : null;\n    if (!target) return null;\n    const direct = target.closest<HTMLElement>(DROP_ZONE);\n    if (direct)\n      return direct.dataset.disabled === 'true'\n        ? null\n        : { zone: direct, area: areaOf(direct) };\n    for (const zone of root.querySelectorAll<HTMLElement>(\n      `${DROP_ZONE}[data-drop-scope]`,\n    )) {\n      const area = areaOf(zone);\n      if (area !== zone && area.contains(target))\n        return zone.dataset.disabled === 'true' ? null : { zone, area };\n    }\n    return null;\n  };\n  const areaOf = (zone: HTMLElement): HTMLElement => {\n    const scope = zone.dataset.dropScope;\n    return (scope && zone.parentElement?.closest<HTMLElement>(scope)) || zone;\n  };\n  const carriesFiles = (event: DragEvent) =>\n    [...(event.dataTransfer?.types ?? [])].includes('Files');\n  const onDragOver = (event: Event) => {\n    const drag = event as DragEvent;\n    const over = zoneOf(drag);\n    if (!over || !carriesFiles(drag)) return;\n    drag.preventDefault();\n    // carriesFiles guarantees a DataTransfer.\n    drag.dataTransfer!.dropEffect = 'copy';\n    over.zone.dataset.dragging = 'true';\n  };\n  const onDragLeave = (event: Event) => {\n    const over = zoneOf(event);\n    const related = (event as DragEvent).relatedTarget;\n    if (over && !(related instanceof Node && over.area.contains(related)))\n      delete over.zone.dataset.dragging;\n  };\n  const onDrop = (event: Event) => {\n    const drag = event as DragEvent;\n    const over = zoneOf(drag);\n    if (!over) return;\n    const { zone } = over;\n    drag.preventDefault();\n    delete zone.dataset.dragging;\n    const input = inputOf(zone);\n    let files = [...(drag.dataTransfer?.files ?? [])];\n    if (input?.accept)\n      files = files.filter((file) => fileMatchesAccept(file, input.accept));\n    if (input && !input.multiple) files = files.slice(0, 1);\n    report(zone, files, 'drop');\n  };\n  root.addEventListener('change', onChange);\n  root.addEventListener('dragenter', onDragOver);\n  root.addEventListener('dragover', onDragOver);\n  root.addEventListener('dragleave', onDragLeave);\n  root.addEventListener('drop', onDrop);\n  return () => {\n    root.removeEventListener('change', onChange);\n    root.removeEventListener('dragenter', onDragOver);\n    root.removeEventListener('dragover', onDragOver);\n    root.removeEventListener('dragleave', onDragLeave);\n    root.removeEventListener('drop', onDrop);\n  };\n}\n"]}

package/dist/chunk-KPINJHIC.js

@@ -0,0 +1,122 @@
+import { LoadingSpinner } from './chunk-WVS6CUCT.js';
+import { Badge } from './chunk-RMWNO6BA.js';
+import { filterDataAttributes } from './chunk-KH4KEMSP.js';
+import { jsx, jsxs, Fragment } from 'kerfjs/jsx-runtime';
+
+var BUTTON_PROTECTED = /* @__PURE__ */ new Set([
+  "data-component",
+  "data-action",
+  "data-tone",
+  "data-emphasis",
+  "data-size",
+  "data-loading",
+  "data-icon-only",
+  "data-shape",
+  "data-fill",
+  "data-focus-ring-inset"
+]);
+function Button({
+  children,
+  tone = "neutral",
+  emphasis = "primary",
+  size = "default",
+  shape = "rounded",
+  fill = false,
+  pressed,
+  icon,
+  loading = false,
+  disabled = false,
+  type = "button",
+  name,
+  value,
+  form,
+  href,
+  target,
+  action,
+  focusRingInset = false,
+  badge,
+  badgeLabel,
+  badgeTone = "danger",
+  ariaLabel,
+  title,
+  id,
+  className = "",
+  rootAttributes = {},
+  slot
+}) {
+  const shared = {
+    ...filterDataAttributes(rootAttributes, BUTTON_PROTECTED),
+    id,
+    class: `kui-button ${className}`.trim(),
+    "data-component": "button",
+    "data-tone": tone,
+    "data-emphasis": emphasis,
+    "data-size": size,
+    "data-loading": loading ? "" : void 0,
+    "data-icon-only": children === void 0 ? "" : void 0,
+    "data-shape": shape === "pill" ? "pill" : void 0,
+    "data-fill": fill ? "true" : void 0,
+    "data-focus-ring-inset": focusRingInset ? "true" : void 0,
+    "data-action": action,
+    "aria-label": ariaLabel && badge !== void 0 && badgeLabel ? `${ariaLabel}, ${badgeLabel}` : ariaLabel,
+    title,
+    "aria-busy": loading ? "true" : void 0,
+    slot
+  };
+  const content = /* @__PURE__ */ jsxs(Fragment, { children: [
+    icon === void 0 ? null : /* @__PURE__ */ jsx("span", { class: "kui-button__icon", "aria-hidden": "true", children: icon }),
+    children === void 0 ? null : /* @__PURE__ */ jsx("span", { class: "kui-button__label", children }),
+    badge === void 0 || badge === "" ? null : badge === true ? /* @__PURE__ */ jsx(
+      Badge,
+      {
+        tone: badgeTone,
+        size: "dot",
+        placement: "corner",
+        ...ariaLabel || !badgeLabel ? { ariaHidden: true } : { label: badgeLabel }
+      }
+    ) : /* @__PURE__ */ jsx(
+      Badge,
+      {
+        tone: badgeTone,
+        appearance: "solid",
+        size: "compact",
+        placement: "corner",
+        ...ariaLabel || !badgeLabel ? { ariaHidden: true } : { label: badgeLabel },
+        children: String(badge)
+      }
+    ),
+    loading ? /* @__PURE__ */ jsx("span", { class: "kui-button__spinner", "aria-hidden": "true", children: /* @__PURE__ */ jsx(LoadingSpinner, {}) }) : null
+  ] });
+  if (href !== void 0) {
+    if (pressed !== void 0)
+      throw new TypeError("A link Button cannot be a toggle (pressed).");
+    return /* @__PURE__ */ jsx(
+      "a",
+      {
+        ...shared,
+        href: disabled ? void 0 : href,
+        target: disabled ? void 0 : target,
+        role: disabled ? "link" : void 0,
+        "aria-disabled": disabled ? "true" : void 0,
+        children: content
+      }
+    );
+  }
+  return /* @__PURE__ */ jsx(
+    "button",
+    {
+      ...shared,
+      type,
+      name,
+      value,
+      form,
+      disabled,
+      "aria-pressed": pressed === void 0 ? void 0 : String(pressed),
+      children: content
+    }
+  );
+}
+
+export { Button };
+
+//# sourceMappingURL=chunk-KPINJHIC.js.map

package/dist/chunk-KPINJHIC.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/actions/button/button.tsx"],"names":[],"mappings":"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","file":"chunk-KPINJHIC.js","sourcesContent":["import type { KerfUiContent } from '../../../shared/content/semantic-content.js';\nimport { filterDataAttributes } from '../../../shared/dom/extension-attributes.js';\nimport { Badge, type BadgeTone } from '../../feedback/badge/badge.js';\nimport { LoadingSpinner } from '../../feedback/loading-spinner/loading-spinner.js';\n\n/** The color family: `neutral` (default), `brand` for the main action, `success` for a positive one, `danger` for a destructive one. */\nexport type ButtonTone = 'neutral' | 'brand' | 'success' | 'danger';\n\n/**\n * How loudly it asks: `primary` (default) fills the button, `secondary`\n * outlines it, and `plain` shows only its text until hovered.\n */\nexport type ButtonEmphasis = 'primary' | 'secondary' | 'plain';\n\n/** `default` is the 44px control height; `compact` is 33px with smaller text. */\nexport type ButtonSize = 'default' | 'compact';\n\n/** Corner shape: the shared `rounded` control radius (default) or a full `pill`. */\nexport type ButtonShape = 'rounded' | 'pill';\n/** What a form button does: `button` (default), `submit`, or `reset`. */\nexport type ButtonType = 'button' | 'submit' | 'reset';\n\nconst BUTTON_PROTECTED = new Set([\n  'data-component',\n  'data-action',\n  'data-tone',\n  'data-emphasis',\n  'data-size',\n  'data-loading',\n  'data-icon-only',\n  'data-shape',\n  'data-fill',\n  'data-focus-ring-inset',\n]);\n\n/** Application `data-*` metadata; the Button's own markers stay protected. */\nexport type ButtonRootAttributes = Readonly<\n  Record<`data-${string}`, string | undefined>\n>;\n\n/** A Button's visible label: text or rendered content, never empty. */\nexport type ButtonLabel =\n  string | Exclude<KerfUiContent, null | undefined | boolean>;\n\n/**\n * A labeled button (its label names it; `ariaLabel` only when the label is\n * not enough), or an icon-only square named by `ariaLabel`.\n */\nexport type ButtonContent =\n  | {\n      /** The label. */\n      children: ButtonLabel;\n      /** A leading icon, such as a `LucideIcon`; it is decorative. */\n      icon?: KerfUiContent;\n      ariaLabel?: string;\n    }\n  | {\n      children?: undefined;\n      /** The icon of an icon-only square button. */\n      icon: KerfUiContent;\n      /** The accessible name an icon-only button needs. */\n      ariaLabel: string;\n    };\n\nexport type ButtonProps = ButtonContent & ButtonOptions;\n\nexport interface ButtonOptions {\n  tone?: ButtonTone;\n  emphasis?: ButtonEmphasis;\n  size?: ButtonSize;\n  /** Corner shape (default `rounded`). */\n  shape?: ButtonShape;\n  /**\n   * Span the full width of the parent instead of sizing to the label, as on\n   * `SplitButton`. The label stays centered and ellipsizes when it no longer\n   * fits.\n   */\n  fill?: boolean;\n  /**\n   * Make it a toggle: `aria-pressed` reports the state, and a pressed look is\n   * drawn on top of the tone and emphasis. The application owns the state and\n   * flips it in its `action` handler. A link (`href`) cannot be a toggle.\n   */\n  pressed?: boolean;\n  /**\n   * Busy: a spinner replaces the label (which still names it) and the button\n   * reports `aria-busy`. Presses still reach it; the application decides\n   * what a press does while it is busy.\n   */\n  loading?: boolean;\n  disabled?: boolean;\n  /** A form button's behavior (default `button`, which never submits). */\n  type?: ButtonType;\n  name?: string;\n  value?: string;\n  /** The id of the form it belongs to, when it sits outside that form. */\n  form?: string;\n  /** Render a link with button styling instead of a `<button>`. */\n  href?: string;\n  /** Where a link opens. */\n  target?: '_self' | '_blank' | '_parent' | '_top';\n  /** Delegated `data-action` the application handles. */\n  action?: string;\n  /**\n   * Keep the button's focus ring inside its box when an ancestor clips\n   * overflow. The inset ring is two-tone, a surface-colored line inside the\n   * ring color, so it stays visible on a loud fill of the ring's own hue.\n   */\n  focusRingInset?: boolean;\n  /**\n   * A count, short text, or `true` for a text-free dot over the button's\n   * top-trailing corner, such as how many items a filter hides. It stays out\n   * of the accessible name unless `badgeLabel` names it.\n   */\n  badge?: number | string | true;\n  /** Words for the badge (\"3 hidden\"), added to the button's name. */\n  badgeLabel?: string;\n  /** The badge's tone (default `danger`). */\n  badgeTone?: BadgeTone;\n  /**\n   * Native hover text that says more than the name, such as \"More Actions\n   * for report.pdf\". An icon-only Button already gets a help tag with its\n   * `ariaLabel` (with `@kerfjs/ui/help-tags-register`); a `title` replaces\n   * that tag.\n   */\n  title?: string;\n  id?: string;\n  className?: string;\n  /** Safe `data-*` metadata (a `data-key`, `data-dialog-close`). */\n  rootAttributes?: ButtonRootAttributes;\n  /** Native named-slot assignment when composed inside a web component. */\n  slot?: string;\n}\n\n/**\n * A standalone action button: a native `<button>` (or a link with `href`)\n * in one of four tones and three emphases, at the 44px control height or\n * compact, with a label or as an icon-only square, rounded or pill-shaped,\n * sized to its label or filling its parent's width, and optionally a\n * `pressed` toggle. Inside a\n * `ToolbarControlGroup`, use a plain `<button>`, which the group styles; use\n * Button for a dialog footer, a form, or a standalone action beside other\n * content.\n */\nexport function Button({\n  children,\n  tone = 'neutral',\n  emphasis = 'primary',\n  size = 'default',\n  shape = 'rounded',\n  fill = false,\n  pressed,\n  icon,\n  loading = false,\n  disabled = false,\n  type = 'button',\n  name,\n  value,\n  form,\n  href,\n  target,\n  action,\n  focusRingInset = false,\n  badge,\n  badgeLabel,\n  badgeTone = 'danger',\n  ariaLabel,\n  title,\n  id,\n  className = '',\n  rootAttributes = {},\n  slot,\n}: ButtonProps) {\n  const shared = {\n    ...filterDataAttributes(rootAttributes, BUTTON_PROTECTED),\n    id,\n    class: `kui-button ${className}`.trim(),\n    'data-component': 'button',\n    'data-tone': tone,\n    'data-emphasis': emphasis,\n    'data-size': size,\n    'data-loading': loading ? '' : undefined,\n    'data-icon-only': children === undefined ? '' : undefined,\n    'data-shape': shape === 'pill' ? 'pill' : undefined,\n    'data-fill': fill ? 'true' : undefined,\n    'data-focus-ring-inset': focusRingInset ? 'true' : undefined,\n    'data-action': action,\n    'aria-label':\n      ariaLabel && badge !== undefined && badgeLabel\n        ? `${ariaLabel}, ${badgeLabel}`\n        : ariaLabel,\n    title,\n    'aria-busy': loading ? 'true' : undefined,\n    slot,\n  };\n  const content = (\n    <>\n      {icon === undefined ? null : (\n        <span class=\"kui-button__icon\" aria-hidden=\"true\">\n          {icon}\n        </span>\n      )}\n      {children === undefined ? null : (\n        <span class=\"kui-button__label\">{children}</span>\n      )}\n      {badge === undefined || badge === '' ? null : badge === true ? (\n        <Badge\n          tone={badgeTone}\n          size=\"dot\"\n          placement=\"corner\"\n          {...(ariaLabel || !badgeLabel\n            ? { ariaHidden: true as const }\n            : { label: badgeLabel })}\n        />\n      ) : (\n        <Badge\n          tone={badgeTone}\n          appearance=\"solid\"\n          size=\"compact\"\n          placement=\"corner\"\n          {...(ariaLabel || !badgeLabel\n            ? { ariaHidden: true as const }\n            : { label: badgeLabel })}\n        >\n          {String(badge)}\n        </Badge>\n      )}\n      {loading ? (\n        <span class=\"kui-button__spinner\" aria-hidden=\"true\">\n          <LoadingSpinner />\n        </span>\n      ) : null}\n    </>\n  );\n  // A disabled link has no destination and is announced as disabled.\n  if (href !== undefined) {\n    if (pressed !== undefined)\n      throw new TypeError('A link Button cannot be a toggle (pressed).');\n    return (\n      <a\n        {...shared}\n        href={disabled ? undefined : href}\n        target={disabled ? undefined : target}\n        role={disabled ? 'link' : undefined}\n        aria-disabled={disabled ? 'true' : undefined}\n      >\n        {content}\n      </a>\n    );\n  }\n  return (\n    <button\n      {...shared}\n      type={type}\n      name={name}\n      value={value}\n      form={form}\n      disabled={disabled}\n      aria-pressed={pressed === undefined ? undefined : String(pressed)}\n    >\n      {content}\n    </button>\n  );\n}\n"]}

package/dist/chunk-LMHN2TJL.js

@@ -0,0 +1,167 @@
+import { filterDataAttributes } from './chunk-KH4KEMSP.js';
+import { jsx, jsxs, Fragment } from 'kerfjs/jsx-runtime';
+
+var chipProtectedAttributes = /* @__PURE__ */ new Set([
+  "data-component",
+  "data-tone",
+  "data-appearance",
+  "data-shape",
+  "data-size",
+  "data-disabled",
+  "data-truncate",
+  "data-item-id",
+  "data-link",
+  "data-action"
+]);
+function removeButton(action, label, disabled) {
+  return /* @__PURE__ */ jsx(
+    "button",
+    {
+      class: "kui-chip__remove",
+      type: "button",
+      "data-action": action,
+      "aria-label": label,
+      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"
+        }
+      ) })
+    }
+  );
+}
+function downloadValue(download) {
+  switch (download) {
+    case void 0:
+    case false:
+      return void 0;
+    case true:
+      return "";
+    default:
+      return download;
+  }
+}
+function Chip({
+  children,
+  icon,
+  truncate = false,
+  tone = "neutral",
+  appearance = "quiet",
+  shape = "pill",
+  size = "default",
+  disabled = false,
+  itemId,
+  rootAttributes = {},
+  className = "",
+  slot,
+  href,
+  download,
+  external = false,
+  removeAction,
+  removeLabel,
+  action,
+  actionLabel
+}) {
+  if (truncate && typeof children !== "string")
+    throw new TypeError("Chip truncate requires a plain text label");
+  if (action !== void 0 && (href !== void 0 || removeAction !== void 0 || removeLabel !== void 0))
+    throw new TypeError(
+      "Chip action cannot be combined with href or removeAction, because nested interactive content is invalid"
+    );
+  const content = /* @__PURE__ */ jsxs(Fragment, { 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
+      }
+    )
+  ] });
+  const rootClass = `kui-chip ${className}`.trim();
+  const identity = filterDataAttributes(
+    rootAttributes,
+    chipProtectedAttributes
+  );
+  if (href !== void 0) {
+    const textLabel = typeof children === "string" || typeof children === "number" ? String(children) : void 0;
+    return /* @__PURE__ */ jsx(
+      "a",
+      {
+        ...identity,
+        class: rootClass,
+        href: disabled ? void 0 : href,
+        download: disabled ? void 0 : downloadValue(download),
+        target: disabled || !external ? void 0 : "_blank",
+        rel: disabled || !external ? void 0 : "noopener noreferrer",
+        tabindex: disabled ? -1 : void 0,
+        "aria-label": external && textLabel !== void 0 ? `${textLabel} (opens in new tab)` : void 0,
+        "aria-disabled": disabled ? "true" : void 0,
+        "data-component": "chip",
+        "data-link": "",
+        "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: content
+      }
+    );
+  }
+  if (action !== void 0) {
+    return /* @__PURE__ */ jsx(
+      "button",
+      {
+        ...identity,
+        class: rootClass,
+        type: "button",
+        disabled,
+        "aria-label": actionLabel?.trim() || void 0,
+        "data-action": action,
+        "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: content
+      }
+    );
+  }
+  return /* @__PURE__ */ jsxs(
+    "span",
+    {
+      ...identity,
+      class: rootClass,
+      "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: [
+        content,
+        removeAction !== void 0 && removeLabel !== void 0 ? removeButton(removeAction, removeLabel, disabled) : null
+      ]
+    }
+  );
+}
+
+export { Chip };
+
+//# sourceMappingURL=chunk-LMHN2TJL.js.map

package/dist/chunk-LMHN2TJL.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/feedback/chip/chip.tsx"],"names":[],"mappings":"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","file":"chunk-LMHN2TJL.js","sourcesContent":["import type { SafeHtml } from 'kerfjs';\n\nimport { filterDataAttributes } from '../../../shared/dom/extension-attributes.js';\nimport type { SemanticTone } from '../../../shared/styles/semantic-tone.js';\nimport type { BadgeAppearance, BadgeShape, BadgeSize } from '../badge/badge.js';\n\n/**\n * A chip color role: a shared semantic tone, or `inherit`, which follows the\n * surrounding foreground (a chip inside a `brand-loud` ContentItem bubble)\n * and derives its fill, border, and focus ring from `currentColor`.\n */\nexport type ChipTone = SemanticTone | 'inherit';\n\nconst chipProtectedAttributes = new Set([\n  'data-component',\n  'data-tone',\n  'data-appearance',\n  'data-shape',\n  'data-size',\n  'data-disabled',\n  'data-truncate',\n  'data-item-id',\n  'data-link',\n  'data-action',\n]);\n\n/** Safe `data-*` identity on a Chip root; Chip-owned attributes are protected. */\nexport type ChipRootAttributes = Readonly<\n  Record<`data-${string}`, string | undefined> & {\n    'data-component'?: never;\n    'data-tone'?: never;\n    'data-appearance'?: never;\n    'data-shape'?: never;\n    'data-size'?: never;\n    'data-disabled'?: never;\n    'data-truncate'?: never;\n    'data-item-id'?: never;\n    'data-link'?: never;\n    'data-action'?: never;\n  }\n>;\n\ninterface ChipCommonProps {\n  /** Decorative leading icon, normally an unsized LucideIcon. */\n  icon?: SafeHtml;\n  tone?: ChipTone;\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  /**\n   * Safe `data-*` identity on the chip root (a plain, link, or action chip),\n   * for tests and delegated handlers; use `itemId` for the record id.\n   */\n  rootAttributes?: ChipRootAttributes;\n  className?: string;\n  /** Native named-slot assignment when composed inside a web component. */\n  slot?: string;\n}\n\ntype ChipLabelProps =\n  | { children: SafeHtml | string | number; truncate?: false }\n  | { children: string; truncate: true };\n\ninterface ChipNoLinkProps {\n  href?: never;\n  download?: never;\n  external?: never;\n}\n\ninterface ChipNoActionProps {\n  action?: never;\n  actionLabel?: never;\n}\n\n/**\n * An action chip renders its whole root as a native\n * `<button type=\"button\">` carrying `data-action` (and `data-item-id`) for an\n * application delegated handler. It cannot also be a link or carry a remove\n * button, because nested interactive content is invalid.\n */\ninterface ChipActionProps {\n  /** Delegated action name; the chip renders as a native `<button>`. */\n  action: string;\n  /**\n   * Accessible name when the visible label alone is unclear, such as\n   * \"Insert filter is:mine\". Start it with, or include, the visible label so\n   * speech input still matches.\n   */\n  actionLabel?: string;\n  href?: never;\n  download?: never;\n  external?: never;\n  removeAction?: never;\n  removeLabel?: never;\n}\n\n/**\n * A link chip renders a native `<a>` with Chip geometry. It cannot also carry\n * a remove button, because a button inside a link is invalid.\n */\ninterface ChipLinkProps {\n  /** Native destination; the chip renders as an `<a>`. */\n  href: string;\n  /** Download the destination: `true`, or the suggested file name. */\n  download?: string | boolean;\n  /** Open in a new tab with a safe rel and announce that behavior. */\n  external?: boolean;\n  removeAction?: never;\n  removeLabel?: never;\n  action?: never;\n  actionLabel?: never;\n}\n\n/**\n * A plain chip, a removable chip (a delegated action plus a specific\n * accessible name), a link chip (`href`, optional `download`/`external`), or\n * an action chip (`action`, optional `actionLabel`) whose whole body is a\n * native button.\n */\nexport type ChipProps = ChipCommonProps &\n  ChipLabelProps &\n  (\n    | ({ removeAction: string; removeLabel: string } & ChipNoLinkProps &\n        ChipNoActionProps)\n    | ({ removeAction?: never; removeLabel?: never } & ChipNoLinkProps &\n        ChipNoActionProps)\n    | ChipLinkProps\n    | ChipActionProps\n  );\n\nfunction removeButton(action: string, label: string, disabled: boolean) {\n  return (\n    <button\n      class=\"kui-chip__remove\"\n      type=\"button\"\n      data-action={action}\n      aria-label={label}\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  );\n}\n\nfunction downloadValue(download: string | boolean | undefined) {\n  switch (download) {\n    case undefined:\n    case false:\n      return undefined;\n    case true:\n      return '';\n    default:\n      return download;\n  }\n}\n\n/**\n * A short label with an optional native remove button, a native link when\n * `href` is set, or a native button when `action` is set. The application\n * owns removal, the link destination, and the action handler.\n */\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  rootAttributes = {},\n  className = '',\n  slot,\n  href,\n  download,\n  external = false,\n  removeAction,\n  removeLabel,\n  action,\n  actionLabel,\n}: ChipProps) {\n  if (truncate && typeof children !== 'string')\n    throw new TypeError('Chip truncate requires a plain text label');\n  if (\n    action !== undefined &&\n    (href !== undefined ||\n      removeAction !== undefined ||\n      removeLabel !== undefined)\n  )\n    throw new TypeError(\n      'Chip action cannot be combined with href or removeAction, because nested interactive content is invalid',\n    );\n  const content = (\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    </>\n  );\n  const rootClass = `kui-chip ${className}`.trim();\n  const identity = filterDataAttributes(\n    rootAttributes,\n    chipProtectedAttributes,\n  );\n  if (href !== undefined) {\n    const textLabel =\n      typeof children === 'string' || typeof children === 'number'\n        ? String(children)\n        : undefined;\n    return (\n      <a\n        {...identity}\n        class={rootClass}\n        href={disabled ? undefined : href}\n        download={disabled ? undefined : downloadValue(download)}\n        target={disabled || !external ? undefined : '_blank'}\n        rel={disabled || !external ? undefined : 'noopener noreferrer'}\n        tabindex={disabled ? -1 : undefined}\n        aria-label={\n          external && textLabel !== undefined\n            ? `${textLabel} (opens in new tab)`\n            : undefined\n        }\n        aria-disabled={disabled ? 'true' : undefined}\n        data-component=\"chip\"\n        data-link=\"\"\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        {content}\n      </a>\n    );\n  }\n  if (action !== undefined) {\n    return (\n      <button\n        {...identity}\n        class={rootClass}\n        type=\"button\"\n        disabled={disabled}\n        aria-label={actionLabel?.trim() || undefined}\n        data-action={action}\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        {content}\n      </button>\n    );\n  }\n  return (\n    <span\n      {...identity}\n      class={rootClass}\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      {content}\n      {removeAction !== undefined && removeLabel !== undefined\n        ? removeButton(removeAction, removeLabel, disabled)\n        : null}\n    </span>\n  );\n}\n"]}

package/dist/chunk-LTBVP6VN.js

@@ -0,0 +1,59 @@
+import { filterDataAttributes } from './chunk-KH4KEMSP.js';
+import { jsxs, jsx } from 'kerfjs/jsx-runtime';
+
+var SWITCH_PROTECTED = /* @__PURE__ */ new Set(["data-component", "data-size"]);
+function Switch({
+  label,
+  checked = false,
+  name,
+  value,
+  hint,
+  size = "default",
+  disabled = false,
+  action,
+  form,
+  id,
+  className = "",
+  rootAttributes = {},
+  slot
+}) {
+  return /* @__PURE__ */ jsxs(
+    "div",
+    {
+      ...filterDataAttributes(rootAttributes, SWITCH_PROTECTED),
+      class: `kui-switch ${className}`.trim(),
+      "data-component": "switch",
+      "data-size": size,
+      slot,
+      children: [
+        /* @__PURE__ */ jsxs("label", { class: "kui-switch__row", children: [
+          /* @__PURE__ */ jsxs("span", { class: "kui-switch__control", children: [
+            /* @__PURE__ */ jsx(
+              "input",
+              {
+                class: "kui-switch__input",
+                type: "checkbox",
+                role: "switch",
+                id,
+                name,
+                value,
+                form,
+                checked,
+                disabled,
+                "data-action": action,
+                "aria-description": hint
+              }
+            ),
+            /* @__PURE__ */ jsx("span", { class: "kui-switch__track", "aria-hidden": "true", children: /* @__PURE__ */ jsx("span", { class: "kui-switch__thumb" }) })
+          ] }),
+          /* @__PURE__ */ jsx("span", { class: "kui-switch__label", children: label })
+        ] }),
+        hint === void 0 ? null : /* @__PURE__ */ jsx("span", { class: "kui-switch__hint", "aria-hidden": "true", children: hint })
+      ]
+    }
+  );
+}
+
+export { Switch };
+
+//# sourceMappingURL=chunk-LTBVP6VN.js.map

package/dist/chunk-LTBVP6VN.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/forms/switch/switch.tsx"],"names":[],"mappings":";;;AAKA,IAAM,mCAAmB,IAAI,GAAA,CAAI,CAAC,gBAAA,EAAkB,WAAW,CAAC,CAAA;AAqCzD,SAAS,MAAA,CAAO;AAAA,EACrB,KAAA;AAAA,EACA,OAAA,GAAU,KAAA;AAAA,EACV,IAAA;AAAA,EACA,KAAA;AAAA,EACA,IAAA;AAAA,EACA,IAAA,GAAO,SAAA;AAAA,EACP,QAAA,GAAW,KAAA;AAAA,EACX,MAAA;AAAA,EACA,IAAA;AAAA,EACA,EAAA;AAAA,EACA,SAAA,GAAY,EAAA;AAAA,EACZ,iBAAiB,EAAC;AAAA,EAClB;AACF,CAAA,EAAgB;AACd,EAAA,uBACE,IAAA;AAAA,IAAC,KAAA;AAAA,IAAA;AAAA,MACE,GAAG,oBAAA,CAAqB,cAAA,EAAgB,gBAAgB,CAAA;AAAA,MACzD,KAAA,EAAO,CAAA,WAAA,EAAc,SAAS,CAAA,CAAA,CAAG,IAAA,EAAK;AAAA,MACtC,gBAAA,EAAe,QAAA;AAAA,MACf,WAAA,EAAW,IAAA;AAAA,MACX,IAAA;AAAA,MAEA,QAAA,EAAA;AAAA,wBAAA,IAAA,CAAC,OAAA,EAAA,EAAM,OAAM,iBAAA,EACX,QAAA,EAAA;AAAA,0BAAA,IAAA,CAAC,MAAA,EAAA,EAAK,OAAM,qBAAA,EACV,QAAA,EAAA;AAAA,4BAAA,GAAA;AAAA,cAAC,OAAA;AAAA,cAAA;AAAA,gBACC,KAAA,EAAM,mBAAA;AAAA,gBACN,IAAA,EAAK,UAAA;AAAA,gBACL,IAAA,EAAK,QAAA;AAAA,gBACL,EAAA;AAAA,gBACA,IAAA;AAAA,gBACA,KAAA;AAAA,gBACA,IAAA;AAAA,gBACA,OAAA;AAAA,gBACA,QAAA;AAAA,gBACA,aAAA,EAAa,MAAA;AAAA,gBACb,kBAAA,EAAkB;AAAA;AAAA,aACpB;AAAA,4BACA,GAAA,CAAC,MAAA,EAAA,EAAK,KAAA,EAAM,mBAAA,EAAoB,aAAA,EAAY,QAC1C,QAAA,kBAAA,GAAA,CAAC,MAAA,EAAA,EAAK,KAAA,EAAM,mBAAA,EAAoB,CAAA,EAClC;AAAA,WAAA,EACF,CAAA;AAAA,0BACA,GAAA,CAAC,MAAA,EAAA,EAAK,KAAA,EAAM,mBAAA,EAAqB,QAAA,EAAA,KAAA,EAAM;AAAA,SAAA,EACzC,CAAA;AAAA,QACC,IAAA,KAAS,SAAY,IAAA,mBACpB,GAAA,CAAC,UAAK,KAAA,EAAM,kBAAA,EAAmB,aAAA,EAAY,MAAA,EACxC,QAAA,EAAA,IAAA,EACH;AAAA;AAAA;AAAA,GAEJ;AAEJ","file":"chunk-LTBVP6VN.js","sourcesContent":["import { filterDataAttributes } from '../../../shared/dom/extension-attributes.js';\n\n/** `default` is a 35×20 track beside 16px text; `compact` 31.5×18 and 14px. */\nexport type SwitchSize = 'default' | 'compact';\n\nconst SWITCH_PROTECTED = new Set(['data-component', 'data-size']);\n\n/** Application `data-*` metadata; the Switch's own markers stay protected. */\nexport type SwitchRootAttributes = Readonly<\n  Record<`data-${string}`, string | undefined>\n>;\n\nexport interface SwitchProps {\n  /** The visible label, which is also the switch's accessible name. */\n  label: string;\n  /** Whether the setting is on. */\n  checked?: boolean;\n  name?: string;\n  /** The value submitted while on (native default `on`). */\n  value?: string;\n  /** Supporting text below the label, also the switch's description. */\n  hint?: string;\n  size?: SwitchSize;\n  disabled?: boolean;\n  /** Delegated `data-action` on the input; listen for `change`. */\n  action?: string;\n  /** Associate the input with a form outside its ancestor chain. */\n  form?: string;\n  /** The input's id. */\n  id?: string;\n  className?: string;\n  /** Safe `data-*` metadata (a `data-key`). */\n  rootAttributes?: SwitchRootAttributes;\n  /** Native named-slot assignment when composed inside a web component. */\n  slot?: string;\n}\n\n/**\n * An on/off setting that applies immediately: a native checkbox with\n * `role=\"switch\"`, drawn as a track and thumb beside its label, with an\n * optional hint aligned under the label.\n */\nexport function Switch({\n  label,\n  checked = false,\n  name,\n  value,\n  hint,\n  size = 'default',\n  disabled = false,\n  action,\n  form,\n  id,\n  className = '',\n  rootAttributes = {},\n  slot,\n}: SwitchProps) {\n  return (\n    <div\n      {...filterDataAttributes(rootAttributes, SWITCH_PROTECTED)}\n      class={`kui-switch ${className}`.trim()}\n      data-component=\"switch\"\n      data-size={size}\n      slot={slot}\n    >\n      <label class=\"kui-switch__row\">\n        <span class=\"kui-switch__control\">\n          <input\n            class=\"kui-switch__input\"\n            type=\"checkbox\"\n            role=\"switch\"\n            id={id}\n            name={name}\n            value={value}\n            form={form}\n            checked={checked}\n            disabled={disabled}\n            data-action={action}\n            aria-description={hint}\n          />\n          <span class=\"kui-switch__track\" aria-hidden=\"true\">\n            <span class=\"kui-switch__thumb\" />\n          </span>\n        </span>\n        <span class=\"kui-switch__label\">{label}</span>\n      </label>\n      {hint === undefined ? null : (\n        <span class=\"kui-switch__hint\" aria-hidden=\"true\">\n          {hint}\n        </span>\n      )}\n    </div>\n  );\n}\n"]}