@tecsinapse/cortex-react 1.15.0-beta.2 → 1.15.0-beta.21

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

@@ -1,12 +1,12 @@
 import { jsx, jsxs } from 'react/jsx-runtime';
 import { createPortal } from 'react-dom';
-import { File } from './Upload.js';
+import { File, FolderList } from './Upload.js';
 import { Button } from '../Button.js';
 import { IoMdClose } from 'react-icons/io';
-import { useState } from 'react';
 import { clsx } from 'clsx';
-import { IoArrowUp, IoArrowDown } from 'react-icons/io5';
+import { IoChevronUp, IoChevronDown } from 'react-icons/io5';
 import { manager } from '@tecsinapse/cortex-core';
+import { useManagerHelpers } from '../../hooks/useManagerHelpers.js';
 
 const Manager = ({
   open,
@@ -15,13 +15,15 @@ const Manager = ({
   uploadProgressText = "Upload(s) in progress",
   onClose
 }) => {
-  const [min, setMin] = useState(false);
+  const { min, setMin, regularFiles, folderFiles, totalLength, setFolders } = useManagerHelpers({
+    files
+  });
   return createPortal(
     /* @__PURE__ */ jsx(
       "div",
       {
         className: manager({
-          className: "h-auto max-h-[350px] w-[450px] overflow-hidden pt-deca",
+          className: "h-auto max-h-[350px] w-[450px] overflow-hidden",
           open
         }),
         children: /* @__PURE__ */ jsxs("div", { className: "flex flex-col w-full h-full gap-mili items-center", children: [
@@ -29,9 +31,9 @@ const Manager = ({
             /* @__PURE__ */ jsx(
               Button,
               {
-                variants: { variant: "outline", size: "square" },
+                variants: { variant: "text", size: "square" },
                 onClick: () => setMin((min2) => !min2),
-                children: min ? /* @__PURE__ */ jsx(IoArrowUp, {}) : /* @__PURE__ */ jsx(IoArrowDown, {})
+                children: min ? /* @__PURE__ */ jsx(IoChevronUp, {}) : /* @__PURE__ */ jsx(IoChevronDown, {})
               }
             ),
             /* @__PURE__ */ jsx("h3", { "data-testid": "upload-progress", children: uploadProgressText }),
@@ -44,23 +46,27 @@ const Manager = ({
               }
             )
           ] }),
-          /* @__PURE__ */ jsx(
+          /* @__PURE__ */ jsxs(
             "div",
             {
-              className: clsx(
-                "w-full overflow-scroll h-auto max-h-[300px] px-deca",
-                { hidden: min, "flex flex-col": !min, "pb-deca": files.length > 3 }
-              ),
-              children: files.map((file, index) => /* @__PURE__ */ jsx(
-                File,
-                {
-                  file,
-                  index,
-                  onDelete,
-                  showDelete: false
-                },
-                file.uid
-              ))
+              className: clsx("w-full h-auto max-h-[300px] gap-mili", {
+                hidden: min,
+                "flex flex-col": !min,
+                "pb-kilo overflow-scroll pr-deca": totalLength > 3
+              }),
+              children: [
+                regularFiles.length > 0 ? regularFiles.map((file, index) => /* @__PURE__ */ jsx(
+                  File,
+                  {
+                    file,
+                    index,
+                    onDelete,
+                    showDelete: false
+                  },
+                  file.uid
+                )) : null,
+                folderFiles.length > 0 ? /* @__PURE__ */ jsx(FolderList, { files: folderFiles, setFolders }) : null
+              ]
             }
           )
         ] })

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

@@ -19,8 +19,7 @@ const Modal = ({
         className: "flex flex-col bg-secondary-xlight rounded-mili min-w-[70vw] max-w-[95vh] max-h-[95vh] overflow-auto",
         children: [
           /* @__PURE__ */ jsxs("div", { className: "flex w-full items-center justify-between mb-deca", children: [
-            /* @__PURE__ */ jsx("div", {}),
-            /* @__PURE__ */ jsx("h2", { className: "text-deca font-semibold", children: title }),
+            /* @__PURE__ */ jsx("h2", { className: "text-deca font-semibold ml-tera flex-1 text-center", children: title }),
             /* @__PURE__ */ jsx(
               "button",
               {

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,9 +1,31 @@
-import { jsxs, jsx } from 'react/jsx-runtime';
+import { jsxs, jsx, Fragment } from 'react/jsx-runtime';
 import { button } from '@tecsinapse/cortex-core';
-import { FaRegFileLines } from 'react-icons/fa6';
+import { useMemo, useEffect } from 'react';
+import { FaRegFileLines, FaRegFolder } from 'react-icons/fa6';
 import { MdClose } from 'react-icons/md';
 import { ProgressBar } from '../ProgressBar/ProgressBar.js';
 
+const recursiveCountFolderElements = (node) => {
+  let count = 0;
+  for (const key in node) {
+    count++;
+    count += recursiveCountFolderElements(node[key]);
+  }
+  return count;
+};
+const countFolderElements = (paths, root) => {
+  if (!paths.length) return 0;
+  const tree = {};
+  for (const path of paths) {
+    const parts = path.replace(root + "/", "").split("/").filter(Boolean);
+    let current = tree;
+    for (const part of parts) {
+      if (!current[part]) current[part] = {};
+      current = current[part];
+    }
+  }
+  return recursiveCountFolderElements(tree);
+};
 const File = ({
   file,
   index,
@@ -20,7 +42,7 @@ const File = ({
         return "info";
     }
   }
-  return /* @__PURE__ */ jsxs("div", { className: "flex flex-col", children: [
+  return /* @__PURE__ */ jsxs("div", { className: "flex flex-col w-full", children: [
     /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between border rounded-t-mili shadow p-mili", children: [
       /* @__PURE__ */ jsxs("div", { className: "flex gap-centi", children: [
         file.file && file.file.type.startsWith("image/") ? /* @__PURE__ */ jsx(
@@ -42,7 +64,7 @@ const File = ({
       file.status === "success" && showDelete ? /* @__PURE__ */ jsx(
         "button",
         {
-          onClick: () => onDelete(index),
+          onClick: () => onDelete?.(index),
           "data-testid": "remove-button",
           className: button({
             className: " bg-inherit border-2 border-primary-light text-primary-light",
@@ -61,5 +83,53 @@ const File = ({
     )
   ] }, index);
 };
+const Folder = ({ name, subItems }) => {
+  const size = useMemo(
+    () => countFolderElements(
+      subItems.map((it) => it.path),
+      name
+    ),
+    [subItems, name]
+  );
+  const loading = useMemo(
+    () => subItems.some((it) => it.status === "uploading"),
+    [subItems]
+  );
+  const intent = useMemo(() => {
+    if (loading) return "info";
+    if ((subItems ?? []).some((item) => item.status === "error") && (subItems ?? []).some((item) => item.status === "success")) {
+      return "warning";
+    }
+    return "success";
+  }, [subItems]);
+  return /* @__PURE__ */ jsxs("div", { className: "flex flex-col w-full", children: [
+    /* @__PURE__ */ jsx("div", { className: "flex items-center justify-between border rounded-t-mili shadow p-mili", children: /* @__PURE__ */ jsxs("div", { className: "flex gap-centi", children: [
+      /* @__PURE__ */ jsx("span", { className: "border-2 text-kilo text-primary-medium w-tera h-tera flex items-center justify-center rounded-mili", children: /* @__PURE__ */ jsx(FaRegFolder, {}) }),
+      /* @__PURE__ */ jsxs("div", { className: "flex-col", children: [
+        /* @__PURE__ */ jsx("p", { className: "font-semibold truncate max-w-[200px]", children: name }),
+        /* @__PURE__ */ jsxs("p", { className: "text-sm text-gray-500", children: [
+          size,
+          " ",
+          size > 1 ? "itens" : "item"
+        ] })
+      ] })
+    ] }) }),
+    /* @__PURE__ */ jsx(ProgressBar, { intent, infinite: loading })
+  ] });
+};
+const FolderList = ({ files, setFolders }) => {
+  const folders = useMemo(() => {
+    const segments = {};
+    files.forEach((file) => {
+      const path = file.file.relativePath.replace(/^\//, "");
+      const root = path.split("/")[0];
+      const current = Array.from(segments?.[root] ?? []);
+      segments[root] = [...current, { path, status: file.status }];
+    });
+    return segments;
+  }, [files]);
+  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)) });
+};
 
-export { File };
+export { File, Folder, FolderList };

package/dist/esm/hooks/useCalendarCell.js

@@ -11,6 +11,7 @@ import 'currency.js';
 import '../provider/MenubarContext.js';
 import '../provider/SnackbarProvider.js';
 import { useCalendarContext } from '../provider/CalendarProvider.js';
+import '../provider/ManagerContext.js';
 
 const useCalendarCell = ({ state, date }) => {
   const { isTodayHighlited } = useCalendarContext();

package/dist/esm/hooks/useFileUpload.js

@@ -1,25 +1,58 @@
-import { useState, useCallback } from 'react';
+import { useState, useCallback, useEffect } from 'react';
 import { useDropzone } from 'react-dropzone';
 import { v4 } from 'uuid';
 import { FileStatus, AcceptSpecificMap } from '../components/Uploader/types.js';
+import 'react/jsx-runtime';
+import '@internationalized/date';
+import 'react-aria';
+import 'react-stately';
+import '../components/Popover/Context.js';
+import '@floating-ui/react';
+import 'currency.js';
+import '../provider/MenubarContext.js';
+import '../provider/SnackbarProvider.js';
+import '../provider/CalendarProvider.js';
+import { useManager } from '../provider/ManagerContext.js';
 
 const useFileUpload = ({
   accept = {},
   onAccept,
+  onOpenManager,
   onFileRejected,
   maxSize,
   allowMultiple = true,
   preventDuplicates = false,
-  onDuplicate
+  onDuplicate,
+  hasManager = true,
+  isFolder = false,
+  uploadProgressText
 }) => {
-  const [files, setFiles] = useState([]);
+  const {
+    showManager,
+    files,
+    setFiles,
+    isOpen: isManagerOpen,
+    setIsOpen: setIsManagerOpen,
+    uploadFiles
+  } = useManager();
   const [duplicates, setDuplicates] = useState([]);
   const [isOpen, setIsOpen] = useState(false);
-  const [isManagerOpen, setIsManagerOpen] = useState(false);
   const onOpen = useCallback(() => setIsOpen(true), []);
   const onClose = useCallback(() => setIsOpen(false), []);
-  const openManager = useCallback(() => setIsManagerOpen(true), []);
-  const closeManager = useCallback(() => setIsManagerOpen(false), []);
+  const handleRemoveFile = useCallback((index) => {
+    setFiles((prevFiles) => prevFiles.filter((_, i) => i !== index));
+  }, []);
+  const handleClearFiles = useCallback(() => {
+    setFiles([]);
+  }, []);
+  const openManager = useCallback(() => {
+    setIsManagerOpen(true);
+    onOpenManager?.();
+  }, []);
+  const closeManager = useCallback(() => {
+    handleClearFiles();
+    setIsManagerOpen(false);
+  }, []);
   const updateFiles = useCallback(
     (prevFiles, newFiles) => {
       const current = /* @__PURE__ */ new Map();
@@ -28,9 +61,12 @@ const useFileUpload = ({
     },
     []
   );
-  const onDrop = async (acceptedFiles) => {
-    openManager();
-    onClose();
+  const onDrop = async (acceptedFiles, fileRejections) => {
+    if (fileRejections.length > 0) return;
+    if (hasManager) {
+      openManager();
+      onClose();
+    }
     let toProcess = acceptedFiles;
     if (preventDuplicates) {
       const found = (acceptedFiles ?? []).filter(
@@ -48,22 +84,20 @@ const useFileUpload = ({
     const newFiles = toProcess.map((file) => ({
       file,
       status: onAccept ? FileStatus.UPLOADING : FileStatus.SUCCESS,
-      uid: v4()
+      uid: v4(),
+      isFolder
     }));
-    try {
-      setFiles((prevFiles) => [...prevFiles, ...newFiles]);
-      if (onAccept) {
-        const updatedFiles = await onAccept(newFiles);
-        setFiles((prevFiles) => updateFiles(prevFiles, updatedFiles));
-      }
-    } catch (e) {
-      const updatedFiles = newFiles.map((f) => ({
-        ...f,
-        status: FileStatus.ERROR
-      }));
-      setFiles((prevFiles) => updateFiles(prevFiles, updatedFiles));
-    }
+    uploadFiles({ onAccept, newFiles, updateFiles });
   };
+  useEffect(() => {
+    if (hasManager) {
+      showManager?.({
+        onClose: closeManager,
+        onDelete: handleRemoveFile,
+        uploadProgressText
+      });
+    }
+  }, [handleRemoveFile, closeManager]);
   const addMimeTypes = (key, acc) => {
     AcceptSpecificMap[key].forEach((mimeType) => {
       acc[mimeType] = [];
@@ -87,12 +121,6 @@ const useFileUpload = ({
     maxSize,
     onDropRejected: onFileRejected
   });
-  const handleRemoveFile = useCallback((index) => {
-    setFiles((prevFiles) => prevFiles.filter((_, i) => i !== index));
-  }, []);
-  const handleClearFiles = useCallback(() => {
-    setFiles([]);
-  }, []);
   const isFileLimitReached = !allowMultiple && files.length > 0;
   return {
     onOpen,

package/dist/esm/hooks/useManagerHelpers.js

@@ -0,0 +1,27 @@
+import { useState, useMemo } from 'react';
+
+const useManagerHelpers = ({
+  files
+}) => {
+  const [min, setMin] = useState(false);
+  const [folders, setFolders] = useState();
+  const folderFiles = useMemo(
+    () => files?.filter((file) => file.isFolder) ?? [],
+    [files]
+  );
+  const regularFiles = useMemo(
+    () => files?.filter((file) => !file.isFolder) ?? [],
+    [files]
+  );
+  const totalLength = (regularFiles ?? []).length + (folders ?? []).length;
+  return {
+    min,
+    setMin,
+    folderFiles,
+    regularFiles,
+    totalLength,
+    setFolders
+  };
+};
+
+export { useManagerHelpers };

package/dist/esm/index.js

@@ -65,6 +65,7 @@ export { SnackbarProvider, useSnackbar } from './provider/SnackbarProvider.js';
 export { MenubarContext } from './provider/MenubarContext.js';
 export { useMenubar } from './provider/useMenubar.js';
 export { CalendarProvider, useCalendarContext } from './provider/CalendarProvider.js';
+export { ManagerProvider, useManager } from './provider/ManagerContext.js';
 export { Context, useAccordionContext } from './components/Accordion/context.js';
 export { BRLMask, CurrencyIMask, ExpressionMasks, Masks, NumberIMask, PercentageIMask, PercentageMask } from './components/Input/masks.js';
 export { Root } from './components/Uploader/Root.js';

package/dist/esm/provider/ManagerContext.js

@@ -0,0 +1,122 @@
+import { jsxs, jsx } from 'react/jsx-runtime';
+import { createContext, useState, useContext } from 'react';
+import { Manager } from '../components/Uploader/Manager.js';
+import 'clsx';
+import '../components/Accordion/context.js';
+import 'react-icons/lia';
+import '@internationalized/date';
+import '../components/Badge.js';
+import 'react-icons/md';
+import '../components/Card.js';
+import '../components/Button.js';
+import 'react-aria';
+import 'react-stately';
+import './MenubarContext.js';
+import './SnackbarProvider.js';
+import './CalendarProvider.js';
+import '../components/Popover/Context.js';
+import 'react-dropzone';
+import 'uuid';
+import { FileStatus } from '../components/Uploader/types.js';
+import '@floating-ui/react';
+import 'currency.js';
+import '../components/Calendar/CalendarCell.js';
+import '@tecsinapse/cortex-core';
+import 'react-icons/fa';
+import 'react-icons/io';
+import 'embla-carousel-react';
+import 'embla-carousel-autoplay';
+import '../components/Checkbox.js';
+import '../components/ColorPicker.js';
+import '../components/DatePicker/DateSegment.js';
+import '../components/DatePicker/DatePickerInputBase.js';
+import '../components/GroupButton.js';
+import '../components/Hint.js';
+import '../components/Input/Box.js';
+import '../components/Input/Face.js';
+import '../components/Input/Left.js';
+import '../components/Input/Mask.js';
+import '../components/Input/Right.js';
+import '../components/Input/Root.js';
+import '../components/Input/Search.js';
+import '../components/Menubar/Left.js';
+import '../styles/menubar.js';
+import '../components/Menubar/Right.js';
+import '../components/Menubar/Dropdown.js';
+import '../components/Menubar/MostUsed.js';
+import '../components/Menubar/MostUsedItem.js';
+import '../components/Menubar/Header.js';
+import '../components/Menubar/Item.js';
+import './CategoriesContext.js';
+import '../components/Menubar/SubItem.js';
+import '../components/Modal.js';
+import '../components/ProgressBar/Progress.js';
+import '../components/RadioButton.js';
+import '../components/Select/GroupedOptions.js';
+import '../components/Select/context.js';
+import '../components/Select/MultiGroupedOptions.js';
+import '../components/Select/MultiOptions.js';
+import '../components/Select/Options.js';
+import '../components/Select/Trigger.js';
+import '../components/Snackbar/BaseSnackbar.js';
+import '../styles/stepNodeVariants.js';
+import '../components/Tag.js';
+import '../components/TextArea/Box.js';
+import '../components/TextArea/Face.js';
+import '../components/TextArea/Left.js';
+import '../components/TextArea/Right.js';
+import '../components/TextArea/Root.js';
+import '../components/TimePicker/TimeFieldInput.js';
+import '../components/Toggle.js';
+import '../components/Tooltip.js';
+import 'react-icons/hi2';
+import 'react-icons/fa6';
+import 'react-dom';
+
+const ManagerContext = createContext(null);
+const ManagerProvider = ({ children }) => {
+  const [props, setProps] = useState({});
+  const [files, setFiles] = useState([]);
+  const [isOpen, setIsOpen] = useState(false);
+  const uploadFiles = async ({
+    onAccept,
+    newFiles,
+    updateFiles
+  }) => {
+    try {
+      setFiles((prevFiles) => [...prevFiles, ...newFiles]);
+      if (onAccept) {
+        const updatedFiles = await onAccept(newFiles);
+        setFiles((prevFiles) => updateFiles(prevFiles, updatedFiles));
+      }
+    } catch (e) {
+      const updatedFiles = newFiles.map((f) => ({
+        ...f,
+        status: FileStatus.ERROR
+      }));
+      setFiles((prevFiles) => updateFiles(prevFiles, updatedFiles));
+    }
+  };
+  const showManager = (_props) => {
+    setProps(_props);
+  };
+  return /* @__PURE__ */ jsxs(
+    ManagerContext.Provider,
+    {
+      value: { showManager, files, setFiles, isOpen, setIsOpen, uploadFiles },
+      children: [
+        children,
+        /* @__PURE__ */ jsx(Manager, { files, open: isOpen, ...props })
+      ]
+    }
+  );
+};
+const useManager = () => {
+  const context = useContext(ManagerContext);
+  if (!context) {
+    throw new Error("useManager must be used within a ManagerProvider");
+  }
+  return context;
+};
+
+export { ManagerProvider, useManager };

package/dist/esm/provider/MenubarProvider.js

@@ -6,6 +6,7 @@ import 'react-stately';
 import { MenubarContext } from './MenubarContext.js';
 import './SnackbarProvider.js';
 import './CalendarProvider.js';
+import './ManagerContext.js';
 import '../components/Popover/Context.js';
 import 'react-dropzone';
 import 'uuid';

package/dist/esm/styles/progressBar.js

@@ -2,7 +2,7 @@ import { tv } from 'tailwind-variants';
 
 const ProgressVariants = tv({
   slots: {
-    container: "relative mb-mili",
+    container: "relative",
     bar: "h-1.5 w-full overflow-hidden bg-secondary-xlight",
     progress: "w-full h-full rounded-mili"
   },

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

@@ -1,2 +1,2 @@
 import { DropzoneProps } from './types';
-export declare const Dropzone: ({ dropzoneProps, selectFileText, dropText, buttonText, }: DropzoneProps) => import("react/jsx-runtime").JSX.Element;
+export declare const Dropzone: ({ dropzoneProps, selectFileText, dropText, buttonText, hasButton, }: DropzoneProps) => import("react/jsx-runtime").JSX.Element;

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/Upload.d.ts

@@ -1,2 +1,4 @@
-import { FileProps } from './types';
+import { FileProps, FolderListProps, FolderProps } from './types';
 export declare const File: <T>({ file, index, onDelete, showDelete, }: FileProps<T>) => import("react/jsx-runtime").JSX.Element;
+export declare const Folder: ({ name, subItems }: FolderProps) => import("react/jsx-runtime").JSX.Element;
+export declare const FolderList: <T>({ files, setFolders }: FolderListProps<T>) => import("react/jsx-runtime").JSX.Element;

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

@@ -1,9 +1,9 @@
 export * from './Root';
 export * from './types';
 export declare const Uploader: {
-    Dropzone: ({ dropzoneProps, selectFileText, dropText, buttonText, }: import("./types").DropzoneProps) => import("react/jsx-runtime").JSX.Element;
+    Dropzone: ({ dropzoneProps, selectFileText, dropText, buttonText, hasButton, }: 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;
 };