@code0-tech/pictor 0.3.0 → 0.4.0

package/dist/components/form/InputSuggestion.js

@@ -0,0 +1,218 @@
+import { jsx as I, jsxs as B } from "react/jsx-runtime";
+import { c as x } from "../../_virtual/compiler-runtime.js";
+import { MenuItem as L, MenuContent as F, MenuLabel as k } from "../menu/Menu.js";
+import i from "react";
+import { ScrollArea as N, ScrollAreaViewport as O, ScrollAreaScrollbar as T, ScrollAreaThumb as j } from "../scroll-area/ScrollArea.js";
+import { IconChevronDown as $, IconChevronUp as z } from "@tabler/icons-react";
+const D = i.memo((l) => {
+  const e = x.c(17), {
+    suggestion: n,
+    visibleIndex: u,
+    isActive: p,
+    inputRef: d,
+    onSelect: v,
+    onActivate: c,
+    itemRef: f
+  } = l;
+  if (u === null)
+    return null;
+  let m;
+  if (e[0] !== d || e[1] !== c || e[2] !== u) {
+    const b = () => {
+      c(u), d?.current?.focus({
+        preventScroll: !0
+      });
+    };
+    m = (M) => {
+      M.preventDefault(), b();
+    }, e[0] = d, e[1] = c, e[2] = u, e[3] = m;
+  } else
+    m = e[3];
+  const g = m;
+  let a;
+  e[4] !== c || e[5] !== u ? (a = (b) => {
+    b.preventDefault(), b.stopPropagation(), c(u);
+  }, e[4] = c, e[5] = u, e[6] = a) : a = e[6];
+  const y = a;
+  let C;
+  e[7] !== v || e[8] !== n ? (C = () => setTimeout(() => v(n), 0), e[7] = v, e[8] = n, e[9] = C) : C = e[9];
+  let o;
+  return e[10] !== g || e[11] !== y || e[12] !== p || e[13] !== f || e[14] !== n.children || e[15] !== C ? (o = /* @__PURE__ */ I(L, { textValue: "", onPointerDown: g, onPointerMove: y, onSelect: C, "data-focus": p, ref: f, children: n.children }), e[10] = g, e[11] = y, e[12] = p, e[13] = f, e[14] = n.children, e[15] = C, e[16] = o) : o = e[16], o;
+}, (l, e) => l.suggestion === e.suggestion && l.visibleIndex === e.visibleIndex && l.isActive === e.isActive && l.inputRef === e.inputRef && l.onSelect === e.onSelect && l.onActivate === e.onActivate && l.itemRef === e.itemRef);
+D.displayName = "SuggestionMenuItem";
+const P = i.forwardRef((l, e) => {
+  const n = x.c(12);
+  let u, p, d;
+  n[0] !== l ? ({
+    children: u,
+    inputRef: p,
+    ...d
+  } = l, n[0] = l, n[1] = u, n[2] = p, n[3] = d) : (u = n[1], p = n[2], d = n[3]);
+  const v = i.useRef(null);
+  let c, f;
+  n[4] !== p ? (c = (g) => {
+    g.preventDefault(), p?.current?.focus({
+      preventScroll: !0
+    });
+  }, f = () => p?.current?.focus({
+    preventScroll: !0
+  }), n[4] = p, n[5] = c, n[6] = f) : (c = n[5], f = n[6]);
+  let m;
+  return n[7] !== u || n[8] !== d || n[9] !== c || n[10] !== f ? (m = /* @__PURE__ */ I(F, { ref: v, onContextMenuCapture: H, onInteractOutside: U, onCloseAutoFocus: q, onOpenAutoFocus: c, onFocusCapture: f, align: "start", sideOffset: 8, ...d, children: u }), n[7] = u, n[8] = d, n[9] = c, n[10] = f, n[11] = m) : m = n[11], m;
+});
+P.displayName = "InputSuggestionMenuContent";
+const Z = i.memo(P), V = i.forwardRef((l, e) => {
+  const {
+    suggestions: n,
+    onSuggestionSelect: u = () => {
+    },
+    inputRef: p,
+    ...d
+  } = l, v = i.useRef([]), c = i.useRef(/* @__PURE__ */ new Map()), [f, m] = i.useState({}), g = i.useRef(null), a = i.useCallback((t, r) => {
+    const s = g.current;
+    if (!(!r?.force && s === t) && (s !== null && v.current[s]?.removeAttribute("data-focus"), g.current = t, t !== null)) {
+      const h = v.current[t];
+      h && (h.setAttribute("data-focus", "true"), r?.scrollIntoView && h.scrollIntoView({
+        block: "nearest"
+      }));
+    }
+  }, []);
+  i.useEffect(() => {
+    if (!n) {
+      m({});
+      return;
+    }
+    m((t) => {
+      const r = {};
+      return n.forEach((s) => {
+        s.groupBy && (t.hasOwnProperty(s.groupBy) ? r[s.groupBy] = t[s.groupBy] : r[s.groupBy] = !1);
+      }), r;
+    });
+  }, [n]);
+  const {
+    groupLabelCount: y,
+    visibleSuggestionCount: C,
+    visibleSuggestions: o
+  } = i.useMemo(() => {
+    if (!n) return {
+      groupLabelCount: 0,
+      visibleSuggestionCount: 0,
+      visibleSuggestions: []
+    };
+    let t = 0, r = 0;
+    const s = [];
+    return n.forEach((h, A, R) => {
+      const S = A > 0 ? R[A - 1]?.groupBy : void 0;
+      h.groupBy && h.groupBy !== S && (t += 1), h.groupBy && f[h.groupBy] || (r += 1, s.push(h));
+    }), {
+      groupLabelCount: t,
+      visibleSuggestionCount: r,
+      visibleSuggestions: s
+    };
+  }, [f, n]);
+  i.useEffect(() => {
+    const t = g.current;
+    if (t !== null) {
+      if (t > o.length - 1) {
+        a(o.length ? o.length - 1 : null, {
+          force: !0
+        });
+        return;
+      }
+      a(t, {
+        force: !0
+      });
+    }
+  }, [a, o]), i.useImperativeHandle(e, () => ({
+    focusFirstItem: () => {
+      if (o.length)
+        return a(0, {
+          scrollIntoView: !0
+        }), o[0];
+    },
+    focusLastItem: () => {
+      if (!o.length) return;
+      const t = o.length - 1;
+      return a(t, {
+        scrollIntoView: !0
+      }), o[t];
+    },
+    highlightNextItem: () => {
+      if (!o.length) return;
+      const t = g.current, r = t === null ? 0 : Math.min(t + 1, o.length - 1);
+      return a(r, {
+        scrollIntoView: !0
+      }), o[r];
+    },
+    highlightPreviousItem: () => {
+      if (!o.length) return;
+      const t = g.current, r = t === null ? o.length - 1 : Math.max(t - 1, 0);
+      return a(r, {
+        scrollIntoView: !0
+      }), o[r];
+    },
+    selectActiveItem: () => {
+      const t = g.current;
+      if (t === null || !o[t]) return;
+      const r = o[t];
+      return setTimeout(() => u(r), 0), r;
+    },
+    clearActiveItem: () => a(null)
+  }), [u, a, o]);
+  const b = (t) => {
+    m((r) => ({
+      ...r,
+      [t]: !r[t]
+    }));
+  }, M = i.useCallback((t) => {
+    let r = c.current.get(t);
+    return r || (r = (s) => {
+      v.current[t] = s;
+    }, c.current.set(t, r)), r;
+  }, []);
+  let E = -1;
+  return /* @__PURE__ */ B(N, { h: `${Math.max(C + y, 1) * 27}px`, mah: "calc(var(--radix-popper-available-height) - 3rem - 69px)", ...d, children: [
+    /* @__PURE__ */ I(O, { children: n?.map((t, r, s) => {
+      const h = r > 0 ? s[r - 1]?.groupBy : void 0, A = t.groupBy && t.groupBy !== h, R = t.groupBy ? f[t.groupBy] : !1, S = R ? null : ++E, w = S !== null && g.current === S;
+      return /* @__PURE__ */ B(i.Fragment, { children: [
+        A && t.groupBy && /* @__PURE__ */ B(k, { onPointerDown: (G) => G.preventDefault(), onClick: () => b(t.groupBy), style: {
+          display: "flex",
+          alignItems: "center",
+          justifyContent: "space-between",
+          cursor: "pointer"
+        }, children: [
+          /* @__PURE__ */ I("span", { children: t.groupBy }),
+          R ? /* @__PURE__ */ I($, { size: 16 }) : /* @__PURE__ */ I(z, { size: 16 })
+        ] }),
+        !R && /* @__PURE__ */ I(
+          D,
+          {
+            suggestion: t,
+            visibleIndex: S,
+            isActive: w,
+            inputRef: p,
+            onSelect: u,
+            onActivate: a,
+            itemRef: S !== null ? M(S) : void 0
+          }
+        )
+      ] }, r);
+    }) }),
+    /* @__PURE__ */ I(T, { orientation: "vertical", children: /* @__PURE__ */ I(j, {}) })
+  ] });
+});
+V.displayName = "InputSuggestionMenuContentItems";
+const _ = i.memo(V);
+function H(l) {
+  return l.stopPropagation();
+}
+function U(l) {
+  return l.target instanceof HTMLInputElement && l.preventDefault();
+}
+function q(l) {
+  return l.preventDefault();
+}
+export {
+  Z as InputSuggestionMenuContent,
+  _ as InputSuggestionMenuContentItems
+};

