・デフォルトの動作とは?
Tabでインデントしたり、”1.”のあとにスペースいれたらリストに変換したり、コードブロック内で改行2回押すとコードブロックを終了したりするやつです
それぞれ以下のようにbindingsに設定します
const quill = new Quill('#editor', {
modules: {
syntax: true,
toolbar: '#toolbar-container',
keyboard: {
bindings: {
"tab": false, // tab無効
"list autofill": false, // リスト変換無効
"code exit": false, // コードブロック改行のやつ無効
},
}
},
placeholder: 'Compose an epic...',
theme: 'snow',
});
これでデフォルトのbindingsを上書きできます
falseの場合bindingsを追加しないようになっているので動作も問題なさそうです
じゃぁどこからこの名前(code exitとか)を見つけてくるかというとソース読みます
keyboard.tsのdefaultOptionsのキーが該当します
とりあえず現時点でのbinding一覧をAIにテーブル化してもらいました↓
Quill キーボードバインディング一覧
| カテゴリ | バインディング名 | キー | 説明 |
|---|---|---|---|
| テキストフォーマット | bold |
Ctrl+B (Mac: Cmd+B) |
テキストを太字にする |
| テキストフォーマット | italic |
Ctrl+I (Mac: Cmd+I) |
テキストを斜体にする |
| テキストフォーマット | underline |
Ctrl+U (Mac: Cmd+U) |
テキストに下線を引く |
| インデント | indent | Tab |
blockquote、indent、listの行頭でインデントを増やす |
| インデント | outdent | Shift+Tab |
blockquote、indent、listの行頭でインデントを減らす |
| インデント | outdent backspace | Backspace |
indent/listの行頭でBackspaceを押すとインデント/リストを解除 |
| コードブロック | indent code-block | Tab |
コードブロック内でタブを挿入してインデント |
| コードブロック | outdent code-block | Shift+Tab |
コードブロック内でタブを削除してアウトデント |
| コードブロック | remove tab | Shift+Tab |
行末のタブ文字の直後でShift+Tabを押すとタブを削除 |
| コードブロック | code exit | Enter |
コードブロックで連続した空行でEnterを押すとコードブロックを終了 |
| Tab文字 | tab | Tab |
通常の場所でタブ文字を挿入(テーブル内を除く) |
| Enter | blockquote empty enter | Enter |
空のblockquote行でEnterを押すとblockquoteを解除 |
| Enter | list empty enter | Enter |
空のリスト行でEnterを押すとリストを解除 |
| Enter | checklist enter | Enter |
チェックリスト内でEnterを押すと新しい未チェック項目を作成 |
| Enter | header enter | Enter |
ヘッダー行末でEnterを押すと次の行のヘッダーを解除 |
| テーブル | table backspace | Backspace |
テーブルセル先頭でのBackspaceを無効化(空ハンドラ) |
| テーブル | table delete | Delete |
テーブルセル末尾でのDeleteを無効化(空ハンドラ) |
| テーブル | table enter | Enter |
テーブル内でEnterを押すとテーブルの前後に改行を挿入 |
| テーブル | table tab |
Tab / Shift+Tab
|
テーブル内でTabを押すと次のセルに移動、Shift+Tabで前のセルに移動 |
| テーブル | table down | ArrowDown |
テーブル内で下のセルに移動 |
| テーブル | table up | ArrowUp |
テーブル内で上のセルに移動 |
| リスト | list autofill | Space |
1.、-、*、[ ]、[x]の後にスペースを入力するとリストに変換 |
| 埋め込み要素 | embed left | ArrowLeft |
埋め込み要素の左端で左矢印を押すと埋め込み要素の前に移動 |
| 埋め込み要素 | embed left shift | Shift+ArrowLeft |
埋め込み要素の左端でShift+左矢印を押すと埋め込み要素を選択範囲に含める |
| 埋め込み要素 | embed right | ArrowRight |
埋め込み要素の右端で右矢印を押すと埋め込み要素の後に移動 |
| 埋め込み要素 | embed right shift | Shift+ArrowRight |
埋め込み要素の右端でShift+右矢印を押すと埋め込み要素を選択範囲に含める |