Custom Html Message

[vivindeena]

Hello Matteo,

I have been using your plugin for almost a year now, but since, v3 the Notes block has been giving me issues. i used render a custom html element in the message of the note, is there any alternative for this in v3.

Thank you for you time

[ndimatteo]

hey there @vivindeena,

Could you elaborate on what issues you are having with V3? You can add react components to both the description property and the icon option.

Please check out the readme for details and examples.

[vivindeena]

I have been react functional component, but nothing is getting displayed on the sanity desk

The following is the functional react component

import React from 'react'

const Example = () => {
  return (
    <div>
      <h1>A Computer Science Portal for Geeks</h1>
    </div>
  )
}
export default Example

The field is declared so, in the sanity

defineField(
    defineField({
         title: 'Important!',
         description: () => <Example />,
         name: 'xx',
         type: 'note',
         options: {
             tone: 'caution',
          },
    })
),

This is how its rendered in the sanity desk

[ndimatteo]

Hey there @vivindeena the description property doesn't accept an arrow function as a valid value.

You can render your functional component like this:

defineField({
  title: 'Important!',
  description: <Example />,
  name: 'xx',
  type: 'note',
  options: {
    tone: 'caution',
  },
})