package/dist/components/form/NumberInput.d.ts

@@ -0,0 +1,6 @@
+import { default as React } from 'react';
+import { InputProps } from './Input';
+interface NumberInputProps extends Omit<InputProps<string | null>, "wrapperComponent" | "type" | "left" | "right" | "leftType" | "rightType"> {
+}
+export declare const NumberInput: React.ForwardRefExoticComponent<NumberInputProps>;
+export {};

package/dist/components/form/NumberInput.js

@@ -0,0 +1,20 @@
+import { jsx as t } from "react/jsx-runtime";
+import u from "react";
+import { Input as i } from "./Input.js";
+import { IconMinus as a, IconPlus as l } from "@tabler/icons-react";
+import { Button as e } from "../button/Button.js";
+const d = u.forwardRef((o, n) => {
+  n = n || u.useRef(null);
+  const {
+    step: r = 1,
+    ...c
+  } = o;
+  return /* @__PURE__ */ t(i, { className: "number-input", right: /* @__PURE__ */ t(e, { variant: "none", onClick: () => {
+    n.current && (n.current.value || (n.current.value = "0"), n.current.value = (Number.parseInt(n.current.value) + r).toString());
+  }, children: /* @__PURE__ */ t(l, { size: 13 }) }), left: /* @__PURE__ */ t(e, { variant: "none", onClick: () => {
+    n.current && (n.current.value || (n.current.value = "0"), n.current.value = (Number.parseInt(n.current.value) - r).toString());
+  }, children: /* @__PURE__ */ t(a, { size: 13 }) }), leftType: "action", type: "number", ref: n, ...c });
+});
+export {
+  d as NumberInput
+};

