rsuite 5.2.2 → 5.4.0

package/esm/utils/treeUtils.js

@@ -12,6 +12,7 @@ import { getNodeCheckState } from '../CheckTreePicker/utils';
 import { TREE_NODE_DROP_POSITION, shallowEqual } from '../utils';
 import { shouldDisplay } from '../Picker';
 import reactToString from './reactToString';
+import { TREE_NODE_PADDING, TREE_NODE_ROOT_PADDING } from './constants';
 // gap of tree node
 var TREE_NODE_GAP = 4;
 /**
@@ -568,19 +569,20 @@ export var getScrollToIndex = function getScrollToIndex(nodes, value, valueKey)
 export function getExpandWhenSearching(searchKeyword, expand) {
   return isSearching(searchKeyword) ? true : expand;
 }
-export function getTreeActiveNode(nodes, value, valueKey) {
-  var activeNode = null;
 
-  if (!_isUndefined(value)) {
-    Object.keys(nodes).forEach(function (refKey) {
-      if (shallowEqual(nodes[refKey][valueKey], value)) {
-        activeNode = nodes[refKey];
-      }
-    });
+function getTreeActiveNode(nodes, value, valueKey) {
+  if (_isUndefined(value)) {
+    return undefined;
   }
 
-  return activeNode;
+  for (var refKey in nodes) {
+    if (shallowEqual(nodes[refKey][valueKey], value)) {
+      return nodes[refKey];
+    }
+  }
 }
+
+export { getTreeActiveNode };
 /**
  * toggle tree node
  * @param param0
@@ -617,7 +619,7 @@ export function getTreeNodeTitle(label) {
  */
 
 export function getChildrenByFlattenNodes(nodes, parent) {
-  if (_isNil(nodes[parent.refKey])) {
+  if (!_isNil(parent.refKey) && _isNil(nodes[parent.refKey])) {
     return [];
   }
 
@@ -700,7 +702,7 @@ export function useFlattenTreeData(_ref8) {
       node.refKey = refKey;
       flattenNodes[refKey] = _extends((_extends2 = {
         layer: layer
-      }, _extends2[labelKey] = node[labelKey], _extends2[valueKey] = node[valueKey], _extends2.refKey = refKey, _extends2.uncheckable = uncheckableItemValues.some(function (value) {
+      }, _extends2[labelKey] = node[labelKey], _extends2[valueKey] = node[valueKey], _extends2.uncheckable = uncheckableItemValues.some(function (value) {
         return shallowEqual(node[valueKey], value);
       }), _extends2), node);
 
@@ -717,10 +719,8 @@ export function useFlattenTreeData(_ref8) {
     Object.keys(nodes).forEach(function (refKey) {
       var currentNode = nodes[refKey];
 
-      if (currentNode.parent) {
-        var _currentNode$parent;
-
-        var parentNode = nodes[(_currentNode$parent = currentNode.parent) === null || _currentNode$parent === void 0 ? void 0 : _currentNode$parent.refKey];
+      if (!_isNil(currentNode.parent) && !_isNil(currentNode.parent.refKey)) {
+        var parentNode = nodes[currentNode.parent.refKey];
 
         if (currentNode[key]) {
           if (!(parentNode !== null && parentNode !== void 0 && parentNode.checkAll)) {
@@ -752,7 +752,7 @@ export function useFlattenTreeData(_ref8) {
     Object.keys(nodes).forEach(function (refKey) {
       var node = nodes[refKey];
 
-      if (cascade && node.parent) {
+      if (cascade && !_isNil(node.parent) && !_isNil(node.parent.refKey)) {
         node[key] = nodes[node.parent.refKey][key];
       } else {
         node[key] = false;
@@ -833,8 +833,8 @@ export function useFlattenTreeData(_ref8) {
 export function useTreeNodeRefs() {
   var treeNodeRefs = useRef({});
 
-  var saveTreeNodeRef = function saveTreeNodeRef(refKey, ref) {
-    if (refKey) {
+  var saveTreeNodeRef = function saveTreeNodeRef(ref, refKey) {
+    if (!_isNil(refKey)) {
       treeNodeRefs.current[refKey] = ref;
     }
   };
@@ -876,11 +876,15 @@ export function useTreeSearch(props) {
     return data;
   }, [childrenKey, labelKey, searchBy]); // Use search keywords to filter options.
 
-  var _useState5 = useState(searchKeyword !== null && searchKeyword !== void 0 ? searchKeyword : ''),
+  var _useState5 = useState(function () {
+    return searchKeyword !== null && searchKeyword !== void 0 ? searchKeyword : '';
+  }),
       searchKeywordState = _useState5[0],
       setSearchKeyword = _useState5[1];
 
-  var _useState6 = useState(filterVisibleData(data, searchKeywordState)),
+  var _useState6 = useState(function () {
+    return filterVisibleData(data, searchKeywordState);
+  }),
       filteredData = _useState6[0],
       setFilteredData = _useState6[1];
 
@@ -972,8 +976,10 @@ export function focusToActiveTreeNode(_ref10) {
   if (!container) return;
 
   if (virtualized && activeNode) {
+    var _list$scrollToRow;
+
     var scrollIndex = getScrollToIndex(formattedNodes, activeNode === null || activeNode === void 0 ? void 0 : activeNode[valueKey], valueKey);
-    list.scrollToRow(scrollIndex);
+    (_list$scrollToRow = list.scrollToRow) === null || _list$scrollToRow === void 0 ? void 0 : _list$scrollToRow.call(list, scrollIndex);
     return;
   }
 
@@ -987,4 +993,22 @@ export function focusToActiveTreeNode(_ref10) {
 }
 export function isSearching(searchKeyword) {
   return !_isEmpty(searchKeyword);
+}
+export function getTreeNodeIndent(rtl, layer, absolute) {
+  var _ref12;
+
+  if (absolute === void 0) {
+    absolute = false;
+  }
+
+  // layer start from 1
+  var offset = layer * TREE_NODE_PADDING + TREE_NODE_ROOT_PADDING;
+
+  if (absolute) {
+    var _ref11;
+
+    return _ref11 = {}, _ref11[rtl ? 'right' : 'left'] = offset, _ref11;
+  }
+
+  return _ref12 = {}, _ref12[rtl ? 'paddingRight' : 'paddingLeft'] = offset, _ref12;
 }

package/esm/utils/useControlled.d.ts

@@ -1,4 +1,5 @@
 /// <reference types="react" />
+declare type InferDefined<T> = T extends infer U | undefined ? U : never;
 /**
  * A hook for controlled value management.
  * In the case of passing the controlled value, the controlled value is returned, otherwise the value in state is returned.
@@ -7,5 +8,9 @@
  * @param defaultValue
  * @param formatValue
  */
-declare function useControlled<T = any>(controlledValue: T, defaultValue: T): [T, (value: React.SetStateAction<T>) => void, boolean];
+declare function useControlled<V = any, D = V>(controlledValue: V, defaultValue: D): [
+    V extends undefined ? D : InferDefined<V>,
+    (value: React.SetStateAction<V | null>) => void,
+    boolean
+];
 export default useControlled;

package/esm/utils/useControlled.js

@@ -1,12 +1,4 @@
 import { useRef, useState, useCallback } from 'react';
-/**
- * A hook for controlled value management.
- * In the case of passing the controlled value, the controlled value is returned, otherwise the value in state is returned.
- * Generally used for a component including controlled and uncontrolled modes.
- * @param controlledValue
- * @param defaultValue
- * @param formatValue
- */
 
 function useControlled(controlledValue, defaultValue) {
   var controlledRef = useRef(false);

package/esm/utils/useCustom.js

@@ -21,6 +21,8 @@ var getDefaultRTL = function getDefaultRTL() {
 
 
 function useCustom(keys, overrideLocale) {
+  var _locale$Calendar2, _locale$Calendar4;
+
   var _useContext = useContext(CustomContext),
       _useContext$locale = _useContext.locale,
       locale = _useContext$locale === void 0 ? defaultLocale : _useContext$locale,
@@ -44,14 +46,14 @@ function useCustom(keys, overrideLocale) {
     return format(date, formatStr, {
       locale: locale === null || locale === void 0 ? void 0 : (_locale$Calendar = locale.Calendar) === null || _locale$Calendar === void 0 ? void 0 : _locale$Calendar.dateLocale
     });
-  }, [locale.Calendar.dateLocale]);
+  }, [(_locale$Calendar2 = locale.Calendar) === null || _locale$Calendar2 === void 0 ? void 0 : _locale$Calendar2.dateLocale]);
   var defaultParseDate = useCallback(function (dateString, formatString) {
-    var _locale$Calendar2;
+    var _locale$Calendar3;
 
     return parse(dateString, formatString, new Date(), {
-      locale: locale === null || locale === void 0 ? void 0 : (_locale$Calendar2 = locale.Calendar) === null || _locale$Calendar2 === void 0 ? void 0 : _locale$Calendar2.dateLocale
+      locale: locale === null || locale === void 0 ? void 0 : (_locale$Calendar3 = locale.Calendar) === null || _locale$Calendar3 === void 0 ? void 0 : _locale$Calendar3.dateLocale
     });
-  }, [locale.Calendar.dateLocale]);
+  }, [(_locale$Calendar4 = locale.Calendar) === null || _locale$Calendar4 === void 0 ? void 0 : _locale$Calendar4.dateLocale]);
   return {
     locale: componentLocale,
     rtl: rtl,

package/esm/utils/useElementResize.js

@@ -11,9 +11,12 @@ import { ResizeObserver } from '@juggle/resize-observer';
 export default function useElementResize(eventTarget, listener) {
   var resizeObserver = useRef();
   useEffect(function () {
-    var target = typeof eventTarget === 'function' ? eventTarget() : eventTarget;
-    resizeObserver.current = new ResizeObserver(listener);
-    resizeObserver.current.observe(target);
+    if (!resizeObserver.current) {
+      var target = typeof eventTarget === 'function' ? eventTarget() : eventTarget;
+      resizeObserver.current = new ResizeObserver(listener);
+      resizeObserver.current.observe(target);
+    }
+
     return function () {
       var _resizeObserver$curre;
 

package/esm/utils/useFocus.d.ts

@@ -1,5 +1,5 @@
 import React from 'react';
-export default function useFocus<E extends HTMLElement>(elementRef: React.MutableRefObject<E>): {
+export default function useFocus<E extends HTMLElement>(elementRef: React.RefObject<E>): {
     grab: () => void;
-    release: (options?: FocusOptions) => void;
+    release: (options?: FocusOptions | undefined) => void;
 };

package/esm/utils/usePortal.d.ts

@@ -1,10 +1,10 @@
 import React from 'react';
 interface PortalProps {
     id?: string;
-    container?: HTMLElement | (() => HTMLElement);
+    container?: HTMLElement | (() => HTMLElement | null) | null;
 }
 declare function usePortal(props?: PortalProps): {
-    target: Element | HTMLElement;
+    target: HTMLElement | null;
     Portal: React.FC<any>;
 };
 export default usePortal;

package/esm/utils/useRootClose.d.ts

@@ -1,4 +1,4 @@
-/// <reference types="react" />
+import React from 'react';
 declare type TargetType = React.RefObject<Element> | Element | null | undefined;
 interface Options {
     disabled: boolean;
@@ -16,5 +16,5 @@ interface Options {
  * @param param1
  * @todo Allow different behaviors based on whether clicked element is focusable
  */
-declare function useRootClose(onRootClose: (e: Event) => void, { disabled, triggerTarget, overlayTarget, listenEscape }: Options): void;
+declare function useRootClose(onRootClose: React.ReactEventHandler | undefined, { disabled, triggerTarget, overlayTarget, listenEscape }: Options): void;
 export default useRootClose;

package/esm/utils/useTimeout.d.ts

@@ -8,5 +8,5 @@ export interface UseTimeoutFnReturn {
  * @param ms Milliseconds of the timer
  * @param open Whether to open the timer
  */
-declare function useTimeout(fn: () => void, ms?: number, open?: boolean): UseTimeoutFnReturn;
+declare function useTimeout(fn: (() => void) | undefined, ms?: number, open?: boolean): UseTimeoutFnReturn;
 export default useTimeout;

package/esm/utils/useTimeout.js

@@ -20,9 +20,11 @@ function useTimeout(fn, ms, open) {
     timeout.current && clearTimeout(timeout.current);
   }, []);
   var set = useCallback(function () {
-    timeout.current = open && setTimeout(function () {
-      return fn === null || fn === void 0 ? void 0 : fn();
-    }, ms);
+    if (open) {
+      timeout.current = setTimeout(function () {
+        return fn === null || fn === void 0 ? void 0 : fn();
+      }, ms);
+    }
   }, [ms, fn, open]);
   useEffect(function () {
     set();

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "rsuite",
-  "version": "5.2.2",
+  "version": "5.4.0",
   "description": "A suite of react components",
   "main": "cjs/index.js",
   "module": "esm/index.js",
@@ -29,7 +29,7 @@
     "@rsuite/icons": "^1.0.2",
     "@types/chai": "^4.2.18",
     "@types/lodash": "^4.14.134",
-    "@types/prop-types": "^15.7.1",
+    "@types/prop-types": "^15.7.4",
     "@types/react-virtualized": "^9.21.11",
     "classnames": "^2.3.1",
     "date-fns": "^2.13.0",
@@ -37,7 +37,7 @@
     "lodash": "^4.17.11",
     "prop-types": "^15.7.2",
     "react-virtualized": "^9.22.3",
-    "rsuite-table": "^5.2.0",
+    "rsuite-table": "^5.2.2",
     "schema-typed": "^2.0.2"
   },
   "peerDependencies": {

package/styles/index.less

@@ -4,6 +4,7 @@
 @import '../Animation/styles/index';
 @import '../AutoComplete/styles/index';
 @import '../Avatar/styles/index';
+@import '../AvatarGroup/styles/index';
 @import '../Badge/styles/index';
 @import '../Breadcrumb/styles/index';
 @import '../Button/styles/index';
@@ -74,3 +75,4 @@
 @import '../Rate/styles/index';
 @import '../toaster/styles/index';
 @import '../CloseButton/styles/index';
+@import '../Stack/styles/index';