@37signals/lexxy 0.9.19-alpha.3 → 0.9.19

package/dist/lexxy.esm.js

@@ -1,7 +1,7 @@
 export { highlightCode, highlightElement } from './lexxy_helpers.esm.js';
 import DOMPurify from 'dompurify';
 import { getStyleObjectFromCSS, getCSSFromStyleObject, $getSelectionStyleValueForProperty, $ensureForwardRangeSelection, $isAtNodeEnd, $patchStyleText, $setBlocksType, $forEachSelectedTextNode } from '@lexical/selection';
-import { SKIP_DOM_SELECTION_TAG, CAN_UNDO_COMMAND, COMMAND_PRIORITY_LOW, CAN_REDO_COMMAND, $getSelection, $isRangeSelection, DecoratorNode, $createTextNode, $getRoot, $caretFromPoint, $setSelectionFromCaretRange, $getCaretRange, $normalizeCaret, $getChildCaret, $getCaretInDirection, $isParagraphNode, $isLineBreakNode, $createParagraphNode, $isElementNode, $isRootOrShadowRoot, $isRootNode, $createNodeSelection, $isDecoratorNode, $isTextNode, $getSiblingCaret, $rewindSiblingCaret, $splitAtPointCaretNext, $normalizeSelection__EXPERIMENTAL, $isChildCaret, $isTextPointCaret, $isExtendableTextPointCaret, $isSiblingCaret, $getCommonAncestor, $findMatchingParent, TextNode, createCommand, defineExtension, COMMAND_PRIORITY_EDITOR, $getEditor, $getNodeByKey, HISTORY_MERGE_TAG, SKIP_SCROLL_INTO_VIEW_TAG, $cloneWithProperties, $getNearestRootOrShadowRoot, $createRangeSelection, $setSelection, createState, COMMAND_PRIORITY_NORMAL, $getState, $setState, $hasUpdateTag, PASTE_TAG, FORMAT_TEXT_COMMAND, UNDO_COMMAND, REDO_COMMAND, KEY_ARROW_RIGHT_COMMAND, KEY_TAB_COMMAND, INSERT_LINE_BREAK_COMMAND, COMMAND_PRIORITY_HIGH, INSERT_PARAGRAPH_COMMAND, OUTDENT_CONTENT_COMMAND, INDENT_CONTENT_COMMAND, $isNodeSelection, KEY_ARROW_LEFT_COMMAND, KEY_ARROW_UP_COMMAND, KEY_ARROW_DOWN_COMMAND, DELETE_CHARACTER_COMMAND, SELECTION_CHANGE_COMMAND, CLICK_COMMAND, isDOMNode, $getNearestNodeFromDOMNode, $addUpdateTag, ElementNode, $splitNode, $getChildCaretAtIndex, $createLineBreakNode, SELECTION_INSERT_CLIPBOARD_NODES_COMMAND, PASTE_COMMAND, $onUpdate, ParagraphNode, RootNode, DRAGSTART_COMMAND, DROP_COMMAND, mergeRegister as mergeRegister$1, CLEAR_HISTORY_COMMAND, KEY_ENTER_COMMAND, COMMAND_PRIORITY_CRITICAL, KEY_SPACE_COMMAND, INPUT_COMMAND, KEY_BACKSPACE_COMMAND, KEY_DOWN_COMMAND } from 'lexical';
+import { SKIP_DOM_SELECTION_TAG, CAN_UNDO_COMMAND, COMMAND_PRIORITY_LOW, CAN_REDO_COMMAND, $getSelection, $isRangeSelection, DecoratorNode, $createTextNode, $getRoot, $caretFromPoint, $setSelectionFromCaretRange, $getCaretRange, $normalizeCaret, $getChildCaret, $getCaretInDirection, $isParagraphNode, $isLineBreakNode, $createParagraphNode, $isElementNode, $isRootOrShadowRoot, $isRootNode, $createNodeSelection, $isDecoratorNode, $isTextNode, $getSiblingCaret, $rewindSiblingCaret, $splitAtPointCaretNext, $normalizeSelection__EXPERIMENTAL, $isChildCaret, $isTextPointCaret, $isExtendableTextPointCaret, $isSiblingCaret, $getCommonAncestor, $findMatchingParent, TextNode, createCommand, defineExtension, COMMAND_PRIORITY_EDITOR, $getEditor, $getNodeByKey, HISTORY_MERGE_TAG, SKIP_SCROLL_INTO_VIEW_TAG, $cloneWithProperties, $getNearestRootOrShadowRoot, $createRangeSelection, $setSelection, createState, COMMAND_PRIORITY_NORMAL, $getState, $setState, $hasUpdateTag, PASTE_TAG, FORMAT_TEXT_COMMAND, UNDO_COMMAND, REDO_COMMAND, KEY_ARROW_RIGHT_COMMAND, KEY_TAB_COMMAND, INSERT_LINE_BREAK_COMMAND, COMMAND_PRIORITY_HIGH, INSERT_PARAGRAPH_COMMAND, OUTDENT_CONTENT_COMMAND, INDENT_CONTENT_COMMAND, $isNodeSelection, KEY_ARROW_LEFT_COMMAND, KEY_ARROW_UP_COMMAND, KEY_ARROW_DOWN_COMMAND, DELETE_CHARACTER_COMMAND, SELECTION_CHANGE_COMMAND, CLICK_COMMAND, isDOMNode, $getNearestNodeFromDOMNode, $addUpdateTag, ElementNode, $splitNode, $getChildCaretAtIndex, $createLineBreakNode, SELECTION_INSERT_CLIPBOARD_NODES_COMMAND, PASTE_COMMAND, $onUpdate, ParagraphNode, RootNode, DRAGSTART_COMMAND, DROP_COMMAND, mergeRegister as mergeRegister$1, $createRangeSelectionFromDom, CLEAR_HISTORY_COMMAND, KEY_ENTER_COMMAND, COMMAND_PRIORITY_CRITICAL, KEY_SPACE_COMMAND, INPUT_COMMAND, KEY_BACKSPACE_COMMAND, KEY_DOWN_COMMAND } from 'lexical';
 import { LinkNode, $createAutoLinkNode, $toggleLink, $createLinkNode, $isLinkNode, AutoLinkNode } from '@lexical/link';
 import { buildEditorFromExtensions } from '@lexical/extension';
 import { ListNode, ListItemNode, $getListDepth, $isListNode, $isListItemNode, INSERT_UNORDERED_LIST_COMMAND, INSERT_ORDERED_LIST_COMMAND, $createListNode, $createListItemNode, registerList } from '@lexical/list';
