npm - @smwb/ui-solid - Versions diffs - 0.12.1 → 0.13.0 - Mend

@smwb/ui-solid 0.12.1 → 0.13.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (841) hide show

package/dist/components/feedBack/snackbar/snackbar.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"snackbar.js","sources":["../../../../src/components/feedBack/snackbar/snackbar.tsx"],"sourcesContent":["import {\n type JSX,\n type ParentProps,\n For,\n Show,\n createContext,\n createSignal,\n mergeProps,\n onCleanup,\n onMount,\n splitProps,\n useContext,\n} from \"solid-js\";\nimport { Dynamic, Portal } from \"solid-js/web\";\nimport cn from \"clsx\";\nimport { createSnackbarsPortal } from \"./useSnackbarsPortal\";\nimport { createCssTransition } from \"../../../primitives/createCssTransition\";\nimport { mergeRefs, type Ref } from \"../../../primitives/mergeRefs\";\n\nexport const variants = [\"dark\", \"light\", \"danger\", \"success\", \"warning\", \"info\"] as const;\nexport const positions = [\"top\", \"bottom\", \"top-left\", \"top-right\", \"bottom-right\", \"bottom-left\"] as const;\n\nexport type Variants = (typeof variants)[number];\nexport type Position = (typeof positions)[number];\n\nexport interface SnackbarsProviderProps extends JSX.HTMLAttributes<HTMLElement> {\n variant?: Variants;\n position?: Position;\n autoCloseTime?: number;\n closeOnClick?: boolean;\n autoClose?: boolean;\n component?: string;\n}\n\ninterface Snack {\n id: string;\n message: JSX.Element;\n variant?: Variants \| undefined;\n position?: Position \| undefined;\n autoClose?: boolean \| undefined;\n autoCloseTime?: number \| undefined;\n component?: string \| undefined;\n class?: string \| undefined;\n}\n\nexport interface AddSnackbarOptions {\n key?: string;\n message: JSX.Element;\n variant?: Variants \| undefined;\n position?: Position \| undefined;\n autoClose?: boolean \| undefined;\n autoCloseTime?: number \| undefined;\n component?: string \| undefined;\n class?: string;\n}\n\nexport type AddSnackbar = (options: AddSnackbarOptions) => string;\n\nexport interface SnackbarOptions {\n addSnackbar: AddSnackbar;\n clearAllSnackbars: () => void;\n clearFirstSnackbar: () => void;\n clearLastSnackbar: () => void;\n clearByIdSnackbar: (id: string) => void;\n}\n\nconst SnackbarContext = createContext<SnackbarOptions>({\n addSnackbar: () => \"\",\n clearAllSnackbars: () => undefined,\n clearFirstSnackbar: () => undefined,\n clearLastSnackbar: () => undefined,\n clearByIdSnackbar: () => undefined,\n});\n\nlet snackCounter = 0;\n\nconst SNACKBAR_CLASSNAMES = {\n appear: \"smwb-snackbar-enter\",\n appearActive: \"smwb-snackbar-enter-active\",\n appearDone: \"smwb-snackbar-enter-done\",\n enter: \"smwb-snackbar-enter\",\n enterActive: \"smwb-snackbar-enter-active\",\n enterDone: \"smwb-snackbar-enter-done\",\n exitActive: \"smwb-snackbar-exit-active\",\n};\n\nexport interface SnackbarProps extends JSX.HTMLAttributes<HTMLElement> {\n message?: JSX.Element;\n variant?: Variants;\n position?: Position;\n component?: string;\n isAutoClose?: boolean;\n autoCloseTime?: number;\n onClose?: () => void;\n /** Optional action node rendered after the message (e.g. an Undo button). /\n action?: JSX.Element;\n /* Enter-transition classes for the appear animation. */\n transitionClass?: string;\n ref?: Ref<HTMLElement>;\n}\n\nexport function Snackbar(props: SnackbarProps): JSX.Element {\n const merged = mergeProps({ variant: \"dark\" as Variants, position: \"top-right\" as Position, component: \"div\" }, props);\n const [local, rest] = splitProps(merged, [\n \"class\",\n \"message\",\n \"variant\",\n \"position\",\n \"onClick\",\n \"component\",\n \"isAutoClose\",\n \"autoCloseTime\",\n \"onClose\",\n \"action\",\n \"transitionClass\",\n \"ref\",\n ]);\n\n let timer: ReturnType<typeof setTimeout> \| undefined;\n onMount(() => {\n if (local.onClose && local.isAutoClose && local.autoCloseTime) {\n timer = setTimeout(() => local.onClose?.(), local.autoCloseTime);\n }\n });\n onCleanup(() => {\n if (timer !== undefined) clearTimeout(timer);\n });\n\n return (\n <Dynamic\n component={local.component ?? \"div\"}\n {...rest}\n ref={mergeRefs(local.ref)}\n class={cn(\"smwb-snackbar\", local.class, `smwb-${local.variant}`, `smwb-${local.position}`, local.transitionClass)}\n onClick={local.onClick}\n role=\"alert\"\n aria-live={local.variant === \"danger\" ? \"assertive\" : \"polite\"}\n aria-atomic=\"true\"\n >\n <div class=\"smwb-snackbar__body\">{local.message}</div>\n <Show when={local.action != null}>\n <div class=\"smwb-snackbar__action\">{local.action}</div>\n </Show>\n </Dynamic>\n );\n}\n\nfunction AnimatedSnack(props: {\n snack: Snack;\n position: Position;\n variant: Variants;\n component: string;\n autoClose: boolean;\n autoCloseTime: number;\n onRemove: (id: string) => void;\n onClose: (id: string) => void;\n}): JSX.Element {\n const transition = createCssTransition({\n in: () => true,\n appear: true,\n timeout: { appear: 125, enter: 125, exit: 125 },\n classNames: SNACKBAR_CLASSNAMES,\n });\n return (\n <Snackbar\n component={props.snack.component ?? props.component}\n message={props.snack.message}\n position={props.snack.position ?? props.position}\n variant={props.snack.variant ?? props.variant}\n class={props.snack.class}\n transitionClass={transition.classes()}\n isAutoClose={props.snack.autoClose ?? props.autoClose}\n autoCloseTime={props.snack.autoCloseTime ?? props.autoCloseTime}\n onClick={() => props.onRemove(props.snack.id)}\n onClose={() => props.onClose(props.snack.id)}\n />\n );\n}\n\nexport function SnackbarProvider(props: ParentProps<SnackbarsProviderProps>): JSX.Element {\n const merged = mergeProps(\n {\n position: \"top-right\" as Position,\n variant: \"dark\" as Variants,\n autoClose: true,\n autoCloseTime: 5000,\n closeOnClick: true,\n component: \"div\",\n },\n props\n );\n const [local] = splitProps(merged, [\n \"position\",\n \"variant\",\n \"class\",\n \"autoClose\",\n \"autoCloseTime\",\n \"closeOnClick\",\n \"onClick\",\n \"component\",\n \"children\",\n ]);\n\n const [snacks, setSnacks] = createSignal<Snack[]>([]);\n const portalRoot = createSnackbarsPortal();\n\n const addSnackbar: AddSnackbar = (options) => {\n const { key, ...optionRest } = options;\n const id = key ?? `snack-${++snackCounter}`;\n const snack: Snack = { id, ...optionRest };\n setSnacks((prev) => {\n const index = prev.findIndex((item) => item.id === id);\n if (index === -1) return [...prev, snack];\n const next = [...prev];\n next[index] = snack;\n return next;\n });\n return id;\n };\n\n const clearByIdSnackbar = (id: string): void => {\n setSnacks((prev) => prev.filter((item) => item.id !== id));\n };\n const clearAllSnackbars = (): void => {\n setSnacks([]);\n };\n const clearFirstSnackbar = (): void => {\n setSnacks((prev) => prev.slice(1));\n };\n const clearLastSnackbar = (): void => {\n setSnacks((prev) => prev.slice(0, -1));\n };\n\n const onRemove = (id: string): void => {\n if (local.closeOnClick) clearByIdSnackbar(id);\n };\n\n const grouped = (): Array<[Position, Snack[]]> => {\n const acc = {} as Record<Position, Snack[]>;\n for (const snack of snacks()) {\n const pos = snack.position ?? local.position;\n (acc[pos] = acc[pos] ?? []).push(snack);\n }\n return Object.entries(acc) as Array<[Position, Snack[]]>;\n };\n\n return (\n <SnackbarContext.Provider\n value={{ addSnackbar, clearAllSnackbars, clearFirstSnackbar, clearLastSnackbar, clearByIdSnackbar }}\n >\n {local.children}\n <Show when={portalRoot()}>\n <Portal mount={portalRoot()!}>\n <For each={grouped()}>\n {([pos, list]) => (\n <div class={cn(\"smwb-snackbars\", `smwb-${pos}`)} data-testid={`snackbars-${pos}`}>\n <For each={list}>\n {(snack) => (\n <AnimatedSnack\n snack={snack}\n position={local.position}\n variant={local.variant}\n component={local.component}\n autoClose={local.autoClose}\n autoCloseTime={local.autoCloseTime}\n onRemove={onRemove}\n onClose={clearByIdSnackbar}\n />\n )}\n </For>\n </div>\n )}\n </For>\n </Portal>\n </Show>\n </SnackbarContext.Provider>\n );\n}\n\nexport function useSnackbar(): SnackbarOptions {\n return useContext(SnackbarContext);\n}\n\nexport default SnackbarProvider;\n"],"names":["SnackbarContext","createContext","addSnackbar","clearAllSnackbars","clearFirstSnackbar","clearLastSnackbar","clearByIdSnackbar","snackCounter","SNACKBAR_CLASSNAMES","appear","appearActive","appearDone","enter","enterActive","enterDone","exitActive","Snackbar","props","merged","mergeProps","variant","position","component","local","rest","splitProps","timer","onMount","onClose","isAutoClose","autoCloseTime","setTimeout","onCleanup","undefined","clearTimeout","_$createComponent","Dynamic","_$mergeProps","ref","r$","_ref$","mergeRefs","cn","class","transitionClass","onClick","role","children","_el$","_tmpl$","_$insert","message","Show","when","action","_el$2","_tmpl$2","AnimatedSnack","transition","createCssTransition","in","timeout","exit","classNames","snack","classes","autoClose","onRemove","id","SnackbarProvider","closeOnClick","snacks","setSnacks","createSignal","portalRoot","createSnackbarsPortal","options","key","optionRest","prev","index","findIndex","item","next","filter","slice","grouped","acc","pos","push","Object","entries","Provider","value","_$memo","Portal","mount","For","each","list","_el$3","_tmpl$3","_$setAttribute","_$effect","_$className","useSnackbar","useContext"],"mappings":"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"}
1	+ {"version":3,"file":"snackbar.js","sources":["../../../../src/components/feedBack/snackbar/snackbar.tsx"],"sourcesContent":["import {\n type JSX,\n type ParentProps,\n For,\n Show,\n createContext,\n createSignal,\n mergeProps,\n onCleanup,\n onMount,\n splitProps,\n useContext,\n} from \"solid-js\";\nimport { Dynamic, Portal } from \"solid-js/web\";\nimport cn from \"clsx\";\nimport { createSnackbarsPortal } from \"./useSnackbarsPortal\";\nimport { createCssTransition } from \"../../../primitives/createCssTransition\";\nimport { mergeRefs, type Ref } from \"../../../primitives/mergeRefs\";\n\nexport const variants = [\"dark\", \"light\", \"danger\", \"success\", \"warning\", \"info\"] as const;\nexport const positions = [\"top\", \"bottom\", \"top-left\", \"top-right\", \"bottom-right\", \"bottom-left\"] as const;\n\nexport type Variants = (typeof variants)[number];\nexport type Position = (typeof positions)[number];\n\nexport interface SnackbarsProviderProps extends JSX.HTMLAttributes<HTMLElement> {\n variant?: Variants;\n position?: Position;\n autoCloseTime?: number;\n closeOnClick?: boolean;\n autoClose?: boolean;\n component?: string;\n}\n\ninterface Snack {\n id: string;\n message: JSX.Element;\n variant?: Variants \| undefined;\n position?: Position \| undefined;\n autoClose?: boolean \| undefined;\n autoCloseTime?: number \| undefined;\n component?: string \| undefined;\n class?: string \| undefined;\n}\n\nexport interface AddSnackbarOptions {\n key?: string;\n message: JSX.Element;\n variant?: Variants \| undefined;\n position?: Position \| undefined;\n autoClose?: boolean \| undefined;\n autoCloseTime?: number \| undefined;\n component?: string \| undefined;\n class?: string;\n}\n\nexport type AddSnackbar = (options: AddSnackbarOptions) => string;\n\nexport interface SnackbarOptions {\n addSnackbar: AddSnackbar;\n clearAllSnackbars: () => void;\n clearFirstSnackbar: () => void;\n clearLastSnackbar: () => void;\n clearByIdSnackbar: (id: string) => void;\n}\n\nconst SnackbarContext = createContext<SnackbarOptions>({\n addSnackbar: () => \"\",\n clearAllSnackbars: () => undefined,\n clearFirstSnackbar: () => undefined,\n clearLastSnackbar: () => undefined,\n clearByIdSnackbar: () => undefined,\n});\n\nlet snackCounter = 0;\n\nconst SNACKBAR_CLASSNAMES = {\n appear: \"smwb-snackbar-enter\",\n appearActive: \"smwb-snackbar-enter-active\",\n appearDone: \"smwb-snackbar-enter-done\",\n enter: \"smwb-snackbar-enter\",\n enterActive: \"smwb-snackbar-enter-active\",\n enterDone: \"smwb-snackbar-enter-done\",\n exitActive: \"smwb-snackbar-exit-active\",\n};\n\nexport interface SnackbarProps extends JSX.HTMLAttributes<HTMLElement> {\n message?: JSX.Element;\n variant?: Variants;\n position?: Position;\n component?: string;\n isAutoClose?: boolean;\n autoCloseTime?: number;\n onClose?: () => void;\n /** Optional action node rendered after the message (e.g. an Undo button). /\n action?: JSX.Element;\n /* Enter-transition classes for the appear animation. */\n transitionClass?: string;\n ref?: Ref<HTMLElement>;\n}\n\nexport function Snackbar(props: SnackbarProps): JSX.Element {\n const merged = mergeProps({ variant: \"dark\" as Variants, position: \"top-right\" as Position, component: \"div\" }, props);\n const [local, rest] = splitProps(merged, [\n \"class\",\n \"message\",\n \"variant\",\n \"position\",\n \"onClick\",\n \"component\",\n \"isAutoClose\",\n \"autoCloseTime\",\n \"onClose\",\n \"action\",\n \"transitionClass\",\n \"ref\",\n ]);\n\n let timer: ReturnType<typeof setTimeout> \| undefined;\n onMount(() => {\n if (local.onClose && local.isAutoClose && local.autoCloseTime) {\n timer = setTimeout(() => local.onClose?.(), local.autoCloseTime);\n }\n });\n onCleanup(() => {\n if (timer !== undefined) clearTimeout(timer);\n });\n\n return (\n <Dynamic\n component={local.component ?? \"div\"}\n {...rest}\n ref={mergeRefs(local.ref)}\n class={cn(\"smwb-snackbar\", local.class, `smwb-${local.variant}`, `smwb-${local.position}`, local.transitionClass)}\n onClick={local.onClick}\n // Defaults: the caller's own role, aria-live and aria-atomic win, and an\n // explicit undefined keeps these.\n role={rest.role ?? \"alert\"}\n aria-live={rest[\"aria-live\"] ?? (local.variant === \"danger\" ? \"assertive\" : \"polite\")}\n aria-atomic={rest[\"aria-atomic\"] ?? \"true\"}\n >\n <div class=\"smwb-snackbar__body\">{local.message}</div>\n <Show when={local.action != null}>\n <div class=\"smwb-snackbar__action\">{local.action}</div>\n </Show>\n </Dynamic>\n );\n}\n\nfunction AnimatedSnack(props: {\n snack: Snack;\n position: Position;\n variant: Variants;\n component: string;\n autoClose: boolean;\n autoCloseTime: number;\n onRemove: (id: string) => void;\n onClose: (id: string) => void;\n}): JSX.Element {\n const transition = createCssTransition({\n in: () => true,\n appear: true,\n timeout: { appear: 125, enter: 125, exit: 125 },\n classNames: SNACKBAR_CLASSNAMES,\n });\n return (\n <Snackbar\n component={props.snack.component ?? props.component}\n message={props.snack.message}\n position={props.snack.position ?? props.position}\n variant={props.snack.variant ?? props.variant}\n class={props.snack.class}\n transitionClass={transition.classes()}\n isAutoClose={props.snack.autoClose ?? props.autoClose}\n autoCloseTime={props.snack.autoCloseTime ?? props.autoCloseTime}\n onClick={() => props.onRemove(props.snack.id)}\n onClose={() => props.onClose(props.snack.id)}\n />\n );\n}\n\nexport function SnackbarProvider(props: ParentProps<SnackbarsProviderProps>): JSX.Element {\n const merged = mergeProps(\n {\n position: \"top-right\" as Position,\n variant: \"dark\" as Variants,\n autoClose: true,\n autoCloseTime: 5000,\n closeOnClick: true,\n component: \"div\",\n },\n props\n );\n const [local] = splitProps(merged, [\n \"position\",\n \"variant\",\n \"class\",\n \"autoClose\",\n \"autoCloseTime\",\n \"closeOnClick\",\n \"onClick\",\n \"component\",\n \"children\",\n ]);\n\n const [snacks, setSnacks] = createSignal<Snack[]>([]);\n const portalRoot = createSnackbarsPortal();\n\n const addSnackbar: AddSnackbar = (options) => {\n const { key, ...optionRest } = options;\n const id = key ?? `snack-${++snackCounter}`;\n const snack: Snack = { id, ...optionRest };\n setSnacks((prev) => {\n const index = prev.findIndex((item) => item.id === id);\n if (index === -1) return [...prev, snack];\n const next = [...prev];\n next[index] = snack;\n return next;\n });\n return id;\n };\n\n const clearByIdSnackbar = (id: string): void => {\n setSnacks((prev) => prev.filter((item) => item.id !== id));\n };\n const clearAllSnackbars = (): void => {\n setSnacks([]);\n };\n const clearFirstSnackbar = (): void => {\n setSnacks((prev) => prev.slice(1));\n };\n const clearLastSnackbar = (): void => {\n setSnacks((prev) => prev.slice(0, -1));\n };\n\n const onRemove = (id: string): void => {\n if (local.closeOnClick) clearByIdSnackbar(id);\n };\n\n const grouped = (): Array<[Position, Snack[]]> => {\n const acc = {} as Record<Position, Snack[]>;\n for (const snack of snacks()) {\n const pos = snack.position ?? local.position;\n (acc[pos] = acc[pos] ?? []).push(snack);\n }\n return Object.entries(acc) as Array<[Position, Snack[]]>;\n };\n\n return (\n <SnackbarContext.Provider\n value={{ addSnackbar, clearAllSnackbars, clearFirstSnackbar, clearLastSnackbar, clearByIdSnackbar }}\n >\n {local.children}\n <Show when={portalRoot()}>\n <Portal mount={portalRoot()!}>\n <For each={grouped()}>\n {([pos, list]) => (\n <div class={cn(\"smwb-snackbars\", `smwb-${pos}`)} data-testid={`snackbars-${pos}`}>\n <For each={list}>\n {(snack) => (\n <AnimatedSnack\n snack={snack}\n position={local.position}\n variant={local.variant}\n component={local.component}\n autoClose={local.autoClose}\n autoCloseTime={local.autoCloseTime}\n onRemove={onRemove}\n onClose={clearByIdSnackbar}\n />\n )}\n </For>\n </div>\n )}\n </For>\n </Portal>\n </Show>\n </SnackbarContext.Provider>\n );\n}\n\nexport function useSnackbar(): SnackbarOptions {\n return useContext(SnackbarContext);\n}\n\nexport default SnackbarProvider;\n"],"names":["SnackbarContext","createContext","addSnackbar","clearAllSnackbars","clearFirstSnackbar","clearLastSnackbar","clearByIdSnackbar","snackCounter","SNACKBAR_CLASSNAMES","appear","appearActive","appearDone","enter","enterActive","enterDone","exitActive","Snackbar","props","merged","mergeProps","variant","position","component","local","rest","splitProps","timer","onMount","onClose","isAutoClose","autoCloseTime","setTimeout","onCleanup","undefined","clearTimeout","_$createComponent","Dynamic","_$mergeProps","ref","r$","_ref$","mergeRefs","cn","class","transitionClass","onClick","role","children","_el$","_tmpl$","_$insert","message","Show","when","action","_el$2","_tmpl$2","AnimatedSnack","transition","createCssTransition","in","timeout","exit","classNames","snack","classes","autoClose","onRemove","id","SnackbarProvider","closeOnClick","snacks","setSnacks","createSignal","portalRoot","createSnackbarsPortal","options","key","optionRest","prev","index","findIndex","item","next","filter","slice","grouped","acc","pos","push","Object","entries","Provider","value","_$memo","Portal","mount","For","each","list","_el$3","_tmpl$3","_$setAttribute","_$effect","_$className","useSnackbar","useContext"],"mappings":"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"}

