1
0
mirror of https://github.com/ianstormtaylor/slate.git synced 2025-02-24 17:23:07 +01:00

fix arrow keys during composing, fix composing in empty blocks

This commit is contained in:
Ian Storm Taylor 2016-07-19 11:09:17 -07:00
parent 6596c7df5e
commit 7ad10538e4

View File

@ -58,6 +58,7 @@ class Content extends React.Component {
constructor(props) {
super(props)
this.tmp = {}
this.forces = 0
}
/**
@ -152,12 +153,16 @@ class Content extends React.Component {
}
/**
* On composition end, remove the `isComposing` flag on the next tick.
* On composition end, remove the `isComposing` flag on the next tick. Also
* increment the `forces` key, which will force the contenteditable element
* to completely re-render, since IME puts React in an unreconcilable state.
*
* @param {Event} e
*/
onCompositionEnd = (e) => {
this.forces++
setTimeout(() => {
this.tmp.isComposing = false
})
@ -254,15 +259,16 @@ class Content extends React.Component {
onKeyDown = (e) => {
if (this.props.readOnly) return
const key = keycode(e.which)
// When composing, we don't want keydown events that are meant to end the
// composition to affect the editor state.
if (this.tmp.isComposing) {
if (
this.tmp.isComposing &&
key == 'left' || key == 'right' || key == 'up' || key == 'down'
) {
e.preventDefault()
return
}
const key = keycode(e.which)
if (
(key == 'enter') ||
@ -402,6 +408,7 @@ class Content extends React.Component {
return (
<div
key={`slate-content-${this.forces}`}
className={className}
contentEditable={!readOnly}
suppressContentEditableWarning