wunderbaum 0.0.3 → 0.0.6

package/dist/wunderbaum.d.ts

@@ -63,7 +63,7 @@ declare module "util" {
      *
      * If a `<span class="wb-col">` is passed, the first child input is used.
      * Depending on the target element type, `value` is interpreted accordingly.
-     * For example for a checkbox, a value of true, false, or null is returned if the
+     * For example for a checkbox, a value of true, false, or null is returned if
      * the element is checked, unchecked, or indeterminate.
      * For datetime input control a numerical value is assumed, etc.
      *
@@ -95,6 +95,8 @@ declare module "util" {
      * @param value a value that matches the target element.
      */
     export function setValueToElem(elem: HTMLElement, value: any): void;
+    /** Show/hide element by setting the `display`style to 'none'. */
+    export function setElemDisplay(elem: string | Element, flag: boolean): void;
     /** Create and return an unconnected `HTMLElement` from a HTML string. */
     export function elemFromHtml(html: string): HTMLElement;
     /** Return a HtmlElement from selector or cast an existing element. */
@@ -165,7 +167,7 @@ declare module "util" {
       */
     export function overrideMethod(instance: any, methodName: string, handler: FunctionType, ctx?: any): void;
     /** Run function after ms milliseconds and return a promise that resolves when done. */
-    export function setTimeoutPromise(callback: (...args: any[]) => void, ms: number): Promise<unknown>;
+    export function setTimeoutPromise(this: unknown, callback: (...args: any[]) => void, ms: number): Promise<unknown>;
     /**
      * Wait `ms` microseconds.
      *
@@ -198,8 +200,71 @@ declare module "util" {
     export function getOption(opts: any, name: string, defaultValue?: any): any;
     /** Convert an Array or space-separated string to a Set. */
     export function toSet(val: any): Set<string>;
-    /**Return a canonical string representation for an object's type (e.g. 'array', 'number', ...) */
+    /** Return a canonical string representation for an object's type (e.g. 'array', 'number', ...). */
     export function type(obj: any): string;
+    /**
+     * Return a function that can be called instead of `callback`, but guarantees
+     * a limited execution rate.
+     * The execution rate is calculated based on the runtime duration of the
+     * previous call.
+     * Example:
+     * ```js
+     * throttledFoo = util.adaptiveThrottle(foo.bind(this), {});
+     * throttledFoo();
+     * throttledFoo();
+     * ```
+     */
+    export function adaptiveThrottle(this: unknown, callback: (...args: any[]) => void, options: any): (...args: any[]) => void;
+}
+declare module "common" {
+    /*!
+     * Wunderbaum - common
+     * Copyright (c) 2021-2022, Martin Wendt. Released under the MIT license.
+     * @VERSION, @DATE (https://github.com/mar10/wunderbaum)
+     */
+    import { MatcherType } from "types";
+    export const DEFAULT_DEBUGLEVEL = 4;
+    export const ROW_HEIGHT = 22;
+    export const ICON_WIDTH = 20;
+    export const ROW_EXTRA_PAD = 7;
+    export const RENDER_MIN_PREFETCH = 5;
+    export const RENDER_MAX_PREFETCH = 5;
+    export const TEST_IMG: RegExp;
+    export let iconMap: {
+        error: string;
+        loading: string;
+        noData: string;
+        expanderExpanded: string;
+        expanderCollapsed: string;
+        expanderLazy: string;
+        checkChecked: string;
+        checkUnchecked: string;
+        checkUnknown: string;
+        radioChecked: string;
+        radioUnchecked: string;
+        radioUnknown: string;
+        folder: string;
+        folderOpen: string;
+        doc: string;
+    };
+    export const KEY_NODATA = "__not_found__";
+    /** Define which keys are handled by embedded <input> control, and should
+     * *not* be passed to tree navigation handler in cell-edit mode. */
+    export const INPUT_KEYS: {
+        [key: string]: Array<string>;
+    };
+    /** Dict keys that are evaluated by source loader (others are added to `tree.data` instead). */
+    export const RESERVED_TREE_SOURCE_KEYS: Set<string>;
+    /** Key codes that trigger grid navigation, even when inside an input element. */
+    export const INPUT_BREAKOUT_KEYS: Set<string>;
+    /** Map `KeyEvent.key` to navigation action. */
+    export const KEY_TO_ACTION_DICT: {
+        [key: string]: string;
+    };
+    /** Return a callback that returns true if the node title contains a substring (case-insensitive). */
+    export function makeNodeTitleMatcher(s: string): MatcherType;
+    /** Return a callback that returns true if the node title starts with a string (case-insensitive). */
+    export function makeNodeTitleStartMatcher(s: string): MatcherType;
 }
 declare module "deferred" {
     /*!
@@ -210,9 +275,19 @@ declare module "deferred" {
     type PromiseCallbackType = (val: any) => void;
     type finallyCallbackType = () => void;
     /**
-     * Deferred is a ES6 Promise, that exposes the resolve() and reject()` method.
+     * Implement a ES6 Promise, that exposes a resolve() and reject() method.
      *
-     * Loosely mimics [`jQuery.Deferred`](https://api.jquery.com/category/deferred-object/).
+     * Loosely mimics {@link https://api.jquery.com/category/deferred-object/ | jQuery.Deferred}.
+     * Example:
+     * ```js
+     * function foo() {
+     *   let dfd = new Deferred(),
+     *   ...
+     *   dfd.resolve('foo')
+     *   ...
+     *   return dfd.promise();
+     * }
+     * ```
      */
     export class Deferred {
         private _promise;
@@ -233,174 +308,13 @@ declare module "deferred" {
         finally(cb: finallyCallbackType): Promise<any>;
     }
 }
-declare module "wb_extension_base" {
-    import { Wunderbaum } from "wunderbaum";
-    export type ExtensionsDict = {
-        [key: string]: WunderbaumExtension;
-    };
-    export abstract class WunderbaumExtension {
-        enabled: boolean;
-        readonly id: string;
-        readonly tree: Wunderbaum;
-        readonly treeOpts: any;
-        readonly extensionOpts: any;
-        constructor(tree: Wunderbaum, id: string, defaults: any);
-        /** Called on tree (re)init after all extensions are added, but before loading.*/
-        init(): void;
-        getPluginOption(name: string, defaultValue?: any): any;
-        setPluginOption(name: string, value: any): void;
-        setEnabled(flag?: boolean): void;
-        onKeyEvent(data: any): boolean | undefined;
-        onRender(data: any): boolean | undefined;
-    }
-}
-declare module "wb_ext_dnd" {
-    import { Wunderbaum } from "wunderbaum";
-    import { WunderbaumExtension } from "wb_extension_base";
-    import { WunderbaumNode } from "wb_node";
-    import { WbNodeEventType } from "common";
-    export type DropRegionType = "over" | "before" | "after";
-    type DropRegionTypeSet = Set<DropRegionType>;
-    export type DndOptionsType = {
-        /**
-         * Expand nodes after n milliseconds of hovering
-         * Default: 1500
-         */
-        autoExpandMS: 1500;
-        /**
-         * true: Drag multiple (i.e. selected) nodes. Also a callback() is allowed
-         * Default: false
-         */
-        multiSource: false;
-        /**
-         * Restrict the possible cursor shapes and modifier operations (can also be set in the dragStart event)
-         * Default: "all"
-         */
-        effectAllowed: "all";
-        /**
-         * Default dropEffect ('copy', 'link', or 'move') when no modifier is pressed (overide in dragDrag, dragOver).
-         * Default: "move"
-         */
-        dropEffectDefault: string;
-        /**
-         * Prevent dropping nodes from different Wunderbaum trees
-         * Default: false
-         */
-        preventForeignNodes: boolean;
-        /**
-         * Prevent dropping items on unloaded lazy Wunderbaum tree nodes
-         * Default: true
-         */
-        preventLazyParents: boolean;
-        /**
-         * Prevent dropping items other than Wunderbaum tree nodes
-         * Default: false
-         */
-        preventNonNodes: boolean;
-        /**
-         * Prevent dropping nodes on own descendants
-         * Default: true
-         */
-        preventRecursion: boolean;
-        /**
-         * Prevent dropping nodes under same direct parent
-         * Default: false
-         */
-        preventSameParent: false;
-        /**
-         * Prevent dropping nodes 'before self', etc. (move only)
-         * Default: true
-         */
-        preventVoidMoves: boolean;
-        /**
-         * Enable auto-scrolling while dragging
-         * Default: true
-         */
-        scroll: boolean;
-        /**
-         * Active top/bottom margin in pixel
-         * Default: 20
-         */
-        scrollSensitivity: 20;
-        /**
-         * Pixel per event
-         * Default: 5
-         */
-        scrollSpeed: 5;
-        /**
-         * Optional callback passed to `toDict` on dragStart @since 2.38
-         * Default: null
-         */
-        sourceCopyHook: null;
-        /**
-         * Callback(sourceNode, data), return true, to enable dnd drag
-         * Default: null
-         */
-        dragStart?: WbNodeEventType;
-        /**
-         * Callback(sourceNode, data)
-         * Default: null
-         */
-        dragDrag: null;
-        /**
-         * Callback(sourceNode, data)
-         * Default: null
-         */
-        dragEnd: null;
-        /**
-         * Callback(targetNode, data), return true, to enable dnd drop
-         * Default: null
-         */
-        dragEnter: null;
-        /**
-         * Callback(targetNode, data)
-         * Default: null
-         */
-        dragOver: null;
-        /**
-         * Callback(targetNode, data), return false to prevent autoExpand
-         * Default: null
-         */
-        dragExpand: null;
-        /**
-         * Callback(targetNode, data)
-         * Default: null
-         */
-        dragDrop: null;
-        /**
-         * Callback(targetNode, data)
-         * Default: null
-         */
-        dragLeave: null;
-    };
-    export class DndExtension extends WunderbaumExtension {
-        protected srcNode: WunderbaumNode | null;
-        protected lastTargetNode: WunderbaumNode | null;
-        protected lastEnterStamp: number;
-        protected lastAllowedDropRegions: DropRegionTypeSet | null;
-        protected lastDropEffect: string | null;
-        protected lastDropRegion: DropRegionType | false;
-        constructor(tree: Wunderbaum);
-        init(): void;
-        /** Cleanup classes after target node is no longer hovered. */
-        protected _leaveNode(): void;
-        /** */
-        protected unifyDragover(res: any): DropRegionTypeSet | false;
-        /** */
-        protected _calcDropRegion(e: DragEvent, allowed: DropRegionTypeSet | null): DropRegionType | false;
-        protected autoScroll(event: DragEvent): number;
-        protected onDragEvent(e: DragEvent): boolean;
-        protected onDropEvent(e: DragEvent): boolean;
-    }
-}
 declare module "wb_options" {
     /*!
      * Wunderbaum - utils
      * Copyright (c) 2021-2022, Martin Wendt. Released under the MIT license.
      * @VERSION, @DATE (https://github.com/mar10/wunderbaum)
      */
-    import { BoolOptionResolver, NavigationModeOption, WbNodeEventType, WbTreeEventType } from "common";
-    import { DndOptionsType } from "wb_ext_dnd";
+    import { BoolOptionResolver, ColumnDefinitionList, DndOptionsType, NavigationOptions, NodeTypeDefinitions, WbNodeEventType, WbRenderEventType, WbTreeEventType } from "types";
     export interface WbNodeData {
         title: string;
         key?: string;
@@ -423,6 +337,21 @@ declare module "wb_options" {
      *   ...
      * });
      * ```
+     *
+     * Event handlers are also passed as callbacks
+     *
+     * ```js
+     * const tree = new mar10.Wunderbaum({
+     *   ...
+     *   init: (e) => {
+     *     console.log(`Tree ${e.tree} was initialized and loaded.`)
+     *   },
+     *   activate: (e) => {
+     *     console.log(`Node ${e.node} was activated.`)
+     *   },
+     *   ...
+     * });
+     * ```
      */
     export interface WunderbaumOptions {
         /**
@@ -451,7 +380,7 @@ declare module "wb_options" {
          *
          * Default: `{}`.
          */
-        types?: any;
+        types?: NodeTypeDefinitions;
         /**
          * A list of maps that define column headers. If this option is set,
          * Wunderbaum becomes a treegrid control instead of a plain tree.
@@ -459,7 +388,7 @@ declare module "wb_options" {
          * response.
          * Default: `[]` meaning this is a plain tree.
          */
-        columns?: Array<any>;
+        columns?: ColumnDefinitionList;
         /**
          * If true, add a `wb-skeleton` class to all nodes, that will result in a
          * 'glow' effect. Typically used with initial dummy nodes, while loading the
@@ -478,14 +407,10 @@ declare module "wb_options" {
         debugLevel: number;
         /**
          * Number of levels that are forced to be expanded, and have no expander icon.
-         *  Default: 0
+         * E.g. 1 would keep all toplevel nodes expanded.
+         * Default: 0
          */
         minExpandLevel?: number;
-        /**
-         * Height of the header row div.
-         * Default: 22
-         */
-        headerHeightPx: number;
         /**
          * Height of a node row div.
          * Default: 22
@@ -497,11 +422,20 @@ declare module "wb_options" {
          */
         autoCollapse?: boolean;
         /**
-         * Default:  NavigationModeOption.startRow
+         * HTMLElement that receives the top nodes breadcrumb.
+         * Default: undefined
+         */
+        connectTopBreadcrumb?: HTMLElement;
+        /**
+         * Default:  NavigationOptions.startRow
          */
-        navigationMode?: NavigationModeOption;
+        navigationModeOption?: NavigationOptions;
         /**
-         * Show/hide header (pass bool or string)
+         * Show/hide header (default: null)
+         * null: assume false for plain tree and true for grids.
+         * string: use text as header (only for plain trees)
+         * true: display a header (use tree's id as text for plain trees)
+         * false: do not display a header
          */
         header?: boolean | string | null;
         /**
@@ -509,51 +443,61 @@ declare module "wb_options" {
          */
         showSpinner?: boolean;
         /**
-         * Default: true
+         * If true, render a checkbox before the node tile to allow selection with the
+         * mouse.
+         * Default: false.
          */
         checkbox?: boolean | "radio" | BoolOptionResolver;
         /**
          * Default: 200
          */
         updateThrottleWait?: number;
+        /**
+         * Default: true
+         */
+        enabled?: boolean;
+        /**
+         * Default: false
+         */
+        fixedCol?: boolean;
         /**
          * Default: true
          */
         quicksearch?: boolean;
         dnd?: DndOptionsType;
+        edit: any;
         filter: any;
         grid: any;
-        /**
-         * Called after initial data was loaded and tree markup was rendered.
-         * Check `e.error` for status.
-         * @category Callback
-         */
-        init?: (e: WbTreeEventType) => void;
         /**
          *
          * @category Callback
          */
-        update?: (e: WbTreeEventType) => void;
+        activate?: (e: WbNodeEventType) => void;
         /**
          *
          * @category Callback
          */
-        activate?: (e: WbNodeEventType) => void;
+        change?: (e: WbNodeEventType) => void;
         /**
          *
+         * Return `false` to prevent default handling, e.g. activating the node.
          * @category Callback
          */
-        deactivate?: (e: WbNodeEventType) => void;
+        click?: (e: WbTreeEventType) => void;
         /**
          *
+         * Return `false` to prevent default handling, e.g. activating the node.
          * @category Callback
          */
-        change?: (e: WbNodeEventType) => void;
+        beforeActivate?: (e: WbNodeEventType) => void;
+        /**
         /**
          *
+         * Return `false` to prevent default handling, e.g. deactivating the node
+         * and activating the next.
          * @category Callback
          */
-        click?: (e: WbTreeEventType) => void;
+        deactivate?: (e: WbNodeEventType) => void;
         /**
          *
          * @category Callback
@@ -563,25 +507,42 @@ declare module "wb_options" {
          *
          * @category Callback
          */
-        error?: (e: WbTreeEventType) => void;
+        enhanceTitle?: (e: WbNodeEventType) => void;
         /**
          *
          * @category Callback
          */
-        enhanceTitle?: (e: WbNodeEventType) => void;
+        error?: (e: WbTreeEventType) => void;
         /**
          *
          * Check `e.flag` for status.
          * @category Callback
          */
         focus?: (e: WbTreeEventType) => void;
+        /**
+         * Fires when the tree markup was created and the initial source data was loaded.
+         * Typical use cases would be activating a node, setting focus, enabling other
+         * controls on the page, etc.<br>
+         * Check `e.error` for status.
+         * @category Callback
+         */
+        init?: (e: WbTreeEventType) => void;
         /**
          *
          * @category Callback
          */
         keydown?: (e: WbNodeEventType) => void;
         /**
-         * Called after data was loaded from local storage.
+         * Fires when a node that was marked 'lazy', is expanded for the first time.
+         * Typically we return an endpoint URL or the Promise of a fetch request that
+         * provides a (potentially nested) list of child nodes.
+         * @category Callback
+         */
+        lazyLoad?: (e: WbNodeEventType) => void;
+        /**
+         * Fires when data was loaded (initial request, reload, or lazy loading),
+         * after the data is applied and rendered.
+         * @category Callback
          */
         load?: (e: WbNodeEventType) => void;
         /**
@@ -589,15 +550,22 @@ declare module "wb_options" {
          */
         modifyChild?: (e: WbNodeEventType) => void;
         /**
-         *
+         * Fires when data was fetched (initial request, reload, or lazy loading),
+         * but before the data is applied and rendered.
+         * Here we can modify and adjust the received data, for example to convert an
+         * external response to native Wunderbaum syntax.
          * @category Callback
          */
         receive?: (e: WbNodeEventType) => void;
         /**
-         *
+         * Fires when a node is about to be displayed.
+         * The default HTML markup is already created, but not yet added to the DOM.
+         * Now we can tweak the markup, create HTML elements in this node's column
+         * cells, etc.
+         * See also `Custom Rendering` for details.
          * @category Callback
          */
-        render?: (e: WbNodeEventType) => void;
+        render?: (e: WbRenderEventType) => void;
         /**
          *
          * @category Callback
@@ -609,6 +577,11 @@ declare module "wb_options" {
          * @category Callback
          */
         select?: (e: WbNodeEventType) => void;
+        /**
+         * Fires when the viewport content was updated, after scroling, expanding etc.
+         * @category Callback
+         */
+        update?: (e: WbTreeEventType) => void;
     }
 }
 declare module "wb_node" {
@@ -619,7 +592,7 @@ declare module "wb_node" {
      */
     import "./wunderbaum.scss";
     import { Wunderbaum } from "wunderbaum";
-    import { ChangeType, MatcherType, NodeAnyCallback, NodeStatusType, NodeVisitCallback, NodeVisitResponse, ApplyCommandType, AddNodeType, SetActiveOptions, SetExpandedOptions, SetSelectedOptions } from "common";
+    import { AddNodeType, ApplyCommandType, ChangeType, MakeVisibleOptions, MatcherType, NodeAnyCallback, NodeStatusType, NodeVisitCallback, NodeVisitResponse, ScrollIntoViewOptions, SetActiveOptions, SetExpandedOptions, SetSelectedOptions, SetStatusOptions } from "types";
     import { WbNodeData } from "wb_options";
     /**
      * A single tree node.
@@ -647,6 +620,7 @@ declare module "wb_node" {
         readonly refKey: string | undefined;
         children: WunderbaumNode[] | null;
         checkbox?: boolean;
+        /** If true, (in grid mode) no cells are rendered, except for the node title.*/
         colspan?: boolean;
         icon?: boolean | string;
         lazy: boolean;
@@ -659,8 +633,8 @@ declare module "wb_node" {
         type?: string;
         tooltip?: string;
         /** Additional classes added to `div.wb-row`.
-         * @see {@link addClass}, {@link removeClass}, {@link toggleClass}. */
-        extraClasses: Set<string>;
+         * @see {@link hasClass}, {@link setClass}. */
+        classes: Set<string> | null;
         /** Custom data that was passed to the constructor */
         data: any;
         statusNodeType?: string;
@@ -689,7 +663,7 @@ declare module "wb_node" {
          * node._callEvent("edit.beforeEdit", {foo: 42})
          * ```
          */
-        _callEvent(name: string, extra?: any): any;
+        _callEvent(type: string, extra?: any): any;
         /**
          * Append (or insert) a list of child nodes.
          *
@@ -716,10 +690,16 @@ declare module "wb_node" {
          * @see {@link Wunderbaum.applyCommand}
          */
         applyCommand(cmd: ApplyCommandType, opts: any): any;
-        addClass(className: string | string[] | Set<string>): void;
-        removeClass(className: string | string[] | Set<string>): void;
-        toggleClass(className: string | string[] | Set<string>, flag: boolean): void;
-        /** */
+        /**
+         * Add/remove one or more classes to `<div class='wb-row'>`.
+         *
+         * This also maintains `node.classes`, so the class will survive a re-render.
+         *
+         * @param className one or more class names. Multiple classes can be passed
+         *     as space-separated string, array of strings, or set of strings.
+         */
+        setClass(className: string | string[] | Set<string>, flag?: boolean): void;
+        /** Call `setExpanded()` on al child nodes*/
         expandAll(flag?: boolean): Promise<void>;
         /**Find all nodes that match condition (excluding self).
          *
@@ -775,12 +755,18 @@ declare module "wb_node" {
          * Return undefined if not sure, i.e. the node is lazy and not yet loaded.
          */
         hasChildren(): boolean;
+        /** Return true if node has className set. */
+        hasClass(className: string): boolean;
         /** Return true if this node is the currently active tree node. */
         isActive(): boolean;
         /** Return true if this node is a *direct* child of `other`.
          * (See also [[isDescendantOf]].)
          */
         isChildOf(other: WunderbaumNode): boolean;
+        /** Return true if this node's title spans all columns, i.e. the node has no
+         * grid cells.
+         */
+        isColspan(): boolean;
         /** Return true if this node is a direct or indirect sub node of `other`.
          * (See also [[isChildOf]].)
          */
@@ -848,7 +834,7 @@ declare module "wb_node" {
          * @param {object} [opts] passed to `setExpanded()`.
          *     Defaults to {noAnimation: false, noEvents: false, scrollIntoView: true}
          */
-        makeVisible(opts: any): Promise<any>;
+        makeVisible(opts?: MakeVisibleOptions): Promise<any>;
         /** Move this node to targetNode. */
         moveTo(targetNode: WunderbaumNode, mode?: AddNodeType, map?: NodeAnyCallback): void;
         /** Set focus relative to this node and optionally activate.
@@ -870,12 +856,36 @@ declare module "wb_node" {
         removeChildren(): void;
         /** Remove all HTML markup from the DOM. */
         removeMarkup(): void;
-        protected _getRenderInfo(): {
-            [key: string]: any;
-        };
+        protected _getRenderInfo(): any;
         protected _createIcon(parentElem: HTMLElement, replaceChild?: HTMLElement): HTMLElement | null;
-        /** Create HTML markup for this node, i.e. the whole row. */
-        render(opts?: any): void;
+        /**
+         * Create a whole new `<div class="wb-row">` element.
+         * @see {@link WunderbaumNode.render}
+         */
+        protected _render_markup(opts: any): void;
+        /**
+         * Render `node.title`, `.icon` into an existing row.
+         *
+         * @see {@link WunderbaumNode.render}
+         */
+        protected _render_data(opts: any): void;
+        /**
+         * Update row classes to reflect active, focuses, etc.
+         * @see {@link WunderbaumNode.render}
+         */
+        protected _render_status(opts: any): void;
+        /**
+         * Create or update node's markup.
+         *
+         * `options.change` defaults to ChangeType.data, which updates the title,
+         * icon, and status. It also triggers the `render` event, that lets the user
+         * create or update the content of embeded cell elements.<br>
+         *
+         * If only the status or other class-only modifications have changed,
+         * `options.change` should be set to ChangeType.status instead for best
+         * efficiency.
+         */
+        render(options?: any): void;
         /**
          * Remove all children, collapse, and set the lazy-flag, so that the lazyLoad
          * event is triggered on next expand.
@@ -912,11 +922,11 @@ declare module "wb_node" {
         /** Make sure that this node is visible in the viewport.
          * @see {@link Wunderbaum.scrollTo|Wunderbaum.scrollTo()}
          */
-        scrollIntoView(options?: any): Promise<void>;
+        scrollIntoView(options?: ScrollIntoViewOptions): Promise<void>;
         /**
          * Activate this node, deactivate previous, send events, activate column and scroll int viewport.
          */
-        setActive(flag?: boolean, options?: SetActiveOptions): Promise<void>;
+        setActive(flag?: boolean, options?: SetActiveOptions): Promise<any>;
         /**
          * Expand or collapse this node.
          */
@@ -925,17 +935,23 @@ declare module "wb_node" {
          * Set keyboard focus here.
          * @see {@link setActive}
          */
-        setFocus(flag?: boolean, options?: any): void;
+        setFocus(flag?: boolean): void;
         /** Set a new icon path or class. */
         setIcon(): void;
         /** Change node's {@link key} and/or {@link refKey}.  */
         setKey(key: string | null, refKey: string | null): void;
-        /** Schedule a render, typically called to update after a status or data change. */
+        /**
+         * Schedule a render, typically called to update after a status or data change.
+         *
+         * `change` defaults to 'data', which handles modifcations of title, icon,
+         * and column content. It can be reduced to 'ChangeType.status' if only
+         * active/focus/selected state has changed.
+         */
         setModified(change?: ChangeType): void;
         /** Modify the check/uncheck state. */
         setSelected(flag?: boolean, options?: SetSelectedOptions): void;
         /** Display node status (ok, loading, error, noData) using styles and a dummy child node. */
-        setStatus(status: NodeStatusType, message?: string, details?: string): WunderbaumNode | null;
+        setStatus(status: NodeStatusType, options?: SetStatusOptions): WunderbaumNode | null;
         /** Rename this node. */
         setTitle(title: string): void;
         /**
@@ -983,53 +999,158 @@ declare module "wb_node" {
         isMatched(): boolean;
     }
 }
-declare module "common" {
+declare module "types" {
+    /*!
+     * Wunderbaum - types
+     * Copyright (c) 2021-2022, Martin Wendt. Released under the MIT license.
+     * @VERSION, @DATE (https://github.com/mar10/wunderbaum)
+     */
     import { WunderbaumNode } from "wb_node";
     import { Wunderbaum } from "wunderbaum";
     export type MatcherType = (node: WunderbaumNode) => boolean;
     export type BoolOptionResolver = (node: WunderbaumNode) => boolean;
-    export const DEFAULT_DEBUGLEVEL = 4;
-    export const ROW_HEIGHT = 22;
-    export const ICON_WIDTH = 20;
-    export const ROW_EXTRA_PAD = 7;
-    export const RENDER_MIN_PREFETCH = 5;
-    export const RENDER_MAX_PREFETCH = 5;
-    export const TEST_IMG: RegExp;
     export type NodeAnyCallback = (node: WunderbaumNode) => any;
     export type NodeVisitResponse = "skip" | boolean | void;
     export type NodeVisitCallback = (node: WunderbaumNode) => NodeVisitResponse;
-    export type WbTreeEventType = {
-        name: string;
-        event: Event;
+    export interface WbTreeEventType {
+        /** Name of the event. */
+        type: string;
+        /** The affected tree. */
         tree: Wunderbaum;
+        /** Originating HTML event, e.g. `click` if any. */
+        event?: Event;
+    }
+    export interface WbNodeEventType extends WbTreeEventType {
+        /** The affected target node. */
+        node: WunderbaumNode;
+        /**
+         * Contains the node's type information, i.e. `tree.types[node.type]` if
+         * defined. Set to `{}` otherwise. @see {@link Wunderbaum.types}
+         */
+        typeInfo: NodeTypeDefinition;
+    }
+    export interface WbRenderEventType extends WbNodeEventType {
+        /**
+         * True if the node's markup was not yet created. In this case the render
+         * event should create embeddeb input controls (in addition to update the
+         * values according to to current node data).
+         */
+        isNew: boolean;
+        /** True if the node only displays the title and is stretched over all remaining columns. */
+        isColspan: boolean;
+        /** The node's `<span class='wb-node'>` element. */
+        nodeElem: HTMLSpanElement;
+        /**
+         * Array of node's `<span class='wb-col'>` elements.
+         * The first element is `<span class='wb-node wb-col'>`, which contains the
+         * node title and icon (`idx: 0`, id: '*'`).
+         */
+        allColInfosById: ColumnEventInfos;
+        /**
+         * Array of node's `<span class='wb-node'>` elements, *that should be rendered*.
+         * In contrast to `allColInfosById`, the node title is not part of this array.
+         * If node.isColspan() is true, this array is empty (`[]`).
+         */
+        renderColInfosById: ColumnEventInfos;
+    }
+    /**
+     * Contains the node's type information, i.e. `tree.types[node.type]` if
+     * defined. @see {@link Wunderbaum.types}
+     */
+    export interface NodeTypeDefinition {
+        /** En/disable checkbox for matching nodes.*/
+        checkbox?: boolean | BoolOptionResolver;
+        /** En/disable checkbox for matching nodes.*/
+        colspan?: boolean | BoolOptionResolver;
+        /** Optional class names that are added to all `div.wb-row` elements of matching nodes.*/
+        classes?: string;
+        /**Default icon for matching nodes.*/
+        icon?: boolean | string | BoolOptionResolver;
+        /**
+         * See also {@link WunderbaumNode.getOption|WunderbaumNode.getOption()}
+         * to evaluate `node.NAME` setting and `tree.types[node.type].NAME`.
+         */
         [key: string]: unknown;
+    }
+    export type NodeTypeDefinitions = {
+        [type: string]: NodeTypeDefinition;
     };
-    export type WbNodeEventType = WbTreeEventType & {
-        node: WunderbaumNode;
+    /**
+     * @see {@link `Wunderbaum.columns`}
+     */
+    export interface ColumnDefinition {
+        /** Column ID as defined in `tree.columns` definition ("*" for title column). */
+        id: string;
+        /** Column header (defaults to id) */
+        title: string;
+        /** Column header tooltip (optional) */
+        tooltip?: string;
+        /** Column width or weight.
+         * Either an absolute pixel value (e.g. `"50px"`) or a relative weight (e.g. `1`)
+         * that is used to calculate the width  inside the remaining available space.
+         * Default: `"*"`, which is interpreted as `1`.
+         */
+        width?: string | number;
+        /** Only used for columns with a relative weight.
+         * Default: `4px`.
+         */
+        minWidth?: string | number;
+        /** Optional class names that are added to all `span.wb-col` elements of that column.*/
+        classes?: string;
+        /** Optional HTML content that is rendered into all `span.wb-col` elements of that column.*/
+        html?: string;
+        _weight?: number;
+        _widthPx?: number;
+        _ofsPx?: number;
+    }
+    export type ColumnDefinitionList = Array<ColumnDefinition>;
+    export interface ColumnEventInfo {
+        /** Column ID as defined in `tree.columns` definition ("*" for title column). */
+        id: string;
+        /** Column index (0: leftmost title column). */
+        idx: number;
+        /** The cell's `<span class='wb-col'>` element (null for plain trees). */
+        elem: HTMLSpanElement | null;
+        /** The value of `tree.columns[]` for the current index. */
+        info: ColumnDefinition;
+    }
+    export type ColumnEventInfos = {
+        [colId: string]: ColumnEventInfo;
     };
     export type WbTreeCallbackType = (e: WbTreeEventType) => any;
     export type WbNodeCallbackType = (e: WbNodeEventType) => any;
+    export type WbRenderCallbackType = (e: WbRenderEventType) => void;
     export type FilterModeType = null | "dim" | "hide";
     export type ApplyCommandType = "moveUp" | "moveDown" | "indent" | "outdent" | "remove" | "rename" | "addChild" | "addSibling" | "cut" | "copy" | "paste" | "down" | "first" | "last" | "left" | "pageDown" | "pageUp" | "parent" | "right" | "up";
     export type NodeFilterResponse = "skip" | "branch" | boolean | void;
     export type NodeFilterCallback = (node: WunderbaumNode) => NodeFilterResponse;
     export type AddNodeType = "before" | "after" | "prependChild" | "appendChild";
     export type DndModeType = "before" | "after" | "over";
+    /** Possible values for `setModified()`. */
     export enum ChangeType {
+        /** Re-render the whole viewport, headers, and all rows. */
         any = "any",
+        /** Update current row title, icon, columns, and status. */
+        data = "data",
+        /** Redraw the header and update the width of all row columns. */
+        header = "header",
+        /** Re-render the whole current row. */
         row = "row",
+        /** Alias for 'any'. */
         structure = "structure",
+        /** Update current row's classes, to reflect active, selected, ... */
         status = "status",
-        vscroll = "vscroll",
-        header = "header"
+        /** Update the 'top' property of all rows. */
+        vscroll = "vscroll"
     }
+    /** Possible values for `setStatus()`. */
     export enum NodeStatusType {
         ok = "ok",
         loading = "loading",
         error = "error",
         noData = "noData"
     }
-    /**Define the subregion of a node, where an event occurred. */
+    /** Define the subregion of a node, where an event occurred. */
     export enum TargetType {
         unknown = "",
         checkbox = "checkbox",
@@ -1039,82 +1160,222 @@ declare module "common" {
         prefix = "prefix",
         title = "title"
     }
-    export let iconMap: {
-        error: string;
-        loading: string;
-        noData: string;
-        expanderExpanded: string;
-        expanderCollapsed: string;
-        expanderLazy: string;
-        checkChecked: string;
-        checkUnchecked: string;
-        checkUnknown: string;
-        radioChecked: string;
-        radioUnchecked: string;
-        radioUnknown: string;
-        folder: string;
-        folderOpen: string;
-        doc: string;
-    };
-    export const KEY_NODATA = "__not_found__";
-    export enum NavigationModeOption {
+    /** Initial navigation mode and possible transition. */
+    export enum NavigationOptions {
         startRow = "startRow",
         cell = "cell",
         startCell = "startCell",
         row = "row"
     }
-    export enum NavigationMode {
-        row = "row",
-        cellNav = "cellNav",
-        cellEdit = "cellEdit"
+    /** Possible values for `node.makeVisible()`. */
+    export interface MakeVisibleOptions {
+        /** Do not animate expand (currently not implemented). @default false */
+        noAnimation?: boolean;
+        /** Scroll node into visible viewport area if required. @default true */
+        scrollIntoView?: boolean;
+        /** Do not send events. @default false */
+        noEvents?: boolean;
+    }
+    /** Possible values for `node.scrollIntoView()`. */
+    export interface ScrollIntoViewOptions {
+        /** Do not animate (currently not implemented). @default false */
+        noAnimation?: boolean;
+        /** Do not send events. @default false */
+        noEvents?: boolean;
+        /** Keep this node visible at the top in any case. */
+        topNode?: WunderbaumNode;
+        /** Add N pixel offset at top. */
+        ofsY?: number;
+    }
+    /** Possible values for `tree.scrollTo()`. */
+    export interface ScrollToOptions extends ScrollIntoViewOptions {
+        /** Which node to scroll into the viewport.*/
+        node: WunderbaumNode;
     }
-    export type SetActiveOptions = {
-        /** Generate (de)activate event, even if node already has this status. */
+    /** Possible values for `node.setActive()`. */
+    export interface SetActiveOptions {
+        /** Generate (de)activate event, even if node already has this status (default: false). */
         retrigger?: boolean;
-        /** Don not generate (de)activate event. */
+        /** Do not generate (de)activate event  (default: false). */
         noEvents?: boolean;
-        /** Optional original event that will be passed to the (de)activat handler. */
+        /** Set node as focused node (default: true). */
+        focusNode?: boolean;
+        /** Set node as focused node (default: false). */
+        focusTree?: boolean;
+        /** Optional original event that will be passed to the (de)activate handler. */
         event?: Event;
         /** Call {@link setColumn}. */
         colIdx?: number;
-    };
-    export type SetExpandedOptions = {
+    }
+    /** Possible values for `node.setExpanded()`. */
+    export interface SetExpandedOptions {
         /** Ignore {@link minExpandLevel}. @default false */
         force?: boolean;
-        /** Avoid smooth scrolling. @default false */
+        /** Immediately update viewport (async otherwise). @default false */
+        immediate?: boolean;
+        /** Do not animate expand (currently not implemented). @default false */
         noAnimation?: boolean;
         /** Do not send events. @default false */
         noEvents?: boolean;
-        /** Scroll to bring expanded nodes into viewport. @default false */
+        /** Scroll up to bring expanded nodes into viewport. @default false */
         scrollIntoView?: boolean;
-    };
-    export type SetSelectedOptions = {
+    }
+    /** Possible values for `node.setSetModified()`. */
+    export interface SetModifiedOptions {
+        /** Force immediate redraw instead of throttled/async mode. @default false */
+        immediate?: boolean;
+        /** Remove HTML markup of all rendered nodes before redraw. @default false */
+        removeMarkup?: boolean;
+    }
+    /** Possible values for `node.setSelected()`. */
+    export interface SetSelectedOptions {
         /** Ignore restrictions. @default false */
         force?: boolean;
         /** Do not send events. @default false */
         noEvents?: boolean;
+    }
+    /** Possible values for `node.setSetModified()`. */
+    export interface SetStatusOptions {
+        /** Displayed as status node title. */
+        message?: string;
+        /** Used as tooltip. */
+        details?: string;
+    }
+    export type DropRegionType = "over" | "before" | "after";
+    export type DropRegionTypeSet = Set<DropRegionType>;
+    export type DndOptionsType = {
+        /**
+         * Expand nodes after n milliseconds of hovering
+         * Default: 1500
+         */
+        autoExpandMS: 1500;
+        /**
+         * true: Drag multiple (i.e. selected) nodes. Also a callback() is allowed
+         * Default: false
+         */
+        multiSource: false;
+        /**
+         * Restrict the possible cursor shapes and modifier operations (can also be set in the dragStart event)
+         * Default: "all"
+         */
+        effectAllowed: "all";
+        /**
+         * Default dropEffect ('copy', 'link', or 'move') when no modifier is pressed (overide in dragDrag, dragOver).
+         * Default: "move"
+         */
+        dropEffectDefault: string;
+        /**
+         * Prevent dropping nodes from different Wunderbaum trees
+         * Default: false
+         */
+        preventForeignNodes: boolean;
+        /**
+         * Prevent dropping items on unloaded lazy Wunderbaum tree nodes
+         * Default: true
+         */
+        preventLazyParents: boolean;
+        /**
+         * Prevent dropping items other than Wunderbaum tree nodes
+         * Default: false
+         */
+        preventNonNodes: boolean;
+        /**
+         * Prevent dropping nodes on own descendants
+         * Default: true
+         */
+        preventRecursion: boolean;
+        /**
+         * Prevent dropping nodes under same direct parent
+         * Default: false
+         */
+        preventSameParent: false;
+        /**
+         * Prevent dropping nodes 'before self', etc. (move only)
+         * Default: true
+         */
+        preventVoidMoves: boolean;
+        /**
+         * Enable auto-scrolling while dragging
+         * Default: true
+         */
+        scroll: boolean;
+        /**
+         * Active top/bottom margin in pixel
+         * Default: 20
+         */
+        scrollSensitivity: 20;
+        /**
+         * Pixel per event
+         * Default: 5
+         */
+        scrollSpeed: 5;
+        /**
+         * Optional callback passed to `toDict` on dragStart @since 2.38
+         * Default: null
+         */
+        sourceCopyHook: null;
+        /**
+         * Callback(sourceNode, data), return true, to enable dnd drag
+         * Default: null
+         */
+        dragStart?: WbNodeEventType;
+        /**
+         * Callback(sourceNode, data)
+         * Default: null
+         */
+        dragDrag: null;
+        /**
+         * Callback(sourceNode, data)
+         * Default: null
+         */
+        dragEnd: null;
+        /**
+         * Callback(targetNode, data), return true, to enable dnd drop
+         * Default: null
+         */
+        dragEnter: null;
+        /**
+         * Callback(targetNode, data)
+         * Default: null
+         */
+        dragOver: null;
+        /**
+         * Callback(targetNode, data), return false to prevent autoExpand
+         * Default: null
+         */
+        dragExpand: null;
+        /**
+         * Callback(targetNode, data)
+         * Default: null
+         */
+        dragDrop: null;
+        /**
+         * Callback(targetNode, data)
+         * Default: null
+         */
+        dragLeave: null;
     };
-    /** Define which keys are handled by embedded <input> control, and should
-     * *not* be passed to tree navigation handler in cell-edit mode: */
-    export const INPUT_KEYS: {
-        text: string[];
-        number: string[];
-        checkbox: any[];
-        link: any[];
-        radiobutton: string[];
-        "select-one": string[];
-        "select-multiple": string[];
-    };
-    /** Key codes that trigger grid navigation, even when inside an input element. */
-    export const NAVIGATE_IN_INPUT_KEYS: Set<string>;
-    /** Map `KeyEvent.key` to navigation action. */
-    export const KEY_TO_ACTION_DICT: {
-        [key: string]: string;
+}
+declare module "wb_extension_base" {
+    import { Wunderbaum } from "wunderbaum";
+    export type ExtensionsDict = {
+        [key: string]: WunderbaumExtension;
     };
-    /** */
-    export function makeNodeTitleMatcher(s: string): MatcherType;
-    /** */
-    export function makeNodeTitleStartMatcher(s: string): MatcherType;
+    export abstract class WunderbaumExtension {
+        enabled: boolean;
+        readonly id: string;
+        readonly tree: Wunderbaum;
+        readonly treeOpts: any;
+        readonly extensionOpts: any;
+        constructor(tree: Wunderbaum, id: string, defaults: any);
+        /** Called on tree (re)init after all extensions are added, but before loading.*/
+        init(): void;
+        getPluginOption(name: string, defaultValue?: any): any;
+        setPluginOption(name: string, value: any): void;
+        setEnabled(flag?: boolean): void;
+        onKeyEvent(data: any): boolean | undefined;
+        onRender(data: any): boolean | undefined;
+    }
 }
 declare module "debounce" {
     /*!
@@ -1251,7 +1512,7 @@ declare module "debounce" {
     export function throttle<F extends Procedure>(func: F, wait?: number, options?: ThrottleOptions): DebouncedFunction<F>;
 }
 declare module "wb_ext_filter" {
-    import { NodeFilterCallback } from "common";
+    import { NodeFilterCallback } from "types";
     import { Wunderbaum } from "wunderbaum";
     import { WunderbaumExtension } from "wb_extension_base";
     export class FilterExtension extends WunderbaumExtension {
@@ -1259,6 +1520,7 @@ declare module "wb_ext_filter" {
         lastFilterArgs: IArguments | null;
         constructor(tree: Wunderbaum);
         init(): void;
+        setPluginOption(name: string, value: any): void;
         _applyFilterNoUpdate(filter: string | NodeFilterCallback, branchMode: boolean, _opts: any): void;
         _applyFilterImpl(filter: string | NodeFilterCallback, branchMode: boolean, _opts: any): number;
         /**
@@ -1288,6 +1550,8 @@ declare module "wb_ext_keynav" {
     import { WunderbaumExtension } from "wb_extension_base";
     export class KeynavExtension extends WunderbaumExtension {
         constructor(tree: Wunderbaum);
+        protected _getEmbeddedInputElem(elem: any): HTMLInputElement | null;
+        protected _isCurInputFocused(): boolean;
         onKeyEvent(data: any): boolean | undefined;
     }
 }
@@ -1302,6 +1566,31 @@ declare module "wb_ext_logger" {
         onKeyEvent(data: any): boolean | undefined;
     }
 }
+declare module "wb_ext_dnd" {
+    import { Wunderbaum } from "wunderbaum";
+    import { WunderbaumExtension } from "wb_extension_base";
+    import { WunderbaumNode } from "wb_node";
+    import { DropRegionType, DropRegionTypeSet } from "types";
+    export class DndExtension extends WunderbaumExtension {
+        protected srcNode: WunderbaumNode | null;
+        protected lastTargetNode: WunderbaumNode | null;
+        protected lastEnterStamp: number;
+        protected lastAllowedDropRegions: DropRegionTypeSet | null;
+        protected lastDropEffect: string | null;
+        protected lastDropRegion: DropRegionType | false;
+        constructor(tree: Wunderbaum);
+        init(): void;
+        /** Cleanup classes after target node is no longer hovered. */
+        protected _leaveNode(): void;
+        /** */
+        protected unifyDragover(res: any): DropRegionTypeSet | false;
+        /** */
+        protected _calcDropRegion(e: DragEvent, allowed: DropRegionTypeSet | null): DropRegionType | false;
+        protected autoScroll(event: DragEvent): number;
+        protected onDragEvent(e: DragEvent): boolean;
+        protected onDropEvent(e: DragEvent): boolean;
+    }
+}
 declare module "drag_observer" {
     export type DragCallbackArgType = {
         /** "dragstart", "drag", or "dragstop". */
@@ -1382,7 +1671,7 @@ declare module "wb_ext_edit" {
     import { Wunderbaum } from "wunderbaum";
     import { WunderbaumExtension } from "wb_extension_base";
     import { WunderbaumNode } from "wb_node";
-    import { AddNodeType } from "common";
+    import { AddNodeType } from "types";
     import { WbNodeData } from "wb_options";
     export class EditExtension extends WunderbaumExtension {
         protected debouncedOnChange: (e: Event) => void;
@@ -1414,20 +1703,20 @@ declare module "wunderbaum" {
     /*!
      * wunderbaum.ts
      *
-     * A tree control.
+     * A treegrid control.
      *
      * Copyright (c) 2021-2022, Martin Wendt (https://wwWendt.de).
-     * Released under the MIT license.
+     * https://github.com/mar10/wunderbaum
      *
+     * Released under the MIT license.
      * @version @VERSION
      * @date @DATE
      */
     import "./wunderbaum.scss";
     import * as util from "util";
     import { ExtensionsDict, WunderbaumExtension } from "wb_extension_base";
-    import { NavigationMode, ChangeType, FilterModeType, MatcherType, NodeStatusType, TargetType as NodeRegion, ApplyCommandType } from "common";
+    import { ApplyCommandType, ChangeType, ColumnDefinitionList, FilterModeType, MatcherType, NavigationOptions, NodeStatusType, NodeTypeDefinitions, ScrollToOptions, SetActiveOptions, SetStatusOptions, TargetType as NodeRegion } from "types";
     import { WunderbaumNode } from "wb_node";
-    import { DebouncedFunction } from "debounce";
     import { WunderbaumOptions } from "wb_options";
     /**
      * A persistent plain object or array.
@@ -1436,6 +1725,7 @@ declare module "wunderbaum" {
      */
     export class Wunderbaum {
         protected static sequence: number;
+        protected enabled: boolean;
         /** Wunderbaum release version number "MAJOR.MINOR.PATCH". */
         static version: string;
         /** The invisible root node, that holds all visible top level nodes. */
@@ -1445,12 +1735,16 @@ declare module "wunderbaum" {
         /** The `div` container element that was passed to the constructor. */
         readonly element: HTMLDivElement;
         /** The `div.wb-header` element if any. */
-        readonly headerElement: HTMLDivElement | null;
+        readonly headerElement: HTMLDivElement;
         /** The `div.wb-scroll-container` element that contains the `nodeListElement`. */
-        readonly scrollContainer: HTMLDivElement;
+        readonly scrollContainerElement: HTMLDivElement;
         /** The `div.wb-node-list` element that contains all visible div.wb-row child elements. */
         readonly nodeListElement: HTMLDivElement;
-        protected readonly _updateViewportThrottled: DebouncedFunction<(...args: any) => void>;
+        /** Contains additional data that was sent as response to an Ajax source load request. */
+        readonly data: {
+            [key: string]: any;
+        };
+        protected readonly _updateViewportThrottled: (...args: any) => void;
         protected extensionList: WunderbaumExtension[];
         protected extensions: ExtensionsDict;
         /** Merged options from constructor args and tree- and extension defaults. */
@@ -1464,16 +1758,15 @@ declare module "wunderbaum" {
         /** Current node hat has keyboard focus if any. */
         focusNode: WunderbaumNode | null;
         /** Shared properties, referenced by `node.type`. */
-        types: {
-            [key: string]: any;
-        };
+        types: NodeTypeDefinitions;
         /** List of column definitions. */
-        columns: any[];
+        columns: ColumnDefinitionList;
         protected _columnsById: {
             [key: string]: any;
         };
         protected resizeObserver: ResizeObserver;
         protected changeRedrawRequestPending: boolean;
+        protected changeScrollRequestPending: boolean;
         /** A Promise that is resolved when the tree was initialized (similar to `init(e)` event). */
         readonly ready: Promise<any>;
         /** Expose some useful methods of the util.ts module as `Wunderbaum.util`. */
@@ -1484,7 +1777,7 @@ declare module "wunderbaum" {
         /** @internal Use `setColumn()`/`getActiveColElem()`*/
         activeColIdx: number;
         /** @internal */
-        navMode: NavigationMode;
+        _cellNavMode: boolean;
         /** @internal */
         lastQuicksearchTime: number;
         /** @internal */
@@ -1534,13 +1827,13 @@ declare module "wunderbaum" {
          * tree._callEvent("edit.beforeEdit", {foo: 42})
          * ```
          */
-        _callEvent(name: string, extra?: any): any;
+        _callEvent(type: string, extra?: any): any;
         /** Return the node for  given row index. */
         protected _getNodeByRowIdx(idx: number): WunderbaumNode | null;
         /** Return the topmost visible node in the viewport. */
-        protected _firstNodeInView(complete?: boolean): WunderbaumNode;
+        getTopmostVpNode(complete?: boolean): WunderbaumNode;
         /** Return the lowest visible node in the viewport. */
-        protected _lastNodeInView(complete?: boolean): WunderbaumNode;
+        getLowestVpNode(complete?: boolean): WunderbaumNode;
         /** Return preceeding visible node in the viewport. */
         protected _getPrevNodeInView(node?: WunderbaumNode, ofs?: number): WunderbaumNode;
         /** Return following visible node in the viewport. */
@@ -1574,24 +1867,31 @@ declare module "wunderbaum" {
          * Return `tree.option.NAME` (also resolving if this is a callback).
          *
          * See also {@link WunderbaumNode.getOption|WunderbaumNode.getOption()}
-         * to consider `node.NAME` setting and `tree.types[node.type].NAME`.
+         * to evaluate `node.NAME` setting and `tree.types[node.type].NAME`.
          *
          * @param name option name (use dot notation to access extension option, e.g.
          * `filter.mode`)
          */
         getOption(name: string, defaultValue?: any): any;
         /**
-         *
-         * @param name
-         * @param value
+         * Set tree option.
+         * Use dot notation to set plugin option, e.g. "filter.mode".
          */
         setOption(name: string, value: any): void;
-        /**Return true if the tree (or one of its nodes) has the input focus. */
+        /** Return true if the tree (or one of its nodes) has the input focus. */
         hasFocus(): boolean;
-        /** Run code, but defer `updateViewport()` until done. */
+        /**
+         * Return true if the tree displays a header. Grids have a header unless the
+         * `header` option is set to `false`. Plain trees have a header if the `header`
+         * option is a string or `true`.
+         */
+        hasHeader(): boolean;
+        /** Run code, but defer rendering of viewport until done. */
         runWithoutUpdate(func: () => any, hint?: any): void;
         /** Recursively expand all expandable nodes (triggers lazy load id needed). */
         expandAll(flag?: boolean): Promise<void>;
+        /** Recursively select all nodes. */
+        selectAll(flag?: boolean): void;
         /** Return the number of nodes in the data model.*/
         count(visible?: boolean): number;
         /** @internal sanity check. */
@@ -1614,6 +1914,15 @@ declare module "wunderbaum" {
          *
          */
         findFirst(match: string | MatcherType): WunderbaumNode;
+        /**
+         * Find first node that matches condition.
+         *
+         * @param match title string to search for, or a
+         *     callback function that returns `true` if a node is matched.
+         * @see {@link WunderbaumNode.findFirst}
+         *
+         */
+        findKey(key: string): WunderbaumNode | undefined;
         /**
          * Find the next visible node that starts with `match`, starting at `startNode`
          * and wrap-around at the end.
@@ -1688,52 +1997,74 @@ declare module "wunderbaum" {
         /** Log to console if opts.debugLevel >= 2 */
         logWarn(...args: any[]): void;
         /**
-         * Make sure that this node is scrolled into the viewport.
-         *
-         * @param {boolean | PlainObject} [effects=false] animation options.
-         * @param {object} [options=null] {topNode: null, effects: ..., parent: ...}
-         *     this node will remain visible in
-         *     any case, even if `this` is outside the scroll pane.
+         * Make sure that this node is vertically scrolled into the viewport.
+         */
+        scrollTo(nodeOrOpts: ScrollToOptions | WunderbaumNode): void;
+        /**
+         * Make sure that this node is horizontally scrolled into the viewport.
+         * Called by {@link setColumn}.
          */
-        scrollTo(opts: any): void;
+        protected scrollToHorz(): void;
         /**
          * Set column #colIdx to 'active'.
          *
          * This higlights the column header and -cells by adding the `wb-active` class.
-         * Available in cell-nav and cell-edit mode, not in row-mode.
+         * Available in cell-nav mode only.
          */
         setColumn(colIdx: number): void;
         /** Set or remove keybaord focus to the tree container. */
+        setActiveNode(key: string, flag?: boolean, options?: SetActiveOptions): void;
+        /** Set or remove keybaord focus to the tree container. */
         setFocus(flag?: boolean): void;
         /** Schedule an update request to reflect a tree change. */
         setModified(change: ChangeType, options?: any): void;
         /** Schedule an update request to reflect a single node modification. */
         setModified(change: ChangeType, node: WunderbaumNode, options?: any): void;
+        /** Disable mouse and keyboard interaction (return prev. state). */
+        setEnabled(flag?: boolean): boolean;
+        /** Return false if tree is disabled. */
+        isEnabled(): boolean;
+        /** Return true if tree has more than one column, i.e. has additional data columns. */
+        isGrid(): boolean;
+        /** Return true if cell-navigation mode is acive. */
+        isCellNav(): boolean;
+        /** Return true if row-navigation mode is acive. */
+        isRowNav(): boolean;
         /** Set the tree's navigation mode. */
-        setNavigationMode(mode: NavigationMode): void;
+        setCellNav(flag?: boolean): void;
+        /** Set the tree's navigation mode option. */
+        setNavigationOption(mode: NavigationOptions, reset?: boolean): void;
         /** Display tree status (ok, loading, error, noData) using styles and a dummy root node. */
-        setStatus(status: NodeStatusType, message?: string, details?: string): WunderbaumNode | null;
+        setStatus(status: NodeStatusType, options?: SetStatusOptions): WunderbaumNode | null;
+        /** Add or redefine node type definitions. */
+        setTypes(types: any, replace?: boolean): void;
         /** Update column headers and width. */
         updateColumns(opts?: any): void;
         /** Create/update header markup from `this.columns` definition.
          * @internal
          */
         protected _renderHeaderMarkup(): void;
-        /** Render header and all rows that are visible in the viewport (async, throttled). */
-        updateViewport(immediate?: boolean): void;
         /**
-         * This is the actual update method, which is wrapped inside a throttle method.
-         * This protected method should not be called directly but via
-         * `tree.updateViewport()` or `tree.setModified()`.
-         * It calls `updateColumns()` and `_updateRows()`.
-         * @internal
+         * Render pending changes that were scheduled using {@link WunderbaumNode.setModified} if any.
+         *
+         * This is hardly ever neccessary, since we normally either
+         * - call `setModified(ChangeType.TYPE)` (async, throttled), or
+         * - call `setModified(ChangeType.TYPE, {immediate: true})` (synchronous)
+         *
+         * `updatePendingModifications()` will only force immediate execution of
+         * pending async changes if any.
          */
-        protected _updateViewport(): void;
+        updatePendingModifications(): void;
         /**
-         * Assert that TR order matches the natural node order
+         * This is the actual update method, which is wrapped inside a throttle method.
+         * It calls `updateColumns()` and `_updateRows()`.
+         *
+         * This protected method should not be called directly but via
+         * {@link WunderbaumNode.setModified}`, {@link Wunderbaum.setModified},
+         * or {@link Wunderbaum.updatePendingModifications}.
          * @internal
          */
-        protected _validateRows(): boolean;
+        protected _updateViewportImmediately(): void;
         protected _updateRows(opts?: any): boolean;
         /**
          * Call callback(node) for all nodes in hierarchical order (depth-first).
@@ -1743,7 +2074,7 @@ declare module "wunderbaum" {
          *     children only.
          * @returns {boolean} false, if the iterator was stopped.
          */
-        visit(callback: (node: WunderbaumNode) => any): import("common").NodeVisitResponse;
+        visit(callback: (node: WunderbaumNode) => any): import("types").NodeVisitResponse;
         /**
          * Call fn(node) for all nodes in vertical order, top down (or bottom up).
          *
@@ -1769,10 +2100,10 @@ declare module "wunderbaum" {
         /**
          * Reload the tree with a new source.
          *
-         * Previous data is cleared.
-         * Pass `options.columns` to define a header (may also be part of `source.columns`).
+         * Previous data is cleared. Note that also column- and type defintions may
+         * be passed with the `source` object.
          */
-        load(source: any, options?: any): Promise<void>;
+        load(source: any): Promise<void>;
         /**
          * Disable render requests during operations that would trigger many updates.
          *
@@ -1781,7 +2112,7 @@ declare module "wunderbaum" {
          *   tree.enableUpdate(false);
          *   // ... (long running operation that would trigger many updates)
          *   foo();
-         *   // ... NOTE: make sure that async operations have finished
+         *   // ... NOTE: make sure that async operations have finished, e.g.
          *   await foo();
          * } finally {
          *   tree.enableUpdate(true);