v6. Support for <select> at the box level

[sindyko]

I have now compiled and tested the v6-dev branch. But unfortunately, so far I haven't seen the form control in either the scss or js files or in the examples. At the moment, there is a Simple native select. It would be great to have a custom in v6. Something similar as in the screenshots. If you include this in the development plan, I will be very grateful to you. Already at this stage, version 6 looks stunning.

[netadapt]

This would be great, I have my own home brewed versions of this already created using Bootstrap/JS/HTMX, but I'd love a "native" BS component so I can bin my work and adapt to a new bundled component. (With HTMX again, of course!)

[coliff]

As for the v6-dev branch, the selects class will change from form-select to form-control but the changes for that aren't done yet.

As for a true, native custom select, browser support for that isn't great yet at all with only Chromium currently supporting it.

• https://developer.mozilla.org/en-US/docs/Learn_web_development/Extensions/Forms/Customizable_select
• https://developer.mozilla.org/en-US/docs/Web/CSS/Reference/Selectors/::picker

Will be great when support is wider though, I adopted a quick demo of a currency selector for Bootstrap 5:
https://code.christianoliff.com/bootstrap-custom-select-currency/

One other thing to consider is using some additional JavaScript to change a Bootstrap dropdown to work like a <select>. Bootstrap 6 docs is using that on the Buttons playground and it looks great I think :-)

[sindyko]

Yes, Bootstrap 6 uses this on the Buttons playground, but it's still dropdown. I read in one of the PRS that now all the components will be form-control, I understand that this may not be relevant for the development team right now, but I would like to see this implemented. One of the examples in the idea I gave from Tailwind, I also observed the same system in https://ui.shadcn.com/docs/components/radix/select . Thanks for your reply.

[sindyko]

I've studied the links. Unfortunately, not all browsers support this. In theory, it could still be implemented, since I think all the remaining browsers should come to this soon. The example I gave, they implement, as I understand it, not through native select, but through custom attributes and js, screenshot from Tailwind

[sindyko]

Unfortunately, I don't have a Mac to test this completely, but if you look at your example in Safari on an Iphone, select becomes just the default. My thoughts on this are as follows: it would be possible to implement this, and in the future, when other browsers support it, then it will also be available automatically for them, since scss has already been written.

[SantoStefano]

Yeah, it looks good, I hope the team considers it for the v6 roadmap!

[mdo]

I'm prototyping out a custom select menu for v6. TBD on where it goes, because ideally we'd use the new native select but support is bad. Swapping a select for a custom button/menu combo would be great IMO.

[netadapt]

That is great news. In my hasty reply to the original OP, I regret using the word "native" - I was trying to refer to a Bootstrap bundled component, and not browser native component (hence the "quotes"). Regardless, the conversation regarding true native support was interesting anyway. Thanks again BS team, keep up the excellent work.

[sindyko]

Great news! Thanks again BS team!