@k2b/ui 0.1.0-rc.0

package/dist/browser/actions/ContextMenu.js

@@ -0,0 +1,199 @@
+import { template as _$template } from "solid-js/web";
+import { delegateEvents as _$delegateEvents } from "solid-js/web";
+import { setStyleProperty as _$setStyleProperty } from "solid-js/web";
+import { createComponent as _$createComponent } from "solid-js/web";
+import { className as _$className } from "solid-js/web";
+import { setAttribute as _$setAttribute } from "solid-js/web";
+import { effect as _$effect } from "solid-js/web";
+import { getNextElement as _$getNextElement } from "solid-js/web";
+import { runHydrationEvents as _$runHydrationEvents } from "solid-js/web";
+import { insert as _$insert } from "solid-js/web";
+import { use as _$use } from "solid-js/web";
+var _tmpl$ = /*#__PURE__*/_$template(`<div role=group aria-haspopup=menu>`),
+  _tmpl$2 = /*#__PURE__*/_$template(`<div class="k2b-ui k2b-context-menu"role=menu>`);
+import { createMemo, createSignal, createUniqueId, onCleanup, onMount, Show } from "solid-js";
+import { Portal } from "solid-js/web";
+import { useUiMessages } from "../intl/messages";
+import { DropdownItems, dropdownPosition } from "./Dropdown";
+let closeActiveContextMenu;
+const focusableItems = menu => menu ? Array.from(menu.querySelectorAll(["[role='menuitem']:not([aria-disabled='true'])", "[role='menuitemcheckbox']:not([aria-disabled='true'])", "[role='menuitemradio']:not([aria-disabled='true'])"].join(", "))) : [];
+
+/** Right-click menu with keyboard invocation, one-open-at-a-time behavior, and viewport clamping. */
+export function ContextMenu(props) {
+  const messages = useUiMessages();
+  const generatedId = `k2b-context-${createUniqueId()}`;
+  const menuId = `${generatedId}-menu`;
+  const [position, setPosition] = createSignal();
+  let host;
+  let menu;
+  let listenersAttached = false;
+  const isOpen = () => position() !== undefined;
+  const hostClass = createMemo(() => typeof props.class === "function" ? props.class(isOpen()) : props.class);
+  const items = createMemo(() => props.items);
+  const dismiss = event => {
+    if (menu?.contains(event.target)) return;
+    close();
+  };
+  const closeOnViewportChange = event => {
+    const target = event.target;
+    if (target instanceof Node && menu?.contains(target)) return;
+    close();
+  };
+  const attachOpenListeners = () => {
+    if (listenersAttached) return;
+    listenersAttached = true;
+    document.addEventListener("pointerdown", dismiss);
+    document.addEventListener("keydown", keyDown);
+    window.addEventListener("resize", closeOnViewportChange);
+    window.addEventListener("scroll", closeOnViewportChange, true);
+  };
+  const detachOpenListeners = () => {
+    if (!listenersAttached) return;
+    listenersAttached = false;
+    document.removeEventListener("pointerdown", dismiss);
+    document.removeEventListener("keydown", keyDown);
+    window.removeEventListener("resize", closeOnViewportChange);
+    window.removeEventListener("scroll", closeOnViewportChange, true);
+  };
+  const close = () => {
+    detachOpenListeners();
+    if (!isOpen()) return;
+    setPosition();
+    if (closeActiveContextMenu === close) closeActiveContextMenu = undefined;
+    props.onClose?.();
+  };
+  const focusItem = index => {
+    const items = focusableItems(menu);
+    if (items.length === 0) return;
+    items[(index + items.length) % items.length]?.focus();
+  };
+  const open = (x, y) => {
+    if (props.disabled) return;
+    closeActiveContextMenu?.();
+    const point = dropdownPosition(new DOMRect(x, y, 0, 0),
+    // Matches the fixed 13rem `.k2b-context-menu` surface (border-box).
+    {
+      width: 208,
+      height: Math.min(items().length * 38 + 12, 384)
+    }, "bottom-right", {
+      width: window.innerWidth,
+      height: window.innerHeight
+    }, 0);
+    setPosition({
+      x: point.left,
+      y: point.top
+    });
+    closeActiveContextMenu = close;
+    attachOpenListeners();
+    props.onOpen?.();
+    queueMicrotask(() => {
+      focusItem(0);
+    });
+  };
+  const keyDown = event => {
+    if (!isOpen()) return;
+    const items = focusableItems(menu);
+    const current = items.indexOf(document.activeElement);
+    if (event.key === "ArrowDown" || event.key === "ArrowUp") {
+      event.preventDefault();
+      focusItem(current + (event.key === "ArrowDown" ? 1 : -1));
+    } else if (event.key === "Home" || event.key === "End") {
+      event.preventDefault();
+      focusItem(event.key === "Home" ? 0 : -1);
+    } else if (event.key === "Escape") {
+      event.preventDefault();
+      close();
+      host?.focus();
+    } else if (event.key === "Tab") {
+      close();
+    }
+  };
+  onMount(() => {
+    onCleanup(() => {
+      detachOpenListeners();
+      if (closeActiveContextMenu === close) closeActiveContextMenu = undefined;
+    });
+  });
+  return [(() => {
+    var _el$ = _$getNextElement(_tmpl$);
+    _el$.$$keydown = event => {
+      if (props.disabled || event.key !== "ContextMenu" && !(event.shiftKey && event.key === "F10")) return;
+      event.preventDefault();
+      const rect = host?.getBoundingClientRect();
+      if (rect) open(rect.left + 12, rect.top + 12);
+    };
+    _el$.$$contextmenu = event => {
+      if (props.disabled) return;
+      event.preventDefault();
+      event.stopPropagation();
+      open(event.clientX, event.clientY);
+    };
+    var _ref$ = host;
+    typeof _ref$ === "function" ? _$use(_ref$, _el$) : host = _el$;
+    _$insert(_el$, () => props.children);
+    _$effect(_p$ => {
+      var _v$ = props.id ?? generatedId,
+        _v$2 = hostClass(),
+        _v$3 = props.disabled ? undefined : props.tabIndex ?? 0,
+        _v$4 = props.label ?? messages().contextMenu,
+        _v$5 = isOpen(),
+        _v$6 = isOpen() ? menuId : undefined,
+        _v$7 = props.disabled ? "true" : undefined;
+      _v$ !== _p$.e && _$setAttribute(_el$, "id", _p$.e = _v$);
+      _v$2 !== _p$.t && _$className(_el$, _p$.t = _v$2);
+      _v$3 !== _p$.a && _$setAttribute(_el$, "tabindex", _p$.a = _v$3);
+      _v$4 !== _p$.o && _$setAttribute(_el$, "aria-label", _p$.o = _v$4);
+      _v$5 !== _p$.i && _$setAttribute(_el$, "aria-expanded", _p$.i = _v$5);
+      _v$6 !== _p$.n && _$setAttribute(_el$, "aria-controls", _p$.n = _v$6);
+      _v$7 !== _p$.s && _$setAttribute(_el$, "aria-disabled", _p$.s = _v$7);
+      return _p$;
+    }, {
+      e: undefined,
+      t: undefined,
+      a: undefined,
+      o: undefined,
+      i: undefined,
+      n: undefined,
+      s: undefined
+    });
+    _$runHydrationEvents();
+    return _el$;
+  })(), _$createComponent(Show, {
+    get when() {
+      return position();
+    },
+    children: point => _$createComponent(Portal, {
+      get children() {
+        var _el$2 = _$getNextElement(_tmpl$2);
+        _el$2.$$pointerdown = event => event.stopPropagation();
+        var _ref$2 = menu;
+        typeof _ref$2 === "function" ? _$use(_ref$2, _el$2) : menu = _el$2;
+        _$setAttribute(_el$2, "id", menuId);
+        _$insert(_el$2, _$createComponent(DropdownItems, {
+          get items() {
+            return items();
+          },
+          close: close
+        }));
+        _$effect(_p$ => {
+          var _v$8 = props.label ?? messages().contextMenu,
+            _v$9 = `${point().x}px`,
+            _v$0 = `${point().y}px`;
+          _v$8 !== _p$.e && _$setAttribute(_el$2, "aria-label", _p$.e = _v$8);
+          _v$9 !== _p$.t && _$setStyleProperty(_el$2, "left", _p$.t = _v$9);
+          _v$0 !== _p$.a && _$setStyleProperty(_el$2, "top", _p$.a = _v$0);
+          return _p$;
+        }, {
+          e: undefined,
+          t: undefined,
+          a: undefined
+        });
+        _$runHydrationEvents();
+        return _el$2;
+      }
+    })
+  })];
+}
+export default ContextMenu;
+_$delegateEvents(["contextmenu", "keydown", "pointerdown"]);
+//# sourceMappingURL=ContextMenu.js.map

package/dist/browser/actions/ContextMenu.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["createMemo","createSignal","createUniqueId","onCleanup","onMount","Show","Portal","useUiMessages","DropdownItems","dropdownPosition","closeActiveContextMenu","focusableItems","menu","Array","from","querySelectorAll","join","ContextMenu","props","messages","generatedId","menuId","position","setPosition","host","listenersAttached","isOpen","undefined","hostClass","class","items","dismiss","event","contains","target","close","closeOnViewportChange","Node","attachOpenListeners","document","addEventListener","keyDown","window","detachOpenListeners","removeEventListener","onClose","focusItem","index","length","focus","open","x","y","disabled","point","DOMRect","width","height","Math","min","innerWidth","innerHeight","left","top","onOpen","queueMicrotask","current","indexOf","activeElement","key","preventDefault","_el$","_$getNextElement","_tmpl$","$$keydown","shiftKey","rect","getBoundingClientRect","$$contextmenu","stopPropagation","clientX","clientY","_ref$","_$use","_$insert","children","_$effect","_p$","_v$","id","_v$2","_v$3","tabIndex","_v$4","label","contextMenu","_v$5","_v$6","_v$7","e","_$setAttribute","t","_$className","a","o","i","n","s","_$runHydrationEvents","_$createComponent","when","_el$2","_tmpl$2","$$pointerdown","_ref$2","_v$8","_v$9","_v$0","_$setStyleProperty","_$delegateEvents"],"sources":["actions/ContextMenu.tsx"],"sourcesContent":["import { createMemo, createSignal, createUniqueId, type JSX, onCleanup, onMount, Show } from \"solid-js\";\nimport { Portal } from \"solid-js/web\";\nimport { useUiMessages } from \"../intl/messages\";\nimport { type DropdownItem, DropdownItems, type DropdownPosition, dropdownPosition } from \"./Dropdown\";\n\nexport type ContextMenuProps = {\n  items: readonly DropdownItem[];\n  children: JSX.Element;\n  class?: string | ((isOpen: boolean) => string);\n  /** Tab order of the context-menu host. Descendant-focused composite widgets use -1. */\n  tabIndex?: number;\n  disabled?: boolean;\n  onClose?: () => void;\n  onOpen?: () => void;\n  id?: string;\n  label?: string;\n};\n\nlet closeActiveContextMenu: (() => void) | undefined;\n\nconst focusableItems = (menu: HTMLElement | undefined): HTMLElement[] =>\n  menu\n    ? Array.from(\n        menu.querySelectorAll<HTMLElement>(\n          [\n            \"[role='menuitem']:not([aria-disabled='true'])\",\n            \"[role='menuitemcheckbox']:not([aria-disabled='true'])\",\n            \"[role='menuitemradio']:not([aria-disabled='true'])\",\n          ].join(\", \"),\n        ),\n      )\n    : [];\n\n/** Right-click menu with keyboard invocation, one-open-at-a-time behavior, and viewport clamping. */\nexport function ContextMenu(props: ContextMenuProps): JSX.Element {\n  const messages = useUiMessages();\n  const generatedId = `k2b-context-${createUniqueId()}`;\n  const menuId = `${generatedId}-menu`;\n  const [position, setPosition] = createSignal<{ x: number; y: number }>();\n  let host: HTMLDivElement | undefined;\n  let menu: HTMLDivElement | undefined;\n  let listenersAttached = false;\n\n  const isOpen = () => position() !== undefined;\n  const hostClass = createMemo(() => (typeof props.class === \"function\" ? props.class(isOpen()) : props.class));\n  const items = createMemo<readonly DropdownItem[]>(() => props.items);\n\n  const dismiss = (event: PointerEvent) => {\n    if (menu?.contains(event.target as Node)) return;\n    close();\n  };\n  const closeOnViewportChange = (event: Event) => {\n    const target = event.target;\n    if (target instanceof Node && menu?.contains(target)) return;\n    close();\n  };\n  const attachOpenListeners = () => {\n    if (listenersAttached) return;\n    listenersAttached = true;\n    document.addEventListener(\"pointerdown\", dismiss);\n    document.addEventListener(\"keydown\", keyDown);\n    window.addEventListener(\"resize\", closeOnViewportChange);\n    window.addEventListener(\"scroll\", closeOnViewportChange, true);\n  };\n  const detachOpenListeners = () => {\n    if (!listenersAttached) return;\n    listenersAttached = false;\n    document.removeEventListener(\"pointerdown\", dismiss);\n    document.removeEventListener(\"keydown\", keyDown);\n    window.removeEventListener(\"resize\", closeOnViewportChange);\n    window.removeEventListener(\"scroll\", closeOnViewportChange, true);\n  };\n  const close = () => {\n    detachOpenListeners();\n    if (!isOpen()) return;\n    setPosition();\n    if (closeActiveContextMenu === close) closeActiveContextMenu = undefined;\n    props.onClose?.();\n  };\n  const focusItem = (index: number) => {\n    const items = focusableItems(menu);\n    if (items.length === 0) return;\n    items[(index + items.length) % items.length]?.focus();\n  };\n  const open = (x: number, y: number) => {\n    if (props.disabled) return;\n    closeActiveContextMenu?.();\n    const point = dropdownPosition(\n      new DOMRect(x, y, 0, 0),\n      // Matches the fixed 13rem `.k2b-context-menu` surface (border-box).\n      { width: 208, height: Math.min(items().length * 38 + 12, 384) },\n      \"bottom-right\" satisfies DropdownPosition,\n      { width: window.innerWidth, height: window.innerHeight },\n      0,\n    );\n    setPosition({ x: point.left, y: point.top });\n    closeActiveContextMenu = close;\n    attachOpenListeners();\n    props.onOpen?.();\n    queueMicrotask(() => {\n      focusItem(0);\n    });\n  };\n  const keyDown = (event: KeyboardEvent) => {\n    if (!isOpen()) return;\n    const items = focusableItems(menu);\n    const current = items.indexOf(document.activeElement as HTMLElement);\n    if (event.key === \"ArrowDown\" || event.key === \"ArrowUp\") {\n      event.preventDefault();\n      focusItem(current + (event.key === \"ArrowDown\" ? 1 : -1));\n    } else if (event.key === \"Home\" || event.key === \"End\") {\n      event.preventDefault();\n      focusItem(event.key === \"Home\" ? 0 : -1);\n    } else if (event.key === \"Escape\") {\n      event.preventDefault();\n      close();\n      host?.focus();\n    } else if (event.key === \"Tab\") {\n      close();\n    }\n  };\n\n  onMount(() => {\n    onCleanup(() => {\n      detachOpenListeners();\n      if (closeActiveContextMenu === close) closeActiveContextMenu = undefined;\n    });\n  });\n\n  return (\n    <>\n      {/* biome-ignore lint/a11y/useAriaPropsSupportedByRole: the named group owns the context-menu relationship without pretending arbitrary children form one button. */}\n      <div\n        ref={host}\n        id={props.id ?? generatedId}\n        class={hostClass()}\n        role=\"group\"\n        tabIndex={props.disabled ? undefined : (props.tabIndex ?? 0)}\n        aria-label={props.label ?? messages().contextMenu}\n        aria-haspopup=\"menu\"\n        aria-expanded={isOpen()}\n        aria-controls={isOpen() ? menuId : undefined}\n        aria-disabled={props.disabled ? \"true\" : undefined}\n        onContextMenu={(event) => {\n          if (props.disabled) return;\n          event.preventDefault();\n          event.stopPropagation();\n          open(event.clientX, event.clientY);\n        }}\n        onKeyDown={(event) => {\n          if (props.disabled || (event.key !== \"ContextMenu\" && !(event.shiftKey && event.key === \"F10\"))) return;\n          event.preventDefault();\n          const rect = host?.getBoundingClientRect();\n          if (rect) open(rect.left + 12, rect.top + 12);\n        }}\n      >\n        {props.children}\n      </div>\n      <Show when={position()}>\n        {(point) => (\n          <Portal>\n            <div\n              ref={menu}\n              id={menuId}\n              class=\"k2b-ui k2b-context-menu\"\n              role=\"menu\"\n              aria-label={props.label ?? messages().contextMenu}\n              style={{ left: `${point().x}px`, top: `${point().y}px` }}\n              onPointerDown={(event) => event.stopPropagation()}\n            >\n              <DropdownItems items={items()} close={close} />\n            </div>\n          </Portal>\n        )}\n      </Show>\n    </>\n  );\n}\n\nexport default ContextMenu;\n"],"mappings":"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","ignoreList":[]}

package/dist/browser/actions/CopyButton.js

@@ -0,0 +1,97 @@
+import { template as _$template } from "solid-js/web";
+import { insert as _$insert } from "solid-js/web";
+import { createComponent as _$createComponent } from "solid-js/web";
+import { mergeProps as _$mergeProps } from "solid-js/web";
+import { className as _$className } from "solid-js/web";
+import { effect as _$effect } from "solid-js/web";
+import { getNextElement as _$getNextElement } from "solid-js/web";
+import { memo as _$memo } from "solid-js/web";
+var _tmpl$ = /*#__PURE__*/_$template(`<i aria-hidden=true>`),
+  _tmpl$2 = /*#__PURE__*/_$template(`<span>`),
+  _tmpl$3 = /*#__PURE__*/_$template(`<span class=k2b-sr-only aria-live=polite>`);
+import { copyToClipboard } from "@k2b/stdlib/browser";
+import { createSignal, onCleanup, splitProps } from "solid-js";
+import { useUiMessages } from "../intl/messages";
+import { Button } from "./Button";
+export async function copyText(text, onCopyError, copy = copyToClipboard) {
+  try {
+    await copy(text);
+  } catch (error) {
+    onCopyError?.(error);
+    throw error;
+  }
+}
+export function CopyButton(props) {
+  const messages = useUiMessages();
+  const [local, rest] = splitProps(props, ["class", "copiedLabel", "disabled", "iconOnly", "label", "loading", "loadingLabel", "onCopied", "onCopyError", "resetAfter", "size", "text", "type", "value", "variant"]);
+  const [copied, setCopied] = createSignal(false);
+  let resetTimer;
+  onCleanup(() => {
+    if (resetTimer) clearTimeout(resetTimer);
+  });
+  const copy = async () => {
+    // `copyText` reports through `onCopyError` and then rethrows so direct
+    // callers can await it. The click handler is not awaited by anyone, so it
+    // has to absorb the rejection here — otherwise a denied clipboard
+    // permission surfaces as an unhandled rejection despite `onCopyError`.
+    try {
+      await copyText(local.text ?? local.value ?? "", local.onCopyError);
+    } catch {
+      return;
+    }
+    setCopied(true);
+    local.onCopied?.();
+    if (resetTimer) clearTimeout(resetTimer);
+    resetTimer = setTimeout(() => setCopied(false), local.resetAfter ?? 2000);
+  };
+  const visibleLabel = () => copied() ? local.copiedLabel ?? messages().copied : local.label ?? messages().copy;
+  const icon = () => copied() ? "ti ti-check" : "ti ti-copy";
+  const iconOnly = () => local.iconOnly ?? local.label === undefined;
+  const buttonLabel = () => local.loading && local.loadingLabel ? local.loadingLabel : visibleLabel();
+  const button = tooltip => _$createComponent(Button, _$mergeProps(rest, {
+    tooltip: tooltip,
+    get disabled() {
+      return local.disabled || local.loading;
+    },
+    get type() {
+      return local.type ?? "button";
+    },
+    get ["class"]() {
+      return `k2b-copy-button ${local.class ?? ""}`;
+    },
+    get size() {
+      return local.size ?? "sm";
+    },
+    get variant() {
+      return local.variant ?? "ghost";
+    },
+    get ["aria-busy"]() {
+      return local.loading ? "true" : undefined;
+    },
+    get ["aria-label"]() {
+      return _$memo(() => !!iconOnly())() ? buttonLabel() : undefined;
+    },
+    onClick: copy,
+    get children() {
+      return [(() => {
+        var _el$ = _$getNextElement(_tmpl$);
+        _$effect(() => _$className(_el$, local.loading ? "ti ti-loader-2 k2b-spin" : icon()));
+        return _el$;
+      })(), _$memo(() => _$memo(() => !!!iconOnly())() && (() => {
+        var _el$2 = _$getNextElement(_tmpl$2);
+        _$insert(_el$2, buttonLabel);
+        return _el$2;
+      })())];
+    }
+  }));
+  return iconOnly() ? [_$memo(() => button(visibleLabel())), (() => {
+    var _el$3 = _$getNextElement(_tmpl$3);
+    _$insert(_el$3, (() => {
+      var _c$ = _$memo(() => !!copied());
+      return () => _c$() ? visibleLabel() : "";
+    })());
+    return _el$3;
+  })()] : button(undefined);
+}
+export default CopyButton;
+//# sourceMappingURL=CopyButton.js.map

