@questpie/admin 1.1.0 → 2.0.0

package/dist/client/hooks/use-reactive-fields.d.mts

@@ -0,0 +1,75 @@
+import { FieldReactiveSchema } from "questpie/client";
+
+//#region src/client/hooks/use-reactive-fields.d.ts
+
+/**
+ * Reactive field state
+ */
+interface ReactiveFieldState {
+  hidden?: boolean;
+  readOnly?: boolean;
+  disabled?: boolean;
+}
+/**
+ * Reactive field result
+ */
+interface ReactiveFieldResult {
+  field: string;
+  type: "hidden" | "readOnly" | "disabled" | "compute";
+  value: unknown;
+  error?: string;
+}
+/**
+ * Options for useReactiveFields hook
+ */
+interface UseReactiveFieldsOptions {
+  /** Collection or global name */
+  collection: string;
+  /** Entity type - collection or global */
+  mode?: "collection" | "global";
+  /** Map of field paths to their reactive configs */
+  reactiveConfigs: Record<string, FieldReactiveSchema>;
+  /** Debounce delay in ms */
+  debounce?: number;
+  /** Whether to enable reactive updates */
+  enabled?: boolean;
+}
+/**
+ * Result from useReactiveFields hook
+ */
+interface UseReactiveFieldsResult {
+  /** Field states (hidden, readOnly, disabled) by field path */
+  fieldStates: Record<string, ReactiveFieldState>;
+  /** Whether a reactive update is pending */
+  isPending: boolean;
+  /** Last error */
+  error: Error | null;
+  /** Force refresh reactive states */
+  refresh: () => void;
+}
+/**
+ * Hook to manage reactive field states.
+ * Watches form changes and triggers server-side handlers when dependencies change.
+ *
+ * @example
+ * ```tsx
+ * const { fieldStates, isPending } = useReactiveFields({
+ *   collection: "posts",
+ *   reactiveConfigs: fieldsWithReactive,
+ * });
+ *
+ * // Apply states to fields
+ * const isHidden = fieldStates["slug"]?.hidden ?? false;
+ * const isReadOnly = fieldStates["slug"]?.readOnly ?? false;
+ * ```
+ */
+declare function useReactiveFields({
+  collection,
+  mode,
+  reactiveConfigs,
+  debounce,
+  enabled
+}: UseReactiveFieldsOptions): UseReactiveFieldsResult;
+//#endregion
+export { ReactiveFieldResult, ReactiveFieldState, UseReactiveFieldsOptions, UseReactiveFieldsResult, useReactiveFields };
+//# sourceMappingURL=use-reactive-fields.d.mts.map

package/dist/client/hooks/use-reactive-fields.d.mts.map

@@ -0,0 +1 @@
+{"version":3,"file":"use-reactive-fields.d.mts","names":[],"sources":["../../../src/client/hooks/use-reactive-fields.ts"],"sourcesContent":[],"mappings":";;;;;;;AAkEa,UA/CI,kBAAA,CA+CJ;EAwFG,MAAA,CAAA,EAAA,OAAA;EACf,QAAA,CAAA,EAAA,OAAA;EACA,QAAA,CAAA,EAAA,OAAA;;;;;AAI6B,UApIb,mBAAA,CAoIa;EAAuB,KAAA,EAAA,MAAA;;;;;;;;UA1HpC,wBAAA;;;;;;mBAQC,eAAe;;;;;;;;;UAYhB,uBAAA;;eAEH,eAAe;;;;SAMrB;;;;;;;;;;;;;;;;;;;;iBAwFQ,iBAAA;;;;;;GAMb,2BAA2B"}

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

