mirror of
https://github.com/element-hq/element-web.git
synced 2024-12-12 02:15:28 +03:00
Merge pull request #1232 from matrix-org/luke/fix-rte-backspace-unstyled-block
Interpret backspace at start of style block as block style toggle
This commit is contained in:
commit
75ca141cf9
1 changed files with 10 additions and 6 deletions
|
@ -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;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
Loading…
Reference in a new issue