@prismicio/next 2.2.2 → 2.2.3-canary.1abb259

package/src/exitPreview.ts

@@ -1,31 +1,30 @@
 /**
- * Ends a Prismic preview session within a Next.js app. This function should be
- * used in a Router Handler.
+ * Ends a Prismic preview session within a Next.js app. This function should be used in a Router
+ * Handler.
  *
  * @example
+ * 	```typescript
+ * 	// src/app/api/exit-preview/route.js
  *
- * ```typescript
- * // src/app/api/exit-preview/route.js
+ * 	import { exitPreview } from "@prismicio/next"
  *
- * import { exitPreview } from "@prismicio/next";
- *
- * export async function GET() {
- * 	return await exitPreview();
- * }
- * ```
+ * 	export async function GET() {
+ * 		return await exitPreview()
+ * 	}
+ * 	```
  */
 export async function exitPreview(): Promise<Response> {
 	// Need this to avoid the following Next.js build-time error:
 	// You're importing a component that needs next/headers. That only works
 	// in a Server Component which is not supported in the pages/ directory.
-	const { draftMode } = await import("next/headers");
+	const { draftMode } = await import("next/headers")
 
-	(await draftMode()).disable();
+	;(await draftMode()).disable()
 
 	// `Cache-Control` header is used to prevent CDN-level caching.
 	return new Response(JSON.stringify({ success: true }), {
 		headers: {
 			"Cache-Control": "no-store",
 		},
-	});
+	})
 }

package/src/getSlices.ts

@@ -1,11 +1,7 @@
-import { getDefaultSlices } from "@prismicio/simulator/kit";
-import type { StateEvents, StateEventType } from "@prismicio/simulator/kit";
-import { decompressFromEncodedURIComponent } from "lz-string";
+import { getDefaultSlices } from "@prismicio/simulator/kit"
+import type { StateEvents, StateEventType } from "@prismicio/simulator/kit"
+import { decompressFromEncodedURIComponent } from "lz-string"
 
-export const getSlices = (
-	state: string | null | undefined,
-): StateEvents[StateEventType.Slices] => {
-	return state
-		? JSON.parse(decompressFromEncodedURIComponent(state))
-		: getDefaultSlices();
-};
+export const getSlices = (state: string | null | undefined): StateEvents[StateEventType.Slices] => {
+	return state ? JSON.parse(decompressFromEncodedURIComponent(state)) : getDefaultSlices()
+}

package/src/imgixLoader.ts

@@ -1,26 +1,26 @@
-import type { ImageLoaderProps } from "next/image";
-import type { ImgixURLParams } from "imgix-url-builder";
-import { buildURL } from "imgix-url-builder";
+import type { ImgixURLParams } from "imgix-url-builder"
+import { buildURL } from "imgix-url-builder"
+import type { ImageLoaderProps } from "next/image"
 
 /**
- * A `next/image` loader for Imgix, which Prismic uses, with an optional
- * collection of default Imgix parameters.
+ * A `next/image` loader for Imgix, which Prismic uses, with an optional collection of default Imgix
+ * parameters.
  *
  * @see To learn about `next/image` loaders: https://nextjs.org/docs/api-reference/next/image#loader
  * @see To learn about Imgix's URL API: https://docs.imgix.com/apis/rendering
  */
 export const imgixLoader = (args: ImageLoaderProps): string => {
-	const url = new URL(args.src);
+	const url = new URL(args.src)
 
 	const params: ImgixURLParams = {
 		fit: (url.searchParams.get("fit") as ImgixURLParams["fit"]) || "max",
 		w: args.width,
 		h: undefined,
-	};
+	}
 
 	if (args.quality) {
-		params.q = args.quality;
+		params.q = args.quality
 	}
 
-	return buildURL(args.src, params);
-};
+	return buildURL(args.src, params)
+}

package/src/index.ts

@@ -1,31 +1,28 @@
-export { exitPreview } from "./exitPreview";
+export { exitPreview } from "./exitPreview"
 