@@ -0,0 +1,164 @@
+import { useAdminStore } from "../runtime/provider.mjs";
+import * as React$1 from "react";
+import { useFormContext, useWatch } from "react-hook-form";
+
+//#region src/client/hooks/use-reactive-fields.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;
+}
+/**
+* Build watch dependencies from reactive configs
+*/
+function buildWatchDependencies(reactiveConfigs) {
+	const deps = /* @__PURE__ */ new Set();
+	for (const config of Object.values(reactiveConfigs)) for (const key of [
+		"hidden",
+		"readOnly",
+		"disabled",
+		"compute"
+	]) {
+		const reactiveConfig = config[key];
+		if (reactiveConfig?.watch) {
+			for (const dep of reactiveConfig.watch) if (!dep.startsWith("$")) deps.add(dep);
+		}
+	}
+	return deps;
+}
+/**
+* Hook to manage reactive field states.
+* Watches form changes and triggers server-side handlers when dependencies change.
+*
+* @example
+* ```tsx
+* const { fieldStates, isPending } = useReactiveFields({
+*   collection: "posts",
+*   reactiveConfigs: fieldsWithReactive,
+* });
+*
+* // Apply states to fields
+* const isHidden = fieldStates["slug"]?.hidden ?? false;
+* const isReadOnly = fieldStates["slug"]?.readOnly ?? false;
+* ```
+*/
+function useReactiveFields({ collection, mode = "collection", reactiveConfigs, debounce = 100, enabled = true }) {
+	const client = useAdminStore((s) => s.client);
+	const form = useFormContext();
+	const [fieldStates, setFieldStates] = React$1.useState({});
+	const [isPending, setIsPending] = React$1.useState(false);
+	const [error, setError] = React$1.useState(null);
+	const watchDeps = React$1.useMemo(() => buildWatchDependencies(reactiveConfigs), [reactiveConfigs]);
+	const watchedValues = useWatch({ control: form.control });
+	const formValues = React$1.useMemo(() => watchedValues ?? {}, [watchedValues]);
+	const prevValuesRef = React$1.useRef({});
+	const debounceTimerRef = React$1.useRef(null);
+	const fetchReactiveStates = React$1.useCallback(async () => {
+		if (!enabled || !client || Object.keys(reactiveConfigs).length === 0) return;
+		const requests = [];
+		for (const [fieldPath, config] of Object.entries(reactiveConfigs)) {
+			const siblingData = getSiblingData(formValues, fieldPath);
+			const prevSiblingData = getSiblingData(prevValuesRef.current, fieldPath);
+			for (const type of [
+				"hidden",
+				"readOnly",
+				"disabled",
+				"compute"
+			]) if (config[type]?.watch) requests.push({
+				field: fieldPath,
+				type,
+				formData: formValues,
+				siblingData,
+				prevData: prevValuesRef.current,
+				prevSiblingData
+			});
+		}
+		if (requests.length === 0) return;
+		setIsPending(true);
+		setError(null);
+		try {
+			const response = await client.rpc.batchReactive({
+				collection,
+				type: mode,
+				requests
+			});
+			const newStates = { ...fieldStates };
+			for (const result of response.results) {
+				if (!newStates[result.field]) newStates[result.field] = {};
+				if (result.type === "compute") {
+					if (result.value !== void 0) form.setValue(result.field, result.value, {
+						shouldDirty: true,
+						shouldTouch: false,
+						shouldValidate: false
+					});
+				} else newStates[result.field][result.type] = result.value;
+			}
+			setFieldStates(newStates);
+		} catch (err) {
+			console.error("Reactive fields error:", err);
+			setError(err instanceof Error ? err : new Error(String(err)));
+		} finally {
+			setIsPending(false);
+		}
+	}, [
+		enabled,
+		client,
+		collection,
+		mode,
+		reactiveConfigs,
+		formValues,
+		fieldStates,
+		form
+	]);
+	const isInitializedRef = React$1.useRef(false);
+	React$1.useEffect(() => {
+		if (!enabled || watchDeps.size === 0) return;
+		if (!Object.keys(formValues).some((key) => formValues[key] !== void 0 && formValues[key] !== null)) return;
+		if (!isInitializedRef.current) {
+			isInitializedRef.current = true;
+			prevValuesRef.current = { ...formValues };
+			fetchReactiveStates();
+			return;
+		}
+		let hasChanges = false;
+		for (const dep of watchDeps) if (formValues[dep] !== prevValuesRef.current[dep]) {
+			hasChanges = true;
+			break;
+		}
+		if (!hasChanges) return;
+		prevValuesRef.current = { ...formValues };
+		if (debounceTimerRef.current) clearTimeout(debounceTimerRef.current);
+		debounceTimerRef.current = setTimeout(() => {
+			fetchReactiveStates();
+		}, debounce);
+		return () => {
+			if (debounceTimerRef.current) clearTimeout(debounceTimerRef.current);
+		};
+	}, [
+		enabled,
+		watchDeps,
+		formValues,
+		debounce,
+		fetchReactiveStates
+	]);
+	return {
+		fieldStates,
+		isPending,
+		error,
+		refresh: React$1.useCallback(() => {
+			fetchReactiveStates();
+		}, [fetchReactiveStates])
+	};
+}
+
+//#endregion
+export { useReactiveFields };
+//# sourceMappingURL=use-reactive-fields.mjs.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"use-reactive-fields.mjs","names":["React","requests: Array<{\n\t\t\tfield: string;\n\t\t\ttype: \"hidden\" | \"readOnly\" | \"disabled\" | \"compute\";\n\t\t\tformData: Record<string, any>;\n\t\t\tsiblingData: Record<string, any> | null;\n\t\t\tprevData: Record<string, any> | null;\n\t\t\tprevSiblingData: Record<string, any> | null;\n\t\t}>","newStates: Record<string, ReactiveFieldState>"],"sources":["../../../src/client/hooks/use-reactive-fields.ts"],"sourcesContent":["/**\n * Reactive Fields Hook\n *\n * Watches form changes and triggers server-side reactive handlers.\n * Supports batched RPC calls with debouncing.\n */\n\nimport type { FieldReactiveSchema } from \"questpie/client\";\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 * Reactive field state\n */\nexport interface ReactiveFieldState {\n\thidden?: boolean;\n\treadOnly?: boolean;\n\tdisabled?: boolean;\n}\n\n/**\n * Reactive field result\n */\nexport interface ReactiveFieldResult {\n\tfield: string;\n\ttype: \"hidden\" | \"readOnly\" | \"disabled\" | \"compute\";\n\tvalue: unknown;\n\terror?: string;\n}\n\n/**\n * Options for useReactiveFields hook\n */\nexport interface UseReactiveFieldsOptions {\n\t/** Collection or global name */\n\tcollection: string;\n\n\t/** Entity type - collection or global */\n\tmode?: \"collection\" | \"global\";\n\n\t/** Map of field paths to their reactive configs */\n\treactiveConfigs: Record<string, FieldReactiveSchema>;\n\n\t/** Debounce delay in ms */\n\tdebounce?: number;\n\n\t/** Whether to enable reactive updates */\n\tenabled?: boolean;\n}\n\n/**\n * Result from useReactiveFields hook\n */\nexport interface UseReactiveFieldsResult {\n\t/** Field states (hidden, readOnly, disabled) by field path */\n\tfieldStates: Record<string, ReactiveFieldState>;\n\n\t/** Whether a reactive update is pending */\n\tisPending: boolean;\n\n\t/** Last error */\n\terror: Error | null;\n\n\t/** Force refresh reactive states */\n\trefresh: () => void;\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\t// Check if field is inside an array (e.g., \"items.0.variant\")\n\tconst parts = fieldPath.split(\".\");\n\tconst numericIndex = parts.findIndex((p) => /^\\d+$/.test(p));\n\n\tif (numericIndex === -1) {\n\t\t// Not in array\n\t\treturn null;\n\t}\n\n\t// Get the array item path (e.g., \"items.0\")\n\tconst arrayItemPath = parts.slice(0, numericIndex + 1).join(\".\");\n\n\t// Navigate to the array item\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 * Build watch dependencies from reactive configs\n */\nfunction buildWatchDependencies(\n\treactiveConfigs: Record<string, FieldReactiveSchema>,\n): Set<string> {\n\tconst deps = new Set<string>();\n\n\tfor (const config of Object.values(reactiveConfigs)) {\n\t\t// Add deps from hidden, readOnly, disabled, compute\n\t\tfor (const key of [\"hidden\", \"readOnly\", \"disabled\", \"compute\"] as const) {\n\t\t\tconst reactiveConfig = config[key];\n\t\t\tif (reactiveConfig?.watch) {\n\t\t\t\tfor (const dep of reactiveConfig.watch) {\n\t\t\t\t\t// Filter out sibling deps ($sibling.*) for root-level watching\n\t\t\t\t\tif (!dep.startsWith(\"$\")) {\n\t\t\t\t\t\tdeps.add(dep);\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\t}\n\n\treturn deps;\n}\n\n// ============================================================================\n// Hook Implementation\n// ============================================================================\n\n/**\n * Hook to manage reactive field states.\n * Watches form changes and triggers server-side handlers when dependencies change.\n *\n * @example\n * ```tsx\n * const { fieldStates, isPending } = useReactiveFields({\n *   collection: \"posts\",\n *   reactiveConfigs: fieldsWithReactive,\n * });\n *\n * // Apply states to fields\n * const isHidden = fieldStates[\"slug\"]?.hidden ?? false;\n * const isReadOnly = fieldStates[\"slug\"]?.readOnly ?? false;\n * ```\n */\nexport function useReactiveFields({\n\tcollection,\n\tmode = \"collection\",\n\treactiveConfigs,\n\tdebounce = 100,\n\tenabled = true,\n}: UseReactiveFieldsOptions): UseReactiveFieldsResult {\n\tconst client = useAdminStore((s) => s.client);\n\tconst form = useFormContext();\n\n\t// State\n\tconst [fieldStates, setFieldStates] = React.useState<\n\t\tRecord<string, ReactiveFieldState>\n\t>({});\n\tconst [isPending, setIsPending] = React.useState(false);\n\tconst [error, setError] = React.useState<Error | null>(null);\n\n\t// Build list of dependencies to watch\n\tconst watchDeps = React.useMemo(\n\t\t() => buildWatchDependencies(reactiveConfigs),\n\t\t[reactiveConfigs],\n\t);\n\n\t// Watch form values\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// Previous values ref for change detection\n\tconst prevValuesRef = React.useRef<Record<string, any>>({});\n\n\t// Debounce timer ref\n\tconst debounceTimerRef = React.useRef<ReturnType<typeof setTimeout> | null>(\n\t\tnull,\n\t);\n\n\t// Fetch reactive states from server\n\tconst fetchReactiveStates = React.useCallback(async () => {\n\t\tif (!enabled || !client || Object.keys(reactiveConfigs).length === 0) {\n\t\t\treturn;\n\t\t}\n\n\t\t// Build batch requests\n\t\tconst requests: Array<{\n\t\t\tfield: string;\n\t\t\ttype: \"hidden\" | \"readOnly\" | \"disabled\" | \"compute\";\n\t\t\tformData: Record<string, any>;\n\t\t\tsiblingData: Record<string, any> | null;\n\t\t\tprevData: Record<string, any> | null;\n\t\t\tprevSiblingData: Record<string, any> | null;\n\t\t}> = [];\n\n\t\tfor (const [fieldPath, config] of Object.entries(reactiveConfigs)) {\n\t\t\tconst siblingData = getSiblingData(formValues, fieldPath);\n\t\t\tconst prevSiblingData = getSiblingData(prevValuesRef.current, fieldPath);\n\n\t\t\t// Add request for each reactive type that has a config\n\t\t\tfor (const type of [\n\t\t\t\t\"hidden\",\n\t\t\t\t\"readOnly\",\n\t\t\t\t\"disabled\",\n\t\t\t\t\"compute\",\n\t\t\t] as const) {\n\t\t\t\tif (config[type]?.watch) {\n\t\t\t\t\trequests.push({\n\t\t\t\t\t\tfield: fieldPath,\n\t\t\t\t\t\ttype,\n\t\t\t\t\t\tformData: formValues,\n\t\t\t\t\t\tsiblingData,\n\t\t\t\t\t\tprevData: prevValuesRef.current,\n\t\t\t\t\t\tprevSiblingData,\n\t\t\t\t\t});\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\n\t\tif (requests.length === 0) {\n\t\t\treturn;\n\t\t}\n\n\t\tsetIsPending(true);\n\t\tsetError(null);\n\n\t\ttry {\n\t\t\tconst response = await (client.rpc as any).batchReactive({\n\t\t\t\tcollection,\n\t\t\t\ttype: mode,\n\t\t\t\trequests,\n\t\t\t});\n\n\t\t\t// Update field states\n\t\t\tconst newStates: Record<string, ReactiveFieldState> = { ...fieldStates };\n\n\t\t\tfor (const result of response.results as ReactiveFieldResult[]) {\n\t\t\t\tif (!newStates[result.field]) {\n\t\t\t\t\tnewStates[result.field] = {};\n\t\t\t\t}\n\n\t\t\t\tif (result.type === \"compute\") {\n\t\t\t\t\t// Apply computed value to form\n\t\t\t\t\tif (result.value !== undefined) {\n\t\t\t\t\t\tform.setValue(result.field, result.value, {\n\t\t\t\t\t\t\tshouldDirty: true,\n\t\t\t\t\t\t\tshouldTouch: false,\n\t\t\t\t\t\t\tshouldValidate: false,\n\t\t\t\t\t\t});\n\t\t\t\t\t}\n\t\t\t\t} else {\n\t\t\t\t\t// Update field state\n\t\t\t\t\tnewStates[result.field][result.type] = result.value as boolean;\n\t\t\t\t}\n\t\t\t}\n\n\t\t\tsetFieldStates(newStates);\n\t\t} catch (err) {\n\t\t\tconsole.error(\"Reactive fields error:\", err);\n\t\t\tsetError(err instanceof Error ? err : new Error(String(err)));\n\t\t} finally {\n\t\t\tsetIsPending(false);\n\t\t}\n\t}, [\n\t\tenabled,\n\t\tclient,\n\t\tcollection,\n\t\tmode,\n\t\treactiveConfigs,\n\t\tformValues,\n\t\tfieldStates,\n\t\tform,\n\t]);\n\n\t// Track if we've done initial fetch (to avoid running on empty form data)\n\tconst isInitializedRef = React.useRef(false);\n\n\t// Effect to trigger reactive updates on dep changes\n\t// Also handles initial fetch when form data becomes available (fixes race condition)\n\tReact.useEffect(() => {\n\t\tif (!enabled || watchDeps.size === 0) return;\n\n\t\t// Check if form has actual data (not empty defaults)\n\t\t// This prevents fetching before form data is loaded\n\t\tconst hasFormData = Object.keys(formValues).some(\n\t\t\t(key) => formValues[key] !== undefined && formValues[key] !== null,\n\t\t);\n\t\tif (!hasFormData) return;\n\n\t\t// Initial fetch when data first becomes available\n\t\tif (!isInitializedRef.current) {\n\t\t\tisInitializedRef.current = true;\n\t\t\tprevValuesRef.current = { ...formValues };\n\t\t\tfetchReactiveStates();\n\t\t\treturn;\n\t\t}\n\n\t\t// Check if any watched deps changed\n\t\tlet hasChanges = false;\n\t\tfor (const dep of watchDeps) {\n\t\t\tif (formValues[dep] !== prevValuesRef.current[dep]) {\n\t\t\t\thasChanges = true;\n\t\t\t\tbreak;\n\t\t\t}\n\t\t}\n\n\t\tif (!hasChanges) return;\n\n\t\t// Update prev values\n\t\tprevValuesRef.current = { ...formValues };\n\n\t\t// Debounce the fetch\n\t\tif (debounceTimerRef.current) {\n\t\t\tclearTimeout(debounceTimerRef.current);\n\t\t}\n\n\t\tdebounceTimerRef.current = setTimeout(() => {\n\t\t\tfetchReactiveStates();\n\t\t}, debounce);\n\n\t\treturn () => {\n\t\t\tif (debounceTimerRef.current) {\n\t\t\t\tclearTimeout(debounceTimerRef.current);\n\t\t\t}\n\t\t};\n\t}, [enabled, watchDeps, formValues, debounce, fetchReactiveStates]);\n\n\t// Refresh function\n\tconst refresh = React.useCallback(() => {\n\t\tfetchReactiveStates();\n\t}, [fetchReactiveStates]);\n\n\treturn {\n\t\tfieldStates,\n\t\tisPending,\n\t\terror,\n\t\trefresh,\n\t};\n}\n"],"mappings":"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"}

