Files
supabase/packages/ui-patterns
Anthony Lio 222127b5c2 fix(ui-patterns): multi select cropped caret + extra padding (#50323)
## What kind of change does this PR introduce?

bug fix on multi select ui patterns component following up with #49986

## What is the current behavior?

- extra left padding on medium size
- cropped caret on tiny size

## What is the new behavior?

- updates multi select style padding + caret
- refactors test

`caret`
| state | preview |
| -------|------|
| before | <img width="594" height="362" alt="image"
src="https://github.com/user-attachments/assets/14af14f6-348a-44be-b0ae-42fdb9a4f4ce"
/> |
| after | <img width="594" height="362" alt="image"
src="https://github.com/user-attachments/assets/44dab5ae-944d-43fe-8c4e-0af44a0e1fc7"
/> |

`padding`
| state | preview |
| -------|------|
| before | <img width="594" height="362" alt="image"
src="https://github.com/user-attachments/assets/b1ad7f66-9952-463d-aebb-01fee8748aef"
/>|
| after | <img width="594" height="362" alt="image"
src="https://github.com/user-attachments/assets/a5891c45-67b3-4926-97c5-a2ad7027bd5c"
/> |


<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->
## Summary by CodeRabbit

* **Bug Fixes**
* Multi-select triggers now display the selected value while retaining
the placeholder when empty.
* Improved sizing, spacing, and minimum widths across multi-select
controls for more consistent layouts.
* Delete controls now provide clearer click targets and hover feedback.
* Decorative chevron icons are hidden from assistive technologies for
improved accessibility.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
2026-09-18 10:38:27 +03:00
..
2026-07-02 17:03:08 +02:00

Supabase UI Patterns

This package should be used for components which are built using NPM libraries (react-markdown, reactflow for example), which make no sense to be included in all apps. It should also be used for components which are constructed using various components from the ui package.

This package does not have a barrel file - each component has to be imported from its index (ui-patterns/PrivacySettings, for example). This is intentional so that adding a new component which is used only in 1 or 2 apps doesn't burden the rest of the apps.