package/dist/components/form/PasswordInput.d.ts

@@ -0,0 +1,8 @@
+import { default as React } from 'react';
+import { InputProps } from './Input';
+interface PasswordInputProps extends Omit<InputProps<string | null>, "wrapperComponent" | "type"> {
+    clearable?: boolean;
+    visible?: boolean;
+}
+export declare const PasswordInput: React.ForwardRefExoticComponent<PasswordInputProps>;
+export {};

package/dist/components/form/PasswordInput.js

@@ -0,0 +1,19 @@
+import { jsx as e } from "react/jsx-runtime";
+import n from "react";
+import { Input as f } from "./Input.js";
+import { IconEye as h, IconX as d } from "@tabler/icons-react";
+import { Button as i } from "../button/Button.js";
+import { clearInputElement as y } from "./Input.utils.js";
+const C = n.forwardRef((p, t) => {
+  t = t || n.useRef(null);
+  const {
+    clearable: s = !0,
+    visible: a = !0,
+    right: c,
+    ...u
+  } = p, l = (r) => (y(t.current), r.stopPropagation(), r.preventDefault(), !1), m = (r) => (t.current instanceof HTMLInputElement && (t.current.type === "password" ? t.current.type = "text" : t.current.type === "text" && (t.current.type = "password")), r.stopPropagation(), r.preventDefault(), !1), o = [c];
+  return a && o.push(/* @__PURE__ */ e(i, { variant: "none", onClick: (r) => m(r), children: /* @__PURE__ */ e(h, { size: 13 }) })), s && o.push(/* @__PURE__ */ e(i, { variant: "none", onClick: (r) => l(r), children: /* @__PURE__ */ e(d, { size: 13 }) })), /* @__PURE__ */ e(f, { right: o, rightType: "action", type: "password", ref: t, ...u });
+});
+export {
+  C as PasswordInput
+};

