@tecsinapse/cortex-react 1.9.17 → 1.9.18-beta.0

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.
@@ -4,7 +4,7 @@ var React = require('react');
4
4
  var Progress = require('./Progress.js');
5
5
 
6
6
  const ProgressBar = ({
7
- value = 50,
7
+ value = 100,
8
8
  intent = "default",
9
9
  infinite = false
10
10
  }) => {
@@ -4,6 +4,7 @@ var React = require('react');
4
4
  var hi2 = require('react-icons/hi2');
5
5
  var cortexCore = require('@tecsinapse/cortex-core');
6
6
  var clsx = require('clsx');
7
+ var Tooltip = require('../Tooltip.js');
7
8
 
8
9
  const Dropzone = ({
9
10
  dropzoneProps,
@@ -11,19 +12,20 @@ const Dropzone = ({
11
12
  dropText = "By dragging and dropping it here or clicking the button below",
12
13
  buttonText = "Select File"
13
14
  }) => {
15
+ const { getRootProps, getInputProps, isDragActive, isFileLimitReached } = dropzoneProps;
14
16
  return /* @__PURE__ */ React.createElement(
15
17
  "div",
16
18
  {
17
- ...dropzoneProps.getRootProps(),
19
+ ...getRootProps(),
18
20
  className: clsx(
19
21
  "bg-white w-full border-dashed border-2 p-deca flex flex-col justify-center rounded-mili",
20
22
  {
21
- "border-success-medium bg-gray-100": dropzoneProps.isDragActive
23
+ "border-success-medium bg-gray-100": isDragActive
22
24
  }
23
25
  )
24
26
  },
25
- /* @__PURE__ */ React.createElement("input", { ...dropzoneProps.getInputProps() }),
26
- /* @__PURE__ */ React.createElement("div", { className: "flex flex-col justify-center text-center items-center gap-deca" }, /* @__PURE__ */ React.createElement(hi2.HiOutlineCloudArrowUp, { className: "text-primary-medium", size: 35 }), /* @__PURE__ */ React.createElement("div", { className: "gap-mili" }, /* @__PURE__ */ React.createElement("p", { className: "text-lg font-semibold", "data-testid": "select-dropzone" }, selectFileText), /* @__PURE__ */ React.createElement("p", { className: "text-sm text-secondary-medium" }, dropText)), /* @__PURE__ */ React.createElement("button", { className: cortexCore.button() }, buttonText))
27
+ /* @__PURE__ */ React.createElement("input", { ...getInputProps() }),
28
+ /* @__PURE__ */ React.createElement("div", { className: "flex flex-col justify-center text-center items-center gap-deca" }, /* @__PURE__ */ React.createElement(hi2.HiOutlineCloudArrowUp, { className: "text-primary-medium", size: 35 }), /* @__PURE__ */ React.createElement("div", { className: "gap-mili" }, /* @__PURE__ */ React.createElement("p", { className: "text-lg font-semibold", "data-testid": "select-dropzone" }, selectFileText), /* @__PURE__ */ React.createElement("p", { className: "text-sm text-secondary-medium" }, dropText)), isFileLimitReached ? /* @__PURE__ */ React.createElement(Tooltip.Tooltip, { text: "Voc\xEA s\xF3 pode selecionar um \xFAnico arquivo." }, /* @__PURE__ */ React.createElement("button", { disabled: true, className: clsx(cortexCore.button(), "cursor-not-allowed") }, buttonText)) : /* @__PURE__ */ React.createElement("button", { className: cortexCore.button() }, buttonText))
27
29
  );
28
30
  };
29
31
 
@@ -7,6 +7,16 @@ var md = require('react-icons/md');
7
7
  var ProgressBar = require('../ProgressBar/ProgressBar.js');
8
8
 
9
9
  const File = ({ file, index, onDelete }) => {
10
+ function statusIntent(status) {
11
+ switch (status) {
12
+ case "success":
13
+ return "success";
14
+ case "error":
15
+ return "error";
16
+ default:
17
+ return "info";
18
+ }
19
+ }
10
20
  return /* @__PURE__ */ React.createElement("div", { className: "flex flex-col", key: index }, /* @__PURE__ */ React.createElement("div", { className: "flex items-center justify-between border rounded-t-mili shadow p-mili" }, /* @__PURE__ */ React.createElement("div", { className: "flex gap-centi" }, file.file && file.file.type.startsWith("image/") ? /* @__PURE__ */ React.createElement(
11
21
  "img",
12
22
  {
@@ -25,7 +35,13 @@ const File = ({ file, index, onDelete }) => {
25
35
  })
26
36
  },
27
37
  /* @__PURE__ */ React.createElement(md.MdClose, { size: 20 })
28
- )), /* @__PURE__ */ React.createElement(ProgressBar.ProgressBar, { intent: "info", infinite: file.status !== "success" }));
38
+ )), /* @__PURE__ */ React.createElement(
39
+ ProgressBar.ProgressBar,
40
+ {
41
+ intent: statusIntent(file.status),
42
+ infinite: file.status !== "success"
43
+ }
44
+ ));
29
45
  };
