@rtbjs/use-state
Version:
`@rtbjs/use-state` is a state management tool that can act as a local state and be easily turned into a global redux state. It is an innovative approach to state management that combines the advantages of both React's useState and Redux's state management
56 lines • 2.75 kB
JavaScript
import { __assign } from "tslib";
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
import { useState } from 'react';
import { getParentKey } from './get-parent-item';
import { getTreeData } from './get-tree-data';
var useReduxHistorySearch = function (root) {
var rawTreeData = getTreeData(root);
var dataList = [];
var generateList = function (data) {
for (var i = 0; i < data.length; i++) {
var node = data[i];
var key = node.key, title = node.title;
dataList.push({ key: key, title: (title === null || title === void 0 ? void 0 : title.toString()) || '' });
if (node.children) {
generateList(node.children);
}
}
};
generateList(rawTreeData);
var _a = useState([]), expandedKeys = _a[0], setExpandedKeys = _a[1];
var _b = useState(''), searchValue = _b[0], setSearchValue = _b[1];
var _c = useState(true), autoExpandParent = _c[0], setAutoExpandParent = _c[1];
var onExpand = function (newExpandedKeys) {
setExpandedKeys(newExpandedKeys);
setAutoExpandParent(false);
};
var onChange = function (e) {
var value = e.target.value;
var newExpandedKeys = dataList
.map(function (item) {
if (item.title.toLocaleLowerCase().indexOf(value.toLowerCase()) > -1) {
return getParentKey(item.key, root);
}
return null;
})
.filter(function (item, i, self) { return item && self.indexOf(item) === i; });
setExpandedKeys(value ? newExpandedKeys : [rawTreeData[0].key]);
setSearchValue(value);
setAutoExpandParent(true);
};
var loop = function (data) {
return data.map(function (item) {
var strTitle = item.title;
var index = strTitle.toLowerCase().indexOf(searchValue.toLowerCase());
var beforeStr = strTitle.substring(0, index);
var foundStr = strTitle.substring(index, index + searchValue.length);
var afterStr = strTitle.slice(index + searchValue.length);
var title = index > -1 ? (_jsxs("span", { children: [beforeStr, _jsx("span", __assign({ style: { color: '#f50' } }, { children: foundStr })), afterStr] })) : (_jsx("span", { children: strTitle }));
return __assign({ title: title, key: item.key, isLeaf: item.isLeaf }, (item.children ? { children: loop(item.children) } : {}));
});
};
var treeData = loop(rawTreeData);
return { onExpand: onExpand, expandedKeys: expandedKeys, autoExpandParent: autoExpandParent, treeData: treeData, onChange: onChange };
};
export { useReduxHistorySearch };
//# sourceMappingURL=use-redux-history-search.js.map