@questpie/admin 1.1.1 → 2.0.0

package/dist/client/hooks/use-field-hooks.mjs

@@ -0,0 +1,191 @@
+import * as React$1 from "react";
+import { useFormContext, useWatch } from "react-hook-form";
+
+//#region src/client/hooks/use-field-hooks.ts
+/**
+* Field Hooks
+*
+* React hooks for field-level compute, onChange handlers, and async options.
+* Uses Proxy-based dependency tracking for automatic reactivity.
+*
+* Best Practices:
+* - useWatch() hook for reactive form values (React pattern)
+* - form.getValues() only inside callbacks/effects (one-time reads)
+* - useMemo for computed values to avoid unnecessary recalculations
+*/
+function createHookContext(form, fieldName, locale) {
+	return {
+		fieldName,
+		locale,
+		setValue: (name, value) => {
+			form.setValue(name, value, {
+				shouldDirty: true,
+				shouldTouch: true,
+				shouldValidate: false
+			});
+		},
+		getValues: () => form.getValues(),
+		getValue: (name) => form.getValues(name)
+	};
+}
+/**
+* Hook for implementing field-level hooks (compute, onChange, loadOptions).
+* Uses Proxy-based dependency tracking for automatic reactivity.
+*
+* @example
+* ```tsx
+* const { handleChange, computedValue, isComputed, options, optionsLoading } = useFieldHooks({
+*   fieldName: 'pricePerMinute',
+*   fullFieldName: 'pricePerMinute',
+*   compute: (values) => values.price / values.duration,
+* });
+* ```
+*/
+function useFieldHooks({ fieldName, fullFieldName, locale, compute, onChange, defaultValue, loadOptions, staticOptions }) {
+	const form = useFormContext();
+	const [asyncOptions, setAsyncOptions] = React$1.useState(void 0);
+	const [optionsLoading, setOptionsLoading] = React$1.useState(false);
+	const [loadOptionsDeps, setLoadOptionsDeps] = React$1.useState([]);
+	const hookCtx = React$1.useMemo(() => createHookContext(form, fieldName, locale), [
+		form,
+		fieldName,
+		locale
+	]);
+	const watchedValues = useWatch({ control: form.control });
+	const allValues = React$1.useMemo(() => watchedValues ?? {}, [watchedValues]);
+	React$1.useEffect(() => {
+		if (!loadOptions) return;
+		const values = form.getValues();
+		const deps = [];
+		const proxy = new Proxy(values, { get(target, prop) {
+			if (typeof prop === "string" && !prop.startsWith("_")) deps.push(prop);
+			return target[prop];
+		} });
+		try {
+			loadOptions(proxy);
+		} catch {}
+		setLoadOptionsDeps([...new Set(deps)]);
+	}, [loadOptions, form]);
+	const computedValue = React$1.useMemo(() => {
+		if (!compute) return void 0;
+		try {
+			return compute(allValues);
+		} catch (error) {
+			console.error(`Compute error for ${fieldName}:`, error);
+			return;
+		}
+	}, [
+		compute,
+		allValues,
+		fieldName
+	]);
+	const defaultValueInitialized = React$1.useRef(false);
+	React$1.useEffect(() => {
+		if (defaultValueInitialized.current) return;
+		if (defaultValue === void 0) return;
+		if (compute) {
+			defaultValueInitialized.current = true;
+			return;
+		}
+		const currentValue = form.getValues(fullFieldName);
+		if (currentValue !== void 0 && currentValue !== null) {
+			defaultValueInitialized.current = true;
+			return;
+		}
+		const initDefaultValue = async () => {
+			let resolvedValue;
+			if (typeof defaultValue === "function") {
+				const values = form.getValues();
+				resolvedValue = await Promise.resolve(defaultValue(values));
+			} else resolvedValue = defaultValue;
+			const currentVal = form.getValues(fullFieldName);
+			if (currentVal === void 0 || currentVal === null) form.setValue(fullFieldName, resolvedValue, {
+				shouldDirty: false,
+				shouldTouch: false
+			});
+			defaultValueInitialized.current = true;
+		};
+		initDefaultValue();
+	}, [
+		defaultValue,
+		fullFieldName,
+		form,
+		compute
+	]);
+	const trackedDepValues = React$1.useMemo(() => {
+		if (!loadOptionsDeps.length) return [];
+		return loadOptionsDeps.map((dep) => allValues[dep]);
+	}, [loadOptionsDeps, allValues]);
+	const trackedDepKey = React$1.useMemo(() => JSON.stringify(trackedDepValues), [trackedDepValues]);
+	const initialOptionsLoadDone = React$1.useRef(false);
+	const prevDepKeyRef = React$1.useRef("");
+	React$1.useEffect(() => {
+		if (!loadOptions) return;
+		if (loadOptionsDeps.length === 0 && !initialOptionsLoadDone.current) return;
+		if (!(!initialOptionsLoadDone.current || prevDepKeyRef.current !== trackedDepKey)) return;
+		prevDepKeyRef.current = trackedDepKey;
+		initialOptionsLoadDone.current = true;
+		const fetchOptions = async () => {
+			setOptionsLoading(true);
+			try {
+				setAsyncOptions(await loadOptions(allValues));
+			} catch (error) {
+				console.error(`Failed to load options for ${fieldName}:`, error);
+				setAsyncOptions([]);
+			} finally {
+				setOptionsLoading(false);
+			}
+		};
+		fetchOptions();
+	}, [
+		loadOptions,
+		loadOptionsDeps,
+		trackedDepKey,
+		allValues,
+		fieldName
+	]);
+	const handleChange = React$1.useCallback((value) => {
+		if (compute) return;
+		form.setValue(fullFieldName, value, {
+			shouldDirty: true,
+			shouldTouch: true,
+			shouldValidate: false
+		});
+		if (onChange) {
+			const runOnChange = async () => {
+				try {
+					await Promise.resolve(onChange(value, hookCtx));
+				} catch (error) {
+					console.error(`onChange error for ${fieldName}:`, error);
+				}
+			};
+			runOnChange();
+		}
+	}, [
+		form,
+		fullFieldName,
+		onChange,
+		hookCtx,
+		fieldName,
+		compute
+	]);
+	const options = React$1.useMemo(() => {
+		if (loadOptions) return asyncOptions;
+		return staticOptions;
+	}, [
+		loadOptions,
+		asyncOptions,
+		staticOptions
+	]);
+	return {
+		handleChange,
+		computedValue,
+		isComputed: !!compute,
+		options,
+		optionsLoading
+	};
+}
+
+//#endregion
+export { useFieldHooks };
+//# sourceMappingURL=use-field-hooks.mjs.map

