@rc-component/util 1.2.2 → 1.3.1

package/es/hooks/useControlledState.d.ts

@@ -0,0 +1,8 @@
+type Updater<T> = (updater: T | ((origin: T) => T)) => void;
+/**
+ * Similar to `useState` but will use props value if provided.
+ * From React 18, we do not need safe `useState` since it will not throw for unmounted update.
+ * This hooks remove the `onChange` & `postState` logic since we only need basic merged state logic.
+ */
+export default function useControlledState<T>(defaultStateValue: T | (() => T), value?: T): [T, Updater<T>];
+export {};

package/es/hooks/useControlledState.js

@@ -0,0 +1,21 @@
+import { useState } from 'react';
+import useLayoutEffect from "./useLayoutEffect";
+/**
+ * Similar to `useState` but will use props value if provided.
+ * From React 18, we do not need safe `useState` since it will not throw for unmounted update.
+ * This hooks remove the `onChange` & `postState` logic since we only need basic merged state logic.
+ */
+export default function useControlledState(defaultStateValue, value) {
+  const [innerValue, setInnerValue] = useState(defaultStateValue);
+  const mergedValue = value !== undefined ? value : innerValue;
+  useLayoutEffect(mount => {
+    if (!mount) {
+      setInnerValue(value);
+    }
+  }, [value]);
+  return [
+  // Value
+  mergedValue,
+  // Update function
+  setInnerValue];
+}

package/es/hooks/useEvent.d.ts

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

package/es/hooks/useEvent.js

