prometeo-design-system 1.5.5 → 1.5.7

package/dist/Input.es.js

@@ -0,0 +1,200 @@
+import { j as s } from "./jsx-runtime-ByW6EXIE.js";
+import { Icons as B } from "./Icons.es.js";
+import { c as e } from "./cn-B6yFEsav.js";
+import { memo as q, useState as v, useCallback as M, useEffect as F } from "react";
+import { useDebounce as ee } from "use-debounce";
+import te from "./Spinner.es.js";
+const x = {
+  default: {
+    container: "",
+    input: e(
+      "border-neutral-default-default text-neutral-default-default",
+      "focus:border-primary-default-default focus:border-2",
+      "hover:border-neutral-strong-default"
+    ),
+    label: e(
+      "text-neutral-medium-default",
+      "peer-focus:text-primary-default-default"
+    ),
+    icon: e(
+      "text-neutral-medium-default",
+      "peer-focus:text-primary-default-default"
+    )
+  },
+  error: {
+    container: "",
+    input: e(
+      "border-error-default-default text-neutral-default-default",
+      "focus:border-error-default focus:border-2",
+      "focus:ring-0 focus:ring-error-default/20"
+    ),
+    label: e(
+      "text-error-light",
+      "peer-focus:text-error-light"
+    ),
+    icon: e(
+      "text-error-light",
+      "peer-focus:text-error-light"
+    )
+  },
+  success: {
+    container: "",
+    input: e(
+      "border-success-default-default text-neutral-default-default",
+      "focus:border-success-default focus:border-2",
+      "focus:ring-0 focus:ring-success-default/20"
+    ),
+    label: e(
+      "text-success",
+      "peer-focus:text-success-light"
+    ),
+    icon: e(
+      "text-success-light",
+      "peer-focus:text-success-light"
+    )
+  }
+}, f = {
+  small: {
+    container: "text-sm",
+    input: "h-10 px-3 text-sm",
+    label: "text-xs peer-focus:text-xs peer-placeholder-shown:text-sm",
+    icon: "w-4 h-4 right-3"
+  },
+  medium: {
+    container: "text-base",
+    input: "h-12 px-3 text-base",
+    label: "text-sm peer-focus:text-sm peer-placeholder-shown:text-base",
+    icon: "w-5 h-5 right-3"
+  },
+  large: {
+    container: "text-lg",
+    input: "h-14 px-3 text-lg",
+    label: "text-sm peer-focus:text-sm peer-placeholder-shown:text-lg",
+    icon: "w-6 h-6 right-3"
+  }
+}, se = ({
+  label: I,
+  icon: m,
+  onChange: h,
+  value: l = "",
+  debounceMs: a = 0,
+  name: b,
+  width: d = "100%",
+  height: t,
+  variant: n = "default",
+  labelVariant: o = "default",
+  size: u = "medium",
+  disabled: N = !1,
+  type: r = "text",
+  isFetching: c,
+  errorComponent: P,
+  helperComponent: C,
+  required: E = !1,
+  onFocus: H,
+  onBlur: L,
+  onEmptied: S,
+  onKeyDown: O,
+  onKeyUp: $
+}) => {
+  const [p, k] = v(l), [g] = ee(p, a), [R, D] = v(!1), [w, W] = v(!1), V = M(h, [h]);
+  F(() => {
+    a > 0 && g !== l && V(g);
+  }, [g, a, V, l]), F(() => {
+    k(l);
+  }, [l]);
+  const A = () => {
+    D(!0), H?.();
+  }, G = () => {
+    D(!1), L?.();
+  }, J = (i) => {
+    const y = i.target.value, _ = p;
+    k(y), _.length > 0 && y.length === 0 && S?.(), (!a || a === 0) && h(y);
+  }, K = () => {
+    W(!w);
+  }, j = {};
+  d && d !== "100%" && (j.width = d), t && (j.height = t);
+  const Q = p.length > 0, z = n === "error" && P, T = !z && C, U = () => o === "static" || R || Q ? "-top-2 left-2 scale-90" : "top-1/2 -translate-y-1/2 scale-100", X = () => o === "static" ? t ? "text-sm" : "text-xs" : t ? "text-sm" : f[u].label, Y = () => t ? { height: t } : {}, Z = () => o === "static" ? I : "";
+  return /* @__PURE__ */ s.jsxs(s.Fragment, { children: [
+    /* @__PURE__ */ s.jsxs(
+      "div",
+      {
+        className: e(
+          "relative",
+          f[u].container,
+          !d && "w-full",
+          "bg-inherit",
+          o === "static" && "mt-2"
+        ),
+        style: j,
+        children: [
+          /* @__PURE__ */ s.jsx(
+            "input",
+            {
+              id: b,
+              name: b,
+              type: r === "password" && w ? "text" : r,
+              value: p,
+              placeholder: Z(),
+              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",
+                o === "default" && "placeholder:text-transparent",
+                o === "static" && "placeholder:text-neutral-medium-default placeholder:opacity-50",
+                !t && f[u].input,
+                t && `px-3 ${f[u].input.split(" ").filter((i) => i.startsWith("text-")).join(" ")}`,
+                x[n].input,
+                m && "pr-10",
+                N && "bg-neutral-weak-default cursor-not-allowed opacity-60",
+                x[n].container
+              ),
+              style: Y(),
+              onChange: J,
+              onFocus: A,
+              onBlur: G,
+              disabled: N,
+              required: E,
+              onEmptied: S,
+              onKeyDown: O,
+              onKeyUp: $
+            }
+          ),
+          /* @__PURE__ */ s.jsx(
+            "label",
+            {
+              htmlFor: b,
+              className: e(
+                "absolute left-3 pointer-events-none bg-inherit px-1 z-10",
+                o === "default" && "transition-all duration-200 ease-in-out",
+                X(),
+                x[n].label,
+                U(),
+                E && "after:content-['*'] after:text-error-default after:ml-1"
+              ),
+              children: I
+            }
+          ),
+          (m || r === "password" || c) && /* @__PURE__ */ s.jsx(
+            "div",
+            {
+              className: e(
+                "absolute top-1/2 -translate-y-1/2 flex items-center justify-center z-10",
+                !t && f[u].icon,
+                t && "w-5 h-5 right-3",
+                x[n].icon,
+                r === "password" && !c ? "cursor-pointer" : "pointer-events-none"
+              ),
+              onClick: r === "password" && !c ? K : void 0,
+              onMouseDown: (i) => r === "password" && !c && i.preventDefault(),
+              children: /* @__PURE__ */ s.jsx("div", { children: c && r !== "password" ? /* @__PURE__ */ s.jsx("div", { children: /* @__PURE__ */ s.jsx(te, { size: 24, color: "#7c86ff", loading: !0, variant: "clip" }) }) : r === "password" ? w ? /* @__PURE__ */ s.jsx(B.EyeVisibility, { size: 24, className: "" }) : /* @__PURE__ */ s.jsx(B.EyeVisibilityOff, { size: 24, className: "" }) : m })
+            }
+          )
+        ]
+      }
+    ),
+    T && C,
+    z && P
+  ] });
+}, ce = q(se);
+export {
+  ce as default
+};