package/dist/client/hooks/use-field-hooks.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"use-field-hooks.mjs","names":["React","deps: string[]","resolvedValue: any"],"sources":["../../../src/client/hooks/use-field-hooks.ts"],"sourcesContent":["/**\n * Field Hooks\n *\n * React hooks for field-level compute, onChange handlers, and async options.\n * Uses Proxy-based dependency tracking for automatic reactivity.\n *\n * Best Practices:\n * - useWatch() hook for reactive form values (React pattern)\n * - form.getValues() only inside callbacks/effects (one-time reads)\n * - useMemo for computed values to avoid unnecessary recalculations\n */\n\nimport * as React from \"react\";\nimport { useFormContext, useWatch } from \"react-hook-form\";\nimport type {\n\tFieldHookContext,\n\tSelectOption,\n} from \"../builder/types/field-types\";\n\n// ============================================================================\n// Proxy Tracking Utilities\n// ============================================================================\n\n/**\n * Result of tracking dependencies via Proxy\n */\ninterface TrackingResult<T> {\n\tresult: T;\n\tdeps: string[];\n}\n\n/**\n * Track which fields are accessed during a function call using Proxy.\n * Returns the result and the list of accessed field names.\n */\nfunction trackDependencies<T>(\n\tvalues: Record<string, any>,\n\tfn: (values: Record<string, any>) => T,\n): TrackingResult<T> {\n\tconst deps: string[] = [];\n\n\tconst proxy = new Proxy(values, {\n\t\tget(target, prop: string) {\n\t\t\tif (typeof prop === \"string\" && !prop.startsWith(\"_\")) {\n\t\t\t\tdeps.push(prop);\n\t\t\t}\n\t\t\treturn target[prop];\n\t\t},\n\t});\n\n\tconst result = fn(proxy);\n\treturn { result, deps: [...new Set(deps)] }; // dedupe\n}\n\n// ============================================================================\n// Types\n// ============================================================================\n\nexport interface UseFieldHooksOptions {\n\t/**\n\t * Field name\n\t */\n\tfieldName: string;\n\n\t/**\n\t * Field name with prefix (for nested fields)\n\t */\n\tfullFieldName: string;\n\n\t/**\n\t * Current locale\n\t */\n\tlocale?: string;\n\n\t/**\n\t * Compute function (proxy-tracked)\n\t */\n\tcompute?: (values: Record<string, any>) => any;\n\n\t/**\n\t * onChange callback from field config\n\t */\n\tonChange?: (value: any, ctx: FieldHookContext) => void | Promise<void>;\n\n\t/**\n\t * Default value (static, sync function, or async function)\n\t */\n\tdefaultValue?:\n\t\t| any\n\t\t| ((values: Record<string, any>) => any)\n\t\t| ((values: Record<string, any>) => Promise<any>);\n\n\t/**\n\t * Async options loader (proxy-tracked)\n\t */\n\tloadOptions?: (values: Record<string, any>) => Promise<SelectOption[]>;\n\n\t/**\n\t * Static options (from config)\n\t */\n\tstaticOptions?: SelectOption[];\n}\n\nexport interface UseFieldHooksResult {\n\t/**\n\t * Wrapped onChange handler that calls user's onChange hook\n\t */\n\thandleChange: (value: any) => void;\n\n\t/**\n\t * Computed value (if compute is provided)\n\t */\n\tcomputedValue: any;\n\n\t/**\n\t * Whether this field has a compute function (implies readonly)\n\t */\n\tisComputed: boolean;\n\n\t/**\n\t * Resolved options (from static, sync function, or async loader)\n\t */\n\toptions: SelectOption[] | undefined;\n\n\t/**\n\t * Whether options are loading\n\t */\n\toptionsLoading: boolean;\n}\n\n// ============================================================================\n// Hook Context Factory\n// ============================================================================\n\nfunction createHookContext(\n\tform: ReturnType<typeof useFormContext>,\n\tfieldName: string,\n\tlocale?: string,\n): FieldHookContext {\n\treturn {\n\t\tfieldName,\n\t\tlocale,\n\t\tsetValue: (name: string, value: any) => {\n\t\t\tform.setValue(name, value, {\n\t\t\t\tshouldDirty: true,\n\t\t\t\tshouldTouch: true,\n\t\t\t\tshouldValidate: false,\n\t\t\t});\n\t\t},\n\t\tgetValues: () => form.getValues(),\n\t\tgetValue: (name: string) => form.getValues(name),\n\t};\n}\n\n// ============================================================================\n// Main Hook\n// ============================================================================\n\n/**\n * Hook for implementing field-level hooks (compute, onChange, loadOptions).\n * Uses Proxy-based dependency tracking for automatic reactivity.\n *\n * @example\n * ```tsx\n * const { handleChange, computedValue, isComputed, options, optionsLoading } = useFieldHooks({\n *   fieldName: 'pricePerMinute',\n *   fullFieldName: 'pricePerMinute',\n *   compute: (values) => values.price / values.duration,\n * });\n * ```\n */\nexport function useFieldHooks({\n\tfieldName,\n\tfullFieldName,\n\tlocale,\n\tcompute,\n\tonChange,\n\tdefaultValue,\n\tloadOptions,\n\tstaticOptions,\n}: UseFieldHooksOptions): UseFieldHooksResult {\n\tconst form = useFormContext();\n\tconst [asyncOptions, setAsyncOptions] = React.useState<\n\t\tSelectOption[] | undefined\n\t>(undefined);\n\tconst [optionsLoading, setOptionsLoading] = React.useState(false);\n\n\t// Track dependencies for loadOptions (stored in state to trigger re-render when detected)\n\tconst [loadOptionsDeps, setLoadOptionsDeps] = React.useState<string[]>([]);\n\n\t// Create stable hook context\n\tconst hookCtx = React.useMemo(\n\t\t() => createHookContext(form, fieldName, locale),\n\t\t[form, fieldName, locale],\n\t);\n\n\t// ========================================================================\n\t// Watch form values reactively (React best practice: useWatch hook)\n\t// ========================================================================\n\n\t// Watch all form values for compute reactivity\n\t// useWatch properly integrates with React's lifecycle\n\tconst watchedValues = useWatch({ control: form.control });\n\tconst allValues = React.useMemo(\n\t\t() => (watchedValues ?? {}) as Record<string, any>,\n\t\t[watchedValues],\n\t);\n\n\t// ========================================================================\n\t// Detect loadOptions dependencies (run once)\n\t// ========================================================================\n\n\tReact.useEffect(() => {\n\t\tif (!loadOptions) return;\n\n\t\t// Run loadOptions once with a tracking proxy to detect deps\n\t\tconst values = form.getValues();\n\t\tconst deps: string[] = [];\n\t\tconst proxy = new Proxy(values, {\n\t\t\tget(target, prop: string) {\n\t\t\t\tif (typeof prop === \"string\" && !prop.startsWith(\"_\")) {\n\t\t\t\t\tdeps.push(prop);\n\t\t\t\t}\n\t\t\t\treturn target[prop];\n\t\t\t},\n\t\t});\n\n\t\t// Call loadOptions to track deps, catch and ignore errors\n\t\ttry {\n\t\t\tloadOptions(proxy);\n\t\t} catch {\n\t\t\t// Ignore - we just wanted to track access\n\t\t}\n\n\t\tconst uniqueDeps = [...new Set(deps)];\n\t\tsetLoadOptionsDeps(uniqueDeps);\n\t}, [loadOptions, form]);\n\n\t// ========================================================================\n\t// Computed Value (reactive via useWatch + useMemo)\n\t// ========================================================================\n\n\t// Use useMemo for computed value - recomputes when allValues change\n\t// This is the proper React pattern: derived state via useMemo\n\tconst computedValue = React.useMemo(() => {\n\t\tif (!compute) return undefined;\n\t\ttry {\n\t\t\treturn compute(allValues);\n\t\t} catch (error) {\n\t\t\tconsole.error(`Compute error for ${fieldName}:`, error);\n\t\t\treturn undefined;\n\t\t}\n\t}, [compute, allValues, fieldName]);\n\n\t// ========================================================================\n\t// Default Value Effect\n\t// ========================================================================\n\n\tconst defaultValueInitialized = React.useRef(false);\n\n\tReact.useEffect(() => {\n\t\tif (defaultValueInitialized.current) return;\n\t\tif (defaultValue === undefined) return;\n\t\t// Don't set default for computed fields\n\t\tif (compute) {\n\t\t\tdefaultValueInitialized.current = true;\n\t\t\treturn;\n\t\t}\n\n\t\tconst currentValue = form.getValues(fullFieldName);\n\t\tif (currentValue !== undefined && currentValue !== null) {\n\t\t\tdefaultValueInitialized.current = true;\n\t\t\treturn;\n\t\t}\n\n\t\tconst initDefaultValue = async () => {\n\t\t\tlet resolvedValue: any;\n\n\t\t\tif (typeof defaultValue === \"function\") {\n\t\t\t\tconst values = form.getValues();\n\t\t\t\tresolvedValue = await Promise.resolve(defaultValue(values));\n\t\t\t} else {\n\t\t\t\tresolvedValue = defaultValue;\n\t\t\t}\n\n\t\t\t// Double-check value hasn't been set while we were resolving\n\t\t\tconst currentVal = form.getValues(fullFieldName);\n\t\t\tif (currentVal === undefined || currentVal === null) {\n\t\t\t\tform.setValue(fullFieldName, resolvedValue, {\n\t\t\t\t\tshouldDirty: false,\n\t\t\t\t\tshouldTouch: false,\n\t\t\t\t});\n\t\t\t}\n\n\t\t\tdefaultValueInitialized.current = true;\n\t\t};\n\n\t\tinitDefaultValue();\n\t}, [defaultValue, fullFieldName, form, compute]);\n\n\t// ========================================================================\n\t// Async Options Loader (reactive via tracked deps)\n\t// ========================================================================\n\n\t// Extract only the tracked dependency values for comparison\n\tconst trackedDepValues = React.useMemo(() => {\n\t\tif (!loadOptionsDeps.length) return [];\n\t\treturn loadOptionsDeps.map((dep) => allValues[dep]);\n\t}, [loadOptionsDeps, allValues]);\n\n\t// Stable serialization for deep comparison\n\tconst trackedDepKey = React.useMemo(\n\t\t() => JSON.stringify(trackedDepValues),\n\t\t[trackedDepValues],\n\t);\n\n\tconst initialOptionsLoadDone = React.useRef(false);\n\tconst prevDepKeyRef = React.useRef<string>(\"\");\n\n\tReact.useEffect(() => {\n\t\tif (!loadOptions) return;\n\n\t\t// Skip if deps haven't been detected yet\n\t\tif (loadOptionsDeps.length === 0 && !initialOptionsLoadDone.current) {\n\t\t\treturn;\n\t\t}\n\n\t\t// Check if this is initial load or deps changed\n\t\tconst depsChanged =\n\t\t\t!initialOptionsLoadDone.current ||\n\t\t\tprevDepKeyRef.current !== trackedDepKey;\n\n\t\tif (!depsChanged) return;\n\n\t\tprevDepKeyRef.current = trackedDepKey;\n\t\tinitialOptionsLoadDone.current = true;\n\n\t\tconst fetchOptions = async () => {\n\t\t\tsetOptionsLoading(true);\n\t\t\ttry {\n\t\t\t\t// Use allValues (from useWatch) for the loadOptions call\n\t\t\t\tconst options = await loadOptions(allValues);\n\t\t\t\tsetAsyncOptions(options);\n\t\t\t} catch (error) {\n\t\t\t\tconsole.error(`Failed to load options for ${fieldName}:`, error);\n\t\t\t\tsetAsyncOptions([]);\n\t\t\t} finally {\n\t\t\t\tsetOptionsLoading(false);\n\t\t\t}\n\t\t};\n\n\t\tfetchOptions();\n\t}, [loadOptions, loadOptionsDeps, trackedDepKey, allValues, fieldName]);\n\n\t// ========================================================================\n\t// onChange Handler\n\t// ========================================================================\n\n\tconst handleChange = React.useCallback(\n\t\t(value: any) => {\n\t\t\t// Don't allow changes for computed fields\n\t\t\tif (compute) return;\n\n\t\t\t// Set the value first\n\t\t\t// Note: shouldValidate is false to avoid blocking on complex fields like richText\n\t\t\t// Validation will still happen on form submit\n\t\t\tform.setValue(fullFieldName, value, {\n\t\t\t\tshouldDirty: true,\n\t\t\t\tshouldTouch: true,\n\t\t\t\tshouldValidate: false,\n\t\t\t});\n\n\t\t\t// Then call user's onChange if provided\n\t\t\tif (onChange) {\n\t\t\t\tconst runOnChange = async () => {\n\t\t\t\t\ttry {\n\t\t\t\t\t\tawait Promise.resolve(onChange(value, hookCtx));\n\t\t\t\t\t} catch (error) {\n\t\t\t\t\t\tconsole.error(`onChange error for ${fieldName}:`, error);\n\t\t\t\t\t}\n\t\t\t\t};\n\t\t\t\trunOnChange();\n\t\t\t}\n\t\t},\n\t\t[form, fullFieldName, onChange, hookCtx, fieldName, compute],\n\t);\n\n\t// ========================================================================\n\t// Resolve Options\n\t// ========================================================================\n\n\tconst options = React.useMemo(() => {\n\t\t// Async options take priority\n\t\tif (loadOptions) {\n\t\t\treturn asyncOptions;\n\t\t}\n\t\t// Static options\n\t\treturn staticOptions;\n\t}, [loadOptions, asyncOptions, staticOptions]);\n\n\treturn {\n\t\thandleChange,\n\t\tcomputedValue,\n\t\tisComputed: !!compute,\n\t\toptions,\n\t\toptionsLoading,\n\t};\n}\n"],"mappings":"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"}

