componentes-sinco 1.0.27 → 1.0.29
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.cjs +1332 -950
- package/dist/index.cjs.map +1 -1
- package/dist/index.d.cts +89 -32
- package/dist/index.d.ts +89 -32
- package/dist/index.js +1287 -912
- package/dist/index.js.map +1 -1
- package/package.json +11 -7
package/dist/index.js
CHANGED
|
@@ -444,17 +444,17 @@ var Attachment = ({
|
|
|
444
444
|
const nuevosArchivos = [];
|
|
445
445
|
const archivosValidos = [];
|
|
446
446
|
Array.from(newFiles).forEach((file) => {
|
|
447
|
-
const
|
|
448
|
-
(
|
|
447
|
+
const isDuplicateFile = files.some(
|
|
448
|
+
(existingFile) => existingFile.name === file.name && existingFile.size === file.size
|
|
449
449
|
);
|
|
450
450
|
const sizeMB = file.size / (1024 * 1024);
|
|
451
|
-
if (
|
|
451
|
+
if (isDuplicateFile) {
|
|
452
452
|
setToast({
|
|
453
453
|
type: "error",
|
|
454
454
|
title: "Archivo duplicado",
|
|
455
|
-
listITems: [
|
|
455
|
+
listITems: [`El archivo "${file.name}" ya existe.`],
|
|
456
456
|
seeMore: true,
|
|
457
|
-
time:
|
|
457
|
+
time: 5
|
|
458
458
|
});
|
|
459
459
|
return;
|
|
460
460
|
}
|
|
@@ -470,8 +470,8 @@ var Attachment = ({
|
|
|
470
470
|
type: "error",
|
|
471
471
|
title: "Carga fallida",
|
|
472
472
|
seeMore: true,
|
|
473
|
-
listITems: [`El archivo supera el l\xEDmite de ${maxSize}MB.`],
|
|
474
|
-
time:
|
|
473
|
+
listITems: [`El archivo "${file.name}" supera el l\xEDmite de ${maxSize}MB.`],
|
|
474
|
+
time: 5
|
|
475
475
|
});
|
|
476
476
|
return;
|
|
477
477
|
}
|
|
@@ -484,9 +484,9 @@ var Attachment = ({
|
|
|
484
484
|
setToast({
|
|
485
485
|
type: "error",
|
|
486
486
|
title: "Tipo de archivo no permitido",
|
|
487
|
-
listITems: [`El archivo ${file.name} no es un tipo permitido.`],
|
|
487
|
+
listITems: [`El archivo "${file.name}" no es un tipo permitido.`],
|
|
488
488
|
seeMore: true,
|
|
489
|
-
time:
|
|
489
|
+
time: 5
|
|
490
490
|
});
|
|
491
491
|
return;
|
|
492
492
|
}
|
|
@@ -500,24 +500,26 @@ var Attachment = ({
|
|
|
500
500
|
archivosValidos.push(file);
|
|
501
501
|
});
|
|
502
502
|
if (nuevosArchivos.length > 0) {
|
|
503
|
-
setFiles((
|
|
504
|
-
const
|
|
505
|
-
|
|
506
|
-
|
|
507
|
-
|
|
508
|
-
|
|
509
|
-
|
|
503
|
+
setFiles((prevFiles) => {
|
|
504
|
+
const updatedFiles = [...prevFiles, ...nuevosArchivos];
|
|
505
|
+
if (archivosValidos.length > 0) {
|
|
506
|
+
onChange == null ? void 0 : onChange([
|
|
507
|
+
...archivosValidos,
|
|
508
|
+
...prevFiles.map((f) => new File([], f.name, { type: f.type }))
|
|
509
|
+
]);
|
|
510
|
+
}
|
|
511
|
+
return updatedFiles;
|
|
510
512
|
});
|
|
511
513
|
}
|
|
512
514
|
event2.target.value = "";
|
|
513
515
|
};
|
|
514
|
-
const deleteFiles = (
|
|
515
|
-
setFiles((
|
|
516
|
-
const
|
|
516
|
+
const deleteFiles = (fileName) => {
|
|
517
|
+
setFiles((prevFiles) => {
|
|
518
|
+
const filteredFiles = prevFiles.filter((file) => file.name !== fileName);
|
|
517
519
|
onChange == null ? void 0 : onChange(
|
|
518
|
-
|
|
520
|
+
filteredFiles.map((f) => new File([], f.name, { type: f.type }))
|
|
519
521
|
);
|
|
520
|
-
return
|
|
522
|
+
return filteredFiles;
|
|
521
523
|
});
|
|
522
524
|
};
|
|
523
525
|
return /* @__PURE__ */ React4.createElement(Stack3, { spacing: 2 }, toast && /* @__PURE__ */ React4.createElement(SCToastNotification, __spreadValues({}, toast)), /* @__PURE__ */ React4.createElement(
|
|
@@ -532,6 +534,7 @@ var Attachment = ({
|
|
|
532
534
|
), /* @__PURE__ */ React4.createElement(
|
|
533
535
|
Stack3,
|
|
534
536
|
{
|
|
537
|
+
"data-testid": "ZonaAdjuntos",
|
|
535
538
|
id: "ZonaAdjuntos",
|
|
536
539
|
justifyContent: "center",
|
|
537
540
|
alignItems: "center",
|
|
@@ -549,8 +552,9 @@ var Attachment = ({
|
|
|
549
552
|
onDragOver: handleDragOver,
|
|
550
553
|
onDragLeave: handleDragLeave,
|
|
551
554
|
sx: __spreadValues({
|
|
552
|
-
border: error ? (theme) => `1px solid ${theme.palette.error.main}` : (theme) => `1px dashed ${theme.palette.grey[500]}`,
|
|
555
|
+
border: error ? (theme) => `1px solid ${theme.palette.error.main}` : isDragFile ? (theme) => `2px solid ${theme.palette.primary.main}` : (theme) => `1px dashed ${theme.palette.grey[500]}`,
|
|
553
556
|
cursor: "pointer",
|
|
557
|
+
transition: "all 0.2s ease-in-out",
|
|
554
558
|
":hover": {
|
|
555
559
|
backgroundColor: error ? "error.50" : "action.hover"
|
|
556
560
|
}
|
|
@@ -631,6 +635,7 @@ var Attachment = ({
|
|
|
631
635
|
), files.length > 0 && /* @__PURE__ */ React4.createElement(
|
|
632
636
|
Stack3,
|
|
633
637
|
{
|
|
638
|
+
"data-testid": "ContenedorArchivosAdjuntos",
|
|
634
639
|
id: "ContenedorArchivosAdjuntos",
|
|
635
640
|
width: "100%",
|
|
636
641
|
sx: __spreadValues({
|
|
@@ -683,7 +688,16 @@ var Attachment = ({
|
|
|
683
688
|
},
|
|
684
689
|
file.uploadError && file.size / (1024 * 1024) > maxSize ? "Archivo super\xF3 el l\xEDmite \u2022 Carga fallida" : file.uploadError ? "Archivo duplicado o inv\xE1lido \u2022 Carga fallida" : `${(file.size / (1024 * 1024)).toFixed(2)}MB \u2022 ${file.type}`
|
|
685
690
|
))),
|
|
686
|
-
/* @__PURE__ */ React4.createElement(Tooltip, { title: "Descargar" }, /* @__PURE__ */ React4.createElement(
|
|
691
|
+
/* @__PURE__ */ React4.createElement(Tooltip, { title: "Descargar" }, /* @__PURE__ */ React4.createElement(
|
|
692
|
+
IconButton3,
|
|
693
|
+
{
|
|
694
|
+
size: "small",
|
|
695
|
+
onClick: () => downloadAction == null ? void 0 : downloadAction(file.name),
|
|
696
|
+
disabled: file.uploadError,
|
|
697
|
+
"aria-label": `Descargar ${file.name}`
|
|
698
|
+
},
|
|
699
|
+
/* @__PURE__ */ React4.createElement(FileDownload, { fontSize: "small", color: "action" })
|
|
700
|
+
)),
|
|
687
701
|
/* @__PURE__ */ React4.createElement(Tooltip, { title: "Eliminar" }, /* @__PURE__ */ React4.createElement(
|
|
688
702
|
IconButton3,
|
|
689
703
|
{
|
|
@@ -691,7 +705,8 @@ var Attachment = ({
|
|
|
691
705
|
onClick: () => {
|
|
692
706
|
setFileToDelete(file);
|
|
693
707
|
setOpenModal(true);
|
|
694
|
-
}
|
|
708
|
+
},
|
|
709
|
+
"aria-label": `Eliminar ${file.name}`
|
|
695
710
|
},
|
|
696
711
|
/* @__PURE__ */ React4.createElement(DeleteOutline, { fontSize: "small", color: "action" })
|
|
697
712
|
))
|
|
@@ -717,13 +732,15 @@ var Attachment = ({
|
|
|
717
732
|
setToast({
|
|
718
733
|
title: "Archivo eliminado",
|
|
719
734
|
type: "success",
|
|
720
|
-
|
|
735
|
+
listITems: [`El archivo "${fileToDelete.name}" fue eliminado exitosamente.`],
|
|
736
|
+
time: 3
|
|
721
737
|
});
|
|
722
738
|
} catch (error2) {
|
|
723
739
|
setToast({
|
|
724
740
|
title: "Error al eliminar archivo",
|
|
725
741
|
type: "error",
|
|
726
|
-
|
|
742
|
+
listITems: [`No se pudo eliminar el archivo "${fileToDelete.name}".`],
|
|
743
|
+
time: 5
|
|
727
744
|
});
|
|
728
745
|
} finally {
|
|
729
746
|
setFileToDelete(null);
|
|
@@ -738,30 +755,411 @@ var Attachment = ({
|
|
|
738
755
|
};
|
|
739
756
|
|
|
740
757
|
// src/Components/Drawer/SCDrawer.tsx
|
|
741
|
-
import
|
|
742
|
-
import {
|
|
743
|
-
import
|
|
744
|
-
|
|
758
|
+
import React16 from "react";
|
|
759
|
+
import { Drawer, Stack as Stack6 } from "@mui/material";
|
|
760
|
+
import Grid6 from "@mui/material/Grid2";
|
|
761
|
+
|
|
762
|
+
// src/Components/Drawer/Helpers/Utils.tsx
|
|
763
|
+
import * as Muicon from "@mui/icons-material";
|
|
764
|
+
var getIcon = (iconName) => {
|
|
765
|
+
if (iconName && iconName in Muicon) {
|
|
766
|
+
return Muicon[iconName];
|
|
767
|
+
}
|
|
768
|
+
return null;
|
|
769
|
+
};
|
|
770
|
+
|
|
771
|
+
// src/Components/Drawer/Helpers/validateInput.tsx
|
|
772
|
+
var validateInputs = (arrayElements, onError, onSuccess, setChipFilters, setTextFilters) => {
|
|
773
|
+
var _a, _b;
|
|
774
|
+
let requiredValues = 0;
|
|
775
|
+
let filledValues = 0;
|
|
776
|
+
for (let i = 0; i < arrayElements.length; i++) {
|
|
777
|
+
const element = arrayElements[i];
|
|
778
|
+
const { validation, element: typeElement } = validateTypeElements(element);
|
|
779
|
+
const textValue = ((_a = typeElement.state) == null ? void 0 : _a.textValue) !== void 0 ? String((_b = typeElement.state) == null ? void 0 : _b.textValue) : String(typeElement.state);
|
|
780
|
+
if (typeElement == null ? void 0 : typeElement.required) {
|
|
781
|
+
requiredValues++;
|
|
782
|
+
if (textValue.trim() !== "" && textValue.trim() !== ",") {
|
|
783
|
+
filledValues++;
|
|
784
|
+
}
|
|
785
|
+
}
|
|
786
|
+
}
|
|
787
|
+
if (requiredValues === filledValues) {
|
|
788
|
+
onSuccess();
|
|
789
|
+
setChipFilters(true);
|
|
790
|
+
} else {
|
|
791
|
+
onError({
|
|
792
|
+
type: "error",
|
|
793
|
+
title: "Algunos campos son requeridos",
|
|
794
|
+
time: 10
|
|
795
|
+
});
|
|
796
|
+
setChipFilters(false);
|
|
797
|
+
}
|
|
798
|
+
};
|
|
799
|
+
|
|
800
|
+
// src/Components/Drawer/Helpers/validateTypeElement.tsx
|
|
801
|
+
import React5 from "react";
|
|
802
|
+
var validateTypeElements = (element) => {
|
|
803
|
+
var _a;
|
|
804
|
+
let validation = "";
|
|
805
|
+
let typeElement = element;
|
|
806
|
+
if (element.type == "textField") {
|
|
807
|
+
validation = "textField";
|
|
808
|
+
typeElement = element;
|
|
809
|
+
} else if (React5.isValidElement(element == null ? void 0 : element.component) && element.component.type && element.component.type.name == "SCtextField") {
|
|
810
|
+
validation = "textField";
|
|
811
|
+
typeElement = element == null ? void 0 : element.component.props;
|
|
812
|
+
} else if (element.type == "textArea") {
|
|
813
|
+
validation = "textArea";
|
|
814
|
+
typeElement = element;
|
|
815
|
+
} else if (React5.isValidElement(element == null ? void 0 : element.component) && element.component.type && element.component.type.name == "SCtextArea") {
|
|
816
|
+
validation = "textArea";
|
|
817
|
+
typeElement = element == null ? void 0 : element.component.props;
|
|
818
|
+
} else if (element.type == "dateRange") {
|
|
819
|
+
validation = "dateRange";
|
|
820
|
+
typeElement = element;
|
|
821
|
+
} else if (React5.isValidElement(element == null ? void 0 : element.component) && element.component.type && element.component.type.name == "SCDateRange") {
|
|
822
|
+
validation = "dateRange";
|
|
823
|
+
typeElement = element == null ? void 0 : element.component.props;
|
|
824
|
+
} else if (element.type == "autocomplete") {
|
|
825
|
+
validation = "autocomplete";
|
|
826
|
+
typeElement = element;
|
|
827
|
+
} else if (React5.isValidElement(element == null ? void 0 : element.component) && element.component.type && element.component.type.name == "SCAutocomplete") {
|
|
828
|
+
validation = "autocomplete";
|
|
829
|
+
typeElement = element == null ? void 0 : element.component.props;
|
|
830
|
+
} else if (element.typeFormat == "multiselect") {
|
|
831
|
+
validation = "multiselect";
|
|
832
|
+
typeElement = element;
|
|
833
|
+
} else if (React5.isValidElement(element == null ? void 0 : element.component) && element.component.props && ((_a = element == null ? void 0 : element.component) == null ? void 0 : _a.props).typeFormat == "multiselect") {
|
|
834
|
+
validation = "multiselect";
|
|
835
|
+
typeElement = element == null ? void 0 : element.component.props;
|
|
836
|
+
} else if (element.type == "select") {
|
|
837
|
+
validation = "select";
|
|
838
|
+
typeElement = element;
|
|
839
|
+
} else if (React5.isValidElement(element == null ? void 0 : element.component) && element.component.type && element.component.type.name == "SCSelect") {
|
|
840
|
+
validation = "select";
|
|
841
|
+
typeElement = element == null ? void 0 : element.component.props;
|
|
842
|
+
}
|
|
843
|
+
return {
|
|
844
|
+
validation,
|
|
845
|
+
element: typeElement
|
|
846
|
+
};
|
|
847
|
+
};
|
|
848
|
+
|
|
849
|
+
// src/Components/Drawer/hooks/useDrawerState.ts
|
|
850
|
+
import { useState as useState5, useEffect as useEffect6 } from "react";
|
|
851
|
+
var useDrawerState = ({ open, setOpen }) => {
|
|
852
|
+
const [drawerOpen, setDrawerOpen] = useState5(open || false);
|
|
853
|
+
useEffect6(() => {
|
|
854
|
+
if (open !== void 0) {
|
|
855
|
+
setDrawerOpen(open);
|
|
856
|
+
}
|
|
857
|
+
}, [open]);
|
|
858
|
+
const handleDrawerClose = () => {
|
|
859
|
+
setDrawerOpen(false);
|
|
860
|
+
setOpen == null ? void 0 : setOpen(false);
|
|
861
|
+
};
|
|
862
|
+
const handleDrawerOpen = () => {
|
|
863
|
+
setDrawerOpen(true);
|
|
864
|
+
setOpen == null ? void 0 : setOpen(true);
|
|
865
|
+
};
|
|
866
|
+
const toggleDrawer = (newOpen) => () => {
|
|
867
|
+
if (newOpen) {
|
|
868
|
+
handleDrawerOpen();
|
|
869
|
+
} else {
|
|
870
|
+
handleDrawerClose();
|
|
871
|
+
}
|
|
872
|
+
};
|
|
873
|
+
return {
|
|
874
|
+
drawerOpen,
|
|
875
|
+
handleDrawerClose,
|
|
876
|
+
handleDrawerOpen,
|
|
877
|
+
toggleDrawer
|
|
878
|
+
};
|
|
879
|
+
};
|
|
880
|
+
|
|
881
|
+
// src/Components/Drawer/hooks/useChipFilters.ts
|
|
882
|
+
import { useState as useState6, useEffect as useEffect7 } from "react";
|
|
883
|
+
var useChipFilters = (arrayElements, chipFilters) => {
|
|
884
|
+
const [stateChipFilters, setChipFilters] = useState6(false);
|
|
885
|
+
const [textFilters, setTextFilters] = useState6([]);
|
|
886
|
+
useEffect7(() => {
|
|
887
|
+
if (chipFilters == null ? void 0 : chipFilters.length) {
|
|
888
|
+
setTextFilters([]);
|
|
889
|
+
processChipFilters();
|
|
890
|
+
}
|
|
891
|
+
}, [chipFilters]);
|
|
892
|
+
const processChipFilters = () => {
|
|
893
|
+
if (!(chipFilters == null ? void 0 : chipFilters.length)) {
|
|
894
|
+
processManualFilters();
|
|
895
|
+
return;
|
|
896
|
+
}
|
|
897
|
+
arrayElements.forEach((arrayElement) => {
|
|
898
|
+
const { validation, element: typeElement } = validateTypeElements(arrayElement);
|
|
899
|
+
const currentValue = getCurrentValue(validation, typeElement);
|
|
900
|
+
chipFilters.forEach((chipFilter) => {
|
|
901
|
+
const chipValue = String(chipFilter).trim();
|
|
902
|
+
if (currentValue === chipValue && currentValue !== "" && currentValue !== ",") {
|
|
903
|
+
updateFilter(currentValue, typeElement, arrayElement.label);
|
|
904
|
+
}
|
|
905
|
+
});
|
|
906
|
+
});
|
|
907
|
+
};
|
|
908
|
+
const processManualFilters = () => {
|
|
909
|
+
const newFiltersToAdd = [];
|
|
910
|
+
arrayElements.forEach((element) => {
|
|
911
|
+
var _a, _b, _c, _d;
|
|
912
|
+
const { validation, element: typeElement } = validateTypeElements(element);
|
|
913
|
+
const textValue = ((_a = typeElement.state) == null ? void 0 : _a.textValue) !== void 0 ? String((_b = typeElement.state) == null ? void 0 : _b.textValue) : String(typeElement.state);
|
|
914
|
+
if (textValue.trim() !== "" && textValue.trim() !== ",") {
|
|
915
|
+
const value = validation === "dateRange" ? `${(_c = typeElement.state[0]) == null ? void 0 : _c.format("DD/MM/YYYY")} - ${(_d = typeElement.state[1]) == null ? void 0 : _d.format("DD/MM/YYYY")}` : textValue;
|
|
916
|
+
const existingFilterIndex = newFiltersToAdd.findIndex(
|
|
917
|
+
(filter) => filter.arrayElement.label === element.label
|
|
918
|
+
);
|
|
919
|
+
const newFilter = { value, arrayElement: typeElement };
|
|
920
|
+
if (existingFilterIndex !== -1) {
|
|
921
|
+
newFiltersToAdd[existingFilterIndex] = newFilter;
|
|
922
|
+
} else {
|
|
923
|
+
newFiltersToAdd.push(newFilter);
|
|
924
|
+
}
|
|
925
|
+
}
|
|
926
|
+
});
|
|
927
|
+
setTextFilters((prevFilters) => {
|
|
928
|
+
let updatedFilters = [...prevFilters];
|
|
929
|
+
newFiltersToAdd.forEach((newFilter) => {
|
|
930
|
+
const existingFilterIndex = updatedFilters.findIndex(
|
|
931
|
+
(filter) => filter.arrayElement.label === newFilter.arrayElement.label
|
|
932
|
+
);
|
|
933
|
+
if (existingFilterIndex !== -1) {
|
|
934
|
+
updatedFilters[existingFilterIndex] = newFilter;
|
|
935
|
+
} else {
|
|
936
|
+
updatedFilters.push(newFilter);
|
|
937
|
+
}
|
|
938
|
+
});
|
|
939
|
+
return updatedFilters;
|
|
940
|
+
});
|
|
941
|
+
};
|
|
942
|
+
const getCurrentValue = (validation, typeElement) => {
|
|
943
|
+
var _a, _b, _c, _d, _e;
|
|
944
|
+
if (validation === "dateRange") {
|
|
945
|
+
if (((_a = typeElement.state) == null ? void 0 : _a[0]) && ((_b = typeElement.state) == null ? void 0 : _b[1])) {
|
|
946
|
+
return `${(_c = typeElement.state[0]) == null ? void 0 : _c.format("DD/MM/YYYY")} - ${(_d = typeElement.state[1]) == null ? void 0 : _d.format("DD/MM/YYYY")}`;
|
|
947
|
+
}
|
|
948
|
+
return "";
|
|
949
|
+
}
|
|
950
|
+
return ((_e = typeElement.state) == null ? void 0 : _e.textValue) !== void 0 ? String(typeElement.state.textValue).trim() : String(typeElement.state).trim();
|
|
951
|
+
};
|
|
952
|
+
const updateFilter = (value, typeElement, label) => {
|
|
953
|
+
setTextFilters((prevFilters) => {
|
|
954
|
+
const newFilter = { value, arrayElement: typeElement };
|
|
955
|
+
const existingFilterIndex = prevFilters.findIndex(
|
|
956
|
+
(filter) => filter.arrayElement.label === label
|
|
957
|
+
);
|
|
958
|
+
if (existingFilterIndex !== -1) {
|
|
959
|
+
const updatedFilters = [...prevFilters];
|
|
960
|
+
updatedFilters[existingFilterIndex] = newFilter;
|
|
961
|
+
return updatedFilters;
|
|
962
|
+
} else {
|
|
963
|
+
return [...prevFilters, newFilter];
|
|
964
|
+
}
|
|
965
|
+
});
|
|
966
|
+
};
|
|
967
|
+
const hasActiveFilters = () => {
|
|
968
|
+
return arrayElements.some((arrayElement) => {
|
|
969
|
+
var _a, _b, _c;
|
|
970
|
+
const { validation, element: typeElement } = validateTypeElements(arrayElement);
|
|
971
|
+
if (((_a = typeElement.state) == null ? void 0 : _a.textValue) !== void 0) {
|
|
972
|
+
return String(typeElement.state.textValue).trim() !== "";
|
|
973
|
+
} else if (validation === "dateRange") {
|
|
974
|
+
return ((_b = typeElement.state) == null ? void 0 : _b[0]) !== null && ((_c = typeElement.state) == null ? void 0 : _c[1]) !== null;
|
|
975
|
+
} else {
|
|
976
|
+
const stateValue = String(typeElement.state).trim();
|
|
977
|
+
return stateValue !== "" && stateValue !== ",";
|
|
978
|
+
}
|
|
979
|
+
});
|
|
980
|
+
};
|
|
981
|
+
const shouldShowChips = (chipFilters == null ? void 0 : chipFilters.length) ? true : stateChipFilters && hasActiveFilters();
|
|
982
|
+
return {
|
|
983
|
+
stateChipFilters,
|
|
984
|
+
setChipFilters,
|
|
985
|
+
textFilters,
|
|
986
|
+
setTextFilters,
|
|
987
|
+
shouldShowChips,
|
|
988
|
+
processChipFilters,
|
|
989
|
+
hasActiveFilters
|
|
990
|
+
};
|
|
991
|
+
};
|
|
992
|
+
|
|
993
|
+
// src/Components/Drawer/hooks/useToast.ts
|
|
994
|
+
import { useState as useState7 } from "react";
|
|
995
|
+
var useToast = () => {
|
|
996
|
+
const [toast, setToast] = useState7(null);
|
|
997
|
+
const setToastWithDelay = (toastContent) => {
|
|
998
|
+
setToast(null);
|
|
999
|
+
setTimeout(() => {
|
|
1000
|
+
setToast(toastContent);
|
|
1001
|
+
}, 10);
|
|
1002
|
+
};
|
|
1003
|
+
const clearToast = () => setToast(null);
|
|
1004
|
+
return {
|
|
1005
|
+
toast,
|
|
1006
|
+
setToastWithDelay,
|
|
1007
|
+
clearToast
|
|
1008
|
+
};
|
|
1009
|
+
};
|
|
1010
|
+
|
|
1011
|
+
// src/Components/Drawer/utils/filterUtils.ts
|
|
1012
|
+
var resetElementByType = (originalElement, validation, typeElement) => {
|
|
1013
|
+
let defaultValue;
|
|
1014
|
+
switch (validation) {
|
|
1015
|
+
case "textField":
|
|
1016
|
+
case "textArea":
|
|
1017
|
+
defaultValue = "";
|
|
1018
|
+
break;
|
|
1019
|
+
case "dateRange":
|
|
1020
|
+
defaultValue = [null, null];
|
|
1021
|
+
break;
|
|
1022
|
+
case "multiselect":
|
|
1023
|
+
defaultValue = { hiddenValue: [], textValue: [] };
|
|
1024
|
+
break;
|
|
1025
|
+
default:
|
|
1026
|
+
defaultValue = { hiddenValue: "-1", textValue: "" };
|
|
1027
|
+
}
|
|
1028
|
+
if (typeElement.setState) {
|
|
1029
|
+
typeElement.setState(defaultValue);
|
|
1030
|
+
}
|
|
1031
|
+
};
|
|
1032
|
+
var cleanAllFilters = (arrayElements, setTextFilters) => {
|
|
1033
|
+
arrayElements.forEach((element) => {
|
|
1034
|
+
const { validation, element: typeElement } = validateTypeElements(element);
|
|
1035
|
+
if (typeElement.setState) {
|
|
1036
|
+
resetElementByType(element, validation, typeElement);
|
|
1037
|
+
}
|
|
1038
|
+
});
|
|
1039
|
+
setTextFilters([]);
|
|
1040
|
+
};
|
|
1041
|
+
var deleteFilter = (element, shouldShowChips, setTextFilters) => {
|
|
1042
|
+
const { validation, element: typeElement } = validateTypeElements(element);
|
|
1043
|
+
if (typeElement.setState && shouldShowChips) {
|
|
1044
|
+
resetElementByType(element, validation, typeElement);
|
|
1045
|
+
setTextFilters(
|
|
1046
|
+
(prevFilters) => prevFilters.filter((filter) => filter.arrayElement.label !== element.label)
|
|
1047
|
+
);
|
|
1048
|
+
}
|
|
1049
|
+
};
|
|
1050
|
+
|
|
1051
|
+
// src/Components/Drawer/components/DrawerButton.tsx
|
|
1052
|
+
import React6 from "react";
|
|
1053
|
+
import { Button as Button4, Chip } from "@mui/material";
|
|
1054
|
+
var DrawerButton = ({
|
|
1055
|
+
buttonDrawer,
|
|
1056
|
+
onToggle
|
|
1057
|
+
}) => {
|
|
1058
|
+
var _a, _b, _c;
|
|
1059
|
+
const ButtonIcon = getIcon(buttonDrawer == null ? void 0 : buttonDrawer.icon);
|
|
1060
|
+
if ((buttonDrawer == null ? void 0 : buttonDrawer.type) === "chip") {
|
|
1061
|
+
return /* @__PURE__ */ React6.createElement(
|
|
1062
|
+
Chip,
|
|
1063
|
+
__spreadProps(__spreadValues({
|
|
1064
|
+
onClick: onToggle,
|
|
1065
|
+
color: buttonDrawer == null ? void 0 : buttonDrawer.color,
|
|
1066
|
+
variant: (buttonDrawer == null ? void 0 : buttonDrawer.variant) === "contained" ? "filled" : "outlined",
|
|
1067
|
+
label: (_a = buttonDrawer == null ? void 0 : buttonDrawer.text) != null ? _a : "",
|
|
1068
|
+
icon: (buttonDrawer == null ? void 0 : buttonDrawer.iconPosition) === "left" && ButtonIcon ? /* @__PURE__ */ React6.createElement(ButtonIcon, { fontSize: "small" }) : void 0,
|
|
1069
|
+
deleteIcon: (buttonDrawer == null ? void 0 : buttonDrawer.iconPosition) === "right" && ButtonIcon ? /* @__PURE__ */ React6.createElement(ButtonIcon, { fontSize: "small" }) : void 0
|
|
1070
|
+
}, (buttonDrawer == null ? void 0 : buttonDrawer.iconPosition) === "right" && ButtonIcon ? { onDelete: () => {
|
|
1071
|
+
} } : {}), {
|
|
1072
|
+
sx: {
|
|
1073
|
+
"& .MuiChip-icon": {
|
|
1074
|
+
color: "inherit"
|
|
1075
|
+
},
|
|
1076
|
+
textTransform: "capitalize"
|
|
1077
|
+
}
|
|
1078
|
+
})
|
|
1079
|
+
);
|
|
1080
|
+
}
|
|
1081
|
+
return /* @__PURE__ */ React6.createElement(
|
|
1082
|
+
Button4,
|
|
1083
|
+
{
|
|
1084
|
+
"data-testid": "test-buttonDrawer",
|
|
1085
|
+
sx: { textTransform: "capitalize" },
|
|
1086
|
+
color: buttonDrawer == null ? void 0 : buttonDrawer.color,
|
|
1087
|
+
onClick: onToggle,
|
|
1088
|
+
size: "small",
|
|
1089
|
+
variant: (_b = buttonDrawer == null ? void 0 : buttonDrawer.variant) != null ? _b : "text",
|
|
1090
|
+
startIcon: ((buttonDrawer == null ? void 0 : buttonDrawer.iconPosition) === "left" || !(buttonDrawer == null ? void 0 : buttonDrawer.iconPosition)) && ButtonIcon ? /* @__PURE__ */ React6.createElement(ButtonIcon, { fontSize: "small" }) : null,
|
|
1091
|
+
endIcon: (buttonDrawer == null ? void 0 : buttonDrawer.iconPosition) === "right" && ButtonIcon ? /* @__PURE__ */ React6.createElement(ButtonIcon, { fontSize: "small" }) : null
|
|
1092
|
+
},
|
|
1093
|
+
(_c = buttonDrawer == null ? void 0 : buttonDrawer.text) != null ? _c : ""
|
|
1094
|
+
);
|
|
1095
|
+
};
|
|
1096
|
+
|
|
1097
|
+
// src/Components/Drawer/components/ChipFiltersDisplay.tsx
|
|
1098
|
+
import React7, { useRef as useRef3 } from "react";
|
|
1099
|
+
import { Box as Box4, IconButton as IconButton4, Chip as Chip2 } from "@mui/material";
|
|
745
1100
|
import ArrowBackIosIcon from "@mui/icons-material/ArrowBackIos";
|
|
746
1101
|
import ArrowForwardIosIcon from "@mui/icons-material/ArrowForwardIos";
|
|
1102
|
+
var ChipFiltersDisplay = ({
|
|
1103
|
+
textFilters,
|
|
1104
|
+
onDeleteFilter
|
|
1105
|
+
}) => {
|
|
1106
|
+
const scrollRef = useRef3(null);
|
|
1107
|
+
const scroll = (offset) => {
|
|
1108
|
+
if (scrollRef.current) {
|
|
1109
|
+
scrollRef.current.scrollLeft += offset;
|
|
1110
|
+
}
|
|
1111
|
+
};
|
|
1112
|
+
return /* @__PURE__ */ React7.createElement(Box4, { display: "flex", alignItems: "center", sx: { maxWidth: "78%" } }, /* @__PURE__ */ React7.createElement(IconButton4, { onClick: () => scroll(-150), size: "small" }, /* @__PURE__ */ React7.createElement(ArrowBackIosIcon, { fontSize: "small" })), /* @__PURE__ */ React7.createElement(
|
|
1113
|
+
Box4,
|
|
1114
|
+
{
|
|
1115
|
+
ref: scrollRef,
|
|
1116
|
+
gap: 0.3,
|
|
1117
|
+
sx: {
|
|
1118
|
+
display: "flex",
|
|
1119
|
+
overflowX: "auto",
|
|
1120
|
+
scrollBehavior: "smooth",
|
|
1121
|
+
"&::-webkit-scrollbar": { display: "none" }
|
|
1122
|
+
}
|
|
1123
|
+
},
|
|
1124
|
+
textFilters == null ? void 0 : textFilters.map((chipData, index) => /* @__PURE__ */ React7.createElement(
|
|
1125
|
+
Chip2,
|
|
1126
|
+
__spreadProps(__spreadValues({
|
|
1127
|
+
key: index,
|
|
1128
|
+
label: chipData.value
|
|
1129
|
+
}, chipData.arrayElement.required === false || chipData.arrayElement.required === void 0 ? { onDelete: () => onDeleteFilter(chipData.arrayElement) } : {}), {
|
|
1130
|
+
color: "default",
|
|
1131
|
+
variant: "filled",
|
|
1132
|
+
size: "small",
|
|
1133
|
+
sx: {
|
|
1134
|
+
flexShrink: 0,
|
|
1135
|
+
minWidth: "auto"
|
|
1136
|
+
}
|
|
1137
|
+
})
|
|
1138
|
+
))
|
|
1139
|
+
), /* @__PURE__ */ React7.createElement(IconButton4, { onClick: () => scroll(150), size: "small" }, /* @__PURE__ */ React7.createElement(ArrowForwardIosIcon, { fontSize: "small" })));
|
|
1140
|
+
};
|
|
1141
|
+
|
|
1142
|
+
// src/Components/Drawer/components/DrawerContent.tsx
|
|
1143
|
+
import React13 from "react";
|
|
1144
|
+
import { Box as Box10, Stack as Stack5 } from "@mui/material";
|
|
747
1145
|
|
|
748
1146
|
// src/Components/Textfield/SCTextField.tsx
|
|
749
|
-
import
|
|
750
|
-
import { FormControl, IconButton as
|
|
1147
|
+
import React8, { useEffect as useEffect8, useState as useState8 } from "react";
|
|
1148
|
+
import { FormControl, IconButton as IconButton5, InputAdornment, InputLabel, OutlinedInput, FilledInput, Popover, Input, Box as Box5, Typography as Typography4, SvgIcon, Tooltip as Tooltip2 } from "@mui/material";
|
|
751
1149
|
import Grid from "@mui/material/Grid2";
|
|
752
1150
|
import { Visibility, VisibilityOff, InfoOutlined } from "@mui/icons-material";
|
|
753
1151
|
|
|
754
1152
|
// src/Components/Textfield/Helpers/validateIcon.tsx
|
|
755
|
-
import * as
|
|
1153
|
+
import * as Muicon2 from "@mui/icons-material";
|
|
756
1154
|
function getIconComponent2(name) {
|
|
757
1155
|
if (typeof name !== "string") return name;
|
|
758
|
-
return name in
|
|
1156
|
+
return name in Muicon2 ? Muicon2[name] : void 0;
|
|
759
1157
|
}
|
|
760
1158
|
function getIconValidation(name) {
|
|
761
1159
|
if (typeof name !== "string") {
|
|
762
1160
|
return (name == null ? void 0 : name.type) ? "icon" : "text";
|
|
763
1161
|
}
|
|
764
|
-
return name in
|
|
1162
|
+
return name in Muicon2 ? "icon" : "text";
|
|
765
1163
|
}
|
|
766
1164
|
|
|
767
1165
|
// src/Components/Textfield/Helpers/validateKeyDown.tsx
|
|
@@ -835,13 +1233,13 @@ var SCTextField = ({
|
|
|
835
1233
|
let IconInputStart;
|
|
836
1234
|
let IconInputEnd;
|
|
837
1235
|
let IconTitle;
|
|
838
|
-
const [showPassword, setShowPassword] =
|
|
839
|
-
const [error, setError] =
|
|
840
|
-
const [anchorInfoTitle, setAnchorInfoTitle] =
|
|
1236
|
+
const [showPassword, setShowPassword] = useState8(false);
|
|
1237
|
+
const [error, setError] = useState8(false);
|
|
1238
|
+
const [anchorInfoTitle, setAnchorInfoTitle] = useState8(null);
|
|
841
1239
|
const openInfoTitle = Boolean(anchorInfoTitle);
|
|
842
|
-
const [anchorInfoElement, setAnchorInfoElement] =
|
|
1240
|
+
const [anchorInfoElement, setAnchorInfoElement] = useState8(null);
|
|
843
1241
|
const openInfoElement = Boolean(anchorInfoElement);
|
|
844
|
-
|
|
1242
|
+
useEffect8(() => {
|
|
845
1243
|
if (error) {
|
|
846
1244
|
setTimeout(() => {
|
|
847
1245
|
setError(false);
|
|
@@ -891,7 +1289,7 @@ var SCTextField = ({
|
|
|
891
1289
|
const handleCloseInfoElement = () => {
|
|
892
1290
|
setAnchorInfoElement(null);
|
|
893
1291
|
};
|
|
894
|
-
return /* @__PURE__ */
|
|
1292
|
+
return /* @__PURE__ */ React8.createElement(Box5, { sx: { width } }, /* @__PURE__ */ React8.createElement(Grid, { container: true, alignItems: "center", mb: 1.25, gap: 0.5 }, iconTitle && IconTitle ? /* @__PURE__ */ React8.createElement(SvgIcon, { color: "action", fontSize: "small", component: IconTitle }) : "", title ? /* @__PURE__ */ React8.createElement(Typography4, { mx: 0.5, variant: "subtitle2", color: "text.secondary" }, title) : "", infoTitle ? /* @__PURE__ */ React8.createElement(React8.Fragment, null, infoTitle.component === "popover" ? /* @__PURE__ */ React8.createElement(React8.Fragment, null, /* @__PURE__ */ React8.createElement(
|
|
895
1293
|
InfoOutlined,
|
|
896
1294
|
{
|
|
897
1295
|
color: "action",
|
|
@@ -899,7 +1297,7 @@ var SCTextField = ({
|
|
|
899
1297
|
onMouseEnter: (event2) => handleOpenInfoTitle(event2),
|
|
900
1298
|
onMouseLeave: () => handleCloseInfoTitle()
|
|
901
1299
|
}
|
|
902
|
-
), /* @__PURE__ */
|
|
1300
|
+
), /* @__PURE__ */ React8.createElement(
|
|
903
1301
|
Popover,
|
|
904
1302
|
{
|
|
905
1303
|
sx: {
|
|
@@ -921,14 +1319,14 @@ var SCTextField = ({
|
|
|
921
1319
|
},
|
|
922
1320
|
disableRestoreFocus: true
|
|
923
1321
|
},
|
|
924
|
-
/* @__PURE__ */
|
|
925
|
-
)) : /* @__PURE__ */
|
|
1322
|
+
/* @__PURE__ */ React8.createElement(Typography4, { p: 2 }, infoTitle.text)
|
|
1323
|
+
)) : /* @__PURE__ */ React8.createElement(Tooltip2, { title: infoTitle.text, "data-testid": "test-infoTitle", placement: "bottom-start", slotProps: { popper: { modifiers: [{ name: "offset", options: { offset: [0, -14] } }] } } }, /* @__PURE__ */ React8.createElement(
|
|
926
1324
|
InfoOutlined,
|
|
927
1325
|
{
|
|
928
1326
|
color: "action",
|
|
929
1327
|
fontSize: "small"
|
|
930
1328
|
}
|
|
931
|
-
))) : ""), /* @__PURE__ */
|
|
1329
|
+
))) : ""), /* @__PURE__ */ React8.createElement(Grid, { container: true, sx: { flexWrap: "nowrap", alignItems: "center" } }, /* @__PURE__ */ React8.createElement(
|
|
932
1330
|
FormControl,
|
|
933
1331
|
{
|
|
934
1332
|
color,
|
|
@@ -937,7 +1335,7 @@ var SCTextField = ({
|
|
|
937
1335
|
variant,
|
|
938
1336
|
sx: { background: background || "transparent", borderRadius: "4px" }
|
|
939
1337
|
},
|
|
940
|
-
/* @__PURE__ */
|
|
1338
|
+
/* @__PURE__ */ React8.createElement(
|
|
941
1339
|
InputLabel,
|
|
942
1340
|
{
|
|
943
1341
|
"data-testid": "test-label",
|
|
@@ -948,7 +1346,7 @@ var SCTextField = ({
|
|
|
948
1346
|
},
|
|
949
1347
|
label ? label : ""
|
|
950
1348
|
),
|
|
951
|
-
/* @__PURE__ */
|
|
1349
|
+
/* @__PURE__ */ React8.createElement(
|
|
952
1350
|
InputComponent,
|
|
953
1351
|
{
|
|
954
1352
|
size: size ? size : "medium",
|
|
@@ -964,17 +1362,17 @@ var SCTextField = ({
|
|
|
964
1362
|
type: !showPassword && format3 === "password" ? "password" : (format3 || "text").toUpperCase() === "INT" || (format3 || "text").toUpperCase() === "DECIMAL" ? "number" : "text",
|
|
965
1363
|
className: format3 === "password" && !showPassword ? "" : "",
|
|
966
1364
|
placeholder,
|
|
967
|
-
startAdornment: iconInputStart ? /* @__PURE__ */
|
|
968
|
-
endAdornment: /* @__PURE__ */
|
|
969
|
-
|
|
1365
|
+
startAdornment: iconInputStart ? /* @__PURE__ */ React8.createElement(InputAdornment, { position: "start" }, IconInputStartValidation === "text" ? iconInputStart : IconInputStart ? /* @__PURE__ */ React8.createElement(IconInputStart, { fontSize: "small" }) : null) : "",
|
|
1366
|
+
endAdornment: /* @__PURE__ */ React8.createElement(InputAdornment, { position: "end" }, format3 === "password" ? /* @__PURE__ */ React8.createElement(
|
|
1367
|
+
IconButton5,
|
|
970
1368
|
{
|
|
971
1369
|
"aria-label": "toggle password visibility",
|
|
972
1370
|
onClick: handleClickShowPassword,
|
|
973
1371
|
onMouseDown: handleMouseDownPassword,
|
|
974
1372
|
edge: "end"
|
|
975
1373
|
},
|
|
976
|
-
showPassword ? /* @__PURE__ */
|
|
977
|
-
) : iconInputEnd === void 0 && infoElement !== void 0 ? /* @__PURE__ */
|
|
1374
|
+
showPassword ? /* @__PURE__ */ React8.createElement(VisibilityOff, null) : /* @__PURE__ */ React8.createElement(Visibility, null)
|
|
1375
|
+
) : iconInputEnd === void 0 && infoElement !== void 0 ? /* @__PURE__ */ React8.createElement(React8.Fragment, null, infoElement.component === "popover" ? /* @__PURE__ */ React8.createElement(React8.Fragment, null, /* @__PURE__ */ React8.createElement(
|
|
978
1376
|
InfoOutlined,
|
|
979
1377
|
{
|
|
980
1378
|
"data-testid": "test-infoElement",
|
|
@@ -985,7 +1383,7 @@ var SCTextField = ({
|
|
|
985
1383
|
onMouseEnter: (event2) => handleOpenInfoElement(event2),
|
|
986
1384
|
onMouseLeave: () => handleCloseInfoElement()
|
|
987
1385
|
}
|
|
988
|
-
), /* @__PURE__ */
|
|
1386
|
+
), /* @__PURE__ */ React8.createElement(
|
|
989
1387
|
Popover,
|
|
990
1388
|
{
|
|
991
1389
|
sx: {
|
|
@@ -1007,19 +1405,19 @@ var SCTextField = ({
|
|
|
1007
1405
|
},
|
|
1008
1406
|
disableRestoreFocus: true
|
|
1009
1407
|
},
|
|
1010
|
-
/* @__PURE__ */
|
|
1011
|
-
)) : /* @__PURE__ */
|
|
1408
|
+
/* @__PURE__ */ React8.createElement(Typography4, { "data-testid": "test-popover-text", p: 2 }, infoElement.text)
|
|
1409
|
+
)) : /* @__PURE__ */ React8.createElement(Tooltip2, { title: infoElement.text, placement: "bottom-end", slotProps: { popper: { modifiers: [{ name: "offset", options: { offset: [0, -14] } }] } } }, /* @__PURE__ */ React8.createElement(
|
|
1012
1410
|
InfoOutlined,
|
|
1013
1411
|
{
|
|
1014
1412
|
color: "action",
|
|
1015
1413
|
fontSize: "small"
|
|
1016
1414
|
}
|
|
1017
|
-
))) : iconInputEnd !== void 0 ? IconInputEndValidation === "text" ? iconInputEnd : IconInputEnd ? /* @__PURE__ */
|
|
1415
|
+
))) : iconInputEnd !== void 0 ? IconInputEndValidation === "text" ? iconInputEnd : IconInputEnd ? /* @__PURE__ */ React8.createElement(IconInputEnd, { fontSize: "small" }) : null : ""),
|
|
1018
1416
|
label: label ? label + (format3 === "password" && !showPassword ? "" : "") : "",
|
|
1019
1417
|
autoComplete: format3 === "password" ? "new-password" : "off"
|
|
1020
1418
|
}
|
|
1021
1419
|
)
|
|
1022
|
-
), (iconInputEnd !== void 0 || format3 === "password") && infoElement ? /* @__PURE__ */
|
|
1420
|
+
), (iconInputEnd !== void 0 || format3 === "password") && infoElement ? /* @__PURE__ */ React8.createElement(React8.Fragment, null, infoElement.component === "popover" ? /* @__PURE__ */ React8.createElement(React8.Fragment, null, /* @__PURE__ */ React8.createElement(
|
|
1023
1421
|
InfoOutlined,
|
|
1024
1422
|
{
|
|
1025
1423
|
"data-testid": "test-infoElement",
|
|
@@ -1030,7 +1428,7 @@ var SCTextField = ({
|
|
|
1030
1428
|
onMouseEnter: (event2) => handleOpenInfoElement(event2),
|
|
1031
1429
|
onMouseLeave: handleCloseInfoElement
|
|
1032
1430
|
}
|
|
1033
|
-
), /* @__PURE__ */
|
|
1431
|
+
), /* @__PURE__ */ React8.createElement(
|
|
1034
1432
|
Popover,
|
|
1035
1433
|
{
|
|
1036
1434
|
sx: { pointerEvents: "none" },
|
|
@@ -1047,8 +1445,8 @@ var SCTextField = ({
|
|
|
1047
1445
|
},
|
|
1048
1446
|
disableRestoreFocus: true
|
|
1049
1447
|
},
|
|
1050
|
-
/* @__PURE__ */
|
|
1051
|
-
)) : /* @__PURE__ */
|
|
1448
|
+
/* @__PURE__ */ React8.createElement(Typography4, { "data-testid": "test-popover-text", p: 2 }, infoElement.text)
|
|
1449
|
+
)) : /* @__PURE__ */ React8.createElement(Tooltip2, { title: infoElement.text, placement: "bottom-end", slotProps: { popper: { modifiers: [{ name: "offset", options: { offset: [0, -14] } }] } } }, /* @__PURE__ */ React8.createElement(
|
|
1052
1450
|
InfoOutlined,
|
|
1053
1451
|
{
|
|
1054
1452
|
sx: { marginLeft: "4px" },
|
|
@@ -1060,7 +1458,7 @@ var SCTextField = ({
|
|
|
1060
1458
|
|
|
1061
1459
|
// src/Components/TextArea/Helpers/validateIcon.tsx
|
|
1062
1460
|
import * as MuiIcons2 from "@mui/icons-material";
|
|
1063
|
-
function
|
|
1461
|
+
function getIcon2(name) {
|
|
1064
1462
|
if (!name || !(name in MuiIcons2)) {
|
|
1065
1463
|
return null;
|
|
1066
1464
|
}
|
|
@@ -1068,8 +1466,8 @@ function getIcon(name) {
|
|
|
1068
1466
|
}
|
|
1069
1467
|
|
|
1070
1468
|
// src/Components/TextArea/SCTextArea.tsx
|
|
1071
|
-
import
|
|
1072
|
-
import { Typography as Typography5, Stack as Stack4, TextField, Box as
|
|
1469
|
+
import React9, { useEffect as useEffect9, useState as useState9 } from "react";
|
|
1470
|
+
import { Typography as Typography5, Stack as Stack4, TextField, Box as Box6, Popover as Popover2, Tooltip as Tooltip3, SvgIcon as SvgIcon2, Grid as Grid2 } from "@mui/material";
|
|
1073
1471
|
import { InfoOutlined as InfoOutlined2 } from "@mui/icons-material";
|
|
1074
1472
|
var SCTextArea = ({
|
|
1075
1473
|
//informativas
|
|
@@ -1092,14 +1490,14 @@ var SCTextArea = ({
|
|
|
1092
1490
|
state,
|
|
1093
1491
|
onBlur
|
|
1094
1492
|
}) => {
|
|
1095
|
-
const [helperCount, setHelperCount] =
|
|
1096
|
-
const [stateError, setStateError] =
|
|
1097
|
-
const [anchorInfoTitle, setAnchorInfoTitle] =
|
|
1493
|
+
const [helperCount, setHelperCount] = useState9(0);
|
|
1494
|
+
const [stateError, setStateError] = useState9(false);
|
|
1495
|
+
const [anchorInfoTitle, setAnchorInfoTitle] = React9.useState(null);
|
|
1098
1496
|
const openInfoTitle = Boolean(anchorInfoTitle);
|
|
1099
|
-
|
|
1497
|
+
useEffect9(() => {
|
|
1100
1498
|
setHelperCount(state == null ? void 0 : state.length);
|
|
1101
1499
|
}, [state]);
|
|
1102
|
-
const IconTitle =
|
|
1500
|
+
const IconTitle = getIcon2(iconTitle);
|
|
1103
1501
|
const handleBlur = (event2) => {
|
|
1104
1502
|
if (required && state.trim() === "") {
|
|
1105
1503
|
setStateError(true);
|
|
@@ -1118,7 +1516,7 @@ var SCTextArea = ({
|
|
|
1118
1516
|
const handleCloseInfoTitle = () => {
|
|
1119
1517
|
setAnchorInfoTitle(null);
|
|
1120
1518
|
};
|
|
1121
|
-
return /* @__PURE__ */
|
|
1519
|
+
return /* @__PURE__ */ React9.createElement(React9.Fragment, null, /* @__PURE__ */ React9.createElement(Box6, { sx: { width } }, /* @__PURE__ */ React9.createElement(Grid2, { container: true, sx: { alignItems: "center" }, gap: 0.5 }, iconTitle && IconTitle && /* @__PURE__ */ React9.createElement(SvgIcon2, { color: "action", fontSize: "small", component: IconTitle }), title && /* @__PURE__ */ React9.createElement(Typography5, { color: colorTitle || "text.secondary", variant: "subtitle2" }, title), infoTitle ? /* @__PURE__ */ React9.createElement(React9.Fragment, null, infoTitle.component === "popover" ? /* @__PURE__ */ React9.createElement(React9.Fragment, null, /* @__PURE__ */ React9.createElement(
|
|
1122
1520
|
InfoOutlined2,
|
|
1123
1521
|
{
|
|
1124
1522
|
color: "action",
|
|
@@ -1126,7 +1524,7 @@ var SCTextArea = ({
|
|
|
1126
1524
|
onMouseEnter: (event2) => handleOpenInfoTitle(event2),
|
|
1127
1525
|
onMouseLeave: () => handleCloseInfoTitle()
|
|
1128
1526
|
}
|
|
1129
|
-
), /* @__PURE__ */
|
|
1527
|
+
), /* @__PURE__ */ React9.createElement(
|
|
1130
1528
|
Popover2,
|
|
1131
1529
|
{
|
|
1132
1530
|
sx: { pointerEvents: "none" },
|
|
@@ -1143,14 +1541,14 @@ var SCTextArea = ({
|
|
|
1143
1541
|
},
|
|
1144
1542
|
disableRestoreFocus: true
|
|
1145
1543
|
},
|
|
1146
|
-
/* @__PURE__ */
|
|
1147
|
-
)) : /* @__PURE__ */
|
|
1544
|
+
/* @__PURE__ */ React9.createElement(Typography5, { sx: { p: 2 } }, infoTitle.text)
|
|
1545
|
+
)) : /* @__PURE__ */ React9.createElement(Tooltip3, { title: infoTitle.text, placement: "bottom-start", slotProps: { popper: { modifiers: [{ name: "offset", options: { offset: [0, -14] } }] } } }, /* @__PURE__ */ React9.createElement(
|
|
1148
1546
|
InfoOutlined2,
|
|
1149
1547
|
{
|
|
1150
1548
|
color: "action",
|
|
1151
1549
|
fontSize: "small"
|
|
1152
1550
|
}
|
|
1153
|
-
))) : ""), /* @__PURE__ */
|
|
1551
|
+
))) : ""), /* @__PURE__ */ React9.createElement(Stack4, null, /* @__PURE__ */ React9.createElement(
|
|
1154
1552
|
TextField,
|
|
1155
1553
|
{
|
|
1156
1554
|
required,
|
|
@@ -1172,7 +1570,7 @@ var SCTextArea = ({
|
|
|
1172
1570
|
},
|
|
1173
1571
|
autoComplete: "off"
|
|
1174
1572
|
}
|
|
1175
|
-
)), /* @__PURE__ */
|
|
1573
|
+
)), /* @__PURE__ */ React9.createElement(Stack4, null, /* @__PURE__ */ React9.createElement(
|
|
1176
1574
|
Typography5,
|
|
1177
1575
|
{
|
|
1178
1576
|
variant: "caption",
|
|
@@ -1186,10 +1584,10 @@ var SCTextArea = ({
|
|
|
1186
1584
|
};
|
|
1187
1585
|
|
|
1188
1586
|
// src/Components/SCSelect.tsx
|
|
1189
|
-
import
|
|
1190
|
-
import { InputLabel as InputLabel2, FormControl as FormControl2, MenuItem, SvgIcon as SvgIcon3, ListItemIcon, ListItemText, Box as
|
|
1587
|
+
import React10, { useEffect as useEffect10 } from "react";
|
|
1588
|
+
import { InputLabel as InputLabel2, FormControl as FormControl2, MenuItem, SvgIcon as SvgIcon3, ListItemIcon, ListItemText, Box as Box7 } from "@mui/material";
|
|
1191
1589
|
import Select from "@mui/material/Select";
|
|
1192
|
-
import * as
|
|
1590
|
+
import * as Muicon3 from "@mui/icons-material";
|
|
1193
1591
|
function SCSelect({
|
|
1194
1592
|
label = "",
|
|
1195
1593
|
data,
|
|
@@ -1204,16 +1602,16 @@ function SCSelect({
|
|
|
1204
1602
|
state
|
|
1205
1603
|
}) {
|
|
1206
1604
|
const labelContent = `<span style="color: red;">* </span>` + label;
|
|
1207
|
-
const [prevData, setPrevData] =
|
|
1208
|
-
const [error, setError] =
|
|
1209
|
-
|
|
1605
|
+
const [prevData, setPrevData] = React10.useState(data);
|
|
1606
|
+
const [error, setError] = React10.useState(false);
|
|
1607
|
+
useEffect10(() => {
|
|
1210
1608
|
if (error) {
|
|
1211
1609
|
setTimeout(() => {
|
|
1212
1610
|
setError(false);
|
|
1213
1611
|
}, 1e3);
|
|
1214
1612
|
}
|
|
1215
1613
|
}, [error]);
|
|
1216
|
-
|
|
1614
|
+
useEffect10(() => {
|
|
1217
1615
|
let dataChangeValidation = JSON.stringify(prevData) === JSON.stringify(data);
|
|
1218
1616
|
if (dataChangeValidation == false) {
|
|
1219
1617
|
setState({ hiddenValue: "", textValue: "" });
|
|
@@ -1223,7 +1621,7 @@ function SCSelect({
|
|
|
1223
1621
|
data.map(function(option, index, array) {
|
|
1224
1622
|
if (option == null ? void 0 : option.icon) {
|
|
1225
1623
|
if ((option == null ? void 0 : option.icon.type) == void 0) {
|
|
1226
|
-
option.icon =
|
|
1624
|
+
option.icon = Muicon3[option == null ? void 0 : option.icon];
|
|
1227
1625
|
} else {
|
|
1228
1626
|
option;
|
|
1229
1627
|
}
|
|
@@ -1247,25 +1645,25 @@ function SCSelect({
|
|
|
1247
1645
|
}
|
|
1248
1646
|
}
|
|
1249
1647
|
};
|
|
1250
|
-
return /* @__PURE__ */
|
|
1648
|
+
return /* @__PURE__ */ React10.createElement(React10.Fragment, null, data && /* @__PURE__ */ React10.createElement(Box7, { sx: { width } }, /* @__PURE__ */ React10.createElement(
|
|
1251
1649
|
FormControl2,
|
|
1252
1650
|
{
|
|
1253
1651
|
fullWidth: true,
|
|
1254
1652
|
size: size ? size : "medium",
|
|
1255
1653
|
variant
|
|
1256
1654
|
},
|
|
1257
|
-
/* @__PURE__ */
|
|
1655
|
+
/* @__PURE__ */ React10.createElement(
|
|
1258
1656
|
InputLabel2,
|
|
1259
1657
|
{
|
|
1260
1658
|
error
|
|
1261
1659
|
},
|
|
1262
|
-
required ? /* @__PURE__ */
|
|
1660
|
+
required ? /* @__PURE__ */ React10.createElement("span", { dangerouslySetInnerHTML: { __html: labelContent } }) : label
|
|
1263
1661
|
),
|
|
1264
|
-
/* @__PURE__ */
|
|
1662
|
+
/* @__PURE__ */ React10.createElement(
|
|
1265
1663
|
Select,
|
|
1266
1664
|
{
|
|
1267
1665
|
value: Array.isArray(state.hiddenValue) ? state.hiddenValue[0] || "" : state.hiddenValue != "-1" ? state.hiddenValue : "",
|
|
1268
|
-
label: required ? /* @__PURE__ */
|
|
1666
|
+
label: required ? /* @__PURE__ */ React10.createElement("span", { dangerouslySetInnerHTML: { __html: labelContent } }) : label,
|
|
1269
1667
|
onChange: handleChange,
|
|
1270
1668
|
onBlur: handleBlur,
|
|
1271
1669
|
variant,
|
|
@@ -1291,18 +1689,18 @@ function SCSelect({
|
|
|
1291
1689
|
}
|
|
1292
1690
|
},
|
|
1293
1691
|
data.map((option, index) => {
|
|
1294
|
-
return /* @__PURE__ */
|
|
1692
|
+
return /* @__PURE__ */ React10.createElement(MenuItem, { key: index, value: getItemValue(option).value }, getItemValue(option).icon != void 0 ? /* @__PURE__ */ React10.createElement(ListItemIcon, { sx: { minWidth: "10px !important" } }, /* @__PURE__ */ React10.createElement(SvgIcon3, { fontSize: "small", color: "action", component: getItemValue(option).icon })) : "", /* @__PURE__ */ React10.createElement(ListItemText, { primary: getItemValue(option).text, color: "text.primary" }));
|
|
1295
1693
|
})
|
|
1296
1694
|
)
|
|
1297
1695
|
)));
|
|
1298
1696
|
}
|
|
1299
1697
|
|
|
1300
1698
|
// src/Components/SCAutocomplete.tsx
|
|
1301
|
-
import
|
|
1302
|
-
import { Autocomplete, Checkbox, InputAdornment as InputAdornment3, MenuItem as MenuItem2, TextField as TextField3, Typography as Typography7, SvgIcon as SvgIcon4, ListItemIcon as ListItemIcon2, ListItemText as ListItemText2, Divider as Divider3, FormControlLabel as FormControlLabel2, IconButton as
|
|
1699
|
+
import React11, { useEffect as useEffect11 } from "react";
|
|
1700
|
+
import { Autocomplete, Checkbox, InputAdornment as InputAdornment3, MenuItem as MenuItem2, TextField as TextField3, Typography as Typography7, SvgIcon as SvgIcon4, ListItemIcon as ListItemIcon2, ListItemText as ListItemText2, Divider as Divider3, FormControlLabel as FormControlLabel2, IconButton as IconButton7, Chip as Chip3, Box as Box8, Button as Button6 } from "@mui/material";
|
|
1303
1701
|
import Grid3 from "@mui/material/Grid2";
|
|
1304
1702
|
import { Search, Clear } from "@mui/icons-material";
|
|
1305
|
-
import * as
|
|
1703
|
+
import * as Muicon4 from "@mui/icons-material";
|
|
1306
1704
|
function SCAutocomplete({
|
|
1307
1705
|
label = "",
|
|
1308
1706
|
data,
|
|
@@ -1323,12 +1721,12 @@ function SCAutocomplete({
|
|
|
1323
1721
|
const labelContent = `<span style="color: red;">* </span>` + label;
|
|
1324
1722
|
let group = "";
|
|
1325
1723
|
let isSelected = false;
|
|
1326
|
-
const [selectedOptions, setSelectedOptions] =
|
|
1327
|
-
const [prevData, setPrevData] =
|
|
1328
|
-
const [originalData, setOriginalData] =
|
|
1329
|
-
const [inputValue, setInputValue] =
|
|
1330
|
-
const [isUserTyping, setIsUserTyping] =
|
|
1331
|
-
|
|
1724
|
+
const [selectedOptions, setSelectedOptions] = React11.useState([]);
|
|
1725
|
+
const [prevData, setPrevData] = React11.useState(data);
|
|
1726
|
+
const [originalData, setOriginalData] = React11.useState(data);
|
|
1727
|
+
const [inputValue, setInputValue] = React11.useState("");
|
|
1728
|
+
const [isUserTyping, setIsUserTyping] = React11.useState(false);
|
|
1729
|
+
useEffect11(() => {
|
|
1332
1730
|
const dataChangeValidation = JSON.stringify(prevData) === JSON.stringify(data);
|
|
1333
1731
|
if (!dataChangeValidation && !isUserTyping) {
|
|
1334
1732
|
setState({ hiddenValue: "-1", textValue: "" });
|
|
@@ -1339,7 +1737,7 @@ function SCAutocomplete({
|
|
|
1339
1737
|
}
|
|
1340
1738
|
setPrevData(data);
|
|
1341
1739
|
}, [data, isUserTyping]);
|
|
1342
|
-
|
|
1740
|
+
useEffect11(() => {
|
|
1343
1741
|
if (typeFormat == "multiselect") {
|
|
1344
1742
|
if (state.hiddenValue != "-1" && Array.isArray(state.hiddenValue)) {
|
|
1345
1743
|
const newSelectedOptions = originalData.filter(
|
|
@@ -1349,7 +1747,7 @@ function SCAutocomplete({
|
|
|
1349
1747
|
}
|
|
1350
1748
|
}
|
|
1351
1749
|
}, [state.hiddenValue, originalData, typeFormat]);
|
|
1352
|
-
|
|
1750
|
+
useEffect11(() => {
|
|
1353
1751
|
if (inputValue === "") {
|
|
1354
1752
|
setIsUserTyping(false);
|
|
1355
1753
|
}
|
|
@@ -1357,7 +1755,7 @@ function SCAutocomplete({
|
|
|
1357
1755
|
data.map(function(option) {
|
|
1358
1756
|
if (option == null ? void 0 : option.icon) {
|
|
1359
1757
|
if ((option == null ? void 0 : option.icon.type) == void 0) {
|
|
1360
|
-
option.icon =
|
|
1758
|
+
option.icon = Muicon4[option == null ? void 0 : option.icon];
|
|
1361
1759
|
} else {
|
|
1362
1760
|
option;
|
|
1363
1761
|
}
|
|
@@ -1407,7 +1805,7 @@ function SCAutocomplete({
|
|
|
1407
1805
|
const selectedValue = typeFormat === "multiselect" ? selectedOptions : originalData.find(
|
|
1408
1806
|
(item) => getItemValue(item).value === state.hiddenValue
|
|
1409
1807
|
) || null;
|
|
1410
|
-
return /* @__PURE__ */
|
|
1808
|
+
return /* @__PURE__ */ React11.createElement(React11.Fragment, null, data && /* @__PURE__ */ React11.createElement(
|
|
1411
1809
|
Autocomplete,
|
|
1412
1810
|
{
|
|
1413
1811
|
multiple: typeFormat === "multiselect",
|
|
@@ -1434,10 +1832,10 @@ function SCAutocomplete({
|
|
|
1434
1832
|
limitTags: 2,
|
|
1435
1833
|
renderTags: (value, getTagProps) => {
|
|
1436
1834
|
const limit = 2;
|
|
1437
|
-
return /* @__PURE__ */
|
|
1835
|
+
return /* @__PURE__ */ React11.createElement(React11.Fragment, null, value.slice(0, limit).map((option, index) => {
|
|
1438
1836
|
const _a = getTagProps({ index }), { key } = _a, chipProps = __objRest(_a, ["key"]);
|
|
1439
|
-
return /* @__PURE__ */
|
|
1440
|
-
|
|
1837
|
+
return /* @__PURE__ */ React11.createElement(
|
|
1838
|
+
Chip3,
|
|
1441
1839
|
__spreadProps(__spreadValues({
|
|
1442
1840
|
key,
|
|
1443
1841
|
color: "default",
|
|
@@ -1448,7 +1846,7 @@ function SCAutocomplete({
|
|
|
1448
1846
|
style: { maxWidth: 120, overflow: "hidden", textOverflow: "ellipsis", whiteSpace: "nowrap" }
|
|
1449
1847
|
})
|
|
1450
1848
|
);
|
|
1451
|
-
}), value.length > limit && /* @__PURE__ */
|
|
1849
|
+
}), value.length > limit && /* @__PURE__ */ React11.createElement(Box8, { sx: { ml: 0.5, fontSize: 13, color: "#666", display: "flex", alignItems: "center" } }, `+${value.length - limit}`));
|
|
1452
1850
|
},
|
|
1453
1851
|
renderOption: (props, option) => {
|
|
1454
1852
|
const _a = props, { key } = _a, optionProps = __objRest(_a, ["key"]);
|
|
@@ -1466,7 +1864,7 @@ function SCAutocomplete({
|
|
|
1466
1864
|
isValid = group == option[columnGroup];
|
|
1467
1865
|
group = option[columnGroup];
|
|
1468
1866
|
}
|
|
1469
|
-
return /* @__PURE__ */
|
|
1867
|
+
return /* @__PURE__ */ React11.createElement(React11.Fragment, null, /* @__PURE__ */ React11.createElement(React11.Fragment, { key }, columnGroup ? !isValid ? /* @__PURE__ */ React11.createElement(Typography7, { color: "text.secondary", sx: { margin: "7px 16px !important", fontSize: "13px !important" } }, option[columnGroup]) : "" : "", /* @__PURE__ */ React11.createElement(
|
|
1470
1868
|
MenuItem2,
|
|
1471
1869
|
__spreadProps(__spreadValues({}, optionProps), {
|
|
1472
1870
|
disabled: isDisabled,
|
|
@@ -1476,8 +1874,8 @@ function SCAutocomplete({
|
|
|
1476
1874
|
opacity: isDisabled ? 0.5 : 1
|
|
1477
1875
|
}
|
|
1478
1876
|
}),
|
|
1479
|
-
typeFormat != "multiselect" && getItemValue(option).icon != void 0 ? /* @__PURE__ */
|
|
1480
|
-
typeFormat == "multiselect" ? /* @__PURE__ */
|
|
1877
|
+
typeFormat != "multiselect" && getItemValue(option).icon != void 0 ? /* @__PURE__ */ React11.createElement(ListItemIcon2, { sx: { minWidth: "10px !important" } }, /* @__PURE__ */ React11.createElement(SvgIcon4, { fontSize: "small", color: "action", component: getItemValue(option).icon })) : "",
|
|
1878
|
+
typeFormat == "multiselect" ? /* @__PURE__ */ React11.createElement(
|
|
1481
1879
|
Checkbox,
|
|
1482
1880
|
{
|
|
1483
1881
|
checked: isSelected,
|
|
@@ -1486,25 +1884,25 @@ function SCAutocomplete({
|
|
|
1486
1884
|
color: "primary"
|
|
1487
1885
|
}
|
|
1488
1886
|
) : "",
|
|
1489
|
-
/* @__PURE__ */
|
|
1887
|
+
/* @__PURE__ */ React11.createElement(ListItemText2, { primary: getItemValue(option).text, color: "text.primary" }),
|
|
1490
1888
|
getItemValue(option).component != void 0 ? getItemValue(option).component : ""
|
|
1491
1889
|
)));
|
|
1492
1890
|
},
|
|
1493
|
-
renderInput: (params) => /* @__PURE__ */
|
|
1891
|
+
renderInput: (params) => /* @__PURE__ */ React11.createElement(React11.Fragment, null, /* @__PURE__ */ React11.createElement(
|
|
1494
1892
|
TextField3,
|
|
1495
1893
|
__spreadProps(__spreadValues({}, params), {
|
|
1496
|
-
label: required ? /* @__PURE__ */
|
|
1894
|
+
label: required ? /* @__PURE__ */ React11.createElement("span", { dangerouslySetInnerHTML: { __html: labelContent } }) : label,
|
|
1497
1895
|
placeholder: selectedOptions.length == 0 ? "B\xFAsqueda" : "",
|
|
1498
1896
|
InputProps: __spreadProps(__spreadValues({}, params.InputProps), {
|
|
1499
|
-
endAdornment: /* @__PURE__ */
|
|
1897
|
+
endAdornment: /* @__PURE__ */ React11.createElement(React11.Fragment, null, deleteType == "icon" && (state.hiddenValue.toString() != "-1" && state.hiddenValue.toString() != "") ? /* @__PURE__ */ React11.createElement(IconButton7, { size: "small", onClick: cleanOptions, sx: { marginLeft: "auto", textAlign: "right", padding: "0px" } }, /* @__PURE__ */ React11.createElement(Clear, { fontSize: "small" })) : "", /* @__PURE__ */ React11.createElement(InputAdornment3, { style: { zIndex: 1, position: "relative" }, position: "end" }, /* @__PURE__ */ React11.createElement(Search, { fontSize: "small", color: "action", style: { cursor: "pointer" } })))
|
|
1500
1898
|
})
|
|
1501
1899
|
})
|
|
1502
1900
|
)),
|
|
1503
1901
|
slotProps: {
|
|
1504
1902
|
listbox: {
|
|
1505
|
-
component:
|
|
1506
|
-
return /* @__PURE__ */
|
|
1507
|
-
|
|
1903
|
+
component: React11.forwardRef(function ListboxComponent(props, ref) {
|
|
1904
|
+
return /* @__PURE__ */ React11.createElement(React11.Fragment, null, /* @__PURE__ */ React11.createElement(
|
|
1905
|
+
Box8,
|
|
1508
1906
|
__spreadProps(__spreadValues({
|
|
1509
1907
|
ref
|
|
1510
1908
|
}, props), {
|
|
@@ -1514,9 +1912,9 @@ function SCAutocomplete({
|
|
|
1514
1912
|
backgroundColor: "white"
|
|
1515
1913
|
}, props.sx)
|
|
1516
1914
|
}),
|
|
1517
|
-
checkMassive && typeFormat == "multiselect" ? /* @__PURE__ */
|
|
1915
|
+
checkMassive && typeFormat == "multiselect" ? /* @__PURE__ */ React11.createElement(React11.Fragment, null, /* @__PURE__ */ React11.createElement(FormControlLabel2, { control: /* @__PURE__ */ React11.createElement(Checkbox, { checked: allSelected, indeterminate: selectedOptions.length > 0 && selectedOptions.length < data.length, onChange: handleCheckAll, color: "primary" }), label: "Todos los items", sx: { marginLeft: "0px !important", marginRight: "0px !important", padding: "7px 16px" } }), /* @__PURE__ */ React11.createElement(Divider3, null)) : "",
|
|
1518
1916
|
props.children,
|
|
1519
|
-
deleteType == "button" || fnAplicar ? /* @__PURE__ */
|
|
1917
|
+
deleteType == "button" || fnAplicar ? /* @__PURE__ */ React11.createElement(
|
|
1520
1918
|
Grid3,
|
|
1521
1919
|
{
|
|
1522
1920
|
container: true,
|
|
@@ -1531,8 +1929,8 @@ function SCAutocomplete({
|
|
|
1531
1929
|
justifyContent: "space-between"
|
|
1532
1930
|
}
|
|
1533
1931
|
},
|
|
1534
|
-
deleteType == "button" ? /* @__PURE__ */
|
|
1535
|
-
|
|
1932
|
+
deleteType == "button" ? /* @__PURE__ */ React11.createElement(
|
|
1933
|
+
Button6,
|
|
1536
1934
|
{
|
|
1537
1935
|
variant: "text",
|
|
1538
1936
|
color: "primary",
|
|
@@ -1544,8 +1942,8 @@ function SCAutocomplete({
|
|
|
1544
1942
|
},
|
|
1545
1943
|
"Limpiar"
|
|
1546
1944
|
) : "",
|
|
1547
|
-
fnAplicar && /* @__PURE__ */
|
|
1548
|
-
|
|
1945
|
+
fnAplicar && /* @__PURE__ */ React11.createElement(
|
|
1946
|
+
Button6,
|
|
1549
1947
|
{
|
|
1550
1948
|
variant: "contained",
|
|
1551
1949
|
color: "primary",
|
|
@@ -1564,8 +1962,8 @@ function SCAutocomplete({
|
|
|
1564
1962
|
}
|
|
1565
1963
|
|
|
1566
1964
|
// src/Components/SCDateRange.tsx
|
|
1567
|
-
import
|
|
1568
|
-
import { Box as
|
|
1965
|
+
import React12 from "react";
|
|
1966
|
+
import { Box as Box9, InputAdornment as InputAdornment4 } from "@mui/material";
|
|
1569
1967
|
import { LocalizationProvider } from "@mui/x-date-pickers/LocalizationProvider";
|
|
1570
1968
|
import { AdapterDayjs } from "@mui/x-date-pickers/AdapterDayjs";
|
|
1571
1969
|
import { DateRangePicker } from "@mui/x-date-pickers-pro/DateRangePicker";
|
|
@@ -1596,7 +1994,7 @@ var SCDateRange = ({
|
|
|
1596
1994
|
];
|
|
1597
1995
|
setState(convertedValue);
|
|
1598
1996
|
};
|
|
1599
|
-
return /* @__PURE__ */
|
|
1997
|
+
return /* @__PURE__ */ React12.createElement(LocalizationProvider, { dateAdapter: AdapterDayjs, adapterLocale: "es" }, /* @__PURE__ */ React12.createElement(Box9, { sx: { width: "100%" } }, /* @__PURE__ */ React12.createElement(
|
|
1600
1998
|
DateRangePicker,
|
|
1601
1999
|
{
|
|
1602
2000
|
value: state,
|
|
@@ -1615,7 +2013,7 @@ var SCDateRange = ({
|
|
|
1615
2013
|
required,
|
|
1616
2014
|
error: position === "start" ? isStartEmpty : isEndEmpty,
|
|
1617
2015
|
InputProps: {
|
|
1618
|
-
endAdornment: /* @__PURE__ */
|
|
2016
|
+
endAdornment: /* @__PURE__ */ React12.createElement(InputAdornment4, { position: "end" }, /* @__PURE__ */ React12.createElement(
|
|
1619
2017
|
EventIcon,
|
|
1620
2018
|
{
|
|
1621
2019
|
color: hasError ? "error" : "action",
|
|
@@ -1646,367 +2044,17 @@ var SCDateRange = ({
|
|
|
1646
2044
|
)));
|
|
1647
2045
|
};
|
|
1648
2046
|
|
|
1649
|
-
// src/Components/Drawer/
|
|
1650
|
-
|
|
1651
|
-
|
|
1652
|
-
|
|
1653
|
-
|
|
1654
|
-
|
|
1655
|
-
|
|
1656
|
-
}
|
|
1657
|
-
|
|
1658
|
-
// src/Components/Drawer/Helpers/validateInput.tsx
|
|
1659
|
-
var validateInputs = (arrayElements, onError, onSuccess, setChipFilters, setTextFilters) => {
|
|
1660
|
-
var _a, _b;
|
|
1661
|
-
let requiredValues = 0;
|
|
1662
|
-
let filledValues = 0;
|
|
1663
|
-
for (let i = 0; i < arrayElements.length; i++) {
|
|
1664
|
-
const element = arrayElements[i];
|
|
1665
|
-
const { validation, element: typeElement } = validateTypeElements(element);
|
|
1666
|
-
const textValue = ((_a = typeElement.state) == null ? void 0 : _a.textValue) !== void 0 ? String((_b = typeElement.state) == null ? void 0 : _b.textValue) : String(typeElement.state);
|
|
1667
|
-
if (typeElement == null ? void 0 : typeElement.required) {
|
|
1668
|
-
requiredValues++;
|
|
1669
|
-
if (textValue.trim() !== "" && textValue.trim() !== ",") {
|
|
1670
|
-
filledValues++;
|
|
1671
|
-
}
|
|
1672
|
-
}
|
|
1673
|
-
}
|
|
1674
|
-
if (requiredValues === filledValues) {
|
|
1675
|
-
onSuccess();
|
|
1676
|
-
setChipFilters(true);
|
|
1677
|
-
} else {
|
|
1678
|
-
onError({
|
|
1679
|
-
type: "error",
|
|
1680
|
-
title: "Algunos campos son requeridos",
|
|
1681
|
-
time: 10
|
|
1682
|
-
});
|
|
1683
|
-
setChipFilters(false);
|
|
1684
|
-
}
|
|
1685
|
-
};
|
|
1686
|
-
|
|
1687
|
-
// src/Components/Drawer/Helpers/validateTypeElement.tsx
|
|
1688
|
-
import React10 from "react";
|
|
1689
|
-
var validateTypeElements = (element) => {
|
|
1690
|
-
var _a;
|
|
1691
|
-
let validation = "";
|
|
1692
|
-
let typeElement = element;
|
|
1693
|
-
if (element.type == "textField") {
|
|
1694
|
-
validation = "textField";
|
|
1695
|
-
typeElement = element;
|
|
1696
|
-
} else if (React10.isValidElement(element == null ? void 0 : element.component) && element.component.type && element.component.type.name == "SCtextField") {
|
|
1697
|
-
validation = "textField";
|
|
1698
|
-
typeElement = element == null ? void 0 : element.component.props;
|
|
1699
|
-
} else if (element.type == "textArea") {
|
|
1700
|
-
validation = "textArea";
|
|
1701
|
-
typeElement = element;
|
|
1702
|
-
} else if (React10.isValidElement(element == null ? void 0 : element.component) && element.component.type && element.component.type.name == "SCtextArea") {
|
|
1703
|
-
validation = "textArea";
|
|
1704
|
-
typeElement = element == null ? void 0 : element.component.props;
|
|
1705
|
-
} else if (element.type == "dateRange") {
|
|
1706
|
-
validation = "dateRange";
|
|
1707
|
-
typeElement = element;
|
|
1708
|
-
} else if (React10.isValidElement(element == null ? void 0 : element.component) && element.component.type && element.component.type.name == "SCDateRange") {
|
|
1709
|
-
validation = "dateRange";
|
|
1710
|
-
typeElement = element == null ? void 0 : element.component.props;
|
|
1711
|
-
} else if (element.type == "autocomplete") {
|
|
1712
|
-
validation = "autocomplete";
|
|
1713
|
-
typeElement = element;
|
|
1714
|
-
} else if (React10.isValidElement(element == null ? void 0 : element.component) && element.component.type && element.component.type.name == "SCAutocomplete") {
|
|
1715
|
-
validation = "autocomplete";
|
|
1716
|
-
typeElement = element == null ? void 0 : element.component.props;
|
|
1717
|
-
} else if (element.typeFormat == "multiselect") {
|
|
1718
|
-
validation = "multiselect";
|
|
1719
|
-
typeElement = element;
|
|
1720
|
-
} else if (React10.isValidElement(element == null ? void 0 : element.component) && element.component.props && ((_a = element == null ? void 0 : element.component) == null ? void 0 : _a.props).typeFormat == "multiselect") {
|
|
1721
|
-
validation = "multiselect";
|
|
1722
|
-
typeElement = element == null ? void 0 : element.component.props;
|
|
1723
|
-
} else if (element.type == "select") {
|
|
1724
|
-
validation = "select";
|
|
1725
|
-
typeElement = element;
|
|
1726
|
-
} else if (React10.isValidElement(element == null ? void 0 : element.component) && element.component.type && element.component.type.name == "SCSelect") {
|
|
1727
|
-
validation = "select";
|
|
1728
|
-
typeElement = element == null ? void 0 : element.component.props;
|
|
1729
|
-
}
|
|
1730
|
-
return {
|
|
1731
|
-
validation,
|
|
1732
|
-
element: typeElement
|
|
1733
|
-
};
|
|
1734
|
-
};
|
|
1735
|
-
|
|
1736
|
-
// src/Components/Drawer/SCDrawer.tsx
|
|
1737
|
-
function SCDrawer({
|
|
1738
|
-
//informativas
|
|
1739
|
-
title,
|
|
1740
|
-
arrayElements = [],
|
|
1741
|
-
actions,
|
|
1742
|
-
buttonDrawer,
|
|
1743
|
-
//Apariencia
|
|
1744
|
-
colorTitle,
|
|
1745
|
-
anchor = "left",
|
|
1746
|
-
width,
|
|
1747
|
-
//Funcionales
|
|
1748
|
-
open,
|
|
1749
|
-
setOpen,
|
|
1750
|
-
chipFilters
|
|
1751
|
-
}) {
|
|
1752
|
-
var _a, _b;
|
|
1753
|
-
const scrollRef = useRef3(null);
|
|
1754
|
-
const [drawerOpen, setDrawerOpen] = React11.useState(open);
|
|
1755
|
-
const [toast, setToast] = React11.useState(null);
|
|
1756
|
-
const [stateChipFilters, setChipFilters] = React11.useState(false);
|
|
1757
|
-
const [textFilters, setTextFilters] = React11.useState([]);
|
|
1758
|
-
useEffect10(() => {
|
|
1759
|
-
if (chipFilters != void 0) {
|
|
1760
|
-
if (chipFilters.length > 0) {
|
|
1761
|
-
setTextFilters([]);
|
|
1762
|
-
inputValidation();
|
|
1763
|
-
}
|
|
1764
|
-
}
|
|
1765
|
-
}, [chipFilters]);
|
|
1766
|
-
useEffect10(() => {
|
|
1767
|
-
if (open) {
|
|
1768
|
-
toggleDrawer(true);
|
|
1769
|
-
} else {
|
|
1770
|
-
handleDrawerClose();
|
|
1771
|
-
}
|
|
1772
|
-
}, [open]);
|
|
1773
|
-
const handleDrawerClose = () => {
|
|
1774
|
-
setDrawerOpen(false);
|
|
1775
|
-
if (setOpen) {
|
|
1776
|
-
setOpen(false);
|
|
1777
|
-
}
|
|
1778
|
-
};
|
|
1779
|
-
const toggleDrawer = (newOpen) => () => {
|
|
1780
|
-
setDrawerOpen(newOpen);
|
|
1781
|
-
if (setOpen) {
|
|
1782
|
-
setOpen(true);
|
|
1783
|
-
}
|
|
1784
|
-
};
|
|
1785
|
-
const ButtonIcon = getIcon2(buttonDrawer == null ? void 0 : buttonDrawer.icon);
|
|
1786
|
-
const setToastWithDelay = (toastContent) => {
|
|
1787
|
-
setToast(null);
|
|
1788
|
-
setTimeout(() => {
|
|
1789
|
-
setToast(toastContent);
|
|
1790
|
-
}, 10);
|
|
1791
|
-
};
|
|
1792
|
-
const inputValidation = () => {
|
|
1793
|
-
var _a2, _b2, _c, _d;
|
|
1794
|
-
if (chipFilters != void 0 && chipFilters.length > 0) {
|
|
1795
|
-
if (chipFilters && chipFilters.length > 0) {
|
|
1796
|
-
arrayElements.forEach((arrayElement) => {
|
|
1797
|
-
var _a3, _b3, _c2;
|
|
1798
|
-
const { validation, element: typeElement } = validateTypeElements(arrayElement);
|
|
1799
|
-
let currentValue = "";
|
|
1800
|
-
if (validation === "dateRange") {
|
|
1801
|
-
if (typeElement.state && typeElement.state[0] && typeElement.state[1]) {
|
|
1802
|
-
currentValue = `${(_a3 = typeElement.state[0]) == null ? void 0 : _a3.format("DD/MM/YYYY")} - ${(_b3 = typeElement.state[1]) == null ? void 0 : _b3.format("DD/MM/YYYY")}`;
|
|
1803
|
-
}
|
|
1804
|
-
} else {
|
|
1805
|
-
currentValue = ((_c2 = typeElement.state) == null ? void 0 : _c2.textValue) !== void 0 ? String(typeElement.state.textValue).trim() : String(typeElement.state).trim();
|
|
1806
|
-
}
|
|
1807
|
-
chipFilters.forEach((chipFilter) => {
|
|
1808
|
-
const chipValue = String(chipFilter).trim();
|
|
1809
|
-
if (currentValue === chipValue && currentValue !== "" && currentValue !== ",") {
|
|
1810
|
-
setTextFilters((prevFilters) => {
|
|
1811
|
-
const newFilter = { value: currentValue, arrayElement: typeElement };
|
|
1812
|
-
const existingFilterIndex = prevFilters.findIndex(
|
|
1813
|
-
(filter) => filter.arrayElement.label === arrayElement.label
|
|
1814
|
-
);
|
|
1815
|
-
if (existingFilterIndex !== -1) {
|
|
1816
|
-
const updatedFilters = [...prevFilters];
|
|
1817
|
-
updatedFilters[existingFilterIndex] = newFilter;
|
|
1818
|
-
return updatedFilters;
|
|
1819
|
-
} else {
|
|
1820
|
-
return [...prevFilters, newFilter];
|
|
1821
|
-
}
|
|
1822
|
-
});
|
|
1823
|
-
}
|
|
1824
|
-
});
|
|
1825
|
-
});
|
|
1826
|
-
}
|
|
1827
|
-
} else {
|
|
1828
|
-
const newFiltersToAdd = [];
|
|
1829
|
-
for (let i = 0; i < arrayElements.length; i++) {
|
|
1830
|
-
const element = arrayElements[i];
|
|
1831
|
-
const { validation, element: typeElement } = validateTypeElements(element);
|
|
1832
|
-
const textValue = ((_a2 = typeElement.state) == null ? void 0 : _a2.textValue) !== void 0 ? String((_b2 = typeElement.state) == null ? void 0 : _b2.textValue) : String(typeElement.state);
|
|
1833
|
-
if (textValue.trim() !== "" && textValue.trim() !== ",") {
|
|
1834
|
-
let newFilter;
|
|
1835
|
-
switch (validation) {
|
|
1836
|
-
case "dateRange":
|
|
1837
|
-
const values = `${(_c = typeElement.state[0]) == null ? void 0 : _c.format("DD/MM/YYYY")} - ${(_d = typeElement.state[1]) == null ? void 0 : _d.format("DD/MM/YYYY")}`;
|
|
1838
|
-
newFilter = { value: values, arrayElement: typeElement };
|
|
1839
|
-
break;
|
|
1840
|
-
default:
|
|
1841
|
-
newFilter = { value: textValue, arrayElement: typeElement };
|
|
1842
|
-
break;
|
|
1843
|
-
}
|
|
1844
|
-
const existingFilterByLabel = newFiltersToAdd.find(
|
|
1845
|
-
(filter) => filter.arrayElement.label === element.label
|
|
1846
|
-
);
|
|
1847
|
-
if (existingFilterByLabel) {
|
|
1848
|
-
existingFilterByLabel.value = newFilter.value;
|
|
1849
|
-
existingFilterByLabel.arrayElement = newFilter.arrayElement;
|
|
1850
|
-
} else {
|
|
1851
|
-
newFiltersToAdd.push(newFilter);
|
|
1852
|
-
}
|
|
1853
|
-
}
|
|
1854
|
-
}
|
|
1855
|
-
setTextFilters((prevFilters) => {
|
|
1856
|
-
let updatedFilters = [...prevFilters];
|
|
1857
|
-
newFiltersToAdd.forEach((newFilter) => {
|
|
1858
|
-
const existingFilterIndex = updatedFilters.findIndex(
|
|
1859
|
-
(filter) => filter.arrayElement.label === newFilter.arrayElement.label
|
|
1860
|
-
);
|
|
1861
|
-
if (existingFilterIndex !== -1) {
|
|
1862
|
-
updatedFilters[existingFilterIndex] = newFilter;
|
|
1863
|
-
} else {
|
|
1864
|
-
updatedFilters.push(newFilter);
|
|
1865
|
-
}
|
|
1866
|
-
});
|
|
1867
|
-
return updatedFilters;
|
|
1868
|
-
});
|
|
1869
|
-
validateInputs(arrayElements, setToastWithDelay, handleDrawerClose, setChipFilters, setTextFilters);
|
|
1870
|
-
}
|
|
1871
|
-
};
|
|
1872
|
-
const resetElementByType = (originalElement, validation, typeElement) => {
|
|
1873
|
-
let defaultValue;
|
|
1874
|
-
switch (validation) {
|
|
2047
|
+
// src/Components/Drawer/components/DrawerContent.tsx
|
|
2048
|
+
var DrawerContent = ({ arrayElements }) => {
|
|
2049
|
+
const renderElement = (arrayElement, index) => {
|
|
2050
|
+
var _a, _b, _c, _d, _e, _f;
|
|
2051
|
+
const key = `Stack_${(_a = arrayElement.type) != null ? _a : ""} ${(_b = arrayElement.label) != null ? _b : ""}${index}`;
|
|
2052
|
+
if (arrayElement.component) {
|
|
2053
|
+
return /* @__PURE__ */ React13.createElement(Stack5, { direction: "row", alignItems: "left", gap: 1 }, arrayElement.component);
|
|
2054
|
+
}
|
|
2055
|
+
switch (arrayElement.type) {
|
|
1875
2056
|
case "textField":
|
|
1876
|
-
|
|
1877
|
-
defaultValue = "";
|
|
1878
|
-
break;
|
|
1879
|
-
case "dateRange":
|
|
1880
|
-
defaultValue = [null, null];
|
|
1881
|
-
break;
|
|
1882
|
-
case "multiselect":
|
|
1883
|
-
defaultValue = { hiddenValue: [], textValue: [] };
|
|
1884
|
-
break;
|
|
1885
|
-
default:
|
|
1886
|
-
defaultValue = { hiddenValue: "-1", textValue: "" };
|
|
1887
|
-
}
|
|
1888
|
-
if (typeElement.setState) {
|
|
1889
|
-
typeElement.setState(defaultValue);
|
|
1890
|
-
}
|
|
1891
|
-
};
|
|
1892
|
-
const cleanFilters = () => {
|
|
1893
|
-
arrayElements.forEach((element) => {
|
|
1894
|
-
const { validation, element: typeElement } = validateTypeElements(element);
|
|
1895
|
-
if (typeElement.setState) {
|
|
1896
|
-
resetElementByType(element, validation, typeElement);
|
|
1897
|
-
}
|
|
1898
|
-
});
|
|
1899
|
-
setTextFilters([]);
|
|
1900
|
-
};
|
|
1901
|
-
const deleteFilter = (element) => {
|
|
1902
|
-
const { validation, element: typeElement } = validateTypeElements(element);
|
|
1903
|
-
if (typeElement.setState && shouldShowChips == true) {
|
|
1904
|
-
resetElementByType(element, validation, typeElement);
|
|
1905
|
-
setTextFilters(
|
|
1906
|
-
(prevFilters) => prevFilters.filter((filter) => filter.arrayElement.label !== element.label)
|
|
1907
|
-
);
|
|
1908
|
-
}
|
|
1909
|
-
};
|
|
1910
|
-
const scroll = (offset) => {
|
|
1911
|
-
if (scrollRef.current) {
|
|
1912
|
-
scrollRef.current.scrollLeft += offset;
|
|
1913
|
-
}
|
|
1914
|
-
};
|
|
1915
|
-
const hasActiveFilters = () => {
|
|
1916
|
-
return arrayElements.some((arrayElement) => {
|
|
1917
|
-
const { validation, element: typeElement } = validateTypeElements(arrayElement);
|
|
1918
|
-
if (typeElement.state.textValue !== void 0) {
|
|
1919
|
-
return String(typeElement.state.textValue).trim() !== "";
|
|
1920
|
-
} else if (validation === "dateRange") {
|
|
1921
|
-
return typeElement.state && typeElement.state[0] !== null && typeElement.state[1] !== null;
|
|
1922
|
-
} else {
|
|
1923
|
-
return String(typeElement.state).trim() !== "" && String(typeElement.state).trim() !== ",";
|
|
1924
|
-
}
|
|
1925
|
-
});
|
|
1926
|
-
};
|
|
1927
|
-
const shouldShowChips = chipFilters != void 0 && chipFilters.length > 0 ? true : stateChipFilters === true && hasActiveFilters();
|
|
1928
|
-
const actionsA = actions == false ? false : actions != void 0 ? actions : [{ text: "Aplicar filtros", fn: inputValidation }, { text: "Limpiar filtros", fn: cleanFilters }];
|
|
1929
|
-
return /* @__PURE__ */ React11.createElement(React11.Fragment, null, toast && /* @__PURE__ */ React11.createElement(SCToastNotification, __spreadValues({}, toast)), /* @__PURE__ */ React11.createElement(Grid4, { container: true, justifyContent: "flex-start", flexWrap: "nowrap", alignItems: "center", sx: { width: "100%" } }, shouldShowChips && /* @__PURE__ */ React11.createElement(Box9, { display: "flex", alignItems: "center", sx: { maxWidth: "78%" } }, /* @__PURE__ */ React11.createElement(IconButton7, { onClick: () => scroll(-150), size: "small" }, /* @__PURE__ */ React11.createElement(ArrowBackIosIcon, { fontSize: "small" })), /* @__PURE__ */ React11.createElement(
|
|
1930
|
-
Box9,
|
|
1931
|
-
{
|
|
1932
|
-
ref: scrollRef,
|
|
1933
|
-
gap: 0.3,
|
|
1934
|
-
sx: {
|
|
1935
|
-
display: "flex",
|
|
1936
|
-
overflowX: "auto",
|
|
1937
|
-
scrollBehavior: "smooth",
|
|
1938
|
-
"&::-webkit-scrollbar": { display: "none" }
|
|
1939
|
-
}
|
|
1940
|
-
},
|
|
1941
|
-
textFilters == null ? void 0 : textFilters.map((chipData, index) => /* @__PURE__ */ React11.createElement(
|
|
1942
|
-
Chip2,
|
|
1943
|
-
__spreadProps(__spreadValues({
|
|
1944
|
-
key: index,
|
|
1945
|
-
label: chipData.value
|
|
1946
|
-
}, chipData.arrayElement.required == false || chipData.arrayElement.required == void 0 ? { onDelete: () => deleteFilter(chipData.arrayElement) } : {}), {
|
|
1947
|
-
color: "default",
|
|
1948
|
-
variant: "filled",
|
|
1949
|
-
size: "small",
|
|
1950
|
-
sx: {
|
|
1951
|
-
flexShrink: 0,
|
|
1952
|
-
minWidth: "auto"
|
|
1953
|
-
}
|
|
1954
|
-
})
|
|
1955
|
-
))
|
|
1956
|
-
), /* @__PURE__ */ React11.createElement(IconButton7, { onClick: () => scroll(150), size: "small" }, /* @__PURE__ */ React11.createElement(ArrowForwardIosIcon, { fontSize: "small" }))), (buttonDrawer == null ? void 0 : buttonDrawer.type) == "chip" ? /* @__PURE__ */ React11.createElement(
|
|
1957
|
-
Chip2,
|
|
1958
|
-
__spreadProps(__spreadValues({
|
|
1959
|
-
onClick: toggleDrawer(true),
|
|
1960
|
-
color: buttonDrawer == null ? void 0 : buttonDrawer.color,
|
|
1961
|
-
variant: (buttonDrawer == null ? void 0 : buttonDrawer.variant) == "contained" ? "filled" : "outlined",
|
|
1962
|
-
label: (_a = buttonDrawer == null ? void 0 : buttonDrawer.text) != null ? _a : "",
|
|
1963
|
-
icon: (buttonDrawer == null ? void 0 : buttonDrawer.iconPosition) === "left" && ButtonIcon ? /* @__PURE__ */ React11.createElement(ButtonIcon, { fontSize: "small" }) : void 0,
|
|
1964
|
-
deleteIcon: (buttonDrawer == null ? void 0 : buttonDrawer.iconPosition) === "right" && ButtonIcon ? /* @__PURE__ */ React11.createElement(ButtonIcon, { fontSize: "small" }) : void 0
|
|
1965
|
-
}, (buttonDrawer == null ? void 0 : buttonDrawer.iconPosition) === "right" && ButtonIcon ? { onDelete: () => {
|
|
1966
|
-
} } : {}), {
|
|
1967
|
-
sx: {
|
|
1968
|
-
"& .MuiChip-icon": {
|
|
1969
|
-
color: "inherit"
|
|
1970
|
-
},
|
|
1971
|
-
textTransform: "capitalize"
|
|
1972
|
-
}
|
|
1973
|
-
})
|
|
1974
|
-
) : /* @__PURE__ */ React11.createElement(
|
|
1975
|
-
Button6,
|
|
1976
|
-
{
|
|
1977
|
-
"data-testid": "test-buttonDrawer",
|
|
1978
|
-
sx: { textTransform: "capitalize" },
|
|
1979
|
-
color: buttonDrawer == null ? void 0 : buttonDrawer.color,
|
|
1980
|
-
onClick: toggleDrawer(true),
|
|
1981
|
-
size: "small",
|
|
1982
|
-
variant: (buttonDrawer == null ? void 0 : buttonDrawer.variant) != void 0 ? buttonDrawer == null ? void 0 : buttonDrawer.variant : "text",
|
|
1983
|
-
startIcon: ((buttonDrawer == null ? void 0 : buttonDrawer.iconPosition) === "left" || !(buttonDrawer == null ? void 0 : buttonDrawer.iconPosition)) && ButtonIcon ? /* @__PURE__ */ React11.createElement(ButtonIcon, { fontSize: "small" }) : null,
|
|
1984
|
-
endIcon: (buttonDrawer == null ? void 0 : buttonDrawer.iconPosition) === "right" && ButtonIcon ? /* @__PURE__ */ React11.createElement(ButtonIcon, { fontSize: "small" }) : null
|
|
1985
|
-
},
|
|
1986
|
-
(_b = buttonDrawer == null ? void 0 : buttonDrawer.text) != null ? _b : ""
|
|
1987
|
-
)), /* @__PURE__ */ React11.createElement(
|
|
1988
|
-
Drawer,
|
|
1989
|
-
{
|
|
1990
|
-
open: drawerOpen,
|
|
1991
|
-
onClose: toggleDrawer(false),
|
|
1992
|
-
anchor: anchor != null ? anchor : "left",
|
|
1993
|
-
sx: {
|
|
1994
|
-
"& .MuiDrawer-paper": {
|
|
1995
|
-
width: width != null ? width : "450px",
|
|
1996
|
-
boxSizing: "border-box",
|
|
1997
|
-
borderRadius: anchor !== "right" ? "0px 4px 4px 0px" : "4px 0px 0px 4px"
|
|
1998
|
-
}
|
|
1999
|
-
}
|
|
2000
|
-
},
|
|
2001
|
-
/* @__PURE__ */ React11.createElement(Stack5, { flexDirection: "column", height: "100%" }, /* @__PURE__ */ React11.createElement(Grid4, { container: true, sx: { backgroundColor: "primary.50", alignItems: "center", height: "42px", textAlign: "left", padding: "8px 12px", justifyContent: "space-between", alignContent: "center" } }, /* @__PURE__ */ React11.createElement(Typography9, { variant: "h6", color: colorTitle || "text.primary" }, title != null ? title : "Personaliza tu b\xFAsqueda"), /* @__PURE__ */ React11.createElement(IconButton7, { onClick: handleDrawerClose }, /* @__PURE__ */ React11.createElement(CloseIcon, { "data-testid": "test-button-close", sx: { color: "text.primary" } }))), /* @__PURE__ */ React11.createElement(Stack5, { alignItems: "flex-start", height: "100%", gap: "16px", flex: 1, overflow: "auto", padding: "16px" }, arrayElements == null ? void 0 : arrayElements.map((arrayElement, index) => {
|
|
2002
|
-
var _a2, _b2, _c, _d, _e, _f;
|
|
2003
|
-
return /* @__PURE__ */ React11.createElement(
|
|
2004
|
-
Box9,
|
|
2005
|
-
{
|
|
2006
|
-
key: `Stack_${(_a2 = arrayElement.type) != null ? _a2 : ""} ${(_b2 = arrayElement.label) != null ? _b2 : ""}${index}`,
|
|
2007
|
-
sx: { width: "100%" }
|
|
2008
|
-
},
|
|
2009
|
-
arrayElement.component ? /* @__PURE__ */ React11.createElement(Stack5, { direction: "row", alignItems: "left", gap: 1 }, arrayElement.component) : arrayElement.type === "textField" ? /* @__PURE__ */ React11.createElement(
|
|
2057
|
+
return /* @__PURE__ */ React13.createElement(
|
|
2010
2058
|
SCTextField,
|
|
2011
2059
|
{
|
|
2012
2060
|
title: arrayElement.title,
|
|
@@ -2032,7 +2080,9 @@ function SCDrawer({
|
|
|
2032
2080
|
onBlur: arrayElement.onBlur,
|
|
2033
2081
|
onKeyDown: arrayElement.onKeyDown
|
|
2034
2082
|
}
|
|
2035
|
-
)
|
|
2083
|
+
);
|
|
2084
|
+
case "textArea":
|
|
2085
|
+
return /* @__PURE__ */ React13.createElement(
|
|
2036
2086
|
SCTextArea,
|
|
2037
2087
|
{
|
|
2038
2088
|
title: arrayElement.title,
|
|
@@ -2051,7 +2101,9 @@ function SCDrawer({
|
|
|
2051
2101
|
state: arrayElement.state || "",
|
|
2052
2102
|
onBlur: arrayElement.onBlur
|
|
2053
2103
|
}
|
|
2054
|
-
)
|
|
2104
|
+
);
|
|
2105
|
+
case "autocomplete":
|
|
2106
|
+
return /* @__PURE__ */ React13.createElement(
|
|
2055
2107
|
SCAutocomplete,
|
|
2056
2108
|
{
|
|
2057
2109
|
label: arrayElement.label,
|
|
@@ -2069,7 +2121,9 @@ function SCDrawer({
|
|
|
2069
2121
|
state: arrayElement.state || "",
|
|
2070
2122
|
inputChange: arrayElement.inputChange
|
|
2071
2123
|
}
|
|
2072
|
-
)
|
|
2124
|
+
);
|
|
2125
|
+
case "select":
|
|
2126
|
+
return /* @__PURE__ */ React13.createElement(
|
|
2073
2127
|
SCSelect,
|
|
2074
2128
|
{
|
|
2075
2129
|
label: arrayElement.label,
|
|
@@ -2085,7 +2139,9 @@ function SCDrawer({
|
|
|
2085
2139
|
setState: arrayElement.setState,
|
|
2086
2140
|
state: arrayElement.state || ""
|
|
2087
2141
|
}
|
|
2088
|
-
)
|
|
2142
|
+
);
|
|
2143
|
+
case "dateRange":
|
|
2144
|
+
return /* @__PURE__ */ React13.createElement(
|
|
2089
2145
|
SCDateRange,
|
|
2090
2146
|
{
|
|
2091
2147
|
labelDateInitial: arrayElement.labelDateInitial,
|
|
@@ -2096,92 +2152,247 @@ function SCDrawer({
|
|
|
2096
2152
|
state: arrayElement.state || [],
|
|
2097
2153
|
setState: arrayElement.setState
|
|
2098
2154
|
}
|
|
2099
|
-
)
|
|
2100
|
-
|
|
2101
|
-
|
|
2102
|
-
|
|
2155
|
+
);
|
|
2156
|
+
default:
|
|
2157
|
+
return null;
|
|
2158
|
+
}
|
|
2159
|
+
};
|
|
2160
|
+
return /* @__PURE__ */ React13.createElement(Stack5, { alignItems: "flex-start", height: "100%", gap: "16px", flex: 1, overflow: "auto", padding: "16px" }, arrayElements == null ? void 0 : arrayElements.map((arrayElement, index) => {
|
|
2161
|
+
var _a, _b;
|
|
2162
|
+
return /* @__PURE__ */ React13.createElement(
|
|
2163
|
+
Box10,
|
|
2164
|
+
{
|
|
2165
|
+
key: `Stack_${(_a = arrayElement.type) != null ? _a : ""} ${(_b = arrayElement.label) != null ? _b : ""}${index}`,
|
|
2166
|
+
sx: { width: "100%" }
|
|
2167
|
+
},
|
|
2168
|
+
renderElement(arrayElement, index)
|
|
2169
|
+
);
|
|
2170
|
+
}));
|
|
2171
|
+
};
|
|
2172
|
+
|
|
2173
|
+
// src/Components/Drawer/components/DrawerActions.tsx
|
|
2174
|
+
import React14 from "react";
|
|
2175
|
+
import { Button as Button7 } from "@mui/material";
|
|
2176
|
+
import Grid4 from "@mui/material/Grid2";
|
|
2177
|
+
var DrawerActions = ({ actions, anchor }) => {
|
|
2178
|
+
if (actions === false || actions === void 0) {
|
|
2179
|
+
return null;
|
|
2180
|
+
}
|
|
2181
|
+
if (!Array.isArray(actions) || actions.length === 0) {
|
|
2182
|
+
return null;
|
|
2183
|
+
}
|
|
2184
|
+
return /* @__PURE__ */ React14.createElement(
|
|
2185
|
+
Grid4,
|
|
2186
|
+
{
|
|
2187
|
+
sx: { borderTop: 1, borderColor: "#1018403B" },
|
|
2188
|
+
container: true,
|
|
2189
|
+
gap: 2,
|
|
2190
|
+
padding: "8px 12px",
|
|
2191
|
+
height: "42px",
|
|
2192
|
+
alignItems: "center",
|
|
2193
|
+
justifyContent: actions.length > 1 ? "space-between" : anchor !== "right" ? "flex-end" : "flex-start",
|
|
2194
|
+
flexDirection: anchor !== "right" ? "row-reverse" : "row"
|
|
2195
|
+
},
|
|
2196
|
+
actions.map((btn, index) => /* @__PURE__ */ React14.createElement(
|
|
2197
|
+
Button7,
|
|
2103
2198
|
{
|
|
2104
|
-
|
|
2105
|
-
|
|
2106
|
-
|
|
2107
|
-
|
|
2108
|
-
|
|
2109
|
-
|
|
2110
|
-
justifyContent: actionsA.length > 1 ? "space-between" : !anchor && anchor != "right" ? "flex-end" : "flex-start",
|
|
2111
|
-
flexDirection: anchor != "right" ? "row-reverse" : "row"
|
|
2199
|
+
key: index,
|
|
2200
|
+
variant: index === 0 || actions.length < 2 ? "contained" : "text",
|
|
2201
|
+
color: "primary",
|
|
2202
|
+
onClick: btn.fn,
|
|
2203
|
+
disabled: btn.disabled || false,
|
|
2204
|
+
size: "small"
|
|
2112
2205
|
},
|
|
2113
|
-
|
|
2114
|
-
|
|
2115
|
-
|
|
2116
|
-
|
|
2117
|
-
|
|
2118
|
-
|
|
2119
|
-
|
|
2120
|
-
|
|
2121
|
-
|
|
2122
|
-
|
|
2123
|
-
|
|
2124
|
-
|
|
2125
|
-
|
|
2206
|
+
btn.text
|
|
2207
|
+
))
|
|
2208
|
+
);
|
|
2209
|
+
};
|
|
2210
|
+
|
|
2211
|
+
// src/Components/Drawer/components/DrawerHeader.tsx
|
|
2212
|
+
import React15 from "react";
|
|
2213
|
+
import { Typography as Typography9, IconButton as IconButton8 } from "@mui/material";
|
|
2214
|
+
import Grid5 from "@mui/material/Grid2";
|
|
2215
|
+
import CloseIcon from "@mui/icons-material/Close";
|
|
2216
|
+
var DrawerHeader = ({
|
|
2217
|
+
title,
|
|
2218
|
+
colorTitle,
|
|
2219
|
+
onClose
|
|
2220
|
+
}) => {
|
|
2221
|
+
return /* @__PURE__ */ React15.createElement(
|
|
2222
|
+
Grid5,
|
|
2223
|
+
{
|
|
2224
|
+
container: true,
|
|
2225
|
+
sx: {
|
|
2226
|
+
backgroundColor: "primary.50",
|
|
2227
|
+
alignItems: "center",
|
|
2228
|
+
height: "42px",
|
|
2229
|
+
textAlign: "left",
|
|
2230
|
+
padding: "8px 12px",
|
|
2231
|
+
justifyContent: "space-between",
|
|
2232
|
+
alignContent: "center"
|
|
2233
|
+
}
|
|
2234
|
+
},
|
|
2235
|
+
/* @__PURE__ */ React15.createElement(Typography9, { variant: "h6", color: colorTitle || "text.primary" }, title != null ? title : "Personaliza tu b\xFAsqueda"),
|
|
2236
|
+
/* @__PURE__ */ React15.createElement(IconButton8, { onClick: onClose }, /* @__PURE__ */ React15.createElement(CloseIcon, { "data-testid": "test-button-close", sx: { color: "text.primary" } }))
|
|
2237
|
+
);
|
|
2238
|
+
};
|
|
2239
|
+
|
|
2240
|
+
// src/Components/Drawer/SCDrawer.tsx
|
|
2241
|
+
function SCDrawer({
|
|
2242
|
+
title,
|
|
2243
|
+
arrayElements = [],
|
|
2244
|
+
actions,
|
|
2245
|
+
buttonDrawer,
|
|
2246
|
+
colorTitle,
|
|
2247
|
+
anchor = "left",
|
|
2248
|
+
width,
|
|
2249
|
+
open,
|
|
2250
|
+
setOpen,
|
|
2251
|
+
chipFilters
|
|
2252
|
+
}) {
|
|
2253
|
+
const { drawerOpen, handleDrawerClose, toggleDrawer } = useDrawerState({ open, setOpen });
|
|
2254
|
+
const { toast, setToastWithDelay } = useToast();
|
|
2255
|
+
const {
|
|
2256
|
+
stateChipFilters,
|
|
2257
|
+
setChipFilters,
|
|
2258
|
+
textFilters,
|
|
2259
|
+
setTextFilters,
|
|
2260
|
+
shouldShowChips,
|
|
2261
|
+
processChipFilters
|
|
2262
|
+
} = useChipFilters(arrayElements, chipFilters);
|
|
2263
|
+
const handleInputValidation = () => {
|
|
2264
|
+
if (chipFilters == null ? void 0 : chipFilters.length) {
|
|
2265
|
+
processChipFilters();
|
|
2266
|
+
} else {
|
|
2267
|
+
processChipFilters();
|
|
2268
|
+
validateInputs(
|
|
2269
|
+
arrayElements,
|
|
2270
|
+
setToastWithDelay,
|
|
2271
|
+
handleDrawerClose,
|
|
2272
|
+
setChipFilters,
|
|
2273
|
+
setTextFilters
|
|
2274
|
+
);
|
|
2275
|
+
}
|
|
2276
|
+
};
|
|
2277
|
+
const handleCleanFilters = () => {
|
|
2278
|
+
cleanAllFilters(arrayElements, setTextFilters);
|
|
2279
|
+
};
|
|
2280
|
+
const handleDeleteFilter = (element) => {
|
|
2281
|
+
deleteFilter(element, shouldShowChips, setTextFilters);
|
|
2282
|
+
};
|
|
2283
|
+
const getActions = () => {
|
|
2284
|
+
if (actions === false) return false;
|
|
2285
|
+
if (actions !== void 0) return actions;
|
|
2286
|
+
return [
|
|
2287
|
+
{ text: "Aplicar filtros", fn: handleInputValidation },
|
|
2288
|
+
{ text: "Limpiar filtros", fn: handleCleanFilters }
|
|
2289
|
+
];
|
|
2290
|
+
};
|
|
2291
|
+
const drawerActions = getActions();
|
|
2292
|
+
return /* @__PURE__ */ React16.createElement(React16.Fragment, null, toast && /* @__PURE__ */ React16.createElement(SCToastNotification, __spreadValues({}, toast)), /* @__PURE__ */ React16.createElement(
|
|
2293
|
+
Grid6,
|
|
2294
|
+
{
|
|
2295
|
+
container: true,
|
|
2296
|
+
justifyContent: "flex-start",
|
|
2297
|
+
flexWrap: "nowrap",
|
|
2298
|
+
alignItems: "center",
|
|
2299
|
+
sx: { width: "100%" }
|
|
2300
|
+
},
|
|
2301
|
+
shouldShowChips && /* @__PURE__ */ React16.createElement(
|
|
2302
|
+
ChipFiltersDisplay,
|
|
2303
|
+
{
|
|
2304
|
+
textFilters,
|
|
2305
|
+
onDeleteFilter: handleDeleteFilter
|
|
2306
|
+
}
|
|
2307
|
+
),
|
|
2308
|
+
/* @__PURE__ */ React16.createElement(
|
|
2309
|
+
DrawerButton,
|
|
2310
|
+
{
|
|
2311
|
+
buttonDrawer,
|
|
2312
|
+
onToggle: toggleDrawer(true)
|
|
2313
|
+
}
|
|
2314
|
+
)
|
|
2315
|
+
), /* @__PURE__ */ React16.createElement(
|
|
2316
|
+
Drawer,
|
|
2317
|
+
{
|
|
2318
|
+
open: drawerOpen,
|
|
2319
|
+
onClose: toggleDrawer(false),
|
|
2320
|
+
anchor,
|
|
2321
|
+
sx: {
|
|
2322
|
+
"& .MuiDrawer-paper": {
|
|
2323
|
+
width: width != null ? width : "450px",
|
|
2324
|
+
boxSizing: "border-box",
|
|
2325
|
+
borderRadius: anchor !== "right" ? "0px 4px 4px 0px" : "4px 0px 0px 4px"
|
|
2326
|
+
}
|
|
2327
|
+
}
|
|
2328
|
+
},
|
|
2329
|
+
/* @__PURE__ */ React16.createElement(Stack6, { flexDirection: "column", height: "100%" }, /* @__PURE__ */ React16.createElement(
|
|
2330
|
+
DrawerHeader,
|
|
2331
|
+
{
|
|
2332
|
+
title,
|
|
2333
|
+
colorTitle,
|
|
2334
|
+
onClose: handleDrawerClose
|
|
2335
|
+
}
|
|
2336
|
+
), /* @__PURE__ */ React16.createElement(DrawerContent, { arrayElements }), /* @__PURE__ */ React16.createElement(DrawerActions, { actions: drawerActions, anchor }))
|
|
2126
2337
|
));
|
|
2127
2338
|
}
|
|
2128
2339
|
|
|
2129
2340
|
// src/Components/FooterAction/FooterAction.tsx
|
|
2130
|
-
import
|
|
2131
|
-
import { AppBar, Toolbar, Box as
|
|
2341
|
+
import React17 from "react";
|
|
2342
|
+
import { AppBar, Toolbar, Box as Box11, Typography as Typography10 } from "@mui/material";
|
|
2132
2343
|
var FooterAction = ({
|
|
2133
2344
|
leftContent,
|
|
2134
2345
|
rightContent,
|
|
2135
2346
|
label,
|
|
2136
2347
|
variant
|
|
2137
2348
|
}) => {
|
|
2138
|
-
return /* @__PURE__ */
|
|
2349
|
+
return /* @__PURE__ */ React17.createElement(
|
|
2139
2350
|
AppBar,
|
|
2140
2351
|
{
|
|
2141
2352
|
color: "inherit",
|
|
2142
2353
|
sx: { position: variant == "float" ? "relative" : "fixed", left: 0, right: "auto", width: "100%", top: "auto", bottom: 0 }
|
|
2143
2354
|
},
|
|
2144
|
-
/* @__PURE__ */
|
|
2355
|
+
/* @__PURE__ */ React17.createElement(
|
|
2145
2356
|
Toolbar,
|
|
2146
2357
|
{
|
|
2147
2358
|
id: "footer-toolbar",
|
|
2148
2359
|
sx: { gap: 1.5, minHeight: "50px !important" }
|
|
2149
2360
|
},
|
|
2150
2361
|
leftContent,
|
|
2151
|
-
/* @__PURE__ */
|
|
2152
|
-
label && /* @__PURE__ */
|
|
2362
|
+
/* @__PURE__ */ React17.createElement(Box11, { flexGrow: 1 }),
|
|
2363
|
+
label && /* @__PURE__ */ React17.createElement(Typography10, { variant: "body2", color: "text.secondary" }, label),
|
|
2153
2364
|
rightContent
|
|
2154
2365
|
)
|
|
2155
2366
|
);
|
|
2156
2367
|
};
|
|
2157
2368
|
|
|
2158
2369
|
// src/Components/MultiSelect/MultiSelect.tsx
|
|
2159
|
-
import
|
|
2160
|
-
import { Button as
|
|
2370
|
+
import React18, { useEffect as useEffect12, useMemo as useMemo4 } from "react";
|
|
2371
|
+
import { Button as Button8, Checkbox as Checkbox2, FormControl as FormControl3, InputAdornment as InputAdornment5, ListItemIcon as ListItemIcon3, MenuItem as MenuItem3, Popover as Popover3, Stack as Stack7, TextField as TextField4 } from "@mui/material";
|
|
2161
2372
|
import { SearchOutlined } from "@mui/icons-material";
|
|
2162
2373
|
|
|
2163
2374
|
// src/Components/MultiSelect/helpers/useHandlers.tsx
|
|
2164
|
-
import { useCallback as
|
|
2375
|
+
import { useCallback as useCallback3, useState as useState10 } from "react";
|
|
2165
2376
|
function useMultiSelectHandlers() {
|
|
2166
|
-
const [anchorEl, setAnchorEl] =
|
|
2167
|
-
const [open, setOpen] =
|
|
2168
|
-
const [selectedItems, setSelectedItems] =
|
|
2169
|
-
const [filterValue, setFilterValue] =
|
|
2170
|
-
const handleOpen =
|
|
2377
|
+
const [anchorEl, setAnchorEl] = useState10(null);
|
|
2378
|
+
const [open, setOpen] = useState10(false);
|
|
2379
|
+
const [selectedItems, setSelectedItems] = useState10([]);
|
|
2380
|
+
const [filterValue, setFilterValue] = useState10("");
|
|
2381
|
+
const handleOpen = useCallback3((e) => {
|
|
2171
2382
|
setAnchorEl(e.currentTarget);
|
|
2172
2383
|
setOpen(true);
|
|
2173
2384
|
}, []);
|
|
2174
|
-
const handleClose =
|
|
2385
|
+
const handleClose = useCallback3(() => {
|
|
2175
2386
|
setAnchorEl(null);
|
|
2176
2387
|
setOpen(false);
|
|
2177
2388
|
}, []);
|
|
2178
|
-
const handleFilterChange =
|
|
2389
|
+
const handleFilterChange = useCallback3(
|
|
2179
2390
|
(e) => {
|
|
2180
2391
|
setFilterValue(e.target.value);
|
|
2181
2392
|
},
|
|
2182
2393
|
[]
|
|
2183
2394
|
);
|
|
2184
|
-
const handleCheckboxToggle =
|
|
2395
|
+
const handleCheckboxToggle = useCallback3((item) => {
|
|
2185
2396
|
setSelectedItems(
|
|
2186
2397
|
(prev) => prev.includes(item) ? prev.filter((i) => i !== item) : [...prev, item]
|
|
2187
2398
|
);
|
|
@@ -2208,15 +2419,15 @@ function getIconMultiSelect(name) {
|
|
|
2208
2419
|
}
|
|
2209
2420
|
|
|
2210
2421
|
// src/Components/MultiSelect/helpers/useFilteredItems.tsx
|
|
2211
|
-
import { useMemo as
|
|
2422
|
+
import { useMemo as useMemo3 } from "react";
|
|
2212
2423
|
function useFilteredItems(items, filterValue, getItemLabel, selectedItems) {
|
|
2213
|
-
const filteredItems =
|
|
2424
|
+
const filteredItems = useMemo3(
|
|
2214
2425
|
() => items.filter(
|
|
2215
2426
|
(item) => getItemLabel(item).toLowerCase().includes(filterValue.toLowerCase())
|
|
2216
2427
|
),
|
|
2217
2428
|
[items, filterValue, getItemLabel]
|
|
2218
2429
|
);
|
|
2219
|
-
const sortedItems =
|
|
2430
|
+
const sortedItems = useMemo3(() => {
|
|
2220
2431
|
return [
|
|
2221
2432
|
...filteredItems.filter((item) => selectedItems.includes(item)),
|
|
2222
2433
|
...filteredItems.filter((item) => !selectedItems.includes(item))
|
|
@@ -2250,16 +2461,16 @@ function MultiSelect({
|
|
|
2250
2461
|
handleCheckboxToggle,
|
|
2251
2462
|
setOpen
|
|
2252
2463
|
} = useMultiSelectHandlers();
|
|
2253
|
-
|
|
2464
|
+
useEffect12(() => {
|
|
2254
2465
|
if (open !== void 0) {
|
|
2255
2466
|
setOpen(open);
|
|
2256
2467
|
}
|
|
2257
2468
|
}, [open, setOpen]);
|
|
2258
|
-
|
|
2469
|
+
useEffect12(() => {
|
|
2259
2470
|
setSelectedItems([]);
|
|
2260
2471
|
}, [items, setSelectedItems]);
|
|
2261
2472
|
const { filteredItems, sortedItems } = useFilteredItems(items, filterValue, getItemLabel, selectedItems);
|
|
2262
|
-
const Icon =
|
|
2473
|
+
const Icon = useMemo4(() => {
|
|
2263
2474
|
var _a2;
|
|
2264
2475
|
return getIconMultiSelect((_a2 = button == null ? void 0 : button.icon) != null ? _a2 : "FilterListOutlined");
|
|
2265
2476
|
}, [button == null ? void 0 : button.icon]);
|
|
@@ -2273,19 +2484,19 @@ function MultiSelect({
|
|
|
2273
2484
|
{ text: "Aplicar", fn: () => {
|
|
2274
2485
|
} }
|
|
2275
2486
|
];
|
|
2276
|
-
return /* @__PURE__ */
|
|
2277
|
-
|
|
2487
|
+
return /* @__PURE__ */ React18.createElement(React18.Fragment, null, /* @__PURE__ */ React18.createElement(
|
|
2488
|
+
Button8,
|
|
2278
2489
|
{
|
|
2279
2490
|
"test-id": "multiselect-button",
|
|
2280
2491
|
color: (_a = button == null ? void 0 : button.color) != null ? _a : "primary",
|
|
2281
2492
|
onClick: handleOpen,
|
|
2282
2493
|
variant: (_b = button == null ? void 0 : button.variant) != null ? _b : "text",
|
|
2283
2494
|
size: "small",
|
|
2284
|
-
startIcon: (button == null ? void 0 : button.iconPosition) === "left" || !(button == null ? void 0 : button.iconPosition) ? /* @__PURE__ */
|
|
2285
|
-
endIcon: (button == null ? void 0 : button.iconPosition) === "right" ? /* @__PURE__ */
|
|
2495
|
+
startIcon: (button == null ? void 0 : button.iconPosition) === "left" || !(button == null ? void 0 : button.iconPosition) ? /* @__PURE__ */ React18.createElement(Icon, null) : null,
|
|
2496
|
+
endIcon: (button == null ? void 0 : button.iconPosition) === "right" ? /* @__PURE__ */ React18.createElement(Icon, null) : null
|
|
2286
2497
|
},
|
|
2287
2498
|
capitalize(textButton != null ? textButton : "MultiSelect")
|
|
2288
|
-
), /* @__PURE__ */
|
|
2499
|
+
), /* @__PURE__ */ React18.createElement(
|
|
2289
2500
|
Popover3,
|
|
2290
2501
|
{
|
|
2291
2502
|
elevation: 8,
|
|
@@ -2294,7 +2505,7 @@ function MultiSelect({
|
|
|
2294
2505
|
open: openMultiselect,
|
|
2295
2506
|
onClose: () => setOpen(false)
|
|
2296
2507
|
},
|
|
2297
|
-
/* @__PURE__ */
|
|
2508
|
+
/* @__PURE__ */ React18.createElement(Stack7, { minWidth: "320px", "data-testid": "multiselect-container", bgcolor: "white", boxShadow: 3, borderRadius: 1 }, /* @__PURE__ */ React18.createElement(Stack7, { py: 1, px: 2 }, topPanel != null ? topPanel : /* @__PURE__ */ React18.createElement(FormControl3, { fullWidth: true, size: "small" }, /* @__PURE__ */ React18.createElement(
|
|
2298
2509
|
TextField4,
|
|
2299
2510
|
{
|
|
2300
2511
|
"data-testid": "multiselect-input",
|
|
@@ -2306,18 +2517,18 @@ function MultiSelect({
|
|
|
2306
2517
|
onChange: handleFilterChange,
|
|
2307
2518
|
slotProps: {
|
|
2308
2519
|
input: {
|
|
2309
|
-
endAdornment: /* @__PURE__ */
|
|
2520
|
+
endAdornment: /* @__PURE__ */ React18.createElement(InputAdornment5, { position: "end" }, /* @__PURE__ */ React18.createElement(SearchOutlined, { fontSize: "small" }))
|
|
2310
2521
|
}
|
|
2311
2522
|
}
|
|
2312
2523
|
}
|
|
2313
|
-
))), /* @__PURE__ */
|
|
2524
|
+
))), /* @__PURE__ */ React18.createElement(Stack7, { maxHeight: "300px", overflow: "auto" }, selectAll && /* @__PURE__ */ React18.createElement(MenuItem3, { dense, onClick: handleSelectAll }, /* @__PURE__ */ React18.createElement(ListItemIcon3, null, /* @__PURE__ */ React18.createElement(Checkbox2, { checked: allSelected, color: "primary" })), "Todos los items"), sortedItems.length > 0 ? sortedItems.map((item) => /* @__PURE__ */ React18.createElement(
|
|
2314
2525
|
MenuItem3,
|
|
2315
2526
|
{
|
|
2316
2527
|
key: getItemLabel(item),
|
|
2317
2528
|
dense,
|
|
2318
2529
|
onClick: () => handleCheckboxToggle(item)
|
|
2319
2530
|
},
|
|
2320
|
-
/* @__PURE__ */
|
|
2531
|
+
/* @__PURE__ */ React18.createElement(ListItemIcon3, null, /* @__PURE__ */ React18.createElement(
|
|
2321
2532
|
Checkbox2,
|
|
2322
2533
|
{
|
|
2323
2534
|
checked: selectedItems.includes(item),
|
|
@@ -2325,10 +2536,10 @@ function MultiSelect({
|
|
|
2325
2536
|
}
|
|
2326
2537
|
)),
|
|
2327
2538
|
getItemLabel(item)
|
|
2328
|
-
)) : /* @__PURE__ */
|
|
2539
|
+
)) : /* @__PURE__ */ React18.createElement(MenuItem3, { disabled: true }, "No se encontraron resultados")), /* @__PURE__ */ React18.createElement(Stack7, { direction: "row", gap: 1, p: 1, justifyContent: "space-between", bgcolor: "grey.50" }, resolvedActions.map((button2, index) => {
|
|
2329
2540
|
var _a2;
|
|
2330
|
-
return /* @__PURE__ */
|
|
2331
|
-
|
|
2541
|
+
return /* @__PURE__ */ React18.createElement(
|
|
2542
|
+
Button8,
|
|
2332
2543
|
{
|
|
2333
2544
|
key: index,
|
|
2334
2545
|
variant: index === 0 || resolvedActions.length < 2 ? "text" : "contained",
|
|
@@ -2343,8 +2554,8 @@ function MultiSelect({
|
|
|
2343
2554
|
}
|
|
2344
2555
|
|
|
2345
2556
|
// src/Components/PageHeader/PageHeader.tsx
|
|
2346
|
-
import
|
|
2347
|
-
import { Stack as
|
|
2557
|
+
import React19 from "react";
|
|
2558
|
+
import { Stack as Stack8, Typography as Typography11 } from "@mui/material";
|
|
2348
2559
|
var PageHeader = ({
|
|
2349
2560
|
title,
|
|
2350
2561
|
subtitle,
|
|
@@ -2353,8 +2564,8 @@ var PageHeader = ({
|
|
|
2353
2564
|
fixed,
|
|
2354
2565
|
shadow = true
|
|
2355
2566
|
}) => {
|
|
2356
|
-
return /* @__PURE__ */
|
|
2357
|
-
|
|
2567
|
+
return /* @__PURE__ */ React19.createElement(
|
|
2568
|
+
Stack8,
|
|
2358
2569
|
{
|
|
2359
2570
|
"data-testid": "main-container",
|
|
2360
2571
|
justifyContent: "center",
|
|
@@ -2365,14 +2576,14 @@ var PageHeader = ({
|
|
|
2365
2576
|
zIndex: 10,
|
|
2366
2577
|
sx: { boxShadow: shadow ? (theme) => theme.shadows[1] : "none" }
|
|
2367
2578
|
},
|
|
2368
|
-
/* @__PURE__ */
|
|
2579
|
+
/* @__PURE__ */ React19.createElement(Stack8, { "data-testid": "page-header-content", height: 40, px: 3, pl: buttonBack ? 1 : 3, direction: "row", alignItems: "center", justifyContent: "space-between" }, /* @__PURE__ */ React19.createElement(Stack8, { id: "left-section", direction: "row", alignItems: "center", gap: 1 }, buttonBack, /* @__PURE__ */ React19.createElement(Stack8, { id: "text-section", gap: 0.5 }, /* @__PURE__ */ React19.createElement(Typography11, { "data-testid": "page-header-title", variant: "h6", color: "text.primary" }, title), subtitle && /* @__PURE__ */ React19.createElement(Typography11, { "data-testid": "page-header-subtitle", variant: "caption", color: "text.primary" }, subtitle))), actions && /* @__PURE__ */ React19.createElement(Stack8, { id: "right-actions", direction: "row", alignItems: "center", gap: 1 }, actions))
|
|
2369
2580
|
);
|
|
2370
2581
|
};
|
|
2371
2582
|
|
|
2372
2583
|
// src/Components/SCCalendarSwipeable.tsx
|
|
2373
|
-
import
|
|
2374
|
-
import { Typography as Typography12, IconButton as
|
|
2375
|
-
import
|
|
2584
|
+
import React20, { useState as useState11 } from "react";
|
|
2585
|
+
import { Typography as Typography12, IconButton as IconButton9, Box as Box12 } from "@mui/material";
|
|
2586
|
+
import Grid7 from "@mui/material/Grid2";
|
|
2376
2587
|
import { AdapterDateFns } from "@mui/x-date-pickers/AdapterDateFns";
|
|
2377
2588
|
import { LocalizationProvider as LocalizationProvider2 } from "@mui/x-date-pickers/LocalizationProvider";
|
|
2378
2589
|
import { StaticDatePicker } from "@mui/x-date-pickers/StaticDatePicker";
|
|
@@ -2389,14 +2600,14 @@ var SCCalendarSwipeable = ({
|
|
|
2389
2600
|
state
|
|
2390
2601
|
}) => {
|
|
2391
2602
|
let convertFecha;
|
|
2392
|
-
const [fecha, setFecha] =
|
|
2393
|
-
const [fechaSeleccionada, setFechaSeleccionada] =
|
|
2394
|
-
const [stateVal, setstateVal] =
|
|
2395
|
-
const [openCalendar, setOpenCalendar] =
|
|
2603
|
+
const [fecha, setFecha] = useState11(/* @__PURE__ */ new Date());
|
|
2604
|
+
const [fechaSeleccionada, setFechaSeleccionada] = useState11();
|
|
2605
|
+
const [stateVal, setstateVal] = React20.useState(/* @__PURE__ */ new Date());
|
|
2606
|
+
const [openCalendar, setOpenCalendar] = React20.useState(false);
|
|
2396
2607
|
const hoy = /* @__PURE__ */ new Date();
|
|
2397
2608
|
const inicioSemana = startOfWeek(fecha, { weekStartsOn: 0 });
|
|
2398
2609
|
const diasSemana = Array.from({ length: 7 }, (_, i) => addDays(inicioSemana, i));
|
|
2399
|
-
|
|
2610
|
+
React20.useEffect(() => {
|
|
2400
2611
|
if (fecha != null) {
|
|
2401
2612
|
handleConvertFecha(fecha);
|
|
2402
2613
|
}
|
|
@@ -2415,8 +2626,8 @@ var SCCalendarSwipeable = ({
|
|
|
2415
2626
|
setOpenCalendar(newOpen);
|
|
2416
2627
|
};
|
|
2417
2628
|
const locale = __spreadValues({}, es);
|
|
2418
|
-
return /* @__PURE__ */
|
|
2419
|
-
|
|
2629
|
+
return /* @__PURE__ */ React20.createElement(React20.Fragment, null, /* @__PURE__ */ React20.createElement(LocalizationProvider2, { dateAdapter: AdapterDateFns, adapterLocale: locale }, openCalendar == false ? /* @__PURE__ */ React20.createElement(Box12, { "data-testid": "calendar-mobile", sx: { width: "100%", background: background ? background : "white", display: "flex", flexDirection: "column", alignItems: "center" } }, /* @__PURE__ */ React20.createElement(Box12, { sx: { width: "100%", maxWidth: "320px", background: "transparent" } }, /* @__PURE__ */ React20.createElement(Grid7, { container: true, gap: 0.5, sx: { justifyContent: "space-between", padding: "12px 0px", background: "transparent" } }, diasSemana.map((dia) => /* @__PURE__ */ React20.createElement(Grid7, { sx: { width: "36px" }, key: dia.toString() }, /* @__PURE__ */ React20.createElement(Box12, { sx: { width: "36px", height: "40px", display: "flex", alignItems: "center", justifyContent: "center" } }, /* @__PURE__ */ React20.createElement(Typography12, { sx: { fontSize: "12px !important", color: "#10184099" } }, format(dia, "EEEE", { locale: es }).charAt(0).toUpperCase())), /* @__PURE__ */ React20.createElement(
|
|
2630
|
+
Box12,
|
|
2420
2631
|
{
|
|
2421
2632
|
onClick: () => setFecha(dia),
|
|
2422
2633
|
sx: {
|
|
@@ -2431,8 +2642,8 @@ var SCCalendarSwipeable = ({
|
|
|
2431
2642
|
//height: '36px',
|
|
2432
2643
|
}
|
|
2433
2644
|
},
|
|
2434
|
-
/* @__PURE__ */
|
|
2435
|
-
)))), /* @__PURE__ */
|
|
2645
|
+
/* @__PURE__ */ React20.createElement(Typography12, { sx: { fontSize: "12px !important", color: isSameDay(dia, fecha) ? "white" : "#101840DE" } }, format(dia, "d"))
|
|
2646
|
+
)))), /* @__PURE__ */ React20.createElement(Grid7, { container: true, justifyContent: "center" }, /* @__PURE__ */ React20.createElement(IconButton9, { "data-testid": "open-calendar-button", onClick: toggleCalendar(true) }, /* @__PURE__ */ React20.createElement(KeyboardDoubleArrowDownIcon, null))))) : /* @__PURE__ */ React20.createElement(Box12, { sx: { width: "100%", background: "white" } }, /* @__PURE__ */ React20.createElement(
|
|
2436
2647
|
StaticDatePicker,
|
|
2437
2648
|
{
|
|
2438
2649
|
orientation: "landscape",
|
|
@@ -2442,11 +2653,11 @@ var SCCalendarSwipeable = ({
|
|
|
2442
2653
|
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" } },
|
|
2443
2654
|
onChange: (newValue) => setFecha(newValue)
|
|
2444
2655
|
}
|
|
2445
|
-
), /* @__PURE__ */
|
|
2656
|
+
), /* @__PURE__ */ React20.createElement(Grid7, { container: true, justifyContent: "center" }, /* @__PURE__ */ React20.createElement(IconButton9, { "data-testid": "close-calendar-button", onClick: toggleCalendar(false) }, /* @__PURE__ */ React20.createElement(KeyboardDoubleArrowUpIcon, null))))));
|
|
2446
2657
|
};
|
|
2447
2658
|
|
|
2448
2659
|
// src/Components/SCDataGrid.tsx
|
|
2449
|
-
import
|
|
2660
|
+
import React21, { useEffect as useEffect14, useState as useState12 } from "react";
|
|
2450
2661
|
import { DataGridPro, useGridApiRef } from "@mui/x-data-grid-pro";
|
|
2451
2662
|
import { LicenseInfo as LicenseInfo2 } from "@mui/x-license-pro";
|
|
2452
2663
|
import KeyboardArrowDownIcon from "@mui/icons-material/KeyboardArrowDown";
|
|
@@ -2536,7 +2747,7 @@ function SCDataGridInitial({ data, columns, groupColumns, rowsTable, checkboxSel
|
|
|
2536
2747
|
label = label;
|
|
2537
2748
|
}
|
|
2538
2749
|
}
|
|
2539
|
-
return /* @__PURE__ */
|
|
2750
|
+
return /* @__PURE__ */ React21.createElement(
|
|
2540
2751
|
"div",
|
|
2541
2752
|
{
|
|
2542
2753
|
style: {
|
|
@@ -2553,7 +2764,7 @@ function SCDataGridInitial({ data, columns, groupColumns, rowsTable, checkboxSel
|
|
|
2553
2764
|
fontWeight: params.rowNode.type == "group" ? "400" : "300"
|
|
2554
2765
|
}
|
|
2555
2766
|
},
|
|
2556
|
-
params.rowNode.type === "group" && /* @__PURE__ */
|
|
2767
|
+
params.rowNode.type === "group" && /* @__PURE__ */ React21.createElement(
|
|
2557
2768
|
"span",
|
|
2558
2769
|
{
|
|
2559
2770
|
style: {
|
|
@@ -2566,7 +2777,7 @@ function SCDataGridInitial({ data, columns, groupColumns, rowsTable, checkboxSel
|
|
|
2566
2777
|
params.api.setRowChildrenExpansion(params.id, !params.rowNode.childrenExpanded);
|
|
2567
2778
|
}
|
|
2568
2779
|
},
|
|
2569
|
-
params.rowNode.childrenExpanded ? /* @__PURE__ */
|
|
2780
|
+
params.rowNode.childrenExpanded ? /* @__PURE__ */ React21.createElement(KeyboardArrowUpIcon, { fontSize: "small", color: "action" }) : /* @__PURE__ */ React21.createElement(KeyboardArrowDownIcon, { fontSize: "small", color: "action" })
|
|
2570
2781
|
),
|
|
2571
2782
|
label
|
|
2572
2783
|
);
|
|
@@ -2608,11 +2819,11 @@ function SCDataGridInitial({ data, columns, groupColumns, rowsTable, checkboxSel
|
|
|
2608
2819
|
let styleRowHeight = density == "compact" ? 32 : density == "standard" ? 28 : density == "comfortable" ? 36 : 32;
|
|
2609
2820
|
let rows = rowsTable ? rowsTable : validationTreeData != false ? parseInt(data.length.toString()) : data.length < 10 ? parseInt(data.length.toString()) : 10;
|
|
2610
2821
|
let validationGroupingColDef = groupingColDefs || {};
|
|
2611
|
-
const [groupDataLenght, setGroupDataLengh] =
|
|
2612
|
-
const [pageSize, setPageSize] =
|
|
2613
|
-
const [arrayRows, setArrayRows] =
|
|
2614
|
-
const [selectionModel, setSelectionModel] =
|
|
2615
|
-
|
|
2822
|
+
const [groupDataLenght, setGroupDataLengh] = useState12(0);
|
|
2823
|
+
const [pageSize, setPageSize] = useState12(rows);
|
|
2824
|
+
const [arrayRows, setArrayRows] = useState12([]);
|
|
2825
|
+
const [selectionModel, setSelectionModel] = useState12([]);
|
|
2826
|
+
useEffect14(() => {
|
|
2616
2827
|
if ((data == null ? void 0 : data.length) > 0) {
|
|
2617
2828
|
dataConvertRows(data, void 0);
|
|
2618
2829
|
}
|
|
@@ -2668,7 +2879,7 @@ function SCDataGridInitial({ data, columns, groupColumns, rowsTable, checkboxSel
|
|
|
2668
2879
|
setSelectionModel([...newSelection]);
|
|
2669
2880
|
}
|
|
2670
2881
|
};
|
|
2671
|
-
return /* @__PURE__ */
|
|
2882
|
+
return /* @__PURE__ */ React21.createElement(React21.Fragment, null, data && /* @__PURE__ */ React21.createElement(React21.Fragment, null, /* @__PURE__ */ React21.createElement("div", { style: { width: width || "100%", maxHeight: maxHeight ? `${maxHeight}px` : "none" } }, /* @__PURE__ */ React21.createElement(
|
|
2672
2883
|
DataGridPro,
|
|
2673
2884
|
{
|
|
2674
2885
|
apiRef,
|
|
@@ -2732,45 +2943,45 @@ function SCDataGridInitial({ data, columns, groupColumns, rowsTable, checkboxSel
|
|
|
2732
2943
|
}
|
|
2733
2944
|
))));
|
|
2734
2945
|
}
|
|
2735
|
-
var SCDataGrid =
|
|
2946
|
+
var SCDataGrid = React21.memo(SCDataGridInitial, (prevProps, nextProps) => {
|
|
2736
2947
|
const isEqual = prevProps.rowsTable === nextProps.rowsTable && prevProps.checkboxSelection === nextProps.checkboxSelection && prevProps.width === nextProps.width && prevProps.maxHeight === nextProps.maxHeight && prevProps.density === nextProps.density;
|
|
2737
2948
|
return isEqual;
|
|
2738
2949
|
});
|
|
2739
2950
|
|
|
2740
2951
|
// src/Components/EmptyState/EmptyState.tsx
|
|
2741
|
-
import
|
|
2742
|
-
import { Button as
|
|
2952
|
+
import React26 from "react";
|
|
2953
|
+
import { Button as Button10, Stack as Stack9, Typography as Typography13 } from "@mui/material";
|
|
2743
2954
|
|
|
2744
2955
|
// src/assets/ImgEmptyState/create.tsx
|
|
2745
|
-
import
|
|
2956
|
+
import React22 from "react";
|
|
2746
2957
|
var Create = () => {
|
|
2747
|
-
return /* @__PURE__ */
|
|
2958
|
+
return /* @__PURE__ */ React22.createElement("svg", { width: "45", height: "41", viewBox: "0 0 45 41", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, /* @__PURE__ */ React22.createElement("g", { "clip-path": "url(#clip0_1283_39624)" }, /* @__PURE__ */ React22.createElement("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M44.4956 13.1869C44.4386 13.8714 43.8367 14.3801 43.1514 14.3231L39.9978 14.0608C39.3124 14.0038 38.8032 13.4027 38.8602 12.7182C38.9173 12.0336 39.5191 11.525 40.2044 11.582L43.3581 11.8443C44.0434 11.9013 44.5527 12.5024 44.4956 13.1869Z", fill: "#CED1D4" }), /* @__PURE__ */ React22.createElement("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M41.0393 1.01388C41.4429 1.57002 41.3187 2.34766 40.7619 2.75078L38.099 4.6787C37.5423 5.08182 36.7637 4.95777 36.3601 4.40163C35.9565 3.84548 36.0807 3.06785 36.6375 2.66473L39.3004 0.736804C39.8572 0.333685 40.6357 0.457736 41.0393 1.01388Z", fill: "#CED1D4" }), /* @__PURE__ */ React22.createElement("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M36.6656 21.2361C36.1755 21.7179 36.1692 22.5054 36.6515 22.9949L38.9584 25.3363C39.4408 25.8258 40.2291 25.8321 40.7193 25.3503C41.2094 24.8685 41.2157 24.0811 40.7333 23.5915L38.4264 21.2502C37.9441 20.7606 37.1557 20.7543 36.6656 21.2361Z", fill: "#CED1D4" }), /* @__PURE__ */ React22.createElement("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M0.504365 13.1869C0.561439 13.8714 1.16326 14.3801 1.84856 14.323L5.00224 14.0607C5.68755 14.0037 6.19683 13.4026 6.13976 12.7181C6.08268 12.0336 5.48087 11.5249 4.79556 11.5819L1.64188 11.8442C0.956574 11.9012 0.447291 12.5023 0.504365 13.1869Z", fill: "#CED1D4" }), /* @__PURE__ */ React22.createElement("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M3.95913 1.01431C3.55554 1.57046 3.67974 2.34809 4.23653 2.75121L6.8994 4.67914C7.45619 5.08225 8.23473 4.9582 8.63832 4.40206C9.04191 3.84592 8.91771 3.06828 8.36092 2.66516L5.69805 0.737237C5.14126 0.334118 4.36272 0.458169 3.95913 1.01431Z", fill: "#CED1D4" }), /* @__PURE__ */ React22.createElement("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M8.33389 21.236C8.82403 21.7178 8.83033 22.5053 8.34796 22.9949L6.04107 25.3362C5.5587 25.8257 4.77034 25.832 4.28021 25.3502C3.79008 24.8684 3.78378 24.081 4.26614 23.5914L6.57304 21.2501C7.0554 20.7605 7.84376 20.7542 8.33389 21.236Z", fill: "#CED1D4" }), /* @__PURE__ */ React22.createElement("path", { d: "M19.1448 37.3573H25.5804L25.1621 38.889C25.0636 39.2498 24.7356 39.5 24.3613 39.5H20.3638C19.9895 39.5 19.6615 39.2498 19.563 38.889L19.1448 37.3573Z", fill: "#CED1D4" }), /* @__PURE__ */ React22.createElement("path", { d: "M17.6534 35.3665C17.5381 34.8487 17.9326 34.3575 18.4637 34.3575H26.3983C26.9294 34.3575 27.3239 34.8487 27.2087 35.3665L26.9829 36.3814C26.8563 36.9504 26.351 37.3553 25.7674 37.3553H19.0946C18.511 37.3553 18.0057 36.9504 17.8791 36.3814L17.6534 35.3665Z", fill: "#CED1D4" }), /* @__PURE__ */ React22.createElement("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M8.85423 13.9906C8.85423 6.60807 14.935 0.652473 22.3998 0.652473C29.8646 0.652473 35.9455 6.60807 35.9455 13.9906C35.9455 17.6153 34.4759 20.9015 32.0983 23.3022C31.9627 23.4392 31.8257 23.5745 31.6935 23.7052L31.6917 23.707C30.7961 24.5922 30.1385 25.2699 29.8494 26.1116C29.7242 26.4761 29.6012 27.1915 29.4988 28.0885C29.4002 28.9527 29.3306 29.8872 29.2854 30.6281C29.2099 31.864 28.1896 32.8547 26.9266 32.8547H17.8731C16.6101 32.8547 15.5898 31.864 15.5143 30.6281C15.469 29.8872 15.3995 28.9527 15.3009 28.0885C15.1985 27.1915 15.0755 26.4761 14.9503 26.1116C14.6612 25.2699 14.0036 24.5922 13.108 23.707L13.106 23.7051C12.9739 23.5744 12.837 23.4391 12.7014 23.3022C10.3238 20.9015 8.85423 17.6153 8.85423 13.9906ZM22.3998 2.85676C16.1214 2.85676 11.0611 7.85765 11.0611 13.9906C11.0611 17.0068 12.2813 19.7437 14.2703 21.752C14.3969 21.8798 14.526 22.0075 14.6602 22.1401C14.6831 22.1627 14.7062 22.1855 14.7294 22.2085C15.5402 23.0091 16.5655 24.0215 17.0377 25.3961C17.2505 26.0156 17.3925 26.9534 17.4936 27.8388C17.5983 28.757 17.6707 29.7342 17.7171 30.4939C17.723 30.59 17.8001 30.6504 17.8731 30.6504H26.9266C26.9996 30.6504 27.0767 30.59 27.0826 30.4939C27.129 29.7342 27.2013 28.757 27.3061 27.8388C27.4072 26.9534 27.5492 26.0156 27.762 25.3961C28.2342 24.0215 29.2594 23.0091 30.0702 22.2085C30.0935 22.1855 30.1166 22.1627 30.1395 22.1401C30.2737 22.0075 30.4028 21.8798 30.5294 21.752C32.5184 19.7437 33.7386 17.0068 33.7386 13.9906C33.7386 7.85765 28.6783 2.85676 22.3998 2.85676Z", fill: "#B9BDC1" })), /* @__PURE__ */ React22.createElement("defs", null, /* @__PURE__ */ React22.createElement("clipPath", { id: "clip0_1283_39624" }, /* @__PURE__ */ React22.createElement("rect", { width: "44", height: "40", fill: "white", transform: "translate(0.5 0.5)" }))));
|
|
2748
2959
|
};
|
|
2749
2960
|
|
|
2750
2961
|
// src/assets/ImgEmptyState/empty.tsx
|
|
2751
|
-
import
|
|
2962
|
+
import React23 from "react";
|
|
2752
2963
|
var Empty = () => {
|
|
2753
|
-
return /* @__PURE__ */
|
|
2964
|
+
return /* @__PURE__ */ React23.createElement("svg", { width: "41", height: "41", viewBox: "0 0 41 41", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, /* @__PURE__ */ React23.createElement("g", { "clip-path": "url(#clip0_1283_39626)" }, /* @__PURE__ */ React23.createElement("path", { d: "M36.1351 20.9955C25.1396 25.3151 16.1875 30.5689 11.8186 30.9221L14.7134 35.4696L36.1351 20.9955Z", fill: "#CED1D4" }), /* @__PURE__ */ React23.createElement("path", { d: "M37.4531 24.9937C39.7468 28.137 42.9751 35.0522 37.4531 35.3441C34.9101 35.4058 31.3306 32.981 37.4531 24.9937Z", fill: "#CED1D4" }), /* @__PURE__ */ React23.createElement("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M25.6074 1.30001C25.1055 0.501016 24.051 0.26003 23.2522 0.761943L19.6474 3.02673C17.5114 2.68138 14.5326 2.642 12.1799 3.71891C10.8937 4.30766 9.75284 5.25155 9.09396 6.68863C8.65845 7.63849 8.46029 8.74589 8.52317 10.0159L1.2996 14.5543C0.500747 15.0562 0.260156 16.1108 0.762045 16.9098L12.7907 36.0589C13.2926 36.8579 14.3471 37.0989 15.1459 36.597L37.0985 22.8046C37.8973 22.3027 38.1379 21.2481 37.636 20.4491L25.6074 1.30001ZM2.79326 16.1347L8.88857 12.3051C8.91842 12.3953 8.95405 12.4868 8.99634 12.5777C9.70948 14.1097 11.2554 15.9861 13.7088 16.7327C16.2084 17.4934 19.3887 17.0049 23.1824 14.2981L23.3709 14.1636L22.1324 12.4273L21.9439 12.5618C18.5121 15.0104 16.0132 15.2048 14.3292 14.6924C12.5992 14.1659 11.458 12.8132 10.9295 11.6778C10.9197 11.6569 10.9072 11.6225 10.8968 11.5772C10.8595 11.4156 10.8267 11.2584 10.7981 11.1054L24.0275 2.79363L35.6048 21.2243L14.3706 34.5653L2.79326 16.1347ZM13.0675 5.65821C14.0932 5.18871 15.3429 4.98089 16.5902 4.94754L10.716 8.63821C10.7826 8.23367 10.8925 7.88269 11.0323 7.57786C11.4327 6.70447 12.1364 6.08441 13.0675 5.65821Z", fill: "#B9BDC1" }), /* @__PURE__ */ React23.createElement("path", { d: "M24.3482 14.3207C24.0493 15.6305 22.7454 16.4497 21.4358 16.1505C20.1262 15.8513 19.3069 14.547 19.6058 13.2372C19.9047 11.9274 21.2086 11.1082 22.5182 11.4074C23.8278 11.7066 24.6471 13.011 24.3482 14.3207Z", fill: "#CED1D4" })), /* @__PURE__ */ React23.createElement("defs", null, /* @__PURE__ */ React23.createElement("clipPath", { id: "clip0_1283_39626" }, /* @__PURE__ */ React23.createElement("rect", { width: "40", height: "40", fill: "white", transform: "translate(0.5 0.5)" }))));
|
|
2754
2965
|
};
|
|
2755
2966
|
|
|
2756
2967
|
// src/assets/ImgEmptyState/error.tsx
|
|
2757
|
-
import
|
|
2968
|
+
import React24 from "react";
|
|
2758
2969
|
var Error2 = () => {
|
|
2759
|
-
return /* @__PURE__ */
|
|
2970
|
+
return /* @__PURE__ */ React24.createElement("svg", { width: "41", height: "41", viewBox: "0 0 41 41", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, /* @__PURE__ */ React24.createElement("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M17.8035 3.2925C17.0304 3.2925 16.358 3.82772 16.1913 4.58349L14.0944 13.8188C13.8625 14.8535 14.6474 15.8412 15.7066 15.8412H25.4175C26.4764 15.8412 27.2677 14.8538 27.0297 13.8185L24.9328 4.58323C24.7608 3.82996 24.0975 3.29514 23.3264 3.2925H17.8035ZM15.9436 13.9945L17.9555 5.13336L23.1745 5.12121L25.1863 13.9945H15.9436Z", fill: "#B9BDC1" }), /* @__PURE__ */ React24.createElement("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M11.5449 28.1551C10.7717 28.1551 10.0993 28.6904 9.93264 29.4462L8.54048 35.6049C8.46109 35.7863 8.54048 35.6049 8.46109 35.7863H5.42145C4.91308 35.7863 4.50096 36.1984 4.50096 36.7068C4.50096 37.2152 4.91308 37.6273 5.42145 37.6273H35.5795C36.0879 37.6273 36.5 37.2152 36.5 36.7068C36.5 36.1984 36.0879 35.7863 35.5795 35.7863H32.595C32.5443 35.6284 32.5801 35.745 32.5443 35.5928L31.1121 29.4342C30.9394 28.6844 30.2672 28.1551 29.5 28.1551H11.5449ZM10.3781 35.7863L11.6854 29.9961H29.3426L30.6891 35.7863H10.3781Z", fill: "#B9BDC1" }), /* @__PURE__ */ React24.createElement("path", { d: "M13.7368 17.4381H28.0252C28.2486 17.4381 28.4434 17.5928 28.495 17.8162L30.271 25.9114C30.334 26.2094 30.1106 26.4901 29.8012 26.4901H11.6743C11.3649 26.4901 11.1358 26.1979 11.2102 25.8943L13.2727 17.799C13.3243 17.587 13.519 17.4381 13.7368 17.4381Z", fill: "#CED1D4" }));
|
|
2760
2971
|
};
|
|
2761
2972
|
|
|
2762
2973
|
// src/assets/ImgEmptyState/search.tsx
|
|
2763
|
-
import
|
|
2974
|
+
import React25 from "react";
|
|
2764
2975
|
var Search2 = () => {
|
|
2765
|
-
return /* @__PURE__ */
|
|
2976
|
+
return /* @__PURE__ */ React25.createElement("svg", { width: "41", height: "41", viewBox: "0 0 41 41", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, /* @__PURE__ */ React25.createElement("g", { "clip-path": "url(#clip0_1283_39628)" }, /* @__PURE__ */ React25.createElement("path", { d: "M29.421 4.71198C28.943 2.92749 30.0021 1.09315 31.7865 0.61487C33.5709 0.136592 35.405 1.19549 35.883 2.97998L40.3853 19.7878C40.8633 21.5723 39.8042 23.4066 38.0198 23.8849C36.2354 24.3632 34.4013 23.3043 33.9233 21.5198L29.421 4.71198Z", fill: "#CED1D4" }), /* @__PURE__ */ React25.createElement("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M0.607749 18.613C0.158895 16.9369 1.15336 15.2141 2.82895 14.7649C4.50454 14.3157 6.22674 15.3102 6.67559 16.9862L8.06043 22.1573C8.50928 23.8333 7.51482 25.5561 5.83923 26.0054C4.16364 26.4546 2.44144 25.46 1.99259 23.784L0.607749 18.613ZM3.41576 16.9561C2.95002 17.0809 2.67359 17.5598 2.79836 18.0257L4.18319 23.1967C4.30796 23.6626 4.78667 23.939 5.25242 23.8142C5.71816 23.6893 5.99459 23.2104 5.86982 22.7445L4.48499 17.5735C4.36022 17.1076 3.88151 16.8312 3.41576 16.9561Z", fill: "#B9BDC1" }), /* @__PURE__ */ React25.createElement("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M18.0672 23.7222C17.6115 24.3518 16.9814 24.8602 16.2239 25.1659L23.5692 38.9314C23.929 39.6056 23.6742 40.4438 23.0003 40.8037C22.3263 41.1635 21.4883 40.9087 21.1286 40.2346L14.2002 27.2506L6.15159 39.7788C5.73857 40.4217 4.88273 40.6079 4.24003 40.1948C3.59732 39.7816 3.41113 38.9255 3.82416 38.2826L12.4422 24.8681C11.8201 24.4937 11.2926 23.9601 10.9267 23.3057L6.9728 23.4848C6.43282 23.5092 5.94855 23.1546 5.80865 22.6324L4.48764 17.7008C4.34775 17.1786 4.5899 16.6293 5.06976 16.3804L11.2775 13.1606L11.2169 12.934C11.0764 12.4095 11.3213 11.8581 11.8046 11.6107L26.5904 4.04383C26.8999 3.88542 27.2644 3.87542 27.5822 4.01662C27.8999 4.15781 28.1369 4.43508 28.2269 4.77102L32.7303 21.5831C32.8203 21.9191 32.7537 22.2777 32.5491 22.5589C32.3445 22.8401 32.0238 23.0137 31.6766 23.0314L18.0672 23.7222ZM17.9643 23.1894C18.1495 22.8739 18.2903 22.5322 18.3806 22.1748C18.4139 22.0434 18.4403 21.9098 18.4596 21.7746C18.4048 22.1588 18.2927 22.5298 18.1297 22.876C18.0793 22.983 18.0241 23.0876 17.9643 23.1894ZM18.8739 21.375L30.1375 20.8032L26.3713 6.7432L13.6819 13.2372L14.6854 16.9834C16.5391 17.0063 18.2272 18.2517 18.7306 20.1311C18.8421 20.5473 18.8877 20.9656 18.8739 21.375ZM12.4612 17.5793C11.2373 18.3061 10.4581 19.6082 10.3898 21.0243L7.79324 21.142L6.95134 17.999L11.8877 15.4386L12.4612 17.5793ZM15.1332 23.1064C16.1692 22.8287 16.784 21.7635 16.5064 20.7272C16.2288 19.6909 15.164 19.0759 14.128 19.3536C13.092 19.6313 12.4772 20.6965 12.7547 21.7328C12.9527 22.4718 13.5511 22.9972 14.2553 23.1365C14.2923 23.1351 14.3294 23.1351 14.3667 23.1366C14.4569 23.1402 14.5456 23.1526 14.6318 23.1732C14.797 23.173 14.9652 23.1515 15.1332 23.1064Z", fill: "#B9BDC1" })), /* @__PURE__ */ React25.createElement("defs", null, /* @__PURE__ */ React25.createElement("clipPath", { id: "clip0_1283_39628" }, /* @__PURE__ */ React25.createElement("rect", { width: "40", height: "40", fill: "white", transform: "translate(0.5 0.5)" }))));
|
|
2766
2977
|
};
|
|
2767
2978
|
|
|
2768
2979
|
// src/Components/EmptyState/EmptyState.tsx
|
|
2769
2980
|
var EmptyStateImageUrls = {
|
|
2770
|
-
create: /* @__PURE__ */
|
|
2771
|
-
error: /* @__PURE__ */
|
|
2772
|
-
noResult: /* @__PURE__ */
|
|
2773
|
-
search: /* @__PURE__ */
|
|
2981
|
+
create: /* @__PURE__ */ React26.createElement(Create, null),
|
|
2982
|
+
error: /* @__PURE__ */ React26.createElement(Error2, null),
|
|
2983
|
+
noResult: /* @__PURE__ */ React26.createElement(Empty, null),
|
|
2984
|
+
search: /* @__PURE__ */ React26.createElement(Search2, null)
|
|
2774
2985
|
};
|
|
2775
2986
|
var DefaultIcon = ({
|
|
2776
2987
|
state = "create",
|
|
@@ -2778,7 +2989,7 @@ var DefaultIcon = ({
|
|
|
2778
2989
|
}) => {
|
|
2779
2990
|
const Icon = EmptyStateImageUrls[state];
|
|
2780
2991
|
const iconSize = size === "small" ? { width: "40px", height: "40px" } : { width: "60px", height: "60px" };
|
|
2781
|
-
return /* @__PURE__ */
|
|
2992
|
+
return /* @__PURE__ */ React26.createElement("div", null, Icon);
|
|
2782
2993
|
};
|
|
2783
2994
|
var EmptyState = ({
|
|
2784
2995
|
state = "create",
|
|
@@ -2787,12 +2998,12 @@ var EmptyState = ({
|
|
|
2787
2998
|
subtitle,
|
|
2788
2999
|
actions,
|
|
2789
3000
|
containerHeight = "100vh",
|
|
2790
|
-
icon = /* @__PURE__ */
|
|
3001
|
+
icon = /* @__PURE__ */ React26.createElement(DefaultIcon, { state, size })
|
|
2791
3002
|
}) => {
|
|
2792
3003
|
const titleVariant = size === "small" ? "subtitle2" : "h6";
|
|
2793
3004
|
const subtitleVariant = size === "small" ? "caption" : "body1";
|
|
2794
|
-
return /* @__PURE__ */
|
|
2795
|
-
|
|
3005
|
+
return /* @__PURE__ */ React26.createElement(
|
|
3006
|
+
Stack9,
|
|
2796
3007
|
{
|
|
2797
3008
|
alignItems: "center",
|
|
2798
3009
|
justifyContent: "center",
|
|
@@ -2800,8 +3011,8 @@ var EmptyState = ({
|
|
|
2800
3011
|
height: containerHeight,
|
|
2801
3012
|
"data-testid": "empty-state-container"
|
|
2802
3013
|
},
|
|
2803
|
-
icon && /* @__PURE__ */
|
|
2804
|
-
/* @__PURE__ */
|
|
3014
|
+
icon && /* @__PURE__ */ React26.createElement(Stack9, null, icon),
|
|
3015
|
+
/* @__PURE__ */ React26.createElement(Stack9, { gap: 0.5 }, /* @__PURE__ */ React26.createElement(Typography13, { color: "text.primary", variant: titleVariant, textAlign: "center" }, title), subtitle && /* @__PURE__ */ React26.createElement(
|
|
2805
3016
|
Typography13,
|
|
2806
3017
|
{
|
|
2807
3018
|
variant: subtitleVariant,
|
|
@@ -2809,8 +3020,8 @@ var EmptyState = ({
|
|
|
2809
3020
|
color: "text.secondary"
|
|
2810
3021
|
},
|
|
2811
3022
|
subtitle
|
|
2812
|
-
), actions && (actions == null ? void 0 : actions.length) > 0 && /* @__PURE__ */
|
|
2813
|
-
|
|
3023
|
+
), actions && (actions == null ? void 0 : actions.length) > 0 && /* @__PURE__ */ React26.createElement(
|
|
3024
|
+
Stack9,
|
|
2814
3025
|
{
|
|
2815
3026
|
direction: "row",
|
|
2816
3027
|
spacing: 2,
|
|
@@ -2819,15 +3030,15 @@ var EmptyState = ({
|
|
|
2819
3030
|
},
|
|
2820
3031
|
actions.map((action, index) => {
|
|
2821
3032
|
var _a, _b, _c, _d;
|
|
2822
|
-
return /* @__PURE__ */
|
|
2823
|
-
|
|
3033
|
+
return /* @__PURE__ */ React26.createElement(
|
|
3034
|
+
Button10,
|
|
2824
3035
|
{
|
|
2825
3036
|
key: index,
|
|
2826
3037
|
color: (_a = action.color) != null ? _a : "primary",
|
|
2827
3038
|
variant: (_b = action.variant) != null ? _b : "text",
|
|
2828
3039
|
size: (_c = action.size) != null ? _c : "small",
|
|
2829
|
-
startIcon: action.icon && action.iconPosition === "left" ? /* @__PURE__ */
|
|
2830
|
-
endIcon: action.icon && action.iconPosition === "right" ? /* @__PURE__ */
|
|
3040
|
+
startIcon: action.icon && action.iconPosition === "left" ? /* @__PURE__ */ React26.createElement("img", { src: action.icon, alt: "icon" }) : void 0,
|
|
3041
|
+
endIcon: action.icon && action.iconPosition === "right" ? /* @__PURE__ */ React26.createElement("img", { src: action.icon, alt: "icon" }) : void 0,
|
|
2831
3042
|
onClick: action.onClick
|
|
2832
3043
|
},
|
|
2833
3044
|
capitalize((_d = action.text) != null ? _d : "action")
|
|
@@ -2838,9 +3049,9 @@ var EmptyState = ({
|
|
|
2838
3049
|
};
|
|
2839
3050
|
|
|
2840
3051
|
// src/Components/SCDialog.tsx
|
|
2841
|
-
import
|
|
2842
|
-
import { Button as
|
|
2843
|
-
import
|
|
3052
|
+
import React27, { useEffect as useEffect15, useState as useState13 } from "react";
|
|
3053
|
+
import { Button as Button11, Typography as Typography14, Modal as Modal2, Dialog, DialogActions, DialogContent, DialogTitle, IconButton as IconButton10, Tooltip as Tooltip4, Box as Box13, SvgIcon as SvgIcon5 } from "@mui/material";
|
|
3054
|
+
import Grid8 from "@mui/material/Grid2";
|
|
2844
3055
|
import CloseIcon2 from "@mui/icons-material/Close";
|
|
2845
3056
|
import * as Muicon5 from "@mui/icons-material";
|
|
2846
3057
|
var SCDialog = ({ title, iconTitle, subtitle, content, actions, buttonDialog, disableClose, dividers, widthContent, heightContent, background, setShow, show }) => {
|
|
@@ -2848,8 +3059,8 @@ var SCDialog = ({ title, iconTitle, subtitle, content, actions, buttonDialog, di
|
|
|
2848
3059
|
let iconTitleValidation = "";
|
|
2849
3060
|
let IconTitle;
|
|
2850
3061
|
let ButtonIcon;
|
|
2851
|
-
const [open, setOpen] =
|
|
2852
|
-
|
|
3062
|
+
const [open, setOpen] = useState13(show);
|
|
3063
|
+
useEffect15(() => {
|
|
2853
3064
|
if (show) {
|
|
2854
3065
|
handleOpen();
|
|
2855
3066
|
} else {
|
|
@@ -2874,7 +3085,7 @@ var SCDialog = ({ title, iconTitle, subtitle, content, actions, buttonDialog, di
|
|
|
2874
3085
|
});
|
|
2875
3086
|
if (iconTitle) {
|
|
2876
3087
|
if (Muicon5[iconTitle] == void 0) {
|
|
2877
|
-
if (iconTitle &&
|
|
3088
|
+
if (iconTitle && React27.isValidElement(iconTitle) && iconTitle.type == void 0) {
|
|
2878
3089
|
iconTitleValidation = "image";
|
|
2879
3090
|
IconTitle = iconTitle;
|
|
2880
3091
|
} else {
|
|
@@ -2899,8 +3110,8 @@ var SCDialog = ({ title, iconTitle, subtitle, content, actions, buttonDialog, di
|
|
|
2899
3110
|
}
|
|
2900
3111
|
};
|
|
2901
3112
|
const dialogActions = actions != null ? actions : [{ text: "Cerrar", fn: handleClose }];
|
|
2902
|
-
content = content != null ? content : { component: /* @__PURE__ */
|
|
2903
|
-
return /* @__PURE__ */
|
|
3113
|
+
content = content != null ? content : { component: /* @__PURE__ */ React27.createElement(Box13, null, " Aqui va el contenido ") };
|
|
3114
|
+
return /* @__PURE__ */ React27.createElement("div", null, buttonDialog ? /* @__PURE__ */ React27.createElement(React27.Fragment, null, buttonDialog.text != void 0 ? /* @__PURE__ */ React27.createElement(Tooltip4, { placement: "bottom-start", title: buttonDialog.tooltip != void 0 ? buttonDialog.tooltip : "", slotProps: { popper: { modifiers: [{ name: "offset", options: { offset: [0, -14] } }] } } }, /* @__PURE__ */ React27.createElement(Button11, { size: "small", color: buttonDialog.color != void 0 ? buttonDialog.color : "primary", variant: (buttonDialog == null ? void 0 : buttonDialog.variant) != void 0 ? buttonDialog == null ? void 0 : buttonDialog.variant : "text", startIcon: (buttonDialog == null ? void 0 : buttonDialog.iconPosition) != void 0 ? (buttonDialog == null ? void 0 : buttonDialog.iconPosition) == "left" ? /* @__PURE__ */ React27.createElement(ButtonIcon, null) : "" : "", endIcon: (buttonDialog == null ? void 0 : buttonDialog.iconPosition) != void 0 ? (buttonDialog == null ? void 0 : buttonDialog.iconPosition) == "right" ? /* @__PURE__ */ React27.createElement(ButtonIcon, null) : "" : "", onClick: handleOpen }, " ", (buttonDialog == null ? void 0 : buttonDialog.text) != void 0 ? buttonDialog.text : "", " ")) : /* @__PURE__ */ React27.createElement(IconButton10, { style: { cursor: "pointer" }, onClick: handleOpen }, /* @__PURE__ */ React27.createElement(SvgIcon5, { fontSize: "small", color: (buttonDialog == null ? void 0 : buttonDialog.color) != void 0 ? buttonDialog == null ? void 0 : buttonDialog.color : "action", component: ButtonIcon }))) : "", /* @__PURE__ */ React27.createElement(Modal2, { open: open || false, onClose: handleClose }, /* @__PURE__ */ React27.createElement(
|
|
2904
3115
|
Dialog,
|
|
2905
3116
|
{
|
|
2906
3117
|
"data-testid": "dialog-element",
|
|
@@ -2914,8 +3125,8 @@ var SCDialog = ({ title, iconTitle, subtitle, content, actions, buttonDialog, di
|
|
|
2914
3125
|
}
|
|
2915
3126
|
}
|
|
2916
3127
|
},
|
|
2917
|
-
title && /* @__PURE__ */
|
|
2918
|
-
/* @__PURE__ */
|
|
3128
|
+
title && /* @__PURE__ */ React27.createElement(DialogTitle, { sx: { m: 0, padding: "8px 16px 8px 16px" }, "data-testid": "dialog-icon-title" }, /* @__PURE__ */ React27.createElement(Grid8, { container: true, size: 12, sx: { justifyContent: "space-between", flexWrap: "nowrap" } }, /* @__PURE__ */ React27.createElement(Grid8, { container: true, size: 11, sx: { alignItems: "center" } }, iconTitle ? iconTitleValidation == "image" ? /* @__PURE__ */ React27.createElement(Box13, { sx: { marginRight: "16px", width: "44px", height: "44px", borderRadius: "1px" } }, /* @__PURE__ */ React27.createElement("img", { src: IconTitle, width: "44px", height: "44px" })) : /* @__PURE__ */ React27.createElement(SvgIcon5, { color: "action", fontSize: "small", component: IconTitle, sx: { marginRight: "16px" } }) : "", /* @__PURE__ */ React27.createElement(Grid8, null, /* @__PURE__ */ React27.createElement(Typography14, { color: "text.primary", variant: "h6", gutterBottom: true }, title ? title : ""), /* @__PURE__ */ React27.createElement(Typography14, { color: "text.secondary", variant: "body2", gutterBottom: true }, subtitle ? subtitle : ""))), disableClose != true ? /* @__PURE__ */ React27.createElement(IconButton10, { "data-testid": "close-dialog-button", onClick: handleClose, size: "small", color: "default", sx: { height: 22, width: 22 } }, /* @__PURE__ */ React27.createElement(CloseIcon2, null)) : "")),
|
|
3129
|
+
/* @__PURE__ */ React27.createElement(
|
|
2919
3130
|
DialogContent,
|
|
2920
3131
|
{
|
|
2921
3132
|
"data-testid": "dialog-content",
|
|
@@ -2943,7 +3154,7 @@ var SCDialog = ({ title, iconTitle, subtitle, content, actions, buttonDialog, di
|
|
|
2943
3154
|
}
|
|
2944
3155
|
}
|
|
2945
3156
|
},
|
|
2946
|
-
content.url ? /* @__PURE__ */
|
|
3157
|
+
content.url ? /* @__PURE__ */ React27.createElement(
|
|
2947
3158
|
"iframe",
|
|
2948
3159
|
{
|
|
2949
3160
|
style: { border: "none", minWidth: "100%", minHeight: "100%" },
|
|
@@ -2953,20 +3164,20 @@ var SCDialog = ({ title, iconTitle, subtitle, content, actions, buttonDialog, di
|
|
|
2953
3164
|
}
|
|
2954
3165
|
) : content.component
|
|
2955
3166
|
),
|
|
2956
|
-
dialogActions.length > 0 ? /* @__PURE__ */
|
|
2957
|
-
|
|
3167
|
+
dialogActions.length > 0 ? /* @__PURE__ */ React27.createElement(DialogActions, { sx: { gap: 1, m: 0, padding: "12px 16px 12px 16px", justifyContent: dialogActions.length >= 3 ? "space-between" : "flex-end" } }, dialogActions.length >= 3 ? /* @__PURE__ */ React27.createElement(React27.Fragment, null, /* @__PURE__ */ React27.createElement(
|
|
3168
|
+
Button11,
|
|
2958
3169
|
{
|
|
2959
3170
|
variant: "text",
|
|
2960
3171
|
color: dialogActions[0].color || "primary",
|
|
2961
3172
|
size: "small",
|
|
2962
3173
|
onClick: dialogActions[0].fn,
|
|
2963
3174
|
disabled: dialogActions[0].disabled || false,
|
|
2964
|
-
startIcon: dialogActions[0].icon ? /* @__PURE__ */
|
|
3175
|
+
startIcon: dialogActions[0].icon ? /* @__PURE__ */ React27.createElement(SvgIcon5, { fontSize: "small", component: dialogActions[0].icon }) : void 0
|
|
2965
3176
|
},
|
|
2966
3177
|
dialogActions[0].text
|
|
2967
|
-
), /* @__PURE__ */
|
|
2968
|
-
return /* @__PURE__ */
|
|
2969
|
-
|
|
3178
|
+
), /* @__PURE__ */ React27.createElement(Box13, { sx: { display: "flex", gap: 1 } }, dialogActions.slice(1).map((boton, index) => {
|
|
3179
|
+
return /* @__PURE__ */ React27.createElement(
|
|
3180
|
+
Button11,
|
|
2970
3181
|
{
|
|
2971
3182
|
key: index + 1,
|
|
2972
3183
|
variant: index === dialogActions.length - 2 ? "contained" : "text",
|
|
@@ -2974,13 +3185,13 @@ var SCDialog = ({ title, iconTitle, subtitle, content, actions, buttonDialog, di
|
|
|
2974
3185
|
size: "small",
|
|
2975
3186
|
onClick: boton.fn,
|
|
2976
3187
|
disabled: boton.disabled || false,
|
|
2977
|
-
startIcon: boton.icon ? /* @__PURE__ */
|
|
3188
|
+
startIcon: boton.icon ? /* @__PURE__ */ React27.createElement(SvgIcon5, { fontSize: "small", component: boton.icon }) : void 0
|
|
2978
3189
|
},
|
|
2979
3190
|
boton.text
|
|
2980
3191
|
);
|
|
2981
3192
|
}))) : dialogActions.map((boton, index) => {
|
|
2982
|
-
return /* @__PURE__ */
|
|
2983
|
-
|
|
3193
|
+
return /* @__PURE__ */ React27.createElement(
|
|
3194
|
+
Button11,
|
|
2984
3195
|
{
|
|
2985
3196
|
key: index,
|
|
2986
3197
|
variant: index === dialogActions.length - 1 ? "contained" : "text",
|
|
@@ -2988,7 +3199,7 @@ var SCDialog = ({ title, iconTitle, subtitle, content, actions, buttonDialog, di
|
|
|
2988
3199
|
size: "small",
|
|
2989
3200
|
onClick: boton.fn,
|
|
2990
3201
|
disabled: boton.disabled || false,
|
|
2991
|
-
startIcon: boton.icon ? /* @__PURE__ */
|
|
3202
|
+
startIcon: boton.icon ? /* @__PURE__ */ React27.createElement(SvgIcon5, { fontSize: "small", component: boton.icon }) : void 0
|
|
2992
3203
|
},
|
|
2993
3204
|
boton.text
|
|
2994
3205
|
);
|
|
@@ -2997,13 +3208,13 @@ var SCDialog = ({ title, iconTitle, subtitle, content, actions, buttonDialog, di
|
|
|
2997
3208
|
};
|
|
2998
3209
|
|
|
2999
3210
|
// src/Components/SCListContent.tsx
|
|
3000
|
-
import
|
|
3211
|
+
import React28 from "react";
|
|
3001
3212
|
import { Divider as Divider4, List, ListItemButton, ListItemIcon as ListItemIcon4, ListItemText as ListItemText3, SvgIcon as SvgIcon6 } from "@mui/material";
|
|
3002
|
-
import
|
|
3213
|
+
import Grid9 from "@mui/material/Grid2";
|
|
3003
3214
|
import * as Muicon6 from "@mui/icons-material";
|
|
3004
3215
|
var SCListContent = ({ options }) => {
|
|
3005
|
-
const [selectedIndex, setSelectedIndex] =
|
|
3006
|
-
const [value, setValue] =
|
|
3216
|
+
const [selectedIndex, setSelectedIndex] = React28.useState("1");
|
|
3217
|
+
const [value, setValue] = React28.useState("1");
|
|
3007
3218
|
options.map(function(option, index, array) {
|
|
3008
3219
|
if (option == null ? void 0 : option.iconLeft) {
|
|
3009
3220
|
if ((option == null ? void 0 : option.iconLeft.type) == void 0) {
|
|
@@ -3020,31 +3231,31 @@ var SCListContent = ({ options }) => {
|
|
|
3020
3231
|
}
|
|
3021
3232
|
}
|
|
3022
3233
|
});
|
|
3023
|
-
return /* @__PURE__ */
|
|
3234
|
+
return /* @__PURE__ */ React28.createElement(React28.Fragment, null, /* @__PURE__ */ React28.createElement(List, { sx: { width: "100%", maxWidth: 360, bgcolor: "background.paper", padding: "0px !important" } }, options.map((option, index) => /* @__PURE__ */ React28.createElement(React28.Fragment, { key: index }, /* @__PURE__ */ React28.createElement(
|
|
3024
3235
|
ListItemButton,
|
|
3025
3236
|
{
|
|
3026
3237
|
disabled: option.disable,
|
|
3027
3238
|
onClick: option.fn
|
|
3028
3239
|
},
|
|
3029
|
-
option.iconLeft ? /* @__PURE__ */
|
|
3030
|
-
/* @__PURE__ */
|
|
3240
|
+
option.iconLeft ? /* @__PURE__ */ React28.createElement(ListItemIcon4, { sx: { minWidth: "30px !important" } }, /* @__PURE__ */ React28.createElement(SvgIcon6, { fontSize: "small", color: option.iconLeftColor || "action", component: option.iconLeft })) : "",
|
|
3241
|
+
/* @__PURE__ */ React28.createElement(
|
|
3031
3242
|
ListItemText3,
|
|
3032
3243
|
{
|
|
3033
3244
|
primary: option.title,
|
|
3034
|
-
secondary: /* @__PURE__ */
|
|
3245
|
+
secondary: /* @__PURE__ */ React28.createElement(Grid9, { gap: 0.5 }, /* @__PURE__ */ React28.createElement(Grid9, { container: true, gap: 0.5 }, option.subtitle), /* @__PURE__ */ React28.createElement(Grid9, { container: true, gap: 0.5 }, option.description))
|
|
3035
3246
|
}
|
|
3036
3247
|
),
|
|
3037
|
-
option.iconRight ? /* @__PURE__ */
|
|
3038
|
-
), option.divider == true ? /* @__PURE__ */
|
|
3248
|
+
option.iconRight ? /* @__PURE__ */ React28.createElement(ListItemIcon4, { sx: { minWidth: "0px !important" } }, /* @__PURE__ */ React28.createElement(SvgIcon6, { fontSize: "small", color: option.iconRightColor || "action", component: option.iconRight })) : ""
|
|
3249
|
+
), option.divider == true ? /* @__PURE__ */ React28.createElement(Divider4, null) : ""))));
|
|
3039
3250
|
};
|
|
3040
3251
|
|
|
3041
3252
|
// src/Components/SCMenu.tsx
|
|
3042
|
-
import
|
|
3043
|
-
import { Box as
|
|
3044
|
-
import
|
|
3253
|
+
import React29 from "react";
|
|
3254
|
+
import { Box as Box15, Typography as Typography16, Paper as Paper2, Divider as Divider5, MenuList as MenuList2, MenuItem as MenuItem5, ListItemIcon as ListItemIcon5, SvgIcon as SvgIcon7 } from "@mui/material";
|
|
3255
|
+
import Grid10 from "@mui/material/Grid2";
|
|
3045
3256
|
|
|
3046
3257
|
// src/Components/Hooks/useWindowDimensions.ts
|
|
3047
|
-
import { useState as
|
|
3258
|
+
import { useState as useState15, useEffect as useEffect17 } from "react";
|
|
3048
3259
|
function getWindowDimensions() {
|
|
3049
3260
|
const { innerWidth: width, innerHeight: height } = window;
|
|
3050
3261
|
return {
|
|
@@ -3053,8 +3264,8 @@ function getWindowDimensions() {
|
|
|
3053
3264
|
};
|
|
3054
3265
|
}
|
|
3055
3266
|
function useWindowDimensions() {
|
|
3056
|
-
const [windowDimensions, setWindowDimensions] =
|
|
3057
|
-
|
|
3267
|
+
const [windowDimensions, setWindowDimensions] = useState15(getWindowDimensions());
|
|
3268
|
+
useEffect17(() => {
|
|
3058
3269
|
function handleResize() {
|
|
3059
3270
|
setWindowDimensions(getWindowDimensions());
|
|
3060
3271
|
}
|
|
@@ -3072,12 +3283,12 @@ var SCMenu = ({ header, options, defaultOption, disable, widthMenu, heightMenu,
|
|
|
3072
3283
|
const pageSize = widthPage ? parseInt(widthPage) : width - menuSize;
|
|
3073
3284
|
const widthContainer = menuSize + pageSize;
|
|
3074
3285
|
let heightContainer = heightMenu ? parseInt(heightMenu) : height - 76;
|
|
3075
|
-
const [selectedIndex, setSelectedIndex] =
|
|
3076
|
-
const [value, setValue] =
|
|
3077
|
-
|
|
3286
|
+
const [selectedIndex, setSelectedIndex] = React29.useState("1");
|
|
3287
|
+
const [value, setValue] = React29.useState("1");
|
|
3288
|
+
React29.useEffect(() => {
|
|
3078
3289
|
heightContainer = heightMenu ? parseInt(heightMenu) : height - 76;
|
|
3079
3290
|
}, [height]);
|
|
3080
|
-
|
|
3291
|
+
React29.useEffect(() => {
|
|
3081
3292
|
if (defaultOption) {
|
|
3082
3293
|
handleClickMenusItem(event, void 0);
|
|
3083
3294
|
}
|
|
@@ -3107,7 +3318,7 @@ var SCMenu = ({ header, options, defaultOption, disable, widthMenu, heightMenu,
|
|
|
3107
3318
|
setValue(String(index + 1));
|
|
3108
3319
|
}
|
|
3109
3320
|
};
|
|
3110
|
-
return /* @__PURE__ */
|
|
3321
|
+
return /* @__PURE__ */ React29.createElement(React29.Fragment, null, /* @__PURE__ */ React29.createElement(Grid10, { container: true, sx: { height: heightContainer, width: widthContainer, flexDirection: "column" } }, /* @__PURE__ */ React29.createElement(Paper2, { "data-testid": "menu-content", sx: { width: menuSize, height: heightContainer, overflow: "auto" } }, header && header.component, /* @__PURE__ */ React29.createElement(MenuList2, { sx: { height: options.length * 45, padding: "8px 0px" } }, options.map((option, index) => /* @__PURE__ */ React29.createElement(React29.Fragment, null, /* @__PURE__ */ React29.createElement(
|
|
3111
3322
|
MenuItem5,
|
|
3112
3323
|
{
|
|
3113
3324
|
disabled: disable == true ? true : false,
|
|
@@ -3115,26 +3326,94 @@ var SCMenu = ({ header, options, defaultOption, disable, widthMenu, heightMenu,
|
|
|
3115
3326
|
selected: String(index + 1) === selectedIndex,
|
|
3116
3327
|
onClick: (event2) => handleClickMenusItem(event2, index)
|
|
3117
3328
|
},
|
|
3118
|
-
option.iconLeft ? /* @__PURE__ */
|
|
3119
|
-
/* @__PURE__ */
|
|
3120
|
-
), option.divider == true ? /* @__PURE__ */
|
|
3329
|
+
option.iconLeft ? /* @__PURE__ */ React29.createElement(ListItemIcon5, { sx: { color: String(index + 1) === selectedIndex ? "primary" : "active" } }, /* @__PURE__ */ React29.createElement(SvgIcon7, { fontSize: "small", color: String(index + 1) === selectedIndex ? "primary" : "action", component: option.iconLeft })) : "",
|
|
3330
|
+
/* @__PURE__ */ React29.createElement(Grid10, { container: true, size: 12, sx: { maxWidth: 220, flexWrap: "noWrap", alignItems: "center" } }, /* @__PURE__ */ React29.createElement(Typography16, { noWrap: true, variant: "caption", color: String(index + 1) === selectedIndex ? "primary" : "active" }, option.name), option.iconRight ? /* @__PURE__ */ React29.createElement(ListItemIcon5, { sx: { minWidth: "0px !important", color: String(index + 1) === selectedIndex ? "primary" : "active" } }, /* @__PURE__ */ React29.createElement(SvgIcon7, { fontSize: "small", color: String(index + 1) === selectedIndex ? "primary" : "action", component: option.iconRight })) : "")
|
|
3331
|
+
), option.divider == true ? /* @__PURE__ */ React29.createElement(Divider5, null) : "")))), /* @__PURE__ */ React29.createElement(Grid10, { container: true }, options.map((option, index) => option.page ? String(index + 1) == value ? /* @__PURE__ */ React29.createElement(Box15, { "data-testid": "menu-page-content", sx: { padding: "16px", width: pageSize, height: heightContainer }, key: index }, option.page) : "" : /* @__PURE__ */ React29.createElement(Typography16, { color: "error" }, "No se ha configurado el componente a visualizar")))));
|
|
3332
|
+
};
|
|
3333
|
+
|
|
3334
|
+
// src/Components/Menu/Menu.tsx
|
|
3335
|
+
import React30, { useCallback as useCallback4, useState as useState16 } from "react";
|
|
3336
|
+
import { Button as Button13, Menu } from "@mui/material";
|
|
3337
|
+
var BasicMenu = ({
|
|
3338
|
+
open,
|
|
3339
|
+
onClose,
|
|
3340
|
+
button,
|
|
3341
|
+
anchorEl,
|
|
3342
|
+
handleClick,
|
|
3343
|
+
options
|
|
3344
|
+
}) => {
|
|
3345
|
+
var _a, _b, _c, _d;
|
|
3346
|
+
const [internalAnchorEl, setInternalAnchorEl] = useState16(null);
|
|
3347
|
+
const [internalOpen, setInternalOpen] = useState16(open != null ? open : false);
|
|
3348
|
+
const isControlled = Boolean(onClose);
|
|
3349
|
+
const menuOpen = isControlled ? open != null ? open : false : internalOpen;
|
|
3350
|
+
const setMenuOpen = isControlled ? () => {
|
|
3351
|
+
} : setInternalOpen;
|
|
3352
|
+
const menuAnchorEl = anchorEl != null ? anchorEl : internalAnchorEl;
|
|
3353
|
+
const actualOpen = Boolean(menuAnchorEl) && menuOpen;
|
|
3354
|
+
const handleButtonClick = useCallback4((event2) => {
|
|
3355
|
+
if (handleClick) {
|
|
3356
|
+
handleClick(event2);
|
|
3357
|
+
} else {
|
|
3358
|
+
setInternalAnchorEl(event2.currentTarget);
|
|
3359
|
+
if (!isControlled) {
|
|
3360
|
+
setMenuOpen(true);
|
|
3361
|
+
}
|
|
3362
|
+
}
|
|
3363
|
+
}, [handleClick, setMenuOpen, isControlled]);
|
|
3364
|
+
const handleMenuClose = useCallback4(() => {
|
|
3365
|
+
if (onClose) {
|
|
3366
|
+
onClose();
|
|
3367
|
+
} else {
|
|
3368
|
+
setInternalAnchorEl(null);
|
|
3369
|
+
setMenuOpen(false);
|
|
3370
|
+
}
|
|
3371
|
+
}, [onClose, setMenuOpen]);
|
|
3372
|
+
return /* @__PURE__ */ React30.createElement("div", null, /* @__PURE__ */ React30.createElement(
|
|
3373
|
+
Button13,
|
|
3374
|
+
{
|
|
3375
|
+
id: "basic-button",
|
|
3376
|
+
"aria-controls": actualOpen ? "basic-menu" : void 0,
|
|
3377
|
+
"aria-haspopup": "true",
|
|
3378
|
+
"aria-expanded": actualOpen ? "true" : void 0,
|
|
3379
|
+
onClick: handleButtonClick,
|
|
3380
|
+
color: (_a = button == null ? void 0 : button.color) != null ? _a : "primary",
|
|
3381
|
+
variant: (_b = button == null ? void 0 : button.variant) != null ? _b : "text",
|
|
3382
|
+
size: (_c = button == null ? void 0 : button.size) != null ? _c : "small"
|
|
3383
|
+
},
|
|
3384
|
+
capitalize((_d = button == null ? void 0 : button.text) != null ? _d : "Menu")
|
|
3385
|
+
), /* @__PURE__ */ React30.createElement(
|
|
3386
|
+
Menu,
|
|
3387
|
+
{
|
|
3388
|
+
id: "basic-menu",
|
|
3389
|
+
anchorEl: menuAnchorEl,
|
|
3390
|
+
open: actualOpen,
|
|
3391
|
+
onClose: handleMenuClose,
|
|
3392
|
+
slotProps: {
|
|
3393
|
+
list: {
|
|
3394
|
+
"aria-labelledby": "basic-button"
|
|
3395
|
+
}
|
|
3396
|
+
}
|
|
3397
|
+
},
|
|
3398
|
+
options || null
|
|
3399
|
+
));
|
|
3121
3400
|
};
|
|
3122
3401
|
|
|
3123
3402
|
// src/Components/SCTabs.tsx
|
|
3124
|
-
import
|
|
3125
|
-
import { Typography as Typography17, Box as
|
|
3403
|
+
import React31, { useEffect as useEffect18 } from "react";
|
|
3404
|
+
import { Typography as Typography17, Box as Box16, SvgIcon as SvgIcon8, Tab as Tab2, Tabs as Tabs2, Badge } from "@mui/material";
|
|
3126
3405
|
import TabPanel from "@mui/lab/TabPanel";
|
|
3127
3406
|
import TabContext from "@mui/lab/TabContext";
|
|
3128
3407
|
import * as Muicon8 from "@mui/icons-material";
|
|
3129
3408
|
var SCTabs = ({ options, defaultOption, typeIcon, background, iconPosition, colorTab, orientation, variant, scrollButtons, children }) => {
|
|
3130
|
-
const [toast, setToast] =
|
|
3409
|
+
const [toast, setToast] = React31.useState(null);
|
|
3131
3410
|
let i = 0;
|
|
3132
3411
|
let j = 0;
|
|
3133
3412
|
let k = 0;
|
|
3134
3413
|
let l = 0;
|
|
3135
3414
|
let validateTypeIcon = true;
|
|
3136
|
-
const [value, setValue] =
|
|
3137
|
-
|
|
3415
|
+
const [value, setValue] = React31.useState("1");
|
|
3416
|
+
useEffect18(() => {
|
|
3138
3417
|
if (defaultOption) {
|
|
3139
3418
|
handleChange(event, void 0);
|
|
3140
3419
|
}
|
|
@@ -3184,7 +3463,7 @@ var SCTabs = ({ options, defaultOption, typeIcon, background, iconPosition, colo
|
|
|
3184
3463
|
setValue(newValue);
|
|
3185
3464
|
}
|
|
3186
3465
|
};
|
|
3187
|
-
return /* @__PURE__ */
|
|
3466
|
+
return /* @__PURE__ */ React31.createElement(React31.Fragment, null, validateTypeIcon == true ? /* @__PURE__ */ React31.createElement(Box16, { sx: { height: orientation == "vertical" ? "100%" : "auto", display: "flex", flexDirection: orientation == "vertical" ? "row" : "column" }, id: "tabsitos" }, /* @__PURE__ */ React31.createElement(TabContext, { value }, /* @__PURE__ */ React31.createElement(
|
|
3188
3467
|
Tabs2,
|
|
3189
3468
|
{
|
|
3190
3469
|
"data-testid": "tab-container",
|
|
@@ -3198,7 +3477,7 @@ var SCTabs = ({ options, defaultOption, typeIcon, background, iconPosition, colo
|
|
|
3198
3477
|
orientation: orientation || "horizontal",
|
|
3199
3478
|
sx: { borderBottom: orientation == "vertical" ? 0 : 1, borderRight: orientation == "vertical" ? 1 : 0, borderColor: "divider", background: background || "" }
|
|
3200
3479
|
},
|
|
3201
|
-
options.map((option) => /* @__PURE__ */
|
|
3480
|
+
options.map((option) => /* @__PURE__ */ React31.createElement(
|
|
3202
3481
|
Tab2,
|
|
3203
3482
|
{
|
|
3204
3483
|
"data-testid": "tab-item",
|
|
@@ -3207,7 +3486,7 @@ var SCTabs = ({ options, defaultOption, typeIcon, background, iconPosition, colo
|
|
|
3207
3486
|
label: option.name || "",
|
|
3208
3487
|
disabled: option.disabled || false,
|
|
3209
3488
|
iconPosition: iconPosition || "end",
|
|
3210
|
-
icon: typeIcon == "badge" ? /* @__PURE__ */
|
|
3489
|
+
icon: typeIcon == "badge" ? /* @__PURE__ */ React31.createElement(
|
|
3211
3490
|
Badge,
|
|
3212
3491
|
{
|
|
3213
3492
|
sx: {
|
|
@@ -3222,29 +3501,29 @@ var SCTabs = ({ options, defaultOption, typeIcon, background, iconPosition, colo
|
|
|
3222
3501
|
badgeContent: option.iconOrBadge,
|
|
3223
3502
|
color: value == String(i) ? colorTab ? colorTab : "primary" : "default"
|
|
3224
3503
|
}
|
|
3225
|
-
) : typeIcon == "icon" ? /* @__PURE__ */
|
|
3504
|
+
) : typeIcon == "icon" ? /* @__PURE__ */ React31.createElement(SvgIcon8, { fontSize: "small", component: option.iconOrBadge, color: value == String(i) ? colorTab ? colorTab : "primary" : "action", sx: { width: "20px", height: "20px" } }) : "",
|
|
3226
3505
|
sx: { "& .MuiTab-icon": { margin: "0px !important" }, padding: "10px 16px", gap: "4px" }
|
|
3227
3506
|
}
|
|
3228
3507
|
))
|
|
3229
|
-
), children, options.map((option) => /* @__PURE__ */
|
|
3508
|
+
), children, options.map((option) => /* @__PURE__ */ React31.createElement(
|
|
3230
3509
|
TabPanel,
|
|
3231
3510
|
{
|
|
3232
3511
|
key: k = k + 1,
|
|
3233
3512
|
value: String(l = l + 1),
|
|
3234
3513
|
sx: { padding: "16px" }
|
|
3235
3514
|
},
|
|
3236
|
-
option.page ? option.page : /* @__PURE__ */
|
|
3237
|
-
)))) : /* @__PURE__ */
|
|
3515
|
+
option.page ? option.page : /* @__PURE__ */ React31.createElement(Typography17, null, "No se ha configurado el componente a visualizar ")
|
|
3516
|
+
)))) : /* @__PURE__ */ React31.createElement(Box16, { sx: { height: "200px" } }, toast && /* @__PURE__ */ React31.createElement(SCToastNotification, __spreadValues({ "data-testid": "error-tab-message" }, toast))));
|
|
3238
3517
|
};
|
|
3239
3518
|
|
|
3240
3519
|
// src/Components/Calendario/Calendar.tsx
|
|
3241
|
-
import
|
|
3242
|
-
import { Box as
|
|
3520
|
+
import React39, { useEffect as useEffect19, useState as useState19 } from "react";
|
|
3521
|
+
import { Box as Box23, CircularProgress as CircularProgress5 } from "@mui/material";
|
|
3243
3522
|
|
|
3244
3523
|
// src/Components/Calendario/CalendarToolbar.tsx
|
|
3245
|
-
import
|
|
3524
|
+
import React32, { useState as useState17 } from "react";
|
|
3246
3525
|
import { ChevronLeft, ChevronRight, KeyboardArrowDown as KeyboardArrowDown2, LightModeOutlined } from "@mui/icons-material";
|
|
3247
|
-
import { Box as
|
|
3526
|
+
import { Box as Box17, Chip as Chip5, IconButton as IconButton12, Menu as Menu2, MenuItem as MenuItem7, Stack as Stack11, Typography as Typography18 } from "@mui/material";
|
|
3248
3527
|
import dayjs2 from "dayjs";
|
|
3249
3528
|
import updateLocale from "dayjs/plugin/updateLocale";
|
|
3250
3529
|
import "dayjs/locale/es";
|
|
@@ -3261,7 +3540,7 @@ var CalendarToolbar = ({
|
|
|
3261
3540
|
onNavigate,
|
|
3262
3541
|
children
|
|
3263
3542
|
}) => {
|
|
3264
|
-
const [anchorEl, setAnchorEl] =
|
|
3543
|
+
const [anchorEl, setAnchorEl] = useState17(null);
|
|
3265
3544
|
const open = Boolean(anchorEl);
|
|
3266
3545
|
const handleMenuOpen = (event2) => {
|
|
3267
3546
|
setAnchorEl(event2.currentTarget);
|
|
@@ -3284,16 +3563,16 @@ var CalendarToolbar = ({
|
|
|
3284
3563
|
}
|
|
3285
3564
|
return labelDate.format(" DD MMMM YYYY");
|
|
3286
3565
|
};
|
|
3287
|
-
return /* @__PURE__ */
|
|
3288
|
-
|
|
3566
|
+
return /* @__PURE__ */ React32.createElement(Stack11, { direction: "row", alignItems: "center", justifyContent: "space-between", gap: 0.5, px: 1, py: 0.5 }, /* @__PURE__ */ React32.createElement(Box17, null, /* @__PURE__ */ React32.createElement(
|
|
3567
|
+
Chip5,
|
|
3289
3568
|
{
|
|
3290
3569
|
label: "Hoy",
|
|
3291
|
-
icon: /* @__PURE__ */
|
|
3570
|
+
icon: /* @__PURE__ */ React32.createElement(LightModeOutlined, { fontSize: "small" }),
|
|
3292
3571
|
color: "primary",
|
|
3293
3572
|
onClick: () => onNavigate("TODAY")
|
|
3294
3573
|
}
|
|
3295
|
-
)), /* @__PURE__ */
|
|
3296
|
-
|
|
3574
|
+
)), /* @__PURE__ */ React32.createElement(Stack11, { direction: "row", alignItems: "center", gap: 1 }, /* @__PURE__ */ React32.createElement(IconButton12, { "aria-label": "Anterior", onClick: () => onNavigate("PREV"), size: "small", color: "primary" }, /* @__PURE__ */ React32.createElement(ChevronLeft, { fontSize: "small" })), /* @__PURE__ */ React32.createElement(IconButton12, { "aria-label": "Siguiente", onClick: () => onNavigate("NEXT"), size: "small", color: "primary" }, /* @__PURE__ */ React32.createElement(ChevronRight, { fontSize: "small" })), /* @__PURE__ */ React32.createElement(Typography18, { variant: "h6", color: "primary", "data-testid": "currentDate" }, getFormattedDate()), /* @__PURE__ */ React32.createElement(IconButton12, { onClick: handleMenuOpen, size: "small", color: "primary", "aria-label": "Cambiar vista" }, /* @__PURE__ */ React32.createElement(KeyboardArrowDown2, { fontSize: "small" })), /* @__PURE__ */ React32.createElement(
|
|
3575
|
+
Menu2,
|
|
3297
3576
|
{
|
|
3298
3577
|
anchorEl,
|
|
3299
3578
|
open,
|
|
@@ -3301,19 +3580,18 @@ var CalendarToolbar = ({
|
|
|
3301
3580
|
anchorOrigin: { vertical: "bottom", horizontal: "center" },
|
|
3302
3581
|
transformOrigin: { vertical: "top", horizontal: "center" }
|
|
3303
3582
|
},
|
|
3304
|
-
/* @__PURE__ */
|
|
3305
|
-
/* @__PURE__ */
|
|
3306
|
-
/* @__PURE__ */
|
|
3307
|
-
)), children ? /* @__PURE__ */
|
|
3583
|
+
/* @__PURE__ */ React32.createElement(MenuItem7, { onClick: () => handleViewChange("month") }, "Mes"),
|
|
3584
|
+
/* @__PURE__ */ React32.createElement(MenuItem7, { onClick: () => handleViewChange("week") }, "Semana"),
|
|
3585
|
+
/* @__PURE__ */ React32.createElement(MenuItem7, { onClick: () => handleViewChange("day") }, "D\xEDa")
|
|
3586
|
+
)), children ? /* @__PURE__ */ React32.createElement(Box17, null, children) : /* @__PURE__ */ React32.createElement(Box17, { width: "24px" }), " ");
|
|
3308
3587
|
};
|
|
3309
3588
|
|
|
3310
3589
|
// src/Components/Calendario/Views/MonthView.tsx
|
|
3311
|
-
import
|
|
3312
|
-
import { Box as
|
|
3590
|
+
import React36 from "react";
|
|
3591
|
+
import { Box as Box20, Typography as Typography21, IconButton as IconButton13, Paper as Paper3, Tooltip as Tooltip6, Stack as Stack13, CircularProgress as CircularProgress2 } from "@mui/material";
|
|
3313
3592
|
import AddIcon from "@mui/icons-material/Add";
|
|
3314
|
-
import
|
|
3593
|
+
import dayjs5 from "dayjs";
|
|
3315
3594
|
import localeData from "dayjs/plugin/localeData";
|
|
3316
|
-
import isBetween from "dayjs/plugin/isBetween";
|
|
3317
3595
|
|
|
3318
3596
|
// src/Components/Calendario/Utils.tsx
|
|
3319
3597
|
import dayjs3 from "dayjs";
|
|
@@ -3341,10 +3619,10 @@ var stateColors = {
|
|
|
3341
3619
|
};
|
|
3342
3620
|
|
|
3343
3621
|
// src/Components/Calendario/Event.tsx
|
|
3344
|
-
import
|
|
3345
|
-
import { Box as
|
|
3622
|
+
import React33 from "react";
|
|
3623
|
+
import { Box as Box18, Stack as Stack12, Typography as Typography19, Divider as Divider6, Popover as Popover5 } from "@mui/material";
|
|
3346
3624
|
var CalendarEventCard = ({ event: event2, color, sx, onClick, onHover }) => {
|
|
3347
|
-
const [anchorEl, setAnchorEl] =
|
|
3625
|
+
const [anchorEl, setAnchorEl] = React33.useState(null);
|
|
3348
3626
|
const handlePopoverOpen = (event3) => {
|
|
3349
3627
|
setAnchorEl(event3.currentTarget);
|
|
3350
3628
|
};
|
|
@@ -3352,8 +3630,8 @@ var CalendarEventCard = ({ event: event2, color, sx, onClick, onHover }) => {
|
|
|
3352
3630
|
setAnchorEl(null);
|
|
3353
3631
|
};
|
|
3354
3632
|
const open = Boolean(anchorEl);
|
|
3355
|
-
return /* @__PURE__ */
|
|
3356
|
-
|
|
3633
|
+
return /* @__PURE__ */ React33.createElement(
|
|
3634
|
+
Stack12,
|
|
3357
3635
|
{
|
|
3358
3636
|
direction: "row",
|
|
3359
3637
|
padding: 0.5,
|
|
@@ -3373,7 +3651,7 @@ var CalendarEventCard = ({ event: event2, color, sx, onClick, onHover }) => {
|
|
|
3373
3651
|
cursor: onClick ? "pointer" : "default"
|
|
3374
3652
|
}, sx)
|
|
3375
3653
|
},
|
|
3376
|
-
/* @__PURE__ */
|
|
3654
|
+
/* @__PURE__ */ React33.createElement(
|
|
3377
3655
|
Divider6,
|
|
3378
3656
|
{
|
|
3379
3657
|
orientation: "vertical",
|
|
@@ -3385,8 +3663,8 @@ var CalendarEventCard = ({ event: event2, color, sx, onClick, onHover }) => {
|
|
|
3385
3663
|
}
|
|
3386
3664
|
}
|
|
3387
3665
|
),
|
|
3388
|
-
/* @__PURE__ */
|
|
3389
|
-
|
|
3666
|
+
/* @__PURE__ */ React33.createElement(
|
|
3667
|
+
Box18,
|
|
3390
3668
|
{
|
|
3391
3669
|
px: 1,
|
|
3392
3670
|
py: 0.5,
|
|
@@ -3395,7 +3673,7 @@ var CalendarEventCard = ({ event: event2, color, sx, onClick, onHover }) => {
|
|
|
3395
3673
|
display: "flex",
|
|
3396
3674
|
alignItems: "center"
|
|
3397
3675
|
},
|
|
3398
|
-
/* @__PURE__ */
|
|
3676
|
+
/* @__PURE__ */ React33.createElement(
|
|
3399
3677
|
Typography19,
|
|
3400
3678
|
{
|
|
3401
3679
|
color: "text.primary",
|
|
@@ -3411,7 +3689,7 @@ var CalendarEventCard = ({ event: event2, color, sx, onClick, onHover }) => {
|
|
|
3411
3689
|
},
|
|
3412
3690
|
event2.title.charAt(0).toUpperCase() + event2.title.slice(1).toLowerCase()
|
|
3413
3691
|
),
|
|
3414
|
-
/* @__PURE__ */
|
|
3692
|
+
/* @__PURE__ */ React33.createElement(
|
|
3415
3693
|
Popover5,
|
|
3416
3694
|
{
|
|
3417
3695
|
id: "mouse-over-popover",
|
|
@@ -3436,40 +3714,154 @@ var CalendarEventCard = ({ event: event2, color, sx, onClick, onHover }) => {
|
|
|
3436
3714
|
};
|
|
3437
3715
|
|
|
3438
3716
|
// src/assets/LogoCalendario.tsx
|
|
3439
|
-
import
|
|
3717
|
+
import React34 from "react";
|
|
3440
3718
|
var LogoCalendario = () => {
|
|
3441
|
-
return /* @__PURE__ */
|
|
3719
|
+
return /* @__PURE__ */ React34.createElement("svg", { width: "60", height: "61", viewBox: "0 0 60 61", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, /* @__PURE__ */ React34.createElement("g", { "clip-path": "url(#clip0_5353_24891)" }, /* @__PURE__ */ React34.createElement("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M40.7361 11.1589C39.7792 11.1589 39.0106 11.9722 39.0106 12.9661V15.4375H20.0309V12.9661C20.0309 11.964 19.2545 11.1589 18.3055 11.1589C17.3487 11.1589 16.5801 11.9722 16.5801 12.9661V15.4375H12.8819C12.0652 15.4375 11.4038 16.0918 11.4038 16.8998V20.6551C11.4038 21.463 12.0652 22.1174 12.8819 22.1174H46.8383C47.655 22.1174 48.3165 21.463 48.3165 20.6551V16.8998C48.3165 16.0918 47.655 15.4375 46.8383 15.4375H42.4615V12.9661C42.4615 11.964 41.6851 11.1589 40.7361 11.1589ZM19.4827 19.2049C19.6528 19.1343 19.7361 19.006 19.7724 18.8352C19.6916 18.9714 19.594 19.0957 19.4827 19.2049Z", fill: "#00BCD4" }), /* @__PURE__ */ React34.createElement("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M14.2037 25.8653C13.7579 25.8653 13.425 26.2168 13.425 26.6093V47.3669C13.425 47.7595 13.7579 48.1109 14.2037 48.1109H46.0004C46.4782 48.1109 46.8656 47.7236 46.8656 47.2458V26.6093C46.8656 26.2168 46.5327 25.8653 46.087 25.8653H14.2037ZM11.6948 26.6093C11.6948 25.2255 12.8384 24.135 14.2037 24.135H46.087C47.4522 24.135 48.5959 25.2255 48.5959 26.6093V47.2458C48.5959 48.6792 47.4339 49.8412 46.0004 49.8412H14.2037C12.8384 49.8412 11.6948 48.7508 11.6948 47.3669V26.6093Z", fill: "#6392BD" }), /* @__PURE__ */ React34.createElement("path", { d: "M19.481 30.9138C19.481 30.5164 20.1155 30.1903 20.9058 30.1903C21.6894 30.1903 22.3305 30.5131 22.3305 30.9138V32.8862C22.3305 33.2836 21.6894 33.6097 20.9058 33.6097C20.1222 33.6097 19.481 33.2869 19.481 32.8862V30.9138Z", fill: "#6392BD" }), /* @__PURE__ */ React34.createElement("path", { d: "M30.0242 30.1903C29.2339 30.1903 28.5995 30.5164 28.5995 30.9138V32.8862C28.5995 33.2869 29.2406 33.6097 30.0242 33.6097C30.8079 33.6097 31.449 33.2836 31.449 32.8862V30.9138C31.449 30.5131 30.8079 30.1903 30.0242 30.1903Z", fill: "#6392BD" }), /* @__PURE__ */ React34.createElement("path", { d: "M37.7179 30.9138C37.7179 30.5164 38.3524 30.1903 39.1427 30.1903C39.608 30.1903 40.022 30.3038 40.2825 30.4797C40.3515 30.5276 40.4116 30.5788 40.4561 30.6344C40.5274 30.7201 40.5675 30.8147 40.5675 30.9138V32.8862C40.5675 33.2836 39.9263 33.6097 39.1427 33.6097C38.3591 33.6097 37.7179 33.2869 37.7179 32.8862V30.9138Z", fill: "#6392BD" }), /* @__PURE__ */ React34.createElement("path", { d: "M20.9058 39.8787C20.1155 39.8787 19.481 40.2048 19.481 40.6022V42.5746C19.481 42.687 19.5322 42.7927 19.6213 42.8874C19.7036 42.9731 19.8172 43.0499 19.9552 43.1122C20.2068 43.228 20.5407 43.2981 20.9058 43.2981C21.6894 43.2981 22.3305 42.972 22.3305 42.5746V40.6022C22.3305 40.2015 21.6894 39.8787 20.9058 39.8787Z", fill: "#6392BD" }), /* @__PURE__ */ React34.createElement("path", { d: "M29.524 39.9477C29.7087 39.9032 29.9158 39.8787 30.1339 39.8787C30.9176 39.8787 31.5587 40.2015 31.5587 40.6022V42.5746C31.5587 42.972 30.9176 43.2981 30.1339 43.2981C29.3503 43.2981 28.7092 42.9753 28.7092 42.5746V40.6022C28.7092 40.315 29.0409 40.0646 29.524 39.9477Z", fill: "#6392BD" }), /* @__PURE__ */ React34.createElement("path", { d: "M38.5141 39.9482C38.6989 39.9037 38.9059 39.8792 39.1241 39.8792C39.9077 39.8792 40.5488 40.202 40.5488 40.6027V42.5751C40.5488 42.9725 39.9077 43.2986 39.1241 43.2986C38.3405 43.2986 37.6993 42.9758 37.6993 42.5751V40.6027C37.6993 40.3155 38.031 40.0651 38.5141 39.9482Z", fill: "#6392BD" })), /* @__PURE__ */ React34.createElement("defs", null, /* @__PURE__ */ React34.createElement("clipPath", { id: "clip0_5353_24891" }, /* @__PURE__ */ React34.createElement("rect", { width: "60", height: "60", fill: "white", transform: "translate(0 0.5)" }))));
|
|
3442
3720
|
};
|
|
3443
3721
|
|
|
3444
|
-
// src/Components/Calendario/
|
|
3445
|
-
|
|
3722
|
+
// src/Components/Calendario/components/DayEventsList.tsx
|
|
3723
|
+
import React35 from "react";
|
|
3724
|
+
import { Box as Box19, Typography as Typography20, Divider as Divider7 } from "@mui/material";
|
|
3725
|
+
var DayEventsList = ({
|
|
3726
|
+
events,
|
|
3727
|
+
day,
|
|
3728
|
+
onEventClick,
|
|
3729
|
+
onEventHover
|
|
3730
|
+
}) => {
|
|
3731
|
+
const [first, ...rest] = events;
|
|
3732
|
+
return /* @__PURE__ */ React35.createElement(Box19, { display: "flex", width: "100%", flexDirection: "column", height: "100%", pr: 1.5 }, /* @__PURE__ */ React35.createElement(Typography20, { width: "100%", color: "text.secondary" }, "Proximo evento"), first && /* @__PURE__ */ React35.createElement(Box19, { p: 1, pb: 1, width: "100%" }, /* @__PURE__ */ React35.createElement(
|
|
3733
|
+
CalendarEventCard,
|
|
3734
|
+
{
|
|
3735
|
+
event: first,
|
|
3736
|
+
color: stateColors[first.state],
|
|
3737
|
+
onClick: () => onEventClick == null ? void 0 : onEventClick(first, day),
|
|
3738
|
+
onHover: onEventHover,
|
|
3739
|
+
sx: {
|
|
3740
|
+
whiteSpace: "normal",
|
|
3741
|
+
"& .MuiTypography-root": {
|
|
3742
|
+
whiteSpace: "normal",
|
|
3743
|
+
overflow: "visible",
|
|
3744
|
+
textOverflow: "unset"
|
|
3745
|
+
}
|
|
3746
|
+
}
|
|
3747
|
+
}
|
|
3748
|
+
)), /* @__PURE__ */ React35.createElement(Divider7, { flexItem: true, sx: { width: "100%" } }), /* @__PURE__ */ React35.createElement(Typography20, { width: "100%", py: 1, color: "text.secondary" }, "Eventos restantes"), /* @__PURE__ */ React35.createElement(
|
|
3749
|
+
Box19,
|
|
3750
|
+
{
|
|
3751
|
+
width: "100%",
|
|
3752
|
+
height: "100%",
|
|
3753
|
+
flex: 1,
|
|
3754
|
+
overflow: "auto",
|
|
3755
|
+
p: 1,
|
|
3756
|
+
pt: 1,
|
|
3757
|
+
display: "flex",
|
|
3758
|
+
flexDirection: "column",
|
|
3759
|
+
gap: 1.5
|
|
3760
|
+
},
|
|
3761
|
+
rest.map((event2) => /* @__PURE__ */ React35.createElement(
|
|
3762
|
+
CalendarEventCard,
|
|
3763
|
+
{
|
|
3764
|
+
key: `${event2.id}-${day.toString()}`,
|
|
3765
|
+
event: event2,
|
|
3766
|
+
color: stateColors[event2.state],
|
|
3767
|
+
onClick: () => onEventClick == null ? void 0 : onEventClick(event2, day),
|
|
3768
|
+
onHover: onEventHover,
|
|
3769
|
+
sx: {
|
|
3770
|
+
whiteSpace: "normal",
|
|
3771
|
+
"& .MuiTypography-root": {
|
|
3772
|
+
whiteSpace: "normal",
|
|
3773
|
+
overflow: "visible",
|
|
3774
|
+
textOverflow: "unset"
|
|
3775
|
+
}
|
|
3776
|
+
}
|
|
3777
|
+
}
|
|
3778
|
+
))
|
|
3779
|
+
));
|
|
3780
|
+
};
|
|
3781
|
+
|
|
3782
|
+
// src/Components/Calendario/Constants.ts
|
|
3783
|
+
var CALENDAR_CONSTANTS = {
|
|
3784
|
+
GRID_TEMPLATE: "repeat(7, minmax(150px, 1fr))",
|
|
3785
|
+
DAY_HEIGHT: 60,
|
|
3786
|
+
SIDEBAR_WIDTH: 47,
|
|
3787
|
+
MIN_CELL_HEIGHT: 120,
|
|
3788
|
+
DEFAULT_START_HOUR: 0,
|
|
3789
|
+
DEFAULT_END_HOUR: 23,
|
|
3790
|
+
DRAWER_WIDTH: "350px",
|
|
3791
|
+
MAX_VISIBLE_EVENTS: 2,
|
|
3792
|
+
MIN_WIDTH: "1050px",
|
|
3793
|
+
LOADING_SPINNER_SIZE: "60px",
|
|
3794
|
+
LOADING_CONTAINER_HEIGHT: "450px",
|
|
3795
|
+
DAY_CIRCLE_SIZE: 24
|
|
3796
|
+
};
|
|
3797
|
+
|
|
3798
|
+
// src/Components/Calendario/utils/EventCalculations.ts
|
|
3799
|
+
import dayjs4 from "dayjs";
|
|
3800
|
+
import isBetween from "dayjs/plugin/isBetween";
|
|
3446
3801
|
dayjs4.extend(isBetween);
|
|
3802
|
+
var filterEventsForDay = (events, day) => {
|
|
3803
|
+
return events.filter(
|
|
3804
|
+
(event2) => day.isBetween(event2.start.startOf("day"), event2.end.endOf("day"), null, "[]")
|
|
3805
|
+
);
|
|
3806
|
+
};
|
|
3807
|
+
var getCellBorderType = (cellHour, dayEvents) => {
|
|
3808
|
+
for (const event2 of dayEvents) {
|
|
3809
|
+
const start = event2.start.hour() + event2.start.minute() / 60;
|
|
3810
|
+
const end = event2.end.hour() + event2.end.minute() / 60;
|
|
3811
|
+
const cellStart = cellHour;
|
|
3812
|
+
const cellEnd = cellHour + 1;
|
|
3813
|
+
if (cellEnd > start && cellStart < end) {
|
|
3814
|
+
if (Math.abs(cellStart - start) < 0.01 && Math.abs(cellEnd - end) < 0.01) return "full";
|
|
3815
|
+
if (Math.abs(cellStart - start) < 0.01) return "start";
|
|
3816
|
+
if (Math.abs(cellEnd - end) < 0.01) return "end";
|
|
3817
|
+
return "middle";
|
|
3818
|
+
}
|
|
3819
|
+
}
|
|
3820
|
+
return "none";
|
|
3821
|
+
};
|
|
3822
|
+
var clampEventToVisibleRange = (event2, currentDate, startHour, endHour) => {
|
|
3823
|
+
const eventStart = currentDate.isSame(event2.start, "day") ? event2.start : currentDate.startOf("day");
|
|
3824
|
+
const eventEnd = currentDate.isSame(event2.end, "day") ? event2.end : currentDate.endOf("day");
|
|
3825
|
+
const minStart = currentDate.hour(startHour).minute(0);
|
|
3826
|
+
const maxEnd = currentDate.hour(endHour).minute(0);
|
|
3827
|
+
const clampedStart = eventStart.isBefore(minStart) ? minStart : eventStart;
|
|
3828
|
+
const clampedEnd = eventEnd.isAfter(maxEnd) ? maxEnd : eventEnd;
|
|
3829
|
+
const startMinutes = (clampedStart.hour() - startHour) * 60 + clampedStart.minute();
|
|
3830
|
+
const durationMinutes = clampedEnd.diff(clampedStart, "minute");
|
|
3831
|
+
return {
|
|
3832
|
+
startMinutes,
|
|
3833
|
+
durationMinutes,
|
|
3834
|
+
clampedStart,
|
|
3835
|
+
clampedEnd
|
|
3836
|
+
};
|
|
3837
|
+
};
|
|
3838
|
+
|
|
3839
|
+
// src/Components/Calendario/Views/MonthView.tsx
|
|
3840
|
+
dayjs5.extend(localeData);
|
|
3447
3841
|
var MonthView = ({ events, isLoading, onDayClick, onMoreClick, currentDate, onEventClick, onEventHover }) => {
|
|
3448
3842
|
const noEvents = events.length === 0;
|
|
3449
3843
|
const days = getMonthDays(currentDate);
|
|
3450
|
-
const weekDays = Array.from({ length: 7 }, (_, i) =>
|
|
3451
|
-
const [openDrawer, setOpenDrawer] =
|
|
3452
|
-
const [selectedDay, setSelectedDay] =
|
|
3453
|
-
const [selectedEvents, setSelectedEvents] =
|
|
3454
|
-
return /* @__PURE__ */
|
|
3844
|
+
const weekDays = Array.from({ length: 7 }, (_, i) => dayjs5().day(i));
|
|
3845
|
+
const [openDrawer, setOpenDrawer] = React36.useState(false);
|
|
3846
|
+
const [selectedDay, setSelectedDay] = React36.useState(null);
|
|
3847
|
+
const [selectedEvents, setSelectedEvents] = React36.useState([]);
|
|
3848
|
+
return /* @__PURE__ */ React36.createElement(Box20, { width: "100%", sx: { overflowX: "auto" } }, /* @__PURE__ */ React36.createElement(Box20, { minWidth: CALENDAR_CONSTANTS.MIN_WIDTH }, /* @__PURE__ */ React36.createElement(Box20, { display: "grid", gridTemplateColumns: CALENDAR_CONSTANTS.GRID_TEMPLATE, gap: 0.5, mb: 1 }, weekDays.map((day) => /* @__PURE__ */ React36.createElement(Box20, { key: day.day(), textAlign: "center", py: 0.5 }, /* @__PURE__ */ React36.createElement(Typography21, { variant: "caption", color: "text.secondary" }, day.format("dddd"))))), isLoading ? /* @__PURE__ */ React36.createElement(Box20, { display: "flex", alignItems: "center", justifyContent: "center", width: "100%", height: CALENDAR_CONSTANTS.LOADING_CONTAINER_HEIGHT }, /* @__PURE__ */ React36.createElement(CircularProgress2, { sx: { width: CALENDAR_CONSTANTS.LOADING_SPINNER_SIZE, height: CALENDAR_CONSTANTS.LOADING_SPINNER_SIZE }, variant: "indeterminate" })) : !isLoading && noEvents ? /* @__PURE__ */ React36.createElement(
|
|
3455
3849
|
EmptyState,
|
|
3456
3850
|
{
|
|
3457
3851
|
title: "Inicia la gesti\xF3n de las actividades",
|
|
3458
3852
|
subtitle: "Selecciona un mec\xE1nico y as\xEDgnale las actividades a realizar.",
|
|
3459
|
-
icon: /* @__PURE__ */
|
|
3853
|
+
icon: /* @__PURE__ */ React36.createElement(LogoCalendario, null)
|
|
3460
3854
|
}
|
|
3461
|
-
) : /* @__PURE__ */
|
|
3462
|
-
const dayEvents = events
|
|
3463
|
-
(e) => day.isBetween(e.start.startOf("day"), e.end.endOf("day"), null, "[]")
|
|
3464
|
-
);
|
|
3855
|
+
) : /* @__PURE__ */ React36.createElement(Box20, { display: "grid", gridTemplateColumns: CALENDAR_CONSTANTS.GRID_TEMPLATE, gap: 0.5 }, days.map((day) => {
|
|
3856
|
+
const dayEvents = filterEventsForDay(events, day);
|
|
3465
3857
|
const isCurrentMonth = day.month() === currentDate.month();
|
|
3466
|
-
return /* @__PURE__ */
|
|
3858
|
+
return /* @__PURE__ */ React36.createElement(
|
|
3467
3859
|
Paper3,
|
|
3468
3860
|
{
|
|
3469
3861
|
key: day.toString(),
|
|
3470
3862
|
onClick: () => onDayClick == null ? void 0 : onDayClick(day),
|
|
3471
3863
|
sx: {
|
|
3472
|
-
minHeight:
|
|
3864
|
+
minHeight: CALENDAR_CONSTANTS.MIN_CELL_HEIGHT,
|
|
3473
3865
|
display: "flex",
|
|
3474
3866
|
flexDirection: "column",
|
|
3475
3867
|
justifyContent: "space-between",
|
|
@@ -3480,12 +3872,12 @@ var MonthView = ({ events, isLoading, onDayClick, onMoreClick, currentDate, onEv
|
|
|
3480
3872
|
overflow: "hidden"
|
|
3481
3873
|
}
|
|
3482
3874
|
},
|
|
3483
|
-
/* @__PURE__ */
|
|
3484
|
-
|
|
3875
|
+
/* @__PURE__ */ React36.createElement(Box20, { p: 1, flexShrink: 0 }, /* @__PURE__ */ React36.createElement(Box20, { display: "flex", alignItems: "center", justifyContent: "flex-start" }, /* @__PURE__ */ React36.createElement(
|
|
3876
|
+
Box20,
|
|
3485
3877
|
{
|
|
3486
3878
|
sx: {
|
|
3487
|
-
width:
|
|
3488
|
-
height:
|
|
3879
|
+
width: CALENDAR_CONSTANTS.DAY_CIRCLE_SIZE,
|
|
3880
|
+
height: CALENDAR_CONSTANTS.DAY_CIRCLE_SIZE,
|
|
3489
3881
|
borderRadius: "50%",
|
|
3490
3882
|
backgroundColor: isToday(day) ? "primary.main" : void 0,
|
|
3491
3883
|
display: "flex",
|
|
@@ -3493,16 +3885,16 @@ var MonthView = ({ events, isLoading, onDayClick, onMoreClick, currentDate, onEv
|
|
|
3493
3885
|
justifyContent: "center"
|
|
3494
3886
|
}
|
|
3495
3887
|
},
|
|
3496
|
-
/* @__PURE__ */
|
|
3497
|
-
|
|
3888
|
+
/* @__PURE__ */ React36.createElement(
|
|
3889
|
+
Typography21,
|
|
3498
3890
|
{
|
|
3499
3891
|
variant: "body2",
|
|
3500
3892
|
sx: { color: isToday(day) ? "white" : "text.secondary" }
|
|
3501
3893
|
},
|
|
3502
3894
|
day.date()
|
|
3503
3895
|
)
|
|
3504
|
-
), dayEvents.length >
|
|
3505
|
-
|
|
3896
|
+
), dayEvents.length > CALENDAR_CONSTANTS.MAX_VISIBLE_EVENTS && /* @__PURE__ */ React36.createElement(Tooltip6, { title: "M\xE1s eventos" }, /* @__PURE__ */ React36.createElement(
|
|
3897
|
+
IconButton13,
|
|
3506
3898
|
{
|
|
3507
3899
|
color: "primary",
|
|
3508
3900
|
size: "small",
|
|
@@ -3513,9 +3905,9 @@ var MonthView = ({ events, isLoading, onDayClick, onMoreClick, currentDate, onEv
|
|
|
3513
3905
|
setSelectedEvents(dayEvents);
|
|
3514
3906
|
}
|
|
3515
3907
|
},
|
|
3516
|
-
/* @__PURE__ */
|
|
3908
|
+
/* @__PURE__ */ React36.createElement(AddIcon, { fontSize: "small" })
|
|
3517
3909
|
)))),
|
|
3518
|
-
/* @__PURE__ */
|
|
3910
|
+
/* @__PURE__ */ React36.createElement(Box20, { display: "flex", flexDirection: "column", gap: 0.5, p: 1, pt: 0, overflow: "hidden" }, dayEvents.slice(0, CALENDAR_CONSTANTS.MAX_VISIBLE_EVENTS).map((event2) => /* @__PURE__ */ React36.createElement(
|
|
3519
3911
|
CalendarEventCard,
|
|
3520
3912
|
{
|
|
3521
3913
|
key: `${event2.id}-${day.toString()}`,
|
|
@@ -3525,8 +3917,8 @@ var MonthView = ({ events, isLoading, onDayClick, onMoreClick, currentDate, onEv
|
|
|
3525
3917
|
onHover: onEventHover
|
|
3526
3918
|
}
|
|
3527
3919
|
))),
|
|
3528
|
-
dayEvents.length >
|
|
3529
|
-
|
|
3920
|
+
dayEvents.length > CALENDAR_CONSTANTS.MAX_VISIBLE_EVENTS && /* @__PURE__ */ React36.createElement(
|
|
3921
|
+
Stack13,
|
|
3530
3922
|
{
|
|
3531
3923
|
justifyItems: "center",
|
|
3532
3924
|
px: 1,
|
|
@@ -3534,67 +3926,25 @@ var MonthView = ({ events, isLoading, onDayClick, onMoreClick, currentDate, onEv
|
|
|
3534
3926
|
onClick: (e) => e.stopPropagation(),
|
|
3535
3927
|
sx: { "& .MuiButtonBase-root": { width: "100%" } }
|
|
3536
3928
|
},
|
|
3537
|
-
/* @__PURE__ */
|
|
3929
|
+
/* @__PURE__ */ React36.createElement(
|
|
3538
3930
|
SCDrawer,
|
|
3539
3931
|
{
|
|
3540
|
-
width:
|
|
3932
|
+
width: CALENDAR_CONSTANTS.DRAWER_WIDTH,
|
|
3541
3933
|
title: day.format("DD [de] MMMM YYYY"),
|
|
3542
3934
|
open: openDrawer,
|
|
3543
3935
|
buttonDrawer: { text: `+ ${dayEvents.length}` },
|
|
3544
3936
|
anchor: "right",
|
|
3545
3937
|
actions: false,
|
|
3546
3938
|
arrayElements: [{
|
|
3547
|
-
component:
|
|
3548
|
-
|
|
3549
|
-
|
|
3550
|
-
|
|
3551
|
-
|
|
3552
|
-
|
|
3553
|
-
|
|
3554
|
-
|
|
3555
|
-
|
|
3556
|
-
sx: {
|
|
3557
|
-
whiteSpace: "normal",
|
|
3558
|
-
"& .MuiTypography-root": {
|
|
3559
|
-
whiteSpace: "normal",
|
|
3560
|
-
overflow: "visible",
|
|
3561
|
-
textOverflow: "unset"
|
|
3562
|
-
}
|
|
3563
|
-
}
|
|
3564
|
-
}
|
|
3565
|
-
)), /* @__PURE__ */ React29.createElement(Divider7, { flexItem: true, sx: { width: "100%" } }), /* @__PURE__ */ React29.createElement(Typography20, { width: "100%", py: 1, color: "text.secondary" }, " Eventos restantes "), /* @__PURE__ */ React29.createElement(
|
|
3566
|
-
Box18,
|
|
3567
|
-
{
|
|
3568
|
-
width: "100%",
|
|
3569
|
-
height: "100%",
|
|
3570
|
-
flex: 1,
|
|
3571
|
-
overflow: "auto",
|
|
3572
|
-
p: 1,
|
|
3573
|
-
pt: 1,
|
|
3574
|
-
display: "flex",
|
|
3575
|
-
flexDirection: "column",
|
|
3576
|
-
gap: 1.5
|
|
3577
|
-
},
|
|
3578
|
-
rest.map((event2) => /* @__PURE__ */ React29.createElement(
|
|
3579
|
-
CalendarEventCard,
|
|
3580
|
-
{
|
|
3581
|
-
key: `${event2.id}-${day.toString()}`,
|
|
3582
|
-
event: event2,
|
|
3583
|
-
color: stateColors[event2.state],
|
|
3584
|
-
onClick: () => onEventClick == null ? void 0 : onEventClick(event2, day),
|
|
3585
|
-
onHover: onEventHover,
|
|
3586
|
-
sx: {
|
|
3587
|
-
whiteSpace: "normal",
|
|
3588
|
-
"& .MuiTypography-root": {
|
|
3589
|
-
whiteSpace: "normal",
|
|
3590
|
-
overflow: "visible",
|
|
3591
|
-
textOverflow: "unset"
|
|
3592
|
-
}
|
|
3593
|
-
}
|
|
3594
|
-
}
|
|
3595
|
-
))
|
|
3596
|
-
));
|
|
3597
|
-
})()
|
|
3939
|
+
component: /* @__PURE__ */ React36.createElement(
|
|
3940
|
+
DayEventsList,
|
|
3941
|
+
{
|
|
3942
|
+
events: dayEvents,
|
|
3943
|
+
day,
|
|
3944
|
+
onEventClick,
|
|
3945
|
+
onEventHover
|
|
3946
|
+
}
|
|
3947
|
+
)
|
|
3598
3948
|
}]
|
|
3599
3949
|
}
|
|
3600
3950
|
)
|
|
@@ -3604,11 +3954,11 @@ var MonthView = ({ events, isLoading, onDayClick, onMoreClick, currentDate, onEv
|
|
|
3604
3954
|
};
|
|
3605
3955
|
|
|
3606
3956
|
// src/Components/Calendario/Views/WeekView.tsx
|
|
3607
|
-
import
|
|
3608
|
-
import { Box as
|
|
3609
|
-
import
|
|
3957
|
+
import React37 from "react";
|
|
3958
|
+
import { Box as Box21, CircularProgress as CircularProgress3, Typography as Typography22 } from "@mui/material";
|
|
3959
|
+
import dayjs6 from "dayjs";
|
|
3610
3960
|
import localeData2 from "dayjs/plugin/localeData";
|
|
3611
|
-
|
|
3961
|
+
dayjs6.extend(localeData2);
|
|
3612
3962
|
var WeekView = ({
|
|
3613
3963
|
events,
|
|
3614
3964
|
currentDate,
|
|
@@ -3620,11 +3970,11 @@ var WeekView = ({
|
|
|
3620
3970
|
endHour = 23
|
|
3621
3971
|
}) => {
|
|
3622
3972
|
const noEvents = events.length === 0;
|
|
3623
|
-
const todayString =
|
|
3973
|
+
const todayString = dayjs6().format("YYYY-MM-DD");
|
|
3624
3974
|
const startOfWeek3 = currentDate.startOf("week");
|
|
3625
3975
|
const days = Array.from({ length: 7 }, (_, i) => startOfWeek3.add(i, "day"));
|
|
3626
3976
|
const hours = Array.from({ length: endHour - startHour + 1 }, (_, i) => startHour + i);
|
|
3627
|
-
const
|
|
3977
|
+
const getCellBorderType2 = (cellHour, dayEvents) => {
|
|
3628
3978
|
for (const event2 of dayEvents) {
|
|
3629
3979
|
const start = event2.start.hour() + event2.start.minute() / 60;
|
|
3630
3980
|
const end = event2.end.hour() + event2.end.minute() / 60;
|
|
@@ -3639,10 +3989,10 @@ var WeekView = ({
|
|
|
3639
3989
|
}
|
|
3640
3990
|
return "none";
|
|
3641
3991
|
};
|
|
3642
|
-
return /* @__PURE__ */
|
|
3992
|
+
return /* @__PURE__ */ React37.createElement(Box21, { display: "flex", flexDirection: "column", height: "100%" }, /* @__PURE__ */ React37.createElement(Box21, { display: "flex", bgcolor: "transparent" }, /* @__PURE__ */ React37.createElement(Box21, { width: 45, bgcolor: "transparent" }), days.map((day) => {
|
|
3643
3993
|
const isToday2 = day.format("YYYY-MM-DD") === todayString;
|
|
3644
|
-
return /* @__PURE__ */
|
|
3645
|
-
|
|
3994
|
+
return /* @__PURE__ */ React37.createElement(
|
|
3995
|
+
Box21,
|
|
3646
3996
|
{
|
|
3647
3997
|
key: day.toString(),
|
|
3648
3998
|
height: 40,
|
|
@@ -3658,20 +4008,20 @@ var WeekView = ({
|
|
|
3658
4008
|
borderBottom: isToday2 ? 2 : 0,
|
|
3659
4009
|
borderColor: isToday2 ? "primary.main" : "transparent"
|
|
3660
4010
|
},
|
|
3661
|
-
/* @__PURE__ */
|
|
3662
|
-
/* @__PURE__ */
|
|
4011
|
+
/* @__PURE__ */ React37.createElement(Typography22, { variant: "h6", color: "text.primary" }, day.format("D")),
|
|
4012
|
+
/* @__PURE__ */ React37.createElement(Typography22, { variant: "caption", color: "text.secondary" }, day.format("dddd"))
|
|
3663
4013
|
);
|
|
3664
|
-
})), isLoading ? /* @__PURE__ */
|
|
4014
|
+
})), isLoading ? /* @__PURE__ */ React37.createElement(Box21, { display: "flex", alignItems: "center", justifyContent: "center", width: "100%", height: "450px" }, /* @__PURE__ */ React37.createElement(CircularProgress3, { sx: { width: "60px", height: "60px" }, variant: "indeterminate" })) : !isLoading && noEvents ? /* @__PURE__ */ React37.createElement(
|
|
3665
4015
|
EmptyState,
|
|
3666
4016
|
{
|
|
3667
4017
|
title: "Inicia la gesti\xF3n de las actividades",
|
|
3668
4018
|
subtitle: "Selecciona un mec\xE1nico y as\xEDgnale las actividades a realizar.",
|
|
3669
|
-
icon: /* @__PURE__ */
|
|
4019
|
+
icon: /* @__PURE__ */ React37.createElement(LogoCalendario, null)
|
|
3670
4020
|
}
|
|
3671
4021
|
) : (
|
|
3672
4022
|
// Grid de horas y eventos
|
|
3673
|
-
/* @__PURE__ */
|
|
3674
|
-
|
|
4023
|
+
/* @__PURE__ */ React37.createElement(Box21, { display: "flex", flex: 1 }, /* @__PURE__ */ React37.createElement(Box21, { width: 45, bgcolor: "transparent" }, hours.map((h) => /* @__PURE__ */ React37.createElement(
|
|
4024
|
+
Box21,
|
|
3675
4025
|
{
|
|
3676
4026
|
key: h,
|
|
3677
4027
|
height: 60,
|
|
@@ -3679,7 +4029,7 @@ var WeekView = ({
|
|
|
3679
4029
|
pr: 1,
|
|
3680
4030
|
borderColor: "divider"
|
|
3681
4031
|
},
|
|
3682
|
-
/* @__PURE__ */
|
|
4032
|
+
/* @__PURE__ */ React37.createElement(Typography22, { variant: "caption", color: "text.secondary" }, dayjs6().hour(h).format("h A"))
|
|
3683
4033
|
))), days.map((day) => {
|
|
3684
4034
|
const dayEvents = events.filter(
|
|
3685
4035
|
(event2) => day.isBetween(event2.start.startOf("day"), event2.end.endOf("day"), null, "[]")
|
|
@@ -3688,8 +4038,8 @@ var WeekView = ({
|
|
|
3688
4038
|
const endsInRange = event2.end.hour() >= startHour && event2.end.hour() <= endHour;
|
|
3689
4039
|
return startsInRange || endsInRange;
|
|
3690
4040
|
}).sort((a, b) => a.start.valueOf() - b.start.valueOf());
|
|
3691
|
-
return /* @__PURE__ */
|
|
3692
|
-
|
|
4041
|
+
return /* @__PURE__ */ React37.createElement(
|
|
4042
|
+
Box21,
|
|
3693
4043
|
{
|
|
3694
4044
|
key: day.toString(),
|
|
3695
4045
|
flex: 1,
|
|
@@ -3700,9 +4050,9 @@ var WeekView = ({
|
|
|
3700
4050
|
onClick: () => onDayClick == null ? void 0 : onDayClick(day)
|
|
3701
4051
|
},
|
|
3702
4052
|
hours.map((hourIdx) => {
|
|
3703
|
-
const borderType =
|
|
3704
|
-
return /* @__PURE__ */
|
|
3705
|
-
|
|
4053
|
+
const borderType = getCellBorderType2(hourIdx, dayEvents);
|
|
4054
|
+
return /* @__PURE__ */ React37.createElement(
|
|
4055
|
+
Box21,
|
|
3706
4056
|
{
|
|
3707
4057
|
key: hourIdx,
|
|
3708
4058
|
height: 60,
|
|
@@ -3717,7 +4067,7 @@ var WeekView = ({
|
|
|
3717
4067
|
const eventEnd = day.isSame(event2.end, "day") ? event2.end : day.endOf("day").hour(endHour).minute(59);
|
|
3718
4068
|
const startMinutes = (eventStart.hour() - startHour) * 60 + eventStart.minute();
|
|
3719
4069
|
const durationMinutes = eventEnd.diff(eventStart, "minute");
|
|
3720
|
-
return /* @__PURE__ */
|
|
4070
|
+
return /* @__PURE__ */ React37.createElement(
|
|
3721
4071
|
CalendarEventCard,
|
|
3722
4072
|
{
|
|
3723
4073
|
key: `${event2.id}-${day.toString()}`,
|
|
@@ -3742,79 +4092,60 @@ var WeekView = ({
|
|
|
3742
4092
|
};
|
|
3743
4093
|
|
|
3744
4094
|
// src/Components/Calendario/Views/DayView.tsx
|
|
3745
|
-
import
|
|
3746
|
-
import { Box as
|
|
3747
|
-
import
|
|
4095
|
+
import React38 from "react";
|
|
4096
|
+
import { Box as Box22, CircularProgress as CircularProgress4, Typography as Typography23 } from "@mui/material";
|
|
4097
|
+
import dayjs7 from "dayjs";
|
|
3748
4098
|
var DayView = ({
|
|
3749
4099
|
events,
|
|
3750
4100
|
currentDate,
|
|
3751
4101
|
isLoading,
|
|
3752
4102
|
onEventClick,
|
|
3753
4103
|
onEventHover,
|
|
3754
|
-
startHour =
|
|
3755
|
-
endHour =
|
|
4104
|
+
startHour = CALENDAR_CONSTANTS.DEFAULT_START_HOUR,
|
|
4105
|
+
endHour = CALENDAR_CONSTANTS.DEFAULT_END_HOUR
|
|
3756
4106
|
}) => {
|
|
3757
4107
|
const hours = Array.from({ length: endHour - startHour + 1 }, (_, i) => startHour + i);
|
|
3758
|
-
const
|
|
3759
|
-
for (const event2 of dayEvents2) {
|
|
3760
|
-
const start = event2.start.hour() + event2.start.minute() / 60;
|
|
3761
|
-
const end = event2.end.hour() + event2.end.minute() / 60;
|
|
3762
|
-
const cellStart = cellHour;
|
|
3763
|
-
const cellEnd = cellHour + 1;
|
|
3764
|
-
if (cellEnd > start && cellStart < end) {
|
|
3765
|
-
if (Math.abs(cellStart - start) < 0.01 && Math.abs(cellEnd - end) < 0.01) return "full";
|
|
3766
|
-
if (Math.abs(cellStart - start) < 0.01) return "start";
|
|
3767
|
-
if (Math.abs(cellEnd - end) < 0.01) return "end";
|
|
3768
|
-
return "middle";
|
|
3769
|
-
}
|
|
3770
|
-
}
|
|
3771
|
-
return "none";
|
|
3772
|
-
};
|
|
3773
|
-
const dayEvents = events.filter(
|
|
3774
|
-
(event2) => currentDate.isBetween(event2.start.startOf("day"), event2.end.endOf("day"), null, "[]")
|
|
3775
|
-
);
|
|
4108
|
+
const dayEvents = filterEventsForDay(events, currentDate);
|
|
3776
4109
|
const noEvents = events.length === 0;
|
|
3777
|
-
return /* @__PURE__ */
|
|
4110
|
+
return /* @__PURE__ */ React38.createElement(Box22, { display: "flex", flexDirection: "column", height: "100%" }, /* @__PURE__ */ React38.createElement(Box22, { display: "flex", borderBottom: "1px solid", borderColor: "primary.main", bgcolor: "background.paper" }, /* @__PURE__ */ React38.createElement(Box22, { width: CALENDAR_CONSTANTS.SIDEBAR_WIDTH, bgcolor: "background.default", borderBottom: "1px solid", borderColor: "transparent" }), /* @__PURE__ */ React38.createElement(Box22, { flex: 1, display: "flex", flexDirection: "column", textAlign: "start", gap: 0.5, py: 1, bgcolor: "primary.50" }, /* @__PURE__ */ React38.createElement(Typography23, { variant: "h6", color: "text.secondary" }, currentDate.format("D")), /* @__PURE__ */ React38.createElement(Typography23, { variant: "caption", color: "text.secondary" }, currentDate.format("dddd")))), isLoading ? /* @__PURE__ */ React38.createElement(Box22, { display: "flex", alignItems: "center", justifyContent: "center", width: "100%", height: CALENDAR_CONSTANTS.LOADING_CONTAINER_HEIGHT }, /* @__PURE__ */ React38.createElement(CircularProgress4, { sx: { width: CALENDAR_CONSTANTS.LOADING_SPINNER_SIZE, height: CALENDAR_CONSTANTS.LOADING_SPINNER_SIZE }, variant: "indeterminate" })) : noEvents ? /* @__PURE__ */ React38.createElement(
|
|
3778
4111
|
EmptyState,
|
|
3779
4112
|
{
|
|
3780
4113
|
title: "Inicia la gesti\xF3n de las actividades",
|
|
3781
4114
|
subtitle: "Selecciona un mec\xE1nico y as\xEDgnale las actividades a realizar.",
|
|
3782
|
-
icon: /* @__PURE__ */
|
|
4115
|
+
icon: /* @__PURE__ */ React38.createElement(LogoCalendario, null)
|
|
3783
4116
|
}
|
|
3784
|
-
) : /* @__PURE__ */
|
|
3785
|
-
|
|
4117
|
+
) : /* @__PURE__ */ React38.createElement(Box22, { display: "flex", flex: 1 }, /* @__PURE__ */ React38.createElement(Box22, { width: CALENDAR_CONSTANTS.SIDEBAR_WIDTH, bgcolor: "background.default" }, hours.map((h) => /* @__PURE__ */ React38.createElement(
|
|
4118
|
+
Box22,
|
|
3786
4119
|
{
|
|
3787
4120
|
key: h,
|
|
3788
|
-
height:
|
|
4121
|
+
height: CALENDAR_CONSTANTS.DAY_HEIGHT,
|
|
3789
4122
|
textAlign: "right",
|
|
3790
4123
|
pr: 1,
|
|
3791
4124
|
borderTop: "1px solid",
|
|
3792
4125
|
borderRight: "1px solid",
|
|
3793
4126
|
borderColor: "divider"
|
|
3794
4127
|
},
|
|
3795
|
-
/* @__PURE__ */
|
|
3796
|
-
))), /* @__PURE__ */
|
|
4128
|
+
/* @__PURE__ */ React38.createElement(Typography23, { variant: "caption", color: "text.secondary" }, dayjs7().hour(h).format("h A"))
|
|
4129
|
+
))), /* @__PURE__ */ React38.createElement(Box22, { flex: 1, position: "relative" }, hours.map((hourIdx) => {
|
|
3797
4130
|
const borderType = getCellBorderType(hourIdx, dayEvents);
|
|
3798
|
-
return /* @__PURE__ */
|
|
3799
|
-
|
|
4131
|
+
return /* @__PURE__ */ React38.createElement(
|
|
4132
|
+
Box22,
|
|
3800
4133
|
{
|
|
3801
4134
|
key: hourIdx,
|
|
3802
|
-
height:
|
|
4135
|
+
height: CALENDAR_CONSTANTS.DAY_HEIGHT,
|
|
3803
4136
|
borderTop: "1px solid",
|
|
3804
4137
|
borderColor: borderType === "start" || borderType === "full" || borderType === "none" ? "divider" : "transparent",
|
|
3805
4138
|
borderBottom: borderType === "end" || borderType === "full" ? "1px solid divider" : void 0
|
|
3806
4139
|
}
|
|
3807
4140
|
);
|
|
3808
4141
|
}), dayEvents.map((event2) => {
|
|
3809
|
-
const
|
|
3810
|
-
|
|
3811
|
-
|
|
3812
|
-
|
|
3813
|
-
|
|
3814
|
-
|
|
3815
|
-
|
|
3816
|
-
const durationMinutes = clampedEnd.diff(clampedStart, "minute");
|
|
3817
|
-
return /* @__PURE__ */ React31.createElement(
|
|
4142
|
+
const { startMinutes, durationMinutes } = clampEventToVisibleRange(
|
|
4143
|
+
event2,
|
|
4144
|
+
currentDate,
|
|
4145
|
+
startHour,
|
|
4146
|
+
endHour
|
|
4147
|
+
);
|
|
4148
|
+
return /* @__PURE__ */ React38.createElement(
|
|
3818
4149
|
CalendarEventCard,
|
|
3819
4150
|
{
|
|
3820
4151
|
key: `${event2.id}-${currentDate.toString()}`,
|
|
@@ -3834,8 +4165,49 @@ var DayView = ({
|
|
|
3834
4165
|
}))));
|
|
3835
4166
|
};
|
|
3836
4167
|
|
|
4168
|
+
// src/Components/Calendario/hooks/useCalendarNavigation.ts
|
|
4169
|
+
import { useState as useState18 } from "react";
|
|
4170
|
+
import dayjs8 from "dayjs";
|
|
4171
|
+
var useCalendarNavigation = (initialDate, onDateChange) => {
|
|
4172
|
+
const [currentDate, setCurrentDate] = useState18(initialDate || dayjs8());
|
|
4173
|
+
const getNavigationUnit = (view) => {
|
|
4174
|
+
switch (view) {
|
|
4175
|
+
case "day":
|
|
4176
|
+
return "day";
|
|
4177
|
+
case "week":
|
|
4178
|
+
return "week";
|
|
4179
|
+
case "month":
|
|
4180
|
+
return "month";
|
|
4181
|
+
default:
|
|
4182
|
+
return "day";
|
|
4183
|
+
}
|
|
4184
|
+
};
|
|
4185
|
+
const navigateDate = (action, view) => {
|
|
4186
|
+
let newDate = currentDate;
|
|
4187
|
+
const unit = getNavigationUnit(view);
|
|
4188
|
+
switch (action) {
|
|
4189
|
+
case "PREV":
|
|
4190
|
+
newDate = currentDate.subtract(1, unit);
|
|
4191
|
+
break;
|
|
4192
|
+
case "NEXT":
|
|
4193
|
+
newDate = currentDate.add(1, unit);
|
|
4194
|
+
break;
|
|
4195
|
+
case "TODAY":
|
|
4196
|
+
newDate = dayjs8();
|
|
4197
|
+
break;
|
|
4198
|
+
}
|
|
4199
|
+
setCurrentDate(newDate);
|
|
4200
|
+
onDateChange == null ? void 0 : onDateChange(newDate);
|
|
4201
|
+
};
|
|
4202
|
+
return {
|
|
4203
|
+
currentDate,
|
|
4204
|
+
setCurrentDate,
|
|
4205
|
+
navigateDate
|
|
4206
|
+
};
|
|
4207
|
+
};
|
|
4208
|
+
|
|
3837
4209
|
// src/Components/Calendario/Calendar.tsx
|
|
3838
|
-
import
|
|
4210
|
+
import dayjs9 from "dayjs";
|
|
3839
4211
|
var Calendar = ({
|
|
3840
4212
|
events,
|
|
3841
4213
|
onDayClick,
|
|
@@ -3847,35 +4219,22 @@ var Calendar = ({
|
|
|
3847
4219
|
onViewChange,
|
|
3848
4220
|
toolbar,
|
|
3849
4221
|
isLoading = false,
|
|
3850
|
-
startHour =
|
|
3851
|
-
|
|
3852
|
-
endHour = 23
|
|
4222
|
+
startHour = CALENDAR_CONSTANTS.DEFAULT_START_HOUR,
|
|
4223
|
+
endHour = CALENDAR_CONSTANTS.DEFAULT_END_HOUR
|
|
3853
4224
|
}) => {
|
|
3854
|
-
const [view, setView] =
|
|
3855
|
-
const
|
|
3856
|
-
|
|
4225
|
+
const [view, setView] = useState19(initialView);
|
|
4226
|
+
const { currentDate, navigateDate } = useCalendarNavigation(dayjs9(), onDateChange);
|
|
4227
|
+
useEffect19(() => {
|
|
3857
4228
|
onDateChange == null ? void 0 : onDateChange(currentDate);
|
|
3858
|
-
}, []);
|
|
4229
|
+
}, [currentDate, onDateChange]);
|
|
3859
4230
|
const handleViewChange = (newView) => {
|
|
3860
4231
|
setView(newView);
|
|
3861
4232
|
onViewChange == null ? void 0 : onViewChange(newView);
|
|
3862
4233
|
};
|
|
3863
4234
|
const handleNavigate = (action) => {
|
|
3864
|
-
|
|
3865
|
-
const unit = view === "month" ? "month" : "day";
|
|
3866
|
-
if (action === "PREV") {
|
|
3867
|
-
if (view === "day") newDate = currentDate.subtract(1, "day");
|
|
3868
|
-
if (view === "week") newDate = currentDate.subtract(1, "week");
|
|
3869
|
-
if (view === "month") newDate = currentDate.subtract(1, "month");
|
|
3870
|
-
} else if (action === "NEXT") {
|
|
3871
|
-
if (view === "day") newDate = currentDate.add(1, "day");
|
|
3872
|
-
if (view === "week") newDate = currentDate.add(1, "week");
|
|
3873
|
-
if (view === "month") newDate = currentDate.add(1, "month");
|
|
3874
|
-
} else if (action === "TODAY") newDate = dayjs7();
|
|
3875
|
-
setCurrentDate(newDate);
|
|
3876
|
-
onDateChange == null ? void 0 : onDateChange(newDate);
|
|
4235
|
+
navigateDate(action, view);
|
|
3877
4236
|
};
|
|
3878
|
-
return /* @__PURE__ */
|
|
4237
|
+
return /* @__PURE__ */ React39.createElement(Box23, null, /* @__PURE__ */ React39.createElement(
|
|
3879
4238
|
CalendarToolbar,
|
|
3880
4239
|
{
|
|
3881
4240
|
labelDate: currentDate,
|
|
@@ -3884,16 +4243,25 @@ var Calendar = ({
|
|
|
3884
4243
|
onNavigate: handleNavigate
|
|
3885
4244
|
},
|
|
3886
4245
|
toolbar
|
|
3887
|
-
), isLoading ? /* @__PURE__ */
|
|
3888
|
-
|
|
4246
|
+
), isLoading ? /* @__PURE__ */ React39.createElement(
|
|
4247
|
+
Box23,
|
|
3889
4248
|
{
|
|
3890
4249
|
display: "flex",
|
|
3891
4250
|
justifyContent: "center",
|
|
3892
4251
|
alignItems: "center",
|
|
3893
|
-
height:
|
|
4252
|
+
height: CALENDAR_CONSTANTS.LOADING_CONTAINER_HEIGHT
|
|
3894
4253
|
},
|
|
3895
|
-
/* @__PURE__ */
|
|
3896
|
-
|
|
4254
|
+
/* @__PURE__ */ React39.createElement(
|
|
4255
|
+
CircularProgress5,
|
|
4256
|
+
{
|
|
4257
|
+
variant: "indeterminate",
|
|
4258
|
+
sx: {
|
|
4259
|
+
width: CALENDAR_CONSTANTS.LOADING_SPINNER_SIZE,
|
|
4260
|
+
height: CALENDAR_CONSTANTS.LOADING_SPINNER_SIZE
|
|
4261
|
+
}
|
|
4262
|
+
}
|
|
4263
|
+
)
|
|
4264
|
+
) : /* @__PURE__ */ React39.createElement(React39.Fragment, null, view === "month" && /* @__PURE__ */ React39.createElement(
|
|
3897
4265
|
MonthView,
|
|
3898
4266
|
{
|
|
3899
4267
|
events,
|
|
@@ -3903,7 +4271,7 @@ var Calendar = ({
|
|
|
3903
4271
|
onEventClick,
|
|
3904
4272
|
onEventHover
|
|
3905
4273
|
}
|
|
3906
|
-
), view === "week" && /* @__PURE__ */
|
|
4274
|
+
), view === "week" && /* @__PURE__ */ React39.createElement(
|
|
3907
4275
|
WeekView,
|
|
3908
4276
|
{
|
|
3909
4277
|
events,
|
|
@@ -3915,7 +4283,7 @@ var Calendar = ({
|
|
|
3915
4283
|
startHour,
|
|
3916
4284
|
endHour
|
|
3917
4285
|
}
|
|
3918
|
-
), view === "day" && /* @__PURE__ */
|
|
4286
|
+
), view === "day" && /* @__PURE__ */ React39.createElement(
|
|
3919
4287
|
DayView,
|
|
3920
4288
|
{
|
|
3921
4289
|
events,
|
|
@@ -3929,11 +4297,11 @@ var Calendar = ({
|
|
|
3929
4297
|
};
|
|
3930
4298
|
|
|
3931
4299
|
// src/Components/SCTime.tsx
|
|
3932
|
-
import
|
|
3933
|
-
import { Box as
|
|
4300
|
+
import React40, { useState as useState20 } from "react";
|
|
4301
|
+
import { Box as Box24, InputAdornment as InputAdornment6, Popover as Popover6, ClickAwayListener as ClickAwayListener2 } from "@mui/material";
|
|
3934
4302
|
import { LocalizationProvider as LocalizationProvider3 } from "@mui/x-date-pickers/LocalizationProvider";
|
|
3935
4303
|
import { AdapterDayjs as AdapterDayjs2 } from "@mui/x-date-pickers/AdapterDayjs";
|
|
3936
|
-
import
|
|
4304
|
+
import dayjs10 from "dayjs";
|
|
3937
4305
|
import "dayjs/locale/es";
|
|
3938
4306
|
import { LicenseInfo as LicenseInfo3 } from "@mui/x-license-pro";
|
|
3939
4307
|
import AccessTimeIcon from "@mui/icons-material/AccessTime";
|
|
@@ -3953,9 +4321,9 @@ var SCTime = ({
|
|
|
3953
4321
|
);
|
|
3954
4322
|
const isTimeEmpty = required && !state;
|
|
3955
4323
|
const hasError = isTimeEmpty;
|
|
3956
|
-
const [anchorEl, setAnchorEl] =
|
|
3957
|
-
const [isOpenPopover, setIsOpenPopover] =
|
|
3958
|
-
const [popoverPlacement, setPopoverPlacement] =
|
|
4324
|
+
const [anchorEl, setAnchorEl] = useState20(null);
|
|
4325
|
+
const [isOpenPopover, setIsOpenPopover] = useState20(false);
|
|
4326
|
+
const [popoverPlacement, setPopoverPlacement] = useState20("bottom");
|
|
3959
4327
|
const detectPlacement = (element) => {
|
|
3960
4328
|
const rect = element.getBoundingClientRect();
|
|
3961
4329
|
const windowHeight = window.innerHeight;
|
|
@@ -3977,7 +4345,7 @@ var SCTime = ({
|
|
|
3977
4345
|
}
|
|
3978
4346
|
};
|
|
3979
4347
|
const handleTimeChange = (newValue) => {
|
|
3980
|
-
const dayjsValue = newValue ?
|
|
4348
|
+
const dayjsValue = newValue ? dayjs10(newValue) : null;
|
|
3981
4349
|
setState(dayjsValue);
|
|
3982
4350
|
setIsOpenPopover(false);
|
|
3983
4351
|
setAnchorEl(null);
|
|
@@ -3986,7 +4354,7 @@ var SCTime = ({
|
|
|
3986
4354
|
setIsOpenPopover(false);
|
|
3987
4355
|
setAnchorEl(null);
|
|
3988
4356
|
};
|
|
3989
|
-
return /* @__PURE__ */
|
|
4357
|
+
return /* @__PURE__ */ React40.createElement(LocalizationProvider3, { dateAdapter: AdapterDayjs2 }, /* @__PURE__ */ React40.createElement(Box24, { sx: { position: "relative", width: "120px" } }, /* @__PURE__ */ React40.createElement(
|
|
3990
4358
|
TimeField,
|
|
3991
4359
|
{
|
|
3992
4360
|
label,
|
|
@@ -3998,7 +4366,7 @@ var SCTime = ({
|
|
|
3998
4366
|
slotProps: {
|
|
3999
4367
|
textField: {
|
|
4000
4368
|
InputProps: {
|
|
4001
|
-
endAdornment: /* @__PURE__ */
|
|
4369
|
+
endAdornment: /* @__PURE__ */ React40.createElement(InputAdornment6, { position: "end" }, /* @__PURE__ */ React40.createElement(
|
|
4002
4370
|
AccessTimeIcon,
|
|
4003
4371
|
{
|
|
4004
4372
|
color: disabled ? "disabled" : "action",
|
|
@@ -4027,7 +4395,7 @@ var SCTime = ({
|
|
|
4027
4395
|
}
|
|
4028
4396
|
}
|
|
4029
4397
|
}
|
|
4030
|
-
), /* @__PURE__ */
|
|
4398
|
+
), /* @__PURE__ */ React40.createElement(
|
|
4031
4399
|
Popover6,
|
|
4032
4400
|
{
|
|
4033
4401
|
open: isOpenPopover,
|
|
@@ -4055,7 +4423,7 @@ var SCTime = ({
|
|
|
4055
4423
|
}
|
|
4056
4424
|
}
|
|
4057
4425
|
},
|
|
4058
|
-
/* @__PURE__ */
|
|
4426
|
+
/* @__PURE__ */ React40.createElement(ClickAwayListener2, { onClickAway: handleClose }, /* @__PURE__ */ React40.createElement(Box24, { sx: { p: 0 } }, /* @__PURE__ */ React40.createElement(
|
|
4059
4427
|
DigitalClock,
|
|
4060
4428
|
{
|
|
4061
4429
|
value: state,
|
|
@@ -4077,9 +4445,9 @@ var SCTime = ({
|
|
|
4077
4445
|
};
|
|
4078
4446
|
|
|
4079
4447
|
// src/Components/SCCard.tsx
|
|
4080
|
-
import
|
|
4081
|
-
import { Button as
|
|
4082
|
-
import
|
|
4448
|
+
import React41 from "react";
|
|
4449
|
+
import { Button as Button15, Box as Box25, SvgIcon as SvgIcon9 } from "@mui/material";
|
|
4450
|
+
import IconButton14 from "@mui/material/IconButton";
|
|
4083
4451
|
import Card from "@mui/material/Card";
|
|
4084
4452
|
import CardHeader from "@mui/material/CardHeader";
|
|
4085
4453
|
import CardMedia from "@mui/material/CardMedia";
|
|
@@ -4091,10 +4459,10 @@ import * as Muicon9 from "@mui/icons-material";
|
|
|
4091
4459
|
var SCCard = ({ title, image, iconTitle, actionsTitle, subtitle, content, actions, expand }) => {
|
|
4092
4460
|
let iconTitleValidation = "";
|
|
4093
4461
|
let IconTitle;
|
|
4094
|
-
const [expanded, setExpanded] =
|
|
4462
|
+
const [expanded, setExpanded] = React41.useState(false);
|
|
4095
4463
|
if (iconTitle) {
|
|
4096
4464
|
if (Muicon9[iconTitle] == void 0) {
|
|
4097
|
-
if (iconTitle &&
|
|
4465
|
+
if (iconTitle && React41.isValidElement(iconTitle) && iconTitle.type == void 0) {
|
|
4098
4466
|
iconTitleValidation = "image";
|
|
4099
4467
|
IconTitle = iconTitle;
|
|
4100
4468
|
} else {
|
|
@@ -4109,11 +4477,11 @@ var SCCard = ({ title, image, iconTitle, actionsTitle, subtitle, content, action
|
|
|
4109
4477
|
const handleExpandClick = () => {
|
|
4110
4478
|
setExpanded(!expanded);
|
|
4111
4479
|
};
|
|
4112
|
-
return /* @__PURE__ */
|
|
4480
|
+
return /* @__PURE__ */ React41.createElement(Card, { sx: { maxWidth: 345 } }, title && /* @__PURE__ */ React41.createElement(
|
|
4113
4481
|
CardHeader,
|
|
4114
4482
|
{
|
|
4115
|
-
avatar: iconTitle ? iconTitleValidation === "image" ? /* @__PURE__ */
|
|
4116
|
-
action: (expand == null ? void 0 : expand.position) == "top" ? (expand == null ? void 0 : expand.type) === "text" ? /* @__PURE__ */
|
|
4483
|
+
avatar: iconTitle ? iconTitleValidation === "image" ? /* @__PURE__ */ React41.createElement(Box25, { sx: { marginRight: "16px", width: "44px", height: "44px", borderRadius: "1px" } }, /* @__PURE__ */ React41.createElement("img", { src: IconTitle, width: "44px", height: "44px" })) : /* @__PURE__ */ React41.createElement(SvgIcon9, { color: "action", fontSize: "small", component: IconTitle, sx: { marginRight: "16px" } }) : void 0,
|
|
4484
|
+
action: (expand == null ? void 0 : expand.position) == "top" ? (expand == null ? void 0 : expand.type) === "text" ? /* @__PURE__ */ React41.createElement(Button15, { onClick: handleExpandClick, sx: { marginRight: "auto" } }, "Expandir") : (expand == null ? void 0 : expand.type) === "icon" && /* @__PURE__ */ React41.createElement(IconButton14, { onClick: handleExpandClick, sx: { marginRight: "auto" }, size: "small" }, /* @__PURE__ */ React41.createElement(ExpandMoreIcon, { fontSize: "small" })) : actionsTitle,
|
|
4117
4485
|
title,
|
|
4118
4486
|
subheader: subtitle,
|
|
4119
4487
|
sx: {
|
|
@@ -4132,15 +4500,15 @@ var SCCard = ({ title, image, iconTitle, actionsTitle, subtitle, content, action
|
|
|
4132
4500
|
}
|
|
4133
4501
|
}
|
|
4134
4502
|
}
|
|
4135
|
-
), image && /* @__PURE__ */
|
|
4503
|
+
), image && /* @__PURE__ */ React41.createElement(
|
|
4136
4504
|
CardMedia,
|
|
4137
4505
|
{
|
|
4138
4506
|
component: "img",
|
|
4139
4507
|
height: "194",
|
|
4140
4508
|
image
|
|
4141
4509
|
}
|
|
4142
|
-
), content && /* @__PURE__ */
|
|
4143
|
-
|
|
4510
|
+
), content && /* @__PURE__ */ React41.createElement(CardContent, { sx: { padding: "8px 16px !important" } }, content), ((expand == null ? void 0 : expand.position) == "bottom" || actions != void 0) && /* @__PURE__ */ React41.createElement(CardActions, { disableSpacing: true, sx: { justifyContent: "flex-end" } }, (expand == null ? void 0 : expand.position) === "bottom" ? (expand == null ? void 0 : expand.type) === "text" ? /* @__PURE__ */ React41.createElement(Button15, { onClick: handleExpandClick, sx: { marginRight: "auto" } }, "Expandir") : (expand == null ? void 0 : expand.type) === "icon" && /* @__PURE__ */ React41.createElement(IconButton14, { onClick: handleExpandClick, sx: { marginRight: "auto" } }, /* @__PURE__ */ React41.createElement(ExpandMoreIcon, null)) : null, actions && actions.length > 0 ? actions.map((action, index) => /* @__PURE__ */ React41.createElement(
|
|
4511
|
+
Button15,
|
|
4144
4512
|
{
|
|
4145
4513
|
key: index,
|
|
4146
4514
|
size: "small",
|
|
@@ -4150,13 +4518,13 @@ var SCCard = ({ title, image, iconTitle, actionsTitle, subtitle, content, action
|
|
|
4150
4518
|
disabled: action.disabled || false
|
|
4151
4519
|
},
|
|
4152
4520
|
action.text
|
|
4153
|
-
)) : ""), expand && /* @__PURE__ */
|
|
4521
|
+
)) : ""), expand && /* @__PURE__ */ React41.createElement(Collapse, { in: expanded, timeout: "auto", unmountOnExit: true }, /* @__PURE__ */ React41.createElement(CardContent, { sx: { padding: "8px 16px !important" } }, expand.content)));
|
|
4154
4522
|
};
|
|
4155
4523
|
|
|
4156
4524
|
// src/Components/SCActivityCalendar.tsx
|
|
4157
|
-
import
|
|
4158
|
-
import { Typography as
|
|
4159
|
-
import
|
|
4525
|
+
import React42, { useState as useState22 } from "react";
|
|
4526
|
+
import { Typography as Typography26, IconButton as IconButton15, Box as Box26, Badge as Badge2 } from "@mui/material";
|
|
4527
|
+
import Grid11 from "@mui/material/Grid2";
|
|
4160
4528
|
import { AdapterDateFns as AdapterDateFns2 } from "@mui/x-date-pickers/AdapterDateFns";
|
|
4161
4529
|
import { LocalizationProvider as LocalizationProvider4 } from "@mui/x-date-pickers/LocalizationProvider";
|
|
4162
4530
|
import { StaticDatePicker as StaticDatePicker2 } from "@mui/x-date-pickers/StaticDatePicker";
|
|
@@ -4178,14 +4546,14 @@ var SCActivityCalendar = ({
|
|
|
4178
4546
|
configRangeHour
|
|
4179
4547
|
}) => {
|
|
4180
4548
|
let convertFecha;
|
|
4181
|
-
const [fecha, setFecha] =
|
|
4182
|
-
const [fechaSeleccionada, setFechaSeleccionada] =
|
|
4183
|
-
const [stateVal, setstateVal] =
|
|
4184
|
-
const [openCalendar, setOpenCalendar] =
|
|
4549
|
+
const [fecha, setFecha] = useState22(/* @__PURE__ */ new Date());
|
|
4550
|
+
const [fechaSeleccionada, setFechaSeleccionada] = useState22();
|
|
4551
|
+
const [stateVal, setstateVal] = React42.useState(/* @__PURE__ */ new Date());
|
|
4552
|
+
const [openCalendar, setOpenCalendar] = React42.useState(false);
|
|
4185
4553
|
const hoy = /* @__PURE__ */ new Date();
|
|
4186
4554
|
const inicioSemana = startOfWeek2(fecha, { weekStartsOn: 0 });
|
|
4187
4555
|
const diasSemana = Array.from({ length: 7 }, (_, i) => addDays2(inicioSemana, i));
|
|
4188
|
-
|
|
4556
|
+
React42.useEffect(() => {
|
|
4189
4557
|
if (fecha != null) {
|
|
4190
4558
|
handleConvertFecha(fecha);
|
|
4191
4559
|
}
|
|
@@ -4209,8 +4577,8 @@ var SCActivityCalendar = ({
|
|
|
4209
4577
|
// 0 para domingo, 1 para lunes, etc.
|
|
4210
4578
|
}
|
|
4211
4579
|
});
|
|
4212
|
-
return /* @__PURE__ */
|
|
4213
|
-
|
|
4580
|
+
return /* @__PURE__ */ React42.createElement(React42.Fragment, null, /* @__PURE__ */ React42.createElement(LocalizationProvider4, { dateAdapter: AdapterDateFns2, adapterLocale: es2 }, openCalendar == false ? /* @__PURE__ */ React42.createElement(Box26, { "data-testid": "calendar-mobile", sx: { width: "100%", background: background ? background : "white", display: "flex", flexDirection: "column", alignItems: "center" } }, /* @__PURE__ */ React42.createElement(Box26, { sx: { width: "100%", maxWidth: "320px", background: "transparent" } }, /* @__PURE__ */ React42.createElement(Grid11, { container: true, gap: 0.5, sx: { justifyContent: "space-between", padding: "12px 0px", background: "transparent" } }, diasSemana.map((dia) => /* @__PURE__ */ React42.createElement(Grid11, { sx: { width: "36px" }, key: dia.toString() }, /* @__PURE__ */ React42.createElement(Box26, { sx: { width: "36px", height: "40px", display: "flex", alignItems: "center", justifyContent: "center" } }, /* @__PURE__ */ React42.createElement(Typography26, { sx: { fontSize: "12px !important", color: "#10184099" } }, format2(dia, "EEEE", { locale: es2 }).charAt(0).toUpperCase())), /* @__PURE__ */ React42.createElement(
|
|
4581
|
+
Box26,
|
|
4214
4582
|
{
|
|
4215
4583
|
onClick: () => setFecha(dia),
|
|
4216
4584
|
sx: {
|
|
@@ -4225,8 +4593,8 @@ var SCActivityCalendar = ({
|
|
|
4225
4593
|
//height: '36px',
|
|
4226
4594
|
}
|
|
4227
4595
|
},
|
|
4228
|
-
/* @__PURE__ */
|
|
4229
|
-
)))), /* @__PURE__ */
|
|
4596
|
+
/* @__PURE__ */ React42.createElement(Typography26, { sx: { fontSize: "12px !important", color: isSameDay2(dia, fecha) ? "white" : "#101840DE" } }, format2(dia, "d"))
|
|
4597
|
+
)))), /* @__PURE__ */ React42.createElement(Grid11, { container: true, justifyContent: "center" }, /* @__PURE__ */ React42.createElement(IconButton15, { "data-testid": "open-calendar-button", onClick: toggleCalendar(true) }, /* @__PURE__ */ React42.createElement(KeyboardDoubleArrowDownIcon2, { color: "action" }))))) : /* @__PURE__ */ React42.createElement(Box26, { sx: { width: "100%", background: "white" } }, /* @__PURE__ */ React42.createElement(
|
|
4230
4598
|
StaticDatePicker2,
|
|
4231
4599
|
{
|
|
4232
4600
|
orientation: "landscape",
|
|
@@ -4236,19 +4604,19 @@ var SCActivityCalendar = ({
|
|
|
4236
4604
|
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" } },
|
|
4237
4605
|
onChange: (newValue) => setFecha(newValue)
|
|
4238
4606
|
}
|
|
4239
|
-
), /* @__PURE__ */
|
|
4240
|
-
|
|
4607
|
+
), /* @__PURE__ */ React42.createElement(Grid11, { container: true, justifyContent: "center" }, /* @__PURE__ */ React42.createElement(IconButton15, { "data-testid": "close-calendar-button", onClick: toggleCalendar(false) }, /* @__PURE__ */ React42.createElement(KeyboardDoubleArrowUpIcon2, { color: "action" }))))), /* @__PURE__ */ React42.createElement(Box26, { sx: { width: "100%", height: openCalendar ? "calc(91% - 300px)" : "calc(91% - 100px)", background: "white", display: "flex", flexDirection: "column", overflowY: "auto", gap: "8px", scrollSnapType: "x mandatory", paddingBottom: "10px" } }, diasSemana.map((day, dayIndex) => /* @__PURE__ */ React42.createElement(
|
|
4608
|
+
Box26,
|
|
4241
4609
|
{
|
|
4242
4610
|
key: dayIndex
|
|
4243
4611
|
},
|
|
4244
|
-
/* @__PURE__ */
|
|
4612
|
+
/* @__PURE__ */ React42.createElement(Grid11, { container: true }, /* @__PURE__ */ React42.createElement(Typography26, { variant: "subtitle1", sx: { color: isSameDay2(day, fecha) ? "info.dark" : "text.secondary" } }, day.toLocaleDateString("es-ES", {
|
|
4245
4613
|
day: "numeric"
|
|
4246
4614
|
}), " de ", day.toLocaleDateString("es-ES", {
|
|
4247
4615
|
month: "short"
|
|
4248
4616
|
}), ", ", day.toLocaleDateString("es-ES", {
|
|
4249
4617
|
weekday: "long"
|
|
4250
4618
|
}))),
|
|
4251
|
-
/* @__PURE__ */
|
|
4619
|
+
/* @__PURE__ */ React42.createElement(Box26, { sx: {
|
|
4252
4620
|
display: "flex",
|
|
4253
4621
|
flexDirection: "column"
|
|
4254
4622
|
} }, (() => {
|
|
@@ -4257,16 +4625,16 @@ var SCActivityCalendar = ({
|
|
|
4257
4625
|
(event2) => new Date(event2.date).toDateString() === day.toDateString()
|
|
4258
4626
|
);
|
|
4259
4627
|
if (eventosDelDia.length > 0) {
|
|
4260
|
-
return eventosDelDia.map((event2, idx) => /* @__PURE__ */
|
|
4628
|
+
return eventosDelDia.map((event2, idx) => /* @__PURE__ */ React42.createElement(
|
|
4261
4629
|
SCListContent,
|
|
4262
4630
|
{
|
|
4263
4631
|
key: idx,
|
|
4264
4632
|
options: [{
|
|
4265
4633
|
title: event2.description,
|
|
4266
|
-
subtitle: /* @__PURE__ */
|
|
4634
|
+
subtitle: /* @__PURE__ */ React42.createElement(React42.Fragment, null, configRangeHour && new Date(event2.date.replace("00:00:00", event2.startTime)).getHours() === new Date(event2.date.replace("00:00:00", configRangeHour.split("-")[0])).getHours() && new Date(event2.date.replace("00:00:00", event2.finalTime)).getHours() === new Date(event2.date.replace("00:00:00", configRangeHour.split("-")[1])).getHours() && new Date(event2.date.replace("00:00:00", event2.startTime)).getMinutes() === new Date(event2.date.replace("00:00:00", configRangeHour.split("-")[0])).getMinutes() && new Date(event2.date.replace("00:00:00", event2.finalTime)).getMinutes() === new Date(event2.date.replace("00:00:00", configRangeHour.split("-")[1])).getMinutes() ? /* @__PURE__ */ React42.createElement(React42.Fragment, null, /* @__PURE__ */ React42.createElement(Typography26, null, "Todo el dia"), /* @__PURE__ */ React42.createElement(LightModeOutlinedIcon, { fontSize: "small" })) : /* @__PURE__ */ React42.createElement(React42.Fragment, null, /* @__PURE__ */ React42.createElement(Typography26, null, new Date(event2.date.replace("00:00:00", event2.startTime)).toLocaleTimeString([], { hour: "2-digit", minute: "2-digit", hour12: true })), /* @__PURE__ */ React42.createElement(ArrowForwardIcon, { fontSize: "small" }), /* @__PURE__ */ React42.createElement(Typography26, null, new Date(event2.date.replace("00:00:00", event2.finalTime)).toLocaleTimeString([], { hour: "2-digit", minute: "2-digit", hour12: true })))),
|
|
4267
4635
|
iconLeftColor: event2.state === "Finalizada" ? "success" : "action",
|
|
4268
4636
|
iconLeft: event2.state === "Finalizada" ? "CheckCircle" : event2.state === "Aplazada" ? "EventBusyOutlined" : event2.state === "En progreso" ? "PendingOutlined" : "RadioButtonUnchecked",
|
|
4269
|
-
description: /* @__PURE__ */
|
|
4637
|
+
description: /* @__PURE__ */ React42.createElement(React42.Fragment, null, event2.state === "Aplazada" || event2.state === "En progreso" || event2.state === "Auto asignada" ? /* @__PURE__ */ React42.createElement(React42.Fragment, null, /* @__PURE__ */ React42.createElement(Badge2, { variant: "dot", badgeContent: "", sx: { display: "flex", alignItems: "center", "& .MuiBadge-badge": { top: "50%", transform: "translateY(-50%)" }, color: "action" } }), /* @__PURE__ */ React42.createElement(Typography26, null, event2.state == "Auto asignada" ? "Adicional" : event2.state)) : null),
|
|
4270
4638
|
divider: eventosDelDia.length === idx + 1 ? false : true,
|
|
4271
4639
|
disable: event2.state === "Finalizada" || event2.state === "Aplazada" || event2.state === "En progreso" ? true : false,
|
|
4272
4640
|
fn: fn ? () => fn(event2) : void 0
|
|
@@ -4274,7 +4642,7 @@ var SCActivityCalendar = ({
|
|
|
4274
4642
|
}
|
|
4275
4643
|
));
|
|
4276
4644
|
} else {
|
|
4277
|
-
return /* @__PURE__ */
|
|
4645
|
+
return /* @__PURE__ */ React42.createElement(
|
|
4278
4646
|
SCListContent,
|
|
4279
4647
|
{
|
|
4280
4648
|
options: [{
|
|
@@ -4293,7 +4661,7 @@ var SCActivityCalendar = ({
|
|
|
4293
4661
|
import { createTheme } from "@mui/material/styles";
|
|
4294
4662
|
|
|
4295
4663
|
// src/Theme/components.ts
|
|
4296
|
-
import
|
|
4664
|
+
import React43 from "react";
|
|
4297
4665
|
import {
|
|
4298
4666
|
InfoRounded as InfoRounded2,
|
|
4299
4667
|
CheckCircleRounded as CheckCircleRounded2,
|
|
@@ -4996,10 +5364,10 @@ var components = {
|
|
|
4996
5364
|
MuiAlert: {
|
|
4997
5365
|
defaultProps: {
|
|
4998
5366
|
iconMapping: {
|
|
4999
|
-
success:
|
|
5000
|
-
error:
|
|
5001
|
-
warning:
|
|
5002
|
-
info:
|
|
5367
|
+
success: React43.createElement(CheckCircleRounded2),
|
|
5368
|
+
error: React43.createElement(ErrorRounded2),
|
|
5369
|
+
warning: React43.createElement(WarningRounded2),
|
|
5370
|
+
info: React43.createElement(InfoRounded2)
|
|
5003
5371
|
}
|
|
5004
5372
|
},
|
|
5005
5373
|
variants: [
|
|
@@ -6041,7 +6409,10 @@ export {
|
|
|
6041
6409
|
ADCSincoTheme,
|
|
6042
6410
|
AdproSincoTheme,
|
|
6043
6411
|
Attachment,
|
|
6412
|
+
BasicMenu,
|
|
6413
|
+
CALENDAR_CONSTANTS,
|
|
6044
6414
|
Calendar,
|
|
6415
|
+
DayEventsList,
|
|
6045
6416
|
EmptyState,
|
|
6046
6417
|
FooterAction,
|
|
6047
6418
|
MultiSelect,
|
|
@@ -6067,12 +6438,16 @@ export {
|
|
|
6067
6438
|
SincoTheme,
|
|
6068
6439
|
ToastProgress,
|
|
6069
6440
|
capitalize,
|
|
6441
|
+
clampEventToVisibleRange,
|
|
6442
|
+
filterEventsForDay,
|
|
6070
6443
|
getButtonColor,
|
|
6071
|
-
|
|
6444
|
+
getCellBorderType,
|
|
6445
|
+
getIcon2 as getIcon,
|
|
6072
6446
|
getIconComponent,
|
|
6073
6447
|
getIconMultiSelect,
|
|
6074
6448
|
getModalColor,
|
|
6075
6449
|
modalStateConfig,
|
|
6450
|
+
useCalendarNavigation,
|
|
6076
6451
|
useFilteredItems,
|
|
6077
6452
|
useMultiSelectHandlers,
|
|
6078
6453
|
useProgress
|