package/dist/components/form/PinInput.d.ts

@@ -0,0 +1,11 @@
+import { OneTimePasswordFieldHiddenInputProps, OneTimePasswordFieldInputProps, OneTimePasswordFieldProps } from '@radix-ui/react-one-time-password-field';
+import { Code0ComponentProps } from '../../utils/types';
+import { default as React } from 'react';
+import { InputProps } from './Input';
+type PinInputProps = Omit<InputProps<string | null>, "wrapperComponent" | "type" | "left" | "right" | "leftType" | "rightType"> & OneTimePasswordFieldProps;
+type PinInputFieldProps = Code0ComponentProps & OneTimePasswordFieldInputProps;
+type PinInputHiddenFieldProps = Code0ComponentProps & OneTimePasswordFieldHiddenInputProps;
+export declare const PinInput: React.FC<PinInputProps>;
+export declare const PinInputField: React.FC<PinInputFieldProps>;
+export declare const PinInputHiddenField: React.FC<PinInputHiddenFieldProps>;
+export {};

package/dist/components/form/PinInput.js

@@ -0,0 +1,66 @@
+import { jsx as d, jsxs as F, Fragment as x } from "react/jsx-runtime";
+import { c as I } from "../../_virtual/compiler-runtime.js";
+import { OneTimePasswordFieldInput as C, OneTimePasswordFieldHiddenInput as M, OneTimePasswordField as T } from "@radix-ui/react-one-time-password-field";
+import { mergeCode0Props as V } from "../../utils/utils.js";
+import { InputLabel as _ } from "./InputLabel.js";
+import { InputDescription as $ } from "./InputDescription.js";
+import { InputMessage as w } from "./InputMessage.js";
+import '../../assets/components/form/Input.style.css';/* empty css                 */
+const y = (l) => {
+  const e = I.c(26);
+  let t, i, r, n, o, s;
+  if (e[0] !== l) {
+    const {
+      title: c,
+      description: p,
+      disabled: b,
+      formValidation: P,
+      ...g
+    } = l;
+    i = P === void 0 ? {
+      valid: !0,
+      notValidMessage: null,
+      setValue: O
+    } : P, e[7] !== c ? (o = c ? /* @__PURE__ */ d(_, { children: c }) : null, e[7] = c, e[8] = o) : o = e[8], e[9] !== p ? (s = p ? /* @__PURE__ */ d($, { children: p }) : null, e[9] = p, e[10] = s) : s = e[10];
+    const h = `${i?.valid ? "" : "input--not-valid"}`;
+    e[11] !== h ? (n = V(h, {}), e[11] = h, e[12] = n) : n = e[12], t = T, r = V("pin-input", {
+      ...g,
+      onValueChange: (v) => {
+        g.onValueChange && g.onValueChange(v), i.setValue(v);
+      }
+    }), e[0] = l, e[1] = t, e[2] = i, e[3] = r, e[4] = n, e[5] = o, e[6] = s;
+  } else
+    t = e[1], i = e[2], r = e[3], n = e[4], o = e[5], s = e[6];
+  let a;
+  e[13] !== t || e[14] !== r ? (a = /* @__PURE__ */ d(t, { ...r }), e[13] = t, e[14] = r, e[15] = a) : a = e[15];
+  let u;
+  e[16] !== n || e[17] !== a ? (u = /* @__PURE__ */ d("div", { ...n, children: a }), e[16] = n, e[17] = a, e[18] = u) : u = e[18];
+  let f;
+  e[19] !== i ? (f = !i?.valid && i?.notValidMessage ? /* @__PURE__ */ d(w, { children: i.notValidMessage }) : null, e[19] = i, e[20] = f) : f = e[20];
+  let m;
+  return e[21] !== o || e[22] !== s || e[23] !== u || e[24] !== f ? (m = /* @__PURE__ */ F(x, { children: [
+    o,
+    s,
+    u,
+    f
+  ] }), e[21] = o, e[22] = s, e[23] = u, e[24] = f, e[25] = m) : m = e[25], m;
+}, z = (l) => {
+  const e = I.c(4);
+  let t;
+  e[0] !== l ? (t = V("input pin-input__field", l), e[0] = l, e[1] = t) : t = e[1];
+  let i;
+  return e[2] !== t ? (i = /* @__PURE__ */ d(C, { ...t }), e[2] = t, e[3] = i) : i = e[3], i;
+}, A = (l) => {
+  const e = I.c(4);
+  let t;
+  e[0] !== l ? (t = V("pin-input__hidden-field", l), e[0] = l, e[1] = t) : t = e[1];
+  let i;
+  return e[2] !== t ? (i = /* @__PURE__ */ d(M, { ...t }), e[2] = t, e[3] = i) : i = e[3], i;
+};
+function O(l) {
+}
+export {
+  y as PinInput,
+  z as PinInputField,
+  A as PinInputHiddenField
+};

