tree-element 0.1.0

package/lib/elementsRenderer.js

@@ -0,0 +1,251 @@
+import { getBoolString } from './util.js';
+
+class ElementsRenderer {
+  closedIconElement;
+  openedIconElement;
+  _autoEscape;
+  _buttonLeft;
+  _classNames;
+  _dragAndDrop;
+  _getTree;
+  _htmlElement;
+  _isNodeSelected;
+  _onCreateLi;
+  _rtl;
+  _setNodeElement;
+  _showEmptyFolder;
+  _tabIndex;
+  constructor({
+    autoEscape,
+    buttonLeft,
+    classNames,
+    closedIcon,
+    dragAndDrop,
+    getTree,
+    htmlElement,
+    isNodeSelected,
+    onCreateLi,
+    openedIcon,
+    rtl,
+    setNodeElement,
+    showEmptyFolder,
+    tabIndex
+  }) {
+    this._autoEscape = autoEscape;
+    this._buttonLeft = buttonLeft;
+    this._classNames = classNames;
+    this._dragAndDrop = dragAndDrop;
+    this._getTree = getTree;
+    this._htmlElement = htmlElement;
+    this._isNodeSelected = isNodeSelected;
+    this._onCreateLi = onCreateLi;
+    this._rtl = rtl;
+    this._setNodeElement = setNodeElement;
+    this._showEmptyFolder = showEmptyFolder;
+    this._tabIndex = tabIndex;
+    this.openedIconElement = this._createButtonElement(openedIcon ?? "+");
+    this.closedIconElement = this._createButtonElement(closedIcon ?? "-");
+  }
+  render(fromNode) {
+    if (fromNode?.parent) {
+      this.renderFromNode(fromNode);
+    } else {
+      this.renderFromRoot();
+    }
+  }
+  renderFromNode(node) {
+    if (!node.element) {
+      return;
+    }
+    const currentLi = node.element;
+    const newLi = this._createLi(node, node.getLevel());
+    currentLi.replaceWith(newLi);
+
+    // create children
+    this._createDomElements(newLi, node.children, false, node.getLevel() + 1);
+  }
+  renderFromRoot() {
+    this._htmlElement.textContent = '';
+    const tree = this._getTree();
+    if (tree) {
+      this._createDomElements(this._htmlElement, tree.children, true, 1);
+    }
+  }
+  _attachNodeData(node, li) {
+    node.element = li;
+    this._setNodeElement(li, node);
+  }
+  _createButtonElement(value) {
+    if (typeof value === "string") {
+      // convert value to html
+      const div = document.createElement("div");
+      div.innerHTML = value;
+      return document.createTextNode(div.innerHTML);
+    } else if (value.nodeType) {
+      return value;
+    } else {
+      return undefined;
+    }
+  }
+  _createDomElements(element, children, isRootNode, level) {
+    const ul = this._createUl(isRootNode);
+    element.appendChild(ul);
+    for (const child of children) {
+      const li = this._createLi(child, level);
+      ul.appendChild(li);
+      if (child.hasChildren()) {
+        this._createDomElements(li, child.children, false, level + 1);
+      }
+    }
+  }
+  _createFolderLi(node, level, isSelected) {
+    const buttonClasses = this._getButtonClasses(node);
+    const folderClasses = this._getFolderClasses(node, isSelected);
+    const iconElement = node.is_open ? this.openedIconElement : this.closedIconElement;
+
+    // li
+    const li = document.createElement("li");
+    li.className = `${this._classNames.common} ${folderClasses}`;
+    li.setAttribute("role", "none");
+
+    // div
+    const div = document.createElement("div");
+    div.className = `${this._classNames.element} ${this._classNames.common}`;
+    div.setAttribute("role", "none");
+    li.appendChild(div);
+
+    // button link
+    const buttonLink = document.createElement("a");
+    buttonLink.className = buttonClasses;
+    if (iconElement) {
+      buttonLink.appendChild(iconElement.cloneNode(true));
+    }
+    if (this._buttonLeft) {
+      div.appendChild(buttonLink);
+    }
+
+    // title span
+    const titleSpan = this._createTitleSpan(node.name, isSelected, true, level);
+    titleSpan.setAttribute("aria-expanded", getBoolString(node.is_open));
+    div.appendChild(titleSpan);
+    if (!this._buttonLeft) {
+      div.appendChild(buttonLink);
+    }
+    return li;
+  }
+
+  /* Create the <li> element
+   * Attach it to node.element.
+   * Call onCreateLi
+   */
+  _createLi(node, level) {
+    const isSelected = this._isNodeSelected(node);
+    const mustShowFolder = node.isFolder() || node.isEmptyFolder && this._showEmptyFolder;
+    const li = mustShowFolder ? this._createFolderLi(node, level, isSelected) : this._createNodeLi(node, level, isSelected);
+    this._attachNodeData(node, li);
+    if (this._onCreateLi) {
+      this._onCreateLi(node, li, isSelected);
+    }
+    return li;
+  }
+  _createNodeLi(node, level, isSelected) {
+    const liClasses = [this._classNames.common];
+    if (isSelected) {
+      liClasses.push(this._classNames.selected);
+    }
+    const classString = liClasses.join(" ");
+
+    // li
+    const li = document.createElement("li");
+    li.className = classString;
+    li.setAttribute("role", "none");
+
+    // div
+    const div = document.createElement("div");
+    div.className = `${this._classNames.element} ${this._classNames.common}`;
+    div.setAttribute("role", "none");
+    li.appendChild(div);
+
+    // title span
+    const titleSpan = this._createTitleSpan(node.name, isSelected, false, level);
+    div.appendChild(titleSpan);
+    return li;
+  }
+  _createTitleSpan(nodeName, isSelected, isFolder, level) {
+    const titleSpan = document.createElement("span");
+    let classes = `${this._classNames.title} ${this._classNames.common}`;
+    if (isFolder) {
+      classes += ` ${this._classNames.titleFolder}`;
+    }
+    classes += ` ${this._buttonLeft ? this._classNames.titleButtonLeft : this._classNames.titleButtonRight}`;
+    titleSpan.className = classes;
+    if (isSelected) {
+      const tabIndex = this._tabIndex;
+      if (tabIndex !== undefined) {
+        titleSpan.setAttribute("tabindex", `${tabIndex}`);
+      }
+    }
+    this._setTreeItemAriaAttributes(titleSpan, nodeName, level, isSelected);
+    if (this._autoEscape) {
+      titleSpan.textContent = nodeName;
+    } else {
+      titleSpan.innerHTML = nodeName;
+    }
+    return titleSpan;
+  }
+  _createUl(isRootNode) {
+    let classString;
+    let role;
+    if (!isRootNode) {
+      classString = "";
+      role = "group";
+    } else {
+      classString = this._classNames.tree;
+      role = "tree";
+      if (this._rtl) {
+        classString += ` ${this._classNames.rtl}`;
+      }
+    }
+    if (this._dragAndDrop) {
+      classString += ` ${this._classNames.dnd}`;
+    }
+    const ul = document.createElement("ul");
+    ul.className = `${this._classNames.common} ${classString}`;
+    ul.setAttribute("role", role);
+    return ul;
+  }
+  _getButtonClasses(node) {
+    const classes = [this._classNames.toggler, this._classNames.common];
+    if (!node.is_open) {
+      classes.push(this._classNames.closed);
+    }
+    if (this._buttonLeft) {
+      classes.push(this._classNames.togglerLeft);
+    } else {
+      classes.push(this._classNames.togglerRight);
+    }
+    return classes.join(" ");
+  }
+  _getFolderClasses(node, isSelected) {
+    const classes = [this._classNames.folder];
+    if (!node.is_open) {
+      classes.push(this._classNames.closed);
+    }
+    if (isSelected) {
+      classes.push(this._classNames.selected);
+    }
+    if (node.is_loading) {
+      classes.push(this._classNames.loading);
+    }
+    return classes.join(" ");
+  }
+  _setTreeItemAriaAttributes(element, name, level, isSelected) {
+    element.setAttribute("aria-label", name);
+    element.setAttribute("aria-level", `${level}`);
+    element.setAttribute("aria-selected", getBoolString(isSelected));
+    element.setAttribute("role", "treeitem");
+  }
+}
+
+export { ElementsRenderer as default };
+//# sourceMappingURL=elementsRenderer.js.map

