Improving behavior API

example/tree/App.vue

@@ -222,8 +222,8 @@
         </template>
       </template> -->
 
-     <template #behavior="{nodes, actions}">
-        <StandardBehavior v-bind="{nodes, actions}"/> 
+     <template #behavior="{on, actions}">
+        <StandardBehavior v-bind="{on, actions}"/> 
       </template>
     </tree>
   </div>

src/Tree.vue

@@ -164,17 +164,19 @@ export default {
   },
 
   render (h) {
-    const {setSelected, collapse, collapseAll, expand, expandAll, show, toggleExpandCollapse} = this
-    const rawActions = {setSelected, collapse, collapseAll, expand, expandAll, show, toggleExpandCollapse}
-    this.actions = Object.keys(rawActions).reduce((current, key) => {
-      current[key] = rawActions[key].bind(this)
-      return current
-    }, {})
-    const getProps = () => {
-      const {actions, graphNodes: nodes} = this
-      return {nodes, actions}
+    if (!this._behaviour) {
+      const {setSelected, collapse, collapseAll, expand, expandAll, show, toggleExpandCollapse} = this
+      const rawActions = {setSelected, collapse, collapseAll, expand, expandAll, show, toggleExpandCollapse}
+      this.actions = Object.keys(rawActions).reduce((current, key) => {
+        current[key] = rawActions[key].bind(this)
+        return current
+      }, {})
+      const getProps = () => {
+        const {actions, graphNodes: nodes, $on: on} = this
+        return {nodes, actions, on: on.bind(this)}
+      }
+      this._behaviour = renderTemplateSlot(getProps, this.$scopedSlots.behavior, standardBehavior)
     }
-    this._behaviour = renderTemplateSlot(getProps, this.$scopedSlots.behavior, standardBehavior)
     return h('div', {class: 'viewport treeclass', directives: [{name: 'resize', value: this.resize}]})
   },
 

src/behaviors/StandardBehavior.js

@@ -6,11 +6,11 @@ export default {
   name: 'standardBehavior',
   props: {
     /**
-     *  Tree nodes. Typically provided by tree behavior slot.
+     *  Parent event listener.
      */
-    nodes: {
-      required: false,
-      type: Object
+    on: {
+      required: true,
+      type: Function
     },
     /**
      *  Tree actions. Typically provided by tree behavior slot.
@@ -26,13 +26,15 @@ export default {
     return null
   },
 
-  watch: {
-    'nodes.clickedText': function (node) {
-      node && this.actions.setSelected(node.data)
-    },
+  created () {
+    const {on, actions} = this
 
-    'nodes.clickedNode': function (node) {
-      node && this.actions.toggleExpandCollapse(node)
-    }
+    on('clickedText', ({element}) => {
+      actions.setSelected(element)
+    })
+
+    on('clickedNode', ({element}) => {
+      actions.toggleExpandCollapse(element)
+    })
   }
 }