package/dist/client/hooks/use-realtime-highlight.mjs

@@ -0,0 +1,96 @@
+import { useEffect, useRef, useState } from "react";
+
+//#region src/client/hooks/use-realtime-highlight.ts
+/**
+* Hook to track realtime data changes and highlight affected rows
+*
+* Compares previous data with new data and returns IDs of changed/new items.
+* Used to show visual feedback (pulse animation) when data updates via SSE.
+*/
+/**
+* Track realtime changes and return IDs of changed/new rows
+*
+* @example
+* ```tsx
+* const { isHighlighted } = useRealtimeHighlight(data?.docs, { enabled: realtime });
+*
+* {items.map((row) => (
+*   <TableRow className={cn(
+*     isHighlighted(row.id) && "animate-realtime-pulse",
+*   )}>
+* ))}
+* ```
+*/
+function useRealtimeHighlight(docs, options = {}) {
+	const { highlightDuration = 1500, enabled = true, initializationGracePeriod = 500 } = options;
+	const [highlightedIds, setHighlightedIds] = useState(/* @__PURE__ */ new Set());
+	const prevDocsRef = useRef(/* @__PURE__ */ new Map());
+	const hasInitializedRef = useRef(false);
+	const initializedAtRef = useRef(0);
+	const timersRef = useRef(/* @__PURE__ */ new Set());
+	useEffect(() => {
+		return () => {
+			for (const timer of timersRef.current) clearTimeout(timer);
+		};
+	}, []);
+	useEffect(() => {
+		if (!enabled || !docs) return;
+		const currentMap = /* @__PURE__ */ new Map();
+		for (const doc of docs) currentMap.set(doc.id, getDocFingerprint(doc));
+		if (!hasInitializedRef.current) {
+			hasInitializedRef.current = true;
+			initializedAtRef.current = Date.now();
+			prevDocsRef.current = currentMap;
+			return;
+		}
+		if (Date.now() - initializedAtRef.current < initializationGracePeriod) {
+			prevDocsRef.current = currentMap;
+			return;
+		}
+		const changedIds = [];
+		for (const doc of docs) {
+			const prevFingerprint = prevDocsRef.current.get(doc.id);
+			const currentFingerprint = currentMap.get(doc.id);
+			if (!prevFingerprint) changedIds.push(doc.id);
+			else if (prevFingerprint !== currentFingerprint) changedIds.push(doc.id);
+		}
+		prevDocsRef.current = currentMap;
+		if (changedIds.length > 0) {
+			setHighlightedIds((prev) => {
+				const next = new Set(prev);
+				for (const id of changedIds) next.add(id);
+				return next;
+			});
+			const timer = setTimeout(() => {
+				setHighlightedIds((prev) => {
+					const next = new Set(prev);
+					for (const id of changedIds) next.delete(id);
+					return next;
+				});
+				timersRef.current.delete(timer);
+			}, highlightDuration);
+			timersRef.current.add(timer);
+		}
+	}, [
+		docs,
+		enabled,
+		highlightDuration,
+		initializationGracePeriod
+	]);
+	return {
+		highlightedIds,
+		isHighlighted: (id) => highlightedIds.has(id)
+	};
+}
+/**
+* Create a fingerprint for a doc to detect changes
+* Uses updatedAt if available, otherwise JSON stringify
+*/
+function getDocFingerprint(doc) {
+	if (doc.updatedAt) return `${doc.id}:${String(doc.updatedAt)}`;
+	return JSON.stringify(doc);
+}
+
+//#endregion
+export { useRealtimeHighlight };
+//# sourceMappingURL=use-realtime-highlight.mjs.map

