componentes-sinco 1.0.17 → 1.0.18

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.
Files changed (7) hide show
  1. package/dist/index.cjs +118 -46
  2. package/dist/index.cjs.map +1 -1
  3. package/dist/index.d.cts +3 -4
  4. package/dist/index.d.ts +3 -4
  5. package/dist/index.js +134 -48
  6. package/dist/index.js.map +1 -1
  7. package/package.json +1 -1
package/dist/index.d.cts CHANGED
@@ -25,9 +25,8 @@ interface AdjuntarProps<T> {
25
25
  onLoading?: boolean;
26
26
  downloadAction?: () => void;
27
27
  initialFiles?: UploadedFile[];
28
- }
29
-
30
- declare const Attachment: ({ sx, compact, error, maxSize, fileAccepted, onLoading, onChange, downloadAction, initialFiles }: AdjuntarProps<any>) => React__default.JSX.Element;
28
+ }
29
+ declare const Attachment: ({ sx, compact, error, maxSize, fileAccepted, onLoading, onChange, downloadAction, initialFiles, }: AdjuntarProps<any>) => React__default.JSX.Element;
31
30
 
32
31
  type ReplyPalette$1 = "primary" | "secondary" | "warning" | "info" | "success" | "error" | any;
33
32
  type ReplyTextPalette = "primary" | "secondary" | "disabled";
@@ -550,4 +549,4 @@ declare const SincoTheme: _mui_material_styles.Theme;
550
549
  declare let AdproSincoTheme: _mui_material_styles.Theme;
551
550
  declare let ADCSincoTheme: _mui_material_styles.Theme;
552
551
 
553
- export { ADCSincoTheme, AdproSincoTheme, Attachment, Calendar, type CalendarEvent, type CalendarProps, type CalendarView, EmptyState, type EmptyStateProperties, type EmptyStateSize, type EmptyStateStates, FooterAction, type FooterActionsProperties, type ModalProps, type ModalStates, MultiSelect, type MultiSelectProps, PageHeader, type PageheaderProperties, type ReplyPalette$1 as ReplyPalette, type ReplyTextPalette, type ReplyVariants, type RepplyButtonVariants, SCAutocomplete, SCCalendarSwipeable, SCCard, SCDataGrid, SCDataGridInitial, SCDateRange, SCDialog, SCDrawer, SCMenu, SCModal, SCSelect, SCTabs, SCTextArea, type SCTextAreaProps, SCTextField, type SCTextFieldProps, SCTime, SCToastNotification, SincoTheme, type ToastBaseProperties, ToastProgress, type ToastType, capitalize, getButtonColor, getIcon, getIconComponent, getIconMultiSelect, getModalColor, modalStateConfig, useFilteredItems, useMultiSelectHandlers, useProgress };
552
+ export { ADCSincoTheme, type AdjuntarProps, AdproSincoTheme, Attachment, Calendar, type CalendarEvent, type CalendarProps, type CalendarView, EmptyState, type EmptyStateProperties, type EmptyStateSize, type EmptyStateStates, FooterAction, type FooterActionsProperties, type ModalProps, type ModalStates, MultiSelect, type MultiSelectProps, PageHeader, type PageheaderProperties, type ReplyPalette$1 as ReplyPalette, type ReplyTextPalette, type ReplyVariants, type RepplyButtonVariants, SCAutocomplete, SCCalendarSwipeable, SCCard, SCDataGrid, SCDataGridInitial, SCDateRange, SCDialog, SCDrawer, SCMenu, SCModal, SCSelect, SCTabs, SCTextArea, type SCTextAreaProps, SCTextField, type SCTextFieldProps, SCTime, SCToastNotification, SincoTheme, type ToastBaseProperties, ToastProgress, type ToastType, type UploadedFile, capitalize, getButtonColor, getIcon, getIconComponent, getIconMultiSelect, getModalColor, modalStateConfig, useFilteredItems, useMultiSelectHandlers, useProgress };
package/dist/index.d.ts CHANGED
@@ -25,9 +25,8 @@ interface AdjuntarProps<T> {
25
25
  onLoading?: boolean;
26
26
  downloadAction?: () => void;
27
27
  initialFiles?: UploadedFile[];
28
- }
29
-
30
- declare const Attachment: ({ sx, compact, error, maxSize, fileAccepted, onLoading, onChange, downloadAction, initialFiles }: AdjuntarProps<any>) => React__default.JSX.Element;
28
+ }
29
+ declare const Attachment: ({ sx, compact, error, maxSize, fileAccepted, onLoading, onChange, downloadAction, initialFiles, }: AdjuntarProps<any>) => React__default.JSX.Element;
31
30
 