@@ -1384,7 +1384,8 @@ class CustomActionTextAttachmentNode extends DecoratorNode {
   }
 
   createDOM() {
-    const figure = createElement(this.tagName, { "content-type": this.contentType, "data-lexxy-decorator": true });
+    const figure = createElement(this.tagName, { "content-type": this.contentType, "data-lexxy-decorator": true, draggable: true });
+    figure.dataset.lexicalNodeKey = this.__key;
 
     figure.insertAdjacentHTML("beforeend", sanitize(this.innerHtml));
 
@@ -1437,6 +1438,10 @@ class CustomActionTextAttachmentNode extends DecoratorNode {
   }
 }
 
+function $isCustomActionTextAttachmentNode(node) {
+  return node instanceof CustomActionTextAttachmentNode
+}
+
 function dasherize(value) {
   return value.replace(/([A-Z])/g, (_, char) => `-${char.toLowerCase()}`)
 }
@@ -3928,7 +3933,7 @@ class CommandDispatcher {
   }
 
   #isInternalDrag(event) {
-    return event.dataTransfer?.types.includes("application/x-lexxy-node-key")
+    return event.dataTransfer?.types.some((type) => type.startsWith("application/x-lexxy-"))
   }
 
   #handleTabKey(event) {
@@ -3982,14 +3987,14 @@ class Selection {
   }
 
   get cursorPosition() {
-    let position = { x: 0, y: 0 };
+    let position = null;
 
     this.editor.getEditorState().read(() => {
       const range = this.#getValidSelectionRange();
       if (!range) return
 
       const rect = this.#getReliableRectFromRange(range);
-      if (!rect) return
+      if (this.#isRectUnreliable(rect)) return
 
       position = this.#calculateCursorPosition(rect, range);
     });
@@ -5559,7 +5564,7 @@ class ShadowRootNodeInserter extends BaseNodeInserter {
 
 class NodeSelectionNodeInserter extends BaseNodeInserter {
   static handles(selection) {
-    return $isNodeSelection(selection)
+    return $isNodeSelection(selection) && selection.getNodes().length > 0
   }
 
   insertNodes(nodes) {
@@ -5757,8 +5762,15 @@ class Contents {
     }, { tag });
   }
 
+  insertText(text, { tag } = {}) {
+    this.editor.update(() => {
+      const paragraph = $createParagraphNode().append($createTextNode(text));
+      this.insertAtCursor(paragraph);
+    }, { tag });
+  }
+
   insertAtCursor(...nodes) {
-    const selection = $getSelection() ?? $getRoot().selectEnd();
+    const selection = this.#insertableSelection();
     const inserter = BaseNodeInserter.for(selection);
 
     inserter.insertNodes(nodes);
@@ -5952,14 +5964,13 @@ class Contents {
   replaceTextBackUntil(stringToReplace, replacementNodes) {
     replacementNodes = Array.isArray(replacementNodes) ? replacementNodes : [ replacementNodes ];
 
-    const selection = $getSelection();
     const { anchorNode, offset } = this.#getTextAnchorData();
     if (!anchorNode) return
 
     const lastIndex = this.#findReplacementStart(anchorNode, offset, stringToReplace);
     if (lastIndex === -1) return
 
-    this.#performTextReplacement(anchorNode, selection, lastIndex, stringToReplace, replacementNodes);
+    this.#performTextReplacement(anchorNode, lastIndex, stringToReplace, replacementNodes);
   }
 
   uploadFiles(files, { selectLast } = {}) {
@@ -6099,6 +6110,15 @@ class Contents {
     });
   }
 
+  #insertableSelection() {
+    const selection = $getSelection();
+    if ($isNodeSelection(selection) && selection.getNodes().length === 0) {
+      return $getRoot().selectEnd()
+    }
+
+    return selection ?? $getRoot().selectEnd()
+  }
+
   #formatPastedDOM(doc) {
     new PastedContentFormatter(doc).format();
   }
@@ -6282,13 +6302,13 @@ class Contents {
     }
   }
 
-  #performTextReplacement(anchorNode, selection, startIndex, stringToReplace, replacementNodes) {
+  #performTextReplacement(anchorNode, startIndex, stringToReplace, replacementNodes) {
     const fullText = anchorNode.getTextContent();
     const textBeforeString = fullText.slice(0, startIndex);
     const textAfterString = fullText.slice(startIndex + stringToReplace.length);
 
-    const textNodeBefore = this.#cloneTextNodeFormatting(anchorNode, selection, textBeforeString);
-    const textNodeAfter = this.#cloneTextNodeFormatting(anchorNode, selection, textAfterString || " ");
+    const textNodeBefore = this.#cloneTextNodeFormatting(anchorNode, textBeforeString);
+    const textNodeAfter = this.#cloneTextNodeFormatting(anchorNode, textAfterString || " ");
 
     anchorNode.replace(textNodeBefore);
 
@@ -6300,18 +6320,12 @@ class Contents {
     textNodeAfter.select(cursorOffset, cursorOffset);
   }
 
-  #cloneTextNodeFormatting(anchorNode, selection, text) {
-    const parent = anchorNode.getParent();
-    const fallbackFormat = parent?.getTextFormat?.() || 0;
-    const fallbackStyle = parent?.getTextStyle?.() || "";
-    const format = $isRangeSelection(selection) && selection.format ? selection.format : (anchorNode.getFormat() || fallbackFormat);
-    const style = $isRangeSelection(selection) && selection.style ? selection.style : (anchorNode.getStyle() || fallbackStyle);
-
+  #cloneTextNodeFormatting(anchorNode, text) {
     return $createTextNode(text)
-      .setFormat(format)
+      .setFormat(anchorNode.getFormat())
       .setDetail(anchorNode.getDetail())
       .setMode(anchorNode.getMode())
-      .setStyle(style)
+      .setStyle(anchorNode.getStyle())
   }
 
   #insertReplacementNodes(startNode, replacementNodes) {
