@nutui/nutui-react 2.7.1 → 2.7.3

package/dist/nutui.react.es.js

@@ -1,5 +1,5 @@
 /*!
-* @nutui/nutui-react v2.7.1 Fri Nov 22 2024 15:44:59 GMT+0800 (Central Standard Time)
+* @nutui/nutui-react v2.7.3 Fri Dec 13 2024 15:50:56 GMT+0800 (China Standard Time)
 * (c) 2023 @jdf2e.
 * Released under the MIT License.
 */
@@ -5314,7 +5314,7 @@ function eachProp(obj, fn, ctx2) {
     }
   }
 }
-const toArray = (a) => is.und(a) ? [] : is.arr(a) ? a : [a];
+const toArray$1 = (a) => is.und(a) ? [] : is.arr(a) ? a : [a];
 function flush(queue, iterator) {
   if (queue.size) {
     const items = Array.from(queue);
@@ -6322,7 +6322,7 @@ function _extends$1() {
 function callProp(value, ...args) {
   return is.fun(value) ? value(...args) : value;
 }
-const matchProp = (value, key) => value === true || !!(key && value && (is.fun(value) ? value(key) : toArray(value).includes(key)));
+const matchProp = (value, key) => value === true || !!(key && value && (is.fun(value) ? value(key) : toArray$1(value).includes(key)));
 const resolveProp = (prop, key) => is.obj(prop) ? key && prop[key] : prop;
 const getDefaultProp = (props, key) => props.default === true ? props[key] : props.default ? props.default[key] : void 0;
 const noopTransform = (value) => value;
@@ -6864,7 +6864,7 @@ class SpringValue extends FrameValue {
     } = anim;
     const payload = getPayload(anim.to);
     if (!payload && hasFluidValue(anim.to)) {
-      toValues = toArray(getFluidValue(anim.to));
+      toValues = toArray$1(getFluidValue(anim.to));
     }
     anim.values.forEach((node2, i2) => {
       if (node2.done) return;
@@ -7217,7 +7217,7 @@ class SpringValue extends FrameValue {
     if (!hasAsyncTo) {
       if (started || hasFluidValue(prevTo)) {
         anim.values = node.getPayload();
-        anim.toValues = hasFluidValue(to2) ? null : goalType == AnimatedString ? [1] : toArray(goal);
+        anim.toValues = hasFluidValue(to2) ? null : goalType == AnimatedString ? [1] : toArray$1(goal);
       }
       if (anim.immediate != immediate) {
         anim.immediate = immediate;
@@ -7490,7 +7490,7 @@ class Controller2 {
       queue
     } = this;
     if (props) {
-      queue = toArray(props).map(createUpdate);
+      queue = toArray$1(props).map(createUpdate);
     } else {
       this.queue = [];
     }
@@ -7506,7 +7506,7 @@ class Controller2 {
     }
     if (keys) {
       const springs = this.springs;
-      each(toArray(keys), (key) => springs[key].stop(!!arg));
+      each(toArray$1(keys), (key) => springs[key].stop(!!arg));
     } else {
       stopAsync(this._state, this._lastAsyncId);
       this.each((spring) => spring.stop(!!arg));
@@ -7520,7 +7520,7 @@ class Controller2 {
       });
     } else {
       const springs = this.springs;
-      each(toArray(keys), (key) => springs[key].pause());
+      each(toArray$1(keys), (key) => springs[key].pause());
     }
     return this;
   }
@@ -7531,7 +7531,7 @@ class Controller2 {
       });
     } else {
       const springs = this.springs;
-      each(toArray(keys), (key) => springs[key].resume());
+      each(toArray$1(keys), (key) => springs[key].resume());
     }
     return this;
   }
@@ -7682,7 +7682,7 @@ async function flushUpdate(ctrl, props, isLoop) {
 function getSprings(ctrl, props) {
   const springs = _extends$1({}, ctrl.springs);
   if (props) {
-    each(toArray(props), (props2) => {
+    each(toArray$1(props), (props2) => {
       if (is.und(props2.keys)) {
         props2 = createUpdate(props2);
       }
@@ -7954,7 +7954,7 @@ class Interpolation extends FrameValue {
     }
   }
   _get() {
-    const inputs = is.arr(this.source) ? this.source.map(getFluidValue) : toArray(getFluidValue(this.source));
+    const inputs = is.arr(this.source) ? this.source.map(getFluidValue) : toArray$1(getFluidValue(this.source));
     return this.calc(...inputs);
   }
   _start() {
@@ -7973,7 +7973,7 @@ class Interpolation extends FrameValue {
   }
   _attach() {
     let priority2 = 1;
-    each(toArray(this.source), (source) => {
+    each(toArray$1(this.source), (source) => {
       if (hasFluidValue(source)) {
         addFluidObserver(source, this);
       }
@@ -7988,7 +7988,7 @@ class Interpolation extends FrameValue {
     this._start();
   }
   _detach() {
-    each(toArray(this.source), (source) => {
+    each(toArray$1(this.source), (source) => {
       if (hasFluidValue(source)) {
         removeFluidObserver(source, this);
       }
@@ -8007,7 +8007,7 @@ class Interpolation extends FrameValue {
     } else if (event.type == "idle") {
       this._active.delete(event.parent);
     } else if (event.type == "priority") {
-      this.priority = toArray(this.source).reduce((highest, parent) => Math.max(highest, (isFrameValue(parent) ? parent.priority : 0) + 1), 0);
+      this.priority = toArray$1(this.source).reduce((highest, parent) => Math.max(highest, (isFrameValue(parent) ? parent.priority : 0) + 1), 0);
     }
   }
 }
@@ -8169,7 +8169,7 @@ class AnimatedStyle extends AnimatedObject {
         delete style[key];
         if (is.und(value)) return;
         const unit = pxTransforms.test(key) ? "px" : degTransforms.test(key) ? "deg" : "";
-        inputs.push(toArray(value));
+        inputs.push(toArray$1(value));
         transforms.push(key === "rotate3d" ? ([x2, y2, z2, deg]) => [`rotate3d(${x2},${y2},${z2},${addUnit(deg, unit)})`, isValueIdentity(deg, 0)] : (input) => [`${key}(${input.map((v) => addUnit(v, unit)).join(",")})`, isValueIdentity(input, key.startsWith("scale") ? 1 : 0)]);
       }
     });
@@ -13701,6 +13701,25 @@ Schema.register = function register(type4, validator) {
 Schema.warning = warning;
 Schema.messages = messages;
 Schema.validators = validators;
+function merge(...objects) {
+  const result = Array.isArray(objects[0]) ? [] : {};
+  function mergeHelper(obj, path = []) {
+    for (const [key, value] of Object.entries(obj)) {
+      const newPath = [...path, key];
+      if (Array.isArray(value)) {
+        result[key] = [...value];
+      } else if (typeof value === "object" && value !== null) {
+        if (path.some((p2) => p2 === value)) continue;
+        if (!result[key]) result[key] = {};
+        mergeHelper(value, newPath);
+      } else {
+        result[key] = value;
+      }
+    }
+  }
+  objects.filter((obj) => !!obj).forEach((obj) => mergeHelper(obj));
+  return result;
+}
 const SECRET = "NUT_FORM_INTERNAL";
 class FormStore {
   constructor() {
@@ -13733,17 +13752,16 @@ class FormStore {
       });
       return fieldsValue;
     };
-    this.setInitialValues = (values, init) => {
+    this.setInitialValues = (initialValues, init) => {
+      this.initialValues = initialValues || {};
       if (init) {
-        this.initialValues = values;
-        this.store = values;
+        const nextStore = merge(initialValues, this.store);
+        this.updateStore(nextStore);
       }
     };
-    this.setFieldsValue = (newStore, needValidate = true) => {
-      this.store = {
-        ...this.store,
-        ...newStore
-      };
+    this.setFieldsValue = (newStore) => {
+      const nextStore = merge(this.store, newStore);
+      this.updateStore(nextStore);
       this.fieldEntities.forEach((entity) => {
         const { name } = entity.props;
         Object.keys(newStore).forEach((key) => {
@@ -13761,7 +13779,12 @@ class FormStore {
           item.entity.onStoreChange("update");
         }
       });
-      needValidate && this.validateFields();
+    };
+    this.setFieldValue = (name, value) => {
+      const store = {
+        [name]: value
+      };
+      this.setFieldsValue(store);
     };
     this.setCallback = (callback) => {
       this.callbacks = {
@@ -13769,46 +13792,55 @@ class FormStore {
         ...callback
       };
     };
-    this.validateFields = async (nameList) => {
+    this.validateEntities = async (entity, errs) => {
       var _a;
-      let filterEntitys = [];
-      const errs = [];
+      const { name, rules: rules2 = [] } = entity.props;
+      if (!name) {
+        console.warn("Form field missing name property");
+        return;
+      }
+      const descriptor = {};
+      if (rules2.length) {
+        if (rules2.length > 1) {
+          descriptor[name] = [];
+          rules2.forEach((v) => {
+            descriptor[name].push(v);
+          });
+        } else {
+          descriptor[name] = rules2[0];
+        }
+      }
+      const validator = new Schema(descriptor);
+      try {
+        await validator.validate({ [name]: (_a = this.store) == null ? void 0 : _a[name] });
+      } catch ({ errors }) {
+        if (errors) {
+          errs.push(...errors);
+          this.errors[name] = errors;
+        }
+      } finally {
+        if (!errs || errs.length === 0) {
+          this.errors[name] = [];
+        }
+      }
+      entity.onStoreChange("validate");
+    };
+    this.validateFields = async (nameList) => {
+      let filterEntities = [];
       this.errors.length = 0;
       if (!nameList || nameList.length === 0) {
-        filterEntitys = this.fieldEntities;
+        filterEntities = this.fieldEntities;
       } else {
-        filterEntitys = this.fieldEntities.filter(
+        filterEntities = this.fieldEntities.filter(
           ({ props: { name } }) => nameList.includes(name)
         );
       }
-      for (const entity of filterEntitys) {
-        const { name, rules: rules2 = [] } = entity.props;
-        const descriptor = {};
-        if (rules2.length) {
-          if (rules2.length > 1) {
-            descriptor[name] = [];
-            rules2.forEach((v) => {
-              descriptor[name].push(v);
-            });
-          } else {
-            descriptor[name] = rules2[0];
-          }
-        }
-        const validator = new Schema(descriptor);
-        try {
-          await validator.validate({ [name]: (_a = this.store) == null ? void 0 : _a[name] });
-        } catch ({ errors }) {
-          if (errors) {
-            errs.push(...errors);
-            this.errors[name] = errors;
-          }
-        } finally {
-          if (!errs || errs.length === 0) {
-            this.errors[name] = [];
-          }
-        }
-        entity.onStoreChange("validate");
-      }
+      const errs = [];
+      await Promise.all(
+        filterEntities.map(async (entity) => {
+          await this.validateEntities(entity, errs);
+        })
+      );
       return errs;
     };
     this.submit = async () => {
@@ -13822,7 +13854,8 @@ class FormStore {
     };
     this.resetFields = () => {
       this.errors.length = 0;
-      this.store = this.initialValues;
+      const nextStore = merge({}, this.initialValues);
+      this.updateStore(nextStore);
       this.fieldEntities.forEach((entity) => {
         entity.onStoreChange("reset");
       });
@@ -13857,6 +13890,7 @@ class FormStore {
         getFieldValue: this.getFieldValue,
         getFieldsValue: this.getFieldsValue,
         setFieldsValue: this.setFieldsValue,
+        setFieldValue: this.setFieldValue,
         resetFields: this.resetFields,
         validateFields: this.validateFields,
         submit: this.submit,
@@ -13871,6 +13905,9 @@ class FormStore {
       }
     };
   }
+  updateStore(nextStore) {
+    this.store = nextStore;
+  }
 }
 const useForm = (form) => {
   const formRef = useRef();
@@ -13888,7 +13925,9 @@ const defaultProps$X = {
   ...ComponentDefaults,
   labelPosition: "right",
   starPosition: "left",
+  disabled: false,
   divider: false,
+  validateTrigger: "onChange",
   onFinish: (values) => {
   },
   onFinishFailed: (values, errorFields) => {
@@ -13909,8 +13948,10 @@ const Form = React__default.forwardRef(
       children,
       initialValues,
       divider,
+      disabled,
       onFinish,
       onFinishFailed,
+      validateTrigger,
       labelPosition,
       starPosition,
       form
@@ -13957,7 +13998,13 @@ const Form = React__default.forwardRef(
           resetFields();
         }
       },
-      /* @__PURE__ */ React__default.createElement(Cell.Group, { divider }, /* @__PURE__ */ React__default.createElement(Context.Provider, { value: formInstance }, children), footer ? /* @__PURE__ */ React__default.createElement(Cell, { className: `${classPrefix2}-footer` }, footer) : null)
+      /* @__PURE__ */ React__default.createElement(Cell.Group, { divider }, /* @__PURE__ */ React__default.createElement(
+        Context.Provider,
+        {
+          value: { formInstance, labelPosition, disabled, validateTrigger }
+        },
+        children
+      ), footer ? /* @__PURE__ */ React__default.createElement(Cell, { className: `${classPrefix2}-footer` }, footer) : null)
     );
   }
 );
@@ -13971,6 +14018,12 @@ function isForwardRefComponent(component) {
     }
   ).$$typeof === component.type.$$typeof;
 }
+function toArray(value) {
+  if (value === void 0 || value === null) {
+    return [];
+  }
+  return Array.isArray(value) ? value : [value];
+}
 const defaultProps$W = {
   ...ComponentDefaults,
   required: false,
@@ -13978,7 +14031,6 @@ const defaultProps$W = {
   label: "",
   rules: [{ required: false, message: "" }],
   errorMessageAlign: "left",
-  validateTrigger: "onChange",
   shouldUpdate: false,
   noStyle: false
 };
@@ -13987,15 +14039,14 @@ const _FormItem = class _FormItem extends React__default.Component {
     super(props);
     this.getControlled = (children) => {
       var _a;
-      const { setFieldsValue, getFieldValue } = this.context;
-      const { dispatch } = this.context.getInternal(SECRET);
+      const { setFieldsValue, getFieldValue } = this.context.formInstance;
+      const { dispatch } = this.context.formInstance.getInternal(SECRET);
       const { name = "" } = this.props;
-      if ((_a = children == null ? void 0 : children.props) == null ? void 0 : _a.defaultValue) {
-        console.warn("通过 initialValue 设置初始值");
-      }
+      if ((_a = children == null ? void 0 : children.props) == null ? void 0 : _a.defaultValue) ;
       const fieldValue = getFieldValue(name);
       const controlled = {
         ...children.props,
+        className: children.props.className,
         [this.props.valuePropName || "value"]: fieldValue !== void 0 ? fieldValue : this.props.initialValue,
         [this.props.trigger || "onChange"]: (...args) => {
           const originOnChange = children.props[this.props.trigger || "onChange"];
@@ -14006,27 +14057,25 @@ const _FormItem = class _FormItem extends React__default.Component {
           if (this.props.getValueFromEvent) {
             next = this.props.getValueFromEvent(...args);
           }
-          setFieldsValue({ [name]: next }, false);
+          setFieldsValue({ [name]: next });
         }
       };
       const { validateTrigger } = this.props;
-      let validateTriggers = [this.props.trigger || "onChange"];
-      if (validateTrigger) {
-        validateTriggers = typeof validateTrigger === "string" ? [validateTrigger] : [...validateTrigger];
-        validateTriggers.forEach((trigger) => {
-          const originTrigger = controlled[trigger];
-          controlled[trigger] = (...args) => {
-            if (originTrigger) {
-              originTrigger(...args);
-            }
-            if (this.props.rules && this.props.rules.length) {
-              dispatch({
-                name: this.props.name
-              });
-            }
-          };
-        });
-      }
+      const mergedValidateTrigger = validateTrigger || this.context.validateTrigger;
+      const validateTriggers = toArray(mergedValidateTrigger);
+      validateTriggers.forEach((trigger) => {
+        const originTrigger = controlled[trigger];
+        controlled[trigger] = (...args) => {
+          if (originTrigger) {
+            originTrigger(...args);
+          }
+          if (this.props.rules && this.props.rules.length) {
+            dispatch({
+              name: this.props.name
+            });
+          }
+        };
+      });
       if (isForwardRefComponent(children)) {
         controlled.ref = (componentInstance) => {
           const originRef = children.ref;
@@ -14050,7 +14099,7 @@ const _FormItem = class _FormItem extends React__default.Component {
     };
     this.onStoreChange = (type4) => {
       if (type4 === "reset") {
-        this.context.errors[this.props.name] = [];
+        this.context.formInstance.errors[this.props.name] = [];
         this.refresh();
       } else {
         this.forceUpdate();
@@ -14071,27 +14120,40 @@ const _FormItem = class _FormItem extends React__default.Component {
         ...this.props
       };
       const requiredInRules = rules2 == null ? void 0 : rules2.some((rule) => rule.required);
-      const item = name ? this.context.errors[name] : [];
-      const { starPosition } = this.context;
-      const renderStar = (required4 || requiredInRules) && /* @__PURE__ */ React__default.createElement("i", { className: "required" });
-      const renderLabel = /* @__PURE__ */ React__default.createElement(React__default.Fragment, null, starPosition === "left" ? renderStar : null, label, starPosition === "right" ? renderStar : null);
+      const item = name ? this.context.formInstance.errors[name] : [];
+      const { starPosition } = this.context.formInstance;
+      const renderStar = (required4 || requiredInRules) && /* @__PURE__ */ React__default.createElement("div", { className: "nut-form-item-label-required required" }, "*");
+      const renderLabel = /* @__PURE__ */ React__default.createElement(React__default.Fragment, null, /* @__PURE__ */ React__default.createElement("span", { className: "nut-form-item-labeltxt" }, starPosition === "left" ? renderStar : null, label), starPosition === "right" ? renderStar : null);
       return /* @__PURE__ */ React__default.createElement(
         Cell,
         {
-          className: `nut-form-item ${className}`,
+          className: `${this.getClassNameWithDirection("nut-form-item")} ${className}`,
           style,
           align,
           onClick: (e) => this.props.onClick && this.props.onClick(e, this.componentRef)
         },
-        label ? /* @__PURE__ */ React__default.createElement("div", { className: "nut-cell-title nut-form-item-label" }, renderLabel) : null,
-        /* @__PURE__ */ React__default.createElement("div", { className: "nut-cell-value nut-form-item-body" }, /* @__PURE__ */ React__default.createElement("div", { className: "nut-form-item-body-slots" }, childNode), item && item.length > 0 && /* @__PURE__ */ React__default.createElement(
+        label ? /* @__PURE__ */ React__default.createElement(
+          "div",
+          {
+            className: `nut-cell-title ${this.getClassNameWithDirection("nut-form-item-label")}`
+          },
+          renderLabel
+        ) : null,
+        /* @__PURE__ */ React__default.createElement(
           "div",
           {
-            className: "nut-form-item-body-tips",
-            style: { textAlign: errorMessageAlign }
+            className: `nut-cell-value ${this.getClassNameWithDirection("nut-form-item-body")}`
           },
-          item[0].message
-        ))
+          /* @__PURE__ */ React__default.createElement("div", { className: "nut-form-item-body-slots" }, childNode),
+          item && item.length > 0 && /* @__PURE__ */ React__default.createElement(
+            "div",
+            {
+              className: "nut-form-item-body-tips",
+              style: { textAlign: errorMessageAlign }
+            },
+            item[0].message
+          )
+        )
       );
     };
     this.componentRef = React__default.createRef();
@@ -14100,14 +14162,14 @@ const _FormItem = class _FormItem extends React__default.Component {
     };
   }
   componentDidMount() {
-    const { store = {}, setInitialValues } = this.context.getInternal(SECRET);
+    const { store = {}, setInitialValues } = this.context.formInstance.getInternal(SECRET);
     if (this.props.initialValue && this.props.name && !Object.keys(store).includes(this.props.name)) {
       setInitialValues(
         { ...store, [this.props.name]: this.props.initialValue },
         true
       );
     }
-    const { registerField, registerUpdate } = this.context.getInternal(SECRET);
+    const { registerField, registerUpdate } = this.context.formInstance.getInternal(SECRET);
     this.cancelRegister = registerField(this);
     this.eventOff = registerUpdate(this, this.props.shouldUpdate);
   }
@@ -14119,6 +14181,12 @@ const _FormItem = class _FormItem extends React__default.Component {
       this.eventOff();
     }
   }
+  getClassNameWithDirection(className) {
+    if (className && this.context.labelPosition) {
+      return `${className} ${className}-${this.context.labelPosition}`;
+    }
+    return className;
+  }
   render() {
     const { children } = this.props;
     const child = Array.isArray(children) ? children[0] : children;
@@ -14129,9 +14197,9 @@ const _FormItem = class _FormItem extends React__default.Component {
         this.getControlled(child)
       );
     } else {
-      returnChildNode = child(this.context);
+      returnChildNode = child(this.context.formInstance);
     }
-    return /* @__PURE__ */ React__default.createElement(React__default.Fragment, { key: this.state.resetCount }, this.props.noStyle ? returnChildNode : this.renderLayout(returnChildNode));
+    return /* @__PURE__ */ React__default.createElement(React__default.Fragment, { key: this.state.resetCount }, /* @__PURE__ */ React__default.createElement("div", { className: this.context.disabled ? "nut-form-item-disabled" : "" }, this.props.noStyle ? returnChildNode : this.renderLayout(returnChildNode)));
   }
 };
 _FormItem.defaultProps = defaultProps$W;
@@ -16884,6 +16952,7 @@ const InternalUploader = (props, ref) => {
     }
   };
   const readFile = (files) => {
+    const results = [];
     files.forEach((file, index) => {
       var _a;
       const formData = new FormData();
@@ -16900,13 +16969,14 @@ const InternalUploader = (props, ref) => {
         const reader = new FileReader();
         reader.onload = (event) => {
           fileItem.url = event.target.result;
-          setFileList([...fileList, fileItem]);
+          results.push(fileItem);
         };
         reader.readAsDataURL(file);
       } else {
-        setFileList([...fileList, fileItem]);
+        results.push(fileItem);
       }
     });
+    setFileList([...fileList, ...results]);
   };
   const filterFiles = (files) => {
     const maximum = maxCount * 1;
@@ -17578,6 +17648,12 @@ const Drag = (props) => {
   );
 };
 Drag.displayName = "NutDrag";
+const getButtonType = (actions, index) => {
+  if (!actions || actions.length === 0) return "default";
+  const action = actions[index];
+  if (action.type) return action.type;
+  return actions.length > 1 && index === 0 ? "default" : "primary";
+};
 const defaultStatus = {
   empty: "https://storage.360buyimg.com/imgtools/30186cfda0-0d3eee40-c0ac-11ee-9382-9125782aa3b8.png",
   error: "https://storage.360buyimg.com/imgtools/f3278d0ebb-0ce360c0-c0ac-11ee-8375-193101bb1a46.png",
@@ -17641,10 +17717,13 @@ const Empty = (props) => {
           [`${classPrefix$e}-actions-right`]: actions.length === 1,
           [`${classPrefix$e}-actions-left`]: actions.length > 1 && index === 0
         }),
-        type: `${actions.length > 1 && index === 0 ? "default" : "primary"}`,
-        size: "small",
-        fill: "outline",
-        key: `action-${index}`
+        style: item.style,
+        type: getButtonType(actions, index),
+        size: item.size || "small",
+        fill: item.fill || "outline",
+        disabled: item.disabled || false,
+        key: `action-${index}`,
+        onClick: item.onClick || (() => void 0)
       },
       item == null ? void 0 : item.text
     );
@@ -20558,7 +20637,7 @@ const defaultProps$j = {
   }
 };
 const classPrefix$4 = `nut-video`;
-const Video = (props) => {
+const Video = React__default.forwardRef((props, ref) => {
   const {
     children,
     source,
@@ -20603,6 +20682,18 @@ const Video = (props) => {
       });
     }
   };
+  const pause = () => {
+    var _a;
+    (_a = rootRef == null ? void 0 : rootRef.current) == null ? void 0 : _a.pause();
+  };
+  const play = () => {
+    var _a;
+    (_a = rootRef == null ? void 0 : rootRef.current) == null ? void 0 : _a.play();
+  };
+  React__default.useImperativeHandle(ref, () => ({
+    pause,
+    play
+  }));
   return /* @__PURE__ */ React__default.createElement("div", { className: classes, ...restProps }, /* @__PURE__ */ React__default.createElement(
     "video",
     {
@@ -20618,7 +20709,7 @@ const Video = (props) => {
     /* @__PURE__ */ React__default.createElement("source", { src: source.src, type: source.type }),
     /* @__PURE__ */ React__default.createElement("track", { kind: "captions" })
   ));
-};
+});
 Video.displayName = "NutVideo";
 const defaultProps$i = {
   total: 3,