componentes-sinco 1.0.25 → 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 -1985
- 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 -1928
- 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,773 +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
|
-
setFiles(initialFiles);
|
|
488
|
-
}
|
|
489
|
-
}, []);
|
|
490
|
-
const handleDrop = (event2) => {
|
|
491
|
-
event2.preventDefault();
|
|
492
|
-
setIsDragFile(false);
|
|
493
|
-
const filesDropped = event2.dataTransfer.files;
|
|
494
|
-
if (filesDropped && filesDropped.length > 0) {
|
|
495
|
-
const fakeEvent = {
|
|
496
|
-
target: { files: filesDropped }
|
|
497
|
-
};
|
|
498
|
-
handleUpload(fakeEvent);
|
|
499
|
-
}
|
|
500
|
-
};
|
|
501
|
-
const handleDragOver = (event2) => {
|
|
502
|
-
event2.preventDefault();
|
|
503
|
-
setIsDragFile(true);
|
|
504
|
-
};
|
|
505
|
-
const handleDragLeave = (event2) => {
|
|
506
|
-
event2.preventDefault();
|
|
507
|
-
setIsDragFile(false);
|
|
508
|
-
};
|
|
509
|
-
const handleUpload = (event2) => {
|
|
510
|
-
const newFiles = event2.target.files;
|
|
511
|
-
if (!newFiles) return;
|
|
512
|
-
const nuevosArchivos = [];
|
|
513
|
-
const archivosValidos = [];
|
|
514
|
-
Array.from(newFiles).forEach((file) => {
|
|
515
|
-
const isDuplicatedFile = files.findIndex(
|
|
516
|
-
(e) => e.name === file.name && e.size === file.size
|
|
517
|
-
);
|
|
518
|
-
const sizeMB = file.size / (1024 * 1024);
|
|
519
|
-
if (isDuplicatedFile !== -1) {
|
|
520
|
-
setToast({
|
|
521
|
-
type: "error",
|
|
522
|
-
title: "Archivo duplicado",
|
|
523
|
-
listITems: ["No se permiten archivos duplicados."],
|
|
524
|
-
seeMore: true,
|
|
525
|
-
time: 10
|
|
526
|
-
});
|
|
527
|
-
return;
|
|
528
|
-
}
|
|
529
|
-
if (sizeMB > maxSize) {
|
|
530
|
-
nuevosArchivos.push({
|
|
531
|
-
name: file.name,
|
|
532
|
-
size: file.size,
|
|
533
|
-
type: file.type,
|
|
534
|
-
progress: 0,
|
|
535
|
-
uploadError: true
|
|
536
|
-
});
|
|
537
|
-
setToast({
|
|
538
|
-
type: "error",
|
|
539
|
-
title: "Carga fallida",
|
|
540
|
-
seeMore: true,
|
|
541
|
-
listITems: [`El archivo supera el l\xEDmite de ${maxSize}MB.`],
|
|
542
|
-
time: 10
|
|
543
|
-
});
|
|
544
|
-
return;
|
|
545
|
-
}
|
|
546
|
-
if (fileAccepted && !file.name.match(
|
|
547
|
-
new RegExp(
|
|
548
|
-
`(${fileAccepted.replace(/\./g, "\\.").replace(/,/g, "|")})$`,
|
|
549
|
-
"i"
|
|
550
|
-
)
|
|
551
|
-
)) {
|
|
552
|
-
setToast({
|
|
553
|
-
type: "error",
|
|
554
|
-
title: "Tipo de archivo no permitido",
|
|
555
|
-
listITems: [`El archivo ${file.name} no es un tipo permitido.`],
|
|
556
|
-
seeMore: true,
|
|
557
|
-
time: 10
|
|
558
|
-
});
|
|
559
|
-
return;
|
|
560
|
-
}
|
|
561
|
-
nuevosArchivos.push({
|
|
562
|
-
name: file.name,
|
|
563
|
-
size: file.size,
|
|
564
|
-
type: file.type,
|
|
565
|
-
progress: 0,
|
|
566
|
-
uploadError: false
|
|
567
|
-
});
|
|
568
|
-
archivosValidos.push(file);
|
|
569
|
-
});
|
|
570
|
-
if (nuevosArchivos.length > 0) {
|
|
571
|
-
setFiles((prev) => {
|
|
572
|
-
const actualizados = [...prev, ...nuevosArchivos];
|
|
573
|
-
onChange == null ? void 0 : onChange([
|
|
574
|
-
...archivosValidos,
|
|
575
|
-
...prev.map((f) => new File([], f.name, { type: f.type }))
|
|
576
|
-
]);
|
|
577
|
-
return actualizados;
|
|
578
|
-
});
|
|
579
|
-
}
|
|
580
|
-
event2.target.value = "";
|
|
581
|
-
};
|
|
582
|
-
const deleteFiles = (nameFile) => {
|
|
583
|
-
setFiles((prev) => {
|
|
584
|
-
const filtered = prev.filter((e) => e.name !== nameFile);
|
|
585
|
-
onChange == null ? void 0 : onChange(
|
|
586
|
-
filtered.map((f) => new File([], f.name, { type: f.type }))
|
|
587
|
-
);
|
|
588
|
-
return filtered;
|
|
589
|
-
});
|
|
590
|
-
};
|
|
591
|
-
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(
|
|
592
|
-
"input",
|
|
593
|
-
{
|
|
594
|
-
type: "file",
|
|
595
|
-
multiple: true,
|
|
596
|
-
hidden: true,
|
|
597
|
-
ref: inputRef,
|
|
598
|
-
onChange: handleUpload
|
|
599
|
-
}
|
|
600
|
-
), /* @__PURE__ */ import_react5.default.createElement(
|
|
601
|
-
import_material3.Stack,
|
|
602
|
-
{
|
|
603
|
-
id: "ZonaAdjuntos",
|
|
604
|
-
justifyContent: "center",
|
|
605
|
-
alignItems: "center",
|
|
606
|
-
bgcolor: "transparent",
|
|
607
|
-
padding: compact ? "12px 16px" : "16px 24px",
|
|
608
|
-
height: compact ? "56px" : "100%",
|
|
609
|
-
flexDirection: compact ? "row" : "column",
|
|
610
|
-
gap: 1,
|
|
611
|
-
borderRadius: 1,
|
|
612
|
-
onClick: () => {
|
|
613
|
-
var _a;
|
|
614
|
-
return (_a = inputRef.current) == null ? void 0 : _a.click();
|
|
615
|
-
},
|
|
616
|
-
onDrop: handleDrop,
|
|
617
|
-
onDragOver: handleDragOver,
|
|
618
|
-
onDragLeave: handleDragLeave,
|
|
619
|
-
sx: __spreadValues({
|
|
620
|
-
border: error ? (theme) => `1px solid ${theme.palette.error.main}` : (theme) => `1px dashed ${theme.palette.grey[500]}`,
|
|
621
|
-
cursor: "pointer",
|
|
622
|
-
":hover": {
|
|
623
|
-
backgroundColor: error ? "error.50" : "action.hover"
|
|
624
|
-
}
|
|
625
|
-
}, sx)
|
|
626
|
-
},
|
|
627
|
-
onLoading ? /* @__PURE__ */ import_react5.default.createElement(
|
|
628
|
-
import_material3.Box,
|
|
629
|
-
{
|
|
630
|
-
display: "flex",
|
|
631
|
-
alignItems: "center",
|
|
632
|
-
justifyContent: "center",
|
|
633
|
-
width: "100%",
|
|
634
|
-
height: "450px"
|
|
635
|
-
},
|
|
636
|
-
/* @__PURE__ */ import_react5.default.createElement(
|
|
637
|
-
import_material3.CircularProgress,
|
|
638
|
-
{
|
|
639
|
-
sx: { width: "60px", height: "60px" },
|
|
640
|
-
variant: "indeterminate"
|
|
641
|
-
}
|
|
642
|
-
)
|
|
643
|
-
) : /* @__PURE__ */ import_react5.default.createElement(import_react5.default.Fragment, null, /* @__PURE__ */ import_react5.default.createElement(
|
|
644
|
-
import_material3.Box,
|
|
645
|
-
{
|
|
646
|
-
display: "flex",
|
|
647
|
-
bgcolor: error ? "error.50" : "primary.50",
|
|
648
|
-
borderRadius: "100%",
|
|
649
|
-
p: 1
|
|
650
|
-
},
|
|
651
|
-
/* @__PURE__ */ import_react5.default.createElement(
|
|
652
|
-
import_icons_material5.CloudUploadOutlined,
|
|
653
|
-
{
|
|
654
|
-
color: error ? "error" : "primary",
|
|
655
|
-
fontSize: "medium"
|
|
656
|
-
}
|
|
657
|
-
)
|
|
658
|
-
), /* @__PURE__ */ import_react5.default.createElement(
|
|
659
|
-
import_material3.Stack,
|
|
660
|
-
{
|
|
661
|
-
width: "100%",
|
|
662
|
-
flexDirection: compact ? "row" : "column",
|
|
663
|
-
alignItems: "center",
|
|
664
|
-
justifyContent: compact ? "space-between" : "center",
|
|
665
|
-
gap: 1
|
|
666
|
-
},
|
|
667
|
-
/* @__PURE__ */ import_react5.default.createElement(
|
|
668
|
-
import_material3.Stack,
|
|
669
|
-
{
|
|
670
|
-
flexDirection: "column",
|
|
671
|
-
alignItems: compact ? "start" : "center",
|
|
672
|
-
gap: 0.5
|
|
673
|
-
},
|
|
674
|
-
/* @__PURE__ */ import_react5.default.createElement(import_material3.Typography, { variant: "body2", color: "text.primary" }, "Arrastrar o adjuntar archivos"),
|
|
675
|
-
/* @__PURE__ */ import_react5.default.createElement(
|
|
676
|
-
import_material3.Typography,
|
|
677
|
-
{
|
|
678
|
-
variant: "caption",
|
|
679
|
-
color: error ? "error" : "text.secondary",
|
|
680
|
-
whiteSpace: "nowrap",
|
|
681
|
-
overflow: "hidden",
|
|
682
|
-
textOverflow: "ellipsis",
|
|
683
|
-
maxWidth: "450px"
|
|
684
|
-
},
|
|
685
|
-
error ? `${fileAccepted || "DOCX, XML, PNG, JPG"} \u2022 Archivo no soportado` : `${fileAccepted || "DOCX, XML, PNG, JPG"} \u2022 Max. ${maxSize}MB`
|
|
686
|
-
)
|
|
687
|
-
),
|
|
688
|
-
/* @__PURE__ */ import_react5.default.createElement(
|
|
689
|
-
import_material3.Button,
|
|
690
|
-
{
|
|
691
|
-
variant: "text",
|
|
692
|
-
color: "primary",
|
|
693
|
-
size: "small",
|
|
694
|
-
startIcon: /* @__PURE__ */ import_react5.default.createElement(import_icons_material5.AttachFileOutlined, { color: "primary", fontSize: "small" })
|
|
695
|
-
},
|
|
696
|
-
"Adjuntar"
|
|
697
|
-
)
|
|
698
|
-
))
|
|
699
|
-
), files.length > 0 && /* @__PURE__ */ import_react5.default.createElement(
|
|
700
|
-
import_material3.Stack,
|
|
701
|
-
{
|
|
702
|
-
id: "ContenedorArchivosAdjuntos",
|
|
703
|
-
width: "100%",
|
|
704
|
-
sx: __spreadValues({
|
|
705
|
-
overflowY: "auto"
|
|
706
|
-
}, files.length > 5 && {
|
|
707
|
-
maxHeight: 250
|
|
708
|
-
}),
|
|
709
|
-
spacing: 1
|
|
710
|
-
},
|
|
711
|
-
files.map((file) => /* @__PURE__ */ import_react5.default.createElement(
|
|
712
|
-
import_material3.Stack,
|
|
713
|
-
{
|
|
714
|
-
height: 46,
|
|
715
|
-
key: file.name + (file.uploadError ? "_error" : ""),
|
|
716
|
-
direction: "row",
|
|
717
|
-
alignItems: "center",
|
|
718
|
-
justifyContent: "space-between",
|
|
719
|
-
gap: 2,
|
|
720
|
-
padding: 1,
|
|
721
|
-
borderRadius: 1,
|
|
722
|
-
sx: {
|
|
723
|
-
backgroundColor: file.uploadError ? "error.50" : "transparent",
|
|
724
|
-
":hover": {
|
|
725
|
-
backgroundColor: file.uploadError ? "error.100" : "primary.50"
|
|
726
|
-
}
|
|
727
|
-
}
|
|
728
|
-
},
|
|
729
|
-
/* @__PURE__ */ import_react5.default.createElement(import_material3.Stack, { direction: "row", alignItems: "center", gap: 1, width: "100%" }, /* @__PURE__ */ import_react5.default.createElement(
|
|
730
|
-
import_icons_material5.UploadFileOutlined,
|
|
731
|
-
{
|
|
732
|
-
color: file.uploadError ? "error" : "primary",
|
|
733
|
-
fontSize: "small"
|
|
734
|
-
}
|
|
735
|
-
), /* @__PURE__ */ import_react5.default.createElement(import_material3.Stack, { width: "100%" }, /* @__PURE__ */ import_react5.default.createElement(
|
|
736
|
-
import_material3.Typography,
|
|
737
|
-
{
|
|
738
|
-
variant: "body2",
|
|
739
|
-
color: "text.primary",
|
|
740
|
-
whiteSpace: "nowrap",
|
|
741
|
-
overflow: "hidden",
|
|
742
|
-
textOverflow: "ellipsis",
|
|
743
|
-
maxWidth: "310px"
|
|
744
|
-
},
|
|
745
|
-
file.name
|
|
746
|
-
), /* @__PURE__ */ import_react5.default.createElement(
|
|
747
|
-
import_material3.Typography,
|
|
748
|
-
{
|
|
749
|
-
variant: "caption",
|
|
750
|
-
color: file.uploadError ? "error" : "text.secondary"
|
|
751
|
-
},
|
|
752
|
-
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}`
|
|
753
|
-
))),
|
|
754
|
-
/* @__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" }))),
|
|
755
|
-
/* @__PURE__ */ import_react5.default.createElement(import_material3.Tooltip, { title: "Eliminar" }, /* @__PURE__ */ import_react5.default.createElement(
|
|
756
|
-
import_material3.IconButton,
|
|
757
|
-
{
|
|
758
|
-
size: "small",
|
|
759
|
-
onClick: () => {
|
|
760
|
-
setFileToDelete(file);
|
|
761
|
-
setOpenModal(true);
|
|
762
|
-
}
|
|
763
|
-
},
|
|
764
|
-
/* @__PURE__ */ import_react5.default.createElement(import_icons_material5.DeleteOutline, { fontSize: "small", color: "action" })
|
|
765
|
-
))
|
|
766
|
-
))
|
|
767
|
-
), /* @__PURE__ */ import_react5.default.createElement(
|
|
768
|
-
SCModal,
|
|
769
|
-
{
|
|
770
|
-
state: "delete",
|
|
771
|
-
open: openModal,
|
|
772
|
-
setOpen: setOpenModal,
|
|
773
|
-
title: "Eliminar archivo",
|
|
774
|
-
description: `\xBFEst\xE1s seguro que deseas eliminar "${fileToDelete == null ? void 0 : fileToDelete.name}"?`,
|
|
775
|
-
action: [
|
|
776
|
-
{
|
|
777
|
-
text: "Eliminar",
|
|
778
|
-
fn: () => __async(void 0, null, function* () {
|
|
779
|
-
if (fileToDelete) {
|
|
780
|
-
try {
|
|
781
|
-
if (deleteAction) {
|
|
782
|
-
yield deleteAction(fileToDelete.name);
|
|
783
|
-
}
|
|
784
|
-
deleteFiles(fileToDelete.name);
|
|
785
|
-
setToast({
|
|
786
|
-
title: "Archivo eliminado",
|
|
787
|
-
type: "success",
|
|
788
|
-
time: 2
|
|
789
|
-
});
|
|
790
|
-
} catch (error2) {
|
|
791
|
-
setToast({
|
|
792
|
-
title: "Error al eliminar archivo",
|
|
793
|
-
type: "error",
|
|
794
|
-
time: 4
|
|
795
|
-
});
|
|
796
|
-
} finally {
|
|
797
|
-
setFileToDelete(null);
|
|
798
|
-
setOpenModal(false);
|
|
799
|
-
}
|
|
800
|
-
}
|
|
801
|
-
})
|
|
802
|
-
}
|
|
803
|
-
]
|
|
804
|
-
}
|
|
805
|
-
));
|
|
806
|
-
};
|
|
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);
|
|
807
97
|
|
|
808
98
|
// src/Components/Drawer/SCDrawer.tsx
|
|
809
|
-
var
|
|
810
|
-
var
|
|
99
|
+
var import_react8 = __toESM(require("react"), 1);
|
|
100
|
+
var import_material7 = require("@mui/material");
|
|
811
101
|
var import_Grid23 = __toESM(require("@mui/material/Grid2"), 1);
|
|
812
102
|
var import_Close = __toESM(require("@mui/icons-material/Close"), 1);
|
|
813
|
-
var import_ArrowBackIos = __toESM(require("@mui/icons-material/ArrowBackIos"), 1);
|
|
814
|
-
var import_ArrowForwardIos = __toESM(require("@mui/icons-material/ArrowForwardIos"), 1);
|
|
815
103
|
|
|
816
104
|
// src/Components/Textfield/SCTextField.tsx
|
|
817
|
-
var
|
|
818
|
-
var
|
|
105
|
+
var import_react = __toESM(require("react"), 1);
|
|
106
|
+
var import_material = require("@mui/material");
|
|
819
107
|
var import_Grid2 = __toESM(require("@mui/material/Grid2"), 1);
|
|
820
|
-
var
|
|
108
|
+
var import_icons_material = require("@mui/icons-material");
|
|
821
109
|
|
|
822
110
|
// src/Components/Textfield/Helpers/validateIcon.tsx
|
|
823
111
|
var Muicon = __toESM(require("@mui/icons-material"), 1);
|
|
824
|
-
function
|
|
112
|
+
function getIconComponent(name) {
|
|
825
113
|
if (typeof name !== "string") return name;
|
|
826
114
|
return name in Muicon ? Muicon[name] : void 0;
|
|
827
115
|
}
|
|
@@ -893,23 +181,23 @@ var SCTextField = ({
|
|
|
893
181
|
onKeyDown
|
|
894
182
|
}) => {
|
|
895
183
|
const inputComponents = {
|
|
896
|
-
outlined:
|
|
897
|
-
filled:
|
|
898
|
-
standard:
|
|
184
|
+
outlined: import_material.OutlinedInput,
|
|
185
|
+
filled: import_material.FilledInput,
|
|
186
|
+
standard: import_material.Input
|
|
899
187
|
};
|
|
900
|
-
const InputComponent = inputComponents[variant] ||
|
|
188
|
+
const InputComponent = inputComponents[variant] || import_material.OutlinedInput;
|
|
901
189
|
let IconInputStartValidation;
|
|
902
190
|
let IconInputEndValidation;
|
|
903
191
|
let IconInputStart;
|
|
904
192
|
let IconInputEnd;
|
|
905
193
|
let IconTitle;
|
|
906
|
-
const [showPassword, setShowPassword] = (0,
|
|
907
|
-
const [error, setError] = (0,
|
|
908
|
-
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);
|
|
909
197
|
const openInfoTitle = Boolean(anchorInfoTitle);
|
|
910
|
-
const [anchorInfoElement, setAnchorInfoElement] = (0,
|
|
198
|
+
const [anchorInfoElement, setAnchorInfoElement] = (0, import_react.useState)(null);
|
|
911
199
|
const openInfoElement = Boolean(anchorInfoElement);
|
|
912
|
-
(0,
|
|
200
|
+
(0, import_react.useEffect)(() => {
|
|
913
201
|
if (error) {
|
|
914
202
|
setTimeout(() => {
|
|
915
203
|
setError(false);
|
|
@@ -918,14 +206,14 @@ var SCTextField = ({
|
|
|
918
206
|
}, [error]);
|
|
919
207
|
if (iconInputStart) {
|
|
920
208
|
IconInputStartValidation = getIconValidation(iconInputStart);
|
|
921
|
-
IconInputStart =
|
|
209
|
+
IconInputStart = getIconComponent(iconInputStart);
|
|
922
210
|
}
|
|
923
211
|
if (iconInputEnd) {
|
|
924
212
|
IconInputEndValidation = getIconValidation(iconInputEnd);
|
|
925
|
-
IconInputEnd =
|
|
213
|
+
IconInputEnd = getIconComponent(iconInputEnd);
|
|
926
214
|
}
|
|
927
215
|
if (iconTitle) {
|
|
928
|
-
IconTitle =
|
|
216
|
+
IconTitle = getIconComponent(iconTitle);
|
|
929
217
|
}
|
|
930
218
|
const handleClickShowPassword = () => setShowPassword((show) => !show);
|
|
931
219
|
const handleMouseDownPassword = (event2) => {
|
|
@@ -959,16 +247,16 @@ var SCTextField = ({
|
|
|
959
247
|
const handleCloseInfoElement = () => {
|
|
960
248
|
setAnchorInfoElement(null);
|
|
961
249
|
};
|
|
962
|
-
return /* @__PURE__ */
|
|
963
|
-
|
|
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,
|
|
964
252
|
{
|
|
965
253
|
color: "action",
|
|
966
254
|
fontSize: "small",
|
|
967
255
|
onMouseEnter: (event2) => handleOpenInfoTitle(event2),
|
|
968
256
|
onMouseLeave: () => handleCloseInfoTitle()
|
|
969
257
|
}
|
|
970
|
-
), /* @__PURE__ */
|
|
971
|
-
|
|
258
|
+
), /* @__PURE__ */ import_react.default.createElement(
|
|
259
|
+
import_material.Popover,
|
|
972
260
|
{
|
|
973
261
|
sx: {
|
|
974
262
|
pointerEvents: "none",
|
|
@@ -989,15 +277,15 @@ var SCTextField = ({
|
|
|
989
277
|
},
|
|
990
278
|
disableRestoreFocus: true
|
|
991
279
|
},
|
|
992
|
-
/* @__PURE__ */
|
|
993
|
-
)) : /* @__PURE__ */
|
|
994
|
-
|
|
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,
|
|
995
283
|
{
|
|
996
284
|
color: "action",
|
|
997
285
|
fontSize: "small"
|
|
998
286
|
}
|
|
999
|
-
))) : ""), /* @__PURE__ */
|
|
1000
|
-
|
|
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,
|
|
1001
289
|
{
|
|
1002
290
|
color,
|
|
1003
291
|
fullWidth: true,
|
|
@@ -1005,8 +293,8 @@ var SCTextField = ({
|
|
|
1005
293
|
variant,
|
|
1006
294
|
sx: { background: background || "transparent", borderRadius: "4px" }
|
|
1007
295
|
},
|
|
1008
|
-
/* @__PURE__ */
|
|
1009
|
-
|
|
296
|
+
/* @__PURE__ */ import_react.default.createElement(
|
|
297
|
+
import_material.InputLabel,
|
|
1010
298
|
{
|
|
1011
299
|
"data-testid": "test-label",
|
|
1012
300
|
htmlFor: "",
|
|
@@ -1016,7 +304,7 @@ var SCTextField = ({
|
|
|
1016
304
|
},
|
|
1017
305
|
label ? label : ""
|
|
1018
306
|
),
|
|
1019
|
-
/* @__PURE__ */
|
|
307
|
+
/* @__PURE__ */ import_react.default.createElement(
|
|
1020
308
|
InputComponent,
|
|
1021
309
|
{
|
|
1022
310
|
size: size ? size : "medium",
|
|
@@ -1032,18 +320,18 @@ var SCTextField = ({
|
|
|
1032
320
|
type: !showPassword && format2 === "password" ? "password" : (format2 || "text").toUpperCase() === "INT" || (format2 || "text").toUpperCase() === "DECIMAL" ? "number" : "text",
|
|
1033
321
|
className: format2 === "password" && !showPassword ? "" : "",
|
|
1034
322
|
placeholder,
|
|
1035
|
-
startAdornment: iconInputStart ? /* @__PURE__ */
|
|
1036
|
-
endAdornment: /* @__PURE__ */
|
|
1037
|
-
|
|
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,
|
|
1038
326
|
{
|
|
1039
327
|
"aria-label": "toggle password visibility",
|
|
1040
328
|
onClick: handleClickShowPassword,
|
|
1041
329
|
onMouseDown: handleMouseDownPassword,
|
|
1042
330
|
edge: "end"
|
|
1043
331
|
},
|
|
1044
|
-
showPassword ? /* @__PURE__ */
|
|
1045
|
-
) : iconInputEnd === void 0 && infoElement !== void 0 ? /* @__PURE__ */
|
|
1046
|
-
|
|
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,
|
|
1047
335
|
{
|
|
1048
336
|
"data-testid": "test-infoElement",
|
|
1049
337
|
sx: { ml: 0.5 },
|
|
@@ -1053,8 +341,8 @@ var SCTextField = ({
|
|
|
1053
341
|
onMouseEnter: (event2) => handleOpenInfoElement(event2),
|
|
1054
342
|
onMouseLeave: () => handleCloseInfoElement()
|
|
1055
343
|
}
|
|
1056
|
-
), /* @__PURE__ */
|
|
1057
|
-
|
|
344
|
+
), /* @__PURE__ */ import_react.default.createElement(
|
|
345
|
+
import_material.Popover,
|
|
1058
346
|
{
|
|
1059
347
|
sx: {
|
|
1060
348
|
pointerEvents: "none",
|
|
@@ -1075,20 +363,20 @@ var SCTextField = ({
|
|
|
1075
363
|
},
|
|
1076
364
|
disableRestoreFocus: true
|
|
1077
365
|
},
|
|
1078
|
-
/* @__PURE__ */
|
|
1079
|
-
)) : /* @__PURE__ */
|
|
1080
|
-
|
|
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,
|
|
1081
369
|
{
|
|
1082
370
|
color: "action",
|
|
1083
371
|
fontSize: "small"
|
|
1084
372
|
}
|
|
1085
|
-
))) : 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 : ""),
|
|
1086
374
|
label: label ? label + (format2 === "password" && !showPassword ? "" : "") : "",
|
|
1087
375
|
autoComplete: format2 === "password" ? "new-password" : "off"
|
|
1088
376
|
}
|
|
1089
377
|
)
|
|
1090
|
-
), (iconInputEnd !== void 0 || format2 === "password") && infoElement ? /* @__PURE__ */
|
|
1091
|
-
|
|
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,
|
|
1092
380
|
{
|
|
1093
381
|
"data-testid": "test-infoElement",
|
|
1094
382
|
component: "svg",
|
|
@@ -1098,8 +386,8 @@ var SCTextField = ({
|
|
|
1098
386
|
onMouseEnter: (event2) => handleOpenInfoElement(event2),
|
|
1099
387
|
onMouseLeave: handleCloseInfoElement
|
|
1100
388
|
}
|
|
1101
|
-
), /* @__PURE__ */
|
|
1102
|
-
|
|
389
|
+
), /* @__PURE__ */ import_react.default.createElement(
|
|
390
|
+
import_material.Popover,
|
|
1103
391
|
{
|
|
1104
392
|
sx: { pointerEvents: "none" },
|
|
1105
393
|
open: openInfoElement,
|
|
@@ -1115,9 +403,9 @@ var SCTextField = ({
|
|
|
1115
403
|
},
|
|
1116
404
|
disableRestoreFocus: true
|
|
1117
405
|
},
|
|
1118
|
-
/* @__PURE__ */
|
|
1119
|
-
)) : /* @__PURE__ */
|
|
1120
|
-
|
|
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,
|
|
1121
409
|
{
|
|
1122
410
|
sx: { marginLeft: "4px" },
|
|
1123
411
|
color: "action",
|
|
@@ -1126,19 +414,199 @@ var SCTextField = ({
|
|
|
1126
414
|
))) : ""));
|
|
1127
415
|
};
|
|
1128
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
|
+
|
|
1129
597
|
// src/Components/TextArea/Helpers/validateIcon.tsx
|
|
1130
|
-
var
|
|
598
|
+
var MuiIcons = __toESM(require("@mui/icons-material"), 1);
|
|
1131
599
|
function getIcon(name) {
|
|
1132
|
-
if (!name || !(name in
|
|
600
|
+
if (!name || !(name in MuiIcons)) {
|
|
1133
601
|
return null;
|
|
1134
602
|
}
|
|
1135
|
-
return
|
|
603
|
+
return MuiIcons[name];
|
|
1136
604
|
}
|
|
1137
605
|
|
|
1138
606
|
// src/Components/TextArea/SCTextArea.tsx
|
|
1139
|
-
var
|
|
1140
|
-
var
|
|
1141
|
-
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");
|
|
1142
610
|
var SCTextArea = ({
|
|
1143
611
|
//informativas
|
|
1144
612
|
title,
|
|
@@ -1160,11 +628,11 @@ var SCTextArea = ({
|
|
|
1160
628
|
state,
|
|
1161
629
|
onBlur
|
|
1162
630
|
}) => {
|
|
1163
|
-
const [helperCount, setHelperCount] = (0,
|
|
1164
|
-
const [stateError, setStateError] = (0,
|
|
1165
|
-
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);
|
|
1166
634
|
const openInfoTitle = Boolean(anchorInfoTitle);
|
|
1167
|
-
(0,
|
|
635
|
+
(0, import_react4.useEffect)(() => {
|
|
1168
636
|
setHelperCount(state == null ? void 0 : state.length);
|
|
1169
637
|
}, [state]);
|
|
1170
638
|
const IconTitle = getIcon(iconTitle);
|
|
@@ -1186,16 +654,16 @@ var SCTextArea = ({
|
|
|
1186
654
|
const handleCloseInfoTitle = () => {
|
|
1187
655
|
setAnchorInfoTitle(null);
|
|
1188
656
|
};
|
|
1189
|
-
return /* @__PURE__ */
|
|
1190
|
-
|
|
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,
|
|
1191
659
|
{
|
|
1192
660
|
color: "action",
|
|
1193
661
|
fontSize: "small",
|
|
1194
662
|
onMouseEnter: (event2) => handleOpenInfoTitle(event2),
|
|
1195
663
|
onMouseLeave: () => handleCloseInfoTitle()
|
|
1196
664
|
}
|
|
1197
|
-
), /* @__PURE__ */
|
|
1198
|
-
|
|
665
|
+
), /* @__PURE__ */ import_react4.default.createElement(
|
|
666
|
+
import_material3.Popover,
|
|
1199
667
|
{
|
|
1200
668
|
sx: { pointerEvents: "none" },
|
|
1201
669
|
open: openInfoTitle,
|
|
@@ -1211,15 +679,15 @@ var SCTextArea = ({
|
|
|
1211
679
|
},
|
|
1212
680
|
disableRestoreFocus: true
|
|
1213
681
|
},
|
|
1214
|
-
/* @__PURE__ */
|
|
1215
|
-
)) : /* @__PURE__ */
|
|
1216
|
-
|
|
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,
|
|
1217
685
|
{
|
|
1218
686
|
color: "action",
|
|
1219
687
|
fontSize: "small"
|
|
1220
688
|
}
|
|
1221
|
-
))) : ""), /* @__PURE__ */
|
|
1222
|
-
|
|
689
|
+
))) : ""), /* @__PURE__ */ import_react4.default.createElement(import_material3.Stack, null, /* @__PURE__ */ import_react4.default.createElement(
|
|
690
|
+
import_material3.TextField,
|
|
1223
691
|
{
|
|
1224
692
|
required,
|
|
1225
693
|
placeholder,
|
|
@@ -1240,8 +708,8 @@ var SCTextArea = ({
|
|
|
1240
708
|
},
|
|
1241
709
|
autoComplete: "off"
|
|
1242
710
|
}
|
|
1243
|
-
)), /* @__PURE__ */
|
|
1244
|
-
|
|
711
|
+
)), /* @__PURE__ */ import_react4.default.createElement(import_material3.Stack, null, /* @__PURE__ */ import_react4.default.createElement(
|
|
712
|
+
import_material3.Typography,
|
|
1245
713
|
{
|
|
1246
714
|
variant: "caption",
|
|
1247
715
|
color: "text.secondary",
|
|
@@ -1254,8 +722,8 @@ var SCTextArea = ({
|
|
|
1254
722
|
};
|
|
1255
723
|
|
|
1256
724
|
// src/Components/SCSelect.tsx
|
|
1257
|
-
var
|
|
1258
|
-
var
|
|
725
|
+
var import_react5 = __toESM(require("react"), 1);
|
|
726
|
+
var import_material4 = require("@mui/material");
|
|
1259
727
|
var import_Select = __toESM(require("@mui/material/Select"), 1);
|
|
1260
728
|
var Muicon2 = __toESM(require("@mui/icons-material"), 1);
|
|
1261
729
|
function SCSelect({
|
|
@@ -1265,23 +733,25 @@ function SCSelect({
|
|
|
1265
733
|
width = "100%",
|
|
1266
734
|
size = "small",
|
|
1267
735
|
variant = "outlined",
|
|
1268
|
-
|
|
736
|
+
deleteType = "button",
|
|
1269
737
|
required,
|
|
1270
738
|
disabled,
|
|
739
|
+
background,
|
|
740
|
+
fnAplicar,
|
|
1271
741
|
setState,
|
|
1272
742
|
state
|
|
1273
743
|
}) {
|
|
1274
744
|
const labelContent = `<span style="color: red;">* </span>` + label;
|
|
1275
|
-
const [prevData, setPrevData] =
|
|
1276
|
-
const [error, setError] =
|
|
1277
|
-
(0,
|
|
745
|
+
const [prevData, setPrevData] = import_react5.default.useState(data);
|
|
746
|
+
const [error, setError] = import_react5.default.useState(false);
|
|
747
|
+
(0, import_react5.useEffect)(() => {
|
|
1278
748
|
if (error) {
|
|
1279
749
|
setTimeout(() => {
|
|
1280
750
|
setError(false);
|
|
1281
751
|
}, 1e3);
|
|
1282
752
|
}
|
|
1283
753
|
}, [error]);
|
|
1284
|
-
(0,
|
|
754
|
+
(0, import_react5.useEffect)(() => {
|
|
1285
755
|
let dataChangeValidation = JSON.stringify(prevData) === JSON.stringify(data);
|
|
1286
756
|
if (dataChangeValidation == false) {
|
|
1287
757
|
setState({ hiddenValue: "", textValue: "" });
|
|
@@ -1315,25 +785,25 @@ function SCSelect({
|
|
|
1315
785
|
}
|
|
1316
786
|
}
|
|
1317
787
|
};
|
|
1318
|
-
return /* @__PURE__ */
|
|
1319
|
-
|
|
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,
|
|
1320
790
|
{
|
|
1321
791
|
fullWidth: true,
|
|
1322
792
|
size: size ? size : "medium",
|
|
1323
793
|
variant
|
|
1324
794
|
},
|
|
1325
|
-
/* @__PURE__ */
|
|
1326
|
-
|
|
795
|
+
/* @__PURE__ */ import_react5.default.createElement(
|
|
796
|
+
import_material4.InputLabel,
|
|
1327
797
|
{
|
|
1328
798
|
error
|
|
1329
799
|
},
|
|
1330
|
-
required ? /* @__PURE__ */
|
|
800
|
+
required ? /* @__PURE__ */ import_react5.default.createElement("span", { dangerouslySetInnerHTML: { __html: labelContent } }) : label
|
|
1331
801
|
),
|
|
1332
|
-
/* @__PURE__ */
|
|
802
|
+
/* @__PURE__ */ import_react5.default.createElement(
|
|
1333
803
|
import_Select.default,
|
|
1334
804
|
{
|
|
1335
805
|
value: Array.isArray(state.hiddenValue) ? state.hiddenValue[0] || "" : state.hiddenValue != "-1" ? state.hiddenValue : "",
|
|
1336
|
-
label: required ? /* @__PURE__ */
|
|
806
|
+
label: required ? /* @__PURE__ */ import_react5.default.createElement("span", { dangerouslySetInnerHTML: { __html: labelContent } }) : label,
|
|
1337
807
|
onChange: handleChange,
|
|
1338
808
|
onBlur: handleBlur,
|
|
1339
809
|
variant,
|
|
@@ -1342,34 +812,28 @@ function SCSelect({
|
|
|
1342
812
|
MenuProps: {
|
|
1343
813
|
PaperProps: {
|
|
1344
814
|
sx: {
|
|
1345
|
-
|
|
1346
|
-
minWidth: "100%"
|
|
815
|
+
left: "0px !important"
|
|
1347
816
|
}
|
|
1348
817
|
},
|
|
1349
|
-
|
|
1350
|
-
|
|
1351
|
-
|
|
1352
|
-
|
|
1353
|
-
|
|
1354
|
-
vertical: "top",
|
|
1355
|
-
horizontal: "left"
|
|
1356
|
-
},
|
|
1357
|
-
disableAutoFocusItem: true,
|
|
1358
|
-
marginThreshold: 0
|
|
818
|
+
sx: {
|
|
819
|
+
"& .MuiPaper-root": {
|
|
820
|
+
left: "0px !important"
|
|
821
|
+
}
|
|
822
|
+
}
|
|
1359
823
|
}
|
|
1360
824
|
},
|
|
1361
825
|
data.map((option, index) => {
|
|
1362
|
-
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" }));
|
|
1363
827
|
})
|
|
1364
828
|
)
|
|
1365
829
|
)));
|
|
1366
830
|
}
|
|
1367
831
|
|
|
1368
832
|
// src/Components/SCAutocomplete.tsx
|
|
1369
|
-
var
|
|
1370
|
-
var
|
|
833
|
+
var import_react6 = __toESM(require("react"), 1);
|
|
834
|
+
var import_material5 = require("@mui/material");
|
|
1371
835
|
var import_Grid22 = __toESM(require("@mui/material/Grid2"), 1);
|
|
1372
|
-
var
|
|
836
|
+
var import_icons_material4 = require("@mui/icons-material");
|
|
1373
837
|
var Muicon3 = __toESM(require("@mui/icons-material"), 1);
|
|
1374
838
|
function SCAutocomplete({
|
|
1375
839
|
label = "",
|
|
@@ -1387,16 +851,17 @@ function SCAutocomplete({
|
|
|
1387
851
|
state,
|
|
1388
852
|
inputChange,
|
|
1389
853
|
maxCheck
|
|
854
|
+
// Agregar el parámetro maxCheck
|
|
1390
855
|
}) {
|
|
1391
856
|
const labelContent = `<span style="color: red;">* </span>` + label;
|
|
1392
857
|
let group = "";
|
|
1393
858
|
let isSelected = false;
|
|
1394
|
-
const [selectedOptions, setSelectedOptions] =
|
|
1395
|
-
const [prevData, setPrevData] =
|
|
1396
|
-
const [originalData, setOriginalData] =
|
|
1397
|
-
const [inputValue, setInputValue] =
|
|
1398
|
-
const [isUserTyping, setIsUserTyping] =
|
|
1399
|
-
(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)(() => {
|
|
1400
865
|
const dataChangeValidation = JSON.stringify(prevData) === JSON.stringify(data);
|
|
1401
866
|
if (!dataChangeValidation && !isUserTyping) {
|
|
1402
867
|
setState({ hiddenValue: "-1", textValue: "" });
|
|
@@ -1407,7 +872,7 @@ function SCAutocomplete({
|
|
|
1407
872
|
}
|
|
1408
873
|
setPrevData(data);
|
|
1409
874
|
}, [data, isUserTyping]);
|
|
1410
|
-
(0,
|
|
875
|
+
(0, import_react6.useEffect)(() => {
|
|
1411
876
|
if (typeFormat == "multiselect") {
|
|
1412
877
|
if (state.hiddenValue != "-1" && Array.isArray(state.hiddenValue)) {
|
|
1413
878
|
const newSelectedOptions = originalData.filter(
|
|
@@ -1417,7 +882,7 @@ function SCAutocomplete({
|
|
|
1417
882
|
}
|
|
1418
883
|
}
|
|
1419
884
|
}, [state.hiddenValue, originalData, typeFormat]);
|
|
1420
|
-
(0,
|
|
885
|
+
(0, import_react6.useEffect)(() => {
|
|
1421
886
|
if (inputValue === "") {
|
|
1422
887
|
setIsUserTyping(false);
|
|
1423
888
|
}
|
|
@@ -1475,12 +940,11 @@ function SCAutocomplete({
|
|
|
1475
940
|
const selectedValue = typeFormat === "multiselect" ? selectedOptions : originalData.find(
|
|
1476
941
|
(item) => getItemValue(item).value === state.hiddenValue
|
|
1477
942
|
) || null;
|
|
1478
|
-
return /* @__PURE__ */
|
|
1479
|
-
|
|
943
|
+
return /* @__PURE__ */ import_react6.default.createElement(import_react6.default.Fragment, null, data && /* @__PURE__ */ import_react6.default.createElement(
|
|
944
|
+
import_material5.Autocomplete,
|
|
1480
945
|
{
|
|
1481
946
|
multiple: typeFormat === "multiselect",
|
|
1482
947
|
clearOnEscape: true,
|
|
1483
|
-
noOptionsText: "No se encuentra",
|
|
1484
948
|
disabled,
|
|
1485
949
|
options: data,
|
|
1486
950
|
isOptionEqualToValue: (option, value) => getItemValue(option).value === getItemValue(value).value,
|
|
@@ -1502,10 +966,10 @@ function SCAutocomplete({
|
|
|
1502
966
|
limitTags: 2,
|
|
1503
967
|
renderTags: (value, getTagProps) => {
|
|
1504
968
|
const limit = 2;
|
|
1505
|
-
return /* @__PURE__ */
|
|
969
|
+
return /* @__PURE__ */ import_react6.default.createElement(import_react6.default.Fragment, null, value.slice(0, limit).map((option, index) => {
|
|
1506
970
|
const _a = getTagProps({ index }), { key } = _a, chipProps = __objRest(_a, ["key"]);
|
|
1507
|
-
return /* @__PURE__ */
|
|
1508
|
-
|
|
971
|
+
return /* @__PURE__ */ import_react6.default.createElement(
|
|
972
|
+
import_material5.Chip,
|
|
1509
973
|
__spreadProps(__spreadValues({
|
|
1510
974
|
key,
|
|
1511
975
|
color: "default",
|
|
@@ -1516,7 +980,7 @@ function SCAutocomplete({
|
|
|
1516
980
|
style: { maxWidth: 120, overflow: "hidden", textOverflow: "ellipsis", whiteSpace: "nowrap" }
|
|
1517
981
|
})
|
|
1518
982
|
);
|
|
1519
|
-
}), 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}`));
|
|
1520
984
|
},
|
|
1521
985
|
renderOption: (props, option) => {
|
|
1522
986
|
const _a = props, { key } = _a, optionProps = __objRest(_a, ["key"]);
|
|
@@ -1534,8 +998,8 @@ function SCAutocomplete({
|
|
|
1534
998
|
isValid = group == option[columnGroup];
|
|
1535
999
|
group = option[columnGroup];
|
|
1536
1000
|
}
|
|
1537
|
-
return /* @__PURE__ */
|
|
1538
|
-
|
|
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,
|
|
1539
1003
|
__spreadProps(__spreadValues({}, optionProps), {
|
|
1540
1004
|
disabled: isDisabled,
|
|
1541
1005
|
style: {
|
|
@@ -1544,9 +1008,9 @@ function SCAutocomplete({
|
|
|
1544
1008
|
opacity: isDisabled ? 0.5 : 1
|
|
1545
1009
|
}
|
|
1546
1010
|
}),
|
|
1547
|
-
typeFormat != "multiselect" && getItemValue(option).icon != void 0 ? /* @__PURE__ */
|
|
1548
|
-
typeFormat == "multiselect" ? /* @__PURE__ */
|
|
1549
|
-
|
|
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,
|
|
1550
1014
|
{
|
|
1551
1015
|
checked: isSelected,
|
|
1552
1016
|
disabled: isDisabled,
|
|
@@ -1554,25 +1018,25 @@ function SCAutocomplete({
|
|
|
1554
1018
|
color: "primary"
|
|
1555
1019
|
}
|
|
1556
1020
|
) : "",
|
|
1557
|
-
/* @__PURE__ */
|
|
1021
|
+
/* @__PURE__ */ import_react6.default.createElement(import_material5.ListItemText, { primary: getItemValue(option).text, color: "text.primary" }),
|
|
1558
1022
|
getItemValue(option).component != void 0 ? getItemValue(option).component : ""
|
|
1559
1023
|
)));
|
|
1560
1024
|
},
|
|
1561
|
-
renderInput: (params) => /* @__PURE__ */
|
|
1562
|
-
|
|
1025
|
+
renderInput: (params) => /* @__PURE__ */ import_react6.default.createElement(import_react6.default.Fragment, null, /* @__PURE__ */ import_react6.default.createElement(
|
|
1026
|
+
import_material5.TextField,
|
|
1563
1027
|
__spreadProps(__spreadValues({}, params), {
|
|
1564
|
-
label: required ? /* @__PURE__ */
|
|
1028
|
+
label: required ? /* @__PURE__ */ import_react6.default.createElement("span", { dangerouslySetInnerHTML: { __html: labelContent } }) : label,
|
|
1565
1029
|
placeholder: selectedOptions.length == 0 ? "B\xFAsqueda" : "",
|
|
1566
1030
|
InputProps: __spreadProps(__spreadValues({}, params.InputProps), {
|
|
1567
|
-
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" } })))
|
|
1568
1032
|
})
|
|
1569
1033
|
})
|
|
1570
1034
|
)),
|
|
1571
1035
|
slotProps: {
|
|
1572
1036
|
listbox: {
|
|
1573
|
-
component:
|
|
1574
|
-
return /* @__PURE__ */
|
|
1575
|
-
|
|
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,
|
|
1576
1040
|
__spreadProps(__spreadValues({
|
|
1577
1041
|
ref
|
|
1578
1042
|
}, props), {
|
|
@@ -1582,9 +1046,9 @@ function SCAutocomplete({
|
|
|
1582
1046
|
backgroundColor: "white"
|
|
1583
1047
|
}, props.sx)
|
|
1584
1048
|
}),
|
|
1585
|
-
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)) : "",
|
|
1586
1050
|
props.children,
|
|
1587
|
-
deleteType == "button" || fnAplicar ? /* @__PURE__ */
|
|
1051
|
+
deleteType == "button" || fnAplicar ? /* @__PURE__ */ import_react6.default.createElement(
|
|
1588
1052
|
import_Grid22.default,
|
|
1589
1053
|
{
|
|
1590
1054
|
container: true,
|
|
@@ -1599,8 +1063,8 @@ function SCAutocomplete({
|
|
|
1599
1063
|
justifyContent: "space-between"
|
|
1600
1064
|
}
|
|
1601
1065
|
},
|
|
1602
|
-
deleteType == "button" ? /* @__PURE__ */
|
|
1603
|
-
|
|
1066
|
+
deleteType == "button" ? /* @__PURE__ */ import_react6.default.createElement(
|
|
1067
|
+
import_material5.Button,
|
|
1604
1068
|
{
|
|
1605
1069
|
variant: "text",
|
|
1606
1070
|
color: "primary",
|
|
@@ -1612,8 +1076,8 @@ function SCAutocomplete({
|
|
|
1612
1076
|
},
|
|
1613
1077
|
"Limpiar"
|
|
1614
1078
|
) : "",
|
|
1615
|
-
fnAplicar && /* @__PURE__ */
|
|
1616
|
-
|
|
1079
|
+
fnAplicar && /* @__PURE__ */ import_react6.default.createElement(
|
|
1080
|
+
import_material5.Button,
|
|
1617
1081
|
{
|
|
1618
1082
|
variant: "contained",
|
|
1619
1083
|
color: "primary",
|
|
@@ -1632,8 +1096,8 @@ function SCAutocomplete({
|
|
|
1632
1096
|
}
|
|
1633
1097
|
|
|
1634
1098
|
// src/Components/SCDateRange.tsx
|
|
1635
|
-
var
|
|
1636
|
-
var
|
|
1099
|
+
var import_react7 = __toESM(require("react"), 1);
|
|
1100
|
+
var import_material6 = require("@mui/material");
|
|
1637
1101
|
var import_LocalizationProvider = require("@mui/x-date-pickers/LocalizationProvider");
|
|
1638
1102
|
var import_AdapterDayjs = require("@mui/x-date-pickers/AdapterDayjs");
|
|
1639
1103
|
var import_DateRangePicker = require("@mui/x-date-pickers-pro/DateRangePicker");
|
|
@@ -1664,7 +1128,7 @@ var SCDateRange = ({
|
|
|
1664
1128
|
];
|
|
1665
1129
|
setState(convertedValue);
|
|
1666
1130
|
};
|
|
1667
|
-
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(
|
|
1668
1132
|
import_DateRangePicker.DateRangePicker,
|
|
1669
1133
|
{
|
|
1670
1134
|
value: state,
|
|
@@ -1683,7 +1147,7 @@ var SCDateRange = ({
|
|
|
1683
1147
|
required,
|
|
1684
1148
|
error: position === "start" ? isStartEmpty : isEndEmpty,
|
|
1685
1149
|
InputProps: {
|
|
1686
|
-
endAdornment: /* @__PURE__ */
|
|
1150
|
+
endAdornment: /* @__PURE__ */ import_react7.default.createElement(import_material6.InputAdornment, { position: "end" }, /* @__PURE__ */ import_react7.default.createElement(
|
|
1687
1151
|
import_Event.default,
|
|
1688
1152
|
{
|
|
1689
1153
|
color: hasError ? "error" : "action",
|
|
@@ -1724,81 +1188,29 @@ var getIcon2 = (iconName) => {
|
|
|
1724
1188
|
};
|
|
1725
1189
|
|
|
1726
1190
|
// src/Components/Drawer/Helpers/validateInput.tsx
|
|
1727
|
-
var validateInputs = (arrayElements, onError, onSuccess
|
|
1728
|
-
var _a
|
|
1191
|
+
var validateInputs = (arrayElements, onError, onSuccess) => {
|
|
1192
|
+
var _a;
|
|
1729
1193
|
let requiredValues = 0;
|
|
1730
1194
|
let filledValues = 0;
|
|
1731
1195
|
for (let i = 0; i < arrayElements.length; i++) {
|
|
1732
|
-
|
|
1733
|
-
|
|
1734
|
-
|
|
1735
|
-
|
|
1736
|
-
|
|
1737
|
-
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()) !== "") {
|
|
1738
1201
|
filledValues++;
|
|
1739
1202
|
}
|
|
1740
1203
|
}
|
|
1741
1204
|
}
|
|
1742
1205
|
if (requiredValues === filledValues) {
|
|
1743
1206
|
onSuccess();
|
|
1744
|
-
setChipFilters(true);
|
|
1745
1207
|
} else {
|
|
1746
1208
|
onError({
|
|
1747
1209
|
type: "error",
|
|
1748
1210
|
title: "Algunos campos son requeridos",
|
|
1749
1211
|
time: 10
|
|
1750
1212
|
});
|
|
1751
|
-
setChipFilters(false);
|
|
1752
|
-
}
|
|
1753
|
-
};
|
|
1754
|
-
|
|
1755
|
-
// src/Components/Drawer/Helpers/validateTypeElement.tsx
|
|
1756
|
-
var import_react11 = __toESM(require("react"), 1);
|
|
1757
|
-
var validateTypeElements = (element) => {
|
|
1758
|
-
var _a;
|
|
1759
|
-
let validation = "";
|
|
1760
|
-
let typeElement = element;
|
|
1761
|
-
if (element.type == "textField") {
|
|
1762
|
-
validation = "textField";
|
|
1763
|
-
typeElement = element;
|
|
1764
|
-
} else if (import_react11.default.isValidElement(element == null ? void 0 : element.component) && element.component.type && element.component.type.name == "SCtextField") {
|
|
1765
|
-
validation = "textField";
|
|
1766
|
-
typeElement = element == null ? void 0 : element.component.props;
|
|
1767
|
-
} else if (element.type == "textArea") {
|
|
1768
|
-
validation = "textArea";
|
|
1769
|
-
typeElement = element;
|
|
1770
|
-
} else if (import_react11.default.isValidElement(element == null ? void 0 : element.component) && element.component.type && element.component.type.name == "SCtextArea") {
|
|
1771
|
-
validation = "textArea";
|
|
1772
|
-
typeElement = element == null ? void 0 : element.component.props;
|
|
1773
|
-
} else if (element.type == "dateRange") {
|
|
1774
|
-
validation = "dateRange";
|
|
1775
|
-
typeElement = element;
|
|
1776
|
-
} else if (import_react11.default.isValidElement(element == null ? void 0 : element.component) && element.component.type && element.component.type.name == "SCDateRange") {
|
|
1777
|
-
validation = "dateRange";
|
|
1778
|
-
typeElement = element == null ? void 0 : element.component.props;
|
|
1779
|
-
} else if (element.type == "autocomplete") {
|
|
1780
|
-
validation = "autocomplete";
|
|
1781
|
-
typeElement = element;
|
|
1782
|
-
} else if (import_react11.default.isValidElement(element == null ? void 0 : element.component) && element.component.type && element.component.type.name == "SCAutocomplete") {
|
|
1783
|
-
validation = "autocomplete";
|
|
1784
|
-
typeElement = element == null ? void 0 : element.component.props;
|
|
1785
|
-
} else if (element.typeFormat == "multiselect") {
|
|
1786
|
-
validation = "multiselect";
|
|
1787
|
-
typeElement = element;
|
|
1788
|
-
} 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") {
|
|
1789
|
-
validation = "multiselect";
|
|
1790
|
-
typeElement = element == null ? void 0 : element.component.props;
|
|
1791
|
-
} else if (element.type == "select") {
|
|
1792
|
-
validation = "select";
|
|
1793
|
-
typeElement = element;
|
|
1794
|
-
} else if (import_react11.default.isValidElement(element == null ? void 0 : element.component) && element.component.type && element.component.type.name == "SCSelect") {
|
|
1795
|
-
validation = "select";
|
|
1796
|
-
typeElement = element == null ? void 0 : element.component.props;
|
|
1797
1213
|
}
|
|
1798
|
-
return {
|
|
1799
|
-
validation,
|
|
1800
|
-
element: typeElement
|
|
1801
|
-
};
|
|
1802
1214
|
};
|
|
1803
1215
|
|
|
1804
1216
|
// src/Components/Drawer/SCDrawer.tsx
|
|
@@ -1813,42 +1225,16 @@ function SCDrawer({
|
|
|
1813
1225
|
anchor = "left",
|
|
1814
1226
|
width,
|
|
1815
1227
|
//Funcionales
|
|
1816
|
-
open
|
|
1817
|
-
setOpen,
|
|
1818
|
-
chipFilters
|
|
1228
|
+
open
|
|
1819
1229
|
}) {
|
|
1820
1230
|
var _a, _b;
|
|
1821
|
-
const
|
|
1822
|
-
const [
|
|
1823
|
-
const [toast, setToast] = import_react12.default.useState(null);
|
|
1824
|
-
const [stateChipFilters, setChipFilters] = import_react12.default.useState(false);
|
|
1825
|
-
const [textFilters, setTextFilters] = import_react12.default.useState([]);
|
|
1826
|
-
(0, import_react12.useEffect)(() => {
|
|
1827
|
-
if (chipFilters != void 0) {
|
|
1828
|
-
if (chipFilters.length > 0) {
|
|
1829
|
-
setTextFilters([]);
|
|
1830
|
-
inputValidation();
|
|
1831
|
-
}
|
|
1832
|
-
}
|
|
1833
|
-
}, [chipFilters]);
|
|
1834
|
-
(0, import_react12.useEffect)(() => {
|
|
1835
|
-
if (open) {
|
|
1836
|
-
toggleDrawer(true);
|
|
1837
|
-
} else {
|
|
1838
|
-
handleDrawerClose();
|
|
1839
|
-
}
|
|
1840
|
-
}, [open]);
|
|
1231
|
+
const [drawerOpen, setDrawerOpen] = import_react8.default.useState(open);
|
|
1232
|
+
const [toast, setToast] = import_react8.default.useState(null);
|
|
1841
1233
|
const handleDrawerClose = () => {
|
|
1842
1234
|
setDrawerOpen(false);
|
|
1843
|
-
if (setOpen) {
|
|
1844
|
-
setOpen(false);
|
|
1845
|
-
}
|
|
1846
1235
|
};
|
|
1847
1236
|
const toggleDrawer = (newOpen) => () => {
|
|
1848
1237
|
setDrawerOpen(newOpen);
|
|
1849
|
-
if (setOpen) {
|
|
1850
|
-
setOpen(true);
|
|
1851
|
-
}
|
|
1852
1238
|
};
|
|
1853
1239
|
const ButtonIcon = getIcon2(buttonDrawer == null ? void 0 : buttonDrawer.icon);
|
|
1854
1240
|
const setToastWithDelay = (toastContent) => {
|
|
@@ -1857,179 +1243,39 @@ function SCDrawer({
|
|
|
1857
1243
|
setToast(toastContent);
|
|
1858
1244
|
}, 10);
|
|
1859
1245
|
};
|
|
1860
|
-
const inputValidation = () =>
|
|
1861
|
-
|
|
1862
|
-
|
|
1863
|
-
|
|
1864
|
-
|
|
1865
|
-
|
|
1866
|
-
|
|
1867
|
-
|
|
1868
|
-
|
|
1869
|
-
|
|
1870
|
-
|
|
1871
|
-
|
|
1872
|
-
|
|
1873
|
-
|
|
1874
|
-
|
|
1875
|
-
chipFilters.forEach((chipFilter) => {
|
|
1876
|
-
const chipValue = String(chipFilter).trim();
|
|
1877
|
-
if (currentValue === chipValue && currentValue !== "" && currentValue !== ",") {
|
|
1878
|
-
setTextFilters((prevFilters) => {
|
|
1879
|
-
const newFilter = { value: currentValue, arrayElement: typeElement };
|
|
1880
|
-
const existingFilterIndex = prevFilters.findIndex(
|
|
1881
|
-
(filter) => filter.arrayElement.label === arrayElement.label
|
|
1882
|
-
);
|
|
1883
|
-
if (existingFilterIndex !== -1) {
|
|
1884
|
-
const updatedFilters = [...prevFilters];
|
|
1885
|
-
updatedFilters[existingFilterIndex] = newFilter;
|
|
1886
|
-
return updatedFilters;
|
|
1887
|
-
} else {
|
|
1888
|
-
return [...prevFilters, newFilter];
|
|
1889
|
-
}
|
|
1890
|
-
});
|
|
1891
|
-
}
|
|
1892
|
-
});
|
|
1893
|
-
});
|
|
1894
|
-
}
|
|
1895
|
-
} else {
|
|
1896
|
-
const newFiltersToAdd = [];
|
|
1897
|
-
for (let i = 0; i < arrayElements.length; i++) {
|
|
1898
|
-
const element = arrayElements[i];
|
|
1899
|
-
const { validation, element: typeElement } = validateTypeElements(element);
|
|
1900
|
-
const textValue = ((_a2 = typeElement.state) == null ? void 0 : _a2.textValue) !== void 0 ? String((_b2 = typeElement.state) == null ? void 0 : _b2.textValue) : String(typeElement.state);
|
|
1901
|
-
if (textValue.trim() !== "" && textValue.trim() !== ",") {
|
|
1902
|
-
let newFilter;
|
|
1903
|
-
switch (validation) {
|
|
1904
|
-
case "dateRange":
|
|
1905
|
-
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")}`;
|
|
1906
|
-
newFilter = { value: values, arrayElement: typeElement };
|
|
1907
|
-
break;
|
|
1908
|
-
default:
|
|
1909
|
-
newFilter = { value: textValue, arrayElement: typeElement };
|
|
1910
|
-
break;
|
|
1911
|
-
}
|
|
1912
|
-
const existingFilterByLabel = newFiltersToAdd.find(
|
|
1913
|
-
(filter) => filter.arrayElement.label === element.label
|
|
1914
|
-
);
|
|
1915
|
-
if (existingFilterByLabel) {
|
|
1916
|
-
existingFilterByLabel.value = newFilter.value;
|
|
1917
|
-
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: [] });
|
|
1918
1261
|
} else {
|
|
1919
|
-
|
|
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: "" });
|
|
1920
1264
|
}
|
|
1921
1265
|
}
|
|
1922
1266
|
}
|
|
1923
|
-
setTextFilters((prevFilters) => {
|
|
1924
|
-
let updatedFilters = [...prevFilters];
|
|
1925
|
-
newFiltersToAdd.forEach((newFilter) => {
|
|
1926
|
-
const existingFilterIndex = updatedFilters.findIndex(
|
|
1927
|
-
(filter) => filter.arrayElement.label === newFilter.arrayElement.label
|
|
1928
|
-
);
|
|
1929
|
-
if (existingFilterIndex !== -1) {
|
|
1930
|
-
updatedFilters[existingFilterIndex] = newFilter;
|
|
1931
|
-
} else {
|
|
1932
|
-
updatedFilters.push(newFilter);
|
|
1933
|
-
}
|
|
1934
|
-
});
|
|
1935
|
-
return updatedFilters;
|
|
1936
|
-
});
|
|
1937
|
-
validateInputs(arrayElements, setToastWithDelay, handleDrawerClose, setChipFilters, setTextFilters);
|
|
1938
|
-
}
|
|
1939
|
-
};
|
|
1940
|
-
const resetElementByType = (originalElement, validation, typeElement) => {
|
|
1941
|
-
let defaultValue;
|
|
1942
|
-
switch (validation) {
|
|
1943
|
-
case "textField":
|
|
1944
|
-
case "textArea":
|
|
1945
|
-
defaultValue = "";
|
|
1946
|
-
break;
|
|
1947
|
-
case "dateRange":
|
|
1948
|
-
defaultValue = [null, null];
|
|
1949
|
-
break;
|
|
1950
|
-
case "multiselect":
|
|
1951
|
-
defaultValue = { hiddenValue: [], textValue: [] };
|
|
1952
|
-
break;
|
|
1953
|
-
default:
|
|
1954
|
-
defaultValue = { hiddenValue: "-1", textValue: "" };
|
|
1955
|
-
}
|
|
1956
|
-
if (typeElement.setState) {
|
|
1957
|
-
typeElement.setState(defaultValue);
|
|
1958
|
-
}
|
|
1959
|
-
};
|
|
1960
|
-
const cleanFilters = () => {
|
|
1961
|
-
arrayElements.forEach((element) => {
|
|
1962
|
-
const { validation, element: typeElement } = validateTypeElements(element);
|
|
1963
|
-
if (typeElement.setState) {
|
|
1964
|
-
resetElementByType(element, validation, typeElement);
|
|
1965
|
-
}
|
|
1966
|
-
});
|
|
1967
|
-
setTextFilters([]);
|
|
1968
|
-
};
|
|
1969
|
-
const deleteFilter = (element) => {
|
|
1970
|
-
const { validation, element: typeElement } = validateTypeElements(element);
|
|
1971
|
-
if (typeElement.setState && shouldShowChips == true) {
|
|
1972
|
-
resetElementByType(element, validation, typeElement);
|
|
1973
|
-
setTextFilters(
|
|
1974
|
-
(prevFilters) => prevFilters.filter((filter) => filter.arrayElement.label !== element.label)
|
|
1975
|
-
);
|
|
1976
|
-
}
|
|
1977
|
-
};
|
|
1978
|
-
const scroll = (offset) => {
|
|
1979
|
-
if (scrollRef.current) {
|
|
1980
|
-
scrollRef.current.scrollLeft += offset;
|
|
1981
|
-
}
|
|
1982
|
-
};
|
|
1983
|
-
const hasActiveFilters = () => {
|
|
1984
|
-
return arrayElements.some((arrayElement) => {
|
|
1985
|
-
const { validation, element: typeElement } = validateTypeElements(arrayElement);
|
|
1986
|
-
if (typeElement.state.textValue !== void 0) {
|
|
1987
|
-
return String(typeElement.state.textValue).trim() !== "";
|
|
1988
|
-
} else if (validation === "dateRange") {
|
|
1989
|
-
return typeElement.state && typeElement.state[0] !== null && typeElement.state[1] !== null;
|
|
1990
|
-
} else {
|
|
1991
|
-
return String(typeElement.state).trim() !== "" && String(typeElement.state).trim() !== ",";
|
|
1992
|
-
}
|
|
1993
1267
|
});
|
|
1994
1268
|
};
|
|
1995
|
-
const
|
|
1996
|
-
|
|
1997
|
-
|
|
1998
|
-
import_material9.Box,
|
|
1999
|
-
{
|
|
2000
|
-
ref: scrollRef,
|
|
2001
|
-
gap: 0.3,
|
|
2002
|
-
sx: {
|
|
2003
|
-
display: "flex",
|
|
2004
|
-
overflowX: "auto",
|
|
2005
|
-
scrollBehavior: "smooth",
|
|
2006
|
-
"&::-webkit-scrollbar": { display: "none" }
|
|
2007
|
-
}
|
|
2008
|
-
},
|
|
2009
|
-
textFilters == null ? void 0 : textFilters.map((chipData, index) => /* @__PURE__ */ import_react12.default.createElement(
|
|
2010
|
-
import_material9.Chip,
|
|
2011
|
-
__spreadProps(__spreadValues({
|
|
2012
|
-
key: index,
|
|
2013
|
-
label: chipData.value
|
|
2014
|
-
}, chipData.arrayElement.required == false || chipData.arrayElement.required == void 0 ? { onDelete: () => deleteFilter(chipData.arrayElement) } : {}), {
|
|
2015
|
-
color: "default",
|
|
2016
|
-
variant: "filled",
|
|
2017
|
-
size: "small",
|
|
2018
|
-
sx: {
|
|
2019
|
-
flexShrink: 0,
|
|
2020
|
-
minWidth: "auto"
|
|
2021
|
-
}
|
|
2022
|
-
})
|
|
2023
|
-
))
|
|
2024
|
-
), /* @__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(
|
|
2025
|
-
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,
|
|
2026
1272
|
__spreadProps(__spreadValues({
|
|
2027
1273
|
onClick: toggleDrawer(true),
|
|
2028
1274
|
color: buttonDrawer == null ? void 0 : buttonDrawer.color,
|
|
2029
1275
|
variant: (buttonDrawer == null ? void 0 : buttonDrawer.variant) == "contained" ? "filled" : "outlined",
|
|
2030
1276
|
label: (_a = buttonDrawer == null ? void 0 : buttonDrawer.text) != null ? _a : "",
|
|
2031
|
-
icon: (buttonDrawer == null ? void 0 : buttonDrawer.iconPosition) === "left" && ButtonIcon ? /* @__PURE__ */
|
|
2032
|
-
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
|
|
2033
1279
|
}, (buttonDrawer == null ? void 0 : buttonDrawer.iconPosition) === "right" && ButtonIcon ? { onDelete: () => {
|
|
2034
1280
|
} } : {}), {
|
|
2035
1281
|
sx: {
|
|
@@ -2039,8 +1285,8 @@ function SCDrawer({
|
|
|
2039
1285
|
textTransform: "capitalize"
|
|
2040
1286
|
}
|
|
2041
1287
|
})
|
|
2042
|
-
) : /* @__PURE__ */
|
|
2043
|
-
|
|
1288
|
+
) : /* @__PURE__ */ import_react8.default.createElement(
|
|
1289
|
+
import_material7.Button,
|
|
2044
1290
|
{
|
|
2045
1291
|
"data-testid": "test-buttonDrawer",
|
|
2046
1292
|
sx: { textTransform: "capitalize" },
|
|
@@ -2048,12 +1294,12 @@ function SCDrawer({
|
|
|
2048
1294
|
onClick: toggleDrawer(true),
|
|
2049
1295
|
size: "small",
|
|
2050
1296
|
variant: (buttonDrawer == null ? void 0 : buttonDrawer.variant) != void 0 ? buttonDrawer == null ? void 0 : buttonDrawer.variant : "text",
|
|
2051
|
-
startIcon: ((buttonDrawer == null ? void 0 : buttonDrawer.iconPosition) === "left" || !(buttonDrawer == null ? void 0 : buttonDrawer.iconPosition)) && ButtonIcon ? /* @__PURE__ */
|
|
2052
|
-
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
|
|
2053
1299
|
},
|
|
2054
1300
|
(_b = buttonDrawer == null ? void 0 : buttonDrawer.text) != null ? _b : ""
|
|
2055
|
-
)
|
|
2056
|
-
|
|
1301
|
+
), /* @__PURE__ */ import_react8.default.createElement(
|
|
1302
|
+
import_material7.Drawer,
|
|
2057
1303
|
{
|
|
2058
1304
|
open: drawerOpen,
|
|
2059
1305
|
onClose: toggleDrawer(false),
|
|
@@ -2066,15 +1312,15 @@ function SCDrawer({
|
|
|
2066
1312
|
}
|
|
2067
1313
|
}
|
|
2068
1314
|
},
|
|
2069
|
-
/* @__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) => {
|
|
2070
1316
|
var _a2, _b2, _c, _d, _e, _f;
|
|
2071
|
-
return /* @__PURE__ */
|
|
2072
|
-
|
|
1317
|
+
return /* @__PURE__ */ import_react8.default.createElement(
|
|
1318
|
+
import_material7.Box,
|
|
2073
1319
|
{
|
|
2074
1320
|
key: `Stack_${(_a2 = arrayElement.type) != null ? _a2 : ""} ${(_b2 = arrayElement.label) != null ? _b2 : ""}${index}`,
|
|
2075
1321
|
sx: { width: "100%" }
|
|
2076
1322
|
},
|
|
2077
|
-
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(
|
|
2078
1324
|
SCTextField,
|
|
2079
1325
|
{
|
|
2080
1326
|
title: arrayElement.title,
|
|
@@ -2100,7 +1346,7 @@ function SCDrawer({
|
|
|
2100
1346
|
onBlur: arrayElement.onBlur,
|
|
2101
1347
|
onKeyDown: arrayElement.onKeyDown
|
|
2102
1348
|
}
|
|
2103
|
-
) : arrayElement.type === "textArea" ? /* @__PURE__ */
|
|
1349
|
+
) : arrayElement.type === "textArea" ? /* @__PURE__ */ import_react8.default.createElement(
|
|
2104
1350
|
SCTextArea,
|
|
2105
1351
|
{
|
|
2106
1352
|
title: arrayElement.title,
|
|
@@ -2119,7 +1365,7 @@ function SCDrawer({
|
|
|
2119
1365
|
state: arrayElement.state || "",
|
|
2120
1366
|
onBlur: arrayElement.onBlur
|
|
2121
1367
|
}
|
|
2122
|
-
) : arrayElement.type === "autocomplete" ? /* @__PURE__ */
|
|
1368
|
+
) : arrayElement.type === "autocomplete" ? /* @__PURE__ */ import_react8.default.createElement(
|
|
2123
1369
|
SCAutocomplete,
|
|
2124
1370
|
{
|
|
2125
1371
|
label: arrayElement.label,
|
|
@@ -2137,7 +1383,7 @@ function SCDrawer({
|
|
|
2137
1383
|
state: arrayElement.state || "",
|
|
2138
1384
|
inputChange: arrayElement.inputChange
|
|
2139
1385
|
}
|
|
2140
|
-
) : arrayElement.type === "select" ? /* @__PURE__ */
|
|
1386
|
+
) : arrayElement.type === "select" ? /* @__PURE__ */ import_react8.default.createElement(
|
|
2141
1387
|
SCSelect,
|
|
2142
1388
|
{
|
|
2143
1389
|
label: arrayElement.label,
|
|
@@ -2146,6 +1392,7 @@ function SCDrawer({
|
|
|
2146
1392
|
width: arrayElement.width,
|
|
2147
1393
|
size: arrayElement.size,
|
|
2148
1394
|
variant: arrayElement.variant,
|
|
1395
|
+
deleteType: arrayElement.deleteType,
|
|
2149
1396
|
required: arrayElement.required,
|
|
2150
1397
|
disabled: arrayElement.disabled,
|
|
2151
1398
|
background: arrayElement.background,
|
|
@@ -2153,7 +1400,7 @@ function SCDrawer({
|
|
|
2153
1400
|
setState: arrayElement.setState,
|
|
2154
1401
|
state: arrayElement.state || ""
|
|
2155
1402
|
}
|
|
2156
|
-
) : arrayElement.type === "dateRange" ? /* @__PURE__ */
|
|
1403
|
+
) : arrayElement.type === "dateRange" ? /* @__PURE__ */ import_react8.default.createElement(
|
|
2157
1404
|
SCDateRange,
|
|
2158
1405
|
{
|
|
2159
1406
|
labelDateInitial: arrayElement.labelDateInitial,
|
|
@@ -2166,7 +1413,7 @@ function SCDrawer({
|
|
|
2166
1413
|
}
|
|
2167
1414
|
) : null
|
|
2168
1415
|
);
|
|
2169
|
-
})), 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(
|
|
2170
1417
|
import_Grid23.default,
|
|
2171
1418
|
{
|
|
2172
1419
|
sx: { borderTop: 1, borderColor: "#1018403B" },
|
|
@@ -2178,8 +1425,8 @@ function SCDrawer({
|
|
|
2178
1425
|
justifyContent: actionsA.length > 1 ? "space-between" : !anchor && anchor != "right" ? "flex-end" : "flex-start",
|
|
2179
1426
|
flexDirection: anchor != "right" ? "row-reverse" : "row"
|
|
2180
1427
|
},
|
|
2181
|
-
actionsA.map((btn, index) => /* @__PURE__ */
|
|
2182
|
-
|
|
1428
|
+
actionsA.map((btn, index) => /* @__PURE__ */ import_react8.default.createElement(
|
|
1429
|
+
import_material7.Button,
|
|
2183
1430
|
{
|
|
2184
1431
|
key: index,
|
|
2185
1432
|
variant: index === 0 || actionsA.length < 2 ? "contained" : "text",
|
|
@@ -2195,61 +1442,207 @@ function SCDrawer({
|
|
|
2195
1442
|
}
|
|
2196
1443
|
|
|
2197
1444
|
// src/Components/FooterAction/FooterAction.tsx
|
|
2198
|
-
var
|
|
2199
|
-
var
|
|
1445
|
+
var import_react9 = __toESM(require("react"), 1);
|
|
1446
|
+
var import_material8 = require("@mui/material");
|
|
2200
1447
|
var FooterAction = ({
|
|
2201
1448
|
leftContent,
|
|
2202
1449
|
rightContent,
|
|
2203
1450
|
label,
|
|
2204
1451
|
variant
|
|
2205
1452
|
}) => {
|
|
2206
|
-
return /* @__PURE__ */
|
|
2207
|
-
|
|
1453
|
+
return /* @__PURE__ */ import_react9.default.createElement(
|
|
1454
|
+
import_material8.AppBar,
|
|
2208
1455
|
{
|
|
2209
1456
|
color: "inherit",
|
|
2210
1457
|
sx: { position: variant == "float" ? "relative" : "fixed", left: 0, right: "auto", width: "100%", top: "auto", bottom: 0 }
|
|
2211
1458
|
},
|
|
2212
|
-
/* @__PURE__ */
|
|
2213
|
-
|
|
1459
|
+
/* @__PURE__ */ import_react9.default.createElement(
|
|
1460
|
+
import_material8.Toolbar,
|
|
2214
1461
|
{
|
|
2215
1462
|
id: "footer-toolbar",
|
|
2216
1463
|
sx: { gap: 1.5, minHeight: "50px !important" }
|
|
2217
1464
|
},
|
|
2218
1465
|
leftContent,
|
|
2219
|
-
/* @__PURE__ */
|
|
2220
|
-
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),
|
|
2221
1468
|
rightContent
|
|
2222
1469
|
)
|
|
2223
1470
|
);
|
|
2224
1471
|
};
|
|
2225
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
|
+
|
|
2226
1619
|
// src/Components/MultiSelect/MultiSelect.tsx
|
|
2227
|
-
var
|
|
2228
|
-
var
|
|
2229
|
-
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");
|
|
2230
1623
|
|
|
2231
1624
|
// src/Components/MultiSelect/helpers/useHandlers.tsx
|
|
2232
|
-
var
|
|
1625
|
+
var import_react12 = require("react");
|
|
2233
1626
|
function useMultiSelectHandlers() {
|
|
2234
|
-
const [anchorEl, setAnchorEl] = (0,
|
|
2235
|
-
const [open, setOpen] = (0,
|
|
2236
|
-
const [selectedItems, setSelectedItems] = (0,
|
|
2237
|
-
const [filterValue, setFilterValue] = (0,
|
|
2238
|
-
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) => {
|
|
2239
1632
|
setAnchorEl(e.currentTarget);
|
|
2240
1633
|
setOpen(true);
|
|
2241
1634
|
}, []);
|
|
2242
|
-
const handleClose = (0,
|
|
1635
|
+
const handleClose = (0, import_react12.useCallback)(() => {
|
|
2243
1636
|
setAnchorEl(null);
|
|
2244
1637
|
setOpen(false);
|
|
2245
1638
|
}, []);
|
|
2246
|
-
const handleFilterChange = (0,
|
|
1639
|
+
const handleFilterChange = (0, import_react12.useCallback)(
|
|
2247
1640
|
(e) => {
|
|
2248
1641
|
setFilterValue(e.target.value);
|
|
2249
1642
|
},
|
|
2250
1643
|
[]
|
|
2251
1644
|
);
|
|
2252
|
-
const handleCheckboxToggle = (0,
|
|
1645
|
+
const handleCheckboxToggle = (0, import_react12.useCallback)((item) => {
|
|
2253
1646
|
setSelectedItems(
|
|
2254
1647
|
(prev) => prev.includes(item) ? prev.filter((i) => i !== item) : [...prev, item]
|
|
2255
1648
|
);
|
|
@@ -2270,21 +1663,21 @@ function useMultiSelectHandlers() {
|
|
|
2270
1663
|
|
|
2271
1664
|
// src/Components/MultiSelect/helpers/Utils.tsx
|
|
2272
1665
|
var MuiIcons3 = __toESM(require("@mui/icons-material"), 1);
|
|
2273
|
-
var
|
|
1666
|
+
var import_icons_material8 = require("@mui/icons-material");
|
|
2274
1667
|
function getIconMultiSelect(name) {
|
|
2275
|
-
return name in MuiIcons3 ? MuiIcons3[name] :
|
|
1668
|
+
return name in MuiIcons3 ? MuiIcons3[name] : import_icons_material8.FilterListOutlined;
|
|
2276
1669
|
}
|
|
2277
1670
|
|
|
2278
1671
|
// src/Components/MultiSelect/helpers/useFilteredItems.tsx
|
|
2279
|
-
var
|
|
1672
|
+
var import_react13 = require("react");
|
|
2280
1673
|
function useFilteredItems(items, filterValue, getItemLabel, selectedItems) {
|
|
2281
|
-
const filteredItems = (0,
|
|
1674
|
+
const filteredItems = (0, import_react13.useMemo)(
|
|
2282
1675
|
() => items.filter(
|
|
2283
1676
|
(item) => getItemLabel(item).toLowerCase().includes(filterValue.toLowerCase())
|
|
2284
1677
|
),
|
|
2285
1678
|
[items, filterValue, getItemLabel]
|
|
2286
1679
|
);
|
|
2287
|
-
const sortedItems = (0,
|
|
1680
|
+
const sortedItems = (0, import_react13.useMemo)(() => {
|
|
2288
1681
|
return [
|
|
2289
1682
|
...filteredItems.filter((item) => selectedItems.includes(item)),
|
|
2290
1683
|
...filteredItems.filter((item) => !selectedItems.includes(item))
|
|
@@ -2318,16 +1711,16 @@ function MultiSelect({
|
|
|
2318
1711
|
handleCheckboxToggle,
|
|
2319
1712
|
setOpen
|
|
2320
1713
|
} = useMultiSelectHandlers();
|
|
2321
|
-
(0,
|
|
1714
|
+
(0, import_react14.useEffect)(() => {
|
|
2322
1715
|
if (open !== void 0) {
|
|
2323
1716
|
setOpen(open);
|
|
2324
1717
|
}
|
|
2325
1718
|
}, [open, setOpen]);
|
|
2326
|
-
(0,
|
|
1719
|
+
(0, import_react14.useEffect)(() => {
|
|
2327
1720
|
setSelectedItems([]);
|
|
2328
1721
|
}, [items, setSelectedItems]);
|
|
2329
1722
|
const { filteredItems, sortedItems } = useFilteredItems(items, filterValue, getItemLabel, selectedItems);
|
|
2330
|
-
const Icon = (0,
|
|
1723
|
+
const Icon = (0, import_react14.useMemo)(() => {
|
|
2331
1724
|
var _a2;
|
|
2332
1725
|
return getIconMultiSelect((_a2 = button == null ? void 0 : button.icon) != null ? _a2 : "FilterListOutlined");
|
|
2333
1726
|
}, [button == null ? void 0 : button.icon]);
|
|
@@ -2341,20 +1734,20 @@ function MultiSelect({
|
|
|
2341
1734
|
{ text: "Aplicar", fn: () => {
|
|
2342
1735
|
} }
|
|
2343
1736
|
];
|
|
2344
|
-
return /* @__PURE__ */
|
|
2345
|
-
|
|
1737
|
+
return /* @__PURE__ */ import_react14.default.createElement(import_react14.default.Fragment, null, /* @__PURE__ */ import_react14.default.createElement(
|
|
1738
|
+
import_material10.Button,
|
|
2346
1739
|
{
|
|
2347
1740
|
"test-id": "multiselect-button",
|
|
2348
1741
|
color: (_a = button == null ? void 0 : button.color) != null ? _a : "primary",
|
|
2349
1742
|
onClick: handleOpen,
|
|
2350
1743
|
variant: (_b = button == null ? void 0 : button.variant) != null ? _b : "text",
|
|
2351
1744
|
size: "small",
|
|
2352
|
-
startIcon: (button == null ? void 0 : button.iconPosition) === "left" || !(button == null ? void 0 : button.iconPosition) ? /* @__PURE__ */
|
|
2353
|
-
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
|
|
2354
1747
|
},
|
|
2355
1748
|
capitalize(textButton != null ? textButton : "MultiSelect")
|
|
2356
|
-
), /* @__PURE__ */
|
|
2357
|
-
|
|
1749
|
+
), /* @__PURE__ */ import_react14.default.createElement(
|
|
1750
|
+
import_material10.Popover,
|
|
2358
1751
|
{
|
|
2359
1752
|
elevation: 8,
|
|
2360
1753
|
anchorEl,
|
|
@@ -2362,8 +1755,8 @@ function MultiSelect({
|
|
|
2362
1755
|
open: openMultiselect,
|
|
2363
1756
|
onClose: () => setOpen(false)
|
|
2364
1757
|
},
|
|
2365
|
-
/* @__PURE__ */
|
|
2366
|
-
|
|
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,
|
|
2367
1760
|
{
|
|
2368
1761
|
"data-testid": "multiselect-input",
|
|
2369
1762
|
fullWidth: true,
|
|
@@ -2374,29 +1767,29 @@ function MultiSelect({
|
|
|
2374
1767
|
onChange: handleFilterChange,
|
|
2375
1768
|
slotProps: {
|
|
2376
1769
|
input: {
|
|
2377
|
-
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" }))
|
|
2378
1771
|
}
|
|
2379
1772
|
}
|
|
2380
1773
|
}
|
|
2381
|
-
))), /* @__PURE__ */
|
|
2382
|
-
|
|
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,
|
|
2383
1776
|
{
|
|
2384
1777
|
key: getItemLabel(item),
|
|
2385
1778
|
dense,
|
|
2386
1779
|
onClick: () => handleCheckboxToggle(item)
|
|
2387
1780
|
},
|
|
2388
|
-
/* @__PURE__ */
|
|
2389
|
-
|
|
1781
|
+
/* @__PURE__ */ import_react14.default.createElement(import_material10.ListItemIcon, null, /* @__PURE__ */ import_react14.default.createElement(
|
|
1782
|
+
import_material10.Checkbox,
|
|
2390
1783
|
{
|
|
2391
1784
|
checked: selectedItems.includes(item),
|
|
2392
1785
|
color: "primary"
|
|
2393
1786
|
}
|
|
2394
1787
|
)),
|
|
2395
1788
|
getItemLabel(item)
|
|
2396
|
-
)) : /* @__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) => {
|
|
2397
1790
|
var _a2;
|
|
2398
|
-
return /* @__PURE__ */
|
|
2399
|
-
|
|
1791
|
+
return /* @__PURE__ */ import_react14.default.createElement(
|
|
1792
|
+
import_material10.Button,
|
|
2400
1793
|
{
|
|
2401
1794
|
key: index,
|
|
2402
1795
|
variant: index === 0 || resolvedActions.length < 2 ? "text" : "contained",
|
|
@@ -2411,8 +1804,8 @@ function MultiSelect({
|
|
|
2411
1804
|
}
|
|
2412
1805
|
|
|
2413
1806
|
// src/Components/PageHeader/PageHeader.tsx
|
|
2414
|
-
var
|
|
2415
|
-
var
|
|
1807
|
+
var import_react15 = __toESM(require("react"), 1);
|
|
1808
|
+
var import_material11 = require("@mui/material");
|
|
2416
1809
|
var PageHeader = ({
|
|
2417
1810
|
title,
|
|
2418
1811
|
subtitle,
|
|
@@ -2421,8 +1814,8 @@ var PageHeader = ({
|
|
|
2421
1814
|
fixed,
|
|
2422
1815
|
shadow = true
|
|
2423
1816
|
}) => {
|
|
2424
|
-
return /* @__PURE__ */
|
|
2425
|
-
|
|
1817
|
+
return /* @__PURE__ */ import_react15.default.createElement(
|
|
1818
|
+
import_material11.Stack,
|
|
2426
1819
|
{
|
|
2427
1820
|
"data-testid": "main-container",
|
|
2428
1821
|
justifyContent: "center",
|
|
@@ -2433,13 +1826,13 @@ var PageHeader = ({
|
|
|
2433
1826
|
zIndex: 10,
|
|
2434
1827
|
sx: { boxShadow: shadow ? (theme) => theme.shadows[1] : "none" }
|
|
2435
1828
|
},
|
|
2436
|
-
/* @__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))
|
|
2437
1830
|
);
|
|
2438
1831
|
};
|
|
2439
1832
|
|
|
2440
1833
|
// src/Components/SCCalendarSwipeable.tsx
|
|
2441
|
-
var
|
|
2442
|
-
var
|
|
1834
|
+
var import_react16 = __toESM(require("react"), 1);
|
|
1835
|
+
var import_material12 = require("@mui/material");
|
|
2443
1836
|
var import_Grid24 = __toESM(require("@mui/material/Grid2"), 1);
|
|
2444
1837
|
var import_AdapterDateFns = require("@mui/x-date-pickers/AdapterDateFns");
|
|
2445
1838
|
var import_LocalizationProvider2 = require("@mui/x-date-pickers/LocalizationProvider");
|
|
@@ -2457,14 +1850,14 @@ var SCCalendarSwipeable = ({
|
|
|
2457
1850
|
state
|
|
2458
1851
|
}) => {
|
|
2459
1852
|
let convertFecha;
|
|
2460
|
-
const [fecha, setFecha] = (0,
|
|
2461
|
-
const [fechaSeleccionada, setFechaSeleccionada] = (0,
|
|
2462
|
-
const [stateVal, setstateVal] =
|
|
2463
|
-
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);
|
|
2464
1857
|
const hoy = /* @__PURE__ */ new Date();
|
|
2465
1858
|
const inicioSemana = (0, import_date_fns.startOfWeek)(fecha, { weekStartsOn: 0 });
|
|
2466
1859
|
const diasSemana = Array.from({ length: 7 }, (_, i) => (0, import_date_fns.addDays)(inicioSemana, i));
|
|
2467
|
-
|
|
1860
|
+
import_react16.default.useEffect(() => {
|
|
2468
1861
|
if (fecha != null) {
|
|
2469
1862
|
handleConvertFecha(fecha);
|
|
2470
1863
|
}
|
|
@@ -2483,12 +1876,12 @@ var SCCalendarSwipeable = ({
|
|
|
2483
1876
|
setOpenCalendar(newOpen);
|
|
2484
1877
|
};
|
|
2485
1878
|
const locale = __spreadValues({}, import_locale.es);
|
|
2486
|
-
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: {
|
|
2487
1880
|
justifyContent: "space-between",
|
|
2488
1881
|
padding: "12px 0px",
|
|
2489
1882
|
background: "transparent"
|
|
2490
|
-
} }, diasSemana.map((dia) => /* @__PURE__ */
|
|
2491
|
-
|
|
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,
|
|
2492
1885
|
{
|
|
2493
1886
|
onClick: () => setFecha(dia),
|
|
2494
1887
|
sx: {
|
|
@@ -2503,8 +1896,8 @@ var SCCalendarSwipeable = ({
|
|
|
2503
1896
|
//height: '36px',
|
|
2504
1897
|
}
|
|
2505
1898
|
},
|
|
2506
|
-
/* @__PURE__ */
|
|
2507
|
-
)))), /* @__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(
|
|
2508
1901
|
import_StaticDatePicker.StaticDatePicker,
|
|
2509
1902
|
{
|
|
2510
1903
|
orientation: "landscape",
|
|
@@ -2514,17 +1907,17 @@ var SCCalendarSwipeable = ({
|
|
|
2514
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" } },
|
|
2515
1908
|
onChange: (newValue) => setFecha(newValue)
|
|
2516
1909
|
}
|
|
2517
|
-
), /* @__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))))));
|
|
2518
1911
|
};
|
|
2519
1912
|
|
|
2520
1913
|
// src/Components/SCDataGrid.tsx
|
|
2521
|
-
var
|
|
1914
|
+
var import_react17 = __toESM(require("react"), 1);
|
|
2522
1915
|
var import_x_data_grid_pro = require("@mui/x-data-grid-pro");
|
|
2523
1916
|
var import_x_license_pro2 = require("@mui/x-license-pro");
|
|
2524
1917
|
var import_KeyboardArrowDown = __toESM(require("@mui/icons-material/KeyboardArrowDown"), 1);
|
|
2525
1918
|
var import_KeyboardArrowUp = __toESM(require("@mui/icons-material/KeyboardArrowUp"), 1);
|
|
2526
1919
|
var import_styles = require("@mui/material/styles");
|
|
2527
|
-
|
|
1920
|
+
var SCDataGridInitial = ({ data, columns, groupColumns, rowsTable, checkboxSelection, width, maxHeight, density }) => {
|
|
2528
1921
|
import_x_license_pro2.LicenseInfo.setLicenseKey(
|
|
2529
1922
|
"77d49a57fbc5f4af35ddb05c5f1742e0Tz0xMTI3MjgsRT0xNzc4MzcxMTk5MDAwLFM9cHJvLExNPXN1YnNjcmlwdGlvbixQVj1RMy0yMDI0LEtWPTI="
|
|
2530
1923
|
);
|
|
@@ -2535,80 +1928,45 @@ function SCDataGridInitial({ data, columns, groupColumns, rowsTable, checkboxSel
|
|
|
2535
1928
|
return Math.floor(Math.random() * 1e6);
|
|
2536
1929
|
}
|
|
2537
1930
|
const getTreeDataPaths = (row) => {
|
|
2538
|
-
var _a, _b, _c;
|
|
2539
|
-
const group1Value = groupColumns && ((_a = groupColumns(row)) == null ? void 0 : _a.valueGroup1);
|
|
2540
|
-
const group2Value = groupColumns && ((_b = groupColumns(row)) == null ? void 0 : _b.valueGroup2);
|
|
2541
|
-
const fieldValue = groupColumns && ((_c = groupColumns(row)) == null ? void 0 : _c.fieldFirstColumn);
|
|
2542
1931
|
return [
|
|
2543
|
-
|
|
2544
|
-
...
|
|
2545
|
-
`${
|
|
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()}`
|
|
2546
1935
|
];
|
|
2547
1936
|
};
|
|
2548
1937
|
const groupingColDefs = {
|
|
2549
1938
|
field: "grouping",
|
|
2550
|
-
headerName: groupColumns ? groupColumns(
|
|
1939
|
+
headerName: groupColumns != void 0 ? groupColumns[groupColumns.length - 1].split("[").length == 2 ? groupColumns[groupColumns.length - 1].split("[")[0].trim() : "Agrupador" : "",
|
|
2551
1940
|
renderCell: (params) => {
|
|
2552
|
-
var _a
|
|
1941
|
+
var _a;
|
|
2553
1942
|
let label = params.value.toString().includes("/") ? params.value.split("/")[0].toString() : params.value.toString();
|
|
2554
|
-
|
|
2555
|
-
if (groupColumns
|
|
2556
|
-
const sampleItem = groupColumns(data[0]);
|
|
2557
|
-
if (sampleItem.valueGroup1) maxDepth++;
|
|
2558
|
-
if (sampleItem.valueGroup2) maxDepth++;
|
|
2559
|
-
maxDepth = Math.max(0, maxDepth - 1);
|
|
2560
|
-
}
|
|
2561
|
-
if (groupColumns) {
|
|
1943
|
+
const maxDepth = groupColumns ? groupColumns.length - 2 : 0;
|
|
1944
|
+
if (groupColumns != void 0) {
|
|
2562
1945
|
if (params.rowNode.depth === 0) {
|
|
2563
|
-
|
|
2564
|
-
|
|
2565
|
-
|
|
2566
|
-
|
|
2567
|
-
|
|
2568
|
-
|
|
2569
|
-
}
|
|
2570
|
-
);
|
|
2571
|
-
if (originalItem) {
|
|
2572
|
-
const itemValue = groupColumns(originalItem);
|
|
2573
|
-
customLabel = itemValue.textGroup1 || label;
|
|
2574
|
-
}
|
|
2575
|
-
}
|
|
2576
|
-
const subgroup1 = arrayRows.filter((r) => {
|
|
2577
|
-
var _a2;
|
|
2578
|
-
return groupColumns && String((_a2 = groupColumns(r)) == null ? void 0 : _a2.valueGroup1) === label;
|
|
2579
|
-
}).map((r) => {
|
|
2580
|
-
var _a2;
|
|
2581
|
-
return groupColumns && String((_a2 = groupColumns(r)) == null ? void 0 : _a2.valueGroup2);
|
|
2582
|
-
});
|
|
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]);
|
|
2583
1952
|
const groupedDataLength1 = subgroup1.filter((valor, indiceActual, arreglo) => arreglo.indexOf(valor) === indiceActual);
|
|
2584
|
-
label = `${
|
|
2585
|
-
} else if (
|
|
2586
|
-
const labelGrouping1 = (
|
|
2587
|
-
|
|
2588
|
-
|
|
2589
|
-
|
|
2590
|
-
|
|
2591
|
-
|
|
2592
|
-
return String((_a2 = groupColumns(item)) == null ? void 0 : _a2.valueGroup2) === label;
|
|
2593
|
-
}
|
|
2594
|
-
);
|
|
2595
|
-
if (originalItem) {
|
|
2596
|
-
const itemValue = groupColumns(originalItem);
|
|
2597
|
-
customLabel = itemValue.textGroup2 || label;
|
|
2598
|
-
}
|
|
2599
|
-
}
|
|
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();
|
|
2600
1961
|
const groupedDataLength2 = arrayRows.filter(
|
|
2601
|
-
(r) =>
|
|
2602
|
-
var _a2, _b2;
|
|
2603
|
-
return groupColumns && String((_a2 = groupColumns(r)) == null ? void 0 : _a2.valueGroup1) === labelGrouping1 && groupColumns && String((_b2 = groupColumns(r)) == null ? void 0 : _b2.valueGroup2) === label;
|
|
2604
|
-
}
|
|
1962
|
+
(r) => r[fieldGrouping1] === labelGrouping1 && r[fieldGrouping2] === label
|
|
2605
1963
|
).length;
|
|
2606
|
-
label = `${
|
|
1964
|
+
label = `${labelGrouping2} (${groupedDataLength2})`;
|
|
2607
1965
|
} else {
|
|
2608
1966
|
label = label;
|
|
2609
1967
|
}
|
|
2610
1968
|
}
|
|
2611
|
-
return /* @__PURE__ */
|
|
1969
|
+
return /* @__PURE__ */ import_react17.default.createElement(
|
|
2612
1970
|
"div",
|
|
2613
1971
|
{
|
|
2614
1972
|
style: {
|
|
@@ -2625,7 +1983,7 @@ function SCDataGridInitial({ data, columns, groupColumns, rowsTable, checkboxSel
|
|
|
2625
1983
|
fontWeight: params.rowNode.type == "group" ? "400" : "300"
|
|
2626
1984
|
}
|
|
2627
1985
|
},
|
|
2628
|
-
params.rowNode.type === "group" && /* @__PURE__ */
|
|
1986
|
+
params.rowNode.type === "group" && /* @__PURE__ */ import_react17.default.createElement(
|
|
2629
1987
|
"span",
|
|
2630
1988
|
{
|
|
2631
1989
|
style: {
|
|
@@ -2638,32 +1996,25 @@ function SCDataGridInitial({ data, columns, groupColumns, rowsTable, checkboxSel
|
|
|
2638
1996
|
params.api.setRowChildrenExpansion(params.id, !params.rowNode.childrenExpanded);
|
|
2639
1997
|
}
|
|
2640
1998
|
},
|
|
2641
|
-
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" })
|
|
2642
2000
|
),
|
|
2643
2001
|
label
|
|
2644
2002
|
);
|
|
2645
2003
|
},
|
|
2646
2004
|
colSpan: (params) => {
|
|
2647
|
-
var _a, _b;
|
|
2648
2005
|
const value = String(params);
|
|
2649
|
-
const fieldGrouping1 = groupColumns
|
|
2650
|
-
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;
|
|
2651
2008
|
let agrupado1 = false;
|
|
2652
2009
|
let agrupado2 = false;
|
|
2653
2010
|
if (fieldGrouping1 != void 0) {
|
|
2654
2011
|
agrupado1 = arrayRows.some(
|
|
2655
|
-
(row) =>
|
|
2656
|
-
var _a2;
|
|
2657
|
-
return groupColumns && String((_a2 = groupColumns(row)) == null ? void 0 : _a2.valueGroup1) === value;
|
|
2658
|
-
}
|
|
2012
|
+
(row) => String(row[fieldGrouping1]) === value
|
|
2659
2013
|
);
|
|
2660
2014
|
}
|
|
2661
2015
|
if (fieldGrouping2 != void 0) {
|
|
2662
2016
|
agrupado2 = arrayRows.some(
|
|
2663
|
-
(row) =>
|
|
2664
|
-
var _a2;
|
|
2665
|
-
return groupColumns && String((_a2 = groupColumns(row)) == null ? void 0 : _a2.valueGroup2) === value;
|
|
2666
|
-
}
|
|
2017
|
+
(row) => String(row[fieldGrouping2]) === value
|
|
2667
2018
|
);
|
|
2668
2019
|
}
|
|
2669
2020
|
if (agrupado1 || agrupado2) {
|
|
@@ -2680,11 +2031,11 @@ function SCDataGridInitial({ data, columns, groupColumns, rowsTable, checkboxSel
|
|
|
2680
2031
|
let styleRowHeight = density == "compact" ? 32 : density == "standard" ? 28 : density == "comfortable" ? 36 : 32;
|
|
2681
2032
|
let rows = rowsTable ? rowsTable : validationTreeData != false ? parseInt(data.length.toString()) : data.length < 10 ? parseInt(data.length.toString()) : 10;
|
|
2682
2033
|
let validationGroupingColDef = groupingColDefs || {};
|
|
2683
|
-
const [groupDataLenght, setGroupDataLengh] = (0,
|
|
2684
|
-
const [pageSize, setPageSize] = (0,
|
|
2685
|
-
const [arrayRows, setArrayRows] = (0,
|
|
2686
|
-
const [selectionModel, setSelectionModel] = (0,
|
|
2687
|
-
(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)(() => {
|
|
2688
2039
|
if ((data == null ? void 0 : data.length) > 0) {
|
|
2689
2040
|
dataConvertRows(data, void 0);
|
|
2690
2041
|
}
|
|
@@ -2740,7 +2091,7 @@ function SCDataGridInitial({ data, columns, groupColumns, rowsTable, checkboxSel
|
|
|
2740
2091
|
setSelectionModel([...newSelection]);
|
|
2741
2092
|
}
|
|
2742
2093
|
};
|
|
2743
|
-
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(
|
|
2744
2095
|
import_x_data_grid_pro.DataGridPro,
|
|
2745
2096
|
{
|
|
2746
2097
|
apiRef,
|
|
@@ -2774,6 +2125,7 @@ function SCDataGridInitial({ data, columns, groupColumns, rowsTable, checkboxSel
|
|
|
2774
2125
|
},
|
|
2775
2126
|
sx: {
|
|
2776
2127
|
maxHeight: maxHeight ? `${maxHeight}px` : "none",
|
|
2128
|
+
//overflow: 'auto',
|
|
2777
2129
|
"& .MuiDataGrid-filler": {
|
|
2778
2130
|
display: "none !important"
|
|
2779
2131
|
},
|
|
@@ -2803,54 +2155,42 @@ function SCDataGridInitial({ data, columns, groupColumns, rowsTable, checkboxSel
|
|
|
2803
2155
|
}
|
|
2804
2156
|
}
|
|
2805
2157
|
))));
|
|
2806
|
-
}
|
|
2807
|
-
var SCDataGrid =
|
|
2808
|
-
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;
|
|
2809
2161
|
return isEqual;
|
|
2810
2162
|
});
|
|
2811
2163
|
|
|
2812
2164
|
// src/Components/EmptyState/EmptyState.tsx
|
|
2813
|
-
var
|
|
2814
|
-
var
|
|
2165
|
+
var import_react18 = __toESM(require("react"), 1);
|
|
2166
|
+
var import_material13 = require("@mui/material");
|
|
2815
2167
|
|
|
2816
|
-
// src/assets/ImgEmptyState/create.
|
|
2817
|
-
var
|
|
2818
|
-
var Create = () => {
|
|
2819
|
-
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)" }))));
|
|
2820
|
-
};
|
|
2168
|
+
// src/assets/ImgEmptyState/create.svg
|
|
2169
|
+
var create_default = "./create-KZGO2OZA.svg";
|
|
2821
2170
|
|
|
2822
|
-
// src/assets/ImgEmptyState/
|
|
2823
|
-
var
|
|
2824
|
-
var Empty = () => {
|
|
2825
|
-
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)" }))));
|
|
2826
|
-
};
|
|
2171
|
+
// src/assets/ImgEmptyState/error.svg
|
|
2172
|
+
var error_default = "./error-RUCZUXDN.svg";
|
|
2827
2173
|
|
|
2828
|
-
// src/assets/ImgEmptyState/
|
|
2829
|
-
var
|
|
2830
|
-
var Error2 = () => {
|
|
2831
|
-
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" }));
|
|
2832
|
-
};
|
|
2174
|
+
// src/assets/ImgEmptyState/empty.svg
|
|
2175
|
+
var empty_default = "./empty-3NEKE7WO.svg";
|
|
2833
2176
|
|
|
2834
|
-
// src/assets/ImgEmptyState/search.
|
|
2835
|
-
var
|
|
2836
|
-
var Search2 = () => {
|
|
2837
|
-
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)" }))));
|
|
2838
|
-
};
|
|
2177
|
+
// src/assets/ImgEmptyState/search.svg
|
|
2178
|
+
var search_default = "./search-OKSCVF2W.svg";
|
|
2839
2179
|
|
|
2840
2180
|
// src/Components/EmptyState/EmptyState.tsx
|
|
2841
2181
|
var EmptyStateImageUrls = {
|
|
2842
|
-
create:
|
|
2843
|
-
error:
|
|
2844
|
-
noResult:
|
|
2845
|
-
search:
|
|
2182
|
+
create: create_default,
|
|
2183
|
+
error: error_default,
|
|
2184
|
+
noResult: empty_default,
|
|
2185
|
+
search: search_default
|
|
2846
2186
|
};
|
|
2847
2187
|
var DefaultIcon = ({
|
|
2848
2188
|
state = "create",
|
|
2849
2189
|
size = "large"
|
|
2850
2190
|
}) => {
|
|
2851
|
-
const
|
|
2191
|
+
const imageUrl = EmptyStateImageUrls[state];
|
|
2852
2192
|
const iconSize = size === "small" ? { width: "40px", height: "40px" } : { width: "60px", height: "60px" };
|
|
2853
|
-
return /* @__PURE__ */
|
|
2193
|
+
return /* @__PURE__ */ import_react18.default.createElement("img", { src: imageUrl, alt: state, style: iconSize });
|
|
2854
2194
|
};
|
|
2855
2195
|
var EmptyState = ({
|
|
2856
2196
|
state = "create",
|
|
@@ -2859,12 +2199,12 @@ var EmptyState = ({
|
|
|
2859
2199
|
subtitle,
|
|
2860
2200
|
actions,
|
|
2861
2201
|
containerHeight = "100vh",
|
|
2862
|
-
icon = /* @__PURE__ */
|
|
2202
|
+
icon = /* @__PURE__ */ import_react18.default.createElement(DefaultIcon, { state, size })
|
|
2863
2203
|
}) => {
|
|
2864
2204
|
const titleVariant = size === "small" ? "subtitle2" : "h6";
|
|
2865
2205
|
const subtitleVariant = size === "small" ? "caption" : "body1";
|
|
2866
|
-
return /* @__PURE__ */
|
|
2867
|
-
|
|
2206
|
+
return /* @__PURE__ */ import_react18.default.createElement(
|
|
2207
|
+
import_material13.Stack,
|
|
2868
2208
|
{
|
|
2869
2209
|
alignItems: "center",
|
|
2870
2210
|
justifyContent: "center",
|
|
@@ -2872,17 +2212,17 @@ var EmptyState = ({
|
|
|
2872
2212
|
height: containerHeight,
|
|
2873
2213
|
"data-testid": "empty-state-container"
|
|
2874
2214
|
},
|
|
2875
|
-
icon && /* @__PURE__ */
|
|
2876
|
-
/* @__PURE__ */
|
|
2877
|
-
|
|
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,
|
|
2878
2218
|
{
|
|
2879
2219
|
variant: subtitleVariant,
|
|
2880
2220
|
textAlign: "center",
|
|
2881
2221
|
color: "text.secondary"
|
|
2882
2222
|
},
|
|
2883
2223
|
subtitle
|
|
2884
|
-
), actions && (actions == null ? void 0 : actions.length) > 0 && /* @__PURE__ */
|
|
2885
|
-
|
|
2224
|
+
), actions && (actions == null ? void 0 : actions.length) > 0 && /* @__PURE__ */ import_react18.default.createElement(
|
|
2225
|
+
import_material13.Stack,
|
|
2886
2226
|
{
|
|
2887
2227
|
direction: "row",
|
|
2888
2228
|
spacing: 2,
|
|
@@ -2891,15 +2231,15 @@ var EmptyState = ({
|
|
|
2891
2231
|
},
|
|
2892
2232
|
actions.map((action, index) => {
|
|
2893
2233
|
var _a, _b, _c, _d;
|
|
2894
|
-
return /* @__PURE__ */
|
|
2895
|
-
|
|
2234
|
+
return /* @__PURE__ */ import_react18.default.createElement(
|
|
2235
|
+
import_material13.Button,
|
|
2896
2236
|
{
|
|
2897
2237
|
key: index,
|
|
2898
2238
|
color: (_a = action.color) != null ? _a : "primary",
|
|
2899
2239
|
variant: (_b = action.variant) != null ? _b : "text",
|
|
2900
2240
|
size: (_c = action.size) != null ? _c : "small",
|
|
2901
|
-
startIcon: action.icon && action.iconPosition === "left" ? /* @__PURE__ */
|
|
2902
|
-
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,
|
|
2903
2243
|
onClick: action.onClick
|
|
2904
2244
|
},
|
|
2905
2245
|
capitalize((_d = action.text) != null ? _d : "action")
|
|
@@ -2910,8 +2250,8 @@ var EmptyState = ({
|
|
|
2910
2250
|
};
|
|
2911
2251
|
|
|
2912
2252
|
// src/Components/SCDialog.tsx
|
|
2913
|
-
var
|
|
2914
|
-
var
|
|
2253
|
+
var import_react19 = __toESM(require("react"), 1);
|
|
2254
|
+
var import_material14 = require("@mui/material");
|
|
2915
2255
|
var import_Grid25 = __toESM(require("@mui/material/Grid2"), 1);
|
|
2916
2256
|
var import_Close2 = __toESM(require("@mui/icons-material/Close"), 1);
|
|
2917
2257
|
var Muicon5 = __toESM(require("@mui/icons-material"), 1);
|
|
@@ -2920,8 +2260,8 @@ var SCDialog = ({ title, iconTitle, subtitle, content, actions, buttonDialog, di
|
|
|
2920
2260
|
let iconTitleValidation = "";
|
|
2921
2261
|
let IconTitle;
|
|
2922
2262
|
let ButtonIcon;
|
|
2923
|
-
const [open, setOpen] = (0,
|
|
2924
|
-
(0,
|
|
2263
|
+
const [open, setOpen] = (0, import_react19.useState)(show);
|
|
2264
|
+
(0, import_react19.useEffect)(() => {
|
|
2925
2265
|
if (show) {
|
|
2926
2266
|
handleOpen();
|
|
2927
2267
|
} else {
|
|
@@ -2946,7 +2286,7 @@ var SCDialog = ({ title, iconTitle, subtitle, content, actions, buttonDialog, di
|
|
|
2946
2286
|
});
|
|
2947
2287
|
if (iconTitle) {
|
|
2948
2288
|
if (Muicon5[iconTitle] == void 0) {
|
|
2949
|
-
if (iconTitle &&
|
|
2289
|
+
if (iconTitle && import_react19.default.isValidElement(iconTitle) && iconTitle.type == void 0) {
|
|
2950
2290
|
iconTitleValidation = "image";
|
|
2951
2291
|
IconTitle = iconTitle;
|
|
2952
2292
|
} else {
|
|
@@ -2971,9 +2311,9 @@ var SCDialog = ({ title, iconTitle, subtitle, content, actions, buttonDialog, di
|
|
|
2971
2311
|
}
|
|
2972
2312
|
};
|
|
2973
2313
|
const dialogActions = actions != null ? actions : [{ text: "Cerrar", fn: handleClose }];
|
|
2974
|
-
content = content != null ? content : { component: /* @__PURE__ */
|
|
2975
|
-
return /* @__PURE__ */
|
|
2976
|
-
|
|
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,
|
|
2977
2317
|
{
|
|
2978
2318
|
"data-testid": "dialog-element",
|
|
2979
2319
|
open: open || false,
|
|
@@ -2986,9 +2326,9 @@ var SCDialog = ({ title, iconTitle, subtitle, content, actions, buttonDialog, di
|
|
|
2986
2326
|
}
|
|
2987
2327
|
}
|
|
2988
2328
|
},
|
|
2989
|
-
title && /* @__PURE__ */
|
|
2990
|
-
/* @__PURE__ */
|
|
2991
|
-
|
|
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,
|
|
2992
2332
|
{
|
|
2993
2333
|
"data-testid": "dialog-content",
|
|
2994
2334
|
dividers: dividers ? dividers : false,
|
|
@@ -3015,7 +2355,7 @@ var SCDialog = ({ title, iconTitle, subtitle, content, actions, buttonDialog, di
|
|
|
3015
2355
|
}
|
|
3016
2356
|
}
|
|
3017
2357
|
},
|
|
3018
|
-
content.url ? /* @__PURE__ */
|
|
2358
|
+
content.url ? /* @__PURE__ */ import_react19.default.createElement(
|
|
3019
2359
|
"iframe",
|
|
3020
2360
|
{
|
|
3021
2361
|
style: { border: "none", minWidth: "100%", minHeight: "100%" },
|
|
@@ -3025,20 +2365,20 @@ var SCDialog = ({ title, iconTitle, subtitle, content, actions, buttonDialog, di
|
|
|
3025
2365
|
}
|
|
3026
2366
|
) : content.component
|
|
3027
2367
|
),
|
|
3028
|
-
dialogActions.length > 0 ? /* @__PURE__ */
|
|
3029
|
-
|
|
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,
|
|
3030
2370
|
{
|
|
3031
2371
|
variant: "text",
|
|
3032
2372
|
color: dialogActions[0].color || "primary",
|
|
3033
2373
|
size: "small",
|
|
3034
2374
|
onClick: dialogActions[0].fn,
|
|
3035
2375
|
disabled: dialogActions[0].disabled || false,
|
|
3036
|
-
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
|
|
3037
2377
|
},
|
|
3038
2378
|
dialogActions[0].text
|
|
3039
|
-
), /* @__PURE__ */
|
|
3040
|
-
return /* @__PURE__ */
|
|
3041
|
-
|
|
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,
|
|
3042
2382
|
{
|
|
3043
2383
|
key: index + 1,
|
|
3044
2384
|
variant: index === dialogActions.length - 2 ? "contained" : "text",
|
|
@@ -3046,13 +2386,13 @@ var SCDialog = ({ title, iconTitle, subtitle, content, actions, buttonDialog, di
|
|
|
3046
2386
|
size: "small",
|
|
3047
2387
|
onClick: boton.fn,
|
|
3048
2388
|
disabled: boton.disabled || false,
|
|
3049
|
-
startIcon: boton.icon ? /* @__PURE__ */
|
|
2389
|
+
startIcon: boton.icon ? /* @__PURE__ */ import_react19.default.createElement(import_material14.SvgIcon, { fontSize: "small", component: boton.icon }) : void 0
|
|
3050
2390
|
},
|
|
3051
2391
|
boton.text
|
|
3052
2392
|
);
|
|
3053
2393
|
}))) : dialogActions.map((boton, index) => {
|
|
3054
|
-
return /* @__PURE__ */
|
|
3055
|
-
|
|
2394
|
+
return /* @__PURE__ */ import_react19.default.createElement(
|
|
2395
|
+
import_material14.Button,
|
|
3056
2396
|
{
|
|
3057
2397
|
key: index,
|
|
3058
2398
|
variant: index === dialogActions.length - 1 ? "contained" : "text",
|
|
@@ -3060,7 +2400,7 @@ var SCDialog = ({ title, iconTitle, subtitle, content, actions, buttonDialog, di
|
|
|
3060
2400
|
size: "small",
|
|
3061
2401
|
onClick: boton.fn,
|
|
3062
2402
|
disabled: boton.disabled || false,
|
|
3063
|
-
startIcon: boton.icon ? /* @__PURE__ */
|
|
2403
|
+
startIcon: boton.icon ? /* @__PURE__ */ import_react19.default.createElement(import_material14.SvgIcon, { fontSize: "small", component: boton.icon }) : void 0
|
|
3064
2404
|
},
|
|
3065
2405
|
boton.text
|
|
3066
2406
|
);
|
|
@@ -3069,12 +2409,12 @@ var SCDialog = ({ title, iconTitle, subtitle, content, actions, buttonDialog, di
|
|
|
3069
2409
|
};
|
|
3070
2410
|
|
|
3071
2411
|
// src/Components/SCMenu.tsx
|
|
3072
|
-
var
|
|
3073
|
-
var
|
|
2412
|
+
var import_react21 = __toESM(require("react"), 1);
|
|
2413
|
+
var import_material15 = require("@mui/material");
|
|
3074
2414
|
var import_Grid26 = __toESM(require("@mui/material/Grid2"), 1);
|
|
3075
2415
|
|
|
3076
2416
|
// src/Components/Hooks/useWindowDimensions.ts
|
|
3077
|
-
var
|
|
2417
|
+
var import_react20 = require("react");
|
|
3078
2418
|
function getWindowDimensions() {
|
|
3079
2419
|
const { innerWidth: width, innerHeight: height } = window;
|
|
3080
2420
|
return {
|
|
@@ -3083,8 +2423,8 @@ function getWindowDimensions() {
|
|
|
3083
2423
|
};
|
|
3084
2424
|
}
|
|
3085
2425
|
function useWindowDimensions() {
|
|
3086
|
-
const [windowDimensions, setWindowDimensions] = (0,
|
|
3087
|
-
(0,
|
|
2426
|
+
const [windowDimensions, setWindowDimensions] = (0, import_react20.useState)(getWindowDimensions());
|
|
2427
|
+
(0, import_react20.useEffect)(() => {
|
|
3088
2428
|
function handleResize() {
|
|
3089
2429
|
setWindowDimensions(getWindowDimensions());
|
|
3090
2430
|
}
|
|
@@ -3102,12 +2442,12 @@ var SCMenu = ({ header, options, defaultOption, disable, widthMenu, heightMenu,
|
|
|
3102
2442
|
const pageSize = widthPage ? parseInt(widthPage) : width - menuSize;
|
|
3103
2443
|
const widthContainer = menuSize + pageSize;
|
|
3104
2444
|
let heightContainer = heightMenu ? parseInt(heightMenu) : height - 76;
|
|
3105
|
-
const [selectedIndex, setSelectedIndex] =
|
|
3106
|
-
const [value, setValue] =
|
|
3107
|
-
|
|
2445
|
+
const [selectedIndex, setSelectedIndex] = import_react21.default.useState("1");
|
|
2446
|
+
const [value, setValue] = import_react21.default.useState("1");
|
|
2447
|
+
import_react21.default.useEffect(() => {
|
|
3108
2448
|
heightContainer = heightMenu ? parseInt(heightMenu) : height - 76;
|
|
3109
2449
|
}, [height]);
|
|
3110
|
-
|
|
2450
|
+
import_react21.default.useEffect(() => {
|
|
3111
2451
|
if (defaultOption) {
|
|
3112
2452
|
handleClickMenusItem(event, void 0);
|
|
3113
2453
|
}
|
|
@@ -3137,34 +2477,34 @@ var SCMenu = ({ header, options, defaultOption, disable, widthMenu, heightMenu,
|
|
|
3137
2477
|
setValue(String(index + 1));
|
|
3138
2478
|
}
|
|
3139
2479
|
};
|
|
3140
|
-
return /* @__PURE__ */
|
|
3141
|
-
|
|
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,
|
|
3142
2482
|
{
|
|
3143
2483
|
disabled: disable == true ? true : false,
|
|
3144
2484
|
key: index,
|
|
3145
2485
|
selected: String(index + 1) === selectedIndex,
|
|
3146
2486
|
onClick: (event2) => handleClickMenusItem(event2, index)
|
|
3147
2487
|
},
|
|
3148
|
-
option.iconLeft ? /* @__PURE__ */
|
|
3149
|
-
/* @__PURE__ */
|
|
3150
|
-
), 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")))));
|
|
3151
2491
|
};
|
|
3152
2492
|
|
|
3153
2493
|
// src/Components/SCTabs.tsx
|
|
3154
|
-
var
|
|
3155
|
-
var
|
|
2494
|
+
var import_react22 = __toESM(require("react"), 1);
|
|
2495
|
+
var import_material16 = require("@mui/material");
|
|
3156
2496
|
var import_TabPanel = __toESM(require("@mui/lab/TabPanel"), 1);
|
|
3157
2497
|
var import_TabContext = __toESM(require("@mui/lab/TabContext"), 1);
|
|
3158
2498
|
var Muicon7 = __toESM(require("@mui/icons-material"), 1);
|
|
3159
2499
|
var SCTabs = ({ options, defaultOption, typeIcon, background, iconPosition, colorTab, orientation, variant, scrollButtons, children }) => {
|
|
3160
|
-
const [toast, setToast] =
|
|
2500
|
+
const [toast, setToast] = import_react22.default.useState(null);
|
|
3161
2501
|
let i = 0;
|
|
3162
2502
|
let j = 0;
|
|
3163
2503
|
let k = 0;
|
|
3164
2504
|
let l = 0;
|
|
3165
2505
|
let validateTypeIcon = true;
|
|
3166
|
-
const [value, setValue] =
|
|
3167
|
-
(0,
|
|
2506
|
+
const [value, setValue] = import_react22.default.useState("1");
|
|
2507
|
+
(0, import_react22.useEffect)(() => {
|
|
3168
2508
|
if (defaultOption) {
|
|
3169
2509
|
handleChange(event, void 0);
|
|
3170
2510
|
}
|
|
@@ -3214,8 +2554,8 @@ var SCTabs = ({ options, defaultOption, typeIcon, background, iconPosition, colo
|
|
|
3214
2554
|
setValue(newValue);
|
|
3215
2555
|
}
|
|
3216
2556
|
};
|
|
3217
|
-
return /* @__PURE__ */
|
|
3218
|
-
|
|
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,
|
|
3219
2559
|
{
|
|
3220
2560
|
"data-testid": "tab-container",
|
|
3221
2561
|
value,
|
|
@@ -3228,8 +2568,8 @@ var SCTabs = ({ options, defaultOption, typeIcon, background, iconPosition, colo
|
|
|
3228
2568
|
orientation: orientation || "horizontal",
|
|
3229
2569
|
sx: { borderBottom: orientation == "vertical" ? 0 : 1, borderRight: orientation == "vertical" ? 1 : 0, borderColor: "divider", background: background || "" }
|
|
3230
2570
|
},
|
|
3231
|
-
options.map((option) => /* @__PURE__ */
|
|
3232
|
-
|
|
2571
|
+
options.map((option) => /* @__PURE__ */ import_react22.default.createElement(
|
|
2572
|
+
import_material16.Tab,
|
|
3233
2573
|
{
|
|
3234
2574
|
"data-testid": "tab-item",
|
|
3235
2575
|
value: String(i = i + 1),
|
|
@@ -3237,8 +2577,8 @@ var SCTabs = ({ options, defaultOption, typeIcon, background, iconPosition, colo
|
|
|
3237
2577
|
label: option.name || "",
|
|
3238
2578
|
disabled: option.disabled || false,
|
|
3239
2579
|
iconPosition: iconPosition || "end",
|
|
3240
|
-
icon: typeIcon == "badge" ? /* @__PURE__ */
|
|
3241
|
-
|
|
2580
|
+
icon: typeIcon == "badge" ? /* @__PURE__ */ import_react22.default.createElement(
|
|
2581
|
+
import_material16.Badge,
|
|
3242
2582
|
{
|
|
3243
2583
|
sx: {
|
|
3244
2584
|
width: "20px",
|
|
@@ -3252,38 +2592,33 @@ var SCTabs = ({ options, defaultOption, typeIcon, background, iconPosition, colo
|
|
|
3252
2592
|
badgeContent: option.iconOrBadge,
|
|
3253
2593
|
color: value == String(i) ? colorTab ? colorTab : "primary" : "default"
|
|
3254
2594
|
}
|
|
3255
|
-
) : 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" } }) : "",
|
|
3256
2596
|
sx: { "& .MuiTab-icon": { margin: "0px !important" }, padding: "10px 16px", gap: "4px" }
|
|
3257
2597
|
}
|
|
3258
2598
|
))
|
|
3259
|
-
), children, options.map((option) => /* @__PURE__ */
|
|
2599
|
+
), children, options.map((option) => /* @__PURE__ */ import_react22.default.createElement(
|
|
3260
2600
|
import_TabPanel.default,
|
|
3261
2601
|
{
|
|
3262
2602
|
key: k = k + 1,
|
|
3263
2603
|
value: String(l = l + 1),
|
|
3264
2604
|
sx: { padding: "16px" }
|
|
3265
2605
|
},
|
|
3266
|
-
option.page ? option.page : /* @__PURE__ */
|
|
3267
|
-
)))) : /* @__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))));
|
|
3268
2608
|
};
|
|
3269
2609
|
|
|
3270
2610
|
// src/Components/Calendario/Calendar.tsx
|
|
3271
|
-
var
|
|
3272
|
-
var
|
|
2611
|
+
var import_react28 = __toESM(require("react"), 1);
|
|
2612
|
+
var import_material22 = require("@mui/material");
|
|
2613
|
+
var import_dayjs7 = __toESM(require("dayjs"), 1);
|
|
3273
2614
|
|
|
3274
2615
|
// src/Components/Calendario/CalendarToolbar.tsx
|
|
3275
|
-
var
|
|
3276
|
-
var
|
|
3277
|
-
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");
|
|
3278
2619
|
var import_dayjs2 = __toESM(require("dayjs"), 1);
|
|
3279
|
-
var import_updateLocale = __toESM(require("dayjs/plugin/updateLocale"), 1);
|
|
3280
2620
|
var import_es2 = require("dayjs/locale/es");
|
|
3281
2621
|
import_dayjs2.default.locale("es");
|
|
3282
|
-
import_dayjs2.default.extend(import_updateLocale.default);
|
|
3283
|
-
import_dayjs2.default.updateLocale("en", {
|
|
3284
|
-
weekStart: 0
|
|
3285
|
-
// 0 = domingo
|
|
3286
|
-
});
|
|
3287
2622
|
var CalendarToolbar = ({
|
|
3288
2623
|
labelDate,
|
|
3289
2624
|
view,
|
|
@@ -3291,7 +2626,7 @@ var CalendarToolbar = ({
|
|
|
3291
2626
|
onNavigate,
|
|
3292
2627
|
children
|
|
3293
2628
|
}) => {
|
|
3294
|
-
const [anchorEl, setAnchorEl] = (0,
|
|
2629
|
+
const [anchorEl, setAnchorEl] = (0, import_react23.useState)(null);
|
|
3295
2630
|
const open = Boolean(anchorEl);
|
|
3296
2631
|
const handleMenuOpen = (event2) => {
|
|
3297
2632
|
setAnchorEl(event2.currentTarget);
|
|
@@ -3304,26 +2639,24 @@ var CalendarToolbar = ({
|
|
|
3304
2639
|
handleMenuClose();
|
|
3305
2640
|
};
|
|
3306
2641
|
const getFormattedDate = () => {
|
|
3307
|
-
const sunday = labelDate.day(0);
|
|
3308
2642
|
if (view === "month") {
|
|
3309
|
-
|
|
3310
|
-
return textMonth.charAt(0).toUpperCase() + textMonth.slice(1);
|
|
2643
|
+
return labelDate.format("MMMM YYYY");
|
|
3311
2644
|
}
|
|
3312
2645
|
if (view === "week") {
|
|
3313
|
-
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")}`;
|
|
3314
2647
|
}
|
|
3315
2648
|
return labelDate.format(" DD MMMM YYYY");
|
|
3316
2649
|
};
|
|
3317
|
-
return /* @__PURE__ */
|
|
3318
|
-
|
|
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,
|
|
3319
2652
|
{
|
|
3320
2653
|
label: "Hoy",
|
|
3321
|
-
icon: /* @__PURE__ */
|
|
2654
|
+
icon: /* @__PURE__ */ import_react23.default.createElement(import_icons_material10.LightModeOutlined, { fontSize: "small" }),
|
|
3322
2655
|
color: "primary",
|
|
3323
2656
|
onClick: () => onNavigate("TODAY")
|
|
3324
2657
|
}
|
|
3325
|
-
)), /* @__PURE__ */
|
|
3326
|
-
|
|
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,
|
|
3327
2660
|
{
|
|
3328
2661
|
anchorEl,
|
|
3329
2662
|
open,
|
|
@@ -3331,15 +2664,15 @@ var CalendarToolbar = ({
|
|
|
3331
2664
|
anchorOrigin: { vertical: "bottom", horizontal: "center" },
|
|
3332
2665
|
transformOrigin: { vertical: "top", horizontal: "center" }
|
|
3333
2666
|
},
|
|
3334
|
-
/* @__PURE__ */
|
|
3335
|
-
/* @__PURE__ */
|
|
3336
|
-
/* @__PURE__ */
|
|
3337
|
-
)), 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" }), " ");
|
|
3338
2671
|
};
|
|
3339
2672
|
|
|
3340
2673
|
// src/Components/Calendario/Views/MonthView.tsx
|
|
3341
|
-
var
|
|
3342
|
-
var
|
|
2674
|
+
var import_react25 = __toESM(require("react"), 1);
|
|
2675
|
+
var import_material19 = require("@mui/material");
|
|
3343
2676
|
var import_Add = __toESM(require("@mui/icons-material/Add"), 1);
|
|
3344
2677
|
var import_dayjs4 = __toESM(require("dayjs"), 1);
|
|
3345
2678
|
var import_localeData = __toESM(require("dayjs/plugin/localeData"), 1);
|
|
@@ -3365,32 +2698,21 @@ var stateColors = {
|
|
|
3365
2698
|
Asignada: "warning.main",
|
|
3366
2699
|
Finalizado: "primary.main",
|
|
3367
2700
|
Vencida: "error.main",
|
|
3368
|
-
EnProgreso: "success.main"
|
|
3369
|
-
Aplazada: "grey.400",
|
|
3370
|
-
Generada: "secondary.main"
|
|
2701
|
+
EnProgreso: "success.main"
|
|
3371
2702
|
};
|
|
3372
2703
|
|
|
3373
2704
|
// src/Components/Calendario/Event.tsx
|
|
3374
|
-
var
|
|
3375
|
-
var
|
|
3376
|
-
var CalendarEventCard = ({ event: event2, color, sx, onClick
|
|
3377
|
-
|
|
3378
|
-
|
|
3379
|
-
setAnchorEl(event3.currentTarget);
|
|
3380
|
-
};
|
|
3381
|
-
const handlePopoverClose = () => {
|
|
3382
|
-
setAnchorEl(null);
|
|
3383
|
-
};
|
|
3384
|
-
const open = Boolean(anchorEl);
|
|
3385
|
-
return /* @__PURE__ */ import_react30.default.createElement(
|
|
3386
|
-
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,
|
|
3387
2710
|
{
|
|
3388
2711
|
direction: "row",
|
|
3389
2712
|
padding: 0.5,
|
|
3390
2713
|
borderRadius: 0.5,
|
|
3391
2714
|
alignItems: "flex-start",
|
|
3392
2715
|
minHeight: "20px",
|
|
3393
|
-
onMouseOver: () => onHover == null ? void 0 : onHover(event2),
|
|
3394
2716
|
onClick: (e) => {
|
|
3395
2717
|
e.stopPropagation();
|
|
3396
2718
|
onClick == null ? void 0 : onClick(event2);
|
|
@@ -3403,8 +2725,8 @@ var CalendarEventCard = ({ event: event2, color, sx, onClick, onHover }) => {
|
|
|
3403
2725
|
cursor: onClick ? "pointer" : "default"
|
|
3404
2726
|
}, sx)
|
|
3405
2727
|
},
|
|
3406
|
-
/* @__PURE__ */
|
|
3407
|
-
|
|
2728
|
+
/* @__PURE__ */ import_react24.default.createElement(
|
|
2729
|
+
import_material18.Divider,
|
|
3408
2730
|
{
|
|
3409
2731
|
orientation: "vertical",
|
|
3410
2732
|
flexItem: true,
|
|
@@ -3415,8 +2737,8 @@ var CalendarEventCard = ({ event: event2, color, sx, onClick, onHover }) => {
|
|
|
3415
2737
|
}
|
|
3416
2738
|
}
|
|
3417
2739
|
),
|
|
3418
|
-
/* @__PURE__ */
|
|
3419
|
-
|
|
2740
|
+
/* @__PURE__ */ import_react24.default.createElement(
|
|
2741
|
+
import_material18.Box,
|
|
3420
2742
|
{
|
|
3421
2743
|
px: 1,
|
|
3422
2744
|
py: 0.5,
|
|
@@ -3425,8 +2747,8 @@ var CalendarEventCard = ({ event: event2, color, sx, onClick, onHover }) => {
|
|
|
3425
2747
|
display: "flex",
|
|
3426
2748
|
alignItems: "center"
|
|
3427
2749
|
},
|
|
3428
|
-
/* @__PURE__ */
|
|
3429
|
-
|
|
2750
|
+
/* @__PURE__ */ import_react24.default.createElement(
|
|
2751
|
+
import_material18.Typography,
|
|
3430
2752
|
{
|
|
3431
2753
|
color: "text.primary",
|
|
3432
2754
|
variant: "caption",
|
|
@@ -3435,66 +2757,30 @@ var CalendarEventCard = ({ event: event2, color, sx, onClick, onHover }) => {
|
|
|
3435
2757
|
overflow: "hidden",
|
|
3436
2758
|
textOverflow: "ellipsis",
|
|
3437
2759
|
whiteSpace: "nowrap"
|
|
3438
|
-
}
|
|
3439
|
-
onMouseEnter: handlePopoverOpen,
|
|
3440
|
-
onMouseLeave: handlePopoverClose
|
|
3441
|
-
},
|
|
3442
|
-
event2.title.charAt(0).toUpperCase() + event2.title.slice(1).toLowerCase()
|
|
3443
|
-
),
|
|
3444
|
-
/* @__PURE__ */ import_react30.default.createElement(
|
|
3445
|
-
import_material19.Popover,
|
|
3446
|
-
{
|
|
3447
|
-
id: "mouse-over-popover",
|
|
3448
|
-
sx: { pointerEvents: "none" },
|
|
3449
|
-
open,
|
|
3450
|
-
anchorEl,
|
|
3451
|
-
anchorOrigin: {
|
|
3452
|
-
vertical: "top",
|
|
3453
|
-
horizontal: "right"
|
|
3454
|
-
},
|
|
3455
|
-
transformOrigin: {
|
|
3456
|
-
vertical: "bottom",
|
|
3457
|
-
horizontal: "right"
|
|
3458
|
-
},
|
|
3459
|
-
onClose: handlePopoverClose,
|
|
3460
|
-
disableRestoreFocus: true
|
|
2760
|
+
}
|
|
3461
2761
|
},
|
|
3462
|
-
|
|
2762
|
+
capitalize(event2.title)
|
|
3463
2763
|
)
|
|
3464
2764
|
)
|
|
3465
2765
|
);
|
|
3466
2766
|
};
|
|
3467
2767
|
|
|
3468
|
-
// src/assets/LogoCalendario.tsx
|
|
3469
|
-
var import_react31 = __toESM(require("react"), 1);
|
|
3470
|
-
var LogoCalendario = () => {
|
|
3471
|
-
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)" }))));
|
|
3472
|
-
};
|
|
3473
|
-
|
|
3474
2768
|
// src/Components/Calendario/Views/MonthView.tsx
|
|
3475
2769
|
import_dayjs4.default.extend(import_localeData.default);
|
|
3476
2770
|
import_dayjs4.default.extend(import_isBetween.default);
|
|
3477
|
-
var MonthView = ({ events,
|
|
3478
|
-
const noEvents = events.length === 0;
|
|
2771
|
+
var MonthView = ({ events, onDayClick, onMoreClick, currentDate, onEventClick }) => {
|
|
3479
2772
|
const days = getMonthDays(currentDate);
|
|
3480
2773
|
const weekDays = Array.from({ length: 7 }, (_, i) => (0, import_dayjs4.default)().day(i));
|
|
3481
|
-
const [openDrawer, setOpenDrawer] =
|
|
3482
|
-
const [selectedDay, setSelectedDay] =
|
|
3483
|
-
const [selectedEvents, setSelectedEvents] =
|
|
3484
|
-
return /* @__PURE__ */
|
|
3485
|
-
EmptyState,
|
|
3486
|
-
{
|
|
3487
|
-
title: "Inicia la gesti\xF3n de las actividades",
|
|
3488
|
-
subtitle: "Selecciona un mec\xE1nico y as\xEDgnale las actividades a realizar.",
|
|
3489
|
-
icon: /* @__PURE__ */ import_react32.default.createElement(LogoCalendario, null)
|
|
3490
|
-
}
|
|
3491
|
-
) : /* @__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) => {
|
|
3492
2778
|
const dayEvents = events.filter(
|
|
3493
2779
|
(e) => day.isBetween(e.start.startOf("day"), e.end.endOf("day"), null, "[]")
|
|
3494
2780
|
);
|
|
3495
2781
|
const isCurrentMonth = day.month() === currentDate.month();
|
|
3496
|
-
return /* @__PURE__ */
|
|
3497
|
-
|
|
2782
|
+
return /* @__PURE__ */ import_react25.default.createElement(
|
|
2783
|
+
import_material19.Paper,
|
|
3498
2784
|
{
|
|
3499
2785
|
key: day.toString(),
|
|
3500
2786
|
onClick: () => onDayClick == null ? void 0 : onDayClick(day),
|
|
@@ -3510,8 +2796,8 @@ var MonthView = ({ events, isLoading, onDayClick, onMoreClick, currentDate, onEv
|
|
|
3510
2796
|
overflow: "hidden"
|
|
3511
2797
|
}
|
|
3512
2798
|
},
|
|
3513
|
-
/* @__PURE__ */
|
|
3514
|
-
|
|
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,
|
|
3515
2801
|
{
|
|
3516
2802
|
sx: {
|
|
3517
2803
|
width: 24,
|
|
@@ -3523,16 +2809,16 @@ var MonthView = ({ events, isLoading, onDayClick, onMoreClick, currentDate, onEv
|
|
|
3523
2809
|
justifyContent: "center"
|
|
3524
2810
|
}
|
|
3525
2811
|
},
|
|
3526
|
-
/* @__PURE__ */
|
|
3527
|
-
|
|
2812
|
+
/* @__PURE__ */ import_react25.default.createElement(
|
|
2813
|
+
import_material19.Typography,
|
|
3528
2814
|
{
|
|
3529
2815
|
variant: "body2",
|
|
3530
2816
|
sx: { color: isToday(day) ? "white" : "text.secondary" }
|
|
3531
2817
|
},
|
|
3532
2818
|
day.date()
|
|
3533
2819
|
)
|
|
3534
|
-
), dayEvents.length > 2 && /* @__PURE__ */
|
|
3535
|
-
|
|
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,
|
|
3536
2822
|
{
|
|
3537
2823
|
color: "primary",
|
|
3538
2824
|
size: "small",
|
|
@@ -3543,46 +2829,64 @@ var MonthView = ({ events, isLoading, onDayClick, onMoreClick, currentDate, onEv
|
|
|
3543
2829
|
setSelectedEvents(dayEvents);
|
|
3544
2830
|
}
|
|
3545
2831
|
},
|
|
3546
|
-
/* @__PURE__ */
|
|
2832
|
+
/* @__PURE__ */ import_react25.default.createElement(import_Add.default, { fontSize: "small" })
|
|
3547
2833
|
)))),
|
|
3548
|
-
/* @__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(
|
|
3549
2835
|
CalendarEventCard,
|
|
3550
2836
|
{
|
|
3551
2837
|
key: `${event2.id}-${day.toString()}`,
|
|
3552
2838
|
event: event2,
|
|
3553
2839
|
color: stateColors[event2.state],
|
|
3554
|
-
onClick: () => onEventClick == null ? void 0 : onEventClick(event2, day)
|
|
3555
|
-
onHover: onEventHover
|
|
2840
|
+
onClick: () => onEventClick == null ? void 0 : onEventClick(event2, day)
|
|
3556
2841
|
}
|
|
3557
2842
|
))),
|
|
3558
|
-
dayEvents.length > 2 && /* @__PURE__ */
|
|
3559
|
-
|
|
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,
|
|
3560
2845
|
{
|
|
3561
|
-
|
|
3562
|
-
|
|
3563
|
-
|
|
3564
|
-
|
|
3565
|
-
|
|
3566
|
-
|
|
3567
|
-
|
|
3568
|
-
|
|
3569
|
-
|
|
3570
|
-
|
|
3571
|
-
|
|
3572
|
-
|
|
3573
|
-
|
|
3574
|
-
|
|
3575
|
-
|
|
3576
|
-
|
|
3577
|
-
|
|
3578
|
-
|
|
3579
|
-
|
|
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(
|
|
3580
2884
|
CalendarEventCard,
|
|
3581
2885
|
{
|
|
3582
|
-
|
|
3583
|
-
|
|
3584
|
-
|
|
3585
|
-
|
|
2886
|
+
key: `${event2.id}-${day.toString()}`,
|
|
2887
|
+
event: event2,
|
|
2888
|
+
color: stateColors[event2.state],
|
|
2889
|
+
onClick: () => onEventClick == null ? void 0 : onEventClick(event2, day),
|
|
3586
2890
|
sx: {
|
|
3587
2891
|
whiteSpace: "normal",
|
|
3588
2892
|
"& .MuiTypography-root": {
|
|
@@ -3592,68 +2896,26 @@ var MonthView = ({ events, isLoading, onDayClick, onMoreClick, currentDate, onEv
|
|
|
3592
2896
|
}
|
|
3593
2897
|
}
|
|
3594
2898
|
}
|
|
3595
|
-
))
|
|
3596
|
-
|
|
3597
|
-
|
|
3598
|
-
|
|
3599
|
-
|
|
3600
|
-
|
|
3601
|
-
overflow: "auto",
|
|
3602
|
-
p: 1,
|
|
3603
|
-
pt: 1,
|
|
3604
|
-
display: "flex",
|
|
3605
|
-
flexDirection: "column",
|
|
3606
|
-
gap: 1.5
|
|
3607
|
-
},
|
|
3608
|
-
rest.map((event2) => /* @__PURE__ */ import_react32.default.createElement(
|
|
3609
|
-
CalendarEventCard,
|
|
3610
|
-
{
|
|
3611
|
-
key: `${event2.id}-${day.toString()}`,
|
|
3612
|
-
event: event2,
|
|
3613
|
-
color: stateColors[event2.state],
|
|
3614
|
-
onClick: () => onEventClick == null ? void 0 : onEventClick(event2, day),
|
|
3615
|
-
onHover: onEventHover,
|
|
3616
|
-
sx: {
|
|
3617
|
-
whiteSpace: "normal",
|
|
3618
|
-
"& .MuiTypography-root": {
|
|
3619
|
-
whiteSpace: "normal",
|
|
3620
|
-
overflow: "visible",
|
|
3621
|
-
textOverflow: "unset"
|
|
3622
|
-
}
|
|
3623
|
-
}
|
|
3624
|
-
}
|
|
3625
|
-
))
|
|
3626
|
-
));
|
|
3627
|
-
})()
|
|
3628
|
-
}]
|
|
3629
|
-
}
|
|
3630
|
-
)
|
|
3631
|
-
)
|
|
2899
|
+
))
|
|
2900
|
+
));
|
|
2901
|
+
})()
|
|
2902
|
+
}]
|
|
2903
|
+
}
|
|
2904
|
+
))
|
|
3632
2905
|
);
|
|
3633
2906
|
}))));
|
|
3634
2907
|
};
|
|
3635
2908
|
|
|
3636
2909
|
// src/Components/Calendario/Views/WeekView.tsx
|
|
3637
|
-
var
|
|
3638
|
-
var
|
|
2910
|
+
var import_react26 = __toESM(require("react"), 1);
|
|
2911
|
+
var import_material20 = require("@mui/material");
|
|
3639
2912
|
var import_dayjs5 = __toESM(require("dayjs"), 1);
|
|
3640
2913
|
var import_localeData2 = __toESM(require("dayjs/plugin/localeData"), 1);
|
|
3641
2914
|
import_dayjs5.default.extend(import_localeData2.default);
|
|
3642
|
-
var WeekView = ({
|
|
3643
|
-
events,
|
|
3644
|
-
currentDate,
|
|
3645
|
-
isLoading,
|
|
3646
|
-
onDayClick,
|
|
3647
|
-
onEventClick,
|
|
3648
|
-
onEventHover,
|
|
3649
|
-
startHour = 0,
|
|
3650
|
-
endHour = 23
|
|
3651
|
-
}) => {
|
|
3652
|
-
const noEvents = events.length === 0;
|
|
3653
|
-
const todayString = (0, import_dayjs5.default)().format("YYYY-MM-DD");
|
|
2915
|
+
var WeekView = ({ events, currentDate, onDayClick, onEventClick }) => {
|
|
3654
2916
|
const startOfWeek2 = currentDate.startOf("week");
|
|
3655
2917
|
const days = Array.from({ length: 7 }, (_, i) => startOfWeek2.add(i, "day"));
|
|
3656
|
-
const
|
|
2918
|
+
const hours2 = Array.from({ length: 24 }, (_, i) => i);
|
|
3657
2919
|
const getCellBorderType = (cellHour, dayEvents) => {
|
|
3658
2920
|
for (const event2 of dayEvents) {
|
|
3659
2921
|
const start = event2.start.hour() + event2.start.minute() / 60;
|
|
@@ -3661,7 +2923,8 @@ var WeekView = ({
|
|
|
3661
2923
|
const cellStart = cellHour;
|
|
3662
2924
|
const cellEnd = cellHour + 1;
|
|
3663
2925
|
if (cellEnd > start && cellStart < end) {
|
|
3664
|
-
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";
|
|
3665
2928
|
if (Math.abs(cellStart - start) < 0.01) return "start";
|
|
3666
2929
|
if (Math.abs(cellEnd - end) < 0.01) return "end";
|
|
3667
2930
|
return "middle";
|
|
@@ -3669,122 +2932,92 @@ var WeekView = ({
|
|
|
3669
2932
|
}
|
|
3670
2933
|
return "none";
|
|
3671
2934
|
};
|
|
3672
|
-
return /* @__PURE__ */
|
|
3673
|
-
|
|
3674
|
-
|
|
3675
|
-
|
|
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,
|
|
3676
2966
|
{
|
|
3677
2967
|
key: day.toString(),
|
|
3678
|
-
height: 40,
|
|
3679
2968
|
flex: 1,
|
|
3680
|
-
|
|
3681
|
-
|
|
3682
|
-
|
|
3683
|
-
|
|
3684
|
-
|
|
3685
|
-
alignItems: "flex-start",
|
|
3686
|
-
bgcolor: isToday2 ? "primary.100" : "transparent",
|
|
3687
|
-
borderRadius: isToday2 ? "6px 6px 0 0" : "0",
|
|
3688
|
-
borderBottom: isToday2 ? 2 : 0,
|
|
3689
|
-
borderColor: isToday2 ? "primary.main" : "transparent"
|
|
3690
|
-
},
|
|
3691
|
-
/* @__PURE__ */ import_react33.default.createElement(import_material21.Typography, { variant: "h6", color: "text.primary" }, day.format("D")),
|
|
3692
|
-
/* @__PURE__ */ import_react33.default.createElement(import_material21.Typography, { variant: "caption", color: "text.secondary" }, day.format("dddd"))
|
|
3693
|
-
);
|
|
3694
|
-
})), 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(
|
|
3695
|
-
EmptyState,
|
|
3696
|
-
{
|
|
3697
|
-
title: "Inicia la gesti\xF3n de las actividades",
|
|
3698
|
-
subtitle: "Selecciona un mec\xE1nico y as\xEDgnale las actividades a realizar.",
|
|
3699
|
-
icon: /* @__PURE__ */ import_react33.default.createElement(LogoCalendario, null)
|
|
3700
|
-
}
|
|
3701
|
-
) : (
|
|
3702
|
-
// Grid de horas y eventos
|
|
3703
|
-
/* @__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(
|
|
3704
|
-
import_material21.Box,
|
|
3705
|
-
{
|
|
3706
|
-
key: h,
|
|
3707
|
-
height: 60,
|
|
3708
|
-
textAlign: "right",
|
|
3709
|
-
pr: 1,
|
|
3710
|
-
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)
|
|
3711
2974
|
},
|
|
3712
|
-
|
|
3713
|
-
|
|
3714
|
-
|
|
3715
|
-
|
|
3716
|
-
|
|
3717
|
-
|
|
3718
|
-
|
|
3719
|
-
|
|
3720
|
-
|
|
3721
|
-
|
|
3722
|
-
|
|
3723
|
-
|
|
3724
|
-
|
|
3725
|
-
|
|
3726
|
-
|
|
3727
|
-
|
|
3728
|
-
|
|
3729
|
-
|
|
3730
|
-
|
|
3731
|
-
|
|
3732
|
-
|
|
3733
|
-
|
|
3734
|
-
|
|
3735
|
-
|
|
3736
|
-
|
|
3737
|
-
|
|
3738
|
-
|
|
3739
|
-
|
|
3740
|
-
|
|
3741
|
-
|
|
3742
|
-
|
|
3743
|
-
|
|
3744
|
-
}),
|
|
3745
|
-
dayEvents.map((event2) => {
|
|
3746
|
-
const eventStart = day.isSame(event2.start, "day") ? event2.start : day.startOf("day").hour(startHour).minute(0);
|
|
3747
|
-
const eventEnd = day.isSame(event2.end, "day") ? event2.end : day.endOf("day").hour(endHour).minute(59);
|
|
3748
|
-
const startMinutes = (eventStart.hour() - startHour) * 60 + eventStart.minute();
|
|
3749
|
-
const durationMinutes = eventEnd.diff(eventStart, "minute");
|
|
3750
|
-
return /* @__PURE__ */ import_react33.default.createElement(
|
|
3751
|
-
CalendarEventCard,
|
|
3752
|
-
{
|
|
3753
|
-
key: `${event2.id}-${day.toString()}`,
|
|
3754
|
-
event: event2,
|
|
3755
|
-
color: stateColors[event2.state],
|
|
3756
|
-
onClick: () => onEventClick == null ? void 0 : onEventClick(event2, day),
|
|
3757
|
-
onHover: onEventHover,
|
|
3758
|
-
sx: {
|
|
3759
|
-
position: "absolute",
|
|
3760
|
-
top: `${startMinutes}px`,
|
|
3761
|
-
left: 4,
|
|
3762
|
-
right: 4,
|
|
3763
|
-
cursor: "pointer",
|
|
3764
|
-
height: `${durationMinutes}px`
|
|
3765
|
-
}
|
|
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"
|
|
3766
3007
|
}
|
|
3767
|
-
|
|
3768
|
-
|
|
3769
|
-
)
|
|
3770
|
-
|
|
3771
|
-
));
|
|
3008
|
+
}
|
|
3009
|
+
);
|
|
3010
|
+
})
|
|
3011
|
+
);
|
|
3012
|
+
})));
|
|
3772
3013
|
};
|
|
3773
3014
|
|
|
3774
3015
|
// src/Components/Calendario/Views/DayView.tsx
|
|
3775
|
-
var
|
|
3776
|
-
var
|
|
3016
|
+
var import_react27 = __toESM(require("react"), 1);
|
|
3017
|
+
var import_material21 = require("@mui/material");
|
|
3777
3018
|
var import_dayjs6 = __toESM(require("dayjs"), 1);
|
|
3778
|
-
var
|
|
3779
|
-
|
|
3780
|
-
currentDate,
|
|
3781
|
-
isLoading,
|
|
3782
|
-
onEventClick,
|
|
3783
|
-
onEventHover,
|
|
3784
|
-
startHour = 0,
|
|
3785
|
-
endHour = 24
|
|
3786
|
-
}) => {
|
|
3787
|
-
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 }) => {
|
|
3788
3021
|
const getCellBorderType = (cellHour, dayEvents2) => {
|
|
3789
3022
|
for (const event2 of dayEvents2) {
|
|
3790
3023
|
const start = event2.start.hour() + event2.start.minute() / 60;
|
|
@@ -3792,7 +3025,8 @@ var DayView = ({
|
|
|
3792
3025
|
const cellStart = cellHour;
|
|
3793
3026
|
const cellEnd = cellHour + 1;
|
|
3794
3027
|
if (cellEnd > start && cellStart < end) {
|
|
3795
|
-
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";
|
|
3796
3030
|
if (Math.abs(cellStart - start) < 0.01) return "start";
|
|
3797
3031
|
if (Math.abs(cellEnd - end) < 0.01) return "end";
|
|
3798
3032
|
return "middle";
|
|
@@ -3803,16 +3037,21 @@ var DayView = ({
|
|
|
3803
3037
|
const dayEvents = events.filter(
|
|
3804
3038
|
(event2) => currentDate.isBetween(event2.start.startOf("day"), event2.end.endOf("day"), null, "[]")
|
|
3805
3039
|
);
|
|
3806
|
-
|
|
3807
|
-
|
|
3808
|
-
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,
|
|
3809
3042
|
{
|
|
3810
|
-
|
|
3811
|
-
|
|
3812
|
-
|
|
3813
|
-
|
|
3814
|
-
|
|
3815
|
-
|
|
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,
|
|
3816
3055
|
{
|
|
3817
3056
|
key: h,
|
|
3818
3057
|
height: 60,
|
|
@@ -3822,11 +3061,11 @@ var DayView = ({
|
|
|
3822
3061
|
borderRight: "1px solid",
|
|
3823
3062
|
borderColor: "divider"
|
|
3824
3063
|
},
|
|
3825
|
-
/* @__PURE__ */
|
|
3826
|
-
))), /* @__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) => {
|
|
3827
3066
|
const borderType = getCellBorderType(hourIdx, dayEvents);
|
|
3828
|
-
return /* @__PURE__ */
|
|
3829
|
-
|
|
3067
|
+
return /* @__PURE__ */ import_react27.default.createElement(
|
|
3068
|
+
import_material21.Box,
|
|
3830
3069
|
{
|
|
3831
3070
|
key: hourIdx,
|
|
3832
3071
|
height: 60,
|
|
@@ -3836,26 +3075,20 @@ var DayView = ({
|
|
|
3836
3075
|
}
|
|
3837
3076
|
);
|
|
3838
3077
|
}), dayEvents.map((event2) => {
|
|
3839
|
-
const eventStart = currentDate.isSame(event2.start, "day") ? event2.start : currentDate.startOf("day");
|
|
3840
|
-
const eventEnd = currentDate.isSame(event2.end, "day") ? event2.end : currentDate.endOf("day");
|
|
3841
|
-
const
|
|
3842
|
-
const
|
|
3843
|
-
|
|
3844
|
-
const clampedEnd = eventEnd.isAfter(maxEnd) ? maxEnd : eventEnd;
|
|
3845
|
-
const startMinutes = (clampedStart.hour() - startHour) * 60 + clampedStart.minute();
|
|
3846
|
-
const durationMinutes = clampedEnd.diff(clampedStart, "minute");
|
|
3847
|
-
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(
|
|
3848
3083
|
CalendarEventCard,
|
|
3849
3084
|
{
|
|
3850
3085
|
key: `${event2.id}-${currentDate.toString()}`,
|
|
3851
3086
|
event: event2,
|
|
3852
3087
|
color: stateColors[event2.state],
|
|
3853
|
-
onClick: () => onEventClick == null ? void 0 : onEventClick(event2
|
|
3854
|
-
onHover: onEventHover,
|
|
3088
|
+
onClick: () => onEventClick == null ? void 0 : onEventClick(event2),
|
|
3855
3089
|
sx: {
|
|
3856
3090
|
position: "absolute",
|
|
3857
|
-
top: `${startMinutes}px`,
|
|
3858
|
-
height: `${durationMinutes}px`,
|
|
3091
|
+
top: `${startMinutes + 15}px`,
|
|
3859
3092
|
left: 4,
|
|
3860
3093
|
right: 4
|
|
3861
3094
|
}
|
|
@@ -3865,23 +3098,17 @@ var DayView = ({
|
|
|
3865
3098
|
};
|
|
3866
3099
|
|
|
3867
3100
|
// src/Components/Calendario/Calendar.tsx
|
|
3868
|
-
var import_dayjs7 = __toESM(require("dayjs"), 1);
|
|
3869
3101
|
var Calendar = ({
|
|
3870
3102
|
events,
|
|
3871
3103
|
onDayClick,
|
|
3872
3104
|
onMoreClick,
|
|
3873
3105
|
onEventClick,
|
|
3874
|
-
onEventHover,
|
|
3875
3106
|
view: initialView = "month",
|
|
3876
3107
|
onViewChange,
|
|
3877
|
-
toolbar
|
|
3878
|
-
isLoading = false,
|
|
3879
|
-
startHour = 0,
|
|
3880
|
-
// <- valor por defecto
|
|
3881
|
-
endHour = 23
|
|
3108
|
+
toolbar
|
|
3882
3109
|
}) => {
|
|
3883
|
-
const [view, setView] = (0,
|
|
3884
|
-
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)());
|
|
3885
3112
|
const handleViewChange = (newView) => {
|
|
3886
3113
|
setView(newView);
|
|
3887
3114
|
onViewChange == null ? void 0 : onViewChange(newView);
|
|
@@ -3889,18 +3116,12 @@ var Calendar = ({
|
|
|
3889
3116
|
const handleNavigate = (action) => {
|
|
3890
3117
|
let newDate = currentDate;
|
|
3891
3118
|
const unit = view === "month" ? "month" : "day";
|
|
3892
|
-
if (action === "PREV")
|
|
3893
|
-
|
|
3894
|
-
|
|
3895
|
-
if (view === "month") newDate = currentDate.subtract(1, "month");
|
|
3896
|
-
} else if (action === "NEXT") {
|
|
3897
|
-
if (view === "day") newDate = currentDate.add(1, "day");
|
|
3898
|
-
if (view === "week") newDate = currentDate.add(1, "week");
|
|
3899
|
-
if (view === "month") newDate = currentDate.add(1, "month");
|
|
3900
|
-
} 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)();
|
|
3901
3122
|
setCurrentDate(newDate);
|
|
3902
3123
|
};
|
|
3903
|
-
return /* @__PURE__ */
|
|
3124
|
+
return /* @__PURE__ */ import_react28.default.createElement(import_material22.Box, null, /* @__PURE__ */ import_react28.default.createElement(
|
|
3904
3125
|
CalendarToolbar,
|
|
3905
3126
|
{
|
|
3906
3127
|
labelDate: currentDate,
|
|
@@ -3909,281 +3130,40 @@ var Calendar = ({
|
|
|
3909
3130
|
onNavigate: handleNavigate
|
|
3910
3131
|
},
|
|
3911
3132
|
toolbar
|
|
3912
|
-
),
|
|
3913
|
-
import_material23.Box,
|
|
3914
|
-
{
|
|
3915
|
-
display: "flex",
|
|
3916
|
-
justifyContent: "center",
|
|
3917
|
-
alignItems: "center",
|
|
3918
|
-
height: "400px"
|
|
3919
|
-
},
|
|
3920
|
-
/* @__PURE__ */ import_react35.default.createElement(import_material23.CircularProgress, { variant: "indeterminate" })
|
|
3921
|
-
))) : /* @__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(
|
|
3922
3134
|
MonthView,
|
|
3923
3135
|
{
|
|
3924
3136
|
events,
|
|
3925
|
-
currentDate,
|
|
3926
3137
|
onDayClick,
|
|
3927
3138
|
onMoreClick,
|
|
3928
3139
|
onEventClick,
|
|
3929
|
-
|
|
3140
|
+
currentDate
|
|
3930
3141
|
}
|
|
3931
|
-
), view === "week" && /* @__PURE__ */
|
|
3142
|
+
), view === "week" && /* @__PURE__ */ import_react28.default.createElement(
|
|
3932
3143
|
WeekView,
|
|
3933
3144
|
{
|
|
3934
3145
|
events,
|
|
3935
3146
|
currentDate,
|
|
3936
3147
|
onDayClick,
|
|
3937
3148
|
onMoreClick,
|
|
3938
|
-
onEventClick
|
|
3939
|
-
onEventHover,
|
|
3940
|
-
startHour,
|
|
3941
|
-
endHour
|
|
3149
|
+
onEventClick
|
|
3942
3150
|
}
|
|
3943
|
-
), view === "day" && /* @__PURE__ */
|
|
3151
|
+
), view === "day" && /* @__PURE__ */ import_react28.default.createElement(
|
|
3944
3152
|
DayView,
|
|
3945
3153
|
{
|
|
3946
3154
|
events,
|
|
3947
3155
|
currentDate,
|
|
3948
|
-
onEventClick
|
|
3949
|
-
onEventHover,
|
|
3950
|
-
startHour,
|
|
3951
|
-
endHour
|
|
3952
|
-
}
|
|
3953
|
-
)));
|
|
3954
|
-
};
|
|
3955
|
-
|
|
3956
|
-
// src/Components/SCTime.tsx
|
|
3957
|
-
var import_react36 = __toESM(require("react"), 1);
|
|
3958
|
-
var import_material24 = require("@mui/material");
|
|
3959
|
-
var import_LocalizationProvider3 = require("@mui/x-date-pickers/LocalizationProvider");
|
|
3960
|
-
var import_AdapterDayjs2 = require("@mui/x-date-pickers/AdapterDayjs");
|
|
3961
|
-
var import_dayjs8 = __toESM(require("dayjs"), 1);
|
|
3962
|
-
var import_es3 = require("dayjs/locale/es");
|
|
3963
|
-
var import_x_license_pro3 = require("@mui/x-license-pro");
|
|
3964
|
-
var import_AccessTime = __toESM(require("@mui/icons-material/AccessTime"), 1);
|
|
3965
|
-
var import_TimeField = require("@mui/x-date-pickers/TimeField");
|
|
3966
|
-
var import_DigitalClock = require("@mui/x-date-pickers/DigitalClock");
|
|
3967
|
-
var SCTime = ({
|
|
3968
|
-
label = "Hora",
|
|
3969
|
-
required = false,
|
|
3970
|
-
disabled = false,
|
|
3971
|
-
background = "transparent",
|
|
3972
|
-
timeStep = 5,
|
|
3973
|
-
state,
|
|
3974
|
-
setState
|
|
3975
|
-
}) => {
|
|
3976
|
-
import_x_license_pro3.LicenseInfo.setLicenseKey(
|
|
3977
|
-
"77d49a57fbc5f4af35ddb05c5f1742e0Tz0xMTI3MjgsRT0xNzc4MzcxMTk5MDAwLFM9cHJvLExNPXN1YnNjcmlwdGlvbixQVj1RMy0yMDI0LEtWPTI="
|
|
3978
|
-
);
|
|
3979
|
-
const isTimeEmpty = required && !state;
|
|
3980
|
-
const hasError = isTimeEmpty;
|
|
3981
|
-
const [anchorEl, setAnchorEl] = (0, import_react36.useState)(null);
|
|
3982
|
-
const [isOpenPopover, setIsOpenPopover] = (0, import_react36.useState)(false);
|
|
3983
|
-
const [popoverPlacement, setPopoverPlacement] = (0, import_react36.useState)("bottom");
|
|
3984
|
-
const detectPlacement = (element) => {
|
|
3985
|
-
const rect = element.getBoundingClientRect();
|
|
3986
|
-
const windowHeight = window.innerHeight;
|
|
3987
|
-
const spaceBelow = windowHeight - rect.bottom;
|
|
3988
|
-
const spaceAbove = rect.top;
|
|
3989
|
-
const popoverHeight = 300;
|
|
3990
|
-
if (spaceBelow < popoverHeight && spaceAbove > spaceBelow) {
|
|
3991
|
-
setPopoverPlacement("top");
|
|
3992
|
-
} else {
|
|
3993
|
-
setPopoverPlacement("bottom");
|
|
3994
|
-
}
|
|
3995
|
-
};
|
|
3996
|
-
const handleTimeFieldClick = (event2) => {
|
|
3997
|
-
if (!disabled) {
|
|
3998
|
-
const target = event2.currentTarget;
|
|
3999
|
-
setAnchorEl(target);
|
|
4000
|
-
detectPlacement(target);
|
|
4001
|
-
setIsOpenPopover(true);
|
|
4002
|
-
}
|
|
4003
|
-
};
|
|
4004
|
-
const handleTimeChange = (newValue) => {
|
|
4005
|
-
const dayjsValue = newValue ? (0, import_dayjs8.default)(newValue) : null;
|
|
4006
|
-
setState(dayjsValue);
|
|
4007
|
-
setIsOpenPopover(false);
|
|
4008
|
-
setAnchorEl(null);
|
|
4009
|
-
};
|
|
4010
|
-
const handleClose = () => {
|
|
4011
|
-
setIsOpenPopover(false);
|
|
4012
|
-
setAnchorEl(null);
|
|
4013
|
-
};
|
|
4014
|
-
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(
|
|
4015
|
-
import_TimeField.TimeField,
|
|
4016
|
-
{
|
|
4017
|
-
label,
|
|
4018
|
-
value: state,
|
|
4019
|
-
disabled,
|
|
4020
|
-
required,
|
|
4021
|
-
error: hasError,
|
|
4022
|
-
onClick: handleTimeFieldClick,
|
|
4023
|
-
slotProps: {
|
|
4024
|
-
textField: {
|
|
4025
|
-
InputProps: {
|
|
4026
|
-
endAdornment: /* @__PURE__ */ import_react36.default.createElement(import_material24.InputAdornment, { position: "end" }, /* @__PURE__ */ import_react36.default.createElement(
|
|
4027
|
-
import_AccessTime.default,
|
|
4028
|
-
{
|
|
4029
|
-
color: disabled ? "disabled" : "action",
|
|
4030
|
-
sx: { cursor: disabled ? "default" : "pointer" },
|
|
4031
|
-
fontSize: "small"
|
|
4032
|
-
}
|
|
4033
|
-
)),
|
|
4034
|
-
sx: {
|
|
4035
|
-
backgroundColor: background,
|
|
4036
|
-
padding: "8px 12px",
|
|
4037
|
-
cursor: disabled ? "default" : "pointer",
|
|
4038
|
-
"& input": {
|
|
4039
|
-
cursor: disabled ? "default" : "pointer"
|
|
4040
|
-
}
|
|
4041
|
-
}
|
|
4042
|
-
}
|
|
4043
|
-
}
|
|
4044
|
-
},
|
|
4045
|
-
sx: {
|
|
4046
|
-
width: "100%",
|
|
4047
|
-
"& .MuiInputBase-input": {
|
|
4048
|
-
cursor: disabled ? "default" : "pointer"
|
|
4049
|
-
},
|
|
4050
|
-
"& .MuiPickersSectionList-root": {
|
|
4051
|
-
padding: "0px !important"
|
|
4052
|
-
}
|
|
4053
|
-
}
|
|
4054
|
-
}
|
|
4055
|
-
), /* @__PURE__ */ import_react36.default.createElement(
|
|
4056
|
-
import_material24.Popover,
|
|
4057
|
-
{
|
|
4058
|
-
open: isOpenPopover,
|
|
4059
|
-
anchorEl,
|
|
4060
|
-
onClose: handleClose,
|
|
4061
|
-
anchorOrigin: {
|
|
4062
|
-
vertical: popoverPlacement === "top" ? "top" : "bottom",
|
|
4063
|
-
horizontal: "left"
|
|
4064
|
-
},
|
|
4065
|
-
transformOrigin: {
|
|
4066
|
-
vertical: popoverPlacement === "top" ? "bottom" : "top",
|
|
4067
|
-
horizontal: "left"
|
|
4068
|
-
},
|
|
4069
|
-
marginThreshold: 0,
|
|
4070
|
-
disableScrollLock: true,
|
|
4071
|
-
slotProps: {
|
|
4072
|
-
paper: {
|
|
4073
|
-
sx: {
|
|
4074
|
-
boxShadow: "0px 4px 20px rgba(0, 0, 0, 0.1)",
|
|
4075
|
-
borderRadius: 1,
|
|
4076
|
-
border: "1px solid #e0e0e0",
|
|
4077
|
-
maxHeight: "300px",
|
|
4078
|
-
overflow: "visible"
|
|
4079
|
-
}
|
|
4080
|
-
}
|
|
4081
|
-
}
|
|
4082
|
-
},
|
|
4083
|
-
/* @__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(
|
|
4084
|
-
import_DigitalClock.DigitalClock,
|
|
4085
|
-
{
|
|
4086
|
-
value: state,
|
|
4087
|
-
onChange: handleTimeChange,
|
|
4088
|
-
timeStep,
|
|
4089
|
-
sx: {
|
|
4090
|
-
"& .MuiList-root": {
|
|
4091
|
-
maxHeight: "250px",
|
|
4092
|
-
overflow: "auto"
|
|
4093
|
-
},
|
|
4094
|
-
"& .MuiMenuItem-root": {
|
|
4095
|
-
fontSize: "0.875rem",
|
|
4096
|
-
py: 0.5
|
|
4097
|
-
}
|
|
4098
|
-
}
|
|
4099
|
-
}
|
|
4100
|
-
)))
|
|
4101
|
-
)));
|
|
4102
|
-
};
|
|
4103
|
-
|
|
4104
|
-
// src/Components/SCCard.tsx
|
|
4105
|
-
var import_react37 = __toESM(require("react"), 1);
|
|
4106
|
-
var import_material25 = require("@mui/material");
|
|
4107
|
-
var import_IconButton = __toESM(require("@mui/material/IconButton"), 1);
|
|
4108
|
-
var import_Card = __toESM(require("@mui/material/Card"), 1);
|
|
4109
|
-
var import_CardHeader = __toESM(require("@mui/material/CardHeader"), 1);
|
|
4110
|
-
var import_CardMedia = __toESM(require("@mui/material/CardMedia"), 1);
|
|
4111
|
-
var import_CardContent = __toESM(require("@mui/material/CardContent"), 1);
|
|
4112
|
-
var import_CardActions = __toESM(require("@mui/material/CardActions"), 1);
|
|
4113
|
-
var import_Collapse = __toESM(require("@mui/material/Collapse"), 1);
|
|
4114
|
-
var import_ExpandMore = __toESM(require("@mui/icons-material/ExpandMore"), 1);
|
|
4115
|
-
var Muicon8 = __toESM(require("@mui/icons-material"), 1);
|
|
4116
|
-
var SCCard = ({ title, image, iconTitle, actionsTitle, subtitle, content, actions, expand }) => {
|
|
4117
|
-
let iconTitleValidation = "";
|
|
4118
|
-
let IconTitle;
|
|
4119
|
-
const [expanded, setExpanded] = import_react37.default.useState(false);
|
|
4120
|
-
if (iconTitle) {
|
|
4121
|
-
if (Muicon8[iconTitle] == void 0) {
|
|
4122
|
-
if (iconTitle && import_react37.default.isValidElement(iconTitle) && iconTitle.type == void 0) {
|
|
4123
|
-
iconTitleValidation = "image";
|
|
4124
|
-
IconTitle = iconTitle;
|
|
4125
|
-
} else {
|
|
4126
|
-
iconTitleValidation = "icon";
|
|
4127
|
-
IconTitle = iconTitle;
|
|
4128
|
-
}
|
|
4129
|
-
} else {
|
|
4130
|
-
iconTitleValidation = "icon";
|
|
4131
|
-
IconTitle = Muicon8[iconTitle];
|
|
4132
|
-
}
|
|
4133
|
-
}
|
|
4134
|
-
const handleExpandClick = () => {
|
|
4135
|
-
setExpanded(!expanded);
|
|
4136
|
-
};
|
|
4137
|
-
return /* @__PURE__ */ import_react37.default.createElement(import_Card.default, { sx: { maxWidth: 345 } }, title && /* @__PURE__ */ import_react37.default.createElement(
|
|
4138
|
-
import_CardHeader.default,
|
|
4139
|
-
{
|
|
4140
|
-
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,
|
|
4141
|
-
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,
|
|
4142
|
-
title,
|
|
4143
|
-
subheader: subtitle,
|
|
4144
|
-
sx: {
|
|
4145
|
-
"& .MuiCardHeader-title": {
|
|
4146
|
-
fontSize: "14px",
|
|
4147
|
-
color: "text.primary"
|
|
4148
|
-
},
|
|
4149
|
-
"& .MuiCardHeader-subheader": {
|
|
4150
|
-
fontSize: "13px",
|
|
4151
|
-
color: "text.secondary"
|
|
4152
|
-
},
|
|
4153
|
-
"& .MuiCardHeader-action": {
|
|
4154
|
-
height: "40px !important",
|
|
4155
|
-
display: "flex",
|
|
4156
|
-
alignItems: "center"
|
|
4157
|
-
}
|
|
4158
|
-
}
|
|
4159
|
-
}
|
|
4160
|
-
), image && /* @__PURE__ */ import_react37.default.createElement(
|
|
4161
|
-
import_CardMedia.default,
|
|
4162
|
-
{
|
|
4163
|
-
component: "img",
|
|
4164
|
-
height: "194",
|
|
4165
|
-
image
|
|
3156
|
+
onEventClick
|
|
4166
3157
|
}
|
|
4167
|
-
)
|
|
4168
|
-
import_material25.Button,
|
|
4169
|
-
{
|
|
4170
|
-
key: index,
|
|
4171
|
-
size: "small",
|
|
4172
|
-
color: action.color || "primary",
|
|
4173
|
-
variant: action.variant || "text",
|
|
4174
|
-
onClick: action.fn,
|
|
4175
|
-
disabled: action.disabled || false
|
|
4176
|
-
},
|
|
4177
|
-
action.text
|
|
4178
|
-
)) : ""), 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
|
+
));
|
|
4179
3159
|
};
|
|
4180
3160
|
|
|
4181
3161
|
// src/Theme/index.ts
|
|
4182
3162
|
var import_styles3 = require("@mui/material/styles");
|
|
4183
3163
|
|
|
4184
3164
|
// src/Theme/components.ts
|
|
4185
|
-
var
|
|
4186
|
-
var
|
|
3165
|
+
var import_react29 = __toESM(require("react"), 1);
|
|
3166
|
+
var import_icons_material11 = require("@mui/icons-material");
|
|
4187
3167
|
var components = {
|
|
4188
3168
|
MuiSelect: {
|
|
4189
3169
|
styleOverrides: {
|
|
@@ -4880,10 +3860,10 @@ var components = {
|
|
|
4880
3860
|
MuiAlert: {
|
|
4881
3861
|
defaultProps: {
|
|
4882
3862
|
iconMapping: {
|
|
4883
|
-
success:
|
|
4884
|
-
error:
|
|
4885
|
-
warning:
|
|
4886
|
-
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)
|
|
4887
3867
|
}
|
|
4888
3868
|
},
|
|
4889
3869
|
variants: [
|
|
@@ -5925,7 +4905,6 @@ var ADCSincoTheme = (0, import_styles3.createTheme)(__spreadValues({}, ADCTheme)
|
|
|
5925
4905
|
0 && (module.exports = {
|
|
5926
4906
|
ADCSincoTheme,
|
|
5927
4907
|
AdproSincoTheme,
|
|
5928
|
-
Attachment,
|
|
5929
4908
|
Calendar,
|
|
5930
4909
|
EmptyState,
|
|
5931
4910
|
FooterAction,
|
|
@@ -5933,7 +4912,6 @@ var ADCSincoTheme = (0, import_styles3.createTheme)(__spreadValues({}, ADCTheme)
|
|
|
5933
4912
|
PageHeader,
|
|
5934
4913
|
SCAutocomplete,
|
|
5935
4914
|
SCCalendarSwipeable,
|
|
5936
|
-
SCCard,
|
|
5937
4915
|
SCDataGrid,
|
|
5938
4916
|
SCDataGridInitial,
|
|
5939
4917
|
SCDateRange,
|
|
@@ -5945,7 +4923,6 @@ var ADCSincoTheme = (0, import_styles3.createTheme)(__spreadValues({}, ADCTheme)
|
|
|
5945
4923
|
SCTabs,
|
|
5946
4924
|
SCTextArea,
|
|
5947
4925
|
SCTextField,
|
|
5948
|
-
SCTime,
|
|
5949
4926
|
SCToastNotification,
|
|
5950
4927
|
SincoTheme,
|
|
5951
4928
|
ToastProgress,
|