@k2b/ui 0.19.0 → 0.21.0

package/dist/browser/actions/Button.js

@@ -1,15 +1,15 @@
 import { template as _$template } 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 { getNextElement as _$getNextElement } from "solid-js/web";
+import { insert as _$insert } from "solid-js/web";
 import { use as _$use } from "solid-js/web";
 import { spread as _$spread } from "solid-js/web";
 import { mergeProps as _$mergeProps } from "solid-js/web";
 import { memo as _$memo } from "solid-js/web";
-var _tmpl$ = /*#__PURE__*/_$template(`<i class="ti ti-loader-2 k2b-spin"aria-hidden=true>`),
-  _tmpl$2 = /*#__PURE__*/_$template(`<button><!$><!/><span class=k2b-button__label>`),
+var _tmpl$ = /*#__PURE__*/_$template(`<span class=k2b-button__busy aria-hidden=true><i class="ti ti-loader-2 k2b-spin">`),
+  _tmpl$2 = /*#__PURE__*/_$template(`<button><span class=k2b-button__label></span><!$><!/>`),
   _tmpl$3 = /*#__PURE__*/_$template(`<span class=k2b-button__label>`),
   _tmpl$4 = /*#__PURE__*/_$template(`<a>`);
 import { Link } from "@k2b/ssr/nav";
