@pnkx-lib/ui 1.9.505 → 1.9.508

package/es/chunks/{GenericUploadModal-BNQ9cWDf.js → GenericUploadModal-Dhv5_mhq.js}

@@ -2,7 +2,7 @@ import { jsx, jsxs } from 'react/jsx-runtime';
 import { Modal, Spin } from 'antd';
 import * as React from 'react';
 import React__default, { isValidElement, version as version$1, useRef, useLayoutEffect, useEffect, forwardRef, useImperativeHandle, Component, useContext, useMemo as useMemo$1, useState, Children } from 'react';
-import { b as useMemo, i as isFragment$1, L as LocaleContext, l as localeValues, c as useLayoutUpdateEffect, d as Context, e as useLayoutEffect$1, _ as _toConsumableArray, t as toArray$2, u as unit, f as clearFix, h as textEllipsis, g as genStyleHooks, m as merge, r as resetComponent, j as defaultPrefixCls, k as genComponentStyleHook, w as warning$1, C as ConfigContext, n as useToken, S as SizeContext, p as devUseWarning, q as getAlphaColor, s as getLineHeight, v as genFocusStyle, x as resetIcon, y as genSubStyleComponent, a as useComponentConfig, D as DisabledContext, o as omit } from './toArray-Czwb0MFW.js';
+import { b as useMemo, i as isFragment$1, L as LocaleContext, l as localeValues, c as useLayoutUpdateEffect, d as Context, e as useLayoutEffect$1, _ as _toConsumableArray, t as toArray$2, u as unit, f as clearFix, h as textEllipsis, g as genStyleHooks, m as merge, r as resetComponent, j as defaultPrefixCls, k as genComponentStyleHook, w as warning$1, C as ConfigContext, n as useToken, S as SizeContext, p as devUseWarning, q as getAlphaColor, s as getLineHeight, v as genFocusStyle, x as resetIcon, y as genSubStyleComponent, a as useComponentConfig, D as DisabledContext, o as omit } from './toArray-2LkvUaha.js';
 import * as ReactDOM from 'react-dom';
 import ReactDOM__default, { createPortal, flushSync } from 'react-dom';
 import { c as classNames } from './index-BLRvgOFN.js';
@@ -12,7 +12,7 @@ import { _ as _typeof, b as _defineProperty } from './defineProperty-CTLrw71t.js
 import { R as RefIcon$7 } from './LoadingOutlined-DCtDXz9K.js';
 import { R as RefIcon$8, a as RefIcon$a } from './CloseCircleFilled-Bo29sDEQ.js';
 import { R as RefIcon$9 } from './CloseOutlined-CZUJ_3tW.js';
-import { C as Controller } from './index.esm-AaUjBMaK.js';
+import { C as Controller } from './index.esm-Dr5ZHcf7.js';
 import { toast } from '@pnkx-lib/core';
 import { R as RefIcon$b } from './InboxOutlined-BBuIJe6u.js';
 
@@ -3627,8 +3627,6 @@ function useAlign(open, popupEle, target, placement, builtinPlacements, popupAli
       var doc = popupElement.ownerDocument;
       var win = getWin(popupElement);
       var _win$getComputedStyle = win.getComputedStyle(popupElement),
-        width = _win$getComputedStyle.width,
-        height = _win$getComputedStyle.height,
         popupPosition = _win$getComputedStyle.position;
       var originLeft = popupElement.style.left;
       var originTop = popupElement.style.top;
@@ -3677,6 +3675,9 @@ function useAlign(open, popupEle, target, placement, builtinPlacements, popupAli
         };
       }
       var popupRect = popupElement.getBoundingClientRect();
+      var _win$getComputedStyle2 = win.getComputedStyle(popupElement),
+        height = _win$getComputedStyle2.height,
+        width = _win$getComputedStyle2.width;
       popupRect.x = (_popupRect$x = popupRect.x) !== null && _popupRect$x !== void 0 ? _popupRect$x : popupRect.left;
       popupRect.y = (_popupRect$y = popupRect.y) !== null && _popupRect$y !== void 0 ? _popupRect$y : popupRect.top;
       var _doc$documentElement = doc.documentElement,
