@rc-component/util 1.9.0 → 1.10.1

package/README.md

@@ -13,8 +13,8 @@ Common Utils For React Component.
 [npm-url]: http://npmjs.org/package/rc-util
 [travis-image]: https://img.shields.io/travis/react-component/util/master?style=flat-square
 [travis-url]: https://travis-ci.com/react-component/util
-[github-actions-image]: https://github.com/react-component/util/workflows/CI/badge.svg
-[github-actions-url]: https://github.com/react-component/util/actions
+[github-actions-image]: https://github.com/react-component/util/actions/workflows/react-component-ci.yml/badge.svg
+[github-actions-url]: https://github.com/react-component/util/actions/workflows/react-component-ci.yml
 [codecov-image]: https://img.shields.io/codecov/c/github/react-component/util/master.svg?style=flat-square
 [codecov-url]: https://app.codecov.io/gh/react-component/util
 [david-url]: https://david-dm.org/react-component/util

package/es/Dom/focus.js

@@ -1,4 +1,4 @@
-import { useEffect } from 'react';
+import { useEffect, useRef, useState } from 'react';
 import isVisible from "./isVisible";
 import useId from "../hooks/useId";
 function focusable(node, includePositive = false) {
@@ -173,6 +173,30 @@ export function lockFocus(element, id) {
   };
 }
 
+/**
+ * Retry an effect until it reports ready.
+ * When `ready` is `false`, it will schedule one more effect cycle and call `func` again
+ * with the next `retryTimes`.
+ */
+
+function useRetryEffect(func, deps) {
+  /* eslint-disable react-hooks/exhaustive-deps */
+  const retryTimesRef = useRef(0);
+  const [retryMark, setRetryMark] = useState(0);
+  useEffect(() => {
+    retryTimesRef.current = 0;
+  }, deps);
+  useEffect(() => {
+    const [clearFn, ready] = func(retryTimesRef.current);
+    if (!ready) {
+      retryTimesRef.current += 1;
+      setRetryMark(count => count + 1);
+    }
+    return clearFn;
+  }, [...deps, retryMark]);
+  /* eslint-enable react-hooks/exhaustive-deps */
+}
+
 /**
  * Lock focus within an element.
  * When locked, focus will be restricted to focusable elements within the specified element.
@@ -181,14 +205,19 @@ export function lockFocus(element, id) {
  */
 export function useLockFocus(lock, getElement) {
   const id = useId();
-  useEffect(() => {
-    if (lock) {
-      const element = getElement();
-      if (element) {
-        return lockFocus(element, id);
-      }
+  const getElementRef = useRef(getElement);
+  getElementRef.current = getElement;
+  const lockEffect = retryTimes => {
+    if (!lock) {
+      return [undefined, true];
+    }
+    const element = getElementRef.current();
+    if (element) {
+      return [lockFocus(element, id), true];
     }
-  }, [lock, id]);
+    return [undefined, retryTimes >= 1];
+  };
+  useRetryEffect(lockEffect, [id, lock]);
   const ignoreElement = ele => {
     if (ele) {
       // Set the ignored element using stable ID

package/es/getScrollBarSize.js

@@ -49,8 +49,8 @@ ${heightStyle}
   document.body.appendChild(measureEle);
 
   // Measure. Get fallback style if provided
-  const scrollWidth = ele && fallbackWidth && !isNaN(fallbackWidth) ? fallbackWidth : measureEle.offsetWidth - measureEle.clientWidth;
-  const scrollHeight = ele && fallbackHeight && !isNaN(fallbackHeight) ? fallbackHeight : measureEle.offsetHeight - measureEle.clientHeight;
+  const scrollWidth = ele && fallbackWidth && !Number.isNaN(fallbackWidth) ? fallbackWidth : measureEle.offsetWidth - measureEle.clientWidth;
+  const scrollHeight = ele && fallbackHeight && !Number.isNaN(fallbackHeight) ? fallbackHeight : measureEle.offsetHeight - measureEle.clientHeight;
 
   // Clean up
   document.body.removeChild(measureEle);

package/es/hooks/useEvent.d.ts

@@ -1,2 +1,2 @@
-declare function useEvent<T extends ((...args: any[]) => any) | undefined>(callback: T): undefined extends T ? (...args: Parameters<NonNullable<T>>) => ReturnType<NonNullable<T>> | undefined : T;
+declare const useEvent: <T extends (...args: any[]) => any>(callback: T) => undefined extends T ? (...args: Parameters<NonNullable<T>>) => ReturnType<NonNullable<T>> | undefined : T;
 export default useEvent;

package/es/hooks/useEvent.js

@@ -1,10 +1,8 @@
-/* eslint-disable @typescript-eslint/ban-types */
-/* eslint-disable react-hooks/exhaustive-deps */
 import * as React from 'react';
-function useEvent(callback) {
+const useEvent = callback => {
   const fnRef = React.useRef(callback);
   fnRef.current = callback;
   const memoFn = React.useCallback((...args) => fnRef.current?.(...args), []);
   return memoFn;
-}
+};
 export default useEvent;

package/es/index.d.ts

@@ -7,3 +7,4 @@ export { default as set, merge, mergeWith } from './utils/set';
 export { default as warning, noteOnce } from './warning';
 export { default as omit } from './omit';
 export { default as toArray } from './Children/toArray';
+export { default as mergeProps } from './mergeProps';

package/es/index.js

@@ -6,4 +6,5 @@ export { default as get } from "./utils/get";
 export { default as set, merge, mergeWith } from "./utils/set";
 export { default as warning, noteOnce } from "./warning";
 export { default as omit } from "./omit";
-export { default as toArray } from "./Children/toArray";
+export { default as toArray } from "./Children/toArray";
+export { default as mergeProps } from "./mergeProps";

package/es/isMobile.d.ts

@@ -1,2 +1,2 @@
-declare const _default: () => boolean;
-export default _default;
+declare const getIsMobile: () => boolean;
+export default getIsMobile;

package/es/isMobile.js

@@ -1,8 +1,9 @@
 import isMobile from 'is-mobile';
 let cached;
-export default (() => {
+const getIsMobile = () => {
   if (typeof cached === 'undefined') {
     cached = isMobile();
   }
   return cached;
-});
+};
+export default getIsMobile;

package/es/mergeProps.d.ts

@@ -0,0 +1,8 @@
+/**
+ * Merges multiple props objects into one. Unlike `Object.assign()` or `{ ...a, ...b }`, it skips
+ * properties whose value is explicitly set to `undefined`.
+ */
+declare function mergeProps<A, B>(a: A, b: B): B & A;
+declare function mergeProps<A, B, C>(a: A, b: B, c: C): C & B & A;
+declare function mergeProps<A, B, C, D>(a: A, b: B, c: C, d: D): D & C & B & A;
+export default mergeProps;

package/es/mergeProps.js

@@ -0,0 +1,19 @@
+/**
+ * Merges multiple props objects into one. Unlike `Object.assign()` or `{ ...a, ...b }`, it skips
+ * properties whose value is explicitly set to `undefined`.
+ */
+
+function mergeProps(...items) {
+  const ret = {};
+  for (const item of items) {
+    if (item) {
+      for (const key of Object.keys(item)) {
+        if (item[key] !== undefined) {
+          ret[key] = item[key];
+        }
+      }
+    }
+  }
+  return ret;
+}
+export default mergeProps;

package/lib/Dom/focus.js

@@ -183,6 +183,30 @@ function lockFocus(element, id) {
   };
 }
 
+/**
+ * Retry an effect until it reports ready.
+ * When `ready` is `false`, it will schedule one more effect cycle and call `func` again
+ * with the next `retryTimes`.
+ */
+
+function useRetryEffect(func, deps) {
+  /* eslint-disable react-hooks/exhaustive-deps */
+  const retryTimesRef = (0, _react.useRef)(0);
+  const [retryMark, setRetryMark] = (0, _react.useState)(0);
+  (0, _react.useEffect)(() => {
+    retryTimesRef.current = 0;
+  }, deps);
+  (0, _react.useEffect)(() => {
+    const [clearFn, ready] = func(retryTimesRef.current);
+    if (!ready) {
+      retryTimesRef.current += 1;
+      setRetryMark(count => count + 1);
+    }
+    return clearFn;
+  }, [...deps, retryMark]);
+  /* eslint-enable react-hooks/exhaustive-deps */
+}
+
 /**
  * Lock focus within an element.
  * When locked, focus will be restricted to focusable elements within the specified element.
@@ -191,14 +215,19 @@ function lockFocus(element, id) {
  */
 function useLockFocus(lock, getElement) {
   const id = (0, _useId.default)();
-  (0, _react.useEffect)(() => {
-    if (lock) {
-      const element = getElement();
-      if (element) {
-        return lockFocus(element, id);
-      }
+  const getElementRef = (0, _react.useRef)(getElement);
+  getElementRef.current = getElement;
+  const lockEffect = retryTimes => {
+    if (!lock) {
+      return [undefined, true];
+    }
+    const element = getElementRef.current();
+    if (element) {
+      return [lockFocus(element, id), true];
     }
-  }, [lock, id]);
+    return [undefined, retryTimes >= 1];
+  };
+  useRetryEffect(lockEffect, [id, lock]);
   const ignoreElement = ele => {
     if (ele) {
       // Set the ignored element using stable ID

package/lib/getScrollBarSize.js

@@ -57,8 +57,8 @@ ${heightStyle}
   document.body.appendChild(measureEle);
 
   // Measure. Get fallback style if provided
-  const scrollWidth = ele && fallbackWidth && !isNaN(fallbackWidth) ? fallbackWidth : measureEle.offsetWidth - measureEle.clientWidth;
-  const scrollHeight = ele && fallbackHeight && !isNaN(fallbackHeight) ? fallbackHeight : measureEle.offsetHeight - measureEle.clientHeight;
+  const scrollWidth = ele && fallbackWidth && !Number.isNaN(fallbackWidth) ? fallbackWidth : measureEle.offsetWidth - measureEle.clientWidth;
+  const scrollHeight = ele && fallbackHeight && !Number.isNaN(fallbackHeight) ? fallbackHeight : measureEle.offsetHeight - measureEle.clientHeight;
 
   // Clean up
   document.body.removeChild(measureEle);

package/lib/hooks/useEvent.d.ts

@@ -1,2 +1,2 @@
-declare function useEvent<T extends ((...args: any[]) => any) | undefined>(callback: T): undefined extends T ? (...args: Parameters<NonNullable<T>>) => ReturnType<NonNullable<T>> | undefined : T;
+declare const useEvent: <T extends (...args: any[]) => any>(callback: T) => undefined extends T ? (...args: Parameters<NonNullable<T>>) => ReturnType<NonNullable<T>> | undefined : T;
 export default useEvent;

package/lib/hooks/useEvent.js

@@ -7,13 +7,10 @@ exports.default = void 0;
 var React = _interopRequireWildcard(require("react"));
 function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
 function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && Object.prototype.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
-/* eslint-disable @typescript-eslint/ban-types */
-/* eslint-disable react-hooks/exhaustive-deps */
-
-function useEvent(callback) {
+const useEvent = callback => {
   const fnRef = React.useRef(callback);
   fnRef.current = callback;
   const memoFn = React.useCallback((...args) => fnRef.current?.(...args), []);
   return memoFn;
-}
+};
 var _default = exports.default = useEvent;

package/lib/index.d.ts

@@ -7,3 +7,4 @@ export { default as set, merge, mergeWith } from './utils/set';
 export { default as warning, noteOnce } from './warning';
 export { default as omit } from './omit';
 export { default as toArray } from './Children/toArray';
+export { default as mergeProps } from './mergeProps';

package/lib/index.js

@@ -15,6 +15,12 @@ Object.defineProperty(exports, "merge", {
     return _set.merge;
   }
 });
+Object.defineProperty(exports, "mergeProps", {
+  enumerable: true,
+  get: function () {
+    return _mergeProps.default;
+  }
+});
 Object.defineProperty(exports, "mergeWith", {
   enumerable: true,
   get: function () {
@@ -96,6 +102,7 @@ var _set = _interopRequireWildcard(require("./utils/set"));
 var _warning = _interopRequireWildcard(require("./warning"));
 var _omit = _interopRequireDefault(require("./omit"));
 var _toArray = _interopRequireDefault(require("./Children/toArray"));
+var _mergeProps = _interopRequireDefault(require("./mergeProps"));
 function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
 function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && Object.prototype.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }

package/lib/isMobile.d.ts

@@ -1,2 +1,2 @@
-declare const _default: () => boolean;
-export default _default;
+declare const getIsMobile: () => boolean;
+export default getIsMobile;

package/lib/isMobile.js

@@ -7,10 +7,10 @@ exports.default = void 0;
 var _isMobile = _interopRequireDefault(require("is-mobile"));
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 let cached;
-var _default = () => {
+const getIsMobile = () => {
   if (typeof cached === 'undefined') {
     cached = (0, _isMobile.default)();
   }
   return cached;
 };
-exports.default = _default;
+var _default = exports.default = getIsMobile;

package/lib/mergeProps.d.ts

@@ -0,0 +1,8 @@
+/**
+ * Merges multiple props objects into one. Unlike `Object.assign()` or `{ ...a, ...b }`, it skips
+ * properties whose value is explicitly set to `undefined`.
+ */
+declare function mergeProps<A, B>(a: A, b: B): B & A;
+declare function mergeProps<A, B, C>(a: A, b: B, c: C): C & B & A;
+declare function mergeProps<A, B, C, D>(a: A, b: B, c: C, d: D): D & C & B & A;
+export default mergeProps;

package/lib/mergeProps.js

@@ -0,0 +1,25 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+/**
+ * Merges multiple props objects into one. Unlike `Object.assign()` or `{ ...a, ...b }`, it skips
+ * properties whose value is explicitly set to `undefined`.
+ */
+
+function mergeProps(...items) {
+  const ret = {};
+  for (const item of items) {
+    if (item) {
+      for (const key of Object.keys(item)) {
+        if (item[key] !== undefined) {
+          ret[key] = item[key];
+        }
+      }
+    }
+  }
+  return ret;
+}
+var _default = exports.default = mergeProps;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@rc-component/util",
-  "version": "1.9.0",
+  "version": "1.10.1",
   "description": "Common Utils For React Component",
   "keywords": [
     "react",
@@ -46,7 +46,7 @@
     "@rc-component/np": "^1.0.3",
     "@testing-library/react": "^16.0.0",
     "@types/jest": "^30.0.0",
-    "@types/node": "^24.6.1",
+    "@types/node": "^25.0.3",
     "@types/react": "^19.2.7",
     "@types/react-dom": "^19.2.2",
     "@types/react-is": "^19.0.0",
@@ -59,9 +59,9 @@
     "eslint-plugin-jest": "^29.0.1",
     "eslint-plugin-unicorn": "^56.0.1",
     "father": "^4.1.3",
-    "glob": "^11.0.3",
+    "glob": "^13.0.0",
     "husky": "^9.1.6",
-    "lint-staged": "^15.1.0",
+    "lint-staged": "^16.2.7",
     "prettier": "^3.3.2",
     "rc-test": "^7.0.14",
     "react": "^18.0.0",