I have a question regarding customization of Prismic components.
A few month ago the starter tutorial for Next.js suggested to use the <PrismicProvider> component.
This gave me the option to customize the <PrismicLink> component and set custom components which are used by <PrismicRichText> all over the application.
<PrismicProvider
internalLinkComponent={(props) => <Link {...props} />}
externalLinkComponent={(props) => <Link {...props} external />}
richTextComponents={{
heading1: ({ children }) => <Title level="h1">{children}</Title>,
heading2: ({ children }) => <Title level="h2">{children}</Title>,
heading3: ({ children }) => <Title level="h3">{children}</Title>,
heading4: ({ children }) => <Title level="h4">{children}</Title>,
heading5: ({ children }) => <Title level="h5">{children}</Title>,
heading6: ({ children }) => <Title level="h6">{children}</Title>,
paragraph: ({ children }) => <Text>{children}</Text>,
strong: ({ children }) => <TextStrong>{children}</TextStrong>,
}}>
As mentioned now, it's no longer recommended to use the <PrismicProvider> component:
We no longer recommend using
<PrismicProvider>
We recommend creating your own wrapper components to configure components globally rather than using<PrismicProvider>.
So, how am I able to customize the components, that are used in my <PrismicRichText> globally?
And how can I customize the components, that are used by the newly implemented <PrismicNextLink> component?
I would highly appreciate those possibilities.
