gcg/static-cms
0
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Update Slate to 0.29.0

Browse Source
This commit is contained in:
Shawn Erquhart 2017-11-16 12:36:48 -05:00
parent c9e97b5c7e
commit 63d2b09b09
8 changed files with 76 additions and 76 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

10
package.json
View File

@ -176,12 +176,12 @@
"remark-stringify": "^3.0.1", "remark-stringify": "^3.0.1",
"sanitize-filename": "^1.6.1", "sanitize-filename": "^1.6.1",
"semaphore": "^1.0.5", "semaphore": "^1.0.5",
"slate": "^0.28.0", "slate": "^0.29.0",
"slate-edit-list": "^0.9.0", "slate-edit-list": "^0.10.1",
"slate-edit-table": "^0.12.0", "slate-edit-table": "^0.12.0",
"slate-plain-serializer": "^0.2.0", "slate-plain-serializer": "^0.3.0",
"slate-react": "^0.8.0", "slate-react": "^0.9.0",
"slate-soft-break": "^0.5.0", "slate-soft-break": "^0.6.0",
"slug": "^0.9.1", "slug": "^0.9.1",
"toml-j0.4": "^1.1.1", "toml-j0.4": "^1.1.1",
"tomlify-j0.4": "^3.0.0-alpha.0", "tomlify-j0.4": "^3.0.0-alpha.0",

12
src/components/Widgets/Markdown/MarkdownControl/RawEditor/index.js
View File