package/dist/browser/actions/CopyButton.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["copyToClipboard","createSignal","onCleanup","splitProps","useUiMessages","Button","copyText","text","onCopyError","copy","error","CopyButton","props","messages","local","rest","copied","setCopied","resetTimer","clearTimeout","value","onCopied","setTimeout","resetAfter","visibleLabel","copiedLabel","label","icon","iconOnly","undefined","buttonLabel","loading","loadingLabel","button","tooltip","_$createComponent","_$mergeProps","disabled","type","class","size","variant","aria-busy","aria-label","_$memo","onClick","children","_el$","_$getNextElement","_tmpl$","_$effect","_$className","_el$2","_tmpl$2","_$insert","_el$3","_tmpl$3","_c$"],"sources":["actions/CopyButton.tsx"],"sourcesContent":["import { copyToClipboard } from \"@k2b/stdlib/browser\";\nimport { createSignal, type JSX, onCleanup, splitProps } from \"solid-js\";\nimport { useUiMessages } from \"../intl/messages\";\nimport { Button, type ButtonProps } from \"./Button\";\n\nexport type CopyButtonValue = { text: string; value?: string } | { text?: string; value: string };\n\nexport type CopyButtonProps = CopyButtonValue &\n  Omit<ButtonProps, \"children\" | \"onClick\"> & {\n    label?: string;\n    copiedLabel?: string;\n    iconOnly?: boolean;\n    onCopied?: () => void;\n    onCopyError?: (error: unknown) => void;\n    resetAfter?: number;\n  };\n\nexport async function copyText(\n  text: string,\n  onCopyError?: (error: unknown) => void,\n  copy: (text: string) => Promise<void> = copyToClipboard,\n): Promise<void> {\n  try {\n    await copy(text);\n  } catch (error) {\n    onCopyError?.(error);\n    throw error;\n  }\n}\n\nexport function CopyButton(props: CopyButtonProps): JSX.Element {\n  const messages = useUiMessages();\n  const [local, rest] = splitProps(props, [\n    \"class\",\n    \"copiedLabel\",\n    \"disabled\",\n    \"iconOnly\",\n    \"label\",\n    \"loading\",\n    \"loadingLabel\",\n    \"onCopied\",\n    \"onCopyError\",\n    \"resetAfter\",\n    \"size\",\n    \"text\",\n    \"type\",\n    \"value\",\n    \"variant\",\n  ]);\n  const [copied, setCopied] = createSignal(false);\n  let resetTimer: ReturnType<typeof setTimeout> | undefined;\n\n  onCleanup(() => {\n    if (resetTimer) clearTimeout(resetTimer);\n  });\n\n  const copy = async () => {\n    // `copyText` reports through `onCopyError` and then rethrows so direct\n    // callers can await it. The click handler is not awaited by anyone, so it\n    // has to absorb the rejection here — otherwise a denied clipboard\n    // permission surfaces as an unhandled rejection despite `onCopyError`.\n    try {\n      await copyText(local.text ?? local.value ?? \"\", local.onCopyError);\n    } catch {\n      return;\n    }\n    setCopied(true);\n    local.onCopied?.();\n    if (resetTimer) clearTimeout(resetTimer);\n    resetTimer = setTimeout(() => setCopied(false), local.resetAfter ?? 2000);\n  };\n\n  const visibleLabel = () => (copied() ? (local.copiedLabel ?? messages().copied) : (local.label ?? messages().copy));\n  const icon = () => (copied() ? \"ti ti-check\" : \"ti ti-copy\");\n  const iconOnly = () => local.iconOnly ?? local.label === undefined;\n  const buttonLabel = () => (local.loading && local.loadingLabel ? local.loadingLabel : visibleLabel());\n  const button = (tooltip?: string) => (\n    <Button\n      {...rest}\n      tooltip={tooltip}\n      disabled={local.disabled || local.loading}\n      type={local.type ?? \"button\"}\n      class={`k2b-copy-button ${local.class ?? \"\"}`}\n      size={local.size ?? \"sm\"}\n      variant={local.variant ?? \"ghost\"}\n      aria-busy={local.loading ? \"true\" : undefined}\n      aria-label={iconOnly() ? buttonLabel() : undefined}\n      onClick={copy}\n    >\n      <i class={local.loading ? \"ti ti-loader-2 k2b-spin\" : icon()} aria-hidden=\"true\" />\n      {!iconOnly() && <span>{buttonLabel()}</span>}\n    </Button>\n  );\n\n  return iconOnly() ? (\n    <>\n      {button(visibleLabel())}\n      <span class=\"k2b-sr-only\" aria-live=\"polite\">\n        {copied() ? visibleLabel() : \"\"}\n      </span>\n    </>\n  ) : (\n    button(undefined)\n  );\n}\n\nexport default CopyButton;\n"],"mappings":"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","ignoreList":[]}

