Error Using useField in a Custom Field Component for Payload CMS

I’m working on a custom field component for a Payload CMS array field. I followed the Payload CMS docs and attempted to use useField to manage the field’s value. Here’s the code:

'use client'

import { ArrayFieldClientProps } from 'payload'
import { useField } from '@payloadcms/ui'

export default function SeriesProductParameterValueField({ path }: ArrayFieldClientProps) {
  console.log('path', path)

  const { value, setValue } = useField({ path })

  return <div>SeriesProductParameterValueField</div>
}

However, the line const { value, setValue } = useField({ path }) throws the following error:

Unhandled Runtime Error: TypeError: Cannot destructure property 'config' of 
'(0 , _chunk_3MXUY6XL_js__WEBPACK_IMPORTED_MODULE_10__.b)(...)' as it is undefined.

Here’s a snippet of my collection configuration for context:

{
  name: 'products',
  type: 'array',
  fields: [
    {
      type: 'row',
      fields: [
        {
          name: 'title',
          type: 'text',
          required: true,
        },
        {
          name: 'image',
          type: 'upload',
          relationTo: 'media',
          required: true,
        },
      ],
    },
  ],
},
{
  name: 'parameterGroups',
  type: 'array',
  fields: [
    {
      name: 'title',
      type: 'text',
      required: true,
      localized: true,
    },
    {
      name: 'parameters',
      type: 'array',
      fields: [
        {
          name: 'parameter',
          type: 'relationship',
          relationTo: 'parameters',
          required: true,
        },
        {
          name: 'values',
          type: 'array',
          fields: [
            {
              name: 'productId',
              type: 'text',
              required: true,
              unique: true,
            },
            {
              name: 'value',
              type: 'text',
              localized: true,
            },
          ],
          admin: {
            components: {
              Field: '/components/payload/series-product-parameter-value-field',
            },
          },
        },
      ],
    },
  ],
},
  • Why is useField throwing this error?
  • Is there something wrong with how I’m setting up useField or the component path in the config?
  • Any guidance or examples for implementing custom field components in Payload CMS?

Thanks in advance for your help!