diff --git a/src/grapesjs/config/config.js b/src/grapesjs/config/config.js
deleted file mode 100644
index 8f3759c9b..000000000
--- a/src/grapesjs/config/config.js
+++ /dev/null
@@ -1,27 +0,0 @@
-module.exports = {
- // If true renders editor on init
- autorender: 1,
-
- // Where init the editor
- container: '',
-
- // HTML string or object of components
- components: '',
-
- // CSS string or object of rules
- style: '',
-
- // If true, will fetch HTML and CSS from selected container
- fromElement: 0,
-
- // ---
-
- // Storage Manager
- storageManager: {},
-
- // Array of plugins to init
- plugins: [],
-
- // Custom options for plugins
- pluginsOpts: {}
-};
diff --git a/src/grapesjs/index.js b/src/grapesjs/index.js
deleted file mode 100644
index 36202199b..000000000
--- a/src/grapesjs/index.js
+++ /dev/null
@@ -1,75 +0,0 @@
-import $ from 'cash-dom';
-import { defaults } from 'underscore';
-import polyfills from 'utils/polyfills';
-
-polyfills();
-
-module.exports = (() => {
- const defaultConfig = require('./config/config');
- const Editor = require('editor');
- const PluginManager = require('plugin_manager');
- const plugins = new PluginManager();
- const editors = [];
-
- return {
- $,
-
- editors,
-
- plugins,
-
- // Will be replaced on build
- version: '<# VERSION #>',
-
- /**
- * Initializes an editor based on passed options
- * @param {Object} config Configuration object
- * @param {string|HTMLElement} config.container Selector which indicates where render the editor
- * @param {Object|string} config.components='' HTML string or Component model in JSON format
- * @param {Object|string} config.style='' CSS string or CSS model in JSON format
- * @param {Boolean} [config.fromElement=false] If true, will fetch HTML and CSS from selected container
- * @param {Boolean} [config.undoManager=true] Enable/Disable undo manager
- * @param {Array} [config.plugins=[]] Array of plugins to execute on start
- * @return {grapesjs.Editor} GrapesJS editor instance
- * @example
- * var editor = grapesjs.init({
- * container: '#myeditor',
- * components: 'Hello world',
- * style: '.hello{color: red}',
- * })
- */
- init(config = {}) {
- const els = config.container;
-
- if (!els) {
- throw new Error("'container' is required");
- }
-
- defaults(config, defaultConfig);
- config.el =
- els instanceof window.HTMLElement ? els : document.querySelector(els);
- const editor = new Editor(config).init();
-
- // Load plugins
- config.plugins.forEach(pluginId => {
- const plugin = plugins.get(pluginId);
-
- if (plugin) {
- plugin(editor, config.pluginsOpts[pluginId] || {});
- } else {
- console.warn(`Plugin ${pluginId} not found`);
- }
- });
-
- // Execute `onLoad` on modules once all plugins are initialized.
- // A plugin might have extended/added some custom type so this
- // is a good point to load stuff like components, css rules, etc.
- editor.getModel().loadOnStart();
-
- config.autorender && editor.render();
-
- editors.push(editor);
- return editor;
- }
- };
-})();
diff --git a/src/index.js b/src/index.js
index 03021ac74..4cb124347 100644
--- a/src/index.js
+++ b/src/index.js
@@ -1 +1,99 @@
-module.exports = require('./grapesjs');
+import $ from 'cash-dom';
+import { defaults } from 'underscore';
+import polyfills from 'utils/polyfills';
+
+polyfills();
+
+module.exports = (() => {
+ const Editor = require('editor');
+ const PluginManager = require('plugin_manager');
+ const plugins = new PluginManager();
+ const editors = [];
+ const defaultConfig = {
+ // If true renders editor on init
+ autorender: 1,
+
+ // Where init the editor
+ container: '',
+
+ // HTML string or object of components
+ components: '',
+
+ // CSS string or object of rules
+ style: '',
+
+ // If true, will fetch HTML and CSS from selected container
+ fromElement: 0,
+
+ // Storage Manager
+ storageManager: {},
+
+ // Array of plugins to init
+ plugins: [],
+
+ // Custom options for plugins
+ pluginsOpts: {}
+ };
+
+ return {
+ $,
+
+ editors,
+
+ plugins,
+
+ // Will be replaced on build
+ version: '<# VERSION #>',
+
+ /**
+ * Initializes an editor based on passed options
+ * @param {Object} config Configuration object
+ * @param {string|HTMLElement} config.container Selector which indicates where render the editor
+ * @param {Object|string} config.components='' HTML string or Component model in JSON format
+ * @param {Object|string} config.style='' CSS string or CSS model in JSON format
+ * @param {Boolean} [config.fromElement=false] If true, will fetch HTML and CSS from selected container
+ * @param {Boolean} [config.undoManager=true] Enable/Disable undo manager
+ * @param {Array} [config.plugins=[]] Array of plugins to execute on start
+ * @return {grapesjs.Editor} GrapesJS editor instance
+ * @example
+ * var editor = grapesjs.init({
+ * container: '#myeditor',
+ * components: 'Hello world',
+ * style: '.hello{color: red}',
+ * })
+ */
+ init(config = {}) {
+ const els = config.container;
+
+ if (!els) {
+ throw new Error("'container' is required");
+ }
+
+ defaults(config, defaultConfig);
+ config.el =
+ els instanceof window.HTMLElement ? els : document.querySelector(els);
+ const editor = new Editor(config).init();
+
+ // Load plugins
+ config.plugins.forEach(pluginId => {
+ const plugin = plugins.get(pluginId);
+
+ if (plugin) {
+ plugin(editor, config.pluginsOpts[pluginId] || {});
+ } else {
+ console.warn(`Plugin ${pluginId} not found`);
+ }
+ });
+
+ // Execute `onLoad` on modules once all plugins are initialized.
+ // A plugin might have extended/added some custom type so this
+ // is a good point to load stuff like components, css rules, etc.
+ editor.getModel().loadOnStart();
+
+ config.autorender && editor.render();
+
+ editors.push(editor);
+ return editor;
+ }
+ };
+})();