@memobit/libs 2.1.0 → 3.1.0

package/dist/components/InputDate/InputDate2.js

@@ -0,0 +1,87 @@
+import './InputDate.css';
+import { Icon as f } from "../Icon/Icon2.js";
+import { Tooltip as N } from "../Tooltip/Tooltip2.js";
+/* empty css          */
+import { forwardRef as j, useRef as z } from "react";
+import { jsx as e, jsxs as s } from "react/jsx-runtime";
+var E = j(({ autoComplete: v = "on", autoFocus: k, clearable: b, disabled: a, error: c, highlighted: g, id: l, label: o, max: R, min: w, onBlur: x, onChange: p, onClick: C, onKeyDown: $, onKeyUp: I, readOnly: n = !1, required: d = !1, success: r, type: P = "date", value: u }, i) => {
+  const m = b && u && !a && !n, h = z(null);
+  return /* @__PURE__ */ s("div", {
+    className: `input-date-wrapper${g ? " input-date-highlighted" : ""}`,
+    children: [
+      o && /* @__PURE__ */ s("label", {
+        htmlFor: l,
+        className: "input-date-label",
+        children: [o, d && /* @__PURE__ */ e("span", {
+          className: "input-date-required",
+          children: "*"
+        })]
+      }),
+      /* @__PURE__ */ s("div", {
+        className: "input-date-field",
+        children: [/* @__PURE__ */ e("input", {
+          autoComplete: v,
+          autoFocus: k,
+          disabled: a,
+          type: P === "date" ? "date" : "datetime-local",
+          className: `input-date${c ? " input-date-error" : ""}${r ? " input-date-success" : ""}${m ? " input-date--clearable" : ""}`,
+          id: l,
+          max: R,
+          min: w,
+          ref: (t) => {
+            h.current = t, typeof i == "function" ? i(t) : i && (i.current = t);
+          },
+          value: u ?? "",
+          onBlur: x,
+          onChange: (t) => p?.(t.target.value || void 0),
+          onClick: C,
+          onKeyDown: $,
+          onKeyUp: I,
+          readOnly: n,
+          required: d
+        }), /* @__PURE__ */ s("div", {
+          className: "input-date-actions",
+          children: [m && /* @__PURE__ */ e(N, {
+            title: "Clear date",
+            children: /* @__PURE__ */ e("button", {
+              type: "button",
+              className: "input-date-clear",
+              onClick: () => p?.(void 0),
+              children: /* @__PURE__ */ e(f, {
+                name: "clear",
+                size: "sm"
+              })
+            })
+          }), /* @__PURE__ */ e(N, {
+            title: "Open calendar",
+            children: /* @__PURE__ */ e("button", {
+              type: "button",
+              className: "input-date-picker",
+              onClick: () => {
+                const t = h.current;
+                t && !a && !n && t.showPicker();
+              },
+              disabled: a || n,
+              tabIndex: -1,
+              children: /* @__PURE__ */ e(f, {
+                name: "calendar",
+                size: "sm"
+              })
+            })
+          })]
+        })]
+      }),
+      c && /* @__PURE__ */ e("span", {
+        className: "input-date-error-message",
+        children: c
+      }),
+      r && /* @__PURE__ */ e("span", {
+        className: "input-date-success-message",
+        children: r
+      })
+    ]
+  });
+});
+export {
+  E as InputDate
+};

package/dist/components/InputEmail/InputEmail.css

