prometeo-design-system 2.5.5 → 2.5.6

package/dist/InputFormik.es.js

@@ -1,9 +1,9 @@
-import { j as e } from "./jsx-runtime-ByW6EXIE.js";
+import { j as e } from "./jsx-runtime-DKDX3adD.js";
 import { c as u } from "./cn-B6yFEsav.js";
-import { FastField as O, ErrorMessage as q } from "formik";
-import { memo as G, useState as I, useRef as H, useCallback as y, useLayoutEffect as J } from "react";
+import { FastField as q, ErrorMessage as G } from "formik";
+import { memo as H, useState as I, useRef as J, useCallback as y, useLayoutEffect as Q } from "react";
 import { Icons as N } from "./Icons.es.js";
-const Q = ({
+const W = ({
   icon: l,
   iconPosition: r = "left",
   label: d,
@@ -15,20 +15,24 @@ const Q = ({
   placeholder: p,
   disabled: b = !1,
   field: t,
-  form: z,
+  innerRef: z,
+  form: K,
   ...a
 }) => {
-  const [o, v] = I(!1), [C, K] = I(!1), c = H(null), F = z.getFieldMeta(t.name), k = F.touched && F.error, E = t.value && t.value.toString().length > 0, x = j === "password", M = x ? C ? "text" : "password" : j, P = () => n === "static" ? p || d : p || "", R = () => x ? l ? r === "left" ? "pl-10 pr-10" : "pr-16" : "pr-10" : l ? r === "left" ? "pl-10" : "pr-10" : "", A = y(() => {
+  const [o, v] = I(!1), [C, M] = I(!1), c = J(null), F = K.getFieldMeta(t.name), k = F.touched && F.error, E = t.value && t.value.toString().length > 0, x = j === "password", P = x ? C ? "text" : "password" : j, R = () => n === "static" ? p || d : p || "", A = () => x ? l ? r === "left" ? "pl-10 pr-10" : "pr-16" : "pr-10" : l ? r === "left" ? "pl-10" : "pr-10" : "", D = y(() => {
     v(!0), a.onFocus?.();
-  }, [a]), D = y((i) => {
-    v(!1), a.onBlur?.(), t.onBlur(i);
-  }, [t, a]), T = y(() => {
-    K((i) => !i);
+  }, [a]), T = y(
+    (i) => {
+      v(!1), a.onBlur?.(), t.onBlur(i);
+    },
+    [t, a]
+  ), U = y(() => {
+    M((i) => !i);
   }, []);
-  J(() => {
+  Q(() => {
     if (c.current) {
-      const V = ((L) => {
-        let s = L;
+      const L = ((O) => {
+        let s = O;
         for (; s && s !== document.body; ) {
           const f = window.getComputedStyle(s).backgroundColor;
           if (f && f !== "transparent" && f !== "rgba(0, 0, 0, 0)")
@@ -37,8 +41,10 @@ const Q = ({
         }
         const m = window.getComputedStyle(document.body).backgroundColor;
         return m && m !== "transparent" && m !== "rgba(0, 0, 0, 0)" ? m : "rgb(255, 255, 255)";
-      })(c.current.parentElement);
-      c.current.style.backgroundColor = V;
+      })(
+        c.current.parentElement
+      );
+      c.current.style.backgroundColor = L;
     }
   }, []);
   const g = {
@@ -72,7 +78,7 @@ const Q = ({
       icon: {},
       placeholder: {}
     }
-  }, U = {
+  }, V = {
     none: {
       label: "left-2 "
     },
@@ -92,79 +98,108 @@ const Q = ({
       label: `top-1/2 -translate-y-1/2 scale-100 peer-focus:text-sm peer-placeholder-shown:text-base ${(o || E) && "top-0 scale-90"}`
     }
   }, h = b ? "disabled" : k ? "error" : "default";
-  return /* @__PURE__ */ e.jsxs("div", { className: u("relative w-full bg-inherit", n === "static" && "mt-5", $), children: [
-    /* @__PURE__ */ e.jsxs("div", { className: "relative bg-inherit", children: [
-      /* @__PURE__ */ e.jsx(
-        "input",
-        {
-          disabled: b,
-          id: w || t.name,
-          type: M,
-          name: t.name,
-          value: t.value || "",
-          placeholder: P(),
-          onChange: t.onChange,
-          onFocus: A,
-          onEmptied: a.onEmptied,
-          onKeyDown: a.onKeyDown,
-          onKeyUp: a.onKeyUp,
-          onBlur: D,
-          className: u(
-            "w-full px-3 h-12 text-left border-[1px] rounded-lg transition-all duration-200 ease-in-out text-neutral-default-default",
-            "bg-transparent focus:outline-none",
-            S[n].input,
-            g[h].input,
-            R(),
-            B
-          )
-        }
+  return /* @__PURE__ */ e.jsxs(
+    "div",
+    {
+      className: u(
+        "relative w-full bg-inherit",
+        n === "static" && "mt-5",
+        $
       ),
-      /* @__PURE__ */ e.jsx(
-        "label",
-        {
-          ref: c,
-          htmlFor: w || a.name,
-          className: u(
-            "absolute transition-all duration-200 font-bold text-sm ease-in-out pointer-events-none bg-inherit px-1 z-10",
-            "prometeo-fonts-label-large text-sm",
-            U[l ? r : "none"].label,
-            S[n].label,
-            g[h].label
+      children: [
+        /* @__PURE__ */ e.jsxs("div", { className: "relative bg-inherit", children: [
+          /* @__PURE__ */ e.jsx(
+            "input",
+            {
+              disabled: b,
+              id: w || t.name,
+              type: P,
+              name: t.name,
+              value: t.value || "",
+              placeholder: R(),
+              onChange: t.onChange,
+              onFocus: D,
+              onEmptied: a.onEmptied,
+              onKeyDown: a.onKeyDown,
+              onKeyUp: a.onKeyUp,
+              onBlur: T,
+              className: u(
+                "w-full px-3 h-12 text-left border-[1px] rounded-lg transition-all duration-200 ease-in-out text-neutral-default-default",
+                "bg-transparent focus:outline-none",
+                S[n].input,
+                g[h].input,
+                A(),
+                B
+              ),
+              ref: z
+            }
           ),
-          children: d
-        }
-      ),
-      l && /* @__PURE__ */ e.jsx("div", { className: u(
-        "absolute top-1/2 -translate-y-1/2 text-neutral-medium-default",
-        g[h].icon,
-        r === "left" ? "left-3" : "right-3"
-      ), children: l }),
-      x && /* @__PURE__ */ e.jsx(
-        "button",
-        {
-          type: "button",
-          onClick: T,
-          className: u(
-            "absolute top-1/2 -translate-y-1/2 p-1 text-neutral-medium-default hover:text-neutral-strong-default",
-            "transition-colors duration-200 focus:outline-none focus:text-primary-default-default",
-            l && r === "right" ? "right-8" : "right-3"
+          /* @__PURE__ */ e.jsx(
+            "label",
+            {
+              ref: c,
+              htmlFor: w || a.name,
+              className: u(
+                "absolute transition-all duration-200 font-bold text-sm ease-in-out pointer-events-none bg-inherit px-1 z-10",
+                "prometeo-fonts-label-large text-sm",
+                V[l ? r : "none"].label,
+                S[n].label,
+                g[h].label
+              ),
+              children: d
+            }
           ),
-          tabIndex: -1,
-          disabled: b,
-          children: C ? /* @__PURE__ */ e.jsx(N.EyeVisibility, { size: 24, className: "text-neutral-default-default" }) : /* @__PURE__ */ e.jsx(N.EyeVisibilityOff, { size: 24, className: "text-neutral-default-default" })
-        }
-      )
-    ] }),
-    k && /* @__PURE__ */ e.jsx(
-      q,
-      {
-        name: t.name,
-        component: "span",
-        className: "block text-error-default-default text-xs mt-1"
-      }
-    )
-  ] });
-}, W = G(Q), le = (l) => /* @__PURE__ */ e.jsx(O, { name: l.name, children: ({ field: r, form: d }) => /* @__PURE__ */ e.jsx(W, { ...l, field: r, form: d }) });
+          l && /* @__PURE__ */ e.jsx(
+            "div",
+            {
+              className: u(
+                "absolute top-1/2 -translate-y-1/2 text-neutral-medium-default",
+                g[h].icon,
+                r === "left" ? "left-3" : "right-3"
+              ),
+              children: l
+            }
+          ),
+          x && /* @__PURE__ */ e.jsx(
+            "button",
+            {
+              type: "button",
+              onClick: U,
+              className: u(
+                "absolute top-1/2 -translate-y-1/2 p-1 text-neutral-medium-default hover:text-neutral-strong-default",
+                "transition-colors duration-200 focus:outline-none focus:text-primary-default-default",
+                l && r === "right" ? "right-8" : "right-3"
+              ),
+              tabIndex: -1,
+              disabled: b,
+              children: C ? /* @__PURE__ */ e.jsx(
+                N.EyeVisibility,
+                {
+                  size: 24,
+                  className: "text-neutral-default-default"
+                }
+              ) : /* @__PURE__ */ e.jsx(
+                N.EyeVisibilityOff,
+                {
+                  size: 24,
+                  className: "text-neutral-default-default"
+                }
+              )
+            }
+          )
+        ] }),
+        k && /* @__PURE__ */ e.jsx(
+          G,
+          {
+            name: t.name,
+            component: "span",
+            className: "block text-error-default-default text-xs mt-1"
+          }
+        )
+      ]
+    }
+  );
+}, X = H(W), ae = (l) => /* @__PURE__ */ e.jsx(q, { name: l.name, children: ({ field: r, form: d }) => /* @__PURE__ */ e.jsx(X, { ...l, field: r, form: d }) });
 export {
-  le as default
+  ae as default
 };

package/dist/InputMultiple.es.js

@@ -1,4 +1,4 @@
-import { j as r } from "./jsx-runtime-ByW6EXIE.js";
+import { j as r } from "./jsx-runtime-DKDX3adD.js";
 import { Icons as C } from "./Icons.es.js";
 import { c as d } from "./cn-B6yFEsav.js";
 import S, { useRef as M, useState as x, useCallback as T, useEffect as ee } from "react";

package/dist/{LayoutGeneric-B6E-yOYJ.js → LayoutGeneric-CbaoatQB.js}

@@ -1,4 +1,4 @@
-import { j as n } from "./jsx-runtime-ByW6EXIE.js";
+import { j as n } from "./jsx-runtime-DKDX3adD.js";
 import { useRef as o, createContext as c, useContext as l, memo as d } from "react";
 const a = c(null), x = ({ children: e }) => {
   const r = o(null), s = o(null), u = (t) => {

package/dist/LayoutGeneric.es.js

@@ -1,4 +1,4 @@
-import { L as f } from "./LayoutGeneric-B6E-yOYJ.js";
+import { L as f } from "./LayoutGeneric-CbaoatQB.js";
 export {
   f as default
 };

package/dist/Logo.es.js

@@ -1,4 +1,4 @@
-import { j as e } from "./jsx-runtime-ByW6EXIE.js";
+import { j as e } from "./jsx-runtime-DKDX3adD.js";
 import { Icons as t } from "./Icons.es.js";
 const s = () => /* @__PURE__ */ e.jsxs("div", { className: "container-logo flex items-center justify-center gap-1 bg-gradient-to-br from-[#312C85] to-[#1E1A4D] rounded-md min-w-[185px]", children: [
   /* @__PURE__ */ e.jsx(t.TicketFilled, { size: 28, className: "rotate-140 text-primary-medium-pressed icon-logo" }),

package/dist/Menu.es.js

@@ -1,4 +1,4 @@
-import { j as e } from "./jsx-runtime-ByW6EXIE.js";
+import { j as e } from "./jsx-runtime-DKDX3adD.js";
 import { c as r } from "./cn-B6yFEsav.js";
 import { AnimatePresence as n, motion as o } from "framer-motion";
 const s = ({ menuRef: t, children: a, className: i }) => /* @__PURE__ */ e.jsx("div", { ref: t, className: r("flex bg-neutral-default-default absolute bottom-10 left-24 border-1 border-neutral-strong-default h-auto w-60 rounded-md px-2", i), children: /* @__PURE__ */ e.jsx(n, { mode: "wait", children: /* @__PURE__ */ e.jsx(

package/dist/OtpInput.es.js

@@ -1,4 +1,4 @@
-import { j as p } from "./jsx-runtime-ByW6EXIE.js";
+import { j as p } from "./jsx-runtime-DKDX3adD.js";
 import { Icons as ge } from "./Icons.es.js";
 import { c as $ } from "./cn-B6yFEsav.js";
 import * as n from "react";

package/dist/Pagination.es.js

@@ -1,4 +1,4 @@
-import { j as t } from "./jsx-runtime-ByW6EXIE.js";
+import { j as t } from "./jsx-runtime-DKDX3adD.js";
 import { motion as a } from "framer-motion";
 function h({
   currentPage: i = 1,

package/dist/ProfilePictureUpload.es.js

@@ -1,4 +1,4 @@
-import { j as n } from "./jsx-runtime-ByW6EXIE.js";
+import { j as n } from "./jsx-runtime-DKDX3adD.js";
 import { motion as s } from "framer-motion";
 import { memo as T, useRef as b, useLayoutEffect as A } from "react";
 import M from "./Avatar.es.js";

package/dist/ProgressBar.es.js

@@ -1,4 +1,4 @@
-import { j as e } from "./jsx-runtime-ByW6EXIE.js";
+import { j as e } from "./jsx-runtime-DKDX3adD.js";
 import { c as x } from "./cn-B6yFEsav.js";
 import u from "react";
 const j = u.forwardRef(

package/dist/SegmentedButton.es.js

@@ -1,4 +1,4 @@
-import { j as u } from "./jsx-runtime-ByW6EXIE.js";
+import { j as u } from "./jsx-runtime-DKDX3adD.js";
 import { c as s } from "./cn-B6yFEsav.js";
 import z, { useState as M, useMemo as C, useEffect as L } from "react";
 import { motion as E } from "framer-motion";

package/dist/{Select-C1MxM6yq.js → Select-CrTtTmXZ.js}

@@ -1,11 +1,11 @@
-import { j as l } from "./jsx-runtime-ByW6EXIE.js";
+import { j as l } from "./jsx-runtime-DKDX3adD.js";
 import { Icons as Q } from "./Icons.es.js";
 import { c as u } from "./cn-B6yFEsav.js";
 import we, { memo as R, useState as ce, useRef as V, useMemo as Z, useCallback as J, useEffect as ee, useImperativeHandle as _e } from "react";
 import Re from "./Spinner.es.js";
 import { createPortal as We } from "react-dom";
 import { u as Be } from "./useDragScroll-CHN9OMwn.js";
-import { u as Ke, I as Ue } from "./Input-DwIAUqcc.js";
+import { u as Ke, I as Ue } from "./Input-PNwH7rb6.js";
 import Fe from "./CheckBox.es.js";
 import { Skeleton as Ne } from "./Skeleton.es.js";
 const ke = (e) => {

package/dist/Select.es.js

@@ -1,4 +1,4 @@
-import { S as f } from "./Select-C1MxM6yq.js";
+import { S as f } from "./Select-CrTtTmXZ.js";
 export {
   f as default
 };

package/dist/SelectFormik.es.js

@@ -1,6 +1,6 @@
-import { j as d } from "./jsx-runtime-ByW6EXIE.js";
+import { j as d } from "./jsx-runtime-DKDX3adD.js";
 import { useField as y } from "formik";
-import { S as m } from "./Select-C1MxM6yq.js";
+import { S as m } from "./Select-CrTtTmXZ.js";
 import { useRef as p, useEffect as g } from "react";
 function f(e) {
   return Array.isArray(e) && e.every(

package/dist/SelectFormikLegacy.es.js

@@ -1,4 +1,4 @@
-import { j as t } from "./jsx-runtime-ByW6EXIE.js";
+import { j as t } from "./jsx-runtime-DKDX3adD.js";
 import { Icons as g } from "./Icons.es.js";
 import { c as d } from "./cn-B6yFEsav.js";
 import { useField as $, ErrorMessage as q } from "formik";

package/dist/SelectSearch.es.js

@@ -1,5 +1,5 @@
-import { j as G } from "./jsx-runtime-ByW6EXIE.js";
-import { g as i, S as H } from "./Select-C1MxM6yq.js";
+import { j as G } from "./jsx-runtime-DKDX3adD.js";
+import { g as i, S as H } from "./Select-CrTtTmXZ.js";
 import { useState as w, useRef as T, useEffect as m, useMemo as Q, useCallback as X } from "react";
 function te(e) {
   const {

package/dist/Skeleton.es.js

@@ -1,4 +1,4 @@
-import { j as E } from "./jsx-runtime-ByW6EXIE.js";
+import { j as E } from "./jsx-runtime-DKDX3adD.js";
 import { c as B } from "./cn-B6yFEsav.js";
 import { memo as N, useRef as R, useCallback as D, useLayoutEffect as M } from "react";
 const y = (n) => {

package/dist/Spinner.es.js

@@ -1,4 +1,4 @@
-import { j as e } from "./jsx-runtime-ByW6EXIE.js";
+import { j as e } from "./jsx-runtime-DKDX3adD.js";
 import { ClipLoader as l, SyncLoader as m, HashLoader as p, GridLoader as x, DotLoader as j, BounceLoader as f } from "react-spinners";
 import { c as L } from "./cn-B6yFEsav.js";
 const y = ({

package/dist/Steps.es.js

@@ -1,4 +1,4 @@
-import { j as e } from "./jsx-runtime-ByW6EXIE.js";
+import { j as e } from "./jsx-runtime-DKDX3adD.js";
 import { c as j } from "./cn-B6yFEsav.js";
 import { motion as r } from "framer-motion";
 import N from "react";

package/dist/SwipeContainer.es.js

@@ -1,4 +1,4 @@
-import { j as o } from "./jsx-runtime-ByW6EXIE.js";
+import { j as o } from "./jsx-runtime-DKDX3adD.js";
 import { c as i } from "./cn-B6yFEsav.js";
 import { useState as d, useRef as D, useEffect as L } from "react";
 const O = ({

package/dist/Switch.es.js

@@ -1,4 +1,4 @@
-import { j as a } from "./jsx-runtime-ByW6EXIE.js";
+import { j as a } from "./jsx-runtime-DKDX3adD.js";
 import { c as r } from "./cn-B6yFEsav.js";
 import { memo as w, useRef as b } from "react";
 import { motion as c } from "framer-motion";

package/dist/TabLinks.es.js

@@ -1,4 +1,4 @@
-import { j as n } from "./jsx-runtime-ByW6EXIE.js";
+import { j as n } from "./jsx-runtime-DKDX3adD.js";
 import { motion as x } from "framer-motion";
 import { memo as N } from "react";
 import { c as r } from "./cn-B6yFEsav.js";

package/dist/Table.es.js

@@ -1,4 +1,4 @@
-import { j as r } from "./jsx-runtime-ByW6EXIE.js";
+import { j as r } from "./jsx-runtime-DKDX3adD.js";
 import { c as l } from "./cn-B6yFEsav.js";
 import * as o from "react";
 const n = o.forwardRef(({ className: e, ...t }, a) => /* @__PURE__ */ r.jsx("div", { className: "w-full", children: /* @__PURE__ */ r.jsx(

package/dist/TextArea.es.js

@@ -1,4 +1,4 @@
-import { j as y } from "./jsx-runtime-ByW6EXIE.js";
+import { j as y } from "./jsx-runtime-DKDX3adD.js";
 import { c as C } from "./cn-B6yFEsav.js";
 import * as s from "react";
 function M({

package/dist/Toast.es.js

@@ -1,9 +1,9 @@
-import { j as e } from "./jsx-runtime-ByW6EXIE.js";
+import { j as e } from "./jsx-runtime-DKDX3adD.js";
 import b from "react";
 import { toast as p } from "sonner";
 import { Icons as m } from "./Icons.es.js";
 import { c as s } from "./cn-B6yFEsav.js";
-import { B as u } from "./Button-Bc0LYLfg.js";
+import { B as u } from "./Button-DsbEyjth.js";
 const x = {
   dark: {
     success: {

package/dist/ToastProvider.es.js

@@ -1,4 +1,4 @@
-import { j as t } from "./jsx-runtime-ByW6EXIE.js";
+import { j as t } from "./jsx-runtime-DKDX3adD.js";
 import { Toaster as r } from "sonner";
 const i = ({ ...o }) => /* @__PURE__ */ t.jsx(r, { ...o, position: "bottom-right", richColors: !1, theme: "light" });
 export {

package/dist/Tooltip.es.js

@@ -1,4 +1,4 @@
-import { j as e } from "./jsx-runtime-ByW6EXIE.js";
+import { j as e } from "./jsx-runtime-DKDX3adD.js";
 import { AnimatePresence as f, motion as n } from "framer-motion";
 import { useState as p, cloneElement as x } from "react";
 import { Icons as b } from "./Icons.es.js";

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

@@ -1,6 +1,6 @@
 import { default as React } from 'react';
 export interface DrawerMobileProps<TContext = unknown> {
-    children?: React.ReactNode;
+    children?: React.ReactNode | ((context: TContext | null) => React.ReactNode);
     defaultOpen?: boolean;
     onClose?: (context: TContext | null) => void;
     snap?: string | number | null;

package/dist/components/InputFormik/InputFormik.d.ts

@@ -3,7 +3,7 @@ export type LabelVariant = "default" | "static";
 export interface IInputFormik {
     label: string;
     icon?: ReactNode;
-    iconPosition?: 'left' | 'right';
+    iconPosition?: "left" | "right";
     className?: string;
     containerClassName?: string;
     id?: string;
@@ -17,6 +17,7 @@ export interface IInputFormik {
     onEmptied?: () => void;
     onKeyDown?: (event: React.KeyboardEvent<HTMLInputElement>) => void;
     onKeyUp?: (event: React.KeyboardEvent<HTMLInputElement>) => void;
+    innerRef?: React.Ref<HTMLInputElement>;
 }
 declare const InputFormik: (props: IInputFormik) => import("react/jsx-runtime").JSX.Element;
 export default InputFormik;