feat(richtext-lexical): link node: disable client-side link validation. This allows overriding validation behavior by providing your own url field to the Link feature.

Allows you to, for example, allow anchor nodes to be inputted as URL by overriding validation.

Author: AlessioGr

packages/richtext-lexical/src/field/features/link/plugins/link/index.tsx

@@ -27,13 +27,6 @@ export function LinkPlugin(): null {
       editor.registerCommand(
         TOGGLE_LINK_COMMAND,
         (payload: LinkPayload) => {
-          // validate
-          if (payload?.fields.linkType === 'custom') {
-            if (!(validateUrl === undefined || validateUrl(payload?.fields.url))) {
-              return false
-            }
-          }
-
           toggleLink(payload)
           return true
         },

packages/richtext-lexical/src/field/lexical/utils/url.ts

@@ -17,6 +17,8 @@ export function sanitizeUrl(url: string): string {
 const urlRegExp =
   /((([A-Za-z]{3,9}:(?:\/\/)?)(?:[-;:&=+$,\w]+@)?[A-Za-z\d.-]+|(?:www.|[-;:&=+$,\w]+@)[A-Za-z\d.-]+)((?:\/[+~%/.\w-]*)?\??[-+=&;%@.\w]*#?\w*)?)/
 
+// Do not keep validateUrl function too loose. This is run when pasting in text, to determine if links are in that text and if it should create AutoLinkNodes.
+// This is why we do not allow stuff like anchors here, as we don't want copied anchors to be turned into AutoLinkNodes.
 export function validateUrl(url: string): boolean {
   // TODO Fix UI for link insertion; it should never default to an invalid URL such as https://.
   // Maybe show a dialog where they user can type the URL before inserting it.