@sme.up/ketchup 6.5.0 → 6.7.0

package/dist/collection/components/kup-tree/kup-tree.js

@@ -1,4 +1,4 @@
-import { Component, Element, Event, forceUpdate, getAssetPath, h, Host, Method, Prop, State, Watch, } from '@stencil/core';
+import { forceUpdate, getAssetPath, h, Host, } from '@stencil/core';
 import { TotalLabel, TotalMode, } from './../kup-data-table/kup-data-table-declarations';
 import { KupTreeProps, treeMainColumnName, KupTreeExpansionMode, } from './kup-tree-declarations';
 import { MDCRipple } from '@material/ripple';
@@ -32,8 +32,12 @@ export class KupTree {
      */
     this.openedTotalMenu = null;
     this.columnMenuAnchor = null;
-    this.selectedNodeString = '';
     this.stateSwitcher = false;
+    /**
+     * An array of integers containing the path to a selected child.\
+     * Groups up the properties SelFirst, SelItem, SelName.
+     */
+    this.selectedNode = [];
     /*-------------------------------------------------*/
     /*                    P r o p s                    */
     /*-------------------------------------------------*/
@@ -42,10 +46,6 @@ export class KupTree {
      * @default false
      */
     this.asAccordion = false;
-    /**
-     * Auto select programmatic selectic node
-     */
-    this.autoSelectionNodeMode = true;
     /**
      * Custom style of the component.
      * @default ""
@@ -125,11 +125,6 @@ export class KupTree {
      * Activates the scroll on hover function.
      */
     this.scrollOnHover = false;
-    /**
-     * An array of integers containing the path to a selected child.\
-     * Groups up the properties SelFirst, SelItem, SelName.
-     */
-    this.selectedNode = [];
     /**
      * Shows the tree data as a table.
      */
@@ -174,6 +169,7 @@ export class KupTree {
      * Reference to the column menu card.
      */
     this.columnMenuCard = null;
+    this.selectedColumn = '';
     this.clickTimeout = [];
     this.sizedColumns = undefined;
     this.filtersColumnMenuInstance = new FiltersColumnMenu();
@@ -239,6 +235,31 @@ export class KupTree {
       }
     }
   }
+  /**
+   * This method will get the selected nodes of the component.
+   */
+  async getSelectedNode() {
+    return this.selectedNode;
+  }
+  /**
+   * This method will set the selected rows of the component.
+   * @param {string|number[]} rowsIdentifiers - Array of ids (dataset) or indexes (rendered rows).
+   * @param {boolean} emitEvent - The event will always be emitted unless emitEvent is set to false.
+   */
+  async setSelectedNode(treeNodePath, emitEvent) {
+    this.selectedNode = treeNodePath
+      .split(',')
+      .map((treeNodeIndex) => parseInt(treeNodeIndex));
+    if (emitEvent !== false) {
+      this.kupTreeNodeSelected.emit({
+        comp: this,
+        id: this.rootElement.id,
+        treeNodePath: this.selectedNode,
+        treeNode: this.getTreeNode(this.selectedNode),
+        columnName: this.selectedColumn,
+      });
+    }
+  }
   /*-------------------------------------------------*/
   /*                  W a t c h e r s                */
   /*-------------------------------------------------*/
@@ -255,11 +276,6 @@ export class KupTree {
       this.refreshStructureState();
     }
   }
-  selectedNodeToStr(newData) {
-    if (Array.isArray(newData)) {
-      this.selectedNodeString = newData.toString();
-    }
-  }
   /*-------------------------------------------------*/
   /*           P u b l i c   M e t h o d s           */
   /*-------------------------------------------------*/
@@ -531,7 +547,7 @@ export class KupTree {
           this.launchNodeEvent(treeNodePath, tn);
         }
         else {
-          this.hdlTreeNodeClick(null, tn, this.selectedNodeString, true);
+          this.hdlTreeNodeClick(null, tn, this.selectedNodeToString(this.selectedNode));
         }
       }
     }
@@ -653,34 +669,25 @@ export class KupTree {
     return path;
   }
   // When a TreeNode can be selected
