Improved highlighting colours and selection ranges

src/web/stylesheets/layout/_io.css

@@ -440,6 +440,28 @@
     filter: brightness(98%);
 }
 
+/* Highlighting */
+.ͼ2.cm-focused .cm-selectionBackground {
+    background-color: var(--hl5);
+}
+
+.ͼ2 .cm-selectionBackground {
+    background-color: var(--hl1);
+}
+
+.ͼ1 .cm-selectionMatch {
+    background-color: var(--hl2);
+}
+
+.ͼ1.cm-focused .cm-cursor.cm-cursor-primary {
+    border-color: var(--primary-font-colour);
+}
+
+.ͼ1 .cm-cursor.cm-cursor-primary {
+    display: block;
+    border-color: var(--subtext-font-colour);
+}
+
 
 /* Status bar */
 

src/web/stylesheets/themes/_classic.css

@@ -110,11 +110,11 @@
 
 
     /* Highlighter colours */
-    --hl1: #fff000;
-    --hl2: #95dfff;
-    --hl3: #ffb6b6;
-    --hl4: #fcf8e3;
-    --hl5: #8de768;
+    --hl1: #ffee00aa;
+    --hl2: #95dfffaa;
+    --hl3: #ffb6b6aa;
+    --hl4: #fcf8e3aa;
+    --hl5: #8de768aa;
 
 
     /* Scrollbar */

src/web/waiters/HighlighterWaiter.mjs

@@ -45,18 +45,10 @@ class HighlighterWaiter {
         // from setting the selection in this class
         if (!e.transactions[0].isUserEvent("select")) return false;
 
-        const view = io === "input" ?
-            this.manager.output.outputEditorView :
-            this.manager.input.inputEditorView;
-
         this.currentSelectionRanges = [];
 
         // Confirm some non-empty ranges are set
-        const selectionRanges = e.state.selection.ranges.filter(r => !r.empty);
-        if (!selectionRanges.length) {
-            this.resetSelections(view);
-            return;
-        }
+        const selectionRanges = e.state.selection.ranges;
 
         // Loop through ranges and send request for output offsets for each one
         const direction = io === "input" ? "forward" : "reverse";
@@ -69,19 +61,6 @@ class HighlighterWaiter {
         }
     }
 
-    /**
-     * Resets the current set of selections in the given view
-     * @param {EditorView} view
-     */
-    resetSelections(view) {
-        this.currentSelectionRanges = [];
-
-        // Clear current selection in output or input
-        view.dispatch({
-            selection: EditorSelection.create([EditorSelection.range(0, 0)])
-        });
-    }
-
 
     /**
      * Displays highlight offsets sent back from the Chef.
@@ -120,18 +99,30 @@ class HighlighterWaiter {
 
         // Add new SelectionRanges to existing ones
         for (const range of ranges) {
-            if (!range.start || !range.end) continue;
-            this.currentSelectionRanges.push(
-                EditorSelection.range(range.start, range.end)
-            );
+            if (typeof range.start !== "number" ||
+                typeof range.end !== "number")
+                continue;
+            const selection = range.end <= range.start ?
+                EditorSelection.cursor(range.start) :
+                EditorSelection.range(range.start, range.end);
+
+            this.currentSelectionRanges.push(selection);
         }
 
         // Set selection
         if (this.currentSelectionRanges.length) {
-            view.dispatch({
-                selection: EditorSelection.create(this.currentSelectionRanges),
-                scrollIntoView: true
-            });
+            try {
+                view.dispatch({
+                    selection: EditorSelection.create(this.currentSelectionRanges),
+                    scrollIntoView: true
+                });
+            } catch (err) {
+                // Ignore Range Errors
+                if (!err.toString().startsWith("RangeError")) {
+                    console.error(err);
+                }
+
+            }
         }
     }
 

src/web/waiters/InputWaiter.mjs

@@ -12,7 +12,7 @@ import {toBase64} from "../../core/lib/Base64.mjs";
 import {isImage} from "../../core/lib/FileType.mjs";
 
 import {
-    EditorView, keymap, highlightSpecialChars, drawSelection, rectangularSelection, crosshairCursor
+    EditorView, keymap, highlightSpecialChars, drawSelection, rectangularSelection, crosshairCursor, dropCursor
 } from "@codemirror/view";
 import {EditorState, Compartment} from "@codemirror/state";
 import {defaultKeymap, insertTab, insertNewline, history, historyKeymap} from "@codemirror/commands";
@@ -93,6 +93,7 @@ class InputWaiter {
                 drawSelection(),
                 rectangularSelection(),
                 crosshairCursor(),
+                dropCursor(),
                 bracketMatching(),
                 highlightSelectionMatches(),
                 search({top: true}),