@adamosuiteservices/ui 2.18.0 → 2.18.2
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/components/ui/file-upload/index.d.ts +0 -1
- package/dist/components/ui/{file-upload → file-upload-v2}/file-upload-v2.d.ts +9 -0
- package/dist/components/ui/file-upload-v2/index.d.ts +1 -0
- package/dist/file-upload-v2.cjs +6 -0
- package/dist/file-upload-v2.js +351 -0
- package/dist/file-upload.cjs +3 -12
- package/dist/file-upload.js +198 -531
- package/dist/styles.css +1 -1
- package/docs/components/ui/file-upload-v2.md +421 -68
- package/docs/components/ui/file-upload.md +157 -395
- package/llm.txt +4 -4
- package/package.json +5 -1
|
@@ -4,11 +4,20 @@ export type FileUploadV2Labels = {
|
|
|
4
4
|
selectFile?: string;
|
|
5
5
|
fileRequirements?: string;
|
|
6
6
|
filesSelected?: (count: number) => string;
|
|
7
|
+
statusUploading?: string;
|
|
8
|
+
statusSuccess?: string;
|
|
9
|
+
statusDeleting?: string;
|
|
10
|
+
statusError?: string;
|
|
7
11
|
};
|
|
12
|
+
export type FileStatus = "idle" | "uploading" | "success" | "error" | "deleting";
|
|
8
13
|
export type FileWithMetadata = {
|
|
9
14
|
id: string;
|
|
10
15
|
file: File;
|
|
11
16
|
metadata?: Record<string, unknown>;
|
|
17
|
+
status?: FileStatus;
|
|
18
|
+
deletable?: boolean;
|
|
19
|
+
disabled?: boolean;
|
|
20
|
+
error?: string;
|
|
12
21
|
};
|
|
13
22
|
export type FileUploadV2Props = ComponentProps<"div"> & Readonly<{
|
|
14
23
|
selectedFile?: FileWithMetadata | null;
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export * from './file-upload-v2';
|
|
@@ -0,0 +1,6 @@
|
|
|
1
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const r=require("./jsx-runtime-BB_1_6y_.cjs"),M=require("./button-CFJs0esR.cjs"),G=require("./icon-B7joBr0A.cjs"),N=require("./typography-Bj8oEDuE.cjs"),D=require("./index-DoxiiusW.cjs"),k=require("react");function te({isDragging:c,isMultiple:o,invalid:a,disabled:t,accept:i,acceptedExtensions:m,maxSizeInMB:d,maxFiles:x,labels:p,input:h,onDragOver:u,onDragLeave:v,onDrop:g,onFileChange:j}){const l=h?.id||`file-upload-v2-${Math.random().toString(36).substring(2,11)}`;return r.jsxRuntimeExports.jsxs("div",{onDragOver:t?void 0:u,onDragLeave:t?void 0:v,onDrop:t?void 0:g,className:D.cn(`
|
|
2
|
+
adm:flex adm:flex-col adm:items-center adm:gap-6 adm:rounded-2xl
|
|
3
|
+
adm:border-2
|
|
4
|
+
`,"adm:border-dashed adm:bg-background adm:p-6 adm:transition-colors",{"adm:border-primary":c&&!a&&!t,"adm:border-destructive":a&&!t,"adm:border-input":!c&&!a,"adm:cursor-not-allowed adm:opacity-50":t}),children:[r.jsxRuntimeExports.jsx("div",{className:D.cn("adm:flex adm:items-center adm:justify-center adm:rounded-xl adm:p-2.5",a&&!t?"adm:bg-destructive/10":"adm:bg-primary-50"),children:r.jsxRuntimeExports.jsx(G.Icon,{symbol:"text_snippet",className:a&&!t?"adm:text-destructive":"adm:text-primary"})}),r.jsxRuntimeExports.jsxs("div",{className:"adm:flex adm:flex-col adm:items-center adm:gap-2",children:[r.jsxRuntimeExports.jsx(N.Typography,{color:a&&!t?"destructive":void 0,children:p?.dragDrop||(o?"Drag and drop your files here or":"Drag and drop your file here or")}),r.jsxRuntimeExports.jsxs("label",{htmlFor:l,children:[r.jsxRuntimeExports.jsx("input",{...h,id:l,type:"file",accept:i,multiple:o,onChange:j,disabled:t,className:"adm:hidden"}),r.jsxRuntimeExports.jsx(M.Button,{asChild:!0,type:"button",variant:"link",className:D.cn("adm:cursor-pointer",t&&`
|
|
5
|
+
adm:pointer-events-none
|
|
6
|
+
`),disabled:t,children:r.jsxRuntimeExports.jsx("span",{children:p?.selectFile||(o?"Select files":"Select the file")})})]})]}),r.jsxRuntimeExports.jsx(N.Typography,{className:"adm:text-center",color:a&&!t?"destructive":"muted",children:p?.fileRequirements||(m&&m.length>0?`Allowed files: ${m.join(", ")}. Maximum size ${d} MB${o?`. Up to ${x} files`:""}.`:`Maximum size ${d} MB${o?`. Up to ${x} files`:""}.`)})]})}function re({fileWithMetadata:c,invalid:o,disabled:a,labels:t,onRemove:i}){const{file:m,status:d="idle",deletable:x=!0,disabled:p,error:h}=c,u=a||p,v=d==="uploading",g=d==="deleting",j=d==="error",l=d==="success",$=v||g,q=()=>v||g?"progress_activity":l?"check_circle":j?"error":"text_snippet",V=()=>j?"adm:text-destructive":l?"adm:text-success-600":o&&!u?"adm:text-destructive":"adm:text-primary",z=()=>j?"adm:bg-destructive/15":l?"adm:bg-success/15":v||g?"adm:bg-primary/15":o&&!u?"adm:bg-destructive/15":"adm:bg-primary/15";return r.jsxRuntimeExports.jsxs("div",{className:D.cn("adm:flex adm:items-center adm:gap-4 adm:rounded-2xl adm:border adm:p-6",j?"adm:border-destructive adm:bg-destructive/5":l?"adm:border-success-200 adm:bg-success-50":o&&!u?"adm:border-destructive adm:bg-destructive/5":"adm:border-input adm:bg-muted",u&&"adm:cursor-not-allowed adm:opacity-50"),children:[r.jsxRuntimeExports.jsx("div",{className:D.cn("adm:flex adm:items-center adm:justify-center adm:rounded-xl adm:p-2.5",z()),children:r.jsxRuntimeExports.jsx(G.Icon,{symbol:q(),className:D.cn(V(),$&&"adm:animate-spin")})}),r.jsxRuntimeExports.jsxs("div",{className:"adm:flex adm:min-w-0 adm:flex-1 adm:flex-col adm:gap-1",children:[r.jsxRuntimeExports.jsx(N.Typography,{className:D.cn("adm:min-w-0 adm:truncate adm:font-semibold"),children:m.name}),(h||v||g||l||j)&&r.jsxRuntimeExports.jsx(N.Typography,{className:"adm:text-xs",color:j?"destructive":l?"success":"muted",children:h||(v?t?.statusUploading||"Uploading...":g?t?.statusDeleting||"Deleting...":l?t?.statusSuccess||"Uploaded successfully":j?t?.statusError||"Upload failed":"")})]}),r.jsxRuntimeExports.jsxs(N.Typography,{className:"adm:shrink-0",color:"muted",children:[(m.size/1024/1024).toFixed(1)," MB"]}),x&&r.jsxRuntimeExports.jsx(M.Button,{variant:"destructive-medium",onClick:i,type:"button",disabled:u||$,children:r.jsxRuntimeExports.jsx(G.Icon,{symbol:"delete",className:"adm:text-destructive"})})]})}function A({files:c,isMultiple:o,invalid:a,disabled:t,labels:i,onRemoveFile:m,onClearAll:d}){return c.length===0?null:r.jsxRuntimeExports.jsxs("div",{className:"adm:flex adm:flex-col adm:gap-3",children:[o&&c.length>1&&r.jsxRuntimeExports.jsxs("div",{className:"adm:flex adm:items-center adm:justify-between",children:[r.jsxRuntimeExports.jsx(N.Typography,{className:"adm:text-sm adm:font-medium",color:a&&!t?"destructive":void 0,children:i?.filesSelected?.(c.length)||`${c.length} file${c.length!==1?"s":""} selected`}),r.jsxRuntimeExports.jsx(M.Button,{variant:"ghost",size:"sm",onClick:d,type:"button",disabled:t,children:"Clear all"})]}),c.map((x,p)=>r.jsxRuntimeExports.jsx(re,{fileWithMetadata:x,invalid:a,disabled:t,labels:i,onRemove:()=>m(p)},x.id))]})}function se({className:c,selectedFile:o,selectedFiles:a,onFileSelect:t,onFilesSelect:i,onFileAdd:m,onFileRemove:d,onFilesAdd:x,onFilesRemove:p,onInvalidFile:h,acceptedExtensions:u,maxSizeInMB:v=50,maxFiles:g=10,multiple:j=!1,filesPosition:l="below",invalid:$=!1,disabled:q=!1,"aria-invalid":V,generateId:z,labels:I,input:F,...H}){const[J,B]=k.useState(!1),[K,P]=k.useState(!1),w=k.useRef(null);k.useEffect(()=>{const e=()=>{if(w.current){const s=w.current.closest("fieldset");P(s?.disabled??!1)}};e();const n=new MutationObserver(e);if(w.current){const s=w.current.closest("fieldset");s&&n.observe(s,{attributes:!0,attributeFilter:["disabled"]})}return()=>n.disconnect()},[]);const Q=u?.join(",")||"",X=v*1024*1024,f=j||a!==void 0||i!==void 0,R=f?a||[]:o?[o]:[],T=$||V,y=q||K,Y=z||(e=>`${Date.now()}-${Math.random().toString(36).substring(2,11)}-${e.name}`),C=e=>({id:Y(e),file:e}),Z=e=>{y||(e.preventDefault(),B(!0))},W=e=>{y||(e.preventDefault(),B(!1))},S=e=>{if(!y)if(e.preventDefault(),B(!1),f){const s=Array.from(e.dataTransfer.files).filter(U);if(s.length>0){const b=s.map(C),_=[...a||[],...b].slice(0,g);i&&i(_),x&&x(b)}}else{const n=e.dataTransfer.files[0];if(n&&U(n)){const s=C(n);t&&t(s),m&&m(s)}}},ee=e=>{if(!y){if(f){const s=(e.target.files?Array.from(e.target.files):[]).filter(U);if(s.length>0){const b=s.map(C),_=[...a||[],...b].slice(0,g);i&&i(_),x&&x(b)}}else{const n=e.target.files?.[0];if(n&&U(n)){const s=C(n);t&&t(s),m&&m(s)}}e.target.value=""}},O=e=>{if(y)return;const n=R[e];if(f){const s=R.filter((b,E)=>E!==e);i&&i(s),p&&n&&p([n])}else t&&t(null),d&&n&&d(n)},U=e=>{const n=e.name.substring(e.name.lastIndexOf(".")),s=!u||u.length===0||u.includes(n.toLowerCase()),b=e.size<=X;if(!s||!b){const E=C(e);!s&&h?h(E,"extension"):!b&&h&&h(E,"size")}return s&&b},L=()=>{if(y)return;const e=[...R];f?(i&&i([]),p&&e.length>0&&p(e)):(t&&t(null),d&&e.length>0&&d(e[0]))};return r.jsxRuntimeExports.jsxs("div",{ref:w,className:D.cn("adm:flex adm:flex-col adm:gap-4",c),...H,children:[f&&l==="above"&&r.jsxRuntimeExports.jsx(A,{files:R,isMultiple:f,invalid:T,disabled:y,labels:I,onRemoveFile:O,onClearAll:L}),(f||R.length===0)&&r.jsxRuntimeExports.jsx(te,{isDragging:J,isMultiple:f,invalid:T,disabled:y,accept:Q,acceptedExtensions:u,maxSizeInMB:v,maxFiles:g,labels:I,input:F,onDragOver:Z,onDragLeave:W,onDrop:S,onFileChange:ee}),!f&&R.length>0&&r.jsxRuntimeExports.jsx(A,{files:R,isMultiple:f,invalid:T,disabled:y,labels:I,onRemoveFile:O,onClearAll:L}),f&&l==="below"&&r.jsxRuntimeExports.jsx(A,{files:R,isMultiple:f,invalid:T,disabled:y,labels:I,onRemoveFile:O,onClearAll:L})]})}exports.FileUploadV2=se;
|
|
@@ -0,0 +1,351 @@
|
|
|
1
|
+
import { j as r } from "./jsx-runtime-BzflLqGi.js";
|
|
2
|
+
import { B as q } from "./button-BnUlAtuD.js";
|
|
3
|
+
import { I as M } from "./icon-BFQz1tQC.js";
|
|
4
|
+
import { T as C } from "./typography-MnY0LQoZ.js";
|
|
5
|
+
import { c as N } from "./index-CRiPKpXj.js";
|
|
6
|
+
import { useState as E, useRef as te, useEffect as re } from "react";
|
|
7
|
+
function se({
|
|
8
|
+
isDragging: c,
|
|
9
|
+
isMultiple: d,
|
|
10
|
+
invalid: n,
|
|
11
|
+
disabled: t,
|
|
12
|
+
accept: i,
|
|
13
|
+
acceptedExtensions: l,
|
|
14
|
+
maxSizeInMB: o,
|
|
15
|
+
maxFiles: p,
|
|
16
|
+
labels: g,
|
|
17
|
+
input: v,
|
|
18
|
+
onDragOver: m,
|
|
19
|
+
onDragLeave: j,
|
|
20
|
+
onDrop: x,
|
|
21
|
+
onFileChange: h
|
|
22
|
+
}) {
|
|
23
|
+
const u = v?.id || `file-upload-v2-${Math.random().toString(36).substring(2, 11)}`;
|
|
24
|
+
return /* @__PURE__ */ r.jsxs(
|
|
25
|
+
"div",
|
|
26
|
+
{
|
|
27
|
+
onDragOver: t ? void 0 : m,
|
|
28
|
+
onDragLeave: t ? void 0 : j,
|
|
29
|
+
onDrop: t ? void 0 : x,
|
|
30
|
+
className: N(
|
|
31
|
+
`
|
|
32
|
+
adm:flex adm:flex-col adm:items-center adm:gap-6 adm:rounded-2xl
|
|
33
|
+
adm:border-2
|
|
34
|
+
`,
|
|
35
|
+
"adm:border-dashed adm:bg-background adm:p-6 adm:transition-colors",
|
|
36
|
+
{
|
|
37
|
+
"adm:border-primary": c && !n && !t,
|
|
38
|
+
"adm:border-destructive": n && !t,
|
|
39
|
+
"adm:border-input": !c && !n,
|
|
40
|
+
"adm:cursor-not-allowed adm:opacity-50": t
|
|
41
|
+
}
|
|
42
|
+
),
|
|
43
|
+
children: [
|
|
44
|
+
/* @__PURE__ */ r.jsx(
|
|
45
|
+
"div",
|
|
46
|
+
{
|
|
47
|
+
className: N(
|
|
48
|
+
"adm:flex adm:items-center adm:justify-center adm:rounded-xl adm:p-2.5",
|
|
49
|
+
n && !t ? "adm:bg-destructive/10" : "adm:bg-primary-50"
|
|
50
|
+
),
|
|
51
|
+
children: /* @__PURE__ */ r.jsx(
|
|
52
|
+
M,
|
|
53
|
+
{
|
|
54
|
+
symbol: "text_snippet",
|
|
55
|
+
className: n && !t ? "adm:text-destructive" : "adm:text-primary"
|
|
56
|
+
}
|
|
57
|
+
)
|
|
58
|
+
}
|
|
59
|
+
),
|
|
60
|
+
/* @__PURE__ */ r.jsxs("div", { className: "adm:flex adm:flex-col adm:items-center adm:gap-2", children: [
|
|
61
|
+
/* @__PURE__ */ r.jsx(C, { color: n && !t ? "destructive" : void 0, children: g?.dragDrop || (d ? "Drag and drop your files here or" : "Drag and drop your file here or") }),
|
|
62
|
+
/* @__PURE__ */ r.jsxs("label", { htmlFor: u, children: [
|
|
63
|
+
/* @__PURE__ */ r.jsx(
|
|
64
|
+
"input",
|
|
65
|
+
{
|
|
66
|
+
...v,
|
|
67
|
+
id: u,
|
|
68
|
+
type: "file",
|
|
69
|
+
accept: i,
|
|
70
|
+
multiple: d,
|
|
71
|
+
onChange: h,
|
|
72
|
+
disabled: t,
|
|
73
|
+
className: "adm:hidden"
|
|
74
|
+
}
|
|
75
|
+
),
|
|
76
|
+
/* @__PURE__ */ r.jsx(
|
|
77
|
+
q,
|
|
78
|
+
{
|
|
79
|
+
asChild: !0,
|
|
80
|
+
type: "button",
|
|
81
|
+
variant: "link",
|
|
82
|
+
className: N("adm:cursor-pointer", t && `
|
|
83
|
+
adm:pointer-events-none
|
|
84
|
+
`),
|
|
85
|
+
disabled: t,
|
|
86
|
+
children: /* @__PURE__ */ r.jsx("span", { children: g?.selectFile || (d ? "Select files" : "Select the file") })
|
|
87
|
+
}
|
|
88
|
+
)
|
|
89
|
+
] })
|
|
90
|
+
] }),
|
|
91
|
+
/* @__PURE__ */ r.jsx(C, { className: "adm:text-center", color: n && !t ? "destructive" : "muted", children: g?.fileRequirements || (l && l.length > 0 ? `Allowed files: ${l.join(", ")}. Maximum size ${o} MB${d ? `. Up to ${p} files` : ""}.` : `Maximum size ${o} MB${d ? `. Up to ${p} files` : ""}.`) })
|
|
92
|
+
]
|
|
93
|
+
}
|
|
94
|
+
);
|
|
95
|
+
}
|
|
96
|
+
function ae({ fileWithMetadata: c, invalid: d, disabled: n, labels: t, onRemove: i }) {
|
|
97
|
+
const { file: l, status: o = "idle", deletable: p = !0, disabled: g, error: v } = c, m = n || g, j = o === "uploading", x = o === "deleting", h = o === "error", u = o === "success", U = j || x, V = () => j || x ? "progress_activity" : u ? "check_circle" : h ? "error" : "text_snippet", B = () => h ? "adm:text-destructive" : u ? "adm:text-success-600" : d && !m ? "adm:text-destructive" : "adm:text-primary", L = () => h ? "adm:bg-destructive/15" : u ? "adm:bg-success/15" : j || x ? "adm:bg-primary/15" : d && !m ? "adm:bg-destructive/15" : "adm:bg-primary/15";
|
|
98
|
+
return /* @__PURE__ */ r.jsxs(
|
|
99
|
+
"div",
|
|
100
|
+
{
|
|
101
|
+
className: N(
|
|
102
|
+
"adm:flex adm:items-center adm:gap-4 adm:rounded-2xl adm:border adm:p-6",
|
|
103
|
+
h ? "adm:border-destructive adm:bg-destructive/5" : u ? "adm:border-success-200 adm:bg-success-50" : d && !m ? "adm:border-destructive adm:bg-destructive/5" : "adm:border-input adm:bg-muted",
|
|
104
|
+
m && "adm:cursor-not-allowed adm:opacity-50"
|
|
105
|
+
),
|
|
106
|
+
children: [
|
|
107
|
+
/* @__PURE__ */ r.jsx(
|
|
108
|
+
"div",
|
|
109
|
+
{
|
|
110
|
+
className: N(
|
|
111
|
+
"adm:flex adm:items-center adm:justify-center adm:rounded-xl adm:p-2.5",
|
|
112
|
+
L()
|
|
113
|
+
),
|
|
114
|
+
children: /* @__PURE__ */ r.jsx(
|
|
115
|
+
M,
|
|
116
|
+
{
|
|
117
|
+
symbol: V(),
|
|
118
|
+
className: N(
|
|
119
|
+
B(),
|
|
120
|
+
U && "adm:animate-spin"
|
|
121
|
+
)
|
|
122
|
+
}
|
|
123
|
+
)
|
|
124
|
+
}
|
|
125
|
+
),
|
|
126
|
+
/* @__PURE__ */ r.jsxs("div", { className: "adm:flex adm:min-w-0 adm:flex-1 adm:flex-col adm:gap-1", children: [
|
|
127
|
+
/* @__PURE__ */ r.jsx(
|
|
128
|
+
C,
|
|
129
|
+
{
|
|
130
|
+
className: N(
|
|
131
|
+
"adm:min-w-0 adm:truncate adm:font-semibold"
|
|
132
|
+
),
|
|
133
|
+
children: l.name
|
|
134
|
+
}
|
|
135
|
+
),
|
|
136
|
+
(v || j || x || u || h) && /* @__PURE__ */ r.jsx(
|
|
137
|
+
C,
|
|
138
|
+
{
|
|
139
|
+
className: "adm:text-xs",
|
|
140
|
+
color: h ? "destructive" : u ? "success" : "muted",
|
|
141
|
+
children: v || (j ? t?.statusUploading || "Uploading..." : x ? t?.statusDeleting || "Deleting..." : u ? t?.statusSuccess || "Uploaded successfully" : h ? t?.statusError || "Upload failed" : "")
|
|
142
|
+
}
|
|
143
|
+
)
|
|
144
|
+
] }),
|
|
145
|
+
/* @__PURE__ */ r.jsxs(C, { className: "adm:shrink-0", color: "muted", children: [
|
|
146
|
+
(l.size / 1024 / 1024).toFixed(1),
|
|
147
|
+
" MB"
|
|
148
|
+
] }),
|
|
149
|
+
p && /* @__PURE__ */ r.jsx(
|
|
150
|
+
q,
|
|
151
|
+
{
|
|
152
|
+
variant: "destructive-medium",
|
|
153
|
+
onClick: i,
|
|
154
|
+
type: "button",
|
|
155
|
+
disabled: m || U,
|
|
156
|
+
children: /* @__PURE__ */ r.jsx(M, { symbol: "delete", className: "adm:text-destructive" })
|
|
157
|
+
}
|
|
158
|
+
)
|
|
159
|
+
]
|
|
160
|
+
}
|
|
161
|
+
);
|
|
162
|
+
}
|
|
163
|
+
function G({ files: c, isMultiple: d, invalid: n, disabled: t, labels: i, onRemoveFile: l, onClearAll: o }) {
|
|
164
|
+
return c.length === 0 ? null : /* @__PURE__ */ r.jsxs("div", { className: "adm:flex adm:flex-col adm:gap-3", children: [
|
|
165
|
+
d && c.length > 1 && /* @__PURE__ */ r.jsxs("div", { className: "adm:flex adm:items-center adm:justify-between", children: [
|
|
166
|
+
/* @__PURE__ */ r.jsx(C, { className: "adm:text-sm adm:font-medium", color: n && !t ? "destructive" : void 0, children: i?.filesSelected?.(c.length) || `${c.length} file${c.length !== 1 ? "s" : ""} selected` }),
|
|
167
|
+
/* @__PURE__ */ r.jsx(
|
|
168
|
+
q,
|
|
169
|
+
{
|
|
170
|
+
variant: "ghost",
|
|
171
|
+
size: "sm",
|
|
172
|
+
onClick: o,
|
|
173
|
+
type: "button",
|
|
174
|
+
disabled: t,
|
|
175
|
+
children: "Clear all"
|
|
176
|
+
}
|
|
177
|
+
)
|
|
178
|
+
] }),
|
|
179
|
+
c.map((p, g) => /* @__PURE__ */ r.jsx(
|
|
180
|
+
ae,
|
|
181
|
+
{
|
|
182
|
+
fileWithMetadata: p,
|
|
183
|
+
invalid: n,
|
|
184
|
+
disabled: t,
|
|
185
|
+
labels: i,
|
|
186
|
+
onRemove: () => l(g)
|
|
187
|
+
},
|
|
188
|
+
p.id
|
|
189
|
+
))
|
|
190
|
+
] });
|
|
191
|
+
}
|
|
192
|
+
function ue({
|
|
193
|
+
className: c,
|
|
194
|
+
selectedFile: d,
|
|
195
|
+
selectedFiles: n,
|
|
196
|
+
onFileSelect: t,
|
|
197
|
+
onFilesSelect: i,
|
|
198
|
+
onFileAdd: l,
|
|
199
|
+
onFileRemove: o,
|
|
200
|
+
onFilesAdd: p,
|
|
201
|
+
onFilesRemove: g,
|
|
202
|
+
onInvalidFile: v,
|
|
203
|
+
acceptedExtensions: m,
|
|
204
|
+
maxSizeInMB: j = 50,
|
|
205
|
+
maxFiles: x = 10,
|
|
206
|
+
multiple: h = !1,
|
|
207
|
+
filesPosition: u = "below",
|
|
208
|
+
invalid: U = !1,
|
|
209
|
+
disabled: V = !1,
|
|
210
|
+
"aria-invalid": B,
|
|
211
|
+
generateId: L,
|
|
212
|
+
labels: k,
|
|
213
|
+
input: F,
|
|
214
|
+
...H
|
|
215
|
+
}) {
|
|
216
|
+
const [J, O] = E(!1), [K, Q] = E(!1), $ = te(null);
|
|
217
|
+
re(() => {
|
|
218
|
+
const e = () => {
|
|
219
|
+
if ($.current) {
|
|
220
|
+
const s = $.current.closest("fieldset");
|
|
221
|
+
Q(s?.disabled ?? !1);
|
|
222
|
+
}
|
|
223
|
+
};
|
|
224
|
+
e();
|
|
225
|
+
const a = new MutationObserver(e);
|
|
226
|
+
if ($.current) {
|
|
227
|
+
const s = $.current.closest("fieldset");
|
|
228
|
+
s && a.observe(s, { attributes: !0, attributeFilter: ["disabled"] });
|
|
229
|
+
}
|
|
230
|
+
return () => a.disconnect();
|
|
231
|
+
}, []);
|
|
232
|
+
const X = m?.join(",") || "", Y = j * 1024 * 1024, f = h || n !== void 0 || i !== void 0, D = f ? n || [] : d ? [d] : [], z = U || B, b = V || K, Z = L || ((e) => `${Date.now()}-${Math.random().toString(36).substring(2, 11)}-${e.name}`), I = (e) => ({
|
|
233
|
+
id: Z(e),
|
|
234
|
+
file: e
|
|
235
|
+
}), P = (e) => {
|
|
236
|
+
b || (e.preventDefault(), O(!0));
|
|
237
|
+
}, W = (e) => {
|
|
238
|
+
b || (e.preventDefault(), O(!1));
|
|
239
|
+
}, S = (e) => {
|
|
240
|
+
if (!b)
|
|
241
|
+
if (e.preventDefault(), O(!1), f) {
|
|
242
|
+
const s = Array.from(e.dataTransfer.files).filter(T);
|
|
243
|
+
if (s.length > 0) {
|
|
244
|
+
const y = s.map(I), A = [...n || [], ...y].slice(0, x);
|
|
245
|
+
i && i(A), p && p(y);
|
|
246
|
+
}
|
|
247
|
+
} else {
|
|
248
|
+
const a = e.dataTransfer.files[0];
|
|
249
|
+
if (a && T(a)) {
|
|
250
|
+
const s = I(a);
|
|
251
|
+
t && t(s), l && l(s);
|
|
252
|
+
}
|
|
253
|
+
}
|
|
254
|
+
}, ee = (e) => {
|
|
255
|
+
if (!b) {
|
|
256
|
+
if (f) {
|
|
257
|
+
const s = (e.target.files ? Array.from(e.target.files) : []).filter(T);
|
|
258
|
+
if (s.length > 0) {
|
|
259
|
+
const y = s.map(I), A = [...n || [], ...y].slice(0, x);
|
|
260
|
+
i && i(A), p && p(y);
|
|
261
|
+
}
|
|
262
|
+
} else {
|
|
263
|
+
const a = e.target.files?.[0];
|
|
264
|
+
if (a && T(a)) {
|
|
265
|
+
const s = I(a);
|
|
266
|
+
t && t(s), l && l(s);
|
|
267
|
+
}
|
|
268
|
+
}
|
|
269
|
+
e.target.value = "";
|
|
270
|
+
}
|
|
271
|
+
}, R = (e) => {
|
|
272
|
+
if (b) return;
|
|
273
|
+
const a = D[e];
|
|
274
|
+
if (f) {
|
|
275
|
+
const s = D.filter((y, w) => w !== e);
|
|
276
|
+
i && i(s), g && a && g([a]);
|
|
277
|
+
} else
|
|
278
|
+
t && t(null), o && a && o(a);
|
|
279
|
+
}, T = (e) => {
|
|
280
|
+
const a = e.name.substring(e.name.lastIndexOf(".")), s = !m || m.length === 0 || m.includes(a.toLowerCase()), y = e.size <= Y;
|
|
281
|
+
if (!s || !y) {
|
|
282
|
+
const w = I(e);
|
|
283
|
+
!s && v ? v(w, "extension") : !y && v && v(w, "size");
|
|
284
|
+
}
|
|
285
|
+
return s && y;
|
|
286
|
+
}, _ = () => {
|
|
287
|
+
if (b) return;
|
|
288
|
+
const e = [...D];
|
|
289
|
+
f ? (i && i([]), g && e.length > 0 && g(e)) : (t && t(null), o && e.length > 0 && o(e[0]));
|
|
290
|
+
};
|
|
291
|
+
return /* @__PURE__ */ r.jsxs("div", { ref: $, className: N("adm:flex adm:flex-col adm:gap-4", c), ...H, children: [
|
|
292
|
+
f && u === "above" && /* @__PURE__ */ r.jsx(
|
|
293
|
+
G,
|
|
294
|
+
{
|
|
295
|
+
files: D,
|
|
296
|
+
isMultiple: f,
|
|
297
|
+
invalid: z,
|
|
298
|
+
disabled: b,
|
|
299
|
+
labels: k,
|
|
300
|
+
onRemoveFile: R,
|
|
301
|
+
onClearAll: _
|
|
302
|
+
}
|
|
303
|
+
),
|
|
304
|
+
(f || D.length === 0) && /* @__PURE__ */ r.jsx(
|
|
305
|
+
se,
|
|
306
|
+
{
|
|
307
|
+
isDragging: J,
|
|
308
|
+
isMultiple: f,
|
|
309
|
+
invalid: z,
|
|
310
|
+
disabled: b,
|
|
311
|
+
accept: X,
|
|
312
|
+
acceptedExtensions: m,
|
|
313
|
+
maxSizeInMB: j,
|
|
314
|
+
maxFiles: x,
|
|
315
|
+
labels: k,
|
|
316
|
+
input: F,
|
|
317
|
+
onDragOver: P,
|
|
318
|
+
onDragLeave: W,
|
|
319
|
+
onDrop: S,
|
|
320
|
+
onFileChange: ee
|
|
321
|
+
}
|
|
322
|
+
),
|
|
323
|
+
!f && D.length > 0 && /* @__PURE__ */ r.jsx(
|
|
324
|
+
G,
|
|
325
|
+
{
|
|
326
|
+
files: D,
|
|
327
|
+
isMultiple: f,
|
|
328
|
+
invalid: z,
|
|
329
|
+
disabled: b,
|
|
330
|
+
labels: k,
|
|
331
|
+
onRemoveFile: R,
|
|
332
|
+
onClearAll: _
|
|
333
|
+
}
|
|
334
|
+
),
|
|
335
|
+
f && u === "below" && /* @__PURE__ */ r.jsx(
|
|
336
|
+
G,
|
|
337
|
+
{
|
|
338
|
+
files: D,
|
|
339
|
+
isMultiple: f,
|
|
340
|
+
invalid: z,
|
|
341
|
+
disabled: b,
|
|
342
|
+
labels: k,
|
|
343
|
+
onRemoveFile: R,
|
|
344
|
+
onClearAll: _
|
|
345
|
+
}
|
|
346
|
+
)
|
|
347
|
+
] });
|
|
348
|
+
}
|
|
349
|
+
export {
|
|
350
|
+
ue as FileUploadV2
|
|
351
|
+
};
|
package/dist/file-upload.cjs
CHANGED
|
@@ -1,15 +1,6 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const
|
|
1
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const r=require("./jsx-runtime-BB_1_6y_.cjs"),L=require("./button-CFJs0esR.cjs"),B=require("./icon-B7joBr0A.cjs"),D=require("./typography-Bj8oEDuE.cjs"),g=require("./index-DoxiiusW.cjs"),T=require("react");function P({isDragging:i,isMultiple:o,invalid:s,disabled:t,accept:m,acceptedExtensions:l,maxSizeInMB:f,maxFiles:u,labels:c,input:j,onDragOver:h,onDragLeave:N,onDrop:v,onFileChange:q}){const y=j?.id||`file-upload-${Math.random().toString(36).substring(2,11)}`;return r.jsxRuntimeExports.jsxs("div",{onDragOver:t?void 0:h,onDragLeave:t?void 0:N,onDrop:t?void 0:v,className:g.cn(`
|
|
2
2
|
adm:flex adm:flex-col adm:items-center adm:gap-6 adm:rounded-2xl
|
|
3
3
|
adm:border-2
|
|
4
|
-
`,"adm:border-dashed adm:bg-background adm:p-6 adm:transition-colors",{"adm:border-primary":
|
|
4
|
+
`,"adm:border-dashed adm:bg-background adm:p-6 adm:transition-colors",{"adm:border-primary":i&&!s&&!t,"adm:border-destructive":s&&!t,"adm:border-input":!i&&!s,"adm:cursor-not-allowed adm:opacity-50":t}),children:[r.jsxRuntimeExports.jsx("div",{className:g.cn("adm:flex adm:items-center adm:justify-center adm:rounded-xl adm:p-2.5",s&&!t?"adm:bg-destructive/10":"adm:bg-primary-50"),children:r.jsxRuntimeExports.jsx(B.Icon,{symbol:"text_snippet",className:s&&!t?"adm:text-destructive":"adm:text-primary"})}),r.jsxRuntimeExports.jsxs("div",{className:"adm:flex adm:flex-col adm:items-center adm:gap-2",children:[r.jsxRuntimeExports.jsx(D.Typography,{color:s&&!t?"destructive":void 0,children:c?.dragDrop||(o?"Drag and drop your files here or":"Drag and drop your file here or")}),r.jsxRuntimeExports.jsxs("label",{htmlFor:y,children:[r.jsxRuntimeExports.jsx("input",{...j,id:y,type:"file",accept:m,multiple:o,onChange:q,disabled:t,className:"adm:hidden"}),r.jsxRuntimeExports.jsx(L.Button,{asChild:!0,type:"button",variant:"link",className:g.cn("adm:cursor-pointer",t&&`
|
|
5
5
|
adm:pointer-events-none
|
|
6
|
-
`),disabled:t,children:
|
|
7
|
-
adm:flex adm:min-w-0 adm:flex-1 adm:items-start adm:gap-3
|
|
8
|
-
`,children:[e.jsxRuntimeExports.jsx("div",{className:"adm:min-w-0 adm:flex-1",children:e.jsxRuntimeExports.jsx($.Typography,{className:"adm:truncate adm:font-semibold",children:o.name})}),e.jsxRuntimeExports.jsxs($.Typography,{className:"adm:shrink-0",color:"muted",children:[(o.size/1024/1024).toFixed(1)," MB"]})]}),e.jsxRuntimeExports.jsx(_.Button,{variant:"destructive-medium",onClick:t,type:"button",disabled:r,children:e.jsxRuntimeExports.jsx(U.Icon,{symbol:"delete",className:"adm:text-destructive"})})]})}function ee({files:o,isMultiple:i,invalid:r,disabled:t,labels:n,onRemoveFile:x,onClearAll:p}){return o.length===0?null:e.jsxRuntimeExports.jsxs("div",{className:"adm:flex adm:flex-col adm:gap-3",children:[i&&o.length>1&&e.jsxRuntimeExports.jsxs("div",{className:"adm:flex adm:items-center adm:justify-between",children:[e.jsxRuntimeExports.jsx($.Typography,{className:"adm:text-sm adm:font-medium",color:r&&!t?"destructive":void 0,children:n?.filesSelected?.(o.length)||`${o.length} file${o.length!==1?"s":""} selected`}),e.jsxRuntimeExports.jsx(_.Button,{variant:"ghost",size:"sm",onClick:p,type:"button",disabled:t,children:"Clear all"})]}),o.map((f,d)=>e.jsxRuntimeExports.jsx(ae,{file:f,invalid:r,disabled:t,onRemove:()=>x(d)},`${f.name}-${d}`))]})}function ne({className:o,selectedFile:i,selectedFiles:r,onFileSelect:t,onFilesSelect:n,onFileAdd:x,onFileRemove:p,onFilesAdd:f,onFilesRemove:d,onInvalidFile:h,acceptedExtensions:g,maxSizeInMB:C=50,maxFiles:D=10,multiple:k=!1,filesPosition:N="below",invalid:K=!1,disabled:Q=!1,"aria-invalid":X,labels:L,input:V,...Y}){const[Z,M]=I.useState(!1),[G,W]=I.useState(!1),z=I.useRef(null);I.useEffect(()=>{const a=()=>{if(z.current){const c=z.current.closest("fieldset");W(c?.disabled??!1)}};a();const m=new MutationObserver(a);if(z.current){const c=z.current.closest("fieldset");c&&m.observe(c,{attributes:!0,attributeFilter:["disabled"]})}return()=>m.disconnect()},[]);const O=g?.join(",")||"",P=C*1024*1024,v=k||r!==void 0||n!==void 0,l=v?r||[]:i?[i]:[],R=K||X,y=Q||G,E=a=>{y||(a.preventDefault(),M(!0))},re=a=>{y||(a.preventDefault(),M(!1))},F=a=>{if(!y)if(a.preventDefault(),M(!1),v){const c=Array.from(a.dataTransfer.files).filter(q);if(c.length>0){const s=[...r||[],...c].slice(0,D);n&&n(s),f&&f(c)}}else{const m=a.dataTransfer.files[0];m&&q(m)&&(t&&t(m),x&&x(m))}},B=a=>{if(!y){if(v){const c=(a.target.files?Array.from(a.target.files):[]).filter(q);if(c.length>0){const s=[...r||[],...c].slice(0,D);n&&n(s),f&&f(c)}}else{const m=a.target.files?.[0];m&&q(m)&&(t&&t(m),x&&x(m))}a.target.value=""}},H=a=>{if(y)return;const m=l[a];if(v){const c=l.filter((T,s)=>s!==a);n&&n(c),d&&m&&d([m])}else t&&t(null),p&&m&&p(m)},q=a=>{const m=a.name.substring(a.name.lastIndexOf(".")),c=!g||g.length===0||g.includes(m.toLowerCase()),T=a.size<=P;return!c&&h?h(a,"extension"):!T&&h&&h(a,"size"),c&&T},J=()=>{if(y)return;const a=[...l];v?(n&&n([]),d&&a.length>0&&d(a)):(t&&t(null),p&&a.length>0&&p(a[0]))};return e.jsxRuntimeExports.jsxs("div",{ref:z,className:b.cn("adm:flex adm:flex-col adm:gap-4",o),...Y,children:[v&&N==="above"&&e.jsxRuntimeExports.jsx(ee,{files:l,isMultiple:v,invalid:R,disabled:y,labels:L,onRemoveFile:H,onClearAll:J}),(v||l.length===0)&&e.jsxRuntimeExports.jsx(se,{isDragging:Z,isMultiple:v,invalid:R,disabled:y,accept:O,acceptedExtensions:g,maxSizeInMB:C,maxFiles:D,labels:L,input:V,onDragOver:E,onDragLeave:re,onDrop:F,onFileChange:B}),!v&&l.length>0&&e.jsxRuntimeExports.jsx(ee,{files:l,isMultiple:v,invalid:R,disabled:y,labels:L,onRemoveFile:H,onClearAll:J}),v&&N==="below"&&e.jsxRuntimeExports.jsx(ee,{files:l,isMultiple:v,invalid:R,disabled:y,labels:L,onRemoveFile:H,onClearAll:J})]})}function ie({isDragging:o,isMultiple:i,invalid:r,disabled:t,accept:n,acceptedExtensions:x,maxSizeInMB:p,maxFiles:f,labels:d,input:h,onDragOver:g,onDragLeave:C,onDrop:D,onFileChange:k}){const N=h?.id||`file-upload-v2-${Math.random().toString(36).substring(2,11)}`;return e.jsxRuntimeExports.jsxs("div",{onDragOver:t?void 0:g,onDragLeave:t?void 0:C,onDrop:t?void 0:D,className:b.cn(`
|
|
9
|
-
adm:flex adm:flex-col adm:items-center adm:gap-6 adm:rounded-2xl
|
|
10
|
-
adm:border-2
|
|
11
|
-
`,"adm:border-dashed adm:bg-background adm:p-6 adm:transition-colors",{"adm:border-primary":o&&!r&&!t,"adm:border-destructive":r&&!t,"adm:border-input":!o&&!r,"adm:cursor-not-allowed adm:opacity-50":t}),children:[e.jsxRuntimeExports.jsx("div",{className:b.cn("adm:flex adm:items-center adm:justify-center adm:rounded-xl adm:p-2.5",r&&!t?"adm:bg-destructive/10":"adm:bg-primary-50"),children:e.jsxRuntimeExports.jsx(U.Icon,{symbol:"text_snippet",className:r&&!t?"adm:text-destructive":"adm:text-primary"})}),e.jsxRuntimeExports.jsxs("div",{className:"adm:flex adm:flex-col adm:items-center adm:gap-2",children:[e.jsxRuntimeExports.jsx($.Typography,{color:r&&!t?"destructive":void 0,children:d?.dragDrop||(i?"Drag and drop your files here or":"Drag and drop your file here or")}),e.jsxRuntimeExports.jsxs("label",{htmlFor:N,children:[e.jsxRuntimeExports.jsx("input",{...h,id:N,type:"file",accept:n,multiple:i,onChange:k,disabled:t,className:"adm:hidden"}),e.jsxRuntimeExports.jsx(_.Button,{asChild:!0,type:"button",variant:"link",className:b.cn("adm:cursor-pointer",t&&`
|
|
12
|
-
adm:pointer-events-none
|
|
13
|
-
`),disabled:t,children:e.jsxRuntimeExports.jsx("span",{children:d?.selectFile||(i?"Select files":"Select the file")})})]})]}),e.jsxRuntimeExports.jsx($.Typography,{className:"adm:text-center",color:r&&!t?"destructive":"muted",children:d?.fileRequirements||(x&&x.length>0?`Allowed files: ${x.join(", ")}. Maximum size ${p} MB${i?`. Up to ${f} files`:""}.`:`Maximum size ${p} MB${i?`. Up to ${f} files`:""}.`)})]})}function oe({fileWithMetadata:o,invalid:i,disabled:r,onRemove:t}){const{file:n}=o;return e.jsxRuntimeExports.jsxs("div",{className:b.cn("adm:flex adm:items-center adm:gap-4 adm:rounded-2xl adm:border adm:p-6",i&&!r?"adm:border-destructive adm:bg-destructive/5":"adm:border-input adm:bg-muted",r&&"adm:cursor-not-allowed adm:opacity-50"),children:[e.jsxRuntimeExports.jsx("div",{className:b.cn("adm:flex adm:items-center adm:justify-center adm:rounded-xl adm:p-2.5",i&&!r?"adm:bg-destructive/10":"adm:bg-primary-50"),children:e.jsxRuntimeExports.jsx(U.Icon,{symbol:"text_snippet",className:i&&!r?"adm:text-destructive":"adm:text-primary"})}),e.jsxRuntimeExports.jsxs("div",{className:`
|
|
14
|
-
adm:flex adm:min-w-0 adm:flex-1 adm:items-start adm:gap-3
|
|
15
|
-
`,children:[e.jsxRuntimeExports.jsx("div",{className:"adm:min-w-0 adm:flex-1",children:e.jsxRuntimeExports.jsx($.Typography,{className:"adm:truncate adm:font-semibold",children:n.name})}),e.jsxRuntimeExports.jsxs($.Typography,{className:"adm:shrink-0",color:"muted",children:[(n.size/1024/1024).toFixed(1)," MB"]})]}),e.jsxRuntimeExports.jsx(_.Button,{variant:"destructive-medium",onClick:t,type:"button",disabled:r,children:e.jsxRuntimeExports.jsx(U.Icon,{symbol:"delete",className:"adm:text-destructive"})})]})}function te({files:o,isMultiple:i,invalid:r,disabled:t,labels:n,onRemoveFile:x,onClearAll:p}){return o.length===0?null:e.jsxRuntimeExports.jsxs("div",{className:"adm:flex adm:flex-col adm:gap-3",children:[i&&o.length>1&&e.jsxRuntimeExports.jsxs("div",{className:"adm:flex adm:items-center adm:justify-between",children:[e.jsxRuntimeExports.jsx($.Typography,{className:"adm:text-sm adm:font-medium",color:r&&!t?"destructive":void 0,children:n?.filesSelected?.(o.length)||`${o.length} file${o.length!==1?"s":""} selected`}),e.jsxRuntimeExports.jsx(_.Button,{variant:"ghost",size:"sm",onClick:p,type:"button",disabled:t,children:"Clear all"})]}),o.map((f,d)=>e.jsxRuntimeExports.jsx(oe,{fileWithMetadata:f,invalid:r,disabled:t,onRemove:()=>x(d)},f.id))]})}function me({className:o,selectedFile:i,selectedFiles:r,onFileSelect:t,onFilesSelect:n,onFileAdd:x,onFileRemove:p,onFilesAdd:f,onFilesRemove:d,onInvalidFile:h,acceptedExtensions:g,maxSizeInMB:C=50,maxFiles:D=10,multiple:k=!1,filesPosition:N="below",invalid:K=!1,disabled:Q=!1,"aria-invalid":X,generateId:L,labels:V,input:Y,...Z}){const[M,G]=I.useState(!1),[W,z]=I.useState(!1),O=I.useRef(null);I.useEffect(()=>{const s=()=>{if(O.current){const u=O.current.closest("fieldset");z(u?.disabled??!1)}};s();const j=new MutationObserver(s);if(O.current){const u=O.current.closest("fieldset");u&&j.observe(u,{attributes:!0,attributeFilter:["disabled"]})}return()=>j.disconnect()},[]);const P=g?.join(",")||"",v=C*1024*1024,l=k||r!==void 0||n!==void 0,R=l?r||[]:i?[i]:[],y=K||X,E=Q||W,F=L||(s=>`${Date.now()}-${Math.random().toString(36).substring(2,11)}-${s.name}`),B=s=>({id:F(s),file:s}),H=s=>{E||(s.preventDefault(),G(!0))},q=s=>{E||(s.preventDefault(),G(!1))},J=s=>{if(!E)if(s.preventDefault(),G(!1),l){const u=Array.from(s.dataTransfer.files).filter(c);if(u.length>0){const w=u.map(B),S=[...r||[],...w].slice(0,D);n&&n(S),f&&f(w)}}else{const j=s.dataTransfer.files[0];if(j&&c(j)){const u=B(j);t&&t(u),x&&x(u)}}},a=s=>{if(!E){if(l){const u=(s.target.files?Array.from(s.target.files):[]).filter(c);if(u.length>0){const w=u.map(B),S=[...r||[],...w].slice(0,D);n&&n(S),f&&f(w)}}else{const j=s.target.files?.[0];if(j&&c(j)){const u=B(j);t&&t(u),x&&x(u)}}s.target.value=""}},m=s=>{if(E)return;const j=R[s];if(l){const u=R.filter((w,A)=>A!==s);n&&n(u),d&&j&&d([j])}else t&&t(null),p&&j&&p(j)},c=s=>{const j=s.name.substring(s.name.lastIndexOf(".")),u=!g||g.length===0||g.includes(j.toLowerCase()),w=s.size<=v;if(!u||!w){const A=B(s);!u&&h?h(A,"extension"):!w&&h&&h(A,"size")}return u&&w},T=()=>{if(E)return;const s=[...R];l?(n&&n([]),d&&s.length>0&&d(s)):(t&&t(null),p&&s.length>0&&p(s[0]))};return e.jsxRuntimeExports.jsxs("div",{ref:O,className:b.cn("adm:flex adm:flex-col adm:gap-4",o),...Z,children:[l&&N==="above"&&e.jsxRuntimeExports.jsx(te,{files:R,isMultiple:l,invalid:y,disabled:E,labels:V,onRemoveFile:m,onClearAll:T}),(l||R.length===0)&&e.jsxRuntimeExports.jsx(ie,{isDragging:M,isMultiple:l,invalid:y,disabled:E,accept:P,acceptedExtensions:g,maxSizeInMB:C,maxFiles:D,labels:V,input:Y,onDragOver:H,onDragLeave:q,onDrop:J,onFileChange:a}),!l&&R.length>0&&e.jsxRuntimeExports.jsx(te,{files:R,isMultiple:l,invalid:y,disabled:E,labels:V,onRemoveFile:m,onClearAll:T}),l&&N==="below"&&e.jsxRuntimeExports.jsx(te,{files:R,isMultiple:l,invalid:y,disabled:E,labels:V,onRemoveFile:m,onClearAll:T})]})}exports.FileUpload=ne;exports.FileUploadV2=me;
|
|
6
|
+
`),disabled:t,children:r.jsxRuntimeExports.jsx("span",{children:c?.selectFile||(o?"Select files":"Select the file")})})]})]}),r.jsxRuntimeExports.jsx(D.Typography,{className:"adm:text-center",color:s&&!t?"destructive":"muted",children:c?.fileRequirements||(l&&l.length>0?`Allowed files: ${l.join(", ")}. Maximum size ${f} MB${o?`. Up to ${u} files`:""}.`:`Maximum size ${f} MB${o?`. Up to ${u} files`:""}.`)})]})}function F({file:i,invalid:o,disabled:s,onRemove:t}){return r.jsxRuntimeExports.jsxs("div",{className:g.cn("adm:flex adm:items-center adm:gap-4 adm:rounded-2xl adm:border adm:p-6",o&&!s?"adm:border-destructive adm:bg-destructive/5":"adm:border-input adm:bg-muted",s&&"adm:cursor-not-allowed adm:opacity-50"),children:[r.jsxRuntimeExports.jsx("div",{className:g.cn("adm:flex adm:items-center adm:justify-center adm:rounded-xl adm:p-2.5",o&&!s?"adm:bg-destructive/15":"adm:bg-primary/15"),children:r.jsxRuntimeExports.jsx(B.Icon,{symbol:"text_snippet",className:o&&!s?"adm:text-destructive":"adm:text-primary"})}),r.jsxRuntimeExports.jsx("div",{className:"adm:flex adm:min-w-0 adm:flex-1 adm:flex-col adm:gap-1",children:r.jsxRuntimeExports.jsx(D.Typography,{className:g.cn("adm:min-w-0 adm:truncate adm:font-semibold"),children:i.name})}),r.jsxRuntimeExports.jsxs(D.Typography,{className:"adm:shrink-0",color:"muted",children:[(i.size/1024/1024).toFixed(1)," MB"]}),r.jsxRuntimeExports.jsx(L.Button,{variant:"destructive-medium",onClick:t,type:"button",disabled:s,children:r.jsxRuntimeExports.jsx(B.Icon,{symbol:"delete",className:"adm:text-destructive"})})]})}function O({files:i,isMultiple:o,invalid:s,disabled:t,labels:m,onRemoveFile:l,onClearAll:f}){return i.length===0?null:r.jsxRuntimeExports.jsxs("div",{className:"adm:flex adm:flex-col adm:gap-3",children:[o&&i.length>1&&r.jsxRuntimeExports.jsxs("div",{className:"adm:flex adm:items-center adm:justify-between",children:[r.jsxRuntimeExports.jsx(D.Typography,{className:"adm:text-sm adm:font-medium",color:s&&!t?"destructive":void 0,children:m?.filesSelected?.(i.length)||`${i.length} file${i.length!==1?"s":""} selected`}),r.jsxRuntimeExports.jsx(L.Button,{variant:"ghost",size:"sm",onClick:f,type:"button",disabled:t,children:"Clear all"})]}),i.map((u,c)=>r.jsxRuntimeExports.jsx(F,{file:u,invalid:s,disabled:t,onRemove:()=>l(c)},`${u.name}-${c}`))]})}function S({className:i,selectedFile:o,selectedFiles:s,onFileSelect:t,onFilesSelect:m,onFileAdd:l,onFileRemove:f,onFilesAdd:u,onFilesRemove:c,onInvalidFile:j,acceptedExtensions:h,maxSizeInMB:N=50,maxFiles:v=10,multiple:q=!1,filesPosition:y="below",invalid:A=!1,disabled:U=!1,"aria-invalid":M,labels:$,input:V,..._}){const[G,k]=T.useState(!1),[H,J]=T.useState(!1),R=T.useRef(null);T.useEffect(()=>{const e=()=>{if(R.current){const n=R.current.closest("fieldset");J(n?.disabled??!1)}};e();const a=new MutationObserver(e);if(R.current){const n=R.current.closest("fieldset");n&&a.observe(n,{attributes:!0,attributeFilter:["disabled"]})}return()=>a.disconnect()},[]);const K=h?.join(",")||"",Q=N*1024*1024,d=q||s!==void 0||m!==void 0,p=d?s||[]:o?[o]:[],w=A||M,x=U||H,W=e=>{x||(e.preventDefault(),k(!0))},X=e=>{x||(e.preventDefault(),k(!1))},Y=e=>{if(!x)if(e.preventDefault(),k(!1),d){const n=Array.from(e.dataTransfer.files).filter(C);if(n.length>0){const E=[...s||[],...n].slice(0,v);m&&m(E),u&&u(n)}}else{const a=e.dataTransfer.files[0];a&&C(a)&&(t&&t(a),l&&l(a))}},Z=e=>{if(!x){if(d){const n=(e.target.files?Array.from(e.target.files):[]).filter(C);if(n.length>0){const E=[...s||[],...n].slice(0,v);m&&m(E),u&&u(n)}}else{const a=e.target.files?.[0];a&&C(a)&&(t&&t(a),l&&l(a))}e.target.value=""}},z=e=>{if(x)return;const a=p[e];if(d){const n=p.filter((b,E)=>E!==e);m&&m(n),c&&a&&c([a])}else t&&t(null),f&&a&&f(a)},C=e=>{const a=e.name.substring(e.name.lastIndexOf(".")),n=!h||h.length===0||h.includes(a.toLowerCase()),b=e.size<=Q;return!n&&j?j(e,"extension"):!b&&j&&j(e,"size"),n&&b},I=()=>{if(x)return;const e=[...p];d?(m&&m([]),c&&e.length>0&&c(e)):(t&&t(null),f&&e.length>0&&f(e[0]))};return r.jsxRuntimeExports.jsxs("div",{ref:R,className:g.cn("adm:flex adm:flex-col adm:gap-4",i),..._,children:[d&&y==="above"&&r.jsxRuntimeExports.jsx(O,{files:p,isMultiple:d,invalid:w,disabled:x,labels:$,onRemoveFile:z,onClearAll:I}),(d||p.length===0)&&r.jsxRuntimeExports.jsx(P,{isDragging:G,isMultiple:d,invalid:w,disabled:x,accept:K,acceptedExtensions:h,maxSizeInMB:N,maxFiles:v,labels:$,input:V,onDragOver:W,onDragLeave:X,onDrop:Y,onFileChange:Z}),!d&&p.length>0&&r.jsxRuntimeExports.jsx(O,{files:p,isMultiple:d,invalid:w,disabled:x,labels:$,onRemoveFile:z,onClearAll:I}),d&&y==="below"&&r.jsxRuntimeExports.jsx(O,{files:p,isMultiple:d,invalid:w,disabled:x,labels:$,onRemoveFile:z,onClearAll:I})]})}exports.FileUpload=S;
|