wunderbaum 0.11.0 → 0.12.0

package/dist/wunderbaum.umd.js

@@ -294,7 +294,7 @@
     /*!
      * Wunderbaum - util
      * Copyright (c) 2021-2024, Martin Wendt. Released under the MIT license.
-     * v0.11.0, Sun, 04 Aug 2024 15:35:53 GMT (https://github.com/mar10/wunderbaum)
+     * v0.12.0, Sun, 12 Jan 2025 10:51:41 GMT (https://github.com/mar10/wunderbaum)
      */
     /** @module util */
     /** Readable names for `MouseEvent.button` */
@@ -986,6 +986,15 @@
         }
         throw new Error("No default boolean value provided");
     }
+    /**
+     * Return `val` unless `val` is a number in which case we convert to boolean.
+     * This is useful when a boolean value is stored as a 0/1 (e.g. in JSON) and
+     * we still want to maintain string values. null and undefined are returned as
+     * is. E.g. `checkbox` may be boolean or 'radio'.
+     */
+    function intToBool(val) {
+        return typeof val === "number" ? !!val : val;
+    }
     // /** Check if a string is contained in an Array or Set. */
     // export function isAnyOf(s: string, items: Array<string>|Set<string>): boolean {
     //   return Array.prototype.includes.call(items, s)
@@ -1114,6 +1123,7 @@
         extractHtmlText: extractHtmlText,
         getOption: getOption,
         getValueFromElem: getValueFromElem,
+        intToBool: intToBool,
         isArray: isArray,
         isEmptyObject: isEmptyObject,
         isFunction: isFunction,