@ -10,19 +10,19 @@ export default class RawEditor extends React.Component {
constructor(props) { constructor(props) {
super(props); super(props);
this.state = { this.state = {
editorState: Plain.deserialize(this.props.value || ''), value: Plain.deserialize(this.props.value || ''),
}; };
} }
shouldComponentUpdate(nextProps, nextState) { shouldComponentUpdate(nextProps, nextState) {
return !this.state.editorState.equals(nextState.editorState); return !this.state.value.equals(nextState.value);
} }
handleChange = change => { handleChange = change => {
if (!this.state.editorState.document.equals(change.state.document)) { if (!this.state.value.document.equals(change.value.document)) {
this.handleDocumentChange(change); this.handleDocumentChange(change);
} }
this.setState({ editorState: change.state }); this.setState({ value: change.value });
}; };
/** /**
@ -30,7 +30,7 @@ export default class RawEditor extends React.Component {
* 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(change => { handleDocumentChange = debounce(change => {
const value = Plain.serialize(change.state); const value = Plain.serialize(change.value);
this.props.onChange(value); this.props.onChange(value);
}, 150); }, 150);
@ -62,7 +62,7 @@ export default class RawEditor extends React.Component {
</Sticky> </Sticky>
<Slate <Slate
className="nc-rawEditor-rawEditor" className="nc-rawEditor-rawEditor"
state={this.state.editorState} value={this.state.value}
onChange={this.handleChange} onChange={this.handleChange}
onPaste={this.handlePaste} onPaste={this.handlePaste}
/> />

52
src/components/Widgets/Markdown/MarkdownControl/VisualEditor/index.js
View File

@ -1,7 +1,7 @@
import PropTypes from 'prop-types'; import PropTypes from 'prop-types';
import React, { Component } from 'react'; import React, { Component } from 'react';
import { get, isEmpty, debounce } from 'lodash'; import { get, isEmpty, debounce } from 'lodash';
import { State, Document, Block, Text } from 'slate'; import { Value, Document, Block, Text } from 'slate';
import { Editor as Slate } from 'slate-react'; import { Editor as Slate } from 'slate-react';
import { slateToMarkdown, markdownToSlate, htmlToSlate } from '../../serializers'; import { slateToMarkdown, markdownToSlate, htmlToSlate } from '../../serializers';
import registry from '../../../../../lib/registry'; import registry from '../../../../../lib/registry';
@ -21,15 +21,15 @@ export default class Editor extends Component {
const rawDoc = this.props.value && markdownToSlate(this.props.value); const rawDoc = this.props.value && markdownToSlate(this.props.value);
const rawDocHasNodes = !isEmpty(get(rawDoc, 'nodes')) const rawDocHasNodes = !isEmpty(get(rawDoc, 'nodes'))
const document = Document.fromJSON(rawDocHasNodes ? rawDoc : emptyRawDoc); const document = Document.fromJSON(rawDocHasNodes ? rawDoc : emptyRawDoc);
const editorState = State.create({ document }); const value = Value.create({ document });
this.state = { this.state = {
editorState, value,
shortcodePlugins: registry.getEditorComponents(), shortcodePlugins: registry.getEditorComponents(),
}; };
} }
shouldComponentUpdate(nextProps, nextState) { shouldComponentUpdate(nextProps, nextState) {
return !this.state.editorState.equals(nextState.editorState); return !this.state.value.equals(nextState.value);
} }
handlePaste = (e, data, change) => { handlePaste = (e, data, change) => {
@ -41,22 +41,22 @@ export default class Editor extends Component {
return change.insertFragment(doc); return change.insertFragment(doc);
} }
hasMark = type => this.state.editorState.activeMarks.some(mark => mark.type === type); hasMark = type => this.state.value.activeMarks.some(mark => mark.type === type);
hasBlock = type => this.state.editorState.blocks.some(node => node.type === type); hasBlock = type => this.state.value.blocks.some(node => node.type === type);
handleMarkClick = (event, type) => { handleMarkClick = (event, type) => {
event.preventDefault(); event.preventDefault();
const resolvedChange = this.state.editorState.change().focus().toggleMark(type); const resolvedChange = this.state.value.change().focus().toggleMark(type);
this.ref.onChange(resolvedChange); this.ref.onChange(resolvedChange);
this.setState({ editorState: resolvedChange.state }); this.setState({ value: resolvedChange.value });
}; };
handleBlockClick = (event, type) => { handleBlockClick = (event, type) => {
event.preventDefault(); event.preventDefault();
let { editorState } = this.state; let { value } = this.state;
const { document: doc, selection } = editorState; const { document: doc, selection } = value;
const { unwrapList, wrapInList } = EditListConfigured.changes; const { unwrapList, wrapInList } = EditListConfigured.changes;
let change = editorState.change(); let change = value.change();
// Handle everything except list buttons. // Handle everything except list buttons.
if (!['bulleted-list', 'numbered-list'].includes(type)) { if (!['bulleted-list', 'numbered-list'].includes(type)) {
@ -66,10 +66,10 @@ export default class Editor extends Component {
// Handle the extra wrapping required for list buttons. // Handle the extra wrapping required for list buttons.
else { else {
const isSameListType = editorState.blocks.some(block => { const isSameListType = value.blocks.some(block => {
return !!doc.getClosest(block.key, parent => parent.type === type); return !!doc.getClosest(block.key, parent => parent.type === type);
}); });
const isInList = EditListConfigured.utils.isSelectionInList(editorState); const isInList = EditListConfigured.utils.isSelectionInList(value);
if (isInList && isSameListType) { if (isInList && isSameListType) {
change = change.call(unwrapList, type); change = change.call(unwrapList, type);
@ -83,15 +83,15 @@ export default class Editor extends Component {
const resolvedChange = change.focus(); const resolvedChange = change.focus();
this.ref.onChange(resolvedChange); this.ref.onChange(resolvedChange);
this.setState({ editorState: resolvedChange.state }); this.setState({ value: resolvedChange.value });
}; };
hasLinks = () => { hasLinks = () => {
return this.state.editorState.inlines.some(inline => inline.type === 'link'); return this.state.value.inlines.some(inline => inline.type === 'link');
}; };
handleLink = () => { handleLink = () => {
let change = this.state.editorState.change(); let change = this.state.value.change();
// If the current selection contains links, clicking the "link" button // If the current selection contains links, clicking the "link" button
// should simply unlink them. // should simply unlink them.
@ -106,7 +106,7 @@ export default class Editor extends Component {
if (!url) return; if (!url) return;
// If no text is selected, use the entered URL as text. // If no text is selected, use the entered URL as text.
if (change.state.isCollapsed) { if (change.value.isCollapsed) {
change = change change = change
.insertText(url) .insertText(url)
.extend(0 - url.length); .extend(0 - url.length);
@ -118,19 +118,19 @@ export default class Editor extends Component {
} }
this.ref.onChange(change); this.ref.onChange(change);
this.setState({ editorState: change.state }); this.setState({ value: change.value });
}; };
handlePluginSubmit = (plugin, shortcodeData) => { handlePluginSubmit = (plugin, shortcodeData) => {
const { editorState } = this.state; const { value } = this.state;
const data = { const data = {
shortcode: plugin.id, shortcode: plugin.id,
shortcodeData, shortcodeData,
}; };
const nodes = [Text.create('')]; const nodes = [Text.create('')];
const block = { kind: 'block', type: 'shortcode', data, isVoid: true, nodes }; const block = { kind: 'block', type: 'shortcode', data, isVoid: true, nodes };
let change = editorState.change(); let change = value.change();
const { focusBlock } = change.state; const { focusBlock } = change.value;
if (focusBlock.text === '') { if (focusBlock.text === '') {
change = change.setNodeByKey(focusBlock.key, block); change = change.setNodeByKey(focusBlock.key, block);
@ -141,7 +141,7 @@ export default class Editor extends Component {
change = change.focus(); change = change.focus();
this.ref.onChange(change); this.ref.onChange(change);
this.setState({ editorState: change.state }); this.setState({ value: change.value });
}; };
handleToggle = () => { handleToggle = () => {
@ -156,17 +156,17 @@ export default class Editor extends Component {
}; };
handleDocumentChange = debounce(change => { handleDocumentChange = debounce(change => {
const raw = change.state.document.toJSON(); const raw = change.value.document.toJSON();
const plugins = this.state.shortcodePlugins; const plugins = this.state.shortcodePlugins;
const markdown = slateToMarkdown(raw, plugins); const markdown = slateToMarkdown(raw, plugins);
this.props.onChange(markdown); this.props.onChange(markdown);
}, 150); }, 150);
handleChange = change => { handleChange = change => {
if (!this.state.editorState.document.equals(change.state.document)) { if (!this.state.value.document.equals(change.value.document)) {
this.handleDocumentChange(change); this.handleDocumentChange(change);
} }
this.setState({ editorState: change.state }); this.setState({ value: change.value });
}; };
render() { render() {
@ -202,7 +202,7 @@ export default class Editor extends Component {
</Sticky> </Sticky>
<Slate <Slate
className="nc-visualEditor-editor" className="nc-visualEditor-editor"
state={this.state.editorState} value={this.state.value}
renderNode={renderNode} renderNode={renderNode}
renderMark={renderMark} renderMark={renderMark}
validateNode={validateNode} validateNode={validateNode}

4
src/components/Widgets/Markdown/MarkdownControl/VisualEditor/keys.js
View File

@ -11,7 +11,7 @@ function changeHistory(change, type) {
/** /**
* Get the history for undo or redo (determined via `type` param). * Get the history for undo or redo (determined via `type` param).
*/ */
const { history } = change.state; const { history } = change.value;
if (!history) return; if (!history) return;
const historyOfType = history[`${type}s`]; const historyOfType = history[`${type}s`];
@ -49,7 +49,7 @@ function onKeyDown(e, data, change) {
* If the selected block is the first block in the document, create the * If the selected block is the first block in the document, create the
* new block above it. If not, create the new block below it. * new block above it. If not, create the new block below it.
*/ */
const { document: doc, range, anchorBlock, focusBlock } = change.state; const { document: doc, range, anchorBlock, focusBlock } = change.value;
const singleBlockSelected = anchorBlock === focusBlock; const singleBlockSelected = anchorBlock === focusBlock;
if (!singleBlockSelected || !focusBlock.isVoid) return; if (!singleBlockSelected || !focusBlock.isVoid) return;

10
src/components/Widgets/Markdown/MarkdownControl/VisualEditor/plugins.js
View File

@ -9,7 +9,7 @@ const SoftBreak = (options = {}) => ({
if (options.shift && e.shiftKey == false) return; if (options.shift && e.shiftKey == false) return;
const { onlyIn, ignoreIn, defaultBlock = 'paragraph' } = options; const { onlyIn, ignoreIn, defaultBlock = 'paragraph' } = options;
const { type, text } = change.state.startBlock; const { type, text } = change.value.startBlock;
if (onlyIn && !onlyIn.includes(type)) return; if (onlyIn && !onlyIn.includes(type)) return;
if (ignoreIn && ignoreIn.includes(type)) return; if (ignoreIn && ignoreIn.includes(type)) return;
@ -39,9 +39,9 @@ export const ParagraphSoftBreakConfigured = SoftBreak({ onlyIn: ['paragraph'], s
const BreakToDefaultBlock = ({ onlyIn = [], defaultBlock = 'paragraph' }) => ({ const BreakToDefaultBlock = ({ onlyIn = [], defaultBlock = 'paragraph' }) => ({
onKeyDown(e, data, change) { onKeyDown(e, data, change) {
const { state } = change; const { value } = change;
if (data.key != 'enter' || e.shiftKey == true || state.isExpanded) return; if (data.key != 'enter' || e.shiftKey == true || value.isExpanded) return;
if (onlyIn.includes(state.startBlock.type)) { if (onlyIn.includes(value.startBlock.type)) {
return change.insertBlock(defaultBlock); return change.insertBlock(defaultBlock);
} }
} }
@ -58,7 +58,7 @@ const BackspaceCloseBlock = (options = {}) => ({
if (data.key != 'backspace') return; if (data.key != 'backspace') return;
const { defaultBlock = 'paragraph', ignoreIn, onlyIn } = options; const { defaultBlock = 'paragraph', ignoreIn, onlyIn } = options;
const { startBlock } = change.state; const { startBlock } = change.value;
const { type } = startBlock; const { type } = startBlock;
if (onlyIn && !onlyIn.includes(type)) return; if (onlyIn && !onlyIn.includes(type)) return;

4
src/components/Widgets/Markdown/MarkdownControl/VisualEditor/renderers.js
View File

@ -63,8 +63,8 @@ export const renderNode = props => {
return result; return result;
}; };
case 'shortcode': props => { case 'shortcode': props => {
const { attributes, node, state: editorState } = props; const { attributes, node, editor } = props;
const isSelected = editorState.selection.hasFocusIn(node); const isSelected = editor.value.selection.hasFocusIn(node);
const className = cn('nc-visualEditor-shortcode', { ['nc-visualEditor-shortcodeSelected']: isSelected }); const className = cn('nc-visualEditor-shortcode', { ['nc-visualEditor-shortcodeSelected']: isSelected });
return <div {...attributes} className={className} draggable >{node.data.get('shortcode')}</div>; return <div {...attributes} className={className} draggable >{node.data.get('shortcode')}</div>;
}; };

2
src/components/Widgets/Markdown/MarkdownControl/VisualEditor/validators.js
View File

@ -20,7 +20,7 @@ export function validateNode(node) {
type: 'paragraph', type: 'paragraph',
nodes: [Text.create('')], nodes: [Text.create('')],
}); });
const { key } = change.state.document; const { key } = change.value.document;
return change.insertNodeByKey(key, 0, block).focus(); return change.insertNodeByKey(key, 0, block).focus();
}; };
} }

58
yarn.lock
View File

@ -8525,39 +8525,39 @@ slash@^1.0.0:
version "1.0.0" version "1.0.0"
resolved "https://registry.yarnpkg.com/slash/-/slash-1.0.0.tgz#c41f2f6c39fc16d1cd17ad4b5d896114ae470d55" resolved "https://registry.yarnpkg.com/slash/-/slash-1.0.0.tgz#c41f2f6c39fc16d1cd17ad4b5d896114ae470d55"
slate-base64-serializer@^0.1.22: slate-base64-serializer@^0.2.1:
version "0.1.22" version "0.2.9"
resolved "https://registry.yarnpkg.com/slate-base64-serializer/-/slate-base64-serializer-0.1.22.tgz#548e589178c75653004168004aad152f1976dd35" resolved "https://registry.yarnpkg.com/slate-base64-serializer/-/slate-base64-serializer-0.2.9.tgz#14698ca6b48fae2661cd59db8ccd909becb73c6b"
dependencies: dependencies:
isomorphic-base64 "^1.0.2" isomorphic-base64 "^1.0.2"
slate-dev-logger@^0.1.23: slate-dev-logger@^0.1.25:
version "0.1.33" version "0.1.33"
resolved "https://registry.yarnpkg.com/slate-dev-logger/-/slate-dev-logger-0.1.33.tgz#b4a4272255c2d598e5f26db5d85c58435357755f" resolved "https://registry.yarnpkg.com/slate-dev-logger/-/slate-dev-logger-0.1.33.tgz#b4a4272255c2d598e5f26db5d85c58435357755f"
slate-edit-list@^0.9.0: slate-edit-list@^0.10.1:
version "0.9.0" version "0.10.1"
resolved "https://registry.yarnpkg.com/slate-edit-list/-/slate-edit-list-0.9.0.tgz#18fdeb8e6f4068da88a05aa0cb499a191d8343e6" resolved "https://registry.yarnpkg.com/slate-edit-list/-/slate-edit-list-0.10.1.tgz#9c6a142a314b0ff22a327f1b50c8f5c85468cb17"
slate-edit-table@^0.12.0: slate-edit-table@^0.12.0:
version "0.12.0" version "0.12.0"
resolved "https://registry.yarnpkg.com/slate-edit-table/-/slate-edit-table-0.12.0.tgz#9163e67b8025c3c09d6037eb76cb5e652b65dd47" resolved "https://registry.yarnpkg.com/slate-edit-table/-/slate-edit-table-0.12.0.tgz#9163e67b8025c3c09d6037eb76cb5e652b65dd47"
slate-plain-serializer@^0.2.0, slate-plain-serializer@^0.2.8: slate-plain-serializer@^0.3.0, slate-plain-serializer@^0.3.1:
version "0.2.8" version "0.3.1"
resolved "https://registry.yarnpkg.com/slate-plain-serializer/-/slate-plain-serializer-0.2.8.tgz#9bff5fafa09ab2ad47d961820f09d7d2abcb20a9" resolved "https://registry.yarnpkg.com/slate-plain-serializer/-/slate-plain-serializer-0.3.1.tgz#fd3201c4d133b521b62696c35cc0ef5f92ff174e"
dependencies: dependencies:
slate-dev-logger "^0.1.23" slate-dev-logger "^0.1.25"
slate-prop-types@^0.2.8: slate-prop-types@^0.3.1:
version "0.2.8" version "0.3.1"
resolved "https://registry.yarnpkg.com/slate-prop-types/-/slate-prop-types-0.2.8.tgz#2d0e1df0a372c635068c6f74a52b567b996f51c2" resolved "https://registry.yarnpkg.com/slate-prop-types/-/slate-prop-types-0.3.1.tgz#27c62318ead2b90261b5933092ae4694db69e22e"
dependencies: dependencies:
slate-dev-logger "^0.1.23" slate-dev-logger "^0.1.25"
slate-react@^0.8.0: slate-react@^0.9.0:
version "0.8.2" version "0.9.1"
resolved "https://registry.yarnpkg.com/slate-react/-/slate-react-0.8.2.tgz#035452c7aa90d7ec37f097e2430b2ce4198cfb78" resolved "https://registry.yarnpkg.com/slate-react/-/slate-react-0.9.1.tgz#1fa9da93b1856361b42e9da8633837264f40169a"
dependencies: dependencies:
debug "^2.3.2" debug "^2.3.2"
get-window "^1.1.1" get-window "^1.1.1"
@ -8569,18 +8569,18 @@ slate-react@^0.8.0:
react-immutable-proptypes "^2.1.0" react-immutable-proptypes "^2.1.0"
react-portal "^3.1.0" react-portal "^3.1.0"
selection-is-backward "^1.0.0" selection-is-backward "^1.0.0"
slate-base64-serializer "^0.1.22" slate-base64-serializer "^0.2.1"
slate-dev-logger "^0.1.23" slate-dev-logger "^0.1.25"
slate-plain-serializer "^0.2.8" slate-plain-serializer "^0.3.1"
slate-prop-types "^0.2.8" slate-prop-types "^0.3.1"
slate-soft-break@^0.5.0: slate-soft-break@^0.6.0:
version "0.5.1" version "0.6.0"
resolved "https://registry.yarnpkg.com/slate-soft-break/-/slate-soft-break-0.5.1.tgz#817348c6c38c5c4983f58de3bc497234b27378eb" resolved "https://registry.yarnpkg.com/slate-soft-break/-/slate-soft-break-0.6.0.tgz#1e44815b7ff4ddada055bba14cd0d2d4ef0fd463"
slate@^0.28.0: slate@^0.29.0:
version "0.28.2" version "0.29.1"
resolved "https://registry.yarnpkg.com/slate/-/slate-0.28.2.tgz#e740976ae494c9a2952e925b00f2694416b5e84d" resolved "https://registry.yarnpkg.com/slate/-/slate-0.29.1.tgz#a9df98158e67f92456b9b8f38fb6d279ba8f9f7e"
dependencies: dependencies:
debug "^2.3.2" debug "^2.3.2"
direction "^0.1.5" direction "^0.1.5"
@ -8588,7 +8588,7 @@ slate@^0.28.0:
is-empty "^1.0.0" is-empty "^1.0.0"
is-plain-object "^2.0.4" is-plain-object "^2.0.4"
lodash "^4.17.4" lodash "^4.17.4"
slate-dev-logger "^0.1.23" slate-dev-logger "^0.1.25"
type-of "^2.0.1" type-of "^2.0.1"
slice-ansi@0.0.4: slice-ansi@0.0.4: