prometeo-design-system 2.2.2 → 2.3.0

package/dist/Avatar.es.js

@@ -1,4 +1,4 @@
-import { j as t } from "./jsx-runtime-DKDX3adD.js";
+import { j as t } from "./jsx-runtime-ByW6EXIE.js";
 import { c as p } from "./cn-B6yFEsav.js";
 import { motion as u } from "framer-motion";
 import { useState as f } from "react";

package/dist/{Button-DsbEyjth.js → Button-Bc0LYLfg.js}

@@ -1,4 +1,4 @@
-import { j as f } from "./jsx-runtime-DKDX3adD.js";
+import { j as f } from "./jsx-runtime-ByW6EXIE.js";
 import { c as g } from "./cn-B6yFEsav.js";
 import { clsx as B } from "clsx";
 import { useAnimationControls as E, motion as j } from "framer-motion";

package/dist/Button.es.js

@@ -1,4 +1,4 @@
-import { B as f } from "./Button-DsbEyjth.js";
+import { B as f } from "./Button-Bc0LYLfg.js";
 export {
   f as default
 };

package/dist/{CardProfile-BhFog7j5.js → CardProfile-BiYr6kY9.js}

@@ -1,4 +1,4 @@
-import { j as e } from "./jsx-runtime-DKDX3adD.js";
+import { j as e } from "./jsx-runtime-ByW6EXIE.js";
 import { c as l } from "./cn-B6yFEsav.js";
 import { motion as i, AnimatePresence as u } from "framer-motion";
 import m from "./Avatar.es.js";

package/dist/CardProfile.es.js

@@ -1,4 +1,4 @@
-import { C as a } from "./CardProfile-BhFog7j5.js";
+import { C as a } from "./CardProfile-BiYr6kY9.js";
 export {
   a as CardProfile
 };

package/dist/CheckBox.es.js

