Improve, document, and promote native dropdown

[Spark450]

Background

Starting with Chrome 135, it is now possible to style the native <select> element. By adopting this capability, we can offer a styled native dropdown that aligns with our design system, while benefiting from the inherent stability, accessibility, and performance of the native element. This allows us to recommend the native version as the preferred implementation and begin the process of marking our current custom dropdown as a legacy component, with the goal of eventually deprecating it from the component library.

Acceptance criteria

• The native dropdown variant is styled to visually match the design language of the current custom dropdown component.
• The native dropdown is integrated into both the public form and workspace exemplar pages to support visibility and encourage adoption.
• Documentation is updated to reflect the new recommended usage of the native dropdown and to clearly indicate the legacy status of the previous custom dropdown.

[dustin-nielsen-goa]

@Spark450 We shouldn't be doing this yet, https://caniuse.com/mdn-css_properties_appearance_base-select, that link states the CSS property that enables this isn't yet supported by Firefox or Safari, or anything on Mobile except for Chrome (Android).

Also based on this blog post, this should support this feature natively, we would just need to implement DropdownItem as a slot or string. But this feature will likely not be possible using the native select, so if we embrace it and deprecate our non-native option, then we're likely saying no to this feature.

Also, we should consider the ramifications for the future. If we remove our customized dropdown, we're removing the possibility of adding native unsupported features.

All that being said, I would approve of this once the feature is available in more browsers, because implementing this would make our Dropdown component vastly simpler and remove a lot of potential issues and breaking bugs we've experienced in the past. Just thought you should have all the info before making a decision.

[chrisolsen]

Here is the branch where a working version exists. However it needs to be styled and have React/Angular components created https://github.com/GovAlta/ui-components/tree/chris/select-component

[Spark450]

@chrisolsen I had a chat with Dustin today about some of the considerations in using base select. One issue we ran into was its implimentation of the select multiple variant where the UX differes substantially from what we have designed.

I think the next step would be to continue the spike (when it makes sense) to test out if we can achieve the mult-select dropdown design using base select

FYI @ArakTaiRoth and @twjeffery