diff --git a/editors/editoria/package.json b/editors/editoria/package.json
index d32851a1d72eba15872152732982739d2869a75e..4fb3933d942a55f81eefc95998e5fa25668c3f8e 100644
--- a/editors/editoria/package.json
+++ b/editors/editoria/package.json
@@ -8,12 +8,12 @@
"react": "^16.13.1",
"react-dom": "^16.13.1",
"styled-components": "^4.2.0",
- "wax-prosemirror-components": "^0.0.20",
+ "@pubsweet/ui-toolkit": "^2.3.1",
+ "react-panelgroup": "^1.0.10",
"wax-prosemirror-core": "^0.0.20",
- "wax-prosemirror-layouts": "^0.0.20",
+ "wax-prosemirror-components": "^0.0.20",
"wax-prosemirror-plugins": "^0.0.20",
- "wax-prosemirror-services": "^0.0.20",
- "wax-prosemirror-themes": "^0.0.20"
+ "wax-prosemirror-services": "^0.0.20"
},
"scripts": {
"start": "react-app-rewired start",
diff --git a/editors/editoria/src/Editoria.js b/editors/editoria/src/Editoria.js
index b88ecdadee0c6e9dd2905deae70e148330eb6ce8..489e8e8eba2780c264dca32cf3385bc87dfe0756 100644
--- a/editors/editoria/src/Editoria.js
+++ b/editors/editoria/src/Editoria.js
@@ -1,9 +1,9 @@
import React, { useLayoutEffect, useState, useMemo } from 'react';
import { createGlobalStyle } from 'styled-components';
-import { EditoriaLayout, EditoriaMobileLayout } from 'wax-prosemirror-layouts';
import { Wax } from 'wax-prosemirror-core';
+import { EditoriaLayout, EditoriaMobileLayout } from './layout';
import { config, configMobile } from './config';
import { demo } from './demo';
diff --git a/wax-prosemirror-layouts/src/layouts/EditorElements.js b/editors/editoria/src/layout/EditorElements.js
similarity index 100%
rename from wax-prosemirror-layouts/src/layouts/EditorElements.js
rename to editors/editoria/src/layout/EditorElements.js
diff --git a/wax-prosemirror-layouts/src/layouts/EditoriaLayout.js b/editors/editoria/src/layout/EditoriaLayout.js
similarity index 89%
rename from wax-prosemirror-layouts/src/layouts/EditoriaLayout.js
rename to editors/editoria/src/layout/EditoriaLayout.js
index 97e2095a85647d067fde576277a3b0d4a6df1a2c..c4272033d012914a94d10901fc3e559665f95c0e 100644
--- a/wax-prosemirror-layouts/src/layouts/EditoriaLayout.js
+++ b/editors/editoria/src/layout/EditoriaLayout.js
@@ -1,13 +1,11 @@
import React, { useContext } from 'react';
import styled, { css, ThemeProvider } from 'styled-components';
import PanelGroup from 'react-panelgroup';
-import { InfoArea } from 'wax-prosemirror-components';
-import { componentPlugin } from 'wax-prosemirror-services';
-import { cokoTheme } from 'wax-prosemirror-themes';
import { DocumentHelpers } from 'wax-prosemirror-utilities';
-import { WaxContext } from 'wax-prosemirror-core';
-
+import { WaxContext, ComponentPlugin } from 'wax-prosemirror-core';
import { grid, th } from '@pubsweet/ui-toolkit';
+
+import { cokoTheme } from '../theme';
import EditorElements from './EditorElements';
const divider = css`
@@ -147,12 +145,12 @@ const hasNotes = main => {
return notes;
};
-const LeftSideBar = componentPlugin('leftSideBar');
-// const RightSideBar = componentPlugin('rightSideBar');
-const TopBar = componentPlugin('topBar');
-const NotesArea = componentPlugin('notesArea');
-const RightArea = componentPlugin('rightArea');
-const WaxOverlays = componentPlugin('waxOverlays');
+const LeftSideBar = ComponentPlugin('leftSideBar');
+// const RightSideBar = ComponentPlugin('rightSideBar');
+const TopBar = ComponentPlugin('topBar');
+const NotesArea = ComponentPlugin('notesArea');
+const RightArea = ComponentPlugin('rightArea');
+const WaxOverlays = ComponentPlugin('waxOverlays');
const EditoriaLayout = ({ editor }) => {
const {
@@ -204,7 +202,6 @@ const EditoriaLayout = ({ editor }) => {
</EditorArea>
</Main>
- <InfoArea />
<WaxOverlays />
</Wrapper>
</ThemeProvider>
diff --git a/wax-prosemirror-layouts/src/layouts/EditoriaMobileLayout.js b/editors/editoria/src/layout/EditoriaMobileLayout.js
similarity index 91%
rename from wax-prosemirror-layouts/src/layouts/EditoriaMobileLayout.js
rename to editors/editoria/src/layout/EditoriaMobileLayout.js
index ed0bef59b9708a6bdac4cda1de186aa1565ebcc9..260bbe07a05c3cef3bdaec844bb916482d74f255 100644
--- a/wax-prosemirror-layouts/src/layouts/EditoriaMobileLayout.js
+++ b/editors/editoria/src/layout/EditoriaMobileLayout.js
@@ -1,13 +1,11 @@
import React, { useContext } from 'react';
import styled, { css, ThemeProvider } from 'styled-components';
import PanelGroup from 'react-panelgroup';
-import { InfoArea } from 'wax-prosemirror-components';
-import { componentPlugin } from 'wax-prosemirror-services';
-import { cokoTheme } from 'wax-prosemirror-themes';
import { DocumentHelpers } from 'wax-prosemirror-utilities';
-import { WaxContext } from 'wax-prosemirror-core';
+import { WaxContext, ComponentPlugin } from 'wax-prosemirror-core';
import { grid, th } from '@pubsweet/ui-toolkit';
+import { cokoTheme } from '../theme';
import EditorElements from './EditorElements';
const divider = css`
@@ -164,10 +162,10 @@ const hasNotes = main => {
return notes;
};
-const TopBar = componentPlugin('topBar');
-const NotesArea = componentPlugin('notesArea');
-const RightArea = componentPlugin('rightArea');
-const WaxOverlays = componentPlugin('waxOverlays');
+const TopBar = ComponentPlugin('topBar');
+const NotesArea = ComponentPlugin('notesArea');
+const RightArea = ComponentPlugin('rightArea');
+const WaxOverlays = ComponentPlugin('waxOverlays');
const EditoriaLayout = ({ editor }) => {
const {
@@ -215,7 +213,6 @@ const EditoriaLayout = ({ editor }) => {
</EditorArea>
</Main>
- <InfoArea />
<WaxOverlays />
</Wrapper>
</ThemeProvider>
diff --git a/editors/editoria/src/layout/componentPlugin.js b/editors/editoria/src/layout/componentPlugin.js
new file mode 100644
index 0000000000000000000000000000000000000000..7a7f790c1532253a58afb66f547405ecaa3f43f6
--- /dev/null
+++ b/editors/editoria/src/layout/componentPlugin.js
@@ -0,0 +1,38 @@
+import React, { Component } from 'react';
+import { useInjection } from './WaxContext';
+
+class UpdateView extends Component {
+ constructor(props) {
+ super(props);
+
+ this.state = {
+ view: this.props.view,
+ };
+ }
+
+ updateView(view) {
+ this.setState(view);
+ }
+
+ render() {
+ return this.props.children({ view: this.state.view });
+ }
+}
+
+const ComponentPlugin = renderArea => layoutProps => {
+ const { instance } = useInjection('Layout');
+ const components = instance.render(renderArea);
+
+ return components
+ ? components.map(({ component: Component, componentProps }, key) => {
+ return (
+ <Component
+ key={`${renderArea}-${key}`}
+ {...layoutProps}
+ {...componentProps}
+ />
+ );
+ })
+ : null;
+};
+export default ComponentPlugin;
diff --git a/editors/editoria/src/layout/index.js b/editors/editoria/src/layout/index.js
new file mode 100644
index 0000000000000000000000000000000000000000..aaa1685d6b4c5aa2371e247945527961f16dc94f
--- /dev/null
+++ b/editors/editoria/src/layout/index.js
@@ -0,0 +1,2 @@
+export { default as EditoriaLayout } from './EditoriaLayout';
+export { default as EditoriaMobileLayout } from './EditoriaMobileLayout';
diff --git a/wax-prosemirror-themes/src/coko-theme/elements/ButtonStyles.js b/editors/editoria/src/theme/elements/ButtonStyles.js
similarity index 100%
rename from wax-prosemirror-themes/src/coko-theme/elements/ButtonStyles.js
rename to editors/editoria/src/theme/elements/ButtonStyles.js
diff --git a/wax-prosemirror-themes/src/coko-theme/elements/index.js b/editors/editoria/src/theme/elements/index.js
similarity index 100%
rename from wax-prosemirror-themes/src/coko-theme/elements/index.js
rename to editors/editoria/src/theme/elements/index.js
diff --git a/editors/editoria/src/theme/index.js b/editors/editoria/src/theme/index.js
new file mode 100644
index 0000000000000000000000000000000000000000..1f02e50799efeb994f4ff204cbdd25244128375f
--- /dev/null
+++ b/editors/editoria/src/theme/index.js
@@ -0,0 +1,2 @@
+export { default as cokoTheme } from "./theme";
+
diff --git a/wax-prosemirror-themes/src/coko-theme/index.js b/editors/editoria/src/theme/theme.js
similarity index 100%
rename from wax-prosemirror-themes/src/coko-theme/index.js
rename to editors/editoria/src/theme/theme.js
diff --git a/wax-prosemirror-core/index.js b/wax-prosemirror-core/index.js
index 0a82d854a80de35a8f99f2c4d1aa421b89808cc7..73cd59e6864493466ee219707cc5029459a4e68e 100644
--- a/wax-prosemirror-core/index.js
+++ b/wax-prosemirror-core/index.js
@@ -1,2 +1,3 @@
-export { WaxContext, useInjection } from "./src/WaxContext";
-export { default as Wax } from "./src/Wax";
+export { WaxContext, useInjection } from './src/WaxContext';
+export { default as ComponentPlugin } from './src/ComponentPlugin';
+export { default as Wax } from './src/Wax';
diff --git a/wax-prosemirror-core/src/ComponentPlugin.js b/wax-prosemirror-core/src/ComponentPlugin.js
new file mode 100644
index 0000000000000000000000000000000000000000..ca1f7c23a5062e630b766a884bb79d726b9285e7
--- /dev/null
+++ b/wax-prosemirror-core/src/ComponentPlugin.js
@@ -0,0 +1,39 @@
+import React, { Component } from 'react';
+import { useInjection } from 'wax-prosemirror-core';
+
+class UpdateView extends Component {
+ constructor(props) {
+ super(props);
+
+ this.state = {
+ view: this.props.view,
+ };
+ }
+
+ updateView(view) {
+ this.setState(view);
+ }
+
+ render() {
+ return this.props.children({ view: this.state.view });
+ }
+}
+
+const ComponentPlugin = renderArea => layoutProps => {
+ const { instance } = useInjection('Layout');
+
+ const components = instance.render(renderArea);
+
+ return components
+ ? components.map(({ component: Component, componentProps }, key) => {
+ return (
+ <Component
+ key={`${renderArea}-${key}`}
+ {...layoutProps}
+ {...componentProps}
+ />
+ );
+ })
+ : null;
+};
+export default ComponentPlugin;
diff --git a/wax-prosemirror-layouts/.gitignore b/wax-prosemirror-layouts/.gitignore
deleted file mode 100644
index deb5ee0e0e98566ca4064349d5e68cbab9bfed1c..0000000000000000000000000000000000000000
--- a/wax-prosemirror-layouts/.gitignore
+++ /dev/null
@@ -1,22 +0,0 @@
-# dependencies
-/node_modules
-
-# testing
-/coverage
-
-# production
-/build
-
-# misc
-.DS_Store
-.env.local
-.env.development.local
-.env.test.local
-.env.production.local
-.directory
-
-npm-debug.log*
-yarn-debug.log*
-yarn-error.log*
-yarn.lock
-package-lock.json
diff --git a/wax-prosemirror-layouts/index.js b/wax-prosemirror-layouts/index.js
deleted file mode 100644
index 54df59fd0c3e186afc7146ff86624ec48ac40de7..0000000000000000000000000000000000000000
--- a/wax-prosemirror-layouts/index.js
+++ /dev/null
@@ -1,2 +0,0 @@
-export { default as EditoriaLayout } from './src/layouts/EditoriaLayout';
-export { default as EditoriaMobileLayout } from './src/layouts/EditoriaMobileLayout';
diff --git a/wax-prosemirror-layouts/package.json b/wax-prosemirror-layouts/package.json
deleted file mode 100644
index 9c1b1a24a411d355c88c430b5e2bd60cb68dcbfd..0000000000000000000000000000000000000000
--- a/wax-prosemirror-layouts/package.json
+++ /dev/null
@@ -1,29 +0,0 @@
-{
- "name": "wax-prosemirror-layouts",
- "author": "Christos Kokosias",
- "version": "0.0.20",
- "description": "Wax prosemirror layouts",
- "license": "MIT",
- "main": "index.js",
- "files": [
- "dist"
- ],
- "scripts": {
- "test": "echo \"Error: no test specified\" && exit 1",
- "build": "BABEL_ENV=production rollup -c"
- },
- "dependencies": {
- "@pubsweet/ui-toolkit": "^2.3.1",
- "react-panelgroup": "^1.0.10",
- "styled-components": "^4.2.0",
- "wax-prosemirror-components": "^0.0.20",
- "wax-prosemirror-core": "^0.0.20",
- "wax-prosemirror-services": "^0.0.20",
- "wax-prosemirror-themes": "^0.0.20",
- "wax-prosemirror-utilities": "^0.0.20"
- },
- "peerDependencies": {
- "react": "^16.13.1",
- "react-dom": "^16.13.1"
- }
-}
diff --git a/wax-prosemirror-layouts/rollup.config.js b/wax-prosemirror-layouts/rollup.config.js
deleted file mode 100644
index 15f2b480f1c1af25b3bbd637047338b2aca0e2b2..0000000000000000000000000000000000000000
--- a/wax-prosemirror-layouts/rollup.config.js
+++ /dev/null
@@ -1,40 +0,0 @@
-import babel from 'rollup-plugin-babel';
-import commonjs from '@rollup/plugin-commonjs';
-import external from 'rollup-plugin-peer-deps-external';
-import { terser } from 'rollup-plugin-terser';
-
-export default {
- input: './index.js',
- output: [
- {
- file: 'dist/index.js',
- format: 'cjs',
- sourcemap: true,
- },
- ],
- plugins: [
- external({
- includeDependencies: true,
- }),
- babel({
- presets: ['react-app'],
- exclude: 'node_modules/**',
- runtimeHelpers: true,
- }),
- commonjs(),
- terser(),
- ],
- external: [
- '@fortawesome/react-fontawesome',
- 'react-dropdown',
- 'inversify',
- 'prosemirror-dev-tools',
- 'lodash',
- 'react-is',
- 'uuid',
- 'wax-prosemirror-schema',
- 'wax-prosemirror-core',
- 'wax-prosemirror-themes',
- 'wax-prosemirror-components',
- ],
-};
diff --git a/wax-prosemirror-layouts/src/layouts/utils/px2vw.js b/wax-prosemirror-layouts/src/layouts/utils/px2vw.js
deleted file mode 100644
index 131ec7fa059e1c0a5e03c56f03178d6fede57269..0000000000000000000000000000000000000000
--- a/wax-prosemirror-layouts/src/layouts/utils/px2vw.js
+++ /dev/null
@@ -1,3 +0,0 @@
-const px2vw = (size, width = 1920) => `${size / width * 100}vw`;
-
-export default px2vw;
diff --git a/wax-prosemirror-services/index.js b/wax-prosemirror-services/index.js
index 6b30e746f276ac871f1735b18e6ee4bfd3f28efa..e9b9a02f04569a8859c17e9a1bcde2253901823e 100644
--- a/wax-prosemirror-services/index.js
+++ b/wax-prosemirror-services/index.js
@@ -1,6 +1,5 @@
export { default as Service } from './src/Service';
-export { default as componentPlugin } from './src/LayoutService/components/componentPlugin';
export { default as LayoutService } from './src/LayoutService/LayoutService';
export { default as MenuService } from './src/MenuService/MenuService';
export { default as LinkService } from './src/LinkService/LinkService';
diff --git a/wax-prosemirror-services/src/LayoutService/components/componentPlugin.js b/wax-prosemirror-services/src/LayoutService/components/componentPlugin.js
index d3e1e33432109be5db908f80978a2ca69423b8bf..ca1f7c23a5062e630b766a884bb79d726b9285e7 100644
--- a/wax-prosemirror-services/src/LayoutService/components/componentPlugin.js
+++ b/wax-prosemirror-services/src/LayoutService/components/componentPlugin.js
@@ -1,12 +1,12 @@
-import React, { Component } from "react";
-import { useInjection } from "wax-prosemirror-core";
+import React, { Component } from 'react';
+import { useInjection } from 'wax-prosemirror-core';
class UpdateView extends Component {
constructor(props) {
super(props);
this.state = {
- view: this.props.view
+ view: this.props.view,
};
}
@@ -20,7 +20,7 @@ class UpdateView extends Component {
}
const ComponentPlugin = renderArea => layoutProps => {
- const { instance } = useInjection("Layout");
+ const { instance } = useInjection('Layout');
const components = instance.render(renderArea);
diff --git a/wax-prosemirror-themes/.gitignore b/wax-prosemirror-themes/.gitignore
deleted file mode 100644
index deb5ee0e0e98566ca4064349d5e68cbab9bfed1c..0000000000000000000000000000000000000000
--- a/wax-prosemirror-themes/.gitignore
+++ /dev/null
@@ -1,22 +0,0 @@
-# dependencies
-/node_modules
-
-# testing
-/coverage
-
-# production
-/build
-
-# misc
-.DS_Store
-.env.local
-.env.development.local
-.env.test.local
-.env.production.local
-.directory
-
-npm-debug.log*
-yarn-debug.log*
-yarn-error.log*
-yarn.lock
-package-lock.json
diff --git a/wax-prosemirror-themes/index.js b/wax-prosemirror-themes/index.js
deleted file mode 100644
index 042895a859e75e424b4eefa3fcfe75a1916f5ced..0000000000000000000000000000000000000000
--- a/wax-prosemirror-themes/index.js
+++ /dev/null
@@ -1,4 +0,0 @@
-export { default as cokoTheme } from "./src/coko-theme/index";
-export {
- default as ButtonStyles
-} from "./src/coko-theme/elements/ButtonStyles";
diff --git a/wax-prosemirror-themes/package.json b/wax-prosemirror-themes/package.json
deleted file mode 100644
index 8f478b755665ba9f871dc98c79a5bde2a641bf8b..0000000000000000000000000000000000000000
--- a/wax-prosemirror-themes/package.json
+++ /dev/null
@@ -1,21 +0,0 @@
-{
- "name": "wax-prosemirror-themes",
- "author": "Christos Kokosias",
- "version": "0.0.20",
- "description": "Wax prosemirror themes",
- "license": "MIT",
- "main": "index.js",
- "files": [
- "dist"
- ],
- "scripts": {
- "test": "echo \"Error: no test specified\" && exit 1",
- "build": "BABEL_ENV=production rollup -c"
- },
- "dependencies": {
- "@pubsweet/ui-toolkit": "^2.2.13",
- "fontsource-merriweather": "^3.0.9",
- "typeface-fira-sans-condensed": "^0.0.54",
- "typeface-vollkorn": "^0.0.54"
- }
-}
diff --git a/wax-prosemirror-themes/rollup.config.js b/wax-prosemirror-themes/rollup.config.js
deleted file mode 100644
index 3c39189e3e4b21268c49f26122e133aa961bb395..0000000000000000000000000000000000000000
--- a/wax-prosemirror-themes/rollup.config.js
+++ /dev/null
@@ -1,27 +0,0 @@
-import babel from 'rollup-plugin-babel';
-import commonjs from '@rollup/plugin-commonjs';
-import external from 'rollup-plugin-peer-deps-external';
-import { terser } from 'rollup-plugin-terser';
-
-export default {
- input: './index.js',
- output: [
- {
- file: 'dist/index.js',
- format: 'cjs',
- sourcemap: true,
- },
- ],
- plugins: [
- external({
- includeDependencies: true,
- }),
- babel({
- exclude: 'node_modules/**',
- runtimeHelpers: true,
- }),
- commonjs(),
- terser(),
- ],
- external: ['styled-components'],
-};