package/dist/browser/actions/Disclosure.js

@@ -0,0 +1,83 @@
+import { template as _$template } from "solid-js/web";
+import { delegateEvents as _$delegateEvents } from "solid-js/web";
+import { setAttribute as _$setAttribute } from "solid-js/web";
+import { setProperty as _$setProperty } from "solid-js/web";
+import { className as _$className } from "solid-js/web";
+import { effect as _$effect } from "solid-js/web";
+import { getNextElement as _$getNextElement } from "solid-js/web";
+import { runHydrationEvents as _$runHydrationEvents } from "solid-js/web";
+import { getNextMarker as _$getNextMarker } from "solid-js/web";
+import { insert as _$insert } from "solid-js/web";
+import { createComponent as _$createComponent } from "solid-js/web";
+import { use as _$use } from "solid-js/web";
+var _tmpl$ = /*#__PURE__*/_$template(`<details><summary><!$><!/><span></span><i class="ti ti-chevron-down k2b-disclosure__chevron"aria-hidden=true></i></summary><div class=k2b-disclosure__content>`),
+  _tmpl$2 = /*#__PURE__*/_$template(`<i aria-hidden=true>`);
+import { createEffect, createSignal, Show } from "solid-js";
+import { resolveMaybeAccessor } from "../inputs/field-contract";
+/** Native disclosure with the same value/onValueChange vocabulary as other controls. */
+export function Disclosure(props) {
+  const controlled = () => props.value !== undefined;
+  const [internal, setInternal] = createSignal(props.defaultValue ?? false);
+  const open = () => controlled() ? Boolean(resolveMaybeAccessor(props.value)) : internal();
+  let details;
+  createEffect(() => {
+    if (details && details.open !== open()) details.open = open();
+  });
+  return (() => {
+    var _el$ = _$getNextElement(_tmpl$),
+      _el$2 = _el$.firstChild,
+      _el$4 = _el$2.firstChild,
+      [_el$5, _co$] = _$getNextMarker(_el$4.nextSibling),
+      _el$3 = _el$5.nextSibling,
+      _el$6 = _el$2.nextSibling;
+    _el$.addEventListener("toggle", event => {
+      if (props.disabled) {
+        event.currentTarget.open = open();
+        return;
+      }
+      const next = event.currentTarget.open;
+      // A controlled owner may change `value` without user input. Reflecting
+      // that value onto <details> emits a native toggle event; it must not be
+      // reported back as a second user change.
+      if (controlled() && next === open()) return;
+      if (!controlled()) setInternal(next);
+      props.onValueChange?.(next);
+    });
+    var _ref$ = details;
+    typeof _ref$ === "function" ? _$use(_ref$, _el$) : details = _el$;
+    _el$2.$$click = event => props.disabled && event.preventDefault();
+    _$insert(_el$2, _$createComponent(Show, {
+      get when() {
+        return props.icon;
+      },
+      children: icon => (() => {
+        var _el$7 = _$getNextElement(_tmpl$2);
+        _$effect(() => _$className(_el$7, icon()));
+        return _el$7;
+      })()
+    }), _el$5, _co$);
+    _$insert(_el$3, () => props.summary);
+    _$insert(_el$6, () => props.children);
+    _$effect(_p$ => {
+      var _v$ = `k2b-disclosure ${props.class ?? ""}`,
+        _v$2 = open(),
+        _v$3 = props.disabled ? "true" : undefined,
+        _v$4 = props.disabled ? "true" : undefined;
+      _v$ !== _p$.e && _$className(_el$, _p$.e = _v$);
+      _v$2 !== _p$.t && _$setProperty(_el$, "open", _p$.t = _v$2);
+      _v$3 !== _p$.a && _$setAttribute(_el$, "data-disabled", _p$.a = _v$3);
+      _v$4 !== _p$.o && _$setAttribute(_el$2, "aria-disabled", _p$.o = _v$4);
+      return _p$;
+    }, {
+      e: undefined,
+      t: undefined,
+      a: undefined,
+      o: undefined
+    });
+    _$runHydrationEvents();
+    return _el$;
+  })();
+}
+export default Disclosure;
+_$delegateEvents(["click"]);
+//# sourceMappingURL=Disclosure.js.map

