Add form prop to form-like components such as RadioGroup, Switch, Listbox, and Combobox

[asylejmani]

Maintainers note:

This PR adds the form prop to the form-like component such as RadioGroup, Switch, Listbox, and Combobox. The prop will be forwarded to the underlying hidden input fields.

---

There are cases where you need to submit a form with elements that are not children of said form, with native inputs you can do this by adding the form name to the input, however when adding the hidden input field there is no way to add the form name thus this component cannot be used outside of a form.

This PR adds the possibility to add the form name to the hidden input field so that it can be submitted with the said form even if it's rendered outside of it.

This is particularly needed if you have inputs in different table cells within one row and only want to keep the submit button within the form so you don't have to wrap the entire row on a form element (invalid markup)

[vercel]

The latest updates on your projects. Learn more about Vercel for Git ↗︎

Name	Status	Preview	Comments	Updated
headlessui-react	✅ Ready (Inspect)	Visit Preview	💬 Add your feedback	Mar 14, 2023 at 0:35AM (UTC)
headlessui-vue	✅ Ready (Inspect)	Visit Preview	💬 Add your feedback	Mar 14, 2023 at 0:35AM (UTC)

[vercel]

@asylejmani is attempting to deploy a commit to the Tailwind Labs Team on Vercel.

A member of the Team first needs to authorize it.

[RobinMalfait]

Hey, thanks so much for this contribution! 🙏

I added the same functionality to the other form-like components for both React and Vue. Also added tests to prove that it works as expected.

You can already try it using:

• npm install @headlessui/react@insiders.
• npm install @headlessui/vue@insiders.

[asylejmani]

Hey Robin, thanks, much appreciated! 🙏🏻