Interpret backspace at start of style block as block style toggle

Part of fixing https://github.com/vector-im/riot-web/issues/4580
This commit is contained in:
Luke Barnard 2017-07-18 17:52:04 +01:00
parent ee5117525c
commit 98ca937fef

View file

@ -528,16 +528,19 @@ export default class MessageComposerInput extends React.Component {
if (this.state.isRichtextEnabled) { if (this.state.isRichtextEnabled) {
// These are block types, not handled by RichUtils by default. // These are block types, not handled by RichUtils by default.
const blockCommands = ['code-block', 'blockquote', 'unordered-list-item', 'ordered-list-item']; const blockCommands = ['code-block', 'blockquote', 'unordered-list-item', 'ordered-list-item'];
const currentBlockType = RichUtils.getCurrentBlockType(this.state.editorState);
if (blockCommands.includes(command)) { if (blockCommands.includes(command)) {
this.setState({ newState = RichUtils.toggleBlockType(this.state.editorState, command);
editorState: RichUtils.toggleBlockType(this.state.editorState, command),
});
} else if (command === 'strike') { } else if (command === 'strike') {
// this is the only inline style not handled by Draft by default // this is the only inline style not handled by Draft by default
this.setState({ newState = RichUtils.toggleInlineStyle(this.state.editorState, 'STRIKETHROUGH');
editorState: RichUtils.toggleInlineStyle(this.state.editorState, 'STRIKETHROUGH'), } else if (command === 'backspace' && currentBlockType !== 'unstyled') {
}); const currentStartOffset = this.state.editorState.getSelection().getStartOffset();
if (currentStartOffset === 0) {
// Toggle current block type (setting it to 'unstyled')
newState = RichUtils.toggleBlockType(this.state.editorState, currentBlockType);
}
} }
} else { } else {
let contentState = this.state.editorState.getCurrentContent(); let contentState = this.state.editorState.getCurrentContent();
@ -644,6 +647,7 @@ export default class MessageComposerInput extends React.Component {
// By returning false, we allow the default draft-js key binding to occur, // By returning false, we allow the default draft-js key binding to occur,
// which in this case invokes "split-block". This creates a new block of the // which in this case invokes "split-block". This creates a new block of the
// same type, allowing the user to delete it with backspace. // same type, allowing the user to delete it with backspace.
// See handleKeyCommand (when command === 'backspace')
return false; return false;
} }