package/dist/InputFormik.d.ts

@@ -0,0 +1,6 @@
+export * from './exports/InputFormik'
+export {}
+import PrometeoDesignSystem from './exports/InputFormik'
+export default PrometeoDesignSystem
+export * from './exports/InputFormik'
+export {}

package/dist/InputFormik.es.js

@@ -0,0 +1,95 @@
+import { j as t } from "./jsx-runtime-ByW6EXIE.js";
+import { c as n } from "./cn-B6yFEsav.js";
+import { useField as V, ErrorMessage as k } from "formik";
+import { useState as p } from "react";
+import { Icons as b } from "./Icons.es.js";
+const D = ({
+  icon: a,
+  iconPosition: l = "left",
+  label: g,
+  className: y,
+  containerClassName: v,
+  id: i,
+  type: f = "text",
+  disabled: m = !1,
+  ...e
+}) => {
+  const [r, c] = V(e), [s, x] = p(!1), [u, w] = p(!1), o = c.touched && c.error, h = r.value && r.value.toString().length > 0, d = f === "password", j = d ? u ? "text" : "password" : f, N = () => s || h ? "-top-3 left-2 scale-90" : "top-1/2 -translate-y-1/2 scale-100", E = () => d ? a ? l === "left" ? "pl-10 pr-10" : "pr-16" : "pr-10" : a ? l === "left" ? "pl-10" : "pr-10" : "", F = () => a && l === "left" ? "left-10" : "left-3", I = () => {
+    w(!u);
+  };
+  return /* @__PURE__ */ t.jsxs("div", { className: n("relative w-full bg-inherit", v), children: [
+    /* @__PURE__ */ t.jsxs("div", { className: "relative bg-inherit", children: [
+      /* @__PURE__ */ t.jsx(
+        "input",
+        {
+          disabled: m,
+          id: i || e.name,
+          type: j,
+          name: r.name,
+          value: r.value || "",
+          onChange: r.onChange,
+          onFocus: () => {
+            x(!0), e.onFocus?.();
+          },
+          onEmptied: e.onEmptied,
+          onKeyDown: e.onKeyDown,
+          onKeyUp: e.onKeyUp,
+          onBlur: (K) => {
+            x(!1), e.onBlur?.(), r.onBlur(K);
+          },
+          className: n(
+            "w-full px-3 h-12 text-left border-1 rounded-lg transition-all duration-200 ease-in-out text-neutral-default-default",
+            "bg-transparent focus:outline-none",
+            s ? "border-primary-default-default border-2" : o ? "border-error-default-default" : "border-neutral-default-default hover:border-neutral-strong-default",
+            E(),
+            y
+          )
+        }
+      ),
+      /* @__PURE__ */ t.jsx(
+        "label",
+        {
+          htmlFor: i || e.name,
+          className: n(
+            "absolute transition-all duration-200 ease-in-out pointer-events-none bg-inherit px-1 z-10",
+            "text-md",
+            N(),
+            h || s ? "text-primary-default-default" : o ? "text-red-500" : "text-neutral-medium-default",
+            F()
+          ),
+          children: g
+        }
+      ),
+      a && /* @__PURE__ */ t.jsx("div", { className: n(
+        "absolute top-1/2 -translate-y-1/2 text-neutral-medium-default",
+        l === "left" ? "left-3" : "right-3"
+      ), children: a }),
+      d && /* @__PURE__ */ t.jsx(
+        "button",
+        {
+          type: "button",
+          onClick: I,
+          className: n(
+            "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",
+            a && l === "right" ? "right-8" : "right-3"
+          ),
+          tabIndex: -1,
+          disabled: m,
+          children: u ? /* @__PURE__ */ t.jsx(b.EyeVisibilityOff, { size: 24, className: "text-neutral-default-default" }) : /* @__PURE__ */ t.jsx(b.EyeVisibility, { size: 24, className: "text-neutral-default-default" })
+        }
+      )
+    ] }),
+    o && /* @__PURE__ */ t.jsx(
+      k,
+      {
+        name: e.name,
+        component: "span",
+        className: "block text-error-default-default text-xs mt-1"
+      }
+    )
+  ] });
+};
+export {
+  D as default
+};

