@versaur/react 0.0.1

package/dist/components/forms/checkbox/checkbox.js

@@ -0,0 +1,35 @@
+import { jsxs as p, jsx as s } from "react/jsx-runtime";
+import o from "../../../core/src/components/forms/checkbox/checkbox.module.css.js";
+import { forwardRef as f } from "react";
+import { cx as x } from "../../../utils/cx.js";
+import { useDataAttrs as n } from "../../../hooks/use-data-attrs.js";
+const b = f(
+  ({ invalid: t = !1, disabled: e = !1, required: a = !1, children: r, className: c, ...m }, i) => {
+    const l = n({
+      disabled: e,
+      invalid: t,
+      required: a
+    });
+    return /* @__PURE__ */ p("label", { className: x(o.checkbox, c), ...l, children: [
+      /* @__PURE__ */ s(
+        "input",
+        {
+          ref: i,
+          type: "checkbox",
+          className: o.input,
+          disabled: e,
+          required: a,
+          "aria-invalid": t || void 0,
+          "aria-required": a || void 0,
+          ...m
+        }
+      ),
+      /* @__PURE__ */ s("span", { className: o.indicator }),
+      r && /* @__PURE__ */ s("span", { className: o.label, "data-required": a || void 0, children: r })
+    ] });
+  }
+);
+b.displayName = "Checkbox";
+export {
+  b as Checkbox
+};

package/dist/components/forms/checkbox-group/checkbox-group.js

@@ -0,0 +1,96 @@
+import { jsxs as k, jsx as r } from "react/jsx-runtime";
+import d from "../../../core/src/components/forms/checkbox-group/checkbox-group.module.css.js";
+import { createContext as D, forwardRef as v, useId as G, useContext as E } from "react";
+import { cx as g } from "../../../utils/cx.js";
+import { useDataAttrs as N } from "../../../hooks/use-data-attrs.js";
+import { ErrorText as T } from "../error-text/error-text.js";
+import { HelperText as $ } from "../helper-text/helper-text.js";
+import { Label as y } from "../label/label.js";
+const I = D(void 0);
+function F() {
+  const e = E(I);
+  if (!e)
+    throw new Error("CheckboxGroup.Option must be used within CheckboxGroup");
+  return e;
+}
+const w = v(
+  ({
+    value: e,
+    onChange: c,
+    name: m,
+    label: n,
+    helper: a,
+    error: o,
+    required: h = !1,
+    disabled: i = !1,
+    direction: t = "column",
+    children: l,
+    className: s,
+    ...p
+  }, x) => {
+    const b = G(), u = p.id || b, f = a ? `${u}-helper` : void 0, C = o ? `${u}-error` : void 0, j = [f, C].filter(Boolean).join(" "), A = (q) => {
+      !i && c && c(q);
+    }, B = N({
+      disabled: i,
+      invalid: !!o
+    });
+    return /* @__PURE__ */ k("div", { ref: x, className: g(d.field, s), ...B, ...p, children: [
+      n && /* @__PURE__ */ r(y, { required: h, disabled: i, children: n }),
+      /* @__PURE__ */ r(I.Provider, { value: { disabled: i, name: m, onChange: A, value: e }, children: /* @__PURE__ */ r(
+        "div",
+        {
+          className: d.options,
+          "data-direction": t,
+          role: "group",
+          "aria-describedby": j || void 0,
+          "aria-invalid": o ? "true" : void 0,
+          children: l
+        }
+      ) }),
+      o && /* @__PURE__ */ r(T, { id: C, children: o }),
+      !o && a && /* @__PURE__ */ r($, { id: f, children: a })
+    ] });
+  }
+);
+w.displayName = "CheckboxGroup";
+const O = v(
+  ({ value: e, children: c, disabled: m, required: n = !1, className: a, ...o }, h) => {
+    const i = G(), t = F(), l = t.value.includes(e), s = t.disabled || m, p = () => {
+      if (!s) {
+        const b = l ? t.value.filter((u) => u !== e) : [...t.value, e];
+        t.onChange(b);
+      }
+    }, x = N({
+      disabled: s,
+      required: n
+    });
+    return /* @__PURE__ */ k("label", { className: g(d.option, a), ...x, children: [
+      /* @__PURE__ */ r(
+        "input",
+        {
+          ref: h,
+          type: "checkbox",
+          name: t.name,
+          value: e,
+          checked: l,
+          disabled: s,
+          required: n,
+          onChange: p,
+          className: d.input,
+          "aria-required": n || void 0,
+          ...o,
+          id: i
+        }
+      ),
+      /* @__PURE__ */ r("span", { className: d.indicator }),
+      c && /* @__PURE__ */ r(y, { required: n, disabled: s, htmlFor: i, children: c })
+    ] });
+  }
+);
+O.displayName = "CheckboxGroup.Option";
+const M = Object.assign(w, {
+  Option: O
+});
+export {
+  M as CheckboxGroup
+};

