react-arborist 0.1.13 → 0.2.0-beta.1

package/dist/lib/dnd/outer-drop-hook.js

@@ -1,51 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.useOuterDrop = void 0;
-var react_dnd_1 = require("react-dnd");
-var context_1 = require("../context");
-var compute_drop_1 = require("./compute-drop");
-function useOuterDrop() {
-    var tree = (0, context_1.useStaticContext)();
-    // In case we drop an item at the bottom of the list
-    var _a = (0, react_dnd_1.useDrop)(function () { return ({
-        accept: "NODE",
-        hover: function (item, m) {
-            if (!m.isOver({ shallow: true }))
-                return;
-            var offset = m.getClientOffset();
-            if (!tree.listEl.current || !offset)
-                return;
-            var cursor = (0, compute_drop_1.computeDrop)({
-                element: tree.listEl.current,
-                offset: offset,
-                indent: tree.indent,
-                node: null,
-                prevNode: tree.api.visibleNodes[tree.api.visibleNodes.length - 1],
-                nextNode: null,
-            }).cursor;
-            if (cursor)
-                tree.api.showCursor(cursor);
-        },
-        canDrop: function (item, m) {
-            return m.isOver({ shallow: true });
-        },
-        drop: function (item, m) {
-            if (m.didDrop())
-                return;
-            var offset = m.getClientOffset();
-            if (!tree.listEl.current || !offset)
-                return;
-            var drop = (0, compute_drop_1.computeDrop)({
-                element: tree.listEl.current,
-                offset: offset,
-                indent: tree.indent,
-                node: null,
-                prevNode: tree.api.visibleNodes[tree.api.visibleNodes.length - 1],
-                nextNode: null,
-            }).drop;
-            return drop;
-        },
-    }); }, [tree]), drop = _a[1];
-    drop(tree.listEl);
-}
-exports.useOuterDrop = useOuterDrop;

package/dist/lib/index.d.ts

@@ -1,3 +0,0 @@
-export { Tree } from "./components/tree";
-export type { NodeRenderer, NodeState, NodeHandlers } from "./types";
-export { TreeApi } from "./tree-api";

package/dist/lib/index.js

@@ -1,7 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.TreeApi = exports.Tree = void 0;
-var tree_1 = require("./components/tree");
-Object.defineProperty(exports, "Tree", { enumerable: true, get: function () { return tree_1.Tree; } });
-var tree_api_1 = require("./tree-api");
-Object.defineProperty(exports, "TreeApi", { enumerable: true, get: function () { return tree_api_1.TreeApi; } });

package/dist/lib/provider.js