package/dist/client/hooks/use-field-options.d.mts

@@ -0,0 +1,90 @@
+import { SerializedOptionsConfig } from "questpie";
+
+//#region src/client/hooks/use-field-options.d.ts
+
+/**
+ * Option item
+ */
+interface OptionItem {
+  value: string | number;
+  label: string | Record<string, string>;
+}
+/**
+ * Options for useFieldOptions hook
+ */
+interface UseFieldOptionsOptions {
+  /** Collection or global name */
+  collection: string;
+  /** Entity type - collection or global */
+  mode?: "collection" | "global";
+  /** Field path */
+  field: string;
+  /** Options config from introspection */
+  optionsConfig?: SerializedOptionsConfig;
+  /** Static options (fallback if no dynamic config) */
+  staticOptions?: OptionItem[];
+  /** Initial search query */
+  initialSearch?: string;
+  /** Items per page */
+  limit?: number;
+  /** Whether to enable fetching */
+  enabled?: boolean;
+}
+/**
+ * Result from useFieldOptions hook
+ */
+interface UseFieldOptionsResult {
+  /** Current options */
+  options: OptionItem[];
+  /** Whether options are loading */
+  isLoading: boolean;
+  /** Whether more options are available */
+  hasMore: boolean;
+  /** Total count (if available) */
+  total?: number;
+  /** Current search query */
+  search: string;
+  /** Set search query */
+  setSearch: (search: string) => void;
+  /** Load more options (pagination) */
+  loadMore: () => void;
+  /** Refresh options */
+  refresh: () => void;
+  /** Error */
+  error: Error | null;
+}
+/**
+ * Hook to fetch dynamic options for select/relation fields.
+ * Supports search, pagination, and dependency-based refetching.
+ *
+ * @example
+ * ```tsx
+ * const { options, isLoading, search, setSearch, loadMore } = useFieldOptions({
+ *   collection: "orders",
+ *   field: "items.0.city",
+ *   optionsConfig: schema.fields.city.reactive?.options,
+ * });
+ *
+ * return (
+ *   <Select
+ *     options={options}
+ *     isLoading={isLoading}
+ *     onInputChange={setSearch}
+ *     onMenuScrollToBottom={loadMore}
+ *   />
+ * );
+ * ```
+ */
+declare function useFieldOptions({
+  collection,
+  mode,
+  field,
+  optionsConfig,
+  staticOptions,
+  initialSearch,
+  limit,
+  enabled
+}: UseFieldOptionsOptions): UseFieldOptionsResult;
+//#endregion
+export { OptionItem, UseFieldOptionsOptions, UseFieldOptionsResult, useFieldOptions };
+//# sourceMappingURL=use-field-options.d.mts.map

