react-arborist 0.1.12 → 0.2.0-beta.0

package/dist/lib/data/make-tree.js

@@ -1,40 +0,0 @@
-"use strict";
-// A function that turns a string of text into a tree
-// Each line is a node
-// The number of spaces at the beginning indicate the level
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.makeTree = void 0;
-function makeTree(string) {
-    var root = { id: "ROOT", name: "ROOT", isOpen: true };
-    var prevNode = root;
-    var prevLevel = -1;
-    var id = 1;
-    string.split("\n").forEach(function (line) {
-        var name = line.trimStart();
-        var level = line.length - name.length;
-        var diff = level - prevLevel;
-        var node = { id: (id++).toString(), name: name, isOpen: true };
-        if (diff === 1) {
-            // First child
-            //@ts-ignore
-            node.parent = prevNode;
-            //@ts-ignore
-            prevNode.children = [node];
-        }
-        else {
-            // Find the parent and go up
-            //@ts-ignore
-            var parent_1 = prevNode.parent;
-            for (var i = diff; i < 0; i++) {
-                parent_1 = parent_1.parent;
-            }
-            //@ts-ignore
-            node.parent = parent_1;
-            parent_1.children.push(node);
-        }
-        prevNode = node;
-        prevLevel = level;
-    });
-    return root;
-}
-exports.makeTree = makeTree;

package/dist/lib/data/visible-nodes-hook.d.ts

@@ -1,2 +0,0 @@
-import { TreeProps, Node, IdObj } from "../types";
-export declare function useVisibleNodes<T extends IdObj>(props: TreeProps<T>): Node<T>[];

package/dist/lib/data/visible-nodes-hook.js

@@ -1,19 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.useVisibleNodes = void 0;
-var react_1 = require("react");
-var enrich_tree_1 = require("./enrich-tree");
-var flatten_tree_1 = require("./flatten-tree");
-function useVisibleNodes(props) {
-    var root = (0, react_1.useMemo)(function () {
-        return (0, enrich_tree_1.enrichTree)(props.data, props.hideRoot, props.childrenAccessor, props.isOpenAccessor, props.openByDefault);
-    }, [
-        props.data,
-        props.hideRoot,
-        props.childrenAccessor,
-        props.isOpenAccessor,
-        props.openByDefault,
-    ]);
-    return (0, react_1.useMemo)(function () { return (0, flatten_tree_1.flattenTree)(root); }, [root]);
-}
-exports.useVisibleNodes = useVisibleNodes;

package/dist/lib/dnd/compute-drop.d.ts

@@ -1,24 +0,0 @@
-import { XYCoord } from "react-dnd";
-import { Node } from "../types";
-declare type Args = {
-    element: HTMLElement;
-    offset: XYCoord;
-    indent: number;
-    node: Node | null;
-    prevNode: Node | null;
-    nextNode: Node | null;
-};
-export declare function computeDrop({ element, offset, indent, node, prevNode, nextNode, }: Args): {
-    parentId: string | null;
-    index: number;
-    cursor: {
-        parentId: string | null;
-        index: null;
-        level: null;
-    } | {
-        parentId: string | null;
-        index: number;
-        level: number;
-    };
-};
-export {};

package/dist/lib/dnd/compute-drop.js