package/dist/client/hooks/use-realtime-highlight.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"use-realtime-highlight.mjs","names":["changedIds: string[]"],"sources":["../../../src/client/hooks/use-realtime-highlight.ts"],"sourcesContent":["/**\n * Hook to track realtime data changes and highlight affected rows\n *\n * Compares previous data with new data and returns IDs of changed/new items.\n * Used to show visual feedback (pulse animation) when data updates via SSE.\n */\n\nimport { useEffect, useRef, useState } from \"react\";\n\ntype DocWithId = {\n\tid: string;\n\tupdatedAt?: string | Date;\n\t[key: string]: unknown;\n};\n\nexport type UseRealtimeHighlightOptions = {\n\t/** Duration in ms to keep highlight active (default: 1500) */\n\thighlightDuration?: number;\n\t/** Whether realtime is enabled */\n\tenabled?: boolean;\n\t/**\n\t * Duration in ms after initialization to ignore changes (default: 500).\n\t * This prevents false highlights on page refresh when SSE reconnects\n\t * and triggers immediate refetches.\n\t */\n\tinitializationGracePeriod?: number;\n};\n\nexport type UseRealtimeHighlightResult<T extends DocWithId> = {\n\t/** Set of row IDs that should be highlighted (updated/new) */\n\thighlightedIds: Set<string>;\n\t/** Check if a specific row should be highlighted as updated/new */\n\tisHighlighted: (id: string) => boolean;\n};\n\n/**\n * Track realtime changes and return IDs of changed/new rows\n *\n * @example\n * ```tsx\n * const { isHighlighted } = useRealtimeHighlight(data?.docs, { enabled: realtime });\n *\n * {items.map((row) => (\n *   <TableRow className={cn(\n *     isHighlighted(row.id) && \"animate-realtime-pulse\",\n *   )}>\n * ))}\n * ```\n */\nexport function useRealtimeHighlight<T extends DocWithId>(\n\tdocs: T[] | undefined,\n\toptions: UseRealtimeHighlightOptions = {},\n): UseRealtimeHighlightResult<T> {\n\tconst {\n\t\thighlightDuration = 1500,\n\t\tenabled = true,\n\t\tinitializationGracePeriod = 500,\n\t} = options;\n\n\tconst [highlightedIds, setHighlightedIds] = useState<Set<string>>(new Set());\n\n\t// Track previous docs by fingerprint\n\tconst prevDocsRef = useRef<Map<string, string>>(new Map());\n\t// Track if we've seen any data yet (to skip initial highlight)\n\tconst hasInitializedRef = useRef(false);\n\t// Track when initialization happened to implement grace period\n\tconst initializedAtRef = useRef<number>(0);\n\tconst timersRef = useRef<Set<ReturnType<typeof setTimeout>>>(new Set());\n\n\t// Cleanup timers on unmount\n\tuseEffect(() => {\n\t\treturn () => {\n\t\t\tfor (const timer of timersRef.current) {\n\t\t\t\tclearTimeout(timer);\n\t\t\t}\n\t\t};\n\t}, []);\n\n\tuseEffect(() => {\n\t\tif (!enabled || !docs) {\n\t\t\treturn;\n\t\t}\n\n\t\t// Build current fingerprint map\n\t\tconst currentMap = new Map<string, string>();\n\t\tfor (const doc of docs) {\n\t\t\tcurrentMap.set(doc.id, getDocFingerprint(doc));\n\t\t}\n\n\t\t// Skip highlighting on first data load\n\t\tif (!hasInitializedRef.current) {\n\t\t\thasInitializedRef.current = true;\n\t\t\tinitializedAtRef.current = Date.now();\n\t\t\tprevDocsRef.current = currentMap;\n\t\t\treturn;\n\t\t}\n\n\t\t// Skip highlighting during grace period after initialization\n\t\t// This prevents false highlights on page refresh when SSE reconnects\n\t\t// and triggers immediate refetches\n\t\tconst timeSinceInit = Date.now() - initializedAtRef.current;\n\t\tif (timeSinceInit < initializationGracePeriod) {\n\t\t\tprevDocsRef.current = currentMap;\n\t\t\treturn;\n\t\t}\n\n\t\t// Find new and updated docs\n\t\tconst changedIds: string[] = [];\n\t\tfor (const doc of docs) {\n\t\t\tconst prevFingerprint = prevDocsRef.current.get(doc.id);\n\t\t\tconst currentFingerprint = currentMap.get(doc.id)!;\n\n\t\t\tif (!prevFingerprint) {\n\t\t\t\t// New doc\n\t\t\t\tchangedIds.push(doc.id);\n\t\t\t} else if (prevFingerprint !== currentFingerprint) {\n\t\t\t\t// Updated doc\n\t\t\t\tchangedIds.push(doc.id);\n\t\t\t}\n\t\t}\n\n\t\t// Update prev docs map\n\t\tprevDocsRef.current = currentMap;\n\n\t\t// Handle updated/new rows\n\t\tif (changedIds.length > 0) {\n\t\t\tsetHighlightedIds((prev) => {\n\t\t\t\tconst next = new Set(prev);\n\t\t\t\tfor (const id of changedIds) {\n\t\t\t\t\tnext.add(id);\n\t\t\t\t}\n\t\t\t\treturn next;\n\t\t\t});\n\n\t\t\t// Remove highlights after duration\n\t\t\tconst timer = setTimeout(() => {\n\t\t\t\tsetHighlightedIds((prev) => {\n\t\t\t\t\tconst next = new Set(prev);\n\t\t\t\t\tfor (const id of changedIds) {\n\t\t\t\t\t\tnext.delete(id);\n\t\t\t\t\t}\n\t\t\t\t\treturn next;\n\t\t\t\t});\n\t\t\t\ttimersRef.current.delete(timer);\n\t\t\t}, highlightDuration);\n\t\t\ttimersRef.current.add(timer);\n\t\t}\n\t}, [docs, enabled, highlightDuration, initializationGracePeriod]);\n\n\treturn {\n\t\thighlightedIds,\n\t\tisHighlighted: (id: string) => highlightedIds.has(id),\n\t};\n}\n\n/**\n * Create a fingerprint for a doc to detect changes\n * Uses updatedAt if available, otherwise JSON stringify\n */\nfunction getDocFingerprint(doc: DocWithId): string {\n\tif (doc.updatedAt) {\n\t\treturn `${doc.id}:${String(doc.updatedAt)}`;\n\t}\n\t// Fallback to JSON - less efficient but works\n\treturn JSON.stringify(doc);\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;AAiDA,SAAgB,qBACf,MACA,UAAuC,EAAE,EACT;CAChC,MAAM,EACL,oBAAoB,MACpB,UAAU,MACV,4BAA4B,QACzB;CAEJ,MAAM,CAAC,gBAAgB,qBAAqB,yBAAsB,IAAI,KAAK,CAAC;CAG5E,MAAM,cAAc,uBAA4B,IAAI,KAAK,CAAC;CAE1D,MAAM,oBAAoB,OAAO,MAAM;CAEvC,MAAM,mBAAmB,OAAe,EAAE;CAC1C,MAAM,YAAY,uBAA2C,IAAI,KAAK,CAAC;AAGvE,iBAAgB;AACf,eAAa;AACZ,QAAK,MAAM,SAAS,UAAU,QAC7B,cAAa,MAAM;;IAGnB,EAAE,CAAC;AAEN,iBAAgB;AACf,MAAI,CAAC,WAAW,CAAC,KAChB;EAID,MAAM,6BAAa,IAAI,KAAqB;AAC5C,OAAK,MAAM,OAAO,KACjB,YAAW,IAAI,IAAI,IAAI,kBAAkB,IAAI,CAAC;AAI/C,MAAI,CAAC,kBAAkB,SAAS;AAC/B,qBAAkB,UAAU;AAC5B,oBAAiB,UAAU,KAAK,KAAK;AACrC,eAAY,UAAU;AACtB;;AAOD,MADsB,KAAK,KAAK,GAAG,iBAAiB,UAChC,2BAA2B;AAC9C,eAAY,UAAU;AACtB;;EAID,MAAMA,aAAuB,EAAE;AAC/B,OAAK,MAAM,OAAO,MAAM;GACvB,MAAM,kBAAkB,YAAY,QAAQ,IAAI,IAAI,GAAG;GACvD,MAAM,qBAAqB,WAAW,IAAI,IAAI,GAAG;AAEjD,OAAI,CAAC,gBAEJ,YAAW,KAAK,IAAI,GAAG;YACb,oBAAoB,mBAE9B,YAAW,KAAK,IAAI,GAAG;;AAKzB,cAAY,UAAU;AAGtB,MAAI,WAAW,SAAS,GAAG;AAC1B,sBAAmB,SAAS;IAC3B,MAAM,OAAO,IAAI,IAAI,KAAK;AAC1B,SAAK,MAAM,MAAM,WAChB,MAAK,IAAI,GAAG;AAEb,WAAO;KACN;GAGF,MAAM,QAAQ,iBAAiB;AAC9B,uBAAmB,SAAS;KAC3B,MAAM,OAAO,IAAI,IAAI,KAAK;AAC1B,UAAK,MAAM,MAAM,WAChB,MAAK,OAAO,GAAG;AAEhB,YAAO;MACN;AACF,cAAU,QAAQ,OAAO,MAAM;MAC7B,kBAAkB;AACrB,aAAU,QAAQ,IAAI,MAAM;;IAE3B;EAAC;EAAM;EAAS;EAAmB;EAA0B,CAAC;AAEjE,QAAO;EACN;EACA,gBAAgB,OAAe,eAAe,IAAI,GAAG;EACrD;;;;;;AAOF,SAAS,kBAAkB,KAAwB;AAClD,KAAI,IAAI,UACP,QAAO,GAAG,IAAI,GAAG,GAAG,OAAO,IAAI,UAAU;AAG1C,QAAO,KAAK,UAAU,IAAI"}

