@prismicio/react 3.4.0-canary.e2a0168 → 3.4.0-pr.257.68f2f80

package/dist/lib/devMsg.js.map

@@ -1 +1 @@
-{"version":3,"file":"devMsg.js","names":[],"sources":["../../src/lib/devMsg.ts"],"sourcesContent":["import { version } from \"../../package.json\";\n\n/**\n * Returns a `prismic.dev/msg` URL for a given message slug.\n *\n * @example\n *\n * ```ts\n * devMsg(\"missing-param\");\n * // => \"https://prismic.dev/msg/react/v1.2.3/missing-param\"\n * ```\n *\n * @param slug - Slug for the message. This corresponds to a Markdown file in\n *   the Git repository's `/messages` directory.\n *\n * @returns The `prismic.dev/msg` URL for the given slug.\n */\nexport function devMsg(slug: string): string {\n\treturn `https://prismic.dev/msg/react/v${version}/${slug}`;\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;AAiBA,SAAgB,OAAO,MAAsB;AAC5C,QAAO,kCAAkC,QAAQ,GAAG"}
+{"version":3,"file":"devMsg.js","names":[],"sources":["../../src/lib/devMsg.ts"],"sourcesContent":["import { version } from \"../../package.json\";\n\n/**\n * Returns a `prismic.dev/msg` URL for a given message slug.\n *\n * @example\n * \t```ts\n * \tdevMsg(\"missing-param\");\n * \t// => \"https://prismic.dev/msg/react/v1.2.3/missing-param\"\n * \t```\n *\n * @param slug - Slug for the message. This corresponds to a Markdown file in the Git repository's\n *   `/messages` directory.\n * @returns The `prismic.dev/msg` URL for the given slug.\n */\nexport function devMsg(slug: string): string {\n\treturn `https://prismic.dev/msg/react/v${version}/${slug}`;\n}\n"],"mappings":";;;;;;;;;;;;;;;AAeA,SAAgB,OAAO,MAAsB;AAC5C,QAAO,kCAAkC,QAAQ,GAAG"}

package/dist/package.js

@@ -1,6 +1,6 @@
 //#region package.json
-var version = "3.4.0-canary.e2a0168";
-
+var version = "3.4.0-pr.257.68f2f80";
 //#endregion
 export { version };
+
 //# sourceMappingURL=package.js.map

package/package.json

@@ -1,24 +1,28 @@
 {
 	"name": "@prismicio/react",
-	"version": "3.4.0-canary.e2a0168",
+	"version": "3.4.0-pr.257.68f2f80",
 	"description": "React components and hooks to fetch and present Prismic content",
 	"keywords": [
-		"typescript",
 		"prismic",
-		"react"
+		"react",
+		"typescript"
 	],
+	"license": "Apache-2.0",
+	"author": "Prismic <contact@prismic.io> (https://prismic.io)",
 	"repository": {
 		"type": "git",
 		"url": "git+https://github.com/prismicio/prismic-react.git"
 	},
-	"license": "Apache-2.0",
-	"author": "Prismic <contact@prismic.io> (https://prismic.io)",
-	"sideEffects": false,
+	"workspaces": [
+		".",
+		"e2e-projects/*"
+	],
+	"files": [
+		"dist",
+		"src"
+	],
 	"type": "module",
-	"exports": {
-		".": "./dist/index.js",
-		"./package.json": "./package.json"
-	},
+	"sideEffects": false,
 	"types": "./dist/index.d.ts",
 	"typesVersions": {
 		"*": {
@@ -27,20 +31,19 @@
 			]
 		}
 	},
-	"files": [
-		"dist",
-		"src"
-	],
-	"workspaces": [
-		".",
-		"e2e-projects/*"
-	],
+	"exports": {
+		".": "./dist/index.js",
+		"./package.json": "./package.json"
+	},
+	"publishConfig": {
+		"access": "public"
+	},
 	"scripts": {
 		"build": "tsdown",
 		"dev": "tsdown --watch",
 		"e2e": "playwright test",
 		"e2e:ui": "npm run e2e -- --ui",
-		"format": "prettier --write .",
+		"format": "oxfmt",
 		"lint": "oxlint --deny-warnings",
 		"prepare": "npm run build",
 		"test": "npm run lint && npm run types && npm run build && npm run e2e",
@@ -50,20 +53,18 @@
 		"esm-env": "^1.2.2"
 	},
 	"devDependencies": {
-		"@playwright/test": "^1.57.0",
+		"@playwright/test": "^1.59.1",
 		"@prismicio/client": "^7.17.0",
-		"@trivago/prettier-plugin-sort-imports": "^6.0.2",
-		"@types/react": "^19.2.8",
+		"@types/react": "^19.2.14",
 		"@types/react-dom": "^19.2.3",
-		"dotenv": "^17.2.3",
-		"oxlint": "^1.39.0",
-		"playwright": "^1.57.0",
-		"prettier": "^3.7.4",
-		"prettier-plugin-jsdoc": "^1.8.0",
-		"react": "^19.2.1",
-		"react-dom": "^19.2.3",
-		"tsdown": "^0.19.0",
-		"typescript": "^5.9.3"
+		"dotenv": "^17.4.0",
+		"oxfmt": "^0.43.0",
+		"oxlint": "^1.58.0",
+		"playwright": "^1.59.1",
+		"react": "^19.2.4",
+		"react-dom": "^19.2.4",
+		"tsdown": "^0.21.7",
+		"typescript": "^6.0.2"
 	},
 	"peerDependencies": {
 		"@prismicio/client": "^7",
@@ -71,8 +72,5 @@
 	},
 	"engines": {
 		"node": ">=20"
-	},
-	"publishConfig": {
-		"access": "public"
 	}
 }