@@ -1,113 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.computeDrop = void 0;
-var utils_1 = require("../utils");
-function measureHover(el, offset) {
-    var rect = el.getBoundingClientRect();
-    var x = offset.x - Math.round(rect.x);
-    var y = offset.y - Math.round(rect.y);
-    var height = rect.height;
-    var inTopHalf = y < height / 2;
-    var inBottomHalf = !inTopHalf;
-    var pad = height / 4;
-    var inMiddle = y > pad && y < height - pad;
-    return { x: x, inTopHalf: inTopHalf, inBottomHalf: inBottomHalf, inMiddle: inMiddle };
-}
-function getNodesAroundCursor(node, prev, next, hover) {
-    if (!node) {
-        // We're hoving over the empty part of the list, not over an item,
-        // Put the cursor below the last item which is "prev"
-        return [prev, null];
-    }
-    if ((0, utils_1.isFolder)(node)) {
-        if (!hover.inMiddle && hover.inTopHalf) {
-            return [prev, node];
-        }
-        else {
-            return [node, next];
-        }
-    }
-    else {
-        if (hover.inTopHalf) {
-            return [prev, node];
-        }
-        else {
-            return [node, next];
-        }
-    }
-}
-function getDropLocation(nodeAboveCursor, level, hover) {
-    var _a;
-    var dropIndex = 0;
-    var drop = nodeAboveCursor;
-    var dropParent = drop;
-    if (!drop || !drop.isDroppable) {
-        return [null, 0];
-    }
-    if ((0, utils_1.isFolder)(drop) && drop.isOpen && ((_a = drop.children) === null || _a === void 0 ? void 0 : _a.length)) {
-        // keep args the same
-    }
-    else if ((0, utils_1.isFolder)(drop) && hover.inMiddle) {
-        // keep args the same
-    }
-    else {
-        while (drop.parent && drop.level > level) {
-            drop = drop.parent;
-        }
-        dropIndex = (0, utils_1.indexOf)(drop) + 1;
-        dropParent = drop.parent;
-    }
-    return [dropParent, dropIndex];
-}
-function getDropLevel(hovering, aboveCursor, belowCursor, indent) {
-    var hoverLevel = Math.round(Math.max(0, hovering.x - indent) / indent);
-    var min, max;
-    if (!aboveCursor) {
-        max = 0;
-        min = 0;
-    }
-    else if (!belowCursor) {
-        max = aboveCursor.level;
-        min = 0;
-    }
-    else {
-        max = aboveCursor.level;
-        min = belowCursor.level;
-    }
-    return (0, utils_1.bound)(hoverLevel, min, max);
-}
-function computeDrop(_a) {
-    var _b, _c;
-    var element = _a.element, offset = _a.offset, indent = _a.indent, node = _a.node, prevNode = _a.prevNode, nextNode = _a.nextNode;
-    var hovering = measureHover(element, offset);
-    var _d = getNodesAroundCursor(node, prevNode, nextNode, hovering), above = _d[0], below = _d[1];
-    if (!above) {
-        return {
-            parentId: ((_b = below === null || below === void 0 ? void 0 : below.parent) === null || _b === void 0 ? void 0 : _b.id) || null,
-            index: 0,
-            cursor: {
-                parentId: ((_c = below === null || below === void 0 ? void 0 : below.parent) === null || _c === void 0 ? void 0 : _c.id) || null,
-                index: 0,
-                level: 0,
-            },
-        };
-    }
-    var level = getDropLevel(hovering, above, below, indent);
-    var _e = getDropLocation(above, level, hovering), parent = _e[0], index = _e[1];
-    // @ts-ignore
-    var ret = {
-        parentId: parent ? parent.id : null,
-        index: index,
-        cursor: parent && index === 0
-            ? { parentId: parent ? parent.id : null, index: null, level: null }
-            : {
-                parentId: parent ? parent.id : null,
-                index: above.rowIndex + 1,
-                level: level,
-            },
-    };
-    if (node !== null && !node.isDroppable)
-        ret.cursor = { parentId: null, index: null, level: null };
-    return ret;
-}
-exports.computeDrop = computeDrop;

package/dist/lib/dnd/drag-hook.js

@@ -1,36 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.useDragHook = void 0;
-var react_1 = require("react");
-var react_dnd_1 = require("react-dnd");
-var react_dnd_html5_backend_1 = require("react-dnd-html5-backend");
-var context_1 = require("../context");
-function useDragHook(node) {
-    var tree = (0, context_1.useStaticContext)();
-    var isSelected = (0, context_1.useIsSelected)();
-    var ids = (0, context_1.useSelectedIds)();
-    var _a = (0, react_dnd_1.useDrag)(function () { return ({
-        canDrag: function () { return node.isDraggable; },
-        type: "NODE",
-        item: function () { return ({
-            id: node.id,
-            dragIds: isSelected(node.rowIndex) ? ids : [node.id],
-        }); },
-        collect: function (m) { return ({
-            isDragging: m.isDragging(),
-        }); },
-        end: function (item, monitor) {
-            tree.api.hideCursor();
-            var drop = monitor.getDropResult();
-            if (drop && drop.parentId) {
-                tree.onMove(item.dragIds, drop.parentId, drop.index);
-                tree.onToggle(drop.parentId, true);
-            }
-        },
-    }); }, [ids, node]), isDragging = _a[0].isDragging, ref = _a[1], preview = _a[2];
-    (0, react_1.useEffect)(function () {
-        preview((0, react_dnd_html5_backend_1.getEmptyImage)());
-    }, [preview]);
-    return [{ isDragging: isDragging }, ref];
-}
-exports.useDragHook = useDragHook;

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