package/dist/client/hooks/use-field-options.d.mts.map

@@ -0,0 +1 @@
+{"version":3,"file":"use-field-options.d.mts","names":[],"sources":["../../../src/client/hooks/use-field-options.ts"],"sourcesContent":[],"mappings":";;;;;;;AAyKC,UAtJgB,UAAA,CAsJhB;EACA,KAAA,EAAA,MAAA,GAAA,MAAA;EACA,KAAA,EAAA,MAAA,GAtJgB,MAsJhB,CAAA,MAAA,EAAA,MAAA,CAAA;;;;;AAGgD,UAnJhC,sBAAA,CAmJgC;;;;;;;;kBAxIhC;;kBAGA;;;;;;;;;;;UAeA,qBAAA;;WAEP;;;;;;;;;;;;;;;;SAwBF;;;;;;;;;;;;;;;;;;;;;;;;iBAmFQ,eAAA;;;;;;;;;GASb,yBAAyB"}

package/dist/client/hooks/use-field-options.mjs

@@ -0,0 +1,184 @@
+import { useAdminStore } from "../runtime/provider.mjs";
+import * as React$1 from "react";
+import { useFormContext, useWatch } from "react-hook-form";
+
+//#region src/client/hooks/use-field-options.ts
+/**
+* Get sibling data for a field path (for fields inside arrays)
+*/
+function getSiblingData(values, fieldPath) {
+	const parts = fieldPath.split(".");
+	const numericIndex = parts.findIndex((p) => /^\d+$/.test(p));
+	if (numericIndex === -1) return null;
+	const arrayItemPath = parts.slice(0, numericIndex + 1).join(".");
+	let sibling = values;
+	for (const part of arrayItemPath.split(".")) if (sibling && typeof sibling === "object") sibling = sibling[part];
+	else return null;
+	return typeof sibling === "object" ? sibling : null;
+}
+/**
+* Get watched dependency values
+*/
+function getWatchedValues(allValues, siblingData, watchDeps) {
+	const result = {};
+	for (const dep of watchDeps) if (dep.startsWith("$sibling.")) {
+		const siblingKey = dep.slice(9);
+		result[dep] = siblingData?.[siblingKey];
+	} else if (!dep.startsWith("$")) result[dep] = allValues[dep];
+	return result;
+}
+/**
+* Hook to fetch dynamic options for select/relation fields.
+* Supports search, pagination, and dependency-based refetching.
+*
+* @example
+* ```tsx
+* const { options, isLoading, search, setSearch, loadMore } = useFieldOptions({
+*   collection: "orders",
+*   field: "items.0.city",
+*   optionsConfig: schema.fields.city.reactive?.options,
+* });
+*
+* return (
+*   <Select
+*     options={options}
+*     isLoading={isLoading}
+*     onInputChange={setSearch}
+*     onMenuScrollToBottom={loadMore}
+*   />
+* );
+* ```
+*/
+function useFieldOptions({ collection, mode = "collection", field, optionsConfig, staticOptions, initialSearch = "", limit = 20, enabled = true }) {
+	const client = useAdminStore((s) => s.client);
+	const form = useFormContext();
+	const [options, setOptions] = React$1.useState([]);
+	const [isLoading, setIsLoading] = React$1.useState(false);
+	const [hasMore, setHasMore] = React$1.useState(false);
+	const [total, setTotal] = React$1.useState();
+	const [search, setSearch] = React$1.useState(initialSearch);
+	const [page, setPage] = React$1.useState(0);
+	const [error, setError] = React$1.useState(null);
+	const watchedValues = useWatch({ control: form.control });
+	const formValues = React$1.useMemo(() => watchedValues ?? {}, [watchedValues]);
+	const siblingData = React$1.useMemo(() => getSiblingData(formValues, field), [formValues, field]);
+	const watchDeps = optionsConfig?.watch ?? [];
+	const depValues = React$1.useMemo(() => getWatchedValues(formValues, siblingData, watchDeps), [
+		formValues,
+		siblingData,
+		watchDeps
+	]);
+	const depKey = JSON.stringify(depValues);
+	const prevDepKeyRef = React$1.useRef(depKey);
+	const fetchOptions = React$1.useCallback(async (currentPage, append = false) => {
+		if (!optionsConfig || !client) {
+			if (staticOptions) {
+				let filtered = staticOptions;
+				if (search) {
+					const searchLower = search.toLowerCase();
+					filtered = staticOptions.filter((opt) => {
+						return (typeof opt.label === "string" ? opt.label : Object.values(opt.label).join(" ")).toLowerCase().includes(searchLower);
+					});
+				}
+				setOptions(filtered);
+				setHasMore(false);
+				setTotal(filtered.length);
+			}
+			return;
+		}
+		setIsLoading(true);
+		setError(null);
+		try {
+			const response = await client.rpc.fieldOptions({
+				collection,
+				type: mode,
+				field,
+				formData: formValues,
+				siblingData,
+				search,
+				page: currentPage,
+				limit
+			});
+			const newOptions = response.options;
+			if (append) setOptions((prev) => [...prev, ...newOptions]);
+			else setOptions(newOptions);
+			setHasMore(response.hasMore ?? false);
+			setTotal(response.total);
+		} catch (err) {
+			console.error("Field options error:", err);
+			setError(err instanceof Error ? err : new Error(String(err)));
+		} finally {
+			setIsLoading(false);
+		}
+	}, [
+		client,
+		collection,
+		mode,
+		field,
+		formValues,
+		siblingData,
+		search,
+		limit,
+		optionsConfig,
+		staticOptions
+	]);
+	React$1.useEffect(() => {
+		if (!enabled) return;
+		if (prevDepKeyRef.current !== depKey) {
+			prevDepKeyRef.current = depKey;
+			setPage(0);
+			fetchOptions(0, false);
+		}
+	}, [
+		enabled,
+		depKey,
+		fetchOptions
+	]);
+	const searchDebounceRef = React$1.useRef(null);
+	React$1.useEffect(() => {
+		if (!enabled) return;
+		if (searchDebounceRef.current) clearTimeout(searchDebounceRef.current);
+		searchDebounceRef.current = setTimeout(() => {
+			setPage(0);
+			fetchOptions(0, false);
+		}, 300);
+		return () => {
+			if (searchDebounceRef.current) clearTimeout(searchDebounceRef.current);
+		};
+	}, [
+		enabled,
+		search,
+		fetchOptions
+	]);
+	React$1.useEffect(() => {
+		if (enabled) fetchOptions(0, false);
+	}, []);
+	return {
+		options,
+		isLoading,
+		hasMore,
+		total,
+		search,
+		setSearch,
+		loadMore: React$1.useCallback(() => {
+			if (isLoading || !hasMore) return;
+			const nextPage = page + 1;
+			setPage(nextPage);
+			fetchOptions(nextPage, true);
+		}, [
+			isLoading,
+			hasMore,
+			page,
+			fetchOptions
+		]),
+		refresh: React$1.useCallback(() => {
+			setPage(0);
+			fetchOptions(0, false);
+		}, [fetchOptions]),
+		error
+	};
+}
+
+//#endregion
+export { useFieldOptions };
+//# sourceMappingURL=use-field-options.mjs.map

