@prismicio/react 3.4.0-pr.257.68f2f80 → 3.4.0-pr.257.71ee28e

package/src/PrismicImage.tsx

@@ -1,3 +1,10 @@
+import {
+	type ForwardedRef,
+	forwardRef,
+	type ComponentProps,
+	type FC,
+	type ReactNode,
+} from "react";
 import {
 	type ImageFieldImage,
 	asImagePixelDensitySrcSet,
@@ -5,15 +12,23 @@ 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;
 
@@ -27,35 +42,41 @@ export type PrismicImageProps = Omit<ComponentProps<"img">, "src" | "srcset" | "
 	/**
 	 * 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;
 		  }
@@ -65,11 +86,13 @@ export type PrismicImageProps = Omit<ComponentProps<"img">, "src" | "srcset" | "
 				/**
 				 * 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";
 		  }
 	);
@@ -78,90 +101,94 @@ export type PrismicImageProps = Omit<ComponentProps<"img">, "src" | "srcset" | "
  * 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",
-				)}`,
-			);
+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.`,
+				);
+			}
 		}
 
-		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 (!isFilled.imageThumbnail(field)) {
+			return <>{fallback}</>;
 		}
 
-		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.`,
-			);
+		const resolvedImgixParams = imgixParams;
+		for (const x in imgixParams) {
+			if (resolvedImgixParams[x as keyof typeof resolvedImgixParams] === null) {
+				resolvedImgixParams[x as keyof typeof resolvedImgixParams] = undefined;
+			}
 		}
-	}
 
-	if (!isFilled.imageThumbnail(field)) {
-		return <>{fallback}</>;
-	}
+		let src: string | undefined;
+		let srcSet: string | undefined;
+
+		if (widths || !pixelDensities) {
+			const res = asImageWidthSrcSet(field, {
+				...resolvedImgixParams,
+				widths: widths === "defaults" ? undefined : widths,
+			} as ImgixURLParams);
 
-	const resolvedImgixParams = imgixParams;
-	for (const x in imgixParams) {
-		if (resolvedImgixParams[x as keyof typeof resolvedImgixParams] === null) {
-			resolvedImgixParams[x as keyof typeof resolvedImgixParams] = undefined;
+			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;
 		}
-	}
-
-	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}
-		/>
-	);
-});
+
+		return (
+			<img
+				ref={ref}
+				src={src}
+				srcSet={srcSet}
+				alt={alt ?? (field.alt || fallbackAlt)}
+				{...restProps}
+			/>
+		);
+	},
+);

package/src/PrismicLink.tsx

@@ -1,11 +1,3 @@
-import {
-	type LinkField,
-	type LinkResolverFunction,
-	type PrismicDocument,
-	asLinkAttrs,
-	type AsLinkAttrsConfig,
-} from "@prismicio/client";
-import { DEV } from "esm-env";
 import {
 	type ComponentProps,
 	type ComponentType,
@@ -14,6 +6,14 @@ import {
 	type ReactNode,
 	forwardRef,
 } from "react";
+import {
+	type LinkField,
+	type LinkResolverFunction,
+	type PrismicDocument,
+	asLinkAttrs,
+	type AsLinkAttrsConfig,
+} from "@prismicio/client";
+import { DEV } from "esm-env";
 
 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,11 +44,14 @@ 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"];
 
@@ -56,8 +59,9 @@ 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;
@@ -65,8 +69,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>;
 
@@ -74,8 +78,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;
 } & (
@@ -100,9 +104,10 @@ 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}
  */
@@ -136,7 +141,9 @@ 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(
@@ -174,8 +181,10 @@ 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
@@ -200,6 +209,7 @@ 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 "#"`.

package/src/PrismicRichText.tsx

@@ -1,3 +1,5 @@
+import { type LinkProps, PrismicLink } from "./PrismicLink.js";
+import { devMsg } from "./lib/devMsg.js";
 import {
 	isFilled,
 	type LinkResolverFunction,
@@ -21,25 +23,25 @@ import {
 	type ReactNode,
 } from "react";
 
-import { devMsg } from "./lib/devMsg.js";
-import { type LinkProps, PrismicLink } from "./PrismicLink.js";
-
 /**
- * A function mapping rich text block types to React Components. It is used to render rich text
- * fields.
+ * A function mapping rich text block types to React Components. It is used to
+ * render rich text fields.
  *
  * @see Templating rich text fields {@link https://prismic.io/docs/fields/rich-text}
  */
 export type JSXFunctionSerializer = RichTextFunctionSerializer<ReactNode>;
 
 /**
- * A map of rich text block types to React Components. It is used to render rich text fields.
+ * A map of rich text block types to React Components. It is used to render rich
+ * text fields.
  *
  * @see Templating rich text fields {@link https://prismic.io/docs/fields/rich-text}
  */
 export type RichTextComponents = RichTextMapSerializer<ReactNode>;
 
-/** @deprecated Use `RichTextComponents` instead. */
+/**
+ * @deprecated Use `RichTextComponents` instead.
+ */
 export type JSXMapSerializer = RichTextComponents;
 
 /** Props for `<PrismicRichText>`. */
@@ -51,8 +53,9 @@ export type PrismicRichTextProps = {
 	 * 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;
@@ -61,29 +64,28 @@ export type PrismicRichTextProps = {
 	 * A map or function that maps a rich text block to a React component.
 	 *
 	 * @remarks
-	 *   Prefer using a map serializer over the function serializer when possible. The map serializer
-	 *   is simpler to maintain.
-	 * @example
-	 * 	A map serializer.
+	 * Prefer using a map serializer over the function serializer when possible.
+	 * The map serializer is simpler to maintain.
 	 *
-	 * 	```jsx
-	 * 	{
-	 * 	heading1: ({children}) => <Heading>{children}</Heading>
-	 * 	}
-	 * 	```
+	 * @example A map serializer.
 	 *
-	 * @example
-	 * 	A function serializer.
+	 * ```jsx
+	 * {
+	 *   heading1: ({children}) => <Heading>{children}</Heading>
+	 * }
+	 * ```
 	 *
-	 * 	```jsx
-	 * 	(type, node, content, children) => {
+	 * @example A function serializer.
+	 *
+	 * ```jsx
+	 * (type, node, content, children) => {
 	 * 	switch (type) {
-	 * 	case "heading1": {
-	 * 	return <Heading>{children}</Heading>;
-	 * 	}
+	 * 		case "heading1": {
+	 * 			return <Heading>{children}</Heading>;
+	 * 		}
 	 * 	}
-	 * 	};
-	 * 	```
+	 * };
+	 * ```
 	 */
 	components?: RichTextComponents | JSXFunctionSerializer;
 
@@ -102,8 +104,8 @@ export type PrismicRichTextProps = {
 	externalLinkComponent?: ComponentType<LinkProps>;
 
 	/**
-	 * 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;
 };
@@ -120,7 +122,9 @@ const getDir = (node: RTAnyNode): "rtl" | undefined => {
 	}
 };
 
-const createDefaultSerializer = (args: CreateDefaultSerializerArgs): JSXFunctionSerializer =>
+const createDefaultSerializer = (
+	args: CreateDefaultSerializerArgs,
+): JSXFunctionSerializer =>
 	wrapMapSerializer<ReactNode>({
 		heading1: ({ node, children, key }) => (
 			<h1 key={key} dir={getDir(node)}>
@@ -245,9 +249,10 @@ const createDefaultSerializer = (args: CreateDefaultSerializerArgs): JSXFunction
  * Renders content from a Prismic rich text field as React components.
  *
  * @example
- * 	```tsx
- * 	<PrismicRichText field={slice.primary.text} />;
- * 	```
+ *
+ * ```tsx
+ * <PrismicRichText field={slice.primary.text} />;
+ * ```
  *
  * @see Learn how to style rich text, use custom components, and use labels for custom formatting: {@link https://prismic.io/docs/fields/rich-text}
  */
@@ -289,15 +294,18 @@ export const PrismicRichText: FC<PrismicRichTextProps> = (props) => {
 	// The serializer is wrapped in a higher-order function that
 	// automatically applies a key to React Elements if one is not already
 	// given.
-	const serialized = serialize<ReactNode>(field, (type, node, text, children, key) => {
-		const result = serializer(type, node, text, children, key);
+	const serialized = serialize<ReactNode>(
+		field,
+		(type, node, text, children, key) => {
+			const result = serializer(type, node, text, children, key);
 
-		if (isValidElement(result) && result.key == null) {
-			return cloneElement(result, { key });
-		} else {
-			return result;
-		}
-	});
+			if (isValidElement(result) && result.key == null) {
+				return cloneElement(result, { key });
+			} else {
+				return result;
+			}
+		},
+	);
 
 	if (!serialized) {
 		return fallback != null ? <>{fallback}</> : null;

package/src/PrismicTable.tsx

@@ -1,3 +1,4 @@
+import type { ComponentType, FC, ReactNode } from "react";
 import {
 	isFilled,
 	type TableField,
@@ -8,7 +9,6 @@ import {
 	type TableFieldHeaderCell,
 	type TableFieldDataCell,
 } from "@prismicio/client";
-import type { ComponentType, FC, ReactNode } from "react";
 
 import { type JSXMapSerializer, PrismicRichText } from "./PrismicRichText.js";
 
@@ -41,21 +41,20 @@ export type PrismicTableProps = {
 	/**
 	 * An object that maps a table block to a React component.
 	 *
-	 * @example
-	 * 	A map serializer.
+	 * @example A map serializer.
 	 *
-	 * 	```jsx
-	 * 	{
-	 * 	table: ({children}) => <table>{children}</table>
-	 * 	thead: ({children}) => <thead>{children}</thead>
-	 * 	}
-	 * 	```
+	 * ```jsx
+	 * {
+	 *   table: ({children}) => <table>{children}</table>
+	 *   thead: ({children}) => <thead>{children}</thead>
+	 * }
+	 * ```
 	 */
 	components?: JSXMapSerializer & TableComponents;
 
 	/**
-	 * 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;
 };
@@ -64,9 +63,10 @@ export type PrismicTableProps = {
  * Renders content from a Prismic table field as React components.
  *
  * @example
- * 	```tsx
- * 	<PrismicTable field={slice.primary.pricing_table} />;
- * 	```
+ *
+ * ```tsx
+ * <PrismicTable field={slice.primary.pricing_table} />;
+ * ```
  *
  * @see Learn how to style tables and customize table element components: {@link https://prismic.io/docs/fields/table}
  */
@@ -77,7 +77,11 @@ export const PrismicTable: FC<PrismicTableProps> = (props) => {
 		return fallback;
 	}
 
-	const { table: Table, thead: Thead, tbody: Tbody } = { ...defaultComponents, ...components };
+	const {
+		table: Table,
+		thead: Thead,
+		tbody: Tbody,
+	} = { ...defaultComponents, ...components };
 
 	return (
 		<Table table={field}>

package/src/PrismicText.tsx

@@ -1,6 +1,6 @@
+import type { FC } from "react";
 import { asText, isFilled, type RichTextField } from "@prismicio/client";
 import { DEV } from "esm-env";
-import type { FC } from "react";
 
 import { devMsg } from "./lib/devMsg.js";
 
@@ -10,8 +10,8 @@ export type PrismicTextProps = {
 	field: RichTextField | null | undefined;
 
 	/**
-	 * The string rendered when the field is empty. If a fallback is not given, `null` will be
-	 * rendered.
+	 * The string rendered when the field is empty. If a fallback is not given,
+	 * `null` will be rendered.
 	 */
 	fallback?: string;
 
@@ -23,9 +23,10 @@ export type PrismicTextProps = {
  * Renders content from a Prismic rich text field as plain text (no HTML).
  *
  * @example
- * 	```tsx
- * 	<PrismicText field={slice.primary.text} />;
- * 	```
+ *
+ * ```tsx
+ * <PrismicText field={slice.primary.text} />;
+ * ```
  *
  * @see Learn how to display rich text as plain text or React components: {@link https://prismic.io/docs/fields/rich-text}
  */