@dyrected/admin 2.6.0 → 2.6.2

package/dist/use-add-media-from-url-DHGAAVLY.js

@@ -0,0 +1,1604 @@
+import * as React$1 from "react";
+import { createContext, useContext } from "react";
+import { jsx } from "react/jsx-runtime";
+import { clsx } from "clsx";
+import { extendTailwindMerge } from "tailwind-merge";
+import * as z from "zod";
+//#region src/providers/dyrected-context.ts
+var DyrectedContext = createContext(void 0);
+function useDyrected() {
+	const context = useContext(DyrectedContext);
+	if (!context) throw new Error("useDyrected must be used within a DyrectedProvider");
+	return context;
+}
+//#endregion
+//#region src/lib/utils.ts
+var customTwMerge = extendTailwindMerge({ prefix: "dy-" });
+/**
+* Merges Tailwind class names, resolving conflicts with the `dy-` prefix.
+* Drop-in replacement for `clsx` that handles Dyrected's scoped Tailwind build.
+*/
+function cn(...inputs) {
+	return customTwMerge(clsx(inputs));
+}
+/**
+* Resolves a media field value to an absolute URL.
+*
+* Handles three input shapes:
+* - A fully-qualified URL (`https://...`) — returned as-is.
+* - A root-relative path (`/uploads/...`) — origin prepended from `baseUrl`.
+* - A bare filename or storage path (`default/photo.jpg`) — prefixed with `/api/media/`.
+*
+* Bare strings that look like document IDs (no extension, no slash) are returned
+* as an empty string so they are not treated as media assets.
+*
+* @param val - A media field value: a URL string, storage path, or a document object with a `url` or `filename` property.
+* @param baseUrl - The Dyrected backend base URL, used to build the origin for relative paths.
+* @returns A fully-qualified URL string, or `""` if the value cannot be resolved.
+*/
+function getMediaUrl(val, baseUrl) {
+	if (!val) return "";
+	let baseOrigin = "";
+	if (baseUrl) if (baseUrl.startsWith("http://") || baseUrl.startsWith("https://")) try {
+		baseOrigin = new URL(baseUrl).origin;
+	} catch {
+		const match = baseUrl.match(/^(https?:\/\/[^\/]+)/);
+		baseOrigin = match ? match[1] : baseUrl;
+	}
+	else baseOrigin = baseUrl;
+	const prependBase = (urlPath) => {
+		if (urlPath.startsWith("http://") || urlPath.startsWith("https://")) return urlPath;
+		const cleanPath = urlPath.startsWith("/") ? urlPath : "/" + urlPath;
+		if (cleanPath.startsWith("/uploads/")) return `${baseOrigin.endsWith("/") ? baseOrigin.slice(0, -1) : baseOrigin}${cleanPath}`;
+		const basePrefix = baseUrl.endsWith("/") ? baseUrl.slice(0, -1) : baseUrl;
+		try {
+			const baseObj = new URL(basePrefix);
+			const basePathname = baseObj.pathname === "/" ? "" : baseObj.pathname;
+			if (basePathname && cleanPath.startsWith(basePathname)) return `${baseObj.origin}${cleanPath}`;
+		} catch {
+			if (basePrefix && cleanPath.startsWith(basePrefix)) return cleanPath;
+		}
+		return `${basePrefix}${cleanPath}`;
+	};
+	let targetUrl = "";
+	if (typeof val === "object" && val !== null) targetUrl = val.url || val.filename || "";
+	else targetUrl = String(val);
+	if (!targetUrl) return "";
+	if (targetUrl.startsWith("http://") || targetUrl.startsWith("https://") || targetUrl.startsWith("/")) return targetUrl;
+	if (!targetUrl.includes("/") && !/\.[a-z0-9]+($|\?)/i.test(targetUrl)) return "";
+	return prependBase(`/api/media/${targetUrl}`);
+}
+/**
+* Strips the directory prefix from a filename / storage path, returning only the last component (the actual filename).
+* E.g., "dyrected_cloud/j95sv/bcuul/WhatsApp Image 2026-06-20 at 12" -> "WhatsApp Image 2026-06-20 at 12"
+*/
+function getDisplayFilename(filename) {
+	if (!filename) return "";
+	const parts = filename.split("/");
+	return parts[parts.length - 1];
+}
+/**
+* Resolves the site URL, overriding it with the current origin during local development on localhost/127.0.0.1.
+*/
+function getSiteUrl(configuredSiteUrl) {
+	if (typeof window !== "undefined") {
+		if (window.location.pathname.startsWith("/sites/")) return configuredSiteUrl || "";
+		if (window.location.hostname === "localhost" || window.location.hostname === "127.0.0.1") return window.location.origin;
+	}
+	return configuredSiteUrl || (typeof window !== "undefined" ? window.location.origin : "");
+}
+//#endregion
+//#region src/hooks/admin-theme.ts
+function resolveAdminTheme(preference, systemTheme) {
+	return preference === "system" ? systemTheme : preference;
+}
+function adminThemeClassName(resolvedTheme) {
+	return resolvedTheme === "dark" ? "dy-admin-ui dark" : "dy-admin-ui";
+}
+function getSystemAdminTheme() {
+	if (typeof window === "undefined" || typeof window.matchMedia !== "function") return "light";
+	return window.matchMedia("(prefers-color-scheme: dark)")?.matches ? "dark" : "light";
+}
+//#endregion
+//#region src/hooks/admin-theme-context.ts
+var AdminThemeContext = React$1.createContext(null);
+//#endregion
+//#region src/hooks/use-admin-theme.ts
+function useAdminTheme() {
+	const context = React$1.useContext(AdminThemeContext);
+	if (!context) {
+		const resolvedTheme = getSystemAdminTheme();
+		return {
+			theme: "system",
+			systemTheme: resolvedTheme,
+			resolvedTheme,
+			setTheme: () => void 0,
+			themeClassName: adminThemeClassName(resolvedTheme),
+			controller: null
+		};
+	}
+	const state = React$1.useSyncExternalStore(context.subscribe, context.getState, context.getState);
+	return React$1.useMemo(() => ({
+		...state,
+		setTheme: context.setTheme,
+		controller: context
+	}), [
+		context,
+		context.setTheme,
+		state
+	]);
+}
+//#endregion
+//#region src/lib/media-utils.ts
+/**
+* Safely resolves the collection slug to use for media uploads.
+* If the target collection is upload-enabled, returns collectionSlug.
+* Otherwise, safely falls back to "media".
+*/
+function resolveActiveMediaCollection(schemas, collectionSlug) {
+	if (!collectionSlug) return "media";
+	if ((schemas?.collections?.find((c) => c.slug === collectionSlug))?.upload) return collectionSlug;
+	return "media";
+}
+/**
+* Determines whether a media item is an External asset (embed/remote link) or an
+* Internal asset (uploaded file in storage) based strictly on its persisted metadata.
+*/
+function getMediaSourceInfo(item) {
+	if (!item || typeof item !== "object") return {
+		source: "internal",
+		type: "storage",
+		label: "Uploaded Asset"
+	};
+	const obj = item;
+	const mimeType = String(obj.mimeType || "");
+	const filesize = typeof obj.filesize === "number" ? obj.filesize : typeof obj.size === "number" ? obj.size : void 0;
+	const urlStr = String(obj.url || "");
+	const isRemoteUrl = urlStr.startsWith("http://") || urlStr.startsWith("https://");
+	if (mimeType === "video/youtube") return {
+		source: "external",
+		type: "youtube",
+		label: "YouTube Embed"
+	};
+	if (mimeType === "video/vimeo") return {
+		source: "external",
+		type: "vimeo",
+		label: "Vimeo Embed"
+	};
+	if (mimeType === "image/external") return {
+		source: "external",
+		type: "external-cdn",
+		label: "External Image"
+	};
+	if (mimeType === "video/external" || mimeType.startsWith("external/") || mimeType.startsWith("video/") && filesize === 0 && isRemoteUrl) return {
+		source: "external",
+		type: "external-cdn",
+		label: "External Video"
+	};
+	if (mimeType === "application/external" || filesize === 0 && isRemoteUrl) return {
+		source: "external",
+		type: "external-cdn",
+		label: "External Asset"
+	};
+	return {
+		source: "internal",
+		type: "storage",
+		label: "Uploaded Asset"
+	};
+}
+/** Returns true if the given item is an external asset. */
+function isExternalMedia(item) {
+	return getMediaSourceInfo(item).source === "external";
+}
+/**
+* Checks whether an error indicates that Dyrected media storage is not configured.
+*/
+function isStorageNotConfiguredError(error) {
+	if (!error) return false;
+	const lower = (typeof error === "string" ? error : error?.message || error?.description || String(error)).toLowerCase();
+	return lower.includes("storage not configured") || lower.includes("storage is not configured");
+}
+/**
+* Formats a media error into a friendly, non-technical message.
+*/
+function formatMediaErrorMessage(error) {
+	if (isStorageNotConfiguredError(error)) return "Media storage is not configured yet. Please ask your developer to set up a storage provider in Dyrected.";
+	if (error instanceof Error) return error.message;
+	if (typeof error === "string") return error;
+	return error?.message || "An unexpected media error occurred";
+}
+//#endregion
+//#region src/hooks/use-preferences.ts
+function arePreferenceValuesEqual(a, b) {
+	if (Object.is(a, b)) return true;
+	try {
+		return JSON.stringify(a) === JSON.stringify(b);
+	} catch {
+		return false;
+	}
+}
+/**
+* A hook to manage and persist user preferences in the Admin UI.
+* Uses localStorage for immediate persistence and syncs to the user profile
+* when an authenticated Dyrected client is available.
+*/
+function usePreferences(key, defaultValue) {
+	const { client, user } = useDyrected();
+	const localStorageKey = `dyrected_pref_${key}`;
+	const localWriteVersionRef = React$1.useRef(0);
+	const defaultValueRef = React$1.useRef(defaultValue);
+	defaultValueRef.current = defaultValue;
+	const [value, setValue] = React$1.useState(() => {
+		if (typeof window === "undefined") return defaultValue;
+		try {
+			const stored = window.localStorage.getItem(localStorageKey);
+			return stored ? JSON.parse(stored) : defaultValue;
+		} catch (e) {
+			console.warn(`[usePreferences] Error loading key "${key}":`, e);
+			return defaultValue;
+		}
+	});
+	React$1.useEffect(() => {
+		if (typeof window === "undefined") return;
+		try {
+			const stored = window.localStorage.getItem(localStorageKey);
+			const nextValue = stored ? JSON.parse(stored) : defaultValueRef.current;
+			setValue((prev) => arePreferenceValuesEqual(prev, nextValue) ? prev : nextValue);
+		} catch (e) {
+			console.warn(`[usePreferences] Error syncing key "${key}":`, e);
+		}
+	}, [key, localStorageKey]);
+	React$1.useEffect(() => {
+		if (!client || !user) return;
+		let cancelled = false;
+		const writeVersion = localWriteVersionRef.current;
+		client.getPreference(key).then((result) => {
+			if (cancelled || result.value === null || localWriteVersionRef.current !== writeVersion) return;
+			setValue((prev) => arePreferenceValuesEqual(prev, result.value) ? prev : result.value);
+			if (typeof window !== "undefined") window.localStorage.setItem(localStorageKey, JSON.stringify(result.value));
+		}).catch((e) => {
+			console.warn(`[usePreferences] Error loading remote key "${key}":`, e);
+		});
+		return () => {
+			cancelled = true;
+		};
+	}, [
+		client,
+		user,
+		key,
+		localStorageKey
+	]);
+	return [value, React$1.useCallback((updater) => {
+		setValue((prev) => {
+			localWriteVersionRef.current += 1;
+			const newValue = typeof updater === "function" ? updater(prev) : updater;
+			if (arePreferenceValuesEqual(prev, newValue)) return prev;
+			if (typeof window !== "undefined") try {
+				window.localStorage.setItem(localStorageKey, JSON.stringify(newValue));
+			} catch (e) {
+				console.warn(`[usePreferences] Error saving key "${key}":`, e);
+			}
+			if (client && user) client.setPreference(key, newValue).catch((e) => {
+				console.warn(`[usePreferences] Error saving remote key "${key}":`, e);
+			});
+			return newValue;
+		});
+	}, [
+		client,
+		user,
+		key,
+		localStorageKey
+	])];
+}
+//#endregion
+//#region src/lib/external-media.ts
+var YOUTUBE_RE = /(?:youtu\.be\/|youtube\.com\/(?:v\/|u\/\w\/|embed\/|watch\?v=))([^#&?]*)/;
+var VIMEO_RE = /vimeo\.com\/(?:video\/)?([0-9]+)/;
+var IMAGE_RE = /\.(jpeg|jpg|gif|png|webp|svg|avif)(?:\?.*)?$/i;
+var VIDEO_RE = /\.(mp4|webm|ogg|mov|m4v|mkv)(?:\?.*)?$/i;
+/** Extract the trailing filename from a URL, stripping any query string. */
+function filenameFromUrl(url, fallback) {
+	return url.split("/").pop()?.split("?")[0] || fallback;
+}
+/** Check if a URL points to an embeddable video streaming site (YouTube or Vimeo). */
+function isEmbeddableVideoUrl(url) {
+	const trimmed = url.trim();
+	return YOUTUBE_RE.test(trimmed) || VIMEO_RE.test(trimmed);
+}
+/** Check if a URL points directly to a raster/vector image file. */
+function isDirectImageUrl(url) {
+	return IMAGE_RE.test(url.trim());
+}
+/**
+* Build a media document payload from an external URL.
+* Returns `null` when the input is empty/whitespace.
+*/
+function buildExternalMediaPayload(rawUrl) {
+	const url = rawUrl.trim();
+	if (!url) return null;
+	const yt = url.match(YOUTUBE_RE);
+	if (yt && yt[1]) return {
+		filename: `YouTube: ${yt[1]}`,
+		url,
+		mimeType: "video/youtube",
+		filesize: 0,
+		id: `yt_${yt[1]}`
+	};
+	const vimeo = url.match(VIMEO_RE);
+	if (vimeo && vimeo[1]) return {
+		filename: `Vimeo: ${vimeo[1]}`,
+		url,
+		mimeType: "video/vimeo",
+		filesize: 0,
+		id: `vm_${vimeo[1]}`
+	};
+	if (IMAGE_RE.test(url)) return {
+		filename: filenameFromUrl(url, "External Image"),
+		url,
+		mimeType: "image/external",
+		filesize: 0,
+		id: `img_${Math.random().toString(36).substring(7)}`
+	};
+	if (VIDEO_RE.test(url)) {
+		const ext = url.split(".").pop()?.split("?")[0] || "mp4";
+		return {
+			filename: filenameFromUrl(url, "External Video"),
+			url,
+			mimeType: `video/${ext === "mov" ? "quicktime" : ext}`,
+			filesize: 0,
+			id: `vid_${Math.random().toString(36).substring(7)}`
+		};
+	}
+	return {
+		filename: filenameFromUrl(url, "External File"),
+		url,
+		mimeType: "application/external",
+		filesize: 0,
+		id: `ext_${Math.random().toString(36).substring(7)}`
+	};
+}
+/**
+* Resolves the thumbnail/preview image URL for any media item — external or uploaded.
+*
+* This is the single source of truth used by every media surface (grid, picker,
+* library dialog) so YouTube, Vimeo, external images, and uploaded files all render
+* consistently everywhere.
+* - `video/youtube` → the YouTube thumbnail for the video id
+* - `video/vimeo`   → the Vimeo logo placeholder
+* - `image/external`→ the external URL itself
+* - anything else   → resolved through {@link getMediaUrl}
+*/
+function getMediaPreviewUrl(item, baseUrl) {
+	if (!item) return "";
+	const obj = typeof item === "object" && item !== null ? item : null;
+	const mimeType = obj ? obj.mimeType : void 0;
+	const url = obj ? obj.url : void 0;
+	if (mimeType === "video/youtube") {
+		const match = url?.match(YOUTUBE_RE);
+		const videoId = match && match[1];
+		return videoId ? `https://img.youtube.com/vi/${videoId}/mqdefault.jpg` : "";
+	}
+	if (mimeType === "video/vimeo") return "https://vimeo.com/assets/images/logo_vimeo_blue.png";
+	if (mimeType === "image/external") return url || "";
+	return getMediaUrl(item, baseUrl);
+}
+/**
+* Returns the player embed URL for an external video item (YouTube/Vimeo), or
+* `null` for anything that isn't an embeddable video. Used to render an inline
+* iframe player instead of a static thumbnail.
+*/
+function getVideoEmbedUrl(item) {
+	const obj = typeof item === "object" && item !== null ? item : null;
+	if (!obj) return null;
+	const mimeType = obj.mimeType;
+	const url = obj.url || "";
+	if (mimeType === "video/youtube") {
+		const m = url.match(YOUTUBE_RE);
+		return m && m[1] ? `https://www.youtube.com/embed/${m[1]}` : null;
+	}
+	if (mimeType === "video/vimeo") {
+		const m = url.match(VIMEO_RE);
+		return m && m[1] ? `https://player.vimeo.com/video/${m[1]}` : null;
+	}
+	return null;
+}
+//#endregion
+//#region src/lib/compress-image.ts
+/**
+* Compress a raster image file client-side using the Canvas API before upload.
+* - Skips SVGs, GIFs, and non-images (returned unchanged).
+* - Skips if the environment lacks DOM Canvas / URL API (SSR or Node.js test environment).
+* - Skips if the result would be larger than the original.
+* - maxDimension: longest edge cap in pixels (default 2048).
+* - quality: JPEG/WebP quality 0–1 (default 0.85).
+*/
+async function compressImage(file, maxDimension = 2048, quality = .85) {
+	if (!file.type.startsWith("image/") || file.type === "image/svg+xml" || file.type === "image/gif" || typeof URL === "undefined" || typeof URL.createObjectURL !== "function" || typeof Image === "undefined") return file;
+	return new Promise((resolve) => {
+		try {
+			const img = new Image();
+			const objectUrl = URL.createObjectURL(file);
+			img.onerror = () => {
+				if (typeof URL.revokeObjectURL === "function") URL.revokeObjectURL(objectUrl);
+				resolve(file);
+			};
+			img.onload = () => {
+				if (typeof URL.revokeObjectURL === "function") URL.revokeObjectURL(objectUrl);
+				let { width, height } = img;
+				if (width > maxDimension || height > maxDimension) {
+					const ratio = Math.min(maxDimension / width, maxDimension / height);
+					width = Math.round(width * ratio);
+					height = Math.round(height * ratio);
+				}
+				const canvas = document.createElement("canvas");
+				canvas.width = width;
+				canvas.height = height;
+				const ctx = canvas.getContext("2d");
+				if (!ctx) {
+					resolve(file);
+					return;
+				}
+				ctx.drawImage(img, 0, 0, width, height);
+				const outputType = file.type === "image/png" ? "image/png" : "image/jpeg";
+				canvas.toBlob((blob) => {
+					if (!blob || blob.size >= file.size) {
+						resolve(file);
+						return;
+					}
+					resolve(new File([blob], file.name, {
+						type: outputType,
+						lastModified: Date.now()
+					}));
+				}, outputType, quality);
+			};
+			img.src = objectUrl;
+		} catch {
+			resolve(file);
+		}
+	});
+}
+//#endregion
+//#region src/controllers/media.ts
+function createStore(initialState) {
+	let state = initialState;
+	const listeners = /* @__PURE__ */ new Set();
+	return {
+		getState: () => state,
+		setState: (updater) => {
+			state = typeof updater === "function" ? updater(state) : updater;
+			listeners.forEach((listener) => listener());
+		},
+		subscribe: (listener) => {
+			listeners.add(listener);
+			return () => listeners.delete(listener);
+		}
+	};
+}
+function ensureClient(client) {
+	if (!client) throw new Error("SDK Client not initialized");
+	return client;
+}
+function randomId(prefix) {
+	return `${prefix}_${Date.now()}_${Math.random().toString(36).slice(2, 9)}`;
+}
+async function maybeCompressImage(file, compressImages, maxDimension, quality) {
+	if (!compressImages) return file;
+	return compressImage(file, maxDimension, quality);
+}
+function createMediaUploadController({ client, schemas, collection, compressImages = true, maxDimension = 2048, quality = .85, onCompletedItem, onAllCompleted, onError }) {
+	const activeCollection = resolveActiveMediaCollection(schemas, collection);
+	const store = createStore({
+		activeCollection,
+		isUploading: false,
+		queue: []
+	});
+	const processFile = async (item) => {
+		const sdkClient = ensureClient(client);
+		store.setState((state) => ({
+			...state,
+			queue: state.queue.map((queuedItem) => queuedItem.id === item.id ? {
+				...queuedItem,
+				status: "uploading",
+				progress: 0,
+				error: void 0
+			} : queuedItem)
+		}));
+		try {
+			const processedFile = await maybeCompressImage(item.file, compressImages, maxDimension, quality);
+			store.setState((state) => ({
+				...state,
+				queue: state.queue.map((queuedItem) => queuedItem.id === item.id ? {
+					...queuedItem,
+					compressedSize: processedFile.size
+				} : queuedItem)
+			}));
+			const result = await sdkClient.collection(activeCollection).upload(processedFile, void 0, { onProgress: (progress) => {
+				store.setState((state) => ({
+					...state,
+					queue: state.queue.map((queuedItem) => queuedItem.id === item.id ? {
+						...queuedItem,
+						progress
+					} : queuedItem)
+				}));
+			} });
+			const completedItem = {
+				...item,
+				compressedSize: processedFile.size,
+				progress: 100,
+				status: "completed",
+				result
+			};
+			store.setState((state) => ({
+				...state,
+				queue: state.queue.map((queuedItem) => queuedItem.id === item.id ? completedItem : queuedItem)
+			}));
+			await onCompletedItem?.(result);
+			return completedItem;
+		} catch (error) {
+			const message = formatMediaErrorMessage(error);
+			const normalizedError = new Error(message);
+			const failedItem = {
+				...item,
+				status: "error",
+				error: message
+			};
+			store.setState((state) => ({
+				...state,
+				queue: state.queue.map((queuedItem) => queuedItem.id === item.id ? failedItem : queuedItem)
+			}));
+			onError?.(normalizedError, item.file);
+			return failedItem;
+		}
+	};
+	return {
+		getState: store.getState,
+		subscribe: store.subscribe,
+		async uploadFiles(files) {
+			if (files.length === 0) return [];
+			const queueItems = files.map((file, index) => ({
+				id: randomId(`upload_${index}`),
+				file,
+				originalSize: file.size,
+				compressedSize: file.size,
+				progress: 0,
+				status: "queued"
+			}));
+			store.setState((state) => ({
+				...state,
+				isUploading: true,
+				queue: [...state.queue, ...queueItems]
+			}));
+			const completedItems = [];
+			for (const queueItem of queueItems) {
+				const result = await processFile(queueItem);
+				if (result.status === "completed" && result.result) completedItems.push(result.result);
+			}
+			store.setState((state) => ({
+				...state,
+				isUploading: false
+			}));
+			if (completedItems.length > 0) await onAllCompleted?.(completedItems);
+			return completedItems;
+		},
+		async retryUpload(id) {
+			const queueItem = store.getState().queue.find((item) => item.id === id);
+			if (!queueItem) return null;
+			store.setState((state) => ({
+				...state,
+				isUploading: true
+			}));
+			const result = await processFile(queueItem);
+			store.setState((state) => ({
+				...state,
+				isUploading: false
+			}));
+			return result.result ?? null;
+		},
+		removeQueueItem(id) {
+			store.setState((state) => ({
+				...state,
+				queue: state.queue.filter((item) => item.id !== id)
+			}));
+		},
+		clearCompleted() {
+			store.setState((state) => ({
+				...state,
+				queue: state.queue.filter((item) => item.status !== "completed")
+			}));
+		}
+	};
+}
+function createMediaURLController({ client, schemas, collection, compressImages = true, maxDimension = 2048, quality = .85, onAdded, onError }) {
+	const activeCollection = resolveActiveMediaCollection(schemas, collection);
+	const store = createStore({
+		activeCollection,
+		isSubmitting: false
+	});
+	const classifyURL = (url) => {
+		const trimmed = url.trim();
+		const payload = buildExternalMediaPayload(trimmed);
+		if (!payload) return {
+			kind: "unknown",
+			payload: null
+		};
+		if (payload.mimeType === "video/youtube") return {
+			kind: "youtube",
+			payload
+		};
+		if (payload.mimeType === "video/vimeo") return {
+			kind: "vimeo",
+			payload
+		};
+		if (payload.mimeType === "image/external" || isDirectImageUrl(trimmed)) return {
+			kind: "direct-image",
+			payload
+		};
+		if (payload.mimeType.startsWith("video/")) return {
+			kind: "direct-video",
+			payload
+		};
+		if (payload.mimeType === "application/external") return {
+			kind: "generic-file",
+			payload
+		};
+		return {
+			kind: "unknown",
+			payload
+		};
+	};
+	return {
+		getState: store.getState,
+		subscribe: store.subscribe,
+		classifyURL,
+		async importURL(url) {
+			const sdkClient = ensureClient(client);
+			const trimmed = url.trim();
+			const { payload } = classifyURL(trimmed);
+			if (!trimmed || !payload) throw new Error("A valid media URL is required");
+			store.setState((state) => ({
+				...state,
+				isSubmitting: true
+			}));
+			try {
+				let result;
+				if (isEmbeddableVideoUrl(trimmed)) result = await sdkClient.collection(activeCollection).create(payload);
+				else if (payload.mimeType.startsWith("video/") || payload.mimeType === "application/external") result = await sdkClient.collection(activeCollection).create(payload);
+				else if (isDirectImageUrl(trimmed) || payload.mimeType === "image/external") try {
+					const response = await fetch(trimmed);
+					if (!response.ok) throw new Error(`HTTP error ${response.status}`);
+					const blob = await response.blob();
+					const processedFile = await maybeCompressImage(new File([blob], filenameFromUrl(trimmed, "image.jpg"), { type: blob.type || "image/jpeg" }), compressImages, maxDimension, quality);
+					result = await sdkClient.collection(activeCollection).upload(processedFile, void 0);
+				} catch (fetchError) {
+					console.warn("Direct image fetch failed (e.g. CORS). Falling back to external CDN reference:", fetchError);
+					result = await sdkClient.collection(activeCollection).create(payload);
+				}
+				else result = await sdkClient.collection(activeCollection).create(payload);
+				await onAdded?.(result);
+				return result;
+			} catch (error) {
+				const message = formatMediaErrorMessage(error);
+				const normalizedError = new Error(message);
+				console.error("Failed to add media from URL", normalizedError);
+				onError?.(normalizedError);
+				throw normalizedError;
+			} finally {
+				store.setState((state) => ({
+					...state,
+					isSubmitting: false
+				}));
+			}
+		}
+	};
+}
+function createMediaLibraryController({ client, schemas, collection, pageSize = 12, initialSearchQuery = "", initialSelectedIds = [] }) {
+	const activeCollection = resolveActiveMediaCollection(schemas, collection);
+	const store = createStore({
+		activeCollection,
+		items: [],
+		selectedIds: initialSelectedIds,
+		searchQuery: initialSearchQuery,
+		page: 1,
+		hasNextPage: false,
+		isLoading: false,
+		error: null
+	});
+	const loadPage = async (page, append) => {
+		const sdkClient = ensureClient(client);
+		const currentState = store.getState();
+		store.setState({
+			...currentState,
+			isLoading: true,
+			error: null,
+			page
+		});
+		try {
+			const response = await sdkClient.listMedia({
+				where: currentState.searchQuery ? { filename: { contains: currentState.searchQuery } } : void 0,
+				limit: pageSize,
+				page
+			}, activeCollection);
+			const docs = response.docs;
+			store.setState((state) => ({
+				...state,
+				items: append ? [...state.items, ...docs] : docs,
+				hasNextPage: Boolean(response.hasNextPage),
+				isLoading: false,
+				error: null
+			}));
+			return docs;
+		} catch (error) {
+			const message = formatMediaErrorMessage(error);
+			const normalizedError = new Error(message);
+			store.setState((state) => ({
+				...state,
+				isLoading: false,
+				error: normalizedError
+			}));
+			throw normalizedError;
+		}
+	};
+	return {
+		getState: store.getState,
+		subscribe: store.subscribe,
+		load() {
+			return loadPage(1, false);
+		},
+		search(query) {
+			store.setState((state) => ({
+				...state,
+				searchQuery: query,
+				page: 1
+			}));
+			return loadPage(1, false);
+		},
+		loadNextPage() {
+			const state = store.getState();
+			if (state.isLoading || !state.hasNextPage) return Promise.resolve([]);
+			return loadPage(state.page + 1, true);
+		},
+		setSelectedIds(ids) {
+			store.setState((state) => ({
+				...state,
+				selectedIds: ids
+			}));
+		},
+		select(id) {
+			store.setState((state) => ({
+				...state,
+				selectedIds: state.selectedIds.includes(id) ? state.selectedIds : [...state.selectedIds, id]
+			}));
+		},
+		deselect(id) {
+			store.setState((state) => ({
+				...state,
+				selectedIds: state.selectedIds.filter((selectedId) => selectedId !== id)
+			}));
+		},
+		toggle(id) {
+			store.setState((state) => ({
+				...state,
+				selectedIds: state.selectedIds.includes(id) ? state.selectedIds.filter((selectedId) => selectedId !== id) : [...state.selectedIds, id]
+			}));
+		},
+		clearSelection() {
+			store.setState((state) => ({
+				...state,
+				selectedIds: []
+			}));
+		}
+	};
+}
+//#endregion
+//#region src/hooks/use-media-library.ts
+function useMediaLibrary({ collection, pageSize = 12, initialSearchQuery = "", initialSelectedIds = [] }) {
+	const { client, schemas } = useDyrected();
+	const selectedIdsKey = React$1.useMemo(() => initialSelectedIds.join("|"), [initialSelectedIds]);
+	const controller = React$1.useMemo(() => {
+		return createMediaLibraryController({
+			client,
+			schemas,
+			collection,
+			pageSize,
+			initialSearchQuery,
+			initialSelectedIds
+		});
+	}, [
+		client,
+		schemas,
+		collection,
+		pageSize,
+		initialSearchQuery,
+		selectedIdsKey
+	]);
+	const state = React$1.useSyncExternalStore(controller.subscribe, controller.getState, controller.getState);
+	const selectedItems = React$1.useMemo(() => state.items.filter((item) => state.selectedIds.includes(item.id)), [state.items, state.selectedIds]);
+	return {
+		...state,
+		load: controller.load,
+		search: controller.search,
+		loadNextPage: controller.loadNextPage,
+		setSelectedIds: controller.setSelectedIds,
+		select: controller.select,
+		deselect: controller.deselect,
+		toggle: controller.toggle,
+		clearSelection: controller.clearSelection,
+		selectedItems
+	};
+}
+//#endregion
+//#region src/hooks/use-media-url.ts
+function useMediaURL({ collection, compressImages = true, maxDimension = 2048, quality = .85, onAdded, onError }) {
+	const { client, schemas } = useDyrected();
+	const [url, setUrl] = React$1.useState("");
+	const handlersRef = React$1.useRef({
+		onAdded,
+		onError
+	});
+	handlersRef.current = {
+		onAdded,
+		onError
+	};
+	const controller = React$1.useMemo(() => {
+		return createMediaURLController({
+			client,
+			schemas,
+			collection,
+			compressImages,
+			maxDimension,
+			quality,
+			onAdded: async (item) => {
+				await handlersRef.current.onAdded?.(item);
+			},
+			onError: (error) => {
+				handlersRef.current.onError?.(error);
+			}
+		});
+	}, [
+		client,
+		schemas,
+		collection,
+		compressImages,
+		maxDimension,
+		quality
+	]);
+	const state = React$1.useSyncExternalStore(controller.subscribe, controller.getState, controller.getState);
+	const submit = React$1.useCallback(async () => {
+		const trimmed = url.trim();
+		if (!trimmed) return;
+		await controller.importURL(trimmed);
+		setUrl("");
+	}, [controller, url]);
+	const classifyURL = React$1.useCallback((nextUrl) => controller.classifyURL(nextUrl), [controller]);
+	return {
+		url,
+		setUrl,
+		submit,
+		importURL: controller.importURL,
+		classifyURL,
+		isSubmitting: state.isSubmitting,
+		canSubmit: !!url.trim() && !state.isSubmitting,
+		activeCollection: state.activeCollection
+	};
+}
+//#endregion
+//#region src/hooks/use-media-upload.ts
+function useMediaUpload({ collectionSlug = "media", compressImages = true, maxDimension = 2048, quality = .85, onCompletedItem, onAllCompleted, onError } = {}) {
+	const { client, schemas } = useDyrected();
+	const handlersRef = React$1.useRef({
+		onCompletedItem,
+		onAllCompleted,
+		onError
+	});
+	handlersRef.current = {
+		onCompletedItem,
+		onAllCompleted,
+		onError
+	};
+	const controller = React$1.useMemo(() => {
+		return createMediaUploadController({
+			client,
+			schemas,
+			collection: collectionSlug,
+			compressImages,
+			maxDimension,
+			quality,
+			onCompletedItem: async (item) => {
+				await handlersRef.current.onCompletedItem?.(item);
+			},
+			onAllCompleted: async (items) => {
+				await handlersRef.current.onAllCompleted?.(items);
+			},
+			onError: (error, file) => {
+				handlersRef.current.onError?.(error, file);
+			}
+		});
+	}, [
+		client,
+		schemas,
+		collectionSlug,
+		compressImages,
+		maxDimension,
+		quality
+	]);
+	const state = React$1.useSyncExternalStore(controller.subscribe, controller.getState, controller.getState);
+	return {
+		queue: state.queue,
+		isUploading: state.isUploading,
+		activeCollection: state.activeCollection,
+		uploadFiles: controller.uploadFiles,
+		retryUpload: controller.retryUpload,
+		removeQueueItem: controller.removeQueueItem,
+		clearCompleted: controller.clearCompleted,
+		clearQueue: controller.clearCompleted
+	};
+}
+//#endregion
+//#region src/components/forms/utils.ts
+/**
+* Normalises a field's `options` array to the canonical `{ label, value }` shape.
+* Accepts either a shorthand string array or the full object form.
+*/
+function normalizeOptions(options) {
+	if (!options) return [];
+	return options.map((opt) => typeof opt === "string" ? {
+		label: opt,
+		value: opt
+	} : opt);
+}
+/**
+* Builds a Zod schema shape from a collection's field definitions.
+* Used by the form engine to validate the edit form before submission.
+*
+* @param fields - Field definitions from the collection schema.
+* @param isEdit - When `true`, password fields accept an empty string (no change).
+* @returns A record of Zod validators keyed by field name, suitable for `z.object(shape)`.
+*/
+function buildSchemaShape(fields, isEdit = false) {
+	const shape = {};
+	fields.forEach((field) => {
+		if (field.type === "join") return;
+		if (field.type === "row" && field.fields) {
+			Object.assign(shape, buildSchemaShape(field.fields, isEdit));
+			return;
+		}
+		const name = field.name;
+		let validator = z.any();
+		const label = field.label || name.charAt(0).toUpperCase() + name.slice(1);
+		const isPassword = name === "password" || field.type === "password";
+		if (field.type === "object" && field.fields) {
+			validator = z.object(buildSchemaShape(field.fields, isEdit));
+			if (!field.required) validator = validator.optional();
+			shape[name] = validator;
+			return;
+		}
+		if (field.type === "blocks") {
+			validator = z.array(z.any());
+			if (!field.required) validator = validator.optional();
+			shape[name] = validator;
+			return;
+		}
+		if (field.type === "array" && field.fields) {
+			validator = z.array(z.object(buildSchemaShape(field.fields, isEdit)));
+			if (!field.required) validator = validator.optional();
+			shape[name] = validator;
+			return;
+		}
+		const fieldType = field.type;
+		if (fieldType === "relationship" || fieldType === "image") {
+			const singleRelSchema = z.union([z.string(), z.object({ id: z.string() }).passthrough()]);
+			validator = z.union([singleRelSchema, z.array(singleRelSchema)]);
+			if (field.required) validator = validator.refine((val) => {
+				if (typeof val === "string") return val.trim().length > 0;
+				if (Array.isArray(val)) {
+					if (val.length === 0) return false;
+					return val.every((item) => {
+						if (typeof item === "string") return item.trim().length > 0;
+						if (item && typeof item === "object") return typeof item.id === "string" && item.id.trim().length > 0;
+						return false;
+					});
+				}
+				if (val && typeof val === "object") return typeof val.id === "string" && val.id.trim().length > 0;
+				return false;
+			}, { message: `${label} is required` });
+		} else if (fieldType === "text" || fieldType === "textarea" || fieldType === "select" || fieldType === "radio" || fieldType === "richText" || fieldType === "date" || fieldType === "datetime" || fieldType === "time" || fieldType === "icon" || fieldType === "password") {
+			validator = z.string();
+			if (isPassword) if (!isEdit) validator = validator.min(8, "Password must be at least 8 characters");
+			else validator = z.string().refine((val) => val === "" || val.length >= 8, { message: "Password must be at least 8 characters" });
+			else if (field.required) validator = validator.min(1, `${label} is required`);
+		} else if (field.type === "email") {
+			validator = z.string().email(`${label} must be a valid email`);
+			if (field.required) validator = validator.min(1, `${label} is required`);
+		} else if (field.type === "url") {
+			const urlObjectSchema = z.object({
+				type: z.enum(["custom", "internal"]),
+				url: z.string(),
+				relationTo: z.string().optional(),
+				value: z.string().optional(),
+				label: z.string().optional()
+			});
+			validator = z.union([z.string(), urlObjectSchema]);
+			if (field.required) validator = validator.refine((val) => {
+				if (typeof val === "string") return val.trim().length > 0;
+				if (val && typeof val === "object") return typeof val.url === "string" && val.url.trim().length > 0;
+				return false;
+			}, { message: `${label} is required` });
+		} else if (field.type === "number") validator = z.coerce.number();
+		else if (field.type === "boolean") validator = z.boolean();
+		else if (field.type === "json") validator = z.any();
+		else if (field.type === "multiSelect") {
+			validator = z.array(z.string());
+			if (field.required) validator = validator.min(1, `${label} requires at least one selection`);
+		}
+		if (!field.required && field.type !== "multiSelect") validator = validator.optional().or(z.literal(""));
+		else if (!field.required && field.type === "multiSelect") validator = validator.optional();
+		shape[name] = validator;
+	});
+	return shape;
+}
+/**
+* Builds `react-hook-form` default values from a collection's field definitions
+* and an existing document (or an empty object for new documents).
+*
+* Handles nested `object`, `array`, and `blocks` fields recursively.
+* Relationship and image fields are normalised to their IDs.
+* Password fields are always reset to `""` so they are never pre-filled.
+*
+* @param fields - Field definitions from the collection schema.
+* @param defaults - Existing document data, or `{}` for a new document.
+*/
+function buildDefaultValues(fields, defaults) {
+	return fields.reduce((acc, field) => {
+		if (field.type === "join") {
+			if (field.name && defaults[field.name] !== void 0) acc[field.name] = defaults[field.name];
+			return acc;
+		}
+		if (field.type === "row" && field.fields) {
+			Object.assign(acc, buildDefaultValues(field.fields, defaults));
+			return acc;
+		}
+		const name = field.name;
+		let defaultVal = defaults[name] ?? field.defaultValue;
+		if (name === "password" || field.type === "password") defaultVal = "";
+		if (field.type === "object" && field.fields) {
+			acc[name] = buildDefaultValues(field.fields, defaultVal || {});
+			return acc;
+		}
+		if (field.type === "array") {
+			const arr = Array.isArray(defaultVal) ? defaultVal : [];
+			if (field.fields) acc[name] = arr.map((item) => buildDefaultValues(field.fields, item || {}));
+			else acc[name] = arr;
+			return acc;
+		}
+		if (field.type === "blocks") {
+			acc[name] = (Array.isArray(defaultVal) ? defaultVal : []).map((item) => {
+				const block = field.blocks?.find((b) => b.slug === item.blockType);
+				if (block && block.fields) {
+					const merged = {
+						...item,
+						...buildDefaultValues(block.fields, item || {})
+					};
+					if (block.variants?.length && merged.variant == null) merged.variant = block.variants[0].slug;
+					return merged;
+				}
+				return item;
+			});
+			return acc;
+		}
+		if (field.type === "relationship" || field.type === "image") {
+			if (Array.isArray(defaultVal)) acc[name] = defaultVal.map((val) => val && typeof val === "object" && "id" in val ? val.id : val);
+			else if (defaultVal && typeof defaultVal === "object" && "id" in defaultVal) acc[name] = defaultVal.id;
+			else acc[name] = defaultVal ?? "";
+			return acc;
+		}
+		if (defaultVal === void 0) if (field.type === "boolean") defaultVal = false;
+		else if (field.type === "multiSelect") defaultVal = [];
+		else if (field.type === "json") defaultVal = {};
+		else defaultVal = "";
+		acc[name] = defaultVal;
+		return acc;
+	}, {});
+}
+/**
+* Flattens a nested `react-hook-form` errors object into a list of
+* `{ path, message }` pairs for rendering under individual fields.
+*
+* @param errors - The `formState.errors` object from `react-hook-form`.
+* @param path - Dot-notation prefix accumulated during recursion (omit when calling externally).
+* @returns A flat array of field path / error message pairs.
+*/
+function getFlatErrors(errors, path = "") {
+	const result = [];
+	if (!errors) return result;
+	if (typeof errors === "object") {
+		const asMsg = errors;
+		if (typeof asMsg.message === "string") {
+			result.push({
+				path,
+				message: asMsg.message
+			});
+			return result;
+		}
+		for (const key in errors) if (Object.prototype.hasOwnProperty.call(errors, key)) {
+			if (key === "ref" || key === "type") continue;
+			const nextPath = path ? `${path}.${key}` : key;
+			result.push(...getFlatErrors(errors[key], nextPath));
+		}
+	}
+	return result;
+}
+/**
+* Formats a dot-notation field path into a human-readable label.
+* Array indices are converted to 1-based "Item N" labels.
+*
+* @example
+* formatPath("address.street")      // → "Address > Street"
+* formatPath("items.0.name")        // → "Items > Item 1 > Name"
+*/
+function formatPath(path) {
+	return path.split(".").map((part) => {
+		if (/^\d+$/.test(part)) return `Item ${parseInt(part, 10) + 1}`;
+		return part.charAt(0).toUpperCase() + part.slice(1).replace(/([A-Z])/g, " $1");
+	}).join(" > ");
+}
+/**
+* Walks the schema tree alongside a dot-notation path (e.g. "body.2.cta.url")
+* and returns the ordered PathSegments representing each drillable container
+* boundary crossed. Drillable boundaries are:
+*   - `blocks` fields (always drillable)
+*   - `array` or `object` fields with `admin.drillIn === true`
+* Leaf field names and raw numeric indices are consumed but not emitted.
+*
+* @param fields       Top-level field schemas for the collection.
+* @param path         Dot-notation path, e.g. "body.2.cta.url"
+* @param getStableId  Resolves (basePath, rawIndex) → stableId from live
+*                     useFieldArray state. Takes the full cumulative RHF path
+*                     (e.g. "body.2.items"), not just the leaf field name, to
+*                     disambiguate identically-named sub-arrays across block types.
+* @returns Ordered PathSegment[] for the drill-in trail, or null if the path
+*          cannot be resolved against the schema.
+*/
+function resolveContainerPath(fields, path, getStableId) {
+	const segments = path.split(".");
+	const result = [];
+	let currentFields = fields;
+	let i = 0;
+	let cumulativePath = "";
+	const join = (base, next) => base ? `${base}.${next}` : next;
+	const labelFor = (field, name) => field.label || name.charAt(0).toUpperCase() + name.slice(1);
+	while (i < segments.length) {
+		const segment = segments[i];
+		if (/^\d+$/.test(segment)) {
+			cumulativePath = join(cumulativePath, segment);
+			i++;
+			continue;
+		}
+		const field = currentFields.find((f) => f.name === segment);
+		if (!field) return null;
+		const isLast = i === segments.length - 1;
+		const fieldPath = join(cumulativePath, segment);
+		const isBlocks = field.type === "blocks";
+		const isDrillInArray = field.type === "array" && field.admin?.drillIn === true;
+		if (isBlocks || isDrillInArray) {
+			const nextIndex = i + 1 < segments.length ? parseInt(segments[i + 1], 10) : NaN;
+			if (isLast || isNaN(nextIndex)) break;
+			const itemBasePath = join(fieldPath, String(nextIndex));
+			result.push({
+				fieldName: segment,
+				basePath: itemBasePath,
+				stableId: getStableId(fieldPath, nextIndex),
+				breadcrumbLabel: labelFor(field, segment)
+			});
+			cumulativePath = itemBasePath;
+			i += 2;
+			currentFields = isBlocks ? (field.blocks ?? []).flatMap((b) => b.fields ?? []) : field.fields ?? [];
+			continue;
+		}
+		if (field.type === "object" && field.admin?.drillIn === true) {
+			if (isLast) break;
+			result.push({
+				fieldName: segment,
+				basePath: fieldPath,
+				stableId: void 0,
+				breadcrumbLabel: labelFor(field, segment)
+			});
+			cumulativePath = fieldPath;
+			i++;
+			currentFields = field.fields ?? [];
+			continue;
+		}
+		cumulativePath = fieldPath;
+		if (field.fields && !isLast) currentFields = field.fields;
+		i++;
+	}
+	return result;
+}
+//#endregion
+//#region src/controllers/form.ts
+/**
+* Normalizes a dotted field path into path segments.
+*/
+function normalizeFieldPath(path) {
+	return path.split(".").map((segment) => segment.trim()).filter(Boolean);
+}
+/**
+* Alias for `normalizeFieldPath` used in public field/path helpers.
+*/
+function getFieldPathSegments(path) {
+	return normalizeFieldPath(path);
+}
+/**
+* Joins path parts into one dotted Dyrected field path.
+*/
+function joinFieldPath(...parts) {
+	return parts.flatMap((part) => {
+		if (part === null || part === void 0 || part === false) return [];
+		return String(part).split(".").map((segment) => segment.trim()).filter(Boolean);
+	}).join(".");
+}
+/**
+* Returns the parent path for a given dotted field path.
+*/
+function getParentFieldPath(path) {
+	return normalizeFieldPath(path).slice(0, -1).join(".");
+}
+/**
+* Reads a nested value using a dotted Dyrected field path.
+*/
+function getValueAtPath(value, path) {
+	if (!path) return value;
+	return normalizeFieldPath(path).reduce((currentValue, segment) => {
+		if (currentValue == null) return void 0;
+		return currentValue[segment];
+	}, value);
+}
+/**
+* Writes a nested value immutably using a dotted Dyrected field path.
+*/
+function setValueAtPath(value, path, nextValue) {
+	const segments = normalizeFieldPath(path);
+	if (segments.length === 0) return nextValue;
+	const root = Array.isArray(value) ? [...value] : { ...value ?? {} };
+	let cursor = root;
+	segments.forEach((segment, index) => {
+		if (index === segments.length - 1) {
+			cursor[segment] = nextValue;
+			return;
+		}
+		const existing = cursor[segment];
+		const nextSegment = segments[index + 1];
+		const nextContainer = existing && typeof existing === "object" ? Array.isArray(existing) ? [...existing] : { ...existing } : /^\d+$/.test(nextSegment) ? [] : {};
+		cursor[segment] = nextContainer;
+		cursor = nextContainer;
+	});
+	return root;
+}
+function findFieldSchema(fields, path) {
+	const segments = normalizeFieldPath(path).filter((segment) => !/^\d+$/.test(segment));
+	if (segments.length === 0) return null;
+	let currentFields = fields;
+	let currentField = null;
+	for (const segment of segments) {
+		currentField = currentFields.find((field) => field.name === segment) ?? null;
+		if (!currentField) return null;
+		if (currentField.type === "blocks") {
+			currentFields = currentField.blocks?.flatMap((block) => block.fields ?? []) ?? [];
+			continue;
+		}
+		currentFields = currentField.fields ?? [];
+	}
+	return currentField;
+}
+/**
+* Creates a framework-agnostic Dyrected form controller.
+*
+* This is the low-level state contract behind the React and Vue form APIs.
+*/
+function createDyrectedFormController({ collection, fields, documentId, readOnly = false, initialValues = {}, initialErrors = {}, initialDirtyFields = {}, initialTouchedFields = {}, initialIsDirty = false, initialIsSubmitting = false, initialIsValid = true, initialSubmitCount = 0, adapters }) {
+	let state = {
+		collection,
+		fields,
+		values: initialValues,
+		errors: initialErrors,
+		dirtyFields: initialDirtyFields,
+		touchedFields: initialTouchedFields,
+		isDirty: initialIsDirty,
+		isSubmitting: initialIsSubmitting,
+		isValid: initialIsValid,
+		submitCount: initialSubmitCount,
+		readOnly,
+		documentId
+	};
+	const listeners = /* @__PURE__ */ new Set();
+	let controllerAdapters = adapters;
+	const emit = () => {
+		listeners.forEach((listener) => listener());
+	};
+	const setState = (nextState) => {
+		state = typeof nextState === "function" ? nextState(state) : {
+			...state,
+			...nextState
+		};
+		emit();
+	};
+	const controller = {
+		getState: () => state,
+		subscribe: (listener) => {
+			listeners.add(listener);
+			return () => listeners.delete(listener);
+		},
+		setAdapters: (nextAdapters) => {
+			controllerAdapters = nextAdapters;
+		},
+		setState,
+		getValue: (path) => getValueAtPath(state.values, path),
+		getValues: () => state.values,
+		setValue: (path, value, options) => {
+			controllerAdapters?.setValue?.(path, value, options);
+			state = {
+				...state,
+				values: setValueAtPath(state.values, path, value),
+				isDirty: options?.shouldDirty ? true : state.isDirty,
+				dirtyFields: options?.shouldDirty ? {
+					...state.dirtyFields,
+					[path]: true
+				} : state.dirtyFields,
+				touchedFields: options?.shouldTouch ? {
+					...state.touchedFields,
+					[path]: true
+				} : state.touchedFields
+			};
+			emit();
+		},
+		getFieldSchema: (path) => findFieldSchema(state.fields, path),
+		getFieldState: (path) => {
+			const error = state.errors[path];
+			return {
+				path,
+				schema: findFieldSchema(state.fields, path),
+				value: getValueAtPath(state.values, path),
+				error,
+				isDirty: Boolean(state.dirtyFields[path]),
+				isTouched: Boolean(state.touchedFields[path]),
+				invalid: Boolean(error),
+				setValue: (value, options) => {
+					if (state.readOnly) return;
+					controller.setValue(path, value, {
+						shouldDirty: true,
+						shouldTouch: true,
+						...options
+					});
+				},
+				validate: async () => controller.validate(path)
+			};
+		},
+		reset: (values) => {
+			controllerAdapters?.reset?.(values);
+			state = {
+				...state,
+				values: values ?? {},
+				errors: {},
+				dirtyFields: {},
+				touchedFields: {},
+				isDirty: false
+			};
+			emit();
+		},
+		validate: async (paths) => controllerAdapters?.validate?.(paths) ?? true,
+		submit: async () => {
+			if (!controllerAdapters?.submit) return state.values;
+			return controllerAdapters.submit();
+		}
+	};
+	return controller;
+}
+//#endregion
+//#region src/providers/dyrected-form-context.tsx
+var DyrectedFormContext = React$1.createContext(null);
+var DyrectedFieldPathContext = React$1.createContext(null);
+function DyrectedFormProvider({ controller, children }) {
+	return /* @__PURE__ */ jsx(DyrectedFormContext.Provider, {
+		value: controller,
+		children
+	});
+}
+function DyrectedFieldPathProvider({ path, children }) {
+	return /* @__PURE__ */ jsx(DyrectedFieldPathContext.Provider, {
+		value: path,
+		children
+	});
+}
+function useDyrectedFormControllerContext() {
+	const controller = React$1.useContext(DyrectedFormContext);
+	if (!controller) throw new Error("useDyrectedForm must be used within a DyrectedFormProvider");
+	return controller;
+}
+function useDyrectedFieldPathContext() {
+	return React$1.useContext(DyrectedFieldPathContext);
+}
+//#endregion
+//#region src/hooks/use-dyrected-form.ts
+function useDyrectedForm() {
+	const controller = useDyrectedFormControllerContext();
+	return {
+		...React$1.useSyncExternalStore(controller.subscribe, controller.getState, controller.getState),
+		getValue: controller.getValue,
+		getValues: controller.getValues,
+		setValue: controller.setValue,
+		getFieldSchema: controller.getFieldSchema,
+		getFieldState: controller.getFieldState,
+		reset: controller.reset,
+		validate: controller.validate,
+		submit: controller.submit,
+		controller
+	};
+}
+//#endregion
+//#region src/controllers/field.ts
+/**
+* Creates a field-scoped controller from a Dyrected form controller and a path.
+*/
+function createDyrectedFieldController(formController, path) {
+	let lastFormState = formController.getState();
+	let lastFieldState = formController.getFieldState(path);
+	return {
+		getState: () => {
+			const nextFormState = formController.getState();
+			if (nextFormState === lastFormState) return lastFieldState;
+			lastFormState = nextFormState;
+			lastFieldState = formController.getFieldState(path);
+			return lastFieldState;
+		},
+		subscribe: (listener) => formController.subscribe(listener),
+		setValue: (value, options) => formController.setValue(path, value, options),
+		validate: () => formController.validate(path)
+	};
+}
+//#endregion
+//#region src/hooks/use-field.ts
+function useField(path) {
+	const formController = useDyrectedFormControllerContext();
+	const contextPath = useDyrectedFieldPathContext();
+	const resolvedPath = path ?? contextPath;
+	if (!resolvedPath) throw new Error("useField requires a field path or a DyrectedFieldPathProvider ancestor");
+	const controller = React$1.useMemo(() => createDyrectedFieldController(formController, resolvedPath), [formController, resolvedPath]);
+	const state = React$1.useSyncExternalStore(controller.subscribe, controller.getState, controller.getState);
+	const pathSegments = React$1.useMemo(() => getFieldPathSegments(resolvedPath), [resolvedPath]);
+	const parentPath = React$1.useMemo(() => getParentFieldPath(resolvedPath), [resolvedPath]);
+	const getChildPath = React$1.useCallback((...parts) => joinFieldPath(resolvedPath, ...parts), [resolvedPath]);
+	const getItemPath = React$1.useCallback((index, ...parts) => joinFieldPath(resolvedPath, index, ...parts), [resolvedPath]);
+	const getChildValue = React$1.useCallback((...parts) => formController.getValue(getChildPath(...parts)), [formController, getChildPath]);
+	const getChildSchema = React$1.useCallback((...parts) => formController.getFieldSchema(getChildPath(...parts)), [formController, getChildPath]);
+	const getChildState = React$1.useCallback((...parts) => formController.getFieldState(getChildPath(...parts)), [formController, getChildPath]);
+	const setChildValue = React$1.useCallback((parts, value, options) => {
+		const normalizedParts = Array.isArray(parts) ? parts : [parts];
+		formController.setValue(getChildPath(...normalizedParts), value, options);
+	}, [formController, getChildPath]);
+	return {
+		...state,
+		pathSegments,
+		parentPath,
+		getChildPath,
+		getItemPath,
+		getChildValue,
+		getChildSchema,
+		getChildState,
+		setChildValue,
+		setValue: controller.setValue,
+		validate: controller.validate,
+		controller
+	};
+}
+//#endregion
+//#region src/controllers/theme.ts
+/**
+* Creates a framework-agnostic admin theme controller.
+*
+* This controller is the shared theme engine used by the React and Vue public
+* APIs, and can also be used directly by other framework adapters.
+*/
+function createAdminThemeController({ theme = "system", systemTheme = "light", onThemeChange } = {}) {
+	let state = {
+		theme,
+		systemTheme,
+		resolvedTheme: resolveAdminTheme(theme, systemTheme),
+		themeClassName: adminThemeClassName(resolveAdminTheme(theme, systemTheme))
+	};
+	const listeners = /* @__PURE__ */ new Set();
+	const emit = () => {
+		listeners.forEach((listener) => listener());
+	};
+	const normalizeState = (nextState) => {
+		const nextTheme = nextState.theme ?? state.theme;
+		const nextSystemTheme = nextState.systemTheme ?? state.systemTheme;
+		const resolvedTheme = resolveAdminTheme(nextTheme, nextSystemTheme);
+		return {
+			...state,
+			...nextState,
+			theme: nextTheme,
+			systemTheme: nextSystemTheme,
+			resolvedTheme,
+			themeClassName: adminThemeClassName(resolvedTheme)
+		};
+	};
+	return {
+		getState: () => state,
+		subscribe: (listener) => {
+			listeners.add(listener);
+			return () => listeners.delete(listener);
+		},
+		setTheme: (nextTheme) => {
+			if (state.theme === nextTheme) return;
+			state = normalizeState({ theme: nextTheme });
+			emit();
+			onThemeChange?.(nextTheme);
+		},
+		setSystemTheme: (nextSystemTheme) => {
+			if (state.systemTheme === nextSystemTheme) return;
+			state = normalizeState({ systemTheme: nextSystemTheme });
+			emit();
+		},
+		setState: (nextState) => {
+			const resolvedState = typeof nextState === "function" ? nextState(state) : normalizeState(nextState);
+			if (Object.is(resolvedState, state)) return;
+			state = resolvedState;
+			emit();
+		}
+	};
+}
+//#endregion
+//#region src/hooks/admin-theme-provider.tsx
+function subscribeToSystemAdminTheme(onChange) {
+	if (typeof window === "undefined" || typeof window.matchMedia !== "function") return () => void 0;
+	const media = window.matchMedia("(prefers-color-scheme: dark)");
+	const syncSystemTheme = () => {
+		onChange(media.matches ? "dark" : "light");
+	};
+	syncSystemTheme();
+	media.addEventListener("change", syncSystemTheme);
+	return () => media.removeEventListener("change", syncSystemTheme);
+}
+function AdminThemeProvider({ children, controller }) {
+	const [theme, setTheme] = usePreferences("theme", "system");
+	const activeController = React$1.useRef(controller ?? createAdminThemeController({
+		theme,
+		systemTheme: getSystemAdminTheme(),
+		onThemeChange: setTheme
+	})).current;
+	React$1.useEffect(() => {
+		activeController.setState((currentState) => {
+			if (currentState.theme === theme) return currentState;
+			return {
+				...currentState,
+				theme
+			};
+		});
+	}, [activeController, theme]);
+	React$1.useEffect(() => {
+		return subscribeToSystemAdminTheme((systemTheme) => {
+			activeController.setSystemTheme(systemTheme);
+		});
+	}, [activeController]);
+	return /* @__PURE__ */ jsx(AdminThemeContext.Provider, {
+		value: activeController,
+		children
+	});
+}
+function AdminThemedRoot({ children }) {
+	const { resolvedTheme, themeClassName } = useAdminTheme();
+	return /* @__PURE__ */ jsx("div", {
+		className: `${themeClassName} dy-h-full`,
+		"data-theme": resolvedTheme,
+		children
+	});
+}
+//#endregion
+//#region src/hooks/use-add-media-from-url.ts
+/**
+* @deprecated Use `useMediaURL` for new code. This alias exists for backwards compatibility.
+*/
+function useAddMediaFromUrl(options) {
+	return useMediaURL(options);
+}
+//#endregion
+export { buildExternalMediaPayload as A, isStorageNotConfiguredError as B, useMediaUpload as C, createMediaURLController as D, createMediaLibraryController as E, isEmbeddableVideoUrl as F, resolveAdminTheme as G, useAdminTheme as H, usePreferences as I, getMediaUrl as J, cn as K, formatMediaErrorMessage as L, getMediaPreviewUrl as M, getVideoEmbedUrl as N, createMediaUploadController as O, isDirectImageUrl as P, getMediaSourceInfo as R, resolveContainerPath as S, useMediaLibrary as T, adminThemeClassName as U, resolveActiveMediaCollection as V, getSystemAdminTheme as W, DyrectedContext as X, getSiteUrl as Y, useDyrected as Z, buildDefaultValues as _, useField as a, getFlatErrors as b, DyrectedFieldPathProvider as c, getFieldPathSegments as d, getParentFieldPath as f, setValueAtPath as g, normalizeFieldPath as h, createAdminThemeController as i, filenameFromUrl as j, compressImage as k, DyrectedFormProvider as l, joinFieldPath as m, AdminThemeProvider as n, createDyrectedFieldController as o, getValueAtPath as p, getDisplayFilename as q, AdminThemedRoot as r, useDyrectedForm as s, useAddMediaFromUrl as t, createDyrectedFormController as u, buildSchemaShape as v, useMediaURL as w, normalizeOptions as x, formatPath as y, isExternalMedia as z };