diff --git a/packages/core/src/abstract/Module.ts b/packages/core/src/abstract/Module.ts index e0e4f4cd0..6533ebea1 100644 --- a/packages/core/src/abstract/Module.ts +++ b/packages/core/src/abstract/Module.ts @@ -8,6 +8,7 @@ import { createId, isDef, deepMerge } from '../utils/mixins'; export interface IModule extends IBaseModule { destroy(): void; postLoad(key: any): any; + onInit(): void; onLoad?(): void; name: string; postRender?(view: any): void; @@ -72,6 +73,7 @@ export default abstract class Module impl render(opts?: any): HTMLElement | JQuery | void {} postLoad(key: any): void {} + onInit(): void {} get name(): string { return this._name; diff --git a/packages/core/src/block_manager/index.ts b/packages/core/src/block_manager/index.ts index a134e11fe..8815bbbdd 100644 --- a/packages/core/src/block_manager/index.ts +++ b/packages/core/src/block_manager/index.ts @@ -61,26 +61,24 @@ export default class BlockManager extends ItemManagerModule this.blocksVisible.add(model)); - this.blocks.on('remove', (model) => this.blocksVisible.remove(model)); - this.blocks.on('reset', (coll) => this.blocksVisible.reset(coll.models)); - + this.categories = new Categories([], { em, events: { update: BlocksEvents.categoryUpdate } }); this.__onAllEvent = debounce(() => this.__trgCustom(), 0); return this; } + onInit() { + const { config, blocks, blocksVisible } = this; + blocks.add(config.blocks || []); + // Setup the sync between the global and public collections + blocks.on('add', (model) => blocksVisible.add(model)); + blocks.on('remove', (model) => blocksVisible.remove(model)); + blocks.on('reset', (coll) => blocksVisible.reset(coll.models)); + } + /** * Get configuration object * @name getConfig diff --git a/packages/core/src/editor/model/Editor.ts b/packages/core/src/editor/model/Editor.ts index 13471b626..8161047b6 100644 --- a/packages/core/src/editor/model/Editor.ts +++ b/packages/core/src/editor/model/Editor.ts @@ -322,6 +322,10 @@ export default class EditorModel extends Model { return !!this.get('isShallow'); } + initModules() { + this.modules.forEach((module) => module.onInit()); + } + /** * Get configurations * @param {string} [prop] Property name diff --git a/packages/core/src/index.ts b/packages/core/src/index.ts index 2eca4673b..fc7dd4439 100644 --- a/packages/core/src/index.ts +++ b/packages/core/src/index.ts @@ -68,6 +68,7 @@ export const grapesjs = { }; const editor = new Editor(initConfig, { $ }); const em = editor.getModel(); + em.initModules(); // Load plugins initConfig.plugins!.forEach((pluginId) => { diff --git a/packages/core/test/specs/block_manager/view/BlocksView.ts b/packages/core/test/specs/block_manager/view/BlocksView.ts index b13941007..08053f028 100644 --- a/packages/core/test/specs/block_manager/view/BlocksView.ts +++ b/packages/core/test/specs/block_manager/view/BlocksView.ts @@ -52,6 +52,7 @@ describe('BlocksView', () => { ], }, }); + em.initModules(); model = em.Blocks.blocks; view = new BlocksView({ collection: model }, { em }); document.body.innerHTML = '
';