@37signals/lexxy 0.9.5-beta → 0.9.6-beta

package/dist/lexxy.esm.js

@@ -18,14 +18,28 @@ import { marked } from 'marked';
 import { $insertDataTransferForRichText } from '@lexical/clipboard';
 import 'prismjs';
 import 'prismjs/components/prism-clike';
+import 'prismjs/components/prism-diff';
+import 'prismjs/components/prism-javascript';
 import 'prismjs/components/prism-markup';
+import 'prismjs/components/prism-markdown';
+import 'prismjs/components/prism-c';
+import 'prismjs/components/prism-css';
+import 'prismjs/components/prism-objectivec';
+import 'prismjs/components/prism-sql';
+import 'prismjs/components/prism-powershell';
+import 'prismjs/components/prism-python';
+import 'prismjs/components/prism-rust';
+import 'prismjs/components/prism-swift';
+import 'prismjs/components/prism-typescript';
+import 'prismjs/components/prism-java';
+import 'prismjs/components/prism-cpp';
 import 'prismjs/components/prism-markup-templating';
 import 'prismjs/components/prism-ruby';
 import 'prismjs/components/prism-php';
 import 'prismjs/components/prism-go';
 import 'prismjs/components/prism-bash';
 import 'prismjs/components/prism-json';
-import 'prismjs/components/prism-diff';
+import 'prismjs/components/prism-kotlin';
 
 const ALLOWED_HTML_ATTRIBUTES = [ "class", "contenteditable", "href", "src", "style", "title" ];
 