-  hdlTreeNodeClick(e, treeNodeData, treeNodePath, auto) {
+  hdlTreeNodeClick(e, treeNodeData, treeNodePath) {
     if (this.expansionMode.toLowerCase() ===
       KupTreeExpansionMode.DROPDOWN ||
       (this.expansionMode.toLowerCase() === KupTreeExpansionMode.NODE &&
         !treeNodeData.expandable)) {
-      const td = e
-        ? this.getEventPath(e.target).find((el) => {
-          if (el.tagName === 'TD')
-            return el;
-        })
-        : null;
       // If this TreeNode is not disabled, then it can be selected and an event is emitted
       if (treeNodeData && !treeNodeData.disabled) {
-        if (this.autoSelectionNodeMode)
-          this.selectedNode = treeNodePath
-            .split(',')
-            .map((treeNodeIndex) => parseInt(treeNodeIndex));
+        this.selectedNode = treeNodePath
+          .split(',')
+          .map((treeNodeIndex) => parseInt(treeNodeIndex));
         this.kupTreeNodeSelected.emit({
           comp: this,
           id: this.rootElement.id,
-          treeNodePath: treeNodePath
-            .split(',')
-            .map((treeNodeIndex) => parseInt(treeNodeIndex)),
+          treeNodePath: this.selectedNode,
           treeNode: treeNodeData,
-          columnName: td ? td.dataset.column : null,
-          auto: auto,
+          columnName: this.selectedColumn,
         });
       }
+      this.selectedColumn = '';
     }
     // If KupTreeExpansionMode.NODE then click is a collapse/expand click
     if (this.expansionMode.toLowerCase() === KupTreeExpansionMode.NODE) {
@@ -775,9 +782,9 @@ export class KupTree {
   hasTotals() {
     return this.totals && Object.keys(this.totals).length > 0;
   }
-  handleChildren(TreeNode, expand) {
-    for (let index = 0; index < TreeNode.children.length; index++) {
-      let node = TreeNode.children[index];
+  handleChildren(treeNode, expand) {
+    for (let index = 0; index < treeNode.children.length; index++) {
+      let node = treeNode.children[index];
       if (!node.disabled) {
         node.isExpanded = expand;
         if (node.children) {
@@ -795,7 +802,7 @@ export class KupTree {
     if (nodePath && nodePath.length) {
       strToRet = nodePath[0].toString();
       for (let i = 1; i < nodePath.length; i++) {
-        strToRet += `,${nodePath[0]}`;
+        strToRet += `,${nodePath[i]}`;
       }
     }
     return strToRet;
@@ -803,6 +810,21 @@ export class KupTree {
   getFilterValueForTooltip(column) {
     return this.filtersColumnMenuInstance.getFilterValueForTooltip(this.filters, column);
   }
+  getTreeNode(nodePath) {
+    if (!nodePath || nodePath.length == 0) {
+      return null;
+    }
+    let father = this.data;
+    let node = null;
+    for (let index = 0; index < nodePath.length; index++) {
+      if (node) {
+        father = node.children;
+      }
+      const nodeIndex = nodePath[index];
+      node = father[nodeIndex];
+    }
+    return node;
+  }
   onRemoveFilter(column) {
     const newFilters = Object.assign({}, this.filters);
     this.filtersColumnMenuInstance.removeFilter(newFilters, column.name);
@@ -852,6 +874,7 @@ export class KupTree {
       this.data.forEach((rootNode) => {
         this.expandCollapseAllNodes(rootNode, this.expanded && !this.useDynamicExpansion);
       });
+      this.selectedNode = [];
     }
   }
   createIconElement(CSSClass, icon, iconColor) {
@@ -859,8 +882,7 @@ export class KupTree {
       icon.indexOf('/') > -1 ||
       icon.indexOf('\\') > -1) {
       CSSClass += ' is-image';
-      return (h("span", { class: CSSClass },
-        h("img", { src: icon })));
+      return (h("span", { class: CSSClass }, h("img", { src: icon })));
     }
     else {
       let svg = `url('${getAssetPath(`./assets/svg/${icon}.svg`)}') no-repeat center`;
@@ -916,9 +938,7 @@ export class KupTree {
             this.onRemoveFilter(column);
           } }));
       }
-      return (h("th", { "data-column": column.name, style: this.getCellStyle(column.name, null) },
-        h("span", { class: "column-title" }, column.title),
-        filter));
+      return (h("th", { "data-column": column.name, style: this.getCellStyle(column.name, null) }, h("span", { class: "column-title" }, column.title), filter));
     });
   }
   /**
@@ -1018,20 +1038,13 @@ export class KupTree {
     }
     // When can be expanded OR selected
     if (!treeNodeData.disabled) {
-      treeNodeOptions['onClick'] = (e) => {
-        // Note: event must be cloned
-        // otherwise inside setTimeout will be exiting the Shadow DOM scope(causing loss of information, including target).
-        const clone = {};
-        for (const key in e) {
-          clone[key] = e[key];
-        }
-        this.clickTimeout.push(setTimeout(() => this.hdlTreeNodeClick(clone, treeNodeData, treeNodePath, false), 300));
+      treeNodeOptions['onClick'] = () => {
+        this.clickTimeout.push(setTimeout((e) => this.hdlTreeNodeClick(e, treeNodeData, treeNodePath), 300));
       };
     }
     // When a tree node is displayed as a table
     let treeNodeCells = null;
     let visibleCols = this.getVisibleColumns();
-    const _hasTooltip = !this.kupManager.objects.isEmptyKupObj(treeNodeData.obj);
     if (this.showColumns && visibleCols && visibleCols.length) {
       treeNodeCells = [];
       // Renders all the cells
@@ -1051,8 +1064,7 @@ export class KupTree {
             row: treeNodeData,
             setSizes: true,
           };
-          treeNodeCells.push(h("td", { class: `grid-cell`, "data-cell": cell, "data-column": column.name },
-            h(FCell, Object.assign({}, cellProps))));
+          treeNodeCells.push(h("td", { class: `grid-cell`, "data-cell": cell, "data-column": column.name }, h(FCell, Object.assign({}, cellProps))));
         }
         else {
           treeNodeCells.push(h("td", { class: `grid-cell` }));
@@ -1101,10 +1113,9 @@ export class KupTree {
         'kup-tree__node--disabled': treeNodeData.disabled,
         'kup-tree__node--first': treeNodeDepth ? false : true,
         'kup-tree__node--selected': !treeNodeData.disabled &&
-          treeNodePath === this.selectedNodeString,
-      }, "data-row": treeNodeData, "data-tree-path": treeNodePath }, treeNodeOptions),
-      treeNodeCell,
-      treeNodeCells));
+          treeNodePath ===
+            this.selectedNodeToString(this.selectedNode),
+      }, "data-row": treeNodeData, "data-tree-path": treeNodePath }, treeNodeOptions), treeNodeCell, treeNodeCells));
   }
   closeTotalMenu() {
     this.openedTotalMenu = null;
@@ -1225,14 +1236,9 @@ export class KupTree {
       else {
         value = numberToFormattedStringNumber(this.footer[column.name], column.decimals, column.obj ? column.obj.p : '');
       }
-      return (h("td", { "data-column": column.name },
-        totalMenu,
-        h("span", { class: "totals-value", title: translation[menuLabel] }, value)));
+      return (h("td", { "data-column": column.name }, totalMenu, h("span", { class: "totals-value", title: translation[menuLabel] }, value)));
     });
-    return (h("tfoot", null,
-      h("tr", null,
-        nodesCell,
-        footerCells)));
+    return (h("tfoot", null, h("tr", null, nodesCell, footerCells)));
   }
   didLoadInteractables() {
     this.interactableTouch.push(this.treeWrapperRef);
@@ -1343,25 +1349,8 @@ export class KupTree {
     this.kupManager.theme.register(this);
     this.columnMenuInstance = new KupColumnMenu();
     this.refreshStructureState();
-    // Initializes the selectedNodeString
-    if (Array.isArray(this.selectedNode)) {
-      this.selectedNodeString = this.selectedNode.toString();
-    }
   }
   componentDidLoad() {
-    if (this.selectedNode &&
-      this.selectedNode.length > 0 &&
-      this.selectedNode[0] >= 0) {
-      let path = this.selectedNode;
-      let tn = this.data[path[0]];
-      if (path.length > 1) {
-        path = path.slice(1);
-        this.launchNodeEvent(path, tn);
-      }
-      else {
-        this.hdlTreeNodeClick(null, tn, this.selectedNodeString, true);
-      }
-    }
     this.didLoadInteractables();
     this.kupDidLoad.emit({ comp: this, id: this.rootElement.id });
     this.kupManager.resize.observe(this.rootElement);
@@ -1423,8 +1412,7 @@ export class KupTree {
     }
     else {
       // There are no TreeNodes, so we print a single cell with a caption
-      treeNodes.push(h("tr", null,
-        h("td", null, this.kupManager.language.translate(KupLanguageGeneric.EMPTY_DATA))));
+      treeNodes.push(h("tr", null, h("td", null, this.kupManager.language.translate(KupLanguageGeneric.EMPTY_DATA))));
     }
     // Calculates if header must be shown or not
     const visibleHeader = this.showHeader && this.showColumns;
@@ -1433,30 +1421,20 @@ export class KupTree {
       this.data &&
       this.data.length &&
       this.data.length > 0) {
-      filterField = (h("div", { id: "global-filter" },
-        h("kup-text-field", { fullWidth: true, label: this.kupManager.language.translate(KupLanguageSearch.SEARCH), icon: KupThemeIconValues.SEARCH, initialValue: this.globalFilterValue, "onkup-textfield-input": (event) => {
-            window.clearTimeout(this.globalFilterTimeout);
-            this.globalFilterTimeout = window.setTimeout(() => this.onGlobalFilterChange(event), 600);
-          } })));
-    }
-    return (h(Host, null,
-      h("style", null, this.kupManager.theme.setKupStyle(this.rootElement)),
-      h("div", { id: componentWrapperId, class: wrapperClass },
-        filterField,
-        h("div", { class: "wrapper", ref: (el) => (this.treeWrapperRef =
-            el) },
-          h("table", { class: "kup-tree", "data-show-columns": this.showColumns, onContextMenu: (e) => {
-              e.preventDefault();
-            } },
-            h("thead", { class: {
-                'header--is-visible': visibleHeader,
-              } },
-              h("tr", null, visibleHeader ? this.renderHeader() : null)),
-            h("tbody", null, treeNodes),
-            (this.showFooter || this.hasTotals()) &&
-              this.columns
-              ? this.renderFooter()
-              : null)))));
+      filterField = (h("div", { id: "global-filter" }, h("kup-text-field", { fullWidth: true, label: this.kupManager.language.translate(KupLanguageSearch.SEARCH), icon: KupThemeIconValues.SEARCH, initialValue: this.globalFilterValue, "onkup-textfield-input": (event) => {
+          window.clearTimeout(this.globalFilterTimeout);
+          this.globalFilterTimeout = window.setTimeout(() => this.onGlobalFilterChange(event), 600);
+        } })));
+    }
+    return (h(Host, null, h("style", null, this.kupManager.theme.setKupStyle(this.rootElement)), h("div", { id: componentWrapperId, class: wrapperClass }, filterField, h("div", { class: "wrapper", ref: (el) => (this.treeWrapperRef =
+        el) }, h("table", { class: "kup-tree", "data-show-columns": this.showColumns, onContextMenu: (e) => {
+        e.preventDefault();
+      } }, h("thead", { class: {
+        'header--is-visible': visibleHeader,
+      } }, h("tr", null, visibleHeader ? this.renderHeader() : null)), h("tbody", null, treeNodes), (this.showFooter || this.hasTotals()) &&
+      this.columns
+      ? this.renderFooter()
+      : null)))));
   }
   disconnectedCallback() {
     this.kupManager.language.register(this);
@@ -1476,1094 +1454,1117 @@ export class KupTree {
   }
   static get is() { return "kup-tree"; }
   static get encapsulation() { return "shadow"; }
-  static get originalStyleUrls() { return {
-    "$": ["kup-tree.scss"]
-  }; }
-  static get styleUrls() { return {
-    "$": ["kup-tree.css"]
-  }; }
-  static get properties() { return {
-    "asAccordion": {
-      "type": "boolean",
-      "mutable": false,
-      "complexType": {
-        "original": "boolean",
-        "resolved": "boolean",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [{
-            "name": "default",
-            "text": "false"
-          }],
-        "text": "When enabled, the first level of depth will give an accordion look to nodes."
-      },
-      "attribute": "as-accordion",
-      "reflect": true,
-      "defaultValue": "false"
-    },
-    "autoSelectionNodeMode": {
-      "type": "boolean",
-      "mutable": false,
-      "complexType": {
-        "original": "boolean",
-        "resolved": "boolean",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": "Auto select programmatic selectic node"
-      },
-      "attribute": "auto-selection-node-mode",
-      "reflect": false,
-      "defaultValue": "true"
-    },
-    "columns": {
-      "type": "unknown",
-      "mutable": true,
-      "complexType": {
-        "original": "KupDataColumn[]",
-        "resolved": "KupDataColumn[]",
-        "references": {
-          "KupDataColumn": {
-            "location": "import",
-            "path": "../../managers/kup-data/kup-data-declarations"
-          }
-        }
-      },
-      "required": false,
-      "optional": true,
-      "docs": {
-        "tags": [],
-        "text": "The columns of the tree when tree visualization is active."
-      }
-    },
-    "customStyle": {
-      "type": "string",
-      "mutable": false,
-      "complexType": {
-        "original": "string",
-        "resolved": "string",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [{
-            "name": "default",
-            "text": "\"\""
-          }, {
-            "name": "see",
-            "text": "https://ketchup.smeup.com/ketchup-showcase/#/customization"
-          }],
-        "text": "Custom style of the component."
-      },
-      "attribute": "custom-style",
-      "reflect": false,
-      "defaultValue": "''"
-    },
-    "data": {
-      "type": "unknown",
-      "mutable": true,
-      "complexType": {
-        "original": "KupTreeNode[]",
-        "resolved": "KupTreeNode[]",
-        "references": {
-          "KupTreeNode": {
-            "location": "import",
-            "path": "./kup-tree-declarations"
+  static get originalStyleUrls() {
+    return {
+      "$": ["kup-tree.scss"]
+    };
+  }
+  static get styleUrls() {
+    return {
+      "$": ["kup-tree.css"]
+    };
+  }
+  static get properties() {
+    return {
+      "asAccordion": {
+        "type": "boolean",
+        "mutable": false,
+        "complexType": {
+          "original": "boolean",
+          "resolved": "boolean",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [{
+              "name": "default",
+              "text": "false"
+            }],
+          "text": "When enabled, the first level of depth will give an accordion look to nodes."
+        },
+        "attribute": "as-accordion",
+        "reflect": true,
+        "defaultValue": "false"
+      },
+      "columns": {
+        "type": "unknown",
+        "mutable": true,
+        "complexType": {
+          "original": "KupDataColumn[]",
+          "resolved": "KupDataColumn[]",
+          "references": {
+            "KupDataColumn": {
+              "location": "import",
+              "path": "../../managers/kup-data/kup-data-declarations"
+            }
           }
+        },
+        "required": false,
+        "optional": true,
+        "docs": {
+          "tags": [],
+          "text": "The columns of the tree when tree visualization is active."
         }
       },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": "The json data used to populate the tree view: the basic, always visible tree nodes."
-      },
-      "defaultValue": "[]"
-    },
-    "density": {
-      "type": "string",
-      "mutable": false,
-      "complexType": {
-        "original": "FCellPadding",
-        "resolved": "FCellPadding.DENSE | FCellPadding.MEDIUM | FCellPadding.NONE | FCellPadding.WIDE",
-        "references": {
-          "FCellPadding": {
-            "location": "import",
-            "path": "../../f-components/f-cell/f-cell-declarations"
+      "customStyle": {
+        "type": "string",
+        "mutable": false,
+        "complexType": {
+          "original": "string",
+          "resolved": "string",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [{
+              "name": "default",
+              "text": "\"\""
+            }, {
+              "name": "see",
+              "text": "https://ketchup.smeup.com/ketchup-showcase/#/customization"
+            }],
+          "text": "Custom style of the component."
+        },
+        "attribute": "custom-style",
+        "reflect": false,
+        "defaultValue": "''"
+      },
+      "data": {
+        "type": "unknown",
+        "mutable": true,
+        "complexType": {
+          "original": "KupTreeNode[]",
+          "resolved": "KupTreeNode[]",
+          "references": {
+            "KupTreeNode": {
+              "location": "import",
+              "path": "./kup-tree-declarations"
+            }
           }
-        }
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": "The density of the rows, defaults at 'medium' and can also be set to 'dense' or 'wide'."
-      },
-      "attribute": "density",
-      "reflect": false,
-      "defaultValue": "FCellPadding.MEDIUM"
-    },
-    "dynamicExpansionCallback": {
-      "type": "unknown",
-      "mutable": false,
-      "complexType": {
-        "original": "(\r\n        treeNodeToExpand: KupTreeNode,\r\n        treeNodePath: TreeNodePath\r\n    ) => Promise<KupTreeNode[]> | undefined",
-        "resolved": "(treeNodeToExpand: KupTreeNode, treeNodePath: TreeNodePath) => Promise<KupTreeNode[]>",
-        "references": {
-          "KupTreeNode": {
-            "location": "import",
-            "path": "./kup-tree-declarations"
-          },
-          "TreeNodePath": {
-            "location": "import",
-            "path": "./kup-tree-declarations"
-          },
-          "Promise": {
-            "location": "global"
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": "The json data used to populate the tree view: the basic, always visible tree nodes."
+        },
+        "defaultValue": "[]"
+      },
+      "density": {
+        "type": "string",
+        "mutable": false,
+        "complexType": {
+          "original": "FCellPadding",
+          "resolved": "FCellPadding.DENSE | FCellPadding.MEDIUM | FCellPadding.NONE | FCellPadding.WIDE",
+          "references": {
+            "FCellPadding": {
+              "location": "import",
+              "path": "../../f-components/f-cell/f-cell-declarations"
+            }
           }
-        }
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [{
-            "name": "see",
-            "text": "useDynamicExpansion"
-          }],
-        "text": "Function that gets invoked when a new set of nodes must be loaded as children of a node.\r\n\r\nWhen useDynamicExpansion is set, the tree component will have two different behaviors depending on the value of this prop.\r\n1 - If this prop is set to null, no callback to download data is available:\r\n   the component will emit an event requiring the parent to load the children of the given node.\r\n2 - If this prop is set to have a callback, then the component will automatically make requests to load children of\r\n   a given node. After the load has been completed, a different event will be fired to alert the parent of the change."
-      },
-      "defaultValue": "undefined"
-    },
-    "editableData": {
-      "type": "boolean",
-      "mutable": false,
-      "complexType": {
-        "original": "boolean",
-        "resolved": "boolean",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [{
-            "name": "default",
-            "text": "false"
-          }],
-        "text": "When set to true, editable cells will be rendered using input components."
-      },
-      "attribute": "editable-data",
-      "reflect": false,
-      "defaultValue": "false"
-    },
-    "enableExtraColumns": {
-      "type": "boolean",
-      "mutable": false,
-      "complexType": {
-        "original": "boolean",
-        "resolved": "boolean",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": "Enables the extracolumns add buttons."
-      },
-      "attribute": "enable-extra-columns",
-      "reflect": false,
-      "defaultValue": "true"
-    },
-    "expanded": {
-      "type": "boolean",
-      "mutable": false,
-      "complexType": {
-        "original": "boolean",
-        "resolved": "boolean",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": "Flag: the nodes of the whole tree must be already expanded upon loading. Disabled nodes do NOT get expanded."
-      },
-      "attribute": "expanded",
-      "reflect": false,
-      "defaultValue": "false"
-    },
-    "expansionMode": {
-      "type": "string",
-      "mutable": false,
-      "complexType": {
-        "original": "KupTreeExpansionMode",
-        "resolved": "KupTreeExpansionMode.DROPDOWN | KupTreeExpansionMode.NODE",
-        "references": {
-          "KupTreeExpansionMode": {
-            "location": "import",
-            "path": "./kup-tree-declarations"
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": "The density of the rows, defaults at 'medium' and can also be set to 'dense' or 'wide'."
+        },
+        "attribute": "density",
+        "reflect": false,
+        "defaultValue": "FCellPadding.MEDIUM"
+      },
+      "dynamicExpansionCallback": {
+        "type": "unknown",
+        "mutable": false,
+        "complexType": {
+          "original": "(\r\n        treeNodeToExpand: KupTreeNode,\r\n        treeNodePath: TreeNodePath\r\n    ) => Promise<KupTreeNode[]> | undefined",
+          "resolved": "(treeNodeToExpand: KupTreeNode, treeNodePath: TreeNodePath) => Promise<KupTreeNode[]>",
+          "references": {
+            "KupTreeNode": {
+              "location": "import",
+              "path": "./kup-tree-declarations"
+            },
+            "TreeNodePath": {
+              "location": "import",
+              "path": "./kup-tree-declarations"
+            },
+            "Promise": {
+              "location": "global"
+            }
           }
-        }
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [{
-            "name": "default",
-            "text": "KupTreeExpansionMode.DROPDOWN"
-          }],
-        "text": "Behavior of nodes' expansion: it can be chosen between expanding a node by clicking on the dropdown icon, or by clicking on the whole node."
-      },
-      "attribute": "expansion-mode",
-      "reflect": false,
-      "defaultValue": "KupTreeExpansionMode.DROPDOWN"
-    },
-    "filters": {
-      "type": "unknown",
-      "mutable": true,
-      "complexType": {
-        "original": "GenericFilter",
-        "resolved": "GenericFilter",
-        "references": {
-          "GenericFilter": {
-            "location": "import",
-            "path": "../../utils/filters/filters-declarations"
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [{
+              "name": "see",
+              "text": "useDynamicExpansion"
+            }],
+          "text": "Function that gets invoked when a new set of nodes must be loaded as children of a node.\r\n\r\nWhen useDynamicExpansion is set, the tree component will have two different behaviors depending on the value of this prop.\r\n1 - If this prop is set to null, no callback to download data is available:\r\n   the component will emit an event requiring the parent to load the children of the given node.\r\n2 - If this prop is set to have a callback, then the component will automatically make requests to load children of\r\n   a given node. After the load has been completed, a different event will be fired to alert the parent of the change."
+        },
+        "defaultValue": "undefined"
+      },
+      "editableData": {
+        "type": "boolean",
+        "mutable": false,
+        "complexType": {
+          "original": "boolean",
+          "resolved": "boolean",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [{
+              "name": "default",
+              "text": "false"
+            }],
+          "text": "When set to true, editable cells will be rendered using input components."
+        },
+        "attribute": "editable-data",
+        "reflect": false,
+        "defaultValue": "false"
+      },
+      "enableExtraColumns": {
+        "type": "boolean",
+        "mutable": false,
+        "complexType": {
+          "original": "boolean",
+          "resolved": "boolean",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": "Enables the extracolumns add buttons."
+        },
+        "attribute": "enable-extra-columns",
+        "reflect": false,
+        "defaultValue": "true"
+      },
+      "expanded": {
+        "type": "boolean",
+        "mutable": false,
+        "complexType": {
+          "original": "boolean",
+          "resolved": "boolean",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": "Flag: the nodes of the whole tree must be already expanded upon loading. Disabled nodes do NOT get expanded."
+        },
+        "attribute": "expanded",
+        "reflect": false,
+        "defaultValue": "false"
+      },
+      "expansionMode": {
+        "type": "string",
+        "mutable": false,
+        "complexType": {
+          "original": "KupTreeExpansionMode",
+          "resolved": "KupTreeExpansionMode.DROPDOWN | KupTreeExpansionMode.NODE",
+          "references": {
+            "KupTreeExpansionMode": {
+              "location": "import",
+              "path": "./kup-tree-declarations"
+            }
           }
-        }
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": "List of filters set by the user."
-      },
-      "defaultValue": "{}"
-    },
-    "globalFilter": {
-      "type": "boolean",
-      "mutable": false,
-      "complexType": {
-        "original": "boolean",
-        "resolved": "boolean",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": "When set to true it activates the global filter."
-      },
-      "attribute": "global-filter",
-      "reflect": false,
-      "defaultValue": "false"
-    },
-    "globalFilterValue": {
-      "type": "string",
-      "mutable": true,
-      "complexType": {
-        "original": "string",
-        "resolved": "string",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": "The value of the global filter."
-      },
-      "attribute": "global-filter-value",
-      "reflect": true,
-      "defaultValue": "''"
-    },
-    "globalFilterMode": {
-      "type": "string",
-      "mutable": false,
-      "complexType": {
-        "original": "KupGlobalFilterMode",
-        "resolved": "KupGlobalFilterMode.HIGHLIGHT | KupGlobalFilterMode.SIMPLE",
-        "references": {
-          "KupGlobalFilterMode": {
-            "location": "import",
-            "path": "../../utils/filters/filters-declarations"
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [{
+              "name": "default",
+              "text": "KupTreeExpansionMode.DROPDOWN"
+            }],
+          "text": "Behavior of nodes' expansion: it can be chosen between expanding a node by clicking on the dropdown icon, or by clicking on the whole node."
+        },
+        "attribute": "expansion-mode",
+        "reflect": false,
+        "defaultValue": "KupTreeExpansionMode.DROPDOWN"
+      },
+      "filters": {
+        "type": "unknown",
+        "mutable": true,
+        "complexType": {
+          "original": "GenericFilter",
+          "resolved": "GenericFilter",
+          "references": {
+            "GenericFilter": {
+              "location": "import",
+              "path": "../../utils/filters/filters-declarations"
+            }
           }
-        }
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": "The mode of the global filter (default SIMPLE)"
-      },
-      "attribute": "global-filter-mode",
-      "reflect": false,
-      "defaultValue": "KupGlobalFilterMode.SIMPLE"
-    },
-    "preventXScroll": {
-      "type": "boolean",
-      "mutable": false,
-      "complexType": {
-        "original": "boolean",
-        "resolved": "boolean",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [{
-            "name": "default",
-            "text": "false;"
-          }],
-        "text": "Experimental feature: when active, the tree will try to prevent horizontal overflowing elements by setting a width on the content of the table cells.\r\nIt works only on cells of the main column."
-      },
-      "attribute": "prevent-x-scroll",
-      "reflect": true,
-      "defaultValue": "false"
-    },
-    "removableColumns": {
-      "type": "boolean",
-      "mutable": false,
-      "complexType": {
-        "original": "boolean",
-        "resolved": "boolean",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": "Sets the possibility to remove the selected column."
-      },
-      "attribute": "removable-columns",
-      "reflect": false,
-      "defaultValue": "true"
-    },
-    "ripple": {
-      "type": "boolean",
-      "mutable": false,
-      "complexType": {
-        "original": "boolean",
-        "resolved": "boolean",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [{
-            "name": "default",
-            "text": "true"
-          }],
-        "text": "When enabled displays Material's ripple effect on nodes (only when no columns are displayed)."
-      },
-      "attribute": "ripple",
-      "reflect": false,
-      "defaultValue": "true"
-    },
-    "scrollOnHover": {
-      "type": "boolean",
-      "mutable": false,
-      "complexType": {
-        "original": "boolean",
-        "resolved": "boolean",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": "Activates the scroll on hover function."
-      },
-      "attribute": "scroll-on-hover",
-      "reflect": false,
-      "defaultValue": "false"
-    },
-    "selectedNode": {
-      "type": "unknown",
-      "mutable": true,
-      "complexType": {
-        "original": "TreeNodePath",
-        "resolved": "number[]",
-        "references": {
-          "TreeNodePath": {
-            "location": "import",
-            "path": "./kup-tree-declarations"
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": "List of filters set by the user."
+        },
+        "defaultValue": "{}"
+      },
+      "globalFilter": {
+        "type": "boolean",
+        "mutable": false,
+        "complexType": {
+          "original": "boolean",
+          "resolved": "boolean",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": "When set to true it activates the global filter."
+        },
+        "attribute": "global-filter",
+        "reflect": false,
+        "defaultValue": "false"
+      },
+      "globalFilterValue": {
+        "type": "string",
+        "mutable": true,
+        "complexType": {
+          "original": "string",
+          "resolved": "string",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": "The value of the global filter."
+        },
+        "attribute": "global-filter-value",
+        "reflect": true,
+        "defaultValue": "''"
+      },
+      "globalFilterMode": {
+        "type": "string",
+        "mutable": false,
+        "complexType": {
+          "original": "KupGlobalFilterMode",
+          "resolved": "KupGlobalFilterMode.HIGHLIGHT | KupGlobalFilterMode.SIMPLE",
+          "references": {
+            "KupGlobalFilterMode": {
+              "location": "import",
+              "path": "../../utils/filters/filters-declarations"
+            }
           }
-        }
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": "An array of integers containing the path to a selected child.\\\r\nGroups up the properties SelFirst, SelItem, SelName."
-      },
-      "defaultValue": "[]"
-    },
-    "showColumns": {
-      "type": "boolean",
-      "mutable": true,
-      "complexType": {
-        "original": "boolean",
-        "resolved": "boolean",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": "Shows the tree data as a table."
-      },
-      "attribute": "show-columns",
-      "reflect": false,
-      "defaultValue": "false"
-    },
-    "showFilters": {
-      "type": "boolean",
-      "mutable": false,
-      "complexType": {
-        "original": "boolean",
-        "resolved": "boolean",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": "When set to true enables the column filters."
-      },
-      "attribute": "show-filters",
-      "reflect": false,
-      "defaultValue": "true"
-    },
-    "showFooter": {
-      "type": "boolean",
-      "mutable": false,
-      "complexType": {
-        "original": "boolean",
-        "resolved": "boolean",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": "When set to true shows the footer."
-      },
-      "attribute": "show-footer",
-      "reflect": false,
-      "defaultValue": "false"
-    },
-    "showHeader": {
-      "type": "boolean",
-      "mutable": true,
-      "complexType": {
-        "original": "boolean",
-        "resolved": "boolean",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [{
-            "name": "see",
-            "text": "showColumns"
-          }],
-        "text": "Flag: shows the header of the tree when the tree is displayed as a table."
-      },
-      "attribute": "show-header",
-      "reflect": false,
-      "defaultValue": "false"
-    },
-    "showIcons": {
-      "type": "boolean",
-      "mutable": false,
-      "complexType": {
-        "original": "boolean",
-        "resolved": "boolean",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": "Shows the icons of the nodes."
-      },
-      "attribute": "show-icons",
-      "reflect": false,
-      "defaultValue": "true"
-    },
-    "stateId": {
-      "type": "string",
-      "mutable": false,
-      "complexType": {
-        "original": "string",
-        "resolved": "string",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": ""
-      },
-      "attribute": "state-id",
-      "reflect": false,
-      "defaultValue": "''"
-    },
-    "store": {
-      "type": "unknown",
-      "mutable": false,
-      "complexType": {
-        "original": "KupStore",
-        "resolved": "KupStore",
-        "references": {
-          "KupStore": {
-            "location": "import",
-            "path": "../kup-state/kup-store"
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": "The mode of the global filter (default SIMPLE)"
+        },
+        "attribute": "global-filter-mode",
+        "reflect": false,
+        "defaultValue": "KupGlobalFilterMode.SIMPLE"
+      },
+      "preventXScroll": {
+        "type": "boolean",
+        "mutable": false,
+        "complexType": {
+          "original": "boolean",
+          "resolved": "boolean",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [{
+              "name": "default",
+              "text": "false;"
+            }],
+          "text": "Experimental feature: when active, the tree will try to prevent horizontal overflowing elements by setting a width on the content of the table cells.\r\nIt works only on cells of the main column."
+        },
+        "attribute": "prevent-x-scroll",
+        "reflect": true,
+        "defaultValue": "false"
+      },
+      "removableColumns": {
+        "type": "boolean",
+        "mutable": false,
+        "complexType": {
+          "original": "boolean",
+          "resolved": "boolean",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": "Sets the possibility to remove the selected column."
+        },
+        "attribute": "removable-columns",
+        "reflect": false,
+        "defaultValue": "true"
+      },
+      "ripple": {
+        "type": "boolean",
+        "mutable": false,
+        "complexType": {
+          "original": "boolean",
+          "resolved": "boolean",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [{
+              "name": "default",
+              "text": "true"
+            }],
+          "text": "When enabled displays Material's ripple effect on nodes (only when no columns are displayed)."
+        },
+        "attribute": "ripple",
+        "reflect": false,
+        "defaultValue": "true"
+      },
+      "scrollOnHover": {
+        "type": "boolean",
+        "mutable": false,
+        "complexType": {
+          "original": "boolean",
+          "resolved": "boolean",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": "Activates the scroll on hover function."
+        },
+        "attribute": "scroll-on-hover",
+        "reflect": false,
+        "defaultValue": "false"
+      },
+      "showColumns": {
+        "type": "boolean",
+        "mutable": true,
+        "complexType": {
+          "original": "boolean",
+          "resolved": "boolean",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": "Shows the tree data as a table."
+        },
+        "attribute": "show-columns",
+        "reflect": false,
+        "defaultValue": "false"
+      },
+      "showFilters": {
+        "type": "boolean",
+        "mutable": false,
+        "complexType": {
+          "original": "boolean",
+          "resolved": "boolean",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": "When set to true enables the column filters."
+        },
+        "attribute": "show-filters",
+        "reflect": false,
+        "defaultValue": "true"
+      },
+      "showFooter": {
+        "type": "boolean",
+        "mutable": false,
+        "complexType": {
+          "original": "boolean",
+          "resolved": "boolean",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": "When set to true shows the footer."
+        },
+        "attribute": "show-footer",
+        "reflect": false,
+        "defaultValue": "false"
+      },
+      "showHeader": {
+        "type": "boolean",
+        "mutable": true,
+        "complexType": {
+          "original": "boolean",
+          "resolved": "boolean",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [{
+              "name": "see",
+              "text": "showColumns"
+            }],
+          "text": "Flag: shows the header of the tree when the tree is displayed as a table."
+        },
+        "attribute": "show-header",
+        "reflect": false,
+        "defaultValue": "false"
+      },
+      "showIcons": {
+        "type": "boolean",
+        "mutable": false,
+        "complexType": {
+          "original": "boolean",
+          "resolved": "boolean",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": "Shows the icons of the nodes."
+        },
+        "attribute": "show-icons",
+        "reflect": false,
+        "defaultValue": "true"
+      },
+      "stateId": {
+        "type": "string",
+        "mutable": false,
+        "complexType": {
+          "original": "string",
+          "resolved": "string",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": ""
+        },
+        "attribute": "state-id",
+        "reflect": false,
+        "defaultValue": "''"
+      },
+      "store": {
+        "type": "unknown",
+        "mutable": false,
+        "complexType": {
+          "original": "KupStore",
+          "resolved": "KupStore",
+          "references": {
+            "KupStore": {
+              "location": "import",
+              "path": "../kup-state/kup-store"
+            }
           }
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": ""
         }
       },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": ""
-      }
-    },
-    "useDynamicExpansion": {
-      "type": "boolean",
-      "mutable": false,
-      "complexType": {
-        "original": "boolean",
-        "resolved": "boolean",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [{
-            "name": "see",
-            "text": "dynamicExpansionCallback"
-          }],
-        "text": "When the component must use the dynamic expansion feature to open its nodes, it means that not all the nodes of the\r\ntree have been passed inside the data property.\r\n\r\nTherefore, when expanding a node, the tree must emit an event (or run a given callback)\r\nand wait for the child nodes to be downloaded from the server.\r\n\r\nFor more information:"
-      },
-      "attribute": "use-dynamic-expansion",
-      "reflect": false,
-      "defaultValue": "false"
-    },
-    "totals": {
-      "type": "unknown",
-      "mutable": true,
-      "complexType": {
-        "original": "TotalsMap",
-        "resolved": "TotalsMap",
-        "references": {
-          "TotalsMap": {
-            "location": "import",
-            "path": "./../kup-data-table/kup-data-table-declarations"
+      "useDynamicExpansion": {
+        "type": "boolean",
+        "mutable": false,
+        "complexType": {
+          "original": "boolean",
+          "resolved": "boolean",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [{
+              "name": "see",
+              "text": "dynamicExpansionCallback"
+            }],
+          "text": "When the component must use the dynamic expansion feature to open its nodes, it means that not all the nodes of the\r\ntree have been passed inside the data property.\r\n\r\nTherefore, when expanding a node, the tree must emit an event (or run a given callback)\r\nand wait for the child nodes to be downloaded from the server.\r\n\r\nFor more information:"
+        },
+        "attribute": "use-dynamic-expansion",
+        "reflect": false,
+        "defaultValue": "false"
+      },
+      "totals": {
+        "type": "unknown",
+        "mutable": true,
+        "complexType": {
+          "original": "TotalsMap",
+          "resolved": "TotalsMap",
+          "references": {
+            "TotalsMap": {
+              "location": "import",
+              "path": "./../kup-data-table/kup-data-table-declarations"
+            }
           }
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": "Defines the current totals options."
         }
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": "Defines the current totals options."
       }
-    }
-  }; }
-  static get states() { return {
-    "treeColumnVisible": {},
-    "openedTotalMenu": {},
-    "columnMenuAnchor": {},
-    "selectedNodeString": {},
-    "stateSwitcher": {}
-  }; }
-  static get events() { return [{
-      "method": "kupTreeNodeCollapse",
-      "name": "kup-tree-nodecollapse",
-      "bubbles": true,
-      "cancelable": false,
-      "composed": true,
-      "docs": {
-        "tags": [],
-        "text": "Fired when a KupTreeNode gets collapsed (closed)."
-      },
-      "complexType": {
-        "original": "KupTreeNodeCollapseEventPayload",
-        "resolved": "KupTreeNodeCollapseEventPayload",
-        "references": {
-          "KupTreeNodeCollapseEventPayload": {
-            "location": "import",
-            "path": "./kup-tree-declarations"
+    };
+  }
+  static get states() {
+    return {
+      "treeColumnVisible": {},
+      "openedTotalMenu": {},
+      "columnMenuAnchor": {},
+      "stateSwitcher": {},
+      "selectedNode": {}
+    };
+  }
+  static get events() {
+    return [{
+        "method": "kupTreeNodeCollapse",
+        "name": "kup-tree-nodecollapse",
+        "bubbles": true,
+        "cancelable": false,
+        "composed": true,
+        "docs": {
+          "tags": [],
+          "text": "Fired when a KupTreeNode gets collapsed (closed)."
+        },
+        "complexType": {
+          "original": "KupTreeNodeCollapseEventPayload",
+          "resolved": "KupTreeNodeCollapseEventPayload",
+          "references": {
+            "KupTreeNodeCollapseEventPayload": {
+              "location": "import",
+              "path": "./kup-tree-declarations"
+            }
           }
         }
-      }
-    }, {
-      "method": "kupTreeNodeExpand",
-      "name": "kup-tree-nodeexpand",
-      "bubbles": true,
-      "cancelable": false,
-      "composed": true,
-      "docs": {
-        "tags": [{
-            "name": "event",
-            "text": "kup-tree-nodeexpand"
-          }, {
-            "name": "type",
-            "text": "{object}"
-          }, {
-            "name": "property",
-            "text": "{TreeNodePath} treeNodePath - The array of indexes to retrieve the current treeNode inside the data prop."
-          }, {
-            "name": "property",
-            "text": "{KupTreeNode} treeNode - Reference to the KupTreeNode data object which is being expanded (passed through the data prop)."
-          }, {
-            "name": "property",
-            "text": "{boolean} usesDynamicExpansion - Flag to notify that the component is running in dynamicExpansion mode."
-          }, {
-            "name": "property",
-            "text": "{boolean} dynamicExpansionRequireChildren - Flag to notify that the current dynamicExpansion event\r\nrequires the parent component to add KupTreeNode children to the given KupTreeNode."
-          }, {
-            "name": "see",
-            "text": "useDynamicExpansion *"
-          }, {
-            "name": "see",
-            "text": "dynamicExpansionCallback *"
-          }, {
-            "name": "since",
-            "text": "1.0.0"
-          }],
-        "text": "Fired when a node expansion ion has been triggered.\r\nContains additional data when the tree is using the dynamicExpansion feature."
-      },
-      "complexType": {
-        "original": "KupTreeNodeExpandEventPayload",
-        "resolved": "KupTreeNodeExpandEventPayload",
-        "references": {
-          "KupTreeNodeExpandEventPayload": {
-            "location": "import",
-            "path": "./kup-tree-declarations"
+      }, {
+        "method": "kupTreeNodeExpand",
+        "name": "kup-tree-nodeexpand",
+        "bubbles": true,
+        "cancelable": false,
+        "composed": true,
+        "docs": {
+          "tags": [{
+              "name": "event",
+              "text": "kup-tree-nodeexpand"
+            }, {
+              "name": "type",
+              "text": "{object}"
+            }, {
+              "name": "property",
+              "text": "{TreeNodePath} treeNodePath - The array of indexes to retrieve the current treeNode inside the data prop."
+            }, {
+              "name": "property",
+              "text": "{KupTreeNode} treeNode - Reference to the KupTreeNode data object which is being expanded (passed through the data prop)."
+            }, {
+              "name": "property",
+              "text": "{boolean} usesDynamicExpansion - Flag to notify that the component is running in dynamicExpansion mode."
+            }, {
+              "name": "property",
+              "text": "{boolean} dynamicExpansionRequireChildren - Flag to notify that the current dynamicExpansion event\r\nrequires the parent component to add KupTreeNode children to the given KupTreeNode."
+            }, {
+              "name": "see",
+              "text": "useDynamicExpansion *"
+            }, {
+              "name": "see",
+              "text": "dynamicExpansionCallback *"
+            }, {
+              "name": "since",
+              "text": "1.0.0"
+            }],
+          "text": "Fired when a node expansion ion has been triggered.\r\nContains additional data when the tree is using the dynamicExpansion feature."
+        },
+        "complexType": {
+          "original": "KupTreeNodeExpandEventPayload",
+          "resolved": "KupTreeNodeExpandEventPayload",
+          "references": {
+            "KupTreeNodeExpandEventPayload": {
+              "location": "import",
+              "path": "./kup-tree-declarations"
+            }
           }
         }
-      }
-    }, {
-      "method": "kupTreeNodeSelected",
-      "name": "kup-tree-nodeselected",
-      "bubbles": true,
-      "cancelable": false,
-      "composed": true,
-      "docs": {
-        "tags": [],
-        "text": "Fired when a node of the tree has been selected"
-      },
-      "complexType": {
-        "original": "KupTreeNodeSelectedEventPayload",
-        "resolved": "KupTreeNodeSelectedEventPayload",
-        "references": {
-          "KupTreeNodeSelectedEventPayload": {
-            "location": "import",
-            "path": "./kup-tree-declarations"
+      }, {
+        "method": "kupTreeNodeSelected",
+        "name": "kup-tree-nodeselected",
+        "bubbles": true,
+        "cancelable": false,
+        "composed": true,
+        "docs": {
+          "tags": [],
+          "text": "Fired when a node of the tree has been selected"
+        },
+        "complexType": {
+          "original": "KupTreeNodeSelectedEventPayload",
+          "resolved": "KupTreeNodeSelectedEventPayload",
+          "references": {
+            "KupTreeNodeSelectedEventPayload": {
+              "location": "import",
+              "path": "./kup-tree-declarations"
+            }
           }
         }
-      }
-    }, {
-      "method": "kupTreeNodeButtonClick",
-      "name": "kup-tree-buttonclick",
-      "bubbles": true,
-      "cancelable": false,
-      "composed": true,
-      "docs": {
-        "tags": [],
-        "text": ""
-      },
-      "complexType": {
-        "original": "KupTreeNodeButtonClickEventPayload",
-        "resolved": "KupTreeNodeButtonClickEventPayload",
-        "references": {
-          "KupTreeNodeButtonClickEventPayload": {
-            "location": "import",
-            "path": "./kup-tree-declarations"
+      }, {
+        "method": "kupTreeNodeButtonClick",
+        "name": "kup-tree-buttonclick",
+        "bubbles": true,
+        "cancelable": false,
+        "composed": true,
+        "docs": {
+          "tags": [],
+          "text": ""
+        },
+        "complexType": {
+          "original": "KupTreeNodeButtonClickEventPayload",
+          "resolved": "KupTreeNodeButtonClickEventPayload",
+          "references": {
+            "KupTreeNodeButtonClickEventPayload": {
+              "location": "import",
+              "path": "./kup-tree-declarations"
+            }
           }
         }
-      }
-    }, {
-      "method": "kupTreeContextMenu",
-      "name": "kup-tree-contextmenu",
-      "bubbles": true,
-      "cancelable": false,
-      "composed": true,
-      "docs": {
-        "tags": [],
-        "text": "Generic right click event on tree."
-      },
-      "complexType": {
-        "original": "KupTreeContextMenuEventPayload",
-        "resolved": "KupTreeContextMenuEventPayload",
-        "references": {
-          "KupTreeContextMenuEventPayload": {
-            "location": "import",
-            "path": "./kup-tree-declarations"
+      }, {
+        "method": "kupTreeContextMenu",
+        "name": "kup-tree-contextmenu",
+        "bubbles": true,
+        "cancelable": false,
+        "composed": true,
+        "docs": {
+          "tags": [],
+          "text": "Generic right click event on tree."
+        },
+        "complexType": {
+          "original": "KupTreeContextMenuEventPayload",
+          "resolved": "KupTreeContextMenuEventPayload",
+          "references": {
+            "KupTreeContextMenuEventPayload": {
+              "location": "import",
+              "path": "./kup-tree-declarations"
+            }
           }
         }
-      }
-    }, {
-      "method": "kupTreeColumnMenu",
-      "name": "kup-tree-columnmenu",
-      "bubbles": true,
-      "cancelable": false,
-      "composed": true,
-      "docs": {
-        "tags": [],
-        "text": "When the column menu is being opened/closed."
-      },
-      "complexType": {
-        "original": "KupTreeColumnMenuEventPayload",
-        "resolved": "KupTreeColumnMenuEventPayload",
-        "references": {
-          "KupTreeColumnMenuEventPayload": {
-            "location": "import",
-            "path": "./kup-tree-declarations"
+      }, {
+        "method": "kupTreeColumnMenu",
+        "name": "kup-tree-columnmenu",
+        "bubbles": true,
+        "cancelable": false,
+        "composed": true,
+        "docs": {
+          "tags": [],
+          "text": "When the column menu is being opened/closed."
+        },
+        "complexType": {
+          "original": "KupTreeColumnMenuEventPayload",
+          "resolved": "KupTreeColumnMenuEventPayload",
+          "references": {
+            "KupTreeColumnMenuEventPayload": {
+              "location": "import",
+              "path": "./kup-tree-declarations"
+            }
           }
         }
-      }
-    }, {
-      "method": "kupDidLoad",
-      "name": "kup-tree-didload",
-      "bubbles": true,
-      "cancelable": false,
-      "composed": true,
-      "docs": {
-        "tags": [],
-        "text": ""
-      },
-      "complexType": {
-        "original": "KupEventPayload",
-        "resolved": "KupEventPayload",
-        "references": {
-          "KupEventPayload": {
-            "location": "import",
-            "path": "../../types/GenericTypes"
+      }, {
+        "method": "kupDidLoad",
+        "name": "kup-tree-didload",
+        "bubbles": true,
+        "cancelable": false,
+        "composed": true,
+        "docs": {
+          "tags": [],
+          "text": ""
+        },
+        "complexType": {
+          "original": "KupEventPayload",
+          "resolved": "KupEventPayload",
+          "references": {
+            "KupEventPayload": {
+              "location": "import",
+              "path": "../../types/GenericTypes"
+            }
           }
         }
-      }
-    }, {
-      "method": "kupDidUnload",
-      "name": "kup-tree-didunload",
-      "bubbles": true,
-      "cancelable": false,
-      "composed": true,
-      "docs": {
-        "tags": [],
-        "text": "Triggered when stop propagation event"
-      },
-      "complexType": {
-        "original": "KupEventPayload",
-        "resolved": "KupEventPayload",
-        "references": {
-          "KupEventPayload": {
-            "location": "import",
-            "path": "../../types/GenericTypes"
+      }, {
+        "method": "kupDidUnload",
+        "name": "kup-tree-didunload",
+        "bubbles": true,
+        "cancelable": false,
+        "composed": true,
+        "docs": {
+          "tags": [],
+          "text": "Triggered when stop propagation event"
+        },
+        "complexType": {
+          "original": "KupEventPayload",
+          "resolved": "KupEventPayload",
+          "references": {
+            "KupEventPayload": {
+              "location": "import",
+              "path": "../../types/GenericTypes"
+            }
           }
         }
-      }
-    }, {
-      "method": "kupTreeNodeDblClick",
-      "name": "kup-tree-nodedblclick",
-      "bubbles": true,
-      "cancelable": false,
-      "composed": true,
-      "docs": {
-        "tags": [],
-        "text": ""
-      },
-      "complexType": {
-        "original": "KupTreeNodeCollapseEventPayload",
-        "resolved": "KupTreeNodeCollapseEventPayload",
-        "references": {
-          "KupTreeNodeCollapseEventPayload": {
-            "location": "import",
-            "path": "./kup-tree-declarations"
+      }, {
+        "method": "kupTreeNodeDblClick",
+        "name": "kup-tree-nodedblclick",
+        "bubbles": true,
+        "cancelable": false,
+        "composed": true,
+        "docs": {
+          "tags": [],
+          "text": ""
+        },
+        "complexType": {
+          "original": "KupTreeNodeCollapseEventPayload",
+          "resolved": "KupTreeNodeCollapseEventPayload",
+          "references": {
+            "KupTreeNodeCollapseEventPayload": {
+              "location": "import",
+              "path": "./kup-tree-declarations"
+            }
           }
         }
-      }
-    }, {
-      "method": "kupTreeDynamicMassExpansion",
-      "name": "kup-tree-dynamicmassexpansion",
-      "bubbles": true,
-      "cancelable": false,
-      "composed": true,
-      "docs": {
-        "tags": [],
-        "text": ""
-      },
-      "complexType": {
-        "original": "KupTreeDynamicMassExpansionEventPayload",
-        "resolved": "KupTreeDynamicMassExpansionEventPayload",
-        "references": {
-          "KupTreeDynamicMassExpansionEventPayload": {
-            "location": "import",
-            "path": "./kup-tree-declarations"
+      }, {
+        "method": "kupTreeDynamicMassExpansion",
+        "name": "kup-tree-dynamicmassexpansion",
+        "bubbles": true,
+        "cancelable": false,
+        "composed": true,
+        "docs": {
+          "tags": [],
+          "text": ""
+        },
+        "complexType": {
+          "original": "KupTreeDynamicMassExpansionEventPayload",
+          "resolved": "KupTreeDynamicMassExpansionEventPayload",
+          "references": {
+            "KupTreeDynamicMassExpansionEventPayload": {
+              "location": "import",
+              "path": "./kup-tree-declarations"
+            }
           }
         }
-      }
-    }, {
-      "method": "kupColumnRemove",
-      "name": "kup-tree-columnremove",
-      "bubbles": true,
-      "cancelable": false,
-      "composed": true,
-      "docs": {
-        "tags": [],
-        "text": "Event fired when columns are removed (set to hidden)."
-      },
-      "complexType": {
-        "original": "KupTreeColumnRemoveEventPayload",
-        "resolved": "KupTreeColumnRemoveEventPayload",
-        "references": {
-          "KupTreeColumnRemoveEventPayload": {
-            "location": "import",
-            "path": "./kup-tree-declarations"
+      }, {
+        "method": "kupColumnRemove",
+        "name": "kup-tree-columnremove",
+        "bubbles": true,
+        "cancelable": false,
+        "composed": true,
+        "docs": {
+          "tags": [],
+          "text": "Event fired when columns are removed (set to hidden)."
+        },
+        "complexType": {
+          "original": "KupTreeColumnRemoveEventPayload",
+          "resolved": "KupTreeColumnRemoveEventPayload",
+          "references": {
+            "KupTreeColumnRemoveEventPayload": {
+              "location": "import",
+              "path": "./kup-tree-declarations"
+            }
           }
         }
-      }
-    }]; }
-  static get methods() { return {
-    "isEmpty": {
-      "complexType": {
-        "signature": "() => Promise<boolean>",
-        "parameters": [],
-        "references": {
-          "Promise": {
-            "location": "global"
-          }
+      }];
+  }
+  static get methods() {
+    return {
+      "getSelectedNode": {
+        "complexType": {
+          "signature": "() => Promise<TreeNodePath>",
+          "parameters": [],
+          "references": {
+            "Promise": {
+              "location": "global"
+            },
+            "TreeNodePath": {
+              "location": "import",
+              "path": "./kup-tree-declarations"
+            }
+          },
+          "return": "Promise<TreeNodePath>"
         },
-        "return": "Promise<boolean>"
+        "docs": {
+          "text": "This method will get the selected nodes of the component.",
+          "tags": []
+        }
       },
-      "docs": {
-        "text": "True if there aren't visible nodes",
-        "tags": []
-      }
-    },
-    "closeColumnMenu": {
-      "complexType": {
-        "signature": "() => Promise<void>",
-        "parameters": [],
-        "references": {
-          "Promise": {
-            "location": "global"
-          }
+      "setSelectedNode": {
+        "complexType": {
+          "signature": "(treeNodePath: string, emitEvent?: boolean) => Promise<void>",
+          "parameters": [{
+              "tags": [],
+              "text": ""
+            }, {
+              "tags": [{
+                  "name": "param",
+                  "text": "emitEvent - The event will always be emitted unless emitEvent is set to false."
+                }],
+              "text": "- The event will always be emitted unless emitEvent is set to false."
+            }],
+          "references": {
+            "Promise": {
+              "location": "global"
+            }
+          },
+          "return": "Promise<void>"
         },
-        "return": "Promise<void>"
+        "docs": {
+          "text": "This method will set the selected rows of the component.",
+          "tags": [{
+              "name": "param",
+              "text": "rowsIdentifiers - Array of ids (dataset) or indexes (rendered rows)."
+            }, {
+              "name": "param",
+              "text": "emitEvent - The event will always be emitted unless emitEvent is set to false."
+            }]
+        }
       },
-      "docs": {
-        "text": "Closes any opened column menu.",
-        "tags": []
-      }
-    },
-    "collapseAll": {
-      "complexType": {
-        "signature": "() => Promise<void>",
-        "parameters": [],
-        "references": {
-          "Promise": {
-            "location": "global"
-          }
+      "isEmpty": {
+        "complexType": {
+          "signature": "() => Promise<boolean>",
+          "parameters": [],
+          "references": {
+            "Promise": {
+              "location": "global"
+            }
+          },
+          "return": "Promise<boolean>"
         },
-        "return": "Promise<void>"
+        "docs": {
+          "text": "True if there aren't visible nodes",
+          "tags": []
+        }
       },
-      "docs": {
-        "text": "Collapses all nodes.",
-        "tags": []
-      }
-    },
-    "expandAll": {
-      "complexType": {
-        "signature": "() => Promise<void>",
-        "parameters": [],
-        "references": {
-          "Promise": {
-            "location": "global"
-          }
+      "closeColumnMenu": {
+        "complexType": {
+          "signature": "() => Promise<void>",
+          "parameters": [],
+          "references": {
+            "Promise": {
+              "location": "global"
+            }
+          },
+          "return": "Promise<void>"
         },
-        "return": "Promise<void>"
+        "docs": {
+          "text": "Closes any opened column menu.",
+          "tags": []
+        }
       },
-      "docs": {
-        "text": "Expands all nodes.",
-        "tags": []
-      }
-    },
-    "getProps": {
-      "complexType": {
-        "signature": "(descriptions?: boolean) => Promise<GenericObject>",
-        "parameters": [{
-            "tags": [{
-                "name": "param",
-                "text": "descriptions - When provided and true, the result will be the list of props with their description."
-              }],
-            "text": "- When provided and true, the result will be the list of props with their description."
-          }],
-        "references": {
-          "Promise": {
-            "location": "global"
+      "collapseAll": {
+        "complexType": {
+          "signature": "() => Promise<void>",
+          "parameters": [],
+          "references": {
+            "Promise": {
+              "location": "global"
+            }
           },
-          "GenericObject": {
-            "location": "import",
-            "path": "../../types/GenericTypes"
-          }
+          "return": "Promise<void>"
         },
-        "return": "Promise<GenericObject>"
+        "docs": {
+          "text": "Collapses all nodes.",
+          "tags": []
+        }
       },
-      "docs": {
-        "text": "Used to retrieve component's props values.",
-        "tags": [{
-            "name": "param",
-            "text": "descriptions - When provided and true, the result will be the list of props with their description."
-          }, {
-            "name": "returns",
-            "text": "List of props as object, each key will be a prop."
-          }]
-      }
-    },
-    "hideColumn": {
-      "complexType": {
-        "signature": "(column: KupDataColumn) => Promise<void>",
-        "parameters": [{
-            "tags": [{
-                "name": "param",
-                "text": "column - Column to hide."
-              }],
-            "text": "- Column to hide."
-          }],
-        "references": {
-          "Promise": {
-            "location": "global"
+      "expandAll": {
+        "complexType": {
+          "signature": "() => Promise<void>",
+          "parameters": [],
+          "references": {
+            "Promise": {
+              "location": "global"
+            }
           },
-          "KupDataColumn": {
-            "location": "import",
-            "path": "../../managers/kup-data/kup-data-declarations"
-          }
+          "return": "Promise<void>"
         },
-        "return": "Promise<void>"
+        "docs": {
+          "text": "Expands all nodes.",
+          "tags": []
+        }
       },
-      "docs": {
-        "text": "Hides the given column.",
-        "tags": [{
-            "name": "param",
-            "text": "column - Column to hide."
-          }]
-      }
-    },
-    "openColumnMenu": {
-      "complexType": {
-        "signature": "(column: string) => Promise<void>",
-        "parameters": [{
-            "tags": [{
-                "name": "param",
-                "text": "column - Name of the column."
-              }],
-            "text": "- Name of the column."
-          }],
-        "references": {
-          "Promise": {
-            "location": "global"
-          },
-          "CustomEvent": {
-            "location": "global"
+      "getProps": {
+        "complexType": {
+          "signature": "(descriptions?: boolean) => Promise<GenericObject>",
+          "parameters": [{
+              "tags": [{
+                  "name": "param",
+                  "text": "descriptions - When provided and true, the result will be the list of props with their description."
+                }],
+              "text": "- When provided and true, the result will be the list of props with their description."
+            }],
+          "references": {
+            "Promise": {
+              "location": "global"
+            },
+            "GenericObject": {
+              "location": "import",
+              "path": "../../types/GenericTypes"
+            }
           },
-          "KupEventPayload": {
-            "location": "import",
-            "path": "../../types/GenericTypes"
+          "return": "Promise<GenericObject>"
+        },
+        "docs": {
+          "text": "Used to retrieve component's props values.",
+          "tags": [{
+              "name": "param",
+              "text": "descriptions - When provided and true, the result will be the list of props with their description."
+            }, {
+              "name": "returns",
+              "text": "List of props as object, each key will be a prop."
+            }]
+        }
+      },
+      "hideColumn": {
+        "complexType": {
+          "signature": "(column: KupDataColumn) => Promise<void>",
+          "parameters": [{
+              "tags": [{
+                  "name": "param",
+                  "text": "column - Column to hide."
+                }],
+              "text": "- Column to hide."
+            }],
+          "references": {
+            "Promise": {
+              "location": "global"
+            },
+            "KupDataColumn": {
+              "location": "import",
+              "path": "../../managers/kup-data/kup-data-declarations"
+            }
           },
-          "KupCardEventPayload": {
-            "location": "import",
-            "path": "../kup-card/kup-card-declarations"
-          }
+          "return": "Promise<void>"
         },
-        "return": "Promise<void>"
+        "docs": {
+          "text": "Hides the given column.",
+          "tags": [{
+              "name": "param",
+              "text": "column - Column to hide."
+            }]
+        }
       },
-      "docs": {
-        "text": "Opens the column menu of the given column.",
-        "tags": [{
-            "name": "param",
-            "text": "column - Name of the column."
-          }]
-      }
-    },
-    "refresh": {
-      "complexType": {
-        "signature": "() => Promise<void>",
-        "parameters": [],
-        "references": {
-          "Promise": {
-            "location": "global"
-          }
+      "openColumnMenu": {
+        "complexType": {
+          "signature": "(column: string) => Promise<void>",
+          "parameters": [{
+              "tags": [{
+                  "name": "param",
+                  "text": "column - Name of the column."
+                }],
+              "text": "- Name of the column."
+            }],
+          "references": {
+            "Promise": {
+              "location": "global"
+            },
+            "CustomEvent": {
+              "location": "global"
+            },
+            "KupEventPayload": {
+              "location": "import",
+              "path": "../../types/GenericTypes"
+            },
+            "KupCardEventPayload": {
+              "location": "import",
+              "path": "../kup-card/kup-card-declarations"
+            }
+          },
+          "return": "Promise<void>"
         },
-        "return": "Promise<void>"
+        "docs": {
+          "text": "Opens the column menu of the given column.",
+          "tags": [{
+              "name": "param",
+              "text": "column - Name of the column."
+            }]
+        }
       },
-      "docs": {
-        "text": "This method is used to trigger a new render of the component.",
-        "tags": []
-      }
-    },
-    "resizeCallback": {
-      "complexType": {
-        "signature": "() => Promise<void>",
-        "parameters": [],
-        "references": {
-          "Promise": {
-            "location": "global"
-          }
+      "refresh": {
+        "complexType": {
+          "signature": "() => Promise<void>",
+          "parameters": [],
+          "references": {
+            "Promise": {
+              "location": "global"
+            }
+          },
+          "return": "Promise<void>"
         },
-        "return": "Promise<void>"
+        "docs": {
+          "text": "This method is used to trigger a new render of the component.",
+          "tags": []
+        }
       },
-      "docs": {
-        "text": "This method is invoked by KupManager whenever the component changes size.",
-        "tags": []
-      }
-    },
-    "setProps": {
-      "complexType": {
-        "signature": "(props: GenericObject) => Promise<void>",
-        "parameters": [{
-            "tags": [{
-                "name": "param",
-                "text": "props - Object containing props that will be set to the component."
-              }],
-            "text": "- Object containing props that will be set to the component."
-          }],
-        "references": {
-          "Promise": {
-            "location": "global"
+      "resizeCallback": {
+        "complexType": {
+          "signature": "() => Promise<void>",
+          "parameters": [],
+          "references": {
+            "Promise": {
+              "location": "global"
+            }
           },
-          "GenericObject": {
-            "location": "import",
-            "path": "../../types/GenericTypes"
-          }
+          "return": "Promise<void>"
         },
-        "return": "Promise<void>"
+        "docs": {
+          "text": "This method is invoked by KupManager whenever the component changes size.",
+          "tags": []
+        }
       },
-      "docs": {
-        "text": "Sets the props to the component.",
-        "tags": [{
-            "name": "param",
-            "text": "props - Object containing props that will be set to the component."
-          }]
+      "setProps": {
+        "complexType": {
+          "signature": "(props: GenericObject) => Promise<void>",
+          "parameters": [{
+              "tags": [{
+                  "name": "param",
+                  "text": "props - Object containing props that will be set to the component."
+                }],
+              "text": "- Object containing props that will be set to the component."
+            }],
+          "references": {
+            "Promise": {
+              "location": "global"
+            },
+            "GenericObject": {
+              "location": "import",
+              "path": "../../types/GenericTypes"
+            }
+          },
+          "return": "Promise<void>"
+        },
+        "docs": {
+          "text": "Sets the props to the component.",
+          "tags": [{
+              "name": "param",
+              "text": "props - Object containing props that will be set to the component."
+            }]
+        }
       }
-    }
-  }; }
+    };
+  }
   static get elementRef() { return "rootElement"; }
-  static get watchers() { return [{
-      "propName": "data",
-      "methodName": "enrichDataWhenChanged"
-    }, {
-      "propName": "expanded",
-      "methodName": "enrichStructureStateWhenChanged"
-    }, {
-      "propName": "selectedNode",
-      "methodName": "selectedNodeToStr"
-    }]; }
+  static get watchers() {
+    return [{
+        "propName": "data",
+        "methodName": "enrichDataWhenChanged"
+      }, {
+        "propName": "expanded",
+        "methodName": "enrichStructureStateWhenChanged"
+      }];
+  }
 }