@votodigital-onpeui/react 0.1.37 → 0.1.40

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.
@@ -5,7 +5,7 @@ type ModalType = "warning" | "success" | "question" | "info" | "none";
5
5
  interface ModalConfirmProps {
6
6
  isOpen: boolean;
7
7
  onClose: () => void;
8
- title: string;
8
+ title?: string;
9
9
  /** Contenido del modal (string o JSX) */
10
10
  message?: ReactNode;
11
11
  /** Alias de message */
@@ -5,7 +5,7 @@ type ModalType = "warning" | "success" | "question" | "info" | "none";
5
5
  interface ModalConfirmProps {
6
6
  isOpen: boolean;
7
7
  onClose: () => void;
8
- title: string;
8
+ title?: string;
9
9
  /** Contenido del modal (string o JSX) */
10
10
  message?: ReactNode;
11
11
  /** Alias de message */
@@ -67,6 +67,12 @@ function renderIcon(type, colorClass) {
67
67
  }
68
68
  return /* @__PURE__ */ jsx(IconWarningNotRecommended, { role: "presentation", className: `w-16 h-16 ${colorClass}` });
69
69
  }
70
+ var defaultTitleByType = {
71
+ success: "Confirmaci\xF3n",
72
+ warning: "Advertencia",
73
+ question: "Atenci\xF3n",
74
+ info: "Informaci\xF3n"
75
+ };
70
76
  var ModalConfirm = ({
71
77
  isOpen = false,
72
78
  onClose = () => {
@@ -97,11 +103,12 @@ var ModalConfirm = ({
97
103
  }) => {
98
104
  const titleId = "modal-confirm-title";
99
105
  const messageId = "modal-confirm-message";
106
+ const effectiveTitle = title ?? defaultTitleByType[type] ?? "";
100
107
  const effectiveMessage = message ?? content;
101
108
  const effectiveColorClass = color ? colorOverrideMap[color] ?? "text-onpe-skyblue" : "text-onpe-skyblue";
102
109
  const isConfirmMode = buttonMode === "confirm";
103
110
  const showTwoButtons = buttonMode === "double" || isConfirmMode;
104
- const confirmLabel = textButtonConfirm ?? (isConfirmMode ? "S\xED" : "Confirmar");
111
+ const confirmLabel = textButtonConfirm ?? (isConfirmMode ? "S\xED" : "Aceptar");
105
112
  const cancelLabel = textButtonCancel ?? (isConfirmMode ? "No" : "Cancelar");
106
113
  const handleConfirm = async () => {
107
114
  try {
@@ -141,7 +148,7 @@ var ModalConfirm = ({
141
148
  "text-lg md:text-2xl font-semibold text-center mt-0 md:mt-4",
142
149
  effectiveColorClass
143
150
  ].join(" "),
144
- children: title
151
+ children: effectiveTitle
145
152
  }
146
153
  ),
147
154
  effectiveMessage && (typeof effectiveMessage === "string" ? /* @__PURE__ */ jsx(
@@ -267,5 +274,5 @@ var ModalLoading = ({
267
274
  };
268
275
 
269
276
  export { Button, ModalConfirm, ModalLoading };
270
- //# sourceMappingURL=chunk-52VIQAQL.mjs.map
271
- //# sourceMappingURL=chunk-52VIQAQL.mjs.map
277
+ //# sourceMappingURL=chunk-MPLFICE6.mjs.map
278
+ //# sourceMappingURL=chunk-MPLFICE6.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-MPLFICE6.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\nconst defaultTitleByType: Record<string, string> = {\r\n success: \"Confirmación\",\r\n warning: \"Advertencia\",\r\n question: \"Atención\",\r\n info: \"Información\",\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 /**\r\n * \"single\" → un botón \"Confirmar\".\r\n * \"double\" → \"Cancelar\" + \"Confirmar\".\r\n * \"confirm\" → \"No\" + \"Sí\" (diálogo de confirmación Sí/No).\r\n */\r\n buttonMode?: \"single\" | \"double\" | \"confirm\";\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 /** Muestra el botón X para cerrar el modal */\r\n closeButton?: boolean;\r\n /** Alinea el texto del mensaje a la izquierda (justify) en vez de centrado */\r\n alignJustify?: boolean;\r\n /** Alinea el modal al tope de la pantalla en vez de al centro */\r\n alignTop?: boolean;\r\n /** Habilita animación de entrada/salida (default: true) */\r\n animated?: boolean;\r\n /** Bloquea el scroll del body mientras el modal está abierto (default: true) */\r\n preventBodyScroll?: 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,\r\n textButtonCancel,\r\n className = \"\",\r\n zIndexLevel = 100,\r\n disableFocus = false,\r\n closeButton = false,\r\n alignJustify = false,\r\n alignTop = false,\r\n animated = true,\r\n preventBodyScroll = true,\r\n}: ModalConfirmProps) => {\r\n const titleId = \"modal-confirm-title\";\r\n const messageId = \"modal-confirm-message\";\r\n\r\n const effectiveTitle = title ?? defaultTitleByType[type] ?? \"\";\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 isConfirmMode = buttonMode === \"confirm\";\r\n const showTwoButtons = buttonMode === \"double\" || isConfirmMode;\r\n const confirmLabel = textButtonConfirm ?? (isConfirmMode ? \"Sí\" : \"Aceptar\");\r\n const cancelLabel = textButtonCancel ?? (isConfirmMode ? \"No\" : \"Cancelar\");\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={closeButton}\r\n closeDisabled={closeDisabled}\r\n zIndexLevel={zIndexLevel}\r\n aria-labelledby={titleId}\r\n aria-describedby={messageId}\r\n disableFocus={disableFocus}\r\n alignTop={alignTop}\r\n animated={animated}\r\n preventBodyScroll={preventBodyScroll}\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 {effectiveTitle}\r\n </p>\r\n\r\n {/* Mensaje / Contenido */}\r\n {effectiveMessage && (\r\n typeof effectiveMessage === \"string\" ? (\r\n <div\r\n id={messageId}\r\n className={`mt-7 text-sm md:text-lg max-w-full text-black ${alignJustify ? \"text-justify\" : \"text-center\"}`}\r\n dangerouslySetInnerHTML={{ __html: effectiveMessage }}\r\n />\r\n ) : (\r\n <div\r\n id={messageId}\r\n className={`mt-7 text-sm md:text-lg max-w-full text-black ${alignJustify ? \"text-justify\" : \"text-center\"}`}\r\n >\r\n {effectiveMessage}\r\n </div>\r\n )\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={confirmLabel}\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={cancelLabel}\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={cancelLabel}\r\n onClick={handleCancel}\r\n />\r\n )}\r\n <Button\r\n className=\"w-[200px]\"\r\n color=\"red\"\r\n title={confirmLabel}\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 { type ReactNode, 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 animated?: boolean;\r\n preventBodyScroll?: boolean;\r\n /** Spinner personalizado. Si no se provee, se usa el spinner por defecto de la librería. */\r\n spinner?: ReactNode;\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 animated = true,\r\n preventBodyScroll = true,\r\n spinner,\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 animated={animated}\r\n preventBodyScroll={preventBodyScroll}\r\n >\r\n <div className=\"sr-only\" aria-live=\"assertive\" aria-atomic=\"true\">\r\n {announceMessage}\r\n </div>\r\n {spinner ?? (\r\n <>\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 </>\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,7 +1,7 @@
1
1
  import * as react_jsx_runtime from 'react/jsx-runtime';
2
2
  import * as react from 'react';
3
3
  import { HTMLAttributes, ReactNode } from 'react';
4
- export { M as ModalConfirm, a as ModalConfirmProps } from './ModalConfirm-CZJCfya3.mjs';
4
+ export { M as ModalConfirm, a as ModalConfirmProps } from './ModalConfirm-aUXxpQ-H.mjs';
5
5
 
6
6
  type ButtonColor = "blue" | "skyblue" | "skyblue-light" | "yellow" | "light-skyblue" | "gray" | "gray-light" | "gray-extra-light" | "red" | "dark-gray" | "green" | "yellow-light" | "primary";
7
7
  type ButtonSize = "small" | "normal" | "large";
@@ -1,7 +1,7 @@
1
1
  import * as react_jsx_runtime from 'react/jsx-runtime';
2
2
  import * as react from 'react';
3
3
  import { HTMLAttributes, ReactNode } from 'react';
4
- export { M as ModalConfirm, a as ModalConfirmProps } from './ModalConfirm-CZJCfya3.js';
4
+ export { M as ModalConfirm, a as ModalConfirmProps } from './ModalConfirm-aUXxpQ-H.js';
5
5
 
6
6
  type ButtonColor = "blue" | "skyblue" | "skyblue-light" | "yellow" | "light-skyblue" | "gray" | "gray-light" | "gray-extra-light" | "red" | "dark-gray" | "green" | "yellow-light" | "primary";
7
7
  type ButtonSize = "small" | "normal" | "large";
@@ -1174,6 +1174,12 @@ function renderIcon(type, colorClass) {
1174
1174
  }
1175
1175
  return /* @__PURE__ */ jsxRuntime.jsx(IconWarningNotRecommended, { role: "presentation", className: `w-16 h-16 ${colorClass}` });
1176
1176
  }
1177
+ var defaultTitleByType = {
1178
+ success: "Confirmaci\xF3n",
1179
+ warning: "Advertencia",
1180
+ question: "Atenci\xF3n",
1181
+ info: "Informaci\xF3n"
1182
+ };
1177
1183
  var ModalConfirm = ({
1178
1184
  isOpen = false,
1179
1185
  onClose = () => {
@@ -1204,11 +1210,12 @@ var ModalConfirm = ({
1204
1210
  }) => {
1205
1211
  const titleId = "modal-confirm-title";
1206
1212
  const messageId = "modal-confirm-message";
1213
+ const effectiveTitle = title ?? defaultTitleByType[type] ?? "";
1207
1214
  const effectiveMessage = message ?? content;
1208
1215
  const effectiveColorClass = color ? colorOverrideMap[color] ?? "text-onpe-skyblue" : "text-onpe-skyblue";
1209
1216
  const isConfirmMode = buttonMode === "confirm";
1210
1217
  const showTwoButtons = buttonMode === "double" || isConfirmMode;
1211
- const confirmLabel = textButtonConfirm ?? (isConfirmMode ? "S\xED" : "Confirmar");
1218
+ const confirmLabel = textButtonConfirm ?? (isConfirmMode ? "S\xED" : "Aceptar");
1212
1219
  const cancelLabel = textButtonCancel ?? (isConfirmMode ? "No" : "Cancelar");
1213
1220
  const handleConfirm = async () => {
1214
1221
  try {
@@ -1248,7 +1255,7 @@ var ModalConfirm = ({
1248
1255
  "text-lg md:text-2xl font-semibold text-center mt-0 md:mt-4",
1249
1256
  effectiveColorClass
1250
1257
  ].join(" "),
1251
- children: title
1258
+ children: effectiveTitle
1252
1259
  }
1253
1260
  ),
1254
1261
  effectiveMessage && (typeof effectiveMessage === "string" ? /* @__PURE__ */ jsxRuntime.jsx(