Knobs: Wrong component shown in basic code example for React Hook Form

[melloware]

Discussed in https://github.com/orgs/primefaces/discussions/1225

^{Originally posted by DavanaVM February 19, 2024}
Hello, in the Code Example provided for React Hook Form it actually uses instead of a Knob, this issue is not in the full code example, only in the basic one.

Basic:

<Controller
    name="value"
    control={control}
    rules={{ required: 'The value must be greater than zero.' }}
    render={({ field }) => (
        <CascadeSelect id={field.name} name="value" value={field.value} options={countries} optionLabel={'cname'} optionGroupLabel={'name'}
         optionGroupChildren={['states', 'cities']} style={{ minWidth: '14rem' }} placeholder={'Select a City'}
         onChange={(e) => field.onChange(e.value)}/>)}
    />

Full Code example:

<Controller
   name="value"
   control={control}
   rules={{ required: 'The value must be greater than zero.' }}
   render={({ field }) => <Knob id={field.name} name="value" value={field.value || '0'} onChange={(e) => field.onChange(e.value)} />}
  />
```</div>