@@ -0,0 +1 @@
+.input-email-wrapper{gap:var(--spacing-8);flex-direction:column;width:100%;display:flex}.input-email-wrapper .input-email-label{color:var(--form-control-label-color,var(--form-control-color));font-size:var(--form-control-label-font-size,var(--font-size-sm));font-weight:var(--form-control-label-font-weight,var(--font-weight-medium));letter-spacing:var(--form-control-label-letter-spacing,normal);text-transform:var(--form-control-label-text-transform,none)}.input-email-wrapper .input-email-label .input-email-required{color:var(--body-danger-color,#dc2626);margin-left:var(--spacing-2)}.input-email-wrapper .input-email{background-color:var(--form-control-background-color);color:var(--form-control-color);border:var(--spacing-1) solid var(--form-control-border-color);border-radius:var(--radius-sm);padding:var(--spacing-12);font-family:var(--form-control-font-family);font-size:var(--font-size-sm);line-height:var(--line-height-normal);box-sizing:border-box;width:100%}.input-email-wrapper .input-email:focus{background-color:var(--form-control-focus-background-color);border-color:var(--form-control-focus-border-color);color:var(--form-control-focus-color);box-shadow:0 0 0 var(--spacing-2) var(--box-shadow);outline:none}.input-email-wrapper .input-email::placeholder{color:var(--form-control-placeholder-color)}.input-email-wrapper .input-email--error{background-color:var(--form-control-error-background-color);border-color:var(--form-control-error-border-color);color:var(--form-control-error-color)}.input-email-wrapper .input-email--error:focus{background-color:var(--form-control-error-background-color);border-color:var(--form-control-error-border-color);box-shadow:0 0 0 var(--spacing-2) var(--box-shadow)}.input-email-wrapper .input-email--valid{border-color:var(--progress-success-bar-fill-color)}.input-email-wrapper .input-email--valid:focus{border-color:var(--progress-success-bar-fill-color);box-shadow:0 0 0 var(--spacing-2) var(--progress-success-bar-fill-color) 33}.input-email-wrapper .input-email.input-email-error{background-color:var(--form-control-error-background-color);border-color:var(--form-control-error-border-color);color:var(--form-control-error-color)}.input-email-wrapper .input-email.input-email-error:focus{background-color:var(--form-control-error-background-color);border-color:var(--form-control-error-border-color);box-shadow:0 0 0 var(--spacing-2) var(--box-shadow)}.input-email-wrapper .input-email.input-email-success:focus{background-color:var(--form-control-success-background-color);border-color:var(--form-control-success-border-color);box-shadow:0 0 0 var(--spacing-2) var(--box-shadow)}.input-email-wrapper.input-email-highlighted .input-email{border-color:var(--form-control-focus-border-color)}.input-email-wrapper .input-email-error-message{font-size:var(--font-size-xs);color:var(--form-control-error-color)}.input-email-wrapper .input-email-success-message{font-size:var(--font-size-xs);color:var(--form-control-success-color)}.input-email-wrapper .input-email.input-email-success,.input-email-wrapper .input-email.input-email-success:focus{background-color:var(--form-control-success-background-color)!important;border-color:var(--form-control-success-border-color)!important;color:var(--form-control-success-color)!important}.input-email-wrapper .input-email-error-message{margin-top:calc(var(--spacing-4) * -1)}

package/dist/components/InputEmail/InputEmail2.js

@@ -0,0 +1,73 @@
+import './InputEmail.css';
+/* empty css           */
+import { forwardRef as F, useEffect as G, useState as N } from "react";
+import { jsx as n, jsxs as b } from "react/jsx-runtime";
+var L = /^[a-zA-Z0-9._%+-]+@[a-zA-Z0-9.-]+\.[a-zA-Z]{2,}$/, M = (r) => !r || r.trim() === "" ? !0 : L.test(r.trim()), k = F(({ autoComplete: r = "on", autoFocus: A, disabled: I, error: $ = "Please enter a valid email address", highlighted: v, id: o, label: p, maxLength: x, onBlur: z, onChange: Z, onClick: j, onKeyDown: B, onKeyUp: C, onValidate: s, placeholder: R, readOnly: T = !1, required: a = !1, showValidation: h = !1, success: m, validateOn: i = "blur", value: l }, _) => {
+  const [f, u] = N(!0), [d, g] = N(!1), c = (e) => a && (!e || e.trim() === "") ? !1 : !e || e.trim() === "" ? !0 : M(e);
+  G(() => {
+    if (l !== void 0) {
+      const e = c(l);
+      u(e), s?.(e);
+    }
+  }, [
+    l,
+    s,
+    a
+  ]);
+  const w = (e) => {
+    if (Z?.(e), i === "change" || i === "both") {
+      const t = c(e);
+      u(t), g(!0), s?.(t);
+    }
+  }, y = (e) => {
+    if (g(!0), i === "blur" || i === "both") {
+      const t = c(e.target.value);
+      u(t), s?.(t);
+    }
+    z?.(e);
+  }, E = h && d && !f;
+  return /* @__PURE__ */ b("div", {
+    className: `input-email-wrapper${v ? " input-email-highlighted" : ""}`,
+    children: [
+      p && /* @__PURE__ */ b("label", {
+        htmlFor: o,
+        className: "input-email-label",
+        children: [p, a && /* @__PURE__ */ n("span", {
+          className: "input-email-required",
+          children: "*"
+        })]
+      }),
+      /* @__PURE__ */ n("input", {
+        autoComplete: r,
+        autoFocus: A,
+        disabled: I,
+        type: "email",
+        className: `input-email${E ? " input-email--error" : ""}${m ? " input-email-success" : f && d && h ? " input-email--valid" : ""}`,
+        id: o,
+        maxLength: x,
+        placeholder: R,
+        ref: _,
+        value: l,
+        onBlur: y,
+        onChange: (e) => w(e.target.value),
+        onClick: j,
+        onKeyDown: B,
+        onKeyUp: C,
+        readOnly: T,
+        required: a
+      }),
+      E && /* @__PURE__ */ n("span", {
+        className: "input-email-error-message",
+        children: $
+      }),
+      m && /* @__PURE__ */ n("span", {
+        className: "input-email-success-message",
+        children: m
+      })
+    ]
+  });
+});
+export {
+  k as InputEmail,
+  M as validateEmail
+};

package/dist/components/InputFile/InputFile.css

@@ -0,0 +1 @@
+.input-file-wrapper{gap:var(--spacing-8);flex-direction:column;display:flex}.input-file-wrapper .input-file-label{color:var(--form-control-label-color,var(--form-control-color));font-size:var(--form-control-label-font-size,var(--font-size-sm));font-weight:var(--form-control-label-font-weight,var(--font-weight-medium));letter-spacing:var(--form-control-label-letter-spacing,normal);text-transform:var(--form-control-label-text-transform,none)}.input-file-wrapper .input-file-label .input-file-required{color:var(--body-danger-color,#dc2626);margin-left:var(--spacing-2)}.input-file-wrapper .input-file{background-color:var(--form-control-background-color);color:var(--form-control-color);border:var(--spacing-1) solid var(--form-control-border-color);border-radius:var(--radius-sm);padding:var(--spacing-12);font-family:var(--form-control-font-family);font-size:var(--font-size-sm);line-height:var(--line-height-normal);box-sizing:border-box;width:100%}.input-file-wrapper .input-file:focus{background-color:var(--form-control-focus-background-color);border-color:var(--form-control-focus-border-color);color:var(--form-control-focus-color);box-shadow:0 0 0 var(--spacing-2) var(--box-shadow);outline:none}.input-file-wrapper .input-file::placeholder{color:var(--form-control-placeholder-color)}.input-file-wrapper .input-file.input-file-error{background-color:var(--form-control-error-background-color);border-color:var(--form-control-error-border-color);color:var(--form-control-error-color)}.input-file-wrapper .input-file.input-file-error:focus{background-color:var(--form-control-error-background-color);border-color:var(--form-control-error-border-color);box-shadow:0 0 0 var(--spacing-2) var(--box-shadow)}.input-file-wrapper .input-file.input-file-success{background-color:var(--form-control-success-background-color);border-color:var(--form-control-success-border-color);color:var(--form-control-success-color)}.input-file-wrapper .input-file.input-file-success:focus{background-color:var(--form-control-success-background-color);border-color:var(--form-control-success-border-color);box-shadow:0 0 0 var(--spacing-2) var(--box-shadow)}.input-file-wrapper.input-file-highlighted .input-file{border-color:var(--form-control-focus-border-color)}.input-file-wrapper .input-file-error-message{font-size:var(--font-size-xs);color:var(--form-control-error-color)}.input-file-wrapper .input-file-success-message{font-size:var(--font-size-xs);color:var(--form-control-success-color)}

package/dist/components/InputFile/InputFile2.js

@@ -0,0 +1,41 @@
+import './InputFile.css';
+/* empty css          */
+import { forwardRef as N } from "react";
+import { jsx as e, jsxs as n } from "react/jsx-runtime";
+var v = N(({ accept: r, disabled: p, error: i, highlighted: t, id: a, label: s, onChange: f, onClick: m, onKeyDown: u, placeholder: c, required: h, success: l, value: o }, d) => /* @__PURE__ */ n("div", {
+  className: `input-file-wrapper${t ? " input-file-highlighted" : ""}`,
+  children: [
+    s && /* @__PURE__ */ n("label", {
+      htmlFor: a,
+      className: "input-file-label",
+      children: [s, h && /* @__PURE__ */ e("span", {
+        className: "input-file-required",
+        children: "*"
+      })]
+    }),
+    /* @__PURE__ */ e("input", {
+      accept: r,
+      disabled: p,
+      type: "file",
+      className: `input-file${i ? " input-file-error" : ""}${l ? " input-file-success" : ""}`,
+      id: a,
+      placeholder: c,
+      ref: d,
+      value: o,
+      onChange: (g) => f?.(g.target.files),
+      onClick: m,
+      onKeyDown: u
+    }),
+    i && /* @__PURE__ */ e("span", {
+      className: "input-file-error-message",
+      children: i
+    }),
+    l && /* @__PURE__ */ e("span", {
+      className: "input-file-success-message",
+      children: l
+    })
+  ]
+}));
+export {
+  v as InputFile
+};

package/dist/components/InputMask/InputMask.css

@@ -0,0 +1 @@
+.input-mask{gap:var(--spacing-8);flex-direction:column;width:100%;display:flex}.input-mask__label{color:var(--form-control-label-color,var(--form-control-color));font-size:var(--form-control-label-font-size,var(--font-size-sm));font-weight:var(--form-control-label-font-weight,var(--font-weight-medium));letter-spacing:var(--form-control-label-letter-spacing,normal);text-transform:var(--form-control-label-text-transform,none);line-height:var(--line-height-tight);cursor:pointer}.input-mask__field{align-items:center;display:flex;position:relative}.input-mask__input{background-color:var(--form-control-background-color);color:var(--form-control-color);border:var(--spacing-1) solid var(--form-control-border-color);border-radius:var(--radius-sm);padding:var(--spacing-12);font-family:var(--form-control-font-family);font-size:var(--font-size-sm);line-height:var(--line-height-normal);box-sizing:border-box;width:100%}.input-mask__input:focus{background-color:var(--form-control-focus-background-color);border-color:var(--form-control-focus-border-color);color:var(--form-control-focus-color);box-shadow:0 0 0 var(--spacing-2) var(--box-shadow);outline:none}.input-mask__input::placeholder{color:var(--form-control-placeholder-color)}.input-mask__input{transition:border-color var(--transition-fast), box-shadow var(--transition-fast), background var(--transition-fast)}.input-mask__input::placeholder{color:var(--form-control-placeholder-color);opacity:.5}.input-mask__input:focus{background:var(--form-control-focus-background-color);border-color:var(--form-control-focus-border-color);box-shadow:0 0 0 3px var(--form-control-focus-ring)}.input-mask__input--filled{border-color:var(--button-success-border-color)}.input-mask--mono .input-mask__input{font-family:var(--font-family-mono);letter-spacing:.08em}.input-mask--sm .input-mask__input{height:34px;font-size:var(--font-size-xs);padding:0 var(--spacing-8)}.input-mask--sm.input-mask--has-icon .input-mask__input{padding-left:calc(var(--spacing-8) + 14px + var(--spacing-8))}.input-mask--sm .input-mask__input{padding-right:calc(var(--spacing-8) + 40px)}.input-mask--sm.input-mask--has-suffix .input-mask__input{padding-right:calc(var(--spacing-8) + 40px + 32px)}.input-mask--sm .input-mask__icon{left:var(--spacing-8);width:14px;height:14px;font-size:14px}.input-mask--md .input-mask__input{height:40px;font-size:var(--font-size-sm);padding:0 var(--spacing-12)}.input-mask--md.input-mask--has-icon .input-mask__input{padding-left:calc(var(--spacing-12) + 16px + var(--spacing-8))}.input-mask--md .input-mask__input{padding-right:calc(var(--spacing-12) + 40px)}.input-mask--md.input-mask--has-suffix .input-mask__input{padding-right:calc(var(--spacing-12) + 40px + 32px)}.input-mask--md .input-mask__icon{left:var(--spacing-12);width:16px;height:16px;font-size:16px}.input-mask--lg .input-mask__input{height:48px;font-size:var(--font-size-md);padding:0 var(--spacing-16)}.input-mask--lg.input-mask--has-icon .input-mask__input{padding-left:calc(var(--spacing-16) + 18px + var(--spacing-8))}.input-mask--lg .input-mask__input{padding-right:calc(var(--spacing-16) + 40px)}.input-mask--lg.input-mask--has-suffix .input-mask__input{padding-right:calc(var(--spacing-16) + 40px + 32px)}.input-mask--lg .input-mask__icon{left:var(--spacing-16);width:18px;height:18px;font-size:18px}.input-mask--default .input-mask__input{border-color:var(--form-control-border-color)}.input-mask--default .input-mask__input:focus{border-color:var(--form-control-focus-border-color);box-shadow:0 0 0 3px var(--form-control-focus-ring)}.input-mask--default .input-mask__counter{color:var(--body-color-muted)}.input-mask--success .input-mask__input{border-color:var(--button-success-border-color)}.input-mask--success .input-mask__input:focus{border-color:var(--button-success-border-color);box-shadow:0 0 0 3px #34d3994d}.input-mask--success .input-mask__counter{color:var(--button-success-border-color)}.input-mask--danger .input-mask__input{border-color:var(--button-danger-border-color)}.input-mask--danger .input-mask__input:focus{border-color:var(--button-danger-border-color);box-shadow:0 0 0 3px #f871714d}.input-mask--danger .input-mask__counter{color:var(--button-danger-border-color)}.input-mask--highlighted .input-mask__input{border-color:var(--form-control-focus-border-color)}.input-mask__icon{color:var(--body-color-muted);pointer-events:none;transition:color var(--transition-fast);justify-content:center;align-items:center;display:flex;position:absolute}.input-mask__input:focus~.input-mask__icon,.input-mask__field:focus-within .input-mask__icon{color:var(--body-accent-color)}.input-mask__counter{right:var(--spacing-12);font-size:var(--font-size-xxs);font-weight:var(--font-weight-medium);color:var(--body-color-muted);pointer-events:none;white-space:nowrap;font-family:var(--font-family-mono);letter-spacing:.04em;transition:color var(--transition-fast);position:absolute}.input-mask--has-suffix .input-mask__counter{right:calc(var(--spacing-12) + 36px)}.input-mask__suffix{right:var(--spacing-8);align-items:center;gap:var(--spacing-4);display:flex;position:absolute}.input-mask__hint{font-size:var(--font-size-xs);color:var(--body-color-muted);line-height:var(--line-height-normal);margin:0}.input-mask__error{font-size:var(--font-size-xs);color:var(--form-control-error-color);line-height:var(--line-height-normal);margin:0}.input-mask--disabled{opacity:.45;pointer-events:none}.input-mask--disabled .input-mask__input{cursor:not-allowed}.input-mask--readonly .input-mask__input{background:var(--card-background-accent-color);cursor:default}.input-mask--readonly .input-mask__input:focus{box-shadow:none;border-color:var(--form-control-border-color)}

package/dist/components/InputMask/InputMask2.js

@@ -0,0 +1,163 @@
+import './InputMask.css';
+/* empty css          */
+import A, { forwardRef as U, useCallback as W, useId as X, useImperativeHandle as Y, useRef as O, useState as C } from "react";
+import { jsx as m, jsxs as M } from "react/jsx-runtime";
+var D = {
+  9: /\d/,
+  a: /[a-zA-Z]/,
+  "*": /[a-zA-Z0-9]/
+};
+function ee(e) {
+  return e in D;
+}
+function te(e) {
+  const n = [];
+  let t = 0;
+  for (; t < e.length; ) e[t] === "\\" && t + 1 < e.length ? (n.push({
+    type: "literal",
+    char: e[t + 1]
+  }), t += 2) : ee(e[t]) ? (n.push({
+    type: "token",
+    key: e[t]
+  }), t++) : (n.push({
+    type: "literal",
+    char: e[t]
+  }), t++);
+  return n;
+}
+function N(e, n, t) {
+  let u = 0, c = "", p = "";
+  for (const d of n) if (d.type === "literal") c += d.char;
+  else if (u < e.length) {
+    const r = e[u];
+    c += r, p += r, u++;
+  } else c += t;
+  return {
+    masked: c,
+    rawAccepted: p
+  };
+}
+function ne(e) {
+  return e.filter((n) => n.type === "token").length;
+}
+var se = U(({ mask: e, value: n, onChange: t, onComplete: u, placeholder: c, label: p, hint: d, error: r, highlighted: S, size: $ = "md", variant: b = "default", disabled: h = !1, readOnly: k = !1, maskChar: l = "_", mono: B = !0, icon: y, suffix: g, className: V = "", id: z, name: E, autoComplete: F }, P) => {
+  const i = A.useMemo(() => te(e), [e]), f = A.useMemo(() => ne(i), [i]), T = X(), x = z ?? T, [a, w] = C(() => n !== void 0 ? n : ""), I = O(null);
+  Y(P, () => ({
+    focus: () => I.current?.focus(),
+    clear: () => {
+      w(""), t?.("", "");
+    },
+    getRawValue: () => a
+  }));
+  const { masked: v } = N(a, i, l), Z = v.includes(l) ? v.replace(new RegExp(l.replace(/[.*+?^${}()|[\]\\]/g, "\\$&"), "g"), l) : v, H = r ? "danger" : b, L = [
+    "input-mask",
+    `input-mask--${$}`,
+    `input-mask--${H}`,
+    S ? "input-mask--highlighted" : "",
+    h ? "input-mask--disabled" : "",
+    k ? "input-mask--readonly" : "",
+    B ? "input-mask--mono" : "",
+    y ? "input-mask--has-icon" : "",
+    g ? "input-mask--has-suffix" : "",
+    V
+  ].filter(Boolean).join(" "), q = W((s) => {
+    if (h || k) return;
+    if (s.key === "Backspace") {
+      s.preventDefault();
+      const o = a.slice(0, -1), { masked: Q } = N(o, i, l);
+      w(o), t?.(o, Q);
+      return;
+    }
+    if (s.key.length !== 1 || s.ctrlKey || s.metaKey || (s.preventDefault(), a.length >= f)) return;
+    const R = s.key;
+    let K = 0;
+    for (const o of i) if (o.type === "token") {
+      if (K === a.length) {
+        if (!D[o.key].test(R)) return;
+        break;
+      }
+      K++;
+    }
+    const { masked: j, rawAccepted: _ } = N(a + R, i, l);
+    w(_), t?.(_, j), _.length === f && u?.(_, j);
+  }, [
+    h,
+    k,
+    a,
+    i,
+    l,
+    f,
+    t,
+    u
+  ]), G = c ?? i.map((s) => s.type === "literal" ? s.char : l).join(""), J = a.length === f;
+  return /* @__PURE__ */ M("div", {
+    className: L,
+    children: [
+      p && /* @__PURE__ */ m("label", {
+        className: "input-mask__label",
+        htmlFor: x,
+        children: p
+      }),
+      /* @__PURE__ */ M("div", {
+        className: "input-mask__field",
+        children: [
+          y && /* @__PURE__ */ m("span", {
+            className: "input-mask__icon",
+            children: y
+          }),
+          /* @__PURE__ */ m("input", {
+            ref: I,
+            id: x,
+            name: E,
+            type: "text",
+            inputMode: "text",
+            autoComplete: F,
+            className: ["input-mask__input", J ? "input-mask__input--filled" : ""].filter(Boolean).join(" "),
+            value: Z,
+            placeholder: G,
+            disabled: h,
+            readOnly: k,
+            maxLength: e.length,
+            onChange: () => {
+            },
+            onKeyDown: q
+          }),
+          /* @__PURE__ */ M("span", {
+            className: "input-mask__counter",
+            children: [
+              a.length,
+              "/",
+              f
+            ]
+          }),
+          g && /* @__PURE__ */ m("span", {
+            className: "input-mask__suffix",
+            children: g
+          })
+        ]
+      }),
+      (d || r) && /* @__PURE__ */ m("p", {
+        className: r ? "input-mask__error" : "input-mask__hint",
+        children: r ?? d
+      })
+    ]
+  });
+});
+se.displayName = "InputMask";
+var re = {
+  creditCard: "9999 9999 9999 9999",
+  iban: "aa99 9999 9999 9999 9999 99",
+  cvv: "999",
+  expiry: "99/99",
+  phone: "+99 (999) 999-9999",
+  ssn: "999-99-9999",
+  ipv4: "999.999.999.999",
+  serialNumber: "***-***-***-***",
+  date: "99/99/9999",
+  time: "99:99",
+  uuid: "********-****-****-****-************"
+};
+export {
+  se as InputMask,
+  re as InputMaskPresets
+};

package/dist/components/InputNumber/InputNumber.css

@@ -0,0 +1 @@
+.input-number-wrapper{gap:var(--spacing-8);flex-direction:column;display:flex}.input-number-wrapper .input-number-label{color:var(--form-control-label-color,var(--form-control-color));font-size:var(--form-control-label-font-size,var(--font-size-sm));font-weight:var(--form-control-label-font-weight,var(--font-weight-medium));letter-spacing:var(--form-control-label-letter-spacing,normal);text-transform:var(--form-control-label-text-transform,none)}.input-number-wrapper .input-number-label .input-number-required{color:var(--body-danger-color,#dc2626);margin-left:var(--spacing-2)}.input-number-wrapper .input-number{background-color:var(--form-control-background-color);color:var(--form-control-color);border:var(--spacing-1) solid var(--form-control-border-color);border-radius:var(--radius-sm);padding:var(--spacing-12);font-family:var(--form-control-font-family);font-size:var(--font-size-sm);line-height:var(--line-height-normal);box-sizing:border-box;width:100%}.input-number-wrapper .input-number:focus{background-color:var(--form-control-focus-background-color);border-color:var(--form-control-focus-border-color);color:var(--form-control-focus-color);box-shadow:0 0 0 var(--spacing-2) var(--box-shadow);outline:none}.input-number-wrapper .input-number::placeholder{color:var(--form-control-placeholder-color)}.input-number-wrapper .input-number.input-number-hide-native-controls{appearance:textfield}.input-number-wrapper .input-number.input-number-hide-native-controls::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}.input-number-wrapper .input-number.input-number-hide-native-controls::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}.input-number-wrapper .input-number.input-number-error{background-color:var(--form-control-error-background-color);border-color:var(--form-control-error-border-color);color:var(--form-control-error-color)}.input-number-wrapper .input-number.input-number-error:focus{background-color:var(--form-control-error-background-color);border-color:var(--form-control-error-border-color);box-shadow:0 0 0 var(--spacing-2) var(--box-shadow)}.input-number-wrapper .input-number.input-number-success{background-color:var(--form-control-success-background-color);border-color:var(--form-control-success-border-color);color:var(--form-control-success-color)}.input-number-wrapper .input-number.input-number-success:focus{background-color:var(--form-control-success-background-color);border-color:var(--form-control-success-border-color);box-shadow:0 0 0 var(--spacing-2) var(--box-shadow)}.input-number-wrapper.input-number-highlighted .input-number{border-color:var(--form-control-focus-border-color)}.input-number-wrapper .input-number-error-message{font-size:var(--font-size-xs);color:var(--form-control-error-color)}.input-number-wrapper .input-number-success-message{font-size:var(--font-size-xs);color:var(--form-control-success-color)}

package/dist/components/InputNumber/InputNumber2.js

@@ -0,0 +1,60 @@
+import './InputNumber.css';
+/* empty css            */
+import { forwardRef as V } from "react";
+import { jsx as i, jsxs as o } from "react/jsx-runtime";
+var E = V(({ autoComplete: c = "on", autoFocus: d, disabled: b, error: a, hideNativeControls: h, highlighted: f, id: p, label: s, onChange: m, onClick: v, onKeyDown: N, required: g, success: l, value: n, min: u, max: t, placeholder: y, step: $ }, w) => {
+  const B = (e) => {
+    if (e === void 0) return;
+    let r = e;
+    return u !== void 0 && r < u && (r = u), t !== void 0 && r > t && (r = t), r;
+  };
+  return /* @__PURE__ */ o("div", {
+    className: `input-number-wrapper${f ? " input-number-highlighted" : ""}`,
+    children: [
+      s && /* @__PURE__ */ o("label", {
+        htmlFor: p,
+        className: "input-number-label",
+        children: [s, g && /* @__PURE__ */ i("span", {
+          className: "input-number-required",
+          children: "*"
+        })]
+      }),
+      /* @__PURE__ */ i("input", {
+        autoComplete: c,
+        autoFocus: d,
+        disabled: b,
+        className: `input-number${a ? " input-number-error" : ""}${l ? " input-number-success" : ""}${h ? " input-number-hide-native-controls" : ""}`,
+        id: p,
+        max: t,
+        min: u,
+        onBlur: () => {
+          if (n !== void 0) {
+            const e = B(n);
+            e !== n && m?.(e);
+          }
+        },
+        onChange: (e) => m?.(e.target.value ? Number(e.target.value) : void 0),
+        onClick: v,
+        onKeyDown: (e) => {
+          (e.key === "e" || e.key === "E") && e.preventDefault(), N?.(e);
+        },
+        placeholder: y,
+        ref: w,
+        step: $,
+        type: "number",
+        value: n ?? ""
+      }),
+      a && /* @__PURE__ */ i("span", {
+        className: "input-number-error-message",
+        children: a
+      }),
+      l && /* @__PURE__ */ i("span", {
+        className: "input-number-success-message",
+        children: l
+      })
+    ]
+  });
+});
+export {
+  E as InputNumber
+};

package/dist/components/InputPIN/InputPIN.css

@@ -0,0 +1 @@
+.input-pin-wrapper{gap:var(--spacing-8);flex-direction:column;display:flex}.input-pin-wrapper .input-pin-label{color:var(--form-control-label-color,var(--form-control-color));font-size:var(--form-control-label-font-size,var(--font-size-sm));font-weight:var(--form-control-label-font-weight,var(--font-weight-medium));letter-spacing:var(--form-control-label-letter-spacing,normal);text-transform:var(--form-control-label-text-transform,none)}.input-pin-wrapper .input-pin-cells{align-items:center;gap:var(--spacing-8);display:flex}.input-pin-wrapper .input-pin-cell{background-color:var(--form-control-background-color);color:var(--form-control-color);border:var(--spacing-1) solid var(--form-control-border-color);border-radius:var(--radius-sm);padding:var(--spacing-12);font-family:var(--form-control-font-family);font-size:var(--font-size-sm);line-height:var(--line-height-normal);box-sizing:border-box;width:100%}.input-pin-wrapper .input-pin-cell:focus{background-color:var(--form-control-focus-background-color);border-color:var(--form-control-focus-border-color);color:var(--form-control-focus-color);box-shadow:0 0 0 var(--spacing-2) var(--box-shadow);outline:none}.input-pin-wrapper .input-pin-cell::placeholder{color:var(--form-control-placeholder-color)}.input-pin-wrapper .input-pin-cell{width:var(--spacing-48);padding:var(--spacing-12) 0;text-align:center;font-size:var(--font-size-lg);font-weight:var(--font-weight-semibold);font-variant-numeric:tabular-nums;letter-spacing:normal;flex:none}.input-pin-wrapper .input-pin-cell--filled{border-color:var(--form-control-focus-border-color)}.input-pin-wrapper .input-pin-cell--group-start{margin-left:var(--spacing-12)}.input-pin-wrapper .input-pin-cell:disabled{opacity:.6;cursor:not-allowed}.input-pin-wrapper--error .input-pin-cell{background-color:var(--form-control-error-background-color);border-color:var(--form-control-error-border-color);color:var(--form-control-error-color)}.input-pin-wrapper--error .input-pin-cell:focus{background-color:var(--form-control-error-background-color);border-color:var(--form-control-error-border-color);box-shadow:0 0 0 var(--spacing-2) var(--box-shadow)}.input-pin-wrapper--success .input-pin-cell{background-color:var(--form-control-success-background-color);border-color:var(--form-control-success-border-color);color:var(--form-control-success-color)}.input-pin-wrapper--success .input-pin-cell:focus{background-color:var(--form-control-success-background-color);border-color:var(--form-control-success-border-color);box-shadow:0 0 0 var(--spacing-2) var(--box-shadow)}.input-pin-wrapper .input-pin-error-message{font-size:var(--font-size-xs);color:var(--form-control-error-color)}.input-pin-wrapper .input-pin-success-message{font-size:var(--font-size-xs);color:var(--form-control-success-color)}@media (width<=768px){.input-pin-wrapper .input-pin-cell{width:var(--spacing-40);font-size:var(--font-size-md)}}

package/dist/components/InputPIN/InputPIN2.js

@@ -0,0 +1,121 @@
+import './InputPIN.css';
+/* empty css         */
+import { useCallback as o, useEffect as P, useRef as j } from "react";
+import { jsx as f, jsxs as B } from "react/jsx-runtime";
+var K = /[^0-9]/g, U = /[^0-9a-zA-Z]/g, W = ({ autoFocus: y = !1, disabled: M = !1, error: N, id: m, label: C, length: s = 6, groupSize: E, onChange: g, onComplete: k, secret: $ = !1, success: D, type: A = "numeric", value: I }) => {
+  const R = j([]), v = j(!1), n = o((r) => r.replace(A === "numeric" ? K : U, "").slice(0, s), [s, A]), p = n(I), c = p.split("");
+  P(() => {
+    p.length === s && !v.current && (v.current = !0, k?.(p)), p.length < s && (v.current = !1);
+  }, [
+    p,
+    s,
+    k
+  ]), P(() => {
+    y && R.current[0]?.focus();
+  }, [y]);
+  const a = o((r) => {
+    const t = R.current[Math.min(Math.max(r, 0), s - 1)];
+    t?.focus(), t?.select();
+  }, [s]), l = o((r) => {
+    const t = r.join("").replace(/\s/g, "");
+    g(n(t));
+  }, [g, n]), T = o((r, t) => {
+    const e = c[r] ?? "", h = e && t.startsWith(e) ? t.slice(e.length) : t, i = n(h);
+    if (!i) return;
+    const u = [...c];
+    i.split("").forEach((_, w) => {
+      r + w < s && (u[r + w] = _);
+    }), l(u), a(r + i.length);
+  }, [
+    c,
+    l,
+    a,
+    s,
+    n
+  ]), b = o((r, t) => {
+    if (r.key === "Backspace") {
+      r.preventDefault();
+      const e = [...c];
+      if (e[t]) {
+        e.splice(t, 1), l(e);
+        return;
+      }
+      t > 0 && (e.splice(t - 1, 1), l(e), a(t - 1));
+      return;
+    }
+    if (r.key === "Delete") {
+      r.preventDefault();
+      const e = [...c];
+      e.splice(t, 1), l(e);
+      return;
+    }
+    if (r.key === "ArrowLeft") {
+      r.preventDefault(), a(t - 1);
+      return;
+    }
+    r.key === "ArrowRight" && (r.preventDefault(), a(t + 1));
+  }, [
+    c,
+    l,
+    a
+  ]), L = o((r, t) => {
+    r.preventDefault();
+    const e = n(r.clipboardData.getData("text"));
+    if (!e) return;
+    const h = [...c];
+    e.split("").forEach((i, u) => {
+      t + u < s && (h[t + u] = i);
+    }), l(h), a(t + e.length);
+  }, [
+    c,
+    l,
+    a,
+    s,
+    n
+  ]);
+  return /* @__PURE__ */ B("div", {
+    className: [
+      "input-pin-wrapper",
+      N ? "input-pin-wrapper--error" : "",
+      D ? "input-pin-wrapper--success" : ""
+    ].filter(Boolean).join(" "),
+    children: [
+      C && /* @__PURE__ */ f("label", {
+        className: "input-pin-label",
+        htmlFor: m ? `${m}-0` : void 0,
+        children: C
+      }),
+      /* @__PURE__ */ f("div", {
+        className: "input-pin-cells",
+        children: Array.from({ length: s }, (r, t) => /* @__PURE__ */ f("input", {
+          autoComplete: t === 0 ? "one-time-code" : "off",
+          className: `input-pin-cell${c[t] ? " input-pin-cell--filled" : ""}${E && t > 0 && t % E === 0 ? " input-pin-cell--group-start" : ""}`,
+          disabled: M,
+          id: m ? `${m}-${t}` : void 0,
+          inputMode: A === "numeric" ? "numeric" : "text",
+          maxLength: s,
+          onChange: (e) => T(t, e.target.value),
+          onFocus: (e) => e.target.select(),
+          onKeyDown: (e) => b(e, t),
+          onPaste: (e) => L(e, t),
+          type: $ ? "password" : "text",
+          ref: (e) => {
+            R.current[t] = e;
+          },
+          value: c[t] ?? ""
+        }, t))
+      }),
+      N && /* @__PURE__ */ f("span", {
+        className: "input-pin-error-message",
+        children: N
+      }),
+      D && /* @__PURE__ */ f("span", {
+        className: "input-pin-success-message",
+        children: D
+      })
+    ]
+  });
+};
+export {
+  W as InputPIN
+};

package/dist/components/InputPassword/InputPassword.css

@@ -0,0 +1 @@
+.input-password-wrapper{gap:var(--spacing-8);flex-direction:column;display:flex}.input-password-wrapper .input-password-label{color:var(--form-control-label-color,var(--form-control-color));font-size:var(--form-control-label-font-size,var(--font-size-sm));font-weight:var(--form-control-label-font-weight,var(--font-weight-medium));letter-spacing:var(--form-control-label-letter-spacing,normal);text-transform:var(--form-control-label-text-transform,none)}.input-password-wrapper .input-password-label .input-password-required{color:var(--body-danger-color,#dc2626);margin-left:var(--spacing-2)}.input-password-wrapper .input-password{background-color:var(--form-control-background-color);color:var(--form-control-color);border:var(--spacing-1) solid var(--form-control-border-color);border-radius:var(--radius-sm);padding:var(--spacing-12);font-family:var(--form-control-font-family);font-size:var(--font-size-sm);line-height:var(--line-height-normal);box-sizing:border-box;width:100%}.input-password-wrapper .input-password:focus{background-color:var(--form-control-focus-background-color);border-color:var(--form-control-focus-border-color);color:var(--form-control-focus-color);box-shadow:0 0 0 var(--spacing-2) var(--box-shadow);outline:none}.input-password-wrapper .input-password::placeholder{color:var(--form-control-placeholder-color)}.input-password-wrapper .input-password.input-password-error{background-color:var(--form-control-error-background-color);border-color:var(--form-control-error-border-color);color:var(--form-control-error-color)}.input-password-wrapper .input-password.input-password-error:focus{background-color:var(--form-control-error-background-color);border-color:var(--form-control-error-border-color);box-shadow:0 0 0 var(--spacing-2) var(--box-shadow)}.input-password-wrapper .input-password.input-password-success{background-color:var(--form-control-success-background-color);border-color:var(--form-control-success-border-color);color:var(--form-control-success-color)}.input-password-wrapper .input-password.input-password-success:focus{background-color:var(--form-control-success-background-color);border-color:var(--form-control-success-border-color);box-shadow:0 0 0 var(--spacing-2) var(--box-shadow)}.input-password-wrapper.input-password-highlighted .input-password{border-color:var(--form-control-focus-border-color)}.input-password-wrapper .input-password-error-message{font-size:var(--font-size-xs);color:var(--form-control-error-color)}.input-password-wrapper .input-password-success-message{font-size:var(--font-size-xs);color:var(--form-control-success-color)}

package/dist/components/InputPassword/InputPassword2.js

@@ -0,0 +1,47 @@
+import './InputPassword.css';
+/* empty css              */
+import { forwardRef as j } from "react";
+import { jsx as s, jsxs as o } from "react/jsx-runtime";
+var F = j(({ autoComplete: t = "on", autoFocus: i, disabled: d, error: a, highlighted: l, id: r, label: e, maxLength: m, onBlur: u, onChange: w, onClick: c, onKeyDown: h, onKeyUp: f, placeholder: g, readOnly: N = !1, required: n = !1, success: p, value: v }, x) => /* @__PURE__ */ o("div", {
+  className: `input-password-wrapper${l ? " input-password-highlighted" : ""}`,
+  children: [
+    e && /* @__PURE__ */ o("label", {
+      htmlFor: r,
+      className: "input-password-label",
+      children: [e, n && /* @__PURE__ */ s("span", {
+        className: "input-password-required",
+        children: "*"
+      })]
+    }),
+    /* @__PURE__ */ s("input", {
+      autoComplete: t,
+      autoFocus: i,
+      disabled: d,
+      type: "password",
+      className: `input-password${a ? " input-password-error" : ""}${p ? " input-password-success" : ""}`,
+      id: r,
+      maxLength: m,
+      placeholder: g,
+      ref: x,
+      value: v,
+      onBlur: u,
+      onChange: ($) => w?.($.target.value),
+      onClick: c,
+      onKeyDown: h,
+      onKeyUp: f,
+      readOnly: N,
+      required: n
+    }),
+    a && /* @__PURE__ */ s("span", {
+      className: "input-password-error-message",
+      children: a
+    }),
+    p && /* @__PURE__ */ s("span", {
+      className: "input-password-success-message",
+      children: p
+    })
+  ]
+}));
+export {
+  F as InputPassword
+};

package/dist/components/InputPhone/InputPhone.css

@@ -0,0 +1 @@
+.input-phone-wrapper{gap:var(--spacing-8);flex-direction:column;display:flex}.input-phone-label{align-items:center;gap:var(--spacing-4);color:var(--form-control-label-color,var(--form-control-color));font-size:var(--form-control-label-font-size,var(--font-size-sm));font-weight:var(--form-control-label-font-weight,var(--font-weight-medium));letter-spacing:var(--form-control-label-letter-spacing,normal);text-transform:var(--form-control-label-text-transform,none);line-height:var(--line-height-normal);display:inline-flex}.input-phone-required{color:var(--body-danger-color,#dc2626);margin-left:var(--spacing-2)}.input-phone-field{background-color:var(--form-control-background-color);border:1px solid var(--form-control-border-color);border-radius:var(--radius-sm);padding:0 var(--spacing-12);transition:border-color var(--transition-fast), background-color var(--transition-fast), box-shadow var(--transition-fast);align-items:center;display:flex}.input-phone-field:focus-within{background-color:var(--form-control-focus-background-color);border-color:var(--form-control-focus-border-color);box-shadow:0 0 0 3px var(--form-control-focus-ring);outline:none}.input-phone-field--error{background-color:var(--form-control-error-background-color);border-color:var(--form-control-error-border-color)}.input-phone-field--error .input-phone{color:var(--form-control-error-color)}.input-phone-field--error:focus-within{background-color:var(--form-control-error-background-color);box-shadow:0 0 0 3px #db524b40}.input-phone-field--success{background-color:var(--form-control-success-background-color);border-color:var(--form-control-success-border-color)}.input-phone-field--success .input-phone{color:var(--form-control-success-color)}.input-phone-field--success:focus-within{background-color:var(--form-control-success-background-color);box-shadow:0 0 0 3px #22c55e40}.input-phone-field--highlighted{border-color:var(--form-control-focus-border-color)}.input-phone-field--disabled{opacity:.5;cursor:not-allowed;pointer-events:none}.input-phone-icon{color:var(--form-control-placeholder-color);margin-right:var(--spacing-8);pointer-events:none;flex-shrink:0;align-items:center;display:flex}.input-phone{color:var(--form-control-color);font-size:var(--font-size-sm);font-family:inherit;line-height:var(--line-height-normal);padding:var(--spacing-8) 0;background:0 0;border:none;outline:none;flex:1;width:100%}.input-phone::placeholder{color:var(--form-control-placeholder-color)}.input-phone:disabled{cursor:not-allowed}.input-phone::-webkit-outer-spin-button{-webkit-appearance:none}.input-phone::-webkit-inner-spin-button{-webkit-appearance:none}.input-phone-error-message{font-size:var(--font-size-xs);color:var(--form-control-error-color);line-height:var(--line-height-normal)}.input-phone-success-message{font-size:var(--font-size-xs);color:var(--form-control-success-color);line-height:var(--line-height-normal)}