package/dist/client/hooks/use-field-options.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"use-field-options.mjs","names":["result: Record<string, any>","React"],"sources":["../../../src/client/hooks/use-field-options.ts"],"sourcesContent":["/**\n * Field Options Hook\n *\n * Fetches dynamic options for select/relation fields from the server.\n * Supports search, pagination, and dependency-based refetching.\n */\n\nimport type { SerializedOptionsConfig } from \"questpie\";\nimport * as React from \"react\";\nimport { useFormContext, useWatch } from \"react-hook-form\";\nimport { useAdminStore } from \"../runtime/provider.js\";\n\n// ============================================================================\n// Types\n// ============================================================================\n\n/**\n * Option item\n */\nexport interface OptionItem {\n\tvalue: string | number;\n\tlabel: string | Record<string, string>;\n}\n\n/**\n * Options for useFieldOptions hook\n */\nexport interface UseFieldOptionsOptions {\n\t/** Collection or global name */\n\tcollection: string;\n\n\t/** Entity type - collection or global */\n\tmode?: \"collection\" | \"global\";\n\n\t/** Field path */\n\tfield: string;\n\n\t/** Options config from introspection */\n\toptionsConfig?: SerializedOptionsConfig;\n\n\t/** Static options (fallback if no dynamic config) */\n\tstaticOptions?: OptionItem[];\n\n\t/** Initial search query */\n\tinitialSearch?: string;\n\n\t/** Items per page */\n\tlimit?: number;\n\n\t/** Whether to enable fetching */\n\tenabled?: boolean;\n}\n\n/**\n * Result from useFieldOptions hook\n */\nexport interface UseFieldOptionsResult {\n\t/** Current options */\n\toptions: OptionItem[];\n\n\t/** Whether options are loading */\n\tisLoading: boolean;\n\n\t/** Whether more options are available */\n\thasMore: boolean;\n\n\t/** Total count (if available) */\n\ttotal?: number;\n\n\t/** Current search query */\n\tsearch: string;\n\n\t/** Set search query */\n\tsetSearch: (search: string) => void;\n\n\t/** Load more options (pagination) */\n\tloadMore: () => void;\n\n\t/** Refresh options */\n\trefresh: () => void;\n\n\t/** Error */\n\terror: Error | null;\n}\n\n// ============================================================================\n// Utility Functions\n// ============================================================================\n\n/**\n * Get sibling data for a field path (for fields inside arrays)\n */\nfunction getSiblingData(\n\tvalues: Record<string, any>,\n\tfieldPath: string,\n): Record<string, any> | null {\n\tconst parts = fieldPath.split(\".\");\n\tconst numericIndex = parts.findIndex((p) => /^\\d+$/.test(p));\n\n\tif (numericIndex === -1) {\n\t\treturn null;\n\t}\n\n\tconst arrayItemPath = parts.slice(0, numericIndex + 1).join(\".\");\n\n\tlet sibling = values;\n\tfor (const part of arrayItemPath.split(\".\")) {\n\t\tif (sibling && typeof sibling === \"object\") {\n\t\t\tsibling = sibling[part];\n\t\t} else {\n\t\t\treturn null;\n\t\t}\n\t}\n\n\treturn typeof sibling === \"object\" ? sibling : null;\n}\n\n/**\n * Get watched dependency values\n */\nfunction getWatchedValues(\n\tallValues: Record<string, any>,\n\tsiblingData: Record<string, any> | null,\n\twatchDeps: string[],\n): Record<string, any> {\n\tconst result: Record<string, any> = {};\n\n\tfor (const dep of watchDeps) {\n\t\tif (dep.startsWith(\"$sibling.\")) {\n\t\t\tconst siblingKey = dep.slice(\"$sibling.\".length);\n\t\t\tresult[dep] = siblingData?.[siblingKey];\n\t\t} else if (!dep.startsWith(\"$\")) {\n\t\t\tresult[dep] = allValues[dep];\n\t\t}\n\t}\n\n\treturn result;\n}\n\n// ============================================================================\n// Hook Implementation\n// ============================================================================\n\n/**\n * Hook to fetch dynamic options for select/relation fields.\n * Supports search, pagination, and dependency-based refetching.\n *\n * @example\n * ```tsx\n * const { options, isLoading, search, setSearch, loadMore } = useFieldOptions({\n *   collection: \"orders\",\n *   field: \"items.0.city\",\n *   optionsConfig: schema.fields.city.reactive?.options,\n * });\n *\n * return (\n *   <Select\n *     options={options}\n *     isLoading={isLoading}\n *     onInputChange={setSearch}\n *     onMenuScrollToBottom={loadMore}\n *   />\n * );\n * ```\n */\nexport function useFieldOptions({\n\tcollection,\n\tmode = \"collection\",\n\tfield,\n\toptionsConfig,\n\tstaticOptions,\n\tinitialSearch = \"\",\n\tlimit = 20,\n\tenabled = true,\n}: UseFieldOptionsOptions): UseFieldOptionsResult {\n\tconst client = useAdminStore((s) => s.client);\n\tconst form = useFormContext();\n\n\t// State\n\tconst [options, setOptions] = React.useState<OptionItem[]>([]);\n\tconst [isLoading, setIsLoading] = React.useState(false);\n\tconst [hasMore, setHasMore] = React.useState(false);\n\tconst [total, setTotal] = React.useState<number | undefined>();\n\tconst [search, setSearch] = React.useState(initialSearch);\n\tconst [page, setPage] = React.useState(0);\n\tconst [error, setError] = React.useState<Error | null>(null);\n\n\t// Watch form values for deps\n\tconst watchedValues = useWatch({ control: form.control });\n\tconst formValues = React.useMemo(\n\t\t() => (watchedValues ?? {}) as Record<string, any>,\n\t\t[watchedValues],\n\t);\n\n\t// Get sibling data\n\tconst siblingData = React.useMemo(\n\t\t() => getSiblingData(formValues, field),\n\t\t[formValues, field],\n\t);\n\n\t// Get watched dep values for comparison\n\tconst watchDeps = optionsConfig?.watch ?? [];\n\tconst depValues = React.useMemo(\n\t\t() => getWatchedValues(formValues, siblingData, watchDeps),\n\t\t[formValues, siblingData, watchDeps],\n\t);\n\tconst depKey = JSON.stringify(depValues);\n\n\t// Previous dep key for change detection\n\tconst prevDepKeyRef = React.useRef(depKey);\n\n\t// Fetch options from server\n\tconst fetchOptions = React.useCallback(\n\t\tasync (currentPage: number, append: boolean = false) => {\n\t\t\t// If no dynamic config, use static options\n\t\t\tif (!optionsConfig || !client) {\n\t\t\t\tif (staticOptions) {\n\t\t\t\t\tlet filtered = staticOptions;\n\t\t\t\t\tif (search) {\n\t\t\t\t\t\tconst searchLower = search.toLowerCase();\n\t\t\t\t\t\tfiltered = staticOptions.filter((opt) => {\n\t\t\t\t\t\t\tconst label =\n\t\t\t\t\t\t\t\ttypeof opt.label === \"string\"\n\t\t\t\t\t\t\t\t\t? opt.label\n\t\t\t\t\t\t\t\t\t: Object.values(opt.label).join(\" \");\n\t\t\t\t\t\t\treturn label.toLowerCase().includes(searchLower);\n\t\t\t\t\t\t});\n\t\t\t\t\t}\n\t\t\t\t\tsetOptions(filtered);\n\t\t\t\t\tsetHasMore(false);\n\t\t\t\t\tsetTotal(filtered.length);\n\t\t\t\t}\n\t\t\t\treturn;\n\t\t\t}\n\n\t\t\tsetIsLoading(true);\n\t\t\tsetError(null);\n\n\t\t\ttry {\n\t\t\t\tconst response = await (client.rpc as any).fieldOptions({\n\t\t\t\t\tcollection,\n\t\t\t\t\ttype: mode,\n\t\t\t\t\tfield,\n\t\t\t\t\tformData: formValues,\n\t\t\t\t\tsiblingData,\n\t\t\t\t\tsearch,\n\t\t\t\t\tpage: currentPage,\n\t\t\t\t\tlimit,\n\t\t\t\t});\n\n\t\t\t\tconst newOptions = response.options as OptionItem[];\n\n\t\t\t\tif (append) {\n\t\t\t\t\tsetOptions((prev) => [...prev, ...newOptions]);\n\t\t\t\t} else {\n\t\t\t\t\tsetOptions(newOptions);\n\t\t\t\t}\n\n\t\t\t\tsetHasMore(response.hasMore ?? false);\n\t\t\t\tsetTotal(response.total);\n\t\t\t} catch (err) {\n\t\t\t\tconsole.error(\"Field options error:\", err);\n\t\t\t\tsetError(err instanceof Error ? err : new Error(String(err)));\n\t\t\t} finally {\n\t\t\t\tsetIsLoading(false);\n\t\t\t}\n\t\t},\n\t\t[\n\t\t\tclient,\n\t\t\tcollection,\n\t\t\tmode,\n\t\t\tfield,\n\t\t\tformValues,\n\t\t\tsiblingData,\n\t\t\tsearch,\n\t\t\tlimit,\n\t\t\toptionsConfig,\n\t\t\tstaticOptions,\n\t\t],\n\t);\n\n\t// Effect to fetch options when deps change\n\tReact.useEffect(() => {\n\t\tif (!enabled) return;\n\n\t\t// Check if deps changed\n\t\tif (prevDepKeyRef.current !== depKey) {\n\t\t\tprevDepKeyRef.current = depKey;\n\t\t\tsetPage(0);\n\t\t\tfetchOptions(0, false);\n\t\t}\n\t}, [enabled, depKey, fetchOptions]);\n\n\t// Effect to fetch options when search changes\n\tconst searchDebounceRef = React.useRef<ReturnType<typeof setTimeout> | null>(\n\t\tnull,\n\t);\n\n\tReact.useEffect(() => {\n\t\tif (!enabled) return;\n\n\t\tif (searchDebounceRef.current) {\n\t\t\tclearTimeout(searchDebounceRef.current);\n\t\t}\n\n\t\tsearchDebounceRef.current = setTimeout(() => {\n\t\t\tsetPage(0);\n\t\t\tfetchOptions(0, false);\n\t\t}, 300); // Debounce search\n\n\t\treturn () => {\n\t\t\tif (searchDebounceRef.current) {\n\t\t\t\tclearTimeout(searchDebounceRef.current);\n\t\t\t}\n\t\t};\n\t}, [enabled, search, fetchOptions]);\n\n\t// Initial fetch\n\tReact.useEffect(() => {\n\t\tif (enabled) {\n\t\t\tfetchOptions(0, false);\n\t\t}\n\t\t// Only run on mount\n\t\t// eslint-disable-next-line react-hooks/exhaustive-deps\n\t}, []);\n\n\t// Load more handler\n\tconst loadMore = React.useCallback(() => {\n\t\tif (isLoading || !hasMore) return;\n\t\tconst nextPage = page + 1;\n\t\tsetPage(nextPage);\n\t\tfetchOptions(nextPage, true);\n\t}, [isLoading, hasMore, page, fetchOptions]);\n\n\t// Refresh handler\n\tconst refresh = React.useCallback(() => {\n\t\tsetPage(0);\n\t\tfetchOptions(0, false);\n\t}, [fetchOptions]);\n\n\treturn {\n\t\toptions,\n\t\tisLoading,\n\t\thasMore,\n\t\ttotal,\n\t\tsearch,\n\t\tsetSearch,\n\t\tloadMore,\n\t\trefresh,\n\t\terror,\n\t};\n}\n"],"mappings":"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"}