@@ -4550,6 +4551,10 @@ function generateTrigger() {
       cloneProps.className = classNames(originChildProps.className, className);
     }
 
+    // ============================ Perf ============================
+    var renderedRef = React.useRef(false);
+    renderedRef.current || (renderedRef.current = forceRender || mergedOpen || inMotion);
+
     // =========================== Render ===========================
     var mergedChildrenProps = _objectSpread2(_objectSpread2({}, originChildProps), cloneProps);
 
@@ -4584,7 +4589,7 @@ function generateTrigger() {
       onResize: onTargetResize
     }, /*#__PURE__*/React.createElement(TriggerWrapper, {
       getTriggerDOMNode: getTriggerDOMNode
-    }, triggerNode)), /*#__PURE__*/React.createElement(TriggerContext.Provider, {
+    }, triggerNode)), renderedRef.current && /*#__PURE__*/React.createElement(TriggerContext.Provider, {
       value: context
     }, /*#__PURE__*/React.createElement(Popup, {
       portal: PortalComponent,
@@ -4831,19 +4836,17 @@ function _regeneratorDefine(e, r, n, t) {
     i = 0;
   }
   _regeneratorDefine = function regeneratorDefine(e, r, n, t) {
-    if (r) i ? i(e, r, {
+    function o(r, n) {
+      _regeneratorDefine(e, r, function (e) {
+        return this._invoke(r, n, e);
+      });
+    }
+    r ? i ? i(e, r, {
       value: n,
       enumerable: !t,
       configurable: !t,
       writable: !t
-    }) : e[r] = n;else {
-      var o = function o(r, n) {
-        _regeneratorDefine(e, r, function (e) {
-          return this._invoke(r, n, e);
-        });
-      };
-      o("next", 0), o("throw", 1), o("return", 2);
-    }
+    }) : e[r] = n : (o("next", 0), o("throw", 1), o("return", 2));
   }, _regeneratorDefine(e, r, n, t);
 }
 
@@ -6878,7 +6881,7 @@ const genWaveStyle = token => {
     }
   };
 };
-const useStyle$3 = genComponentStyleHook('Wave', token => [genWaveStyle(token)]);
+const useStyle$3 = genComponentStyleHook('Wave', genWaveStyle);
 
 const TARGET_CLS = `${defaultPrefixCls}-wave-target`;
 
@@ -6999,24 +7002,16 @@ function unstableSetRender(render) {
 function isValidWaveColor(color) {
   return color && color !== '#fff' && color !== '#ffffff' && color !== 'rgb(255, 255, 255)' && color !== 'rgba(255, 255, 255, 1)' && !/rgba\((?:\d*, ){3}0\)/.test(color) &&
   // any transparent rgba color
-  color !== 'transparent';
+  color !== 'transparent' && color !== 'canvastext';
 }
 function getTargetWaveColor(node) {
+  var _a;
   const {
     borderTopColor,
     borderColor,
     backgroundColor
   } = getComputedStyle(node);
-  if (isValidWaveColor(borderTopColor)) {
-    return borderTopColor;
-  }
-  if (isValidWaveColor(borderColor)) {
-    return borderColor;
-  }
-  if (isValidWaveColor(backgroundColor)) {
-    return backgroundColor;
-  }
-  return null;
+  return (_a = [borderTopColor, borderColor, backgroundColor].find(isValidWaveColor)) !== null && _a !== void 0 ? _a : null;
 }
 
 function validateNum(value) {
@@ -7640,6 +7635,13 @@ let AggregationColor = /*#__PURE__*/function () {
   }]);
 }();
 
