lexxy 0.9.20 → 0.9.22

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA256:
-  metadata.gz: 3e6fda495d92cad60dac933e1fbe6466f0813def098debbe4bea232130db0721
-  data.tar.gz: 0e579b377be3610f91228422dcd3480bae586942aee4294c5d3bd580f60f0de4
+  metadata.gz: 3dd84ec12b2544306275e4c55775e2ef95770e6e9de65adb028663f51bd099e6
+  data.tar.gz: c3bc7b9f5834a80f1e40de9e2c82fec32ce590aba1cb2022eb13c320303dd92d
 SHA512:
-  metadata.gz: 4527448422497989de11f0173dbaab24f357c477e8661f7511f8b1d3f9794b60e0073496266205ae641975a08439cabbbe084a435f6b9499e3d9675a394959bf
-  data.tar.gz: f43f34d4a40a05f0fdd13d29afa67c68abb9e55b13f0d3703e36181af4f7e1d12fcb4ddf29d706bdf301d877cd95147cb734310f9b5110fd449556984b35293f
+  metadata.gz: 3a29b71559385f62b6b084731cc77baea92c67ebe10b0f588610de8d5d9cecba54403f7201c8bbc1143a0122402195b356d7c0b45bac6d176136dbefcb016b02
+  data.tar.gz: 05cac4466fc4374f1cfbe3e547a462e2cdceed094b2eb043e6a713ff165ff852ec39f08d8f15aed0ae4e24634376243cced2ca36e37e5657bb87faaac4991f8b

data/README.md

@@ -2,7 +2,7 @@
 
 A modern rich text editor for Rails.
 
-**[Try it out!](https://basecamp.github.io/lexxy/try-it)**
+[Documentation](https://basecamp.github.io/lexxy/docs/) | <mark>[Try it out!](https://basecamp.github.io/lexxy/sandbox/)</mark>
 
 ## Features
 
@@ -15,24 +15,7 @@ A modern rich text editor for Rails.
 - Preview attachments like PDFs and Videos in the editor.
 - Works seamlessly with Action Text, generating the same canonical HTML format it expects for attachments.
 
-![Lexxy editor screenshot](docs/images/home.screenshot.png)
-
-## Documentation
-
-Visit the **[documentation site](https://basecamp.github.io/lexxy)**.
-
-## Roadmap
-
-This is a beta. Here's what's coming next:
-
-- [x] Configurable editors in Action Text: Choose your editor like you choose your database.
-- [x] More editing features:
-    - [x] Tables
-    - [x] Text highlighting
-- [x] Configuration hooks.
-- [x] Standalone JS package: to use in non-Rails environments.
-- [x] Image galleries: The only remaining feature for full Action Text compatibility
-- [ ] Install task that generates the necessary JS and adds stylesheets.
+![Lexxy editor screenshot](home/docs/images/home.screenshot.png)
 
 ## Contributing
 

data/app/assets/javascript/lexxy.js

@@ -12884,7 +12884,7 @@ class Clipboard {
     }
 
     if (this.#isPlainTextOrURLPasted(clipboardData)) {
-      this.#pastePlainText(clipboardData);
+      this.#pastePlainTextOrURL(clipboardData);
       event.preventDefault();
       return true
     }
@@ -12922,14 +12922,34 @@ class Clipboard {
     return types.length === 1 && types[0] === "text/plain"
   }
 
+  // Browsers expose a copied URL in several shapes:
+  //   Safari          [ text/plain, text/uri-list ]
+  //   App ShareSheet  [ text/uri-list ]
+  //   Chromium macOS  [ text/plain, text/html, (?:text/link-preview) ]
   #isOnlyURLPasted(clipboardData) {
-    // Safari URLs are copied as a text/plain + text/uri-list object
-    // App ShareSheet URLs are copied as solo text/uri-list object
+    if (this.#isLexicalClipboardData(clipboardData)) return false
+
     const types = Array.from(clipboardData.types);
-    return types.length
-      && types.length <= 2
-      && types.includes("text/uri-list")
-      && (types.length < 2 || types.includes("text/plain"))
+    if (types.includes("text/uri-list")) {
+      return types.every(type => type === "text/plain" || type === "text/uri-list")
+    }
+
+    if (clipboardData.files.length) return false
+
+    const text = clipboardData.getData("text/plain").trim();
+    if (!isAutolinkableURL(text)) return false
+
+    const html = clipboardData.getData("text/html");
+    return !html || this.#htmlIsBareLinkToURL(html, text)
+  }
+
+  #htmlIsBareLinkToURL(html, url) {
+    const doc = parseHtml(html);
+    if (doc.body.textContent.trim() !== url) return false
+
+    const links = doc.body.querySelectorAll("a");
+    if (links.length === 0) return true
+    return links.length === 1 && links[0].getAttribute("href") === url
   }
 
   #isPastingIntoCodeBlock() {
@@ -12963,14 +12983,12 @@ class Clipboard {
     }, { tag: jn });
   }
 