package/dist/client/hooks/use-global-fields.mjs

@@ -0,0 +1,27 @@
+import { selectAdmin, useAdminStore } from "../runtime/provider.mjs";
+import { buildFieldDefinitionsFromSchema } from "../utils/build-field-definitions-from-schema.mjs";
+import { useGlobalSchema } from "./use-global-schema.mjs";
+import { useMemo } from "react";
+
+//#region src/client/hooks/use-global-fields.ts
+function useGlobalFields(globalName, options = {}) {
+	const admin = useAdminStore(selectAdmin);
+	const { data: schema, isLoading, error } = useGlobalSchema(globalName, options.schemaQueryOptions);
+	return {
+		fields: useMemo(() => {
+			if (!schema || !admin) return {};
+			return buildFieldDefinitionsFromSchema(schema, admin.getFields(), options.buildOptions);
+		}, [
+			schema,
+			admin,
+			options.buildOptions
+		]),
+		schema,
+		isLoading,
+		error
+	};
+}
+
+//#endregion
+export { useGlobalFields };
+//# sourceMappingURL=use-global-fields.mjs.map

package/dist/client/hooks/use-global-fields.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"use-global-fields.mjs","names":[],"sources":["../../../src/client/hooks/use-global-fields.ts"],"sourcesContent":["/**\n * Hook for resolving field definitions from global schema\n *\n * Builds FieldDefinition objects from server introspection schema.\n */\n\nimport type { UseQueryOptions } from \"@tanstack/react-query\";\nimport type { GlobalSchema } from \"questpie\";\nimport { useMemo } from \"react\";\nimport type { FieldDefinition } from \"../builder/field/field\";\nimport { selectAdmin, useAdminStore } from \"../runtime\";\nimport {\n  type BuildFieldDefinitionsOptions,\n  buildFieldDefinitionsFromSchema,\n} from \"../utils/build-field-definitions-from-schema\";\nimport { useGlobalSchema } from \"./use-global-schema\";\n\nexport interface UseGlobalFieldsOptions {\n  /**\n   * React Query options for schema fetching\n   */\n  schemaQueryOptions?: Omit<\n    UseQueryOptions<GlobalSchema>,\n    \"queryKey\" | \"queryFn\"\n  >;\n  /**\n   * Options for building field definitions from schema\n   */\n  buildOptions?: BuildFieldDefinitionsOptions;\n}\n\nexport function useGlobalFields(\n  globalName: string,\n  options: UseGlobalFieldsOptions = {},\n) {\n  const admin = useAdminStore(selectAdmin);\n  const {\n    data: schema,\n    isLoading,\n    error,\n  } = useGlobalSchema(globalName, options.schemaQueryOptions);\n\n  const fields = useMemo(() => {\n    if (!schema || !admin) return {};\n    const registry = admin.getFields() as Record<string, any>;\n    return buildFieldDefinitionsFromSchema(\n      schema,\n      registry,\n      options.buildOptions,\n    );\n  }, [schema, admin, options.buildOptions]);\n\n  return { fields, schema, isLoading, error };\n}\n"],"mappings":";;;;;;AA+BA,SAAgB,gBACd,YACA,UAAkC,EAAE,EACpC;CACA,MAAM,QAAQ,cAAc,YAAY;CACxC,MAAM,EACJ,MAAM,QACN,WACA,UACE,gBAAgB,YAAY,QAAQ,mBAAmB;AAY3D,QAAO;EAAE,QAVM,cAAc;AAC3B,OAAI,CAAC,UAAU,CAAC,MAAO,QAAO,EAAE;AAEhC,UAAO,gCACL,QAFe,MAAM,WAAW,EAIhC,QAAQ,aACT;KACA;GAAC;GAAQ;GAAO,QAAQ;GAAa,CAAC;EAExB;EAAQ;EAAW;EAAO"}