@@ -2,7 +2,7 @@
 /* eslint-disable react-hooks/exhaustive-deps */
 import * as React from 'react';
 function useEvent(callback) {
-  const fnRef = React.useRef();
+  const fnRef = React.useRef(callback);
   fnRef.current = callback;
   const memoFn = React.useCallback((...args) => fnRef.current?.(...args), []);
   return memoFn;

package/es/hooks/useMergedState.d.ts

@@ -1,5 +1,6 @@
 type Updater<T> = (updater: T | ((origin: T) => T), ignoreDestroy?: boolean) => void;
 /**
+ * @deprecated Please use `useControlledState` instead if not need support < React 18.
  * Similar to `useState` but will use props value if provided.
  * Note that internal use rc-util `useState` hook.
  */

package/es/hooks/useMergedState.js

@@ -7,6 +7,7 @@ function hasValue(value) {
 }
 
 /**
+ * @deprecated Please use `useControlledState` instead if not need support < React 18.
  * Similar to `useState` but will use props value if provided.
  * Note that internal use rc-util `useState` hook.
  */

package/es/index.d.ts

@@ -1,5 +1,6 @@
 export { default as useEvent } from './hooks/useEvent';
 export { default as useMergedState } from './hooks/useMergedState';
+export { default as useControlledState } from './hooks/useControlledState';
 export { supportNodeRef, supportRef, useComposeRef } from './ref';
 export { default as get } from './utils/get';
 export { default as set, merge } from './utils/set';

package/es/index.js

@@ -1,5 +1,6 @@
 export { default as useEvent } from "./hooks/useEvent";
 export { default as useMergedState } from "./hooks/useMergedState";
+export { default as useControlledState } from "./hooks/useControlledState";
 export { supportNodeRef, supportRef, useComposeRef } from "./ref";
 export { default as get } from "./utils/get";
 export { default as set, merge } from "./utils/set";

package/lib/hooks/useControlledState.d.ts

@@ -0,0 +1,8 @@
+type Updater<T> = (updater: T | ((origin: T) => T)) => void;
+/**
+ * Similar to `useState` but will use props value if provided.
+ * From React 18, we do not need safe `useState` since it will not throw for unmounted update.
+ * This hooks remove the `onChange` & `postState` logic since we only need basic merged state logic.
+ */
+export default function useControlledState<T>(defaultStateValue: T | (() => T), value?: T): [T, Updater<T>];
+export {};

package/lib/hooks/useControlledState.js

@@ -0,0 +1,28 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = useControlledState;
+var _react = require("react");
+var _useLayoutEffect = _interopRequireDefault(require("./useLayoutEffect"));
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+/**
+ * Similar to `useState` but will use props value if provided.
+ * From React 18, we do not need safe `useState` since it will not throw for unmounted update.
+ * This hooks remove the `onChange` & `postState` logic since we only need basic merged state logic.
+ */
+function useControlledState(defaultStateValue, value) {
+  const [innerValue, setInnerValue] = (0, _react.useState)(defaultStateValue);
+  const mergedValue = value !== undefined ? value : innerValue;
+  (0, _useLayoutEffect.default)(mount => {
+    if (!mount) {
+      setInnerValue(value);
+    }
+  }, [value]);
+  return [
+  // Value
+  mergedValue,
+  // Update function
+  setInnerValue];
+}

package/lib/hooks/useEvent.d.ts

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

package/lib/hooks/useEvent.js

@@ -11,7 +11,7 @@ function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e;
 /* eslint-disable react-hooks/exhaustive-deps */
 
 function useEvent(callback) {
-  const fnRef = React.useRef();
+  const fnRef = React.useRef(callback);
   fnRef.current = callback;
   const memoFn = React.useCallback((...args) => fnRef.current?.(...args), []);
   return memoFn;

package/lib/hooks/useMergedState.d.ts

@@ -1,5 +1,6 @@
 type Updater<T> = (updater: T | ((origin: T) => T), ignoreDestroy?: boolean) => void;
 /**
+ * @deprecated Please use `useControlledState` instead if not need support < React 18.
  * Similar to `useState` but will use props value if provided.
  * Note that internal use rc-util `useState` hook.
  */

package/lib/hooks/useMergedState.js

@@ -14,6 +14,7 @@ function hasValue(value) {
 }
 
 /**
+ * @deprecated Please use `useControlledState` instead if not need support < React 18.
  * Similar to `useState` but will use props value if provided.
  * Note that internal use rc-util `useState` hook.
  */

package/lib/index.d.ts

@@ -1,5 +1,6 @@
 export { default as useEvent } from './hooks/useEvent';
 export { default as useMergedState } from './hooks/useMergedState';
+export { default as useControlledState } from './hooks/useControlledState';
 export { supportNodeRef, supportRef, useComposeRef } from './ref';
 export { default as get } from './utils/get';
 export { default as set, merge } from './utils/set';

package/lib/index.js

@@ -57,6 +57,12 @@ Object.defineProperty(exports, "useComposeRef", {
     return _ref.useComposeRef;
   }
 });
+Object.defineProperty(exports, "useControlledState", {
+  enumerable: true,
+  get: function () {
+    return _useControlledState.default;
+  }
+});
 Object.defineProperty(exports, "useEvent", {
   enumerable: true,
   get: function () {
@@ -77,6 +83,7 @@ Object.defineProperty(exports, "warning", {
 });
 var _useEvent = _interopRequireDefault(require("./hooks/useEvent"));
 var _useMergedState = _interopRequireDefault(require("./hooks/useMergedState"));
+var _useControlledState = _interopRequireDefault(require("./hooks/useControlledState"));
 var _ref = require("./ref");
 var _get = _interopRequireDefault(require("./utils/get"));
 var _set = _interopRequireWildcard(require("./utils/set"));

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@rc-component/util",
-  "version": "1.2.2",
+  "version": "1.3.1",
   "description": "Common Utils For React Component",
   "keywords": [
     "react",
@@ -27,6 +27,7 @@
     "coverage": "npm test -- --coverage",
     "lint": "eslint src/ --ext .tsx,.ts & eslint tests/ --ext .tsx,.ts",
     "prepare": "husky install",
+    "prepublishOnly": "npm run compile && rc-np",
     "start": "dumi dev",
     "test": "rc-test"
   },
@@ -44,8 +45,8 @@
     "@rc-component/father-plugin": "^2.0.1",
     "@rc-component/np": "^1.0.3",
     "@testing-library/react": "^16.0.0",
-    "@types/jest": "^29.4.0",
-    "@types/node": "^22.5.5",
+    "@types/jest": "^30.0.0",
+    "@types/node": "^24.6.1",
     "@types/react": "^18.0.0",
     "@types/react-dom": "^18.0.0",
     "@types/react-is": "^19.0.0",
@@ -58,7 +59,7 @@
     "eslint-plugin-jest": "^28.2.0",
     "eslint-plugin-unicorn": "^56.0.1",
     "father": "^4.1.3",
-    "glob": "^9.2.1",
+    "glob": "^11.0.3",
     "husky": "^9.1.6",
     "lint-staged": "^15.1.0",
     "prettier": "^3.3.2",