@aiszlab/relax 2.1.2-beta.3 → 2.1.2-beta.4

package/dist/hooks/use-controlled-state.cjs

@@ -4,7 +4,7 @@ var _slicedToArray = require('@babel/runtime/helpers/slicedToArray');
 var react = require('react');
 var isUndefined = require('../is/is-undefined.cjs');
 var isFunction = require('../is/is-function.cjs');
-var reactDom = require('react-dom');
+var useUpdateEffect = require('./use-update-effect.cjs');
 
 function useControlledState(controlledState) {
   var _ref = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {},
@@ -25,27 +25,14 @@ function useControlledState(controlledState) {
     _useState2 = _slicedToArray(_useState, 2),
     _state = _useState2[0],
     _setState = _useState2[1];
-  // 变更状态函数
-  // 变更内容为函数，且需要触发`onChange`，那么本次状态更新必为同步
-  // 其余继续保持批处理逻辑
-  var setState = react.useCallback(function (newValue) {
-    if (isFunction.isFunction(newValue)) {
-      if (onChange) {
-        reactDom.flushSync(function () {
-          _setState(newValue);
-        });
-        onChange(_state);
-        return;
-      }
-      _setState(newValue);
-      return;
-    }
-    _setState(newValue);
-    onChange === null || onChange === void 0 || onChange(newValue);
-  }, [_setState, _state]);
+  // 监听内部状态变更
+  // 如果状态发生更新时，触发回调函数`onChange`
+  useUpdateEffect.useUpdateEffect(function () {
+    onChange === null || onChange === void 0 || onChange(_state);
+  }, [_state]);
   // use controlled
   var state = isUndefined.isUndefined(controlledState) ? _state : controlledState;
-  return [state, setState];
+  return [state, _setState];
 }
 
 exports.useControlledState = useControlledState;

package/dist/hooks/use-controlled-state.mjs

@@ -1,8 +1,8 @@
 import _slicedToArray from '@babel/runtime/helpers/slicedToArray';
-import { useState, useCallback } from 'react';
+import { useState } from 'react';
 import { isUndefined } from '../is/is-undefined.mjs';
 import { isFunction } from '../is/is-function.mjs';
-import { flushSync } from 'react-dom';
+import { useUpdateEffect } from './use-update-effect.mjs';
 
 function useControlledState(controlledState) {
   var _ref = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {},
@@ -23,27 +23,14 @@ function useControlledState(controlledState) {
     _useState2 = _slicedToArray(_useState, 2),
     _state = _useState2[0],
     _setState = _useState2[1];
-  // 变更状态函数
-  // 变更内容为函数，且需要触发`onChange`，那么本次状态更新必为同步
-  // 其余继续保持批处理逻辑
-  var setState = useCallback(function (newValue) {
-    if (isFunction(newValue)) {
-      if (onChange) {
-        flushSync(function () {
-          _setState(newValue);
-        });
-        onChange(_state);
-        return;
-      }
-      _setState(newValue);
-      return;
-    }
-    _setState(newValue);
-    onChange === null || onChange === void 0 || onChange(newValue);
-  }, [_setState, _state]);
+  // 监听内部状态变更
+  // 如果状态发生更新时，触发回调函数`onChange`
+  useUpdateEffect(function () {
+    onChange === null || onChange === void 0 || onChange(_state);
+  }, [_state]);
   // use controlled
   var state = isUndefined(controlledState) ? _state : controlledState;
-  return [state, setState];
+  return [state, _setState];
 }
 
 export { useControlledState };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@aiszlab/relax",
-  "version": "2.1.2-beta.3",
+  "version": "2.1.2-beta.4",
   "description": "react utils collection",
   "exports": {
     ".": {