ToggleSwitch and forwardRef

[leonyoung1]

• I have searched the Issues to see if this bug has already been reported
• I have tested the latest version

Steps to reproduce

Using "flowbite-react": "^0.6.4" and "react-hook-form": "7.47.0"

import { useForm } from 'react-hook-form';
import { Button, ToggleSwitch} from 'flowbite-react'

export default function App() {
  const { register, handleSubmit} = useForm();

  return (
    <div>
      <form onSubmit={handleSubmit(fd => console.log(fd))}>
        <ToggleSwitch  {...register("toggle")} />
        <Button type='submit'>Submit</Button>
      </form>
    </div>
  );
}

Current behavior

ToggleSwitch can't receive a forwarded ref from the useForm hook from React Hook Form.

Expected behavior

I expect ToggleSwitch to be able to receive a forwarded ref, like the other Flowbite form components.

Context

What are you trying to accomplish? Does this only happen on a specific browser, screen size, or operating system?

I'm trying out all the Flowbite form components with React Hook Form.

Most of the components seem to work well, except for ToggleSwitch.

When using React Hook Form with ToggleSwitch I got an error Warning: Function components cannot be given refs. Attempts to access this ref will fail. Did you mean to use React.forwardRef()?

When I looked at the code for all the other form components, I saw they all used forwardRef:

export const Radio = forwardRef<HTMLInputElement, RadioProps>(
export const TextInput = forwardRef<HTMLInputElement, TextInputProps>(
export const Select = forwardRef<HTMLSelectElement, SelectProps>(
export const Checkbox = forwardRef<HTMLInputElement, CheckboxProps>(
export const Textarea = forwardRef<HTMLTextAreaElement, TextareaProps>(
export const RangeSlider = forwardRef<HTMLInputElement, RangeSliderProps>(
export const FileInput = forwardRef<HTMLInputElement, FileInputProps>(

EXCEPT for ToggleSwitch:

export const ToggleSwitch: FC<ToggleSwitchProps> = ({

[andersonba]

up