-export { PrismicPreview } from "./PrismicPreview";
-export type { PrismicPreviewProps } from "./PrismicPreview";
+export { PrismicPreview } from "./PrismicPreview"
+export type { PrismicPreviewProps } from "./PrismicPreview"
 
-export { PrismicNextLink } from "./PrismicNextLink";
-export type { PrismicNextLinkProps } from "./PrismicNextLink";
+export { PrismicNextLink } from "./PrismicNextLink"
+export type { PrismicNextLinkProps } from "./PrismicNextLink"
 
-export { enableAutoPreviews } from "./enableAutoPreviews";
-export type { EnableAutoPreviewsConfig } from "./enableAutoPreviews";
+export { enableAutoPreviews } from "./enableAutoPreviews"
+export type { EnableAutoPreviewsConfig } from "./enableAutoPreviews"
 
-export { redirectToPreviewURL } from "./redirectToPreviewURL";
-export type { RedirectToPreviewURLConfig } from "./redirectToPreviewURL";
+export { redirectToPreviewURL } from "./redirectToPreviewURL"
+export type { RedirectToPreviewURLConfig } from "./redirectToPreviewURL"
 
-export { PrismicNextImage } from "./PrismicNextImage";
-export type { PrismicNextImageProps } from "./PrismicNextImage";
+export { PrismicNextImage } from "./PrismicNextImage"
+export type { PrismicNextImageProps } from "./PrismicNextImage"
 
-export { SliceSimulator } from "./SliceSimulator";
-export type {
-	SliceSimulatorProps,
-	SliceSimulatorParams,
-} from "./SliceSimulator";
+export { SliceSimulator } from "./SliceSimulator"
+export type { SliceSimulatorProps, SliceSimulatorParams } from "./SliceSimulator"
 
-export { getSlices } from "./getSlices";
+export { getSlices } from "./getSlices"
 
-export { imgixLoader } from "./imgixLoader";
+export { imgixLoader } from "./imgixLoader"
 
-export type { CreateClientConfig } from "./types";
+export type { CreateClientConfig } from "./types"
 
-export { createLocaleRedirect } from "./createLocaleRedirect";
-export type { CreateLocaleRedirectConfig } from "./createLocaleRedirect";
+export { createLocaleRedirect } from "./createLocaleRedirect"
+export type { CreateLocaleRedirectConfig } from "./createLocaleRedirect"

package/src/lib/devMsg.ts

@@ -1,20 +1,18 @@
-import { version } from "../../package.json";
+import { version } from "../../package.json"
 
 /**
  * Returns a `prismic.dev/msg` URL for a given message slug.
  *
  * @example
+ * 	```ts
+ * 	devMsg("missing-param")
+ * 	// => "https://prismic.dev/msg/next/v1.2.3/missing-param"
+ * 	```
  *
- * ```ts
- * devMsg("missing-param");
- * // => "https://prismic.dev/msg/next/v1.2.3/missing-param"
- * ```
- *
- * @param slug - Slug for the message. This corresponds to a Markdown file in
- *   the Git repository's `/messages` directory.
- *
+ * @param slug - Slug for the message. This corresponds to a Markdown file in the Git repository's
+ *   `/messages` directory.
  * @returns The `prismic.dev/msg` URL for the given slug.
  */
 export const devMsg = (slug: string): string => {
-	return `https://prismic.dev/msg/next/v${version}/${slug}`;
-};
+	return `https://prismic.dev/msg/next/v${version}/${slug}`
+}

package/src/lib/resolveDefaultExport.ts