@@ -6529,14 +6543,31 @@ class Clipboard {
   #pasteMarkdown(text) {
     const html = marked(text, { breaks: true });
     const doc = parseHtml(html);
-    const detail = Object.freeze({
-      markdown: text,
-      document: doc,
-      addBlockSpacing: () => addBlockSpacing(doc)
-    });
 
-    dispatch(this.editorElement, "lexxy:insert-markdown", detail);
-    this.contents.insertDOM(doc, { tag: PASTE_TAG });
+    if (this.#isPlainTextWithoutMarkdown(doc)) {
+      this.contents.insertText(text, { tag: PASTE_TAG });
+    } else {
+      const detail = Object.freeze({
+        markdown: text,
+        document: doc,
+        addBlockSpacing: () => addBlockSpacing(doc)
+      });
+
+      dispatch(this.editorElement, "lexxy:insert-markdown", detail);
+      this.contents.insertDOM(doc, { tag: PASTE_TAG });
+    }
+  }
+
+  // Markdown conversion collapses runs of whitespace and unescapes backslashes,
+  // silently corrupting plain text such as Windows/UNC file paths. When the text
+  // carries no Markdown structure, paste it verbatim instead.
+  #isPlainTextWithoutMarkdown(doc) {
+    const elements = Array.from(doc.body.children);
+    if (elements.length !== 1) return false
+
+    const paragraph = elements[0];
+    return paragraph.nodeName === "P"
+      && Array.from(paragraph.childNodes).every((node) => node.nodeType === Node.TEXT_NODE)
   }
 
   #pasteRichText(clipboardData) {
