mainstack-design-system 1.23.0 → 1.23.1
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/index.d.ts +6 -4
- package/dist/mainstack-design-system17.cjs +1 -1
- package/dist/mainstack-design-system17.js +24 -22
- package/dist/mainstack-design-system28.cjs +1 -1
- package/dist/mainstack-design-system28.js +27 -25
- package/dist/mainstack-design-system29.cjs +1 -1
- package/dist/mainstack-design-system29.js +91 -74
- package/package.json +1 -1
package/dist/index.d.ts
CHANGED
|
@@ -4365,7 +4365,7 @@ export declare type FileUploaderFileType = {
|
|
|
4365
4365
|
|
|
4366
4366
|
export declare const FileUploaderGroup: {
|
|
4367
4367
|
Root: {
|
|
4368
|
-
({ values: controlledValues, onValuesChange: controlledonValuesChange, defaultValues, isDisabled, accept, maxFiles, minSize, maxSize, multiple, onError: externalOnError, children, className, isError, uploadModalOpen: controlledUploadModalOpen, defaultUploadModalOpen, onUploadModalOpenChange: controlledOnUploadModalOpenChange, onUpload, uploadProgress, isUploading, ...props }: FileUploaderRootProps): JSX.Element;
|
|
4368
|
+
({ values: controlledValues, onValuesChange: controlledonValuesChange, defaultValues, isDisabled, accept, maxFiles, minSize, maxSize, multiple, onError: externalOnError, children, className, isError, uploadModalOpen: controlledUploadModalOpen, defaultUploadModalOpen, onUploadModalOpenChange: controlledOnUploadModalOpenChange, onUpload, onCancelUpload, uploadProgress, isUploading, ...props }: FileUploaderRootProps): JSX.Element;
|
|
4369
4369
|
displayName: string;
|
|
4370
4370
|
};
|
|
4371
4371
|
DropZone: {
|
|
@@ -4426,7 +4426,7 @@ export declare interface FileUploaderPreviewProps extends Omit<ComponentPropsWit
|
|
|
4426
4426
|
}
|
|
4427
4427
|
|
|
4428
4428
|
export declare const FileUploaderRoot: {
|
|
4429
|
-
({ values: controlledValues, onValuesChange: controlledonValuesChange, defaultValues, isDisabled, accept, maxFiles, minSize, maxSize, multiple, onError: externalOnError, children, className, isError, uploadModalOpen: controlledUploadModalOpen, defaultUploadModalOpen, onUploadModalOpenChange: controlledOnUploadModalOpenChange, onUpload, uploadProgress, isUploading, ...props }: FileUploaderRootProps): JSX.Element;
|
|
4429
|
+
({ values: controlledValues, onValuesChange: controlledonValuesChange, defaultValues, isDisabled, accept, maxFiles, minSize, maxSize, multiple, onError: externalOnError, children, className, isError, uploadModalOpen: controlledUploadModalOpen, defaultUploadModalOpen, onUploadModalOpenChange: controlledOnUploadModalOpenChange, onUpload, onCancelUpload, uploadProgress, isUploading, ...props }: FileUploaderRootProps): JSX.Element;
|
|
4430
4430
|
displayName: string;
|
|
4431
4431
|
};
|
|
4432
4432
|
|
|
@@ -4436,6 +4436,7 @@ export declare interface FileUploaderRootProps extends default_2.ComponentPropsW
|
|
|
4436
4436
|
defaultUploadModalOpen?: boolean;
|
|
4437
4437
|
onUploadModalOpenChange?: (open: boolean) => void;
|
|
4438
4438
|
onUpload?: (values: FileUploaderFileType[]) => void;
|
|
4439
|
+
onCancelUpload?: (value: FileUploaderFileType) => void;
|
|
4439
4440
|
uploadProgress?: UploaderProgressType;
|
|
4440
4441
|
isUploading?: boolean;
|
|
4441
4442
|
}
|
|
@@ -4710,7 +4711,7 @@ export declare interface ImageUploaderFileType extends FileUploaderFileType {
|
|
|
4710
4711
|
|
|
4711
4712
|
export declare const ImageUploaderGroup: {
|
|
4712
4713
|
Root: {
|
|
4713
|
-
({ values: controlledValues, onValuesChange: controlledonValuesChange, defaultValues, isDisabled, accept, maxFiles, minSize, maxSize, onError: externalOnError, children, className, isError, uploadModalOpen: controlledUploadModalOpen, defaultUploadModalOpen, onUploadModalOpenChange: controlledOnUploadModalOpenChange, onUpload, uploadProgress, isUploading, ...props }: ImageUploaderRootProps): JSX.Element;
|
|
4714
|
+
({ values: controlledValues, onValuesChange: controlledonValuesChange, defaultValues, isDisabled, accept, maxFiles, minSize, maxSize, onError: externalOnError, children, className, isError, uploadModalOpen: controlledUploadModalOpen, defaultUploadModalOpen, onUploadModalOpenChange: controlledOnUploadModalOpenChange, onUpload, onCancelUpload, uploadProgress, isUploading, ...props }: ImageUploaderRootProps): JSX.Element;
|
|
4714
4715
|
displayName: string;
|
|
4715
4716
|
};
|
|
4716
4717
|
MainPreview: {
|
|
@@ -4793,7 +4794,7 @@ export declare interface ImageUploaderPreviewProps extends Omit<ComponentPropsWi
|
|
|
4793
4794
|
}
|
|
4794
4795
|
|
|
4795
4796
|
export declare const ImageUploaderRoot: {
|
|
4796
|
-
({ values: controlledValues, onValuesChange: controlledonValuesChange, defaultValues, isDisabled, accept, maxFiles, minSize, maxSize, onError: externalOnError, children, className, isError, uploadModalOpen: controlledUploadModalOpen, defaultUploadModalOpen, onUploadModalOpenChange: controlledOnUploadModalOpenChange, onUpload, uploadProgress, isUploading, ...props }: ImageUploaderRootProps): JSX.Element;
|
|
4797
|
+
({ values: controlledValues, onValuesChange: controlledonValuesChange, defaultValues, isDisabled, accept, maxFiles, minSize, maxSize, onError: externalOnError, children, className, isError, uploadModalOpen: controlledUploadModalOpen, defaultUploadModalOpen, onUploadModalOpenChange: controlledOnUploadModalOpenChange, onUpload, onCancelUpload, uploadProgress, isUploading, ...props }: ImageUploaderRootProps): JSX.Element;
|
|
4797
4798
|
displayName: string;
|
|
4798
4799
|
};
|
|
4799
4800
|
|
|
@@ -4803,6 +4804,7 @@ export declare interface ImageUploaderRootProps extends React.ComponentPropsWith
|
|
|
4803
4804
|
defaultUploadModalOpen?: boolean;
|
|
4804
4805
|
onUploadModalOpenChange?: (open: boolean) => void;
|
|
4805
4806
|
onUpload?: (values: ImageUploaderFileType[]) => void;
|
|
4807
|
+
onCancelUpload?: (value: ImageUploaderFileType) => void;
|
|
4806
4808
|
uploadProgress?: UploaderProgressType;
|
|
4807
4809
|
isUploading?: boolean;
|
|
4808
4810
|
}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
1
|
'use client';
|
|
2
|
-
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const y=require("react/jsx-runtime"),i=require("react"),
|
|
2
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const y=require("react/jsx-runtime"),i=require("react"),W=require("./mainstack-design-system26.cjs"),E=require("./index-C8aODXfJ.cjs"),N=require("./utils-CpiHnfHs.cjs"),X=require("./mainstack-design-system29.cjs"),O=({values:I,onValuesChange:k,defaultValues:m=[],isDisabled:u,accept:U={"image/png":[".png",".jpeg",".jpg",".webp"]},maxFiles:a=4,minSize:q,maxSize:d,onError:f,children:B,className:R,isError:P,uploadModalOpen:T,defaultUploadModalOpen:L=!1,onUploadModalOpenChange:$,onUpload:A,onCancelUpload:V,uploadProgress:Y,isUploading:G,...H})=>{const[n,S]=E.useControllableState({prop:I,defaultProp:m,onChange:k}),[t,c]=i.useState(()=>{const e=I||m;return e&&e.length>0?e[0]:null});n&&n.length>0&&!t&&c(n[0]);const[J,h]=i.useState(null),[K,C]=E.useControllableState({prop:T,defaultProp:L,onChange:$}),p=i.useCallback(e=>{h(null),S(e)},[S]),l=i.useCallback(e=>{const o=e instanceof Error?e.message:"An error occurred";h(o),f&&f(e)},[f]),_=i.useCallback(async(e,o,M="replace")=>{const Q=M==="append"?n.length:0,j=a-Q;if(e.length>j||o.length>0){if(e.length>j||o.some(r=>r.errors.some(s=>s.code==="too-many-files")))return l(new Error(`You can only upload a maximum of ${a} images.`));if(o.some(r=>r.errors.some(s=>s.code==="file-too-large"))){const r=d?(d/1048576).toFixed(0):"0";return l(new Error(`Image size exceeds the ${r}MB limit.`))}return l(new Error("Invalid image type or criteria."))}try{const g=N.generateImageFilePreview(e),r=M==="append"?n:[],s=g.filter(v=>!r.some(b=>b.fileName===v.fileName&&b.fileSize===v.fileSize&&b.lastModified===v.lastModified)),w=[...r,...s].slice(0,a);s.length>0&&(p(w),(M==="replace"||!t)&&c(w[0]||null),C(!0))}catch(g){l(g)}},[t,a,d,l,p,C,n]);return y.jsxs(W.ImageUploaderContext.Provider,{value:{values:n,defaultValues:m,mainPreviewFile:t,isDisabled:u,accept:U,maxFiles:a,minSize:q,maxSize:d,setMainPreviewFile:c,onValuesChange:p,onFilesSelected:_,error:J,setError:h,onError:l,isError:P},children:[y.jsx("div",{"data-disabled":u,"aria-disabled":u,"data-error":P,"data-slot":"image-uploader-root",className:N.cn("mds:relative mds:flex mds:flex-col mds:gap-12 mds:body-font-family",R),...H,children:B}),y.jsx(X.UploaderModal,{open:!!K,onOpenChange:C,values:n,onValuesChange:e=>{p(e),t&&!e.some(o=>o.id===t.id)&&c(e[0]||null)},onFilesSelected:(e,o)=>_(e,o,"append"),onUpload:A,onCancelUpload:V,uploadProgress:Y,isUploading:G,isDisabled:u,accept:U,maxFiles:a,minSize:q,maxSize:d,multiple:!0})]})};O.displayName="ImageUploaderRoot";exports.ImageUploaderRoot=O;
|
|
@@ -1,11 +1,11 @@
|
|
|
1
1
|
'use client';
|
|
2
|
-
import { jsxs as
|
|
2
|
+
import { jsxs as W, jsx as O } from "react/jsx-runtime";
|
|
3
3
|
import { useState as j, useCallback as y } from "react";
|
|
4
|
-
import { ImageUploaderContext as
|
|
4
|
+
import { ImageUploaderContext as X } from "./mainstack-design-system26.js";
|
|
5
5
|
import { u as L } from "./index-437EL2iq.js";
|
|
6
|
-
import { g as
|
|
7
|
-
import { UploaderModal as
|
|
8
|
-
const
|
|
6
|
+
import { g as Z, c as _ } from "./utils-C21jc49d.js";
|
|
7
|
+
import { UploaderModal as z } from "./mainstack-design-system29.js";
|
|
8
|
+
const F = ({
|
|
9
9
|
values: I,
|
|
10
10
|
onValuesChange: S,
|
|
11
11
|
defaultValues: g = [],
|
|
@@ -22,9 +22,10 @@ const z = ({
|
|
|
22
22
|
defaultUploadModalOpen: q = !1,
|
|
23
23
|
onUploadModalOpenChange: A,
|
|
24
24
|
onUpload: V,
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
25
|
+
onCancelUpload: Y,
|
|
26
|
+
uploadProgress: G,
|
|
27
|
+
isUploading: H,
|
|
28
|
+
...J
|
|
28
29
|
}) => {
|
|
29
30
|
const [r, E] = L({
|
|
30
31
|
prop: I,
|
|
@@ -35,7 +36,7 @@ const z = ({
|
|
|
35
36
|
return e && e.length > 0 ? e[0] : null;
|
|
36
37
|
});
|
|
37
38
|
r && r.length > 0 && !t && d(r[0]);
|
|
38
|
-
const [
|
|
39
|
+
const [K, f] = j(null), [Q, h] = L({
|
|
39
40
|
prop: k,
|
|
40
41
|
defaultProp: q,
|
|
41
42
|
onChange: A
|
|
@@ -52,7 +53,7 @@ const z = ({
|
|
|
52
53
|
[u]
|
|
53
54
|
), b = y(
|
|
54
55
|
async (e, o, C = "replace") => {
|
|
55
|
-
const
|
|
56
|
+
const R = C === "append" ? r.length : 0, N = a - R;
|
|
56
57
|
if (e.length > N || o.length > 0) {
|
|
57
58
|
if (e.length > N || o.some(
|
|
58
59
|
(n) => n.errors.some((s) => s.code === "too-many-files")
|
|
@@ -73,7 +74,7 @@ const z = ({
|
|
|
73
74
|
return l(new Error("Invalid image type or criteria."));
|
|
74
75
|
}
|
|
75
76
|
try {
|
|
76
|
-
const c =
|
|
77
|
+
const c = Z(e), n = C === "append" ? r : [], s = c.filter(
|
|
77
78
|
(v) => !n.some(
|
|
78
79
|
(M) => M.fileName === v.fileName && M.fileSize === v.fileSize && M.lastModified === v.lastModified
|
|
79
80
|
)
|
|
@@ -93,8 +94,8 @@ const z = ({
|
|
|
93
94
|
r
|
|
94
95
|
]
|
|
95
96
|
);
|
|
96
|
-
return /* @__PURE__ */
|
|
97
|
-
|
|
97
|
+
return /* @__PURE__ */ W(
|
|
98
|
+
X.Provider,
|
|
98
99
|
{
|
|
99
100
|
value: {
|
|
100
101
|
values: r,
|
|
@@ -108,7 +109,7 @@ const z = ({
|
|
|
108
109
|
setMainPreviewFile: d,
|
|
109
110
|
onValuesChange: m,
|
|
110
111
|
onFilesSelected: b,
|
|
111
|
-
error:
|
|
112
|
+
error: K,
|
|
112
113
|
setError: f,
|
|
113
114
|
onError: l,
|
|
114
115
|
isError: w
|
|
@@ -121,18 +122,18 @@ const z = ({
|
|
|
121
122
|
"aria-disabled": p,
|
|
122
123
|
"data-error": w,
|
|
123
124
|
"data-slot": "image-uploader-root",
|
|
124
|
-
className:
|
|
125
|
+
className: _(
|
|
125
126
|
"mds:relative mds:flex mds:flex-col mds:gap-12 mds:body-font-family",
|
|
126
127
|
$
|
|
127
128
|
),
|
|
128
|
-
...
|
|
129
|
+
...J,
|
|
129
130
|
children: T
|
|
130
131
|
}
|
|
131
132
|
),
|
|
132
133
|
/* @__PURE__ */ O(
|
|
133
|
-
|
|
134
|
+
z,
|
|
134
135
|
{
|
|
135
|
-
open: !!
|
|
136
|
+
open: !!Q,
|
|
136
137
|
onOpenChange: h,
|
|
137
138
|
values: r,
|
|
138
139
|
onValuesChange: (e) => {
|
|
@@ -140,8 +141,9 @@ const z = ({
|
|
|
140
141
|
},
|
|
141
142
|
onFilesSelected: (e, o) => b(e, o, "append"),
|
|
142
143
|
onUpload: V,
|
|
143
|
-
|
|
144
|
-
|
|
144
|
+
onCancelUpload: Y,
|
|
145
|
+
uploadProgress: G,
|
|
146
|
+
isUploading: H,
|
|
145
147
|
isDisabled: p,
|
|
146
148
|
accept: P,
|
|
147
149
|
maxFiles: a,
|
|
@@ -154,7 +156,7 @@ const z = ({
|
|
|
154
156
|
}
|
|
155
157
|
);
|
|
156
158
|
};
|
|
157
|
-
|
|
159
|
+
F.displayName = "ImageUploaderRoot";
|
|
158
160
|
export {
|
|
159
|
-
|
|
161
|
+
F as ImageUploaderRoot
|
|
160
162
|
};
|
|
@@ -1,2 +1,2 @@
|
|
|
1
1
|
'use client';
|
|
2
|
-
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const M=require("react/jsx-runtime"),
|
|
2
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const M=require("react/jsx-runtime"),G=require("./mainstack-design-system37.cjs"),_=require("./index-C8aODXfJ.cjs"),w=require("./utils-CpiHnfHs.cjs"),a=require("react"),J=require("./mainstack-design-system29.cjs"),F=({values:O,onValuesChange:P,defaultValues:y=[],isDisabled:i,accept:U={"file/*":[".pdf",".txt",".docx"]},maxFiles:t=4,minSize:b,maxSize:s,multiple:c=!0,onError:p,children:S,className:V,isError:v,uploadModalOpen:j,defaultUploadModalOpen:k=!1,onUploadModalOpenChange:z,onUpload:B,onCancelUpload:R,uploadProgress:T,isUploading:A,...I})=>{const[o,q]=_.useControllableState({prop:O,defaultProp:y,onChange:P}),[L,f]=a.useState(null),[$,g]=_.useControllableState({prop:j,defaultProp:k,onChange:z}),u=a.useCallback(e=>{f(null),q(e)},[q]),n=a.useCallback(e=>{const l=e instanceof Error?e.message:"An error occurred";f(l),p&&p(e)},[p]),E=a.useCallback(async(e,l)=>{const Y=o.length,N=t-Y;if(e.length>N||l.length>0){if(e.length>N||l.some(r=>r.errors.some(d=>d.code==="too-many-files")))return n(new Error(`You can only upload a maximum of ${t} files.`));if(l.some(r=>r.errors.some(d=>d.code==="file-too-large"))){const r=s?(s/1048576).toFixed(0):"0";return n(new Error(`File size exceeds the ${r}MB limit.`))}return n(new Error("Invalid file type or criteria."))}try{const r=w.getFileMetadata(e).filter(m=>!o.some(C=>C.fileName===m.fileName&&C.fileSize===m.fileSize&&C.lastModified===m.lastModified)),d=[...o,...r].slice(0,t);r.length>0&&(u(d),g(!0))}catch(h){n(h)}},[t,s,n,u,g,o]),x=!c||o.length>=t,D=o.length>0&&x,H=a.Children.map(S,e=>a.isValidElement(e)&&e.type?.displayName==="FileUploaderDropzone"&&D?null:e);return M.jsxs(G.FileUploaderContext.Provider,{value:{values:o,defaultValues:y,isDisabled:i,accept:U,maxFiles:t,minSize:b,maxSize:s,multiple:c,error:L,setError:f,onValuesChange:u,onFilesSelected:E,onError:n,isError:v},children:[M.jsx("div",{"data-disabled":i,"aria-disabled":i,"data-error":v,"data-slot":"file-uploader-root",className:w.cn("mds:relative mds:flex mds:flex-col mds:gap-12 mds:body-font-family",V),...I,children:H}),M.jsx(J.UploaderModal,{open:!!$,onOpenChange:g,values:o,onValuesChange:u,onFilesSelected:E,onUpload:B,onCancelUpload:R,uploadProgress:T,isUploading:A,isDisabled:i,accept:U,maxFiles:t,minSize:b,maxSize:s,multiple:c})]})};F.displayName="FileUploaderRoot";exports.FileUploaderRoot=F;
|
|
@@ -1,11 +1,11 @@
|
|
|
1
1
|
'use client';
|
|
2
|
-
import { jsxs as
|
|
3
|
-
import { FileUploaderContext as
|
|
2
|
+
import { jsxs as G, jsx as V } from "react/jsx-runtime";
|
|
3
|
+
import { FileUploaderContext as J } from "./mainstack-design-system37.js";
|
|
4
4
|
import { u as z } from "./index-437EL2iq.js";
|
|
5
|
-
import { a as
|
|
6
|
-
import B, { useState as
|
|
7
|
-
import { UploaderModal as
|
|
8
|
-
const
|
|
5
|
+
import { a as K, c as Q } from "./utils-C21jc49d.js";
|
|
6
|
+
import B, { useState as W, useCallback as C } from "react";
|
|
7
|
+
import { UploaderModal as X } from "./mainstack-design-system29.js";
|
|
8
|
+
const Z = ({
|
|
9
9
|
values: O,
|
|
10
10
|
onValuesChange: P,
|
|
11
11
|
defaultValues: M = [],
|
|
@@ -23,15 +23,16 @@ const X = ({
|
|
|
23
23
|
defaultUploadModalOpen: L = !1,
|
|
24
24
|
onUploadModalOpenChange: T,
|
|
25
25
|
onUpload: _,
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
26
|
+
onCancelUpload: $,
|
|
27
|
+
uploadProgress: k,
|
|
28
|
+
isUploading: q,
|
|
29
|
+
...D
|
|
29
30
|
}) => {
|
|
30
31
|
const [e, E] = z({
|
|
31
32
|
prop: O,
|
|
32
33
|
defaultProp: M,
|
|
33
34
|
onChange: P
|
|
34
|
-
}), [
|
|
35
|
+
}), [F, u] = W(null), [H, c] = z({
|
|
35
36
|
prop: I,
|
|
36
37
|
defaultProp: L,
|
|
37
38
|
onChange: T
|
|
@@ -48,7 +49,7 @@ const X = ({
|
|
|
48
49
|
[f]
|
|
49
50
|
), N = C(
|
|
50
51
|
async (o, a) => {
|
|
51
|
-
const
|
|
52
|
+
const j = e.length, w = t - j;
|
|
52
53
|
if (o.length > w || a.length > 0) {
|
|
53
54
|
if (o.length > w || a.some(
|
|
54
55
|
(r) => r.errors.some((s) => s.code === "too-many-files")
|
|
@@ -69,7 +70,7 @@ const X = ({
|
|
|
69
70
|
return n(new Error("Invalid file type or criteria."));
|
|
70
71
|
}
|
|
71
72
|
try {
|
|
72
|
-
const r =
|
|
73
|
+
const r = K(o).filter(
|
|
73
74
|
(g) => !e.some(
|
|
74
75
|
(h) => h.fileName === g.fileName && h.fileSize === g.fileSize && h.lastModified === g.lastModified
|
|
75
76
|
)
|
|
@@ -80,9 +81,9 @@ const X = ({
|
|
|
80
81
|
}
|
|
81
82
|
},
|
|
82
83
|
[t, l, n, i, c, e]
|
|
83
|
-
),
|
|
84
|
-
return /* @__PURE__ */
|
|
85
|
-
|
|
84
|
+
), R = !p || e.length >= t, S = e.length > 0 && R, Y = B.Children.map(b, (o) => B.isValidElement(o) && o.type?.displayName === "FileUploaderDropzone" && S ? null : o);
|
|
85
|
+
return /* @__PURE__ */ G(
|
|
86
|
+
J.Provider,
|
|
86
87
|
{
|
|
87
88
|
value: {
|
|
88
89
|
values: e,
|
|
@@ -93,7 +94,7 @@ const X = ({
|
|
|
93
94
|
minSize: v,
|
|
94
95
|
maxSize: l,
|
|
95
96
|
multiple: p,
|
|
96
|
-
error:
|
|
97
|
+
error: F,
|
|
97
98
|
setError: u,
|
|
98
99
|
onValuesChange: i,
|
|
99
100
|
onFilesSelected: N,
|
|
@@ -108,25 +109,26 @@ const X = ({
|
|
|
108
109
|
"aria-disabled": d,
|
|
109
110
|
"data-error": U,
|
|
110
111
|
"data-slot": "file-uploader-root",
|
|
111
|
-
className:
|
|
112
|
+
className: Q(
|
|
112
113
|
"mds:relative mds:flex mds:flex-col mds:gap-12 mds:body-font-family",
|
|
113
114
|
A
|
|
114
115
|
),
|
|
115
|
-
...
|
|
116
|
-
children:
|
|
116
|
+
...D,
|
|
117
|
+
children: Y
|
|
117
118
|
}
|
|
118
119
|
),
|
|
119
120
|
/* @__PURE__ */ V(
|
|
120
|
-
|
|
121
|
+
X,
|
|
121
122
|
{
|
|
122
|
-
open: !!
|
|
123
|
+
open: !!H,
|
|
123
124
|
onOpenChange: c,
|
|
124
125
|
values: e,
|
|
125
126
|
onValuesChange: i,
|
|
126
127
|
onFilesSelected: N,
|
|
127
128
|
onUpload: _,
|
|
128
|
-
|
|
129
|
-
|
|
129
|
+
onCancelUpload: $,
|
|
130
|
+
uploadProgress: k,
|
|
131
|
+
isUploading: q,
|
|
130
132
|
isDisabled: d,
|
|
131
133
|
accept: y,
|
|
132
134
|
maxFiles: t,
|
|
@@ -139,7 +141,7 @@ const X = ({
|
|
|
139
141
|
}
|
|
140
142
|
);
|
|
141
143
|
};
|
|
142
|
-
|
|
144
|
+
Z.displayName = "FileUploaderRoot";
|
|
143
145
|
export {
|
|
144
|
-
|
|
146
|
+
Z as FileUploaderRoot
|
|
145
147
|
};
|
|
@@ -1,2 +1,2 @@
|
|
|
1
1
|
'use client';
|
|
2
|
-
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),
|
|
2
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),m=require("./mainstack-design-system405.cjs"),I=require("./mainstack-design-system406.cjs"),c=require("./mainstack-design-system407.cjs");require("./mainstack-design-system408.cjs");const h=require("./mainstack-design-system409.cjs");require("./mainstack-design-system370.cjs");const R=require("./mainstack-design-system55.cjs"),F=require("./mainstack-design-system110.cjs"),k=require("./mainstack-design-system289.cjs");require("react");require("./player-CWqTo6h8.cjs");require("./mainstack-design-system402.cjs");const A=require("./mainstack-design-system548.cjs"),_=require("./mainstack-design-system549.cjs"),D=require("./mainstack-design-system550.cjs"),E=require("./mainstack-design-system555.cjs"),P=require("./mainstack-design-system556.cjs");require("./mainstack-design-system557.cjs");require("./mainstack-design-system559.cjs");const S=require("./mainstack-design-system558.cjs"),U=require("./mainstack-design-system551.cjs"),$=require("./mainstack-design-system552.cjs"),T=require("./mainstack-design-system553.cjs"),H=require("./mainstack-design-system554.cjs"),L=require("./mainstack-design-system634.cjs"),V=l=>Math.min(100,Math.max(0,l??0));function y({open:l,onOpenChange:d,values:t,onValuesChange:j,onFilesSelected:M,onUpload:u,onCancelUpload:x,uploadProgress:b,isUploading:r=!1,isDisabled:N,accept:q,maxFiles:a,minSize:g,maxSize:B,multiple:p=!0,title:C="Upload files",uploadLabel:v="Upload files",uploadingLabel:w="Uploading files"}){const n=r,O=p&&(!a||t.length<a),f=s=>{const o=t.filter(i=>i.id!==s);j(o),o.length===0&&d(!1)},z=s=>{f(s.id),x?.(s)};return e.jsx(P.ModalRoot,{open:l,onOpenChange:d,children:e.jsxs(S.ModalPortal,{children:[e.jsx(E.ModalOverlay,{}),e.jsx(A.ModalBody,{className:"mds:w-[calc(100%_-_40px)] mds:max-w-[620px]",children:e.jsxs(D.ModalContentSlot,{children:[e.jsxs(U.ModalContentHeader,{children:[e.jsx(T.ModalContentTitle,{className:"mds:body-medium-bold",children:C}),e.jsx(_.ModalClose,{})]}),e.jsxs(H.ModalContentMain,{className:"mds:flex mds:flex-col mds:gap-16 mds:pt-8 mds:pb-12",children:[e.jsx("p",{className:"mds:body-extrasmall-semibold mds:text-primary",children:"Files"}),e.jsxs("div",{role:"list","data-slot":"uploader-modal-files",className:"mds:flex mds:flex-col mds:gap-12",children:[t.map(s=>{const o=V(b?.[s.id]),i=s.fileExtension?s.fileExtension.startsWith(".")?s.fileExtension:`.${s.fileExtension}`:"file";return e.jsxs("div",{role:"listitem","data-slot":"uploader-modal-file",className:"mds:flex mds:w-full mds:items-center mds:gap-8",children:[e.jsx("div",{className:"mds:flex mds:h-43 mds:w-48 mds:shrink-0 mds:items-center mds:justify-center mds:rounded-8 mds:bg-surface-neutral-l5 mds:px-8 mds:py-10",children:e.jsx("span",{className:"mds:body-extrasmall-semibold mds:text-secondary",children:i})}),e.jsx("div",{className:"mds:flex mds:min-w-0 mds:flex-1 mds:flex-col mds:justify-center",children:n?e.jsxs(e.Fragment,{children:[e.jsxs("div",{className:"mds:flex mds:w-full mds:items-center mds:gap-8",children:[e.jsx("p",{className:"mds:min-w-0 mds:flex-1 mds:truncate mds:body-extrasmall-medium mds:text-primary",children:s.fileName}),e.jsxs("span",{className:"mds:body-extrasmall-book mds:text-secondary",children:[Math.round(o),"%"]})]}),e.jsx("div",{role:"progressbar","aria-label":`${s.fileName||"File"} upload progress`,"aria-valuemin":0,"aria-valuemax":100,"aria-valuenow":o,className:"mds:mt-8 mds:h-2 mds:w-full mds:overflow-hidden mds:rounded-full mds:bg-surface-neutral-l5",children:e.jsx("div",{className:"mds:h-full mds:rounded-full mds:bg-border-interactive-primary-active mds:transition-[width] mds:duration-300",style:{width:`${o}%`}})})]}):e.jsxs(e.Fragment,{children:[e.jsx("p",{className:"mds:truncate mds:body-extrasmall-medium mds:text-primary",children:s.fileName}),e.jsx("span",{className:"mds:truncate mds:body-tiny-medium mds:text-secondary",children:s.formatedFileSize})]})}),n&&x?e.jsx(c.ButtonRoot,{type:"button",size:"tiny",variant:"ghost",rounded:"sm",iconOnly:!0,"data-slot":"uploader-modal-cancel-upload","aria-label":`Cancel upload of ${s.fileName||"file"}`,onClick:()=>z(s),children:e.jsx(m.ButtonIcon,{children:e.jsx(F,{className:"mds:size-16"})})}):n?null:e.jsx(c.ButtonRoot,{type:"button",size:"tiny",variant:"ghost",rounded:"sm",iconOnly:!0,"aria-label":`Remove ${s.fileName||"file"}`,onClick:()=>f(s.id),children:e.jsx(m.ButtonIcon,{children:e.jsx(k,{className:"mds:size-16"})})})]},s.id)}),!n&&O?e.jsx(L.DropzoneUploadArea,{noDrag:!0,asChild:!0,accept:q,maxFiles:a,minSize:g,maxSize:B,multiple:p,onDrop:M,children:e.jsxs(c.ButtonRoot,{type:"button",size:"sm",variant:"outline",rounded:"sm",className:"mds:w-full",children:[e.jsx(m.ButtonIcon,{children:e.jsx(R,{className:"mds:size-20"})}),e.jsx(I.ButtonLabel,{children:"Add more file"})]})}):null]})]}),e.jsxs($.ModalContentFooter,{children:[e.jsx(_.ModalClose,{children:e.jsx(h.Button,{type:"button",size:"sm",variant:"secondary",rounded:"sm",children:"Close"})}),e.jsx(h.Button,{type:"button",size:"sm",variant:"special",rounded:"sm",className:"mds:flex-1",disabled:N||r||t.length===0,onClick:()=>{if(u){u(t);return}d(!1)},children:r?w:v})]})]})})]})})}y.displayName="UploaderModal";exports.UploaderModal=y;
|
|
@@ -1,61 +1,65 @@
|
|
|
1
1
|
'use client';
|
|
2
|
-
import { jsx as e, jsxs as d, Fragment as
|
|
3
|
-
import { ButtonIcon as
|
|
4
|
-
import { ButtonLabel as
|
|
5
|
-
import { ButtonRoot as
|
|
2
|
+
import { jsx as e, jsxs as d, Fragment as y } from "react/jsx-runtime";
|
|
3
|
+
import { ButtonIcon as c } from "./mainstack-design-system405.js";
|
|
4
|
+
import { ButtonLabel as F } from "./mainstack-design-system406.js";
|
|
5
|
+
import { ButtonRoot as f } from "./mainstack-design-system407.js";
|
|
6
6
|
import "./mainstack-design-system408.js";
|
|
7
|
-
import { Button as
|
|
7
|
+
import { Button as b } from "./mainstack-design-system409.js";
|
|
8
8
|
import "./mainstack-design-system370.js";
|
|
9
|
-
import
|
|
10
|
-
import
|
|
9
|
+
import I from "./mainstack-design-system55.js";
|
|
10
|
+
import v from "./mainstack-design-system110.js";
|
|
11
|
+
import P from "./mainstack-design-system289.js";
|
|
11
12
|
import "react";
|
|
12
13
|
import "./player-DRUnlXe4.js";
|
|
13
14
|
import "./mainstack-design-system402.js";
|
|
14
|
-
import { ModalBody as
|
|
15
|
-
import { ModalClose as
|
|
16
|
-
import { ModalContentSlot as
|
|
17
|
-
import { ModalOverlay as
|
|
18
|
-
import { ModalRoot as
|
|
15
|
+
import { ModalBody as R } from "./mainstack-design-system548.js";
|
|
16
|
+
import { ModalClose as N } from "./mainstack-design-system549.js";
|
|
17
|
+
import { ModalContentSlot as U } from "./mainstack-design-system550.js";
|
|
18
|
+
import { ModalOverlay as S } from "./mainstack-design-system555.js";
|
|
19
|
+
import { ModalRoot as T } from "./mainstack-design-system556.js";
|
|
19
20
|
import "./mainstack-design-system557.js";
|
|
20
21
|
import "./mainstack-design-system559.js";
|
|
21
|
-
import { ModalPortal as
|
|
22
|
-
import { ModalContentHeader as
|
|
23
|
-
import { ModalContentFooter as
|
|
24
|
-
import { ModalContentTitle as
|
|
25
|
-
import { ModalContentMain as
|
|
26
|
-
import { DropzoneUploadArea as
|
|
27
|
-
const
|
|
28
|
-
function
|
|
29
|
-
open:
|
|
30
|
-
onOpenChange:
|
|
22
|
+
import { ModalPortal as _ } from "./mainstack-design-system558.js";
|
|
23
|
+
import { ModalContentHeader as H } from "./mainstack-design-system551.js";
|
|
24
|
+
import { ModalContentFooter as L } from "./mainstack-design-system552.js";
|
|
25
|
+
import { ModalContentTitle as O } from "./mainstack-design-system553.js";
|
|
26
|
+
import { ModalContentMain as V } from "./mainstack-design-system554.js";
|
|
27
|
+
import { DropzoneUploadArea as W } from "./mainstack-design-system634.js";
|
|
28
|
+
const q = (o) => Math.min(100, Math.max(0, o ?? 0));
|
|
29
|
+
function G({
|
|
30
|
+
open: o,
|
|
31
|
+
onOpenChange: t,
|
|
31
32
|
values: r,
|
|
32
|
-
onValuesChange:
|
|
33
|
-
onFilesSelected:
|
|
34
|
-
onUpload:
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
33
|
+
onValuesChange: g,
|
|
34
|
+
onFilesSelected: M,
|
|
35
|
+
onUpload: p,
|
|
36
|
+
onCancelUpload: h,
|
|
37
|
+
uploadProgress: w,
|
|
38
|
+
isUploading: i = !1,
|
|
39
|
+
isDisabled: z,
|
|
40
|
+
accept: C,
|
|
41
|
+
maxFiles: a,
|
|
42
|
+
minSize: B,
|
|
43
|
+
maxSize: k,
|
|
44
|
+
multiple: u = !0,
|
|
45
|
+
title: E = "Upload files",
|
|
46
|
+
uploadLabel: $ = "Upload files",
|
|
47
|
+
uploadingLabel: j = "Uploading files"
|
|
46
48
|
}) {
|
|
47
|
-
const
|
|
49
|
+
const l = i, A = u && (!a || r.length < a), x = (s) => {
|
|
48
50
|
const m = r.filter((n) => n.id !== s);
|
|
49
|
-
|
|
51
|
+
g(m), m.length === 0 && t(!1);
|
|
52
|
+
}, D = (s) => {
|
|
53
|
+
x(s.id), h?.(s);
|
|
50
54
|
};
|
|
51
|
-
return /* @__PURE__ */ e(
|
|
52
|
-
/* @__PURE__ */ e(
|
|
53
|
-
/* @__PURE__ */ e(
|
|
54
|
-
/* @__PURE__ */ d(
|
|
55
|
-
/* @__PURE__ */ e(
|
|
56
|
-
/* @__PURE__ */ e(
|
|
55
|
+
return /* @__PURE__ */ e(T, { open: o, onOpenChange: t, children: /* @__PURE__ */ d(_, { children: [
|
|
56
|
+
/* @__PURE__ */ e(S, {}),
|
|
57
|
+
/* @__PURE__ */ e(R, { className: "mds:w-[calc(100%_-_40px)] mds:max-w-[620px]", children: /* @__PURE__ */ d(U, { children: [
|
|
58
|
+
/* @__PURE__ */ d(H, { children: [
|
|
59
|
+
/* @__PURE__ */ e(O, { className: "mds:body-medium-bold", children: E }),
|
|
60
|
+
/* @__PURE__ */ e(N, {})
|
|
57
61
|
] }),
|
|
58
|
-
/* @__PURE__ */ d(
|
|
62
|
+
/* @__PURE__ */ d(V, { className: "mds:flex mds:flex-col mds:gap-16 mds:pt-8 mds:pb-12", children: [
|
|
59
63
|
/* @__PURE__ */ e("p", { className: "mds:body-extrasmall-semibold mds:text-primary", children: "Files" }),
|
|
60
64
|
/* @__PURE__ */ d(
|
|
61
65
|
"div",
|
|
@@ -65,7 +69,7 @@ function W({
|
|
|
65
69
|
className: "mds:flex mds:flex-col mds:gap-12",
|
|
66
70
|
children: [
|
|
67
71
|
r.map((s) => {
|
|
68
|
-
const m =
|
|
72
|
+
const m = q(w?.[s.id]), n = s.fileExtension ? s.fileExtension.startsWith(".") ? s.fileExtension : `.${s.fileExtension}` : "file";
|
|
69
73
|
return /* @__PURE__ */ d(
|
|
70
74
|
"div",
|
|
71
75
|
{
|
|
@@ -74,7 +78,7 @@ function W({
|
|
|
74
78
|
className: "mds:flex mds:w-full mds:items-center mds:gap-8",
|
|
75
79
|
children: [
|
|
76
80
|
/* @__PURE__ */ e("div", { className: "mds:flex mds:h-43 mds:w-48 mds:shrink-0 mds:items-center mds:justify-center mds:rounded-8 mds:bg-surface-neutral-l5 mds:px-8 mds:py-10", children: /* @__PURE__ */ e("span", { className: "mds:body-extrasmall-semibold mds:text-secondary", children: n }) }),
|
|
77
|
-
/* @__PURE__ */ e("div", { className: "mds:flex mds:min-w-0 mds:flex-1 mds:flex-col mds:justify-center", children:
|
|
81
|
+
/* @__PURE__ */ e("div", { className: "mds:flex mds:min-w-0 mds:flex-1 mds:flex-col mds:justify-center", children: l ? /* @__PURE__ */ d(y, { children: [
|
|
78
82
|
/* @__PURE__ */ d("div", { className: "mds:flex mds:w-full mds:items-center mds:gap-8", children: [
|
|
79
83
|
/* @__PURE__ */ e("p", { className: "mds:min-w-0 mds:flex-1 mds:truncate mds:body-extrasmall-medium mds:text-primary", children: s.fileName }),
|
|
80
84
|
/* @__PURE__ */ d("span", { className: "mds:body-extrasmall-book mds:text-secondary", children: [
|
|
@@ -100,12 +104,25 @@ function W({
|
|
|
100
104
|
)
|
|
101
105
|
}
|
|
102
106
|
)
|
|
103
|
-
] }) : /* @__PURE__ */ d(
|
|
107
|
+
] }) : /* @__PURE__ */ d(y, { children: [
|
|
104
108
|
/* @__PURE__ */ e("p", { className: "mds:truncate mds:body-extrasmall-medium mds:text-primary", children: s.fileName }),
|
|
105
109
|
/* @__PURE__ */ e("span", { className: "mds:truncate mds:body-tiny-medium mds:text-secondary", children: s.formatedFileSize })
|
|
106
110
|
] }) }),
|
|
107
|
-
|
|
108
|
-
|
|
111
|
+
l && h ? /* @__PURE__ */ e(
|
|
112
|
+
f,
|
|
113
|
+
{
|
|
114
|
+
type: "button",
|
|
115
|
+
size: "tiny",
|
|
116
|
+
variant: "ghost",
|
|
117
|
+
rounded: "sm",
|
|
118
|
+
iconOnly: !0,
|
|
119
|
+
"data-slot": "uploader-modal-cancel-upload",
|
|
120
|
+
"aria-label": `Cancel upload of ${s.fileName || "file"}`,
|
|
121
|
+
onClick: () => D(s),
|
|
122
|
+
children: /* @__PURE__ */ e(c, { children: /* @__PURE__ */ e(v, { className: "mds:size-16" }) })
|
|
123
|
+
}
|
|
124
|
+
) : l ? null : /* @__PURE__ */ e(
|
|
125
|
+
f,
|
|
109
126
|
{
|
|
110
127
|
type: "button",
|
|
111
128
|
size: "tiny",
|
|
@@ -113,8 +130,8 @@ function W({
|
|
|
113
130
|
rounded: "sm",
|
|
114
131
|
iconOnly: !0,
|
|
115
132
|
"aria-label": `Remove ${s.fileName || "file"}`,
|
|
116
|
-
onClick: () =>
|
|
117
|
-
children: /* @__PURE__ */ e(
|
|
133
|
+
onClick: () => x(s.id),
|
|
134
|
+
children: /* @__PURE__ */ e(c, { children: /* @__PURE__ */ e(P, { className: "mds:size-16" }) })
|
|
118
135
|
}
|
|
119
136
|
)
|
|
120
137
|
]
|
|
@@ -122,19 +139,19 @@ function W({
|
|
|
122
139
|
s.id
|
|
123
140
|
);
|
|
124
141
|
}),
|
|
125
|
-
!
|
|
126
|
-
|
|
142
|
+
!l && A ? /* @__PURE__ */ e(
|
|
143
|
+
W,
|
|
127
144
|
{
|
|
128
145
|
noDrag: !0,
|
|
129
146
|
asChild: !0,
|
|
130
|
-
accept:
|
|
131
|
-
maxFiles:
|
|
132
|
-
minSize:
|
|
133
|
-
maxSize:
|
|
134
|
-
multiple:
|
|
135
|
-
onDrop:
|
|
147
|
+
accept: C,
|
|
148
|
+
maxFiles: a,
|
|
149
|
+
minSize: B,
|
|
150
|
+
maxSize: k,
|
|
151
|
+
multiple: u,
|
|
152
|
+
onDrop: M,
|
|
136
153
|
children: /* @__PURE__ */ d(
|
|
137
|
-
|
|
154
|
+
f,
|
|
138
155
|
{
|
|
139
156
|
type: "button",
|
|
140
157
|
size: "sm",
|
|
@@ -142,8 +159,8 @@ function W({
|
|
|
142
159
|
rounded: "sm",
|
|
143
160
|
className: "mds:w-full",
|
|
144
161
|
children: [
|
|
145
|
-
/* @__PURE__ */ e(
|
|
146
|
-
/* @__PURE__ */ e(
|
|
162
|
+
/* @__PURE__ */ e(c, { children: /* @__PURE__ */ e(I, { className: "mds:size-20" }) }),
|
|
163
|
+
/* @__PURE__ */ e(F, { children: "Add more file" })
|
|
147
164
|
]
|
|
148
165
|
}
|
|
149
166
|
)
|
|
@@ -153,9 +170,9 @@ function W({
|
|
|
153
170
|
}
|
|
154
171
|
)
|
|
155
172
|
] }),
|
|
156
|
-
/* @__PURE__ */ d(
|
|
157
|
-
/* @__PURE__ */ e(
|
|
158
|
-
|
|
173
|
+
/* @__PURE__ */ d(L, { children: [
|
|
174
|
+
/* @__PURE__ */ e(N, { children: /* @__PURE__ */ e(
|
|
175
|
+
b,
|
|
159
176
|
{
|
|
160
177
|
type: "button",
|
|
161
178
|
size: "sm",
|
|
@@ -165,29 +182,29 @@ function W({
|
|
|
165
182
|
}
|
|
166
183
|
) }),
|
|
167
184
|
/* @__PURE__ */ e(
|
|
168
|
-
|
|
185
|
+
b,
|
|
169
186
|
{
|
|
170
187
|
type: "button",
|
|
171
188
|
size: "sm",
|
|
172
189
|
variant: "special",
|
|
173
190
|
rounded: "sm",
|
|
174
191
|
className: "mds:flex-1",
|
|
175
|
-
disabled:
|
|
192
|
+
disabled: z || i || r.length === 0,
|
|
176
193
|
onClick: () => {
|
|
177
|
-
if (
|
|
178
|
-
|
|
194
|
+
if (p) {
|
|
195
|
+
p(r);
|
|
179
196
|
return;
|
|
180
197
|
}
|
|
181
|
-
|
|
198
|
+
t(!1);
|
|
182
199
|
},
|
|
183
|
-
children:
|
|
200
|
+
children: i ? j : $
|
|
184
201
|
}
|
|
185
202
|
)
|
|
186
203
|
] })
|
|
187
204
|
] }) })
|
|
188
205
|
] }) });
|
|
189
206
|
}
|
|
190
|
-
|
|
207
|
+
G.displayName = "UploaderModal";
|
|
191
208
|
export {
|
|
192
|
-
|
|
209
|
+
G as UploaderModal
|
|
193
210
|
};
|