Adding an event for the creation of a tab of an invisible component l…

…ist as well as pane open and close (#644)

README.md

@@ -76,6 +76,9 @@ window.kiln.plugins['my-plugin'] = function () {
 * `add-selector` (el, options, parent data) — after a selector is added to a component
 * `form:open` (created form) — after a form is opened
 * `form:close` (form data) — after a form is closed (whether or not data was changed/saved)
+* `pane:open` (created pane, active tab) — right before a pane is opened
+* `pane:close` (pane) — after a pane is closed
+* `component-pane:create-invisible-tab` (pane content, invisible list object, layoutRef) - after one tab of content for the Component Pane has been created for an invisible component list
 
 ## Contributing
 

services/components/invisible-list.js

@@ -139,6 +139,12 @@ function createTabFromList(layoutRef, data, path) {
         reorder: updateOrder(list.path, list.el, data)
       });
 
+    // Trigger an event for plugins to interact with the
+    // filterable list HTML of an invisible component list
+    window.kiln.trigger('component-pane:create-invisible-tab', {
+      content, list, layoutRef
+    });
+
     if (list.path === path) {
       return {
         header: header,

services/pane/index.js

@@ -54,7 +54,10 @@ function close() {
   var pane = dom.find('.kiln-toolbar-pane-background');
 
   if (pane) {
+    // Remove pane element
     dom.removeElement(pane);
+    // Fire close event
+    window.kiln.trigger('pane:close', pane);
   }
 }
 
@@ -93,6 +96,8 @@ function open(tabs, dynamicTab) {
   // init controller for pane background, setting active tab if it exists
   ds.controller('paneWrapper', paneController);
   ds.get('paneWrapper', paneWrapper, active);
+  // Fire an event for pane open, pass along the content of the pane
+  window.kiln.trigger('pane:open', paneWrapper, active);
   // trick browser into doing a repaint, to force the animation
   setTimeout(function () {
     pane = dom.find(paneWrapper, '.kiln-toolbar-pane');