[slider][field] Integrate range sliders with field

[mj12albert]

Part of #1864

Preview: https://deploy-preview-1929--base-ui.netlify.app/experiments/slider/form

Added a <input type="hidden"> in the root that is wired to Field and Form instead of the thumb's <input type="range">

One limitation is that if the range slider's value goes through FormData as part of form submission, it'll become a string ('[2,4]') and will need to be manually JSON.parse-ed

• I have followed (at least) the PR section of the contributing guide.

[pkg-pr-new]

Open in StackBlitz

npm i https://pkg.pr.new/@base-ui-components/react@1929

commit: fbc72e5

[netlify]

✅ Deploy Preview for base-ui ready!

Name	Link
🔨 Latest commit	fbc72e5
🔍 Latest deploy log	https://app.netlify.com/projects/base-ui/deploys/68270b51e536920008ba950f
😎 Deploy Preview	https://deploy-preview-1929--base-ui.netlify.app
📱 Preview on mobile	Toggle QR Code... Use your smartphone camera to open QR code link.

---

To edit notification comments on pull requests, go to your Netlify project configuration.

[atomiks]

One limitation is that if the range slider's value goes through FormData as part of form submission, it'll become a string ('[2,4]') and will need to be manually JSON.parse-ed

I added multiple hidden inputs for the multi-select feature

{multiple &&
  Array.isArray(value) &&
    value.map((v) => <input key={v} type="hidden" name={name} value={v} />)}

const data = new FormData(event.currentTarget);
const submitted = data.getAll(name); // normal array