@@ -1,46 +0,0 @@
-"use strict";
-var __assign = (this && this.__assign) || function () {
-    __assign = Object.assign || function(t) {
-        for (var s, i = 1, n = arguments.length; i < n; i++) {
-            s = arguments[i];
-            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
-                t[p] = s[p];
-        }
-        return t;
-    };
-    return __assign.apply(this, arguments);
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.TreeViewProvider = void 0;
-var jsx_runtime_1 = require("react/jsx-runtime");
-var react_1 = require("react");
-var context_1 = require("./context");
-var reducer_1 = require("./reducer");
-var selection_hook_1 = require("./selection/selection-hook");
-var tree_api_hook_1 = require("./tree-api-hook");
-function TreeViewProvider(props) {
-    var _a = (0, react_1.useReducer)(reducer_1.reducer, (0, reducer_1.initState)()), state = _a[0], dispatch = _a[1];
-    var list = (0, react_1.useRef)();
-    var api = (0, tree_api_hook_1.useTreeApi)(state, dispatch, props, list.current);
-    (0, react_1.useImperativeHandle)(props.imperativeHandle, function () { return api; });
-    (0, selection_hook_1.useSelectionKeys)(props.listEl, api);
-    var staticValue = (0, react_1.useMemo)(function () { return (__assign(__assign({}, props), { api: api, list: list })); }, [props, api, list]);
-    /**
-     * This context pattern is ridiculous, next time use redux.
-     */
-    return (
-    // @ts-ignore
-    (0, jsx_runtime_1.jsx)(context_1.Static.Provider, __assign({ value: staticValue }, { children: (0, jsx_runtime_1.jsx)(context_1.EditingIdContext.Provider, __assign({ value: state.editingId }, { children: (0, jsx_runtime_1.jsx)(context_1.SelectionContext.Provider, __assign({ value: state.selection }, { children: (0, jsx_runtime_1.jsx)(context_1.CursorParentId.Provider, __assign({ value: getParentId(state.cursor) }, { children: (0, jsx_runtime_1.jsx)(context_1.IsCursorOverFolder.Provider, __assign({ value: isOverFolder(state) }, { children: (0, jsx_runtime_1.jsx)(context_1.CursorLocationContext.Provider, __assign({ value: state.cursor }, { children: props.children }), void 0) }), void 0) }), void 0) }), void 0) }), void 0) }), void 0));
-}
-exports.TreeViewProvider = TreeViewProvider;
-function getParentId(cursor) {
-    switch (cursor.type) {
-        case "highlight":
-            return cursor.id;
-        default:
-            return null;
-    }
-}
-function isOverFolder(state) {
-    return state.cursor.type === "highlight";
-}

package/dist/lib/reducer.js

@@ -1,147 +0,0 @@
-"use strict";
-var __assign = (this && this.__assign) || function () {
-    __assign = Object.assign || function(t) {
-        for (var s, i = 1, n = arguments.length; i < n; i++) {
-            s = arguments[i];
-            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
-                t[p] = s[p];
-        }
-        return t;
-    };
-    return __assign.apply(this, arguments);
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.reducer = exports.actions = exports.initState = void 0;
-var selection_1 = require("./selection/selection");
-var initState = function () { return ({
-    visibleIds: [],
-    cursor: { type: "none" },
-    editingId: null,
-    selection: {
-        data: null,
-        ids: [],
-    },
-}); };
-exports.initState = initState;
-exports.actions = {
-    setCursorLocation: function (cursor) { return ({
-        type: "SET_CURSOR_LOCATION",
-        cursor: cursor,
-    }); },
-    setVisibleIds: function (ids, // index to id
-    idMap // id to index
-    ) { return ({
-        type: "SET_VISIBLE_IDS",
-        ids: ids,
-        idMap: idMap,
-    }); },
-    select: function (index, meta, shift) { return ({
-        type: "SELECT",
-        index: index,
-        meta: meta,
-        shift: shift,
-    }); },
-    selectId: function (id) { return ({
-        type: "SELECT_ID",
-        id: id,
-    }); },
-    edit: function (id) { return ({
-        type: "EDIT",
-        id: id,
-    }); },
-    stepUp: function (shift, ids) { return ({
-        type: "STEP_UP",
-        shift: shift,
-    }); },
-    stepDown: function (shift, ids) { return ({
-        type: "STEP_DOWN",
-        shift: shift,
-    }); },
-};
-function reducer(state, action) {
-    switch (action.type) {
-        case "EDIT":
-            return __assign(__assign({}, state), { editingId: action.id });
-        case "SET_CURSOR_LOCATION":
-            if (equal(state.cursor, action.cursor)) {
-                return state;
-            }
-            else {
-                return __assign(__assign({}, state), { cursor: action.cursor });
-            }
-        case "SELECT":
-            var s = selection_1.Selection.parse(state.selection.data, state.visibleIds);
-            if (action.index === null) {
-                s.clear();
-            }
-            else if (action.meta) {
-                if (s.contains(action.index)) {
-                    s.deselect(action.index);
-                }
-                else {
-                    s.multiSelect(action.index);
-                }
-            }
-            else if (action.shift) {
-                s.extend(action.index);
-            }
-            else {
-                s.select(action.index);
-            }
-            return __assign(__assign({}, state), { selection: {
-                    data: s.serialize(),
-                    ids: s.getSelectedItems(),
-                } });
-        case "SELECT_ID":
-            return __assign(__assign({}, state), { selection: __assign(__assign({}, state.selection), { ids: [action.id] }) });
-        case "STEP_UP":
-            var s3 = selection_1.Selection.parse(state.selection.data, state.visibleIds);
-            var f = s3.getFocus();
-            if (action.shift) {
-                s3.extend(f - 1);
-            }
-            else {
-                s3.select(f - 1);
-            }
-            return __assign(__assign({}, state), { selection: {
-                    data: s3.serialize(),
-                    ids: s3.getSelectedItems(),
-                } });
-        case "STEP_DOWN":
-            var s6 = selection_1.Selection.parse(state.selection.data, state.visibleIds);
-            var f2 = s6.getFocus();
-            if (action.shift) {
-                s6.extend(f2 + 1);
-            }
-            else {
-                s6.select(f2 + 1);
-            }
-            return __assign(__assign({}, state), { selection: {
-                    data: s6.serialize(),
-                    ids: s6.getSelectedItems(),
-                } });
-        case "SET_VISIBLE_IDS":
-            // The visible ids changed
-            var ids = state.selection.ids;
-            // Start with a blank selection
-            var s2 = new selection_1.Selection([], null, "none", state.visibleIds);
-            // Add each of the old selected ids to this new selection
-            for (var _i = 0, ids_1 = ids; _i < ids_1.length; _i++) {
-                var id = ids_1[_i];
-                if (id in action.idMap)
-                    s2.multiSelect(action.idMap[id]);
-            }
-            return __assign(__assign({}, state), { visibleIds: action.ids, selection: {
-                    ids: ids,
-                    data: s2.serialize(),
-                } });
-        default:
-            return state;
-    }
-}
-exports.reducer = reducer;
-function equal(a, b) {
-    if (a === null || b === null)
-        return false;
-    return JSON.stringify(a) === JSON.stringify(b);
-}

package/dist/lib/selection/range.js

@@ -1,45 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.Range = void 0;
-var Range = /** @class */ (function () {
-    function Range(start, end) {
-        this.start = start;
-        this.end = end;
-        if (this.start > this.end)
-            throw new Error("Invalid range: start larger than end");
-    }
-    Range.prototype.serialize = function () {
-        return [this.start, this.end];
-    };
-    Range.prototype.contains = function (n) {
-        return n >= this.start && n <= this.end;
-    };
-    Range.prototype.overlaps = function (r) {
-        return this.contains(r.start - 1) || this.contains(r.end + 1);
-    };
-    Range.prototype.combine = function (r) {
-        this.start = Math.min(r.start, this.start);
-        this.end = Math.max(r.end, this.end);
-    };
-    Object.defineProperty(Range.prototype, "size", {
-        get: function () {
-            return this.end - this.start + 1;
-        },
-        enumerable: false,
-        configurable: true
-    });
-    Range.prototype.clone = function () {
-        return new Range(this.start, this.end);
-    };
-    Range.prototype.map = function (fn) {
-        var returns = [];
-        for (var i = this.start; i <= this.end; i++)
-            returns.push(fn(i));
-        return returns;
-    };
-    Range.prototype.isEqual = function (other) {
-        return this.start === other.start && this.end === other.end;
-    };
-    return Range;
-}());
-exports.Range = Range;

package/dist/lib/selection/selection-hook.js

@@ -1,24 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.useSelectionKeys = void 0;
-var react_1 = require("react");
-function useSelectionKeys(ref, api) {
-    (0, react_1.useEffect)(function () {
-        var el = ref.current;
-        var cb = function (e) {
-            if (e.code === "ArrowDown") {
-                e.preventDefault();
-                api.selectDownwards(e.shiftKey);
-            }
-            else if (e.code === "ArrowUp") {
-                e.preventDefault();
-                api.selectUpwards(e.shiftKey);
-            }
-        };
-        el === null || el === void 0 ? void 0 : el.addEventListener("keydown", cb);
-        return function () {
-            el === null || el === void 0 ? void 0 : el.removeEventListener("keydown", cb);
-        };
-    }, [ref, api]);
-}
-exports.useSelectionKeys = useSelectionKeys;

package/dist/lib/selection/selection.js

@@ -1,192 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.Selection = void 0;
-var range_1 = require("./range");
-var Selection = /** @class */ (function () {
-    function Selection(ranges, currentIndex, direction, items) {
-        var _this = this;
-        if (ranges === void 0) { ranges = []; }
-        if (currentIndex === void 0) { currentIndex = ranges.length ? ranges.length - 1 : null; }
-        if (direction === void 0) { direction = "none"; }
-        if (items === void 0) { items = []; }
-        this.ranges = [];
-        this.direction = "none";
-        ranges.forEach(function (_a) {
-            var s = _a[0], e = _a[1];
-            return _this.addRange(s, e);
-        });
-        this.currentIndex = currentIndex;
-        this.direction = direction;
-        this.items = items;
-    }
-    Selection.parse = function (data, items) {
-        if (data) {
-            return new Selection(data.ranges, data.currentIndex, data.direction, items);
-        }
-        else {
-            return new Selection();
-        }
-    };
-    Object.defineProperty(Selection.prototype, "current", {
-        get: function () {
-            if (this.currentIndex === null)
-                return null;
-            var range = this.ranges[this.currentIndex];
-            if (!range) {
-                return null;
-            }
-            else {
-                return range;
-            }
-        },
-        enumerable: false,
-        configurable: true
-    });
-    Selection.prototype.select = function (n) {
-        if (n < 0 || n >= this.items.length)
-            return;
-        this.clear();
-        this.currentIndex = this.addRange(n, n);
-    };
-    Selection.prototype.multiSelect = function (n) {
-        if (n < 0 || n >= this.items.length)
-            return;
-        if (this.contains(n))
-            return;
-        this.currentIndex = this.addRange(n, n);
-        this.compact(n);
-    };
-    Selection.prototype.deselect = function (n) {
-        if (n < 0 || n >= this.items.length)
-            return;
-        var r = this.ranges.find(function (r) { return r.contains(n); });
-        if (!r)
-            return;
-        else if (r.size === 1)
-            this.removeRange(r);
-        else if (r.start === n)
-            r.start++;
-        else if (r.end === n)
-            r.end--;
-        else {
-            this.removeRange(r);
-            this.addRange(r.start, n - 1);
-            this.currentIndex = this.addRange(n + 1, r.end);
-        }
-    };
-    Selection.prototype.getSelectedItems = function () {
-        var _this = this;
-        return this.ranges.flatMap(function (range) {
-            return range.map(function (index) { return _this.items[index]; });
-        });
-    };
-    Selection.prototype.extend = function (n) {
-        if (n < 0 || n >= this.items.length)
-            return;
-        if (this.isEmpty()) {
-            this.select(n);
-        }
-        else {
-            var anchor = this.getAnchor();
-            if (anchor !== null && this.current) {
-                var _a = [n, anchor].sort(function (a, b) { return a - b; }), start = _a[0], end = _a[1];
-                this.current.start = start;
-                this.current.end = end;
-                this.compact(n);
-            }
-        }
-    };
-    Selection.prototype.contains = function (n) {
-        if (n === null)
-            return false;
-        return this.ranges.some(function (r) { return r.contains(n); });
-    };
-    Selection.prototype.getRanges = function () {
-        return this.ranges.map(function (r) { return r.serialize(); });
-    };
-    Selection.prototype.clear = function () {
-        this.ranges = [];
-        this.currentIndex = null;
-        this.direction = "none";
-    };
-    Selection.prototype.serialize = function () {
-        return {
-            ranges: this.getRanges(),
-            currentIndex: this.currentIndex,
-            direction: this.direction,
-        };
-    };
-    Selection.prototype.isEqual = function (other) {
-        if (other.ranges.length !== this.ranges.length)
-            return false;
-        for (var i = 0; i < this.ranges.length; ++i) {
-            if (!this.ranges[i].isEqual(other.ranges[i]))
-                return false;
-        }
-        return true;
-    };
-    Selection.prototype.addRange = function (start, end) {
-        var r = new range_1.Range(start, end);
-        // Keep ranges sorted by start
-        var index = this.ranges.findIndex(function (r) { return r.start >= start; });
-        if (index === -1)
-            this.ranges.push(r);
-        else
-            this.ranges.splice(index, 0, r);
-        return index === -1 ? this.ranges.length - 1 : index;
-    };
-    Selection.prototype.removeRange = function (r) {
-        var index = this.ranges.indexOf(r);
-        this.ranges.splice(index, 1);
-        if (this.isEmpty()) {
-            this.currentIndex = null;
-        }
-        else if (index === this.currentIndex) {
-            this.currentIndex = this.ranges.length - 1;
-        }
-    };
-    Selection.prototype.isEmpty = function () {
-        return this.ranges.length === 0;
-    };
-    Selection.prototype.getAnchor = function () {
-        if (!this.current)
-            return null;
-        return this.direction === "backward"
-            ? this.current.end
-            : this.current.start;
-    };
-    Selection.prototype.getFocus = function () {
-        if (!this.current)
-            return -1;
-        return this.direction === "backward"
-            ? this.current.start
-            : this.current.end;
-    };
-    Selection.prototype.compact = function (focus) {
-        var _this = this;
-        var removals = [];
-        var current = this.current;
-        for (var _i = 0, _a = this.ranges; _i < _a.length; _i++) {
-            var r = _a[_i];
-            if (!this.current || r === this.current)
-                continue;
-            if (this.current.overlaps(r)) {
-                this.current.combine(r);
-                removals.push(r);
-            }
-        }
-        removals.forEach(function (r) { return _this.removeRange(r); });
-        if (current)
-            this.currentIndex = this.ranges.indexOf(current);
-        if (!this.current)
-            return;
-        if (this.current.start < focus)
-            this.direction = "forward";
-        else if (this.current.end > focus)
-            this.direction = "backward";
-        else
-            this.direction = "none";
-    };
-    return Selection;
-}());
-exports.Selection = Selection;

package/dist/lib/selection/selection.test.d.ts

@@ -1 +0,0 @@
-export {};

package/dist/lib/selection/selection.test.js

@@ -1,102 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-var selection_1 = require("./selection");
-var createSelection = function () {
-    var ranges = [];
-    for (var _i = 0; _i < arguments.length; _i++) {
-        ranges[_i] = arguments[_i];
-    }
-    return new selection_1.Selection(ranges);
-};
-describe("select", function () {
-    test("select one after end", function () {
-        var s = createSelection([0, 0]);
-        s.multiSelect(1);
-        expect(s.getRanges()).toEqual([[0, 1]]);
-        expect(s.direction).toEqual("forward");
-    });
-    test("select one before start", function () {
-        var s = createSelection([1, 1]);
-        s.multiSelect(0);
-        expect(s.getRanges()).toEqual([[0, 1]]);
-        expect(s.direction).toEqual("backward");
-    });
-    test("select between two ranges", function () {
-        var s = createSelection([0, 0], [2, 2]);
-        s.multiSelect(1);
-        expect(s.getRanges()).toEqual([[0, 2]]);
-        expect(s.direction).toEqual("forward");
-    });
-    test("select new spot", function () {
-        var s = createSelection([0, 0]);
-        s.multiSelect(5);
-        expect(s.getRanges()).toEqual([
-            [0, 0],
-            [5, 5],
-        ]);
-        expect(s.direction).toEqual("none");
-    });
-});
-describe("deselect", function () {
-    test("one", function () {
-        var s = createSelection([0, 0]);
-        s.deselect(0);
-        expect(s.getRanges()).toEqual([]);
-    });
-    test("start of a range", function () {
-        var s = createSelection([0, 5]);
-        s.deselect(0);
-        expect(s.getRanges()).toEqual([[1, 5]]);
-    });
-    test("end of a range", function () {
-        var s = createSelection([0, 5]);
-        s.deselect(5);
-        expect(s.getRanges()).toEqual([[0, 4]]);
-    });
-    test("between a range", function () {
-        var s = createSelection([0, 5]);
-        s.deselect(3);
-        expect(s.getRanges()).toEqual([
-            [0, 2],
-            [4, 5],
-        ]);
-    });
-});
-describe("extend", function () {
-    test("up", function () {
-        var s = createSelection();
-        s.multiSelect(5);
-        s.extend(6);
-        expect(s.getRanges()).toEqual([[5, 6]]);
-    });
-    test("down", function () {
-        var s = createSelection();
-        s.multiSelect(5);
-        s.extend(4);
-        expect(s.getRanges()).toEqual([[4, 5]]);
-    });
-    test("around anchor", function () {
-        var s = createSelection([5, 10]);
-        s.extend(1);
-        expect(s.getRanges()).toEqual([[1, 5]]);
-    });
-    test("through other ranges", function () {
-        var s = createSelection([0, 0], [5, 5], [9, 10]);
-        s.multiSelect(2);
-        s.extend(20);
-        expect(s.getRanges()).toEqual([
-            [0, 0],
-            [2, 20],
-        ]);
-    });
-    test("clicking backward", function () {
-        var s = createSelection([15, 15]);
-        s.extend(3);
-        expect(s.getRanges()).toEqual([[3, 15]]);
-    });
-    test("split range then extend", function () {
-        var s = createSelection([5, 10]);
-        s.deselect(8);
-        expect(s.currentIndex).toEqual(1);
-    });
-});

package/dist/lib/tree-api-hook.js

@@ -1,26 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.useTreeApi = void 0;
-var react_1 = require("react");
-var reducer_1 = require("./reducer");
-var tree_api_1 = require("./tree-api");
-function useTreeApi(state, dispatch, props, list) {
-    /**
-     * We only ever want one instance of the api object
-     * It will get updated as the props change, but the
-     * reference will not.
-     */
-    var api = (0, react_1.useMemo)(function () { return new tree_api_1.TreeApi(dispatch, state, props, list); }, 
-    // eslint-disable-next-line
-    []);
-    api.assign(dispatch, state, props, list);
-    /**
-     * This ensures that the selection remains correct even
-     * after opening and closing a folders
-     */
-    (0, react_1.useLayoutEffect)(function () {
-        dispatch(reducer_1.actions.setVisibleIds(api.visibleIds, api.idToIndex));
-    }, [dispatch, api, props.root]);
-    return api;
-}
-exports.useTreeApi = useTreeApi;