@questpie/admin 3.2.2 → 3.2.4

package/dist/client/contexts/focus-context.mjs

@@ -13,8 +13,21 @@ import { jsx } from "react/jsx-runtime";
 * Used for preview click-to-focus functionality.
 */
 const FocusContext = React.createContext(null);
+function areBlockInsertPositionsEqual(left, right) {
+	return left.parentId === right.parentId && left.index === right.index;
+}
+function areFocusStatesEqual(left, right) {
+	if (left.type !== right.type) return false;
+	switch (left.type) {
+		case "idle": return true;
+		case "field": return right.type === "field" && left.fieldPath === right.fieldPath;
+		case "block": return right.type === "block" && left.blockId === right.blockId && left.fieldPath === right.fieldPath;
+		case "block-insert": return right.type === "block-insert" && areBlockInsertPositionsEqual(left.position, right.position) && left.referenceBlockId === right.referenceBlockId;
+		case "relation": return right.type === "relation" && left.fieldPath === right.fieldPath && left.targetCollection === right.targetCollection;
+	}
+}
 function FocusProvider(t0) {
-	const $ = c(27);
+	const $ = c(29);
 	const { children, onFocusChange } = t0;
 	let t1;
 	if ($[0] === Symbol.for("react.memo_cache_sentinel")) {
@@ -22,124 +35,127 @@ function FocusProvider(t0) {
 		$[0] = t1;
 	} else t1 = $[0];
 	const [state, setState] = React.useState(t1);
+	const stateRef = React.useRef(state);
 	let t2;
 	if ($[1] !== onFocusChange) {
-		t2 = (fieldPath) => {
-			const newState = {
-				type: "field",
-				fieldPath
-			};
-			setState(newState);
-			onFocusChange?.(newState);
+		t2 = (nextState) => {
+			if (areFocusStatesEqual(stateRef.current, nextState)) return;
+			stateRef.current = nextState;
+			setState(nextState);
+			onFocusChange?.(nextState);
 		};
 		$[1] = onFocusChange;
 		$[2] = t2;
 	} else t2 = $[2];
-	const focusField = t2;
+	const setFocusState = t2;
 	let t3;
-	if ($[3] !== onFocusChange) {
-		t3 = (blockId, fieldPath_0) => {
-			const newState_0 = {
-				type: "block",
-				blockId,
-				fieldPath: fieldPath_0
-			};
-			setState(newState_0);
-			onFocusChange?.(newState_0);
+	if ($[3] !== setFocusState) {
+		t3 = (fieldPath) => {
+			setFocusState({
+				type: "field",
+				fieldPath
+			});
 		};
-		$[3] = onFocusChange;
+		$[3] = setFocusState;
 		$[4] = t3;
 	} else t3 = $[4];
-	const focusBlock = t3;
+	const focusField = t3;
 	let t4;
-	if ($[5] !== onFocusChange) {
-		t4 = (fieldPath_1, targetCollection) => {
-			const newState_1 = {
-				type: "relation",
-				fieldPath: fieldPath_1,
-				targetCollection
-			};
-			setState(newState_1);
-			onFocusChange?.(newState_1);
+	if ($[5] !== setFocusState) {
+		t4 = (blockId, fieldPath_0) => {
+			setFocusState({
+				type: "block",
+				blockId,
+				fieldPath: fieldPath_0
+			});
 		};
-		$[5] = onFocusChange;
+		$[5] = setFocusState;
 		$[6] = t4;
 	} else t4 = $[6];
-	const focusRelation = t4;
+	const focusBlock = t4;
 	let t5;
-	if ($[7] !== onFocusChange) {
-		t5 = (position, referenceBlockId) => {
-			const newState_2 = {
-				type: "block-insert",
-				position,
-				referenceBlockId
-			};
-			setState(newState_2);
-			onFocusChange?.(newState_2);
+	if ($[7] !== setFocusState) {
+		t5 = (fieldPath_1, targetCollection) => {
+			setFocusState({
+				type: "relation",
+				fieldPath: fieldPath_1,
+				targetCollection
+			});
 		};
-		$[7] = onFocusChange;
+		$[7] = setFocusState;
 		$[8] = t5;
 	} else t5 = $[8];
-	const requestBlockInsert = t5;
+	const focusRelation = t5;
 	let t6;
-	if ($[9] !== onFocusChange) {
-		t6 = () => {
-			const newState_3 = { type: "idle" };
-			setState(newState_3);
-			onFocusChange?.(newState_3);
+	if ($[9] !== setFocusState) {
+		t6 = (position, referenceBlockId) => {
+			setFocusState({
+				type: "block-insert",
+				position,
+				referenceBlockId
+			});
 		};
-		$[9] = onFocusChange;
+		$[9] = setFocusState;
 		$[10] = t6;
 	} else t6 = $[10];
-	const clearFocus = t6;
-	const focusedFieldPath = state.type === "field" ? state.fieldPath : void 0;
-	const focusedBlockId = state.type === "block" ? state.blockId : void 0;
+	const requestBlockInsert = t6;
 	let t7;
-	if ($[11] !== focusedFieldPath) {
-		t7 = (path) => focusedFieldPath === path;
-		$[11] = focusedFieldPath;
+	if ($[11] !== setFocusState) {
+		t7 = () => {
+			setFocusState({ type: "idle" });
+		};
+		$[11] = setFocusState;
 		$[12] = t7;
 	} else t7 = $[12];
+	const clearFocus = t7;
+	const focusedFieldPath = state.type === "field" ? state.fieldPath : void 0;
+	const focusedBlockId = state.type === "block" ? state.blockId : void 0;
 	let t8;
-	if ($[13] !== focusedBlockId) {
-		t8 = (id) => focusedBlockId === id;
-		$[13] = focusedBlockId;
+	if ($[13] !== focusedFieldPath) {
+		t8 = (path) => focusedFieldPath === path;
+		$[13] = focusedFieldPath;
 		$[14] = t8;
 	} else t8 = $[14];
 	let t9;
-	if ($[15] !== clearFocus || $[16] !== focusBlock || $[17] !== focusField || $[18] !== focusRelation || $[19] !== requestBlockInsert || $[20] !== state || $[21] !== t7 || $[22] !== t8) {
-		t9 = {
+	if ($[15] !== focusedBlockId) {
+		t9 = (id) => focusedBlockId === id;
+		$[15] = focusedBlockId;
+		$[16] = t9;
+	} else t9 = $[16];
+	let t10;
+	if ($[17] !== clearFocus || $[18] !== focusBlock || $[19] !== focusField || $[20] !== focusRelation || $[21] !== requestBlockInsert || $[22] !== state || $[23] !== t8 || $[24] !== t9) {
+		t10 = {
 			state,
 			focusField,
 			focusBlock,
 			requestBlockInsert,
 			focusRelation,
 			clearFocus,
-			isFieldFocused: t7,
-			isBlockFocused: t8
+			isFieldFocused: t8,
+			isBlockFocused: t9
 		};
-		$[15] = clearFocus;
-		$[16] = focusBlock;
-		$[17] = focusField;
-		$[18] = focusRelation;
-		$[19] = requestBlockInsert;
-		$[20] = state;
-		$[21] = t7;
-		$[22] = t8;
-		$[23] = t9;
-	} else t9 = $[23];
-	const value = t9;
-	let t10;
-	if ($[24] !== children || $[25] !== value) {
-		t10 = /* @__PURE__ */ jsx(FocusContext.Provider, {
+		$[17] = clearFocus;
+		$[18] = focusBlock;
+		$[19] = focusField;
+		$[20] = focusRelation;
+		$[21] = requestBlockInsert;
+		$[22] = state;
+		$[23] = t8;
+		$[24] = t9;
+		$[25] = t10;
+	} else t10 = $[25];
+	const value = t10;
+	let t11;
+	if ($[26] !== children || $[27] !== value) {
+		t11 = /* @__PURE__ */ jsx(FocusContext.Provider, {
 			value,
 			children
 		});
-		$[24] = children;
-		$[25] = value;
-		$[26] = t10;
-	} else t10 = $[26];
-	return t10;
+		$[26] = children;
+		$[27] = value;
+		$[28] = t11;
+	} else t11 = $[28];
+	return t11;
 }
 /**
 * Use the focus context
@@ -273,26 +289,30 @@ function scrollFieldIntoView(fieldPath, options = {}) {
 	const wrapper = findFieldWrapper(fieldPath, options);
 	if (!wrapper) return false;
 	const focusable = wrapper.querySelector("input:not([type=\"hidden\"]), textarea, button, select, [tabindex]:not([tabindex=\"-1\"]), [contenteditable=\"true\"]");
+	const { behavior = "auto", block = "nearest", focus = true } = options;
 	(focusable ?? wrapper).scrollIntoView({
-		behavior: "smooth",
-		block: "center"
+		behavior,
+		block
 	});
 	wrapper.classList.add("field-focus-pulse");
 	wrapper.addEventListener("animationend", () => wrapper.classList.remove("field-focus-pulse"), { once: true });
-	if (focusable) requestAnimationFrame(() => {
+	if (focus && focusable) requestAnimationFrame(() => {
 		window.focus();
-		focusable.focus();
+		focusable.focus({ preventScroll: true });
 	});
 	return true;
 }
 function scheduleScrollFieldIntoView(fieldPath, options = {}) {
 	if (typeof window === "undefined") return;
-	const { attempts = 12, delayMs = 80, fallbackToBlock = false } = options;
+	const { attempts = 12, delayMs = 80, fallbackToBlock = false, ...scrollOptions } = options;
 	let attempt = 0;
 	const tryScroll = () => {
 		attempt += 1;
 		const isLastAttempt = attempt >= attempts;
-		if (scrollFieldIntoView(fieldPath, { fallbackToBlock: fallbackToBlock && isLastAttempt }) || isLastAttempt) return;
+		if (scrollFieldIntoView(fieldPath, {
+			...scrollOptions,
+			fallbackToBlock: fallbackToBlock && isLastAttempt
+		}) || isLastAttempt) return;
 		window.setTimeout(tryScroll, delayMs);
 	};
 	tryScroll();

package/dist/client/preview/block-scope-context.d.mts

@@ -1,5 +1,5 @@
 import * as React from "react";
-import * as react_jsx_runtime21 from "react/jsx-runtime";
+import * as react_jsx_runtime25 from "react/jsx-runtime";
 
 //#region src/client/preview/block-scope-context.d.ts
 
@@ -35,7 +35,7 @@ declare function BlockScopeProvider({
   blockId,
   basePath,
   children
-}: BlockScopeProviderProps): react_jsx_runtime21.JSX.Element;
+}: BlockScopeProviderProps): react_jsx_runtime25.JSX.Element;
 /**
  * Get current block scope context.
  *

package/dist/client/preview/diff.mjs

@@ -0,0 +1,110 @@
+import { cloneSnapshot } from "./patch.mjs";
+
+//#region src/client/preview/diff.ts
+function diffSnapshot(previous, next, basePath = "") {
+	if (isDeepEqual(previous, next)) return [];
+	if (Array.isArray(previous) || Array.isArray(next)) return [{
+		op: "set",
+		path: basePath,
+		value: cloneSnapshot(next)
+	}];
+	if (isPlainObject(previous) && isPlainObject(next)) {
+		const ops = [];
+		const previousKeys = Object.keys(previous);
+		const nextKeys = Object.keys(next);
+		for (const key of previousKeys) if (!Object.prototype.hasOwnProperty.call(next, key)) ops.push({
+			op: "remove",
+			path: joinPath(basePath, key)
+		});
+		for (const key of nextKeys) {
+			const path = joinPath(basePath, key);
+			if (!Object.prototype.hasOwnProperty.call(previous, key)) {
+				ops.push({
+					op: "set",
+					path,
+					value: cloneSnapshot(next[key])
+				});
+				continue;
+			}
+			ops.push(...diffSnapshot(previous[key], next[key], path));
+		}
+		return ops;
+	}
+	return [{
+		op: "set",
+		path: basePath,
+		value: cloneSnapshot(next)
+	}];
+}
+function diffSnapshotAtPath(previous, next, path) {
+	if (!path) return diffSnapshot(previous, next);
+	const previousValue = readPath(previous, path);
+	const nextValue = readPath(next, path);
+	if (!nextValue.exists) return previousValue.exists ? [{
+		op: "remove",
+		path
+	}] : [];
+	if (previousValue.exists && isDeepEqual(previousValue.value, nextValue.value)) return [];
+	return [{
+		op: "set",
+		path,
+		value: cloneSnapshot(nextValue.value)
+	}];
+}
+function joinPath(basePath, key) {
+	return basePath ? `${basePath}.${key}` : key;
+}
+function isPlainObject(value) {
+	if (value === null || typeof value !== "object" || Array.isArray(value)) return false;
+	const proto = Object.getPrototypeOf(value);
+	return proto === Object.prototype || proto === null;
+}
+function isDeepEqual(left, right) {
+	if (Object.is(left, right)) return true;
+	if (Array.isArray(left) || Array.isArray(right)) {
+		if (!Array.isArray(left) || !Array.isArray(right)) return false;
+		if (left.length !== right.length) return false;
+		return left.every((value, index) => isDeepEqual(value, right[index]));
+	}
+	if (isPlainObject(left) || isPlainObject(right)) {
+		if (!isPlainObject(left) || !isPlainObject(right)) return false;
+		const leftKeys = Object.keys(left);
+		const rightKeys = Object.keys(right);
+		if (leftKeys.length !== rightKeys.length) return false;
+		return leftKeys.every((key) => Object.prototype.hasOwnProperty.call(right, key) && isDeepEqual(left[key], right[key]));
+	}
+	return false;
+}
+function isArrayIndex(segment) {
+	return /^(0|[1-9]\d*)$/.test(segment);
+}
+function readPath(value, path) {
+	let current = value;
+	for (const segment of path.split(".")) {
+		if (Array.isArray(current) && isArrayIndex(segment)) {
+			const index = Number(segment);
+			if (index < 0 || index >= current.length) return {
+				exists: false,
+				value: void 0
+			};
+			current = current[index];
+			continue;
+		}
+		if (!isPlainObject(current)) return {
+			exists: false,
+			value: void 0
+		};
+		if (!Object.prototype.hasOwnProperty.call(current, segment)) return {
+			exists: false,
+			value: void 0
+		};
+		current = current[segment];
+	}
+	return {
+		exists: true,
+		value: current
+	};
+}
+
+//#endregion
+export { diffSnapshot, diffSnapshotAtPath };

package/dist/client/preview/preview-banner.d.mts

@@ -1,4 +1,4 @@
-import * as react_jsx_runtime22 from "react/jsx-runtime";
+import * as react_jsx_runtime24 from "react/jsx-runtime";
 
 //#region src/client/preview/preview-banner.d.ts
 
@@ -40,6 +40,6 @@ declare function PreviewBanner({
   isPreviewMode,
   className,
   exitPreviewUrl
-}: PreviewBannerProps): react_jsx_runtime22.JSX.Element | null;
+}: PreviewBannerProps): react_jsx_runtime24.JSX.Element | null;
 //#endregion
 export { PreviewBanner, PreviewBannerProps };

package/dist/client/preview/preview-field.d.mts

@@ -1,5 +1,5 @@
 import * as React from "react";
-import * as react_jsx_runtime23 from "react/jsx-runtime";
+import * as react_jsx_runtime21 from "react/jsx-runtime";
 
 //#region src/client/preview/preview-field.d.ts
 
@@ -68,7 +68,7 @@ declare function PreviewProvider({
   }) => void;
   onFieldValueEdited?: (payload: PreviewFieldValueEditedPayload) => void;
   children: React.ReactNode;
-}): react_jsx_runtime23.JSX.Element;
+}): react_jsx_runtime21.JSX.Element;
 /**
  * Hook to access preview context.
  */
@@ -107,7 +107,7 @@ declare function PreviewField({
   style,
   onClick,
   onValueCommit
-}: PreviewFieldProps): react_jsx_runtime23.JSX.Element;
+}: PreviewFieldProps): react_jsx_runtime21.JSX.Element;
 /**
  * Standalone PreviewField that works without context.
  * Useful when you can't use PreviewProvider.
@@ -131,6 +131,6 @@ declare function StandalonePreviewField({
     blockId?: string;
     fieldType?: "regular" | "block" | "relation";
   }) => void;
-}): react_jsx_runtime23.JSX.Element;
+}): react_jsx_runtime21.JSX.Element;
 //#endregion
 export { PreviewField, PreviewFieldProps, PreviewProvider, StandalonePreviewField, usePreviewContext };