@smwb/ui-solid 0.11.1 → 0.12.0

package/dist/components/feedBack/snackbar/snackbar.js

@@ -1,5 +1,6 @@
 import { createComponent as s, Dynamic as N, mergeProps as O, insert as C, memo as B, Portal as D, setAttribute as F, effect as I, className as L, template as b } from "solid-js/web";
-import '../../../assets/styles/less/components/snackbar/snackbar.entry.css';/* empty css                                                           */
+import '../../../assets/styles/less/components/snackbar/snackbar.entry.css';import '../../../assets/styles/less/tokens.entry.css';/* empty css                                     */
+/* empty css                                                           */
 import { mergeProps as S, splitProps as h, onMount as M, onCleanup as j, Show as w, createSignal as E, For as f, useContext as K, createContext as q } from "solid-js";
 import A from "clsx";
 import { createSnackbarsPortal as z } from "./useSnackbarsPortal.js";
@@ -28,11 +29,11 @@ const W = {
   exitActive: "smwb-snackbar-exit-active"
 };
 function X(t) {
-  const i = S({
+  const c = S({
     variant: "dark",
     position: "top-right",
     component: "div"
-  }, t), [e, m] = h(i, ["class", "message", "variant", "position", "onClick", "component", "isAutoClose", "autoCloseTime", "onClose", "action", "transitionClass", "ref"]);
+  }, t), [e, m] = h(c, ["class", "message", "variant", "position", "onClick", "component", "isAutoClose", "autoCloseTime", "onClose", "action", "transitionClass", "ref"]);
   let o;
   return M(() => {
     e.onClose && e.isAutoClose && e.autoCloseTime && (o = setTimeout(() => e.onClose?.(), e.autoCloseTime));
@@ -75,7 +76,7 @@ function X(t) {
   }));
 }
 function Y(t) {
-  const i = G({
+  const c = G({
     in: () => !0,
     appear: !0,
     timeout: {
@@ -102,7 +103,7 @@ function Y(t) {
       return t.snack.class;
     },
     get transitionClass() {
-      return i.classes();
+      return c.classes();
     },
     get isAutoClose() {
       return t.snack.autoClose ?? t.autoClose;
@@ -114,19 +115,19 @@ function Y(t) {
     onClose: () => t.onClose(t.snack.id)
   });
 }
-function se(t) {
-  const i = S({
+function ie(t) {
+  const c = S({
     position: "top-right",
     variant: "dark",
     autoClose: !0,
     autoCloseTime: 5e3,
     closeOnClick: !0,
     component: "div"
-  }, t), [e] = h(i, ["position", "variant", "class", "autoClose", "autoCloseTime", "closeOnClick", "onClick", "component", "children"]), [m, o] = E([]), a = z(), u = (n) => {
+  }, t), [e] = h(c, ["position", "variant", "class", "autoClose", "autoCloseTime", "closeOnClick", "onClick", "component", "children"]), [m, o] = E([]), a = z(), u = (n) => {
     const {
-      key: c,
+      key: i,
       ...r
-    } = n, l = c ?? `snack-${++V}`, g = {
+    } = n, l = i ?? `snack-${++V}`, g = {
       id: l,
       ...r
     };
@@ -137,7 +138,7 @@ function se(t) {
       return p[v] = g, p;
     }), l;
   }, k = (n) => {
-    o((c) => c.filter((r) => r.id !== n));
+    o((i) => i.filter((r) => r.id !== n));
   }, $ = () => {
     o([]);
   }, _ = () => {
@@ -148,9 +149,9 @@ function se(t) {
     e.closeOnClick && k(n);
   }, y = () => {
     const n = {};
-    for (const c of m()) {
-      const r = c.position ?? e.position;
-      (n[r] = n[r] ?? []).push(c);
+    for (const i of m()) {
+      const r = i.position ?? e.position;
+      (n[r] = n[r] ?? []).push(i);
     }
     return Object.entries(n);
   };
@@ -177,10 +178,10 @@ function se(t) {
                 get each() {
                   return y();
                 },
-                children: ([n, c]) => (() => {
+                children: ([n, i]) => (() => {
                   var r = U();
                   return F(r, "data-testid", `snackbars-${n}`), C(r, s(f, {
-                    each: c,
+                    each: i,
                     children: (l) => s(Y, {
                       snack: l,
                       get position() {
@@ -216,7 +217,7 @@ function ce() {
 }
 export {
   X as Snackbar,
-  se as SnackbarProvider,
+  ie as SnackbarProvider,
   ce as useSnackbar
 };
 //# sourceMappingURL=snackbar.js.map

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

@@ -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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"}
+{"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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"}

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

@@ -1,13 +1,14 @@
-import { use as f, addEventListener as m, insert as p, createComponent as F, effect as P, className as R, style as S, template as _, delegateEvents as A } from "solid-js/web";
-import '../../../assets/styles/less/components/tooltip/tooltip.entry.css';/* empty css                                                         */
-import { mergeProps as E, splitProps as X, createSignal as h, onCleanup as Y, Show as H } from "solid-js";
-import L from "clsx";
-import { offset as M } from "@floating-ui/dom";
-import { resolvePlacement as N } from "../../../utils/floating.js";
-import { createFloating as V } from "../../../primitives/createFloating.js";
-import { mergeRefs as j } from "../../../primitives/mergeRefs.js";
-var q = /* @__PURE__ */ _("<div>"), z = /* @__PURE__ */ _("<div class=smwb-tooltip__wrapper role=tooltip><div class=smwb-tooltip__ref>");
-function Z(w) {
+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 '../../../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({
     placement: "top",
     offset: {
@@ -17,44 +18,51 @@ function Z(w) {
     trigger: "hover",
     openDelay: 0,
     closeDelay: 0
-  }, w), [e] = X(D, ["class", "children", "placement", "offset", "message", "open", "trigger", "openDelay", "closeDelay", "ref"]), [T, n] = h(!1), [k, $] = h(!1);
-  let s = null, i = null;
+  }, 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 = () => {
-    s !== null && (clearTimeout(s), s = null), i !== null && (clearTimeout(i), i = null);
+    n !== null && (clearTimeout(n), n = null), s !== null && (clearTimeout(s), s = null);
   };
-  Y(c);
+  X(c);
   const C = () => {
     if (c(), e.openDelay <= 0) {
-      n(!0);
+      i(!0);
       return;
     }
-    s = setTimeout(() => n(!0), e.openDelay);
+    n = setTimeout(() => i(!0), e.openDelay);
   }, O = () => {
     if (c(), e.closeDelay <= 0) {
-      n(!1);
+      i(!1);
       return;
     }
-    i = setTimeout(() => n(!1), e.closeDelay);
-  }, u = () => N(e.placement), r = V({
-    placement: () => u().placement,
-    middleware: () => [M({
-      mainAxis: e.offset?.offsetY ?? 0,
-      crossAxis: e.offset?.offsetX ?? 0
-    }), u().autoMiddleware]
+    s = setTimeout(() => i(!1), e.closeDelay);
+  }, f = () => j(e.placement), r = q({
+    placement: () => f().placement,
+    middleware: () => [
+      L({
+        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({
+        padding: 8
+      })]
+    ]
   }), b = () => e.trigger === "manual" ? e.open === !0 : e.trigger === "click" ? k() : T();
   return (() => {
-    var a = z(), o = a.firstChild, g = j(e.ref);
-    typeof g == "function" && f(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 v = r.setReference;
-    return typeof v == "function" ? f(v, o) : r.setReference = o, p(o, () => e.children), p(a, F(H, {
+    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, {
       get when() {
         return b();
       },
       get children() {
-        var t = q(), d = r.setFloating;
-        return typeof d == "function" ? f(d, t) : r.setFloating = t, p(t, () => e.message), P((l) => {
-          var y = L("smwb-tooltip", e.class), x = r.floatingStyles();
-          return y !== l.e && R(t, l.e = y), l.t = S(t, x, l.t), l;
+        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;
         }, {
           e: void 0,
           t: void 0
@@ -65,6 +73,6 @@ function Z(w) {
 }
 A(["click"]);
 export {
-  Z as Tooltip
+  oe as Tooltip
 };
 //# sourceMappingURL=tooltip.js.map

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

@@ -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 { offset as offsetMiddleware } 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      resolved().autoMiddleware,\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","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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"}
+{"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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"}

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

@@ -1,14 +1,15 @@
-import { createComponent as n, use as d, spread as b, mergeProps as l, insert as g, template as _, memo as h } from "solid-js/web";
-import '../../../assets/styles/less/components/button/button.entry.css';/* empty css                                                       */
-import { mergeProps as R, splitProps as z, Show as s } from "solid-js";
-import T from "clsx";
-import { mergeRefs as w } from "../../../primitives/mergeRefs.js";
-import { useButtonGroup as W } from "../buttonGroups/buttonGroupContext.js";
-import { Ripple as k } from "../../base/ripple/ripple.js";
-import { Icon as C } from "../../base/icon/icon.js";
-var D = /* @__PURE__ */ _("<a data-testid=button-link>"), B = /* @__PURE__ */ _("<button data-testid=button>");
-function F($) {
-  const t = W(), v = R({
+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({
     get variant() {
       return t?.variant ?? "contained";
     },
@@ -18,30 +19,31 @@ function F($) {
     get colorTheme() {
       return t?.colorTheme ?? "primary";
     }
-  }, $), [e, a] = z(v, ["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, P = () => e.fullWidth ?? t?.fullWidth;
+  }, $), [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;
   let m;
-  const p = () => T("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 = () => k("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": P()
+    "smwb-full-width": y()
   }), u = (r) => {
     i() || m?.onRipple(r);
-  }, y = () => typeof e.icon == "string" ? n(C, l(() => e.iconProps ?? {}, {
-    get name() {
-      return e.icon;
-    }
-  })) : e.icon, f = () => [n(s, {
+  }, d = W(() => e.icon), R = () => {
+    const r = d();
+    return typeof r == "string" ? n(B, l(() => e.iconProps ?? {}, {
+      name: r
+    })) : r;
+  }, f = () => [n(s, {
     get when() {
-      return e.icon;
+      return d();
     },
     get children() {
-      return y();
+      return R();
     }
-  }), h(() => h(() => !!e.label)() ? e.label : e.children), n(s, {
+  }), w(() => w(() => !!e.label)() ? e.label : e.children), n(s, {
     get when() {
       return !e.disableRipple;
     },
     get children() {
-      return n(k, {
+      return n(D, {
         actionRef: (r) => m = r,
         get center() {
           return e.rippleCenter;
@@ -55,8 +57,8 @@ function F($) {
     },
     get fallback() {
       return (() => {
-        var r = B(), o = w(e.ref);
-        return typeof o == "function" && d(o, r), b(r, l(a, {
+        var r = A(), o = v(e.ref);
+        return typeof o == "function" && b(o, r), g(r, l(a, {
           get class() {
             return p();
           },
@@ -64,12 +66,12 @@ function F($) {
           get disabled() {
             return !!i();
           }
-        }), !1, !0), g(r, f), r;
+        }), !1, !0), h(r, f), r;
       })();
     },
     get children() {
-      var r = D(), o = w(e.ref);
-      return typeof o == "function" && d(o, r), b(r, l(a, {
+      var r = x(), o = v(e.ref);
+      return typeof o == "function" && b(o, r), g(r, l(a, {
         get class() {
           return p();
         },
@@ -79,11 +81,11 @@ function F($) {
         target: "_blank",
         rel: "noreferrer",
         onPointerDown: u
-      }), !1, !0), g(r, f), r;
+      }), !1, !0), h(r, f), r;
     }
   });
 }
 export {
-  F as Button
+  K as Button
 };
 //# sourceMappingURL=button.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"button.js","sources":["../../../../src/components/inputs/button/button.tsx"],"sourcesContent":["import { type JSX, type ParentProps, Show, 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  const iconElement = (): JSX.Element =>\n    typeof local.icon === \"string\" ? <Icon {...(local.iconProps ?? {})} name={local.icon} /> : (local.icon as JSX.Element);\n\n  const content = (): JSX.Element => (\n    <>\n      <Show when={local.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","iconElement","icon","_$createComponent","Icon","_$mergeProps","iconProps","name","content","Show","when","children","_$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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"}
+{"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":"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"}

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

@@ -1,12 +1,13 @@
-import { createComponent as a, use as s, spread as u, mergeProps as m, insert as d, template as c } from "solid-js/web";
-import '../../../assets/styles/less/components/buttonGroup/buttonGroup.entry.css';/* empty css                                                                 */
-import { mergeProps as p, splitProps as f } from "solid-js";
+import { createComponent as a, use as s, spread as m, mergeProps as u, 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";
 import g from "clsx";
 import { mergeRefs as h } from "../../../primitives/mergeRefs.js";
 import { ButtonGroupContext as v } from "./buttonGroupContext.js";
-var b = /* @__PURE__ */ c("<div>");
-function _(o) {
-  const i = p({
+var b = /* @__PURE__ */ p("<div>");
+function x(o) {
+  const i = c({
     variant: "contained",
     size: "medium",
     orientation: "horizontal",
@@ -37,7 +38,7 @@ function _(o) {
     value: l,
     get children() {
       var e = b(), t = h(r.ref);
-      return typeof t == "function" && s(t, e), u(e, m(n, {
+      return typeof t == "function" && s(t, e), m(e, u(n, {
         get class() {
           return g("smwb-button-group", r.class, `smwb-${r.orientation}`, `smwb-${r.variant}`, r.fullWidth && "smwb-full-width");
         },
@@ -48,6 +49,6 @@ function _(o) {
   });
 }
 export {
-  _ as ButtonGroup
+  x as ButtonGroup
 };
 //# sourceMappingURL=buttonGroup.js.map

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

@@ -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":";;;;;;;AAmBO,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;"}
+{"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;"}

package/dist/components/inputs/checkbox/checkbox.js

@@ -1,5 +1,6 @@
 import { createComponent as n, setAttribute as b, use as k, spread as v, mergeProps as y, insert as a, effect as $, className as u, template as f } from "solid-js/web";
-import '../../../assets/styles/less/components/checkbox/checkbox.entry.css';/* empty css                                                           */
+import '../../../assets/styles/less/components/checkbox/checkbox.entry.css';import '../../../assets/styles/less/tokens.entry.css';/* empty css                                     */
+/* empty css                                                           */
 import { mergeProps as C, splitProps as z, Show as h } from "solid-js";
 import g from "clsx";
 import { TextFieldWrapper as q } from "../textField/textFieldWrapper.js";
@@ -7,7 +8,7 @@ import { createId as T } from "../../../primitives/createId.js";
 import { mergeRefs as O } from "../../../primitives/mergeRefs.js";
 import { Icon as p } from "../../base/icon/icon.js";
 var P = /* @__PURE__ */ f("<span class=smwb-checkbox__label>"), I = /* @__PURE__ */ f("<label><input type=checkbox class=smwb-checkbox__input><span>");
-function B(o) {
+function E(o) {
   const w = C({
     size: "medium",
     color: "primary"
@@ -99,6 +100,6 @@ function B(o) {
   });
 }
 export {
-  B as Checkbox
+  E as Checkbox
 };
 //# sourceMappingURL=checkbox.js.map