package/dist/components/forms/chip-multiple-input/chip-multiple-input.js

@@ -0,0 +1,101 @@
+import { jsxs as B, jsx as o } from "react/jsx-runtime";
+import h from "../../../core/src/components/forms/chip-multiple-input/chip-multiple-input.module.css.js";
+import { createContext as k, forwardRef as v, useId as D, useContext as E } from "react";
+import { cx as R } from "../../../utils/cx.js";
+import { useDataAttrs as x } from "../../../hooks/use-data-attrs.js";
+import { ErrorText as S } from "../error-text/error-text.js";
+import { HelperText as T } from "../helper-text/helper-text.js";
+import { Label as $ } from "../label/label.js";
+const b = k(void 0);
+function H() {
+  const e = E(b);
+  if (!e)
+    throw new Error("ChipMultipleInput.Option must be used within ChipMultipleInput");
+  return e;
+}
+const M = v(
+  ({
+    value: e,
+    onChange: p,
+    name: a,
+    label: s,
+    helper: n,
+    error: t,
+    required: l = !1,
+    disabled: i = !1,
+    gap: r = "2",
+    wrap: d = !0,
+    children: c,
+    className: u,
+    ...m
+  }, w) => {
+    const y = D(), f = m.id || y, C = n ? `${f}-helper` : void 0, I = t ? `${f}-error` : void 0, N = [C, I].filter(Boolean).join(" "), O = (A) => {
+      !i && p && p(A);
+    }, j = x({
+      invalid: !!t
+    });
+    return /* @__PURE__ */ B("div", { ref: w, className: R(h.field, u), ...j, ...m, children: [
+      s && /* @__PURE__ */ o($, { required: l, disabled: i, children: s }),
+      /* @__PURE__ */ o(
+        b.Provider,
+        {
+          value: {
+            disabled: i,
+            name: a,
+            onChange: O,
+            value: e
+          },
+          children: /* @__PURE__ */ o(
+            "div",
+            {
+              className: h.options,
+              "data-gap": r,
+              "data-wrap": d,
+              role: "group",
+              "aria-describedby": N || void 0,
+              "aria-invalid": t ? "true" : void 0,
+              children: c
+            }
+          )
+        }
+      ),
+      t && /* @__PURE__ */ o(S, { id: I, children: t }),
+      !t && n && /* @__PURE__ */ o(T, { id: C, children: n })
+    ] });
+  }
+);
+M.displayName = "ChipMultipleInput";
+const g = v(
+  ({ value: e, children: p, disabled: a, ...s }, n) => {
+    const t = H(), l = t.value.includes(e), i = t.disabled || a, r = () => {
+      if (!i && t.onChange) {
+        const c = l ? t.value.filter((u) => u !== e) : [...t.value, e];
+        t.onChange(c);
+      }
+    }, d = x({
+      disabled: i,
+      selected: l
+    });
+    return /* @__PURE__ */ o(
+      "button",
+      {
+        ref: n,
+        type: "button",
+        className: h.option,
+        onClick: r,
+        disabled: i,
+        "aria-pressed": l,
+        ...d,
+        ...s,
+        children: p
+      }
+    );
+  }
+);
+g.displayName = "ChipMultipleInput.Option";
+const K = Object.assign(M, {
+  Option: g
+});
+export {
+  K as ChipMultipleInput
+};

package/dist/components/forms/chip-single-input/chip-single-input.js