@@ -1,60 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.useDropHook = void 0;
-var react_dnd_1 = require("react-dnd");
-var context_1 = require("../context");
-var utils_1 = require("../utils");
-var compute_drop_1 = require("./compute-drop");
-function useDropHook(el, node, prev, next) {
-    var tree = (0, context_1.useStaticContext)();
-    return (0, react_dnd_1.useDrop)(function () { return ({
-        accept: "NODE",
-        canDrop: function (item) {
-            if (!node.isDroppable)
-                return false;
-            for (var _i = 0, _a = item.dragIds; _i < _a.length; _i++) {
-                var id = _a[_i];
-                var drag = tree.api.getNode(id);
-                if (!drag)
-                    return false;
-                if ((0, utils_1.isFolder)(drag) && (0, utils_1.isDecendent)(node, drag))
-                    return false;
-            }
-            return true;
-        },
-        hover: function (item, m) {
-            if (m.canDrop()) {
-                var offset = m.getClientOffset();
-                if (!el.current || !offset)
-                    return;
-                var cursor = (0, compute_drop_1.computeDrop)({
-                    element: el.current,
-                    offset: offset,
-                    indent: tree.indent,
-                    node: node,
-                    prevNode: prev,
-                    nextNode: next,
-                }).cursor;
-                tree.api.showCursor(cursor);
-            }
-            else {
-                tree.api.hideCursor();
-            }
-        },
-        drop: function (item, m) {
-            var offset = m.getClientOffset();
-            if (!el.current || !offset)
-                return;
-            var _a = (0, compute_drop_1.computeDrop)({
-                element: el.current,
-                offset: offset,
-                indent: tree.indent,
-                node: node,
-                prevNode: prev,
-                nextNode: next,
-            }), parentId = _a.parentId, index = _a.index;
-            return { parentId: parentId, index: index };
-        },
-    }); }, [node, prev, el, tree]);
-}
-exports.useDropHook = useDropHook;

package/dist/lib/dnd/measure-hover.d.ts

@@ -1,8 +0,0 @@
-import { XYCoord } from "react-dnd";
-export declare function measureHover(el: HTMLElement, offset: XYCoord, indent: number): {
-    level: number;
-    inTopHalf: boolean;
-    inBottomHalf: boolean;
-    inMiddle: boolean;
-};
-export declare type HoverData = ReturnType<typeof measureHover>;

package/dist/lib/dnd/measure-hover.js

@@ -1,21 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.measureHover = void 0;
-var utils_1 = require("../utils");
-function measureHover(el, offset, indent) {
-    var nextEl = el.nextElementSibling;
-    var prevEl = el.previousElementSibling;
-    var rect = el.getBoundingClientRect();
-    var x = offset.x - Math.round(rect.x);
-    var y = offset.y - Math.round(rect.y);
-    var height = rect.height;
-    var inTopHalf = y < height / 2;
-    var inBottomHalf = !inTopHalf;
-    var pad = height / 4;
-    var inMiddle = y > pad && y < height - pad;
-    var maxLevel = Number(inBottomHalf ? el.dataset.level : prevEl ? prevEl.dataset.level : 0);
-    var minLevel = Number(inTopHalf ? el.dataset.level : nextEl ? nextEl.dataset.level : 0);
-    var level = (0, utils_1.bound)(Math.floor(x / indent), minLevel, maxLevel);
-    return { level: level, inTopHalf: inTopHalf, inBottomHalf: inBottomHalf, inMiddle: inMiddle };
-}
-exports.measureHover = measureHover;

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

@@ -1,50 +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;
-            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 _a = (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,
-            }), parentId = _a.parentId, index = _a.index;
-            return { parentId: parentId, index: index };
-        },
-    }); }, [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,44 +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;
-    var _b = (0, react_1.useReducer)(reducer_1.reducer, (0, reducer_1.initState)()), state = _b[0], dispatch = _b[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: ((_a = state.cursorLocation) === null || _a === void 0 ? void 0 : _a.parentId) || null }, { 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.cursorLocation }, { children: props.children }), void 0) }), void 0) }), void 0) }), void 0) }), void 0) }), void 0));
-}
-exports.TreeViewProvider = TreeViewProvider;
-function isOverFolder(state) {
-    if (state.cursorLocation) {
-        return (!!state.cursorLocation.parentId && state.cursorLocation.index === null);
-    }
-    else {
-        return false;
-    }
-}

package/dist/lib/reducer.js

@@ -1,149 +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: [],
-    cursorLocation: null,
-    editingId: null,
-    selection: {
-        data: null,
-        ids: [],
-    },
-}); };
-exports.initState = initState;
-exports.actions = {
-    setCursorLocation: function (location) { return ({
-        type: "SET_CURSOR_LOCATION",
-        location: location,
-    }); },
-    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.cursorLocation, action.location)) {
-                return state;
-            }
-            else {
-                return __assign(__assign({}, state), { cursorLocation: action.location });
-            }
-        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 === b)
-        return true;
-    if (a === null || b === null)
-        return false;
-    return (a.parentId === b.parentId && a.index === b.index && a.level === b.level);
-}

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;