@@ -1,4 +1,4 @@
-import { j as t } from "./jsx-runtime-DKDX3adD.js";
+import { j as t } from "./jsx-runtime-ByW6EXIE.js";
 import { Icons as l } from "./Icons.es.js";
 import { useId as o, useRef as d } from "react";
 const k = ({ className: s, disabled: e, ...a }) => {

package/dist/CheckboxFormik.es.js

@@ -1,4 +1,4 @@
-import { j as e } from "./jsx-runtime-DKDX3adD.js";
+import { j as e } from "./jsx-runtime-ByW6EXIE.js";
 import { Icons as x } from "./Icons.es.js";
 import { c as r } from "./cn-B6yFEsav.js";
 import { useField as h, ErrorMessage as p } from "formik";

package/dist/DatePicker.es.js

@@ -1,11 +1,11 @@
-import { j as $ } from "./jsx-runtime-DKDX3adD.js";
+import { j as $ } from "./jsx-runtime-ByW6EXIE.js";
 import m, { createContext as mn, useContext as hn, useCallback as q, useRef as Se, useLayoutEffect as yn, useState as he, useEffect as _e, useMemo as fe, memo as pn } from "react";
 import { InputMultiple as gn } from "./InputMultiple.es.js";
 import wn from "./Input.es.js";
 import { createPortal as bn } from "react-dom";
 import { Icons as Mt } from "./Icons.es.js";
 import { c as Be } from "./cn-B6yFEsav.js";
-import { B as vt } from "./Button-DsbEyjth.js";
+import { B as vt } from "./Button-Bc0LYLfg.js";
 function Mn(e, t, n = "long") {
   return new Intl.DateTimeFormat("en-US", {
     // Enforces engine to render the time. Without the option JavaScriptCore omits it.

package/dist/DialogModal.es.js

@@ -1,4 +1,4 @@
-import { j as t } from "./jsx-runtime-DKDX3adD.js";
+import { j as t } from "./jsx-runtime-ByW6EXIE.js";
 import { forwardRef as u, useState as p, useImperativeHandle as f, useRef as g } from "react";
 import { c as i } from "./cn-B6yFEsav.js";
 const x = u(({

package/dist/DrawerDesktop.es.js

@@ -1,6 +1,6 @@
-import { j as s } from "./jsx-runtime-DKDX3adD.js";
+import { j as s } from "./jsx-runtime-ByW6EXIE.js";
 import { c as b } from "./cn-B6yFEsav.js";
-import { c as y, B as h } from "./Button-DsbEyjth.js";
+import { c as y, B as h } from "./Button-Bc0LYLfg.js";
 import { createPortal as g } from "react-dom";
 import { Icons as C } from "./Icons.es.js";
 import { forwardRef as k, useState as j, useRef as x, useEffect as v, useCallback as l, useImperativeHandle as D } from "react";

package/dist/DrawerMobile.es.js

@@ -1,4 +1,4 @@
-import { j as d } from "./jsx-runtime-DKDX3adD.js";
+import { j as d } from "./jsx-runtime-ByW6EXIE.js";
 import { c as T } from "./cn-B6yFEsav.js";
 import { forwardRef as q, useState as J, useRef as v, useEffect as M, useCallback as l, useMemo as B, useImperativeHandle as K } from "react";
 import { createPortal as Q } from "react-dom";

package/dist/DropZone.es.js

@@ -1,4 +1,4 @@
-import { j as e } from "./jsx-runtime-DKDX3adD.js";
+import { j as e } from "./jsx-runtime-ByW6EXIE.js";
 import { c as i } from "./cn-B6yFEsav.js";
 import R, { useCallback as w } from "react";
 import { useDropzone as z } from "react-dropzone";

package/dist/Header.es.js

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

package/dist/Icons.es.js

@@ -1,4 +1,4 @@
-import { j as h } from "./jsx-runtime-DKDX3adD.js";
+import { j as h } from "./jsx-runtime-ByW6EXIE.js";
 const v = ({
   size: t = 24,
   className: q,

package/dist/Input.es.js

@@ -1,4 +1,4 @@
-import { j as t } from "./jsx-runtime-DKDX3adD.js";
+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 H, useRef as K, useCallback as me, useEffect as L, useLayoutEffect as ge } from "react";

package/dist/InputFormik.es.js

@@ -1,4 +1,4 @@
-import { j as e } from "./jsx-runtime-DKDX3adD.js";
+import { j as e } from "./jsx-runtime-ByW6EXIE.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";

package/dist/InputMultiple.es.js

@@ -1,4 +1,4 @@
-import { j as r } from "./jsx-runtime-DKDX3adD.js";
+import { j as r } from "./jsx-runtime-ByW6EXIE.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-p4Pll4Cm.js → LayoutGeneric-jDE96L2N.js}

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

package/dist/LayoutGeneric.es.js

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

package/dist/Logo.es.js

@@ -1,4 +1,4 @@
-import { j as e } from "./jsx-runtime-DKDX3adD.js";
+import { j as e } from "./jsx-runtime-ByW6EXIE.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-DKDX3adD.js";
+import { j as e } from "./jsx-runtime-ByW6EXIE.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-DKDX3adD.js";
+import { j as p } from "./jsx-runtime-ByW6EXIE.js";
 import { Icons as ve } from "./Icons.es.js";
 import { c as L } 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-DKDX3adD.js";
+import { j as t } from "./jsx-runtime-ByW6EXIE.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 e } from "./jsx-runtime-DKDX3adD.js";
+import { j as e } from "./jsx-runtime-ByW6EXIE.js";
 import { motion as i, AnimatePresence as E } from "framer-motion";
 import { useRef as v, useState as R, useLayoutEffect as A } from "react";
 import H from "./Avatar.es.js";

package/dist/ProgressBar.es.js

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

package/dist/Select.es.js

@@ -1,4 +1,4 @@
-import { j as t } from "./jsx-runtime-DKDX3adD.js";
+import { j as t } from "./jsx-runtime-ByW6EXIE.js";
 import { Icons as w } from "./Icons.es.js";
 import { c as o } from "./cn-B6yFEsav.js";
 import { memo as se, useState as y, useRef as re, useEffect as oe } from "react";

package/dist/SelectFormik.es.js

@@ -1,4 +1,4 @@
-import { j as t } from "./jsx-runtime-DKDX3adD.js";
+import { j as t } from "./jsx-runtime-ByW6EXIE.js";
 import { Icons as h } from "./Icons.es.js";
 import { c as i } from "./cn-B6yFEsav.js";
 import { useField as P, ErrorMessage as M } from "formik";

package/dist/Skeleton.es.js

@@ -1,10 +1,28 @@
-import { j as x } from "./jsx-runtime-DKDX3adD.js";
+import { j as x } from "./jsx-runtime-ByW6EXIE.js";
 import { c as P } from "./cn-B6yFEsav.js";
-import { useRef as $, useLayoutEffect as B } from "react";
-const v = (g) => {
-  const e = $(null), { debugMode: b = !1, className: y = "", children: p, shape: f = "rounded", animation: i = "shimmer", onlyContainer: m = !1 } = g;
-  let d = "255, 255, 255", u = "255, 255, 255, 0.1";
-  B(() => {
+import { useRef as $, useCallback as B, useLayoutEffect as E } from "react";
+const A = (b) => {
+  const e = $(null), { debugMode: y = !1, className: p = "", children: f, shape: h = "rounded", animation: u = "shimmer", onlyContainer: l = !1 } = b;
+  let i = "255, 255, 255", m = "255, 255, 255, 0.1";
+  const g = B(() => {
+    if (!l && e.current)
+      switch (u) {
+        case "shimmer":
+          e.current.classList.add("skeleton-shimmer-animation");
+          const n = m.split(",").map(Number);
+          n && n.length >= 3 && (e.current.style.setProperty("--shimmer-color-r", n[0].toString()), e.current.style.setProperty("--shimmer-color-g", n[1].toString()), e.current.style.setProperty("--shimmer-color-b", n[2].toString()), e.current.style.setProperty("--shimmer-color-a", n[3].toString()));
+          break;
+        case "none":
+          e.current.style.animation = "none";
+          break;
+        case "border":
+          e.current.classList.add("skeleton-border-animation"), e.current.style.backgroundColor = "transparent";
+          const c = i.match(/\d+/g);
+          c && c.length >= 3 && (e.current.style.setProperty("--border-color-r", c[0]), e.current.style.setProperty("--border-color-g", c[1]), e.current.style.setProperty("--border-color-b", c[2]));
+          break;
+      }
+  }, [u, m, i, l]);
+  E(() => {
     if (e.current) {
       const n = (a) => {
         let r = a;
@@ -25,28 +43,11 @@ const v = (g) => {
         const o = t.getImageData(0, 0, 1, 1).data;
         return [o[0], o[1], o[2]];
       }, C = n(e.current.parentElement), s = c(C), S = s.reduce((a, r) => a + r, 0) < 382;
-      let l;
-      S ? l = `rgb(${s[0] + 10}, ${s[1] + 10}, ${s[2] + 10})` : (l = `rgb(${s[0] - 30}, ${s[1] - 30}, ${s[2] - 30})`, d = "115,115,115", u = "255,255,255, 0.4"), m && (l = "transparent", e.current.style.animation = "none"), e.current.style.backgroundColor = l, h();
+      let d;
+      S ? d = `rgb(${s[0] + 10}, ${s[1] + 10}, ${s[2] + 10})` : (d = `rgb(${s[0] - 30}, ${s[1] - 30}, ${s[2] - 30})`, i = "115,115,115", m = "255,255,255, 0.4"), l && (d = "transparent", e.current.style.animation = "none"), e.current.style.backgroundColor = d, g();
     }
-  }, [i]);
-  const h = () => {
-    if (!m && e.current)
-      switch (i) {
-        case "shimmer":
-          e.current.classList.add("skeleton-shimmer-animation");
-          const n = u.split(",").map(Number);
-          n && n.length >= 3 && (e.current.style.setProperty("--shimmer-color-r", n[0].toString()), e.current.style.setProperty("--shimmer-color-g", n[1].toString()), e.current.style.setProperty("--shimmer-color-b", n[2].toString()), e.current.style.setProperty("--shimmer-color-a", n[3].toString()));
-          break;
-        case "none":
-          e.current.style.animation = "none";
-          break;
-        case "border":
-          e.current.classList.add("skeleton-border-animation"), e.current.style.backgroundColor = "transparent";
-          const c = d.match(/\d+/g);
-          c && c.length >= 3 && (e.current.style.setProperty("--border-color-r", c[0]), e.current.style.setProperty("--border-color-g", c[1]), e.current.style.setProperty("--border-color-b", c[2]));
-          break;
-      }
-  }, k = {
+  }, [m, i, l, g]);
+  const k = {
     circle: "rounded-full aspect-square",
     square: "rounded-none",
     rounded: "rounded"
@@ -56,16 +57,16 @@ const v = (g) => {
     {
       ref: e,
       className: P(
-        b && " border-red-600/20 border",
-        y,
+        y && " border-red-600/20 border",
+        p,
         "skeleton-container",
-        k[f]
+        k[h]
       ),
-      children: p
+      children: f
     },
     `skeleton-${Math.random().toFixed(10)}`
   );
 };
 export {
-  v as Skeleton
+  A as Skeleton
 };

package/dist/Spinner.es.js

@@ -1,4 +1,4 @@
-import { j as e } from "./jsx-runtime-DKDX3adD.js";
+import { j as e } from "./jsx-runtime-ByW6EXIE.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-DKDX3adD.js";
+import { j as e } from "./jsx-runtime-ByW6EXIE.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-DKDX3adD.js";
+import { j as o } from "./jsx-runtime-ByW6EXIE.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 n } from "./jsx-runtime-DKDX3adD.js";
+import { j as n } from "./jsx-runtime-ByW6EXIE.js";
 import { c as r } from "./cn-B6yFEsav.js";
 import { useRef as p } from "react";
 import { motion as l } from "framer-motion";

package/dist/TabLinks.es.js

@@ -1,4 +1,4 @@
-import { j as a } from "./jsx-runtime-DKDX3adD.js";
+import { j as a } from "./jsx-runtime-ByW6EXIE.js";
 import { motion as x } from "framer-motion";
 import { memo as b } 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-DKDX3adD.js";
+import { j as r } from "./jsx-runtime-ByW6EXIE.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-DKDX3adD.js";
+import { j as y } from "./jsx-runtime-ByW6EXIE.js";
 import { c as C } from "./cn-B6yFEsav.js";
 import * as s from "react";
 function M({

package/dist/Tooltip.es.js

@@ -1,4 +1,4 @@
-import { j as e } from "./jsx-runtime-DKDX3adD.js";
+import { j as e } from "./jsx-runtime-ByW6EXIE.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/Image/GalleryPreview.d.ts

@@ -0,0 +1,8 @@
+import { ReactElement, default as React } from 'react';
+import { ImageProps } from './Image';
+interface GalleryPreviewProps {
+    images?: ReactElement<ImageProps>[];
+    className?: string;
+}
+declare const GalleryPreview: React.NamedExoticComponent<GalleryPreviewProps & React.RefAttributes<unknown>>;
+export default GalleryPreview;

package/dist/components/Image/Image.d.ts

@@ -0,0 +1,23 @@
+import { SpinnerProps } from '../Spinner/Spinner';
+import { ImageGalleryHandle } from './ImageGallery';
+export interface ImageProps {
+    src: string;
+    alt: string;
+    width?: number | string;
+    height?: number | string;
+    className?: string;
+    lazy?: boolean;
+    showLoader?: boolean;
+    loaderProps?: {
+        loaderType?: 'skeleton' | 'clasic';
+        variant?: SpinnerProps['variant'];
+        speedMultiplier?: SpinnerProps['speedMultiplier'];
+        className?: string;
+        size?: SpinnerProps['size'];
+        backdropClassName?: string;
+    };
+    allowPreview?: boolean;
+    galleryRef?: React.RefObject<ImageGalleryHandle | null>;
+}
+declare const CustomImage: import('react').MemoExoticComponent<(props: ImageProps) => import("react/jsx-runtime").JSX.Element>;
+export default CustomImage;

package/dist/components/Image/ImageGallery.d.ts

@@ -0,0 +1,18 @@
+import { ReactElement } from 'react';
+import { ImageProps } from './Image';
+export interface ImageGalleryProps {
+    children?: ReactElement<ImageProps> | ReactElement<ImageProps>[];
+    className?: string;
+    lightboxClassName?: string;
+    showThumbnails?: boolean;
+    thumbnailsClassName?: string;
+}
+export interface ImageGalleryHandle {
+    openLightbox: (index?: number) => void;
+    closeLightbox: () => void;
+    isOpen: boolean;
+    addImage: (image: ImageProps) => void;
+    images: ImageProps[];
+}
+declare const ImageGallery: import('react').ForwardRefExoticComponent<ImageGalleryProps & import('react').RefAttributes<ImageGalleryHandle>>;
+export default ImageGallery;

package/dist/components/Image/LightBox.d.ts

@@ -0,0 +1,14 @@
+import { ImageProps } from './Image';
+interface LightBoxProps {
+    images: ImageProps[];
+    lightboxClassName?: string;
+    closeLightbox: () => void;
+    showThumbnails?: boolean;
+    thumbnailsClassName?: string;
+    currentIndex: number;
+    goToNext: () => void;
+    goToPrevious: () => void;
+    goToIndex: (index: number) => void;
+}
+declare const LightBox: import('react').MemoExoticComponent<({ images, lightboxClassName, closeLightbox, showThumbnails, thumbnailsClassName, currentIndex, goToNext, goToPrevious, goToIndex }: LightBoxProps) => import("react/jsx-runtime").JSX.Element | null>;
+export default LightBox;

package/dist/components/Image/index.d.ts

@@ -0,0 +1,5 @@
+export { default as Image } from './Image';
+export { default as ImageGallery } from './ImageGallery';
+export { useImageGallery } from './useImageGallery';
+export type { ImageProps } from './Image';
+export type { ImageGalleryHandle } from './ImageGallery';

package/dist/components/Image/useImageGallery.d.ts

@@ -0,0 +1,10 @@
+import { ImageGalleryHandle } from './ImageGallery';
+import { ImageProps } from './Image';
+export declare const useImageGallery: () => {
+    isOpen: () => boolean;
+    openLightbox: () => void;
+    closeLightbox: () => void;
+    galleryRef: import('react').RefObject<ImageGalleryHandle | null>;
+    addImage: (image: ImageProps) => void;
+    images: () => ImageProps[];
+};

package/dist/exports/Image.d.ts

@@ -0,0 +1 @@
+export { default } from '../components/Image/Image';

package/dist/exports/ImageGallery.d.ts

@@ -0,0 +1 @@
+export { default } from '../components/Image/ImageGallery';

package/dist/index.d.ts

@@ -30,6 +30,8 @@ export { default as Tooltip } from './components/Tooltip/Tootip';
 export { default as Skeleton } from './components/Skeleton/Skeleton';
 export { default as SegmentedButton } from './components/SegmentedButton/SegmentedButton';
 export { default as LayoutGeneric } from './components/Layout/LayoutGeneric';
+export { default as ImageGallery } from './components/Image/ImageGallery';
+export { default as Image } from './components/Image/Image';
 export * from './components/Sidebar';
 export { SecondaryBar } from './components/Sidebar/SecondaryBar/SecondaryBar';
 export { Badge } from './components/Sidebar/components/badge';
@@ -81,4 +83,6 @@ export type { SwitchProps } from './components/Switch/Switch';
 export type { SkeletonProps } from './components/Skeleton/Skeleton';
 export type { SegmentedButtonProps } from './components/SegmentedButton/SegmentedButton';
 export type { DatePickerProps } from './components/DatePicker/DatePicker';
+export type { ImageProps } from './components/Image/Image';
+export type { ImageGalleryProps } from './components/Image/ImageGallery';
 export { Icons } from './Icons/Icons';