@@ -1,21 +1,17 @@
 /**
- * Resolves a module's default export. The module may provide its default export
- * as a `default` property on an object. This happens when named and default
- * exports are mixed in modules.
+ * Resolves a module's default export. The module may provide its default export as a `default`
+ * property on an object. This happens when named and default exports are mixed in modules.
  *
- * In ES Modules, mixing is fine since the module resolver can distinguish
- * default and named exports. In transpiled modules, however, all exports are
- * put into a single object, and the default export is provided at a property
- * called `default`.
+ * In ES Modules, mixing is fine since the module resolver can distinguish default and named
+ * exports. In transpiled modules, however, all exports are put into a single object, and the
+ * default export is provided at a property called `default`.
  *
- * This helper is needed by Next.js uses CJS files with named and default
- * exports.
+ * This helper is needed by Next.js uses CJS files with named and default exports.
  *
- * This helper _should_ be a temporary hack until Next.js and Node.js resolve
- * their ESM difficulties. This will likely not be removed any time soon,
- * unfortunately.
+ * This helper _should_ be a temporary hack until Next.js and Node.js resolve their ESM
+ * difficulties. This will likely not be removed any time soon, unfortunately.
  */
 export function resolveDefaultExport<T>(mod: T): T {
 	// eslint-disable-next-line @typescript-eslint/no-explicit-any
-	return "default" in (mod as any) ? (mod as any).default : mod;
+	return "default" in (mod as any) ? (mod as any).default : mod
 }

package/src/pages/PrismicPreview.tsx

@@ -1,41 +1,40 @@
-import { getToolbarSrc, cookie as prismicCookie } from "@prismicio/client";
-import { useRouter } from "next/router";
-import Script from "next/script";
-import type { FC } from "react";
-import { type ReactNode, useEffect } from "react";
+import { getToolbarSrc, cookie as prismicCookie } from "@prismicio/client"
+import { useRouter } from "next/router"
+import Script from "next/script"
+import type { FC } from "react"
+import { type ReactNode, useEffect } from "react"
 
 /** Props for `<PrismicPreview>`. */
 export type PrismicPreviewProps = {
 	/**
-	 * The name of your Prismic repository. A Prismic Toolbar will be registered
-	 * using this repository.
+	 * The name of your Prismic repository. A Prismic Toolbar will be registered using this
+	 * repository.
 	 */
-	repositoryName: string;
+	repositoryName: string
 
 	/**
-	 * The URL of your app's Prismic preview endpoint (default: `/api/preview`).
-	 * This URL will be fetched on preview update events.
+	 * The URL of your app's Prismic preview endpoint (default: `/api/preview`). This URL will be
+	 * fetched on preview update events.
 	 */
-	updatePreviewURL?: string;
+	updatePreviewURL?: string
 
 	/**
-	 * The URL of your app's exit preview endpoint (default: `/api/exit-preview`).
-	 * This URL will be fetched on preview exit events.
+	 * The URL of your app's exit preview endpoint (default: `/api/exit-preview`). This URL will be
+	 * fetched on preview exit events.
 	 */
-	exitPreviewURL?: string;
+	exitPreviewURL?: string
 
 	/** Children to render adjacent to the Prismic Toolbar. */
-	children?: ReactNode;
-};
+	children?: ReactNode
+}
 
 /**
- * React component that sets up Prismic Previews using the Prismic Toolbar. When
- * the Prismic Toolbar send events to the browser, such as on preview updates
- * and exiting, this component will automatically refresh the page with the
- * changes.
+ * React component that sets up Prismic Previews using the Prismic Toolbar. When the Prismic Toolbar
+ * send events to the browser, such as on preview updates and exiting, this component will
+ * automatically refresh the page with the changes.
  *
- * This component can be wrapped around your app or added anywhere in your app's
- * tree. It must be rendered on every page.
+ * This component can be wrapped around your app or added anywhere in your app's tree. It must be
+ * rendered on every page.
  */
 export const PrismicPreview: FC<PrismicPreviewProps> = (props) => {
 	const {
@@ -43,21 +42,21 @@ export const PrismicPreview: FC<PrismicPreviewProps> = (props) => {
 		updatePreviewURL = "/api/preview",
 		exitPreviewURL = "/api/exit-preview",
 		children,
-	} = props;
+	} = props
 
-	const router = useRouter();
+	const router = useRouter()
 
-	const toolbarSrc = getToolbarSrc(repositoryName);
+	const toolbarSrc = getToolbarSrc(repositoryName)
 
 	useEffect(() => {
-		const controller = new AbortController();
+		const controller = new AbortController()
 
 		window.addEventListener("prismicPreviewUpdate", onUpdate, {
 			signal: controller.signal,
-		});
+		})
 		window.addEventListener("prismicPreviewEnd", onEnd, {
 			signal: controller.signal,
-		});
+		})
 
 		// Start the preview for preview share links. Previews from
 		// share links do not go to the `updatePreviewURL` like a normal
