@arcfusionz/arc-primitive-ui 0.2.14 → 0.2.15
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.
|
@@ -12,6 +12,12 @@ interface FileUploadRejection {
|
|
|
12
12
|
}
|
|
13
13
|
/** Per-file lifecycle the consumer drives while uploading. */
|
|
14
14
|
type FileUploadItemStatus = "idle" | "uploading" | "success" | "error";
|
|
15
|
+
/**
|
|
16
|
+
* Layout of the default `FileUploadDropzone` content. `default` is the full
|
|
17
|
+
* illustrated prompt; `compact` is a slim single row; `auto` shows `default`
|
|
18
|
+
* while empty and switches to `compact` once files are selected.
|
|
19
|
+
*/
|
|
20
|
+
type FileUploadDropzoneVariant = "default" | "compact" | "auto";
|
|
15
21
|
/** State exposed on the root element as `data-*` and to the `render` callback. */
|
|
16
22
|
interface FileUploadRenderState extends Record<string, unknown> {
|
|
17
23
|
/** A file is being dragged over the dropzone. */
|
|
@@ -22,6 +28,8 @@ interface FileUploadRenderState extends Record<string, unknown> {
|
|
|
22
28
|
invalid: boolean;
|
|
23
29
|
/** No files are selected. */
|
|
24
30
|
empty: boolean;
|
|
31
|
+
/** The selection has reached `maxFiles` (multiple mode only). */
|
|
32
|
+
atMax: boolean;
|
|
25
33
|
}
|
|
26
34
|
/** `1023 B`, `1.5 KB`, `12 MB` — a compact, locale-neutral size readout. */
|
|
27
35
|
declare function formatFileSize(bytes: number): string;
|
|
@@ -29,12 +37,20 @@ declare function formatFileSize(bytes: number): string;
|
|
|
29
37
|
interface FileUploadHandle {
|
|
30
38
|
/** The currently selected files. */
|
|
31
39
|
files: File[];
|
|
40
|
+
/** Number of selected files. */
|
|
41
|
+
fileCount: number;
|
|
32
42
|
/** A file is being dragged over the dropzone. */
|
|
33
43
|
isDragging: boolean;
|
|
34
44
|
/** The upload is disabled. */
|
|
35
45
|
disabled: boolean;
|
|
36
46
|
/** The upload is marked invalid. */
|
|
37
47
|
invalid: boolean;
|
|
48
|
+
/** Effective file cap (multiple mode only); `undefined` when unlimited or single. */
|
|
49
|
+
maxFiles?: number;
|
|
50
|
+
/** Slots left before `maxFiles`; `undefined` when there is no cap. */
|
|
51
|
+
remainingFiles?: number;
|
|
52
|
+
/** The selection has reached `maxFiles`. */
|
|
53
|
+
isAtMaxFiles: boolean;
|
|
38
54
|
/** Open the native file picker. */
|
|
39
55
|
open: () => void;
|
|
40
56
|
/** Remove one file from the selection. */
|
|
@@ -120,17 +136,32 @@ interface FileUploadDropzoneVariantsOptions {
|
|
|
120
136
|
*/
|
|
121
137
|
declare function fileUploadDropzoneVariants({ className }?: FileUploadDropzoneVariantsOptions): string;
|
|
122
138
|
interface FileUploadDropzoneProps extends Omit<ComponentPropsWithoutRef<"div">, "className"> {
|
|
123
|
-
/**
|
|
139
|
+
/**
|
|
140
|
+
* Default-content layout: `default` (full illustrated prompt), `compact`
|
|
141
|
+
* (slim single row), or `auto` (full while empty, compact once files are
|
|
142
|
+
* selected). Ignored when `children` are provided.
|
|
143
|
+
*/
|
|
144
|
+
variant?: FileUploadDropzoneVariant;
|
|
145
|
+
/**
|
|
146
|
+
* Show how many more files can be added, derived from the upload's
|
|
147
|
+
* `maxFiles` (multiple mode). Renders nothing when there is no cap. Ignored
|
|
148
|
+
* when `children` are provided.
|
|
149
|
+
*/
|
|
150
|
+
showRemaining?: boolean;
|
|
151
|
+
/** Replace the default prompt + `FileUploadTrigger`. */
|
|
124
152
|
children?: ReactNode;
|
|
125
153
|
className?: string;
|
|
126
154
|
}
|
|
127
155
|
/**
|
|
128
156
|
* The dashed drop area. Clicking anywhere in it opens the picker (a pointer
|
|
129
157
|
* convenience); the `FileUploadTrigger` inside is the focusable control for
|
|
130
|
-
* keyboard and assistive tech. With no `children` it renders
|
|
131
|
-
* (`upload`, or `upload-error` when
|
|
132
|
-
*
|
|
133
|
-
*
|
|
158
|
+
* keyboard and assistive tech. With no `children` it renders the default
|
|
159
|
+
* prompt for `variant` — a `SystemState` (`upload`, or `upload-error` when
|
|
160
|
+
* invalid) for `default`, a slim row for `compact`, switching automatically
|
|
161
|
+
* for `auto`. State hooks: `data-dragging`, `data-empty`, `data-at-max`,
|
|
162
|
+
* `data-invalid`, `data-disabled`. At `maxFiles` the browse control is
|
|
163
|
+
* disabled and clicks no longer open the picker. Consumer drag handlers are
|
|
164
|
+
* composed with the internal ones, not replaced.
|
|
134
165
|
*/
|
|
135
166
|
declare const FileUploadDropzone: import("react").ForwardRefExoticComponent<FileUploadDropzoneProps & import("react").RefAttributes<HTMLDivElement>>;
|
|
136
167
|
type FileUploadTriggerProps = ButtonProps;
|
|
@@ -161,30 +192,34 @@ declare const FileUploadList: import("react").ForwardRefExoticComponent<FileUplo
|
|
|
161
192
|
interface FileUploadItemProps extends Omit<ComponentPropsWithoutRef<"li">, "className" | "children"> {
|
|
162
193
|
/** The file this row represents (name, size, and type come from it). */
|
|
163
194
|
file: File;
|
|
164
|
-
/** Upload lifecycle you drive: `uploading` shows a progress bar
|
|
195
|
+
/** Upload lifecycle you drive: `uploading` shows a progress bar; `success`/`error` show a status label. */
|
|
165
196
|
status?: FileUploadItemStatus;
|
|
166
197
|
/** Completion 0–100 while `status="uploading"`. Omit for an indeterminate bar. */
|
|
167
198
|
progress?: number;
|
|
168
|
-
/**
|
|
199
|
+
/** Detailed message shown while `status="error"`, in place of the size. */
|
|
169
200
|
error?: ReactNode;
|
|
201
|
+
/** Short visible + announced status label. Defaults per `status` ("Uploading", "Uploaded", "Failed"); pass to override the copy. */
|
|
202
|
+
statusLabel?: ReactNode;
|
|
170
203
|
/** Show the remove button. Defaults to `true`. */
|
|
171
204
|
removable?: boolean;
|
|
172
205
|
/** Remove handler. Defaults to removing this file from the selection. */
|
|
173
206
|
onRemove?: () => void;
|
|
174
207
|
/** Accessible name for the remove button. Defaults to `Remove {file name}`. */
|
|
175
208
|
removeLabel?: string;
|
|
176
|
-
/**
|
|
177
|
-
|
|
209
|
+
/** URL of a preview image (e.g. a server-side thumbnail). The primitive owns the dimensions, radius, `object-fit`, decorative attributes, and drag prevention — you supply only the URL. Falls back to a file icon when omitted, non-image, or the image fails to load. */
|
|
210
|
+
previewSrc?: string;
|
|
178
211
|
/** Replace the entire row body. */
|
|
179
212
|
children?: ReactNode;
|
|
180
213
|
className?: string;
|
|
181
214
|
}
|
|
182
215
|
/**
|
|
183
|
-
* One selected file: a thumbnail (auto-generated for images
|
|
184
|
-
*
|
|
185
|
-
*
|
|
186
|
-
*
|
|
216
|
+
* One selected file: a thumbnail (auto-generated for images, or from
|
|
217
|
+
* `previewSrc`) with a file-icon fallback, the name, and — depending on
|
|
218
|
+
* `status` — its size, an upload progress bar, or an error message, plus a
|
|
219
|
+
* visible status label and a remove button. `status`/`progress`/`error` are
|
|
220
|
+
* consumer-driven so the row reflects real upload state; the component shows
|
|
221
|
+
* failures but does not itself retry.
|
|
187
222
|
*/
|
|
188
223
|
declare const FileUploadItem: import("react").ForwardRefExoticComponent<FileUploadItemProps & import("react").RefAttributes<HTMLLIElement>>;
|
|
189
224
|
//#endregion
|
|
190
|
-
export { FileUpload, FileUploadDropzone, FileUploadDropzoneProps, FileUploadDropzoneVariantsOptions, FileUploadHandle, FileUploadItem, FileUploadItemProps, FileUploadItemStatus, FileUploadList, FileUploadListProps, FileUploadProps, FileUploadRejection, FileUploadRejectionCode, FileUploadRenderState, FileUploadTrigger, FileUploadTriggerProps, fileUploadDropzoneVariants, formatFileSize, useFileUpload };
|
|
225
|
+
export { FileUpload, FileUploadDropzone, FileUploadDropzoneProps, FileUploadDropzoneVariant, FileUploadDropzoneVariantsOptions, FileUploadHandle, FileUploadItem, FileUploadItemProps, FileUploadItemStatus, FileUploadList, FileUploadListProps, FileUploadProps, FileUploadRejection, FileUploadRejectionCode, FileUploadRenderState, FileUploadTrigger, FileUploadTriggerProps, fileUploadDropzoneVariants, formatFileSize, useFileUpload };
|
|
@@ -40,6 +40,9 @@ function matchesAccept(file, accept) {
|
|
|
40
40
|
function fileKey(file) {
|
|
41
41
|
return `${file.name}:${file.size}:${file.lastModified}`;
|
|
42
42
|
}
|
|
43
|
+
function canUseObjectUrl() {
|
|
44
|
+
return typeof URL !== "undefined" && typeof URL.createObjectURL === "function" && typeof URL.revokeObjectURL === "function";
|
|
45
|
+
}
|
|
43
46
|
const FileUploadContext = createContext(null);
|
|
44
47
|
function useFileUploadContext(part) {
|
|
45
48
|
const context = useContext(FileUploadContext);
|
|
@@ -55,9 +58,13 @@ function useFileUpload() {
|
|
|
55
58
|
const context = useFileUploadContext("useFileUpload");
|
|
56
59
|
return {
|
|
57
60
|
files: context.files,
|
|
61
|
+
fileCount: context.fileCount,
|
|
58
62
|
isDragging: context.isDragging,
|
|
59
63
|
disabled: context.disabled,
|
|
60
64
|
invalid: context.invalid,
|
|
65
|
+
maxFiles: context.maxFiles,
|
|
66
|
+
remainingFiles: context.remainingFiles,
|
|
67
|
+
isAtMaxFiles: context.isAtMaxFiles,
|
|
61
68
|
open: context.openPicker,
|
|
62
69
|
remove: context.removeFile,
|
|
63
70
|
clear: context.clear
|
|
@@ -68,7 +75,8 @@ const stateAttributesMapping = {
|
|
|
68
75
|
dragging: (value) => value ? { "data-dragging": "" } : null,
|
|
69
76
|
disabled: (value) => value ? { "data-disabled": "" } : null,
|
|
70
77
|
invalid: (value) => value ? { "data-invalid": "" } : null,
|
|
71
|
-
empty: (value) => value ? { "data-empty": "" } : null
|
|
78
|
+
empty: (value) => value ? { "data-empty": "" } : null,
|
|
79
|
+
atMax: (value) => value ? { "data-at-max": "" } : null
|
|
72
80
|
};
|
|
73
81
|
/**
|
|
74
82
|
* Drag-and-drop / browse file selection built on a native input. Owns the
|
|
@@ -96,6 +104,10 @@ const FileUpload = forwardRef(({ accept, multiple = false, maxFiles, maxSize, mi
|
|
|
96
104
|
const [internalFiles, setInternalFiles] = useState(defaultValue ?? []);
|
|
97
105
|
const files = isControlled ? value : internalFiles;
|
|
98
106
|
const [isDragging, setIsDragging] = useState(false);
|
|
107
|
+
const fileCount = files.length;
|
|
108
|
+
const effectiveMaxFiles = multiple ? maxFiles : void 0;
|
|
109
|
+
const isAtMaxFiles = effectiveMaxFiles != null && fileCount >= effectiveMaxFiles;
|
|
110
|
+
const remainingFiles = effectiveMaxFiles != null ? Math.max(0, effectiveMaxFiles - fileCount) : void 0;
|
|
99
111
|
const syncInputFiles = (list) => {
|
|
100
112
|
const input = inputRef.current;
|
|
101
113
|
if (!input || typeof DataTransfer === "undefined") return;
|
|
@@ -198,9 +210,14 @@ const FileUpload = forwardRef(({ accept, multiple = false, maxFiles, maxSize, mi
|
|
|
198
210
|
}, [preventDocumentDrop, allowDrop]);
|
|
199
211
|
const contextValue = {
|
|
200
212
|
files,
|
|
213
|
+
fileCount,
|
|
201
214
|
disabled: resolvedDisabled,
|
|
202
215
|
invalid: resolvedInvalid,
|
|
203
216
|
multiple,
|
|
217
|
+
maxFiles: effectiveMaxFiles,
|
|
218
|
+
remainingFiles,
|
|
219
|
+
isAtMaxFiles,
|
|
220
|
+
isEmpty: fileCount === 0,
|
|
204
221
|
isDragging,
|
|
205
222
|
inputId,
|
|
206
223
|
openPicker,
|
|
@@ -213,17 +230,17 @@ const FileUpload = forwardRef(({ accept, multiple = false, maxFiles, maxSize, mi
|
|
|
213
230
|
onDrop
|
|
214
231
|
}
|
|
215
232
|
};
|
|
216
|
-
const state = {
|
|
217
|
-
dragging: isDragging,
|
|
218
|
-
disabled: resolvedDisabled,
|
|
219
|
-
invalid: resolvedInvalid,
|
|
220
|
-
empty: files.length === 0
|
|
221
|
-
};
|
|
222
233
|
return useRender({
|
|
223
234
|
defaultTagName: "div",
|
|
224
235
|
render,
|
|
225
236
|
ref: [ref, rootRef],
|
|
226
|
-
state
|
|
237
|
+
state: {
|
|
238
|
+
dragging: isDragging,
|
|
239
|
+
disabled: resolvedDisabled,
|
|
240
|
+
invalid: resolvedInvalid,
|
|
241
|
+
empty: fileCount === 0,
|
|
242
|
+
atMax: isAtMaxFiles
|
|
243
|
+
},
|
|
227
244
|
stateAttributesMapping,
|
|
228
245
|
props: {
|
|
229
246
|
className: cn(rootClasses, className),
|
|
@@ -255,7 +272,8 @@ const FileUpload = forwardRef(({ accept, multiple = false, maxFiles, maxSize, mi
|
|
|
255
272
|
});
|
|
256
273
|
});
|
|
257
274
|
FileUpload.displayName = "FileUpload";
|
|
258
|
-
const dropzoneClasses = "relative flex w-full flex-col items-center justify-center rounded-md border-2 border-dashed border-border bg-transparent cursor-pointer transition-colors duration-150 hover:border-slate-300 hover:bg-surface has-[:focus-visible]:border-primary has-[:focus-visible]:bg-primary-50 data-dragging:border-primary data-dragging:bg-primary-50 data-invalid:border-destructive data-disabled:cursor-default data-disabled:opacity-50 data-disabled:hover:border-border data-disabled:hover:bg-transparent";
|
|
275
|
+
const dropzoneClasses = "relative flex w-full flex-col items-center justify-center rounded-md border-2 border-dashed border-border bg-transparent cursor-pointer transition-colors duration-150 hover:border-slate-300 hover:bg-surface has-[:focus-visible]:border-primary has-[:focus-visible]:bg-primary-50 data-dragging:border-primary data-dragging:bg-primary-50 data-invalid:border-destructive data-at-max:cursor-default data-at-max:hover:border-border data-at-max:hover:bg-transparent data-disabled:cursor-default data-disabled:opacity-50 data-disabled:hover:border-border data-disabled:hover:bg-transparent";
|
|
276
|
+
const dropzoneCompactClasses = "flex-row items-center gap-3 px-4 py-3 text-start";
|
|
259
277
|
/**
|
|
260
278
|
* Class list for an element styled as the dashed drop area — for building a
|
|
261
279
|
* bespoke dropzone while keeping the brand's border, hover, and drag/invalid
|
|
@@ -268,30 +286,77 @@ function fileUploadDropzoneVariants({ className } = {}) {
|
|
|
268
286
|
/**
|
|
269
287
|
* The dashed drop area. Clicking anywhere in it opens the picker (a pointer
|
|
270
288
|
* convenience); the `FileUploadTrigger` inside is the focusable control for
|
|
271
|
-
* keyboard and assistive tech. With no `children` it renders
|
|
272
|
-
* (`upload`, or `upload-error` when
|
|
273
|
-
*
|
|
274
|
-
*
|
|
289
|
+
* keyboard and assistive tech. With no `children` it renders the default
|
|
290
|
+
* prompt for `variant` — a `SystemState` (`upload`, or `upload-error` when
|
|
291
|
+
* invalid) for `default`, a slim row for `compact`, switching automatically
|
|
292
|
+
* for `auto`. State hooks: `data-dragging`, `data-empty`, `data-at-max`,
|
|
293
|
+
* `data-invalid`, `data-disabled`. At `maxFiles` the browse control is
|
|
294
|
+
* disabled and clicks no longer open the picker. Consumer drag handlers are
|
|
295
|
+
* composed with the internal ones, not replaced.
|
|
275
296
|
*/
|
|
276
|
-
const FileUploadDropzone = forwardRef(({ children, className, onClick, ...rest }, ref) => {
|
|
297
|
+
const FileUploadDropzone = forwardRef(({ variant = "default", showRemaining = false, children, className, onClick, onDragEnter, onDragOver, onDragLeave, onDrop, ...rest }, ref) => {
|
|
277
298
|
const context = useFileUploadContext("FileUploadDropzone");
|
|
299
|
+
const listeners = context.dropzoneListeners;
|
|
300
|
+
const resolvedVariant = variant === "auto" ? context.isEmpty ? "default" : "compact" : variant;
|
|
301
|
+
const remaining = showRemaining && context.maxFiles != null ? /* @__PURE__ */ jsx("span", {
|
|
302
|
+
className: "font-sans text-xs text-muted-foreground",
|
|
303
|
+
children: context.isAtMaxFiles ? `Maximum of ${context.maxFiles} files reached` : `${context.remainingFiles} of ${context.maxFiles} files remaining`
|
|
304
|
+
}) : null;
|
|
278
305
|
return /* @__PURE__ */ jsx("div", {
|
|
279
306
|
ref,
|
|
280
307
|
"data-dragging": context.isDragging ? "" : void 0,
|
|
308
|
+
"data-empty": context.isEmpty ? "" : void 0,
|
|
309
|
+
"data-at-max": context.isAtMaxFiles ? "" : void 0,
|
|
281
310
|
"data-invalid": context.invalid ? "" : void 0,
|
|
282
311
|
"data-disabled": context.disabled ? "" : void 0,
|
|
283
|
-
className: fileUploadDropzoneVariants({ className }),
|
|
312
|
+
className: fileUploadDropzoneVariants({ className: cn(resolvedVariant === "compact" && dropzoneCompactClasses, className) }),
|
|
284
313
|
onClick: (event) => {
|
|
285
314
|
onClick?.(event);
|
|
286
|
-
if (
|
|
315
|
+
if (event.defaultPrevented || context.disabled || context.isAtMaxFiles) return;
|
|
316
|
+
context.openPicker();
|
|
317
|
+
},
|
|
318
|
+
onDragEnter: (event) => {
|
|
319
|
+
onDragEnter?.(event);
|
|
320
|
+
listeners.onDragEnter(event);
|
|
321
|
+
},
|
|
322
|
+
onDragOver: (event) => {
|
|
323
|
+
onDragOver?.(event);
|
|
324
|
+
listeners.onDragOver(event);
|
|
325
|
+
},
|
|
326
|
+
onDragLeave: (event) => {
|
|
327
|
+
onDragLeave?.(event);
|
|
328
|
+
listeners.onDragLeave(event);
|
|
329
|
+
},
|
|
330
|
+
onDrop: (event) => {
|
|
331
|
+
onDrop?.(event);
|
|
332
|
+
listeners.onDrop(event);
|
|
287
333
|
},
|
|
288
|
-
...context.dropzoneListeners,
|
|
289
334
|
...rest,
|
|
290
|
-
children: children ?? /* @__PURE__ */
|
|
335
|
+
children: children ?? (resolvedVariant === "compact" ? /* @__PURE__ */ jsxs(Fragment$1, { children: [
|
|
336
|
+
/* @__PURE__ */ jsx(UploadIcon, {
|
|
337
|
+
className: "size-5 shrink-0 text-muted-foreground",
|
|
338
|
+
"aria-hidden": "true"
|
|
339
|
+
}),
|
|
340
|
+
/* @__PURE__ */ jsxs("div", {
|
|
341
|
+
className: "flex min-w-0 flex-1 flex-col",
|
|
342
|
+
children: [/* @__PURE__ */ jsx("span", {
|
|
343
|
+
className: "font-sans text-sm font-medium text-foreground",
|
|
344
|
+
children: context.isAtMaxFiles ? "Maximum files reached" : "Drag and drop or browse"
|
|
345
|
+
}), remaining]
|
|
346
|
+
}),
|
|
347
|
+
/* @__PURE__ */ jsx(FileUploadTrigger, {
|
|
348
|
+
size: "sm",
|
|
349
|
+
startIcon: null,
|
|
350
|
+
disabled: context.isAtMaxFiles || void 0
|
|
351
|
+
})
|
|
352
|
+
] }) : /* @__PURE__ */ jsx(SystemState, {
|
|
291
353
|
variant: context.invalid ? "upload-error" : "upload",
|
|
292
354
|
bg: "transparent",
|
|
293
|
-
action: /* @__PURE__ */
|
|
294
|
-
|
|
355
|
+
action: /* @__PURE__ */ jsxs("div", {
|
|
356
|
+
className: "flex flex-col items-center gap-2",
|
|
357
|
+
children: [/* @__PURE__ */ jsx(FileUploadTrigger, { disabled: context.isAtMaxFiles || void 0 }), remaining]
|
|
358
|
+
})
|
|
359
|
+
}))
|
|
295
360
|
});
|
|
296
361
|
});
|
|
297
362
|
FileUploadDropzone.displayName = "FileUploadDropzone";
|
|
@@ -345,15 +410,31 @@ const itemClasses = "flex items-center gap-3 rounded-md border border-border bg-
|
|
|
345
410
|
const itemNameClasses = "truncate font-sans text-sm font-medium text-foreground";
|
|
346
411
|
const itemMetaClasses = "font-sans text-xs text-muted-foreground";
|
|
347
412
|
const itemErrorClasses = "font-sans text-xs font-medium text-error-700";
|
|
413
|
+
const itemStatusLabels = {
|
|
414
|
+
idle: "",
|
|
415
|
+
uploading: "Uploading",
|
|
416
|
+
success: "Uploaded",
|
|
417
|
+
error: "Failed"
|
|
418
|
+
};
|
|
419
|
+
const itemStatusColors = {
|
|
420
|
+
idle: "text-muted-foreground",
|
|
421
|
+
uploading: "text-muted-foreground",
|
|
422
|
+
success: "text-success-700",
|
|
423
|
+
error: "text-error-700"
|
|
424
|
+
};
|
|
348
425
|
/**
|
|
349
|
-
* One selected file: a thumbnail (auto-generated for images
|
|
350
|
-
*
|
|
351
|
-
*
|
|
352
|
-
*
|
|
426
|
+
* One selected file: a thumbnail (auto-generated for images, or from
|
|
427
|
+
* `previewSrc`) with a file-icon fallback, the name, and — depending on
|
|
428
|
+
* `status` — its size, an upload progress bar, or an error message, plus a
|
|
429
|
+
* visible status label and a remove button. `status`/`progress`/`error` are
|
|
430
|
+
* consumer-driven so the row reflects real upload state; the component shows
|
|
431
|
+
* failures but does not itself retry.
|
|
353
432
|
*/
|
|
354
|
-
const FileUploadItem = forwardRef(({ file, status = "idle", progress, error, removable = true, onRemove, removeLabel,
|
|
433
|
+
const FileUploadItem = forwardRef(({ file, status = "idle", progress, error, statusLabel, removable = true, onRemove, removeLabel, previewSrc, children, className, ...rest }, ref) => {
|
|
355
434
|
const context = useFileUploadContext("FileUploadItem");
|
|
356
435
|
const handleRemove = onRemove ?? (() => context.removeFile(file));
|
|
436
|
+
const resolvedStatusLabel = statusLabel !== void 0 ? statusLabel : itemStatusLabels[status] || null;
|
|
437
|
+
const showStatusLabel = status !== "idle" && resolvedStatusLabel != null;
|
|
357
438
|
return /* @__PURE__ */ jsx("li", {
|
|
358
439
|
ref,
|
|
359
440
|
"data-status": status,
|
|
@@ -362,26 +443,32 @@ const FileUploadItem = forwardRef(({ file, status = "idle", progress, error, rem
|
|
|
362
443
|
children: children ?? /* @__PURE__ */ jsxs(Fragment$1, { children: [
|
|
363
444
|
/* @__PURE__ */ jsx("span", {
|
|
364
445
|
className: "shrink-0",
|
|
365
|
-
children:
|
|
446
|
+
children: /* @__PURE__ */ jsx(FileUploadThumbnail, {
|
|
447
|
+
file,
|
|
448
|
+
src: previewSrc
|
|
449
|
+
})
|
|
366
450
|
}),
|
|
367
451
|
/* @__PURE__ */ jsxs("div", {
|
|
368
452
|
className: "flex min-w-0 flex-1 flex-col gap-1",
|
|
369
453
|
children: [/* @__PURE__ */ jsxs("div", {
|
|
370
454
|
className: "flex items-center gap-2",
|
|
371
|
-
children: [
|
|
372
|
-
|
|
373
|
-
|
|
374
|
-
|
|
375
|
-
|
|
376
|
-
|
|
377
|
-
|
|
378
|
-
|
|
379
|
-
|
|
380
|
-
|
|
381
|
-
|
|
382
|
-
|
|
383
|
-
|
|
384
|
-
|
|
455
|
+
children: [/* @__PURE__ */ jsx("span", {
|
|
456
|
+
className: itemNameClasses,
|
|
457
|
+
children: file.name
|
|
458
|
+
}), showStatusLabel && /* @__PURE__ */ jsxs("span", {
|
|
459
|
+
className: cn("ms-auto inline-flex shrink-0 items-center gap-1 font-sans text-xs font-medium", itemStatusColors[status]),
|
|
460
|
+
children: [
|
|
461
|
+
status === "success" && /* @__PURE__ */ jsx(CheckCircleIcon, {
|
|
462
|
+
className: "size-3.5",
|
|
463
|
+
"aria-hidden": "true"
|
|
464
|
+
}),
|
|
465
|
+
status === "error" && /* @__PURE__ */ jsx(AlertCircleIcon, {
|
|
466
|
+
className: "size-3.5",
|
|
467
|
+
"aria-hidden": "true"
|
|
468
|
+
}),
|
|
469
|
+
resolvedStatusLabel
|
|
470
|
+
]
|
|
471
|
+
})]
|
|
385
472
|
}), status === "uploading" ? /* @__PURE__ */ jsx(Progress, {
|
|
386
473
|
size: "sm",
|
|
387
474
|
value: progress ?? null,
|
|
@@ -402,33 +489,39 @@ const FileUploadItem = forwardRef(({ file, status = "idle", progress, error, rem
|
|
|
402
489
|
"aria-label": removeLabel ?? `Remove ${file.name}`,
|
|
403
490
|
disabled: context.disabled,
|
|
404
491
|
onClick: handleRemove,
|
|
405
|
-
className: "
|
|
492
|
+
className: "shrink-0 self-start",
|
|
406
493
|
children: /* @__PURE__ */ jsx(XIcon, {})
|
|
407
494
|
})
|
|
408
495
|
] })
|
|
409
496
|
});
|
|
410
497
|
});
|
|
411
498
|
FileUploadItem.displayName = "FileUploadItem";
|
|
412
|
-
|
|
413
|
-
|
|
499
|
+
const thumbnailImageClasses = "size-10 rounded-md object-cover";
|
|
500
|
+
const thumbnailFallbackClasses = "flex size-10 items-center justify-center rounded-md bg-muted text-muted-foreground";
|
|
501
|
+
function FileUploadThumbnail({ file, src }) {
|
|
502
|
+
const [autoUrl, setAutoUrl] = useState(null);
|
|
503
|
+
const [failed, setFailed] = useState(false);
|
|
414
504
|
useEffect(() => {
|
|
415
|
-
|
|
416
|
-
|
|
505
|
+
setFailed(false);
|
|
506
|
+
if (src != null || !file.type.startsWith("image/") || !canUseObjectUrl()) {
|
|
507
|
+
setAutoUrl(null);
|
|
417
508
|
return;
|
|
418
509
|
}
|
|
419
510
|
const objectUrl = URL.createObjectURL(file);
|
|
420
|
-
|
|
511
|
+
setAutoUrl(objectUrl);
|
|
421
512
|
return () => URL.revokeObjectURL(objectUrl);
|
|
422
|
-
}, [file]);
|
|
423
|
-
|
|
424
|
-
|
|
513
|
+
}, [file, src]);
|
|
514
|
+
const resolvedSrc = src ?? autoUrl;
|
|
515
|
+
if (resolvedSrc != null && !failed) return /* @__PURE__ */ jsx("img", {
|
|
516
|
+
src: resolvedSrc,
|
|
425
517
|
alt: "",
|
|
426
518
|
"aria-hidden": "true",
|
|
427
|
-
className:
|
|
428
|
-
draggable: false
|
|
519
|
+
className: thumbnailImageClasses,
|
|
520
|
+
draggable: false,
|
|
521
|
+
onError: () => setFailed(true)
|
|
429
522
|
});
|
|
430
523
|
return /* @__PURE__ */ jsx("span", {
|
|
431
|
-
className:
|
|
524
|
+
className: thumbnailFallbackClasses,
|
|
432
525
|
children: /* @__PURE__ */ jsx(FileIcon, {
|
|
433
526
|
className: "size-5",
|
|
434
527
|
"aria-hidden": "true"
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import { FileUpload, FileUploadDropzone, FileUploadDropzoneProps, FileUploadDropzoneVariantsOptions, FileUploadHandle, FileUploadItem, FileUploadItemProps, FileUploadItemStatus, FileUploadList, FileUploadListProps, FileUploadProps, FileUploadRejection, FileUploadRejectionCode, FileUploadRenderState, FileUploadTrigger, FileUploadTriggerProps, fileUploadDropzoneVariants, formatFileSize, useFileUpload } from "./FileUpload.js";
|
|
2
|
-
export { FileUpload, FileUploadDropzone, type FileUploadDropzoneProps, type FileUploadDropzoneVariantsOptions, type FileUploadHandle, FileUploadItem, type FileUploadItemProps, type FileUploadItemStatus, FileUploadList, type FileUploadListProps, type FileUploadProps, type FileUploadRejection, type FileUploadRejectionCode, type FileUploadRenderState, FileUploadTrigger, type FileUploadTriggerProps, fileUploadDropzoneVariants, formatFileSize, useFileUpload };
|
|
1
|
+
import { FileUpload, FileUploadDropzone, FileUploadDropzoneProps, FileUploadDropzoneVariant, FileUploadDropzoneVariantsOptions, FileUploadHandle, FileUploadItem, FileUploadItemProps, FileUploadItemStatus, FileUploadList, FileUploadListProps, FileUploadProps, FileUploadRejection, FileUploadRejectionCode, FileUploadRenderState, FileUploadTrigger, FileUploadTriggerProps, fileUploadDropzoneVariants, formatFileSize, useFileUpload } from "./FileUpload.js";
|
|
2
|
+
export { FileUpload, FileUploadDropzone, type FileUploadDropzoneProps, type FileUploadDropzoneVariant, type FileUploadDropzoneVariantsOptions, type FileUploadHandle, FileUploadItem, type FileUploadItemProps, type FileUploadItemStatus, FileUploadList, type FileUploadListProps, type FileUploadProps, type FileUploadRejection, type FileUploadRejectionCode, type FileUploadRenderState, FileUploadTrigger, type FileUploadTriggerProps, fileUploadDropzoneVariants, formatFileSize, useFileUpload };
|
package/dist/index.d.ts
CHANGED
|
@@ -46,7 +46,7 @@ import { FieldControlProps, useFieldControl } from "./components/Field/FieldCont
|
|
|
46
46
|
import "./components/Field/index.js";
|
|
47
47
|
import { Fieldset, FieldsetDescription, FieldsetDescriptionProps, FieldsetLegend, FieldsetLegendProps, FieldsetLegendVariant, FieldsetProps } from "./components/Fieldset/Fieldset.js";
|
|
48
48
|
import "./components/Fieldset/index.js";
|
|
49
|
-
import { FileUpload, FileUploadDropzone, FileUploadDropzoneProps, FileUploadDropzoneVariantsOptions, FileUploadHandle, FileUploadItem, FileUploadItemProps, FileUploadItemStatus, FileUploadList, FileUploadListProps, FileUploadProps, FileUploadRejection, FileUploadRejectionCode, FileUploadRenderState, FileUploadTrigger, FileUploadTriggerProps, fileUploadDropzoneVariants, formatFileSize, useFileUpload } from "./components/FileUpload/FileUpload.js";
|
|
49
|
+
import { FileUpload, FileUploadDropzone, FileUploadDropzoneProps, FileUploadDropzoneVariant, FileUploadDropzoneVariantsOptions, FileUploadHandle, FileUploadItem, FileUploadItemProps, FileUploadItemStatus, FileUploadList, FileUploadListProps, FileUploadProps, FileUploadRejection, FileUploadRejectionCode, FileUploadRenderState, FileUploadTrigger, FileUploadTriggerProps, fileUploadDropzoneVariants, formatFileSize, useFileUpload } from "./components/FileUpload/FileUpload.js";
|
|
50
50
|
import "./components/FileUpload/index.js";
|
|
51
51
|
import { Form, FormProps } from "./components/Form/Form.js";
|
|
52
52
|
import "./components/Form/index.js";
|
|
@@ -82,4 +82,4 @@ import "./components/Tooltip/index.js";
|
|
|
82
82
|
import { Typography, TypographyProps, TypographyVariant, TypographyVariantsOptions, typographyVariants } from "./components/Typography/Typography.js";
|
|
83
83
|
import "./components/Typography/index.js";
|
|
84
84
|
import { cn } from "./lib/cn.js";
|
|
85
|
-
export { AILoader, type AILoaderProps, type AILoaderRenderState, type AILoaderSize, type AILoaderState, type AILoaderTone, Accordion, type AccordionChevronPosition, AccordionHeader, type AccordionHeaderProps, AccordionItem, type AccordionItemProps, AccordionPanel, type AccordionPanelProps, type AccordionProps, type AccordionSize, AccordionTrigger, type AccordionTriggerProps, type AccordionVariant, Alert, type AlertAppearance, AlertDialog, AlertDialogAction, type AlertDialogActionProps, AlertDialogCancel, type AlertDialogCancelProps, AlertDialogDescription, type AlertDialogDescriptionProps, AlertDialogFooter, type AlertDialogFooterProps, AlertDialogHeader, type AlertDialogHeaderProps, AlertDialogPopup, type AlertDialogPopupProps, type AlertDialogPopupVariantsOptions, type AlertDialogProps, type AlertDialogScrollBehavior, type AlertDialogSize, AlertDialogTitle, type AlertDialogTitleProps, AlertDialogTrigger, type AlertDialogTriggerProps, type AlertProps, type AlertVariant, type AlertVariantsOptions, Avatar, AvatarBadge, type AvatarBadgeProps, AvatarFallback, type AvatarFallbackProps, AvatarGroup, type AvatarGroupProps, AvatarImage, type AvatarImageProps, type AvatarProps, type AvatarShape, type AvatarSize, type AvatarVariantsOptions, Badge, type BadgeAppearance, type BadgeProps, type BadgeSize, type BadgeVariant, type BadgeVariantsOptions, Box, type BoxBackground, type BoxPadding, type BoxProps, type BoxRadius, type BoxShadow, type BoxVariantsOptions, Breadcrumb, BreadcrumbEllipsis, type BreadcrumbEllipsisProps, BreadcrumbItem, type BreadcrumbItemProps, BreadcrumbLink, type BreadcrumbLinkProps, type BreadcrumbLinkVariantsOptions, BreadcrumbList, type BreadcrumbListProps, BreadcrumbPage, type BreadcrumbPageProps, type BreadcrumbProps, BreadcrumbSeparator, type BreadcrumbSeparatorProps, Button, type ButtonProps, type ButtonSize, type ButtonVariant, type ButtonVariantsOptions, Calendar, type CalendarDateRange, type CalendarMode, type CalendarProps, type CalendarState, Checkbox, CheckboxGroup, type CheckboxGroupProps, type CheckboxProps, type CheckboxSize, type CheckboxVariantsOptions, CodeBlock, type CodeBlockProps, type CodeBlockVariantsOptions, Combobox, type ComboboxAlign, ComboboxChip, type ComboboxChipProps, ComboboxChipRemove, type ComboboxChipRemoveProps, ComboboxChips, type ComboboxChipsProps, ComboboxClear, type ComboboxClearProps, ComboboxCollection, type ComboboxCollectionProps, ComboboxGroup, ComboboxGroupLabel, type ComboboxGroupLabelProps, type ComboboxGroupProps, ComboboxInput, ComboboxInputGroup, type ComboboxInputGroupProps, type ComboboxInputGroupVariantsOptions, type ComboboxInputProps, ComboboxItem, type ComboboxItemProps, ComboboxLabel, type ComboboxLabelProps, ComboboxPopup, type ComboboxPopupProps, type ComboboxProps, ComboboxSeparator, type ComboboxSeparatorProps, type ComboboxSize, ComboboxTrigger, type ComboboxTriggerProps, type ComboboxTriggerSize, type ComboboxTriggerVariant, ComboboxValue, type ComboboxValueProps, ContextMenu, type ContextMenuAlign, ContextMenuCheckboxItem, type ContextMenuCheckboxItemProps, ContextMenuGroup, ContextMenuGroupLabel, type ContextMenuGroupLabelProps, type ContextMenuGroupProps, ContextMenuItem, type ContextMenuItemProps, type ContextMenuItemVariant, ContextMenuLinkItem, type ContextMenuLinkItemProps, ContextMenuPopup, type ContextMenuPopupProps, type ContextMenuProps, ContextMenuRadioGroup, type ContextMenuRadioGroupProps, ContextMenuRadioItem, type ContextMenuRadioItemProps, ContextMenuSeparator, type ContextMenuSeparatorProps, ContextMenuShortcut, type ContextMenuShortcutProps, type ContextMenuSide, ContextMenuSubmenuRoot, type ContextMenuSubmenuRootProps, ContextMenuSubmenuTrigger, type ContextMenuSubmenuTriggerProps, ContextMenuTrigger, type ContextMenuTriggerProps, DatePicker, type DatePickerCalendarProps, type DatePickerPopupProps, type DatePickerProps, type DatePickerSize, type DatePickerVariant, type DatePickerVariantsOptions, DateRangePicker, type DateRangePickerCalendarProps, type DateRangePickerPopupProps, type DateRangePickerProps, type DateRangePickerSize, type DateRangePickerVariant, type DateRangePickerVariantsOptions, Dialog, DialogClose, type DialogCloseProps, DialogDescription, type DialogDescriptionProps, DialogFooter, type DialogFooterProps, DialogHeader, type DialogHeaderProps, DialogPopup, type DialogPopupProps, type DialogPopupVariantsOptions, type DialogProps, type DialogScrollBehavior, type DialogSize, DialogTitle, type DialogTitleProps, DialogTrigger, type DialogTriggerProps, Divider, type DividerLabelPosition, type DividerOrientation, type DividerProps, type DividerVariant, type DividerVariantsOptions, Drawer, DrawerClose, type DrawerCloseProps, DrawerDescription, type DrawerDescriptionProps, DrawerFooter, type DrawerFooterProps, DrawerHeader, type DrawerHeaderProps, DrawerIndent, DrawerIndentBackground, type DrawerIndentBackgroundProps, type DrawerIndentProps, DrawerPopup, type DrawerPopupProps, type DrawerPopupVariantsOptions, type DrawerProps, DrawerProvider, type DrawerSide, type DrawerSize, DrawerSwipeArea, type DrawerSwipeAreaProps, DrawerTitle, type DrawerTitleProps, DrawerTrigger, type DrawerTriggerProps, DrawerVirtualKeyboardProvider, Field, type FieldControlProps, FieldDescription, type FieldDescriptionProps, FieldError, type FieldErrorProps, FieldItem, type FieldItemProps, FieldLabel, type FieldLabelProps, type FieldLabelVariantsOptions, type FieldOrientation, type FieldProps, FieldValidity, type FieldValidityProps, Fieldset, FieldsetDescription, type FieldsetDescriptionProps, FieldsetLegend, type FieldsetLegendProps, type FieldsetLegendVariant, type FieldsetProps, FileUpload, FileUploadDropzone, type FileUploadDropzoneProps, type FileUploadDropzoneVariantsOptions, type FileUploadHandle, FileUploadItem, type FileUploadItemProps, type FileUploadItemStatus, FileUploadList, type FileUploadListProps, type FileUploadProps, type FileUploadRejection, type FileUploadRejectionCode, type FileUploadRenderState, FileUploadTrigger, type FileUploadTriggerProps, Form, type FormProps, Input, InputGroup, InputGroupAddon, type InputGroupAddonProps, type InputGroupProps, type InputProps, type InputSize, type InputVariantsOptions, Menu, type MenuAlign, MenuCheckboxItem, type MenuCheckboxItemProps, MenuGroup, MenuGroupLabel, type MenuGroupLabelProps, type MenuGroupProps, type MenuHandle, MenuItem, type MenuItemProps, type MenuItemVariant, type MenuItemVariantsOptions, MenuLinkItem, type MenuLinkItemProps, MenuPopup, type MenuPopupProps, type MenuProps, MenuRadioGroup, type MenuRadioGroupProps, MenuRadioItem, type MenuRadioItemProps, MenuSeparator, type MenuSeparatorProps, MenuShortcut, type MenuShortcutProps, type MenuSide, MenuSubmenuRoot, type MenuSubmenuRootProps, MenuSubmenuTrigger, type MenuSubmenuTriggerProps, MenuTrigger, type MenuTriggerProps, Meter, type MeterIndicatorVariantsOptions, type MeterProps, type MeterSize, type MeterTrackVariantsOptions, type MeterVariant, Popover, type PopoverAlign, PopoverClose, type PopoverCloseProps, PopoverDescription, type PopoverDescriptionProps, type PopoverHandle, PopoverPopup, type PopoverPopupProps, type PopoverPopupVariantsOptions, type PopoverProps, type PopoverSide, PopoverTitle, type PopoverTitleProps, PopoverTrigger, type PopoverTriggerProps, Progress, type ProgressIndicatorVariantsOptions, type ProgressProps, type ProgressSize, type ProgressTrackVariantsOptions, type ProgressVariant, Radio, RadioGroup, type RadioGroupProps, type RadioProps, type RadioSize, type RadioVariantsOptions, Select, type SelectAlign, SelectGroup, SelectGroupLabel, type SelectGroupLabelProps, type SelectGroupProps, SelectItem, type SelectItemProps, SelectLabel, type SelectLabelProps, SelectPopup, type SelectPopupProps, type SelectProps, SelectSeparator, type SelectSeparatorProps, SelectTrigger, type SelectTriggerProps, type SelectTriggerSize, type SelectTriggerVariant, type SelectTriggerVariantsOptions, SelectValue, type SelectValueProps, Skeleton, type SkeletonAnimation, type SkeletonProps, type SkeletonRenderState, type SkeletonVariant, type SkeletonVariantsOptions, Stepper, StepperDescription, type StepperDescriptionProps, StepperIndicator, type StepperIndicatorProps, StepperItem, type StepperItemProps, type StepperOrientation, type StepperProps, StepperSeparator, type StepperSeparatorProps, type StepperSize, StepperTitle, type StepperTitleProps, StepperTrigger, type StepperTriggerProps, type StepperTriggerVariantsOptions, Switch, type SwitchLabelPosition, type SwitchProps, type SwitchSize, type SwitchVariantsOptions, SystemState, type SystemStateBackground, type SystemStateProps, type SystemStateRenderState, type SystemStateScope, type SystemStateTitleLevel, type SystemStateVariant, Table, TableBody, type TableBodyProps, TableCaption, type TableCaptionProps, type TableCaptionRenderState, type TableCaptionSide, TableCell, type TableCellProps, TableContainer, type TableContainerProps, type TableContainerRenderState, type TableContainerVariant, TableFooter, type TableFooterProps, TableHead, type TableHeadProps, TableHeader, type TableHeaderProps, type TableLayout, type TableProps, type TableRenderState, TableRow, type TableRowProps, type TableRowRenderState, type TableSize, Tabs, type TabsIndicatorPosition, TabsList, type TabsListProps, type TabsListVariantsOptions, TabsPanel, type TabsPanelProps, type TabsProps, type TabsSize, TabsTab, type TabsTabProps, type TabsTabVariantsOptions, type TabsVariant, Timeline, TimelineConnector, type TimelineConnectorProps, TimelineContent, type TimelineContentProps, TimelineDescription, type TimelineDescriptionProps, TimelineIndicator, type TimelineIndicatorAppearance, type TimelineIndicatorProps, type TimelineIndicatorVariant, TimelineItem, type TimelineItemProps, type TimelineProps, TimelineSeparator, type TimelineSeparatorProps, type TimelineSeparatorVariant, type TimelineSize, TimelineTime, type TimelineTimeProps, TimelineTitle, type TimelineTitleProps, type ToastData, type ToastManager, type ToastObject, type ToastOptions, type ToastPosition, type ToastPromiseOptions, type ToastType, type ToastUpdateOptions, Toaster, type ToasterProps, Toggle, ToggleGroup, type ToggleGroupProps, type ToggleProps, type ToggleSize, type ToggleVariant, type ToggleVariantsOptions, Tooltip, type TooltipAlign, type TooltipHandle, TooltipPopup, type TooltipPopupProps, type TooltipPopupVariantsOptions, type TooltipProps, TooltipProvider, type TooltipProviderProps, type TooltipSide, TooltipTrigger, type TooltipTriggerProps, Typography, type TypographyProps, type TypographyVariant, type TypographyVariantsOptions, alertDialogPopupVariants, alertVariants, avatarVariants, badgeVariants, boxVariants, breadcrumbLinkVariants, buttonVariants, checkboxVariants, cn, codeBlockVariants, comboboxInputGroupVariants, createAlertDialogHandle, createDrawerHandle, createMenuHandle, createPopoverHandle, createToastManager, createTooltipHandle, datePickerVariants, dateRangePickerVariants, dialogPopupVariants, dividerVariants, drawerPopupVariants, fieldLabelVariants, fileUploadDropzoneVariants, formatFileSize, inputVariants, menuItemVariants, meterIndicatorVariants, meterTrackVariants, popoverPopupVariants, progressIndicatorVariants, progressTrackVariants, radioVariants, selectTriggerVariants, skeletonVariants, stepperTriggerVariants, switchVariants, tabsListVariants, tabsTabVariants, toast, toggleVariants, tooltipPopupVariants, typographyVariants, useComboboxFilter, useComboboxFilteredItems, useFieldControl, useFileUpload };
|
|
85
|
+
export { AILoader, type AILoaderProps, type AILoaderRenderState, type AILoaderSize, type AILoaderState, type AILoaderTone, Accordion, type AccordionChevronPosition, AccordionHeader, type AccordionHeaderProps, AccordionItem, type AccordionItemProps, AccordionPanel, type AccordionPanelProps, type AccordionProps, type AccordionSize, AccordionTrigger, type AccordionTriggerProps, type AccordionVariant, Alert, type AlertAppearance, AlertDialog, AlertDialogAction, type AlertDialogActionProps, AlertDialogCancel, type AlertDialogCancelProps, AlertDialogDescription, type AlertDialogDescriptionProps, AlertDialogFooter, type AlertDialogFooterProps, AlertDialogHeader, type AlertDialogHeaderProps, AlertDialogPopup, type AlertDialogPopupProps, type AlertDialogPopupVariantsOptions, type AlertDialogProps, type AlertDialogScrollBehavior, type AlertDialogSize, AlertDialogTitle, type AlertDialogTitleProps, AlertDialogTrigger, type AlertDialogTriggerProps, type AlertProps, type AlertVariant, type AlertVariantsOptions, Avatar, AvatarBadge, type AvatarBadgeProps, AvatarFallback, type AvatarFallbackProps, AvatarGroup, type AvatarGroupProps, AvatarImage, type AvatarImageProps, type AvatarProps, type AvatarShape, type AvatarSize, type AvatarVariantsOptions, Badge, type BadgeAppearance, type BadgeProps, type BadgeSize, type BadgeVariant, type BadgeVariantsOptions, Box, type BoxBackground, type BoxPadding, type BoxProps, type BoxRadius, type BoxShadow, type BoxVariantsOptions, Breadcrumb, BreadcrumbEllipsis, type BreadcrumbEllipsisProps, BreadcrumbItem, type BreadcrumbItemProps, BreadcrumbLink, type BreadcrumbLinkProps, type BreadcrumbLinkVariantsOptions, BreadcrumbList, type BreadcrumbListProps, BreadcrumbPage, type BreadcrumbPageProps, type BreadcrumbProps, BreadcrumbSeparator, type BreadcrumbSeparatorProps, Button, type ButtonProps, type ButtonSize, type ButtonVariant, type ButtonVariantsOptions, Calendar, type CalendarDateRange, type CalendarMode, type CalendarProps, type CalendarState, Checkbox, CheckboxGroup, type CheckboxGroupProps, type CheckboxProps, type CheckboxSize, type CheckboxVariantsOptions, CodeBlock, type CodeBlockProps, type CodeBlockVariantsOptions, Combobox, type ComboboxAlign, ComboboxChip, type ComboboxChipProps, ComboboxChipRemove, type ComboboxChipRemoveProps, ComboboxChips, type ComboboxChipsProps, ComboboxClear, type ComboboxClearProps, ComboboxCollection, type ComboboxCollectionProps, ComboboxGroup, ComboboxGroupLabel, type ComboboxGroupLabelProps, type ComboboxGroupProps, ComboboxInput, ComboboxInputGroup, type ComboboxInputGroupProps, type ComboboxInputGroupVariantsOptions, type ComboboxInputProps, ComboboxItem, type ComboboxItemProps, ComboboxLabel, type ComboboxLabelProps, ComboboxPopup, type ComboboxPopupProps, type ComboboxProps, ComboboxSeparator, type ComboboxSeparatorProps, type ComboboxSize, ComboboxTrigger, type ComboboxTriggerProps, type ComboboxTriggerSize, type ComboboxTriggerVariant, ComboboxValue, type ComboboxValueProps, ContextMenu, type ContextMenuAlign, ContextMenuCheckboxItem, type ContextMenuCheckboxItemProps, ContextMenuGroup, ContextMenuGroupLabel, type ContextMenuGroupLabelProps, type ContextMenuGroupProps, ContextMenuItem, type ContextMenuItemProps, type ContextMenuItemVariant, ContextMenuLinkItem, type ContextMenuLinkItemProps, ContextMenuPopup, type ContextMenuPopupProps, type ContextMenuProps, ContextMenuRadioGroup, type ContextMenuRadioGroupProps, ContextMenuRadioItem, type ContextMenuRadioItemProps, ContextMenuSeparator, type ContextMenuSeparatorProps, ContextMenuShortcut, type ContextMenuShortcutProps, type ContextMenuSide, ContextMenuSubmenuRoot, type ContextMenuSubmenuRootProps, ContextMenuSubmenuTrigger, type ContextMenuSubmenuTriggerProps, ContextMenuTrigger, type ContextMenuTriggerProps, DatePicker, type DatePickerCalendarProps, type DatePickerPopupProps, type DatePickerProps, type DatePickerSize, type DatePickerVariant, type DatePickerVariantsOptions, DateRangePicker, type DateRangePickerCalendarProps, type DateRangePickerPopupProps, type DateRangePickerProps, type DateRangePickerSize, type DateRangePickerVariant, type DateRangePickerVariantsOptions, Dialog, DialogClose, type DialogCloseProps, DialogDescription, type DialogDescriptionProps, DialogFooter, type DialogFooterProps, DialogHeader, type DialogHeaderProps, DialogPopup, type DialogPopupProps, type DialogPopupVariantsOptions, type DialogProps, type DialogScrollBehavior, type DialogSize, DialogTitle, type DialogTitleProps, DialogTrigger, type DialogTriggerProps, Divider, type DividerLabelPosition, type DividerOrientation, type DividerProps, type DividerVariant, type DividerVariantsOptions, Drawer, DrawerClose, type DrawerCloseProps, DrawerDescription, type DrawerDescriptionProps, DrawerFooter, type DrawerFooterProps, DrawerHeader, type DrawerHeaderProps, DrawerIndent, DrawerIndentBackground, type DrawerIndentBackgroundProps, type DrawerIndentProps, DrawerPopup, type DrawerPopupProps, type DrawerPopupVariantsOptions, type DrawerProps, DrawerProvider, type DrawerSide, type DrawerSize, DrawerSwipeArea, type DrawerSwipeAreaProps, DrawerTitle, type DrawerTitleProps, DrawerTrigger, type DrawerTriggerProps, DrawerVirtualKeyboardProvider, Field, type FieldControlProps, FieldDescription, type FieldDescriptionProps, FieldError, type FieldErrorProps, FieldItem, type FieldItemProps, FieldLabel, type FieldLabelProps, type FieldLabelVariantsOptions, type FieldOrientation, type FieldProps, FieldValidity, type FieldValidityProps, Fieldset, FieldsetDescription, type FieldsetDescriptionProps, FieldsetLegend, type FieldsetLegendProps, type FieldsetLegendVariant, type FieldsetProps, FileUpload, FileUploadDropzone, type FileUploadDropzoneProps, type FileUploadDropzoneVariant, type FileUploadDropzoneVariantsOptions, type FileUploadHandle, FileUploadItem, type FileUploadItemProps, type FileUploadItemStatus, FileUploadList, type FileUploadListProps, type FileUploadProps, type FileUploadRejection, type FileUploadRejectionCode, type FileUploadRenderState, FileUploadTrigger, type FileUploadTriggerProps, Form, type FormProps, Input, InputGroup, InputGroupAddon, type InputGroupAddonProps, type InputGroupProps, type InputProps, type InputSize, type InputVariantsOptions, Menu, type MenuAlign, MenuCheckboxItem, type MenuCheckboxItemProps, MenuGroup, MenuGroupLabel, type MenuGroupLabelProps, type MenuGroupProps, type MenuHandle, MenuItem, type MenuItemProps, type MenuItemVariant, type MenuItemVariantsOptions, MenuLinkItem, type MenuLinkItemProps, MenuPopup, type MenuPopupProps, type MenuProps, MenuRadioGroup, type MenuRadioGroupProps, MenuRadioItem, type MenuRadioItemProps, MenuSeparator, type MenuSeparatorProps, MenuShortcut, type MenuShortcutProps, type MenuSide, MenuSubmenuRoot, type MenuSubmenuRootProps, MenuSubmenuTrigger, type MenuSubmenuTriggerProps, MenuTrigger, type MenuTriggerProps, Meter, type MeterIndicatorVariantsOptions, type MeterProps, type MeterSize, type MeterTrackVariantsOptions, type MeterVariant, Popover, type PopoverAlign, PopoverClose, type PopoverCloseProps, PopoverDescription, type PopoverDescriptionProps, type PopoverHandle, PopoverPopup, type PopoverPopupProps, type PopoverPopupVariantsOptions, type PopoverProps, type PopoverSide, PopoverTitle, type PopoverTitleProps, PopoverTrigger, type PopoverTriggerProps, Progress, type ProgressIndicatorVariantsOptions, type ProgressProps, type ProgressSize, type ProgressTrackVariantsOptions, type ProgressVariant, Radio, RadioGroup, type RadioGroupProps, type RadioProps, type RadioSize, type RadioVariantsOptions, Select, type SelectAlign, SelectGroup, SelectGroupLabel, type SelectGroupLabelProps, type SelectGroupProps, SelectItem, type SelectItemProps, SelectLabel, type SelectLabelProps, SelectPopup, type SelectPopupProps, type SelectProps, SelectSeparator, type SelectSeparatorProps, SelectTrigger, type SelectTriggerProps, type SelectTriggerSize, type SelectTriggerVariant, type SelectTriggerVariantsOptions, SelectValue, type SelectValueProps, Skeleton, type SkeletonAnimation, type SkeletonProps, type SkeletonRenderState, type SkeletonVariant, type SkeletonVariantsOptions, Stepper, StepperDescription, type StepperDescriptionProps, StepperIndicator, type StepperIndicatorProps, StepperItem, type StepperItemProps, type StepperOrientation, type StepperProps, StepperSeparator, type StepperSeparatorProps, type StepperSize, StepperTitle, type StepperTitleProps, StepperTrigger, type StepperTriggerProps, type StepperTriggerVariantsOptions, Switch, type SwitchLabelPosition, type SwitchProps, type SwitchSize, type SwitchVariantsOptions, SystemState, type SystemStateBackground, type SystemStateProps, type SystemStateRenderState, type SystemStateScope, type SystemStateTitleLevel, type SystemStateVariant, Table, TableBody, type TableBodyProps, TableCaption, type TableCaptionProps, type TableCaptionRenderState, type TableCaptionSide, TableCell, type TableCellProps, TableContainer, type TableContainerProps, type TableContainerRenderState, type TableContainerVariant, TableFooter, type TableFooterProps, TableHead, type TableHeadProps, TableHeader, type TableHeaderProps, type TableLayout, type TableProps, type TableRenderState, TableRow, type TableRowProps, type TableRowRenderState, type TableSize, Tabs, type TabsIndicatorPosition, TabsList, type TabsListProps, type TabsListVariantsOptions, TabsPanel, type TabsPanelProps, type TabsProps, type TabsSize, TabsTab, type TabsTabProps, type TabsTabVariantsOptions, type TabsVariant, Timeline, TimelineConnector, type TimelineConnectorProps, TimelineContent, type TimelineContentProps, TimelineDescription, type TimelineDescriptionProps, TimelineIndicator, type TimelineIndicatorAppearance, type TimelineIndicatorProps, type TimelineIndicatorVariant, TimelineItem, type TimelineItemProps, type TimelineProps, TimelineSeparator, type TimelineSeparatorProps, type TimelineSeparatorVariant, type TimelineSize, TimelineTime, type TimelineTimeProps, TimelineTitle, type TimelineTitleProps, type ToastData, type ToastManager, type ToastObject, type ToastOptions, type ToastPosition, type ToastPromiseOptions, type ToastType, type ToastUpdateOptions, Toaster, type ToasterProps, Toggle, ToggleGroup, type ToggleGroupProps, type ToggleProps, type ToggleSize, type ToggleVariant, type ToggleVariantsOptions, Tooltip, type TooltipAlign, type TooltipHandle, TooltipPopup, type TooltipPopupProps, type TooltipPopupVariantsOptions, type TooltipProps, TooltipProvider, type TooltipProviderProps, type TooltipSide, TooltipTrigger, type TooltipTriggerProps, Typography, type TypographyProps, type TypographyVariant, type TypographyVariantsOptions, alertDialogPopupVariants, alertVariants, avatarVariants, badgeVariants, boxVariants, breadcrumbLinkVariants, buttonVariants, checkboxVariants, cn, codeBlockVariants, comboboxInputGroupVariants, createAlertDialogHandle, createDrawerHandle, createMenuHandle, createPopoverHandle, createToastManager, createTooltipHandle, datePickerVariants, dateRangePickerVariants, dialogPopupVariants, dividerVariants, drawerPopupVariants, fieldLabelVariants, fileUploadDropzoneVariants, formatFileSize, inputVariants, menuItemVariants, meterIndicatorVariants, meterTrackVariants, popoverPopupVariants, progressIndicatorVariants, progressTrackVariants, radioVariants, selectTriggerVariants, skeletonVariants, stepperTriggerVariants, switchVariants, tabsListVariants, tabsTabVariants, toast, toggleVariants, tooltipPopupVariants, typographyVariants, useComboboxFilter, useComboboxFilteredItems, useFieldControl, useFileUpload };
|