@@ -18,19 +18,28 @@ import { isServer } from "solid-js/web";
 import { Tooltip, useLabelTooltip } from "../feedback/Tooltip";
 const buttonClass = className => ["k2b-button", className].filter(Boolean).join(" ");
 export function Button(props) {
-  const [local, rest] = splitProps(props, ["children", "class", "disabled", "loading", "loadingLabel", "ref", "size", "tooltip", "tooltipDelay", "tooltipPlacement", "type", "variant", "wrap", "align"]);
+  const [local, rest] = splitProps(props, ["aria-label", "aria-labelledby", "children", "class", "disabled", "loading", "loadingLabel", "ref", "size", "tooltip", "tooltipDelay", "tooltipPlacement", "type", "variant", "wrap", "align"]);
   let target;
   const setRef = element => {
     target = element;
     if (typeof local.ref === "function") local.ref(element);
   };
+  // While busy, a loading label names the button, over any name the caller
+  // gave it, because the idle content it would describe is not visible.
+  const busyName = () => local.loading && local.loadingLabel || undefined;
   const control = (() => {
     var _el$ = _$getNextElement(_tmpl$2),
-      _el$4 = _el$.firstChild,
-      [_el$5, _co$] = _$getNextMarker(_el$4.nextSibling),
-      _el$3 = _el$5.nextSibling;
+      _el$2 = _el$.firstChild,
+      _el$4 = _el$2.nextSibling,
+      [_el$5, _co$] = _$getNextMarker(_el$4.nextSibling);
     _$use(setRef, _el$);
     _$spread(_el$, _$mergeProps(rest, {
+      get ["aria-label"]() {
+        return busyName() ?? local["aria-label"];
+      },
+      get ["aria-labelledby"]() {
+        return _$memo(() => !!busyName())() ? undefined : local["aria-labelledby"];
+      },
       get type() {
         return local.type ?? "button";
       },
@@ -56,6 +65,7 @@ export function Button(props) {
         return local.loading ? "true" : undefined;
       }
     }), false, true);
+    _$insert(_el$2, () => local.children);
     _$insert(_el$, _$createComponent(Show, {
       get when() {
         return local.loading;
@@ -64,17 +74,6 @@ export function Button(props) {
         return _$getNextElement(_tmpl$);
       }
     }), _el$5, _co$);
-    _$insert(_el$3, _$createComponent(Show, {
-      get when() {
-        return _$memo(() => !!local.loading)() && local.loadingLabel;
-      },
-      get fallback() {
-        return local.children;
-      },
-      get children() {
-        return local.loadingLabel;
-      }
-    }));
     _$runHydrationEvents();
     return _el$;
   })();
@@ -202,12 +201,9 @@ export function ButtonLink(props) {
  */
 export const iconTitle = (title, tooltip) => tooltip === false || tooltip === undefined ? title : isServer && typeof tooltip === "string" ? tooltip : undefined;
 export function IconButton(props) {
-  const [local, rest] = splitProps(props, ["children", "class", "label", "loading", "loadingLabel", "title", "tooltip", "variant"]);
+  const [local, rest] = splitProps(props, ["children", "class", "label", "title", "tooltip", "variant"]);
   const tooltip = useLabelTooltip(() => local.tooltip, () => local.title ?? local.label);
   return _$createComponent(Button, _$mergeProps(rest, {
-    get loading() {
-      return local.loading;
-    },
     get variant() {
       return local.variant ?? "ghost";
     },
@@ -215,7 +211,7 @@ export function IconButton(props) {
       return `k2b-icon-button ${local.class ?? ""}`;
     },
     get ["aria-label"]() {
-      return _$memo(() => !!local.loading)() ? local.loadingLabel ?? local.label : local.label;
+      return local.label;
     },
     get title() {
       return iconTitle(local.title, tooltip());
@@ -224,14 +220,7 @@ export function IconButton(props) {
       return tooltip();
     },
     get children() {
-      return _$createComponent(Show, {
-        get when() {
-          return !local.loading;
-        },
-        get children() {
-          return local.children;
-        }
-      });
+      return local.children;
     }
   }));
 }

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

@@ -1 +1 @@
-{"version":3,"names":[],"sources":["actions/Button.tsx"],"sourcesContent":["import { Link, type LinkNavigateEvent, type NavigationScrollMode } from \"@k2b/ssr/nav\";\nimport { type JSX, Show, splitProps } from \"solid-js\";\nimport { isServer } from \"solid-js/web\";\nimport { Tooltip, type TooltipPlacement, useLabelTooltip } from \"../feedback/Tooltip\";\n\nexport type ButtonVariant = \"primary\" | \"secondary\" | \"ghost\" | \"text\" | \"subtle\" | \"input\" | \"warning\" | \"danger\" | \"success\" | \"ai\";\nexport type ButtonSize = \"xs\" | \"sm\" | \"md\" | \"lg\";\nexport type ButtonAlign = \"center\" | \"start\";\n\nexport type ButtonProps = JSX.ButtonHTMLAttributes<HTMLButtonElement> & {\n  /** Allow a deliberately long or rich label to wrap. Defaults to false. */\n  wrap?: boolean;\n  /** Start-align the content and let the label fill the button, for full-width rows. Defaults to `\"center\"`. */\n  align?: ButtonAlign;\n  loading?: boolean;\n  loadingLabel?: string;\n  size?: ButtonSize;\n  variant?: ButtonVariant;\n  tooltip?: JSX.Element | false;\n  tooltipDelay?: number;\n  tooltipPlacement?: TooltipPlacement;\n};\n\nexport type ButtonLinkProps = Omit<JSX.AnchorHTMLAttributes<HTMLAnchorElement>, \"onClick\"> & {\n  /** Allow a deliberately long or rich label to wrap. Defaults to false. */\n  wrap?: boolean;\n  /** Start-align the content and let the label fill the button, for full-width rows. Defaults to `\"center\"`. */\n  align?: ButtonAlign;\n  navigation?: \"document\" | \"enhanced\";\n  onClick?: JSX.EventHandlerUnion<HTMLAnchorElement, MouseEvent>;\n  onNavigate?: (event: LinkNavigateEvent) => void | Promise<void>;\n  replace?: boolean;\n  scroll?: NavigationScrollMode;\n  size?: ButtonSize;\n  variant?: ButtonVariant;\n  tooltip?: JSX.Element | false;\n  tooltipDelay?: number;\n  tooltipPlacement?: TooltipPlacement;\n};\n\nconst buttonClass = (className?: string): string => [\"k2b-button\", className].filter(Boolean).join(\" \");\n\nexport function Button(props: ButtonProps): JSX.Element {\n  const [local, rest] = splitProps(props, [\n    \"children\",\n    \"class\",\n    \"disabled\",\n    \"loading\",\n    \"loadingLabel\",\n    \"ref\",\n    \"size\",\n    \"tooltip\",\n    \"tooltipDelay\",\n    \"tooltipPlacement\",\n    \"type\",\n    \"variant\",\n    \"wrap\",\n    \"align\",\n  ]);\n  let target: HTMLButtonElement | undefined;\n  const setRef = (element: HTMLButtonElement) => {\n    target = element;\n    if (typeof local.ref === \"function\") local.ref(element);\n  };\n\n  const control = (\n    <button\n      {...rest}\n      ref={setRef}\n      type={local.type ?? \"button\"}\n      class={buttonClass(local.class)}\n      data-size={local.size ?? \"md\"}\n      data-variant={local.variant ?? \"primary\"}\n      data-wrap={local.wrap || undefined}\n      data-align={local.align === \"start\" ? \"start\" : undefined}\n      disabled={local.disabled || local.loading}\n      aria-busy={local.loading ? \"true\" : undefined}\n    >\n      <Show when={local.loading}>\n        <i class=\"ti ti-loader-2 k2b-spin\" aria-hidden=\"true\" />\n      </Show>\n      <span class=\"k2b-button__label\">\n        <Show when={local.loading && local.loadingLabel} fallback={local.children}>\n          {local.loadingLabel}\n        </Show>\n      </span>\n    </button>\n  );\n\n  return (\n    <>\n      {control}\n      <Show when={local.tooltip !== false && local.tooltip !== undefined}>\n        <Tooltip\n          content={local.tooltip as JSX.Element}\n          target={() => target}\n          delay={local.tooltipDelay}\n          disabled={local.disabled || local.loading}\n          placement={local.tooltipPlacement}\n        />\n      </Show>\n    </>\n  );\n}\n\nexport function ButtonLink(props: ButtonLinkProps): JSX.Element {\n  const [local, rest] = splitProps(props, [\n    \"children\",\n    \"class\",\n    \"href\",\n    \"navigation\",\n    \"onClick\",\n    \"onNavigate\",\n    \"replace\",\n    \"ref\",\n    \"scroll\",\n    \"size\",\n    \"tooltip\",\n    \"tooltipDelay\",\n    \"tooltipPlacement\",\n    \"variant\",\n    \"wrap\",\n    \"align\",\n  ]);\n  let target: HTMLAnchorElement | undefined;\n  const setRef = (element: HTMLAnchorElement) => {\n    target = element;\n    if (typeof local.ref === \"function\") local.ref(element);\n  };\n  const className = buttonClass(local.class);\n  const content = <span class=\"k2b-button__label\">{local.children}</span>;\n\n  const tooltip = () => (\n    <Show when={local.tooltip !== false && local.tooltip !== undefined}>\n      <Tooltip content={local.tooltip as JSX.Element} target={() => target} delay={local.tooltipDelay} placement={local.tooltipPlacement} />\n    </Show>\n  );\n\n  if (local.navigation === \"enhanced\" && local.href && local.onNavigate) {\n    return (\n      <>\n        <Link\n          {...rest}\n          ref={setRef}\n          href={local.href}\n          class={className}\n          data-size={local.size ?? \"md\"}\n          data-variant={local.variant ?? \"primary\"}\n          data-wrap={local.wrap || undefined}\n          data-align={local.align === \"start\" ? \"start\" : undefined}\n          onClick={local.onClick}\n          onNavigate={local.onNavigate}\n          replace={local.replace}\n          scroll={local.scroll}\n        >\n          {content}\n        </Link>\n        {tooltip()}\n      </>\n    );\n  }\n\n  return (\n    <>\n      <a\n        {...rest}\n        ref={setRef}\n        href={local.href}\n        class={className}\n        data-size={local.size ?? \"md\"}\n        data-variant={local.variant ?? \"primary\"}\n        data-wrap={local.wrap || undefined}\n        data-align={local.align === \"start\" ? \"start\" : undefined}\n        onClick={local.onClick}\n      >\n        {content}\n      </a>\n      {tooltip()}\n    </>\n  );\n}\n\nexport type IconButtonProps = Omit<ButtonProps, \"children\"> & {\n  children: JSX.Element;\n  label: string;\n};\n\nexport type IconButtonLinkProps = Omit<ButtonLinkProps, \"children\"> & {\n  children: JSX.Element;\n  label: string;\n};\n\n/**\n * The native title is only the server-rendered, no-JavaScript hint; the\n * hydrated tooltip removes it. Without a tooltip, an explicit title stays.\n */\nexport const iconTitle = (title: string | undefined, tooltip: JSX.Element | false | undefined): string | undefined =>\n  tooltip === false || tooltip === undefined ? title : isServer && typeof tooltip === \"string\" ? tooltip : undefined;\n\nexport function IconButton(props: IconButtonProps): JSX.Element {\n  const [local, rest] = splitProps(props, [\"children\", \"class\", \"label\", \"loading\", \"loadingLabel\", \"title\", \"tooltip\", \"variant\"]);\n  const tooltip = useLabelTooltip(\n    () => local.tooltip,\n    () => local.title ?? local.label,\n  );\n\n  return (\n    <Button\n      {...rest}\n      loading={local.loading}\n      variant={local.variant ?? \"ghost\"}\n      class={`k2b-icon-button ${local.class ?? \"\"}`}\n      aria-label={local.loading ? (local.loadingLabel ?? local.label) : local.label}\n      title={iconTitle(local.title, tooltip())}\n      tooltip={tooltip()}\n    >\n      <Show when={!local.loading}>{local.children}</Show>\n    </Button>\n  );\n}\n\nexport function IconButtonLink(props: IconButtonLinkProps): JSX.Element {\n  const [local, rest] = splitProps(props, [\"children\", \"class\", \"label\", \"title\", \"tooltip\", \"variant\"]);\n  const tooltip = useLabelTooltip(\n    () => local.tooltip,\n    () => local.title ?? local.label,\n  );\n\n  return (\n    <ButtonLink\n      {...rest}\n      variant={local.variant ?? \"ghost\"}\n      class={`k2b-icon-button ${local.class ?? \"\"}`}\n      aria-label={local.label}\n      title={iconTitle(local.title, tooltip())}\n      tooltip={tooltip()}\n    >\n      {local.children}\n    </ButtonLink>\n  );\n}\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"names":[],"sources":["actions/Button.tsx"],"sourcesContent":["import { Link, type LinkNavigateEvent, type NavigationScrollMode } from \"@k2b/ssr/nav\";\nimport { type JSX, Show, splitProps } from \"solid-js\";\nimport { isServer } from \"solid-js/web\";\nimport { Tooltip, type TooltipPlacement, useLabelTooltip } from \"../feedback/Tooltip\";\n\nexport type ButtonVariant = \"primary\" | \"secondary\" | \"ghost\" | \"text\" | \"subtle\" | \"input\" | \"warning\" | \"danger\" | \"success\" | \"ai\";\nexport type ButtonSize = \"xs\" | \"sm\" | \"md\" | \"lg\";\nexport type ButtonAlign = \"center\" | \"start\";\n\nexport type ButtonProps = JSX.ButtonHTMLAttributes<HTMLButtonElement> & {\n  /** Allow a deliberately long or rich label to wrap. Defaults to false. */\n  wrap?: boolean;\n  /** Start-align the content and let the label fill the button, for full-width rows. Defaults to `\"center\"`. */\n  align?: ButtonAlign;\n  loading?: boolean;\n  loadingLabel?: string;\n  size?: ButtonSize;\n  variant?: ButtonVariant;\n  tooltip?: JSX.Element | false;\n  tooltipDelay?: number;\n  tooltipPlacement?: TooltipPlacement;\n};\n\nexport type ButtonLinkProps = Omit<JSX.AnchorHTMLAttributes<HTMLAnchorElement>, \"onClick\"> & {\n  /** Allow a deliberately long or rich label to wrap. Defaults to false. */\n  wrap?: boolean;\n  /** Start-align the content and let the label fill the button, for full-width rows. Defaults to `\"center\"`. */\n  align?: ButtonAlign;\n  navigation?: \"document\" | \"enhanced\";\n  onClick?: JSX.EventHandlerUnion<HTMLAnchorElement, MouseEvent>;\n  onNavigate?: (event: LinkNavigateEvent) => void | Promise<void>;\n  replace?: boolean;\n  scroll?: NavigationScrollMode;\n  size?: ButtonSize;\n  variant?: ButtonVariant;\n  tooltip?: JSX.Element | false;\n  tooltipDelay?: number;\n  tooltipPlacement?: TooltipPlacement;\n};\n\nconst buttonClass = (className?: string): string => [\"k2b-button\", className].filter(Boolean).join(\" \");\n\nexport function Button(props: ButtonProps): JSX.Element {\n  const [local, rest] = splitProps(props, [\n    \"aria-label\",\n    \"aria-labelledby\",\n    \"children\",\n    \"class\",\n    \"disabled\",\n    \"loading\",\n    \"loadingLabel\",\n    \"ref\",\n    \"size\",\n    \"tooltip\",\n    \"tooltipDelay\",\n    \"tooltipPlacement\",\n    \"type\",\n    \"variant\",\n    \"wrap\",\n    \"align\",\n  ]);\n  let target: HTMLButtonElement | undefined;\n  const setRef = (element: HTMLButtonElement) => {\n    target = element;\n    if (typeof local.ref === \"function\") local.ref(element);\n  };\n  // While busy, a loading label names the button, over any name the caller\n  // gave it, because the idle content it would describe is not visible.\n  const busyName = () => (local.loading && local.loadingLabel) || undefined;\n\n  const control = (\n    <button\n      {...rest}\n      aria-label={busyName() ?? local[\"aria-label\"]}\n      aria-labelledby={busyName() ? undefined : local[\"aria-labelledby\"]}\n      ref={setRef}\n      type={local.type ?? \"button\"}\n      class={buttonClass(local.class)}\n      data-size={local.size ?? \"md\"}\n      data-variant={local.variant ?? \"primary\"}\n      data-wrap={local.wrap || undefined}\n      data-align={local.align === \"start\" ? \"start\" : undefined}\n      disabled={local.disabled || local.loading}\n      aria-busy={local.loading ? \"true\" : undefined}\n    >\n      {/* The idle content keeps its place, invisibly, so the button keeps its\n          size; the spinner is drawn over it. */}\n      <span class=\"k2b-button__label\">{local.children}</span>\n      <Show when={local.loading}>\n        <span class=\"k2b-button__busy\" aria-hidden=\"true\">\n          <i class=\"ti ti-loader-2 k2b-spin\" />\n        </span>\n      </Show>\n    </button>\n  );\n\n  return (\n    <>\n      {control}\n      <Show when={local.tooltip !== false && local.tooltip !== undefined}>\n        <Tooltip\n          content={local.tooltip as JSX.Element}\n          target={() => target}\n          delay={local.tooltipDelay}\n          disabled={local.disabled || local.loading}\n          placement={local.tooltipPlacement}\n        />\n      </Show>\n    </>\n  );\n}\n\nexport function ButtonLink(props: ButtonLinkProps): JSX.Element {\n  const [local, rest] = splitProps(props, [\n    \"children\",\n    \"class\",\n    \"href\",\n    \"navigation\",\n    \"onClick\",\n    \"onNavigate\",\n    \"replace\",\n    \"ref\",\n    \"scroll\",\n    \"size\",\n    \"tooltip\",\n    \"tooltipDelay\",\n    \"tooltipPlacement\",\n    \"variant\",\n    \"wrap\",\n    \"align\",\n  ]);\n  let target: HTMLAnchorElement | undefined;\n  const setRef = (element: HTMLAnchorElement) => {\n    target = element;\n    if (typeof local.ref === \"function\") local.ref(element);\n  };\n  const className = buttonClass(local.class);\n  const content = <span class=\"k2b-button__label\">{local.children}</span>;\n\n  const tooltip = () => (\n    <Show when={local.tooltip !== false && local.tooltip !== undefined}>\n      <Tooltip content={local.tooltip as JSX.Element} target={() => target} delay={local.tooltipDelay} placement={local.tooltipPlacement} />\n    </Show>\n  );\n\n  if (local.navigation === \"enhanced\" && local.href && local.onNavigate) {\n    return (\n      <>\n        <Link\n          {...rest}\n          ref={setRef}\n          href={local.href}\n          class={className}\n          data-size={local.size ?? \"md\"}\n          data-variant={local.variant ?? \"primary\"}\n          data-wrap={local.wrap || undefined}\n          data-align={local.align === \"start\" ? \"start\" : undefined}\n          onClick={local.onClick}\n          onNavigate={local.onNavigate}\n          replace={local.replace}\n          scroll={local.scroll}\n        >\n          {content}\n        </Link>\n        {tooltip()}\n      </>\n    );\n  }\n\n  return (\n    <>\n      <a\n        {...rest}\n        ref={setRef}\n        href={local.href}\n        class={className}\n        data-size={local.size ?? \"md\"}\n        data-variant={local.variant ?? \"primary\"}\n        data-wrap={local.wrap || undefined}\n        data-align={local.align === \"start\" ? \"start\" : undefined}\n        onClick={local.onClick}\n      >\n        {content}\n      </a>\n      {tooltip()}\n    </>\n  );\n}\n\nexport type IconButtonProps = Omit<ButtonProps, \"children\"> & {\n  children: JSX.Element;\n  label: string;\n};\n\nexport type IconButtonLinkProps = Omit<ButtonLinkProps, \"children\"> & {\n  children: JSX.Element;\n  label: string;\n};\n\n/**\n * The native title is only the server-rendered, no-JavaScript hint; the\n * hydrated tooltip removes it. Without a tooltip, an explicit title stays.\n */\nexport const iconTitle = (title: string | undefined, tooltip: JSX.Element | false | undefined): string | undefined =>\n  tooltip === false || tooltip === undefined ? title : isServer && typeof tooltip === \"string\" ? tooltip : undefined;\n\nexport function IconButton(props: IconButtonProps): JSX.Element {\n  const [local, rest] = splitProps(props, [\"children\", \"class\", \"label\", \"title\", \"tooltip\", \"variant\"]);\n  const tooltip = useLabelTooltip(\n    () => local.tooltip,\n    () => local.title ?? local.label,\n  );\n\n  return (\n    <Button\n      {...rest}\n      variant={local.variant ?? \"ghost\"}\n      class={`k2b-icon-button ${local.class ?? \"\"}`}\n      aria-label={local.label}\n      title={iconTitle(local.title, tooltip())}\n      tooltip={tooltip()}\n    >\n      {local.children}\n    </Button>\n  );\n}\n\nexport function IconButtonLink(props: IconButtonLinkProps): JSX.Element {\n  const [local, rest] = splitProps(props, [\"children\", \"class\", \"label\", \"title\", \"tooltip\", \"variant\"]);\n  const tooltip = useLabelTooltip(\n    () => local.tooltip,\n    () => local.title ?? local.label,\n  );\n\n  return (\n    <ButtonLink\n      {...rest}\n      variant={local.variant ?? \"ghost\"}\n      class={`k2b-icon-button ${local.class ?? \"\"}`}\n      aria-label={local.label}\n      title={iconTitle(local.title, tooltip())}\n      tooltip={tooltip()}\n    >\n      {local.children}\n    </ButtonLink>\n  );\n}\n"],"mappings":"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","ignoreList":[]}

package/dist/browser/actions/ContextMenu.js

@@ -29,6 +29,8 @@ export function ContextMenu(props) {
   let menu;
   let listenersAttached = false;
   let hostRing = true;
+  /** The element inside the host that had focus as the menu opened, such as a row or a day of a composite widget. */
+  let opener;
   let anchor = {
     x: 0,
     y: 0
@@ -100,8 +102,10 @@ export function ContextMenu(props) {
   const open = (x, y) => {
     if (props.disabled) return;
     closeActiveContextMenu?.();
-    // Focus may sit on a descendant of the host, as in composite widgets.
-    hostRing = ringOnReturn(document.activeElement);
+    // Focus may sit on a descendant of the host, as in composite widgets; Escape returns it there.
+    const focused = document.activeElement;
+    opener = focused instanceof HTMLElement && focused !== host && host?.contains(focused) ? focused : undefined;
+    hostRing = ringOnReturn(focused);
     anchor = {
       x,
       y
@@ -145,7 +149,7 @@ export function ContextMenu(props) {
     } else if (event.key === "Escape") {
       event.preventDefault();
       close();
-      returnFocus(host, hostRing);
+      returnFocus(opener?.isConnected ? opener : host, hostRing);
     } else if (event.key === "Tab") {
       close();
     }

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

@@ -1 +1 @@
-{"version":3,"names":[],"sources":["actions/ContextMenu.tsx"],"sourcesContent":["import { createMemo, createSignal, createUniqueId, type JSX, onCleanup, onMount, Show } from \"solid-js\";\nimport { Portal } from \"solid-js/web\";\nimport { returnFocus, ringOnReturn } from \"../internal/focus-return\";\nimport { useUiMessages } from \"../intl/messages\";\nimport { type DropdownItem, DropdownItems, type DropdownPosition, dropdownPosition, focusRowSegment } 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  let hostRing = true;\n  let anchor = { x: 0, y: 0 };\n  let viewport = { width: 0, height: 0 };\n  let resizeObserver: ResizeObserver | undefined;\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 closeOnScroll = (event: Event) => {\n    const target = event.target;\n    if (target instanceof Node && menu?.contains(target)) return;\n    close();\n  };\n  // A resize event may leave the viewport's size unchanged; headless Chromium\n  // was seen to fire one on a fresh page. The clamped menu is still in place.\n  const closeOnResize = () => {\n    if (window.innerWidth === viewport.width && window.innerHeight === viewport.height) 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\", closeOnResize);\n    window.addEventListener(\"scroll\", closeOnScroll, 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\", closeOnResize);\n    window.removeEventListener(\"scroll\", closeOnScroll, true);\n    resizeObserver?.disconnect();\n  };\n  /** Clamps the rendered menu into the viewport beside the point that opened it. */\n  const place = () => {\n    if (!isOpen() || !menu?.isConnected) return;\n    const point = dropdownPosition(\n      new DOMRect(anchor.x, anchor.y, 0, 0),\n      menu.getBoundingClientRect(),\n      \"bottom-right\" satisfies DropdownPosition,\n      { width: window.innerWidth, height: window.innerHeight },\n      0,\n    );\n    setPosition({ x: point.left, y: point.top });\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    // Focus may sit on a descendant of the host, as in composite widgets.\n    hostRing = ringOnReturn(document.activeElement);\n    anchor = { x, y };\n    viewport = { width: window.innerWidth, height: window.innerHeight };\n    setPosition({ x, y });\n    closeActiveContextMenu = close;\n    attachOpenListeners();\n    props.onOpen?.();\n    // The menu sizes to its entries, so it is measured once rendered and\n    // clamped into the viewport before the next paint, and again whenever its\n    // entries change its size while it is open.\n    queueMicrotask(() => {\n      if (!isOpen() || !menu?.isConnected) return;\n      place();\n      if (typeof ResizeObserver !== \"undefined\") {\n        resizeObserver ??= new ResizeObserver(place);\n        resizeObserver.observe(menu);\n      }\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 (focusRowSegment(items, event.key)) {\n      event.preventDefault();\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      returnFocus(host, hostRing);\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":[]}
+{"version":3,"names":[],"sources":["actions/ContextMenu.tsx"],"sourcesContent":["import { createMemo, createSignal, createUniqueId, type JSX, onCleanup, onMount, Show } from \"solid-js\";\nimport { Portal } from \"solid-js/web\";\nimport { returnFocus, ringOnReturn } from \"../internal/focus-return\";\nimport { useUiMessages } from \"../intl/messages\";\nimport { type DropdownItem, DropdownItems, type DropdownPosition, dropdownPosition, focusRowSegment } 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  let hostRing = true;\n  /** The element inside the host that had focus as the menu opened, such as a row or a day of a composite widget. */\n  let opener: HTMLElement | undefined;\n  let anchor = { x: 0, y: 0 };\n  let viewport = { width: 0, height: 0 };\n  let resizeObserver: ResizeObserver | undefined;\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 closeOnScroll = (event: Event) => {\n    const target = event.target;\n    if (target instanceof Node && menu?.contains(target)) return;\n    close();\n  };\n  // A resize event may leave the viewport's size unchanged; headless Chromium\n  // was seen to fire one on a fresh page. The clamped menu is still in place.\n  const closeOnResize = () => {\n    if (window.innerWidth === viewport.width && window.innerHeight === viewport.height) 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\", closeOnResize);\n    window.addEventListener(\"scroll\", closeOnScroll, 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\", closeOnResize);\n    window.removeEventListener(\"scroll\", closeOnScroll, true);\n    resizeObserver?.disconnect();\n  };\n  /** Clamps the rendered menu into the viewport beside the point that opened it. */\n  const place = () => {\n    if (!isOpen() || !menu?.isConnected) return;\n    const point = dropdownPosition(\n      new DOMRect(anchor.x, anchor.y, 0, 0),\n      menu.getBoundingClientRect(),\n      \"bottom-right\" satisfies DropdownPosition,\n      { width: window.innerWidth, height: window.innerHeight },\n      0,\n    );\n    setPosition({ x: point.left, y: point.top });\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    // Focus may sit on a descendant of the host, as in composite widgets; Escape returns it there.\n    const focused = document.activeElement;\n    opener = focused instanceof HTMLElement && focused !== host && host?.contains(focused) ? focused : undefined;\n    hostRing = ringOnReturn(focused);\n    anchor = { x, y };\n    viewport = { width: window.innerWidth, height: window.innerHeight };\n    setPosition({ x, y });\n    closeActiveContextMenu = close;\n    attachOpenListeners();\n    props.onOpen?.();\n    // The menu sizes to its entries, so it is measured once rendered and\n    // clamped into the viewport before the next paint, and again whenever its\n    // entries change its size while it is open.\n    queueMicrotask(() => {\n      if (!isOpen() || !menu?.isConnected) return;\n      place();\n      if (typeof ResizeObserver !== \"undefined\") {\n        resizeObserver ??= new ResizeObserver(place);\n        resizeObserver.observe(menu);\n      }\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 (focusRowSegment(items, event.key)) {\n      event.preventDefault();\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      returnFocus(opener?.isConnected ? opener : host, hostRing);\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

@@ -47,11 +47,16 @@ export function CopyButton(props) {
   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;
+      return local.disabled;
+    },
+    get loading() {
+      return local.loading;
+    },
+    get loadingLabel() {
+      return local.loadingLabel;
     },
     get type() {
       return local.type ?? "button";
@@ -65,21 +70,18 @@ export function CopyButton(props) {
     get variant() {
       return local.variant ?? "ghost";
     },
-    get ["aria-busy"]() {
-      return local.loading ? "true" : undefined;
-    },
     get ["aria-label"]() {
-      return _$memo(() => !!iconOnly())() ? buttonLabel() : undefined;
+      return _$memo(() => !!iconOnly())() ? visibleLabel() : undefined;
     },
     onClick: copy,
     get children() {
       return [(() => {
         var _el$ = _$getNextElement(_tmpl$);
-        _$effect(() => _$className(_el$, local.loading ? "ti ti-loader-2 k2b-spin" : icon()));
+        _$effect(() => _$className(_el$, icon()));
         return _el$;
       })(), _$memo(() => _$memo(() => !!!iconOnly())() && (() => {
         var _el$2 = _$getNextElement(_tmpl$2);
-        _$insert(_el$2, buttonLabel);
+        _$insert(_el$2, visibleLabel);
         return _el$2;
       })())];
     }

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

@@ -1 +1 @@
-{"version":3,"names":[],"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":[]}
+{"version":3,"names":[],"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 button = (tooltip?: string) => (\n    <Button\n      {...rest}\n      tooltip={tooltip}\n      disabled={local.disabled}\n      loading={local.loading}\n      loadingLabel={local.loadingLabel}\n      type={local.type ?? \"button\"}\n      class={`k2b-copy-button ${local.class ?? \"\"}`}\n      size={local.size ?? \"sm\"}\n      variant={local.variant ?? \"ghost\"}\n      aria-label={iconOnly() ? visibleLabel() : undefined}\n      onClick={copy}\n    >\n      <i class={icon()} aria-hidden=\"true\" />\n      {!iconOnly() && <span>{visibleLabel()}</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":[]}