@tecsinapse/cortex-react 1.15.0-beta.2 → 1.15.0-beta.4
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.
- package/dist/cjs/components/Uploader/Manager.js +8 -7
- package/dist/cjs/components/Uploader/Modal.js +1 -2
- package/dist/cjs/components/Uploader/Upload.js +1 -1
- package/dist/cjs/hooks/useFileUpload.js +10 -7
- package/dist/cjs/styles/progressBar.js +1 -1
- package/dist/esm/components/Uploader/Manager.js +9 -8
- package/dist/esm/components/Uploader/Modal.js +1 -2
- package/dist/esm/components/Uploader/Upload.js +1 -1
- package/dist/esm/hooks/useFileUpload.js +10 -7
- package/dist/esm/styles/progressBar.js +1 -1
- package/package.json +3 -3
|
@@ -23,7 +23,7 @@ const Manager = ({
|
|
|
23
23
|
"div",
|
|
24
24
|
{
|
|
25
25
|
className: cortexCore.manager({
|
|
26
|
-
className: "h-auto max-h-[350px] w-[450px] overflow-hidden
|
|
26
|
+
className: "h-auto max-h-[350px] w-[450px] overflow-hidden",
|
|
27
27
|
open
|
|
28
28
|
}),
|
|
29
29
|
children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col w-full h-full gap-mili items-center", children: [
|
|
@@ -31,9 +31,9 @@ const Manager = ({
|
|
|
31
31
|
/* @__PURE__ */ jsxRuntime.jsx(
|
|
32
32
|
Button.Button,
|
|
33
33
|
{
|
|
34
|
-
variants: { variant: "
|
|
34
|
+
variants: { variant: "text", size: "square" },
|
|
35
35
|
onClick: () => setMin((min2) => !min2),
|
|
36
|
-
children: min ? /* @__PURE__ */ jsxRuntime.jsx(io5.
|
|
36
|
+
children: min ? /* @__PURE__ */ jsxRuntime.jsx(io5.IoChevronUp, {}) : /* @__PURE__ */ jsxRuntime.jsx(io5.IoChevronDown, {})
|
|
37
37
|
}
|
|
38
38
|
),
|
|
39
39
|
/* @__PURE__ */ jsxRuntime.jsx("h3", { "data-testid": "upload-progress", children: uploadProgressText }),
|
|
@@ -49,10 +49,11 @@ const Manager = ({
|
|
|
49
49
|
/* @__PURE__ */ jsxRuntime.jsx(
|
|
50
50
|
"div",
|
|
51
51
|
{
|
|
52
|
-
className: clsx.clsx(
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
52
|
+
className: clsx.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
|
+
}),
|
|
56
57
|
children: files.map((file, index) => /* @__PURE__ */ jsxRuntime.jsx(
|
|
57
58
|
Upload.File,
|
|
58
59
|
{
|
|
@@ -21,8 +21,7 @@ const Modal = ({
|
|
|
21
21
|
className: "flex flex-col bg-secondary-xlight rounded-mili min-w-[70vw] max-w-[95vh] max-h-[95vh] overflow-auto",
|
|
22
22
|
children: [
|
|
23
23
|
/* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex w-full items-center justify-between mb-deca", children: [
|
|
24
|
-
/* @__PURE__ */ jsxRuntime.jsx("
|
|
25
|
-
/* @__PURE__ */ jsxRuntime.jsx("h2", { className: "text-deca font-semibold", children: title }),
|
|
24
|
+
/* @__PURE__ */ jsxRuntime.jsx("h2", { className: "text-deca font-semibold ml-tera flex-1 text-center", children: title }),
|
|
26
25
|
/* @__PURE__ */ jsxRuntime.jsx(
|
|
27
26
|
"button",
|
|
28
27
|
{
|
|
@@ -22,7 +22,7 @@ const File = ({
|
|
|
22
22
|
return "info";
|
|
23
23
|
}
|
|
24
24
|
}
|
|
25
|
-
return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col", children: [
|
|
25
|
+
return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col w-full", children: [
|
|
26
26
|
/* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center justify-between border rounded-t-mili shadow p-mili", children: [
|
|
27
27
|
/* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex gap-centi", children: [
|
|
28
28
|
file.file && file.file.type.startsWith("image/") ? /* @__PURE__ */ jsxRuntime.jsx(
|
|
@@ -20,8 +20,17 @@ const useFileUpload = ({
|
|
|
20
20
|
const [isManagerOpen, setIsManagerOpen] = React.useState(false);
|
|
21
21
|
const onOpen = React.useCallback(() => setIsOpen(true), []);
|
|
22
22
|
const onClose = React.useCallback(() => setIsOpen(false), []);
|
|
23
|
+
const handleRemoveFile = React.useCallback((index) => {
|
|
24
|
+
setFiles((prevFiles) => prevFiles.filter((_, i) => i !== index));
|
|
25
|
+
}, []);
|
|
26
|
+
const handleClearFiles = React.useCallback(() => {
|
|
27
|
+
setFiles([]);
|
|
28
|
+
}, []);
|
|
23
29
|
const openManager = React.useCallback(() => setIsManagerOpen(true), []);
|
|
24
|
-
const closeManager = React.useCallback(() =>
|
|
30
|
+
const closeManager = React.useCallback(() => {
|
|
31
|
+
handleClearFiles();
|
|
32
|
+
setIsManagerOpen(false);
|
|
33
|
+
}, []);
|
|
25
34
|
const updateFiles = React.useCallback(
|
|
26
35
|
(prevFiles, newFiles) => {
|
|
27
36
|
const current = /* @__PURE__ */ new Map();
|
|
@@ -89,12 +98,6 @@ const useFileUpload = ({
|
|
|
89
98
|
maxSize,
|
|
90
99
|
onDropRejected: onFileRejected
|
|
91
100
|
});
|
|
92
|
-
const handleRemoveFile = React.useCallback((index) => {
|
|
93
|
-
setFiles((prevFiles) => prevFiles.filter((_, i) => i !== index));
|
|
94
|
-
}, []);
|
|
95
|
-
const handleClearFiles = React.useCallback(() => {
|
|
96
|
-
setFiles([]);
|
|
97
|
-
}, []);
|
|
98
101
|
const isFileLimitReached = !allowMultiple && files.length > 0;
|
|
99
102
|
return {
|
|
100
103
|
onOpen,
|
|
@@ -4,7 +4,7 @@ var tailwindVariants = require('tailwind-variants');
|
|
|
4
4
|
|
|
5
5
|
const ProgressVariants = tailwindVariants.tv({
|
|
6
6
|
slots: {
|
|
7
|
-
container: "relative
|
|
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
|
},
|
|
@@ -5,7 +5,7 @@ import { Button } from '../Button.js';
|
|
|
5
5
|
import { IoMdClose } from 'react-icons/io';
|
|
6
6
|
import { useState } from 'react';
|
|
7
7
|
import { clsx } from 'clsx';
|
|
8
|
-
import {
|
|
8
|
+
import { IoChevronUp, IoChevronDown } from 'react-icons/io5';
|
|
9
9
|
import { manager } from '@tecsinapse/cortex-core';
|
|
10
10
|
|
|
11
11
|
const Manager = ({
|
|
@@ -21,7 +21,7 @@ const Manager = ({
|
|
|
21
21
|
"div",
|
|
22
22
|
{
|
|
23
23
|
className: manager({
|
|
24
|
-
className: "h-auto max-h-[350px] w-[450px] overflow-hidden
|
|
24
|
+
className: "h-auto max-h-[350px] w-[450px] overflow-hidden",
|
|
25
25
|
open
|
|
26
26
|
}),
|
|
27
27
|
children: /* @__PURE__ */ jsxs("div", { className: "flex flex-col w-full h-full gap-mili items-center", children: [
|
|
@@ -29,9 +29,9 @@ const Manager = ({
|
|
|
29
29
|
/* @__PURE__ */ jsx(
|
|
30
30
|
Button,
|
|
31
31
|
{
|
|
32
|
-
variants: { variant: "
|
|
32
|
+
variants: { variant: "text", size: "square" },
|
|
33
33
|
onClick: () => setMin((min2) => !min2),
|
|
34
|
-
children: min ? /* @__PURE__ */ jsx(
|
|
34
|
+
children: min ? /* @__PURE__ */ jsx(IoChevronUp, {}) : /* @__PURE__ */ jsx(IoChevronDown, {})
|
|
35
35
|
}
|
|
36
36
|
),
|
|
37
37
|
/* @__PURE__ */ jsx("h3", { "data-testid": "upload-progress", children: uploadProgressText }),
|
|
@@ -47,10 +47,11 @@ const Manager = ({
|
|
|
47
47
|
/* @__PURE__ */ jsx(
|
|
48
48
|
"div",
|
|
49
49
|
{
|
|
50
|
-
className: clsx(
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
50
|
+
className: clsx("w-full h-auto max-h-[300px] gap-mili", {
|
|
51
|
+
hidden: min,
|
|
52
|
+
"flex flex-col": !min,
|
|
53
|
+
"pb-kilo overflow-scroll pr-deca": files.length > 3
|
|
54
|
+
}),
|
|
54
55
|
children: files.map((file, index) => /* @__PURE__ */ jsx(
|
|
55
56
|
File,
|
|
56
57
|
{
|
|
@@ -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("
|
|
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
|
{
|
|
@@ -20,7 +20,7 @@ const File = ({
|
|
|
20
20
|
return "info";
|
|
21
21
|
}
|
|
22
22
|
}
|
|
23
|
-
return /* @__PURE__ */ jsxs("div", { className: "flex flex-col", children: [
|
|
23
|
+
return /* @__PURE__ */ jsxs("div", { className: "flex flex-col w-full", children: [
|
|
24
24
|
/* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between border rounded-t-mili shadow p-mili", children: [
|
|
25
25
|
/* @__PURE__ */ jsxs("div", { className: "flex gap-centi", children: [
|
|
26
26
|
file.file && file.file.type.startsWith("image/") ? /* @__PURE__ */ jsx(
|
|
@@ -18,8 +18,17 @@ const useFileUpload = ({
|
|
|
18
18
|
const [isManagerOpen, setIsManagerOpen] = useState(false);
|
|
19
19
|
const onOpen = useCallback(() => setIsOpen(true), []);
|
|
20
20
|
const onClose = useCallback(() => setIsOpen(false), []);
|
|
21
|
+
const handleRemoveFile = useCallback((index) => {
|
|
22
|
+
setFiles((prevFiles) => prevFiles.filter((_, i) => i !== index));
|
|
23
|
+
}, []);
|
|
24
|
+
const handleClearFiles = useCallback(() => {
|
|
25
|
+
setFiles([]);
|
|
26
|
+
}, []);
|
|
21
27
|
const openManager = useCallback(() => setIsManagerOpen(true), []);
|
|
22
|
-
const closeManager = useCallback(() =>
|
|
28
|
+
const closeManager = useCallback(() => {
|
|
29
|
+
handleClearFiles();
|
|
30
|
+
setIsManagerOpen(false);
|
|
31
|
+
}, []);
|
|
23
32
|
const updateFiles = useCallback(
|
|
24
33
|
(prevFiles, newFiles) => {
|
|
25
34
|
const current = /* @__PURE__ */ new Map();
|
|
@@ -87,12 +96,6 @@ const useFileUpload = ({
|
|
|
87
96
|
maxSize,
|
|
88
97
|
onDropRejected: onFileRejected
|
|
89
98
|
});
|
|
90
|
-
const handleRemoveFile = useCallback((index) => {
|
|
91
|
-
setFiles((prevFiles) => prevFiles.filter((_, i) => i !== index));
|
|
92
|
-
}, []);
|
|
93
|
-
const handleClearFiles = useCallback(() => {
|
|
94
|
-
setFiles([]);
|
|
95
|
-
}, []);
|
|
96
99
|
const isFileLimitReached = !allowMultiple && files.length > 0;
|
|
97
100
|
return {
|
|
98
101
|
onOpen,
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@tecsinapse/cortex-react",
|
|
3
|
-
"version": "1.15.0-beta.
|
|
3
|
+
"version": "1.15.0-beta.4",
|
|
4
4
|
"description": "React components based in @tecsinapse/cortex-core",
|
|
5
5
|
"license": "MIT",
|
|
6
6
|
"main": "dist/esm/index.js",
|
|
@@ -20,7 +20,7 @@
|
|
|
20
20
|
"dependencies": {
|
|
21
21
|
"@floating-ui/react": "^0.26.18",
|
|
22
22
|
"@internationalized/date": "3.7.0",
|
|
23
|
-
"@tecsinapse/cortex-core": "1.2.0-beta.
|
|
23
|
+
"@tecsinapse/cortex-core": "1.2.0-beta.2",
|
|
24
24
|
"clsx": "2.1.1",
|
|
25
25
|
"currency.js": "2.0.4",
|
|
26
26
|
"embla-carousel-autoplay": "^8.0.0",
|
|
@@ -48,5 +48,5 @@
|
|
|
48
48
|
"react-icons": ">=5.2.0",
|
|
49
49
|
"tailwind": ">=3.3.0"
|
|
50
50
|
},
|
|
51
|
-
"gitHead": "
|
|
51
|
+
"gitHead": "6ef2f05969c284c6aaa5dfbeba21981af8ffce9e"
|
|
52
52
|
}
|