@apia/tree 2.0.11 → 3.0.2

package/dist/index.js

@@ -1,7 +1,1548 @@
-export { default as Tree } from './Tree.js';
-export { useTreeContext } from './TreeContext.js';
-export { default as TreeDataController, useTreeDataController, useTreeSelector, useTreeSelectorByName } from './TreeDataController.js';
-export { default as useTreeData } from './useTreeData.js';
-export { OOTree } from './OOTree/index.js';
-export { OOTreeNode, isOOTreeNode } from './OOTree/OOTreeNode.js';
+import { jsx, jsxs, Fragment } from '@apia/theme/jsx-runtime';
+import { useMount as useMount$1, useDebounceFn, useUnmount } from 'ahooks';
+import React, { useState, useEffect, memo } from 'react';
+import { shallowEqual as shallowEqual$1 } from 'react-redux';
+import { Box, getVariant, Spinner } from '@apia/theme';
+import { EventEmitter, PropsStore, addBoundary, getSpecificParent, usePropsSelector, useLatest, useMount, shallowEqual, formatMessage } from '@apia/util';
+import { LoaderSpinner, IconButton } from '@apia/components';
+import { Icon } from '@apia/icons';
+import uniqueId from 'lodash-es/uniqueId';
+
+const getLastVisibleChild = (handler, id, avoidFiltered) => {
+  const nodeProps = handler.propsStore.getFieldProps(id);
+  if (id !== "root" && (nodeProps.isDisabled || !nodeProps.isExpanded) || nodeProps.children.length === 0)
+    return null;
+  for (let i = nodeProps.children.length - 1; i >= 0; i--) {
+    const currentId = nodeProps.children[i];
+    const currentProps = handler.propsStore.getFieldProps(currentId);
+    if (!avoidFiltered || !currentProps.isFiltered) {
+      const lastChildrenLastChildren = getLastVisibleChild(
+        handler,
+        currentId,
+        avoidFiltered
+      );
+      return lastChildrenLastChildren !== null ? lastChildrenLastChildren : currentId;
+    }
+  }
+  return null;
+};
+const getPreviousChild = (handler, id, avoidFiltered) => {
+  const nodeProps = handler.propsStore.getFieldProps(id);
+  const fatherProps = handler.propsStore.getFieldProps(nodeProps.parentId);
+  let childPosition = fatherProps.children?.findIndex((current) => current === nodeProps.id) ?? -1;
+  while (childPosition > 0) {
+    const prevSibling = handler.propsStore.getFieldProps(
+      fatherProps.children[childPosition - 1]
+    );
+    const prevSiblingLastChild = getLastVisibleChild(
+      handler,
+      prevSibling.id,
+      avoidFiltered
+    );
+    if (prevSiblingLastChild !== null)
+      return prevSiblingLastChild;
+    if (!avoidFiltered || !prevSibling.isFiltered)
+      return prevSibling.id;
+    childPosition--;
+  }
+  if (nodeProps.parentId === "root")
+    return null;
+  return nodeProps.parentId;
+};
+const getFirstNonFilteredChild = (handler, id) => {
+  const nodeProps = handler.propsStore.getFieldProps(id);
+  for (const child of nodeProps.children) {
+    if (!handler.propsStore.getFieldProps(child).isFiltered)
+      return child;
+  }
+  return null;
+};
+const getNextChild = (handler, id, avoidChildren, avoidFiltered) => {
+  const nodeProps = handler.propsStore.getFieldProps(id);
+  const fatherProps = handler.propsStore.getFieldProps(nodeProps.parentId);
+  let childPosition = fatherProps.children?.findIndex((current) => current === nodeProps.id) ?? Infinity;
+  if (!avoidChildren && nodeProps.isExpanded) {
+    if (!avoidFiltered && nodeProps.children.length > 0)
+      return nodeProps.children[0];
+    const firstNonFilteredChild = getFirstNonFilteredChild(
+      handler,
+      nodeProps.id
+    );
+    if (firstNonFilteredChild !== null)
+      return firstNonFilteredChild;
+  }
+  while (childPosition < fatherProps.children.length - 1) {
+    const nextSibling = fatherProps.children[childPosition + 1];
+    if (!avoidFiltered || !handler.propsStore.getFieldProps(nextSibling).isFiltered)
+      return nextSibling;
+    childPosition++;
+  }
+  if (nodeProps.parentId === "root")
+    return null;
+  return getNextChild(handler, fatherProps.id, true, avoidFiltered);
+};
+const getNextNodeWithKey = (handler, id, firstKey, avoidFiltered) => {
+  let nextChildWithKey = id;
+  do {
+    nextChildWithKey = getNextChild(
+      handler,
+      nextChildWithKey,
+      false,
+      avoidFiltered
+    );
+    if (nextChildWithKey !== null) {
+      const nodeProps2 = handler.propsStore.getFieldProps(nextChildWithKey);
+      if ((!nodeProps2.isFiltered || !avoidFiltered) && nodeProps2.label.toUpperCase().startsWith(firstKey.toUpperCase()))
+        return nextChildWithKey;
+    }
+  } while (nextChildWithKey !== null);
+  const nodeProps = handler.propsStore.getFieldProps(id);
+  const positionInParent = handler.propsStore.getFieldProps(nodeProps.parentId).children.findIndex((current) => current === id);
+  if (nodeProps.parentId !== "root" || positionInParent > 0) {
+    const [firstChildOfTree] = handler.propsStore.getFieldProps("root").children;
+    const firstChildProps = handler.propsStore.getFieldProps(firstChildOfTree);
+    if (firstChildOfTree && (!avoidFiltered || !firstChildProps.isFiltered) && firstChildProps.label.toUpperCase().startsWith(firstKey.toUpperCase()))
+      return firstChildOfTree;
+    nextChildWithKey = firstChildOfTree;
+    do {
+      nextChildWithKey = getNextChild(
+        handler,
+        nextChildWithKey,
+        false,
+        avoidFiltered
+      );
+      if (nextChildWithKey) {
+        const currentNodeProps = handler.propsStore.getFieldProps(nextChildWithKey);
+        if ((!avoidFiltered || !currentNodeProps.isFiltered) && currentNodeProps.label.toUpperCase().startsWith(firstKey.toUpperCase()))
+          return nextChildWithKey;
+      }
+    } while (nextChildWithKey !== id && nextChildWithKey !== null);
+  }
+  return null;
+};
+const getNodePath = (handler, nodeId) => {
+  const path = [nodeId];
+  let currentStep = nodeId;
+  do {
+    currentStep = handler.propsStore.getFieldProps(currentStep).parentId;
+    path.unshift(currentStep);
+  } while (currentStep !== "root");
+  return path;
+};
+const getCommonAncestor = (handler, oneNodeId, anotherNodeId) => {
+  const oneNodePath = getNodePath(handler, oneNodeId);
+  const anotherNodePath = getNodePath(handler, anotherNodeId);
+  for (let i = oneNodePath.length - 1; i >= 0; i--) {
+    const anotherNodeIndex = anotherNodePath.indexOf(oneNodePath[i]);
+    if (anotherNodeIndex !== -1)
+      return {
+        commonAncestor: oneNodePath[i],
+        oneNodeAncestorChild: oneNodePath[i + 1],
+        anotherNodeAncestorChild: anotherNodePath[anotherNodeIndex + 1]
+      };
+  }
+  console.warn(
+    "This point should have never been reached since the root node is common to all nodes",
+    { oneNodeId, anotherNodeId, oneNodePath, anotherNodePath }
+  );
+  return null;
+};
+const unfilterNodes = (handler) => {
+  handler.state.filteredNodes.forEach((current) => {
+    handler.propsStore.updateField(
+      current,
+      { isFiltered: false },
+      { noEmit: true }
+    );
+  });
+  const firstChild = handler.propsStore.getFieldProps("root").children[0];
+  if (firstChild)
+    handler.setFocusedNode(firstChild);
+  handler.setState({ filteredNodes: [] });
+};
+const matchNodesAgainstString = (handler, searchString, nodeId = "root") => {
+  let hasMatched = false;
+  let matchNode = null;
+  const nodeProps = handler.propsStore.getFieldProps(nodeId);
+  if (nodeId !== "root" && nodeProps.label.match(new RegExp(searchString, "i"))) {
+    handler.propsStore.updateField(nodeId, { isFiltered: false });
+    hasMatched = true;
+    matchNode = nodeProps.id;
+    handler.setState({
+      filteredNodes: handler.state.filteredNodes.filter(
+        (current) => current !== nodeId
+      )
+    });
+  }
+  let hasChildrenMatched = false;
+  nodeProps.children.forEach((current) => {
+    hasChildrenMatched = matchNodesAgainstString(handler, searchString, current) || hasMatched;
+    hasMatched = hasChildrenMatched || hasMatched;
+    if (hasMatched && !matchNode)
+      matchNode = current;
+  });
+  if (hasChildrenMatched) {
+    handler.propsStore.updateField(nodeId, { isExpanded: true });
+    if (hasMatched && !matchNode)
+      matchNode = nodeId;
+  }
+  if (!hasMatched) {
+    handler.propsStore.updateField(
+      nodeId,
+      { isFiltered: true },
+      { noEmit: true }
+    );
+    handler.setState({
+      filteredNodes: [...handler.state.filteredNodes, nodeId]
+    });
+  }
+  if (matchNode !== null)
+    handler.setFocusedNode(matchNode);
+  return hasMatched;
+};
+const selectAllNodesBetweenTwoNodes = (handler, oneNodeId, anotherNodeId, avoidFiltered) => {
+  const commonAncestorData = getCommonAncestor(
+    handler,
+    oneNodeId,
+    anotherNodeId
+  );
+  if (commonAncestorData) {
+    const { anotherNodeAncestorChild, commonAncestor, oneNodeAncestorChild } = commonAncestorData;
+    const ancestorProps = handler.propsStore.getFieldProps(commonAncestor);
+    const oneNodePosition = ancestorProps.children.findIndex(
+      (current) => current === oneNodeAncestorChild
+    );
+    const anotherNodePosition = ancestorProps.children.findIndex(
+      (current) => current === anotherNodeAncestorChild
+    );
+    let currentId = oneNodePosition >= anotherNodePosition ? anotherNodeId : oneNodeId;
+    const lastNodeId = oneNodePosition < anotherNodePosition ? anotherNodeId : oneNodeId;
+    handler.toggleNodeSelectedState(currentId, true);
+    do {
+      currentId = getNextChild(handler, currentId, false, avoidFiltered);
+      if (currentId !== null)
+        handler.toggleNodeSelectedState(currentId, true);
+    } while (currentId !== lastNodeId && currentId !== null);
+  }
+};
+
+var __defProp$2 = Object.defineProperty;
+var __defNormalProp$2 = (obj, key, value) => key in obj ? __defProp$2(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __publicField$2 = (obj, key, value) => {
+  __defNormalProp$2(obj, typeof key !== "symbol" ? key + "" : key, value);
+  return value;
+};
+const trees = {};
+const treesRecordEmitter = new class TreesRecordEmitter extends EventEmitter {
+  emit(eventName, params) {
+    super.emit(eventName, params);
+    trees[params.name] = params.controller;
+  }
+}();
+function useTreeDataController(name) {
+  const [controller, setDataController] = useState(
+    trees[name]
+  );
+  useEffect(() => {
+    if (trees[name] !== controller)
+      setDataController(trees[name]);
+    return treesRecordEmitter.on("addController", (ev) => {
+      if (ev.name === name)
+        setDataController(ev.controller);
+    });
+  }, []);
+  return controller;
+}
+function getTreeDataController(name) {
+  return trees[name];
+}
+class TreeDataController extends EventEmitter {
+  constructor(name, configuration, propsStore = new PropsStore({
+    logCommands: {
+      propsStore: `treeProps_${name}`,
+      propsLog: `treeLog_${name}`,
+      propsSuscriptors: `propsSuscriptors_${name}`,
+      updateProp: `updateProp_${name}`
+    }
+  })) {
+    super();
+    this.name = name;
+    this.propsStore = propsStore;
+    __publicField$2(this, "_configuration");
+    __publicField$2(this, "hasApendedFirstChild", false);
+    /**
+     * Este array se usa para conocer los padres faltantes al momento de la
+     * construcción del árbol, de forma de optimizar el proceso
+     */
+    __publicField$2(this, "missingParents", []);
+    __publicField$2(this, "nonEmittedUpdates", []);
+    __publicField$2(this, "stateKey", "treeState");
+    __publicField$2(this, "previousNodes", []);
+    __publicField$2(this, "setState", (updateProps, conf) => {
+      this.propsStore.updateField(
+        this.stateKey,
+        {
+          ...this.state,
+          ...updateProps
+        },
+        conf
+      );
+      this.emit("stateUpdate", null);
+    });
+    __publicField$2(this, "useState", (selector) => {
+      const [selectedState, setSelectedState] = useState(selector(this.state));
+      const latestState = useLatest(selectedState);
+      useMount(() => {
+        return this.on("stateUpdate", () => {
+          const newSelection = selector(this.state);
+          if (!shallowEqual(newSelection, latestState.current)) {
+            setSelectedState(newSelection);
+          }
+        });
+      });
+      return selectedState;
+    });
+    this._configuration = configuration ?? {
+      current: { emitUpdates: true }
+    };
+    this._configuration.current.emitUpdates = this._configuration.current.emitUpdates ?? true;
+    this.setState(this.getInitialState());
+    treesRecordEmitter.emit("addController", {
+      name,
+      controller: this
+    });
+    this.initRoot();
+  }
+  get configuration() {
+    return { ...this._configuration };
+  }
+  get state() {
+    return this.propsStore.getFieldProps(
+      this.stateKey
+    );
+  }
+  get stateStore() {
+    return this.propsStore;
+  }
+  destructor() {
+    this.propsStore.destructor();
+  }
+  append(node) {
+    const newNode = { ...node, nodeProps: node.nodeProps ?? {} };
+    let father;
+    if (newNode.parentId !== void 0 && this.propsStore.getFieldProps(newNode.parentId)?.children) {
+      father = newNode.parentId;
+    } else {
+      father = "root";
+      if (newNode.parentId)
+        this.missingParents.push(newNode.parentId);
+      newNode.actualParentId = newNode.parentId;
+      newNode.parentId = "root";
+    }
+    this.propsStore.updateField(
+      newNode.id,
+      {
+        ...newNode,
+        children: newNode.children ?? []
+      },
+      { isUrgent: true }
+    );
+    this.setState({ length: this.state.length + 1 });
+    if (this.missingParents.includes(newNode.id)) {
+      this.propsStore.getFieldProps("root").children.forEach((currentChild) => {
+        if (this.propsStore.getFieldProps(currentChild).actualParentId === newNode.id) {
+          this.move(currentChild, newNode.id);
+        }
+      });
+      this.missingParents = this.missingParents.filter(
+        (current) => current !== newNode.id
+      );
+    }
+    this.propsStore.updateField(
+      father,
+      {
+        children: [
+          ...this.propsStore.getFieldProps(father).children,
+          newNode.id
+        ],
+        hasLoaded: true
+      },
+      { noEmit: this._configuration.current?.emitUpdates === false }
+    );
+    if (this._configuration.current?.emitUpdates === false)
+      this.nonEmittedUpdates.push(father);
+    if (!this.hasApendedFirstChild) {
+      this.hasApendedFirstChild = true;
+      this.setFocusedNode(newNode.id, true);
+    }
+    if (newNode.isExpanded)
+      this.toggleNodeExpandedState(newNode.id, true);
+  }
+  /**
+   * Cuando se quieren agregar muchos nodos, es conveniente llamar primero al
+   * método batchInit y luego de finalizar, al método batchFinish()
+   */
+  batchInit() {
+    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()
+   */
+  batchFinish() {
+    this.config({ emitUpdates: true });
+    setTimeout(() => this.setState({ isLoading: false }), 0);
+    const children = [...this.getNodesRecursive()];
+    const deleteNodes = this.previousNodes.filter(
+      (current) => !children.find((search) => search === current)
+    );
+    deleteNodes.forEach((current) => this.remove(current));
+    this.config({ emitUpdates: true });
+    setTimeout(() => this.setState({ isLoading: false }), 0);
+  }
+  config(newConf) {
+    if (this._configuration.current?.emitUpdates === false && newConf.emitUpdates !== false) {
+      this.nonEmittedUpdates.forEach(
+        (current) => this.propsStore.updateField(current, {
+          children: [...this.propsStore.getFieldProps(current).children]
+        })
+      );
+      this.nonEmittedUpdates = [];
+    }
+    Object.assign(
+      this._configuration.current,
+      newConf
+    );
+  }
+  deselectAll() {
+    this.state.selectedNodes.forEach(
+      (currentId) => this.propsStore.updateField(currentId, { isSelected: false })
+    );
+    this.setState({ selectedNodes: [] });
+  }
+  forceEmitUpdate() {
+    this.propsStore.updateField("root", {
+      forceUpdate: (this.propsStore.getFieldProps("root").forceUpdate ?? 0) + 1
+    });
+  }
+  getInitialState() {
+    return {
+      expandedNodes: [],
+      filteredNodes: [],
+      focusedNode: null,
+      isLoading: false,
+      length: 0,
+      selectedNodes: []
+    };
+  }
+  getNodesAsArray() {
+    const allFields = { ...this.propsStore.fields };
+    delete allFields[this.stateKey];
+    delete allFields.root;
+    return Object.values(allFields);
+  }
+  /**
+   * Devuelve un array que contiene el id de todos los nodos pertenecientes al
+   * árbol
+   */
+  getNodesIds() {
+    const allFields = { ...this.propsStore.fields };
+    delete allFields[this.stateKey];
+    delete allFields.root;
+    return Object.keys(allFields);
+  }
+  getParentId(parentId) {
+    return this.propsStore.getFieldProps(parentId).parentId;
+  }
+  /**
+   * Este método permite controlar el comportamiento con el teclado desde fuera
+   * del componente.
+   */
+  handleKey(ev) {
+    const focusedId = this.state.focusedNode;
+    const nodeProps = this.propsStore.getFieldProps(focusedId);
+    if (ev.key === "*") {
+      if (this.state.focusedNode === null)
+        return;
+      const parent = this.propsStore.getFieldProps(
+        this.propsStore.getFieldProps(this.state.focusedNode).parentId
+      );
+      parent.children.forEach(
+        (current) => this.toggleNodeExpandedState(current, true)
+      );
+    } else if (ev.key.match(/^\w$/)) {
+      const nextChildWithKey = getNextNodeWithKey(
+        this,
+        focusedId,
+        ev.key,
+        true
+      );
+      if (nextChildWithKey !== null) {
+        this.setFocusedNode(nextChildWithKey);
+        this.emit("mustFocus", nextChildWithKey);
+      }
+    } else
+      switch (ev.code) {
+        case "Home": {
+          const firstChild = getFirstNonFilteredChild(this, "root");
+          if (firstChild === null)
+            return;
+          if (ev.shiftKey && ev.ctrlKey && this.state.focusedNode !== null) {
+            selectAllNodesBetweenTwoNodes(
+              this,
+              firstChild,
+              this.state.focusedNode,
+              true
+            );
+          }
+          this.setFocusedNode(firstChild);
+          this.emit("mustFocus", firstChild);
+          break;
+        }
+        case "End": {
+          const lastVisibleChild = getLastVisibleChild(this, "root", true);
+          if (lastVisibleChild !== null) {
+            if (ev.shiftKey && ev.ctrlKey && this.state.focusedNode !== null) {
+              selectAllNodesBetweenTwoNodes(
+                this,
+                lastVisibleChild,
+                this.state.focusedNode,
+                true
+              );
+            }
+            this.setFocusedNode(lastVisibleChild);
+            this.emit("mustFocus", lastVisibleChild);
+          }
+          break;
+        }
+        case "ArrowRight": {
+          if (nodeProps.isLeaf)
+            return;
+          ev.preventDefault();
+          if (nodeProps.isExpanded) {
+            const firstChild = getFirstNonFilteredChild(this, nodeProps.id);
+            if (firstChild !== null) {
+              this.setFocusedNode(firstChild);
+              this.emit("mustFocus", firstChild);
+            }
+          } else
+            this.toggleNodeExpandedState(nodeProps.id, true);
+          break;
+        }
+        case "ArrowLeft": {
+          ev.preventDefault();
+          if (nodeProps.isLeaf || !nodeProps.isExpanded) {
+            if (nodeProps.parentId !== "root" && nodeProps.parentId !== void 0) {
+              this.setFocusedNode(nodeProps.parentId);
+              this.emit("mustFocus", nodeProps.parentId);
+            }
+          } else
+            this.toggleNodeExpandedState(nodeProps.id, false);
+          break;
+        }
+        case "ArrowUp": {
+          ev.preventDefault();
+          const prevChild = getPreviousChild(this, nodeProps.id, true);
+          if (prevChild !== null) {
+            if (ev.shiftKey)
+              this.toggleNodeSelectedState(prevChild, true);
+            this.setFocusedNode(prevChild);
+            this.emit("mustFocus", prevChild);
+          } else
+            this.emit("onArrowUpOnFirstElement", true);
+          break;
+        }
+        case "ArrowDown": {
+          ev.preventDefault();
+          const nextChild = getNextChild(this, nodeProps.id, false, true);
+          if (nextChild !== null) {
+            if (ev.shiftKey)
+              this.toggleNodeSelectedState(nextChild, true);
+            this.setFocusedNode(nextChild);
+            this.emit("mustFocus", nextChild);
+          }
+          break;
+        }
+        case "Space": {
+          if (this._configuration.current?.disableSelection)
+            return;
+          ev.preventDefault();
+          this.toggleNodeSelectedState(nodeProps.id);
+          break;
+        }
+      }
+  }
+  isNode(node) {
+    return typeof node === "object" && "parentId" in node;
+  }
+  isNodeContainer(node) {
+    return typeof node === "object" && !this.isNode(node);
+  }
+  includes(searchNode) {
+    return !!this.propsStore.getFieldProps(searchNode.id);
+  }
+  initRoot() {
+    this.propsStore.updateField(
+      "root",
+      { children: [], id: "root" },
+      { isUrgent: true }
+    );
+  }
+  move(moveNode, destinationNode, afterOrBefore) {
+    const currentFather = this.propsStore.getFieldProps(
+      this.propsStore.getFieldProps(moveNode).parentId
+    );
+    const newFather = this.propsStore.getFieldProps(destinationNode);
+    if (!currentFather) {
+      console.warn("The current node does not belong to the tree.", moveNode);
+      return;
+    }
+    if (!newFather) {
+      console.warn(
+        "The destination node does not belong to the tree. No action will be made",
+        destinationNode
+      );
+      return;
+    }
+    currentFather.children = currentFather.children?.filter(
+      (search) => search !== moveNode
+    );
+    if (!newFather.children)
+      newFather.children = [];
+    if (!afterOrBefore)
+      newFather.children.push(moveNode);
+    else if (afterOrBefore.position) {
+      newFather.children.splice(afterOrBefore.position - 1, 0, moveNode);
+    } else {
+      const key = afterOrBefore.after ? afterOrBefore.after : afterOrBefore.before;
+      const relatedNodeKey = key && this.isNode(key) ? key.id : key;
+      const relatedNodeIndex = newFather.children.findIndex(
+        (search) => search === relatedNodeKey
+      );
+      const actualIndex = addBoundary(
+        afterOrBefore.before !== void 0 ? relatedNodeIndex : relatedNodeIndex + 1,
+        0
+      );
+      if (actualIndex === -1 || actualIndex === newFather.children.length)
+        newFather.children.push(moveNode);
+      else
+        newFather.children.splice(actualIndex, 0, moveNode);
+    }
+    this.propsStore.updateField(currentFather.id, {
+      children: [...currentFather.children ?? []]
+    });
+    this.propsStore.updateField(newFather.id, {
+      children: [...newFather.children]
+    });
+    this.propsStore.updateField(moveNode, {
+      parentId: newFather.id
+    });
+  }
+  /**
+   * Borra el nodo del árbol, y dependiendo del parámetro removeChildren, borra
+   * también sus hijos.
+   *
+   * @param removeChildren - Si se pasa en false, los nodos hijos son movidos al root
+   */
+  remove(removeNode, removeChildren = true) {
+    const removeNodeId = this.isNode(removeNode) ? removeNode.id : removeNode;
+    const removingNode = this.propsStore.getFieldProps(removeNodeId);
+    if (!removingNode)
+      return;
+    const father = this.propsStore.getFieldProps(removingNode.parentId);
+    if (father) {
+      this.propsStore.updateField(father.id, {
+        children: father.children?.filter((search) => search !== removeNodeId)
+      });
+    }
+    removingNode.children?.forEach((current) => {
+      if (removeChildren) {
+        this.remove(current);
+      } else {
+        this.move(current, "root");
+      }
+    });
+    this.setState({
+      selectedNodes: this.state.selectedNodes.filter(
+        (current) => current !== removeNodeId
+      ),
+      focusedNode: this.state.focusedNode === removeNodeId ? null : this.state.focusedNode,
+      length: this.state.length - 1
+    });
+    this.propsStore.removeField(removeNodeId);
+  }
+  removeMultiple(nodes, removeChildren = true) {
+    nodes.forEach((current) => this.remove(current, removeChildren));
+  }
+  /**
+   * Borra todos los nodos del árbol.
+   */
+  removeAll() {
+    if (this.configuration.current?.emitUpdates === false) {
+      this.previousNodes = this.getNodesIds();
+      this.propsStore.updateField(
+        "root",
+        { children: [], id: "root" },
+        { isUrgent: true, noEmit: true }
+      );
+    } else {
+      this.hasApendedFirstChild = false;
+      this.setState({ focusedNode: null }, { isUrgent: true });
+      this.setSelectedNodes([]);
+      this.initRoot();
+      Object.keys(this.propsStore.fields).forEach((current) => {
+        if (!["root", this.stateKey].includes(current))
+          this.propsStore.removeField(current);
+      });
+    }
+  }
+  selectAll() {
+    this.setState({
+      selectedNodes: this.getNodesIds()
+    });
+    this.state.selectedNodes.forEach(
+      (currentId) => this.propsStore.updateField(currentId, { isSelected: true })
+    );
+  }
+  setExpandedNodes(nodes) {
+    this.state.expandedNodes.forEach(
+      (current) => this.propsStore.updateField(current, { isExpanded: false })
+    );
+    this.setState({ expandedNodes: nodes });
+    nodes.forEach(
+      (current) => this.propsStore.updateField(current, { isExpanded: true })
+    );
+  }
+  setFocusedNode(key, avoidSelection) {
+    if (this.state.focusedNode !== null)
+      this.propsStore.updateField(this.state.focusedNode, { isFocused: false });
+    this.setState({
+      focusedNode: key
+    });
+    if (!this._configuration.current?.isMultiple && !avoidSelection && (this._configuration.current?.selectionMode ?? "onFocus") === "onFocus")
+      this.setSelectedNodes([key]);
+    this.propsStore.updateField(key, { isFocused: true });
+  }
+  setSelectedNodes(nodes, force = false) {
+    if (this._configuration.current?.disableSelection && !force)
+      return;
+    this.state.selectedNodes.forEach(
+      (current) => this.propsStore.updateField(current, { isSelected: false })
+    );
+    this.setState({
+      selectedNodes: nodes.filter((current) => {
+        const { isSelectable } = this.propsStore.getFieldProps(current);
+        if (isSelectable !== false)
+          this.propsStore.updateField(current, { isSelected: true });
+        return isSelectable !== false;
+      })
+    });
+  }
+  setSelectedNodesByClickEvent(ev) {
+    if (this._configuration.current?.disableSelection)
+      return;
+    const nodeKey = getSpecificParent(
+      ev.target,
+      (current) => current.getAttribute("role") === "treeitem"
+    )?.getAttribute("data-key");
+    if (nodeKey) {
+      const nodeProps = this.propsStore.getFieldProps(nodeKey);
+      if (nodeProps.isDisabled || nodeProps.isSelectable === false)
+        return;
+      const previousSelectionKeys = [...this.state.selectedNodes];
+      const allowMultiple = this._configuration.current?.isMultiple && (this._configuration.current?.selectionMode !== "explicitMultiple" || ev.ctrlKey || ev.shiftKey);
+      const newSelection = allowMultiple ? nodeProps.isSelected ? previousSelectionKeys.filter((current) => current !== nodeKey) : [...previousSelectionKeys, nodeKey] : [nodeKey];
+      this.setSelectedNodes(newSelection);
+    } else
+      console.warn("Cannot set selection, no treeitem found", ev);
+  }
+  toggleNodeExpandedState(key, shouldExpand) {
+    const nodeProps = this.propsStore.getFieldProps(key);
+    if (nodeProps.isDisabled || nodeProps.isLeaf || nodeProps.isLoading)
+      return;
+    if (this._configuration.current?.onLoadData && !nodeProps.hasLoaded) {
+      this.propsStore.updateField(key, { isLoading: true });
+      this._configuration.current?.onLoadData(nodeProps).finally(() => {
+        this.propsStore.updateField(key, {
+          isLoading: false,
+          isExpanded: true,
+          hasLoaded: true
+        });
+        this.setState({
+          expandedNodes: [...this.state.expandedNodes, key]
+        });
+        this._configuration.current?.onExpand?.(
+          this.propsStore.getFieldProps(key)
+        );
+      });
+    } else {
+      const { expandedNodes } = this.state;
+      const shouldExpandInner = shouldExpand !== void 0 ? shouldExpand : !expandedNodes.includes(key);
+      if (this.propsStore.getFieldProps(key)?.isDisabled)
+        return;
+      this.setState({
+        expandedNodes: shouldExpandInner ? [...expandedNodes, key] : expandedNodes.filter((current) => current !== key)
+      });
+      this.propsStore.updateField(key, { isExpanded: shouldExpandInner });
+      this._configuration.current?.onExpand?.(
+        this.propsStore.getFieldProps(key)
+      );
+    }
+  }
+  toggleNodeSelectedState(key, isSelected) {
+    if (this._configuration.current?.disableSelection)
+      return;
+    const nodeProps = this.propsStore.getFieldProps(key);
+    if (nodeProps.isDisabled || nodeProps.isSelectable === false)
+      return;
+    const shouldSelect = isSelected !== void 0 ? isSelected : !this.state.selectedNodes.includes(key);
+    if (shouldSelect && nodeProps.isSelected || isSelected === false && !nodeProps.isSelected)
+      return;
+    if (shouldSelect && !this._configuration.current?.isMultiple && this.state.selectedNodes[0])
+      this.toggleNodeSelectedState(this.state.selectedNodes[0], false);
+    this.propsStore.updateField(key, { isSelected: shouldSelect });
+    this.setState({
+      selectedNodes: shouldSelect ? [...this.state.selectedNodes, key] : this.state.selectedNodes.filter((current) => current !== key)
+    });
+  }
+}
+function useTreeSelector(handler, configuration) {
+  return usePropsSelector(
+    handler?.stateKey ?? "__NO__TREE__KEY__",
+    {
+      propsStore: handler?.propsStore,
+      ...configuration
+    }
+  );
+}
+function useTreeSelectorByName(treeName, configuration) {
+  const handler = useTreeDataController(treeName);
+  const selection = usePropsSelector(
+    handler?.stateKey ?? "__NO__TREE__KEY__",
+    {
+      propsStore: handler?.propsStore,
+      ...configuration
+    }
+  );
+  return { selection, handler };
+}
+var TreeDataController$1 = TreeDataController;
+
+function getActiveDescendantName(treeName, nodeId) {
+  return `${treeName}__${nodeId}`;
+}
+function getDomProps(_, treeName, type, par) {
+  switch (type) {
+    case "node": {
+      const node = par;
+      const tree = getTreeDataController(treeName);
+      return {
+        "aria-disabled": node.isDisabled,
+        "aria-expanded": node.isLeaf ? void 0 : !!node.isExpanded,
+        "aria-label": node.label,
+        ...tree.configuration.current?.disableSelection ? void 0 : {
+          "aria-selected": node.isSelectable !== false && !node.isDisabled ? !!node.isSelected : void 0
+        },
+        className: node.className,
+        color: node.color,
+        "data-key": node.id,
+        id: getActiveDescendantName(treeName, node.id),
+        role: "treeitem",
+        title: node.title
+      };
+    }
+    default: {
+      const tree = par;
+      return {
+        role: "tree",
+        "aria-multiselectable": tree.isMultiple
+      };
+    }
+  }
+}
+
+const SearchLabel = ({
+  isLoading: isSearching,
+  onDelete,
+  searchString
+}) => {
+  if (!searchString && !isSearching)
+    return null;
+  return /* @__PURE__ */ jsx(Box, { className: `tree__searchLabelBox ${isSearching ? "isLoading" : ""}`, children: isSearching ? /* @__PURE__ */ jsx(LoaderSpinner, { className: "tree__loading" }) : /* @__PURE__ */ jsxs(Box, { as: "label", className: "tree__searchLabel", children: [
+    formatMessage(window.LBL_FILTERING_BY, { TOK1: searchString }),
+    /* @__PURE__ */ jsx(
+      IconButton,
+      {
+        icon: "Close",
+        "aria-label": window.LBL_DELETE_FILTER,
+        onClick: onDelete,
+        title: window.LBL_DELETE_FILTER,
+        size: "Sm",
+        ...getVariant("icon-inherit")
+      }
+    )
+  ] }) });
+};
+var SearchLabel$1 = SearchLabel;
+
+const TreeContext = React.createContext({});
+function useTreeContext() {
+  const context = React.useContext(TreeContext);
+  if (!context)
+    throw new Error("There is no tree context");
+  return context;
+}
+const TreeContextProvider = ({
+  children,
+  value
+}) => {
+  const Provider = React.useMemo(() => {
+    return TreeContext.Provider;
+  }, []);
+  return /* @__PURE__ */ jsx(Provider, { value, children });
+};
+
+const DefaultIconRenderer = (props) => {
+  return /* @__PURE__ */ jsx(
+    Icon,
+    {
+      name: props.icon,
+      title: "",
+      size: props.iconSize ?? "iconSm",
+      className: "tree__node__icon"
+    }
+  );
+};
+var DefaultIconRenderer$1 = DefaultIconRenderer;
+
+const DefaultLabelRenderer = (props) => {
+  return /* @__PURE__ */ jsx(Box, { as: "span", children: props.label });
+};
+var DefaultLabelRenderer$1 = DefaultLabelRenderer;
+
+const Spacer = ({ level }) => {
+  return /* @__PURE__ */ jsx(Fragment, { children: Array(level).fill("").map((_, i) => i).map((current) => /* @__PURE__ */ jsx(Box, { className: "spacer" }, current)) });
+};
+var Spacer$1 = Spacer;
+
+const TreeItemLabel = ({ level, treeKey }) => {
+  const {
+    handler,
+    treeProps: { toggleNodesOnLabelClick }
+  } = useTreeContext();
+  const props = usePropsSelector(treeKey, {
+    selector: (current) => current,
+    comparator: (prevProps, newProps) => {
+      return shallowEqual$1(prevProps, newProps) && shallowEqual$1(prevProps?.children, newProps?.children);
+    },
+    propsStore: handler.propsStore
+  });
+  const Renderer = React.useMemo(
+    () => props.labelRenderer ?? DefaultLabelRenderer$1,
+    [props.labelRenderer]
+  );
+  const handleToggle = React.useCallback(() => {
+    handler.toggleNodeExpandedState(treeKey);
+  }, [handler, treeKey]);
+  const IconRenderer = React.useMemo(() => {
+    return typeof props.icon === "string" ? DefaultIconRenderer$1 : props.icon;
+  }, [props.icon]);
+  const onClick = React.useCallback(() => {
+    if (props.allowToggleExpandedFromLabel !== false)
+      handler.toggleNodeExpandedState(treeKey);
+  }, [handler, props.allowToggleExpandedFromLabel, treeKey]);
+  return /* @__PURE__ */ jsxs(
+    Box,
+    {
+      as: "span",
+      className: `tree__nodeItemLabel ${props.isFocused ? "focus" : ""}`,
+      children: [
+        /* @__PURE__ */ jsx(Spacer$1, { level }),
+        (props.isLoading || props.isExpanded && props.isLeaf !== true || props.isLeaf === false || (props.children?.length ?? 0) > 0 || props.isLeaf === void 0 && !props.hasLoaded && handler.configuration.current?.onLoadData) && /* @__PURE__ */ jsx(Box, { className: "tree__expanderWrapper", children: props.isLoading ? /* @__PURE__ */ jsx(Spinner, { sx: { width: "iconSm", height: "iconSm" } }) : /* @__PURE__ */ jsx(
+          Icon,
+          {
+            className: "tree__expandIcon",
+            onClick: handleToggle,
+            name: props.isExpanded ? "ArrowDownThin" : "ArrowRightThin",
+            title: "",
+            size: 20
+          }
+        ) }),
+        props.icon && IconRenderer && /* @__PURE__ */ jsx(IconRenderer, { ...props }),
+        /* @__PURE__ */ jsx(
+          Box,
+          {
+            as: "span",
+            className: "tree__nodeItemLabelRenderer",
+            onClick: toggleNodesOnLabelClick !== false ? onClick : void 0,
+            children: /* @__PURE__ */ jsx(Renderer, { ...props })
+          }
+        )
+      ]
+    }
+  );
+};
+var TreeItemLabel$1 = React.memo(TreeItemLabel);
+
+const TreeItem = ({ level, treeKey }) => {
+  const { handler, name, forceUpdate, treeProps } = useTreeContext();
+  const props = usePropsSelector(treeKey, {
+    selector: (current) => current,
+    comparator: (prevProps, newProps) => {
+      return shallowEqual$1(prevProps, newProps) && shallowEqual$1(prevProps?.children, newProps?.children);
+    },
+    propsStore: handler.propsStore
+  });
+  const nodes = React.useMemo(
+    () => props.children?.map(
+      (current) => handler.propsStore.getFieldProps(current)
+    ) ?? [],
+    [props.children, handler.propsStore]
+  );
+  const domProps = getDomProps(treeProps, name, "node", props);
+  return /* @__PURE__ */ jsx(Fragment, { children: /* @__PURE__ */ jsxs(
+    Box,
+    {
+      as: "li",
+      ...domProps,
+      className: `${domProps.className ?? ""} tree__item`,
+      children: [
+        /* @__PURE__ */ jsx(TreeItemLabel$1, { level, treeKey }),
+        props.isExpanded && /* @__PURE__ */ jsx(
+          TreeItemChildren$1,
+          {
+            forceUpdate,
+            role: "group",
+            level,
+            nodes
+          }
+        )
+      ]
+    }
+  ) });
+};
+var TreeItem$1 = React.memo(TreeItem);
+
+const TreeItemChildren = React.forwardRef(({ level, nodes, forceUpdate, ...props }, ref) => {
+  const { handler } = useTreeContext();
+  return /* @__PURE__ */ jsx(Box, { ref, as: "ul", ...props, children: nodes?.map((current) => {
+    const currentProps = handler.propsStore.getFieldProps(current.id);
+    if (!currentProps)
+      return null;
+    return currentProps.isFiltered ? null : /* @__PURE__ */ jsx(TreeItem$1, { level: level + 1, treeKey: current.id }, current.id);
+  }) });
+});
+TreeItemChildren.displayName = "TreeItemChildren";
+var TreeItemChildren$1 = React.memo(TreeItemChildren);
+
+function useTreeData({ name, treeProps }) {
+  const props = useLatest(treeProps);
+  const handler = React.useMemo(
+    () => props?.current.controller ?? new TreeDataController$1(name, props),
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+    []
+  );
+  useMount$1(() => {
+    treeProps?.initialNodes?.forEach((current) => handler.append(current));
+  });
+  const data = usePropsSelector(
+    "root",
+    {
+      comparator: shallowEqual$1,
+      propsStore: handler.propsStore,
+      selector: (current) => ({
+        children: current.children ?? [],
+        // eslint-disable-next-line @typescript-eslint/no-unsafe-member-access, @typescript-eslint/no-explicit-any
+        forceUpdate: current.forceUpdate
+      })
+    }
+  );
+  const keyHandlerId = React.useMemo(() => `keyHandler${uniqueId()}`, []);
+  const keyHandlerRef = React.useRef(null);
+  const focusOnNode = React.useCallback(
+    (key, retry = 3) => {
+      if (keyHandlerRef.current) {
+        const focusElement = keyHandlerRef.current.querySelector(
+          `[data-key="${key}"]`
+        );
+        keyHandlerRef.current?.focus();
+        if (focusElement) {
+          const actualFocusElement = (treeProps.focusGetter ?? ((liElement) => liElement.querySelector(
+            ":scope > .tree__nodeItemLabel"
+          )))(focusElement);
+          const nodeProps = handler.propsStore.getFieldProps(key);
+          if (!treeProps.focusGetter || !nodeProps.labelRenderer)
+            actualFocusElement.classList.add("focused");
+          actualFocusElement.scrollIntoView({
+            inline: "nearest",
+            block: "nearest"
+          });
+        } else if (retry > 0)
+          setTimeout(() => focusOnNode(key, retry - 1), 30);
+      }
+    },
+    [handler.propsStore, treeProps.focusGetter]
+  );
+  React.useEffect(() => {
+    const unsuscribe1 = handler.on("mustFocus", (node) => focusOnNode(node));
+    const unsuscribe2 = handler.on(
+      "onArrowUpOnFirstElement",
+      () => treeProps.onArrowUpOnFirstElement?.()
+    );
+    return () => {
+      unsuscribe1();
+      unsuscribe2();
+    };
+  }, [focusOnNode, handler, treeProps]);
+  return {
+    data,
+    handler,
+    keyHandler: {
+      id: keyHandlerId,
+      onKeyDown: React.useCallback(
+        (ev) => {
+          if (ev.key === "Enter") {
+            const key = handler.state.focusedNode;
+            if (key) {
+              const nodeProps = handler.propsStore.getFieldProps(key);
+              treeProps.onNodeClick?.(ev, nodeProps);
+            }
+          } else {
+            handler.handleKey(ev);
+          }
+        },
+        [handler, treeProps]
+      ),
+      onMouseDown: React.useCallback(
+        (ev) => {
+          const previousFocused = handler.state.focusedNode;
+          if (previousFocused !== null && ev.shiftKey && handler.configuration.current?.isMultiple)
+            ev.preventDefault();
+        },
+        [handler.configuration, handler.state.focusedNode]
+      ),
+      onClick: React.useCallback(
+        (ev) => {
+          if (getSpecificParent(
+            ev.target,
+            (current) => current.classList.contains("tree__expandIcon")
+          ))
+            return;
+          const node = getSpecificParent(
+            ev.target,
+            (current) => !!current.getAttribute("data-key")
+          );
+          if (node) {
+            const previousFocused = handler.state.focusedNode;
+            const key = node.getAttribute("data-key");
+            const nodeProps = handler.propsStore.getFieldProps(key);
+            treeProps.onNodeClick?.(ev, nodeProps);
+            if (previousFocused !== null && ev.shiftKey && handler.configuration.current?.isMultiple) {
+              selectAllNodesBetweenTwoNodes(
+                handler,
+                previousFocused,
+                key,
+                true
+              );
+            } else {
+              handler.setFocusedNode(key);
+              handler.setSelectedNodesByClickEvent(ev);
+            }
+            if (key)
+              focusOnNode(key);
+          }
+        },
+        [focusOnNode, handler, treeProps]
+      ),
+      ref: keyHandlerRef
+    }
+  };
+}
+
+const Tree = (props) => {
+  const { data, handler, keyHandler } = useTreeData({
+    name: props.name,
+    treeProps: { ...props }
+  });
+  const [isLoading, setIsLoading] = React.useState(false);
+  const [currentSearchString, setCurrentSearchString] = React.useState("");
+  const isTreeLoading = useTreeSelector(handler, {
+    selector: (current) => current.isLoading
+  });
+  React.useEffect(() => {
+    setIsLoading(isTreeLoading);
+  }, [isTreeLoading]);
+  const search = useDebounceFn(
+    () => {
+      if (props.filterString === void 0)
+        return;
+      setIsLoading(true);
+      React.startTransition(() => {
+        setCurrentSearchString(props.filterString);
+      });
+      if (props.filterString !== void 0 && props.filterString !== "") {
+        unfilterNodes(handler);
+        matchNodesAgainstString(handler, props.filterString);
+        handler.forceEmitUpdate();
+      } else {
+        unfilterNodes(handler);
+        handler.forceEmitUpdate();
+      }
+      setTimeout(() => setIsLoading(false), 0);
+    },
+    { wait: 200 }
+  );
+  React.useEffect(() => {
+    search.run();
+    if (!props.filterString)
+      search.flush();
+  }, [props.filterString]);
+  usePropsSelector(
+    handler.stateKey,
+    {
+      propsStore: handler.propsStore,
+      selector: (current) => current,
+      comparator: (prevProps, newProps) => {
+        if (props.onSelect && !shallowEqual$1(prevProps?.selectedNodes, newProps?.selectedNodes)) {
+          props.onSelect(
+            (newProps?.selectedNodes ?? []).map(
+              (currentId) => handler.propsStore.getFieldProps(currentId)
+            )
+          );
+        }
+        return true;
+      }
+    }
+  );
+  const { focusedNode } = usePropsSelector(handler.stateKey, {
+    propsStore: handler.propsStore,
+    selector: (current) => ({
+      focusedNode: current.focusedNode
+    })
+  });
+  useMount$1(() => {
+    if (props.getHandler)
+      props.getHandler(handler);
+  });
+  useUnmount(() => handler.destructor());
+  const contextValue = React.useMemo(() => {
+    const actualValue = {
+      handler,
+      name: props.name,
+      forceUpdate: data.forceUpdate,
+      focusGetter: props.focusGetter,
+      treeProps: props
+    };
+    return actualValue;
+  }, [handler, props, data.forceUpdate]);
+  return /* @__PURE__ */ jsx(TreeContextProvider, { value: contextValue, children: /* @__PURE__ */ jsxs(
+    Box,
+    {
+      className: `tree ${props.className ?? ""}`,
+      ...getVariant(props.variant ?? "layout.common.trees.primary"),
+      children: [
+        /* @__PURE__ */ jsx(
+          SearchLabel$1,
+          {
+            isLoading: props.isLoading ?? isLoading,
+            onDelete: props.onDeleteFilterString,
+            searchString: props.hideSearchLabel ? "" : currentSearchString
+          }
+        ),
+        /* @__PURE__ */ jsx(
+          TreeItemChildren$1,
+          {
+            "aria-activedescendant": focusedNode !== null ? getActiveDescendantName(props.name, focusedNode) : void 0,
+            "aria-label": props.label,
+            as: "ul",
+            forceUpdate: data.forceUpdate,
+            level: -1,
+            nodes: React.useMemo(
+              () => data.children.map(
+                (current) => handler.propsStore.getFieldProps(current)
+              ),
+              [data.children, handler.propsStore]
+            ),
+            role: "tree",
+            tabIndex: 0,
+            ...keyHandler
+          }
+        )
+      ]
+    }
+  ) });
+};
+var Tree$1 = memo(Tree);
+
+var __defProp$1 = Object.defineProperty;
+var __defNormalProp$1 = (obj, key, value) => key in obj ? __defProp$1(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __publicField$1 = (obj, key, value) => {
+  __defNormalProp$1(obj, typeof key !== "symbol" ? key + "" : key, value);
+  return value;
+};
+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 _OOTreeNode {
+  constructor(tree, parent, props) {
+    this.tree = tree;
+    this.parent = parent;
+    this.props = props;
+    __publicField$1(this, "id", "");
+    __publicField$1(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?.prefix)
+        );
+      } else {
+        this.prefix = props.nodeProps.__prefix;
+        this.id = String(props.id);
+      }
+    }
+  }
+  attachToTree() {
+    const parentId = this.parent?.id ?? void 0;
+    this.tree.getController().append({
+      ...this.props,
+      id: this.id,
+      label: this.props.label,
+      parentId,
+      nodeProps: {
+        ...this.props.nodeProps,
+        __prefix: this.prefix,
+        __id: this.props.id
+      }
+    });
+  }
+  append(props) {
+    const newNode = new _OOTreeNode(this.tree, this, props);
+    newNode.attachToTree();
+    return newNode;
+  }
+  collapse() {
+    this.tree.getController().setExpandedNodes(
+      this.tree.getController().state.expandedNodes.filter(
+        (current) => current !== this.getProps().id
+      )
+    );
+  }
+  expand() {
+    this.tree.getController().setExpandedNodes([
+      ...this.tree.getController().state.expandedNodes,
+      this.getProps().id
+    ]);
+    this.parent.expand?.();
+  }
+  focus(expand) {
+    this.tree.getController().setFocusedNode(this.getProps().id);
+    if (expand) {
+      this.expand();
+    }
+  }
+  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);
+  }
+  getOriginalId() {
+    return this.getProps().nodeProps.__id;
+  }
+  getParent() {
+    if (!this.parent)
+      return null;
+    const props = this.tree.getController().propsStore.getFieldProps(this.parent.id);
+    const parent = props.parentId;
+    const parentProps = this.tree.getController().propsStore.getFieldProps(parent);
+    return new _OOTreeNode(this.tree, parentProps, props);
+  }
+  getProps() {
+    return this.tree.getController().propsStore.getFieldProps(this.id);
+  }
+  remove() {
+    this.tree.getController().remove(this.id, true);
+  }
+  sort(sortFunction) {
+    const children = this.getProps().children.map(
+      (current) => this.tree.getController().propsStore.getFieldProps(current)
+    ).sort((a, b) => sortFunction(a, b)).map((current) => current.id);
+    this.tree.getController().propsStore.updateField(this.id, { children });
+  }
+  update(props) {
+    this.tree.getController().propsStore.updateField(this.id, props);
+  }
+};
+_getByAbsoluteId = new WeakMap();
+let OOTreeNode = _OOTreeNode;
+
+class OOTreeChildren extends OOTreeNode {
+  constructor(tree) {
+    super(tree, null, {});
+    this.tree = tree;
+    this.prefix = "c";
+  }
+  /**
+   * Se sobreescribe para evitar problemas
+   */
+  expand() {
+  }
+}
+
+var __defProp = Object.defineProperty;
+var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __publicField = (obj, key, value) => {
+  __defNormalProp(obj, typeof key !== "symbol" ? key + "" : key, value);
+  return value;
+};
+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 _children, _controller, _makeHandler;
+class OOTree extends EventEmitter {
+  constructor(props) {
+    super();
+    this.props = props;
+    /**
+     * Accessors
+     */
+    __privateAdd(this, _children, null);
+    __privateAdd(this, _controller, {});
+    __publicField(this, "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);
+    });
+    __publicField(this, "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 () => {
+              c.prefixesMap = {};
+              __privateGet(c, _controller)?.removeAll();
+            };
+          }
+          return target[prop];
+        }
+      });
+    });
+    /**
+     * Component
+     */
+    __privateAdd(this, _makeHandler, () => {
+      __privateSet(this, _controller, new TreeDataController$1(this.props.name, {
+        current: this.props
+      }));
+      __privateSet(this, _children, new OOTreeChildren(this));
+    });
+    __publicField(this, "Component", (props) => {
+      return /* @__PURE__ */ jsx(
+        Tree$1,
+        {
+          controller: __privateGet(this, _controller),
+          ...this.props,
+          ...props
+        }
+      );
+    });
+    /**
+     * Data manipulation
+     */
+    __publicField(this, "prefixJoinCharacter", "$$");
+    __publicField(this, "prefixWithIdJoinCharacter", "__");
+    __publicField(this, "prefixesMap", {});
+    __publicField(this, "calculateDepth", (id) => {
+      return [...String(id).matchAll(/\$\$/g)].length;
+    });
+    /**
+     * 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.
+     */
+    __publicField(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;
+    });
+    __privateGet(this, _makeHandler).call(this);
+  }
+}
+_children = new WeakMap();
+_controller = new WeakMap();
+_makeHandler = new WeakMap();
+
+export { OOTree, OOTreeNode, Tree$1 as Tree, TreeDataController$1 as TreeDataController, isOOTreeNode, useTreeContext, useTreeData, useTreeDataController, useTreeSelector, useTreeSelectorByName };
 //# sourceMappingURL=index.js.map