@@ -7144,7 +7175,7 @@ class TablesExtension extends LexxyExtension {
   }
 }
 
-const MIME_TYPE = "application/x-lexxy-node-key";
+const MIME_TYPE$1 = "application/x-lexxy-node-key";
 
 class AttachmentDragAndDrop {
   #editor
@@ -7191,7 +7222,7 @@ class AttachmentDragAndDrop {
     if (!figure) return false
 
     this.#draggedNodeKey = figure.dataset.lexicalNodeKey;
-    event.dataTransfer.setData(MIME_TYPE, this.#draggedNodeKey);
+    event.dataTransfer.setData(MIME_TYPE$1, this.#draggedNodeKey);
     event.dataTransfer.effectAllowed = "move";
 
     // Add dragging class after a tick so it doesn't affect the drag image
@@ -7971,6 +8002,268 @@ class PreventLexicalTripleClickExtension extends LexxyExtension {
   }
 }
 
+function caretRect(node, offset) {
+  const range = document.createRange();
+  range.setStart(node, offset);
+  range.collapse(true);
+
+  const rect = range.getBoundingClientRect();
+  if (rect.height > 0) {
+    return rect
+  } else {
+    return null
+  }
+}
+
+function caretFromPoint(clientX, clientY) {
+  if (document.caretPositionFromPoint) {
+    const position = document.caretPositionFromPoint(clientX, clientY);
+    if (position) return { node: position.offsetNode, offset: position.offset }
+  } else if (document.caretRangeFromPoint) {
+    const range = document.caretRangeFromPoint(clientX, clientY);
+    if (range) return { node: range.startContainer, offset: range.startOffset }
+  }
+
+  return null
+}
+
+const MIME_TYPE = "application/x-lexxy-custom-attachment-key";
+
+// Custom inline attachments reorder by dropping at a text caret, unlike block
+// attachments which insert between blocks or into galleries.
+class CustomAttachmentDragAndDrop {
+  #editor
+  #draggedNodeKey = null
+  #draggingRafId = null
+  #dragOverRafId = null
+  #dropIndicator = null
+  #listeners = new ListenerBin()
+
+  constructor(editor) {
+    this.#editor = editor;
+
+    // Register at HIGH priority to intercept before the base @lexical/rich-text
+    // handlers, which consume drag events. The block-attachment handler also
+    // registers here but bails for inline custom attachments, so we get our turn.
+    this.#listeners.track(
+      editor.registerCommand(DRAGSTART_COMMAND, (event) => this.#handleDragStart(event), COMMAND_PRIORITY_HIGH),
+      editor.registerCommand(DROP_COMMAND, (event) => this.#handleDrop(event), COMMAND_PRIORITY_HIGH)
+    );
+
+    this.#listeners.track(editor.registerRootListener((root, prevRoot) => {
+      if (prevRoot) {
+        prevRoot.removeEventListener("dragover", this.#onDragOver);
+        prevRoot.removeEventListener("dragend", this.#onDragEnd);
+      }
+      if (root) {
+        root.addEventListener("dragover", this.#onDragOver);
+        root.addEventListener("dragend", this.#onDragEnd);
+      }
+    }));
+  }
+
+  destroy() {
+    this.#cleanup();
+    this.#dropIndicator?.remove();
+    this.#dropIndicator = null;
+    this.#listeners.dispose();
+  }
+
+  #handleDragStart(event) {
+    const attachment = this.#customAttachmentElementFrom(event.target);
+    if (!attachment) return false
+
+    this.#draggedNodeKey = attachment.dataset.lexicalNodeKey;
+    event.dataTransfer.setData(MIME_TYPE, this.#draggedNodeKey);
+    event.dataTransfer.effectAllowed = "move";
+
+    this.#draggingRafId = requestAnimationFrame(() => {
+      this.#draggingRafId = null;
+      attachment.classList.add("lexxy-dragging");
+    });
+
+    return true
+  }
+
+  #onDragOver = (event) => {
+    if (!this.#draggedNodeKey) return
+
+    event.preventDefault();
+    event.dataTransfer.dropEffect = "move";
+
+    if (!this.#dragOverRafId) {
+      this.#dragOverRafId = requestAnimationFrame(() => {
+        this.#dragOverRafId = null;
+        this.#updateDropIndicator(event);
+      });
+    }
+  }
+
+  #onDragEnd = () => {
+    this.#cleanup();
+  }
+
+  #handleDrop(event) {
+    if (!this.#draggedNodeKey) return false
+
+    event.preventDefault();
+
+    const dropPoint = this.#resolveDropPoint(event);
+    const draggedKey = this.#draggedNodeKey;
+    this.#cleanup();
+
+    if (dropPoint) {
+      this.#moveAttachment(draggedKey, dropPoint);
+    }
+
+    return true
+  }
+
+  #resolveDropPoint(event) {
+    const rootElement = this.#editor.getRootElement();
+    if (!rootElement) return null
+
+    const caret = caretFromPoint(event.clientX, event.clientY);
+    if (!caret || !rootElement.contains(caret.node)) return null
+
+    // A caret on the root itself points between blocks. Mentions behave like text:
+    // they only drop onto an existing line, so snap to the nearest one.
+    if (caret.node === rootElement) {
+      return this.#nearestLineCaret(rootElement, event.clientY)
+    } else {
+      return caret
+    }
+  }
+
+  #nearestLineCaret(rootElement, clientY) {
+    let nearestLine = null;
+    let nearestDistance = Infinity;
+
+    for (const line of rootElement.children) {
+      const rect = line.getBoundingClientRect();
+      const distance = Math.min(Math.abs(clientY - rect.top), Math.abs(clientY - rect.bottom));
+      if (distance < nearestDistance) {
+        nearestDistance = distance;
+        nearestLine = line;
+      }
+    }
+
+    if (!nearestLine) return null
+
+    const rect = nearestLine.getBoundingClientRect();
+    if (clientY < rect.top) {
+      return { node: nearestLine, offset: 0 }
+    } else {
+      return { node: nearestLine, offset: nearestLine.childNodes.length }
+    }
+  }
+
+  #moveAttachment(draggedKey, dropPoint) {
+    this.#editor.update(() => {
+      const draggedNode = $getNodeByKey(draggedKey);
+      if (!$isCustomActionTextAttachmentNode(draggedNode)) return
+
+      const selection = $createRangeSelectionFromDom({
+        anchorNode: dropPoint.node,
+        anchorOffset: dropPoint.offset,
+        focusNode: dropPoint.node,
+        focusOffset: dropPoint.offset
+      }, this.#editor);
+      if (!selection) return
+
+      $setSelection(selection);
+
+      draggedNode.remove();
+      selection.insertNodes([ draggedNode ]);
+    });
+  }
+
+  #updateDropIndicator(event) {
+    this.#hideCaret();
+
+    const dropPoint = this.#resolveDropPoint(event);
+    if (dropPoint) this.#showCaret(this.#caretRectFor(dropPoint));
+  }
+
+  #caretRectFor({ node, offset }) {
+    const rect = caretRect(node, offset);
+    if (rect) return rect
+
+    // A blank line has no text to measure, so fall back to the line's own box.
+    const line = node.nodeType === Node.TEXT_NODE ? node.parentElement : node;
+    if (!line) return null
+
+    const lineRect = line.getBoundingClientRect();
+    return { left: lineRect.left, top: lineRect.top, height: lineRect.height }
+  }
+
+  #showCaret(rect) {
+    if (!rect) return
+
+    const caret = this.#ensureCaretIndicator();
+    caret.style.blockSize = `${rect.height}px`;
+    caret.style.insetInlineStart = `${rect.left}px`;
+    caret.style.insetBlockStart = `${rect.top}px`;
+  }
+
+  #ensureCaretIndicator() {
+    this.#dropIndicator ||= createElement("div", { className: "lexxy-drop-caret" });
+
+    this.#editorElement().appendChild(this.#dropIndicator);
+    this.#dropIndicator.style.display = "block";
+    return this.#dropIndicator
+  }
+
+  #editorElement() {
+    return this.#editor.getRootElement().closest("lexxy-editor")
+  }
+
+  #hideCaret() {
+    if (this.#dropIndicator) this.#dropIndicator.style.display = "none";
+  }
+
+  #customAttachmentElementFrom(target) {
+    return target?.closest?.("[data-lexxy-decorator][data-lexical-node-key]")
+  }
+
+  #cleanup() {
+    if (this.#draggedNodeKey) {
+      const rootElement = this.#editor.getRootElement();
+      const attachment = rootElement?.querySelector(`[data-lexical-node-key="${this.#draggedNodeKey}"]`);
+      attachment?.classList.remove("lexxy-dragging");
+    }
+
+    this.#hideCaret();
+    this.#draggedNodeKey = null;
+
+    if (this.#draggingRafId) {
+      cancelAnimationFrame(this.#draggingRafId);
+      this.#draggingRafId = null;
+    }
+
+    if (this.#dragOverRafId) {
+      cancelAnimationFrame(this.#dragOverRafId);
+      this.#dragOverRafId = null;
+    }
+  }
+}
+
+class CustomAttachmentDragAndDropExtension extends LexxyExtension {
+  get enabled() {
+    return this.editorElement.supportsRichText
+  }
+
+  get lexicalExtension() {
+    return defineExtension({
+      name: "lexxy/custom-attachment-drag-and-drop",
+      register: (editor) => {
+        const dragAndDrop = new CustomAttachmentDragAndDrop(editor);
+        return () => dragAndDrop.destroy()
+      }
+    })
+  }
+}
+
 class LexicalEditorElement extends HTMLElement {
   static formAssociated = true
   static debug = false
@@ -8127,7 +8420,8 @@ class LexicalEditorElement extends HTMLElement {
       AttachmentsExtension,
       FormatEscapeExtension,
       LinkOpenerExtension,
-      PreventLexicalTripleClickExtension
+      PreventLexicalTripleClickExtension,
+      CustomAttachmentDragAndDropExtension
     ]
   }
 
