prometeo-design-system 2.9.6 → 2.9.7

package/dist/Image.es.js

@@ -1,30 +1,30 @@
 import { j as n } from "./jsx-runtime-DKDX3adD.js";
-import { memo as x, useState as E, useRef as R, useCallback as N, useEffect as b } from "react";
-import M from "./Spinner.es.js";
-import { c as d } from "./cn-B6yFEsav.js";
-import S from "./Skeleton.es.js";
-const T = (s, e) => {
+import { memo as P, useState as x, useRef as E, useCallback as w, useEffect as N } from "react";
+import R from "./Spinner.es.js";
+import { c as u } from "./cn-B6yFEsav.js";
+import M from "./Skeleton.es.js";
+const S = (s, e) => {
   if (s.src !== e.src || s.alt !== e.alt || s.width !== e.width || s.height !== e.height || s.className !== e.className || s.lazy !== e.lazy || s.showLoader !== e.showLoader || s.allowPreview !== e.allowPreview) return !1;
   const r = s.loaderProps, a = e.loaderProps;
   return !(r !== a && (!r || !a || r.loaderType !== a.loaderType || r.variant !== a.variant || r.speedMultiplier !== a.speedMultiplier || r.className !== a.className || r.size !== a.size || r.backdropClassName !== a.backdropClassName));
-}, D = x(
+}, T = P(
   (s) => {
-    const { src: e, alt: r, width: a, height: c, className: f, lazy: y = !0, showLoader: k = !0, loaderProps: I, allowPreview: t = !1, galleryRef: l } = s, { variant: v = "clip", speedMultiplier: j = 0.7, className: z, size: C = 48, backdropClassName: L, loaderType: u = "clasic" } = I || {}, [m, g] = E(!0), h = R(!1), p = N((i) => {
+    const { src: e, alt: r, width: a, height: c, className: f, lazy: b = !0, showLoader: y = !0, loaderProps: k, allowPreview: t = !1, galleryRef: l } = s, { variant: I = "clip", speedMultiplier: v = 0.7, className: j, backdropClassName: C, loaderType: d = "clasic" } = k || {}, [L, m] = x(!0), g = E(!1), h = w((i) => {
       const o = new Image();
       o.src = i, o.onload = () => {
-        g(!1);
+        m(!1);
       }, o.onerror = () => {
-        g(!1);
+        m(!1);
       };
     }, []);
-    b(() => {
-      p(e);
-    }, [e, p]), b(() => {
-      l?.current && !h.current && (l.current.addImage({ src: e, alt: r, width: a, height: c, className: f }), h.current = !0);
+    N(() => {
+      h(e);
+    }, [e, h]), N(() => {
+      l?.current && !g.current && (l.current.addImage({ src: e, alt: r, width: a, height: c, className: f }), g.current = !0);
     }, [l, e, r, a, c, f]);
-    const w = N(() => {
+    const p = w(() => {
       if (t && l?.current) {
-        const o = l.current.images.findIndex((P) => P.src === e);
+        const o = l.current.images.findIndex((z) => z.src === e);
         l.current.openLightbox(o >= 0 ? o : 0);
       }
     }, [t, l, e]);
@@ -33,7 +33,7 @@ const T = (s, e) => {
       /* @__PURE__ */ n.jsxs(
         "div",
         {
-          className: d(
+          className: u(
             "relative rounded-2xl overflow-hidden select-none",
             t && l && "cursor-pointer hover:brightness-75 transition-all ease-in-out duration-300",
             f
@@ -44,11 +44,11 @@ const T = (s, e) => {
             minWidth: a,
             minHeight: c
           },
-          onClick: w,
+          onClick: p,
           role: t ? "button" : void 0,
           tabIndex: t ? 0 : void 0,
           onKeyDown: t ? (i) => {
-            (i.key === "Enter" || i.key === " ") && (i.preventDefault(), w());
+            (i.key === "Enter" || i.key === " ") && (i.preventDefault(), p());
           } : void 0,
           children: [
             /* @__PURE__ */ n.jsx(
@@ -57,21 +57,21 @@ const T = (s, e) => {
                 draggable: !1,
                 src: e,
                 alt: r,
-                className: d("object-cover", f, "w-full h-full"),
-                loading: y ? "lazy" : "eager"
+                className: u("object-cover", f, "w-full h-full"),
+                loading: b ? "lazy" : "eager"
               }
             ),
-            m && k && /* @__PURE__ */ n.jsx(
+            L && y && /* @__PURE__ */ n.jsx(
               "div",
               {
-                className: d(
+                className: u(
                   "absolute grid place-items-center",
                   "inset-0",
-                  u === "skeleton" ? "bg-inherit" : "bg-black/30",
-                  L
+                  d === "skeleton" ? "bg-inherit" : "bg-black/30",
+                  C
                 ),
-                children: u === "clasic" ? /* @__PURE__ */ n.jsx(M, { variant: v, speedMultiplier: j, loading: m, className: z, size: C }) : /* @__PURE__ */ n.jsx(
-                  S,
+                children: d === "clasic" ? /* @__PURE__ */ n.jsx(R, { variant: I, speedMultiplier: v, className: j }) : /* @__PURE__ */ n.jsx(
+                  M,
                   {
                     className: "w-full h-full z-100"
                   }
@@ -83,9 +83,9 @@ const T = (s, e) => {
       )
     );
   },
-  T
+  S
 );
-D.displayName = "Image";
+T.displayName = "Image";
 export {
-  D as default
+  T as default
 };

package/dist/{ImageGallery-Ckxg9OIC.js → ImageGallery-WKzUevOQ.js}

@@ -3,9 +3,9 @@ import Q, { memo as M, forwardRef as A, useRef as v, useEffect as ee, useCallbac
 import { c as X } from "./cn-B6yFEsav.js";
 import { u as ne } from "./useDragScroll-CHN9OMwn.js";
 import S from "./Button.es.js";
-import { a as re, b as ae, c as se } from "./Icons-DtFC5DJ7.js";
+import { Close as re, CrevronLeft as se, CrevronRight as ae } from "./Icons.es.js";
 const L = M(A(({ images: n, className: c }, r) => {
-  const { ref: d, bind: s } = ne({
+  const { ref: d, bind: a } = ne({
     axis: "x",
     friction: 0.9,
     minVelocity: 0.5,
@@ -20,12 +20,12 @@ const L = M(A(({ images: n, className: c }, r) => {
     {
       ref: d,
       className: X("flex gap-4 w-full overflow-x-auto py-2 relative", c),
-      onPointerDown: s.onPointerDown,
-      onPointerMove: s.onPointerMove,
-      onPointerUp: s.onPointerUp,
-      onPointerLeave: s.onPointerLeave,
-      onPointerCancel: s.onPointerCancel,
-      onClickCapture: s.onClickCapture,
+      onPointerDown: a.onPointerDown,
+      onPointerMove: a.onPointerMove,
+      onPointerUp: a.onPointerUp,
+      onPointerLeave: a.onPointerLeave,
+      onPointerCancel: a.onPointerCancel,
+      onClickCapture: a.onClickCapture,
       "aria-label": "Image gallery",
       children: n && n.length > 0 && n.map((l, o) => Q.cloneElement(l, {
         key: l.props.src || o,
@@ -37,7 +37,7 @@ const L = M(A(({ images: n, className: c }, r) => {
   );
 }));
 L.displayName = "GalleryPreview";
-const O = M(({ images: n, lightboxClassName: c, closeLightbox: r, showThumbnails: d, thumbnailsClassName: s, currentIndex: l, goToNext: o, goToPrevious: a, goToIndex: N }) => {
+const O = M(({ images: n, lightboxClassName: c, closeLightbox: r, showThumbnails: d, thumbnailsClassName: a, currentIndex: l, goToNext: o, goToPrevious: s, goToIndex: N }) => {
   const h = v(null), y = v(null), w = v(null), m = v({
     scale: 1,
     translateX: 0,
@@ -53,15 +53,15 @@ const O = M(({ images: n, lightboxClassName: c, closeLightbox: r, showThumbnails
     w.current && w.current.focus();
   }, []);
   const k = i((e) => {
-    e.preventDefault(), e.stopPropagation(), e.key === "Escape" ? r() : e.key === "ArrowLeft" ? a() : e.key === "ArrowRight" && o();
-  }, [r, a, o]), P = i((e) => {
+    e.preventDefault(), e.stopPropagation(), e.key === "Escape" ? r() : e.key === "ArrowLeft" ? s() : e.key === "ArrowRight" && o();
+  }, [r, s, o]), P = i((e) => {
     u.current = { startX: e.touches[0].clientX, startY: e.touches[0].clientY, isDragging: !0, distanceX: 0, distanceY: 0 };
   }, []), j = i((e) => {
     const g = e.touches[0];
     u.current = { ...u.current, isDragging: !0, distanceX: g.clientX - u.current.startX, distanceY: g.clientY - u.current.startY };
   }, []), z = i(() => {
-    u.current = { ...u.current, startX: 0, startY: 0, isDragging: !1 }, Math.abs(u.current.distanceX) > Math.abs(u.current.distanceY) && (u.current.distanceX < 0 ? o() : a());
-  }, [o, a]), C = i(() => {
+    u.current = { ...u.current, startX: 0, startY: 0, isDragging: !1 }, Math.abs(u.current.distanceX) > Math.abs(u.current.distanceY) && (u.current.distanceX < 0 ? o() : s());
+  }, [o, s]), C = i(() => {
     const e = h.current;
     if (!e) return;
     const { scale: g, translateX: p, translateY: I } = m.current;
@@ -72,7 +72,7 @@ const O = M(({ images: n, lightboxClassName: c, closeLightbox: r, showThumbnails
     const g = h.current, p = y.current;
     if (!g || !p) return;
     if (e.shiftKey) {
-      e.deltaY < 0 ? o() : e.deltaY > 0 && a();
+      e.deltaY < 0 ? o() : e.deltaY > 0 && s();
       return;
     }
     const I = 2e-3, D = 1, B = 8, F = -e.deltaY * I, E = m.current.scale;
@@ -87,7 +87,7 @@ const O = M(({ images: n, lightboxClassName: c, closeLightbox: r, showThumbnails
       translateX: Z,
       translateY: J
     }, C();
-  }, [o, a, C, b]);
+  }, [o, s, C, b]);
   return n.length === 0 ? null : /* @__PURE__ */ t.jsxs(
     "div",
     {
@@ -120,7 +120,7 @@ const O = M(({ images: n, lightboxClassName: c, closeLightbox: r, showThumbnails
             {
               className: "absolute left-0 lg:h-full items-center flex justify-center w-16 z-100 cursor-w-resize",
               onClick: (e) => {
-                e.stopPropagation(), a();
+                e.stopPropagation(), s();
               },
               children: /* @__PURE__ */ t.jsx(
                 S,
@@ -129,11 +129,11 @@ const O = M(({ images: n, lightboxClassName: c, closeLightbox: r, showThumbnails
                   color: "secondary",
                   size: "small",
                   onClick: (e) => {
-                    e.stopPropagation(), a();
+                    e.stopPropagation(), s();
                   },
                   className: "text-white! hover:text-gray-300! w-auto! h-auto! p-2!",
                   "aria-label": "Previous image",
-                  children: /* @__PURE__ */ t.jsx(ae, { size: 24 })
+                  children: /* @__PURE__ */ t.jsx(se, { size: 24 })
                 }
               )
             }
@@ -156,7 +156,7 @@ const O = M(({ images: n, lightboxClassName: c, closeLightbox: r, showThumbnails
                   },
                   className: "text-white! hover:text-gray-300! w-auto! h-auto! p-2!",
                   "aria-label": "Next image",
-                  children: /* @__PURE__ */ t.jsx(se, { size: 24 })
+                  children: /* @__PURE__ */ t.jsx(ae, { size: 24 })
                 }
               )
             }
@@ -194,7 +194,7 @@ const O = M(({ images: n, lightboxClassName: c, closeLightbox: r, showThumbnails
             )
           }
         ),
-        d && /* @__PURE__ */ t.jsx("div", { className: " w-full absolute items-center flex justify-center left-0 right-0 z-100 bottom-0", children: /* @__PURE__ */ t.jsx(_, { images: n, currentIndex: l, goToIndex: N, thumbnailsClassName: s }) }),
+        d && /* @__PURE__ */ t.jsx("div", { className: " w-full absolute items-center flex justify-center left-0 right-0 z-100 bottom-0", children: /* @__PURE__ */ t.jsx(_, { images: n, currentIndex: l, goToIndex: N, thumbnailsClassName: a }) }),
         n.length > 1 && /* @__PURE__ */ t.jsxs("div", { className: "absolute bottom-20 left-1/2 transform -translate-x-1/2 text-neutral-default-default prometeo-fonts-label-xlarge px-4 py-2 rounded-full", children: [
           l + 1,
           " / ",
@@ -225,7 +225,7 @@ const le = (n, c) => {
                     display: none;
                 }
             ` }),
-      n.map((s, l) => /* @__PURE__ */ t.jsx(
+      n.map((a, l) => /* @__PURE__ */ t.jsx(
         "button",
         {
           type: "button",
@@ -240,13 +240,13 @@ const le = (n, c) => {
           children: /* @__PURE__ */ t.jsx(
             "img",
             {
-              src: s.src,
-              alt: s.alt,
+              src: a.src,
+              alt: a.alt,
               className: "w-full h-full object-cover select-none"
             }
           )
         },
-        s.src
+        a.src
       ))
     ]
   }
@@ -257,10 +257,10 @@ const oe = A(
     const {
       children: r,
       className: d,
-      lightboxClassName: s,
+      lightboxClassName: a,
       showThumbnails: l,
       thumbnailsClassName: o
-    } = n, [a, N] = R([]), [h, y] = R(!1), [w, m] = R(0), u = r ? Array.isArray(r) ? r : [r] : [], k = i((f) => {
+    } = n, [s, N] = R([]), [h, y] = R(!1), [w, m] = R(0), u = r ? Array.isArray(r) ? r : [r] : [], k = i((f) => {
       N((e) => e.some((p) => p.src === f.src) ? e : [...e, f]);
     }, []), P = i((f = 0) => {
       m(f), y(!0);
@@ -274,15 +274,15 @@ const oe = A(
         closeLightbox: j,
         isOpen: h,
         addImage: k,
-        images: a
+        images: s
       }),
-      [a]
+      [s]
     );
     const z = i(() => {
-      m((f) => (f + 1) % a.length);
-    }, [a.length]), C = i(() => {
-      m((f) => (f - 1 + a.length) % a.length);
-    }, [a.length]), b = i((f) => {
+      m((f) => (f + 1) % s.length);
+    }, [s.length]), C = i(() => {
+      m((f) => (f - 1 + s.length) % s.length);
+    }, [s.length]), b = i((f) => {
       m(f);
     }, []);
     return /* @__PURE__ */ t.jsxs(t.Fragment, { children: [
@@ -297,10 +297,10 @@ const oe = A(
       h && /* @__PURE__ */ t.jsx(
         O,
         {
-          images: a,
+          images: s,
           closeLightbox: j,
           showThumbnails: l,
-          lightboxClassName: s,
+          lightboxClassName: a,
           thumbnailsClassName: o,
           currentIndex: w,
           goToNext: z,

package/dist/ImageGallery.es.js

@@ -1,4 +1,4 @@
-import { I as p } from "./ImageGallery-Ckxg9OIC.js";
+import { I as p } from "./ImageGallery-WKzUevOQ.js";
 import { useRef as u, useCallback as r } from "react";
 const g = () => {
   const e = u(null), t = r((a) => {

package/dist/{Input-Cck37DpG.js → Input-Cf8P1QJv.js}

@@ -1,9 +1,9 @@
 import { j as r } from "./jsx-runtime-DKDX3adD.js";
-import { g as _, h as q, a as V } from "./Icons-DtFC5DJ7.js";
+import { EyeVisibility as _, EyeVisibilityOff as q, Close as V } from "./Icons.es.js";
 import { c as t } from "./cn-B6yFEsav.js";
 import { useRef as F, useLayoutEffect as ee, memo as te, forwardRef as re, useState as oe } from "react";
 import le from "./Spinner.es.js";
-import { H as se } from "./HelperComponent-g_xuKWzK.js";
+import { H as se } from "./HelperComponent-BeNlTMqI.js";
 const ae = (o) => {
   let e = o;
   for (; e && e !== document.body; ) {
@@ -25,7 +25,7 @@ function ne() {
     ref: o
   };
 }
-const g = {
+const b = {
   default: {
     container: "",
     input: t(
@@ -59,14 +59,14 @@ const g = {
     label: t("text-success", "peer-focus:text-success-light"),
     icon: t("text-success-light", "peer-focus:text-success-light")
   }
-}, S = re(
+}, v = re(
   ({
     label: o,
     icon: e,
     iconPosition: l = "left",
-    onChange: C,
+    onChange: N,
     value: n,
-    name: b,
+    name: g,
     width: x = "100%",
     height: u,
     variant: c = "default",
@@ -78,7 +78,7 @@ const g = {
     errorComponent: h,
     helperComponent: w,
     placeholder: $,
-    required: N = !1,
+    required: z = !1,
     onFocus: k,
     onBlur: I,
     onKeyDown: L,
@@ -86,8 +86,8 @@ const g = {
     className: B,
     style: P,
     readOnly: D = !1,
-    onClear: z,
-    ...v
+    onClear: C,
+    ...E
   }, A) => {
     const [y, M] = oe(!1), { ref: O } = ne();
     let d = H;
@@ -125,7 +125,7 @@ const g = {
       M(!y);
     }, j = {};
     x && x !== "100%" && (j.width = x), u && (j.height = u);
-    const E = c === "error" && h, G = !E && w, J = s === "password", K = () => a === "static" ? "-top-1 -translate-y-full left-0 pl-3" : e ? `${m ? "peer-placeholder-shown:top-[calc(50%-12px)]" : "peer-placeholder-shown:top-1/2"} -translate-y-1/2 peer-focus:top-0 peer-focus:left-3 peer-focus:px-1 peer-focus:ml-0 peer-focus:mr-0 ${l === "left" ? "peer-placeholder-shown:ml-6" : "peer-placeholder-shown:mr-6"}` : `${m ? "peer-placeholder-shown:top-[calc(50%-12px)]" : "peer-placeholder-shown:top-1/2"} -translate-y-1/2 peer-focus:top-0 peer-focus:left-3 peer-focus:px-1`, Q = () => u ? i.customHeight.label : i[d].label, U = () => u ? { height: u } : {}, W = () => a === "default" ? o : $ || o || "", X = () => J ? e ? l === "left" ? "pl-10 pr-10" : "pr-16" : "pr-10" : e ? l === "left" ? "pl-10 pr-3" : "pr-10 pl-3" : "", Y = a === "default" && "transition-all duration-200 ease-in-out", m = h || w;
+    const S = c === "error" && h, G = !S && w, J = s === "password", K = () => a === "static" ? "-top-1 -translate-y-full left-0 pl-3" : e ? `${m ? "peer-placeholder-shown:top-[calc(50%-12px)]" : "peer-placeholder-shown:top-1/2"} -translate-y-1/2 peer-focus:top-0 peer-focus:left-3 peer-focus:px-1 peer-focus:ml-0 peer-focus:mr-0 ${l === "left" ? "peer-placeholder-shown:ml-6" : "peer-placeholder-shown:mr-6"}` : `${m ? "peer-placeholder-shown:top-[calc(50%-12px)]" : "peer-placeholder-shown:top-1/2"} -translate-y-1/2 peer-focus:top-0 peer-focus:left-3 peer-focus:px-1`, Q = () => u ? i.customHeight.label : i[d].label, U = () => u ? { height: u } : {}, W = () => a === "default" ? o : $ || o || "", X = () => J ? e ? l === "left" ? "pl-10 pr-10" : "pr-16" : "pr-10" : e ? l === "left" ? "pl-10 pr-3" : "pr-10 pl-3" : "", Y = a === "default" && "transition-all duration-200 ease-in-out", m = h || w;
     return /* @__PURE__ */ r.jsxs(
       "div",
       {
@@ -142,8 +142,8 @@ const g = {
           /* @__PURE__ */ r.jsx(
             "input",
             {
-              id: b,
-              name: b,
+              id: g,
+              name: g,
               ref: A,
               value: n,
               placeholder: W(),
@@ -153,38 +153,38 @@ const g = {
                 "focus:outline-none px-3",
                 a === "default" && "placeholder:text-transparent",
                 a === "static" && "placeholder:text-neutral-medium-default ",
-                g[c].input,
+                b[c].input,
                 i[d].input,
                 e && "pr-10",
                 f && "bg-transparent opacity-60 border-neutral-strong-default text-neutral-medium-disabled",
-                g[c].container,
+                b[c].container,
                 X()
               ),
               style: U(),
-              onChange: C,
+              onChange: N,
               onFocus: k,
               onBlur: I,
               disabled: f,
-              required: N,
+              required: z,
               onKeyDown: L,
               onKeyUp: R,
-              defaultValue: v.defaultValue,
+              defaultValue: E.defaultValue,
               readOnly: D,
-              ...v
+              ...E
             }
           ),
           /* @__PURE__ */ r.jsx(
             "label",
             {
               ref: O,
-              htmlFor: b,
+              htmlFor: g,
               className: t(
                 "absolute left-3 pointer-events-none px-1 z-10",
                 Y,
                 Q(),
-                g[c].label,
+                b[c].label,
                 K(),
-                N && "after:content-['*'] after:text-error-default after:ml-1",
+                z && "after:content-['*'] after:text-error-default after:ml-1",
                 f && "text-neutral-medium-disabled prometeo-fonts-label-large"
               ),
               children: o
@@ -198,20 +198,19 @@ const g = {
               className: t(
                 `absolute ${m ? "top-[calc(50%-12px)]" : "top-1/2"} -translate-y-1/2 flex items-center justify-center z-10`,
                 i[d].icon,
-                g[c].icon,
+                b[c].icon,
                 s === "password" && !p ? "cursor-pointer" : "pointer-events-none",
                 l === "right" ? "right-3" : "left-3"
               ),
               onClick: s === "password" && !p ? T : void 0,
               onMouseDown: (Z) => s === "password" && !p && Z.preventDefault(),
-              children: /* @__PURE__ */ r.jsxs("div", { children: [
-                p && s !== "password" && /* @__PURE__ */ r.jsx("div", { children: /* @__PURE__ */ r.jsx(le, { size: 24, color: "#7c86ff", loading: !0, variant: "clip" }) }),
-                s === "password" && (y ? /* @__PURE__ */ r.jsx(_, { size: 24, className: "" }) : /* @__PURE__ */ r.jsx(q, { size: 24, className: "" })),
-                e
+              children: /* @__PURE__ */ r.jsxs("div", { className: "flex items-center", children: [
+                p && s !== "password" ? /* @__PURE__ */ r.jsx(le, { variant: "sync", size: "small", className: "size-5" }) : e,
+                s === "password" && (y ? /* @__PURE__ */ r.jsx(_, { size: 24, className: "" }) : /* @__PURE__ */ r.jsx(q, { size: 24, className: "" }))
               ] })
             }
           ),
-          z && /* @__PURE__ */ r.jsx(
+          C && /* @__PURE__ */ r.jsx(
             "button",
             {
               type: "button",
@@ -222,18 +221,18 @@ const g = {
                 f && "opacity-50 cursor-not-allowed"
               ),
               disabled: f,
-              onClick: z,
+              onClick: C,
               children: /* @__PURE__ */ r.jsx(V, { size: 20, className: "" })
             }
           ),
-          m && /* @__PURE__ */ r.jsx("div", { className: "min-h-6", children: (E || G) && /* @__PURE__ */ r.jsx(se, { className: "absolute ", variant: c, children: h || w }) })
+          m && /* @__PURE__ */ r.jsx("div", { className: "min-h-6", children: (S || G) && /* @__PURE__ */ r.jsx(se, { className: "absolute ", variant: c, children: h || w }) })
         ]
       }
     );
   }
 );
-S.displayName = "Input";
-const me = te(S);
+v.displayName = "Input";
+const me = te(v);
 export {
   me as I,
   ne as u

package/dist/Input.es.js

@@ -1,4 +1,4 @@
-import { I as f } from "./Input-Cck37DpG.js";
+import { I as f } from "./Input-Cf8P1QJv.js";
 export {
   f as default
 };