client: fix markdown reference extensions

This commit is contained in:
fantasticit 2022-09-16 20:37:36 +08:00
parent e32f3ebf7e
commit c5812888f0
8 changed files with 32 additions and 18 deletions

View File

@ -9,10 +9,10 @@ import { htmlToProsemirror as mdHTMLToProsemirror } from '../markdown-to-prosemi
* @param defaultTitle heading paragraph
* @returns
*/
export const htmlToProsemirror = ({ schema, html, needTitle, defaultTitle = '' }) => {
export const htmlToProsemirror = ({ editor, schema, html, needTitle, defaultTitle = '' }) => {
const parser = new DOMParser();
const { body } = parser.parseFromString(extractImage(html), 'text/html');
body.append(document.createComment(html));
const doc = mdHTMLToProsemirror(body, needTitle, defaultTitle);
const doc = mdHTMLToProsemirror(editor, body, needTitle, defaultTitle);
return doc;
};

View File

@ -1,7 +1,5 @@
import { Renderer } from './renderer';
const renderer = new Renderer();
/**
*
* @param doc
@ -56,7 +54,8 @@ function fixNode(doc) {
* @param defaultTitle heading paragraph
* @returns
*/
export const htmlToProsemirror = (body, needTitle = false, defaultTitle = '') => {
export const htmlToProsemirror = (editor, body, needTitle = false, defaultTitle = '') => {
let renderer = new Renderer(editor);
const json = renderer.render(body);
// 设置标题
@ -103,5 +102,7 @@ export const htmlToProsemirror = (body, needTitle = false, defaultTitle = '') =>
}
fixNode(result);
renderer = null;
return result;
};

View File

@ -1,8 +1,12 @@
import { Editor } from '@tiptap/core';
export class Mark {
editor: Editor;
type: string;
DOMNode: HTMLElement;
constructor(DomNode) {
constructor(editor, DomNode) {
this.editor = editor;
this.type = 'mark';
this.DOMNode = DomNode;
}

View File

@ -1,8 +1,8 @@
import { Node } from './node';
export class ListItem extends Node {
constructor(DomNode) {
super(DomNode);
constructor(editor, DomNode) {
super(editor, DomNode);
this.wrapper = {
type: 'paragraph',
};

View File

@ -1,11 +1,15 @@
import { Editor } from '@tiptap/core';
import { getAttributes } from '../utils';
export class Node {
editor: Editor;
wrapper: unknown;
type = 'node';
DOMNode: HTMLElement;
constructor(DomNode: HTMLElement) {
constructor(editor, DomNode: HTMLElement) {
this.editor = editor;
this.wrapper = null;
this.DOMNode = DomNode;
}
@ -17,7 +21,7 @@ export class Node {
data(): Record<string, unknown> {
return {
type: this.type,
attrs: getAttributes(this.type, this.DOMNode),
attrs: getAttributes(this.editor, this.type, this.DOMNode),
};
}
}

View File

@ -1,4 +1,5 @@
// 自定义节点
import { Editor } from '@tiptap/core';
// marks
import { Bold } from './marks/bold';
import { Code } from './marks/code';
@ -45,12 +46,14 @@ import { Text } from './nodes/text';
import { Title } from './nodes/title';
export class Renderer {
editor: Editor;
document: HTMLElement;
nodes = [];
marks = [];
storedMarks = [];
constructor() {
constructor(editor) {
this.editor = editor;
this.document = undefined;
this.storedMarks = [];
@ -187,7 +190,7 @@ export class Renderer {
getMatchingClass(node, classes) {
for (const i in classes) {
const Class = classes[i];
const instance = new Class(node);
const instance = new Class(this.editor, node);
if (instance.matching()) {
return instance;
}

View File

@ -1,4 +1,4 @@
import { AllExtensions } from 'tiptap/core/all-kit';
import { Editor } from '@tiptap/core';
/**
* tiptap extension DOM
@ -28,8 +28,10 @@ const getAttribute = (
}, ret);
};
export const getAttributes = (name: string, element: HTMLElement): Record<string, unknown> => {
const ext = AllExtensions.find((ext) => ext && ext.name === name);
export const getAttributes = (editor: Editor, name: string, element: HTMLElement): Record<string, unknown> => {
if (!editor || !editor.extensionManager) return {};
const ext = Array.from(editor.extensionManager.extensions).find((ext) => ext && ext.name === name);
if (!ext) return {};

View File

@ -25,7 +25,7 @@ export const extractImage = (html) => {
};
// 将 markdown 字符串转换为 ProseMirror JSONDocument
export const markdownToProsemirror = ({ schema, content, needTitle, defaultTitle = '' }) => {
export const markdownToProsemirror = ({ editor, schema, content, needTitle, defaultTitle = '' }) => {
const html = markdownToHTML(content);
if (!html) return null;
@ -33,7 +33,7 @@ export const markdownToProsemirror = ({ schema, content, needTitle, defaultTitle
const parser = new DOMParser();
const { body } = parser.parseFromString(extractImage(html), 'text/html');
body.append(document.createComment(content));
const node = htmlToProsemirror(body, needTitle, defaultTitle);
const node = htmlToProsemirror(editor, body, needTitle, defaultTitle);
return node;
};