Next.js Conf 2024: Your app should be Live by Default – Watch Keynote

Changes in block schema customization properties

As of sanity v3.1 decorators, annotations and styles will accept a component property that will handle any custom rendering of these types in the Portable Text input. This new property replaces the blockEditor.render property.

The icon property can be put directly on the root type as with all other schema types. This is replacing the blockEditor.icon property.

So if you previously did this in your block type schema:

decorators: [
  {
    title: 'Highlight',
    value: 'highlight',
    blockEditor: {
      icon: MarkerIcon,
      render: highlightRender,
    },
  },
],

You should now do this:

decorators: [
  {
    title: 'Highlight',
    value: 'highlight',
    icon: MarkerIcon,
    component: Highlight,
  },
],

Read more about customizing the Portable Text Editor

Was this article helpful?