bookish-press 0.4.47 → 0.4.49

package/{src/lib/components/editor/Commands.ts → components/editor/Commands.js}

@@ -1,30 +1,22 @@
-import CalloutNode from '$lib/models/chapter/CalloutNode';
-import type Caret from '$lib/models/chapter/Caret';
-import CitationsNode from '$lib/models/chapter/CitationsNode';
-import CodeNode from '$lib/models/chapter/CodeNode';
-import CommentNode from '$lib/models/chapter/CommentNode';
-import DefinitionNode from '$lib/models/chapter/DefinitionNode';
-import EmbedNode from '$lib/models/chapter/EmbedNode';
-import FootnoteNode from '$lib/models/chapter/FootnoteNode';
-import FormatNode from '$lib/models/chapter/FormatNode';
-import InlineCodeNode from '$lib/models/chapter/InlineCodeNode';
-import LabelNode from '$lib/models/chapter/LabelNode';
-import LinkNode from '$lib/models/chapter/LinkNode';
-import ListNode from '$lib/models/chapter/ListNode';
-import ParagraphNode from '$lib/models/chapter/ParagraphNode';
-import QuoteNode from '$lib/models/chapter/QuoteNode';
-import RuleNode from '$lib/models/chapter/RuleNode';
-import TableNode from '$lib/models/chapter/TableNode';
-import TextNode from '$lib/models/chapter/TextNode';
-import AtomNode from '$lib/models/chapter/AtomNode';
-import BlocksNode from '$lib/models/chapter/BlocksNode';
-
-import type RootNode from '$lib/models/chapter/RootNode';
-import type Edit from '$lib/models/chapter/Edit';
-import type Node from '$lib/models/chapter/Node';
-import type CaretContext from './CaretContext';
-import type Command from './Command';
-
+import CalloutNode from '../../models/chapter/CalloutNode';
+import CitationsNode from '../../models/chapter/CitationsNode';
+import CodeNode from '../../models/chapter/CodeNode';
+import CommentNode from '../../models/chapter/CommentNode';
+import DefinitionNode from '../../models/chapter/DefinitionNode';
+import EmbedNode from '../../models/chapter/EmbedNode';
+import FootnoteNode from '../../models/chapter/FootnoteNode';
+import FormatNode from '../../models/chapter/FormatNode';
+import InlineCodeNode from '../../models/chapter/InlineCodeNode';
+import LabelNode from '../../models/chapter/LabelNode';
+import LinkNode from '../../models/chapter/LinkNode';
+import ListNode from '../../models/chapter/ListNode';
+import ParagraphNode from '../../models/chapter/ParagraphNode';
+import QuoteNode from '../../models/chapter/QuoteNode';
+import RuleNode from '../../models/chapter/RuleNode';
+import TableNode from '../../models/chapter/TableNode';
+import TextNode from '../../models/chapter/TextNode';
+import AtomNode from '../../models/chapter/AtomNode';
+import BlocksNode from '../../models/chapter/BlocksNode';
 import BoldIcon from './icons/bold.svg?raw';
 import BulletsIcon from './icons/bullets.svg?raw';
 import CalloutIcon from './icons/callout.svg?raw';
@@ -61,7 +53,6 @@ import SuperscriptIcon from './icons/super.svg?raw';
 import TableIcon from './icons/table.svg?raw';
 import UndoIcon from './icons/undo.svg?raw';
 import UnindentIcon from './icons/unindent.svg?raw';
-import type { PasteContent } from './CaretContext';
 /**
  * Icons:
  *      From: https://www.streamlinehq.com/icons/streamline-mini-line
@@ -71,93 +62,53 @@ import type { PasteContent } from './CaretContext';
  *      48 px
  *      stroke width 1
  *  */