@@ -1138,7 +1148,7 @@
     /*!
      * Wunderbaum - types
      * Copyright (c) 2021-2024, Martin Wendt. Released under the MIT license.
-     * v0.11.0, Sun, 04 Aug 2024 15:35:53 GMT (https://github.com/mar10/wunderbaum)
+     * v0.12.0, Sun, 12 Jan 2025 10:51:41 GMT (https://github.com/mar10/wunderbaum)
      */
     /**
      * Possible values for {@link WunderbaumNode.update} and {@link Wunderbaum.update}.
@@ -1202,7 +1212,7 @@
     /*!
      * Wunderbaum - wb_extension_base
      * Copyright (c) 2021-2024, Martin Wendt. Released under the MIT license.
-     * v0.11.0, Sun, 04 Aug 2024 15:35:53 GMT (https://github.com/mar10/wunderbaum)
+     * v0.12.0, Sun, 12 Jan 2025 10:51:41 GMT (https://github.com/mar10/wunderbaum)
      */
     class WunderbaumExtension {
         constructor(tree, id, defaults) {
@@ -1261,7 +1271,7 @@
     /*!
      * Wunderbaum - ext-filter
      * Copyright (c) 2021-2024, Martin Wendt. Released under the MIT license.
-     * v0.11.0, Sun, 04 Aug 2024 15:35:53 GMT (https://github.com/mar10/wunderbaum)
+     * v0.12.0, Sun, 12 Jan 2025 10:51:41 GMT (https://github.com/mar10/wunderbaum)
      */
     const START_MARKER = "\uFFF7";
     const END_MARKER = "\uFFF8";
@@ -1586,7 +1596,7 @@
     /*!
      * Wunderbaum - ext-keynav
      * Copyright (c) 2021-2024, Martin Wendt. Released under the MIT license.
-     * v0.11.0, Sun, 04 Aug 2024 15:35:53 GMT (https://github.com/mar10/wunderbaum)
+     * v0.12.0, Sun, 12 Jan 2025 10:51:41 GMT (https://github.com/mar10/wunderbaum)
      */
     const QUICKSEARCH_DELAY = 500;
     class KeynavExtension extends WunderbaumExtension {
@@ -1950,7 +1960,7 @@
     /*!
      * Wunderbaum - ext-logger
      * Copyright (c) 2021-2024, Martin Wendt. Released under the MIT license.
-     * v0.11.0, Sun, 04 Aug 2024 15:35:53 GMT (https://github.com/mar10/wunderbaum)
+     * v0.12.0, Sun, 12 Jan 2025 10:51:41 GMT (https://github.com/mar10/wunderbaum)
      */
     class LoggerExtension extends WunderbaumExtension {
         constructor(tree) {
@@ -1990,410 +2000,70 @@
     }
 
     /*!
-     * Wunderbaum - common
+     * Wunderbaum - ext-dnd
      * Copyright (c) 2021-2024, Martin Wendt. Released under the MIT license.
-     * v0.11.0, Sun, 04 Aug 2024 15:35:53 GMT (https://github.com/mar10/wunderbaum)
-     */
-    const DEFAULT_DEBUGLEVEL = 3; // Replaced by rollup script
-    /**
-     * Fixed height of a row in pixel. Must match the SCSS variable `$row-outer-height`.
-     */
-    const ROW_HEIGHT = 22;
-    /**
-     * Fixed width of node icons in pixel. Must match the SCSS variable `$icon-outer-width`.
-     */
-    const ICON_WIDTH = 20;
-    /**
-     * Adjust the width of the title span, so overflow ellipsis work.
-     * (2 x `$col-padding-x` + 3px rounding errors).
-     */
-    const TITLE_SPAN_PAD_Y = 7;
-    /** Render row markup for N nodes above and below the visible viewport. */
-    const RENDER_MAX_PREFETCH = 5;
-    /** Minimum column width if not set otherwise. */
-    const DEFAULT_MIN_COL_WIDTH = 4;
-    /** Regular expression to detect if a string describes an image URL (in contrast
-     * to a class name). Strings are considered image urls if they contain '.' or '/'.
-     */
-    const TEST_IMG = new RegExp(/\.|\//);
-    // export const RECURSIVE_REQUEST_ERROR = "$recursive_request";
-    // export const INVALID_REQUEST_TARGET_ERROR = "$request_target_invalid";
-    /**
-     * Default node icons.
-     * Requires bootstrap icons https://icons.getbootstrap.com
-     */
-    const iconMaps = {
-        bootstrap: {
-            error: "bi bi-exclamation-triangle",
-            // loading: "bi bi-hourglass-split wb-busy",
-            loading: "bi bi-chevron-right wb-busy",
-            // loading: "bi bi-arrow-repeat wb-spin",
-            // loading: '<div class="spinner-border spinner-border-sm" role="status"> <span class="visually-hidden">Loading...</span> </div>',
-            // noData: "bi bi-search",
-            noData: "bi bi-question-circle",
-            expanderExpanded: "bi bi-chevron-down",
-            // expanderExpanded: "bi bi-dash-square",
-            expanderCollapsed: "bi bi-chevron-right",
-            // expanderCollapsed: "bi bi-plus-square",
-            expanderLazy: "bi bi-chevron-right wb-helper-lazy-expander",
-            // expanderLazy: "bi bi-chevron-bar-right",
-            checkChecked: "bi bi-check-square",
-            checkUnchecked: "bi bi-square",
-            checkUnknown: "bi bi-dash-square-dotted",
-            radioChecked: "bi bi-circle-fill",
-            radioUnchecked: "bi bi-circle",
-            radioUnknown: "bi bi-record-circle",
-            folder: "bi bi-folder2",
-            folderOpen: "bi bi-folder2-open",
-            folderLazy: "bi bi-folder-symlink",
-            doc: "bi bi-file-earmark",
-            colSortable: "bi bi-chevron-expand",
-            // colSortable: "bi bi-arrow-down-up",
-            // colSortAsc: "bi bi-chevron-down",
-            // colSortDesc: "bi bi-chevron-up",
-            colSortAsc: "bi bi-arrow-down",
-            colSortDesc: "bi bi-arrow-up",
-            colFilter: "bi bi-filter-circle",
-            colFilterActive: "bi bi-filter-circle-fill wb-helper-invalid",
-            colMenu: "bi bi-three-dots-vertical",
-        },
-        fontawesome6: {
-            error: "fa-solid fa-triangle-exclamation",
-            loading: "fa-solid fa-chevron-right fa-beat",
-            noData: "fa-solid fa-circle-question",
-            expanderExpanded: "fa-solid fa-chevron-down",
-            expanderCollapsed: "fa-solid fa-chevron-right",
-            expanderLazy: "fa-solid fa-chevron-right wb-helper-lazy-expander",
-            checkChecked: "fa-regular fa-square-check",
-            checkUnchecked: "fa-regular fa-square",
-            checkUnknown: "fa-regular fa-square-minus",
-            radioChecked: "fa-solid fa-circle",
-            radioUnchecked: "fa-regular fa-circle",
-            radioUnknown: "fa-regular fa-circle-question",
-            folder: "fa-solid fa-folder-closed",
-            folderOpen: "fa-regular fa-folder-open",
-            folderLazy: "fa-solid fa-folder-plus",
-            doc: "fa-regular fa-file",
-            colSortable: "fa-solid fa-fw fa-sort",
-            colSortAsc: "fa-solid fa-fw fa-sort-up",
-            colSortDesc: "fa-solid fa-fw fa-sort-down",
-            colFilter: "fa-solid fa-fw fa-filter",
-            colFilterActive: "fa-solid fa-fw fa-filter wb-helper-invalid",
-            colMenu: "fa-solid fa-fw fa-ellipsis-v",
-        },
-    };
-    /** Dict keys that are evaluated by source loader (others are added to `tree.data` instead). */
-    const RESERVED_TREE_SOURCE_KEYS = new Set([
-        "_format", // reserved for future use
-        "_keyMap", // Used for compressed data format
-        "_positional", // Used for compressed data format
-        "_typeList", // Used for compressed data format @deprecated
-        "_valueMap", // Used for compressed data format
-        "_version", // reserved for future use
-        "children",
-        "columns",
-        "types",
-    ]);
-    // /** Key codes that trigger grid navigation, even when inside an input element. */
-    // export const INPUT_BREAKOUT_KEYS: Set<string> = new Set([
-    //   // "ArrowDown",
-    //   // "ArrowUp",
-    //   "Enter",
-    //   "Escape",
-    // ]);
-    /** Map `KeyEvent.key` to navigation action. */
-    const KEY_TO_ACTION_DICT = {
-        " ": "toggleSelect",
-        "+": "expand",
-        Add: "expand",
-        ArrowDown: "down",
-        ArrowLeft: "left",
-        ArrowRight: "right",
-        ArrowUp: "up",
-        Backspace: "parent",
-        "/": "collapseAll",
-        Divide: "collapseAll",
-        End: "lastCol",
-        Home: "firstCol",
-        "Control+End": "last",
-        "Control+Home": "first",
-        "Meta+ArrowDown": "last", // macOs
-        "Meta+ArrowUp": "first", // macOs
-        "*": "expandAll",
-        Multiply: "expandAll",
-        PageDown: "pageDown",
-        PageUp: "pageUp",
-        "-": "collapse",
-        Subtract: "collapse",
-    };
-    /** Return a callback that returns true if the node title matches the string
-     * or regular expression.
-     * @see {@link WunderbaumNode.findAll}
-     */
-    function makeNodeTitleMatcher(match) {
-        if (match instanceof RegExp) {
-            return function (node) {
-                return match.test(node.title);
-            };
-        }
-        assert(typeof match === "string", `Expected a string or RegExp: ${match}`);
-        // s = escapeRegex(s.toLowerCase());
-        return function (node) {
-            return node.title === match;
-            // console.log("match " + node, node.title.toLowerCase().indexOf(match))
-            // return node.title.toLowerCase().indexOf(match) >= 0;
-        };
-    }
-    /** Return a callback that returns true if the node title starts with a string (case-insensitive). */
-    function makeNodeTitleStartMatcher(s) {
-        s = escapeRegex(s);
-        const reMatch = new RegExp("^" + s, "i");
-        return function (node) {
-            return reMatch.test(node.title);
-        };
-    }
-    /** Compare two nodes by title (case-insensitive). */
-    function nodeTitleSorter(a, b) {
-        const x = a.title.toLowerCase();
-        const y = b.title.toLowerCase();
-        return x === y ? 0 : x > y ? 1 : -1;
-    }
-    /**
-     * Convert 'flat' to 'nested' format.
-     *
-     *  Flat node entry format:
-     *    [PARENT_ID, [POSITIONAL_ARGS]]
-     *  or
-     *    [PARENT_ID, [POSITIONAL_ARGS], {KEY_VALUE_ARGS}]
-     *
-     * 1. Parent-referencing list is converted to a list of nested dicts with
-     *    optional `children` properties.
-     * 2. `[POSITIONAL_ARGS]` are added as dict attributes.
+     * v0.12.0, Sun, 12 Jan 2025 10:51:41 GMT (https://github.com/mar10/wunderbaum)
      */
-    function unflattenSource(source) {
-        var _a, _b, _c;
-        const { _format, _keyMap = {}, _positional = [], children } = source;
-        if (_format !== "flat") {
-            throw new Error(`Expected source._format: "flat", but got ${_format}`);
-        }
-        if (_positional && _positional.includes("children")) {
-            throw new Error(`source._positional must not include "children": ${_positional}`);
+    const nodeMimeType = "application/x-wunderbaum-node";
+    class DndExtension extends WunderbaumExtension {
+        constructor(tree) {
+            super(tree, "dnd", {
+                autoExpandMS: 1500, // Expand nodes after n milliseconds of hovering
+                // dropMarkerInsertOffsetX: -16, // Additional offset for drop-marker with hitMode = "before"/"after"
+                // dropMarkerOffsetX: -24, // Absolute position offset for .fancytree-drop-marker relatively to ..fancytree-title (icon/img near a node accepting drop)
+                // #1021 `document.body` is not available yet
+                // dropMarkerParent: "body", // Root Container used for drop marker (could be a shadow root)
+                multiSource: false, // true: Drag multiple (i.e. selected) nodes. Also a callback() is allowed
+                effectAllowed: "all", // Restrict the possible cursor shapes and modifier operations (can also be set in the dragStart event)
+                dropEffectDefault: "move", // Default dropEffect ('copy', 'link', or 'move') when no modifier is pressed (override in drag, dragOver).
+                guessDropEffect: true, // Calculate from `effectAllowed` and modifier keys)
+                preventForeignNodes: false, // Prevent dropping nodes from different Wunderbaum trees
+                preventLazyParents: true, // Prevent dropping items on unloaded lazy Wunderbaum tree nodes
+                preventNonNodes: false, // Prevent dropping items other than Wunderbaum tree nodes
+                preventRecursion: true, // Prevent dropping nodes on own descendants
+                preventSameParent: false, // Prevent dropping nodes under same direct parent
+                preventVoidMoves: true, // Prevent dropping nodes 'before self', etc. (move only)
+                serializeClipboardData: true, // Serialize node data to dataTransfer object
+                scroll: true, // Enable auto-scrolling while dragging
+                scrollSensitivity: 20, // Active top/bottom margin in pixel
+                // scrollnterval: 50, // Generate event every 50 ms
+                scrollSpeed: 5, // Scroll pixel per 50 ms
+                // setTextTypeJson: false, // Allow dragging of nodes to different IE windows
+                sourceCopyHook: null, // Optional callback passed to `toDict` on dragStart @since 2.38
+                // Events (drag support)
+                dragStart: null, // Callback(sourceNode, data), return true, to enable dnd drag
+                drag: null, // Callback(sourceNode, data)
+                dragEnd: null, // Callback(sourceNode, data)
+                // Events (drop support)
+                dragEnter: null, // Callback(targetNode, data), return true, to enable dnd drop
+                dragOver: null, // Callback(targetNode, data)
+                dragExpand: null, // Callback(targetNode, data), return false to prevent autoExpand
+                drop: null, // Callback(targetNode, data)
+                dragLeave: null, // Callback(targetNode, data)
+            });
+            // public dropMarkerElem?: HTMLElement;
+            this.srcNode = null;
+            this.lastTargetNode = null;
+            this.lastEnterStamp = 0;
+            this.lastAllowedDropRegions = null;
+            this.lastDropEffect = null;
+            this.lastDropRegion = false;
+            this.currentScrollDir = 0;
+            this.applyScrollDirThrottled = throttle(this._applyScrollDir, 50);
         }
-        let longToShort = _keyMap;
-        if (_keyMap.t) {
-            // Inverse keyMap was used (pre 0.7.0)
-            // TODO: raise Error on final 1.x release
-            const msg = `source._keyMap maps from long to short since v0.7.0. Flip key/value!`;
-            console.warn(msg); // eslint-disable-line no-console
-            longToShort = {};
-            for (const [key, value] of Object.entries(_keyMap)) {
-                longToShort[value] = key;
-            }
-        }
-        const positionalShort = _positional.map((e) => longToShort[e]);
-        const newChildren = [];
-        const keyToNodeMap = {};
-        const indexToNodeMap = {};
-        const keyAttrName = (_a = longToShort["key"]) !== null && _a !== void 0 ? _a : "key";
-        const childrenAttrName = (_b = longToShort["children"]) !== null && _b !== void 0 ? _b : "children";
-        for (const [index, nodeTuple] of children.entries()) {
-            // Node entry format:
-            //   [PARENT_ID, [POSITIONAL_ARGS]]
-            // or
-            //   [PARENT_ID, [POSITIONAL_ARGS], {KEY_VALUE_ARGS}]
-            const [parentId, args, kwargs = {}] = nodeTuple;
-            // Free up some memory as we go
-            nodeTuple[1] = null;
-            if (nodeTuple[2] != null) {
-                nodeTuple[2] = null;
-            }
-            // console.log("flatten", parentId, args, kwargs)
-            // We keep `kwargs` as our new node definition. Then we add all positional
-            // values to this object:
-            args.forEach((val, positionalIdx) => {
-                kwargs[positionalShort[positionalIdx]] = val;
-            });
-            // Find the parent node. `null` means 'toplevel'. PARENT_ID may be the numeric
-            // index of the source.children list. If PARENT_ID is a string, we search
-            // a parent with node.key of this value.
-            indexToNodeMap[index] = kwargs;
-            const key = kwargs[keyAttrName];
-            if (key != null) {
-                keyToNodeMap[key] = kwargs;
-            }
-            let parentNode = null;
-            if (parentId === null) ;
-            else if (typeof parentId === "number") {
-                parentNode = indexToNodeMap[parentId];
-                if (parentNode === undefined) {
-                    throw new Error(`unflattenSource: Could not find parent node by index: ${parentId}.`);
-                }
-            }
-            else {
-                parentNode = keyToNodeMap[parentId];
-                if (parentNode === undefined) {
-                    throw new Error(`unflattenSource: Could not find parent node by key: ${parentId}`);
-                }
-            }
-            if (parentNode) {
-                (_c = parentNode[childrenAttrName]) !== null && _c !== void 0 ? _c : (parentNode[childrenAttrName] = []);
-                parentNode[childrenAttrName].push(kwargs);
-            }
-            else {
-                newChildren.push(kwargs);
-            }
-        }
-        source.children = newChildren;
-    }
-    /**
-     * Decompresses the source data by
-     * - converting from 'flat' to 'nested' format
-     * - expanding short alias names to long names (if defined in _keyMap)
-     * - resolving value indexes to value strings (if defined in _valueMap)
-     *
-     * @param source - The source object to be decompressed.
-     * @returns void
-     */
-    function decompressSourceData(source) {
-        let { _format, _version = 1, _keyMap, _valueMap } = source;
-        assert(_version === 1, `Expected file version 1 instead of ${_version}`);
-        let longToShort = _keyMap;
-        let shortToLong = {};
-        if (longToShort) {
-            for (const [key, value] of Object.entries(longToShort)) {
-                shortToLong[value] = key;
-            }
-        }
-        // Fallback for old format (pre 0.7.0, using _keyMap in reverse direction)
-        // TODO: raise Error on final 1.x release
-        if (longToShort && longToShort.t) {
-            const msg = `source._keyMap maps from long to short since v0.7.0. Flip key/value!`;
-            console.warn(msg); // eslint-disable-line no-console
-            [longToShort, shortToLong] = [shortToLong, longToShort];
-        }
-        // Fallback for old format (pre 0.7.0, using _typeList instead of _valueMap)
-        // TODO: raise Error on final 1.x release
-        if (source._typeList != null) {
-            const msg = `source._typeList is deprecated since v0.7.0: use source._valueMap: {"type": [...]} instead.`;
-            if (_valueMap != null) {
-                throw new Error(msg);
-            }
-            else {
-                console.warn(msg); // eslint-disable-line no-console
-                _valueMap = { type: source._typeList };
-                delete source._typeList;
-            }
-        }
-        if (_format === "flat") {
-            unflattenSource(source);
-        }
-        delete source._format;
-        delete source._version;
-        delete source._keyMap;
-        delete source._valueMap;
-        delete source._positional;
-        function _iter(childList) {
-            for (const node of childList) {
-                // Iterate over a list of names, because we modify inside the loop
-                // (for ... of ... does not allow this)
-                Object.getOwnPropertyNames(node).forEach((propName) => {
-                    const value = node[propName];
-                    // Replace short names with long names if defined in _keyMap
-                    let longName = propName;
-                    if (_keyMap && shortToLong[propName] != null) {
-                        longName = shortToLong[propName];
-                        if (longName !== propName) {
-                            node[longName] = value;
-                            delete node[propName];
-                        }
-                    }
-                    // Replace type index with type name if defined in _valueMap
-                    if (_valueMap &&
-                        typeof value === "number" &&
-                        _valueMap[longName] != null) {
-                        const newValue = _valueMap[longName][value];
-                        if (newValue == null) {
-                            throw new Error(`Expected valueMap[${longName}][${value}] entry in [${_valueMap[longName]}]`);
-                        }
-                        node[longName] = newValue;
-                    }
-                });
-                // Recursion
-                if (node.children) {
-                    _iter(node.children);
-                }
-            }
-        }
-        if (_keyMap || _valueMap) {
-            _iter(source.children);
-        }
-    }
-
-    /*!
-     * Wunderbaum - ext-dnd
-     * Copyright (c) 2021-2024, Martin Wendt. Released under the MIT license.
-     * v0.11.0, Sun, 04 Aug 2024 15:35:53 GMT (https://github.com/mar10/wunderbaum)
-     */
-    const nodeMimeType = "application/x-wunderbaum-node";
-    class DndExtension extends WunderbaumExtension {
-        constructor(tree) {
-            super(tree, "dnd", {
-                autoExpandMS: 1500, // Expand nodes after n milliseconds of hovering
-                // dropMarkerInsertOffsetX: -16, // Additional offset for drop-marker with hitMode = "before"/"after"
-                // dropMarkerOffsetX: -24, // Absolute position offset for .fancytree-drop-marker relatively to ..fancytree-title (icon/img near a node accepting drop)
-                // #1021 `document.body` is not available yet
-                // dropMarkerParent: "body", // Root Container used for drop marker (could be a shadow root)
-                multiSource: false, // true: Drag multiple (i.e. selected) nodes. Also a callback() is allowed
-                effectAllowed: "all", // Restrict the possible cursor shapes and modifier operations (can also be set in the dragStart event)
-                dropEffectDefault: "move", // Default dropEffect ('copy', 'link', or 'move') when no modifier is pressed (override in drag, dragOver).
-                guessDropEffect: true, // Calculate from `effectAllowed` and modifier keys)
-                preventForeignNodes: false, // Prevent dropping nodes from different Wunderbaum trees
-                preventLazyParents: true, // Prevent dropping items on unloaded lazy Wunderbaum tree nodes
-                preventNonNodes: false, // Prevent dropping items other than Wunderbaum tree nodes
-                preventRecursion: true, // Prevent dropping nodes on own descendants
-                preventSameParent: false, // Prevent dropping nodes under same direct parent
-                preventVoidMoves: true, // Prevent dropping nodes 'before self', etc. (move only)
-                serializeClipboardData: true, // Serialize node data to dataTransfer object
-                scroll: true, // Enable auto-scrolling while dragging
-                scrollSensitivity: 20, // Active top/bottom margin in pixel
-                // scrollnterval: 50, // Generate event every 50 ms
-                scrollSpeed: 5, // Scroll pixel per 50 ms
-                // setTextTypeJson: false, // Allow dragging of nodes to different IE windows
-                sourceCopyHook: null, // Optional callback passed to `toDict` on dragStart @since 2.38
-                // Events (drag support)
-                dragStart: null, // Callback(sourceNode, data), return true, to enable dnd drag
-                drag: null, // Callback(sourceNode, data)
-                dragEnd: null, // Callback(sourceNode, data)
-                // Events (drop support)
-                dragEnter: null, // Callback(targetNode, data), return true, to enable dnd drop
-                dragOver: null, // Callback(targetNode, data)
-                dragExpand: null, // Callback(targetNode, data), return false to prevent autoExpand
-                drop: null, // Callback(targetNode, data)
-                dragLeave: null, // Callback(targetNode, data)
-            });
-            // public dropMarkerElem?: HTMLElement;
-            this.srcNode = null;
-            this.lastTargetNode = null;
-            this.lastEnterStamp = 0;
-            this.lastAllowedDropRegions = null;
-            this.lastDropEffect = null;
-            this.lastDropRegion = false;
-            this.currentScrollDir = 0;
-            this.applyScrollDirThrottled = throttle(this._applyScrollDir, 50);
-        }
-        init() {
-            super.init();
-            // Store the current scroll parent, which may be the tree
-            // container, any enclosing div, or the document.
-            // #761: scrollParent() always needs a container child
-            // $temp = $("<span>").appendTo(this.$container);
-            // this.$scrollParent = $temp.scrollParent();
-            // $temp.remove();
-            const tree = this.tree;
-            const dndOpts = tree.options.dnd;
-            // Enable drag support if dragStart() is specified:
-            if (dndOpts.dragStart) {
-                onEvent(tree.element, "dragstart drag dragend", this.onDragEvent.bind(this));
+        init() {
+            super.init();
+            // Store the current scroll parent, which may be the tree
+            // container, any enclosing div, or the document.
+            // #761: scrollParent() always needs a container child
+            // $temp = $("<span>").appendTo(this.$container);
+            // this.$scrollParent = $temp.scrollParent();
+            // $temp.remove();
+            const tree = this.tree;
+            const dndOpts = tree.options.dnd;
+            // Enable drag support if dragStart() is specified:
+            if (dndOpts.dragStart) {
+                onEvent(tree.element, "dragstart drag dragend", this.onDragEvent.bind(this));
             }
             // Enable drop support if dragEnter() is specified:
             if (dndOpts.dragEnter) {
@@ -2431,14 +2101,15 @@
          * Calculates the drop region based on the drag event and the allowed drop regions.
          */
         _calcDropRegion(e, allowed) {
+            const rowHeight = this.tree.options.rowHeightPx;
             const dy = e.offsetY;
             if (!allowed) {
                 return false;
             }
             else if (allowed.size === 3) {
-                return dy < 0.25 * ROW_HEIGHT
+                return dy < 0.25 * rowHeight
                     ? "before"
-                    : dy > 0.75 * ROW_HEIGHT
+                    : dy > 0.75 * rowHeight
                         ? "after"
                         : "over";
             }
@@ -2447,7 +2118,7 @@
             }
             else {
                 // Only 'before' and 'after':
-                return dy > ROW_HEIGHT / 2 ? "after" : "before";
+                return dy > rowHeight / 2 ? "after" : "before";
             }
             // return "over";
         }
@@ -2708,7 +2379,11 @@
                 }
                 this.lastAllowedDropRegions = regionSet;
                 this.lastDropEffect = dt.dropEffect;
+                const region = this._calcDropRegion(e, this.lastAllowedDropRegions);
                 targetNode.setClass("wb-drop-target");
+                targetNode.setClass("wb-drop-over", region === "over");
+                targetNode.setClass("wb-drop-before", region === "before");
+                targetNode.setClass("wb-drop-after", region === "after");
                 e.preventDefault(); // Allow drop (Drop operation is denied by default)
                 return false;
                 // --- dragover ---
@@ -2747,186 +2422,526 @@
                 targetNode._callEvent("dnd.dragLeave", { event: e, sourceNode: srcNode });
                 // --- drop ---
             }
-            else if (e.type === "drop") {
-                e.stopPropagation(); // prevent browser from opening links?
-                e.preventDefault(); // #69 prevent iOS browser from opening links
-                this._leaveNode();
-                const region = this.lastDropRegion;
-                let nodeData = (_a = e.dataTransfer) === null || _a === void 0 ? void 0 : _a.getData(nodeMimeType);
-                nodeData = nodeData ? JSON.parse(nodeData) : null;
-                const srcNode = this.srcNode;
-                const lastDropEffect = this.lastDropEffect;
-                setTimeout(() => {
-                    // Decouple this call, because drop actions may prevent the dragend event
-                    // from being fired on some browsers
-                    targetNode._callEvent("dnd.drop", {
-                        event: e,
-                        region: region,
-                        suggestedDropMode: region === "over" ? "appendChild" : region,
-                        suggestedDropEffect: lastDropEffect,
-                        // suggestedDropEffect: e.dataTransfer?.dropEffect,
-                        sourceNode: srcNode,
-                        sourceNodeData: nodeData,
-                    });
-                }, 10);
+            else if (e.type === "drop") {
+                e.stopPropagation(); // prevent browser from opening links?
+                e.preventDefault(); // #69 prevent iOS browser from opening links
+                this._leaveNode();
+                const region = this.lastDropRegion;
+                let nodeData = (_a = e.dataTransfer) === null || _a === void 0 ? void 0 : _a.getData(nodeMimeType);
+                nodeData = nodeData ? JSON.parse(nodeData) : null;
+                const srcNode = this.srcNode;
+                const lastDropEffect = this.lastDropEffect;
+                setTimeout(() => {
+                    // Decouple this call, because drop actions may prevent the dragend event
+                    // from being fired on some browsers
+                    targetNode._callEvent("dnd.drop", {
+                        event: e,
+                        region: region,
+                        suggestedDropMode: region === "over" ? "appendChild" : region,
+                        suggestedDropEffect: lastDropEffect,
+                        // suggestedDropEffect: e.dataTransfer?.dropEffect,
+                        sourceNode: srcNode,
+                        sourceNodeData: nodeData,
+                    });
+                }, 10);
+            }
+            return false;
+        }
+    }
+
+    /*!
+     * Wunderbaum - drag_observer
+     * Copyright (c) 2021-2024, Martin Wendt. Released under the MIT license.
+     * v0.12.0, Sun, 12 Jan 2025 10:51:41 GMT (https://github.com/mar10/wunderbaum)
+     */
+    /**
+     * Convert mouse- and touch events to 'dragstart', 'drag', and 'dragstop'.
+     */
+    class DragObserver {
+        constructor(opts) {
+            this.start = {
+                event: null,
+                x: 0,
+                y: 0,
+                altKey: false,
+                ctrlKey: false,
+                metaKey: false,
+                shiftKey: false,
+            };
+            this.dragElem = null;
+            this.dragging = false;
+            this.customData = {};
+            // TODO: touch events
+            this.events = ["mousedown", "mouseup", "mousemove", "keydown"];
+            if (!opts.root) {
+                throw new Error("Missing `root` option.");
+            }
+            this.opts = Object.assign({ thresh: 5 }, opts);
+            this.root = opts.root;
+            this._handler = this.handleEvent.bind(this);
+            this.events.forEach((type) => {
+                this.root.addEventListener(type, this._handler);
+            });
+        }
+        /** Unregister all event listeners. */
+        disconnect() {
+            this.events.forEach((type) => {
+                this.root.removeEventListener(type, this._handler);
+            });
+        }
+        getDragElem() {
+            return this.dragElem;
+        }
+        isDragging() {
+            return this.dragging;
+        }
+        stopDrag(cb_event) {
+            if (this.dragging && this.opts.dragstop && cb_event) {
+                cb_event.type = "dragstop";
+                try {
+                    this.opts.dragstop(cb_event);
+                }
+                catch (err) {
+                    console.error("dragstop error", err); // eslint-disable-line no-console
+                }
+            }
+            this.dragElem = null;
+            this.dragging = false;
+            this.start.event = null;
+            this.customData = {};
+        }
+        handleEvent(e) {
+            const type = e.type;
+            const opts = this.opts;
+            const cb_event = {
+                type: e.type,
+                startEvent: type === "mousedown" ? e : this.start.event,
+                event: e,
+                customData: this.customData,
+                dragElem: this.dragElem,
+                dx: e.pageX - this.start.x,
+                dy: e.pageY - this.start.y,
+                apply: undefined,
+            };
+            // console.log("handleEvent", type, cb_event);
+            switch (type) {
+                case "keydown":
+                    this.stopDrag(cb_event);
+                    break;
+                case "mousedown":
+                    if (this.dragElem) {
+                        this.stopDrag(cb_event);
+                        break;
+                    }
+                    if (opts.selector) {
+                        let elem = e.target;
+                        if (elem.matches(opts.selector)) {
+                            this.dragElem = elem;
+                        }
+                        else {
+                            elem = elem.closest(opts.selector);
+                            if (elem) {
+                                this.dragElem = elem;
+                            }
+                            else {
+                                break; // no event delegation selector matched
+                            }
+                        }
+                    }
+                    this.start.event = e;
+                    this.start.x = e.pageX;
+                    this.start.y = e.pageY;
+                    this.start.altKey = e.altKey;
+                    this.start.ctrlKey = e.ctrlKey;
+                    this.start.metaKey = e.metaKey;
+                    this.start.shiftKey = e.shiftKey;
+                    break;
+                case "mousemove":
+                    // TODO: debounce/throttle?
+                    // TODO: horizontal mode: ignore if dx unchanged
+                    if (!this.dragElem) {
+                        break;
+                    }
+                    if (!this.dragging) {
+                        if (opts.thresh) {
+                            const dist2 = cb_event.dx * cb_event.dx + cb_event.dy * cb_event.dy;
+                            if (dist2 < opts.thresh * opts.thresh) {
+                                break;
+                            }
+                        }
+                        cb_event.type = "dragstart";
+                        if (opts.dragstart(cb_event) === false) {
+                            this.stopDrag(cb_event);
+                            break;
+                        }
+                        this.dragging = true;
+                    }
+                    if (this.dragging && this.opts.drag) {
+                        cb_event.type = "drag";
+                        this.opts.drag(cb_event);
+                    }
+                    break;
+                case "mouseup":
+                    if (!this.dragging) {
+                        this.stopDrag(cb_event);
+                        break;
+                    }
+                    if (e.button === 0) {
+                        cb_event.apply = true;
+                    }
+                    else {
+                        cb_event.apply = false;
+                    }
+                    this.stopDrag(cb_event);
+                    break;
+            }
+        }
+    }
+
+    /*!
+     * Wunderbaum - common
+     * Copyright (c) 2021-2024, Martin Wendt. Released under the MIT license.
+     * v0.12.0, Sun, 12 Jan 2025 10:51:41 GMT (https://github.com/mar10/wunderbaum)
+     */
+    const DEFAULT_DEBUGLEVEL = 3; // Replaced by rollup script
+    /**
+     * Fixed height of a row in pixel. Must match the SCSS variable `$row-outer-height`.
+     */
+    const DEFAULT_ROW_HEIGHT = 22;
+    /**
+     * Fixed width of node icons in pixel. Must match the SCSS variable `$icon-outer-width`.
+     */
+    const ICON_WIDTH = 20;
+    /**
+     * Adjust the width of the title span, so overflow ellipsis work.
+     * (2 x `$col-padding-x` + 3px rounding errors).
+     */
+    const TITLE_SPAN_PAD_Y = 7;
+    /** Render row markup for N nodes above and below the visible viewport. */
+    const RENDER_MAX_PREFETCH = 5;
+    /** Minimum column width if not set otherwise. */
+    const DEFAULT_MIN_COL_WIDTH = 4;
+    /** Regular expression to detect if a string describes an image URL (in contrast
+     * to a class name). Strings are considered image urls if they contain '.' or '/'.
+     */
+    const TEST_IMG = new RegExp(/\.|\//);
+    // export const RECURSIVE_REQUEST_ERROR = "$recursive_request";
+    // export const INVALID_REQUEST_TARGET_ERROR = "$request_target_invalid";
+    /**
+     * Default node icons.
+     * Requires bootstrap icons https://icons.getbootstrap.com
+     */
+    const iconMaps = {
+        bootstrap: {
+            error: "bi bi-exclamation-triangle",
+            // loading: "bi bi-hourglass-split wb-busy",
+            loading: "bi bi-chevron-right wb-busy",
+            // loading: "bi bi-arrow-repeat wb-spin",
+            // loading: '<div class="spinner-border spinner-border-sm" role="status"> <span class="visually-hidden">Loading...</span> </div>',
+            // noData: "bi bi-search",
+            noData: "bi bi-question-circle",
+            expanderExpanded: "bi bi-chevron-down",
+            // expanderExpanded: "bi bi-dash-square",
+            expanderCollapsed: "bi bi-chevron-right",
+            // expanderCollapsed: "bi bi-plus-square",
+            expanderLazy: "bi bi-chevron-right wb-helper-lazy-expander",
+            // expanderLazy: "bi bi-chevron-bar-right",
+            checkChecked: "bi bi-check-square",
+            checkUnchecked: "bi bi-square",
+            checkUnknown: "bi bi-dash-square-dotted",
+            radioChecked: "bi bi-circle-fill",
+            radioUnchecked: "bi bi-circle",
+            radioUnknown: "bi bi-record-circle",
+            folder: "bi bi-folder2",
+            folderOpen: "bi bi-folder2-open",
+            folderLazy: "bi bi-folder-symlink",
+            doc: "bi bi-file-earmark",
+            colSortable: "bi bi-chevron-expand",
+            // colSortable: "bi bi-arrow-down-up",
+            // colSortAsc: "bi bi-chevron-down",
+            // colSortDesc: "bi bi-chevron-up",
+            colSortAsc: "bi bi-arrow-down",
+            colSortDesc: "bi bi-arrow-up",
+            colFilter: "bi bi-filter-circle",
+            colFilterActive: "bi bi-filter-circle-fill wb-helper-invalid",
+            colMenu: "bi bi-three-dots-vertical",
+        },
+        fontawesome6: {
+            error: "fa-solid fa-triangle-exclamation",
+            loading: "fa-solid fa-chevron-right fa-beat",
+            noData: "fa-solid fa-circle-question",
+            expanderExpanded: "fa-solid fa-chevron-down",
+            expanderCollapsed: "fa-solid fa-chevron-right",
+            expanderLazy: "fa-solid fa-chevron-right wb-helper-lazy-expander",
+            checkChecked: "fa-regular fa-square-check",
+            checkUnchecked: "fa-regular fa-square",
+            checkUnknown: "fa-regular fa-square-minus",
+            radioChecked: "fa-solid fa-circle",
+            radioUnchecked: "fa-regular fa-circle",
+            radioUnknown: "fa-regular fa-circle-question",
+            folder: "fa-solid fa-folder-closed",
+            folderOpen: "fa-regular fa-folder-open",
+            folderLazy: "fa-solid fa-folder-plus",
+            doc: "fa-regular fa-file",
+            colSortable: "fa-solid fa-fw fa-sort",
+            colSortAsc: "fa-solid fa-fw fa-sort-up",
+            colSortDesc: "fa-solid fa-fw fa-sort-down",
+            colFilter: "fa-solid fa-fw fa-filter",
+            colFilterActive: "fa-solid fa-fw fa-filter wb-helper-invalid",
+            colMenu: "fa-solid fa-fw fa-ellipsis-v",
+        },
+    };
+    /** Dict keys that are evaluated by source loader (others are added to `tree.data` instead). */
+    const RESERVED_TREE_SOURCE_KEYS = new Set([
+        "_format", // reserved for future use
+        "_keyMap", // Used for compressed data format
+        "_positional", // Used for compressed data format
+        "_typeList", // Used for compressed data format @deprecated
+        "_valueMap", // Used for compressed data format
+        "_version", // reserved for future use
+        "children",
+        "columns",
+        "types",
+    ]);
+    // /** Key codes that trigger grid navigation, even when inside an input element. */
+    // export const INPUT_BREAKOUT_KEYS: Set<string> = new Set([
+    //   // "ArrowDown",
+    //   // "ArrowUp",
+    //   "Enter",
+    //   "Escape",
+    // ]);
+    /** Map `KeyEvent.key` to navigation action. */
+    const KEY_TO_ACTION_DICT = {
+        " ": "toggleSelect",
+        "+": "expand",
+        Add: "expand",
+        ArrowDown: "down",
+        ArrowLeft: "left",
+        ArrowRight: "right",
+        ArrowUp: "up",
+        Backspace: "parent",
+        "/": "collapseAll",
+        Divide: "collapseAll",
+        End: "lastCol",
+        Home: "firstCol",
+        "Control+End": "last",
+        "Control+Home": "first",
+        "Meta+ArrowDown": "last", // macOs
+        "Meta+ArrowUp": "first", // macOs
+        "*": "expandAll",
+        Multiply: "expandAll",
+        PageDown: "pageDown",
+        PageUp: "pageUp",
+        "-": "collapse",
+        Subtract: "collapse",
+    };
+    /** Return a callback that returns true if the node title matches the string
+     * or regular expression.
+     * @see {@link WunderbaumNode.findAll}
+     */
+    function makeNodeTitleMatcher(match) {
+        if (match instanceof RegExp) {
+            return function (node) {
+                return match.test(node.title);
+            };
+        }
+        assert(typeof match === "string", `Expected a string or RegExp: ${match}`);
+        // s = escapeRegex(s.toLowerCase());
+        return function (node) {
+            return node.title === match;
+            // console.log("match " + node, node.title.toLowerCase().indexOf(match))
+            // return node.title.toLowerCase().indexOf(match) >= 0;
+        };
+    }
+    /** Return a callback that returns true if the node title starts with a string (case-insensitive). */
+    function makeNodeTitleStartMatcher(s) {
+        s = escapeRegex(s);
+        const reMatch = new RegExp("^" + s, "i");
+        return function (node) {
+            return reMatch.test(node.title);
+        };
+    }
+    /** Compare two nodes by title (case-insensitive). */
+    function nodeTitleSorter(a, b) {
+        const x = a.title.toLowerCase();
+        const y = b.title.toLowerCase();
+        return x === y ? 0 : x > y ? 1 : -1;
+    }
+    /**
+     * Convert 'flat' to 'nested' format.
+     *
+     *  Flat node entry format:
+     *    [PARENT_ID, [POSITIONAL_ARGS]]
+     *  or
+     *    [PARENT_ID, [POSITIONAL_ARGS], {KEY_VALUE_ARGS}]
+     *
+     * 1. Parent-referencing list is converted to a list of nested dicts with
+     *    optional `children` properties.
+     * 2. `[POSITIONAL_ARGS]` are added as dict attributes.
+     */
+    function unflattenSource(source) {
+        var _a, _b, _c;
+        const { _format, _keyMap = {}, _positional = [], children } = source;
+        if (_format !== "flat") {
+            throw new Error(`Expected source._format: "flat", but got ${_format}`);
+        }
+        if (_positional && _positional.includes("children")) {
+            throw new Error(`source._positional must not include "children": ${_positional}`);
+        }
+        let longToShort = _keyMap;
+        if (_keyMap.t) {
+            // Inverse keyMap was used (pre 0.7.0)
+            // TODO: raise Error on final 1.x release
+            const msg = `source._keyMap maps from long to short since v0.7.0. Flip key/value!`;
+            console.warn(msg); // eslint-disable-line no-console
+            longToShort = {};
+            for (const [key, value] of Object.entries(_keyMap)) {
+                longToShort[value] = key;
+            }
+        }
+        const positionalShort = _positional.map((e) => longToShort[e]);
+        const newChildren = [];
+        const keyToNodeMap = {};
+        const indexToNodeMap = {};
+        const keyAttrName = (_a = longToShort["key"]) !== null && _a !== void 0 ? _a : "key";
+        const childrenAttrName = (_b = longToShort["children"]) !== null && _b !== void 0 ? _b : "children";
+        for (const [index, nodeTuple] of children.entries()) {
+            // Node entry format:
+            //   [PARENT_ID, [POSITIONAL_ARGS]]
+            // or
+            //   [PARENT_ID, [POSITIONAL_ARGS], {KEY_VALUE_ARGS}]
+            const [parentId, args, kwargs = {}] = nodeTuple;
+            // Free up some memory as we go
+            nodeTuple[1] = null;
+            if (nodeTuple[2] != null) {
+                nodeTuple[2] = null;
+            }
+            // console.log("flatten", parentId, args, kwargs)
+            // We keep `kwargs` as our new node definition. Then we add all positional
+            // values to this object:
+            args.forEach((val, positionalIdx) => {
+                kwargs[positionalShort[positionalIdx]] = val;
+            });
+            // Find the parent node. `null` means 'toplevel'. PARENT_ID may be the numeric
+            // index of the source.children list. If PARENT_ID is a string, we search
+            // a parent with node.key of this value.
+            indexToNodeMap[index] = kwargs;
+            const key = kwargs[keyAttrName];
+            if (key != null) {
+                keyToNodeMap[key] = kwargs;
+            }
+            let parentNode = null;
+            if (parentId === null) ;
+            else if (typeof parentId === "number") {
+                parentNode = indexToNodeMap[parentId];
+                if (parentNode === undefined) {
+                    throw new Error(`unflattenSource: Could not find parent node by index: ${parentId}.`);
+                }
+            }
+            else {
+                parentNode = keyToNodeMap[parentId];
+                if (parentNode === undefined) {
+                    throw new Error(`unflattenSource: Could not find parent node by key: ${parentId}`);
+                }
+            }
+            if (parentNode) {
+                (_c = parentNode[childrenAttrName]) !== null && _c !== void 0 ? _c : (parentNode[childrenAttrName] = []);
+                parentNode[childrenAttrName].push(kwargs);
+            }
+            else {
+                newChildren.push(kwargs);
             }
-            return false;
         }
+        source.children = newChildren;
     }
-
-    /*!
-     * Wunderbaum - drag_observer
-     * Copyright (c) 2021-2024, Martin Wendt. Released under the MIT license.
-     * v0.11.0, Sun, 04 Aug 2024 15:35:53 GMT (https://github.com/mar10/wunderbaum)
-     */
     /**
-     * Convert mouse- and touch events to 'dragstart', 'drag', and 'dragstop'.
+     * Decompresses the source data by
+     * - converting from 'flat' to 'nested' format
+     * - expanding short alias names to long names (if defined in _keyMap)
+     * - resolving value indexes to value strings (if defined in _valueMap)
+     *
+     * @param source - The source object to be decompressed.
+     * @returns void
      */
-    class DragObserver {
-        constructor(opts) {
-            this.start = {
-                event: null,
-                x: 0,
-                y: 0,
-                altKey: false,
-                ctrlKey: false,
-                metaKey: false,
-                shiftKey: false,
-            };
-            this.dragElem = null;
-            this.dragging = false;
-            this.customData = {};
-            // TODO: touch events
-            this.events = ["mousedown", "mouseup", "mousemove", "keydown"];
-            if (!opts.root) {
-                throw new Error("Missing `root` option.");
+    function decompressSourceData(source) {
+        let { _format, _version = 1, _keyMap, _valueMap } = source;
+        assert(_version === 1, `Expected file version 1 instead of ${_version}`);
+        let longToShort = _keyMap;
+        let shortToLong = {};
+        if (longToShort) {
+            for (const [key, value] of Object.entries(longToShort)) {
+                shortToLong[value] = key;
             }
-            this.opts = Object.assign({ thresh: 5 }, opts);
-            this.root = opts.root;
-            this._handler = this.handleEvent.bind(this);
-            this.events.forEach((type) => {
-                this.root.addEventListener(type, this._handler);
-            });
-        }
-        /** Unregister all event listeners. */
-        disconnect() {
-            this.events.forEach((type) => {
-                this.root.removeEventListener(type, this._handler);
-            });
-        }
-        getDragElem() {
-            return this.dragElem;
         }
-        isDragging() {
-            return this.dragging;
+        // Fallback for old format (pre 0.7.0, using _keyMap in reverse direction)
+        // TODO: raise Error on final 1.x release
+        if (longToShort && longToShort.t) {
+            const msg = `source._keyMap maps from long to short since v0.7.0. Flip key/value!`;
+            console.warn(msg); // eslint-disable-line no-console
+            [longToShort, shortToLong] = [shortToLong, longToShort];
         }
-        stopDrag(cb_event) {
-            if (this.dragging && this.opts.dragstop && cb_event) {
-                cb_event.type = "dragstop";
-                try {
-                    this.opts.dragstop(cb_event);
-                }
-                catch (err) {
-                    console.error("dragstop error", err); // eslint-disable-line no-console
-                }
+        // Fallback for old format (pre 0.7.0, using _typeList instead of _valueMap)
+        // TODO: raise Error on final 1.x release
+        if (source._typeList != null) {
+            const msg = `source._typeList is deprecated since v0.7.0: use source._valueMap: {"type": [...]} instead.`;
+            if (_valueMap != null) {
+                throw new Error(msg);
+            }
+            else {
+                console.warn(msg); // eslint-disable-line no-console
+                _valueMap = { type: source._typeList };
+                delete source._typeList;
             }
-            this.dragElem = null;
-            this.dragging = false;
-            this.start.event = null;
-            this.customData = {};
         }
-        handleEvent(e) {
-            const type = e.type;
-            const opts = this.opts;
-            const cb_event = {
-                type: e.type,
-                startEvent: type === "mousedown" ? e : this.start.event,
-                event: e,
-                customData: this.customData,
-                dragElem: this.dragElem,
-                dx: e.pageX - this.start.x,
-                dy: e.pageY - this.start.y,
-                apply: undefined,
-            };
-            // console.log("handleEvent", type, cb_event);
-            switch (type) {
-                case "keydown":
-                    this.stopDrag(cb_event);
-                    break;
-                case "mousedown":
-                    if (this.dragElem) {
-                        this.stopDrag(cb_event);
-                        break;
-                    }
-                    if (opts.selector) {
-                        let elem = e.target;
-                        if (elem.matches(opts.selector)) {
-                            this.dragElem = elem;
-                        }
-                        else {
-                            elem = elem.closest(opts.selector);
-                            if (elem) {
-                                this.dragElem = elem;
-                            }
-                            else {
-                                break; // no event delegation selector matched
-                            }
+        if (_format === "flat") {
+            unflattenSource(source);
+        }
+        delete source._format;
+        delete source._version;
+        delete source._keyMap;
+        delete source._valueMap;
+        delete source._positional;
+        function _iter(childList) {
+            for (const node of childList) {
+                // Iterate over a list of names, because we modify inside the loop
+                // (for ... of ... does not allow this)
+                Object.getOwnPropertyNames(node).forEach((propName) => {
+                    const value = node[propName];
+                    // Replace short names with long names if defined in _keyMap
+                    let longName = propName;
+                    if (_keyMap && shortToLong[propName] != null) {
+                        longName = shortToLong[propName];
+                        if (longName !== propName) {
+                            node[longName] = value;
+                            delete node[propName];
                         }
                     }
-                    this.start.event = e;
-                    this.start.x = e.pageX;
-                    this.start.y = e.pageY;
-                    this.start.altKey = e.altKey;
-                    this.start.ctrlKey = e.ctrlKey;
-                    this.start.metaKey = e.metaKey;
-                    this.start.shiftKey = e.shiftKey;
-                    break;
-                case "mousemove":
-                    // TODO: debounce/throttle?
-                    // TODO: horizontal mode: ignore if dx unchanged
-                    if (!this.dragElem) {
-                        break;
-                    }
-                    if (!this.dragging) {
-                        if (opts.thresh) {
-                            const dist2 = cb_event.dx * cb_event.dx + cb_event.dy * cb_event.dy;
-                            if (dist2 < opts.thresh * opts.thresh) {
-                                break;
-                            }
-                        }
-                        cb_event.type = "dragstart";
-                        if (opts.dragstart(cb_event) === false) {
-                            this.stopDrag(cb_event);
-                            break;
+                    // Replace type index with type name if defined in _valueMap
+                    if (_valueMap &&
+                        typeof value === "number" &&
+                        _valueMap[longName] != null) {
+                        const newValue = _valueMap[longName][value];
+                        if (newValue == null) {
+                            throw new Error(`Expected valueMap[${longName}][${value}] entry in [${_valueMap[longName]}]`);
                         }
-                        this.dragging = true;
-                    }
-                    if (this.dragging && this.opts.drag) {
-                        cb_event.type = "drag";
-                        this.opts.drag(cb_event);
-                    }
-                    break;
-                case "mouseup":
-                    if (!this.dragging) {
-                        this.stopDrag(cb_event);
-                        break;
-                    }
-                    if (e.button === 0) {
-                        cb_event.apply = true;
-                    }
-                    else {
-                        cb_event.apply = false;
+                        node[longName] = newValue;
                     }
-                    this.stopDrag(cb_event);
-                    break;
+                });
+                // Recursion
+                if (node.children) {
+                    _iter(node.children);
+                }
             }
         }
+        if (_keyMap || _valueMap) {
+            _iter(source.children);
+        }
     }
 
     /*!
      * Wunderbaum - ext-grid
      * Copyright (c) 2021-2024, Martin Wendt. Released under the MIT license.
-     * v0.11.0, Sun, 04 Aug 2024 15:35:53 GMT (https://github.com/mar10/wunderbaum)
+     * v0.12.0, Sun, 12 Jan 2025 10:51:41 GMT (https://github.com/mar10/wunderbaum)
      */
     class GridExtension extends WunderbaumExtension {
         constructor(tree) {
@@ -3017,7 +3032,7 @@
     /*!
      * Wunderbaum - deferred
      * Copyright (c) 2021-2024, Martin Wendt. Released under the MIT license.
-     * v0.11.0, Sun, 04 Aug 2024 15:35:53 GMT (https://github.com/mar10/wunderbaum)
+     * v0.12.0, Sun, 12 Jan 2025 10:51:41 GMT (https://github.com/mar10/wunderbaum)
      */
     /**
      * Implement a ES6 Promise, that exposes a resolve() and reject() method.
@@ -3070,7 +3085,7 @@
     /*!
      * Wunderbaum - wunderbaum_node
      * Copyright (c) 2021-2024, Martin Wendt. Released under the MIT license.
-     * v0.11.0, Sun, 04 Aug 2024 15:35:53 GMT (https://github.com/mar10/wunderbaum)
+     * v0.12.0, Sun, 12 Jan 2025 10:51:41 GMT (https://github.com/mar10/wunderbaum)
      */
     /** WunderbaumNode properties that can be passed with source data.
      * (Any other source properties will be stored as `node.data.PROP`.)
@@ -3098,6 +3113,20 @@
     const NODE_DICT_PROPS = new Set(NODE_PROPS);
     NODE_DICT_PROPS.delete("_partsel");
     NODE_DICT_PROPS.delete("unselectable");
+    // /** Node properties that are of type bool (or boolean & string).
+    //  *  When parsing, we accept 0 for false and 1 for true for better JSON compression.
+    //  */
+    // export const NODE_BOOL_PROPS: Set<string> = new Set([
+    //   "checkbox",
+    //   "colspan",
+    //   "expanded",
+    //   "icon",
+    //   "iconTooltip",
+    //   "radiogroup",
+    //   "selected",
+    //   "tooltip",
+    //   "unselectable",
+    // ]);
     /**
      * A single tree node.
      *
@@ -3139,20 +3168,26 @@
             this.parent = parent;
             this.key = "" + ((_a = data.key) !== null && _a !== void 0 ? _a : ++WunderbaumNode.sequence);
             this.title = "" + ((_b = data.title) !== null && _b !== void 0 ? _b : "<" + this.key + ">");
+            this.expanded = !!data.expanded;
+            this.lazy = !!data.lazy;
+            // We set the following node properties only if a matching data value is
+            // passed
             data.refKey != null ? (this.refKey = "" + data.refKey) : 0;
             data.type != null ? (this.type = "" + data.type) : 0;
-            this.expanded = data.expanded === true;
-            data.icon != null ? (this.icon = data.icon) : 0;
-            this.lazy = data.lazy === true;
+            data.icon != null ? (this.icon = intToBool(data.icon)) : 0;
+            data.tooltip != null ? (this.tooltip = intToBool(data.tooltip)) : 0;
+            data.iconTooltip != null
+                ? (this.iconTooltip = intToBool(data.iconTooltip))
+                : 0;
             data.statusNodeType != null
                 ? (this.statusNodeType = ("" + data.statusNodeType))
                 : 0;
             data.colspan != null ? (this.colspan = !!data.colspan) : 0;
             // Selection
-            data.checkbox != null ? (this.checkbox = !!data.checkbox) : 0;
+            data.checkbox != null ? intToBool(data.checkbox) : 0;
             data.radiogroup != null ? (this.radiogroup = !!data.radiogroup) : 0;
-            this.selected = data.selected === true;
-            data.unselectable === true ? (this.unselectable = true) : 0;
+            data.selected != null ? (this.selected = !!data.selected) : 0;
+            data.unselectable != null ? (this.unselectable = !!data.unselectable) : 0;
             if (data.classes) {
                 this.setClass(data.classes);
             }
@@ -3382,54 +3417,65 @@
         startEditTitle() {
             this.tree._callMethod("edit.startEditTitle", this);
         }
-        /** Call `setExpanded()` on all descendant nodes. */
+        /**
+         * Call `setExpanded()` on all descendant nodes.
+         *
+         * @param flag true to expand, false to collapse.
+         * @param options Additional options.
+         * @see {@link Wunderbaum.expandAll}
+         * @see {@link WunderbaumNode.setExpanded}
+         */
         async expandAll(flag = true, options) {
             const tree = this.tree;
-            const minExpandLevel = this.tree.options.minExpandLevel;
-            const { depth = 99, loadLazy, force, keepActiveNodeVisible = true, } = options !== null && options !== void 0 ? options : {};
+            const { collapseOthers, deep, depth, force, keepActiveNodeVisible = true, loadLazy, resetLazy, } = options !== null && options !== void 0 ? options : {};
+            // limit expansion level to `depth` (or tree.minExpandLevel). Default: unlimited
+            const treeLevel = this.tree.options.minExpandLevel || null; // 0 -> null
+            const minLevel = depth !== null && depth !== void 0 ? depth : (force ? null : treeLevel);
             const expandOpts = {
-                scrollIntoView: false, // don't scroll very node on iteration
+                deep: deep,
                 force: force,
                 loadLazy: loadLazy,
+                resetLazy: resetLazy,
+                scrollIntoView: false, // don't scroll every node while iterating
             };
-            // this.logInfo(`expandAll(${flag})`);
+            this.logInfo(`expandAll(${flag}, depth=${depth}, minLevel=${minLevel})`);
+            assert(!(flag && deep != null && !collapseOthers), "Expanding with `deep` option is not supported (implied by the `depth` option).");
             // Expand all direct children in parallel:
             async function _iter(n, level) {
                 var _a;
-                // n.logInfo(`  _iter(${level})`);
-                if (level === 0) {
-                    return;
-                }
-                // if (!flag && minExpandLevel && !force && n.getLevel() <= minExpandLevel) {
-                //   return; // Do not collapse until minExpandLevel
-                // }
-                const level_1 = level == null ? null : level - 1;
+                // n.logInfo(`  _iter(level=${level})`);
                 const promises = [];
                 (_a = n.children) === null || _a === void 0 ? void 0 : _a.forEach((cn) => {
                     if (flag) {
-                        if (!cn.expanded && (cn.children || (loadLazy && cn.lazy))) {
+                        if (!cn.expanded &&
+                            (minLevel == null || level < minLevel) &&
+                            (cn.children || (loadLazy && cn.lazy))) {
                             // Node is collapsed and may be expanded (i.e. has children or is lazy)
                             // Expanding may be async, so we store the promise.
                             // Also the recursion is delayed until expansion finished.
                             const p = cn.setExpanded(true, expandOpts);
                             promises.push(p);
-                            p.then(async () => {
-                                await _iter(cn, level_1);
-                            });
+                            if (depth == null) {
+                                p.then(async () => {
+                                    await _iter(cn, level + 1);
+                                });
+                            }
                         }
                         else {
                             // We don't expand the node, but still visit descendants.
                             // There we may find lazy nodes, so we
-                            promises.push(_iter(cn, level_1));
+                            promises.push(_iter(cn, level + 1));
                         }
                     }
                     else {
                         // Collapsing is always synchronous, so no promises required
-                        if (!minExpandLevel || force || cn.getLevel() > minExpandLevel) {
-                            // Do not collapse until minExpandLevel
+                        // Do not collapse until minExpandLevel
+                        if (minLevel == null || level >= minLevel) {
                             cn.setExpanded(false, expandOpts);
                         }
-                        _iter(cn, level_1); // recursion, even if cn was already collapsed
+                        if ((minLevel != null && level < minLevel) || deep) {
+                            _iter(cn, level + 1); // recursion, even if cn was already collapsed
+                        }
                     }
                 });
                 return new Promise((resolve) => {
@@ -3438,10 +3484,15 @@
                     });
                 });
             }
-            const tag = tree.logTime(`${this}.expandAll(${flag})`);
+            const tag = tree.logTime(`${this}.expandAll(${flag}, depth=${depth})`);
             try {
                 tree.enableUpdate(false);
-                await _iter(this, depth);
+                await _iter(this, 0);
+                if (collapseOthers) {
+                    assert(flag, "Option `collapseOthers` requires flag=true");
+                    assert(minLevel != null, "Option `collapseOthers` requires `depth` or `minExpandLevel`");
+                    this.expandAll(false, { depth: minLevel });
+                }
             }
             finally {
                 tree.enableUpdate(true);
@@ -3981,8 +4032,8 @@
             let elap = 0, elapLoad = 0, elapProcess = 0;
             // Check for overlapping requests
             if (this._requestId) {
-                this.logWarn(`Recursive load request #${requestId} while #${this._requestId} is pending.`);
-                // 	node.debug("Send load request #" + requestId);
+                this.logWarn(`Recursive load request #${requestId} while #${this._requestId} is pending. ` +
+                    "The previous request will be ignored.");
             }
             this._requestId = requestId;
             // const timerLabel = tree.logTime(this + ".load()");
@@ -4462,6 +4513,7 @@
         _render_markup(opts) {
             const tree = this.tree;
             const treeOptions = tree.options;
+            const rowHeight = treeOptions.rowHeightPx;
             const checkbox = this.getOption("checkbox");
             const columns = tree.columns;
             const level = this.getLevel();
@@ -4476,7 +4528,7 @@
             assert(!this.isRootNode(), "Root node not allowed");
             rowDiv = document.createElement("div");
             rowDiv.classList.add("wb-row");
-            rowDiv.style.top = this._rowIdx * ROW_HEIGHT + "px";
+            rowDiv.style.top = this._rowIdx * rowHeight + "px";
             this._rowElem = rowDiv;
             // Attach a node reference to the DOM Element:
             rowDiv._wb_node = this;
@@ -4929,7 +4981,7 @@
             const orgEvent = options === null || options === void 0 ? void 0 : options.event; // Default: null
             const colIdx = options === null || options === void 0 ? void 0 : options.colIdx; // Default: null
             const edit = options === null || options === void 0 ? void 0 : options.edit; // Default: false
-            assert(!colIdx || tree.isCellNav(), "colIdx requires cellNav");
+            // util.assert(!colIdx || tree.isCellNav(), "colIdx requires cellNav");
             assert(!edit || colIdx != null, "edit requires colIdx");
             if (!noEvents) {
                 if (flag) {
@@ -4983,7 +5035,7 @@
          * Expand or collapse this node.
          */
         async setExpanded(flag = true, options) {
-            const { force, scrollIntoView, immediate } = options !== null && options !== void 0 ? options : {};
+            const { force, scrollIntoView, immediate, resetLazy } = options !== null && options !== void 0 ? options : {};
             const sendEvents = !(options === null || options === void 0 ? void 0 : options.noEvents); // Default: send events
             if (!flag &&
                 this.isExpanded() &&
@@ -5006,6 +5058,9 @@
             if (flag && this.lazy && this.children == null) {
                 await this.loadLazy();
             }
+            else if (!flag && resetLazy && this.lazy && this.children) {
+                this.resetLazy();
+            }
             this.expanded = flag;
             const updateOpts = { immediate: immediate };
             // const updateOpts = { immediate: !!util.getOption(options, "immediate") };
@@ -5438,6 +5493,21 @@
                     av = a.data[propName];
                     bv = b.data[propName];
                 }
+                if (av == null && bv == null) {
+                    return 0;
+                }
+                if (av == null) {
+                    av = typeof bv === "string" ? "" : 0;
+                }
+                else if (typeof av === "boolean") {
+                    av = av ? 1 : 0;
+                }
+                if (bv == null) {
+                    bv = typeof av === "string" ? "" : 0;
+                }
+                else if (typeof bv === "boolean") {
+                    bv = bv ? 1 : 0;
+                }
                 if (caseInsensitive) {
                     if (typeof av === "string") {
                         av = av.toLowerCase();
@@ -5561,7 +5631,7 @@
     /*!
      * Wunderbaum - ext-edit
      * Copyright (c) 2021-2024, Martin Wendt. Released under the MIT license.
-     * v0.11.0, Sun, 04 Aug 2024 15:35:53 GMT (https://github.com/mar10/wunderbaum)
+     * v0.12.0, Sun, 12 Jan 2025 10:51:41 GMT (https://github.com/mar10/wunderbaum)
      */
     // const START_MARKER = "\uFFF7";
     class EditExtension extends WunderbaumExtension {
@@ -5725,6 +5795,10 @@
             if (!node) {
                 return;
             }
+            if (node.isStatusNode()) {
+                node.logWarn("Cannot edit status node.");
+                return;
+            }
             this.tree.logDebug(`startEditTitle(node=${node})`);
             let inputHtml = node._callEvent("edit.beforeEdit");
             if (inputHtml === false) {
@@ -5892,8 +5966,8 @@
      * https://github.com/mar10/wunderbaum
      *
      * Released under the MIT license.
-     * @version v0.11.0
-     * @date Sun, 04 Aug 2024 15:35:53 GMT
+     * @version v0.12.0
+     * @date Sun, 12 Jan 2025 10:51:41 GMT
      */
     // import "./wunderbaum.scss";
     class WbSystemRoot extends WunderbaumNode {
@@ -5975,7 +6049,7 @@
                 debugLevel: DEFAULT_DEBUGLEVEL, // 0:quiet, 1:errors, 2:warnings, 3:info, 4:verbose
                 header: null, // Show/hide header (pass bool or string)
                 // headerHeightPx: ROW_HEIGHT,
-                rowHeightPx: ROW_HEIGHT,
+                rowHeightPx: DEFAULT_ROW_HEIGHT,
                 iconMap: "bootstrap",
                 columns: null,
                 types: null,
@@ -6060,6 +6134,10 @@
             if (!this.element.getAttribute("tabindex")) {
                 this.element.tabIndex = 0;
             }
+            if (opts.rowHeightPx !== DEFAULT_ROW_HEIGHT) {
+                this.element.style.setProperty("--wb-row-outer-height", opts.rowHeightPx + "px");
+                this.element.style.setProperty("--wb-row-inner-height", opts.rowHeightPx - 2 + "px");
+            }
             // Attach tree instance to <div>
             this.element._wb_tree = this;
             // Create header markup, or take it from the existing html
@@ -6222,7 +6300,10 @@
                     false) {
                     return false;
                 }
-                if (node && info.colIdx === 0 && node.isExpandable()) {
+                if (node &&
+                    info.colIdx === 0 &&
+                    node.isExpandable() &&
+                    info.region !== NodeRegion.expander) {
                     this._callMethod("edit._stopEditTitle");
                     node.setExpanded(!node.isExpanded());
                 }
@@ -6469,31 +6550,33 @@
         }
         /** Return the topmost visible node in the viewport. */
         getTopmostVpNode(complete = true) {
+            const rowHeight = this.options.rowHeightPx;
             const gracePx = 1; // ignore subpixel scrolling
             const scrollParent = this.element;
             // const headerHeight = this.headerElement.clientHeight;  // May be 0
             const scrollTop = scrollParent.scrollTop; // + headerHeight;
             let topIdx;
             if (complete) {
-                topIdx = Math.ceil((scrollTop - gracePx) / ROW_HEIGHT);
+                topIdx = Math.ceil((scrollTop - gracePx) / rowHeight);
             }
             else {
-                topIdx = Math.floor(scrollTop / ROW_HEIGHT);
+                topIdx = Math.floor(scrollTop / rowHeight);
             }
             return this._getNodeByRowIdx(topIdx);
         }
         /** Return the lowest visible node in the viewport. */
         getLowestVpNode(complete = true) {
+            const rowHeight = this.options.rowHeightPx;
             const scrollParent = this.element;
             const headerHeight = this.headerElement.clientHeight; // May be 0
             const scrollTop = scrollParent.scrollTop;
             const clientHeight = scrollParent.clientHeight - headerHeight;
             let bottomIdx;
             if (complete) {
-                bottomIdx = Math.floor((scrollTop + clientHeight) / ROW_HEIGHT) - 1;
+                bottomIdx = Math.floor((scrollTop + clientHeight) / rowHeight) - 1;
             }
             else {
-                bottomIdx = Math.ceil((scrollTop + clientHeight) / ROW_HEIGHT) - 1;
+                bottomIdx = Math.ceil((scrollTop + clientHeight) / rowHeight) - 1;
             }
             bottomIdx = Math.min(bottomIdx, this.count(true) - 1);
             return this._getNodeByRowIdx(bottomIdx);
@@ -6925,8 +7008,9 @@
          * @param includeHidden Not yet implemented
          */
         findRelatedNode(node, where, includeHidden = false) {
+            const rowHeight = this.options.rowHeightPx;
             let res = null;
-            const pageSize = Math.floor(this.listContainerElement.clientHeight / ROW_HEIGHT);
+            const pageSize = Math.floor(this.listContainerElement.clientHeight / rowHeight);
             switch (where) {
                 case "parent":
                     if (node.parent && node.parent.parent) {
@@ -7249,6 +7333,7 @@
         scrollTo(nodeOrOpts) {
             const PADDING = 2; // leave some pixels between viewport bounds
             let node;
+            // WunderbaumNode;
             let options;
             if (nodeOrOpts instanceof WunderbaumNode) {
                 node = nodeOrOpts;
@@ -7258,14 +7343,15 @@
                 node = options.node;
             }
             assert(node && node._rowIdx != null, `Invalid node: ${node}`);
+            const rowHeight = this.options.rowHeightPx;
             const scrollParent = this.element;
             const headerHeight = this.headerElement.clientHeight; // May be 0
             const scrollTop = scrollParent.scrollTop;
             const vpHeight = scrollParent.clientHeight;
-            const rowTop = node._rowIdx * ROW_HEIGHT + headerHeight;
+            const rowTop = node._rowIdx * rowHeight + headerHeight;
             const vpTop = headerHeight;
             const vpRowTop = rowTop - scrollTop;
-            const vpRowBottom = vpRowTop + ROW_HEIGHT;
+            const vpRowBottom = vpRowTop + rowHeight;
             const topNode = options === null || options === void 0 ? void 0 : options.topNode;
             // this.log( `scrollTo(${node.title}), vpTop:${vpTop}px, scrollTop:${scrollTop}, vpHeight:${vpHeight}, rowTop:${rowTop}, vpRowTop:${vpRowTop}`, nodeOrOpts , options);
             let newScrollTop = null;
@@ -7274,7 +7360,7 @@
                 else {
                     // Node is below viewport
                     // this.log("Below viewport");
-                    newScrollTop = rowTop + ROW_HEIGHT - vpHeight + PADDING; // leave some pixels between viewport bounds
+                    newScrollTop = rowTop + rowHeight - vpHeight + PADDING; // leave some pixels between viewport bounds
                 }
             }
             else {
@@ -7887,19 +7973,19 @@
             // this.log("_updateRows", opts)
             options = Object.assign({ newNodesOnly: false }, options);
             const newNodesOnly = !!options.newNodesOnly;
-            const row_height = ROW_HEIGHT;
-            const vp_height = this.element.clientHeight;
+            const rowHeight = this.options.rowHeightPx;
+            const vpHeight = this.element.clientHeight;
             const prefetch = RENDER_MAX_PREFETCH;
             // const grace_prefetch = RENDER_MAX_PREFETCH - RENDER_MIN_PREFETCH;
             const ofs = this.element.scrollTop;
-            let startIdx = Math.max(0, ofs / row_height - prefetch);
+            let startIdx = Math.max(0, ofs / rowHeight - prefetch);
             startIdx = Math.floor(startIdx);
             // Make sure start is always even, so the alternating row colors don't
             // change when scrolling:
             if (startIdx % 2) {
                 startIdx--;
             }
-            let endIdx = Math.max(0, (ofs + vp_height) / row_height + prefetch);
+            let endIdx = Math.max(0, (ofs + vpHeight) / rowHeight + prefetch);
             endIdx = Math.ceil(endIdx);
             // this.debug("render", opts);
             const obsoleteNodes = new Set();
@@ -7928,21 +8014,21 @@
                 else if (rowDiv && newNodesOnly) {
                     obsoleteNodes.delete(node);
                     // no need to update existing node markup
-                    rowDiv.style.top = idx * ROW_HEIGHT + "px";
+                    rowDiv.style.top = idx * rowHeight + "px";
                     prevElem = rowDiv;
                 }
                 else {
                     obsoleteNodes.delete(node);
                     // Create new markup
                     if (rowDiv) {
-                        rowDiv.style.top = idx * ROW_HEIGHT + "px";
+                        rowDiv.style.top = idx * rowHeight + "px";
                     }
                     node._render({ top: top, after: prevElem });
                     // node.log("render", top, prevElem, "=>", node._rowElem);
                     prevElem = node._rowElem;
                 }
                 idx++;
-                top += row_height;
+                top += rowHeight;
             });
             this.treeRowCount = idx;
             for (const n of obsoleteNodes) {
@@ -8206,7 +8292,7 @@
     }
     Wunderbaum.sequence = 0;
     /** Wunderbaum release version number "MAJOR.MINOR.PATCH". */
-    Wunderbaum.version = "v0.11.0"; // Set to semver by 'grunt release'
+    Wunderbaum.version = "v0.12.0"; // Set to semver by 'grunt release'
     /** Expose some useful methods of the util.ts module as `Wunderbaum.util`. */
     Wunderbaum.util = util;