30
46
 
31
47
  exports.File = File;
@@ -68,6 +68,7 @@ const useFileUpload = ({
68
68
  const handleRemoveFile = React.useCallback((index) => {
69
69
  setFiles((prevFiles) => prevFiles.filter((_, i) => i !== index));
70
70
  }, []);
71
+ const isFileLimitReached = !allowMultiple && files.length > 0;
71
72
  return {
72
73
  onOpen,
73
74
  onClose,
@@ -75,7 +76,8 @@ const useFileUpload = ({
75
76
  dropzoneProps: {
76
77
  getInputProps,
77
78
  getRootProps,
78
- isDragActive
79
+ isDragActive,
80
+ isFileLimitReached
79
81
  },
80
82
  open: isOpen,
81
83
  files
@@ -2,7 +2,7 @@ import React__default from 'react';
2
2
  import { Progress } from './Progress.js';
3
3
 
4
4
  const ProgressBar = ({
5
- value = 50,
5
+ value = 100,
6
6
  intent = "default",
7
7
  infinite = false
8
8
  }) => {
@@ -2,6 +2,7 @@ import React__default from 'react';
2
2
  import { HiOutlineCloudArrowUp } from 'react-icons/hi2';
3
3
  import { button } from '@tecsinapse/cortex-core';
4
4
  import clsx from 'clsx';
5
+ import { Tooltip } from '../Tooltip.js';
5
6
 
6
7
  const Dropzone = ({
7
8
  dropzoneProps,
@@ -9,19 +10,20 @@ const Dropzone = ({
9
10
  dropText = "By dragging and dropping it here or clicking the button below",
10
11
  buttonText = "Select File"
11
12
  }) => {
13
+ const { getRootProps, getInputProps, isDragActive, isFileLimitReached } = dropzoneProps;
12
14
  return /* @__PURE__ */ React__default.createElement(
13
15
  "div",
14
16
  {
15
- ...dropzoneProps.getRootProps(),
17
+ ...getRootProps(),
16
18
  className: clsx(
17
19
  "bg-white w-full border-dashed border-2 p-deca flex flex-col justify-center rounded-mili",
18
20
  {
19
- "border-success-medium bg-gray-100": dropzoneProps.isDragActive
21
+ "border-success-medium bg-gray-100": isDragActive
20
22
  }
21
23
  )
22
24
  },
23
- /* @__PURE__ */ React__default.createElement("input", { ...dropzoneProps.getInputProps() }),
24
- /* @__PURE__ */ React__default.createElement("div", { className: "flex flex-col justify-center text-center items-center gap-deca" }, /* @__PURE__ */ React__default.createElement(HiOutlineCloudArrowUp, { className: "text-primary-medium", size: 35 }), /* @__PURE__ */ React__default.createElement("div", { className: "gap-mili" }, /* @__PURE__ */ React__default.createElement("p", { className: "text-lg font-semibold", "data-testid": "select-dropzone" }, selectFileText), /* @__PURE__ */ React__default.createElement("p", { className: "text-sm text-secondary-medium" }, dropText)), /* @__PURE__ */ React__default.createElement("button", { className: button() }, buttonText))
25
+ /* @__PURE__ */ React__default.createElement("input", { ...getInputProps() }),
26
+ /* @__PURE__ */ React__default.createElement("div", { className: "flex flex-col justify-center text-center items-center gap-deca" }, /* @__PURE__ */ React__default.createElement(HiOutlineCloudArrowUp, { className: "text-primary-medium", size: 35 }), /* @__PURE__ */ React__default.createElement("div", { className: "gap-mili" }, /* @__PURE__ */ React__default.createElement("p", { className: "text-lg font-semibold", "data-testid": "select-dropzone" }, selectFileText), /* @__PURE__ */ React__default.createElement("p", { className: "text-sm text-secondary-medium" }, dropText)), isFileLimitReached ? /* @__PURE__ */ React__default.createElement(Tooltip, { text: "Voc\xEA s\xF3 pode selecionar um \xFAnico arquivo." }, /* @__PURE__ */ React__default.createElement("button", { disabled: true, className: clsx(button(), "cursor-not-allowed") }, buttonText)) : /* @__PURE__ */ React__default.createElement("button", { className: button() }, buttonText))
25
27
  );
26
28
  };
27
29
 
@@ -5,6 +5,16 @@ import { MdClose } from 'react-icons/md';
5
5
  import { ProgressBar } from '../ProgressBar/ProgressBar.js';
6
6
 
7
7
  const File = ({ file, index, onDelete }) => {
8
+ function statusIntent(status) {
9
+ switch (status) {
10
+ case "success":
11
+ return "success";
12
+ case "error":
13
+ return "error";
14
+ default:
15
+ return "info";
16
+ }
17
+ }
8
18
  return /* @__PURE__ */ React__default.createElement("div", { className: "flex flex-col", key: index }, /* @__PURE__ */ React__default.createElement("div", { className: "flex items-center justify-between border rounded-t-mili shadow p-mili" }, /* @__PURE__ */ React__default.createElement("div", { className: "flex gap-centi" }, file.file && file.file.type.startsWith("image/") ? /* @__PURE__ */ React__default.createElement(
9
19
  "img",
10
20
  {
@@ -23,7 +33,13 @@ const File = ({ file, index, onDelete }) => {
23
33
  })
24
34
  },
25
35
  /* @__PURE__ */ React__default.createElement(MdClose, { size: 20 })
26
- )), /* @__PURE__ */ React__default.createElement(ProgressBar, { intent: "info", infinite: file.status !== "success" }));
36
+ )), /* @__PURE__ */ React__default.createElement(
37
+ ProgressBar,
38
+ {
39
+ intent: statusIntent(file.status),
40
+ infinite: file.status !== "success"
41
+ }
42
+ ));
27
43
  };
28
44
 
29
45
  export { File };
@@ -66,6 +66,7 @@ const useFileUpload = ({
66
66
  const handleRemoveFile = useCallback((index) => {
67
67
  setFiles((prevFiles) => prevFiles.filter((_, i) => i !== index));
68
68
  }, []);
69
+ const isFileLimitReached = !allowMultiple && files.length > 0;
69
70
  return {
70
71
  onOpen,
71
72
  onClose,
@@ -73,7 +74,8 @@ const useFileUpload = ({
73
74
  dropzoneProps: {
74
75
  getInputProps,
75
76
  getRootProps,
76
- isDragActive
77
+ isDragActive,
78
+ isFileLimitReached
77
79
  },
78
80
  open: isOpen,
79
81
  files
@@ -18,12 +18,14 @@ export interface UseDropzoneProps {
18
18
  getRootProps: <T extends DropzoneRootProps>(props?: T) => T;
19
19
  getInputProps: <T extends DropzoneInputProps>(props?: T) => T;
20
20
  isDragActive: boolean;
21
+ isFileLimitReached: boolean;
21
22
  }
22
23
  export interface DropzoneProps {
23
24
  dropzoneProps: UseDropzoneProps;
24
25
  selectFileText?: string;
25
26
  dropText?: string;
26
27
  buttonText?: string;
28
+ isFileLimitReached?: boolean;
27
29
  }
28
30
  export interface ModalProps {
29
31
  open: boolean;
@@ -40,7 +42,7 @@ export type FileUpload<T> = {
40
42
  file: File;
41
43
  metadata?: T;
42
44
  uid: string;
43
- status: FileStatus;
45
+ status: 'success' | 'error' | 'uploading';
44
46
  };
45
47
  export interface RootUploaderProps<T> {
46
48
  open: boolean;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@tecsinapse/cortex-react",
3
- "version": "1.9.17",
3
+ "version": "1.9.18-beta.0",
4
4
  "description": "React components based in @tecsinapse/cortex-core",
5
5
  "license": "MIT",
6
6
  "main": "dist/esm/index.js",
@@ -48,5 +48,5 @@
48
48
  "react-dom": ">=18.0.0",
49
49
  "tailwind": ">=3.3.0"
50
50
  },
51
- "gitHead": "54a3803d3508ab42402e82c1a459173ad7d03579"
51
+ "gitHead": "5727a77e217321612dfb73ea9bf72a9db88c4930"
52
52
  }