mirrors/element-web
1
0
Fork 0
mirror of https://github.com/element-hq/element-web synced 2024-11-27 11:47:23 +03:00
Code Issues Projects Releases Packages Wiki Activity

let backspace delete list nodes in RTE

Browse source
This commit is contained in:
Matthew Hodgson 2018-05-19 20:38:07 +01:00
parent 167742d900
commit a4d9338cf0
1 changed files with 25 additions and 4 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

29
src/components/views/rooms/MessageComposerInput.js
View file

@ -77,6 +77,10 @@ const ENTITY_TYPES = {
AT_ROOM_PILL: 'ATROOMPILL', AT_ROOM_PILL: 'ATROOMPILL',
}; };
// the Slate node type to default to for unstyled text when in RTE mode.
// (we use 'line' for oneliners however)
const DEFAULT_NODE = 'paragraph';
function onSendMessageFailed(err, room) { function onSendMessageFailed(err, room) {
// XXX: temporary logging to try to diagnose // XXX: temporary logging to try to diagnose
@ -152,13 +156,13 @@ export default class MessageComposerInput extends React.Component {
if (obj.object === 'block' || obj.object === 'inline') { if (obj.object === 'block' || obj.object === 'inline') {
return this.renderNode({ return this.renderNode({
node: obj, node: obj,
children: children, children: children,
}); });
} }
else if (obj.object === 'mark') { else if (obj.object === 'mark') {
return this.renderMark({ return this.renderMark({
mark: obj, mark: obj,
children: children, children: children,
}); });
} }
} }
@ -548,6 +552,8 @@ export default class MessageComposerInput extends React.Component {
switch (ev.keyCode) { switch (ev.keyCode) {
case KeyCode.ENTER: case KeyCode.ENTER:
return this.handleReturn(ev); return this.handleReturn(ev);
case KeyCode.BACKSPACE:
return this.onBackspace(ev);
case KeyCode.UP: case KeyCode.UP:
return this.onVerticalArrow(ev, true); return this.onVerticalArrow(ev, true);
case KeyCode.DOWN: case KeyCode.DOWN:
@ -562,6 +568,23 @@ export default class MessageComposerInput extends React.Component {
} }
}; };
onBackspace = (ev: Event): boolean => {
if (this.state.isRichtextEnabled) {
// let backspace exit lists
const isList = this.hasBlock('list-item');
if (isList) {
const change = this.state.editorState.change();
change
.setBlocks(DEFAULT_NODE)
.unwrapBlock('bulleted-list')
.unwrapBlock('numbered-list');
this.onChange(change);
return true;
}
}
return;
};
handleKeyCommand = (command: string): boolean => { handleKeyCommand = (command: string): boolean => {
if (command === 'toggle-mode') { if (command === 'toggle-mode') {
this.enableRichtext(!this.state.isRichtextEnabled); this.enableRichtext(!this.state.isRichtextEnabled);
@ -570,8 +593,6 @@ export default class MessageComposerInput extends React.Component {
let newState: ?Value = null; let newState: ?Value = null;
const DEFAULT_NODE = 'paragraph';
// Draft handles rich text mode commands by default but we need to do it ourselves for Markdown. // Draft handles rich text mode commands by default but we need to do it ourselves for Markdown.
if (this.state.isRichtextEnabled) { if (this.state.isRichtextEnabled) {
const type = command; const type = command;