prometeo-design-system 2.7.1 → 2.7.2
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.es.js +72 -33
- package/dist/Button.es.js +398 -2
- package/dist/DatePicker.es.js +2 -2
- package/dist/DrawerDesktop.es.js +31 -30
- package/dist/FAButton.es.js +69 -18
- package/dist/Header.es.js +14 -14
- package/dist/Icons/Icons.d.ts +5 -0
- package/dist/Icons.es.js +432 -330
- package/dist/{ImageGallery-DKzJg3un.js → ImageGallery-D8nIvBpV.js} +7 -7
- package/dist/ImageGallery.es.js +1 -1
- package/dist/{Input-C22kKz7U.js → Input-CnXDg2s7.js} +90 -92
- package/dist/Input.es.js +1 -1
- package/dist/InputFormikV2.es.js +30 -18
- package/dist/{Select-C2-CCMwC.js → Select-CiaBY4E0.js} +62 -62
- package/dist/Select.es.js +1 -1
- package/dist/SelectFormik.es.js +21 -20
- package/dist/SelectSearch.es.js +1 -1
- package/dist/Switch.es.js +4 -4
- package/dist/Toast.es.js +1 -1
- package/dist/components/Avatar/Avatar.d.ts +9 -4
- package/dist/components/Button/Button.d.ts +8 -14
- package/dist/components/Button/Button_Legacy.d.ts +29 -0
- package/dist/components/Input/Input.d.ts +5 -6
- package/dist/index-BOQuZ0gG.js +34 -0
- package/dist/index.d.ts +0 -2
- package/dist/prometeo-design-system.css +1 -1
- package/dist/prometeo-design-system.es.js +19 -21
- package/package.json +1 -5
- package/dist/Button-CvBWH1HX.js +0 -183
- package/dist/ButtonV2.d.ts +0 -6
- package/dist/ButtonV2.es.js +0 -217
- package/dist/components/Button/ButtonV2.d.ts +0 -23
- package/dist/exports/ButtonV2.d.ts +0 -2
|
@@ -1,13 +1,13 @@
|
|
|
1
1
|
import { default as Se } from "./Avatar.es.js";
|
|
2
|
-
import {
|
|
2
|
+
import { default as Ie } from "./Button.es.js";
|
|
3
3
|
import { C as Re, a as Le } from "./CardProfile-DV3gwvqE.js";
|
|
4
4
|
import { default as Ae } from "./CheckBox.es.js";
|
|
5
5
|
import { default as qe } from "./CheckboxFormik.es.js";
|
|
6
6
|
import { default as De, useDialogControl as Ee } from "./DialogModal.es.js";
|
|
7
7
|
import { default as Fe, useDrawerDesktop as He } from "./DrawerDesktop.es.js";
|
|
8
8
|
import { default as $e, useDrawerMobile as Me } from "./DrawerMobile.es.js";
|
|
9
|
-
import { default as
|
|
10
|
-
import { I as _e } from "./Input-
|
|
9
|
+
import { default as Ve } from "./Header.es.js";
|
|
10
|
+
import { I as _e } from "./Input-CnXDg2s7.js";
|
|
11
11
|
import { default as Ze } from "./InputFormik.es.js";
|
|
12
12
|
import { InputMultiple as Ke } from "./InputMultiple.es.js";
|
|
13
13
|
import { default as Ye } from "./Logo.es.js";
|
|
@@ -15,7 +15,7 @@ import { Menu as tt } from "./Menu.es.js";
|
|
|
15
15
|
import { default as rt } from "./Pagination.es.js";
|
|
16
16
|
import { ProfilePictureUpload as nt } from "./ProfilePictureUpload.es.js";
|
|
17
17
|
import { default as st } from "./ProgressBar.es.js";
|
|
18
|
-
import { S as ct } from "./Select-
|
|
18
|
+
import { S as ct } from "./Select-CiaBY4E0.js";
|
|
19
19
|
import { default as dt } from "./SelectFormikLegacy.es.js";
|
|
20
20
|
import { default as mt } from "./SelectFormik.es.js";
|
|
21
21
|
import { default as xt } from "./Spinner.es.js";
|
|
@@ -30,8 +30,8 @@ import { default as Ot } from "./Tooltip.es.js";
|
|
|
30
30
|
import { Skeleton as Ht } from "./Skeleton.es.js";
|
|
31
31
|
import { SegmentedButton as $t } from "./SegmentedButton.es.js";
|
|
32
32
|
import { u as k } from "./LayoutGeneric-CbaoatQB.js";
|
|
33
|
-
import { L as
|
|
34
|
-
import { I as _t } from "./ImageGallery-
|
|
33
|
+
import { L as Ut, S as Vt } from "./LayoutGeneric-CbaoatQB.js";
|
|
34
|
+
import { I as _t } from "./ImageGallery-D8nIvBpV.js";
|
|
35
35
|
import { default as Zt } from "./Image.es.js";
|
|
36
36
|
import { default as Kt, toastpyrion as Qt } from "./Toast.es.js";
|
|
37
37
|
import { default as ea } from "./ToastProvider.es.js";
|
|
@@ -40,7 +40,6 @@ import { default as oa } from "./FAButton.es.js";
|
|
|
40
40
|
import { default as ia } from "./InputFormikV2.es.js";
|
|
41
41
|
import { RadioButtonFormik as la } from "./RadioButtonFormik.es.js";
|
|
42
42
|
import { RadioButton as ua } from "./RadioButton.es.js";
|
|
43
|
-
import { default as fa } from "./ButtonV2.es.js";
|
|
44
43
|
import { j as a } from "./jsx-runtime-DKDX3adD.js";
|
|
45
44
|
import { c as u } from "./cn-B6yFEsav.js";
|
|
46
45
|
import A, { useRef as v, useState as g, useLayoutEffect as P, createContext as q, useContext as z, forwardRef as C, useEffect as h, useCallback as D } from "react";
|
|
@@ -48,10 +47,10 @@ import { useGSAP as I } from "@gsap/react";
|
|
|
48
47
|
import x from "gsap";
|
|
49
48
|
import { Icons as w } from "./Icons.es.js";
|
|
50
49
|
import { motion as b, AnimatePresence as B } from "framer-motion";
|
|
51
|
-
import { default as
|
|
50
|
+
import { default as fa } from "./OtpInput.es.js";
|
|
52
51
|
import { useDropzone as E } from "react-dropzone";
|
|
53
|
-
import { useIsMobile as
|
|
54
|
-
import { DropZone as
|
|
52
|
+
import { useIsMobile as pa } from "./useDevice.es.js";
|
|
53
|
+
import { DropZone as ba } from "./DropZone.es.js";
|
|
55
54
|
const O = (t, e) => {
|
|
56
55
|
I(
|
|
57
56
|
() => {
|
|
@@ -191,7 +190,7 @@ const O = (t, e) => {
|
|
|
191
190
|
}
|
|
192
191
|
};
|
|
193
192
|
return /* @__PURE__ */ a.jsx(R.Provider, { value: p, children: t });
|
|
194
|
-
}, j = (t, e, r, n) => e && (Array.isArray(e) ? e.length > 0 : e) ? t.to(e, r, n) : t,
|
|
193
|
+
}, j = (t, e, r, n) => e && (Array.isArray(e) ? e.length > 0 : e) ? t.to(e, r, n) : t, U = (t, e, r) => {
|
|
195
194
|
I(
|
|
196
195
|
() => {
|
|
197
196
|
if (!t.current) return;
|
|
@@ -233,11 +232,11 @@ const O = (t, e) => {
|
|
|
233
232
|
secondaryBarContent: x.utils.toArray(".secondary-bar *"),
|
|
234
233
|
badgeInLink: x.utils.toArray(".badge-in-link")
|
|
235
234
|
};
|
|
236
|
-
e ?
|
|
235
|
+
e ? V(n, o) : G(n, o), o.secondaryBar && _(o.secondaryBar);
|
|
237
236
|
},
|
|
238
237
|
{ scope: t, dependencies: [e, r] }
|
|
239
238
|
);
|
|
240
|
-
},
|
|
239
|
+
}, V = (t, e) => {
|
|
241
240
|
t.to(e.navbar, {
|
|
242
241
|
width: "5rem",
|
|
243
242
|
duration: 0.2,
|
|
@@ -569,7 +568,7 @@ const O = (t, e) => {
|
|
|
569
568
|
l.current && d(l);
|
|
570
569
|
}, [d]), h(() => {
|
|
571
570
|
c.current && i(c);
|
|
572
|
-
}, [i]),
|
|
571
|
+
}, [i]), U(l, e, !1), /* @__PURE__ */ a.jsxs(
|
|
573
572
|
"div",
|
|
574
573
|
{
|
|
575
574
|
className: u(
|
|
@@ -947,7 +946,6 @@ export {
|
|
|
947
946
|
Se as Avatar,
|
|
948
947
|
L as Badge,
|
|
949
948
|
Ie as Button,
|
|
950
|
-
fa as ButtonV2,
|
|
951
949
|
Re as CardProfile,
|
|
952
950
|
Le as ChangueAccount,
|
|
953
951
|
Ae as CheckBox,
|
|
@@ -957,9 +955,9 @@ export {
|
|
|
957
955
|
De as DialogModal,
|
|
958
956
|
Fe as DrawerDesktop,
|
|
959
957
|
$e as DrawerMobile,
|
|
960
|
-
|
|
958
|
+
ba as DropZone,
|
|
961
959
|
oa as FAButton,
|
|
962
|
-
|
|
960
|
+
Ve as Header,
|
|
963
961
|
w as Icons,
|
|
964
962
|
Zt as Image,
|
|
965
963
|
_t as ImageGallery,
|
|
@@ -967,14 +965,14 @@ export {
|
|
|
967
965
|
Ze as InputFormik,
|
|
968
966
|
ia as InputFormikV2,
|
|
969
967
|
Ke as InputMultiple,
|
|
970
|
-
|
|
968
|
+
Ut as LayoutGeneric,
|
|
971
969
|
Ye as Logo,
|
|
972
970
|
tt as Menu,
|
|
973
971
|
xe as NavBarActions,
|
|
974
972
|
ge as NavbarCollapseButton,
|
|
975
973
|
be as NavbarLinks,
|
|
976
974
|
pe as NavigationLink,
|
|
977
|
-
|
|
975
|
+
fa as OtpInput,
|
|
978
976
|
rt as Pagination,
|
|
979
977
|
nt as ProfilePictureUpload,
|
|
980
978
|
st as ProgressBar,
|
|
@@ -988,7 +986,7 @@ export {
|
|
|
988
986
|
aa as SelectSearch,
|
|
989
987
|
me as Sidebar,
|
|
990
988
|
M as SidebarProvider,
|
|
991
|
-
|
|
989
|
+
Vt as SidebarRefProvider,
|
|
992
990
|
Ht as Skeleton,
|
|
993
991
|
xt as Spinner,
|
|
994
992
|
yt as Steps,
|
|
@@ -1014,7 +1012,7 @@ export {
|
|
|
1014
1012
|
He as useDrawerDesktop,
|
|
1015
1013
|
Me as useDrawerMobile,
|
|
1016
1014
|
we as useFileDropzone,
|
|
1017
|
-
|
|
1015
|
+
pa as useIsMobile,
|
|
1018
1016
|
ve as useNavbarCollapse,
|
|
1019
1017
|
fe as useSidebar,
|
|
1020
1018
|
k as useSidebarContext
|
package/package.json
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "prometeo-design-system",
|
|
3
3
|
"private": false,
|
|
4
|
-
"version": "2.7.
|
|
4
|
+
"version": "2.7.2",
|
|
5
5
|
"type": "module",
|
|
6
6
|
"description": "design kit system",
|
|
7
7
|
"main": "dist/prometeo-design-system.umd.js",
|
|
@@ -181,10 +181,6 @@
|
|
|
181
181
|
"types": "./dist/RadioButtonFormik.d.ts",
|
|
182
182
|
"import": "./dist/RadioButtonFormik.es.js"
|
|
183
183
|
},
|
|
184
|
-
"./ButtonV2": {
|
|
185
|
-
"types": "./dist/ButtonV2.d.ts",
|
|
186
|
-
"import": "./dist/ButtonV2.es.js"
|
|
187
|
-
},
|
|
188
184
|
"./styles": "./dist/prometeo-design-system.css",
|
|
189
185
|
"./intellisense": "./src/styles/intellisense.css"
|
|
190
186
|
},
|
package/dist/Button-CvBWH1HX.js
DELETED
|
@@ -1,183 +0,0 @@
|
|
|
1
|
-
import { j as f } from "./jsx-runtime-DKDX3adD.js";
|
|
2
|
-
import { c as g } from "./cn-B6yFEsav.js";
|
|
3
|
-
import { clsx as B } from "clsx";
|
|
4
|
-
import { useAnimationControls as E, motion as j } from "framer-motion";
|
|
5
|
-
import { memo as P, useCallback as C, useMemo as h } from "react";
|
|
6
|
-
const V = (l) => typeof l == "boolean" ? `${l}` : l === 0 ? "0" : l, w = B, _ = (l, d) => (e) => {
|
|
7
|
-
var m;
|
|
8
|
-
if (d?.variants == null) return w(l, e?.class, e?.className);
|
|
9
|
-
const { variants: v, defaultVariants: t } = d, n = Object.keys(v).map((s) => {
|
|
10
|
-
const u = e?.[s], i = t?.[s];
|
|
11
|
-
if (u === null) return null;
|
|
12
|
-
const o = V(u) || V(i);
|
|
13
|
-
return v[s][o];
|
|
14
|
-
}), r = e && Object.entries(e).reduce((s, u) => {
|
|
15
|
-
let [i, o] = u;
|
|
16
|
-
return o === void 0 || (s[i] = o), s;
|
|
17
|
-
}, {}), a = d == null || (m = d.compoundVariants) === null || m === void 0 ? void 0 : m.reduce((s, u) => {
|
|
18
|
-
let { class: i, className: o, ...p } = u;
|
|
19
|
-
return Object.entries(p).every((y) => {
|
|
20
|
-
let [b, x] = y;
|
|
21
|
-
return Array.isArray(x) ? x.includes({
|
|
22
|
-
...t,
|
|
23
|
-
...r
|
|
24
|
-
}[b]) : {
|
|
25
|
-
...t,
|
|
26
|
-
...r
|
|
27
|
-
}[b] === x;
|
|
28
|
-
}) ? [
|
|
29
|
-
...s,
|
|
30
|
-
i,
|
|
31
|
-
o
|
|
32
|
-
] : s;
|
|
33
|
-
}, []);
|
|
34
|
-
return w(l, n, a, e?.class, e?.className);
|
|
35
|
-
}, $ = _(
|
|
36
|
-
"flex items-center justify-center cursor-pointer focus:outline-none font-semibold rounded-md transition-colors",
|
|
37
|
-
{
|
|
38
|
-
variants: {
|
|
39
|
-
variant: {
|
|
40
|
-
filled: "",
|
|
41
|
-
outline: "bg-transparent border-1",
|
|
42
|
-
text: "bg-transparent border-0"
|
|
43
|
-
},
|
|
44
|
-
color: {
|
|
45
|
-
primary: "",
|
|
46
|
-
secondary: ""
|
|
47
|
-
},
|
|
48
|
-
size: {
|
|
49
|
-
small: "h-[40px] w-[123px] w-fit px-2 py-3 text-sm",
|
|
50
|
-
medium: "h-[48px] w-[134px] w-fit px-2 py-3 text-base",
|
|
51
|
-
large: "h-[56px] w-[145px] w-fit px-4 py-3 text-base"
|
|
52
|
-
},
|
|
53
|
-
disabled: {
|
|
54
|
-
true: "opacity-50 cursor-default",
|
|
55
|
-
false: ""
|
|
56
|
-
},
|
|
57
|
-
loading: {
|
|
58
|
-
true: "cursor-wait",
|
|
59
|
-
false: ""
|
|
60
|
-
},
|
|
61
|
-
customSize: {
|
|
62
|
-
true: "px-4 py-2",
|
|
63
|
-
false: ""
|
|
64
|
-
}
|
|
65
|
-
},
|
|
66
|
-
compoundVariants: [
|
|
67
|
-
{
|
|
68
|
-
variant: "filled",
|
|
69
|
-
color: "primary",
|
|
70
|
-
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"
|
|
71
|
-
},
|
|
72
|
-
{
|
|
73
|
-
variant: "filled",
|
|
74
|
-
color: "secondary",
|
|
75
|
-
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"
|
|
76
|
-
},
|
|
77
|
-
{
|
|
78
|
-
variant: "outline",
|
|
79
|
-
color: "primary",
|
|
80
|
-
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"
|
|
81
|
-
},
|
|
82
|
-
{
|
|
83
|
-
variant: "outline",
|
|
84
|
-
color: "secondary",
|
|
85
|
-
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"
|
|
86
|
-
},
|
|
87
|
-
{
|
|
88
|
-
variant: "text",
|
|
89
|
-
color: "primary",
|
|
90
|
-
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"
|
|
91
|
-
},
|
|
92
|
-
{
|
|
93
|
-
variant: "text",
|
|
94
|
-
color: "secondary",
|
|
95
|
-
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"
|
|
96
|
-
}
|
|
97
|
-
],
|
|
98
|
-
defaultVariants: {
|
|
99
|
-
variant: "filled",
|
|
100
|
-
color: "primary",
|
|
101
|
-
size: "medium",
|
|
102
|
-
disabled: !1,
|
|
103
|
-
loading: !1,
|
|
104
|
-
customSize: !1
|
|
105
|
-
}
|
|
106
|
-
}
|
|
107
|
-
);
|
|
108
|
-
function z({
|
|
109
|
-
label: l = "Selene",
|
|
110
|
-
onClick: d,
|
|
111
|
-
icon: e,
|
|
112
|
-
contentClassName: m,
|
|
113
|
-
loadingText: v = "Cargando...",
|
|
114
|
-
animate: t = !0,
|
|
115
|
-
animateIcon: n = !0,
|
|
116
|
-
isLoading: r = !1,
|
|
117
|
-
disabled: a = !1,
|
|
118
|
-
type: s = "button",
|
|
119
|
-
variant: u = "filled",
|
|
120
|
-
color: i = "primary",
|
|
121
|
-
size: o = "medium",
|
|
122
|
-
children: p,
|
|
123
|
-
Spinner: y,
|
|
124
|
-
className: b,
|
|
125
|
-
form: x,
|
|
126
|
-
...N
|
|
127
|
-
}) {
|
|
128
|
-
const c = E(), H = C(() => {
|
|
129
|
-
!t || a || r || !n || c.start({ rotate: 90 });
|
|
130
|
-
}, [t, a, r, n, c]), S = C(() => {
|
|
131
|
-
!t || a || r || !n || c.start({ rotate: 0 });
|
|
132
|
-
}, [t, a, r, n, c]), k = h(() => g(
|
|
133
|
-
$({
|
|
134
|
-
variant: u,
|
|
135
|
-
color: i,
|
|
136
|
-
size: o,
|
|
137
|
-
disabled: a || r,
|
|
138
|
-
loading: r
|
|
139
|
-
}),
|
|
140
|
-
b
|
|
141
|
-
), [u, i, o, a, r, b]), O = h(() => ({
|
|
142
|
-
whileHover: t && !a && !r ? { scale: 1.05 } : {},
|
|
143
|
-
whileTap: t && !a && !r ? { scale: 0.98 } : {},
|
|
144
|
-
transition: { type: "spring", stiffness: 400, damping: 17 }
|
|
145
|
-
}), [t, a, r]), A = h(() => r ? /* @__PURE__ */ f.jsxs("div", { className: "flex items-center gap-2", children: [
|
|
146
|
-
y,
|
|
147
|
-
o !== "small" && /* @__PURE__ */ f.jsx("span", { children: v })
|
|
148
|
-
] }) : p || /* @__PURE__ */ f.jsxs("span", { className: g("flex items-center gap-2", m), children: [
|
|
149
|
-
e && /* @__PURE__ */ f.jsx(
|
|
150
|
-
j.div,
|
|
151
|
-
{
|
|
152
|
-
animate: n ? c : void 0,
|
|
153
|
-
transition: {
|
|
154
|
-
type: "spring",
|
|
155
|
-
stiffness: 400,
|
|
156
|
-
damping: 17
|
|
157
|
-
},
|
|
158
|
-
children: e
|
|
159
|
-
}
|
|
160
|
-
),
|
|
161
|
-
l && /* @__PURE__ */ f.jsx("span", { children: l })
|
|
162
|
-
] }), [r, p, e, l, y, o, v, n, c, m]);
|
|
163
|
-
return /* @__PURE__ */ f.jsx(
|
|
164
|
-
j.button,
|
|
165
|
-
{
|
|
166
|
-
form: x,
|
|
167
|
-
onClick: d,
|
|
168
|
-
className: k,
|
|
169
|
-
...O,
|
|
170
|
-
onHoverStart: H,
|
|
171
|
-
onHoverEnd: S,
|
|
172
|
-
disabled: a || r,
|
|
173
|
-
type: s,
|
|
174
|
-
...N,
|
|
175
|
-
children: A
|
|
176
|
-
}
|
|
177
|
-
);
|
|
178
|
-
}
|
|
179
|
-
const W = P(z);
|
|
180
|
-
export {
|
|
181
|
-
W as B,
|
|
182
|
-
_ as c
|
|
183
|
-
};
|
package/dist/ButtonV2.d.ts
DELETED
package/dist/ButtonV2.es.js
DELETED
|
@@ -1,217 +0,0 @@
|
|
|
1
|
-
import { j as e } from "./jsx-runtime-DKDX3adD.js";
|
|
2
|
-
import { memo as N, useMemo as V } from "react";
|
|
3
|
-
import B from "./Spinner.es.js";
|
|
4
|
-
const M = {
|
|
5
|
-
small: {
|
|
6
|
-
container: "h-10 px-4 py-2",
|
|
7
|
-
label: "",
|
|
8
|
-
icon: ""
|
|
9
|
-
},
|
|
10
|
-
medium: {
|
|
11
|
-
container: "h-12 px-6 py-2",
|
|
12
|
-
label: "",
|
|
13
|
-
icon: ""
|
|
14
|
-
},
|
|
15
|
-
large: {
|
|
16
|
-
container: "h-14 px-6 py-2",
|
|
17
|
-
label: "",
|
|
18
|
-
icon: ""
|
|
19
|
-
}
|
|
20
|
-
}, n = {
|
|
21
|
-
filled: {
|
|
22
|
-
primary: {
|
|
23
|
-
container: ` bg-primary-default-default border-primary-default-default
|
|
24
|
-
hover:bg-primary-default-hover
|
|
25
|
-
active:bg-primary-default-focused
|
|
26
|
-
`,
|
|
27
|
-
label: " text-neutral-strong-default! group-hover:text-neutral-strong-hover! group-active:text-neutral-strong-pressed!",
|
|
28
|
-
icon: " text-neutral-strong-default! group-hover:text-neutral-strong-hover! group-active:text-neutral-strong-pressed!"
|
|
29
|
-
},
|
|
30
|
-
secondary: {
|
|
31
|
-
container: `bg-neutral-medium-default border-neutral-medium-default
|
|
32
|
-
hover:bg-neutral-medium-hover
|
|
33
|
-
active:bg-neutral-medium-pressed`,
|
|
34
|
-
label: "text-neutral-strong-default! group-hover:text-neutral-strong-hover! group-active:text-neutral-strong-pressed!",
|
|
35
|
-
icon: "text-neutral-strong-default! group-hover:text-neutral-strong-hover! group-active:text-neutral-strong-pressed!"
|
|
36
|
-
},
|
|
37
|
-
success: {
|
|
38
|
-
container: "bg-success-default-default border-success-default-default hover:bg-success-default-hover active:bg-success-default-pressed",
|
|
39
|
-
label: "text-neutral-weak-default group-hover:text-neutral-weak-hover group-active:text-neutral-weak-pressed",
|
|
40
|
-
icon: "text-neutral-weak-default group-hover:text-neutral-weak-hover group-active:text-neutral-weak-pressed"
|
|
41
|
-
},
|
|
42
|
-
error: {
|
|
43
|
-
container: "bg-error-default-default hover:bg-error-default-hover active:bg-error-default-pressed",
|
|
44
|
-
label: "text-neutral-strong-default group-hover:text-neutral-strong-hover group-active:text-neutral-strong-pressed",
|
|
45
|
-
icon: "text-neutral-strong-default group-hover:text-neutral-strong-hover group-active:text-neutral-strong-pressed"
|
|
46
|
-
},
|
|
47
|
-
warning: {
|
|
48
|
-
container: "bg-warning-default-default hover:bg-warning-default-hover active:bg-warning-default-pressed",
|
|
49
|
-
label: "text-neutral-weak-default group-hover:text-neutral-weak-hover group-active:text-neutral-weak-pressed",
|
|
50
|
-
icon: "text-neutral-weak-default group-hover:text-neutral-weak-hover group-active:text-neutral-weak-pressed"
|
|
51
|
-
},
|
|
52
|
-
disabled: {
|
|
53
|
-
container: "bg-primary-medium-disabled border-transparent cursor-default!",
|
|
54
|
-
label: "text-neutral-strong-disabled group-hover:text-neutral-strong-disabled group-active:text-neutral-strong-disabled",
|
|
55
|
-
icon: "text-neutral-strong-disabled group-hover:text-neutral-strong-disabled group-active:text-neutral-strong-disabled"
|
|
56
|
-
}
|
|
57
|
-
},
|
|
58
|
-
outlined: {
|
|
59
|
-
primary: {
|
|
60
|
-
container: `bg-transparent border-primary-default-default border
|
|
61
|
-
hover:bg-neutral-default-hover hover:border-primary-medium-hover
|
|
62
|
-
active:bg-neutral-default-pressed active:border-primary-medium-pressed
|
|
63
|
-
`,
|
|
64
|
-
label: "text-primary-default-default group-hover:text-primary-medium-hover group-active:text-primary-medium-pressed",
|
|
65
|
-
icon: "text-primary-default-default group-hover:text-primary-medium-hover group-active:text-primary-medium-pressed"
|
|
66
|
-
},
|
|
67
|
-
secondary: {
|
|
68
|
-
container: "bg-transparent border-neutral-medium-default border hover:bg-neutral-default-hover hover:border-neutral-medium-hover active:bg-neutral-default-pressed active:border-neutral-medium-pressed",
|
|
69
|
-
label: "text-neutral-strong-default group-hover:text-neutral-storng-hover group-active:text-neutral-storng-pressed",
|
|
70
|
-
icon: "text-neutral-strong-default group-hover:text-neutral-storng-hover group-active:text-neutral-storng-pressed"
|
|
71
|
-
},
|
|
72
|
-
success: {
|
|
73
|
-
container: "border border-success-default-default hover:border-success-default-hover hover:bg-neutral-default-hover active:border-success-default-pressed active:bg-neutral-default-pressed",
|
|
74
|
-
label: "text-success-medium-default group-hover:text-success-medium-hover group-active:text-success-medium-pressed",
|
|
75
|
-
icon: "text-success-medium-default group-hover:text-success-medium-hover group-active:text-success-medium-pressed"
|
|
76
|
-
},
|
|
77
|
-
error: {
|
|
78
|
-
container: "border border-error-default-default hover:border-error-default-hover hover:bg-neutral-default-hover active:border-error-default-pressed active:bg-neutral-default-pressed",
|
|
79
|
-
label: "text-error-medium-default group-hover:text-error-medium-hover group-active:text-error-medium-pressed",
|
|
80
|
-
icon: "text-error-medium-default group-hover:text-error-medium-hover group-active:text-error-medium-pressed"
|
|
81
|
-
},
|
|
82
|
-
warning: {
|
|
83
|
-
container: "border border-warning-default-default hover:border-warning-default-hover hover:bg-neutral-default-hover active:border-warning-default-pressed active:bg-neutral-default-pressed",
|
|
84
|
-
label: "text-warning-medium-default group-hover:text-warning-medium-hover group-active:text-warning-medium-pressed",
|
|
85
|
-
icon: "text-warning-medium-default group-hover:text-warning-medium-hover group-active:text-warning-medium-pressed"
|
|
86
|
-
},
|
|
87
|
-
disabled: {
|
|
88
|
-
container: "bg-neutral-default-disabled border-neutral-default-disabled border cursor-default!",
|
|
89
|
-
label: "text-neutral-default-disabled group-hover:text-neutral-default-disabled group-active:text-neutral-default-disabled",
|
|
90
|
-
icon: "text-neutral-default-disabled group-hover:text-neutral-default-disabled group-active:text-neutral-default-disabled"
|
|
91
|
-
}
|
|
92
|
-
},
|
|
93
|
-
text: {
|
|
94
|
-
primary: {
|
|
95
|
-
container: " bg-transparent border-0 text-primary-default-default hover:bg-neutral-default-hover hover:border-primary-medium-hover active:bg-neutral-default-pressed",
|
|
96
|
-
label: "text-primary-default-default group-hover:text-primary-medium-hover group-active:text-primary-medium-pressed",
|
|
97
|
-
icon: "text-primary-default-default group-hover:text-primary-medium-hover group-active:text-primary-medium-pressed"
|
|
98
|
-
},
|
|
99
|
-
secondary: {
|
|
100
|
-
container: "bg-transparent border-0 hover:bg-neutral-default-hover hover:border-neutral-medium-hover active:bg-neutral-default-pressed",
|
|
101
|
-
label: "text-neutral-strong-hover group-hover:text-neutral-storng-hover group-active:text-neutral-storng-pressed",
|
|
102
|
-
icon: "text-neutral-strong-hover group-hover:text-neutral-storng-hover group-active:text-neutral-storng-pressed"
|
|
103
|
-
},
|
|
104
|
-
success: {
|
|
105
|
-
container: "border border-transparent hover:border-success-default-hover hover:bg-neutral-default-hover hover:border-success-default-hover active:border-success-default-pressed active:bg-neutral-default-pressed",
|
|
106
|
-
label: "text-success-medium-default group-hover:text-success-medium-hover group-active:text-success-medium-pressed",
|
|
107
|
-
icon: "text-success-medium-default group-hover:text-success-medium-hover group-active:text-success-medium-pressed"
|
|
108
|
-
},
|
|
109
|
-
error: {
|
|
110
|
-
container: "border border-transparent hover:border-error-default-hover hover:bg-neutral-default-hover hover:border-error-default-hover active:border-error-default-pressed active:bg-neutral-default-pressed",
|
|
111
|
-
label: "text-error-medium-default group-hover:text-error-medium-hover group-active:text-error-medium-pressed",
|
|
112
|
-
icon: "text-error-medium-default group-hover:text-error-medium-hover group-active:text-error-medium-pressed"
|
|
113
|
-
},
|
|
114
|
-
warning: {
|
|
115
|
-
container: "border border-transparent hover:border-warning-default-hover hover:bg-neutral-default-hover hover:border-warning-default-hover active:border-warning-default-pressed active:bg-neutral-default-pressed",
|
|
116
|
-
label: "text-warning-medium-default group-hover:text-warning-medium-hover group-active:text-warning-medium-pressed",
|
|
117
|
-
icon: "text-warning-medium-default group-hover:text-warning-medium-hover group-active:text-warning-medium-pressed"
|
|
118
|
-
},
|
|
119
|
-
disabled: {
|
|
120
|
-
container: "bg-transparent border-neutral-default-disabled border-none cursor-default! hover:bg-transparent",
|
|
121
|
-
label: "text-neutral-medium-focused group-hover:text-neutral-medium-focused group-active:text-neutral-medium-focused",
|
|
122
|
-
icon: "text-neutral-medium-focused group-hover:text-neutral-medium-focused group-active:text-neutral-medium-focused"
|
|
123
|
-
}
|
|
124
|
-
}
|
|
125
|
-
}, l = {
|
|
126
|
-
small: {
|
|
127
|
-
container: "",
|
|
128
|
-
label: "prometeo-fonts-label-large",
|
|
129
|
-
icon: ""
|
|
130
|
-
},
|
|
131
|
-
medium: {
|
|
132
|
-
container: "",
|
|
133
|
-
label: "prometeo-fonts-label-xlarge",
|
|
134
|
-
icon: ""
|
|
135
|
-
},
|
|
136
|
-
large: {
|
|
137
|
-
container: "",
|
|
138
|
-
label: "prometeo-fonts-label-xlarge",
|
|
139
|
-
icon: ""
|
|
140
|
-
}
|
|
141
|
-
}, c = {
|
|
142
|
-
container: "flex items-center gap-1 w-max rounded-lg bg-transparent cursor-pointer transition-all ease-in-out duration-300",
|
|
143
|
-
label: "w-max transition-all ease-in-out duration-300",
|
|
144
|
-
icon: "w-max transition-all ease-in-out duration-300"
|
|
145
|
-
}, A = {
|
|
146
|
-
true: {
|
|
147
|
-
container: "hover:scale-105 active:scale-95 disabled:scale-100"
|
|
148
|
-
},
|
|
149
|
-
false: {
|
|
150
|
-
container: ""
|
|
151
|
-
}
|
|
152
|
-
}, C = {
|
|
153
|
-
true: {
|
|
154
|
-
icon: "group-hover:rotate-90 group-active:rotate-0 group-disabled:rotate-0"
|
|
155
|
-
},
|
|
156
|
-
false: {
|
|
157
|
-
icon: ""
|
|
158
|
-
}
|
|
159
|
-
}, E = ({
|
|
160
|
-
label: m,
|
|
161
|
-
onClick: g,
|
|
162
|
-
icon: d,
|
|
163
|
-
contentClassName: s,
|
|
164
|
-
loadingText: v = "Cargando...",
|
|
165
|
-
animate: b = !0,
|
|
166
|
-
animateIcon: f = !0,
|
|
167
|
-
isLoading: t = !1,
|
|
168
|
-
children: i,
|
|
169
|
-
hideSpinner: h = !1,
|
|
170
|
-
spinner: x = /* @__PURE__ */ e.jsx(B, { size: "small", variant: "clip", speedMultiplier: 0.5, className: "mt-1.5", color: "var(--neutral-600)" }),
|
|
171
|
-
type: w,
|
|
172
|
-
className: y,
|
|
173
|
-
disabled: o,
|
|
174
|
-
variant: a = "filled",
|
|
175
|
-
form: $,
|
|
176
|
-
size: r = "medium",
|
|
177
|
-
color: p = "primary"
|
|
178
|
-
}) => {
|
|
179
|
-
const k = f && !o && !t ? "true" : "false", j = b && !o && !t ? "true" : "false", u = o || t ? "disabled" : p, S = V(() => i || (t ? /* @__PURE__ */ e.jsxs("div", { className: "flex items-center gap-1", children: [
|
|
180
|
-
!h && x,
|
|
181
|
-
/* @__PURE__ */ e.jsx("span", { className: ` ${l[r].label} ${n[a][u].label} ${r === "small" ? "prometeo-fonts-label-xsmall" : ""}`, children: v })
|
|
182
|
-
] }) : /* @__PURE__ */ e.jsxs("div", { className: `flex items-center gap-1 ${s}`, children: [
|
|
183
|
-
d && /* @__PURE__ */ e.jsx("span", { className: `
|
|
184
|
-
${c.icon}
|
|
185
|
-
${n[a][u].icon}
|
|
186
|
-
${l[r].icon}
|
|
187
|
-
${C[k].icon}
|
|
188
|
-
`, children: d }),
|
|
189
|
-
/* @__PURE__ */ e.jsx("span", { className: `
|
|
190
|
-
${c.label}
|
|
191
|
-
${n[a][u].label}
|
|
192
|
-
${l[r].label}
|
|
193
|
-
`, children: m })
|
|
194
|
-
] })), [i, s, d, m, a, p, r]);
|
|
195
|
-
return /* @__PURE__ */ e.jsx(
|
|
196
|
-
"button",
|
|
197
|
-
{
|
|
198
|
-
type: w,
|
|
199
|
-
className: `
|
|
200
|
-
group
|
|
201
|
-
${c.container}
|
|
202
|
-
${l[r].container}
|
|
203
|
-
${M[r].container}
|
|
204
|
-
${n[a][u].container}
|
|
205
|
-
${A[j].container}
|
|
206
|
-
${y}
|
|
207
|
-
`,
|
|
208
|
-
disabled: o || t,
|
|
209
|
-
form: $,
|
|
210
|
-
onClick: g,
|
|
211
|
-
children: /* @__PURE__ */ e.jsx("div", { className: `flex items-center gap-1 ${s}`, children: S })
|
|
212
|
-
}
|
|
213
|
-
);
|
|
214
|
-
}, D = N(E);
|
|
215
|
-
export {
|
|
216
|
-
D as default
|
|
217
|
-
};
|
|
@@ -1,23 +0,0 @@
|
|
|
1
|
-
import { ButtonVariant, ColorVariant, SizeVariant } from '../Shared/types';
|
|
2
|
-
export interface ButtonProps extends React.ButtonHTMLAttributes<HTMLButtonElement> {
|
|
3
|
-
label?: string;
|
|
4
|
-
onClick?: (e: React.MouseEvent<HTMLButtonElement>) => void;
|
|
5
|
-
icon?: React.ReactNode;
|
|
6
|
-
contentClassName?: string;
|
|
7
|
-
loadingText?: string;
|
|
8
|
-
animate?: boolean;
|
|
9
|
-
animateIcon?: boolean;
|
|
10
|
-
isLoading?: boolean;
|
|
11
|
-
children?: React.ReactNode;
|
|
12
|
-
spinner?: React.ReactNode;
|
|
13
|
-
type?: 'button' | "submit" | "reset";
|
|
14
|
-
className?: string;
|
|
15
|
-
disabled?: boolean;
|
|
16
|
-
variant?: ButtonVariant;
|
|
17
|
-
form?: string;
|
|
18
|
-
size?: SizeVariant;
|
|
19
|
-
color?: ColorVariant;
|
|
20
|
-
hideSpinner?: boolean;
|
|
21
|
-
}
|
|
22
|
-
declare const _default: import('react').MemoExoticComponent<({ label, onClick, icon, contentClassName, loadingText, animate, animateIcon, isLoading, children, hideSpinner, spinner, type, className, disabled, variant, form, size, color }: ButtonProps) => import("react/jsx-runtime").JSX.Element>;
|
|
23
|
-
export default _default;
|