package/dist/components/form/RadioGroup.d.ts

@@ -0,0 +1,5 @@
+import { default as React } from 'react';
+import { InputProps } from './Input';
+import * as RadixRadioGroup from "@radix-ui/react-radio-group";
+export type RadioGroupProps = Omit<InputProps<string | null>, "wrapperComponent" | "type" | "left" | "right" | "leftType" | "rightType"> & RadixRadioGroup.RadioGroupProps;
+export declare const RadioGroup: React.FC<RadioGroupProps>;

package/dist/components/form/RadioGroup.js

@@ -0,0 +1,48 @@
+import { jsx as p, jsxs as x, Fragment as R } from "react/jsx-runtime";
+import { c as C } from "../../_virtual/compiler-runtime.js";
+import * as M from "@radix-ui/react-radio-group";
+import { mergeCode0Props as v } from "../../utils/utils.js";
+import { InputLabel as G } from "./InputLabel.js";
+import { InputDescription as I } from "./InputDescription.js";
+import { InputMessage as j } from "./InputMessage.js";
+import '../../assets/components/form/Input.style.css';/* empty css                 */
+const k = (u) => {
+  const e = C.c(22);
+  let o, t, a, r, l, i;
+  if (e[0] !== u) {
+    const {
+      title: d,
+      description: f,
+      initialValue: h,
+      formValidation: V,
+      ...c
+    } = u;
+    t = V === void 0 ? {
+      valid: !0,
+      notValidMessage: null,
+      setValue: b
+    } : V, e[7] !== d ? (l = d ? /* @__PURE__ */ p(G, { children: d }) : null, e[7] = d, e[8] = l) : l = e[8], e[9] !== f ? (i = f ? /* @__PURE__ */ p(I, { children: f }) : null, e[9] = f, e[10] = i) : i = e[10], o = M.RadioGroup, a = h ?? u.defaultValue, r = v("radio-group", {
+      ...c,
+      onValueChange: (g) => {
+        c.onValueChange && c.onValueChange(g), t.setValue(g);
+      }
+    }), e[0] = u, e[1] = o, e[2] = t, e[3] = a, e[4] = r, e[5] = l, e[6] = i;
+  } else
+    o = e[1], t = e[2], a = e[3], r = e[4], l = e[5], i = e[6];
+  let n;
+  e[11] !== o || e[12] !== a || e[13] !== r ? (n = /* @__PURE__ */ p(o, { defaultValue: a, ...r }), e[11] = o, e[12] = a, e[13] = r, e[14] = n) : n = e[14];
+  let s;
+  e[15] !== t ? (s = !t?.valid && t?.notValidMessage ? /* @__PURE__ */ p(j, { children: t.notValidMessage }) : null, e[15] = t, e[16] = s) : s = e[16];
+  let m;
+  return e[17] !== l || e[18] !== i || e[19] !== n || e[20] !== s ? (m = /* @__PURE__ */ x(R, { children: [
+    l,
+    i,
+    n,
+    s
+  ] }), e[17] = l, e[18] = i, e[19] = n, e[20] = s, e[21] = m) : m = e[21], m;
+};
+function b(u) {
+}
+export {
+  k as RadioGroup
+};

