camox 0.3.0 → 0.4.0

package/dist/features/preview/components/PeekedBlock.js

@@ -1,89 +1,199 @@
 import { previewStore } from "../previewStore.js";
 import { NormalizedDataProvider } from "../../../lib/normalized-data.js";
+import { c } from "react/compiler-runtime";
 import { useSelector } from "@xstate/store/react";
 import * as React from "react";
 import { jsx } from "react/jsx-runtime";
 //#region src/features/preview/components/PeekedBlock.tsx
-var PeekedBlock = ({ onExitComplete }) => {
-	const peekedBlock = useSelector(previewStore, (state) => state.context.peekedBlock);
-	const skipExitAnimation = useSelector(previewStore, (state) => state.context.skipPeekedBlockExitAnimation);
+var PeekedBlock = (t0) => {
+	const $ = c(34);
+	const { onExitComplete } = t0;
+	const peekedBlock = useSelector(previewStore, _temp);
+	const skipExitAnimation = useSelector(previewStore, _temp2);
 	const peekedBlockRef = React.useRef(null);
 	const [displayedBlock, setDisplayedBlock] = React.useState(null);
 	const [isExpanded, setIsExpanded] = React.useState(false);
-	React.useEffect(() => {
-		if (peekedBlock) {
-			setDisplayedBlock(peekedBlock);
-			return;
-		}
-		if (skipExitAnimation) {
+	let t1;
+	let t2;
+	if ($[0] !== onExitComplete || $[1] !== peekedBlock || $[2] !== skipExitAnimation) {
+		t1 = () => {
+			if (peekedBlock) {
+				setDisplayedBlock(peekedBlock);
+				return;
+			}
+			if (skipExitAnimation) {
+				setIsExpanded(false);
+				setDisplayedBlock(null);
+				onExitComplete?.();
+				previewStore.send({ type: "clearSkipPeekedBlockExitAnimation" });
+				return;
+			}
 			setIsExpanded(false);
-			setDisplayedBlock(null);
-			onExitComplete?.();
-			previewStore.send({ type: "clearSkipPeekedBlockExitAnimation" });
-			return;
-		}
-		setIsExpanded(false);
-	}, [
-		peekedBlock,
-		skipExitAnimation,
-		onExitComplete
-	]);
-	React.useEffect(() => {
-		if (!displayedBlock) return;
-		const id = requestAnimationFrame(() => setIsExpanded(true));
-		return () => cancelAnimationFrame(id);
-	}, [displayedBlock]);
-	React.useEffect(() => {
-		if (displayedBlock && peekedBlockRef.current) peekedBlockRef.current.scrollIntoView({
-			behavior: "instant",
-			block: "start"
-		});
-	}, [displayedBlock]);
-	const handleTransitionEnd = React.useCallback((e) => {
-		if (e.propertyName !== "grid-template-rows" || e.target !== e.currentTarget) return;
-		if (isExpanded) {
-			peekedBlockRef.current?.scrollIntoView({
+		};
+		t2 = [
+			peekedBlock,
+			skipExitAnimation,
+			onExitComplete
+		];
+		$[0] = onExitComplete;
+		$[1] = peekedBlock;
+		$[2] = skipExitAnimation;
+		$[3] = t1;
+		$[4] = t2;
+	} else {
+		t1 = $[3];
+		t2 = $[4];
+	}
+	React.useEffect(t1, t2);
+	let t3;
+	let t4;
+	if ($[5] !== displayedBlock) {
+		t3 = () => {
+			if (!displayedBlock) return;
+			const id = requestAnimationFrame(() => setIsExpanded(true));
+			return () => cancelAnimationFrame(id);
+		};
+		t4 = [displayedBlock];
+		$[5] = displayedBlock;
+		$[6] = t3;
+		$[7] = t4;
+	} else {
+		t3 = $[6];
+		t4 = $[7];
+	}
+	React.useEffect(t3, t4);
+	let t5;
+	let t6;
+	if ($[8] !== displayedBlock) {
+		t5 = () => {
+			if (displayedBlock && peekedBlockRef.current) peekedBlockRef.current.scrollIntoView({
 				behavior: "instant",
 				block: "start"
 			});
-			return;
+		};
+		t6 = [displayedBlock];
+		$[8] = displayedBlock;
+		$[9] = t5;
+		$[10] = t6;
+	} else {
+		t5 = $[9];
+		t6 = $[10];
+	}
+	React.useEffect(t5, t6);
+	let t7;
+	if ($[11] !== isExpanded || $[12] !== onExitComplete) {
+		t7 = (e) => {
+			if (e.propertyName !== "grid-template-rows" || e.target !== e.currentTarget) return;
+			if (isExpanded) {
+				peekedBlockRef.current?.scrollIntoView({
+					behavior: "instant",
+					block: "start"
+				});
+				return;
+			}
+			setDisplayedBlock(null);
+			onExitComplete?.();
+		};
+		$[11] = isExpanded;
+		$[12] = onExitComplete;
+		$[13] = t7;
+	} else t7 = $[13];
+	const handleTransitionEnd = t7;
+	let t8;
+	bb0: {
+		if (!displayedBlock) {
+			t8 = null;
+			break bb0;
 		}
-		setDisplayedBlock(null);
-		onExitComplete?.();
-	}, [isExpanded, onExitComplete]);
-	const peekBundle = React.useMemo(() => {
-		if (!displayedBlock) return null;
-		return displayedBlock.getPeekBundle();
-	}, [displayedBlock]);
+		let t9;
+		if ($[14] !== displayedBlock) {
+			t9 = displayedBlock.getPeekBundle();
+			$[14] = displayedBlock;
+			$[15] = t9;
+		} else t9 = $[15];
+		t8 = t9;
+	}
+	const peekBundle = t8;
 	if (!displayedBlock || !peekBundle) return null;
-	return /* @__PURE__ */ jsx("div", {
-		ref: peekedBlockRef,
-		style: {
+	const t9 = isExpanded ? "1fr" : "0fr";
+	let t10;
+	if ($[16] !== t9) {
+		t10 = {
 			scrollMargin: "5rem",
 			display: "grid",
-			gridTemplateRows: isExpanded ? "1fr" : "0fr",
+			gridTemplateRows: t9,
 			transition: "grid-template-rows 300ms ease-out",
 			background: "var(--background)"
-		},
-		onTransitionEnd: handleTransitionEnd,
-		children: /* @__PURE__ */ jsx("div", {
-			style: { overflow: "hidden" },
+		};
+		$[16] = t9;
+		$[17] = t10;
+	} else t10 = $[17];
+	let t11;
+	if ($[18] === Symbol.for("react.memo_cache_sentinel")) {
+		t11 = { overflow: "hidden" };
+		$[18] = t11;
+	} else t11 = $[18];
+	const t12 = peekBundle.block.content;
+	const t13 = peekBundle.block.settings;
+	let t14;
+	if ($[19] !== displayedBlock.id || $[20] !== t12 || $[21] !== t13) {
+		t14 = {
+			_id: "__peek__",
+			type: displayedBlock.id,
+			content: t12,
+			settings: t13,
+			position: ""
+		};
+		$[19] = displayedBlock.id;
+		$[20] = t12;
+		$[21] = t13;
+		$[22] = t14;
+	} else t14 = $[22];
+	let t15;
+	if ($[23] !== displayedBlock.Component || $[24] !== t14) {
+		t15 = /* @__PURE__ */ jsx(displayedBlock.Component, {
+			blockData: t14,
+			mode: "peek"
+		});
+		$[23] = displayedBlock.Component;
+		$[24] = t14;
+		$[25] = t15;
+	} else t15 = $[25];
+	let t16;
+	if ($[26] !== peekBundle.files || $[27] !== peekBundle.repeatableItems || $[28] !== t15) {
+		t16 = /* @__PURE__ */ jsx("div", {
+			style: t11,
 			children: /* @__PURE__ */ jsx(NormalizedDataProvider, {
 				files: peekBundle.files,
 				repeatableItems: peekBundle.repeatableItems,
-				children: /* @__PURE__ */ jsx(displayedBlock.Component, {
-					blockData: {
-						_id: "__peek__",
-						type: displayedBlock.id,
-						content: peekBundle.block.content,
-						settings: peekBundle.block.settings,
-						position: ""
-					},
-					mode: "peek"
-				})
+				children: t15
 			})
-		})
-	});
+		});
+		$[26] = peekBundle.files;
+		$[27] = peekBundle.repeatableItems;
+		$[28] = t15;
+		$[29] = t16;
+	} else t16 = $[29];
+	let t17;
+	if ($[30] !== handleTransitionEnd || $[31] !== t10 || $[32] !== t16) {
+		t17 = /* @__PURE__ */ jsx("div", {
+			ref: peekedBlockRef,
+			style: t10,
+			onTransitionEnd: handleTransitionEnd,
+			children: t16
+		});
+		$[30] = handleTransitionEnd;
+		$[31] = t10;
+		$[32] = t16;
+		$[33] = t17;
+	} else t17 = $[33];
+	return t17;
 };
+function _temp(state) {
+	return state.context.peekedBlock;
+}
+function _temp2(state_0) {
+	return state_0.context.skipPeekedBlockExitAnimation;
+}
 //#endregion
 export { PeekedBlock };