componentes-sinco 1.0.24 → 1.0.26
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/create-KZGO2OZA.svg +18 -0
- package/dist/empty-3NEKE7WO.svg +13 -0
- package/dist/error-RUCZUXDN.svg +5 -0
- package/dist/index.cjs +962 -1997
- package/dist/index.cjs.map +1 -1
- package/dist/index.d.cts +14 -84
- package/dist/index.d.ts +14 -84
- package/dist/index.js +908 -1940
- package/dist/index.js.map +1 -1
- package/dist/search-OKSCVF2W.svg +12 -0
- package/package.json +1 -1
package/dist/index.cjs
CHANGED
|
@@ -55,785 +55,61 @@ var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__ge
|
|
|
55
55
|
mod
|
|
56
56
|
));
|
|
57
57
|
var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
|
|
75
|
-
|
|
76
|
-
|
|
77
|
-
|
|
78
|
-
|
|
79
|
-
|
|
80
|
-
|
|
81
|
-
|
|
82
|
-
|
|
83
|
-
|
|
84
|
-
|
|
85
|
-
|
|
86
|
-
|
|
87
|
-
|
|
88
|
-
|
|
89
|
-
|
|
90
|
-
|
|
91
|
-
|
|
92
|
-
|
|
93
|
-
|
|
94
|
-
|
|
95
|
-
|
|
96
|
-
|
|
97
|
-
SCDrawer: () => SCDrawer,
|
|
98
|
-
SCMenu: () => SCMenu,
|
|
99
|
-
SCModal: () => SCModal,
|
|
100
|
-
SCSelect: () => SCSelect,
|
|
101
|
-
SCTabs: () => SCTabs,
|
|
102
|
-
SCTextArea: () => SCTextArea,
|
|
103
|
-
SCTextField: () => SCTextField,
|
|
104
|
-
SCTime: () => SCTime,
|
|
105
|
-
SCToastNotification: () => SCToastNotification,
|
|
106
|
-
SincoTheme: () => SincoTheme,
|
|
107
|
-
ToastProgress: () => ToastProgress,
|
|
108
|
-
capitalize: () => capitalize,
|
|
109
|
-
getButtonColor: () => getButtonColor,
|
|
110
|
-
getIcon: () => getIcon,
|
|
111
|
-
getIconComponent: () => getIconComponent,
|
|
112
|
-
getIconMultiSelect: () => getIconMultiSelect,
|
|
113
|
-
getModalColor: () => getModalColor,
|
|
114
|
-
modalStateConfig: () => modalStateConfig,
|
|
115
|
-
useFilteredItems: () => useFilteredItems,
|
|
116
|
-
useMultiSelectHandlers: () => useMultiSelectHandlers,
|
|
117
|
-
useProgress: () => useProgress
|
|
118
|
-
});
|
|
119
|
-
module.exports = __toCommonJS(src_exports);
|
|
120
|
-
|
|
121
|
-
// src/Components/Adjuntar/Adjuntar.tsx
|
|
122
|
-
var import_react5 = __toESM(require("react"), 1);
|
|
123
|
-
var import_material3 = require("@mui/material");
|
|
124
|
-
var import_icons_material5 = require("@mui/icons-material");
|
|
125
|
-
|
|
126
|
-
// src/Components/ToastNotification/SCToastNotification.tsx
|
|
127
|
-
var import_react2 = __toESM(require("react"), 1);
|
|
128
|
-
var import_material = require("@mui/material");
|
|
129
|
-
var import_icons_material = require("@mui/icons-material");
|
|
130
|
-
|
|
131
|
-
// src/Components/ToastNotification/useProgress.ts
|
|
132
|
-
var import_react = require("react");
|
|
133
|
-
var useProgress = (timeProgress, lote) => {
|
|
134
|
-
const [progress, setProgress] = (0, import_react.useState)(0);
|
|
135
|
-
(0, import_react.useEffect)(() => {
|
|
136
|
-
const interval = setInterval(() => {
|
|
137
|
-
setProgress((prev) => {
|
|
138
|
-
if (prev >= 100) {
|
|
139
|
-
clearInterval(interval);
|
|
140
|
-
}
|
|
141
|
-
if (lote) {
|
|
142
|
-
const nextProgress = prev + lote;
|
|
143
|
-
return nextProgress <= 100 ? nextProgress : 100;
|
|
144
|
-
} else {
|
|
145
|
-
return prev + 1;
|
|
146
|
-
}
|
|
147
|
-
});
|
|
148
|
-
}, timeProgress * 10);
|
|
149
|
-
return () => {
|
|
150
|
-
clearInterval(interval);
|
|
151
|
-
};
|
|
152
|
-
}, [timeProgress, lote]);
|
|
153
|
-
return {
|
|
154
|
-
progress
|
|
155
|
-
};
|
|
156
|
-
};
|
|
157
|
-
var ToastProgress = (timeProgress) => {
|
|
158
|
-
const [progress, setProgress] = (0, import_react.useState)(100);
|
|
159
|
-
(0, import_react.useEffect)(() => {
|
|
160
|
-
const interval = setInterval(() => {
|
|
161
|
-
setProgress((prev) => {
|
|
162
|
-
if (prev <= 0) {
|
|
163
|
-
clearInterval(interval);
|
|
164
|
-
}
|
|
165
|
-
return prev - 1;
|
|
166
|
-
});
|
|
167
|
-
}, timeProgress * 10);
|
|
168
|
-
return () => {
|
|
169
|
-
clearInterval(interval);
|
|
170
|
-
};
|
|
171
|
-
}, [timeProgress]);
|
|
172
|
-
return {
|
|
173
|
-
progressToast: progress
|
|
174
|
-
};
|
|
175
|
-
};
|
|
176
|
-
|
|
177
|
-
// src/Components/ToastNotification/SCToastNotification.tsx
|
|
178
|
-
var SCToastNotification = (toast) => {
|
|
179
|
-
var _a;
|
|
180
|
-
const [stateOptions, setStateOptions] = (0, import_react2.useState)(true);
|
|
181
|
-
const [stateToast, setStateToast] = (0, import_react2.useState)(true);
|
|
182
|
-
const timeProgress = toast.time || 10;
|
|
183
|
-
const { progress } = useProgress(timeProgress);
|
|
184
|
-
const toastColorConfig = toast.type || "info";
|
|
185
|
-
const toastIconOption = {
|
|
186
|
-
success: /* @__PURE__ */ import_react2.default.createElement(import_icons_material.CheckCircleRounded, { color: "success" }),
|
|
187
|
-
error: /* @__PURE__ */ import_react2.default.createElement(import_icons_material.ErrorRounded, { color: "error" }),
|
|
188
|
-
warning: /* @__PURE__ */ import_react2.default.createElement(import_icons_material.WarningRounded, { color: "warning" }),
|
|
189
|
-
info: /* @__PURE__ */ import_react2.default.createElement(import_icons_material.InfoRounded, { color: "info" })
|
|
190
|
-
};
|
|
191
|
-
const acciones = [...toast.actions || [{ text: "Action", fn: () => {
|
|
192
|
-
alert("");
|
|
193
|
-
} }, { text: "Consultar", fn: () => {
|
|
194
|
-
} }]];
|
|
195
|
-
const ToastIconConfig = toastIconOption[toast.type];
|
|
196
|
-
const closeToast = () => {
|
|
197
|
-
setStateToast(false);
|
|
198
|
-
};
|
|
199
|
-
const toggleToastOptions = () => {
|
|
200
|
-
setStateOptions((prevShowOptions) => !prevShowOptions);
|
|
201
|
-
};
|
|
202
|
-
(0, import_react2.useEffect)(() => {
|
|
203
|
-
progress >= 100 && setStateToast(false);
|
|
204
|
-
}, [progress]);
|
|
205
|
-
return /* @__PURE__ */ import_react2.default.createElement(import_react2.default.Fragment, null, stateToast && /* @__PURE__ */ import_react2.default.createElement(
|
|
206
|
-
import_material.Stack,
|
|
207
|
-
{
|
|
208
|
-
position: "fixed",
|
|
209
|
-
zIndex: 1400,
|
|
210
|
-
right: 16,
|
|
211
|
-
top: 16,
|
|
212
|
-
width: 370,
|
|
213
|
-
sx: {
|
|
214
|
-
boxShadow: (theme) => theme.shadows[8]
|
|
215
|
-
}
|
|
216
|
-
},
|
|
217
|
-
/* @__PURE__ */ import_react2.default.createElement(
|
|
218
|
-
import_material.Box,
|
|
219
|
-
{
|
|
220
|
-
padding: 1.5,
|
|
221
|
-
gap: 1.5,
|
|
222
|
-
display: "flex",
|
|
223
|
-
alignItems: "center",
|
|
224
|
-
sx: {
|
|
225
|
-
backgroundColor: {
|
|
226
|
-
success: "success.50",
|
|
227
|
-
error: "error.50",
|
|
228
|
-
warning: "warning.50",
|
|
229
|
-
info: "info.50"
|
|
230
|
-
}[toastColorConfig]
|
|
231
|
-
}
|
|
232
|
-
},
|
|
233
|
-
/* @__PURE__ */ import_react2.default.createElement(
|
|
234
|
-
import_material.Stack,
|
|
235
|
-
{
|
|
236
|
-
p: 1,
|
|
237
|
-
gap: 1,
|
|
238
|
-
borderRadius: 50,
|
|
239
|
-
bgcolor: {
|
|
240
|
-
success: "success.100",
|
|
241
|
-
error: "error.100",
|
|
242
|
-
warning: "warning.100",
|
|
243
|
-
info: "info.100"
|
|
244
|
-
}[(_a = toast.type) != null ? _a : "info"]
|
|
245
|
-
},
|
|
246
|
-
/* @__PURE__ */ import_react2.default.createElement(import_material.Stack, null, ToastIconConfig)
|
|
247
|
-
),
|
|
248
|
-
/* @__PURE__ */ import_react2.default.createElement(import_material.Divider, { orientation: "vertical", flexItem: true }),
|
|
249
|
-
/* @__PURE__ */ import_react2.default.createElement(import_material.Stack, { width: 285 }, /* @__PURE__ */ import_react2.default.createElement(
|
|
250
|
-
import_material.Stack,
|
|
251
|
-
{
|
|
252
|
-
justifyContent: "space-between",
|
|
253
|
-
flexDirection: "row",
|
|
254
|
-
alignItems: "center"
|
|
255
|
-
},
|
|
256
|
-
/* @__PURE__ */ import_react2.default.createElement(import_material.Typography, { variant: "subtitle2", color: "text.primary" }, toast.title),
|
|
257
|
-
/* @__PURE__ */ import_react2.default.createElement(
|
|
258
|
-
import_material.IconButton,
|
|
259
|
-
{
|
|
260
|
-
size: "small",
|
|
261
|
-
"data-testid": "close-icon",
|
|
262
|
-
onClick: closeToast
|
|
263
|
-
},
|
|
264
|
-
/* @__PURE__ */ import_react2.default.createElement(import_icons_material.Close, { fontSize: "small" })
|
|
265
|
-
)
|
|
266
|
-
), /* @__PURE__ */ import_react2.default.createElement(import_material.Stack, { gap: 0.5 }, /* @__PURE__ */ import_react2.default.createElement(import_material.Typography, { color: "text.primary", variant: "body2" }, toast.subtitle), !stateOptions && toast.listITems && toast.listITems.length > 0 && /* @__PURE__ */ import_react2.default.createElement(import_material.Stack, null, toast.listITems.map((element, i) => /* @__PURE__ */ import_react2.default.createElement(import_material.Typography, { variant: "caption", key: i }, "\u2022 ", element)))), /* @__PURE__ */ import_react2.default.createElement(import_material.Stack, { justifyContent: "flex-end", flexDirection: "row", gap: 0.5 }, toast.actions && toast.actions.length > 0 && /* @__PURE__ */ import_react2.default.createElement(import_material.Stack, { flexDirection: "row", gap: 0.5 }, toast.actions.map((button, index) => /* @__PURE__ */ import_react2.default.createElement(
|
|
267
|
-
import_material.Button,
|
|
268
|
-
{
|
|
269
|
-
key: index,
|
|
270
|
-
color: toast.type === "info" ? "info" : toast.type === "success" ? "success" : toast.type === "error" ? "error" : "warning",
|
|
271
|
-
variant: "text",
|
|
272
|
-
onClick: button.fn,
|
|
273
|
-
disabled: button.disabled || false,
|
|
274
|
-
size: "small"
|
|
275
|
-
},
|
|
276
|
-
button.text.charAt(0).toUpperCase() + button.text.slice(1).toLowerCase()
|
|
277
|
-
))), toast.seeMore && /* @__PURE__ */ import_react2.default.createElement(
|
|
278
|
-
import_material.Button,
|
|
279
|
-
{
|
|
280
|
-
onClick: toggleToastOptions,
|
|
281
|
-
size: "small",
|
|
282
|
-
variant: "text",
|
|
283
|
-
color: toastColorConfig
|
|
284
|
-
},
|
|
285
|
-
stateOptions ? "Ver m\xE1s" : "Ver menos",
|
|
286
|
-
stateOptions ? /* @__PURE__ */ import_react2.default.createElement(import_icons_material.KeyboardArrowDown, null) : /* @__PURE__ */ import_react2.default.createElement(import_icons_material.KeyboardArrowUp, null)
|
|
287
|
-
)))
|
|
288
|
-
),
|
|
289
|
-
/* @__PURE__ */ import_react2.default.createElement(
|
|
290
|
-
import_material.LinearProgress,
|
|
291
|
-
{
|
|
292
|
-
sx: {
|
|
293
|
-
".MuiLinearProgress-bar": {
|
|
294
|
-
transition: "0.1s linear !important",
|
|
295
|
-
transform: "scaleX(-1)"
|
|
296
|
-
}
|
|
297
|
-
},
|
|
298
|
-
color: toastColorConfig,
|
|
299
|
-
variant: "determinate",
|
|
300
|
-
value: 100 - progress
|
|
301
|
-
}
|
|
302
|
-
)
|
|
303
|
-
));
|
|
304
|
-
};
|
|
305
|
-
|
|
306
|
-
// src/Components/Modal/Helpers/Data.tsx
|
|
307
|
-
var import_react3 = __toESM(require("react"), 1);
|
|
308
|
-
var import_icons_material2 = require("@mui/icons-material");
|
|
309
|
-
var modalStateConfig = {
|
|
310
|
-
info: {
|
|
311
|
-
color: "info",
|
|
312
|
-
defaultDescription: "Se [sincronizar\xE1n] los datos trabajados en modo offline y se [subir\xE1n] a los servidores.",
|
|
313
|
-
icon: /* @__PURE__ */ import_react3.default.createElement(import_icons_material2.Info, { color: "info", fontSize: "medium" })
|
|
314
|
-
},
|
|
315
|
-
delete: {
|
|
316
|
-
color: "delete",
|
|
317
|
-
defaultDescription: "[Elemento espec\xEDfico] [dejar\xE1 de existir en todos los lugares donde est\xE9 en uso]. Esta acci\xF3n es irreversible.",
|
|
318
|
-
icon: /* @__PURE__ */ import_react3.default.createElement(import_icons_material2.Info, { color: "error", fontSize: "medium" })
|
|
319
|
-
},
|
|
320
|
-
warning: {
|
|
321
|
-
color: "warning",
|
|
322
|
-
defaultDescription: "Se descartar\xE1 la [creaci\xF3n] y los cambios se perder\xE1n.",
|
|
323
|
-
icon: /* @__PURE__ */ import_react3.default.createElement(import_icons_material2.Warning, { color: "warning", fontSize: "medium" })
|
|
324
|
-
}
|
|
325
|
-
};
|
|
326
|
-
|
|
327
|
-
// src/Components/Modal/Helpers/Utils.tsx
|
|
328
|
-
var MuiIcons = __toESM(require("@mui/icons-material"), 1);
|
|
329
|
-
var import_icons_material3 = require("@mui/icons-material");
|
|
330
|
-
var getIconComponent = (iconName) => {
|
|
331
|
-
return iconName && MuiIcons[iconName] ? MuiIcons[iconName] : import_icons_material3.FilterListOutlined;
|
|
332
|
-
};
|
|
333
|
-
var getModalColor = (state) => {
|
|
334
|
-
var _a;
|
|
335
|
-
const colors = {
|
|
336
|
-
info: "info.100",
|
|
337
|
-
delete: "error.100",
|
|
338
|
-
warning: "warning.100"
|
|
339
|
-
};
|
|
340
|
-
return (_a = colors[state]) != null ? _a : "warning.100";
|
|
341
|
-
};
|
|
342
|
-
var getButtonColor = (state) => {
|
|
343
|
-
var _a;
|
|
344
|
-
const colorMap = {
|
|
345
|
-
info: "info",
|
|
346
|
-
delete: "error",
|
|
347
|
-
warning: "warning"
|
|
348
|
-
};
|
|
349
|
-
return (_a = colorMap[state]) != null ? _a : "info";
|
|
350
|
-
};
|
|
351
|
-
|
|
352
|
-
// src/Components/Modal/SCModal.tsx
|
|
353
|
-
var import_react4 = __toESM(require("react"), 1);
|
|
354
|
-
var import_material2 = require("@mui/material");
|
|
355
|
-
var import_icons_material4 = require("@mui/icons-material");
|
|
356
|
-
|
|
357
|
-
// src/generales/capitalize.tsx
|
|
358
|
-
function capitalize(text) {
|
|
359
|
-
return text.charAt(0).toUpperCase() + text.slice(1);
|
|
360
|
-
}
|
|
361
|
-
|
|
362
|
-
// src/Components/Modal/SCModal.tsx
|
|
363
|
-
var SCModal = ({
|
|
364
|
-
buttonModal,
|
|
365
|
-
state = "info",
|
|
366
|
-
open,
|
|
367
|
-
setOpen,
|
|
368
|
-
title,
|
|
369
|
-
description,
|
|
370
|
-
action
|
|
371
|
-
}) => {
|
|
372
|
-
var _a, _b, _c, _d, _e;
|
|
373
|
-
const [internalOpen, setInternalOpen] = (0, import_react4.useState)(open != null ? open : false);
|
|
374
|
-
const isControlled = Boolean(setOpen);
|
|
375
|
-
const modalOpen = isControlled ? open != null ? open : false : internalOpen;
|
|
376
|
-
const setModalOpen = isControlled ? setOpen : setInternalOpen;
|
|
377
|
-
const handleToggle = (0, import_react4.useCallback)(() => setModalOpen((prev) => !prev), [setModalOpen]);
|
|
378
|
-
const handleClose = (0, import_react4.useCallback)(() => setModalOpen(false), [setModalOpen]);
|
|
379
|
-
const Icon = (0, import_react4.useMemo)(() => getIconComponent(buttonModal == null ? void 0 : buttonModal.icon), [buttonModal == null ? void 0 : buttonModal.icon]);
|
|
380
|
-
const prevAction = (0, import_react4.useMemo)(
|
|
381
|
-
() => action != null ? action : [
|
|
382
|
-
{ text: "Cancelar", fn: handleClose },
|
|
383
|
-
{ text: "Consultar", fn: () => {
|
|
384
|
-
} }
|
|
385
|
-
],
|
|
386
|
-
[action, handleClose]
|
|
387
|
-
);
|
|
388
|
-
const { icon, defaultDescription } = modalStateConfig[state];
|
|
389
|
-
return /* @__PURE__ */ import_react4.default.createElement(import_react4.default.Fragment, null, buttonModal && /* @__PURE__ */ import_react4.default.createElement(
|
|
390
|
-
import_material2.Button,
|
|
391
|
-
{
|
|
392
|
-
"data-testid": "test-buttonModal",
|
|
393
|
-
color: (_a = buttonModal == null ? void 0 : buttonModal.color) != null ? _a : "primary",
|
|
394
|
-
onClick: handleToggle,
|
|
395
|
-
variant: (_b = buttonModal == null ? void 0 : buttonModal.variant) != null ? _b : "text",
|
|
396
|
-
size: (_c = buttonModal == null ? void 0 : buttonModal.size) != null ? _c : "small",
|
|
397
|
-
startIcon: (buttonModal == null ? void 0 : buttonModal.iconPosition) === "left" && /* @__PURE__ */ import_react4.default.createElement(Icon, null),
|
|
398
|
-
endIcon: (buttonModal == null ? void 0 : buttonModal.iconPosition) === "right" && /* @__PURE__ */ import_react4.default.createElement(Icon, null)
|
|
399
|
-
},
|
|
400
|
-
capitalize((_d = buttonModal == null ? void 0 : buttonModal.text) != null ? _d : "filtrar")
|
|
401
|
-
), /* @__PURE__ */ import_react4.default.createElement(import_material2.Modal, { open: modalOpen, onClose: handleClose, sx: { boxShadow: 8 } }, /* @__PURE__ */ import_react4.default.createElement(
|
|
402
|
-
import_material2.Box,
|
|
403
|
-
{
|
|
404
|
-
sx: {
|
|
405
|
-
position: "absolute",
|
|
406
|
-
top: "50%",
|
|
407
|
-
left: "50%",
|
|
408
|
-
transform: "translate(-50%, -50%)",
|
|
409
|
-
width: 400,
|
|
410
|
-
bgcolor: "background.paper",
|
|
411
|
-
borderRadius: 1,
|
|
412
|
-
boxShadow: 24
|
|
413
|
-
}
|
|
414
|
-
},
|
|
415
|
-
/* @__PURE__ */ import_react4.default.createElement(import_material2.Stack, { direction: "row", justifyContent: "space-between", alignItems: "center" }, /* @__PURE__ */ import_react4.default.createElement(import_material2.Stack, { direction: "row", alignItems: "center", p: 1, gap: 1.5 }, /* @__PURE__ */ import_react4.default.createElement(
|
|
416
|
-
import_material2.Box,
|
|
417
|
-
{
|
|
418
|
-
display: "flex",
|
|
419
|
-
justifyContent: "center",
|
|
420
|
-
alignItems: "center",
|
|
421
|
-
borderRadius: "50%",
|
|
422
|
-
height: 36,
|
|
423
|
-
width: 36,
|
|
424
|
-
bgcolor: getModalColor(state)
|
|
425
|
-
},
|
|
426
|
-
icon
|
|
427
|
-
), /* @__PURE__ */ import_react4.default.createElement(import_material2.Typography, { variant: "h6", color: "text.primary" }, title)), /* @__PURE__ */ import_react4.default.createElement(import_material2.IconButton, { onClick: handleClose, "data-testid": "test-buttonClose" }, /* @__PURE__ */ import_react4.default.createElement(import_icons_material4.Close, { color: "action" }))),
|
|
428
|
-
/* @__PURE__ */ import_react4.default.createElement(import_material2.Stack, { py: 1, px: 3, gap: 1.5 }, /* @__PURE__ */ import_react4.default.createElement(import_material2.Typography, { variant: "body1" }, description || defaultDescription)),
|
|
429
|
-
action && /* @__PURE__ */ import_react4.default.createElement(
|
|
430
|
-
import_material2.Stack,
|
|
431
|
-
{
|
|
432
|
-
id: "Action",
|
|
433
|
-
direction: "row",
|
|
434
|
-
gap: 1,
|
|
435
|
-
p: 1,
|
|
436
|
-
justifyContent: "end",
|
|
437
|
-
bgcolor: "grey.50",
|
|
438
|
-
sx: { borderRadius: 1 }
|
|
439
|
-
},
|
|
440
|
-
/* @__PURE__ */ import_react4.default.createElement(
|
|
441
|
-
import_material2.Button,
|
|
442
|
-
{
|
|
443
|
-
color: "inherit",
|
|
444
|
-
variant: "text",
|
|
445
|
-
onClick: handleClose,
|
|
446
|
-
size: "small"
|
|
447
|
-
},
|
|
448
|
-
capitalize("cancelar")
|
|
449
|
-
),
|
|
450
|
-
/* @__PURE__ */ import_react4.default.createElement(
|
|
451
|
-
import_material2.Button,
|
|
452
|
-
{
|
|
453
|
-
"data-testid": "test-aceptar",
|
|
454
|
-
color: getButtonColor(state),
|
|
455
|
-
variant: "contained",
|
|
456
|
-
onClick: (_e = action[0]) == null ? void 0 : _e.fn,
|
|
457
|
-
disabled: false,
|
|
458
|
-
size: "small"
|
|
459
|
-
},
|
|
460
|
-
capitalize(action[0].text)
|
|
461
|
-
)
|
|
462
|
-
)
|
|
463
|
-
)));
|
|
464
|
-
};
|
|
465
|
-
|
|
466
|
-
// src/Components/Adjuntar/Adjuntar.tsx
|
|
467
|
-
var Attachment = ({
|
|
468
|
-
sx,
|
|
469
|
-
compact,
|
|
470
|
-
error,
|
|
471
|
-
maxSize = 400,
|
|
472
|
-
fileAccepted = "",
|
|
473
|
-
onLoading,
|
|
474
|
-
onChange,
|
|
475
|
-
downloadAction,
|
|
476
|
-
deleteAction,
|
|
477
|
-
initialFiles = []
|
|
478
|
-
}) => {
|
|
479
|
-
const [files, setFiles] = (0, import_react5.useState)([]);
|
|
480
|
-
const [fileToDelete, setFileToDelete] = (0, import_react5.useState)(null);
|
|
481
|
-
const [toast, setToast] = (0, import_react5.useState)(null);
|
|
482
|
-
const [openModal, setOpenModal] = (0, import_react5.useState)(false);
|
|
483
|
-
const [isDragFile, setIsDragFile] = (0, import_react5.useState)(false);
|
|
484
|
-
const inputRef = (0, import_react5.useRef)(null);
|
|
485
|
-
(0, import_react5.useEffect)(() => {
|
|
486
|
-
if (initialFiles && initialFiles.length > 0) {
|
|
487
|
-
const mapped = initialFiles.map((file) => {
|
|
488
|
-
if ("progress" in file) {
|
|
489
|
-
return file;
|
|
490
|
-
}
|
|
491
|
-
return {
|
|
492
|
-
name: file.name,
|
|
493
|
-
size: file.size,
|
|
494
|
-
type: file.type,
|
|
495
|
-
progress: 100,
|
|
496
|
-
uploadError: false
|
|
497
|
-
};
|
|
498
|
-
});
|
|
499
|
-
setFiles(mapped);
|
|
500
|
-
}
|
|
501
|
-
}, [initialFiles]);
|
|
502
|
-
const handleDrop = (event2) => {
|
|
503
|
-
event2.preventDefault();
|
|
504
|
-
setIsDragFile(false);
|
|
505
|
-
const filesDropped = event2.dataTransfer.files;
|
|
506
|
-
if (filesDropped && filesDropped.length > 0) {
|
|
507
|
-
const fakeEvent = {
|
|
508
|
-
target: { files: filesDropped }
|
|
509
|
-
};
|
|
510
|
-
handleUpload(fakeEvent);
|
|
511
|
-
}
|
|
512
|
-
};
|
|
513
|
-
const handleDragOver = (event2) => {
|
|
514
|
-
event2.preventDefault();
|
|
515
|
-
setIsDragFile(true);
|
|
516
|
-
};
|
|
517
|
-
const handleDragLeave = (event2) => {
|
|
518
|
-
event2.preventDefault();
|
|
519
|
-
setIsDragFile(false);
|
|
520
|
-
};
|
|
521
|
-
const handleUpload = (event2) => {
|
|
522
|
-
const newFiles = event2.target.files;
|
|
523
|
-
if (!newFiles) return;
|
|
524
|
-
const nuevosArchivos = [];
|
|
525
|
-
const archivosValidos = [];
|
|
526
|
-
Array.from(newFiles).forEach((file) => {
|
|
527
|
-
const isDuplicatedFile = files.findIndex(
|
|
528
|
-
(e) => e.name === file.name && e.size === file.size
|
|
529
|
-
);
|
|
530
|
-
const sizeMB = file.size / (1024 * 1024);
|
|
531
|
-
if (isDuplicatedFile !== -1) {
|
|
532
|
-
setToast({
|
|
533
|
-
type: "error",
|
|
534
|
-
title: "Archivo duplicado",
|
|
535
|
-
listITems: ["No se permiten archivos duplicados."],
|
|
536
|
-
seeMore: true,
|
|
537
|
-
time: 10
|
|
538
|
-
});
|
|
539
|
-
return;
|
|
540
|
-
}
|
|
541
|
-
if (sizeMB > maxSize) {
|
|
542
|
-
nuevosArchivos.push({
|
|
543
|
-
name: file.name,
|
|
544
|
-
size: file.size,
|
|
545
|
-
type: file.type,
|
|
546
|
-
progress: 0,
|
|
547
|
-
uploadError: true
|
|
548
|
-
});
|
|
549
|
-
setToast({
|
|
550
|
-
type: "error",
|
|
551
|
-
title: "Carga fallida",
|
|
552
|
-
seeMore: true,
|
|
553
|
-
listITems: [`El archivo supera el l\xEDmite de ${maxSize}MB.`],
|
|
554
|
-
time: 10
|
|
555
|
-
});
|
|
556
|
-
return;
|
|
557
|
-
}
|
|
558
|
-
if (fileAccepted && !file.name.match(
|
|
559
|
-
new RegExp(
|
|
560
|
-
`(${fileAccepted.replace(/\./g, "\\.").replace(/,/g, "|")})$`,
|
|
561
|
-
"i"
|
|
562
|
-
)
|
|
563
|
-
)) {
|
|
564
|
-
setToast({
|
|
565
|
-
type: "error",
|
|
566
|
-
title: "Tipo de archivo no permitido",
|
|
567
|
-
listITems: [`El archivo ${file.name} no es un tipo permitido.`],
|
|
568
|
-
seeMore: true,
|
|
569
|
-
time: 10
|
|
570
|
-
});
|
|
571
|
-
return;
|
|
572
|
-
}
|
|
573
|
-
nuevosArchivos.push({
|
|
574
|
-
name: file.name,
|
|
575
|
-
size: file.size,
|
|
576
|
-
type: file.type,
|
|
577
|
-
progress: 0,
|
|
578
|
-
uploadError: false
|
|
579
|
-
});
|
|
580
|
-
archivosValidos.push(file);
|
|
581
|
-
});
|
|
582
|
-
if (nuevosArchivos.length > 0) {
|
|
583
|
-
setFiles((prev) => {
|
|
584
|
-
const actualizados = [...prev, ...nuevosArchivos];
|
|
585
|
-
onChange == null ? void 0 : onChange([
|
|
586
|
-
...archivosValidos,
|
|
587
|
-
...prev.map((f) => new File([], f.name, { type: f.type }))
|
|
588
|
-
]);
|
|
589
|
-
return actualizados;
|
|
590
|
-
});
|
|
591
|
-
}
|
|
592
|
-
event2.target.value = "";
|
|
593
|
-
};
|
|
594
|
-
const deleteFiles = (nameFile) => {
|
|
595
|
-
setFiles((prev) => {
|
|
596
|
-
const filtered = prev.filter((e) => e.name !== nameFile);
|
|
597
|
-
onChange == null ? void 0 : onChange(
|
|
598
|
-
filtered.map((f) => new File([], f.name, { type: f.type }))
|
|
599
|
-
);
|
|
600
|
-
return filtered;
|
|
601
|
-
});
|
|
602
|
-
};
|
|
603
|
-
return /* @__PURE__ */ import_react5.default.createElement(import_material3.Stack, { spacing: 2 }, toast && /* @__PURE__ */ import_react5.default.createElement(SCToastNotification, __spreadValues({}, toast)), /* @__PURE__ */ import_react5.default.createElement(
|
|
604
|
-
"input",
|
|
605
|
-
{
|
|
606
|
-
type: "file",
|
|
607
|
-
multiple: true,
|
|
608
|
-
hidden: true,
|
|
609
|
-
ref: inputRef,
|
|
610
|
-
onChange: handleUpload
|
|
611
|
-
}
|
|
612
|
-
), /* @__PURE__ */ import_react5.default.createElement(
|
|
613
|
-
import_material3.Stack,
|
|
614
|
-
{
|
|
615
|
-
id: "ZonaAdjuntos",
|
|
616
|
-
justifyContent: "center",
|
|
617
|
-
alignItems: "center",
|
|
618
|
-
bgcolor: "transparent",
|
|
619
|
-
padding: compact ? "12px 16px" : "16px 24px",
|
|
620
|
-
height: compact ? "56px" : "100%",
|
|
621
|
-
flexDirection: compact ? "row" : "column",
|
|
622
|
-
gap: 1,
|
|
623
|
-
borderRadius: 1,
|
|
624
|
-
onClick: () => {
|
|
625
|
-
var _a;
|
|
626
|
-
return (_a = inputRef.current) == null ? void 0 : _a.click();
|
|
627
|
-
},
|
|
628
|
-
onDrop: handleDrop,
|
|
629
|
-
onDragOver: handleDragOver,
|
|
630
|
-
onDragLeave: handleDragLeave,
|
|
631
|
-
sx: __spreadValues({
|
|
632
|
-
border: error ? (theme) => `1px solid ${theme.palette.error.main}` : (theme) => `1px dashed ${theme.palette.grey[500]}`,
|
|
633
|
-
cursor: "pointer",
|
|
634
|
-
":hover": {
|
|
635
|
-
backgroundColor: error ? "error.50" : "action.hover"
|
|
636
|
-
}
|
|
637
|
-
}, sx)
|
|
638
|
-
},
|
|
639
|
-
onLoading ? /* @__PURE__ */ import_react5.default.createElement(
|
|
640
|
-
import_material3.Box,
|
|
641
|
-
{
|
|
642
|
-
display: "flex",
|
|
643
|
-
alignItems: "center",
|
|
644
|
-
justifyContent: "center",
|
|
645
|
-
width: "100%",
|
|
646
|
-
height: "450px"
|
|
647
|
-
},
|
|
648
|
-
/* @__PURE__ */ import_react5.default.createElement(
|
|
649
|
-
import_material3.CircularProgress,
|
|
650
|
-
{
|
|
651
|
-
sx: { width: "60px", height: "60px" },
|
|
652
|
-
variant: "indeterminate"
|
|
653
|
-
}
|
|
654
|
-
)
|
|
655
|
-
) : /* @__PURE__ */ import_react5.default.createElement(import_react5.default.Fragment, null, /* @__PURE__ */ import_react5.default.createElement(
|
|
656
|
-
import_material3.Box,
|
|
657
|
-
{
|
|
658
|
-
display: "flex",
|
|
659
|
-
bgcolor: error ? "error.50" : "primary.50",
|
|
660
|
-
borderRadius: "100%",
|
|
661
|
-
p: 1
|
|
662
|
-
},
|
|
663
|
-
/* @__PURE__ */ import_react5.default.createElement(
|
|
664
|
-
import_icons_material5.CloudUploadOutlined,
|
|
665
|
-
{
|
|
666
|
-
color: error ? "error" : "primary",
|
|
667
|
-
fontSize: "medium"
|
|
668
|
-
}
|
|
669
|
-
)
|
|
670
|
-
), /* @__PURE__ */ import_react5.default.createElement(
|
|
671
|
-
import_material3.Stack,
|
|
672
|
-
{
|
|
673
|
-
width: "100%",
|
|
674
|
-
flexDirection: compact ? "row" : "column",
|
|
675
|
-
alignItems: "center",
|
|
676
|
-
justifyContent: compact ? "space-between" : "center",
|
|
677
|
-
gap: 1
|
|
678
|
-
},
|
|
679
|
-
/* @__PURE__ */ import_react5.default.createElement(
|
|
680
|
-
import_material3.Stack,
|
|
681
|
-
{
|
|
682
|
-
flexDirection: "column",
|
|
683
|
-
alignItems: compact ? "start" : "center",
|
|
684
|
-
gap: 0.5
|
|
685
|
-
},
|
|
686
|
-
/* @__PURE__ */ import_react5.default.createElement(import_material3.Typography, { variant: "body2", color: "text.primary" }, "Arrastrar o adjuntar archivos"),
|
|
687
|
-
/* @__PURE__ */ import_react5.default.createElement(
|
|
688
|
-
import_material3.Typography,
|
|
689
|
-
{
|
|
690
|
-
variant: "caption",
|
|
691
|
-
color: error ? "error" : "text.secondary",
|
|
692
|
-
whiteSpace: "nowrap",
|
|
693
|
-
overflow: "hidden",
|
|
694
|
-
textOverflow: "ellipsis",
|
|
695
|
-
maxWidth: "450px"
|
|
696
|
-
},
|
|
697
|
-
error ? `${fileAccepted || "DOCX, XML, PNG, JPG"} \u2022 Archivo no soportado` : `${fileAccepted || "DOCX, XML, PNG, JPG"} \u2022 Max. ${maxSize}MB`
|
|
698
|
-
)
|
|
699
|
-
),
|
|
700
|
-
/* @__PURE__ */ import_react5.default.createElement(
|
|
701
|
-
import_material3.Button,
|
|
702
|
-
{
|
|
703
|
-
variant: "text",
|
|
704
|
-
color: "primary",
|
|
705
|
-
size: "small",
|
|
706
|
-
startIcon: /* @__PURE__ */ import_react5.default.createElement(import_icons_material5.AttachFileOutlined, { color: "primary", fontSize: "small" })
|
|
707
|
-
},
|
|
708
|
-
"Adjuntar"
|
|
709
|
-
)
|
|
710
|
-
))
|
|
711
|
-
), files.length > 0 && /* @__PURE__ */ import_react5.default.createElement(
|
|
712
|
-
import_material3.Stack,
|
|
713
|
-
{
|
|
714
|
-
id: "ContenedorArchivosAdjuntos",
|
|
715
|
-
width: "100%",
|
|
716
|
-
sx: __spreadValues({
|
|
717
|
-
overflowY: "auto"
|
|
718
|
-
}, files.length > 5 && {
|
|
719
|
-
maxHeight: 250
|
|
720
|
-
}),
|
|
721
|
-
spacing: 1
|
|
722
|
-
},
|
|
723
|
-
files.map((file) => /* @__PURE__ */ import_react5.default.createElement(
|
|
724
|
-
import_material3.Stack,
|
|
725
|
-
{
|
|
726
|
-
height: 46,
|
|
727
|
-
key: file.name + (file.uploadError ? "_error" : ""),
|
|
728
|
-
direction: "row",
|
|
729
|
-
alignItems: "center",
|
|
730
|
-
justifyContent: "space-between",
|
|
731
|
-
gap: 2,
|
|
732
|
-
padding: 1,
|
|
733
|
-
borderRadius: 1,
|
|
734
|
-
sx: {
|
|
735
|
-
backgroundColor: file.uploadError ? "error.50" : "transparent",
|
|
736
|
-
":hover": {
|
|
737
|
-
backgroundColor: file.uploadError ? "error.100" : "primary.50"
|
|
738
|
-
}
|
|
739
|
-
}
|
|
740
|
-
},
|
|
741
|
-
/* @__PURE__ */ import_react5.default.createElement(import_material3.Stack, { direction: "row", alignItems: "center", gap: 1, width: "100%" }, /* @__PURE__ */ import_react5.default.createElement(
|
|
742
|
-
import_icons_material5.UploadFileOutlined,
|
|
743
|
-
{
|
|
744
|
-
color: file.uploadError ? "error" : "primary",
|
|
745
|
-
fontSize: "small"
|
|
746
|
-
}
|
|
747
|
-
), /* @__PURE__ */ import_react5.default.createElement(import_material3.Stack, { width: "100%" }, /* @__PURE__ */ import_react5.default.createElement(
|
|
748
|
-
import_material3.Typography,
|
|
749
|
-
{
|
|
750
|
-
variant: "body2",
|
|
751
|
-
color: "text.primary",
|
|
752
|
-
whiteSpace: "nowrap",
|
|
753
|
-
overflow: "hidden",
|
|
754
|
-
textOverflow: "ellipsis",
|
|
755
|
-
maxWidth: "310px"
|
|
756
|
-
},
|
|
757
|
-
file.name
|
|
758
|
-
), /* @__PURE__ */ import_react5.default.createElement(
|
|
759
|
-
import_material3.Typography,
|
|
760
|
-
{
|
|
761
|
-
variant: "caption",
|
|
762
|
-
color: file.uploadError ? "error" : "text.secondary"
|
|
763
|
-
},
|
|
764
|
-
file.uploadError && file.size / (1024 * 1024) > maxSize ? "Archivo super\xF3 el l\xEDmite \u2022 Carga fallida" : file.uploadError ? "Archivo duplicado o inv\xE1lido \u2022 Carga fallida" : `${(file.size / (1024 * 1024)).toFixed(2)}MB \u2022 ${file.type}`
|
|
765
|
-
))),
|
|
766
|
-
/* @__PURE__ */ import_react5.default.createElement(import_material3.Tooltip, { title: "Descargar" }, /* @__PURE__ */ import_react5.default.createElement(import_material3.IconButton, { size: "small", onClick: () => downloadAction == null ? void 0 : downloadAction(file.name) }, /* @__PURE__ */ import_react5.default.createElement(import_icons_material5.FileDownload, { fontSize: "small", color: "action" }))),
|
|
767
|
-
/* @__PURE__ */ import_react5.default.createElement(import_material3.Tooltip, { title: "Eliminar" }, /* @__PURE__ */ import_react5.default.createElement(
|
|
768
|
-
import_material3.IconButton,
|
|
769
|
-
{
|
|
770
|
-
size: "small",
|
|
771
|
-
onClick: () => {
|
|
772
|
-
setFileToDelete(file);
|
|
773
|
-
setOpenModal(true);
|
|
774
|
-
}
|
|
775
|
-
},
|
|
776
|
-
/* @__PURE__ */ import_react5.default.createElement(import_icons_material5.DeleteOutline, { fontSize: "small", color: "action" })
|
|
777
|
-
))
|
|
778
|
-
))
|
|
779
|
-
), /* @__PURE__ */ import_react5.default.createElement(
|
|
780
|
-
SCModal,
|
|
781
|
-
{
|
|
782
|
-
state: "delete",
|
|
783
|
-
open: openModal,
|
|
784
|
-
setOpen: setOpenModal,
|
|
785
|
-
title: "Eliminar archivo",
|
|
786
|
-
description: `\xBFEst\xE1s seguro que deseas eliminar "${fileToDelete == null ? void 0 : fileToDelete.name}"?`,
|
|
787
|
-
action: [
|
|
788
|
-
{
|
|
789
|
-
text: "Eliminar",
|
|
790
|
-
fn: () => __async(void 0, null, function* () {
|
|
791
|
-
if (fileToDelete) {
|
|
792
|
-
try {
|
|
793
|
-
if (deleteAction) {
|
|
794
|
-
yield deleteAction(fileToDelete.name);
|
|
795
|
-
}
|
|
796
|
-
deleteFiles(fileToDelete.name);
|
|
797
|
-
setToast({
|
|
798
|
-
title: "Archivo eliminado",
|
|
799
|
-
type: "success",
|
|
800
|
-
time: 2
|
|
801
|
-
});
|
|
802
|
-
} catch (error2) {
|
|
803
|
-
setToast({
|
|
804
|
-
title: "Error al eliminar archivo",
|
|
805
|
-
type: "error",
|
|
806
|
-
time: 4
|
|
807
|
-
});
|
|
808
|
-
} finally {
|
|
809
|
-
setFileToDelete(null);
|
|
810
|
-
setOpenModal(false);
|
|
811
|
-
}
|
|
812
|
-
}
|
|
813
|
-
})
|
|
814
|
-
}
|
|
815
|
-
]
|
|
816
|
-
}
|
|
817
|
-
));
|
|
818
|
-
};
|
|
58
|
+
|
|
59
|
+
// src/index.ts
|
|
60
|
+
var src_exports = {};
|
|
61
|
+
__export(src_exports, {
|
|
62
|
+
ADCSincoTheme: () => ADCSincoTheme,
|
|
63
|
+
AdproSincoTheme: () => AdproSincoTheme,
|
|
64
|
+
Calendar: () => Calendar,
|
|
65
|
+
EmptyState: () => EmptyState,
|
|
66
|
+
FooterAction: () => FooterAction,
|
|
67
|
+
MultiSelect: () => MultiSelect,
|
|
68
|
+
PageHeader: () => PageHeader,
|
|
69
|
+
SCAutocomplete: () => SCAutocomplete,
|
|
70
|
+
SCCalendarSwipeable: () => SCCalendarSwipeable,
|
|
71
|
+
SCDataGrid: () => SCDataGrid,
|
|
72
|
+
SCDataGridInitial: () => SCDataGridInitial,
|
|
73
|
+
SCDateRange: () => SCDateRange,
|
|
74
|
+
SCDialog: () => SCDialog,
|
|
75
|
+
SCDrawer: () => SCDrawer,
|
|
76
|
+
SCMenu: () => SCMenu,
|
|
77
|
+
SCModal: () => SCModal,
|
|
78
|
+
SCSelect: () => SCSelect,
|
|
79
|
+
SCTabs: () => SCTabs,
|
|
80
|
+
SCTextArea: () => SCTextArea,
|
|
81
|
+
SCTextField: () => SCTextField,
|
|
82
|
+
SCToastNotification: () => SCToastNotification,
|
|
83
|
+
SincoTheme: () => SincoTheme,
|
|
84
|
+
ToastProgress: () => ToastProgress,
|
|
85
|
+
capitalize: () => capitalize,
|
|
86
|
+
getButtonColor: () => getButtonColor,
|
|
87
|
+
getIcon: () => getIcon,
|
|
88
|
+
getIconComponent: () => getIconComponent2,
|
|
89
|
+
getIconMultiSelect: () => getIconMultiSelect,
|
|
90
|
+
getModalColor: () => getModalColor,
|
|
91
|
+
modalStateConfig: () => modalStateConfig,
|
|
92
|
+
useFilteredItems: () => useFilteredItems,
|
|
93
|
+
useMultiSelectHandlers: () => useMultiSelectHandlers,
|
|
94
|
+
useProgress: () => useProgress
|
|
95
|
+
});
|
|
96
|
+
module.exports = __toCommonJS(src_exports);
|
|
819
97
|
|
|
820
98
|
// src/Components/Drawer/SCDrawer.tsx
|
|
821
|
-
var
|
|
822
|
-
var
|
|
99
|
+
var import_react8 = __toESM(require("react"), 1);
|
|
100
|
+
var import_material7 = require("@mui/material");
|
|
823
101
|
var import_Grid23 = __toESM(require("@mui/material/Grid2"), 1);
|
|
824
102
|
var import_Close = __toESM(require("@mui/icons-material/Close"), 1);
|
|
825
|
-
var import_ArrowBackIos = __toESM(require("@mui/icons-material/ArrowBackIos"), 1);
|
|
826
|
-
var import_ArrowForwardIos = __toESM(require("@mui/icons-material/ArrowForwardIos"), 1);
|
|
827
103
|
|
|
828
104
|
// src/Components/Textfield/SCTextField.tsx
|
|
829
|
-
var
|
|
830
|
-
var
|
|
105
|
+
var import_react = __toESM(require("react"), 1);
|
|
106
|
+
var import_material = require("@mui/material");
|
|
831
107
|
var import_Grid2 = __toESM(require("@mui/material/Grid2"), 1);
|
|
832
|
-
var
|
|
108
|
+
var import_icons_material = require("@mui/icons-material");
|
|
833
109
|
|
|
834
110
|
// src/Components/Textfield/Helpers/validateIcon.tsx
|
|
835
111
|
var Muicon = __toESM(require("@mui/icons-material"), 1);
|
|
836
|
-
function
|
|
112
|
+
function getIconComponent(name) {
|
|
837
113
|
if (typeof name !== "string") return name;
|
|
838
114
|
return name in Muicon ? Muicon[name] : void 0;
|
|
839
115
|
}
|
|
@@ -905,23 +181,23 @@ var SCTextField = ({
|
|
|
905
181
|
onKeyDown
|
|
906
182
|
}) => {
|
|
907
183
|
const inputComponents = {
|
|
908
|
-
outlined:
|
|
909
|
-
filled:
|
|
910
|
-
standard:
|
|
184
|
+
outlined: import_material.OutlinedInput,
|
|
185
|
+
filled: import_material.FilledInput,
|
|
186
|
+
standard: import_material.Input
|
|
911
187
|
};
|
|
912
|
-
const InputComponent = inputComponents[variant] ||
|
|
188
|
+
const InputComponent = inputComponents[variant] || import_material.OutlinedInput;
|
|
913
189
|
let IconInputStartValidation;
|
|
914
190
|
let IconInputEndValidation;
|
|
915
191
|
let IconInputStart;
|
|
916
192
|
let IconInputEnd;
|
|
917
193
|
let IconTitle;
|
|
918
|
-
const [showPassword, setShowPassword] = (0,
|
|
919
|
-
const [error, setError] = (0,
|
|
920
|
-
const [anchorInfoTitle, setAnchorInfoTitle] = (0,
|
|
194
|
+
const [showPassword, setShowPassword] = (0, import_react.useState)(false);
|
|
195
|
+
const [error, setError] = (0, import_react.useState)(false);
|
|
196
|
+
const [anchorInfoTitle, setAnchorInfoTitle] = (0, import_react.useState)(null);
|
|
921
197
|
const openInfoTitle = Boolean(anchorInfoTitle);
|
|
922
|
-
const [anchorInfoElement, setAnchorInfoElement] = (0,
|
|
198
|
+
const [anchorInfoElement, setAnchorInfoElement] = (0, import_react.useState)(null);
|
|
923
199
|
const openInfoElement = Boolean(anchorInfoElement);
|
|
924
|
-
(0,
|
|
200
|
+
(0, import_react.useEffect)(() => {
|
|
925
201
|
if (error) {
|
|
926
202
|
setTimeout(() => {
|
|
927
203
|
setError(false);
|
|
@@ -930,14 +206,14 @@ var SCTextField = ({
|
|
|
930
206
|
}, [error]);
|
|
931
207
|
if (iconInputStart) {
|
|
932
208
|
IconInputStartValidation = getIconValidation(iconInputStart);
|
|
933
|
-
IconInputStart =
|
|
209
|
+
IconInputStart = getIconComponent(iconInputStart);
|
|
934
210
|
}
|
|
935
211
|
if (iconInputEnd) {
|
|
936
212
|
IconInputEndValidation = getIconValidation(iconInputEnd);
|
|
937
|
-
IconInputEnd =
|
|
213
|
+
IconInputEnd = getIconComponent(iconInputEnd);
|
|
938
214
|
}
|
|
939
215
|
if (iconTitle) {
|
|
940
|
-
IconTitle =
|
|
216
|
+
IconTitle = getIconComponent(iconTitle);
|
|
941
217
|
}
|
|
942
218
|
const handleClickShowPassword = () => setShowPassword((show) => !show);
|
|
943
219
|
const handleMouseDownPassword = (event2) => {
|
|
@@ -971,16 +247,16 @@ var SCTextField = ({
|
|
|
971
247
|
const handleCloseInfoElement = () => {
|
|
972
248
|
setAnchorInfoElement(null);
|
|
973
249
|
};
|
|
974
|
-
return /* @__PURE__ */
|
|
975
|
-
|
|
250
|
+
return /* @__PURE__ */ import_react.default.createElement(import_material.Box, { sx: { width } }, /* @__PURE__ */ import_react.default.createElement(import_Grid2.default, { container: true, alignItems: "center", mb: 1.25, gap: 0.5 }, iconTitle && IconTitle ? /* @__PURE__ */ import_react.default.createElement(import_material.SvgIcon, { color: "action", fontSize: "small", component: IconTitle }) : "", title ? /* @__PURE__ */ import_react.default.createElement(import_material.Typography, { mx: 0.5, variant: "subtitle2", color: "text.secondary" }, title) : "", infoTitle ? /* @__PURE__ */ import_react.default.createElement(import_react.default.Fragment, null, infoTitle.component === "popover" ? /* @__PURE__ */ import_react.default.createElement(import_react.default.Fragment, null, /* @__PURE__ */ import_react.default.createElement(
|
|
251
|
+
import_icons_material.InfoOutlined,
|
|
976
252
|
{
|
|
977
253
|
color: "action",
|
|
978
254
|
fontSize: "small",
|
|
979
255
|
onMouseEnter: (event2) => handleOpenInfoTitle(event2),
|
|
980
256
|
onMouseLeave: () => handleCloseInfoTitle()
|
|
981
257
|
}
|
|
982
|
-
), /* @__PURE__ */
|
|
983
|
-
|
|
258
|
+
), /* @__PURE__ */ import_react.default.createElement(
|
|
259
|
+
import_material.Popover,
|
|
984
260
|
{
|
|
985
261
|
sx: {
|
|
986
262
|
pointerEvents: "none",
|
|
@@ -1001,15 +277,15 @@ var SCTextField = ({
|
|
|
1001
277
|
},
|
|
1002
278
|
disableRestoreFocus: true
|
|
1003
279
|
},
|
|
1004
|
-
/* @__PURE__ */
|
|
1005
|
-
)) : /* @__PURE__ */
|
|
1006
|
-
|
|
280
|
+
/* @__PURE__ */ import_react.default.createElement(import_material.Typography, { p: 2 }, infoTitle.text)
|
|
281
|
+
)) : /* @__PURE__ */ import_react.default.createElement(import_material.Tooltip, { title: infoTitle.text, "data-testid": "test-infoTitle", placement: "bottom-start", slotProps: { popper: { modifiers: [{ name: "offset", options: { offset: [0, -14] } }] } } }, /* @__PURE__ */ import_react.default.createElement(
|
|
282
|
+
import_icons_material.InfoOutlined,
|
|
1007
283
|
{
|
|
1008
284
|
color: "action",
|
|
1009
285
|
fontSize: "small"
|
|
1010
286
|
}
|
|
1011
|
-
))) : ""), /* @__PURE__ */
|
|
1012
|
-
|
|
287
|
+
))) : ""), /* @__PURE__ */ import_react.default.createElement(import_Grid2.default, { container: true, sx: { flexWrap: "nowrap", alignItems: "center" } }, /* @__PURE__ */ import_react.default.createElement(
|
|
288
|
+
import_material.FormControl,
|
|
1013
289
|
{
|
|
1014
290
|
color,
|
|
1015
291
|
fullWidth: true,
|
|
@@ -1017,8 +293,8 @@ var SCTextField = ({
|
|
|
1017
293
|
variant,
|
|
1018
294
|
sx: { background: background || "transparent", borderRadius: "4px" }
|
|
1019
295
|
},
|
|
1020
|
-
/* @__PURE__ */
|
|
1021
|
-
|
|
296
|
+
/* @__PURE__ */ import_react.default.createElement(
|
|
297
|
+
import_material.InputLabel,
|
|
1022
298
|
{
|
|
1023
299
|
"data-testid": "test-label",
|
|
1024
300
|
htmlFor: "",
|
|
@@ -1028,7 +304,7 @@ var SCTextField = ({
|
|
|
1028
304
|
},
|
|
1029
305
|
label ? label : ""
|
|
1030
306
|
),
|
|
1031
|
-
/* @__PURE__ */
|
|
307
|
+
/* @__PURE__ */ import_react.default.createElement(
|
|
1032
308
|
InputComponent,
|
|
1033
309
|
{
|
|
1034
310
|
size: size ? size : "medium",
|
|
@@ -1044,18 +320,18 @@ var SCTextField = ({
|
|
|
1044
320
|
type: !showPassword && format2 === "password" ? "password" : (format2 || "text").toUpperCase() === "INT" || (format2 || "text").toUpperCase() === "DECIMAL" ? "number" : "text",
|
|
1045
321
|
className: format2 === "password" && !showPassword ? "" : "",
|
|
1046
322
|
placeholder,
|
|
1047
|
-
startAdornment: iconInputStart ? /* @__PURE__ */
|
|
1048
|
-
endAdornment: /* @__PURE__ */
|
|
1049
|
-
|
|
323
|
+
startAdornment: iconInputStart ? /* @__PURE__ */ import_react.default.createElement(import_material.InputAdornment, { position: "start" }, IconInputStartValidation === "text" ? iconInputStart : IconInputStart ? /* @__PURE__ */ import_react.default.createElement(IconInputStart, { fontSize: "small" }) : null) : "",
|
|
324
|
+
endAdornment: /* @__PURE__ */ import_react.default.createElement(import_material.InputAdornment, { position: "end" }, format2 === "password" ? /* @__PURE__ */ import_react.default.createElement(
|
|
325
|
+
import_material.IconButton,
|
|
1050
326
|
{
|
|
1051
327
|
"aria-label": "toggle password visibility",
|
|
1052
328
|
onClick: handleClickShowPassword,
|
|
1053
329
|
onMouseDown: handleMouseDownPassword,
|
|
1054
330
|
edge: "end"
|
|
1055
331
|
},
|
|
1056
|
-
showPassword ? /* @__PURE__ */
|
|
1057
|
-
) : iconInputEnd === void 0 && infoElement !== void 0 ? /* @__PURE__ */
|
|
1058
|
-
|
|
332
|
+
showPassword ? /* @__PURE__ */ import_react.default.createElement(import_icons_material.VisibilityOff, null) : /* @__PURE__ */ import_react.default.createElement(import_icons_material.Visibility, null)
|
|
333
|
+
) : iconInputEnd === void 0 && infoElement !== void 0 ? /* @__PURE__ */ import_react.default.createElement(import_react.default.Fragment, null, infoElement.component === "popover" ? /* @__PURE__ */ import_react.default.createElement(import_react.default.Fragment, null, /* @__PURE__ */ import_react.default.createElement(
|
|
334
|
+
import_icons_material.InfoOutlined,
|
|
1059
335
|
{
|
|
1060
336
|
"data-testid": "test-infoElement",
|
|
1061
337
|
sx: { ml: 0.5 },
|
|
@@ -1065,8 +341,8 @@ var SCTextField = ({
|
|
|
1065
341
|
onMouseEnter: (event2) => handleOpenInfoElement(event2),
|
|
1066
342
|
onMouseLeave: () => handleCloseInfoElement()
|
|
1067
343
|
}
|
|
1068
|
-
), /* @__PURE__ */
|
|
1069
|
-
|
|
344
|
+
), /* @__PURE__ */ import_react.default.createElement(
|
|
345
|
+
import_material.Popover,
|
|
1070
346
|
{
|
|
1071
347
|
sx: {
|
|
1072
348
|
pointerEvents: "none",
|
|
@@ -1087,20 +363,20 @@ var SCTextField = ({
|
|
|
1087
363
|
},
|
|
1088
364
|
disableRestoreFocus: true
|
|
1089
365
|
},
|
|
1090
|
-
/* @__PURE__ */
|
|
1091
|
-
)) : /* @__PURE__ */
|
|
1092
|
-
|
|
366
|
+
/* @__PURE__ */ import_react.default.createElement(import_material.Typography, { "data-testid": "test-popover-text", p: 2 }, infoElement.text)
|
|
367
|
+
)) : /* @__PURE__ */ import_react.default.createElement(import_material.Tooltip, { title: infoElement.text, placement: "bottom-end", slotProps: { popper: { modifiers: [{ name: "offset", options: { offset: [0, -14] } }] } } }, /* @__PURE__ */ import_react.default.createElement(
|
|
368
|
+
import_icons_material.InfoOutlined,
|
|
1093
369
|
{
|
|
1094
370
|
color: "action",
|
|
1095
371
|
fontSize: "small"
|
|
1096
372
|
}
|
|
1097
|
-
))) : iconInputEnd !== void 0 ? IconInputEndValidation === "text" ? iconInputEnd : IconInputEnd ? /* @__PURE__ */
|
|
373
|
+
))) : iconInputEnd !== void 0 ? IconInputEndValidation === "text" ? iconInputEnd : IconInputEnd ? /* @__PURE__ */ import_react.default.createElement(IconInputEnd, { fontSize: "small" }) : null : ""),
|
|
1098
374
|
label: label ? label + (format2 === "password" && !showPassword ? "" : "") : "",
|
|
1099
375
|
autoComplete: format2 === "password" ? "new-password" : "off"
|
|
1100
376
|
}
|
|
1101
377
|
)
|
|
1102
|
-
), (iconInputEnd !== void 0 || format2 === "password") && infoElement ? /* @__PURE__ */
|
|
1103
|
-
|
|
378
|
+
), (iconInputEnd !== void 0 || format2 === "password") && infoElement ? /* @__PURE__ */ import_react.default.createElement(import_react.default.Fragment, null, infoElement.component === "popover" ? /* @__PURE__ */ import_react.default.createElement(import_react.default.Fragment, null, /* @__PURE__ */ import_react.default.createElement(
|
|
379
|
+
import_icons_material.InfoOutlined,
|
|
1104
380
|
{
|
|
1105
381
|
"data-testid": "test-infoElement",
|
|
1106
382
|
component: "svg",
|
|
@@ -1110,8 +386,8 @@ var SCTextField = ({
|
|
|
1110
386
|
onMouseEnter: (event2) => handleOpenInfoElement(event2),
|
|
1111
387
|
onMouseLeave: handleCloseInfoElement
|
|
1112
388
|
}
|
|
1113
|
-
), /* @__PURE__ */
|
|
1114
|
-
|
|
389
|
+
), /* @__PURE__ */ import_react.default.createElement(
|
|
390
|
+
import_material.Popover,
|
|
1115
391
|
{
|
|
1116
392
|
sx: { pointerEvents: "none" },
|
|
1117
393
|
open: openInfoElement,
|
|
@@ -1127,9 +403,9 @@ var SCTextField = ({
|
|
|
1127
403
|
},
|
|
1128
404
|
disableRestoreFocus: true
|
|
1129
405
|
},
|
|
1130
|
-
/* @__PURE__ */
|
|
1131
|
-
)) : /* @__PURE__ */
|
|
1132
|
-
|
|
406
|
+
/* @__PURE__ */ import_react.default.createElement(import_material.Typography, { "data-testid": "test-popover-text", p: 2 }, infoElement.text)
|
|
407
|
+
)) : /* @__PURE__ */ import_react.default.createElement(import_material.Tooltip, { title: infoElement.text, placement: "bottom-end", slotProps: { popper: { modifiers: [{ name: "offset", options: { offset: [0, -14] } }] } } }, /* @__PURE__ */ import_react.default.createElement(
|
|
408
|
+
import_icons_material.InfoOutlined,
|
|
1133
409
|
{
|
|
1134
410
|
sx: { marginLeft: "4px" },
|
|
1135
411
|
color: "action",
|
|
@@ -1138,19 +414,199 @@ var SCTextField = ({
|
|
|
1138
414
|
))) : ""));
|
|
1139
415
|
};
|
|
1140
416
|
|
|
417
|
+
// src/Components/ToastNotification/SCToastNotification.tsx
|
|
418
|
+
var import_react3 = __toESM(require("react"), 1);
|
|
419
|
+
var import_material2 = require("@mui/material");
|
|
420
|
+
var import_icons_material2 = require("@mui/icons-material");
|
|
421
|
+
|
|
422
|
+
// src/Components/ToastNotification/useProgress.ts
|
|
423
|
+
var import_react2 = require("react");
|
|
424
|
+
var useProgress = (timeProgress, lote) => {
|
|
425
|
+
const [progress, setProgress] = (0, import_react2.useState)(0);
|
|
426
|
+
(0, import_react2.useEffect)(() => {
|
|
427
|
+
const interval = setInterval(() => {
|
|
428
|
+
setProgress((prev) => {
|
|
429
|
+
if (prev >= 100) {
|
|
430
|
+
clearInterval(interval);
|
|
431
|
+
}
|
|
432
|
+
if (lote) {
|
|
433
|
+
const nextProgress = prev + lote;
|
|
434
|
+
return nextProgress <= 100 ? nextProgress : 100;
|
|
435
|
+
} else {
|
|
436
|
+
return prev + 1;
|
|
437
|
+
}
|
|
438
|
+
});
|
|
439
|
+
}, timeProgress * 10);
|
|
440
|
+
return () => {
|
|
441
|
+
clearInterval(interval);
|
|
442
|
+
};
|
|
443
|
+
}, [timeProgress, lote]);
|
|
444
|
+
return {
|
|
445
|
+
progress
|
|
446
|
+
};
|
|
447
|
+
};
|
|
448
|
+
var ToastProgress = (timeProgress) => {
|
|
449
|
+
const [progress, setProgress] = (0, import_react2.useState)(100);
|
|
450
|
+
(0, import_react2.useEffect)(() => {
|
|
451
|
+
const interval = setInterval(() => {
|
|
452
|
+
setProgress((prev) => {
|
|
453
|
+
if (prev <= 0) {
|
|
454
|
+
clearInterval(interval);
|
|
455
|
+
}
|
|
456
|
+
return prev - 1;
|
|
457
|
+
});
|
|
458
|
+
}, timeProgress * 10);
|
|
459
|
+
return () => {
|
|
460
|
+
clearInterval(interval);
|
|
461
|
+
};
|
|
462
|
+
}, [timeProgress]);
|
|
463
|
+
return {
|
|
464
|
+
progressToast: progress
|
|
465
|
+
};
|
|
466
|
+
};
|
|
467
|
+
|
|
468
|
+
// src/Components/ToastNotification/SCToastNotification.tsx
|
|
469
|
+
var SCToastNotification = (toast) => {
|
|
470
|
+
var _a;
|
|
471
|
+
const [stateOptions, setStateOptions] = (0, import_react3.useState)(true);
|
|
472
|
+
const [stateToast, setStateToast] = (0, import_react3.useState)(true);
|
|
473
|
+
const timeProgress = toast.time || 10;
|
|
474
|
+
const { progress } = useProgress(timeProgress);
|
|
475
|
+
const toastColorConfig = toast.type || "info";
|
|
476
|
+
const toastIconOption = {
|
|
477
|
+
success: /* @__PURE__ */ import_react3.default.createElement(import_icons_material2.CheckCircleRounded, { color: "success" }),
|
|
478
|
+
error: /* @__PURE__ */ import_react3.default.createElement(import_icons_material2.ErrorRounded, { color: "error" }),
|
|
479
|
+
warning: /* @__PURE__ */ import_react3.default.createElement(import_icons_material2.WarningRounded, { color: "warning" }),
|
|
480
|
+
info: /* @__PURE__ */ import_react3.default.createElement(import_icons_material2.InfoRounded, { color: "info" })
|
|
481
|
+
};
|
|
482
|
+
const acciones = [...toast.actions || [{ text: "Action", fn: () => {
|
|
483
|
+
alert("");
|
|
484
|
+
} }, { text: "Consultar", fn: () => {
|
|
485
|
+
} }]];
|
|
486
|
+
const ToastIconConfig = toastIconOption[toast.type];
|
|
487
|
+
const closeToast = () => {
|
|
488
|
+
setStateToast(false);
|
|
489
|
+
};
|
|
490
|
+
const toggleToastOptions = () => {
|
|
491
|
+
setStateOptions((prevShowOptions) => !prevShowOptions);
|
|
492
|
+
};
|
|
493
|
+
(0, import_react3.useEffect)(() => {
|
|
494
|
+
progress >= 100 && setStateToast(false);
|
|
495
|
+
}, [progress]);
|
|
496
|
+
return /* @__PURE__ */ import_react3.default.createElement(import_react3.default.Fragment, null, stateToast && /* @__PURE__ */ import_react3.default.createElement(
|
|
497
|
+
import_material2.Stack,
|
|
498
|
+
{
|
|
499
|
+
position: "fixed",
|
|
500
|
+
zIndex: 1400,
|
|
501
|
+
right: 16,
|
|
502
|
+
top: 16,
|
|
503
|
+
width: 370,
|
|
504
|
+
sx: {
|
|
505
|
+
boxShadow: (theme) => theme.shadows[8]
|
|
506
|
+
}
|
|
507
|
+
},
|
|
508
|
+
/* @__PURE__ */ import_react3.default.createElement(
|
|
509
|
+
import_material2.Box,
|
|
510
|
+
{
|
|
511
|
+
padding: 1.5,
|
|
512
|
+
gap: 1.5,
|
|
513
|
+
display: "flex",
|
|
514
|
+
alignItems: "center",
|
|
515
|
+
sx: {
|
|
516
|
+
backgroundColor: {
|
|
517
|
+
success: "success.50",
|
|
518
|
+
error: "error.50",
|
|
519
|
+
warning: "warning.50",
|
|
520
|
+
info: "info.50"
|
|
521
|
+
}[toastColorConfig]
|
|
522
|
+
}
|
|
523
|
+
},
|
|
524
|
+
/* @__PURE__ */ import_react3.default.createElement(
|
|
525
|
+
import_material2.Stack,
|
|
526
|
+
{
|
|
527
|
+
p: 1,
|
|
528
|
+
gap: 1,
|
|
529
|
+
borderRadius: 50,
|
|
530
|
+
bgcolor: {
|
|
531
|
+
success: "success.100",
|
|
532
|
+
error: "error.100",
|
|
533
|
+
warning: "warning.100",
|
|
534
|
+
info: "info.100"
|
|
535
|
+
}[(_a = toast.type) != null ? _a : "info"]
|
|
536
|
+
},
|
|
537
|
+
/* @__PURE__ */ import_react3.default.createElement(import_material2.Stack, null, ToastIconConfig)
|
|
538
|
+
),
|
|
539
|
+
/* @__PURE__ */ import_react3.default.createElement(import_material2.Divider, { orientation: "vertical", flexItem: true }),
|
|
540
|
+
/* @__PURE__ */ import_react3.default.createElement(import_material2.Stack, { width: 285 }, /* @__PURE__ */ import_react3.default.createElement(
|
|
541
|
+
import_material2.Stack,
|
|
542
|
+
{
|
|
543
|
+
justifyContent: "space-between",
|
|
544
|
+
flexDirection: "row",
|
|
545
|
+
alignItems: "center"
|
|
546
|
+
},
|
|
547
|
+
/* @__PURE__ */ import_react3.default.createElement(import_material2.Typography, { variant: "subtitle2", color: "text.primary" }, toast.title),
|
|
548
|
+
/* @__PURE__ */ import_react3.default.createElement(
|
|
549
|
+
import_material2.IconButton,
|
|
550
|
+
{
|
|
551
|
+
size: "small",
|
|
552
|
+
"data-testid": "close-icon",
|
|
553
|
+
onClick: closeToast
|
|
554
|
+
},
|
|
555
|
+
/* @__PURE__ */ import_react3.default.createElement(import_icons_material2.Close, { fontSize: "small" })
|
|
556
|
+
)
|
|
557
|
+
), /* @__PURE__ */ import_react3.default.createElement(import_material2.Stack, { gap: 0.5 }, /* @__PURE__ */ import_react3.default.createElement(import_material2.Typography, { color: "text.primary", variant: "body2" }, toast.subtitle), !stateOptions && toast.listITems && toast.listITems.length > 0 && /* @__PURE__ */ import_react3.default.createElement(import_material2.Stack, null, toast.listITems.map((element, i) => /* @__PURE__ */ import_react3.default.createElement(import_material2.Typography, { variant: "caption", key: i }, "\u2022 ", element)))), /* @__PURE__ */ import_react3.default.createElement(import_material2.Stack, { justifyContent: "flex-end", flexDirection: "row", gap: 0.5 }, toast.actions && toast.actions.length > 0 && /* @__PURE__ */ import_react3.default.createElement(import_material2.Stack, { flexDirection: "row", gap: 0.5 }, toast.actions.map((button, index) => /* @__PURE__ */ import_react3.default.createElement(
|
|
558
|
+
import_material2.Button,
|
|
559
|
+
{
|
|
560
|
+
key: index,
|
|
561
|
+
color: toast.type === "info" ? "info" : toast.type === "success" ? "success" : toast.type === "error" ? "error" : "warning",
|
|
562
|
+
variant: "text",
|
|
563
|
+
onClick: button.fn,
|
|
564
|
+
disabled: button.disabled || false,
|
|
565
|
+
size: "small"
|
|
566
|
+
},
|
|
567
|
+
button.text.charAt(0).toUpperCase() + button.text.slice(1).toLowerCase()
|
|
568
|
+
))), toast.seeMore && /* @__PURE__ */ import_react3.default.createElement(
|
|
569
|
+
import_material2.Button,
|
|
570
|
+
{
|
|
571
|
+
onClick: toggleToastOptions,
|
|
572
|
+
size: "small",
|
|
573
|
+
variant: "text",
|
|
574
|
+
color: toastColorConfig
|
|
575
|
+
},
|
|
576
|
+
stateOptions ? "Ver m\xE1s" : "Ver menos",
|
|
577
|
+
stateOptions ? /* @__PURE__ */ import_react3.default.createElement(import_icons_material2.KeyboardArrowDown, null) : /* @__PURE__ */ import_react3.default.createElement(import_icons_material2.KeyboardArrowUp, null)
|
|
578
|
+
)))
|
|
579
|
+
),
|
|
580
|
+
/* @__PURE__ */ import_react3.default.createElement(
|
|
581
|
+
import_material2.LinearProgress,
|
|
582
|
+
{
|
|
583
|
+
sx: {
|
|
584
|
+
".MuiLinearProgress-bar": {
|
|
585
|
+
transition: "0.1s linear !important",
|
|
586
|
+
transform: "scaleX(-1)"
|
|
587
|
+
}
|
|
588
|
+
},
|
|
589
|
+
color: toastColorConfig,
|
|
590
|
+
variant: "determinate",
|
|
591
|
+
value: 100 - progress
|
|
592
|
+
}
|
|
593
|
+
)
|
|
594
|
+
));
|
|
595
|
+
};
|
|
596
|
+
|
|
1141
597
|
// src/Components/TextArea/Helpers/validateIcon.tsx
|
|
1142
|
-
var
|
|
598
|
+
var MuiIcons = __toESM(require("@mui/icons-material"), 1);
|
|
1143
599
|
function getIcon(name) {
|
|
1144
|
-
if (!name || !(name in
|
|
600
|
+
if (!name || !(name in MuiIcons)) {
|
|
1145
601
|
return null;
|
|
1146
602
|
}
|
|
1147
|
-
return
|
|
603
|
+
return MuiIcons[name];
|
|
1148
604
|
}
|
|
1149
605
|
|
|
1150
606
|
// src/Components/TextArea/SCTextArea.tsx
|
|
1151
|
-
var
|
|
1152
|
-
var
|
|
1153
|
-
var
|
|
607
|
+
var import_react4 = __toESM(require("react"), 1);
|
|
608
|
+
var import_material3 = require("@mui/material");
|
|
609
|
+
var import_icons_material3 = require("@mui/icons-material");
|
|
1154
610
|
var SCTextArea = ({
|
|
1155
611
|
//informativas
|
|
1156
612
|
title,
|
|
@@ -1172,11 +628,11 @@ var SCTextArea = ({
|
|
|
1172
628
|
state,
|
|
1173
629
|
onBlur
|
|
1174
630
|
}) => {
|
|
1175
|
-
const [helperCount, setHelperCount] = (0,
|
|
1176
|
-
const [stateError, setStateError] = (0,
|
|
1177
|
-
const [anchorInfoTitle, setAnchorInfoTitle] =
|
|
631
|
+
const [helperCount, setHelperCount] = (0, import_react4.useState)(0);
|
|
632
|
+
const [stateError, setStateError] = (0, import_react4.useState)(false);
|
|
633
|
+
const [anchorInfoTitle, setAnchorInfoTitle] = import_react4.default.useState(null);
|
|
1178
634
|
const openInfoTitle = Boolean(anchorInfoTitle);
|
|
1179
|
-
(0,
|
|
635
|
+
(0, import_react4.useEffect)(() => {
|
|
1180
636
|
setHelperCount(state == null ? void 0 : state.length);
|
|
1181
637
|
}, [state]);
|
|
1182
638
|
const IconTitle = getIcon(iconTitle);
|
|
@@ -1198,16 +654,16 @@ var SCTextArea = ({
|
|
|
1198
654
|
const handleCloseInfoTitle = () => {
|
|
1199
655
|
setAnchorInfoTitle(null);
|
|
1200
656
|
};
|
|
1201
|
-
return /* @__PURE__ */
|
|
1202
|
-
|
|
657
|
+
return /* @__PURE__ */ import_react4.default.createElement(import_react4.default.Fragment, null, /* @__PURE__ */ import_react4.default.createElement(import_material3.Box, { sx: { width } }, /* @__PURE__ */ import_react4.default.createElement(import_material3.Grid, { container: true, sx: { alignItems: "center" }, gap: 0.5 }, iconTitle && IconTitle && /* @__PURE__ */ import_react4.default.createElement(import_material3.SvgIcon, { color: "action", fontSize: "small", component: IconTitle }), title && /* @__PURE__ */ import_react4.default.createElement(import_material3.Typography, { color: colorTitle || "text.secondary", variant: "subtitle2" }, title), infoTitle ? /* @__PURE__ */ import_react4.default.createElement(import_react4.default.Fragment, null, infoTitle.component === "popover" ? /* @__PURE__ */ import_react4.default.createElement(import_react4.default.Fragment, null, /* @__PURE__ */ import_react4.default.createElement(
|
|
658
|
+
import_icons_material3.InfoOutlined,
|
|
1203
659
|
{
|
|
1204
660
|
color: "action",
|
|
1205
661
|
fontSize: "small",
|
|
1206
662
|
onMouseEnter: (event2) => handleOpenInfoTitle(event2),
|
|
1207
663
|
onMouseLeave: () => handleCloseInfoTitle()
|
|
1208
664
|
}
|
|
1209
|
-
), /* @__PURE__ */
|
|
1210
|
-
|
|
665
|
+
), /* @__PURE__ */ import_react4.default.createElement(
|
|
666
|
+
import_material3.Popover,
|
|
1211
667
|
{
|
|
1212
668
|
sx: { pointerEvents: "none" },
|
|
1213
669
|
open: openInfoTitle,
|
|
@@ -1223,15 +679,15 @@ var SCTextArea = ({
|
|
|
1223
679
|
},
|
|
1224
680
|
disableRestoreFocus: true
|
|
1225
681
|
},
|
|
1226
|
-
/* @__PURE__ */
|
|
1227
|
-
)) : /* @__PURE__ */
|
|
1228
|
-
|
|
682
|
+
/* @__PURE__ */ import_react4.default.createElement(import_material3.Typography, { sx: { p: 2 } }, infoTitle.text)
|
|
683
|
+
)) : /* @__PURE__ */ import_react4.default.createElement(import_material3.Tooltip, { title: infoTitle.text, placement: "bottom-start", slotProps: { popper: { modifiers: [{ name: "offset", options: { offset: [0, -14] } }] } } }, /* @__PURE__ */ import_react4.default.createElement(
|
|
684
|
+
import_icons_material3.InfoOutlined,
|
|
1229
685
|
{
|
|
1230
686
|
color: "action",
|
|
1231
687
|
fontSize: "small"
|
|
1232
688
|
}
|
|
1233
|
-
))) : ""), /* @__PURE__ */
|
|
1234
|
-
|
|
689
|
+
))) : ""), /* @__PURE__ */ import_react4.default.createElement(import_material3.Stack, null, /* @__PURE__ */ import_react4.default.createElement(
|
|
690
|
+
import_material3.TextField,
|
|
1235
691
|
{
|
|
1236
692
|
required,
|
|
1237
693
|
placeholder,
|
|
@@ -1252,8 +708,8 @@ var SCTextArea = ({
|
|
|
1252
708
|
},
|
|
1253
709
|
autoComplete: "off"
|
|
1254
710
|
}
|
|
1255
|
-
)), /* @__PURE__ */
|
|
1256
|
-
|
|
711
|
+
)), /* @__PURE__ */ import_react4.default.createElement(import_material3.Stack, null, /* @__PURE__ */ import_react4.default.createElement(
|
|
712
|
+
import_material3.Typography,
|
|
1257
713
|
{
|
|
1258
714
|
variant: "caption",
|
|
1259
715
|
color: "text.secondary",
|
|
@@ -1266,8 +722,8 @@ var SCTextArea = ({
|
|
|
1266
722
|
};
|
|
1267
723
|
|
|
1268
724
|
// src/Components/SCSelect.tsx
|
|
1269
|
-
var
|
|
1270
|
-
var
|
|
725
|
+
var import_react5 = __toESM(require("react"), 1);
|
|
726
|
+
var import_material4 = require("@mui/material");
|
|
1271
727
|
var import_Select = __toESM(require("@mui/material/Select"), 1);
|
|
1272
728
|
var Muicon2 = __toESM(require("@mui/icons-material"), 1);
|
|
1273
729
|
function SCSelect({
|
|
@@ -1277,23 +733,25 @@ function SCSelect({
|
|
|
1277
733
|
width = "100%",
|
|
1278
734
|
size = "small",
|
|
1279
735
|
variant = "outlined",
|
|
1280
|
-
|
|
736
|
+
deleteType = "button",
|
|
1281
737
|
required,
|
|
1282
738
|
disabled,
|
|
739
|
+
background,
|
|
740
|
+
fnAplicar,
|
|
1283
741
|
setState,
|
|
1284
742
|
state
|
|
1285
743
|
}) {
|
|
1286
744
|
const labelContent = `<span style="color: red;">* </span>` + label;
|
|
1287
|
-
const [prevData, setPrevData] =
|
|
1288
|
-
const [error, setError] =
|
|
1289
|
-
(0,
|
|
745
|
+
const [prevData, setPrevData] = import_react5.default.useState(data);
|
|
746
|
+
const [error, setError] = import_react5.default.useState(false);
|
|
747
|
+
(0, import_react5.useEffect)(() => {
|
|
1290
748
|
if (error) {
|
|
1291
749
|
setTimeout(() => {
|
|
1292
750
|
setError(false);
|
|
1293
751
|
}, 1e3);
|
|
1294
752
|
}
|
|
1295
753
|
}, [error]);
|
|
1296
|
-
(0,
|
|
754
|
+
(0, import_react5.useEffect)(() => {
|
|
1297
755
|
let dataChangeValidation = JSON.stringify(prevData) === JSON.stringify(data);
|
|
1298
756
|
if (dataChangeValidation == false) {
|
|
1299
757
|
setState({ hiddenValue: "", textValue: "" });
|
|
@@ -1327,25 +785,25 @@ function SCSelect({
|
|
|
1327
785
|
}
|
|
1328
786
|
}
|
|
1329
787
|
};
|
|
1330
|
-
return /* @__PURE__ */
|
|
1331
|
-
|
|
788
|
+
return /* @__PURE__ */ import_react5.default.createElement(import_react5.default.Fragment, null, data && /* @__PURE__ */ import_react5.default.createElement(import_material4.Box, { sx: { width } }, /* @__PURE__ */ import_react5.default.createElement(
|
|
789
|
+
import_material4.FormControl,
|
|
1332
790
|
{
|
|
1333
791
|
fullWidth: true,
|
|
1334
792
|
size: size ? size : "medium",
|
|
1335
793
|
variant
|
|
1336
794
|
},
|
|
1337
|
-
/* @__PURE__ */
|
|
1338
|
-
|
|
795
|
+
/* @__PURE__ */ import_react5.default.createElement(
|
|
796
|
+
import_material4.InputLabel,
|
|
1339
797
|
{
|
|
1340
798
|
error
|
|
1341
799
|
},
|
|
1342
|
-
required ? /* @__PURE__ */
|
|
800
|
+
required ? /* @__PURE__ */ import_react5.default.createElement("span", { dangerouslySetInnerHTML: { __html: labelContent } }) : label
|
|
1343
801
|
),
|
|
1344
|
-
/* @__PURE__ */
|
|
802
|
+
/* @__PURE__ */ import_react5.default.createElement(
|
|
1345
803
|
import_Select.default,
|
|
1346
804
|
{
|
|
1347
805
|
value: Array.isArray(state.hiddenValue) ? state.hiddenValue[0] || "" : state.hiddenValue != "-1" ? state.hiddenValue : "",
|
|
1348
|
-
label: required ? /* @__PURE__ */
|
|
806
|
+
label: required ? /* @__PURE__ */ import_react5.default.createElement("span", { dangerouslySetInnerHTML: { __html: labelContent } }) : label,
|
|
1349
807
|
onChange: handleChange,
|
|
1350
808
|
onBlur: handleBlur,
|
|
1351
809
|
variant,
|
|
@@ -1354,34 +812,28 @@ function SCSelect({
|
|
|
1354
812
|
MenuProps: {
|
|
1355
813
|
PaperProps: {
|
|
1356
814
|
sx: {
|
|
1357
|
-
|
|
1358
|
-
minWidth: "100%"
|
|
815
|
+
left: "0px !important"
|
|
1359
816
|
}
|
|
1360
817
|
},
|
|
1361
|
-
|
|
1362
|
-
|
|
1363
|
-
|
|
1364
|
-
|
|
1365
|
-
|
|
1366
|
-
vertical: "top",
|
|
1367
|
-
horizontal: "left"
|
|
1368
|
-
},
|
|
1369
|
-
disableAutoFocusItem: true,
|
|
1370
|
-
marginThreshold: 0
|
|
818
|
+
sx: {
|
|
819
|
+
"& .MuiPaper-root": {
|
|
820
|
+
left: "0px !important"
|
|
821
|
+
}
|
|
822
|
+
}
|
|
1371
823
|
}
|
|
1372
824
|
},
|
|
1373
825
|
data.map((option, index) => {
|
|
1374
|
-
return /* @__PURE__ */
|
|
826
|
+
return /* @__PURE__ */ import_react5.default.createElement(import_material4.MenuItem, { key: index, value: getItemValue(option).value }, getItemValue(option).icon != void 0 ? /* @__PURE__ */ import_react5.default.createElement(import_material4.ListItemIcon, { sx: { minWidth: "10px !important" } }, /* @__PURE__ */ import_react5.default.createElement(import_material4.SvgIcon, { fontSize: "small", color: "action", component: getItemValue(option).icon })) : "", /* @__PURE__ */ import_react5.default.createElement(import_material4.ListItemText, { primary: getItemValue(option).text, color: "text.primary" }));
|
|
1375
827
|
})
|
|
1376
828
|
)
|
|
1377
829
|
)));
|
|
1378
830
|
}
|
|
1379
831
|
|
|
1380
832
|
// src/Components/SCAutocomplete.tsx
|
|
1381
|
-
var
|
|
1382
|
-
var
|
|
833
|
+
var import_react6 = __toESM(require("react"), 1);
|
|
834
|
+
var import_material5 = require("@mui/material");
|
|
1383
835
|
var import_Grid22 = __toESM(require("@mui/material/Grid2"), 1);
|
|
1384
|
-
var
|
|
836
|
+
var import_icons_material4 = require("@mui/icons-material");
|
|
1385
837
|
var Muicon3 = __toESM(require("@mui/icons-material"), 1);
|
|
1386
838
|
function SCAutocomplete({
|
|
1387
839
|
label = "",
|
|
@@ -1399,16 +851,17 @@ function SCAutocomplete({
|
|
|
1399
851
|
state,
|
|
1400
852
|
inputChange,
|
|
1401
853
|
maxCheck
|
|
854
|
+
// Agregar el parámetro maxCheck
|
|
1402
855
|
}) {
|
|
1403
856
|
const labelContent = `<span style="color: red;">* </span>` + label;
|
|
1404
857
|
let group = "";
|
|
1405
858
|
let isSelected = false;
|
|
1406
|
-
const [selectedOptions, setSelectedOptions] =
|
|
1407
|
-
const [prevData, setPrevData] =
|
|
1408
|
-
const [originalData, setOriginalData] =
|
|
1409
|
-
const [inputValue, setInputValue] =
|
|
1410
|
-
const [isUserTyping, setIsUserTyping] =
|
|
1411
|
-
(0,
|
|
859
|
+
const [selectedOptions, setSelectedOptions] = import_react6.default.useState([]);
|
|
860
|
+
const [prevData, setPrevData] = import_react6.default.useState(data);
|
|
861
|
+
const [originalData, setOriginalData] = import_react6.default.useState(data);
|
|
862
|
+
const [inputValue, setInputValue] = import_react6.default.useState("");
|
|
863
|
+
const [isUserTyping, setIsUserTyping] = import_react6.default.useState(false);
|
|
864
|
+
(0, import_react6.useEffect)(() => {
|
|
1412
865
|
const dataChangeValidation = JSON.stringify(prevData) === JSON.stringify(data);
|
|
1413
866
|
if (!dataChangeValidation && !isUserTyping) {
|
|
1414
867
|
setState({ hiddenValue: "-1", textValue: "" });
|
|
@@ -1419,7 +872,7 @@ function SCAutocomplete({
|
|
|
1419
872
|
}
|
|
1420
873
|
setPrevData(data);
|
|
1421
874
|
}, [data, isUserTyping]);
|
|
1422
|
-
(0,
|
|
875
|
+
(0, import_react6.useEffect)(() => {
|
|
1423
876
|
if (typeFormat == "multiselect") {
|
|
1424
877
|
if (state.hiddenValue != "-1" && Array.isArray(state.hiddenValue)) {
|
|
1425
878
|
const newSelectedOptions = originalData.filter(
|
|
@@ -1429,7 +882,7 @@ function SCAutocomplete({
|
|
|
1429
882
|
}
|
|
1430
883
|
}
|
|
1431
884
|
}, [state.hiddenValue, originalData, typeFormat]);
|
|
1432
|
-
(0,
|
|
885
|
+
(0, import_react6.useEffect)(() => {
|
|
1433
886
|
if (inputValue === "") {
|
|
1434
887
|
setIsUserTyping(false);
|
|
1435
888
|
}
|
|
@@ -1487,12 +940,11 @@ function SCAutocomplete({
|
|
|
1487
940
|
const selectedValue = typeFormat === "multiselect" ? selectedOptions : originalData.find(
|
|
1488
941
|
(item) => getItemValue(item).value === state.hiddenValue
|
|
1489
942
|
) || null;
|
|
1490
|
-
return /* @__PURE__ */
|
|
1491
|
-
|
|
943
|
+
return /* @__PURE__ */ import_react6.default.createElement(import_react6.default.Fragment, null, data && /* @__PURE__ */ import_react6.default.createElement(
|
|
944
|
+
import_material5.Autocomplete,
|
|
1492
945
|
{
|
|
1493
946
|
multiple: typeFormat === "multiselect",
|
|
1494
947
|
clearOnEscape: true,
|
|
1495
|
-
noOptionsText: "No se encuentra",
|
|
1496
948
|
disabled,
|
|
1497
949
|
options: data,
|
|
1498
950
|
isOptionEqualToValue: (option, value) => getItemValue(option).value === getItemValue(value).value,
|
|
@@ -1514,10 +966,10 @@ function SCAutocomplete({
|
|
|
1514
966
|
limitTags: 2,
|
|
1515
967
|
renderTags: (value, getTagProps) => {
|
|
1516
968
|
const limit = 2;
|
|
1517
|
-
return /* @__PURE__ */
|
|
969
|
+
return /* @__PURE__ */ import_react6.default.createElement(import_react6.default.Fragment, null, value.slice(0, limit).map((option, index) => {
|
|
1518
970
|
const _a = getTagProps({ index }), { key } = _a, chipProps = __objRest(_a, ["key"]);
|
|
1519
|
-
return /* @__PURE__ */
|
|
1520
|
-
|
|
971
|
+
return /* @__PURE__ */ import_react6.default.createElement(
|
|
972
|
+
import_material5.Chip,
|
|
1521
973
|
__spreadProps(__spreadValues({
|
|
1522
974
|
key,
|
|
1523
975
|
color: "default",
|
|
@@ -1528,7 +980,7 @@ function SCAutocomplete({
|
|
|
1528
980
|
style: { maxWidth: 120, overflow: "hidden", textOverflow: "ellipsis", whiteSpace: "nowrap" }
|
|
1529
981
|
})
|
|
1530
982
|
);
|
|
1531
|
-
}), value.length > limit && /* @__PURE__ */
|
|
983
|
+
}), value.length > limit && /* @__PURE__ */ import_react6.default.createElement(import_material5.Box, { sx: { ml: 0.5, fontSize: 13, color: "#666", display: "flex", alignItems: "center" } }, `+${value.length - limit}`));
|
|
1532
984
|
},
|
|
1533
985
|
renderOption: (props, option) => {
|
|
1534
986
|
const _a = props, { key } = _a, optionProps = __objRest(_a, ["key"]);
|
|
@@ -1546,8 +998,8 @@ function SCAutocomplete({
|
|
|
1546
998
|
isValid = group == option[columnGroup];
|
|
1547
999
|
group = option[columnGroup];
|
|
1548
1000
|
}
|
|
1549
|
-
return /* @__PURE__ */
|
|
1550
|
-
|
|
1001
|
+
return /* @__PURE__ */ import_react6.default.createElement(import_react6.default.Fragment, null, /* @__PURE__ */ import_react6.default.createElement(import_react6.default.Fragment, { key }, columnGroup ? !isValid ? /* @__PURE__ */ import_react6.default.createElement(import_material5.Typography, { color: "text.secondary", sx: { margin: "7px 16px !important", fontSize: "13px !important" } }, option[columnGroup]) : "" : "", /* @__PURE__ */ import_react6.default.createElement(
|
|
1002
|
+
import_material5.MenuItem,
|
|
1551
1003
|
__spreadProps(__spreadValues({}, optionProps), {
|
|
1552
1004
|
disabled: isDisabled,
|
|
1553
1005
|
style: {
|
|
@@ -1556,9 +1008,9 @@ function SCAutocomplete({
|
|
|
1556
1008
|
opacity: isDisabled ? 0.5 : 1
|
|
1557
1009
|
}
|
|
1558
1010
|
}),
|
|
1559
|
-
typeFormat != "multiselect" && getItemValue(option).icon != void 0 ? /* @__PURE__ */
|
|
1560
|
-
typeFormat == "multiselect" ? /* @__PURE__ */
|
|
1561
|
-
|
|
1011
|
+
typeFormat != "multiselect" && getItemValue(option).icon != void 0 ? /* @__PURE__ */ import_react6.default.createElement(import_material5.ListItemIcon, { sx: { minWidth: "10px !important" } }, /* @__PURE__ */ import_react6.default.createElement(import_material5.SvgIcon, { fontSize: "small", color: "action", component: getItemValue(option).icon })) : "",
|
|
1012
|
+
typeFormat == "multiselect" ? /* @__PURE__ */ import_react6.default.createElement(
|
|
1013
|
+
import_material5.Checkbox,
|
|
1562
1014
|
{
|
|
1563
1015
|
checked: isSelected,
|
|
1564
1016
|
disabled: isDisabled,
|
|
@@ -1566,25 +1018,25 @@ function SCAutocomplete({
|
|
|
1566
1018
|
color: "primary"
|
|
1567
1019
|
}
|
|
1568
1020
|
) : "",
|
|
1569
|
-
/* @__PURE__ */
|
|
1021
|
+
/* @__PURE__ */ import_react6.default.createElement(import_material5.ListItemText, { primary: getItemValue(option).text, color: "text.primary" }),
|
|
1570
1022
|
getItemValue(option).component != void 0 ? getItemValue(option).component : ""
|
|
1571
1023
|
)));
|
|
1572
1024
|
},
|
|
1573
|
-
renderInput: (params) => /* @__PURE__ */
|
|
1574
|
-
|
|
1025
|
+
renderInput: (params) => /* @__PURE__ */ import_react6.default.createElement(import_react6.default.Fragment, null, /* @__PURE__ */ import_react6.default.createElement(
|
|
1026
|
+
import_material5.TextField,
|
|
1575
1027
|
__spreadProps(__spreadValues({}, params), {
|
|
1576
|
-
label: required ? /* @__PURE__ */
|
|
1028
|
+
label: required ? /* @__PURE__ */ import_react6.default.createElement("span", { dangerouslySetInnerHTML: { __html: labelContent } }) : label,
|
|
1577
1029
|
placeholder: selectedOptions.length == 0 ? "B\xFAsqueda" : "",
|
|
1578
1030
|
InputProps: __spreadProps(__spreadValues({}, params.InputProps), {
|
|
1579
|
-
endAdornment: /* @__PURE__ */
|
|
1031
|
+
endAdornment: /* @__PURE__ */ import_react6.default.createElement(import_react6.default.Fragment, null, deleteType == "icon" && (state.hiddenValue.toString() != "-1" && state.hiddenValue.toString() != "") ? /* @__PURE__ */ import_react6.default.createElement(import_material5.IconButton, { size: "small", onClick: cleanOptions, sx: { marginLeft: "auto", textAlign: "right", padding: "0px" } }, /* @__PURE__ */ import_react6.default.createElement(import_icons_material4.Clear, { fontSize: "small" })) : "", /* @__PURE__ */ import_react6.default.createElement(import_material5.InputAdornment, { style: { zIndex: 1, position: "relative" }, position: "end" }, /* @__PURE__ */ import_react6.default.createElement(import_icons_material4.Search, { fontSize: "small", color: "action", style: { cursor: "pointer" } })))
|
|
1580
1032
|
})
|
|
1581
1033
|
})
|
|
1582
1034
|
)),
|
|
1583
1035
|
slotProps: {
|
|
1584
1036
|
listbox: {
|
|
1585
|
-
component:
|
|
1586
|
-
return /* @__PURE__ */
|
|
1587
|
-
|
|
1037
|
+
component: import_react6.default.forwardRef(function ListboxComponent(props, ref) {
|
|
1038
|
+
return /* @__PURE__ */ import_react6.default.createElement(import_react6.default.Fragment, null, /* @__PURE__ */ import_react6.default.createElement(
|
|
1039
|
+
import_material5.Box,
|
|
1588
1040
|
__spreadProps(__spreadValues({
|
|
1589
1041
|
ref
|
|
1590
1042
|
}, props), {
|
|
@@ -1594,9 +1046,9 @@ function SCAutocomplete({
|
|
|
1594
1046
|
backgroundColor: "white"
|
|
1595
1047
|
}, props.sx)
|
|
1596
1048
|
}),
|
|
1597
|
-
checkMassive && typeFormat == "multiselect" ? /* @__PURE__ */
|
|
1049
|
+
checkMassive && typeFormat == "multiselect" ? /* @__PURE__ */ import_react6.default.createElement(import_react6.default.Fragment, null, /* @__PURE__ */ import_react6.default.createElement(import_material5.FormControlLabel, { control: /* @__PURE__ */ import_react6.default.createElement(import_material5.Checkbox, { checked: allSelected, indeterminate: selectedOptions.length > 0 && selectedOptions.length < data.length, onChange: handleCheckAll, color: "primary" }), label: "Todos los items", sx: { marginLeft: "0px !important", marginRight: "0px !important", padding: "7px 16px" } }), /* @__PURE__ */ import_react6.default.createElement(import_material5.Divider, null)) : "",
|
|
1598
1050
|
props.children,
|
|
1599
|
-
deleteType == "button" || fnAplicar ? /* @__PURE__ */
|
|
1051
|
+
deleteType == "button" || fnAplicar ? /* @__PURE__ */ import_react6.default.createElement(
|
|
1600
1052
|
import_Grid22.default,
|
|
1601
1053
|
{
|
|
1602
1054
|
container: true,
|
|
@@ -1611,8 +1063,8 @@ function SCAutocomplete({
|
|
|
1611
1063
|
justifyContent: "space-between"
|
|
1612
1064
|
}
|
|
1613
1065
|
},
|
|
1614
|
-
deleteType == "button" ? /* @__PURE__ */
|
|
1615
|
-
|
|
1066
|
+
deleteType == "button" ? /* @__PURE__ */ import_react6.default.createElement(
|
|
1067
|
+
import_material5.Button,
|
|
1616
1068
|
{
|
|
1617
1069
|
variant: "text",
|
|
1618
1070
|
color: "primary",
|
|
@@ -1624,8 +1076,8 @@ function SCAutocomplete({
|
|
|
1624
1076
|
},
|
|
1625
1077
|
"Limpiar"
|
|
1626
1078
|
) : "",
|
|
1627
|
-
fnAplicar && /* @__PURE__ */
|
|
1628
|
-
|
|
1079
|
+
fnAplicar && /* @__PURE__ */ import_react6.default.createElement(
|
|
1080
|
+
import_material5.Button,
|
|
1629
1081
|
{
|
|
1630
1082
|
variant: "contained",
|
|
1631
1083
|
color: "primary",
|
|
@@ -1644,8 +1096,8 @@ function SCAutocomplete({
|
|
|
1644
1096
|
}
|
|
1645
1097
|
|
|
1646
1098
|
// src/Components/SCDateRange.tsx
|
|
1647
|
-
var
|
|
1648
|
-
var
|
|
1099
|
+
var import_react7 = __toESM(require("react"), 1);
|
|
1100
|
+
var import_material6 = require("@mui/material");
|
|
1649
1101
|
var import_LocalizationProvider = require("@mui/x-date-pickers/LocalizationProvider");
|
|
1650
1102
|
var import_AdapterDayjs = require("@mui/x-date-pickers/AdapterDayjs");
|
|
1651
1103
|
var import_DateRangePicker = require("@mui/x-date-pickers-pro/DateRangePicker");
|
|
@@ -1676,7 +1128,7 @@ var SCDateRange = ({
|
|
|
1676
1128
|
];
|
|
1677
1129
|
setState(convertedValue);
|
|
1678
1130
|
};
|
|
1679
|
-
return /* @__PURE__ */
|
|
1131
|
+
return /* @__PURE__ */ import_react7.default.createElement(import_LocalizationProvider.LocalizationProvider, { dateAdapter: import_AdapterDayjs.AdapterDayjs, adapterLocale: "es" }, /* @__PURE__ */ import_react7.default.createElement(import_material6.Box, { sx: { width: "100%" } }, /* @__PURE__ */ import_react7.default.createElement(
|
|
1680
1132
|
import_DateRangePicker.DateRangePicker,
|
|
1681
1133
|
{
|
|
1682
1134
|
value: state,
|
|
@@ -1695,7 +1147,7 @@ var SCDateRange = ({
|
|
|
1695
1147
|
required,
|
|
1696
1148
|
error: position === "start" ? isStartEmpty : isEndEmpty,
|
|
1697
1149
|
InputProps: {
|
|
1698
|
-
endAdornment: /* @__PURE__ */
|
|
1150
|
+
endAdornment: /* @__PURE__ */ import_react7.default.createElement(import_material6.InputAdornment, { position: "end" }, /* @__PURE__ */ import_react7.default.createElement(
|
|
1699
1151
|
import_Event.default,
|
|
1700
1152
|
{
|
|
1701
1153
|
color: hasError ? "error" : "action",
|
|
@@ -1736,81 +1188,29 @@ var getIcon2 = (iconName) => {
|
|
|
1736
1188
|
};
|
|
1737
1189
|
|
|
1738
1190
|
// src/Components/Drawer/Helpers/validateInput.tsx
|
|
1739
|
-
var validateInputs = (arrayElements, onError, onSuccess
|
|
1740
|
-
var _a
|
|
1191
|
+
var validateInputs = (arrayElements, onError, onSuccess) => {
|
|
1192
|
+
var _a;
|
|
1741
1193
|
let requiredValues = 0;
|
|
1742
1194
|
let filledValues = 0;
|
|
1743
1195
|
for (let i = 0; i < arrayElements.length; i++) {
|
|
1744
|
-
|
|
1745
|
-
|
|
1746
|
-
|
|
1747
|
-
|
|
1748
|
-
|
|
1749
|
-
if (textValue.trim() !== "" && textValue.trim() !== ",") {
|
|
1196
|
+
if (arrayElements[i].component === void 0) {
|
|
1197
|
+
if (arrayElements[i].required) {
|
|
1198
|
+
requiredValues++;
|
|
1199
|
+
}
|
|
1200
|
+
if (arrayElements[i].required && ((_a = arrayElements[i].state) == null ? void 0 : _a.trim()) !== "") {
|
|
1750
1201
|
filledValues++;
|
|
1751
1202
|
}
|
|
1752
1203
|
}
|
|
1753
1204
|
}
|
|
1754
1205
|
if (requiredValues === filledValues) {
|
|
1755
1206
|
onSuccess();
|
|
1756
|
-
setChipFilters(true);
|
|
1757
1207
|
} else {
|
|
1758
1208
|
onError({
|
|
1759
1209
|
type: "error",
|
|
1760
1210
|
title: "Algunos campos son requeridos",
|
|
1761
1211
|
time: 10
|
|
1762
1212
|
});
|
|
1763
|
-
setChipFilters(false);
|
|
1764
|
-
}
|
|
1765
|
-
};
|
|
1766
|
-
|
|
1767
|
-
// src/Components/Drawer/Helpers/validateTypeElement.tsx
|
|
1768
|
-
var import_react11 = __toESM(require("react"), 1);
|
|
1769
|
-
var validateTypeElements = (element) => {
|
|
1770
|
-
var _a;
|
|
1771
|
-
let validation = "";
|
|
1772
|
-
let typeElement = element;
|
|
1773
|
-
if (element.type == "textField") {
|
|
1774
|
-
validation = "textField";
|
|
1775
|
-
typeElement = element;
|
|
1776
|
-
} else if (import_react11.default.isValidElement(element == null ? void 0 : element.component) && element.component.type && element.component.type.name == "SCtextField") {
|
|
1777
|
-
validation = "textField";
|
|
1778
|
-
typeElement = element == null ? void 0 : element.component.props;
|
|
1779
|
-
} else if (element.type == "textArea") {
|
|
1780
|
-
validation = "textArea";
|
|
1781
|
-
typeElement = element;
|
|
1782
|
-
} else if (import_react11.default.isValidElement(element == null ? void 0 : element.component) && element.component.type && element.component.type.name == "SCtextArea") {
|
|
1783
|
-
validation = "textArea";
|
|
1784
|
-
typeElement = element == null ? void 0 : element.component.props;
|
|
1785
|
-
} else if (element.type == "dateRange") {
|
|
1786
|
-
validation = "dateRange";
|
|
1787
|
-
typeElement = element;
|
|
1788
|
-
} else if (import_react11.default.isValidElement(element == null ? void 0 : element.component) && element.component.type && element.component.type.name == "SCDateRange") {
|
|
1789
|
-
validation = "dateRange";
|
|
1790
|
-
typeElement = element == null ? void 0 : element.component.props;
|
|
1791
|
-
} else if (element.type == "autocomplete") {
|
|
1792
|
-
validation = "autocomplete";
|
|
1793
|
-
typeElement = element;
|
|
1794
|
-
} else if (import_react11.default.isValidElement(element == null ? void 0 : element.component) && element.component.type && element.component.type.name == "SCAutocomplete") {
|
|
1795
|
-
validation = "autocomplete";
|
|
1796
|
-
typeElement = element == null ? void 0 : element.component.props;
|
|
1797
|
-
} else if (element.typeFormat == "multiselect") {
|
|
1798
|
-
validation = "multiselect";
|
|
1799
|
-
typeElement = element;
|
|
1800
|
-
} else if (import_react11.default.isValidElement(element == null ? void 0 : element.component) && element.component.props && ((_a = element == null ? void 0 : element.component) == null ? void 0 : _a.props).typeFormat == "multiselect") {
|
|
1801
|
-
validation = "multiselect";
|
|
1802
|
-
typeElement = element == null ? void 0 : element.component.props;
|
|
1803
|
-
} else if (element.type == "select") {
|
|
1804
|
-
validation = "select";
|
|
1805
|
-
typeElement = element;
|
|
1806
|
-
} else if (import_react11.default.isValidElement(element == null ? void 0 : element.component) && element.component.type && element.component.type.name == "SCSelect") {
|
|
1807
|
-
validation = "select";
|
|
1808
|
-
typeElement = element == null ? void 0 : element.component.props;
|
|
1809
1213
|
}
|
|
1810
|
-
return {
|
|
1811
|
-
validation,
|
|
1812
|
-
element: typeElement
|
|
1813
|
-
};
|
|
1814
1214
|
};
|
|
1815
1215
|
|
|
1816
1216
|
// src/Components/Drawer/SCDrawer.tsx
|
|
@@ -1825,42 +1225,16 @@ function SCDrawer({
|
|
|
1825
1225
|
anchor = "left",
|
|
1826
1226
|
width,
|
|
1827
1227
|
//Funcionales
|
|
1828
|
-
open
|
|
1829
|
-
setOpen,
|
|
1830
|
-
chipFilters
|
|
1228
|
+
open
|
|
1831
1229
|
}) {
|
|
1832
1230
|
var _a, _b;
|
|
1833
|
-
const
|
|
1834
|
-
const [
|
|
1835
|
-
const [toast, setToast] = import_react12.default.useState(null);
|
|
1836
|
-
const [stateChipFilters, setChipFilters] = import_react12.default.useState(false);
|
|
1837
|
-
const [textFilters, setTextFilters] = import_react12.default.useState([]);
|
|
1838
|
-
(0, import_react12.useEffect)(() => {
|
|
1839
|
-
if (chipFilters != void 0) {
|
|
1840
|
-
if (chipFilters.length > 0) {
|
|
1841
|
-
setTextFilters([]);
|
|
1842
|
-
inputValidation();
|
|
1843
|
-
}
|
|
1844
|
-
}
|
|
1845
|
-
}, [chipFilters]);
|
|
1846
|
-
(0, import_react12.useEffect)(() => {
|
|
1847
|
-
if (open) {
|
|
1848
|
-
toggleDrawer(true);
|
|
1849
|
-
} else {
|
|
1850
|
-
handleDrawerClose();
|
|
1851
|
-
}
|
|
1852
|
-
}, [open]);
|
|
1231
|
+
const [drawerOpen, setDrawerOpen] = import_react8.default.useState(open);
|
|
1232
|
+
const [toast, setToast] = import_react8.default.useState(null);
|
|
1853
1233
|
const handleDrawerClose = () => {
|
|
1854
1234
|
setDrawerOpen(false);
|
|
1855
|
-
if (setOpen) {
|
|
1856
|
-
setOpen(false);
|
|
1857
|
-
}
|
|
1858
1235
|
};
|
|
1859
1236
|
const toggleDrawer = (newOpen) => () => {
|
|
1860
1237
|
setDrawerOpen(newOpen);
|
|
1861
|
-
if (setOpen) {
|
|
1862
|
-
setOpen(true);
|
|
1863
|
-
}
|
|
1864
1238
|
};
|
|
1865
1239
|
const ButtonIcon = getIcon2(buttonDrawer == null ? void 0 : buttonDrawer.icon);
|
|
1866
1240
|
const setToastWithDelay = (toastContent) => {
|
|
@@ -1869,179 +1243,39 @@ function SCDrawer({
|
|
|
1869
1243
|
setToast(toastContent);
|
|
1870
1244
|
}, 10);
|
|
1871
1245
|
};
|
|
1872
|
-
const inputValidation = () =>
|
|
1873
|
-
|
|
1874
|
-
|
|
1875
|
-
|
|
1876
|
-
|
|
1877
|
-
|
|
1878
|
-
|
|
1879
|
-
|
|
1880
|
-
|
|
1881
|
-
|
|
1882
|
-
|
|
1883
|
-
|
|
1884
|
-
|
|
1885
|
-
|
|
1886
|
-
|
|
1887
|
-
chipFilters.forEach((chipFilter) => {
|
|
1888
|
-
const chipValue = String(chipFilter).trim();
|
|
1889
|
-
if (currentValue === chipValue && currentValue !== "" && currentValue !== ",") {
|
|
1890
|
-
setTextFilters((prevFilters) => {
|
|
1891
|
-
const newFilter = { value: currentValue, arrayElement: typeElement };
|
|
1892
|
-
const existingFilterIndex = prevFilters.findIndex(
|
|
1893
|
-
(filter) => filter.arrayElement.label === arrayElement.label
|
|
1894
|
-
);
|
|
1895
|
-
if (existingFilterIndex !== -1) {
|
|
1896
|
-
const updatedFilters = [...prevFilters];
|
|
1897
|
-
updatedFilters[existingFilterIndex] = newFilter;
|
|
1898
|
-
return updatedFilters;
|
|
1899
|
-
} else {
|
|
1900
|
-
return [...prevFilters, newFilter];
|
|
1901
|
-
}
|
|
1902
|
-
});
|
|
1903
|
-
}
|
|
1904
|
-
});
|
|
1905
|
-
});
|
|
1906
|
-
}
|
|
1907
|
-
} else {
|
|
1908
|
-
const newFiltersToAdd = [];
|
|
1909
|
-
for (let i = 0; i < arrayElements.length; i++) {
|
|
1910
|
-
const element = arrayElements[i];
|
|
1911
|
-
const { validation, element: typeElement } = validateTypeElements(element);
|
|
1912
|
-
const textValue = ((_a2 = typeElement.state) == null ? void 0 : _a2.textValue) !== void 0 ? String((_b2 = typeElement.state) == null ? void 0 : _b2.textValue) : String(typeElement.state);
|
|
1913
|
-
if (textValue.trim() !== "" && textValue.trim() !== ",") {
|
|
1914
|
-
let newFilter;
|
|
1915
|
-
switch (validation) {
|
|
1916
|
-
case "dateRange":
|
|
1917
|
-
const values = `${(_c = typeElement.state[0]) == null ? void 0 : _c.format("DD/MM/YYYY")} - ${(_d = typeElement.state[1]) == null ? void 0 : _d.format("DD/MM/YYYY")}`;
|
|
1918
|
-
newFilter = { value: values, arrayElement: typeElement };
|
|
1919
|
-
break;
|
|
1920
|
-
default:
|
|
1921
|
-
newFilter = { value: textValue, arrayElement: typeElement };
|
|
1922
|
-
break;
|
|
1923
|
-
}
|
|
1924
|
-
const existingFilterByLabel = newFiltersToAdd.find(
|
|
1925
|
-
(filter) => filter.arrayElement.label === element.label
|
|
1926
|
-
);
|
|
1927
|
-
if (existingFilterByLabel) {
|
|
1928
|
-
existingFilterByLabel.value = newFilter.value;
|
|
1929
|
-
existingFilterByLabel.arrayElement = newFilter.arrayElement;
|
|
1246
|
+
const inputValidation = () => validateInputs(arrayElements, setToastWithDelay, handleDrawerClose);
|
|
1247
|
+
const clean = () => {
|
|
1248
|
+
arrayElements.forEach((element, index) => {
|
|
1249
|
+
var _a2, _b2, _c, _d, _e, _f, _g, _h;
|
|
1250
|
+
if (element.setState || import_react8.default.isValidElement(element == null ? void 0 : element.component) && ((_a2 = element.component.props) == null ? void 0 : _a2.setState)) {
|
|
1251
|
+
if (element.type === "textField" || import_react8.default.isValidElement(element == null ? void 0 : element.component) && element.component.type && element.component.type.name === "SCtextField" || (element.type === "textArea" || import_react8.default.isValidElement(element == null ? void 0 : element.component) && element.component.type && element.component.type.name === "SCtextArea")) {
|
|
1252
|
+
element.setState != void 0 ? element.setState("") : null;
|
|
1253
|
+
import_react8.default.isValidElement(element == null ? void 0 : element.component) && ((_b2 = element.component.props) == null ? void 0 : _b2.setState) && ((_d = (_c = element == null ? void 0 : element.component) == null ? void 0 : _c.props) == null ? void 0 : _d.setState(""));
|
|
1254
|
+
} else if (element.type === "dateRange" || import_react8.default.isValidElement(element == null ? void 0 : element.component) && element.component.type && element.component.type.name === "SCDateRange") {
|
|
1255
|
+
element.setState != void 0 ? element.setState([null, null]) : null;
|
|
1256
|
+
import_react8.default.isValidElement(element == null ? void 0 : element.component) && typeof ((_e = element.component.props) == null ? void 0 : _e.setState) === "function" && element.component.props.setState([null, null]);
|
|
1257
|
+
} else {
|
|
1258
|
+
if (element.type == "autocomplete" || import_react8.default.isValidElement(element == null ? void 0 : element.component) && element.component.type && element.component.type.name === "SCAutocomplete" || (element.typeFormat == "multiselect" || import_react8.default.isValidElement(element == null ? void 0 : element.component) && element.component.props && ((_f = element == null ? void 0 : element.component) == null ? void 0 : _f.props).typeFormat == "multiselect")) {
|
|
1259
|
+
element.setState != void 0 ? element.setState({ hiddenValue: [], textValue: [] }) : null;
|
|
1260
|
+
import_react8.default.isValidElement(element == null ? void 0 : element.component) && typeof ((_g = element.component.props) == null ? void 0 : _g.setState) === "function" && element.component.props.setState({ hiddenValue: [], textValue: [] });
|
|
1930
1261
|
} else {
|
|
1931
|
-
|
|
1262
|
+
element.setState != void 0 ? element.setState({ hiddenValue: "-1", textValue: "" }) : null;
|
|
1263
|
+
import_react8.default.isValidElement(element == null ? void 0 : element.component) && typeof ((_h = element.component.props) == null ? void 0 : _h.setState) === "function" && element.component.props.setState({ hiddenValue: "-1", textValue: "" });
|
|
1932
1264
|
}
|
|
1933
1265
|
}
|
|
1934
1266
|
}
|
|
1935
|
-
setTextFilters((prevFilters) => {
|
|
1936
|
-
let updatedFilters = [...prevFilters];
|
|
1937
|
-
newFiltersToAdd.forEach((newFilter) => {
|
|
1938
|
-
const existingFilterIndex = updatedFilters.findIndex(
|
|
1939
|
-
(filter) => filter.arrayElement.label === newFilter.arrayElement.label
|
|
1940
|
-
);
|
|
1941
|
-
if (existingFilterIndex !== -1) {
|
|
1942
|
-
updatedFilters[existingFilterIndex] = newFilter;
|
|
1943
|
-
} else {
|
|
1944
|
-
updatedFilters.push(newFilter);
|
|
1945
|
-
}
|
|
1946
|
-
});
|
|
1947
|
-
return updatedFilters;
|
|
1948
|
-
});
|
|
1949
|
-
validateInputs(arrayElements, setToastWithDelay, handleDrawerClose, setChipFilters, setTextFilters);
|
|
1950
|
-
}
|
|
1951
|
-
};
|
|
1952
|
-
const resetElementByType = (originalElement, validation, typeElement) => {
|
|
1953
|
-
let defaultValue;
|
|
1954
|
-
switch (validation) {
|
|
1955
|
-
case "textField":
|
|
1956
|
-
case "textArea":
|
|
1957
|
-
defaultValue = "";
|
|
1958
|
-
break;
|
|
1959
|
-
case "dateRange":
|
|
1960
|
-
defaultValue = [null, null];
|
|
1961
|
-
break;
|
|
1962
|
-
case "multiselect":
|
|
1963
|
-
defaultValue = { hiddenValue: [], textValue: [] };
|
|
1964
|
-
break;
|
|
1965
|
-
default:
|
|
1966
|
-
defaultValue = { hiddenValue: "-1", textValue: "" };
|
|
1967
|
-
}
|
|
1968
|
-
if (typeElement.setState) {
|
|
1969
|
-
typeElement.setState(defaultValue);
|
|
1970
|
-
}
|
|
1971
|
-
};
|
|
1972
|
-
const cleanFilters = () => {
|
|
1973
|
-
arrayElements.forEach((element) => {
|
|
1974
|
-
const { validation, element: typeElement } = validateTypeElements(element);
|
|
1975
|
-
if (typeElement.setState) {
|
|
1976
|
-
resetElementByType(element, validation, typeElement);
|
|
1977
|
-
}
|
|
1978
|
-
});
|
|
1979
|
-
setTextFilters([]);
|
|
1980
|
-
};
|
|
1981
|
-
const deleteFilter = (element) => {
|
|
1982
|
-
const { validation, element: typeElement } = validateTypeElements(element);
|
|
1983
|
-
if (typeElement.setState && shouldShowChips == true) {
|
|
1984
|
-
resetElementByType(element, validation, typeElement);
|
|
1985
|
-
setTextFilters(
|
|
1986
|
-
(prevFilters) => prevFilters.filter((filter) => filter.arrayElement.label !== element.label)
|
|
1987
|
-
);
|
|
1988
|
-
}
|
|
1989
|
-
};
|
|
1990
|
-
const scroll = (offset) => {
|
|
1991
|
-
if (scrollRef.current) {
|
|
1992
|
-
scrollRef.current.scrollLeft += offset;
|
|
1993
|
-
}
|
|
1994
|
-
};
|
|
1995
|
-
const hasActiveFilters = () => {
|
|
1996
|
-
return arrayElements.some((arrayElement) => {
|
|
1997
|
-
const { validation, element: typeElement } = validateTypeElements(arrayElement);
|
|
1998
|
-
if (typeElement.state.textValue !== void 0) {
|
|
1999
|
-
return String(typeElement.state.textValue).trim() !== "";
|
|
2000
|
-
} else if (validation === "dateRange") {
|
|
2001
|
-
return typeElement.state && typeElement.state[0] !== null && typeElement.state[1] !== null;
|
|
2002
|
-
} else {
|
|
2003
|
-
return String(typeElement.state).trim() !== "" && String(typeElement.state).trim() !== ",";
|
|
2004
|
-
}
|
|
2005
1267
|
});
|
|
2006
1268
|
};
|
|
2007
|
-
const
|
|
2008
|
-
|
|
2009
|
-
|
|
2010
|
-
import_material9.Box,
|
|
2011
|
-
{
|
|
2012
|
-
ref: scrollRef,
|
|
2013
|
-
gap: 0.3,
|
|
2014
|
-
sx: {
|
|
2015
|
-
display: "flex",
|
|
2016
|
-
overflowX: "auto",
|
|
2017
|
-
scrollBehavior: "smooth",
|
|
2018
|
-
"&::-webkit-scrollbar": { display: "none" }
|
|
2019
|
-
}
|
|
2020
|
-
},
|
|
2021
|
-
textFilters == null ? void 0 : textFilters.map((chipData, index) => /* @__PURE__ */ import_react12.default.createElement(
|
|
2022
|
-
import_material9.Chip,
|
|
2023
|
-
__spreadProps(__spreadValues({
|
|
2024
|
-
key: index,
|
|
2025
|
-
label: chipData.value
|
|
2026
|
-
}, chipData.arrayElement.required == false || chipData.arrayElement.required == void 0 ? { onDelete: () => deleteFilter(chipData.arrayElement) } : {}), {
|
|
2027
|
-
color: "default",
|
|
2028
|
-
variant: "filled",
|
|
2029
|
-
size: "small",
|
|
2030
|
-
sx: {
|
|
2031
|
-
flexShrink: 0,
|
|
2032
|
-
minWidth: "auto"
|
|
2033
|
-
}
|
|
2034
|
-
})
|
|
2035
|
-
))
|
|
2036
|
-
), /* @__PURE__ */ import_react12.default.createElement(import_material9.IconButton, { onClick: () => scroll(150), size: "small" }, /* @__PURE__ */ import_react12.default.createElement(import_ArrowForwardIos.default, { fontSize: "small" }))), (buttonDrawer == null ? void 0 : buttonDrawer.type) == "chip" ? /* @__PURE__ */ import_react12.default.createElement(
|
|
2037
|
-
import_material9.Chip,
|
|
1269
|
+
const actionsA = actions == false ? false : actions != void 0 ? actions : [{ text: "Aplicar filtros", fn: inputValidation }, { text: "Limpiar filtros", fn: clean }];
|
|
1270
|
+
return /* @__PURE__ */ import_react8.default.createElement(import_react8.default.Fragment, null, toast && /* @__PURE__ */ import_react8.default.createElement(SCToastNotification, __spreadValues({}, toast)), (buttonDrawer == null ? void 0 : buttonDrawer.type) == "chip" ? /* @__PURE__ */ import_react8.default.createElement(
|
|
1271
|
+
import_material7.Chip,
|
|
2038
1272
|
__spreadProps(__spreadValues({
|
|
2039
1273
|
onClick: toggleDrawer(true),
|
|
2040
1274
|
color: buttonDrawer == null ? void 0 : buttonDrawer.color,
|
|
2041
1275
|
variant: (buttonDrawer == null ? void 0 : buttonDrawer.variant) == "contained" ? "filled" : "outlined",
|
|
2042
1276
|
label: (_a = buttonDrawer == null ? void 0 : buttonDrawer.text) != null ? _a : "",
|
|
2043
|
-
icon: (buttonDrawer == null ? void 0 : buttonDrawer.iconPosition) === "left" && ButtonIcon ? /* @__PURE__ */
|
|
2044
|
-
deleteIcon: (buttonDrawer == null ? void 0 : buttonDrawer.iconPosition) === "right" && ButtonIcon ? /* @__PURE__ */
|
|
1277
|
+
icon: (buttonDrawer == null ? void 0 : buttonDrawer.iconPosition) === "left" && ButtonIcon ? /* @__PURE__ */ import_react8.default.createElement(ButtonIcon, { fontSize: "small" }) : void 0,
|
|
1278
|
+
deleteIcon: (buttonDrawer == null ? void 0 : buttonDrawer.iconPosition) === "right" && ButtonIcon ? /* @__PURE__ */ import_react8.default.createElement(ButtonIcon, { fontSize: "small" }) : void 0
|
|
2045
1279
|
}, (buttonDrawer == null ? void 0 : buttonDrawer.iconPosition) === "right" && ButtonIcon ? { onDelete: () => {
|
|
2046
1280
|
} } : {}), {
|
|
2047
1281
|
sx: {
|
|
@@ -2051,8 +1285,8 @@ function SCDrawer({
|
|
|
2051
1285
|
textTransform: "capitalize"
|
|
2052
1286
|
}
|
|
2053
1287
|
})
|
|
2054
|
-
) : /* @__PURE__ */
|
|
2055
|
-
|
|
1288
|
+
) : /* @__PURE__ */ import_react8.default.createElement(
|
|
1289
|
+
import_material7.Button,
|
|
2056
1290
|
{
|
|
2057
1291
|
"data-testid": "test-buttonDrawer",
|
|
2058
1292
|
sx: { textTransform: "capitalize" },
|
|
@@ -2060,12 +1294,12 @@ function SCDrawer({
|
|
|
2060
1294
|
onClick: toggleDrawer(true),
|
|
2061
1295
|
size: "small",
|
|
2062
1296
|
variant: (buttonDrawer == null ? void 0 : buttonDrawer.variant) != void 0 ? buttonDrawer == null ? void 0 : buttonDrawer.variant : "text",
|
|
2063
|
-
startIcon: ((buttonDrawer == null ? void 0 : buttonDrawer.iconPosition) === "left" || !(buttonDrawer == null ? void 0 : buttonDrawer.iconPosition)) && ButtonIcon ? /* @__PURE__ */
|
|
2064
|
-
endIcon: (buttonDrawer == null ? void 0 : buttonDrawer.iconPosition) === "right" && ButtonIcon ? /* @__PURE__ */
|
|
1297
|
+
startIcon: ((buttonDrawer == null ? void 0 : buttonDrawer.iconPosition) === "left" || !(buttonDrawer == null ? void 0 : buttonDrawer.iconPosition)) && ButtonIcon ? /* @__PURE__ */ import_react8.default.createElement(ButtonIcon, { fontSize: "small" }) : null,
|
|
1298
|
+
endIcon: (buttonDrawer == null ? void 0 : buttonDrawer.iconPosition) === "right" && ButtonIcon ? /* @__PURE__ */ import_react8.default.createElement(ButtonIcon, { fontSize: "small" }) : null
|
|
2065
1299
|
},
|
|
2066
1300
|
(_b = buttonDrawer == null ? void 0 : buttonDrawer.text) != null ? _b : ""
|
|
2067
|
-
)
|
|
2068
|
-
|
|
1301
|
+
), /* @__PURE__ */ import_react8.default.createElement(
|
|
1302
|
+
import_material7.Drawer,
|
|
2069
1303
|
{
|
|
2070
1304
|
open: drawerOpen,
|
|
2071
1305
|
onClose: toggleDrawer(false),
|
|
@@ -2078,15 +1312,15 @@ function SCDrawer({
|
|
|
2078
1312
|
}
|
|
2079
1313
|
}
|
|
2080
1314
|
},
|
|
2081
|
-
/* @__PURE__ */
|
|
1315
|
+
/* @__PURE__ */ import_react8.default.createElement(import_material7.Stack, { flexDirection: "column", height: "100%" }, /* @__PURE__ */ import_react8.default.createElement(import_Grid23.default, { container: true, sx: { backgroundColor: "primary.50", alignItems: "center", height: "42px", textAlign: "left", padding: "8px 12px", justifyContent: "space-between", alignContent: "center" } }, /* @__PURE__ */ import_react8.default.createElement(import_material7.Typography, { variant: "h6", color: colorTitle || "text.primary" }, title != null ? title : "Personaliza tu b\xFAsqueda"), /* @__PURE__ */ import_react8.default.createElement(import_material7.IconButton, { onClick: handleDrawerClose }, /* @__PURE__ */ import_react8.default.createElement(import_Close.default, { "data-testid": "test-button-close", sx: { color: "text.primary" } }))), /* @__PURE__ */ import_react8.default.createElement(import_material7.Stack, { alignItems: "flex-start", height: "100%", gap: "16px", flex: 1, overflow: "auto", padding: "16px" }, arrayElements == null ? void 0 : arrayElements.map((arrayElement, index) => {
|
|
2082
1316
|
var _a2, _b2, _c, _d, _e, _f;
|
|
2083
|
-
return /* @__PURE__ */
|
|
2084
|
-
|
|
1317
|
+
return /* @__PURE__ */ import_react8.default.createElement(
|
|
1318
|
+
import_material7.Box,
|
|
2085
1319
|
{
|
|
2086
1320
|
key: `Stack_${(_a2 = arrayElement.type) != null ? _a2 : ""} ${(_b2 = arrayElement.label) != null ? _b2 : ""}${index}`,
|
|
2087
1321
|
sx: { width: "100%" }
|
|
2088
1322
|
},
|
|
2089
|
-
arrayElement.component ? /* @__PURE__ */
|
|
1323
|
+
arrayElement.component ? /* @__PURE__ */ import_react8.default.createElement(import_material7.Stack, { direction: "row", alignItems: "left", gap: 1 }, arrayElement.component) : arrayElement.type === "textField" ? /* @__PURE__ */ import_react8.default.createElement(
|
|
2090
1324
|
SCTextField,
|
|
2091
1325
|
{
|
|
2092
1326
|
title: arrayElement.title,
|
|
@@ -2112,7 +1346,7 @@ function SCDrawer({
|
|
|
2112
1346
|
onBlur: arrayElement.onBlur,
|
|
2113
1347
|
onKeyDown: arrayElement.onKeyDown
|
|
2114
1348
|
}
|
|
2115
|
-
) : arrayElement.type === "textArea" ? /* @__PURE__ */
|
|
1349
|
+
) : arrayElement.type === "textArea" ? /* @__PURE__ */ import_react8.default.createElement(
|
|
2116
1350
|
SCTextArea,
|
|
2117
1351
|
{
|
|
2118
1352
|
title: arrayElement.title,
|
|
@@ -2131,7 +1365,7 @@ function SCDrawer({
|
|
|
2131
1365
|
state: arrayElement.state || "",
|
|
2132
1366
|
onBlur: arrayElement.onBlur
|
|
2133
1367
|
}
|
|
2134
|
-
) : arrayElement.type === "autocomplete" ? /* @__PURE__ */
|
|
1368
|
+
) : arrayElement.type === "autocomplete" ? /* @__PURE__ */ import_react8.default.createElement(
|
|
2135
1369
|
SCAutocomplete,
|
|
2136
1370
|
{
|
|
2137
1371
|
label: arrayElement.label,
|
|
@@ -2149,7 +1383,7 @@ function SCDrawer({
|
|
|
2149
1383
|
state: arrayElement.state || "",
|
|
2150
1384
|
inputChange: arrayElement.inputChange
|
|
2151
1385
|
}
|
|
2152
|
-
) : arrayElement.type === "select" ? /* @__PURE__ */
|
|
1386
|
+
) : arrayElement.type === "select" ? /* @__PURE__ */ import_react8.default.createElement(
|
|
2153
1387
|
SCSelect,
|
|
2154
1388
|
{
|
|
2155
1389
|
label: arrayElement.label,
|
|
@@ -2158,6 +1392,7 @@ function SCDrawer({
|
|
|
2158
1392
|
width: arrayElement.width,
|
|
2159
1393
|
size: arrayElement.size,
|
|
2160
1394
|
variant: arrayElement.variant,
|
|
1395
|
+
deleteType: arrayElement.deleteType,
|
|
2161
1396
|
required: arrayElement.required,
|
|
2162
1397
|
disabled: arrayElement.disabled,
|
|
2163
1398
|
background: arrayElement.background,
|
|
@@ -2165,7 +1400,7 @@ function SCDrawer({
|
|
|
2165
1400
|
setState: arrayElement.setState,
|
|
2166
1401
|
state: arrayElement.state || ""
|
|
2167
1402
|
}
|
|
2168
|
-
) : arrayElement.type === "dateRange" ? /* @__PURE__ */
|
|
1403
|
+
) : arrayElement.type === "dateRange" ? /* @__PURE__ */ import_react8.default.createElement(
|
|
2169
1404
|
SCDateRange,
|
|
2170
1405
|
{
|
|
2171
1406
|
labelDateInitial: arrayElement.labelDateInitial,
|
|
@@ -2178,7 +1413,7 @@ function SCDrawer({
|
|
|
2178
1413
|
}
|
|
2179
1414
|
) : null
|
|
2180
1415
|
);
|
|
2181
|
-
})), actionsA != void 0 && actionsA != false ? Array.isArray(actionsA) && (actionsA == null ? void 0 : actionsA.length) > 0 ? /* @__PURE__ */
|
|
1416
|
+
})), actionsA != void 0 && actionsA != false ? Array.isArray(actionsA) && (actionsA == null ? void 0 : actionsA.length) > 0 ? /* @__PURE__ */ import_react8.default.createElement(
|
|
2182
1417
|
import_Grid23.default,
|
|
2183
1418
|
{
|
|
2184
1419
|
sx: { borderTop: 1, borderColor: "#1018403B" },
|
|
@@ -2190,8 +1425,8 @@ function SCDrawer({
|
|
|
2190
1425
|
justifyContent: actionsA.length > 1 ? "space-between" : !anchor && anchor != "right" ? "flex-end" : "flex-start",
|
|
2191
1426
|
flexDirection: anchor != "right" ? "row-reverse" : "row"
|
|
2192
1427
|
},
|
|
2193
|
-
actionsA.map((btn, index) => /* @__PURE__ */
|
|
2194
|
-
|
|
1428
|
+
actionsA.map((btn, index) => /* @__PURE__ */ import_react8.default.createElement(
|
|
1429
|
+
import_material7.Button,
|
|
2195
1430
|
{
|
|
2196
1431
|
key: index,
|
|
2197
1432
|
variant: index === 0 || actionsA.length < 2 ? "contained" : "text",
|
|
@@ -2207,61 +1442,207 @@ function SCDrawer({
|
|
|
2207
1442
|
}
|
|
2208
1443
|
|
|
2209
1444
|
// src/Components/FooterAction/FooterAction.tsx
|
|
2210
|
-
var
|
|
2211
|
-
var
|
|
1445
|
+
var import_react9 = __toESM(require("react"), 1);
|
|
1446
|
+
var import_material8 = require("@mui/material");
|
|
2212
1447
|
var FooterAction = ({
|
|
2213
1448
|
leftContent,
|
|
2214
1449
|
rightContent,
|
|
2215
1450
|
label,
|
|
2216
1451
|
variant
|
|
2217
1452
|
}) => {
|
|
2218
|
-
return /* @__PURE__ */
|
|
2219
|
-
|
|
1453
|
+
return /* @__PURE__ */ import_react9.default.createElement(
|
|
1454
|
+
import_material8.AppBar,
|
|
2220
1455
|
{
|
|
2221
1456
|
color: "inherit",
|
|
2222
1457
|
sx: { position: variant == "float" ? "relative" : "fixed", left: 0, right: "auto", width: "100%", top: "auto", bottom: 0 }
|
|
2223
1458
|
},
|
|
2224
|
-
/* @__PURE__ */
|
|
2225
|
-
|
|
1459
|
+
/* @__PURE__ */ import_react9.default.createElement(
|
|
1460
|
+
import_material8.Toolbar,
|
|
2226
1461
|
{
|
|
2227
1462
|
id: "footer-toolbar",
|
|
2228
1463
|
sx: { gap: 1.5, minHeight: "50px !important" }
|
|
2229
1464
|
},
|
|
2230
1465
|
leftContent,
|
|
2231
|
-
/* @__PURE__ */
|
|
2232
|
-
label && /* @__PURE__ */
|
|
1466
|
+
/* @__PURE__ */ import_react9.default.createElement(import_material8.Box, { flexGrow: 1 }),
|
|
1467
|
+
label && /* @__PURE__ */ import_react9.default.createElement(import_material8.Typography, { variant: "body2", color: "text.secondary" }, label),
|
|
2233
1468
|
rightContent
|
|
2234
1469
|
)
|
|
2235
1470
|
);
|
|
2236
1471
|
};
|
|
2237
1472
|
|
|
1473
|
+
// src/Components/Modal/Helpers/Data.tsx
|
|
1474
|
+
var import_react10 = __toESM(require("react"), 1);
|
|
1475
|
+
var import_icons_material5 = require("@mui/icons-material");
|
|
1476
|
+
var modalStateConfig = {
|
|
1477
|
+
info: {
|
|
1478
|
+
color: "info",
|
|
1479
|
+
defaultDescription: "Se [sincronizar\xE1n] los datos trabajados en modo offline y se [subir\xE1n] a los servidores.",
|
|
1480
|
+
icon: /* @__PURE__ */ import_react10.default.createElement(import_icons_material5.Info, { color: "info", fontSize: "medium" })
|
|
1481
|
+
},
|
|
1482
|
+
delete: {
|
|
1483
|
+
color: "delete",
|
|
1484
|
+
defaultDescription: "[Elemento espec\xEDfico] [dejar\xE1 de existir en todos los lugares donde est\xE9 en uso]. Esta acci\xF3n es irreversible.",
|
|
1485
|
+
icon: /* @__PURE__ */ import_react10.default.createElement(import_icons_material5.Info, { color: "error", fontSize: "medium" })
|
|
1486
|
+
},
|
|
1487
|
+
warning: {
|
|
1488
|
+
color: "warning",
|
|
1489
|
+
defaultDescription: "Se descartar\xE1 la [creaci\xF3n] y los cambios se perder\xE1n.",
|
|
1490
|
+
icon: /* @__PURE__ */ import_react10.default.createElement(import_icons_material5.Warning, { color: "warning", fontSize: "medium" })
|
|
1491
|
+
}
|
|
1492
|
+
};
|
|
1493
|
+
|
|
1494
|
+
// src/Components/Modal/Helpers/Utils.tsx
|
|
1495
|
+
var MuiIcons2 = __toESM(require("@mui/icons-material"), 1);
|
|
1496
|
+
var import_icons_material6 = require("@mui/icons-material");
|
|
1497
|
+
var getIconComponent2 = (iconName) => {
|
|
1498
|
+
return iconName && MuiIcons2[iconName] ? MuiIcons2[iconName] : import_icons_material6.FilterListOutlined;
|
|
1499
|
+
};
|
|
1500
|
+
var getModalColor = (state) => {
|
|
1501
|
+
var _a;
|
|
1502
|
+
const colors = {
|
|
1503
|
+
info: "info.100",
|
|
1504
|
+
delete: "error.100",
|
|
1505
|
+
warning: "warning.100"
|
|
1506
|
+
};
|
|
1507
|
+
return (_a = colors[state]) != null ? _a : "warning.100";
|
|
1508
|
+
};
|
|
1509
|
+
var getButtonColor = (state) => {
|
|
1510
|
+
var _a;
|
|
1511
|
+
const colorMap = {
|
|
1512
|
+
info: "info",
|
|
1513
|
+
delete: "error",
|
|
1514
|
+
warning: "warning"
|
|
1515
|
+
};
|
|
1516
|
+
return (_a = colorMap[state]) != null ? _a : "info";
|
|
1517
|
+
};
|
|
1518
|
+
|
|
1519
|
+
// src/Components/Modal/SCModal.tsx
|
|
1520
|
+
var import_react11 = __toESM(require("react"), 1);
|
|
1521
|
+
var import_material9 = require("@mui/material");
|
|
1522
|
+
var import_icons_material7 = require("@mui/icons-material");
|
|
1523
|
+
|
|
1524
|
+
// src/generales/capitalize.tsx
|
|
1525
|
+
function capitalize(text) {
|
|
1526
|
+
return text.charAt(0).toUpperCase() + text.slice(1);
|
|
1527
|
+
}
|
|
1528
|
+
|
|
1529
|
+
// src/Components/Modal/SCModal.tsx
|
|
1530
|
+
var SCModal = ({
|
|
1531
|
+
buttonModal,
|
|
1532
|
+
state = "info",
|
|
1533
|
+
open,
|
|
1534
|
+
title,
|
|
1535
|
+
description,
|
|
1536
|
+
action
|
|
1537
|
+
}) => {
|
|
1538
|
+
var _a, _b, _c, _d, _e;
|
|
1539
|
+
const [openModal, setOpenModal] = (0, import_react11.useState)(open != null ? open : false);
|
|
1540
|
+
(0, import_react11.useEffect)(() => {
|
|
1541
|
+
if (open !== void 0) {
|
|
1542
|
+
setOpenModal(open);
|
|
1543
|
+
}
|
|
1544
|
+
}, [open]);
|
|
1545
|
+
const Icon = (0, import_react11.useMemo)(() => getIconComponent2(buttonModal == null ? void 0 : buttonModal.icon), [buttonModal == null ? void 0 : buttonModal.icon]);
|
|
1546
|
+
const handleClose = (0, import_react11.useCallback)(() => setOpenModal(false), []);
|
|
1547
|
+
const toggleModal = (newOpen) => () => setOpenModal(newOpen);
|
|
1548
|
+
const prevAction = (0, import_react11.useMemo)(
|
|
1549
|
+
() => action != null ? action : [{ text: "Cancelar", fn: handleClose }, { text: "Consultar", fn: () => {
|
|
1550
|
+
} }],
|
|
1551
|
+
[action, handleClose]
|
|
1552
|
+
);
|
|
1553
|
+
const { icon, defaultDescription } = modalStateConfig[state];
|
|
1554
|
+
return /* @__PURE__ */ import_react11.default.createElement(import_react11.default.Fragment, null, /* @__PURE__ */ import_react11.default.createElement(
|
|
1555
|
+
import_material9.Button,
|
|
1556
|
+
{
|
|
1557
|
+
"data-testid": "test-buttonModal",
|
|
1558
|
+
color: (_a = buttonModal == null ? void 0 : buttonModal.color) != null ? _a : "primary",
|
|
1559
|
+
onClick: toggleModal(true),
|
|
1560
|
+
variant: (_b = buttonModal == null ? void 0 : buttonModal.variant) != null ? _b : "text",
|
|
1561
|
+
size: (_c = buttonModal == null ? void 0 : buttonModal.size) != null ? _c : "small",
|
|
1562
|
+
startIcon: (buttonModal == null ? void 0 : buttonModal.iconPosition) === "left" && /* @__PURE__ */ import_react11.default.createElement(Icon, null),
|
|
1563
|
+
endIcon: (buttonModal == null ? void 0 : buttonModal.iconPosition) === "right" && /* @__PURE__ */ import_react11.default.createElement(Icon, null)
|
|
1564
|
+
},
|
|
1565
|
+
capitalize((_d = buttonModal == null ? void 0 : buttonModal.text) != null ? _d : "filtrar")
|
|
1566
|
+
), /* @__PURE__ */ import_react11.default.createElement(import_material9.Modal, { open: openModal, onClose: toggleModal(false), sx: { boxShadow: 8 } }, /* @__PURE__ */ import_react11.default.createElement(
|
|
1567
|
+
import_material9.Box,
|
|
1568
|
+
{
|
|
1569
|
+
sx: {
|
|
1570
|
+
position: "absolute",
|
|
1571
|
+
top: "50%",
|
|
1572
|
+
left: "50%",
|
|
1573
|
+
transform: "translate(-50%, -50%)",
|
|
1574
|
+
width: 400,
|
|
1575
|
+
bgcolor: "background.paper",
|
|
1576
|
+
borderRadius: 1,
|
|
1577
|
+
boxShadow: 24
|
|
1578
|
+
}
|
|
1579
|
+
},
|
|
1580
|
+
/* @__PURE__ */ import_react11.default.createElement(import_material9.Stack, { direction: "row", justifyContent: "space-between", alignItems: "center" }, /* @__PURE__ */ import_react11.default.createElement(import_material9.Stack, { direction: "row", alignItems: "center", p: 1, gap: 1.5 }, /* @__PURE__ */ import_react11.default.createElement(import_material9.Box, { display: "flex", justifyContent: "center", alignItems: "center", borderRadius: "50%", height: 36, width: 36, bgcolor: getModalColor(state) }, icon), /* @__PURE__ */ import_react11.default.createElement(import_material9.Typography, { variant: "h6", color: "text.primary" }, title)), /* @__PURE__ */ import_react11.default.createElement(import_material9.IconButton, { onClick: toggleModal(false), "data-testid": "test-buttonClose" }, /* @__PURE__ */ import_react11.default.createElement(import_icons_material7.Close, { color: "action" }))),
|
|
1581
|
+
/* @__PURE__ */ import_react11.default.createElement(import_material9.Stack, { py: 1, px: 3, gap: 1.5 }, /* @__PURE__ */ import_react11.default.createElement(import_material9.Typography, { variant: "body1" }, description || defaultDescription)),
|
|
1582
|
+
action && /* @__PURE__ */ import_react11.default.createElement(
|
|
1583
|
+
import_material9.Stack,
|
|
1584
|
+
{
|
|
1585
|
+
id: "Action",
|
|
1586
|
+
direction: "row",
|
|
1587
|
+
gap: 1,
|
|
1588
|
+
p: 1,
|
|
1589
|
+
justifyContent: "end",
|
|
1590
|
+
bgcolor: "grey.50",
|
|
1591
|
+
sx: { borderRadius: 1 }
|
|
1592
|
+
},
|
|
1593
|
+
/* @__PURE__ */ import_react11.default.createElement(
|
|
1594
|
+
import_material9.Button,
|
|
1595
|
+
{
|
|
1596
|
+
color: "inherit",
|
|
1597
|
+
variant: "text",
|
|
1598
|
+
onClick: handleClose,
|
|
1599
|
+
size: "small"
|
|
1600
|
+
},
|
|
1601
|
+
capitalize("cancelar")
|
|
1602
|
+
),
|
|
1603
|
+
/* @__PURE__ */ import_react11.default.createElement(
|
|
1604
|
+
import_material9.Button,
|
|
1605
|
+
{
|
|
1606
|
+
"data-testid": "test-aceptar",
|
|
1607
|
+
color: getButtonColor(state),
|
|
1608
|
+
variant: "contained",
|
|
1609
|
+
onClick: (_e = action[0]) == null ? void 0 : _e.fn,
|
|
1610
|
+
disabled: false,
|
|
1611
|
+
size: "small"
|
|
1612
|
+
},
|
|
1613
|
+
capitalize(action[0].text)
|
|
1614
|
+
)
|
|
1615
|
+
)
|
|
1616
|
+
)));
|
|
1617
|
+
};
|
|
1618
|
+
|
|
2238
1619
|
// src/Components/MultiSelect/MultiSelect.tsx
|
|
2239
|
-
var
|
|
2240
|
-
var
|
|
2241
|
-
var
|
|
1620
|
+
var import_react14 = __toESM(require("react"), 1);
|
|
1621
|
+
var import_material10 = require("@mui/material");
|
|
1622
|
+
var import_icons_material9 = require("@mui/icons-material");
|
|
2242
1623
|
|
|
2243
1624
|
// src/Components/MultiSelect/helpers/useHandlers.tsx
|
|
2244
|
-
var
|
|
1625
|
+
var import_react12 = require("react");
|
|
2245
1626
|
function useMultiSelectHandlers() {
|
|
2246
|
-
const [anchorEl, setAnchorEl] = (0,
|
|
2247
|
-
const [open, setOpen] = (0,
|
|
2248
|
-
const [selectedItems, setSelectedItems] = (0,
|
|
2249
|
-
const [filterValue, setFilterValue] = (0,
|
|
2250
|
-
const handleOpen = (0,
|
|
1627
|
+
const [anchorEl, setAnchorEl] = (0, import_react12.useState)(null);
|
|
1628
|
+
const [open, setOpen] = (0, import_react12.useState)(false);
|
|
1629
|
+
const [selectedItems, setSelectedItems] = (0, import_react12.useState)([]);
|
|
1630
|
+
const [filterValue, setFilterValue] = (0, import_react12.useState)("");
|
|
1631
|
+
const handleOpen = (0, import_react12.useCallback)((e) => {
|
|
2251
1632
|
setAnchorEl(e.currentTarget);
|
|
2252
1633
|
setOpen(true);
|
|
2253
1634
|
}, []);
|
|
2254
|
-
const handleClose = (0,
|
|
1635
|
+
const handleClose = (0, import_react12.useCallback)(() => {
|
|
2255
1636
|
setAnchorEl(null);
|
|
2256
1637
|
setOpen(false);
|
|
2257
1638
|
}, []);
|
|
2258
|
-
const handleFilterChange = (0,
|
|
1639
|
+
const handleFilterChange = (0, import_react12.useCallback)(
|
|
2259
1640
|
(e) => {
|
|
2260
1641
|
setFilterValue(e.target.value);
|
|
2261
1642
|
},
|
|
2262
1643
|
[]
|
|
2263
1644
|
);
|
|
2264
|
-
const handleCheckboxToggle = (0,
|
|
1645
|
+
const handleCheckboxToggle = (0, import_react12.useCallback)((item) => {
|
|
2265
1646
|
setSelectedItems(
|
|
2266
1647
|
(prev) => prev.includes(item) ? prev.filter((i) => i !== item) : [...prev, item]
|
|
2267
1648
|
);
|
|
@@ -2282,21 +1663,21 @@ function useMultiSelectHandlers() {
|
|
|
2282
1663
|
|
|
2283
1664
|
// src/Components/MultiSelect/helpers/Utils.tsx
|
|
2284
1665
|
var MuiIcons3 = __toESM(require("@mui/icons-material"), 1);
|
|
2285
|
-
var
|
|
1666
|
+
var import_icons_material8 = require("@mui/icons-material");
|
|
2286
1667
|
function getIconMultiSelect(name) {
|
|
2287
|
-
return name in MuiIcons3 ? MuiIcons3[name] :
|
|
1668
|
+
return name in MuiIcons3 ? MuiIcons3[name] : import_icons_material8.FilterListOutlined;
|
|
2288
1669
|
}
|
|
2289
1670
|
|
|
2290
1671
|
// src/Components/MultiSelect/helpers/useFilteredItems.tsx
|
|
2291
|
-
var
|
|
1672
|
+
var import_react13 = require("react");
|
|
2292
1673
|
function useFilteredItems(items, filterValue, getItemLabel, selectedItems) {
|
|
2293
|
-
const filteredItems = (0,
|
|
1674
|
+
const filteredItems = (0, import_react13.useMemo)(
|
|
2294
1675
|
() => items.filter(
|
|
2295
1676
|
(item) => getItemLabel(item).toLowerCase().includes(filterValue.toLowerCase())
|
|
2296
1677
|
),
|
|
2297
1678
|
[items, filterValue, getItemLabel]
|
|
2298
1679
|
);
|
|
2299
|
-
const sortedItems = (0,
|
|
1680
|
+
const sortedItems = (0, import_react13.useMemo)(() => {
|
|
2300
1681
|
return [
|
|
2301
1682
|
...filteredItems.filter((item) => selectedItems.includes(item)),
|
|
2302
1683
|
...filteredItems.filter((item) => !selectedItems.includes(item))
|
|
@@ -2330,16 +1711,16 @@ function MultiSelect({
|
|
|
2330
1711
|
handleCheckboxToggle,
|
|
2331
1712
|
setOpen
|
|
2332
1713
|
} = useMultiSelectHandlers();
|
|
2333
|
-
(0,
|
|
1714
|
+
(0, import_react14.useEffect)(() => {
|
|
2334
1715
|
if (open !== void 0) {
|
|
2335
1716
|
setOpen(open);
|
|
2336
1717
|
}
|
|
2337
1718
|
}, [open, setOpen]);
|
|
2338
|
-
(0,
|
|
1719
|
+
(0, import_react14.useEffect)(() => {
|
|
2339
1720
|
setSelectedItems([]);
|
|
2340
1721
|
}, [items, setSelectedItems]);
|
|
2341
1722
|
const { filteredItems, sortedItems } = useFilteredItems(items, filterValue, getItemLabel, selectedItems);
|
|
2342
|
-
const Icon = (0,
|
|
1723
|
+
const Icon = (0, import_react14.useMemo)(() => {
|
|
2343
1724
|
var _a2;
|
|
2344
1725
|
return getIconMultiSelect((_a2 = button == null ? void 0 : button.icon) != null ? _a2 : "FilterListOutlined");
|
|
2345
1726
|
}, [button == null ? void 0 : button.icon]);
|
|
@@ -2353,20 +1734,20 @@ function MultiSelect({
|
|
|
2353
1734
|
{ text: "Aplicar", fn: () => {
|
|
2354
1735
|
} }
|
|
2355
1736
|
];
|
|
2356
|
-
return /* @__PURE__ */
|
|
2357
|
-
|
|
1737
|
+
return /* @__PURE__ */ import_react14.default.createElement(import_react14.default.Fragment, null, /* @__PURE__ */ import_react14.default.createElement(
|
|
1738
|
+
import_material10.Button,
|
|
2358
1739
|
{
|
|
2359
1740
|
"test-id": "multiselect-button",
|
|
2360
1741
|
color: (_a = button == null ? void 0 : button.color) != null ? _a : "primary",
|
|
2361
1742
|
onClick: handleOpen,
|
|
2362
1743
|
variant: (_b = button == null ? void 0 : button.variant) != null ? _b : "text",
|
|
2363
1744
|
size: "small",
|
|
2364
|
-
startIcon: (button == null ? void 0 : button.iconPosition) === "left" || !(button == null ? void 0 : button.iconPosition) ? /* @__PURE__ */
|
|
2365
|
-
endIcon: (button == null ? void 0 : button.iconPosition) === "right" ? /* @__PURE__ */
|
|
1745
|
+
startIcon: (button == null ? void 0 : button.iconPosition) === "left" || !(button == null ? void 0 : button.iconPosition) ? /* @__PURE__ */ import_react14.default.createElement(Icon, null) : null,
|
|
1746
|
+
endIcon: (button == null ? void 0 : button.iconPosition) === "right" ? /* @__PURE__ */ import_react14.default.createElement(Icon, null) : null
|
|
2366
1747
|
},
|
|
2367
1748
|
capitalize(textButton != null ? textButton : "MultiSelect")
|
|
2368
|
-
), /* @__PURE__ */
|
|
2369
|
-
|
|
1749
|
+
), /* @__PURE__ */ import_react14.default.createElement(
|
|
1750
|
+
import_material10.Popover,
|
|
2370
1751
|
{
|
|
2371
1752
|
elevation: 8,
|
|
2372
1753
|
anchorEl,
|
|
@@ -2374,8 +1755,8 @@ function MultiSelect({
|
|
|
2374
1755
|
open: openMultiselect,
|
|
2375
1756
|
onClose: () => setOpen(false)
|
|
2376
1757
|
},
|
|
2377
|
-
/* @__PURE__ */
|
|
2378
|
-
|
|
1758
|
+
/* @__PURE__ */ import_react14.default.createElement(import_material10.Stack, { minWidth: "320px", "data-testid": "multiselect-container", bgcolor: "white", boxShadow: 3, borderRadius: 1 }, /* @__PURE__ */ import_react14.default.createElement(import_material10.Stack, { py: 1, px: 2 }, topPanel != null ? topPanel : /* @__PURE__ */ import_react14.default.createElement(import_material10.FormControl, { fullWidth: true, size: "small" }, /* @__PURE__ */ import_react14.default.createElement(
|
|
1759
|
+
import_material10.TextField,
|
|
2379
1760
|
{
|
|
2380
1761
|
"data-testid": "multiselect-input",
|
|
2381
1762
|
fullWidth: true,
|
|
@@ -2386,29 +1767,29 @@ function MultiSelect({
|
|
|
2386
1767
|
onChange: handleFilterChange,
|
|
2387
1768
|
slotProps: {
|
|
2388
1769
|
input: {
|
|
2389
|
-
endAdornment: /* @__PURE__ */
|
|
1770
|
+
endAdornment: /* @__PURE__ */ import_react14.default.createElement(import_material10.InputAdornment, { position: "end" }, /* @__PURE__ */ import_react14.default.createElement(import_icons_material9.SearchOutlined, { fontSize: "small" }))
|
|
2390
1771
|
}
|
|
2391
1772
|
}
|
|
2392
1773
|
}
|
|
2393
|
-
))), /* @__PURE__ */
|
|
2394
|
-
|
|
1774
|
+
))), /* @__PURE__ */ import_react14.default.createElement(import_material10.Stack, { maxHeight: "300px", overflow: "auto" }, selectAll && /* @__PURE__ */ import_react14.default.createElement(import_material10.MenuItem, { dense, onClick: handleSelectAll }, /* @__PURE__ */ import_react14.default.createElement(import_material10.ListItemIcon, null, /* @__PURE__ */ import_react14.default.createElement(import_material10.Checkbox, { checked: allSelected, color: "primary" })), "Todos los items"), sortedItems.length > 0 ? sortedItems.map((item) => /* @__PURE__ */ import_react14.default.createElement(
|
|
1775
|
+
import_material10.MenuItem,
|
|
2395
1776
|
{
|
|
2396
1777
|
key: getItemLabel(item),
|
|
2397
1778
|
dense,
|
|
2398
1779
|
onClick: () => handleCheckboxToggle(item)
|
|
2399
1780
|
},
|
|
2400
|
-
/* @__PURE__ */
|
|
2401
|
-
|
|
1781
|
+
/* @__PURE__ */ import_react14.default.createElement(import_material10.ListItemIcon, null, /* @__PURE__ */ import_react14.default.createElement(
|
|
1782
|
+
import_material10.Checkbox,
|
|
2402
1783
|
{
|
|
2403
1784
|
checked: selectedItems.includes(item),
|
|
2404
1785
|
color: "primary"
|
|
2405
1786
|
}
|
|
2406
1787
|
)),
|
|
2407
1788
|
getItemLabel(item)
|
|
2408
|
-
)) : /* @__PURE__ */
|
|
1789
|
+
)) : /* @__PURE__ */ import_react14.default.createElement(import_material10.MenuItem, { disabled: true }, "No se encontraron resultados")), /* @__PURE__ */ import_react14.default.createElement(import_material10.Stack, { direction: "row", gap: 1, p: 1, justifyContent: "space-between", bgcolor: "grey.50" }, resolvedActions.map((button2, index) => {
|
|
2409
1790
|
var _a2;
|
|
2410
|
-
return /* @__PURE__ */
|
|
2411
|
-
|
|
1791
|
+
return /* @__PURE__ */ import_react14.default.createElement(
|
|
1792
|
+
import_material10.Button,
|
|
2412
1793
|
{
|
|
2413
1794
|
key: index,
|
|
2414
1795
|
variant: index === 0 || resolvedActions.length < 2 ? "text" : "contained",
|
|
@@ -2423,8 +1804,8 @@ function MultiSelect({
|
|
|
2423
1804
|
}
|
|
2424
1805
|
|
|
2425
1806
|
// src/Components/PageHeader/PageHeader.tsx
|
|
2426
|
-
var
|
|
2427
|
-
var
|
|
1807
|
+
var import_react15 = __toESM(require("react"), 1);
|
|
1808
|
+
var import_material11 = require("@mui/material");
|
|
2428
1809
|
var PageHeader = ({
|
|
2429
1810
|
title,
|
|
2430
1811
|
subtitle,
|
|
@@ -2433,8 +1814,8 @@ var PageHeader = ({
|
|
|
2433
1814
|
fixed,
|
|
2434
1815
|
shadow = true
|
|
2435
1816
|
}) => {
|
|
2436
|
-
return /* @__PURE__ */
|
|
2437
|
-
|
|
1817
|
+
return /* @__PURE__ */ import_react15.default.createElement(
|
|
1818
|
+
import_material11.Stack,
|
|
2438
1819
|
{
|
|
2439
1820
|
"data-testid": "main-container",
|
|
2440
1821
|
justifyContent: "center",
|
|
@@ -2445,13 +1826,13 @@ var PageHeader = ({
|
|
|
2445
1826
|
zIndex: 10,
|
|
2446
1827
|
sx: { boxShadow: shadow ? (theme) => theme.shadows[1] : "none" }
|
|
2447
1828
|
},
|
|
2448
|
-
/* @__PURE__ */
|
|
1829
|
+
/* @__PURE__ */ import_react15.default.createElement(import_material11.Stack, { "data-testid": "page-header-content", height: 40, px: 3, pl: buttonBack ? 1 : 3, direction: "row", alignItems: "center", justifyContent: "space-between" }, /* @__PURE__ */ import_react15.default.createElement(import_material11.Stack, { id: "left-section", direction: "row", alignItems: "center", gap: 1 }, buttonBack, /* @__PURE__ */ import_react15.default.createElement(import_material11.Stack, { id: "text-section", gap: 0.5 }, /* @__PURE__ */ import_react15.default.createElement(import_material11.Typography, { "data-testid": "page-header-title", variant: "h6", color: "text.primary" }, title), subtitle && /* @__PURE__ */ import_react15.default.createElement(import_material11.Typography, { "data-testid": "page-header-subtitle", variant: "caption", color: "text.primary" }, subtitle))), actions && /* @__PURE__ */ import_react15.default.createElement(import_material11.Stack, { id: "right-actions", direction: "row", alignItems: "center", gap: 1 }, actions))
|
|
2449
1830
|
);
|
|
2450
1831
|
};
|
|
2451
1832
|
|
|
2452
1833
|
// src/Components/SCCalendarSwipeable.tsx
|
|
2453
|
-
var
|
|
2454
|
-
var
|
|
1834
|
+
var import_react16 = __toESM(require("react"), 1);
|
|
1835
|
+
var import_material12 = require("@mui/material");
|
|
2455
1836
|
var import_Grid24 = __toESM(require("@mui/material/Grid2"), 1);
|
|
2456
1837
|
var import_AdapterDateFns = require("@mui/x-date-pickers/AdapterDateFns");
|
|
2457
1838
|
var import_LocalizationProvider2 = require("@mui/x-date-pickers/LocalizationProvider");
|
|
@@ -2469,14 +1850,14 @@ var SCCalendarSwipeable = ({
|
|
|
2469
1850
|
state
|
|
2470
1851
|
}) => {
|
|
2471
1852
|
let convertFecha;
|
|
2472
|
-
const [fecha, setFecha] = (0,
|
|
2473
|
-
const [fechaSeleccionada, setFechaSeleccionada] = (0,
|
|
2474
|
-
const [stateVal, setstateVal] =
|
|
2475
|
-
const [openCalendar, setOpenCalendar] =
|
|
1853
|
+
const [fecha, setFecha] = (0, import_react16.useState)(/* @__PURE__ */ new Date());
|
|
1854
|
+
const [fechaSeleccionada, setFechaSeleccionada] = (0, import_react16.useState)();
|
|
1855
|
+
const [stateVal, setstateVal] = import_react16.default.useState(/* @__PURE__ */ new Date());
|
|
1856
|
+
const [openCalendar, setOpenCalendar] = import_react16.default.useState(false);
|
|
2476
1857
|
const hoy = /* @__PURE__ */ new Date();
|
|
2477
1858
|
const inicioSemana = (0, import_date_fns.startOfWeek)(fecha, { weekStartsOn: 0 });
|
|
2478
1859
|
const diasSemana = Array.from({ length: 7 }, (_, i) => (0, import_date_fns.addDays)(inicioSemana, i));
|
|
2479
|
-
|
|
1860
|
+
import_react16.default.useEffect(() => {
|
|
2480
1861
|
if (fecha != null) {
|
|
2481
1862
|
handleConvertFecha(fecha);
|
|
2482
1863
|
}
|
|
@@ -2495,12 +1876,12 @@ var SCCalendarSwipeable = ({
|
|
|
2495
1876
|
setOpenCalendar(newOpen);
|
|
2496
1877
|
};
|
|
2497
1878
|
const locale = __spreadValues({}, import_locale.es);
|
|
2498
|
-
return /* @__PURE__ */
|
|
1879
|
+
return /* @__PURE__ */ import_react16.default.createElement(import_react16.default.Fragment, null, /* @__PURE__ */ import_react16.default.createElement(import_LocalizationProvider2.LocalizationProvider, { dateAdapter: import_AdapterDateFns.AdapterDateFns, adapterLocale: locale }, openCalendar == false ? /* @__PURE__ */ import_react16.default.createElement(import_material12.Box, { "data-testid": "calendar-mobile", sx: { width: "100%", background: background ? background : "white", display: "flex", flexDirection: "column", alignItems: "center" } }, /* @__PURE__ */ import_react16.default.createElement(import_material12.Box, { sx: { width: "100%", maxWidth: "320px", background: "transparent" } }, /* @__PURE__ */ import_react16.default.createElement(import_Grid24.default, { container: true, gap: 0.5, sx: {
|
|
2499
1880
|
justifyContent: "space-between",
|
|
2500
1881
|
padding: "12px 0px",
|
|
2501
1882
|
background: "transparent"
|
|
2502
|
-
} }, diasSemana.map((dia) => /* @__PURE__ */
|
|
2503
|
-
|
|
1883
|
+
} }, diasSemana.map((dia) => /* @__PURE__ */ import_react16.default.createElement(import_Grid24.default, { sx: { width: "36px" }, key: dia.toString() }, /* @__PURE__ */ import_react16.default.createElement(import_material12.Box, { sx: { width: "36px", height: "40px", display: "flex", alignItems: "center", justifyContent: "center" } }, /* @__PURE__ */ import_react16.default.createElement(import_material12.Typography, { sx: { fontSize: "12px !important", color: "#10184099" } }, (0, import_date_fns.format)(dia, "EEEE", { locale: import_locale.es }).charAt(0).toUpperCase())), /* @__PURE__ */ import_react16.default.createElement(
|
|
1884
|
+
import_material12.Box,
|
|
2504
1885
|
{
|
|
2505
1886
|
onClick: () => setFecha(dia),
|
|
2506
1887
|
sx: {
|
|
@@ -2515,8 +1896,8 @@ var SCCalendarSwipeable = ({
|
|
|
2515
1896
|
//height: '36px',
|
|
2516
1897
|
}
|
|
2517
1898
|
},
|
|
2518
|
-
/* @__PURE__ */
|
|
2519
|
-
)))), /* @__PURE__ */
|
|
1899
|
+
/* @__PURE__ */ import_react16.default.createElement(import_material12.Typography, { sx: { fontSize: "12px !important", color: (0, import_date_fns.isSameDay)(dia, fecha) ? "white" : "#101840DE" } }, (0, import_date_fns.format)(dia, "d"))
|
|
1900
|
+
)))), /* @__PURE__ */ import_react16.default.createElement(import_Grid24.default, { container: true, justifyContent: "center" }, /* @__PURE__ */ import_react16.default.createElement(import_material12.IconButton, { "data-testid": "open-calendar-button", onClick: toggleCalendar(true) }, /* @__PURE__ */ import_react16.default.createElement(import_KeyboardDoubleArrowDown.default, null))))) : /* @__PURE__ */ import_react16.default.createElement(import_material12.Box, { sx: { width: "100%", background: "white" } }, /* @__PURE__ */ import_react16.default.createElement(
|
|
2520
1901
|
import_StaticDatePicker.StaticDatePicker,
|
|
2521
1902
|
{
|
|
2522
1903
|
orientation: "landscape",
|
|
@@ -2526,17 +1907,17 @@ var SCCalendarSwipeable = ({
|
|
|
2526
1907
|
sx: { fontSize: "12px !important", height: "300px !important", background: background ? background : "white", "& .MuiDayCalendar-header": { justifyContent: "space-between" }, "& .MuiDayCalendar-weekContainer": { justifyContent: "space-between" }, "& .MuiPickersCalendarHeader-root": { paddingLeft: "0px", paddingRight: "0px", color: "#10184099" }, "& .MuiPickersDay-root": { fontSize: "12px !important" }, "& .MuiDayCalendar-weekDayLabel": { fontSize: "12px !important" } },
|
|
2527
1908
|
onChange: (newValue) => setFecha(newValue)
|
|
2528
1909
|
}
|
|
2529
|
-
), /* @__PURE__ */
|
|
1910
|
+
), /* @__PURE__ */ import_react16.default.createElement(import_Grid24.default, { container: true, justifyContent: "center" }, /* @__PURE__ */ import_react16.default.createElement(import_material12.IconButton, { "data-testid": "close-calendar-button", onClick: toggleCalendar(false) }, /* @__PURE__ */ import_react16.default.createElement(import_KeyboardDoubleArrowUp.default, null))))));
|
|
2530
1911
|
};
|
|
2531
1912
|
|
|
2532
1913
|
// src/Components/SCDataGrid.tsx
|
|
2533
|
-
var
|
|
1914
|
+
var import_react17 = __toESM(require("react"), 1);
|
|
2534
1915
|
var import_x_data_grid_pro = require("@mui/x-data-grid-pro");
|
|
2535
1916
|
var import_x_license_pro2 = require("@mui/x-license-pro");
|
|
2536
1917
|
var import_KeyboardArrowDown = __toESM(require("@mui/icons-material/KeyboardArrowDown"), 1);
|
|
2537
1918
|
var import_KeyboardArrowUp = __toESM(require("@mui/icons-material/KeyboardArrowUp"), 1);
|
|
2538
1919
|
var import_styles = require("@mui/material/styles");
|
|
2539
|
-
|
|
1920
|
+
var SCDataGridInitial = ({ data, columns, groupColumns, rowsTable, checkboxSelection, width, maxHeight, density }) => {
|
|
2540
1921
|
import_x_license_pro2.LicenseInfo.setLicenseKey(
|
|
2541
1922
|
"77d49a57fbc5f4af35ddb05c5f1742e0Tz0xMTI3MjgsRT0xNzc4MzcxMTk5MDAwLFM9cHJvLExNPXN1YnNjcmlwdGlvbixQVj1RMy0yMDI0LEtWPTI="
|
|
2542
1923
|
);
|
|
@@ -2547,80 +1928,45 @@ function SCDataGridInitial({ data, columns, groupColumns, rowsTable, checkboxSel
|
|
|
2547
1928
|
return Math.floor(Math.random() * 1e6);
|
|
2548
1929
|
}
|
|
2549
1930
|
const getTreeDataPaths = (row) => {
|
|
2550
|
-
var _a, _b, _c;
|
|
2551
|
-
const group1Value = groupColumns && ((_a = groupColumns(row)) == null ? void 0 : _a.valueGroup1);
|
|
2552
|
-
const group2Value = groupColumns && ((_b = groupColumns(row)) == null ? void 0 : _b.valueGroup2);
|
|
2553
|
-
const fieldValue = groupColumns && ((_c = groupColumns(row)) == null ? void 0 : _c.fieldFirstColumn);
|
|
2554
1931
|
return [
|
|
2555
|
-
|
|
2556
|
-
...
|
|
2557
|
-
`${
|
|
1932
|
+
row[groupColumns[0].split("[")[1].split("]")[0].trim()],
|
|
1933
|
+
...groupColumns.length > 2 ? [row[groupColumns[1].split("[")[1].split("]")[0].trim()]] : [],
|
|
1934
|
+
`${row[groupColumns[groupColumns.length - 1].split("[")[1].split("]")[0].trim()].toString()}/${generateRandomId()}`
|
|
2558
1935
|
];
|
|
2559
1936
|
};
|
|
2560
1937
|
const groupingColDefs = {
|
|
2561
1938
|
field: "grouping",
|
|
2562
|
-
headerName: groupColumns ? groupColumns(
|
|
1939
|
+
headerName: groupColumns != void 0 ? groupColumns[groupColumns.length - 1].split("[").length == 2 ? groupColumns[groupColumns.length - 1].split("[")[0].trim() : "Agrupador" : "",
|
|
2563
1940
|
renderCell: (params) => {
|
|
2564
|
-
var _a
|
|
1941
|
+
var _a;
|
|
2565
1942
|
let label = params.value.toString().includes("/") ? params.value.split("/")[0].toString() : params.value.toString();
|
|
2566
|
-
|
|
2567
|
-
if (groupColumns
|
|
2568
|
-
const sampleItem = groupColumns(data[0]);
|
|
2569
|
-
if (sampleItem.valueGroup1) maxDepth++;
|
|
2570
|
-
if (sampleItem.valueGroup2) maxDepth++;
|
|
2571
|
-
maxDepth = Math.max(0, maxDepth - 1);
|
|
2572
|
-
}
|
|
2573
|
-
if (groupColumns) {
|
|
1943
|
+
const maxDepth = groupColumns ? groupColumns.length - 2 : 0;
|
|
1944
|
+
if (groupColumns != void 0) {
|
|
2574
1945
|
if (params.rowNode.depth === 0) {
|
|
2575
|
-
|
|
2576
|
-
|
|
2577
|
-
|
|
2578
|
-
|
|
2579
|
-
|
|
2580
|
-
|
|
2581
|
-
}
|
|
2582
|
-
);
|
|
2583
|
-
if (originalItem) {
|
|
2584
|
-
const itemValue = groupColumns(originalItem);
|
|
2585
|
-
customLabel = itemValue.textGroup1 || label;
|
|
2586
|
-
}
|
|
2587
|
-
}
|
|
2588
|
-
const subgroup1 = arrayRows.filter((r) => {
|
|
2589
|
-
var _a2;
|
|
2590
|
-
return groupColumns && String((_a2 = groupColumns(r)) == null ? void 0 : _a2.valueGroup1) === label;
|
|
2591
|
-
}).map((r) => {
|
|
2592
|
-
var _a2;
|
|
2593
|
-
return groupColumns && String((_a2 = groupColumns(r)) == null ? void 0 : _a2.valueGroup2);
|
|
2594
|
-
});
|
|
1946
|
+
const textBegin = groupColumns[0] ? groupColumns[0].split("[")[0].trim() : "";
|
|
1947
|
+
const textEnd = groupColumns[0] ? groupColumns[0].split("]")[1].trim() : "";
|
|
1948
|
+
const labelGrouping1 = `${textBegin} ${label} ${textEnd}`;
|
|
1949
|
+
const fieldGrouping1 = groupColumns[0].split("[")[1].split("]")[0].trim();
|
|
1950
|
+
const fieldGrouping2 = groupColumns[1].split("[")[1].split("]")[0].trim();
|
|
1951
|
+
const subgroup1 = arrayRows.filter((r) => r[fieldGrouping1].toString() === label).map((r) => r[fieldGrouping2]);
|
|
2595
1952
|
const groupedDataLength1 = subgroup1.filter((valor, indiceActual, arreglo) => arreglo.indexOf(valor) === indiceActual);
|
|
2596
|
-
label = `${
|
|
2597
|
-
} else if (
|
|
2598
|
-
const labelGrouping1 = (
|
|
2599
|
-
|
|
2600
|
-
|
|
2601
|
-
|
|
2602
|
-
|
|
2603
|
-
|
|
2604
|
-
return String((_a2 = groupColumns(item)) == null ? void 0 : _a2.valueGroup2) === label;
|
|
2605
|
-
}
|
|
2606
|
-
);
|
|
2607
|
-
if (originalItem) {
|
|
2608
|
-
const itemValue = groupColumns(originalItem);
|
|
2609
|
-
customLabel = itemValue.textGroup2 || label;
|
|
2610
|
-
}
|
|
2611
|
-
}
|
|
1953
|
+
label = `${labelGrouping1} (${groupedDataLength1.length})`;
|
|
1954
|
+
} else if (groupColumns.length > 2 && params.rowNode.depth === 1) {
|
|
1955
|
+
const labelGrouping1 = (_a = params.api.getRowNode(params.rowNode.parent)) == null ? void 0 : _a.groupingKey;
|
|
1956
|
+
const textBegin = groupColumns[1] ? groupColumns[1].split("[")[0] : "";
|
|
1957
|
+
const textEnd = groupColumns[1] ? groupColumns[1].split("]")[1].trim() : "";
|
|
1958
|
+
const labelGrouping2 = `${textBegin} ${label} ${textEnd}`;
|
|
1959
|
+
const fieldGrouping1 = groupColumns[0].split("[")[1].split("]")[0].trim();
|
|
1960
|
+
const fieldGrouping2 = groupColumns[1].split("[")[1].split("]")[0].trim();
|
|
2612
1961
|
const groupedDataLength2 = arrayRows.filter(
|
|
2613
|
-
(r) =>
|
|
2614
|
-
var _a2, _b2;
|
|
2615
|
-
return groupColumns && String((_a2 = groupColumns(r)) == null ? void 0 : _a2.valueGroup1) === labelGrouping1 && groupColumns && String((_b2 = groupColumns(r)) == null ? void 0 : _b2.valueGroup2) === label;
|
|
2616
|
-
}
|
|
1962
|
+
(r) => r[fieldGrouping1] === labelGrouping1 && r[fieldGrouping2] === label
|
|
2617
1963
|
).length;
|
|
2618
|
-
label = `${
|
|
1964
|
+
label = `${labelGrouping2} (${groupedDataLength2})`;
|
|
2619
1965
|
} else {
|
|
2620
1966
|
label = label;
|
|
2621
1967
|
}
|
|
2622
1968
|
}
|
|
2623
|
-
return /* @__PURE__ */
|
|
1969
|
+
return /* @__PURE__ */ import_react17.default.createElement(
|
|
2624
1970
|
"div",
|
|
2625
1971
|
{
|
|
2626
1972
|
style: {
|
|
@@ -2637,7 +1983,7 @@ function SCDataGridInitial({ data, columns, groupColumns, rowsTable, checkboxSel
|
|
|
2637
1983
|
fontWeight: params.rowNode.type == "group" ? "400" : "300"
|
|
2638
1984
|
}
|
|
2639
1985
|
},
|
|
2640
|
-
params.rowNode.type === "group" && /* @__PURE__ */
|
|
1986
|
+
params.rowNode.type === "group" && /* @__PURE__ */ import_react17.default.createElement(
|
|
2641
1987
|
"span",
|
|
2642
1988
|
{
|
|
2643
1989
|
style: {
|
|
@@ -2650,32 +1996,25 @@ function SCDataGridInitial({ data, columns, groupColumns, rowsTable, checkboxSel
|
|
|
2650
1996
|
params.api.setRowChildrenExpansion(params.id, !params.rowNode.childrenExpanded);
|
|
2651
1997
|
}
|
|
2652
1998
|
},
|
|
2653
|
-
params.rowNode.childrenExpanded ? /* @__PURE__ */
|
|
1999
|
+
params.rowNode.childrenExpanded ? /* @__PURE__ */ import_react17.default.createElement(import_KeyboardArrowUp.default, { fontSize: "small", color: "action" }) : /* @__PURE__ */ import_react17.default.createElement(import_KeyboardArrowDown.default, { fontSize: "small", color: "action" })
|
|
2654
2000
|
),
|
|
2655
2001
|
label
|
|
2656
2002
|
);
|
|
2657
2003
|
},
|
|
2658
2004
|
colSpan: (params) => {
|
|
2659
|
-
var _a, _b;
|
|
2660
2005
|
const value = String(params);
|
|
2661
|
-
const fieldGrouping1 = groupColumns
|
|
2662
|
-
const fieldGrouping2 = groupColumns
|
|
2006
|
+
const fieldGrouping1 = groupColumns[0].split("[")[1].split("]")[0].trim();
|
|
2007
|
+
const fieldGrouping2 = groupColumns.length > 2 ? groupColumns[1].split("[")[1].split("]")[0].trim() : void 0;
|
|
2663
2008
|
let agrupado1 = false;
|
|
2664
2009
|
let agrupado2 = false;
|
|
2665
2010
|
if (fieldGrouping1 != void 0) {
|
|
2666
2011
|
agrupado1 = arrayRows.some(
|
|
2667
|
-
(row) =>
|
|
2668
|
-
var _a2;
|
|
2669
|
-
return groupColumns && String((_a2 = groupColumns(row)) == null ? void 0 : _a2.valueGroup1) === value;
|
|
2670
|
-
}
|
|
2012
|
+
(row) => String(row[fieldGrouping1]) === value
|
|
2671
2013
|
);
|
|
2672
2014
|
}
|
|
2673
2015
|
if (fieldGrouping2 != void 0) {
|
|
2674
2016
|
agrupado2 = arrayRows.some(
|
|
2675
|
-
(row) =>
|
|
2676
|
-
var _a2;
|
|
2677
|
-
return groupColumns && String((_a2 = groupColumns(row)) == null ? void 0 : _a2.valueGroup2) === value;
|
|
2678
|
-
}
|
|
2017
|
+
(row) => String(row[fieldGrouping2]) === value
|
|
2679
2018
|
);
|
|
2680
2019
|
}
|
|
2681
2020
|
if (agrupado1 || agrupado2) {
|
|
@@ -2692,11 +2031,11 @@ function SCDataGridInitial({ data, columns, groupColumns, rowsTable, checkboxSel
|
|
|
2692
2031
|
let styleRowHeight = density == "compact" ? 32 : density == "standard" ? 28 : density == "comfortable" ? 36 : 32;
|
|
2693
2032
|
let rows = rowsTable ? rowsTable : validationTreeData != false ? parseInt(data.length.toString()) : data.length < 10 ? parseInt(data.length.toString()) : 10;
|
|
2694
2033
|
let validationGroupingColDef = groupingColDefs || {};
|
|
2695
|
-
const [groupDataLenght, setGroupDataLengh] = (0,
|
|
2696
|
-
const [pageSize, setPageSize] = (0,
|
|
2697
|
-
const [arrayRows, setArrayRows] = (0,
|
|
2698
|
-
const [selectionModel, setSelectionModel] = (0,
|
|
2699
|
-
(0,
|
|
2034
|
+
const [groupDataLenght, setGroupDataLengh] = (0, import_react17.useState)(0);
|
|
2035
|
+
const [pageSize, setPageSize] = (0, import_react17.useState)(rows);
|
|
2036
|
+
const [arrayRows, setArrayRows] = (0, import_react17.useState)([]);
|
|
2037
|
+
const [selectionModel, setSelectionModel] = (0, import_react17.useState)([]);
|
|
2038
|
+
(0, import_react17.useEffect)(() => {
|
|
2700
2039
|
if ((data == null ? void 0 : data.length) > 0) {
|
|
2701
2040
|
dataConvertRows(data, void 0);
|
|
2702
2041
|
}
|
|
@@ -2752,7 +2091,7 @@ function SCDataGridInitial({ data, columns, groupColumns, rowsTable, checkboxSel
|
|
|
2752
2091
|
setSelectionModel([...newSelection]);
|
|
2753
2092
|
}
|
|
2754
2093
|
};
|
|
2755
|
-
return /* @__PURE__ */
|
|
2094
|
+
return /* @__PURE__ */ import_react17.default.createElement(import_react17.default.Fragment, null, data && /* @__PURE__ */ import_react17.default.createElement(import_react17.default.Fragment, null, /* @__PURE__ */ import_react17.default.createElement("div", { style: { width: width || "100%", maxHeight: maxHeight ? `${maxHeight}px` : "none" } }, /* @__PURE__ */ import_react17.default.createElement(
|
|
2756
2095
|
import_x_data_grid_pro.DataGridPro,
|
|
2757
2096
|
{
|
|
2758
2097
|
apiRef,
|
|
@@ -2786,6 +2125,7 @@ function SCDataGridInitial({ data, columns, groupColumns, rowsTable, checkboxSel
|
|
|
2786
2125
|
},
|
|
2787
2126
|
sx: {
|
|
2788
2127
|
maxHeight: maxHeight ? `${maxHeight}px` : "none",
|
|
2128
|
+
//overflow: 'auto',
|
|
2789
2129
|
"& .MuiDataGrid-filler": {
|
|
2790
2130
|
display: "none !important"
|
|
2791
2131
|
},
|
|
@@ -2815,54 +2155,42 @@ function SCDataGridInitial({ data, columns, groupColumns, rowsTable, checkboxSel
|
|
|
2815
2155
|
}
|
|
2816
2156
|
}
|
|
2817
2157
|
))));
|
|
2818
|
-
}
|
|
2819
|
-
var SCDataGrid =
|
|
2820
|
-
const isEqual = prevProps.rowsTable === nextProps.rowsTable && prevProps.checkboxSelection === nextProps.checkboxSelection && prevProps.width === nextProps.width && prevProps.maxHeight === nextProps.maxHeight && prevProps.density === nextProps.density;
|
|
2158
|
+
};
|
|
2159
|
+
var SCDataGrid = import_react17.default.memo(SCDataGridInitial, (prevProps, nextProps) => {
|
|
2160
|
+
const isEqual = prevProps.data === nextProps.data && prevProps.columns === nextProps.columns && prevProps.groupColumns === nextProps.groupColumns && prevProps.rowsTable === nextProps.rowsTable && prevProps.checkboxSelection === nextProps.checkboxSelection && prevProps.width === nextProps.width && prevProps.maxHeight === nextProps.maxHeight && prevProps.density === nextProps.density;
|
|
2821
2161
|
return isEqual;
|
|
2822
2162
|
});
|
|
2823
2163
|
|
|
2824
2164
|
// src/Components/EmptyState/EmptyState.tsx
|
|
2825
|
-
var
|
|
2826
|
-
var
|
|
2165
|
+
var import_react18 = __toESM(require("react"), 1);
|
|
2166
|
+
var import_material13 = require("@mui/material");
|
|
2827
2167
|
|
|
2828
|
-
// src/assets/ImgEmptyState/create.
|
|
2829
|
-
var
|
|
2830
|
-
var Create = () => {
|
|
2831
|
-
return /* @__PURE__ */ import_react20.default.createElement("svg", { width: "45", height: "41", viewBox: "0 0 45 41", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, /* @__PURE__ */ import_react20.default.createElement("g", { "clip-path": "url(#clip0_1283_39624)" }, /* @__PURE__ */ import_react20.default.createElement("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M44.4956 13.1869C44.4386 13.8714 43.8367 14.3801 43.1514 14.3231L39.9978 14.0608C39.3124 14.0038 38.8032 13.4027 38.8602 12.7182C38.9173 12.0336 39.5191 11.525 40.2044 11.582L43.3581 11.8443C44.0434 11.9013 44.5527 12.5024 44.4956 13.1869Z", fill: "#CED1D4" }), /* @__PURE__ */ import_react20.default.createElement("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M41.0393 1.01388C41.4429 1.57002 41.3187 2.34766 40.7619 2.75078L38.099 4.6787C37.5423 5.08182 36.7637 4.95777 36.3601 4.40163C35.9565 3.84548 36.0807 3.06785 36.6375 2.66473L39.3004 0.736804C39.8572 0.333685 40.6357 0.457736 41.0393 1.01388Z", fill: "#CED1D4" }), /* @__PURE__ */ import_react20.default.createElement("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M36.6656 21.2361C36.1755 21.7179 36.1692 22.5054 36.6515 22.9949L38.9584 25.3363C39.4408 25.8258 40.2291 25.8321 40.7193 25.3503C41.2094 24.8685 41.2157 24.0811 40.7333 23.5915L38.4264 21.2502C37.9441 20.7606 37.1557 20.7543 36.6656 21.2361Z", fill: "#CED1D4" }), /* @__PURE__ */ import_react20.default.createElement("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M0.504365 13.1869C0.561439 13.8714 1.16326 14.3801 1.84856 14.323L5.00224 14.0607C5.68755 14.0037 6.19683 13.4026 6.13976 12.7181C6.08268 12.0336 5.48087 11.5249 4.79556 11.5819L1.64188 11.8442C0.956574 11.9012 0.447291 12.5023 0.504365 13.1869Z", fill: "#CED1D4" }), /* @__PURE__ */ import_react20.default.createElement("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M3.95913 1.01431C3.55554 1.57046 3.67974 2.34809 4.23653 2.75121L6.8994 4.67914C7.45619 5.08225 8.23473 4.9582 8.63832 4.40206C9.04191 3.84592 8.91771 3.06828 8.36092 2.66516L5.69805 0.737237C5.14126 0.334118 4.36272 0.458169 3.95913 1.01431Z", fill: "#CED1D4" }), /* @__PURE__ */ import_react20.default.createElement("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M8.33389 21.236C8.82403 21.7178 8.83033 22.5053 8.34796 22.9949L6.04107 25.3362C5.5587 25.8257 4.77034 25.832 4.28021 25.3502C3.79008 24.8684 3.78378 24.081 4.26614 23.5914L6.57304 21.2501C7.0554 20.7605 7.84376 20.7542 8.33389 21.236Z", fill: "#CED1D4" }), /* @__PURE__ */ import_react20.default.createElement("path", { d: "M19.1448 37.3573H25.5804L25.1621 38.889C25.0636 39.2498 24.7356 39.5 24.3613 39.5H20.3638C19.9895 39.5 19.6615 39.2498 19.563 38.889L19.1448 37.3573Z", fill: "#CED1D4" }), /* @__PURE__ */ import_react20.default.createElement("path", { d: "M17.6534 35.3665C17.5381 34.8487 17.9326 34.3575 18.4637 34.3575H26.3983C26.9294 34.3575 27.3239 34.8487 27.2087 35.3665L26.9829 36.3814C26.8563 36.9504 26.351 37.3553 25.7674 37.3553H19.0946C18.511 37.3553 18.0057 36.9504 17.8791 36.3814L17.6534 35.3665Z", fill: "#CED1D4" }), /* @__PURE__ */ import_react20.default.createElement("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M8.85423 13.9906C8.85423 6.60807 14.935 0.652473 22.3998 0.652473C29.8646 0.652473 35.9455 6.60807 35.9455 13.9906C35.9455 17.6153 34.4759 20.9015 32.0983 23.3022C31.9627 23.4392 31.8257 23.5745 31.6935 23.7052L31.6917 23.707C30.7961 24.5922 30.1385 25.2699 29.8494 26.1116C29.7242 26.4761 29.6012 27.1915 29.4988 28.0885C29.4002 28.9527 29.3306 29.8872 29.2854 30.6281C29.2099 31.864 28.1896 32.8547 26.9266 32.8547H17.8731C16.6101 32.8547 15.5898 31.864 15.5143 30.6281C15.469 29.8872 15.3995 28.9527 15.3009 28.0885C15.1985 27.1915 15.0755 26.4761 14.9503 26.1116C14.6612 25.2699 14.0036 24.5922 13.108 23.707L13.106 23.7051C12.9739 23.5744 12.837 23.4391 12.7014 23.3022C10.3238 20.9015 8.85423 17.6153 8.85423 13.9906ZM22.3998 2.85676C16.1214 2.85676 11.0611 7.85765 11.0611 13.9906C11.0611 17.0068 12.2813 19.7437 14.2703 21.752C14.3969 21.8798 14.526 22.0075 14.6602 22.1401C14.6831 22.1627 14.7062 22.1855 14.7294 22.2085C15.5402 23.0091 16.5655 24.0215 17.0377 25.3961C17.2505 26.0156 17.3925 26.9534 17.4936 27.8388C17.5983 28.757 17.6707 29.7342 17.7171 30.4939C17.723 30.59 17.8001 30.6504 17.8731 30.6504H26.9266C26.9996 30.6504 27.0767 30.59 27.0826 30.4939C27.129 29.7342 27.2013 28.757 27.3061 27.8388C27.4072 26.9534 27.5492 26.0156 27.762 25.3961C28.2342 24.0215 29.2594 23.0091 30.0702 22.2085C30.0935 22.1855 30.1166 22.1627 30.1395 22.1401C30.2737 22.0075 30.4028 21.8798 30.5294 21.752C32.5184 19.7437 33.7386 17.0068 33.7386 13.9906C33.7386 7.85765 28.6783 2.85676 22.3998 2.85676Z", fill: "#B9BDC1" })), /* @__PURE__ */ import_react20.default.createElement("defs", null, /* @__PURE__ */ import_react20.default.createElement("clipPath", { id: "clip0_1283_39624" }, /* @__PURE__ */ import_react20.default.createElement("rect", { width: "44", height: "40", fill: "white", transform: "translate(0.5 0.5)" }))));
|
|
2832
|
-
};
|
|
2168
|
+
// src/assets/ImgEmptyState/create.svg
|
|
2169
|
+
var create_default = "./create-KZGO2OZA.svg";
|
|
2833
2170
|
|
|
2834
|
-
// src/assets/ImgEmptyState/
|
|
2835
|
-
var
|
|
2836
|
-
var Empty = () => {
|
|
2837
|
-
return /* @__PURE__ */ import_react21.default.createElement("svg", { width: "41", height: "41", viewBox: "0 0 41 41", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, /* @__PURE__ */ import_react21.default.createElement("g", { "clip-path": "url(#clip0_1283_39626)" }, /* @__PURE__ */ import_react21.default.createElement("path", { d: "M36.1351 20.9955C25.1396 25.3151 16.1875 30.5689 11.8186 30.9221L14.7134 35.4696L36.1351 20.9955Z", fill: "#CED1D4" }), /* @__PURE__ */ import_react21.default.createElement("path", { d: "M37.4531 24.9937C39.7468 28.137 42.9751 35.0522 37.4531 35.3441C34.9101 35.4058 31.3306 32.981 37.4531 24.9937Z", fill: "#CED1D4" }), /* @__PURE__ */ import_react21.default.createElement("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M25.6074 1.30001C25.1055 0.501016 24.051 0.26003 23.2522 0.761943L19.6474 3.02673C17.5114 2.68138 14.5326 2.642 12.1799 3.71891C10.8937 4.30766 9.75284 5.25155 9.09396 6.68863C8.65845 7.63849 8.46029 8.74589 8.52317 10.0159L1.2996 14.5543C0.500747 15.0562 0.260156 16.1108 0.762045 16.9098L12.7907 36.0589C13.2926 36.8579 14.3471 37.0989 15.1459 36.597L37.0985 22.8046C37.8973 22.3027 38.1379 21.2481 37.636 20.4491L25.6074 1.30001ZM2.79326 16.1347L8.88857 12.3051C8.91842 12.3953 8.95405 12.4868 8.99634 12.5777C9.70948 14.1097 11.2554 15.9861 13.7088 16.7327C16.2084 17.4934 19.3887 17.0049 23.1824 14.2981L23.3709 14.1636L22.1324 12.4273L21.9439 12.5618C18.5121 15.0104 16.0132 15.2048 14.3292 14.6924C12.5992 14.1659 11.458 12.8132 10.9295 11.6778C10.9197 11.6569 10.9072 11.6225 10.8968 11.5772C10.8595 11.4156 10.8267 11.2584 10.7981 11.1054L24.0275 2.79363L35.6048 21.2243L14.3706 34.5653L2.79326 16.1347ZM13.0675 5.65821C14.0932 5.18871 15.3429 4.98089 16.5902 4.94754L10.716 8.63821C10.7826 8.23367 10.8925 7.88269 11.0323 7.57786C11.4327 6.70447 12.1364 6.08441 13.0675 5.65821Z", fill: "#B9BDC1" }), /* @__PURE__ */ import_react21.default.createElement("path", { d: "M24.3482 14.3207C24.0493 15.6305 22.7454 16.4497 21.4358 16.1505C20.1262 15.8513 19.3069 14.547 19.6058 13.2372C19.9047 11.9274 21.2086 11.1082 22.5182 11.4074C23.8278 11.7066 24.6471 13.011 24.3482 14.3207Z", fill: "#CED1D4" })), /* @__PURE__ */ import_react21.default.createElement("defs", null, /* @__PURE__ */ import_react21.default.createElement("clipPath", { id: "clip0_1283_39626" }, /* @__PURE__ */ import_react21.default.createElement("rect", { width: "40", height: "40", fill: "white", transform: "translate(0.5 0.5)" }))));
|
|
2838
|
-
};
|
|
2171
|
+
// src/assets/ImgEmptyState/error.svg
|
|
2172
|
+
var error_default = "./error-RUCZUXDN.svg";
|
|
2839
2173
|
|
|
2840
|
-
// src/assets/ImgEmptyState/
|
|
2841
|
-
var
|
|
2842
|
-
var Error2 = () => {
|
|
2843
|
-
return /* @__PURE__ */ import_react22.default.createElement("svg", { width: "41", height: "41", viewBox: "0 0 41 41", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, /* @__PURE__ */ import_react22.default.createElement("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M17.8035 3.2925C17.0304 3.2925 16.358 3.82772 16.1913 4.58349L14.0944 13.8188C13.8625 14.8535 14.6474 15.8412 15.7066 15.8412H25.4175C26.4764 15.8412 27.2677 14.8538 27.0297 13.8185L24.9328 4.58323C24.7608 3.82996 24.0975 3.29514 23.3264 3.2925H17.8035ZM15.9436 13.9945L17.9555 5.13336L23.1745 5.12121L25.1863 13.9945H15.9436Z", fill: "#B9BDC1" }), /* @__PURE__ */ import_react22.default.createElement("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M11.5449 28.1551C10.7717 28.1551 10.0993 28.6904 9.93264 29.4462L8.54048 35.6049C8.46109 35.7863 8.54048 35.6049 8.46109 35.7863H5.42145C4.91308 35.7863 4.50096 36.1984 4.50096 36.7068C4.50096 37.2152 4.91308 37.6273 5.42145 37.6273H35.5795C36.0879 37.6273 36.5 37.2152 36.5 36.7068C36.5 36.1984 36.0879 35.7863 35.5795 35.7863H32.595C32.5443 35.6284 32.5801 35.745 32.5443 35.5928L31.1121 29.4342C30.9394 28.6844 30.2672 28.1551 29.5 28.1551H11.5449ZM10.3781 35.7863L11.6854 29.9961H29.3426L30.6891 35.7863H10.3781Z", fill: "#B9BDC1" }), /* @__PURE__ */ import_react22.default.createElement("path", { d: "M13.7368 17.4381H28.0252C28.2486 17.4381 28.4434 17.5928 28.495 17.8162L30.271 25.9114C30.334 26.2094 30.1106 26.4901 29.8012 26.4901H11.6743C11.3649 26.4901 11.1358 26.1979 11.2102 25.8943L13.2727 17.799C13.3243 17.587 13.519 17.4381 13.7368 17.4381Z", fill: "#CED1D4" }));
|
|
2844
|
-
};
|
|
2174
|
+
// src/assets/ImgEmptyState/empty.svg
|
|
2175
|
+
var empty_default = "./empty-3NEKE7WO.svg";
|
|
2845
2176
|
|
|
2846
|
-
// src/assets/ImgEmptyState/search.
|
|
2847
|
-
var
|
|
2848
|
-
var Search2 = () => {
|
|
2849
|
-
return /* @__PURE__ */ import_react23.default.createElement("svg", { width: "41", height: "41", viewBox: "0 0 41 41", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, /* @__PURE__ */ import_react23.default.createElement("g", { "clip-path": "url(#clip0_1283_39628)" }, /* @__PURE__ */ import_react23.default.createElement("path", { d: "M29.421 4.71198C28.943 2.92749 30.0021 1.09315 31.7865 0.61487C33.5709 0.136592 35.405 1.19549 35.883 2.97998L40.3853 19.7878C40.8633 21.5723 39.8042 23.4066 38.0198 23.8849C36.2354 24.3632 34.4013 23.3043 33.9233 21.5198L29.421 4.71198Z", fill: "#CED1D4" }), /* @__PURE__ */ import_react23.default.createElement("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M0.607749 18.613C0.158895 16.9369 1.15336 15.2141 2.82895 14.7649C4.50454 14.3157 6.22674 15.3102 6.67559 16.9862L8.06043 22.1573C8.50928 23.8333 7.51482 25.5561 5.83923 26.0054C4.16364 26.4546 2.44144 25.46 1.99259 23.784L0.607749 18.613ZM3.41576 16.9561C2.95002 17.0809 2.67359 17.5598 2.79836 18.0257L4.18319 23.1967C4.30796 23.6626 4.78667 23.939 5.25242 23.8142C5.71816 23.6893 5.99459 23.2104 5.86982 22.7445L4.48499 17.5735C4.36022 17.1076 3.88151 16.8312 3.41576 16.9561Z", fill: "#B9BDC1" }), /* @__PURE__ */ import_react23.default.createElement("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M18.0672 23.7222C17.6115 24.3518 16.9814 24.8602 16.2239 25.1659L23.5692 38.9314C23.929 39.6056 23.6742 40.4438 23.0003 40.8037C22.3263 41.1635 21.4883 40.9087 21.1286 40.2346L14.2002 27.2506L6.15159 39.7788C5.73857 40.4217 4.88273 40.6079 4.24003 40.1948C3.59732 39.7816 3.41113 38.9255 3.82416 38.2826L12.4422 24.8681C11.8201 24.4937 11.2926 23.9601 10.9267 23.3057L6.9728 23.4848C6.43282 23.5092 5.94855 23.1546 5.80865 22.6324L4.48764 17.7008C4.34775 17.1786 4.5899 16.6293 5.06976 16.3804L11.2775 13.1606L11.2169 12.934C11.0764 12.4095 11.3213 11.8581 11.8046 11.6107L26.5904 4.04383C26.8999 3.88542 27.2644 3.87542 27.5822 4.01662C27.8999 4.15781 28.1369 4.43508 28.2269 4.77102L32.7303 21.5831C32.8203 21.9191 32.7537 22.2777 32.5491 22.5589C32.3445 22.8401 32.0238 23.0137 31.6766 23.0314L18.0672 23.7222ZM17.9643 23.1894C18.1495 22.8739 18.2903 22.5322 18.3806 22.1748C18.4139 22.0434 18.4403 21.9098 18.4596 21.7746C18.4048 22.1588 18.2927 22.5298 18.1297 22.876C18.0793 22.983 18.0241 23.0876 17.9643 23.1894ZM18.8739 21.375L30.1375 20.8032L26.3713 6.7432L13.6819 13.2372L14.6854 16.9834C16.5391 17.0063 18.2272 18.2517 18.7306 20.1311C18.8421 20.5473 18.8877 20.9656 18.8739 21.375ZM12.4612 17.5793C11.2373 18.3061 10.4581 19.6082 10.3898 21.0243L7.79324 21.142L6.95134 17.999L11.8877 15.4386L12.4612 17.5793ZM15.1332 23.1064C16.1692 22.8287 16.784 21.7635 16.5064 20.7272C16.2288 19.6909 15.164 19.0759 14.128 19.3536C13.092 19.6313 12.4772 20.6965 12.7547 21.7328C12.9527 22.4718 13.5511 22.9972 14.2553 23.1365C14.2923 23.1351 14.3294 23.1351 14.3667 23.1366C14.4569 23.1402 14.5456 23.1526 14.6318 23.1732C14.797 23.173 14.9652 23.1515 15.1332 23.1064Z", fill: "#B9BDC1" })), /* @__PURE__ */ import_react23.default.createElement("defs", null, /* @__PURE__ */ import_react23.default.createElement("clipPath", { id: "clip0_1283_39628" }, /* @__PURE__ */ import_react23.default.createElement("rect", { width: "40", height: "40", fill: "white", transform: "translate(0.5 0.5)" }))));
|
|
2850
|
-
};
|
|
2177
|
+
// src/assets/ImgEmptyState/search.svg
|
|
2178
|
+
var search_default = "./search-OKSCVF2W.svg";
|
|
2851
2179
|
|
|
2852
2180
|
// src/Components/EmptyState/EmptyState.tsx
|
|
2853
2181
|
var EmptyStateImageUrls = {
|
|
2854
|
-
create:
|
|
2855
|
-
error:
|
|
2856
|
-
noResult:
|
|
2857
|
-
search:
|
|
2182
|
+
create: create_default,
|
|
2183
|
+
error: error_default,
|
|
2184
|
+
noResult: empty_default,
|
|
2185
|
+
search: search_default
|
|
2858
2186
|
};
|
|
2859
2187
|
var DefaultIcon = ({
|
|
2860
2188
|
state = "create",
|
|
2861
2189
|
size = "large"
|
|
2862
2190
|
}) => {
|
|
2863
|
-
const
|
|
2191
|
+
const imageUrl = EmptyStateImageUrls[state];
|
|
2864
2192
|
const iconSize = size === "small" ? { width: "40px", height: "40px" } : { width: "60px", height: "60px" };
|
|
2865
|
-
return /* @__PURE__ */
|
|
2193
|
+
return /* @__PURE__ */ import_react18.default.createElement("img", { src: imageUrl, alt: state, style: iconSize });
|
|
2866
2194
|
};
|
|
2867
2195
|
var EmptyState = ({
|
|
2868
2196
|
state = "create",
|
|
@@ -2871,12 +2199,12 @@ var EmptyState = ({
|
|
|
2871
2199
|
subtitle,
|
|
2872
2200
|
actions,
|
|
2873
2201
|
containerHeight = "100vh",
|
|
2874
|
-
icon = /* @__PURE__ */
|
|
2202
|
+
icon = /* @__PURE__ */ import_react18.default.createElement(DefaultIcon, { state, size })
|
|
2875
2203
|
}) => {
|
|
2876
2204
|
const titleVariant = size === "small" ? "subtitle2" : "h6";
|
|
2877
2205
|
const subtitleVariant = size === "small" ? "caption" : "body1";
|
|
2878
|
-
return /* @__PURE__ */
|
|
2879
|
-
|
|
2206
|
+
return /* @__PURE__ */ import_react18.default.createElement(
|
|
2207
|
+
import_material13.Stack,
|
|
2880
2208
|
{
|
|
2881
2209
|
alignItems: "center",
|
|
2882
2210
|
justifyContent: "center",
|
|
@@ -2884,17 +2212,17 @@ var EmptyState = ({
|
|
|
2884
2212
|
height: containerHeight,
|
|
2885
2213
|
"data-testid": "empty-state-container"
|
|
2886
2214
|
},
|
|
2887
|
-
icon && /* @__PURE__ */
|
|
2888
|
-
/* @__PURE__ */
|
|
2889
|
-
|
|
2215
|
+
icon && /* @__PURE__ */ import_react18.default.createElement(import_material13.Stack, null, icon),
|
|
2216
|
+
/* @__PURE__ */ import_react18.default.createElement(import_material13.Stack, { gap: 0.5 }, /* @__PURE__ */ import_react18.default.createElement(import_material13.Typography, { color: "text.primary", variant: titleVariant, textAlign: "center" }, title), subtitle && /* @__PURE__ */ import_react18.default.createElement(
|
|
2217
|
+
import_material13.Typography,
|
|
2890
2218
|
{
|
|
2891
2219
|
variant: subtitleVariant,
|
|
2892
2220
|
textAlign: "center",
|
|
2893
2221
|
color: "text.secondary"
|
|
2894
2222
|
},
|
|
2895
2223
|
subtitle
|
|
2896
|
-
), actions && (actions == null ? void 0 : actions.length) > 0 && /* @__PURE__ */
|
|
2897
|
-
|
|
2224
|
+
), actions && (actions == null ? void 0 : actions.length) > 0 && /* @__PURE__ */ import_react18.default.createElement(
|
|
2225
|
+
import_material13.Stack,
|
|
2898
2226
|
{
|
|
2899
2227
|
direction: "row",
|
|
2900
2228
|
spacing: 2,
|
|
@@ -2903,15 +2231,15 @@ var EmptyState = ({
|
|
|
2903
2231
|
},
|
|
2904
2232
|
actions.map((action, index) => {
|
|
2905
2233
|
var _a, _b, _c, _d;
|
|
2906
|
-
return /* @__PURE__ */
|
|
2907
|
-
|
|
2234
|
+
return /* @__PURE__ */ import_react18.default.createElement(
|
|
2235
|
+
import_material13.Button,
|
|
2908
2236
|
{
|
|
2909
2237
|
key: index,
|
|
2910
2238
|
color: (_a = action.color) != null ? _a : "primary",
|
|
2911
2239
|
variant: (_b = action.variant) != null ? _b : "text",
|
|
2912
2240
|
size: (_c = action.size) != null ? _c : "small",
|
|
2913
|
-
startIcon: action.icon && action.iconPosition === "left" ? /* @__PURE__ */
|
|
2914
|
-
endIcon: action.icon && action.iconPosition === "right" ? /* @__PURE__ */
|
|
2241
|
+
startIcon: action.icon && action.iconPosition === "left" ? /* @__PURE__ */ import_react18.default.createElement("img", { src: action.icon, alt: "icon" }) : void 0,
|
|
2242
|
+
endIcon: action.icon && action.iconPosition === "right" ? /* @__PURE__ */ import_react18.default.createElement("img", { src: action.icon, alt: "icon" }) : void 0,
|
|
2915
2243
|
onClick: action.onClick
|
|
2916
2244
|
},
|
|
2917
2245
|
capitalize((_d = action.text) != null ? _d : "action")
|
|
@@ -2922,8 +2250,8 @@ var EmptyState = ({
|
|
|
2922
2250
|
};
|
|
2923
2251
|
|
|
2924
2252
|
// src/Components/SCDialog.tsx
|
|
2925
|
-
var
|
|
2926
|
-
var
|
|
2253
|
+
var import_react19 = __toESM(require("react"), 1);
|
|
2254
|
+
var import_material14 = require("@mui/material");
|
|
2927
2255
|
var import_Grid25 = __toESM(require("@mui/material/Grid2"), 1);
|
|
2928
2256
|
var import_Close2 = __toESM(require("@mui/icons-material/Close"), 1);
|
|
2929
2257
|
var Muicon5 = __toESM(require("@mui/icons-material"), 1);
|
|
@@ -2932,8 +2260,8 @@ var SCDialog = ({ title, iconTitle, subtitle, content, actions, buttonDialog, di
|
|
|
2932
2260
|
let iconTitleValidation = "";
|
|
2933
2261
|
let IconTitle;
|
|
2934
2262
|
let ButtonIcon;
|
|
2935
|
-
const [open, setOpen] = (0,
|
|
2936
|
-
(0,
|
|
2263
|
+
const [open, setOpen] = (0, import_react19.useState)(show);
|
|
2264
|
+
(0, import_react19.useEffect)(() => {
|
|
2937
2265
|
if (show) {
|
|
2938
2266
|
handleOpen();
|
|
2939
2267
|
} else {
|
|
@@ -2958,7 +2286,7 @@ var SCDialog = ({ title, iconTitle, subtitle, content, actions, buttonDialog, di
|
|
|
2958
2286
|
});
|
|
2959
2287
|
if (iconTitle) {
|
|
2960
2288
|
if (Muicon5[iconTitle] == void 0) {
|
|
2961
|
-
if (iconTitle &&
|
|
2289
|
+
if (iconTitle && import_react19.default.isValidElement(iconTitle) && iconTitle.type == void 0) {
|
|
2962
2290
|
iconTitleValidation = "image";
|
|
2963
2291
|
IconTitle = iconTitle;
|
|
2964
2292
|
} else {
|
|
@@ -2983,9 +2311,9 @@ var SCDialog = ({ title, iconTitle, subtitle, content, actions, buttonDialog, di
|
|
|
2983
2311
|
}
|
|
2984
2312
|
};
|
|
2985
2313
|
const dialogActions = actions != null ? actions : [{ text: "Cerrar", fn: handleClose }];
|
|
2986
|
-
content = content != null ? content : { component: /* @__PURE__ */
|
|
2987
|
-
return /* @__PURE__ */
|
|
2988
|
-
|
|
2314
|
+
content = content != null ? content : { component: /* @__PURE__ */ import_react19.default.createElement(import_material14.Box, null, " Aqui va el contenido ") };
|
|
2315
|
+
return /* @__PURE__ */ import_react19.default.createElement("div", null, buttonDialog ? /* @__PURE__ */ import_react19.default.createElement(import_react19.default.Fragment, null, buttonDialog.text != void 0 ? /* @__PURE__ */ import_react19.default.createElement(import_material14.Tooltip, { placement: "bottom-start", title: buttonDialog.tooltip != void 0 ? buttonDialog.tooltip : "", slotProps: { popper: { modifiers: [{ name: "offset", options: { offset: [0, -14] } }] } } }, /* @__PURE__ */ import_react19.default.createElement(import_material14.Button, { size: "small", color: buttonDialog.color != void 0 ? buttonDialog.color : "primary", variant: (buttonDialog == null ? void 0 : buttonDialog.variant) != void 0 ? buttonDialog == null ? void 0 : buttonDialog.variant : "text", startIcon: (buttonDialog == null ? void 0 : buttonDialog.iconPosition) != void 0 ? (buttonDialog == null ? void 0 : buttonDialog.iconPosition) == "left" ? /* @__PURE__ */ import_react19.default.createElement(ButtonIcon, { color: buttonDialog.color != void 0 ? buttonDialog.color : "primary" }) : "" : "", endIcon: (buttonDialog == null ? void 0 : buttonDialog.iconPosition) != void 0 ? (buttonDialog == null ? void 0 : buttonDialog.iconPosition) == "right" ? /* @__PURE__ */ import_react19.default.createElement(ButtonIcon, { color: buttonDialog.color != void 0 ? buttonDialog.color : "primary" }) : "" : "", onClick: handleOpen }, " ", (buttonDialog == null ? void 0 : buttonDialog.text) != void 0 ? buttonDialog.text : "", " ")) : /* @__PURE__ */ import_react19.default.createElement(import_material14.IconButton, { style: { cursor: "pointer" }, onClick: handleOpen }, /* @__PURE__ */ import_react19.default.createElement(import_material14.SvgIcon, { fontSize: "small", color: (buttonDialog == null ? void 0 : buttonDialog.color) != void 0 ? buttonDialog == null ? void 0 : buttonDialog.color : "action", component: ButtonIcon }))) : "", /* @__PURE__ */ import_react19.default.createElement(import_material14.Modal, { open: open || false, onClose: handleClose }, /* @__PURE__ */ import_react19.default.createElement(
|
|
2316
|
+
import_material14.Dialog,
|
|
2989
2317
|
{
|
|
2990
2318
|
"data-testid": "dialog-element",
|
|
2991
2319
|
open: open || false,
|
|
@@ -2998,9 +2326,9 @@ var SCDialog = ({ title, iconTitle, subtitle, content, actions, buttonDialog, di
|
|
|
2998
2326
|
}
|
|
2999
2327
|
}
|
|
3000
2328
|
},
|
|
3001
|
-
title && /* @__PURE__ */
|
|
3002
|
-
/* @__PURE__ */
|
|
3003
|
-
|
|
2329
|
+
title && /* @__PURE__ */ import_react19.default.createElement(import_material14.DialogTitle, { sx: { m: 0, padding: "8px 16px 8px 16px" }, "data-testid": "dialog-icon-title" }, /* @__PURE__ */ import_react19.default.createElement(import_Grid25.default, { container: true, size: 12, sx: { justifyContent: "space-between", flexWrap: "nowrap" } }, /* @__PURE__ */ import_react19.default.createElement(import_Grid25.default, { container: true, size: 11, sx: { alignItems: "center" } }, iconTitle ? iconTitleValidation == "image" ? /* @__PURE__ */ import_react19.default.createElement(import_material14.Box, { sx: { marginRight: "16px", width: "44px", height: "44px", borderRadius: "1px" } }, /* @__PURE__ */ import_react19.default.createElement("img", { src: IconTitle, width: "44px", height: "44px" })) : /* @__PURE__ */ import_react19.default.createElement(import_material14.SvgIcon, { color: "action", fontSize: "small", component: IconTitle, sx: { marginRight: "16px" } }) : "", /* @__PURE__ */ import_react19.default.createElement(import_Grid25.default, null, /* @__PURE__ */ import_react19.default.createElement(import_material14.Typography, { color: "text.primary", variant: "h6", gutterBottom: true }, title ? title : ""), /* @__PURE__ */ import_react19.default.createElement(import_material14.Typography, { color: "text.secondary", variant: "body2", gutterBottom: true }, subtitle ? subtitle : ""))), disableClose != true ? /* @__PURE__ */ import_react19.default.createElement(import_material14.IconButton, { "data-testid": "close-dialog-button", onClick: handleClose, size: "small", color: "default", sx: { height: 22, width: 22 } }, /* @__PURE__ */ import_react19.default.createElement(import_Close2.default, null)) : "")),
|
|
2330
|
+
/* @__PURE__ */ import_react19.default.createElement(
|
|
2331
|
+
import_material14.DialogContent,
|
|
3004
2332
|
{
|
|
3005
2333
|
"data-testid": "dialog-content",
|
|
3006
2334
|
dividers: dividers ? dividers : false,
|
|
@@ -3027,7 +2355,7 @@ var SCDialog = ({ title, iconTitle, subtitle, content, actions, buttonDialog, di
|
|
|
3027
2355
|
}
|
|
3028
2356
|
}
|
|
3029
2357
|
},
|
|
3030
|
-
content.url ? /* @__PURE__ */
|
|
2358
|
+
content.url ? /* @__PURE__ */ import_react19.default.createElement(
|
|
3031
2359
|
"iframe",
|
|
3032
2360
|
{
|
|
3033
2361
|
style: { border: "none", minWidth: "100%", minHeight: "100%" },
|
|
@@ -3037,20 +2365,20 @@ var SCDialog = ({ title, iconTitle, subtitle, content, actions, buttonDialog, di
|
|
|
3037
2365
|
}
|
|
3038
2366
|
) : content.component
|
|
3039
2367
|
),
|
|
3040
|
-
dialogActions.length > 0 ? /* @__PURE__ */
|
|
3041
|
-
|
|
2368
|
+
dialogActions.length > 0 ? /* @__PURE__ */ import_react19.default.createElement(import_material14.DialogActions, { sx: { gap: 1, m: 0, padding: "12px 16px 12px 16px", justifyContent: dialogActions.length >= 3 ? "space-between" : "flex-end" } }, dialogActions.length >= 3 ? /* @__PURE__ */ import_react19.default.createElement(import_react19.default.Fragment, null, /* @__PURE__ */ import_react19.default.createElement(
|
|
2369
|
+
import_material14.Button,
|
|
3042
2370
|
{
|
|
3043
2371
|
variant: "text",
|
|
3044
2372
|
color: dialogActions[0].color || "primary",
|
|
3045
2373
|
size: "small",
|
|
3046
2374
|
onClick: dialogActions[0].fn,
|
|
3047
2375
|
disabled: dialogActions[0].disabled || false,
|
|
3048
|
-
startIcon: dialogActions[0].icon ? /* @__PURE__ */
|
|
2376
|
+
startIcon: dialogActions[0].icon ? /* @__PURE__ */ import_react19.default.createElement(import_material14.SvgIcon, { fontSize: "small", component: dialogActions[0].icon }) : void 0
|
|
3049
2377
|
},
|
|
3050
2378
|
dialogActions[0].text
|
|
3051
|
-
), /* @__PURE__ */
|
|
3052
|
-
return /* @__PURE__ */
|
|
3053
|
-
|
|
2379
|
+
), /* @__PURE__ */ import_react19.default.createElement(import_material14.Box, { sx: { display: "flex", gap: 1 } }, dialogActions.slice(1).map((boton, index) => {
|
|
2380
|
+
return /* @__PURE__ */ import_react19.default.createElement(
|
|
2381
|
+
import_material14.Button,
|
|
3054
2382
|
{
|
|
3055
2383
|
key: index + 1,
|
|
3056
2384
|
variant: index === dialogActions.length - 2 ? "contained" : "text",
|
|
@@ -3058,13 +2386,13 @@ var SCDialog = ({ title, iconTitle, subtitle, content, actions, buttonDialog, di
|
|
|
3058
2386
|
size: "small",
|
|
3059
2387
|
onClick: boton.fn,
|
|
3060
2388
|
disabled: boton.disabled || false,
|
|
3061
|
-
startIcon: boton.icon ? /* @__PURE__ */
|
|
2389
|
+
startIcon: boton.icon ? /* @__PURE__ */ import_react19.default.createElement(import_material14.SvgIcon, { fontSize: "small", component: boton.icon }) : void 0
|
|
3062
2390
|
},
|
|
3063
2391
|
boton.text
|
|
3064
2392
|
);
|
|
3065
2393
|
}))) : dialogActions.map((boton, index) => {
|
|
3066
|
-
return /* @__PURE__ */
|
|
3067
|
-
|
|
2394
|
+
return /* @__PURE__ */ import_react19.default.createElement(
|
|
2395
|
+
import_material14.Button,
|
|
3068
2396
|
{
|
|
3069
2397
|
key: index,
|
|
3070
2398
|
variant: index === dialogActions.length - 1 ? "contained" : "text",
|
|
@@ -3072,7 +2400,7 @@ var SCDialog = ({ title, iconTitle, subtitle, content, actions, buttonDialog, di
|
|
|
3072
2400
|
size: "small",
|
|
3073
2401
|
onClick: boton.fn,
|
|
3074
2402
|
disabled: boton.disabled || false,
|
|
3075
|
-
startIcon: boton.icon ? /* @__PURE__ */
|
|
2403
|
+
startIcon: boton.icon ? /* @__PURE__ */ import_react19.default.createElement(import_material14.SvgIcon, { fontSize: "small", component: boton.icon }) : void 0
|
|
3076
2404
|
},
|
|
3077
2405
|
boton.text
|
|
3078
2406
|
);
|
|
@@ -3081,12 +2409,12 @@ var SCDialog = ({ title, iconTitle, subtitle, content, actions, buttonDialog, di
|
|
|
3081
2409
|
};
|
|
3082
2410
|
|
|
3083
2411
|
// src/Components/SCMenu.tsx
|
|
3084
|
-
var
|
|
3085
|
-
var
|
|
2412
|
+
var import_react21 = __toESM(require("react"), 1);
|
|
2413
|
+
var import_material15 = require("@mui/material");
|
|
3086
2414
|
var import_Grid26 = __toESM(require("@mui/material/Grid2"), 1);
|
|
3087
2415
|
|
|
3088
2416
|
// src/Components/Hooks/useWindowDimensions.ts
|
|
3089
|
-
var
|
|
2417
|
+
var import_react20 = require("react");
|
|
3090
2418
|
function getWindowDimensions() {
|
|
3091
2419
|
const { innerWidth: width, innerHeight: height } = window;
|
|
3092
2420
|
return {
|
|
@@ -3095,8 +2423,8 @@ function getWindowDimensions() {
|
|
|
3095
2423
|
};
|
|
3096
2424
|
}
|
|
3097
2425
|
function useWindowDimensions() {
|
|
3098
|
-
const [windowDimensions, setWindowDimensions] = (0,
|
|
3099
|
-
(0,
|
|
2426
|
+
const [windowDimensions, setWindowDimensions] = (0, import_react20.useState)(getWindowDimensions());
|
|
2427
|
+
(0, import_react20.useEffect)(() => {
|
|
3100
2428
|
function handleResize() {
|
|
3101
2429
|
setWindowDimensions(getWindowDimensions());
|
|
3102
2430
|
}
|
|
@@ -3114,12 +2442,12 @@ var SCMenu = ({ header, options, defaultOption, disable, widthMenu, heightMenu,
|
|
|
3114
2442
|
const pageSize = widthPage ? parseInt(widthPage) : width - menuSize;
|
|
3115
2443
|
const widthContainer = menuSize + pageSize;
|
|
3116
2444
|
let heightContainer = heightMenu ? parseInt(heightMenu) : height - 76;
|
|
3117
|
-
const [selectedIndex, setSelectedIndex] =
|
|
3118
|
-
const [value, setValue] =
|
|
3119
|
-
|
|
2445
|
+
const [selectedIndex, setSelectedIndex] = import_react21.default.useState("1");
|
|
2446
|
+
const [value, setValue] = import_react21.default.useState("1");
|
|
2447
|
+
import_react21.default.useEffect(() => {
|
|
3120
2448
|
heightContainer = heightMenu ? parseInt(heightMenu) : height - 76;
|
|
3121
2449
|
}, [height]);
|
|
3122
|
-
|
|
2450
|
+
import_react21.default.useEffect(() => {
|
|
3123
2451
|
if (defaultOption) {
|
|
3124
2452
|
handleClickMenusItem(event, void 0);
|
|
3125
2453
|
}
|
|
@@ -3149,34 +2477,34 @@ var SCMenu = ({ header, options, defaultOption, disable, widthMenu, heightMenu,
|
|
|
3149
2477
|
setValue(String(index + 1));
|
|
3150
2478
|
}
|
|
3151
2479
|
};
|
|
3152
|
-
return /* @__PURE__ */
|
|
3153
|
-
|
|
2480
|
+
return /* @__PURE__ */ import_react21.default.createElement(import_react21.default.Fragment, null, /* @__PURE__ */ import_react21.default.createElement(import_Grid26.default, { container: true, sx: { height: heightContainer, width: widthContainer, flexDirection: "column" } }, /* @__PURE__ */ import_react21.default.createElement(import_material15.Paper, { "data-testid": "menu-content", sx: { width: menuSize, height: heightContainer, overflow: "auto" } }, header && header.component, /* @__PURE__ */ import_react21.default.createElement(import_material15.MenuList, { sx: { height: options.length * 45, padding: "8px 0px" } }, options.map((option, index) => /* @__PURE__ */ import_react21.default.createElement(import_react21.default.Fragment, null, /* @__PURE__ */ import_react21.default.createElement(
|
|
2481
|
+
import_material15.MenuItem,
|
|
3154
2482
|
{
|
|
3155
2483
|
disabled: disable == true ? true : false,
|
|
3156
2484
|
key: index,
|
|
3157
2485
|
selected: String(index + 1) === selectedIndex,
|
|
3158
2486
|
onClick: (event2) => handleClickMenusItem(event2, index)
|
|
3159
2487
|
},
|
|
3160
|
-
option.iconLeft ? /* @__PURE__ */
|
|
3161
|
-
/* @__PURE__ */
|
|
3162
|
-
), option.divider == true ? /* @__PURE__ */
|
|
2488
|
+
option.iconLeft ? /* @__PURE__ */ import_react21.default.createElement(import_material15.ListItemIcon, { sx: { color: String(index + 1) === selectedIndex ? "primary" : "active" } }, /* @__PURE__ */ import_react21.default.createElement(import_material15.SvgIcon, { fontSize: "small", color: String(index + 1) === selectedIndex ? "primary" : "action", component: option.iconLeft })) : "",
|
|
2489
|
+
/* @__PURE__ */ import_react21.default.createElement(import_Grid26.default, { container: true, size: 12, sx: { maxWidth: 220, flexWrap: "noWrap", alignItems: "center" } }, /* @__PURE__ */ import_react21.default.createElement(import_material15.Typography, { noWrap: true, variant: "caption", color: String(index + 1) === selectedIndex ? "primary" : "active" }, option.name), option.iconRight ? /* @__PURE__ */ import_react21.default.createElement(import_material15.ListItemIcon, { sx: { minWidth: "0px !important", color: String(index + 1) === selectedIndex ? "primary" : "active" } }, /* @__PURE__ */ import_react21.default.createElement(import_material15.SvgIcon, { fontSize: "small", color: String(index + 1) === selectedIndex ? "primary" : "action", component: option.iconRight })) : "")
|
|
2490
|
+
), option.divider == true ? /* @__PURE__ */ import_react21.default.createElement(import_material15.Divider, null) : "")))), /* @__PURE__ */ import_react21.default.createElement(import_Grid26.default, { container: true }, options.map((option, index) => option.page ? String(index + 1) == value ? /* @__PURE__ */ import_react21.default.createElement(import_material15.Box, { "data-testid": "menu-page-content", sx: { padding: "16px", width: pageSize, height: heightContainer }, key: index }, option.page) : "" : /* @__PURE__ */ import_react21.default.createElement(import_material15.Typography, { color: "error" }, "No se ha configurado el componente a visualizar")))));
|
|
3163
2491
|
};
|
|
3164
2492
|
|
|
3165
2493
|
// src/Components/SCTabs.tsx
|
|
3166
|
-
var
|
|
3167
|
-
var
|
|
2494
|
+
var import_react22 = __toESM(require("react"), 1);
|
|
2495
|
+
var import_material16 = require("@mui/material");
|
|
3168
2496
|
var import_TabPanel = __toESM(require("@mui/lab/TabPanel"), 1);
|
|
3169
2497
|
var import_TabContext = __toESM(require("@mui/lab/TabContext"), 1);
|
|
3170
2498
|
var Muicon7 = __toESM(require("@mui/icons-material"), 1);
|
|
3171
2499
|
var SCTabs = ({ options, defaultOption, typeIcon, background, iconPosition, colorTab, orientation, variant, scrollButtons, children }) => {
|
|
3172
|
-
const [toast, setToast] =
|
|
2500
|
+
const [toast, setToast] = import_react22.default.useState(null);
|
|
3173
2501
|
let i = 0;
|
|
3174
2502
|
let j = 0;
|
|
3175
2503
|
let k = 0;
|
|
3176
2504
|
let l = 0;
|
|
3177
2505
|
let validateTypeIcon = true;
|
|
3178
|
-
const [value, setValue] =
|
|
3179
|
-
(0,
|
|
2506
|
+
const [value, setValue] = import_react22.default.useState("1");
|
|
2507
|
+
(0, import_react22.useEffect)(() => {
|
|
3180
2508
|
if (defaultOption) {
|
|
3181
2509
|
handleChange(event, void 0);
|
|
3182
2510
|
}
|
|
@@ -3226,8 +2554,8 @@ var SCTabs = ({ options, defaultOption, typeIcon, background, iconPosition, colo
|
|
|
3226
2554
|
setValue(newValue);
|
|
3227
2555
|
}
|
|
3228
2556
|
};
|
|
3229
|
-
return /* @__PURE__ */
|
|
3230
|
-
|
|
2557
|
+
return /* @__PURE__ */ import_react22.default.createElement(import_react22.default.Fragment, null, validateTypeIcon == true ? /* @__PURE__ */ import_react22.default.createElement(import_material16.Box, { sx: { height: orientation == "vertical" ? "100%" : "auto", display: "flex", flexDirection: orientation == "vertical" ? "row" : "column" }, id: "tabsitos" }, /* @__PURE__ */ import_react22.default.createElement(import_TabContext.default, { value }, /* @__PURE__ */ import_react22.default.createElement(
|
|
2558
|
+
import_material16.Tabs,
|
|
3231
2559
|
{
|
|
3232
2560
|
"data-testid": "tab-container",
|
|
3233
2561
|
value,
|
|
@@ -3240,8 +2568,8 @@ var SCTabs = ({ options, defaultOption, typeIcon, background, iconPosition, colo
|
|
|
3240
2568
|
orientation: orientation || "horizontal",
|
|
3241
2569
|
sx: { borderBottom: orientation == "vertical" ? 0 : 1, borderRight: orientation == "vertical" ? 1 : 0, borderColor: "divider", background: background || "" }
|
|
3242
2570
|
},
|
|
3243
|
-
options.map((option) => /* @__PURE__ */
|
|
3244
|
-
|
|
2571
|
+
options.map((option) => /* @__PURE__ */ import_react22.default.createElement(
|
|
2572
|
+
import_material16.Tab,
|
|
3245
2573
|
{
|
|
3246
2574
|
"data-testid": "tab-item",
|
|
3247
2575
|
value: String(i = i + 1),
|
|
@@ -3249,8 +2577,8 @@ var SCTabs = ({ options, defaultOption, typeIcon, background, iconPosition, colo
|
|
|
3249
2577
|
label: option.name || "",
|
|
3250
2578
|
disabled: option.disabled || false,
|
|
3251
2579
|
iconPosition: iconPosition || "end",
|
|
3252
|
-
icon: typeIcon == "badge" ? /* @__PURE__ */
|
|
3253
|
-
|
|
2580
|
+
icon: typeIcon == "badge" ? /* @__PURE__ */ import_react22.default.createElement(
|
|
2581
|
+
import_material16.Badge,
|
|
3254
2582
|
{
|
|
3255
2583
|
sx: {
|
|
3256
2584
|
width: "20px",
|
|
@@ -3264,38 +2592,33 @@ var SCTabs = ({ options, defaultOption, typeIcon, background, iconPosition, colo
|
|
|
3264
2592
|
badgeContent: option.iconOrBadge,
|
|
3265
2593
|
color: value == String(i) ? colorTab ? colorTab : "primary" : "default"
|
|
3266
2594
|
}
|
|
3267
|
-
) : typeIcon == "icon" ? /* @__PURE__ */
|
|
2595
|
+
) : typeIcon == "icon" ? /* @__PURE__ */ import_react22.default.createElement(import_material16.SvgIcon, { fontSize: "small", component: option.iconOrBadge, color: value == String(i) ? colorTab ? colorTab : "primary" : "action", sx: { width: "20px", height: "20px" } }) : "",
|
|
3268
2596
|
sx: { "& .MuiTab-icon": { margin: "0px !important" }, padding: "10px 16px", gap: "4px" }
|
|
3269
2597
|
}
|
|
3270
2598
|
))
|
|
3271
|
-
), children, options.map((option) => /* @__PURE__ */
|
|
2599
|
+
), children, options.map((option) => /* @__PURE__ */ import_react22.default.createElement(
|
|
3272
2600
|
import_TabPanel.default,
|
|
3273
2601
|
{
|
|
3274
2602
|
key: k = k + 1,
|
|
3275
2603
|
value: String(l = l + 1),
|
|
3276
2604
|
sx: { padding: "16px" }
|
|
3277
2605
|
},
|
|
3278
|
-
option.page ? option.page : /* @__PURE__ */
|
|
3279
|
-
)))) : /* @__PURE__ */
|
|
2606
|
+
option.page ? option.page : /* @__PURE__ */ import_react22.default.createElement(import_material16.Typography, null, "No se ha configurado el componente a visualizar ")
|
|
2607
|
+
)))) : /* @__PURE__ */ import_react22.default.createElement(import_material16.Box, { sx: { height: "200px" } }, toast && /* @__PURE__ */ import_react22.default.createElement(SCToastNotification, __spreadValues({ "data-testid": "error-tab-message" }, toast))));
|
|
3280
2608
|
};
|
|
3281
2609
|
|
|
3282
2610
|
// src/Components/Calendario/Calendar.tsx
|
|
3283
|
-
var
|
|
3284
|
-
var
|
|
2611
|
+
var import_react28 = __toESM(require("react"), 1);
|
|
2612
|
+
var import_material22 = require("@mui/material");
|
|
2613
|
+
var import_dayjs7 = __toESM(require("dayjs"), 1);
|
|
3285
2614
|
|
|
3286
2615
|
// src/Components/Calendario/CalendarToolbar.tsx
|
|
3287
|
-
var
|
|
3288
|
-
var
|
|
3289
|
-
var
|
|
2616
|
+
var import_react23 = __toESM(require("react"), 1);
|
|
2617
|
+
var import_icons_material10 = require("@mui/icons-material");
|
|
2618
|
+
var import_material17 = require("@mui/material");
|
|
3290
2619
|
var import_dayjs2 = __toESM(require("dayjs"), 1);
|
|
3291
|
-
var import_updateLocale = __toESM(require("dayjs/plugin/updateLocale"), 1);
|
|
3292
2620
|
var import_es2 = require("dayjs/locale/es");
|
|
3293
2621
|
import_dayjs2.default.locale("es");
|
|
3294
|
-
import_dayjs2.default.extend(import_updateLocale.default);
|
|
3295
|
-
import_dayjs2.default.updateLocale("en", {
|
|
3296
|
-
weekStart: 0
|
|
3297
|
-
// 0 = domingo
|
|
3298
|
-
});
|
|
3299
2622
|
var CalendarToolbar = ({
|
|
3300
2623
|
labelDate,
|
|
3301
2624
|
view,
|
|
@@ -3303,7 +2626,7 @@ var CalendarToolbar = ({
|
|
|
3303
2626
|
onNavigate,
|
|
3304
2627
|
children
|
|
3305
2628
|
}) => {
|
|
3306
|
-
const [anchorEl, setAnchorEl] = (0,
|
|
2629
|
+
const [anchorEl, setAnchorEl] = (0, import_react23.useState)(null);
|
|
3307
2630
|
const open = Boolean(anchorEl);
|
|
3308
2631
|
const handleMenuOpen = (event2) => {
|
|
3309
2632
|
setAnchorEl(event2.currentTarget);
|
|
@@ -3316,26 +2639,24 @@ var CalendarToolbar = ({
|
|
|
3316
2639
|
handleMenuClose();
|
|
3317
2640
|
};
|
|
3318
2641
|
const getFormattedDate = () => {
|
|
3319
|
-
const sunday = labelDate.day(0);
|
|
3320
2642
|
if (view === "month") {
|
|
3321
|
-
|
|
3322
|
-
return textMonth.charAt(0).toUpperCase() + textMonth.slice(1);
|
|
2643
|
+
return labelDate.format("MMMM YYYY");
|
|
3323
2644
|
}
|
|
3324
2645
|
if (view === "week") {
|
|
3325
|
-
return `${labelDate.startOf("week").format("DD MMM")} - ${labelDate.endOf("week").format("DD MMM YYYY")}`;
|
|
2646
|
+
return `${labelDate.startOf("week").add(1, "day").format("DD MMM")} - ${labelDate.endOf("week").format("DD MMM YYYY")}`;
|
|
3326
2647
|
}
|
|
3327
2648
|
return labelDate.format(" DD MMMM YYYY");
|
|
3328
2649
|
};
|
|
3329
|
-
return /* @__PURE__ */
|
|
3330
|
-
|
|
2650
|
+
return /* @__PURE__ */ import_react23.default.createElement(import_material17.Stack, { direction: "row", alignItems: "center", justifyContent: "space-between", gap: 0.5, px: 1, py: 0.5 }, /* @__PURE__ */ import_react23.default.createElement(import_material17.Box, null, /* @__PURE__ */ import_react23.default.createElement(
|
|
2651
|
+
import_material17.Chip,
|
|
3331
2652
|
{
|
|
3332
2653
|
label: "Hoy",
|
|
3333
|
-
icon: /* @__PURE__ */
|
|
2654
|
+
icon: /* @__PURE__ */ import_react23.default.createElement(import_icons_material10.LightModeOutlined, { fontSize: "small" }),
|
|
3334
2655
|
color: "primary",
|
|
3335
2656
|
onClick: () => onNavigate("TODAY")
|
|
3336
2657
|
}
|
|
3337
|
-
)), /* @__PURE__ */
|
|
3338
|
-
|
|
2658
|
+
)), /* @__PURE__ */ import_react23.default.createElement(import_material17.Stack, { direction: "row", alignItems: "center", gap: 1 }, /* @__PURE__ */ import_react23.default.createElement(import_material17.IconButton, { "aria-label": "Anterior", onClick: () => onNavigate("PREV"), size: "small", color: "primary" }, /* @__PURE__ */ import_react23.default.createElement(import_icons_material10.ChevronLeft, { fontSize: "small" })), /* @__PURE__ */ import_react23.default.createElement(import_material17.IconButton, { "aria-label": "Siguiente", onClick: () => onNavigate("NEXT"), size: "small", color: "primary" }, /* @__PURE__ */ import_react23.default.createElement(import_icons_material10.ChevronRight, { fontSize: "small" })), /* @__PURE__ */ import_react23.default.createElement(import_material17.Typography, { variant: "h6", color: "primary", "data-testid": "currentDate" }, getFormattedDate()), /* @__PURE__ */ import_react23.default.createElement(import_material17.IconButton, { onClick: handleMenuOpen, size: "small", color: "primary", "aria-label": "Cambiar vista" }, /* @__PURE__ */ import_react23.default.createElement(import_icons_material10.KeyboardArrowDown, { fontSize: "small" })), /* @__PURE__ */ import_react23.default.createElement(
|
|
2659
|
+
import_material17.Menu,
|
|
3339
2660
|
{
|
|
3340
2661
|
anchorEl,
|
|
3341
2662
|
open,
|
|
@@ -3343,15 +2664,15 @@ var CalendarToolbar = ({
|
|
|
3343
2664
|
anchorOrigin: { vertical: "bottom", horizontal: "center" },
|
|
3344
2665
|
transformOrigin: { vertical: "top", horizontal: "center" }
|
|
3345
2666
|
},
|
|
3346
|
-
/* @__PURE__ */
|
|
3347
|
-
/* @__PURE__ */
|
|
3348
|
-
/* @__PURE__ */
|
|
3349
|
-
)), children ? /* @__PURE__ */
|
|
2667
|
+
/* @__PURE__ */ import_react23.default.createElement(import_material17.MenuItem, { onClick: () => handleViewChange("month") }, "Mes"),
|
|
2668
|
+
/* @__PURE__ */ import_react23.default.createElement(import_material17.MenuItem, { onClick: () => handleViewChange("week") }, "Semana"),
|
|
2669
|
+
/* @__PURE__ */ import_react23.default.createElement(import_material17.MenuItem, { onClick: () => handleViewChange("day") }, "D\xEDa")
|
|
2670
|
+
)), children ? /* @__PURE__ */ import_react23.default.createElement(import_material17.Box, null, children) : /* @__PURE__ */ import_react23.default.createElement(import_material17.Box, { width: "24px" }), " ");
|
|
3350
2671
|
};
|
|
3351
2672
|
|
|
3352
2673
|
// src/Components/Calendario/Views/MonthView.tsx
|
|
3353
|
-
var
|
|
3354
|
-
var
|
|
2674
|
+
var import_react25 = __toESM(require("react"), 1);
|
|
2675
|
+
var import_material19 = require("@mui/material");
|
|
3355
2676
|
var import_Add = __toESM(require("@mui/icons-material/Add"), 1);
|
|
3356
2677
|
var import_dayjs4 = __toESM(require("dayjs"), 1);
|
|
3357
2678
|
var import_localeData = __toESM(require("dayjs/plugin/localeData"), 1);
|
|
@@ -3377,32 +2698,21 @@ var stateColors = {
|
|
|
3377
2698
|
Asignada: "warning.main",
|
|
3378
2699
|
Finalizado: "primary.main",
|
|
3379
2700
|
Vencida: "error.main",
|
|
3380
|
-
EnProgreso: "success.main"
|
|
3381
|
-
Aplazada: "grey.400",
|
|
3382
|
-
Generada: "secondary.main"
|
|
2701
|
+
EnProgreso: "success.main"
|
|
3383
2702
|
};
|
|
3384
2703
|
|
|
3385
2704
|
// src/Components/Calendario/Event.tsx
|
|
3386
|
-
var
|
|
3387
|
-
var
|
|
3388
|
-
var CalendarEventCard = ({ event: event2, color, sx, onClick
|
|
3389
|
-
|
|
3390
|
-
|
|
3391
|
-
setAnchorEl(event3.currentTarget);
|
|
3392
|
-
};
|
|
3393
|
-
const handlePopoverClose = () => {
|
|
3394
|
-
setAnchorEl(null);
|
|
3395
|
-
};
|
|
3396
|
-
const open = Boolean(anchorEl);
|
|
3397
|
-
return /* @__PURE__ */ import_react30.default.createElement(
|
|
3398
|
-
import_material19.Stack,
|
|
2705
|
+
var import_react24 = __toESM(require("react"), 1);
|
|
2706
|
+
var import_material18 = require("@mui/material");
|
|
2707
|
+
var CalendarEventCard = ({ event: event2, color, sx, onClick }) => {
|
|
2708
|
+
return /* @__PURE__ */ import_react24.default.createElement(
|
|
2709
|
+
import_material18.Stack,
|
|
3399
2710
|
{
|
|
3400
2711
|
direction: "row",
|
|
3401
2712
|
padding: 0.5,
|
|
3402
2713
|
borderRadius: 0.5,
|
|
3403
2714
|
alignItems: "flex-start",
|
|
3404
2715
|
minHeight: "20px",
|
|
3405
|
-
onMouseOver: () => onHover == null ? void 0 : onHover(event2),
|
|
3406
2716
|
onClick: (e) => {
|
|
3407
2717
|
e.stopPropagation();
|
|
3408
2718
|
onClick == null ? void 0 : onClick(event2);
|
|
@@ -3415,8 +2725,8 @@ var CalendarEventCard = ({ event: event2, color, sx, onClick, onHover }) => {
|
|
|
3415
2725
|
cursor: onClick ? "pointer" : "default"
|
|
3416
2726
|
}, sx)
|
|
3417
2727
|
},
|
|
3418
|
-
/* @__PURE__ */
|
|
3419
|
-
|
|
2728
|
+
/* @__PURE__ */ import_react24.default.createElement(
|
|
2729
|
+
import_material18.Divider,
|
|
3420
2730
|
{
|
|
3421
2731
|
orientation: "vertical",
|
|
3422
2732
|
flexItem: true,
|
|
@@ -3427,8 +2737,8 @@ var CalendarEventCard = ({ event: event2, color, sx, onClick, onHover }) => {
|
|
|
3427
2737
|
}
|
|
3428
2738
|
}
|
|
3429
2739
|
),
|
|
3430
|
-
/* @__PURE__ */
|
|
3431
|
-
|
|
2740
|
+
/* @__PURE__ */ import_react24.default.createElement(
|
|
2741
|
+
import_material18.Box,
|
|
3432
2742
|
{
|
|
3433
2743
|
px: 1,
|
|
3434
2744
|
py: 0.5,
|
|
@@ -3437,8 +2747,8 @@ var CalendarEventCard = ({ event: event2, color, sx, onClick, onHover }) => {
|
|
|
3437
2747
|
display: "flex",
|
|
3438
2748
|
alignItems: "center"
|
|
3439
2749
|
},
|
|
3440
|
-
/* @__PURE__ */
|
|
3441
|
-
|
|
2750
|
+
/* @__PURE__ */ import_react24.default.createElement(
|
|
2751
|
+
import_material18.Typography,
|
|
3442
2752
|
{
|
|
3443
2753
|
color: "text.primary",
|
|
3444
2754
|
variant: "caption",
|
|
@@ -3447,66 +2757,30 @@ var CalendarEventCard = ({ event: event2, color, sx, onClick, onHover }) => {
|
|
|
3447
2757
|
overflow: "hidden",
|
|
3448
2758
|
textOverflow: "ellipsis",
|
|
3449
2759
|
whiteSpace: "nowrap"
|
|
3450
|
-
}
|
|
3451
|
-
onMouseEnter: handlePopoverOpen,
|
|
3452
|
-
onMouseLeave: handlePopoverClose
|
|
3453
|
-
},
|
|
3454
|
-
event2.title.charAt(0).toUpperCase() + event2.title.slice(1).toLowerCase()
|
|
3455
|
-
),
|
|
3456
|
-
/* @__PURE__ */ import_react30.default.createElement(
|
|
3457
|
-
import_material19.Popover,
|
|
3458
|
-
{
|
|
3459
|
-
id: "mouse-over-popover",
|
|
3460
|
-
sx: { pointerEvents: "none" },
|
|
3461
|
-
open,
|
|
3462
|
-
anchorEl,
|
|
3463
|
-
anchorOrigin: {
|
|
3464
|
-
vertical: "top",
|
|
3465
|
-
horizontal: "right"
|
|
3466
|
-
},
|
|
3467
|
-
transformOrigin: {
|
|
3468
|
-
vertical: "bottom",
|
|
3469
|
-
horizontal: "right"
|
|
3470
|
-
},
|
|
3471
|
-
onClose: handlePopoverClose,
|
|
3472
|
-
disableRestoreFocus: true
|
|
2760
|
+
}
|
|
3473
2761
|
},
|
|
3474
|
-
|
|
2762
|
+
capitalize(event2.title)
|
|
3475
2763
|
)
|
|
3476
2764
|
)
|
|
3477
2765
|
);
|
|
3478
2766
|
};
|
|
3479
2767
|
|
|
3480
|
-
// src/assets/LogoCalendario.tsx
|
|
3481
|
-
var import_react31 = __toESM(require("react"), 1);
|
|
3482
|
-
var LogoCalendario = () => {
|
|
3483
|
-
return /* @__PURE__ */ import_react31.default.createElement("svg", { width: "60", height: "61", viewBox: "0 0 60 61", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, /* @__PURE__ */ import_react31.default.createElement("g", { "clip-path": "url(#clip0_5353_24891)" }, /* @__PURE__ */ import_react31.default.createElement("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M40.7361 11.1589C39.7792 11.1589 39.0106 11.9722 39.0106 12.9661V15.4375H20.0309V12.9661C20.0309 11.964 19.2545 11.1589 18.3055 11.1589C17.3487 11.1589 16.5801 11.9722 16.5801 12.9661V15.4375H12.8819C12.0652 15.4375 11.4038 16.0918 11.4038 16.8998V20.6551C11.4038 21.463 12.0652 22.1174 12.8819 22.1174H46.8383C47.655 22.1174 48.3165 21.463 48.3165 20.6551V16.8998C48.3165 16.0918 47.655 15.4375 46.8383 15.4375H42.4615V12.9661C42.4615 11.964 41.6851 11.1589 40.7361 11.1589ZM19.4827 19.2049C19.6528 19.1343 19.7361 19.006 19.7724 18.8352C19.6916 18.9714 19.594 19.0957 19.4827 19.2049Z", fill: "#00BCD4" }), /* @__PURE__ */ import_react31.default.createElement("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M14.2037 25.8653C13.7579 25.8653 13.425 26.2168 13.425 26.6093V47.3669C13.425 47.7595 13.7579 48.1109 14.2037 48.1109H46.0004C46.4782 48.1109 46.8656 47.7236 46.8656 47.2458V26.6093C46.8656 26.2168 46.5327 25.8653 46.087 25.8653H14.2037ZM11.6948 26.6093C11.6948 25.2255 12.8384 24.135 14.2037 24.135H46.087C47.4522 24.135 48.5959 25.2255 48.5959 26.6093V47.2458C48.5959 48.6792 47.4339 49.8412 46.0004 49.8412H14.2037C12.8384 49.8412 11.6948 48.7508 11.6948 47.3669V26.6093Z", fill: "#6392BD" }), /* @__PURE__ */ import_react31.default.createElement("path", { d: "M19.481 30.9138C19.481 30.5164 20.1155 30.1903 20.9058 30.1903C21.6894 30.1903 22.3305 30.5131 22.3305 30.9138V32.8862C22.3305 33.2836 21.6894 33.6097 20.9058 33.6097C20.1222 33.6097 19.481 33.2869 19.481 32.8862V30.9138Z", fill: "#6392BD" }), /* @__PURE__ */ import_react31.default.createElement("path", { d: "M30.0242 30.1903C29.2339 30.1903 28.5995 30.5164 28.5995 30.9138V32.8862C28.5995 33.2869 29.2406 33.6097 30.0242 33.6097C30.8079 33.6097 31.449 33.2836 31.449 32.8862V30.9138C31.449 30.5131 30.8079 30.1903 30.0242 30.1903Z", fill: "#6392BD" }), /* @__PURE__ */ import_react31.default.createElement("path", { d: "M37.7179 30.9138C37.7179 30.5164 38.3524 30.1903 39.1427 30.1903C39.608 30.1903 40.022 30.3038 40.2825 30.4797C40.3515 30.5276 40.4116 30.5788 40.4561 30.6344C40.5274 30.7201 40.5675 30.8147 40.5675 30.9138V32.8862C40.5675 33.2836 39.9263 33.6097 39.1427 33.6097C38.3591 33.6097 37.7179 33.2869 37.7179 32.8862V30.9138Z", fill: "#6392BD" }), /* @__PURE__ */ import_react31.default.createElement("path", { d: "M20.9058 39.8787C20.1155 39.8787 19.481 40.2048 19.481 40.6022V42.5746C19.481 42.687 19.5322 42.7927 19.6213 42.8874C19.7036 42.9731 19.8172 43.0499 19.9552 43.1122C20.2068 43.228 20.5407 43.2981 20.9058 43.2981C21.6894 43.2981 22.3305 42.972 22.3305 42.5746V40.6022C22.3305 40.2015 21.6894 39.8787 20.9058 39.8787Z", fill: "#6392BD" }), /* @__PURE__ */ import_react31.default.createElement("path", { d: "M29.524 39.9477C29.7087 39.9032 29.9158 39.8787 30.1339 39.8787C30.9176 39.8787 31.5587 40.2015 31.5587 40.6022V42.5746C31.5587 42.972 30.9176 43.2981 30.1339 43.2981C29.3503 43.2981 28.7092 42.9753 28.7092 42.5746V40.6022C28.7092 40.315 29.0409 40.0646 29.524 39.9477Z", fill: "#6392BD" }), /* @__PURE__ */ import_react31.default.createElement("path", { d: "M38.5141 39.9482C38.6989 39.9037 38.9059 39.8792 39.1241 39.8792C39.9077 39.8792 40.5488 40.202 40.5488 40.6027V42.5751C40.5488 42.9725 39.9077 43.2986 39.1241 43.2986C38.3405 43.2986 37.6993 42.9758 37.6993 42.5751V40.6027C37.6993 40.3155 38.031 40.0651 38.5141 39.9482Z", fill: "#6392BD" })), /* @__PURE__ */ import_react31.default.createElement("defs", null, /* @__PURE__ */ import_react31.default.createElement("clipPath", { id: "clip0_5353_24891" }, /* @__PURE__ */ import_react31.default.createElement("rect", { width: "60", height: "60", fill: "white", transform: "translate(0 0.5)" }))));
|
|
3484
|
-
};
|
|
3485
|
-
|
|
3486
2768
|
// src/Components/Calendario/Views/MonthView.tsx
|
|
3487
2769
|
import_dayjs4.default.extend(import_localeData.default);
|
|
3488
2770
|
import_dayjs4.default.extend(import_isBetween.default);
|
|
3489
|
-
var MonthView = ({ events,
|
|
3490
|
-
const noEvents = events.length === 0;
|
|
2771
|
+
var MonthView = ({ events, onDayClick, onMoreClick, currentDate, onEventClick }) => {
|
|
3491
2772
|
const days = getMonthDays(currentDate);
|
|
3492
2773
|
const weekDays = Array.from({ length: 7 }, (_, i) => (0, import_dayjs4.default)().day(i));
|
|
3493
|
-
const [openDrawer, setOpenDrawer] =
|
|
3494
|
-
const [selectedDay, setSelectedDay] =
|
|
3495
|
-
const [selectedEvents, setSelectedEvents] =
|
|
3496
|
-
return /* @__PURE__ */
|
|
3497
|
-
EmptyState,
|
|
3498
|
-
{
|
|
3499
|
-
title: "Inicia la gesti\xF3n de las actividades",
|
|
3500
|
-
subtitle: "Selecciona un mec\xE1nico y as\xEDgnale las actividades a realizar.",
|
|
3501
|
-
icon: /* @__PURE__ */ import_react32.default.createElement(LogoCalendario, null)
|
|
3502
|
-
}
|
|
3503
|
-
) : /* @__PURE__ */ import_react32.default.createElement(import_material20.Box, { display: "grid", gridTemplateColumns: "repeat(7, minmax(150px, 1fr))", gap: 0.5 }, days.map((day) => {
|
|
2774
|
+
const [openDrawer, setOpenDrawer] = import_react25.default.useState(false);
|
|
2775
|
+
const [selectedDay, setSelectedDay] = import_react25.default.useState(null);
|
|
2776
|
+
const [selectedEvents, setSelectedEvents] = import_react25.default.useState([]);
|
|
2777
|
+
return /* @__PURE__ */ import_react25.default.createElement(import_material19.Box, { width: "100%", sx: { overflowX: "auto" } }, /* @__PURE__ */ import_react25.default.createElement(import_material19.Box, { minWidth: "1050px" }, /* @__PURE__ */ import_react25.default.createElement(import_material19.Box, { display: "grid", gridTemplateColumns: "repeat(7, minmax(150px, 1fr))", gap: 0.5, mb: 1 }, weekDays.map((day) => /* @__PURE__ */ import_react25.default.createElement(import_material19.Box, { key: day.day(), textAlign: "center", py: 0.5 }, /* @__PURE__ */ import_react25.default.createElement(import_material19.Typography, { variant: "caption", color: "text.secondary" }, day.format("dddd"))))), /* @__PURE__ */ import_react25.default.createElement(import_material19.Box, { display: "grid", gridTemplateColumns: "repeat(7, minmax(150px, 1fr))", gap: 0.5 }, days.map((day) => {
|
|
3504
2778
|
const dayEvents = events.filter(
|
|
3505
2779
|
(e) => day.isBetween(e.start.startOf("day"), e.end.endOf("day"), null, "[]")
|
|
3506
2780
|
);
|
|
3507
2781
|
const isCurrentMonth = day.month() === currentDate.month();
|
|
3508
|
-
return /* @__PURE__ */
|
|
3509
|
-
|
|
2782
|
+
return /* @__PURE__ */ import_react25.default.createElement(
|
|
2783
|
+
import_material19.Paper,
|
|
3510
2784
|
{
|
|
3511
2785
|
key: day.toString(),
|
|
3512
2786
|
onClick: () => onDayClick == null ? void 0 : onDayClick(day),
|
|
@@ -3522,8 +2796,8 @@ var MonthView = ({ events, isLoading, onDayClick, onMoreClick, currentDate, onEv
|
|
|
3522
2796
|
overflow: "hidden"
|
|
3523
2797
|
}
|
|
3524
2798
|
},
|
|
3525
|
-
/* @__PURE__ */
|
|
3526
|
-
|
|
2799
|
+
/* @__PURE__ */ import_react25.default.createElement(import_material19.Box, { p: 1, flexShrink: 0 }, /* @__PURE__ */ import_react25.default.createElement(import_material19.Box, { display: "flex", alignItems: "center", justifyContent: "flex-start" }, /* @__PURE__ */ import_react25.default.createElement(
|
|
2800
|
+
import_material19.Box,
|
|
3527
2801
|
{
|
|
3528
2802
|
sx: {
|
|
3529
2803
|
width: 24,
|
|
@@ -3535,16 +2809,16 @@ var MonthView = ({ events, isLoading, onDayClick, onMoreClick, currentDate, onEv
|
|
|
3535
2809
|
justifyContent: "center"
|
|
3536
2810
|
}
|
|
3537
2811
|
},
|
|
3538
|
-
/* @__PURE__ */
|
|
3539
|
-
|
|
2812
|
+
/* @__PURE__ */ import_react25.default.createElement(
|
|
2813
|
+
import_material19.Typography,
|
|
3540
2814
|
{
|
|
3541
2815
|
variant: "body2",
|
|
3542
2816
|
sx: { color: isToday(day) ? "white" : "text.secondary" }
|
|
3543
2817
|
},
|
|
3544
2818
|
day.date()
|
|
3545
2819
|
)
|
|
3546
|
-
), dayEvents.length > 2 && /* @__PURE__ */
|
|
3547
|
-
|
|
2820
|
+
), dayEvents.length > 2 && /* @__PURE__ */ import_react25.default.createElement(import_material19.Tooltip, { title: "M\xE1s eventos" }, /* @__PURE__ */ import_react25.default.createElement(
|
|
2821
|
+
import_material19.IconButton,
|
|
3548
2822
|
{
|
|
3549
2823
|
color: "primary",
|
|
3550
2824
|
size: "small",
|
|
@@ -3555,46 +2829,64 @@ var MonthView = ({ events, isLoading, onDayClick, onMoreClick, currentDate, onEv
|
|
|
3555
2829
|
setSelectedEvents(dayEvents);
|
|
3556
2830
|
}
|
|
3557
2831
|
},
|
|
3558
|
-
/* @__PURE__ */
|
|
2832
|
+
/* @__PURE__ */ import_react25.default.createElement(import_Add.default, { fontSize: "small" })
|
|
3559
2833
|
)))),
|
|
3560
|
-
/* @__PURE__ */
|
|
2834
|
+
/* @__PURE__ */ import_react25.default.createElement(import_material19.Box, { display: "flex", flexDirection: "column", gap: 0.5, p: 1, pt: 0, overflow: "hidden" }, dayEvents.slice(0, 2).map((event2) => /* @__PURE__ */ import_react25.default.createElement(
|
|
3561
2835
|
CalendarEventCard,
|
|
3562
2836
|
{
|
|
3563
2837
|
key: `${event2.id}-${day.toString()}`,
|
|
3564
2838
|
event: event2,
|
|
3565
2839
|
color: stateColors[event2.state],
|
|
3566
|
-
onClick: () => onEventClick == null ? void 0 : onEventClick(event2, day)
|
|
3567
|
-
onHover: onEventHover
|
|
2840
|
+
onClick: () => onEventClick == null ? void 0 : onEventClick(event2, day)
|
|
3568
2841
|
}
|
|
3569
2842
|
))),
|
|
3570
|
-
dayEvents.length > 2 && /* @__PURE__ */
|
|
3571
|
-
|
|
2843
|
+
dayEvents.length > 2 && /* @__PURE__ */ import_react25.default.createElement(import_material19.Stack, { justifyContent: "flex-end", px: 1, pb: 0.5, onClick: (e) => e.stopPropagation() }, /* @__PURE__ */ import_react25.default.createElement(
|
|
2844
|
+
SCDrawer,
|
|
3572
2845
|
{
|
|
3573
|
-
|
|
3574
|
-
|
|
3575
|
-
|
|
3576
|
-
|
|
3577
|
-
|
|
3578
|
-
|
|
3579
|
-
|
|
3580
|
-
|
|
3581
|
-
|
|
3582
|
-
|
|
3583
|
-
|
|
3584
|
-
|
|
3585
|
-
|
|
3586
|
-
|
|
3587
|
-
|
|
3588
|
-
|
|
3589
|
-
|
|
3590
|
-
|
|
3591
|
-
|
|
2846
|
+
width: "350px",
|
|
2847
|
+
title: day.format("DD [de] MMMM YYYY"),
|
|
2848
|
+
open: openDrawer,
|
|
2849
|
+
buttonDrawer: { text: `+ ${dayEvents.length}` },
|
|
2850
|
+
anchor: "right",
|
|
2851
|
+
actions: false,
|
|
2852
|
+
arrayElements: [{
|
|
2853
|
+
component: (() => {
|
|
2854
|
+
const [first, ...rest] = dayEvents;
|
|
2855
|
+
return /* @__PURE__ */ import_react25.default.createElement(import_material19.Box, { display: "flex", width: "100%", flexDirection: "column", height: "100%", pr: 1.5 }, /* @__PURE__ */ import_react25.default.createElement(import_material19.Typography, { width: "100%", color: "text.secondary" }, " Proximo evento "), first && /* @__PURE__ */ import_react25.default.createElement(import_material19.Box, { p: 1, pb: 1, width: "100%" }, /* @__PURE__ */ import_react25.default.createElement(
|
|
2856
|
+
CalendarEventCard,
|
|
2857
|
+
{
|
|
2858
|
+
event: first,
|
|
2859
|
+
color: stateColors[first.state],
|
|
2860
|
+
onClick: () => onEventClick == null ? void 0 : onEventClick(first, day),
|
|
2861
|
+
sx: {
|
|
2862
|
+
whiteSpace: "normal",
|
|
2863
|
+
"& .MuiTypography-root": {
|
|
2864
|
+
whiteSpace: "normal",
|
|
2865
|
+
overflow: "visible",
|
|
2866
|
+
textOverflow: "unset"
|
|
2867
|
+
}
|
|
2868
|
+
}
|
|
2869
|
+
}
|
|
2870
|
+
)), /* @__PURE__ */ import_react25.default.createElement(import_material19.Divider, { flexItem: true, sx: { width: "100%" } }), /* @__PURE__ */ import_react25.default.createElement(import_material19.Typography, { width: "100%", py: 1, color: "text.secondary" }, " Eventos restantes "), /* @__PURE__ */ import_react25.default.createElement(
|
|
2871
|
+
import_material19.Box,
|
|
2872
|
+
{
|
|
2873
|
+
width: "100%",
|
|
2874
|
+
height: "100%",
|
|
2875
|
+
flex: 1,
|
|
2876
|
+
overflow: "auto",
|
|
2877
|
+
p: 1,
|
|
2878
|
+
pt: 1,
|
|
2879
|
+
display: "flex",
|
|
2880
|
+
flexDirection: "column",
|
|
2881
|
+
gap: 1.5
|
|
2882
|
+
},
|
|
2883
|
+
rest.map((event2) => /* @__PURE__ */ import_react25.default.createElement(
|
|
3592
2884
|
CalendarEventCard,
|
|
3593
2885
|
{
|
|
3594
|
-
|
|
3595
|
-
|
|
3596
|
-
|
|
3597
|
-
|
|
2886
|
+
key: `${event2.id}-${day.toString()}`,
|
|
2887
|
+
event: event2,
|
|
2888
|
+
color: stateColors[event2.state],
|
|
2889
|
+
onClick: () => onEventClick == null ? void 0 : onEventClick(event2, day),
|
|
3598
2890
|
sx: {
|
|
3599
2891
|
whiteSpace: "normal",
|
|
3600
2892
|
"& .MuiTypography-root": {
|
|
@@ -3604,68 +2896,26 @@ var MonthView = ({ events, isLoading, onDayClick, onMoreClick, currentDate, onEv
|
|
|
3604
2896
|
}
|
|
3605
2897
|
}
|
|
3606
2898
|
}
|
|
3607
|
-
))
|
|
3608
|
-
|
|
3609
|
-
|
|
3610
|
-
|
|
3611
|
-
|
|
3612
|
-
|
|
3613
|
-
overflow: "auto",
|
|
3614
|
-
p: 1,
|
|
3615
|
-
pt: 1,
|
|
3616
|
-
display: "flex",
|
|
3617
|
-
flexDirection: "column",
|
|
3618
|
-
gap: 1.5
|
|
3619
|
-
},
|
|
3620
|
-
rest.map((event2) => /* @__PURE__ */ import_react32.default.createElement(
|
|
3621
|
-
CalendarEventCard,
|
|
3622
|
-
{
|
|
3623
|
-
key: `${event2.id}-${day.toString()}`,
|
|
3624
|
-
event: event2,
|
|
3625
|
-
color: stateColors[event2.state],
|
|
3626
|
-
onClick: () => onEventClick == null ? void 0 : onEventClick(event2, day),
|
|
3627
|
-
onHover: onEventHover,
|
|
3628
|
-
sx: {
|
|
3629
|
-
whiteSpace: "normal",
|
|
3630
|
-
"& .MuiTypography-root": {
|
|
3631
|
-
whiteSpace: "normal",
|
|
3632
|
-
overflow: "visible",
|
|
3633
|
-
textOverflow: "unset"
|
|
3634
|
-
}
|
|
3635
|
-
}
|
|
3636
|
-
}
|
|
3637
|
-
))
|
|
3638
|
-
));
|
|
3639
|
-
})()
|
|
3640
|
-
}]
|
|
3641
|
-
}
|
|
3642
|
-
)
|
|
3643
|
-
)
|
|
2899
|
+
))
|
|
2900
|
+
));
|
|
2901
|
+
})()
|
|
2902
|
+
}]
|
|
2903
|
+
}
|
|
2904
|
+
))
|
|
3644
2905
|
);
|
|
3645
2906
|
}))));
|
|
3646
2907
|
};
|
|
3647
2908
|
|
|
3648
2909
|
// src/Components/Calendario/Views/WeekView.tsx
|
|
3649
|
-
var
|
|
3650
|
-
var
|
|
2910
|
+
var import_react26 = __toESM(require("react"), 1);
|
|
2911
|
+
var import_material20 = require("@mui/material");
|
|
3651
2912
|
var import_dayjs5 = __toESM(require("dayjs"), 1);
|
|
3652
2913
|
var import_localeData2 = __toESM(require("dayjs/plugin/localeData"), 1);
|
|
3653
2914
|
import_dayjs5.default.extend(import_localeData2.default);
|
|
3654
|
-
var WeekView = ({
|
|
3655
|
-
events,
|
|
3656
|
-
currentDate,
|
|
3657
|
-
isLoading,
|
|
3658
|
-
onDayClick,
|
|
3659
|
-
onEventClick,
|
|
3660
|
-
onEventHover,
|
|
3661
|
-
startHour = 0,
|
|
3662
|
-
endHour = 23
|
|
3663
|
-
}) => {
|
|
3664
|
-
const noEvents = events.length === 0;
|
|
3665
|
-
const todayString = (0, import_dayjs5.default)().format("YYYY-MM-DD");
|
|
2915
|
+
var WeekView = ({ events, currentDate, onDayClick, onEventClick }) => {
|
|
3666
2916
|
const startOfWeek2 = currentDate.startOf("week");
|
|
3667
2917
|
const days = Array.from({ length: 7 }, (_, i) => startOfWeek2.add(i, "day"));
|
|
3668
|
-
const
|
|
2918
|
+
const hours2 = Array.from({ length: 24 }, (_, i) => i);
|
|
3669
2919
|
const getCellBorderType = (cellHour, dayEvents) => {
|
|
3670
2920
|
for (const event2 of dayEvents) {
|
|
3671
2921
|
const start = event2.start.hour() + event2.start.minute() / 60;
|
|
@@ -3673,7 +2923,8 @@ var WeekView = ({
|
|
|
3673
2923
|
const cellStart = cellHour;
|
|
3674
2924
|
const cellEnd = cellHour + 1;
|
|
3675
2925
|
if (cellEnd > start && cellStart < end) {
|
|
3676
|
-
if (Math.abs(cellStart - start) < 0.01 && Math.abs(cellEnd - end) < 0.01)
|
|
2926
|
+
if (Math.abs(cellStart - start) < 0.01 && Math.abs(cellEnd - end) < 0.01)
|
|
2927
|
+
return "full";
|
|
3677
2928
|
if (Math.abs(cellStart - start) < 0.01) return "start";
|
|
3678
2929
|
if (Math.abs(cellEnd - end) < 0.01) return "end";
|
|
3679
2930
|
return "middle";
|
|
@@ -3681,122 +2932,92 @@ var WeekView = ({
|
|
|
3681
2932
|
}
|
|
3682
2933
|
return "none";
|
|
3683
2934
|
};
|
|
3684
|
-
return /* @__PURE__ */
|
|
3685
|
-
|
|
3686
|
-
|
|
3687
|
-
|
|
2935
|
+
return /* @__PURE__ */ import_react26.default.createElement(import_material20.Box, { display: "flex", flexDirection: "column", height: "100%" }, /* @__PURE__ */ import_react26.default.createElement(import_material20.Box, { display: "flex", bgcolor: "background.default" }, /* @__PURE__ */ import_react26.default.createElement(import_material20.Box, { width: 45, bgcolor: "background.default" }), days.map((day) => /* @__PURE__ */ import_react26.default.createElement(
|
|
2936
|
+
import_material20.Box,
|
|
2937
|
+
{
|
|
2938
|
+
key: day.toString(),
|
|
2939
|
+
height: 40,
|
|
2940
|
+
flex: 1,
|
|
2941
|
+
pl: 0.5,
|
|
2942
|
+
textAlign: "center",
|
|
2943
|
+
display: "flex",
|
|
2944
|
+
flexDirection: "column",
|
|
2945
|
+
justifyContent: "center",
|
|
2946
|
+
alignItems: "flex-start"
|
|
2947
|
+
},
|
|
2948
|
+
/* @__PURE__ */ import_react26.default.createElement(import_material20.Typography, { variant: "caption", color: "text.secondary" }, day.format("dddd"))
|
|
2949
|
+
))), /* @__PURE__ */ import_react26.default.createElement(import_material20.Box, { display: "flex", flex: 1 }, /* @__PURE__ */ import_react26.default.createElement(import_material20.Box, { width: 45, bgcolor: "background.default" }, hours2.map((h) => /* @__PURE__ */ import_react26.default.createElement(
|
|
2950
|
+
import_material20.Box,
|
|
2951
|
+
{
|
|
2952
|
+
key: h,
|
|
2953
|
+
height: 60,
|
|
2954
|
+
textAlign: "right",
|
|
2955
|
+
pr: 1,
|
|
2956
|
+
borderTop: "1px solid",
|
|
2957
|
+
borderColor: "divider"
|
|
2958
|
+
},
|
|
2959
|
+
/* @__PURE__ */ import_react26.default.createElement(import_material20.Typography, { variant: "caption", color: "text.secondary" }, (0, import_dayjs5.default)().hour(h).format("h A"))
|
|
2960
|
+
))), days.map((day) => {
|
|
2961
|
+
const dayEvents = events.filter(
|
|
2962
|
+
(event2) => day.isBetween(event2.start.startOf("day"), event2.end.endOf("day"), null, "[]")
|
|
2963
|
+
);
|
|
2964
|
+
return /* @__PURE__ */ import_react26.default.createElement(
|
|
2965
|
+
import_material20.Box,
|
|
3688
2966
|
{
|
|
3689
2967
|
key: day.toString(),
|
|
3690
|
-
height: 40,
|
|
3691
2968
|
flex: 1,
|
|
3692
|
-
|
|
3693
|
-
|
|
3694
|
-
|
|
3695
|
-
|
|
3696
|
-
|
|
3697
|
-
alignItems: "flex-start",
|
|
3698
|
-
bgcolor: isToday2 ? "primary.100" : "transparent",
|
|
3699
|
-
borderRadius: isToday2 ? "6px 6px 0 0" : "0",
|
|
3700
|
-
borderBottom: isToday2 ? 2 : 0,
|
|
3701
|
-
borderColor: isToday2 ? "primary.main" : "transparent"
|
|
3702
|
-
},
|
|
3703
|
-
/* @__PURE__ */ import_react33.default.createElement(import_material21.Typography, { variant: "h6", color: "text.primary" }, day.format("D")),
|
|
3704
|
-
/* @__PURE__ */ import_react33.default.createElement(import_material21.Typography, { variant: "caption", color: "text.secondary" }, day.format("dddd"))
|
|
3705
|
-
);
|
|
3706
|
-
})), isLoading ? /* @__PURE__ */ import_react33.default.createElement(import_material21.Box, { display: "flex", alignItems: "center", justifyContent: "center", width: "100%", height: "450px" }, /* @__PURE__ */ import_react33.default.createElement(import_material21.CircularProgress, { sx: { width: "60px", height: "60px" }, variant: "indeterminate" })) : !isLoading && noEvents ? /* @__PURE__ */ import_react33.default.createElement(
|
|
3707
|
-
EmptyState,
|
|
3708
|
-
{
|
|
3709
|
-
title: "Inicia la gesti\xF3n de las actividades",
|
|
3710
|
-
subtitle: "Selecciona un mec\xE1nico y as\xEDgnale las actividades a realizar.",
|
|
3711
|
-
icon: /* @__PURE__ */ import_react33.default.createElement(LogoCalendario, null)
|
|
3712
|
-
}
|
|
3713
|
-
) : (
|
|
3714
|
-
// Grid de horas y eventos
|
|
3715
|
-
/* @__PURE__ */ import_react33.default.createElement(import_material21.Box, { display: "flex", flex: 1 }, /* @__PURE__ */ import_react33.default.createElement(import_material21.Box, { width: 45, bgcolor: "transparent" }, hours.map((h) => /* @__PURE__ */ import_react33.default.createElement(
|
|
3716
|
-
import_material21.Box,
|
|
3717
|
-
{
|
|
3718
|
-
key: h,
|
|
3719
|
-
height: 60,
|
|
3720
|
-
textAlign: "right",
|
|
3721
|
-
pr: 1,
|
|
3722
|
-
borderColor: "divider"
|
|
2969
|
+
borderLeft: "1px solid",
|
|
2970
|
+
borderColor: "divider",
|
|
2971
|
+
position: "relative",
|
|
2972
|
+
"data-testid": `week-day-column-${day.format("YYYY-MM-DD")}`,
|
|
2973
|
+
onClick: () => onDayClick == null ? void 0 : onDayClick(day)
|
|
3723
2974
|
},
|
|
3724
|
-
|
|
3725
|
-
|
|
3726
|
-
|
|
3727
|
-
|
|
3728
|
-
|
|
3729
|
-
|
|
3730
|
-
|
|
3731
|
-
|
|
3732
|
-
|
|
3733
|
-
|
|
3734
|
-
|
|
3735
|
-
|
|
3736
|
-
|
|
3737
|
-
|
|
3738
|
-
|
|
3739
|
-
|
|
3740
|
-
|
|
3741
|
-
|
|
3742
|
-
|
|
3743
|
-
|
|
3744
|
-
|
|
3745
|
-
|
|
3746
|
-
|
|
3747
|
-
|
|
3748
|
-
|
|
3749
|
-
|
|
3750
|
-
|
|
3751
|
-
|
|
3752
|
-
|
|
3753
|
-
|
|
3754
|
-
|
|
3755
|
-
|
|
3756
|
-
}),
|
|
3757
|
-
dayEvents.map((event2) => {
|
|
3758
|
-
const eventStart = day.isSame(event2.start, "day") ? event2.start : day.startOf("day").hour(startHour).minute(0);
|
|
3759
|
-
const eventEnd = day.isSame(event2.end, "day") ? event2.end : day.endOf("day").hour(endHour).minute(59);
|
|
3760
|
-
const startMinutes = (eventStart.hour() - startHour) * 60 + eventStart.minute();
|
|
3761
|
-
const durationMinutes = eventEnd.diff(eventStart, "minute");
|
|
3762
|
-
return /* @__PURE__ */ import_react33.default.createElement(
|
|
3763
|
-
CalendarEventCard,
|
|
3764
|
-
{
|
|
3765
|
-
key: `${event2.id}-${day.toString()}`,
|
|
3766
|
-
event: event2,
|
|
3767
|
-
color: stateColors[event2.state],
|
|
3768
|
-
onClick: () => onEventClick == null ? void 0 : onEventClick(event2, day),
|
|
3769
|
-
onHover: onEventHover,
|
|
3770
|
-
sx: {
|
|
3771
|
-
position: "absolute",
|
|
3772
|
-
top: `${startMinutes}px`,
|
|
3773
|
-
left: 4,
|
|
3774
|
-
right: 4,
|
|
3775
|
-
cursor: "pointer",
|
|
3776
|
-
height: `${durationMinutes}px`
|
|
3777
|
-
}
|
|
2975
|
+
hours2.map((hourIdx) => {
|
|
2976
|
+
const borderType = getCellBorderType(hourIdx, dayEvents);
|
|
2977
|
+
return /* @__PURE__ */ import_react26.default.createElement(
|
|
2978
|
+
import_material20.Box,
|
|
2979
|
+
{
|
|
2980
|
+
key: hourIdx,
|
|
2981
|
+
height: 60,
|
|
2982
|
+
borderTop: "1px solid",
|
|
2983
|
+
borderColor: borderType === "start" || borderType === "full" || borderType === "none" ? "divider" : "transparent",
|
|
2984
|
+
borderBottom: borderType === "end" || borderType === "full" ? "1px solid divider" : void 0
|
|
2985
|
+
}
|
|
2986
|
+
);
|
|
2987
|
+
}),
|
|
2988
|
+
dayEvents.map((event2) => {
|
|
2989
|
+
const eventStart = day.isSame(event2.start, "day") ? event2.start : day.startOf("day").hour(0).minute(0);
|
|
2990
|
+
const eventEnd = day.isSame(event2.end, "day") ? event2.end : day.endOf("day").hour(23).minute(59);
|
|
2991
|
+
const startMinutes = eventStart.hour() * 60 + eventStart.minute();
|
|
2992
|
+
const durationMinutes = eventEnd.diff(eventStart, "minute");
|
|
2993
|
+
return /* @__PURE__ */ import_react26.default.createElement(
|
|
2994
|
+
CalendarEventCard,
|
|
2995
|
+
{
|
|
2996
|
+
key: `${event2.id}-${day.toString()}`,
|
|
2997
|
+
event: event2,
|
|
2998
|
+
color: stateColors[event2.state],
|
|
2999
|
+
onClick: () => onEventClick == null ? void 0 : onEventClick(event2, day),
|
|
3000
|
+
sx: {
|
|
3001
|
+
position: "absolute",
|
|
3002
|
+
top: `${startMinutes + 15}px`,
|
|
3003
|
+
left: 4,
|
|
3004
|
+
right: 4,
|
|
3005
|
+
cursor: "pointer",
|
|
3006
|
+
height: "auto"
|
|
3778
3007
|
}
|
|
3779
|
-
|
|
3780
|
-
|
|
3781
|
-
)
|
|
3782
|
-
|
|
3783
|
-
));
|
|
3008
|
+
}
|
|
3009
|
+
);
|
|
3010
|
+
})
|
|
3011
|
+
);
|
|
3012
|
+
})));
|
|
3784
3013
|
};
|
|
3785
3014
|
|
|
3786
3015
|
// src/Components/Calendario/Views/DayView.tsx
|
|
3787
|
-
var
|
|
3788
|
-
var
|
|
3016
|
+
var import_react27 = __toESM(require("react"), 1);
|
|
3017
|
+
var import_material21 = require("@mui/material");
|
|
3789
3018
|
var import_dayjs6 = __toESM(require("dayjs"), 1);
|
|
3790
|
-
var
|
|
3791
|
-
|
|
3792
|
-
currentDate,
|
|
3793
|
-
isLoading,
|
|
3794
|
-
onEventClick,
|
|
3795
|
-
onEventHover,
|
|
3796
|
-
startHour = 0,
|
|
3797
|
-
endHour = 24
|
|
3798
|
-
}) => {
|
|
3799
|
-
const hours = Array.from({ length: endHour - startHour + 1 }, (_, i) => startHour + i);
|
|
3019
|
+
var hours = Array.from({ length: 24 }, (_, i) => i);
|
|
3020
|
+
var DayView = ({ events, currentDate, onEventClick }) => {
|
|
3800
3021
|
const getCellBorderType = (cellHour, dayEvents2) => {
|
|
3801
3022
|
for (const event2 of dayEvents2) {
|
|
3802
3023
|
const start = event2.start.hour() + event2.start.minute() / 60;
|
|
@@ -3804,7 +3025,8 @@ var DayView = ({
|
|
|
3804
3025
|
const cellStart = cellHour;
|
|
3805
3026
|
const cellEnd = cellHour + 1;
|
|
3806
3027
|
if (cellEnd > start && cellStart < end) {
|
|
3807
|
-
if (Math.abs(cellStart - start) < 0.01 && Math.abs(cellEnd - end) < 0.01)
|
|
3028
|
+
if (Math.abs(cellStart - start) < 0.01 && Math.abs(cellEnd - end) < 0.01)
|
|
3029
|
+
return "full";
|
|
3808
3030
|
if (Math.abs(cellStart - start) < 0.01) return "start";
|
|
3809
3031
|
if (Math.abs(cellEnd - end) < 0.01) return "end";
|
|
3810
3032
|
return "middle";
|
|
@@ -3815,16 +3037,21 @@ var DayView = ({
|
|
|
3815
3037
|
const dayEvents = events.filter(
|
|
3816
3038
|
(event2) => currentDate.isBetween(event2.start.startOf("day"), event2.end.endOf("day"), null, "[]")
|
|
3817
3039
|
);
|
|
3818
|
-
|
|
3819
|
-
|
|
3820
|
-
EmptyState,
|
|
3040
|
+
return /* @__PURE__ */ import_react27.default.createElement(import_material21.Box, { display: "flex", flexDirection: "column", height: "100%" }, /* @__PURE__ */ import_react27.default.createElement(import_material21.Box, { display: "flex", borderBottom: "1px solid", borderColor: "primary.main", bgcolor: "background.paper" }, /* @__PURE__ */ import_react27.default.createElement(import_material21.Box, { width: 47, bgcolor: "background.default", borderBottom: "1px solid", borderColor: "transparent" }), /* @__PURE__ */ import_react27.default.createElement(
|
|
3041
|
+
import_material21.Box,
|
|
3821
3042
|
{
|
|
3822
|
-
|
|
3823
|
-
|
|
3824
|
-
|
|
3825
|
-
|
|
3826
|
-
|
|
3827
|
-
|
|
3043
|
+
flex: 1,
|
|
3044
|
+
display: "flex",
|
|
3045
|
+
flexDirection: "column",
|
|
3046
|
+
textAlign: "start",
|
|
3047
|
+
gap: 0.5,
|
|
3048
|
+
py: 1,
|
|
3049
|
+
bgcolor: "primary.50"
|
|
3050
|
+
},
|
|
3051
|
+
/* @__PURE__ */ import_react27.default.createElement(import_material21.Typography, { variant: "h6", color: "text.secondary" }, currentDate.format("D")),
|
|
3052
|
+
/* @__PURE__ */ import_react27.default.createElement(import_material21.Typography, { variant: "caption", color: "text.secondary" }, currentDate.format("dddd"))
|
|
3053
|
+
)), /* @__PURE__ */ import_react27.default.createElement(import_material21.Box, { display: "flex", flex: 1 }, /* @__PURE__ */ import_react27.default.createElement(import_material21.Box, { width: 47, bgcolor: "background.default" }, hours.map((h) => /* @__PURE__ */ import_react27.default.createElement(
|
|
3054
|
+
import_material21.Box,
|
|
3828
3055
|
{
|
|
3829
3056
|
key: h,
|
|
3830
3057
|
height: 60,
|
|
@@ -3834,11 +3061,11 @@ var DayView = ({
|
|
|
3834
3061
|
borderRight: "1px solid",
|
|
3835
3062
|
borderColor: "divider"
|
|
3836
3063
|
},
|
|
3837
|
-
/* @__PURE__ */
|
|
3838
|
-
))), /* @__PURE__ */
|
|
3064
|
+
/* @__PURE__ */ import_react27.default.createElement(import_material21.Typography, { variant: "caption", color: "text.secondary" }, (0, import_dayjs6.default)().hour(h).format("h A"))
|
|
3065
|
+
))), /* @__PURE__ */ import_react27.default.createElement(import_material21.Box, { flex: 1, position: "relative" }, hours.map((hourIdx) => {
|
|
3839
3066
|
const borderType = getCellBorderType(hourIdx, dayEvents);
|
|
3840
|
-
return /* @__PURE__ */
|
|
3841
|
-
|
|
3067
|
+
return /* @__PURE__ */ import_react27.default.createElement(
|
|
3068
|
+
import_material21.Box,
|
|
3842
3069
|
{
|
|
3843
3070
|
key: hourIdx,
|
|
3844
3071
|
height: 60,
|
|
@@ -3848,26 +3075,20 @@ var DayView = ({
|
|
|
3848
3075
|
}
|
|
3849
3076
|
);
|
|
3850
3077
|
}), dayEvents.map((event2) => {
|
|
3851
|
-
const eventStart = currentDate.isSame(event2.start, "day") ? event2.start : currentDate.startOf("day");
|
|
3852
|
-
const eventEnd = currentDate.isSame(event2.end, "day") ? event2.end : currentDate.endOf("day");
|
|
3853
|
-
const
|
|
3854
|
-
const
|
|
3855
|
-
|
|
3856
|
-
const clampedEnd = eventEnd.isAfter(maxEnd) ? maxEnd : eventEnd;
|
|
3857
|
-
const startMinutes = (clampedStart.hour() - startHour) * 60 + clampedStart.minute();
|
|
3858
|
-
const durationMinutes = clampedEnd.diff(clampedStart, "minute");
|
|
3859
|
-
return /* @__PURE__ */ import_react34.default.createElement(
|
|
3078
|
+
const eventStart = currentDate.isSame(event2.start, "day") ? event2.start : currentDate.startOf("day").hour(0).minute(0);
|
|
3079
|
+
const eventEnd = currentDate.isSame(event2.end, "day") ? event2.end : currentDate.endOf("day").hour(23).minute(59);
|
|
3080
|
+
const startMinutes = eventStart.hour() * 60 + eventStart.minute();
|
|
3081
|
+
const durationMinutes = eventEnd.diff(eventStart, "minute");
|
|
3082
|
+
return /* @__PURE__ */ import_react27.default.createElement(
|
|
3860
3083
|
CalendarEventCard,
|
|
3861
3084
|
{
|
|
3862
3085
|
key: `${event2.id}-${currentDate.toString()}`,
|
|
3863
3086
|
event: event2,
|
|
3864
3087
|
color: stateColors[event2.state],
|
|
3865
|
-
onClick: () => onEventClick == null ? void 0 : onEventClick(event2
|
|
3866
|
-
onHover: onEventHover,
|
|
3088
|
+
onClick: () => onEventClick == null ? void 0 : onEventClick(event2),
|
|
3867
3089
|
sx: {
|
|
3868
3090
|
position: "absolute",
|
|
3869
|
-
top: `${startMinutes}px`,
|
|
3870
|
-
height: `${durationMinutes}px`,
|
|
3091
|
+
top: `${startMinutes + 15}px`,
|
|
3871
3092
|
left: 4,
|
|
3872
3093
|
right: 4
|
|
3873
3094
|
}
|
|
@@ -3877,23 +3098,17 @@ var DayView = ({
|
|
|
3877
3098
|
};
|
|
3878
3099
|
|
|
3879
3100
|
// src/Components/Calendario/Calendar.tsx
|
|
3880
|
-
var import_dayjs7 = __toESM(require("dayjs"), 1);
|
|
3881
3101
|
var Calendar = ({
|
|
3882
3102
|
events,
|
|
3883
3103
|
onDayClick,
|
|
3884
3104
|
onMoreClick,
|
|
3885
3105
|
onEventClick,
|
|
3886
|
-
onEventHover,
|
|
3887
3106
|
view: initialView = "month",
|
|
3888
3107
|
onViewChange,
|
|
3889
|
-
toolbar
|
|
3890
|
-
isLoading = false,
|
|
3891
|
-
startHour = 0,
|
|
3892
|
-
// <- valor por defecto
|
|
3893
|
-
endHour = 23
|
|
3108
|
+
toolbar
|
|
3894
3109
|
}) => {
|
|
3895
|
-
const [view, setView] = (0,
|
|
3896
|
-
const [currentDate, setCurrentDate] = (0,
|
|
3110
|
+
const [view, setView] = (0, import_react28.useState)(initialView);
|
|
3111
|
+
const [currentDate, setCurrentDate] = (0, import_react28.useState)((0, import_dayjs7.default)());
|
|
3897
3112
|
const handleViewChange = (newView) => {
|
|
3898
3113
|
setView(newView);
|
|
3899
3114
|
onViewChange == null ? void 0 : onViewChange(newView);
|
|
@@ -3901,18 +3116,12 @@ var Calendar = ({
|
|
|
3901
3116
|
const handleNavigate = (action) => {
|
|
3902
3117
|
let newDate = currentDate;
|
|
3903
3118
|
const unit = view === "month" ? "month" : "day";
|
|
3904
|
-
if (action === "PREV")
|
|
3905
|
-
|
|
3906
|
-
|
|
3907
|
-
if (view === "month") newDate = currentDate.subtract(1, "month");
|
|
3908
|
-
} else if (action === "NEXT") {
|
|
3909
|
-
if (view === "day") newDate = currentDate.add(1, "day");
|
|
3910
|
-
if (view === "week") newDate = currentDate.add(1, "week");
|
|
3911
|
-
if (view === "month") newDate = currentDate.add(1, "month");
|
|
3912
|
-
} else if (action === "TODAY") newDate = (0, import_dayjs7.default)();
|
|
3119
|
+
if (action === "PREV") newDate = currentDate.subtract(1, unit);
|
|
3120
|
+
else if (action === "NEXT") newDate = currentDate.add(1, unit);
|
|
3121
|
+
else if (action === "TODAY") newDate = (0, import_dayjs7.default)();
|
|
3913
3122
|
setCurrentDate(newDate);
|
|
3914
3123
|
};
|
|
3915
|
-
return /* @__PURE__ */
|
|
3124
|
+
return /* @__PURE__ */ import_react28.default.createElement(import_material22.Box, null, /* @__PURE__ */ import_react28.default.createElement(
|
|
3916
3125
|
CalendarToolbar,
|
|
3917
3126
|
{
|
|
3918
3127
|
labelDate: currentDate,
|
|
@@ -3921,281 +3130,40 @@ var Calendar = ({
|
|
|
3921
3130
|
onNavigate: handleNavigate
|
|
3922
3131
|
},
|
|
3923
3132
|
toolbar
|
|
3924
|
-
),
|
|
3925
|
-
import_material23.Box,
|
|
3926
|
-
{
|
|
3927
|
-
display: "flex",
|
|
3928
|
-
justifyContent: "center",
|
|
3929
|
-
alignItems: "center",
|
|
3930
|
-
height: "400px"
|
|
3931
|
-
},
|
|
3932
|
-
/* @__PURE__ */ import_react35.default.createElement(import_material23.CircularProgress, { variant: "indeterminate" })
|
|
3933
|
-
))) : /* @__PURE__ */ import_react35.default.createElement(import_react35.default.Fragment, null, view === "month" && /* @__PURE__ */ import_react35.default.createElement(
|
|
3133
|
+
), view === "month" && /* @__PURE__ */ import_react28.default.createElement(
|
|
3934
3134
|
MonthView,
|
|
3935
3135
|
{
|
|
3936
3136
|
events,
|
|
3937
|
-
currentDate,
|
|
3938
3137
|
onDayClick,
|
|
3939
3138
|
onMoreClick,
|
|
3940
3139
|
onEventClick,
|
|
3941
|
-
|
|
3140
|
+
currentDate
|
|
3942
3141
|
}
|
|
3943
|
-
), view === "week" && /* @__PURE__ */
|
|
3142
|
+
), view === "week" && /* @__PURE__ */ import_react28.default.createElement(
|
|
3944
3143
|
WeekView,
|
|
3945
3144
|
{
|
|
3946
3145
|
events,
|
|
3947
3146
|
currentDate,
|
|
3948
3147
|
onDayClick,
|
|
3949
3148
|
onMoreClick,
|
|
3950
|
-
onEventClick
|
|
3951
|
-
onEventHover,
|
|
3952
|
-
startHour,
|
|
3953
|
-
endHour
|
|
3149
|
+
onEventClick
|
|
3954
3150
|
}
|
|
3955
|
-
), view === "day" && /* @__PURE__ */
|
|
3151
|
+
), view === "day" && /* @__PURE__ */ import_react28.default.createElement(
|
|
3956
3152
|
DayView,
|
|
3957
3153
|
{
|
|
3958
3154
|
events,
|
|
3959
3155
|
currentDate,
|
|
3960
|
-
onEventClick
|
|
3961
|
-
onEventHover,
|
|
3962
|
-
startHour,
|
|
3963
|
-
endHour
|
|
3964
|
-
}
|
|
3965
|
-
)));
|
|
3966
|
-
};
|
|
3967
|
-
|
|
3968
|
-
// src/Components/SCTime.tsx
|
|
3969
|
-
var import_react36 = __toESM(require("react"), 1);
|
|
3970
|
-
var import_material24 = require("@mui/material");
|
|
3971
|
-
var import_LocalizationProvider3 = require("@mui/x-date-pickers/LocalizationProvider");
|
|
3972
|
-
var import_AdapterDayjs2 = require("@mui/x-date-pickers/AdapterDayjs");
|
|
3973
|
-
var import_dayjs8 = __toESM(require("dayjs"), 1);
|
|
3974
|
-
var import_es3 = require("dayjs/locale/es");
|
|
3975
|
-
var import_x_license_pro3 = require("@mui/x-license-pro");
|
|
3976
|
-
var import_AccessTime = __toESM(require("@mui/icons-material/AccessTime"), 1);
|
|
3977
|
-
var import_TimeField = require("@mui/x-date-pickers/TimeField");
|
|
3978
|
-
var import_DigitalClock = require("@mui/x-date-pickers/DigitalClock");
|
|
3979
|
-
var SCTime = ({
|
|
3980
|
-
label = "Hora",
|
|
3981
|
-
required = false,
|
|
3982
|
-
disabled = false,
|
|
3983
|
-
background = "transparent",
|
|
3984
|
-
timeStep = 5,
|
|
3985
|
-
state,
|
|
3986
|
-
setState
|
|
3987
|
-
}) => {
|
|
3988
|
-
import_x_license_pro3.LicenseInfo.setLicenseKey(
|
|
3989
|
-
"77d49a57fbc5f4af35ddb05c5f1742e0Tz0xMTI3MjgsRT0xNzc4MzcxMTk5MDAwLFM9cHJvLExNPXN1YnNjcmlwdGlvbixQVj1RMy0yMDI0LEtWPTI="
|
|
3990
|
-
);
|
|
3991
|
-
const isTimeEmpty = required && !state;
|
|
3992
|
-
const hasError = isTimeEmpty;
|
|
3993
|
-
const [anchorEl, setAnchorEl] = (0, import_react36.useState)(null);
|
|
3994
|
-
const [isOpenPopover, setIsOpenPopover] = (0, import_react36.useState)(false);
|
|
3995
|
-
const [popoverPlacement, setPopoverPlacement] = (0, import_react36.useState)("bottom");
|
|
3996
|
-
const detectPlacement = (element) => {
|
|
3997
|
-
const rect = element.getBoundingClientRect();
|
|
3998
|
-
const windowHeight = window.innerHeight;
|
|
3999
|
-
const spaceBelow = windowHeight - rect.bottom;
|
|
4000
|
-
const spaceAbove = rect.top;
|
|
4001
|
-
const popoverHeight = 300;
|
|
4002
|
-
if (spaceBelow < popoverHeight && spaceAbove > spaceBelow) {
|
|
4003
|
-
setPopoverPlacement("top");
|
|
4004
|
-
} else {
|
|
4005
|
-
setPopoverPlacement("bottom");
|
|
4006
|
-
}
|
|
4007
|
-
};
|
|
4008
|
-
const handleTimeFieldClick = (event2) => {
|
|
4009
|
-
if (!disabled) {
|
|
4010
|
-
const target = event2.currentTarget;
|
|
4011
|
-
setAnchorEl(target);
|
|
4012
|
-
detectPlacement(target);
|
|
4013
|
-
setIsOpenPopover(true);
|
|
4014
|
-
}
|
|
4015
|
-
};
|
|
4016
|
-
const handleTimeChange = (newValue) => {
|
|
4017
|
-
const dayjsValue = newValue ? (0, import_dayjs8.default)(newValue) : null;
|
|
4018
|
-
setState(dayjsValue);
|
|
4019
|
-
setIsOpenPopover(false);
|
|
4020
|
-
setAnchorEl(null);
|
|
4021
|
-
};
|
|
4022
|
-
const handleClose = () => {
|
|
4023
|
-
setIsOpenPopover(false);
|
|
4024
|
-
setAnchorEl(null);
|
|
4025
|
-
};
|
|
4026
|
-
return /* @__PURE__ */ import_react36.default.createElement(import_LocalizationProvider3.LocalizationProvider, { dateAdapter: import_AdapterDayjs2.AdapterDayjs }, /* @__PURE__ */ import_react36.default.createElement(import_material24.Box, { sx: { position: "relative", width: "120px" } }, /* @__PURE__ */ import_react36.default.createElement(
|
|
4027
|
-
import_TimeField.TimeField,
|
|
4028
|
-
{
|
|
4029
|
-
label,
|
|
4030
|
-
value: state,
|
|
4031
|
-
disabled,
|
|
4032
|
-
required,
|
|
4033
|
-
error: hasError,
|
|
4034
|
-
onClick: handleTimeFieldClick,
|
|
4035
|
-
slotProps: {
|
|
4036
|
-
textField: {
|
|
4037
|
-
InputProps: {
|
|
4038
|
-
endAdornment: /* @__PURE__ */ import_react36.default.createElement(import_material24.InputAdornment, { position: "end" }, /* @__PURE__ */ import_react36.default.createElement(
|
|
4039
|
-
import_AccessTime.default,
|
|
4040
|
-
{
|
|
4041
|
-
color: disabled ? "disabled" : "action",
|
|
4042
|
-
sx: { cursor: disabled ? "default" : "pointer" },
|
|
4043
|
-
fontSize: "small"
|
|
4044
|
-
}
|
|
4045
|
-
)),
|
|
4046
|
-
sx: {
|
|
4047
|
-
backgroundColor: background,
|
|
4048
|
-
padding: "8px 12px",
|
|
4049
|
-
cursor: disabled ? "default" : "pointer",
|
|
4050
|
-
"& input": {
|
|
4051
|
-
cursor: disabled ? "default" : "pointer"
|
|
4052
|
-
}
|
|
4053
|
-
}
|
|
4054
|
-
}
|
|
4055
|
-
}
|
|
4056
|
-
},
|
|
4057
|
-
sx: {
|
|
4058
|
-
width: "100%",
|
|
4059
|
-
"& .MuiInputBase-input": {
|
|
4060
|
-
cursor: disabled ? "default" : "pointer"
|
|
4061
|
-
},
|
|
4062
|
-
"& .MuiPickersSectionList-root": {
|
|
4063
|
-
padding: "0px !important"
|
|
4064
|
-
}
|
|
4065
|
-
}
|
|
4066
|
-
}
|
|
4067
|
-
), /* @__PURE__ */ import_react36.default.createElement(
|
|
4068
|
-
import_material24.Popover,
|
|
4069
|
-
{
|
|
4070
|
-
open: isOpenPopover,
|
|
4071
|
-
anchorEl,
|
|
4072
|
-
onClose: handleClose,
|
|
4073
|
-
anchorOrigin: {
|
|
4074
|
-
vertical: popoverPlacement === "top" ? "top" : "bottom",
|
|
4075
|
-
horizontal: "left"
|
|
4076
|
-
},
|
|
4077
|
-
transformOrigin: {
|
|
4078
|
-
vertical: popoverPlacement === "top" ? "bottom" : "top",
|
|
4079
|
-
horizontal: "left"
|
|
4080
|
-
},
|
|
4081
|
-
marginThreshold: 0,
|
|
4082
|
-
disableScrollLock: true,
|
|
4083
|
-
slotProps: {
|
|
4084
|
-
paper: {
|
|
4085
|
-
sx: {
|
|
4086
|
-
boxShadow: "0px 4px 20px rgba(0, 0, 0, 0.1)",
|
|
4087
|
-
borderRadius: 1,
|
|
4088
|
-
border: "1px solid #e0e0e0",
|
|
4089
|
-
maxHeight: "300px",
|
|
4090
|
-
overflow: "visible"
|
|
4091
|
-
}
|
|
4092
|
-
}
|
|
4093
|
-
}
|
|
4094
|
-
},
|
|
4095
|
-
/* @__PURE__ */ import_react36.default.createElement(import_material24.ClickAwayListener, { onClickAway: handleClose }, /* @__PURE__ */ import_react36.default.createElement(import_material24.Box, { sx: { p: 0 } }, /* @__PURE__ */ import_react36.default.createElement(
|
|
4096
|
-
import_DigitalClock.DigitalClock,
|
|
4097
|
-
{
|
|
4098
|
-
value: state,
|
|
4099
|
-
onChange: handleTimeChange,
|
|
4100
|
-
timeStep,
|
|
4101
|
-
sx: {
|
|
4102
|
-
"& .MuiList-root": {
|
|
4103
|
-
maxHeight: "250px",
|
|
4104
|
-
overflow: "auto"
|
|
4105
|
-
},
|
|
4106
|
-
"& .MuiMenuItem-root": {
|
|
4107
|
-
fontSize: "0.875rem",
|
|
4108
|
-
py: 0.5
|
|
4109
|
-
}
|
|
4110
|
-
}
|
|
4111
|
-
}
|
|
4112
|
-
)))
|
|
4113
|
-
)));
|
|
4114
|
-
};
|
|
4115
|
-
|
|
4116
|
-
// src/Components/SCCard.tsx
|
|
4117
|
-
var import_react37 = __toESM(require("react"), 1);
|
|
4118
|
-
var import_material25 = require("@mui/material");
|
|
4119
|
-
var import_IconButton = __toESM(require("@mui/material/IconButton"), 1);
|
|
4120
|
-
var import_Card = __toESM(require("@mui/material/Card"), 1);
|
|
4121
|
-
var import_CardHeader = __toESM(require("@mui/material/CardHeader"), 1);
|
|
4122
|
-
var import_CardMedia = __toESM(require("@mui/material/CardMedia"), 1);
|
|
4123
|
-
var import_CardContent = __toESM(require("@mui/material/CardContent"), 1);
|
|
4124
|
-
var import_CardActions = __toESM(require("@mui/material/CardActions"), 1);
|
|
4125
|
-
var import_Collapse = __toESM(require("@mui/material/Collapse"), 1);
|
|
4126
|
-
var import_ExpandMore = __toESM(require("@mui/icons-material/ExpandMore"), 1);
|
|
4127
|
-
var Muicon8 = __toESM(require("@mui/icons-material"), 1);
|
|
4128
|
-
var SCCard = ({ title, image, iconTitle, actionsTitle, subtitle, content, actions, expand }) => {
|
|
4129
|
-
let iconTitleValidation = "";
|
|
4130
|
-
let IconTitle;
|
|
4131
|
-
const [expanded, setExpanded] = import_react37.default.useState(false);
|
|
4132
|
-
if (iconTitle) {
|
|
4133
|
-
if (Muicon8[iconTitle] == void 0) {
|
|
4134
|
-
if (iconTitle && import_react37.default.isValidElement(iconTitle) && iconTitle.type == void 0) {
|
|
4135
|
-
iconTitleValidation = "image";
|
|
4136
|
-
IconTitle = iconTitle;
|
|
4137
|
-
} else {
|
|
4138
|
-
iconTitleValidation = "icon";
|
|
4139
|
-
IconTitle = iconTitle;
|
|
4140
|
-
}
|
|
4141
|
-
} else {
|
|
4142
|
-
iconTitleValidation = "icon";
|
|
4143
|
-
IconTitle = Muicon8[iconTitle];
|
|
4144
|
-
}
|
|
4145
|
-
}
|
|
4146
|
-
const handleExpandClick = () => {
|
|
4147
|
-
setExpanded(!expanded);
|
|
4148
|
-
};
|
|
4149
|
-
return /* @__PURE__ */ import_react37.default.createElement(import_Card.default, { sx: { maxWidth: 345 } }, title && /* @__PURE__ */ import_react37.default.createElement(
|
|
4150
|
-
import_CardHeader.default,
|
|
4151
|
-
{
|
|
4152
|
-
avatar: iconTitle ? iconTitleValidation === "image" ? /* @__PURE__ */ import_react37.default.createElement(import_material25.Box, { sx: { marginRight: "16px", width: "44px", height: "44px", borderRadius: "1px" } }, /* @__PURE__ */ import_react37.default.createElement("img", { src: IconTitle, width: "44px", height: "44px" })) : /* @__PURE__ */ import_react37.default.createElement(import_material25.SvgIcon, { color: "action", fontSize: "small", component: IconTitle, sx: { marginRight: "16px" } }) : void 0,
|
|
4153
|
-
action: (expand == null ? void 0 : expand.position) == "top" ? (expand == null ? void 0 : expand.type) === "text" ? /* @__PURE__ */ import_react37.default.createElement(import_material25.Button, { onClick: handleExpandClick, sx: { marginRight: "auto" } }, "Expandir") : (expand == null ? void 0 : expand.type) === "icon" && /* @__PURE__ */ import_react37.default.createElement(import_IconButton.default, { onClick: handleExpandClick, sx: { marginRight: "auto" }, size: "small" }, /* @__PURE__ */ import_react37.default.createElement(import_ExpandMore.default, { fontSize: "small" })) : actionsTitle,
|
|
4154
|
-
title,
|
|
4155
|
-
subheader: subtitle,
|
|
4156
|
-
sx: {
|
|
4157
|
-
"& .MuiCardHeader-title": {
|
|
4158
|
-
fontSize: "14px",
|
|
4159
|
-
color: "text.primary"
|
|
4160
|
-
},
|
|
4161
|
-
"& .MuiCardHeader-subheader": {
|
|
4162
|
-
fontSize: "13px",
|
|
4163
|
-
color: "text.secondary"
|
|
4164
|
-
},
|
|
4165
|
-
"& .MuiCardHeader-action": {
|
|
4166
|
-
height: "40px !important",
|
|
4167
|
-
display: "flex",
|
|
4168
|
-
alignItems: "center"
|
|
4169
|
-
}
|
|
4170
|
-
}
|
|
4171
|
-
}
|
|
4172
|
-
), image && /* @__PURE__ */ import_react37.default.createElement(
|
|
4173
|
-
import_CardMedia.default,
|
|
4174
|
-
{
|
|
4175
|
-
component: "img",
|
|
4176
|
-
height: "194",
|
|
4177
|
-
image
|
|
3156
|
+
onEventClick
|
|
4178
3157
|
}
|
|
4179
|
-
)
|
|
4180
|
-
import_material25.Button,
|
|
4181
|
-
{
|
|
4182
|
-
key: index,
|
|
4183
|
-
size: "small",
|
|
4184
|
-
color: action.color || "primary",
|
|
4185
|
-
variant: action.variant || "text",
|
|
4186
|
-
onClick: action.fn,
|
|
4187
|
-
disabled: action.disabled || false
|
|
4188
|
-
},
|
|
4189
|
-
action.text
|
|
4190
|
-
)) : ""), expand && /* @__PURE__ */ import_react37.default.createElement(import_Collapse.default, { in: expanded, timeout: "auto", unmountOnExit: true }, /* @__PURE__ */ import_react37.default.createElement(import_CardContent.default, { sx: { padding: "8px 16px !important" } }, expand.content)));
|
|
3158
|
+
));
|
|
4191
3159
|
};
|
|
4192
3160
|
|
|
4193
3161
|
// src/Theme/index.ts
|
|
4194
3162
|
var import_styles3 = require("@mui/material/styles");
|
|
4195
3163
|
|
|
4196
3164
|
// src/Theme/components.ts
|
|
4197
|
-
var
|
|
4198
|
-
var
|
|
3165
|
+
var import_react29 = __toESM(require("react"), 1);
|
|
3166
|
+
var import_icons_material11 = require("@mui/icons-material");
|
|
4199
3167
|
var components = {
|
|
4200
3168
|
MuiSelect: {
|
|
4201
3169
|
styleOverrides: {
|
|
@@ -4892,10 +3860,10 @@ var components = {
|
|
|
4892
3860
|
MuiAlert: {
|
|
4893
3861
|
defaultProps: {
|
|
4894
3862
|
iconMapping: {
|
|
4895
|
-
success:
|
|
4896
|
-
error:
|
|
4897
|
-
warning:
|
|
4898
|
-
info:
|
|
3863
|
+
success: import_react29.default.createElement(import_icons_material11.CheckCircleRounded),
|
|
3864
|
+
error: import_react29.default.createElement(import_icons_material11.ErrorRounded),
|
|
3865
|
+
warning: import_react29.default.createElement(import_icons_material11.WarningRounded),
|
|
3866
|
+
info: import_react29.default.createElement(import_icons_material11.InfoRounded)
|
|
4899
3867
|
}
|
|
4900
3868
|
},
|
|
4901
3869
|
variants: [
|
|
@@ -5937,7 +4905,6 @@ var ADCSincoTheme = (0, import_styles3.createTheme)(__spreadValues({}, ADCTheme)
|
|
|
5937
4905
|
0 && (module.exports = {
|
|
5938
4906
|
ADCSincoTheme,
|
|
5939
4907
|
AdproSincoTheme,
|
|
5940
|
-
Attachment,
|
|
5941
4908
|
Calendar,
|
|
5942
4909
|
EmptyState,
|
|
5943
4910
|
FooterAction,
|
|
@@ -5945,7 +4912,6 @@ var ADCSincoTheme = (0, import_styles3.createTheme)(__spreadValues({}, ADCTheme)
|
|
|
5945
4912
|
PageHeader,
|
|
5946
4913
|
SCAutocomplete,
|
|
5947
4914
|
SCCalendarSwipeable,
|
|
5948
|
-
SCCard,
|
|
5949
4915
|
SCDataGrid,
|
|
5950
4916
|
SCDataGridInitial,
|
|
5951
4917
|
SCDateRange,
|
|
@@ -5957,7 +4923,6 @@ var ADCSincoTheme = (0, import_styles3.createTheme)(__spreadValues({}, ADCTheme)
|
|
|
5957
4923
|
SCTabs,
|
|
5958
4924
|
SCTextArea,
|
|
5959
4925
|
SCTextField,
|
|
5960
|
-
SCTime,
|
|
5961
4926
|
SCToastNotification,
|
|
5962
4927
|
SincoTheme,
|
|
5963
4928
|
ToastProgress,
|