wire up the rest of the switch from NodeView to ToDOM()

Author: aalear

src/rich-text/editor.ts

@@ -29,7 +29,6 @@ import { stackOverflowMarkdownSerializer } from "../shared/markdown-serializer";
 import { CodeBlockView } from "./node-views/code-block";
 import { HtmlBlock, HtmlBlockContainer } from "./node-views/html-block";
 import { ImageView } from "./node-views/image";
-import { TagLink } from "./node-views/tag-link";
 import { richTextCodePasteHandler } from "../shared/prosemirror-plugins/code-paste-handler";
 import { linkPasteHandler } from "./plugins/link-paste-handler";
 import { linkPreviewPlugin, LinkPreviewProvider } from "./plugins/link-preview";
@@ -97,7 +96,6 @@ export class RichTextEditor extends BaseView {
             this.options.menuParentContainer
         );
 
-        const tagLinkOptions = this.options.parserFeatures.tagLinks;
         this.editorView = new EditorView(
             (node: HTMLElement) => {
                 node.classList.add(...(this.options.classList || []));
@@ -158,9 +156,6 @@ export class RichTextEditor extends BaseView {
                     ) {
                         return new ImageView(node, view, getPos);
                     },
-                    tagLink: (node, view, getPos) => {
-                        return new TagLink(node, view, getPos, tagLinkOptions);
-                    },
                     html_block: function (node: ProseMirrorNode) {
                         return new HtmlBlock(node);
                     },

src/rich-text/node-views/tag-link.ts

@@ -423,22 +423,29 @@ const nodes: {
         },
     },
 
-    // TODO should this be a mark instead?
     tagLink: {
         content: "text*",
-        marks: "", // TODO should it accept marks?
+        marks: "",
         atom: true, // TODO allow this to be editable
         inline: true,
         group: "inline",
         attrs: {
-            tagName: { default: null },
-            tagType: { default: "tag" },
+            tagName: { default: null }, // TODO: remove?
+            tagType: { default: "tag" }, // TODO: remove?
             href: { default: null },
             title: { default: null },
-            additionalClasses: { default: null },
+            additionalClasses: { default: "" },
         },
         toDOM(node) {
-            // TODO
+            return [
+                "a",
+                {
+                    href: node.attrs.href as string,
+                    title: node.attrs.title as string,
+                    class: "s-tag " + node.attrs.additionalClasses
+                },
+                node.attrs.tagName
+            ];
         },
     },
 };

src/rich-text/schema.ts

@@ -38,7 +38,7 @@ function parse_tag_link(
         return false;
     }
 
-    const tagName = totalContent.slice(isMeta ? 10 : 5, -1);
+    const tagName = totalContent.slice(isMeta ? 10 : 5, -1).trim();
 
     // check that the tag name follows specific rules TODO better docs
     const validationRegex = options.allowNonAscii
@@ -75,8 +75,6 @@ function parse_tag_link(
             token.attrSet("additionalClasses", additionalClasses.join(" "));
         }
 
-        token.content = totalContent;
-
         token = state.push("text", "", 0);
         token.content = tagName;
 

src/shared/markdown-it/tag-link.ts

@@ -113,10 +113,13 @@ const customMarkdownParserTokens: MarkdownParser["tokens"] = {
     },
 
     tag_link: {
-        block: "tagLink",
+        block: "tagLink", // TODO: rename to "tag_link" to match others?
         getAttrs: (tok: Token) => ({
             tagName: tok.attrGet("tagName"),
             tagType: tok.attrGet("tagType"),
+            href: tok.attrGet("href"),
+            additionalClasses: tok.attrGet("additionalClasses"),
+            title: tok.attrGet("title")
         }),
     },