@lobehub/editor 1.19.0 → 1.20.0

package/es/react/hooks/useEditorState/index.js

@@ -15,6 +15,8 @@ import { INSERT_CODEINLINE_COMMAND } from "../../../plugins/code";
 import { $isSelectionInCodeInline } from "../../../plugins/code/node/code";
 import { UPDATE_CODEBLOCK_LANG } from "../../../plugins/codeblock";
 import { $isRootTextContentEmpty } from "../../../plugins/common/utils";
+import { INSERT_LINK_HIGHLIGHT_COMMAND } from "../../../plugins/link-highlight/command";
+import { $isLinkHighlightNode } from "../../../plugins/link-highlight/node/link-highlight";
 import { $isLinkNode, TOGGLE_LINK_COMMAND, formatUrl } from "../../../plugins/link/node/LinkNode";
 import { extractUrlFromText, sanitizeUrl, validateUrl } from "../../../plugins/link/utils";
 import { INSERT_CHECK_LIST_COMMAND } from "../../../plugins/list";
@@ -124,7 +126,8 @@ export function useEditorState(editor) {
       var elementDOM = editor === null || editor === void 0 || (_editor$getLexicalEdi = editor.getLexicalEditor()) === null || _editor$getLexicalEdi === void 0 ? void 0 : _editor$getLexicalEdi.getElementByKey(elementKey);
       var node = getSelectedNode(selection);
       var parent = node.getParent();
-      setIsLink($isLinkNode(parent) || $isLinkNode(node));
+      // Check for both Link and LinkHighlight nodes
+      setIsLink($isLinkNode(parent) || $isLinkNode(node) || $isLinkHighlightNode(parent) || $isLinkHighlightNode(node));
       var isCodeBlock = $isCodeNode(element) && $isCodeNode(focusElement) && elementKey === focusElement.getKey();
       setIsInCodeblok(isCodeBlock);
       setCodeblockLang(isCodeBlock ? element.getLanguage() : '');
@@ -258,7 +261,49 @@ export function useEditorState(editor) {
   var insertLink = useCallback(function () {
     var lexical = editor === null || editor === void 0 ? void 0 : editor.getLexicalEditor();
     if (!lexical) return;
+
+    // Detect which link type we're currently in
+    var inLinkNode = false;
+    var inLinkHighlightNode = false;
+    lexical.getEditorState().read(function () {
+      var selection = $getSelection();
+      if ($isRangeSelection(selection)) {
+        var node = getSelectedNode(selection);
+        var parent = node.getParent();
+        if ($isLinkNode(parent) || $isLinkNode(node)) {
+          inLinkNode = true;
+        }
+        if ($isLinkHighlightNode(parent) || $isLinkHighlightNode(node)) {
+          inLinkHighlightNode = true;
+        }
+      }
+    });
+
+    // If inside LinkHighlightNode, toggle it
+    if (inLinkHighlightNode) {
+      lexical.dispatchCommand(INSERT_LINK_HIGHLIGHT_COMMAND, undefined);
+      setIsLink(false);
+      return;
+    }
+
+    // If inside LinkNode, toggle it with standard Link plugin
+    if (inLinkNode) {
+      setIsLink(false);
+      lexical.dispatchCommand(TOGGLE_LINK_COMMAND, null);
+      return;
+    }
+
+    // Not in any link - try to insert new link
+    // Try LinkHighlight first, then fall back to standard Link if not handled
     if (!isLink) {
+      // First try INSERT_LINK_HIGHLIGHT_COMMAND
+      var linkHighlightHandled = lexical.dispatchCommand(INSERT_LINK_HIGHLIGHT_COMMAND, undefined);
+      if (linkHighlightHandled) {
+        setIsLink(true);
+        return;
+      }
+
+      // Fall back to standard Link plugin
       var nextUrl = sanitizeUrl('https://');
       var expandTo = null;
       lexical.getEditorState().read(function () {
@@ -283,7 +328,6 @@ export function useEditorState(editor) {
         }
       });
       setIsLink(true);
-      console.log(nextUrl);
       lexical.update(function () {
         if (expandTo) {
           var selection = $getSelection();
@@ -294,12 +338,8 @@ export function useEditorState(editor) {
             selection.focus.set(anchorNode.getKey(), expandTo.index + expandTo.length, 'text');
           }
         }
-        console.log(nextUrl);
         lexical.dispatchCommand(TOGGLE_LINK_COMMAND, validateUrl(nextUrl) ? nextUrl : sanitizeUrl('https://'));
       });
-    } else {
-      setIsLink(false);
-      lexical.dispatchCommand(TOGGLE_LINK_COMMAND, null);
     }
   }, [editor, isLink]);
   var insertMath = useCallback(function () {

package/es/utils/url.d.ts

@@ -0,0 +1,15 @@
+/**
+ * Shared URL validation utilities
+ */
+/**
+ * Validates if a string is a valid URL
+ * @param url - The URL to validate
+ * @returns true if the URL is valid, false otherwise
+ */
+export declare function isValidUrl(url: string): boolean;
+/**
+ * Checks if text is a pure URL (single URL without other text)
+ * @param text - The text to check
+ * @returns true if text is a pure URL, false otherwise
+ */
+export declare function isPureUrl(text: string): boolean;

package/es/utils/url.js

@@ -0,0 +1,51 @@
+/**
+ * Shared URL validation utilities
+ */
+
+// URL validation regex that matches common URL patterns
+var URL_REGEX = new RegExp(/^(?:(?:https?|ftp):\/\/)?(?:www\.)?[\dA-Za-z][\w#%+./:=?@~-]*[\w#%+/=@~-]$/);
+
+/**
+ * Validates if a string is a valid URL
+ * @param url - The URL to validate
+ * @returns true if the URL is valid, false otherwise
+ */
+export function isValidUrl(url) {
+  if (!url || typeof url !== 'string') return false;
+  var trimmed = url.trim();
+
+  // Check if it matches URL pattern
+  if (URL_REGEX.test(trimmed)) {
+    return true;
+  }
+
+  // Check if it's a valid URL with protocol
+  try {
+    var urlObj = new URL(trimmed);
+    return !!urlObj.protocol && !!urlObj.hostname;
+  } catch (_unused) {
+    // Not a valid URL
+  }
+
+  // Check if it looks like a domain (e.g., "google.com")
+  if (/^[\da-z][\w#%+./:=?@~-]*\.[\w#%+/:=?@~-]+$/i.test(trimmed)) {
+    return true;
+  }
+  return false;
+}
+
+/**
+ * Checks if text is a pure URL (single URL without other text)
+ * @param text - The text to check
+ * @returns true if text is a pure URL, false otherwise
+ */
+export function isPureUrl(text) {
+  if (!text || typeof text !== 'string') return false;
+  var trimmed = text.trim();
+
+  // Check if it's a single line
+  if (trimmed.includes('\n')) return false;
+
+  // Check if it's a valid URL
+  return isValidUrl(trimmed);
+}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@lobehub/editor",
-  "version": "1.19.0",
+  "version": "1.20.0",
   "description": "A powerful and extensible rich text editor built on Meta's Lexical framework, providing a modern editing experience with React integration.",
   "keywords": [
     "lobehub",