@code0-tech/pictor 0.16.0 → 0.17.0

package/dist/components/form/EmailInput.js

@@ -1,21 +1,22 @@
-import { jsx as o } from "react/jsx-runtime";
-import e from "react";
+import { jsx as t } from "react/jsx-runtime";
+import a from "react";
 import { Input as l } from "./Input.js";
 import { IconX as m } from "@tabler/icons-react";
-import { Button as f } from "../button/Button.js";
-import { clearInputElement as s } from "./Input.utils.js";
-const p = /(?:[a-z0-9!#$%&'*+/=?^_`{|}~-]+(?:\.[a-z0-9!#$%&'*+/=?^_`{|}~-]+)*|"(?:[\x01-\x08\x0b\x0c\x0e-\x1f\x21\x23-\x5b\x5d-\x7f]|\\[\x01-\x09\x0b\x0c\x0e-\x7f])*")@(?:(?:[a-z0-9](?:[a-z0-9-]*[a-z0-9])?\.)+[a-z0-9](?:[a-z0-9-]*[a-z0-9])?|\[(?:(?:25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?)\.){3}(?:25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?|[a-z0-9-]*[a-z0-9]:(?:[\x01-\x08\x0b\x0c\x0e-\x1f\x21-\x5a\x53-\x7f]|\\[\x01-\x09\x0b\x0c\x0e-\x7f])+)\])/, I = (t) => p.test(t), _ = e.forwardRef((t, x) => {
-  x = x || e.useRef(null);
+import { Button as p } from "../button/Button.js";
+import { clearInputElement as f } from "./Input.utils.js";
+import { ButtonGroup as s } from "../button-group/ButtonGroup.js";
+const u = /(?:[a-z0-9!#$%&'*+/=?^_`{|}~-]+(?:\.[a-z0-9!#$%&'*+/=?^_`{|}~-]+)*|"(?:[\x01-\x08\x0b\x0c\x0e-\x1f\x21\x23-\x5b\x5d-\x7f]|\\[\x01-\x09\x0b\x0c\x0e-\x7f])*")@(?:(?:[a-z0-9](?:[a-z0-9-]*[a-z0-9])?\.)+[a-z0-9](?:[a-z0-9-]*[a-z0-9])?|\[(?:(?:25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?)\.){3}(?:25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?|[a-z0-9-]*[a-z0-9]:(?:[\x01-\x08\x0b\x0c\x0e-\x1f\x21-\x5a\x53-\x7f]|\\[\x01-\x09\x0b\x0c\x0e-\x7f])+)\])/, g = (o) => u.test(o), R = a.forwardRef((o, x) => {
+  x = x || a.useRef(null);
   const {
-    clearable: r = !1,
-    right: n,
-    ...c
-  } = t, i = () => {
-    s(x.current);
-  }, a = [n];
-  return r && a.push(/* @__PURE__ */ o(f, { onClick: i, children: /* @__PURE__ */ o(m, { size: 13 }) })), /* @__PURE__ */ o(l, { right: a, type: "email", ref: x, ...c });
+    clearable: e = !1,
+    right: i,
+    ...n
+  } = o, c = () => {
+    f(x.current);
+  }, r = [i];
+  return e && r.push(/* @__PURE__ */ t(p, { color: "secondary", paddingSize: "xxs", onClick: c, children: /* @__PURE__ */ t(m, { size: 13 }) })), /* @__PURE__ */ t(l, { right: /* @__PURE__ */ t(s, { color: "primary", children: r }), type: "email", ref: x, ...n });
 });
 export {
-  _ as EmailInput,
-  I as emailValidation
+  R as EmailInput,
+  g as emailValidation
 };

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

@@ -1,21 +1,8 @@
 import { default as React } from 'react';
 import { Component } from '../../utils';
 import { ValidationProps } from './useForm';
-import { InputSuggestion } from './InputSuggestion';
-import { InputSyntaxSegment } from './Input.syntax.hook';
 export type Code0Input = Omit<Component<HTMLInputElement>, "left" | "right" | "title" | "defaultValue" | "value">;
 export interface InputProps<T> extends Code0Input, ValidationProps<T> {
-    suggestions?: InputSuggestion[];
-    suggestionsHeader?: React.ReactNode;
-    suggestionsFooter?: React.ReactNode;
-    onSuggestionSelect?: (suggestion: InputSuggestion) => void;
-    transformSyntax?: (value: T, appliedSyntaxParts?: (InputSuggestion | any)[]) => InputSyntaxSegment[];
-    validationUsesSyntax?: boolean;
-    disableOnValue?: (value: T) => boolean;
-    filterSuggestionsByLastToken?: boolean;
-    onLastTokenChange?: (token: string | null) => void;
-    enforceUniqueSuggestions?: boolean;
-    suggestionsEmptyState?: React.ReactNode;
     wrapperComponent?: Component<HTMLDivElement>;
     right?: React.ReactNode;
     left?: React.ReactNode;
@@ -25,11 +12,4 @@ export interface InputProps<T> extends Code0Input, ValidationProps<T> {
     description?: React.ReactNode;
 }
 export type InputElement = HTMLInputElement | HTMLDivElement;
-export type InputActiveSuggestionSpan = {
-    id: number;
-    suggestion: InputSuggestion;
-    text: string;
-    start: number;
-    end: number;
-};
 export declare const Input: React.FC<InputProps<any>>;

package/dist/components/form/Input.js

@@ -1,443 +1,58 @@
-import { jsxs as q, jsx as g } from "react/jsx-runtime";
-import i, { useRef as b, useState as W, useMemo as D, useEffect as P, useLayoutEffect as ot } from "react";
+import { jsx as c } from "react/jsx-runtime";
+import a, { useRef as C } from "react";
 import "../../utils/contextStore.js";
-import { mergeComponentProps as ue } from "../../utils/component.js";
+import { mergeComponentProps as _ } from "../../utils/component.js";
 import "js-md5";
 import '../../assets/components/form/Input.style.css';/* empty css                 */
-import { InputLabel as at } from "./InputLabel.js";
-import { InputDescription as st } from "./InputDescription.js";
-import { InputMessage as ut } from "./InputMessage.js";
-import { Menu as it, MenuTrigger as lt, MenuPortal as ct } from "../menu/Menu.js";
-import { InputSuggestionMenuContent as ft, InputSuggestionMenuContentItems as dt } from "./InputSuggestion.js";
-import { buildDefaultSyntax as pt } from "./Input.syntax.hook.js";
-import { getSelectionMetrics as gt, setElementKey as ht, setSelectionRangeSafe as mt } from "./Input.utils.js";
-import { Card as yt } from "../card/Card.js";
-import { useContentEditableController as St, setSelectionOffsetsInValue as Ct } from "./InputContentEditable.hook.js";
-const U = (u) => {
-  const x = u ?? "";
-  return typeof x == "string" ? x : String(x);
-}, ie = (u) => {
-  if (u == null) return "";
-  if (typeof u == "string") return u;
-  try {
-    return JSON.stringify(u);
-  } catch {
-    return String(u ?? "");
-  }
-}, bt = (u) => {
-  if (u && typeof u == "object") {
-    const {
-      children: x,
-      __contentHtml: G,
-      ...T
-    } = u;
-    return T;
-  }
-  return {
-    value: u
-  };
-}, We = (u) => {
-  if (!u) return null;
-  const x = u.value ?? "", G = u.selectionStart ?? x.length, L = x.slice(0, G).match(/\S+$/);
-  if (!L || L.index === void 0) return null;
-  const C = L[0], H = L.index, X = H + C.length;
-  return {
-    token: C,
-    start: H,
-    end: X
-  };
-}, kt = i.forwardRef((u, x) => {
+import { InputWrapper as v } from "./InputWrapper.js";
+const F = (i) => {
+  const o = i ?? "";
+  return typeof o == "string" ? o : String(o);
+}, H = a.forwardRef((i, o) => {
   const {
-    wrapperComponent: G = {},
-    title: T,
-    description: L,
-    disabled: C = !1,
-    left: H,
-    right: X,
-    leftType: Ue = "icon",
-    rightType: He = "action",
-    formValidation: M = {
+    wrapperComponent: b = {},
+    title: p,
+    description: I,
+    disabled: u = !1,
+    left: k,
+    right: x,
+    leftType: R = "icon",
+    rightType: P = "action",
+    formValidation: r = {
       valid: !0,
-      notValidMessage: null,
-      setValue: null
+      notValidMessage: null
     },
-    suggestions: d,
-    suggestionsHeader: xe,
-    suggestionsFooter: we,
-    onSuggestionSelect: Ve,
-    disableOnValue: Ee = () => !1,
-    transformSyntax: Y,
-    validationUsesSyntax: le = !1,
-    filterSuggestionsByLastToken: k = !1,
-    enforceUniqueSuggestions: De = !1,
-    onLastTokenChange: Ie,
-    suggestionsEmptyState: Pe,
-    ...Je
-  } = u, {
-    onFocus: Te,
-    onBlur: Z,
-    onKeyDown: _,
-    onKeyDownCapture: ce,
-    onChange: F,
-    onInput: R,
-    ...c
-  } = Je, Qe = i.useId(), fe = c.id ?? Qe, Le = `${fe}-label`, Me = T ? void 0 : c["aria-label"] ?? c.placeholder, de = {
-    id: fe,
-    ...T ? {
-      "aria-labelledby": Le
-    } : {},
-    ...Me ? {
-      "aria-label": Me
+    initialValue: L,
+    ...T
+  } = i, {
+    onChange: d,
+    onInput: f,
+    ...t
+  } = T, w = a.useId(), O = t.id ?? w, m = p ? void 0 : t["aria-label"] ?? t.placeholder, h = {
+    id: O,
+    ...m ? {
+      "aria-label": m
     } : {}
-  }, ee = b(null), m = b(null), O = b(null), K = b(null), pe = b(null), w = b(!1), ge = b(!1), Ge = b(0), Fe = b(null), he = c.value ?? u.initialValue ?? u.defaultValue, [Re, Xe] = W(!1), B = b(!1), l = i.useCallback((e) => {
-    B.current = e, Xe(e);
-  }, []), [y, me] = W(he), [$e, Oe] = W([]), [A, ye] = W([]), [Ke, Ye] = W(null), [N, Ze] = W(null), a = !!Y, I = D(() => Ee(y), [Ee, y]), v = D(() => a ? O : m, [a]);
-  i.useImperativeHandle(x, () => v.current ?? null);
-  const Be = D(() => ({
-    ...c
-  }), [c]), _e = D(() => {
-    const {
-      value: e,
-      defaultValue: t,
-      ...n
-    } = c;
-    return ue("input__control", n);
-  }, [c]), te = i.useCallback(() => {
-    const e = v.current;
-    !e || C || I || e.focus({
-      preventScroll: !0
-    });
-  }, [v, C, I]), z = i.useCallback(() => {
-    d && l(!0);
-  }, [d, l]), Se = i.useCallback((e) => {
-    k && (Ye(e), e && l(!0), Ie?.(e));
-  }, [k, Ie, l]), J = i.useCallback((e, t) => {
-    if (!M?.setValue) return;
-    const n = c.type !== "checkbox" ? U(e) : e, o = le ? t : n;
-    Object.is(Fe.current, o) || (Fe.current = o, M.setValue(o));
-  }, [M?.setValue, c.type, le]), ne = i.useCallback((e) => {
-    const t = e.currentTarget, n = c.type === "checkbox" && "checked" in t ? t.checked : t.value;
-    me(n), J(n, null);
-  }, [c.type, J]), h = St({
-    editorRef: O,
-    transformSyntax: Y,
-    filterSuggestionsByLastToken: k,
-    onLastTokenChange: Se,
-    onStateChange: ({
-      value: e,
-      tokens: t,
-      segments: n
-    }) => {
-      me(e), ye(t), Ze(n ?? null), J(e, n ?? null);
-    }
-  }), Ae = b(!1);
-  P(() => {
-    if (!a || !Y || Ae.current) return;
-    const e = U(he);
-    h.initializeFromExternalValue(e), Ae.current = !0;
-  }, [a, Y, he, le, h]), P(() => {
-    a || c.value !== void 0 && me(c.value);
-  }, [c.value, a]), P(() => {
-    J(y, N);
-  }, [J, N, y]), P(() => {
-    if (!d) return;
-    const e = (t) => {
-      const n = t.target, o = !!O.current?.contains(n), s = !!m.current?.contains(n), r = !!pe.current?.contains(n), S = !!ee.current?.contains(n), f = o || s || r || S;
-      w.current = f, !f && B.current && l(!1);
-    };
-    return document.addEventListener("pointerdown", e, !0), () => document.removeEventListener("pointerdown", e, !0);
-  }, [d, l]), P(() => {
-    const e = ee.current;
-    if (!e) return;
-    const t = () => z();
-    return e.addEventListener("focusin", t), () => e.removeEventListener("focusin", t);
-  }, [z]);
-  const Ne = i.useCallback((e, t, n) => {
-    if (e.length === 0) return t <= n.length ? t : null;
-    let o = n.indexOf(e);
-    if (o === -1) return null;
-    let s = o;
-    for (; s !== -1; )
-      Math.abs(s - t) < Math.abs(o - t) && (o = s), s = n.indexOf(e, s + 1);
-    return o;
-  }, []), re = i.useCallback((e, t) => {
-    const n = [];
-    return e.forEach((o) => {
-      const s = Ne(o.text, o.start, t);
-      if (s === null) return;
-      const r = s + o.text.length;
-      t.slice(s, r) === o.text && n.push({
-        ...o,
-        start: s,
-        end: r
-      });
-    }), n;
-  }, [Ne]);
-  P(() => {
-    if (a) return;
-    const e = U(m.current?.value ?? y);
-    Oe((t) => {
-      const n = re(t, e);
-      return ye(n.map((o) => o.suggestion)), n;
-    });
-  }, [a, re, y]), P(() => {
-    if (!k || a) return;
-    const e = m.current;
-    if (!e) return;
-    const t = () => Se(We(e)?.token ?? null);
-    return e.addEventListener("input", t), e.addEventListener("keyup", t), e.addEventListener("mouseup", t), t(), () => {
-      e.removeEventListener("input", t), e.removeEventListener("keyup", t), e.removeEventListener("mouseup", t);
-    };
-  }, [k, a, Se]);
-  const j = D(() => {
-    if (!k || !d) return d;
-    const e = Ke?.trim();
-    return e?.length ? d.filter((t) => String(t?.value ?? "").toLowerCase().startsWith(e.toLowerCase())) : d;
-  }, [k, Ke, d]), oe = D(() => {
-    if (!De || !j) return j;
-    if (a) {
-      const t = new Set((A ?? []).map((n) => ie(n?.value ?? n)));
-      return j.filter((n) => !t.has(ie(n?.value ?? n)));
-    }
-    const e = new Set($e.map((t) => t.suggestion));
-    return j.filter((t) => !e.has(t));
-  }, [$e, A, De, j, a]), ze = i.useCallback((e) => {
-    if (!m.current) return;
-    const t = typeof y == "object" ? JSON.stringify(e.value) : e.value, n = t == null ? "" : String(t), o = e.insertMode ?? "replace", s = m.current.value ?? "";
-    let r = s, S = null, f = 0;
-    const V = k ? We(m.current) : null;
-    if (k && V)
-      r = `${s.slice(0, V.start)}${n}${s.slice(V.end)}`, S = V.start + n.length, f = V.start;
-    else
-      switch (o) {
-        case "append":
-          r = `${s}${n}`, S = r.length, f = s.length;
-          break;
-        case "prepend":
-          r = `${n}${s}`, S = n.length, f = 0;
-          break;
-        case "insert": {
-          const {
-            rawStart: p,
-            rawEnd: $
-          } = gt(m.current);
-          r = `${s.slice(0, p)}${n}${s.slice($)}`, S = p + n.length, f = p;
-          break;
-        }
-        default:
-          r = n, S = n.length, f = 0;
-          break;
-      }
-    ht(m.current, "value", r, "change"), Oe((p) => {
-      const $ = U(r), ae = re(p, $), E = n.length ? {
-        id: Ge.current++,
-        suggestion: e,
-        text: n,
-        start: f,
-        end: f + n.length
-      } : null, se = E ? [...ae, E] : ae;
-      return ye(se.map((rt) => rt.suggestion)), se;
-    }), S !== null && requestAnimationFrame(() => {
-      const p = m.current;
-      p && (p.focus({
-        preventScroll: !0
-      }), mt(p, S, S));
-    });
-  }, [k, re, y]), je = i.useCallback((e) => {
-    if (a ? h.applySuggestionValueSyntax(e) : ze(e), Ve?.(e), a) {
-      const t = v.current;
-      requestAnimationFrame(() => {
-        if (!t) return;
-        const n = {
-          type: "change",
-          target: t,
-          currentTarget: t
-        };
-        t.dispatchEvent(new Event("input", {
-          bubbles: !0
-        })), R?.(n), F?.(n);
-      });
-    }
-    l(!1), w.current = !1, requestAnimationFrame(() => {
-      te();
-    });
-  }, [v, ze, h, te, a, Ve, l, F, R]), Ce = i.useCallback((e) => {
-    z(), Te?.(e);
-  }, [z, Te]), Q = i.useCallback((e) => {
-    if (ge.current) {
-      ge.current = !1, Z?.(e);
-      return;
-    }
-    if (w.current) {
-      Z?.(e);
-      return;
-    }
-    l(!1), Z?.(e);
-  }, [Z, l]), be = i.useCallback((e) => {
-    if (a) {
-      h.handleKeyDownCapture(e), ce?.(e);
-      return;
-    }
-    (e.key === " " || e.code === "Space") && (e.stopPropagation(), e.nativeEvent?.stopImmediatePropagation?.()), ce?.(e);
-  }, [h, a, ce]), ke = i.useCallback((e) => {
-    if (d) {
-      if (e.key === "ArrowDown") {
-        e.preventDefault(), e.stopPropagation(), B.current ? K.current?.highlightNextItem?.() : (l(!0), setTimeout(() => K.current?.focusFirstItem?.(), 0));
-        return;
-      }
-      if (e.key === "ArrowUp") {
-        e.preventDefault(), e.stopPropagation(), B.current ? K.current?.highlightPreviousItem?.() : (l(!0), setTimeout(() => K.current?.focusLastItem?.(), 0));
-        return;
-      }
-      if (e.key === "Enter" && B.current) {
-        e.preventDefault(), e.stopPropagation(), K.current?.selectActiveItem?.() && l(!1);
-        return;
-      }
-      if (e.key === "Escape" && B.current) {
-        e.preventDefault(), e.stopPropagation(), l(!1);
-        return;
-      }
-    }
-    if (a && h.handleKeyDown(e)) {
-      if (e.key === "Backspace" || e.key === "Delete") {
-        const n = v.current;
-        if (n) {
-          const o = {
-            type: "change",
-            target: n,
-            currentTarget: n
-          };
-          R?.(o), F?.(o);
-        }
-      }
-      _?.(e);
-      return;
-    }
-    if (a && e.key === "Enter") {
-      e.preventDefault(), _?.(e);
-      return;
-    }
-    _?.(e);
-  }, [v, h, a, d, l, F, R, _]), qe = D(() => {
-    if (!a) return null;
-    const e = U(y), t = (N ?? []).filter(Boolean).filter((r) => r && (r.type === "text" || r.type === "block") && Number.isFinite(r.start) && Number.isFinite(r.end) && r.start <= r.end), n = t.length ? t : pt(e), o = (A ?? []).slice(), s = [];
-    return n.forEach((r, S) => {
-      const f = r.value ?? e.slice(r.start, r.end);
-      if (r.type === "text") {
-        const E = typeof r.content == "string" ? r.content : typeof f == "string" ? f : e.slice(r.start, r.end);
-        E?.length && s.push(E);
-        return;
-      }
-      const V = ie(f);
-      let p;
-      if (o.length) {
-        const E = o[0], se = ie(E?.value ?? E);
-        (V === "" || se === V) && (p = E, o.shift());
-      }
-      p || (p = {
-        value: f
-      });
-      const $ = bt(p), ae = r.content && typeof r.content != "string" || typeof r.content == "string" ? r.content : $?.label ?? $?.value ?? "";
-      s.push(/* @__PURE__ */ q(i.Fragment, { children: [
-        "​",
-        /* @__PURE__ */ g("span", { className: "input__token", contentEditable: !1, "aria-data": JSON.stringify($), style: {
-          display: "inline-flex",
-          alignItems: "center",
-          verticalAlign: "middle",
-          userSelect: "text",
-          WebkitUserSelect: "text"
-        }, children: ae }),
-        "​"
-      ] }, `${S}-${V}`));
-    }), s;
-  }, [A, a, N, y]);
-  ot(() => {
-    if (!a) return;
-    const e = O.current;
-    if (!e) return;
-    const t = h.takePendingSelection();
-    t && Ct(e, t.start, t.end);
-  }, [h, a, qe]);
-  const et = D(() => {
-    if (!a) return "plain";
-    const e = U(y), t = A?.length ?? 0, n = N?.length ?? 0;
-    return `${e}-${t}-${n}`;
-  }, [A, a, N, y]), ve = a ? /* @__PURE__ */ g("div", { ref: O, ..._e, ...de, contentEditable: !C && !I, suppressContentEditableWarning: !0, "aria-disabled": C || I, onInput: (e) => {
-    h.updateEditorState(O.current), d && (w.current = !0, ge.current = !0, l(!0), requestAnimationFrame(() => {
-      w.current = !1;
-    }));
-    const t = e.currentTarget, n = {
-      type: "change",
-      target: t,
-      currentTarget: t
-    };
-    R?.(n), F?.(n);
+  }, s = C(null), g = C(null);
+  a.useImperativeHandle(o, () => s.current);
+  const V = a.useCallback((e) => {
+    if (!r?.setValue) return;
+    const n = t.type !== "checkbox" ? F(e) : e;
+    Object.is(g.current, n) || (g.current = n, r.setValue(n));
+  }, [r?.setValue, t.type]), l = a.useCallback((e) => {
+    const n = e.currentTarget, z = t.type === "checkbox" && "checked" in n ? n.checked : n.value;
+    V(z);
+  }, [t.type, V]), y = _("input-wrapper__control input__control", t), j = t.type === "textarea" ? /* @__PURE__ */ c("textarea", { ref: s, ...y, ...h, onInput: (e) => {
+    l(e), f?.(e);
   }, onChange: (e) => {
-    h.handleChange(e);
-  }, onPaste: h.handlePaste, onFocus: Ce, onBlur: Q, onKeyDownCapture: be, onKeyDown: ke, spellCheck: !1, children: qe }, et) : u.type === "textarea" ? /* @__PURE__ */ g("textarea", { ref: m, ...ue("input__control", Be), ...de, onFocus: Ce, onBlur: Q, onKeyDownCapture: be, onKeyDown: ke, onInput: (e) => {
-    ne(e), R?.(e);
+    l(e), d?.(e);
+  }, spellCheck: !1, disabled: u }) : /* @__PURE__ */ c("input", { ref: s, ...y, ...h, onInput: (e) => {
+    l(e), f?.(e);
   }, onChange: (e) => {
-    ne(e), F?.(e);
-  }, spellCheck: !1, disabled: C || I }) : /* @__PURE__ */ g("input", { ref: m, ...ue("input__control", Be), ...de, onFocus: Ce, onBlur: Q, onKeyDownCapture: be, onKeyDown: ke, onInput: (e) => {
-    ne(e), R?.(e);
-  }, onChange: (e) => {
-    ne(e), F?.(e);
-  }, spellCheck: !1, disabled: C || I }), tt = i.useCallback((e) => {
-    if (C || I) return;
-    const t = e.target;
-    pe.current?.contains(t) || (w.current = !0, te(), z());
-  }, [C, I, te, z]);
-  P(() => {
-    const e = ee.current;
-    if (!e) return;
-    const t = (n) => {
-      const o = n.relatedTarget;
-      o && e.contains(o) || Q(n);
-    };
-    return e.addEventListener("focusout", t), () => e.removeEventListener("focusout", t);
-  }, [Q]);
-  const nt = D(() => /* @__PURE__ */ q(it, { open: Re, modal: !1, onOpenChange: (e) => {
-    !e && w.current || l(e);
-  }, children: [
-    /* @__PURE__ */ g(lt, { asChild: !0, children: /* @__PURE__ */ g("button", { type: "button", tabIndex: -1, "aria-hidden": !0, style: {
-      position: "absolute",
-      inset: 0,
-      opacity: 0,
-      pointerEvents: "none"
-    }, onMouseDown: (e) => e.preventDefault() }) }),
-    ve,
-    /* @__PURE__ */ g(ct, { children: /* @__PURE__ */ g("div", { ref: pe, onPointerDownCapture: () => {
-      w.current = !0;
-    }, onMouseDownCapture: (e) => {
-      e.preventDefault(), w.current = !0;
-    }, children: /* @__PURE__ */ q(ft, { color: "secondary", inputRef: v, children: [
-      xe,
-      /* @__PURE__ */ q(yt, { paddingSize: "xxs", mt: -0.2, mx: -0.2, children: [
-        oe?.length === 0 && Pe,
-        !!oe?.length && /* @__PURE__ */ g(
-          dt,
-          {
-            ref: K,
-            inputRef: v,
-            suggestions: oe,
-            onSuggestionSelect: je
-          }
-        )
-      ] }),
-      we
-    ] }) }) })
-  ] }), [Re, ve, a, oe, xe, we, Pe, je, v, l]);
-  return /* @__PURE__ */ q("div", { children: [
-    T && /* @__PURE__ */ g(at, { htmlFor: fe, id: Le, children: T }),
-    L && /* @__PURE__ */ g(st, { children: L }),
-    /* @__PURE__ */ q("div", { ref: ee, ...ue(`input ${M?.valid ? "" : "input--not-valid"}`, G), onPointerDown: tt, children: [
-      H && /* @__PURE__ */ g("div", { className: `input__left input__left--${Ue}`, children: H }),
-      d ? nt : ve,
-      X && /* @__PURE__ */ g("div", { className: `input__right input__right--${He}`, children: X })
-    ] }),
-    !M?.valid && M?.notValidMessage && /* @__PURE__ */ g(ut, { children: M.notValidMessage })
-  ] });
-}), Kt = kt;
+    l(e), d?.(e);
+  }, spellCheck: !1, disabled: u });
+  return /* @__PURE__ */ c(v, { type: t.type, title: p, description: I, left: k, right: x, leftType: R, rightType: P, formValidation: r, ...b, children: j });
+}), E = H;
 export {
-  Kt as Input
+  E as Input
 };

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

@@ -8,6 +8,5 @@ export interface InputWrapperProps<T = any> extends Omit<Component<HTMLElement>,
     rightType?: "action" | "placeholder" | "icon";
     title?: React.ReactNode;
     description?: React.ReactNode;
-    wrapperComponent?: Component<HTMLDivElement>;
 }
 export declare const InputWrapper: React.ForwardRefExoticComponent<InputWrapperProps>;