@smwb/ui-solid 0.12.1 → 0.14.0

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

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

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

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

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

@@ -1,25 +1,41 @@
-import { createComponent as n, setAttribute as b, use as k, spread as v, mergeProps as y, insert as a, effect as $, className as u, template as f } from "solid-js/web";
-import { mergeProps as C, splitProps as z, Show as h } from "solid-js";
-import g from "clsx";
-import { TextFieldWrapper as q } from "../textField/textFieldWrapper.js";
-import { createId as T } from "../../../primitives/createId.js";
-import { mergeRefs as O } from "../../../primitives/mergeRefs.js";
-import { Icon as p } from "../../base/icon/icon.js";
-var P = /* @__PURE__ */ f("<span class=smwb-checkbox__label>"), I = /* @__PURE__ */ f("<label><input type=checkbox class=smwb-checkbox__input><span>");
-function j(o) {
-  const w = C({
-    size: "medium",
-    color: "primary"
-  }, o), [e, _] = z(w, ["label", "disabled", "readOnly", "required", "name", "id", "indeterminate", "class", "size", "color", "onChange", "helperText", "error", "ref"]), l = T(e.id), x = (r) => {
-    if (e.readOnly) {
-      r.preventDefault();
-      return;
+import { createComponent as n, setAttribute as g, use as T, spread as $, mergeProps as z, insert as d, effect as O, className as h, template as _ } from "solid-js/web";
+import { mergeProps as q, splitProps as B, createEffect as P, Show as f } from "solid-js";
+import p from "clsx";
+import { TextFieldWrapper as I } from "../textField/textFieldWrapper.js";
+import { createHelperText as H } from "../../../primitives/createHelperText.js";
+import { createId as S } from "../../../primitives/createId.js";
+import { mergeRefs as x } from "../../../primitives/mergeRefs.js";
+import { callHandler as A } from "../../../primitives/callHandler.js";
+import { Icon as w } from "../../base/icon/icon.js";
+var D = /* @__PURE__ */ _("<span class=smwb-checkbox__label>"), E = /* @__PURE__ */ _("<label><input type=checkbox class=smwb-checkbox__input><span>");
+function M(a) {
+  let l;
+  const k = q(
+    {
+      size: "medium",
+      color: "primary"
+    },
+    a,
+    // The input's ref: the caller's, and ours for the indeterminate property.
+    {
+      ref: x(a.ref, (r) => l = r)
     }
-    e.onChange?.(r, r.currentTarget.checked, o);
+  ), [e, y] = B(k, ["label", "disabled", "readOnly", "onClick", "required", "name", "id", "indeterminate", "class", "size", "color", "onChange", "helperText", "error", "aria-describedby", "ref"]), c = S(e.id), o = H(() => e.helperText, {
+    describedBy: () => e["aria-describedby"]
+  }), v = (r) => {
+    A(e.onClick, r), e.readOnly && r.preventDefault();
+  }, C = (r) => {
+    r.currentTarget.indeterminate = !!e.indeterminate, !e.readOnly && e.onChange?.(r, r.currentTarget.checked, a);
   };
-  return n(q, {
+  return P(() => {
+    const r = !!e.indeterminate;
+    l && (l.indeterminate = r);
+  }), n(I, {
     get helperText() {
-      return e.helperText;
+      return o.text();
+    },
+    get helperTextId() {
+      return o.id;
     },
     get disabled() {
       return e.disabled;
@@ -29,10 +45,10 @@ function j(o) {
     },
     class: "smwb-text-field-checkbox",
     get children() {
-      var r = I(), i = r.firstChild, s = i.nextSibling;
-      b(r, "for", l);
-      var c = O(e.ref);
-      return typeof c == "function" && k(c, i), b(i, "id", l), v(i, y({
+      var r = E(), i = r.firstChild, s = i.nextSibling;
+      g(r, "for", c);
+      var m = x(e.ref);
+      return typeof m == "function" && T(m, i), g(i, "id", c), $(i, z({
         get name() {
           return e.name;
         },
@@ -50,15 +66,22 @@ function j(o) {
         },
         get "aria-required"() {
           return e.required || void 0;
+        },
+        get "aria-describedby"() {
+          return o.describedBy();
         }
-      }, _, {
-        onChange: x
-      }), !1, !1), a(s, n(h, {
+      }, y, {
+        get "aria-readonly"() {
+          return e.readOnly || void 0;
+        },
+        onChange: C,
+        onClick: v
+      }), !1, !1), d(s, n(f, {
         get when() {
           return e.indeterminate;
         },
         get fallback() {
-          return n(p, {
+          return n(w, {
             name: "check",
             size: 17,
             class: "smwb-checkbox__icon",
@@ -66,30 +89,30 @@ function j(o) {
           });
         },
         get children() {
-          return n(p, {
+          return n(w, {
             name: "remove",
             size: 18,
             class: "smwb-checkbox__icon",
             weight: 700
           });
         }
-      })), a(r, n(h, {
+      })), d(r, n(f, {
         get when() {
           return e.label;
         },
         get children() {
-          var t = P();
-          return a(t, () => e.label), t;
+          var t = D();
+          return d(t, () => e.label), t;
         }
-      }), null), $((t) => {
-        var d = g("smwb-checkbox__wrapper", `smwb-checkbox_size-${e.size}`, `smwb-checkbox_color-${e.color}`, e.class, {
+      }), null), O((t) => {
+        var b = p("smwb-checkbox__wrapper", `smwb-checkbox_size-${e.size}`, `smwb-checkbox_color-${e.color}`, e.class, {
           "smwb-disabled": e.disabled,
           "smwb-readonly": e.readOnly,
           "smwb-indeterminate": e.indeterminate
-        }), m = g("smwb-checkbox__btn", {
+        }), u = p("smwb-checkbox__btn", {
           "smwb-indeterminate": e.indeterminate
         });
-        return d !== t.e && u(r, t.e = d), m !== t.t && u(s, t.t = m), t;
+        return b !== t.e && h(r, t.e = b), u !== t.t && h(s, t.t = u), t;
       }, {
         e: void 0,
         t: void 0
@@ -98,6 +121,6 @@ function j(o) {
   });
 }
 export {
-  j as Checkbox
+  M as Checkbox
 };
 //# sourceMappingURL=checkbox.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"checkbox.js","sources":["../../../../../src/components/inputs/checkbox/checkbox.tsx"],"sourcesContent":["import { type JSX, Show, mergeProps, splitProps } from \"solid-js\";\nimport cn from \"clsx\";\nimport { Icon } from \"../../base/icon\";\nimport { TextFieldWrapper } from \"../textField/textFieldWrapper\";\nimport { createId } from \"../../../primitives/createId\";\nimport { mergeRefs, type Ref } from \"../../../primitives/mergeRefs\";\n\nexport type SelectionControlSize = \"small\" | \"medium\" | \"large\";\nexport type SelectionControlColor = \"primary\" | \"secondary\" | \"error\" | \"success\" | \"warning\" | \"info\";\n\nexport type SelectionChangeEvent = Event & { currentTarget: HTMLInputElement; target: Element };\n\nexport interface CheckboxProps extends Omit<JSX.InputHTMLAttributes<HTMLInputElement>, \"onChange\" | \"size\"> {\n  label?: string;\n  disabled?: boolean;\n  readOnly?: boolean;\n  required?: boolean;\n  name?: string;\n  id?: string;\n  indeterminate?: boolean;\n  size?: SelectionControlSize;\n  color?: SelectionControlColor;\n  /** Unified handler: `(event, checked, data)`. */\n  onChange?: (event: SelectionChangeEvent, checked: boolean, data: CheckboxProps) => void;\n  helperText?: JSX.Element;\n  error?: boolean;\n  ref?: Ref<HTMLInputElement>;\n}\n\nexport function Checkbox(props: CheckboxProps): JSX.Element {\n  const merged = mergeProps({ size: \"medium\" as SelectionControlSize, color: \"primary\" as SelectionControlColor }, props);\n  const [local, args] = splitProps(merged, [\n    \"label\",\n    \"disabled\",\n    \"readOnly\",\n    \"required\",\n    \"name\",\n    \"id\",\n    \"indeterminate\",\n    \"class\",\n    \"size\",\n    \"color\",\n    \"onChange\",\n    \"helperText\",\n    \"error\",\n    \"ref\",\n  ]);\n  const id = createId(local.id);\n\n  const handleChange: JSX.EventHandler<HTMLInputElement, Event> = (event) => {\n    if (local.readOnly) {\n      event.preventDefault();\n      return;\n    }\n    local.onChange?.(event, event.currentTarget.checked, props);\n  };\n\n  return (\n    <TextFieldWrapper\n      helperText={local.helperText}\n      disabled={local.disabled}\n      error={local.error}\n      class=\"smwb-text-field-checkbox\"\n    >\n      <label\n        for={id}\n        class={cn(\n          \"smwb-checkbox__wrapper\",\n          `smwb-checkbox_size-${local.size}`,\n          `smwb-checkbox_color-${local.color}`,\n          local.class,\n          {\n            \"smwb-disabled\": local.disabled,\n            \"smwb-readonly\": local.readOnly,\n            \"smwb-indeterminate\": local.indeterminate,\n          }\n        )}\n      >\n        <input\n          type=\"checkbox\"\n          id={id}\n          name={local.name}\n          class=\"smwb-checkbox__input\"\n          disabled={local.disabled}\n          readonly={local.readOnly}\n          required={local.required}\n          aria-invalid={local.error || undefined}\n          aria-required={local.required || undefined}\n          ref={mergeRefs(local.ref)}\n          {...args}\n          onChange={handleChange}\n        />\n        <span class={cn(\"smwb-checkbox__btn\", { \"smwb-indeterminate\": local.indeterminate })}>\n          <Show\n            when={local.indeterminate}\n            fallback={<Icon name=\"check\" size={17} class=\"smwb-checkbox__icon\" weight={700} />}\n          >\n            <Icon name=\"remove\" size={18} class=\"smwb-checkbox__icon\" weight={700} />\n          </Show>\n        </span>\n        <Show when={local.label}>\n          <span class=\"smwb-checkbox__label\">{local.label}</span>\n        </Show>\n      </label>\n    </TextFieldWrapper>\n  );\n}\n\nexport default Checkbox;\n"],"names":["Checkbox","props","merged","mergeProps","size","color","local","args","splitProps","id","createId","handleChange","event","readOnly","preventDefault","onChange","currentTarget","checked","_$createComponent","TextFieldWrapper","helperText","disabled","error","children","_el$","_tmpl$2","_el$2","firstChild","_el$3","nextSibling","_$setAttribute","_ref$","mergeRefs","ref","_$use","_$spread","_$mergeProps","name","readonly","required","undefined","_$insert","Show","when","indeterminate","fallback","Icon","weight","label","_el$4","_tmpl$","_$effect","_p$","_v$","cn","class","_v$2","e","_$className","t"],"mappings":"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"}
+{"version":3,"file":"checkbox.js","sources":["../../../../../src/components/inputs/checkbox/checkbox.tsx"],"sourcesContent":["import { type JSX, Show, createEffect, mergeProps, splitProps } from \"solid-js\";\nimport cn from \"clsx\";\nimport { Icon } from \"../../base/icon\";\nimport { TextFieldWrapper } from \"../textField/textFieldWrapper\";\nimport { createHelperText } from \"../../../primitives/createHelperText\";\nimport { createId } from \"../../../primitives/createId\";\nimport { mergeRefs, type Ref } from \"../../../primitives/mergeRefs\";\nimport { callHandler } from \"../../../primitives/callHandler\";\n\nexport type SelectionControlSize = \"small\" | \"medium\" | \"large\";\nexport type SelectionControlColor = \"primary\" | \"secondary\" | \"error\" | \"success\" | \"warning\" | \"info\";\n\nexport type SelectionChangeEvent = Event & { currentTarget: HTMLInputElement; target: Element };\n\nexport interface CheckboxProps extends Omit<JSX.InputHTMLAttributes<HTMLInputElement>, \"onChange\" | \"size\"> {\n  label?: string;\n  disabled?: boolean;\n  /**\n   * Keeps the checkbox as it is: clicks on it or its label and Space change nothing, and `onChange` is not called.\n   * It stays focusable, and its input tells assistive technology it is read-only (`aria-readonly`).\n   */\n  readOnly?: boolean;\n  required?: boolean;\n  name?: string;\n  id?: string;\n  /**\n   * Shows the checkbox as partly checked, as for a \"select all\" over a partial selection: drawn with a dash and\n   * announced as \"mixed\" by screen readers, whatever `checked` is. A click does not clear it: the click toggles\n   * `checked` as usual and `onChange` reports the new `checked`, while the checkbox stays mixed until this prop turns\n   * false.\n   */\n  indeterminate?: boolean;\n  size?: SelectionControlSize;\n  color?: SelectionControlColor;\n  /** Unified handler: `(event, checked, data)`. */\n  onChange?: (event: SelectionChangeEvent, checked: boolean, data: CheckboxProps) => void;\n  helperText?: JSX.Element;\n  error?: boolean;\n  ref?: Ref<HTMLInputElement>;\n}\n\nexport function Checkbox(props: CheckboxProps): JSX.Element {\n  let input: HTMLInputElement | undefined;\n  const merged = mergeProps(\n    { size: \"medium\" as SelectionControlSize, color: \"primary\" as SelectionControlColor },\n    props,\n    // The input's ref: the caller's, and ours for the indeterminate property.\n    { ref: mergeRefs<HTMLInputElement>(props.ref, (el) => (input = el)) }\n  );\n  const [local, args] = splitProps(merged, [\n    \"label\",\n    \"disabled\",\n    \"readOnly\",\n    \"onClick\",\n    \"required\",\n    \"name\",\n    \"id\",\n    \"indeterminate\",\n    \"class\",\n    \"size\",\n    \"color\",\n    \"onChange\",\n    \"helperText\",\n    \"error\",\n    \"aria-describedby\",\n    \"ref\",\n  ]);\n  const id = createId(local.id);\n  const helper = createHelperText(() => local.helperText, { describedBy: () => local[\"aria-describedby\"] });\n\n  // `readonly` means nothing to a checkbox input: a click on it or on its label, and Space, still\n  // toggle it. Cancel the click; the browser then puts the previous state back.\n  const handleClick: JSX.EventHandler<HTMLInputElement, MouseEvent> = (event) => {\n    callHandler(local.onClick, event);\n    if (local.readOnly) event.preventDefault();\n  };\n\n  const handleChange: JSX.EventHandler<HTMLInputElement, Event> = (event) => {\n    // A click clears the input's indeterminate property; the prop still decides it.\n    event.currentTarget.indeterminate = Boolean(local.indeterminate);\n    if (local.readOnly) {\n      return;\n    }\n    local.onChange?.(event, event.currentTarget.checked, props);\n  };\n\n  // `indeterminate` is a DOM property with no attribute, so no markup carries it:\n  // set it on the input, after hydration too, and whenever the prop changes.\n  createEffect(() => {\n    const indeterminate = Boolean(local.indeterminate);\n    if (input) input.indeterminate = indeterminate;\n  });\n\n  return (\n    <TextFieldWrapper\n      helperText={helper.text()}\n      helperTextId={helper.id}\n      disabled={local.disabled}\n      error={local.error}\n      class=\"smwb-text-field-checkbox\"\n    >\n      <label\n        for={id}\n        class={cn(\n          \"smwb-checkbox__wrapper\",\n          `smwb-checkbox_size-${local.size}`,\n          `smwb-checkbox_color-${local.color}`,\n          local.class,\n          {\n            \"smwb-disabled\": local.disabled,\n            \"smwb-readonly\": local.readOnly,\n            \"smwb-indeterminate\": local.indeterminate,\n          }\n        )}\n      >\n        <input\n          type=\"checkbox\"\n          id={id}\n          name={local.name}\n          class=\"smwb-checkbox__input\"\n          disabled={local.disabled}\n          readonly={local.readOnly}\n          required={local.required}\n          aria-invalid={local.error || undefined}\n          aria-required={local.required || undefined}\n          aria-describedby={helper.describedBy()}\n          ref={mergeRefs(local.ref)}\n          {...args}\n          aria-readonly={local.readOnly || undefined}\n          onChange={handleChange}\n          onClick={handleClick}\n        />\n        <span class={cn(\"smwb-checkbox__btn\", { \"smwb-indeterminate\": local.indeterminate })}>\n          <Show\n            when={local.indeterminate}\n            fallback={<Icon name=\"check\" size={17} class=\"smwb-checkbox__icon\" weight={700} />}\n          >\n            <Icon name=\"remove\" size={18} class=\"smwb-checkbox__icon\" weight={700} />\n          </Show>\n        </span>\n        <Show when={local.label}>\n          <span class=\"smwb-checkbox__label\">{local.label}</span>\n        </Show>\n      </label>\n    </TextFieldWrapper>\n  );\n}\n\nexport default Checkbox;\n"],"names":["Checkbox","props","input","merged","mergeProps","size","color","ref","mergeRefs","el","local","args","splitProps","id","createId","helper","createHelperText","helperText","describedBy","handleClick","event","callHandler","onClick","readOnly","preventDefault","handleChange","currentTarget","indeterminate","Boolean","onChange","checked","createEffect","_$createComponent","TextFieldWrapper","text","helperTextId","disabled","error","children","_el$","_tmpl$2","_el$2","firstChild","_el$3","nextSibling","_$setAttribute","_ref$","_$use","_$spread","_$mergeProps","name","readonly","required","undefined","_$insert","Show","when","fallback","Icon","weight","label","_el$4","_tmpl$","_$effect","_p$","_v$","cn","class","_v$2","e","_$className","t"],"mappings":"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"}

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

@@ -0,0 +1,274 @@
+import { isServer as Se, use as C, spread as Re, mergeProps as Ae, insert as c, createComponent as b, effect as S, setAttribute as i, memo as Ce, className as oe, setStyleProperty as ae, template as f, delegateEvents as Oe } from "solid-js/web";
+import { mergeProps as Te, splitProps as $e, untrack as re, createSignal as Pe, createEffect as Fe, onMount as ke, children as ne, Show as p } from "solid-js";
+import O from "clsx";
+import { callHandler as g } from "../../../primitives/callHandler.js";
+import { createControllableState as Ee } from "../../../primitives/createControllableState.js";
+import { createDropzone as Ie } from "../../../primitives/createDropzone.js";
+import { createId as Ke } from "../../../primitives/createId.js";
+import { mergeRefs as se } from "../../../primitives/mergeRefs.js";
+import { isFileDrag as ie, filterAttachedFiles as Be } from "./composerFiles.js";
+import { resolveComposerKeyAction as Me } from "./composerKeys.js";
+import { Icon as le } from "../../base/icon/icon.js";
+var Ve = /* @__PURE__ */ f("<div class=smwb-composer__attachments data-testid=composer-attachments>"), ze = /* @__PURE__ */ f('<button type=button class="smwb-composer__icon-button smwb-composer__attach"data-testid=composer-attach>'), Ne = /* @__PURE__ */ f("<div class=smwb-composer__toolbar data-testid=composer-toolbar>"), je = /* @__PURE__ */ f("<span data-testid=composer-counter>"), He = /* @__PURE__ */ f("<span class=smwb-composer__status role=status data-testid=composer-status>"), We = /* @__PURE__ */ f("<input type=file data-testid=composer-file-input style=display:none>"), qe = /* @__PURE__ */ f("<div><div class=smwb-composer__field><textarea class=smwb-composer__input data-testid=composer-input></textarea></div><button type=button data-testid=composer-action>");
+const Ge = (l) => l >= 0 ? `${l} characters left` : `${-l} characters over the limit`;
+function Je(l) {
+  l.preventDefault();
+}
+function T(l) {
+  return Array.isArray(l) ? l.some(T) : l != null && typeof l != "boolean" && l !== "";
+}
+function st(l) {
+  const ce = Te({
+    sendKey: "modEnter",
+    clearOnSend: !0,
+    busy: !1,
+    counterAnnouncement: Ge,
+    minRows: 1,
+    maxRows: 8,
+    layout: "stacked",
+    multiple: !0,
+    disabled: !1,
+    readOnly: !1,
+    sendLabel: "Send",
+    stopLabel: "Stop",
+    attachLabel: "Attach file"
+  }, l), [t, de] = $e(ce, [
+    "value",
+    "defaultValue",
+    "onValueChange",
+    "onSend",
+    "sendKey",
+    "clearOnSend",
+    "busy",
+    "onStop",
+    "placeholder",
+    "maxLength",
+    "counter",
+    "counterAnnouncement",
+    "minRows",
+    "maxRows",
+    "layout",
+    "toolbar",
+    "attachments",
+    "onAttach",
+    "accept",
+    "multiple",
+    "maxFiles",
+    "dropTarget",
+    "disabled",
+    "readOnly",
+    "autofocus",
+    "name",
+    "id",
+    "aria-label",
+    "aria-labelledby",
+    "aria-describedby",
+    "onKeyDown",
+    "onFocus",
+    "onBlur",
+    "inputRef",
+    "sendLabel",
+    "stopLabel",
+    "attachLabel",
+    "class",
+    "data-testid",
+    "ref",
+    // The root sets these too; its own handlers call the caller's first.
+    "onDragOver",
+    "onDragLeave",
+    "onDrop"
+  ]), [d, $] = Ee({
+    value: () => t.value,
+    defaultValue: re(() => t.defaultValue) ?? "",
+    onChange: (o) => t.onValueChange?.(o)
+  }), [ue, P] = Pe(!1), me = Ke(void 0, "smwb-composer"), F = () => t.id ?? me, k = () => `${F()}-counter`;
+  let h;
+  const v = Ie({
+    get accept() {
+      return t.accept;
+    },
+    get multiple() {
+      return t.multiple;
+    },
+    get disabled() {
+      return t.disabled;
+    },
+    // `maxFiles` is not passed on: the cut has to come after `accept`, see `filterAttachedFiles`.
+    onDrop: (o) => {
+      const n = Be(o, {
+        accept: t.accept,
+        multiple: t.multiple,
+        maxFiles: t.maxFiles
+      });
+      n.length > 0 && t.onAttach?.(n);
+    }
+  }), R = () => t.onAttach !== void 0, x = () => R() && t.dropTarget !== !1, _ = () => v.getInputProps(), D = () => t.counter ?? t.maxLength !== void 0, L = () => t.maxLength !== void 0 && d().length > t.maxLength, E = () => !!t.onSend && d().trim() !== "" && !t.disabled && !t.readOnly && !t.busy && !L(), ve = () => {
+    const o = t.maxLength;
+    if (!D() || o === void 0) return "";
+    const n = o - d().length;
+    return n <= Math.max(10, Math.ceil(o * 0.1)) ? t.counterAnnouncement(n, o) : "";
+  }, A = re(d), be = Se && A.startsWith(`
+`) ? `
+${A}` : A;
+  Fe(() => {
+    const o = d();
+    h && h.value !== o && (h.value = o);
+  });
+  const I = () => {
+    E() && (t.onSend?.(d().trim()), t.clearOnSend && $(""));
+  }, fe = (o) => {
+    const n = o.currentTarget;
+    $(n.value), n.value !== d() && (n.value = d());
+  }, pe = (o) => {
+    g(t.onKeyDown, o), !(o.defaultPrevented || Me(o, t.sendKey) === "native") && (o.preventDefault(), I());
+  }, ge = (o) => {
+    g(t.onFocus, o), P(!0);
+  }, he = (o) => {
+    g(t.onBlur, o), P(!1);
+  }, we = (o) => {
+    if (!(o.detail > 1)) {
+      if (t.busy) {
+        t.disabled || t.onStop?.();
+        return;
+      }
+      I();
+    }
+  }, ye = (o) => {
+    g(t.onDragOver, o), x() && ie(o.dataTransfer) && v.getRootProps().onDragOver(o);
+  }, xe = (o) => {
+    g(t.onDragLeave, o), x() && (o.relatedTarget instanceof Node && o.currentTarget.contains(o.relatedTarget) || v.getRootProps().onDragLeave());
+  }, _e = (o) => {
+    g(t.onDrop, o), x() && ie(o.dataTransfer) && v.getRootProps().onDrop(o);
+  }, De = (o) => {
+    _().onChange(o), o.currentTarget.value = "";
+  };
+  ke(() => {
+    t.autofocus && h?.focus();
+  });
+  const K = ne(() => t.toolbar), B = ne(() => t.attachments), Le = () => [t["aria-describedby"], D() ? k() : void 0].filter(Boolean).join(" ") || void 0;
+  return (() => {
+    var o = qe(), n = o.firstChild, r = n.firstChild, u = n.nextSibling, M = se(t.ref);
+    typeof M == "function" && C(M, o), Re(o, Ae(de, {
+      get class() {
+        return O("smwb-composer", `smwb-composer_${t.layout}`, ue() && "smwb-composer_focused", t.busy && "smwb-composer_busy", t.disabled && "smwb-composer_disabled", x() && v.isDragActive() && "smwb-composer_drag-active", L() && "smwb-composer_over-limit", t.class);
+      },
+      get "data-testid"() {
+        return t["data-testid"] ?? "composer";
+      },
+      onDragOver: ye,
+      onDragLeave: xe,
+      onDrop: _e
+    }), !1, !0), c(o, b(p, {
+      get when() {
+        return T(B());
+      },
+      get children() {
+        var e = Ve();
+        return c(e, B), e;
+      }
+    }), n), r.addEventListener("blur", he), r.addEventListener("focus", ge), r.$$keydown = pe, r.$$input = fe;
+    var V = se(t.inputRef, (e) => h = e);
+    return typeof V == "function" && C(V, r), c(r, be), c(o, b(p, {
+      get when() {
+        return R();
+      },
+      get children() {
+        var e = ze();
+        return e.$$click = () => v.open(), c(e, b(le, {
+          name: "attach_file",
+          size: 20
+        })), S((a) => {
+          var s = t.attachLabel, m = t.disabled;
+          return s !== a.e && i(e, "aria-label", a.e = s), m !== a.t && (e.disabled = a.t = m), a;
+        }, {
+          e: void 0,
+          t: void 0
+        }), e;
+      }
+    }), u), c(o, b(p, {
+      get when() {
+        return T(K());
+      },
+      get children() {
+        var e = Ne();
+        return c(e, K), e;
+      }
+    }), u), c(o, b(p, {
+      get when() {
+        return D();
+      },
+      get children() {
+        var e = je();
+        return c(e, (() => {
+          var a = Ce(() => t.maxLength !== void 0);
+          return () => a() ? `${d().length} / ${t.maxLength}` : d().length;
+        })()), S((a) => {
+          var s = k(), m = O("smwb-composer__counter", L() && "smwb-composer__counter_error");
+          return s !== a.e && i(e, "id", a.e = s), m !== a.t && oe(e, a.t = m), a;
+        }, {
+          e: void 0,
+          t: void 0
+        }), e;
+      }
+    }), u), u.$$click = we, u.$$mousedown = Je, c(u, b(le, {
+      get name() {
+        return t.busy ? "stop" : "send";
+      },
+      size: 20
+    })), c(o, b(p, {
+      get when() {
+        return D();
+      },
+      get children() {
+        var e = He();
+        return c(e, ve), e;
+      }
+    }), null), c(o, b(p, {
+      get when() {
+        return R();
+      },
+      get children() {
+        var e = We();
+        e.addEventListener("change", De);
+        var a = v.inputRef;
+        return typeof a == "function" ? C(a, e) : v.inputRef = e, S((s) => {
+          var m = _().multiple, w = _().accept, y = _().disabled;
+          return m !== s.e && (e.multiple = s.e = m), w !== s.t && i(e, "accept", s.t = w), y !== s.a && (e.disabled = s.a = y), s;
+        }, {
+          e: void 0,
+          t: void 0,
+          a: void 0
+        }), e;
+      }
+    }), null), S((e) => {
+      var a = d(), s = String(t.minRows), m = String(Math.max(t.maxRows, t.minRows)), w = F(), y = t.name, z = t.minRows, N = t.placeholder, j = t.maxLength, H = t.disabled, W = t.readOnly, q = t.autofocus, G = t["aria-label"], J = t["aria-labelledby"], Q = Le(), U = L() || void 0, X = O("smwb-composer__icon-button", "smwb-composer__action", t.busy && "smwb-composer__action_stop"), Y = t.busy ? t.stopLabel : t.sendLabel, Z = !t.busy && !E() ? "true" : void 0, ee = t.disabled, te = t.busy ? "stop" : "send";
+      return a !== e.e && i(n, "data-value", e.e = a), s !== e.t && ae(n, "--smwb-composer-min-rows", e.t = s), m !== e.a && ae(n, "--smwb-composer-max-rows", e.a = m), w !== e.o && i(r, "id", e.o = w), y !== e.i && i(r, "name", e.i = y), z !== e.n && i(r, "rows", e.n = z), N !== e.s && i(r, "placeholder", e.s = N), j !== e.h && i(r, "maxlength", e.h = j), H !== e.r && (r.disabled = e.r = H), W !== e.d && (r.readOnly = e.d = W), q !== e.l && (r.autofocus = e.l = q), G !== e.u && i(r, "aria-label", e.u = G), J !== e.c && i(r, "aria-labelledby", e.c = J), Q !== e.w && i(r, "aria-describedby", e.w = Q), U !== e.m && i(r, "aria-invalid", e.m = U), X !== e.f && oe(u, e.f = X), Y !== e.y && i(u, "aria-label", e.y = Y), Z !== e.g && i(u, "aria-disabled", e.g = Z), ee !== e.p && (u.disabled = e.p = ee), te !== e.b && i(u, "data-action", e.b = te), e;
+    }, {
+      e: void 0,
+      t: void 0,
+      a: void 0,
+      o: void 0,
+      i: void 0,
+      n: void 0,
+      s: void 0,
+      h: void 0,
+      r: void 0,
+      d: void 0,
+      l: void 0,
+      u: void 0,
+      c: void 0,
+      w: void 0,
+      m: void 0,
+      f: void 0,
+      y: void 0,
+      g: void 0,
+      p: void 0,
+      b: void 0
+    }), o;
+  })();
+}
+Oe(["input", "keydown", "click", "mousedown"]);
+export {
+  st as Composer
+};
+//# sourceMappingURL=composer.js.map