@prismicio/next/dist/pages/SliceSimulator.js

Helpers to integrate Prismic into Next.js apps

import { SliceSimulatorWrapper } from "../SliceSimulatorWrapper.js";
import { useEffect, useState } from "react";
import { jsx } from "react/jsx-runtime";
import { SimulatorManager, StateEventType, getDefaultMessage, getDefaultSlices } from "@prismicio/simulator/kit";
//#region src/pages/SliceSimulator.tsx
const simulatorManager = new SimulatorManager();
/**
* Simulate slices in isolation. The slice simulator enables live slice development in Slice Machine
* and live previews in the Page Builder.
*/
const SliceSimulator = ({ background, zIndex, className, sliceZone: SliceZoneComp }) => {
	const [slices, setSlices] = useState(() => getDefaultSlices());
	const [message, setMessage] = useState(() => getDefaultMessage());
	useEffect(() => {
		simulatorManager.state.on(StateEventType.Slices, (_slices) => {
			setSlices(_slices);
		}, "simulator-slices");
		simulatorManager.state.on(StateEventType.Message, (_message) => {
			setMessage(_message);
		}, "simulator-message");
		simulatorManager.init();
		return () => {
			simulatorManager.state.off(StateEventType.Slices, "simulator-slices");
			simulatorManager.state.off(StateEventType.Message, "simulator-message");
		};
	}, []);
	return /* @__PURE__ */ jsx(SliceSimulatorWrapper, {
		message,
		hasSlices: slices.length > 0,
		background,
		zIndex,
		className,
		children: /* @__PURE__ */ jsx(SliceZoneComp, { slices })
	});
};
//#endregion
export { SliceSimulator };

//# sourceMappingURL=SliceSimulator.js.map