package/lib/elementsRenderer.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"elementsRenderer.js","sources":["../src/elementsRenderer.ts"],"sourcesContent":["import type { ClassNames } from \"./classNames\";\nimport type { GetTree, IsNodeSelected } from \"./methodTypes\";\nimport type { Node } from \"./node\";\nimport type { IconElement, OnCreateLi } from \"./options\";\n\nimport { getBoolString } from \"./util\";\n\ninterface ElementsRendererParams {\n    autoEscape: boolean;\n    buttonLeft: boolean;\n    classNames: ClassNames;\n    closedIcon?: IconElement;\n    dragAndDrop: boolean;\n    getTree: GetTree;\n    htmlElement: HTMLElement;\n    isNodeSelected: IsNodeSelected;\n    onCreateLi?: OnCreateLi;\n    openedIcon?: IconElement;\n    rtl?: boolean;\n    setNodeElement: (element: HTMLElement, node: Node) => void;\n    showEmptyFolder: boolean;\n    tabIndex?: number;\n}\n\nexport default class ElementsRenderer {\n    public closedIconElement?: HTMLElement | Text;\n    public openedIconElement?: HTMLElement | Text;\n    private autoEscape: boolean;\n    private buttonLeft: boolean;\n    private classNames: ClassNames;\n    private dragAndDrop: boolean;\n    private getTree: GetTree;\n    private htmlElement: HTMLElement;\n    private isNodeSelected: IsNodeSelected;\n    private onCreateLi?: OnCreateLi;\n    private rtl?: boolean;\n    private setNodeElement: (element: HTMLElement, node: Node) => void;\n    private showEmptyFolder: boolean;\n    private tabIndex?: number;\n\n    constructor({\n        autoEscape,\n        buttonLeft,\n        classNames,\n        closedIcon,\n        dragAndDrop,\n        getTree,\n        htmlElement,\n        isNodeSelected,\n        onCreateLi,\n        openedIcon,\n        rtl,\n        setNodeElement,\n        showEmptyFolder,\n        tabIndex,\n    }: ElementsRendererParams) {\n        this.autoEscape = autoEscape;\n        this.buttonLeft = buttonLeft;\n        this.classNames = classNames;\n        this.dragAndDrop = dragAndDrop;\n        this.getTree = getTree;\n        this.htmlElement = htmlElement;\n        this.isNodeSelected = isNodeSelected;\n        this.onCreateLi = onCreateLi;\n        this.rtl = rtl;\n        this.setNodeElement = setNodeElement;\n        this.showEmptyFolder = showEmptyFolder;\n        this.tabIndex = tabIndex;\n        this.openedIconElement = this.createButtonElement(openedIcon ?? \"+\");\n        this.closedIconElement = this.createButtonElement(closedIcon ?? \"-\");\n    }\n\n    public render(fromNode: Node | null): void {\n        if (fromNode?.parent) {\n            this.renderFromNode(fromNode);\n        } else {\n            this.renderFromRoot();\n        }\n    }\n\n    public renderFromNode(node: Node): void {\n        if (!node.element) {\n            return;\n        }\n\n        const currentLi = node.element;\n        const newLi = this.createLi(node, node.getLevel());\n        currentLi.replaceWith(newLi);\n\n        // create children\n        this.createDomElements(newLi, node.children, false, node.getLevel() + 1);\n    }\n\n    public renderFromRoot(): void {\n        this.htmlElement.textContent = '';\n\n        const tree = this.getTree();\n\n        if (tree) {\n            this.createDomElements(this.htmlElement, tree.children, true, 1);\n        }\n    }\n\n    private attachNodeData(node: Node, li: HTMLElement): void {\n        node.element = li;\n        this.setNodeElement(li, node);\n    }\n\n    private createButtonElement(\n        value: IconElement,\n    ): HTMLElement | Text | undefined {\n        if (typeof value === \"string\") {\n            // convert value to html\n            const div = document.createElement(\"div\");\n            div.innerHTML = value;\n\n            return document.createTextNode(div.innerHTML);\n        } else if (value.nodeType) {\n            return value;\n        } else {\n            return undefined;\n        }\n    }\n\n    private createDomElements(\n        element: Element,\n        children: Node[],\n        isRootNode: boolean,\n        level: number,\n    ): void {\n        const ul = this.createUl(isRootNode);\n        element.appendChild(ul);\n\n        for (const child of children) {\n            const li = this.createLi(child, level);\n            ul.appendChild(li);\n\n            if (child.hasChildren()) {\n                this.createDomElements(li, child.children, false, level + 1);\n            }\n        }\n    }\n\n    private createFolderLi(\n        node: Node,\n        level: number,\n        isSelected: boolean,\n    ): HTMLLIElement {\n        const buttonClasses = this.getButtonClasses(node);\n        const folderClasses = this.getFolderClasses(node, isSelected);\n\n        const iconElement = node.is_open\n            ? this.openedIconElement\n            : this.closedIconElement;\n\n        // li\n        const li = document.createElement(\"li\");\n        li.className = `${this.classNames.common} ${folderClasses}`;\n        li.setAttribute(\"role\", \"none\");\n\n        // div\n        const div = document.createElement(\"div\");\n        div.className = `${this.classNames.element} ${this.classNames.common}`;\n        div.setAttribute(\"role\", \"none\");\n\n        li.appendChild(div);\n\n        // button link\n        const buttonLink = document.createElement(\"a\");\n        buttonLink.className = buttonClasses;\n\n        if (iconElement) {\n            buttonLink.appendChild(iconElement.cloneNode(true));\n        }\n\n        if (this.buttonLeft) {\n            div.appendChild(buttonLink);\n        }\n\n        // title span\n        const titleSpan = this.createTitleSpan(\n            node.name,\n            isSelected,\n            true,\n            level,\n        );\n        titleSpan.setAttribute(\"aria-expanded\", getBoolString(node.is_open));\n        div.appendChild(titleSpan);\n\n        if (!this.buttonLeft) {\n            div.appendChild(buttonLink);\n        }\n\n        return li;\n    }\n\n    /* Create the <li> element\n     * Attach it to node.element.\n     * Call onCreateLi\n     */\n    private createLi(node: Node, level: number): HTMLLIElement {\n        const isSelected = this.isNodeSelected(node);\n\n        const mustShowFolder =\n            node.isFolder() || (node.isEmptyFolder && this.showEmptyFolder);\n\n        const li = mustShowFolder\n            ? this.createFolderLi(node, level, isSelected)\n            : this.createNodeLi(node, level, isSelected);\n\n        this.attachNodeData(node, li);\n\n        if (this.onCreateLi) {\n            this.onCreateLi(node, li, isSelected);\n        }\n\n        return li;\n    }\n\n    private createNodeLi(\n        node: Node,\n        level: number,\n        isSelected: boolean,\n    ): HTMLLIElement {\n        const liClasses = [this.classNames.common];\n\n        if (isSelected) {\n            liClasses.push(this.classNames.selected);\n        }\n\n        const classString = liClasses.join(\" \");\n\n        // li\n        const li = document.createElement(\"li\");\n        li.className = classString;\n        li.setAttribute(\"role\", \"none\");\n\n        // div\n        const div = document.createElement(\"div\");\n        div.className = `${this.classNames.element} ${this.classNames.common}`;\n        div.setAttribute(\"role\", \"none\");\n\n        li.appendChild(div);\n\n        // title span\n        const titleSpan = this.createTitleSpan(\n            node.name,\n            isSelected,\n            false,\n            level,\n        );\n        div.appendChild(titleSpan);\n\n        return li;\n    }\n\n    private createTitleSpan(\n        nodeName: string,\n        isSelected: boolean,\n        isFolder: boolean,\n        level: number,\n    ): HTMLSpanElement {\n        const titleSpan = document.createElement(\"span\");\n\n        let classes = `${this.classNames.title} ${this.classNames.common}`;\n\n        if (isFolder) {\n            classes += ` ${this.classNames.titleFolder}`;\n        }\n\n        classes += ` ${this.buttonLeft ? this.classNames.titleButtonLeft : this.classNames.titleButtonRight}`;\n\n        titleSpan.className = classes;\n\n        if (isSelected) {\n            const tabIndex = this.tabIndex;\n\n            if (tabIndex !== undefined) {\n                titleSpan.setAttribute(\"tabindex\", `${tabIndex}`);\n            }\n        }\n\n        this.setTreeItemAriaAttributes(titleSpan, nodeName, level, isSelected);\n\n        if (this.autoEscape) {\n            titleSpan.textContent = nodeName;\n        } else {\n            titleSpan.innerHTML = nodeName;\n        }\n\n        return titleSpan;\n    }\n\n    private createUl(isRootNode: boolean): HTMLUListElement {\n        let classString;\n        let role;\n\n        if (!isRootNode) {\n            classString = \"\";\n            role = \"group\";\n        } else {\n            classString = this.classNames.tree;\n            role = \"tree\";\n\n            if (this.rtl) {\n                classString += ` ${this.classNames.rtl}`;\n            }\n        }\n\n        if (this.dragAndDrop) {\n            classString += ` ${this.classNames.dnd}`;\n        }\n\n        const ul = document.createElement(\"ul\");\n        ul.className = `${this.classNames.common} ${classString}`;\n\n        ul.setAttribute(\"role\", role);\n\n        return ul;\n    }\n\n    private getButtonClasses(node: Node): string {\n        const classes = [this.classNames.toggler, this.classNames.common];\n\n        if (!node.is_open) {\n            classes.push(this.classNames.closed);\n        }\n\n        if (this.buttonLeft) {\n            classes.push(this.classNames.togglerLeft);\n        } else {\n            classes.push(this.classNames.togglerRight);\n        }\n\n        return classes.join(\" \");\n    }\n\n    private getFolderClasses(node: Node, isSelected: boolean): string {\n        const classes = [this.classNames.folder];\n\n        if (!node.is_open) {\n            classes.push(this.classNames.closed);\n        }\n\n        if (isSelected) {\n            classes.push(this.classNames.selected);\n        }\n\n        if (node.is_loading) {\n            classes.push(this.classNames.loading);\n        }\n\n        return classes.join(\" \");\n    }\n\n    private setTreeItemAriaAttributes(\n        element: HTMLElement,\n        name: string,\n        level: number,\n        isSelected: boolean,\n    ) {\n        element.setAttribute(\"aria-label\", name);\n        element.setAttribute(\"aria-level\", `${level}`);\n        element.setAttribute(\"aria-selected\", getBoolString(isSelected));\n        element.setAttribute(\"role\", \"treeitem\");\n    }\n}\n"],"names":["autoEscape","buttonLeft","classNames","dragAndDrop","getTree","htmlElement","isNodeSelected","onCreateLi","rtl","setNodeElement","showEmptyFolder","tabIndex","createButtonElement","createLi","createDomElements","attachNodeData","createUl","createFolderLi","getButtonClasses","getFolderClasses","createTitleSpan","createNodeLi","setTreeItemAriaAttributes"],"mappings":"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"}

