From bb3f1b4d242296111c377771c8aae70429944bef Mon Sep 17 00:00:00 2001 From: caipeichao Date: Fri, 25 Nov 2016 22:53:20 +0800 Subject: [PATCH 1/4] Support pasting code --- lib/handlePastedText.js | 20 ++++++++++++++++++++ lib/index.js | 3 ++- 2 files changed, 22 insertions(+), 1 deletion(-) create mode 100644 lib/handlePastedText.js diff --git a/lib/handlePastedText.js b/lib/handlePastedText.js new file mode 100644 index 0000000..5364aae --- /dev/null +++ b/lib/handlePastedText.js @@ -0,0 +1,20 @@ +var Draft = require('draft-js'); +var insertNewLine = require('./insertNewLine'); + +/** + * We split code blocks only if user pressed Cmd+Enter + * + * @param {SyntheticKeyboardEvent} event + * @param {Draft.EditorState} editorState + * @return {Draft.EditorState} + */ +function handlePastedText(editorState, text, html) { + var contentState = editorState.getCurrentContent(); + var selection = editorState.getSelection(); + + // Command+Return: As usual, split blocks + var newContentState = Draft.Modifier.insertText(contentState, selection, text); + return Draft.EditorState.push(editorState, newContentState, 'insert-characters'); +} + +module.exports = handlePastedText; diff --git a/lib/index.js b/lib/index.js index c237524..4605b1f 100644 --- a/lib/index.js +++ b/lib/index.js @@ -4,5 +4,6 @@ module.exports = { hasSelectionInBlock: require('./hasSelectionInBlock'), handleKeyCommand: require('./handleKeyCommand'), handleReturn: require('./handleReturn'), - handleTab: require('./handleTab') + handleTab: require('./handleTab'), + handlePastedText: require('./handlePastedText'), }; From 806ea268318f3808f38a9d738462b4fa4414f56e Mon Sep 17 00:00:00 2001 From: caipeichao Date: Fri, 25 Nov 2016 22:57:31 +0800 Subject: [PATCH 2/4] Add demo --- demo/main.js | 14 ++++++++++++++ 1 file changed, 14 insertions(+) diff --git a/demo/main.js b/demo/main.js index 758095f..7413a56 100644 --- a/demo/main.js +++ b/demo/main.js @@ -143,6 +143,19 @@ class PrismEditorExample extends React.Component { return true; } + handlePastedText(text, html) { + let editorState = this.state.editorState; + if (!CodeUtils.hasSelectionInBlock(editorState)) { + return; + } + + this.onChange( + CodeUtils.handlePastedText(editorState, text, html) + ) + return true; + + } + render() { const {editorState} = this.state; @@ -172,6 +185,7 @@ class PrismEditorExample extends React.Component { customStyleMap={styleMap} editorState={editorState} handleKeyCommand={this.handleKeyCommand} + handlePastedText={this.handlePastedText} keyBindingFn={this.keyBindingFn} onChange={this.onChange} placeholder="Tell a story..." From 18e003612cbdb506d957fda29b22f2b84b3e4655 Mon Sep 17 00:00:00 2001 From: caipeichao Date: Sat, 26 Nov 2016 15:14:09 +0800 Subject: [PATCH 3/4] Fix pasting code when select code --- lib/handlePastedText.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/lib/handlePastedText.js b/lib/handlePastedText.js index 5364aae..f25b829 100644 --- a/lib/handlePastedText.js +++ b/lib/handlePastedText.js @@ -13,7 +13,7 @@ function handlePastedText(editorState, text, html) { var selection = editorState.getSelection(); // Command+Return: As usual, split blocks - var newContentState = Draft.Modifier.insertText(contentState, selection, text); + var newContentState = Draft.Modifier.replaceText(contentState, selection, text); return Draft.EditorState.push(editorState, newContentState, 'insert-characters'); } From 760626e829978387cbe161a046259306f5ab36d2 Mon Sep 17 00:00:00 2001 From: caipeichao Date: Sat, 26 Nov 2016 15:15:43 +0800 Subject: [PATCH 4/4] Jump out of code block instead of split code block --- lib/handleReturn.js | 26 ++++++++++++++++++++------ 1 file changed, 20 insertions(+), 6 deletions(-) diff --git a/lib/handleReturn.js b/lib/handleReturn.js index e0f7bcc..a08169c 100644 --- a/lib/handleReturn.js +++ b/lib/handleReturn.js @@ -9,17 +9,31 @@ var insertNewLine = require('./insertNewLine'); * @return {Draft.EditorState} */ function handleReturn(e, editorState) { - var contentState = editorState.getCurrentContent(); - var selection = editorState.getSelection(); - // Command+Return: As usual, split blocks + var selection = editorState.getSelection(); if (selection.isCollapsed() && Draft.KeyBindingUtil.hasCommandModifier(e)) { - var newContentState = Draft.Modifier.splitBlock(contentState, selection); - return Draft.EditorState.push(editorState, newContentState, 'split-block'); + editorState = splitBlock(editorState); + editorState = setUnstyled(editorState); + return editorState; } - return insertNewLine(editorState); } +function splitBlock(editorState) { + var contentState = editorState.getCurrentContent(); + var selection = editorState.getSelection(); + var newContentState = Draft.Modifier.splitBlock(contentState, selection); + editorState = Draft.EditorState.push(editorState, newContentState, 'split-block'); + return editorState; +} + +function setUnstyled(editorState) { + var contentState = editorState.getCurrentContent(); + var selection = editorState.getSelection(); + var newContentState = Draft.Modifier.setBlockType(contentState, selection, 'unstyled'); + editorState = Draft.EditorState.push(editorState, newContentState, 'split-block'); + return editorState; +} + module.exports = handleReturn;