-  #pastePlainText(clipboardData) {
-    const item = clipboardData.items[0];
+  #pastePlainTextOrURL(clipboardData) {
+    const item = this.#plainTextOrURLItem(clipboardData);
     item.getAsString((text) => {
-      if (isAutolinkableURL(text) && this.contents.hasSelectedText()) {
-        this.contents.createLinkWithSelectedText(text);
-      } else if (isAutolinkableURL(text)) {
-        const nodeKey = this.contents.createLink(text);
-        this.#dispatchLinkInsertEvent(nodeKey, { url: text });
+      const url = text.trim();
+      if (isAutolinkableURL(url)) {
+        this.#pasteURL(url);
       } else if (this.editorElement.supportsMarkdown) {
         this.#pasteMarkdown(text);
       } else {
@@ -12979,6 +12997,20 @@ class Clipboard {
     });
   }
 
+  #plainTextOrURLItem(clipboardData) {
+    const items = Array.from(clipboardData.items);
+    return items.find((item) => item.type === "text/plain") || items.find((item) => item.type === "text/uri-list")
+  }
+
+  #pasteURL(url) {
+    if (this.contents.hasSelectedText()) {
+      this.contents.createLinkWithSelectedText(url);
+    } else {
+      const nodeKey = this.contents.createLink(url);
+      this.#dispatchLinkInsertEvent(nodeKey, { url });
+    }
+  }
+
   #insertSingleLinkAt(selection, url) {
     if (!Fr(selection)) return
 
@@ -13437,6 +13469,26 @@ function $getAllProvisionalParagraphs(rootNode = Zo()) {
   return Ht$3(rootNode.getChildren(), $isProvisionalParagraphNode)
 }
 
+// Registers code highlighting through the extension system so its node
+// transforms exist before the initial editor state is applied. Registering
+// after editor creation misses code blocks loaded from the initial value:
+// their transform pass has already run, and Lexical's catch-up dirtying
+// only sees the committed (still empty) state.
+class CodeHighlightingExtension extends LexxyExtension {
+  get enabled() {
+    return this.editorElement.supportsRichText
+  }
+
+  get lexicalExtension() {
+    return dc({
+      name: "lexxy/code-highlighting",
+      register(editor) {
+        return L$1(editor)
+      }
+    })
+  }
+}
+
 const TRIX_LANGUAGE_ATTR = "language";
 
 class TrixContentExtension extends LexxyExtension {
@@ -14957,6 +15009,7 @@ class LexicalEditorElement extends HTMLElement {
   get baseExtensions() {
     return [
       ProvisionalParagraphExtension,
+      CodeHighlightingExtension,
       HighlightExtension,
       TrixContentExtension,
       TablesExtension,
@@ -15364,7 +15417,7 @@ class LexicalEditorElement extends HTMLElement {
         Ie$2(this.editor)
       );
       this.#registerTableComponents();
-      this.#registerCodeHiglightingComponents();
+      this.#registerCodeLanguagePicker();
       if (this.supportsMarkdown) {
         const transformers = [ ...te, HORIZONTAL_DIVIDER ];
         registered.push(
@@ -15386,8 +15439,7 @@ class LexicalEditorElement extends HTMLElement {
     this.#disposables.push(tableTools);
   }
 
-  #registerCodeHiglightingComponents() {
-    L$1(this.editor);
+  #registerCodeLanguagePicker() {
     let codeLanguagePicker = this.querySelector("lexxy-code-language-picker");
     codeLanguagePicker ??= createElement("lexxy-code-language-picker");
     this.append(codeLanguagePicker);