package/dist/client/hooks/use-global-meta.mjs

@@ -0,0 +1,59 @@
+import { selectClient, useAdminStore } from "../runtime/provider.mjs";
+import { useQuery, useSuspenseQuery } from "@tanstack/react-query";
+
+//#region src/client/hooks/use-global-meta.ts
+/**
+* Hook for fetching global metadata from the backend
+*
+* Used to get introspection info about globals like:
+* - Whether timestamps are enabled
+* - Whether versioning is enabled
+* - Localized fields
+* - Virtual fields
+*/
+/**
+* Hook to fetch global metadata from the backend
+*
+* Returns metadata useful for building dynamic UIs:
+* - timestamps: Whether createdAt/updatedAt are enabled
+* - versioning: Whether versioning is enabled
+* - localizedFields: Fields that support i18n
+* - virtualFields: Fields that are computed
+*
+* @example
+* ```tsx
+* const { data: meta } = useGlobalMeta("siteSettings");
+*
+* if (meta?.timestamps) {
+*   console.log("Timestamps enabled for this global");
+* }
+* ```
+*/
+function useGlobalMeta(global, queryOptions) {
+	const client = useAdminStore(selectClient);
+	return useQuery({
+		queryKey: getGlobalMetaQueryKey(global),
+		queryFn: async () => {
+			return client.globals[global].meta();
+		},
+		staleTime: 300 * 1e3,
+		gcTime: 1800 * 1e3,
+		...queryOptions
+	});
+}
+/**
+* Query key for global meta
+* Useful for prefetching or invalidation
+*/
+function getGlobalMetaQueryKey(global) {
+	return [
+		"questpie",
+		"globals",
+		global,
+		"meta"
+	];
+}
+
+//#endregion
+export { useGlobalMeta };
+//# sourceMappingURL=use-global-meta.mjs.map

