Merge branch 'dev' of https://github.com/artf/grapesjs into dev

src/panels/index.js

@@ -2,6 +2,7 @@
  *
  * * [addPanel](#addpanel)
  * * [addButton](#addbutton)
+ * * [removeButton](#removebutton)
  * * [getButton](#getbutton)
  * * [getPanel](#getpanel)
  * * [getPanels](#getpanels)
@@ -115,6 +116,24 @@ module.exports = () => {
     addPanel(panel) {
       return panels.add(panel);
     },
+    
+    /**
+     * Remove a panel from the collection
+     * @param {Object|Panel|String} panel Object with right properties or an instance of Panel or Painel id
+     * @return {Panel} Removed panel. Useful in case passed argument was an Object
+     * @example
+     * const newPanel = panelManager.removePanel({
+     *   id: 'myNewPanel',
+     *  visible  : true,
+     *  buttons  : [...],
+     * });
+     * 
+     * const newPanel = panelManager.removePanel('myNewPanel');
+     * 
+     */
+    removePanel(panel) {
+      return panels.remove(panel);
+    },
 
     /**
      * Get panel by ID
@@ -162,6 +181,29 @@ module.exports = () => {
       var pn  = this.getPanel(panelId);
       return pn ? pn.get('buttons').add(button) : null;
     },
+    
+    /**
+     * Remove button from the panel
+     * @param {string} panelId Panel's ID
+     * @param {Object|Button|String} button Button object or instance of Button or button id
+     * @return {Button|null} Removed button. 
+     * @example
+     * const removedButton = panelManager.removeButton('myNewPanel',{
+     *   id: 'myNewButton',
+     *   className: 'someClass',
+     *   command: 'someCommand',
+     *   attributes: { title: 'Some title'},
+     *   active: false,
+     * });
+     * 
+     * // It's also possible to use the button id
+     * const removedButton = panelManager.removeButton('myNewPanel','myNewButton');
+     * 
+     */
+    removeButton(panelId, button) {
+      var pn  = this.getPanel(panelId);
+      return pn && pn.get('buttons').remove(button);
+    },
 
     /**
      * Get button from the panel

test/specs/panels/index.js

@@ -102,6 +102,60 @@ describe('Panels', () => {
       expect(spy.called).toEqual(true);
     });
 
+    it("Can't remove button to non existent panel", () => {
+      expect(obj.removeButton('test', {id:'btn'})).toEqual(null);
+    });
+
+    describe('Removes button', () => {
+      it("Remove button correctly with object", () => {
+        var panel = obj.addPanel({id: 'test'});
+        var btn = obj.addButton('test', {id:'btn'});
+        expect(panel.get('buttons').length).toEqual(1);
+        expect(panel.get('buttons').at(0).get('id')).toEqual('btn');
+        expect(obj.removeButton('test', {id:'btn'})).toEqual(btn);
+        expect(panel.get('buttons').length).toEqual(0);
+      });
+      
+      it("Remove button correctly with sting", () => {
+        var panel = obj.addPanel({id: 'test'});
+        var btn = obj.addButton('test', {id:'btn'});
+        expect(panel.get('buttons').length).toEqual(1);
+        expect(panel.get('buttons').at(0).get('id')).toEqual('btn');
+        expect(obj.removeButton('test', 'btn')).toEqual(btn);
+        expect(panel.get('buttons').length).toEqual(0);
+      });
+    });
+
+
+    describe('Removes Panel', () => {
+
+      it("Removes panel correctly via object", () => {
+        var panel = obj.addPanel({id: 'test'});
+        expect(panel.get('id')).toEqual('test');
+        obj.removePanel({id: 'test'});
+        expect(panel.get('id')).toEqual('test');
+      });
+  
+      it("Removes panel correctly via Panel instance", () => {
+        var oPanel = new obj.Panel({id: 'test'});
+        var panel = obj.addPanel(oPanel);
+        expect(panel).toEqual(oPanel);
+        expect(panel.get('id')).toEqual('test');
+        obj.removePanel(oPanel);
+        expect(obj.getPanels.length).toEqual(0);
+      });
+      
+      it("Removes panel correctly via id", () => {
+        var oPanel = new obj.Panel({id: 'test'});
+        var panel = obj.addPanel(oPanel);
+        expect(panel).toEqual(oPanel);
+        expect(panel.get('id')).toEqual('test');
+        obj.removePanel('test');
+        expect(obj.getPanels.length).toEqual(0);
+      });
+    });
+
+
   });
 
   Models.run();