package/src/PrismicImage.tsx

@@ -1,10 +1,3 @@
-import {
-	type ForwardedRef,
-	forwardRef,
-	type ComponentProps,
-	type FC,
-	type ReactNode,
-} from "react";
 import {
 	type ImageFieldImage,
 	asImagePixelDensitySrcSet,
@@ -12,23 +5,15 @@ import {
 	isFilled,
 } from "@prismicio/client";
 import { DEV } from "esm-env";
+import { type ForwardedRef, forwardRef, type ComponentProps, type FC, type ReactNode } from "react";
 
 import { devMsg } from "./lib/devMsg.js";
 
-type ImgixURLParams = Omit<
-	NonNullable<Parameters<typeof asImageWidthSrcSet>[1]>,
-	"widths"
-> &
-	Omit<
-		NonNullable<Parameters<typeof asImagePixelDensitySrcSet>[1]>,
-		"pixelDensities"
-	>;
+type ImgixURLParams = Omit<NonNullable<Parameters<typeof asImageWidthSrcSet>[1]>, "widths"> &
+	Omit<NonNullable<Parameters<typeof asImagePixelDensitySrcSet>[1]>, "pixelDensities">;
 
 /** Props for `<PrismicImage>`. */
-export type PrismicImageProps = Omit<
-	ComponentProps<"img">,
-	"src" | "srcset" | "alt"
-> & {
+export type PrismicImageProps = Omit<ComponentProps<"img">, "src" | "srcset" | "alt"> & {
 	/** The Prismic image field or thumbnail to render. */
 	field: ImageFieldImage | null | undefined;
 
@@ -42,41 +27,35 @@ export type PrismicImageProps = Omit<
 	/**
 	 * Declare an image as decorative by providing `alt=""`.
 	 *
-	 * See:
-	 * https://developer.mozilla.org/en-US/docs/Web/API/HTMLImageElement/alt#decorative_images
+	 * See: https://developer.mozilla.org/en-US/docs/Web/API/HTMLImageElement/alt#decorative_images
 	 */
 	alt?: "";
 
 	/**
-	 * Declare an image as decorative only if the image field does not have
-	 * alternative text by providing `fallbackAlt=""`.
+	 * Declare an image as decorative only if the image field does not have alternative text by
+	 * providing `fallbackAlt=""`.
 	 *
-	 * See:
-	 * https://developer.mozilla.org/en-US/docs/Web/API/HTMLImageElement/alt#decorative_images
+	 * See: https://developer.mozilla.org/en-US/docs/Web/API/HTMLImageElement/alt#decorative_images
 	 */
 	fallbackAlt?: "";
 
 	/**
-	 * The value to be rendered when the field is empty. If a fallback is not
-	 * given, `null` will be rendered.
+	 * The value to be rendered when the field is empty. If a fallback is not given, `null` will be
+	 * rendered.
 	 */
 	fallback?: ReactNode;
 } & (
 		| {
 				/**
-				 * Widths (in pixels) used to build a `srcset` value for the image
-				 * field.
+				 * Widths (in pixels) used to build a `srcset` value for the image field.
 				 *
-				 * If omitted or set to `"defaults"`, the following widths will be used:
-				 * 640, 750, 828, 1080, 1200, 1920, 2048, 3840.
+				 * If omitted or set to `"defaults"`, the following widths will be used: 640, 750, 828,
+				 * 1080, 1200, 1920, 2048, 3840.
 				 *
-				 * If the image field contains responsive views, each responsive view
-				 * can be used as a width in the resulting `srcset` by passing
-				 * `"thumbnails"` as the `widths` prop.
+				 * If the image field contains responsive views, each responsive view can be used as a width
+				 * in the resulting `srcset` by passing `"thumbnails"` as the `widths` prop.
 				 */
-				widths?:
-					| NonNullable<Parameters<typeof asImageWidthSrcSet>[1]>["widths"]
-					| "defaults";
+				widths?: NonNullable<Parameters<typeof asImageWidthSrcSet>[1]>["widths"] | "defaults";
 				/** Not used when the `widths` prop is used. */
 				pixelDensities?: never;
 		  }
@@ -86,13 +65,11 @@ export type PrismicImageProps = Omit<
 				/**
 				 * Pixel densities used to build a `srcset` value for the image field.
 				 *
-				 * If a `pixelDensities` prop is passed `"defaults"`, the following
-				 * pixel densities will be used: 1, 2, 3.
+				 * If a `pixelDensities` prop is passed `"defaults"`, the following pixel densities will be
+				 * used: 1, 2, 3.
 				 */
 				pixelDensities:
-					| NonNullable<
-							Parameters<typeof asImagePixelDensitySrcSet>[1]
-					  >["pixelDensities"]
+					| NonNullable<Parameters<typeof asImagePixelDensitySrcSet>[1]>["pixelDensities"]
 					| "defaults";
 		  }
 	);
@@ -101,94 +78,90 @@ export type PrismicImageProps = Omit<
  * Renders an optimized image from a Prismic image field.
  *
  * @example
- *
- * ```tsx
- * <PrismicImage field={slice.primary.photo} />;
- * ```
+ * 	```tsx
+ * 	<PrismicImage field={slice.primary.photo} />;
+ * 	```
  *
  * @see Learn how to optimize images with imgix, use responsive images, and use framework-specific image components: {@link https://prismic.io/docs/fields/image}
  */
-export const PrismicImage: FC<PrismicImageProps> = forwardRef(
-	function PrismicImage(
-		props: PrismicImageProps,
-		ref: ForwardedRef<HTMLImageElement>,
-	) {
-		const {
-			field,
-			alt,
-			fallbackAlt,
-			imgixParams = {},
-			widths,
-			pixelDensities,
-			fallback,
-			...restProps
-		} = props;
-
-		if (DEV) {
-			if (typeof alt === "string" && alt !== "") {
-				console.warn(
-					`[PrismicImage] The "alt" prop can only be used to declare an image as decorative by passing an empty string (alt="") but was provided a non-empty string. You can resolve this warning by removing the "alt" prop or changing it to alt="". For more details, see ${devMsg(
-						"alt-must-be-an-empty-string",
-					)}`,
-				);
-			}
-
-			if (typeof fallbackAlt === "string" && fallbackAlt !== "") {
-				console.warn(
-					`[PrismicImage] The "fallbackAlt" prop can only be used to declare an image as decorative by passing an empty string (fallbackAlt="") but was provided a non-empty string. You can resolve this warning by removing the "fallbackAlt" prop or changing it to fallbackAlt="". For more details, see ${devMsg(
-						"alt-must-be-an-empty-string",
-					)}`,
-				);
-			}
-
-			if (widths && pixelDensities) {
-				console.warn(
-					`[PrismicImage] Only one of "widths" or "pixelDensities" props can be provided. You can resolve this warning by removing either the "widths" or "pixelDensities" prop. "widths" will be used in this case.`,
-				);
-			}
+export const PrismicImage: FC<PrismicImageProps> = forwardRef(function PrismicImage(
+	props: PrismicImageProps,
+	ref: ForwardedRef<HTMLImageElement>,
+) {
+	const {
+		field,
+		alt,
+		fallbackAlt,
+		imgixParams = {},
+		widths,
+		pixelDensities,
+		fallback,
+		...restProps
+	} = props;
+
+	if (DEV) {
+		if (typeof alt === "string" && alt !== "") {
+			console.warn(
+				`[PrismicImage] The "alt" prop can only be used to declare an image as decorative by passing an empty string (alt="") but was provided a non-empty string. You can resolve this warning by removing the "alt" prop or changing it to alt="". For more details, see ${devMsg(
+					"alt-must-be-an-empty-string",
+				)}`,
+			);
 		}
 
-		if (!isFilled.imageThumbnail(field)) {
-			return <>{fallback}</>;
+		if (typeof fallbackAlt === "string" && fallbackAlt !== "") {
+			console.warn(
+				`[PrismicImage] The "fallbackAlt" prop can only be used to declare an image as decorative by passing an empty string (fallbackAlt="") but was provided a non-empty string. You can resolve this warning by removing the "fallbackAlt" prop or changing it to fallbackAlt="". For more details, see ${devMsg(
+					"alt-must-be-an-empty-string",
+				)}`,
+			);
 		}
 
-		const resolvedImgixParams = imgixParams;
-		for (const x in imgixParams) {
-			if (resolvedImgixParams[x as keyof typeof resolvedImgixParams] === null) {
-				resolvedImgixParams[x as keyof typeof resolvedImgixParams] = undefined;
-			}
+		if (widths && pixelDensities) {
+			console.warn(
+				`[PrismicImage] Only one of "widths" or "pixelDensities" props can be provided. You can resolve this warning by removing either the "widths" or "pixelDensities" prop. "widths" will be used in this case.`,
+			);
 		}
+	}
 
-		let src: string | undefined;
-		let srcSet: string | undefined;
-
-		if (widths || !pixelDensities) {
-			const res = asImageWidthSrcSet(field, {
-				...resolvedImgixParams,
-				widths: widths === "defaults" ? undefined : widths,
-			} as ImgixURLParams);
+	if (!isFilled.imageThumbnail(field)) {
+		return <>{fallback}</>;
+	}
 
-			src = res.src;
-			srcSet = res.srcset;
-		} else if (pixelDensities) {
-			const res = asImagePixelDensitySrcSet(field, {
-				...resolvedImgixParams,
-				pixelDensities:
-					pixelDensities === "defaults" ? undefined : pixelDensities,
-			} as ImgixURLParams);
-
-			src = res.src;
-			srcSet = res.srcset;
+	const resolvedImgixParams = imgixParams;
+	for (const x in imgixParams) {
+		if (resolvedImgixParams[x as keyof typeof resolvedImgixParams] === null) {
+			resolvedImgixParams[x as keyof typeof resolvedImgixParams] = undefined;
 		}
-
-		return (
-			<img
-				ref={ref}
-				src={src}
-				srcSet={srcSet}
-				alt={alt ?? (field.alt || fallbackAlt)}
-				{...restProps}
-			/>
-		);
-	},
-);
+	}
+
+	let src: string | undefined;
+	let srcSet: string | undefined;
+
+	if (widths || !pixelDensities) {
+		const res = asImageWidthSrcSet(field, {
+			...resolvedImgixParams,
+			widths: widths === "defaults" ? undefined : widths,
+		} as ImgixURLParams);
+
+		src = res.src;
+		srcSet = res.srcset;
+	} else if (pixelDensities) {
+		const res = asImagePixelDensitySrcSet(field, {
+			...resolvedImgixParams,
+			pixelDensities: pixelDensities === "defaults" ? undefined : pixelDensities,
+		} as ImgixURLParams);
+
+		src = res.src;
+		srcSet = res.srcset;
+	}
+
+	return (
+		<img
+			ref={ref}
+			src={src}
+			srcSet={srcSet}
+			alt={alt ?? (field.alt || fallbackAlt)}
+			{...restProps}
+		/>
+	);
+});

package/src/PrismicLink.tsx

@@ -1,11 +1,3 @@
-import {
-	type ComponentProps,
-	type ComponentType,
-	type ForwardedRef,
-	type HTMLAttributeAnchorTarget,
-	type ReactNode,
-	forwardRef,
-} from "react";
 import {
 	type LinkField,
 	type LinkResolverFunction,
@@ -14,6 +6,14 @@ import {
 	type AsLinkAttrsConfig,
 } from "@prismicio/client";
 import { DEV } from "esm-env";
+import {
+	type ComponentProps,
+	type ComponentType,
+	type ForwardedRef,
+	type HTMLAttributeAnchorTarget,
+	type ReactNode,
+	forwardRef,
+} from "react";
 
 import { devMsg } from "./lib/devMsg.js";
 
@@ -26,14 +26,14 @@ export interface LinkProps {
 	href: string;
 
 	/**
-	 * The `target` attribute for anchor elements. If the Prismic field is
-	 * configured to open in a new window, this prop defaults to `_blank`.
+	 * The `target` attribute for anchor elements. If the Prismic field is configured to open in a new
+	 * window, this prop defaults to `_blank`.
 	 */
 	target?: HTMLAttributeAnchorTarget;
 
 	/**
-	 * The `rel` attribute for anchor elements. If the `target` prop is set to
-	 * `"_blank"`, this prop defaults to `"noopener noreferrer"`.
+	 * The `rel` attribute for anchor elements. If the `target` prop is set to `"_blank"`, this prop
+	 * defaults to `"noopener noreferrer"`.
 	 */
 	rel?: string;
 
@@ -44,14 +44,11 @@ export interface LinkProps {
 export type PrismicLinkProps<
 	InternalComponentProps = ComponentProps<typeof defaultComponent>,
 	ExternalComponentProps = ComponentProps<typeof defaultComponent>,
-> = Omit<
-	InternalComponentProps & ExternalComponentProps,
-	"rel" | "href" | "children"
-> & {
+> = Omit<InternalComponentProps & ExternalComponentProps, "rel" | "href" | "children"> & {
 	/**
-	 * The `rel` attribute for the link. By default, `"noreferrer"` is provided if
-	 * the link's URL is external. This prop can be provided a function to use the
-	 * link's metadata to determine the `rel` value.
+	 * The `rel` attribute for the link. By default, `"noreferrer"` is provided if the link's URL is
+	 * external. This prop can be provided a function to use the link's metadata to determine the
+	 * `rel` value.
 	 */
 	rel?: string | AsLinkAttrsConfig["rel"];
 
@@ -59,9 +56,8 @@ export type PrismicLinkProps<
 	 * The link resolver used to resolve links.
 	 *
 	 * @remarks
-	 * If your app uses route resolvers when querying for your Prismic
-	 * repository's content, a link resolver does not need to be provided.
-	 *
+	 *   If your app uses route resolvers when querying for your Prismic repository's content, a link
+	 *   resolver does not need to be provided.
 	 * @see Learn about link resolvers and route resolvers {@link https://prismic.io/docs/routes}
 	 */
 	linkResolver?: LinkResolverFunction;
@@ -69,8 +65,8 @@ export type PrismicLinkProps<
 	/**
 	 * The component rendered for internal URLs. Defaults to `<a>`.
 	 *
-	 * If your app uses a client-side router that requires a special Link
-	 * component, provide the Link component to this prop.
+	 * If your app uses a client-side router that requires a special Link component, provide the Link
+	 * component to this prop.
 	 */
 	internalComponent?: ComponentType<InternalComponentProps>;
 
@@ -78,8 +74,8 @@ export type PrismicLinkProps<
 	externalComponent?: ComponentType<ExternalComponentProps>;
 
 	/**
-	 * The children to render for the link. If no children are provided, the
-	 * link's `text` property will be used.
+	 * The children to render for the link. If no children are provided, the link's `text` property
+	 * will be used.
 	 */
 	children?: ReactNode;
 } & (
@@ -104,10 +100,9 @@ export type PrismicLinkProps<
  * Renders a link from a Prismic link field or page.
  *
  * @example
- *
- * ```tsx
- * <PrismicLink field={slice.primary.link}>Click here</PrismicLink>;
- * ```
+ * 	```tsx
+ * 	<PrismicLink field={slice.primary.link}>Click here</PrismicLink>;
+ * 	```
  *
  * @see Learn how to display links and use variants for styling: {@link https://prismic.io/docs/fields/link}
  */
@@ -141,9 +136,7 @@ export const PrismicLink = forwardRef(function PrismicLink<
 					)}`,
 				);
 			} else if (
-				("text" in field
-					? Object.keys(field).length > 2
-					: Object.keys(field).length > 1) &&
+				("text" in field ? Object.keys(field).length > 2 : Object.keys(field).length > 1) &&
 				!("url" in field || "uid" in field || "id" in field)
 			) {
 				console.warn(
@@ -181,10 +174,8 @@ export const PrismicLink = forwardRef(function PrismicLink<
 
 	const href = ("href" in restProps ? restProps.href : computedHref) || "";
 
-	const InternalComponent = (internalComponent ||
-		defaultComponent) as ComponentType<LinkProps>;
-	const ExternalComponent = (externalComponent ||
-		defaultComponent) as ComponentType<LinkProps>;
+	const InternalComponent = (internalComponent || defaultComponent) as ComponentType<LinkProps>;
+	const ExternalComponent = (externalComponent || defaultComponent) as ComponentType<LinkProps>;
 	const Component = href
 		? isInternalURL(href)
 			? InternalComponent
@@ -209,7 +200,6 @@ export const PrismicLink = forwardRef(function PrismicLink<
  * Determines if a URL is internal or external.
  *
  * @param url - The URL to check if internal or external.
- *
  * @returns `true` if `url` is internal, `false` otherwise.
  */
 // TODO: This does not detect all relative URLs as internal such as `about` or `./about`. This function assumes relative URLs start with a "/" or "#"`.