Skip to content

Commit

Permalink
Editable: Fix splitting inline Editables using shift+enter
Browse files Browse the repository at this point in the history
  • Loading branch information
youknowriad committed Jun 20, 2017
1 parent d80189e commit 583e187
Showing 1 changed file with 25 additions and 16 deletions.
41 changes: 25 additions & 16 deletions blocks/editable/index.js
Original file line number Diff line number Diff line change
Expand Up @@ -206,6 +206,11 @@ export default class Editable extends wp.element.Component {
event.preventDefault();
event.stopImmediatePropagation();
}

if ( event.keyCode === ENTER && this.props.inline && this.props.onSplit && event.shiftKey ) {
event.preventDefault();
this.splitContent();
}
}

onKeyUp( { keyCode } ) {
Expand All @@ -229,28 +234,32 @@ export default class Editable extends wp.element.Component {
return;
}

const { dom } = this.editor;
const rootNode = this.editor.getBody();
const beforeRange = dom.createRng();
const afterRange = dom.createRng();
this.editor.dom.remove( prevNode );
this.splitContent();
}
}

dom.remove( prevNode );
splitContent() {
const { dom } = this.editor;
const rootNode = this.editor.getBody();
const beforeRange = dom.createRng();
const afterRange = dom.createRng();
const selectionRange = this.editor.selection.getRng();

beforeRange.setStart( rootNode, 0 );
beforeRange.setEnd( endNode.parentNode, dom.nodeIndex( endNode ) );
beforeRange.setStart( rootNode, 0 );
beforeRange.setEnd( selectionRange.startContainer, selectionRange.startOffset );

afterRange.setStart( endNode.parentNode, dom.nodeIndex( endNode ) + 1 );
afterRange.setEnd( rootNode, dom.nodeIndex( rootNode.lastChild ) + 1 );
afterRange.setStart( selectionRange.endContainer, selectionRange.endOffset );
afterRange.setEnd( rootNode, dom.nodeIndex( rootNode.lastChild ) + 1 );

const beforeFragment = beforeRange.extractContents();
const afterFragment = afterRange.extractContents();
const beforeFragment = beforeRange.extractContents();
const afterFragment = afterRange.extractContents();

const beforeElement = nodeListToReact( beforeFragment.childNodes, createElement );
const afterElement = nodeListToReact( afterFragment.childNodes, createElement );
const beforeElement = nodeListToReact( beforeFragment.childNodes, createElement );
const afterElement = nodeListToReact( afterFragment.childNodes, createElement );

this.setContent( beforeElement );
this.props.onSplit( beforeElement, afterElement );
}
this.setContent( beforeElement );
this.props.onSplit( beforeElement, afterElement );
}

onNewBlock() {
Expand Down

0 comments on commit 583e187

Please sign in to comment.