Support custom asset manager via custom.open/close

docs/modules/Assets.md

@@ -362,6 +362,12 @@ const editor = grapesjs.init({
           // `props` are the same used in `asset:custom` event
           // ...
           // Init and open your external Asset Manager
+          // ...
+          // IMPORTANT:
+          // When the external library is closed you have to comunicate
+          // this state back to the editor, otherwise GrapesJS will think
+          // the Asset Manager is still open.
+          // example: myAssetManager.on('close', () => props.close())
         },
         close(props) {
           // Close the external Asset Manager

src/asset_manager/index.js

@@ -122,7 +122,12 @@ export default () => {
       if (!bhv.container && !this.getConfig('custom').open) {
         return;
       }
-      this.em.trigger(this.events.custom, {
+      this.em.trigger(this.events.custom, this.__customData());
+    },
+
+    __customData() {
+      const bhv = this.__getBehaviour();
+      return {
         am: this,
         open: this.isOpen(),
         assets: this.getAll().models,
@@ -136,7 +141,7 @@ export default () => {
         },
         // extra
         options: bhv.options || {}
-      });
+      };
     },
 
     /**

src/commands/view/OpenAssets.js

@@ -3,19 +3,19 @@ import { createEl } from '../../utils/dom';
 
 export default {
   open(content) {
-    const { editor, title, config } = this;
+    const { editor, title, config, am } = this;
     const { custom } = config;
     if (isFunction(custom.open)) {
-      return custom.open(content);
+      return custom.open(am.__customData());
     }
     const { Modal } = editor;
     Modal.open({ title, content }).onceClose(() => editor.stopCommand(this.id));
   },
 
-  close(content) {
+  close() {
     const { custom } = this.config;
     if (isFunction(custom.close)) {
-      return custom.close(content);
+      return custom.close(this.am.__customData());
     }
     const { Modal } = this.editor;
     Modal && Modal.close();
@@ -28,6 +28,7 @@ export default {
     this.title = opts.modalTitle || editor.t('assetManager.modalTitle') || '';
     this.editor = editor;
     this.config = config;
+    this.am = am;
 
     am.setTarget(opts.target);
     am.onClick(opts.onClick);