componentes-sinco 1.0.2-rc.7 → 1.0.2-rc.9

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/index.mjs DELETED
@@ -1,3833 +0,0 @@
1
- var __defProp = Object.defineProperty;
2
- var __defProps = Object.defineProperties;
3
- var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
4
- var __getOwnPropSymbols = Object.getOwnPropertySymbols;
5
- var __hasOwnProp = Object.prototype.hasOwnProperty;
6
- var __propIsEnum = Object.prototype.propertyIsEnumerable;
7
- var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
8
- var __spreadValues = (a, b) => {
9
- for (var prop in b || (b = {}))
10
- if (__hasOwnProp.call(b, prop))
11
- __defNormalProp(a, prop, b[prop]);
12
- if (__getOwnPropSymbols)
13
- for (var prop of __getOwnPropSymbols(b)) {
14
- if (__propIsEnum.call(b, prop))
15
- __defNormalProp(a, prop, b[prop]);
16
- }
17
- return a;
18
- };
19
- var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
20
- var __objRest = (source, exclude) => {
21
- var target = {};
22
- for (var prop in source)
23
- if (__hasOwnProp.call(source, prop) && exclude.indexOf(prop) < 0)
24
- target[prop] = source[prop];
25
- if (source != null && __getOwnPropSymbols)
26
- for (var prop of __getOwnPropSymbols(source)) {
27
- if (exclude.indexOf(prop) < 0 && __propIsEnum.call(source, prop))
28
- target[prop] = source[prop];
29
- }
30
- return target;
31
- };
32
-
33
- // src/Components/Drawer/SCDrawer.tsx
34
- import React4 from "react";
35
- import { Box as Box4, Drawer, Typography as Typography4, IconButton as IconButton3, Button as Button2, Stack as Stack3 } from "@mui/material";
36
- import Grid3 from "@mui/material/Grid2";
37
- import CloseIcon from "@mui/icons-material/Close";
38
-
39
- // src/Components/Textfield/SCTextField.tsx
40
- import React, { useEffect, useState } from "react";
41
- import { FormControl, IconButton, InputAdornment, InputLabel, OutlinedInput, FilledInput, Popover, Input, Box, Typography, SvgIcon, Tooltip } from "@mui/material";
42
- import Grid from "@mui/material/Grid2";
43
- import { Visibility, VisibilityOff, InfoOutlined } from "@mui/icons-material";
44
-
45
- // src/Components/Textfield/Helpers/validateIcon.tsx
46
- import * as Muicon from "@mui/icons-material";
47
- function getIconComponent(name) {
48
- if (typeof name !== "string") return name;
49
- return name in Muicon ? Muicon[name] : void 0;
50
- }
51
- function getIconValidation(name) {
52
- if (typeof name !== "string") {
53
- return (name == null ? void 0 : name.type) ? "icon" : "text";
54
- }
55
- return name in Muicon ? "icon" : "text";
56
- }
57
-
58
- // src/Components/Textfield/Helpers/validateKeyDown.tsx
59
- function validateKeyDown(event2, format2) {
60
- const key = event2.key;
61
- const target = event2.target;
62
- if (format2 === "int" && !/^[0-9]$/.test(key)) {
63
- event2.preventDefault();
64
- }
65
- if (format2 === "decimal" && (target.value === "" && key === "." || key === "-" || key === "+")) {
66
- event2.preventDefault();
67
- }
68
- if (target.type === "text") {
69
- const regex = /^[a-zA-ZáéíóúÁÉÍÓÚñÑ0-9\s_\-.,@]+$/;
70
- if (!regex.test(key)) {
71
- event2.preventDefault();
72
- }
73
- }
74
- }
75
-
76
- // src/Components/Textfield/Helpers/validateOnBlur.tsx
77
- var validateOnBlurField = ({
78
- value,
79
- required = false,
80
- setError,
81
- onBlur
82
- }) => (event2) => {
83
- const isError = !value.trim() && required;
84
- setError(isError);
85
- if (onBlur) {
86
- onBlur(event2);
87
- }
88
- };
89
-
90
- // src/Components/Textfield/SCTextField.tsx
91
- var SCTextField = ({
92
- //informativas
93
- title,
94
- iconTitle,
95
- infoTitle,
96
- label = "",
97
- placeholder = "",
98
- infoElement,
99
- iconInputStart,
100
- iconInputEnd,
101
- maxLength,
102
- //Apariencia
103
- variant = "outlined",
104
- format: format2,
105
- disabled,
106
- required,
107
- size,
108
- width = "100%",
109
- color,
110
- background,
111
- //Funcionales
112
- state,
113
- value,
114
- onChange,
115
- onBlur,
116
- onKeyDown
117
- }) => {
118
- const inputComponents = {
119
- outlined: OutlinedInput,
120
- filled: FilledInput,
121
- standard: Input
122
- };
123
- const InputComponent = inputComponents[variant] || OutlinedInput;
124
- let IconInputStartValidation;
125
- let IconInputEndValidation;
126
- let IconInputStart;
127
- let IconInputEnd;
128
- let IconTitle;
129
- const [showPassword, setShowPassword] = useState(false);
130
- const [error, setError] = useState(false);
131
- const [anchorInfoTitle, setAnchorInfoTitle] = useState(null);
132
- const openInfoTitle = Boolean(anchorInfoTitle);
133
- const [anchorInfoElement, setAnchorInfoElement] = useState(null);
134
- const openInfoElement = Boolean(anchorInfoElement);
135
- useEffect(() => {
136
- if (error) {
137
- setTimeout(() => {
138
- setError(false);
139
- }, 1e3);
140
- }
141
- }, [error]);
142
- if (iconInputStart) {
143
- IconInputStartValidation = getIconValidation(iconInputStart);
144
- IconInputStart = getIconComponent(iconInputStart);
145
- }
146
- if (iconInputEnd) {
147
- IconInputEndValidation = getIconValidation(iconInputEnd);
148
- IconInputEnd = getIconComponent(iconInputEnd);
149
- }
150
- if (iconTitle) {
151
- IconTitle = getIconComponent(iconTitle);
152
- }
153
- const handleClickShowPassword = () => setShowPassword((show) => !show);
154
- const handleMouseDownPassword = (event2) => {
155
- event2.preventDefault();
156
- };
157
- const handleKeyDown = (event2) => {
158
- validateKeyDown(event2, format2);
159
- if (onKeyDown) onKeyDown(event2);
160
- };
161
- const handleInputChange = (event2) => {
162
- let valueMax = maxLength ? maxLength + 1 : 50;
163
- if (event2.target.value.length < valueMax) {
164
- if (state) {
165
- state(event2.target.value);
166
- }
167
- if (onChange) {
168
- onChange(event2);
169
- }
170
- }
171
- };
172
- const handleBlur = validateOnBlurField({ value, required, setError, onBlur });
173
- const handleOpenInfoTitle = (event2) => {
174
- setAnchorInfoTitle(event2.currentTarget);
175
- };
176
- const handleCloseInfoTitle = () => {
177
- setAnchorInfoTitle(null);
178
- };
179
- const handleOpenInfoElement = (event2) => {
180
- setAnchorInfoElement(event2.currentTarget);
181
- };
182
- const handleCloseInfoElement = () => {
183
- setAnchorInfoElement(null);
184
- };
185
- return /* @__PURE__ */ React.createElement(Box, { sx: { width } }, /* @__PURE__ */ React.createElement(Grid, { container: true, alignItems: "center", mb: 1.25, gap: 0.5 }, iconTitle && IconTitle ? /* @__PURE__ */ React.createElement(SvgIcon, { color: "action", fontSize: "small", component: IconTitle }) : "", title ? /* @__PURE__ */ React.createElement(Typography, { mx: 0.5, variant: "subtitle2", color: "text.secondary" }, title) : "", infoTitle ? /* @__PURE__ */ React.createElement(React.Fragment, null, infoTitle.component === "popover" ? /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement(
186
- InfoOutlined,
187
- {
188
- color: "action",
189
- fontSize: "small",
190
- onMouseEnter: (event2) => handleOpenInfoTitle(event2),
191
- onMouseLeave: () => handleCloseInfoTitle()
192
- }
193
- ), /* @__PURE__ */ React.createElement(
194
- Popover,
195
- {
196
- sx: {
197
- pointerEvents: "none",
198
- "& .MuiBackdrop-root": {
199
- backgroundColor: "transparent"
200
- }
201
- },
202
- open: openInfoTitle,
203
- anchorEl: anchorInfoTitle,
204
- onClose: handleCloseInfoTitle,
205
- anchorOrigin: {
206
- vertical: "bottom",
207
- horizontal: "left"
208
- },
209
- transformOrigin: {
210
- vertical: "top",
211
- horizontal: "left"
212
- },
213
- disableRestoreFocus: true
214
- },
215
- /* @__PURE__ */ React.createElement(Typography, { p: 2 }, infoTitle.text)
216
- )) : /* @__PURE__ */ React.createElement(Tooltip, { title: infoTitle.text, "data-testid": "test-infoTitle", placement: "bottom-start", slotProps: { popper: { modifiers: [{ name: "offset", options: { offset: [0, -14] } }] } } }, /* @__PURE__ */ React.createElement(
217
- InfoOutlined,
218
- {
219
- color: "action",
220
- fontSize: "small"
221
- }
222
- ))) : ""), /* @__PURE__ */ React.createElement(Grid, { container: true, sx: { flexWrap: "nowrap", alignItems: "center" } }, /* @__PURE__ */ React.createElement(
223
- FormControl,
224
- {
225
- color,
226
- fullWidth: true,
227
- size: size ? size : "medium",
228
- variant,
229
- sx: { background: background || "transparent", borderRadius: "4px" }
230
- },
231
- /* @__PURE__ */ React.createElement(
232
- InputLabel,
233
- {
234
- "data-testid": "test-label",
235
- htmlFor: "",
236
- required: required && label !== "" ? true : false,
237
- error,
238
- disabled: disabled || false
239
- },
240
- label ? label : ""
241
- ),
242
- /* @__PURE__ */ React.createElement(
243
- InputComponent,
244
- {
245
- size: size ? size : "medium",
246
- fullWidth: true,
247
- value,
248
- error,
249
- id: label == null ? void 0 : label.replace(/\s+/g, ""),
250
- disabled: disabled != null ? disabled : false,
251
- onKeyDown: handleKeyDown,
252
- onChange: handleInputChange,
253
- onBlur: handleBlur,
254
- inputProps: { maxLength: maxLength ? maxLength : 50 },
255
- type: !showPassword && format2 === "password" ? "password" : (format2 || "text").toUpperCase() === "INT" || (format2 || "text").toUpperCase() === "DECIMAL" ? "number" : "text",
256
- className: format2 === "password" && !showPassword ? "" : "",
257
- placeholder,
258
- startAdornment: iconInputStart ? /* @__PURE__ */ React.createElement(InputAdornment, { position: "start" }, IconInputStartValidation === "text" ? iconInputStart : IconInputStart ? /* @__PURE__ */ React.createElement(IconInputStart, { fontSize: "small" }) : null) : "",
259
- endAdornment: /* @__PURE__ */ React.createElement(InputAdornment, { position: "end" }, format2 === "password" ? /* @__PURE__ */ React.createElement(
260
- IconButton,
261
- {
262
- "aria-label": "toggle password visibility",
263
- onClick: handleClickShowPassword,
264
- onMouseDown: handleMouseDownPassword,
265
- edge: "end"
266
- },
267
- showPassword ? /* @__PURE__ */ React.createElement(VisibilityOff, null) : /* @__PURE__ */ React.createElement(Visibility, null)
268
- ) : iconInputEnd === void 0 && infoElement !== void 0 ? /* @__PURE__ */ React.createElement(React.Fragment, null, infoElement.component === "popover" ? /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement(
269
- InfoOutlined,
270
- {
271
- "data-testid": "test-infoElement",
272
- sx: { ml: 0.5 },
273
- color: "action",
274
- fontSize: "small",
275
- component: "svg",
276
- onMouseEnter: (event2) => handleOpenInfoElement(event2),
277
- onMouseLeave: () => handleCloseInfoElement()
278
- }
279
- ), /* @__PURE__ */ React.createElement(
280
- Popover,
281
- {
282
- sx: {
283
- pointerEvents: "none",
284
- "& .MuiBackdrop-root": {
285
- backgroundColor: "transparent"
286
- }
287
- },
288
- open: openInfoElement,
289
- anchorEl: anchorInfoElement,
290
- onClose: handleCloseInfoElement,
291
- anchorOrigin: {
292
- vertical: "bottom",
293
- horizontal: "left"
294
- },
295
- transformOrigin: {
296
- vertical: "top",
297
- horizontal: "left"
298
- },
299
- disableRestoreFocus: true
300
- },
301
- /* @__PURE__ */ React.createElement(Typography, { "data-testid": "test-popover-text", p: 2 }, infoElement.text)
302
- )) : /* @__PURE__ */ React.createElement(Tooltip, { title: infoElement.text, placement: "bottom-end", slotProps: { popper: { modifiers: [{ name: "offset", options: { offset: [0, -14] } }] } } }, /* @__PURE__ */ React.createElement(
303
- InfoOutlined,
304
- {
305
- color: "action",
306
- fontSize: "small"
307
- }
308
- ))) : iconInputEnd !== void 0 ? IconInputEndValidation === "text" ? iconInputEnd : IconInputEnd ? /* @__PURE__ */ React.createElement(IconInputEnd, { fontSize: "small" }) : null : ""),
309
- label: label ? label + (format2 === "password" && !showPassword ? "" : "") : "",
310
- autoComplete: format2 === "password" ? "new-password" : "off"
311
- }
312
- )
313
- ), (iconInputEnd !== void 0 || format2 === "password") && infoElement ? /* @__PURE__ */ React.createElement(React.Fragment, null, infoElement.component === "popover" ? /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement(
314
- InfoOutlined,
315
- {
316
- "data-testid": "test-infoElement",
317
- component: "svg",
318
- sx: { marginLeft: "4px" },
319
- color: "action",
320
- fontSize: "small",
321
- onMouseEnter: (event2) => handleOpenInfoElement(event2),
322
- onMouseLeave: handleCloseInfoElement
323
- }
324
- ), /* @__PURE__ */ React.createElement(
325
- Popover,
326
- {
327
- sx: { pointerEvents: "none" },
328
- open: openInfoElement,
329
- anchorEl: anchorInfoElement,
330
- onClose: handleCloseInfoElement,
331
- anchorOrigin: {
332
- vertical: "bottom",
333
- horizontal: "left"
334
- },
335
- transformOrigin: {
336
- vertical: "top",
337
- horizontal: "left"
338
- },
339
- disableRestoreFocus: true
340
- },
341
- /* @__PURE__ */ React.createElement(Typography, { "data-testid": "test-popover-text", p: 2 }, infoElement.text)
342
- )) : /* @__PURE__ */ React.createElement(Tooltip, { title: infoElement.text, placement: "bottom-end", slotProps: { popper: { modifiers: [{ name: "offset", options: { offset: [0, -14] } }] } } }, /* @__PURE__ */ React.createElement(
343
- InfoOutlined,
344
- {
345
- sx: { marginLeft: "4px" },
346
- color: "action",
347
- fontSize: "small"
348
- }
349
- ))) : ""));
350
- };
351
-
352
- // src/Components/ToastNotification/SCToastNotification.tsx
353
- import React2, { useEffect as useEffect3, useState as useState3 } from "react";
354
- import { Stack, LinearProgress, Divider, Box as Box2, Typography as Typography2, IconButton as IconButton2, Button } from "@mui/material";
355
- import { Close, InfoRounded, CheckCircleRounded, WarningRounded, ErrorRounded, KeyboardArrowDown, KeyboardArrowUp } from "@mui/icons-material";
356
-
357
- // src/Components/ToastNotification/useProgress.ts
358
- import { useEffect as useEffect2, useState as useState2 } from "react";
359
- var useProgress = (timeProgress, lote) => {
360
- const [progress, setProgress] = useState2(0);
361
- useEffect2(() => {
362
- const interval = setInterval(() => {
363
- setProgress((prev) => {
364
- if (prev >= 100) {
365
- clearInterval(interval);
366
- }
367
- if (lote) {
368
- const nextProgress = prev + lote;
369
- return nextProgress <= 100 ? nextProgress : 100;
370
- } else {
371
- return prev + 1;
372
- }
373
- });
374
- }, timeProgress * 10);
375
- return () => {
376
- clearInterval(interval);
377
- };
378
- }, [timeProgress, lote]);
379
- return {
380
- progress
381
- };
382
- };
383
- var ToastProgress = (timeProgress) => {
384
- const [progress, setProgress] = useState2(100);
385
- useEffect2(() => {
386
- const interval = setInterval(() => {
387
- setProgress((prev) => {
388
- if (prev <= 0) {
389
- clearInterval(interval);
390
- }
391
- return prev - 1;
392
- });
393
- }, timeProgress * 10);
394
- return () => {
395
- clearInterval(interval);
396
- };
397
- }, [timeProgress]);
398
- return {
399
- progressToast: progress
400
- };
401
- };
402
-
403
- // src/Components/ToastNotification/SCToastNotification.tsx
404
- var SCToastNotification = (toast) => {
405
- var _a;
406
- const [stateOptions, setStateOptions] = useState3(true);
407
- const [stateToast, setStateToast] = useState3(true);
408
- const timeProgress = toast.time || 10;
409
- const { progress } = useProgress(timeProgress);
410
- const toastColorConfig = toast.type || "info";
411
- const toastIconOption = {
412
- success: /* @__PURE__ */ React2.createElement(CheckCircleRounded, { color: "success" }),
413
- error: /* @__PURE__ */ React2.createElement(ErrorRounded, { color: "error" }),
414
- warning: /* @__PURE__ */ React2.createElement(WarningRounded, { color: "warning" }),
415
- info: /* @__PURE__ */ React2.createElement(InfoRounded, { color: "info" })
416
- };
417
- const acciones = [...toast.actions || [{ text: "Action", fn: () => {
418
- alert("");
419
- } }, { text: "Consultar", fn: () => {
420
- } }]];
421
- const ToastIconConfig = toastIconOption[toast.type];
422
- const closeToast = () => {
423
- setStateToast(false);
424
- };
425
- const toggleToastOptions = () => {
426
- setStateOptions((prevShowOptions) => !prevShowOptions);
427
- };
428
- useEffect3(() => {
429
- progress >= 100 && setStateToast(false);
430
- }, [progress]);
431
- return /* @__PURE__ */ React2.createElement(React2.Fragment, null, stateToast && /* @__PURE__ */ React2.createElement(
432
- Stack,
433
- {
434
- position: "fixed",
435
- zIndex: 1400,
436
- right: 16,
437
- top: 16,
438
- width: 370,
439
- sx: {
440
- boxShadow: (theme) => theme.shadows[8]
441
- }
442
- },
443
- /* @__PURE__ */ React2.createElement(
444
- Box2,
445
- {
446
- padding: 1.5,
447
- gap: 1.5,
448
- display: "flex",
449
- alignItems: "center",
450
- sx: {
451
- backgroundColor: {
452
- success: "success.50",
453
- error: "error.50",
454
- warning: "warning.50",
455
- info: "info.50"
456
- }[toastColorConfig]
457
- }
458
- },
459
- /* @__PURE__ */ React2.createElement(
460
- Stack,
461
- {
462
- p: 1,
463
- gap: 1,
464
- borderRadius: 50,
465
- bgcolor: {
466
- success: "success.100",
467
- error: "error.100",
468
- warning: "warning.100",
469
- info: "info.100"
470
- }[(_a = toast.type) != null ? _a : "info"]
471
- },
472
- /* @__PURE__ */ React2.createElement(Stack, null, ToastIconConfig)
473
- ),
474
- /* @__PURE__ */ React2.createElement(Divider, { orientation: "vertical", flexItem: true }),
475
- /* @__PURE__ */ React2.createElement(Stack, { width: 285 }, /* @__PURE__ */ React2.createElement(
476
- Stack,
477
- {
478
- justifyContent: "space-between",
479
- flexDirection: "row",
480
- alignItems: "center"
481
- },
482
- /* @__PURE__ */ React2.createElement(Typography2, { variant: "subtitle2", color: "text.primary" }, toast.title),
483
- /* @__PURE__ */ React2.createElement(
484
- IconButton2,
485
- {
486
- size: "small",
487
- "data-testid": "close-icon",
488
- onClick: closeToast
489
- },
490
- /* @__PURE__ */ React2.createElement(Close, { fontSize: "small" })
491
- )
492
- ), /* @__PURE__ */ React2.createElement(Stack, { gap: 0.5 }, /* @__PURE__ */ React2.createElement(Typography2, { color: "text.primary", variant: "body2" }, toast.subtitle), !stateOptions && toast.listITems && toast.listITems.length > 0 && /* @__PURE__ */ React2.createElement(Stack, null, toast.listITems.map((element, i) => /* @__PURE__ */ React2.createElement(Typography2, { variant: "caption", key: i }, "\u2022 ", element)))), /* @__PURE__ */ React2.createElement(Stack, { justifyContent: "flex-end", flexDirection: "row", gap: 0.5 }, toast.actions && toast.actions.length > 0 && /* @__PURE__ */ React2.createElement(Stack, { flexDirection: "row", gap: 0.5 }, toast.actions.map((button, index) => /* @__PURE__ */ React2.createElement(
493
- Button,
494
- {
495
- key: index,
496
- color: toast.type === "info" ? "info" : toast.type === "success" ? "success" : toast.type === "error" ? "error" : "warning",
497
- variant: "text",
498
- onClick: button.fn,
499
- disabled: button.disabled || false,
500
- size: "small"
501
- },
502
- button.text.charAt(0).toUpperCase() + button.text.slice(1).toLowerCase()
503
- ))), toast.seeMore && /* @__PURE__ */ React2.createElement(
504
- Button,
505
- {
506
- onClick: toggleToastOptions,
507
- size: "small",
508
- variant: "text",
509
- color: toastColorConfig
510
- },
511
- stateOptions ? "Ver m\xE1s" : "Ver menos",
512
- stateOptions ? /* @__PURE__ */ React2.createElement(KeyboardArrowDown, null) : /* @__PURE__ */ React2.createElement(KeyboardArrowUp, null)
513
- )))
514
- ),
515
- /* @__PURE__ */ React2.createElement(
516
- LinearProgress,
517
- {
518
- sx: {
519
- ".MuiLinearProgress-bar": {
520
- transition: "0.1s linear !important",
521
- transform: "scaleX(-1)"
522
- }
523
- },
524
- color: toastColorConfig,
525
- variant: "determinate",
526
- value: 100 - progress
527
- }
528
- )
529
- ));
530
- };
531
-
532
- // src/Components/TextArea/Helpers/validateIcon.tsx
533
- import * as MuiIcons from "@mui/icons-material";
534
- function getIcon(name) {
535
- if (!name || !(name in MuiIcons)) {
536
- return null;
537
- }
538
- return MuiIcons[name];
539
- }
540
-
541
- // src/Components/TextArea/SCTextArea.tsx
542
- import React3, { useEffect as useEffect4, useState as useState4 } from "react";
543
- import { Typography as Typography3, Stack as Stack2, TextField, Box as Box3, Popover as Popover2, Tooltip as Tooltip2, SvgIcon as SvgIcon2, Grid2 } from "@mui/material";
544
- import { InfoOutlined as InfoOutlined2 } from "@mui/icons-material";
545
- var SCTextArea = ({
546
- //informativas
547
- title,
548
- iconTitle,
549
- infoTitle,
550
- label = "",
551
- placeholder,
552
- maxLength = 200,
553
- //apariencia
554
- variant,
555
- disabled,
556
- required,
557
- width = "100%",
558
- rows = 3,
559
- colorTitle,
560
- background,
561
- //funcionales
562
- state,
563
- value,
564
- onBlur
565
- }) => {
566
- const [helperCount, setHelperCount] = useState4(0);
567
- const [stateError, setStateError] = useState4(false);
568
- const [anchorInfoTitle, setAnchorInfoTitle] = React3.useState(null);
569
- const openInfoTitle = Boolean(anchorInfoTitle);
570
- useEffect4(() => {
571
- setHelperCount(value == null ? void 0 : value.length);
572
- }, [value]);
573
- const IconTitle = getIcon(iconTitle);
574
- const handleBlur = (event2) => {
575
- if (required && value.trim() === "") {
576
- setStateError(true);
577
- setTimeout(() => {
578
- setStateError(false);
579
- }, 1e3);
580
- return;
581
- }
582
- if (onBlur) {
583
- onBlur(event2);
584
- }
585
- };
586
- const handleOpenInfoTitle = (event2) => {
587
- setAnchorInfoTitle(event2.currentTarget);
588
- };
589
- const handleCloseInfoTitle = () => {
590
- setAnchorInfoTitle(null);
591
- };
592
- return /* @__PURE__ */ React3.createElement(React3.Fragment, null, /* @__PURE__ */ React3.createElement(Box3, { sx: { width } }, /* @__PURE__ */ React3.createElement(Grid2, { container: true, sx: { alignItems: "center" }, gap: 0.5 }, iconTitle && IconTitle && /* @__PURE__ */ React3.createElement(SvgIcon2, { color: "action", fontSize: "small", component: IconTitle }), title && /* @__PURE__ */ React3.createElement(Typography3, { color: colorTitle || "text.secondary", variant: "subtitle2" }, title), infoTitle ? /* @__PURE__ */ React3.createElement(React3.Fragment, null, infoTitle.component === "popover" ? /* @__PURE__ */ React3.createElement(React3.Fragment, null, /* @__PURE__ */ React3.createElement(
593
- InfoOutlined2,
594
- {
595
- color: "action",
596
- fontSize: "small",
597
- onMouseEnter: (event2) => handleOpenInfoTitle(event2),
598
- onMouseLeave: () => handleCloseInfoTitle()
599
- }
600
- ), /* @__PURE__ */ React3.createElement(
601
- Popover2,
602
- {
603
- sx: { pointerEvents: "none" },
604
- open: openInfoTitle,
605
- anchorEl: anchorInfoTitle,
606
- onClose: handleCloseInfoTitle,
607
- anchorOrigin: {
608
- vertical: "bottom",
609
- horizontal: "left"
610
- },
611
- transformOrigin: {
612
- vertical: "top",
613
- horizontal: "left"
614
- },
615
- disableRestoreFocus: true
616
- },
617
- /* @__PURE__ */ React3.createElement(Typography3, { sx: { p: 2 } }, infoTitle.text)
618
- )) : /* @__PURE__ */ React3.createElement(Tooltip2, { title: infoTitle.text, placement: "bottom-start", slotProps: { popper: { modifiers: [{ name: "offset", options: { offset: [0, -14] } }] } } }, /* @__PURE__ */ React3.createElement(
619
- InfoOutlined2,
620
- {
621
- color: "action",
622
- fontSize: "small"
623
- }
624
- ))) : ""), /* @__PURE__ */ React3.createElement(Stack2, null, /* @__PURE__ */ React3.createElement(
625
- TextField,
626
- {
627
- required,
628
- placeholder,
629
- error: stateError,
630
- variant,
631
- sx: { mt: "10px", background: background || "transparent", borderRadius: "4px" },
632
- id: "outlined-multiline-static",
633
- label,
634
- multiline: true,
635
- disabled,
636
- rows,
637
- value,
638
- onBlur: handleBlur,
639
- onChange: (e) => {
640
- if (state) {
641
- state(e.target.value.substring(0, maxLength));
642
- }
643
- },
644
- autoComplete: "off"
645
- }
646
- )), /* @__PURE__ */ React3.createElement(Stack2, null, /* @__PURE__ */ React3.createElement(
647
- Typography3,
648
- {
649
- variant: "caption",
650
- color: "text.secondary",
651
- mr: 1,
652
- mt: 1,
653
- align: "right"
654
- },
655
- helperCount + "/" + maxLength
656
- ))));
657
- };
658
-
659
- // src/Components/Drawer/Helpers/Utils.tsx
660
- import * as Muicon2 from "@mui/icons-material";
661
- import { FilterListOutlined } from "@mui/icons-material";
662
- var getIcon2 = (iconName) => {
663
- if (iconName && iconName in Muicon2) {
664
- return Muicon2[iconName];
665
- }
666
- return FilterListOutlined;
667
- };
668
- var cleanInputs = (arrayElements) => {
669
- var _a, _b;
670
- for (let i = 0; i < arrayElements.length; i++) {
671
- if (arrayElements[i].component === void 0) {
672
- (_b = (_a = arrayElements[i]).state) == null ? void 0 : _b.call(_a, "");
673
- }
674
- }
675
- };
676
-
677
- // src/Components/Drawer/Helpers/validateInput.tsx
678
- var validateInputs = (arrayElements, onError, onSuccess) => {
679
- var _a;
680
- let requiredValues = 0;
681
- let filledValues = 0;
682
- for (let i = 0; i < arrayElements.length; i++) {
683
- if (arrayElements[i].component === void 0) {
684
- if (arrayElements[i].required) {
685
- requiredValues++;
686
- }
687
- if (arrayElements[i].required && ((_a = arrayElements[i].value) == null ? void 0 : _a.trim()) !== "") {
688
- filledValues++;
689
- }
690
- }
691
- }
692
- if (requiredValues === filledValues) {
693
- onSuccess();
694
- } else {
695
- onError({
696
- type: "error",
697
- title: "Algunos campos son requeridos",
698
- time: 10
699
- });
700
- }
701
- };
702
-
703
- // src/generales/capitalize.tsx
704
- function capitalize(text) {
705
- return text.charAt(0).toUpperCase() + text.slice(1);
706
- }
707
-
708
- // src/Components/Drawer/SCDrawer.tsx
709
- var SCDrawer = ({
710
- //informativas
711
- title,
712
- arrayElements = [],
713
- actions,
714
- buttonDrawer,
715
- //Apariencia
716
- colorTitle,
717
- anchor = "left",
718
- width,
719
- //Funcionales
720
- open
721
- }) => {
722
- var _a;
723
- const [drawerOpen, setDrawerOpen] = React4.useState(open);
724
- const [toast, setToast] = React4.useState(null);
725
- const handleDrawerClose = () => {
726
- setDrawerOpen(false);
727
- };
728
- const toggleDrawer = (newOpen) => () => {
729
- setDrawerOpen(newOpen);
730
- };
731
- const ButtonIcon = getIcon2(buttonDrawer == null ? void 0 : buttonDrawer.icon);
732
- const setToastWithDelay = (toastContent) => {
733
- setToast(null);
734
- setTimeout(() => {
735
- setToast(toastContent);
736
- }, 10);
737
- };
738
- const inputValidation = () => validateInputs(arrayElements, setToastWithDelay, handleDrawerClose);
739
- const clean = () => cleanInputs(arrayElements);
740
- actions = actions != null ? actions : [{ text: "Limpiar", fn: clean }, { text: "Consultar", fn: inputValidation }];
741
- return /* @__PURE__ */ React4.createElement(React4.Fragment, null, toast && /* @__PURE__ */ React4.createElement(SCToastNotification, __spreadValues({}, toast)), /* @__PURE__ */ React4.createElement(
742
- Button2,
743
- {
744
- "data-testid": "test-buttonDrawer",
745
- sx: { textTransform: "capitalize" },
746
- color: buttonDrawer == null ? void 0 : buttonDrawer.color,
747
- onClick: toggleDrawer(true),
748
- size: "small",
749
- variant: (buttonDrawer == null ? void 0 : buttonDrawer.variant) != void 0 ? buttonDrawer == null ? void 0 : buttonDrawer.variant : "text",
750
- startIcon: (buttonDrawer == null ? void 0 : buttonDrawer.iconPosition) === "left" || !(buttonDrawer == null ? void 0 : buttonDrawer.iconPosition) ? /* @__PURE__ */ React4.createElement(ButtonIcon, { color: (buttonDrawer == null ? void 0 : buttonDrawer.color) != void 0 ? buttonDrawer == null ? void 0 : buttonDrawer.color : "primary" }) : null,
751
- endIcon: (buttonDrawer == null ? void 0 : buttonDrawer.iconPosition) === "right" ? /* @__PURE__ */ React4.createElement(ButtonIcon, { color: (buttonDrawer == null ? void 0 : buttonDrawer.color) != void 0 ? buttonDrawer == null ? void 0 : buttonDrawer.color : "primary" }) : null
752
- },
753
- capitalize((_a = buttonDrawer == null ? void 0 : buttonDrawer.text) != null ? _a : "Drawer")
754
- ), /* @__PURE__ */ React4.createElement(
755
- Drawer,
756
- {
757
- open: drawerOpen,
758
- onClose: toggleDrawer(false),
759
- anchor: anchor != null ? anchor : "left",
760
- sx: {
761
- "& .MuiDrawer-paper": {
762
- width: width != null ? width : "450px",
763
- boxSizing: "border-box",
764
- borderRadius: anchor !== "right" ? "0px 4px 4px 0px" : "4px 0px 0px 4px"
765
- }
766
- }
767
- },
768
- /* @__PURE__ */ React4.createElement(Stack3, { flexDirection: "column", height: "100%" }, /* @__PURE__ */ React4.createElement(Grid3, { container: true, sx: { backgroundColor: "secondary.main", alignItems: "center", height: "42px", textAlign: "left", padding: "10px 12px 10px 12px", justifyContent: "space-between", alignContent: "center" } }, /* @__PURE__ */ React4.createElement(Typography4, { variant: "h6", color: colorTitle || "text.primary" }, title != null ? title : "Personaliza tu b\xFAsqueda"), /* @__PURE__ */ React4.createElement(IconButton3, { onClick: handleDrawerClose }, /* @__PURE__ */ React4.createElement(CloseIcon, { color: "action", "data-testid": "test-button-close" }))), /* @__PURE__ */ React4.createElement(Stack3, { alignItems: "flex-start", height: "100%", gap: "16px", flex: 1, overflow: "auto", padding: "12px 16px 12px 16px" }, arrayElements == null ? void 0 : arrayElements.map((arrayElement, index) => {
769
- var _a2, _b;
770
- return /* @__PURE__ */ React4.createElement(
771
- Box4,
772
- {
773
- key: `Stack_${(_a2 = arrayElement.type) != null ? _a2 : ""} ${(_b = arrayElement.label) != null ? _b : ""}${index}`,
774
- sx: { width: "100%" }
775
- },
776
- arrayElement.component ? /* @__PURE__ */ React4.createElement(Stack3, { direction: "row", alignItems: "left", gap: 1 }, arrayElement.component) : arrayElement.type === "textField" ? /* @__PURE__ */ React4.createElement(
777
- SCTextField,
778
- {
779
- title: arrayElement.title,
780
- iconTitle: arrayElement.iconTitle,
781
- infoTitle: arrayElement.infoTitle,
782
- label: arrayElement.label,
783
- placeholder: arrayElement.placeholder,
784
- infoElement: arrayElement.infoElement,
785
- iconInputStart: arrayElement.iconInputStart,
786
- iconInputEnd: arrayElement.iconInputEnd,
787
- maxLength: arrayElement.maxLength,
788
- variant: arrayElement.variant,
789
- format: arrayElement.format,
790
- disabled: arrayElement.disabled,
791
- required: arrayElement.required,
792
- size: arrayElement.size,
793
- width: arrayElement.width,
794
- color: arrayElement.color,
795
- background: arrayElement.background,
796
- state: arrayElement.state,
797
- value: arrayElement.value || "",
798
- onChange: arrayElement.onChange,
799
- onBlur: arrayElement.onBlur,
800
- onKeyDown: arrayElement.onKeyDown
801
- }
802
- ) : arrayElement.type === "textArea" ? /* @__PURE__ */ React4.createElement(
803
- SCTextArea,
804
- {
805
- title: arrayElement.title,
806
- iconTitle: arrayElement.iconTitle,
807
- infoTitle: arrayElement.infoTitle,
808
- label: arrayElement.label,
809
- placeholder: arrayElement.placeholder,
810
- maxLength: arrayElement.maxLength,
811
- variant: arrayElement.variant,
812
- disabled: arrayElement.disabled,
813
- required: arrayElement.required,
814
- width: arrayElement.width,
815
- rows: arrayElement.rows,
816
- background: arrayElement.background,
817
- state: arrayElement.state,
818
- value: arrayElement.value || "",
819
- onBlur: arrayElement.onBlur
820
- }
821
- ) : null
822
- );
823
- })), actions != void 0 && actions.length > 0 ? /* @__PURE__ */ React4.createElement(
824
- Grid3,
825
- {
826
- container: true,
827
- bgcolor: "background.default",
828
- gap: 2,
829
- padding: "9px 16px 9px 16px",
830
- height: "42px",
831
- alignItems: "center",
832
- justifyContent: actions.length > 1 ? "space-between" : !anchor && anchor != "right" ? "flex-end" : "flex-start",
833
- flexDirection: anchor != "right" ? "row-reverse" : "row"
834
- },
835
- actions.map((btn, index) => /* @__PURE__ */ React4.createElement(
836
- Button2,
837
- {
838
- key: index,
839
- variant: index === 0 || actions && actions.length < 2 ? "contained" : "text",
840
- color: "primary",
841
- onClick: btn.fn,
842
- disabled: btn.disabled || false,
843
- size: "small"
844
- },
845
- btn.text
846
- ))
847
- ) : "")
848
- ));
849
- };
850
-
851
- // src/Components/MultiSelect/SCMultiSelect.tsx
852
- import React5, { useEffect as useEffect5, useMemo as useMemo2 } from "react";
853
- import { Button as Button3, Checkbox, FormControl as FormControl2, InputAdornment as InputAdornment2, ListItemIcon, MenuItem, Popover as Popover3, Stack as Stack4, TextField as TextField2 } from "@mui/material";
854
- import { SearchOutlined } from "@mui/icons-material";
855
-
856
- // src/Components/MultiSelect/helpers/useHandlers.tsx
857
- import { useCallback, useState as useState5 } from "react";
858
- function useMultiSelectHandlers() {
859
- const [anchorEl, setAnchorEl] = useState5(null);
860
- const [open, setOpen] = useState5(false);
861
- const [selectedItems, setSelectedItems] = useState5([]);
862
- const [filterValue, setFilterValue] = useState5("");
863
- const handleOpen = useCallback((e) => {
864
- setAnchorEl(e.currentTarget);
865
- setOpen(true);
866
- }, []);
867
- const handleClose = useCallback(() => {
868
- setAnchorEl(null);
869
- setOpen(false);
870
- }, []);
871
- const handleFilterChange = useCallback(
872
- (e) => {
873
- setFilterValue(e.target.value);
874
- },
875
- []
876
- );
877
- const handleCheckboxToggle = useCallback((item) => {
878
- setSelectedItems(
879
- (prev) => prev.includes(item) ? prev.filter((i) => i !== item) : [...prev, item]
880
- );
881
- }, []);
882
- return {
883
- anchorEl,
884
- open,
885
- selectedItems,
886
- filterValue,
887
- setSelectedItems,
888
- handleOpen,
889
- handleClose,
890
- handleFilterChange,
891
- handleCheckboxToggle,
892
- setOpen
893
- };
894
- }
895
-
896
- // src/Components/MultiSelect/helpers/Utils.tsx
897
- import * as MuiIcons2 from "@mui/icons-material";
898
- import { FilterListOutlined as FilterListOutlined2 } from "@mui/icons-material";
899
- function getIconMultiSelect(name) {
900
- return name in MuiIcons2 ? MuiIcons2[name] : FilterListOutlined2;
901
- }
902
-
903
- // src/Components/MultiSelect/helpers/useFilteredItems.tsx
904
- import { useMemo } from "react";
905
- function useFilteredItems(items, filterValue, getItemLabel, selectedItems) {
906
- const filteredItems = useMemo(
907
- () => items.filter(
908
- (item) => getItemLabel(item).toLowerCase().includes(filterValue.toLowerCase())
909
- ),
910
- [items, filterValue, getItemLabel]
911
- );
912
- const sortedItems = useMemo(() => {
913
- return [
914
- ...filteredItems.filter((item) => selectedItems.includes(item)),
915
- ...filteredItems.filter((item) => !selectedItems.includes(item))
916
- ];
917
- }, [filteredItems, selectedItems]);
918
- return { filteredItems, sortedItems };
919
- }
920
-
921
- // src/Components/MultiSelect/SCMultiSelect.tsx
922
- function SCMultiSelect({
923
- textButton,
924
- button,
925
- items,
926
- topPanel,
927
- actions,
928
- dense = false,
929
- open,
930
- selectAll = false,
931
- getItemLabel
932
- }) {
933
- var _a, _b;
934
- const {
935
- anchorEl,
936
- open: openMultiselect,
937
- selectedItems,
938
- filterValue,
939
- setSelectedItems,
940
- handleOpen,
941
- handleClose,
942
- handleFilterChange,
943
- handleCheckboxToggle,
944
- setOpen
945
- } = useMultiSelectHandlers();
946
- useEffect5(() => {
947
- if (open !== void 0) {
948
- setOpen(open);
949
- }
950
- }, [open, setOpen]);
951
- useEffect5(() => {
952
- setSelectedItems([]);
953
- }, [items, setSelectedItems]);
954
- const { filteredItems, sortedItems } = useFilteredItems(items, filterValue, getItemLabel, selectedItems);
955
- const Icon = useMemo2(() => {
956
- var _a2;
957
- return getIconMultiSelect((_a2 = button == null ? void 0 : button.icon) != null ? _a2 : "FilterListOutlined");
958
- }, [button == null ? void 0 : button.icon]);
959
- const handleSelectAll = () => {
960
- const allSelected2 = selectedItems.length === filteredItems.length;
961
- setSelectedItems(allSelected2 ? [] : filteredItems);
962
- };
963
- const allSelected = filteredItems.length > 0 && selectedItems.length === filteredItems.length;
964
- const resolvedActions = actions != null ? actions : [
965
- { text: "Limpiar", fn: handleClose },
966
- { text: "Aplicar", fn: () => {
967
- } }
968
- ];
969
- return /* @__PURE__ */ React5.createElement(React5.Fragment, null, /* @__PURE__ */ React5.createElement(
970
- Button3,
971
- {
972
- "test-id": "multiselect-button",
973
- color: (_a = button == null ? void 0 : button.color) != null ? _a : "primary",
974
- onClick: handleOpen,
975
- variant: (_b = button == null ? void 0 : button.variant) != null ? _b : "text",
976
- size: "small",
977
- startIcon: (button == null ? void 0 : button.iconPosition) === "left" || !(button == null ? void 0 : button.iconPosition) ? /* @__PURE__ */ React5.createElement(Icon, null) : null,
978
- endIcon: (button == null ? void 0 : button.iconPosition) === "right" ? /* @__PURE__ */ React5.createElement(Icon, null) : null
979
- },
980
- capitalize(textButton != null ? textButton : "MultiSelect")
981
- ), /* @__PURE__ */ React5.createElement(
982
- Popover3,
983
- {
984
- elevation: 8,
985
- anchorEl,
986
- anchorOrigin: { vertical: "bottom", horizontal: "left" },
987
- open: openMultiselect,
988
- onClose: () => setOpen(false)
989
- },
990
- /* @__PURE__ */ React5.createElement(Stack4, { minWidth: "320px", "data-testid": "multiselect-container", bgcolor: "white", boxShadow: 3, borderRadius: 1 }, /* @__PURE__ */ React5.createElement(Stack4, { py: 1, px: 2 }, topPanel != null ? topPanel : /* @__PURE__ */ React5.createElement(FormControl2, { fullWidth: true, size: "small" }, /* @__PURE__ */ React5.createElement(
991
- TextField2,
992
- {
993
- "data-testid": "multiselect-input",
994
- fullWidth: true,
995
- size: "small",
996
- variant: "outlined",
997
- placeholder: "Buscar",
998
- value: filterValue,
999
- onChange: handleFilterChange,
1000
- slotProps: {
1001
- input: {
1002
- endAdornment: /* @__PURE__ */ React5.createElement(InputAdornment2, { position: "end" }, /* @__PURE__ */ React5.createElement(SearchOutlined, { fontSize: "small" }))
1003
- }
1004
- }
1005
- }
1006
- ))), /* @__PURE__ */ React5.createElement(Stack4, { maxHeight: "300px", overflow: "auto" }, selectAll && /* @__PURE__ */ React5.createElement(MenuItem, { dense, onClick: handleSelectAll }, /* @__PURE__ */ React5.createElement(ListItemIcon, null, /* @__PURE__ */ React5.createElement(Checkbox, { checked: allSelected, color: "primary" })), "Todos los items"), sortedItems.length > 0 ? sortedItems.map((item) => /* @__PURE__ */ React5.createElement(
1007
- MenuItem,
1008
- {
1009
- key: getItemLabel(item),
1010
- dense,
1011
- onClick: () => handleCheckboxToggle(item)
1012
- },
1013
- /* @__PURE__ */ React5.createElement(ListItemIcon, null, /* @__PURE__ */ React5.createElement(
1014
- Checkbox,
1015
- {
1016
- checked: selectedItems.includes(item),
1017
- color: "primary"
1018
- }
1019
- )),
1020
- getItemLabel(item)
1021
- )) : /* @__PURE__ */ React5.createElement(MenuItem, { disabled: true }, "No se encontraron resultados")), /* @__PURE__ */ React5.createElement(Stack4, { direction: "row", gap: 1, p: 1, justifyContent: "space-between", bgcolor: "grey.50" }, resolvedActions.map((button2, index) => {
1022
- var _a2;
1023
- return /* @__PURE__ */ React5.createElement(
1024
- Button3,
1025
- {
1026
- key: index,
1027
- variant: index === 0 || resolvedActions.length < 2 ? "text" : "contained",
1028
- onClick: button2.fn,
1029
- disabled: (_a2 = button2.disabled) != null ? _a2 : false,
1030
- size: "small"
1031
- },
1032
- capitalize(button2.text)
1033
- );
1034
- })))
1035
- ));
1036
- }
1037
-
1038
- // src/Components/SCDialog.tsx
1039
- import React6, { useEffect as useEffect6, useState as useState6 } from "react";
1040
- import { Button as Button4, Typography as Typography5, Modal, Dialog, DialogActions, DialogContent, DialogTitle, IconButton as IconButton4, Tooltip as Tooltip3, Box as Box5, SvgIcon as SvgIcon3 } from "@mui/material";
1041
- import Grid4 from "@mui/material/Grid2";
1042
- import CloseIcon2 from "@mui/icons-material/Close";
1043
- import * as Muicon3 from "@mui/icons-material";
1044
- var SCDialog = ({ title, iconTitle, subtitle, content, actions, buttonDialog, disableClose, dividers, widthContent, heightContent, background, setShow, show }) => {
1045
- let i = 0;
1046
- let iconTitleValidation = "";
1047
- let IconTitle;
1048
- let ButtonIcon;
1049
- const [open, setOpen] = useState6(show);
1050
- useEffect6(() => {
1051
- if (show) {
1052
- handleOpen();
1053
- }
1054
- }, [show]);
1055
- if ((buttonDialog == null ? void 0 : buttonDialog.icon) != void 0) {
1056
- if (Muicon3[buttonDialog == null ? void 0 : buttonDialog.icon] == void 0) {
1057
- ButtonIcon = buttonDialog == null ? void 0 : buttonDialog.icon;
1058
- } else {
1059
- ButtonIcon = Muicon3[buttonDialog == null ? void 0 : buttonDialog.icon];
1060
- }
1061
- }
1062
- if (iconTitle) {
1063
- if (Muicon3[iconTitle] == void 0) {
1064
- if (iconTitle && React6.isValidElement(iconTitle) && iconTitle.type == void 0) {
1065
- iconTitleValidation = "image";
1066
- IconTitle = iconTitle;
1067
- } else {
1068
- iconTitleValidation = "icon";
1069
- IconTitle = iconTitle;
1070
- }
1071
- } else {
1072
- iconTitleValidation = "icon";
1073
- IconTitle = Muicon3[iconTitle];
1074
- }
1075
- }
1076
- const handleOpen = () => setOpen(true);
1077
- const handleClose = () => {
1078
- setOpen(false);
1079
- if (setShow) {
1080
- setShow(false);
1081
- }
1082
- };
1083
- const dialogActions = actions != null ? actions : [{ text: "Cerrar", fn: handleClose }];
1084
- content = content != null ? content : { component: /* @__PURE__ */ React6.createElement(Box5, null, " Aqui va el contenido ") };
1085
- return /* @__PURE__ */ React6.createElement("div", null, buttonDialog ? /* @__PURE__ */ React6.createElement(React6.Fragment, null, buttonDialog.text != void 0 ? /* @__PURE__ */ React6.createElement(Tooltip3, { placement: "bottom-start", title: buttonDialog.tooltip != void 0 ? buttonDialog.tooltip : "", slotProps: { popper: { modifiers: [{ name: "offset", options: { offset: [0, -14] } }] } } }, /* @__PURE__ */ React6.createElement(Button4, { 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) == "left" || !(buttonDialog == null ? void 0 : buttonDialog.iconPosition) ? /* @__PURE__ */ React6.createElement(ButtonIcon, { color: buttonDialog.color != void 0 ? buttonDialog.color : "primary" }) : "", endIcon: (buttonDialog == null ? void 0 : buttonDialog.iconPosition) == "right" ? /* @__PURE__ */ React6.createElement(ButtonIcon, { color: buttonDialog.color != void 0 ? buttonDialog.color : "primary" }) : "", onClick: handleOpen }, " ", (buttonDialog == null ? void 0 : buttonDialog.text) != void 0 ? buttonDialog.text : "", " ")) : /* @__PURE__ */ React6.createElement(IconButton4, { style: { cursor: "pointer" }, onClick: handleOpen }, /* @__PURE__ */ React6.createElement(SvgIcon3, { fontSize: "small", color: (buttonDialog == null ? void 0 : buttonDialog.color) != void 0 ? buttonDialog == null ? void 0 : buttonDialog.color : "action", component: ButtonIcon }))) : "", /* @__PURE__ */ React6.createElement(Modal, { open: open || false, onClose: handleClose }, /* @__PURE__ */ React6.createElement(
1086
- Dialog,
1087
- {
1088
- open: open || false,
1089
- onClose: disableClose ? void 0 : handleClose,
1090
- maxWidth: "xl",
1091
- sx: {
1092
- width: "100% !important",
1093
- "& .MuiBackdrop-root": {
1094
- backdropFilter: "blur(0px) !important"
1095
- }
1096
- }
1097
- },
1098
- title && /* @__PURE__ */ React6.createElement(DialogTitle, { sx: { m: 0, padding: "8px 16px 8px 16px" }, id: "dialog-title" }, /* @__PURE__ */ React6.createElement(Grid4, { container: true, size: 12, sx: { justifyContent: "space-between" } }, /* @__PURE__ */ React6.createElement(Grid4, { container: true, size: 11, sx: { alignItems: "center" } }, iconTitle ? iconTitleValidation == "image" ? /* @__PURE__ */ React6.createElement(Box5, { sx: { marginRight: "16px", width: "44px", height: "44px", borderRadius: "1px" } }, /* @__PURE__ */ React6.createElement("img", { src: IconTitle, width: "44px", height: "44px" })) : /* @__PURE__ */ React6.createElement(SvgIcon3, { color: "action", fontSize: "small", component: IconTitle, sx: { marginRight: "16px" } }) : "", /* @__PURE__ */ React6.createElement(Grid4, null, /* @__PURE__ */ React6.createElement(Typography5, { color: "text.primary", variant: "h6", gutterBottom: true }, title ? title : ""), /* @__PURE__ */ React6.createElement(Typography5, { color: "text.secondary", variant: "body2", gutterBottom: true }, subtitle ? subtitle : ""))), disableClose != true ? /* @__PURE__ */ React6.createElement(IconButton4, { onClick: handleClose, size: "small", color: "default", sx: { height: 22, width: 22 } }, /* @__PURE__ */ React6.createElement(CloseIcon2, null)) : "")),
1099
- /* @__PURE__ */ React6.createElement(
1100
- DialogContent,
1101
- {
1102
- dividers: dividers ? dividers : false,
1103
- sx: {
1104
- m: 0,
1105
- padding: "12px 16px 8px 16px",
1106
- background: background ? background : "white",
1107
- height: !heightContent ? "508px" : heightContent,
1108
- width: widthContent == "extra-small" ? "444px" : widthContent == "small" ? "600px" : widthContent == "medium" ? "900px" : widthContent == "large" ? "1200px" : widthContent == "extra-large" ? "1536px" : "900px"
1109
- }
1110
- },
1111
- content.url ? /* @__PURE__ */ React6.createElement(
1112
- "iframe",
1113
- {
1114
- style: { border: "none", minWidth: "100%", minHeight: "100%" },
1115
- id: "inlineFrameExample",
1116
- title: "Inline Frame Example",
1117
- src: content.url
1118
- }
1119
- ) : content.component
1120
- ),
1121
- dialogActions.length > 0 ? /* @__PURE__ */ React6.createElement(DialogActions, { sx: { gap: 1, m: 0, padding: "12px 16px 12px 16px" } }, dialogActions.map((boton) => /* @__PURE__ */ React6.createElement(
1122
- Button4,
1123
- {
1124
- key: i = i + 1,
1125
- autoFocus: true,
1126
- variant: i == 1 || dialogActions.length < 2 ? "contained" : "text",
1127
- color: "primary",
1128
- size: "small",
1129
- onClick: boton.fn,
1130
- disabled: boton.disabled || false
1131
- },
1132
- boton.text
1133
- ))) : ""
1134
- )));
1135
- };
1136
-
1137
- // src/Components/SCMenu.tsx
1138
- import React7 from "react";
1139
- import { Box as Box6, Typography as Typography6, Paper, Divider as Divider2, MenuList, MenuItem as MenuItem2, ListItemIcon as ListItemIcon2, SvgIcon as SvgIcon4 } from "@mui/material";
1140
- import Grid5 from "@mui/material/Grid2";
1141
-
1142
- // src/Components/Hooks/useWindowDimensions.ts
1143
- import { useState as useState7, useEffect as useEffect7 } from "react";
1144
- function getWindowDimensions() {
1145
- const { innerWidth: width, innerHeight: height } = window;
1146
- return {
1147
- width,
1148
- height
1149
- };
1150
- }
1151
- function useWindowDimensions() {
1152
- const [windowDimensions, setWindowDimensions] = useState7(getWindowDimensions());
1153
- useEffect7(() => {
1154
- function handleResize() {
1155
- setWindowDimensions(getWindowDimensions());
1156
- }
1157
- window.addEventListener("resize", handleResize);
1158
- return () => window.removeEventListener("resize", handleResize);
1159
- }, []);
1160
- return windowDimensions;
1161
- }
1162
-
1163
- // src/Components/SCMenu.tsx
1164
- import * as Muicon4 from "@mui/icons-material";
1165
- var SCMenu = ({ header, options, defaultOption, disable, widthMenu, heightMenu, widthPage }) => {
1166
- const { height, width } = useWindowDimensions();
1167
- const menuSize = widthMenu ? parseInt(widthMenu) : 284;
1168
- const pageSize = widthPage ? parseInt(widthPage) : width - menuSize;
1169
- const widthContainer = menuSize + pageSize;
1170
- let heightContainer = heightMenu ? parseInt(heightMenu) : height - 76;
1171
- const [selectedIndex, setSelectedIndex] = React7.useState("1");
1172
- const [value, setValue] = React7.useState("1");
1173
- React7.useEffect(() => {
1174
- heightContainer = heightMenu ? parseInt(heightMenu) : height - 76;
1175
- }, [height]);
1176
- React7.useEffect(() => {
1177
- if (defaultOption) {
1178
- handleClickMenusItem(event, void 0);
1179
- }
1180
- }, [defaultOption]);
1181
- options.map(function(option, index, array) {
1182
- if (option == null ? void 0 : option.iconLeft) {
1183
- if ((option == null ? void 0 : option.iconLeft.type) == void 0) {
1184
- option.iconLeft = Muicon4[option == null ? void 0 : option.iconLeft];
1185
- } else {
1186
- option;
1187
- }
1188
- }
1189
- if (option == null ? void 0 : option.iconRight) {
1190
- if ((option == null ? void 0 : option.iconRight.type) == void 0) {
1191
- option.iconRight = Muicon4[option == null ? void 0 : option.iconRight];
1192
- } else {
1193
- option;
1194
- }
1195
- }
1196
- });
1197
- const handleClickMenusItem = (event2, index) => {
1198
- if (defaultOption && index == void 0) {
1199
- setSelectedIndex(defaultOption);
1200
- setValue(defaultOption);
1201
- } else if (index != void 0) {
1202
- setSelectedIndex(String(index + 1));
1203
- setValue(String(index + 1));
1204
- }
1205
- };
1206
- return /* @__PURE__ */ React7.createElement(React7.Fragment, null, /* @__PURE__ */ React7.createElement(Grid5, { container: true, sx: { height: heightContainer, width: widthContainer, flexDirection: "column" } }, /* @__PURE__ */ React7.createElement(Paper, { sx: { width: menuSize, height: heightContainer, overflow: "auto" } }, header && header.component, /* @__PURE__ */ React7.createElement(MenuList, { sx: { height: options.length * 45, padding: "8px 0px" } }, options.map((option, index) => /* @__PURE__ */ React7.createElement(React7.Fragment, null, /* @__PURE__ */ React7.createElement(
1207
- MenuItem2,
1208
- {
1209
- disabled: disable == true ? true : false,
1210
- key: index,
1211
- selected: String(index + 1) === selectedIndex,
1212
- onClick: (event2) => handleClickMenusItem(event2, index)
1213
- },
1214
- option.iconLeft ? /* @__PURE__ */ React7.createElement(ListItemIcon2, { sx: { color: String(index + 1) === selectedIndex ? "primary" : "active" } }, /* @__PURE__ */ React7.createElement(SvgIcon4, { fontSize: "small", color: String(index + 1) === selectedIndex ? "primary" : "action", component: option.iconLeft })) : "",
1215
- /* @__PURE__ */ React7.createElement(Grid5, { container: true, size: 12, sx: { maxWidth: 220, flexWrap: "noWrap", alignItems: "center" } }, /* @__PURE__ */ React7.createElement(Typography6, { noWrap: true, variant: "caption", color: String(index + 1) === selectedIndex ? "primary" : "active" }, option.name), option.iconRight ? /* @__PURE__ */ React7.createElement(ListItemIcon2, { sx: { minWidth: "0px !important", color: String(index + 1) === selectedIndex ? "primary" : "active" } }, /* @__PURE__ */ React7.createElement(SvgIcon4, { fontSize: "small", color: String(index + 1) === selectedIndex ? "primary" : "action", component: option.iconRight })) : "")
1216
- ), option.divider == true ? /* @__PURE__ */ React7.createElement(Divider2, null) : "")))), /* @__PURE__ */ React7.createElement(Grid5, { container: true }, options.map((option, index) => option.page ? String(index + 1) == value ? /* @__PURE__ */ React7.createElement(Box6, { sx: { padding: "16px", width: pageSize, height: heightContainer }, key: index }, option.page) : "" : /* @__PURE__ */ React7.createElement(Typography6, { color: "error" }, "No se ha configurado el componente a visualizar")))));
1217
- };
1218
-
1219
- // src/Components/SCTabs.tsx
1220
- import React8, { useEffect as useEffect8 } from "react";
1221
- import { Typography as Typography7, Box as Box7, SvgIcon as SvgIcon5, Tab, Tabs, Badge } from "@mui/material";
1222
- import TabPanel from "@mui/lab/TabPanel";
1223
- import TabContext from "@mui/lab/TabContext";
1224
- import * as Muicon5 from "@mui/icons-material";
1225
- var SCTabs = ({ options, defaultOption, typeIcon, background, iconPosition, colorTab, orientation, variant, scrollButtons, children }) => {
1226
- const [toast, setToast] = React8.useState(null);
1227
- let i = 0;
1228
- let j = 0;
1229
- let k = 0;
1230
- let l = 0;
1231
- let validateTypeIcon = true;
1232
- const [value, setValue] = React8.useState("1");
1233
- useEffect8(() => {
1234
- if (defaultOption) {
1235
- handleChange(event, void 0);
1236
- }
1237
- }, [defaultOption]);
1238
- options.map(function(option) {
1239
- const optionsLength = options.length;
1240
- if (option == null ? void 0 : option.iconOrBadge) {
1241
- if (typeIcon == "icon") {
1242
- if ((option == null ? void 0 : option.iconOrBadge) in Muicon5 == true) {
1243
- validateTypeIcon = true;
1244
- option.iconOrBadge = Muicon5[option == null ? void 0 : option.iconOrBadge];
1245
- } else {
1246
- validateTypeIcon = false;
1247
- setTimeout(() => {
1248
- setToast({
1249
- type: "error",
1250
- title: "Componente SCTabs",
1251
- subtitle: "En Option todos los iconOrBadge deben ser iconos de MUI, por favor verificar.",
1252
- time: 50
1253
- });
1254
- }, 10);
1255
- return;
1256
- }
1257
- } else if (typeIcon == "badge") {
1258
- if ((option == null ? void 0 : option.iconOrBadge) in Muicon5 == false) {
1259
- validateTypeIcon = true;
1260
- option;
1261
- } else {
1262
- validateTypeIcon = false;
1263
- setTimeout(() => {
1264
- setToast({
1265
- type: "error",
1266
- title: "Componente SCTabs",
1267
- subtitle: "En Option todos los iconOrBadge deben ser numeros para el badge, por favor verificar.",
1268
- time: 10
1269
- });
1270
- }, 10);
1271
- return;
1272
- }
1273
- }
1274
- }
1275
- });
1276
- const handleChange = (event2, newValue) => {
1277
- if (defaultOption && newValue == void 0) {
1278
- setValue(defaultOption);
1279
- } else if (newValue != void 0) {
1280
- setValue(newValue);
1281
- }
1282
- };
1283
- return /* @__PURE__ */ React8.createElement(React8.Fragment, null, validateTypeIcon == true ? /* @__PURE__ */ React8.createElement(Box7, { sx: { height: orientation == "vertical" ? "100%" : "auto", display: "flex", flexDirection: orientation == "vertical" ? "row" : "column" }, id: "tabsitos" }, /* @__PURE__ */ React8.createElement(TabContext, { value }, /* @__PURE__ */ React8.createElement(
1284
- Tabs,
1285
- {
1286
- value,
1287
- onChange: handleChange,
1288
- variant: variant ? orientation == "vertical" && variant == "fullWidth" ? "standard" : variant : "standard",
1289
- scrollButtons: scrollButtons == false ? false : true,
1290
- visibleScrollbar: scrollButtons == false ? true : false,
1291
- textColor: colorTab,
1292
- indicatorColor: colorTab,
1293
- orientation: orientation || "horizontal",
1294
- sx: { borderBottom: orientation == "vertical" ? 0 : 1, borderRight: orientation == "vertical" ? 1 : 0, borderColor: "divider", background: background || "" }
1295
- },
1296
- options.map((option) => /* @__PURE__ */ React8.createElement(
1297
- Tab,
1298
- {
1299
- value: String(i = i + 1),
1300
- key: j = j + 1,
1301
- label: option.name || "",
1302
- disabled: option.disabled || false,
1303
- iconPosition: iconPosition || "end",
1304
- icon: typeIcon == "badge" ? /* @__PURE__ */ React8.createElement(
1305
- Badge,
1306
- {
1307
- sx: {
1308
- width: "20px",
1309
- height: "20px",
1310
- "& .MuiBadge-badge": {
1311
- top: "10px",
1312
- right: "10px"
1313
- }
1314
- },
1315
- variant: "standard",
1316
- badgeContent: option.iconOrBadge,
1317
- color: value == String(i) ? colorTab ? colorTab : "primary" : "default"
1318
- }
1319
- ) : typeIcon == "icon" ? /* @__PURE__ */ React8.createElement(SvgIcon5, { fontSize: "small", component: option.iconOrBadge, color: value == String(i) ? colorTab ? colorTab : "primary" : "action", sx: { width: "20px", height: "20px" } }) : "",
1320
- sx: { "& .MuiTab-icon": { margin: "0px !important" }, padding: "10px 16px", gap: "4px" }
1321
- }
1322
- ))
1323
- ), children, options.map((option) => /* @__PURE__ */ React8.createElement(
1324
- TabPanel,
1325
- {
1326
- key: k = k + 1,
1327
- value: String(l = l + 1),
1328
- sx: { padding: "16px" }
1329
- },
1330
- option.page ? option.page : /* @__PURE__ */ React8.createElement(Typography7, null, "No se ha configurado el componente a visualizar ")
1331
- )))) : /* @__PURE__ */ React8.createElement(Box7, { sx: { height: "200px" } }, toast && /* @__PURE__ */ React8.createElement(SCToastNotification, __spreadValues({}, toast))));
1332
- };
1333
-
1334
- // src/Components/FooterAction/FooterAction.tsx
1335
- import React9 from "react";
1336
- import { AppBar, Toolbar, Box as Box8, Typography as Typography8 } from "@mui/material";
1337
- var FooterAction = ({
1338
- leftContent,
1339
- rightContent,
1340
- label,
1341
- variant
1342
- }) => {
1343
- return /* @__PURE__ */ React9.createElement(
1344
- AppBar,
1345
- {
1346
- color: "inherit",
1347
- sx: { position: variant == "float" ? "relative" : "fixed", left: 0, right: "auto", width: "100%", top: "auto", bottom: 0 }
1348
- },
1349
- /* @__PURE__ */ React9.createElement(
1350
- Toolbar,
1351
- {
1352
- id: "footer-toolbar",
1353
- sx: { gap: 1.5, minHeight: "50px !important" }
1354
- },
1355
- leftContent,
1356
- /* @__PURE__ */ React9.createElement(Box8, { flexGrow: 1 }),
1357
- label && /* @__PURE__ */ React9.createElement(Typography8, { variant: "body2", color: "text.secondary" }, label),
1358
- rightContent
1359
- )
1360
- );
1361
- };
1362
-
1363
- // src/Components/Modal/Helpers/Data.tsx
1364
- import React10 from "react";
1365
- import { Info, Warning } from "@mui/icons-material";
1366
- var modalStateConfig = {
1367
- info: {
1368
- color: "info",
1369
- defaultDescription: "Se [sincronizar\xE1n] los datos trabajados en modo offline y se [subir\xE1n] a los servidores.",
1370
- icon: /* @__PURE__ */ React10.createElement(Info, { color: "info", fontSize: "medium" })
1371
- },
1372
- delete: {
1373
- color: "delete",
1374
- defaultDescription: "[Elemento espec\xEDfico] [dejar\xE1 de existir en todos los lugares donde est\xE9 en uso]. Esta acci\xF3n es irreversible.",
1375
- icon: /* @__PURE__ */ React10.createElement(Info, { color: "error", fontSize: "medium" })
1376
- },
1377
- warning: {
1378
- color: "warning",
1379
- defaultDescription: "Se descartar\xE1 la [creaci\xF3n] y los cambios se perder\xE1n.",
1380
- icon: /* @__PURE__ */ React10.createElement(Warning, { color: "warning", fontSize: "medium" })
1381
- }
1382
- };
1383
-
1384
- // src/Components/Modal/Helpers/Utils.tsx
1385
- import * as MuiIcons3 from "@mui/icons-material";
1386
- import { FilterListOutlined as FilterListOutlined3 } from "@mui/icons-material";
1387
- var getIconComponent2 = (iconName) => {
1388
- return iconName && MuiIcons3[iconName] ? MuiIcons3[iconName] : FilterListOutlined3;
1389
- };
1390
- var getModalColor = (state) => {
1391
- var _a;
1392
- const colors = {
1393
- info: "info.100",
1394
- delete: "error.100",
1395
- warning: "warning.100"
1396
- };
1397
- return (_a = colors[state]) != null ? _a : "warning.100";
1398
- };
1399
- var getButtonColor = (state) => {
1400
- var _a;
1401
- const colorMap = {
1402
- info: "info",
1403
- delete: "error",
1404
- warning: "warning"
1405
- };
1406
- return (_a = colorMap[state]) != null ? _a : "info";
1407
- };
1408
-
1409
- // src/Components/Modal/SCModal.tsx
1410
- import React11, { useCallback as useCallback2, useEffect as useEffect9, useMemo as useMemo3, useState as useState8 } from "react";
1411
- import { Modal as Modal3, Box as Box9, Typography as Typography9, IconButton as IconButton6, Button as Button6, Stack as Stack5 } from "@mui/material";
1412
- import { Close as Close2 } from "@mui/icons-material";
1413
- var SCModal = ({
1414
- buttonModal,
1415
- state = "info",
1416
- open,
1417
- title,
1418
- description,
1419
- action
1420
- }) => {
1421
- var _a, _b, _c, _d, _e;
1422
- const [openModal, setOpenModal] = useState8(open != null ? open : false);
1423
- useEffect9(() => {
1424
- if (open !== void 0) {
1425
- setOpenModal(open);
1426
- }
1427
- }, [open]);
1428
- const Icon = useMemo3(() => getIconComponent2(buttonModal == null ? void 0 : buttonModal.icon), [buttonModal == null ? void 0 : buttonModal.icon]);
1429
- const handleClose = useCallback2(() => setOpenModal(false), []);
1430
- const toggleModal = (newOpen) => () => setOpenModal(newOpen);
1431
- const prevAction = useMemo3(
1432
- () => action != null ? action : [{ text: "Cancelar", fn: handleClose }, { text: "Consultar", fn: () => {
1433
- } }],
1434
- [action, handleClose]
1435
- );
1436
- const { icon, defaultDescription } = modalStateConfig[state];
1437
- return /* @__PURE__ */ React11.createElement(React11.Fragment, null, /* @__PURE__ */ React11.createElement(
1438
- Button6,
1439
- {
1440
- "data-testid": "test-buttonModal",
1441
- color: (_a = buttonModal == null ? void 0 : buttonModal.color) != null ? _a : "primary",
1442
- onClick: toggleModal(true),
1443
- variant: (_b = buttonModal == null ? void 0 : buttonModal.variant) != null ? _b : "text",
1444
- size: (_c = buttonModal == null ? void 0 : buttonModal.size) != null ? _c : "small",
1445
- startIcon: (buttonModal == null ? void 0 : buttonModal.iconPosition) === "left" && /* @__PURE__ */ React11.createElement(Icon, null),
1446
- endIcon: (buttonModal == null ? void 0 : buttonModal.iconPosition) === "right" && /* @__PURE__ */ React11.createElement(Icon, null)
1447
- },
1448
- capitalize((_d = buttonModal == null ? void 0 : buttonModal.text) != null ? _d : "filtrar")
1449
- ), /* @__PURE__ */ React11.createElement(Modal3, { open: openModal, onClose: toggleModal(false), sx: { boxShadow: 8 } }, /* @__PURE__ */ React11.createElement(
1450
- Box9,
1451
- {
1452
- sx: {
1453
- position: "absolute",
1454
- top: "50%",
1455
- left: "50%",
1456
- transform: "translate(-50%, -50%)",
1457
- width: 400,
1458
- bgcolor: "background.paper",
1459
- borderRadius: 1,
1460
- boxShadow: 24
1461
- }
1462
- },
1463
- /* @__PURE__ */ React11.createElement(Stack5, { direction: "row", justifyContent: "space-between", alignItems: "center" }, /* @__PURE__ */ React11.createElement(Stack5, { direction: "row", alignItems: "center", p: 1, gap: 1.5 }, /* @__PURE__ */ React11.createElement(Box9, { display: "flex", justifyContent: "center", alignItems: "center", borderRadius: "50%", height: 36, width: 36, bgcolor: getModalColor(state) }, icon), /* @__PURE__ */ React11.createElement(Typography9, { variant: "h6", color: "text.primary" }, title)), /* @__PURE__ */ React11.createElement(IconButton6, { onClick: toggleModal(false), "data-testid": "test-buttonClose" }, /* @__PURE__ */ React11.createElement(Close2, { color: "action" }))),
1464
- /* @__PURE__ */ React11.createElement(Stack5, { py: 1, px: 3, gap: 1.5 }, /* @__PURE__ */ React11.createElement(Typography9, { variant: "body1" }, description || defaultDescription)),
1465
- action && /* @__PURE__ */ React11.createElement(
1466
- Stack5,
1467
- {
1468
- id: "Action",
1469
- direction: "row",
1470
- gap: 1,
1471
- p: 1,
1472
- justifyContent: "end",
1473
- bgcolor: "grey.50",
1474
- sx: { borderRadius: 1 }
1475
- },
1476
- /* @__PURE__ */ React11.createElement(
1477
- Button6,
1478
- {
1479
- color: "inherit",
1480
- variant: "text",
1481
- onClick: handleClose,
1482
- size: "small"
1483
- },
1484
- capitalize("cancelar")
1485
- ),
1486
- /* @__PURE__ */ React11.createElement(
1487
- Button6,
1488
- {
1489
- "data-testid": "test-aceptar",
1490
- color: getButtonColor(state),
1491
- variant: "contained",
1492
- onClick: (_e = action[0]) == null ? void 0 : _e.fn,
1493
- disabled: false,
1494
- size: "small"
1495
- },
1496
- capitalize(action[0].text)
1497
- )
1498
- )
1499
- )));
1500
- };
1501
-
1502
- // src/Components/PageHeader/PageHeader.tsx
1503
- import React12 from "react";
1504
- import { Stack as Stack6, Typography as Typography10 } from "@mui/material";
1505
- var PageHeader = ({
1506
- title,
1507
- subtitle,
1508
- actions,
1509
- buttonBack,
1510
- fixed,
1511
- shadow = true
1512
- }) => {
1513
- return /* @__PURE__ */ React12.createElement(
1514
- Stack6,
1515
- {
1516
- "data-testid": "main-container",
1517
- justifyContent: "center",
1518
- height: 48,
1519
- position: fixed ? "fixed" : "relative",
1520
- width: fixed ? "100%" : "inherit",
1521
- bgcolor: "background.paper",
1522
- zIndex: 10,
1523
- sx: { boxShadow: shadow ? (theme) => theme.shadows[1] : "none" }
1524
- },
1525
- /* @__PURE__ */ React12.createElement(Stack6, { "data-testid": "page-header-content", height: 40, px: 3, pl: buttonBack ? 1 : 3, direction: "row", alignItems: "center", justifyContent: "space-between" }, /* @__PURE__ */ React12.createElement(Stack6, { id: "left-section", direction: "row", alignItems: "center", gap: 1 }, buttonBack, /* @__PURE__ */ React12.createElement(Stack6, { id: "text-section", gap: 0.5 }, /* @__PURE__ */ React12.createElement(Typography10, { "data-testid": "page-header-title", variant: "h6", color: "text.primary" }, title), subtitle && /* @__PURE__ */ React12.createElement(Typography10, { "data-testid": "page-header-subtitle", variant: "caption", color: "text.primary" }, subtitle))), actions && /* @__PURE__ */ React12.createElement(Stack6, { id: "right-actions", direction: "row", alignItems: "center", gap: 1 }, actions))
1526
- );
1527
- };
1528
-
1529
- // src/Components/SCCalendarSwipeable.tsx
1530
- import React13, { useState as useState9 } from "react";
1531
- import { Typography as Typography11, IconButton as IconButton7, Box as Box10 } from "@mui/material";
1532
- import Grid6 from "@mui/material/Grid2";
1533
- import { AdapterDateFns } from "@mui/x-date-pickers/AdapterDateFns";
1534
- import { LocalizationProvider } from "@mui/x-date-pickers/LocalizationProvider";
1535
- import { StaticDatePicker } from "@mui/x-date-pickers/StaticDatePicker";
1536
- import { es } from "date-fns/locale";
1537
- import { format, startOfWeek, addDays, isSameDay } from "date-fns";
1538
- import KeyboardDoubleArrowDownIcon from "@mui/icons-material/KeyboardDoubleArrowDown";
1539
- import KeyboardDoubleArrowUpIcon from "@mui/icons-material/KeyboardDoubleArrowUp";
1540
- var SCCalendarSwipeable = ({
1541
- //informativas
1542
- //apariencia
1543
- background,
1544
- //funcionales
1545
- setState,
1546
- state
1547
- }) => {
1548
- let convertFecha;
1549
- const [fecha, setFecha] = useState9(/* @__PURE__ */ new Date());
1550
- const [fechaSeleccionada, setFechaSeleccionada] = useState9();
1551
- const [stateVal, setstateVal] = React13.useState(/* @__PURE__ */ new Date());
1552
- const [openCalendar, setOpenCalendar] = React13.useState(false);
1553
- const hoy = /* @__PURE__ */ new Date();
1554
- const inicioSemana = startOfWeek(fecha, { weekStartsOn: 0 });
1555
- const diasSemana = Array.from({ length: 7 }, (_, i) => addDays(inicioSemana, i));
1556
- React13.useEffect(() => {
1557
- if (fecha != null) {
1558
- handleConvertFecha(fecha);
1559
- }
1560
- }, [fecha]);
1561
- const handleConvertFecha = (fecha2) => {
1562
- if (fecha2) {
1563
- let day = (fecha2.getDate() < 10 ? "0" : "") + fecha2.getDate();
1564
- let month = (fecha2.getMonth() + 1 < 10 ? "0" : "") + (fecha2.getMonth() + 1);
1565
- let year = fecha2.getFullYear();
1566
- convertFecha = day + "/" + month + "/" + year;
1567
- setState(convertFecha);
1568
- setFecha(fecha2);
1569
- }
1570
- };
1571
- const toggleCalendar = (newOpen) => () => {
1572
- setOpenCalendar(newOpen);
1573
- };
1574
- const locale = __spreadValues({}, es);
1575
- return /* @__PURE__ */ React13.createElement(React13.Fragment, null, /* @__PURE__ */ React13.createElement(LocalizationProvider, { dateAdapter: AdapterDateFns, adapterLocale: locale }, openCalendar == false ? /* @__PURE__ */ React13.createElement(Box10, { "data-testid": "calendar-mobile", sx: { width: "100%", background: background ? background : "white", display: "flex", flexDirection: "column", alignItems: "center" } }, /* @__PURE__ */ React13.createElement(Box10, { sx: { width: "100%", maxWidth: "320px", background: "transparent" } }, /* @__PURE__ */ React13.createElement(Grid6, { container: true, gap: 0.5, sx: {
1576
- justifyContent: "space-between",
1577
- padding: "12px 0px",
1578
- background: "transparent"
1579
- } }, diasSemana.map((dia) => /* @__PURE__ */ React13.createElement(Grid6, { sx: { width: "36px" }, key: dia.toString() }, /* @__PURE__ */ React13.createElement(Box10, { sx: { width: "36px", height: "40px", display: "flex", alignItems: "center", justifyContent: "center" } }, /* @__PURE__ */ React13.createElement(Typography11, { sx: { fontSize: "12px !important", color: "#10184099" } }, format(dia, "EEEE", { locale: es }).charAt(0).toUpperCase())), /* @__PURE__ */ React13.createElement(
1580
- Box10,
1581
- {
1582
- onClick: () => setFecha(dia),
1583
- sx: {
1584
- padding: "10px",
1585
- textAlign: "center",
1586
- backgroundColor: isSameDay(dia, fecha) ? "#2063a0" : "transparent",
1587
- cursor: "pointer",
1588
- borderRadius: "50%",
1589
- //border: '1px solid lightgray',
1590
- position: "relative"
1591
- //width: '36px',
1592
- //height: '36px',
1593
- }
1594
- },
1595
- /* @__PURE__ */ React13.createElement(Typography11, { sx: { fontSize: "12px !important", color: isSameDay(dia, fecha) ? "white" : "#101840DE" } }, format(dia, "d"))
1596
- )))), /* @__PURE__ */ React13.createElement(Grid6, { container: true, justifyContent: "center" }, /* @__PURE__ */ React13.createElement(IconButton7, { "data-testid": "open-calendar-button", onClick: toggleCalendar(true) }, /* @__PURE__ */ React13.createElement(KeyboardDoubleArrowDownIcon, null))))) : /* @__PURE__ */ React13.createElement(Box10, { sx: { width: "100%", background: "white" } }, /* @__PURE__ */ React13.createElement(
1597
- StaticDatePicker,
1598
- {
1599
- orientation: "landscape",
1600
- openTo: "day",
1601
- value: fecha,
1602
- slotProps: { toolbar: { hidden: true }, actionBar: { actions: [] } },
1603
- 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" } },
1604
- onChange: (newValue) => setFecha(newValue)
1605
- }
1606
- ), /* @__PURE__ */ React13.createElement(Grid6, { container: true, justifyContent: "center" }, /* @__PURE__ */ React13.createElement(IconButton7, { "data-testid": "close-calendar-button", onClick: toggleCalendar(false) }, /* @__PURE__ */ React13.createElement(KeyboardDoubleArrowUpIcon, null))))));
1607
- };
1608
-
1609
- // src/Components/SCDataGrid.tsx
1610
- import React14, { useEffect as useEffect11, useState as useState10 } from "react";
1611
- import { DataGridPro, useGridApiRef } from "@mui/x-data-grid-pro";
1612
- import { LicenseInfo } from "@mui/x-license-pro";
1613
- var SCDataGrid = ({ data, columns, rowsTable, checkboxSelection, width, maxHeight, density, groupingColDef, getTreeDataPath }) => {
1614
- const apiRef = useGridApiRef();
1615
- LicenseInfo.setLicenseKey(
1616
- "77d49a57fbc5f4af35ddb05c5f1742e0Tz0xMTI3MjgsRT0xNzc4MzcxMTk5MDAwLFM9cHJvLExNPXN1YnNjcmlwdGlvbixQVj1RMy0yMDI0LEtWPTI="
1617
- );
1618
- let validationTreeData = getTreeDataPath ? true : false;
1619
- let validationCheckboxSelection = checkboxSelection || false;
1620
- let styleDensity = density || "compact";
1621
- let styleTopContainerHeight = styleDensity === "compact" ? "26px" : styleDensity === "standard" ? "38px" : styleDensity === "comfortable" ? "60px" : "27px";
1622
- let styleRowHeight = density == "compact" ? 32 : density == "standard" ? 28 : density == "comfortable" ? 36 : 32;
1623
- let rows = rowsTable ? rowsTable : validationTreeData != false ? parseInt(data.length) : data.length < 10 ? parseInt(data.length) : 10;
1624
- let validationGroupingColDef = groupingColDef || {};
1625
- const [groupDataLenght, setGroupDataLengh] = useState10(0);
1626
- const [pageSize, setPageSize] = useState10(rows);
1627
- const [arrayRows, setArrayRows] = useState10([]);
1628
- useEffect11(() => {
1629
- if ((data == null ? void 0 : data.length) > 0) {
1630
- dataConvertRows(data, void 0);
1631
- }
1632
- }, [data]);
1633
- const dataConvertRows = (data2, columnId) => {
1634
- let dataConvert = [];
1635
- if ((data2 == null ? void 0 : data2.length) > 0) {
1636
- const dataKeys = Object.keys(data2[0]);
1637
- data2.map((item) => {
1638
- const newKeys = {};
1639
- let i = 0;
1640
- let id = dataConvert.length + 1;
1641
- for (i = 0; i < dataKeys.length; i++) {
1642
- newKeys[dataKeys[i]] = item[dataKeys[i]];
1643
- }
1644
- newKeys.id = columnId ? item[columnId] : id;
1645
- dataConvert = [...dataConvert, newKeys];
1646
- });
1647
- }
1648
- setArrayRows(dataConvert);
1649
- };
1650
- const isRowSelectable = (params) => params.row.bloqueoChecked == false ? false : true;
1651
- const [selectionModel, setSelectionModel] = useState10([]);
1652
- const handleSelectionChange = (newSelection) => {
1653
- console.log(data);
1654
- console.log(arrayRows);
1655
- if (groupDataLenght > 0 && validationTreeData == true) {
1656
- let numberGrouped = 0;
1657
- let idsRowSelectBefore = [];
1658
- let idRowSelect = [];
1659
- for (let i = 0; i < newSelection.length; i++) {
1660
- if (typeof newSelection[i] === "string") {
1661
- if (newSelection[i].includes("auto-generated-row-null")) {
1662
- numberGrouped = i;
1663
- }
1664
- } else {
1665
- idsRowSelectBefore.push(newSelection[i]);
1666
- }
1667
- }
1668
- arrayRows.forEach((array) => {
1669
- if (typeof newSelection[numberGrouped] === "string") {
1670
- if (newSelection[numberGrouped].includes(array.name)) {
1671
- idRowSelect.push(array.id);
1672
- }
1673
- }
1674
- });
1675
- if (idRowSelect !== null) {
1676
- const soloEnArr1 = idsRowSelectBefore.filter((elemento) => !idRowSelect.includes(elemento));
1677
- const hasCommonElements = idsRowSelectBefore.some((element) => idRowSelect.includes(element));
1678
- if (hasCommonElements == true) {
1679
- setSelectionModel([...soloEnArr1]);
1680
- } else {
1681
- setSelectionModel([...idsRowSelectBefore, ...idRowSelect]);
1682
- }
1683
- }
1684
- } else {
1685
- setSelectionModel([...newSelection]);
1686
- }
1687
- };
1688
- return /* @__PURE__ */ React14.createElement(React14.Fragment, null, data && /* @__PURE__ */ React14.createElement(React14.Fragment, null, /* @__PURE__ */ React14.createElement("div", { style: { width: width || "100%", maxHeight } }, /* @__PURE__ */ React14.createElement(
1689
- DataGridPro,
1690
- {
1691
- apiRef,
1692
- rowHeight: styleRowHeight,
1693
- rows: arrayRows,
1694
- columns,
1695
- density: styleDensity,
1696
- treeData: validationTreeData,
1697
- getTreeDataPath,
1698
- groupingColDef: validationTreeData == true ? validationGroupingColDef : false,
1699
- pagination: true,
1700
- initialState: {
1701
- pagination: { paginationModel: { pageSize: rows } }
1702
- },
1703
- checkboxSelection: validationCheckboxSelection,
1704
- rowSelectionModel: selectionModel,
1705
- onRowSelectionModelChange: (newSelection) => handleSelectionChange(newSelection),
1706
- isRowSelectable,
1707
- disableRowSelectionOnClick: true,
1708
- hideFooter: validationTreeData == true ? true : false,
1709
- localeText: {
1710
- noRowsLabel: "No hay filas",
1711
- columnMenuLabel: "Men\xFA de columna",
1712
- footerTotalRows: "Filas Totales:",
1713
- footerRowSelected: (count) => `${count.toLocaleString()} fila(s) seleccionada(s)`,
1714
- // Ejemplo de traducción dinámica
1715
- MuiTablePagination: {
1716
- labelRowsPerPage: "Filas por p\xE1gina:",
1717
- labelDisplayedRows: ({ from, to, count }) => `${from}\u2013${to} de ${count !== -1 ? count : `m\xE1s de ${to}`}`
1718
- }
1719
- },
1720
- sx: {
1721
- "& .MuiDataGrid-filler": {
1722
- display: "none !important"
1723
- },
1724
- "& .MuiDataGrid-footerContainer": {
1725
- minHeight: "26px !important",
1726
- height: "26px !important"
1727
- },
1728
- "& .MuiTablePagination-toolbar": {
1729
- minHeight: "25px !important",
1730
- height: "25px !important"
1731
- },
1732
- "& .MuiTablePagination-actions .MuiIconButton-root": {
1733
- padding: "0px !important"
1734
- },
1735
- "&.MuiDataGrid-root": {
1736
- [`--DataGrid-topContainerHeight`]: `${styleTopContainerHeight} !important`
1737
- },
1738
- "MuiDataGrid-root .MuiDataGrid-virtualScrollerContent .MuiDataGrid-row": {
1739
- "--height": "0px !important",
1740
- "minHeight": "0px !important",
1741
- "maxHeight": "0px !important"
1742
- },
1743
- "& .MuiDataGrid-cell": {
1744
- padding: "0 !important"
1745
- }
1746
- }
1747
- }
1748
- ))));
1749
- };
1750
-
1751
- // src/Components/SCAutocomplete.tsx
1752
- import React15, { useEffect as useEffect12 } from "react";
1753
- import { Autocomplete, Checkbox as Checkbox2, InputAdornment as InputAdornment3, MenuItem as MenuItem3, TextField as TextField3, Typography as Typography12, SvgIcon as SvgIcon7, ListItemIcon as ListItemIcon3, ListItemText, Divider as Divider3, FormControlLabel, IconButton as IconButton8, Chip, Box as Box11, Button as Button8 } from "@mui/material";
1754
- import Grid7 from "@mui/material/Grid2";
1755
- import { Search, Clear } from "@mui/icons-material";
1756
- import * as Muicon6 from "@mui/icons-material";
1757
- function SCAutocomplete({
1758
- label = "",
1759
- data,
1760
- columnGroup,
1761
- getItemValue,
1762
- type = "normal",
1763
- checkMassive = false,
1764
- deleteType = "button",
1765
- fnAplicar,
1766
- required,
1767
- disabled,
1768
- background,
1769
- setState,
1770
- state
1771
- }) {
1772
- const labelContent = `<span class="red-asterisk">* </span>` + label;
1773
- let group = "";
1774
- let isSelected = false;
1775
- const [selectedOptions, setSelectedOptions] = React15.useState([]);
1776
- const [prevData, setPrevData] = React15.useState(data);
1777
- useEffect12(() => {
1778
- let dataChangeValidation = JSON.stringify(prevData) === JSON.stringify(data);
1779
- if (dataChangeValidation == false) {
1780
- setState({ hiddenValue: "-1", textValue: "" });
1781
- setSelectedOptions([]);
1782
- setPrevData(data);
1783
- }
1784
- }, [data]);
1785
- useEffect12(() => {
1786
- if (type == "multiselect") {
1787
- if (state.hiddenValue != "-1") {
1788
- setSelectedOptions(data.filter(
1789
- (item) => Array.isArray(state.hiddenValue) ? state.hiddenValue.includes(getItemValue(item).value) : getItemValue(item).value === state.hiddenValue
1790
- ));
1791
- }
1792
- }
1793
- }, [state.hiddenValue]);
1794
- data.map(function(option, index, array) {
1795
- if (option == null ? void 0 : option.icon) {
1796
- if ((option == null ? void 0 : option.icon.type) == void 0) {
1797
- option.icon = Muicon6[option == null ? void 0 : option.icon];
1798
- } else {
1799
- option;
1800
- }
1801
- }
1802
- });
1803
- const cleanOptions = (event2) => {
1804
- setState({ hiddenValue: "-1", textValue: "" });
1805
- setSelectedOptions([]);
1806
- };
1807
- const handleCheckAll = (event2) => {
1808
- if (event2.target.checked) {
1809
- setSelectedOptions(data);
1810
- setState({
1811
- hiddenValue: data.map((item) => getItemValue(item).value),
1812
- textValue: data.map((item) => getItemValue(item).text)
1813
- });
1814
- } else {
1815
- setSelectedOptions([]);
1816
- setState({ hiddenValue: "-1", textValue: "" });
1817
- }
1818
- };
1819
- const allSelected = data.length > 0 && selectedOptions.length === data.length;
1820
- const handleChange = (event2, value) => {
1821
- if (type === "multiselect") {
1822
- const ids = value.map((v) => getItemValue ? getItemValue(v).value : "");
1823
- const texts = value.map((v) => getItemValue ? getItemValue(v).text : "");
1824
- setSelectedOptions(value);
1825
- setState({
1826
- hiddenValue: ids,
1827
- textValue: texts
1828
- });
1829
- } else {
1830
- setState({
1831
- hiddenValue: getItemValue(value).value,
1832
- textValue: getItemValue(value).text
1833
- });
1834
- }
1835
- };
1836
- const selectedValue = type === "multiselect" ? data.filter(
1837
- (item) => state.hiddenValue.includes(getItemValue(item).value)
1838
- ) : data.find(
1839
- (item) => getItemValue(item).value === state.hiddenValue
1840
- ) || null;
1841
- return /* @__PURE__ */ React15.createElement(React15.Fragment, null, data && /* @__PURE__ */ React15.createElement(
1842
- Autocomplete,
1843
- {
1844
- multiple: type === "multiselect",
1845
- clearOnEscape: true,
1846
- disabled,
1847
- options: data,
1848
- onChange: handleChange,
1849
- getOptionLabel: (option) => getItemValue(option).text,
1850
- value: selectedValue,
1851
- sx: {
1852
- background: background || "transparent",
1853
- width: "100%",
1854
- maxWidth: "100%",
1855
- "& .MuiAutocomplete-tag": {
1856
- maxWidth: 120,
1857
- overflow: "hidden",
1858
- textOverflow: "ellipsis",
1859
- whiteSpace: "nowrap"
1860
- },
1861
- "& .MuiAutocomplete-inputRoot": {
1862
- flexWrap: "nowrap !important",
1863
- overflowX: "auto"
1864
- }
1865
- },
1866
- limitTags: 2,
1867
- renderTags: (value, getTagProps) => {
1868
- const limit = 2;
1869
- return /* @__PURE__ */ React15.createElement(React15.Fragment, null, value.slice(0, limit).map((option, index) => /* @__PURE__ */ React15.createElement(
1870
- Chip,
1871
- __spreadProps(__spreadValues({
1872
- color: "default",
1873
- size: "small",
1874
- variant: "filled",
1875
- label: getItemValue(option).text
1876
- }, getTagProps({ index })), {
1877
- style: { maxWidth: 120, overflow: "hidden", textOverflow: "ellipsis", whiteSpace: "nowrap" }
1878
- })
1879
- )), value.length > limit && /* @__PURE__ */ React15.createElement(Box11, { sx: { ml: 0.5, fontSize: 13, color: "#666", display: "flex", alignItems: "center" } }, `+${value.length - limit}`));
1880
- },
1881
- renderOption: (props, option) => {
1882
- const _a = props, { key } = _a, optionProps = __objRest(_a, ["key"]);
1883
- let isValid;
1884
- if (type == "multiselect") {
1885
- isSelected = selectedOptions.some(
1886
- (selected) => getItemValue(selected).value === getItemValue(option).value
1887
- );
1888
- }
1889
- if (columnGroup) {
1890
- isValid = group == option[columnGroup];
1891
- group = option[columnGroup];
1892
- }
1893
- return /* @__PURE__ */ React15.createElement(React15.Fragment, null, /* @__PURE__ */ React15.createElement(React15.Fragment, { key }, columnGroup ? !isValid ? /* @__PURE__ */ React15.createElement(Typography12, { color: "text.secondary", sx: { margin: "7px 16px !important", fontSize: "13px !important" } }, option[columnGroup]) : "" : "", /* @__PURE__ */ React15.createElement(MenuItem3, __spreadProps(__spreadValues({}, optionProps), { style: { background: type != "multiselect" ? state.hiddenValue == getItemValue(option).value ? "#dfe6ec" : "white" : "white", padding: "7px 16px" } }), type != "multiselect" && getItemValue(option).icon != void 0 ? /* @__PURE__ */ React15.createElement(ListItemIcon3, { sx: { minWidth: "10px !important" } }, /* @__PURE__ */ React15.createElement(SvgIcon7, { fontSize: "small", color: "action", component: getItemValue(option).icon })) : "", type == "multiselect" ? /* @__PURE__ */ React15.createElement(Checkbox2, { checked: isSelected, value: getItemValue(option).text, color: "primary" }) : "", /* @__PURE__ */ React15.createElement(ListItemText, { primary: getItemValue(option).text, color: "text.primary" }))));
1894
- },
1895
- renderInput: (params) => /* @__PURE__ */ React15.createElement(React15.Fragment, null, /* @__PURE__ */ React15.createElement(
1896
- TextField3,
1897
- __spreadProps(__spreadValues({}, params), {
1898
- label: required ? /* @__PURE__ */ React15.createElement("span", { dangerouslySetInnerHTML: { __html: labelContent } }) : label,
1899
- placeholder: selectedOptions.length == 0 ? "B\xFAsqueda" : "",
1900
- InputProps: __spreadProps(__spreadValues({}, params.InputProps), {
1901
- endAdornment: /* @__PURE__ */ React15.createElement(React15.Fragment, null, deleteType == "icon" && state.hiddenValue != "-1" ? /* @__PURE__ */ React15.createElement(IconButton8, { size: "small", onClick: cleanOptions, sx: { marginLeft: "auto", textAlign: "right", padding: "0px" } }, /* @__PURE__ */ React15.createElement(Clear, { fontSize: "small" })) : "", /* @__PURE__ */ React15.createElement(InputAdornment3, { style: { zIndex: 1, position: "relative" }, position: "end" }, /* @__PURE__ */ React15.createElement(Search, { fontSize: "small", color: "action", style: { cursor: "pointer" } })))
1902
- })
1903
- })
1904
- )),
1905
- slotProps: {
1906
- listbox: {
1907
- component: React15.forwardRef(function ListboxComponent(props, ref) {
1908
- return /* @__PURE__ */ React15.createElement(React15.Fragment, null, /* @__PURE__ */ React15.createElement(
1909
- Box11,
1910
- __spreadProps(__spreadValues({
1911
- ref
1912
- }, props), {
1913
- sx: __spreadValues({
1914
- position: "relative",
1915
- paddingBottom: "56px",
1916
- backgroundColor: "white"
1917
- }, props.sx)
1918
- }),
1919
- checkMassive && type == "multiselect" ? /* @__PURE__ */ React15.createElement(React15.Fragment, null, /* @__PURE__ */ React15.createElement(FormControlLabel, { control: /* @__PURE__ */ React15.createElement(Checkbox2, { checked: allSelected, indeterminate: selectedOptions.length > 0 && selectedOptions.length < data.length, onChange: handleCheckAll, color: "primary" }), label: "Todos los item", sx: { marginLeft: "0px !important", marginRight: "0px !important", padding: "7px 16px" } }), /* @__PURE__ */ React15.createElement(Divider3, null)) : "",
1920
- props.children,
1921
- deleteType == "button" || fnAplicar ? /* @__PURE__ */ React15.createElement(
1922
- Grid7,
1923
- {
1924
- container: true,
1925
- sx: {
1926
- position: "sticky",
1927
- bottom: -8,
1928
- left: 0,
1929
- width: "100%",
1930
- backgroundColor: "grey.50",
1931
- padding: "8px 16px",
1932
- textAlign: "left",
1933
- justifyContent: "space-between"
1934
- }
1935
- },
1936
- deleteType == "button" ? /* @__PURE__ */ React15.createElement(
1937
- Button8,
1938
- {
1939
- variant: "text",
1940
- color: "primary",
1941
- size: "small",
1942
- onClick: (event2) => {
1943
- event2.stopPropagation();
1944
- cleanOptions(event2);
1945
- }
1946
- },
1947
- "Limpiar"
1948
- ) : "",
1949
- fnAplicar && /* @__PURE__ */ React15.createElement(
1950
- Button8,
1951
- {
1952
- variant: "contained",
1953
- color: "primary",
1954
- size: "small",
1955
- onClick: fnAplicar
1956
- },
1957
- "Aplicar"
1958
- )
1959
- ) : ""
1960
- ));
1961
- })
1962
- }
1963
- }
1964
- }
1965
- ));
1966
- }
1967
-
1968
- // src/Theme/index.ts
1969
- import { createTheme } from "@mui/material/styles";
1970
-
1971
- // src/Theme/components.ts
1972
- import React16 from "react";
1973
- import {
1974
- InfoRounded as InfoRounded2,
1975
- CheckCircleRounded as CheckCircleRounded2,
1976
- WarningRounded as WarningRounded2,
1977
- ErrorRounded as ErrorRounded2
1978
- } from "@mui/icons-material";
1979
- var components = {
1980
- MuiSelect: {
1981
- styleOverrides: {
1982
- outlined: {
1983
- paddingBlock: "13px"
1984
- },
1985
- iconStandard: {
1986
- "&.MuiSelect-iconStandard.MuiSvgIcon-root": {
1987
- top: "calc(50% - .4em)"
1988
- }
1989
- },
1990
- iconFilled: {
1991
- "&.MuiSelect-iconFilled.MuiSvgIcon-root": {
1992
- top: "calc(50% - .15em)"
1993
- }
1994
- },
1995
- iconOutlined: {
1996
- "&.MuiSelect-iconOutlined.MuiSvgIcon-root": {
1997
- top: "calc(50% - .35em)"
1998
- }
1999
- },
2000
- icon: {
2001
- width: 16,
2002
- height: 16
2003
- },
2004
- root: {
2005
- fontSize: 13,
2006
- fontStyle: "normal",
2007
- fontWeight: 400,
2008
- letterSpacing: "0.15px",
2009
- lineHeight: "19px"
2010
- }
2011
- }
2012
- },
2013
- MuiSpeedDialIcon: {
2014
- styleOverrides: {
2015
- icon: {
2016
- height: 24,
2017
- width: 24
2018
- }
2019
- }
2020
- },
2021
- MuiSpeedDialAction: {
2022
- styleOverrides: {
2023
- fab: {
2024
- height: 40,
2025
- width: 40
2026
- }
2027
- }
2028
- },
2029
- MuiBadge: {
2030
- styleOverrides: {
2031
- badge: {
2032
- fontSize: "11px",
2033
- fontWeight: 400,
2034
- lineHeight: "11px",
2035
- letterSpacing: ".14px"
2036
- }
2037
- }
2038
- },
2039
- MuiSpeedDial: {
2040
- styleOverrides: {
2041
- fab: {
2042
- height: 56,
2043
- width: 56
2044
- }
2045
- }
2046
- },
2047
- MuiAccordion: {
2048
- styleOverrides: {
2049
- root: {
2050
- ".MuiButtonBase-root.MuiAccordionSummary-root": {
2051
- minHeight: 44,
2052
- height: 44
2053
- }
2054
- }
2055
- }
2056
- },
2057
- MuiTabs: {
2058
- styleOverrides: {
2059
- root: {
2060
- minHeight: 40
2061
- }
2062
- }
2063
- },
2064
- MuiTab: {
2065
- styleOverrides: {
2066
- labelIcon: {
2067
- paddingBlock: 10
2068
- },
2069
- root: {
2070
- textTransform: "none",
2071
- minHeight: 40
2072
- }
2073
- }
2074
- },
2075
- MuiDataGrid: {
2076
- defaultProps: {
2077
- density: "compact"
2078
- },
2079
- styleOverrides: {
2080
- columnHeader: {
2081
- variants: [
2082
- {
2083
- props: { density: "compact" },
2084
- style: {
2085
- "--height": "24px",
2086
- minHeight: "24px !important",
2087
- maxHeight: "24px !important"
2088
- }
2089
- },
2090
- {
2091
- props: { density: "standard" },
2092
- style: {
2093
- "--height": "36px",
2094
- minHeight: "36px !important",
2095
- maxHeight: "36px !important"
2096
- }
2097
- },
2098
- {
2099
- props: { density: "comfortable" },
2100
- style: {
2101
- "--height": "52px",
2102
- minHeight: "52px !important",
2103
- maxHeight: "52px !important"
2104
- }
2105
- }
2106
- ]
2107
- },
2108
- columnSeparator: {
2109
- variants: [
2110
- {
2111
- props: { density: "compact" },
2112
- style: {
2113
- "--height": "24px",
2114
- minHeight: "24px !important",
2115
- maxHeight: "24px !important"
2116
- }
2117
- },
2118
- {
2119
- props: { density: "standard" },
2120
- style: {
2121
- "--height": "36px",
2122
- minHeight: "36px !important",
2123
- maxHeight: "36px !important"
2124
- }
2125
- },
2126
- {
2127
- props: { density: "comfortable" },
2128
- style: {
2129
- "--height": "52px",
2130
- minHeight: "52px !important",
2131
- maxHeight: "52px !important"
2132
- }
2133
- }
2134
- ]
2135
- },
2136
- iconButtonContainer: {
2137
- fontSize: 16
2138
- },
2139
- columnHeaderDraggableContainer: {
2140
- variants: [
2141
- {
2142
- props: { density: "compact" },
2143
- style: {
2144
- "--height": "24px",
2145
- minHeight: "24px !important",
2146
- maxHeight: "24px !important"
2147
- }
2148
- },
2149
- {
2150
- props: { density: "standard" },
2151
- style: {
2152
- "--height": "36px",
2153
- minHeight: "36px !important",
2154
- maxHeight: "36px !important"
2155
- }
2156
- },
2157
- {
2158
- props: { density: "comfortable" },
2159
- style: {
2160
- "--height": "52px",
2161
- minHeight: "52px !important",
2162
- maxHeight: "52px !important"
2163
- }
2164
- }
2165
- ]
2166
- },
2167
- columnHeaderTitle: {
2168
- fontFamily: "Roboto",
2169
- fontWeight: 500,
2170
- fontSize: 13,
2171
- lineHeight: 1.5,
2172
- letterSpacing: 0.17
2173
- },
2174
- row: {
2175
- variants: [
2176
- {
2177
- props: { density: "compact" },
2178
- style: {
2179
- "--height": "22px",
2180
- minHeight: "22px !important",
2181
- maxHeight: "22px !important"
2182
- }
2183
- },
2184
- {
2185
- props: { density: "standard" },
2186
- style: {
2187
- "--height": "28px",
2188
- minHeight: "28px !important",
2189
- maxHeight: "28px !important"
2190
- }
2191
- },
2192
- {
2193
- props: { density: "comfortable" },
2194
- style: {
2195
- "--height": "48px",
2196
- minHeight: "48px !important",
2197
- maxHeight: "48px !important"
2198
- }
2199
- }
2200
- ]
2201
- },
2202
- cell: {
2203
- fontFamily: "Roboto",
2204
- fontWeight: 300,
2205
- fontSize: 12,
2206
- lineHeight: 1.5,
2207
- letterSpacing: 0.17,
2208
- display: "flex",
2209
- alignItems: "center",
2210
- variants: [
2211
- {
2212
- props: { density: "compact" },
2213
- style: {
2214
- "--height": "22px",
2215
- minHeight: "22px !important",
2216
- maxHeight: "22px !important"
2217
- }
2218
- },
2219
- {
2220
- props: { density: "standard" },
2221
- style: {
2222
- "--height": "28px",
2223
- minHeight: "28px !important",
2224
- maxHeight: "28px !important"
2225
- }
2226
- },
2227
- {
2228
- props: { density: "comfortable" },
2229
- style: {
2230
- "--height": "48px",
2231
- minHeight: "48px !important",
2232
- maxHeight: "48px !important"
2233
- }
2234
- }
2235
- ],
2236
- // COMPONENTES DENTRO DE CELDAS
2237
- ".MuiButtonBase-root": {
2238
- lineHeight: 0,
2239
- textTransform: "capitalize"
2240
- },
2241
- // CELDA ENFOCADA
2242
- ".MuiDataGrid-cell": {
2243
- "&:focus": {
2244
- outline: "transparent",
2245
- borderWidth: 0
2246
- }
2247
- }
2248
- },
2249
- // BOTOM MENU EN LAS CABECERA DE CADA COLUMNA
2250
- menuIconButton: {
2251
- svg: {
2252
- fontSize: "16px"
2253
- }
2254
- },
2255
- menu: {
2256
- svg: {
2257
- fontSize: "16px !important"
2258
- },
2259
- ".MuiMenuItem-root": {
2260
- minHeight: "28px",
2261
- height: "28px"
2262
- }
2263
- },
2264
- pinnedRows: {
2265
- borderTop: "1px solid rgba(228, 236, 244, 1)"
2266
- },
2267
- root: {
2268
- // FONT-SIZE DE CELDA EN MODO EDICION
2269
- ".MuiInputBase-root": {
2270
- fontFamily: "Roboto",
2271
- fontWeight: 300,
2272
- fontSize: 12,
2273
- letterSpacing: 0.17,
2274
- borderRadius: "0px"
2275
- },
2276
- // CELDA FOCUS
2277
- ".Mui-focused, .MuiOutlinedInput-notchedOutline": {
2278
- borderWidth: "0px !important"
2279
- },
2280
- // TAMAÑO PEQUEÑO
2281
- "&.MuiDataGrid-root--densityCompact": {
2282
- ".MuiSvgIcon-root": {
2283
- fontSize: 16
2284
- },
2285
- ".MuiDataGrid-cellCheckbox": {
2286
- ".MuiButtonBase-root": {
2287
- padding: 4
2288
- }
2289
- }
2290
- }
2291
- }
2292
- }
2293
- },
2294
- MuiRating: {
2295
- defaultProps: {
2296
- size: "small"
2297
- },
2298
- styleOverrides: {
2299
- sizeSmall: {
2300
- fontSize: 18
2301
- },
2302
- sizeMedium: {
2303
- fontSize: 24
2304
- },
2305
- sizeLarge: {
2306
- fontSize: 30
2307
- }
2308
- }
2309
- },
2310
- MuiDrawer: {
2311
- styleOverrides: {
2312
- root: {
2313
- boxShadow: "0px 3px 1px -2px rgba(24, 39, 75, 0.20), 0px 2px 2px 0px rgba(24, 39, 75, 0.14), 0px 1px 5px 0px rgba(24, 39, 75, 0.12)"
2314
- }
2315
- }
2316
- },
2317
- MuiTooltip: {
2318
- styleOverrides: {
2319
- tooltip: {
2320
- backgroundColor: "#424242"
2321
- }
2322
- }
2323
- },
2324
- MuiDialog: {
2325
- styleOverrides: {
2326
- root: ({ theme }) => ({
2327
- boxShadow: "0px 11px 15px -7px rgba(24, 39, 75, 0.2), 0px 24px 38px 3px rgba(24, 39, 75, 0.14), 0px 9px 46px 8px rgba(24, 39, 75, 0.12)",
2328
- "& .MuiBackdrop-root": {
2329
- backgroundColor: "#00000047"
2330
- }
2331
- })
2332
- }
2333
- },
2334
- MuiBackdrop: {
2335
- styleOverrides: {
2336
- root: {
2337
- backgroundColor: "#00000047"
2338
- }
2339
- }
2340
- },
2341
- MuiDialogTitle: {
2342
- styleOverrides: {
2343
- root: {
2344
- padding: "8px 16px !important"
2345
- }
2346
- }
2347
- },
2348
- MuiDialogContent: {
2349
- styleOverrides: {
2350
- root: {
2351
- padding: "8px 16px !important"
2352
- }
2353
- }
2354
- },
2355
- MuiDialogActions: {
2356
- styleOverrides: {
2357
- root: {
2358
- padding: "12px 16px !important"
2359
- }
2360
- }
2361
- },
2362
- MuiCheckbox: {
2363
- variants: [
2364
- {
2365
- props: { size: "large" },
2366
- style: {
2367
- padding: 9,
2368
- "& .MuiSvgIcon-fontSizeLarge": {
2369
- height: 24,
2370
- width: 24,
2371
- fontSize: 24
2372
- }
2373
- }
2374
- },
2375
- {
2376
- props: { size: "small" },
2377
- style: {
2378
- padding: 3
2379
- }
2380
- },
2381
- {
2382
- props: { size: "medium" },
2383
- style: {
2384
- padding: 4
2385
- }
2386
- }
2387
- ],
2388
- defaultProps: {
2389
- size: "small"
2390
- }
2391
- },
2392
- MuiToggleButton: {
2393
- styleOverrides: {
2394
- sizeSmall: {
2395
- height: 32
2396
- },
2397
- sizeMedium: {
2398
- height: 38
2399
- },
2400
- sizeLarge: {
2401
- height: 48
2402
- }
2403
- }
2404
- },
2405
- MuiChip: {
2406
- defaultProps: {
2407
- size: "small",
2408
- variant: "standard",
2409
- color: "default"
2410
- },
2411
- styleOverrides: {
2412
- icon: {
2413
- opacity: "70%"
2414
- },
2415
- deleteIconSmall: {
2416
- height: 16,
2417
- width: 16
2418
- },
2419
- deleteIconMedium: {
2420
- height: 20,
2421
- width: 20
2422
- },
2423
- sizeSmall: {
2424
- height: 16
2425
- },
2426
- sizeMedium: {
2427
- height: 20
2428
- },
2429
- avatarSmall: {
2430
- height: 14,
2431
- width: 14
2432
- },
2433
- avatarMedium: {
2434
- height: 18,
2435
- width: 18
2436
- },
2437
- iconColorPrimary: ({ theme }) => ({
2438
- color: theme.palette.primary.main
2439
- }),
2440
- colorDefault: ({ theme }) => ({
2441
- backgroundColor: theme.palette.default.main,
2442
- color: theme.palette.default.contrastText
2443
- }),
2444
- deleteIcon: ({ theme }) => ({
2445
- variants: [
2446
- {
2447
- props: { variant: "filled" },
2448
- style: {
2449
- color: theme.palette.background.paper,
2450
- opacity: "50%"
2451
- }
2452
- },
2453
- {
2454
- props: { variant: "standard" },
2455
- style: {
2456
- color: theme.palette.default.contrastText,
2457
- opacity: "30%",
2458
- ":hover": {
2459
- color: theme.palette.default.contrastText,
2460
- opacity: "30%"
2461
- }
2462
- }
2463
- },
2464
- {
2465
- props: { variant: "outlined" },
2466
- style: {
2467
- color: theme.palette.action.active,
2468
- opacity: "54%",
2469
- ":hover": {
2470
- color: theme.palette.action.active,
2471
- opacity: "54%"
2472
- }
2473
- }
2474
- },
2475
- {
2476
- props: { variant: "filled", color: "default" },
2477
- style: {
2478
- color: theme.palette.default.contrastText,
2479
- opacity: "30%"
2480
- }
2481
- }
2482
- ]
2483
- }),
2484
- avatar: ({ theme }) => ({
2485
- lineHeight: 1.8,
2486
- variants: [
2487
- {
2488
- props: { variant: "filled" },
2489
- style: {
2490
- backgroundColor: theme.palette.background.paper,
2491
- opacity: "70%",
2492
- color: theme.palette.default.contrastText
2493
- }
2494
- },
2495
- {
2496
- props: { variant: "standard" },
2497
- style: {
2498
- backgroundColor: theme.palette.default.contrastText,
2499
- color: theme.palette.primary.contrastText
2500
- }
2501
- },
2502
- {
2503
- props: { variant: "outlined", color: "error" },
2504
- style: {
2505
- backgroundColor: theme.palette.error.main,
2506
- color: theme.palette.background.paper
2507
- }
2508
- },
2509
- {
2510
- props: { variant: "outlined", color: "success" },
2511
- style: {
2512
- backgroundColor: theme.palette.success.main,
2513
- color: theme.palette.background.paper
2514
- }
2515
- },
2516
- {
2517
- props: { variant: "outlined", color: "info" },
2518
- style: {
2519
- backgroundColor: theme.palette.info.main,
2520
- color: theme.palette.background.paper
2521
- }
2522
- },
2523
- {
2524
- props: { variant: "outlined", color: "warning" },
2525
- style: {
2526
- backgroundColor: theme.palette.warning.main,
2527
- color: theme.palette.background.paper
2528
- }
2529
- },
2530
- {
2531
- props: { variant: "outlined", color: "default" },
2532
- style: {
2533
- backgroundColor: theme.palette.grey[400],
2534
- color: theme.palette.background.paper
2535
- }
2536
- },
2537
- {
2538
- props: { variant: "filled", color: "default" },
2539
- style: {
2540
- backgroundColor: theme.palette.default.contrastText,
2541
- color: theme.palette.background.paper
2542
- }
2543
- }
2544
- ]
2545
- }),
2546
- label: ({ theme }) => __spreadValues({}, theme.typography.caption),
2547
- root: ({ theme }) => ({
2548
- height: "inherit",
2549
- borderRadius: 4,
2550
- variants: [
2551
- {
2552
- props: { variant: "outlined", color: "default" },
2553
- style: {
2554
- border: `1px solid ${theme.palette.grey[400]}`,
2555
- backgroundColor: "transparent ",
2556
- color: theme.palette.default.contrastText,
2557
- ":hover": {
2558
- backgroundColor: theme.palette.default.main
2559
- }
2560
- }
2561
- },
2562
- {
2563
- props: { variant: "standard", color: "default" },
2564
- style: {
2565
- backgroundColor: theme.palette.default.main,
2566
- color: theme.palette.default.contrastText,
2567
- ":hover": {
2568
- backgroundColor: theme.palette.default.dark
2569
- }
2570
- }
2571
- },
2572
- {
2573
- props: { variant: "filled", color: "default" },
2574
- style: {
2575
- backgroundColor: theme.palette.grey[50],
2576
- color: theme.palette.default.contrastText,
2577
- ":hover": {
2578
- backgroundColor: theme.palette.grey[100]
2579
- }
2580
- }
2581
- },
2582
- {
2583
- props: { variant: "filled", color: "default" },
2584
- style: {
2585
- backgroundColor: theme.palette.grey[50],
2586
- color: theme.palette.default.contrastText,
2587
- ":hover": {
2588
- backgroundColor: theme.palette.grey[100]
2589
- }
2590
- }
2591
- },
2592
- {
2593
- props: { variant: "standard", avatar: true },
2594
- style: {
2595
- backgroundColor: theme.palette.default.contrastText,
2596
- color: theme.palette.default.contrastText
2597
- }
2598
- },
2599
- {
2600
- props: { variant: "standard" },
2601
- style: {
2602
- backgroundColor: theme.palette.default.contrastText,
2603
- color: theme.palette.default.contrastText
2604
- }
2605
- },
2606
- {
2607
- props: { variant: "standard", color: "primary" },
2608
- style: {
2609
- backgroundColor: theme.palette.chipPrimary.main,
2610
- ":hover": {
2611
- backgroundColor: theme.palette.chipPrimary.dark
2612
- }
2613
- }
2614
- },
2615
- {
2616
- props: { variant: "standard", color: "secondary" },
2617
- style: {
2618
- backgroundColor: theme.palette.chipSecondary.main,
2619
- ":hover": {
2620
- backgroundColor: theme.palette.chipSecondary.dark
2621
- }
2622
- }
2623
- },
2624
- {
2625
- props: { variant: "standard", color: "info" },
2626
- style: {
2627
- backgroundColor: theme.palette.chipInfo.main,
2628
- ":hover": {
2629
- backgroundColor: theme.palette.chipInfo.dark
2630
- }
2631
- }
2632
- },
2633
- {
2634
- props: { variant: "standard", color: "error" },
2635
- style: {
2636
- backgroundColor: theme.palette.chipError.main,
2637
- ":hover": {
2638
- backgroundColor: theme.palette.chipError.dark
2639
- }
2640
- }
2641
- },
2642
- {
2643
- props: { variant: "standard", color: "success" },
2644
- style: {
2645
- backgroundColor: theme.palette.chipSuccess.main,
2646
- ":hover": {
2647
- backgroundColor: theme.palette.chipSuccess.dark
2648
- }
2649
- }
2650
- },
2651
- {
2652
- props: { variant: "standard", color: "warning" },
2653
- style: {
2654
- backgroundColor: theme.palette.chipWarning.main,
2655
- ":hover": {
2656
- backgroundColor: theme.palette.chipWarning.dark
2657
- }
2658
- }
2659
- }
2660
- ]
2661
- })
2662
- }
2663
- },
2664
- MuiAvatar: {
2665
- styleOverrides: {
2666
- root: {
2667
- display: "flex",
2668
- alignContent: "center"
2669
- }
2670
- }
2671
- },
2672
- MuiAlert: {
2673
- defaultProps: {
2674
- iconMapping: {
2675
- success: React16.createElement(CheckCircleRounded2),
2676
- error: React16.createElement(ErrorRounded2),
2677
- warning: React16.createElement(WarningRounded2),
2678
- info: React16.createElement(InfoRounded2)
2679
- }
2680
- },
2681
- variants: [
2682
- {
2683
- props: { variant: "filled" },
2684
- style: {
2685
- color: "#fff"
2686
- }
2687
- },
2688
- {
2689
- props: { variant: "outlined" },
2690
- style: {
2691
- padding: "7px 12px 7px 12px"
2692
- }
2693
- }
2694
- ],
2695
- styleOverrides: {
2696
- message: ({ theme }) => ({
2697
- padding: "0px 4px",
2698
- minWidth: 0,
2699
- variants: [
2700
- {
2701
- props: { variant: "standard" },
2702
- style: {
2703
- color: theme.palette.text.primary
2704
- }
2705
- },
2706
- {
2707
- props: { variant: "outlined" },
2708
- style: {
2709
- color: theme.palette.text.primary
2710
- }
2711
- }
2712
- ]
2713
- }),
2714
- icon: ({ theme }) => ({
2715
- padding: "4px",
2716
- marginRight: 0,
2717
- display: "flex",
2718
- alignItems: "center",
2719
- borderRadius: 100,
2720
- variants: [
2721
- {
2722
- props: { variant: "standard", color: "success" },
2723
- style: {
2724
- backgroundColor: theme.palette.success[100]
2725
- }
2726
- },
2727
- {
2728
- props: { variant: "standard", color: "error" },
2729
- style: {
2730
- backgroundColor: theme.palette.error[100]
2731
- }
2732
- },
2733
- {
2734
- props: { variant: "standard", color: "info" },
2735
- style: {
2736
- backgroundColor: theme.palette.info[100]
2737
- }
2738
- },
2739
- {
2740
- props: { variant: "standard", color: "warning" },
2741
- style: {
2742
- backgroundColor: theme.palette.warning[100]
2743
- }
2744
- }
2745
- ]
2746
- }),
2747
- action: ({ theme }) => ({
2748
- display: "flex",
2749
- gap: 1.5,
2750
- padding: "0px",
2751
- variants: [
2752
- {
2753
- props: { variant: "standard" },
2754
- style: {
2755
- color: theme.palette.action.active
2756
- }
2757
- },
2758
- {
2759
- props: { variant: "outlined" },
2760
- style: {
2761
- color: theme.palette.action.active
2762
- }
2763
- }
2764
- ]
2765
- }),
2766
- root: {
2767
- padding: "8px 12px 8px 12px",
2768
- borderRadius: "8px",
2769
- display: "flex",
2770
- alignItems: "center",
2771
- gap: 1.5,
2772
- minWidth: "296px"
2773
- }
2774
- }
2775
- },
2776
- MuiAlertTitle: {
2777
- defaultProps: {
2778
- variant: "subtitle2"
2779
- },
2780
- styleOverrides: {
2781
- root: {
2782
- marginBottom: 0,
2783
- marginTop: 2.5
2784
- }
2785
- }
2786
- },
2787
- MuiButton: {
2788
- styleOverrides: {
2789
- root: {
2790
- fontFamily: "Roboto",
2791
- textTransform: "unset",
2792
- fontWeightLight: 300,
2793
- fontSize: "13px",
2794
- lineHeight: "normal",
2795
- "@media(max-width: 885px)": {
2796
- fontSize: 14
2797
- }
2798
- },
2799
- startIcon: {
2800
- marginLeft: 2
2801
- },
2802
- endIcon: {
2803
- marginRight: 2
2804
- },
2805
- sizeSmall: {
2806
- height: 26,
2807
- ".MuiSvgIcon-fontSizeSmall": {
2808
- height: 16,
2809
- width: 16
2810
- },
2811
- ".MuiSvgIcon-fontSizeMedium": {
2812
- height: 18,
2813
- width: 18
2814
- },
2815
- ".MuiSvgIcon-fontSizeLarge": {
2816
- height: 20,
2817
- width: 20
2818
- }
2819
- },
2820
- sizeMedium: {
2821
- height: 32,
2822
- ".MuiSvgIcon-fontSizeSmall": {
2823
- height: 16,
2824
- width: 16
2825
- },
2826
- ".MuiSvgIcon-fontSizeMedium": {
2827
- height: 18,
2828
- width: 18
2829
- },
2830
- ".MuiSvgIcon-fontSizeLarge": {
2831
- height: 20,
2832
- width: 20
2833
- }
2834
- },
2835
- sizeLarge: {
2836
- height: 38,
2837
- ".MuiSvgIcon-fontSizeSmall": {
2838
- height: 16,
2839
- width: 16
2840
- },
2841
- "&.MuiSvgIcon-fontSizeMedium": {
2842
- height: 18,
2843
- width: 18
2844
- }
2845
- }
2846
- }
2847
- },
2848
- MuiButtonGroup: {
2849
- defaultProps: {
2850
- size: "small"
2851
- }
2852
- },
2853
- MuiFab: {
2854
- defaultProps: {
2855
- size: "small"
2856
- },
2857
- styleOverrides: {
2858
- circular: {
2859
- boxShadow: "0px 1px 18px 0px rgba(24, 39, 75, 0.12), 0px 6px 10px 0px rgba(24, 39, 75, 0.14), 0px 3px 5px -1px rgba(24, 39, 75, 0.20)",
2860
- sizeSmall: {
2861
- height: 36,
2862
- width: 36,
2863
- svg: {
2864
- height: 20,
2865
- width: 20
2866
- }
2867
- },
2868
- sizeMedium: {
2869
- height: 48,
2870
- width: 48,
2871
- svg: {
2872
- height: 22,
2873
- width: 22
2874
- }
2875
- },
2876
- sizeLarge: {
2877
- height: 56,
2878
- width: 56,
2879
- svg: {
2880
- height: 24,
2881
- width: 24
2882
- }
2883
- }
2884
- },
2885
- extended: {
2886
- gap: 1,
2887
- boxShadow: " 0px 1px 18px 0px rgba(24, 39, 75, 0.12), 0px 6px 10px 0px rgba(24, 39, 75, 0.14), 0px 3px 5px -1px rgba(24, 39, 75, 0.20)",
2888
- sizeSmall: {
2889
- height: 32,
2890
- svg: {
2891
- height: 20,
2892
- width: 20,
2893
- marginRight: 4
2894
- }
2895
- },
2896
- sizeMedium: {
2897
- height: 38,
2898
- svg: {
2899
- height: 22,
2900
- width: 22,
2901
- marginRight: 4
2902
- }
2903
- },
2904
- sizeLarge: {
2905
- height: 48,
2906
- svg: {
2907
- height: 24,
2908
- width: 24,
2909
- marginRight: 4
2910
- }
2911
- }
2912
- },
2913
- root: {
2914
- textTransform: "capitalize"
2915
- }
2916
- }
2917
- },
2918
- MuiFormControl: {
2919
- defaultProps: {
2920
- size: "small",
2921
- margin: "none"
2922
- }
2923
- },
2924
- MuiFormHelperText: {
2925
- defaultProps: {
2926
- margin: "dense"
2927
- }
2928
- },
2929
- MuiSvgIcon: {
2930
- styleOverrides: {
2931
- fontSizeLarge: {
2932
- width: 35,
2933
- height: 35,
2934
- fontSize: 35
2935
- },
2936
- fontSizeMedium: {
2937
- width: 20,
2938
- height: 20,
2939
- fontSize: 20
2940
- },
2941
- fontSizeSmall: {
2942
- width: 16,
2943
- height: 16,
2944
- fontSize: 16
2945
- }
2946
- }
2947
- },
2948
- MuiIconButton: {
2949
- defaultProps: {
2950
- color: "inherit"
2951
- },
2952
- styleOverrides: {
2953
- sizeSmall: {
2954
- padding: 3
2955
- },
2956
- sizeMedium: {
2957
- padding: 8
2958
- },
2959
- sizeLarge: {
2960
- padding: 12
2961
- }
2962
- }
2963
- },
2964
- MuiInputBase: {
2965
- defaultProps: {
2966
- margin: "none"
2967
- },
2968
- styleOverrides: {
2969
- root: {
2970
- "&.MuiInput-underline": {
2971
- marginTop: 9
2972
- },
2973
- ".MuiOutlinedInput-input.MuiInputBase-inputSizeSmall": {
2974
- paddingBlock: 6.51
2975
- },
2976
- ".MuiOutlinedInput-input": {
2977
- paddingBlock: 14
2978
- }
2979
- }
2980
- }
2981
- },
2982
- MuiOutlinedInput: {
2983
- styleOverrides: {
2984
- notchedOutline: {
2985
- borderColor: "rgba(16, 24, 64, 0.23)"
2986
- }
2987
- }
2988
- },
2989
- MuiAutocomplete: {
2990
- defaultProps: {
2991
- size: "small"
2992
- },
2993
- styleOverrides: {
2994
- root: {
2995
- "&.MuiAutocomplete-root .MuiOutlinedInput-root": {
2996
- padding: "6px 14px 6px 10px"
2997
- },
2998
- "& .MuiAutocomplete-endAdornment": {
2999
- top: "calc(50% - 12px)",
3000
- transform: "none"
3001
- },
3002
- "&.MuiAutocomplete-root .MuiOutlinedInput-root.MuiInputBase-sizeSmall": {
3003
- paddingBlock: 3.5,
3004
- paddingRight: 14,
3005
- ".MuiIconButton-sizeSmall .MuiAutocomplete-popupIndicator": {
3006
- padding: 5
3007
- }
3008
- }
3009
- }
3010
- }
3011
- },
3012
- MuiInputLabel: {
3013
- styleOverrides: {
3014
- asterisk: ({ theme }) => ({
3015
- color: theme.palette.error.main
3016
- }),
3017
- root: {
3018
- display: "flex",
3019
- gap: ".2rem",
3020
- flexDirection: "row-reverse",
3021
- fontSize: 13,
3022
- fontStyle: "normal",
3023
- fontWeight: 400,
3024
- letterSpacing: "0.15px"
3025
- },
3026
- filled: {
3027
- "&.MuiInputLabel-filled.MuiInputLabel-sizeSmall:not(.MuiInputLabel-shrink)": {
3028
- transform: "translate(12px,15px) scale(1)"
3029
- },
3030
- "&.MuiInputLabel-filled.MuiInputLabel-sizeMedium:not(.MuiInputLabel-shrink)": {
3031
- transform: "translate(12px,19px) scale(1)"
3032
- }
3033
- },
3034
- standard: {
3035
- "&.MuiInputLabel-standard.MuiInputLabel-sizeSmall:not(.MuiInputLabel-shrink)": {
3036
- transform: "translate(0, 14px) scale(1)"
3037
- },
3038
- "&.MuiInputLabel-standard.MuiInputLabel-sizeMedium:not(.MuiInputLabel-shrink)": {
3039
- transform: "translate(0, 16px) scale(1)"
3040
- }
3041
- },
3042
- outlined: {
3043
- "&.MuiInputLabel-outlined.MuiInputLabel-sizeSmall ": {
3044
- transform: "translate(14px,8px) scale(1)"
3045
- },
3046
- "&.MuiInputLabel-outlined ": {
3047
- transform: "translate(14px, 14px) scale(1)",
3048
- "&.MuiInputLabel-shrink": {
3049
- transform: "translate(14px, -7px) scale(0.75)"
3050
- }
3051
- }
3052
- }
3053
- },
3054
- defaultProps: {
3055
- margin: "dense"
3056
- }
3057
- },
3058
- MuiCard: {
3059
- styleOverrides: {
3060
- root: {
3061
- overflow: "initial",
3062
- boxShadow: "0px 2px 1px -2px rgba(24, 39, 75, 0.20), 0px 1px 1px -1px rgba(24, 39, 75, 0.14), 0px 1px 3px 0px rgba(24, 39, 75, 0.12)"
3063
- }
3064
- }
3065
- },
3066
- MuiCardHeader: {
3067
- styleOverrides: {
3068
- root: {
3069
- padding: "8px 16px "
3070
- }
3071
- }
3072
- },
3073
- MuiCardContent: {
3074
- styleOverrides: {
3075
- root: {
3076
- padding: "8px 16px "
3077
- }
3078
- }
3079
- },
3080
- MuiCardActions: {
3081
- styleOverrides: {
3082
- root: {
3083
- padding: "8px 16px"
3084
- }
3085
- }
3086
- },
3087
- MuiRadio: {
3088
- variants: [
3089
- {
3090
- props: { size: "small" },
3091
- style: {
3092
- padding: 3
3093
- }
3094
- },
3095
- {
3096
- props: { size: "medium" },
3097
- style: {
3098
- padding: 4
3099
- }
3100
- },
3101
- {
3102
- props: { size: "large" },
3103
- style: {
3104
- padding: 9,
3105
- "& .MuiSvgIcon-fontSizeLarge": {
3106
- width: 24,
3107
- height: 24,
3108
- fontSize: 24
3109
- }
3110
- }
3111
- }
3112
- ],
3113
- defaultProps: {
3114
- size: "small"
3115
- }
3116
- },
3117
- MuiSwitch: {
3118
- variants: [
3119
- {
3120
- props: { size: "small" },
3121
- style: {
3122
- height: 22,
3123
- ".MuiSwitch-switchBase": {
3124
- padding: 3
3125
- }
3126
- }
3127
- }
3128
- ],
3129
- defaultProps: {
3130
- size: "small"
3131
- }
3132
- },
3133
- MuiTextField: {
3134
- defaultProps: {
3135
- size: "small",
3136
- margin: "none"
3137
- },
3138
- variants: [
3139
- {
3140
- props: { variant: "standard" },
3141
- style: {
3142
- ".MuiInputBase-input.MuiInputBase-inputSizeSmall": {
3143
- padding: 1.5
3144
- }
3145
- }
3146
- }
3147
- ]
3148
- },
3149
- MuiList: {
3150
- defaultProps: {
3151
- dense: false
3152
- },
3153
- styleOverrides: {
3154
- padding: {
3155
- ".MuiListItem-padding": {
3156
- paddingBlock: 1
3157
- }
3158
- },
3159
- dense: {
3160
- ".MuiListItem-dense": {
3161
- padding: "0.25px 0px 0.25px 16px"
3162
- }
3163
- }
3164
- }
3165
- },
3166
- MuiListItemButton: {
3167
- styleOverrides: {
3168
- dense: {
3169
- padding: "4px 16px 4px 16px "
3170
- },
3171
- root: {
3172
- padding: "8.21px 16px",
3173
- ".MuiListItemText-multiline": {
3174
- marginBlock: "4px"
3175
- }
3176
- }
3177
- }
3178
- },
3179
- MuiMenuItem: {
3180
- styleOverrides: {
3181
- dense: {
3182
- height: 30,
3183
- minHeight: 30,
3184
- ".MuiListItemText-root > .MuiTypography-root": {
3185
- lineHeight: "14.3px",
3186
- letterSpacing: 0.15
3187
- }
3188
- },
3189
- root: {
3190
- padding: "7px 16px 7px 16px",
3191
- ".MuiMenuList-root": {
3192
- height: 34,
3193
- minHeight: 34
3194
- },
3195
- ".MuiListItemText-root > .MuiTypography-root": {
3196
- lineHeight: "20px",
3197
- letterSpacing: 0.17
3198
- },
3199
- ".MuiListItemIcon-root": {
3200
- minWidth: 32
3201
- }
3202
- }
3203
- }
3204
- },
3205
- MuiTableBody: {
3206
- styleOverrides: {
3207
- root: {
3208
- ".MuiTableCell-body.MuiTableCell-sizeMedium": {
3209
- padding: "16px !important"
3210
- }
3211
- }
3212
- }
3213
- },
3214
- MuiTableCell: {
3215
- styleOverrides: {
3216
- sizeMedium: {
3217
- padding: 13
3218
- }
3219
- }
3220
- },
3221
- MuiTable: {
3222
- defaultProps: {
3223
- size: "small"
3224
- },
3225
- styleOverrides: {
3226
- root: {
3227
- minWidth: 630
3228
- }
3229
- }
3230
- }
3231
- };
3232
-
3233
- // src/Theme/palette.ts
3234
- var BasicPalette = {
3235
- default: {
3236
- main: "#E4E5E7",
3237
- dark: "#D1D3D7",
3238
- light: "#F2F2F3",
3239
- contrastText: "#5A5E73"
3240
- },
3241
- chipInfo: {
3242
- main: "#C0E8FC",
3243
- dark: "#9CD8FA",
3244
- light: "#E0F4FE",
3245
- contrastText: "#5A5E73"
3246
- },
3247
- chipWarning: {
3248
- main: "#FCE4C0",
3249
- dark: "#FAD19C",
3250
- light: "#F3F2F0",
3251
- contrastText: "#5A5E73"
3252
- },
3253
- chipError: {
3254
- main: "#FCD4D4",
3255
- dark: "#F4B9B9",
3256
- light: "#FEEAEA",
3257
- contrastText: "#5A5E73"
3258
- },
3259
- chipSuccess: {
3260
- main: "#DDF8C3",
3261
- dark: "#C8F3A2",
3262
- light: "#EFFCE2",
3263
- contrastText: "#5A5E73"
3264
- },
3265
- error: {
3266
- 50: "#F9E8E8",
3267
- 100: "#F1C7C7",
3268
- 200: "#E8A1A1",
3269
- 300: "#DF7B7B",
3270
- light: "#D85F5F",
3271
- main: "#D14343",
3272
- 600: "#CC3D3D",
3273
- 700: "#C63434",
3274
- 800: "#C02C2C",
3275
- dark: "#B51E1E",
3276
- A100: "#FFECEC",
3277
- A200: "#FFB9B9",
3278
- A400: "#FF8686",
3279
- A700: "#FF6D6D",
3280
- contrastText: "#ffffff"
3281
- },
3282
- warning: {
3283
- 50: "#FFF0E0",
3284
- 100: "#FEDAB3",
3285
- 200: "#FDC280",
3286
- 300: "#FCAA4D",
3287
- light: "#FC9726",
3288
- main: "#FB8500",
3289
- 600: "#FA7D00",
3290
- 700: "#FA7200",
3291
- 800: "#F96800",
3292
- dark: "#F85500",
3293
- A100: "#FFFFFF",
3294
- A200: "#FFF1EB",
3295
- A400: "#FFCCB8",
3296
- A700: "#FFBA9F",
3297
- contrastText: "#ffffff"
3298
- },
3299
- info: {
3300
- 50: "#E6F3F8",
3301
- 100: "#C0E2EE",
3302
- 200: "#96CFE2",
3303
- 300: "#6CBCD6",
3304
- light: "#4DADCE",
3305
- main: "#2D9FC5",
3306
- 600: "#2897BF",
3307
- 700: "#228DB8",
3308
- 800: "#1C83B0",
3309
- dark: "#1172A3",
3310
- A100: "#D4EFFF",
3311
- A200: "#A1DCFF",
3312
- A400: "#6ECAFF",
3313
- A700: "#54C1FF",
3314
- contrastText: "#ffffff"
3315
- },
3316
- success: {
3317
- 50: "#F2F9E7",
3318
- 100: "#DDEFC4",
3319
- 200: "#C7E49D",
3320
- 300: "#B1D975",
3321
- light: "#A0D158",
3322
- main: "#8FC93A",
3323
- 600: "#87C334",
3324
- 700: "#7CBC2C",
3325
- 800: "#72B525",
3326
- dark: "#60A918",
3327
- A100: "#EDFFDE",
3328
- A200: "#D2FFAB",
3329
- A400: "#B6FF78",
3330
- A700: "#A9FF5E",
3331
- contrastText: "#ffffff"
3332
- },
3333
- grey: {
3334
- 50: "#FBFBFB",
3335
- 100: "#F5F5F6",
3336
- 200: "#EAEBEC",
3337
- 300: "#DCDEE0",
3338
- 400: "#CED1D4",
3339
- 500: "#C4C7CA",
3340
- 600: "#B9BDC1",
3341
- 700: "#B2B7BB",
3342
- 800: "#AAAEB3",
3343
- 900: "#A2A6AB",
3344
- A100: "#FFFFFF",
3345
- A200: "#FFFFFF",
3346
- A400: "#D4EAFF",
3347
- A700: "#BBDDFF"
3348
- },
3349
- text: {
3350
- primary: "#101840de",
3351
- secondary: "#10184099",
3352
- disabled: "#10184061"
3353
- },
3354
- action: {
3355
- active: "#1018408a",
3356
- hover: "#1018400a",
3357
- selected: "#10184014",
3358
- disabled: "#10184042",
3359
- disabledBackground: "#1018401f",
3360
- focus: "#1018401f"
3361
- },
3362
- background: {
3363
- default: "#f5f5f5",
3364
- paper: "#fff"
3365
- },
3366
- common: {
3367
- black: "#000",
3368
- white: "#fff"
3369
- },
3370
- divider: "#0000001f"
3371
- };
3372
- var paletteERP = __spreadValues({
3373
- primary: {
3374
- 50: "#E4ECF4",
3375
- 100: "#BCD0E3",
3376
- 200: "#8FB1D0",
3377
- 300: "#6392BD",
3378
- light: "#417AAE",
3379
- main: "#2063A0",
3380
- 600: "#1C5B98",
3381
- 700: "#18518E",
3382
- 800: "#134784",
3383
- dark: "#0B3573",
3384
- A100: "#A5C5FF",
3385
- A200: "#72A4FF",
3386
- A400: "#3F83FF",
3387
- A700: "#2572FF",
3388
- contrastText: "#ffffff"
3389
- },
3390
- secondary: {
3391
- 50: "#E0F7FA",
3392
- 100: "#B3EBF2",
3393
- 200: "#80DEEA",
3394
- 300: "#4DD0E1",
3395
- light: "#26C6DA",
3396
- main: "#00BCD4",
3397
- 600: "#00B6CF",
3398
- 700: "#00ADC9",
3399
- 800: "#00A5C3",
3400
- dark: "#0097B9",
3401
- A100: "#E2F9FF",
3402
- A200: "#AFEEFF",
3403
- A400: "#7CE3FF",
3404
- A700: "#63DDFF",
3405
- contrastText: "#ffffff"
3406
- },
3407
- chipPrimary: {
3408
- main: "#C4E1F5",
3409
- dark: "#A2CDEE",
3410
- light: "#E2F0FA",
3411
- contrastText: "#5A5E73"
3412
- },
3413
- chipSecondary: {
3414
- main: "#C4F6FD",
3415
- dark: "#A8F1FB",
3416
- light: "#E0FBFE",
3417
- contrastText: "#545E73"
3418
- }
3419
- }, BasicPalette);
3420
- var paletteADPRO = __spreadValues({
3421
- primary: {
3422
- 50: "#F8FAFB",
3423
- 100: "#E6EFF0",
3424
- 200: "#D2E3E4",
3425
- 300: "#82C6CB",
3426
- light: "#2B9DA7",
3427
- main: "#058C97",
3428
- 600: "#04848F",
3429
- 700: "#047984",
3430
- 800: "#036F7A",
3431
- dark: "#015C69",
3432
- A100: "#98F0FF",
3433
- A200: "#65E9FF",
3434
- A400: "#32E1FF",
3435
- A700: "#32E1FF"
3436
- },
3437
- secondary: {
3438
- 50: "#E0F7FA",
3439
- 100: "#B3EBF2",
3440
- 200: "#80DEEA",
3441
- 300: "#4DD0E1",
3442
- light: "#26C6DA",
3443
- main: "#00BCD4",
3444
- 600: "#00B6CF",
3445
- 700: "#00ADC9",
3446
- 800: "#00A5C3",
3447
- dark: "#0097B9",
3448
- A100: "#E2F9FF",
3449
- A200: "#AFEEFF",
3450
- A400: "#7CE3FF",
3451
- A700: "#63DDFF",
3452
- contrastText: "#ffffff"
3453
- },
3454
- chipPrimary: {
3455
- main: "#CEE7E9",
3456
- dark: "#B2D9DC",
3457
- light: "#E3F1F2",
3458
- contrastText: "#5A5E73"
3459
- },
3460
- chipSecondary: {
3461
- main: "#C4F6FD",
3462
- dark: "#A8F1FB",
3463
- light: "#E0FBFE",
3464
- contrastText: "#545E73"
3465
- }
3466
- }, BasicPalette);
3467
- var paletteADC = __spreadValues({
3468
- primary: {
3469
- 50: "#F8FAFB",
3470
- 100: "#E6EFF0",
3471
- 200: "#D2E3E4",
3472
- 300: "#82C6CB",
3473
- light: "#2B9DA7",
3474
- main: "#058C97",
3475
- 600: "#04848F",
3476
- 700: "#047984",
3477
- 800: "#036F7A",
3478
- dark: "#015C69",
3479
- A100: "#98F0FF",
3480
- A200: "#65E9FF",
3481
- A400: "#32E1FF",
3482
- A700: "#32E1FF"
3483
- },
3484
- secondary: {
3485
- 50: "#E0F7FA",
3486
- 100: "#B3EBF2",
3487
- 200: "#80DEEA",
3488
- 300: "#4DD0E1",
3489
- light: "#26C6DA",
3490
- main: "#00BCD4",
3491
- 600: "#00B6CF",
3492
- 700: "#00ADC9",
3493
- 800: "#00A5C3",
3494
- dark: "#0097B9",
3495
- A100: "#E2F9FF",
3496
- A200: "#AFEEFF",
3497
- A400: "#7CE3FF",
3498
- A700: "#63DDFF",
3499
- contrastText: "#ffffff"
3500
- },
3501
- chipPrimary: {
3502
- main: "#D4D8F7",
3503
- dark: "#B2B9F0",
3504
- light: "#E5E8FA",
3505
- contrastText: "#5A5E73"
3506
- },
3507
- chipSecondary: {
3508
- main: "#E0E0E0",
3509
- dark: "#D1D1D1",
3510
- light: "#EBEBEB",
3511
- contrastText: "#545E73"
3512
- }
3513
- }, BasicPalette);
3514
-
3515
- // node_modules/@mui/system/esm/createBreakpoints/createBreakpoints.js
3516
- var sortBreakpointsValues = (values) => {
3517
- const breakpointsAsArray = Object.keys(values).map((key) => ({
3518
- key,
3519
- val: values[key]
3520
- })) || [];
3521
- breakpointsAsArray.sort((breakpoint1, breakpoint2) => breakpoint1.val - breakpoint2.val);
3522
- return breakpointsAsArray.reduce((acc, obj) => {
3523
- return __spreadProps(__spreadValues({}, acc), {
3524
- [obj.key]: obj.val
3525
- });
3526
- }, {});
3527
- };
3528
- function createBreakpoints(breakpoints2) {
3529
- const _a = breakpoints2, {
3530
- values: values = {
3531
- xs: 0,
3532
- // phone
3533
- sm: 600,
3534
- // tablet
3535
- md: 900,
3536
- // small laptop
3537
- lg: 1200,
3538
- // desktop
3539
- xl: 1536
3540
- // large screen
3541
- },
3542
- unit = "px",
3543
- step = 5
3544
- } = _a, other = __objRest(_a, [
3545
- // The breakpoint **start** at this value.
3546
- // For instance with the first breakpoint xs: [xs, sm).
3547
- "values",
3548
- "unit",
3549
- "step"
3550
- ]);
3551
- const sortedValues = sortBreakpointsValues(values);
3552
- const keys = Object.keys(sortedValues);
3553
- function up(key) {
3554
- const value = typeof values[key] === "number" ? values[key] : key;
3555
- return `@media (min-width:${value}${unit})`;
3556
- }
3557
- function down(key) {
3558
- const value = typeof values[key] === "number" ? values[key] : key;
3559
- return `@media (max-width:${value - step / 100}${unit})`;
3560
- }
3561
- function between(start, end) {
3562
- const endIndex = keys.indexOf(end);
3563
- return `@media (min-width:${typeof values[start] === "number" ? values[start] : start}${unit}) and (max-width:${(endIndex !== -1 && typeof values[keys[endIndex]] === "number" ? values[keys[endIndex]] : end) - step / 100}${unit})`;
3564
- }
3565
- function only(key) {
3566
- if (keys.indexOf(key) + 1 < keys.length) {
3567
- return between(key, keys[keys.indexOf(key) + 1]);
3568
- }
3569
- return up(key);
3570
- }
3571
- function not(key) {
3572
- const keyIndex = keys.indexOf(key);
3573
- if (keyIndex === 0) {
3574
- return up(keys[1]);
3575
- }
3576
- if (keyIndex === keys.length - 1) {
3577
- return down(keys[keyIndex]);
3578
- }
3579
- return between(key, keys[keys.indexOf(key) + 1]).replace("@media", "@media not all and");
3580
- }
3581
- return __spreadValues({
3582
- keys,
3583
- values: sortedValues,
3584
- up,
3585
- down,
3586
- between,
3587
- only,
3588
- not,
3589
- unit
3590
- }, other);
3591
- }
3592
-
3593
- // src/Theme/breakpoints.ts
3594
- var breakpoints = createBreakpoints({
3595
- values: {
3596
- xs: 0,
3597
- sm: 600,
3598
- md: 960,
3599
- lg: 1280,
3600
- xl: 1920
3601
- }
3602
- });
3603
-
3604
- // src/Theme/mixins.ts
3605
- var mixins = {
3606
- toolbar: {
3607
- minHeight: 48,
3608
- [breakpoints.down("md")]: {
3609
- minHeight: 52
3610
- }
3611
- }
3612
- };
3613
-
3614
- // src/Theme/module.ts
3615
- import "@mui/material/Typography";
3616
- import "@mui/material/Radio";
3617
- import "@mui/material/Chip";
3618
- import "@mui/material/Checkbox";
3619
- import "@mui/material/styles";
3620
-
3621
- // src/Theme/typography.ts
3622
- var typography = {
3623
- fontSize: 13,
3624
- body1: {
3625
- fontFamily: "Roboto",
3626
- fontSize: 14,
3627
- fontWeight: 400,
3628
- lineHeight: "16px",
3629
- letterSpacing: "0.15px",
3630
- "@media(max-width: 885px)": {
3631
- fontSize: 15
3632
- }
3633
- },
3634
- body2: {
3635
- fontFamily: "Roboto",
3636
- fontSize: 13,
3637
- fontWeight: 400,
3638
- lineHeight: "16px",
3639
- letterSpacing: "0.17px",
3640
- "@media(max-width: 885px)": {
3641
- fontSize: 14
3642
- }
3643
- },
3644
- body3: {
3645
- fontFamily: "Roboto",
3646
- fontWeight: 300,
3647
- fontSize: 12,
3648
- lineHeight: "16px",
3649
- letterSpacing: "0.17px",
3650
- [breakpoints.down("md")]: {
3651
- fontSize: 11
3652
- }
3653
- },
3654
- subtitle1: {
3655
- fontFamily: "Roboto",
3656
- fontSize: 14,
3657
- fontWeight: 500,
3658
- lineHeight: "16px",
3659
- letterSpacing: "0.15px",
3660
- "@media(max-width: 885px)": {
3661
- fontSize: 15
3662
- }
3663
- },
3664
- subtitle2: {
3665
- fontFamily: "Roboto",
3666
- fontSize: 13,
3667
- fontWeight: 500,
3668
- lineHeight: "16px",
3669
- letterSpacing: "0.1px",
3670
- "@media(max-width: 885px)": {
3671
- fontSize: 14
3672
- }
3673
- },
3674
- caption: {
3675
- fontFamily: "Roboto",
3676
- fontSize: 11,
3677
- fontWeight: 400,
3678
- lineHeight: "14px",
3679
- letterSpacing: "0.4px",
3680
- "@media(max-width: 885px)": {
3681
- fontSize: 12
3682
- }
3683
- },
3684
- overline: {
3685
- fontFamily: "Roboto",
3686
- fontSize: 11,
3687
- fontWeight: 400,
3688
- lineHeight: "24px",
3689
- letterSpacing: "1px",
3690
- "@media(max-width: 885px)": {
3691
- fontSize: 12
3692
- }
3693
- },
3694
- h6: {
3695
- fontFamily: "Nunito",
3696
- fontSize: 16,
3697
- fontWeight: 600,
3698
- lineHeight: "16px",
3699
- letterSpacing: "0.15px",
3700
- "@media(max-width: 885px)": {
3701
- fontSize: 17
3702
- }
3703
- },
3704
- h5: {
3705
- fontFamily: "Nunito",
3706
- fontSize: 18,
3707
- fontWeight: 600,
3708
- letterSpacing: 0,
3709
- lineHeight: "24px"
3710
- },
3711
- h4: {
3712
- fontFamily: "Nunito",
3713
- fontSize: 22,
3714
- fontWeight: 600,
3715
- lineHeight: "24px",
3716
- letterSpacing: "0.25px"
3717
- },
3718
- h3: {
3719
- fontFamily: "Nunito",
3720
- fontSize: 28,
3721
- fontWeight: 500,
3722
- lineHeight: "32px",
3723
- letterSpacing: 0
3724
- },
3725
- h2: {
3726
- fontFamily: "Nunito",
3727
- fontSize: 32,
3728
- fontWeight: 400,
3729
- lineHeight: "40px",
3730
- letterSpacing: -0.5
3731
- },
3732
- h1: {
3733
- fontFamily: "Nunito",
3734
- fontSize: 40,
3735
- fontWeight: 300,
3736
- letterSpacing: -1.5,
3737
- lineHeight: "48px"
3738
- }
3739
- };
3740
-
3741
- // src/Theme/shadows.ts
3742
- var shadows = [
3743
- "none",
3744
- "0px 1px 3px rgba(24, 39, 75, 0.12), 0px 1px 1px -1px rgba(24, 39, 75, 0.14), 0px 2px 1px -2px rgba(24, 39, 75, 0.2)",
3745
- "0px 1px 5px rgba(24, 39, 75, 0.12), 0px 2px 2px rgba(24, 39, 75, 0.14), 0px 3px 1px -2px rgba(24, 39, 75, 0.2)",
3746
- "0px 1px 8px rgba(24, 39, 75, 0.12), 0px 3px 4px rgba(24, 39, 75, 0.14), 0px 3px 3px -2px rgba(24, 39, 75, 0.2)",
3747
- "0px 2px 4px -1px rgba(24, 39, 75, 0.2), 0px 4px 5px rgba(24, 39, 75, 0.14), 0px 1px 10px rgba(24, 39, 75, 0.12)",
3748
- "0px 3px 5px -1px rgba(24, 39, 75, 0.2), 0px 5px 8px rgba(24, 39, 75, 0.14), 0px 1px 14px rgba(24, 39, 75, 0.12)",
3749
- "0px 3px 5px -1px rgba(24, 39, 75, 0.2), 0px 6px 10px rgba(24, 39, 75, 0.14), 0px 1px 18px rgba(24, 39, 75, 0.12)",
3750
- "0px 4px 5px -2px rgba(24, 39, 75, 0.2), 0px 7px 10px 1px rgba(24, 39, 75, 0.14), 0px 2px 16px 1px rgba(24, 39, 75, 0.12)",
3751
- "0px 5px 5px -3px rgba(24, 39, 75, 0.2), 0px 8px 10px 1px rgba(24, 39, 75, 0.14), 0px 3px 14px 2px rgba(24, 39, 75, 0.12)",
3752
- "0px 5px 6px -3px rgba(24, 39, 75, 0.2), 0px 9px 12px 1px rgba(24, 39, 75, 0.14), 0px 3px 16px 2px rgba(24, 39, 75, 0.12)",
3753
- "0px 6px 6px -3px rgba(24, 39, 75, 0.2), 0px 10px 14px 1px rgba(24, 39, 75, 0.14), 0px 4px 18px 3px rgba(24, 39, 75, 0.12)",
3754
- "0px 6px 7px -4px rgba(24, 39, 75, 0.2), 0px 11px 15px 1px rgba(24, 39, 75, 0.14), 0px 4px 20px 3px rgba(24, 39, 75, 0.12)",
3755
- "0px 7px 8px -4px rgba(24, 39, 75, 0.2), 0px 12px 17px 2px rgba(24, 39, 75, 0.14), 0px 5px 22px 4px rgba(24, 39, 75, 0.12)",
3756
- "0px 7px 8px -4px rgba(24, 39, 75, 0.2), 0px 13px 19px 2px rgba(24, 39, 75, 0.14), 0px 5px 24px 4px rgba(24, 39, 75, 0.12)",
3757
- "0px 7px 9px -4px rgba(24, 39, 75, 0.2), 0px 14px 21px 2px rgba(24, 39, 75, 0.14), 0px 5px 26px 4px rgba(24, 39, 75, 0.12)",
3758
- "0px 8px 9px -5px rgba(24, 39, 75, 0.2), 0px 15px 22px 2px rgba(24, 39, 75, 0.14), 0px 6px 28px 5px rgba(24, 39, 75, 0.12)",
3759
- "0px 8px 10px -5px rgba(24, 39, 75, 0.2), 0px 16px 24px 2px rgba(24, 39, 75, 0.14), 0px 6px 30px 5px rgba(24, 39, 75, 0.12)",
3760
- "0px 8px 11px -5px rgba(24, 39, 75, 0.2), 0px 17px 26px 2px rgba(24, 39, 75, 0.14), 0px 6px 32px 5px rgba(24, 39, 75, 0.12)",
3761
- "0px 9px 11px -5px rgba(24, 39, 75, 0.2), 0px 18px 28px 2px rgba(24, 39, 75, 0.14), 0px 7px 34px 6px rgba(24, 39, 75, 0.12)",
3762
- "0px 9px 12px -6px rgba(24, 39, 75, 0.2), 0px 19px 29px 2px rgba(24, 39, 75, 0.14), 0px 7px 36px 6px rgba(24, 39, 75, 0.12)",
3763
- "0px 10px 13px -6px rgba(24, 39, 75, 0.2), 0px 20px 31px 3px rgba(24, 39, 75, 0.14), 0px 8px 38px 7px rgba(24, 39, 75, 0.12)",
3764
- "0px 10px 13px -6px rgba(24, 39, 75, 0.2), 0px 21px 33px 3px rgba(24, 39, 75, 0.14), 0px 8px 40px 7px rgba(24, 39, 75, 0.12)",
3765
- "0px 10px 14px -6px rgba(24, 39, 75, 0.2), 0px 22px 35px 3px rgba(24, 39, 75, 0.14), 0px 8px 42px 7px rgba(24, 39, 75, 0.12)",
3766
- "0px 11px 14px -7px rgba(24, 39, 75, 0.2), 0px 23px 36px 3px rgba(24, 39, 75, 0.14), 0px 9px 44px 8px rgba(24, 39, 75, 0.12)",
3767
- "0px 11px 15px -7px rgba(24, 39, 75, 0.2), 0px 24px 38px 3px rgba(24, 39, 75, 0.14), 0px 9px 46px 8px rgba(24, 39, 75, 0.12)"
3768
- ];
3769
-
3770
- // src/Theme/theme.ts
3771
- var BasicTheme = {
3772
- components,
3773
- typography,
3774
- spacing: 8,
3775
- mixins,
3776
- breakpoints,
3777
- shadows
3778
- };
3779
- var ERPTheme = __spreadValues({
3780
- palette: paletteERP
3781
- }, BasicTheme);
3782
- var ADPROTheme = __spreadValues({
3783
- palette: paletteADPRO
3784
- }, BasicTheme);
3785
- var ADCTheme = __spreadValues({
3786
- palette: paletteADC
3787
- }, BasicTheme);
3788
-
3789
- // src/Theme/index.ts
3790
- var SincoTheme = createTheme(__spreadValues({}, ERPTheme));
3791
- var AdproSincoTheme = createTheme(__spreadValues({}, ADPROTheme));
3792
- var ADCSincoTheme = createTheme(__spreadValues({}, ADCTheme));
3793
- export {
3794
- ADCSincoTheme,
3795
- AdproSincoTheme,
3796
- FooterAction,
3797
- PageHeader,
3798
- SCAutocomplete,
3799
- SCCalendarSwipeable,
3800
- SCDataGrid,
3801
- SCDialog,
3802
- SCDrawer,
3803
- SCMenu,
3804
- SCModal,
3805
- SCMultiSelect,
3806
- SCTabs,
3807
- SCTextArea,
3808
- SCTextField,
3809
- SCToastNotification,
3810
- SincoTheme,
3811
- ToastProgress,
3812
- capitalize,
3813
- getButtonColor,
3814
- getIcon,
3815
- getIconComponent2 as getIconComponent,
3816
- getIconMultiSelect,
3817
- getModalColor,
3818
- modalStateConfig,
3819
- useFilteredItems,
3820
- useMultiSelectHandlers,
3821
- useProgress
3822
- };
3823
- /*! Bundled license information:
3824
-
3825
- @mui/system/esm/index.js:
3826
- (**
3827
- * @mui/system v7.1.1
3828
- *
3829
- * @license MIT
3830
- * This source code is licensed under the MIT license found in the
3831
- * LICENSE file in the root directory of this source tree.
3832
- *)
3833
- */