@smwb/ui-solid 0.11.2 → 0.12.0

package/dist/headless/components/dataDisplay/accordion/accordion.js

@@ -1,82 +1,124 @@
-import { use as $, setAttribute as i, insert as a, createComponent as c, effect as O, className as k, template as _, delegateEvents as A } from "solid-js/web";
-import { mergeProps as x, splitProps as B, Show as l } from "solid-js";
-import v from "clsx";
-import { AnimateHeight as D } from "../../base/animateHeight/animateHeight.js";
-import { createControllableState as P } from "../../../primitives/createControllableState.js";
-import { createId as S } from "../../../primitives/createId.js";
-import { mergeRefs as T } from "../../../primitives/mergeRefs.js";
-import { Icon as z } from "../../base/icon/icon.js";
-var E = /* @__PURE__ */ _("<div role=region>"), H = /* @__PURE__ */ _("<div data-testid=accordion><button class=smwb-accordion__header type=button><span class=smwb-accordion__title>");
-function K(w) {
-  const C = x({
-    isOpenByDefault: !1
-  }, w), [e] = B(C, ["class", "title", "isOpenByDefault", "open", "disabled", "icon", "id", "children", "startAdornment", "noIcon", "onToggleClick", "onChange", "ref"]), [o, I] = P({
+import { use as P, setAttribute as c, insert as i, createComponent as a, effect as S, className as H, template as g, delegateEvents as T } from "solid-js/web";
+import { mergeProps as N, splitProps as R, children as m, createSignal as V, createComputed as j, Show as l } from "solid-js";
+import O from "clsx";
+import { AnimateHeight as q } from "../../base/animateHeight/animateHeight.js";
+import { createControllableState as F } from "../../../primitives/createControllableState.js";
+import { createId as G } from "../../../primitives/createId.js";
+import { mergeRefs as J } from "../../../primitives/mergeRefs.js";
+import { Icon as K } from "../../base/icon/icon.js";
+var L = /* @__PURE__ */ g("<span class=smwb-accordion__subtitle>"), M = /* @__PURE__ */ g("<span class=smwb-accordion__end>"), Q = /* @__PURE__ */ g("<div role=region>"), U = /* @__PURE__ */ g("<div data-testid=accordion><button class=smwb-accordion__header type=button><span class=smwb-accordion__heading><span class=smwb-accordion__title>");
+function W(s) {
+  const d = m(() => s.icon);
+  return a(l, {
+    get when() {
+      return d();
+    },
+    get fallback() {
+      return a(K, {
+        get class() {
+          return O("smwb-accordion__arrow-icon", {
+            "smwb-accordion__arrow-icon_opened": s.open
+          });
+        },
+        name: "expand_more",
+        size: 24
+      });
+    },
+    get children() {
+      return d();
+    }
+  });
+}
+function ae(s) {
+  const d = N({
+    isOpenByDefault: !1,
+    variant: "filled"
+  }, s), [e] = R(d, ["class", "title", "subtitle", "variant", "isOpenByDefault", "open", "disabled", "icon", "id", "children", "startAdornment", "endAdornment", "noIcon", "lazy", "unmountOnExit", "onToggleClick", "onChange", "ref"]), [r, x] = F({
     value: () => e.open,
     defaultValue: e.isOpenByDefault,
-    onChange: (r) => e.onChange?.(r)
-  }), d = S(e.id), s = `${d}-content`, m = `${d}-header`, y = (r) => {
-    e.disabled || (I(!o()), e.onToggleClick?.(r));
+    onChange: (t) => e.onChange?.(t)
+  }), h = G(e.id), p = `${h}-content`, b = `${h}-header`, E = m(() => e.title), _ = m(() => e.subtitle), u = !!(e.lazy || e.unmountOnExit) ? void 0 : m(() => e.children), v = () => u ? !!u() : "children" in e, [k, w] = V(r());
+  j(() => {
+    r() && w(!0);
+  });
+  const B = (t) => {
+    t === 0 && e.unmountOnExit && !r() && w(!1);
+  }, z = (t) => {
+    e.disabled || (x(!r()), e.onToggleClick?.(t));
   };
   return (() => {
-    var r = H(), n = r.firstChild, u = n.firstChild, f = T(e.ref);
-    return typeof f == "function" && $(f, r), n.$$click = y, i(n, "id", m), a(n, () => e.startAdornment?.(o()), u), a(u, () => e.title), a(n, c(l, {
+    var t = U(), o = t.firstChild, f = o.firstChild, D = f.firstChild, C = J(e.ref);
+    return typeof C == "function" && P(C, t), o.$$click = z, c(o, "id", b), i(o, () => e.startAdornment?.(r()), f), i(D, E), i(f, a(l, {
+      get when() {
+        return _();
+      },
+      get children() {
+        var n = L();
+        return i(n, _), n;
+      }
+    }), null), i(o, a(l, {
+      get when() {
+        return e.endAdornment;
+      },
+      get children() {
+        var n = M();
+        return i(n, () => e.endAdornment?.(r())), n;
+      }
+    }), null), i(o, a(l, {
       get when() {
         return !e.noIcon;
       },
       get children() {
-        return c(l, {
-          get when() {
+        return a(W, {
+          get icon() {
             return e.icon;
           },
-          get fallback() {
-            return c(z, {
-              get class() {
-                return v("smwb-accordion__arrow-icon", {
-                  "smwb-accordion__arrow-icon_opened": o()
-                });
-              },
-              name: "expand_more",
-              size: 24
-            });
-          },
-          get children() {
-            return e.icon;
+          get open() {
+            return r();
           }
         });
       }
-    }), null), a(r, c(l, {
+    }), null), i(t, a(l, {
       get when() {
-        return e.children;
+        return v();
       },
       get children() {
-        var t = E();
-        return i(t, "id", s), i(t, "aria-labelledby", m), a(t, c(D, {
+        var n = Q();
+        return c(n, "id", p), c(n, "aria-labelledby", b), i(n, a(q, {
           get height() {
-            return o() ? "auto" : 0;
+            return r() ? "auto" : 0;
           },
           animateOpacity: !0,
           duration: 300,
           class: "smwb-accordion__content",
+          onHeightAnimationEnd: B,
           get children() {
-            return e.children;
+            return u ? u() : a(l, {
+              get when() {
+                return k();
+              },
+              get children() {
+                return e.children;
+              }
+            });
           }
-        })), t;
+        })), n;
       }
-    }), null), O((t) => {
-      var g = v("smwb-accordion", {
+    }), null), S((n) => {
+      var $ = O("smwb-accordion", `smwb-accordion_${e.variant}`, {
         "smwb-disabled": e.disabled
-      }, e.class), h = e.disabled, p = o(), b = e.children ? s : void 0;
-      return g !== t.e && k(r, t.e = g), h !== t.t && (n.disabled = t.t = h), p !== t.a && i(n, "aria-expanded", t.a = p), b !== t.o && i(n, "aria-controls", t.o = b), t;
+      }, e.class), y = e.disabled, A = r(), I = v() ? p : void 0;
+      return $ !== n.e && H(t, n.e = $), y !== n.t && (o.disabled = n.t = y), A !== n.a && c(o, "aria-expanded", n.a = A), I !== n.o && c(o, "aria-controls", n.o = I), n;
     }, {
       e: void 0,
       t: void 0,
       a: void 0,
       o: void 0
-    }), r;
+    }), t;
   })();
 }
-A(["click"]);
+T(["click"]);
 export {
-  K as Accordion
+  ae as Accordion
 };
 //# sourceMappingURL=accordion.js.map

package/dist/headless/components/dataDisplay/accordion/accordion.js.map

@@ -1 +1 @@
-{"version":3,"file":"accordion.js","sources":["../../../../../src/components/dataDisplay/accordion/accordion.tsx"],"sourcesContent":["import { type JSX, type ParentProps, Show, mergeProps, splitProps } from \"solid-js\";\nimport cn from \"clsx\";\nimport { AnimateHeight } from \"../../base/animateHeight/animateHeight\";\nimport { Icon } from \"../../base/icon\";\nimport { createControllableState } from \"../../../primitives/createControllableState\";\nimport { createId } from \"../../../primitives/createId\";\nimport { mergeRefs, type Ref } from \"../../../primitives/mergeRefs\";\n\nexport interface AccordionProps {\n  class?: string;\n  title?: string;\n  isOpenByDefault?: boolean;\n  /** Controlled open state. When set, the component is controlled. */\n  open?: boolean;\n  /** Disable toggling. */\n  disabled?: boolean;\n  /** Custom expand icon (replaces the default chevron). */\n  icon?: JSX.Element;\n  id?: string;\n  startAdornment?: (isOpen: boolean) => JSX.Element;\n  noIcon?: boolean;\n  onToggleClick?: (e: MouseEvent & { currentTarget: HTMLButtonElement; target: Element }) => void;\n  /** Fired with the next open state on toggle. */\n  onChange?: (open: boolean) => void;\n  ref?: Ref<HTMLDivElement>;\n}\n\nexport function Accordion(props: ParentProps<AccordionProps>): JSX.Element {\n  const merged = mergeProps({ isOpenByDefault: false }, props);\n  const [local] = splitProps(merged, [\n    \"class\",\n    \"title\",\n    \"isOpenByDefault\",\n    \"open\",\n    \"disabled\",\n    \"icon\",\n    \"id\",\n    \"children\",\n    \"startAdornment\",\n    \"noIcon\",\n    \"onToggleClick\",\n    \"onChange\",\n    \"ref\",\n  ]);\n\n  const [isOpen, setIsOpen] = createControllableState<boolean>({\n    value: () => local.open,\n    defaultValue: local.isOpenByDefault,\n    onChange: (next) => local.onChange?.(next),\n  });\n\n  const baseId = createId(local.id);\n  const contentId = `${baseId}-content`;\n  const headerId = `${baseId}-header`;\n\n  const toggle: JSX.EventHandler<HTMLButtonElement, MouseEvent> = (event) => {\n    if (local.disabled) return;\n    setIsOpen(!isOpen());\n    local.onToggleClick?.(event);\n  };\n\n  return (\n    <div\n      ref={mergeRefs(local.ref)}\n      class={cn(\"smwb-accordion\", { \"smwb-disabled\": local.disabled }, local.class)}\n      data-testid=\"accordion\"\n    >\n      <button\n        id={headerId}\n        class=\"smwb-accordion__header\"\n        onClick={toggle}\n        type=\"button\"\n        disabled={local.disabled}\n        aria-expanded={isOpen()}\n        aria-controls={local.children ? contentId : undefined}\n      >\n        {local.startAdornment?.(isOpen())}\n        <span class=\"smwb-accordion__title\">{local.title}</span>\n        <Show when={!local.noIcon}>\n          <Show\n            when={local.icon}\n            fallback={\n              <Icon\n                class={cn(\"smwb-accordion__arrow-icon\", { \"smwb-accordion__arrow-icon_opened\": isOpen() })}\n                name=\"expand_more\"\n                size={24}\n              />\n            }\n          >\n            {local.icon}\n          </Show>\n        </Show>\n      </button>\n\n      <Show when={local.children}>\n        <div id={contentId} role=\"region\" aria-labelledby={headerId}>\n          <AnimateHeight height={isOpen() ? \"auto\" : 0} animateOpacity duration={300} class=\"smwb-accordion__content\">\n            {local.children}\n          </AnimateHeight>\n        </div>\n      </Show>\n    </div>\n  );\n}\n\nexport default Accordion;\n"],"names":["Accordion","props","merged","mergeProps","isOpenByDefault","local","splitProps","isOpen","setIsOpen","createControllableState","value","open","defaultValue","onChange","next","baseId","createId","id","contentId","headerId","toggle","event","disabled","onToggleClick","_el$","_tmpl$2","_el$2","firstChild","_el$3","_ref$","mergeRefs","ref","_$use","$$click","_$setAttribute","_$insert","startAdornment","title","_$createComponent","Show","when","noIcon","children","icon","fallback","Icon","cn","name","size","_el$4","_tmpl$","AnimateHeight","height","animateOpacity","duration","_$effect","_p$","_v$","class","_v$2","_v$3","_v$4","undefined","e","_$className","t","a","o","_$delegateEvents"],"mappings":"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"}
+{"version":3,"file":"accordion.js","sources":["../../../../../src/components/dataDisplay/accordion/accordion.tsx"],"sourcesContent":["import {\n  type JSX,\n  type ParentProps,\n  Show,\n  children,\n  createComputed,\n  createSignal,\n  mergeProps,\n  splitProps,\n} from \"solid-js\";\nimport cn from \"clsx\";\nimport { AnimateHeight, type Height } from \"../../base/animateHeight/animateHeight\";\nimport { Icon } from \"../../base/icon\";\nimport { createControllableState } from \"../../../primitives/createControllableState\";\nimport { createId } from \"../../../primitives/createId\";\nimport { mergeRefs, type Ref } from \"../../../primitives/mergeRefs\";\n\n/**\n * `filled` — the header is an app-bar strip on a raised panel (the original look).\n * `outlined` — a bordered card with a flat header: for feeds of records.\n * `plain` — no frame, a divider under each panel: for FAQ-style lists.\n * The flat variants stretch to the container and wrap long titles.\n */\nexport type AccordionVariant = \"filled\" | \"outlined\" | \"plain\";\n\nexport interface AccordionProps {\n  class?: string;\n  /** Header text or markup (a date, an author, a badge…). */\n  title?: JSX.Element;\n  /** Secondary line under the title. */\n  subtitle?: JSX.Element;\n  variant?: AccordionVariant;\n  isOpenByDefault?: boolean;\n  /** Controlled open state. When set, the component is controlled. */\n  open?: boolean;\n  /** Disable toggling. */\n  disabled?: boolean;\n  /** Custom expand icon (replaces the default chevron). */\n  icon?: JSX.Element;\n  id?: string;\n  startAdornment?: (isOpen: boolean) => JSX.Element;\n  /** Rendered after the title, before the expand icon. */\n  endAdornment?: (isOpen: boolean) => JSX.Element;\n  noIcon?: boolean;\n  /** Create the content on first open instead of up front. */\n  lazy?: boolean;\n  /** Remove the content once the panel has collapsed (created again on open). */\n  unmountOnExit?: boolean;\n  onToggleClick?: (e: MouseEvent & { currentTarget: HTMLButtonElement; target: Element }) => void;\n  /** Fired with the next open state on toggle. */\n  onChange?: (open: boolean) => void;\n  ref?: Ref<HTMLDivElement>;\n}\n\n/** The custom expand icon, read once where it renders, or the rotating chevron. */\nfunction ExpandIcon(props: { icon: JSX.Element; open: boolean }): JSX.Element {\n  const icon = children(() => props.icon);\n  return (\n    <Show\n      when={icon()}\n      fallback={\n        <Icon\n          class={cn(\"smwb-accordion__arrow-icon\", { \"smwb-accordion__arrow-icon_opened\": props.open })}\n          name=\"expand_more\"\n          size={24}\n        />\n      }\n    >\n      {icon()}\n    </Show>\n  );\n}\n\nexport function Accordion(props: ParentProps<AccordionProps>): JSX.Element {\n  const merged = mergeProps({ isOpenByDefault: false, variant: \"filled\" as AccordionVariant }, props);\n  const [local] = splitProps(merged, [\n    \"class\",\n    \"title\",\n    \"subtitle\",\n    \"variant\",\n    \"isOpenByDefault\",\n    \"open\",\n    \"disabled\",\n    \"icon\",\n    \"id\",\n    \"children\",\n    \"startAdornment\",\n    \"endAdornment\",\n    \"noIcon\",\n    \"lazy\",\n    \"unmountOnExit\",\n    \"onToggleClick\",\n    \"onChange\",\n    \"ref\",\n  ]);\n\n  const [isOpen, setIsOpen] = createControllableState<boolean>({\n    value: () => local.open,\n    defaultValue: local.isOpenByDefault,\n    onChange: (next) => local.onChange?.(next),\n  });\n\n  const baseId = createId(local.id);\n  const contentId = `${baseId}-content`;\n  const headerId = `${baseId}-header`;\n\n  // Read each JSX prop once. A prop written as markup is created anew on every\n  // read, and during hydration a copy the server did not render where this one\n  // lands (or rendered only to test it, as a <Show> condition does) has no DOM\n  // node to adopt: hydrate() throws \"Unable to find DOM nodes for hydration key\".\n  // The icon is read by ExpandIcon, which renders only without noIcon.\n  const title = children(() => local.title);\n  const subtitle = children(() => local.subtitle);\n\n  // Deferred content (lazy / unmountOnExit) is created only while it is shown, so\n  // it can't be read up front to see whether there is any: the region is kept\n  // whenever children are passed. Otherwise the content is resolved right away.\n  const deferred = Boolean(local.lazy || local.unmountOnExit);\n  const content = deferred ? undefined : children(() => local.children);\n  const hasContent = (): boolean => (content ? Boolean(content()) : \"children\" in local);\n\n  const [present, setPresent] = createSignal(isOpen());\n  // Mount deferred content in the same update that opens the panel, so the\n  // height animation measures it.\n  createComputed(() => {\n    if (isOpen()) setPresent(true);\n  });\n  const onCollapsed = (height: Height): void => {\n    if (height === 0 && local.unmountOnExit && !isOpen()) setPresent(false);\n  };\n\n  const toggle: JSX.EventHandler<HTMLButtonElement, MouseEvent> = (event) => {\n    if (local.disabled) return;\n    setIsOpen(!isOpen());\n    local.onToggleClick?.(event);\n  };\n\n  return (\n    <div\n      ref={mergeRefs(local.ref)}\n      class={cn(\"smwb-accordion\", `smwb-accordion_${local.variant}`, { \"smwb-disabled\": local.disabled }, local.class)}\n      data-testid=\"accordion\"\n    >\n      <button\n        id={headerId}\n        class=\"smwb-accordion__header\"\n        onClick={toggle}\n        type=\"button\"\n        disabled={local.disabled}\n        aria-expanded={isOpen()}\n        aria-controls={hasContent() ? contentId : undefined}\n      >\n        {local.startAdornment?.(isOpen())}\n        <span class=\"smwb-accordion__heading\">\n          <span class=\"smwb-accordion__title\">{title()}</span>\n          <Show when={subtitle()}>\n            <span class=\"smwb-accordion__subtitle\">{subtitle()}</span>\n          </Show>\n        </span>\n        <Show when={local.endAdornment}>\n          <span class=\"smwb-accordion__end\">{local.endAdornment?.(isOpen())}</span>\n        </Show>\n        <Show when={!local.noIcon}>\n          <ExpandIcon icon={local.icon} open={isOpen()} />\n        </Show>\n      </button>\n\n      <Show when={hasContent()}>\n        <div id={contentId} role=\"region\" aria-labelledby={headerId}>\n          <AnimateHeight\n            height={isOpen() ? \"auto\" : 0}\n            animateOpacity\n            duration={300}\n            class=\"smwb-accordion__content\"\n            onHeightAnimationEnd={onCollapsed}\n          >\n            {content ? content() : <Show when={present()}>{local.children}</Show>}\n          </AnimateHeight>\n        </div>\n      </Show>\n    </div>\n  );\n}\n\nexport default Accordion;\n"],"names":["ExpandIcon","props","icon","children","_$createComponent","Show","when","fallback","Icon","cn","open","name","size","Accordion","merged","mergeProps","isOpenByDefault","variant","local","splitProps","isOpen","setIsOpen","createControllableState","value","defaultValue","onChange","next","baseId","createId","id","contentId","headerId","title","subtitle","content","Boolean","lazy","unmountOnExit","undefined","hasContent","present","setPresent","createSignal","createComputed","onCollapsed","height","toggle","event","disabled","onToggleClick","_el$","_tmpl$4","_el$2","firstChild","_el$3","_el$4","_ref$","mergeRefs","ref","_$use","$$click","_$setAttribute","_$insert","startAdornment","_el$5","_tmpl$","endAdornment","_el$6","_tmpl$2","noIcon","_el$7","_tmpl$3","AnimateHeight","animateOpacity","duration","onHeightAnimationEnd","_$effect","_p$","_v$","class","_v$2","_v$3","_v$4","e","_$className","t","a","o","_$delegateEvents"],"mappings":"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"}

package/dist/headless/components/dataDisplay/avatar/avatar.js

@@ -1,53 +1,53 @@
-import { use as $, spread as g, mergeProps as f, insert as c, createComponent as d, effect as z, setAttribute as k, template as h } from "solid-js/web";
-import { mergeProps as b, splitProps as w, createSignal as S, Show as y, children as C } from "solid-js";
-import v from "clsx";
-import { mergeRefs as x } from "../../../primitives/mergeRefs.js";
-import { callHandler as A } from "../../../primitives/callHandler.js";
-var E = /* @__PURE__ */ h("<img>"), P = /* @__PURE__ */ h("<div>"), F = /* @__PURE__ */ h("<span class=smwb-avatar__fallback role=img>");
-const _ = (a) => typeof a == "string";
-function I(a) {
-  const i = b({
+import { use as y, spread as f, mergeProps as v, insert as a, createComponent as u, effect as A, setAttribute as S, template as m } from "solid-js/web";
+import { mergeProps as z, splitProps as x, createSignal as C, Show as h, children as L } from "solid-js";
+import _ from "clsx";
+import { mergeRefs as P } from "../../../primitives/mergeRefs.js";
+import { callHandler as E } from "../../../primitives/callHandler.js";
+var F = /* @__PURE__ */ m("<img>"), k = /* @__PURE__ */ m("<div>"), I = /* @__PURE__ */ m("<span class=smwb-avatar__fallback role=img>"), M = /* @__PURE__ */ m("<span class=smwb-avatar-group__hidden hidden>");
+const w = (l) => typeof l == "string";
+function j(l) {
+  const p = z({
     size: "medium",
     variant: "circular"
-  }, a), [r, u] = w(i, ["class", "src", "alt", "size", "variant", "color", "style", "imgProps", "children", "ref"]), [m, l] = S(!1), o = () => !!r.src && !m(), p = () => {
+  }, l), [r, g] = x(p, ["class", "src", "alt", "size", "variant", "color", "style", "imgProps", "children", "ref"]), [d, n] = C(!1), i = () => !!r.src && !d(), c = () => {
     const e = r.size;
     return {
       ...typeof r.style == "object" && r.style ? r.style : {},
-      ..._(e) ? {} : {
+      ...w(e) ? {} : {
         width: `${e}px`,
         height: `${e}px`,
         "font-size": `${e / 2.5}px`
       },
-      ...r.color && !o() ? {
+      ...r.color && !i() ? {
         "background-color": r.color
       } : {}
     };
   };
   return (() => {
-    var e = P(), s = x(r.ref);
-    return typeof s == "function" && $(s, e), g(e, f(u, {
+    var e = k(), o = P(r.ref);
+    return typeof o == "function" && y(o, e), f(e, v(g, {
       "data-testid": "avatar",
       get class() {
-        return v("smwb-avatar", `smwb-avatar_${r.variant}`, _(r.size) ? `smwb-avatar_${r.size}` : void 0, r.class);
+        return _("smwb-avatar", `smwb-avatar_${r.variant}`, w(r.size) ? `smwb-avatar_${r.size}` : void 0, r.class);
       },
       get style() {
-        return p();
+        return c();
       }
-    }), !1, !0), c(e, d(y, {
+    }), !1, !0), a(e, u(h, {
       get when() {
-        return o();
+        return i();
       },
       get fallback() {
         return (() => {
-          var t = F();
-          return c(t, () => r.children), z(() => k(t, "aria-label", r.alt)), t;
+          var t = I();
+          return a(t, () => r.children), A(() => S(t, "aria-label", r.alt)), t;
         })();
       },
       get children() {
-        var t = E();
-        return g(t, f(() => r.imgProps ?? {}, {
+        var t = F();
+        return f(t, v(() => r.imgProps ?? {}, {
           get class() {
-            return v("smwb-avatar__img", r.imgProps?.class);
+            return _("smwb-avatar__img", r.imgProps?.class);
           },
           get src() {
             return r.src;
@@ -55,32 +55,39 @@ function I(a) {
           get alt() {
             return r.alt;
           },
-          onError: (n) => {
-            l(!0), A(r.imgProps?.onError, n);
+          onError: (s) => {
+            n(!0), E(r.imgProps?.onError, s);
           }
         }), !1, !1), t;
       }
     })), e;
   })();
 }
-function R(a) {
-  const i = b({
-    max: 5
-  }, a), [r, u] = w(i, ["class", "max", "total", "onSurplusClick", "children", "ref"]), m = C(() => r.children), l = () => m.toArray(), o = () => r.total ?? l().length, p = () => Math.max(r.max, 1), e = () => l().slice(0, p()), s = () => o() - e().length;
+function D(l) {
+  const p = z({
+    max: 5,
+    surplusAriaLabel: (s) => `${s} more`
+  }, l), [r, g] = x(p, ["class", "max", "total", "onSurplusClick", "surplusAriaLabel", "size", "children", "ref"]), d = L(() => r.children), n = () => d.toArray(), i = () => r.total ?? n().length, c = () => Math.max(r.max, 1), e = () => n().slice(0, c()), o = () => n().slice(c()), t = () => i() - e().length;
   return (() => {
-    var t = P(), n = x(r.ref);
-    return typeof n == "function" && $(n, t), g(t, f(u, {
+    var s = k(), $ = P(r.ref);
+    return typeof $ == "function" && y($, s), f(s, v(g, {
       "data-testid": "avatar-group",
       get class() {
-        return v("smwb-avatar-group", r.class);
+        return _("smwb-avatar-group", r.class);
       }
-    }), !1, !0), c(t, d(y, {
+    }), !1, !0), a(s, () => e(), null), a(s, u(h, {
       get when() {
-        return s() > 0;
+        return t() > 0;
       },
       get children() {
-        return d(I, {
+        return u(j, {
           class: "smwb-avatar-group__surplus",
+          get size() {
+            return r.size ?? "medium";
+          },
+          get alt() {
+            return r.surplusAriaLabel(t());
+          },
           get onClick() {
             return r.onSurplusClick;
           },
@@ -90,15 +97,23 @@ function R(a) {
             } : void 0;
           },
           get children() {
-            return `+${s()}`;
+            return `+${t()}`;
           }
         });
       }
-    }), null), c(t, () => e(), null), t;
+    }), null), a(s, u(h, {
+      get when() {
+        return o().length > 0;
+      },
+      get children() {
+        var b = M();
+        return a(b, () => o()), b;
+      }
+    }), null), s;
   })();
 }
 export {
-  I as Avatar,
-  R as AvatarGroup
+  j as Avatar,
+  D as AvatarGroup
 };
 //# sourceMappingURL=avatar.js.map

package/dist/headless/components/dataDisplay/avatar/avatar.js.map

@@ -1 +1 @@
-{"version":3,"file":"avatar.js","sources":["../../../../../src/components/dataDisplay/avatar/avatar.tsx"],"sourcesContent":["import {\n  type JSX,\n  type ParentProps,\n  Show,\n  children as resolveChildren,\n  createSignal,\n  mergeProps,\n  splitProps,\n} from \"solid-js\";\nimport cn from \"clsx\";\nimport { mergeRefs, type Ref } from \"../../../primitives/mergeRefs\";\nimport { callHandler } from \"../../../primitives/callHandler\";\n\nexport type AvatarSize = \"small\" | \"medium\" | \"large\";\n\nexport interface AvatarProps extends JSX.HTMLAttributes<HTMLDivElement> {\n  /** Image source. Falls back to children (initials / icon) on error or when absent. */\n  src?: string | undefined;\n  alt?: string | undefined;\n  /** Preset size or an explicit pixel value. */\n  size?: AvatarSize | number;\n  variant?: \"circular\" | \"rounded\" | \"square\";\n  /** Background color for the fallback (initials / icon). */\n  color?: string;\n  /** Extra attributes forwarded to the underlying <img> (srcSet, loading…). */\n  imgProps?: JSX.ImgHTMLAttributes<HTMLImageElement>;\n  ref?: Ref<HTMLDivElement>;\n}\n\nconst isPresetSize = (size: AvatarSize | number): size is AvatarSize => typeof size === \"string\";\n\nexport function Avatar(props: ParentProps<AvatarProps>): JSX.Element {\n  const merged = mergeProps({ size: \"medium\" as AvatarSize | number, variant: \"circular\" as const }, props);\n  const [local, rest] = splitProps(merged, [\n    \"class\",\n    \"src\",\n    \"alt\",\n    \"size\",\n    \"variant\",\n    \"color\",\n    \"style\",\n    \"imgProps\",\n    \"children\",\n    \"ref\",\n  ]);\n\n  const [imgFailed, setImgFailed] = createSignal(false);\n  const showImage = (): boolean => Boolean(local.src) && !imgFailed();\n\n  const inlineStyle = (): JSX.CSSProperties => {\n    const size = local.size;\n    return {\n      ...(typeof local.style === \"object\" && local.style ? local.style : {}),\n      ...(isPresetSize(size) ? {} : { width: `${size}px`, height: `${size}px`, \"font-size\": `${size / 2.5}px` }),\n      ...(local.color && !showImage() ? { \"background-color\": local.color } : {}),\n    };\n  };\n\n  return (\n    <div\n      {...rest}\n      ref={mergeRefs(local.ref)}\n      data-testid=\"avatar\"\n      class={cn(\n        \"smwb-avatar\",\n        `smwb-avatar_${local.variant}`,\n        isPresetSize(local.size) ? `smwb-avatar_${local.size}` : undefined,\n        local.class\n      )}\n      style={inlineStyle()}\n    >\n      <Show\n        when={showImage()}\n        fallback={\n          <span class=\"smwb-avatar__fallback\" role=\"img\" aria-label={local.alt}>\n            {local.children}\n          </span>\n        }\n      >\n        <img\n          {...(local.imgProps ?? {})}\n          class={cn(\"smwb-avatar__img\", local.imgProps?.class)}\n          src={local.src}\n          alt={local.alt}\n          onError={(event) => {\n            setImgFailed(true);\n            callHandler(local.imgProps?.onError, event);\n          }}\n        />\n      </Show>\n    </div>\n  );\n}\n\nexport interface AvatarGroupProps extends JSX.HTMLAttributes<HTMLDivElement> {\n  /** Maximum avatars to show before collapsing the rest into a \"+N\" surplus. */\n  max?: number;\n  /** Override the total count used for the surplus label (defaults to children count). */\n  total?: number;\n  /** Click handler for the \"+N\" surplus chip. */\n  onSurplusClick?: () => void;\n  ref?: Ref<HTMLDivElement>;\n}\n\nexport function AvatarGroup(props: ParentProps<AvatarGroupProps>): JSX.Element {\n  const merged = mergeProps({ max: 5 }, props);\n  const [local, rest] = splitProps(merged, [\"class\", \"max\", \"total\", \"onSurplusClick\", \"children\", \"ref\"]);\n\n  const resolved = resolveChildren(() => local.children);\n  const items = (): unknown[] => resolved.toArray();\n  const totalCount = (): number => local.total ?? items().length;\n  const clampedMax = (): number => Math.max(local.max, 1);\n  const visible = (): unknown[] => items().slice(0, clampedMax());\n  const surplus = (): number => totalCount() - visible().length;\n\n  return (\n    <div {...rest} ref={mergeRefs(local.ref)} data-testid=\"avatar-group\" class={cn(\"smwb-avatar-group\", local.class)}>\n      <Show when={surplus() > 0}>\n        <Avatar\n          class=\"smwb-avatar-group__surplus\"\n          onClick={local.onSurplusClick}\n          style={local.onSurplusClick ? { cursor: \"pointer\" } : undefined}\n        >\n          {`+${surplus()}`}\n        </Avatar>\n      </Show>\n      {visible() as JSX.Element}\n    </div>\n  );\n}\n\nexport default Avatar;\n"],"names":["isPresetSize","size","Avatar","props","merged","mergeProps","variant","local","rest","splitProps","imgFailed","setImgFailed","createSignal","showImage","Boolean","src","inlineStyle","style","width","height","color","_el$","_tmpl$2","_ref$","mergeRefs","ref","_$use","_$spread","_$mergeProps","cn","undefined","class","_$insert","_$createComponent","Show","when","fallback","_el$3","_tmpl$3","children","_$effect","_$setAttribute","alt","_el$2","_tmpl$","imgProps","event","callHandler","onError","AvatarGroup","max","resolved","resolveChildren","items","toArray","totalCount","total","length","clampedMax","Math","visible","slice","surplus","_el$4","_ref$2","onClick","onSurplusClick","cursor"],"mappings":";;;;;;AA6BA,MAAMA,IAAeA,CAACC,MAAkD,OAAOA,KAAS;AAEjF,SAASC,EAAOC,GAA8C;AACnE,QAAMC,IAASC,EAAW;AAAA,IAAEJ,MAAM;AAAA,IAAiCK,SAAS;AAAA,EAAA,GAAuBH,CAAK,GAClG,CAACI,GAAOC,CAAI,IAAIC,EAAWL,GAAQ,CACvC,SACA,OACA,OACA,QACA,WACA,SACA,SACA,YACA,YACA,KAAK,CACN,GAEK,CAACM,GAAWC,CAAY,IAAIC,EAAa,EAAK,GAC9CC,IAAYA,MAAeC,EAAQP,EAAMQ,OAAQ,CAACL,EAAAA,GAElDM,IAAcA,MAAyB;AAC3C,UAAMf,IAAOM,EAAMN;AACnB,WAAO;AAAA,MACL,GAAI,OAAOM,EAAMU,SAAU,YAAYV,EAAMU,QAAQV,EAAMU,QAAQ,CAAA;AAAA,MACnE,GAAIjB,EAAaC,CAAI,IAAI,KAAK;AAAA,QAAEiB,OAAO,GAAGjB,CAAI;AAAA,QAAMkB,QAAQ,GAAGlB,CAAI;AAAA,QAAM,aAAa,GAAGA,IAAO,GAAG;AAAA,MAAA;AAAA,MACnG,GAAIM,EAAMa,SAAS,CAACP,MAAc;AAAA,QAAE,oBAAoBN,EAAMa;AAAAA,MAAAA,IAAU,CAAA;AAAA,IAAC;AAAA,EAE7E;AAEA,UAAA,MAAA;AAAA,QAAAC,IAAAC,EAAAA,GAAAC,IAGSC,EAAUjB,EAAMkB,GAAG;AAAC,kBAAAF,KAAA,cAAAG,EAAAH,GAAAF,CAAA,GAAAM,EAAAN,GAAAO,EADrBpB,GAAI;AAAA,MAAA,eAEI;AAAA,MAAQ,IAAA,QAAA;AAAA,eACbqB,EACL,eACA,eAAetB,EAAMD,OAAO,IAC5BN,EAAaO,EAAMN,IAAI,IAAI,eAAeM,EAAMN,IAAI,KAAK6B,QACzDvB,EAAMwB,KACR;AAAA,MAAC;AAAA,MAAA,IACDd,QAAK;AAAA,eAAED,EAAAA;AAAAA,MAAa;AAAA,IAAA,CAAA,GAAA,IAAA,EAAA,GAAAgB,EAAAX,GAAAY,EAEnBC,GAAI;AAAA,MAAA,IACHC,OAAI;AAAA,eAAEtB,EAAAA;AAAAA,MAAW;AAAA,MAAA,IACjBuB,WAAQ;AAAA,gBAAA,MAAA;AAAA,cAAAC,IAAAC,EAAAA;AAAAN,iBAAAA,EAAAK,GAAA,MAEH9B,EAAMgC,QAAQ,GAAAC,QAAAC,EAAAJ,GAAA,cAD0C9B,EAAMmC,GAAG,CAAA,GAAAL;AAAAA,QAAA,GAAA;AAAA,MAAA;AAAA,MAAA,IAAAE,WAAA;AAAA,YAAAI,IAAAC,EAAAA;AAAAjB,eAAAA,EAAAgB,GAAAf,EAAA,MAM/DrB,EAAMsC,YAAY,CAAA,GAAE;AAAA,UAAA,IAAA,QAAA;AAAA,mBAClBhB,EAAG,oBAAoBtB,EAAMsC,UAAUd,KAAK;AAAA,UAAC;AAAA,UAAA,IACpDhB,MAAG;AAAA,mBAAER,EAAMQ;AAAAA,UAAG;AAAA,UAAA,IACd2B,MAAG;AAAA,mBAAEnC,EAAMmC;AAAAA,UAAG;AAAA,UAAA,SACJI,CAAAA,MAAU;AAClBnC,YAAAA,EAAa,EAAI,GACjBoC,EAAYxC,EAAMsC,UAAUG,SAASF,CAAK;AAAA,UAC5C;AAAA,QAAA,CAAC,GAAA,IAAA,EAAA,GAAAH;AAAAA,MAAA;AAAA,IAAA,CAAA,CAAA,GAAAtB;AAAAA,EAAA,GAAA;AAKX;AAYO,SAAS4B,EAAY9C,GAAmD;AAC7E,QAAMC,IAASC,EAAW;AAAA,IAAE6C,KAAK;AAAA,EAAA,GAAK/C,CAAK,GACrC,CAACI,GAAOC,CAAI,IAAIC,EAAWL,GAAQ,CAAC,SAAS,OAAO,SAAS,kBAAkB,YAAY,KAAK,CAAC,GAEjG+C,IAAWC,EAAgB,MAAM7C,EAAMgC,QAAQ,GAC/Cc,IAAQA,MAAiBF,EAASG,QAAAA,GAClCC,IAAaA,MAAchD,EAAMiD,SAASH,IAAQI,QAClDC,IAAaA,MAAcC,KAAKT,IAAI3C,EAAM2C,KAAK,CAAC,GAChDU,IAAUA,MAAiBP,EAAAA,EAAQQ,MAAM,GAAGH,GAAY,GACxDI,IAAUA,MAAcP,MAAeK,IAAUH;AAEvD,UAAA,MAAA;AAAA,QAAAM,IAAAzC,EAAAA,GAAA0C,IACsBxC,EAAUjB,EAAMkB,GAAG;AAAC,kBAAAuC,KAAA,cAAAtC,EAAAsC,GAAAD,CAAA,GAAApC,EAAAoC,GAAAnC,EAA/BpB,GAAI;AAAA,MAAA,eAAyC;AAAA,MAAc,IAAA,QAAA;AAAA,eAAQqB,EAAG,qBAAqBtB,EAAMwB,KAAK;AAAA,MAAC;AAAA,IAAA,CAAA,GAAA,IAAA,EAAA,GAAAC,EAAA+B,GAAA9B,EAC7GC,GAAI;AAAA,MAAA,IAACC,OAAI;AAAA,eAAE2B,MAAY;AAAA,MAAC;AAAA,MAAA,IAAAvB,WAAA;AAAA,eAAAN,EACtB/B,GAAM;AAAA,UAAA,OAAA;AAAA,UAAA,IAEL+D,UAAO;AAAA,mBAAE1D,EAAM2D;AAAAA,UAAc;AAAA,UAAA,IAC7BjD,QAAK;AAAA,mBAAEV,EAAM2D,iBAAiB;AAAA,cAAEC,QAAQ;AAAA,YAAA,IAAcrC;AAAAA,UAAS;AAAA,UAAA,IAAAS,WAAA;AAAA,mBAE9D,IAAIuB,GAAS;AAAA,UAAE;AAAA,QAAA,CAAA;AAAA,MAAA;AAAA,IAAA,CAAA,GAAA,IAAA,GAAA9B,EAAA+B,GAAA,MAGnBH,EAAAA,GAAwB,IAAA,GAAAG;AAAAA,EAAA,GAAA;AAG/B;"}
+{"version":3,"file":"avatar.js","sources":["../../../../../src/components/dataDisplay/avatar/avatar.tsx"],"sourcesContent":["import {\n  type JSX,\n  type ParentProps,\n  Show,\n  children as resolveChildren,\n  createSignal,\n  mergeProps,\n  splitProps,\n} from \"solid-js\";\nimport cn from \"clsx\";\nimport { mergeRefs, type Ref } from \"../../../primitives/mergeRefs\";\nimport { callHandler } from \"../../../primitives/callHandler\";\n\nexport type AvatarSize = \"small\" | \"medium\" | \"large\";\n\nexport interface AvatarProps extends JSX.HTMLAttributes<HTMLDivElement> {\n  /** Image source. Falls back to children (initials / icon) on error or when absent. */\n  src?: string | undefined;\n  alt?: string | undefined;\n  /** Preset size or an explicit pixel value. */\n  size?: AvatarSize | number;\n  variant?: \"circular\" | \"rounded\" | \"square\";\n  /** Background color for the fallback (initials / icon). */\n  color?: string;\n  /** Extra attributes forwarded to the underlying <img> (srcSet, loading…). */\n  imgProps?: JSX.ImgHTMLAttributes<HTMLImageElement>;\n  ref?: Ref<HTMLDivElement>;\n}\n\nconst isPresetSize = (size: AvatarSize | number): size is AvatarSize => typeof size === \"string\";\n\nexport function Avatar(props: ParentProps<AvatarProps>): JSX.Element {\n  const merged = mergeProps({ size: \"medium\" as AvatarSize | number, variant: \"circular\" as const }, props);\n  const [local, rest] = splitProps(merged, [\n    \"class\",\n    \"src\",\n    \"alt\",\n    \"size\",\n    \"variant\",\n    \"color\",\n    \"style\",\n    \"imgProps\",\n    \"children\",\n    \"ref\",\n  ]);\n\n  const [imgFailed, setImgFailed] = createSignal(false);\n  const showImage = (): boolean => Boolean(local.src) && !imgFailed();\n\n  const inlineStyle = (): JSX.CSSProperties => {\n    const size = local.size;\n    return {\n      ...(typeof local.style === \"object\" && local.style ? local.style : {}),\n      ...(isPresetSize(size) ? {} : { width: `${size}px`, height: `${size}px`, \"font-size\": `${size / 2.5}px` }),\n      ...(local.color && !showImage() ? { \"background-color\": local.color } : {}),\n    };\n  };\n\n  return (\n    <div\n      {...rest}\n      ref={mergeRefs(local.ref)}\n      data-testid=\"avatar\"\n      class={cn(\n        \"smwb-avatar\",\n        `smwb-avatar_${local.variant}`,\n        isPresetSize(local.size) ? `smwb-avatar_${local.size}` : undefined,\n        local.class\n      )}\n      style={inlineStyle()}\n    >\n      <Show\n        when={showImage()}\n        fallback={\n          <span class=\"smwb-avatar__fallback\" role=\"img\" aria-label={local.alt}>\n            {local.children}\n          </span>\n        }\n      >\n        <img\n          {...(local.imgProps ?? {})}\n          class={cn(\"smwb-avatar__img\", local.imgProps?.class)}\n          src={local.src}\n          alt={local.alt}\n          onError={(event) => {\n            setImgFailed(true);\n            callHandler(local.imgProps?.onError, event);\n          }}\n        />\n      </Show>\n    </div>\n  );\n}\n\nexport interface AvatarGroupProps extends JSX.HTMLAttributes<HTMLDivElement> {\n  /** Maximum avatars to show before collapsing the rest into a \"+N\" surplus. */\n  max?: number;\n  /** Override the total count used for the surplus label (defaults to children count). */\n  total?: number;\n  /** Click handler for the \"+N\" surplus chip. */\n  onSurplusClick?: () => void;\n  /** Accessible name of the \"+N\" surplus chip. */\n  surplusAriaLabel?: (count: number) => string;\n  /** Size of the \"+N\" surplus chip: match the avatars in the group. */\n  size?: AvatarSize | number;\n  ref?: Ref<HTMLDivElement>;\n}\n\nexport function AvatarGroup(props: ParentProps<AvatarGroupProps>): JSX.Element {\n  const merged = mergeProps(\n    { max: 5, surplusAriaLabel: (count: number) => `${count} more` },\n    props\n  );\n  const [local, rest] = splitProps(merged, [\n    \"class\",\n    \"max\",\n    \"total\",\n    \"onSurplusClick\",\n    \"surplusAriaLabel\",\n    \"size\",\n    \"children\",\n    \"ref\",\n  ]);\n\n  const resolved = resolveChildren(() => local.children);\n  const items = (): unknown[] => resolved.toArray();\n  const totalCount = (): number => local.total ?? items().length;\n  const clampedMax = (): number => Math.max(local.max, 1);\n  const visible = (): unknown[] => items().slice(0, clampedMax());\n  const hidden = (): unknown[] => items().slice(clampedMax());\n  const surplus = (): number => totalCount() - visible().length;\n\n  // In order, the first avatar first; the \"+N\" chip ends the row.\n  return (\n    <div {...rest} ref={mergeRefs(local.ref)} data-testid=\"avatar-group\" class={cn(\"smwb-avatar-group\", local.class)}>\n      {visible() as JSX.Element}\n      <Show when={surplus() > 0}>\n        <Avatar\n          class=\"smwb-avatar-group__surplus\"\n          size={local.size ?? \"medium\"}\n          alt={local.surplusAriaLabel(surplus())}\n          onClick={local.onSurplusClick}\n          style={local.onSurplusClick ? { cursor: \"pointer\" } : undefined}\n        >\n          {`+${surplus()}`}\n        </Avatar>\n      </Show>\n      {/* Avatars past max are created with the rest (the children resolve at\n          once), so they are rendered, hidden: a server that left them out would\n          leave the browser without nodes to hydrate them from. */}\n      <Show when={hidden().length > 0}>\n        <span class=\"smwb-avatar-group__hidden\" hidden>\n          {hidden() as JSX.Element}\n        </span>\n      </Show>\n    </div>\n  );\n}\n\nexport default Avatar;\n"],"names":["isPresetSize","size","Avatar","props","merged","mergeProps","variant","local","rest","splitProps","imgFailed","setImgFailed","createSignal","showImage","Boolean","src","inlineStyle","style","width","height","color","_el$","_tmpl$2","_ref$","mergeRefs","ref","_$use","_$spread","_$mergeProps","cn","undefined","class","_$insert","_$createComponent","Show","when","fallback","_el$3","_tmpl$3","children","_$effect","_$setAttribute","alt","_el$2","_tmpl$","imgProps","event","callHandler","onError","AvatarGroup","max","surplusAriaLabel","count","resolved","resolveChildren","items","toArray","totalCount","total","length","clampedMax","Math","visible","slice","hidden","surplus","_el$4","_ref$2","onClick","onSurplusClick","cursor","_el$5","_tmpl$4"],"mappings":"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"}

package/dist/headless/components/dataDisplay/badge/badge.js

@@ -1,40 +1,43 @@
-import { insert as n, use as g, spread as m, mergeProps as c, createComponent as p, template as f } from "solid-js/web";
-import { mergeProps as h, splitProps as v, Show as _ } from "solid-js";
-import u from "clsx";
-import { mergeRefs as w } from "../../../primitives/mergeRefs.js";
-var $ = /* @__PURE__ */ f("<span class=smwb-badge__wrapper data-testid=badge><span>");
-function Z(s) {
-  const i = h({
+import { insert as s, use as b, spread as g, mergeProps as p, createComponent as f, template as h } from "solid-js/web";
+import { mergeProps as u, splitProps as v, children as _, Show as w } from "solid-js";
+import $ from "clsx";
+import { mergeRefs as x } from "../../../primitives/mergeRefs.js";
+var y = /* @__PURE__ */ h("<span class=smwb-badge__wrapper data-testid=badge><span>");
+function A(i) {
+  const l = u({
     color: "primary",
     variant: "outside",
     vertical: "top",
     horizontal: "right",
     showZero: !1
-  }, s), [e, l] = v(i, ["class", "color", "badgeContent", "variant", "vertical", "horizontal", "max", "showZero", "badgeAriaLabel", "children", "ref"]), d = () => e.badgeContent === 0 || e.badgeContent === "0", a = () => e.badgeContent === void 0 || e.badgeContent === null || d() && !e.showZero, b = () => typeof e.badgeContent == "number" && e.max !== void 0 && e.badgeContent > e.max ? `${e.max}+` : e.badgeContent;
+  }, i), [e, c] = v(l, ["class", "color", "badgeContent", "variant", "vertical", "horizontal", "max", "showZero", "badgeAriaLabel", "children", "ref"]), a = _(() => e.badgeContent), m = () => a() === 0 || a() === "0", o = () => a() === void 0 || a() === null || m() && !e.showZero, d = () => {
+    const r = a();
+    return typeof r == "number" && e.max !== void 0 && r > e.max ? `${e.max}+` : r;
+  };
   return (() => {
-    var t = $(), r = t.firstChild;
-    n(t, () => e.children, r);
-    var o = w(e.ref);
-    return typeof o == "function" && g(o, r), m(r, c(l, {
+    var r = y(), t = r.firstChild;
+    s(r, () => e.children, t);
+    var n = x(e.ref);
+    return typeof n == "function" && b(n, t), g(t, p(c, {
       get class() {
-        return u("smwb-badge", `smwb-badge_${e.color}`, `smwb-badge_${e.variant}`, `smwb-badge_${e.variant}_${e.vertical}`, `smwb-badge_${e.variant}_${e.vertical}_${e.horizontal}`, e.class, {
-          "smwb-badge_no-content": a()
+        return $("smwb-badge", `smwb-badge_${e.color}`, `smwb-badge_${e.variant}`, `smwb-badge_${e.variant}_${e.vertical}`, `smwb-badge_${e.variant}_${e.vertical}_${e.horizontal}`, e.class, {
+          "smwb-badge_no-content": o()
         });
       },
       get "aria-label"() {
         return e.badgeAriaLabel;
       }
-    }), !1, !0), n(r, p(_, {
+    }), !1, !0), s(t, f(w, {
       get when() {
-        return !a();
+        return !o();
       },
       get children() {
-        return b();
+        return d();
       }
-    })), t;
+    })), r;
   })();
 }
 export {
-  Z as Badge
+  A as Badge
 };
 //# sourceMappingURL=badge.js.map

package/dist/headless/components/dataDisplay/badge/badge.js.map

@@ -1 +1 @@
-{"version":3,"file":"badge.js","sources":["../../../../../src/components/dataDisplay/badge/badge.tsx"],"sourcesContent":["import { type JSX, type ParentProps, Show, mergeProps, splitProps } from \"solid-js\";\nimport cn from \"clsx\";\nimport { mergeRefs, type Ref } from \"../../../primitives/mergeRefs\";\n\nexport interface BadgeProps extends JSX.HTMLAttributes<HTMLSpanElement> {\n  badgeContent?: JSX.Element | number | string;\n  color?: \"primary\" | \"success\" | \"danger\";\n  variant?: \"inside\" | \"outside\";\n  vertical?: \"top\" | \"bottom\";\n  horizontal?: \"right\" | \"left\";\n  /** Cap numeric content, rendering `{max}+` when exceeded. */\n  max?: number;\n  /** Render the badge even when content is 0. */\n  showZero?: boolean;\n  /** Accessible label for the badge value. */\n  badgeAriaLabel?: string;\n  ref?: Ref<HTMLSpanElement>;\n}\n\nexport function Badge(props: ParentProps<BadgeProps>): JSX.Element {\n  const merged = mergeProps(\n    {\n      color: \"primary\" as const,\n      variant: \"outside\" as const,\n      vertical: \"top\" as const,\n      horizontal: \"right\" as const,\n      showZero: false,\n    },\n    props\n  );\n  const [local, rest] = splitProps(merged, [\n    \"class\",\n    \"color\",\n    \"badgeContent\",\n    \"variant\",\n    \"vertical\",\n    \"horizontal\",\n    \"max\",\n    \"showZero\",\n    \"badgeAriaLabel\",\n    \"children\",\n    \"ref\",\n  ]);\n\n  const isZero = (): boolean => local.badgeContent === 0 || local.badgeContent === \"0\";\n  const hidden = (): boolean =>\n    local.badgeContent === undefined || local.badgeContent === null || (isZero() && !local.showZero);\n\n  const display = (): JSX.Element | number | string | undefined =>\n    typeof local.badgeContent === \"number\" && local.max !== undefined && local.badgeContent > local.max\n      ? `${local.max}+`\n      : local.badgeContent;\n\n  return (\n    <span class=\"smwb-badge__wrapper\" data-testid=\"badge\">\n      {local.children}\n      <span\n        {...rest}\n        ref={mergeRefs(local.ref)}\n        class={cn(\n          \"smwb-badge\",\n          `smwb-badge_${local.color}`,\n          `smwb-badge_${local.variant}`,\n          `smwb-badge_${local.variant}_${local.vertical}`,\n          `smwb-badge_${local.variant}_${local.vertical}_${local.horizontal}`,\n          local.class,\n          { \"smwb-badge_no-content\": hidden() }\n        )}\n        aria-label={local.badgeAriaLabel}\n      >\n        <Show when={!hidden()}>{display()}</Show>\n      </span>\n    </span>\n  );\n}\n\nexport default Badge;\n"],"names":["Badge","props","merged","mergeProps","color","variant","vertical","horizontal","showZero","local","rest","splitProps","isZero","badgeContent","hidden","undefined","display","max","_el$","_tmpl$","_el$2","firstChild","_$insert","children","_ref$","mergeRefs","ref","_$use","_$spread","_$mergeProps","cn","class","badgeAriaLabel","_$createComponent","Show","when"],"mappings":";;;;;AAmBO,SAASA,EAAMC,GAA6C;AACjE,QAAMC,IAASC,EACb;AAAA,IACEC,OAAO;AAAA,IACPC,SAAS;AAAA,IACTC,UAAU;AAAA,IACVC,YAAY;AAAA,IACZC,UAAU;AAAA,EAAA,GAEZP,CACF,GACM,CAACQ,GAAOC,CAAI,IAAIC,EAAWT,GAAQ,CACvC,SACA,SACA,gBACA,WACA,YACA,cACA,OACA,YACA,kBACA,YACA,KAAK,CACN,GAEKU,IAASA,MAAeH,EAAMI,iBAAiB,KAAKJ,EAAMI,iBAAiB,KAC3EC,IAASA,MACbL,EAAMI,iBAAiBE,UAAaN,EAAMI,iBAAiB,QAASD,OAAY,CAACH,EAAMD,UAEnFQ,IAAUA,MACd,OAAOP,EAAMI,gBAAiB,YAAYJ,EAAMQ,QAAQF,UAAaN,EAAMI,eAAeJ,EAAMQ,MAC5F,GAAGR,EAAMQ,GAAG,MACZR,EAAMI;AAEZ,UAAA,MAAA;AAAA,QAAAK,IAAAC,EAAAA,GAAAC,IAAAF,EAAAG;AAAAC,IAAAA,EAAAJ,GAAA,MAEKT,EAAMc,UAAQH,CAAA;AAAA,QAAAI,IAGRC,EAAUhB,EAAMiB,GAAG;AAAC,kBAAAF,KAAA,cAAAG,EAAAH,GAAAJ,CAAA,GAAAQ,EAAAR,GAAAS,EADrBnB,GAAI;AAAA,MAAA,IAAA,QAAA;AAAA,eAEDoB,EACL,cACA,cAAcrB,EAAML,KAAK,IACzB,cAAcK,EAAMJ,OAAO,IAC3B,cAAcI,EAAMJ,OAAO,IAAII,EAAMH,QAAQ,IAC7C,cAAcG,EAAMJ,OAAO,IAAII,EAAMH,QAAQ,IAAIG,EAAMF,UAAU,IACjEE,EAAMsB,OACN;AAAA,UAAE,yBAAyBjB,EAAAA;AAAAA,QAAO,CACpC;AAAA,MAAC;AAAA,MAAA,IAAA,eAAA;AAAA,eACWL,EAAMuB;AAAAA,MAAc;AAAA,IAAA,CAAA,GAAA,IAAA,EAAA,GAAAV,EAAAF,GAAAa,EAE/BC,GAAI;AAAA,MAAA,IAACC,OAAI;AAAA,eAAE,CAACrB,EAAAA;AAAAA,MAAQ;AAAA,MAAA,IAAAS,WAAA;AAAA,eAAGP,EAAAA;AAAAA,MAAS;AAAA,IAAA,CAAA,CAAA,GAAAE;AAAAA,EAAA,GAAA;AAIzC;"}
+{"version":3,"file":"badge.js","sources":["../../../../../src/components/dataDisplay/badge/badge.tsx"],"sourcesContent":["import { type JSX, type ParentProps, Show, children, mergeProps, splitProps } from \"solid-js\";\nimport cn from \"clsx\";\nimport { mergeRefs, type Ref } from \"../../../primitives/mergeRefs\";\n\nexport interface BadgeProps extends JSX.HTMLAttributes<HTMLSpanElement> {\n  badgeContent?: JSX.Element | number | string;\n  color?: \"primary\" | \"success\" | \"danger\";\n  variant?: \"inside\" | \"outside\";\n  vertical?: \"top\" | \"bottom\";\n  horizontal?: \"right\" | \"left\";\n  /** Cap numeric content, rendering `{max}+` when exceeded. */\n  max?: number;\n  /** Render the badge even when content is 0. */\n  showZero?: boolean;\n  /** Accessible label for the badge value. */\n  badgeAriaLabel?: string;\n  ref?: Ref<HTMLSpanElement>;\n}\n\nexport function Badge(props: ParentProps<BadgeProps>): JSX.Element {\n  const merged = mergeProps(\n    {\n      color: \"primary\" as const,\n      variant: \"outside\" as const,\n      vertical: \"top\" as const,\n      horizontal: \"right\" as const,\n      showZero: false,\n    },\n    props\n  );\n  const [local, rest] = splitProps(merged, [\n    \"class\",\n    \"color\",\n    \"badgeContent\",\n    \"variant\",\n    \"vertical\",\n    \"horizontal\",\n    \"max\",\n    \"showZero\",\n    \"badgeAriaLabel\",\n    \"children\",\n    \"ref\",\n  ]);\n\n  // Read the content once: markup passed as a prop is created anew on every\n  // read, and during hydration a copy the server never rendered has no DOM node.\n  const content = children(() => local.badgeContent);\n  const isZero = (): boolean => content() === 0 || content() === \"0\";\n  const hidden = (): boolean => content() === undefined || content() === null || (isZero() && !local.showZero);\n\n  const display = (): JSX.Element => {\n    const value = content();\n    return typeof value === \"number\" && local.max !== undefined && value > local.max ? `${local.max}+` : value;\n  };\n\n  return (\n    <span class=\"smwb-badge__wrapper\" data-testid=\"badge\">\n      {local.children}\n      <span\n        {...rest}\n        ref={mergeRefs(local.ref)}\n        class={cn(\n          \"smwb-badge\",\n          `smwb-badge_${local.color}`,\n          `smwb-badge_${local.variant}`,\n          `smwb-badge_${local.variant}_${local.vertical}`,\n          `smwb-badge_${local.variant}_${local.vertical}_${local.horizontal}`,\n          local.class,\n          { \"smwb-badge_no-content\": hidden() }\n        )}\n        aria-label={local.badgeAriaLabel}\n      >\n        <Show when={!hidden()}>{display()}</Show>\n      </span>\n    </span>\n  );\n}\n\nexport default Badge;\n"],"names":["Badge","props","merged","mergeProps","color","variant","vertical","horizontal","showZero","local","rest","splitProps","content","children","badgeContent","isZero","hidden","undefined","display","value","max","_el$","_tmpl$","_el$2","firstChild","_$insert","_ref$","mergeRefs","ref","_$use","_$spread","_$mergeProps","cn","class","badgeAriaLabel","_$createComponent","Show","when"],"mappings":";;;;;AAmBO,SAASA,EAAMC,GAA6C;AACjE,QAAMC,IAASC,EACb;AAAA,IACEC,OAAO;AAAA,IACPC,SAAS;AAAA,IACTC,UAAU;AAAA,IACVC,YAAY;AAAA,IACZC,UAAU;AAAA,EAAA,GAEZP,CACF,GACM,CAACQ,GAAOC,CAAI,IAAIC,EAAWT,GAAQ,CACvC,SACA,SACA,gBACA,WACA,YACA,cACA,OACA,YACA,kBACA,YACA,KAAK,CACN,GAIKU,IAAUC,EAAS,MAAMJ,EAAMK,YAAY,GAC3CC,IAASA,MAAeH,EAAAA,MAAc,KAAKA,QAAc,KACzDI,IAASA,MAAeJ,EAAAA,MAAcK,UAAaL,QAAc,QAASG,EAAAA,KAAY,CAACN,EAAMD,UAE7FU,IAAUA,MAAmB;AACjC,UAAMC,IAAQP,EAAAA;AACd,WAAO,OAAOO,KAAU,YAAYV,EAAMW,QAAQH,UAAaE,IAAQV,EAAMW,MAAM,GAAGX,EAAMW,GAAG,MAAMD;AAAAA,EACvG;AAEA,UAAA,MAAA;AAAA,QAAAE,IAAAC,EAAAA,GAAAC,IAAAF,EAAAG;AAAAC,IAAAA,EAAAJ,GAAA,MAEKZ,EAAMI,UAAQU,CAAA;AAAA,QAAAG,IAGRC,EAAUlB,EAAMmB,GAAG;AAAC,kBAAAF,KAAA,cAAAG,EAAAH,GAAAH,CAAA,GAAAO,EAAAP,GAAAQ,EADrBrB,GAAI;AAAA,MAAA,IAAA,QAAA;AAAA,eAEDsB,EACL,cACA,cAAcvB,EAAML,KAAK,IACzB,cAAcK,EAAMJ,OAAO,IAC3B,cAAcI,EAAMJ,OAAO,IAAII,EAAMH,QAAQ,IAC7C,cAAcG,EAAMJ,OAAO,IAAII,EAAMH,QAAQ,IAAIG,EAAMF,UAAU,IACjEE,EAAMwB,OACN;AAAA,UAAE,yBAAyBjB,EAAAA;AAAAA,QAAO,CACpC;AAAA,MAAC;AAAA,MAAA,IAAA,eAAA;AAAA,eACWP,EAAMyB;AAAAA,MAAc;AAAA,IAAA,CAAA,GAAA,IAAA,EAAA,GAAAT,EAAAF,GAAAY,EAE/BC,GAAI;AAAA,MAAA,IAACC,OAAI;AAAA,eAAE,CAACrB,EAAAA;AAAAA,MAAQ;AAAA,MAAA,IAAAH,WAAA;AAAA,eAAGK,EAAAA;AAAAA,MAAS;AAAA,IAAA,CAAA,CAAA,GAAAG;AAAAA,EAAA,GAAA;AAIzC;"}

package/dist/headless/components/dataDisplay/card/card.js

@@ -1,21 +1,21 @@
-import { use as p, spread as v, mergeProps as g, memo as _, insert as n, createComponent as i, template as a } from "solid-js/web";
-import { mergeProps as b, splitProps as w, Show as d } from "solid-js";
-import $ from "clsx";
-import { mergeRefs as h } from "../../../primitives/mergeRefs.js";
-import { callHandler as s } from "../../../primitives/callHandler.js";
-var k = /* @__PURE__ */ a("<div class=smwb-card__title>"), y = /* @__PURE__ */ a("<div class=smwb-card__footer>"), C = /* @__PURE__ */ a("<div>");
-function H(c) {
-  const m = b({
+import { use as v, spread as g, mergeProps as _, memo as b, insert as n, createComponent as d, template as l } from "solid-js/web";
+import { mergeProps as w, splitProps as h, children as $, Show as s } from "solid-js";
+import k from "clsx";
+import { mergeRefs as y } from "../../../primitives/mergeRefs.js";
+import { callHandler as c } from "../../../primitives/callHandler.js";
+var C = /* @__PURE__ */ l("<div class=smwb-card__title>"), D = /* @__PURE__ */ l("<div class=smwb-card__footer>"), K = /* @__PURE__ */ l("<div>");
+function S(m) {
+  const u = w({
     variant: "elevated"
-  }, c), [e, u] = w(m, ["class", "variant", "children", "disabled", "title", "footer", "onClick", "onKeyDown", "ref"]), t = () => !!e.onClick && !e.disabled, f = (r) => {
-    s(e.onKeyDown, r), t() && (r.key === "Enter" || r.key === " ") && (r.preventDefault(), s(e.onClick, r));
+  }, m), [e, f] = h(u, ["class", "variant", "children", "disabled", "title", "footer", "onClick", "onKeyDown", "ref"]), a = $(() => e.footer), t = () => !!e.onClick && !e.disabled, p = (r) => {
+    c(e.onKeyDown, r), t() && (r.key === "Enter" || r.key === " ") && (r.preventDefault(), c(e.onClick, r));
   };
   return (() => {
-    var r = C(), l = h(e.ref);
-    return typeof l == "function" && p(l, r), v(r, g(u, {
+    var r = K(), i = y(e.ref);
+    return typeof i == "function" && v(i, r), g(r, _(f, {
       "data-testid": "card",
       get class() {
-        return $("smwb-card", `smwb-card_${e.variant}`, e.class, {
+        return k("smwb-card", `smwb-card_${e.variant}`, e.class, {
           card_disabled: e.disabled,
           "smwb-card_interactive": t()
         });
@@ -30,29 +30,29 @@ function H(c) {
         return e.disabled || void 0;
       },
       get onClick() {
-        return _(() => !!t())() ? e.onClick : void 0;
+        return b(() => !!t())() ? e.onClick : void 0;
       },
-      onKeyDown: f
-    }), !1, !0), n(r, i(d, {
+      onKeyDown: p
+    }), !1, !0), n(r, d(s, {
       get when() {
         return e.title;
       },
       get children() {
-        var o = k();
+        var o = C();
         return n(o, () => e.title), o;
       }
-    }), null), n(r, () => e.children, null), n(r, i(d, {
+    }), null), n(r, () => e.children, null), n(r, d(s, {
       get when() {
-        return e.footer;
+        return a();
       },
       get children() {
-        var o = y();
-        return n(o, () => e.footer), o;
+        var o = D();
+        return n(o, a), o;
       }
     }), null), r;
   })();
 }
 export {
-  H as Card
+  S as Card
 };
 //# sourceMappingURL=card.js.map