diff --git a/CHANGELOG.md b/CHANGELOG.md index c8bc9fef..6bfdba39 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -9,6 +9,7 @@ ### Added - Add ability to disable the editor on demand with the [`readOnly`](https://www.draftail.org/docs/next/api#draftaileditor) prop, matching behavior of Draft.js. [#201](https://github.com/springload/draftail/issues/201), [#206](https://github.com/springload/draftail/pull/206), thanks to [@SpearThruster](https://github.com/SpearThruster). +- Add ability to use the editor as a controlled component, like vanilla Draft.js editors, with [`editorState` and `onChange`](https://www.draftail.org/docs/next/api#editorstate-and-onchange) props. Have a look at the [controlled component documentation](https://www.draftail.org/docs/next/controlled-component) for further details. [#180](https://github.com/springload/draftail/issues/180), [#207](https://github.com/springload/draftail/pull/207). ### Fixed diff --git a/README.md b/README.md index 1329fc4c..318603cb 100644 --- a/README.md +++ b/README.md @@ -24,7 +24,7 @@ Here are important features worth highlighting: ## Documentation -- [Getting started](https://www.draftail.org/docs/getting-started.html) +- [Getting started](https://www.draftail.org/docs/getting-started) - [API reference](https://www.draftail.org/docs/api) - [User guide](https://www.draftail.org/docs/user-guide) - [Getting started with extensions](https://www.draftail.org/docs/getting-started-with-extensions) diff --git a/examples/components/EditorWrapper.js b/examples/components/EditorWrapper.js index aa5dfb2f..11ae2266 100644 --- a/examples/components/EditorWrapper.js +++ b/examples/components/EditorWrapper.js @@ -1,8 +1,9 @@ // @flow import React, { Component } from "react"; +/* :: import { EditorState } from "draft-js"; */ import type { RawDraftContentState } from "draft-js/lib/RawDraftContentState"; -import { DraftailEditor } from "../../lib"; +import { DraftailEditor, serialiseEditorStateToRaw } from "../../lib"; import SentryBoundary from "./SentryBoundary"; import Highlight from "./Highlight"; @@ -14,7 +15,10 @@ const DRAFTAIL_VERSION = type Props = {| id: string, - onSave: ?(?RawDraftContentState) => void, + rawContentState: ?RawDraftContentState, + editorState: ?EditorState, + onSave: ?(content: null | RawDraftContentState) => void, + onChange: ?(editorState: EditorState) => void, |}; type State = {| @@ -32,10 +36,11 @@ class EditorWrapper extends Component { }; this.onSave = this.onSave.bind(this); + this.onChange = this.onChange.bind(this); } - /* :: onSave: (content: ?RawDraftContentState) => void; */ - onSave(content: ?RawDraftContentState) { + /* :: onSave: (content: null | RawDraftContentState) => void; */ + onSave(content: null | RawDraftContentState) { const { id, onSave } = this.props; this.setState(({ saveCount }) => ({ content, saveCount: saveCount + 1 })); @@ -47,19 +52,48 @@ class EditorWrapper extends Component { } } + /* :: onChange: (nextState: EditorState) => void; */ + onChange(nextState: EditorState) { + const { id, onChange } = this.props; + const content = serialiseEditorStateToRaw(nextState); + + this.setState(({ saveCount }) => ({ content, saveCount: saveCount + 1 })); + + sessionStorage.setItem(`${id}:content`, JSON.stringify(content)); + + if (onChange) { + onChange(nextState); + } + } + render() { - const { id, onSave, ...editorProps } = this.props; + const { + id, + editorState, + rawContentState, + onSave, + onChange, + ...editorProps + } = this.props; const { content, saveCount } = this.state; - const storedContent = sessionStorage.getItem(`${id}:content`) || null; - const initialContent = storedContent ? JSON.parse(storedContent) : null; + const dataProps = {}; + let initialContent; + + if (editorState) { + dataProps.editorState = editorState; + dataProps.onChange = this.onChange; + } else { + const storedContent = sessionStorage.getItem(`${id}:content`) || "null"; + initialContent = + rawContentState || (storedContent ? JSON.parse(storedContent) : null); + dataProps.rawContentState = initialContent; + dataProps.onSave = this.onSave; + } + return (
- +
@@ -73,7 +107,10 @@ class EditorWrapper extends Component { {`Saves: ${saveCount}`} - + {/* Running multiple editors with the same base state is a source of issues. */} + {editorState ? null : ( + + )} diff --git a/examples/docs.story.js b/examples/docs.story.js index c467ce7d..4050db2b 100644 --- a/examples/docs.story.js +++ b/examples/docs.story.js @@ -1,8 +1,8 @@ import { storiesOf } from "@storybook/react"; -import React from "react"; +import React, { useState } from "react"; import { injectIntl } from "react-intl"; import { convertFromHTML, convertToHTML } from "draft-convert"; -import { convertToRaw, convertFromRaw } from "draft-js"; +import { EditorState, convertToRaw, convertFromRaw } from "draft-js"; import { Formik } from "formik"; import { DraftailEditor, INLINE_STYLE, ENTITY_TYPE, BLOCK_TYPE } from "../lib"; @@ -22,6 +22,8 @@ import PrismDecorator from "./components/PrismDecorator"; import ReadingTime from "./components/ReadingTime"; storiesOf("Docs", module) + // Add a decorator rendering story as a component for hooks support. + .addDecorator((Story) => ) .add("Built-in formats", () => ( )} - )); + )) + .add("Controlled component", () => { + const [editorState, setEditorState] = useState(EditorState.createEmpty()); + return ( + + ); + }); diff --git a/lib/api/conversion.js b/lib/api/conversion.js deleted file mode 100644 index cbed74d0..00000000 --- a/lib/api/conversion.js +++ /dev/null @@ -1,35 +0,0 @@ -// @flow -import { EditorState, convertFromRaw, convertToRaw } from "draft-js"; -import type { RawDraftContentState } from "draft-js/lib/RawDraftContentState"; - -const EMPTY_CONTENT_STATE = null; - -export default { - createEditorState(rawContentState: ?RawDraftContentState) { - let editorState; - - if (rawContentState) { - const contentState = convertFromRaw(rawContentState); - editorState = EditorState.createWithContent(contentState); - } else { - editorState = EditorState.createEmpty(); - } - - return editorState; - }, - - serialiseEditorState(editorState: EditorState) { - const contentState = editorState.getCurrentContent(); - const rawContentState = convertToRaw(contentState); - - const isEmpty = rawContentState.blocks.every((block) => { - const isEmptyBlock = - block.text.trim().length === 0 && - (!block.entityRanges || block.entityRanges.length === 0) && - (!block.inlineStyleRanges || block.inlineStyleRanges.length === 0); - return isEmptyBlock; - }); - - return isEmpty ? EMPTY_CONTENT_STATE : rawContentState; - }, -}; diff --git a/lib/api/conversion.test.js b/lib/api/conversion.test.js deleted file mode 100644 index 7b93c347..00000000 --- a/lib/api/conversion.test.js +++ /dev/null @@ -1,64 +0,0 @@ -import { EditorState, convertFromRaw, convertToRaw } from "draft-js"; -import conversion from "./conversion"; - -const stubContent = { - entityMap: {}, - blocks: [ - { - key: "1dcqo", - text: "Hello, World!", - type: "unstyled", - depth: 0, - inlineStyleRanges: [], - entityRanges: [], - data: {}, - }, - { - key: "dmtba", - text: "This is a title", - type: "header-two", - depth: 0, - inlineStyleRanges: [], - entityRanges: [], - data: {}, - }, - ], -}; - -describe("conversion", () => { - describe("#createEditorState", () => { - it("creates state from real content", () => { - const state = conversion.createEditorState(stubContent); - const result = convertToRaw(state.getCurrentContent()); - expect(result.blocks.length).toEqual(2); - expect(result.blocks[0].text).toEqual("Hello, World!"); - }); - }); - - describe("#serialiseEditorState", () => { - it("keeps real content", () => { - const state = conversion.createEditorState(stubContent); - expect(conversion.serialiseEditorState(state)).toEqual(stubContent); - }); - - it("discards empty content", () => { - const state = conversion.createEditorState(null); - expect(conversion.serialiseEditorState(state)).toBeNull(); - }); - - it("discards content with only empty text", () => { - const editorState = EditorState.createWithContent( - convertFromRaw({ - entityMap: {}, - blocks: [ - { - key: "a", - text: "", - }, - ], - }), - ); - expect(conversion.serialiseEditorState(editorState)).toBeNull(); - }); - }); -}); diff --git a/lib/components/DraftailEditor.js b/lib/components/DraftailEditor.js index 4acf2c25..63bea050 100644 --- a/lib/components/DraftailEditor.js +++ b/lib/components/DraftailEditor.js @@ -12,6 +12,8 @@ import { ListNestingStyles, registerCopySource, handleDraftEditorPastedText, + createEditorStateFromRaw, + serialiseEditorStateToRaw, } from "draftjs-conductor"; import decorateComponentWithProps from "decorate-component-with-props"; @@ -27,7 +29,6 @@ import { import DraftUtils from "../api/DraftUtils"; import behavior from "../api/behavior"; -import conversion from "../api/conversion"; import Toolbar from "./Toolbar"; import type { ToolbarProps } from "./Toolbar"; @@ -45,8 +46,12 @@ type ControlProp = {| |}; type Props = {| + // Uncontrolled component props. rawContentState: ?RawDraftContentState, onSave: ?(content: null | RawDraftContentState) => void, + // Controlled component props. + editorState: ?EditorState, + onChange: ?(editorState: EditorState) => void, onFocus: ?() => void, onBlur: ?() => void, placeholder: ?string, @@ -110,7 +115,7 @@ type Props = {| bottomToolbar: ?ComponentType, // Max level of nesting for list items. 0 = no nesting. Maximum = 10. maxListNesting: number, - // Frequency at which to call the save callback (ms). + // Frequency at which to call the onSave callback (ms). stateSaveInterval: number, |}; @@ -119,6 +124,10 @@ const defaultProps = { rawContentState: null, // Called when changes occured. Use this to persist editor content. onSave: null, + // Content of the editor, when using the editor as a controlled component. Incompatible with `rawContentState` and `onSave`. + editorState: null, + // Called whenever the editor state is updated. Use this to manage the content of a controlled editor. Incompatible with `rawContentState` and `onSave`. + onChange: null, // Called when the editor receives focus. onFocus: null, // Called when the editor loses focus. @@ -181,7 +190,8 @@ const defaultProps = { }; type State = {| - editorState: EditorState, + // editorState is only part of the local state if the editor is uncontrolled. + editorState?: EditorState, hasFocus: boolean, readOnlyState: boolean, sourceOptions: ?{ @@ -207,13 +217,13 @@ class DraftailEditor extends Component { /* :: updateTimeout: ?number; */ /* :: lockEditor: () => void; */ /* :: unlockEditor: () => void; */ + /* :: getEditorState: () => EditorState; */ constructor(props: Props) { super(props); this.onChange = this.onChange.bind(this); this.saveState = this.saveState.bind(this); - this.getEditorState = this.getEditorState.bind(this); this.toggleSource = this.toggleSource.bind(this); this.toggleEditor = this.toggleEditor.bind(this); @@ -247,14 +257,21 @@ class DraftailEditor extends Component { this.renderSource = this.renderSource.bind(this); - const { rawContentState } = props; + const { editorState, rawContentState } = props; this.state = { - editorState: conversion.createEditorState(rawContentState), readOnlyState: false, hasFocus: false, sourceOptions: null, }; + + if (editorState !== null) { + this.getEditorState = this.getEditorStateProp.bind(this); + } else { + // If editorState is not used as a prop, create it in local state from rawContentState. + this.state.editorState = createEditorStateFromRaw(rawContentState); + this.getEditorState = this.getEditorStateState.bind(this); + } } componentDidMount() { @@ -294,7 +311,7 @@ class DraftailEditor extends Component { /* :: onTab: (event: SyntheticKeyboardEvent<>) => true; */ onTab(event: SyntheticKeyboardEvent<>) { const { maxListNesting } = this.props; - const { editorState } = this.state; + const editorState = this.getEditorState(); const newState = RichUtils.onTab(event, editorState, maxListNesting); this.onChange(newState); @@ -311,8 +328,9 @@ class DraftailEditor extends Component { blockTypes, inlineStyles, entityTypes, + onChange, } = this.props; - const { editorState } = this.state; + const editorState = this.getEditorState(); const shouldFilterPaste = nextState.getCurrentContent() !== editorState.getCurrentContent() && nextState.getLastChangeType() === "insert-fragment"; @@ -332,24 +350,28 @@ class DraftailEditor extends Component { ); } - this.setState( - { - editorState: filteredState, - }, - () => { - window.clearTimeout(this.updateTimeout); - this.updateTimeout = window.setTimeout( - this.saveState, - stateSaveInterval, - ); - }, - ); + if (onChange) { + onChange(filteredState); + } else { + this.setState( + { + editorState: filteredState, + }, + () => { + window.clearTimeout(this.updateTimeout); + this.updateTimeout = window.setTimeout( + this.saveState, + stateSaveInterval, + ); + }, + ); + } } /* :: onEditEntity: (entityKey: string) => void; */ onEditEntity(entityKey: string) { const { entityTypes } = this.props; - const { editorState } = this.state; + const editorState = this.getEditorState(); const content = editorState.getCurrentContent(); const entity = content.getEntity(entityKey); const entityType = entityTypes.find((t) => t.type === entity.type); @@ -374,7 +396,7 @@ class DraftailEditor extends Component { /* :: onRemoveEntity: (entityKey: string, blockKey: string) => void; */ onRemoveEntity(entityKey: string, blockKey: string) { const { entityTypes } = this.props; - const { editorState } = this.state; + const editorState = this.getEditorState(); const content = editorState.getCurrentContent(); const entity = content.getEntity(entityKey); const entityType = entityTypes.find((t) => t.type === entity.type); @@ -397,7 +419,7 @@ class DraftailEditor extends Component { /* :: onUndoRedo: (type: string) => void; */ onUndoRedo(type: string) { - const { editorState } = this.state; + const editorState = this.getEditorState(); let newEditorState = editorState; if (type === UNDO_TYPE) { @@ -411,7 +433,7 @@ class DraftailEditor extends Component { /* :: onRequestSource: (entityType: string) => void; */ onRequestSource(entityType: string) { - const { editorState } = this.state; + const editorState = this.getEditorState(); const contentState = editorState.getCurrentContent(); const entityKey = DraftUtils.getSelectionEntity(editorState); @@ -452,8 +474,14 @@ class DraftailEditor extends Component { }); } - /* :: getEditorState: () => EditorState; */ - getEditorState() { + /* :: getEditorStateProp: () => EditorState; */ + getEditorStateProp() { + const { editorState } = this.props; + return editorState; + } + + /* :: getEditorStateState: () => EditorState; */ + getEditorStateState() { const { editorState } = this.state; return editorState; } @@ -461,10 +489,10 @@ class DraftailEditor extends Component { /* :: saveState: () => void; */ saveState() { const { onSave } = this.props; - const { editorState } = this.state; + const editorState = this.getEditorState(); if (onSave) { - onSave(conversion.serialiseEditorState(editorState)); + onSave(serialiseEditorStateToRaw(editorState)); } } @@ -493,7 +521,7 @@ class DraftailEditor extends Component { /* :: handleReturn: (e: SyntheticKeyboardEvent<>) => 'not-handled' | 'handled'; */ handleReturn(e: SyntheticKeyboardEvent<>) { const { enableLineBreak, inlineStyles } = this.props; - const { editorState } = this.state; + const editorState = this.getEditorState(); let ret = NOT_HANDLED; // alt + enter opens links and other entities with a `url` property. @@ -560,7 +588,7 @@ class DraftailEditor extends Component { /* :: handleKeyCommand: (command: DraftEditorCommand) => 'handled' | 'not-handled'; */ handleKeyCommand(command: DraftEditorCommand) { const { entityTypes, blockTypes, inlineStyles } = this.props; - const { editorState } = this.state; + const editorState = this.getEditorState(); if (entityTypes.some((t) => t.type === command)) { this.onRequestSource(command); @@ -604,7 +632,7 @@ class DraftailEditor extends Component { /* :: handleBeforeInput: (char: string) => 'handled' | 'not-handled'; */ handleBeforeInput(char: string) { const { blockTypes, inlineStyles, enableHorizontalRule } = this.props; - const { editorState } = this.state; + const editorState = this.getEditorState(); const selection = editorState.getSelection(); if (selection.isCollapsed()) { @@ -678,32 +706,32 @@ class DraftailEditor extends Component { /* :: toggleBlockType: (blockType: string) => void; */ toggleBlockType(blockType: string) { - const { editorState } = this.state; + const editorState = this.getEditorState(); this.onChange(RichUtils.toggleBlockType(editorState, blockType)); } /* :: toggleInlineStyle: (inlineStyle: string) => void; */ toggleInlineStyle(inlineStyle: string) { - const { editorState } = this.state; + const editorState = this.getEditorState(); this.onChange(RichUtils.toggleInlineStyle(editorState, inlineStyle)); } /* :: addHR: () => void; */ addHR() { - const { editorState } = this.state; + const editorState = this.getEditorState(); this.onChange(DraftUtils.addHorizontalRuleRemovingSelection(editorState)); } /* :: addBR: () => void; */ addBR() { - const { editorState } = this.state; + const editorState = this.getEditorState(); this.onChange(DraftUtils.addLineBreak(editorState)); } /* :: blockRenderer: (block: ContentBlock) => {}; */ blockRenderer(block: ContentBlock) { const { entityTypes } = this.props; - const { editorState } = this.state; + const editorState = this.getEditorState(); const contentState = editorState.getCurrentContent(); if (block.getType() !== BLOCK_TYPE.ATOMIC) { @@ -770,7 +798,8 @@ class DraftailEditor extends Component { /* :: renderSource: () => ?Node; */ renderSource() { - const { editorState, sourceOptions } = this.state; + const { sourceOptions } = this.state; + const editorState = this.getEditorState(); if (sourceOptions && sourceOptions.entityType) { const Source = sourceOptions.entityType.source; @@ -822,7 +851,8 @@ class DraftailEditor extends Component { topToolbar, bottomToolbar, } = this.props; - const { editorState, hasFocus, readOnlyState } = this.state; + const { hasFocus, readOnlyState } = this.state; + const editorState = this.getEditorState(); const isReadOnly = readOnlyState || readOnly; const hidePlaceholder = DraftUtils.shouldHidePlaceholder(editorState); const entityDecorators = entityTypes diff --git a/lib/components/DraftailEditor.test.js b/lib/components/DraftailEditor.test.js index 5f494dce..cb3aa2d3 100644 --- a/lib/components/DraftailEditor.test.js +++ b/lib/components/DraftailEditor.test.js @@ -27,6 +27,26 @@ describe("DraftailEditor", () => { expect(shallowNoLifecycle()).toMatchSnapshot(); }); + it("#rawContentState sets local state", () => { + const wrapper = shallowNoLifecycle( + , + ); + expect(wrapper.state("editorState")).toBeInstanceOf(EditorState); + }); + + it("#editorState is passed through", () => { + const editorState = EditorState.createEmpty(); + const wrapper = shallowNoLifecycle( + , + ); + expect(wrapper.find("PluginEditor").prop("editorState")).toBe(editorState); + }); + it("editorRef", () => { expect(mount().instance().editorRef).toBeDefined(); }); @@ -77,17 +97,7 @@ describe("DraftailEditor", () => { placeholder="Write hereā€¦" rawContentState={{ entityMap: {}, - blocks: [ - { - key: "b3kdk", - text: "test", - type: "header-two", - depth: 0, - inlineStyleRanges: [], - entityRanges: [], - data: {}, - }, - ], + blocks: [{ text: "test" }], }} />, ) @@ -277,17 +287,36 @@ describe("DraftailEditor", () => { ).toMatchSnapshot(); }); - it("#onSave", () => { - const onSave = jest.fn(); - const wrapper = shallowNoLifecycle(); + describe("#onSave", () => { + it("works", () => { + jest.useFakeTimers(); + + const onSave = jest.fn(); + const wrapper = shallowNoLifecycle( + , + ); + + wrapper.instance().onChange(EditorState.createEmpty()); - wrapper.instance().saveState(); + jest.advanceTimersByTime(150); + + expect(onSave).toHaveBeenCalled(); + }); - expect(onSave).toHaveBeenCalled(); + it("does not get called when onChange is used", () => { + jest.useFakeTimers(); - shallowNoLifecycle() - .instance() - .saveState(); + const onSave = jest.fn(); + const wrapper = shallowNoLifecycle( + {}} />, + ); + + wrapper.instance().onChange(EditorState.createEmpty()); + + jest.advanceTimersByTime(1000); + + expect(onSave).not.toHaveBeenCalled(); + }); }); it("#stateSaveInterval", () => { @@ -394,27 +423,42 @@ describe("DraftailEditor", () => { const onSave = jest.fn(); const wrapper = shallowNoLifecycle(); - const contentState = convertFromRaw({ - entityMap: {}, - blocks: [{ text: "test" }], - }); + wrapper.instance().onChange(EditorState.createEmpty()); + jest.advanceTimersByTime(1000); + expect(onSave).toHaveBeenCalled(); + }); - const editorState = EditorState.push( - EditorState.createEmpty(), - contentState, - "insert-fragment", + it("calls onChange if used instead", () => { + jest.useFakeTimers(); + + const onSave = jest.fn(); + const onChange = jest.fn(); + const wrapper = shallowNoLifecycle( + , ); - wrapper.instance().onChange(editorState); + wrapper.instance().onChange(EditorState.createEmpty()); jest.advanceTimersByTime(1000); - expect(onSave).toHaveBeenCalled(); + expect(onSave).not.toHaveBeenCalled(); + expect(onChange).toHaveBeenCalled(); }); }); - it("getEditorState", () => { - const wrapper = shallowNoLifecycle(); + describe("getEditorState", () => { + it("works with uncontrolled editor", () => { + const wrapper = shallowNoLifecycle(); + + expect(wrapper.instance().getEditorState()).toBeInstanceOf(EditorState); + }); - expect(wrapper.instance().getEditorState()).toBeInstanceOf(EditorState); + it("works with controlled editor", () => { + const editorState = EditorState.createEmpty(); + const wrapper = shallowNoLifecycle( + , + ); + + expect(wrapper.instance().getEditorState()).toBe(editorState); + }); }); describe("handleReturn", () => { diff --git a/lib/index.js b/lib/index.js index 14844b92..2a9670c7 100644 --- a/lib/index.js +++ b/lib/index.js @@ -8,3 +8,8 @@ export { default as Icon } from "./components/Icon"; export { default as ToolbarButton } from "./components/ToolbarButton"; export { default as DraftUtils } from "./api/DraftUtils"; export { BLOCK_TYPE, ENTITY_TYPE, INLINE_STYLE } from "./api/constants"; +// Expose methods from draftjs-conductor directly for users of Draftail. +export { + createEditorStateFromRaw, + serialiseEditorStateToRaw, +} from "draftjs-conductor"; diff --git a/lib/utils/__snapshots__/getComponentWrapper.test.js.snap b/lib/utils/__snapshots__/getComponentWrapper.test.js.snap deleted file mode 100644 index 2c805447..00000000 --- a/lib/utils/__snapshots__/getComponentWrapper.test.js.snap +++ /dev/null @@ -1,7 +0,0 @@ -// Jest Snapshot v1, https://goo.gl/fbAQLP - -exports[`getComponentWrapper works 1`] = ` - -`; diff --git a/lib/utils/getComponentWrapper.js b/lib/utils/getComponentWrapper.js deleted file mode 100644 index 6651981a..00000000 --- a/lib/utils/getComponentWrapper.js +++ /dev/null @@ -1,17 +0,0 @@ -// @flow -import React from "react"; -import type { ComponentType } from "react"; - -/** - * Wraps a component to provide it with additional props based on context. - */ -const getComponentWrapper = (Wrapped: ComponentType<{}>, wrapperProps: {}) => { - const Wrapper = (props: {}) => ( - // flowlint inexact-spread:off - - ); - - return Wrapper; -}; - -export default getComponentWrapper; diff --git a/lib/utils/getComponentWrapper.test.js b/lib/utils/getComponentWrapper.test.js deleted file mode 100644 index 83cabb88..00000000 --- a/lib/utils/getComponentWrapper.test.js +++ /dev/null @@ -1,15 +0,0 @@ -import React from "react"; -import { shallow } from "enzyme"; - -import getComponentWrapper from "./getComponentWrapper"; - -describe("getComponentWrapper", () => { - it("works", () => { - const Wrapped = () =>
; - const Wrapper = getComponentWrapper(Wrapped, { - test: true, - }); - - expect(shallow()).toMatchSnapshot(); - }); -}); diff --git a/package-lock.json b/package-lock.json index 26f5d847..c1c93ba0 100644 --- a/package-lock.json +++ b/package-lock.json @@ -10123,9 +10123,9 @@ } }, "draftjs-conductor": { - "version": "0.4.1", - "resolved": "https://registry.npmjs.org/draftjs-conductor/-/draftjs-conductor-0.4.1.tgz", - "integrity": "sha512-5BcJLdYLNIA/TNp/9xwIeD1quWsWEoi0ZI81TiW3vLecBEQgWKVxuKZaLdaXHYpW4/kdQvAJz2KcOBTpJkYBxg==" + "version": "1.0.0", + "resolved": "https://registry.npmjs.org/draftjs-conductor/-/draftjs-conductor-1.0.0.tgz", + "integrity": "sha512-pz5MIpS2aH6fgo2jrHo0Rt+rxqRgqnbrxEaaTiFLW4Dg/0U0eZhyxZPt6pByoS20Q7jCYOpolGpszKodNVi+TQ==" }, "draftjs-filters": { "version": "2.2.3", @@ -12206,7 +12206,8 @@ "ansi-regex": { "version": "2.1.1", "bundled": true, - "dev": true + "dev": true, + "optional": true }, "aproba": { "version": "1.2.0", @@ -12227,12 +12228,14 @@ "balanced-match": { "version": "1.0.0", "bundled": true, - "dev": true + "dev": true, + "optional": true }, "brace-expansion": { "version": "1.1.11", "bundled": true, "dev": true, + "optional": true, "requires": { "balanced-match": "^1.0.0", "concat-map": "0.0.1" @@ -12247,17 +12250,20 @@ "code-point-at": { "version": "1.1.0", "bundled": true, - "dev": true + "dev": true, + "optional": true }, "concat-map": { "version": "0.0.1", "bundled": true, - "dev": true + "dev": true, + "optional": true }, "console-control-strings": { "version": "1.1.0", "bundled": true, - "dev": true + "dev": true, + "optional": true }, "core-util-is": { "version": "1.0.2", @@ -12374,7 +12380,8 @@ "inherits": { "version": "2.0.3", "bundled": true, - "dev": true + "dev": true, + "optional": true }, "ini": { "version": "1.3.5", @@ -12386,6 +12393,7 @@ "version": "1.0.0", "bundled": true, "dev": true, + "optional": true, "requires": { "number-is-nan": "^1.0.0" } @@ -12400,6 +12408,7 @@ "version": "3.0.4", "bundled": true, "dev": true, + "optional": true, "requires": { "brace-expansion": "^1.1.7" } @@ -12407,12 +12416,14 @@ "minimist": { "version": "0.0.8", "bundled": true, - "dev": true + "dev": true, + "optional": true }, "minipass": { "version": "2.2.4", "bundled": true, "dev": true, + "optional": true, "requires": { "safe-buffer": "^5.1.1", "yallist": "^3.0.0" @@ -12431,6 +12442,7 @@ "version": "0.5.1", "bundled": true, "dev": true, + "optional": true, "requires": { "minimist": "0.0.8" } @@ -12511,7 +12523,8 @@ "number-is-nan": { "version": "1.0.1", "bundled": true, - "dev": true + "dev": true, + "optional": true }, "object-assign": { "version": "4.1.1", @@ -12523,6 +12536,7 @@ "version": "1.4.0", "bundled": true, "dev": true, + "optional": true, "requires": { "wrappy": "1" } @@ -12608,7 +12622,8 @@ "safe-buffer": { "version": "5.1.1", "bundled": true, - "dev": true + "dev": true, + "optional": true }, "safer-buffer": { "version": "2.1.2", @@ -12644,6 +12659,7 @@ "version": "1.0.2", "bundled": true, "dev": true, + "optional": true, "requires": { "code-point-at": "^1.0.0", "is-fullwidth-code-point": "^1.0.0", @@ -12663,6 +12679,7 @@ "version": "3.0.1", "bundled": true, "dev": true, + "optional": true, "requires": { "ansi-regex": "^2.0.0" } @@ -12706,12 +12723,14 @@ "wrappy": { "version": "1.0.2", "bundled": true, - "dev": true + "dev": true, + "optional": true }, "yallist": { "version": "3.0.2", "bundled": true, - "dev": true + "dev": true, + "optional": true } } }, @@ -23684,7 +23703,8 @@ "ansi-regex": { "version": "2.1.1", "bundled": true, - "dev": true + "dev": true, + "optional": true }, "aproba": { "version": "1.2.0", @@ -23705,12 +23725,14 @@ "balanced-match": { "version": "1.0.0", "bundled": true, - "dev": true + "dev": true, + "optional": true }, "brace-expansion": { "version": "1.1.11", "bundled": true, "dev": true, + "optional": true, "requires": { "balanced-match": "^1.0.0", "concat-map": "0.0.1" @@ -23725,17 +23747,20 @@ "code-point-at": { "version": "1.1.0", "bundled": true, - "dev": true + "dev": true, + "optional": true }, "concat-map": { "version": "0.0.1", "bundled": true, - "dev": true + "dev": true, + "optional": true }, "console-control-strings": { "version": "1.1.0", "bundled": true, - "dev": true + "dev": true, + "optional": true }, "core-util-is": { "version": "1.0.2", @@ -23852,7 +23877,8 @@ "inherits": { "version": "2.0.3", "bundled": true, - "dev": true + "dev": true, + "optional": true }, "ini": { "version": "1.3.5", @@ -23864,6 +23890,7 @@ "version": "1.0.0", "bundled": true, "dev": true, + "optional": true, "requires": { "number-is-nan": "^1.0.0" } @@ -23878,6 +23905,7 @@ "version": "3.0.4", "bundled": true, "dev": true, + "optional": true, "requires": { "brace-expansion": "^1.1.7" } @@ -23885,12 +23913,14 @@ "minimist": { "version": "0.0.8", "bundled": true, - "dev": true + "dev": true, + "optional": true }, "minipass": { "version": "2.2.4", "bundled": true, "dev": true, + "optional": true, "requires": { "safe-buffer": "^5.1.1", "yallist": "^3.0.0" @@ -23909,6 +23939,7 @@ "version": "0.5.1", "bundled": true, "dev": true, + "optional": true, "requires": { "minimist": "0.0.8" } @@ -23989,7 +24020,8 @@ "number-is-nan": { "version": "1.0.1", "bundled": true, - "dev": true + "dev": true, + "optional": true }, "object-assign": { "version": "4.1.1", @@ -24001,6 +24033,7 @@ "version": "1.4.0", "bundled": true, "dev": true, + "optional": true, "requires": { "wrappy": "1" } @@ -24086,7 +24119,8 @@ "safe-buffer": { "version": "5.1.1", "bundled": true, - "dev": true + "dev": true, + "optional": true }, "safer-buffer": { "version": "2.1.2", @@ -24122,6 +24156,7 @@ "version": "1.0.2", "bundled": true, "dev": true, + "optional": true, "requires": { "code-point-at": "^1.0.0", "is-fullwidth-code-point": "^1.0.0", @@ -24141,6 +24176,7 @@ "version": "3.0.1", "bundled": true, "dev": true, + "optional": true, "requires": { "ansi-regex": "^2.0.0" } @@ -24184,12 +24220,14 @@ "wrappy": { "version": "1.0.2", "bundled": true, - "dev": true + "dev": true, + "optional": true }, "yallist": { "version": "3.0.2", "bundled": true, - "dev": true + "dev": true, + "optional": true } } }, diff --git a/package.json b/package.json index 20169750..58a13be2 100644 --- a/package.json +++ b/package.json @@ -41,7 +41,7 @@ "dependencies": { "decorate-component-with-props": "^1.0.2", "draft-js-plugins-editor": "^2.1.1", - "draftjs-conductor": "^0.4.1", + "draftjs-conductor": "^1.0.0", "draftjs-filters": "^2.2.3" }, "devDependencies": {