Custom Input: Placeholder

import React from 'react'

import { Stack, Heading } from '@sanity/ui'

const Placeholder = React.forwardRef((props, _ref) => {
    return (
      <Stack space={2}>
        <Heading as='h3' size={0}>{props.type.title}</Heading>
      </Stack>
    )
  }
)

export default Placeholder

import Placeholder from '../src/Placeholder'

export default {
  name: 'test',
  title: 'Test Document',
  type: 'document',
  fields: [
    {
      name: 'contentBlocks',
      title: 'Content Blocks',
      type: 'array',
      of: [
        {
          name: 'placeholder',
          title: 'Placeholder',
          type: 'string',
          inputComponent: Placeholder,
        },
      ],
    },
  ],
  preview: {
    select: {},
    prepare() {
      return { title: 'Test Document' }
    }
  },
}