@votodigital-onpeui/react 0.1.25 → 0.1.27
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/README.md +1 -0
- package/dist/ModalConfirm-DsE7awHb.d.mts +37 -0
- package/dist/ModalConfirm-DsE7awHb.d.ts +37 -0
- package/dist/chunk-6LCT7D6I.mjs +246 -0
- package/dist/chunk-6LCT7D6I.mjs.map +1 -0
- package/dist/{chunk-JVG534KO.mjs → chunk-M2KQXQLY.mjs} +66 -4
- package/dist/chunk-M2KQXQLY.mjs.map +1 -0
- package/dist/{chunk-UXPABYEO.mjs → chunk-SS5NPQU6.mjs} +4 -136
- package/dist/chunk-SS5NPQU6.mjs.map +1 -0
- package/dist/components.d.mts +2 -20
- package/dist/components.d.ts +2 -20
- package/dist/components.js +60 -32
- package/dist/components.js.map +1 -1
- package/dist/components.mjs +3 -4
- package/dist/icons.d.mts +3 -1
- package/dist/icons.d.ts +3 -1
- package/dist/icons.js +19 -0
- package/dist/icons.js.map +1 -1
- package/dist/icons.mjs +1 -2
- package/dist/index.d.mts +3 -2
- package/dist/index.d.ts +3 -2
- package/dist/index.js +60 -32
- package/dist/index.js.map +1 -1
- package/dist/index.mjs +3 -4
- package/dist/modal.d.mts +37 -39
- package/dist/modal.d.ts +37 -39
- package/dist/modal.js +116 -97
- package/dist/modal.js.map +1 -1
- package/dist/modal.mjs +24 -161
- package/dist/modal.mjs.map +1 -1
- package/package.json +1 -1
- package/dist/chunk-65JI3EPO.mjs +0 -51
- package/dist/chunk-65JI3EPO.mjs.map +0 -1
- package/dist/chunk-7T7V5NBO.mjs +0 -107
- package/dist/chunk-7T7V5NBO.mjs.map +0 -1
- package/dist/chunk-JVG534KO.mjs.map +0 -1
- package/dist/chunk-UXPABYEO.mjs.map +0 -1
package/README.md
CHANGED
|
@@ -2,6 +2,7 @@
|
|
|
2
2
|
|
|
3
3
|
Librería de componentes de interfaz de usuario para aplicaciones de la Oficina Nacional de Procesos Electorales (ONPE) del Perú, construida con React, TypeScript y Tailwind CSS v4.
|
|
4
4
|
|
|
5
|
+
|
|
5
6
|
## Características
|
|
6
7
|
|
|
7
8
|
- **Colores oficiales ONPE** — Paleta de colores institucional completa
|
|
@@ -0,0 +1,37 @@
|
|
|
1
|
+
import * as react_jsx_runtime from 'react/jsx-runtime';
|
|
2
|
+
import { ReactNode } from 'react';
|
|
3
|
+
|
|
4
|
+
type ModalType = "warning" | "success" | "question" | "info" | "none";
|
|
5
|
+
interface ModalConfirmProps {
|
|
6
|
+
isOpen: boolean;
|
|
7
|
+
onClose: () => void;
|
|
8
|
+
title: string;
|
|
9
|
+
/** Contenido del modal (string o JSX) */
|
|
10
|
+
message?: ReactNode;
|
|
11
|
+
/** Alias de message */
|
|
12
|
+
content?: ReactNode;
|
|
13
|
+
/** Tipo semántico: determina icono, color de título y color de botón confirmar */
|
|
14
|
+
type?: ModalType;
|
|
15
|
+
/** "double" muestra el botón cancelar */
|
|
16
|
+
buttonMode?: "single" | "double";
|
|
17
|
+
/** Deshabilita el botón confirmar */
|
|
18
|
+
disabledConfirmButton?: boolean;
|
|
19
|
+
/** Deshabilita el cierre del modal */
|
|
20
|
+
closeDisabled?: boolean;
|
|
21
|
+
/**
|
|
22
|
+
* Override del color del icono y título.
|
|
23
|
+
* Si no se provee, se deriva automáticamente del `type`.
|
|
24
|
+
*/
|
|
25
|
+
color?: "red" | "blue" | "skyblue" | "yellow";
|
|
26
|
+
onConfirm?: () => void | Promise<void>;
|
|
27
|
+
onCancel?: () => void | Promise<void>;
|
|
28
|
+
textButtonConfirm?: string;
|
|
29
|
+
textButtonCancel?: string;
|
|
30
|
+
className?: string;
|
|
31
|
+
zIndexLevel?: number;
|
|
32
|
+
withoutAutoClose?: boolean;
|
|
33
|
+
disableFocus?: boolean;
|
|
34
|
+
}
|
|
35
|
+
declare const ModalConfirm: ({ isOpen, onClose, withoutAutoClose, title, message, content, type, buttonMode, disabledConfirmButton, closeDisabled, color, onConfirm, onCancel, textButtonConfirm, textButtonCancel, className, zIndexLevel, disableFocus, }: ModalConfirmProps) => react_jsx_runtime.JSX.Element;
|
|
36
|
+
|
|
37
|
+
export { ModalConfirm as M, type ModalConfirmProps as a, type ModalType as b };
|
|
@@ -0,0 +1,37 @@
|
|
|
1
|
+
import * as react_jsx_runtime from 'react/jsx-runtime';
|
|
2
|
+
import { ReactNode } from 'react';
|
|
3
|
+
|
|
4
|
+
type ModalType = "warning" | "success" | "question" | "info" | "none";
|
|
5
|
+
interface ModalConfirmProps {
|
|
6
|
+
isOpen: boolean;
|
|
7
|
+
onClose: () => void;
|
|
8
|
+
title: string;
|
|
9
|
+
/** Contenido del modal (string o JSX) */
|
|
10
|
+
message?: ReactNode;
|
|
11
|
+
/** Alias de message */
|
|
12
|
+
content?: ReactNode;
|
|
13
|
+
/** Tipo semántico: determina icono, color de título y color de botón confirmar */
|
|
14
|
+
type?: ModalType;
|
|
15
|
+
/** "double" muestra el botón cancelar */
|
|
16
|
+
buttonMode?: "single" | "double";
|
|
17
|
+
/** Deshabilita el botón confirmar */
|
|
18
|
+
disabledConfirmButton?: boolean;
|
|
19
|
+
/** Deshabilita el cierre del modal */
|
|
20
|
+
closeDisabled?: boolean;
|
|
21
|
+
/**
|
|
22
|
+
* Override del color del icono y título.
|
|
23
|
+
* Si no se provee, se deriva automáticamente del `type`.
|
|
24
|
+
*/
|
|
25
|
+
color?: "red" | "blue" | "skyblue" | "yellow";
|
|
26
|
+
onConfirm?: () => void | Promise<void>;
|
|
27
|
+
onCancel?: () => void | Promise<void>;
|
|
28
|
+
textButtonConfirm?: string;
|
|
29
|
+
textButtonCancel?: string;
|
|
30
|
+
className?: string;
|
|
31
|
+
zIndexLevel?: number;
|
|
32
|
+
withoutAutoClose?: boolean;
|
|
33
|
+
disableFocus?: boolean;
|
|
34
|
+
}
|
|
35
|
+
declare const ModalConfirm: ({ isOpen, onClose, withoutAutoClose, title, message, content, type, buttonMode, disabledConfirmButton, closeDisabled, color, onConfirm, onCancel, textButtonConfirm, textButtonCancel, className, zIndexLevel, disableFocus, }: ModalConfirmProps) => react_jsx_runtime.JSX.Element;
|
|
36
|
+
|
|
37
|
+
export { ModalConfirm as M, type ModalConfirmProps as a, type ModalType as b };
|
|
@@ -0,0 +1,246 @@
|
|
|
1
|
+
import { IconSpinnerDesktop, IconSpinnerMobile, IconCheck, IconQuestion, IconInfo, IconWarningNotRecommended } from './chunk-M2KQXQLY.mjs';
|
|
2
|
+
import { Modal } from './chunk-EZQGWVW2.mjs';
|
|
3
|
+
import { jsx, jsxs } from 'react/jsx-runtime';
|
|
4
|
+
import { useState, useEffect } from 'react';
|
|
5
|
+
|
|
6
|
+
var colorClasses = {
|
|
7
|
+
blue: "bg-onpe-blue",
|
|
8
|
+
skyblue: "bg-onpe-skyblue",
|
|
9
|
+
"skyblue-light": "bg-onpe-skyblue-light",
|
|
10
|
+
yellow: "bg-onpe-yellow",
|
|
11
|
+
"light-skyblue": "bg-onpe-light-skyblue",
|
|
12
|
+
gray: "bg-onpe-gray",
|
|
13
|
+
"gray-light": "bg-onpe-gray-light",
|
|
14
|
+
"gray-extra-light": "bg-onpe-gray-extra-light",
|
|
15
|
+
red: "bg-onpe-red",
|
|
16
|
+
"dark-gray": "bg-onpe-dark-gray",
|
|
17
|
+
green: "bg-onpe-green",
|
|
18
|
+
"yellow-light": "bg-onpe-yellow-light",
|
|
19
|
+
primary: "bg-onpe-blue"
|
|
20
|
+
};
|
|
21
|
+
var sizeClasses = {
|
|
22
|
+
small: "h-10 text-sm",
|
|
23
|
+
normal: "h-12 text-base",
|
|
24
|
+
large: "h-14 text-lg"
|
|
25
|
+
};
|
|
26
|
+
function Button({
|
|
27
|
+
color,
|
|
28
|
+
title,
|
|
29
|
+
size = "normal",
|
|
30
|
+
className = "",
|
|
31
|
+
...props
|
|
32
|
+
}) {
|
|
33
|
+
return /* @__PURE__ */ jsx(
|
|
34
|
+
"button",
|
|
35
|
+
{
|
|
36
|
+
className: [
|
|
37
|
+
"inline-flex items-center justify-center",
|
|
38
|
+
"min-w-[200px] border-none",
|
|
39
|
+
"text-white font-semibold cursor-pointer",
|
|
40
|
+
"transition-all duration-300 ease-in-out",
|
|
41
|
+
"disabled:cursor-default disabled:!bg-onpe-gray",
|
|
42
|
+
colorClasses[color],
|
|
43
|
+
sizeClasses[size],
|
|
44
|
+
className
|
|
45
|
+
].filter(Boolean).join(" "),
|
|
46
|
+
...props,
|
|
47
|
+
children: title
|
|
48
|
+
}
|
|
49
|
+
);
|
|
50
|
+
}
|
|
51
|
+
var colorOverrideMap = {
|
|
52
|
+
red: "text-onpe-red",
|
|
53
|
+
blue: "text-onpe-blue",
|
|
54
|
+
skyblue: "text-onpe-skyblue",
|
|
55
|
+
yellow: "text-onpe-yellow"
|
|
56
|
+
};
|
|
57
|
+
function renderIcon(type, colorClass) {
|
|
58
|
+
if (type === "none") return null;
|
|
59
|
+
if (type === "success") {
|
|
60
|
+
return /* @__PURE__ */ jsx(IconCheck, { role: "presentation", className: `w-16 h-16 ${colorClass}` });
|
|
61
|
+
}
|
|
62
|
+
if (type === "question") {
|
|
63
|
+
return /* @__PURE__ */ jsx(IconQuestion, { role: "presentation", className: `w-16 h-16 ${colorClass}` });
|
|
64
|
+
}
|
|
65
|
+
if (type === "info") {
|
|
66
|
+
return /* @__PURE__ */ jsx(IconInfo, { role: "presentation", className: `w-16 h-16 ${colorClass}` });
|
|
67
|
+
}
|
|
68
|
+
return /* @__PURE__ */ jsx(IconWarningNotRecommended, { role: "presentation", className: `w-16 h-16 ${colorClass}` });
|
|
69
|
+
}
|
|
70
|
+
var ModalConfirm = ({
|
|
71
|
+
isOpen = false,
|
|
72
|
+
onClose = () => {
|
|
73
|
+
},
|
|
74
|
+
withoutAutoClose = false,
|
|
75
|
+
title,
|
|
76
|
+
message,
|
|
77
|
+
content,
|
|
78
|
+
type = "warning",
|
|
79
|
+
buttonMode,
|
|
80
|
+
disabledConfirmButton = false,
|
|
81
|
+
closeDisabled = false,
|
|
82
|
+
color,
|
|
83
|
+
onConfirm = () => {
|
|
84
|
+
},
|
|
85
|
+
onCancel = () => {
|
|
86
|
+
},
|
|
87
|
+
textButtonConfirm = "Confirmar",
|
|
88
|
+
textButtonCancel = "Cancelar",
|
|
89
|
+
className = "",
|
|
90
|
+
zIndexLevel = 100,
|
|
91
|
+
disableFocus = false
|
|
92
|
+
}) => {
|
|
93
|
+
const titleId = "modal-confirm-title";
|
|
94
|
+
const messageId = "modal-confirm-message";
|
|
95
|
+
const effectiveMessage = message ?? content;
|
|
96
|
+
const effectiveColorClass = color ? colorOverrideMap[color] ?? "text-onpe-skyblue" : "text-onpe-skyblue";
|
|
97
|
+
const showTwoButtons = buttonMode === "double";
|
|
98
|
+
const handleConfirm = async () => {
|
|
99
|
+
try {
|
|
100
|
+
await onConfirm();
|
|
101
|
+
if (!withoutAutoClose) onClose();
|
|
102
|
+
} catch (error) {
|
|
103
|
+
console.error("Error en handleConfirm:", error);
|
|
104
|
+
if (!withoutAutoClose) onClose();
|
|
105
|
+
}
|
|
106
|
+
};
|
|
107
|
+
const handleCancel = () => {
|
|
108
|
+
onCancel();
|
|
109
|
+
if (!withoutAutoClose) onClose();
|
|
110
|
+
};
|
|
111
|
+
return /* @__PURE__ */ jsxs(
|
|
112
|
+
Modal,
|
|
113
|
+
{
|
|
114
|
+
isOpen,
|
|
115
|
+
onClose,
|
|
116
|
+
className: `max-w-[719px]! pt-[30px]! pb-[30px]! px-[30px]! ${className}`,
|
|
117
|
+
closeButton: false,
|
|
118
|
+
closeDisabled,
|
|
119
|
+
zIndexLevel,
|
|
120
|
+
"aria-labelledby": titleId,
|
|
121
|
+
"aria-describedby": messageId,
|
|
122
|
+
disableFocus,
|
|
123
|
+
children: [
|
|
124
|
+
/* @__PURE__ */ jsx("div", { className: "flex items-center justify-center", children: renderIcon(type, effectiveColorClass) }),
|
|
125
|
+
/* @__PURE__ */ jsx(
|
|
126
|
+
"p",
|
|
127
|
+
{
|
|
128
|
+
id: titleId,
|
|
129
|
+
className: [
|
|
130
|
+
"text-lg md:text-2xl font-semibold text-center mt-0 md:mt-4",
|
|
131
|
+
effectiveColorClass
|
|
132
|
+
].join(" "),
|
|
133
|
+
children: title
|
|
134
|
+
}
|
|
135
|
+
),
|
|
136
|
+
effectiveMessage && /* @__PURE__ */ jsx(
|
|
137
|
+
"div",
|
|
138
|
+
{
|
|
139
|
+
id: messageId,
|
|
140
|
+
className: "mt-7 text-sm md:text-lg text-center max-w-full text-onpe-dark-gray",
|
|
141
|
+
children: effectiveMessage
|
|
142
|
+
}
|
|
143
|
+
),
|
|
144
|
+
/* @__PURE__ */ jsxs("div", { className: "flex flex-col items-center justify-center w-full gap-5 mt-11 md:hidden", children: [
|
|
145
|
+
/* @__PURE__ */ jsx(
|
|
146
|
+
Button,
|
|
147
|
+
{
|
|
148
|
+
className: "w-full max-w-[200px]",
|
|
149
|
+
color: "red",
|
|
150
|
+
title: textButtonConfirm,
|
|
151
|
+
onClick: handleConfirm,
|
|
152
|
+
disabled: disabledConfirmButton
|
|
153
|
+
}
|
|
154
|
+
),
|
|
155
|
+
showTwoButtons && /* @__PURE__ */ jsx(
|
|
156
|
+
Button,
|
|
157
|
+
{
|
|
158
|
+
className: "w-full max-w-[200px]",
|
|
159
|
+
color: "skyblue",
|
|
160
|
+
title: textButtonCancel,
|
|
161
|
+
onClick: handleCancel
|
|
162
|
+
}
|
|
163
|
+
)
|
|
164
|
+
] }),
|
|
165
|
+
/* @__PURE__ */ jsxs("div", { className: "hidden md:flex md:flex-row items-center justify-center w-full gap-5 mt-11", children: [
|
|
166
|
+
showTwoButtons && /* @__PURE__ */ jsx(
|
|
167
|
+
Button,
|
|
168
|
+
{
|
|
169
|
+
className: "w-[200px]",
|
|
170
|
+
color: "skyblue",
|
|
171
|
+
title: textButtonCancel,
|
|
172
|
+
onClick: handleCancel
|
|
173
|
+
}
|
|
174
|
+
),
|
|
175
|
+
/* @__PURE__ */ jsx(
|
|
176
|
+
Button,
|
|
177
|
+
{
|
|
178
|
+
className: "w-[200px]",
|
|
179
|
+
color: "red",
|
|
180
|
+
title: textButtonConfirm,
|
|
181
|
+
onClick: handleConfirm,
|
|
182
|
+
disabled: disabledConfirmButton
|
|
183
|
+
}
|
|
184
|
+
)
|
|
185
|
+
] })
|
|
186
|
+
]
|
|
187
|
+
}
|
|
188
|
+
);
|
|
189
|
+
};
|
|
190
|
+
var ModalLoading = ({
|
|
191
|
+
isOpen = false,
|
|
192
|
+
onClose = () => {
|
|
193
|
+
},
|
|
194
|
+
message = "Cargando...",
|
|
195
|
+
className = "",
|
|
196
|
+
zIndexLevel = 100
|
|
197
|
+
}) => {
|
|
198
|
+
const [announceMessage, setAnnounceMessage] = useState("");
|
|
199
|
+
useEffect(() => {
|
|
200
|
+
if (!isOpen) {
|
|
201
|
+
setAnnounceMessage("");
|
|
202
|
+
return;
|
|
203
|
+
}
|
|
204
|
+
setAnnounceMessage("");
|
|
205
|
+
const t = globalThis.setTimeout(() => {
|
|
206
|
+
setAnnounceMessage(message);
|
|
207
|
+
}, 150);
|
|
208
|
+
return () => {
|
|
209
|
+
globalThis.clearTimeout(t);
|
|
210
|
+
};
|
|
211
|
+
}, [isOpen, message]);
|
|
212
|
+
return /* @__PURE__ */ jsxs(
|
|
213
|
+
Modal,
|
|
214
|
+
{
|
|
215
|
+
disableFocus: true,
|
|
216
|
+
zIndexLevel,
|
|
217
|
+
isOpen,
|
|
218
|
+
onClose,
|
|
219
|
+
className,
|
|
220
|
+
closeDisabled: true,
|
|
221
|
+
whitoutBackground: true,
|
|
222
|
+
children: [
|
|
223
|
+
/* @__PURE__ */ jsx("div", { className: "sr-only", "aria-live": "assertive", "aria-atomic": "true", children: announceMessage }),
|
|
224
|
+
/* @__PURE__ */ jsx(
|
|
225
|
+
IconSpinnerDesktop,
|
|
226
|
+
{
|
|
227
|
+
className: "hidden md:block text-white animate-spin",
|
|
228
|
+
"aria-hidden": "true"
|
|
229
|
+
}
|
|
230
|
+
),
|
|
231
|
+
/* @__PURE__ */ jsx(
|
|
232
|
+
IconSpinnerMobile,
|
|
233
|
+
{
|
|
234
|
+
className: "block md:hidden text-white animate-spin",
|
|
235
|
+
"aria-hidden": "true"
|
|
236
|
+
}
|
|
237
|
+
),
|
|
238
|
+
/* @__PURE__ */ jsx("p", { className: "text-white leading-normal text-2xl md:text-[64px] text-center mt-10 md:mt-20", children: message })
|
|
239
|
+
]
|
|
240
|
+
}
|
|
241
|
+
);
|
|
242
|
+
};
|
|
243
|
+
|
|
244
|
+
export { Button, ModalConfirm, ModalLoading };
|
|
245
|
+
//# sourceMappingURL=chunk-6LCT7D6I.mjs.map
|
|
246
|
+
//# sourceMappingURL=chunk-6LCT7D6I.mjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../src/components/Button/Button.tsx","../src/components/Feedback/ModalConfirm/ModalConfirm.tsx","../src/components/Feedback/ModalLoading/ModalLoading.tsx"],"names":["jsx","jsxs"],"mappings":"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","file":"chunk-6LCT7D6I.mjs","sourcesContent":["type ButtonColor =\n | \"blue\"\n | \"skyblue\"\n | \"skyblue-light\"\n | \"yellow\"\n | \"light-skyblue\"\n | \"gray\"\n | \"gray-light\"\n | \"gray-extra-light\"\n | \"red\"\n | \"dark-gray\"\n | \"green\"\n | \"yellow-light\"\n | \"primary\";\n\ntype ButtonSize = \"small\" | \"normal\" | \"large\";\n\nexport interface ButtonProps\n extends React.ButtonHTMLAttributes<HTMLButtonElement> {\n color: ButtonColor;\n title: string;\n size?: ButtonSize;\n}\n\nconst colorClasses: Record<ButtonColor, string> = {\n blue: \"bg-onpe-blue\",\n skyblue: \"bg-onpe-skyblue\",\n \"skyblue-light\": \"bg-onpe-skyblue-light\",\n yellow: \"bg-onpe-yellow\",\n \"light-skyblue\": \"bg-onpe-light-skyblue\",\n gray: \"bg-onpe-gray\",\n \"gray-light\": \"bg-onpe-gray-light\",\n \"gray-extra-light\": \"bg-onpe-gray-extra-light\",\n red: \"bg-onpe-red\",\n \"dark-gray\": \"bg-onpe-dark-gray\",\n green: \"bg-onpe-green\",\n \"yellow-light\": \"bg-onpe-yellow-light\",\n primary: \"bg-onpe-blue\",\n};\n\nconst sizeClasses: Record<ButtonSize, string> = {\n small: \"h-10 text-sm\",\n normal: \"h-12 text-base\",\n large: \"h-14 text-lg\",\n};\n\nexport function Button({\n color,\n title,\n size = \"normal\",\n className = \"\",\n ...props\n}: ButtonProps) {\n return (\n <button\n className={[\n \"inline-flex items-center justify-center\",\n \"min-w-[200px] border-none\",\n \"text-white font-semibold cursor-pointer\",\n \"transition-all duration-300 ease-in-out\",\n \"disabled:cursor-default disabled:!bg-onpe-gray\",\n colorClasses[color],\n sizeClasses[size],\n className,\n ]\n .filter(Boolean)\n .join(\" \")}\n {...props}\n >\n {title}\n </button>\n );\n}\n\nexport default Button;\n","import { type ReactNode } from \"react\";\r\nimport { Modal } from \"../../Modal/Modal\";\r\nimport { Button } from \"../../Button/Button\";\r\nimport { IconCheck } from \"../../../icons/Actions/IconCheck\";\r\nimport { IconWarningNotRecommended } from \"../../../icons\";\r\nimport { IconQuestion } from \"../../../icons/Actions/IconQuestion\";\r\nimport { IconInfo } from \"../../../icons/Actions/IconInfo\";\r\n\r\nexport type ModalType = \"warning\" | \"success\" | \"question\" | \"info\" | \"none\";\r\n\r\n/** Mapa de override de color a clase CSS (icono + título) */\r\nconst colorOverrideMap: Record<string, string> = {\r\n red: \"text-onpe-red\",\r\n blue: \"text-onpe-blue\",\r\n skyblue: \"text-onpe-skyblue\",\r\n yellow: \"text-onpe-yellow\",\r\n};\r\n\r\nfunction renderIcon(type: ModalType, colorClass: string): ReactNode {\r\n if (type === \"none\") return null;\r\n if (type === \"success\") {\r\n return <IconCheck role=\"presentation\" className={`w-16 h-16 ${colorClass}`} />;\r\n }\r\n if (type === \"question\") {\r\n return <IconQuestion role=\"presentation\" className={`w-16 h-16 ${colorClass}`} />;\r\n }\r\n if (type === \"info\") {\r\n return <IconInfo role=\"presentation\" className={`w-16 h-16 ${colorClass}`} />;\r\n }\r\n // error | warning\r\n return <IconWarningNotRecommended role=\"presentation\" className={`w-16 h-16 ${colorClass}`} />;\r\n}\r\n\r\nexport interface ModalConfirmProps {\r\n isOpen: boolean;\r\n onClose: () => void;\r\n title: string;\r\n /** Contenido del modal (string o JSX) */\r\n message?: ReactNode;\r\n /** Alias de message */\r\n content?: ReactNode;\r\n /** Tipo semántico: determina icono, color de título y color de botón confirmar */\r\n type?: ModalType;\r\n /** \"double\" muestra el botón cancelar */\r\n buttonMode?: \"single\" | \"double\";\r\n /** Deshabilita el botón confirmar */\r\n disabledConfirmButton?: boolean;\r\n /** Deshabilita el cierre del modal */\r\n closeDisabled?: boolean;\r\n /**\r\n * Override del color del icono y título.\r\n * Si no se provee, se deriva automáticamente del `type`.\r\n */\r\n color?: \"red\" | \"blue\" | \"skyblue\" | \"yellow\";\r\n onConfirm?: () => void | Promise<void>;\r\n onCancel?: () => void | Promise<void>;\r\n textButtonConfirm?: string;\r\n textButtonCancel?: string;\r\n className?: string;\r\n zIndexLevel?: number;\r\n withoutAutoClose?: boolean;\r\n disableFocus?: boolean;\r\n}\r\n\r\nexport const ModalConfirm = ({\r\n isOpen = false,\r\n onClose = () => {},\r\n withoutAutoClose = false,\r\n title,\r\n message,\r\n content,\r\n type = \"warning\",\r\n buttonMode,\r\n disabledConfirmButton = false,\r\n closeDisabled = false,\r\n color,\r\n onConfirm = () => {},\r\n onCancel = () => {},\r\n textButtonConfirm = \"Confirmar\",\r\n textButtonCancel = \"Cancelar\",\r\n className = \"\",\r\n zIndexLevel = 100,\r\n disableFocus = false,\r\n}: ModalConfirmProps) => {\r\n const titleId = \"modal-confirm-title\";\r\n const messageId = \"modal-confirm-message\";\r\n\r\n const effectiveMessage = message ?? content;\r\n // Título e ícono siempre skyblue por defecto; `color` es el único override\r\n const effectiveColorClass = color\r\n ? (colorOverrideMap[color] ?? \"text-onpe-skyblue\")\r\n : \"text-onpe-skyblue\";\r\n const showTwoButtons = buttonMode === \"double\";\r\n\r\n const handleConfirm = async () => {\r\n try {\r\n await onConfirm();\r\n if (!withoutAutoClose) onClose();\r\n } catch (error) {\r\n console.error(\"Error en handleConfirm:\", error);\r\n if (!withoutAutoClose) onClose();\r\n }\r\n };\r\n\r\n const handleCancel = () => {\r\n onCancel();\r\n if (!withoutAutoClose) onClose();\r\n };\r\n\r\n return (\r\n <Modal\r\n isOpen={isOpen}\r\n onClose={onClose}\r\n className={`max-w-[719px]! pt-[30px]! pb-[30px]! px-[30px]! ${className}`}\r\n closeButton={false}\r\n closeDisabled={closeDisabled}\r\n zIndexLevel={zIndexLevel}\r\n aria-labelledby={titleId}\r\n aria-describedby={messageId}\r\n disableFocus={disableFocus}\r\n >\r\n {/* Icono */}\r\n <div className=\"flex items-center justify-center\">\r\n {renderIcon(type, effectiveColorClass)}\r\n </div>\r\n\r\n {/* Título */}\r\n <p\r\n id={titleId}\r\n className={[\r\n \"text-lg md:text-2xl font-semibold text-center mt-0 md:mt-4\",\r\n effectiveColorClass,\r\n ].join(\" \")}\r\n >\r\n {title}\r\n </p>\r\n\r\n {/* Mensaje / Contenido */}\r\n {effectiveMessage && (\r\n <div\r\n id={messageId}\r\n className=\"mt-7 text-sm md:text-lg text-center max-w-full text-onpe-dark-gray\"\r\n >\r\n {effectiveMessage}\r\n </div>\r\n )}\r\n\r\n {/* Mobile: apilado */}\r\n <div className=\"flex flex-col items-center justify-center w-full gap-5 mt-11 md:hidden\">\r\n <Button\r\n className=\"w-full max-w-[200px]\"\r\n color=\"red\"\r\n title={textButtonConfirm}\r\n onClick={handleConfirm}\r\n disabled={disabledConfirmButton}\r\n />\r\n {showTwoButtons && (\r\n <Button\r\n className=\"w-full max-w-[200px]\"\r\n color=\"skyblue\"\r\n title={textButtonCancel}\r\n onClick={handleCancel}\r\n />\r\n )}\r\n </div>\r\n\r\n {/* Desktop: fila */}\r\n <div className=\"hidden md:flex md:flex-row items-center justify-center w-full gap-5 mt-11\">\r\n {showTwoButtons && (\r\n <Button\r\n className=\"w-[200px]\"\r\n color=\"skyblue\"\r\n title={textButtonCancel}\r\n onClick={handleCancel}\r\n />\r\n )}\r\n <Button\r\n className=\"w-[200px]\"\r\n color=\"red\"\r\n title={textButtonConfirm}\r\n onClick={handleConfirm}\r\n disabled={disabledConfirmButton}\r\n />\r\n </div>\r\n </Modal>\r\n );\r\n};\r\n\r\nexport default ModalConfirm;\r\n","import { useEffect, useState } from \"react\";\r\nimport { Modal } from \"../../Modal/Modal\";\r\nimport { IconSpinnerDesktop } from \"../../../icons/Actions/IconSpinnerDesktop\";\r\nimport { IconSpinnerMobile } from \"../../../icons/Actions/IconSpinnerMobile\";\r\n\r\nexport interface ModalLoadingProps {\r\n isOpen: boolean;\r\n onClose?: () => void;\r\n message?: string;\r\n className?: string;\r\n zIndexLevel?: number;\r\n}\r\n\r\nexport const ModalLoading = ({\r\n isOpen = false,\r\n onClose = () => {},\r\n message = \"Cargando...\",\r\n className = \"\",\r\n zIndexLevel = 100,\r\n}: ModalLoadingProps) => {\r\n const [announceMessage, setAnnounceMessage] = useState(\"\");\r\n\r\n useEffect(() => {\r\n if (!isOpen) {\r\n setAnnounceMessage(\"\");\r\n return;\r\n }\r\n setAnnounceMessage(\"\");\r\n const t = globalThis.setTimeout(() => {\r\n setAnnounceMessage(message);\r\n }, 150);\r\n return () => {\r\n globalThis.clearTimeout(t);\r\n };\r\n }, [isOpen, message]);\r\n\r\n return (\r\n <Modal\r\n disableFocus\r\n zIndexLevel={zIndexLevel}\r\n isOpen={isOpen}\r\n onClose={onClose}\r\n className={className}\r\n closeDisabled\r\n whitoutBackground={true}\r\n >\r\n <div className=\"sr-only\" aria-live=\"assertive\" aria-atomic=\"true\">\r\n {announceMessage}\r\n </div>\r\n <IconSpinnerDesktop\r\n className=\"hidden md:block text-white animate-spin\"\r\n aria-hidden=\"true\"\r\n />\r\n <IconSpinnerMobile\r\n className=\"block md:hidden text-white animate-spin\"\r\n aria-hidden=\"true\"\r\n />\r\n <p className=\"text-white leading-normal text-2xl md:text-[64px] text-center mt-10 md:mt-20\">\r\n {message}\r\n </p>\r\n </Modal>\r\n );\r\n};\r\n\r\nexport default ModalLoading;\r\n"]}
|
|
@@ -1,6 +1,13 @@
|
|
|
1
1
|
import { jsx, jsxs } from 'react/jsx-runtime';
|
|
2
2
|
|
|
3
|
-
// src/icons/Actions/
|
|
3
|
+
// src/icons/Actions/IconCheck.tsx
|
|
4
|
+
var IconCheck = (props) => /* @__PURE__ */ jsx("svg", { width: 64, height: 64, viewBox: "0 0 64 64", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...props, children: /* @__PURE__ */ jsx(
|
|
5
|
+
"path",
|
|
6
|
+
{
|
|
7
|
+
d: "M28.2673 44.2663L47.0673 25.4663L43.334 21.733L28.2673 36.7997L20.6673 29.1997L16.934 32.933L28.2673 44.2663ZM32.0007 58.6663C28.3118 58.6663 24.8451 57.9659 21.6007 56.565C18.3562 55.1641 15.534 53.2646 13.134 50.8663C10.734 48.4663 8.83443 45.6441 7.43532 42.3997C6.03621 39.1552 5.33576 35.6886 5.33398 31.9997C5.33398 28.3108 6.03443 24.8441 7.43532 21.5997C8.83621 18.3552 10.7358 15.533 13.134 13.133C15.534 10.733 18.3562 8.83345 21.6007 7.43434C24.8451 6.03523 28.3118 5.33479 32.0007 5.33301C35.6895 5.33301 39.1562 6.03345 42.4007 7.43434C45.6451 8.83523 48.4673 10.7348 50.8673 13.133C53.2673 15.533 55.1678 18.3552 56.5686 21.5997C57.9695 24.8441 58.6691 28.3108 58.6673 31.9997C58.6673 35.6886 57.9669 39.1552 56.566 42.3997C55.1651 45.6441 53.2655 48.4663 50.8673 50.8663C48.4673 53.2663 45.6451 55.1668 42.4007 56.5677C39.1562 57.9686 35.6895 58.6681 32.0007 58.6663ZM32.0007 53.333C37.9562 53.333 43.0006 51.2663 47.134 47.133C51.2673 42.9997 53.334 37.9552 53.334 31.9997C53.334 26.0441 51.2673 20.9997 47.134 16.8663C43.0006 12.733 37.9562 10.6663 32.0007 10.6663C26.0451 10.6663 21.0007 12.733 16.8673 16.8663C12.734 20.9997 10.6673 26.0441 10.6673 31.9997C10.6673 37.9552 12.734 42.9997 16.8673 47.133C21.0007 51.2663 26.0451 53.333 32.0007 53.333Z",
|
|
8
|
+
fill: "currentColor"
|
|
9
|
+
}
|
|
10
|
+
) });
|
|
4
11
|
var IconClose = (props) => /* @__PURE__ */ jsx("svg", { width: 16, height: 16, viewBox: "0 0 8 8", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...props, children: /* @__PURE__ */ jsx(
|
|
5
12
|
"path",
|
|
6
13
|
{
|
|
@@ -14,6 +21,7 @@ var IconClose = (props) => /* @__PURE__ */ jsx("svg", { width: 16, height: 16, v
|
|
|
14
21
|
var IconHome = ({ ...props }) => {
|
|
15
22
|
return /* @__PURE__ */ jsx("svg", { width: 20, height: 20, viewBox: "0 0 20 17", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...props, children: /* @__PURE__ */ jsx("path", { d: "M10 2.69L15 7.19V15H13V9H7V15H5V7.19L10 2.69ZM10 0L0 9H3V17H9V11H11V17H17V9H20", fill: "currentColor" }) });
|
|
16
23
|
};
|
|
24
|
+
var IconInfo = (props) => /* @__PURE__ */ jsx("svg", { width: 16, height: 16, viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...props, children: /* @__PURE__ */ jsx("path", { d: "M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm1 15h-2v-6h2v6zm0-8h-2V7h2v2z", fill: "currentColor" }) });
|
|
17
25
|
var IconPhone = ({ ...props }) => {
|
|
18
26
|
return /* @__PURE__ */ jsx(
|
|
19
27
|
"svg",
|
|
@@ -28,6 +36,42 @@ var IconPhone = ({ ...props }) => {
|
|
|
28
36
|
}
|
|
29
37
|
);
|
|
30
38
|
};
|
|
39
|
+
var IconQuestion = (props) => /* @__PURE__ */ jsx(
|
|
40
|
+
"svg",
|
|
41
|
+
{
|
|
42
|
+
width: "64",
|
|
43
|
+
height: "64",
|
|
44
|
+
viewBox: "0 0 64 64",
|
|
45
|
+
fill: "none",
|
|
46
|
+
xmlns: "http://www.w3.org/2000/svg",
|
|
47
|
+
...props,
|
|
48
|
+
children: /* @__PURE__ */ jsx(
|
|
49
|
+
"path",
|
|
50
|
+
{
|
|
51
|
+
d: "M31.9997 5.33325C46.7277 5.33325 58.6663 17.2719 58.6663 31.9999C58.6663 46.7279 46.7277 58.6666 31.9997 58.6666C17.2717 58.6666 5.33301 46.7279 5.33301 31.9999C5.33301 17.2719 17.2717 5.33325 31.9997 5.33325ZM31.9997 10.6666C26.3417 10.6666 20.9155 12.9142 16.9147 16.915C12.914 20.9157 10.6663 26.342 10.6663 31.9999C10.6663 37.6579 12.914 43.0841 16.9147 47.0849C20.9155 51.0856 26.3417 53.3332 31.9997 53.3332C37.6576 53.3332 43.0838 51.0856 47.0846 47.0849C51.0854 43.0841 53.333 37.6579 53.333 31.9999C53.333 26.342 51.0854 20.9157 47.0846 16.915C43.0838 12.9142 37.6576 10.6666 31.9997 10.6666ZM31.9997 42.6666C32.7069 42.6666 33.3852 42.9475 33.8853 43.4476C34.3854 43.9477 34.6663 44.626 34.6663 45.3332C34.6663 46.0405 34.3854 46.7188 33.8853 47.2189C33.3852 47.719 32.7069 47.9999 31.9997 47.9999C31.2924 47.9999 30.6142 47.719 30.1141 47.2189C29.614 46.7188 29.333 46.0405 29.333 45.3332C29.333 44.626 29.614 43.9477 30.1141 43.4476C30.6142 42.9475 31.2924 42.6666 31.9997 42.6666ZM31.9997 17.3333C34.2458 17.3333 36.4217 18.1155 38.1538 19.5455C39.8858 20.9755 41.0658 22.964 41.4912 25.1695C41.9165 27.3749 41.5605 29.6596 40.4844 31.6311C39.4084 33.6027 37.6793 35.1379 35.5943 35.9732C35.2855 36.0868 35.0072 36.2703 34.781 36.5093C34.6637 36.6426 34.645 36.8133 34.6477 36.9893L34.6663 37.3333C34.6656 38.0129 34.4053 38.6667 33.9387 39.1609C33.4722 39.6551 32.8345 39.9525 32.156 39.9924C31.4774 40.0322 31.8093 39.8115 30.2881 39.3752C29.7669 38.939 29.4319 38.3202 29.3517 37.6452L29.333 37.3333V36.6666C29.333 33.5919 31.813 31.7466 33.6103 31.0239C34.3418 30.7318 34.98 30.246 35.4562 29.6185C35.9324 28.9911 36.2287 28.2458 36.3133 27.4627C36.3979 26.6796 36.2675 25.8883 35.9363 25.1736C35.605 24.459 35.0854 23.8481 34.4331 23.4065C33.7808 22.965 33.0206 22.7094 32.2341 22.6673C31.4475 22.6252 30.6644 22.7982 29.9687 23.1676C29.2731 23.537 28.6912 24.0889 28.2855 24.7641C27.8799 25.4393 27.6658 26.2122 27.6663 26.9999C27.6663 27.7072 27.3854 28.3854 26.8853 28.8855C26.3852 29.3856 25.7069 29.6666 24.9997 29.6666C24.2924 29.6666 23.6142 29.3856 23.1141 28.8855C22.614 28.3854 22.333 27.7072 22.333 26.9999C22.333 24.4362 23.3515 21.9774 25.1643 20.1646C26.9772 18.3517 29.4359 17.3333 31.9997 17.3333Z",
|
|
52
|
+
fill: "currentColor"
|
|
53
|
+
}
|
|
54
|
+
)
|
|
55
|
+
}
|
|
56
|
+
);
|
|
57
|
+
var IconSpinnerDesktop = (props) => /* @__PURE__ */ jsx("svg", { width: 102, height: 102, viewBox: "0 0 102 102", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...props, children: /* @__PURE__ */ jsx(
|
|
58
|
+
"path",
|
|
59
|
+
{
|
|
60
|
+
d: "M50.9999 3.08313C23.9241 3.08208 3.08296 24.6456 3.08325 51C3.08354 75.4375 22.453 98.9167 50.9999 98.9167C77.5573 98.9167 98.9166 77.3542 98.9166 51",
|
|
61
|
+
stroke: "currentColor",
|
|
62
|
+
strokeWidth: 6,
|
|
63
|
+
strokeLinecap: "round"
|
|
64
|
+
}
|
|
65
|
+
) });
|
|
66
|
+
var IconSpinnerMobile = (props) => /* @__PURE__ */ jsx("svg", { width: 33, height: 33, viewBox: "0 0 33 33", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...props, children: /* @__PURE__ */ jsx(
|
|
67
|
+
"path",
|
|
68
|
+
{
|
|
69
|
+
d: "M16.5 3C8.87169 2.9997 2.99992 9.07499 3 16.5C3.00008 23.385 8.45721 30 16.5 30C23.9822 30 30 23.925 30 16.5",
|
|
70
|
+
stroke: "currentColor",
|
|
71
|
+
strokeWidth: 6,
|
|
72
|
+
strokeLinecap: "round"
|
|
73
|
+
}
|
|
74
|
+
) });
|
|
31
75
|
var IconWarning = (props) => /* @__PURE__ */ jsxs(
|
|
32
76
|
"svg",
|
|
33
77
|
{
|
|
@@ -50,6 +94,24 @@ var IconWarning = (props) => /* @__PURE__ */ jsxs(
|
|
|
50
94
|
]
|
|
51
95
|
}
|
|
52
96
|
);
|
|
97
|
+
var IconWarningNotRecommended = (props) => /* @__PURE__ */ jsx(
|
|
98
|
+
"svg",
|
|
99
|
+
{
|
|
100
|
+
width: "1em",
|
|
101
|
+
height: "1em",
|
|
102
|
+
viewBox: "0 0 49 42",
|
|
103
|
+
fill: "none",
|
|
104
|
+
xmlns: "http://www.w3.org/2000/svg",
|
|
105
|
+
...props,
|
|
106
|
+
children: /* @__PURE__ */ jsx(
|
|
107
|
+
"path",
|
|
108
|
+
{
|
|
109
|
+
d: "M0 42L24.5 0L49 42H0ZM7.68409 37.5789H41.3159L24.5 8.84211L7.68409 37.5789ZM24.5 35.3684C25.1311 35.3684 25.6604 35.1562 26.088 34.7318C26.5157 34.3074 26.7288 33.7827 26.7273 33.1579C26.7273 32.5316 26.5135 32.0062 26.0858 31.5818C25.6582 31.1574 25.1296 30.9459 24.5 30.9474C23.8689 30.9474 23.3396 31.1596 22.912 31.584C22.4843 32.0084 22.2712 32.5331 22.2727 33.1579C22.2727 33.7842 22.4865 34.3096 22.9142 34.734C23.3418 35.1584 23.8704 35.3699 24.5 35.3684ZM22.2727 28.7368H26.7273V17.6842H22.2727V28.7368Z",
|
|
110
|
+
fill: "currentColor"
|
|
111
|
+
}
|
|
112
|
+
)
|
|
113
|
+
}
|
|
114
|
+
);
|
|
53
115
|
var IconChrome = (props) => /* @__PURE__ */ jsxs("svg", { width: 24, height: 24, viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...props, children: [
|
|
54
116
|
/* @__PURE__ */ jsxs("g", { clipPath: "url(#clip2_4460_12124)", children: [
|
|
55
117
|
/* @__PURE__ */ jsx(
|
|
@@ -1225,6 +1287,6 @@ var YoutubeIcon = (props) => /* @__PURE__ */ jsxs(
|
|
|
1225
1287
|
}
|
|
1226
1288
|
);
|
|
1227
1289
|
|
|
1228
|
-
export { FaceBookIcon, IconAndroid, IconApple, IconChrome, IconChromeColor, IconClose, IconEdge, IconEdgeColor, IconElectionsGeneral, IconElectionsRegionalesYMunicipales, IconHome, IconHuawei, IconLogoONPE, IconMozilla, IconMozillaColor, IconPhone, IconSafari, IconSafariColor, IconVotoDigital, IconWarning, IconWindow, InstagramIcon, TikTokIcon, WhatsappIcon, XIcon, YoutubeIcon };
|
|
1229
|
-
//# sourceMappingURL=chunk-
|
|
1230
|
-
//# sourceMappingURL=chunk-
|
|
1290
|
+
export { FaceBookIcon, IconAndroid, IconApple, IconCheck, IconChrome, IconChromeColor, IconClose, IconEdge, IconEdgeColor, IconElectionsGeneral, IconElectionsRegionalesYMunicipales, IconHome, IconHuawei, IconInfo, IconLogoONPE, IconMozilla, IconMozillaColor, IconPhone, IconQuestion, IconSafari, IconSafariColor, IconSpinnerDesktop, IconSpinnerMobile, IconVotoDigital, IconWarning, IconWarningNotRecommended, IconWindow, InstagramIcon, TikTokIcon, WhatsappIcon, XIcon, YoutubeIcon };
|
|
1291
|
+
//# sourceMappingURL=chunk-M2KQXQLY.mjs.map
|
|
1292
|
+
//# sourceMappingURL=chunk-M2KQXQLY.mjs.map
|