@tecsinapse/cortex-react 1.15.0-beta.1 → 1.15.0-beta.11

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 (73) hide show
  1. package/dist/cjs/components/Calendar/Calendar.js +1 -0
  2. package/dist/cjs/components/Calendar/CalendarCell.js +4 -0
  3. package/dist/cjs/components/Calendar/CalendarGrid.js +1 -0
  4. package/dist/cjs/components/Calendar/RangeCalendar.js +1 -0
  5. package/dist/cjs/components/DatePicker/DatePickerInput.js +1 -0
  6. package/dist/cjs/components/DatePicker/DateRangePickerInput.js +1 -0
  7. package/dist/cjs/components/Input/Mask.js +1 -0
  8. package/dist/cjs/components/Input/Search.js +1 -0
  9. package/dist/cjs/components/Menubar/Categories.js +1 -0
  10. package/dist/cjs/components/Menubar/Dropdown.js +1 -0
  11. package/dist/cjs/components/Menubar/Header.js +1 -0
  12. package/dist/cjs/components/Menubar/Item.js +1 -0
  13. package/dist/cjs/components/Menubar/MostUsed.js +1 -0
  14. package/dist/cjs/components/Menubar/Root.js +1 -0
  15. package/dist/cjs/components/Menubar/Search.js +1 -0
  16. package/dist/cjs/components/Menubar/SubItem.js +1 -0
  17. package/dist/cjs/components/Popover/Provider.js +1 -0
  18. package/dist/cjs/components/Select/GroupedOptions.js +1 -0
  19. package/dist/cjs/components/Select/MultiGroupedOptions.js +1 -0
  20. package/dist/cjs/components/Select/MultiOptions.js +1 -0
  21. package/dist/cjs/components/Select/Options.js +1 -0
  22. package/dist/cjs/components/TimePicker/TimePickerInput.js +1 -0
  23. package/dist/cjs/components/Tooltip.js +1 -0
  24. package/dist/cjs/components/Uploader/Manager.js +41 -23
  25. package/dist/cjs/components/Uploader/Modal.js +1 -2
  26. package/dist/cjs/components/Uploader/Upload.js +78 -5
  27. package/dist/cjs/hooks/useCalendarCell.js +1 -0
  28. package/dist/cjs/hooks/useFileUpload.js +50 -13
  29. package/dist/cjs/hooks/useManagerHelpers.js +25 -0
  30. package/dist/cjs/index.js +3 -0
  31. package/dist/cjs/provider/ManagerContext.js +35 -0
  32. package/dist/cjs/provider/MenubarProvider.js +1 -0
  33. package/dist/cjs/styles/progressBar.js +1 -1
  34. package/dist/esm/components/Calendar/Calendar.js +1 -0
  35. package/dist/esm/components/Calendar/CalendarCell.js +4 -0
  36. package/dist/esm/components/Calendar/CalendarGrid.js +1 -0
  37. package/dist/esm/components/Calendar/RangeCalendar.js +1 -0
  38. package/dist/esm/components/DatePicker/DatePickerInput.js +1 -0
  39. package/dist/esm/components/DatePicker/DateRangePickerInput.js +1 -0
  40. package/dist/esm/components/Input/Mask.js +1 -0
  41. package/dist/esm/components/Input/Search.js +1 -0
  42. package/dist/esm/components/Menubar/Categories.js +1 -0
  43. package/dist/esm/components/Menubar/Dropdown.js +1 -0
  44. package/dist/esm/components/Menubar/Header.js +1 -0
  45. package/dist/esm/components/Menubar/Item.js +1 -0
  46. package/dist/esm/components/Menubar/MostUsed.js +1 -0
  47. package/dist/esm/components/Menubar/Root.js +1 -0
  48. package/dist/esm/components/Menubar/Search.js +1 -0
  49. package/dist/esm/components/Menubar/SubItem.js +1 -0
  50. package/dist/esm/components/Popover/Provider.js +1 -0
  51. package/dist/esm/components/Select/GroupedOptions.js +1 -0
  52. package/dist/esm/components/Select/MultiGroupedOptions.js +1 -0
  53. package/dist/esm/components/Select/MultiOptions.js +1 -0
  54. package/dist/esm/components/Select/Options.js +1 -0
  55. package/dist/esm/components/TimePicker/TimePickerInput.js +1 -0
  56. package/dist/esm/components/Tooltip.js +1 -0
  57. package/dist/esm/components/Uploader/Manager.js +42 -24
  58. package/dist/esm/components/Uploader/Modal.js +1 -2
  59. package/dist/esm/components/Uploader/Upload.js +79 -8
  60. package/dist/esm/hooks/useCalendarCell.js +1 -0
  61. package/dist/esm/hooks/useFileUpload.js +51 -14
  62. package/dist/esm/hooks/useManagerHelpers.js +23 -0
  63. package/dist/esm/index.js +1 -0
  64. package/dist/esm/provider/ManagerContext.js +32 -0
  65. package/dist/esm/provider/MenubarProvider.js +1 -0
  66. package/dist/esm/styles/progressBar.js +1 -1
  67. package/dist/types/components/Uploader/Upload.d.ts +4 -2
  68. package/dist/types/components/Uploader/types.d.ts +23 -5
  69. package/dist/types/hooks/useFileUpload.d.ts +6 -2
  70. package/dist/types/hooks/useManagerHelpers.d.ts +9 -0
  71. package/dist/types/provider/ManagerContext.d.ts +14 -0
  72. package/dist/types/provider/index.d.ts +1 -0
  73. package/package.json +3 -3