package/dist/components/feedBack/tooltip/tooltip.d.ts CHANGED Viewed

@@ -8,13 +8,21 @@ export interface TooltipProps {
         offsetX?: number;
         offsetY?: number;
     };
+    /** What the tip says: text or markup. */
     message: JSX.Element;
     placement?: Placement;
     /** Controls tooltip visibility when trigger is manual. */
     open?: boolean;
-    /** hover (default): show on pointer enter; click: toggle; manual: use open only. */
+    /**
+     * What shows the tooltip. `hover` (default): the pointer over the target or keyboard focus
+     * in it, until both have left. Keyboard focus is focus with a focus ring (`:focus-visible`),
+     * not the focus a mouse press gives a button. `click`: a click on the target shows or hides
+     * it. `manual`: `open` alone. Escape hides a `hover` or `click` tooltip.
+     */
     trigger?: TooltipTrigger;
+    /** Milliseconds from the pointer entering the target, or keyboard focus moving into it, until a hover tooltip shows. */
     openDelay?: number;
+    /** Milliseconds from the pointer and keyboard focus both leaving the target until a hover tooltip hides. */
     closeDelay?: number;
     ref?: Ref<HTMLDivElement>;
 }

package/dist/components/feedBack/tooltip/tooltip.js CHANGED Viewed