@@ -0,0 +1,98 @@
+import { jsxs as B, jsx as e } from "react/jsx-runtime";
+import c from "../../../core/src/components/forms/chip-single-input/chip-single-input.module.css.js";
+import { createContext as k, forwardRef as g, useId as D, useContext as E } from "react";
+import { cx as R } from "../../../utils/cx.js";
+import { useDataAttrs as C } from "../../../hooks/use-data-attrs.js";
+import { ErrorText as T } from "../error-text/error-text.js";
+import { HelperText as $ } from "../helper-text/helper-text.js";
+import { Label as H } from "../label/label.js";
+const I = k(void 0);
+function L() {
+  const i = E(I);
+  if (!i)
+    throw new Error("ChipSingleInput.Option must be used within ChipSingleInput");
+  return i;
+}
+const x = g(
+  ({
+    value: i,
+    onChange: s,
+    name: d,
+    label: r,
+    helper: o,
+    error: t,
+    required: a = !1,
+    disabled: n = !1,
+    gap: p = "2",
+    wrap: l = !0,
+    children: v,
+    className: b,
+    ...u
+  }, y) => {
+    const w = D(), h = u.id || w, m = o ? `${h}-helper` : void 0, f = t ? `${h}-error` : void 0, N = [m, f].filter(Boolean).join(" "), O = (A) => {
+      !n && s && s(A);
+    }, j = C({
+      invalid: !!t
+    });
+    return /* @__PURE__ */ B("div", { ref: y, className: R(c.field, b), ...j, ...u, children: [
+      r && /* @__PURE__ */ e(H, { required: a, disabled: n, children: r }),
+      /* @__PURE__ */ e(
+        I.Provider,
+        {
+          value: {
+            disabled: n,
+            name: d,
+            onChange: O,
+            value: i
+          },
+          children: /* @__PURE__ */ e(
+            "div",
+            {
+              className: c.options,
+              "data-gap": p,
+              "data-wrap": l,
+              role: "radiogroup",
+              "aria-describedby": N || void 0,
+              "aria-invalid": t ? "true" : void 0,
+              children: v
+            }
+          )
+        }
+      ),
+      t && /* @__PURE__ */ e(T, { id: f, children: t }),
+      !t && o && /* @__PURE__ */ e($, { id: m, children: o })
+    ] });
+  }
+);
+x.displayName = "ChipSingleInput";
+const S = g(
+  ({ value: i, children: s, disabled: d, ...r }, o) => {
+    const t = L(), a = t.value === i, n = t.disabled || d, p = () => {
+      !n && t.onChange && t.onChange(i);
+    }, l = C({
+      disabled: n,
+      selected: a
+    });
+    return /* @__PURE__ */ e(
+      "button",
+      {
+        ref: o,
+        type: "button",
+        className: c.option,
+        onClick: p,
+        disabled: n,
+        "aria-pressed": a,
+        ...l,
+        ...r,
+        children: s
+      }
+    );
+  }
+);
+S.displayName = "ChipSingleInput.Option";
+const Q = Object.assign(x, {
+  Option: S
+});
+export {
+  Q as ChipSingleInput
+};

package/dist/components/forms/error-text/error-text.js

@@ -0,0 +1,9 @@
+import { jsx as m } from "react/jsx-runtime";
+import a from "../../../core/src/components/forms/error-text/error-text.module.css.js";
+import { forwardRef as i } from "react";
+import { cx as p } from "../../../utils/cx.js";
+const l = i(({ children: r, className: o, ...e }, t) => /* @__PURE__ */ m("p", { ref: t, className: p(a.error, o), role: "alert", "aria-live": "polite", ...e, children: r }));
+l.displayName = "ErrorText";
+export {
+  l as ErrorText
+};

package/dist/components/forms/helper-text/helper-text.js

@@ -0,0 +1,9 @@
+import { jsx as m } from "react/jsx-runtime";
+import t from "../../../core/src/components/forms/helper-text/helper-text.module.css.js";
+import { forwardRef as l } from "react";
+import { cx as f } from "../../../utils/cx.js";
+const s = l(({ children: e, className: r, ...o }, p) => /* @__PURE__ */ m("p", { ref: p, className: f(t.helper, r), ...o, children: e }));
+s.displayName = "HelperText";
+export {
+  s as HelperText
+};

package/dist/components/forms/label/label.js

@@ -0,0 +1,18 @@
+import { jsx as s } from "react/jsx-runtime";
+import f from "../../../core/src/components/forms/label/label.module.css.js";
+import { forwardRef as p } from "react";
+import { cx as i } from "../../../utils/cx.js";
+import { useDataAttrs as b } from "../../../hooks/use-data-attrs.js";
+const c = p(
+  ({ required: r = !1, disabled: a = !1, children: t, className: e, ...o }, l) => {
+    const m = b({
+      disabled: a,
+      required: r
+    });
+    return /* @__PURE__ */ s("label", { ref: l, className: i(f.label, e), ...m, ...o, children: t });
+  }
+);
+c.displayName = "Label";
+export {
+  c as Label
+};

package/dist/components/forms/radio/radio.js

@@ -0,0 +1,34 @@
+import { jsxs as f, jsx as o } from "react/jsx-runtime";
+import a from "../../../core/src/components/forms/radio/radio.module.css.js";
+import { forwardRef as n } from "react";
+import { cx as c } from "../../../utils/cx.js";
+import { useDataAttrs as u } from "../../../hooks/use-data-attrs.js";
+const N = n(
+  ({ variant: i = "outline", size: m = "medium", invalid: r = !1, disabled: s = !1, children: t, className: e, ...l }, p) => {
+    const d = u({
+      disabled: s,
+      invalid: r,
+      size: m,
+      variant: i
+    });
+    return /* @__PURE__ */ f("label", { className: c(a.radio, e), ...d, children: [
+      /* @__PURE__ */ o(
+        "input",
+        {
+          ref: p,
+          type: "radio",
+          className: a.input,
+          disabled: s,
+          "aria-invalid": r || void 0,
+          ...l
+        }
+      ),
+      /* @__PURE__ */ o("span", { className: a.indicator }),
+      t && /* @__PURE__ */ o("span", { className: a.label, children: t })
+    ] });
+  }
+);
+N.displayName = "Radio";
+export {
+  N as Radio
+};

package/dist/components/forms/radio-group/radio-group.js

@@ -0,0 +1,91 @@
+import { jsxs as v, jsx as e } from "react/jsx-runtime";
+import a from "../../../core/src/components/forms/radio-group/radio-group.module.css.js";
+import { createContext as A, forwardRef as x, useId as D, useContext as E } from "react";
+import { cx as R } from "../../../utils/cx.js";
+import { useDataAttrs as L } from "../../../hooks/use-data-attrs.js";
+import { ErrorText as T } from "../error-text/error-text.js";
+import { HelperText as $ } from "../helper-text/helper-text.js";
+import { Label as H } from "../label/label.js";
+const G = A(void 0);
+function P() {
+  const o = E(G);
+  if (!o)
+    throw new Error("RadioGroup.Option must be used within RadioGroup");
+  return o;
+}
+const C = x(
+  ({
+    value: o,
+    onChange: d,
+    name: p,
+    variant: m = "outline",
+    size: r = "medium",
+    label: s,
+    helper: i,
+    error: t,
+    required: c = !1,
+    disabled: n = !1,
+    direction: g = "column",
+    children: N,
+    className: y,
+    ...l
+  }, I) => {
+    const O = D(), u = l.id || O, f = i ? `${u}-helper` : void 0, h = t ? `${u}-error` : void 0, j = [f, h].filter(Boolean).join(" "), w = (k) => {
+      !n && d && d(k);
+    }, B = L({
+      disabled: n,
+      invalid: !!t,
+      size: r === "medium" ? void 0 : r,
+      variant: r === "medium" ? m : void 0
+    });
+    return /* @__PURE__ */ v("div", { ref: I, className: R(a.field, y), ...B, ...l, children: [
+      s && /* @__PURE__ */ e(H, { required: c, disabled: n, children: s }),
+      /* @__PURE__ */ e(G.Provider, { value: { disabled: n, name: p, onChange: w, value: o }, children: /* @__PURE__ */ e(
+        "div",
+        {
+          className: a.options,
+          "data-direction": g,
+          role: "radiogroup",
+          "aria-describedby": j || void 0,
+          "aria-invalid": t ? "true" : void 0,
+          children: N
+        }
+      ) }),
+      t && /* @__PURE__ */ e(T, { id: h, children: t }),
+      !t && i && /* @__PURE__ */ e($, { id: f, children: i })
+    ] });
+  }
+);
+C.displayName = "RadioGroup";
+const b = x(
+  ({ value: o, children: d, disabled: p, className: m, ...r }, s) => {
+    const i = P(), t = i.value === o, c = i.disabled || p, n = () => {
+      c || i.onChange(o);
+    };
+    return /* @__PURE__ */ v("label", { className: R(a.option, m), children: [
+      /* @__PURE__ */ e(
+        "input",
+        {
+          ref: s,
+          type: "radio",
+          name: i.name,
+          value: o,
+          checked: t,
+          disabled: c,
+          onChange: n,
+          className: a.input,
+          ...r
+        }
+      ),
+      /* @__PURE__ */ e("span", { className: a.indicator }),
+      d && /* @__PURE__ */ e("span", { className: a.optionLabel, children: d })
+    ] });
+  }
+);
+b.displayName = "RadioGroup.Option";
+const V = Object.assign(C, {
+  Option: b
+});
+export {
+  V as RadioGroup
+};

