GitHub/Anki
1
0
Fork 0
mirror of https://github.com/ankitects/anki.git synced 2025-11-07 05:07:10 -05:00
Code Issues Projects Releases Packages 1 Wiki Activity Actions

Scroll selected deck/notetype into view

Browse source
This commit is contained in:
Abdo 2025-10-26 18:59:49 +03:00
parent 3a0c3ef4e7
commit 60af80ba9d
1 changed files with 13 additions and 2 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

15
ts/lib/components/ItemChooser.svelte
View file

@ -42,6 +42,7 @@ License: GNU AGPL, version 3 or later; http://www.gnu.org/licenses/agpl.html
item.name.toLowerCase().includes(searchQuery.toLowerCase()),
),
);
const filteredElements: HTMLButtonElement[] = $state([]);
function onSelect(item: Item) {
selectedItem = item;
@ -69,6 +70,15 @@ License: GNU AGPL, version 3 or later; http://www.gnu.org/licenses/agpl.html
}
}
function onShown() {
searchInput?.focus();
for(const element of filteredElements) {
if(element.classList.contains("selected")) {
element.scrollIntoView({block: "start"});
}
}
}
$effect(() => {
if (!selectedItem && items.length > 0) {
selectedItem = items[0];
@ -81,7 +91,7 @@ License: GNU AGPL, version 3 or later; http://www.gnu.org/licenses/agpl.html
</LabelButton>
<Shortcut {keyCombination} on:action={toggleModal} />
<Modal bind:this={modal} onShown={() => searchInput?.focus()} dialogClass="modal-lg">
<Modal bind:this={modal} onShown={onShown} dialogClass="modal-lg">
<div slot="header" class="modal-header">
<IconConstrain iconSize={90}>
<Icon {icon} />
@ -125,8 +135,9 @@ License: GNU AGPL, version 3 or later; http://www.gnu.org/licenses/agpl.html
</div>
</div>
<div class="item-grid">
{#each filteredItems as item (item.id)}
{#each filteredItems as item, i (item.id)}
<button
bind:this={filteredElements[i]}
class="item-card"
class:selected={selectedItem?.id === item.id}
onclick={() => onSelect(item)}