package/dist/browser/actions/Disclosure.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["createEffect","createSignal","Show","resolveMaybeAccessor","Disclosure","props","controlled","value","undefined","internal","setInternal","defaultValue","open","Boolean","details","_el$","_$getNextElement","_tmpl$","_el$2","firstChild","_el$4","_el$5","_co$","_$getNextMarker","nextSibling","_el$3","_el$6","addEventListener","event","disabled","currentTarget","next","onValueChange","_ref$","_$use","$$click","preventDefault","_$insert","_$createComponent","when","icon","children","_el$7","_tmpl$2","_$effect","_$className","summary","_p$","_v$","class","_v$2","_v$3","_v$4","e","t","_$setProperty","a","_$setAttribute","o","_$runHydrationEvents","_$delegateEvents"],"sources":["actions/Disclosure.tsx"],"sourcesContent":["import { createEffect, createSignal, type JSX, Show } from \"solid-js\";\nimport type { MaybeAccessor } from \"../inputs/field-contract\";\nimport { resolveMaybeAccessor } from \"../inputs/field-contract\";\n\nexport type DisclosureProps = {\n  summary: JSX.Element;\n  children: JSX.Element;\n  value?: MaybeAccessor<boolean>;\n  defaultValue?: boolean;\n  onValueChange?: (value: boolean) => void;\n  icon?: string;\n  disabled?: boolean;\n  class?: string;\n};\n\n/** Native disclosure with the same value/onValueChange vocabulary as other controls. */\nexport function Disclosure(props: DisclosureProps): JSX.Element {\n  const controlled = () => props.value !== undefined;\n  const [internal, setInternal] = createSignal(props.defaultValue ?? false);\n  const open = () => (controlled() ? Boolean(resolveMaybeAccessor(props.value)) : internal());\n  let details: HTMLDetailsElement | undefined;\n\n  createEffect(() => {\n    if (details && details.open !== open()) details.open = open();\n  });\n\n  return (\n    <details\n      ref={details}\n      class={`k2b-disclosure ${props.class ?? \"\"}`}\n      open={open()}\n      data-disabled={props.disabled ? \"true\" : undefined}\n      onToggle={(event) => {\n        if (props.disabled) {\n          event.currentTarget.open = open();\n          return;\n        }\n        const next = event.currentTarget.open;\n        // A controlled owner may change `value` without user input. Reflecting\n        // that value onto <details> emits a native toggle event; it must not be\n        // reported back as a second user change.\n        if (controlled() && next === open()) return;\n        if (!controlled()) setInternal(next);\n        props.onValueChange?.(next);\n      }}\n    >\n      {/* biome-ignore lint/a11y/noStaticElementInteractions: summary is the native interactive trigger for details. */}\n      <summary aria-disabled={props.disabled ? \"true\" : undefined} onClick={(event) => props.disabled && event.preventDefault()}>\n        <Show when={props.icon}>{(icon) => <i class={icon()} aria-hidden=\"true\" />}</Show>\n        <span>{props.summary}</span>\n        <i class=\"ti ti-chevron-down k2b-disclosure__chevron\" aria-hidden=\"true\" />\n      </summary>\n      <div class=\"k2b-disclosure__content\">{props.children}</div>\n    </details>\n  );\n}\n\nexport default Disclosure;\n"],"mappings":"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","ignoreList":[]}