@prismicio/react/dist/PrismicTable.js

React components and hooks to fetch and present Prismic content

import { PrismicRichText } from "./PrismicRichText.js";
import { isFilled } from "@prismicio/client";
import { jsx, jsxs } from "react/jsx-runtime";
//#region src/PrismicTable.tsx
const defaultComponents = {
	table: ({ children }) => /* @__PURE__ */ jsx("table", { children }),
	thead: ({ children }) => /* @__PURE__ */ jsx("thead", { children }),
	tbody: ({ children }) => /* @__PURE__ */ jsx("tbody", { children }),
	tr: ({ children }) => /* @__PURE__ */ jsx("tr", { children }),
	th: ({ children }) => /* @__PURE__ */ jsx("th", { children }),
	td: ({ children }) => /* @__PURE__ */ jsx("td", { children })
};
/**
* Renders content from a Prismic table field as React components.
*
* @example
* 	```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}
*/
const PrismicTable = (props) => {
	const { field, components, fallback = null } = props;
	if (!isFilled.table(field)) return fallback;
	const { table: Table, thead: Thead, tbody: Tbody } = {
		...defaultComponents,
		...components
	};
	return /* @__PURE__ */ jsxs(Table, {
		table: field,
		children: [field.head && /* @__PURE__ */ jsx(Thead, {
			head: field.head,
			children: field.head.rows.map((row) => /* @__PURE__ */ jsx(TableRow, {
				row,
				components
			}, row.key))
		}), /* @__PURE__ */ jsx(Tbody, {
			body: field.body,
			children: field.body.rows.map((row) => /* @__PURE__ */ jsx(TableRow, {
				row,
				components
			}, row.key))
		})]
	});
};
function TableRow(props) {
	const { row, components } = props;
	const { tr: Tr, th: Th, td: Td } = {
		...defaultComponents,
		...components
	};
	return /* @__PURE__ */ jsx(Tr, {
		row,
		children: row.cells.map((cell) => cell.type === "header" ? /* @__PURE__ */ jsx(Th, {
			cell,
			children: /* @__PURE__ */ jsx(PrismicRichText, {
				field: cell.content,
				components
			})
		}, cell.key) : /* @__PURE__ */ jsx(Td, {
			cell,
			children: /* @__PURE__ */ jsx(PrismicRichText, {
				field: cell.content,
				components
			})
		}, cell.key))
	});
}
//#endregion
export { PrismicTable };

//# sourceMappingURL=PrismicTable.js.map