@@ -66,35 +65,33 @@ export const PrismicPreview: FC<PrismicPreviewProps> = (props) => {
 		// We check that the current URL is a descendant of the base
 		// path to prevent infinite refrehes.
 		if (
-			window.location.href.startsWith(
-				window.location.origin + router.basePath,
-			) &&
+			window.location.href.startsWith(window.location.origin + router.basePath) &&
 			getPreviewCookieRepositoryName() === repositoryName &&
 			!router.isPreview
 		) {
-			start();
+			start()
 		}
 
 		function onEnd(event: Event) {
-			event.preventDefault();
+			event.preventDefault()
 			fetch(router.basePath + exitPreviewURL, { signal: controller.signal })
 				.then((res) => {
 					if (!res.ok) {
 						console.error(
 							`[<PrismicPreview>] Failed to exit Preview Mode using the "${exitPreviewURL}" API endpoint. Does it exist?`,
-						);
+						)
 
-						return;
+						return
 					}
 
-					refresh();
+					refresh()
 				})
-				.catch(() => {});
+				.catch(() => {})
 		}
 
 		function onUpdate(event: Event) {
-			event.preventDefault();
-			start();
+			event.preventDefault()
+			start()
 		}
 
 		function start() {
@@ -110,37 +107,36 @@ export const PrismicPreview: FC<PrismicPreviewProps> = (props) => {
 					if (res.type !== "opaqueredirect") {
 						console.error(
 							`[<PrismicPreview>] Failed to start or update the preview using "${updatePreviewURL}". Does it exist?`,
-						);
+						)
 
-						return;
+						return
 					}
 
-					refresh();
+					refresh()
 				})
-				.catch(() => {});
+				.catch(() => {})
 		}
 
 		function refresh() {
-			router.replace(router.asPath, undefined, { scroll: false });
+			router.replace(router.asPath, undefined, { scroll: false })
 		}
 
-		return () => controller.abort();
-	}, [exitPreviewURL, updatePreviewURL, repositoryName, router]);
+		return () => controller.abort()
+	}, [exitPreviewURL, updatePreviewURL, repositoryName, router])
 
 	return (
 		<>
 			{children}
 			<Script src={toolbarSrc} strategy="lazyOnload" />
 		</>
-	);
-};
+	)
+}
 
 function getPreviewCookieRepositoryName() {
 	const cookie = window.document.cookie
 		.split("; ")
 		.find((row) => row.startsWith(`${prismicCookie.preview}=`))
-		?.split("=")[1];
+		?.split("=")[1]
 
-	return (decodeURIComponent(cookie ?? "").match(/"([^"]+)\.prismic\.io"/) ||
-		[])[1];
+	return (decodeURIComponent(cookie ?? "").match(/"([^"]+)\.prismic\.io"/) || [])[1]
 }

package/src/pages/SliceSimulator.tsx

@@ -1,49 +1,47 @@
-import { SliceSimulatorWrapper } from "../SliceSimulatorWrapper";
 import {
 	SimulatorManager,
 	StateEventType,
 	getDefaultMessage,
 	getDefaultSlices,
-} from "@prismicio/simulator/kit";
+} from "@prismicio/simulator/kit"
 import type {
 	SliceSimulatorProps as BaseSliceSimulatorProps,
 	SliceSimulatorState,
-} from "@prismicio/simulator/kit";
-import { useEffect, useState } from "react";
-import type { ComponentType, FC } from "react";
+} from "@prismicio/simulator/kit"
+import { useEffect, useState } from "react"
+import type { ComponentType, FC } from "react"
 
