@prismicio/react 2.9.0 → 2.9.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/package.json.cjs +1 -1
- package/dist/package.json.js +1 -1
- package/dist/react-server/PrismicRichText.cjs +14 -9
- package/dist/react-server/PrismicRichText.cjs.map +1 -1
- package/dist/react-server/PrismicRichText.js +14 -9
- package/dist/react-server/PrismicRichText.js.map +1 -1
- package/package.json +1 -1
- package/src/react-server/PrismicRichText.tsx +52 -9
package/dist/package.json.cjs
CHANGED
package/dist/package.json.js
CHANGED
|
@@ -24,19 +24,24 @@ function _interopNamespaceDefault(e) {
|
|
|
24
24
|
}
|
|
25
25
|
const React__namespace = /* @__PURE__ */ _interopNamespaceDefault(React);
|
|
26
26
|
const prismicR__namespace = /* @__PURE__ */ _interopNamespaceDefault(prismicR);
|
|
27
|
+
const getDir = (node) => {
|
|
28
|
+
if ("direction" in node && node.direction === "rtl") {
|
|
29
|
+
return "rtl";
|
|
30
|
+
}
|
|
31
|
+
};
|
|
27
32
|
const createDefaultSerializer = (args) => prismicR__namespace.wrapMapSerializer({
|
|
28
|
-
heading1: ({ children, key }) => /* @__PURE__ */ jsxRuntime.jsx("h1", { children }, key),
|
|
29
|
-
heading2: ({ children, key }) => /* @__PURE__ */ jsxRuntime.jsx("h2", { children }, key),
|
|
30
|
-
heading3: ({ children, key }) => /* @__PURE__ */ jsxRuntime.jsx("h3", { children }, key),
|
|
31
|
-
heading4: ({ children, key }) => /* @__PURE__ */ jsxRuntime.jsx("h4", { children }, key),
|
|
32
|
-
heading5: ({ children, key }) => /* @__PURE__ */ jsxRuntime.jsx("h5", { children }, key),
|
|
33
|
-
heading6: ({ children, key }) => /* @__PURE__ */ jsxRuntime.jsx("h6", { children }, key),
|
|
34
|
-
paragraph: ({ children, key }) => /* @__PURE__ */ jsxRuntime.jsx("p", { children }, key),
|
|
33
|
+
heading1: ({ node, children, key }) => /* @__PURE__ */ jsxRuntime.jsx("h1", { dir: getDir(node), children }, key),
|
|
34
|
+
heading2: ({ node, children, key }) => /* @__PURE__ */ jsxRuntime.jsx("h2", { dir: getDir(node), children }, key),
|
|
35
|
+
heading3: ({ node, children, key }) => /* @__PURE__ */ jsxRuntime.jsx("h3", { dir: getDir(node), children }, key),
|
|
36
|
+
heading4: ({ node, children, key }) => /* @__PURE__ */ jsxRuntime.jsx("h4", { dir: getDir(node), children }, key),
|
|
37
|
+
heading5: ({ node, children, key }) => /* @__PURE__ */ jsxRuntime.jsx("h5", { dir: getDir(node), children }, key),
|
|
38
|
+
heading6: ({ node, children, key }) => /* @__PURE__ */ jsxRuntime.jsx("h6", { dir: getDir(node), children }, key),
|
|
39
|
+
paragraph: ({ node, children, key }) => /* @__PURE__ */ jsxRuntime.jsx("p", { dir: getDir(node), children }, key),
|
|
35
40
|
preformatted: ({ node, key }) => /* @__PURE__ */ jsxRuntime.jsx("pre", { children: node.text }, key),
|
|
36
41
|
strong: ({ children, key }) => /* @__PURE__ */ jsxRuntime.jsx("strong", { children }, key),
|
|
37
42
|
em: ({ children, key }) => /* @__PURE__ */ jsxRuntime.jsx("em", { children }, key),
|
|
38
|
-
listItem: ({ children, key }) => /* @__PURE__ */ jsxRuntime.jsx("li", { children }, key),
|
|
39
|
-
oListItem: ({ children, key }) => /* @__PURE__ */ jsxRuntime.jsx("li", { children }, key),
|
|
43
|
+
listItem: ({ node, children, key }) => /* @__PURE__ */ jsxRuntime.jsx("li", { dir: getDir(node), children }, key),
|
|
44
|
+
oListItem: ({ node, children, key }) => /* @__PURE__ */ jsxRuntime.jsx("li", { dir: getDir(node), children }, key),
|
|
40
45
|
list: ({ children, key }) => /* @__PURE__ */ jsxRuntime.jsx("ul", { children }, key),
|
|
41
46
|
oList: ({ children, key }) => /* @__PURE__ */ jsxRuntime.jsx("ol", { children }, key),
|
|
42
47
|
image: ({ node, key }) => {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"PrismicRichText.cjs","sources":["../../../src/react-server/PrismicRichText.tsx"],"sourcesContent":["import * as React from \"react\";\nimport * as prismic from \"@prismicio/client\";\nimport * as prismicR from \"@prismicio/richtext\";\n\nimport { JSXFunctionSerializer, JSXMapSerializer } from \"../types\";\nimport { LinkProps, PrismicLink } from \"./PrismicLink\";\nimport { devMsg } from \"../lib/devMsg\";\n\n/**\n * Props for `<PrismicRichText>`.\n */\nexport type PrismicRichTextProps<\n\t// eslint-disable-next-line @typescript-eslint/no-explicit-any\n\tLinkResolverFunction extends prismic.LinkResolverFunction<any> = prismic.LinkResolverFunction,\n> = {\n\t/**\n\t * The Prismic Rich Text field to render.\n\t */\n\tfield: prismic.RichTextField | null | undefined;\n\n\t/**\n\t * The Link Resolver used to resolve links.\n\t *\n\t * @remarks\n\t * If your app uses Route Resolvers when querying for your Prismic\n\t * repository's content, a Link Resolver does not need to be provided.\n\t * @see Learn about Link Resolvers and Route Resolvers {@link https://prismic.io/docs/core-concepts/link-resolver-route-resolver}\n\t */\n\tlinkResolver?: LinkResolverFunction;\n\n\t/**\n\t * A map or function that maps a Rich Text block to a React component.\n\t *\n\t * @remarks\n\t * Prefer using a map serializer over the function serializer when possible.\n\t * The map serializer is simpler to maintain.\n\t * @example A map serializer.\n\t *\n\t * ```jsx\n\t * {\n\t * heading1: ({children}) => <Heading>{children}</Heading>\n\t * }\n\t * ```\n\t *\n\t * @example A function serializer.\n\t *\n\t * ```jsx\n\t * (type, node, content, children) => {\n\t * \tswitch (type) {\n\t * \t\tcase \"heading1\": {\n\t * \t\t\treturn <Heading>{children}</Heading>;\n\t * \t\t}\n\t * \t}\n\t * };\n\t * ```\n\t */\n\tcomponents?: JSXMapSerializer | JSXFunctionSerializer;\n\n\t/**\n\t * The React component rendered for links when the URL is internal.\n\t *\n\t * @defaultValue `<a>`\n\t */\n\tinternalLinkComponent?: React.ComponentType<LinkProps>;\n\n\t/**\n\t * The React component rendered for links when the URL is external.\n\t *\n\t * @defaultValue `<a>`\n\t */\n\texternalLinkComponent?: React.ComponentType<LinkProps>;\n\n\t/**\n\t * The value to be rendered when the field is empty. If a fallback is not\n\t * given, `null` will be rendered.\n\t */\n\tfallback?: React.ReactNode;\n};\n\ntype CreateDefaultSerializerArgs<\n\t// eslint-disable-next-line @typescript-eslint/no-explicit-any\n\tLinkResolverFunction extends prismic.LinkResolverFunction<any> = prismic.LinkResolverFunction,\n> = {\n\tlinkResolver: LinkResolverFunction | undefined;\n\tinternalLinkComponent?: React.ComponentType<LinkProps>;\n\texternalLinkComponent?: React.ComponentType<LinkProps>;\n};\n\nconst createDefaultSerializer = <\n\t// eslint-disable-next-line @typescript-eslint/no-explicit-any\n\tLinkResolverFunction extends prismic.LinkResolverFunction<any>,\n>(\n\targs: CreateDefaultSerializerArgs<LinkResolverFunction>,\n): JSXFunctionSerializer =>\n\tprismicR.wrapMapSerializer({\n\t\theading1: ({ children, key }) => <h1 key={key}>{children}</h1>,\n\t\theading2: ({ children, key }) => <h2 key={key}>{children}</h2>,\n\t\theading3: ({ children, key }) => <h3 key={key}>{children}</h3>,\n\t\theading4: ({ children, key }) => <h4 key={key}>{children}</h4>,\n\t\theading5: ({ children, key }) => <h5 key={key}>{children}</h5>,\n\t\theading6: ({ children, key }) => <h6 key={key}>{children}</h6>,\n\t\tparagraph: ({ children, key }) => <p key={key}>{children}</p>,\n\t\tpreformatted: ({ node, key }) => <pre key={key}>{node.text}</pre>,\n\t\tstrong: ({ children, key }) => <strong key={key}>{children}</strong>,\n\t\tem: ({ children, key }) => <em key={key}>{children}</em>,\n\t\tlistItem: ({ children, key }) => <li key={key}>{children}</li>,\n\t\toListItem: ({ children, key }) => <li key={key}>{children}</li>,\n\t\tlist: ({ children, key }) => <ul key={key}>{children}</ul>,\n\t\toList: ({ children, key }) => <ol key={key}>{children}</ol>,\n\t\timage: ({ node, key }) => {\n\t\t\tconst img = (\n\t\t\t\t<img\n\t\t\t\t\tsrc={node.url}\n\t\t\t\t\talt={node.alt ?? undefined}\n\t\t\t\t\tdata-copyright={node.copyright ? node.copyright : undefined}\n\t\t\t\t/>\n\t\t\t);\n\n\t\t\treturn (\n\t\t\t\t<p key={key} className=\"block-img\">\n\t\t\t\t\t{node.linkTo ? (\n\t\t\t\t\t\t<PrismicLink\n\t\t\t\t\t\t\tlinkResolver={args.linkResolver}\n\t\t\t\t\t\t\tinternalComponent={args.internalLinkComponent}\n\t\t\t\t\t\t\texternalComponent={args.externalLinkComponent}\n\t\t\t\t\t\t\tfield={node.linkTo}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t{img}\n\t\t\t\t\t\t</PrismicLink>\n\t\t\t\t\t) : (\n\t\t\t\t\t\timg\n\t\t\t\t\t)}\n\t\t\t\t</p>\n\t\t\t);\n\t\t},\n\t\tembed: ({ node, key }) => (\n\t\t\t<div\n\t\t\t\tkey={key}\n\t\t\t\tdata-oembed={node.oembed.embed_url}\n\t\t\t\tdata-oembed-type={node.oembed.type}\n\t\t\t\tdata-oembed-provider={node.oembed.provider_name}\n\t\t\t\tdangerouslySetInnerHTML={{ __html: node.oembed.html ?? \"\" }}\n\t\t\t/>\n\t\t),\n\t\thyperlink: ({ node, children, key }) => (\n\t\t\t<PrismicLink\n\t\t\t\tkey={key}\n\t\t\t\tfield={node.data}\n\t\t\t\tlinkResolver={args.linkResolver}\n\t\t\t\tinternalComponent={args.internalLinkComponent}\n\t\t\t\texternalComponent={args.externalLinkComponent}\n\t\t\t>\n\t\t\t\t{children}\n\t\t\t</PrismicLink>\n\t\t),\n\t\tlabel: ({ node, children, key }) => (\n\t\t\t<span key={key} className={node.data.label}>\n\t\t\t\t{children}\n\t\t\t</span>\n\t\t),\n\t\tspan: ({ text, key }) => {\n\t\t\tconst result: React.ReactNode[] = [];\n\n\t\t\tlet i = 0;\n\t\t\tfor (const line of text.split(\"\\n\")) {\n\t\t\t\tif (i > 0) {\n\t\t\t\t\tresult.push(<br key={`${i}__break`} />);\n\t\t\t\t}\n\n\t\t\t\tresult.push(<React.Fragment key={`${i}__line`}>{line}</React.Fragment>);\n\n\t\t\t\ti++;\n\t\t\t}\n\n\t\t\treturn <React.Fragment key={key}>{result}</React.Fragment>;\n\t\t},\n\t});\n\n/**\n * React component that renders content from a Prismic Rich Text field. By\n * default, HTML elements are rendered for each piece of content. A `heading1`\n * block will render an `<h1>` HTML element, for example. Links will use\n * `<PrismicLink>` by default which can be customized using the\n * `internalLinkComponent` and `externalLinkComponent` props.\n *\n * To customize the components that are rendered, provide a map or function\n * serializer to the `components` prop.\n *\n * @remarks\n * This component returns a React fragment with no wrapping element around the\n * content. If you need a wrapper, add a component around `<PrismicRichText>`.\n * @example Rendering a Rich Text field using the default HTMl elements.\n *\n * ```jsx\n * <PrismicRichText field={document.data.content} />;\n * ```\n *\n * @example Rendering a Rich Text field using a custom set of React components.\n *\n * ```jsx\n * <PrismicRichText\n * \tfield={document.data.content}\n * \tcomponents={{\n * \t\theading1: ({ children }) => <Heading>{children}</Heading>,\n * \t}}\n * />;\n * ```\n *\n * @param props - Props for the component.\n *\n * @returns The Rich Text field's content as React components.\n *\n * @see Learn about Rich Text fields {@link https://prismic.io/docs/core-concepts/rich-text-title}\n * @see Learn about Rich Text serializers {@link https://prismic.io/docs/core-concepts/html-serializer}\n */\nexport function PrismicRichText<\n\t// eslint-disable-next-line @typescript-eslint/no-explicit-any\n\tLinkResolverFunction extends prismic.LinkResolverFunction<any>,\n>({\n\tlinkResolver,\n\tfield,\n\tfallback,\n\tcomponents,\n\texternalLinkComponent,\n\tinternalLinkComponent,\n\t...restProps\n}: PrismicRichTextProps<LinkResolverFunction>): JSX.Element | null {\n\treturn React.useMemo(() => {\n\t\tif (\n\t\t\ttypeof process !== \"undefined\" &&\n\t\t\tprocess.env.NODE_ENV === \"development\"\n\t\t) {\n\t\t\tif (\"className\" in restProps) {\n\t\t\t\tconsole.warn(\n\t\t\t\t\t`[PrismicRichText] className cannot be passed to <PrismicRichText> since it renders an array without a wrapping component. For more details, see ${devMsg(\n\t\t\t\t\t\t\"classname-is-not-a-valid-prop\",\n\t\t\t\t\t)}.`,\n\t\t\t\t\tfield,\n\t\t\t\t);\n\t\t\t}\n\t\t}\n\n\t\tif (prismic.isFilled.richText(field)) {\n\t\t\tconst serializer = prismicR.composeSerializers(\n\t\t\t\ttypeof components === \"object\"\n\t\t\t\t\t? prismicR.wrapMapSerializer(components)\n\t\t\t\t\t: components,\n\t\t\t\tcreateDefaultSerializer({\n\t\t\t\t\tlinkResolver,\n\t\t\t\t\tinternalLinkComponent,\n\t\t\t\t\texternalLinkComponent,\n\t\t\t\t}),\n\t\t\t);\n\n\t\t\t// The serializer is wrapped in a higher-order function\n\t\t\t// that automatically applies a key to React Elements\n\t\t\t// if one is not already given.\n\t\t\tconst serialized = prismicR.serialize<JSX.Element>(\n\t\t\t\tfield,\n\t\t\t\t(type, node, text, children, key) => {\n\t\t\t\t\tconst result = serializer(type, node, text, children, key);\n\n\t\t\t\t\tif (React.isValidElement(result) && result.key == null) {\n\t\t\t\t\t\treturn React.cloneElement(result, { key });\n\t\t\t\t\t} else {\n\t\t\t\t\t\treturn result;\n\t\t\t\t\t}\n\t\t\t\t},\n\t\t\t);\n\n\t\t\treturn <>{serialized}</>;\n\t\t} else {\n\t\t\treturn fallback != null ? <>{fallback}</> : null;\n\t\t}\n\t}, [\n\t\tfield,\n\t\tinternalLinkComponent,\n\t\texternalLinkComponent,\n\t\tcomponents,\n\t\tlinkResolver,\n\t\tfallback,\n\t]);\n}\n"],"names":["prismicR","jsx","PrismicLink","React","devMsg","prismic.isFilled.richText","Fragment"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"PrismicRichText.cjs","sources":["../../../src/react-server/PrismicRichText.tsx"],"sourcesContent":["import * as React from \"react\";\nimport * as prismic from \"@prismicio/client\";\nimport * as prismicR from \"@prismicio/richtext\";\nimport * as prismicT from \"@prismicio/types\";\n\nimport { JSXFunctionSerializer, JSXMapSerializer } from \"../types\";\nimport { LinkProps, PrismicLink } from \"./PrismicLink\";\nimport { devMsg } from \"../lib/devMsg\";\n\n/**\n * Props for `<PrismicRichText>`.\n */\nexport type PrismicRichTextProps<\n\t// eslint-disable-next-line @typescript-eslint/no-explicit-any\n\tLinkResolverFunction extends prismic.LinkResolverFunction<any> = prismic.LinkResolverFunction,\n> = {\n\t/**\n\t * The Prismic Rich Text field to render.\n\t */\n\tfield: prismic.RichTextField | null | undefined;\n\n\t/**\n\t * The Link Resolver used to resolve links.\n\t *\n\t * @remarks\n\t * If your app uses Route Resolvers when querying for your Prismic\n\t * repository's content, a Link Resolver does not need to be provided.\n\t * @see Learn about Link Resolvers and Route Resolvers {@link https://prismic.io/docs/core-concepts/link-resolver-route-resolver}\n\t */\n\tlinkResolver?: LinkResolverFunction;\n\n\t/**\n\t * A map or function that maps a Rich Text block to a React component.\n\t *\n\t * @remarks\n\t * Prefer using a map serializer over the function serializer when possible.\n\t * The map serializer is simpler to maintain.\n\t * @example A map serializer.\n\t *\n\t * ```jsx\n\t * {\n\t * heading1: ({children}) => <Heading>{children}</Heading>\n\t * }\n\t * ```\n\t *\n\t * @example A function serializer.\n\t *\n\t * ```jsx\n\t * (type, node, content, children) => {\n\t * \tswitch (type) {\n\t * \t\tcase \"heading1\": {\n\t * \t\t\treturn <Heading>{children}</Heading>;\n\t * \t\t}\n\t * \t}\n\t * };\n\t * ```\n\t */\n\tcomponents?: JSXMapSerializer | JSXFunctionSerializer;\n\n\t/**\n\t * The React component rendered for links when the URL is internal.\n\t *\n\t * @defaultValue `<a>`\n\t */\n\tinternalLinkComponent?: React.ComponentType<LinkProps>;\n\n\t/**\n\t * The React component rendered for links when the URL is external.\n\t *\n\t * @defaultValue `<a>`\n\t */\n\texternalLinkComponent?: React.ComponentType<LinkProps>;\n\n\t/**\n\t * The value to be rendered when the field is empty. If a fallback is not\n\t * given, `null` will be rendered.\n\t */\n\tfallback?: React.ReactNode;\n};\n\ntype CreateDefaultSerializerArgs<\n\t// eslint-disable-next-line @typescript-eslint/no-explicit-any\n\tLinkResolverFunction extends prismic.LinkResolverFunction<any> = prismic.LinkResolverFunction,\n> = {\n\tlinkResolver: LinkResolverFunction | undefined;\n\tinternalLinkComponent?: React.ComponentType<LinkProps>;\n\texternalLinkComponent?: React.ComponentType<LinkProps>;\n};\n\nconst getDir = (node: prismicT.RTAnyNode): \"rtl\" | undefined => {\n\tif (\"direction\" in node && node.direction === \"rtl\") {\n\t\treturn \"rtl\";\n\t}\n};\n\nconst createDefaultSerializer = <\n\t// eslint-disable-next-line @typescript-eslint/no-explicit-any\n\tLinkResolverFunction extends prismic.LinkResolverFunction<any>,\n>(\n\targs: CreateDefaultSerializerArgs<LinkResolverFunction>,\n): JSXFunctionSerializer =>\n\tprismicR.wrapMapSerializer({\n\t\theading1: ({ node, children, key }) => (\n\t\t\t<h1 key={key} dir={getDir(node)}>\n\t\t\t\t{children}\n\t\t\t</h1>\n\t\t),\n\t\theading2: ({ node, children, key }) => (\n\t\t\t<h2 key={key} dir={getDir(node)}>\n\t\t\t\t{children}\n\t\t\t</h2>\n\t\t),\n\t\theading3: ({ node, children, key }) => (\n\t\t\t<h3 key={key} dir={getDir(node)}>\n\t\t\t\t{children}\n\t\t\t</h3>\n\t\t),\n\t\theading4: ({ node, children, key }) => (\n\t\t\t<h4 key={key} dir={getDir(node)}>\n\t\t\t\t{children}\n\t\t\t</h4>\n\t\t),\n\t\theading5: ({ node, children, key }) => (\n\t\t\t<h5 key={key} dir={getDir(node)}>\n\t\t\t\t{children}\n\t\t\t</h5>\n\t\t),\n\t\theading6: ({ node, children, key }) => (\n\t\t\t<h6 key={key} dir={getDir(node)}>\n\t\t\t\t{children}\n\t\t\t</h6>\n\t\t),\n\t\tparagraph: ({ node, children, key }) => (\n\t\t\t<p key={key} dir={getDir(node)}>\n\t\t\t\t{children}\n\t\t\t</p>\n\t\t),\n\t\tpreformatted: ({ node, key }) => <pre key={key}>{node.text}</pre>,\n\t\tstrong: ({ children, key }) => <strong key={key}>{children}</strong>,\n\t\tem: ({ children, key }) => <em key={key}>{children}</em>,\n\t\tlistItem: ({ node, children, key }) => (\n\t\t\t<li key={key} dir={getDir(node)}>\n\t\t\t\t{children}\n\t\t\t</li>\n\t\t),\n\t\toListItem: ({ node, children, key }) => (\n\t\t\t<li key={key} dir={getDir(node)}>\n\t\t\t\t{children}\n\t\t\t</li>\n\t\t),\n\t\tlist: ({ children, key }) => <ul key={key}>{children}</ul>,\n\t\toList: ({ children, key }) => <ol key={key}>{children}</ol>,\n\t\timage: ({ node, key }) => {\n\t\t\tconst img = (\n\t\t\t\t<img\n\t\t\t\t\tsrc={node.url}\n\t\t\t\t\talt={node.alt ?? undefined}\n\t\t\t\t\tdata-copyright={node.copyright ? node.copyright : undefined}\n\t\t\t\t/>\n\t\t\t);\n\n\t\t\treturn (\n\t\t\t\t<p key={key} className=\"block-img\">\n\t\t\t\t\t{node.linkTo ? (\n\t\t\t\t\t\t<PrismicLink\n\t\t\t\t\t\t\tlinkResolver={args.linkResolver}\n\t\t\t\t\t\t\tinternalComponent={args.internalLinkComponent}\n\t\t\t\t\t\t\texternalComponent={args.externalLinkComponent}\n\t\t\t\t\t\t\tfield={node.linkTo}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t{img}\n\t\t\t\t\t\t</PrismicLink>\n\t\t\t\t\t) : (\n\t\t\t\t\t\timg\n\t\t\t\t\t)}\n\t\t\t\t</p>\n\t\t\t);\n\t\t},\n\t\tembed: ({ node, key }) => (\n\t\t\t<div\n\t\t\t\tkey={key}\n\t\t\t\tdata-oembed={node.oembed.embed_url}\n\t\t\t\tdata-oembed-type={node.oembed.type}\n\t\t\t\tdata-oembed-provider={node.oembed.provider_name}\n\t\t\t\tdangerouslySetInnerHTML={{ __html: node.oembed.html ?? \"\" }}\n\t\t\t/>\n\t\t),\n\t\thyperlink: ({ node, children, key }) => (\n\t\t\t<PrismicLink\n\t\t\t\tkey={key}\n\t\t\t\tfield={node.data}\n\t\t\t\tlinkResolver={args.linkResolver}\n\t\t\t\tinternalComponent={args.internalLinkComponent}\n\t\t\t\texternalComponent={args.externalLinkComponent}\n\t\t\t>\n\t\t\t\t{children}\n\t\t\t</PrismicLink>\n\t\t),\n\t\tlabel: ({ node, children, key }) => (\n\t\t\t<span key={key} className={node.data.label}>\n\t\t\t\t{children}\n\t\t\t</span>\n\t\t),\n\t\tspan: ({ text, key }) => {\n\t\t\tconst result: React.ReactNode[] = [];\n\n\t\t\tlet i = 0;\n\t\t\tfor (const line of text.split(\"\\n\")) {\n\t\t\t\tif (i > 0) {\n\t\t\t\t\tresult.push(<br key={`${i}__break`} />);\n\t\t\t\t}\n\n\t\t\t\tresult.push(<React.Fragment key={`${i}__line`}>{line}</React.Fragment>);\n\n\t\t\t\ti++;\n\t\t\t}\n\n\t\t\treturn <React.Fragment key={key}>{result}</React.Fragment>;\n\t\t},\n\t});\n\n/**\n * React component that renders content from a Prismic Rich Text field. By\n * default, HTML elements are rendered for each piece of content. A `heading1`\n * block will render an `<h1>` HTML element, for example. Links will use\n * `<PrismicLink>` by default which can be customized using the\n * `internalLinkComponent` and `externalLinkComponent` props.\n *\n * To customize the components that are rendered, provide a map or function\n * serializer to the `components` prop.\n *\n * @remarks\n * This component returns a React fragment with no wrapping element around the\n * content. If you need a wrapper, add a component around `<PrismicRichText>`.\n * @example Rendering a Rich Text field using the default HTMl elements.\n *\n * ```jsx\n * <PrismicRichText field={document.data.content} />;\n * ```\n *\n * @example Rendering a Rich Text field using a custom set of React components.\n *\n * ```jsx\n * <PrismicRichText\n * \tfield={document.data.content}\n * \tcomponents={{\n * \t\theading1: ({ children }) => <Heading>{children}</Heading>,\n * \t}}\n * />;\n * ```\n *\n * @param props - Props for the component.\n *\n * @returns The Rich Text field's content as React components.\n *\n * @see Learn about Rich Text fields {@link https://prismic.io/docs/core-concepts/rich-text-title}\n * @see Learn about Rich Text serializers {@link https://prismic.io/docs/core-concepts/html-serializer}\n */\nexport function PrismicRichText<\n\t// eslint-disable-next-line @typescript-eslint/no-explicit-any\n\tLinkResolverFunction extends prismic.LinkResolverFunction<any>,\n>({\n\tlinkResolver,\n\tfield,\n\tfallback,\n\tcomponents,\n\texternalLinkComponent,\n\tinternalLinkComponent,\n\t...restProps\n}: PrismicRichTextProps<LinkResolverFunction>): JSX.Element | null {\n\treturn React.useMemo(() => {\n\t\tif (\n\t\t\ttypeof process !== \"undefined\" &&\n\t\t\tprocess.env.NODE_ENV === \"development\"\n\t\t) {\n\t\t\tif (\"className\" in restProps) {\n\t\t\t\tconsole.warn(\n\t\t\t\t\t`[PrismicRichText] className cannot be passed to <PrismicRichText> since it renders an array without a wrapping component. For more details, see ${devMsg(\n\t\t\t\t\t\t\"classname-is-not-a-valid-prop\",\n\t\t\t\t\t)}.`,\n\t\t\t\t\tfield,\n\t\t\t\t);\n\t\t\t}\n\t\t}\n\n\t\tif (prismic.isFilled.richText(field)) {\n\t\t\tconst serializer = prismicR.composeSerializers(\n\t\t\t\ttypeof components === \"object\"\n\t\t\t\t\t? prismicR.wrapMapSerializer(components)\n\t\t\t\t\t: components,\n\t\t\t\tcreateDefaultSerializer({\n\t\t\t\t\tlinkResolver,\n\t\t\t\t\tinternalLinkComponent,\n\t\t\t\t\texternalLinkComponent,\n\t\t\t\t}),\n\t\t\t);\n\n\t\t\t// The serializer is wrapped in a higher-order function\n\t\t\t// that automatically applies a key to React Elements\n\t\t\t// if one is not already given.\n\t\t\tconst serialized = prismicR.serialize<JSX.Element>(\n\t\t\t\tfield,\n\t\t\t\t(type, node, text, children, key) => {\n\t\t\t\t\tconst result = serializer(type, node, text, children, key);\n\n\t\t\t\t\tif (React.isValidElement(result) && result.key == null) {\n\t\t\t\t\t\treturn React.cloneElement(result, { key });\n\t\t\t\t\t} else {\n\t\t\t\t\t\treturn result;\n\t\t\t\t\t}\n\t\t\t\t},\n\t\t\t);\n\n\t\t\treturn <>{serialized}</>;\n\t\t} else {\n\t\t\treturn fallback != null ? <>{fallback}</> : null;\n\t\t}\n\t}, [\n\t\tfield,\n\t\tinternalLinkComponent,\n\t\texternalLinkComponent,\n\t\tcomponents,\n\t\tlinkResolver,\n\t\tfallback,\n\t]);\n}\n"],"names":["prismicR","jsx","PrismicLink","React","devMsg","prismic.isFilled.richText","Fragment"],"mappings":"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"}
|
|
@@ -4,19 +4,24 @@ import * as prismicR from "@prismicio/richtext";
|
|
|
4
4
|
import { PrismicLink } from "./PrismicLink.js";
|
|
5
5
|
import { devMsg } from "../lib/devMsg.js";
|
|
6
6
|
import { richText } from './../_node_modules/@prismicio/client/dist/helpers/isFilled.js';
|
|
7
|
+
const getDir = (node) => {
|
|
8
|
+
if ("direction" in node && node.direction === "rtl") {
|
|
9
|
+
return "rtl";
|
|
10
|
+
}
|
|
11
|
+
};
|
|
7
12
|
const createDefaultSerializer = (args) => prismicR.wrapMapSerializer({
|
|
8
|
-
heading1: ({ children, key }) => /* @__PURE__ */ jsx("h1", { children }, key),
|
|
9
|
-
heading2: ({ children, key }) => /* @__PURE__ */ jsx("h2", { children }, key),
|
|
10
|
-
heading3: ({ children, key }) => /* @__PURE__ */ jsx("h3", { children }, key),
|
|
11
|
-
heading4: ({ children, key }) => /* @__PURE__ */ jsx("h4", { children }, key),
|
|
12
|
-
heading5: ({ children, key }) => /* @__PURE__ */ jsx("h5", { children }, key),
|
|
13
|
-
heading6: ({ children, key }) => /* @__PURE__ */ jsx("h6", { children }, key),
|
|
14
|
-
paragraph: ({ children, key }) => /* @__PURE__ */ jsx("p", { children }, key),
|
|
13
|
+
heading1: ({ node, children, key }) => /* @__PURE__ */ jsx("h1", { dir: getDir(node), children }, key),
|
|
14
|
+
heading2: ({ node, children, key }) => /* @__PURE__ */ jsx("h2", { dir: getDir(node), children }, key),
|
|
15
|
+
heading3: ({ node, children, key }) => /* @__PURE__ */ jsx("h3", { dir: getDir(node), children }, key),
|
|
16
|
+
heading4: ({ node, children, key }) => /* @__PURE__ */ jsx("h4", { dir: getDir(node), children }, key),
|
|
17
|
+
heading5: ({ node, children, key }) => /* @__PURE__ */ jsx("h5", { dir: getDir(node), children }, key),
|
|
18
|
+
heading6: ({ node, children, key }) => /* @__PURE__ */ jsx("h6", { dir: getDir(node), children }, key),
|
|
19
|
+
paragraph: ({ node, children, key }) => /* @__PURE__ */ jsx("p", { dir: getDir(node), children }, key),
|
|
15
20
|
preformatted: ({ node, key }) => /* @__PURE__ */ jsx("pre", { children: node.text }, key),
|
|
16
21
|
strong: ({ children, key }) => /* @__PURE__ */ jsx("strong", { children }, key),
|
|
17
22
|
em: ({ children, key }) => /* @__PURE__ */ jsx("em", { children }, key),
|
|
18
|
-
listItem: ({ children, key }) => /* @__PURE__ */ jsx("li", { children }, key),
|
|
19
|
-
oListItem: ({ children, key }) => /* @__PURE__ */ jsx("li", { children }, key),
|
|
23
|
+
listItem: ({ node, children, key }) => /* @__PURE__ */ jsx("li", { dir: getDir(node), children }, key),
|
|
24
|
+
oListItem: ({ node, children, key }) => /* @__PURE__ */ jsx("li", { dir: getDir(node), children }, key),
|
|
20
25
|
list: ({ children, key }) => /* @__PURE__ */ jsx("ul", { children }, key),
|
|
21
26
|
oList: ({ children, key }) => /* @__PURE__ */ jsx("ol", { children }, key),
|
|
22
27
|
image: ({ node, key }) => {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"PrismicRichText.js","sources":["../../../src/react-server/PrismicRichText.tsx"],"sourcesContent":["import * as React from \"react\";\nimport * as prismic from \"@prismicio/client\";\nimport * as prismicR from \"@prismicio/richtext\";\n\nimport { JSXFunctionSerializer, JSXMapSerializer } from \"../types\";\nimport { LinkProps, PrismicLink } from \"./PrismicLink\";\nimport { devMsg } from \"../lib/devMsg\";\n\n/**\n * Props for `<PrismicRichText>`.\n */\nexport type PrismicRichTextProps<\n\t// eslint-disable-next-line @typescript-eslint/no-explicit-any\n\tLinkResolverFunction extends prismic.LinkResolverFunction<any> = prismic.LinkResolverFunction,\n> = {\n\t/**\n\t * The Prismic Rich Text field to render.\n\t */\n\tfield: prismic.RichTextField | null | undefined;\n\n\t/**\n\t * The Link Resolver used to resolve links.\n\t *\n\t * @remarks\n\t * If your app uses Route Resolvers when querying for your Prismic\n\t * repository's content, a Link Resolver does not need to be provided.\n\t * @see Learn about Link Resolvers and Route Resolvers {@link https://prismic.io/docs/core-concepts/link-resolver-route-resolver}\n\t */\n\tlinkResolver?: LinkResolverFunction;\n\n\t/**\n\t * A map or function that maps a Rich Text block to a React component.\n\t *\n\t * @remarks\n\t * Prefer using a map serializer over the function serializer when possible.\n\t * The map serializer is simpler to maintain.\n\t * @example A map serializer.\n\t *\n\t * ```jsx\n\t * {\n\t * heading1: ({children}) => <Heading>{children}</Heading>\n\t * }\n\t * ```\n\t *\n\t * @example A function serializer.\n\t *\n\t * ```jsx\n\t * (type, node, content, children) => {\n\t * \tswitch (type) {\n\t * \t\tcase \"heading1\": {\n\t * \t\t\treturn <Heading>{children}</Heading>;\n\t * \t\t}\n\t * \t}\n\t * };\n\t * ```\n\t */\n\tcomponents?: JSXMapSerializer | JSXFunctionSerializer;\n\n\t/**\n\t * The React component rendered for links when the URL is internal.\n\t *\n\t * @defaultValue `<a>`\n\t */\n\tinternalLinkComponent?: React.ComponentType<LinkProps>;\n\n\t/**\n\t * The React component rendered for links when the URL is external.\n\t *\n\t * @defaultValue `<a>`\n\t */\n\texternalLinkComponent?: React.ComponentType<LinkProps>;\n\n\t/**\n\t * The value to be rendered when the field is empty. If a fallback is not\n\t * given, `null` will be rendered.\n\t */\n\tfallback?: React.ReactNode;\n};\n\ntype CreateDefaultSerializerArgs<\n\t// eslint-disable-next-line @typescript-eslint/no-explicit-any\n\tLinkResolverFunction extends prismic.LinkResolverFunction<any> = prismic.LinkResolverFunction,\n> = {\n\tlinkResolver: LinkResolverFunction | undefined;\n\tinternalLinkComponent?: React.ComponentType<LinkProps>;\n\texternalLinkComponent?: React.ComponentType<LinkProps>;\n};\n\nconst createDefaultSerializer = <\n\t// eslint-disable-next-line @typescript-eslint/no-explicit-any\n\tLinkResolverFunction extends prismic.LinkResolverFunction<any>,\n>(\n\targs: CreateDefaultSerializerArgs<LinkResolverFunction>,\n): JSXFunctionSerializer =>\n\tprismicR.wrapMapSerializer({\n\t\theading1: ({ children, key }) => <h1 key={key}>{children}</h1>,\n\t\theading2: ({ children, key }) => <h2 key={key}>{children}</h2>,\n\t\theading3: ({ children, key }) => <h3 key={key}>{children}</h3>,\n\t\theading4: ({ children, key }) => <h4 key={key}>{children}</h4>,\n\t\theading5: ({ children, key }) => <h5 key={key}>{children}</h5>,\n\t\theading6: ({ children, key }) => <h6 key={key}>{children}</h6>,\n\t\tparagraph: ({ children, key }) => <p key={key}>{children}</p>,\n\t\tpreformatted: ({ node, key }) => <pre key={key}>{node.text}</pre>,\n\t\tstrong: ({ children, key }) => <strong key={key}>{children}</strong>,\n\t\tem: ({ children, key }) => <em key={key}>{children}</em>,\n\t\tlistItem: ({ children, key }) => <li key={key}>{children}</li>,\n\t\toListItem: ({ children, key }) => <li key={key}>{children}</li>,\n\t\tlist: ({ children, key }) => <ul key={key}>{children}</ul>,\n\t\toList: ({ children, key }) => <ol key={key}>{children}</ol>,\n\t\timage: ({ node, key }) => {\n\t\t\tconst img = (\n\t\t\t\t<img\n\t\t\t\t\tsrc={node.url}\n\t\t\t\t\talt={node.alt ?? undefined}\n\t\t\t\t\tdata-copyright={node.copyright ? node.copyright : undefined}\n\t\t\t\t/>\n\t\t\t);\n\n\t\t\treturn (\n\t\t\t\t<p key={key} className=\"block-img\">\n\t\t\t\t\t{node.linkTo ? (\n\t\t\t\t\t\t<PrismicLink\n\t\t\t\t\t\t\tlinkResolver={args.linkResolver}\n\t\t\t\t\t\t\tinternalComponent={args.internalLinkComponent}\n\t\t\t\t\t\t\texternalComponent={args.externalLinkComponent}\n\t\t\t\t\t\t\tfield={node.linkTo}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t{img}\n\t\t\t\t\t\t</PrismicLink>\n\t\t\t\t\t) : (\n\t\t\t\t\t\timg\n\t\t\t\t\t)}\n\t\t\t\t</p>\n\t\t\t);\n\t\t},\n\t\tembed: ({ node, key }) => (\n\t\t\t<div\n\t\t\t\tkey={key}\n\t\t\t\tdata-oembed={node.oembed.embed_url}\n\t\t\t\tdata-oembed-type={node.oembed.type}\n\t\t\t\tdata-oembed-provider={node.oembed.provider_name}\n\t\t\t\tdangerouslySetInnerHTML={{ __html: node.oembed.html ?? \"\" }}\n\t\t\t/>\n\t\t),\n\t\thyperlink: ({ node, children, key }) => (\n\t\t\t<PrismicLink\n\t\t\t\tkey={key}\n\t\t\t\tfield={node.data}\n\t\t\t\tlinkResolver={args.linkResolver}\n\t\t\t\tinternalComponent={args.internalLinkComponent}\n\t\t\t\texternalComponent={args.externalLinkComponent}\n\t\t\t>\n\t\t\t\t{children}\n\t\t\t</PrismicLink>\n\t\t),\n\t\tlabel: ({ node, children, key }) => (\n\t\t\t<span key={key} className={node.data.label}>\n\t\t\t\t{children}\n\t\t\t</span>\n\t\t),\n\t\tspan: ({ text, key }) => {\n\t\t\tconst result: React.ReactNode[] = [];\n\n\t\t\tlet i = 0;\n\t\t\tfor (const line of text.split(\"\\n\")) {\n\t\t\t\tif (i > 0) {\n\t\t\t\t\tresult.push(<br key={`${i}__break`} />);\n\t\t\t\t}\n\n\t\t\t\tresult.push(<React.Fragment key={`${i}__line`}>{line}</React.Fragment>);\n\n\t\t\t\ti++;\n\t\t\t}\n\n\t\t\treturn <React.Fragment key={key}>{result}</React.Fragment>;\n\t\t},\n\t});\n\n/**\n * React component that renders content from a Prismic Rich Text field. By\n * default, HTML elements are rendered for each piece of content. A `heading1`\n * block will render an `<h1>` HTML element, for example. Links will use\n * `<PrismicLink>` by default which can be customized using the\n * `internalLinkComponent` and `externalLinkComponent` props.\n *\n * To customize the components that are rendered, provide a map or function\n * serializer to the `components` prop.\n *\n * @remarks\n * This component returns a React fragment with no wrapping element around the\n * content. If you need a wrapper, add a component around `<PrismicRichText>`.\n * @example Rendering a Rich Text field using the default HTMl elements.\n *\n * ```jsx\n * <PrismicRichText field={document.data.content} />;\n * ```\n *\n * @example Rendering a Rich Text field using a custom set of React components.\n *\n * ```jsx\n * <PrismicRichText\n * \tfield={document.data.content}\n * \tcomponents={{\n * \t\theading1: ({ children }) => <Heading>{children}</Heading>,\n * \t}}\n * />;\n * ```\n *\n * @param props - Props for the component.\n *\n * @returns The Rich Text field's content as React components.\n *\n * @see Learn about Rich Text fields {@link https://prismic.io/docs/core-concepts/rich-text-title}\n * @see Learn about Rich Text serializers {@link https://prismic.io/docs/core-concepts/html-serializer}\n */\nexport function PrismicRichText<\n\t// eslint-disable-next-line @typescript-eslint/no-explicit-any\n\tLinkResolverFunction extends prismic.LinkResolverFunction<any>,\n>({\n\tlinkResolver,\n\tfield,\n\tfallback,\n\tcomponents,\n\texternalLinkComponent,\n\tinternalLinkComponent,\n\t...restProps\n}: PrismicRichTextProps<LinkResolverFunction>): JSX.Element | null {\n\treturn React.useMemo(() => {\n\t\tif (\n\t\t\ttypeof process !== \"undefined\" &&\n\t\t\tprocess.env.NODE_ENV === \"development\"\n\t\t) {\n\t\t\tif (\"className\" in restProps) {\n\t\t\t\tconsole.warn(\n\t\t\t\t\t`[PrismicRichText] className cannot be passed to <PrismicRichText> since it renders an array without a wrapping component. For more details, see ${devMsg(\n\t\t\t\t\t\t\"classname-is-not-a-valid-prop\",\n\t\t\t\t\t)}.`,\n\t\t\t\t\tfield,\n\t\t\t\t);\n\t\t\t}\n\t\t}\n\n\t\tif (prismic.isFilled.richText(field)) {\n\t\t\tconst serializer = prismicR.composeSerializers(\n\t\t\t\ttypeof components === \"object\"\n\t\t\t\t\t? prismicR.wrapMapSerializer(components)\n\t\t\t\t\t: components,\n\t\t\t\tcreateDefaultSerializer({\n\t\t\t\t\tlinkResolver,\n\t\t\t\t\tinternalLinkComponent,\n\t\t\t\t\texternalLinkComponent,\n\t\t\t\t}),\n\t\t\t);\n\n\t\t\t// The serializer is wrapped in a higher-order function\n\t\t\t// that automatically applies a key to React Elements\n\t\t\t// if one is not already given.\n\t\t\tconst serialized = prismicR.serialize<JSX.Element>(\n\t\t\t\tfield,\n\t\t\t\t(type, node, text, children, key) => {\n\t\t\t\t\tconst result = serializer(type, node, text, children, key);\n\n\t\t\t\t\tif (React.isValidElement(result) && result.key == null) {\n\t\t\t\t\t\treturn React.cloneElement(result, { key });\n\t\t\t\t\t} else {\n\t\t\t\t\t\treturn result;\n\t\t\t\t\t}\n\t\t\t\t},\n\t\t\t);\n\n\t\t\treturn <>{serialized}</>;\n\t\t} else {\n\t\t\treturn fallback != null ? <>{fallback}</> : null;\n\t\t}\n\t}, [\n\t\tfield,\n\t\tinternalLinkComponent,\n\t\texternalLinkComponent,\n\t\tcomponents,\n\t\tlinkResolver,\n\t\tfallback,\n\t]);\n}\n"],"names":["prismic.isFilled.richText"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"PrismicRichText.js","sources":["../../../src/react-server/PrismicRichText.tsx"],"sourcesContent":["import * as React from \"react\";\nimport * as prismic from \"@prismicio/client\";\nimport * as prismicR from \"@prismicio/richtext\";\nimport * as prismicT from \"@prismicio/types\";\n\nimport { JSXFunctionSerializer, JSXMapSerializer } from \"../types\";\nimport { LinkProps, PrismicLink } from \"./PrismicLink\";\nimport { devMsg } from \"../lib/devMsg\";\n\n/**\n * Props for `<PrismicRichText>`.\n */\nexport type PrismicRichTextProps<\n\t// eslint-disable-next-line @typescript-eslint/no-explicit-any\n\tLinkResolverFunction extends prismic.LinkResolverFunction<any> = prismic.LinkResolverFunction,\n> = {\n\t/**\n\t * The Prismic Rich Text field to render.\n\t */\n\tfield: prismic.RichTextField | null | undefined;\n\n\t/**\n\t * The Link Resolver used to resolve links.\n\t *\n\t * @remarks\n\t * If your app uses Route Resolvers when querying for your Prismic\n\t * repository's content, a Link Resolver does not need to be provided.\n\t * @see Learn about Link Resolvers and Route Resolvers {@link https://prismic.io/docs/core-concepts/link-resolver-route-resolver}\n\t */\n\tlinkResolver?: LinkResolverFunction;\n\n\t/**\n\t * A map or function that maps a Rich Text block to a React component.\n\t *\n\t * @remarks\n\t * Prefer using a map serializer over the function serializer when possible.\n\t * The map serializer is simpler to maintain.\n\t * @example A map serializer.\n\t *\n\t * ```jsx\n\t * {\n\t * heading1: ({children}) => <Heading>{children}</Heading>\n\t * }\n\t * ```\n\t *\n\t * @example A function serializer.\n\t *\n\t * ```jsx\n\t * (type, node, content, children) => {\n\t * \tswitch (type) {\n\t * \t\tcase \"heading1\": {\n\t * \t\t\treturn <Heading>{children}</Heading>;\n\t * \t\t}\n\t * \t}\n\t * };\n\t * ```\n\t */\n\tcomponents?: JSXMapSerializer | JSXFunctionSerializer;\n\n\t/**\n\t * The React component rendered for links when the URL is internal.\n\t *\n\t * @defaultValue `<a>`\n\t */\n\tinternalLinkComponent?: React.ComponentType<LinkProps>;\n\n\t/**\n\t * The React component rendered for links when the URL is external.\n\t *\n\t * @defaultValue `<a>`\n\t */\n\texternalLinkComponent?: React.ComponentType<LinkProps>;\n\n\t/**\n\t * The value to be rendered when the field is empty. If a fallback is not\n\t * given, `null` will be rendered.\n\t */\n\tfallback?: React.ReactNode;\n};\n\ntype CreateDefaultSerializerArgs<\n\t// eslint-disable-next-line @typescript-eslint/no-explicit-any\n\tLinkResolverFunction extends prismic.LinkResolverFunction<any> = prismic.LinkResolverFunction,\n> = {\n\tlinkResolver: LinkResolverFunction | undefined;\n\tinternalLinkComponent?: React.ComponentType<LinkProps>;\n\texternalLinkComponent?: React.ComponentType<LinkProps>;\n};\n\nconst getDir = (node: prismicT.RTAnyNode): \"rtl\" | undefined => {\n\tif (\"direction\" in node && node.direction === \"rtl\") {\n\t\treturn \"rtl\";\n\t}\n};\n\nconst createDefaultSerializer = <\n\t// eslint-disable-next-line @typescript-eslint/no-explicit-any\n\tLinkResolverFunction extends prismic.LinkResolverFunction<any>,\n>(\n\targs: CreateDefaultSerializerArgs<LinkResolverFunction>,\n): JSXFunctionSerializer =>\n\tprismicR.wrapMapSerializer({\n\t\theading1: ({ node, children, key }) => (\n\t\t\t<h1 key={key} dir={getDir(node)}>\n\t\t\t\t{children}\n\t\t\t</h1>\n\t\t),\n\t\theading2: ({ node, children, key }) => (\n\t\t\t<h2 key={key} dir={getDir(node)}>\n\t\t\t\t{children}\n\t\t\t</h2>\n\t\t),\n\t\theading3: ({ node, children, key }) => (\n\t\t\t<h3 key={key} dir={getDir(node)}>\n\t\t\t\t{children}\n\t\t\t</h3>\n\t\t),\n\t\theading4: ({ node, children, key }) => (\n\t\t\t<h4 key={key} dir={getDir(node)}>\n\t\t\t\t{children}\n\t\t\t</h4>\n\t\t),\n\t\theading5: ({ node, children, key }) => (\n\t\t\t<h5 key={key} dir={getDir(node)}>\n\t\t\t\t{children}\n\t\t\t</h5>\n\t\t),\n\t\theading6: ({ node, children, key }) => (\n\t\t\t<h6 key={key} dir={getDir(node)}>\n\t\t\t\t{children}\n\t\t\t</h6>\n\t\t),\n\t\tparagraph: ({ node, children, key }) => (\n\t\t\t<p key={key} dir={getDir(node)}>\n\t\t\t\t{children}\n\t\t\t</p>\n\t\t),\n\t\tpreformatted: ({ node, key }) => <pre key={key}>{node.text}</pre>,\n\t\tstrong: ({ children, key }) => <strong key={key}>{children}</strong>,\n\t\tem: ({ children, key }) => <em key={key}>{children}</em>,\n\t\tlistItem: ({ node, children, key }) => (\n\t\t\t<li key={key} dir={getDir(node)}>\n\t\t\t\t{children}\n\t\t\t</li>\n\t\t),\n\t\toListItem: ({ node, children, key }) => (\n\t\t\t<li key={key} dir={getDir(node)}>\n\t\t\t\t{children}\n\t\t\t</li>\n\t\t),\n\t\tlist: ({ children, key }) => <ul key={key}>{children}</ul>,\n\t\toList: ({ children, key }) => <ol key={key}>{children}</ol>,\n\t\timage: ({ node, key }) => {\n\t\t\tconst img = (\n\t\t\t\t<img\n\t\t\t\t\tsrc={node.url}\n\t\t\t\t\talt={node.alt ?? undefined}\n\t\t\t\t\tdata-copyright={node.copyright ? node.copyright : undefined}\n\t\t\t\t/>\n\t\t\t);\n\n\t\t\treturn (\n\t\t\t\t<p key={key} className=\"block-img\">\n\t\t\t\t\t{node.linkTo ? (\n\t\t\t\t\t\t<PrismicLink\n\t\t\t\t\t\t\tlinkResolver={args.linkResolver}\n\t\t\t\t\t\t\tinternalComponent={args.internalLinkComponent}\n\t\t\t\t\t\t\texternalComponent={args.externalLinkComponent}\n\t\t\t\t\t\t\tfield={node.linkTo}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t{img}\n\t\t\t\t\t\t</PrismicLink>\n\t\t\t\t\t) : (\n\t\t\t\t\t\timg\n\t\t\t\t\t)}\n\t\t\t\t</p>\n\t\t\t);\n\t\t},\n\t\tembed: ({ node, key }) => (\n\t\t\t<div\n\t\t\t\tkey={key}\n\t\t\t\tdata-oembed={node.oembed.embed_url}\n\t\t\t\tdata-oembed-type={node.oembed.type}\n\t\t\t\tdata-oembed-provider={node.oembed.provider_name}\n\t\t\t\tdangerouslySetInnerHTML={{ __html: node.oembed.html ?? \"\" }}\n\t\t\t/>\n\t\t),\n\t\thyperlink: ({ node, children, key }) => (\n\t\t\t<PrismicLink\n\t\t\t\tkey={key}\n\t\t\t\tfield={node.data}\n\t\t\t\tlinkResolver={args.linkResolver}\n\t\t\t\tinternalComponent={args.internalLinkComponent}\n\t\t\t\texternalComponent={args.externalLinkComponent}\n\t\t\t>\n\t\t\t\t{children}\n\t\t\t</PrismicLink>\n\t\t),\n\t\tlabel: ({ node, children, key }) => (\n\t\t\t<span key={key} className={node.data.label}>\n\t\t\t\t{children}\n\t\t\t</span>\n\t\t),\n\t\tspan: ({ text, key }) => {\n\t\t\tconst result: React.ReactNode[] = [];\n\n\t\t\tlet i = 0;\n\t\t\tfor (const line of text.split(\"\\n\")) {\n\t\t\t\tif (i > 0) {\n\t\t\t\t\tresult.push(<br key={`${i}__break`} />);\n\t\t\t\t}\n\n\t\t\t\tresult.push(<React.Fragment key={`${i}__line`}>{line}</React.Fragment>);\n\n\t\t\t\ti++;\n\t\t\t}\n\n\t\t\treturn <React.Fragment key={key}>{result}</React.Fragment>;\n\t\t},\n\t});\n\n/**\n * React component that renders content from a Prismic Rich Text field. By\n * default, HTML elements are rendered for each piece of content. A `heading1`\n * block will render an `<h1>` HTML element, for example. Links will use\n * `<PrismicLink>` by default which can be customized using the\n * `internalLinkComponent` and `externalLinkComponent` props.\n *\n * To customize the components that are rendered, provide a map or function\n * serializer to the `components` prop.\n *\n * @remarks\n * This component returns a React fragment with no wrapping element around the\n * content. If you need a wrapper, add a component around `<PrismicRichText>`.\n * @example Rendering a Rich Text field using the default HTMl elements.\n *\n * ```jsx\n * <PrismicRichText field={document.data.content} />;\n * ```\n *\n * @example Rendering a Rich Text field using a custom set of React components.\n *\n * ```jsx\n * <PrismicRichText\n * \tfield={document.data.content}\n * \tcomponents={{\n * \t\theading1: ({ children }) => <Heading>{children}</Heading>,\n * \t}}\n * />;\n * ```\n *\n * @param props - Props for the component.\n *\n * @returns The Rich Text field's content as React components.\n *\n * @see Learn about Rich Text fields {@link https://prismic.io/docs/core-concepts/rich-text-title}\n * @see Learn about Rich Text serializers {@link https://prismic.io/docs/core-concepts/html-serializer}\n */\nexport function PrismicRichText<\n\t// eslint-disable-next-line @typescript-eslint/no-explicit-any\n\tLinkResolverFunction extends prismic.LinkResolverFunction<any>,\n>({\n\tlinkResolver,\n\tfield,\n\tfallback,\n\tcomponents,\n\texternalLinkComponent,\n\tinternalLinkComponent,\n\t...restProps\n}: PrismicRichTextProps<LinkResolverFunction>): JSX.Element | null {\n\treturn React.useMemo(() => {\n\t\tif (\n\t\t\ttypeof process !== \"undefined\" &&\n\t\t\tprocess.env.NODE_ENV === \"development\"\n\t\t) {\n\t\t\tif (\"className\" in restProps) {\n\t\t\t\tconsole.warn(\n\t\t\t\t\t`[PrismicRichText] className cannot be passed to <PrismicRichText> since it renders an array without a wrapping component. For more details, see ${devMsg(\n\t\t\t\t\t\t\"classname-is-not-a-valid-prop\",\n\t\t\t\t\t)}.`,\n\t\t\t\t\tfield,\n\t\t\t\t);\n\t\t\t}\n\t\t}\n\n\t\tif (prismic.isFilled.richText(field)) {\n\t\t\tconst serializer = prismicR.composeSerializers(\n\t\t\t\ttypeof components === \"object\"\n\t\t\t\t\t? prismicR.wrapMapSerializer(components)\n\t\t\t\t\t: components,\n\t\t\t\tcreateDefaultSerializer({\n\t\t\t\t\tlinkResolver,\n\t\t\t\t\tinternalLinkComponent,\n\t\t\t\t\texternalLinkComponent,\n\t\t\t\t}),\n\t\t\t);\n\n\t\t\t// The serializer is wrapped in a higher-order function\n\t\t\t// that automatically applies a key to React Elements\n\t\t\t// if one is not already given.\n\t\t\tconst serialized = prismicR.serialize<JSX.Element>(\n\t\t\t\tfield,\n\t\t\t\t(type, node, text, children, key) => {\n\t\t\t\t\tconst result = serializer(type, node, text, children, key);\n\n\t\t\t\t\tif (React.isValidElement(result) && result.key == null) {\n\t\t\t\t\t\treturn React.cloneElement(result, { key });\n\t\t\t\t\t} else {\n\t\t\t\t\t\treturn result;\n\t\t\t\t\t}\n\t\t\t\t},\n\t\t\t);\n\n\t\t\treturn <>{serialized}</>;\n\t\t} else {\n\t\t\treturn fallback != null ? <>{fallback}</> : null;\n\t\t}\n\t}, [\n\t\tfield,\n\t\tinternalLinkComponent,\n\t\texternalLinkComponent,\n\t\tcomponents,\n\t\tlinkResolver,\n\t\tfallback,\n\t]);\n}\n"],"names":["prismic.isFilled.richText"],"mappings":"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"}
|
package/package.json
CHANGED
|
@@ -1,6 +1,7 @@
|
|
|
1
1
|
import * as React from "react";
|
|
2
2
|
import * as prismic from "@prismicio/client";
|
|
3
3
|
import * as prismicR from "@prismicio/richtext";
|
|
4
|
+
import * as prismicT from "@prismicio/types";
|
|
4
5
|
|
|
5
6
|
import { JSXFunctionSerializer, JSXMapSerializer } from "../types";
|
|
6
7
|
import { LinkProps, PrismicLink } from "./PrismicLink";
|
|
@@ -86,6 +87,12 @@ type CreateDefaultSerializerArgs<
|
|
|
86
87
|
externalLinkComponent?: React.ComponentType<LinkProps>;
|
|
87
88
|
};
|
|
88
89
|
|
|
90
|
+
const getDir = (node: prismicT.RTAnyNode): "rtl" | undefined => {
|
|
91
|
+
if ("direction" in node && node.direction === "rtl") {
|
|
92
|
+
return "rtl";
|
|
93
|
+
}
|
|
94
|
+
};
|
|
95
|
+
|
|
89
96
|
const createDefaultSerializer = <
|
|
90
97
|
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
|
91
98
|
LinkResolverFunction extends prismic.LinkResolverFunction<any>,
|
|
@@ -93,18 +100,54 @@ const createDefaultSerializer = <
|
|
|
93
100
|
args: CreateDefaultSerializerArgs<LinkResolverFunction>,
|
|
94
101
|
): JSXFunctionSerializer =>
|
|
95
102
|
prismicR.wrapMapSerializer({
|
|
96
|
-
heading1: ({ children, key }) =>
|
|
97
|
-
|
|
98
|
-
|
|
99
|
-
|
|
100
|
-
|
|
101
|
-
|
|
102
|
-
|
|
103
|
+
heading1: ({ node, children, key }) => (
|
|
104
|
+
<h1 key={key} dir={getDir(node)}>
|
|
105
|
+
{children}
|
|
106
|
+
</h1>
|
|
107
|
+
),
|
|
108
|
+
heading2: ({ node, children, key }) => (
|
|
109
|
+
<h2 key={key} dir={getDir(node)}>
|
|
110
|
+
{children}
|
|
111
|
+
</h2>
|
|
112
|
+
),
|
|
113
|
+
heading3: ({ node, children, key }) => (
|
|
114
|
+
<h3 key={key} dir={getDir(node)}>
|
|
115
|
+
{children}
|
|
116
|
+
</h3>
|
|
117
|
+
),
|
|
118
|
+
heading4: ({ node, children, key }) => (
|
|
119
|
+
<h4 key={key} dir={getDir(node)}>
|
|
120
|
+
{children}
|
|
121
|
+
</h4>
|
|
122
|
+
),
|
|
123
|
+
heading5: ({ node, children, key }) => (
|
|
124
|
+
<h5 key={key} dir={getDir(node)}>
|
|
125
|
+
{children}
|
|
126
|
+
</h5>
|
|
127
|
+
),
|
|
128
|
+
heading6: ({ node, children, key }) => (
|
|
129
|
+
<h6 key={key} dir={getDir(node)}>
|
|
130
|
+
{children}
|
|
131
|
+
</h6>
|
|
132
|
+
),
|
|
133
|
+
paragraph: ({ node, children, key }) => (
|
|
134
|
+
<p key={key} dir={getDir(node)}>
|
|
135
|
+
{children}
|
|
136
|
+
</p>
|
|
137
|
+
),
|
|
103
138
|
preformatted: ({ node, key }) => <pre key={key}>{node.text}</pre>,
|
|
104
139
|
strong: ({ children, key }) => <strong key={key}>{children}</strong>,
|
|
105
140
|
em: ({ children, key }) => <em key={key}>{children}</em>,
|
|
106
|
-
listItem: ({ children, key }) =>
|
|
107
|
-
|
|
141
|
+
listItem: ({ node, children, key }) => (
|
|
142
|
+
<li key={key} dir={getDir(node)}>
|
|
143
|
+
{children}
|
|
144
|
+
</li>
|
|
145
|
+
),
|
|
146
|
+
oListItem: ({ node, children, key }) => (
|
|
147
|
+
<li key={key} dir={getDir(node)}>
|
|
148
|
+
{children}
|
|
149
|
+
</li>
|
|
150
|
+
),
|
|
108
151
|
list: ({ children, key }) => <ul key={key}>{children}</ul>,
|
|
109
152
|
oList: ({ children, key }) => <ol key={key}>{children}</ol>,
|
|
110
153
|
image: ({ node, key }) => {
|