-
-function insertTableRowColumn(
-    context: CaretContext,
-    table: TableNode,
-    format: FormatNode,
-    row: boolean,
-    before: boolean
-): Edit {
+function insertTableRowColumn(context, table, format, row, before) {
     const location = table.locate(format);
-    if (location === undefined) return;
-    return rootWithNode(
-        context,
-        table,
-        row
-            ? table.withNewRow(location.row + (before ? 0 : 1))
-            : table.withNewColumn(location.column + (before ? 0 : 1)),
-        (t) =>
-            (
-                (t as TableNode).getCell(
-                    location.row + (row && !before ? 1 : 0),
-                    location.column + (!row && !before ? 1 : 0)
-                ) as FormatNode
-            ).getFirstCaret()
-    );
+    if (location === undefined)
+        return;
+    return rootWithNode(context, table, row
+        ? table.withNewRow(location.row + (before ? 0 : 1))
+        : table.withNewColumn(location.column + (before ? 0 : 1)), (t) => t.getCell(location.row + (row && !before ? 1 : 0), location.column + (!row && !before ? 1 : 0)).getFirstCaret());
 }
-
-function deleteTableRowColumn(
-    context: CaretContext,
-    table: TableNode,
-    format: FormatNode,
-    row: boolean
-): Edit {
+function deleteTableRowColumn(context, table, format, row) {
     const location = table.locate(format);
-    if (location === undefined) return;
-    return rootWithNode(
-        context,
-        table,
-        row
-            ? table.withoutRow(location.row)
-            : table.withoutColumn(location.column),
-        (t) => {
-            return (
-                row
-                    ? (t as TableNode).getCell(
-                          location.row === table.getRowCount()
-                              ? location.row - 1
-                              : location.row,
-                          location.column
-                      )
-                    : (t as TableNode).getCell(
-                          location.row,
-                          location.column === table.getColumnCount()
-                              ? location.column - 1
-                              : location.column
-                      )
-            )?.getFirstCaret();
-        }
-    );
+    if (location === undefined)
+        return;
+    return rootWithNode(context, table, row
+        ? table.withoutRow(location.row)
+        : table.withoutColumn(location.column), (t) => {
+        return (row
+            ? t.getCell(location.row === table.getRowCount()
+                ? location.row - 1
+                : location.row, location.column)
+            : t.getCell(location.row, location.column === table.getColumnCount()
+                ? location.column - 1
+                : location.column))?.getFirstCaret();
+    });
 }
-
 // A helper function that encapsulates boilerplate for replacing a node in a root and updating a caret.
-function rootWithNode<NodeType extends Node>(
-    context: CaretContext,
-    original: NodeType | undefined,
-    replacement: NodeType | undefined,
-    caret?: (node: NodeType) => Caret | undefined
-): Edit | undefined {
+function rootWithNode(context, original, replacement, caret) {
     // If there was no original or replacement, do nothing. Saves commands from having to check.
-    if (original === undefined || replacement === undefined) return;
+    if (original === undefined || replacement === undefined)
+        return;
     // Make the new root. Bail on fail.
     const newRoot = context.root.withNodeReplaced(original, replacement);
-    if (newRoot === undefined) return;
+    if (newRoot === undefined)
+        return;
     // Generate a new caret based on the replacement, if there's a generator. Bail on fail.
     const newCaret = caret?.call(undefined, replacement);
-    if (caret !== undefined && newCaret === undefined) return;
+    if (caret !== undefined && newCaret === undefined)
+        return;
     // Return the edit
     return {
         root: newRoot,
-        range:
-            newCaret !== undefined
-                ? { start: newCaret, end: newCaret }
-                : context.range,
+        range: newCaret !== undefined
+            ? { start: newCaret, end: newCaret }
+            : context.range,
     };
 }
-
 // An ordered list of command specifications for keyboard and mouse input.
-const commands: Command[] = [
+const commands = [
     {
         icon: RowAboveIcon,
         description: 'insert row above',
@@ -168,18 +119,10 @@ const commands: Command[] = [
         shift: false,
         key: 'ArrowUp',
         visible: (context) => context.table !== undefined,
-        active: (context) =>
-            context.table !== undefined && context.format !== undefined,
-        handler: (context) =>
-            context.table !== undefined && context.format !== undefined
-                ? insertTableRowColumn(
-                      context,
-                      context.table,
-                      context.format,
-                      true,
-                      true
-                  )
-                : undefined,
+        active: (context) => context.table !== undefined && context.format !== undefined,
+        handler: (context) => context.table !== undefined && context.format !== undefined
+            ? insertTableRowColumn(context, context.table, context.format, true, true)
+            : undefined,
     },
     {
         icon: RowBelowIcon,
@@ -191,18 +134,10 @@ const commands: Command[] = [
         shift: false,
         key: 'ArrowDown',
         visible: (context) => context.table !== undefined,
-        active: (context) =>
-            context.table !== undefined && context.format !== undefined,
-        handler: (context) =>
-            context.table !== undefined && context.format !== undefined
-                ? insertTableRowColumn(
-                      context,
-                      context.table,
-                      context.format,
-                      true,
-                      false
-                  )
-                : undefined,
+        active: (context) => context.table !== undefined && context.format !== undefined,
+        handler: (context) => context.table !== undefined && context.format !== undefined
+            ? insertTableRowColumn(context, context.table, context.format, true, false)
+            : undefined,
     },
     {
         icon: ColumnAfterIcon,
@@ -214,18 +149,10 @@ const commands: Command[] = [
         shift: false,
         key: 'ArrowRight',
         visible: (context) => context.table !== undefined,
-        active: (context) =>
-            context.table !== undefined && context.format !== undefined,
-        handler: (context) =>
-            context.table !== undefined && context.format !== undefined
-                ? insertTableRowColumn(
-                      context,
-                      context.table,
-                      context.format,
-                      false,
-                      false
-                  )
-                : undefined,
+        active: (context) => context.table !== undefined && context.format !== undefined,
+        handler: (context) => context.table !== undefined && context.format !== undefined
+            ? insertTableRowColumn(context, context.table, context.format, false, false)
+            : undefined,
     },
     {
         icon: ColumnBeforeIcon,
@@ -237,18 +164,10 @@ const commands: Command[] = [
         shift: false,
         key: 'ArrowLeft',
         visible: (context) => context.table !== undefined,
-        active: (context) =>
-            context.table !== undefined && context.format !== undefined,
-        handler: (context) =>
-            context.table !== undefined && context.format !== undefined
-                ? insertTableRowColumn(
-                      context,
-                      context.table,
-                      context.format,
-                      false,
-                      true
-                  )
-                : undefined,
+        active: (context) => context.table !== undefined && context.format !== undefined,
+        handler: (context) => context.table !== undefined && context.format !== undefined
+            ? insertTableRowColumn(context, context.table, context.format, false, true)
+            : undefined,
     },
     {
         icon: DeleteRowIcon,
@@ -260,19 +179,12 @@ const commands: Command[] = [
         shift: false,
         key: 'Backspace',
         visible: (context) => context.table !== undefined,
-        active: (context) =>
-            context.format !== undefined &&
+        active: (context) => context.format !== undefined &&
             context.table !== undefined &&
             context.table.getRowCount() > 1,
-        handler: (context) =>
-            context.format !== undefined && context.table !== undefined
-                ? deleteTableRowColumn(
-                      context,
-                      context.table,
-                      context.format,
-                      true
-                  )
-                : undefined,
+        handler: (context) => context.format !== undefined && context.table !== undefined
+            ? deleteTableRowColumn(context, context.table, context.format, true)
+            : undefined,
     },
     {
         icon: DeleteColumnIcon,
@@ -284,19 +196,12 @@ const commands: Command[] = [
         shift: true,
         key: 'Backspace',
         visible: (context) => context.table !== undefined,
-        active: (context) =>
-            context.format !== undefined &&
+        active: (context) => context.format !== undefined &&
             context.table !== undefined &&
             context.table.getColumnCount() > 1,
-        handler: (context) =>
-            context.format !== undefined && context.table !== undefined
-                ? deleteTableRowColumn(
-                      context,
-                      context.table,
-                      context.format,
-                      false
-                  )
-                : undefined,
+        handler: (context) => context.format !== undefined && context.table !== undefined
+            ? deleteTableRowColumn(context, context.table, context.format, false)
+            : undefined,
     },
     {
         icon: '➡️',
@@ -312,10 +217,7 @@ const commands: Command[] = [
         handler: (context) => {
             if (context.format) {
                 let caret = context.root
-                    .getNodeAfter<FormatNode>(
-                        context.format,
-                        (node): node is FormatNode => node instanceof FormatNode
-                    )
+                    .getNodeAfter(context.format, (node) => node instanceof FormatNode)
                     ?.getFirstCaret();
                 if (caret)
                     return {
@@ -340,10 +242,7 @@ const commands: Command[] = [
         handler: (context) => {
             if (context.format) {
                 let caret = context.root
-                    .getNodeBefore<FormatNode>(
-                        context.format,
-                        (node): node is FormatNode => node instanceof FormatNode
-                    )
+                    .getNodeBefore(context.format, (node) => node instanceof FormatNode)
                     ?.getFirstCaret();
                 if (caret)
                     return {
@@ -365,25 +264,19 @@ const commands: Command[] = [
         visible: () => false,
         active: (context) => context.endIsTextOrAtom,
         handler: (context) => {
-            if (
-                context.end.node instanceof TextNode ||
+            if (context.end.node instanceof TextNode ||
                 context.end.node instanceof AtomNode ||
-                context.end.node instanceof EmbedNode
-            ) {
-                const nextCaret = context.root.getAdjacentCaret(
-                    context.end,
-                    false
-                );
+                context.end.node instanceof EmbedNode) {
+                const nextCaret = context.root.getAdjacentCaret(context.end, false);
                 const sortedRange = context.root.sortRange(context.range);
                 return {
                     root: context.root,
-                    range:
-                        nextCaret === undefined
-                            ? {
-                                  start: sortedRange.start,
-                                  end: sortedRange.start,
-                              }
-                            : { start: nextCaret, end: nextCaret },
+                    range: nextCaret === undefined
+                        ? {
+                            start: sortedRange.start,
+                            end: sortedRange.start,
+                        }
+                        : { start: nextCaret, end: nextCaret },
                 };
             }
         },
@@ -400,15 +293,10 @@ const commands: Command[] = [
         visible: false,
         active: (context) => context.endIsTextOrAtom,
         handler: (context) => {
-            if (
-                context.end.node instanceof TextNode ||
+            if (context.end.node instanceof TextNode ||
                 context.end.node instanceof AtomNode ||
-                context.end.node instanceof EmbedNode
-            ) {
-                const previous = context.end.node.previousWord(
-                    context.root,
-                    context.end.index
-                );
+                context.end.node instanceof EmbedNode) {
+                const previous = context.end.node.previousWord(context.root, context.end.index);
                 return {
                     root: context.root,
                     range: { start: previous, end: previous },
@@ -452,16 +340,12 @@ const commands: Command[] = [
         visible: false,
         active: (context) => context.endIsTextOrAtom,
         handler: (context) => {
-            if (
-                context.end.node instanceof TextNode ||
+            if (context.end.node instanceof TextNode ||
                 context.end.node instanceof AtomNode ||
-                context.end.node instanceof EmbedNode
-            ) {
-                const previous = context.root.getAdjacentCaret(
-                    context.end,
-                    false
-                );
-                if (previous === undefined) return;
+                context.end.node instanceof EmbedNode) {
+                const previous = context.root.getAdjacentCaret(context.end, false);
+                if (previous === undefined)
+                    return;
                 return {
                     root: context.root,
                     range: { start: context.start, end: previous },
@@ -481,15 +365,10 @@ const commands: Command[] = [
         visible: false,
         active: (context) => context.endIsTextOrAtom,
         handler: (context) => {
-            if (
-                context.end.node instanceof TextNode ||
+            if (context.end.node instanceof TextNode ||
                 context.end.node instanceof AtomNode ||
-                context.end.node instanceof EmbedNode
-            ) {
-                const previous = context.end.node.previousWord(
-                    context.root,
-                    context.end.index
-                );
+                context.end.node instanceof EmbedNode) {
+                const previous = context.end.node.previousWord(context.root, context.end.index);
                 return {
                     root: context.root,
                     range: { start: context.start, end: previous },
@@ -533,23 +412,17 @@ const commands: Command[] = [
         visible: false,
         active: (context) => context.endIsTextOrAtom,
         handler: (context) => {
-            if (
-                context.end.node instanceof TextNode ||
+            if (context.end.node instanceof TextNode ||
                 context.end.node instanceof AtomNode ||
-                context.end.node instanceof EmbedNode
-            ) {
-                const nextCaret = context.root.getAdjacentCaret(
-                    context.end,
-                    true
-                );
+                context.end.node instanceof EmbedNode) {
+                const nextCaret = context.root.getAdjacentCaret(context.end, true);
                 const sortedRange = context.root.sortRange(context.range);
                 // If there is no next caret, move the caret to the largest of the current start and end.
                 return {
                     root: context.root,
-                    range:
-                        nextCaret === undefined
-                            ? { start: sortedRange.end, end: sortedRange.end }
-                            : { start: nextCaret, end: nextCaret },
+                    range: nextCaret === undefined
+                        ? { start: sortedRange.end, end: sortedRange.end }
+                        : { start: nextCaret, end: nextCaret },
                 };
             }
         },
@@ -566,15 +439,10 @@ const commands: Command[] = [
         visible: false,
         active: (context) => context.endIsTextOrAtom,
         handler: (context) => {
-            if (
-                context.end.node instanceof TextNode ||
+            if (context.end.node instanceof TextNode ||
                 context.end.node instanceof AtomNode ||
-                context.end.node instanceof EmbedNode
-            ) {
-                const next = context.end.node.nextWord(
-                    context.root,
-                    context.end.index
-                );
+                context.end.node instanceof EmbedNode) {
+                const next = context.end.node.nextWord(context.root, context.end.index);
                 return {
                     root: context.root,
                     range: { start: next, end: next },
@@ -616,13 +484,12 @@ const commands: Command[] = [
         visible: false,
         active: (context) => context.endIsTextOrAtom,
         handler: (context) => {
-            if (
-                context.end.node instanceof TextNode ||
+            if (context.end.node instanceof TextNode ||
                 context.end.node instanceof AtomNode ||
-                context.end.node instanceof EmbedNode
-            ) {
+                context.end.node instanceof EmbedNode) {
                 const next = context.root.getAdjacentCaret(context.end, true);
-                if (next === undefined) return;
+                if (next === undefined)
+                    return;
                 return {
                     root: context.root,
                     range: { start: context.start, end: next },
@@ -642,15 +509,10 @@ const commands: Command[] = [
         visible: false,
         active: (context) => context.endIsTextOrAtom,
         handler: (context) => {
-            if (
-                context.end.node instanceof TextNode ||
+            if (context.end.node instanceof TextNode ||
                 context.end.node instanceof AtomNode ||
-                context.end.node instanceof EmbedNode
-            ) {
-                const previous = context.end.node.nextWord(
-                    context.root,
-                    context.end.index
-                );
+                context.end.node instanceof EmbedNode) {
+                const previous = context.end.node.nextWord(context.root, context.end.index);
                 return {
                     root: context.root,
                     range: { start: context.start, end: previous },
@@ -706,10 +568,8 @@ const commands: Command[] = [
                 };
             }
             // If in a code node, expand to the code.
-            else if (
-                context.block instanceof CodeNode &&
-                context.range.start.node === context.block.getCodeNode()
-            ) {
+            else if (context.block instanceof CodeNode &&
+                context.range.start.node === context.block.getCodeNode()) {
                 const code = context.block.getCodeNode();
                 return {
                     root: context.root,
@@ -720,11 +580,9 @@ const commands: Command[] = [
                 };
             }
             // If in a non paragraph block, expand to the format of whatever format we're in.
-            else if (
-                context.paragraph === undefined &&
+            else if (context.paragraph === undefined &&
                 context.block &&
-                context.format
-            ) {
+                context.format) {
                 return {
                     root: context.root,
                     range: {
@@ -732,7 +590,8 @@ const commands: Command[] = [
                         end: context.format.getLastCaret(),
                     },
                 };
-            } else {
+            }
+            else {
                 // Find the first and last caret of the entire chapter.
                 const text = context.root?.getTextNodes();
                 if (text && text.length > 0) {
@@ -832,31 +691,19 @@ const commands: Command[] = [
         visible: false,
         active: true,
         handler: (context) => {
-            if (context.root === undefined) return;
+            if (context.root === undefined)
+                return;
             if (context.isSelection) {
-                const edit = context.root.withRangeFormatted(
-                    context.range,
-                    undefined
-                );
-                if (edit === undefined) return;
-                return rootWithNode<RootNode>(
-                    context,
-                    context.root,
-                    edit.root as RootNode,
-                    () => edit.range.start
-                );
-            } else {
-                const edit = context.root.withoutAdjacentContent(
-                    context.start,
-                    false
-                );
-                if (edit === undefined) return;
-                return rootWithNode<RootNode>(
-                    context,
-                    context.root,
-                    edit.root as RootNode,
-                    () => edit.range.start
-                );
+                const edit = context.root.withRangeFormatted(context.range, undefined);
+                if (edit === undefined)
+                    return;
+                return rootWithNode(context, context.root, edit.root, () => edit.range.start);
+            }
+            else {
+                const edit = context.root.withoutAdjacentContent(context.start, false);
+                if (edit === undefined)
+                    return;
+                return rootWithNode(context, context.root, edit.root, () => edit.range.start);
             }
         },
     },
@@ -872,31 +719,19 @@ const commands: Command[] = [
         visible: false,
         active: true,
         handler: (context) => {
-            if (context.root === undefined) return;
+            if (context.root === undefined)
+                return;
             if (context.isSelection) {
-                const edit = context.root.withRangeFormatted(
-                    context.range,
-                    undefined
-                );
-                if (edit === undefined) return;
-                return rootWithNode<RootNode>(
-                    context,
-                    context.root,
-                    edit.root as RootNode,
-                    () => edit.range.start
-                );
-            } else {
-                const edit = context.root.withoutAdjacentContent(
-                    context.start,
-                    true
-                );
-                if (edit === undefined) return;
-                return rootWithNode<RootNode>(
-                    context,
-                    context.root,
-                    edit.root as RootNode,
-                    () => edit.range.start
-                );
+                const edit = context.root.withRangeFormatted(context.range, undefined);
+                if (edit === undefined)
+                    return;
+                return rootWithNode(context, context.root, edit.root, () => edit.range.start);
+            }
+            else {
+                const edit = context.root.withoutAdjacentContent(context.start, true);
+                if (edit === undefined)
+                    return;
+                return rootWithNode(context, context.root, edit.root, () => edit.range.start);
             }
         },
     },
@@ -912,20 +747,14 @@ const commands: Command[] = [
         visible: false,
         active: (context) => context.code !== undefined,
         handler: (context) => {
-            if (context.code?.getCodeNode() !== context.start.node) return;
-            const newText = context.start.node.withCharacterAt(
-                '\n',
-                context.start.index
-            );
-            if (newText === undefined) return;
-            return rootWithNode(
-                context,
-                context.start.node,
-                newText,
-                (text) => {
-                    return { node: text, index: context.start.index + 1 };
-                }
-            );
+            if (context.code?.getCodeNode() !== context.start.node)
+                return;
+            const newText = context.start.node.withCharacterAt('\n', context.start.index);
+            if (newText === undefined)
+                return;
+            return rootWithNode(context, context.start.node, newText, (text) => {
+                return { node: text, index: context.start.index + 1 };
+            });
         },
     },
     {
@@ -940,69 +769,52 @@ const commands: Command[] = [
         visible: false,
         active: (context) => context.list !== undefined,
         handler: (context) => {
-            if (context.list === undefined) return;
+            if (context.list === undefined)
+                return;
             const lastItem = context.list.getLastItem();
             const lastCaret = lastItem?.getLastCaret();
             // If we're at the last item in the list and it's empty, then add a
-            if (
-                lastItem !== undefined &&
+            if (lastItem !== undefined &&
                 lastCaret !== undefined &&
                 lastCaret.node instanceof TextNode &&
                 lastCaret.node.getLength() === 0 &&
                 lastCaret.node === context.end.node &&
-                lastCaret.index === context.end.index
-            ) {
+                lastCaret.index === context.end.index) {
                 const listParent = context.list.getParent(context.root);
                 if (listParent instanceof ListNode) {
                     const newSublist = context.list.withoutItem(lastItem);
-                    if (newSublist === undefined) return;
-                    const newListWithoutSublistItem =
-                        listParent.withChildReplaced(context.list, newSublist);
-                    if (newListWithoutSublistItem === undefined) return;
-                    const newListWithSublistItem =
-                        newListWithoutSublistItem.withItemAfter(
-                            lastItem,
-                            newSublist
-                        );
-                    if (newListWithSublistItem === undefined) return;
-                    return rootWithNode(
-                        context,
-                        listParent,
-                        newListWithSublistItem,
-                        () => lastCaret
-                    );
-                } else if (listParent instanceof BlocksNode) {
+                    if (newSublist === undefined)
+                        return;
+                    const newListWithoutSublistItem = listParent.withChildReplaced(context.list, newSublist);
+                    if (newListWithoutSublistItem === undefined)
+                        return;
+                    const newListWithSublistItem = newListWithoutSublistItem.withItemAfter(lastItem, newSublist);
+                    if (newListWithSublistItem === undefined)
+                        return;
+                    return rootWithNode(context, listParent, newListWithSublistItem, () => lastCaret);
+                }
+                else if (listParent instanceof BlocksNode) {
                     const listWithoutItem = context.list.withoutItem(lastItem);
-                    if (listWithoutItem === undefined) return;
+                    if (listWithoutItem === undefined)
+                        return;
                     const newBlocks = listParent
                         .withChildReplaced(context.list, listWithoutItem)
-                        ?.withBlockInsertedAfter(
-                            listWithoutItem,
-                            new ParagraphNode(0, lastItem)
-                        );
-                    if (newBlocks === undefined) return;
-                    return rootWithNode(
-                        context,
-                        listParent,
-                        newBlocks,
-                        () => lastCaret
-                    );
+                        ?.withBlockInsertedAfter(listWithoutItem, new ParagraphNode(0, lastItem));
+                    if (newBlocks === undefined)
+                        return;
+                    return rootWithNode(context, listParent, newBlocks, () => lastCaret);
                 }
-            } else
-                return rootWithNode(
-                    context,
-                    context.list,
-                    context.list?.withItemSplit(context.range.start),
-                    (newList) => {
-                        const index = context.list?.getItemContaining(
-                            context.range.start
-                        );
-                        if (index === undefined) return;
-                        const item = (newList as ListNode).getItem(index + 1);
-                        if (item === undefined) return;
-                        return item.getFirstCaret();
-                    }
-                );
+            }
+            else
+                return rootWithNode(context, context.list, context.list?.withItemSplit(context.range.start), (newList) => {
+                    const index = context.list?.getItemContaining(context.range.start);
+                    if (index === undefined)
+                        return;
+                    const item = newList.getItem(index + 1);
+                    if (item === undefined)
+                        return;
+                    return item.getFirstCaret();
+                });
         },
     },
     {
@@ -1015,17 +827,12 @@ const commands: Command[] = [
         shift: false,
         key: 'Enter',
         visible: false,
-        active: (context) =>
-            context.atom === undefined && context.blocks !== undefined,
+        active: (context) => context.atom === undefined && context.blocks !== undefined,
         handler: (context) => {
             const edit = context.blocks?.withSelectionSplit(context.range);
-            if (edit === undefined) return;
-            return rootWithNode(
-                context,
-                context.blocks,
-                edit.root,
-                () => edit.range.start
-            );
+            if (edit === undefined)
+                return;
+            return rootWithNode(context, context.blocks, edit.root, () => edit.range.start);
         },
     },
     {
@@ -1039,12 +846,7 @@ const commands: Command[] = [
         key: 'Tab',
         visible: (context) => context.list !== undefined,
         active: (context) => context.list !== undefined,
-        handler: (context) =>
-            rootWithNode(
-                context,
-                context.blocks,
-                context.blocks?.withListsIndented(context.range, true)
-            ),
+        handler: (context) => rootWithNode(context, context.blocks, context.blocks?.withListsIndented(context.range, true)),
     },
     {
         icon: UnindentIcon,
@@ -1056,15 +858,9 @@ const commands: Command[] = [
         shift: true,
         key: 'Tab',
         visible: (context) => context.list !== undefined,
-        active: (context) =>
-            context.list !== undefined &&
+        active: (context) => context.list !== undefined &&
             context.list.isInside(context.root, ListNode),
-        handler: (context) =>
-            rootWithNode(
-                context,
-                context.blocks,
-                context.blocks?.withListsIndented(context.range, false)
-            ),
+        handler: (context) => rootWithNode(context, context.blocks, context.blocks?.withListsIndented(context.range, false)),
     },
     {
         icon: ClearIcon,
@@ -1077,8 +873,7 @@ const commands: Command[] = [
         key: '0',
         visible: true,
         active: (context) => context.startIsText || context.endIsText,
-        handler: (context) =>
-            context.root.withRangeFormatted(context.range, ''),
+        handler: (context) => context.root.withRangeFormatted(context.range, ''),
     },
     {
         icon: BoldIcon,
@@ -1091,8 +886,7 @@ const commands: Command[] = [
         key: 'b',
         visible: true,
         active: (context) => context.startIsText || context.endIsText,
-        handler: (context) =>
-            context.root.withRangeFormatted(context.range, '*'),
+        handler: (context) => context.root.withRangeFormatted(context.range, '*'),
     },
     {
         description: 'italic',
@@ -1105,8 +899,7 @@ const commands: Command[] = [
         key: 'i',
         visible: true,
         active: (context) => context.startIsText || context.endIsText,
-        handler: (context) =>
-            context.root.withRangeFormatted(context.range, '_'),
+        handler: (context) => context.root.withRangeFormatted(context.range, '_'),
     },
     {
         icon: SubscriptIcon,
@@ -1119,8 +912,7 @@ const commands: Command[] = [
         key: ',',
         visible: true,
         active: (context) => context.startIsText || context.endIsText,
-        handler: (context) =>
-            context.root.withRangeFormatted(context.range, 'v'),
+        handler: (context) => context.root.withRangeFormatted(context.range, 'v'),
     },
     {
         icon: SuperscriptIcon,
@@ -1133,8 +925,7 @@ const commands: Command[] = [
         key: '.',
         visible: true,
         active: (context) => context.startIsText || context.endIsText,
-        handler: (context) =>
-            context.root.withRangeFormatted(context.range, '^'),
+        handler: (context) => context.root.withRangeFormatted(context.range, '^'),
     },
     {
         icon: CodeIcon,
@@ -1147,20 +938,9 @@ const commands: Command[] = [
         key: 'e',
         visible: true,
         active: (context) => context.startIsText || context.endIsText,
-        handler: (context) =>
-            context.meta instanceof InlineCodeNode
-                ? rootWithNode(
-                      context,
-                      context.format,
-                      context.format?.withSegmentReplaced(
-                          context.meta,
-                          context.meta.getText()
-                      )
-                  )
-                : context.root.withSegmentAtSelection(
-                      context.range,
-                      (text) => new InlineCodeNode(new TextNode(text))
-                  ),
+        handler: (context) => context.meta instanceof InlineCodeNode
+            ? rootWithNode(context, context.format, context.format?.withSegmentReplaced(context.meta, context.meta.getText()))
+            : context.root.withSegmentAtSelection(context.range, (text) => new InlineCodeNode(new TextNode(text))),
     },
     {
         icon: LinkIcon,
@@ -1172,23 +952,11 @@ const commands: Command[] = [
         shift: false,
         key: 'k',
         visible: true,
-        active: (context) =>
-            (context.atom === undefined && context.meta === undefined) ||
+        active: (context) => (context.atom === undefined && context.meta === undefined) ||
             context.meta instanceof LinkNode,
-        handler: (context) =>
-            context.meta instanceof LinkNode
-                ? rootWithNode(
-                      context,
-                      context.format,
-                      context.format?.withSegmentReplaced(
-                          context.meta,
-                          context.meta.getText()
-                      )
-                  )
-                : context.root.withSegmentAtSelection(
-                      context.range,
-                      (text) => new LinkNode(new TextNode(text))
-                  ),
+        handler: (context) => context.meta instanceof LinkNode
+            ? rootWithNode(context, context.format, context.format?.withSegmentReplaced(context.meta, context.meta.getText()))
+            : context.root.withSegmentAtSelection(context.range, (text) => new LinkNode(new TextNode(text))),
     },
     {
         icon: DefineIcon,
@@ -1199,28 +967,15 @@ const commands: Command[] = [
         alt: false,
         shift: false,
         key: 'd',
-        visible: (context) =>
-            context.chapter &&
+        visible: (context) => context.chapter &&
             context.atom === undefined &&
             context.meta === undefined,
-        active: (context) =>
-            context.chapter &&
+        active: (context) => context.chapter &&
             context.atom === undefined &&
             context.meta === undefined,
-        handler: (context) =>
-            context.meta instanceof DefinitionNode
-                ? rootWithNode(
-                      context,
-                      context.format,
-                      context.format?.withSegmentReplaced(
-                          context.meta,
-                          context.meta.getText()
-                      )
-                  )
-                : context.root.withSegmentAtSelection(
-                      context.range,
-                      (text) => new DefinitionNode(new TextNode(text))
-                  ),
+        handler: (context) => context.meta instanceof DefinitionNode
+            ? rootWithNode(context, context.format, context.format?.withSegmentReplaced(context.meta, context.meta.getText()))
+            : context.root.withSegmentAtSelection(context.range, (text) => new DefinitionNode(new TextNode(text))),
     },
     {
         icon: FootnoteIcon,
@@ -1231,20 +986,13 @@ const commands: Command[] = [
         alt: false,
         shift: false,
         key: 'f',
-        visible: (context) =>
-            context.chapter &&
+        visible: (context) => context.chapter &&
             context.atom === undefined &&
             context.meta === undefined,
-        active: (context) =>
-            context.chapter &&
+        active: (context) => context.chapter &&
             context.atom === undefined &&
             context.meta === undefined,
-        handler: (context) =>
-            context.root.withSegmentAtSelection(
-                context.range,
-                (text) =>
-                    new FootnoteNode(new FormatNode('', [new TextNode(text)]))
-            ),
+        handler: (context) => context.root.withSegmentAtSelection(context.range, (text) => new FootnoteNode(new FormatNode('', [new TextNode(text)]))),
     },
     {
         icon: CitationIcon,
@@ -1255,19 +1003,13 @@ const commands: Command[] = [
         alt: false,
         shift: false,
         key: 'o',
-        visible: (context) =>
-            context.chapter &&
+        visible: (context) => context.chapter &&
             context.atom === undefined &&
             context.meta === undefined,
-        active: (context) =>
-            context.chapter &&
+        active: (context) => context.chapter &&
             context.atom === undefined &&
             context.meta === undefined,
-        handler: (context) =>
-            context.root.withSegmentAtSelection(
-                context.range,
-                () => new CitationsNode([])
-            ),
+        handler: (context) => context.root.withSegmentAtSelection(context.range, () => new CitationsNode([])),
     },
     {
         icon: LabelIcon,
@@ -1278,19 +1020,13 @@ const commands: Command[] = [
         alt: false,
         shift: false,
         key: 'l',
-        visible: (context) =>
-            context.chapter &&
+        visible: (context) => context.chapter &&
             context.atom === undefined &&
             context.meta === undefined,
-        active: (context) =>
-            context.chapter &&
+        active: (context) => context.chapter &&
             context.atom === undefined &&
             context.meta === undefined,
-        handler: (context) =>
-            context.root.withSegmentAtSelection(
-                context.range,
-                () => new LabelNode('')
-            ),
+        handler: (context) => context.root.withSegmentAtSelection(context.range, () => new LabelNode('')),
     },
     {
         icon: CommentIcon,
@@ -1301,20 +1037,13 @@ const commands: Command[] = [
         alt: false,
         shift: false,
         key: "'",
-        visible: (context) =>
-            context.chapter &&
+        visible: (context) => context.chapter &&
             context.atom === undefined &&
             context.meta === undefined,
-        active: (context) =>
-            context.chapter &&
+        active: (context) => context.chapter &&
             context.atom === undefined &&
             context.meta === undefined,
-        handler: (context) =>
-            context.root.withSegmentAtSelection(
-                context.range,
-                (text) =>
-                    new CommentNode(new FormatNode('', [new TextNode(text)]))
-            ),
+        handler: (context) => context.root.withSegmentAtSelection(context.range, (text) => new CommentNode(new FormatNode('', [new TextNode(text)]))),
     },
     {
         icon: ParagraphIcon,
@@ -1325,19 +1054,14 @@ const commands: Command[] = [
         alt: true,
         shift: false,
         code: 'Digit0',
-        visible: (context) =>
-            context.paragraph !== undefined &&
+        visible: (context) => context.paragraph !== undefined &&
             context.paragraph.getLevel() !== 0,
-        active: (context) =>
-            context.paragraph !== undefined &&
+        active: (context) => context.paragraph !== undefined &&
             context.paragraph.getLevel() !== 0,
         handler: (context) => {
-            if (context.paragraph === undefined) return;
-            return rootWithNode(
-                context,
-                context.paragraph,
-                context.paragraph.withLevel(0)
-            );
+            if (context.paragraph === undefined)
+                return;
+            return rootWithNode(context, context.paragraph, context.paragraph.withLevel(0));
         },
     },
     {
@@ -1350,15 +1074,9 @@ const commands: Command[] = [
         shift: false,
         code: 'Digit1',
         visible: (context) => context.paragraph !== undefined,
-        active: (context) =>
-            context.paragraph !== undefined &&
+        active: (context) => context.paragraph !== undefined &&
             context.paragraph.getLevel() !== 1,
-        handler: (context) =>
-            rootWithNode(
-                context,
-                context.paragraph,
-                context.paragraph?.withLevel(1)
-            ),
+        handler: (context) => rootWithNode(context, context.paragraph, context.paragraph?.withLevel(1)),
     },
     {
         icon: Header2Icon,
@@ -1370,15 +1088,9 @@ const commands: Command[] = [
         shift: false,
         code: 'Digit2',
         visible: (context) => context.paragraph !== undefined,
-        active: (context) =>
-            context.paragraph !== undefined &&
+        active: (context) => context.paragraph !== undefined &&
             context.paragraph.getLevel() !== 2,
-        handler: (context) =>
-            rootWithNode(
-                context,
-                context.paragraph,
-                context.paragraph?.withLevel(2)
-            ),
+        handler: (context) => rootWithNode(context, context.paragraph, context.paragraph?.withLevel(2)),
     },
     {
         icon: Header3Icon,
@@ -1390,15 +1102,9 @@ const commands: Command[] = [
         shift: false,
         code: 'Digit3',
         visible: (context) => context.paragraph !== undefined,
-        active: (context) =>
-            context.paragraph !== undefined &&
+        active: (context) => context.paragraph !== undefined &&
             context.paragraph.getLevel() !== 3,
-        handler: (context) =>
-            rootWithNode(
-                context,
-                context.paragraph,
-                context.paragraph?.withLevel(3)
-            ),
+        handler: (context) => rootWithNode(context, context.paragraph, context.paragraph?.withLevel(3)),
     },
     {
         icon: RuleIcon,
@@ -1410,19 +1116,10 @@ const commands: Command[] = [
         shift: false,
         key: 'u',
         visible: (context) => context.paragraph !== undefined,
-        active: (context) =>
-            context.paragraph !== undefined && context.atParagraphStart,
-        handler: (context) =>
-            context.paragraph
-                ? rootWithNode(
-                      context,
-                      context.blocks,
-                      context.blocks?.withBlockInsertedBefore(
-                          context.paragraph,
-                          new RuleNode()
-                      )
-                  )
-                : undefined,
+        active: (context) => context.paragraph !== undefined && context.atParagraphStart,
+        handler: (context) => context.paragraph
+            ? rootWithNode(context, context.blocks, context.blocks?.withBlockInsertedBefore(context.paragraph, new RuleNode()))
+            : undefined,
     },
     {
         icon: CalloutIcon,
@@ -1434,22 +1131,13 @@ const commands: Command[] = [
         shift: true,
         key: '-',
         visible: (context) => context.paragraph !== undefined,
-        active: (context) =>
-            context.paragraph !== undefined && context.atParagraphStart,
+        active: (context) => context.paragraph !== undefined && context.atParagraphStart,
         handler: (context) => {
             // If the caret is in a paragraph in a blocks node, insert a callout before the current paragraph.
             if (context.blocks && context.paragraph) {
                 // Make a new callout node with an empty paragraph, insert it before the paragraph the caret is in, and place the caret inside the empty paragraph.
                 const newParagraph = new ParagraphNode();
-                return rootWithNode(
-                    context,
-                    context.blocks,
-                    context.blocks.withBlockInsertedBefore(
-                        context.paragraph,
-                        new CalloutNode([newParagraph])
-                    ),
-                    () => newParagraph.getFirstCaret()
-                );
+                return rootWithNode(context, context.blocks, context.blocks.withBlockInsertedBefore(context.paragraph, new CalloutNode([newParagraph])), () => newParagraph.getFirstCaret());
             }
         },
     },
@@ -1463,21 +1151,12 @@ const commands: Command[] = [
         shift: true,
         key: "'",
         visible: (context) => context.paragraph !== undefined,
-        active: (context) =>
-            context.paragraph !== undefined && context.atParagraphStart,
+        active: (context) => context.paragraph !== undefined && context.atParagraphStart,
         handler: (context) => {
             if (context.blocks && context.paragraph) {
                 // Make a new quote and place the caret inside the quote's first empty paragraph.
                 const newParagraph = new ParagraphNode();
-                return rootWithNode(
-                    context,
-                    context.blocks,
-                    context.blocks.withBlockInsertedBefore(
-                        context.paragraph,
-                        new QuoteNode([newParagraph])
-                    ),
-                    () => newParagraph.getFirstCaret()
-                );
+                return rootWithNode(context, context.blocks, context.blocks.withBlockInsertedBefore(context.paragraph, new QuoteNode([newParagraph])), () => newParagraph.getFirstCaret());
             }
         },
     },
@@ -1491,22 +1170,13 @@ const commands: Command[] = [
         shift: true,
         key: 's',
         visible: (context) => context.paragraph !== undefined,
-        active: (context) =>
-            context.paragraph !== undefined && context.atParagraphStart,
+        active: (context) => context.paragraph !== undefined && context.atParagraphStart,
         handler: (context) => {
             if (context.blocks && context.paragraph) {
                 const newCode = new CodeNode(new TextNode(), 'plaintext', '|');
-                return rootWithNode(
-                    context,
-                    context.blocks,
-                    context.blocks.withBlockInsertedBefore(
-                        context.paragraph,
-                        newCode
-                    ),
-                    () => {
-                        return { node: newCode.getCodeNode(), index: 0 };
-                    }
-                );
+                return rootWithNode(context, context.blocks, context.blocks.withBlockInsertedBefore(context.paragraph, newCode), () => {
+                    return { node: newCode.getCodeNode(), index: 0 };
+                });
             }
         },
     },
@@ -1520,21 +1190,12 @@ const commands: Command[] = [
         shift: true,
         key: 'i',
         visible: (context) => context.paragraph !== undefined,
-        active: (context) =>
-            context.paragraph !== undefined && context.atParagraphStart,
+        active: (context) => context.paragraph !== undefined && context.atParagraphStart,
         handler: (context) => {
             if (context.blocks && context.paragraph) {
                 // Place the caret inside the code's code node.
                 const newEmbed = new EmbedNode('', '');
-                return rootWithNode(
-                    context,
-                    context.blocks,
-                    context.blocks.withBlockInsertedBefore(
-                        context.paragraph,
-                        newEmbed
-                    ),
-                    () => newEmbed.getCaption().getFirstCaret()
-                );
+                return rootWithNode(context, context.blocks, context.blocks.withBlockInsertedBefore(context.paragraph, newEmbed), () => newEmbed.getCaption().getFirstCaret());
             }
         },
     },
@@ -1548,36 +1209,23 @@ const commands: Command[] = [
         shift: false,
         key: '[',
         visible: (context) => context.paragraph !== undefined,
-        active: (context) =>
-            context.paragraph !== undefined && context.atParagraphStart,
+        active: (context) => context.paragraph !== undefined && context.atParagraphStart,
         handler: (context) => {
             if (context.blocks && context.paragraph) {
                 // Create a 3x3 of table rows and columns
                 // Return a caret corresponding to the first cell.
-                const newRows: FormatNode[][] = [[], [], []];
+                const newRows = [[], [], []];
                 for (let r = 0; r < Math.max(1, 3); r++) {
                     for (let c = 0; c < Math.max(1, 3); c++)
                         newRows[r].push(new FormatNode('', [new TextNode()]));
                 }
-                const newTable = new TableNode(
-                    newRows,
-                    '|',
-                    new FormatNode('', [new TextNode()])
-                );
-                return rootWithNode(
-                    context,
-                    context.blocks,
-                    context.blocks.withBlockInsertedBefore(
-                        context.paragraph,
-                        newTable
-                    ),
-                    () => {
-                        return {
-                            node: newTable.getRows()[0][0].getTextNodes()[0],
-                            index: 0,
-                        };
-                    }
-                );
+                const newTable = new TableNode(newRows, '|', new FormatNode('', [new TextNode()]));
+                return rootWithNode(context, context.blocks, context.blocks.withBlockInsertedBefore(context.paragraph, newTable), () => {
+                    return {
+                        node: newTable.getRows()[0][0].getTextNodes()[0],
+                        index: 0,
+                    };
+                });
             }
         },
     },
@@ -1590,16 +1238,9 @@ const commands: Command[] = [
         alt: false,
         shift: true,
         key: '7',
-        visible: (context) =>
-            context.paragraph !== undefined && context.list === undefined,
-        active: (context) =>
-            context.paragraph !== undefined && context.list === undefined,
-        handler: (context) =>
-            rootWithNode(
-                context,
-                context.blocks,
-                context.blocks?.withParagraphsAsLists(context.range, false)
-            ),
+        visible: (context) => context.paragraph !== undefined && context.list === undefined,
+        active: (context) => context.paragraph !== undefined && context.list === undefined,
+        handler: (context) => rootWithNode(context, context.blocks, context.blocks?.withParagraphsAsLists(context.range, false)),
     },
     {
         icon: NumbersIcon,
@@ -1610,16 +1251,9 @@ const commands: Command[] = [
         alt: false,
         shift: true,
         key: '8',
-        visible: (context) =>
-            context.paragraph !== undefined && context.list === undefined,
-        active: (context) =>
-            context.paragraph !== undefined && context.list === undefined,
-        handler: (context) =>
-            rootWithNode(
-                context,
-                context.blocks,
-                context.blocks?.withParagraphsAsLists(context.range, true)
-            ),
+        visible: (context) => context.paragraph !== undefined && context.list === undefined,
+        active: (context) => context.paragraph !== undefined && context.list === undefined,
+        handler: (context) => rootWithNode(context, context.blocks, context.blocks?.withParagraphsAsLists(context.range, true)),
     },
     {
         icon: BulletsIcon,
@@ -1630,18 +1264,11 @@ const commands: Command[] = [
         alt: false,
         shift: true,
         key: '7',
-        visible: (context) =>
-            context.list !== undefined && context.list.isNumbered(),
-        active: (context) =>
-            context.list !== undefined && context.list.isNumbered(),
-        handler: (context) =>
-            context.list
-                ? rootWithNode(
-                      context,
-                      context.blocks,
-                      context.blocks?.withListAsStyle(context.list, false)
-                  )
-                : undefined,
+        visible: (context) => context.list !== undefined && context.list.isNumbered(),
+        active: (context) => context.list !== undefined && context.list.isNumbered(),
+        handler: (context) => context.list
+            ? rootWithNode(context, context.blocks, context.blocks?.withListAsStyle(context.list, false))
+            : undefined,
     },
     {
         icon: NumbersIcon,
@@ -1652,18 +1279,11 @@ const commands: Command[] = [
         alt: false,
         shift: true,
         key: '8',
-        visible: (context) =>
-            context.list !== undefined && !context.list.isNumbered(),
-        active: (context) =>
-            context.list !== undefined && !context.list.isNumbered(),
-        handler: (context) =>
-            context.list
-                ? rootWithNode(
-                      context,
-                      context.blocks,
-                      context.blocks?.withListAsStyle(context.list, true)
-                  )
-                : undefined,
+        visible: (context) => context.list !== undefined && !context.list.isNumbered(),
+        active: (context) => context.list !== undefined && !context.list.isNumbered(),
+        handler: (context) => context.list
+            ? rootWithNode(context, context.blocks, context.blocks?.withListAsStyle(context.list, true))
+            : undefined,
     },
     {
         icon: ParagraphIcon,
@@ -1676,12 +1296,7 @@ const commands: Command[] = [
         key: ['7', '8'],
         visible: (context) => context.list !== undefined,
         active: (context) => context.list !== undefined,
-        handler: (context) =>
-            rootWithNode(
-                context,
-                context.blocks,
-                context.blocks?.withListsAsParagraphs(context.range)
-            ),
+        handler: (context) => rootWithNode(context, context.blocks, context.blocks?.withListsAsParagraphs(context.range)),
     },
     {
         icon: UndoIcon,
@@ -1693,8 +1308,7 @@ const commands: Command[] = [
         shift: false,
         key: 'z',
         visible: true,
-        active: (context) =>
-            context.undoStack.length > 0 &&
+        active: (context) => context.undoStack.length > 0 &&
             context.undoPosition < context.undoStack.length - 1,
         handler: (context) => context.undo(),
     },
@@ -1723,22 +1337,15 @@ const commands: Command[] = [
         visible: true,
         active: (context) => context.root !== undefined && context.isSelection,
         handler: (context) => {
-            if (context.root === undefined) return;
+            if (context.root === undefined)
+                return;
             // Save the copied content to the clipboard
             const copy = context.root.copyRange(context.range);
-            const edit = context.root.withRangeFormatted(
-                context.range,
-                undefined
-            );
-            if (edit === undefined || copy === undefined) return;
+            const edit = context.root.withRangeFormatted(context.range, undefined);
+            if (edit === undefined || copy === undefined)
+                return;
             context.handleCopy(copy);
-
-            return rootWithNode<RootNode>(
-                context,
-                context.root,
-                edit.root as RootNode,
-                () => edit.range.start
-            );
+            return rootWithNode(context, context.root, edit.root, () => edit.range.start);
         },
     },
     {
@@ -1753,10 +1360,12 @@ const commands: Command[] = [
         visible: true,
         active: (context) => context.isSelection,
         handler: (context) => {
-            if (context.root === undefined) return;
+            if (context.root === undefined)
+                return;
             // Save the copied content to the clipboard
             const copy = context.root.copyRange(context.range);
-            if (copy !== undefined) context.handleCopy(copy);
+            if (copy !== undefined)
+                context.handleCopy(copy);
             return undefined;
         },
     },
@@ -1772,11 +1381,11 @@ const commands: Command[] = [
         visible: true,
         active: () => true,
         handler: (context) => {
-            if (context.root === undefined) return undefined;
-
+            if (context.root === undefined)
+                return undefined;
             // See if there's something on the clipboard.
             if (navigator.clipboard) {
-                navigator.clipboard.read().then((items: ClipboardItems) => {
+                navigator.clipboard.read().then((items) => {
                     // If there's nothing, paste whatever is on the editor clipboard, if there is something.
                     if (items.length === 0 && context.clipboard !== undefined)
                         context.handlePaste(context, context.clipboard, true);
@@ -1787,37 +1396,27 @@ const commands: Command[] = [
                         if (item) {
                             async function gatherClipboard() {
                                 // Eventually we should add HTML support.
-                                const contents: PasteContent = {
+                                const contents = {
                                     plain: undefined,
                                 };
                                 try {
                                     {
-                                        const blob = await item.getType(
-                                            'text/plain'
-                                        );
+                                        const blob = await item.getType('text/plain');
                                         const text = await blob.text();
                                         contents.plain = text;
                                     }
-                                    context.handlePaste(
-                                        context,
-                                        contents,
-                                        true
-                                    );
-                                } catch (err) {}
+                                    context.handlePaste(context, contents, true);
+                                }
+                                catch (err) { }
                             }
                             gatherClipboard();
                         }
                         // Otherwise, try pasting what's on the app clipboard.
                         else if (context.clipboard !== undefined)
-                            return context.handlePaste(
-                                context,
-                                context.clipboard,
-                                false
-                            );
+                            return context.handlePaste(context, context.clipboard, false);
                     }
                 });
             }
-
             // Return the current caret to avoid unhandled command feedback.
             return { root: context.root, range: context.range };
         },
@@ -1833,8 +1432,7 @@ const commands: Command[] = [
         shift: undefined,
         key: (key) => key.length === 1,
         visible: false,
-        active: (context, key) =>
-            context && key !== undefined && key.length === 1,
+        active: (context, key) => context && key !== undefined && key.length === 1,
         handler: (context, utilities, key) => {
             utilities;
             const range = context.range;
@@ -1842,62 +1440,49 @@ const commands: Command[] = [
                 // Insert at the start.
                 let sortedRange = range.start.node.sortRange(range);
                 let insertionPoint = sortedRange.start;
-                let newRoot: RootNode | undefined = context.root;
-
+                let newRoot = context.root;
                 // Not a text node? Fail.
-                if (!(insertionPoint.node instanceof TextNode)) return;
-
+                if (!(insertionPoint.node instanceof TextNode))
+                    return;
                 // If there's a selection, remove it before inserting, and insert at the caret returned.
                 if (context.isSelection) {
                     if (context.code) {
-                        if (
-                            context.code.getCodeNode() ===
-                            sortedRange.start.node
-                        ) {
-                            const newText =
-                                insertionPoint.node.withoutRange(sortedRange);
-                            if (newText === undefined) return;
-                            const edit = newRoot.withNodeReplaced(
-                                insertionPoint.node,
-                                newText
-                            );
-                            if (edit === undefined) return;
+                        if (context.code.getCodeNode() ===
+                            sortedRange.start.node) {
+                            const newText = insertionPoint.node.withoutRange(sortedRange);
+                            if (newText === undefined)
+                                return;
+                            const edit = newRoot.withNodeReplaced(insertionPoint.node, newText);
+                            if (edit === undefined)
+                                return;
                             newRoot = edit;
                             insertionPoint = {
                                 node: newText,
                                 index: sortedRange.start.index,
                             };
                         }
-                    } else {
+                    }
+                    else {
                         // Try to remove the range.
-                        let edit = newRoot.withRangeFormatted(
-                            sortedRange,
-                            undefined
-                        );
+                        let edit = newRoot.withRangeFormatted(sortedRange, undefined);
                         // If we fail, fail to insert at the selection.
-                        if (edit === undefined) return;
-                        newRoot = edit.root as RootNode;
+                        if (edit === undefined)
+                            return;
+                        newRoot = edit.root;
                         insertionPoint = edit.range.start;
                     }
                 }
-
                 // Not a text node? Fail.
-                if (!(insertionPoint.node instanceof TextNode)) return;
-
+                if (!(insertionPoint.node instanceof TextNode))
+                    return;
                 // Update the text node.
-                const newText = insertionPoint.node.withCharacterAt(
-                    key,
-                    insertionPoint.index
-                );
-                if (newText === undefined) return;
-
+                const newText = insertionPoint.node.withCharacterAt(key, insertionPoint.index);
+                if (newText === undefined)
+                    return;
                 // Replace the text.
-                newRoot = newRoot.withNodeReplaced(
-                    insertionPoint.node,
-                    newText
-                );
-                if (newRoot === undefined) return;
-
+                newRoot = newRoot.withNodeReplaced(insertionPoint.node, newText);
+                if (newRoot === undefined)
+                    return;
                 // Update the chapter
                 return rootWithNode(context, context.root, newRoot, () => {
                     return { node: newText, index: insertionPoint.index + 1 };