32
31
  type ReplyPalette$1 = "primary" | "secondary" | "warning" | "info" | "success" | "error" | any;
33
32
  type ReplyTextPalette = "primary" | "secondary" | "disabled";
@@ -550,4 +549,4 @@ declare const SincoTheme: _mui_material_styles.Theme;
550
549
  declare let AdproSincoTheme: _mui_material_styles.Theme;
551
550
  declare let ADCSincoTheme: _mui_material_styles.Theme;
552
551
 
553
- export { ADCSincoTheme, AdproSincoTheme, Attachment, Calendar, type CalendarEvent, type CalendarProps, type CalendarView, EmptyState, type EmptyStateProperties, type EmptyStateSize, type EmptyStateStates, FooterAction, type FooterActionsProperties, type ModalProps, type ModalStates, MultiSelect, type MultiSelectProps, PageHeader, type PageheaderProperties, type ReplyPalette$1 as ReplyPalette, type ReplyTextPalette, type ReplyVariants, type RepplyButtonVariants, SCAutocomplete, SCCalendarSwipeable, SCCard, SCDataGrid, SCDataGridInitial, SCDateRange, SCDialog, SCDrawer, SCMenu, SCModal, SCSelect, SCTabs, SCTextArea, type SCTextAreaProps, SCTextField, type SCTextFieldProps, SCTime, SCToastNotification, SincoTheme, type ToastBaseProperties, ToastProgress, type ToastType, capitalize, getButtonColor, getIcon, getIconComponent, getIconMultiSelect, getModalColor, modalStateConfig, useFilteredItems, useMultiSelectHandlers, useProgress };
552
+ export { ADCSincoTheme, type AdjuntarProps, AdproSincoTheme, Attachment, Calendar, type CalendarEvent, type CalendarProps, type CalendarView, EmptyState, type EmptyStateProperties, type EmptyStateSize, type EmptyStateStates, FooterAction, type FooterActionsProperties, type ModalProps, type ModalStates, MultiSelect, type MultiSelectProps, PageHeader, type PageheaderProperties, type ReplyPalette$1 as ReplyPalette, type ReplyTextPalette, type ReplyVariants, type RepplyButtonVariants, SCAutocomplete, SCCalendarSwipeable, SCCard, SCDataGrid, SCDataGridInitial, SCDateRange, SCDialog, SCDrawer, SCMenu, SCModal, SCSelect, SCTabs, SCTextArea, type SCTextAreaProps, SCTextField, type SCTextFieldProps, SCTime, SCToastNotification, SincoTheme, type ToastBaseProperties, ToastProgress, type ToastType, type UploadedFile, capitalize, getButtonColor, getIcon, getIconComponent, getIconMultiSelect, getModalColor, modalStateConfig, useFilteredItems, useMultiSelectHandlers, useProgress };
package/dist/index.js CHANGED
@@ -32,8 +32,22 @@ var __objRest = (source, exclude) => {
32
32
 
33
33
  // src/Components/Adjuntar/Adjuntar.tsx
34
34
  import React4, { useEffect as useEffect4, useRef, useState as useState4 } from "react";
35
- import { Box as Box3, Button as Button3, CircularProgress, IconButton as IconButton3, Stack as Stack3, Tooltip, Typography as Typography3 } from "@mui/material";
36
- import { CloudUploadOutlined, AttachFileOutlined, DeleteOutline, UploadFileOutlined, FileDownload } from "@mui/icons-material";
35
+ import {
36
+ Box as Box3,
37
+ Button as Button3,
38
+ CircularProgress,
39
+ IconButton as IconButton3,
40
+ Stack as Stack3,
41
+ Tooltip,
42
+ Typography as Typography3
43
+ } from "@mui/material";
44
+ import {
45
+ CloudUploadOutlined,
46
+ AttachFileOutlined,
47
+ DeleteOutline,
48
+ UploadFileOutlined,
49
+ FileDownload
50
+ } from "@mui/icons-material";
37
51
 
38
52
  // src/Components/ToastNotification/SCToastNotification.tsx
39
53
  import React, { useEffect as useEffect2, useState as useState2 } from "react";
@@ -393,25 +407,6 @@ var Attachment = ({
393
407
  const [openModal, setOpenModal] = useState4(false);
394
408
  const [isDragFile, setIsDragFile] = useState4(false);
395
409
  const inputRef = useRef(null);
396
- const handleDrop = (event2) => {
397
- event2.preventDefault();
398
- setIsDragFile(false);
399
- const filesDropped = event2.dataTransfer.files;
400
- if (filesDropped && filesDropped.length > 0) {
401
- const fakeEvent = {
402
- target: { files: filesDropped }
403
- };
404
- handleUpload(fakeEvent);
405
- }
406
- };
407
- const handleDragOver = (event2) => {
408
- event2.preventDefault();
409
- setIsDragFile(true);
410
- };
411
- const handleDragLeave = (event2) => {
412
- event2.preventDefault();
413
- setIsDragFile(false);
414
- };
415
410
  useEffect4(() => {
416
411
  if (initialFiles.length > 0) {
417
412
  setFiles(initialFiles);
@@ -432,14 +427,35 @@ var Attachment = ({
432
427
  });
433
428
  }, 1e3);
434
429
  return () => clearInterval(interval);
435
- }, [files]);
430
+ }, []);
431
+ const handleDrop = (event2) => {
432
+ event2.preventDefault();
433
+ setIsDragFile(false);
434
+ const filesDropped = event2.dataTransfer.files;
435
+ if (filesDropped && filesDropped.length > 0) {
436
+ const fakeEvent = {
437
+ target: { files: filesDropped }
438
+ };
439
+ handleUpload(fakeEvent);
440
+ }
441
+ };
442
+ const handleDragOver = (event2) => {
443
+ event2.preventDefault();
444
+ setIsDragFile(true);
445
+ };
446
+ const handleDragLeave = (event2) => {
447
+ event2.preventDefault();
448
+ setIsDragFile(false);
449
+ };
436
450
  const handleUpload = (event2) => {
437
451
  const newFiles = event2.target.files;
438
452
  if (!newFiles) return;
439
453
  const nuevosArchivos = [];
440
454
  const archivosValidos = [];
441
455
  Array.from(newFiles).forEach((file) => {
442
- const isDuplicatedFile = files.findIndex((e) => e.name === file.name && e.size === file.size);
456
+ const isDuplicatedFile = files.findIndex(
457
+ (e) => e.name === file.name && e.size === file.size
458
+ );
443
459
  const sizeMB = file.size / (1024 * 1024);
444
460
  if (isDuplicatedFile !== -1) {
445
461
  setToast({
@@ -468,7 +484,12 @@ var Attachment = ({
468
484
  });
469
485
  return;
470
486
  }
471
- if (fileAccepted && !file.name.match(new RegExp(`(${fileAccepted.replace(/\./g, "\\.").replace(/,/g, "|")})$`, "i"))) {
487
+ if (fileAccepted && !file.name.match(
488
+ new RegExp(
489
+ `(${fileAccepted.replace(/\./g, "\\.").replace(/,/g, "|")})$`,
490
+ "i"
491
+ )
492
+ )) {
472
493
  setToast({
473
494
  type: "error",
474
495
  title: "Tipo de archivo no permitido",
@@ -490,18 +511,23 @@ var Attachment = ({
490
511
  if (nuevosArchivos.length > 0) {
491
512
  setFiles((prev) => {
492
513
  const actualizados = [...prev, ...nuevosArchivos];
493
- const totalFiles = [...onChange ? archivosValidos : []];
494
- onChange == null ? void 0 : onChange(totalFiles);
514
+ onChange == null ? void 0 : onChange([
515
+ ...archivosValidos,
516
+ ...prev.map((f) => new File([], f.name, { type: f.type }))
517
+ ]);
495
518
  return actualizados;
496
519
  });
497
520
  }
498
521
  event2.target.value = "";
499
522
  };
500
523
  const deleteFiles = (nameFile) => {
501
- const filtered = files.filter((e) => e.name !== nameFile);
502
- setFiles(filtered);
503
- const remainingFiles = filtered.map((f) => new File([], f.name, { type: f.type }));
504
- onChange == null ? void 0 : onChange(remainingFiles);
524
+ setFiles((prev) => {
525
+ const filtered = prev.filter((e) => e.name !== nameFile);
526
+ onChange == null ? void 0 : onChange(
527
+ filtered.map((f) => new File([], f.name, { type: f.type }))
528
+ );
529
+ return filtered;
530
+ });
505
531
  };
506
532
  return /* @__PURE__ */ React4.createElement(Stack3, { spacing: 2 }, toast && /* @__PURE__ */ React4.createElement(SCToastNotification, __spreadValues({}, toast)), /* @__PURE__ */ React4.createElement(
507
533
  "input",
@@ -539,7 +565,38 @@ var Attachment = ({
539
565
  }
540
566
  }, sx)
541
567
  },
542
- onLoading ? /* @__PURE__ */ React4.createElement(Box3, { display: "flex", alignItems: "center", justifyContent: "center", width: "100%", height: "450px" }, /* @__PURE__ */ React4.createElement(CircularProgress, { sx: { width: "60px", height: "60px" }, variant: "indeterminate" })) : /* @__PURE__ */ React4.createElement(React4.Fragment, null, /* @__PURE__ */ React4.createElement(Box3, { display: "flex", bgcolor: error ? "error.50" : "primary.50", borderRadius: "100%", p: 1 }, /* @__PURE__ */ React4.createElement(CloudUploadOutlined, { color: error ? "error" : "primary", fontSize: "medium" })), /* @__PURE__ */ React4.createElement(
568
+ onLoading ? /* @__PURE__ */ React4.createElement(
569
+ Box3,
570
+ {
571
+ display: "flex",
572
+ alignItems: "center",
573
+ justifyContent: "center",
574
+ width: "100%",
575
+ height: "450px"
576
+ },
577
+ /* @__PURE__ */ React4.createElement(
578
+ CircularProgress,
579
+ {
580
+ sx: { width: "60px", height: "60px" },
581
+ variant: "indeterminate"
582
+ }
583
+ )
584
+ ) : /* @__PURE__ */ React4.createElement(React4.Fragment, null, /* @__PURE__ */ React4.createElement(
585
+ Box3,
586
+ {
587
+ display: "flex",
588
+ bgcolor: error ? "error.50" : "primary.50",
589
+ borderRadius: "100%",
590
+ p: 1
591
+ },
592
+ /* @__PURE__ */ React4.createElement(
593
+ CloudUploadOutlined,
594
+ {
595
+ color: error ? "error" : "primary",
596
+ fontSize: "medium"
597
+ }
598
+ )
599
+ ), /* @__PURE__ */ React4.createElement(
543
600
  Stack3,
544
601
  {
545
602
  width: "100%",
@@ -548,18 +605,27 @@ var Attachment = ({
548
605
  justifyContent: compact ? "space-between" : "center",
549
606
  gap: 1
550
607
  },
551
- /* @__PURE__ */ React4.createElement(Stack3, { flexDirection: "column", alignItems: compact ? "start" : "center", gap: 0.5 }, /* @__PURE__ */ React4.createElement(Typography3, { variant: "body2", color: "text.primary" }, "Arrastrar o adjuntar archivos"), /* @__PURE__ */ React4.createElement(
552
- Typography3,
608
+ /* @__PURE__ */ React4.createElement(
609
+ Stack3,
553
610
  {
554
- variant: "caption",
555
- color: error ? "error" : "text.secondary",
556
- whiteSpace: "nowrap",
557
- overflow: "hidden",
558
- textOverflow: "ellipsis",
559
- maxWidth: "450px"
611
+ flexDirection: "column",
612
+ alignItems: compact ? "start" : "center",
613
+ gap: 0.5
560
614
  },
561
- error ? `${fileAccepted || "DOCX, XML, PNG, JPG"} \u2022 Archivo no soportado` : `${fileAccepted || "DOCX, XML, PNG, JPG"} \u2022 Max. ${maxSize}MB`
562
- )),
615
+ /* @__PURE__ */ React4.createElement(Typography3, { variant: "body2", color: "text.primary" }, "Arrastrar o adjuntar archivos"),
616
+ /* @__PURE__ */ React4.createElement(
617
+ Typography3,
618
+ {
619
+ variant: "caption",
620
+ color: error ? "error" : "text.secondary",
621
+ whiteSpace: "nowrap",
622
+ overflow: "hidden",
623
+ textOverflow: "ellipsis",
624
+ maxWidth: "450px"
625
+ },
626
+ error ? `${fileAccepted || "DOCX, XML, PNG, JPG"} \u2022 Archivo no soportado` : `${fileAccepted || "DOCX, XML, PNG, JPG"} \u2022 Max. ${maxSize}MB`
627
+ )
628
+ ),
563
629
  /* @__PURE__ */ React4.createElement(
564
630
  Button3,
565
631
  {
@@ -601,7 +667,13 @@ var Attachment = ({
601
667
  }
602
668
  }
603
669
  },
604
- /* @__PURE__ */ React4.createElement(Stack3, { direction: "row", alignItems: "center", gap: 1, width: "100%" }, /* @__PURE__ */ React4.createElement(UploadFileOutlined, { color: file.uploadError ? "error" : "primary", fontSize: "small" }), /* @__PURE__ */ React4.createElement(Stack3, { width: "100%" }, /* @__PURE__ */ React4.createElement(
670
+ /* @__PURE__ */ React4.createElement(Stack3, { direction: "row", alignItems: "center", gap: 1, width: "100%" }, /* @__PURE__ */ React4.createElement(
671
+ UploadFileOutlined,
672
+ {
673
+ color: file.uploadError ? "error" : "primary",
674
+ fontSize: "small"
675
+ }
676
+ ), /* @__PURE__ */ React4.createElement(Stack3, { width: "100%" }, /* @__PURE__ */ React4.createElement(
605
677
  Typography3,
606
678
  {
607
679
  variant: "body2",
@@ -609,15 +681,29 @@ var Attachment = ({
609
681
  whiteSpace: "nowrap",
610
682
  overflow: "hidden",
611
683
  textOverflow: "ellipsis",
612
- maxWidth: "210px"
684
+ maxWidth: "310px"
613
685
  },
614
686
  file.name
615
- ), /* @__PURE__ */ React4.createElement(Typography3, { variant: "caption", color: file.uploadError ? "error" : "text.secondary" }, 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}`))),
687
+ ), /* @__PURE__ */ React4.createElement(
688
+ Typography3,
689
+ {
690
+ variant: "caption",
691
+ color: file.uploadError ? "error" : "text.secondary"
692
+ },
693
+ 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}`
694
+ ))),
616
695
  /* @__PURE__ */ React4.createElement(Tooltip, { title: "Descargar" }, /* @__PURE__ */ React4.createElement(IconButton3, { size: "small", onClick: downloadAction }, /* @__PURE__ */ React4.createElement(FileDownload, { fontSize: "small", color: "action" }))),
617
- /* @__PURE__ */ React4.createElement(Tooltip, { title: "Eliminar" }, /* @__PURE__ */ React4.createElement(IconButton3, { size: "small", onClick: () => {
618
- setFileToDelete(file);
619
- setOpenModal(true);
620
- } }, /* @__PURE__ */ React4.createElement(DeleteOutline, { fontSize: "small", color: "action" })))
696
+ /* @__PURE__ */ React4.createElement(Tooltip, { title: "Eliminar" }, /* @__PURE__ */ React4.createElement(
697
+ IconButton3,
698
+ {
699
+ size: "small",
700
+ onClick: () => {
701
+ setFileToDelete(file);
702
+ setOpenModal(true);
703
+ }
704
+ },
705
+ /* @__PURE__ */ React4.createElement(DeleteOutline, { fontSize: "small", color: "action" })
706
+ ))
621
707
  ))
622
708
  ), /* @__PURE__ */ React4.createElement(
623
709
  SCModal,