migrate from onDocumentChange to onChange

This commit is contained in:
Shawn Erquhart 2017-09-28 11:02:59 -04:00
parent 66699a610f
commit 155a0f972e
2 changed files with 14 additions and 10 deletions

View File

@ -19,6 +19,9 @@ export default class RawEditor extends React.Component {
} }
handleChange = change => { handleChange = change => {
if (!this.state.editorState.document.equals(change.state.document)) {
this.handleDocumentChange(change);
}
this.setState({ editorState: change.state }); this.setState({ editorState: change.state });
}; };
@ -26,7 +29,7 @@ export default class RawEditor extends React.Component {
* When the document value changes, serialize from Slate's AST back to plain * When the document value changes, serialize from Slate's AST back to plain
* text (which is Markdown) and pass that up as the new value. * text (which is Markdown) and pass that up as the new value.
*/ */
handleDocumentChange = debounce((doc, change) => { handleDocumentChange = debounce(change => {
const value = Plain.serialize(change.state); const value = Plain.serialize(change.state);
this.props.onChange(value); this.props.onChange(value);
}, 150); }, 150);
@ -61,7 +64,6 @@ export default class RawEditor extends React.Component {
className={styles.rawEditor} className={styles.rawEditor}
state={this.state.editorState} state={this.state.editorState}
onChange={this.handleChange} onChange={this.handleChange}
onDocumentChange={this.handleDocumentChange}
onPaste={this.handlePaste} onPaste={this.handlePaste}
/> />
</div> </div>

View File

@ -44,13 +44,6 @@ export default class Editor extends Component {
return change.insertFragment(doc); return change.insertFragment(doc);
} }
handleDocumentChange = debounce((doc, change) => {
const raw = Raw.serialize(change.state, { terse: true });
const plugins = this.state.shortcodePlugins;
const markdown = slateToMarkdown(raw, plugins);
this.props.onChange(markdown);
}, 150);
hasMark = type => this.state.editorState.marks.some(mark => mark.type === type); hasMark = type => this.state.editorState.marks.some(mark => mark.type === type);
hasBlock = type => this.state.editorState.blocks.some(node => node.type === type); hasBlock = type => this.state.editorState.blocks.some(node => node.type === type);
@ -155,7 +148,17 @@ export default class Editor extends Component {
return { onAction: e => handler(e, type), active: isActive(type) }; return { onAction: e => handler(e, type), active: isActive(type) };
}; };
handleDocumentChange = debounce(change => {
const raw = change.state.document.toJSON({ terse: true });
const plugins = this.state.shortcodePlugins;
const markdown = slateToMarkdown(raw, plugins);
this.props.onChange(markdown);
}, 150);
handleChange = change => { handleChange = change => {
if (!this.state.editorState.document.equals(change.state.document)) {
this.handleDocumentChange(change);
}
this.setState({ editorState: change.state }); this.setState({ editorState: change.state });
}; };
@ -196,7 +199,6 @@ export default class Editor extends Component {
schema={this.state.schema} schema={this.state.schema}
plugins={plugins} plugins={plugins}
onChange={this.handleChange} onChange={this.handleChange}
onDocumentChange={this.handleDocumentChange}
onKeyDown={onKeyDown} onKeyDown={onKeyDown}
onPaste={this.handlePaste} onPaste={this.handlePaste}
ref={ref => this.ref = ref} ref={ref => this.ref = ref}