componentes-sinco 1.0.36-rc.3 → 1.0.37

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 CHANGED
@@ -2285,7 +2285,7 @@ var DrawerActions = ({ actions, anchor }) => {
2285
2285
  return /* @__PURE__ */ import_react18.default.createElement(
2286
2286
  import_Grid2.default,
2287
2287
  {
2288
- sx: { borderTop: 1, borderColor: "#1018403B" },
2288
+ sx: { borderTop: 1, borderColor: "#1018403B", zIndex: 1500 },
2289
2289
  container: true,
2290
2290
  gap: 2,
2291
2291
  padding: "8px 12px",
@@ -2353,9 +2353,10 @@ function SCDrawer({
2353
2353
  width,
2354
2354
  open,
2355
2355
  setOpen,
2356
- chipFilters
2356
+ chipFilters,
2357
+ heightDrawer = 456
2357
2358
  }) {
2358
- const drawerBleeding = 56;
2359
+ const drawerBleeding = heightDrawer;
2359
2360
  const { drawerOpen, handleDrawerClose, toggleDrawer } = useDrawerState({ open, setOpen });
2360
2361
  const { toast, setToastWithDelay } = useToast();
2361
2362
  const {
@@ -2411,7 +2412,7 @@ function SCDrawer({
2411
2412
  onDeleteFilter: handleDeleteFilter
2412
2413
  }
2413
2414
  ),
2414
- /* @__PURE__ */ import_react20.default.createElement(
2415
+ buttonDrawer && /* @__PURE__ */ import_react20.default.createElement(
2415
2416
  DrawerButton,
2416
2417
  {
2417
2418
  buttonDrawer,
@@ -2449,6 +2450,7 @@ function SCDrawer({
2449
2450
  anchor: "bottom",
2450
2451
  swipeAreaWidth: drawerBleeding,
2451
2452
  sx: {
2453
+ zIndex: 1400,
2452
2454
  "& .MuiDrawer-paper": {
2453
2455
  width: "auto",
2454
2456
  height: `calc(50% - ${drawerBleeding}px)`,
@@ -3406,7 +3408,7 @@ var SCDialog = ({ title, iconTitle, subtitle, content, actions, buttonDialog, di
3406
3408
  }
3407
3409
  ) : content.component
3408
3410
  ),
3409
- dialogActions != void 0 && dialogActions != false ? Array.isArray(dialogActions) && (dialogActions == null ? void 0 : dialogActions.length) > 0 ? /* @__PURE__ */ import_react33.default.createElement(import_material20.DialogActions, { sx: { gap: 1, m: 0, padding: "12px 16px 12px 16px", justifyContent: dialogActions.length >= 3 ? "space-between" : "flex-end" } }, typeView !== "mobile" ? /* @__PURE__ */ import_react33.default.createElement(import_react33.default.Fragment, null, dialogActions.length >= 3 ? /* @__PURE__ */ import_react33.default.createElement(import_react33.default.Fragment, null, /* @__PURE__ */ import_react33.default.createElement(
3411
+ dialogActions != void 0 && dialogActions != false ? Array.isArray(dialogActions) && (dialogActions == null ? void 0 : dialogActions.length) > 0 ? /* @__PURE__ */ import_react33.default.createElement(import_material20.DialogActions, { sx: { zIndex: 1200, gap: 1, m: 0, padding: "12px 16px 12px 16px", justifyContent: dialogActions.length >= 3 ? "space-between" : "flex-end" } }, typeView !== "mobile" ? /* @__PURE__ */ import_react33.default.createElement(import_react33.default.Fragment, null, dialogActions.length >= 3 ? /* @__PURE__ */ import_react33.default.createElement(import_react33.default.Fragment, null, /* @__PURE__ */ import_react33.default.createElement(
3410
3412
  import_material20.Button,
3411
3413
  {
3412
3414
  variant: "text",
@@ -3485,17 +3487,19 @@ var SCListContent = ({ options, iconLeftType = "Icon", iconRightType = "Icon" })
3485
3487
  import_material21.ListItemButton,
3486
3488
  {
3487
3489
  disabled: option.disable,
3488
- onClick: option.fn
3490
+ onClick: option.fn,
3491
+ sx: { gap: 1 }
3489
3492
  },
3490
- option.iconLeft ? iconLeftType == "Icon" ? /* @__PURE__ */ import_react34.default.createElement(import_material21.ListItemIcon, { sx: { minWidth: "0px !important", marginRight: "8px" } }, /* @__PURE__ */ import_react34.default.createElement(import_material21.SvgIcon, { fontSize: "small", color: option.iconLeftColor || "action", component: option.iconLeft })) : /* @__PURE__ */ import_react34.default.createElement(import_Avatar.default, null, ((_a = option.iconLeft) == null ? void 0 : _a.type) != void 0 ? /* @__PURE__ */ import_react34.default.createElement(import_material21.SvgIcon, { fontSize: "small", color: option.iconLeftColor || "action", component: option.iconLeft }) : option.iconLeft) : "",
3493
+ option.iconLeft ? iconLeftType == "Icon" ? /* @__PURE__ */ import_react34.default.createElement(import_material21.ListItemIcon, { sx: { minWidth: "0px !important" } }, /* @__PURE__ */ import_react34.default.createElement(import_material21.SvgIcon, { fontSize: "small", sx: { color: option.iconLeftColor || "action" }, component: option.iconLeft })) : /* @__PURE__ */ import_react34.default.createElement(import_Avatar.default, { sx: { width: 25, height: 25, fontSize: "11px", bgcolor: option.iconLeftColor ? `${option.iconLeftColor}.main` : "default" } }, ((_a = option.iconLeft) == null ? void 0 : _a.type) != void 0 ? /* @__PURE__ */ import_react34.default.createElement(import_material21.SvgIcon, { fontSize: "small", component: option.iconLeft }) : option.iconLeft) : "",
3491
3494
  /* @__PURE__ */ import_react34.default.createElement(
3492
3495
  import_material21.ListItemText,
3493
3496
  {
3497
+ sx: { color: option.colorDisabled == true ? "text.disabled" : "default" },
3494
3498
  primary: option.title,
3495
- secondary: /* @__PURE__ */ import_react34.default.createElement(import_Grid7.default, { gap: 0.5 }, /* @__PURE__ */ import_react34.default.createElement(import_Grid7.default, { container: true, gap: 0.5 }, option.subtitle), /* @__PURE__ */ import_react34.default.createElement(import_Grid7.default, { container: true, gap: 0.5 }, option.description))
3499
+ secondary: /* @__PURE__ */ import_react34.default.createElement(import_Grid7.default, { gap: 0.5 }, /* @__PURE__ */ import_react34.default.createElement(import_Grid7.default, { container: true, gap: 0.5, sx: { color: option.colorDisabled == true ? "text.disabled" : "default" } }, option.subtitle), /* @__PURE__ */ import_react34.default.createElement(import_Grid7.default, { container: true, gap: 0.5, sx: { color: option.colorDisabled == true ? "text.disabled" : "default" } }, option.description))
3496
3500
  }
3497
3501
  ),
3498
- option.iconRight ? iconRightType == "Icon" ? /* @__PURE__ */ import_react34.default.createElement(import_material21.ListItemIcon, { sx: { minWidth: "0px !important", marginRight: "8px" } }, /* @__PURE__ */ import_react34.default.createElement(import_material21.SvgIcon, { fontSize: "small", color: option.iconRightColor || "action", component: option.iconRight })) : /* @__PURE__ */ import_react34.default.createElement(import_Avatar.default, null, ((_b = option.iconRight) == null ? void 0 : _b.type) != void 0 ? /* @__PURE__ */ import_react34.default.createElement(import_material21.SvgIcon, { fontSize: "small", color: option.iconRightColor || "action", component: option.iconRight }) : option.iconRight) : ""
3502
+ option.iconRight ? iconRightType == "Icon" ? /* @__PURE__ */ import_react34.default.createElement(import_material21.ListItemIcon, { sx: { minWidth: "0px !important", marginRight: "8px" } }, /* @__PURE__ */ import_react34.default.createElement(import_material21.SvgIcon, { fontSize: "small", sx: { color: option.iconRightColor || "action" }, component: option.iconRight })) : /* @__PURE__ */ import_react34.default.createElement(import_Avatar.default, { variant: "circular", sx: { width: 20, height: 20 } }, ((_b = option.iconRight) == null ? void 0 : _b.type) != void 0 ? /* @__PURE__ */ import_react34.default.createElement(import_material21.SvgIcon, { fontSize: "small", color: option.iconRightColor || "action", component: option.iconRight }) : option.iconRight) : ""
3499
3503
  ), option.divider == true ? /* @__PURE__ */ import_react34.default.createElement(import_material21.Divider, null) : "");
3500
3504
  })));
3501
3505
  };
@@ -4569,7 +4573,8 @@ var SCTime = ({
4569
4573
  timeStep = 5,
4570
4574
  state,
4571
4575
  setState,
4572
- error
4576
+ width,
4577
+ error = false
4573
4578
  }) => {
4574
4579
  import_x_license3.LicenseInfo.setLicenseKey(
4575
4580
  "77d49a57fbc5f4af35ddb05c5f1742e0Tz0xMTI3MjgsRT0xNzc4MzcxMTk5MDAwLFM9cHJvLExNPXN1YnNjcmlwdGlvbixQVj1RMy0yMDI0LEtWPTI="
@@ -4609,7 +4614,7 @@ var SCTime = ({
4609
4614
  setIsOpenPopover(false);
4610
4615
  setAnchorEl(null);
4611
4616
  };
4612
- return /* @__PURE__ */ import_react48.default.createElement(import_LocalizationProvider3.LocalizationProvider, { dateAdapter: import_AdapterDayjs2.AdapterDayjs }, /* @__PURE__ */ import_react48.default.createElement(import_material32.Box, { sx: { position: "relative", width: "120px" } }, /* @__PURE__ */ import_react48.default.createElement(
4617
+ return /* @__PURE__ */ import_react48.default.createElement(import_LocalizationProvider3.LocalizationProvider, { dateAdapter: import_AdapterDayjs2.AdapterDayjs }, /* @__PURE__ */ import_react48.default.createElement(import_material32.Box, { sx: { position: "relative", width: width != null ? width : "99%" } }, /* @__PURE__ */ import_react48.default.createElement(
4613
4618
  import_TimeField.TimeField,
4614
4619
  {
4615
4620
  label,
@@ -4673,7 +4678,8 @@ var SCTime = ({
4673
4678
  borderRadius: 1,
4674
4679
  border: "1px solid #e0e0e0",
4675
4680
  maxHeight: "300px",
4676
- overflow: "visible"
4681
+ overflow: "visible",
4682
+ width: width != null ? width : "100%"
4677
4683
  }
4678
4684
  }
4679
4685
  }
@@ -4884,11 +4890,11 @@ var SCActivityCalendar = ({
4884
4890
  options: [{
4885
4891
  title: event2.activityDescription,
4886
4892
  subtitle: /* @__PURE__ */ import_react50.default.createElement(import_react50.default.Fragment, null, configRangeHour && new Date(event2.date.replace("00:00:00", event2.startTime)).getHours() === new Date(event2.date.replace("00:00:00", configRangeHour.split("-")[0])).getHours() && new Date(event2.date.replace("00:00:00", event2.finalTime)).getHours() === new Date(event2.date.replace("00:00:00", configRangeHour.split("-")[1])).getHours() && new Date(event2.date.replace("00:00:00", event2.startTime)).getMinutes() === new Date(event2.date.replace("00:00:00", configRangeHour.split("-")[0])).getMinutes() && new Date(event2.date.replace("00:00:00", event2.finalTime)).getMinutes() === new Date(event2.date.replace("00:00:00", configRangeHour.split("-")[1])).getMinutes() ? /* @__PURE__ */ import_react50.default.createElement(import_react50.default.Fragment, null, /* @__PURE__ */ import_react50.default.createElement(import_material34.Typography, null, "Todo el dia"), /* @__PURE__ */ import_react50.default.createElement(import_LightModeOutlined.default, { fontSize: "small" })) : /* @__PURE__ */ import_react50.default.createElement(import_react50.default.Fragment, null, /* @__PURE__ */ import_react50.default.createElement(import_material34.Typography, null, new Date(event2.date.replace("00:00:00", event2.startTime)).toLocaleTimeString([], { hour: "2-digit", minute: "2-digit", hour12: true })), /* @__PURE__ */ import_react50.default.createElement(import_ArrowForward.default, { fontSize: "small" }), /* @__PURE__ */ import_react50.default.createElement(import_material34.Typography, null, new Date(event2.date.replace("00:00:00", event2.finalTime)).toLocaleTimeString([], { hour: "2-digit", minute: "2-digit", hour12: true })))),
4887
- iconLeftColor: event2.state === "Finalizada" ? "success" : "action",
4893
+ iconLeftColor: event2.state === "Finalizada" ? "#C7E49D" : "action",
4888
4894
  iconLeft: event2.state === "Finalizada" ? "CheckCircle" : event2.state === "Aplazada" ? "EventBusyOutlined" : event2.state === "En progreso" ? "PendingOutlined" : "RadioButtonUnchecked",
4889
4895
  description: /* @__PURE__ */ import_react50.default.createElement(import_react50.default.Fragment, null, event2.state === "Aplazada" || event2.state === "En progreso" || event2.state === "Auto asignada" ? /* @__PURE__ */ import_react50.default.createElement(import_react50.default.Fragment, null, /* @__PURE__ */ import_react50.default.createElement(import_material34.Badge, { variant: "dot", badgeContent: "", sx: { display: "flex", alignItems: "center", "& .MuiBadge-badge": { top: "50%", transform: "translateY(-50%)" }, color: "action" } }), /* @__PURE__ */ import_react50.default.createElement(import_material34.Typography, null, event2.state == "Auto asignada" ? "Adicional" : event2.state)) : null),
4890
4896
  divider: eventosDelDia.length === idx + 1 ? false : true,
4891
- disable: event2.state === "Finalizada" || event2.state === "Aplazada" || event2.state === "En progreso" ? true : false,
4897
+ colorDisabled: event2.state === "Finalizada" || event2.state === "Aplazada" || event2.state === "En progreso" ? true : false,
4892
4898
  fn: fn ? () => fn(event2) : void 0
4893
4899
  }]
4894
4900
  }
@@ -4911,6 +4917,7 @@ var SCActivityCalendar = ({
4911
4917
 
4912
4918
  // src/Components/Adjuntar/mobile/AdjuntarMobile.tsx
4913
4919
  var import_react52 = __toESM(require("react"), 1);
4920
+ var import_react_webcam = __toESM(require("react-webcam"), 1);
4914
4921
 
4915
4922
  // src/Components/Adjuntar/mobile/components/button.tsx
4916
4923
  var import_react51 = __toESM(require("react"), 1);
@@ -4964,6 +4971,8 @@ var import_material36 = require("@mui/material");
4964
4971
  var import_CssBaseline = __toESM(require("@mui/material/CssBaseline"), 1);
4965
4972
  var import_system = require("@mui/system");
4966
4973
  var import_icons_material13 = require("@mui/icons-material");
4974
+ var import_PhotoCamera = __toESM(require("@mui/icons-material/PhotoCamera"), 1);
4975
+ var import_CancelOutlined = __toESM(require("@mui/icons-material/CancelOutlined"), 1);
4967
4976
  var AttachmentMobile = ({
4968
4977
  buttonAttachment,
4969
4978
  maxSize = 400,
@@ -4974,15 +4983,52 @@ var AttachmentMobile = ({
4974
4983
  onChange,
4975
4984
  sx
4976
4985
  }) => {
4986
+ const webcamRef = (0, import_react52.useRef)(null);
4987
+ const [abrirCamara, setAbrirCamara] = (0, import_react52.useState)(false);
4988
+ const [capturedImage, setCapturedImage] = (0, import_react52.useState)(null);
4977
4989
  const [files, setFiles] = (0, import_react52.useState)([]);
4978
4990
  const [toast, setToast] = (0, import_react52.useState)(null);
4979
4991
  const [open, setOpen] = import_react52.default.useState(false);
4980
4992
  const toggleAttachment = (newOpen) => () => {
4981
4993
  setOpen(newOpen);
4982
4994
  };
4995
+ const closeCam = () => {
4996
+ setAbrirCamara(false);
4997
+ };
4998
+ const openCam = () => {
4999
+ setOpen(false);
5000
+ setAbrirCamara(true);
5001
+ };
5002
+ let capturedImage2 = null;
5003
+ const capture = (0, import_react52.useCallback)((e) => {
5004
+ if (webcamRef.current) {
5005
+ const imageSrc = webcamRef.current.getScreenshot();
5006
+ setCapturedImage(imageSrc);
5007
+ capturedImage2 = imageSrc;
5008
+ setOpen(false);
5009
+ toggleAttachment(false);
5010
+ setAbrirCamara(false);
5011
+ handleUpload(e);
5012
+ }
5013
+ }, [webcamRef, setCapturedImage]);
4983
5014
  const inputRef = (0, import_react52.useRef)(null);
4984
5015
  const handleUpload = (event2) => {
4985
- const newFiles = event2.target.files;
5016
+ var _a;
5017
+ let newFiles = event2.target.files;
5018
+ if (capturedImage || capturedImage2) {
5019
+ const image = capturedImage || capturedImage2;
5020
+ if (!image) return;
5021
+ const arr = image.split(",");
5022
+ const mime = ((_a = arr[0].match(/:(.*?);/)) == null ? void 0 : _a[1]) || "image/jpeg";
5023
+ const bstr = atob(arr[1]);
5024
+ let n = bstr.length;
5025
+ const u8arr = new Uint8Array(n);
5026
+ while (n--) {
5027
+ u8arr[n] = bstr.charCodeAt(n);
5028
+ }
5029
+ const capturedFile = new File([u8arr], `photo_${Date.now()}.jpg`, { type: mime });
5030
+ newFiles = [capturedFile];
5031
+ }
4986
5032
  if (!newFiles) return;
4987
5033
  const nuevosArchivos = [];
4988
5034
  const archivosValidos = [];
@@ -5088,8 +5134,11 @@ var AttachmentMobile = ({
5088
5134
  }
5089
5135
  });
5090
5136
  const AttachtmentActions = [
5091
- { icon: /* @__PURE__ */ import_react52.default.createElement(import_icons_material13.FolderOpenOutlined, { type: "file", color: "primary" }), color: "primary", label: "Galer\xEDa", onClick: () => alert("diste click en Galeria") },
5092
- { icon: /* @__PURE__ */ import_react52.default.createElement(import_icons_material13.PhotoCameraOutlined, { type: "file", color: "success" }), color: "success", label: "C\xE1mara", onClick: () => alert("diste click en Camara") },
5137
+ { icon: /* @__PURE__ */ import_react52.default.createElement(import_icons_material13.FolderOpenOutlined, { type: "file", color: "primary" }), color: "primary", label: "Galer\xEDa", onClick: () => {
5138
+ var _a;
5139
+ return (_a = inputRef.current) == null ? void 0 : _a.click();
5140
+ } },
5141
+ { icon: /* @__PURE__ */ import_react52.default.createElement(import_icons_material13.PhotoCameraOutlined, { type: "file", color: "success" }), color: "success", label: "C\xE1mara", onClick: () => openCam() },
5093
5142
  { icon: /* @__PURE__ */ import_react52.default.createElement(import_icons_material13.FolderOpenOutlined, { type: "file", color: "warning" }), color: "warning", label: "Archivos", onClick: () => {
5094
5143
  var _a;
5095
5144
  return (_a = inputRef.current) == null ? void 0 : _a.click();
@@ -5112,6 +5161,7 @@ var AttachmentMobile = ({
5112
5161
  {
5113
5162
  ModalProps: {
5114
5163
  sx: {
5164
+ zIndex: 1400,
5115
5165
  "& .MuiPaper-root": {
5116
5166
  borderRadius: "16px 16px 0 0"
5117
5167
  }
@@ -5166,7 +5216,49 @@ var AttachmentMobile = ({
5166
5216
  ),
5167
5217
  /* @__PURE__ */ import_react52.default.createElement(import_material36.Typography, { variant: "body2", color: "text.primary" }, option.label)
5168
5218
  ))))
5169
- ), files.length > 0 && /* @__PURE__ */ import_react52.default.createElement(
5219
+ ), abrirCamara && /* @__PURE__ */ import_react52.default.createElement(import_react52.default.Fragment, null, /* @__PURE__ */ import_react52.default.createElement(import_CancelOutlined.default, { onClick: closeCam, sx: { borderRadius: "50px", height: "35px", width: "35px", zIndex: 1700, background: "white", position: "absolute", left: `calc(100% - 50px)`, bottom: `calc(100% - 50px)` } }), /* @__PURE__ */ import_react52.default.createElement(import_material36.Stack, { className: "camras" }, /* @__PURE__ */ import_react52.default.createElement(
5220
+ import_react_webcam.default,
5221
+ {
5222
+ audio: false,
5223
+ ref: webcamRef,
5224
+ width: "100%",
5225
+ height: "100%",
5226
+ screenshotFormat: "image/jpeg",
5227
+ videoConstraints: {
5228
+ //facingMode: { exact: "environment" }
5229
+ facingMode: "user"
5230
+ //facingMode: "environment" // cámara trasera
5231
+ },
5232
+ style: {
5233
+ position: "fixed",
5234
+ // Fijo para cubrir toda la ventana
5235
+ top: 0,
5236
+ left: 0,
5237
+ objectFit: "cover",
5238
+ backgroundColor: "black",
5239
+ zIndex: 1600
5240
+ // Encima de todo
5241
+ }
5242
+ }
5243
+ ), /* @__PURE__ */ import_react52.default.createElement(
5244
+ import_PhotoCamera.default,
5245
+ {
5246
+ onClick: capture,
5247
+ sx: {
5248
+ height: "45px",
5249
+ width: "45px",
5250
+ padding: "6px",
5251
+ backgroundColor: "white",
5252
+ color: "#1E62A1",
5253
+ borderRadius: "50px",
5254
+ zIndex: 1700,
5255
+ position: "absolute",
5256
+ bottom: "10px",
5257
+ left: "50%"
5258
+ },
5259
+ fontSize: "medium"
5260
+ }
5261
+ ))), files.length > 0 && /* @__PURE__ */ import_react52.default.createElement(
5170
5262
  import_material36.Stack,
5171
5263
  {
5172
5264
  "data-testid": "ContenedorArchivosAdjuntos",