package/dist/client/hooks/use-saved-views.mjs

@@ -0,0 +1,65 @@
+import { useAdminStore } from "../runtime/provider.mjs";
+import { useMutation, useQuery, useQueryClient } from "@tanstack/react-query";
+
+//#region src/client/hooks/use-saved-views.ts
+/**
+* Hook to fetch saved views for a collection
+*
+* Note: This hook requires the adminModule to be used in your CMS setup.
+* If adminSavedViews collection is not available, returns empty array.
+*/
+function useSavedViews(collectionName) {
+	const client = useAdminStore((s) => s.client);
+	return useQuery({
+		queryKey: ["adminSavedViews", collectionName],
+		queryFn: async () => {
+			const collections = client?.collections;
+			if (!collections?.adminSavedViews) return { docs: [] };
+			return { docs: (await collections.adminSavedViews.find({ where: { collectionName } }))?.docs ?? [] };
+		},
+		enabled: !!client
+	});
+}
+/**
+* Hook to save a new view
+*/
+function useSaveView(collectionName) {
+	const client = useAdminStore((s) => s.client);
+	const queryClient = useQueryClient();
+	return useMutation({
+		mutationFn: async (data) => {
+			const collections = client?.collections;
+			if (!collections?.adminSavedViews) throw new Error("adminSavedViews collection not available. Make sure to use adminModule in your CMS setup.");
+			return collections.adminSavedViews.create({
+				...data,
+				collectionName,
+				userId: data.userId || "anonymous",
+				isDefault: false
+			});
+		},
+		onSuccess: () => {
+			queryClient.invalidateQueries({ queryKey: ["adminSavedViews", collectionName] });
+		}
+	});
+}
+/**
+* Hook to delete a view
+*/
+function useDeleteSavedView(collectionName) {
+	const client = useAdminStore((s) => s.client);
+	const queryClient = useQueryClient();
+	return useMutation({
+		mutationFn: async (viewId) => {
+			const collections = client?.collections;
+			if (!collections?.adminSavedViews) throw new Error("adminSavedViews collection not available. Make sure to use adminModule in your CMS setup.");
+			return collections.adminSavedViews.delete({ id: viewId });
+		},
+		onSuccess: () => {
+			queryClient.invalidateQueries({ queryKey: ["adminSavedViews", collectionName] });
+		}
+	});
+}
+
+//#endregion
+export { useDeleteSavedView, useSaveView, useSavedViews };
+//# sourceMappingURL=use-saved-views.mjs.map

