sebnitu / vrembem / 26013738582

90%

main: 100%

push

github

Add new select component with custom dropdown picker styles (#2829)

Add new select component using `appearance: base-select` for both the select element and `::picker(select)` pseudo element. This enables custom styles for both the select and the select dropdown. This replaces the use of `input_type_select` and further refactors the input component to remove state modifiers in favor of native and accessible error state styling.

This PR also removes a few other modifiers such as the `input_auto` in favor of a more generic `width-auto` utility. In addition, we also remove general form-control size modifiers. These add a lot of extra code with very little usefulness. This leaves CSS variables as the primary way to adjust the size of form-controls based on their context as well as font-size utilities that can be used directly on form-controls themselves.

This PR resolves: #2806

**Additional changes**

- `input`: Use `:user-invalid` and `[aria-invalid="true"]` for displaying the error state with possible `is-invalid` and `is-valid` state classes.
- `menu`: Use color-mix to set hover and active states of menu actions.
- `menu`: Decoupled shared styling between form-controls and menu action elements.
- `menu`: Removed size modifiers in favor of utilities.
- `core`: Improved default styles for dark mode background tokens.
- `core`: Improved default styles for focus-ring tokens.
- `core`: Removed inner shadow from form-control inputs.
- `core`: Switched spacing tokens from `em` to `rem`.
- `core`: Added new em-based spacing tokens.
- `core`: Rename default value in breakpoints map to initial.
- `docs`: Various improvements to documentation styles.
- `utility`: Added `width-100` and `width-auto` utilities.
- `utility`: Rename `max-width-full` utility to `max-width-100` to match the new `width-100` naming.
- `utility`: Add em-based spacing utilities. This uses the new `em-spacing` tokens.

569 of 651 branches covered (87.4%)

Branch coverage included in aggregate %.

886 of 952 relevant lines covered (93.07%)

32.08 hits per line