package/lib/events.d.ts

@@ -0,0 +1,224 @@
+import type { Node, NodeData, Position } from "./node.js";
+export interface MoveInfo {
+    doMove: () => void;
+    movedNode: Node;
+    originalEvent: Event;
+    position: Position;
+    previousParent: Node | null;
+    targetNode: Node;
+}
+export type TreeEvent<Name extends TreeEventName = TreeEventName> = CustomEvent<TreeEvents[Name]>;
+export type TreeEventName = keyof TreeEvents;
+export interface TreeEvents {
+    /**
+     * Dispatched once, after the tree is rendered for the first time. With
+     * `dataUrl` this is after the data has arrived, so it is the moment the
+     * api is safe to use:
+     *
+     * ```js
+     * element.addEventListener("tree.init", () => {
+     *   tree.selectNode(tree.getNodeByName("node1"));
+     * });
+     * ```
+     *
+     * No `detail`.
+     *
+     * With inline `data`, the tree is rendered inside the constructor, so
+     * this event has already fired by the time the constructor returns. Add
+     * the listener to the element _before_ creating the tree:
+     *
+     * ```js
+     * const element = document.getElementById("tree1");
+     *
+     * element.addEventListener("tree.init", () => {
+     *   // ...
+     * });
+     *
+     * const tree = new TreeElement({ data, htmlElement: element });
+     * ```
+     *
+     * @group Lifecycle
+     */
+    "tree.init": undefined;
+    /**
+     * Dispatched after the tree has been re-rendered. No `detail`.
+     *
+     * @group Lifecycle
+     */
+    "tree.refresh": undefined;
+    /**
+     * Dispatched when a node title is clicked. Call `preventDefault()` to
+     * stop the tree from selecting the node:
+     *
+     * ```js
+     * element.addEventListener("tree.click", (e) => {
+     *   e.preventDefault();
+     *   console.log("clicked", e.detail.node.name, "but not selected");
+     * });
+     * ```
+     *
+     * @group Mouse
+     */
+    "tree.click": {
+        node: Node;
+        originalEvent: MouseEvent;
+    };
+    /**
+     * Dispatched when a node title is double clicked.
+     *
+     * @group Mouse
+     */
+    "tree.dblclick": {
+        node: Node;
+        originalEvent: MouseEvent;
+    };
+    /**
+     * Dispatched on a right click on a node, unless `useContextMenu` is
+     * `false`. The browser's own menu is suppressed.
+     *
+     * @group Mouse
+     */
+    "tree.contextmenu": {
+        node: Node;
+        originalEvent: MouseEvent;
+    };
+    /**
+     * Dispatched when a folder is opened, after the animation.
+     *
+     * @group Opening and closing
+     */
+    "tree.open": {
+        node: Node;
+    };
+    /**
+     * Dispatched when a folder is closed, after the animation.
+     *
+     * @group Opening and closing
+     */
+    "tree.close": {
+        node: Node;
+    };
+    /**
+     * Dispatched when a node is selected. A deselection is
+     * [`tree.deselect`](#tree-deselect) instead, so `node` is always a node
+     * here.
+     *
+     * ```js
+     * element.addEventListener("tree.select", (e) => {
+     *   console.log("selected", e.detail.node.name);
+     * });
+     * ```
+     *
+     * @group Selection
+     */
+    "tree.select": {
+        /** The node that was selected before, if any. */
+        deselectedNode: Node | null;
+        /** The node that is now selected. */
+        node: Node;
+    };
+    /**
+     * Dispatched when the selected node is deselected, which happens when it
+     * is clicked again or passed to `selectNode` again. No `tree.select` is
+     * dispatched for it.
+     *
+     * ```js
+     * element.addEventListener("tree.deselect", (e) => {
+     *   console.log("deselected", e.detail.node.name);
+     * });
+     * ```
+     *
+     * Selecting another node does not dispatch it — that is a `tree.select`
+     * with the previous node in `deselectedNode`. It is also not dispatched
+     * with `mustToggle: false`, or by `selectNode(null)`,
+     * `removeFromSelection`, `removeNode`, `loadData` and restoring a saved
+     * state.
+     *
+     * @group Selection
+     */
+    "tree.deselect": {
+        node: Node;
+    };
+    /**
+     * Dispatched when a node is dropped after a drag.
+     *
+     * | `detail`                  | Type                              |
+     * | ------------------------- | --------------------------------- |
+     * | `moveInfo.movedNode`      | `Node`                            |
+     * | `moveInfo.targetNode`     | `Node`                            |
+     * | `moveInfo.position`       | `"before" \| "after" \| "inside"` |
+     * | `moveInfo.previousParent` | `Node \| null`                    |
+     * | `moveInfo.originalEvent`  | `Event`                           |
+     * | `moveInfo.doMove`         | `() => void`                      |
+     *
+     * Call `preventDefault()` to keep the tree as it is, and
+     * `moveInfo.doMove()` to apply the move later. See
+     * [Drag and drop](/guide/drag-and-drop#reacting-to-a-move).
+     *
+     * @group Drag and drop
+     */
+    "tree.move": {
+        /** @hidden The fields are in the table above. */
+        moveInfo: MoveInfo;
+    };
+    /**
+     * Dispatched when data is set on the tree, both from the `data` option
+     * and from a url.
+     *
+     * @group Loading data
+     */
+    "tree.set_data": {
+        /** The node whose children were replaced, if it was a subtree. */
+        node?: Node;
+        treeData?: NodeData[];
+    };
+    /**
+     * Dispatched when a request starts.
+     *
+     * @group Loading data
+     */
+    "tree.loading_data": {
+        element: HTMLElement;
+        /** The node whose children are loading, if it is a subtree. */
+        node?: Node;
+    };
+    /**
+     * Dispatched when a request finishes. It is dispatched when the request
+     * fails too; a [`tree.load_failed`](#tree-load-failed) follows it.
+     *
+     * @group Loading data
+     */
+    "tree.loaded_data": {
+        element: HTMLElement;
+        /** The node whose children were loaded, if it was a subtree. */
+        node?: Node;
+    };
+    /**
+     * Dispatched when a request returns an error status, after
+     * `tree.loaded_data`:
+     *
+     * ```js
+     * element.addEventListener("tree.load_failed", (e) => {
+     *   console.error("loading the tree failed", e.detail.response.status);
+     * });
+     * ```
+     *
+     * @group Loading data
+     */
+    "tree.load_failed": {
+        response: Response;
+    };
+}
+type TreeEventMap = {
+    [Name in TreeEventName]: TreeEvent<Name>;
+};
+declare global {
+    interface DocumentEventMap extends TreeEventMap {
+    }
+    interface HTMLElementEventMap extends TreeEventMap {
+    }
+    interface WindowEventMap extends TreeEventMap {
+    }
+}
+export {};
+//# sourceMappingURL=events.d.ts.map

