diff --git a/src/components/Widgets/MarkdownControlElements/RawEditor/index.js b/src/components/Widgets/MarkdownControlElements/RawEditor/index.js index b8ca39c2..9b798cef 100644 --- a/src/components/Widgets/MarkdownControlElements/RawEditor/index.js +++ b/src/components/Widgets/MarkdownControlElements/RawEditor/index.js @@ -235,7 +235,7 @@ export default class RawEditor extends React.Component { this.updateHeight(); }; - handlePlugin = (plugin, data) => { + handlePluginSubmit = (plugin, data) => { const toBlock = plugin.get('toBlock'); this.replaceSelection(toBlock.call(toBlock, data.toJS())); }; @@ -334,7 +334,7 @@ export default class RawEditor extends React.Component { { + const { plugin, onSubmit } = this.props; + onSubmit(plugin, this.state.data); + event.preventDefault(); + } + + render() { + const { + plugin, + onSubmit, + onCancel, + value, + onAddAsset, + onRemoveAsset, + getAsset, + onChange, + } = this.props; + + return ( +
+

Insert {plugin.get('label')}

+
+ {plugin.get('fields').map((field, index) => ( + { + this.setState({ data: this.state.data.set(field.get('name'), val) }); + }} + /> + ))} +
+
+ + {' '} + +
+
+ ); + } +} diff --git a/src/components/Widgets/MarkdownControlElements/ToolbarPlugins.js b/src/components/Widgets/MarkdownControlElements/ToolbarPlugins.js index faa455b0..570e57cb 100644 --- a/src/components/Widgets/MarkdownControlElements/ToolbarPlugins.js +++ b/src/components/Widgets/MarkdownControlElements/ToolbarPlugins.js @@ -3,6 +3,7 @@ import { fromJS } from 'immutable'; import { Button } from 'react-toolbox/lib/button'; import { Icon } from '../../UI'; import ToolbarButton from './ToolbarButton'; +import ToolbarPluginForm from './ToolbarPluginForm'; import ToolbarPluginFormControl from './ToolbarPluginFormControl'; import toolbarStyles from './Toolbar.css'; import styles from './ToolbarPlugins.css'; @@ -10,7 +11,7 @@ import styles from './ToolbarPlugins.css'; export default class ToolbarPlugins extends Component { static propTypes = { plugins: PropTypes.object.isRequired, - onPlugin: PropTypes.func.isRequired, + onSubmit: PropTypes.func.isRequired, onAddAsset: PropTypes.func.isRequired, onRemoveAsset: PropTypes.func.isRequired, getAsset: PropTypes.func.isRequired, @@ -20,65 +21,28 @@ export default class ToolbarPlugins extends Component { super(props); this.state = { openPlugin: null, - pluginData: fromJS({}), }; } handlePlugin(plugin) { return (e) => { e.preventDefault(); - this.setState({ openPlugin: plugin, pluginData: fromJS({}) }); + this.setState({ openPlugin: plugin }); }; } - handleSubmit = (e) => { - e.preventDefault(); - const { openPlugin, pluginData } = this.state; - this.props.onPlugin(openPlugin, pluginData); + handleSubmit = (plugin, pluginData) => { + this.props.onSubmit(plugin, pluginData); this.setState({ openPlugin: null }); }; handleCancel = (e) => { - e.preventDefault(); this.setState({ openPlugin: null }); }; - pluginForm(plugin) { - return (
-

Insert {plugin.get('label')}

-
- {plugin.get('fields').map((field, index) => ( - { - this.setState({ pluginData: this.state.pluginData.set(field.get('name'), val) }); - }} - /> - ))} -
-
- - {' '} - -
-
); - } - render() { - const { plugins } = this.props; - const { openPlugin } = this.state; + const { plugins, onAddAsset, onRemoveAsset, getAsset } = this.props; + const { openPlugin, pluginData } = this.state; const classNames = [styles.root]; if (openPlugin) { @@ -94,7 +58,16 @@ export default class ToolbarPlugins extends Component { action={this.handlePlugin(plugin)} /> ))} - {openPlugin && this.pluginForm(openPlugin)} + {openPlugin && + + } ); } } diff --git a/src/components/Widgets/MarkdownControlElements/VisualEditor/index.js b/src/components/Widgets/MarkdownControlElements/VisualEditor/index.js index 64d3d8c4..30646d8d 100644 --- a/src/components/Widgets/MarkdownControlElements/VisualEditor/index.js +++ b/src/components/Widgets/MarkdownControlElements/VisualEditor/index.js @@ -203,7 +203,7 @@ export default class Editor extends Component { command(this.view.state, this.handleAction); }; - handlePlugin = (plugin, data) => { + handlePluginSubmit = (plugin, data) => { const { schema } = this.state; const nodeType = schema.nodes[`plugin_${ plugin.get('id') }`]; this.view.props.onAction(this.view.state.tr.replaceSelectionWith(nodeType.create(data.toJS())).action()); @@ -289,7 +289,7 @@ export default class Editor extends Component {