@@ -1,15 +1,23 @@
-import { use as p, addEventListener as m, insert as u, createComponent as F, effect as P, className as R, style as S, template as _, delegateEvents as A } from "solid-js/web";
+import { use as g, insert as d, createComponent as N, effect as X, className as Y, style as H, memo as V, template as F, delegateEvents as j } from "solid-js/web";
 import '../../../assets/styles/less/components/tooltip/tooltip.entry.css';import '../../../assets/styles/less/tokens.entry.css';/* empty css                                     */
 /* empty css                                                         */
-import { mergeProps as E, splitProps as M, createSignal as y, onCleanup as X, Show as Y } from "solid-js";
-import H from "clsx";
-import { offset as L, flip as N, shift as V } from "@floating-ui/dom";
-import { resolvePlacement as j } from "../../../utils/floating.js";
-import { createFloating as q } from "../../../primitives/createFloating.js";
-import { mergeRefs as z } from "../../../primitives/mergeRefs.js";
-var B = /* @__PURE__ */ _("<div>"), G = /* @__PURE__ */ _("<div class=smwb-tooltip__wrapper role=tooltip><div class=smwb-tooltip__ref>");
-function oe(w) {
-  const D = E({
+import { mergeProps as q, splitProps as z, createSignal as v, onCleanup as B, onMount as G, Show as J } from "solid-js";
+import K from "clsx";
+import { offset as Q, flip as U, shift as W } from "@floating-ui/dom";
+import { resolvePlacement as Z } from "../../../utils/floating.js";
+import { createFloating as ee } from "../../../primitives/createFloating.js";
+import { mergeRefs as te } from "../../../primitives/mergeRefs.js";
+import { createDismissOnEscape as C } from "../../../primitives/createDismissOnEscape.js";
+var re = /* @__PURE__ */ F("<div>"), oe = /* @__PURE__ */ F("<div class=smwb-tooltip__wrapper role=tooltip><div class=smwb-tooltip__ref>");
+function ne(u) {
+  try {
+    return u.matches(":focus-visible");
+  } catch {
+    return !0;
+  }
+}
+function de(u) {
+  const b = q({
     placement: "top",
     offset: {
       offsetX: 0,
@@ -18,61 +26,77 @@ function oe(w) {
     trigger: "hover",
     openDelay: 0,
     closeDelay: 0
-  }, w), [e] = M(D, ["class", "children", "placement", "offset", "message", "open", "trigger", "openDelay", "closeDelay", "ref"]), [T, i] = y(!1), [k, $] = y(!1);
-  let n = null, s = null;
-  const c = () => {
-    n !== null && (clearTimeout(n), n = null), s !== null && (clearTimeout(s), s = null);
+  }, u), [e] = z(b, ["class", "children", "placement", "offset", "message", "open", "trigger", "openDelay", "closeDelay", "ref"]), [h, n] = v(!1), [y, T] = v(!1);
+  let a = null, c = null, m = !1, s = !1;
+  const f = () => {
+    a !== null && (clearTimeout(a), a = null), c !== null && (clearTimeout(c), c = null);
   };
-  X(c);
-  const C = () => {
-    if (c(), e.openDelay <= 0) {
-      i(!0);
+  B(f);
+  const $ = () => {
+    if (f(), e.openDelay <= 0) {
+      n(!0);
       return;
     }
-    n = setTimeout(() => i(!0), e.openDelay);
-  }, O = () => {
-    if (c(), e.closeDelay <= 0) {
-      i(!1);
+    a = setTimeout(() => n(!0), e.openDelay);
+  }, _ = () => {
+    if (f(), e.closeDelay <= 0) {
+      n(!1);
       return;
     }
-    s = setTimeout(() => i(!1), e.closeDelay);
-  }, f = () => j(e.placement), r = q({
-    placement: () => f().placement,
+    c = setTimeout(() => n(!1), e.closeDelay);
+  };
+  C(() => e.trigger === "hover" && h(), () => {
+    f(), s = !1, n(!1);
+  }), C(() => e.trigger === "click" && y(), () => T(!1));
+  const p = () => Z(e.placement), l = ee({
+    placement: () => p().placement,
     middleware: () => [
-      L({
+      Q({
         mainAxis: e.offset?.offsetY ?? 0,
         crossAxis: e.offset?.offsetX ?? 0
       }),
       // A fixed placement turns to the other side, and slides along it, when the
       // viewport has no room for it.
-      ...f().autoMiddleware ? [f().autoMiddleware] : [N(), V({
+      ...p().autoMiddleware ? [p().autoMiddleware] : [U(), W({
         padding: 8
       })]
     ]
-  }), b = () => e.trigger === "manual" ? e.open === !0 : e.trigger === "click" ? k() : T();
+  }), E = () => e.trigger === "manual" ? e.open === !0 : e.trigger === "click" ? y() : h(), [P, M] = v(!1);
+  G(() => M(!0));
+  const R = () => {
+    m = !0, e.trigger === "hover" && $();
+  }, x = () => {
+    m = !1, e.trigger === "hover" && !s && _();
+  }, I = (t) => {
+    t.currentTarget.contains(t.target) && (s = ne(t.target), e.trigger === "hover" && s && $());
+  }, L = (t) => {
+    t.relatedTarget instanceof Node && t.currentTarget.contains(t.relatedTarget) || (s = !1, e.trigger === "hover" && !m && _());
+  }, S = () => {
+    e.trigger === "click" && T((t) => !t);
+  };
   return (() => {
-    var a = G(), o = a.firstChild, g = z(e.ref);
-    typeof g == "function" && p(g, a), m(o, "click", e.trigger === "click" ? () => $((t) => !t) : void 0, !0), m(o, "pointerleave", e.trigger === "hover" ? O : void 0), m(o, "pointerenter", e.trigger === "hover" ? C : void 0);
-    var d = r.setReference;
-    return typeof d == "function" ? p(d, o) : r.setReference = o, u(o, () => e.children), u(a, F(Y, {
+    var t = oe(), r = t.firstChild, w = te(e.ref);
+    typeof w == "function" && g(w, t), r.$$click = S, r.$$focusout = L, r.$$focusin = I, r.addEventListener("pointerleave", x), r.addEventListener("pointerenter", R);
+    var D = l.setReference;
+    return typeof D == "function" ? g(D, r) : l.setReference = r, d(r, () => e.children), d(t, N(J, {
       get when() {
-        return b();
+        return V(() => !!P())() && E();
       },
       get children() {
-        var t = B(), v = r.setFloating;
-        return typeof v == "function" ? p(v, t) : r.setFloating = t, u(t, () => e.message), P((l) => {
-          var h = H("smwb-tooltip", e.class), x = r.floatingStyles();
-          return h !== l.e && R(t, l.e = h), l.t = S(t, x, l.t), l;
+        var o = re(), k = l.setFloating;
+        return typeof k == "function" ? g(k, o) : l.setFloating = o, d(o, () => e.message), X((i) => {
+          var O = K("smwb-tooltip", e.class), A = l.floatingStyles();
+          return O !== i.e && Y(o, i.e = O), i.t = H(o, A, i.t), i;
         }, {
           e: void 0,
           t: void 0
-        }), t;
+        }), o;
       }
-    }), null), a;
+    }), null), t;
   })();
 }
-A(["click"]);
+j(["focusin", "focusout", "click"]);
 export {
-  oe as Tooltip
+  de as Tooltip
 };
 //# sourceMappingURL=tooltip.js.map

package/dist/components/feedBack/tooltip/tooltip.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"tooltip.js","sources":["../../../../src/components/feedBack/tooltip/tooltip.tsx"],"sourcesContent":["import { type JSX, type ParentProps, Show, createSignal, mergeProps, onCleanup, splitProps } from \"solid-js\";\nimport cn from \"clsx\";\nimport { flip, offset as offsetMiddleware, shift } from \"@floating-ui/dom\";\nimport { type Placement, resolvePlacement } from \"../../../utils/floating\";\nimport { createFloating } from \"../../../primitives/createFloating\";\nimport { mergeRefs, type Ref } from \"../../../primitives/mergeRefs\";\n\nexport type TooltipTrigger = \"hover\" \| \"click\" \| \"manual\";\n\nexport interface TooltipProps {\n class?: string;\n offset?: {\n offsetX?: number;\n offsetY?: number;\n };\n message: JSX.Element;\n placement?: Placement;\n /** Controls tooltip visibility when trigger is manual. /\n open?: boolean;\n /* hover (default): show on pointer enter; click: toggle; manual: use open only. */\n trigger?: TooltipTrigger;\n openDelay?: number;\n closeDelay?: number;\n ref?: Ref<HTMLDivElement>;\n}\n\nexport function Tooltip(props: ParentProps<TooltipProps>): JSX.Element {\n const merged = mergeProps(\n {\n placement: \"top\" as Placement,\n offset: { offsetX: 0, offsetY: 0 },\n trigger: \"hover\" as TooltipTrigger,\n openDelay: 0,\n closeDelay: 0,\n },\n props\n );\n const [local] = splitProps(merged, [\n \"class\",\n \"children\",\n \"placement\",\n \"offset\",\n \"message\",\n \"open\",\n \"trigger\",\n \"openDelay\",\n \"closeDelay\",\n \"ref\",\n ]);\n\n const [hoverOpen, setHoverOpen] = createSignal(false);\n const [clickOpen, setClickOpen] = createSignal(false);\n let openTimer: ReturnType<typeof setTimeout> \| null = null;\n let closeTimer: ReturnType<typeof setTimeout> \| null = null;\n\n const clearTimers = (): void => {\n if (openTimer !== null) {\n clearTimeout(openTimer);\n openTimer = null;\n }\n if (closeTimer !== null) {\n clearTimeout(closeTimer);\n closeTimer = null;\n }\n };\n onCleanup(clearTimers);\n\n const scheduleOpen = (): void => {\n clearTimers();\n if (local.openDelay <= 0) {\n setHoverOpen(true);\n return;\n }\n openTimer = setTimeout(() => setHoverOpen(true), local.openDelay);\n };\n const scheduleClose = (): void => {\n clearTimers();\n if (local.closeDelay <= 0) {\n setHoverOpen(false);\n return;\n }\n closeTimer = setTimeout(() => setHoverOpen(false), local.closeDelay);\n };\n\n const resolved = () => resolvePlacement(local.placement);\n const floating = createFloating({\n placement: () => resolved().placement,\n middleware: () => [\n offsetMiddleware({ mainAxis: local.offset?.offsetY ?? 0, crossAxis: local.offset?.offsetX ?? 0 }),\n // A fixed placement turns to the other side, and slides along it, when the\n // viewport has no room for it.\n ...(resolved().autoMiddleware ? [resolved().autoMiddleware] : [flip(), shift({ padding: 8 })]),\n ],\n });\n\n const isVisible = (): boolean =>\n local.trigger === \"manual\" ? local.open === true : local.trigger === \"click\" ? clickOpen() : hoverOpen();\n\n return (\n <div class=\"smwb-tooltip__wrapper\" role=\"tooltip\" ref={mergeRefs(local.ref)}>\n <div\n class=\"smwb-tooltip__ref\"\n ref={floating.setReference}\n onPointerEnter={local.trigger === \"hover\" ? scheduleOpen : undefined}\n onPointerLeave={local.trigger === \"hover\" ? scheduleClose : undefined}\n onClick={local.trigger === \"click\" ? () => setClickOpen((prev) => !prev) : undefined}\n >\n {local.children}\n </div>\n <Show when={isVisible()}>\n <div ref={floating.setFloating} class={cn(\"smwb-tooltip\", local.class)} style={floating.floatingStyles()}>\n {local.message}\n </div>\n </Show>\n </div>\n );\n}\n\nexport default Tooltip;\n"],"names":["Tooltip","props","merged","mergeProps","placement","offset","offsetX","offsetY","trigger","openDelay","closeDelay","local","splitProps","hoverOpen","setHoverOpen","createSignal","clickOpen","setClickOpen","openTimer","closeTimer","clearTimers","clearTimeout","onCleanup","scheduleOpen","setTimeout","scheduleClose","resolved","resolvePlacement","floating","createFloating","middleware","offsetMiddleware","mainAxis","crossAxis","autoMiddleware","flip","shift","padding","isVisible","open","_el$","_tmpl$2","_el$2","firstChild","_ref$","mergeRefs","ref","_$use","_$addEventListener","prev","undefined","_ref$2","setReference","_$insert","children","_$createComponent","Show","when","_el$3","_tmpl$","_ref$3","setFloating","message","_$effect","_p$","_v$","cn","class","_v$2","floatingStyles","e","_$className","t","_$style","_$delegateEvents"],"mappings":"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"}
1	+ {"version":3,"file":"tooltip.js","sources":["../../../../src/components/feedBack/tooltip/tooltip.tsx"],"sourcesContent":["import { type JSX, type ParentProps, Show, createSignal, mergeProps, onCleanup, onMount, splitProps } from \"solid-js\";\nimport cn from \"clsx\";\nimport { flip, offset as offsetMiddleware, shift } from \"@floating-ui/dom\";\nimport { type Placement, resolvePlacement } from \"../../../utils/floating\";\nimport { createFloating } from \"../../../primitives/createFloating\";\nimport { mergeRefs, type Ref } from \"../../../primitives/mergeRefs\";\nimport { createDismissOnEscape } from \"../../../primitives/createDismissOnEscape\";\n\nexport type TooltipTrigger = \"hover\" \| \"click\" \| \"manual\";\n\nexport interface TooltipProps {\n class?: string;\n offset?: {\n offsetX?: number;\n offsetY?: number;\n };\n /** What the tip says: text or markup. /\n message: JSX.Element;\n placement?: Placement;\n /* Controls tooltip visibility when trigger is manual. /\n open?: boolean;\n /\n What shows the tooltip. `hover` (default): the pointer over the target or keyboard focus\n * in it, until both have left. Keyboard focus is focus with a focus ring (`:focus-visible`),\n * not the focus a mouse press gives a button. `click`: a click on the target shows or hides\n * it. `manual`: `open` alone. Escape hides a `hover` or `click` tooltip.\n /\n trigger?: TooltipTrigger;\n /* Milliseconds from the pointer entering the target, or keyboard focus moving into it, until a hover tooltip shows. /\n openDelay?: number;\n /* Milliseconds from the pointer and keyboard focus both leaving the target until a hover tooltip hides. /\n closeDelay?: number;\n ref?: Ref<HTMLDivElement>;\n}\n\n/\n Whether focus on `element` draws a focus ring (`:focus-visible`): focus from the keyboard,\n * not the focus a mouse press gives a button. An engine without the selector counts any focus.\n */\nfunction hasFocusRing(element: Element): boolean {\n try {\n return element.matches(\":focus-visible\");\n } catch {\n return true;\n }\n}\n\nexport function Tooltip(props: ParentProps<TooltipProps>): JSX.Element {\n const merged = mergeProps(\n {\n placement: \"top\" as Placement,\n offset: { offsetX: 0, offsetY: 0 },\n trigger: \"hover\" as TooltipTrigger,\n openDelay: 0,\n closeDelay: 0,\n },\n props\n );\n const [local] = splitProps(merged, [\n \"class\",\n \"children\",\n \"placement\",\n \"offset\",\n \"message\",\n \"open\",\n \"trigger\",\n \"openDelay\",\n \"closeDelay\",\n \"ref\",\n ]);\n\n const [hoverOpen, setHoverOpen] = createSignal(false);\n const [clickOpen, setClickOpen] = createSignal(false);\n let openTimer: ReturnType<typeof setTimeout> \| null = null;\n let closeTimer: ReturnType<typeof setTimeout> \| null = null;\n // The pointer over the target and keyboard focus in it each keep a hover tooltip shown.\n let pointerInside = false;\n let focusInside = false;\n\n const clearTimers = (): void => {\n if (openTimer !== null) {\n clearTimeout(openTimer);\n openTimer = null;\n }\n if (closeTimer !== null) {\n clearTimeout(closeTimer);\n closeTimer = null;\n }\n };\n onCleanup(clearTimers);\n\n const scheduleOpen = (): void => {\n clearTimers();\n if (local.openDelay <= 0) {\n setHoverOpen(true);\n return;\n }\n openTimer = setTimeout(() => setHoverOpen(true), local.openDelay);\n };\n const scheduleClose = (): void => {\n clearTimers();\n if (local.closeDelay <= 0) {\n setHoverOpen(false);\n return;\n }\n closeTimer = setTimeout(() => setHoverOpen(false), local.closeDelay);\n };\n\n // Escape hides a tooltip shown on hover or focus wherever focus is (WCAG 1.4.13), and the\n // window, panel, Modal or Sheet around it stays open until the next press. Focus left in\n // the target no longer keeps it: the pointer alone shows and hides it until focus moves.\n createDismissOnEscape(\n () => local.trigger === \"hover\" && hoverOpen(),\n () => {\n clearTimers();\n focusInside = false;\n setHoverOpen(false);\n }\n );\n // A click tooltip hides on Escape the same way.\n createDismissOnEscape(\n () => local.trigger === \"click\" && clickOpen(),\n () => setClickOpen(false)\n );\n\n const resolved = () => resolvePlacement(local.placement);\n const floating = createFloating({\n placement: () => resolved().placement,\n middleware: () => [\n offsetMiddleware({ mainAxis: local.offset?.offsetY ?? 0, crossAxis: local.offset?.offsetX ?? 0 }),\n // A fixed placement turns to the other side, and slides along it, when the\n // viewport has no room for it.\n ...(resolved().autoMiddleware ? [resolved().autoMiddleware] : [flip(), shift({ padding: 8 })]),\n ],\n });\n\n const isVisible = (): boolean =>\n local.trigger === \"manual\" ? local.open === true : local.trigger === \"click\" ? clickOpen() : hoverOpen();\n\n // The tip mounts in the browser, after hydration, as in React: its place is\n // measured there, and a tip drawn by the server would cover its trigger.\n const [mounted, setMounted] = createSignal(false);\n onMount(() => setMounted(true));\n\n // Solid binds event handlers once, so they are always attached and check\n // `trigger` themselves: it can change after the tooltip renders.\n const onPointerEnter = (): void => {\n pointerInside = true;\n if (local.trigger === \"hover\") scheduleOpen();\n };\n const onPointerLeave = (): void => {\n pointerInside = false;\n if (local.trigger === \"hover\" && !focusInside) scheduleClose();\n };\n // focusin/focusout, as Solid's onFocus/onBlur don't bubble from the controls inside. Focus\n // without a focus ring doesn't count: the focus a mouse press gives a button would keep the\n // tooltip shown after the pointer leaves.\n const onFocusIn: JSX.EventHandler<HTMLDivElement, FocusEvent> = (event) => {\n // Focus in a portal the target renders (a menu, a picker panel) reaches here through the\n // portal's host, but it is not in the target.\n if (!event.currentTarget.contains(event.target)) return;\n focusInside = hasFocusRing(event.target);\n if (local.trigger === \"hover\" && focusInside) scheduleOpen();\n };\n const onFocusOut: JSX.EventHandler<HTMLDivElement, FocusEvent> = (event) => {\n // Focus moving to another control in the target keeps the tooltip.\n if (event.relatedTarget instanceof Node && event.currentTarget.contains(event.relatedTarget)) return;\n focusInside = false;\n if (local.trigger === \"hover\" && !pointerInside) scheduleClose();\n };\n const onClick = (): void => {\n if (local.trigger === \"click\") setClickOpen((prev) => !prev);\n };\n\n return (\n <div class=\"smwb-tooltip__wrapper\" role=\"tooltip\" ref={mergeRefs(local.ref)}>\n <div\n class=\"smwb-tooltip__ref\"\n ref={floating.setReference}\n onPointerEnter={onPointerEnter}\n onPointerLeave={onPointerLeave}\n onFocusIn={onFocusIn}\n onFocusOut={onFocusOut}\n onClick={onClick}\n >\n {local.children}\n </div>\n <Show when={mounted() && isVisible()}>\n <div ref={floating.setFloating} class={cn(\"smwb-tooltip\", local.class)} style={floating.floatingStyles()}>\n {local.message}\n </div>\n </Show>\n </div>\n );\n}\n\nexport default Tooltip;\n"],"names":["hasFocusRing","element","matches","Tooltip","props","merged","mergeProps","placement","offset","offsetX","offsetY","trigger","openDelay","closeDelay","local","splitProps","hoverOpen","setHoverOpen","createSignal","clickOpen","setClickOpen","openTimer","closeTimer","pointerInside","focusInside","clearTimers","clearTimeout","onCleanup","scheduleOpen","setTimeout","scheduleClose","createDismissOnEscape","resolved","resolvePlacement","floating","createFloating","middleware","offsetMiddleware","mainAxis","crossAxis","autoMiddleware","flip","shift","padding","isVisible","open","mounted","setMounted","onMount","onPointerEnter","onPointerLeave","onFocusIn","event","currentTarget","contains","target","onFocusOut","relatedTarget","Node","onClick","prev","_el$","_tmpl$2","_el$2","firstChild","_ref$","mergeRefs","ref","_$use","$$click","$$focusout","$$focusin","addEventListener","_ref$2","setReference","_$insert","children","_$createComponent","Show","when","_$memo","_el$3","_tmpl$","_ref$3","setFloating","message","_$effect","_p$","_v$","cn","class","_v$2","floatingStyles","e","_$className","t","_$style","undefined","_$delegateEvents"],"mappings":"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"}

package/dist/components/inputs/button/button.d.ts CHANGED Viewed

@@ -26,6 +26,8 @@ export interface ButtonProps extends JSX.HTMLAttributes<HTMLButtonElement | HTML
     rippleCenter?: boolean;
     /** Disable the ripple effect. */
     disableRipple?: boolean;
+    /** Test id of the root; `button`, or `button-link` for a link, unless given. */
+    "data-testid"?: string | undefined;
     ref?: Ref<HTMLButtonElement | HTMLAnchorElement>;
 }
 export declare function Button(props: ParentProps<ButtonProps>): JSX.Element;

package/dist/components/inputs/button/button.js CHANGED Viewed

@@ -1,15 +1,16 @@
 import { createComponent as n, use as b, spread as g, mergeProps as l, insert as h, template as _, memo as w } from "solid-js/web";
 import '../../../assets/styles/less/components/button/button.entry.css';import '../../../assets/styles/less/tokens.entry.css';/* empty css                                     */
 /* empty css                                                       */
-import { mergeProps as z, splitProps as T, children as W, Show as s } from "solid-js";
-import k from "clsx";
-import { mergeRefs as v } from "../../../primitives/mergeRefs.js";
-import { useButtonGroup as C } from "../buttonGroups/buttonGroupContext.js";
-import { Ripple as D } from "../../base/ripple/ripple.js";
-import { Icon as B } from "../../base/icon/icon.js";
-var x = /* @__PURE__ */ _("<a data-testid=button-link>"), A = /* @__PURE__ */ _("<button data-testid=button>");
-function K($) {
-  const t = C(), P = z({
+import { mergeProps as D, splitProps as z, children as T, Show as s } from "solid-js";
+import W from "clsx";
+import { mergeRefs as P } from "../../../primitives/mergeRefs.js";
+import { useButtonGroup as k } from "../buttonGroups/buttonGroupContext.js";
+import { callHandler as C } from "../../../primitives/callHandler.js";
+import { Ripple as B } from "../../base/ripple/ripple.js";
+import { Icon as x } from "../../base/icon/icon.js";
+var A = /* @__PURE__ */ _("<a>"), E = /* @__PURE__ */ _("<button>");
+function M($) {
+  const t = k(), v = D({
     get variant() {
       return t?.variant ?? "contained";
     },
@@ -19,16 +20,35 @@ function K($) {
     get colorTheme() {
       return t?.colorTheme ?? "primary";
     }
-  }, $), [e, a] = T(P, ["label", "variant", "icon", "iconProps", "href", "class", "disabled", "children", "fullWidth", "rippleCenter", "disableRipple", "size", "colorTheme", "color", "ref"]), c = () => e.color ?? t?.color ?? e.colorTheme, i = () => e.disabled ?? t?.disabled, y = () => e.fullWidth ?? t?.fullWidth;
+  }, $), [e, a] = z(v, [
+    "label",
+    "variant",
+    "icon",
+    "iconProps",
+    "href",
+    "class",
+    "disabled",
+    "children",
+    "fullWidth",
+    "rippleCenter",
+    "disableRipple",
+    // The button sets this on its root too; its own handler calls the caller's first.
+    "onPointerDown",
+    "size",
+    "colorTheme",
+    "color",
+    "ref",
+    "data-testid"
+  ]), c = () => e.color ?? t?.color ?? e.colorTheme, i = () => e.disabled ?? t?.disabled, y = () => e.fullWidth ?? t?.fullWidth;
   let m;
-  const p = () => k("smwb-button", `smwb-${e.variant}`, `smwb-${e.size}`, c() === "primary" ? "smwb-primary" : `smwb-button_color-${c()}`, t && "smwb-button-group__grouped", e.class, {
+  const p = () => W("smwb-button", `smwb-${e.variant}`, `smwb-${e.size}`, c() === "primary" ? "smwb-primary" : `smwb-button_color-${c()}`, t && "smwb-button-group__grouped", e.class, {
     "smwb-disabled": i(),
     "smwb-full-width": y()
   }), u = (r) => {
-    i() || m?.onRipple(r);
-  }, d = W(() => e.icon), R = () => {
+    C(e.onPointerDown, r), i() || m?.onRipple(r);
+  }, d = T(() => e.icon), R = () => {
     const r = d();
-    return typeof r == "string" ? n(B, l(() => e.iconProps ?? {}, {
+    return typeof r == "string" ? n(x, l(() => e.iconProps ?? {}, {
       name: r
     })) : r;
   }, f = () => [n(s, {
@@ -43,7 +63,7 @@ function K($) {
       return !e.disableRipple;
     },
     get children() {
-      return n(D, {
+      return n(B, {
         actionRef: (r) => m = r,
         get center() {
           return e.rippleCenter;
@@ -57,8 +77,12 @@ function K($) {
     },
     get fallback() {
       return (() => {
-        var r = A(), o = v(e.ref);
-        return typeof o == "function" && b(o, r), g(r, l(a, {
+        var r = E(), o = P(e.ref);
+        return typeof o == "function" && b(o, r), g(r, l({
+          get "data-testid"() {
+            return e["data-testid"] ?? "button";
+          }
+        }, a, {
           get class() {
             return p();
           },
@@ -70,8 +94,12 @@ function K($) {
       })();
     },
     get children() {
-      var r = x(), o = v(e.ref);
-      return typeof o == "function" && b(o, r), g(r, l(a, {
+      var r = A(), o = P(e.ref);
+      return typeof o == "function" && b(o, r), g(r, l({
+        get "data-testid"() {
+          return e["data-testid"] ?? "button-link";
+        }
+      }, a, {
         get class() {
           return p();
         },
@@ -86,6 +114,6 @@ function K($) {
   });
 }
 export {
-  K as Button
+  M as Button
 };
 //# sourceMappingURL=button.js.map

package/dist/components/inputs/button/button.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"button.js","sources":["../../../../src/components/inputs/button/button.tsx"],"sourcesContent":["import { type JSX, type ParentProps, Show, children, mergeProps, splitProps } from \"solid-js\";\nimport cn from \"clsx\";\nimport { Ripple, type RippleActionsRef } from \"../../base/ripple\";\nimport { Icon, type IconProps } from \"../../base/icon\";\nimport { mergeRefs, type Ref } from \"../../../primitives/mergeRefs\";\nimport { useButtonGroup } from \"../buttonGroups/buttonGroupContext\";\n\nexport interface ButtonProps extends JSX.HTMLAttributes<HTMLButtonElement \| HTMLAnchorElement> {\n /** Button text. /\n label?: string;\n /* Visual style of the button. /\n variant?: \"contained\" \| \"text\" \| \"outlined\";\n /* Button size. /\n size?: \"small\" \| \"medium\" \| \"large\";\n /* Icon as an element (e.g. <Icon/>) or a string (icon name / url / base64). /\n icon?: JSX.Element \| string;\n /* Props forwarded to the <Icon/> when `icon` is a string. /\n iconProps?: Omit<IconProps, \"name\">;\n /* @deprecated use `color`. Kept for backward compatibility. /\n colorTheme?: \"primary\";\n /* Semantic color, resolved through `--smwb-Color` tokens. /\n color?: \"primary\" \| \"secondary\" \| \"error\" \| \"success\" \| \"warning\" \| \"info\";\n /* When set, the component renders as an <a>. /\n href?: string;\n disabled?: boolean;\n type?: \"button\" \| \"submit\" \| \"reset\";\n /* Stretch to the full width of the container. /\n fullWidth?: boolean;\n /* Center the ripple effect. /\n rippleCenter?: boolean;\n /* Disable the ripple effect. */\n disableRipple?: boolean;\n ref?: Ref<HTMLButtonElement \| HTMLAnchorElement>;\n}\n\nexport function Button(props: ParentProps<ButtonProps>): JSX.Element {\n const group = useButtonGroup();\n const merged = mergeProps(\n {\n get variant(): NonNullable<ButtonProps[\"variant\"]> {\n return group?.variant ?? \"contained\";\n },\n get size(): NonNullable<ButtonProps[\"size\"]> {\n return group?.size ?? \"medium\";\n },\n get colorTheme(): NonNullable<ButtonProps[\"colorTheme\"]> {\n return group?.colorTheme ?? \"primary\";\n },\n },\n props\n );\n const [local, rest] = splitProps(merged, [\n \"label\",\n \"variant\",\n \"icon\",\n \"iconProps\",\n \"href\",\n \"class\",\n \"disabled\",\n \"children\",\n \"fullWidth\",\n \"rippleCenter\",\n \"disableRipple\",\n \"size\",\n \"colorTheme\",\n \"color\",\n \"ref\",\n ]);\n\n const color = (): string => local.color ?? group?.color ?? local.colorTheme;\n const disabled = (): boolean \| undefined => local.disabled ?? group?.disabled;\n const fullWidth = (): boolean \| undefined => local.fullWidth ?? group?.fullWidth;\n let rippleActions: RippleActionsRef \| undefined;\n\n const classes = (): string =>\n cn(\n \"smwb-button\",\n `smwb-${local.variant}`,\n `smwb-${local.size}`,\n color() === \"primary\" ? \"smwb-primary\" : `smwb-button_color-${color()}`,\n group && \"smwb-button-group__grouped\",\n local.class,\n {\n \"smwb-disabled\": disabled(),\n \"smwb-full-width\": fullWidth(),\n }\n );\n\n // Ripple on pointerdown so it fires for touch and pen, not just mouse.\n const onPointerDown = (event~~: PointerEvent~~): ~~void~~ => {\n if (!disabled()) {\n rippleActions?.onRipple(event);\n }\n };\n\n // Read the icon once: markup passed as a prop is created anew on every read,\n // and during hydration the copy made for a <Show> test has no server DOM node.\n const icon = children(() => local.icon);\n const iconElement = (): JSX.Element => {\n const resolved = icon();\n return typeof resolved === \"string\" ? <Icon {...(local.iconProps ?? {})} name={resolved} /> : resolved;\n };\n\n const content = (): JSX.Element => (\n <>\n <Show when={icon()}>{iconElement()}</Show>\n {local.label ? local.label : local.children}\n <Show when={!local.disableRipple}>\n <Ripple actionRef={(actions) => (rippleActions = actions)} center={local.rippleCenter} />\n </Show>\n </>\n );\n\n return (\n <Show\n when={local.href}\n fallback={\n <button\n data-testid=\"button\"\n {...rest}\n ref={mergeRefs(local.ref)}\n class={classes()}\n onPointerDown={onPointerDown}\n disabled={!!disabled()}\n >\n {content()}\n </button>\n }\n >\n <a\n data-testid=\"button-link\"\n {...rest}\n ref={mergeRefs(local.ref)}\n class={classes()}\n href={local.href}\n target=\"_blank\"\n rel=\"noreferrer\"\n onPointerDown={onPointerDown}\n >\n {content()}\n </a>\n </Show>\n );\n}\n\nexport default Button;\n"],"names":["Button","props","group","useButtonGroup","merged","mergeProps","variant","size","colorTheme","local","rest","splitProps","color","disabled","fullWidth","rippleActions","classes","cn","class","onPointerDown","event","onRipple","icon","children","iconElement","resolved","_$createComponent","Icon","_$mergeProps","iconProps","name","content","Show","when","_$memo","label","disableRipple","Ripple","actionRef","actions","center","rippleCenter","href","fallback","_el$2","_tmpl$2","_ref$2","mergeRefs","ref","_$use","_$spread","_$insert","_el$","_tmpl$","_ref$"],"mappings":"~~;;;;;;;;;;AAqCO~~,SAASA,EAAOC,GAA8C;AACnE,QAAMC,IAAQC,EAAAA,GACRC,IAASC,EACb;AAAA,IACE,IAAIC,UAA+C;AACjD,aAAOJ,GAAOI,WAAW;AAAA,IAC3B;AAAA,IACA,IAAIC,OAAyC;AAC3C,aAAOL,GAAOK,QAAQ;AAAA,IACxB;AAAA,IACA,IAAIC,aAAqD;AACvD,aAAON,GAAOM,cAAc;AAAA,IAC9B;AAAA,EAAA,GAEFP,CACF,GACM,CAACQ,GAAOC,CAAI,IAAIC,EAAWP,GAAQ,~~CACvC~~,~~SACA~~,~~WACA~~,~~QACA~~,~~aACA~~,~~QACA~~,~~SACA~~,~~YACA~~,~~YACA~~,~~aACA~~,~~gBACA~~,~~iBACA~~,~~QACA~~,~~cACA~~,~~SACA~~,~~KAAK~~,~~CACN~~,GAEKQ,IAAQA,MAAcH,EAAMG,SAASV,GAAOU,SAASH,EAAMD,YAC3DK,IAAWA,MAA2BJ,EAAMI,YAAYX,GAAOW,UAC/DC,IAAYA,MAA2BL,EAAMK,aAAaZ,GAAOY;AACvE,MAAIC;AAEJ,QAAMC,IAAUA,MACdC,EACE,eACA,QAAQR,EAAMH,OAAO,IACrB,QAAQG,EAAMF,IAAI,IAClBK,QAAY,YAAY,iBAAiB,qBAAqBA,GAAO,IACrEV,KAAS,8BACTO,EAAMS,OACN;AAAA,IACE,iBAAiBL,EAAAA;AAAAA,IACjB,mBAAmBC,EAAAA;AAAAA,EAAU,CAEjC,GAGIK,~~IAAgBA~~,~~CAACC~~,~~MAA8B~~;~~AACnD~~,~~IAAKP~~,OACHE,~~GAAeM~~,~~SAASD~~,CAAK;AAAA,EAEjC,~~GAIME~~,IAAOC,EAAS,~~MAAMd~~,~~EAAMa~~,IAAI,GAChCE,IAAcA,MAAmB;AACrC,UAAMC,IAAWH,EAAAA;AACjB,WAAO,OAAOG,KAAa,WAAQC,EAAIC,GAAIC,~~QAAMnB~~,~~EAAMoB~~,aAAa,IAAE;AAAA,MAAGC,MAAML;AAAAA,IAAAA,CAAQ,CAAA,IAAOA;AAAAA,EAChG,GAEMM,IAAUA,MAAe,CAAAL,EAE1BM,GAAI;AAAA,IAAA,IAACC,OAAI;AAAA,aAAEX,EAAAA;AAAAA,IAAM;AAAA,IAAA,IAAAC,WAAA;AAAA,aAAGC,EAAAA;AAAAA,IAAa;AAAA,EAAA,CAAA,GAAAU,EAAA,MACjCA,~~UAAAzB~~,~~EAAM0B~~,KAAK,EAAA,~~IAAG1B~~,~~EAAM0B~~,~~QAAQ1B~~,~~EAAMc~~,QAAQ,GAAAG,EAC1CM,GAAI;AAAA,IAAA,IAACC,OAAI;AAAA,aAAE,~~CAACxB~~,~~EAAM2B~~;AAAAA,IAAa;AAAA,IAAA,IAAAb,WAAA;AAAA,aAAAG,EAC7BW,GAAM;AAAA,QAACC,WAAYC,~~OAAaxB~~,~~IAAgBwB~~;AAAAA,QAAQ,IAAEC,SAAM;AAAA,~~iBAAE/B~~,~~EAAMgC~~;AAAAA,QAAY;AAAA,MAAA,CAAA;AAAA,IAAA;AAAA,EAAA,CAAA,CAAA;AAK3F,SAAAf,EACGM,GAAI;AAAA,IAAA,IACHC,OAAI;AAAA,~~aAAExB~~,~~EAAMiC~~;AAAAA,IAAI;AAAA,IAAA,IAChBC,WAAQ;AAAA,cAAA,MAAA;AAAA,YAAAC,IAAAC,EAAAA,GAAAC,IAICC,~~EAAUtC~~,~~EAAMuC~~,GAAG;AAAC,sBAAAF,KAAA,cAAAG,EAAAH,GAAAF,CAAA,GAAAM,EAAAN,GAAAhB,~~EADrBlB~~,GAAI;AAAA,UAAA,IAAA,QAAA;AAAA,mBAEDM,EAAAA;AAAAA,UAAS;AAAA,UAAA,eACDG;AAAAA,UAAa,IAC5BN,WAAQ;AAAA,mBAAE,CAAC,CAACA,EAAAA;AAAAA,UAAU;AAAA,QAAA,CAAA,GAAA,IAAA,EAAA,~~GAAAsC~~,EAAAP,GAErBb,CAAO,GAAAa;AAAAA,MAAA,GAAA;AAAA,IAAA;AAAA,IAAA,IAAArB,WAAA;AAAA,UAAA6B,IAAAC,EAAAA,GAAAC,IAOLP,~~EAAUtC~~,~~EAAMuC~~,GAAG;AAAC,oBAAAM,KAAA,cAAAL,EAAAK,GAAAF,CAAA,GAAAF,EAAAE,GAAAxB,~~EADrBlB~~,GAAI;AAAA,QAAA,IAAA,QAAA;AAAA,iBAEDM,EAAAA;AAAAA,QAAS;AAAA,QAAA,~~IAChB0B~~,OAAI;AAAA,~~iBAAEjC~~,~~EAAMiC~~;AAAAA,QAAI;AAAA,QAAA,QACT;AAAA,QAAQ,KACX;AAAA,QAAY,~~eACDvB~~;AAAAA,MAAAA,CAAa,GAAA,IAAA,EAAA,~~GAAAgC~~,EAAAC,GAE3BrB,CAAO,GAAAqB;AAAAA,IAAA;AAAA,EAAA,CAAA;AAIhB;"}
1	+ {"version":3,"file":"button.js","sources":["../../../../src/components/inputs/button/button.tsx"],"sourcesContent":["import { type JSX, type ParentProps, Show, children, mergeProps, splitProps } from \"solid-js\";\nimport cn from \"clsx\";\nimport { Ripple, type RippleActionsRef } from \"../../base/ripple\";\nimport { Icon, type IconProps } from \"../../base/icon\";\nimport { mergeRefs, type Ref } from \"../../../primitives/mergeRefs\";\nimport { useButtonGroup } from \"../buttonGroups/buttonGroupContext\";\nimport { callHandler } from \"../../../primitives/callHandler\";\n\nexport interface ButtonProps extends JSX.HTMLAttributes<HTMLButtonElement \| HTMLAnchorElement> {\n /** Button text. /\n label?: string;\n /* Visual style of the button. /\n variant?: \"contained\" \| \"text\" \| \"outlined\";\n /* Button size. /\n size?: \"small\" \| \"medium\" \| \"large\";\n /* Icon as an element (e.g. <Icon/>) or a string (icon name / url / base64). /\n icon?: JSX.Element \| string;\n /* Props forwarded to the <Icon/> when `icon` is a string. /\n iconProps?: Omit<IconProps, \"name\">;\n /* @deprecated use `color`. Kept for backward compatibility. /\n colorTheme?: \"primary\";\n /* Semantic color, resolved through `--smwb-Color` tokens. /\n color?: \"primary\" \| \"secondary\" \| \"error\" \| \"success\" \| \"warning\" \| \"info\";\n /* When set, the component renders as an <a>. /\n href?: string;\n disabled?: boolean;\n type?: \"button\" \| \"submit\" \| \"reset\";\n /* Stretch to the full width of the container. /\n fullWidth?: boolean;\n /* Center the ripple effect. /\n rippleCenter?: boolean;\n /* Disable the ripple effect. /\n disableRipple?: boolean;\n /* Test id of the root; `button`, or `button-link` for a link, unless given. */\n \"data-testid\"?: string \| undefined;\n ref?: Ref<HTMLButtonElement \| HTMLAnchorElement>;\n}\n\nexport function Button(props: ParentProps<ButtonProps>): JSX.Element {\n const group = useButtonGroup();\n const merged = mergeProps(\n {\n get variant(): NonNullable<ButtonProps[\"variant\"]> {\n return group?.variant ?? \"contained\";\n },\n get size(): NonNullable<ButtonProps[\"size\"]> {\n return group?.size ?? \"medium\";\n },\n get colorTheme(): NonNullable<ButtonProps[\"colorTheme\"]> {\n return group?.colorTheme ?? \"primary\";\n },\n },\n props\n );\n const [local, rest] = splitProps(merged, [\n \"label\",\n \"variant\",\n \"icon\",\n \"iconProps\",\n \"href\",\n \"class\",\n \"disabled\",\n \"children\",\n \"fullWidth\",\n \"rippleCenter\",\n \"disableRipple\",\n // The button sets this on its root too; its own handler calls the caller's first.\n \"onPointerDown\",\n \"size\",\n \"colorTheme\",\n \"color\",\n \"ref\",\n \"data-testid\",\n ]);\n\n const color = (): string => local.color ?? group?.color ?? local.colorTheme;\n const disabled = (): boolean \| undefined => local.disabled ?? group?.disabled;\n const fullWidth = (): boolean \| undefined => local.fullWidth ?? group?.fullWidth;\n let rippleActions: RippleActionsRef \| undefined;\n\n const classes = (): string =>\n cn(\n \"smwb-button\",\n `smwb-${local.variant}`,\n `smwb-${local.size}`,\n color() === \"primary\" ? \"smwb-primary\" : `smwb-button_color-${color()}`,\n group && \"smwb-button-group__grouped\",\n local.class,\n {\n \"smwb-disabled\": disabled(),\n \"smwb-full-width\": fullWidth(),\n }\n );\n\n // Ripple on pointerdown so it fires for touch and pen, not just mouse.\n const onPointerDown: JSX.EventHandler<HTMLButtonElement \| HTMLAnchorElement, PointerEvent> = (event) => {\n callHandler(local.onPointerDown, event);\n if (!disabled()) {\n rippleActions?.onRipple(event);\n }\n };\n\n // Read the icon once: markup passed as a prop is created anew on every read,\n // and during hydration the copy made for a <Show> test has no server DOM node.\n const icon = children(() => local.icon);\n const iconElement = (): JSX.Element => {\n const resolved = icon();\n return typeof resolved === \"string\" ? <Icon {...(local.iconProps ?? {})} name={resolved} /> : resolved;\n };\n\n const content = (): JSX.Element => (\n <>\n <Show when={icon()}>{iconElement()}</Show>\n {local.label ? local.label : local.children}\n <Show when={!local.disableRipple}>\n <Ripple actionRef={(actions) => (rippleActions = actions)} center={local.rippleCenter} />\n </Show>\n </>\n );\n\n return (\n <Show\n when={local.href}\n fallback={\n <button\n data-testid={local[\"data-testid\"] ?? \"button\"}\n {...rest}\n ref={mergeRefs(local.ref)}\n class={classes()}\n onPointerDown={onPointerDown}\n disabled={!!disabled()}\n >\n {content()}\n </button>\n }\n >\n <a\n data-testid={local[\"data-testid\"] ?? \"button-link\"}\n {...rest}\n ref={mergeRefs(local.ref)}\n class={classes()}\n href={local.href}\n target=\"_blank\"\n rel=\"noreferrer\"\n onPointerDown={onPointerDown}\n >\n {content()}\n </a>\n </Show>\n );\n}\n\nexport default Button;\n"],"names":["Button","props","group","useButtonGroup","merged","mergeProps","variant","size","colorTheme","local","rest","splitProps","color","disabled","fullWidth","rippleActions","classes","cn","class","onPointerDown","event","callHandler","onRipple","icon","children","iconElement","resolved","_$createComponent","Icon","_$mergeProps","iconProps","name","content","Show","when","_$memo","label","disableRipple","Ripple","actionRef","actions","center","rippleCenter","href","fallback","_el$2","_tmpl$2","_ref$2","mergeRefs","ref","_$use","_$spread","_$insert","_el$","_tmpl$","_ref$"],"mappings":"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"}

package/dist/components/inputs/buttonGroups/buttonGroup.d.ts CHANGED Viewed

@@ -10,6 +10,8 @@ export interface ButtonGroupProps extends JSX.HTMLAttributes<HTMLDivElement> {
     colorTheme?: "primary";
     /** Semantic color propagated to child buttons. */
     color?: "primary" | "secondary" | "error" | "success" | "warning" | "info";
+    /** Test id of the root `<div>`; `button-group` unless given. */
+    "data-testid"?: string | undefined;
     ref?: Ref<HTMLDivElement>;
 }
 export declare function ButtonGroup(props: ParentProps<ButtonGroupProps>): JSX.Element;

package/dist/components/inputs/buttonGroups/buttonGroup.js CHANGED Viewed

@@ -1,4 +1,4 @@
-import { createComponent as a, use as s, spread as m, mergeProps as u, insert as d, template as p } from "solid-js/web";
+import { createComponent as l, use as s, spread as u, mergeProps as m, insert as d, template as p } from "solid-js/web";
 import '../../../assets/styles/less/components/buttonGroup/buttonGroup.entry.css';import '../../../assets/styles/less/tokens.entry.css';/* empty css                                     */
 /* empty css                                                                 */
 import { mergeProps as c, splitProps as f } from "solid-js";
@@ -6,15 +6,15 @@ import g from "clsx";
 import { mergeRefs as h } from "../../../primitives/mergeRefs.js";
 import { ButtonGroupContext as v } from "./buttonGroupContext.js";
 var b = /* @__PURE__ */ p("<div>");
-function x(o) {
-  const i = c({
+function x(i) {
+  const n = c({
     variant: "contained",
     size: "medium",
     orientation: "horizontal",
     colorTheme: "primary",
     fullWidth: !1,
     disabled: !1
-  }, o), [r, n] = f(i, ["class", "children", "variant", "size", "orientation", "colorTheme", "color", "fullWidth", "disabled", "ref"]), l = {
+  }, i), [r, t] = f(n, ["class", "children", "variant", "size", "orientation", "colorTheme", "color", "fullWidth", "disabled", "ref", "data-testid"]), a = {
     get variant() {
       return r.variant;
     },
@@ -34,16 +34,20 @@ function x(o) {
       return r.orientation === "vertical" ? !0 : r.fullWidth;
     }
   };
-  return a(v.Provider, {
-    value: l,
+  return l(v.Provider, {
+    value: a,
     get children() {
-      var e = b(), t = h(r.ref);
-      return typeof t == "function" && s(t, e), m(e, u(n, {
+      var e = b(), o = h(r.ref);
+      return typeof o == "function" && s(o, e), u(e, m(t, {
         get class() {
           return g("smwb-button-group", r.class, `smwb-${r.orientation}`, `smwb-${r.variant}`, r.fullWidth && "smwb-full-width");
         },
-        role: "group",
-        "data-testid": "button-group"
+        get role() {
+          return t.role ?? "group";
+        },
+        get "data-testid"() {
+          return r["data-testid"] ?? "button-group";
+        }
       }), !1, !0), d(e, () => r.children), e;
     }
   });

package/dist/components/inputs/buttonGroups/buttonGroup.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"buttonGroup.js","sources":["../../../../src/components/inputs/buttonGroups/buttonGroup.tsx"],"sourcesContent":["import { type JSX, type ParentProps, mergeProps, splitProps } from \"solid-js\";\nimport cn from \"clsx\";\nimport { mergeRefs, type Ref } from \"../../../primitives/mergeRefs\";\nimport { ButtonGroupContext, type ButtonGroupContextValue } from \"./buttonGroupContext\";\n\nexport interface ButtonGroupProps extends JSX.HTMLAttributes<HTMLDivElement> {\n orientation?: \"horizontal\" \| \"vertical\";\n variant?: \"contained\" \| \"text\" \| \"outlined\";\n size?: \"small\" \| \"medium\" \| \"large\";\n fullWidth?: boolean;\n disabled?: boolean;\n /** @deprecated use `color`. /\n colorTheme?: \"primary\";\n /* Semantic color propagated to child buttons. */\n color?: \"primary\" \| \"secondary\" \| \"error\" \| \"success\" \| \"warning\" \| \"info\";\n ref?: Ref<HTMLDivElement>;\n}\n\nexport function ButtonGroup(props: ParentProps<ButtonGroupProps>): JSX.Element {\n const merged = mergeProps(\n {\n variant: \"contained\" as const,\n size: \"medium\" as const,\n orientation: \"horizontal\" as const,\n colorTheme: \"primary\" as const,\n fullWidth: false,\n disabled: false,\n },\n props\n );\n const [local, rest] = splitProps(merged, [\n \"class\",\n \"children\",\n \"variant\",\n \"size\",\n \"orientation\",\n \"colorTheme\",\n \"color\",\n \"fullWidth\",\n \"disabled\",\n \"ref\",\n ]);\n\n const value: ButtonGroupContextValue = {\n get variant() {\n return local.variant;\n },\n get size() {\n return local.size;\n },\n get color() {\n return local.color;\n },\n get colorTheme() {\n return local.colorTheme;\n },\n get disabled() {\n return local.disabled;\n },\n get fullWidth() {\n return local.orientation === \"vertical\" ? true : local.fullWidth;\n },\n };\n\n return (\n <ButtonGroupContext.Provider value={value}>\n <div\n {...rest}\n ref={mergeRefs(local.ref)}\n class={cn(\n \"smwb-button-group\",\n local.class,\n `smwb-${local.orientation}`,\n `smwb-${local.variant}`,\n local.fullWidth && \"smwb-full-width\"\n )}\n role=\"group\"\n data-testid=\"button-group\"\n >\n {local.children}\n </div>\n </ButtonGroupContext.Provider>\n );\n}\n\nexport default ButtonGroup;\n"],"names":["ButtonGroup","props","merged","mergeProps","variant","size","orientation","colorTheme","fullWidth","disabled","local","rest","splitProps","value","color","_$createComponent","ButtonGroupContext","Provider","children","_el$","_tmpl$","_ref$","mergeRefs","ref","_$use","_$spread","_$mergeProps","cn","class","_$insert"],"mappings":";;;;;;;;~~AAoBO~~,SAASA,EAAYC,GAAmD;AAC7E,QAAMC,IAASC,EACb;AAAA,IACEC,SAAS;AAAA,IACTC,MAAM;AAAA,IACNC,aAAa;AAAA,IACbC,YAAY;AAAA,IACZC,WAAW;AAAA,IACXC,UAAU;AAAA,EAAA,GAEZR,CACF,GACM,CAACS,GAAOC,CAAI,IAAIC,EAAWV,GAAQ,CACvC,SACA,YACA,WACA,QACA,eACA,cACA,SACA,aACA,YACA,~~KAAK~~,~~CACN~~,GAEKW,IAAiC;AAAA,IACrC,IAAIT,UAAU;AACZ,aAAOM,EAAMN;AAAAA,IACf;AAAA,IACA,IAAIC,OAAO;AACT,aAAOK,EAAML;AAAAA,IACf;AAAA,IACA,IAAIS,QAAQ;AACV,aAAOJ,EAAMI;AAAAA,IACf;AAAA,IACA,IAAIP,aAAa;AACf,aAAOG,EAAMH;AAAAA,IACf;AAAA,IACA,IAAIE,WAAW;AACb,aAAOC,EAAMD;AAAAA,IACf;AAAA,IACA,IAAID,YAAY;AACd,aAAOE,EAAMJ,gBAAgB,aAAa,KAAOI,EAAMF;AAAAA,IACzD;AAAA,EAAA;AAGF,SAAAO,EACGC,EAAmBC,UAAQ;AAAA,IAACJ,OAAAA;AAAAA,IAAY,IAAAK,WAAA;AAAA,UAAAC,IAAAC,EAAAA,GAAAC,IAGhCC,EAAUZ,EAAMa,GAAG;AAAC,oBAAAF,KAAA,cAAAG,EAAAH,GAAAF,CAAA,GAAAM,EAAAN,GAAAO,EADrBf,GAAI;AAAA,QAAA,IAAA,QAAA;AAAA,iBAEDgB,EACL,qBACAjB,EAAMkB,OACN,QAAQlB,EAAMJ,WAAW,IACzB,QAAQI,EAAMN,OAAO,IACrBM,EAAMF,aAAa,iBACrB;AAAA,QAAC;AAAA,QAAA,~~MACI~~;AAAA,QAAO,~~eACA~~;AAAA,MAAA,~~CAAc~~,GAAA,IAAA,EAAA,~~GAAAqB~~,~~EAAAV~~,GAAA,~~MAEzBT~~,EAAMQ,QAAQ,GAAAC;AAAAA,IAAA;AAAA,EAAA,CAAA;AAIvB;"}
1	+ {"version":3,"file":"buttonGroup.js","sources":["../../../../src/components/inputs/buttonGroups/buttonGroup.tsx"],"sourcesContent":["import { type JSX, type ParentProps, mergeProps, splitProps } from \"solid-js\";\nimport cn from \"clsx\";\nimport { mergeRefs, type Ref } from \"../../../primitives/mergeRefs\";\nimport { ButtonGroupContext, type ButtonGroupContextValue } from \"./buttonGroupContext\";\n\nexport interface ButtonGroupProps extends JSX.HTMLAttributes<HTMLDivElement> {\n orientation?: \"horizontal\" \| \"vertical\";\n variant?: \"contained\" \| \"text\" \| \"outlined\";\n size?: \"small\" \| \"medium\" \| \"large\";\n fullWidth?: boolean;\n disabled?: boolean;\n /** @deprecated use `color`. /\n colorTheme?: \"primary\";\n /* Semantic color propagated to child buttons. /\n color?: \"primary\" \| \"secondary\" \| \"error\" \| \"success\" \| \"warning\" \| \"info\";\n /* Test id of the root `<div>`; `button-group` unless given. */\n \"data-testid\"?: string \| undefined;\n ref?: Ref<HTMLDivElement>;\n}\n\nexport function ButtonGroup(props: ParentProps<ButtonGroupProps>): JSX.Element {\n const merged = mergeProps(\n {\n variant: \"contained\" as const,\n size: \"medium\" as const,\n orientation: \"horizontal\" as const,\n colorTheme: \"primary\" as const,\n fullWidth: false,\n disabled: false,\n },\n props\n );\n const [local, rest] = splitProps(merged, [\n \"class\",\n \"children\",\n \"variant\",\n \"size\",\n \"orientation\",\n \"colorTheme\",\n \"color\",\n \"fullWidth\",\n \"disabled\",\n \"ref\",\n \"data-testid\",\n ]);\n\n const value: ButtonGroupContextValue = {\n get variant() {\n return local.variant;\n },\n get size() {\n return local.size;\n },\n get color() {\n return local.color;\n },\n get colorTheme() {\n return local.colorTheme;\n },\n get disabled() {\n return local.disabled;\n },\n get fullWidth() {\n return local.orientation === \"vertical\" ? true : local.fullWidth;\n },\n };\n\n return (\n <ButtonGroupContext.Provider value={value}>\n <div\n {...rest}\n ref={mergeRefs(local.ref)}\n class={cn(\n \"smwb-button-group\",\n local.class,\n `smwb-${local.orientation}`,\n `smwb-${local.variant}`,\n local.fullWidth && \"smwb-full-width\"\n )}\n // A default: the caller's own wins, and an explicit undefined keeps it.\n role={rest.role ?? \"group\"}\n data-testid={local[\"data-testid\"] ?? \"button-group\"}\n >\n {local.children}\n </div>\n </ButtonGroupContext.Provider>\n );\n}\n\nexport default ButtonGroup;\n"],"names":["ButtonGroup","props","merged","mergeProps","variant","size","orientation","colorTheme","fullWidth","disabled","local","rest","splitProps","value","color","_$createComponent","ButtonGroupContext","Provider","children","_el$","_tmpl$","_ref$","mergeRefs","ref","_$use","_$spread","_$mergeProps","cn","class","role","_$insert"],"mappings":";;;;;;;;AAsBO,SAASA,EAAYC,GAAmD;AAC7E,QAAMC,IAASC,EACb;AAAA,IACEC,SAAS;AAAA,IACTC,MAAM;AAAA,IACNC,aAAa;AAAA,IACbC,YAAY;AAAA,IACZC,WAAW;AAAA,IACXC,UAAU;AAAA,EAAA,GAEZR,CACF,GACM,CAACS,GAAOC,CAAI,IAAIC,EAAWV,GAAQ,CACvC,SACA,YACA,WACA,QACA,eACA,cACA,SACA,aACA,YACA,OACA,aAAa,CACd,GAEKW,IAAiC;AAAA,IACrC,IAAIT,UAAU;AACZ,aAAOM,EAAMN;AAAAA,IACf;AAAA,IACA,IAAIC,OAAO;AACT,aAAOK,EAAML;AAAAA,IACf;AAAA,IACA,IAAIS,QAAQ;AACV,aAAOJ,EAAMI;AAAAA,IACf;AAAA,IACA,IAAIP,aAAa;AACf,aAAOG,EAAMH;AAAAA,IACf;AAAA,IACA,IAAIE,WAAW;AACb,aAAOC,EAAMD;AAAAA,IACf;AAAA,IACA,IAAID,YAAY;AACd,aAAOE,EAAMJ,gBAAgB,aAAa,KAAOI,EAAMF;AAAAA,IACzD;AAAA,EAAA;AAGF,SAAAO,EACGC,EAAmBC,UAAQ;AAAA,IAACJ,OAAAA;AAAAA,IAAY,IAAAK,WAAA;AAAA,UAAAC,IAAAC,EAAAA,GAAAC,IAGhCC,EAAUZ,EAAMa,GAAG;AAAC,oBAAAF,KAAA,cAAAG,EAAAH,GAAAF,CAAA,GAAAM,EAAAN,GAAAO,EADrBf,GAAI;AAAA,QAAA,IAAA,QAAA;AAAA,iBAEDgB,EACL,qBACAjB,EAAMkB,OACN,QAAQlB,EAAMJ,WAAW,IACzB,QAAQI,EAAMN,OAAO,IACrBM,EAAMF,aAAa,iBACrB;AAAA,QAAC;AAAA,QAAA,IAEDqB,OAAI;AAAA,iBAAElB,EAAKkB,QAAQ;AAAA,QAAO;AAAA,QAAA,IAAA,gBAAA;AAAA,iBACbnB,EAAM,aAAa,KAAK;AAAA,QAAc;AAAA,MAAA,CAAA,GAAA,IAAA,EAAA,GAAAoB,EAAAX,GAAA,MAElDT,EAAMQ,QAAQ,GAAAC;AAAAA,IAAA;AAAA,EAAA,CAAA;AAIvB;"}

package/dist/components/inputs/checkbox/checkbox.d.ts CHANGED Viewed

@@ -9,10 +9,20 @@ export type SelectionChangeEvent = Event & {
 export interface CheckboxProps extends Omit<JSX.InputHTMLAttributes<HTMLInputElement>, "onChange" | "size"> {
     label?: string;
     disabled?: boolean;
+    /**
+     * Keeps the checkbox as it is: clicks on it or its label and Space change nothing, and `onChange` is not called.
+     * It stays focusable, and its input tells assistive technology it is read-only (`aria-readonly`).
+     */
     readOnly?: boolean;
     required?: boolean;
     name?: string;
     id?: string;
+    /**
+     * Shows the checkbox as partly checked, as for a "select all" over a partial selection: drawn with a dash and
+     * announced as "mixed" by screen readers, whatever `checked` is. A click does not clear it: the click toggles
+     * `checked` as usual and `onChange` reports the new `checked`, while the checkbox stays mixed until this prop turns
+     * false.
+     */
     indeterminate?: boolean;
     size?: SelectionControlSize;
     color?: SelectionControlColor;