Draft-js: insert softbreak on shift-enter inside blocks

[ianstormtaylor]

I just noticed that inside of blocks like blockquote and list-item it's impossible to create "soft-breaks", which are usually created by pressing Shift-Enter. Right now that will just act as Enter will, creating a new block below the current one.

[hellendag]

If you're referring to the rich.html example, I think soft newlines are always being treated as full block breaks, which is the default behavior for return.

You can use https://github.com/facebook/draft-js/blob/master/src/model/modifier/RichTextEditorUtil.js#L81 for this in your editor, if you'd like to support soft newlines instead.

[williamli]

Medium-Draft has one of the best "shift-enter" handling.

You can go to https://github.com/brijeshb42/medium-draft/blob/master/src/editor.js#L355 and checkout their implementation.

Demo is at http://bitwiser.in/medium-draft/

Shift-Enter is handled differently based on the type of block selected.

@hellendag @ianstormtaylor

[ahoys]

If someone else is looking for shift-enter solutions, here's what I came up with RichUtils:

handleReturn = evt => {
    const blockType = RichUtils.getCurrentBlockType(this.state.editorState);
    if (blockType !== 'unstyled' || !isSoftNewlineEvent(evt)) {
      // Just to be sure, soft returns are executed only with unstyled blocks.
      return 'not_handled';
    }
    const newState = RichUtils.insertSoftNewline(this.state.editorState);
    this.onChange(newState);
    // Returning handled sends the editor a message that we'll handle this
    // update.
    return 'handled';
  };

And with , use: handleReturn={this.handleReturn}

Not sure if relevant here, but I'm using draft-js-plugins-editor.