Fix indent/outdent shortcuts not working

https://forums.ankiweb.net/t/keyboard-shortcut-for-indent-not-working/24114/6
This commit is contained in:
Damien Elmes 2022-10-26 12:35:49 +10:00
parent cce936c190
commit ab6877c714

View file

@ -3,6 +3,8 @@ Copyright: Ankitects Pty Ltd and contributors
License: GNU AGPL, version 3 or later; http://www.gnu.org/licenses/agpl.html License: GNU AGPL, version 3 or later; http://www.gnu.org/licenses/agpl.html
--> -->
<script lang="ts"> <script lang="ts">
import { onMount } from "svelte";
import ButtonGroup from "../../components/ButtonGroup.svelte"; import ButtonGroup from "../../components/ButtonGroup.svelte";
import ButtonGroupItem, { import ButtonGroupItem, {
createProps, createProps,
@ -13,12 +15,12 @@ License: GNU AGPL, version 3 or later; http://www.gnu.org/licenses/agpl.html
import DynamicallySlottable from "../../components/DynamicallySlottable.svelte"; import DynamicallySlottable from "../../components/DynamicallySlottable.svelte";
import IconButton from "../../components/IconButton.svelte"; import IconButton from "../../components/IconButton.svelte";
import Popover from "../../components/Popover.svelte"; import Popover from "../../components/Popover.svelte";
import Shortcut from "../../components/Shortcut.svelte";
import WithFloating from "../../components/WithFloating.svelte"; import WithFloating from "../../components/WithFloating.svelte";
import { execCommand } from "../../domlib"; import { execCommand } from "../../domlib";
import { getListItem } from "../../lib/dom"; import { getListItem } from "../../lib/dom";
import { preventDefault } from "../../lib/events";
import * as tr from "../../lib/ftl"; import * as tr from "../../lib/ftl";
import { getPlatformString } from "../../lib/shortcuts"; import { getPlatformString, registerShortcut } from "../../lib/shortcuts";
import { context } from "../NoteEditor.svelte"; import { context } from "../NoteEditor.svelte";
import { editingInputIsRichText } from "../rich-text-input"; import { editingInputIsRichText } from "../rich-text-input";
import CommandIconButton from "./CommandIconButton.svelte"; import CommandIconButton from "./CommandIconButton.svelte";
@ -54,6 +56,17 @@ License: GNU AGPL, version 3 or later; http://www.gnu.org/licenses/agpl.html
} }
} }
onMount(() => {
registerShortcut((event: KeyboardEvent) => {
preventDefault(event);
indentListItem();
}, indentKeyCombination);
registerShortcut((event: KeyboardEvent) => {
preventDefault(event);
outdentListItem();
}, outdentKeyCombination);
});
const { focusedInput } = context.get(); const { focusedInput } = context.get();
$: disabled = !editingInputIsRichText($focusedInput); $: disabled = !editingInputIsRichText($focusedInput);
@ -146,11 +159,6 @@ License: GNU AGPL, version 3 or later; http://www.gnu.org/licenses/agpl.html
{@html outdentIcon} {@html outdentIcon}
</IconButton> </IconButton>
<Shortcut
keyCombination={outdentKeyCombination}
on:action={outdentListItem}
/>
<IconButton <IconButton
tooltip="{tr.editingIndent()} ({getPlatformString( tooltip="{tr.editingIndent()} ({getPlatformString(
indentKeyCombination, indentKeyCombination,
@ -161,11 +169,6 @@ License: GNU AGPL, version 3 or later; http://www.gnu.org/licenses/agpl.html
> >
{@html indentIcon} {@html indentIcon}
</IconButton> </IconButton>
<Shortcut
keyCombination={indentKeyCombination}
on:action={indentListItem}
/>
</ButtonGroup> </ButtonGroup>
</ButtonToolbar> </ButtonToolbar>
</Popover> </Popover>