package/dist/components/form/RadioInput.d.ts

@@ -0,0 +1,7 @@
+import { default as React } from 'react';
+import { Code0ComponentProps } from '../../utils/types';
+import * as RadixRadioGroup from "@radix-ui/react-radio-group";
+export type RadioInputProps = Code0ComponentProps & RadixRadioGroup.RadioGroupItemProps & {
+    label: React.ReactNode;
+};
+export declare const RadioInput: React.FC<RadioInputProps>;

package/dist/components/form/RadioInput.js

@@ -0,0 +1,27 @@
+import { jsx as c, jsxs as u } from "react/jsx-runtime";
+import { c as f } from "../../_virtual/compiler-runtime.js";
+import * as s from "@radix-ui/react-radio-group";
+import { mergeCode0Props as d } from "../../utils/utils.js";
+import '../../assets/components/form/Input.style.css';/* empty css                 */
+const R = (t) => {
+  const e = f.c(11);
+  let l;
+  e[0] === /* @__PURE__ */ Symbol.for("react.memo_cache_sentinel") ? (l = d("input radio-input", {}), e[0] = l) : l = e[0];
+  let r;
+  e[1] !== t ? (r = d("radio-input__button", t), e[1] = t, e[2] = r) : r = e[2];
+  const m = r;
+  let a;
+  e[3] === /* @__PURE__ */ Symbol.for("react.memo_cache_sentinel") ? (a = /* @__PURE__ */ c(s.RadioGroupIndicator, { className: "radio-input__indicator" }), e[3] = a) : a = e[3];
+  let i;
+  e[4] !== m ? (i = /* @__PURE__ */ c(s.RadioGroupItem, { ...m, children: a }), e[4] = m, e[5] = i) : i = e[5];
+  let o;
+  e[6] !== t.label ? (o = /* @__PURE__ */ c("div", { className: "input__right input__right--action}", children: t.label }), e[6] = t.label, e[7] = o) : o = e[7];
+  let n;
+  return e[8] !== i || e[9] !== o ? (n = /* @__PURE__ */ u("div", { ...l, children: [
+    i,
+    o
+  ] }), e[8] = i, e[9] = o, e[10] = n) : n = e[10], n;
+};
+export {
+  R as RadioInput
+};