@@ -8,6 +8,7 @@ require('react-stately');
8
8
  var MenubarContext = require('./MenubarContext.js');
9
9
  require('./SnackbarProvider.js');
10
10
  require('./CalendarProvider.js');
11
+ require('./ManagerContext.js');
11
12
  require('../components/Popover/Context.js');
12
13
  require('react-dropzone');
13
14
  require('uuid');
@@ -4,7 +4,7 @@ var tailwindVariants = require('tailwind-variants');
4
4
 
5
5
  const ProgressVariants = tailwindVariants.tv({
6
6
  slots: {
7
- container: "relative mb-mili",
7
+ container: "relative",
8
8
  bar: "h-1.5 w-full overflow-hidden bg-secondary-xlight",
9
9
  progress: "w-full h-full rounded-mili"
10
10
  },
@@ -6,6 +6,7 @@ import 'react-aria';
6
6
  import '../../provider/MenubarContext.js';
7
7
  import '../../provider/SnackbarProvider.js';
8
8
  import { CalendarProvider } from '../../provider/CalendarProvider.js';
9
+ import '../../provider/ManagerContext.js';
9
10
  import 'react-stately';
10
11
  import '../Popover/Context.js';
11
12
  import 'react-dropzone';
@@ -7,6 +7,10 @@ import { useCalendarCell } from '../../hooks/useCalendarCell.js';
7
7
  import '../Popover/Context.js';
8
8
  import 'react-dropzone';
9
9
  import 'uuid';
10
+ import '../../provider/MenubarContext.js';
11
+ import '../../provider/SnackbarProvider.js';
12
+ import '../../provider/CalendarProvider.js';
13
+ import '../../provider/ManagerContext.js';
10
14
  import '@floating-ui/react';
11
15
  import 'currency.js';
12
16
  import { calendarCell } from '../../styles/calendar-cell.js';
@@ -6,6 +6,7 @@ import 'react';
6
6
  import '../../provider/MenubarContext.js';
7
7
  import '../../provider/SnackbarProvider.js';
8
8
  import '../../provider/CalendarProvider.js';
9
+ import '../../provider/ManagerContext.js';
9
10
  import { useCalendarGrid } from '../../hooks/useCalendarGrid.js';
10
11
  import '../Popover/Context.js';
11
12
  import 'react-dropzone';
@@ -6,6 +6,7 @@ import 'react';
6
6
  import '../../provider/MenubarContext.js';
7
7
  import '../../provider/SnackbarProvider.js';
8
8
  import { CalendarProvider } from '../../provider/CalendarProvider.js';
9
+ import '../../provider/ManagerContext.js';
9
10
  import '../Popover/Context.js';
10
11
  import 'react-dropzone';
11
12
  import 'uuid';
@@ -7,6 +7,7 @@ import 'react';
7
7
  import '../../provider/MenubarContext.js';
8
8
  import '../../provider/SnackbarProvider.js';
9
9
  import '../../provider/CalendarProvider.js';
10
+ import '../../provider/ManagerContext.js';
10
11
  import { useDatePickerInput } from '../../hooks/useDatePickerInput.js';
11
12
  import { useDatePickerInputCommon } from '../../hooks/useDatePickerInputCommon.js';
12
13
  import 'react-dropzone';
@@ -7,6 +7,7 @@ import 'react';
7
7
  import '../../provider/MenubarContext.js';
8
8
  import '../../provider/SnackbarProvider.js';
9
9
  import '../../provider/CalendarProvider.js';
10
+ import '../../provider/ManagerContext.js';
10
11
  import { useDatePickerInputCommon } from '../../hooks/useDatePickerInputCommon.js';
11
12
  import { useDateRangePickerInput } from '../../hooks/useDateRangePickerInput.js';
12
13
  import 'react-dropzone';
@@ -6,6 +6,7 @@ import 'react-stately';
6
6
  import '../../provider/MenubarContext.js';
7
7
  import '../../provider/SnackbarProvider.js';
8
8
  import '../../provider/CalendarProvider.js';
9
+ import '../../provider/ManagerContext.js';
9
10
  import '../Popover/Context.js';
10
11
  import 'react-dropzone';
11
12
  import 'uuid';
@@ -7,6 +7,7 @@ import 'react-stately';
7
7
  import '../../provider/MenubarContext.js';
8
8
  import '../../provider/SnackbarProvider.js';
9
9
  import '../../provider/CalendarProvider.js';
10
+ import '../../provider/ManagerContext.js';
10
11
  import '../Popover/Context.js';
11
12
  import { useDebouncedState } from '../../hooks/useDebouncedState.js';
12
13
  import 'react-dropzone';
@@ -7,6 +7,7 @@ import 'react';
7
7
  import '../../provider/MenubarContext.js';
8
8
  import '../../provider/SnackbarProvider.js';
9
9
  import '../../provider/CalendarProvider.js';
10
+ import '../../provider/ManagerContext.js';
10
11
  import '../Popover/Context.js';
11
12
  import { useDimensions } from '../../hooks/useDimensions.js';
12
13
  import 'react-dropzone';
@@ -14,6 +14,7 @@ import '../../provider/MenubarContext.js';
14
14
  import '../../provider/SnackbarProvider.js';
15
15
  import { useMenubar } from '../../provider/useMenubar.js';
16
16
  import '../../provider/CalendarProvider.js';
17
+ import '../../provider/ManagerContext.js';
17
18
 
18
19
  const { dropdown } = menubar();
19
20
  const Dropdown = ({ children, ...rest }) => {
@@ -13,6 +13,7 @@ import '../../provider/MenubarContext.js';
13
13
  import '../../provider/SnackbarProvider.js';
14
14
  import { useMenubar } from '../../provider/useMenubar.js';
15
15
  import '../../provider/CalendarProvider.js';
16
+ import '../../provider/ManagerContext.js';
16
17
  import { menubar } from '../../styles/menubar.js';
17
18
  import { Button } from '../Button.js';
18
19
 
@@ -13,6 +13,7 @@ import '../../provider/MenubarContext.js';
13
13
  import '../../provider/SnackbarProvider.js';
14
14
  import { useMenubar } from '../../provider/useMenubar.js';
15
15
  import '../../provider/CalendarProvider.js';
16
+ import '../../provider/ManagerContext.js';
16
17
  import { item } from '../../styles/menubar.js';
17
18
  import IconControlSubItem from './IconControlSubItem.js';
18
19
  import ItemLink from './ItemLink.js';
@@ -7,6 +7,7 @@ import 'react';
7
7
  import '../../provider/MenubarContext.js';
8
8
  import '../../provider/SnackbarProvider.js';
9
9
  import '../../provider/CalendarProvider.js';
10
+ import '../../provider/ManagerContext.js';
10
11
  import '../Popover/Context.js';
11
12
  import { useDimensions } from '../../hooks/useDimensions.js';
12
13
  import 'react-dropzone';
@@ -4,6 +4,7 @@ import '../../provider/SnackbarProvider.js';
4
4
  import '../../provider/MenubarContext.js';
5
5
  import 'react';
6
6
  import '../../provider/CalendarProvider.js';
7
+ import '../../provider/ManagerContext.js';
7
8
 
8
9
  const Root = ({ children }) => {
9
10
  return /* @__PURE__ */ jsx(MenubarProvider, { children });
@@ -15,6 +15,7 @@ import '../../provider/MenubarContext.js';
15
15
  import '../../provider/SnackbarProvider.js';
16
16
  import { useMenubar } from '../../provider/useMenubar.js';
17
17
  import '../../provider/CalendarProvider.js';
18
+ import '../../provider/ManagerContext.js';
18
19
 
19
20
  const Search = (props) => {
20
21
  const [show] = useMenubar();
@@ -14,6 +14,7 @@ import '../../provider/MenubarContext.js';
14
14
  import '../../provider/SnackbarProvider.js';
15
15
  import { useMenubar } from '../../provider/useMenubar.js';
16
16
  import '../../provider/CalendarProvider.js';
17
+ import '../../provider/ManagerContext.js';
17
18
 
18
19
  const { container } = subItem();
19
20
  const SubItem = ({
@@ -6,6 +6,7 @@ import 'react';
6
6
  import '../../provider/MenubarContext.js';
7
7
  import '../../provider/SnackbarProvider.js';
8
8
  import '../../provider/CalendarProvider.js';
9
+ import '../../provider/ManagerContext.js';
9
10
  import { Context } from './Context.js';
10
11
  import 'react-dropzone';
11
12
  import 'uuid';
@@ -7,6 +7,7 @@ import 'react-stately';
7
7
  import '../../provider/MenubarContext.js';
8
8
  import '../../provider/SnackbarProvider.js';
9
9
  import '../../provider/CalendarProvider.js';
10
+ import '../../provider/ManagerContext.js';
10
11
  import { usePopoverContext } from '../Popover/Context.js';
11
12
  import 'react-dropzone';
12
13
  import 'uuid';
@@ -7,6 +7,7 @@ import 'react-stately';
7
7
  import '../../provider/MenubarContext.js';
8
8
  import '../../provider/SnackbarProvider.js';
9
9
  import '../../provider/CalendarProvider.js';
10
+ import '../../provider/ManagerContext.js';
10
11
  import '../Popover/Context.js';
11
12
  import 'react-dropzone';
12
13
  import 'uuid';
@@ -7,6 +7,7 @@ import 'react-stately';
7
7
  import '../../provider/MenubarContext.js';
8
8
  import '../../provider/SnackbarProvider.js';
9
9
  import '../../provider/CalendarProvider.js';
10
+ import '../../provider/ManagerContext.js';
10
11
  import '../Popover/Context.js';
11
12
  import 'react-dropzone';
12
13
  import 'uuid';
@@ -7,6 +7,7 @@ import 'react-stately';
7
7
  import '../../provider/MenubarContext.js';
8
8
  import '../../provider/SnackbarProvider.js';
9
9
  import '../../provider/CalendarProvider.js';
10
+ import '../../provider/ManagerContext.js';
10
11
  import { usePopoverContext } from '../Popover/Context.js';
11
12
  import 'react-dropzone';
12
13
  import 'uuid';
@@ -6,6 +6,7 @@ import 'react';
6
6
  import '../../provider/MenubarContext.js';
7
7
  import '../../provider/SnackbarProvider.js';
8
8
  import '../../provider/CalendarProvider.js';
9
+ import '../../provider/ManagerContext.js';
9
10
  import '../Popover/Context.js';
10
11
  import 'react-dropzone';
11
12
  import 'uuid';
@@ -8,6 +8,7 @@ import { cloneWithProps } from '../utils/react.js';
8
8
  import '../provider/MenubarContext.js';
9
9
  import '../provider/SnackbarProvider.js';
10
10
  import '../provider/CalendarProvider.js';
11
+ import '../provider/ManagerContext.js';
11
12
  import './Popover/Context.js';
12
13
  import 'react-dropzone';
13
14
  import 'uuid';
@@ -1,19 +1,13 @@
1
1
  import { jsx, jsxs } from 'react/jsx-runtime';
2
- import { tv } from 'tailwind-variants';
3
2
  import { createPortal } from 'react-dom';
4
- import { File } from './Upload.js';
3
+ import { File, FolderList } from './Upload.js';
5
4
  import { Button } from '../Button.js';
6
5
  import { IoMdClose } from 'react-icons/io';
6
+ import { clsx } from 'clsx';
7
+ import { IoChevronUp, IoChevronDown } from 'react-icons/io5';
8
+ import { manager } from '@tecsinapse/cortex-core';
9
+ import { useManagerHelpers } from '../../hooks/useManagerHelpers.js';
7
10
 
8
- const foldermodal = tv({
9
- base: "fixed rounded-micro p-kilo bg-white shadow-xl flex transition z-modal",
10
- variants: {
11
- open: {
12
- true: "scale-100 visible",
13
- false: "invisible"
14
- }
15
- }
16
- });
17
11
  const Manager = ({
18
12
  open,
19
13
  files,
@@ -21,36 +15,60 @@ const Manager = ({
21
15
  uploadProgressText = "Upload(s) in progress",
22
16
  onClose
23
17
  }) => {
18
+ const { min, setMin, regularFiles, folderFiles } = useManagerHelpers({
19
+ files
20
+ });
24
21
  return createPortal(
25
22
  /* @__PURE__ */ jsx(
26
23
  "div",
27
24
  {
28
- className: foldermodal({
29
- className: "h-[350px] w-[400px] bg-white bottom-deca right-deca overflow-hidden",
25
+ className: manager({
26
+ className: "h-auto max-h-[350px] w-[450px] overflow-hidden",
30
27
  open
31
28
  }),
32
29
  children: /* @__PURE__ */ jsxs("div", { className: "flex flex-col w-full h-full gap-mili items-center", children: [
33
30
  /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between w-full", children: [
34
- /* @__PURE__ */ jsx("div", {}),
35
- /* @__PURE__ */ jsx("h3", { className: "ml-mega", "data-testid": "upload-progress", children: uploadProgressText }),
36
31
  /* @__PURE__ */ jsx(
37
32
  Button,
38
33
  {
39
- variants: { variant: "outline", size: "circle" },
34
+ variants: { variant: "text", size: "square" },
35
+ onClick: () => setMin((min2) => !min2),
36
+ children: min ? /* @__PURE__ */ jsx(IoChevronUp, {}) : /* @__PURE__ */ jsx(IoChevronDown, {})
37
+ }
38
+ ),
39
+ /* @__PURE__ */ jsx("h3", { "data-testid": "upload-progress", children: uploadProgressText }),
40
+ /* @__PURE__ */ jsx(
41
+ Button,
42
+ {
43
+ variants: { variant: "filled", size: "square" },
40
44
  onClick: onClose,
41
45
  children: /* @__PURE__ */ jsx(IoMdClose, {})
42
46
  }
43
47
  )
44
48
  ] }),
45
- /* @__PURE__ */ jsx("div", { className: "flex flex-col w-full overflow-scroll", children: files.map((file, index) => /* @__PURE__ */ jsx(
46
- File,
49
+ /* @__PURE__ */ jsxs(
50
+ "div",
47
51
  {
48
- file,
49
- index,
50
- onDelete
51
- },
52
- file.uid
53
- )) })
52
+ className: clsx("w-full h-auto max-h-[300px] gap-mili", {
53
+ hidden: min,
54
+ "flex flex-col": !min,
55
+ "pb-kilo overflow-scroll pr-deca": (files ?? []).length > 3
56
+ }),
57
+ children: [
58
+ regularFiles.length > 0 ? regularFiles.map((file, index) => /* @__PURE__ */ jsx(
59
+ File,
60
+ {
61
+ file,
62
+ index,
63
+ onDelete,
64
+ showDelete: false
65
+ },
66
+ file.uid
67
+ )) : null,
68
+ folderFiles.length > 0 ? /* @__PURE__ */ jsx(FolderList, { files: folderFiles }) : null
69
+ ]
70
+ }
71
+ )
54
72
  ] })
55
73
  }
56
74
  ),
@@ -19,8 +19,7 @@ const Modal = ({
19
19
  className: "flex flex-col bg-secondary-xlight rounded-mili min-w-[70vw] max-w-[95vh] max-h-[95vh] overflow-auto",
20
20
  children: [
21
21
  /* @__PURE__ */ jsxs("div", { className: "flex w-full items-center justify-between mb-deca", children: [
22
- /* @__PURE__ */ jsx("div", {}),
23
- /* @__PURE__ */ jsx("h2", { className: "text-deca font-semibold", children: title }),
22
+ /* @__PURE__ */ jsx("h2", { className: "text-deca font-semibold ml-tera flex-1 text-center", children: title }),
24
23
  /* @__PURE__ */ jsx(
25
24
  "button",
26
25
  {
@@ -1,10 +1,37 @@
1
- import { jsxs, jsx } from 'react/jsx-runtime';
1
+ import { jsxs, jsx, Fragment } from 'react/jsx-runtime';
2
2
  import { button } from '@tecsinapse/cortex-core';
3
- import { FaRegFileLines } from 'react-icons/fa6';
3
+ import { useMemo } from 'react';
4
+ import { FaRegFileLines, FaRegFolder } from 'react-icons/fa6';
4
5
  import { MdClose } from 'react-icons/md';
5
6
  import { ProgressBar } from '../ProgressBar/ProgressBar.js';
6
7
 
7
- const File = ({ file, index, onDelete }) => {
8
+ const recursiveCountFolderElements = (node) => {
9
+ let count = 0;
10
+ for (const key in node) {
11
+ count++;
12
+ count += recursiveCountFolderElements(node[key]);
13
+ }
14
+ return count;
15
+ };
16
+ const countFolderElements = (paths, root) => {
17
+ if (!paths.length) return 0;
18
+ const tree = {};
19
+ for (const path of paths) {
20
+ const parts = path.replace(root + "/", "").split("/").filter(Boolean);
21
+ let current = tree;
22
+ for (const part of parts) {
23
+ if (!current[part]) current[part] = {};
24
+ current = current[part];
25
+ }
26
+ }
27
+ return recursiveCountFolderElements(tree);
28
+ };
29
+ const File = ({
30
+ file,
31
+ index,
32
+ onDelete,
33
+ showDelete = true
34
+ }) => {
8
35
  function statusIntent(status) {
9
36
  switch (status) {
10
37
  case "success":
@@ -15,7 +42,7 @@ const File = ({ file, index, onDelete }) => {
15
42
  return "info";
16
43
  }
17
44
  }
18
- return /* @__PURE__ */ jsxs("div", { className: "flex flex-col", children: [
45
+ return /* @__PURE__ */ jsxs("div", { className: "flex flex-col w-full", children: [
19
46
  /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between border rounded-t-mili shadow p-mili", children: [
20
47
  /* @__PURE__ */ jsxs("div", { className: "flex gap-centi", children: [
21
48
  file.file && file.file.type.startsWith("image/") ? /* @__PURE__ */ jsx(
@@ -34,10 +61,10 @@ const File = ({ file, index, onDelete }) => {
34
61
  ] })
35
62
  ] })
36
63
  ] }),
37
- file.status === "success" && /* @__PURE__ */ jsx(
64
+ file.status === "success" && showDelete ? /* @__PURE__ */ jsx(
38
65
  "button",
39
66
  {
40
- onClick: () => onDelete(index),
67
+ onClick: () => onDelete?.(index),
41
68
  "data-testid": "remove-button",
42
69
  className: button({
43
70
  className: " bg-inherit border-2 border-primary-light text-primary-light",
@@ -45,7 +72,7 @@ const File = ({ file, index, onDelete }) => {
45
72
  }),
46
73
  children: /* @__PURE__ */ jsx(MdClose, { size: 15 })
47
74
  }
48
- )
75
+ ) : null
49
76
  ] }),
50
77
  /* @__PURE__ */ jsx(
51
78
  ProgressBar,
@@ -56,5 +83,49 @@ const File = ({ file, index, onDelete }) => {
56
83
  )
57
84
  ] }, index);
58
85
  };
86
+ const Folder = ({ name, subItems }) => {
87
+ const size = countFolderElements(
88
+ subItems.map((it) => it.path),
89
+ name
90
+ );
91
+ const loading = useMemo(
92
+ () => subItems.some((it) => it.status === "uploading"),
93
+ [subItems]
94
+ );
95
+ const intent = useMemo(() => {
96
+ if (loading) return "info";
97
+ if ((subItems ?? []).some((item) => item.status === "error") && (subItems ?? []).some((item) => item.status === "success")) {
98
+ return "warning";
99
+ }
100
+ return "success";
101
+ }, [subItems]);
102
+ return /* @__PURE__ */ jsxs("div", { className: "flex flex-col w-full", children: [
103
+ /* @__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: [
104
+ /* @__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, {}) }),
105
+ /* @__PURE__ */ jsxs("div", { className: "flex-col", children: [
106
+ /* @__PURE__ */ jsx("p", { className: "font-semibold truncate max-w-[200px]", children: name }),
107
+ /* @__PURE__ */ jsxs("p", { className: "text-sm text-gray-500", children: [
108
+ size,
109
+ " ",
110
+ size > 1 ? "itens" : "item"
111
+ ] })
112
+ ] })
113
+ ] }) }),
114
+ /* @__PURE__ */ jsx(ProgressBar, { intent, infinite: loading })
115
+ ] });
116
+ };
117
+ const FolderList = ({ files }) => {
118
+ const folders = useMemo(() => {
119
+ const segments = {};
120
+ files.forEach((file) => {
121
+ const path = file.file.relativePath.replace(/^\//, "");
122
+ const root = path.split("/")[0];
123
+ const current = Array.from(segments?.[root] ?? []);
124
+ segments[root] = [...current, { path, status: file.status }];
125
+ });
126
+ return segments;
127
+ }, [files]);
128
+ return /* @__PURE__ */ jsx(Fragment, { children: Object.entries(folders).map(([name, children], index) => /* @__PURE__ */ jsx(Folder, { name, subItems: children }, index)) });
129
+ };
59
130
 
60
- export { File };
131
+ export { File, Folder, FolderList };
@@ -11,6 +11,7 @@ import 'currency.js';
11
11
  import '../provider/MenubarContext.js';
12
12
  import '../provider/SnackbarProvider.js';
13
13
  import { useCalendarContext } from '../provider/CalendarProvider.js';
14
+ import '../provider/ManagerContext.js';
14
15
 
15
16
  const useCalendarCell = ({ state, date }) => {
16
17
  const { isTodayHighlited } = useCalendarContext();
@@ -1,7 +1,18 @@
1
- import { useState, useCallback } from 'react';
1
+ import { useState, useCallback, useEffect } from 'react';
2
2
  import { useDropzone } from 'react-dropzone';
3
3
  import { v4 } from 'uuid';
4
4
  import { FileStatus, AcceptSpecificMap } from '../components/Uploader/types.js';
5
+ import 'react/jsx-runtime';
6
+ import '@internationalized/date';
7
+ import 'react-aria';
8
+ import 'react-stately';
9
+ import '../components/Popover/Context.js';
10
+ import '@floating-ui/react';
11
+ import 'currency.js';
12
+ import '../provider/MenubarContext.js';
13
+ import '../provider/SnackbarProvider.js';
14
+ import '../provider/CalendarProvider.js';
15
+ import { useManager } from '../provider/ManagerContext.js';
5
16
 
6
17
  const useFileUpload = ({
7
18
  accept = {},
@@ -10,16 +21,33 @@ const useFileUpload = ({
10
21
  maxSize,
11
22
  allowMultiple = true,
12
23
  preventDuplicates = false,
13
- onDuplicate
24
+ onDuplicate,
25
+ hasManager = true,
26
+ isFolder = false,
27
+ uploadProgressText
14
28
  }) => {
15
- const [files, setFiles] = useState([]);
29
+ const {
30
+ showManager,
31
+ files,
32
+ setFiles,
33
+ isOpen: isManagerOpen,
34
+ setIsOpen: setIsManagerOpen
35
+ } = useManager();
16
36
  const [duplicates, setDuplicates] = useState([]);
17
37
  const [isOpen, setIsOpen] = useState(false);
18
- const [isManagerOpen, setIsManagerOpen] = useState(false);
19
38
  const onOpen = useCallback(() => setIsOpen(true), []);
20
39
  const onClose = useCallback(() => setIsOpen(false), []);
40
+ const handleRemoveFile = useCallback((index) => {
41
+ setFiles((prevFiles) => prevFiles.filter((_, i) => i !== index));
42
+ }, []);
43
+ const handleClearFiles = useCallback(() => {
44
+ setFiles([]);
45
+ }, []);
21
46
  const openManager = useCallback(() => setIsManagerOpen(true), []);
22
- const closeManager = useCallback(() => setIsManagerOpen(false), []);
47
+ const closeManager = useCallback(() => {
48
+ handleClearFiles();
49
+ setIsManagerOpen(false);
50
+ }, []);
23
51
  const updateFiles = useCallback(
24
52
  (prevFiles, newFiles) => {
25
53
  const current = /* @__PURE__ */ new Map();
@@ -29,8 +57,10 @@ const useFileUpload = ({
29
57
  []
30
58
  );
31
59
  const onDrop = async (acceptedFiles) => {
32
- openManager();
33
- onClose();
60
+ if (hasManager) {
61
+ openManager();
62
+ onClose();
63
+ }
34
64
  let toProcess = acceptedFiles;
35
65
  if (preventDuplicates) {
36
66
  const found = (acceptedFiles ?? []).filter(
@@ -48,7 +78,8 @@ const useFileUpload = ({
48
78
  const newFiles = toProcess.map((file) => ({
49
79
  file,
50
80
  status: onAccept ? FileStatus.UPLOADING : FileStatus.SUCCESS,
51
- uid: v4()
81
+ uid: v4(),
82
+ isFolder
52
83
  }));
53
84
  try {
54
85
  setFiles((prevFiles) => [...prevFiles, ...newFiles]);
@@ -64,6 +95,17 @@ const useFileUpload = ({
64
95
  setFiles((prevFiles) => updateFiles(prevFiles, updatedFiles));
65
96
  }
66
97
  };
98
+ useEffect(() => {
99
+ if (hasManager) {
100
+ showManager?.({
101
+ files,
102
+ onClose: closeManager,
103
+ onDelete: handleRemoveFile,
104
+ open: isManagerOpen,
105
+ uploadProgressText
106
+ });
107
+ }
108
+ }, [isManagerOpen, files, handleRemoveFile, closeManager]);
67
109
  const addMimeTypes = (key, acc) => {
68
110
  AcceptSpecificMap[key].forEach((mimeType) => {
69
111
  acc[mimeType] = [];
@@ -87,12 +129,6 @@ const useFileUpload = ({
87
129
  maxSize,
88
130
  onDropRejected: onFileRejected
89
131
  });
90
- const handleRemoveFile = useCallback((index) => {
91
- setFiles((prevFiles) => prevFiles.filter((_, i) => i !== index));
92
- }, []);
93
- const handleClearFiles = useCallback(() => {
94
- setFiles([]);
95
- }, []);
96
132
  const isFileLimitReached = !allowMultiple && files.length > 0;
97
133
  return {
98
134
  onOpen,
@@ -105,6 +141,7 @@ const useFileUpload = ({
105
141
  isFileLimitReached
106
142
  },
107
143
  open: isOpen,
144
+ openManager,
108
145
  closeManager,
109
146
  isManagerOpen,
110
147
  files,
@@ -0,0 +1,23 @@
1
+ import { useState, useMemo } from 'react';
2
+
3
+ const useManagerHelpers = ({
4
+ files
5
+ }) => {
6
+ const [min, setMin] = useState(false);
7
+ const folderFiles = useMemo(
8
+ () => files?.filter((file) => file.isFolder) ?? [],
9
+ [files]
10
+ );
11
+ const regularFiles = useMemo(
12
+ () => files?.filter((file) => !file.isFolder) ?? [],
13
+ [files]
14
+ );
15
+ return {
16
+ min,
17
+ setMin,
18
+ folderFiles,
19
+ regularFiles
20
+ };
21
+ };
22
+
23
+ export { useManagerHelpers };
package/dist/esm/index.js CHANGED
@@ -65,6 +65,7 @@ export { SnackbarProvider, useSnackbar } from './provider/SnackbarProvider.js';
65
65
  export { MenubarContext } from './provider/MenubarContext.js';
66
66
  export { useMenubar } from './provider/useMenubar.js';
67
67
  export { CalendarProvider, useCalendarContext } from './provider/CalendarProvider.js';
68
+ export { ManagerProvider, useManager } from './provider/ManagerContext.js';
68
69
  export { Context, useAccordionContext } from './components/Accordion/context.js';
69
70
  export { BRLMask, CurrencyIMask, ExpressionMasks, Masks, NumberIMask, PercentageIMask, PercentageMask } from './components/Input/masks.js';
70
71
  export { Root } from './components/Uploader/Root.js';