GitHub/Anki
1
0
Fork 0
mirror of https://github.com/ankitects/anki.git synced 2025-09-18 22:12:21 -04:00
Code Issues Projects Releases Packages 1 Wiki Activity Actions

Add tabbable option to DropdownItem

Browse source
This commit is contained in:
Henrik Giesel 2021-06-25 17:34:04 +02:00
parent a5af3a9280
commit 8d95503189
2 changed files with 9 additions and 3 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

2
ts/components/DropdownItem.svelte
View file

@ -11,6 +11,7 @@ License: GNU AGPL, version 3 or later; http://www.gnu.org/licenses/agpl.html
export { className as class }; export { className as class };
export let tooltip: string | undefined = undefined; export let tooltip: string | undefined = undefined;
export let tabbable: boolean = true;
let buttonRef: HTMLButtonElement; let buttonRef: HTMLButtonElement;
@ -22,6 +23,7 @@ License: GNU AGPL, version 3 or later; http://www.gnu.org/licenses/agpl.html
<button <button
{id} {id}
tabindex={tabbable ? 0 : -1}
bind:this={buttonRef} bind:this={buttonRef}
class={`btn dropdown-item ${className}`} class={`btn dropdown-item ${className}`}
class:btn-day={!nightMode} class:btn-day={!nightMode}

10
ts/editor/TagAutocomplete.svelte
View file

@ -30,7 +30,9 @@ License: GNU AGPL, version 3 or later; http://www.gnu.org/licenses/agpl.html
} }
} }
function updateActiveItem(even: FocusEvent): void {} function updateActiveItem(event: FocusEvent): void {
event.preventDefault();
}
</script> </script>
<ButtonToolbar class={`dropup ${className}`} {size}> <ButtonToolbar class={`dropup ${className}`} {size}>
@ -38,8 +40,10 @@ License: GNU AGPL, version 3 or later; http://www.gnu.org/licenses/agpl.html
<DropdownMenu class="d-flex flex-column-reverse"> <DropdownMenu class="d-flex flex-column-reverse">
{#each suggestions as tag} {#each suggestions as tag}
<DropdownItem on:focus={updateActiveItem} on:keydown={switchUpDown} <DropdownItem
>{tag}</DropdownItem tabbable={false}
on:focus={updateActiveItem}
on:keydown={switchUpDown}>{tag}</DropdownItem
> >
{/each} {/each}
</DropdownMenu> </DropdownMenu>