SanityParser

The SanityParser component is used to parse data from Sanity and render it using React components.

Usage

For all data types included in the @codedazur/fusion-sanity package, you can use the SanityParser component to render the data using the standard adapters.


import { SanityParser } from "@codedazur/fusion-sanity";
 
export default async function Page() {
  const data = await getSanityData();
 
  return (
    <SanityParser
      sanity={{
        projectId: process.env.NEXT_PUBLIC_SANITY_PROJECT_ID!,
        dataset: process.env.NEXT_PUBLIC_SANITY_DATASET!,
      }}
      data={data}
    />
  );
}

Custom Adapters

If you want to provide additional adapters, or if you want to override any of the default adapters, you can do so by passing an adapters prop to the SanityParser component.


import { SanityParser } from "@codedazur/fusion-sanity";
import { infoAdapter } from "../adapters/infoAdapter";
import { linkAdapter } from "../adapters/linkAdapter";
 
export default async function Page() {
  const data = await getSanityData();
 
  return (
    <SanityParser
      // ...
      adapters={{
        info: infoAdapter,
        link: linkAdapter,
      }}
    />
  );

Note

For more information on how to create custom adapters, see the Expanding Sanity guide.

Reference

SanityParserProps

Name	Type	Required	Decription
`sanity`	`SanityConfig`	`true`	The Sanity configuration.
`data`	`T`	`true`	The data to parse. This can be typed using generics if necessary.
`adapters`	`Record<string, Adapter<any, any>>`	`true`	The adapters to use.

SanityConfig

Name	Type	Required	Decription
`projectId`	`string`	`true`	The Sanity project ID.
`dataset`	`string`	`true`	The Sanity dataset.

Adapter

Name	Type	Required	Decription
`transform`	`(data: T, context: Context) => U`	`true`	The transform function.
`render`	`(props: U) => React.ReactNode`	`true`	The render function.