-const simulatorManager = new SimulatorManager();
+import { SliceSimulatorWrapper } from "../SliceSimulatorWrapper"
+
+const simulatorManager = new SimulatorManager()
 
 export type SliceSimulatorSliceZoneProps = {
-	slices: SliceSimulatorState["slices"];
-};
+	slices: SliceSimulatorState["slices"]
+}
 
 export type SliceSimulatorProps = BaseSliceSimulatorProps & {
 	/**
 	 * React component to render simulated Slices.
 	 *
 	 * @example
+	 * 	```tsx
+	 * 	import { SliceSimulator } from "@slicemachine/adapter-next/simulator"
+	 * 	import { SliceZone } from "@prismicio/react"
 	 *
-	 * ```tsx
-	 * import { SliceSimulator } from "@slicemachine/adapter-next/simulator";
-	 * import { SliceZone } from "@prismicio/react";
-	 *
-	 * import { components } from "../slices";
+	 * 	import { components } from "../slices"
 	 *
-	 * <SliceSimulator
-	 * 	sliceZone={({ slices }) => (
-	 * 		<SliceZone slices={slices} components={components} />
-	 * 	)}
-	 * />;
-	 * ```
+	 * 	;<SliceSimulator
+	 * 		sliceZone={({ slices }) => <SliceZone slices={slices} components={components} />}
+	 * 	/>
+	 * 	```
 	 */
-	sliceZone: ComponentType<SliceSimulatorSliceZoneProps>;
-	className?: string;
-};
+	sliceZone: ComponentType<SliceSimulatorSliceZoneProps>
+	className?: string
+}
 
 /**
- * Simulate slices in isolation. The slice simulator enables live slice
- * development in Slice Machine and live previews in the Page Builder.
+ * Simulate slices in isolation. The slice simulator enables live slice development in Slice Machine
+ * and live previews in the Page Builder.
  */
 export const SliceSimulator: FC<SliceSimulatorProps> = ({
 	background,
@@ -51,33 +49,33 @@ export const SliceSimulator: FC<SliceSimulatorProps> = ({
 	className,
 	sliceZone: SliceZoneComp,
 }) => {
-	const [slices, setSlices] = useState(() => getDefaultSlices());
-	const [message, setMessage] = useState(() => getDefaultMessage());
+	const [slices, setSlices] = useState(() => getDefaultSlices())
+	const [message, setMessage] = useState(() => getDefaultMessage())
 
 	useEffect(() => {
 		simulatorManager.state.on(
 			StateEventType.Slices,
 			(_slices) => {
-				setSlices(_slices);
+				setSlices(_slices)
 			},
 			"simulator-slices",
-		);
+		)
 		simulatorManager.state.on(
 			StateEventType.Message,
 			(_message) => {
-				setMessage(_message);
+				setMessage(_message)
 			},
 			"simulator-message",
-		);
+		)
 
-		simulatorManager.init();
+		simulatorManager.init()
 
 		return () => {
-			simulatorManager.state.off(StateEventType.Slices, "simulator-slices");
+			simulatorManager.state.off(StateEventType.Slices, "simulator-slices")
 
-			simulatorManager.state.off(StateEventType.Message, "simulator-message");
-		};
-	}, []);
+			simulatorManager.state.off(StateEventType.Message, "simulator-message")
+		}
+	}, [])
 
 	return (
 		<SliceSimulatorWrapper
@@ -89,5 +87,5 @@ export const SliceSimulator: FC<SliceSimulatorProps> = ({
 		>
 			<SliceZoneComp slices={slices} />
 		</SliceSimulatorWrapper>
-	);
-};
+	)
+}

package/src/pages/enableAutoPreviews.ts

@@ -1,7 +1,7 @@
-import type { PreviewData } from "next";
-import type { Client } from "@prismicio/client";
+import type { Client } from "@prismicio/client"
+import type { PreviewData } from "next"
 
-import type { NextApiRequestLike } from "./types";
+import type { NextApiRequestLike } from "./types"
 
 /**
  * Configuration for `enableAutoPreviews`.
@@ -13,26 +13,26 @@ export type EnableAutoPreviewsConfig = {
 	// `Pick` is used to use the smallest possible subset of
 	// `prismic.Client`. Doing this reduces the surface area for breaking
 	// type changes.
-	client: Pick<Client, "queryContentFromRef" | "enableAutoPreviewsFromReq">;
+	client: Pick<Client, "queryContentFromRef" | "enableAutoPreviewsFromReq">
 
 	/**
-	 * The `previewData` object provided in the `getStaticProps()` or
-	 * `getServerSideProps()` context object.
+	 * The `previewData` object provided in the `getStaticProps()` or `getServerSideProps()` context
+	 * object.
 	 */
