@questpie/admin 1.1.1 → 3.0.0

package/dist/client/components/fields/upload-field.mjs

@@ -0,0 +1,621 @@
+import { useResolveText, useTranslation } from "../../i18n/hooks.mjs";
+import { cn } from "../../lib/utils.mjs";
+import { selectClient, useAdminStore } from "../../runtime/provider.mjs";
+import { Button } from "../ui/button.mjs";
+import { sanitizeFilename, useResolvedControl } from "./field-utils.mjs";
+import { FieldWrapper } from "./field-wrapper.mjs";
+import { useCollectionItem } from "../../hooks/use-collection.mjs";
+import { ResourceSheet } from "../sheets/resource-sheet.mjs";
+import { useUploadCollection } from "../../hooks/use-upload-collection.mjs";
+import { useUpload } from "../../hooks/use-upload.mjs";
+import { AssetPreview } from "../primitives/asset-preview.mjs";
+import { MediaPickerDialog } from "../media/media-picker-dialog.mjs";
+import { Dropzone } from "../primitives/dropzone.mjs";
+import { c } from "react/compiler-runtime";
+import { Icon } from "@iconify/react";
+import * as React from "react";
+import { useQuery, useQueryClient } from "@tanstack/react-query";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { Controller } from "react-hook-form";
+import { DndContext, KeyboardSensor, PointerSensor, closestCenter, useSensor, useSensors } from "@dnd-kit/core";
+import { SortableContext, arrayMove, rectSortingStrategy, sortableKeyboardCoordinates, useSortable, verticalListSortingStrategy } from "@dnd-kit/sortable";
+import { CSS } from "@dnd-kit/utilities";
+import { toast } from "sonner";
+
+//#region src/client/components/fields/upload-field.tsx
+/**
+* UploadField Component
+*
+* Unified file upload field supporting both single and multiple uploads.
+* - Single mode (default): Value is asset ID (string | null)
+* - Multiple mode: Value is array of asset IDs (string[])
+*
+* @example Single upload
+* ```tsx
+* <UploadField
+*   name="featuredImage"
+*   label="Featured Image"
+*   accept={["image/*"]}
+*   maxSize={5_000_000}
+* />
+* ```
+*
+* @example Multiple uploads
+* ```tsx
+* <UploadField
+*   name="gallery"
+*   label="Gallery"
+*   multiple
+*   accept={["image/*"]}
+*   maxItems={10}
+*   orderable
+* />
+* ```
+*/
+/**
+* Normalize accept to always be an array.
+* Supports both string and array formats from field configs.
+*/
+function normalizeAccept(accept) {
+	if (!accept) return void 0;
+	if (Array.isArray(accept)) return accept;
+	return [accept];
+}
+function SortableAssetItem(t0) {
+	const $ = c(30);
+	const { id, asset, loading, progress, disabled, variant, orderable, editable, href, onRemove, onEdit } = t0;
+	let t1;
+	if ($[0] !== id) {
+		t1 = { id };
+		$[0] = id;
+		$[1] = t1;
+	} else t1 = $[1];
+	const { attributes, listeners, setNodeRef, transform, transition, isDragging } = useSortable(t1);
+	let t2;
+	if ($[2] !== transform) {
+		t2 = CSS.Transform.toString(transform);
+		$[2] = transform;
+		$[3] = t2;
+	} else t2 = $[3];
+	let t3;
+	if ($[4] !== t2 || $[5] !== transition) {
+		t3 = {
+			transform: t2,
+			transition
+		};
+		$[4] = t2;
+		$[5] = transition;
+		$[6] = t3;
+	} else t3 = $[6];
+	const style = t3;
+	const t4 = isDragging ? "opacity-50" : "";
+	let t5;
+	if ($[7] !== asset || $[8] !== id) {
+		t5 = asset || { id };
+		$[7] = asset;
+		$[8] = id;
+		$[9] = t5;
+	} else t5 = $[9];
+	const t6 = orderable && !disabled;
+	let t7;
+	if ($[10] !== attributes || $[11] !== listeners || $[12] !== orderable) {
+		t7 = orderable ? {
+			...attributes,
+			...listeners
+		} : void 0;
+		$[10] = attributes;
+		$[11] = listeners;
+		$[12] = orderable;
+		$[13] = t7;
+	} else t7 = $[13];
+	const t8 = disabled ? void 0 : onRemove;
+	const t9 = editable && !disabled ? onEdit : void 0;
+	let t10;
+	if ($[14] !== disabled || $[15] !== href || $[16] !== loading || $[17] !== progress || $[18] !== t5 || $[19] !== t6 || $[20] !== t7 || $[21] !== t8 || $[22] !== t9 || $[23] !== variant) {
+		t10 = /* @__PURE__ */ jsx(AssetPreview, {
+			asset: t5,
+			loading,
+			progress,
+			disabled,
+			variant,
+			showDragHandle: t6,
+			dragHandleProps: t7,
+			href,
+			onRemove: t8,
+			onEdit: t9
+		});
+		$[14] = disabled;
+		$[15] = href;
+		$[16] = loading;
+		$[17] = progress;
+		$[18] = t5;
+		$[19] = t6;
+		$[20] = t7;
+		$[21] = t8;
+		$[22] = t9;
+		$[23] = variant;
+		$[24] = t10;
+	} else t10 = $[24];
+	let t11;
+	if ($[25] !== setNodeRef || $[26] !== style || $[27] !== t10 || $[28] !== t4) {
+		t11 = /* @__PURE__ */ jsx("div", {
+			ref: setNodeRef,
+			style,
+			className: t4,
+			children: t10
+		});
+		$[25] = setNodeRef;
+		$[26] = style;
+		$[27] = t10;
+		$[28] = t4;
+		$[29] = t11;
+	} else t11 = $[29];
+	return t11;
+}
+function SingleUploadInner({ field, error, collection, unresolvedCollectionMessage, accept, maxSize, showPreview, editable, previewVariant, disabled, placeholder, onUploadStart, onUploadComplete, onUploadError, className }) {
+	"use no memo";
+	const normalizedAccept = normalizeAccept(accept);
+	const { t } = useTranslation();
+	const resolveText = useResolveText();
+	const resolvedPlaceholder = placeholder ? resolveText(placeholder) : void 0;
+	const { upload, isUploading, progress, error: uploadError } = useUpload();
+	const [isPickerOpen, setIsPickerOpen] = React.useState(false);
+	const [isEditSheetOpen, setIsEditSheetOpen] = React.useState(false);
+	const assetId = field.value;
+	const { data: asset, isLoading: isLoadingAsset } = useCollectionItem(collection, assetId || "", void 0, { enabled: !!collection && !!assetId && showPreview });
+	const handleDrop = async (files) => {
+		if (files.length === 0 || disabled) return;
+		if (!collection) {
+			toast.error(unresolvedCollectionMessage || t("error.noUploadCollection"));
+			return;
+		}
+		const originalFile = files[0];
+		const sanitizedName = sanitizeFilename(originalFile.name);
+		const file = new File([originalFile], sanitizedName, { type: originalFile.type });
+		try {
+			if (onUploadStart) onUploadStart();
+			const uploadedAsset = await upload(file, { to: collection });
+			field.onChange(uploadedAsset.id);
+			if (onUploadComplete) onUploadComplete(uploadedAsset);
+		} catch (err) {
+			let uploadErr;
+			if (err instanceof Error) uploadErr = err;
+			else uploadErr = new Error(t("upload.error"));
+			if (onUploadError) onUploadError(uploadErr);
+			toast.error(uploadErr.message);
+		}
+	};
+	const handleRemove = () => {
+		field.onChange(null);
+	};
+	const handleEdit = () => {
+		if (assetId) setIsEditSheetOpen(true);
+	};
+	const handleValidationError = (errors) => {
+		for (const validationError of errors) toast.error(validationError.message);
+	};
+	const hintText = React.useMemo(() => {
+		const parts = [];
+		if (normalizedAccept?.length) {
+			const types = normalizedAccept.map((t_0) => {
+				if (t_0.startsWith("image/")) return "Images";
+				if (t_0.startsWith("video/")) return "Videos";
+				if (t_0.startsWith("audio/")) return "Audio";
+				if (t_0 === "application/pdf") return "PDF";
+				return t_0;
+			}).filter((v, i, a) => a.indexOf(v) === i);
+			parts.push(types.join(", "));
+		}
+		if (maxSize) {
+			const mb = (maxSize / (1024 * 1024)).toFixed(0);
+			parts.push(`Max ${mb}MB`);
+		}
+		return parts.join(" • ") || void 0;
+	}, [normalizedAccept, maxSize]);
+	const hasValue = !!assetId;
+	const isLoading = isUploading || hasValue && isLoadingAsset;
+	const handlePickerSelect = (id) => {
+		if (typeof id === "string") field.onChange(id);
+	};
+	return /* @__PURE__ */ jsxs("div", {
+		className,
+		children: [
+			unresolvedCollectionMessage && /* @__PURE__ */ jsx("p", {
+				className: "border-warning/40 bg-warning/5 text-warning mb-2 border px-3 py-2 text-xs",
+				children: unresolvedCollectionMessage
+			}),
+			hasValue && showPreview && asset ? /* @__PURE__ */ jsx(AssetPreview, {
+				asset,
+				loading: isLoading,
+				progress: isUploading ? progress : void 0,
+				disabled,
+				variant: previewVariant,
+				onRemove: disabled ? void 0 : handleRemove,
+				onEdit: editable && !disabled ? handleEdit : void 0
+			}) : hasValue && showPreview && isLoadingAsset ? /* @__PURE__ */ jsx(AssetPreview, {
+				asset: { id: assetId },
+				loading: true,
+				disabled,
+				variant: previewVariant
+			}) : /* @__PURE__ */ jsx(Dropzone, {
+				onDrop: handleDrop,
+				accept: normalizedAccept,
+				maxSize,
+				multiple: false,
+				disabled,
+				loading: isUploading,
+				progress: isUploading ? progress : void 0,
+				label: resolvedPlaceholder || t("dropzone.label"),
+				hint: hintText,
+				onValidationError: handleValidationError
+			}),
+			!hasValue && !isUploading && !disabled && !!collection && /* @__PURE__ */ jsxs(Button, {
+				type: "button",
+				variant: "outline",
+				size: "sm",
+				onClick: () => setIsPickerOpen(true),
+				className: "mt-2 w-full",
+				children: [/* @__PURE__ */ jsx(Icon, {
+					icon: "ph:folder-open-bold",
+					className: "mr-2 size-4"
+				}), "Browse Library"]
+			}),
+			/* @__PURE__ */ jsx(MediaPickerDialog, {
+				open: isPickerOpen,
+				onOpenChange: setIsPickerOpen,
+				mode: "single",
+				accept: normalizedAccept,
+				onSelect: handlePickerSelect,
+				collection: collection || void 0
+			}),
+			assetId && !!collection && /* @__PURE__ */ jsx(ResourceSheet, {
+				type: "collection",
+				collection,
+				itemId: assetId,
+				open: isEditSheetOpen,
+				onOpenChange: setIsEditSheetOpen
+			}),
+			error && /* @__PURE__ */ jsx("p", {
+				className: "text-destructive mt-1 text-xs",
+				children: error
+			})
+		]
+	});
+}
+function MultipleUploadInner({ field, collection, unresolvedCollectionMessage, accept, maxSize, maxItems, orderable, layout, editable, disabled, placeholder, onUploadStart, onUploadComplete, onUploadError, className }) {
+	"use no memo";
+	const normalizedAccept = normalizeAccept(accept);
+	const { t } = useTranslation();
+	const resolveText = useResolveText();
+	const resolvedPlaceholder = placeholder ? resolveText(placeholder) : void 0;
+	const { uploadMany, isUploading, progress } = useUpload();
+	const client = useAdminStore(selectClient);
+	const [isPickerOpen, setIsPickerOpen] = React.useState(false);
+	const [editAssetId, setEditAssetId] = React.useState(null);
+	const [pendingUploads, setPendingUploads] = React.useState([]);
+	const queryClient = useQueryClient();
+	const sensors = useSensors(useSensor(PointerSensor), useSensor(KeyboardSensor, { coordinateGetter: sortableKeyboardCoordinates }));
+	const assetIds = field.value || [];
+	const { data: fetchedAssetsMap = /* @__PURE__ */ new Map() } = useQuery({
+		queryKey: [
+			"questpie",
+			"collections",
+			collection,
+			"batch-assets",
+			...assetIds
+		],
+		queryFn: async () => {
+			if (!client || !collection || assetIds.length === 0) return /* @__PURE__ */ new Map();
+			const response = await client.collections[collection].find({
+				where: { id: { in: assetIds } },
+				limit: assetIds.length
+			});
+			const map = /* @__PURE__ */ new Map();
+			if (response?.docs) for (const doc of response.docs) map.set(doc.id, doc);
+			return map;
+		},
+		enabled: !!client && !!collection && assetIds.length > 0,
+		staleTime: 3e4,
+		placeholderData: (prev) => prev
+	});
+	const handleDrop = (files) => {
+		if (files.length === 0 || disabled) return;
+		if (!collection) {
+			toast.error(unresolvedCollectionMessage || t("error.noUploadCollection"));
+			return;
+		}
+		const remainingSlots = maxItems ? maxItems - assetIds.length : files.length;
+		const filesToUpload = files.slice(0, remainingSlots);
+		if (filesToUpload.length < files.length) toast.warning(t("toast.maxFilesWarning", {
+			remaining: remainingSlots,
+			max: maxItems
+		}));
+		if (filesToUpload.length === 0) return;
+		const sanitizedFiles = filesToUpload.map((file) => {
+			const sanitizedName = sanitizeFilename(file.name);
+			return new File([file], sanitizedName, { type: file.type });
+		});
+		setPendingUploads(sanitizedFiles.map((file_0, index) => ({
+			id: `pending-${Date.now()}-${index}`,
+			file: file_0
+		})));
+		if (onUploadStart) onUploadStart();
+		uploadMany(sanitizedFiles, { to: collection }).then((uploadedAssets) => {
+			const newIds = uploadedAssets.map((a) => a.id);
+			field.onChange([...assetIds, ...newIds]);
+			queryClient.invalidateQueries({ queryKey: [
+				"questpie",
+				"collections",
+				collection,
+				"batch-assets"
+			] });
+			if (onUploadComplete) onUploadComplete(uploadedAssets);
+			setPendingUploads([]);
+		}, (err) => {
+			let uploadError;
+			if (err instanceof Error) uploadError = err;
+			else uploadError = new Error(t("upload.error"));
+			if (onUploadError) onUploadError(uploadError);
+			toast.error(uploadError.message);
+			setPendingUploads([]);
+		});
+	};
+	const handleRemove = (idToRemove) => {
+		field.onChange(assetIds.filter((id) => id !== idToRemove));
+	};
+	const handleEdit = (id_0) => {
+		setEditAssetId(id_0);
+	};
+	const handleDragEnd = (event) => {
+		const { active, over } = event;
+		if (over && active.id !== over.id) {
+			const oldIndex = assetIds.indexOf(active.id);
+			const newIndex = assetIds.indexOf(over.id);
+			if (oldIndex !== -1 && newIndex !== -1) {
+				const reordered = arrayMove(assetIds, oldIndex, newIndex);
+				field.onChange(reordered);
+			}
+		}
+	};
+	const handleValidationError = (errors) => {
+		for (const validationError of errors) toast.error(validationError.message);
+	};
+	const handlePickerSelect = (ids) => {
+		if (!collection) {
+			toast.error(unresolvedCollectionMessage || t("error.noUploadCollection"));
+			return;
+		}
+		const newIds_0 = Array.isArray(ids) ? ids : [ids];
+		const totalAfterAdd = assetIds.length + newIds_0.length;
+		if (maxItems && totalAfterAdd > maxItems) {
+			toast.warning(t("error.maxItemsAllowed", { max: maxItems }));
+			const remainingSlots_0 = maxItems - assetIds.length;
+			const idsToAdd = newIds_0.slice(0, remainingSlots_0);
+			field.onChange([...assetIds, ...idsToAdd]);
+		} else field.onChange([...assetIds, ...newIds_0]);
+	};
+	const hintText = React.useMemo(() => {
+		const parts = [];
+		if (normalizedAccept?.length) {
+			const types = normalizedAccept.map((t_0) => {
+				if (t_0.startsWith("image/")) return "Images";
+				if (t_0.startsWith("video/")) return "Videos";
+				if (t_0.startsWith("audio/")) return "Audio";
+				if (t_0 === "application/pdf") return "PDF";
+				return t_0;
+			}).filter((v, i, a_0) => a_0.indexOf(v) === i);
+			parts.push(types.join(", "));
+		}
+		if (maxSize) {
+			const mb = (maxSize / (1024 * 1024)).toFixed(0);
+			parts.push(`Max ${mb}MB`);
+		}
+		return parts.join(" • ") || void 0;
+	}, [normalizedAccept, maxSize]);
+	const hasItems = assetIds.length > 0 || pendingUploads.length > 0;
+	const canAddMore = !maxItems || assetIds.length < maxItems;
+	const previewVariant = layout === "grid" ? "thumbnail" : "compact";
+	return /* @__PURE__ */ jsxs("div", {
+		className,
+		children: [
+			unresolvedCollectionMessage && /* @__PURE__ */ jsx("p", {
+				className: "border-warning/40 bg-warning/5 text-warning mb-2 border px-3 py-2 text-xs",
+				children: unresolvedCollectionMessage
+			}),
+			hasItems && /* @__PURE__ */ jsx(DndContext, {
+				sensors,
+				collisionDetection: closestCenter,
+				onDragEnd: handleDragEnd,
+				children: /* @__PURE__ */ jsx(SortableContext, {
+					items: assetIds,
+					strategy: layout === "grid" ? rectSortingStrategy : verticalListSortingStrategy,
+					disabled: !orderable,
+					children: /* @__PURE__ */ jsxs("div", {
+						className: layout === "grid" ? "mb-3 grid grid-cols-2 gap-2 sm:grid-cols-3 md:grid-cols-4" : "mb-3 space-y-2",
+						children: [assetIds.map((id_1) => /* @__PURE__ */ jsx(SortableAssetItem, {
+							id: id_1,
+							asset: fetchedAssetsMap.get(id_1) || null,
+							disabled,
+							variant: previewVariant,
+							orderable,
+							editable,
+							onRemove: () => handleRemove(id_1),
+							onEdit: () => handleEdit(id_1)
+						}, id_1)), pendingUploads.map((pending_0, index_0) => /* @__PURE__ */ jsx("div", { children: /* @__PURE__ */ jsx(AssetPreview, {
+							asset: { filename: pending_0.file.name },
+							pendingFile: pending_0.file,
+							loading: true,
+							progress: Math.min(100, Math.max(0, progress - index_0 / pendingUploads.length * 100) * (pendingUploads.length / (pendingUploads.length - index_0))),
+							disabled: true,
+							variant: previewVariant
+						}) }, pending_0.id))]
+					})
+				})
+			}),
+			canAddMore && !isUploading && !!collection && /* @__PURE__ */ jsx(Dropzone, {
+				onDrop: handleDrop,
+				accept: normalizedAccept,
+				maxSize,
+				multiple: true,
+				disabled,
+				loading: isUploading,
+				progress: isUploading ? progress : void 0,
+				label: hasItems ? t("dropzone.addMore") : resolvedPlaceholder || t("dropzone.label"),
+				hint: hintText,
+				onValidationError: handleValidationError,
+				className: hasItems ? "min-h-[80px]" : void 0
+			}),
+			canAddMore && !isUploading && !disabled && !!collection && /* @__PURE__ */ jsxs(Button, {
+				type: "button",
+				variant: "outline",
+				size: "sm",
+				onClick: () => setIsPickerOpen(true),
+				className: "mt-2 w-full",
+				children: [/* @__PURE__ */ jsx(Icon, {
+					icon: "ph:folder-open-bold",
+					className: "mr-2 size-4"
+				}), "Browse Library"]
+			}),
+			/* @__PURE__ */ jsx(MediaPickerDialog, {
+				open: isPickerOpen,
+				onOpenChange: setIsPickerOpen,
+				mode: "multiple",
+				accept: normalizedAccept,
+				onSelect: handlePickerSelect,
+				maxItems: maxItems ? maxItems - assetIds.length : void 0,
+				collection: collection || void 0
+			}),
+			editAssetId && !!collection && /* @__PURE__ */ jsx(ResourceSheet, {
+				type: "collection",
+				collection,
+				itemId: editAssetId,
+				open: !!editAssetId,
+				onOpenChange: (open) => !open && setEditAssetId(null)
+			}),
+			isUploading && !canAddMore && /* @__PURE__ */ jsxs("div", {
+				className: "text-muted-foreground flex items-center justify-center gap-2 border border-dashed p-4 text-sm",
+				children: [
+					t("upload.uploading"),
+					" ",
+					progress,
+					"%"
+				]
+			})
+		]
+	});
+}
+function UploadField(t0) {
+	const $ = c(32);
+	const { name, label, description, placeholder, required, disabled, localized, locale, control, className, to, accept, maxSize, showPreview: t1, editable: t2, previewVariant, onUploadStart, onUploadComplete, onUploadError, multiple: t3, maxItems, orderable: t4, layout: t5 } = t0;
+	const showPreview = t1 === void 0 ? true : t1;
+	const editable = t2 === void 0 ? true : t2;
+	const multiple = t3 === void 0 ? false : t3;
+	const orderable = t4 === void 0 ? false : t4;
+	const layout = t5 === void 0 ? "grid" : t5;
+	const resolveText = useResolveText();
+	const resolvedControl = useResolvedControl(control);
+	const { collection: resolvedUploadCollection, collections: availableUploadCollections } = useUploadCollection(to);
+	const collection = resolvedUploadCollection || "";
+	let t6;
+	if ($[0] !== availableUploadCollections || $[1] !== resolvedUploadCollection) {
+		t6 = !resolvedUploadCollection ? availableUploadCollections.length > 1 ? `Multiple upload collections are available (${availableUploadCollections.join(", ")}). Configure the field with \`to\` to choose one.` : "No upload collection is configured for this field." : void 0;
+		$[0] = availableUploadCollections;
+		$[1] = resolvedUploadCollection;
+		$[2] = t6;
+	} else t6 = $[2];
+	const unresolvedCollectionMessage = t6;
+	const fieldDisabled = disabled || !!unresolvedCollectionMessage;
+	const effectivePreviewVariant = previewVariant ?? (multiple ? layout === "grid" ? "thumbnail" : "compact" : "card");
+	let t7;
+	if ($[3] !== accept || $[4] !== className || $[5] !== collection || $[6] !== description || $[7] !== editable || $[8] !== effectivePreviewVariant || $[9] !== fieldDisabled || $[10] !== label || $[11] !== layout || $[12] !== locale || $[13] !== localized || $[14] !== maxItems || $[15] !== maxSize || $[16] !== multiple || $[17] !== name || $[18] !== onUploadComplete || $[19] !== onUploadError || $[20] !== onUploadStart || $[21] !== orderable || $[22] !== placeholder || $[23] !== required || $[24] !== resolveText || $[25] !== showPreview || $[26] !== unresolvedCollectionMessage) {
+		t7 = (t8$1) => {
+			const { field, fieldState } = t8$1;
+			const assetIds = multiple ? field.value || [] : [];
+			return /* @__PURE__ */ jsx(FieldWrapper, {
+				name,
+				label: multiple && label && maxItems ? `${resolveText(label)} (${assetIds.length}/${maxItems})` : label ? resolveText(label) : void 0,
+				description,
+				required,
+				disabled: fieldDisabled,
+				localized,
+				locale,
+				error: fieldState.error?.message,
+				children: multiple ? /* @__PURE__ */ jsx(MultipleUploadInner, {
+					field,
+					error: fieldState.error?.message,
+					collection,
+					unresolvedCollectionMessage,
+					accept,
+					maxSize,
+					maxItems,
+					orderable,
+					layout,
+					editable,
+					disabled: fieldDisabled,
+					placeholder,
+					onUploadStart,
+					onUploadComplete,
+					onUploadError,
+					className: cn("qa-upload-field", className)
+				}) : /* @__PURE__ */ jsx(SingleUploadInner, {
+					field,
+					error: fieldState.error?.message,
+					collection,
+					unresolvedCollectionMessage,
+					accept,
+					maxSize,
+					showPreview,
+					editable,
+					previewVariant: effectivePreviewVariant,
+					disabled: fieldDisabled,
+					placeholder,
+					onUploadStart,
+					onUploadComplete,
+					onUploadError,
+					className: cn("qa-upload-field", className)
+				})
+			});
+		};
+		$[3] = accept;
+		$[4] = className;
+		$[5] = collection;
+		$[6] = description;
+		$[7] = editable;
+		$[8] = effectivePreviewVariant;
+		$[9] = fieldDisabled;
+		$[10] = label;
+		$[11] = layout;
+		$[12] = locale;
+		$[13] = localized;
+		$[14] = maxItems;
+		$[15] = maxSize;
+		$[16] = multiple;
+		$[17] = name;
+		$[18] = onUploadComplete;
+		$[19] = onUploadError;
+		$[20] = onUploadStart;
+		$[21] = orderable;
+		$[22] = placeholder;
+		$[23] = required;
+		$[24] = resolveText;
+		$[25] = showPreview;
+		$[26] = unresolvedCollectionMessage;
+		$[27] = t7;
+	} else t7 = $[27];
+	let t8;
+	if ($[28] !== name || $[29] !== resolvedControl || $[30] !== t7) {
+		t8 = /* @__PURE__ */ jsx(Controller, {
+			name,
+			control: resolvedControl,
+			render: t7
+		});
+		$[28] = name;
+		$[29] = resolvedControl;
+		$[30] = t7;
+		$[31] = t8;
+	} else t8 = $[31];
+	return t8;
+}
+
+//#endregion
+export { UploadField };