From b6d1b9f4b8c31ed7032cf1eee21b86e68cfbfa47 Mon Sep 17 00:00:00 2001
From: Artur Arseniev <artur.catch@hotmail.it>
Date: Sat, 2 Jun 2018 16:48:18 +0200
Subject: [PATCH] Add `component:toggled` event and update OpenTraitManager

---
 src/commands/view/OpenTraitManager.js | 4 ++--
 src/dom_components/index.js           | 9 +++++++--
 src/editor/index.js                   | 1 +
 3 files changed, 10 insertions(+), 4 deletions(-)

diff --git a/src/commands/view/OpenTraitManager.js b/src/commands/view/OpenTraitManager.js
index 406e211a9..779796759 100644
--- a/src/commands/view/OpenTraitManager.js
+++ b/src/commands/view/OpenTraitManager.js
@@ -34,7 +34,7 @@ module.exports = {
         .trigger('change:appendContent');
 
       this.target = editor.getModel();
-      this.listenTo(this.target, 'change:selectedComponent', this.toggleTm);
+      this.listenTo(this.target, 'component:toggled', this.toggleTm);
     }
 
     this.toggleTm();
@@ -48,7 +48,7 @@ module.exports = {
     const sender = this.sender;
     if (sender && sender.get && !sender.get('active')) return;
 
-    if (this.target.get('selectedComponent')) {
+    if (this.target.getSelected()) {
       this.$cn2.show();
       this.$header.hide();
     } else {
diff --git a/src/dom_components/index.js b/src/dom_components/index.js
index ff33048c3..b09d4b0e0 100644
--- a/src/dom_components/index.js
+++ b/src/dom_components/index.js
@@ -526,18 +526,23 @@ module.exports = () => {
         component.set({
           status: 'selected'
         });
-        this.em.trigger('component:selected', component, opts);
+        ['component:selected', 'component:toggled'].forEach(event =>
+          this.em.trigger(event, component, opts)
+        );
       }
     },
 
     selectRemove(component, opts = {}) {
       console.log('REMOVED', component);
       if (component) {
+        const { em } = this;
         component.set({
           status: '',
           state: ''
         });
-        this.em.trigger('component:deselected', component, opts);
+        ['component:deselected', 'component:toggled'].forEach(event =>
+          this.em.trigger(event, component, opts)
+        );
       }
     },
 
diff --git a/src/editor/index.js b/src/editor/index.js
index 745d79e21..00825c7fe 100644
--- a/src/editor/index.js
+++ b/src/editor/index.js
@@ -18,6 +18,7 @@
  * * `component:styleUpdate:{propertyName}` - Listen for a specific style property change, the model is passed as an argument to the callback
  * * `component:selected` - New component selected, the selected model is passed as an argument to the callback
  * * `component:deselected` - Component deselected, the deselected model is passed as an argument to the callback
+ * * `component:toggled` - Component selection changed, toggled model is passed as an argument to the callback
  * ## Blocks
  * * `block:add` - New block added
  * * `block:remove` - Block removed