package/lib/events.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"events.d.ts","sourceRoot":"","sources":["../src/events.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,IAAI,EAAE,QAAQ,EAAE,QAAQ,EAAE,MAAM,QAAQ,CAAC;AAEvD,MAAM,WAAW,QAAQ;IACrB,MAAM,EAAE,MAAM,IAAI,CAAC;IACnB,SAAS,EAAE,IAAI,CAAC;IAChB,aAAa,EAAE,KAAK,CAAC;IACrB,QAAQ,EAAE,QAAQ,CAAC;IACnB,cAAc,EAAE,IAAI,GAAG,IAAI,CAAC;IAC5B,UAAU,EAAE,IAAI,CAAC;CACpB;AAGD,MAAM,MAAM,SAAS,CAAC,IAAI,SAAS,aAAa,GAAG,aAAa,IAAI,WAAW,CAC3E,UAAU,CAAC,IAAI,CAAC,CACnB,CAAC;AAEF,MAAM,MAAM,aAAa,GAAG,MAAM,UAAU,CAAC;AAO7C,MAAM,WAAW,UAAU;IACvB;;;;;;;;;;;;;;;;;;;;;;;;;;;;OA4BG;IACH,WAAW,EAAE,SAAS,CAAC;IACvB;;;;OAIG;IACH,cAAc,EAAE,SAAS,CAAC;IAC1B;;;;;;;;;;;;OAYG;IACH,YAAY,EAAE;QACV,IAAI,EAAE,IAAI,CAAC;QACX,aAAa,EAAE,UAAU,CAAC;KAC7B,CAAC;IACF;;;;OAIG;IACH,eAAe,EAAE;QACb,IAAI,EAAE,IAAI,CAAC;QACX,aAAa,EAAE,UAAU,CAAC;KAC7B,CAAC;IACF;;;;;OAKG;IACH,kBAAkB,EAAE;QAChB,IAAI,EAAE,IAAI,CAAC;QACX,aAAa,EAAE,UAAU,CAAC;KAC7B,CAAC;IACF;;;;OAIG;IACH,WAAW,EAAE;QACT,IAAI,EAAE,IAAI,CAAC;KACd,CAAC;IACF;;;;OAIG;IACH,YAAY,EAAE;QACV,IAAI,EAAE,IAAI,CAAC;KACd,CAAC;IACF;;;;;;;;;;;;OAYG;IACH,aAAa,EAAE;QACX,iDAAiD;QACjD,cAAc,EAAE,IAAI,GAAG,IAAI,CAAC;QAC5B,qCAAqC;QACrC,IAAI,EAAE,IAAI,CAAC;KACd,CAAC;IACF;;;;;;;;;;;;;;;;;;OAkBG;IACH,eAAe,EAAE;QACb,IAAI,EAAE,IAAI,CAAC;KACd,CAAC;IACF;;;;;;;;;;;;;;;;;OAiBG;IACH,WAAW,EAAE;QACT,iDAAiD;QACjD,QAAQ,EAAE,QAAQ,CAAC;KACtB,CAAC;IACF;;;;;OAKG;IACH,eAAe,EAAE;QACb,kEAAkE;QAClE,IAAI,CAAC,EAAE,IAAI,CAAC;QACZ,QAAQ,CAAC,EAAE,QAAQ,EAAE,CAAC;KACzB,CAAC;IACF;;;;OAIG;IACH,mBAAmB,EAAE;QACjB,OAAO,EAAE,WAAW,CAAC;QACrB,+DAA+D;QAC/D,IAAI,CAAC,EAAE,IAAI,CAAC;KACf,CAAC;IACF;;;;;OAKG;IACH,kBAAkB,EAAE;QAChB,OAAO,EAAE,WAAW,CAAC;QACrB,gEAAgE;QAChE,IAAI,CAAC,EAAE,IAAI,CAAC;KACf,CAAC;IACF;;;;;;;;;;;OAWG;IACH,kBAAkB,EAAE;QAChB,QAAQ,EAAE,QAAQ,CAAC;KACtB,CAAC;CACL;AAGD,KAAK,YAAY,GAAG;KACf,IAAI,IAAI,aAAa,GAAG,SAAS,CAAC,IAAI,CAAC;CAC3C,CAAC;AAGF,OAAO,CAAC,MAAM,CAAC;IACX,UAAU,gBAAiB,SAAQ,YAAY;KAAI;IAEnD,UAAU,mBAAoB,SAAQ,YAAY;KAAI;IAEtD,UAAU,cAAe,SAAQ,YAAY;KAAI;CACpD"}