@@ -9163,7 +9457,9 @@ class LexicalPromptElement extends HTMLElement {
         if (!node) return
 
         if (this.#cursorIsTypingSearchTerm(node, offset)) {
-          return
+          if (!this.popoverElement.hasAttribute("data-anchored")) {
+            this.#positionPopover();
+          }
         } else {
           this.#hidePopover();
         }
@@ -9294,8 +9590,16 @@ class LexicalPromptElement extends HTMLElement {
     }
   }
 
+  // Right after a Turbo history restore the editor reconnects before the DOM selection
+  // is re-established, so the cursor geometry is momentarily unavailable. Anchoring then
+  // would pin the menu to the editor's left edge for the rest of the open cycle, so we
+  // skip it and let a later reposition anchor it once the selection is ready. The menu
+  // stays hidden until anchored (see the `[data-anchored]` rule in the stylesheet).
   #positionPopover() {
-    const { x, y, fontSize } = this.#selection.cursorPosition;
+    const cursorPosition = this.#selection.cursorPosition;
+    if (!cursorPosition) return
+
+    const { x, y, fontSize } = cursorPosition;
     const editorRect = this.#editorElement.getBoundingClientRect();
     const contentRect = this.#editorContentElement.getBoundingClientRect();
     const verticalOffset = contentRect.top - editorRect.top;