package/dist/client/hooks/use-global-meta.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"use-global-meta.mjs","names":[],"sources":["../../../src/client/hooks/use-global-meta.ts"],"sourcesContent":["/**\n * Hook for fetching global metadata from the backend\n *\n * Used to get introspection info about globals like:\n * - Whether timestamps are enabled\n * - Whether versioning is enabled\n * - Localized fields\n * - Virtual fields\n */\n\nimport {\n\ttype UseQueryOptions,\n\tuseQuery,\n\tuseSuspenseQuery,\n} from \"@tanstack/react-query\";\nimport type { Questpie } from \"questpie\";\nimport type { GlobalMeta } from \"questpie/client\";\nimport type { RegisteredCMS, RegisteredGlobalNames } from \"../builder/registry\";\nimport { selectClient, useAdminStore } from \"../runtime\";\n\ntype ResolvedGlobalNames =\n\tRegisteredCMS extends Questpie<any> ? RegisteredGlobalNames : string;\n\n/**\n * Hook to fetch global metadata from the backend\n *\n * Returns metadata useful for building dynamic UIs:\n * - timestamps: Whether createdAt/updatedAt are enabled\n * - versioning: Whether versioning is enabled\n * - localizedFields: Fields that support i18n\n * - virtualFields: Fields that are computed\n *\n * @example\n * ```tsx\n * const { data: meta } = useGlobalMeta(\"siteSettings\");\n *\n * if (meta?.timestamps) {\n *   console.log(\"Timestamps enabled for this global\");\n * }\n * ```\n */\nexport function useGlobalMeta<K extends ResolvedGlobalNames>(\n\tglobal: K,\n\tqueryOptions?: Omit<UseQueryOptions<GlobalMeta>, \"queryKey\" | \"queryFn\">,\n) {\n\tconst client = useAdminStore(selectClient);\n\n\treturn useQuery<GlobalMeta>({\n\t\tqueryKey: getGlobalMetaQueryKey(global),\n\t\tqueryFn: async () => {\n\t\t\treturn (client as any).globals[global].meta();\n\t\t},\n\t\tstaleTime: 5 * 60 * 1000,\n\t\tgcTime: 30 * 60 * 1000,\n\t\t...queryOptions,\n\t});\n}\n\n/**\n * Query key for global meta\n * Useful for prefetching or invalidation\n */\nexport function getGlobalMetaQueryKey(global: string) {\n\treturn [\"questpie\", \"globals\", global, \"meta\"] as const;\n}\n\n/**\n * Query options factory for global metadata\n * Can be used with TanStack Query's prefetching in loaders or with useSuspenseQuery\n *\n * @example\n * ```ts\n * // In TanStack Start loader\n * export const Route = createFileRoute(\"/admin/globals/:name\")({\n *   loader: async ({ context, params }) => {\n *     await context.queryClient.ensureQueryData(\n *       getGlobalMetaQueryOptions(params.name, context.client)\n *     );\n *   },\n * });\n * ```\n */\nexport function getGlobalMetaQueryOptions(global: string, client: any) {\n\treturn {\n\t\tqueryKey: getGlobalMetaQueryKey(global),\n\t\tqueryFn: async (): Promise<GlobalMeta> => {\n\t\t\treturn client.globals[global].meta();\n\t\t},\n\t\tstaleTime: 5 * 60 * 1000,\n\t\tgcTime: 30 * 60 * 1000,\n\t};\n}\n\n/**\n * Suspense-enabled hook to fetch global metadata\n *\n * Uses useSuspenseQuery so the component will suspend until data is loaded\n * Must be used within a Suspense boundary\n *\n * @example\n * ```tsx\n * function GlobalFormViewInner({ global }: Props) {\n *   const { data: meta } = useSuspenseGlobalMeta(global);\n *   // meta is guaranteed to be defined here\n *   console.log(meta.localizedFields);\n * }\n *\n * // Wrap with Suspense\n * <Suspense fallback={<Loading />}>\n *   <GlobalFormViewInner global=\"siteSettings\" />\n * </Suspense>\n * ```\n */\nexport function useSuspenseGlobalMeta<K extends ResolvedGlobalNames>(\n\tglobal: K,\n) {\n\tconst client = useAdminStore(selectClient);\n\n\treturn useSuspenseQuery<GlobalMeta>(\n\t\tgetGlobalMetaQueryOptions(global, client),\n\t);\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAyCA,SAAgB,cACf,QACA,cACC;CACD,MAAM,SAAS,cAAc,aAAa;AAE1C,QAAO,SAAqB;EAC3B,UAAU,sBAAsB,OAAO;EACvC,SAAS,YAAY;AACpB,UAAQ,OAAe,QAAQ,QAAQ,MAAM;;EAE9C,WAAW,MAAS;EACpB,QAAQ,OAAU;EAClB,GAAG;EACH,CAAC;;;;;;AAOH,SAAgB,sBAAsB,QAAgB;AACrD,QAAO;EAAC;EAAY;EAAW;EAAQ;EAAO"}

package/dist/client/hooks/use-global-schema.mjs

@@ -0,0 +1,33 @@
+import { selectClient, useAdminStore } from "../runtime/provider.mjs";
+import { useQuery } from "@tanstack/react-query";
+
+//#region src/client/hooks/use-global-schema.ts
+/**
+* Hook for fetching global schema from the backend
+*
+* Returns introspection data including fields, access, and validation.
+*/
+function useGlobalSchema(global, queryOptions) {
+	const client = useAdminStore(selectClient);
+	return useQuery({
+		queryKey: getGlobalSchemaQueryKey(global),
+		queryFn: async () => {
+			return client.globals[global].schema();
+		},
+		staleTime: 300 * 1e3,
+		gcTime: 1800 * 1e3,
+		...queryOptions
+	});
+}
+function getGlobalSchemaQueryKey(global) {
+	return [
+		"questpie",
+		"globals",
+		global,
+		"schema"
+	];
+}
+
+//#endregion
+export { useGlobalSchema };
+//# sourceMappingURL=use-global-schema.mjs.map