@smwb/ui-solid 0.11.1 → 0.12.0

package/dist/headless/components/inputs/textField/textFieldWrapper.js

@@ -1,16 +1,16 @@
-import { spread as g, mergeProps as $, insert as l, createComponent as n, effect as b, className as w, setAttribute as A, memo as m, addEventListener as F, template as s, delegateEvents as T } from "solid-js/web";
-import { splitProps as k, Show as d } from "solid-js";
-import u from "clsx";
-import { TextFieldAdornment as _ } from "./textFieldAdornment.js";
-var C = /* @__PURE__ */ s("<label>"), S = /* @__PURE__ */ s("<span>"), W = /* @__PURE__ */ s("<fieldset><legend>"), D = /* @__PURE__ */ s("<p class=smwb-text-field__helper-line><span class=smwb-text-field__helper-text>"), E = /* @__PURE__ */ s("<div><div class=smwb-text-field__input-holder>"), H = /* @__PURE__ */ s("<span class=smwb-notranslate>&#8203;");
-function L(p) {
-  const [e, x] = k(p, ["label", "helperText", "variant", "disabled", "class", "error", "fullWidth", "isFilledState", "isFocused", "for", "shrink", "children", "onHolderMouseDown", "startAdornment", "endAdornment", "inline"]), c = () => e.helperText ?? " ", v = () => e.variant === "filled", f = () => !!e.label && (!!e.isFilledState || !!e.isFocused || !!e.shrink);
+import { spread as T, mergeProps as k, insert as l, createComponent as r, effect as _, className as v, setAttribute as C, memo as m, addEventListener as S, template as d, delegateEvents as W } from "solid-js/web";
+import { splitProps as D, children as u, Show as s } from "solid-js";
+import c from "clsx";
+import { TextFieldAdornment as x } from "./textFieldAdornment.js";
+var E = /* @__PURE__ */ d("<label>"), H = /* @__PURE__ */ d("<span>"), M = /* @__PURE__ */ d("<fieldset><legend>"), N = /* @__PURE__ */ d("<p class=smwb-text-field__helper-line><span class=smwb-text-field__helper-text>"), P = /* @__PURE__ */ d("<div><div class=smwb-text-field__input-holder>"), B = /* @__PURE__ */ d("<span class=smwb-notranslate>&#8203;");
+function y(g) {
+  const [e, $] = D(g, ["label", "helperText", "variant", "disabled", "class", "error", "fullWidth", "isFilledState", "isFocused", "for", "shrink", "children", "onHolderMouseDown", "startAdornment", "endAdornment", "inline"]), A = u(() => e.inline ? void 0 : e.helperText), h = u(() => e.startAdornment), f = u(() => e.endAdornment), b = () => A() ?? " ", F = () => e.variant === "filled", w = () => !!e.label && (!!e.isFilledState || !!e.isFocused || !!e.shrink);
   return (() => {
-    var a = E(), i = a.firstChild;
-    return g(a, $(x, {
+    var o = P(), i = o.firstChild;
+    return T(o, k($, {
       get class() {
-        return u(e.class, "smwb-text-field", {
-          "smwb-text-field--filled": !e.inline && v(),
+        return c(e.class, "smwb-text-field", {
+          "smwb-text-field--filled": !e.inline && F(),
           "smwb-text-field--inline": e.inline,
           "smwb-text-field--focused": !e.inline && e.isFocused,
           "smwb-text-field--error": e.error,
@@ -19,28 +19,28 @@ function L(p) {
         });
       },
       "data-testid": "text-field"
-    }), !1, !0), l(a, n(d, {
+    }), !1, !0), l(o, r(s, {
       get when() {
         return m(() => !e.inline)() && e.label;
       },
       get children() {
-        var t = C();
-        return l(t, () => e.label), b((r) => {
-          var o = u("smwb-text-field__label", {
-            "smwb-text-field__label--shrink": f()
-          }), h = e.for || "";
-          return o !== r.e && w(t, r.e = o), h !== r.t && A(t, "for", r.t = h), r;
+        var t = E();
+        return l(t, () => e.label), _((n) => {
+          var a = c("smwb-text-field__label", {
+            "smwb-text-field__label--shrink": w()
+          }), p = e.for || "";
+          return a !== n.e && v(t, n.e = a), p !== n.t && C(t, "for", n.t = p), n;
         }, {
           e: void 0,
           t: void 0
         }), t;
       }
-    }), i), F(i, "mousedown", e.onHolderMouseDown, !0), l(i, n(d, {
+    }), i), S(i, "mousedown", e.onHolderMouseDown, !0), l(i, r(s, {
       get when() {
-        return e.startAdornment;
+        return h();
       },
       get children() {
-        return n(_, {
+        return r(x, {
           get variant() {
             return e.variant;
           },
@@ -49,57 +49,57 @@ function L(p) {
           },
           position: "start",
           get children() {
-            return e.startAdornment;
+            return h();
           }
         });
       }
-    }), null), l(i, () => e.children, null), l(i, n(d, {
+    }), null), l(i, () => e.children, null), l(i, r(s, {
       get when() {
-        return e.endAdornment;
+        return f();
       },
       get children() {
-        return n(_, {
+        return r(x, {
           position: "end",
           get children() {
-            return e.endAdornment;
+            return f();
           }
         });
       }
-    }), null), l(i, n(d, {
+    }), null), l(i, r(s, {
       get when() {
         return m(() => !e.inline)() && e.variant === "outlined";
       },
       get children() {
-        var t = W(), r = t.firstChild;
-        return l(r, n(d, {
+        var t = M(), n = t.firstChild;
+        return l(n, r(s, {
           get when() {
             return e.label;
           },
           get fallback() {
-            return H();
+            return B();
           },
           get children() {
-            var o = S();
-            return l(o, () => e.label), o;
+            var a = H();
+            return l(a, () => e.label), a;
           }
-        })), b(() => w(t, u("smwb-text-field__notched", {
+        })), _(() => v(t, c("smwb-text-field__notched", {
           "smwb-text-field__notched--with-label": e.label,
-          "smwb-text-field__notched--active": f()
+          "smwb-text-field__notched--active": w()
         }))), t;
       }
-    }), null), l(a, n(d, {
+    }), null), l(o, r(s, {
       get when() {
-        return m(() => !e.inline)() && c();
+        return m(() => !e.inline)() && b();
       },
       get children() {
-        var t = D(), r = t.firstChild;
-        return l(r, c), t;
+        var t = N(), n = t.firstChild;
+        return l(n, b), t;
       }
-    }), null), a;
+    }), null), o;
   })();
 }
-T(["mousedown"]);
+W(["mousedown"]);
 export {
-  L as TextFieldWrapper
+  y as TextFieldWrapper
 };
 //# sourceMappingURL=textFieldWrapper.js.map

package/dist/headless/components/inputs/textField/textFieldWrapper.js.map

@@ -1 +1 @@
-{"version":3,"file":"textFieldWrapper.js","sources":["../../../../../src/components/inputs/textField/textFieldWrapper.tsx"],"sourcesContent":["import { type JSX, Show, splitProps } from \"solid-js\";\nimport cn from \"clsx\";\nimport { TextFieldAdornment } from \"./textFieldAdornment\";\nimport type { TextFieldVariant } from \"./types\";\n\nexport interface TextFieldWrapperProps extends JSX.HTMLAttributes<HTMLDivElement> {\n  label?: string | undefined;\n  helperText?: JSX.Element;\n  variant?: TextFieldVariant | undefined;\n  disabled?: boolean | undefined;\n  error?: boolean | undefined;\n  fullWidth?: boolean | undefined;\n  isFilledState?: boolean | undefined;\n  isFocused?: boolean | undefined;\n  for?: string | undefined;\n  shrink?: boolean | undefined;\n  onHolderMouseDown?: JSX.EventHandlerUnion<HTMLDivElement, MouseEvent>;\n  startAdornment?: JSX.Element;\n  endAdornment?: JSX.Element;\n  inline?: boolean | undefined;\n  children?: JSX.Element;\n}\n\nexport function TextFieldWrapper(props: TextFieldWrapperProps): JSX.Element {\n  const [local, rest] = splitProps(props, [\n    \"label\",\n    \"helperText\",\n    \"variant\",\n    \"disabled\",\n    \"class\",\n    \"error\",\n    \"fullWidth\",\n    \"isFilledState\",\n    \"isFocused\",\n    \"for\",\n    \"shrink\",\n    \"children\",\n    \"onHolderMouseDown\",\n    \"startAdornment\",\n    \"endAdornment\",\n    \"inline\",\n  ]);\n\n  const helperText = (): JSX.Element => local.helperText ?? \" \";\n  const isFilledVariant = (): boolean => local.variant === \"filled\";\n  const isNotchedActive = (): boolean =>\n    !!local.label && (!!local.isFilledState || !!local.isFocused || !!local.shrink);\n\n  return (\n    <div\n      {...rest}\n      class={cn(local.class, \"smwb-text-field\", {\n        \"smwb-text-field--filled\": !local.inline && isFilledVariant(),\n        \"smwb-text-field--inline\": local.inline,\n        \"smwb-text-field--focused\": !local.inline && local.isFocused,\n        \"smwb-text-field--error\": local.error,\n        \"smwb-text-field--disabled\": local.disabled,\n        \"smwb-text-field--full-width\": local.fullWidth,\n      })}\n      data-testid=\"text-field\"\n    >\n      <Show when={!local.inline && local.label}>\n        <label\n          class={cn(\"smwb-text-field__label\", { \"smwb-text-field__label--shrink\": isNotchedActive() })}\n          for={local.for || \"\"}\n        >\n          {local.label}\n        </label>\n      </Show>\n      <div class=\"smwb-text-field__input-holder\" onMouseDown={local.onHolderMouseDown}>\n        <Show when={local.startAdornment}>\n          <TextFieldAdornment variant={local.variant} inline={Boolean(local.inline)} position=\"start\">\n            {local.startAdornment}\n          </TextFieldAdornment>\n        </Show>\n        {local.children}\n        <Show when={local.endAdornment}>\n          <TextFieldAdornment position=\"end\">{local.endAdornment}</TextFieldAdornment>\n        </Show>\n        <Show when={!local.inline && local.variant === \"outlined\"}>\n          <fieldset\n            class={cn(\"smwb-text-field__notched\", {\n              \"smwb-text-field__notched--with-label\": local.label,\n              \"smwb-text-field__notched--active\": isNotchedActive(),\n            })}\n          >\n            <legend>\n              <Show when={local.label} fallback={<span class=\"smwb-notranslate\">&#8203;</span>}>\n                <span>{local.label}</span>\n              </Show>\n            </legend>\n          </fieldset>\n        </Show>\n      </div>\n      <Show when={!local.inline && helperText()}>\n        <p class=\"smwb-text-field__helper-line\">\n          <span class=\"smwb-text-field__helper-text\">{helperText()}</span>\n        </p>\n      </Show>\n    </div>\n  );\n}\n\nexport default TextFieldWrapper;\n"],"names":["TextFieldWrapper","props","local","rest","splitProps","helperText","isFilledVariant","variant","isNotchedActive","label","isFilledState","isFocused","shrink","_el$","_tmpl$5","_el$3","firstChild","_$spread","_$mergeProps","cn","class","inline","error","disabled","fullWidth","_$insert","_$createComponent","Show","when","_$memo","children","_el$2","_tmpl$","_$effect","_p$","_v$","_v$2","for","e","_$className","t","_$setAttribute","undefined","_$addEventListener","onHolderMouseDown","startAdornment","TextFieldAdornment","Boolean","position","endAdornment","_el$4","_tmpl$3","_el$5","fallback","_tmpl$6","_el$6","_tmpl$2","_el$7","_tmpl$4","_el$8","_$delegateEvents"],"mappings":"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"}
+{"version":3,"file":"textFieldWrapper.js","sources":["../../../../../src/components/inputs/textField/textFieldWrapper.tsx"],"sourcesContent":["import { type JSX, Show, children, splitProps } from \"solid-js\";\nimport cn from \"clsx\";\nimport { TextFieldAdornment } from \"./textFieldAdornment\";\nimport type { TextFieldVariant } from \"./types\";\n\nexport interface TextFieldWrapperProps extends JSX.HTMLAttributes<HTMLDivElement> {\n  label?: string | undefined;\n  helperText?: JSX.Element;\n  variant?: TextFieldVariant | undefined;\n  disabled?: boolean | undefined;\n  error?: boolean | undefined;\n  fullWidth?: boolean | undefined;\n  isFilledState?: boolean | undefined;\n  isFocused?: boolean | undefined;\n  for?: string | undefined;\n  shrink?: boolean | undefined;\n  onHolderMouseDown?: JSX.EventHandlerUnion<HTMLDivElement, MouseEvent>;\n  startAdornment?: JSX.Element;\n  endAdornment?: JSX.Element;\n  inline?: boolean | undefined;\n  children?: JSX.Element;\n}\n\nexport function TextFieldWrapper(props: TextFieldWrapperProps): JSX.Element {\n  const [local, rest] = splitProps(props, [\n    \"label\",\n    \"helperText\",\n    \"variant\",\n    \"disabled\",\n    \"class\",\n    \"error\",\n    \"fullWidth\",\n    \"isFilledState\",\n    \"isFocused\",\n    \"for\",\n    \"shrink\",\n    \"children\",\n    \"onHolderMouseDown\",\n    \"startAdornment\",\n    \"endAdornment\",\n    \"inline\",\n  ]);\n\n  // Read each slot once: markup passed as a prop is created anew on every read,\n  // and during hydration a copy the server never rendered has no DOM node.\n  // The helper text is read only where it is drawn: not for an inline field.\n  const helper = children(() => (local.inline ? undefined : local.helperText));\n  const startAdornment = children(() => local.startAdornment);\n  const endAdornment = children(() => local.endAdornment);\n  const helperText = (): JSX.Element => helper() ?? \" \";\n  const isFilledVariant = (): boolean => local.variant === \"filled\";\n  const isNotchedActive = (): boolean =>\n    !!local.label && (!!local.isFilledState || !!local.isFocused || !!local.shrink);\n\n  return (\n    <div\n      {...rest}\n      class={cn(local.class, \"smwb-text-field\", {\n        \"smwb-text-field--filled\": !local.inline && isFilledVariant(),\n        \"smwb-text-field--inline\": local.inline,\n        \"smwb-text-field--focused\": !local.inline && local.isFocused,\n        \"smwb-text-field--error\": local.error,\n        \"smwb-text-field--disabled\": local.disabled,\n        \"smwb-text-field--full-width\": local.fullWidth,\n      })}\n      data-testid=\"text-field\"\n    >\n      <Show when={!local.inline && local.label}>\n        <label\n          class={cn(\"smwb-text-field__label\", { \"smwb-text-field__label--shrink\": isNotchedActive() })}\n          for={local.for || \"\"}\n        >\n          {local.label}\n        </label>\n      </Show>\n      <div class=\"smwb-text-field__input-holder\" onMouseDown={local.onHolderMouseDown}>\n        <Show when={startAdornment()}>\n          <TextFieldAdornment variant={local.variant} inline={Boolean(local.inline)} position=\"start\">\n            {startAdornment()}\n          </TextFieldAdornment>\n        </Show>\n        {local.children}\n        <Show when={endAdornment()}>\n          <TextFieldAdornment position=\"end\">{endAdornment()}</TextFieldAdornment>\n        </Show>\n        <Show when={!local.inline && local.variant === \"outlined\"}>\n          <fieldset\n            class={cn(\"smwb-text-field__notched\", {\n              \"smwb-text-field__notched--with-label\": local.label,\n              \"smwb-text-field__notched--active\": isNotchedActive(),\n            })}\n          >\n            <legend>\n              <Show when={local.label} fallback={<span class=\"smwb-notranslate\">&#8203;</span>}>\n                <span>{local.label}</span>\n              </Show>\n            </legend>\n          </fieldset>\n        </Show>\n      </div>\n      <Show when={!local.inline && helperText()}>\n        <p class=\"smwb-text-field__helper-line\">\n          <span class=\"smwb-text-field__helper-text\">{helperText()}</span>\n        </p>\n      </Show>\n    </div>\n  );\n}\n\nexport default TextFieldWrapper;\n"],"names":["TextFieldWrapper","props","local","rest","splitProps","helper","children","inline","undefined","helperText","startAdornment","endAdornment","isFilledVariant","variant","isNotchedActive","label","isFilledState","isFocused","shrink","_el$","_tmpl$5","_el$3","firstChild","_$spread","_$mergeProps","cn","class","error","disabled","fullWidth","_$insert","_$createComponent","Show","when","_$memo","_el$2","_tmpl$","_$effect","_p$","_v$","_v$2","for","e","_$className","t","_$setAttribute","_$addEventListener","onHolderMouseDown","TextFieldAdornment","Boolean","position","_el$4","_tmpl$3","_el$5","fallback","_tmpl$6","_el$6","_tmpl$2","_el$7","_tmpl$4","_el$8","_$delegateEvents"],"mappings":"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"}

package/dist/headless/components/inputs/valueSlider/valueSlider.js

@@ -1,44 +1,44 @@
-import { insert as t, createComponent as s, effect as v, setAttribute as _, className as f, template as a, delegateEvents as w } from "solid-js/web";
-import { splitProps as $, Show as d } from "solid-js";
-import g from "clsx";
-import { Slider as R } from "../slider/slider.js";
-var k = /* @__PURE__ */ a("<span class=smwb-value-slider__label>"), A = /* @__PURE__ */ a("<span class=smwb-value-slider__readout>"), y = /* @__PURE__ */ a('<button type=button class=smwb-value-slider__reset><svg viewBox="0 0 24 24"width=16 height=16 aria-hidden=true fill=none stroke=currentColor stroke-width=2><path d="M3 12a9 9 0 1 0 3-6.7M3 4v4h4"stroke-linecap=round stroke-linejoin=round>'), S = /* @__PURE__ */ a("<div class=smwb-value-slider__header><span class=smwb-value-slider__spacer>"), C = /* @__PURE__ */ a("<div>");
-const x = (o, e) => typeof o == "function" ? o(e) : Array.isArray(e) ? `${e[0]} – ${e[1]}` : e == null ? "" : String(e);
-function B(o) {
-  const [e, u] = $(o, ["readout", "endAdornment", "onReset", "resetLabel", "label", "class"]), c = () => e.readout !== void 0 && e.readout !== !1, b = () => e.label != null || c() || e.endAdornment != null || e.onReset != null;
+import { insert as t, createComponent as s, effect as b, setAttribute as f, className as w, template as a, delegateEvents as $ } from "solid-js/web";
+import { splitProps as g, children as R, Show as d } from "solid-js";
+import k from "clsx";
+import { Slider as A } from "../slider/slider.js";
+var y = /* @__PURE__ */ a("<span class=smwb-value-slider__label>"), S = /* @__PURE__ */ a("<span class=smwb-value-slider__readout>"), C = /* @__PURE__ */ a('<button type=button class=smwb-value-slider__reset><svg viewBox="0 0 24 24"width=16 height=16 aria-hidden=true fill=none stroke=currentColor stroke-width=2><path d="M3 12a9 9 0 1 0 3-6.7M3 4v4h4"stroke-linecap=round stroke-linejoin=round>'), x = /* @__PURE__ */ a("<div class=smwb-value-slider__header><span class=smwb-value-slider__spacer>"), L = /* @__PURE__ */ a("<div>");
+const M = (o, e) => typeof o == "function" ? o(e) : Array.isArray(e) ? `${e[0]} – ${e[1]}` : e == null ? "" : String(e);
+function H(o) {
+  const [e, u] = g(o, ["readout", "endAdornment", "onReset", "resetLabel", "label", "class"]), c = R(() => e.endAdornment), m = () => e.readout !== void 0 && e.readout !== !1, p = () => e.label != null || m() || c() != null || e.onReset != null;
   return (() => {
-    var i = C();
+    var i = L();
     return t(i, s(d, {
       get when() {
-        return b();
+        return p();
       },
       get children() {
-        var l = S(), p = l.firstChild;
+        var l = x(), _ = l.firstChild;
         return t(l, s(d, {
           get when() {
             return e.label != null;
           },
           get children() {
-            var r = k();
+            var r = y();
             return t(r, () => e.label), r;
           }
-        }), p), t(l, s(d, {
+        }), _), t(l, s(d, {
           get when() {
-            return c();
+            return m();
           },
           get children() {
-            var r = A();
-            return t(r, () => x(e.readout, u.value)), r;
+            var r = S();
+            return t(r, () => M(e.readout, u.value)), r;
           }
-        }), null), t(l, () => e.endAdornment, null), t(l, s(d, {
+        }), null), t(l, c, null), t(l, s(d, {
           get when() {
             return e.onReset != null;
           },
           get children() {
-            var r = y();
-            return r.$$click = () => e.onReset?.(), v((n) => {
-              var m = e.resetLabel ?? "Reset", h = u.disabled;
-              return m !== n.e && _(r, "aria-label", n.e = m), h !== n.t && (r.disabled = n.t = h), n;
+            var r = C();
+            return r.$$click = () => e.onReset?.(), b((n) => {
+              var h = e.resetLabel ?? "Reset", v = u.disabled;
+              return h !== n.e && f(r, "aria-label", n.e = h), v !== n.t && (r.disabled = n.t = v), n;
             }, {
               e: void 0,
               t: void 0
@@ -46,11 +46,11 @@ function B(o) {
           }
         }), null), l;
       }
-    }), null), t(i, s(R, u), null), v(() => f(i, g("smwb-value-slider", e.class))), i;
+    }), null), t(i, s(A, u), null), b(() => w(i, k("smwb-value-slider", e.class))), i;
   })();
 }
-w(["click"]);
+$(["click"]);
 export {
-  B as ValueSlider
+  H as ValueSlider
 };
 //# sourceMappingURL=valueSlider.js.map

package/dist/headless/components/inputs/valueSlider/valueSlider.js.map

@@ -1 +1 @@
-{"version":3,"file":"valueSlider.js","sources":["../../../../../src/components/inputs/valueSlider/valueSlider.tsx"],"sourcesContent":["import { type JSX, Show, splitProps } from \"solid-js\";\nimport cn from \"clsx\";\nimport { Slider, type SliderProps, type SliderValue } from \"../slider\";\n\nexport interface ValueSliderProps extends SliderProps {\n  /**\n   * Read-only value readout beside the label. `true` shows the raw value; pass a\n   * formatter for units/precision (e.g. `(v) => `${v}%``). Reflects `props.value`.\n   */\n  readout?: boolean | ((value: SliderValue | undefined) => string);\n  /** Content at the end of the header row — a reset button, a favourite star, etc. */\n  endAdornment?: JSX.Element;\n  /** Renders a built-in reset control in the header; called on click. */\n  onReset?: () => void;\n  /** Accessible label for the reset control. */\n  resetLabel?: string;\n}\n\nconst formatReadout = (\n  readout: ValueSliderProps[\"readout\"],\n  value: SliderValue | undefined,\n): string => {\n  if (typeof readout === \"function\") return readout(value);\n  if (Array.isArray(value)) return `${value[0]} – ${value[1]}`;\n  return value == null ? \"\" : String(value);\n};\n\n/**\n * `Slider` plus the value-readout + adornment header row every app rebuilds: a\n * read-only formatted value next to the label, an optional reset \"eraser\", and an\n * `endAdornment` slot (favourite star, etc.). A drop-in preset — all `Slider`\n * props pass through; the label is rendered in the header instead of inside Slider.\n */\nexport function ValueSlider(props: ValueSliderProps): JSX.Element {\n  const [local, sliderProps] = splitProps(props, [\n    \"readout\",\n    \"endAdornment\",\n    \"onReset\",\n    \"resetLabel\",\n    \"label\",\n    \"class\",\n  ]);\n\n  const hasReadout = (): boolean => local.readout !== undefined && local.readout !== false;\n  const showHeader = (): boolean =>\n    local.label != null || hasReadout() || local.endAdornment != null || local.onReset != null;\n\n  return (\n    <div class={cn(\"smwb-value-slider\", local.class)}>\n      <Show when={showHeader()}>\n        <div class=\"smwb-value-slider__header\">\n          <Show when={local.label != null}>\n            <span class=\"smwb-value-slider__label\">{local.label}</span>\n          </Show>\n          <span class=\"smwb-value-slider__spacer\" />\n          <Show when={hasReadout()}>\n            <span class=\"smwb-value-slider__readout\">{formatReadout(local.readout, sliderProps.value)}</span>\n          </Show>\n          {local.endAdornment}\n          <Show when={local.onReset != null}>\n            <button\n              type=\"button\"\n              class=\"smwb-value-slider__reset\"\n              aria-label={local.resetLabel ?? \"Reset\"}\n              disabled={sliderProps.disabled}\n              onClick={() => local.onReset?.()}\n            >\n              <svg viewBox=\"0 0 24 24\" width=\"16\" height=\"16\" aria-hidden=\"true\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\">\n                <path d=\"M3 12a9 9 0 1 0 3-6.7M3 4v4h4\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\n              </svg>\n            </button>\n          </Show>\n        </div>\n      </Show>\n      <Slider {...sliderProps} />\n    </div>\n  );\n}\n\nexport default ValueSlider;\n"],"names":["formatReadout","readout","value","Array","isArray","String","ValueSlider","props","local","sliderProps","splitProps","hasReadout","undefined","showHeader","label","endAdornment","onReset","_el$","_tmpl$5","_$insert","_$createComponent","Show","when","children","_el$2","_tmpl$4","_el$4","firstChild","_el$3","_tmpl$","_el$5","_tmpl$2","_el$6","_tmpl$3","$$click","_$effect","_p$","_v$","resetLabel","_v$2","disabled","e","_$setAttribute","t","Slider","_$className","cn","class","_$delegateEvents"],"mappings":";;;;;AAkBA,MAAMA,IAAgBA,CACpBC,GACAC,MAEI,OAAOD,KAAY,aAAmBA,EAAQC,CAAK,IACnDC,MAAMC,QAAQF,CAAK,IAAU,GAAGA,EAAM,CAAC,CAAC,MAAMA,EAAM,CAAC,CAAC,KACnDA,KAAS,OAAO,KAAKG,OAAOH,CAAK;AASnC,SAASI,EAAYC,GAAsC;AAChE,QAAM,CAACC,GAAOC,CAAW,IAAIC,EAAWH,GAAO,CAC7C,WACA,gBACA,WACA,cACA,SACA,OAAO,CACR,GAEKI,IAAaA,MAAeH,EAAMP,YAAYW,UAAaJ,EAAMP,YAAY,IAC7EY,IAAaA,MACjBL,EAAMM,SAAS,QAAQH,OAAgBH,EAAMO,gBAAgB,QAAQP,EAAMQ,WAAW;AAExF,UAAA,MAAA;AAAA,QAAAC,IAAAC,EAAAA;AAAAC,WAAAA,EAAAF,GAAAG,EAEKC,GAAI;AAAA,MAAA,IAACC,OAAI;AAAA,eAAET,EAAAA;AAAAA,MAAY;AAAA,MAAA,IAAAU,WAAA;AAAA,YAAAC,IAAAC,EAAAA,GAAAC,IAAAF,EAAAG;AAAAR,eAAAA,EAAAK,GAAAJ,EAEnBC,GAAI;AAAA,UAAA,IAACC,OAAI;AAAA,mBAAEd,EAAMM,SAAS;AAAA,UAAI;AAAA,UAAA,IAAAS,WAAA;AAAA,gBAAAK,IAAAC,EAAAA;AAAAV,mBAAAA,EAAAS,GAAA,MACWpB,EAAMM,KAAK,GAAAc;AAAAA,UAAA;AAAA,QAAA,CAAA,GAAAF,CAAA,GAAAP,EAAAK,GAAAJ,EAGpDC,GAAI;AAAA,UAAA,IAACC,OAAI;AAAA,mBAAEX,EAAAA;AAAAA,UAAY;AAAA,UAAA,IAAAY,WAAA;AAAA,gBAAAO,IAAAC,EAAAA;AAAAZ,mBAAAA,EAAAW,GAAA,MACoB9B,EAAcQ,EAAMP,SAASQ,EAAYP,KAAK,CAAC,GAAA4B;AAAAA,UAAA;AAAA,QAAA,CAAA,GAAA,IAAA,GAAAX,EAAAK,GAAA,MAE1FhB,EAAMO,cAAY,IAAA,GAAAI,EAAAK,GAAAJ,EAClBC,GAAI;AAAA,UAAA,IAACC,OAAI;AAAA,mBAAEd,EAAMQ,WAAW;AAAA,UAAI;AAAA,UAAA,IAAAO,WAAA;AAAA,gBAAAS,IAAAC,EAAAA;AAAAD,mBAAAA,EAAAE,UAMpB,MAAM1B,EAAMQ,UAAAA,GAAWmB,EAAAC,CAAAA,MAAA;AAAA,kBAAAC,IAFpB7B,EAAM8B,cAAc,SAAOC,IAC7B9B,EAAY+B;AAAQH,qBAAAA,MAAAD,EAAAK,KAAAC,EAAAV,GAAA,cAAAI,EAAAK,IAAAJ,CAAA,GAAAE,MAAAH,EAAAO,MAAAX,EAAAQ,WAAAJ,EAAAO,IAAAJ,IAAAH;AAAAA,YAAA,GAAA;AAAA,cAAAK,GAAA7B;AAAAA,cAAA+B,GAAA/B;AAAAA,YAAAA,CAAA,GAAAoB;AAAAA,UAAA;AAAA,QAAA,CAAA,GAAA,IAAA,GAAAR;AAAAA,MAAA;AAAA,IAAA,CAAA,GAAA,IAAA,GAAAL,EAAAF,GAAAG,EAUrCwB,GAAWnC,CAAW,GAAA,IAAA,GAAA0B,EAAA,MAAAU,EAAA5B,GA1Bb6B,EAAG,qBAAqBtC,EAAMuC,KAAK,CAAC,CAAA,GAAA9B;AAAAA,EAAA,GAAA;AA6BpD;AAE2B+B,EAAA,CAAA,OAAA,CAAA;"}
+{"version":3,"file":"valueSlider.js","sources":["../../../../../src/components/inputs/valueSlider/valueSlider.tsx"],"sourcesContent":["import { type JSX, Show, children, splitProps } from \"solid-js\";\nimport cn from \"clsx\";\nimport { Slider, type SliderProps, type SliderValue } from \"../slider\";\n\nexport interface ValueSliderProps extends SliderProps {\n  /**\n   * Read-only value readout beside the label. `true` shows the raw value; pass a\n   * formatter for units/precision (e.g. `(v) => `${v}%``). Reflects `props.value`.\n   */\n  readout?: boolean | ((value: SliderValue | undefined) => string);\n  /** Content at the end of the header row — a reset button, a favourite star, etc. */\n  endAdornment?: JSX.Element;\n  /** Renders a built-in reset control in the header; called on click. */\n  onReset?: () => void;\n  /** Accessible label for the reset control. */\n  resetLabel?: string;\n}\n\nconst formatReadout = (\n  readout: ValueSliderProps[\"readout\"],\n  value: SliderValue | undefined,\n): string => {\n  if (typeof readout === \"function\") return readout(value);\n  if (Array.isArray(value)) return `${value[0]} – ${value[1]}`;\n  return value == null ? \"\" : String(value);\n};\n\n/**\n * `Slider` plus the value-readout + adornment header row every app rebuilds: a\n * read-only formatted value next to the label, an optional reset \"eraser\", and an\n * `endAdornment` slot (favourite star, etc.). A drop-in preset — all `Slider`\n * props pass through; the label is rendered in the header instead of inside Slider.\n */\nexport function ValueSlider(props: ValueSliderProps): JSX.Element {\n  const [local, sliderProps] = splitProps(props, [\n    \"readout\",\n    \"endAdornment\",\n    \"onReset\",\n    \"resetLabel\",\n    \"label\",\n    \"class\",\n  ]);\n\n  // Read once: markup passed as a prop is created anew on every read, and\n  // during hydration a copy the server never rendered has no DOM node.\n  const endAdornment = children(() => local.endAdornment);\n  const hasReadout = (): boolean => local.readout !== undefined && local.readout !== false;\n  const showHeader = (): boolean =>\n    local.label != null || hasReadout() || endAdornment() != null || local.onReset != null;\n\n  return (\n    <div class={cn(\"smwb-value-slider\", local.class)}>\n      <Show when={showHeader()}>\n        <div class=\"smwb-value-slider__header\">\n          <Show when={local.label != null}>\n            <span class=\"smwb-value-slider__label\">{local.label}</span>\n          </Show>\n          <span class=\"smwb-value-slider__spacer\" />\n          <Show when={hasReadout()}>\n            <span class=\"smwb-value-slider__readout\">{formatReadout(local.readout, sliderProps.value)}</span>\n          </Show>\n          {endAdornment()}\n          <Show when={local.onReset != null}>\n            <button\n              type=\"button\"\n              class=\"smwb-value-slider__reset\"\n              aria-label={local.resetLabel ?? \"Reset\"}\n              disabled={sliderProps.disabled}\n              onClick={() => local.onReset?.()}\n            >\n              <svg viewBox=\"0 0 24 24\" width=\"16\" height=\"16\" aria-hidden=\"true\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\">\n                <path d=\"M3 12a9 9 0 1 0 3-6.7M3 4v4h4\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\n              </svg>\n            </button>\n          </Show>\n        </div>\n      </Show>\n      <Slider {...sliderProps} />\n    </div>\n  );\n}\n\nexport default ValueSlider;\n"],"names":["formatReadout","readout","value","Array","isArray","String","ValueSlider","props","local","sliderProps","splitProps","endAdornment","children","hasReadout","undefined","showHeader","label","onReset","_el$","_tmpl$5","_$insert","_$createComponent","Show","when","_el$2","_tmpl$4","_el$4","firstChild","_el$3","_tmpl$","_el$5","_tmpl$2","_el$6","_tmpl$3","$$click","_$effect","_p$","_v$","resetLabel","_v$2","disabled","e","_$setAttribute","t","Slider","_$className","cn","class","_$delegateEvents"],"mappings":";;;;;AAkBA,MAAMA,IAAgBA,CACpBC,GACAC,MAEI,OAAOD,KAAY,aAAmBA,EAAQC,CAAK,IACnDC,MAAMC,QAAQF,CAAK,IAAU,GAAGA,EAAM,CAAC,CAAC,MAAMA,EAAM,CAAC,CAAC,KACnDA,KAAS,OAAO,KAAKG,OAAOH,CAAK;AASnC,SAASI,EAAYC,GAAsC;AAChE,QAAM,CAACC,GAAOC,CAAW,IAAIC,EAAWH,GAAO,CAC7C,WACA,gBACA,WACA,cACA,SACA,OAAO,CACR,GAIKI,IAAeC,EAAS,MAAMJ,EAAMG,YAAY,GAChDE,IAAaA,MAAeL,EAAMP,YAAYa,UAAaN,EAAMP,YAAY,IAC7Ec,IAAaA,MACjBP,EAAMQ,SAAS,QAAQH,OAAgBF,OAAkB,QAAQH,EAAMS,WAAW;AAEpF,UAAA,MAAA;AAAA,QAAAC,IAAAC,EAAAA;AAAAC,WAAAA,EAAAF,GAAAG,EAEKC,GAAI;AAAA,MAAA,IAACC,OAAI;AAAA,eAAER,EAAAA;AAAAA,MAAY;AAAA,MAAA,IAAAH,WAAA;AAAA,YAAAY,IAAAC,EAAAA,GAAAC,IAAAF,EAAAG;AAAAP,eAAAA,EAAAI,GAAAH,EAEnBC,GAAI;AAAA,UAAA,IAACC,OAAI;AAAA,mBAAEf,EAAMQ,SAAS;AAAA,UAAI;AAAA,UAAA,IAAAJ,WAAA;AAAA,gBAAAgB,IAAAC,EAAAA;AAAAT,mBAAAA,EAAAQ,GAAA,MACWpB,EAAMQ,KAAK,GAAAY;AAAAA,UAAA;AAAA,QAAA,CAAA,GAAAF,CAAA,GAAAN,EAAAI,GAAAH,EAGpDC,GAAI;AAAA,UAAA,IAACC,OAAI;AAAA,mBAAEV,EAAAA;AAAAA,UAAY;AAAA,UAAA,IAAAD,WAAA;AAAA,gBAAAkB,IAAAC,EAAAA;AAAAX,mBAAAA,EAAAU,GAAA,MACoB9B,EAAcQ,EAAMP,SAASQ,EAAYP,KAAK,CAAC,GAAA4B;AAAAA,UAAA;AAAA,QAAA,CAAA,GAAA,IAAA,GAAAV,EAAAI,GAE1Fb,GAAY,IAAA,GAAAS,EAAAI,GAAAH,EACZC,GAAI;AAAA,UAAA,IAACC,OAAI;AAAA,mBAAEf,EAAMS,WAAW;AAAA,UAAI;AAAA,UAAA,IAAAL,WAAA;AAAA,gBAAAoB,IAAAC,EAAAA;AAAAD,mBAAAA,EAAAE,UAMpB,MAAM1B,EAAMS,UAAAA,GAAWkB,EAAAC,CAAAA,MAAA;AAAA,kBAAAC,IAFpB7B,EAAM8B,cAAc,SAAOC,IAC7B9B,EAAY+B;AAAQH,qBAAAA,MAAAD,EAAAK,KAAAC,EAAAV,GAAA,cAAAI,EAAAK,IAAAJ,CAAA,GAAAE,MAAAH,EAAAO,MAAAX,EAAAQ,WAAAJ,EAAAO,IAAAJ,IAAAH;AAAAA,YAAA,GAAA;AAAA,cAAAK,GAAA3B;AAAAA,cAAA6B,GAAA7B;AAAAA,YAAAA,CAAA,GAAAkB;AAAAA,UAAA;AAAA,QAAA,CAAA,GAAA,IAAA,GAAAR;AAAAA,MAAA;AAAA,IAAA,CAAA,GAAA,IAAA,GAAAJ,EAAAF,GAAAG,EAUrCuB,GAAWnC,CAAW,GAAA,IAAA,GAAA0B,EAAA,MAAAU,EAAA3B,GA1Bb4B,EAAG,qBAAqBtC,EAAMuC,KAAK,CAAC,CAAA,GAAA7B;AAAAA,EAAA,GAAA;AA6BpD;AAE2B8B,EAAA,CAAA,OAAA,CAAA;"}

package/dist/headless/components/layout/appLayout/appLayout.js

@@ -1,76 +1,76 @@
-import { use as A, spread as L, mergeProps as P, insert as t, createComponent as s, setAttribute as c, effect as x, template as o, delegateEvents as H } from "solid-js/web";
-import { mergeProps as I, splitProps as j, children as m, Show as p } from "solid-js";
-import z from "clsx";
-import { createControllableState as E } from "../../../primitives/createControllableState.js";
-import { createId as R } from "../../../primitives/createId.js";
-import { mergeRefs as V } from "../../../primitives/mergeRefs.js";
-import { Icon as q } from "../../base/icon/icon.js";
-var B = /* @__PURE__ */ o("<div class=smwb-app-layout__header>"), D = /* @__PURE__ */ o("<div class=smwb-app-layout__collapse>"), F = /* @__PURE__ */ o("<aside class=smwb-app-layout__sidebar>"), G = /* @__PURE__ */ o("<div class=smwb-app-layout__footer>"), J = /* @__PURE__ */ o("<div><div class=smwb-app-layout__body><div class=smwb-app-layout__content>"), K = /* @__PURE__ */ o("<button type=button class=smwb-app-layout__collapse-btn>");
-const $ = (d) => typeof d == "number" ? `${d}px` : d;
-function Z(d) {
-  const S = I({
+import { use as L, spread as P, mergeProps as x, insert as t, createComponent as o, setAttribute as c, effect as H, template as s, delegateEvents as I } from "solid-js/web";
+import { mergeProps as j, splitProps as z, children as u, Show as p } from "solid-js";
+import E from "clsx";
+import { createControllableState as R } from "../../../primitives/createControllableState.js";
+import { createId as V } from "../../../primitives/createId.js";
+import { mergeRefs as q } from "../../../primitives/mergeRefs.js";
+import { Icon as B } from "../../base/icon/icon.js";
+var D = /* @__PURE__ */ s("<div class=smwb-app-layout__header>"), F = /* @__PURE__ */ s("<div class=smwb-app-layout__collapse>"), G = /* @__PURE__ */ s("<aside class=smwb-app-layout__sidebar>"), J = /* @__PURE__ */ s("<div class=smwb-app-layout__footer>"), K = /* @__PURE__ */ s("<div><div class=smwb-app-layout__body><div class=smwb-app-layout__content>"), M = /* @__PURE__ */ s("<button type=button class=smwb-app-layout__collapse-btn>");
+const S = (i) => typeof i == "number" ? `${i}px` : i;
+function ee(i) {
+  const k = j({
     sidebarWidth: 260,
     defaultSidebarCollapsed: !1,
     collapsible: !1,
     collapseToggleAriaLabel: "Toggle navigation",
     sidebarCollapsedWidth: 72,
     stickyHeader: !0
-  }, d), [e, k] = j(S, ["header", "sidebar", "footer", "sidebarWidth", "sidebarCollapsed", "defaultSidebarCollapsed", "onSidebarCollapsedChange", "collapsible", "collapseToggle", "collapseToggleAriaLabel", "sidebarCollapsedWidth", "stickyHeader", "class", "style", "children", "ref"]), [i, T] = E({
+  }, i), [e, T] = z(k, ["header", "sidebar", "footer", "sidebarWidth", "sidebarCollapsed", "defaultSidebarCollapsed", "onSidebarCollapsedChange", "collapsible", "collapseToggle", "collapseToggleAriaLabel", "sidebarCollapsedWidth", "stickyHeader", "class", "style", "children", "ref"]), [d, W] = R({
     value: () => e.sidebarCollapsed,
     defaultValue: e.defaultSidebarCollapsed,
     onChange: (a) => e.onSidebarCollapsedChange?.(a)
-  }), g = R(), f = m(() => e.header), h = m(() => e.sidebar), _ = m(() => e.footer), W = () => ({
-    "--smui-app-sidebar-w": i() ? $(e.sidebarCollapsedWidth) : $(e.sidebarWidth),
+  }), g = V(), f = u(() => e.header), h = u(() => e.sidebar), _ = u(() => e.footer), y = u(() => e.collapsible ? e.collapseToggle : void 0), A = () => ({
+    "--smui-app-sidebar-w": d() ? S(e.sidebarCollapsedWidth) : S(e.sidebarWidth),
     ...typeof e.style == "object" && e.style ? e.style : {}
   });
   return (() => {
-    var a = J(), u = a.firstChild, b = u.firstChild, y = V(e.ref);
-    return typeof y == "function" && A(y, a), L(a, P(k, {
+    var a = K(), b = a.firstChild, m = b.firstChild, v = q(e.ref);
+    return typeof v == "function" && L(v, a), P(a, x(T, {
       "data-testid": "app-layout",
       get class() {
-        return z("smwb-app-layout", {
+        return E("smwb-app-layout", {
           "smwb-app-layout_sticky-header": e.stickyHeader,
-          "smwb-app-layout_collapsed": i()
+          "smwb-app-layout_collapsed": d()
         }, e.class);
       },
       get style() {
-        return W();
+        return A();
       }
-    }), !1, !0), t(a, s(p, {
+    }), !1, !0), t(a, o(p, {
       get when() {
         return f();
       },
       get children() {
-        var l = B();
+        var l = D();
         return t(l, f), l;
       }
-    }), u), t(u, s(p, {
+    }), b), t(b, o(p, {
       get when() {
         return h();
       },
       get children() {
-        var l = F();
-        return c(l, "id", g), t(l, s(p, {
+        var l = G();
+        return c(l, "id", g), t(l, o(p, {
           get when() {
             return e.collapsible;
           },
           get children() {
-            var v = D();
-            return t(v, s(p, {
+            var C = F();
+            return t(C, o(p, {
               get when() {
-                return e.collapseToggle;
+                return y();
               },
               get fallback() {
                 return (() => {
-                  var r = K();
-                  return r.$$click = () => T(!i()), c(r, "aria-controls", g), t(r, s(q, {
+                  var r = M();
+                  return r.$$click = () => W(!d()), c(r, "aria-controls", g), t(r, o(B, {
                     get name() {
-                      return i() ? "chevron_right" : "chevron_left";
+                      return d() ? "chevron_right" : "chevron_left";
                     },
                     size: 20
-                  })), x((n) => {
-                    var C = e.collapseToggleAriaLabel, w = !i();
-                    return C !== n.e && c(r, "aria-label", n.e = C), w !== n.t && c(r, "aria-expanded", n.t = w), n;
+                  })), H((n) => {
+                    var w = e.collapseToggleAriaLabel, $ = !d();
+                    return w !== n.e && c(r, "aria-label", n.e = w), $ !== n.t && c(r, "aria-expanded", n.t = $), n;
                   }, {
                     e: void 0,
                     t: void 0
@@ -78,25 +78,25 @@ function Z(d) {
                 })();
               },
               get children() {
-                return e.collapseToggle;
+                return y();
               }
-            })), v;
+            })), C;
           }
         }), null), t(l, h, null), l;
       }
-    }), b), t(b, () => e.children, null), t(b, s(p, {
+    }), m), t(m, () => e.children, null), t(m, o(p, {
       get when() {
         return _();
       },
       get children() {
-        var l = G();
+        var l = J();
         return t(l, _), l;
       }
     }), null), a;
   })();
 }
-H(["click"]);
+I(["click"]);
 export {
-  Z as AppLayout
+  ee as AppLayout
 };
 //# sourceMappingURL=appLayout.js.map

package/dist/headless/components/layout/appLayout/appLayout.js.map

@@ -1 +1 @@
-{"version":3,"file":"appLayout.js","sources":["../../../../../src/components/layout/appLayout/appLayout.tsx"],"sourcesContent":["import { type JSX, type ParentProps, Show, children, mergeProps, splitProps } from \"solid-js\";\nimport cn from \"clsx\";\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 AppLayoutProps extends JSX.HTMLAttributes<HTMLDivElement> {\n  /** Top bar slot (e.g. <AppBar />). Spans full width. */\n  header?: JSX.Element;\n  /** Side navigation slot (e.g. <Sidebar />). */\n  sidebar?: JSX.Element;\n  /** Footer slot, below the content. */\n  footer?: JSX.Element;\n  /** Sidebar width (px or any CSS length). */\n  sidebarWidth?: number | string;\n  /** Controlled collapsed state of the sidebar rail. */\n  sidebarCollapsed?: boolean;\n  /** Initial collapsed state (uncontrolled). */\n  defaultSidebarCollapsed?: boolean;\n  /** Called whenever the collapsed state changes. */\n  onSidebarCollapsedChange?: (collapsed: boolean) => void;\n  /** Renders a built-in toggle button to collapse/expand the sidebar. */\n  collapsible?: boolean;\n  /** Custom toggle node replacing the default icon button. */\n  collapseToggle?: JSX.Element;\n  /** Accessible label for the default toggle button. */\n  collapseToggleAriaLabel?: string;\n  /** Sidebar collapsed width. */\n  sidebarCollapsedWidth?: number | string;\n  /** Keep the header pinned while content scrolls. */\n  stickyHeader?: boolean;\n  ref?: Ref<HTMLDivElement>;\n}\n\nconst len = (v: number | string): string => (typeof v === \"number\" ? `${v}px` : v);\n\nexport function AppLayout(props: ParentProps<AppLayoutProps>): JSX.Element {\n  const merged = mergeProps(\n    {\n      sidebarWidth: 260 as number | string,\n      defaultSidebarCollapsed: false,\n      collapsible: false,\n      collapseToggleAriaLabel: \"Toggle navigation\",\n      sidebarCollapsedWidth: 72 as number | string,\n      stickyHeader: true,\n    },\n    props\n  );\n  const [local, rest] = splitProps(merged, [\n    \"header\",\n    \"sidebar\",\n    \"footer\",\n    \"sidebarWidth\",\n    \"sidebarCollapsed\",\n    \"defaultSidebarCollapsed\",\n    \"onSidebarCollapsedChange\",\n    \"collapsible\",\n    \"collapseToggle\",\n    \"collapseToggleAriaLabel\",\n    \"sidebarCollapsedWidth\",\n    \"stickyHeader\",\n    \"class\",\n    \"style\",\n    \"children\",\n    \"ref\",\n  ]);\n\n  const [collapsed, setCollapsed] = createControllableState<boolean>({\n    value: () => local.sidebarCollapsed,\n    defaultValue: local.defaultSidebarCollapsed,\n    onChange: (next) => local.onSidebarCollapsedChange?.(next),\n  });\n\n  const sidebarId = createId();\n\n  // Resolve slot props through `children()` so each is created once, in THIS\n  // component's reactive context. A pre-created element passed straight into a\n  // <Show> gets its hydration key at the caller's position but renders at the\n  // Show's, so the hydration walk can't find it (\"Unable to find DOM nodes for\n  // key\"). Resolving here keeps the key sequence aligned on server and client.\n  const headerSlot = children(() => local.header);\n  const sidebarSlot = children(() => local.sidebar);\n  const footerSlot = children(() => local.footer);\n\n  const style = (): JSX.CSSProperties => ({\n    \"--smui-app-sidebar-w\": collapsed() ? len(local.sidebarCollapsedWidth) : len(local.sidebarWidth),\n    ...(typeof local.style === \"object\" && local.style ? local.style : {}),\n  });\n\n  return (\n    <div\n      {...rest}\n      ref={mergeRefs(local.ref)}\n      data-testid=\"app-layout\"\n      class={cn(\n        \"smwb-app-layout\",\n        { \"smwb-app-layout_sticky-header\": local.stickyHeader, \"smwb-app-layout_collapsed\": collapsed() },\n        local.class\n      )}\n      style={style()}\n    >\n      <Show when={headerSlot()}>\n        <div class=\"smwb-app-layout__header\">{headerSlot()}</div>\n      </Show>\n      <div class=\"smwb-app-layout__body\">\n        <Show when={sidebarSlot()}>\n          <aside id={sidebarId} class=\"smwb-app-layout__sidebar\">\n            <Show when={local.collapsible}>\n              <div class=\"smwb-app-layout__collapse\">\n                <Show\n                  when={local.collapseToggle}\n                  fallback={\n                    <button\n                      type=\"button\"\n                      class=\"smwb-app-layout__collapse-btn\"\n                      aria-label={local.collapseToggleAriaLabel}\n                      aria-expanded={!collapsed()}\n                      aria-controls={sidebarId}\n                      onClick={() => setCollapsed(!collapsed())}\n                    >\n                      <Icon name={collapsed() ? \"chevron_right\" : \"chevron_left\"} size={20} />\n                    </button>\n                  }\n                >\n                  {local.collapseToggle}\n                </Show>\n              </div>\n            </Show>\n            {sidebarSlot()}\n          </aside>\n        </Show>\n        <div class=\"smwb-app-layout__content\">\n          {local.children}\n          <Show when={footerSlot()}>\n            <div class=\"smwb-app-layout__footer\">{footerSlot()}</div>\n          </Show>\n        </div>\n      </div>\n    </div>\n  );\n}\n\nexport default AppLayout;\n"],"names":["len","v","AppLayout","props","merged","mergeProps","sidebarWidth","defaultSidebarCollapsed","collapsible","collapseToggleAriaLabel","sidebarCollapsedWidth","stickyHeader","local","rest","splitProps","collapsed","setCollapsed","createControllableState","value","sidebarCollapsed","defaultValue","onChange","next","onSidebarCollapsedChange","sidebarId","createId","headerSlot","children","header","sidebarSlot","sidebar","footerSlot","footer","style","_el$","_tmpl$5","_el$3","firstChild","_el$6","_ref$","mergeRefs","ref","_$use","_$spread","_$mergeProps","cn","class","_$insert","_$createComponent","Show","when","_el$2","_tmpl$","_el$4","_tmpl$3","_$setAttribute","_el$5","_tmpl$2","collapseToggle","fallback","_el$8","_tmpl$6","$$click","Icon","name","size","_$effect","_p$","_v$","_v$2","e","t","undefined","_el$7","_tmpl$4","_$delegateEvents"],"mappings":";;;;;;;;AAmCA,MAAMA,IAAMA,CAACC,MAAgC,OAAOA,KAAM,WAAW,GAAGA,CAAC,OAAOA;AAEzE,SAASC,EAAUC,GAAiD;AACzE,QAAMC,IAASC,EACb;AAAA,IACEC,cAAc;AAAA,IACdC,yBAAyB;AAAA,IACzBC,aAAa;AAAA,IACbC,yBAAyB;AAAA,IACzBC,uBAAuB;AAAA,IACvBC,cAAc;AAAA,EAAA,GAEhBR,CACF,GACM,CAACS,GAAOC,CAAI,IAAIC,EAAWV,GAAQ,CACvC,UACA,WACA,UACA,gBACA,oBACA,2BACA,4BACA,eACA,kBACA,2BACA,yBACA,gBACA,SACA,SACA,YACA,KAAK,CACN,GAEK,CAACW,GAAWC,CAAY,IAAIC,EAAiC;AAAA,IACjEC,OAAOA,MAAMN,EAAMO;AAAAA,IACnBC,cAAcR,EAAML;AAAAA,IACpBc,UAAWC,CAAAA,MAASV,EAAMW,2BAA2BD,CAAI;AAAA,EAAA,CAC1D,GAEKE,IAAYC,EAAAA,GAOZC,IAAaC,EAAS,MAAMf,EAAMgB,MAAM,GACxCC,IAAcF,EAAS,MAAMf,EAAMkB,OAAO,GAC1CC,IAAaJ,EAAS,MAAMf,EAAMoB,MAAM,GAExCC,IAAQA,OAA0B;AAAA,IACtC,wBAAwBlB,MAAcf,EAAIY,EAAMF,qBAAqB,IAAIV,EAAIY,EAAMN,YAAY;AAAA,IAC/F,GAAI,OAAOM,EAAMqB,SAAU,YAAYrB,EAAMqB,QAAQrB,EAAMqB,QAAQ,CAAA;AAAA,EAAC;AAGtE,UAAA,MAAA;AAAA,QAAAC,IAAAC,EAAAA,GAAAC,IAAAF,EAAAG,YAAAC,IAAAF,EAAAC,YAAAE,IAGSC,EAAU5B,EAAM6B,GAAG;AAAC,kBAAAF,KAAA,cAAAG,EAAAH,GAAAL,CAAA,GAAAS,EAAAT,GAAAU,EADrB/B,GAAI;AAAA,MAAA,eAEI;AAAA,MAAY,IAAA,QAAA;AAAA,eACjBgC,EACL,mBACA;AAAA,UAAE,iCAAiCjC,EAAMD;AAAAA,UAAc,6BAA6BI,EAAAA;AAAAA,QAAU,GAC9FH,EAAMkC,KACR;AAAA,MAAC;AAAA,MAAA,IACDb,QAAK;AAAA,eAAEA,EAAAA;AAAAA,MAAO;AAAA,IAAA,CAAA,GAAA,IAAA,EAAA,GAAAc,EAAAb,GAAAc,EAEbC,GAAI;AAAA,MAAA,IAACC,OAAI;AAAA,eAAExB,EAAAA;AAAAA,MAAY;AAAA,MAAA,IAAAC,WAAA;AAAA,YAAAwB,IAAAC,EAAAA;AAAAL,eAAAA,EAAAI,GACgBzB,CAAU,GAAAyB;AAAAA,MAAA;AAAA,IAAA,CAAA,GAAAf,CAAA,GAAAW,EAAAX,GAAAY,EAG/CC,GAAI;AAAA,MAAA,IAACC,OAAI;AAAA,eAAErB,EAAAA;AAAAA,MAAa;AAAA,MAAA,IAAAF,WAAA;AAAA,YAAA0B,IAAAC,EAAAA;AAAAC,eAAAA,EAAAF,GAAA,MACZ7B,CAAS,GAAAuB,EAAAM,GAAAL,EACjBC,GAAI;AAAA,UAAA,IAACC,OAAI;AAAA,mBAAEtC,EAAMJ;AAAAA,UAAW;AAAA,UAAA,IAAAmB,WAAA;AAAA,gBAAA6B,IAAAC,EAAAA;AAAAV,mBAAAA,EAAAS,GAAAR,EAExBC,GAAI;AAAA,cAAA,IACHC,OAAI;AAAA,uBAAEtC,EAAM8C;AAAAA,cAAc;AAAA,cAAA,IAC1BC,WAAQ;AAAA,wBAAA,MAAA;AAAA,sBAAAC,IAAAC,EAAAA;AAAAD,yBAAAA,EAAAE,UAOK,MAAM9C,EAAa,CAACD,GAAW,GAACwC,EAAAK,GAAA,iBAD1BpC,CAAS,GAAAuB,EAAAa,GAAAZ,EAGvBe,GAAI;AAAA,oBAAA,IAACC,OAAI;AAAA,6BAAEjD,EAAAA,IAAc,kBAAkB;AAAA,oBAAc;AAAA,oBAAEkD,MAAM;AAAA,kBAAA,CAAE,CAAA,GAAAC,EAAAC,CAAAA,MAAA;AAAA,wBAAAC,IALxDxD,EAAMH,yBAAuB4D,IAC1B,CAACtD,EAAAA;AAAWqD,2BAAAA,MAAAD,EAAAG,KAAAf,EAAAK,GAAA,cAAAO,EAAAG,IAAAF,CAAA,GAAAC,MAAAF,EAAAI,KAAAhB,EAAAK,GAAA,iBAAAO,EAAAI,IAAAF,CAAA,GAAAF;AAAAA,kBAAA,GAAA;AAAA,oBAAAG,GAAAE;AAAAA,oBAAAD,GAAAC;AAAAA,kBAAAA,CAAA,GAAAZ;AAAAA,gBAAA,GAAA;AAAA,cAAA;AAAA,cAAA,IAAAjC,WAAA;AAAA,uBAQ9Bf,EAAM8C;AAAAA,cAAc;AAAA,YAAA,CAAA,CAAA,GAAAF;AAAAA,UAAA;AAAA,QAAA,CAAA,GAAA,IAAA,GAAAT,EAAAM,GAI1BxB,GAAW,IAAA,GAAAwB;AAAAA,MAAA;AAAA,IAAA,CAAA,GAAAf,CAAA,GAAAS,EAAAT,GAAA,MAIb1B,EAAMe,UAAQ,IAAA,GAAAoB,EAAAT,GAAAU,EACdC,GAAI;AAAA,MAAA,IAACC,OAAI;AAAA,eAAEnB,EAAAA;AAAAA,MAAY;AAAA,MAAA,IAAAJ,WAAA;AAAA,YAAA8C,IAAAC,EAAAA;AAAA3B,eAAAA,EAAA0B,GACgB1C,CAAU,GAAA0C;AAAAA,MAAA;AAAA,IAAA,CAAA,GAAA,IAAA,GAAAvC;AAAAA,EAAA,GAAA;AAM5D;AAEyByC,EAAA,CAAA,OAAA,CAAA;"}
+{"version":3,"file":"appLayout.js","sources":["../../../../../src/components/layout/appLayout/appLayout.tsx"],"sourcesContent":["import { type JSX, type ParentProps, Show, children, mergeProps, splitProps } from \"solid-js\";\nimport cn from \"clsx\";\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 AppLayoutProps extends JSX.HTMLAttributes<HTMLDivElement> {\n  /** Top bar slot (e.g. <AppBar />). Spans full width. */\n  header?: JSX.Element;\n  /** Side navigation slot (e.g. <Sidebar />). */\n  sidebar?: JSX.Element;\n  /** Footer slot, below the content. */\n  footer?: JSX.Element;\n  /** Sidebar width (px or any CSS length). */\n  sidebarWidth?: number | string;\n  /** Controlled collapsed state of the sidebar rail. */\n  sidebarCollapsed?: boolean;\n  /** Initial collapsed state (uncontrolled). */\n  defaultSidebarCollapsed?: boolean;\n  /** Called whenever the collapsed state changes. */\n  onSidebarCollapsedChange?: (collapsed: boolean) => void;\n  /** Renders a built-in toggle button to collapse/expand the sidebar. */\n  collapsible?: boolean;\n  /** Custom toggle node replacing the default icon button. */\n  collapseToggle?: JSX.Element;\n  /** Accessible label for the default toggle button. */\n  collapseToggleAriaLabel?: string;\n  /** Sidebar collapsed width. */\n  sidebarCollapsedWidth?: number | string;\n  /** Keep the header pinned while content scrolls. */\n  stickyHeader?: boolean;\n  ref?: Ref<HTMLDivElement>;\n}\n\nconst len = (v: number | string): string => (typeof v === \"number\" ? `${v}px` : v);\n\nexport function AppLayout(props: ParentProps<AppLayoutProps>): JSX.Element {\n  const merged = mergeProps(\n    {\n      sidebarWidth: 260 as number | string,\n      defaultSidebarCollapsed: false,\n      collapsible: false,\n      collapseToggleAriaLabel: \"Toggle navigation\",\n      sidebarCollapsedWidth: 72 as number | string,\n      stickyHeader: true,\n    },\n    props\n  );\n  const [local, rest] = splitProps(merged, [\n    \"header\",\n    \"sidebar\",\n    \"footer\",\n    \"sidebarWidth\",\n    \"sidebarCollapsed\",\n    \"defaultSidebarCollapsed\",\n    \"onSidebarCollapsedChange\",\n    \"collapsible\",\n    \"collapseToggle\",\n    \"collapseToggleAriaLabel\",\n    \"sidebarCollapsedWidth\",\n    \"stickyHeader\",\n    \"class\",\n    \"style\",\n    \"children\",\n    \"ref\",\n  ]);\n\n  const [collapsed, setCollapsed] = createControllableState<boolean>({\n    value: () => local.sidebarCollapsed,\n    defaultValue: local.defaultSidebarCollapsed,\n    onChange: (next) => local.onSidebarCollapsedChange?.(next),\n  });\n\n  const sidebarId = createId();\n\n  // Resolve slot props through `children()` so each is created once, in THIS\n  // component's reactive context. A pre-created element passed straight into a\n  // <Show> gets its hydration key at the caller's position but renders at the\n  // Show's, so the hydration walk can't find it (\"Unable to find DOM nodes for\n  // key\"). Resolving here keeps the key sequence aligned on server and client.\n  const headerSlot = children(() => local.header);\n  const sidebarSlot = children(() => local.sidebar);\n  const footerSlot = children(() => local.footer);\n  // The toggle is drawn only on a collapsible layout, so it is read only then.\n  const collapseToggleSlot = children(() => (local.collapsible ? local.collapseToggle : undefined));\n\n  const style = (): JSX.CSSProperties => ({\n    \"--smui-app-sidebar-w\": collapsed() ? len(local.sidebarCollapsedWidth) : len(local.sidebarWidth),\n    ...(typeof local.style === \"object\" && local.style ? local.style : {}),\n  });\n\n  return (\n    <div\n      {...rest}\n      ref={mergeRefs(local.ref)}\n      data-testid=\"app-layout\"\n      class={cn(\n        \"smwb-app-layout\",\n        { \"smwb-app-layout_sticky-header\": local.stickyHeader, \"smwb-app-layout_collapsed\": collapsed() },\n        local.class\n      )}\n      style={style()}\n    >\n      <Show when={headerSlot()}>\n        <div class=\"smwb-app-layout__header\">{headerSlot()}</div>\n      </Show>\n      <div class=\"smwb-app-layout__body\">\n        <Show when={sidebarSlot()}>\n          <aside id={sidebarId} class=\"smwb-app-layout__sidebar\">\n            <Show when={local.collapsible}>\n              <div class=\"smwb-app-layout__collapse\">\n                <Show\n                  when={collapseToggleSlot()}\n                  fallback={\n                    <button\n                      type=\"button\"\n                      class=\"smwb-app-layout__collapse-btn\"\n                      aria-label={local.collapseToggleAriaLabel}\n                      aria-expanded={!collapsed()}\n                      aria-controls={sidebarId}\n                      onClick={() => setCollapsed(!collapsed())}\n                    >\n                      <Icon name={collapsed() ? \"chevron_right\" : \"chevron_left\"} size={20} />\n                    </button>\n                  }\n                >\n                  {collapseToggleSlot()}\n                </Show>\n              </div>\n            </Show>\n            {sidebarSlot()}\n          </aside>\n        </Show>\n        <div class=\"smwb-app-layout__content\">\n          {local.children}\n          <Show when={footerSlot()}>\n            <div class=\"smwb-app-layout__footer\">{footerSlot()}</div>\n          </Show>\n        </div>\n      </div>\n    </div>\n  );\n}\n\nexport default AppLayout;\n"],"names":["len","v","AppLayout","props","merged","mergeProps","sidebarWidth","defaultSidebarCollapsed","collapsible","collapseToggleAriaLabel","sidebarCollapsedWidth","stickyHeader","local","rest","splitProps","collapsed","setCollapsed","createControllableState","value","sidebarCollapsed","defaultValue","onChange","next","onSidebarCollapsedChange","sidebarId","createId","headerSlot","children","header","sidebarSlot","sidebar","footerSlot","footer","collapseToggleSlot","collapseToggle","undefined","style","_el$","_tmpl$5","_el$3","firstChild","_el$6","_ref$","mergeRefs","ref","_$use","_$spread","_$mergeProps","cn","class","_$insert","_$createComponent","Show","when","_el$2","_tmpl$","_el$4","_tmpl$3","_$setAttribute","_el$5","_tmpl$2","fallback","_el$8","_tmpl$6","$$click","Icon","name","size","_$effect","_p$","_v$","_v$2","e","t","_el$7","_tmpl$4","_$delegateEvents"],"mappings":"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"}

package/dist/headless/components/layout/divider/divider.js

@@ -1,9 +1,9 @@
-import { use as m, spread as v, mergeProps as u, insert as n, createComponent as f, memo as p, template as s } from "solid-js/web";
-import { mergeProps as h, splitProps as g, Show as w } from "solid-js";
-import b from "clsx";
-import { mergeRefs as y } from "../../../primitives/mergeRefs.js";
-var _ = /* @__PURE__ */ s("<span class=smwb-divider__text>"), x = /* @__PURE__ */ s("<div>");
-const $ = {
+import { use as v, spread as u, mergeProps as f, insert as s, createComponent as p, template as a } from "solid-js/web";
+import { mergeProps as h, splitProps as g, children as w, Show as b } from "solid-js";
+import y from "clsx";
+import { mergeRefs as x } from "../../../primitives/mergeRefs.js";
+var _ = /* @__PURE__ */ a("<span class=smwb-divider__text>"), $ = /* @__PURE__ */ a("<div>");
+const C = {
   default: void 0,
   primary: "var(--smui-primaryColor)",
   secondary: "var(--smui-secondaryColor)",
@@ -12,14 +12,17 @@ const $ = {
   warning: "var(--smui-warningColor)",
   info: "var(--smui-infoColor)"
 };
-function A(a) {
-  const l = h({
+function I(l) {
+  const d = h({
     orientation: "horizontal",
     variant: "fullWidth",
     textAlign: "center",
     color: "default"
-  }, a), [r, d] = g(l, ["class", "orientation", "variant", "textAlign", "color", "thickness", "flexItem", "style", "children", "ref"]), o = () => r.children !== void 0 && r.children !== null && r.children !== !1, c = () => {
-    const e = $[r.color], t = typeof r.thickness == "number" ? `${r.thickness}px` : r.thickness;
+  }, l), [r, c] = g(d, ["class", "orientation", "variant", "textAlign", "color", "thickness", "flexItem", "style", "children", "ref"]), i = w(() => r.orientation === "horizontal" ? r.children : void 0), o = () => {
+    const e = i();
+    return e != null && e !== !1;
+  }, m = () => {
+    const e = C[r.color], t = typeof r.thickness == "number" ? `${r.thickness}px` : r.thickness;
     return {
       ...typeof r.style == "object" && r.style ? r.style : {},
       ...e ? {
@@ -33,35 +36,35 @@ function A(a) {
     };
   };
   return (() => {
-    var e = x(), t = y(r.ref);
-    return typeof t == "function" && m(t, e), v(e, u(d, {
+    var e = $(), t = x(r.ref);
+    return typeof t == "function" && v(t, e), u(e, f(c, {
       "data-testid": "divider",
       role: "separator",
       get "aria-orientation"() {
         return r.orientation;
       },
       get class() {
-        return b("smwb-divider", `smwb-divider_${r.orientation}`, `smwb-divider_${r.variant}`, {
-          "smwb-divider_with-text": o() && r.orientation === "horizontal",
-          [`smwb-divider_align-${r.textAlign}`]: o() && r.orientation === "horizontal",
+        return y("smwb-divider", `smwb-divider_${r.orientation}`, `smwb-divider_${r.variant}`, {
+          "smwb-divider_with-text": o(),
+          [`smwb-divider_align-${r.textAlign}`]: o(),
           "smwb-divider_flex-item": r.flexItem
         }, r.class);
       },
       get style() {
-        return c();
+        return m();
       }
-    }), !1, !0), n(e, f(w, {
+    }), !1, !0), s(e, p(b, {
       get when() {
-        return p(() => !!o())() && r.orientation === "horizontal";
+        return o();
       },
       get children() {
-        var i = _();
-        return n(i, () => r.children), i;
+        var n = _();
+        return s(n, i), n;
       }
     })), e;
   })();
 }
 export {
-  A as Divider
+  I as Divider
 };
 //# sourceMappingURL=divider.js.map