prometeo-design-system 2.0.3 → 2.1.0

package/dist/Input.es.js

@@ -1,10 +1,10 @@
 import { j as t } from "./jsx-runtime-ByW6EXIE.js";
 import { Icons as J } from "./Icons.es.js";
 import { c as e } from "./cn-B6yFEsav.js";
-import { memo as xe, useState as v, useRef as K, useCallback as me, useEffect as L, useLayoutEffect as ge } from "react";
-import { useDebounce as he } from "use-debounce";
-import be from "./Spinner.es.js";
-const C = {
+import { memo as xe, useState as H, useRef as K, useCallback as me, useEffect as L, useLayoutEffect as ge } from "react";
+import { useDebounce as be } from "use-debounce";
+import he from "./Spinner.es.js";
+const j = {
   default: {
     container: "",
     input: e(
@@ -57,20 +57,20 @@ const C = {
   label: S,
   icon: a,
   iconPosition: g = "left",
-  onChange: E,
+  onChange: P,
   value: u = "",
   debounceMs: c = 0,
-  name: k,
-  width: h = "100%",
+  name: E,
+  width: b = "100%",
   height: o,
   variant: f = "default",
   labelVariant: l = "default",
   size: Q = "medium",
-  disabled: z = !1,
+  disabled: k = !1,
   type: r = "text",
   isFetching: d,
-  errorComponent: P,
-  helperComponent: R,
+  errorComponent: R,
+  helperComponent: v,
   placeholder: U,
   required: D = !1,
   onFocus: W,
@@ -83,7 +83,7 @@ const C = {
   style: q,
   readOnly: A = !1
 }) => {
-  const [b, F] = v(u), [I] = he(b, c), [M, O] = v(i || !1), [B, ee] = v(!1), w = K(null), $ = K(null);
+  const [h, F] = H(u), [z] = be(h, c), [M, O] = H(i || !1), [I, ee] = H(!1), w = K(null), $ = K(null);
   let p = Q;
   o && (p = "customHeight");
   const x = {
@@ -111,10 +111,10 @@ const C = {
       label: "text-sm peer-focus:text-sm peer-placeholder-shown:text-xs ",
       icon: "w-6 h-6 right-3"
     }
-  }, T = me(E, [E]);
+  }, T = me(P, []);
   L(() => {
-    c > 0 && I !== u && T(I);
-  }, [I, c, T, u]), L(() => {
+    c > 0 && z !== u && T(z);
+  }, [z, c, T, u]), L(() => {
     F(u);
   }, [u]), L(() => {
     i && $.current?.focus();
@@ -124,21 +124,21 @@ const C = {
   }, re = (s) => {
     i === void 0 && (O(!1), X?.(s));
   }, se = (s) => {
-    const m = s.target.value, H = s.target.name, n = b;
-    F(m), n.length > 0 && m.length === 0 && V?.(), (!c || c === 0) && E(m, H);
+    const m = s.target.value, N = s.target.name, n = h;
+    F(m), n.length > 0 && m.length === 0 && V?.(), (!c || c === 0) && P(m, N);
   }, oe = () => {
-    ee(!B);
-  }, N = {};
-  h && h !== "100%" && (N.width = h), o && (N.height = o);
-  const le = b.length > 0, G = f === "error" && P, ne = !G && R, ae = r === "password", ue = () => l === "static" || i || M || le ? "-top-2 left-2 scale-90" : a ? `top-1/2 -translate-y-1/2 ${g === "left" ? "ml-6" : "mr-6"} scale-100 ` : "top-1/2 -translate-y-1/2 scale-100", ce = () => l === "static" ? o ? "text-sm" : "text-xs" : o ? x.customHeight.label : x[p].label, fe = () => o ? { height: o } : {}, de = () => l === "default" ? S : U || S || "", ie = () => ae ? a ? g === "left" ? "pl-10 pr-10" : "pr-16" : "pr-10" : a ? g === "left" ? "pl-10 pr-3" : "pr-10 pl-3" : "", pe = l === "default" && "transition-all duration-200 ease-in-out";
+    ee(!I);
+  }, B = {};
+  b && b !== "100%" && (B.width = b), o && (B.height = o);
+  const le = h.length > 0, G = f === "error" && R, ne = !G && v, ae = r === "password", ue = () => l === "static" || i || M || le ? "-top-2 left-2 scale-90" : a ? `top-1/2 -translate-y-1/2 ${g === "left" ? "ml-6" : "mr-6"} scale-100 ` : "top-1/2 -translate-y-1/2 scale-100", ce = () => l === "static" ? o ? "text-sm" : "text-xs" : o ? x.customHeight.label : x[p].label, fe = () => o ? { height: o } : {}, de = () => l === "default" ? S : U || S || "", ie = () => ae ? a ? g === "left" ? "pl-10 pr-10" : "pr-16" : "pr-10" : a ? g === "left" ? "pl-10 pr-3" : "pr-10 pl-3" : "", pe = l === "default" && "transition-all duration-200 ease-in-out";
   return ge(() => {
     if (w.current) {
-      const m = ((H) => {
-        let n = H;
+      const m = ((N) => {
+        let n = N;
         for (; n && n !== document.body; ) {
-          const j = window.getComputedStyle(n).backgroundColor;
-          if (j && j !== "transparent" && j !== "rgba(0, 0, 0, 0)")
-            return j;
+          const C = window.getComputedStyle(n).backgroundColor;
+          if (C && C !== "transparent" && C !== "rgba(0, 0, 0, 0)")
+            return C;
           n = n.parentElement;
         }
         const y = window.getComputedStyle(document.body).backgroundColor;
@@ -153,39 +153,39 @@ const C = {
         className: e(
           "relative",
           x[p].container,
-          !h && "w-full",
+          !b && "w-full",
           "bg-inherit",
           l === "static" && "mt-2",
           _
         ),
-        style: { ...q, ...N },
+        style: { ...q, ...B },
         children: [
           /* @__PURE__ */ t.jsx(
             "input",
             {
-              id: k,
-              name: k,
+              id: E,
+              name: E,
               ref: $,
-              value: b,
+              value: h,
               placeholder: de(),
-              type: r === "password" && B ? "text" : r,
+              type: r === "password" && I ? "text" : r,
               className: e(
                 "peer w-full border-1 rounded-lg bg-transparent appearance-none transition-all duration-200 ease-in-out",
                 "focus:outline-none px-3",
                 l === "default" && "placeholder:text-transparent",
                 l === "static" && "placeholder:text-neutral-medium-default placeholder:opacity-50",
                 x[p].input,
-                C[f].input,
+                j[f].input,
                 a && "pr-10",
-                z && "bg-transparent opacity-60 border-neutral-strong-default text-neutral-medium-disabled",
-                C[f].container,
+                k && "bg-transparent opacity-60 border-neutral-strong-default text-neutral-medium-disabled",
+                j[f].container,
                 ie()
               ),
               style: fe(),
               onChange: se,
               onFocus: te,
               onBlur: re,
-              disabled: z,
+              disabled: k,
               required: D,
               onEmptied: V,
               onKeyDown: Y,
@@ -197,39 +197,40 @@ const C = {
             "label",
             {
               ref: w,
-              htmlFor: k,
+              htmlFor: E,
               className: e(
                 "absolute left-3 pointer-events-none px-1 z-10",
                 pe,
                 ce(),
-                C[f].label,
+                j[f].label,
                 ue(),
                 D && "after:content-['*'] after:text-error-default after:ml-1",
-                z && "text-neutral-medium-disabled prometeo-fonts-label-large"
+                k && "text-neutral-medium-disabled prometeo-fonts-label-large"
               ),
               children: S
             }
           ),
           (a || r === "password" || d) && /* @__PURE__ */ t.jsx(
-            "div",
+            "button",
             {
+              type: "button",
               className: e(
                 "absolute top-1/2 -translate-y-1/2 flex items-center justify-center z-10",
                 x[p].icon,
-                C[f].icon,
+                j[f].icon,
                 r === "password" && !d ? "cursor-pointer" : "pointer-events-none",
                 g === "right" ? "right-3" : "left-3"
               ),
               onClick: r === "password" && !d ? oe : void 0,
               onMouseDown: (s) => r === "password" && !d && s.preventDefault(),
-              children: /* @__PURE__ */ t.jsx("div", { children: d && r !== "password" ? /* @__PURE__ */ t.jsx("div", { children: /* @__PURE__ */ t.jsx(be, { size: 24, color: "#7c86ff", loading: !0, variant: "clip" }) }) : r === "password" ? B ? /* @__PURE__ */ t.jsx(J.EyeVisibility, { size: 24, className: "" }) : /* @__PURE__ */ t.jsx(J.EyeVisibilityOff, { size: 24, className: "" }) : a })
+              children: /* @__PURE__ */ t.jsx("div", { children: d && r !== "password" ? /* @__PURE__ */ t.jsx("div", { children: /* @__PURE__ */ t.jsx(he, { size: 24, color: "#7c86ff", loading: !0, variant: "clip" }) }) : r === "password" ? I ? /* @__PURE__ */ t.jsx(J.EyeVisibility, { size: 24, className: "" }) : /* @__PURE__ */ t.jsx(J.EyeVisibilityOff, { size: 24, className: "" }) : a })
             }
           )
         ]
       }
     ),
-    ne && R,
-    G && P
+    ne && v,
+    G && R
   ] });
 }, Ie = xe(we);
 export {

package/dist/components/Drawer/DrawerDesktop.d.ts

@@ -4,12 +4,14 @@ export interface DrawerDesktopHandle {
     isOpen: boolean;
 }
 export interface DrawerDesktopProps {
-    children: React.ReactNode;
-    direction: 'left' | 'right';
+    children?: React.ReactNode;
+    direction?: 'left' | 'right';
     modal?: boolean;
     className?: string;
     onClose?: () => void;
     defaultOpen?: boolean;
+    attachToParent?: boolean;
+    closeOnOverlayClick?: boolean;
 }
-declare const DrawerDesktop: import('react').ForwardRefExoticComponent<DrawerDesktopProps & import('react').RefAttributes<DrawerDesktopHandle>>;
-export default DrawerDesktop;
+declare const DrawerDesktopV2: import('react').ForwardRefExoticComponent<DrawerDesktopProps & import('react').RefAttributes<DrawerDesktopHandle>>;
+export default DrawerDesktopV2;

package/dist/components/Drawer/DrawerDesktop_old.d.ts

@@ -0,0 +1,15 @@
+export interface DrawerDesktopHandle {
+    open: () => void;
+    close: () => void;
+    isOpen: boolean;
+}
+export interface DrawerDesktopProps {
+    children: React.ReactNode;
+    direction: 'left' | 'right';
+    modal?: boolean;
+    className?: string;
+    onClose?: () => void;
+    defaultOpen?: boolean;
+}
+declare const DrawerDesktop: import('react').ForwardRefExoticComponent<DrawerDesktopProps & import('react').RefAttributes<DrawerDesktopHandle>>;
+export default DrawerDesktop;