package/dist/client/hooks/use-saved-views.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"use-saved-views.mjs","names":[],"sources":["../../../src/client/hooks/use-saved-views.ts"],"sourcesContent":["import { useMutation, useQuery, useQueryClient } from \"@tanstack/react-query\";\nimport { useAdminStore } from \"../runtime/provider.js\";\nimport type { SavedView } from \"../components/filter-builder/types.js\";\n\n/**\n * Hook to fetch saved views for a collection\n *\n * Note: This hook requires the adminModule to be used in your CMS setup.\n * If adminSavedViews collection is not available, returns empty array.\n */\nexport function useSavedViews(collectionName: string) {\n  const client = useAdminStore((s) => s.client);\n\n  return useQuery({\n    queryKey: [\"adminSavedViews\", collectionName],\n    queryFn: async (): Promise<{ docs: SavedView[] }> => {\n      // Check if the collection exists on the client\n      const collections = client?.collections as\n        | Record<string, any>\n        | undefined;\n      if (!collections?.adminSavedViews) {\n        return { docs: [] };\n      }\n\n      const result = await collections.adminSavedViews.find({\n        where: { collectionName },\n      });\n      return { docs: (result?.docs ?? []) as SavedView[] };\n    },\n    enabled: !!client,\n  });\n}\n\n/**\n * Hook to save a new view\n */\nexport function useSaveView(collectionName: string) {\n  const client = useAdminStore((s) => s.client);\n  const queryClient = useQueryClient();\n\n  return useMutation({\n    mutationFn: async (data: {\n      name: string;\n      configuration: SavedView[\"configuration\"];\n      userId?: string;\n    }) => {\n      const collections = client?.collections as\n        | Record<string, any>\n        | undefined;\n      if (!collections?.adminSavedViews) {\n        throw new Error(\n          \"adminSavedViews collection not available. Make sure to use adminModule in your CMS setup.\",\n        );\n      }\n\n      return collections.adminSavedViews.create({\n        ...data,\n        collectionName,\n        userId: data.userId || \"anonymous\",\n        isDefault: false,\n      });\n    },\n    onSuccess: () => {\n      queryClient.invalidateQueries({\n        queryKey: [\"adminSavedViews\", collectionName],\n      });\n    },\n  });\n}\n\n/**\n * Hook to update an existing view\n */\nexport function useUpdateSavedView(collectionName: string) {\n  const client = useAdminStore((s) => s.client);\n  const queryClient = useQueryClient();\n\n  return useMutation({\n    mutationFn: async ({\n      id,\n      data,\n    }: {\n      id: string;\n      data: Partial<SavedView>;\n    }) => {\n      const collections = client?.collections as\n        | Record<string, any>\n        | undefined;\n      if (!collections?.adminSavedViews) {\n        throw new Error(\n          \"adminSavedViews collection not available. Make sure to use adminModule in your CMS setup.\",\n        );\n      }\n\n      return collections.adminSavedViews.update({ id, data });\n    },\n    onSuccess: () => {\n      queryClient.invalidateQueries({\n        queryKey: [\"adminSavedViews\", collectionName],\n      });\n    },\n  });\n}\n\n/**\n * Hook to delete a view\n */\nexport function useDeleteSavedView(collectionName: string) {\n  const client = useAdminStore((s) => s.client);\n  const queryClient = useQueryClient();\n\n  return useMutation({\n    mutationFn: async (viewId: string) => {\n      const collections = client?.collections as\n        | Record<string, any>\n        | undefined;\n      if (!collections?.adminSavedViews) {\n        throw new Error(\n          \"adminSavedViews collection not available. Make sure to use adminModule in your CMS setup.\",\n        );\n      }\n\n      return collections.adminSavedViews.delete({ id: viewId });\n    },\n    onSuccess: () => {\n      queryClient.invalidateQueries({\n        queryKey: [\"adminSavedViews\", collectionName],\n      });\n    },\n  });\n}\n"],"mappings":";;;;;;;;;;AAUA,SAAgB,cAAc,gBAAwB;CACpD,MAAM,SAAS,eAAe,MAAM,EAAE,OAAO;AAE7C,QAAO,SAAS;EACd,UAAU,CAAC,mBAAmB,eAAe;EAC7C,SAAS,YAA4C;GAEnD,MAAM,cAAc,QAAQ;AAG5B,OAAI,CAAC,aAAa,gBAChB,QAAO,EAAE,MAAM,EAAE,EAAE;AAMrB,UAAO,EAAE,OAHM,MAAM,YAAY,gBAAgB,KAAK,EACpD,OAAO,EAAE,gBAAgB,EAC1B,CAAC,GACsB,QAAQ,EAAE,EAAkB;;EAEtD,SAAS,CAAC,CAAC;EACZ,CAAC;;;;;AAMJ,SAAgB,YAAY,gBAAwB;CAClD,MAAM,SAAS,eAAe,MAAM,EAAE,OAAO;CAC7C,MAAM,cAAc,gBAAgB;AAEpC,QAAO,YAAY;EACjB,YAAY,OAAO,SAIb;GACJ,MAAM,cAAc,QAAQ;AAG5B,OAAI,CAAC,aAAa,gBAChB,OAAM,IAAI,MACR,4FACD;AAGH,UAAO,YAAY,gBAAgB,OAAO;IACxC,GAAG;IACH;IACA,QAAQ,KAAK,UAAU;IACvB,WAAW;IACZ,CAAC;;EAEJ,iBAAiB;AACf,eAAY,kBAAkB,EAC5B,UAAU,CAAC,mBAAmB,eAAe,EAC9C,CAAC;;EAEL,CAAC;;;;;AAwCJ,SAAgB,mBAAmB,gBAAwB;CACzD,MAAM,SAAS,eAAe,MAAM,EAAE,OAAO;CAC7C,MAAM,cAAc,gBAAgB;AAEpC,QAAO,YAAY;EACjB,YAAY,OAAO,WAAmB;GACpC,MAAM,cAAc,QAAQ;AAG5B,OAAI,CAAC,aAAa,gBAChB,OAAM,IAAI,MACR,4FACD;AAGH,UAAO,YAAY,gBAAgB,OAAO,EAAE,IAAI,QAAQ,CAAC;;EAE3D,iBAAiB;AACf,eAAY,kBAAkB,EAC5B,UAAU,CAAC,mBAAmB,eAAe,EAC9C,CAAC;;EAEL,CAAC"}

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

