fix: improves paste html formatting
This commit is contained in:
@@ -138,11 +138,9 @@ const RichText: React.FC<Props> = (props) => {
|
||||
|
||||
const editor = useMemo(() => {
|
||||
let CreatedEditor = withEnterBreakOut(
|
||||
withHTML(
|
||||
withHistory(
|
||||
withReact(
|
||||
createEditor(),
|
||||
),
|
||||
withHistory(
|
||||
withReact(
|
||||
createEditor(),
|
||||
),
|
||||
),
|
||||
);
|
||||
@@ -150,6 +148,8 @@ const RichText: React.FC<Props> = (props) => {
|
||||
CreatedEditor = enablePlugins(CreatedEditor, elements);
|
||||
CreatedEditor = enablePlugins(CreatedEditor, leaves);
|
||||
|
||||
CreatedEditor = withHTML(CreatedEditor);
|
||||
|
||||
return CreatedEditor;
|
||||
}, [elements, leaves]);
|
||||
|
||||
|
||||
@@ -28,7 +28,7 @@ const TEXT_TAGS = {
|
||||
U: () => ({ underline: true }),
|
||||
};
|
||||
|
||||
export const deserialize = (el) => {
|
||||
const deserialize = (el) => {
|
||||
if (el.nodeType === 3) {
|
||||
return el.textContent;
|
||||
} if (el.nodeType !== 1) {
|
||||
@@ -37,7 +37,6 @@ export const deserialize = (el) => {
|
||||
return '\n';
|
||||
}
|
||||
|
||||
|
||||
const { nodeName } = el;
|
||||
let parent = el;
|
||||
|
||||
@@ -48,15 +47,10 @@ export const deserialize = (el) => {
|
||||
) {
|
||||
[parent] = el.childNodes;
|
||||
}
|
||||
|
||||
let children = Array.from(parent.childNodes)
|
||||
const children = Array.from(parent.childNodes)
|
||||
.map(deserialize)
|
||||
.flat();
|
||||
|
||||
if (children.length === 0) {
|
||||
children = [{ text: '' }];
|
||||
}
|
||||
|
||||
if (el.nodeName === 'BODY') {
|
||||
return jsx('fragment', {}, children);
|
||||
}
|
||||
@@ -71,9 +65,7 @@ export const deserialize = (el) => {
|
||||
return children.map((child) => jsx('text', attrs, child));
|
||||
}
|
||||
|
||||
return children.map((child) => (typeof child === 'string'
|
||||
? jsx('element', ELEMENT_TAGS.P(), [{ text: child }])
|
||||
: child));
|
||||
return children;
|
||||
};
|
||||
|
||||
const withHTML = (incomingEditor) => {
|
||||
@@ -82,14 +74,15 @@ const withHTML = (incomingEditor) => {
|
||||
const editor = incomingEditor;
|
||||
|
||||
editor.insertData = (data) => {
|
||||
const html = data.getData('text/html');
|
||||
if (!data.types.includes('application/x-slate-fragment')) {
|
||||
const html = data.getData('text/html');
|
||||
|
||||
|
||||
if (html) {
|
||||
const parsed = new DOMParser().parseFromString(html, 'text/html');
|
||||
const fragment = deserialize(parsed.body);
|
||||
Transforms.insertFragment(editor, fragment);
|
||||
return;
|
||||
if (html) {
|
||||
const parsed = new DOMParser().parseFromString(html, 'text/html');
|
||||
const fragment = deserialize(parsed.body);
|
||||
Transforms.insertFragment(editor, fragment);
|
||||
return;
|
||||
}
|
||||
}
|
||||
|
||||
insertData(data);
|
||||
|
||||
Reference in New Issue
Block a user