huntabyte / cmdk-sv

cmdk, but for Svelte ✨
https://cmdk-sv.com
MIT License
410 stars 17 forks source link

Option to not select the entire input text on open? #68

Open MadeInPierre opened 3 months ago

MadeInPierre commented 3 months ago

Hi, I am trying to implement multiple "modes" based on /commands. Some commands will use the default search algorithm while others have their own. Hence, I have a shoudFilter reactive variable that decides which modes should disable the default search:

<Command.Dialog bind:open {shouldFilter} loop>
    <Command.Input
        placeholder="Search or type '/' for commands"
        bind:value={inputValue}
        autofocus={false} <!-- This prop has no effect-->
    />

    <Command.List>
        <Command.Empty>No results found.</Command.Empty>

        {#if commandMode === CommandMenuMode.DEFAULT}
            <CommandModeDefault {runCommand} {setCommandMode} {inputValue} />
        {:else if commandMode === CommandMenuMode.SEARCH_ITEMS}
            <CommandModeSearchItems {runCommand} {inputValue} />
        {/if}
    </Command.List>
</Command.Dialog>

First of all, the shouldFilter behavior has no effect so I had to add a key:

{#key shouldFilter}
    the previous code
{/key}

However, the entire component is of course rebuilt and this selects the entire input text, which is annoying for the user as they were expecting to continue typing (e.g. /command something etc...).

I noticed an autofocus prop in the CommandInput.svelte which I tried to set (see the first code block) but it has no effect.

Am I setting this option wrong or is there something to fix? Thank you!

huntabyte commented 3 months ago

Hey @MadeInPierre, are you able to create a minimal repro using StackBlitz so I can take a closer look at the behavior you're describing? Thank you!