package/dist/components/forms/select/select.js

@@ -0,0 +1,55 @@
+import { jsx as i, jsxs as p } from "react/jsx-runtime";
+import m from "../../../core/src/components/forms/select/select.module.css.js";
+import { forwardRef as c, useId as G } from "react";
+import { cx as b } from "../../../utils/cx.js";
+import { useDataAttrs as g } from "../../../hooks/use-data-attrs.js";
+import { ErrorText as A } from "../error-text/error-text.js";
+import { HelperText as T } from "../helper-text/helper-text.js";
+import { Label as $ } from "../label/label.js";
+const f = c(({ children: o, ...e }, t) => /* @__PURE__ */ i("option", { ref: t, ...e, children: o }));
+f.displayName = "Select.Option";
+const u = c(
+  ({ label: o, children: e, ...t }, r) => /* @__PURE__ */ i("optgroup", { ref: r, label: o, ...t, children: e })
+);
+u.displayName = "Select.OptionGroup";
+const v = c(
+  ({ label: o, helper: e, error: t, required: r = !1, disabled: n = !1, placeholder: d, children: h, id: x, className: y, ...O }, I) => {
+    const N = G(), s = x || N, l = e ? `${s}-helper` : void 0, a = t ? `${s}-error` : void 0, j = [l, a].filter(Boolean).join(" "), B = g({
+      disabled: n,
+      invalid: !!t
+    });
+    return /* @__PURE__ */ p("div", { className: b(m.field, y), children: [
+      o && /* @__PURE__ */ i($, { htmlFor: s, required: r, disabled: n, children: o }),
+      /* @__PURE__ */ p(
+        "select",
+        {
+          ref: I,
+          id: s,
+          className: m.select,
+          disabled: n,
+          required: r,
+          "aria-invalid": t ? "true" : void 0,
+          "aria-disabled": n ? "true" : void 0,
+          "aria-describedby": j || void 0,
+          ...B,
+          ...O,
+          children: [
+            d && /* @__PURE__ */ i("option", { value: "", disabled: !0, children: d }),
+            h
+          ]
+        }
+      ),
+      t && /* @__PURE__ */ i(A, { id: a, children: t }),
+      !t && e && /* @__PURE__ */ i(T, { id: l, children: e })
+    ] });
+  }
+);
+v.displayName = "Select";
+const S = v;
+S.Option = f;
+S.OptionGroup = u;
+export {
+  S as Select,
+  f as SelectOption,
+  u as SelectOptionGroup
+};

package/dist/components/forms/text-area/text-area.js

@@ -0,0 +1,62 @@
+import { jsxs as j, jsx as o } from "react/jsx-runtime";
+import l from "../../../core/src/components/forms/text-area/text-area.module.css.js";
+import { forwardRef as w, useId as B } from "react";
+import { cx as N } from "../../../utils/cx.js";
+import { useDataAttrs as b } from "../../../hooks/use-data-attrs.js";
+import { ErrorText as _ } from "../error-text/error-text.js";
+import { HelperText as $ } from "../helper-text/helper-text.js";
+import { Label as g } from "../label/label.js";
+const z = w(
+  ({
+    label: s,
+    helper: i,
+    error: t,
+    required: d = !1,
+    disabled: e = !1,
+    readOnly: m = !1,
+    resizable: f = !0,
+    minRows: x = 3,
+    maxRows: a,
+    id: p,
+    className: u,
+    ...v
+  }, h) => {
+    const A = B(), r = p || A, n = i ? `${r}-helper` : void 0, c = t ? `${r}-error` : void 0, I = [n, c].filter(Boolean).join(" "), y = b({
+      disabled: e,
+      invalid: !!t,
+      readOnly: m,
+      resizable: f ? "true" : "false",
+      minRows: "true",
+      ...a && { maxRows: "true" }
+    }), T = {
+      "--_min-rows-count": x,
+      ...a && { "--_max-rows-count": a }
+    };
+    return /* @__PURE__ */ j("div", { className: N(l.field, u), children: [
+      s && /* @__PURE__ */ o(g, { htmlFor: r, required: d, disabled: e, children: s }),
+      /* @__PURE__ */ o(
+        "textarea",
+        {
+          ref: h,
+          id: r,
+          className: l.textarea,
+          disabled: e,
+          readOnly: m,
+          required: d,
+          style: T,
+          "aria-invalid": t ? "true" : void 0,
+          "aria-disabled": e ? "true" : void 0,
+          "aria-describedby": I || void 0,
+          ...y,
+          ...v
+        }
+      ),
+      t && /* @__PURE__ */ o(_, { id: c, children: t }),
+      !t && i && /* @__PURE__ */ o($, { id: n, children: i })
+    ] });
+  }
+);
+z.displayName = "TextArea";
+export {
+  z as TextArea
+};

package/dist/components/forms/text-input/text-input.js

@@ -0,0 +1,60 @@
+import { jsxs as f, jsx as i } from "react/jsx-runtime";
+import e from "../../../core/src/components/forms/text-input/text-input.module.css.js";
+import { forwardRef as y, useId as T } from "react";
+import { cx as j } from "../../../utils/cx.js";
+import { useDataAttrs as w } from "../../../hooks/use-data-attrs.js";
+import { ErrorText as A } from "../error-text/error-text.js";
+import { HelperText as L } from "../helper-text/helper-text.js";
+import { Label as R } from "../label/label.js";
+const $ = y(
+  ({
+    label: d,
+    helper: r,
+    error: t,
+    required: m = !1,
+    disabled: o = !1,
+    readOnly: c = !1,
+    leftIcon: s,
+    rightIcon: n,
+    id: h,
+    className: u,
+    ...x
+  }, v) => {
+    const I = T(), a = h || I, l = r ? `${a}-helper` : void 0, p = t ? `${a}-error` : void 0, N = [l, p].filter(Boolean).join(" "), B = w({
+      disabled: o,
+      hasLeftIcon: !!s,
+      hasRightIcon: !!n,
+      invalid: !!t,
+      readOnly: c
+    });
+    return /* @__PURE__ */ f("div", { className: j(e.field, u), children: [
+      d && /* @__PURE__ */ i(R, { htmlFor: a, required: m, disabled: o, children: d }),
+      /* @__PURE__ */ f("div", { className: e.wrapper, ...B, children: [
+        s && /* @__PURE__ */ i("span", { className: e["left-icon"], children: s }),
+        /* @__PURE__ */ i(
+          "input",
+          {
+            ref: v,
+            id: a,
+            type: "text",
+            className: e.input,
+            disabled: o,
+            readOnly: c,
+            required: m,
+            "aria-invalid": t ? "true" : void 0,
+            "aria-disabled": o ? "true" : void 0,
+            "aria-describedby": N || void 0,
+            ...x
+          }
+        ),
+        n && /* @__PURE__ */ i("span", { className: e["right-icon"], children: n })
+      ] }),
+      t && /* @__PURE__ */ i(A, { id: p, children: t }),
+      !t && r && /* @__PURE__ */ i(L, { id: l, children: r })
+    ] });
+  }
+);
+$.displayName = "TextInput";
+export {
+  $ as TextInput
+};