@@ -2175,7 +2189,7 @@ class CommandDispatcher {
 
   dispatchInsertUnorderedList() {
     const selection = $getSelection();
-    if (!selection) return
+    if (!$isRangeSelection(selection)) return
 
     const anchorNode = selection.anchor.getNode();
 
@@ -2188,7 +2202,7 @@ class CommandDispatcher {
 
   dispatchInsertOrderedList() {
     const selection = $getSelection();
-    if (!selection) return
+    if (!$isRangeSelection(selection)) return
 
     const anchorNode = selection.anchor.getNode();
 
@@ -2480,6 +2494,15 @@ function capitalize(str) {
   return str.charAt(0).toUpperCase() + str.slice(1)
 }
 
+function debounce(fn, wait) {
+  let timeout;
+
+  return (...args) => {
+    clearTimeout(timeout);
+    timeout = setTimeout(() => fn(...args), wait);
+  }
+}
+
 function debounceAsync(fn, wait) {
   let timeout;
 
@@ -5903,9 +5926,9 @@ class AttachmentDragAndDrop {
   // -- Event handlers --------------------------------------------------------
 
   #handleDragStart(event) {
-    if (event.target.closest("textarea")) return false
+    if (event.target.closest?.("textarea")) return false
 
-    const figure = event.target.closest("figure.attachment[data-lexical-node-key]");
+    const figure = event.target.closest?.("figure.attachment[data-lexical-node-key]");
     if (!figure) return false
 
     this.#draggedNodeKey = figure.dataset.lexicalNodeKey;
@@ -6350,6 +6373,11 @@ class EarlyEscapeCodeNode extends CodeNode {
   insertNewAfter(selection, restoreSelection) {
     if (!selection.isCollapsed()) return super.insertNewAfter(selection, restoreSelection)
 
+    if (this.#isCursorAtStart(selection)) {
+      this.insertBefore($createParagraphNode());
+      return null
+    }
+
     if (this.#isCursorOnEmptyLastLine(selection)) {
       $trimTrailingBlankNodes(this);
 
@@ -6361,6 +6389,14 @@ class EarlyEscapeCodeNode extends CodeNode {
     return super.insertNewAfter(selection, restoreSelection)
   }
 
+  #isCursorAtStart(selection) {
+    const { anchor } = selection;
+    if (!$isAtNodeStart(anchor)) return false
+
+    const anchorNode = anchor.getNode();
+    return this.is(anchorNode) || this.getFirstChild()?.is(anchorNode)
+  }
+
   #isCursorOnEmptyLastLine(selection) {
     if (!$isCursorOnLastLine(selection)) return false
 
@@ -7478,6 +7514,8 @@ class BaseSource {
   }
 }
 
+const MAX_RENDERED_SUGGESTIONS$1 = 100;
+
 class LocalFilterSource extends BaseSource {
   async buildListItems(filter = "") {
     const promptItems = await this.fetchPromptItems();
@@ -7496,7 +7534,10 @@ class LocalFilterSource extends BaseSource {
   #buildListItemsFromPromptItems(promptItems, filter) {
     const listItems = [];
     this.promptItemByListItem = new WeakMap();
-    promptItems.forEach((promptItem) => {
+
+    for (const promptItem of promptItems) {
+      if (listItems.length >= MAX_RENDERED_SUGGESTIONS$1) break
+
       const searchableText = promptItem.getAttribute("search");
 
       if (!filter || filterMatches(searchableText, filter)) {
@@ -7504,7 +7545,7 @@ class LocalFilterSource extends BaseSource {
         this.promptItemByListItem.set(listItem, promptItem);
         listItems.push(listItem);
       }
-    });
+    }
 
     return listItems
   }
@@ -7537,6 +7578,7 @@ class DeferredPromptSource extends LocalFilterSource {
 }
 
 const DEBOUNCE_INTERVAL = 200;
+const MAX_RENDERED_SUGGESTIONS = 100;
 
 class RemoteFilterSource extends BaseSource {
   constructor(url) {
@@ -7570,6 +7612,8 @@ class RemoteFilterSource extends BaseSource {
     this.promptItemByListItem = new WeakMap();
 
     for (const promptItem of promptItems) {
+      if (listItems.length >= MAX_RENDERED_SUGGESTIONS) break
+
       const listItem = this.buildListItemElementFor(promptItem);
       this.promptItemByListItem.set(listItem, promptItem);
       listItems.push(listItem);
@@ -7580,10 +7624,12 @@ class RemoteFilterSource extends BaseSource {
 }
 
 const NOTHING_FOUND_DEFAULT_MESSAGE = "Nothing found";
+const FILTER_DEBOUNCE_INTERVAL = 50;
 
 class LexicalPromptElement extends HTMLElement {
   #globalListeners = new ListenerBin()
   #popoverListeners = new ListenerBin()
+  #debouncedFilterOptions = debounce(() => this.#filterOptions(), FILTER_DEBOUNCE_INTERVAL)
 
   constructor() {
     super();
@@ -7741,7 +7787,7 @@ class LexicalPromptElement extends HTMLElement {
 
     this.#popoverListeners.track(
       registerEventListener(this.#editorElement, "keydown", this.#handleKeydownOnPopover),
-      registerEventListener(this.#editorElement, "lexxy:change", this.#filterOptions)
+      registerEventListener(this.#editorElement, "lexxy:change", this.#debouncedFilterOptions)
     );
 
     this.#registerKeyListeners();
@@ -8123,6 +8169,8 @@ class CodeLanguagePicker extends HTMLElement {
     languages.bash ||= "Bash";
     languages.json ||= "JSON";
     languages.diff ||= "Diff";
+    languages.kotlin ||= "Kotlin";
+
 
     // Place the "plain" entry first, then the rest of language sorted alphabetically
     delete languages.plain;

package/dist/lexxy_helpers.esm.js

@@ -1,13 +1,27 @@
 import Prism from 'prismjs';
 import 'prismjs/components/prism-clike';
+import 'prismjs/components/prism-diff';
+import 'prismjs/components/prism-javascript';
 import 'prismjs/components/prism-markup';
+import 'prismjs/components/prism-markdown';
+import 'prismjs/components/prism-c';
+import 'prismjs/components/prism-css';
+import 'prismjs/components/prism-objectivec';
+import 'prismjs/components/prism-sql';
+import 'prismjs/components/prism-powershell';
+import 'prismjs/components/prism-python';
+import 'prismjs/components/prism-rust';
+import 'prismjs/components/prism-swift';
+import 'prismjs/components/prism-typescript';
+import 'prismjs/components/prism-java';
+import 'prismjs/components/prism-cpp';
 import 'prismjs/components/prism-markup-templating';
 import 'prismjs/components/prism-ruby';
 import 'prismjs/components/prism-php';
 import 'prismjs/components/prism-go';
 import 'prismjs/components/prism-bash';
 import 'prismjs/components/prism-json';
-import 'prismjs/components/prism-diff';
+import 'prismjs/components/prism-kotlin';
 
 // Configure Prism for manual highlighting mode
 // This must be set before importing prismjs

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@37signals/lexxy",
-  "version": "0.9.5-beta",
+  "version": "0.9.6-beta",
   "description": "Lexxy - A modern rich text editor for Rails.",
   "module": "dist/lexxy.esm.js",
   "type": "module",