The fundamental concept in @usewaypoint/document-core is the DocumentBlocksDictionary. It is a mapping where each key is a block name, and the value is an object containing two things:
- A
zod schema defining the data structure for that block. - A React
Component that renders the block using that data.
This dictionary is passed to builder functions to generate specialized components and validation schemas.
const dictionary = {
Alert: {
schema: z.object({
message: z.string(),
}),
Component: ({ message }: { message: string }) => {
return <div>{message.toUpperCase()}</div>
}
}
}