Skip to content

Command.Item sets incorrect hover/focus state on initial click, breaking keyboard navigation #2063

@floriskn

Description

@floriskn

Describe the bug

When clicking to select an item inside a Command component (specifically when no items are currently selected), the item is selected successfully, but the active/hover state incorrectly jumps to the first item in the list. Because the internal focus is reset to the top, using the keyboard's Up/Down arrow keys immediately after clicking starts navigation from the first item rather than the newly selected item.

Steps to Reproduce:

  1. Navigate to the tasks example in the documentation: https://www.shadcn-svelte.com/examples/tasks
  2. Open the "Status" filter/combobox (ensure no items are currently selected).
  3. Click on an item further down the list, for example, "Done".
  4. Observe: The item is selected, but the visual hover/active background state immediately jumps up to the first item in the list ("Backlog").
  5. Press the keyboard ArrowDown or ArrowUp key.
  6. Observe: Keyboard navigation starts from "Backlog" instead of the item you just clicked ("Done").

Expected Behavior:
When an item is clicked, it should retain the active/hover focus state. Subsequent keyboard navigation (Up/Down arrows) should begin from the currently focused/clicked item.

Actual Behavior:
The active/focus state resets to the first item in the Command.List after a click event, which completely disrupts the keyboard navigation flow.

Reproduction

https://www.shadcn-svelte.com/examples/tasks

Logs

System Info

System:
    OS: Windows 11 10.0.26200
    CPU: (16) x64 AMD Ryzen 7 9800X3D 8-Core Processor           
    Memory: 8.77 GB / 31.17 GB
  Binaries:
    Node: 24.15.0 - C:\Program Files\nodejs\node.EXE
    npm: 11.12.1 - C:\Program Files\nodejs\npm.CMD
    pnpm: 11.1.3 - C:\Users\marth\AppData\Local\pnpm\bin\pnpm.CMD
    bun: 1.3.13 - C:\Users\marth\.bun\bin\bun.EXE
    Deno: 2.7.14 - C:\Users\marth\.deno\bin\deno.EXE
  Browsers:
    Chrome: 148.0.7778.181
    Edge: Chromium (146.0.3856.72)
  npmPackages:
    @sveltejs/kit: ^2.61.1 => 2.61.1 
    bits-ui: ^2.16.3 => 2.18.1 
    svelte: ^5.56.1 => 5.56.1

Severity

annoyance

Metadata

Metadata

Assignees

No one assigned

    Labels

    bugSomething isn't working

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions