react-complex-tree - npm Package Compare versions

Comparing version 2.1.3 to 2.1.4-alpha.0

lib/cjs/controlledEnvironment/layoutUtils.js

 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.isOutsideOfContainer = exports.computeItemHeight = void 0;
+var utils_1 = require("../utils");
 var computeItemHeight = function (treeId) {
-    var _a;
-    var firstItem = document.querySelector("[data-rct-tree=\"".concat(treeId, "\"] [data-rct-item-container=\"true\"]"));
-    return (_a = firstItem === null || firstItem === void 0 ? void 0 : firstItem.offsetHeight) !== null && _a !== void 0 ? _a : 5;
+    var _a, _b;
+    var firstItem = (_a = (0, utils_1.getDocument)()) === null || _a === void 0 ? void 0 : _a.querySelector("[data-rct-tree=\"".concat(treeId, "\"] [data-rct-item-container=\"true\"]"));
+    return (_b = firstItem === null || firstItem === void 0 ? void 0 : firstItem.offsetHeight) !== null && _b !== void 0 ? _b : 5;
 };
@@ -9,0 +10,0 @@ exports.computeItemHeight = computeItemHeight;

lib/cjs/controlledEnvironment/useControlledTreeEnvironmentProps.js

@@ -52,8 +52,8 @@ "use strict";
     var onFocusItemHandler = (0, react_1.useCallback)(function (item, treeId) {
-        var _a, _b, _c, _d, _e;
-        var newItem = document.querySelector("[data-rct-tree=\"".concat(treeId, "\"] [data-rct-item-id=\"").concat(item.index, "\"]"));
+        var _a, _b, _c, _d, _e, _f, _g;
+        var newItem = (_a = (0, utils_1.getDocument)()) === null || _a === void 0 ? void 0 : _a.querySelector("[data-rct-tree=\"".concat(treeId, "\"] [data-rct-item-id=\"").concat(item.index, "\"]"));
         if (autoFocus !== null && autoFocus !== void 0 ? autoFocus : true) {
-            if (((_b = (_a = document.activeElement) === null || _a === void 0 ? void 0 : _a.attributes.getNamedItem('data-rct-search-input')) === null || _b === void 0 ? void 0 : _b.value) !== 'true') {
+            if (((_d = (_c = (_b = (0, utils_1.getDocument)()) === null || _b === void 0 ? void 0 : _b.activeElement) === null || _c === void 0 ? void 0 : _c.attributes.getNamedItem('data-rct-search-input')) === null || _d === void 0 ? void 0 : _d.value) !== 'true') {
                 // Move DOM focus to item if the current focus is not on the search input
-                (_c = newItem === null || newItem === void 0 ? void 0 : newItem.focus) === null || _c === void 0 ? void 0 : _c.call(newItem);
+                (_e = newItem === null || newItem === void 0 ? void 0 : newItem.focus) === null || _e === void 0 ? void 0 : _e.call(newItem);
             }
@@ -65,6 +65,6 @@ else {
         }
-        if (((_d = viewStateRef.current[treeId]) === null || _d === void 0 ? void 0 : _d.focusedItem) === item.index) {
+        if (((_f = viewStateRef.current[treeId]) === null || _f === void 0 ? void 0 : _f.focusedItem) === item.index) {
             return;
         }
-        (_e = onFocusItemRef.current) === null || _e === void 0 ? void 0 : _e.call(onFocusItemRef, item, treeId);
+        (_g = onFocusItemRef.current) === null || _g === void 0 ? void 0 : _g.call(onFocusItemRef, item, treeId);
     }, [autoFocus, onFocusItemRef, viewStateRef]);
@@ -97,5 +97,5 @@ var registerTree = (0, react_1.useCallback)(function (tree) {
     var focusTree = (0, react_1.useCallback)(function (treeId) {
-        var _a;
-        var focusItem = document.querySelector("[data-rct-tree=\"".concat(treeId, "\"] [data-rct-item-focus=\"true\"]"));
-        (_a = focusItem === null || focusItem === void 0 ? void 0 : focusItem.focus) === null || _a === void 0 ? void 0 : _a.call(focusItem);
+        var _a, _b;
+        var focusItem = (_a = (0, utils_1.getDocument)()) === null || _a === void 0 ? void 0 : _a.querySelector("[data-rct-tree=\"".concat(treeId, "\"] [data-rct-item-focus=\"true\"]"));
+        (_b = focusItem === null || focusItem === void 0 ? void 0 : focusItem.focus) === null || _b === void 0 ? void 0 : _b.call(focusItem);
     }, []);
@@ -105,8 +105,7 @@ var setActiveTree = (0, react_1.useCallback)(function (treeIdOrSetStateFunction, autoFocusTree) {
         var maybeFocusTree = function (treeId) {
-            var _a;
+            var _a, _b;
             if (autoFocusTree &&
                 (autoFocus !== null && autoFocus !== void 0 ? autoFocus : true) &&
                 treeId &&
-                !((_a = document
-                    .querySelector("[data-rct-tree=\"".concat(treeId, "\"]"))) === null || _a === void 0 ? void 0 : _a.contains(document.activeElement))) {
+                !((_b = (_a = (0, utils_1.getDocument)()) === null || _a === void 0 ? void 0 : _a.querySelector("[data-rct-tree=\"".concat(treeId, "\"]"))) === null || _b === void 0 ? void 0 : _b.contains(document.activeElement))) {
                 focusTree(treeId);
@@ -113,0 +112,0 @@ }

lib/cjs/hotkeys/useHotkey.js

@@ -8,2 +8,3 @@ "use strict";
 var useCallSoon_1 = require("../useCallSoon");
+var utils_1 = require("../utils");
 var elementsThatCanTakeText = ['input', 'textarea'];
@@ -20,3 +21,3 @@ var useHotkey = function (combinationName, onHit, active, activatableWhileFocusingInput) {
     }, [combinationName, keyboardBindings]);
-    (0, useHtmlElementEventListener_1.useHtmlElementEventListener)(document, 'keydown', function (e) {
+    (0, useHtmlElementEventListener_1.useHtmlElementEventListener)((0, utils_1.getDocument)(), 'keydown', function (e) {
         var _a;
@@ -52,3 +53,3 @@ if (active === false) {
     });
-    (0, useHtmlElementEventListener_1.useHtmlElementEventListener)(document, 'keyup', function (e) {
+    (0, useHtmlElementEventListener_1.useHtmlElementEventListener)((0, utils_1.getDocument)(), 'keyup', function (e) {
         if (active === false) {
@@ -55,0 +56,0 @@ return;

lib/cjs/hotkeys/useKey.js

@@ -5,4 +5,5 @@ "use strict";
 var useHtmlElementEventListener_1 = require("../useHtmlElementEventListener");
+var utils_1 = require("../utils");
 var useKey = function (key, onHit, active) {
-    (0, useHtmlElementEventListener_1.useHtmlElementEventListener)(typeof document !== 'undefined' ? document : undefined, 'keydown', function (e) {
+    (0, useHtmlElementEventListener_1.useHtmlElementEventListener)((0, utils_1.getDocument)(), 'keydown', function (e) {
         if (!active) {
@@ -9,0 +10,0 @@ return;

lib/cjs/search/SearchInput.js

@@ -22,2 +22,3 @@ "use strict";
 var useCallSoon_1 = require("../useCallSoon");
+var utils_1 = require("../utils");
 var SearchInput = function (_a) {
@@ -33,3 +34,3 @@ var _b;
     var clearSearch = function () {
-        var _a, _b;
+        var _a, _b, _c;
         setSearch(null);
@@ -39,4 +40,4 @@ if ((_a = environment.autoFocus) !== null && _a !== void 0 ? _a : true) {
             // TODO move logic as reusable method into tree or tree environment
-            var focusItem = document.querySelector("[data-rct-tree=\"".concat(treeId, "\"] [data-rct-item-focus=\"true\"]"));
-            (_b = focusItem === null || focusItem === void 0 ? void 0 : focusItem.focus) === null || _b === void 0 ? void 0 : _b.call(focusItem);
+            var focusItem = (_b = (0, utils_1.getDocument)()) === null || _b === void 0 ? void 0 : _b.querySelector("[data-rct-tree=\"".concat(treeId, "\"] [data-rct-item-focus=\"true\"]"));
+            (_c = focusItem === null || focusItem === void 0 ? void 0 : focusItem.focus) === null || _c === void 0 ? void 0 : _c.call(focusItem);
         }
@@ -43,0 +44,0 @@ };

lib/cjs/tree/scrollIntoView.js

 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.scrollIntoView = void 0;
+var utils_1 = require("../utils");
 var scrollIntoView = function (element) {
+    var _a, _b, _c, _d;
     if (!element) {
@@ -16,5 +18,6 @@ return;
             boundingBox.bottom <=
-                (window.innerHeight || document.documentElement.clientHeight) &&
+                (window.innerHeight ||
+                    !!((_b = (_a = (0, utils_1.getDocument)()) === null || _a === void 0 ? void 0 : _a.documentElement) === null || _b === void 0 ? void 0 : _b.clientHeight)) &&
             boundingBox.right <=
-                (window.innerWidth || document.documentElement.clientWidth);
+                (window.innerWidth || !!((_d = (_c = (0, utils_1.getDocument)()) === null || _c === void 0 ? void 0 : _c.documentElement) === null || _d === void 0 ? void 0 : _d.clientWidth));
         if (!isElementInViewport) {
@@ -21,0 +24,0 @@ element.scrollIntoView();

lib/cjs/utils.d.ts

 export declare const buildMapForTrees: <T>(treeIds: string[], build: (treeId: string) => T) => {
     [treeId: string]: T;
 };
+export declare const getDocument: () => Document | undefined;

lib/cjs/utils.js

@@ -14,3 +14,3 @@ "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.buildMapForTrees = void 0;
+exports.getDocument = exports.buildMapForTrees = void 0;
 var buildMapForTrees = function (treeIds, build) {
@@ -26,1 +26,5 @@ return treeIds
 exports.buildMapForTrees = buildMapForTrees;
+var getDocument = function () {
+    return typeof document !== 'undefined' ? document : undefined;
+};
+exports.getDocument = getDocument;

lib/esm/controlledEnvironment/layoutUtils.js

@@ -0,5 +1,6 @@
+import { getDocument } from '../utils';
 export var computeItemHeight = function (treeId) {
-    var _a;
-    var firstItem = document.querySelector("[data-rct-tree=\"".concat(treeId, "\"] [data-rct-item-container=\"true\"]"));
-    return (_a = firstItem === null || firstItem === void 0 ? void 0 : firstItem.offsetHeight) !== null && _a !== void 0 ? _a : 5;
+    var _a, _b;
+    var firstItem = (_a = getDocument()) === null || _a === void 0 ? void 0 : _a.querySelector("[data-rct-tree=\"".concat(treeId, "\"] [data-rct-item-container=\"true\"]"));
+    return (_b = firstItem === null || firstItem === void 0 ? void 0 : firstItem.offsetHeight) !== null && _b !== void 0 ? _b : 5;
 };
@@ -6,0 +7,0 @@ export var isOutsideOfContainer = function (e, treeBb) {

lib/esm/controlledEnvironment/useControlledTreeEnvironmentProps.js

@@ -26,3 +26,3 @@ var __assign = (this && this.__assign) || function () {
 import { useRenderers } from '../renderers/useRenderers';
-import { buildMapForTrees } from '../utils';
+import { buildMapForTrees, getDocument } from '../utils';
 import { getItemsLinearly } from '../tree/getItemsLinearly';
@@ -50,8 +50,8 @@ import { useRefCopy } from '../useRefCopy';
     var onFocusItemHandler = useCallback(function (item, treeId) {
-        var _a, _b, _c, _d, _e;
-        var newItem = document.querySelector("[data-rct-tree=\"".concat(treeId, "\"] [data-rct-item-id=\"").concat(item.index, "\"]"));
+        var _a, _b, _c, _d, _e, _f, _g;
+        var newItem = (_a = getDocument()) === null || _a === void 0 ? void 0 : _a.querySelector("[data-rct-tree=\"".concat(treeId, "\"] [data-rct-item-id=\"").concat(item.index, "\"]"));
         if (autoFocus !== null && autoFocus !== void 0 ? autoFocus : true) {
-            if (((_b = (_a = document.activeElement) === null || _a === void 0 ? void 0 : _a.attributes.getNamedItem('data-rct-search-input')) === null || _b === void 0 ? void 0 : _b.value) !== 'true') {
+            if (((_d = (_c = (_b = getDocument()) === null || _b === void 0 ? void 0 : _b.activeElement) === null || _c === void 0 ? void 0 : _c.attributes.getNamedItem('data-rct-search-input')) === null || _d === void 0 ? void 0 : _d.value) !== 'true') {
                 // Move DOM focus to item if the current focus is not on the search input
-                (_c = newItem === null || newItem === void 0 ? void 0 : newItem.focus) === null || _c === void 0 ? void 0 : _c.call(newItem);
+                (_e = newItem === null || newItem === void 0 ? void 0 : newItem.focus) === null || _e === void 0 ? void 0 : _e.call(newItem);
             }
@@ -63,6 +63,6 @@ else {
         }
-        if (((_d = viewStateRef.current[treeId]) === null || _d === void 0 ? void 0 : _d.focusedItem) === item.index) {
+        if (((_f = viewStateRef.current[treeId]) === null || _f === void 0 ? void 0 : _f.focusedItem) === item.index) {
             return;
         }
-        (_e = onFocusItemRef.current) === null || _e === void 0 ? void 0 : _e.call(onFocusItemRef, item, treeId);
+        (_g = onFocusItemRef.current) === null || _g === void 0 ? void 0 : _g.call(onFocusItemRef, item, treeId);
     }, [autoFocus, onFocusItemRef, viewStateRef]);
@@ -95,5 +95,5 @@ var registerTree = useCallback(function (tree) {
     var focusTree = useCallback(function (treeId) {
-        var _a;
-        var focusItem = document.querySelector("[data-rct-tree=\"".concat(treeId, "\"] [data-rct-item-focus=\"true\"]"));
-        (_a = focusItem === null || focusItem === void 0 ? void 0 : focusItem.focus) === null || _a === void 0 ? void 0 : _a.call(focusItem);
+        var _a, _b;
+        var focusItem = (_a = getDocument()) === null || _a === void 0 ? void 0 : _a.querySelector("[data-rct-tree=\"".concat(treeId, "\"] [data-rct-item-focus=\"true\"]"));
+        (_b = focusItem === null || focusItem === void 0 ? void 0 : focusItem.focus) === null || _b === void 0 ? void 0 : _b.call(focusItem);
     }, []);
@@ -103,8 +103,7 @@ var setActiveTree = useCallback(function (treeIdOrSetStateFunction, autoFocusTree) {
         var maybeFocusTree = function (treeId) {
-            var _a;
+            var _a, _b;
             if (autoFocusTree &&
                 (autoFocus !== null && autoFocus !== void 0 ? autoFocus : true) &&
                 treeId &&
-                !((_a = document
-                    .querySelector("[data-rct-tree=\"".concat(treeId, "\"]"))) === null || _a === void 0 ? void 0 : _a.contains(document.activeElement))) {
+                !((_b = (_a = getDocument()) === null || _a === void 0 ? void 0 : _a.querySelector("[data-rct-tree=\"".concat(treeId, "\"]"))) === null || _b === void 0 ? void 0 : _b.contains(document.activeElement))) {
                 focusTree(treeId);
@@ -111,0 +110,0 @@ }

lib/esm/hotkeys/useHotkey.js

@@ -5,2 +5,3 @@ import { useMemo, useRef } from 'react';
 import { useCallSoon } from '../useCallSoon';
+import { getDocument } from '../utils';
 var elementsThatCanTakeText = ['input', 'textarea'];
@@ -17,3 +18,3 @@ export var useHotkey = function (combinationName, onHit, active, activatableWhileFocusingInput) {
     }, [combinationName, keyboardBindings]);
-    useHtmlElementEventListener(document, 'keydown', function (e) {
+    useHtmlElementEventListener(getDocument(), 'keydown', function (e) {
         var _a;
@@ -49,3 +50,3 @@ if (active === false) {
     });
-    useHtmlElementEventListener(document, 'keyup', function (e) {
+    useHtmlElementEventListener(getDocument(), 'keyup', function (e) {
         if (active === false) {
@@ -52,0 +53,0 @@ return;

lib/esm/hotkeys/useKey.js

 import { useHtmlElementEventListener } from '../useHtmlElementEventListener';
+import { getDocument } from '../utils';
 export var useKey = function (key, onHit, active) {
-    useHtmlElementEventListener(typeof document !== 'undefined' ? document : undefined, 'keydown', function (e) {
+    useHtmlElementEventListener(getDocument(), 'keydown', function (e) {
         if (!active) {
@@ -5,0 +6,0 @@ return;

lib/esm/search/SearchInput.js

@@ -19,2 +19,3 @@ var __assign = (this && this.__assign) || function () {
 import { useCallSoon } from '../useCallSoon';
+import { getDocument } from '../utils';
 export var SearchInput = function (_a) {
@@ -30,3 +31,3 @@ var _b;
     var clearSearch = function () {
-        var _a, _b;
+        var _a, _b, _c;
         setSearch(null);
@@ -36,4 +37,4 @@ if ((_a = environment.autoFocus) !== null && _a !== void 0 ? _a : true) {
             // TODO move logic as reusable method into tree or tree environment
-            var focusItem = document.querySelector("[data-rct-tree=\"".concat(treeId, "\"] [data-rct-item-focus=\"true\"]"));
-            (_b = focusItem === null || focusItem === void 0 ? void 0 : focusItem.focus) === null || _b === void 0 ? void 0 : _b.call(focusItem);
+            var focusItem = (_b = getDocument()) === null || _b === void 0 ? void 0 : _b.querySelector("[data-rct-tree=\"".concat(treeId, "\"] [data-rct-item-focus=\"true\"]"));
+            (_c = focusItem === null || focusItem === void 0 ? void 0 : focusItem.focus) === null || _c === void 0 ? void 0 : _c.call(focusItem);
         }
@@ -40,0 +41,0 @@ };

lib/esm/tree/scrollIntoView.js

@@ -0,2 +1,4 @@
+import { getDocument } from '../utils';
 export var scrollIntoView = function (element) {
+    var _a, _b, _c, _d;
     if (!element) {
@@ -13,5 +15,6 @@ return;
             boundingBox.bottom <=
-                (window.innerHeight || document.documentElement.clientHeight) &&
+                (window.innerHeight ||
+                    !!((_b = (_a = getDocument()) === null || _a === void 0 ? void 0 : _a.documentElement) === null || _b === void 0 ? void 0 : _b.clientHeight)) &&
             boundingBox.right <=
-                (window.innerWidth || document.documentElement.clientWidth);
+                (window.innerWidth || !!((_d = (_c = getDocument()) === null || _c === void 0 ? void 0 : _c.documentElement) === null || _d === void 0 ? void 0 : _d.clientWidth));
         if (!isElementInViewport) {
@@ -18,0 +21,0 @@ element.scrollIntoView();

lib/esm/utils.d.ts

 export declare const buildMapForTrees: <T>(treeIds: string[], build: (treeId: string) => T) => {
     [treeId: string]: T;
 };
+export declare const getDocument: () => Document | undefined;

lib/esm/utils.js

@@ -21,1 +21,4 @@ var __assign = (this && this.__assign) || function () {
 };
+export var getDocument = function () {
+    return typeof document !== 'undefined' ? document : undefined;
+};

lib/esnext/controlledEnvironment/layoutUtils.js

@@ -0,5 +1,6 @@
+import { getDocument } from '../utils';
 export var computeItemHeight = function (treeId) {
-    var _a;
-    var firstItem = document.querySelector("[data-rct-tree=\"".concat(treeId, "\"] [data-rct-item-container=\"true\"]"));
-    return (_a = firstItem === null || firstItem === void 0 ? void 0 : firstItem.offsetHeight) !== null && _a !== void 0 ? _a : 5;
+    var _a, _b;
+    var firstItem = (_a = getDocument()) === null || _a === void 0 ? void 0 : _a.querySelector("[data-rct-tree=\"".concat(treeId, "\"] [data-rct-item-container=\"true\"]"));
+    return (_b = firstItem === null || firstItem === void 0 ? void 0 : firstItem.offsetHeight) !== null && _b !== void 0 ? _b : 5;
 };
@@ -6,0 +7,0 @@ export var isOutsideOfContainer = function (e, treeBb) {

lib/esnext/controlledEnvironment/useControlledTreeEnvironmentProps.js

@@ -26,3 +26,3 @@ var __assign = (this && this.__assign) || function () {
 import { useRenderers } from '../renderers/useRenderers';
-import { buildMapForTrees } from '../utils';
+import { buildMapForTrees, getDocument } from '../utils';
 import { getItemsLinearly } from '../tree/getItemsLinearly';
@@ -50,8 +50,8 @@ import { useRefCopy } from '../useRefCopy';
     var onFocusItemHandler = useCallback(function (item, treeId) {
-        var _a, _b, _c, _d, _e;
-        var newItem = document.querySelector("[data-rct-tree=\"".concat(treeId, "\"] [data-rct-item-id=\"").concat(item.index, "\"]"));
+        var _a, _b, _c, _d, _e, _f, _g;
+        var newItem = (_a = getDocument()) === null || _a === void 0 ? void 0 : _a.querySelector("[data-rct-tree=\"".concat(treeId, "\"] [data-rct-item-id=\"").concat(item.index, "\"]"));
         if (autoFocus !== null && autoFocus !== void 0 ? autoFocus : true) {
-            if (((_b = (_a = document.activeElement) === null || _a === void 0 ? void 0 : _a.attributes.getNamedItem('data-rct-search-input')) === null || _b === void 0 ? void 0 : _b.value) !== 'true') {
+            if (((_d = (_c = (_b = getDocument()) === null || _b === void 0 ? void 0 : _b.activeElement) === null || _c === void 0 ? void 0 : _c.attributes.getNamedItem('data-rct-search-input')) === null || _d === void 0 ? void 0 : _d.value) !== 'true') {
                 // Move DOM focus to item if the current focus is not on the search input
-                (_c = newItem === null || newItem === void 0 ? void 0 : newItem.focus) === null || _c === void 0 ? void 0 : _c.call(newItem);
+                (_e = newItem === null || newItem === void 0 ? void 0 : newItem.focus) === null || _e === void 0 ? void 0 : _e.call(newItem);
             }
@@ -63,6 +63,6 @@ else {
         }
-        if (((_d = viewStateRef.current[treeId]) === null || _d === void 0 ? void 0 : _d.focusedItem) === item.index) {
+        if (((_f = viewStateRef.current[treeId]) === null || _f === void 0 ? void 0 : _f.focusedItem) === item.index) {
             return;
         }
-        (_e = onFocusItemRef.current) === null || _e === void 0 ? void 0 : _e.call(onFocusItemRef, item, treeId);
+        (_g = onFocusItemRef.current) === null || _g === void 0 ? void 0 : _g.call(onFocusItemRef, item, treeId);
     }, [autoFocus, onFocusItemRef, viewStateRef]);
@@ -95,5 +95,5 @@ var registerTree = useCallback(function (tree) {
     var focusTree = useCallback(function (treeId) {
-        var _a;
-        var focusItem = document.querySelector("[data-rct-tree=\"".concat(treeId, "\"] [data-rct-item-focus=\"true\"]"));
-        (_a = focusItem === null || focusItem === void 0 ? void 0 : focusItem.focus) === null || _a === void 0 ? void 0 : _a.call(focusItem);
+        var _a, _b;
+        var focusItem = (_a = getDocument()) === null || _a === void 0 ? void 0 : _a.querySelector("[data-rct-tree=\"".concat(treeId, "\"] [data-rct-item-focus=\"true\"]"));
+        (_b = focusItem === null || focusItem === void 0 ? void 0 : focusItem.focus) === null || _b === void 0 ? void 0 : _b.call(focusItem);
     }, []);
@@ -103,8 +103,7 @@ var setActiveTree = useCallback(function (treeIdOrSetStateFunction, autoFocusTree) {
         var maybeFocusTree = function (treeId) {
-            var _a;
+            var _a, _b;
             if (autoFocusTree &&
                 (autoFocus !== null && autoFocus !== void 0 ? autoFocus : true) &&
                 treeId &&
-                !((_a = document
-                    .querySelector("[data-rct-tree=\"".concat(treeId, "\"]"))) === null || _a === void 0 ? void 0 : _a.contains(document.activeElement))) {
+                !((_b = (_a = getDocument()) === null || _a === void 0 ? void 0 : _a.querySelector("[data-rct-tree=\"".concat(treeId, "\"]"))) === null || _b === void 0 ? void 0 : _b.contains(document.activeElement))) {
                 focusTree(treeId);
@@ -111,0 +110,0 @@ }

lib/esnext/hotkeys/useHotkey.js

@@ -5,2 +5,3 @@ import { useMemo, useRef } from 'react';
 import { useCallSoon } from '../useCallSoon';
+import { getDocument } from '../utils';
 var elementsThatCanTakeText = ['input', 'textarea'];
@@ -17,3 +18,3 @@ export var useHotkey = function (combinationName, onHit, active, activatableWhileFocusingInput) {
     }, [combinationName, keyboardBindings]);
-    useHtmlElementEventListener(document, 'keydown', function (e) {
+    useHtmlElementEventListener(getDocument(), 'keydown', function (e) {
         var _a;
@@ -49,3 +50,3 @@ if (active === false) {
     });
-    useHtmlElementEventListener(document, 'keyup', function (e) {
+    useHtmlElementEventListener(getDocument(), 'keyup', function (e) {
         if (active === false) {
@@ -52,0 +53,0 @@ return;

lib/esnext/hotkeys/useKey.js

 import { useHtmlElementEventListener } from '../useHtmlElementEventListener';
+import { getDocument } from '../utils';
 export var useKey = function (key, onHit, active) {
-    useHtmlElementEventListener(typeof document !== 'undefined' ? document : undefined, 'keydown', function (e) {
+    useHtmlElementEventListener(getDocument(), 'keydown', function (e) {
         if (!active) {
@@ -5,0 +6,0 @@ return;

lib/esnext/search/SearchInput.js

@@ -19,2 +19,3 @@ var __assign = (this && this.__assign) || function () {
 import { useCallSoon } from '../useCallSoon';
+import { getDocument } from '../utils';
 export var SearchInput = function (_a) {
@@ -30,3 +31,3 @@ var _b;
     var clearSearch = function () {
-        var _a, _b;
+        var _a, _b, _c;
         setSearch(null);
@@ -36,4 +37,4 @@ if ((_a = environment.autoFocus) !== null && _a !== void 0 ? _a : true) {
             // TODO move logic as reusable method into tree or tree environment
-            var focusItem = document.querySelector("[data-rct-tree=\"".concat(treeId, "\"] [data-rct-item-focus=\"true\"]"));
-            (_b = focusItem === null || focusItem === void 0 ? void 0 : focusItem.focus) === null || _b === void 0 ? void 0 : _b.call(focusItem);
+            var focusItem = (_b = getDocument()) === null || _b === void 0 ? void 0 : _b.querySelector("[data-rct-tree=\"".concat(treeId, "\"] [data-rct-item-focus=\"true\"]"));
+            (_c = focusItem === null || focusItem === void 0 ? void 0 : focusItem.focus) === null || _c === void 0 ? void 0 : _c.call(focusItem);
         }
@@ -40,0 +41,0 @@ };

lib/esnext/tree/scrollIntoView.js

@@ -0,2 +1,4 @@
+import { getDocument } from '../utils';
 export var scrollIntoView = function (element) {
+    var _a, _b, _c, _d;
     if (!element) {
@@ -13,5 +15,6 @@ return;
             boundingBox.bottom <=
-                (window.innerHeight || document.documentElement.clientHeight) &&
+                (window.innerHeight ||
+                    !!((_b = (_a = getDocument()) === null || _a === void 0 ? void 0 : _a.documentElement) === null || _b === void 0 ? void 0 : _b.clientHeight)) &&
             boundingBox.right <=
-                (window.innerWidth || document.documentElement.clientWidth);
+                (window.innerWidth || !!((_d = (_c = getDocument()) === null || _c === void 0 ? void 0 : _c.documentElement) === null || _d === void 0 ? void 0 : _d.clientWidth));
         if (!isElementInViewport) {
@@ -18,0 +21,0 @@ element.scrollIntoView();

lib/esnext/utils.d.ts

 export declare const buildMapForTrees: <T>(treeIds: string[], build: (treeId: string) => T) => {
     [treeId: string]: T;
 };
+export declare const getDocument: () => Document | undefined;

lib/esnext/utils.js

@@ -21,1 +21,4 @@ var __assign = (this && this.__assign) || function () {
 };
+export var getDocument = function () {
+    return typeof document !== 'undefined' ? document : undefined;
+};

package.json

 {
   "name": "react-complex-tree",
-  "version": "2.1.3",
+  "version": "2.1.4-alpha.0",
   "main": "lib/cjs/index.js",
@@ -37,3 +37,3 @@ "module": "lib/esm/index.js",
     "cpy-cli": "^3.1.1",
-    "demodata": "^2.1.3",
+    "demodata": "^2.1.4-alpha.0",
     "jest": "^29.2.2",
@@ -70,3 +70,3 @@ "jest-dom": "^4.0.0",
   },
-  "gitHead": "11ed86cb64d983205090101638bcabc6f6b3138f"
+  "gitHead": "4a805594c05dad87495958e20445c66a893fac20"
 }

src/controlledEnvironment/layoutUtils.ts

@@ -0,3 +1,5 @@
+import { getDocument } from '../utils';
+
 export const computeItemHeight = (treeId: string) => {
-  const firstItem = document.querySelector<HTMLElement>(
+  const firstItem = getDocument()?.querySelector<HTMLElement>(
     `[data-rct-tree="${treeId}"] [data-rct-item-container="true"]`
@@ -4,0 +6,0 @@ );

src/controlledEnvironment/useControlledTreeEnvironmentProps.ts

@@ -11,3 +11,3 @@ import { useCallback, useEffect, useMemo, useState } from 'react';
 import { useRenderers } from '../renderers/useRenderers';
-import { buildMapForTrees } from '../utils';
+import { buildMapForTrees, getDocument } from '../utils';
 import { getItemsLinearly } from '../tree/getItemsLinearly';
@@ -57,3 +57,3 @@ import { useRefCopy } from '../useRefCopy';
     (item, treeId) => {
-      const newItem = document.querySelector(
+      const newItem = getDocument()?.querySelector(
         `[data-rct-tree="${treeId}"] [data-rct-item-id="${item.index}"]`
@@ -64,3 +64,3 @@ );
         if (
-          document.activeElement?.attributes.getNamedItem(
+          getDocument()?.activeElement?.attributes.getNamedItem(
             'data-rct-search-input'
@@ -129,3 +129,3 @@ )?.value !== 'true'
   const focusTree = useCallback((treeId: string) => {
-    const focusItem = document.querySelector(
+    const focusItem = getDocument()?.querySelector(
       `[data-rct-tree="${treeId}"] [data-rct-item-focus="true"]`
@@ -143,4 +143,4 @@ );
           treeId &&
-          !document
-            .querySelector(`[data-rct-tree="${treeId}"]`)
+          !getDocument()
+            ?.querySelector(`[data-rct-tree="${treeId}"]`)
             ?.contains(document.activeElement)
@@ -147,0 +147,0 @@ ) {

src/hotkeys/useHotkey.ts

@@ -6,2 +6,3 @@ import { useMemo, useRef } from 'react';
 import { useCallSoon } from '../useCallSoon';
+import { getDocument } from '../utils';
 
@@ -28,3 +29,3 @@ const elementsThatCanTakeText = ['input', 'textarea'];
 
-  useHtmlElementEventListener(document, 'keydown', e => {
+  useHtmlElementEventListener(getDocument(), 'keydown', e => {
     if (active === false) {
@@ -68,3 +69,3 @@ return;
 
-  useHtmlElementEventListener(document, 'keyup', e => {
+  useHtmlElementEventListener(getDocument(), 'keyup', e => {
     if (active === false) {
@@ -71,0 +72,0 @@ return;

src/hotkeys/useKey.ts

 import { useHtmlElementEventListener } from '../useHtmlElementEventListener';
+import { getDocument } from '../utils';
 
@@ -8,15 +9,11 @@ export const useKey = (
 ) => {
-  useHtmlElementEventListener(
-    typeof document !== 'undefined' ? document : undefined,
-    'keydown',
-    e => {
-      if (!active) {
-        return;
-      }
+  useHtmlElementEventListener(getDocument(), 'keydown', e => {
+    if (!active) {
+      return;
+    }
 
-      if (active && key.toLowerCase() === e.key.toLowerCase()) {
-        onHit(e);
-      }
+    if (active && key.toLowerCase() === e.key.toLowerCase()) {
+      onHit(e);
     }
-  );
+  });
 };

src/tree/scrollIntoView.ts

@@ -0,1 +1,3 @@
+import { getDocument } from '../utils';
+
 export const scrollIntoView = (element: Element | undefined | null) => {
@@ -14,5 +16,6 @@ if (!element) {
       boundingBox.bottom <=
-        (window.innerHeight || document.documentElement.clientHeight) &&
+        (window.innerHeight ||
+          !!getDocument()?.documentElement?.clientHeight) &&
       boundingBox.right <=
-        (window.innerWidth || document.documentElement.clientWidth);
+        (window.innerWidth || !!getDocument()?.documentElement?.clientWidth);
     if (!isElementInViewport) {
@@ -19,0 +22,0 @@ element.scrollIntoView();

src/utils.ts

@@ -8,1 +8,4 @@ export const buildMapForTrees = <T>(
     .reduce((a, [id, obj]) => ({ ...a, [id]: obj }), {});
+
+export const getDocument = () =>
+  typeof document !== 'undefined' ? document : undefined;

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

No v1

Quality

Package is not semver >=1. This means it is not stable and does not support ^ ranges.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

1221170

increased by0.46%

Lines of code

18678

increased by0.2%

Worsened metrics

Number of low quality alerts

2

increased by100%

No dependency changes