custom select component not working with controller

[niralparmar]

hi,
i have a select component which is a wrapper of react-select and i passed it to controller but i dont see any data getting submitted
my codesanbox
https://codesandbox.io/s/musing-glitter-0brjd

in general, what would be correct way to implement wrapper component on top of other component library and pass it to controller.

for eg: here is my wrapper component for reactstrap input
`

             import React from "react"; 
             import { Input} from 'reactstrap';
             export default function TextBox({
                   id,
                   name,
                   label,
                   value = "",
                   placeholder = "",
                   readonly = false,
                   hidden = false,
                   required = false,
                   isValid
               }) {
              if (hidden) {
                 return null;
                }
             return (
                        <Input type="text" name={name} id={id} value={value} placeholder={placeholder}  disabled={readonly} valid={isValid} invalid={!isValid} />
            );
    }

`

[bluebill1049]

provide a codesandbox for your issue.

[niralparmar]

@bluebill1049 here it is
https://codesandbox.io/s/musing-glitter-0brjd

[bluebill1049]

there is an example under: https://react-hook-form.com/api#Controller
https://codesandbox.io/s/react-hook-form-controller-079xx

[niralparmar]

thanks @bluebill1049 i followed the exact steps from example , but mine is not working

[bluebill1049]

const MyComponent = () => <Select options={options} />;

you didn't propagate all the props.

[niralparmar]

dang.... thanks @bluebill1049