Best way to type and customize components?

[hallofstairs]

1. What is the proper typing on custom components?

const ParagraphBlock = ({children}) => {  // What props are passed into ParagraphBlock?
  return (
    <p>
      {children}
    </p>
  )
}

const plugins = createPlugins<MyValue>([
  createParagraphPlugin({
    component: ParagraphBlock,  // What's the proper type of ParagraphBlock here?
  })
]

2. How do you add custom styling for Heading blocks? I know you can specify levels, but how do you pass that info to the component? Do you just need custom plugins to handle these?

const plugins = createPlugins<MyValue>([
  createHeadingPlugin({
    component: SectionBlock,
    options: {
      levels: 3,
    },
  })
]

[zbeyens]

New guide: https://platejs.org/docs/plugin