package/dist/components/form/SwitchInput.d.ts

@@ -0,0 +1,6 @@
+import { default as React } from 'react';
+import { InputProps } from './Input';
+interface SwitchInputProps extends Omit<InputProps<boolean | null>, "wrapperComponent" | "type" | "left" | "leftType"> {
+}
+export declare const SwitchInput: React.ForwardRefExoticComponent<SwitchInputProps>;
+export {};

package/dist/components/form/SwitchInput.js

@@ -0,0 +1,19 @@
+import { jsx as u } from "react/jsx-runtime";
+import e from "react";
+import { Input as p } from "./Input.js";
+const m = e.forwardRef((r, t) => {
+  t = t || e.useRef(null);
+  const {
+    value: o,
+    initialValue: l,
+    ...n
+  } = r;
+  return /* @__PURE__ */ u(p, { wrapperComponent: {
+    className: "switch-input"
+  }, type: "checkbox", right: null, left: null, ref: t, value: o, ...l ? {
+    defaultChecked: !0
+  } : {}, ...n });
+});
+export {
+  m as SwitchInput
+};

package/dist/components/form/TextAreaInput.d.ts

@@ -0,0 +1,7 @@
+import { default as React } from 'react';
+import { InputProps } from './Input';
+export interface TextAreaInputProps extends Omit<InputProps<string | null>, "wrapperComponent" | "type"> {
+    clearable?: boolean;
+    onClear?: (event: React.MouseEvent<HTMLButtonElement>) => void;
+}
+export declare const TextAreaInput: React.ForwardRefExoticComponent<TextAreaInputProps>;

package/dist/components/form/TextAreaInput.js

@@ -0,0 +1,20 @@
+import { jsx as e } from "react/jsx-runtime";
+import a from "react";
+import { Input as u } from "./Input.js";
+import { IconX as f } from "@tabler/icons-react";
+import { Button as p } from "../button/Button.js";
+import { clearInputElement as s } from "./Input.utils.js";
+const b = a.forwardRef((r, t) => {
+  t = t || a.useRef(null);
+  const {
+    clearable: i = !1,
+    right: l,
+    ...m
+  } = r, c = (o) => {
+    s(t.current), r.onClear && r.onClear(o);
+  }, n = [l];
+  return i && n.push(/* @__PURE__ */ e(p, { variant: "none", onClick: (o) => c(o), children: /* @__PURE__ */ e(f, { size: 13 }) })), /* @__PURE__ */ e(u, { right: n, type: "textarea", ref: t, ...m });
+});
+export {
+  b as TextAreaInput
+};

package/dist/components/form/TextInput.d.ts

@@ -0,0 +1,7 @@
+import { default as React } from 'react';
+import { InputProps } from './Input';
+export interface TextInputProps extends Omit<InputProps<string | null>, "wrapperComponent" | "type"> {
+    clearable?: boolean;
+    onClear?: (event: React.MouseEvent<HTMLButtonElement>) => void;
+}
+export declare const TextInput: React.ForwardRefExoticComponent<TextInputProps>;

package/dist/components/form/TextInput.js

@@ -0,0 +1,20 @@
+import { jsx as e } from "react/jsx-runtime";
+import i from "react";
+import { Input as u } from "./Input.js";
+import { IconX as f } from "@tabler/icons-react";
+import { Button as p } from "../button/Button.js";
+import { clearInputElement as s } from "./Input.utils.js";
+const b = i.forwardRef((r, t) => {
+  t = t || i.useRef(null);
+  const {
+    clearable: l = !1,
+    right: m,
+    ...a
+  } = r, c = (o) => {
+    s(t.current), r.onClear && r.onClear(o);
+  }, n = [m];
+  return l && n.push(/* @__PURE__ */ e(p, { variant: "none", onClick: (o) => c(o), children: /* @__PURE__ */ e(f, { size: 13 }) })), /* @__PURE__ */ e(u, { right: n, type: "text", ref: t, ...a });
+});
+export {
+  b as TextInput
+};

