componentes-sinco 1.2.7 → 1.2.9
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/index.cjs +2515 -2453
- package/dist/index.cjs.map +1 -1
- package/dist/index.d.cts +8 -13
- package/dist/index.d.ts +8 -13
- package/dist/index.js +1611 -1549
- package/dist/index.js.map +1 -1
- package/package.json +1 -1
package/dist/index.js
CHANGED
|
@@ -760,7 +760,7 @@ var Attachment = ({
|
|
|
760
760
|
};
|
|
761
761
|
|
|
762
762
|
// src/Components/Adjuntar/mobile/AdjuntarMobile.tsx
|
|
763
|
-
import
|
|
763
|
+
import React18, { useEffect as useEffect11, useRef as useRef3, useState as useState12, useCallback as useCallback2 } from "react";
|
|
764
764
|
import Webcam from "react-webcam";
|
|
765
765
|
|
|
766
766
|
// src/Components/Adjuntar/mobile/components/button.tsx
|
|
@@ -811,1201 +811,616 @@ var AttachmentButton = ({ buttonAttachment, open, setOpen }) => {
|
|
|
811
811
|
};
|
|
812
812
|
|
|
813
813
|
// src/Components/Adjuntar/mobile/AdjuntarMobile.tsx
|
|
814
|
-
import { IconButton as
|
|
814
|
+
import { IconButton as IconButton9, Stack as Stack7, SwipeableDrawer as SwipeableDrawer2, Tooltip as Tooltip4, Typography as Typography9, SvgIcon as SvgIcon6 } from "@mui/material";
|
|
815
815
|
import CssBaseline from "@mui/material/CssBaseline";
|
|
816
|
-
import { Box as
|
|
816
|
+
import { Box as Box12 } from "@mui/system";
|
|
817
817
|
import { CloseOutlined, DeleteOutline as DeleteOutline2, FolderOpenOutlined, PhotoCameraOutlined, UploadFileOutlined as UploadFileOutlined2 } from "@mui/icons-material";
|
|
818
818
|
import PhotoCameraIcon from "@mui/icons-material/PhotoCamera";
|
|
819
819
|
import CancelOutlinedIcon from "@mui/icons-material/CancelOutlined";
|
|
820
820
|
import ImageOutlinedIcon from "@mui/icons-material/ImageOutlined";
|
|
821
821
|
import FileDownloadOutlinedIcon from "@mui/icons-material/FileDownloadOutlined";
|
|
822
|
+
import * as Muicon6 from "@mui/icons-material";
|
|
823
|
+
|
|
824
|
+
// src/Components/Drawer/SCDrawer.tsx
|
|
825
|
+
import React17 from "react";
|
|
826
|
+
import { Drawer, Stack as Stack6, SwipeableDrawer, Box as Box11, Button as Button9 } from "@mui/material";
|
|
827
|
+
import Grid6 from "@mui/material/Grid";
|
|
828
|
+
|
|
829
|
+
// src/Components/Drawer/Helpers/Utils.tsx
|
|
822
830
|
import * as Muicon2 from "@mui/icons-material";
|
|
823
|
-
var
|
|
824
|
-
|
|
825
|
-
|
|
826
|
-
|
|
827
|
-
|
|
828
|
-
|
|
829
|
-
|
|
830
|
-
|
|
831
|
-
|
|
832
|
-
|
|
833
|
-
|
|
834
|
-
|
|
835
|
-
|
|
836
|
-
|
|
837
|
-
|
|
838
|
-
|
|
839
|
-
|
|
840
|
-
|
|
841
|
-
|
|
842
|
-
|
|
843
|
-
|
|
831
|
+
var getIcon = (iconName) => {
|
|
832
|
+
if (iconName && iconName in Muicon2) {
|
|
833
|
+
return Muicon2[iconName];
|
|
834
|
+
}
|
|
835
|
+
return null;
|
|
836
|
+
};
|
|
837
|
+
|
|
838
|
+
// src/Components/Drawer/Helpers/validateInput.tsx
|
|
839
|
+
var validateInputs = (arrayElements, onError, onSuccess, setChipFilters, setTextFilters) => {
|
|
840
|
+
var _a, _b;
|
|
841
|
+
let requiredValues = 0;
|
|
842
|
+
let filledValues = 0;
|
|
843
|
+
for (let i = 0; i < arrayElements.length; i++) {
|
|
844
|
+
const element = arrayElements[i];
|
|
845
|
+
const { validation, element: typeElement } = validateTypeElements(element);
|
|
846
|
+
const textValue = ((_a = typeElement.state) == null ? void 0 : _a.textValue) !== void 0 ? String((_b = typeElement.state) == null ? void 0 : _b.textValue) : String(typeElement.state);
|
|
847
|
+
if (typeElement == null ? void 0 : typeElement.required) {
|
|
848
|
+
requiredValues++;
|
|
849
|
+
if (textValue.trim() !== "" && textValue.trim() !== ",") {
|
|
850
|
+
filledValues++;
|
|
851
|
+
}
|
|
852
|
+
}
|
|
853
|
+
}
|
|
854
|
+
if (requiredValues === filledValues) {
|
|
855
|
+
onSuccess();
|
|
856
|
+
setChipFilters(true);
|
|
857
|
+
} else {
|
|
858
|
+
onError({
|
|
859
|
+
type: "error",
|
|
860
|
+
title: "Algunos campos son requeridos",
|
|
861
|
+
time: 10
|
|
862
|
+
});
|
|
863
|
+
setChipFilters(false);
|
|
864
|
+
}
|
|
865
|
+
};
|
|
866
|
+
|
|
867
|
+
// src/Components/Drawer/Helpers/validateTypeElement.tsx
|
|
868
|
+
import React6 from "react";
|
|
869
|
+
var COMPONENT_NAME_MAP = {
|
|
870
|
+
SCtextField: "textField",
|
|
871
|
+
SCtextArea: "textArea",
|
|
872
|
+
SCDateRange: "dateRange",
|
|
873
|
+
SCDatePicker: "datePicker",
|
|
874
|
+
SCTime: "time",
|
|
875
|
+
SCAutocomplete: "autocomplete",
|
|
876
|
+
SCSelect: "select"
|
|
877
|
+
};
|
|
878
|
+
var getComponentName = (node) => {
|
|
879
|
+
const type = node.type;
|
|
880
|
+
return typeof type === "function" ? type.displayName || type.name || "" : "";
|
|
881
|
+
};
|
|
882
|
+
var isKnownComponent = (node) => {
|
|
883
|
+
var _a;
|
|
884
|
+
const name = getComponentName(node);
|
|
885
|
+
if (COMPONENT_NAME_MAP[name]) return true;
|
|
886
|
+
if (((_a = node.props) == null ? void 0 : _a.typeFormat) === "multiselect") return true;
|
|
887
|
+
return false;
|
|
888
|
+
};
|
|
889
|
+
var findInTree = (node) => {
|
|
890
|
+
var _a;
|
|
891
|
+
if (!React6.isValidElement(node)) return null;
|
|
892
|
+
if (isKnownComponent(node)) return node;
|
|
893
|
+
const children = (_a = node.props) == null ? void 0 : _a.children;
|
|
894
|
+
if (!children) return null;
|
|
895
|
+
for (const child of React6.Children.toArray(children)) {
|
|
896
|
+
if (React6.isValidElement(child)) {
|
|
897
|
+
const found = findInTree(child);
|
|
898
|
+
if (found) return found;
|
|
899
|
+
}
|
|
900
|
+
}
|
|
901
|
+
return null;
|
|
902
|
+
};
|
|
903
|
+
var resolveValidation = (node) => {
|
|
904
|
+
var _a;
|
|
905
|
+
const name = getComponentName(node);
|
|
906
|
+
if (((_a = node.props) == null ? void 0 : _a.typeFormat) === "multiselect") return "multiselect";
|
|
907
|
+
return COMPONENT_NAME_MAP[name] || "";
|
|
908
|
+
};
|
|
909
|
+
var validateTypeElements = (element) => {
|
|
910
|
+
var _a;
|
|
911
|
+
let validation = "";
|
|
912
|
+
let typeElement = element;
|
|
913
|
+
if (element.type && COMPONENT_NAME_MAP[(_a = Object.keys(COMPONENT_NAME_MAP).find((k) => COMPONENT_NAME_MAP[k] === element.type)) != null ? _a : ""]) {
|
|
914
|
+
validation = element.type;
|
|
915
|
+
typeElement = element;
|
|
916
|
+
} else if (element.typeFormat === "multiselect") {
|
|
917
|
+
validation = "multiselect";
|
|
918
|
+
typeElement = element;
|
|
919
|
+
} else if (React6.isValidElement(element == null ? void 0 : element.component) && isKnownComponent(element.component)) {
|
|
920
|
+
const node = element.component;
|
|
921
|
+
validation = resolveValidation(node);
|
|
922
|
+
typeElement = node.props;
|
|
923
|
+
} else if (React6.isValidElement(element == null ? void 0 : element.component)) {
|
|
924
|
+
const found = findInTree(element.component);
|
|
925
|
+
if (found) {
|
|
926
|
+
validation = resolveValidation(found);
|
|
927
|
+
typeElement = found.props;
|
|
928
|
+
}
|
|
929
|
+
}
|
|
930
|
+
return { validation, element: typeElement };
|
|
931
|
+
};
|
|
932
|
+
|
|
933
|
+
// src/Components/Drawer/hooks/useDrawerState.ts
|
|
934
|
+
import { useState as useState5, useEffect as useEffect4 } from "react";
|
|
935
|
+
var useDrawerState = ({ open, setOpen }) => {
|
|
936
|
+
const [drawerOpen, setDrawerOpen] = useState5(open || false);
|
|
937
|
+
useEffect4(() => {
|
|
938
|
+
if (open !== void 0) {
|
|
939
|
+
setDrawerOpen(open);
|
|
940
|
+
}
|
|
941
|
+
}, [open]);
|
|
942
|
+
const handleDrawerClose = () => {
|
|
943
|
+
setDrawerOpen(false);
|
|
944
|
+
setOpen == null ? void 0 : setOpen(false);
|
|
844
945
|
};
|
|
845
|
-
|
|
846
|
-
|
|
847
|
-
|
|
848
|
-
|
|
946
|
+
const handleDrawerOpen = () => {
|
|
947
|
+
setDrawerOpen(true);
|
|
948
|
+
setOpen == null ? void 0 : setOpen(true);
|
|
949
|
+
};
|
|
950
|
+
const toggleDrawer = (newOpen) => () => {
|
|
951
|
+
if (newOpen) {
|
|
952
|
+
handleDrawerOpen();
|
|
849
953
|
} else {
|
|
850
|
-
|
|
954
|
+
handleDrawerClose();
|
|
851
955
|
}
|
|
852
|
-
}
|
|
853
|
-
const closeCam = () => {
|
|
854
|
-
setAbrirCamara(false);
|
|
855
956
|
};
|
|
856
|
-
|
|
857
|
-
|
|
858
|
-
|
|
957
|
+
return {
|
|
958
|
+
drawerOpen,
|
|
959
|
+
handleDrawerClose,
|
|
960
|
+
handleDrawerOpen,
|
|
961
|
+
toggleDrawer
|
|
859
962
|
};
|
|
860
|
-
|
|
861
|
-
|
|
862
|
-
|
|
863
|
-
|
|
864
|
-
|
|
865
|
-
|
|
866
|
-
|
|
867
|
-
|
|
868
|
-
|
|
869
|
-
|
|
963
|
+
};
|
|
964
|
+
|
|
965
|
+
// src/Components/Drawer/hooks/useChipFilters.ts
|
|
966
|
+
import { useState as useState6, useEffect as useEffect5 } from "react";
|
|
967
|
+
var useChipFilters = (arrayElements, chipFilters) => {
|
|
968
|
+
const [stateChipFilters, setChipFilters] = useState6(false);
|
|
969
|
+
const [textFilters, setTextFilters] = useState6([]);
|
|
970
|
+
useEffect5(() => {
|
|
971
|
+
if (chipFilters == null ? void 0 : chipFilters.length) {
|
|
972
|
+
setTextFilters([]);
|
|
973
|
+
processChipFilters();
|
|
870
974
|
}
|
|
871
|
-
}, [
|
|
872
|
-
const
|
|
873
|
-
|
|
874
|
-
|
|
875
|
-
|
|
876
|
-
if (capturedImage || capturedImage2) {
|
|
877
|
-
const image = capturedImage || capturedImage2;
|
|
878
|
-
if (!image) return;
|
|
879
|
-
const arr = image.split(",");
|
|
880
|
-
const mime = ((_a = arr[0].match(/:(.*?);/)) == null ? void 0 : _a[1]) || "image/jpeg";
|
|
881
|
-
const bstr = atob(arr[1]);
|
|
882
|
-
let n = bstr.length;
|
|
883
|
-
const u8arr = new Uint8Array(n);
|
|
884
|
-
while (n--) {
|
|
885
|
-
u8arr[n] = bstr.charCodeAt(n);
|
|
886
|
-
}
|
|
887
|
-
const fechaActual = new Date(Date.now());
|
|
888
|
-
const fechaConFormato = fechaActual.getFullYear() + "" + (fechaActual.getMonth() + 1) + fechaActual.getDate() + fechaActual.getHours() + fechaActual.getMinutes() + fechaActual.getSeconds();
|
|
889
|
-
const capturedFile = new File([u8arr], `photo_${fechaConFormato}.jpg`, { type: mime });
|
|
890
|
-
newFiles = [capturedFile];
|
|
891
|
-
setCapturedImage(null);
|
|
892
|
-
capturedImage2 = null;
|
|
975
|
+
}, [chipFilters]);
|
|
976
|
+
const processChipFilters = () => {
|
|
977
|
+
if (!(chipFilters == null ? void 0 : chipFilters.length)) {
|
|
978
|
+
processManualFilters();
|
|
979
|
+
return;
|
|
893
980
|
}
|
|
894
|
-
|
|
895
|
-
|
|
896
|
-
|
|
897
|
-
|
|
898
|
-
|
|
899
|
-
|
|
900
|
-
|
|
901
|
-
|
|
902
|
-
|
|
903
|
-
|
|
904
|
-
|
|
905
|
-
|
|
906
|
-
|
|
907
|
-
|
|
908
|
-
|
|
909
|
-
|
|
910
|
-
return;
|
|
911
|
-
}
|
|
912
|
-
if (sizeMB > maxSize) {
|
|
913
|
-
nuevosArchivos.push({
|
|
914
|
-
name: file.name,
|
|
915
|
-
size: file.size,
|
|
916
|
-
type: file.type,
|
|
917
|
-
progress: 0,
|
|
918
|
-
uploadError: true
|
|
919
|
-
});
|
|
920
|
-
setToast({
|
|
921
|
-
type: "error",
|
|
922
|
-
title: "Carga fallida",
|
|
923
|
-
seeMore: true,
|
|
924
|
-
listITems: [`El archivo "${file.name}" supera el l\xEDmite de ${maxSize}MB.`],
|
|
925
|
-
time: 5
|
|
926
|
-
});
|
|
927
|
-
return;
|
|
928
|
-
}
|
|
929
|
-
if (fileAccepted && !file.name.match(
|
|
930
|
-
new RegExp(
|
|
931
|
-
`(${fileAccepted.replace(/\./g, "\\.").replace(/,/g, "|")})$`,
|
|
932
|
-
"i"
|
|
933
|
-
)
|
|
934
|
-
)) {
|
|
935
|
-
setToast({
|
|
936
|
-
type: "error",
|
|
937
|
-
title: "Tipo de archivo no permitido",
|
|
938
|
-
listITems: [`El archivo "${file.name}" no es un tipo permitido.`],
|
|
939
|
-
seeMore: true,
|
|
940
|
-
time: 5
|
|
981
|
+
arrayElements.forEach((arrayElement) => {
|
|
982
|
+
var _a;
|
|
983
|
+
const { validation, element: typeElement } = validateTypeElements(arrayElement);
|
|
984
|
+
if (Array.isArray((_a = typeElement.state) == null ? void 0 : _a.textValue)) {
|
|
985
|
+
chipFilters.forEach((chipFilter) => {
|
|
986
|
+
const chipValue = String(chipFilter).trim();
|
|
987
|
+
const isInArray = typeElement.state.textValue.some(
|
|
988
|
+
(v) => String(v).trim() === chipValue
|
|
989
|
+
);
|
|
990
|
+
if (isInArray && chipValue !== "" && chipValue !== ",") {
|
|
991
|
+
setTextFilters((prev) => {
|
|
992
|
+
const exists = prev.findIndex((f) => f.value === chipValue) !== -1;
|
|
993
|
+
if (exists) return prev;
|
|
994
|
+
return [...prev, { value: chipValue, arrayElement: typeElement }];
|
|
995
|
+
});
|
|
996
|
+
}
|
|
941
997
|
});
|
|
942
998
|
return;
|
|
943
999
|
}
|
|
944
|
-
|
|
945
|
-
|
|
946
|
-
|
|
947
|
-
|
|
948
|
-
|
|
949
|
-
|
|
1000
|
+
const currentValue = getCurrentValue(validation, typeElement);
|
|
1001
|
+
chipFilters.forEach((chipFilter) => {
|
|
1002
|
+
const chipValue = String(chipFilter).trim();
|
|
1003
|
+
if (currentValue === chipValue && currentValue !== "" && currentValue !== ",") {
|
|
1004
|
+
updateFilter(currentValue, typeElement, arrayElement.label);
|
|
1005
|
+
}
|
|
950
1006
|
});
|
|
951
|
-
archivosValidos.push(file);
|
|
952
1007
|
});
|
|
953
|
-
|
|
954
|
-
|
|
955
|
-
|
|
956
|
-
|
|
957
|
-
|
|
958
|
-
|
|
959
|
-
|
|
960
|
-
|
|
1008
|
+
};
|
|
1009
|
+
const processManualFilters = () => {
|
|
1010
|
+
const newFiltersToAdd = [];
|
|
1011
|
+
arrayElements.forEach((element) => {
|
|
1012
|
+
var _a, _b, _c, _d, _e, _f, _g, _h;
|
|
1013
|
+
const { validation, element: typeElement } = validateTypeElements(element);
|
|
1014
|
+
const textValue = ((_a = typeElement.state) == null ? void 0 : _a.textValue) !== void 0 ? String((_b = typeElement.state) == null ? void 0 : _b.textValue) : String(typeElement.state);
|
|
1015
|
+
if (textValue.trim() !== "" && textValue.trim() !== "," && textValue.trim() !== "undefined") {
|
|
1016
|
+
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")}` : validation === "datePicker" ? (_f = (_e = typeElement.state) == null ? void 0 : _e.format("DD/MM/YYYY")) != null ? _f : "" : validation === "time" ? (_h = (_g = typeElement.state) == null ? void 0 : _g.format("HH:mm")) != null ? _h : "" : textValue;
|
|
1017
|
+
const existingFilterIndex = newFiltersToAdd.findIndex(
|
|
1018
|
+
(filter) => filter.arrayElement.label === element.label
|
|
1019
|
+
);
|
|
1020
|
+
const newFilter = { value, arrayElement: typeElement };
|
|
1021
|
+
if (existingFilterIndex !== -1) {
|
|
1022
|
+
newFiltersToAdd[existingFilterIndex] = newFilter;
|
|
1023
|
+
} else {
|
|
1024
|
+
newFiltersToAdd.push(newFilter);
|
|
1025
|
+
}
|
|
1026
|
+
}
|
|
1027
|
+
});
|
|
1028
|
+
setTextFilters((prevFilters) => {
|
|
1029
|
+
let updatedFilters = [...prevFilters];
|
|
1030
|
+
newFiltersToAdd.forEach((newFilter) => {
|
|
1031
|
+
const existingFilterIndex = updatedFilters.findIndex(
|
|
1032
|
+
(filter) => filter.arrayElement.label === newFilter.arrayElement.label
|
|
1033
|
+
);
|
|
1034
|
+
if (existingFilterIndex !== -1) {
|
|
1035
|
+
updatedFilters[existingFilterIndex] = newFilter;
|
|
1036
|
+
} else {
|
|
1037
|
+
updatedFilters.push(newFilter);
|
|
961
1038
|
}
|
|
962
|
-
return updatedFiles;
|
|
963
1039
|
});
|
|
964
|
-
|
|
965
|
-
|
|
966
|
-
event2.target.value = "";
|
|
1040
|
+
return updatedFilters;
|
|
1041
|
+
});
|
|
967
1042
|
};
|
|
968
|
-
const
|
|
969
|
-
|
|
970
|
-
|
|
971
|
-
|
|
972
|
-
|
|
973
|
-
const updatedFiles = files.filter(
|
|
974
|
-
(file) => !(file.name === fileToRemove.name && file.size === fileToRemove.size)
|
|
975
|
-
);
|
|
976
|
-
setFiles(updatedFiles);
|
|
977
|
-
if (onChange) {
|
|
978
|
-
const remainingValidFiles = updatedFiles.filter((f) => !f.uploadError).map((f) => new File([], f.name, { type: f.type }));
|
|
979
|
-
onChange(remainingValidFiles);
|
|
1043
|
+
const getCurrentValue = (validation, typeElement) => {
|
|
1044
|
+
var _a, _b, _c, _d, _e, _f, _g, _h, _i;
|
|
1045
|
+
if (validation === "dateRange") {
|
|
1046
|
+
if (((_a = typeElement.state) == null ? void 0 : _a[0]) && ((_b = typeElement.state) == null ? void 0 : _b[1])) {
|
|
1047
|
+
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")}`;
|
|
980
1048
|
}
|
|
981
|
-
|
|
982
|
-
type: "success",
|
|
983
|
-
title: "Archivo eliminado",
|
|
984
|
-
listITems: [`El archivo "${fileToRemove.name}" ha sido eliminado exitosamente.`],
|
|
985
|
-
seeMore: true,
|
|
986
|
-
time: 3
|
|
987
|
-
});
|
|
988
|
-
} catch (error) {
|
|
989
|
-
setToast({
|
|
990
|
-
type: "error",
|
|
991
|
-
title: "Error al eliminar",
|
|
992
|
-
listITems: [`No se pudo eliminar el archivo "${fileToRemove.name}".`],
|
|
993
|
-
seeMore: true,
|
|
994
|
-
time: 5
|
|
995
|
-
});
|
|
1049
|
+
return "";
|
|
996
1050
|
}
|
|
997
|
-
|
|
998
|
-
|
|
999
|
-
{ icon: /* @__PURE__ */ React6.createElement(ImageOutlinedIcon, { type: "file", color: "primary" }), color: "primary", label: "Galer\xEDa", onClick: () => {
|
|
1000
|
-
var _a;
|
|
1001
|
-
return (_a = inputRef.current) == null ? void 0 : _a.click();
|
|
1002
|
-
} },
|
|
1003
|
-
{ icon: /* @__PURE__ */ React6.createElement(PhotoCameraOutlined, { type: "file", color: "success" }), color: "success", label: "C\xE1mara", onClick: () => openCam() },
|
|
1004
|
-
{ icon: /* @__PURE__ */ React6.createElement(FolderOpenOutlined, { type: "file", color: "warning" }), color: "warning", label: "Archivos", onClick: () => {
|
|
1005
|
-
var _a;
|
|
1006
|
-
return (_a = inputRef.current) == null ? void 0 : _a.click();
|
|
1007
|
-
} }
|
|
1008
|
-
];
|
|
1009
|
-
useEffect4(() => {
|
|
1010
|
-
if (initialFiles && initialFiles.length > 0) {
|
|
1011
|
-
setFiles(initialFiles);
|
|
1051
|
+
if (validation === "datePicker") {
|
|
1052
|
+
return ((_f = (_e = typeElement.state) == null ? void 0 : _e.isValid) == null ? void 0 : _f.call(_e)) ? typeElement.state.format("DD/MM/YYYY") : "";
|
|
1012
1053
|
}
|
|
1013
|
-
|
|
1014
|
-
|
|
1015
|
-
AttachmentButton,
|
|
1016
|
-
{
|
|
1017
|
-
buttonAttachment,
|
|
1018
|
-
open,
|
|
1019
|
-
setOpen
|
|
1054
|
+
if (validation === "time") {
|
|
1055
|
+
return ((_h = (_g = typeElement.state) == null ? void 0 : _g.isValid) == null ? void 0 : _h.call(_g)) ? typeElement.state.format("HH:mm") : "";
|
|
1020
1056
|
}
|
|
1021
|
-
|
|
1022
|
-
|
|
1023
|
-
|
|
1024
|
-
|
|
1025
|
-
|
|
1026
|
-
|
|
1027
|
-
|
|
1028
|
-
|
|
1029
|
-
|
|
1030
|
-
|
|
1031
|
-
|
|
1032
|
-
|
|
1033
|
-
|
|
1034
|
-
|
|
1035
|
-
},
|
|
1036
|
-
BackdropProps: { timeout: 400 }
|
|
1037
|
-
},
|
|
1038
|
-
transitionDuration: { enter: 500, exit: 400 },
|
|
1039
|
-
hysteresis: 0.2,
|
|
1040
|
-
anchor: "bottom",
|
|
1041
|
-
swipeAreaWidth: 56,
|
|
1042
|
-
open,
|
|
1043
|
-
onClose: toggleAttachment(false),
|
|
1044
|
-
onOpen: toggleAttachment(true)
|
|
1045
|
-
},
|
|
1046
|
-
toast && /* @__PURE__ */ React6.createElement(SCToastNotification, __spreadValues({}, toast)),
|
|
1047
|
-
/* @__PURE__ */ React6.createElement(Box4, { display: "flex", flexDirection: "column", alignItems: "center", p: 2, gap: 2 }, /* @__PURE__ */ React6.createElement(Box4, { display: "flex", width: "100%", justifyContent: "space-between", alignItems: "center", gap: 1, p: 1 }, /* @__PURE__ */ React6.createElement(Typography4, { variant: "h6", color: "text.primary" }, "Agrega adjuntos"), /* @__PURE__ */ React6.createElement(IconButton4, { size: "medium", onClick: toggleAttachment(false) }, /* @__PURE__ */ React6.createElement(CloseOutlined, { color: "action" }))), /* @__PURE__ */ React6.createElement(
|
|
1048
|
-
"input",
|
|
1049
|
-
{
|
|
1050
|
-
type: "file",
|
|
1051
|
-
multiple: true,
|
|
1052
|
-
hidden: true,
|
|
1053
|
-
ref: inputRef,
|
|
1054
|
-
onChange: handleUpload
|
|
1057
|
+
return ((_i = typeElement.state) == null ? void 0 : _i.textValue) !== void 0 ? String(typeElement.state.textValue).trim() : String(typeElement.state).trim();
|
|
1058
|
+
};
|
|
1059
|
+
const updateFilter = (value, typeElement, label) => {
|
|
1060
|
+
setTextFilters((prevFilters) => {
|
|
1061
|
+
const newFilter = { value, arrayElement: typeElement };
|
|
1062
|
+
const existingFilterIndex = prevFilters.findIndex(
|
|
1063
|
+
(filter) => label !== void 0 ? filter.arrayElement.label === label : filter.value === value
|
|
1064
|
+
);
|
|
1065
|
+
if (existingFilterIndex !== -1) {
|
|
1066
|
+
const updatedFilters = [...prevFilters];
|
|
1067
|
+
updatedFilters[existingFilterIndex] = newFilter;
|
|
1068
|
+
return updatedFilters;
|
|
1069
|
+
} else {
|
|
1070
|
+
return [...prevFilters, newFilter];
|
|
1055
1071
|
}
|
|
1056
|
-
|
|
1057
|
-
|
|
1058
|
-
|
|
1059
|
-
|
|
1060
|
-
|
|
1061
|
-
|
|
1062
|
-
|
|
1063
|
-
|
|
1064
|
-
|
|
1065
|
-
|
|
1066
|
-
|
|
1067
|
-
|
|
1068
|
-
|
|
1069
|
-
p: 1,
|
|
1070
|
-
gap: 0.5,
|
|
1071
|
-
onClick: option.onClick,
|
|
1072
|
-
sx: {
|
|
1073
|
-
cursor: "pointer"
|
|
1074
|
-
}
|
|
1075
|
-
},
|
|
1076
|
-
/* @__PURE__ */ React6.createElement(
|
|
1077
|
-
IconButton4,
|
|
1078
|
-
{
|
|
1079
|
-
sx: {
|
|
1080
|
-
bgcolor: getAttachmentColor(option.color)
|
|
1081
|
-
},
|
|
1082
|
-
size: "large"
|
|
1083
|
-
},
|
|
1084
|
-
option.icon
|
|
1085
|
-
),
|
|
1086
|
-
/* @__PURE__ */ React6.createElement(Typography4, { variant: "body2", color: "text.secondary" }, option.label)
|
|
1087
|
-
))))
|
|
1088
|
-
), abrirCamara && /* @__PURE__ */ React6.createElement(React6.Fragment, null, /* @__PURE__ */ React6.createElement(CancelOutlinedIcon, { onClick: closeCam, sx: { borderRadius: "50px", height: "35px", width: "35px", zIndex: 1700, background: "white", position: "absolute", left: `calc(100% - 50px)`, bottom: `calc(100% - 50px)` } }), /* @__PURE__ */ React6.createElement(Stack4, { className: "camras" }, /* @__PURE__ */ React6.createElement(
|
|
1089
|
-
Webcam,
|
|
1090
|
-
{
|
|
1091
|
-
audio: false,
|
|
1092
|
-
ref: webcamRef,
|
|
1093
|
-
width: "100%",
|
|
1094
|
-
height: "100%",
|
|
1095
|
-
screenshotFormat: "image/jpeg",
|
|
1096
|
-
videoConstraints: {
|
|
1097
|
-
//facingMode: { exact: "environment" }
|
|
1098
|
-
facingMode: "environment"
|
|
1099
|
-
//facingMode: "environment" // cámara trasera
|
|
1100
|
-
},
|
|
1101
|
-
style: {
|
|
1102
|
-
position: "fixed",
|
|
1103
|
-
// Fijo para cubrir toda la ventana
|
|
1104
|
-
top: 0,
|
|
1105
|
-
left: 0,
|
|
1106
|
-
objectFit: "cover",
|
|
1107
|
-
backgroundColor: "black",
|
|
1108
|
-
zIndex: 1600
|
|
1109
|
-
// Encima de todo
|
|
1072
|
+
});
|
|
1073
|
+
};
|
|
1074
|
+
const hasActiveFilters = () => {
|
|
1075
|
+
return arrayElements.some((arrayElement) => {
|
|
1076
|
+
var _a, _b, _c;
|
|
1077
|
+
const { validation, element: typeElement } = validateTypeElements(arrayElement);
|
|
1078
|
+
if (((_a = typeElement.state) == null ? void 0 : _a.textValue) !== void 0) {
|
|
1079
|
+
return String(typeElement.state.textValue).trim() !== "";
|
|
1080
|
+
} else if (validation === "dateRange") {
|
|
1081
|
+
return ((_b = typeElement.state) == null ? void 0 : _b[0]) !== null && ((_c = typeElement.state) == null ? void 0 : _c[1]) !== null;
|
|
1082
|
+
} else {
|
|
1083
|
+
const stateValue = String(typeElement.state).trim();
|
|
1084
|
+
return stateValue !== "" && stateValue !== "," && stateValue !== "undefined";
|
|
1110
1085
|
}
|
|
1111
|
-
}
|
|
1112
|
-
), /* @__PURE__ */ React6.createElement(
|
|
1113
|
-
PhotoCameraIcon,
|
|
1114
|
-
{
|
|
1115
|
-
onClick: capture,
|
|
1116
|
-
sx: {
|
|
1117
|
-
height: "45px",
|
|
1118
|
-
width: "45px",
|
|
1119
|
-
padding: "6px",
|
|
1120
|
-
backgroundColor: "white",
|
|
1121
|
-
color: "#1E62A1",
|
|
1122
|
-
borderRadius: "50px",
|
|
1123
|
-
zIndex: 1700,
|
|
1124
|
-
position: "absolute",
|
|
1125
|
-
bottom: "10px",
|
|
1126
|
-
left: "50%"
|
|
1127
|
-
},
|
|
1128
|
-
fontSize: "medium"
|
|
1129
|
-
}
|
|
1130
|
-
))), files.length > 0 && /* @__PURE__ */ React6.createElement(
|
|
1131
|
-
Stack4,
|
|
1132
|
-
{
|
|
1133
|
-
"data-testid": "ContenedorArchivosAdjuntos",
|
|
1134
|
-
id: "ContenedorArchivosAdjuntos",
|
|
1135
|
-
width: "100%",
|
|
1136
|
-
sx: __spreadValues({
|
|
1137
|
-
overflowY: "auto"
|
|
1138
|
-
}, files.length > 5 && {
|
|
1139
|
-
maxHeight: 250
|
|
1140
|
-
}),
|
|
1141
|
-
spacing: 1
|
|
1142
|
-
},
|
|
1143
|
-
files.map((file) => /* @__PURE__ */ React6.createElement(
|
|
1144
|
-
Stack4,
|
|
1145
|
-
{
|
|
1146
|
-
height: 46,
|
|
1147
|
-
key: file.name + (file.uploadError ? "_error" : ""),
|
|
1148
|
-
direction: "row",
|
|
1149
|
-
alignItems: "center",
|
|
1150
|
-
justifyContent: "space-between",
|
|
1151
|
-
gap: 2,
|
|
1152
|
-
padding: 1,
|
|
1153
|
-
borderRadius: 1,
|
|
1154
|
-
sx: {
|
|
1155
|
-
backgroundColor: file.uploadError ? "error.50" : "transparent",
|
|
1156
|
-
":hover": {
|
|
1157
|
-
backgroundColor: file.uploadError ? "error.100" : "primary.50"
|
|
1158
|
-
}
|
|
1159
|
-
}
|
|
1160
|
-
},
|
|
1161
|
-
/* @__PURE__ */ React6.createElement(Stack4, { direction: "row", alignItems: "center", gap: 1, width: "100%" }, iconFileItem ? /* @__PURE__ */ React6.createElement(SvgIcon2, { color: file.uploadError ? "error" : "primary", fontSize: "small", component: IconFileItem }) : /* @__PURE__ */ React6.createElement(
|
|
1162
|
-
UploadFileOutlined2,
|
|
1163
|
-
{
|
|
1164
|
-
color: file.uploadError ? "error" : "primary",
|
|
1165
|
-
fontSize: "small"
|
|
1166
|
-
}
|
|
1167
|
-
), /* @__PURE__ */ React6.createElement(Stack4, { width: "100%" }, /* @__PURE__ */ React6.createElement(
|
|
1168
|
-
Typography4,
|
|
1169
|
-
{
|
|
1170
|
-
variant: "body2",
|
|
1171
|
-
color: "text.primary",
|
|
1172
|
-
whiteSpace: "nowrap",
|
|
1173
|
-
overflow: "hidden",
|
|
1174
|
-
textOverflow: "ellipsis",
|
|
1175
|
-
maxWidth: "310px"
|
|
1176
|
-
},
|
|
1177
|
-
file.name
|
|
1178
|
-
), /* @__PURE__ */ React6.createElement(
|
|
1179
|
-
Typography4,
|
|
1180
|
-
{
|
|
1181
|
-
variant: "caption",
|
|
1182
|
-
color: file.uploadError ? "error" : "text.secondary"
|
|
1183
|
-
},
|
|
1184
|
-
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}`
|
|
1185
|
-
))),
|
|
1186
|
-
view == "file" ? /* @__PURE__ */ React6.createElement(Tooltip2, { title: "Descargar" }, /* @__PURE__ */ React6.createElement(
|
|
1187
|
-
IconButton4,
|
|
1188
|
-
{
|
|
1189
|
-
size: "small",
|
|
1190
|
-
onClick: () => downloadAction == null ? void 0 : downloadAction(file),
|
|
1191
|
-
disabled: file.uploadError,
|
|
1192
|
-
"aria-label": `Descargar ${file.name}`
|
|
1193
|
-
},
|
|
1194
|
-
/* @__PURE__ */ React6.createElement(FileDownloadOutlinedIcon, { fontSize: "small", color: "action" })
|
|
1195
|
-
)) : "",
|
|
1196
|
-
view == "button" ? /* @__PURE__ */ React6.createElement(Tooltip2, { title: "Eliminar" }, /* @__PURE__ */ React6.createElement(
|
|
1197
|
-
IconButton4,
|
|
1198
|
-
{
|
|
1199
|
-
size: "small",
|
|
1200
|
-
onClick: () => handleDeleteFile(file),
|
|
1201
|
-
"aria-label": `Eliminar ${file.name}`
|
|
1202
|
-
},
|
|
1203
|
-
/* @__PURE__ */ React6.createElement(DeleteOutline2, { fontSize: "small", color: "action" })
|
|
1204
|
-
)) : ""
|
|
1205
|
-
))
|
|
1206
|
-
));
|
|
1207
|
-
};
|
|
1208
|
-
|
|
1209
|
-
// src/Components/Calendario/Calendar.tsx
|
|
1210
|
-
import React31, { useEffect as useEffect12, useState as useState15 } from "react";
|
|
1211
|
-
import { Box as Box19, CircularProgress as CircularProgress5 } from "@mui/material";
|
|
1212
|
-
|
|
1213
|
-
// src/Components/Calendario/CalendarToolbar.tsx
|
|
1214
|
-
import React7, { useState as useState6 } from "react";
|
|
1215
|
-
import { ChevronLeft, ChevronRight, KeyboardArrowDown as KeyboardArrowDown2, EventOutlined } from "@mui/icons-material";
|
|
1216
|
-
import { Box as Box5, Chip, IconButton as IconButton5, Menu, MenuItem, Stack as Stack5, Typography as Typography5 } from "@mui/material";
|
|
1217
|
-
import dayjs from "dayjs";
|
|
1218
|
-
import updateLocale from "dayjs/plugin/updateLocale";
|
|
1219
|
-
import "dayjs/locale/es";
|
|
1220
|
-
dayjs.locale("es");
|
|
1221
|
-
dayjs.extend(updateLocale);
|
|
1222
|
-
dayjs.updateLocale("en", {
|
|
1223
|
-
weekStart: 0
|
|
1224
|
-
// 0 = domingo
|
|
1225
|
-
});
|
|
1226
|
-
var CalendarToolbar = ({
|
|
1227
|
-
labelDate,
|
|
1228
|
-
view,
|
|
1229
|
-
onView,
|
|
1230
|
-
onNavigate,
|
|
1231
|
-
children
|
|
1232
|
-
}) => {
|
|
1233
|
-
const [anchorEl, setAnchorEl] = useState6(null);
|
|
1234
|
-
const open = Boolean(anchorEl);
|
|
1235
|
-
const handleMenuOpen = (event2) => {
|
|
1236
|
-
setAnchorEl(event2.currentTarget);
|
|
1086
|
+
});
|
|
1237
1087
|
};
|
|
1238
|
-
const
|
|
1239
|
-
|
|
1088
|
+
const shouldShowChips = (chipFilters == null ? void 0 : chipFilters.length) ? true : stateChipFilters && hasActiveFilters();
|
|
1089
|
+
return {
|
|
1090
|
+
stateChipFilters,
|
|
1091
|
+
setChipFilters,
|
|
1092
|
+
textFilters,
|
|
1093
|
+
setTextFilters,
|
|
1094
|
+
shouldShowChips,
|
|
1095
|
+
processChipFilters,
|
|
1096
|
+
hasActiveFilters
|
|
1240
1097
|
};
|
|
1241
|
-
|
|
1242
|
-
|
|
1243
|
-
|
|
1098
|
+
};
|
|
1099
|
+
|
|
1100
|
+
// src/Components/Drawer/hooks/useToast.ts
|
|
1101
|
+
import { useState as useState7 } from "react";
|
|
1102
|
+
var useToast = () => {
|
|
1103
|
+
const [toast, setToast] = useState7(null);
|
|
1104
|
+
const setToastWithDelay = (toastContent) => {
|
|
1105
|
+
setToast(null);
|
|
1106
|
+
setTimeout(() => {
|
|
1107
|
+
setToast(toastContent);
|
|
1108
|
+
}, 10);
|
|
1244
1109
|
};
|
|
1245
|
-
const
|
|
1246
|
-
|
|
1247
|
-
|
|
1248
|
-
|
|
1249
|
-
|
|
1250
|
-
}
|
|
1251
|
-
if (view === "week") {
|
|
1252
|
-
return `${labelDate.startOf("week").format("DD MMM")} - ${labelDate.endOf("week").format("DD MMM YYYY")}`;
|
|
1253
|
-
}
|
|
1254
|
-
return labelDate.format(" DD MMMM YYYY");
|
|
1110
|
+
const clearToast = () => setToast(null);
|
|
1111
|
+
return {
|
|
1112
|
+
toast,
|
|
1113
|
+
setToastWithDelay,
|
|
1114
|
+
clearToast
|
|
1255
1115
|
};
|
|
1256
|
-
return /* @__PURE__ */ React7.createElement(Stack5, { direction: "row", alignItems: "center", justifyContent: "space-between", gap: 1.5, sx: { paddingBottom: "16px" } }, /* @__PURE__ */ React7.createElement(Stack5, { direction: "row", alignItems: "center", justifyContent: "flex-start", gap: 1.5 }, /* @__PURE__ */ React7.createElement(Box5, null, /* @__PURE__ */ React7.createElement(
|
|
1257
|
-
Chip,
|
|
1258
|
-
{
|
|
1259
|
-
size: "medium",
|
|
1260
|
-
label: "Hoy",
|
|
1261
|
-
icon: /* @__PURE__ */ React7.createElement(EventOutlined, { fontSize: "small" }),
|
|
1262
|
-
color: "primary",
|
|
1263
|
-
onClick: () => onNavigate("TODAY"),
|
|
1264
|
-
variant: "standard"
|
|
1265
|
-
}
|
|
1266
|
-
)), /* @__PURE__ */ React7.createElement(Stack5, { direction: "row", alignItems: "center", gap: 1 }, /* @__PURE__ */ React7.createElement(IconButton5, { "aria-label": "Anterior", onClick: () => onNavigate("PREV"), size: "small", color: "primary" }, /* @__PURE__ */ React7.createElement(ChevronLeft, { fontSize: "small" })), /* @__PURE__ */ React7.createElement(IconButton5, { "aria-label": "Siguiente", onClick: () => onNavigate("NEXT"), size: "small", color: "primary" }, /* @__PURE__ */ React7.createElement(ChevronRight, { fontSize: "small" })), /* @__PURE__ */ React7.createElement(Typography5, { variant: "h6", color: "primary", "data-testid": "currentDate" }, getFormattedDate()), /* @__PURE__ */ React7.createElement(IconButton5, { onClick: handleMenuOpen, size: "small", color: "primary", "aria-label": "Cambiar vista" }, /* @__PURE__ */ React7.createElement(KeyboardArrowDown2, { fontSize: "small" })), /* @__PURE__ */ React7.createElement(
|
|
1267
|
-
Menu,
|
|
1268
|
-
{
|
|
1269
|
-
anchorEl,
|
|
1270
|
-
open,
|
|
1271
|
-
onClose: handleMenuClose,
|
|
1272
|
-
anchorOrigin: { vertical: "bottom", horizontal: "center" },
|
|
1273
|
-
transformOrigin: { vertical: "top", horizontal: "center" }
|
|
1274
|
-
},
|
|
1275
|
-
/* @__PURE__ */ React7.createElement(MenuItem, { onClick: () => handleViewChange("month") }, "Mes"),
|
|
1276
|
-
/* @__PURE__ */ React7.createElement(MenuItem, { onClick: () => handleViewChange("week") }, "Semana"),
|
|
1277
|
-
/* @__PURE__ */ React7.createElement(MenuItem, { onClick: () => handleViewChange("day") }, "D\xEDa")
|
|
1278
|
-
))), children ? /* @__PURE__ */ React7.createElement(Box5, null, children) : /* @__PURE__ */ React7.createElement(Box5, { width: "24px" }), " ");
|
|
1279
1116
|
};
|
|
1280
1117
|
|
|
1281
|
-
// src/Components/
|
|
1282
|
-
|
|
1283
|
-
|
|
1284
|
-
|
|
1285
|
-
|
|
1286
|
-
|
|
1287
|
-
|
|
1288
|
-
|
|
1289
|
-
|
|
1290
|
-
|
|
1291
|
-
|
|
1292
|
-
|
|
1293
|
-
|
|
1294
|
-
|
|
1295
|
-
|
|
1296
|
-
|
|
1297
|
-
|
|
1118
|
+
// src/Components/Drawer/utils/filterUtils.ts
|
|
1119
|
+
var resetElementByType = (originalElement, validation, typeElement) => {
|
|
1120
|
+
let defaultValue;
|
|
1121
|
+
switch (validation) {
|
|
1122
|
+
case "textField":
|
|
1123
|
+
case "textArea":
|
|
1124
|
+
defaultValue = "";
|
|
1125
|
+
break;
|
|
1126
|
+
case "dateRange":
|
|
1127
|
+
defaultValue = [null, null];
|
|
1128
|
+
break;
|
|
1129
|
+
case "datePicker":
|
|
1130
|
+
case "time":
|
|
1131
|
+
defaultValue = null;
|
|
1132
|
+
break;
|
|
1133
|
+
case "multiselect":
|
|
1134
|
+
defaultValue = { hiddenValue: [], textValue: [] };
|
|
1135
|
+
break;
|
|
1136
|
+
default:
|
|
1137
|
+
defaultValue = { hiddenValue: "-1", textValue: "" };
|
|
1138
|
+
}
|
|
1139
|
+
if (typeElement.setState) {
|
|
1140
|
+
typeElement.setState(defaultValue);
|
|
1298
1141
|
}
|
|
1299
|
-
return days;
|
|
1300
|
-
}
|
|
1301
|
-
var isToday = (date) => {
|
|
1302
|
-
return date.isSame(dayjs2(), "day");
|
|
1303
1142
|
};
|
|
1304
|
-
var
|
|
1305
|
-
|
|
1306
|
-
|
|
1307
|
-
|
|
1308
|
-
|
|
1309
|
-
|
|
1310
|
-
|
|
1311
|
-
|
|
1143
|
+
var cleanAllFilters = (arrayElements, setTextFilters) => {
|
|
1144
|
+
arrayElements.forEach((element) => {
|
|
1145
|
+
const { validation, element: typeElement } = validateTypeElements(element);
|
|
1146
|
+
if (typeElement.setState) {
|
|
1147
|
+
resetElementByType(element, validation, typeElement);
|
|
1148
|
+
}
|
|
1149
|
+
});
|
|
1150
|
+
setTextFilters([]);
|
|
1151
|
+
};
|
|
1152
|
+
var deleteFilter = (element, shouldShowChips, setTextFilters) => {
|
|
1153
|
+
const { validation, element: typeElement } = validateTypeElements(element);
|
|
1154
|
+
if (typeElement.setState && shouldShowChips) {
|
|
1155
|
+
resetElementByType(element, validation, typeElement);
|
|
1156
|
+
setTextFilters(
|
|
1157
|
+
(prevFilters) => prevFilters.filter((filter) => filter.arrayElement.label !== element.label)
|
|
1158
|
+
);
|
|
1159
|
+
}
|
|
1312
1160
|
};
|
|
1313
1161
|
|
|
1314
|
-
// src/Components/
|
|
1315
|
-
import
|
|
1316
|
-
import {
|
|
1317
|
-
var
|
|
1318
|
-
|
|
1319
|
-
|
|
1320
|
-
|
|
1321
|
-
|
|
1322
|
-
const
|
|
1323
|
-
|
|
1324
|
-
|
|
1325
|
-
|
|
1326
|
-
|
|
1327
|
-
|
|
1328
|
-
|
|
1329
|
-
|
|
1330
|
-
|
|
1331
|
-
|
|
1332
|
-
|
|
1333
|
-
|
|
1334
|
-
|
|
1335
|
-
|
|
1336
|
-
e.stopPropagation();
|
|
1337
|
-
onClick == null ? void 0 : onClick(event2);
|
|
1338
|
-
},
|
|
1339
|
-
sx: (theme) => __spreadValues({
|
|
1340
|
-
backgroundColor: theme.palette.common.white,
|
|
1341
|
-
boxShadow: theme.shadows[2],
|
|
1342
|
-
color: theme.palette.text.secondary,
|
|
1343
|
-
overflow: "hidden",
|
|
1344
|
-
cursor: onClick ? "pointer" : "default"
|
|
1345
|
-
}, sx)
|
|
1346
|
-
},
|
|
1347
|
-
/* @__PURE__ */ React8.createElement(
|
|
1348
|
-
Divider2,
|
|
1349
|
-
{
|
|
1350
|
-
orientation: "vertical",
|
|
1351
|
-
flexItem: true,
|
|
1162
|
+
// src/Components/Drawer/components/DrawerButton.tsx
|
|
1163
|
+
import React7 from "react";
|
|
1164
|
+
import { Button as Button5, Chip } from "@mui/material";
|
|
1165
|
+
var DrawerButton = ({
|
|
1166
|
+
buttonDrawer,
|
|
1167
|
+
onToggle
|
|
1168
|
+
}) => {
|
|
1169
|
+
var _a, _b, _c;
|
|
1170
|
+
const ButtonIcon = getIcon(buttonDrawer == null ? void 0 : buttonDrawer.icon);
|
|
1171
|
+
if ((buttonDrawer == null ? void 0 : buttonDrawer.type) === "chip") {
|
|
1172
|
+
return /* @__PURE__ */ React7.createElement(
|
|
1173
|
+
Chip,
|
|
1174
|
+
__spreadProps(__spreadValues({
|
|
1175
|
+
onClick: onToggle,
|
|
1176
|
+
size: "medium",
|
|
1177
|
+
color: buttonDrawer == null ? void 0 : buttonDrawer.color,
|
|
1178
|
+
variant: (buttonDrawer == null ? void 0 : buttonDrawer.variant) === "contained" ? "filled" : "outlined",
|
|
1179
|
+
label: (_a = buttonDrawer == null ? void 0 : buttonDrawer.text) != null ? _a : "",
|
|
1180
|
+
icon: (buttonDrawer == null ? void 0 : buttonDrawer.iconPosition) === "left" && ButtonIcon ? /* @__PURE__ */ React7.createElement(ButtonIcon, { fontSize: "small" }) : void 0,
|
|
1181
|
+
deleteIcon: (buttonDrawer == null ? void 0 : buttonDrawer.iconPosition) === "right" && ButtonIcon ? /* @__PURE__ */ React7.createElement(ButtonIcon, { fontSize: "small" }) : void 0
|
|
1182
|
+
}, (buttonDrawer == null ? void 0 : buttonDrawer.iconPosition) === "right" && ButtonIcon ? { onDelete: () => {
|
|
1183
|
+
} } : {}), {
|
|
1352
1184
|
sx: {
|
|
1353
|
-
|
|
1354
|
-
|
|
1355
|
-
borderRadius: "2px"
|
|
1356
|
-
}
|
|
1357
|
-
}
|
|
1358
|
-
),
|
|
1359
|
-
/* @__PURE__ */ React8.createElement(
|
|
1360
|
-
Box6,
|
|
1361
|
-
{
|
|
1362
|
-
px: 1,
|
|
1363
|
-
py: 0.5,
|
|
1364
|
-
flex: "1",
|
|
1365
|
-
minWidth: 0,
|
|
1366
|
-
display: "flex",
|
|
1367
|
-
alignItems: "center"
|
|
1368
|
-
},
|
|
1369
|
-
/* @__PURE__ */ React8.createElement(
|
|
1370
|
-
Typography6,
|
|
1371
|
-
{
|
|
1372
|
-
color: "text.primary",
|
|
1373
|
-
variant: "caption",
|
|
1374
|
-
noWrap: true,
|
|
1375
|
-
sx: {
|
|
1376
|
-
overflow: "hidden",
|
|
1377
|
-
textOverflow: "ellipsis",
|
|
1378
|
-
whiteSpace: "nowrap"
|
|
1185
|
+
"& .MuiChip-icon": {
|
|
1186
|
+
color: "inherit"
|
|
1379
1187
|
},
|
|
1380
|
-
|
|
1381
|
-
|
|
1382
|
-
|
|
1383
|
-
|
|
1384
|
-
|
|
1385
|
-
|
|
1386
|
-
|
|
1387
|
-
|
|
1388
|
-
|
|
1389
|
-
|
|
1390
|
-
|
|
1391
|
-
|
|
1392
|
-
|
|
1393
|
-
|
|
1394
|
-
|
|
1395
|
-
|
|
1396
|
-
|
|
1397
|
-
|
|
1398
|
-
horizontal: "right"
|
|
1399
|
-
},
|
|
1400
|
-
onClose: handlePopoverClose,
|
|
1401
|
-
disableRestoreFocus: true
|
|
1402
|
-
},
|
|
1403
|
-
onHover ? onHover(event2) : " "
|
|
1404
|
-
)
|
|
1405
|
-
)
|
|
1188
|
+
textTransform: "capitalize"
|
|
1189
|
+
}
|
|
1190
|
+
})
|
|
1191
|
+
);
|
|
1192
|
+
}
|
|
1193
|
+
return /* @__PURE__ */ React7.createElement(
|
|
1194
|
+
Button5,
|
|
1195
|
+
{
|
|
1196
|
+
"data-testid": "test-buttonDrawer",
|
|
1197
|
+
sx: { textTransform: "capitalize" },
|
|
1198
|
+
color: buttonDrawer == null ? void 0 : buttonDrawer.color,
|
|
1199
|
+
onClick: onToggle,
|
|
1200
|
+
size: "small",
|
|
1201
|
+
variant: (_b = buttonDrawer == null ? void 0 : buttonDrawer.variant) != null ? _b : "text",
|
|
1202
|
+
startIcon: ((buttonDrawer == null ? void 0 : buttonDrawer.iconPosition) === "left" || !(buttonDrawer == null ? void 0 : buttonDrawer.iconPosition)) && ButtonIcon ? /* @__PURE__ */ React7.createElement(ButtonIcon, { fontSize: "small" }) : null,
|
|
1203
|
+
endIcon: (buttonDrawer == null ? void 0 : buttonDrawer.iconPosition) === "right" && ButtonIcon ? /* @__PURE__ */ React7.createElement(ButtonIcon, { fontSize: "small" }) : null
|
|
1204
|
+
},
|
|
1205
|
+
(_c = buttonDrawer == null ? void 0 : buttonDrawer.text) != null ? _c : ""
|
|
1406
1206
|
);
|
|
1407
1207
|
};
|
|
1408
1208
|
|
|
1409
|
-
// src/Components/Drawer/
|
|
1410
|
-
import
|
|
1411
|
-
import {
|
|
1412
|
-
import
|
|
1209
|
+
// src/Components/Drawer/components/ChipFiltersDisplay.tsx
|
|
1210
|
+
import React8, { useRef as useRef2, useState as useState8, useEffect as useEffect6 } from "react";
|
|
1211
|
+
import { Box as Box4, IconButton as IconButton4, Chip as Chip2 } from "@mui/material";
|
|
1212
|
+
import ChevronLeftIcon from "@mui/icons-material/ChevronLeft";
|
|
1213
|
+
import ChevronRightIcon from "@mui/icons-material/ChevronRight";
|
|
1214
|
+
var ChipFiltersDisplay = ({
|
|
1215
|
+
textFilters,
|
|
1216
|
+
onDeleteFilter
|
|
1217
|
+
}) => {
|
|
1218
|
+
const scrollRef = useRef2(null);
|
|
1219
|
+
const [hasOverflow, setHasOverflow] = useState8(false);
|
|
1220
|
+
useEffect6(() => {
|
|
1221
|
+
const el = scrollRef.current;
|
|
1222
|
+
if (!el) return;
|
|
1223
|
+
const checkOverflow = () => setHasOverflow(el.scrollWidth > el.clientWidth);
|
|
1224
|
+
checkOverflow();
|
|
1225
|
+
const observer = new ResizeObserver(checkOverflow);
|
|
1226
|
+
observer.observe(el);
|
|
1227
|
+
return () => observer.disconnect();
|
|
1228
|
+
}, [textFilters]);
|
|
1229
|
+
const scroll = (offset) => {
|
|
1230
|
+
if (scrollRef.current) {
|
|
1231
|
+
scrollRef.current.scrollLeft += offset;
|
|
1232
|
+
}
|
|
1233
|
+
};
|
|
1234
|
+
return /* @__PURE__ */ React8.createElement(React8.Fragment, null, (textFilters == null ? void 0 : textFilters.length) > 0 && /* @__PURE__ */ React8.createElement(Box4, { display: "flex", alignItems: "center", sx: { maxWidth: "78%" } }, hasOverflow && /* @__PURE__ */ React8.createElement(IconButton4, { onClick: () => scroll(-150), size: "small" }, /* @__PURE__ */ React8.createElement(ChevronLeftIcon, { fontSize: "small", color: "action" })), /* @__PURE__ */ React8.createElement(
|
|
1235
|
+
Box4,
|
|
1236
|
+
{
|
|
1237
|
+
ref: scrollRef,
|
|
1238
|
+
gap: 0.3,
|
|
1239
|
+
sx: {
|
|
1240
|
+
display: "flex",
|
|
1241
|
+
overflowX: "auto",
|
|
1242
|
+
scrollBehavior: "smooth",
|
|
1243
|
+
"&::-webkit-scrollbar": { display: "none" }
|
|
1244
|
+
}
|
|
1245
|
+
},
|
|
1246
|
+
textFilters == null ? void 0 : textFilters.map((chipData, index) => /* @__PURE__ */ React8.createElement(
|
|
1247
|
+
Chip2,
|
|
1248
|
+
__spreadProps(__spreadValues({
|
|
1249
|
+
key: index,
|
|
1250
|
+
label: chipData.value
|
|
1251
|
+
}, chipData.arrayElement.required === false || chipData.arrayElement.required === void 0 ? { onDelete: () => onDeleteFilter(chipData.arrayElement) } : {}), {
|
|
1252
|
+
color: "default",
|
|
1253
|
+
variant: "filled",
|
|
1254
|
+
size: "small",
|
|
1255
|
+
sx: {
|
|
1256
|
+
flexShrink: 0,
|
|
1257
|
+
minWidth: "auto"
|
|
1258
|
+
}
|
|
1259
|
+
})
|
|
1260
|
+
))
|
|
1261
|
+
), hasOverflow && /* @__PURE__ */ React8.createElement(IconButton4, { onClick: () => scroll(150), size: "small" }, /* @__PURE__ */ React8.createElement(ChevronRightIcon, { fontSize: "small", color: "action" }))));
|
|
1262
|
+
};
|
|
1413
1263
|
|
|
1414
|
-
// src/Components/Drawer/
|
|
1264
|
+
// src/Components/Drawer/components/DrawerContent.tsx
|
|
1265
|
+
import React14 from "react";
|
|
1266
|
+
import { Box as Box10, Stack as Stack5 } from "@mui/material";
|
|
1267
|
+
|
|
1268
|
+
// src/Components/Textfield/SCTextField.tsx
|
|
1269
|
+
import React9, { useEffect as useEffect7, useState as useState9 } from "react";
|
|
1270
|
+
import { FormControl, IconButton as IconButton5, InputAdornment, InputLabel, OutlinedInput, FilledInput, Popover, Input, Box as Box5, Typography as Typography4, SvgIcon as SvgIcon2, Tooltip as Tooltip2 } from "@mui/material";
|
|
1271
|
+
import Grid from "@mui/material/Grid";
|
|
1272
|
+
import { Visibility, VisibilityOff, InfoOutlined } from "@mui/icons-material";
|
|
1273
|
+
|
|
1274
|
+
// src/Components/Textfield/Helpers/validateIcon.tsx
|
|
1415
1275
|
import * as Muicon3 from "@mui/icons-material";
|
|
1416
|
-
|
|
1417
|
-
if (
|
|
1418
|
-
|
|
1276
|
+
function getIconComponent2(name) {
|
|
1277
|
+
if (typeof name !== "string") return name;
|
|
1278
|
+
return name in Muicon3 ? Muicon3[name] : void 0;
|
|
1279
|
+
}
|
|
1280
|
+
function getIconValidation(name) {
|
|
1281
|
+
if (typeof name !== "string") {
|
|
1282
|
+
return (name == null ? void 0 : name.type) ? "icon" : "text";
|
|
1419
1283
|
}
|
|
1420
|
-
return
|
|
1421
|
-
}
|
|
1284
|
+
return name in Muicon3 ? "icon" : "text";
|
|
1285
|
+
}
|
|
1422
1286
|
|
|
1423
|
-
// src/Components/
|
|
1424
|
-
|
|
1425
|
-
|
|
1426
|
-
|
|
1427
|
-
|
|
1428
|
-
|
|
1429
|
-
const element = arrayElements[i];
|
|
1430
|
-
const { validation, element: typeElement } = validateTypeElements(element);
|
|
1431
|
-
const textValue = ((_a = typeElement.state) == null ? void 0 : _a.textValue) !== void 0 ? String((_b = typeElement.state) == null ? void 0 : _b.textValue) : String(typeElement.state);
|
|
1432
|
-
if (typeElement == null ? void 0 : typeElement.required) {
|
|
1433
|
-
requiredValues++;
|
|
1434
|
-
if (textValue.trim() !== "" && textValue.trim() !== ",") {
|
|
1435
|
-
filledValues++;
|
|
1436
|
-
}
|
|
1437
|
-
}
|
|
1287
|
+
// src/Components/Textfield/Helpers/validateKeyDown.tsx
|
|
1288
|
+
function validateKeyDown(event2, format3) {
|
|
1289
|
+
const key = event2.key;
|
|
1290
|
+
const target = event2.target;
|
|
1291
|
+
if (format3 === "int" && !/^[0-9]$/.test(key)) {
|
|
1292
|
+
event2.preventDefault();
|
|
1438
1293
|
}
|
|
1439
|
-
if (
|
|
1440
|
-
|
|
1441
|
-
setChipFilters(true);
|
|
1442
|
-
} else {
|
|
1443
|
-
onError({
|
|
1444
|
-
type: "error",
|
|
1445
|
-
title: "Algunos campos son requeridos",
|
|
1446
|
-
time: 10
|
|
1447
|
-
});
|
|
1448
|
-
setChipFilters(false);
|
|
1294
|
+
if (format3 === "decimal" && (target.value === "" && key === "." || key === "-" || key === "+")) {
|
|
1295
|
+
event2.preventDefault();
|
|
1449
1296
|
}
|
|
1450
|
-
|
|
1451
|
-
|
|
1452
|
-
|
|
1453
|
-
|
|
1454
|
-
var COMPONENT_NAME_MAP = {
|
|
1455
|
-
SCtextField: "textField",
|
|
1456
|
-
SCtextArea: "textArea",
|
|
1457
|
-
SCDateRange: "dateRange",
|
|
1458
|
-
SCDatePicker: "datePicker",
|
|
1459
|
-
SCTime: "time",
|
|
1460
|
-
SCAutocomplete: "autocomplete",
|
|
1461
|
-
SCSelect: "select"
|
|
1462
|
-
};
|
|
1463
|
-
var getComponentName = (node) => {
|
|
1464
|
-
const type = node.type;
|
|
1465
|
-
return typeof type === "function" ? type.displayName || type.name || "" : "";
|
|
1466
|
-
};
|
|
1467
|
-
var isKnownComponent = (node) => {
|
|
1468
|
-
var _a;
|
|
1469
|
-
const name = getComponentName(node);
|
|
1470
|
-
if (COMPONENT_NAME_MAP[name]) return true;
|
|
1471
|
-
if (((_a = node.props) == null ? void 0 : _a.typeFormat) === "multiselect") return true;
|
|
1472
|
-
return false;
|
|
1473
|
-
};
|
|
1474
|
-
var findInTree = (node) => {
|
|
1475
|
-
var _a;
|
|
1476
|
-
if (!React9.isValidElement(node)) return null;
|
|
1477
|
-
if (isKnownComponent(node)) return node;
|
|
1478
|
-
const children = (_a = node.props) == null ? void 0 : _a.children;
|
|
1479
|
-
if (!children) return null;
|
|
1480
|
-
for (const child of React9.Children.toArray(children)) {
|
|
1481
|
-
if (React9.isValidElement(child)) {
|
|
1482
|
-
const found = findInTree(child);
|
|
1483
|
-
if (found) return found;
|
|
1297
|
+
if (target.type === "text") {
|
|
1298
|
+
const regex = /^[a-zA-ZáéíóúÁÉÍÓÚñÑ0-9\s_\-.,@]+$/;
|
|
1299
|
+
if (!regex.test(key)) {
|
|
1300
|
+
event2.preventDefault();
|
|
1484
1301
|
}
|
|
1485
1302
|
}
|
|
1486
|
-
|
|
1487
|
-
|
|
1488
|
-
|
|
1489
|
-
|
|
1490
|
-
|
|
1491
|
-
|
|
1492
|
-
|
|
1493
|
-
|
|
1494
|
-
|
|
1495
|
-
|
|
1496
|
-
|
|
1497
|
-
|
|
1498
|
-
|
|
1499
|
-
validation = element.type;
|
|
1500
|
-
typeElement = element;
|
|
1501
|
-
} else if (element.typeFormat === "multiselect") {
|
|
1502
|
-
validation = "multiselect";
|
|
1503
|
-
typeElement = element;
|
|
1504
|
-
} else if (React9.isValidElement(element == null ? void 0 : element.component) && isKnownComponent(element.component)) {
|
|
1505
|
-
const node = element.component;
|
|
1506
|
-
validation = resolveValidation(node);
|
|
1507
|
-
typeElement = node.props;
|
|
1508
|
-
} else if (React9.isValidElement(element == null ? void 0 : element.component)) {
|
|
1509
|
-
const found = findInTree(element.component);
|
|
1510
|
-
if (found) {
|
|
1511
|
-
validation = resolveValidation(found);
|
|
1512
|
-
typeElement = found.props;
|
|
1513
|
-
}
|
|
1303
|
+
}
|
|
1304
|
+
|
|
1305
|
+
// src/Components/Textfield/Helpers/validateOnBlur.tsx
|
|
1306
|
+
var validateOnBlurField = ({
|
|
1307
|
+
state,
|
|
1308
|
+
required = false,
|
|
1309
|
+
setError,
|
|
1310
|
+
onBlur
|
|
1311
|
+
}) => (event2) => {
|
|
1312
|
+
const isError = !state.trim() && required;
|
|
1313
|
+
setError(isError);
|
|
1314
|
+
if (onBlur) {
|
|
1315
|
+
onBlur(event2);
|
|
1514
1316
|
}
|
|
1515
|
-
return { validation, element: typeElement };
|
|
1516
1317
|
};
|
|
1517
1318
|
|
|
1518
|
-
// src/Components/
|
|
1519
|
-
|
|
1520
|
-
|
|
1521
|
-
|
|
1522
|
-
|
|
1523
|
-
|
|
1524
|
-
|
|
1525
|
-
|
|
1526
|
-
|
|
1527
|
-
|
|
1528
|
-
|
|
1529
|
-
|
|
1319
|
+
// src/Components/Textfield/SCTextField.tsx
|
|
1320
|
+
var SCTextField = ({
|
|
1321
|
+
//informativas
|
|
1322
|
+
title,
|
|
1323
|
+
iconTitle,
|
|
1324
|
+
infoTitle,
|
|
1325
|
+
label = "",
|
|
1326
|
+
placeholder = "",
|
|
1327
|
+
infoElement,
|
|
1328
|
+
iconInputStart,
|
|
1329
|
+
iconInputEnd,
|
|
1330
|
+
maxLength,
|
|
1331
|
+
//Apariencia
|
|
1332
|
+
variant = "outlined",
|
|
1333
|
+
format: format3,
|
|
1334
|
+
disabled,
|
|
1335
|
+
required,
|
|
1336
|
+
size,
|
|
1337
|
+
width = "100%",
|
|
1338
|
+
color,
|
|
1339
|
+
background,
|
|
1340
|
+
//Funcionales
|
|
1341
|
+
setState,
|
|
1342
|
+
state,
|
|
1343
|
+
onChange,
|
|
1344
|
+
onBlur,
|
|
1345
|
+
onKeyDown
|
|
1346
|
+
}) => {
|
|
1347
|
+
const inputComponents = {
|
|
1348
|
+
outlined: OutlinedInput,
|
|
1349
|
+
filled: FilledInput,
|
|
1350
|
+
standard: Input
|
|
1530
1351
|
};
|
|
1531
|
-
const
|
|
1532
|
-
|
|
1533
|
-
|
|
1534
|
-
|
|
1535
|
-
|
|
1536
|
-
|
|
1537
|
-
|
|
1538
|
-
|
|
1539
|
-
|
|
1352
|
+
const InputComponent = inputComponents[variant] || OutlinedInput;
|
|
1353
|
+
let IconInputStartValidation;
|
|
1354
|
+
let IconInputEndValidation;
|
|
1355
|
+
let IconInputStart;
|
|
1356
|
+
let IconInputEnd;
|
|
1357
|
+
let IconTitle;
|
|
1358
|
+
const [showPassword, setShowPassword] = useState9(false);
|
|
1359
|
+
const [error, setError] = useState9(false);
|
|
1360
|
+
const [anchorInfoTitle, setAnchorInfoTitle] = useState9(null);
|
|
1361
|
+
const openInfoTitle = Boolean(anchorInfoTitle);
|
|
1362
|
+
const [anchorInfoElement, setAnchorInfoElement] = useState9(null);
|
|
1363
|
+
const openInfoElement = Boolean(anchorInfoElement);
|
|
1364
|
+
useEffect7(() => {
|
|
1365
|
+
if (error) {
|
|
1366
|
+
setTimeout(() => {
|
|
1367
|
+
setError(false);
|
|
1368
|
+
}, 1e3);
|
|
1540
1369
|
}
|
|
1370
|
+
}, [error]);
|
|
1371
|
+
if (iconInputStart) {
|
|
1372
|
+
IconInputStartValidation = getIconValidation(iconInputStart);
|
|
1373
|
+
IconInputStart = getIconComponent2(iconInputStart);
|
|
1374
|
+
}
|
|
1375
|
+
if (iconInputEnd) {
|
|
1376
|
+
IconInputEndValidation = getIconValidation(iconInputEnd);
|
|
1377
|
+
IconInputEnd = getIconComponent2(iconInputEnd);
|
|
1378
|
+
}
|
|
1379
|
+
if (iconTitle) {
|
|
1380
|
+
IconTitle = getIconComponent2(iconTitle);
|
|
1381
|
+
}
|
|
1382
|
+
const handleClickShowPassword = () => setShowPassword((show) => !show);
|
|
1383
|
+
const handleMouseDownPassword = (event2) => {
|
|
1384
|
+
event2.preventDefault();
|
|
1541
1385
|
};
|
|
1542
|
-
|
|
1543
|
-
|
|
1544
|
-
|
|
1545
|
-
handleDrawerOpen,
|
|
1546
|
-
toggleDrawer
|
|
1547
|
-
};
|
|
1548
|
-
};
|
|
1549
|
-
|
|
1550
|
-
// src/Components/Drawer/hooks/useChipFilters.ts
|
|
1551
|
-
import { useState as useState8, useEffect as useEffect6 } from "react";
|
|
1552
|
-
var useChipFilters = (arrayElements, chipFilters) => {
|
|
1553
|
-
const [stateChipFilters, setChipFilters] = useState8(false);
|
|
1554
|
-
const [textFilters, setTextFilters] = useState8([]);
|
|
1555
|
-
useEffect6(() => {
|
|
1556
|
-
if (chipFilters == null ? void 0 : chipFilters.length) {
|
|
1557
|
-
setTextFilters([]);
|
|
1558
|
-
processChipFilters();
|
|
1559
|
-
}
|
|
1560
|
-
}, [chipFilters]);
|
|
1561
|
-
const processChipFilters = () => {
|
|
1562
|
-
if (!(chipFilters == null ? void 0 : chipFilters.length)) {
|
|
1563
|
-
processManualFilters();
|
|
1564
|
-
return;
|
|
1565
|
-
}
|
|
1566
|
-
arrayElements.forEach((arrayElement) => {
|
|
1567
|
-
var _a;
|
|
1568
|
-
const { validation, element: typeElement } = validateTypeElements(arrayElement);
|
|
1569
|
-
if (Array.isArray((_a = typeElement.state) == null ? void 0 : _a.textValue)) {
|
|
1570
|
-
chipFilters.forEach((chipFilter) => {
|
|
1571
|
-
const chipValue = String(chipFilter).trim();
|
|
1572
|
-
const isInArray = typeElement.state.textValue.some(
|
|
1573
|
-
(v) => String(v).trim() === chipValue
|
|
1574
|
-
);
|
|
1575
|
-
if (isInArray && chipValue !== "" && chipValue !== ",") {
|
|
1576
|
-
setTextFilters((prev) => {
|
|
1577
|
-
const exists = prev.findIndex((f) => f.value === chipValue) !== -1;
|
|
1578
|
-
if (exists) return prev;
|
|
1579
|
-
return [...prev, { value: chipValue, arrayElement: typeElement }];
|
|
1580
|
-
});
|
|
1581
|
-
}
|
|
1582
|
-
});
|
|
1583
|
-
return;
|
|
1584
|
-
}
|
|
1585
|
-
const currentValue = getCurrentValue(validation, typeElement);
|
|
1586
|
-
chipFilters.forEach((chipFilter) => {
|
|
1587
|
-
const chipValue = String(chipFilter).trim();
|
|
1588
|
-
if (currentValue === chipValue && currentValue !== "" && currentValue !== ",") {
|
|
1589
|
-
updateFilter(currentValue, typeElement, arrayElement.label);
|
|
1590
|
-
}
|
|
1591
|
-
});
|
|
1592
|
-
});
|
|
1386
|
+
const handleKeyDown = (event2) => {
|
|
1387
|
+
validateKeyDown(event2, format3);
|
|
1388
|
+
if (onKeyDown) onKeyDown(event2);
|
|
1593
1389
|
};
|
|
1594
|
-
const
|
|
1595
|
-
|
|
1596
|
-
|
|
1597
|
-
|
|
1598
|
-
|
|
1599
|
-
const textValue = ((_a = typeElement.state) == null ? void 0 : _a.textValue) !== void 0 ? String((_b = typeElement.state) == null ? void 0 : _b.textValue) : String(typeElement.state);
|
|
1600
|
-
if (textValue.trim() !== "" && textValue.trim() !== "," && textValue.trim() !== "undefined") {
|
|
1601
|
-
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")}` : validation === "datePicker" ? (_f = (_e = typeElement.state) == null ? void 0 : _e.format("DD/MM/YYYY")) != null ? _f : "" : validation === "time" ? (_h = (_g = typeElement.state) == null ? void 0 : _g.format("HH:mm")) != null ? _h : "" : textValue;
|
|
1602
|
-
const existingFilterIndex = newFiltersToAdd.findIndex(
|
|
1603
|
-
(filter) => filter.arrayElement.label === element.label
|
|
1604
|
-
);
|
|
1605
|
-
const newFilter = { value, arrayElement: typeElement };
|
|
1606
|
-
if (existingFilterIndex !== -1) {
|
|
1607
|
-
newFiltersToAdd[existingFilterIndex] = newFilter;
|
|
1608
|
-
} else {
|
|
1609
|
-
newFiltersToAdd.push(newFilter);
|
|
1610
|
-
}
|
|
1390
|
+
const handleInputChange = (event2) => {
|
|
1391
|
+
let valueMax = maxLength ? maxLength + 1 : 50;
|
|
1392
|
+
if (event2.target.value.length < valueMax) {
|
|
1393
|
+
if (setState) {
|
|
1394
|
+
setState(event2.target.value);
|
|
1611
1395
|
}
|
|
1612
|
-
|
|
1613
|
-
|
|
1614
|
-
let updatedFilters = [...prevFilters];
|
|
1615
|
-
newFiltersToAdd.forEach((newFilter) => {
|
|
1616
|
-
const existingFilterIndex = updatedFilters.findIndex(
|
|
1617
|
-
(filter) => filter.arrayElement.label === newFilter.arrayElement.label
|
|
1618
|
-
);
|
|
1619
|
-
if (existingFilterIndex !== -1) {
|
|
1620
|
-
updatedFilters[existingFilterIndex] = newFilter;
|
|
1621
|
-
} else {
|
|
1622
|
-
updatedFilters.push(newFilter);
|
|
1623
|
-
}
|
|
1624
|
-
});
|
|
1625
|
-
return updatedFilters;
|
|
1626
|
-
});
|
|
1627
|
-
};
|
|
1628
|
-
const getCurrentValue = (validation, typeElement) => {
|
|
1629
|
-
var _a, _b, _c, _d, _e, _f, _g, _h, _i;
|
|
1630
|
-
if (validation === "dateRange") {
|
|
1631
|
-
if (((_a = typeElement.state) == null ? void 0 : _a[0]) && ((_b = typeElement.state) == null ? void 0 : _b[1])) {
|
|
1632
|
-
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")}`;
|
|
1396
|
+
if (onChange) {
|
|
1397
|
+
onChange(event2);
|
|
1633
1398
|
}
|
|
1634
|
-
return "";
|
|
1635
|
-
}
|
|
1636
|
-
if (validation === "datePicker") {
|
|
1637
|
-
return ((_f = (_e = typeElement.state) == null ? void 0 : _e.isValid) == null ? void 0 : _f.call(_e)) ? typeElement.state.format("DD/MM/YYYY") : "";
|
|
1638
|
-
}
|
|
1639
|
-
if (validation === "time") {
|
|
1640
|
-
return ((_h = (_g = typeElement.state) == null ? void 0 : _g.isValid) == null ? void 0 : _h.call(_g)) ? typeElement.state.format("HH:mm") : "";
|
|
1641
1399
|
}
|
|
1642
|
-
return ((_i = typeElement.state) == null ? void 0 : _i.textValue) !== void 0 ? String(typeElement.state.textValue).trim() : String(typeElement.state).trim();
|
|
1643
|
-
};
|
|
1644
|
-
const updateFilter = (value, typeElement, label) => {
|
|
1645
|
-
setTextFilters((prevFilters) => {
|
|
1646
|
-
const newFilter = { value, arrayElement: typeElement };
|
|
1647
|
-
const existingFilterIndex = prevFilters.findIndex(
|
|
1648
|
-
(filter) => label !== void 0 ? filter.arrayElement.label === label : filter.value === value
|
|
1649
|
-
);
|
|
1650
|
-
if (existingFilterIndex !== -1) {
|
|
1651
|
-
const updatedFilters = [...prevFilters];
|
|
1652
|
-
updatedFilters[existingFilterIndex] = newFilter;
|
|
1653
|
-
return updatedFilters;
|
|
1654
|
-
} else {
|
|
1655
|
-
return [...prevFilters, newFilter];
|
|
1656
|
-
}
|
|
1657
|
-
});
|
|
1658
1400
|
};
|
|
1659
|
-
const
|
|
1660
|
-
|
|
1661
|
-
|
|
1662
|
-
const { validation, element: typeElement } = validateTypeElements(arrayElement);
|
|
1663
|
-
if (((_a = typeElement.state) == null ? void 0 : _a.textValue) !== void 0) {
|
|
1664
|
-
return String(typeElement.state.textValue).trim() !== "";
|
|
1665
|
-
} else if (validation === "dateRange") {
|
|
1666
|
-
return ((_b = typeElement.state) == null ? void 0 : _b[0]) !== null && ((_c = typeElement.state) == null ? void 0 : _c[1]) !== null;
|
|
1667
|
-
} else {
|
|
1668
|
-
const stateValue = String(typeElement.state).trim();
|
|
1669
|
-
return stateValue !== "" && stateValue !== "," && stateValue !== "undefined";
|
|
1670
|
-
}
|
|
1671
|
-
});
|
|
1401
|
+
const handleBlur = validateOnBlurField({ state, required, setError, onBlur });
|
|
1402
|
+
const handleOpenInfoTitle = (event2) => {
|
|
1403
|
+
setAnchorInfoTitle(event2.currentTarget);
|
|
1672
1404
|
};
|
|
1673
|
-
const
|
|
1674
|
-
|
|
1675
|
-
stateChipFilters,
|
|
1676
|
-
setChipFilters,
|
|
1677
|
-
textFilters,
|
|
1678
|
-
setTextFilters,
|
|
1679
|
-
shouldShowChips,
|
|
1680
|
-
processChipFilters,
|
|
1681
|
-
hasActiveFilters
|
|
1405
|
+
const handleCloseInfoTitle = () => {
|
|
1406
|
+
setAnchorInfoTitle(null);
|
|
1682
1407
|
};
|
|
1683
|
-
|
|
1684
|
-
|
|
1685
|
-
// src/Components/Drawer/hooks/useToast.ts
|
|
1686
|
-
import { useState as useState9 } from "react";
|
|
1687
|
-
var useToast = () => {
|
|
1688
|
-
const [toast, setToast] = useState9(null);
|
|
1689
|
-
const setToastWithDelay = (toastContent) => {
|
|
1690
|
-
setToast(null);
|
|
1691
|
-
setTimeout(() => {
|
|
1692
|
-
setToast(toastContent);
|
|
1693
|
-
}, 10);
|
|
1408
|
+
const handleOpenInfoElement = (event2) => {
|
|
1409
|
+
setAnchorInfoElement(event2.currentTarget);
|
|
1694
1410
|
};
|
|
1695
|
-
const
|
|
1696
|
-
|
|
1697
|
-
toast,
|
|
1698
|
-
setToastWithDelay,
|
|
1699
|
-
clearToast
|
|
1411
|
+
const handleCloseInfoElement = () => {
|
|
1412
|
+
setAnchorInfoElement(null);
|
|
1700
1413
|
};
|
|
1701
|
-
}
|
|
1702
|
-
|
|
1703
|
-
|
|
1704
|
-
|
|
1705
|
-
|
|
1706
|
-
|
|
1707
|
-
|
|
1708
|
-
case "textArea":
|
|
1709
|
-
defaultValue = "";
|
|
1710
|
-
break;
|
|
1711
|
-
case "dateRange":
|
|
1712
|
-
defaultValue = [null, null];
|
|
1713
|
-
break;
|
|
1714
|
-
case "datePicker":
|
|
1715
|
-
case "time":
|
|
1716
|
-
defaultValue = null;
|
|
1717
|
-
break;
|
|
1718
|
-
case "multiselect":
|
|
1719
|
-
defaultValue = { hiddenValue: [], textValue: [] };
|
|
1720
|
-
break;
|
|
1721
|
-
default:
|
|
1722
|
-
defaultValue = { hiddenValue: "-1", textValue: "" };
|
|
1723
|
-
}
|
|
1724
|
-
if (typeElement.setState) {
|
|
1725
|
-
typeElement.setState(defaultValue);
|
|
1726
|
-
}
|
|
1727
|
-
};
|
|
1728
|
-
var cleanAllFilters = (arrayElements, setTextFilters) => {
|
|
1729
|
-
arrayElements.forEach((element) => {
|
|
1730
|
-
const { validation, element: typeElement } = validateTypeElements(element);
|
|
1731
|
-
if (typeElement.setState) {
|
|
1732
|
-
resetElementByType(element, validation, typeElement);
|
|
1414
|
+
return /* @__PURE__ */ React9.createElement(Box5, { sx: { width } }, /* @__PURE__ */ React9.createElement(Grid, { container: true, alignItems: "center", mb: 1.25, gap: 0.5 }, iconTitle && IconTitle ? /* @__PURE__ */ React9.createElement(SvgIcon2, { color: "action", fontSize: "small", component: IconTitle }) : "", title ? /* @__PURE__ */ React9.createElement(Typography4, { mx: 0.5, variant: "subtitle2", color: "text.secondary" }, title) : "", infoTitle ? /* @__PURE__ */ React9.createElement(React9.Fragment, null, infoTitle.component === "popover" ? /* @__PURE__ */ React9.createElement(React9.Fragment, null, /* @__PURE__ */ React9.createElement(
|
|
1415
|
+
InfoOutlined,
|
|
1416
|
+
{
|
|
1417
|
+
color: "action",
|
|
1418
|
+
fontSize: "small",
|
|
1419
|
+
onMouseEnter: (event2) => handleOpenInfoTitle(event2),
|
|
1420
|
+
onMouseLeave: () => handleCloseInfoTitle()
|
|
1733
1421
|
}
|
|
1734
|
-
|
|
1735
|
-
|
|
1736
|
-
};
|
|
1737
|
-
var deleteFilter = (element, shouldShowChips, setTextFilters) => {
|
|
1738
|
-
const { validation, element: typeElement } = validateTypeElements(element);
|
|
1739
|
-
if (typeElement.setState && shouldShowChips) {
|
|
1740
|
-
resetElementByType(element, validation, typeElement);
|
|
1741
|
-
setTextFilters(
|
|
1742
|
-
(prevFilters) => prevFilters.filter((filter) => filter.arrayElement.label !== element.label)
|
|
1743
|
-
);
|
|
1744
|
-
}
|
|
1745
|
-
};
|
|
1746
|
-
|
|
1747
|
-
// src/Components/Drawer/components/DrawerButton.tsx
|
|
1748
|
-
import React10 from "react";
|
|
1749
|
-
import { Button as Button5, Chip as Chip2 } from "@mui/material";
|
|
1750
|
-
var DrawerButton = ({
|
|
1751
|
-
buttonDrawer,
|
|
1752
|
-
onToggle
|
|
1753
|
-
}) => {
|
|
1754
|
-
var _a, _b, _c;
|
|
1755
|
-
const ButtonIcon = getIcon(buttonDrawer == null ? void 0 : buttonDrawer.icon);
|
|
1756
|
-
if ((buttonDrawer == null ? void 0 : buttonDrawer.type) === "chip") {
|
|
1757
|
-
return /* @__PURE__ */ React10.createElement(
|
|
1758
|
-
Chip2,
|
|
1759
|
-
__spreadProps(__spreadValues({
|
|
1760
|
-
onClick: onToggle,
|
|
1761
|
-
size: "medium",
|
|
1762
|
-
color: buttonDrawer == null ? void 0 : buttonDrawer.color,
|
|
1763
|
-
variant: (buttonDrawer == null ? void 0 : buttonDrawer.variant) === "contained" ? "filled" : "outlined",
|
|
1764
|
-
label: (_a = buttonDrawer == null ? void 0 : buttonDrawer.text) != null ? _a : "",
|
|
1765
|
-
icon: (buttonDrawer == null ? void 0 : buttonDrawer.iconPosition) === "left" && ButtonIcon ? /* @__PURE__ */ React10.createElement(ButtonIcon, { fontSize: "small" }) : void 0,
|
|
1766
|
-
deleteIcon: (buttonDrawer == null ? void 0 : buttonDrawer.iconPosition) === "right" && ButtonIcon ? /* @__PURE__ */ React10.createElement(ButtonIcon, { fontSize: "small" }) : void 0
|
|
1767
|
-
}, (buttonDrawer == null ? void 0 : buttonDrawer.iconPosition) === "right" && ButtonIcon ? { onDelete: () => {
|
|
1768
|
-
} } : {}), {
|
|
1769
|
-
sx: {
|
|
1770
|
-
"& .MuiChip-icon": {
|
|
1771
|
-
color: "inherit"
|
|
1772
|
-
},
|
|
1773
|
-
textTransform: "capitalize"
|
|
1774
|
-
}
|
|
1775
|
-
})
|
|
1776
|
-
);
|
|
1777
|
-
}
|
|
1778
|
-
return /* @__PURE__ */ React10.createElement(
|
|
1779
|
-
Button5,
|
|
1780
|
-
{
|
|
1781
|
-
"data-testid": "test-buttonDrawer",
|
|
1782
|
-
sx: { textTransform: "capitalize" },
|
|
1783
|
-
color: buttonDrawer == null ? void 0 : buttonDrawer.color,
|
|
1784
|
-
onClick: onToggle,
|
|
1785
|
-
size: "small",
|
|
1786
|
-
variant: (_b = buttonDrawer == null ? void 0 : buttonDrawer.variant) != null ? _b : "text",
|
|
1787
|
-
startIcon: ((buttonDrawer == null ? void 0 : buttonDrawer.iconPosition) === "left" || !(buttonDrawer == null ? void 0 : buttonDrawer.iconPosition)) && ButtonIcon ? /* @__PURE__ */ React10.createElement(ButtonIcon, { fontSize: "small" }) : null,
|
|
1788
|
-
endIcon: (buttonDrawer == null ? void 0 : buttonDrawer.iconPosition) === "right" && ButtonIcon ? /* @__PURE__ */ React10.createElement(ButtonIcon, { fontSize: "small" }) : null
|
|
1789
|
-
},
|
|
1790
|
-
(_c = buttonDrawer == null ? void 0 : buttonDrawer.text) != null ? _c : ""
|
|
1791
|
-
);
|
|
1792
|
-
};
|
|
1793
|
-
|
|
1794
|
-
// src/Components/Drawer/components/ChipFiltersDisplay.tsx
|
|
1795
|
-
import React11, { useRef as useRef3, useState as useState10, useEffect as useEffect7 } from "react";
|
|
1796
|
-
import { Box as Box7, IconButton as IconButton6, Chip as Chip3 } from "@mui/material";
|
|
1797
|
-
import ChevronLeftIcon from "@mui/icons-material/ChevronLeft";
|
|
1798
|
-
import ChevronRightIcon from "@mui/icons-material/ChevronRight";
|
|
1799
|
-
var ChipFiltersDisplay = ({
|
|
1800
|
-
textFilters,
|
|
1801
|
-
onDeleteFilter
|
|
1802
|
-
}) => {
|
|
1803
|
-
const scrollRef = useRef3(null);
|
|
1804
|
-
const [hasOverflow, setHasOverflow] = useState10(false);
|
|
1805
|
-
useEffect7(() => {
|
|
1806
|
-
const el = scrollRef.current;
|
|
1807
|
-
if (!el) return;
|
|
1808
|
-
const checkOverflow = () => setHasOverflow(el.scrollWidth > el.clientWidth);
|
|
1809
|
-
checkOverflow();
|
|
1810
|
-
const observer = new ResizeObserver(checkOverflow);
|
|
1811
|
-
observer.observe(el);
|
|
1812
|
-
return () => observer.disconnect();
|
|
1813
|
-
}, [textFilters]);
|
|
1814
|
-
const scroll = (offset) => {
|
|
1815
|
-
if (scrollRef.current) {
|
|
1816
|
-
scrollRef.current.scrollLeft += offset;
|
|
1817
|
-
}
|
|
1818
|
-
};
|
|
1819
|
-
return /* @__PURE__ */ React11.createElement(React11.Fragment, null, (textFilters == null ? void 0 : textFilters.length) > 0 && /* @__PURE__ */ React11.createElement(Box7, { display: "flex", alignItems: "center", sx: { maxWidth: "78%" } }, hasOverflow && /* @__PURE__ */ React11.createElement(IconButton6, { onClick: () => scroll(-150), size: "small" }, /* @__PURE__ */ React11.createElement(ChevronLeftIcon, { fontSize: "small", color: "action" })), /* @__PURE__ */ React11.createElement(
|
|
1820
|
-
Box7,
|
|
1821
|
-
{
|
|
1822
|
-
ref: scrollRef,
|
|
1823
|
-
gap: 0.3,
|
|
1824
|
-
sx: {
|
|
1825
|
-
display: "flex",
|
|
1826
|
-
overflowX: "auto",
|
|
1827
|
-
scrollBehavior: "smooth",
|
|
1828
|
-
"&::-webkit-scrollbar": { display: "none" }
|
|
1829
|
-
}
|
|
1830
|
-
},
|
|
1831
|
-
textFilters == null ? void 0 : textFilters.map((chipData, index) => /* @__PURE__ */ React11.createElement(
|
|
1832
|
-
Chip3,
|
|
1833
|
-
__spreadProps(__spreadValues({
|
|
1834
|
-
key: index,
|
|
1835
|
-
label: chipData.value
|
|
1836
|
-
}, chipData.arrayElement.required === false || chipData.arrayElement.required === void 0 ? { onDelete: () => onDeleteFilter(chipData.arrayElement) } : {}), {
|
|
1837
|
-
color: "default",
|
|
1838
|
-
variant: "filled",
|
|
1839
|
-
size: "small",
|
|
1840
|
-
sx: {
|
|
1841
|
-
flexShrink: 0,
|
|
1842
|
-
minWidth: "auto"
|
|
1843
|
-
}
|
|
1844
|
-
})
|
|
1845
|
-
))
|
|
1846
|
-
), hasOverflow && /* @__PURE__ */ React11.createElement(IconButton6, { onClick: () => scroll(150), size: "small" }, /* @__PURE__ */ React11.createElement(ChevronRightIcon, { fontSize: "small", color: "action" }))));
|
|
1847
|
-
};
|
|
1848
|
-
|
|
1849
|
-
// src/Components/Drawer/components/DrawerContent.tsx
|
|
1850
|
-
import React17 from "react";
|
|
1851
|
-
import { Box as Box13, Stack as Stack8 } from "@mui/material";
|
|
1852
|
-
|
|
1853
|
-
// src/Components/Textfield/SCTextField.tsx
|
|
1854
|
-
import React12, { useEffect as useEffect8, useState as useState11 } from "react";
|
|
1855
|
-
import { FormControl, IconButton as IconButton7, InputAdornment, InputLabel, OutlinedInput, FilledInput, Popover as Popover2, Input, Box as Box8, Typography as Typography7, SvgIcon as SvgIcon3, Tooltip as Tooltip4 } from "@mui/material";
|
|
1856
|
-
import Grid from "@mui/material/Grid";
|
|
1857
|
-
import { Visibility, VisibilityOff, InfoOutlined } from "@mui/icons-material";
|
|
1858
|
-
|
|
1859
|
-
// src/Components/Textfield/Helpers/validateIcon.tsx
|
|
1860
|
-
import * as Muicon4 from "@mui/icons-material";
|
|
1861
|
-
function getIconComponent2(name) {
|
|
1862
|
-
if (typeof name !== "string") return name;
|
|
1863
|
-
return name in Muicon4 ? Muicon4[name] : void 0;
|
|
1864
|
-
}
|
|
1865
|
-
function getIconValidation(name) {
|
|
1866
|
-
if (typeof name !== "string") {
|
|
1867
|
-
return (name == null ? void 0 : name.type) ? "icon" : "text";
|
|
1868
|
-
}
|
|
1869
|
-
return name in Muicon4 ? "icon" : "text";
|
|
1870
|
-
}
|
|
1871
|
-
|
|
1872
|
-
// src/Components/Textfield/Helpers/validateKeyDown.tsx
|
|
1873
|
-
function validateKeyDown(event2, format3) {
|
|
1874
|
-
const key = event2.key;
|
|
1875
|
-
const target = event2.target;
|
|
1876
|
-
if (format3 === "int" && !/^[0-9]$/.test(key)) {
|
|
1877
|
-
event2.preventDefault();
|
|
1878
|
-
}
|
|
1879
|
-
if (format3 === "decimal" && (target.value === "" && key === "." || key === "-" || key === "+")) {
|
|
1880
|
-
event2.preventDefault();
|
|
1881
|
-
}
|
|
1882
|
-
if (target.type === "text") {
|
|
1883
|
-
const regex = /^[a-zA-ZáéíóúÁÉÍÓÚñÑ0-9\s_\-.,@]+$/;
|
|
1884
|
-
if (!regex.test(key)) {
|
|
1885
|
-
event2.preventDefault();
|
|
1886
|
-
}
|
|
1887
|
-
}
|
|
1888
|
-
}
|
|
1889
|
-
|
|
1890
|
-
// src/Components/Textfield/Helpers/validateOnBlur.tsx
|
|
1891
|
-
var validateOnBlurField = ({
|
|
1892
|
-
state,
|
|
1893
|
-
required = false,
|
|
1894
|
-
setError,
|
|
1895
|
-
onBlur
|
|
1896
|
-
}) => (event2) => {
|
|
1897
|
-
const isError = !state.trim() && required;
|
|
1898
|
-
setError(isError);
|
|
1899
|
-
if (onBlur) {
|
|
1900
|
-
onBlur(event2);
|
|
1901
|
-
}
|
|
1902
|
-
};
|
|
1903
|
-
|
|
1904
|
-
// src/Components/Textfield/SCTextField.tsx
|
|
1905
|
-
var SCTextField = ({
|
|
1906
|
-
//informativas
|
|
1907
|
-
title,
|
|
1908
|
-
iconTitle,
|
|
1909
|
-
infoTitle,
|
|
1910
|
-
label = "",
|
|
1911
|
-
placeholder = "",
|
|
1912
|
-
infoElement,
|
|
1913
|
-
iconInputStart,
|
|
1914
|
-
iconInputEnd,
|
|
1915
|
-
maxLength,
|
|
1916
|
-
//Apariencia
|
|
1917
|
-
variant = "outlined",
|
|
1918
|
-
format: format3,
|
|
1919
|
-
disabled,
|
|
1920
|
-
required,
|
|
1921
|
-
size,
|
|
1922
|
-
width = "100%",
|
|
1923
|
-
color,
|
|
1924
|
-
background,
|
|
1925
|
-
//Funcionales
|
|
1926
|
-
setState,
|
|
1927
|
-
state,
|
|
1928
|
-
onChange,
|
|
1929
|
-
onBlur,
|
|
1930
|
-
onKeyDown
|
|
1931
|
-
}) => {
|
|
1932
|
-
const inputComponents = {
|
|
1933
|
-
outlined: OutlinedInput,
|
|
1934
|
-
filled: FilledInput,
|
|
1935
|
-
standard: Input
|
|
1936
|
-
};
|
|
1937
|
-
const InputComponent = inputComponents[variant] || OutlinedInput;
|
|
1938
|
-
let IconInputStartValidation;
|
|
1939
|
-
let IconInputEndValidation;
|
|
1940
|
-
let IconInputStart;
|
|
1941
|
-
let IconInputEnd;
|
|
1942
|
-
let IconTitle;
|
|
1943
|
-
const [showPassword, setShowPassword] = useState11(false);
|
|
1944
|
-
const [error, setError] = useState11(false);
|
|
1945
|
-
const [anchorInfoTitle, setAnchorInfoTitle] = useState11(null);
|
|
1946
|
-
const openInfoTitle = Boolean(anchorInfoTitle);
|
|
1947
|
-
const [anchorInfoElement, setAnchorInfoElement] = useState11(null);
|
|
1948
|
-
const openInfoElement = Boolean(anchorInfoElement);
|
|
1949
|
-
useEffect8(() => {
|
|
1950
|
-
if (error) {
|
|
1951
|
-
setTimeout(() => {
|
|
1952
|
-
setError(false);
|
|
1953
|
-
}, 1e3);
|
|
1954
|
-
}
|
|
1955
|
-
}, [error]);
|
|
1956
|
-
if (iconInputStart) {
|
|
1957
|
-
IconInputStartValidation = getIconValidation(iconInputStart);
|
|
1958
|
-
IconInputStart = getIconComponent2(iconInputStart);
|
|
1959
|
-
}
|
|
1960
|
-
if (iconInputEnd) {
|
|
1961
|
-
IconInputEndValidation = getIconValidation(iconInputEnd);
|
|
1962
|
-
IconInputEnd = getIconComponent2(iconInputEnd);
|
|
1963
|
-
}
|
|
1964
|
-
if (iconTitle) {
|
|
1965
|
-
IconTitle = getIconComponent2(iconTitle);
|
|
1966
|
-
}
|
|
1967
|
-
const handleClickShowPassword = () => setShowPassword((show) => !show);
|
|
1968
|
-
const handleMouseDownPassword = (event2) => {
|
|
1969
|
-
event2.preventDefault();
|
|
1970
|
-
};
|
|
1971
|
-
const handleKeyDown = (event2) => {
|
|
1972
|
-
validateKeyDown(event2, format3);
|
|
1973
|
-
if (onKeyDown) onKeyDown(event2);
|
|
1974
|
-
};
|
|
1975
|
-
const handleInputChange = (event2) => {
|
|
1976
|
-
let valueMax = maxLength ? maxLength + 1 : 50;
|
|
1977
|
-
if (event2.target.value.length < valueMax) {
|
|
1978
|
-
if (setState) {
|
|
1979
|
-
setState(event2.target.value);
|
|
1980
|
-
}
|
|
1981
|
-
if (onChange) {
|
|
1982
|
-
onChange(event2);
|
|
1983
|
-
}
|
|
1984
|
-
}
|
|
1985
|
-
};
|
|
1986
|
-
const handleBlur = validateOnBlurField({ state, required, setError, onBlur });
|
|
1987
|
-
const handleOpenInfoTitle = (event2) => {
|
|
1988
|
-
setAnchorInfoTitle(event2.currentTarget);
|
|
1989
|
-
};
|
|
1990
|
-
const handleCloseInfoTitle = () => {
|
|
1991
|
-
setAnchorInfoTitle(null);
|
|
1992
|
-
};
|
|
1993
|
-
const handleOpenInfoElement = (event2) => {
|
|
1994
|
-
setAnchorInfoElement(event2.currentTarget);
|
|
1995
|
-
};
|
|
1996
|
-
const handleCloseInfoElement = () => {
|
|
1997
|
-
setAnchorInfoElement(null);
|
|
1998
|
-
};
|
|
1999
|
-
return /* @__PURE__ */ React12.createElement(Box8, { sx: { width } }, /* @__PURE__ */ React12.createElement(Grid, { container: true, alignItems: "center", mb: 1.25, gap: 0.5 }, iconTitle && IconTitle ? /* @__PURE__ */ React12.createElement(SvgIcon3, { color: "action", fontSize: "small", component: IconTitle }) : "", title ? /* @__PURE__ */ React12.createElement(Typography7, { mx: 0.5, variant: "subtitle2", color: "text.secondary" }, title) : "", infoTitle ? /* @__PURE__ */ React12.createElement(React12.Fragment, null, infoTitle.component === "popover" ? /* @__PURE__ */ React12.createElement(React12.Fragment, null, /* @__PURE__ */ React12.createElement(
|
|
2000
|
-
InfoOutlined,
|
|
2001
|
-
{
|
|
2002
|
-
color: "action",
|
|
2003
|
-
fontSize: "small",
|
|
2004
|
-
onMouseEnter: (event2) => handleOpenInfoTitle(event2),
|
|
2005
|
-
onMouseLeave: () => handleCloseInfoTitle()
|
|
2006
|
-
}
|
|
2007
|
-
), /* @__PURE__ */ React12.createElement(
|
|
2008
|
-
Popover2,
|
|
1422
|
+
), /* @__PURE__ */ React9.createElement(
|
|
1423
|
+
Popover,
|
|
2009
1424
|
{
|
|
2010
1425
|
sx: {
|
|
2011
1426
|
pointerEvents: "none",
|
|
@@ -2026,14 +1441,14 @@ var SCTextField = ({
|
|
|
2026
1441
|
},
|
|
2027
1442
|
disableRestoreFocus: true
|
|
2028
1443
|
},
|
|
2029
|
-
/* @__PURE__ */
|
|
2030
|
-
)) : /* @__PURE__ */
|
|
1444
|
+
/* @__PURE__ */ React9.createElement(Typography4, { p: 2 }, infoTitle.text)
|
|
1445
|
+
)) : /* @__PURE__ */ React9.createElement(Tooltip2, { title: infoTitle.text, "data-testid": "test-infoTitle", placement: "bottom-start", slotProps: { popper: { modifiers: [{ name: "offset", options: { offset: [0, -14] } }] } } }, /* @__PURE__ */ React9.createElement(
|
|
2031
1446
|
InfoOutlined,
|
|
2032
1447
|
{
|
|
2033
1448
|
color: "action",
|
|
2034
1449
|
fontSize: "small"
|
|
2035
1450
|
}
|
|
2036
|
-
))) : ""), /* @__PURE__ */
|
|
1451
|
+
))) : ""), /* @__PURE__ */ React9.createElement(Grid, { container: true, sx: { flexWrap: "nowrap", alignItems: "center" } }, /* @__PURE__ */ React9.createElement(
|
|
2037
1452
|
FormControl,
|
|
2038
1453
|
{
|
|
2039
1454
|
color,
|
|
@@ -2048,7 +1463,7 @@ var SCTextField = ({
|
|
|
2048
1463
|
}
|
|
2049
1464
|
}
|
|
2050
1465
|
},
|
|
2051
|
-
/* @__PURE__ */
|
|
1466
|
+
/* @__PURE__ */ React9.createElement(
|
|
2052
1467
|
InputLabel,
|
|
2053
1468
|
{
|
|
2054
1469
|
"data-testid": "test-label",
|
|
@@ -2065,7 +1480,7 @@ var SCTextField = ({
|
|
|
2065
1480
|
},
|
|
2066
1481
|
label ? label : ""
|
|
2067
1482
|
),
|
|
2068
|
-
/* @__PURE__ */
|
|
1483
|
+
/* @__PURE__ */ React9.createElement(
|
|
2069
1484
|
InputComponent,
|
|
2070
1485
|
{
|
|
2071
1486
|
size: size ? size : "medium",
|
|
@@ -2081,17 +1496,17 @@ var SCTextField = ({
|
|
|
2081
1496
|
type: !showPassword && format3 === "password" ? "password" : (format3 || "text").toUpperCase() === "INT" || (format3 || "text").toUpperCase() === "DECIMAL" ? "number" : "text",
|
|
2082
1497
|
className: format3 === "password" && !showPassword ? "" : "",
|
|
2083
1498
|
placeholder,
|
|
2084
|
-
startAdornment: iconInputStart ? /* @__PURE__ */
|
|
2085
|
-
endAdornment: /* @__PURE__ */
|
|
2086
|
-
|
|
1499
|
+
startAdornment: iconInputStart ? /* @__PURE__ */ React9.createElement(InputAdornment, { position: "start" }, IconInputStartValidation === "text" ? iconInputStart : IconInputStart ? /* @__PURE__ */ React9.createElement(IconInputStart, { fontSize: "small" }) : null) : "",
|
|
1500
|
+
endAdornment: /* @__PURE__ */ React9.createElement(InputAdornment, { position: "end" }, format3 === "password" ? /* @__PURE__ */ React9.createElement(
|
|
1501
|
+
IconButton5,
|
|
2087
1502
|
{
|
|
2088
1503
|
"aria-label": "toggle password visibility",
|
|
2089
1504
|
onClick: handleClickShowPassword,
|
|
2090
1505
|
onMouseDown: handleMouseDownPassword,
|
|
2091
1506
|
edge: "end"
|
|
2092
1507
|
},
|
|
2093
|
-
showPassword ? /* @__PURE__ */
|
|
2094
|
-
) : iconInputEnd === void 0 && infoElement !== void 0 ? /* @__PURE__ */
|
|
1508
|
+
showPassword ? /* @__PURE__ */ React9.createElement(VisibilityOff, null) : /* @__PURE__ */ React9.createElement(Visibility, null)
|
|
1509
|
+
) : iconInputEnd === void 0 && infoElement !== void 0 ? /* @__PURE__ */ React9.createElement(React9.Fragment, null, infoElement.component === "popover" ? /* @__PURE__ */ React9.createElement(React9.Fragment, null, /* @__PURE__ */ React9.createElement(
|
|
2095
1510
|
InfoOutlined,
|
|
2096
1511
|
{
|
|
2097
1512
|
"data-testid": "test-infoElement",
|
|
@@ -2102,8 +1517,8 @@ var SCTextField = ({
|
|
|
2102
1517
|
onMouseEnter: (event2) => handleOpenInfoElement(event2),
|
|
2103
1518
|
onMouseLeave: () => handleCloseInfoElement()
|
|
2104
1519
|
}
|
|
2105
|
-
), /* @__PURE__ */
|
|
2106
|
-
|
|
1520
|
+
), /* @__PURE__ */ React9.createElement(
|
|
1521
|
+
Popover,
|
|
2107
1522
|
{
|
|
2108
1523
|
sx: {
|
|
2109
1524
|
pointerEvents: "none",
|
|
@@ -2124,19 +1539,19 @@ var SCTextField = ({
|
|
|
2124
1539
|
},
|
|
2125
1540
|
disableRestoreFocus: true
|
|
2126
1541
|
},
|
|
2127
|
-
/* @__PURE__ */
|
|
2128
|
-
)) : /* @__PURE__ */
|
|
1542
|
+
/* @__PURE__ */ React9.createElement(Typography4, { "data-testid": "test-popover-text", p: 2 }, infoElement.text)
|
|
1543
|
+
)) : /* @__PURE__ */ React9.createElement(Tooltip2, { title: infoElement.text, placement: "bottom-end", slotProps: { popper: { modifiers: [{ name: "offset", options: { offset: [0, -14] } }] } } }, /* @__PURE__ */ React9.createElement(
|
|
2129
1544
|
InfoOutlined,
|
|
2130
1545
|
{
|
|
2131
1546
|
color: "action",
|
|
2132
1547
|
fontSize: "small"
|
|
2133
1548
|
}
|
|
2134
|
-
))) : iconInputEnd !== void 0 ? IconInputEndValidation === "text" ? iconInputEnd : IconInputEnd ? /* @__PURE__ */
|
|
1549
|
+
))) : iconInputEnd !== void 0 ? IconInputEndValidation === "text" ? iconInputEnd : IconInputEnd ? /* @__PURE__ */ React9.createElement(IconInputEnd, { fontSize: "small" }) : null : ""),
|
|
2135
1550
|
label: label ? label + (format3 === "password" && !showPassword ? "" : "") : "",
|
|
2136
1551
|
autoComplete: format3 === "password" ? "new-password" : "off"
|
|
2137
1552
|
}
|
|
2138
1553
|
)
|
|
2139
|
-
), (iconInputEnd !== void 0 || format3 === "password") && infoElement ? /* @__PURE__ */
|
|
1554
|
+
), (iconInputEnd !== void 0 || format3 === "password") && infoElement ? /* @__PURE__ */ React9.createElement(React9.Fragment, null, infoElement.component === "popover" ? /* @__PURE__ */ React9.createElement(React9.Fragment, null, /* @__PURE__ */ React9.createElement(
|
|
2140
1555
|
InfoOutlined,
|
|
2141
1556
|
{
|
|
2142
1557
|
"data-testid": "test-infoElement",
|
|
@@ -2147,8 +1562,8 @@ var SCTextField = ({
|
|
|
2147
1562
|
onMouseEnter: (event2) => handleOpenInfoElement(event2),
|
|
2148
1563
|
onMouseLeave: handleCloseInfoElement
|
|
2149
1564
|
}
|
|
2150
|
-
), /* @__PURE__ */
|
|
2151
|
-
|
|
1565
|
+
), /* @__PURE__ */ React9.createElement(
|
|
1566
|
+
Popover,
|
|
2152
1567
|
{
|
|
2153
1568
|
sx: { pointerEvents: "none" },
|
|
2154
1569
|
open: openInfoElement,
|
|
@@ -2164,8 +1579,8 @@ var SCTextField = ({
|
|
|
2164
1579
|
},
|
|
2165
1580
|
disableRestoreFocus: true
|
|
2166
1581
|
},
|
|
2167
|
-
/* @__PURE__ */
|
|
2168
|
-
)) : /* @__PURE__ */
|
|
1582
|
+
/* @__PURE__ */ React9.createElement(Typography4, { "data-testid": "test-popover-text", p: 2 }, infoElement.text)
|
|
1583
|
+
)) : /* @__PURE__ */ React9.createElement(Tooltip2, { title: infoElement.text, placement: "bottom-end", slotProps: { popper: { modifiers: [{ name: "offset", options: { offset: [0, -14] } }] } } }, /* @__PURE__ */ React9.createElement(
|
|
2169
1584
|
InfoOutlined,
|
|
2170
1585
|
{
|
|
2171
1586
|
sx: { marginLeft: "4px" },
|
|
@@ -2185,8 +1600,8 @@ function getIcon2(name) {
|
|
|
2185
1600
|
}
|
|
2186
1601
|
|
|
2187
1602
|
// src/Components/TextArea/SCTextArea.tsx
|
|
2188
|
-
import
|
|
2189
|
-
import { Typography as
|
|
1603
|
+
import React10, { useEffect as useEffect8, useState as useState10 } from "react";
|
|
1604
|
+
import { Typography as Typography5, Stack as Stack4, TextField, Box as Box6, Popover as Popover2, Tooltip as Tooltip3, SvgIcon as SvgIcon3, Grid as Grid2 } from "@mui/material";
|
|
2190
1605
|
import { InfoOutlined as InfoOutlined2 } from "@mui/icons-material";
|
|
2191
1606
|
var SCTextArea = ({
|
|
2192
1607
|
//informativas
|
|
@@ -2209,11 +1624,11 @@ var SCTextArea = ({
|
|
|
2209
1624
|
state,
|
|
2210
1625
|
onBlur
|
|
2211
1626
|
}) => {
|
|
2212
|
-
const [helperCount, setHelperCount] =
|
|
2213
|
-
const [stateError, setStateError] =
|
|
2214
|
-
const [anchorInfoTitle, setAnchorInfoTitle] =
|
|
1627
|
+
const [helperCount, setHelperCount] = useState10(0);
|
|
1628
|
+
const [stateError, setStateError] = useState10(false);
|
|
1629
|
+
const [anchorInfoTitle, setAnchorInfoTitle] = React10.useState(null);
|
|
2215
1630
|
const openInfoTitle = Boolean(anchorInfoTitle);
|
|
2216
|
-
|
|
1631
|
+
useEffect8(() => {
|
|
2217
1632
|
setHelperCount(state == null ? void 0 : state.length);
|
|
2218
1633
|
}, [state]);
|
|
2219
1634
|
const IconTitle = getIcon2(iconTitle);
|
|
@@ -2235,7 +1650,7 @@ var SCTextArea = ({
|
|
|
2235
1650
|
const handleCloseInfoTitle = () => {
|
|
2236
1651
|
setAnchorInfoTitle(null);
|
|
2237
1652
|
};
|
|
2238
|
-
return /* @__PURE__ */
|
|
1653
|
+
return /* @__PURE__ */ React10.createElement(React10.Fragment, null, /* @__PURE__ */ React10.createElement(Box6, { sx: { width } }, /* @__PURE__ */ React10.createElement(Grid2, { container: true, sx: { alignItems: "center" }, gap: 0.5 }, iconTitle && IconTitle && /* @__PURE__ */ React10.createElement(SvgIcon3, { color: "action", fontSize: "small", component: IconTitle }), title && /* @__PURE__ */ React10.createElement(Typography5, { color: colorTitle || "text.secondary", variant: "subtitle2" }, title), infoTitle ? /* @__PURE__ */ React10.createElement(React10.Fragment, null, infoTitle.component === "popover" ? /* @__PURE__ */ React10.createElement(React10.Fragment, null, /* @__PURE__ */ React10.createElement(
|
|
2239
1654
|
InfoOutlined2,
|
|
2240
1655
|
{
|
|
2241
1656
|
color: "action",
|
|
@@ -2243,8 +1658,8 @@ var SCTextArea = ({
|
|
|
2243
1658
|
onMouseEnter: (event2) => handleOpenInfoTitle(event2),
|
|
2244
1659
|
onMouseLeave: () => handleCloseInfoTitle()
|
|
2245
1660
|
}
|
|
2246
|
-
), /* @__PURE__ */
|
|
2247
|
-
|
|
1661
|
+
), /* @__PURE__ */ React10.createElement(
|
|
1662
|
+
Popover2,
|
|
2248
1663
|
{
|
|
2249
1664
|
sx: { pointerEvents: "none" },
|
|
2250
1665
|
open: openInfoTitle,
|
|
@@ -2260,14 +1675,14 @@ var SCTextArea = ({
|
|
|
2260
1675
|
},
|
|
2261
1676
|
disableRestoreFocus: true
|
|
2262
1677
|
},
|
|
2263
|
-
/* @__PURE__ */
|
|
2264
|
-
)) : /* @__PURE__ */
|
|
1678
|
+
/* @__PURE__ */ React10.createElement(Typography5, { sx: { p: 2 } }, infoTitle.text)
|
|
1679
|
+
)) : /* @__PURE__ */ React10.createElement(Tooltip3, { title: infoTitle.text, placement: "bottom-start", slotProps: { popper: { modifiers: [{ name: "offset", options: { offset: [0, -14] } }] } } }, /* @__PURE__ */ React10.createElement(
|
|
2265
1680
|
InfoOutlined2,
|
|
2266
1681
|
{
|
|
2267
1682
|
color: "action",
|
|
2268
1683
|
fontSize: "small"
|
|
2269
1684
|
}
|
|
2270
|
-
))) : ""), /* @__PURE__ */
|
|
1685
|
+
))) : ""), /* @__PURE__ */ React10.createElement(Stack4, null, /* @__PURE__ */ React10.createElement(
|
|
2271
1686
|
TextField,
|
|
2272
1687
|
{
|
|
2273
1688
|
required,
|
|
@@ -2292,8 +1707,8 @@ var SCTextArea = ({
|
|
|
2292
1707
|
shrink: true
|
|
2293
1708
|
}
|
|
2294
1709
|
}
|
|
2295
|
-
)), /* @__PURE__ */
|
|
2296
|
-
|
|
1710
|
+
)), /* @__PURE__ */ React10.createElement(Stack4, null, /* @__PURE__ */ React10.createElement(
|
|
1711
|
+
Typography5,
|
|
2297
1712
|
{
|
|
2298
1713
|
variant: "caption",
|
|
2299
1714
|
color: "text.secondary",
|
|
@@ -2306,10 +1721,10 @@ var SCTextArea = ({
|
|
|
2306
1721
|
};
|
|
2307
1722
|
|
|
2308
1723
|
// src/Components/SCSelect.tsx
|
|
2309
|
-
import
|
|
2310
|
-
import { InputLabel as InputLabel2, FormControl as FormControl2, MenuItem
|
|
1724
|
+
import React11, { useEffect as useEffect9 } from "react";
|
|
1725
|
+
import { InputLabel as InputLabel2, FormControl as FormControl2, MenuItem, SvgIcon as SvgIcon4, ListItemIcon, ListItemText, Box as Box7 } from "@mui/material";
|
|
2311
1726
|
import Select from "@mui/material/Select";
|
|
2312
|
-
import * as
|
|
1727
|
+
import * as Muicon4 from "@mui/icons-material";
|
|
2313
1728
|
function SCSelect({
|
|
2314
1729
|
label = "",
|
|
2315
1730
|
data,
|
|
@@ -2324,16 +1739,16 @@ function SCSelect({
|
|
|
2324
1739
|
state
|
|
2325
1740
|
}) {
|
|
2326
1741
|
const labelContent = `<span style="color: red;">* </span>` + label;
|
|
2327
|
-
const [prevData, setPrevData] =
|
|
2328
|
-
const [error, setError] =
|
|
2329
|
-
|
|
1742
|
+
const [prevData, setPrevData] = React11.useState(data);
|
|
1743
|
+
const [error, setError] = React11.useState(false);
|
|
1744
|
+
useEffect9(() => {
|
|
2330
1745
|
if (error) {
|
|
2331
1746
|
setTimeout(() => {
|
|
2332
1747
|
setError(false);
|
|
2333
1748
|
}, 1e3);
|
|
2334
1749
|
}
|
|
2335
1750
|
}, [error]);
|
|
2336
|
-
|
|
1751
|
+
useEffect9(() => {
|
|
2337
1752
|
let dataChangeValidation = JSON.stringify(prevData) === JSON.stringify(data);
|
|
2338
1753
|
if (dataChangeValidation == false) {
|
|
2339
1754
|
setState({ hiddenValue: "", textValue: "" });
|
|
@@ -2343,7 +1758,7 @@ function SCSelect({
|
|
|
2343
1758
|
data.map(function(option, index, array) {
|
|
2344
1759
|
if (option == null ? void 0 : option.icon) {
|
|
2345
1760
|
if ((option == null ? void 0 : option.icon.type) == void 0) {
|
|
2346
|
-
option.icon =
|
|
1761
|
+
option.icon = Muicon4[option == null ? void 0 : option.icon];
|
|
2347
1762
|
} else {
|
|
2348
1763
|
option;
|
|
2349
1764
|
}
|
|
@@ -2367,7 +1782,7 @@ function SCSelect({
|
|
|
2367
1782
|
}
|
|
2368
1783
|
}
|
|
2369
1784
|
};
|
|
2370
|
-
return /* @__PURE__ */
|
|
1785
|
+
return /* @__PURE__ */ React11.createElement(React11.Fragment, null, data && /* @__PURE__ */ React11.createElement(Box7, { sx: { width } }, /* @__PURE__ */ React11.createElement(
|
|
2371
1786
|
FormControl2,
|
|
2372
1787
|
{
|
|
2373
1788
|
fullWidth: true,
|
|
@@ -2375,18 +1790,18 @@ function SCSelect({
|
|
|
2375
1790
|
variant,
|
|
2376
1791
|
sx: { background: background ? background : "transparent" }
|
|
2377
1792
|
},
|
|
2378
|
-
/* @__PURE__ */
|
|
1793
|
+
/* @__PURE__ */ React11.createElement(
|
|
2379
1794
|
InputLabel2,
|
|
2380
1795
|
{
|
|
2381
1796
|
error
|
|
2382
1797
|
},
|
|
2383
|
-
required ? /* @__PURE__ */
|
|
1798
|
+
required ? /* @__PURE__ */ React11.createElement("span", { dangerouslySetInnerHTML: { __html: labelContent } }) : label
|
|
2384
1799
|
),
|
|
2385
|
-
/* @__PURE__ */
|
|
1800
|
+
/* @__PURE__ */ React11.createElement(
|
|
2386
1801
|
Select,
|
|
2387
1802
|
{
|
|
2388
1803
|
value: Array.isArray(state.hiddenValue) ? state.hiddenValue[0] || "" : state.hiddenValue != "-1" ? state.hiddenValue : "",
|
|
2389
|
-
label: required ? /* @__PURE__ */
|
|
1804
|
+
label: required ? /* @__PURE__ */ React11.createElement("span", { dangerouslySetInnerHTML: { __html: labelContent } }) : label,
|
|
2390
1805
|
onChange: handleChange,
|
|
2391
1806
|
onBlur: handleBlur,
|
|
2392
1807
|
variant,
|
|
@@ -2417,20 +1832,20 @@ function SCSelect({
|
|
|
2417
1832
|
}
|
|
2418
1833
|
},
|
|
2419
1834
|
data.map((option, index) => {
|
|
2420
|
-
return /* @__PURE__ */
|
|
1835
|
+
return /* @__PURE__ */ React11.createElement(MenuItem, { key: index, value: getItemValue(option).value }, getItemValue(option).icon != void 0 ? /* @__PURE__ */ React11.createElement(ListItemIcon, { sx: { minWidth: "10px !important" } }, /* @__PURE__ */ React11.createElement(SvgIcon4, { fontSize: "small", color: "action", component: getItemValue(option).icon })) : "", /* @__PURE__ */ React11.createElement(ListItemText, { primary: getItemValue(option).text, color: "text.primary" }));
|
|
2421
1836
|
})
|
|
2422
1837
|
)
|
|
2423
1838
|
)));
|
|
2424
1839
|
}
|
|
2425
1840
|
|
|
2426
1841
|
// src/Components/SCAutocomplete.tsx
|
|
2427
|
-
import
|
|
2428
|
-
import { Autocomplete, Checkbox, InputAdornment as InputAdornment3, MenuItem as
|
|
1842
|
+
import React12, { useEffect as useEffect10, useMemo as useMemo3 } from "react";
|
|
1843
|
+
import { Autocomplete, Checkbox, InputAdornment as InputAdornment3, MenuItem as MenuItem2, TextField as TextField3, Avatar, Typography as Typography7, SvgIcon as SvgIcon5, ListItemIcon as ListItemIcon2, ListItemText as ListItemText2, Divider as Divider3, FormControlLabel as FormControlLabel2, IconButton as IconButton7, Chip as Chip3, Box as Box8, Button as Button7, Grid as Grid3, Popper, Paper } from "@mui/material";
|
|
2429
1844
|
import { Search, Clear } from "@mui/icons-material";
|
|
2430
|
-
import * as
|
|
1845
|
+
import * as Muicon5 from "@mui/icons-material";
|
|
2431
1846
|
var StopEvent = ({ children }) => {
|
|
2432
|
-
return /* @__PURE__ */
|
|
2433
|
-
|
|
1847
|
+
return /* @__PURE__ */ React12.createElement(
|
|
1848
|
+
Box8,
|
|
2434
1849
|
{
|
|
2435
1850
|
onMouseDown: (e) => {
|
|
2436
1851
|
e.preventDefault();
|
|
@@ -2468,12 +1883,12 @@ function SCAutocomplete({
|
|
|
2468
1883
|
const labelContent = `<span style="color: red;">* </span>` + label;
|
|
2469
1884
|
let group = "";
|
|
2470
1885
|
let isSelected = false;
|
|
2471
|
-
const [selectedOptions, setSelectedOptions] =
|
|
2472
|
-
const [prevData, setPrevData] =
|
|
2473
|
-
const [originalData, setOriginalData] =
|
|
2474
|
-
const [inputValue, setInputValue] =
|
|
2475
|
-
const [isUserTyping, setIsUserTyping] =
|
|
2476
|
-
|
|
1886
|
+
const [selectedOptions, setSelectedOptions] = React12.useState([]);
|
|
1887
|
+
const [prevData, setPrevData] = React12.useState(data);
|
|
1888
|
+
const [originalData, setOriginalData] = React12.useState(data);
|
|
1889
|
+
const [inputValue, setInputValue] = React12.useState("");
|
|
1890
|
+
const [isUserTyping, setIsUserTyping] = React12.useState(false);
|
|
1891
|
+
useEffect10(() => {
|
|
2477
1892
|
const dataChangeValidation = JSON.stringify(prevData) === JSON.stringify(data);
|
|
2478
1893
|
if (!dataChangeValidation && !isUserTyping) {
|
|
2479
1894
|
setState({ hiddenValue: "-1", textValue: "" });
|
|
@@ -2484,7 +1899,7 @@ function SCAutocomplete({
|
|
|
2484
1899
|
}
|
|
2485
1900
|
setPrevData(data);
|
|
2486
1901
|
}, [data, isUserTyping]);
|
|
2487
|
-
|
|
1902
|
+
useEffect10(() => {
|
|
2488
1903
|
if (typeFormat == "multiselect") {
|
|
2489
1904
|
if (state.hiddenValue != "-1" && Array.isArray(state.hiddenValue)) {
|
|
2490
1905
|
const newSelectedOptions = originalData.filter(
|
|
@@ -2494,7 +1909,7 @@ function SCAutocomplete({
|
|
|
2494
1909
|
}
|
|
2495
1910
|
}
|
|
2496
1911
|
}, [state.hiddenValue, originalData, typeFormat]);
|
|
2497
|
-
|
|
1912
|
+
useEffect10(() => {
|
|
2498
1913
|
if (inputValue === "") {
|
|
2499
1914
|
setIsUserTyping(false);
|
|
2500
1915
|
}
|
|
@@ -2513,7 +1928,7 @@ function SCAutocomplete({
|
|
|
2513
1928
|
return data.map((option) => {
|
|
2514
1929
|
if ((option == null ? void 0 : option.icon) && option.icon.type === void 0) {
|
|
2515
1930
|
return __spreadProps(__spreadValues({}, option), {
|
|
2516
|
-
icon:
|
|
1931
|
+
icon: Muicon5[option.icon]
|
|
2517
1932
|
});
|
|
2518
1933
|
}
|
|
2519
1934
|
return option;
|
|
@@ -2563,16 +1978,16 @@ function SCAutocomplete({
|
|
|
2563
1978
|
const selectedValue = typeFormat === "multiselect" ? selectedOptions : originalData.find(
|
|
2564
1979
|
(item) => getItemValue(item).value === state.hiddenValue
|
|
2565
1980
|
) || null;
|
|
2566
|
-
const [open, setOpen] =
|
|
2567
|
-
const componentClickActiveRef =
|
|
2568
|
-
const listboxScrollRef =
|
|
2569
|
-
const containerRef =
|
|
2570
|
-
const [chipLimit, setChipLimit] =
|
|
2571
|
-
const outsideChipsMeasureRef =
|
|
2572
|
-
const [visibleChipCount, setVisibleChipCount] =
|
|
2573
|
-
const [popoverAnchor, setPopoverAnchor] =
|
|
2574
|
-
const popoverTimerRef =
|
|
2575
|
-
|
|
1981
|
+
const [open, setOpen] = React12.useState(false);
|
|
1982
|
+
const componentClickActiveRef = React12.useRef(false);
|
|
1983
|
+
const listboxScrollRef = React12.useRef(null);
|
|
1984
|
+
const containerRef = React12.useRef(null);
|
|
1985
|
+
const [chipLimit, setChipLimit] = React12.useState(2);
|
|
1986
|
+
const outsideChipsMeasureRef = React12.useRef(null);
|
|
1987
|
+
const [visibleChipCount, setVisibleChipCount] = React12.useState(Number.MAX_SAFE_INTEGER);
|
|
1988
|
+
const [popoverAnchor, setPopoverAnchor] = React12.useState(null);
|
|
1989
|
+
const popoverTimerRef = React12.useRef(null);
|
|
1990
|
+
useEffect10(() => {
|
|
2576
1991
|
const el = containerRef.current;
|
|
2577
1992
|
if (!el) return;
|
|
2578
1993
|
const observer = new ResizeObserver((entries) => {
|
|
@@ -2583,7 +1998,7 @@ function SCAutocomplete({
|
|
|
2583
1998
|
observer.observe(el);
|
|
2584
1999
|
return () => observer.disconnect();
|
|
2585
2000
|
}, []);
|
|
2586
|
-
|
|
2001
|
+
useEffect10(() => {
|
|
2587
2002
|
if (!chipOutside || typeFormat !== "multiselect") return;
|
|
2588
2003
|
const box = outsideChipsMeasureRef.current;
|
|
2589
2004
|
if (!box) return;
|
|
@@ -2603,7 +2018,7 @@ function SCAutocomplete({
|
|
|
2603
2018
|
observer.observe(box);
|
|
2604
2019
|
return () => observer.disconnect();
|
|
2605
2020
|
}, [selectedOptions, chipOutside, typeFormat]);
|
|
2606
|
-
|
|
2021
|
+
useEffect10(() => {
|
|
2607
2022
|
const displayCount = Math.min(visibleChipCount, selectedOptions.length);
|
|
2608
2023
|
if (selectedOptions.length - displayCount === 0) {
|
|
2609
2024
|
setPopoverAnchor(null);
|
|
@@ -2633,7 +2048,7 @@ function SCAutocomplete({
|
|
|
2633
2048
|
return Boolean(item.onComponentClick);
|
|
2634
2049
|
});
|
|
2635
2050
|
}, [data, getItemValue]);
|
|
2636
|
-
return /* @__PURE__ */
|
|
2051
|
+
return /* @__PURE__ */ React12.createElement(React12.Fragment, null, data && /* @__PURE__ */ React12.createElement(Box8, { ref: containerRef, sx: { width } }, /* @__PURE__ */ React12.createElement(
|
|
2637
2052
|
Autocomplete,
|
|
2638
2053
|
__spreadProps(__spreadValues(__spreadValues(__spreadValues(__spreadValues(__spreadValues({}, hayOnComponentClickGlobal ? { disableCloseOnSelect: true } : {}), hayOnComponentClickGlobal ? { blurOnSelect: false } : {}), hayOnComponentClickGlobal ? { open } : {}), hayOnComponentClickGlobal ? { onOpen: () => setOpen(true) } : {}), hayOnComponentClickGlobal ? {
|
|
2639
2054
|
onClose: (event2, reason) => {
|
|
@@ -2666,10 +2081,10 @@ function SCAutocomplete({
|
|
|
2666
2081
|
limitTags: chipLimit,
|
|
2667
2082
|
renderTags: chipOutside ? () => null : (value, getTagProps) => {
|
|
2668
2083
|
const limit = chipLimit;
|
|
2669
|
-
return /* @__PURE__ */
|
|
2084
|
+
return /* @__PURE__ */ React12.createElement(React12.Fragment, null, value.slice(0, limit).map((option, index) => {
|
|
2670
2085
|
const _a = getTagProps({ index }), { key } = _a, chipProps = __objRest(_a, ["key"]);
|
|
2671
|
-
return /* @__PURE__ */
|
|
2672
|
-
|
|
2086
|
+
return /* @__PURE__ */ React12.createElement(
|
|
2087
|
+
Chip3,
|
|
2673
2088
|
__spreadProps(__spreadValues({
|
|
2674
2089
|
key,
|
|
2675
2090
|
color: "default",
|
|
@@ -2680,7 +2095,7 @@ function SCAutocomplete({
|
|
|
2680
2095
|
style: { maxWidth: 120, overflow: "hidden", textOverflow: "ellipsis", whiteSpace: "nowrap" }
|
|
2681
2096
|
})
|
|
2682
2097
|
);
|
|
2683
|
-
}), value.length > limit && /* @__PURE__ */
|
|
2098
|
+
}), value.length > limit && /* @__PURE__ */ React12.createElement(Box8, { sx: { ml: 0.5, fontSize: 13, color: "#666", display: "flex", alignItems: "center" } }, `+${value.length - limit}`));
|
|
2684
2099
|
},
|
|
2685
2100
|
renderOption: (props, option) => {
|
|
2686
2101
|
const _a = props, { key } = _a, optionProps = __objRest(_a, ["key"]);
|
|
@@ -2699,8 +2114,8 @@ function SCAutocomplete({
|
|
|
2699
2114
|
group = option[columnGroup];
|
|
2700
2115
|
}
|
|
2701
2116
|
const item = getItemValue(option);
|
|
2702
|
-
return /* @__PURE__ */
|
|
2703
|
-
|
|
2117
|
+
return /* @__PURE__ */ React12.createElement(React12.Fragment, null, /* @__PURE__ */ React12.createElement(React12.Fragment, { key }, columnGroup ? !isValid ? /* @__PURE__ */ React12.createElement(Typography7, { color: "text.secondary", sx: { margin: "7px 16px !important", fontSize: "13px !important" } }, option[columnGroup]) : "" : "", /* @__PURE__ */ React12.createElement(
|
|
2118
|
+
MenuItem2,
|
|
2704
2119
|
__spreadProps(__spreadValues({}, optionProps), {
|
|
2705
2120
|
component: "li",
|
|
2706
2121
|
disabled: isDisabled,
|
|
@@ -2710,8 +2125,8 @@ function SCAutocomplete({
|
|
|
2710
2125
|
opacity: isDisabled ? 0.5 : 1
|
|
2711
2126
|
}
|
|
2712
2127
|
}),
|
|
2713
|
-
typeFormat != "multiselect" && getItemValue(option).icon != void 0 ? /* @__PURE__ */
|
|
2714
|
-
typeFormat == "multiselect" ? /* @__PURE__ */
|
|
2128
|
+
typeFormat != "multiselect" && getItemValue(option).icon != void 0 ? /* @__PURE__ */ React12.createElement(ListItemIcon2, { sx: { minWidth: "10px !important" } }, /* @__PURE__ */ React12.createElement(SvgIcon5, { fontSize: "small", color: "action", component: getItemValue(option).icon })) : "",
|
|
2129
|
+
typeFormat == "multiselect" ? /* @__PURE__ */ React12.createElement(
|
|
2715
2130
|
Checkbox,
|
|
2716
2131
|
{
|
|
2717
2132
|
checked: isSelected,
|
|
@@ -2720,8 +2135,8 @@ function SCAutocomplete({
|
|
|
2720
2135
|
color: "primary"
|
|
2721
2136
|
}
|
|
2722
2137
|
) : "",
|
|
2723
|
-
/* @__PURE__ */
|
|
2724
|
-
item.component != null ? /* @__PURE__ */
|
|
2138
|
+
/* @__PURE__ */ React12.createElement(ListItemText2, { primary: getItemValue(option).text, color: "text.primary" }),
|
|
2139
|
+
item.component != null ? /* @__PURE__ */ React12.createElement(StopEvent, null, /* @__PURE__ */ React12.createElement(
|
|
2725
2140
|
"span",
|
|
2726
2141
|
{
|
|
2727
2142
|
onMouseDown: (event2) => {
|
|
@@ -2752,7 +2167,7 @@ function SCAutocomplete({
|
|
|
2752
2167
|
)) : null
|
|
2753
2168
|
)));
|
|
2754
2169
|
},
|
|
2755
|
-
renderInput: (params) => /* @__PURE__ */
|
|
2170
|
+
renderInput: (params) => /* @__PURE__ */ React12.createElement(React12.Fragment, null, /* @__PURE__ */ React12.createElement(
|
|
2756
2171
|
TextField3,
|
|
2757
2172
|
__spreadProps(__spreadValues({
|
|
2758
2173
|
sx: {
|
|
@@ -2764,10 +2179,10 @@ function SCAutocomplete({
|
|
|
2764
2179
|
}
|
|
2765
2180
|
}
|
|
2766
2181
|
}, params), {
|
|
2767
|
-
label: required ? /* @__PURE__ */
|
|
2182
|
+
label: required ? /* @__PURE__ */ React12.createElement("span", { dangerouslySetInnerHTML: { __html: labelContent } }) : label,
|
|
2768
2183
|
placeholder: selectedOptions.length == 0 ? "B\xFAsqueda" : "",
|
|
2769
2184
|
InputProps: __spreadProps(__spreadValues({}, params.InputProps), {
|
|
2770
|
-
endAdornment: /* @__PURE__ */
|
|
2185
|
+
endAdornment: /* @__PURE__ */ React12.createElement(React12.Fragment, null, deleteType == "icon" && (state.hiddenValue.toString() != "-1" && state.hiddenValue.toString() != "") ? /* @__PURE__ */ React12.createElement(IconButton7, { size: "small", onClick: cleanOptions, sx: { marginLeft: "auto", textAlign: "right", padding: "0px" } }, /* @__PURE__ */ React12.createElement(Clear, { fontSize: "small" })) : "", /* @__PURE__ */ React12.createElement(InputAdornment3, { style: { zIndex: 1, position: "relative" }, position: "end" }, /* @__PURE__ */ React12.createElement(Search, { fontSize: "small", color: "action", style: { cursor: "pointer" } })))
|
|
2771
2186
|
})
|
|
2772
2187
|
})
|
|
2773
2188
|
)),
|
|
@@ -2779,9 +2194,9 @@ function SCAutocomplete({
|
|
|
2779
2194
|
}
|
|
2780
2195
|
},
|
|
2781
2196
|
listbox: {
|
|
2782
|
-
component:
|
|
2783
|
-
return /* @__PURE__ */
|
|
2784
|
-
|
|
2197
|
+
component: React12.forwardRef(function ListboxComponent(props, ref) {
|
|
2198
|
+
return /* @__PURE__ */ React12.createElement(React12.Fragment, null, /* @__PURE__ */ React12.createElement(
|
|
2199
|
+
Box8,
|
|
2785
2200
|
__spreadProps(__spreadValues({
|
|
2786
2201
|
ref: (node) => {
|
|
2787
2202
|
listboxScrollRef.current = node;
|
|
@@ -2795,9 +2210,9 @@ function SCAutocomplete({
|
|
|
2795
2210
|
backgroundColor: "white"
|
|
2796
2211
|
}, props.sx)
|
|
2797
2212
|
}),
|
|
2798
|
-
checkMassive && typeFormat == "multiselect" ? /* @__PURE__ */
|
|
2213
|
+
checkMassive && typeFormat == "multiselect" ? /* @__PURE__ */ React12.createElement(React12.Fragment, null, /* @__PURE__ */ React12.createElement(FormControlLabel2, { control: /* @__PURE__ */ React12.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__ */ React12.createElement(Divider3, null)) : "",
|
|
2799
2214
|
props.children,
|
|
2800
|
-
deleteType == "button" || fnAplicar ? /* @__PURE__ */
|
|
2215
|
+
deleteType == "button" || fnAplicar ? /* @__PURE__ */ React12.createElement(
|
|
2801
2216
|
Grid3,
|
|
2802
2217
|
{
|
|
2803
2218
|
container: true,
|
|
@@ -2812,7 +2227,7 @@ function SCAutocomplete({
|
|
|
2812
2227
|
justifyContent: "space-between"
|
|
2813
2228
|
}
|
|
2814
2229
|
},
|
|
2815
|
-
deleteType == "button" ? /* @__PURE__ */
|
|
2230
|
+
deleteType == "button" ? /* @__PURE__ */ React12.createElement(
|
|
2816
2231
|
Button7,
|
|
2817
2232
|
{
|
|
2818
2233
|
variant: "text",
|
|
@@ -2826,7 +2241,7 @@ function SCAutocomplete({
|
|
|
2826
2241
|
},
|
|
2827
2242
|
"Limpiar"
|
|
2828
2243
|
) : "",
|
|
2829
|
-
fnAplicar && /* @__PURE__ */
|
|
2244
|
+
fnAplicar && /* @__PURE__ */ React12.createElement(
|
|
2830
2245
|
Button7,
|
|
2831
2246
|
{
|
|
2832
2247
|
variant: "contained",
|
|
@@ -2845,8 +2260,8 @@ function SCAutocomplete({
|
|
|
2845
2260
|
), chipOutside && typeFormat === "multiselect" && selectedOptions.length > 0 && (() => {
|
|
2846
2261
|
const displayCount = Math.min(visibleChipCount, selectedOptions.length);
|
|
2847
2262
|
const hiddenCount = selectedOptions.length - displayCount;
|
|
2848
|
-
return /* @__PURE__ */
|
|
2849
|
-
|
|
2263
|
+
return /* @__PURE__ */ React12.createElement(Box8, { sx: { position: "relative", mt: 0.5 } }, /* @__PURE__ */ React12.createElement(
|
|
2264
|
+
Box8,
|
|
2850
2265
|
{
|
|
2851
2266
|
ref: outsideChipsMeasureRef,
|
|
2852
2267
|
"aria-hidden": "true",
|
|
@@ -2864,18 +2279,18 @@ function SCAutocomplete({
|
|
|
2864
2279
|
},
|
|
2865
2280
|
selectedOptions.map((option) => {
|
|
2866
2281
|
const avatarText = resolveAvatarText(option);
|
|
2867
|
-
return /* @__PURE__ */
|
|
2868
|
-
|
|
2282
|
+
return /* @__PURE__ */ React12.createElement("div", { key: getItemValue(option).value, "data-outside-chip": true, style: { display: "inline-flex" } }, /* @__PURE__ */ React12.createElement(
|
|
2283
|
+
Chip3,
|
|
2869
2284
|
__spreadValues({
|
|
2870
2285
|
size: "medium",
|
|
2871
2286
|
label: getItemValue(option).text
|
|
2872
|
-
}, chipOutside.type === "avatar" ? { avatar: /* @__PURE__ */
|
|
2287
|
+
}, chipOutside.type === "avatar" ? { avatar: /* @__PURE__ */ React12.createElement(Avatar, null, avatarText) } : {})
|
|
2873
2288
|
));
|
|
2874
2289
|
})
|
|
2875
|
-
), /* @__PURE__ */
|
|
2290
|
+
), /* @__PURE__ */ React12.createElement(Box8, { sx: { display: "flex", flexWrap: "wrap", gap: 0.5, maxHeight: 36, overflow: "hidden" } }, selectedOptions.slice(0, displayCount).map((option) => {
|
|
2876
2291
|
const avatarText = resolveAvatarText(option);
|
|
2877
|
-
return /* @__PURE__ */
|
|
2878
|
-
|
|
2292
|
+
return /* @__PURE__ */ React12.createElement(
|
|
2293
|
+
Chip3,
|
|
2879
2294
|
__spreadValues({
|
|
2880
2295
|
key: getItemValue(option).value,
|
|
2881
2296
|
color: "default",
|
|
@@ -2883,17 +2298,17 @@ function SCAutocomplete({
|
|
|
2883
2298
|
variant: "filled",
|
|
2884
2299
|
label: getItemValue(option).text,
|
|
2885
2300
|
onDelete: () => handleDeleteChip(option)
|
|
2886
|
-
}, chipOutside.type === "avatar" ? { avatar: /* @__PURE__ */
|
|
2301
|
+
}, chipOutside.type === "avatar" ? { avatar: /* @__PURE__ */ React12.createElement(Avatar, null, avatarText) } : {})
|
|
2887
2302
|
);
|
|
2888
|
-
}), hiddenCount > 0 && /* @__PURE__ */
|
|
2889
|
-
|
|
2303
|
+
}), hiddenCount > 0 && /* @__PURE__ */ React12.createElement(
|
|
2304
|
+
Box8,
|
|
2890
2305
|
{
|
|
2891
2306
|
onMouseEnter: handlePlusEnter,
|
|
2892
2307
|
onMouseLeave: handlePlusLeave,
|
|
2893
2308
|
sx: { ml: 0.5, fontSize: 13, color: "#666", display: "flex", alignItems: "center", cursor: "default" }
|
|
2894
2309
|
},
|
|
2895
2310
|
`+${hiddenCount}`
|
|
2896
|
-
)), /* @__PURE__ */
|
|
2311
|
+
)), /* @__PURE__ */ React12.createElement(
|
|
2897
2312
|
Popper,
|
|
2898
2313
|
{
|
|
2899
2314
|
open: Boolean(popoverAnchor),
|
|
@@ -2901,7 +2316,7 @@ function SCAutocomplete({
|
|
|
2901
2316
|
placement: "bottom-start",
|
|
2902
2317
|
sx: { zIndex: 1500 }
|
|
2903
2318
|
},
|
|
2904
|
-
/* @__PURE__ */
|
|
2319
|
+
/* @__PURE__ */ React12.createElement(
|
|
2905
2320
|
Paper,
|
|
2906
2321
|
{
|
|
2907
2322
|
elevation: 3,
|
|
@@ -2911,8 +2326,8 @@ function SCAutocomplete({
|
|
|
2911
2326
|
},
|
|
2912
2327
|
selectedOptions.slice(displayCount).map((option) => {
|
|
2913
2328
|
const avatarText = resolveAvatarText(option);
|
|
2914
|
-
return /* @__PURE__ */
|
|
2915
|
-
|
|
2329
|
+
return /* @__PURE__ */ React12.createElement(
|
|
2330
|
+
Chip3,
|
|
2916
2331
|
__spreadValues({
|
|
2917
2332
|
key: getItemValue(option).value,
|
|
2918
2333
|
color: "default",
|
|
@@ -2920,7 +2335,7 @@ function SCAutocomplete({
|
|
|
2920
2335
|
variant: "filled",
|
|
2921
2336
|
label: getItemValue(option).text,
|
|
2922
2337
|
onDelete: () => handleDeleteChip(option)
|
|
2923
|
-
}, chipOutside.type === "avatar" ? { avatar: /* @__PURE__ */
|
|
2338
|
+
}, chipOutside.type === "avatar" ? { avatar: /* @__PURE__ */ React12.createElement(Avatar, { sx: { fontSize: avatarText.length > 1 ? "0.55rem" : "0.75rem" } }, avatarText) } : {})
|
|
2924
2339
|
);
|
|
2925
2340
|
})
|
|
2926
2341
|
)
|
|
@@ -2929,13 +2344,13 @@ function SCAutocomplete({
|
|
|
2929
2344
|
}
|
|
2930
2345
|
|
|
2931
2346
|
// src/Components/SCDateRange.tsx
|
|
2932
|
-
import
|
|
2933
|
-
import { Box as
|
|
2347
|
+
import React13 from "react";
|
|
2348
|
+
import { Box as Box9, InputAdornment as InputAdornment4 } from "@mui/material";
|
|
2934
2349
|
import { LocalizationProvider } from "@mui/x-date-pickers/LocalizationProvider";
|
|
2935
2350
|
import { AdapterDayjs } from "@mui/x-date-pickers/AdapterDayjs";
|
|
2936
2351
|
import { DateRangePicker } from "@mui/x-date-pickers-pro/DateRangePicker";
|
|
2937
2352
|
import { MultiInputDateRangeField } from "@mui/x-date-pickers-pro/MultiInputDateRangeField";
|
|
2938
|
-
import
|
|
2353
|
+
import dayjs from "dayjs";
|
|
2939
2354
|
import "dayjs/locale/es";
|
|
2940
2355
|
import { LicenseInfo } from "@mui/x-license";
|
|
2941
2356
|
import InsertInvitationOutlinedIcon from "@mui/icons-material/InsertInvitationOutlined";
|
|
@@ -2954,12 +2369,12 @@ var SCDateRange = ({
|
|
|
2954
2369
|
const isStartEmpty = required && !state[0];
|
|
2955
2370
|
const isEndEmpty = required && !state[1];
|
|
2956
2371
|
const hasError = isStartEmpty || isEndEmpty;
|
|
2957
|
-
const [notification, setNotification] =
|
|
2372
|
+
const [notification, setNotification] = React13.useState(false);
|
|
2958
2373
|
const handleDateChange = (newValue) => {
|
|
2959
|
-
const minDateDayjs =
|
|
2374
|
+
const minDateDayjs = dayjs("2013-01-01");
|
|
2960
2375
|
const convertedValue = [
|
|
2961
|
-
newValue[0] ?
|
|
2962
|
-
newValue[1] ?
|
|
2376
|
+
newValue[0] ? dayjs(newValue[0]) : null,
|
|
2377
|
+
newValue[1] ? dayjs(newValue[1]) : null
|
|
2963
2378
|
];
|
|
2964
2379
|
if (convertedValue[0] != null) {
|
|
2965
2380
|
if ((!convertedValue[0].isValid() || !convertedValue[0].isAfter(minDateDayjs)) == true) {
|
|
@@ -2998,7 +2413,7 @@ var SCDateRange = ({
|
|
|
2998
2413
|
setState(convertedValue);
|
|
2999
2414
|
}
|
|
3000
2415
|
};
|
|
3001
|
-
return /* @__PURE__ */
|
|
2416
|
+
return /* @__PURE__ */ React13.createElement(React13.Fragment, null, /* @__PURE__ */ React13.createElement(LocalizationProvider, { dateAdapter: AdapterDayjs, adapterLocale: "es" }, /* @__PURE__ */ React13.createElement(Box9, { sx: { width: "100%" } }, /* @__PURE__ */ React13.createElement(
|
|
3002
2417
|
DateRangePicker,
|
|
3003
2418
|
{
|
|
3004
2419
|
value: state,
|
|
@@ -3022,7 +2437,7 @@ var SCDateRange = ({
|
|
|
3022
2437
|
required,
|
|
3023
2438
|
error: isStart ? isStartEmpty : isEndEmpty,
|
|
3024
2439
|
InputProps: {
|
|
3025
|
-
endAdornment: /* @__PURE__ */
|
|
2440
|
+
endAdornment: /* @__PURE__ */ React13.createElement(InputAdornment4, { position: "end" }, /* @__PURE__ */ React13.createElement(
|
|
3026
2441
|
InsertInvitationOutlinedIcon,
|
|
3027
2442
|
{
|
|
3028
2443
|
color: hasError ? "error" : "action",
|
|
@@ -3058,11 +2473,11 @@ var DrawerContent = ({ arrayElements }) => {
|
|
|
3058
2473
|
var _a, _b, _c, _d, _e, _f;
|
|
3059
2474
|
const key = `Stack_${(_a = arrayElement.type) != null ? _a : ""} ${(_b = arrayElement.label) != null ? _b : ""}${index}`;
|
|
3060
2475
|
if (arrayElement.component) {
|
|
3061
|
-
return /* @__PURE__ */
|
|
2476
|
+
return /* @__PURE__ */ React14.createElement(Stack5, { direction: "row", alignItems: "left", gap: 1 }, arrayElement.component);
|
|
3062
2477
|
}
|
|
3063
2478
|
switch (arrayElement.type) {
|
|
3064
2479
|
case "textField":
|
|
3065
|
-
return /* @__PURE__ */
|
|
2480
|
+
return /* @__PURE__ */ React14.createElement(
|
|
3066
2481
|
SCTextField,
|
|
3067
2482
|
{
|
|
3068
2483
|
title: arrayElement.title,
|
|
@@ -3090,7 +2505,7 @@ var DrawerContent = ({ arrayElements }) => {
|
|
|
3090
2505
|
}
|
|
3091
2506
|
);
|
|
3092
2507
|
case "textArea":
|
|
3093
|
-
return /* @__PURE__ */
|
|
2508
|
+
return /* @__PURE__ */ React14.createElement(
|
|
3094
2509
|
SCTextArea,
|
|
3095
2510
|
{
|
|
3096
2511
|
title: arrayElement.title,
|
|
@@ -3111,7 +2526,7 @@ var DrawerContent = ({ arrayElements }) => {
|
|
|
3111
2526
|
}
|
|
3112
2527
|
);
|
|
3113
2528
|
case "autocomplete":
|
|
3114
|
-
return /* @__PURE__ */
|
|
2529
|
+
return /* @__PURE__ */ React14.createElement(
|
|
3115
2530
|
SCAutocomplete,
|
|
3116
2531
|
{
|
|
3117
2532
|
label: arrayElement.label,
|
|
@@ -3131,7 +2546,7 @@ var DrawerContent = ({ arrayElements }) => {
|
|
|
3131
2546
|
}
|
|
3132
2547
|
);
|
|
3133
2548
|
case "select":
|
|
3134
|
-
return /* @__PURE__ */
|
|
2549
|
+
return /* @__PURE__ */ React14.createElement(
|
|
3135
2550
|
SCSelect,
|
|
3136
2551
|
{
|
|
3137
2552
|
label: arrayElement.label,
|
|
@@ -3149,7 +2564,7 @@ var DrawerContent = ({ arrayElements }) => {
|
|
|
3149
2564
|
}
|
|
3150
2565
|
);
|
|
3151
2566
|
case "dateRange":
|
|
3152
|
-
return /* @__PURE__ */
|
|
2567
|
+
return /* @__PURE__ */ React14.createElement(
|
|
3153
2568
|
SCDateRange,
|
|
3154
2569
|
{
|
|
3155
2570
|
labelDateInitial: arrayElement.labelDateInitial,
|
|
@@ -3164,300 +2579,960 @@ var DrawerContent = ({ arrayElements }) => {
|
|
|
3164
2579
|
default:
|
|
3165
2580
|
return null;
|
|
3166
2581
|
}
|
|
3167
|
-
};
|
|
3168
|
-
return /* @__PURE__ */
|
|
3169
|
-
var _a, _b;
|
|
3170
|
-
return /* @__PURE__ */
|
|
3171
|
-
|
|
3172
|
-
{
|
|
3173
|
-
key: `Stack_${(_a = arrayElement.type) != null ? _a : ""} ${(_b = arrayElement.label) != null ? _b : ""}${index}`,
|
|
3174
|
-
sx: { width: "100%" }
|
|
2582
|
+
};
|
|
2583
|
+
return /* @__PURE__ */ React14.createElement(Stack5, { alignItems: "flex-start", height: "100%", gap: "16px", flex: 1, overflow: "auto", padding: "16px" }, arrayElements == null ? void 0 : arrayElements.map((arrayElement, index) => {
|
|
2584
|
+
var _a, _b;
|
|
2585
|
+
return /* @__PURE__ */ React14.createElement(
|
|
2586
|
+
Box10,
|
|
2587
|
+
{
|
|
2588
|
+
key: `Stack_${(_a = arrayElement.type) != null ? _a : ""} ${(_b = arrayElement.label) != null ? _b : ""}${index}`,
|
|
2589
|
+
sx: { width: "100%" }
|
|
2590
|
+
},
|
|
2591
|
+
renderElement(arrayElement, index)
|
|
2592
|
+
);
|
|
2593
|
+
}));
|
|
2594
|
+
};
|
|
2595
|
+
|
|
2596
|
+
// src/Components/Drawer/components/DrawerActions.tsx
|
|
2597
|
+
import React15 from "react";
|
|
2598
|
+
import { Button as Button8 } from "@mui/material";
|
|
2599
|
+
import Grid4 from "@mui/material/Grid";
|
|
2600
|
+
var DrawerActions = ({ actions, anchor }) => {
|
|
2601
|
+
if (actions === false || actions === void 0) {
|
|
2602
|
+
return null;
|
|
2603
|
+
}
|
|
2604
|
+
if (!Array.isArray(actions) || actions.length === 0) {
|
|
2605
|
+
return null;
|
|
2606
|
+
}
|
|
2607
|
+
return /* @__PURE__ */ React15.createElement(
|
|
2608
|
+
Grid4,
|
|
2609
|
+
{
|
|
2610
|
+
sx: { borderTop: 1, borderColor: "#1018403B", zIndex: 1500 },
|
|
2611
|
+
container: true,
|
|
2612
|
+
gap: 2,
|
|
2613
|
+
padding: "8px 16px",
|
|
2614
|
+
height: "42px",
|
|
2615
|
+
alignItems: "center",
|
|
2616
|
+
flexWrap: "nowrap",
|
|
2617
|
+
justifyContent: actions.length > 1 ? "space-between" : "flex-start",
|
|
2618
|
+
flexDirection: "row-reverse"
|
|
2619
|
+
},
|
|
2620
|
+
actions.map((btn, index) => /* @__PURE__ */ React15.createElement(
|
|
2621
|
+
Button8,
|
|
2622
|
+
{
|
|
2623
|
+
key: index,
|
|
2624
|
+
variant: index === 0 || actions.length < 2 ? "contained" : "text",
|
|
2625
|
+
color: btn.color ? btn.color : "primary",
|
|
2626
|
+
onClick: btn.fn,
|
|
2627
|
+
disabled: btn.disabled || false,
|
|
2628
|
+
size: "small",
|
|
2629
|
+
fullWidth: anchor === "bottom" ? true : false
|
|
2630
|
+
},
|
|
2631
|
+
btn.text
|
|
2632
|
+
))
|
|
2633
|
+
);
|
|
2634
|
+
};
|
|
2635
|
+
|
|
2636
|
+
// src/Components/Drawer/components/DrawerHeader.tsx
|
|
2637
|
+
import React16 from "react";
|
|
2638
|
+
import { Typography as Typography8, IconButton as IconButton8 } from "@mui/material";
|
|
2639
|
+
import Grid5 from "@mui/material/Grid";
|
|
2640
|
+
import CloseIcon from "@mui/icons-material/Close";
|
|
2641
|
+
var DrawerHeader = ({
|
|
2642
|
+
title,
|
|
2643
|
+
colorTitle,
|
|
2644
|
+
onClose,
|
|
2645
|
+
filterSideCard,
|
|
2646
|
+
type = "Drawer"
|
|
2647
|
+
}) => {
|
|
2648
|
+
return /* @__PURE__ */ React16.createElement(
|
|
2649
|
+
Grid5,
|
|
2650
|
+
{
|
|
2651
|
+
container: true,
|
|
2652
|
+
sx: {
|
|
2653
|
+
marginTop: type == "Swipeable" ? "16px" : "0px",
|
|
2654
|
+
backgroundColor: type == "Swipeable" ? "white" : type == "Sidecar" ? "#EAEBEC" : "primary.50",
|
|
2655
|
+
alignItems: "center",
|
|
2656
|
+
height: filterSideCard ? "38px" : "42px",
|
|
2657
|
+
textAlign: "left",
|
|
2658
|
+
padding: "8px 12px",
|
|
2659
|
+
justifyContent: "space-between",
|
|
2660
|
+
alignContent: "center"
|
|
2661
|
+
}
|
|
2662
|
+
},
|
|
2663
|
+
/* @__PURE__ */ React16.createElement(Typography8, { variant: filterSideCard ? "body2" : "h6", color: colorTitle || "text.primary" }, title != null ? title : "Personaliza tu b\xFAsqueda aqui"),
|
|
2664
|
+
filterSideCard ? /* @__PURE__ */ React16.createElement(React16.Fragment, null, filterSideCard) : /* @__PURE__ */ React16.createElement(IconButton8, { onClick: onClose }, /* @__PURE__ */ React16.createElement(CloseIcon, { "data-testid": "test-button-close", sx: { color: "text.primary" } }))
|
|
2665
|
+
);
|
|
2666
|
+
};
|
|
2667
|
+
|
|
2668
|
+
// src/Components/Drawer/SCDrawer.tsx
|
|
2669
|
+
function SCDrawer({
|
|
2670
|
+
title,
|
|
2671
|
+
arrayElements = [],
|
|
2672
|
+
actions,
|
|
2673
|
+
buttonDrawer,
|
|
2674
|
+
colorTitle,
|
|
2675
|
+
anchor = "left",
|
|
2676
|
+
width,
|
|
2677
|
+
open,
|
|
2678
|
+
setOpen,
|
|
2679
|
+
chipFilters,
|
|
2680
|
+
heightDrawer = 456,
|
|
2681
|
+
filterSideCard,
|
|
2682
|
+
type = "Drawer",
|
|
2683
|
+
onChipDelete
|
|
2684
|
+
}) {
|
|
2685
|
+
const drawerBleeding = heightDrawer;
|
|
2686
|
+
const { drawerOpen, handleDrawerClose, toggleDrawer } = useDrawerState({ open, setOpen });
|
|
2687
|
+
const { toast, setToastWithDelay } = useToast();
|
|
2688
|
+
const {
|
|
2689
|
+
stateChipFilters,
|
|
2690
|
+
setChipFilters,
|
|
2691
|
+
textFilters,
|
|
2692
|
+
setTextFilters,
|
|
2693
|
+
shouldShowChips,
|
|
2694
|
+
processChipFilters
|
|
2695
|
+
} = useChipFilters(arrayElements, chipFilters);
|
|
2696
|
+
const handleInputValidation = () => {
|
|
2697
|
+
if (chipFilters == null ? void 0 : chipFilters.length) {
|
|
2698
|
+
processChipFilters();
|
|
2699
|
+
} else {
|
|
2700
|
+
processChipFilters();
|
|
2701
|
+
validateInputs(
|
|
2702
|
+
arrayElements,
|
|
2703
|
+
setToastWithDelay,
|
|
2704
|
+
handleDrawerClose,
|
|
2705
|
+
setChipFilters,
|
|
2706
|
+
setTextFilters
|
|
2707
|
+
);
|
|
2708
|
+
}
|
|
2709
|
+
};
|
|
2710
|
+
const handleCleanFilters = () => {
|
|
2711
|
+
cleanAllFilters(arrayElements, setTextFilters);
|
|
2712
|
+
};
|
|
2713
|
+
const handleDeleteFilter = (element) => {
|
|
2714
|
+
deleteFilter(element, shouldShowChips, setTextFilters);
|
|
2715
|
+
onChipDelete == null ? void 0 : onChipDelete(element);
|
|
2716
|
+
};
|
|
2717
|
+
const getActions = () => {
|
|
2718
|
+
if (actions === false) return false;
|
|
2719
|
+
if (actions !== void 0) return actions;
|
|
2720
|
+
return [
|
|
2721
|
+
{ text: "Aplicar filtros", fn: handleInputValidation },
|
|
2722
|
+
{ text: "Limpiar filtros", fn: handleCleanFilters }
|
|
2723
|
+
];
|
|
2724
|
+
};
|
|
2725
|
+
const drawerActions = getActions();
|
|
2726
|
+
return /* @__PURE__ */ React17.createElement(React17.Fragment, null, toast && /* @__PURE__ */ React17.createElement(SCToastNotification, __spreadValues({}, toast)), /* @__PURE__ */ React17.createElement(
|
|
2727
|
+
Grid6,
|
|
2728
|
+
{
|
|
2729
|
+
container: true,
|
|
2730
|
+
justifyContent: "flex-start",
|
|
2731
|
+
flexWrap: "nowrap",
|
|
2732
|
+
alignItems: "center",
|
|
2733
|
+
sx: { width: "100%" }
|
|
2734
|
+
},
|
|
2735
|
+
shouldShowChips && /* @__PURE__ */ React17.createElement(
|
|
2736
|
+
ChipFiltersDisplay,
|
|
2737
|
+
{
|
|
2738
|
+
textFilters,
|
|
2739
|
+
onDeleteFilter: handleDeleteFilter
|
|
2740
|
+
}
|
|
2741
|
+
),
|
|
2742
|
+
buttonDrawer && /* @__PURE__ */ React17.createElement(
|
|
2743
|
+
DrawerButton,
|
|
2744
|
+
{
|
|
2745
|
+
buttonDrawer,
|
|
2746
|
+
onToggle: toggleDrawer(true)
|
|
2747
|
+
}
|
|
2748
|
+
)
|
|
2749
|
+
), type != "Swipeable" ? /* @__PURE__ */ React17.createElement(
|
|
2750
|
+
Drawer,
|
|
2751
|
+
{
|
|
2752
|
+
open: drawerOpen,
|
|
2753
|
+
onClose: type == "Sidecar" ? void 0 : toggleDrawer(false),
|
|
2754
|
+
anchor: anchor != null ? anchor : "left",
|
|
2755
|
+
sx: {
|
|
2756
|
+
"& .MuiDrawer-paper": {
|
|
2757
|
+
width: type == "Sidecar" ? "100%" : width != null ? width : "450px",
|
|
2758
|
+
boxSizing: "border-box",
|
|
2759
|
+
borderRadius: anchor !== "right" ? "0px 4px 4px 0px" : "4px 0px 0px 4px",
|
|
2760
|
+
boxShadow: type == "Sidecar" ? "none !important" : "0px 8px 10px -5px rgba(24, 39, 75, 0.2), 0px 16px 24px 2px rgba(24, 39, 75, 0.14), 0px 6px 30px 5px rgba(24, 39, 75, 0.12)"
|
|
2761
|
+
},
|
|
2762
|
+
"&.MuiDrawer-root": {
|
|
2763
|
+
boxShadow: type == "Sidecar" ? "none !important" : "0px 3px 1px -2px rgba(24, 39, 75, 0.20),0px 2px 2px 0px rgba(24, 39, 75, 0.14),0px 1px 5px 0px rgba(24, 39, 75, 0.12)"
|
|
2764
|
+
}
|
|
2765
|
+
},
|
|
2766
|
+
ModalProps: {
|
|
2767
|
+
keepMounted: true,
|
|
2768
|
+
disablePortal: type == "Sidecar" ? true : false,
|
|
2769
|
+
slotProps: {
|
|
2770
|
+
root: {
|
|
2771
|
+
style: {
|
|
2772
|
+
position: "absolute"
|
|
2773
|
+
}
|
|
2774
|
+
}
|
|
2775
|
+
}
|
|
2776
|
+
},
|
|
2777
|
+
hideBackdrop: true,
|
|
2778
|
+
PaperProps: {
|
|
2779
|
+
sx: {
|
|
2780
|
+
position: "absolute !important",
|
|
2781
|
+
height: "100%",
|
|
2782
|
+
width: 300,
|
|
2783
|
+
right: 0
|
|
2784
|
+
}
|
|
2785
|
+
}
|
|
2786
|
+
},
|
|
2787
|
+
/* @__PURE__ */ React17.createElement(Stack6, { flexDirection: "column", height: "100%" }, /* @__PURE__ */ React17.createElement(
|
|
2788
|
+
DrawerHeader,
|
|
2789
|
+
{
|
|
2790
|
+
title,
|
|
2791
|
+
colorTitle,
|
|
2792
|
+
onClose: handleDrawerClose,
|
|
2793
|
+
filterSideCard,
|
|
2794
|
+
type
|
|
2795
|
+
}
|
|
2796
|
+
), /* @__PURE__ */ React17.createElement(DrawerContent, { arrayElements }), /* @__PURE__ */ React17.createElement(DrawerActions, { actions: drawerActions, anchor }))
|
|
2797
|
+
) : /* @__PURE__ */ React17.createElement(
|
|
2798
|
+
SwipeableDrawer,
|
|
2799
|
+
{
|
|
2800
|
+
open: drawerOpen,
|
|
2801
|
+
onClose: toggleDrawer(false),
|
|
2802
|
+
onOpen: toggleDrawer(true),
|
|
2803
|
+
anchor: "bottom",
|
|
2804
|
+
swipeAreaWidth: drawerBleeding,
|
|
2805
|
+
transitionDuration: { enter: 500, exit: 400 },
|
|
2806
|
+
ModalProps: {
|
|
2807
|
+
BackdropProps: { timeout: 400 }
|
|
2808
|
+
},
|
|
2809
|
+
hysteresis: 0.2,
|
|
2810
|
+
sx: {
|
|
2811
|
+
zIndex: 1400,
|
|
2812
|
+
"& .MuiDrawer-paper": {
|
|
2813
|
+
width: "auto",
|
|
2814
|
+
height: `calc(50% - ${drawerBleeding}px)`,
|
|
2815
|
+
boxSizing: "border-box",
|
|
2816
|
+
borderRadius: "4px 4px 0px 0px"
|
|
2817
|
+
}
|
|
2818
|
+
},
|
|
2819
|
+
slotProps: {
|
|
2820
|
+
backdrop: {
|
|
2821
|
+
sx: { backgroundColor: "#00000038" }
|
|
2822
|
+
}
|
|
2823
|
+
}
|
|
2824
|
+
},
|
|
2825
|
+
/* @__PURE__ */ React17.createElement(
|
|
2826
|
+
Box11,
|
|
2827
|
+
{
|
|
2828
|
+
sx: {
|
|
2829
|
+
width: 30,
|
|
2830
|
+
height: 6,
|
|
2831
|
+
backgroundColor: "#ccc",
|
|
2832
|
+
borderRadius: 3,
|
|
2833
|
+
position: "absolute",
|
|
2834
|
+
top: 8,
|
|
2835
|
+
left: "calc(50% - 15px)"
|
|
2836
|
+
}
|
|
2837
|
+
}
|
|
2838
|
+
),
|
|
2839
|
+
/* @__PURE__ */ React17.createElement(Stack6, { flexDirection: "column", height: "100%" }, /* @__PURE__ */ React17.createElement(
|
|
2840
|
+
DrawerHeader,
|
|
2841
|
+
{
|
|
2842
|
+
title,
|
|
2843
|
+
colorTitle,
|
|
2844
|
+
onClose: handleDrawerClose,
|
|
2845
|
+
type
|
|
2846
|
+
}
|
|
2847
|
+
), /* @__PURE__ */ React17.createElement(DrawerContent, { arrayElements }), /* @__PURE__ */ React17.createElement(
|
|
2848
|
+
Grid6,
|
|
2849
|
+
{
|
|
2850
|
+
sx: { zIndex: 1500 },
|
|
2851
|
+
container: true,
|
|
2852
|
+
gap: 2,
|
|
2853
|
+
padding: "8px 16px 40px 16px",
|
|
2854
|
+
height: "86px",
|
|
2855
|
+
alignItems: "center",
|
|
2856
|
+
flexWrap: "nowrap",
|
|
2857
|
+
justifyContent: Array.isArray(drawerActions) && drawerActions.length > 1 ? "space-between" : "flex-end",
|
|
2858
|
+
flexDirection: "row-reverse"
|
|
2859
|
+
},
|
|
2860
|
+
Array.isArray(drawerActions) && drawerActions.map((btn, index) => /* @__PURE__ */ React17.createElement(
|
|
2861
|
+
Button9,
|
|
2862
|
+
{
|
|
2863
|
+
key: index,
|
|
2864
|
+
variant: index === 0 || drawerActions.length < 2 ? "contained" : "text",
|
|
2865
|
+
color: "primary",
|
|
2866
|
+
onClick: btn.fn,
|
|
2867
|
+
disabled: btn.disabled || false,
|
|
2868
|
+
size: "small",
|
|
2869
|
+
fullWidth: type == "Swipeable" ? true : false
|
|
2870
|
+
},
|
|
2871
|
+
btn.text
|
|
2872
|
+
))
|
|
2873
|
+
))
|
|
2874
|
+
));
|
|
2875
|
+
}
|
|
2876
|
+
|
|
2877
|
+
// src/Components/Adjuntar/mobile/AdjuntarMobile.tsx
|
|
2878
|
+
var AttachmentMobile = ({
|
|
2879
|
+
buttonAttachment,
|
|
2880
|
+
maxSize = 400,
|
|
2881
|
+
fileAccepted = "",
|
|
2882
|
+
initialFiles,
|
|
2883
|
+
deleteAction,
|
|
2884
|
+
downloadAction,
|
|
2885
|
+
onChange,
|
|
2886
|
+
children,
|
|
2887
|
+
sx,
|
|
2888
|
+
view = "button",
|
|
2889
|
+
iconFileItem,
|
|
2890
|
+
onFileClick
|
|
2891
|
+
}) => {
|
|
2892
|
+
const webcamRef = useRef3(null);
|
|
2893
|
+
const [abrirCamara, setAbrirCamara] = useState12(false);
|
|
2894
|
+
const [capturedImage, setCapturedImage] = useState12(null);
|
|
2895
|
+
const [files, setFiles] = useState12([]);
|
|
2896
|
+
const [fileToDelete, setFileToDelete] = useState12(null);
|
|
2897
|
+
const [openDrawerDelete, setOpenDrawerDelete] = useState12(false);
|
|
2898
|
+
const [toast, setToast] = useState12(null);
|
|
2899
|
+
const [open, setOpen] = React18.useState(false);
|
|
2900
|
+
const toggleAttachment = (newOpen) => () => {
|
|
2901
|
+
setOpen(newOpen);
|
|
2902
|
+
};
|
|
2903
|
+
let IconFileItem;
|
|
2904
|
+
if (iconFileItem) {
|
|
2905
|
+
if (Muicon6[iconFileItem] == void 0) {
|
|
2906
|
+
IconFileItem = iconFileItem;
|
|
2907
|
+
} else {
|
|
2908
|
+
IconFileItem = Muicon6[iconFileItem];
|
|
2909
|
+
}
|
|
2910
|
+
}
|
|
2911
|
+
const closeCam = () => {
|
|
2912
|
+
setAbrirCamara(false);
|
|
2913
|
+
};
|
|
2914
|
+
const openCam = () => {
|
|
2915
|
+
setOpen(false);
|
|
2916
|
+
setAbrirCamara(true);
|
|
2917
|
+
};
|
|
2918
|
+
let capturedImage2 = null;
|
|
2919
|
+
const capture = useCallback2((e) => {
|
|
2920
|
+
if (webcamRef.current) {
|
|
2921
|
+
const imageSrc = webcamRef.current.getScreenshot();
|
|
2922
|
+
setCapturedImage(imageSrc);
|
|
2923
|
+
capturedImage2 = imageSrc;
|
|
2924
|
+
setOpen(false);
|
|
2925
|
+
toggleAttachment(false);
|
|
2926
|
+
setAbrirCamara(false);
|
|
2927
|
+
handleUpload(e);
|
|
2928
|
+
}
|
|
2929
|
+
}, [webcamRef, setCapturedImage]);
|
|
2930
|
+
const inputRef = useRef3(null);
|
|
2931
|
+
const handleUpload = (event2) => {
|
|
2932
|
+
var _a;
|
|
2933
|
+
let newFiles = event2.target.files;
|
|
2934
|
+
if (capturedImage || capturedImage2) {
|
|
2935
|
+
const image = capturedImage || capturedImage2;
|
|
2936
|
+
if (!image) return;
|
|
2937
|
+
const arr = image.split(",");
|
|
2938
|
+
const mime = ((_a = arr[0].match(/:(.*?);/)) == null ? void 0 : _a[1]) || "image/jpeg";
|
|
2939
|
+
const bstr = atob(arr[1]);
|
|
2940
|
+
let n = bstr.length;
|
|
2941
|
+
const u8arr = new Uint8Array(n);
|
|
2942
|
+
while (n--) {
|
|
2943
|
+
u8arr[n] = bstr.charCodeAt(n);
|
|
2944
|
+
}
|
|
2945
|
+
const fechaActual = new Date(Date.now());
|
|
2946
|
+
const fechaConFormato = fechaActual.getFullYear() + "" + (fechaActual.getMonth() + 1) + fechaActual.getDate() + fechaActual.getHours() + fechaActual.getMinutes() + fechaActual.getSeconds();
|
|
2947
|
+
const capturedFile = new File([u8arr], `photo_${fechaConFormato}.jpg`, { type: mime });
|
|
2948
|
+
newFiles = [capturedFile];
|
|
2949
|
+
setCapturedImage(null);
|
|
2950
|
+
capturedImage2 = null;
|
|
2951
|
+
}
|
|
2952
|
+
if (!newFiles) return;
|
|
2953
|
+
const nuevosArchivos = [];
|
|
2954
|
+
const archivosValidos = [];
|
|
2955
|
+
Array.from(newFiles).forEach((file) => {
|
|
2956
|
+
const isDuplicateFile = files.some(
|
|
2957
|
+
(existingFile) => existingFile.name === file.name && existingFile.size === file.size
|
|
2958
|
+
);
|
|
2959
|
+
const sizeMB = file.size / (1024 * 1024);
|
|
2960
|
+
if (isDuplicateFile) {
|
|
2961
|
+
setToast({
|
|
2962
|
+
type: "error",
|
|
2963
|
+
title: "Archivo duplicado",
|
|
2964
|
+
listITems: [`El archivo "${file.name}" ya existe.`],
|
|
2965
|
+
seeMore: true,
|
|
2966
|
+
time: 5
|
|
2967
|
+
});
|
|
2968
|
+
return;
|
|
2969
|
+
}
|
|
2970
|
+
if (sizeMB > maxSize) {
|
|
2971
|
+
nuevosArchivos.push({
|
|
2972
|
+
name: file.name,
|
|
2973
|
+
size: file.size,
|
|
2974
|
+
type: file.type,
|
|
2975
|
+
progress: 0,
|
|
2976
|
+
uploadError: true
|
|
2977
|
+
});
|
|
2978
|
+
setToast({
|
|
2979
|
+
type: "error",
|
|
2980
|
+
title: "Carga fallida",
|
|
2981
|
+
seeMore: true,
|
|
2982
|
+
listITems: [`El archivo "${file.name}" supera el l\xEDmite de ${maxSize}MB.`],
|
|
2983
|
+
time: 5
|
|
2984
|
+
});
|
|
2985
|
+
return;
|
|
2986
|
+
}
|
|
2987
|
+
if (fileAccepted && !file.name.match(
|
|
2988
|
+
new RegExp(
|
|
2989
|
+
`(${fileAccepted.replace(/\./g, "\\.").replace(/,/g, "|")})$`,
|
|
2990
|
+
"i"
|
|
2991
|
+
)
|
|
2992
|
+
)) {
|
|
2993
|
+
setToast({
|
|
2994
|
+
type: "error",
|
|
2995
|
+
title: "Tipo de archivo no permitido",
|
|
2996
|
+
listITems: [`El archivo "${file.name}" no es un tipo permitido.`],
|
|
2997
|
+
seeMore: true,
|
|
2998
|
+
time: 5
|
|
2999
|
+
});
|
|
3000
|
+
return;
|
|
3001
|
+
}
|
|
3002
|
+
nuevosArchivos.push({
|
|
3003
|
+
name: file.name,
|
|
3004
|
+
size: file.size,
|
|
3005
|
+
type: file.type,
|
|
3006
|
+
progress: 0,
|
|
3007
|
+
uploadError: false
|
|
3008
|
+
});
|
|
3009
|
+
archivosValidos.push(file);
|
|
3010
|
+
});
|
|
3011
|
+
if (nuevosArchivos.length > 0) {
|
|
3012
|
+
setFiles((prevFiles) => {
|
|
3013
|
+
const updatedFiles = [...prevFiles, ...nuevosArchivos];
|
|
3014
|
+
if (archivosValidos.length > 0) {
|
|
3015
|
+
onChange == null ? void 0 : onChange([
|
|
3016
|
+
...archivosValidos,
|
|
3017
|
+
...prevFiles.map((f) => new File([], f.name, { type: f.type }))
|
|
3018
|
+
]);
|
|
3019
|
+
}
|
|
3020
|
+
return updatedFiles;
|
|
3021
|
+
});
|
|
3022
|
+
}
|
|
3023
|
+
setOpen(false);
|
|
3024
|
+
event2.target.value = "";
|
|
3025
|
+
};
|
|
3026
|
+
const handleDeleteFile = (fileToRemove) => __async(null, null, function* () {
|
|
3027
|
+
try {
|
|
3028
|
+
if (deleteAction) {
|
|
3029
|
+
yield deleteAction(fileToRemove.name);
|
|
3030
|
+
}
|
|
3031
|
+
const updatedFiles = files.filter(
|
|
3032
|
+
(file) => !(file.name === fileToRemove.name && file.size === fileToRemove.size)
|
|
3033
|
+
);
|
|
3034
|
+
setFiles(updatedFiles);
|
|
3035
|
+
if (onChange) {
|
|
3036
|
+
const remainingValidFiles = updatedFiles.filter((f) => !f.uploadError).map((f) => new File([], f.name, { type: f.type }));
|
|
3037
|
+
onChange(remainingValidFiles);
|
|
3038
|
+
}
|
|
3039
|
+
setToast({
|
|
3040
|
+
type: "success",
|
|
3041
|
+
title: "Archivo eliminado",
|
|
3042
|
+
listITems: [`El archivo "${fileToRemove.name}" ha sido eliminado exitosamente.`],
|
|
3043
|
+
seeMore: true,
|
|
3044
|
+
time: 3
|
|
3045
|
+
});
|
|
3046
|
+
} catch (error) {
|
|
3047
|
+
setToast({
|
|
3048
|
+
type: "error",
|
|
3049
|
+
title: "Error al eliminar",
|
|
3050
|
+
listITems: [`No se pudo eliminar el archivo "${fileToRemove.name}".`],
|
|
3051
|
+
seeMore: true,
|
|
3052
|
+
time: 5
|
|
3053
|
+
});
|
|
3054
|
+
}
|
|
3055
|
+
});
|
|
3056
|
+
const deleteFiles = (fileName) => {
|
|
3057
|
+
setFiles((prevFiles) => {
|
|
3058
|
+
const filteredFiles = prevFiles.filter((file) => file.name !== fileName);
|
|
3059
|
+
onChange == null ? void 0 : onChange(
|
|
3060
|
+
filteredFiles.map((f) => new File([], f.name, { type: f.type }))
|
|
3061
|
+
);
|
|
3062
|
+
return filteredFiles;
|
|
3063
|
+
});
|
|
3064
|
+
};
|
|
3065
|
+
const AttachtmentActions = [
|
|
3066
|
+
{ icon: /* @__PURE__ */ React18.createElement(ImageOutlinedIcon, { type: "file", color: "primary" }), color: "primary", label: "Galer\xEDa", onClick: () => {
|
|
3067
|
+
var _a;
|
|
3068
|
+
return (_a = inputRef.current) == null ? void 0 : _a.click();
|
|
3069
|
+
} },
|
|
3070
|
+
{ icon: /* @__PURE__ */ React18.createElement(PhotoCameraOutlined, { type: "file", color: "success" }), color: "success", label: "C\xE1mara", onClick: () => openCam() },
|
|
3071
|
+
{ icon: /* @__PURE__ */ React18.createElement(FolderOpenOutlined, { type: "file", color: "warning" }), color: "warning", label: "Archivos", onClick: () => {
|
|
3072
|
+
var _a;
|
|
3073
|
+
return (_a = inputRef.current) == null ? void 0 : _a.click();
|
|
3074
|
+
} }
|
|
3075
|
+
];
|
|
3076
|
+
useEffect11(() => {
|
|
3077
|
+
if (initialFiles && initialFiles.length > 0) {
|
|
3078
|
+
setFiles(initialFiles);
|
|
3079
|
+
}
|
|
3080
|
+
}, []);
|
|
3081
|
+
return /* @__PURE__ */ React18.createElement(Box12, { display: "flex", flexDirection: "column", gap: 1 }, view == "button" ? /* @__PURE__ */ React18.createElement(Box12, { display: "flex", width: "100%", justifyContent: "space-between", alignItems: "center", sx }, children, /* @__PURE__ */ React18.createElement(
|
|
3082
|
+
AttachmentButton,
|
|
3083
|
+
{
|
|
3084
|
+
buttonAttachment,
|
|
3085
|
+
open,
|
|
3086
|
+
setOpen
|
|
3087
|
+
}
|
|
3088
|
+
)) : "", /* @__PURE__ */ React18.createElement(CssBaseline, null), /* @__PURE__ */ React18.createElement(
|
|
3089
|
+
SwipeableDrawer2,
|
|
3090
|
+
{
|
|
3091
|
+
slotProps: {
|
|
3092
|
+
backdrop: {
|
|
3093
|
+
sx: { backgroundColor: "#00000038" }
|
|
3094
|
+
}
|
|
3095
|
+
},
|
|
3096
|
+
ModalProps: {
|
|
3097
|
+
sx: {
|
|
3098
|
+
zIndex: 1400,
|
|
3099
|
+
"& .MuiPaper-root": {
|
|
3100
|
+
borderRadius: "16px 16px 0 0"
|
|
3101
|
+
}
|
|
3102
|
+
},
|
|
3103
|
+
BackdropProps: { timeout: 400 }
|
|
3104
|
+
},
|
|
3105
|
+
transitionDuration: { enter: 500, exit: 400 },
|
|
3106
|
+
hysteresis: 0.2,
|
|
3107
|
+
anchor: "bottom",
|
|
3108
|
+
swipeAreaWidth: 56,
|
|
3109
|
+
open,
|
|
3110
|
+
onClose: toggleAttachment(false),
|
|
3111
|
+
onOpen: toggleAttachment(true)
|
|
3112
|
+
},
|
|
3113
|
+
toast && /* @__PURE__ */ React18.createElement(SCToastNotification, __spreadValues({}, toast)),
|
|
3114
|
+
/* @__PURE__ */ React18.createElement(Box12, { display: "flex", flexDirection: "column", alignItems: "center", p: 2, gap: 2 }, /* @__PURE__ */ React18.createElement(Box12, { display: "flex", width: "100%", justifyContent: "space-between", alignItems: "center", gap: 1, p: 1 }, /* @__PURE__ */ React18.createElement(Typography9, { variant: "h6", color: "text.primary" }, "Agrega adjuntos"), /* @__PURE__ */ React18.createElement(IconButton9, { size: "medium", onClick: toggleAttachment(false) }, /* @__PURE__ */ React18.createElement(CloseOutlined, { color: "action" }))), /* @__PURE__ */ React18.createElement(
|
|
3115
|
+
"input",
|
|
3116
|
+
{
|
|
3117
|
+
type: "file",
|
|
3118
|
+
multiple: true,
|
|
3119
|
+
hidden: true,
|
|
3120
|
+
ref: inputRef,
|
|
3121
|
+
onChange: handleUpload
|
|
3122
|
+
}
|
|
3123
|
+
), /* @__PURE__ */ React18.createElement(Box12, { display: "flex", justifyContent: "space-around", alignItems: "center", width: "100%", gap: 2, sx: { padding: "0px 0px 52px 0px !important" } }, AttachtmentActions.map((option, index) => /* @__PURE__ */ React18.createElement(
|
|
3124
|
+
Box12,
|
|
3125
|
+
{
|
|
3126
|
+
display: "flex",
|
|
3127
|
+
flexDirection: "column",
|
|
3128
|
+
alignItems: "center",
|
|
3129
|
+
width: "100%",
|
|
3130
|
+
height: 80,
|
|
3131
|
+
borderRadius: 1,
|
|
3132
|
+
bgcolor: "grey.50",
|
|
3133
|
+
border: "1px solid",
|
|
3134
|
+
borderColor: "grey.100",
|
|
3135
|
+
justifyContent: "center",
|
|
3136
|
+
p: 1,
|
|
3137
|
+
gap: 0.5,
|
|
3138
|
+
onClick: option.onClick,
|
|
3139
|
+
sx: {
|
|
3140
|
+
cursor: "pointer"
|
|
3141
|
+
}
|
|
3142
|
+
},
|
|
3143
|
+
/* @__PURE__ */ React18.createElement(
|
|
3144
|
+
IconButton9,
|
|
3145
|
+
{
|
|
3146
|
+
sx: {
|
|
3147
|
+
bgcolor: getAttachmentColor(option.color)
|
|
3148
|
+
},
|
|
3149
|
+
size: "large"
|
|
3150
|
+
},
|
|
3151
|
+
option.icon
|
|
3152
|
+
),
|
|
3153
|
+
/* @__PURE__ */ React18.createElement(Typography9, { variant: "body2", color: "text.secondary" }, option.label)
|
|
3154
|
+
))))
|
|
3155
|
+
), abrirCamara && /* @__PURE__ */ React18.createElement(React18.Fragment, null, /* @__PURE__ */ React18.createElement(CancelOutlinedIcon, { onClick: closeCam, sx: { borderRadius: "50px", height: "35px", width: "35px", zIndex: 1700, background: "white", position: "absolute", left: `calc(100% - 50px)`, bottom: `calc(100% - 50px)` } }), /* @__PURE__ */ React18.createElement(Stack7, { className: "camras" }, /* @__PURE__ */ React18.createElement(
|
|
3156
|
+
Webcam,
|
|
3157
|
+
{
|
|
3158
|
+
audio: false,
|
|
3159
|
+
ref: webcamRef,
|
|
3160
|
+
width: "100%",
|
|
3161
|
+
height: "100%",
|
|
3162
|
+
screenshotFormat: "image/jpeg",
|
|
3163
|
+
videoConstraints: {
|
|
3164
|
+
//facingMode: { exact: "environment" }
|
|
3165
|
+
facingMode: "environment"
|
|
3166
|
+
//facingMode: "environment" // cámara trasera
|
|
3167
|
+
},
|
|
3168
|
+
style: {
|
|
3169
|
+
position: "fixed",
|
|
3170
|
+
// Fijo para cubrir toda la ventana
|
|
3171
|
+
top: 0,
|
|
3172
|
+
left: 0,
|
|
3173
|
+
objectFit: "cover",
|
|
3174
|
+
backgroundColor: "black",
|
|
3175
|
+
zIndex: 1600
|
|
3176
|
+
// Encima de todo
|
|
3177
|
+
}
|
|
3178
|
+
}
|
|
3179
|
+
), /* @__PURE__ */ React18.createElement(
|
|
3180
|
+
PhotoCameraIcon,
|
|
3181
|
+
{
|
|
3182
|
+
onClick: capture,
|
|
3183
|
+
sx: {
|
|
3184
|
+
height: "45px",
|
|
3185
|
+
width: "45px",
|
|
3186
|
+
padding: "6px",
|
|
3187
|
+
backgroundColor: "white",
|
|
3188
|
+
color: "#1E62A1",
|
|
3189
|
+
borderRadius: "50px",
|
|
3190
|
+
zIndex: 1700,
|
|
3191
|
+
position: "absolute",
|
|
3192
|
+
bottom: "10px",
|
|
3193
|
+
left: "50%"
|
|
3175
3194
|
},
|
|
3176
|
-
|
|
3177
|
-
|
|
3178
|
-
|
|
3179
|
-
|
|
3180
|
-
|
|
3181
|
-
// src/Components/Drawer/components/DrawerActions.tsx
|
|
3182
|
-
import React18 from "react";
|
|
3183
|
-
import { Button as Button8 } from "@mui/material";
|
|
3184
|
-
import Grid4 from "@mui/material/Grid";
|
|
3185
|
-
var DrawerActions = ({ actions, anchor }) => {
|
|
3186
|
-
if (actions === false || actions === void 0) {
|
|
3187
|
-
return null;
|
|
3188
|
-
}
|
|
3189
|
-
if (!Array.isArray(actions) || actions.length === 0) {
|
|
3190
|
-
return null;
|
|
3191
|
-
}
|
|
3192
|
-
return /* @__PURE__ */ React18.createElement(
|
|
3193
|
-
Grid4,
|
|
3195
|
+
fontSize: "medium"
|
|
3196
|
+
}
|
|
3197
|
+
))), files.length > 0 && /* @__PURE__ */ React18.createElement(
|
|
3198
|
+
Stack7,
|
|
3194
3199
|
{
|
|
3195
|
-
|
|
3196
|
-
|
|
3197
|
-
|
|
3198
|
-
|
|
3199
|
-
|
|
3200
|
-
|
|
3201
|
-
|
|
3202
|
-
|
|
3203
|
-
|
|
3200
|
+
"data-testid": "ContenedorArchivosAdjuntos",
|
|
3201
|
+
id: "ContenedorArchivosAdjuntos",
|
|
3202
|
+
width: "100%",
|
|
3203
|
+
sx: __spreadValues({
|
|
3204
|
+
overflowY: "auto"
|
|
3205
|
+
}, files.length > 5 && {
|
|
3206
|
+
maxHeight: 250
|
|
3207
|
+
}),
|
|
3208
|
+
spacing: 1
|
|
3204
3209
|
},
|
|
3205
|
-
|
|
3206
|
-
|
|
3210
|
+
files.map((file) => /* @__PURE__ */ React18.createElement(
|
|
3211
|
+
Stack7,
|
|
3207
3212
|
{
|
|
3208
|
-
|
|
3209
|
-
|
|
3210
|
-
|
|
3211
|
-
|
|
3212
|
-
|
|
3213
|
-
|
|
3214
|
-
|
|
3213
|
+
height: 46,
|
|
3214
|
+
key: file.name + (file.uploadError ? "_error" : ""),
|
|
3215
|
+
direction: "row",
|
|
3216
|
+
alignItems: "center",
|
|
3217
|
+
justifyContent: "space-between",
|
|
3218
|
+
gap: 2,
|
|
3219
|
+
padding: 1,
|
|
3220
|
+
borderRadius: 1,
|
|
3221
|
+
sx: {
|
|
3222
|
+
backgroundColor: file.uploadError ? "error.50" : "transparent",
|
|
3223
|
+
":hover": {
|
|
3224
|
+
backgroundColor: file.uploadError ? "error.100" : "primary.50"
|
|
3225
|
+
}
|
|
3226
|
+
}
|
|
3215
3227
|
},
|
|
3216
|
-
|
|
3228
|
+
/* @__PURE__ */ React18.createElement(
|
|
3229
|
+
Stack7,
|
|
3230
|
+
{
|
|
3231
|
+
direction: "row",
|
|
3232
|
+
alignItems: "center",
|
|
3233
|
+
gap: 1,
|
|
3234
|
+
width: "100%",
|
|
3235
|
+
onClick: () => onFileClick == null ? void 0 : onFileClick(file),
|
|
3236
|
+
sx: { cursor: onFileClick ? "pointer" : "default" }
|
|
3237
|
+
},
|
|
3238
|
+
iconFileItem ? /* @__PURE__ */ React18.createElement(SvgIcon6, { color: file.uploadError ? "error" : "primary", fontSize: "small", component: IconFileItem }) : /* @__PURE__ */ React18.createElement(
|
|
3239
|
+
UploadFileOutlined2,
|
|
3240
|
+
{
|
|
3241
|
+
color: file.uploadError ? "error" : "primary",
|
|
3242
|
+
fontSize: "small"
|
|
3243
|
+
}
|
|
3244
|
+
),
|
|
3245
|
+
/* @__PURE__ */ React18.createElement(Stack7, { width: "100%" }, /* @__PURE__ */ React18.createElement(
|
|
3246
|
+
Typography9,
|
|
3247
|
+
{
|
|
3248
|
+
variant: "body2",
|
|
3249
|
+
color: "text.primary",
|
|
3250
|
+
whiteSpace: "nowrap",
|
|
3251
|
+
overflow: "hidden",
|
|
3252
|
+
textOverflow: "ellipsis",
|
|
3253
|
+
maxWidth: "310px"
|
|
3254
|
+
},
|
|
3255
|
+
file.name
|
|
3256
|
+
), /* @__PURE__ */ React18.createElement(
|
|
3257
|
+
Typography9,
|
|
3258
|
+
{
|
|
3259
|
+
variant: "caption",
|
|
3260
|
+
color: file.uploadError ? "error" : "text.secondary"
|
|
3261
|
+
},
|
|
3262
|
+
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}`
|
|
3263
|
+
))
|
|
3264
|
+
),
|
|
3265
|
+
view == "file" ? /* @__PURE__ */ React18.createElement(Tooltip4, { title: "Descargar" }, /* @__PURE__ */ React18.createElement(
|
|
3266
|
+
IconButton9,
|
|
3267
|
+
{
|
|
3268
|
+
size: "small",
|
|
3269
|
+
onClick: () => downloadAction == null ? void 0 : downloadAction(file),
|
|
3270
|
+
disabled: file.uploadError,
|
|
3271
|
+
"aria-label": `Descargar ${file.name}`
|
|
3272
|
+
},
|
|
3273
|
+
/* @__PURE__ */ React18.createElement(FileDownloadOutlinedIcon, { fontSize: "small", color: "action" })
|
|
3274
|
+
)) : "",
|
|
3275
|
+
view == "button" ? /* @__PURE__ */ React18.createElement(Tooltip4, { title: "Eliminar" }, /* @__PURE__ */ React18.createElement(
|
|
3276
|
+
IconButton9,
|
|
3277
|
+
{
|
|
3278
|
+
size: "small",
|
|
3279
|
+
onClick: () => {
|
|
3280
|
+
setFileToDelete(file);
|
|
3281
|
+
setOpenDrawerDelete(true);
|
|
3282
|
+
},
|
|
3283
|
+
"aria-label": `Eliminar ${file.name}`
|
|
3284
|
+
},
|
|
3285
|
+
/* @__PURE__ */ React18.createElement(DeleteOutline2, { fontSize: "small", color: "action" })
|
|
3286
|
+
)) : ""
|
|
3217
3287
|
))
|
|
3218
|
-
)
|
|
3219
|
-
|
|
3220
|
-
|
|
3221
|
-
// src/Components/Drawer/components/DrawerHeader.tsx
|
|
3222
|
-
import React19 from "react";
|
|
3223
|
-
import { Typography as Typography11, IconButton as IconButton10 } from "@mui/material";
|
|
3224
|
-
import Grid5 from "@mui/material/Grid";
|
|
3225
|
-
import CloseIcon from "@mui/icons-material/Close";
|
|
3226
|
-
var DrawerHeader = ({
|
|
3227
|
-
title,
|
|
3228
|
-
colorTitle,
|
|
3229
|
-
onClose,
|
|
3230
|
-
anchor,
|
|
3231
|
-
filterSideCard
|
|
3232
|
-
}) => {
|
|
3233
|
-
return /* @__PURE__ */ React19.createElement(
|
|
3234
|
-
Grid5,
|
|
3288
|
+
), openDrawerDelete && /* @__PURE__ */ React18.createElement(
|
|
3289
|
+
SCDrawer,
|
|
3235
3290
|
{
|
|
3236
|
-
|
|
3237
|
-
|
|
3238
|
-
|
|
3239
|
-
|
|
3240
|
-
|
|
3241
|
-
|
|
3242
|
-
|
|
3243
|
-
|
|
3244
|
-
|
|
3245
|
-
|
|
3246
|
-
|
|
3247
|
-
|
|
3248
|
-
|
|
3249
|
-
|
|
3250
|
-
|
|
3291
|
+
open: openDrawerDelete,
|
|
3292
|
+
setOpen: setOpenDrawerDelete,
|
|
3293
|
+
title: "\xBFEliminar adjunto?",
|
|
3294
|
+
type: "Swipeable",
|
|
3295
|
+
heightDrawer: 150,
|
|
3296
|
+
arrayElements: [
|
|
3297
|
+
{
|
|
3298
|
+
component: /* @__PURE__ */ React18.createElement(Typography9, null, "Esta seguro de eliminar el adjunto ", /* @__PURE__ */ React18.createElement("strong", null, '"', fileToDelete == null ? void 0 : fileToDelete.name, '"'), " ")
|
|
3299
|
+
}
|
|
3300
|
+
],
|
|
3301
|
+
actions: [
|
|
3302
|
+
{
|
|
3303
|
+
text: "Eliminar",
|
|
3304
|
+
fn: () => __async(null, null, function* () {
|
|
3305
|
+
if (fileToDelete) {
|
|
3306
|
+
try {
|
|
3307
|
+
if (deleteAction) {
|
|
3308
|
+
yield deleteAction(fileToDelete.name);
|
|
3309
|
+
}
|
|
3310
|
+
deleteFiles(fileToDelete.name);
|
|
3311
|
+
setToast({
|
|
3312
|
+
title: "Archivo eliminado",
|
|
3313
|
+
type: "success",
|
|
3314
|
+
listITems: [`El archivo "${fileToDelete.name}" fue eliminado exitosamente.`],
|
|
3315
|
+
time: 3
|
|
3316
|
+
});
|
|
3317
|
+
} catch (error) {
|
|
3318
|
+
setToast({
|
|
3319
|
+
title: "Error al eliminar archivo",
|
|
3320
|
+
type: "error",
|
|
3321
|
+
listITems: [`No se pudo eliminar el archivo "${fileToDelete.name}".`],
|
|
3322
|
+
time: 5
|
|
3323
|
+
});
|
|
3324
|
+
} finally {
|
|
3325
|
+
setFileToDelete(null);
|
|
3326
|
+
setOpenDrawerDelete(false);
|
|
3327
|
+
}
|
|
3328
|
+
}
|
|
3329
|
+
})
|
|
3330
|
+
},
|
|
3331
|
+
{ text: "Cancelar", fn: () => setOpenDrawerDelete(false) }
|
|
3332
|
+
]
|
|
3333
|
+
}
|
|
3334
|
+
));
|
|
3251
3335
|
};
|
|
3252
3336
|
|
|
3253
|
-
// src/Components/
|
|
3254
|
-
|
|
3255
|
-
|
|
3256
|
-
|
|
3257
|
-
|
|
3258
|
-
|
|
3259
|
-
|
|
3260
|
-
|
|
3261
|
-
|
|
3262
|
-
|
|
3263
|
-
|
|
3264
|
-
|
|
3265
|
-
|
|
3266
|
-
|
|
3267
|
-
|
|
3268
|
-
|
|
3269
|
-
})
|
|
3270
|
-
|
|
3271
|
-
|
|
3272
|
-
|
|
3273
|
-
|
|
3274
|
-
|
|
3275
|
-
|
|
3276
|
-
|
|
3277
|
-
|
|
3278
|
-
|
|
3279
|
-
|
|
3280
|
-
|
|
3281
|
-
const handleInputValidation = () => {
|
|
3282
|
-
if (chipFilters == null ? void 0 : chipFilters.length) {
|
|
3283
|
-
processChipFilters();
|
|
3284
|
-
} else {
|
|
3285
|
-
processChipFilters();
|
|
3286
|
-
validateInputs(
|
|
3287
|
-
arrayElements,
|
|
3288
|
-
setToastWithDelay,
|
|
3289
|
-
handleDrawerClose,
|
|
3290
|
-
setChipFilters,
|
|
3291
|
-
setTextFilters
|
|
3292
|
-
);
|
|
3293
|
-
}
|
|
3337
|
+
// src/Components/Calendario/Calendar.tsx
|
|
3338
|
+
import React31, { useEffect as useEffect12, useState as useState15 } from "react";
|
|
3339
|
+
import { Box as Box19, CircularProgress as CircularProgress5 } from "@mui/material";
|
|
3340
|
+
|
|
3341
|
+
// src/Components/Calendario/CalendarToolbar.tsx
|
|
3342
|
+
import React19, { useState as useState13 } from "react";
|
|
3343
|
+
import { ChevronLeft, ChevronRight, KeyboardArrowDown as KeyboardArrowDown2, EventOutlined } from "@mui/icons-material";
|
|
3344
|
+
import { Box as Box13, Chip as Chip5, IconButton as IconButton10, Menu, MenuItem as MenuItem3, Stack as Stack8, Typography as Typography10 } from "@mui/material";
|
|
3345
|
+
import dayjs2 from "dayjs";
|
|
3346
|
+
import updateLocale from "dayjs/plugin/updateLocale";
|
|
3347
|
+
import "dayjs/locale/es";
|
|
3348
|
+
dayjs2.locale("es");
|
|
3349
|
+
dayjs2.extend(updateLocale);
|
|
3350
|
+
dayjs2.updateLocale("en", {
|
|
3351
|
+
weekStart: 0
|
|
3352
|
+
// 0 = domingo
|
|
3353
|
+
});
|
|
3354
|
+
var CalendarToolbar = ({
|
|
3355
|
+
labelDate,
|
|
3356
|
+
view,
|
|
3357
|
+
onView,
|
|
3358
|
+
onNavigate,
|
|
3359
|
+
children
|
|
3360
|
+
}) => {
|
|
3361
|
+
const [anchorEl, setAnchorEl] = useState13(null);
|
|
3362
|
+
const open = Boolean(anchorEl);
|
|
3363
|
+
const handleMenuOpen = (event2) => {
|
|
3364
|
+
setAnchorEl(event2.currentTarget);
|
|
3294
3365
|
};
|
|
3295
|
-
const
|
|
3296
|
-
|
|
3366
|
+
const handleMenuClose = () => {
|
|
3367
|
+
setAnchorEl(null);
|
|
3297
3368
|
};
|
|
3298
|
-
const
|
|
3299
|
-
|
|
3300
|
-
|
|
3369
|
+
const handleViewChange = (newView) => {
|
|
3370
|
+
onView(newView);
|
|
3371
|
+
handleMenuClose();
|
|
3301
3372
|
};
|
|
3302
|
-
const
|
|
3303
|
-
|
|
3304
|
-
if (
|
|
3305
|
-
|
|
3306
|
-
|
|
3307
|
-
|
|
3308
|
-
|
|
3373
|
+
const getFormattedDate = () => {
|
|
3374
|
+
const sunday = labelDate.day(0);
|
|
3375
|
+
if (view === "month") {
|
|
3376
|
+
const textMonth = labelDate.format("MMMM YYYY");
|
|
3377
|
+
return textMonth.charAt(0).toUpperCase() + textMonth.slice(1);
|
|
3378
|
+
}
|
|
3379
|
+
if (view === "week") {
|
|
3380
|
+
return `${labelDate.startOf("week").format("DD MMM")} - ${labelDate.endOf("week").format("DD MMM YYYY")}`;
|
|
3381
|
+
}
|
|
3382
|
+
return labelDate.format(" DD MMMM YYYY");
|
|
3309
3383
|
};
|
|
3310
|
-
|
|
3311
|
-
|
|
3312
|
-
Grid6,
|
|
3384
|
+
return /* @__PURE__ */ React19.createElement(Stack8, { direction: "row", alignItems: "center", justifyContent: "space-between", gap: 1.5, sx: { paddingBottom: "16px" } }, /* @__PURE__ */ React19.createElement(Stack8, { direction: "row", alignItems: "center", justifyContent: "flex-start", gap: 1.5 }, /* @__PURE__ */ React19.createElement(Box13, null, /* @__PURE__ */ React19.createElement(
|
|
3385
|
+
Chip5,
|
|
3313
3386
|
{
|
|
3314
|
-
|
|
3315
|
-
|
|
3316
|
-
|
|
3317
|
-
|
|
3318
|
-
|
|
3319
|
-
|
|
3320
|
-
|
|
3321
|
-
|
|
3322
|
-
|
|
3323
|
-
textFilters,
|
|
3324
|
-
onDeleteFilter: handleDeleteFilter
|
|
3325
|
-
}
|
|
3326
|
-
),
|
|
3327
|
-
buttonDrawer && /* @__PURE__ */ React20.createElement(
|
|
3328
|
-
DrawerButton,
|
|
3329
|
-
{
|
|
3330
|
-
buttonDrawer,
|
|
3331
|
-
onToggle: toggleDrawer(true)
|
|
3332
|
-
}
|
|
3333
|
-
)
|
|
3334
|
-
), type != "Swipeable" ? /* @__PURE__ */ React20.createElement(
|
|
3335
|
-
Drawer,
|
|
3387
|
+
size: "medium",
|
|
3388
|
+
label: "Hoy",
|
|
3389
|
+
icon: /* @__PURE__ */ React19.createElement(EventOutlined, { fontSize: "small" }),
|
|
3390
|
+
color: "primary",
|
|
3391
|
+
onClick: () => onNavigate("TODAY"),
|
|
3392
|
+
variant: "standard"
|
|
3393
|
+
}
|
|
3394
|
+
)), /* @__PURE__ */ React19.createElement(Stack8, { direction: "row", alignItems: "center", gap: 1 }, /* @__PURE__ */ React19.createElement(IconButton10, { "aria-label": "Anterior", onClick: () => onNavigate("PREV"), size: "small", color: "primary" }, /* @__PURE__ */ React19.createElement(ChevronLeft, { fontSize: "small" })), /* @__PURE__ */ React19.createElement(IconButton10, { "aria-label": "Siguiente", onClick: () => onNavigate("NEXT"), size: "small", color: "primary" }, /* @__PURE__ */ React19.createElement(ChevronRight, { fontSize: "small" })), /* @__PURE__ */ React19.createElement(Typography10, { variant: "h6", color: "primary", "data-testid": "currentDate" }, getFormattedDate()), /* @__PURE__ */ React19.createElement(IconButton10, { onClick: handleMenuOpen, size: "small", color: "primary", "aria-label": "Cambiar vista" }, /* @__PURE__ */ React19.createElement(KeyboardArrowDown2, { fontSize: "small" })), /* @__PURE__ */ React19.createElement(
|
|
3395
|
+
Menu,
|
|
3336
3396
|
{
|
|
3337
|
-
|
|
3338
|
-
|
|
3339
|
-
|
|
3340
|
-
|
|
3341
|
-
|
|
3342
|
-
width: type == "Sidecar" ? "100%" : width != null ? width : "450px",
|
|
3343
|
-
boxSizing: "border-box",
|
|
3344
|
-
borderRadius: anchor !== "right" ? "0px 4px 4px 0px" : "4px 0px 0px 4px",
|
|
3345
|
-
boxShadow: type == "Sidecar" ? "none !important" : "0px 8px 10px -5px rgba(24, 39, 75, 0.2), 0px 16px 24px 2px rgba(24, 39, 75, 0.14), 0px 6px 30px 5px rgba(24, 39, 75, 0.12)"
|
|
3346
|
-
},
|
|
3347
|
-
"&.MuiDrawer-root": {
|
|
3348
|
-
boxShadow: type == "Sidecar" ? "none !important" : "0px 3px 1px -2px rgba(24, 39, 75, 0.20),0px 2px 2px 0px rgba(24, 39, 75, 0.14),0px 1px 5px 0px rgba(24, 39, 75, 0.12)"
|
|
3349
|
-
}
|
|
3350
|
-
},
|
|
3351
|
-
ModalProps: {
|
|
3352
|
-
keepMounted: true,
|
|
3353
|
-
disablePortal: type == "Sidecar" ? true : false,
|
|
3354
|
-
slotProps: {
|
|
3355
|
-
root: {
|
|
3356
|
-
style: {
|
|
3357
|
-
position: "absolute"
|
|
3358
|
-
}
|
|
3359
|
-
}
|
|
3360
|
-
}
|
|
3361
|
-
},
|
|
3362
|
-
hideBackdrop: true,
|
|
3363
|
-
PaperProps: {
|
|
3364
|
-
sx: {
|
|
3365
|
-
position: "absolute !important",
|
|
3366
|
-
height: "100%",
|
|
3367
|
-
width: 300,
|
|
3368
|
-
right: 0
|
|
3369
|
-
}
|
|
3370
|
-
}
|
|
3397
|
+
anchorEl,
|
|
3398
|
+
open,
|
|
3399
|
+
onClose: handleMenuClose,
|
|
3400
|
+
anchorOrigin: { vertical: "bottom", horizontal: "center" },
|
|
3401
|
+
transformOrigin: { vertical: "top", horizontal: "center" }
|
|
3371
3402
|
},
|
|
3372
|
-
/* @__PURE__ */
|
|
3373
|
-
|
|
3374
|
-
|
|
3375
|
-
|
|
3376
|
-
|
|
3377
|
-
|
|
3378
|
-
|
|
3379
|
-
|
|
3380
|
-
|
|
3381
|
-
|
|
3382
|
-
|
|
3383
|
-
|
|
3403
|
+
/* @__PURE__ */ React19.createElement(MenuItem3, { onClick: () => handleViewChange("month") }, "Mes"),
|
|
3404
|
+
/* @__PURE__ */ React19.createElement(MenuItem3, { onClick: () => handleViewChange("week") }, "Semana"),
|
|
3405
|
+
/* @__PURE__ */ React19.createElement(MenuItem3, { onClick: () => handleViewChange("day") }, "D\xEDa")
|
|
3406
|
+
))), children ? /* @__PURE__ */ React19.createElement(Box13, null, children) : /* @__PURE__ */ React19.createElement(Box13, { width: "24px" }), " ");
|
|
3407
|
+
};
|
|
3408
|
+
|
|
3409
|
+
// src/Components/Calendario/Views/MonthView.tsx
|
|
3410
|
+
import React28 from "react";
|
|
3411
|
+
import { Box as Box16, Typography as Typography14, IconButton as IconButton11, Paper as Paper2, Tooltip as Tooltip6, Stack as Stack11, CircularProgress as CircularProgress2, Button as Button11 } from "@mui/material";
|
|
3412
|
+
import AddIcon from "@mui/icons-material/Add";
|
|
3413
|
+
import dayjs5 from "dayjs";
|
|
3414
|
+
import localeData from "dayjs/plugin/localeData";
|
|
3415
|
+
|
|
3416
|
+
// src/Components/Calendario/Utils.tsx
|
|
3417
|
+
import dayjs3 from "dayjs";
|
|
3418
|
+
function getMonthDays(date) {
|
|
3419
|
+
const start = date.startOf("month").day(0);
|
|
3420
|
+
const end = date.endOf("month").day(6);
|
|
3421
|
+
const days = [];
|
|
3422
|
+
let current = start;
|
|
3423
|
+
while (current.isBefore(end) || current.isSame(end, "day")) {
|
|
3424
|
+
days.push(current);
|
|
3425
|
+
current = current.add(1, "day");
|
|
3426
|
+
}
|
|
3427
|
+
return days;
|
|
3428
|
+
}
|
|
3429
|
+
var isToday = (date) => {
|
|
3430
|
+
return date.isSame(dayjs3(), "day");
|
|
3431
|
+
};
|
|
3432
|
+
var stateColors = {
|
|
3433
|
+
Asignada: "warning.200",
|
|
3434
|
+
Generada: "default.main",
|
|
3435
|
+
EnProgreso: "primary.200",
|
|
3436
|
+
Aplazada: "secondary.A400",
|
|
3437
|
+
Vencida: "error.200",
|
|
3438
|
+
Finalizada: "success.200"
|
|
3439
|
+
//#FCE4C0
|
|
3440
|
+
};
|
|
3441
|
+
|
|
3442
|
+
// src/Components/Calendario/Event.tsx
|
|
3443
|
+
import React20 from "react";
|
|
3444
|
+
import { Box as Box14, Stack as Stack9, Typography as Typography11, Divider as Divider4, Popover as Popover3 } from "@mui/material";
|
|
3445
|
+
var CalendarEventCard = ({ event: event2, color, sx, onClick, onHover }) => {
|
|
3446
|
+
const [anchorEl, setAnchorEl] = React20.useState(null);
|
|
3447
|
+
const handlePopoverOpen = (event3) => {
|
|
3448
|
+
setAnchorEl(event3.currentTarget);
|
|
3449
|
+
};
|
|
3450
|
+
const handlePopoverClose = () => {
|
|
3451
|
+
setAnchorEl(null);
|
|
3452
|
+
};
|
|
3453
|
+
const open = Boolean(anchorEl);
|
|
3454
|
+
return /* @__PURE__ */ React20.createElement(
|
|
3455
|
+
Stack9,
|
|
3384
3456
|
{
|
|
3385
|
-
|
|
3386
|
-
|
|
3387
|
-
|
|
3388
|
-
|
|
3389
|
-
|
|
3390
|
-
|
|
3391
|
-
|
|
3392
|
-
|
|
3393
|
-
|
|
3394
|
-
hysteresis: 0.2,
|
|
3395
|
-
sx: {
|
|
3396
|
-
zIndex: 1400,
|
|
3397
|
-
"& .MuiDrawer-paper": {
|
|
3398
|
-
width: "auto",
|
|
3399
|
-
height: `calc(50% - ${drawerBleeding}px)`,
|
|
3400
|
-
boxSizing: "border-box",
|
|
3401
|
-
borderRadius: "4px 4px 0px 0px"
|
|
3402
|
-
}
|
|
3457
|
+
direction: "row",
|
|
3458
|
+
padding: 0.5,
|
|
3459
|
+
borderRadius: 0.5,
|
|
3460
|
+
alignItems: "flex-start",
|
|
3461
|
+
minHeight: "20px",
|
|
3462
|
+
onMouseOver: () => onHover == null ? void 0 : onHover(event2),
|
|
3463
|
+
onClick: (e) => {
|
|
3464
|
+
e.stopPropagation();
|
|
3465
|
+
onClick == null ? void 0 : onClick(event2);
|
|
3403
3466
|
},
|
|
3404
|
-
|
|
3405
|
-
|
|
3406
|
-
|
|
3407
|
-
|
|
3408
|
-
|
|
3467
|
+
sx: (theme) => __spreadValues({
|
|
3468
|
+
backgroundColor: theme.palette.common.white,
|
|
3469
|
+
boxShadow: theme.shadows[2],
|
|
3470
|
+
color: theme.palette.text.secondary,
|
|
3471
|
+
overflow: "hidden",
|
|
3472
|
+
cursor: onClick ? "pointer" : "default"
|
|
3473
|
+
}, sx)
|
|
3409
3474
|
},
|
|
3410
3475
|
/* @__PURE__ */ React20.createElement(
|
|
3411
|
-
|
|
3476
|
+
Divider4,
|
|
3412
3477
|
{
|
|
3478
|
+
orientation: "vertical",
|
|
3479
|
+
flexItem: true,
|
|
3413
3480
|
sx: {
|
|
3414
|
-
width:
|
|
3415
|
-
|
|
3416
|
-
|
|
3417
|
-
borderRadius: 3,
|
|
3418
|
-
position: "absolute",
|
|
3419
|
-
top: 8,
|
|
3420
|
-
left: "calc(50% - 15px)"
|
|
3481
|
+
width: "2px",
|
|
3482
|
+
backgroundColor: color != null ? color : "primary.main",
|
|
3483
|
+
borderRadius: "2px"
|
|
3421
3484
|
}
|
|
3422
3485
|
}
|
|
3423
3486
|
),
|
|
3424
|
-
/* @__PURE__ */ React20.createElement(
|
|
3425
|
-
|
|
3426
|
-
{
|
|
3427
|
-
title,
|
|
3428
|
-
colorTitle,
|
|
3429
|
-
onClose: handleDrawerClose,
|
|
3430
|
-
anchor
|
|
3431
|
-
}
|
|
3432
|
-
), /* @__PURE__ */ React20.createElement(DrawerContent, { arrayElements }), /* @__PURE__ */ React20.createElement(
|
|
3433
|
-
Grid6,
|
|
3487
|
+
/* @__PURE__ */ React20.createElement(
|
|
3488
|
+
Box14,
|
|
3434
3489
|
{
|
|
3435
|
-
|
|
3436
|
-
|
|
3437
|
-
|
|
3438
|
-
|
|
3439
|
-
|
|
3440
|
-
alignItems: "center"
|
|
3441
|
-
flexWrap: "nowrap",
|
|
3442
|
-
justifyContent: Array.isArray(drawerActions) && drawerActions.length > 1 ? "space-between" : "flex-end",
|
|
3443
|
-
flexDirection: "row-reverse"
|
|
3490
|
+
px: 1,
|
|
3491
|
+
py: 0.5,
|
|
3492
|
+
flex: "1",
|
|
3493
|
+
minWidth: 0,
|
|
3494
|
+
display: "flex",
|
|
3495
|
+
alignItems: "center"
|
|
3444
3496
|
},
|
|
3445
|
-
|
|
3446
|
-
|
|
3497
|
+
/* @__PURE__ */ React20.createElement(
|
|
3498
|
+
Typography11,
|
|
3447
3499
|
{
|
|
3448
|
-
|
|
3449
|
-
variant:
|
|
3450
|
-
|
|
3451
|
-
|
|
3452
|
-
|
|
3453
|
-
|
|
3454
|
-
|
|
3500
|
+
color: "text.primary",
|
|
3501
|
+
variant: "caption",
|
|
3502
|
+
noWrap: true,
|
|
3503
|
+
sx: {
|
|
3504
|
+
overflow: "hidden",
|
|
3505
|
+
textOverflow: "ellipsis",
|
|
3506
|
+
whiteSpace: "nowrap"
|
|
3507
|
+
},
|
|
3508
|
+
onMouseEnter: handlePopoverOpen,
|
|
3509
|
+
onMouseLeave: handlePopoverClose
|
|
3455
3510
|
},
|
|
3456
|
-
|
|
3457
|
-
)
|
|
3458
|
-
|
|
3459
|
-
|
|
3460
|
-
|
|
3511
|
+
event2.title.charAt(0).toUpperCase() + event2.title.slice(1).toLowerCase()
|
|
3512
|
+
),
|
|
3513
|
+
/* @__PURE__ */ React20.createElement(
|
|
3514
|
+
Popover3,
|
|
3515
|
+
{
|
|
3516
|
+
id: "mouse-over-popover",
|
|
3517
|
+
sx: { pointerEvents: "none" },
|
|
3518
|
+
open,
|
|
3519
|
+
anchorEl,
|
|
3520
|
+
anchorOrigin: {
|
|
3521
|
+
vertical: "top",
|
|
3522
|
+
horizontal: "right"
|
|
3523
|
+
},
|
|
3524
|
+
transformOrigin: {
|
|
3525
|
+
vertical: "bottom",
|
|
3526
|
+
horizontal: "right"
|
|
3527
|
+
},
|
|
3528
|
+
onClose: handlePopoverClose,
|
|
3529
|
+
disableRestoreFocus: true
|
|
3530
|
+
},
|
|
3531
|
+
onHover ? onHover(event2) : " "
|
|
3532
|
+
)
|
|
3533
|
+
)
|
|
3534
|
+
);
|
|
3535
|
+
};
|
|
3461
3536
|
|
|
3462
3537
|
// src/Components/EmptyState/EmptyState.tsx
|
|
3463
3538
|
import React25 from "react";
|
|
@@ -4970,7 +5045,7 @@ var SCCalendarSwipeable = ({
|
|
|
4970
5045
|
|
|
4971
5046
|
// src/Components/SCCard.tsx
|
|
4972
5047
|
import React42 from "react";
|
|
4973
|
-
import {
|
|
5048
|
+
import { Divider as Divider8, Box as Box26, SvgIcon as SvgIcon9 } from "@mui/material";
|
|
4974
5049
|
import IconButton16 from "@mui/material/IconButton";
|
|
4975
5050
|
import Card2 from "@mui/material/Card";
|
|
4976
5051
|
import CardHeader from "@mui/material/CardHeader";
|
|
@@ -4980,22 +5055,20 @@ import CardActions from "@mui/material/CardActions";
|
|
|
4980
5055
|
import Collapse2 from "@mui/material/Collapse";
|
|
4981
5056
|
import ExpandMoreIcon2 from "@mui/icons-material/ExpandMore";
|
|
4982
5057
|
import * as Muicon8 from "@mui/icons-material";
|
|
4983
|
-
var SCCard = ({ width, title, image, iconTitle, actionsTitle, subtitle, content, actions,
|
|
5058
|
+
var SCCard = ({ width, title, image, iconTitle, actionsTitle, subtitle, dividerHeader, content, actions, dividerActions, contentExpand }) => {
|
|
4984
5059
|
let iconTitleValidation = "";
|
|
4985
5060
|
let IconTitle;
|
|
4986
5061
|
const [expanded, setExpanded] = React42.useState(false);
|
|
4987
5062
|
if (iconTitle) {
|
|
4988
|
-
if (
|
|
4989
|
-
|
|
4990
|
-
|
|
4991
|
-
|
|
4992
|
-
} else {
|
|
4993
|
-
iconTitleValidation = "icon";
|
|
4994
|
-
IconTitle = iconTitle;
|
|
4995
|
-
}
|
|
4996
|
-
} else {
|
|
5063
|
+
if (typeof iconTitle === "string" && /\.(png|jpg|jpeg|gif|svg|webp)$/i.test(iconTitle)) {
|
|
5064
|
+
iconTitleValidation = "image";
|
|
5065
|
+
IconTitle = iconTitle;
|
|
5066
|
+
} else if (Muicon8[iconTitle] != void 0) {
|
|
4997
5067
|
iconTitleValidation = "icon";
|
|
4998
5068
|
IconTitle = Muicon8[iconTitle];
|
|
5069
|
+
} else {
|
|
5070
|
+
iconTitleValidation = "icon";
|
|
5071
|
+
IconTitle = iconTitle;
|
|
4999
5072
|
}
|
|
5000
5073
|
}
|
|
5001
5074
|
const handleExpandClick = () => {
|
|
@@ -5005,7 +5078,7 @@ var SCCard = ({ width, title, image, iconTitle, actionsTitle, subtitle, content,
|
|
|
5005
5078
|
CardHeader,
|
|
5006
5079
|
{
|
|
5007
5080
|
avatar: iconTitle ? iconTitleValidation === "image" ? /* @__PURE__ */ React42.createElement(Box26, { sx: { marginRight: "16px", width: "44px", height: "44px", borderRadius: "1px" } }, /* @__PURE__ */ React42.createElement("img", { src: IconTitle, width: "44px", height: "44px" })) : /* @__PURE__ */ React42.createElement(SvgIcon9, { color: "action", fontSize: "small", component: IconTitle, sx: { marginRight: "16px" } }) : void 0,
|
|
5008
|
-
action:
|
|
5081
|
+
action: actionsTitle == "expand" ? /* @__PURE__ */ React42.createElement(IconButton16, { onClick: handleExpandClick, sx: { marginRight: "auto" }, size: "small" }, /* @__PURE__ */ React42.createElement(ExpandMoreIcon2, { fontSize: "small" })) : actionsTitle,
|
|
5009
5082
|
title,
|
|
5010
5083
|
subheader: subtitle,
|
|
5011
5084
|
sx: {
|
|
@@ -5024,25 +5097,14 @@ var SCCard = ({ width, title, image, iconTitle, actionsTitle, subtitle, content,
|
|
|
5024
5097
|
}
|
|
5025
5098
|
}
|
|
5026
5099
|
}
|
|
5027
|
-
), image && /* @__PURE__ */ React42.createElement(
|
|
5100
|
+
), dividerHeader && title && /* @__PURE__ */ React42.createElement(Divider8, { variant: "fullWidth" }), image && /* @__PURE__ */ React42.createElement(
|
|
5028
5101
|
CardMedia,
|
|
5029
5102
|
{
|
|
5030
5103
|
component: "img",
|
|
5031
5104
|
height: "194",
|
|
5032
5105
|
image
|
|
5033
5106
|
}
|
|
5034
|
-
), content && /* @__PURE__ */ React42.createElement(CardContent2, { sx: { padding: "8px 16px !important" } }, content),
|
|
5035
|
-
Button18,
|
|
5036
|
-
{
|
|
5037
|
-
key: index,
|
|
5038
|
-
size: "small",
|
|
5039
|
-
color: action.color || "primary",
|
|
5040
|
-
variant: action.variant || "text",
|
|
5041
|
-
onClick: action.fn,
|
|
5042
|
-
disabled: action.disabled || false
|
|
5043
|
-
},
|
|
5044
|
-
action.text
|
|
5045
|
-
)) : ""), expand && /* @__PURE__ */ React42.createElement(Collapse2, { in: expanded, timeout: "auto", unmountOnExit: true }, /* @__PURE__ */ React42.createElement(CardContent2, { sx: { padding: "8px 16px !important" } }, expand.content)));
|
|
5107
|
+
), content && /* @__PURE__ */ React42.createElement(CardContent2, { sx: { padding: "8px 16px !important" } }, content), dividerActions && /* @__PURE__ */ React42.createElement(Divider8, { variant: "fullWidth" }), actions && /* @__PURE__ */ React42.createElement(CardActions, null, actions), contentExpand && /* @__PURE__ */ React42.createElement(Collapse2, { in: expanded, timeout: "auto", unmountOnExit: true }, /* @__PURE__ */ React42.createElement(CardContent2, { sx: { padding: "8px 16px !important" } }, contentExpand)));
|
|
5046
5108
|
};
|
|
5047
5109
|
|
|
5048
5110
|
// src/Components/SCDataGrid.tsx
|
|
@@ -5767,7 +5829,7 @@ var SCDownloadExcelTable = ({
|
|
|
5767
5829
|
|
|
5768
5830
|
// src/Components/SCMenu.tsx
|
|
5769
5831
|
import React47 from "react";
|
|
5770
|
-
import { Box as Box28, Typography as Typography27, Paper as Paper5, Divider as
|
|
5832
|
+
import { Box as Box28, Typography as Typography27, Paper as Paper5, Divider as Divider9, MenuList as MenuList3, MenuItem as MenuItem9, ListItemIcon as ListItemIcon7, SvgIcon as SvgIcon11 } from "@mui/material";
|
|
5771
5833
|
import Grid12 from "@mui/material/Grid";
|
|
5772
5834
|
|
|
5773
5835
|
// src/Components/Hooks/useWindowDimensions.ts
|
|
@@ -5844,7 +5906,7 @@ var SCMenu = ({ header, options, defaultOption, disable, widthMenu, heightMenu,
|
|
|
5844
5906
|
},
|
|
5845
5907
|
option.iconLeft ? /* @__PURE__ */ React47.createElement(ListItemIcon7, { sx: { color: String(index + 1) === selectedIndex ? "primary" : "active" } }, /* @__PURE__ */ React47.createElement(SvgIcon11, { fontSize: "small", color: String(index + 1) === selectedIndex ? "primary" : "action", component: option.iconLeft })) : "",
|
|
5846
5908
|
/* @__PURE__ */ React47.createElement(Grid12, { container: true, size: 12, sx: { maxWidth: 220, flexWrap: "noWrap", alignItems: "center" } }, /* @__PURE__ */ React47.createElement(Typography27, { noWrap: true, variant: "caption", color: String(index + 1) === selectedIndex ? "primary" : "active" }, option.name), option.iconRight ? /* @__PURE__ */ React47.createElement(ListItemIcon7, { sx: { minWidth: "0px !important", color: String(index + 1) === selectedIndex ? "primary" : "active" } }, /* @__PURE__ */ React47.createElement(SvgIcon11, { fontSize: "small", color: String(index + 1) === selectedIndex ? "primary" : "action", component: option.iconRight })) : "")
|
|
5847
|
-
), option.divider == true ? /* @__PURE__ */ React47.createElement(
|
|
5909
|
+
), option.divider == true ? /* @__PURE__ */ React47.createElement(Divider9, null) : "")))), /* @__PURE__ */ React47.createElement(Grid12, { container: true }, options.map((option, index) => option.page ? String(index + 1) == value ? /* @__PURE__ */ React47.createElement(Box28, { "data-testid": "menu-page-content", sx: { padding: "16px", width: pageSize, height: heightContainer }, key: index }, option.page) : "" : /* @__PURE__ */ React47.createElement(Typography27, { color: "error" }, "No se ha configurado el componente a visualizar")))));
|
|
5848
5910
|
};
|
|
5849
5911
|
|
|
5850
5912
|
// src/Components/SCSnackBar.tsx
|
|
@@ -6164,7 +6226,7 @@ var SCTime = ({
|
|
|
6164
6226
|
|
|
6165
6227
|
// src/Components/SCZoom.tsx
|
|
6166
6228
|
import React51, { useState as useState30 } from "react";
|
|
6167
|
-
import { Typography as Typography30, Divider as
|
|
6229
|
+
import { Typography as Typography30, Divider as Divider10, IconButton as IconButton18, Box as Box31 } from "@mui/material";
|
|
6168
6230
|
import Grid13 from "@mui/material/Grid";
|
|
6169
6231
|
import ZoomOutIcon from "@mui/icons-material/ZoomOut";
|
|
6170
6232
|
import ZoomInIcon from "@mui/icons-material/ZoomIn";
|
|
@@ -6202,7 +6264,7 @@ var SCZoom = ({ image, width, height, bottom, left }) => {
|
|
|
6202
6264
|
}
|
|
6203
6265
|
}
|
|
6204
6266
|
)
|
|
6205
|
-
), /* @__PURE__ */ React51.createElement(Grid13, { container: true, flexWrap: "nowrap", alignItems: "center", gap: 1, sx: { position: "relative", bottom: bottom != null ? bottom : `calc(100% - 87%)`, left: left != null ? left : `calc(100% - 72%)`, zIndex: 1, width: "147px", borderRadius: "4px", padding: "4px 12px", border: bottom ? "0px" : "1px solid #0000001F", background: "white", boxShadow: bottom ? "" : "2px 3px 5px 0px #18274B33" } }, /* @__PURE__ */ React51.createElement(Grid13, { container: true, alignItems: "center", justifyContent: "center", flexWrap: "nowrap", gap: 0.5, sx: { width: "84px" } }, /* @__PURE__ */ React51.createElement(IconButton18, { onClick: handleZoomOut, disabled: zoom <= 0.5, size: "small" }, /* @__PURE__ */ React51.createElement(ZoomOutIcon, { color: "action", fontSize: "small" })), /* @__PURE__ */ React51.createElement(Typography30, { variant: "body2", color: "textSecondary" }, Math.round(zoom * 100), "%"), /* @__PURE__ */ React51.createElement(IconButton18, { onClick: handleZoomIn, disabled: zoom >= 3, color: "primary", size: "small" }, /* @__PURE__ */ React51.createElement(ZoomInIcon, { color: "action", fontSize: "small" }))), /* @__PURE__ */ React51.createElement(
|
|
6267
|
+
), /* @__PURE__ */ React51.createElement(Grid13, { container: true, flexWrap: "nowrap", alignItems: "center", gap: 1, sx: { position: "relative", bottom: bottom != null ? bottom : `calc(100% - 87%)`, left: left != null ? left : `calc(100% - 72%)`, zIndex: 1, width: "147px", borderRadius: "4px", padding: "4px 12px", border: bottom ? "0px" : "1px solid #0000001F", background: "white", boxShadow: bottom ? "" : "2px 3px 5px 0px #18274B33" } }, /* @__PURE__ */ React51.createElement(Grid13, { container: true, alignItems: "center", justifyContent: "center", flexWrap: "nowrap", gap: 0.5, sx: { width: "84px" } }, /* @__PURE__ */ React51.createElement(IconButton18, { onClick: handleZoomOut, disabled: zoom <= 0.5, size: "small" }, /* @__PURE__ */ React51.createElement(ZoomOutIcon, { color: "action", fontSize: "small" })), /* @__PURE__ */ React51.createElement(Typography30, { variant: "body2", color: "textSecondary" }, Math.round(zoom * 100), "%"), /* @__PURE__ */ React51.createElement(IconButton18, { onClick: handleZoomIn, disabled: zoom >= 3, color: "primary", size: "small" }, /* @__PURE__ */ React51.createElement(ZoomInIcon, { color: "action", fontSize: "small" }))), /* @__PURE__ */ React51.createElement(Divider10, { orientation: "vertical", sx: { width: "1px", height: "16px" } }), /* @__PURE__ */ React51.createElement(IconButton18, { onClick: handleReset, color: "primary", size: "small" }, /* @__PURE__ */ React51.createElement(RotateRightIcon, { color: "action", fontSize: "small" }))));
|
|
6206
6268
|
};
|
|
6207
6269
|
|
|
6208
6270
|
// src/Theme/index.ts
|