@tecsinapse/cortex-react 1.15.0-beta.15 → 1.15.0-beta.17

package/dist/cjs/components/Uploader/Root.js

@@ -3,24 +3,22 @@
 var jsxRuntime = require('react/jsx-runtime');
 var Modal = require('./Modal.js');
 var Dropzone = require('./Dropzone.js');
-var Manager = require('./Manager.js');
+var Files = require('./Files.js');
 
 const Root = ({
   open,
   onClose,
-  files,
-  onDelete,
   dropzoneProps,
   selectFileText,
   dropText,
   buttonText,
-  uploadProgressText,
   titleModal,
-  isManagerOpen,
-  closeManager
+  onDelete,
+  uploadProgressText,
+  files
 }) => {
-  return /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
-    /* @__PURE__ */ jsxRuntime.jsx(Modal.Modal, { onClose, open, title: titleModal, children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex flex-1 flex-col w-full gap-deca md:flex-row", children: /* @__PURE__ */ jsxRuntime.jsx(
+  return /* @__PURE__ */ jsxRuntime.jsx(jsxRuntime.Fragment, { children: /* @__PURE__ */ jsxRuntime.jsx(Modal.Modal, { onClose, open, title: titleModal, children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-1 flex-col w-full gap-deca md:flex-row", children: [
+    /* @__PURE__ */ jsxRuntime.jsx(
       Dropzone.Dropzone,
       {
         dropzoneProps,
@@ -28,18 +26,16 @@ const Root = ({
         dropText,
         buttonText
       }
-    ) }) }),
+    ),
     /* @__PURE__ */ jsxRuntime.jsx(
-      Manager.Manager,
+      Files.Files,
       {
-        open: isManagerOpen,
         files,
         onDelete,
-        uploadProgressText,
-        onClose: closeManager
+        uploadProgressText
       }
     )
-  ] });
+  ] }) }) });
 };
 
 exports.Root = Root;

package/dist/cjs/components/Uploader/Upload.js

@@ -86,9 +86,12 @@ const File = ({
   ] }, index);
 };
 const Folder = ({ name, subItems }) => {
-  const size = countFolderElements(
-    subItems.map((it) => it.path),
-    name
+  const size = React.useMemo(
+    () => countFolderElements(
+      subItems.map((it) => it.path),
+      name
+    ),
+    [subItems, name]
   );
   const loading = React.useMemo(
     () => subItems.some((it) => it.status === "uploading"),
@@ -127,7 +130,7 @@ const FolderList = ({ files, setFolders }) => {
     });
     return segments;
   }, [files]);
-  setFolders(Object.entries(folders));
+  React.useEffect(() => setFolders(Object.entries(folders)), [folders, setFolders]);
   return /* @__PURE__ */ jsxRuntime.jsx(jsxRuntime.Fragment, { children: Object.entries(folders).map(([name, children], index) => /* @__PURE__ */ jsxRuntime.jsx(Folder, { name, subItems: children }, index)) });
 };
 

package/dist/cjs/hooks/useFileUpload.js

