mirror of
https://github.com/supabase/supabase.git
synced 2026-10-07 02:15:05 +03:00
Saxon FletcherandCursor
04747937a2
## What's changed **Before** <img width="467" height="353" alt="image" src="https://github.com/user-attachments/assets/4587d51a-8bbe-4da4-a3dd-dcaac6b17993" /> **After** <img width="541" height="360" alt="image" src="https://github.com/user-attachments/assets/de66b229-54b0-4443-9c49-6f2ff0dd93aa" /> Independent of the Explorer/assistant stack. `MultiSelectorTrigger` with `size="tiny"` had badges and the inline input overflowing the 26px control. The trigger now stretches its children (`items-stretch`), badges are `h-full py-0 leading-none` with a tighter `gap-0.5`, the input/label drop their extra padding and line-height, and the chevron self-centers. Other sizes are unchanged (`isTiny` guards every new class). Also drops a redundant `text-sm` from `MultiSelectorInput`, which `MultiSelectorInputVariants` already sets per size. ## How to test 1. Design system (`pnpm dev:design-system`) or anywhere Studio uses `<MultiSelector size="tiny">` (e.g. Logs filters): with 1–3 values selected the badges sit inside the 26px control with no clipping; the placeholder and chevron are vertically centered. 2. `size="small"` / default still look the same as on `master`. 3. `pnpm --filter ui-patterns exec vitest --run src/multi-select` passes. <!-- This is an auto-generated comment: release notes by coderabbit.ai --> ## Summary by CodeRabbit - **Style** - Improved the compact multi-select control layout, including spacing, alignment, selected-value badges, input sizing, and dropdown indicator positioning. - Adjusted placeholder spacing when the tiny control has no selected values. - **Tests** - Updated coverage to verify compact spacing and sizing when the tiny multi-select control displays a selected value. <!-- end of auto-generated comment: release notes by coderabbit.ai --> --------- Co-authored-by: Cursor <cursoragent@cursor.com>