package/dist/LayoutGeneric-jDE96L2N.js

@@ -0,0 +1,24 @@
+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) => {
+    n.current && r && (r.current = n.current);
+  };
+  return /* @__PURE__ */ t.jsx(o.Provider, { value: { primarySidebarRef: r, registerPrimarySidebar: s }, children: e });
+}, f = () => {
+  const e = u(o);
+  if (!e)
+    throw new Error("useSidebarContext must be used within a SidebarProvider");
+  return e;
+}, d = ({
+  children: e,
+  sidebar: r
+}) => /* @__PURE__ */ t.jsxs("div", { className: "flex h-screen w-full bg-neutral-default-default", children: [
+  /* @__PURE__ */ t.jsx(l, { children: r }),
+  /* @__PURE__ */ t.jsx("main", { className: "w-full h-full overflow-y-auto", children: e })
+] }), b = c(d);
+export {
+  b as L,
+  l as S,
+  f as u
+};

package/dist/LayoutGeneric.d.ts

@@ -0,0 +1,6 @@
+export * from './exports/LayoutGeneric'
+export {}
+import PrometeoDesignSystem from './exports/LayoutGeneric'
+export default PrometeoDesignSystem
+export * from './exports/LayoutGeneric'
+export {}

package/dist/LayoutGeneric.es.js

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