@@ -19,6 +19,7 @@ var ManagerContext = require('../provider/ManagerContext.js');
 const useFileUpload = ({
   accept = {},
   onAccept,
+  onOpenManager,
   onFileRejected,
   maxSize,
   allowMultiple = true,
@@ -46,7 +47,10 @@ const useFileUpload = ({
   const handleClearFiles = React.useCallback(() => {
     setFiles([]);
   }, []);
-  const openManager = React.useCallback(() => setIsManagerOpen(true), []);
+  const openManager = React.useCallback(() => {
+    setIsManagerOpen(true);
+    onOpenManager?.();
+  }, []);
   const closeManager = React.useCallback(() => {
     handleClearFiles();
     setIsManagerOpen(false);

package/dist/esm/components/Uploader/Root.js

@@ -1,24 +1,22 @@
-import { jsxs, Fragment, jsx } from 'react/jsx-runtime';
+import { jsx, Fragment, jsxs } from 'react/jsx-runtime';
 import { Modal } from './Modal.js';
 import { Dropzone } from './Dropzone.js';
-import { Manager } from './Manager.js';
+import { Files } from './Files.js';
 
 const Root = ({
   open,
   onClose,
-  files,
-  onDelete,
   dropzoneProps,
   selectFileText,
   dropText,
   buttonText,
-  uploadProgressText,
   titleModal,
-  isManagerOpen,
-  closeManager
+  onDelete,
+  uploadProgressText,
+  files
 }) => {
-  return /* @__PURE__ */ jsxs(Fragment, { children: [
-    /* @__PURE__ */ jsx(Modal, { onClose, open, title: titleModal, children: /* @__PURE__ */ jsx("div", { className: "flex flex-1 flex-col w-full gap-deca md:flex-row", children: /* @__PURE__ */ jsx(
+  return /* @__PURE__ */ jsx(Fragment, { children: /* @__PURE__ */ jsx(Modal, { onClose, open, title: titleModal, children: /* @__PURE__ */ jsxs("div", { className: "flex flex-1 flex-col w-full gap-deca md:flex-row", children: [
+    /* @__PURE__ */ jsx(
       Dropzone,
       {
         dropzoneProps,
@@ -26,18 +24,16 @@ const Root = ({
         dropText,
         buttonText
       }
-    ) }) }),
+    ),
     /* @__PURE__ */ jsx(
-      Manager,
+      Files,
       {
-        open: isManagerOpen,
         files,
         onDelete,
-        uploadProgressText,
-        onClose: closeManager
+        uploadProgressText
       }
     )
-  ] });
+  ] }) }) });
 };
 
 export { Root };

package/dist/esm/components/Uploader/Upload.js

@@ -1,6 +1,6 @@
 import { jsxs, jsx, Fragment } from 'react/jsx-runtime';
 import { button } from '@tecsinapse/cortex-core';
-import { useMemo } from 'react';
+import { useMemo, useEffect } from 'react';
 import { FaRegFileLines, FaRegFolder } from 'react-icons/fa6';
 import { MdClose } from 'react-icons/md';
 import { ProgressBar } from '../ProgressBar/ProgressBar.js';
@@ -84,9 +84,12 @@ const File = ({
   ] }, index);
 };
 const Folder = ({ name, subItems }) => {
-  const size = countFolderElements(
-    subItems.map((it) => it.path),
-    name
+  const size = useMemo(
+    () => countFolderElements(
+      subItems.map((it) => it.path),
+      name
+    ),
+    [subItems, name]
   );
   const loading = useMemo(
     () => subItems.some((it) => it.status === "uploading"),
@@ -125,7 +128,7 @@ const FolderList = ({ files, setFolders }) => {
     });
     return segments;
   }, [files]);
-  setFolders(Object.entries(folders));
+  useEffect(() => setFolders(Object.entries(folders)), [folders, setFolders]);
   return /* @__PURE__ */ jsx(Fragment, { children: Object.entries(folders).map(([name, children], index) => /* @__PURE__ */ jsx(Folder, { name, subItems: children }, index)) });
 };
 

package/dist/esm/hooks/useFileUpload.js

@@ -17,6 +17,7 @@ import { useManager } from '../provider/ManagerContext.js';
 const useFileUpload = ({
   accept = {},
   onAccept,
+  onOpenManager,
   onFileRejected,
   maxSize,
   allowMultiple = true,
@@ -44,7 +45,10 @@ const useFileUpload = ({
   const handleClearFiles = useCallback(() => {
     setFiles([]);
   }, []);
-  const openManager = useCallback(() => setIsManagerOpen(true), []);
+  const openManager = useCallback(() => {
+    setIsManagerOpen(true);
+    onOpenManager?.();
+  }, []);
   const closeManager = useCallback(() => {
     handleClearFiles();
     setIsManagerOpen(false);

package/dist/types/components/Uploader/Root.d.ts

@@ -1,2 +1,2 @@
 import { RootUploaderProps } from './types';
-export declare const Root: <T>({ open, onClose, files, onDelete, dropzoneProps, selectFileText, dropText, buttonText, uploadProgressText, titleModal, isManagerOpen, closeManager, }: RootUploaderProps<T>) => import("react/jsx-runtime").JSX.Element;
+export declare const Root: <T>({ open, onClose, dropzoneProps, selectFileText, dropText, buttonText, titleModal, onDelete, uploadProgressText, files, }: RootUploaderProps<T>) => import("react/jsx-runtime").JSX.Element;

package/dist/types/components/Uploader/index.d.ts

@@ -4,6 +4,6 @@ export declare const Uploader: {
     Dropzone: ({ dropzoneProps, selectFileText, dropText, buttonText, }: import("./types").DropzoneProps) => import("react/jsx-runtime").JSX.Element;
     Files: <T>({ files, onDelete, uploadProgressText, }: import("./types").FilesProps<T>) => import("react/jsx-runtime").JSX.Element;
     Modal: ({ open, onClose, children, title, }: import("./types").ModalProps) => any;
-    Root: <T>({ open, onClose, files, onDelete, dropzoneProps, selectFileText, dropText, buttonText, uploadProgressText, titleModal, isManagerOpen, closeManager, }: import("./types").RootUploaderProps<T>) => import("react/jsx-runtime").JSX.Element;
+    Root: <T>({ open, onClose, dropzoneProps, selectFileText, dropText, buttonText, titleModal, onDelete, uploadProgressText, files, }: import("./types").RootUploaderProps<T>) => import("react/jsx-runtime").JSX.Element;
     Manager: <T>({ open, files, onDelete, uploadProgressText, onClose, }: import("./types").ManagerProps<T>) => any;
 };

package/dist/types/components/Uploader/types.d.ts

@@ -71,8 +71,6 @@ export type FileUpload<T> = {
 export interface RootUploaderProps<T> {
     open: boolean;
     onClose: () => void;
-    isManagerOpen: boolean;
-    closeManager: () => void;
     files: FileUpload<T>[];
     onDelete: (index: number) => void;
     dropzoneProps: UseDropzoneProps;

package/dist/types/hooks/useFileUpload.d.ts

@@ -1,6 +1,6 @@
 import { type DropEvent, type FileRejection } from 'react-dropzone';
 import { AcceptSpecificMap, UseDropzoneProps, type FileUpload } from '../components/Uploader/types';
-interface UseFileUploadOptions<T> {
+interface UseFileUploadOptions {
     accept?: {
         IMAGE?: (typeof AcceptSpecificMap.IMAGE)[number][];
         APPLICATION?: (typeof AcceptSpecificMap.APPLICATION)[number][];
@@ -9,6 +9,7 @@ interface UseFileUploadOptions<T> {
         TEXT?: (typeof AcceptSpecificMap.TEXT)[number][];
     };
     onAccept?: (files: FileUpload<unknown>[]) => Promise<FileUpload<unknown>[]>;
+    onOpenManager?: () => void;
     onFileRejected?: (fileRejections: FileRejection[], event: DropEvent) => void;
     maxSize?: number;
     allowMultiple?: boolean;
@@ -18,7 +19,7 @@ interface UseFileUploadOptions<T> {
     isFolder?: boolean;
     uploadProgressText?: string;
 }
-export declare const useFileUpload: <T>({ accept, onAccept, onFileRejected, maxSize, allowMultiple, preventDuplicates, onDuplicate, hasManager, isFolder, uploadProgressText, }: UseFileUploadOptions<T>) => {
+export declare const useFileUpload: <T>({ accept, onAccept, onOpenManager, onFileRejected, maxSize, allowMultiple, preventDuplicates, onDuplicate, hasManager, isFolder, uploadProgressText, }: UseFileUploadOptions) => {
     onOpen: () => void;
     onClose: () => void;
     onDelete: (index: number) => void;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@tecsinapse/cortex-react",
-  "version": "1.15.0-beta.15",
+  "version": "1.15.0-beta.17",
   "description": "React components based in @tecsinapse/cortex-core",
   "license": "MIT",
   "main": "dist/esm/index.js",
@@ -48,5 +48,5 @@
     "react-icons": ">=5.2.0",
     "tailwind": ">=3.3.0"
   },
-  "gitHead": "9c77aca573d73edc06abafb116f0e16125617a75"
+  "gitHead": "ed21f3b6b622995b034091e9364ff1cc02069adb"
 }