@@ -10598,4 +10902,4 @@ const configure = Lexxy.configure;
 // Pushing elements definition to after the current call stack to allow global configuration to take place first
 setTimeout(defineElements, 0);
 
-export { $createActionTextAttachmentNode, $createActionTextAttachmentUploadNode, $isActionTextAttachmentNode, ActionTextAttachmentNode, ActionTextAttachmentUploadNode, CustomActionTextAttachmentNode, LexxyExtension as Extension, HorizontalDividerNode, NativeAdapter, configure };
+export { $createActionTextAttachmentNode, $createActionTextAttachmentUploadNode, $isActionTextAttachmentNode, $isCustomActionTextAttachmentNode, ActionTextAttachmentNode, ActionTextAttachmentUploadNode, CustomActionTextAttachmentNode, LexxyExtension as Extension, HorizontalDividerNode, NativeAdapter, configure };

package/dist/stylesheets/lexxy-editor.css

@@ -249,6 +249,22 @@
     opacity: 0.4;
   }
 
+  [data-lexxy-decorator][draggable] {
+    cursor: grab;
+  }
+
+  [data-lexxy-decorator].lexxy-dragging {
+    opacity: 0.4;
+  }
+
+  .lexxy-drop-caret {
+    background-color: var(--lexxy-focus-ring-color);
+    border-radius: 1px;
+    inline-size: 2px;
+    pointer-events: none;
+    position: fixed;
+  }
+
   [class*="lexxy-drop-target--"] {
     position: relative;
   }
@@ -1063,7 +1079,7 @@
   }
 }
 
-:where(.lexxy-prompt-menu--visible) {
+:where(.lexxy-prompt-menu--visible[data-anchored]) {
   visibility: initial;
 }
 

package/package.json

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