@apia/tree 0.2.4 → 0.3.2

package/dist/index.js

@@ -3,7 +3,7 @@ import { useMount, useDebounceFn, useUnmount } from 'ahooks';
 import React, { useState, useEffect, memo } from 'react';
 import { shallowEqual } from 'react-redux';
 import { makeStyledComponent, Spinner, getVariant, Box } from '@apia/theme';
-import { EventEmitter, PropsStore, addBoundary, getSpecificParent, usePropsSelector, formatMessage, useLatest } from '@apia/util';
+import { EventEmitter, PropsStore, addBoundary, getSpecificParent, usePropsSelector, formatMessage, useLatest, HashedEventEmitter } from '@apia/util';
 import { IconButton } from '@apia/components';
 import { Icon } from '@apia/icons';
 import { uniqueId } from 'lodash-es';
@@ -228,25 +228,25 @@ const selectAllNodesBetweenTwoNodes = (handler, oneNodeId, anotherNodeId, avoidF
   }
 };
 
-var __defProp$7 = Object.defineProperty;
-var __defProps$6 = Object.defineProperties;
-var __getOwnPropDescs$6 = Object.getOwnPropertyDescriptors;
-var __getOwnPropSymbols$7 = Object.getOwnPropertySymbols;
-var __hasOwnProp$7 = Object.prototype.hasOwnProperty;
-var __propIsEnum$7 = Object.prototype.propertyIsEnumerable;
-var __defNormalProp$7 = (obj, key, value) => key in obj ? __defProp$7(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
-var __spreadValues$7 = (a, b) => {
+var __defProp$8 = Object.defineProperty;
+var __defProps$7 = Object.defineProperties;
+var __getOwnPropDescs$7 = Object.getOwnPropertyDescriptors;
+var __getOwnPropSymbols$8 = Object.getOwnPropertySymbols;
+var __hasOwnProp$8 = Object.prototype.hasOwnProperty;
+var __propIsEnum$8 = Object.prototype.propertyIsEnumerable;
+var __defNormalProp$8 = (obj, key, value) => key in obj ? __defProp$8(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __spreadValues$8 = (a, b) => {
   for (var prop in b || (b = {}))
-    if (__hasOwnProp$7.call(b, prop))
-      __defNormalProp$7(a, prop, b[prop]);
-  if (__getOwnPropSymbols$7)
-    for (var prop of __getOwnPropSymbols$7(b)) {
-      if (__propIsEnum$7.call(b, prop))
-        __defNormalProp$7(a, prop, b[prop]);
+    if (__hasOwnProp$8.call(b, prop))
+      __defNormalProp$8(a, prop, b[prop]);
+  if (__getOwnPropSymbols$8)
+    for (var prop of __getOwnPropSymbols$8(b)) {
+      if (__propIsEnum$8.call(b, prop))
+        __defNormalProp$8(a, prop, b[prop]);
     }
   return a;
 };
-var __spreadProps$6 = (a, b) => __defProps$6(a, __getOwnPropDescs$6(b));
+var __spreadProps$7 = (a, b) => __defProps$7(a, __getOwnPropDescs$7(b));
 const trees = {};
 const treesRecordEmitter = new class TreesRecordEmitter extends EventEmitter {
   emit(eventName, params) {
@@ -305,7 +305,7 @@ class TreeDataController extends EventEmitter {
     this.initRoot();
   }
   get configuration() {
-    return __spreadValues$7({}, this._configuration);
+    return __spreadValues$8({}, this._configuration);
   }
   get state() {
     return this.propsStore.getFieldProps(
@@ -320,7 +320,7 @@ class TreeDataController extends EventEmitter {
   }
   append(node) {
     var _a, _b, _c, _d, _e;
-    const newNode = __spreadProps$6(__spreadValues$7({}, node), { nodeProps: (_a = node.nodeProps) != null ? _a : {} });
+    const newNode = __spreadProps$7(__spreadValues$8({}, node), { nodeProps: (_a = node.nodeProps) != null ? _a : {} });
     let father;
     if (newNode.parentId !== void 0 && ((_b = this.propsStore.getFieldProps(newNode.parentId)) == null ? void 0 : _b.children)) {
       father = newNode.parentId;
@@ -333,7 +333,7 @@ class TreeDataController extends EventEmitter {
     }
     this.propsStore.updateField(
       newNode.id,
-      __spreadProps$6(__spreadValues$7({}, newNode), {
+      __spreadProps$7(__spreadValues$8({}, newNode), {
         children: (_c = newNode.children) != null ? _c : []
       }),
       { isUrgent: true }
@@ -355,11 +355,12 @@ class TreeDataController extends EventEmitter {
         children: [
           ...this.propsStore.getFieldProps(father).children,
           newNode.id
-        ]
+        ],
+        hasLoaded: true
       },
-      { noEmit: !((_d = this._configuration.current) == null ? void 0 : _d.emitUpdates) }
+      { noEmit: ((_d = this._configuration.current) == null ? void 0 : _d.emitUpdates) === false }
     );
-    if (!((_e = this._configuration.current) == null ? void 0 : _e.emitUpdates))
+    if (((_e = this._configuration.current) == null ? void 0 : _e.emitUpdates) === false)
       this.nonEmittedUpdates.push(father);
     if (!this.hasApendedFirstChild) {
       this.hasApendedFirstChild = true;
@@ -376,6 +377,13 @@ class TreeDataController extends EventEmitter {
     this.config({ emitUpdates: false });
     this.setState({ isLoading: true }, { isUrgent: true });
   }
+  getNodesRecursive(nodeId = "root") {
+    const node = this.propsStore.getFieldProps(nodeId);
+    return node.children.reduce(
+      (prev, current) => [...prev, ...this.getNodesRecursive(current)],
+      [...node.children]
+    );
+  }
   /**
    * Cuando se quieren agregar muchos nodos, es conveniente llamar primero al
    * método batchInit y luego de finalizar, al método batchFinish()
@@ -383,7 +391,7 @@ class TreeDataController extends EventEmitter {
   batchFinish() {
     this.config({ emitUpdates: true });
     setTimeout(() => this.setState({ isLoading: false }), 0);
-    const children = [...this.getNodesIds()];
+    const children = [...this.getNodesRecursive()];
     const deleteNodes = this.previousNodes.filter(
       (current) => !children.find((search) => search === current)
     );
@@ -393,7 +401,7 @@ class TreeDataController extends EventEmitter {
   }
   config(newConf) {
     var _a;
-    if (!((_a = this._configuration.current) == null ? void 0 : _a.emitUpdates) && newConf.emitUpdates) {
+    if (((_a = this._configuration.current) == null ? void 0 : _a.emitUpdates) === false && newConf.emitUpdates !== false) {
       this.nonEmittedUpdates.forEach(
         (current) => this.propsStore.updateField(current, {
           children: [...this.propsStore.getFieldProps(current).children]
@@ -429,7 +437,7 @@ class TreeDataController extends EventEmitter {
     };
   }
   getNodesAsArray() {
-    const allFields = __spreadValues$7({}, this.propsStore.fields);
+    const allFields = __spreadValues$8({}, this.propsStore.fields);
     delete allFields[this.stateKey];
     delete allFields.root;
     return Object.values(allFields);
@@ -439,7 +447,7 @@ class TreeDataController extends EventEmitter {
    * árbol
    */
   getNodesIds() {
-    const allFields = __spreadValues$7({}, this.propsStore.fields);
+    const allFields = __spreadValues$8({}, this.propsStore.fields);
     delete allFields[this.stateKey];
     delete allFields.root;
     return Object.keys(allFields);
@@ -758,7 +766,7 @@ class TreeDataController extends EventEmitter {
   setState(updateProps, conf) {
     this.propsStore.updateField(
       this.stateKey,
-      __spreadValues$7(__spreadValues$7({}, this.state), updateProps),
+      __spreadValues$8(__spreadValues$8({}, this.state), updateProps),
       conf
     );
   }
@@ -819,7 +827,7 @@ function useTreeSelector(handler, configuration) {
   var _a;
   return usePropsSelector(
     (_a = handler == null ? void 0 : handler.stateKey) != null ? _a : "__NO__TREE__KEY__",
-    __spreadValues$7({
+    __spreadValues$8({
       propsStore: handler == null ? void 0 : handler.propsStore
     }, configuration)
   );
@@ -829,32 +837,32 @@ function useTreeSelectorByName(treeName, configuration) {
   const handler = useTreeDataController(treeName);
   const selection = usePropsSelector(
     (_a = handler == null ? void 0 : handler.stateKey) != null ? _a : "__NO__TREE__KEY__",
-    __spreadValues$7({
+    __spreadValues$8({
       propsStore: handler == null ? void 0 : handler.propsStore
     }, configuration)
   );
   return { selection, handler };
 }
 
-var __defProp$6 = Object.defineProperty;
-var __defProps$5 = Object.defineProperties;
-var __getOwnPropDescs$5 = Object.getOwnPropertyDescriptors;
-var __getOwnPropSymbols$6 = Object.getOwnPropertySymbols;
-var __hasOwnProp$6 = Object.prototype.hasOwnProperty;
-var __propIsEnum$6 = Object.prototype.propertyIsEnumerable;
-var __defNormalProp$6 = (obj, key, value) => key in obj ? __defProp$6(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
-var __spreadValues$6 = (a, b) => {
+var __defProp$7 = Object.defineProperty;
+var __defProps$6 = Object.defineProperties;
+var __getOwnPropDescs$6 = Object.getOwnPropertyDescriptors;
+var __getOwnPropSymbols$7 = Object.getOwnPropertySymbols;
+var __hasOwnProp$7 = Object.prototype.hasOwnProperty;
+var __propIsEnum$7 = Object.prototype.propertyIsEnumerable;
+var __defNormalProp$7 = (obj, key, value) => key in obj ? __defProp$7(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __spreadValues$7 = (a, b) => {
   for (var prop in b || (b = {}))
-    if (__hasOwnProp$6.call(b, prop))
-      __defNormalProp$6(a, prop, b[prop]);
-  if (__getOwnPropSymbols$6)
-    for (var prop of __getOwnPropSymbols$6(b)) {
-      if (__propIsEnum$6.call(b, prop))
-        __defNormalProp$6(a, prop, b[prop]);
+    if (__hasOwnProp$7.call(b, prop))
+      __defNormalProp$7(a, prop, b[prop]);
+  if (__getOwnPropSymbols$7)
+    for (var prop of __getOwnPropSymbols$7(b)) {
+      if (__propIsEnum$7.call(b, prop))
+        __defNormalProp$7(a, prop, b[prop]);
     }
   return a;
 };
-var __spreadProps$5 = (a, b) => __defProps$5(a, __getOwnPropDescs$5(b));
+var __spreadProps$6 = (a, b) => __defProps$6(a, __getOwnPropDescs$6(b));
 function getActiveDescendantName(treeName, nodeId) {
   return `${treeName}__${nodeId}`;
 }
@@ -864,7 +872,7 @@ function getDomProps(_, treeName, type, par) {
     case "node": {
       const node = par;
       const tree = getTreeDataController(treeName);
-      return __spreadProps$5(__spreadValues$6({
+      return __spreadProps$6(__spreadValues$7({
         "aria-disabled": node.isDisabled,
         "aria-expanded": node.isLeaf ? void 0 : !!node.isExpanded,
         "aria-label": node.label
@@ -889,25 +897,25 @@ function getDomProps(_, treeName, type, par) {
   }
 }
 
-var __defProp$5 = Object.defineProperty;
-var __defProps$4 = Object.defineProperties;
-var __getOwnPropDescs$4 = Object.getOwnPropertyDescriptors;
-var __getOwnPropSymbols$5 = Object.getOwnPropertySymbols;
-var __hasOwnProp$5 = Object.prototype.hasOwnProperty;
-var __propIsEnum$5 = Object.prototype.propertyIsEnumerable;
-var __defNormalProp$5 = (obj, key, value) => key in obj ? __defProp$5(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
-var __spreadValues$5 = (a, b) => {
+var __defProp$6 = Object.defineProperty;
+var __defProps$5 = Object.defineProperties;
+var __getOwnPropDescs$5 = Object.getOwnPropertyDescriptors;
+var __getOwnPropSymbols$6 = Object.getOwnPropertySymbols;
+var __hasOwnProp$6 = Object.prototype.hasOwnProperty;
+var __propIsEnum$6 = Object.prototype.propertyIsEnumerable;
+var __defNormalProp$6 = (obj, key, value) => key in obj ? __defProp$6(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __spreadValues$6 = (a, b) => {
   for (var prop in b || (b = {}))
-    if (__hasOwnProp$5.call(b, prop))
-      __defNormalProp$5(a, prop, b[prop]);
-  if (__getOwnPropSymbols$5)
-    for (var prop of __getOwnPropSymbols$5(b)) {
-      if (__propIsEnum$5.call(b, prop))
-        __defNormalProp$5(a, prop, b[prop]);
+    if (__hasOwnProp$6.call(b, prop))
+      __defNormalProp$6(a, prop, b[prop]);
+  if (__getOwnPropSymbols$6)
+    for (var prop of __getOwnPropSymbols$6(b)) {
+      if (__propIsEnum$6.call(b, prop))
+        __defNormalProp$6(a, prop, b[prop]);
     }
   return a;
 };
-var __spreadProps$4 = (a, b) => __defProps$4(a, __getOwnPropDescs$4(b));
+var __spreadProps$5 = (a, b) => __defProps$5(a, __getOwnPropDescs$5(b));
 const styles = {
   height: "iconmd",
   width: "iconmd",
@@ -920,26 +928,26 @@ const LoaderSpinner = makeStyledComponent(
   ({ className }) => {
     return /* @__PURE__ */ jsx(
       Spinner,
-      __spreadProps$4(__spreadValues$5({}, getVariant("layout.common.components.loaderSpinner")), {
+      __spreadProps$5(__spreadValues$6({}, getVariant("layout.common.components.loaderSpinner")), {
         className
       })
     );
   }
 );
 
-var __defProp$4 = Object.defineProperty;
-var __getOwnPropSymbols$4 = Object.getOwnPropertySymbols;
-var __hasOwnProp$4 = Object.prototype.hasOwnProperty;
-var __propIsEnum$4 = Object.prototype.propertyIsEnumerable;
-var __defNormalProp$4 = (obj, key, value) => key in obj ? __defProp$4(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
-var __spreadValues$4 = (a, b) => {
+var __defProp$5 = Object.defineProperty;
+var __getOwnPropSymbols$5 = Object.getOwnPropertySymbols;
+var __hasOwnProp$5 = Object.prototype.hasOwnProperty;
+var __propIsEnum$5 = Object.prototype.propertyIsEnumerable;
+var __defNormalProp$5 = (obj, key, value) => key in obj ? __defProp$5(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __spreadValues$5 = (a, b) => {
   for (var prop in b || (b = {}))
-    if (__hasOwnProp$4.call(b, prop))
-      __defNormalProp$4(a, prop, b[prop]);
-  if (__getOwnPropSymbols$4)
-    for (var prop of __getOwnPropSymbols$4(b)) {
-      if (__propIsEnum$4.call(b, prop))
-        __defNormalProp$4(a, prop, b[prop]);
+    if (__hasOwnProp$5.call(b, prop))
+      __defNormalProp$5(a, prop, b[prop]);
+  if (__getOwnPropSymbols$5)
+    for (var prop of __getOwnPropSymbols$5(b)) {
+      if (__propIsEnum$5.call(b, prop))
+        __defNormalProp$5(a, prop, b[prop]);
     }
   return a;
 };
@@ -954,7 +962,7 @@ const SearchLabel = ({
     formatMessage(window.LBL_FILTERING_BY, { TOK1: searchString }),
     /* @__PURE__ */ jsx(
       IconButton,
-      __spreadValues$4({
+      __spreadValues$5({
         icon: "Close",
         "aria-label": window.LBL_DELETE_FILTER,
         onClick: onDelete,
@@ -989,7 +997,8 @@ const DefaultIconRenderer = (props) => {
     {
       name: props.icon,
       title: "",
-      size: (_a = props.iconSize) != null ? _a : "iconSm"
+      size: (_a = props.iconSize) != null ? _a : "iconSm",
+      className: "tree__node__icon"
     }
   );
 };
@@ -1002,25 +1011,25 @@ const Spacer = ({ level }) => {
   return /* @__PURE__ */ jsx(Fragment, { children: Array(level).fill("").map((_, i) => i).map((current) => /* @__PURE__ */ jsx(Box, { className: "spacer" }, current)) });
 };
 
-var __defProp$3 = Object.defineProperty;
-var __defProps$3 = Object.defineProperties;
-var __getOwnPropDescs$3 = Object.getOwnPropertyDescriptors;
-var __getOwnPropSymbols$3 = Object.getOwnPropertySymbols;
-var __hasOwnProp$3 = Object.prototype.hasOwnProperty;
-var __propIsEnum$3 = Object.prototype.propertyIsEnumerable;
-var __defNormalProp$3 = (obj, key, value) => key in obj ? __defProp$3(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
-var __spreadValues$3 = (a, b) => {
+var __defProp$4 = Object.defineProperty;
+var __defProps$4 = Object.defineProperties;
+var __getOwnPropDescs$4 = Object.getOwnPropertyDescriptors;
+var __getOwnPropSymbols$4 = Object.getOwnPropertySymbols;
+var __hasOwnProp$4 = Object.prototype.hasOwnProperty;
+var __propIsEnum$4 = Object.prototype.propertyIsEnumerable;
+var __defNormalProp$4 = (obj, key, value) => key in obj ? __defProp$4(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __spreadValues$4 = (a, b) => {
   for (var prop in b || (b = {}))
-    if (__hasOwnProp$3.call(b, prop))
-      __defNormalProp$3(a, prop, b[prop]);
-  if (__getOwnPropSymbols$3)
-    for (var prop of __getOwnPropSymbols$3(b)) {
-      if (__propIsEnum$3.call(b, prop))
-        __defNormalProp$3(a, prop, b[prop]);
+    if (__hasOwnProp$4.call(b, prop))
+      __defNormalProp$4(a, prop, b[prop]);
+  if (__getOwnPropSymbols$4)
+    for (var prop of __getOwnPropSymbols$4(b)) {
+      if (__propIsEnum$4.call(b, prop))
+        __defNormalProp$4(a, prop, b[prop]);
     }
   return a;
 };
-var __spreadProps$3 = (a, b) => __defProps$3(a, __getOwnPropDescs$3(b));
+var __spreadProps$4 = (a, b) => __defProps$4(a, __getOwnPropDescs$4(b));
 const TreeItemLabel = ({ level, treeKey }) => {
   var _a, _b, _c;
   const {
@@ -1063,19 +1072,19 @@ const TreeItemLabel = ({ level, treeKey }) => {
           {
             className: "tree__expandIcon",
             onClick: handleToggle,
-            name: props.isExpanded ? "MinusFilled" : "PlusFilled",
+            name: props.isExpanded ? "ArrowDownThin" : "ArrowRightThin",
             title: "",
-            size: "iconSm"
+            size: 20
           }
         ) }),
-        props.icon && IconRenderer && /* @__PURE__ */ jsx(IconRenderer, __spreadValues$3({}, props)),
+        props.icon && IconRenderer && /* @__PURE__ */ jsx(IconRenderer, __spreadValues$4({}, props)),
         /* @__PURE__ */ jsx(
           Box,
           {
             as: "span",
             className: "tree__nodeItemLabelRenderer",
             onClick: toggleNodesOnLabelClick !== false ? onClick : void 0,
-            children: /* @__PURE__ */ jsx(Renderer, __spreadProps$3(__spreadValues$3({}, props), { level }))
+            children: /* @__PURE__ */ jsx(Renderer, __spreadProps$4(__spreadValues$4({}, props), { level }))
           }
         )
       ]
@@ -1084,25 +1093,25 @@ const TreeItemLabel = ({ level, treeKey }) => {
 };
 var TreeItemLabel$1 = React.memo(TreeItemLabel);
 
-var __defProp$2 = Object.defineProperty;
-var __defProps$2 = Object.defineProperties;
-var __getOwnPropDescs$2 = Object.getOwnPropertyDescriptors;
-var __getOwnPropSymbols$2 = Object.getOwnPropertySymbols;
-var __hasOwnProp$2 = Object.prototype.hasOwnProperty;
-var __propIsEnum$2 = Object.prototype.propertyIsEnumerable;
-var __defNormalProp$2 = (obj, key, value) => key in obj ? __defProp$2(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
-var __spreadValues$2 = (a, b) => {
+var __defProp$3 = Object.defineProperty;
+var __defProps$3 = Object.defineProperties;
+var __getOwnPropDescs$3 = Object.getOwnPropertyDescriptors;
+var __getOwnPropSymbols$3 = Object.getOwnPropertySymbols;
+var __hasOwnProp$3 = Object.prototype.hasOwnProperty;
+var __propIsEnum$3 = Object.prototype.propertyIsEnumerable;
+var __defNormalProp$3 = (obj, key, value) => key in obj ? __defProp$3(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __spreadValues$3 = (a, b) => {
   for (var prop in b || (b = {}))
-    if (__hasOwnProp$2.call(b, prop))
-      __defNormalProp$2(a, prop, b[prop]);
-  if (__getOwnPropSymbols$2)
-    for (var prop of __getOwnPropSymbols$2(b)) {
-      if (__propIsEnum$2.call(b, prop))
-        __defNormalProp$2(a, prop, b[prop]);
+    if (__hasOwnProp$3.call(b, prop))
+      __defNormalProp$3(a, prop, b[prop]);
+  if (__getOwnPropSymbols$3)
+    for (var prop of __getOwnPropSymbols$3(b)) {
+      if (__propIsEnum$3.call(b, prop))
+        __defNormalProp$3(a, prop, b[prop]);
     }
   return a;
 };
-var __spreadProps$2 = (a, b) => __defProps$2(a, __getOwnPropDescs$2(b));
+var __spreadProps$3 = (a, b) => __defProps$3(a, __getOwnPropDescs$3(b));
 const TreeItem = ({ level, treeKey }) => {
   const { handler, name, forceUpdate, treeProps } = useTreeContext();
   const props = usePropsSelector(treeKey, {
@@ -1121,9 +1130,9 @@ const TreeItem = ({ level, treeKey }) => {
     },
     [props.children, handler.propsStore]
   );
-  return /* @__PURE__ */ jsx(Fragment, { children: /* @__PURE__ */ jsxs(Box, __spreadProps$2(__spreadValues$2({ as: "li" }, getDomProps(treeProps, name, "node", props)), { children: [
+  return /* @__PURE__ */ jsx(Fragment, { children: /* @__PURE__ */ jsxs(Box, __spreadProps$3(__spreadValues$3({ as: "li" }, getDomProps(treeProps, name, "node", props)), { children: [
     /* @__PURE__ */ jsx(TreeItemLabel$1, { level, treeKey }),
-    /* @__PURE__ */ jsx(
+    props.isExpanded && /* @__PURE__ */ jsx(
       TreeItemChildren$1,
       {
         forceUpdate,
@@ -1136,33 +1145,33 @@ const TreeItem = ({ level, treeKey }) => {
 };
 var TreeItem$1 = React.memo(TreeItem);
 
-var __defProp$1 = Object.defineProperty;
-var __defProps$1 = Object.defineProperties;
-var __getOwnPropDescs$1 = Object.getOwnPropertyDescriptors;
-var __getOwnPropSymbols$1 = Object.getOwnPropertySymbols;
-var __hasOwnProp$1 = Object.prototype.hasOwnProperty;
-var __propIsEnum$1 = Object.prototype.propertyIsEnumerable;
-var __defNormalProp$1 = (obj, key, value) => key in obj ? __defProp$1(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
-var __spreadValues$1 = (a, b) => {
+var __defProp$2 = Object.defineProperty;
+var __defProps$2 = Object.defineProperties;
+var __getOwnPropDescs$2 = Object.getOwnPropertyDescriptors;
+var __getOwnPropSymbols$2 = Object.getOwnPropertySymbols;
+var __hasOwnProp$2 = Object.prototype.hasOwnProperty;
+var __propIsEnum$2 = Object.prototype.propertyIsEnumerable;
+var __defNormalProp$2 = (obj, key, value) => key in obj ? __defProp$2(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __spreadValues$2 = (a, b) => {
   for (var prop in b || (b = {}))
-    if (__hasOwnProp$1.call(b, prop))
-      __defNormalProp$1(a, prop, b[prop]);
-  if (__getOwnPropSymbols$1)
-    for (var prop of __getOwnPropSymbols$1(b)) {
-      if (__propIsEnum$1.call(b, prop))
-        __defNormalProp$1(a, prop, b[prop]);
+    if (__hasOwnProp$2.call(b, prop))
+      __defNormalProp$2(a, prop, b[prop]);
+  if (__getOwnPropSymbols$2)
+    for (var prop of __getOwnPropSymbols$2(b)) {
+      if (__propIsEnum$2.call(b, prop))
+        __defNormalProp$2(a, prop, b[prop]);
     }
   return a;
 };
-var __spreadProps$1 = (a, b) => __defProps$1(a, __getOwnPropDescs$1(b));
+var __spreadProps$2 = (a, b) => __defProps$2(a, __getOwnPropDescs$2(b));
 var __objRest = (source, exclude) => {
   var target = {};
   for (var prop in source)
-    if (__hasOwnProp$1.call(source, prop) && exclude.indexOf(prop) < 0)
+    if (__hasOwnProp$2.call(source, prop) && exclude.indexOf(prop) < 0)
       target[prop] = source[prop];
-  if (source != null && __getOwnPropSymbols$1)
-    for (var prop of __getOwnPropSymbols$1(source)) {
-      if (exclude.indexOf(prop) < 0 && __propIsEnum$1.call(source, prop))
+  if (source != null && __getOwnPropSymbols$2)
+    for (var prop of __getOwnPropSymbols$2(source)) {
+      if (exclude.indexOf(prop) < 0 && __propIsEnum$2.call(source, prop))
         target[prop] = source[prop];
     }
   return target;
@@ -1170,7 +1179,7 @@ var __objRest = (source, exclude) => {
 const TreeItemChildren = React.forwardRef((_a, ref) => {
   var _b = _a, { level, nodes, forceUpdate } = _b, props = __objRest(_b, ["level", "nodes", "forceUpdate"]);
   const { handler } = useTreeContext();
-  return /* @__PURE__ */ jsx(Box, __spreadProps$1(__spreadValues$1({ ref, as: "ul" }, props), { children: nodes == null ? void 0 : nodes.map((current) => {
+  return /* @__PURE__ */ jsx(Box, __spreadProps$2(__spreadValues$2({ ref, as: "ul" }, props), { children: nodes == null ? void 0 : nodes.map((current) => {
     const currentProps = handler.propsStore.getFieldProps(current.id);
     if (!currentProps)
       return null;
@@ -1312,30 +1321,30 @@ function useTreeData({ name, treeProps }) {
   };
 }
 
-var __defProp = Object.defineProperty;
-var __defProps = Object.defineProperties;
-var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
-var __getOwnPropSymbols = Object.getOwnPropertySymbols;
-var __hasOwnProp = Object.prototype.hasOwnProperty;
-var __propIsEnum = Object.prototype.propertyIsEnumerable;
-var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
-var __spreadValues = (a, b) => {
+var __defProp$1 = Object.defineProperty;
+var __defProps$1 = Object.defineProperties;
+var __getOwnPropDescs$1 = Object.getOwnPropertyDescriptors;
+var __getOwnPropSymbols$1 = Object.getOwnPropertySymbols;
+var __hasOwnProp$1 = Object.prototype.hasOwnProperty;
+var __propIsEnum$1 = Object.prototype.propertyIsEnumerable;
+var __defNormalProp$1 = (obj, key, value) => key in obj ? __defProp$1(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __spreadValues$1 = (a, b) => {
   for (var prop in b || (b = {}))
-    if (__hasOwnProp.call(b, prop))
-      __defNormalProp(a, prop, b[prop]);
-  if (__getOwnPropSymbols)
-    for (var prop of __getOwnPropSymbols(b)) {
-      if (__propIsEnum.call(b, prop))
-        __defNormalProp(a, prop, b[prop]);
+    if (__hasOwnProp$1.call(b, prop))
+      __defNormalProp$1(a, prop, b[prop]);
+  if (__getOwnPropSymbols$1)
+    for (var prop of __getOwnPropSymbols$1(b)) {
+      if (__propIsEnum$1.call(b, prop))
+        __defNormalProp$1(a, prop, b[prop]);
     }
   return a;
 };
-var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
+var __spreadProps$1 = (a, b) => __defProps$1(a, __getOwnPropDescs$1(b));
 const Tree = (props) => {
   var _a, _b, _c;
   const { data, handler, keyHandler } = useTreeData({
     name: props.name,
-    treeProps: __spreadValues({}, props)
+    treeProps: __spreadValues$1({}, props)
   });
   const [isLoading, setIsLoading] = React.useState(false);
   const [currentSearchString, setCurrentSearchString] = React.useState("");
@@ -1411,7 +1420,7 @@ const Tree = (props) => {
   }, [handler, props, data.forceUpdate]);
   return /* @__PURE__ */ jsx(TreeContextProvider, { value: contextValue, children: /* @__PURE__ */ jsxs(
     Box,
-    __spreadProps(__spreadValues({
+    __spreadProps$1(__spreadValues$1({
       className: `tree ${(_a = props.className) != null ? _a : ""}`
     }, getVariant((_b = props.variant) != null ? _b : "layout.common.trees.primary")), {
       children: [
@@ -1425,7 +1434,7 @@ const Tree = (props) => {
         ),
         /* @__PURE__ */ jsx(
           TreeItemChildren$1,
-          __spreadValues({
+          __spreadValues$1({
             "aria-activedescendant": focusedNode !== null ? getActiveDescendantName(props.name, focusedNode) : void 0,
             "aria-label": props.label,
             as: "ul",
@@ -1447,4 +1456,236 @@ const Tree = (props) => {
 };
 var Tree$1 = memo(Tree);
 
-export { Tree$1 as Tree, TreeDataController, useTreeContext, useTreeData, useTreeDataController, useTreeSelector, useTreeSelectorByName };
+var __defProp = Object.defineProperty;
+var __defProps = Object.defineProperties;
+var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
+var __getOwnPropSymbols = Object.getOwnPropertySymbols;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __propIsEnum = Object.prototype.propertyIsEnumerable;
+var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __spreadValues = (a, b) => {
+  for (var prop in b || (b = {}))
+    if (__hasOwnProp.call(b, prop))
+      __defNormalProp(a, prop, b[prop]);
+  if (__getOwnPropSymbols)
+    for (var prop of __getOwnPropSymbols(b)) {
+      if (__propIsEnum.call(b, prop))
+        __defNormalProp(a, prop, b[prop]);
+    }
+  return a;
+};
+var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
+var __accessCheck$1 = (obj, member, msg) => {
+  if (!member.has(obj))
+    throw TypeError("Cannot " + msg);
+};
+var __privateGet$1 = (obj, member, getter) => {
+  __accessCheck$1(obj, member, "read from private field");
+  return getter ? getter.call(obj) : member.get(obj);
+};
+var __privateAdd$1 = (obj, member, value) => {
+  if (member.has(obj))
+    throw TypeError("Cannot add the same private member more than once");
+  member instanceof WeakSet ? member.add(obj) : member.set(obj, value);
+};
+var _getByAbsoluteId;
+function isOOTreeNode(element) {
+  return typeof element.attachToTree === "function";
+}
+const _OOTreeNode = class {
+  constructor(tree, parent, props) {
+    this.tree = tree;
+    this.parent = parent;
+    this.props = props;
+    this.id = "";
+    this.prefix = "";
+    __privateAdd$1(this, _getByAbsoluteId, (id) => {
+      const props = this.tree.getController().propsStore.getFieldProps(id);
+      if (props === void 0)
+        return void 0;
+      return new _OOTreeNode(this.tree, props, props);
+    });
+    if (parent) {
+      if (isOOTreeNode(parent)) {
+        Object.assign(
+          this,
+          this.tree.calculateNodePrefix(props.id, parent == null ? void 0 : parent.prefix)
+        );
+      } else {
+        this.prefix = parent.nodeProps.__prefix;
+        this.id = String(parent.id);
+      }
+    }
+  }
+  attachToTree() {
+    var _a, _b;
+    const parentId = (_b = (_a = this.parent) == null ? void 0 : _a.id) != null ? _b : void 0;
+    this.tree.getController().append(__spreadProps(__spreadValues({}, this.props), {
+      id: this.id,
+      label: this.props.label,
+      parentId,
+      nodeProps: __spreadProps(__spreadValues({}, this.props.nodeProps), {
+        __prefix: this.prefix
+      })
+    }));
+  }
+  append(props) {
+    const newNode = new _OOTreeNode(this.tree, this, props);
+    newNode.attachToTree();
+    return newNode;
+  }
+  getAll() {
+    return this.tree.getController().propsStore.getFieldProps(this.id).children.map((current) => {
+      return () => {
+        return __privateGet$1(this, _getByAbsoluteId).call(this, String(current));
+      };
+    });
+  }
+  getById(id) {
+    const { id: actualId } = this.tree.calculateNodePrefix(id, this.prefix);
+    const props = this.tree.getController().propsStore.getFieldProps(actualId);
+    if (props === void 0)
+      return void 0;
+    return new _OOTreeNode(this.tree, props, props);
+  }
+  getParent() {
+    if (!this.parent)
+      return null;
+    const props = this.tree.getController().propsStore.getFieldProps(this.parent.id);
+    return new _OOTreeNode(this.tree, props, props);
+  }
+  getProps() {
+    return this.tree.getController().propsStore.getFieldProps(this.id);
+  }
+  remove() {
+    this.tree.getController().remove(this.id, true);
+  }
+  update(props) {
+    this.tree.getController().propsStore.updateField(this.id, props);
+  }
+};
+let OOTreeNode = _OOTreeNode;
+_getByAbsoluteId = new WeakMap();
+
+class OOTreeChildren extends OOTreeNode {
+  constructor(tree) {
+    super(tree, null, {});
+    this.tree = tree;
+    this.prefix = "c";
+  }
+}
+
+var __accessCheck = (obj, member, msg) => {
+  if (!member.has(obj))
+    throw TypeError("Cannot " + msg);
+};
+var __privateGet = (obj, member, getter) => {
+  __accessCheck(obj, member, "read from private field");
+  return getter ? getter.call(obj) : member.get(obj);
+};
+var __privateAdd = (obj, member, value) => {
+  if (member.has(obj))
+    throw TypeError("Cannot add the same private member more than once");
+  member instanceof WeakSet ? member.add(obj) : member.set(obj, value);
+};
+var __privateSet = (obj, member, value, setter) => {
+  __accessCheck(obj, member, "write to private field");
+  setter ? setter.call(obj, value) : member.set(obj, value);
+  return value;
+};
+var _onReady, _children, _controller;
+class OOTree extends HashedEventEmitter {
+  constructor(label, name, hashMethod, onReady) {
+    super(hashMethod);
+    this.label = label;
+    this.name = name;
+    __privateAdd(this, _onReady, void 0);
+    /**
+     * Accessors
+     */
+    __privateAdd(this, _children, null);
+    __privateAdd(this, _controller, null);
+    /**
+     * Component
+     */
+    this.getHandler = (handler) => {
+      var _a;
+      __privateSet(this, _controller, handler);
+      __privateSet(this, _children, new OOTreeChildren(this));
+      (_a = __privateGet(this, _onReady)) == null ? void 0 : _a.call(this);
+    };
+    this.Component = () => {
+      return /* @__PURE__ */ jsx(
+        Tree$1,
+        {
+          label: this.label,
+          name: this.name,
+          getHandler: this.getHandler
+        }
+      );
+    };
+    /**
+     * Data manipulation
+     */
+    this.prefixJoinCharacter = "$";
+    this.prefixWithIdJoinCharacter = "__";
+    this.prefixesMap = {};
+    /**
+     * Calcula el prefijo de un nodo que se está agregando al árbol evitando
+     * colisiones. Ese prefijo estará asociado a cada nodo y se utilizará para dar
+     * nombres únicos a sus hijos, no para el nodo en sí. Entonces, cada vez que
+     * se construye un nodo, se le asigna un prefijo considerando el prefijo de su
+     * padre, pero su nombre se hace a partir del prefijo del padre y su id.
+     */
+    this.calculateNodePrefix = (id, prefix) => {
+      const expectedPrefix = [prefix, String(id).charAt(0)].filter(Boolean).join(this.prefixJoinCharacter);
+      let i = 1;
+      let actualPrefix = expectedPrefix;
+      while (this.prefixesMap[actualPrefix] !== void 0) {
+        actualPrefix = `${expectedPrefix}${i++}`;
+      }
+      this.prefixesMap[actualPrefix] = {
+        nodeId: id,
+        prefix: actualPrefix
+      };
+      const data = {
+        prefix: actualPrefix,
+        id: [[prefix].filter(Boolean).join(this.prefixJoinCharacter), id].filter(Boolean).join(this.prefixWithIdJoinCharacter)
+      };
+      return data;
+    };
+    __privateSet(this, _onReady, onReady != null ? onReady : () => {
+    });
+  }
+  getChildren() {
+    if (__privateGet(this, _children) === null)
+      throw new Error(
+        "Children was not assigned yet, maybe you forgot to listen to onReady event on OOTree component."
+      );
+    return __privateGet(this, _children);
+  }
+  getController() {
+    if (__privateGet(this, _controller) === null)
+      throw new Error(
+        "Controller was not assigned yet, maybe you forgot to listen to onReady event on OOTree component."
+      );
+    const c = this;
+    return new Proxy(__privateGet(this, _controller), {
+      get(target, prop) {
+        if (prop === "removeAll") {
+          return () => {
+            var _a;
+            c.prefixesMap = {};
+            (_a = __privateGet(c, _controller)) == null ? void 0 : _a.removeAll();
+          };
+        }
+        return target[prop];
+      }
+    });
+  }
+}
+_onReady = new WeakMap();
+_children = new WeakMap();
+_controller = new WeakMap();
+
+export { OOTree, OOTreeNode, Tree$1 as Tree, TreeDataController, isOOTreeNode, useTreeContext, useTreeData, useTreeDataController, useTreeSelector, useTreeSelectorByName };