diff --git a/src/components/Widgets/MarkdownControlElements/VisualEditor/index.js b/src/components/Widgets/MarkdownControlElements/VisualEditor/index.js index fcee4d8a..a00620ca 100644 --- a/src/components/Widgets/MarkdownControlElements/VisualEditor/index.js +++ b/src/components/Widgets/MarkdownControlElements/VisualEditor/index.js @@ -5,13 +5,8 @@ import { EditorState } from 'prosemirror-state'; import { EditorView } from 'prosemirror-view'; import history from 'prosemirror-history'; import { - blockQuoteRule, - orderedListRule, - bulletListRule, - codeBlockRule, - headingRule, - inputRules, - allInputRules, + blockQuoteRule, orderedListRule, bulletListRule, codeBlockRule, headingRule, + inputRules, allInputRules, } from 'prosemirror-inputrules'; import { keymap } from 'prosemirror-keymap'; import { schema as markdownSchema, defaultMarkdownSerializer } from 'prosemirror-markdown'; @@ -67,20 +62,14 @@ function schemaWithPlugins(schema, plugins) { nodeSpec = nodeSpec.addToEnd(`plugin_${ plugin.get('id') }`, { attrs, group: 'block', - parseDOM: [ - { - tag: 'div[data-plugin]', - getAttrs(dom) { - return JSON.parse(dom.getAttribute('data-plugin')); - }, + parseDOM: [{ + tag: 'div[data-plugin]', + getAttrs(dom) { + return JSON.parse(dom.getAttribute('data-plugin')); }, - ], + }], toDOM(node) { - return [ - 'div', - { 'data-plugin': JSON.stringify(node.attrs) }, - plugin.get('label'), - ]; + return ['div', { 'data-plugin': JSON.stringify(node.attrs) }, plugin.get('label')]; }, }); }); @@ -170,28 +159,16 @@ export default class Editor extends Component { const { schema, selection } = state; if (selection.from === selection.to) { const { $from } = selection; - if ( - $from.parent && - $from.parent.type === schema.nodes.paragraph && - $from.parent.textContent === '' - ) { + if ($from.parent && $from.parent.type === schema.nodes.paragraph && $from.parent.textContent === '') { const pos = this.view.coordsAtPos(selection.from); const editorPos = this.view.content.getBoundingClientRect(); - const selectionPosition = { - top: pos.top - editorPos.top, - left: pos.left - editorPos.left, - }; + const selectionPosition = { top: pos.top - editorPos.top, left: pos.left - editorPos.left }; this.setState({ selectionPosition }); - } else { - this.setState({ showToolbar: false, showBlockMenu: false }); } } else { const pos = this.view.coordsAtPos(selection.from); const editorPos = this.view.content.getBoundingClientRect(); - const selectionPosition = { - top: pos.top - editorPos.top, - left: pos.left - editorPos.left, - }; + const selectionPosition = { top: pos.top - editorPos.top, left: pos.left - editorPos.left }; this.setState({ selectionPosition }); } }; @@ -200,7 +177,7 @@ export default class Editor extends Component { this.ref = ref; }; - handleHeader = level => + handleHeader = level => ( () => { const { schema } = this.state; const state = this.view.state; @@ -218,7 +195,8 @@ export default class Editor extends Component { const command = setBlockType(nodeType, { level }); command(state, this.handleAction); - }; + } + ); handleBold = () => { const command = toggleMark(this.state.schema.marks.strong); @@ -235,20 +213,14 @@ export default class Editor extends Component { if (!markActive(this.view.state, this.state.schema.marks.link)) { url = prompt('Link URL:'); // eslint-disable-line no-alert } - const command = toggleMark(this.state.schema.marks.link, { - href: url ? processUrl(url) : null, - }); + const command = toggleMark(this.state.schema.marks.link, { href: url ? processUrl(url) : null }); command(this.view.state, this.handleAction); }; handlePluginSubmit = (plugin, data) => { const { schema } = this.state; const nodeType = schema.nodes[`plugin_${ plugin.get('id') }`]; - this.view.props.onAction( - this.view.state.tr - .replaceSelectionWith(nodeType.create(data.toJS())) - .action() - ); + this.view.props.onAction(this.view.state.tr.replaceSelectionWith(nodeType.create(data.toJS())).action()); }; handleDragEnter = (e) => { @@ -276,35 +248,26 @@ export default class Editor extends Component { if (e.dataTransfer.files && e.dataTransfer.files.length) { Array.from(e.dataTransfer.files).forEach((file) => { - createAssetProxy(file.name, file).then((assetProxy) => { + createAssetProxy(file.name, file) + .then((assetProxy) => { this.props.onAddAsset(assetProxy); if (file.type.split('/')[0] === 'image') { nodes.push( - schema.nodes.image.create({ - src: assetProxy.public_path, - alt: file.name, - }) + schema.nodes.image.create({ src: assetProxy.public_path, alt: file.name }) ); } else { nodes.push( - schema.marks.link.create({ - href: assetProxy.public_path, - title: file.name, - }) + schema.marks.link.create({ href: assetProxy.public_path, title: file.name }) ); } }); }); } else { - nodes.push( - schema.nodes.paragraph.create({}, e.dataTransfer.getData('text/plain')) - ); + nodes.push(schema.nodes.paragraph.create({}, e.dataTransfer.getData('text/plain'))); } nodes.forEach((node) => { - this.view.props.onAction( - this.view.state.tr.replaceSelectionWith(node).action() - ); + this.view.props.onAction(this.view.state.tr.replaceSelectionWith(node).action()); }); }; @@ -320,38 +283,36 @@ export default class Editor extends Component { classNames.push(styles.dragging); } - return ( -