prometeo-design-system 1.5.5 → 1.5.7
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/Avatar.d.ts +4 -0
- package/dist/Avatar.es.js +52 -0
- package/dist/Button.d.ts +6 -0
- package/dist/Button.es.js +147 -0
- package/dist/CardProfile-BZajBGbO.js +253 -0
- package/dist/CardProfile.d.ts +2 -0
- package/dist/CardProfile.es.js +4 -0
- package/dist/CheckBox.d.ts +6 -0
- package/dist/CheckBox.es.js +105 -0
- package/dist/CheckboxFormik.d.ts +6 -0
- package/dist/CheckboxFormik.es.js +88 -0
- package/dist/DialogModal.d.ts +6 -0
- package/dist/DialogModal.es.js +52 -0
- package/dist/DrawerDesktop.d.ts +6 -0
- package/dist/DrawerDesktop.es.js +67 -0
- package/dist/DrawerMobile.d.ts +6 -0
- package/dist/DrawerMobile.es.js +43 -0
- package/dist/DropZone.d.ts +2 -0
- package/dist/DropZone.es.js +86 -0
- package/dist/Header.d.ts +6 -0
- package/dist/Header.es.js +23 -0
- package/dist/Icons.d.ts +2 -0
- package/dist/Icons.es.js +516 -0
- package/dist/Input.d.ts +6 -0
- package/dist/Input.es.js +200 -0
- package/dist/InputFormik.d.ts +6 -0
- package/dist/InputFormik.es.js +95 -0
- package/dist/LayoutGeneric-jDE96L2N.js +24 -0
- package/dist/LayoutGeneric.d.ts +6 -0
- package/dist/LayoutGeneric.es.js +4 -0
- package/dist/Logo.d.ts +4 -0
- package/dist/Logo.es.js +9 -0
- package/dist/Menu.d.ts +2 -0
- package/dist/Menu.es.js +76 -0
- package/dist/OtpInput.d.ts +6 -0
- package/dist/OtpInput.es.js +244 -0
- package/dist/Pagination.d.ts +6 -0
- package/dist/Pagination.es.js +97 -0
- package/dist/ProgressBar.d.ts +6 -0
- package/dist/ProgressBar.es.js +27 -0
- package/dist/Select.d.ts +6 -0
- package/dist/Select.es.js +203 -0
- package/dist/Spinner.d.ts +6 -0
- package/dist/Spinner.es.js +52 -0
- package/dist/SwipeContainer.d.ts +4 -0
- package/dist/SwipeContainer.es.js +185 -0
- package/dist/TabLinks.d.ts +4 -0
- package/dist/TabLinks.es.js +83 -0
- package/dist/Table.d.ts +2 -0
- package/dist/Table.es.js +121 -0
- package/dist/TextArea.d.ts +4 -0
- package/dist/TextArea.es.js +52 -0
- package/dist/Tooltip.d.ts +6 -0
- package/dist/Tooltip.es.js +62 -0
- package/dist/cn-B6yFEsav.js +8 -0
- package/dist/components/Avatar/index.d.ts +1 -0
- package/dist/components/Button/index.d.ts +2 -0
- package/dist/exports/Avatar.d.ts +1 -0
- package/dist/exports/Button.d.ts +2 -0
- package/dist/exports/CardProfile.d.ts +2 -0
- package/dist/exports/CheckBox.d.ts +2 -0
- package/dist/exports/CheckboxFormik.d.ts +2 -0
- package/dist/exports/DialogModal.d.ts +2 -0
- package/dist/exports/DrawerDesktop.d.ts +2 -0
- package/dist/exports/DrawerMobile.d.ts +2 -0
- package/dist/exports/DropZone.d.ts +1 -0
- package/dist/exports/Header.d.ts +2 -0
- package/dist/exports/Icons.d.ts +1 -0
- package/dist/exports/Input.d.ts +2 -0
- package/dist/exports/InputFormik.d.ts +2 -0
- package/dist/exports/LayoutGeneric.d.ts +2 -0
- package/dist/exports/Logo.d.ts +1 -0
- package/dist/exports/Menu.d.ts +2 -0
- package/dist/exports/OtpInput.d.ts +2 -0
- package/dist/exports/Pagination.d.ts +2 -0
- package/dist/exports/ProgressBar.d.ts +2 -0
- package/dist/exports/Select.d.ts +2 -0
- package/dist/exports/Spinner.d.ts +2 -0
- package/dist/exports/SwipeContainer.d.ts +1 -0
- package/dist/exports/TabLinks.d.ts +1 -0
- package/dist/exports/Table.d.ts +1 -0
- package/dist/exports/TextArea.d.ts +1 -0
- package/dist/exports/Tooltip.d.ts +2 -0
- package/dist/index-BOQuZ0gG.js +34 -0
- package/dist/jsx-runtime-ByW6EXIE.js +283 -0
- package/dist/prometeo-design-system.css +1 -1
- package/dist/prometeo-design-system.es.js +289 -5353
- package/package.json +120 -2
- package/dist/prometeo-design-system.umd.js +0 -113
package/dist/Avatar.d.ts
ADDED
|
@@ -0,0 +1,52 @@
|
|
|
1
|
+
import { j as t } from "./jsx-runtime-ByW6EXIE.js";
|
|
2
|
+
import { c as p } from "./cn-B6yFEsav.js";
|
|
3
|
+
import { motion as f } from "framer-motion";
|
|
4
|
+
import { useState as u } from "react";
|
|
5
|
+
function C({
|
|
6
|
+
urlImage: s,
|
|
7
|
+
sizeImage: a = "md",
|
|
8
|
+
sizeFallback: e = "md",
|
|
9
|
+
fallbackText: i = "Matias tejerina"
|
|
10
|
+
}) {
|
|
11
|
+
const [o, l] = u(!1), n = s && s.trim() !== "" && !o, x = (m) => m.split(" ").map((d) => d.charAt(0)).join("").toUpperCase().slice(0, 2), r = {
|
|
12
|
+
xxs: "w-8.5 h-8.5",
|
|
13
|
+
xs: "w-10 h-10",
|
|
14
|
+
sm: "w-16 h-16",
|
|
15
|
+
md: "w-24 h-24",
|
|
16
|
+
lg: "w-32 h-32",
|
|
17
|
+
xl: "w-40 h-40"
|
|
18
|
+
}, c = {
|
|
19
|
+
xxs: "text-xs",
|
|
20
|
+
xs: "text-sm",
|
|
21
|
+
sm: "text-lg",
|
|
22
|
+
md: "text-2xl",
|
|
23
|
+
lg: "text-3xl",
|
|
24
|
+
xl: "text-4xl"
|
|
25
|
+
};
|
|
26
|
+
return /* @__PURE__ */ t.jsx(t.Fragment, { children: n ? /* @__PURE__ */ t.jsx(
|
|
27
|
+
"img",
|
|
28
|
+
{
|
|
29
|
+
onError: () => {
|
|
30
|
+
l(!0);
|
|
31
|
+
},
|
|
32
|
+
src: s,
|
|
33
|
+
className: `rounded-full object-cover ${r[a]}`,
|
|
34
|
+
alt: "Profile"
|
|
35
|
+
}
|
|
36
|
+
) : /* @__PURE__ */ t.jsx(
|
|
37
|
+
f.div,
|
|
38
|
+
{
|
|
39
|
+
className: ` flex items-center justify-center rounded-full aspect-square ${r[e]}`,
|
|
40
|
+
style: { backgroundColor: "#C6D2FF" },
|
|
41
|
+
initial: { opacity: 0, scale: 1.1 },
|
|
42
|
+
animate: { opacity: 1, scale: 1 },
|
|
43
|
+
exit: { opacity: 0, scale: 0.9 },
|
|
44
|
+
transition: { duration: 0.3 },
|
|
45
|
+
children: /* @__PURE__ */ t.jsx("span", { className: p("text-[#312C85] font-semibold", c[e]), children: x(i) })
|
|
46
|
+
},
|
|
47
|
+
"initials"
|
|
48
|
+
) });
|
|
49
|
+
}
|
|
50
|
+
export {
|
|
51
|
+
C as default
|
|
52
|
+
};
|
package/dist/Button.d.ts
ADDED
|
@@ -0,0 +1,147 @@
|
|
|
1
|
+
import { j as t } from "./jsx-runtime-ByW6EXIE.js";
|
|
2
|
+
import { c as n } from "./cn-B6yFEsav.js";
|
|
3
|
+
import { c as S } from "./index-BOQuZ0gG.js";
|
|
4
|
+
import { useAnimationControls as C, motion as m } from "framer-motion";
|
|
5
|
+
const N = S(
|
|
6
|
+
"flex items-center justify-center cursor-pointer focus:outline-none font-semibold rounded-md transition-colors",
|
|
7
|
+
{
|
|
8
|
+
variants: {
|
|
9
|
+
variant: {
|
|
10
|
+
filled: "",
|
|
11
|
+
outline: "bg-transparent border-1",
|
|
12
|
+
text: "bg-transparent border-0"
|
|
13
|
+
},
|
|
14
|
+
color: {
|
|
15
|
+
primary: "",
|
|
16
|
+
secondary: ""
|
|
17
|
+
},
|
|
18
|
+
size: {
|
|
19
|
+
small: "h-[40px] w-[123px] w-fit px-2 py-3 text-sm",
|
|
20
|
+
medium: "h-[48px] w-[134px] w-fit px-2 py-3 text-base",
|
|
21
|
+
large: "h-[56px] w-[145px] w-fit px-4 py-3 text-base"
|
|
22
|
+
},
|
|
23
|
+
disabled: {
|
|
24
|
+
true: "opacity-50 cursor-not-allowed",
|
|
25
|
+
false: ""
|
|
26
|
+
},
|
|
27
|
+
loading: {
|
|
28
|
+
true: "cursor-wait",
|
|
29
|
+
false: ""
|
|
30
|
+
},
|
|
31
|
+
customSize: {
|
|
32
|
+
true: "px-4 py-2",
|
|
33
|
+
false: ""
|
|
34
|
+
}
|
|
35
|
+
},
|
|
36
|
+
compoundVariants: [
|
|
37
|
+
{
|
|
38
|
+
variant: "filled",
|
|
39
|
+
color: "primary",
|
|
40
|
+
class: "bg-primary-default-default text-neutral-strong-default border-0 hover:bg-primary-default-hover hover:text-neutral-strong-hover focus:bg-primary-default-pressed focus:text-neutral-strong-focused active:bg-primary-pressed active:text-neutral-strong-pressed disabled:bg-primary-medium-disabled disabled:text-neutral-strong-disabled"
|
|
41
|
+
},
|
|
42
|
+
{
|
|
43
|
+
variant: "filled",
|
|
44
|
+
color: "secondary",
|
|
45
|
+
class: "bg-neutral-strong-medium-default text-neutral-strong-default hover:bg-neutral-medium-hover hover:text-neutral-strong-hover focus:bg-neutral-medium-pressed focus:text-neutral-strong-pressed active:bg-neutral-medium-pressed disabled:bg-primary-default-disabled disabled:text-neutral-strong-disabled"
|
|
46
|
+
},
|
|
47
|
+
{
|
|
48
|
+
variant: "outline",
|
|
49
|
+
color: "primary",
|
|
50
|
+
class: "text-primary-medium-default border-primary-medium-default hover:bg-neutral-default-hover hover:text-primary-medium-hover hover:border-primary-medium-hover focus:bg-neutral-default-pressed focus:text-primary-medium-pressed focus:border-primary-medium-pressed active:bg-neutral-default-pressed active:text-primary-medium-pressed active:border-primary-medium-pressed disabled:border-primary-disabled disabled:text-primary-disabled"
|
|
51
|
+
},
|
|
52
|
+
{
|
|
53
|
+
variant: "outline",
|
|
54
|
+
color: "secondary",
|
|
55
|
+
class: "text-neutral-strong-default border-neutral-strong-default hover:bg-neutral-default-hover hover:text-neutral-strong-hover hover:border-neutral-strong-hover focus:bg-neutral-default-pressed focus:text-neutral-strong-pressed focus:border-neutral-strong-pressed active:bg-neutral-default-pressed active:text-neutral-strong-pressed active:border-neutral-strong-pressed disabled:border-neutral-disabled disabled:text-neutral-disabled"
|
|
56
|
+
},
|
|
57
|
+
{
|
|
58
|
+
variant: "text",
|
|
59
|
+
color: "primary",
|
|
60
|
+
class: "text-primary-medium-default hover:bg-neutral-default-hover hover:text-primary-medium-hover focus:bg-neutral-default-pressed focus:text-primary-medium-pressed active:bg-neutral-default-pressed active:text-primary-medium-pressed disabled:text-primary-medium-disabled"
|
|
61
|
+
},
|
|
62
|
+
{
|
|
63
|
+
variant: "text",
|
|
64
|
+
color: "secondary",
|
|
65
|
+
class: "text-neutral-strong-default hover:bg-neutral-default-hover hover:text-primary-default-hover focus:bg-neutral-default-pressed focus:text-primary-medium-pressed active:bg-neutral-default-pressed active:text-primary-medium-pressed disabled:text-primary-medium-disabled"
|
|
66
|
+
}
|
|
67
|
+
],
|
|
68
|
+
defaultVariants: {
|
|
69
|
+
variant: "filled",
|
|
70
|
+
color: "primary",
|
|
71
|
+
size: "medium",
|
|
72
|
+
disabled: !1,
|
|
73
|
+
loading: !1,
|
|
74
|
+
customSize: !1
|
|
75
|
+
}
|
|
76
|
+
}
|
|
77
|
+
);
|
|
78
|
+
function B({
|
|
79
|
+
label: o = "Selene",
|
|
80
|
+
onClick: p,
|
|
81
|
+
icon: l,
|
|
82
|
+
contentClassName: c,
|
|
83
|
+
loadingText: f = "Cargando...",
|
|
84
|
+
animate: a = !0,
|
|
85
|
+
animateIcon: s = !0,
|
|
86
|
+
isLoading: e = !1,
|
|
87
|
+
disabled: r = !1,
|
|
88
|
+
type: b = "button",
|
|
89
|
+
variant: v = "filled",
|
|
90
|
+
color: x = "primary",
|
|
91
|
+
size: i = "medium",
|
|
92
|
+
children: u,
|
|
93
|
+
Spinner: g,
|
|
94
|
+
className: y,
|
|
95
|
+
...h
|
|
96
|
+
}) {
|
|
97
|
+
const d = C(), w = () => {
|
|
98
|
+
!a || r || e || !s || d.start({ rotate: 90 });
|
|
99
|
+
}, j = () => {
|
|
100
|
+
!a || r || e || !s || d.start({ rotate: 0 });
|
|
101
|
+
}, H = n(
|
|
102
|
+
N({
|
|
103
|
+
variant: v,
|
|
104
|
+
color: x,
|
|
105
|
+
size: i,
|
|
106
|
+
disabled: r || e,
|
|
107
|
+
loading: e
|
|
108
|
+
}),
|
|
109
|
+
y
|
|
110
|
+
);
|
|
111
|
+
return /* @__PURE__ */ t.jsx(
|
|
112
|
+
m.button,
|
|
113
|
+
{
|
|
114
|
+
onClick: p,
|
|
115
|
+
className: H,
|
|
116
|
+
whileHover: a && !r && !e ? { scale: 1.05 } : {},
|
|
117
|
+
whileTap: a && !r && !e ? { scale: 0.98 } : {},
|
|
118
|
+
transition: { type: "spring", stiffness: 400, damping: 17 },
|
|
119
|
+
onHoverStart: w,
|
|
120
|
+
onHoverEnd: j,
|
|
121
|
+
disabled: r || e,
|
|
122
|
+
type: b,
|
|
123
|
+
...h,
|
|
124
|
+
children: e ? /* @__PURE__ */ t.jsxs("div", { className: "flex items-center gap-2", children: [
|
|
125
|
+
g,
|
|
126
|
+
i !== "small" && /* @__PURE__ */ t.jsx("span", { children: f })
|
|
127
|
+
] }) : u || /* @__PURE__ */ t.jsxs("span", { className: n("flex items-center gap-2", c), children: [
|
|
128
|
+
l && /* @__PURE__ */ t.jsx(
|
|
129
|
+
m.div,
|
|
130
|
+
{
|
|
131
|
+
animate: s ? d : void 0,
|
|
132
|
+
transition: {
|
|
133
|
+
type: "spring",
|
|
134
|
+
stiffness: 400,
|
|
135
|
+
damping: 17
|
|
136
|
+
},
|
|
137
|
+
children: l
|
|
138
|
+
}
|
|
139
|
+
),
|
|
140
|
+
o && /* @__PURE__ */ t.jsx("span", { children: o })
|
|
141
|
+
] })
|
|
142
|
+
}
|
|
143
|
+
);
|
|
144
|
+
}
|
|
145
|
+
export {
|
|
146
|
+
B as default
|
|
147
|
+
};
|
|
@@ -0,0 +1,253 @@
|
|
|
1
|
+
import { j as e } from "./jsx-runtime-ByW6EXIE.js";
|
|
2
|
+
import { c as l } from "./cn-B6yFEsav.js";
|
|
3
|
+
import { motion as i, AnimatePresence as u } from "framer-motion";
|
|
4
|
+
import m from "./Avatar.es.js";
|
|
5
|
+
import { Icons as o } from "./Icons.es.js";
|
|
6
|
+
function f({ sessions: t, handleTokenLogin: a }) {
|
|
7
|
+
return /* @__PURE__ */ e.jsx("div", { className: "profile-options-container w-full ", children: t?.map((r) => /* @__PURE__ */ e.jsx("button", { className: "w-full ", onClick: () => a?.(r.token), children: /* @__PURE__ */ e.jsx(s, { children: /* @__PURE__ */ e.jsx(
|
|
8
|
+
s.Content,
|
|
9
|
+
{
|
|
10
|
+
onClick: () => {
|
|
11
|
+
console.log("hola");
|
|
12
|
+
},
|
|
13
|
+
isExpanded: !1,
|
|
14
|
+
name: r.name,
|
|
15
|
+
nameArea: r?.area?.name,
|
|
16
|
+
nameCompany: r.company_id.name,
|
|
17
|
+
cardProfile: /* @__PURE__ */ e.jsx(s.Image, { isExpanded: !1 })
|
|
18
|
+
}
|
|
19
|
+
) }) }, r._id)) });
|
|
20
|
+
}
|
|
21
|
+
const x = ({ children: t }) => /* @__PURE__ */ e.jsx("div", { className: "profile-container flex rounded-md text-white-prometeo overflow-hidden flex-shrink-0 w-full min-w-0 ", children: t }), h = ({ isExpanded: t, sessions: a, onClickLogout: r, handleTokenLogin: n }) => /* @__PURE__ */ e.jsx(u, { mode: "wait", children: t && /* @__PURE__ */ e.jsxs(
|
|
22
|
+
i.div,
|
|
23
|
+
{
|
|
24
|
+
initial: { height: 0, opacity: 0 },
|
|
25
|
+
animate: {
|
|
26
|
+
height: "auto",
|
|
27
|
+
opacity: 1,
|
|
28
|
+
transition: {
|
|
29
|
+
height: { duration: 0.6, ease: "easeOut" },
|
|
30
|
+
opacity: { duration: 0.4, delay: 0.2 }
|
|
31
|
+
}
|
|
32
|
+
},
|
|
33
|
+
exit: {
|
|
34
|
+
height: 0,
|
|
35
|
+
opacity: 0,
|
|
36
|
+
transition: {
|
|
37
|
+
height: {
|
|
38
|
+
duration: 0.8,
|
|
39
|
+
delay: 0.2,
|
|
40
|
+
ease: "easeIn"
|
|
41
|
+
},
|
|
42
|
+
opacity: { duration: 0.3, delay: 0.1 }
|
|
43
|
+
}
|
|
44
|
+
},
|
|
45
|
+
className: "overflow-hidden",
|
|
46
|
+
children: [
|
|
47
|
+
/* @__PURE__ */ e.jsx(
|
|
48
|
+
i.div,
|
|
49
|
+
{
|
|
50
|
+
className: "flex justify-center items-center w-full mt-4",
|
|
51
|
+
exit: {
|
|
52
|
+
opacity: 0,
|
|
53
|
+
scaleX: 0,
|
|
54
|
+
height: 0,
|
|
55
|
+
transition: {
|
|
56
|
+
duration: 0.4,
|
|
57
|
+
delay: 0.5,
|
|
58
|
+
ease: "easeInOut"
|
|
59
|
+
}
|
|
60
|
+
},
|
|
61
|
+
children: /* @__PURE__ */ e.jsx("div", { className: "border-b border-neutral-strong-default border-1 w-full" })
|
|
62
|
+
}
|
|
63
|
+
),
|
|
64
|
+
a && a.length > 0 && /* @__PURE__ */ e.jsxs(e.Fragment, { children: [
|
|
65
|
+
/* @__PURE__ */ e.jsx(
|
|
66
|
+
i.div,
|
|
67
|
+
{
|
|
68
|
+
className: "mt-4",
|
|
69
|
+
exit: {
|
|
70
|
+
opacity: 0,
|
|
71
|
+
y: -5,
|
|
72
|
+
height: 0,
|
|
73
|
+
transition: {
|
|
74
|
+
duration: 0.4,
|
|
75
|
+
delay: 0.4,
|
|
76
|
+
ease: "easeInOut"
|
|
77
|
+
}
|
|
78
|
+
},
|
|
79
|
+
children: /* @__PURE__ */ e.jsx("span", { className: "text-neutral-medium-default font-semibold text-xs", children: "Cambiar cuenta" })
|
|
80
|
+
}
|
|
81
|
+
),
|
|
82
|
+
/* @__PURE__ */ e.jsx(
|
|
83
|
+
i.div,
|
|
84
|
+
{
|
|
85
|
+
className: "mt-4 overflow-hidden w-full ",
|
|
86
|
+
exit: {
|
|
87
|
+
height: 0,
|
|
88
|
+
opacity: 0,
|
|
89
|
+
y: -10,
|
|
90
|
+
scale: 0.98,
|
|
91
|
+
transition: {
|
|
92
|
+
height: { duration: 0.5, delay: 0.2 },
|
|
93
|
+
opacity: { duration: 0.3, delay: 0.3 },
|
|
94
|
+
y: { duration: 0.3, delay: 0.3 },
|
|
95
|
+
scale: { duration: 0.3, delay: 0.3 },
|
|
96
|
+
ease: "easeInOut"
|
|
97
|
+
}
|
|
98
|
+
},
|
|
99
|
+
children: /* @__PURE__ */ e.jsx(f, { sessions: a, handleTokenLogin: n })
|
|
100
|
+
}
|
|
101
|
+
),
|
|
102
|
+
/* @__PURE__ */ e.jsx(
|
|
103
|
+
i.div,
|
|
104
|
+
{
|
|
105
|
+
className: "flex justify-center items-center w-full mt-4",
|
|
106
|
+
exit: {
|
|
107
|
+
opacity: 0,
|
|
108
|
+
scaleX: 0,
|
|
109
|
+
height: 0,
|
|
110
|
+
transition: {
|
|
111
|
+
duration: 0.4,
|
|
112
|
+
delay: 0.15,
|
|
113
|
+
ease: "easeInOut"
|
|
114
|
+
}
|
|
115
|
+
},
|
|
116
|
+
children: /* @__PURE__ */ e.jsx("div", { className: "border-b border-neutral-strong-default border-1 w-full" })
|
|
117
|
+
}
|
|
118
|
+
)
|
|
119
|
+
] }),
|
|
120
|
+
/* @__PURE__ */ e.jsxs(
|
|
121
|
+
i.button,
|
|
122
|
+
{
|
|
123
|
+
onClick: r,
|
|
124
|
+
className: "flex flex-1 h-12 w-full gap-1 rounded-md cursor-pointer mt-4 mb-4 px-2 items-center overflow-hidden focus:outline-none hover:bg-neutral-medium-selected button-profile",
|
|
125
|
+
exit: {
|
|
126
|
+
opacity: 0,
|
|
127
|
+
y: -8,
|
|
128
|
+
scale: 0.96,
|
|
129
|
+
transition: {
|
|
130
|
+
duration: 0.5,
|
|
131
|
+
delay: 0,
|
|
132
|
+
ease: "easeInOut"
|
|
133
|
+
}
|
|
134
|
+
},
|
|
135
|
+
whileHover: {
|
|
136
|
+
opacity: 1,
|
|
137
|
+
scale: [1, 1.02, 1],
|
|
138
|
+
transition: { duration: 0.2 }
|
|
139
|
+
},
|
|
140
|
+
whileTap: { scale: 0.98 },
|
|
141
|
+
children: [
|
|
142
|
+
/* @__PURE__ */ e.jsx(
|
|
143
|
+
o.Logout,
|
|
144
|
+
{
|
|
145
|
+
size: 24,
|
|
146
|
+
className: "text-neutral-default-default"
|
|
147
|
+
}
|
|
148
|
+
),
|
|
149
|
+
/* @__PURE__ */ e.jsx("span", { className: "text-neutral-default-default font-semibold text-sm", children: "Cerrar sesión" })
|
|
150
|
+
]
|
|
151
|
+
}
|
|
152
|
+
)
|
|
153
|
+
]
|
|
154
|
+
}
|
|
155
|
+
) }), p = ({ imageUrl: t, fallbackText: a }) => /* @__PURE__ */ e.jsx("div", { className: "flex items-center justify-center profile-image-wrapper ml-1", children: /* @__PURE__ */ e.jsx(m, { urlImage: t, sizeImage: "xs", sizeFallback: "xs", fallbackText: a }) }), j = ({ isExpanded: t, name: a, nameCompany: r, nameArea: n, cardProfile: d, onClick: c }) => /* @__PURE__ */ e.jsxs(
|
|
156
|
+
i.button,
|
|
157
|
+
{
|
|
158
|
+
onClick: c,
|
|
159
|
+
className: l(
|
|
160
|
+
"flex flex-1 gap-1 rounded-l-md cursor-pointer relative overflow-hidden focus:outline-none hover:bg-neutral-medium-selected button-profile h-12",
|
|
161
|
+
t && "bg-neutral-medium-selected"
|
|
162
|
+
),
|
|
163
|
+
whileHover: {
|
|
164
|
+
opacity: 1,
|
|
165
|
+
scale: [1, 1.02, 1]
|
|
166
|
+
},
|
|
167
|
+
whileTap: { scale: 0.98 },
|
|
168
|
+
transition: { duration: 0.2, ease: "easeInOut" },
|
|
169
|
+
children: [
|
|
170
|
+
d,
|
|
171
|
+
/* @__PURE__ */ e.jsxs("div", { className: "flex flex-col justify-center overflow-hidden flex-1 relative z-10 profile-user-info mr-2", children: [
|
|
172
|
+
/* @__PURE__ */ e.jsx(
|
|
173
|
+
"p",
|
|
174
|
+
{
|
|
175
|
+
className: l(
|
|
176
|
+
"profile-name font-semibold leading-tight mb-0 text-left",
|
|
177
|
+
t ? "text-primary-default-default" : "text-neutral-default-default"
|
|
178
|
+
),
|
|
179
|
+
children: a?.length && a?.length > 20 ? a?.slice(0, 10) + ".." : a
|
|
180
|
+
}
|
|
181
|
+
),
|
|
182
|
+
/* @__PURE__ */ e.jsx("div", { className: "flex items-center gap-1 mt-0 ", children: r && r ? /* @__PURE__ */ e.jsxs(e.Fragment, { children: [
|
|
183
|
+
/* @__PURE__ */ e.jsx(
|
|
184
|
+
"p",
|
|
185
|
+
{
|
|
186
|
+
className: l(
|
|
187
|
+
"profile-options truncate text-xs mt-0",
|
|
188
|
+
t ? "text-primary-default-default" : "text-neutral-default-default"
|
|
189
|
+
),
|
|
190
|
+
children: r.length > 20 ? r?.slice(0, 10) + ".." : r
|
|
191
|
+
}
|
|
192
|
+
),
|
|
193
|
+
/* @__PURE__ */ e.jsx(
|
|
194
|
+
"p",
|
|
195
|
+
{
|
|
196
|
+
className: l(
|
|
197
|
+
"profile-options truncate font-bold mt-0",
|
|
198
|
+
t ? "text-primary-default-default" : "text-neutral-default-default"
|
|
199
|
+
),
|
|
200
|
+
children: "·"
|
|
201
|
+
}
|
|
202
|
+
),
|
|
203
|
+
/* @__PURE__ */ e.jsx(
|
|
204
|
+
"p",
|
|
205
|
+
{
|
|
206
|
+
className: l(
|
|
207
|
+
"profile-options truncate text-xs mt-0",
|
|
208
|
+
t ? "text-primary-default-default" : "text-neutral-default-default"
|
|
209
|
+
),
|
|
210
|
+
children: n || "Sin asignar"
|
|
211
|
+
}
|
|
212
|
+
)
|
|
213
|
+
] }) : /* @__PURE__ */ e.jsx("span", { className: "font-semibold leading-tight ml-3 text-xs text-blue-300 text-center", children: "Sin asignar" }) })
|
|
214
|
+
] })
|
|
215
|
+
]
|
|
216
|
+
}
|
|
217
|
+
), g = () => /* @__PURE__ */ e.jsx("div", { className: "w-px bg-gray-500/30 my-1 border-separator-profile" }), y = ({ isExpanded: t, onClick: a }) => /* @__PURE__ */ e.jsx(
|
|
218
|
+
i.button,
|
|
219
|
+
{
|
|
220
|
+
onClick: a,
|
|
221
|
+
className: "flex items-center justify-center p-3 rounded-r-md cursor-pointer relative overflow-hidden focus:outline-none min-w-[50px] hover:bg-neutral-medium-selected button-content-chevron",
|
|
222
|
+
whileHover: { scale: 1.05 },
|
|
223
|
+
whileTap: { scale: 0.95 },
|
|
224
|
+
transition: { duration: 0.2, ease: "easeOut" },
|
|
225
|
+
title: t ? "Ocultar opciones" : "Mostrar opciones",
|
|
226
|
+
"aria-label": t ? "Ocultar opciones" : "Mostrar opciones",
|
|
227
|
+
children: /* @__PURE__ */ e.jsx(
|
|
228
|
+
i.div,
|
|
229
|
+
{
|
|
230
|
+
animate: { rotate: t ? 180 : 0 },
|
|
231
|
+
transition: { duration: 0.3, ease: "easeOut" },
|
|
232
|
+
className: "relative button-select-crevron",
|
|
233
|
+
children: /* @__PURE__ */ e.jsx(i.div, { transition: { duration: 0.2 }, children: /* @__PURE__ */ e.jsx(
|
|
234
|
+
o.ChevronDown,
|
|
235
|
+
{
|
|
236
|
+
size: 20,
|
|
237
|
+
className: "text-prometeo-neutral "
|
|
238
|
+
}
|
|
239
|
+
) })
|
|
240
|
+
}
|
|
241
|
+
)
|
|
242
|
+
}
|
|
243
|
+
), s = Object.assign(x, {
|
|
244
|
+
Menu: h,
|
|
245
|
+
Image: p,
|
|
246
|
+
Content: j,
|
|
247
|
+
Separator: g,
|
|
248
|
+
Options: y
|
|
249
|
+
});
|
|
250
|
+
export {
|
|
251
|
+
s as C,
|
|
252
|
+
f as a
|
|
253
|
+
};
|
|
@@ -0,0 +1,105 @@
|
|
|
1
|
+
import { j as t } from "./jsx-runtime-ByW6EXIE.js";
|
|
2
|
+
import { Icons as l } from "./Icons.es.js";
|
|
3
|
+
import { useId as o, useRef as d } from "react";
|
|
4
|
+
const k = ({ className: s, disabled: e, ...a }) => {
|
|
5
|
+
const n = o(), c = o(), r = d(null), i = `
|
|
6
|
+
after:content-["<span id='${n}-hover-span'></span>"]
|
|
7
|
+
after:absolute
|
|
8
|
+
after:top-1/2
|
|
9
|
+
after:left-1/2
|
|
10
|
+
after:-translate-x-1/2
|
|
11
|
+
after:-translate-y-1/2
|
|
12
|
+
after:w-[40px]
|
|
13
|
+
after:h-[40px]
|
|
14
|
+
after:rounded-full
|
|
15
|
+
after:bg-neutral-700
|
|
16
|
+
after:-z-10
|
|
17
|
+
after:opacity-0
|
|
18
|
+
${!e && "hover:after:opacity-100"}
|
|
19
|
+
after:transition-all
|
|
20
|
+
after:duration-200
|
|
21
|
+
after:ease-in-out
|
|
22
|
+
after:pointer-events-none
|
|
23
|
+
${!e && "aria-checked:hover:bg-primary-default-hover hover:border-primary-default-hover"}
|
|
24
|
+
transition-all
|
|
25
|
+
duration-200
|
|
26
|
+
ease-in-out
|
|
27
|
+
`;
|
|
28
|
+
return /* @__PURE__ */ t.jsx(
|
|
29
|
+
"div",
|
|
30
|
+
{
|
|
31
|
+
id: "checkbox-container",
|
|
32
|
+
style: {
|
|
33
|
+
width: "24px",
|
|
34
|
+
height: "24px",
|
|
35
|
+
position: "relative",
|
|
36
|
+
zIndex: 10
|
|
37
|
+
},
|
|
38
|
+
className: "grid place-items-center p-2",
|
|
39
|
+
onClick: r.current?.click,
|
|
40
|
+
draggable: !1,
|
|
41
|
+
children: /* @__PURE__ */ t.jsxs(
|
|
42
|
+
"div",
|
|
43
|
+
{
|
|
44
|
+
id: "checkbox-box",
|
|
45
|
+
"aria-checked": a.checked,
|
|
46
|
+
className: `grid place-items-center absolute size-[18px] rounded-[2px]
|
|
47
|
+
${e ? `
|
|
48
|
+
bg-primary-default-disabled
|
|
49
|
+
border-neutral-medium-disabled
|
|
50
|
+
` : ""}
|
|
51
|
+
${i}
|
|
52
|
+
|
|
53
|
+
bg-transparent
|
|
54
|
+
border-[2px]
|
|
55
|
+
aria-checked:border-none
|
|
56
|
+
border-neutral-medium-default
|
|
57
|
+
hover:border-neutral-medium-hover
|
|
58
|
+
|
|
59
|
+
|
|
60
|
+
aria-checked:bg-primary-default-default
|
|
61
|
+
|
|
62
|
+
`,
|
|
63
|
+
onClick: r.current?.click,
|
|
64
|
+
draggable: !1,
|
|
65
|
+
children: [
|
|
66
|
+
/* @__PURE__ */ t.jsx(
|
|
67
|
+
"input",
|
|
68
|
+
{
|
|
69
|
+
type: "checkbox",
|
|
70
|
+
id: c,
|
|
71
|
+
ref: r,
|
|
72
|
+
className: `${s}
|
|
73
|
+
hover:#hover-span:opacity-100
|
|
74
|
+
`,
|
|
75
|
+
disabled: e,
|
|
76
|
+
style: {
|
|
77
|
+
position: "absolute",
|
|
78
|
+
top: "50%",
|
|
79
|
+
left: "50%",
|
|
80
|
+
transform: "translate(-50%, -50%)",
|
|
81
|
+
cursor: e ? "default" : "pointer",
|
|
82
|
+
width: "100%",
|
|
83
|
+
height: "100%",
|
|
84
|
+
opacity: 0,
|
|
85
|
+
zIndex: 150
|
|
86
|
+
},
|
|
87
|
+
...a
|
|
88
|
+
}
|
|
89
|
+
),
|
|
90
|
+
a.checked && /* @__PURE__ */ t.jsx(
|
|
91
|
+
l.Check,
|
|
92
|
+
{
|
|
93
|
+
size: 18,
|
|
94
|
+
className: `absolute ${e ? "opacity-30" : ""} pointer-events-none`
|
|
95
|
+
}
|
|
96
|
+
)
|
|
97
|
+
]
|
|
98
|
+
}
|
|
99
|
+
)
|
|
100
|
+
}
|
|
101
|
+
);
|
|
102
|
+
};
|
|
103
|
+
export {
|
|
104
|
+
k as default
|
|
105
|
+
};
|
|
@@ -0,0 +1,88 @@
|
|
|
1
|
+
import { j as e } from "./jsx-runtime-ByW6EXIE.js";
|
|
2
|
+
import { Icons as x } from "./Icons.es.js";
|
|
3
|
+
import { c as r } from "./cn-B6yFEsav.js";
|
|
4
|
+
import { useField as h, ErrorMessage as p } from "formik";
|
|
5
|
+
import { useState as b } from "react";
|
|
6
|
+
const k = ({ label: c, className: d, containerClassName: m, id: o, disabled: n = !1, ...t }) => {
|
|
7
|
+
const [a, l] = h({ ...t, type: "checkbox" }), [u, i] = b(!1), s = l.touched && l.error;
|
|
8
|
+
return /* @__PURE__ */ e.jsxs("div", { className: r("relative w-full", m), children: [
|
|
9
|
+
/* @__PURE__ */ e.jsxs(
|
|
10
|
+
"label",
|
|
11
|
+
{
|
|
12
|
+
htmlFor: o || t.name,
|
|
13
|
+
className: r(
|
|
14
|
+
"flex items-center gap-3 cursor-pointer transition-all duration-200 ease-in-out",
|
|
15
|
+
n ? "cursor-not-allowed opacity-60" : "hover:opacity-80",
|
|
16
|
+
d
|
|
17
|
+
),
|
|
18
|
+
children: [
|
|
19
|
+
/* @__PURE__ */ e.jsxs("div", { className: "relative", children: [
|
|
20
|
+
/* @__PURE__ */ e.jsx(
|
|
21
|
+
"input",
|
|
22
|
+
{
|
|
23
|
+
id: o || t.name,
|
|
24
|
+
type: "checkbox",
|
|
25
|
+
name: a.name,
|
|
26
|
+
checked: a.value || !1,
|
|
27
|
+
onChange: a.onChange,
|
|
28
|
+
onFocus: () => {
|
|
29
|
+
i(!0), t.onFocus?.();
|
|
30
|
+
},
|
|
31
|
+
onBlur: (f) => {
|
|
32
|
+
i(!1), t.onBlur?.(), a.onBlur(f);
|
|
33
|
+
},
|
|
34
|
+
disabled: n,
|
|
35
|
+
className: r(
|
|
36
|
+
"sr-only"
|
|
37
|
+
)
|
|
38
|
+
}
|
|
39
|
+
),
|
|
40
|
+
/* @__PURE__ */ e.jsx(
|
|
41
|
+
"div",
|
|
42
|
+
{
|
|
43
|
+
className: r(
|
|
44
|
+
"w-5 h-5 rounded border-2 transition-all duration-200 ease-in-out flex items-center justify-center",
|
|
45
|
+
a.value ? "bg-primary-default-default border-primary-default-default" : u ? "border-primary-default-default bg-transparent" : s ? "border-error-default-default bg-transparent" : "border-neutral-default-default bg-transparent hover:border-neutral-strong-default",
|
|
46
|
+
n && "bg-neutral-medium-default border-neutral-medium-default"
|
|
47
|
+
),
|
|
48
|
+
children: a.value && /* @__PURE__ */ e.jsx(
|
|
49
|
+
x.Check,
|
|
50
|
+
{
|
|
51
|
+
size: 14,
|
|
52
|
+
className: r(
|
|
53
|
+
"text-white transition-all duration-200 ease-in-out",
|
|
54
|
+
n && "text-neutral-strong-default"
|
|
55
|
+
)
|
|
56
|
+
}
|
|
57
|
+
)
|
|
58
|
+
}
|
|
59
|
+
)
|
|
60
|
+
] }),
|
|
61
|
+
/* @__PURE__ */ e.jsx("span", { className: `${u}`, children: " " }),
|
|
62
|
+
/* @__PURE__ */ e.jsx(
|
|
63
|
+
"span",
|
|
64
|
+
{
|
|
65
|
+
className: r(
|
|
66
|
+
"text-sm transition-colors duration-200 ease-in-out select-none",
|
|
67
|
+
s && "text-error-default-default",
|
|
68
|
+
n && "text-neutral-medium-default"
|
|
69
|
+
),
|
|
70
|
+
children: c
|
|
71
|
+
}
|
|
72
|
+
)
|
|
73
|
+
]
|
|
74
|
+
}
|
|
75
|
+
),
|
|
76
|
+
s && /* @__PURE__ */ e.jsx(
|
|
77
|
+
p,
|
|
78
|
+
{
|
|
79
|
+
name: t.name,
|
|
80
|
+
component: "span",
|
|
81
|
+
className: "block text-error-default-default text-xs mt-1"
|
|
82
|
+
}
|
|
83
|
+
)
|
|
84
|
+
] });
|
|
85
|
+
};
|
|
86
|
+
export {
|
|
87
|
+
k as default
|
|
88
|
+
};
|