@steroidsjs/core 2.2.10 → 2.2.11

package/hooks/useDataSelect.d.ts

@@ -55,5 +55,6 @@ export interface IDataSelectResult {
     setSelectedIds: (ids: PrimaryKey | PrimaryKey[], skipToggle?: boolean) => void;
     selectedItems: IDataSelectItem[];
 }
+export declare const getLinearItems: (items: any, groupAttribute: any) => any[];
 export default function useDataSelect(config: IDataSelectConfig): IDataSelectResult;
 export {};

package/hooks/useDataSelect.js

@@ -8,6 +8,7 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 exports.__esModule = true;
+exports.getLinearItems = void 0;
 var isEqual_1 = __importDefault(require("lodash-es/isEqual"));
 var isArray_1 = __importDefault(require("lodash-es/isArray"));
 var isNil_1 = __importDefault(require("lodash-es/isNil"));
@@ -16,9 +17,23 @@ var react_use_1 = require("react-use");
 var defaultProps = {
     primaryKey: 'id'
 };
+var getLinearItems = function (items, groupAttribute) {
+    var result = [];
+    items.forEach(function (item) {
+        if (groupAttribute && Array.isArray(item[groupAttribute])) {
+            result = result.concat(exports.getLinearItems(item[groupAttribute], groupAttribute));
+        }
+        else {
+            result.push(item);
+        }
+    });
+    return result;
+};
+exports.getLinearItems = getLinearItems;
 function useDataSelect(config) {
     // Get primary key
     var primaryKey = config.primaryKey || defaultProps.primaryKey;
+    var linearItems = react_1.useMemo(function () { return exports.getLinearItems(config.items, config.groupAttribute); }, [config.groupAttribute, config.items]);
     // Initial select
     var initialSelectedIds = react_1.useMemo(function () {
         var _a;
@@ -28,16 +43,16 @@ function useDataSelect(config) {
         if (!isNil_1["default"](config.inputValue)) {
             return [].concat(isArray_1["default"](config.inputValue) ? config.inputValue : [config.inputValue]);
         }
-        return config.selectFirst && config.items.length > 0
-            ? [config.items[0][primaryKey]]
+        return config.selectFirst && linearItems.length > 0
+            ? [linearItems[0][primaryKey]]
             : [];
-    }, [config.items, config.selectFirst, config.selectedIds, primaryKey, config.inputValue]);
-    var initialSelectedItems = react_1.useMemo(function () { return config.items.length > 0
+    }, [config.selectedIds, config.inputValue, config.selectFirst, linearItems, primaryKey]);
+    var initialSelectedItems = react_1.useMemo(function () { return linearItems.length > 0
         && initialSelectedIds.length > 0
         ? initialSelectedIds
-            .map(function (selectedId) { return config.items.find(function (item) { return item.id === selectedId; }); })
+            .map(function (selectedId) { return linearItems.find(function (item) { return item.id === selectedId; }); })
             .filter(Boolean)
-        : []; }, [initialSelectedIds, config.items]);
+        : []; }, [initialSelectedIds, linearItems]);
     // State
     var _a = react_1.useState(false), isOpened = _a[0], setIsOpened = _a[1];
     var _b = react_1.useState(false), isFocused = _b[0], setIsFocused = _b[1];
@@ -82,7 +97,7 @@ function useDataSelect(config) {
         var newSelectedItems = [];
         var hasChanges = false;
         selectedIds.forEach(function (selectedId) {
-            var finedItem = config.items.find(function (item) { return item[primaryKey] === selectedId; });
+            var finedItem = linearItems.find(function (item) { return item[primaryKey] === selectedId; });
             if (!finedItem && config.sourceItems) {
                 finedItem = config.sourceItems.find(function (item) { return item[primaryKey] === selectedId; });
             }
@@ -98,14 +113,14 @@ function useDataSelect(config) {
         if (hasChanges || prevSelectedIdsLength !== selectedIds.length) {
             setSelectedItemsInternal(newSelectedItems);
         }
-    }, [config.items, config.sourceItems, primaryKey, selectedIds, selectedItems, prevSelectedIdsLength]);
+    }, [linearItems, config.sourceItems, primaryKey, selectedIds, selectedItems, prevSelectedIdsLength]);
     // Select first after fetch data
-    var prevItemsLength = react_use_1.usePrevious(config.items.length);
+    var prevItemsLength = react_use_1.usePrevious(linearItems.length);
     react_use_1.useUpdateEffect(function () {
-        if (config.selectFirst && prevItemsLength === 0 && config.items.length > 0) {
-            setSelectedIdsInternal([config.items[0][primaryKey]]);
+        if (config.selectFirst && prevItemsLength === 0 && linearItems.length > 0) {
+            setSelectedIdsInternal([linearItems[0][primaryKey]]);
         }
-    }, [config.items, config.selectFirst, prevItemsLength, primaryKey]);
+    }, [linearItems, config.selectFirst, prevItemsLength, primaryKey]);
     // Update selected items on change value
     var prevConfigSelectedIds = react_use_1.usePrevious(config.selectedIds || []);
     react_use_1.useUpdateEffect(function () {
@@ -121,7 +136,7 @@ function useDataSelect(config) {
             && !isEqual_1["default"](selectedIds, newSelectedIds) && newSelectedIds.length !== 0) {
             setSelectedIdsInternal(newSelectedIds);
         }
-    }, [config.items, config.selectedIds, primaryKey, prevConfigSelectedIds,
+    }, [linearItems, config.selectedIds, primaryKey, prevConfigSelectedIds,
         selectedItems, config.sourceItems, selectedIds]);
     // Global key down handler for navigate on items
     // Support keys:
@@ -151,9 +166,9 @@ function useDataSelect(config) {
                 // Select first selected
                 setSelectedIds(selectedIds[0], true);
             }
-            else if (config.items.length > 0) {
+            else if (linearItems.length > 0) {
                 // Select first result
-                setSelectedIds(config.items[0], true);
+                setSelectedIds(linearItems[0], true);
             }
             setIsOpened(false);
         }
@@ -178,21 +193,7 @@ function useDataSelect(config) {
             else {
                 // Navigate on items by keys
                 var direction = isDown ? 1 : -1;
-                var getKeysRecursive_1 = function (items) {
-                    var ids = [];
-                    items.forEach(function (item) {
-                        if (config.groupAttribute && Array.isArray(item[config.groupAttribute])) {
-                            ids = ids.concat(getKeysRecursive_1(item[config.groupAttribute]));
-                        }
-                        else {
-                            ids.push(item.id);
-                        }
-                        return ids;
-                    });
-                    return ids;
-                };
-                //const keys = config.items.map(item => item.id);
-                var keys = getKeysRecursive_1(config.items);
+                var keys = linearItems.map(function (item) { return item.id; });
                 // Get current index
                 var index = hoveredId ? keys.indexOf(hoveredId) : -1;
                 if (index === -1 && selectedIds.length === 1) {
@@ -206,7 +207,7 @@ function useDataSelect(config) {
                 setHoveredId(keys[newIndex]);
             }
         }
-    }, [isFocused, isOpened, hoveredId, selectedIds, config.items, config.groupAttribute, setSelectedIds]);
+    }, [isFocused, isOpened, hoveredId, selectedIds, linearItems, setSelectedIds]);
     react_use_1.useEvent('keydown', onKeyDown);
     return {
         isOpened: isOpened,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@steroidsjs/core",
-  "version": "2.2.10",
+  "version": "2.2.11",
   "description": "",
   "author": "Vladimir Kozhin <hello@kozhindev.com>",
   "repository": {