@@ -0,0 +1,147 @@
+import { selectClient, useAdminStore } from "../runtime/provider.mjs";
+import { useScopedLocale } from "../runtime/locale-scope.mjs";
+import { useQuery } from "@tanstack/react-query";
+import { useEffect, useState } from "react";
+
+//#region src/client/hooks/use-search.ts
+/**
+* Search Hook
+*
+* React hook for FTS-powered search using the CMS Search API.
+* Returns full records with search metadata (score, highlights, indexed title).
+*/
+/**
+* Hook to debounce a value
+*
+* @example
+* ```tsx
+* const [searchTerm, setSearchTerm] = useState("");
+* const debouncedSearch = useDebouncedValue(searchTerm, 300);
+* ```
+*/
+function useDebouncedValue(value, delay) {
+	const [debouncedValue, setDebouncedValue] = useState(value);
+	useEffect(() => {
+		const timer = setTimeout(() => {
+			setDebouncedValue(value);
+		}, delay);
+		return () => {
+			clearTimeout(timer);
+		};
+	}, [value, delay]);
+	return debouncedValue;
+}
+/**
+* Hook for FTS-powered collection search
+*
+* Returns full records directly with search metadata attached.
+* No need for a second CRUD fetch - records are populated server-side.
+*
+* @example
+* ```tsx
+* const [searchTerm, setSearchTerm] = useState("");
+* const debouncedSearch = useDebouncedValue(searchTerm, 300);
+*
+* const { data, isLoading } = useSearch({
+*   collection: "posts",
+*   query: debouncedSearch,
+*   limit: 50,
+* });
+*
+* // Use docs directly - they're full records!
+* const items = data?.docs ?? [];
+*
+* // Access search metadata
+* items.forEach(item => {
+*   console.log(item.title); // Full record field
+*   console.log(item._search.score); // Search score
+*   console.log(item._search.highlights?.title); // Highlighted title
+* });
+* ```
+*/
+function useSearch(options, queryOptions) {
+	const client = useAdminStore(selectClient);
+	const { locale: contentLocale } = useScopedLocale();
+	const { collection, query, filters, limit = 50, offset = 0, highlights = true, facets, enabled } = options;
+	const isEnabled = enabled ?? query?.trim().length > 0;
+	return useQuery({
+		queryKey: [
+			"questpie",
+			"search",
+			collection,
+			query,
+			filters,
+			limit,
+			offset,
+			contentLocale
+		],
+		queryFn: async () => {
+			return await client.search.search({
+				query,
+				collections: [collection],
+				locale: contentLocale,
+				limit,
+				offset,
+				filters,
+				highlights,
+				facets
+			});
+		},
+		enabled: isEnabled,
+		placeholderData: (prev) => prev,
+		staleTime: 30 * 1e3,
+		...queryOptions
+	});
+}
+/**
+* Hook for FTS-powered search across ALL collections
+*
+* Used by the global search (Cmd+K) to find records across the entire CMS.
+*
+* @example
+* ```tsx
+* const [query, setQuery] = useState("");
+* const debouncedQuery = useDebouncedValue(query, 300);
+*
+* const { data, isLoading } = useGlobalSearch({
+*   query: debouncedQuery,
+*   limit: 10,
+* });
+*
+* // Show results grouped by collection
+* data?.docs.forEach(item => {
+*   console.log(`${item._collection}: ${item._search.indexedTitle}`);
+* });
+* ```
+*/
+function useGlobalSearch(options, queryOptions) {
+	const client = useAdminStore(selectClient);
+	const { locale: contentLocale } = useScopedLocale();
+	const { query, limit = 10, highlights = true, enabled } = options;
+	const isEnabled = enabled ?? query?.trim().length >= 2;
+	return useQuery({
+		queryKey: [
+			"questpie",
+			"global-search",
+			query,
+			limit,
+			contentLocale
+		],
+		queryFn: async () => {
+			return await client.search.search({
+				query,
+				locale: contentLocale,
+				limit,
+				highlights
+			});
+		},
+		enabled: isEnabled,
+		placeholderData: (prev) => prev,
+		staleTime: 10 * 1e3,
+		...queryOptions
+	});
+}
+
+//#endregion
+export { useDebouncedValue, useGlobalSearch, useSearch };
+//# sourceMappingURL=use-search.mjs.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"use-search.mjs","names":[],"sources":["../../../src/client/hooks/use-search.ts"],"sourcesContent":["/**\n * Search Hook\n *\n * React hook for FTS-powered search using the CMS Search API.\n * Returns full records with search metadata (score, highlights, indexed title).\n */\n\nimport { useQuery, type UseQueryOptions } from \"@tanstack/react-query\";\nimport { useState, useEffect } from \"react\";\nimport { selectClient, useAdminStore, useScopedLocale } from \"../runtime\";\n\n// ============================================================================\n// Debounce Hook\n// ============================================================================\n\n/**\n * Hook to debounce a value\n *\n * @example\n * ```tsx\n * const [searchTerm, setSearchTerm] = useState(\"\");\n * const debouncedSearch = useDebouncedValue(searchTerm, 300);\n * ```\n */\nexport function useDebouncedValue<T>(value: T, delay: number): T {\n  const [debouncedValue, setDebouncedValue] = useState<T>(value);\n\n  useEffect(() => {\n    const timer = setTimeout(() => {\n      setDebouncedValue(value);\n    }, delay);\n\n    return () => {\n      clearTimeout(timer);\n    };\n  }, [value, delay]);\n\n  return debouncedValue;\n}\n\n// ============================================================================\n// Types\n// ============================================================================\n\n/**\n * Facet definition for search queries\n */\nexport interface SearchFacetDefinition {\n  field: string;\n  limit?: number;\n  sortBy?: \"count\" | \"alpha\";\n}\n\n/**\n * Search options for the hook\n */\nexport interface UseSearchOptions {\n  /**\n   * Collection to search in (required)\n   */\n  collection: string;\n\n  /**\n   * Search query string\n   */\n  query: string;\n\n  /**\n   * Additional metadata filters\n   */\n  filters?: Record<string, string | string[]>;\n\n  /**\n   * Result limit (default: 50)\n   */\n  limit?: number;\n\n  /**\n   * Result offset (default: 0)\n   */\n  offset?: number;\n\n  /**\n   * Include highlights (default: true)\n   */\n  highlights?: boolean;\n\n  /**\n   * Facets to retrieve\n   */\n  facets?: SearchFacetDefinition[];\n\n  /**\n   * Whether the query is enabled (default: true if query is non-empty)\n   */\n  enabled?: boolean;\n}\n\n/**\n * Search metadata attached to each result\n */\nexport interface SearchMeta {\n  /** Relevance score from search */\n  score: number;\n  /** Highlighted snippets with <mark> tags */\n  highlights?: {\n    title?: string;\n    content?: string;\n  };\n  /** Title as stored in search index */\n  indexedTitle: string;\n  /** Content preview from search index */\n  indexedContent?: string;\n}\n\n/**\n * Populated search result - full record with search metadata\n */\nexport interface PopulatedSearchResult<T = Record<string, any>> {\n  /** Full record data (spread at top level) */\n  [key: string]: any;\n  /** Collection name */\n  _collection: string;\n  /** Search metadata */\n  _search: SearchMeta;\n}\n\n/**\n * Facet value with count\n */\nexport interface SearchFacetValue {\n  value: string;\n  count: number;\n}\n\n/**\n * Facet result\n */\nexport interface SearchFacetResult {\n  field: string;\n  values: SearchFacetValue[];\n  stats?: {\n    min: number;\n    max: number;\n  };\n}\n\n/**\n * Search response with populated records\n */\nexport interface SearchResponse<T = Record<string, any>> {\n  /** Full records with search metadata */\n  docs: PopulatedSearchResult<T>[];\n  /** Total count (accurate after access filtering) */\n  total: number;\n  /** Facet results (if requested) */\n  facets?: SearchFacetResult[];\n}\n\n// ============================================================================\n// Hook\n// ============================================================================\n\n/**\n * Hook for FTS-powered collection search\n *\n * Returns full records directly with search metadata attached.\n * No need for a second CRUD fetch - records are populated server-side.\n *\n * @example\n * ```tsx\n * const [searchTerm, setSearchTerm] = useState(\"\");\n * const debouncedSearch = useDebouncedValue(searchTerm, 300);\n *\n * const { data, isLoading } = useSearch({\n *   collection: \"posts\",\n *   query: debouncedSearch,\n *   limit: 50,\n * });\n *\n * // Use docs directly - they're full records!\n * const items = data?.docs ?? [];\n *\n * // Access search metadata\n * items.forEach(item => {\n *   console.log(item.title); // Full record field\n *   console.log(item._search.score); // Search score\n *   console.log(item._search.highlights?.title); // Highlighted title\n * });\n * ```\n */\nexport function useSearch<T = Record<string, any>>(\n  options: UseSearchOptions,\n  queryOptions?: Omit<\n    UseQueryOptions<SearchResponse<T>>,\n    \"queryKey\" | \"queryFn\"\n  >,\n) {\n  const client = useAdminStore(selectClient);\n  const { locale: contentLocale } = useScopedLocale();\n\n  const {\n    collection,\n    query,\n    filters,\n    limit = 50,\n    offset = 0,\n    highlights = true,\n    facets,\n    enabled,\n  } = options;\n\n  // Determine if search should be enabled\n  // By default, enabled when query has content (after trimming)\n  const isEnabled = enabled ?? query?.trim().length > 0;\n\n  return useQuery<SearchResponse<T>>({\n    queryKey: [\n      \"questpie\",\n      \"search\",\n      collection,\n      query,\n      filters,\n      limit,\n      offset,\n      contentLocale,\n    ],\n    queryFn: async () => {\n      // Use the client's search API\n      const response = await (client as any).search.search({\n        query,\n        collections: [collection],\n        locale: contentLocale,\n        limit,\n        offset,\n        filters,\n        highlights,\n        facets,\n      });\n      return response;\n    },\n    enabled: isEnabled,\n    // Keep previous data while fetching new results for smoother UX\n    placeholderData: (prev) => prev,\n    // Stale time for search results (30 seconds)\n    staleTime: 30 * 1000,\n    ...queryOptions,\n  });\n}\n\n/**\n * Hook for reindexing a collection\n *\n * @example\n * ```tsx\n * const { reindex } = useReindex();\n * await reindex(\"posts\");\n * ```\n */\nexport function useReindex() {\n  const client = useAdminStore(selectClient);\n\n  return {\n    reindex: async (collection: string) => {\n      return (client as any).search.reindex(collection);\n    },\n  };\n}\n\n// ============================================================================\n// Global Search Hook\n// ============================================================================\n\n/**\n * Search options for global search (across all collections)\n */\nexport interface UseGlobalSearchOptions {\n  /**\n   * Search query string\n   */\n  query: string;\n\n  /**\n   * Result limit (default: 10)\n   */\n  limit?: number;\n\n  /**\n   * Include highlights (default: true)\n   */\n  highlights?: boolean;\n\n  /**\n   * Whether the query is enabled (default: true if query length >= 2)\n   */\n  enabled?: boolean;\n}\n\n/**\n * Hook for FTS-powered search across ALL collections\n *\n * Used by the global search (Cmd+K) to find records across the entire CMS.\n *\n * @example\n * ```tsx\n * const [query, setQuery] = useState(\"\");\n * const debouncedQuery = useDebouncedValue(query, 300);\n *\n * const { data, isLoading } = useGlobalSearch({\n *   query: debouncedQuery,\n *   limit: 10,\n * });\n *\n * // Show results grouped by collection\n * data?.docs.forEach(item => {\n *   console.log(`${item._collection}: ${item._search.indexedTitle}`);\n * });\n * ```\n */\nexport function useGlobalSearch<T = Record<string, any>>(\n  options: UseGlobalSearchOptions,\n  queryOptions?: Omit<\n    UseQueryOptions<SearchResponse<T>>,\n    \"queryKey\" | \"queryFn\"\n  >,\n) {\n  const client = useAdminStore(selectClient);\n  const { locale: contentLocale } = useScopedLocale();\n\n  const { query, limit = 10, highlights = true, enabled } = options;\n\n  // Require at least 2 characters by default\n  const isEnabled = enabled ?? query?.trim().length >= 2;\n\n  return useQuery<SearchResponse<T>>({\n    queryKey: [\"questpie\", \"global-search\", query, limit, contentLocale],\n    queryFn: async () => {\n      // Search across ALL collections (no collections filter)\n      const response = await (client as any).search.search({\n        query,\n        // collections: undefined - search all\n        locale: contentLocale,\n        limit,\n        highlights,\n      });\n      return response;\n    },\n    enabled: isEnabled,\n    // Keep previous data while fetching for smoother UX\n    placeholderData: (prev) => prev,\n    // Short stale time for global search\n    staleTime: 10 * 1000,\n    ...queryOptions,\n  });\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;AAwBA,SAAgB,kBAAqB,OAAU,OAAkB;CAC/D,MAAM,CAAC,gBAAgB,qBAAqB,SAAY,MAAM;AAE9D,iBAAgB;EACd,MAAM,QAAQ,iBAAiB;AAC7B,qBAAkB,MAAM;KACvB,MAAM;AAET,eAAa;AACX,gBAAa,MAAM;;IAEpB,CAAC,OAAO,MAAM,CAAC;AAElB,QAAO;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA0JT,SAAgB,UACd,SACA,cAIA;CACA,MAAM,SAAS,cAAc,aAAa;CAC1C,MAAM,EAAE,QAAQ,kBAAkB,iBAAiB;CAEnD,MAAM,EACJ,YACA,OACA,SACA,QAAQ,IACR,SAAS,GACT,aAAa,MACb,QACA,YACE;CAIJ,MAAM,YAAY,WAAW,OAAO,MAAM,CAAC,SAAS;AAEpD,QAAO,SAA4B;EACjC,UAAU;GACR;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACD;EACD,SAAS,YAAY;AAYnB,UAViB,MAAO,OAAe,OAAO,OAAO;IACnD;IACA,aAAa,CAAC,WAAW;IACzB,QAAQ;IACR;IACA;IACA;IACA;IACA;IACD,CAAC;;EAGJ,SAAS;EAET,kBAAkB,SAAS;EAE3B,WAAW,KAAK;EAChB,GAAG;EACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;AAwEJ,SAAgB,gBACd,SACA,cAIA;CACA,MAAM,SAAS,cAAc,aAAa;CAC1C,MAAM,EAAE,QAAQ,kBAAkB,iBAAiB;CAEnD,MAAM,EAAE,OAAO,QAAQ,IAAI,aAAa,MAAM,YAAY;CAG1D,MAAM,YAAY,WAAW,OAAO,MAAM,CAAC,UAAU;AAErD,QAAO,SAA4B;EACjC,UAAU;GAAC;GAAY;GAAiB;GAAO;GAAO;GAAc;EACpE,SAAS,YAAY;AASnB,UAPiB,MAAO,OAAe,OAAO,OAAO;IACnD;IAEA,QAAQ;IACR;IACA;IACD,CAAC;;EAGJ,SAAS;EAET,kBAAkB,SAAS;EAE3B,WAAW,KAAK;EAChB,GAAG;EACJ,CAAC"}