huntabyte / shadcn-svelte

shadcn/ui, but for Svelte. ✨
https://next.shadcn-svelte.com
MIT License
5.27k stars 323 forks source link

[svelte 5] Select component deselects item when clicking on the item again #1367

Closed sharknoon closed 1 hour ago

sharknoon commented 2 hours ago

Describe the bug

In a Select component dropdown, when clicking on an already selected item (which has the checkmark next to the text), it deselects it. In the react shadcn/ui as well as in the Svelte 4 version, you can't deselect an already selected item by clicking again on it.

Reproduction

Expected behavior

React version

https://ui.shadcn.com/docs/components/select

  1. Select "Apple" from the dropdown
  2. Select "Apple" from the dropdown again (it is still selected)

    Svelte 4 version

    https://www.shadcn-svelte.com/docs/components/select

  3. Select "Apple" from the dropdown
  4. Select "Apple" from the dropdown again (it is still selected)

    Wrong behavior

    Svelte 5 version

    https://next.shadcn-svelte.com/docs/components/select

  5. Select "Apple" from the dropdown
  6. Select "Apple" from the dropdown again (it gets unselected)

Logs

No logs because it is not an error which is thrown. See reproduction above.

System Info

System:
    OS: Windows 11 10.0.22631
    CPU: (24) x64 AMD Ryzen Threadripper 2920X 12-Core Processor 
    Memory: 12.56 GB / 31.88 GB
  Binaries:
    Node: 22.2.0 - C:\Program Files\nodejs\node.EXE
    Yarn: 1.22.22 - C:\Program Files\nodejs\yarn.CMD
    npm: 10.9.0 - C:\Program Files\nodejs\npm.CMD
    pnpm: 9.12.2 - C:\Program Files\nodejs\pnpm.CMD
    bun: 1.1.30 - ~\.bun\bin\bun.EXE
  Browsers:
    Edge: Chromium (123.0.2420.97)
    Internet Explorer: 11.0.22621.3527

Severity

annoyance

huntabyte commented 2 hours ago

This is by design at the request of people who want to give users the ability to deselect items and set the select's value to the default.

I'll add a prop to bits-ui to enable you to disable this functionality though! https://github.com/huntabyte/bits-ui/issues/818

huntabyte commented 1 hour ago

Closed as added in bits-ui@next.29 via the allowDeselect prop on the Select.Root component 😃

sharknoon commented 6 minutes ago

What a quick response! Thank you so much @huntabyte! :)