+const generateColor = color => {
+  if (color instanceof AggregationColor) {
+    return color;
+  }
+  return new AggregationColor(color);
+};
+
 const isBright = (value, bgColorToken) => {
   const {
     r,
@@ -7681,6 +7683,7 @@ const prepareComponentToken$2 = token => {
   }), {});
   return Object.assign(Object.assign({}, shadowColorTokens), {
     fontWeight: 400,
+    iconGap: token.marginXS,
     defaultShadow: `0 ${token.controlOutlineWidth}px 0 ${token.controlTmpOutline}`,
     primaryShadow: `0 ${token.controlOutlineWidth}px 0 ${token.controlOutline}`,
     dangerShadow: `0 ${token.controlOutlineWidth}px 0 ${token.colorErrorOutline}`,
@@ -7734,7 +7737,7 @@ const genSharedButtonStyle = token => {
     opacityLoading,
     motionDurationSlow,
     motionEaseInOut,
-    marginXS,
+    iconGap,
     calc
   } = token;
   return {
@@ -7742,7 +7745,7 @@ const genSharedButtonStyle = token => {
       outline: 'none',
       position: 'relative',
       display: 'inline-flex',
-      gap: token.marginXS,
+      gap: iconGap,
       alignItems: 'center',
       justifyContent: 'center',
       fontWeight,
@@ -7794,7 +7797,7 @@ const genSharedButtonStyle = token => {
       [`&:not(${componentCls}-icon-end)`]: {
         [`${componentCls}-loading-icon-motion`]: {
           '&-appear-start, &-enter-start': {
-            marginInlineEnd: calc(marginXS).mul(-1).equal()
+            marginInlineEnd: calc(iconGap).mul(-1).equal()
           },
           '&-appear-active, &-enter-active': {
             marginInlineEnd: 0
@@ -7803,7 +7806,7 @@ const genSharedButtonStyle = token => {
             marginInlineEnd: 0
           },
           '&-leave-active': {
-            marginInlineEnd: calc(marginXS).mul(-1).equal()
+            marginInlineEnd: calc(iconGap).mul(-1).equal()
           }
         }
       },
@@ -7811,7 +7814,7 @@ const genSharedButtonStyle = token => {
         flexDirection: 'row-reverse',
         [`${componentCls}-loading-icon-motion`]: {
           '&-appear-start, &-enter-start': {
-            marginInlineStart: calc(marginXS).mul(-1).equal()
+            marginInlineStart: calc(iconGap).mul(-1).equal()
           },
           '&-appear-active, &-enter-active': {
             marginInlineStart: 0
@@ -7820,7 +7823,7 @@ const genSharedButtonStyle = token => {
             marginInlineStart: 0
           },
           '&-leave-active': {
-            marginInlineStart: calc(marginXS).mul(-1).equal()
+            marginInlineStart: calc(iconGap).mul(-1).equal()
           }
         }
       }
@@ -7943,8 +7946,10 @@ const genPresetColorStyle = token => {
         borderColor: activeColor,
         background: token.colorBgContainer
       })), genDashedButtonStyle(token)), genFilledButtonStyle(token, lightColor, {
+        color: darkColor,
         background: lightHoverColor
       }, {
+        color: darkColor,
         background: lightBorderColor
       })), genTextLinkButtonStyle(token, darkColor, 'link', {
         color: hoverColor
@@ -7970,8 +7975,10 @@ const genDefaultButtonStyle = token => Object.assign(Object.assign(Object.assign
   color: token.solidTextColor,
   background: token.colorBgSolidActive
 })), genDashedButtonStyle(token)), genFilledButtonStyle(token, token.colorFillTertiary, {
+  color: token.defaultColor,
   background: token.colorFillSecondary
 }, {
+  color: token.defaultColor,
   background: token.colorFill
 })), genGhostButtonStyle(token.componentCls, token.ghostBg, token.defaultGhostColor, token.defaultGhostBorderColor, token.colorTextDisabled, token.colorBorder)), genTextLinkButtonStyle(token, token.textTextColor, 'link', {
   color: token.colorLinkHover,
@@ -7991,8 +7998,10 @@ const genPrimaryButtonStyle = token => Object.assign(Object.assign(Object.assign
   borderColor: token.colorPrimaryActive,
   background: token.colorBgContainer
 })), genDashedButtonStyle(token)), genFilledButtonStyle(token, token.colorPrimaryBg, {
+  color: token.colorPrimary,
   background: token.colorPrimaryBgHover
 }, {
+  color: token.colorPrimary,
   background: token.colorPrimaryBorder
 })), genTextLinkButtonStyle(token, token.colorPrimaryText, 'text', {
   color: token.colorPrimaryTextHover,
@@ -8026,8 +8035,10 @@ const genDangerousStyle = token => Object.assign(Object.assign(Object.assign(Obj
   color: token.colorErrorActive,
   borderColor: token.colorErrorActive
 })), genDashedButtonStyle(token)), genFilledButtonStyle(token, token.colorErrorBg, {
+  color: token.colorError,
   background: token.colorErrorBgFilledHover
 }, {
+  color: token.colorError,
   background: token.colorErrorBgActive
 })), genTextLinkButtonStyle(token, token.colorError, 'text', {
   color: token.colorErrorHover,
@@ -8195,7 +8206,7 @@ const useStyle$2 = genStyleHooks('Button', token => {
 });
 
 // handle border collapse
-function compactItemBorder(token, parentCls, options) {
+function compactItemBorder(token, parentCls, options, prefixCls) {
   const {
     focusElCls,
     focus,
@@ -8207,13 +8218,16 @@ function compactItemBorder(token, parentCls, options) {
     [`&-item:not(${parentCls}-last-item)`]: {
       marginInlineEnd: token.calc(token.lineWidth).mul(-1).equal()
     },
+    [`&-item:not(${prefixCls}-status-success)`]: {
+      zIndex: 2
+    },
     '&-item': Object.assign(Object.assign({
       [hoverEffects]: {
-        zIndex: 2
+        zIndex: 3
       }
     }, focusElCls ? {
       [`&${focusElCls}`]: {
-        zIndex: 2
+        zIndex: 3
       }
     } : {}), {
       [`&[disabled] ${childCombinator}`]: {
@@ -8254,19 +8268,22 @@ function genCompactItemStyle(token, options = {
   } = token;
   const compactCls = `${componentCls}-compact`;
   return {
-    [compactCls]: Object.assign(Object.assign({}, compactItemBorder(token, compactCls, options)), compactItemBorderRadius(componentCls, compactCls, options))
+    [compactCls]: Object.assign(Object.assign({}, compactItemBorder(token, compactCls, options, componentCls)), compactItemBorderRadius(componentCls, compactCls, options))
   };
 }
 
-function compactItemVerticalBorder(token, parentCls) {
+function compactItemVerticalBorder(token, parentCls, prefixCls) {
   return {
     // border collapse
     [`&-item:not(${parentCls}-last-item)`]: {
       marginBottom: token.calc(token.lineWidth).mul(-1).equal()
     },
+    [`&-item:not(${prefixCls}-status-success)`]: {
+      zIndex: 2
+    },
     '&-item': {
       '&:hover,&:focus,&:active': {
-        zIndex: 2
+        zIndex: 3
       },
       '&[disabled]': {
         zIndex: 0
@@ -8296,7 +8313,7 @@ function compactItemBorderVerticalRadius(prefixCls, parentCls) {
 function genCompactItemVerticalStyle(token) {
   const compactCls = `${token.componentCls}-compact-vertical`;
   return {
-    [compactCls]: Object.assign(Object.assign({}, compactItemVerticalBorder(token, compactCls)), compactItemBorderVerticalRadius(token.componentCls, compactCls))
+    [compactCls]: Object.assign(Object.assign({}, compactItemVerticalBorder(token, compactCls, token.componentCls)), compactItemBorderVerticalRadius(token.componentCls, compactCls))
   };
 }
 
@@ -8372,7 +8389,7 @@ const InternalCompoundedButton = /*#__PURE__*/React__default.forwardRef((props,
       variant,
       type,
       danger = false,
-      shape = 'default',
+      shape: customizeShape,
       size: customizeSize,
       styles,
       disabled: customDisabled,
@@ -8397,6 +8414,7 @@ const InternalCompoundedButton = /*#__PURE__*/React__default.forwardRef((props,
   const {
     button
   } = React__default.useContext(ConfigContext);
+  const shape = customizeShape || (button === null || button === void 0 ? void 0 : button.shape) || 'default';
   const [mergedColor, mergedVariant] = useMemo$1(() => {
     // >>>>> Local
     // Color & Variant
@@ -8453,7 +8471,7 @@ const InternalCompoundedButton = /*#__PURE__*/React__default.forwardRef((props,
   // ========================= Effect =========================
   // Loading. Should use `useLayoutEffect` to avoid low perf multiple click issue.
   // https://github.com/ant-design/ant-design/issues/51325
-  useLayoutEffect(() => {
+  useLayoutEffect$1(() => {
     let delayTimer = null;
     if (loadingOrDelay.delay > 0) {
       delayTimer = setTimeout(() => {
@@ -9463,6 +9481,11 @@ function getPlacements(config) {
     borderRadius} = config;
   const halfArrowWidth = arrowWidth / 2;
   const placementMap = {};
+  // Dynamic offset
+  const arrowOffset = getArrowOffsetToken({
+    contentRadius: borderRadius,
+    limitVerticalRadius: true
+  });
   Object.keys(PlacementAlignMap).forEach(key => {
     const template = arrowPointAtCenter && ArrowCenterPlacementAlignMap[key] || PlacementAlignMap[key];
     const placementInfo = Object.assign(Object.assign({}, template), {
@@ -9497,11 +9520,6 @@ function getPlacements(config) {
         placementInfo.offset[0] = halfArrowWidth + offset;
         break;
     }
-    // Dynamic offset
-    const arrowOffset = getArrowOffsetToken({
-      contentRadius: borderRadius,
-      limitVerticalRadius: true
-    });
     if (arrowPointAtCenter) {
       switch (key) {
         case 'topLeft':
@@ -9573,7 +9591,7 @@ const genTooltipStyle = token => {
         minWidth: centerAlignMinWidth,
         minHeight: controlHeight,
         padding: `${unit(token.calc(paddingSM).div(2).equal())} ${unit(paddingXS)}`,
-        color: tooltipColor,
+        color: `var(--ant-tooltip-color, ${tooltipColor})`,
         textAlign: 'start',
         textDecoration: 'none',
         wordWrap: 'break-word',
@@ -9676,8 +9694,12 @@ function parseColor(prefixCls, color) {
   });
   const overlayStyle = {};
   const arrowStyle = {};
+  const rgb = generateColor(color).toRgb();
+  const luminance = (0.299 * rgb.r + 0.587 * rgb.g + 0.114 * rgb.b) / 255;
+  const textColor = luminance < 0.5 ? '#FFF' : '#000';
   if (color && !isInternalColor) {
     overlayStyle.background = color;
+    overlayStyle['--ant-tooltip-color'] = textColor;
     // @ts-ignore
     arrowStyle['--antd-arrow-background-color'] = color;
   }
@@ -11046,6 +11068,7 @@ var __awaiter = undefined && undefined.__awaiter || function (thisArg, _argument
 };
 const LIST_IGNORE = `__LIST_IGNORE_${Date.now()}__`;
 const InternalUpload = (props, ref) => {
+  const config = useComponentConfig('upload');
   const {
     fileList,
     defaultFileList,
@@ -11080,6 +11103,7 @@ const InternalUpload = (props, ref) => {
   // ===================== Disabled =====================
   const disabled = React.useContext(DisabledContext);
   const mergedDisabled = customDisabled !== null && customDisabled !== void 0 ? customDisabled : disabled;
+  const customRequest = props.customRequest || config.customRequest;
   const [mergedFileList, setMergedFileList] = useMergedState(defaultFileList || [], {
     value: fileList,
     postState: list => list !== null && list !== void 0 ? list : []
@@ -11209,7 +11233,6 @@ const InternalUpload = (props, ref) => {
   const onSuccess = (response, file, xhr) => {
     try {
       if (typeof response === 'string') {
-        // biome-ignore lint/style/noParameterAssign: we need to modify response
         response = JSON.parse(response);
       }
     } catch (_a) {
@@ -11302,6 +11325,7 @@ const InternalUpload = (props, ref) => {
     onProgress,
     onSuccess
   }, props), {
+    customRequest,
     data,
     multiple,
     action,

package/es/chunks/{index.esm-AaUjBMaK.js → index.esm-Dr5ZHcf7.js}

@@ -1,4 +1,3 @@
-import * as React from 'react';
 import React__default from 'react';
 
 var isCheckBoxInput = (element) => element.type === 'checkbox';
@@ -39,12 +38,9 @@ function cloneObject(data) {
     if (data instanceof Date) {
         copy = new Date(data);
     }
-    else if (data instanceof Set) {
-        copy = new Set(data);
-    }
     else if (!(isWeb && (data instanceof Blob || isFileListInstance)) &&
         (isArray || isObject(data))) {
-        copy = isArray ? [] : {};
+        copy = isArray ? [] : Object.create(Object.getPrototypeOf(data));
         if (!isArray && !isPlainObject(data)) {
             copy = data;
         }
@@ -184,7 +180,7 @@ var getProxyFormState = (formState, control, localProxyFormState, isRoot = true)
     return result;
 };
 
-const useIsomorphicLayoutEffect = typeof window !== 'undefined' ? React.useLayoutEffect : React.useEffect;
+const useIsomorphicLayoutEffect = typeof window !== 'undefined' ? React__default.useLayoutEffect : React__default.useEffect;
 
 /**
  * This custom hook allows you to subscribe to each form state, and isolate the re-render at the custom hook level. It has its scope in terms of form state subscription, so it would not affect other useFormState and useForm. Using this hook can reduce the re-render impact on large and complex form application.
@@ -256,12 +252,51 @@ var generateWatchOutput = (names, _names, formValues, isGlobal, defaultValue) =>
         return get(formValues, names, defaultValue);
     }
     if (Array.isArray(names)) {
-        return names.map((fieldName) => (isGlobal && _names.watch.add(fieldName), get(formValues, fieldName)));
+        return names.map((fieldName) => (isGlobal && _names.watch.add(fieldName),
+            get(formValues, fieldName)));
     }
     isGlobal && (_names.watchAll = true);
     return formValues;
 };
 
+var isPrimitive = (value) => isNullOrUndefined(value) || !isObjectType(value);
+
+function deepEqual(object1, object2, _internal_visited = new WeakSet()) {
+    if (isPrimitive(object1) || isPrimitive(object2)) {
+        return object1 === object2;
+    }
+    if (isDateObject(object1) && isDateObject(object2)) {
+        return object1.getTime() === object2.getTime();
+    }
+    const keys1 = Object.keys(object1);
+    const keys2 = Object.keys(object2);
+    if (keys1.length !== keys2.length) {
+        return false;
+    }
+    if (_internal_visited.has(object1) || _internal_visited.has(object2)) {
+        return true;
+    }
+    _internal_visited.add(object1);
+    _internal_visited.add(object2);
+    for (const key of keys1) {
+        const val1 = object1[key];
+        if (!keys2.includes(key)) {
+            return false;
+        }
+        if (key !== 'ref') {
+            const val2 = object2[key];
+            if ((isDateObject(val1) && isDateObject(val2)) ||
+                (isObject(val1) && isObject(val2)) ||
+                (Array.isArray(val1) && Array.isArray(val2))
+                ? !deepEqual(val1, val2, _internal_visited)
+                : val1 !== val2) {
+                return false;
+            }
+        }
+    }
+    return true;
+}
+
 /**
  * Custom hook to subscribe to field change and isolate re-rendering at the component level.
  *
@@ -280,18 +315,35 @@ var generateWatchOutput = (names, _names, formValues, isGlobal, defaultValue) =>
  */
 function useWatch(props) {
     const methods = useFormContext();
-    const { control = methods.control, name, defaultValue, disabled, exact, } = props || {};
+    const { control = methods.control, name, defaultValue, disabled, exact, compute, } = props || {};
     const _defaultValue = React__default.useRef(defaultValue);
-    const [value, updateValue] = React__default.useState(control._getWatch(name, _defaultValue.current));
+    const _compute = React__default.useRef(compute);
+    const _computeFormValues = React__default.useRef(undefined);
+    _compute.current = compute;
+    const defaultValueMemo = React__default.useMemo(() => control._getWatch(name, _defaultValue.current), [control, name]);
+    const [value, updateValue] = React__default.useState(_compute.current ? _compute.current(defaultValueMemo) : defaultValueMemo);
     useIsomorphicLayoutEffect(() => control._subscribe({
         name,
         formState: {
             values: true,
         },
         exact,
-        callback: (formState) => !disabled &&
-            updateValue(generateWatchOutput(name, control._names, formState.values || control._formValues, false, _defaultValue.current)),
-    }), [name, control, disabled, exact]);
+        callback: (formState) => {
+            if (!disabled) {
+                const formValues = generateWatchOutput(name, control._names, formState.values || control._formValues, false, _defaultValue.current);
+                if (_compute.current) {
+                    const computedFormValues = _compute.current(formValues);
+                    if (!deepEqual(computedFormValues, _computeFormValues.current)) {
+                        updateValue(computedFormValues);
+                        _computeFormValues.current = computedFormValues;
+                    }
+                }
+                else {
+                    updateValue(formValues);
+                }
+            }
+        },
+    }), [control, disabled, name, exact]);
     React__default.useEffect(() => control._removeUnmounted());
     return value;
 }
@@ -322,12 +374,13 @@ function useWatch(props) {
  */
 function useController(props) {
     const methods = useFormContext();
-    const { name, disabled, control = methods.control, shouldUnregister } = props;
+    const { name, disabled, control = methods.control, shouldUnregister, defaultValue, } = props;
     const isArrayField = isNameInFieldArray(control._names.array, name);
+    const defaultValueMemo = React__default.useMemo(() => get(control._formValues, name, get(control._defaultValues, name, defaultValue)), [control, name, defaultValue]);
     const value = useWatch({
         control,
         name,
-        defaultValue: get(control._formValues, name, get(control._defaultValues, name, props.defaultValue)),
+        defaultValue: defaultValueMemo,
         exact: true,
     });
     const formState = useFormState({
@@ -341,6 +394,7 @@ function useController(props) {
         value,
         ...(isBoolean(props.disabled) ? { disabled: props.disabled } : {}),
     }));
+    _props.current = props;
     const fieldState = React__default.useMemo(() => Object.defineProperties({}, {
         invalid: {
             enumerable: true,
@@ -526,39 +580,6 @@ var createSubject = () => {
     };
 };
 
-var isPrimitive = (value) => isNullOrUndefined(value) || !isObjectType(value);
-
-function deepEqual(object1, object2) {
-    if (isPrimitive(object1) || isPrimitive(object2)) {
-        return object1 === object2;
-    }
-    if (isDateObject(object1) && isDateObject(object2)) {
-        return object1.getTime() === object2.getTime();
-    }
-    const keys1 = Object.keys(object1);
-    const keys2 = Object.keys(object2);
-    if (keys1.length !== keys2.length) {
-        return false;
-    }
-    for (const key of keys1) {
-        const val1 = object1[key];
-        if (!keys2.includes(key)) {
-            return false;
-        }
-        if (key !== 'ref') {
-            const val2 = object2[key];
-            if ((isDateObject(val1) && isDateObject(val2)) ||
-                (isObject(val1) && isObject(val2)) ||
-                (Array.isArray(val1) && Array.isArray(val2))
-                ? !deepEqual(val1, val2)
-                : val1 !== val2) {
-                return false;
-            }
-        }
-    }
-    return true;
-}
-
 var isEmptyObject = (value) => isObject(value) && !Object.keys(value).length;
 
 var isFileInput = (element) => element.type === 'file';
@@ -1126,7 +1147,7 @@ function createFormControl(props = {}) {
         errors: _options.errors || {},
         disabled: _options.disabled || false,
     };
-    const _fields = {};
+    let _fields = {};
     let _defaultValues = isObject(_options.defaultValues) || isObject(_options.values)
         ? cloneObject(_options.defaultValues || _options.values) || {}
         : {};
@@ -1510,7 +1531,7 @@ function createFormControl(props = {}) {
                 ? setValues(name, cloneValue, options)
                 : setFieldValue(name, cloneValue, options);
         }
-        isWatched(name, _names) && _subjects.state.next({ ..._formState });
+        isWatched(name, _names) && _subjects.state.next({ ..._formState, name });
         _subjects.state.next({
             name: _state.mount ? name : undefined,
             values: cloneObject(_formValues),
@@ -1545,8 +1566,10 @@ function createFormControl(props = {}) {
             const watched = isWatched(name, _names, isBlurEvent);
             set(_formValues, name, fieldValue);
             if (isBlurEvent) {
-                field._f.onBlur && field._f.onBlur(event);
-                delayErrorCallback && delayErrorCallback(0);
+                if (!target || !target.readOnly) {
+                    field._f.onBlur && field._f.onBlur(event);
+                    delayErrorCallback && delayErrorCallback(0);
+                }
             }
             else if (field._f.onChange) {
                 field._f.onChange(event);
@@ -1692,7 +1715,8 @@ function createFormControl(props = {}) {
     };
     const watch = (name, defaultValue) => isFunction(name)
         ? _subjects.state.subscribe({
-            next: (payload) => name(_getWatch(undefined, defaultValue), payload),
+            next: (payload) => 'values' in payload &&
+                name(_getWatch(undefined, defaultValue), payload),
         })
         : _getWatch(name, defaultValue, true);
     const _subscribe = (props) => _subjects.state.subscribe({
@@ -1703,6 +1727,7 @@ function createFormControl(props = {}) {
                     values: { ..._formValues },
                     ..._formState,
                     ...formState,
+                    defaultValues: _defaultValues,
                 });
             }
         },
@@ -1869,14 +1894,14 @@ function createFormControl(props = {}) {
         if (_options.resolver) {
             const { errors, values } = await _runSchema();
             _formState.errors = errors;
-            fieldValues = values;
+            fieldValues = cloneObject(values);
         }
         else {
             await executeBuiltInValidation(_fields);
         }
         if (_names.disabled.size) {
             for (const name of _names.disabled) {
-                set(fieldValues, name, undefined);
+                unset(fieldValues, name);
             }
         }
         unset(_formState.errors, 'root');
@@ -1972,11 +1997,20 @@ function createFormControl(props = {}) {
                         }
                     }
                 }
-                for (const fieldName of _names.mount) {
-                    setValue(fieldName, get(values, fieldName));
+                if (keepStateOptions.keepFieldsRef) {
+                    for (const fieldName of _names.mount) {
+                        setValue(fieldName, get(values, fieldName));
+                    }
+                }
+                else {
+                    _fields = {};
                 }
             }
-            _formValues = cloneObject(values);
+            _formValues = _options.shouldUnregister
+                ? keepStateOptions.keepDefaultValues
+                    ? cloneObject(_defaultValues)
+                    : {}
+                : cloneObject(values);
             _subjects.array.next({
                 values: { ...values },
             });
@@ -2030,6 +2064,7 @@ function createFormControl(props = {}) {
                 ? _formState.isSubmitSuccessful
                 : false,
             isSubmitting: false,
+            defaultValues: _defaultValues,
         });
     };
     const reset = (formValues, keepStateOptions) => _reset(isFunction(formValues)
@@ -2258,7 +2293,10 @@ function useForm(props = {}) {
     }, [control, formState.isDirty]);
     React__default.useEffect(() => {
         if (props.values && !deepEqual(props.values, _values.current)) {
-            control._reset(props.values, control._options.resetOptions);
+            control._reset(props.values, {
+                keepFieldsRef: true,
+                ...control._options.resetOptions,
+            });
             _values.current = props.values;
             updateFormState((state) => ({ ...state }));
         }