KendoReact и реактивная форма

Question

У меня проблемы с использованием KendoReact компонентов с библиотекой Reaction-Hook-Form :

<Controller
   as={Input}
   name="firstName"
   control={control}
   defaultValue="type something here"
/>

Образец Stackblitz здесь

В форме реагирующего хука образец используются компоненты MaterialUI для демонстрации интеграции сторонних библиотек, которая работает нормально. При использовании компонента Kendo Input при вводе чего-либо в элемент управления вводом в элементе управления отображается [object Object] вместо введенного значения. Это связано с тем, что значение, устанавливаемое для элемента управления, является объектом event вместо фактического значения.

Я не могу найти способ обойти это, надеюсь, кто-то другой нашел его.

Answer 1

Создание простой оболочки вокруг Input для получения значения из onChange будет работать:

const InputWrapper = props => {
  return <Input {...props} onChange={e => {
    props.onChange(e.target.value)
  }} />
}

...

  <Controller
    as={InputWrapper}
    name="firstName"
    control={control}
    defaultValue="type something here"
  />

stackblitz