-	previewData?: PreviewData;
+	previewData?: PreviewData
 
 	/**
 	 * The `req` object from a Next.js API route.
 	 *
 	 * @see Next.js API route docs: \<https://nextjs.org/docs/api-routes/introduction\>
 	 */
-	req?: NextApiRequestLike;
-};
+	req?: NextApiRequestLike
+}
 
 /**
- * Configures a Prismic client to automatically query draft content during a
- * preview session. It either takes in a Next.js `getStaticProps` context object
- * or a Next.js API endpoint request object.
+ * Configures a Prismic client to automatically query draft content during a preview session. It
+ * either takes in a Next.js `getStaticProps` context object or a Next.js API endpoint request
+ * object.
  *
  * @param config - Configuration for the function.
  */
@@ -42,21 +42,21 @@ export function enableAutoPreviews(config: EnableAutoPreviewsConfig): void {
 		// `getServerSideProps()` with active Preview Mode.
 
 		if (isPrismicPreviewData(config.previewData)) {
-			config.client.queryContentFromRef(config.previewData.ref);
+			config.client.queryContentFromRef(config.previewData.ref)
 		}
 
-		return;
+		return
 	}
 
 	if ("req" in config && config.req) {
 		// Assume we are in an API Route.
 
-		config.client.enableAutoPreviewsFromReq(config.req);
+		config.client.enableAutoPreviewsFromReq(config.req)
 
-		return;
+		return
 	}
 }
 
 function isPrismicPreviewData(input: unknown): input is { ref: string } {
-	return typeof input === "object" && input !== null && "ref" in input;
+	return typeof input === "object" && input !== null && "ref" in input
 }

package/src/pages/exitPreview.ts

@@ -1,4 +1,4 @@
-import type { NextApiRequestLike, NextApiResponseLike } from "./types";
+import type { NextApiRequestLike, NextApiResponseLike } from "./types"
 
 /** Configuration for `exitPreview()`. */
 export type ExitPreviewAPIRouteConfig = {
@@ -7,39 +7,38 @@ export type ExitPreviewAPIRouteConfig = {
 	 *
 	 * @see Next.js API route docs: \<https://nextjs.org/docs/api-routes/introduction\>
 	 */
-	req?: NextApiRequestLike;
+	req?: NextApiRequestLike
 
 	/**
 	 * The `res` object from a Next.js API route.
 	 *
 	 * @see Next.js API route docs: \<https://nextjs.org/docs/api-routes/introduction\>
 	 */
-	res: NextApiResponseLike;
-};
+	res: NextApiResponseLike
+}
 
 /**
- * Ends a Prismic preview session within a Next.js app. This function should be
- * used in an API route.
+ * Ends a Prismic preview session within a Next.js app. This function should be used in an API
+ * route.
  *
  * @example
+ * 	```typescript
+ * 	// src/pages/api/exit-preview.js
  *
- * ```typescript
- * // src/pages/api/exit-preview.js
- *
- * import { exitPreview } from "@prismicio/next";
+ * 	import { exitPreview } from "@prismicio/next"
  *
- * export default function handler(_req, res) {
- * 	return exitPreview({ res });
- * }
- * ```
+ * 	export default function handler(_req, res) {
+ * 		return exitPreview({ res })
+ * 	}
+ * 	```
  */
 export function exitPreview(config: ExitPreviewAPIRouteConfig): void {
-	config.res.clearPreviewData();
+	config.res.clearPreviewData()
 
 	// `Cache-Control` header is used to prevent CDN-level caching.
-	config.res.setHeader("Cache-Control", "no-store");
+	config.res.setHeader("Cache-Control", "no-store")
 
-	config.res.json({ success: true });
+	config.res.json({ success: true })
 
-	return;
+	return
 }