package/dist/components/form/index.d.ts

@@ -0,0 +1,17 @@
+export * from './CheckboxInput';
+export * from './EmailInput';
+export * from './Input';
+export * from './InputDescription';
+export * from './InputLabel';
+export * from './InputMessage';
+export * from './InputSuggestion';
+export * from './NumberInput';
+export * from './PasswordInput';
+export * from './PinInput';
+export * from './RadioGroup';
+export * from './RadioInput';
+export * from './SwitchInput';
+export * from './TextAreaInput';
+export * from './TextInput';
+export * from './useForm';
+export * from './Input.syntax.hook';

package/dist/components/form/index.js

@@ -0,0 +1,40 @@
+import { CheckboxInput as r } from "./CheckboxInput.js";
+import { EmailInput as p, emailValidation as n } from "./EmailInput.js";
+import { Input as m } from "./Input.js";
+import { InputDescription as f } from "./InputDescription.js";
+import { InputLabel as I } from "./InputLabel.js";
+import { InputMessage as d } from "./InputMessage.js";
+import { InputSuggestionMenuContent as l, InputSuggestionMenuContentItems as g } from "./InputSuggestion.js";
+import { NumberInput as P } from "./NumberInput.js";
+import { PasswordInput as c } from "./PasswordInput.js";
+import { PinInput as F, PinInputField as M, PinInputHiddenField as h } from "./PinInput.js";
+import { RadioGroup as D } from "./RadioGroup.js";
+import { RadioInput as T } from "./RadioInput.js";
+import { SwitchInput as y } from "./SwitchInput.js";
+import { TextAreaInput as E } from "./TextAreaInput.js";
+import { TextInput as H } from "./TextInput.js";
+import { useForm as N } from "./useForm.js";
+import { buildDefaultSyntax as j } from "./Input.syntax.hook.js";
+export {
+  r as CheckboxInput,
+  p as EmailInput,
+  m as Input,
+  f as InputDescription,
+  I as InputLabel,
+  d as InputMessage,
+  l as InputSuggestionMenuContent,
+  g as InputSuggestionMenuContentItems,
+  P as NumberInput,
+  c as PasswordInput,
+  F as PinInput,
+  M as PinInputField,
+  h as PinInputHiddenField,
+  D as RadioGroup,
+  T as RadioInput,
+  y as SwitchInput,
+  E as TextAreaInput,
+  H as TextInput,
+  j as buildDefaultSyntax,
+  n as emailValidation,
+  N as useForm
+};

package/dist/components/form/useForm.d.ts

@@ -0,0 +1,30 @@
+export type Validations<Values> = Partial<{
+    [Key in keyof Values]: (value: Values[Key], values?: Values) => string | null;
+}>;
+export interface FormValidationProps<Values> {
+    initialValues: Values;
+    validate?: Validations<Values>;
+    truthyValidationBeforeSubmit?: boolean;
+    useInitialValidation?: boolean;
+    onSubmit?: (values: Values) => void;
+}
+export interface ValidationProps<Value> {
+    initialValue?: Value | undefined;
+    defaultValue?: Value | undefined;
+    value?: Value | undefined;
+    required?: boolean;
+    formValidation?: {
+        setValue: (value: any) => void;
+        valid?: boolean;
+        notValidMessage?: string | null;
+    };
+}
+export type ValidationsProps<Values> = Partial<{
+    [Key in keyof Values]: ValidationProps<Values[Key]>;
+}>;
+export type FormValidationReturn<Values> = [IValidation<Values>, () => void];
+export interface IValidation<Values> {
+    getInputProps<Key extends keyof Values>(key: Key): ValidationProps<Values[Key]>;
+    isValid(): boolean;
+}
+export declare const useForm: <Values extends Record<string, any> = Record<string, any>>(props: FormValidationProps<Values>) => FormValidationReturn<Values>;