package/dist/Logo.d.ts

@@ -0,0 +1,4 @@
+export {}
+import PrometeoDesignSystem from './exports/Logo'
+export default PrometeoDesignSystem
+export {}

package/dist/Logo.es.js

@@ -0,0 +1,9 @@
+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" }),
+  /* @__PURE__ */ e.jsx("span", { className: "font-bold text-[28px] text-primary-medium-pressed font-monserra -tracking-wide text-logo", children: "TICKETS" })
+] });
+export {
+  s as default
+};

package/dist/Menu.d.ts

@@ -0,0 +1,2 @@
+export * from './exports/Menu'
+export {}

package/dist/Menu.es.js

@@ -0,0 +1,76 @@
+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(
+  o.div,
+  {
+    initial: { height: 0, opacity: 0 },
+    animate: {
+      height: "auto",
+      opacity: 1,
+      transition: {
+        height: { duration: 0.6, ease: "easeOut" },
+        opacity: { duration: 0.4, delay: 0.2 }
+      }
+    },
+    exit: {
+      height: 0,
+      opacity: 0,
+      transition: {
+        height: {
+          duration: 0.8,
+          delay: 0.2,
+          ease: "easeIn"
+        },
+        opacity: { duration: 0.3, delay: 0.1 }
+      }
+    },
+    className: "overflow-hidden flex flex-col justify-between  items-center w-full",
+    children: a
+  }
+) }) }), l = () => /* @__PURE__ */ e.jsx(
+  o.div,
+  {
+    className: "flex justify-center items-center w-full ",
+    exit: {
+      opacity: 0,
+      scaleX: 0,
+      height: 0,
+      transition: {
+        duration: 0.4,
+        delay: 0.15,
+        ease: "easeInOut"
+      }
+    },
+    children: /* @__PURE__ */ e.jsx("div", { className: "border-b border-neutral-strong-default border-1 w-full" })
+  }
+), d = ({ onClick: t, children: a, className: i }) => /* @__PURE__ */ e.jsx(
+  o.button,
+  {
+    onClick: t,
+    className: r("flex py-2 w-full px-2 gap-1 rounded-md cursor-pointer mt-2 items-center overflow-hidden focus:outline-none hover:bg-neutral-medium-selected button-profile", i),
+    exit: {
+      opacity: 0,
+      y: -8,
+      scale: 0.96,
+      transition: {
+        duration: 0.5,
+        delay: 0,
+        ease: "easeInOut"
+      }
+    },
+    whileHover: {
+      opacity: 1,
+      scale: [1, 1.02, 1],
+      transition: { duration: 0.2 }
+    },
+    whileTap: { scale: 0.98 },
+    children: a
+  }
+), f = Object.assign(s, {
+  Divider: l,
+  Items: d
+});
+export {
+  f as Menu
+};

package/dist/OtpInput.d.ts

@@ -0,0 +1,6 @@
+export * from './exports/OtpInput'
+export {}
+import PrometeoDesignSystem from './exports/OtpInput'
+export default PrometeoDesignSystem
+export * from './exports/OtpInput'
+export {}