@rainbow-oh/yee-c 0.4.5 → 0.5.0

package/dist/cjs/Dialog/demo/basic.js

@@ -51,7 +51,7 @@ var basic_default = () => {
       onCancel: () => {
         setOpen(false);
       },
-      onConfirm: () => form.submit()
+      onConfirm: () => void form.submit()
     },
     /* @__PURE__ */ import_react.default.createElement(
       import_yee_c.Form,

package/dist/cjs/Dialog/dialog.js

@@ -162,7 +162,7 @@ var Dialog = (baseprops) => {
     [`${prefixCls}-fullscreen`]: fullscreen
   });
   const renderFooter = () => {
-    if (footer === false) {
+    if (footer === false || footer === null) {
       return null;
     }
     if (footer === true || footer === void 0) {

package/dist/cjs/Field/demo/validation.js

@@ -25,6 +25,26 @@ var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__ge
   mod
 ));
 var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+var __async = (__this, __arguments, generator) => {
+  return new Promise((resolve, reject) => {
+    var fulfilled = (value) => {
+      try {
+        step(generator.next(value));
+      } catch (e) {
+        reject(e);
+      }
+    };
+    var rejected = (value) => {
+      try {
+        step(generator.throw(value));
+      } catch (e) {
+        reject(e);
+      }
+    };
+    var step = (x) => x.done ? resolve(x.value) : Promise.resolve(x.value).then(fulfilled, rejected);
+    step((generator = generator.apply(__this, __arguments)).next());
+  });
+};
 
 // src/Field/demo/validation.tsx
 var validation_exports = {};
@@ -39,15 +59,15 @@ var validation_default = () => {
   (0, import_react.useLayoutEffect)(() => {
     createForm("validationForm");
   }, []);
-  const handleSubmit = () => {
+  const handleSubmit = () => __async(void 0, null, function* () {
     const form = getForm("validationForm");
     console.log("form: ", form);
-    const errors = form == null ? void 0 : form.submit();
+    const errors = yield form == null ? void 0 : form.submit();
     console.log("errors: ", errors);
     if (errors && errors.length === 0) {
       console.log("Submit success:", form == null ? void 0 : form.getFieldsValue());
     }
-  };
+  });
   return /* @__PURE__ */ import_react.default.createElement("div", { style: { maxWidth: 400 } }, /* @__PURE__ */ import_react.default.createElement(
     import_yee_c.Field,
     {

package/dist/cjs/Field/field.js

@@ -98,7 +98,7 @@ var Field = (props) => {
         forceUpdate();
       },
       onBlur: (event) => {
-        validateField == null ? void 0 : validateField(name, "onBlur");
+        void (validateField == null ? void 0 : validateField(name, "onBlur"));
         if (children2.props.onBlur) {
           children2.props.onBlur(event);
         }

package/dist/cjs/Form/Field.js

@@ -171,10 +171,7 @@ var Field = (props) => {
       },
       onBlur: (event) => {
         var _a2;
-        const err = validateField == null ? void 0 : validateField(normalizedName, "onBlur");
-        if (err.length) {
-          forceUpdate();
-        }
+        void (validateField == null ? void 0 : validateField(normalizedName, "onBlur"));
         (_a2 = props2 == null ? void 0 : props2.onBlur) == null ? void 0 : _a2.call(props2, event);
       }
     });

package/dist/cjs/Form/Form.js

@@ -128,7 +128,7 @@ var Form = (baseprops) => {
       onSubmit: (e) => {
         e.preventDefault();
         e.stopPropagation();
-        formInstance.submit();
+        void formInstance.submit();
       },
       onReset: (e) => {
         e.preventDefault();

package/dist/cjs/Form/Group.js

@@ -25,6 +25,26 @@ var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__ge
   mod
 ));
 var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+var __async = (__this, __arguments, generator) => {
+  return new Promise((resolve, reject) => {
+    var fulfilled = (value) => {
+      try {
+        step(generator.next(value));
+      } catch (e) {
+        reject(e);
+      }
+    };
+    var rejected = (value) => {
+      try {
+        step(generator.throw(value));
+      } catch (e) {
+        reject(e);
+      }
+    };
+    var step = (x) => x.done ? resolve(x.value) : Promise.resolve(x.value).then(fulfilled, rejected);
+    step((generator = generator.apply(__this, __arguments)).next());
+  });
+};
 
 // src/Form/Group.tsx
 var Group_exports = {};
@@ -36,6 +56,7 @@ var import_clsx = __toESM(require("clsx"));
 var import_react = require("motion/react");
 var import_react2 = __toESM(require("react"));
 var import_Grid = __toESM(require("../Grid"));
+var import_validate = require("./utils/validate");
 var import_FieldContext = __toESM(require("./FieldContext"));
 var import_FormContext = __toESM(require("./FormContext"));
 var Group = (props) => {
@@ -53,7 +74,8 @@ var Group = (props) => {
   }, [children]);
   const touchedRef = (0, import_react2.useRef)(false);
   const [, forceValidate] = (0, import_react2.useReducer)((x) => x + 1, 0);
-  const validate = (force) => {
+  const validate = (force) => __async(void 0, null, function* () {
+    var _a2, _b;
     if (!required && (!rules || rules.length === 0))
       return [];
     if (!force && !touchedRef.current)
@@ -77,47 +99,47 @@ var Group = (props) => {
       }
     }
     if (rules) {
-      rules.forEach((rule) => {
+      for (const rule of rules) {
         if (rule.validator) {
-          const passed = rule.validator(values);
-          if (!passed) {
+          const result = yield (0, import_validate.runValidator)(rule.validator, values);
+          if (!result.passed) {
             errors2.push({
               name: childNames,
               status: "error",
               value: values,
-              message: rule.message || ""
+              message: (_b = (_a2 = result.message) != null ? _a2 : rule.message) != null ? _b : ""
             });
           }
         }
-      });
+      }
     }
     return errors2;
-  };
+  });
   const [errors, setErrors] = (0, import_react2.useReducer)(
     (prev, next) => next,
     []
   );
-  const runValidation = () => {
-    const result = validate(false);
+  const runValidation = () => __async(void 0, null, function* () {
+    const result = yield validate(false);
     setErrors(result);
-  };
+  });
   (0, import_react2.useEffect)(() => {
     const unsubscribes = childNames.map(
       (name) => formInstance.subscribe(name, () => {
         touchedRef.current = true;
-        runValidation();
+        void runValidation();
       })
     );
     return () => unsubscribes.forEach((fn) => fn());
   }, [childNames, formInstance]);
   (0, import_react2.useEffect)(() => {
     const unregister = formInstance.registerGroupEntity(groupId, {
-      validate: (force) => {
-        const result = validate(force);
+      validate: (force) => __async(void 0, null, function* () {
+        const result = yield validate(force);
         setErrors(result);
         forceUpdate();
         return result;
-      },
+      }),
       reset: () => {
         touchedRef.current = false;
         setErrors([]);

package/dist/cjs/Form/List.js

@@ -25,6 +25,26 @@ var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__ge
   mod
 ));
 var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+var __async = (__this, __arguments, generator) => {
+  return new Promise((resolve, reject) => {
+    var fulfilled = (value) => {
+      try {
+        step(generator.next(value));
+      } catch (e) {
+        reject(e);
+      }
+    };
+    var rejected = (value) => {
+      try {
+        step(generator.throw(value));
+      } catch (e) {
+        reject(e);
+      }
+    };
+    var step = (x) => x.done ? resolve(x.value) : Promise.resolve(x.value).then(fulfilled, rejected);
+    step((generator = generator.apply(__this, __arguments)).next());
+  });
+};
 
 // src/Form/List.tsx
 var List_exports = {};
@@ -75,7 +95,7 @@ var List = ({
     return Array.isArray(value) ? value : [];
   };
   const operations = (0, import_react.useMemo)(() => {
-    const add = (defaultValue, insertIndex) => {
+    const add = (defaultValue, insertIndex) => __async(void 0, null, function* () {
       const currentValue = getListValue();
       const pathStr = prefixName.join(".");
       const fieldPaths = [];
@@ -87,7 +107,7 @@ var List = ({
           });
         }
       });
-      const errors = validateFields == null ? void 0 : validateFields(fieldPaths);
+      const errors = yield validateFields == null ? void 0 : validateFields(fieldPaths);
       if (errors && errors.length > 0) {
         forceUpdate((prev) => prev + 1);
         return;
@@ -114,7 +134,7 @@ var List = ({
       }
       keyManager.id += 1;
       forceUpdate((prev) => prev + 1);
-    };
+    });
     const remove = (index) => {
       const indices = Array.isArray(index) ? index : [index];
       const indexSet = new Set(indices);

package/dist/cjs/Form/demo/async-validate.d.ts

@@ -0,0 +1,3 @@
+import React from 'react';
+declare const _default: () => React.JSX.Element;
+export default _default;

package/dist/cjs/Form/demo/async-validate.js

@@ -0,0 +1,108 @@
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  // If the importer is in node compatibility mode or this is not an ESM
+  // file that has been converted to a CommonJS file using a Babel-
+  // compatible transform (i.e. "__esModule" has not been set), then set
+  // "default" to the CommonJS "module.exports" for node compatibility.
+  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
+  mod
+));
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+var __async = (__this, __arguments, generator) => {
+  return new Promise((resolve, reject) => {
+    var fulfilled = (value) => {
+      try {
+        step(generator.next(value));
+      } catch (e) {
+        reject(e);
+      }
+    };
+    var rejected = (value) => {
+      try {
+        step(generator.throw(value));
+      } catch (e) {
+        reject(e);
+      }
+    };
+    var step = (x) => x.done ? resolve(x.value) : Promise.resolve(x.value).then(fulfilled, rejected);
+    step((generator = generator.apply(__this, __arguments)).next());
+  });
+};
+
+// src/Form/demo/async-validate.tsx
+var async_validate_exports = {};
+__export(async_validate_exports, {
+  default: () => async_validate_default
+});
+module.exports = __toCommonJS(async_validate_exports);
+var import_yee_c = require("../..");
+var import_react = __toESM(require("react"));
+var TAKEN_USERNAMES = /* @__PURE__ */ new Set(["admin", "root", "test"]);
+function checkUsernameUnique(username) {
+  return new Promise((resolve) => {
+    setTimeout(() => resolve(!TAKEN_USERNAMES.has(username)), 600);
+  });
+}
+var async_validate_default = () => {
+  const [form] = import_yee_c.Form.useForm();
+  const onFinish = (values) => {
+    console.log("Received values:", values);
+  };
+  const onFinishFailed = (errorInfo) => {
+    console.log("Failed:", errorInfo);
+  };
+  return /* @__PURE__ */ import_react.default.createElement(import_yee_c.Form, { form, onFinish, onFinishFailed }, /* @__PURE__ */ import_react.default.createElement(import_yee_c.Grid, null, /* @__PURE__ */ import_react.default.createElement(
+    import_yee_c.Form.Field,
+    {
+      name: "username",
+      label: "Username",
+      rules: [
+        { required: true, message: "Please input your username!" },
+        {
+          // Async validator: resolve to pass, throw / reject to fail.
+          // The thrown Error's message overrides rule.message.
+          validator: (value) => __async(void 0, null, function* () {
+            const isUnique = yield checkUsernameUnique(String(value));
+            if (!isUnique) {
+              throw new Error("This username is already taken");
+            }
+          }),
+          // Validate on blur so we don't hit the "API" on every keystroke.
+          validateTrigger: "onBlur"
+        }
+      ]
+    },
+    /* @__PURE__ */ import_react.default.createElement(import_yee_c.Input, { placeholder: "Try admin / root / test (already taken)" })
+  ), /* @__PURE__ */ import_react.default.createElement(
+    import_yee_c.Form.Field,
+    {
+      name: "email",
+      label: "Email",
+      rules: [
+        { required: true, message: "Please input your email!" },
+        {
+          regexp: /^[\w.+-]+@[\w-]+\.[\w.-]+$/,
+          message: "Please enter a valid email!"
+        }
+      ]
+    },
+    /* @__PURE__ */ import_react.default.createElement(import_yee_c.Input, { placeholder: "Please input your email" })
+  )), /* @__PURE__ */ import_react.default.createElement(import_yee_c.Space, null, /* @__PURE__ */ import_react.default.createElement(import_yee_c.Button, { type: "primary", htmlType: "submit" }, "Submit"), /* @__PURE__ */ import_react.default.createElement(import_yee_c.Button, { htmlType: "reset" }, "Reset")));
+};

package/dist/cjs/Form/demo/virtual.js

@@ -72,7 +72,7 @@ function Virtual() {
       type: "primary",
       onClick: () => {
         const form = getForm("form");
-        form.submit();
+        void form.submit();
       }
     },
     "Submit"

package/dist/cjs/Form/form-store.d.ts

@@ -26,13 +26,13 @@ export declare class FormStore {
     setFieldsValue: (newStore: Store, trigger?: TRIGGER) => void;
     resetFields: (name?: Name[]) => void;
     clearFields: (name?: Name[]) => void;
-    validateField: (name: Name, trigger?: TRIGGER) => ValidateMessage[];
-    validateFields: (names?: string[], trigger?: TRIGGER) => ValidateMessage[];
+    validateField: (name: Name, trigger?: TRIGGER) => Promise<ValidateMessage[]>;
+    validateFields: (names?: string[], trigger?: TRIGGER) => Promise<ValidateMessage[]>;
     refreshField: (newStore?: Store) => void;
     subscribe: (namePath?: NamePath, callback?: () => void) => (() => void);
     private notifyWatchers;
     registerGroupEntity: (id: string, entity: GroupEntity) => (() => void);
-    validateGroups: (force?: boolean) => ValidateMessage[];
+    validateGroups: (force?: boolean) => Promise<ValidateMessage[]>;
     setCallbacks: (callbacks: Callbacks) => void;
     getCallbacks: () => Callbacks<any>;
     /**
@@ -53,6 +53,6 @@ export declare class FormStore {
      */
     private setListValue;
     registerFieldEntities: (entity: FieldEntity) => () => void;
-    submit: () => ValidateMessage[];
+    submit: () => Promise<ValidateMessage[]>;
     getForm(): FormInstance;
 }

package/dist/cjs/Form/form-store.js

@@ -42,6 +42,26 @@ var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__ge
   mod
 ));
 var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+var __async = (__this, __arguments, generator) => {
+  return new Promise((resolve, reject) => {
+    var fulfilled = (value) => {
+      try {
+        step(generator.next(value));
+      } catch (e) {
+        reject(e);
+      }
+    };
+    var rejected = (value) => {
+      try {
+        step(generator.throw(value));
+      } catch (e) {
+        reject(e);
+      }
+    };
+    var step = (x) => x.done ? resolve(x.value) : Promise.resolve(x.value).then(fulfilled, rejected);
+    step((generator = generator.apply(__this, __arguments)).next());
+  });
+};
 
 // src/Form/form-store.ts
 var form_store_exports = {};
@@ -151,7 +171,7 @@ var FormStore = class {
         });
       }
       if (trigger === "onChange" || trigger === "onBlur" || trigger === "onSubmit") {
-        this.validateFields(Object.keys(newStore), trigger);
+        void this.validateFields(Object.keys(newStore), trigger);
       }
       this.refreshField(newStore);
     };
@@ -197,7 +217,8 @@ var FormStore = class {
       }, {});
       this.setFieldsValue(clearStore, "clear");
     };
-    this.validateField = (name, trigger) => {
+    this.validateField = (name, trigger) => __async(this, null, function* () {
+      var _a;
       const entity = this.fieldMap.get(name);
       if (!entity) {
         return [];
@@ -225,27 +246,32 @@ var FormStore = class {
         });
       }
       const value = this.getFieldValue(name);
-      mergedRules.forEach((rule) => {
-        const mark = (0, import_validate.default)(rule, value);
-        if (name && !mark) {
-          err.push(__spreadValues({
+      for (const rule of mergedRules) {
+        const result = yield (0, import_validate.default)(rule, value);
+        if (name && !result.passed) {
+          err.push(__spreadProps(__spreadValues({}, rule), {
             name,
             status: "error",
-            value
-          }, rule));
+            value,
+            message: (_a = result.message) != null ? _a : rule.message
+          }));
         }
-      });
+      }
       if (err.length > 0) {
         this.validateMessages.set(name, err);
       } else if (this.validateMessages.has(name)) {
         this.validateMessages.delete(name);
       }
+      entity == null ? void 0 : entity.onStoreChange();
       return err;
-    };
-    this.validateFields = (names = Array.from(this.fieldMap.keys()), trigger) => {
+    });
+    this.validateFields = (..._0) => __async(this, [..._0], function* (names = Array.from(this.fieldMap.keys()), trigger) {
+      const results = yield Promise.all(
+        names.map((name) => this.validateField(name, trigger))
+      );
       let err = [];
-      names.forEach((name) => {
-        const messages = this.validateField(name, trigger);
+      names.forEach((name, index) => {
+        const messages = results[index];
         err = err.concat(messages);
         if (messages.length > 0) {
           this.validateMessages.set(name, messages);
@@ -254,7 +280,7 @@ var FormStore = class {
         }
       });
       return err;
-    };
+    });
     this.refreshField = (newStore) => {
       if (newStore) {
         const keys = Object.keys(newStore);
@@ -301,13 +327,17 @@ var FormStore = class {
         this.groupEntities.delete(id);
       };
     };
-    this.validateGroups = (force = false) => {
-      let err = [];
-      this.groupEntities.forEach((entity) => {
-        err = err.concat(entity.validate(force));
-      });
-      return err;
-    };
+    this.validateGroups = (force = false) => __async(this, null, function* () {
+      const results = yield Promise.all(
+        Array.from(this.groupEntities.values()).map(
+          (entity) => entity.validate(force)
+        )
+      );
+      return results.reduce(
+        (acc, messages) => acc.concat(messages),
+        []
+      );
+    });
     this.setCallbacks = (callbacks) => {
       this.callbacks = __spreadValues(__spreadValues({}, this.callbacks), callbacks);
     };
@@ -431,10 +461,10 @@ var FormStore = class {
         this.fieldMap.delete(normalizedName);
       };
     };
-    this.submit = () => {
+    this.submit = () => __async(this, null, function* () {
       const { onFinish, onFinishFailed } = this.callbacks;
-      const fieldErrors = this.validateFields();
-      const groupErrors = this.validateGroups(true);
+      const fieldErrors = yield this.validateFields();
+      const groupErrors = yield this.validateGroups(true);
       const allErrors = [...fieldErrors, ...groupErrors];
       if (allErrors.length === 0) {
         onFinish == null ? void 0 : onFinish(this.getFieldsValue());
@@ -443,7 +473,7 @@ var FormStore = class {
       }
       this.refreshField();
       return allErrors;
-    };
+    });
   }
   // Set default validation message
   setDefaultValidateMessage(message) {

package/dist/cjs/Form/interface.d.ts

@@ -103,7 +103,7 @@ export interface FormInstance<Values = any> {
     /**
      * Submit form
      */
-    submit: () => ValidateMessage[];
+    submit: () => Promise<ValidateMessage[]>;
     /**
      * Get all field values
      */
@@ -127,7 +127,7 @@ export interface FormInstance<Values = any> {
     /**
      * Validate field
      */
-    validateField: (name: Name, trigger?: 'onChange' | 'onBlur') => ValidateMessage[];
+    validateField: (name: Name, trigger?: 'onChange' | 'onBlur') => Promise<ValidateMessage[]>;
     /**
      * Get callback functions
      */
@@ -139,7 +139,7 @@ export interface FormInstance<Values = any> {
     /**
      * Validate fields and get error messages
      */
-    validateFields: (names?: Name[], trigger?: TRIGGER) => ValidateMessage[];
+    validateFields: (names?: Name[], trigger?: TRIGGER) => Promise<ValidateMessage[]>;
     /**
      * Initialize form - mainly used to set initial values and callbacks
      */
@@ -214,9 +214,12 @@ export type Rule = {
      */
     message?: string;
     /**
-     * Custom validation function, returns true for pass, false or throw for fail
+     * Custom validation function. Supports sync and async:
+     *  - sync:  return true/undefined to pass, return false or throw to fail
+     *  - async: return a Promise (resolve to pass, reject/throw to fail)
+     * When throwing/rejecting with an Error, its message overrides rule.message.
      */
-    validator?: (value: unknown) => boolean;
+    validator?: (value: unknown) => boolean | void | Promise<boolean | void>;
     /**
      * Validation trigger timing
      */
@@ -314,7 +317,7 @@ export type FormListField<T = any> = {
     value: T;
 };
 export type FormListOperation = {
-    add: (defaultValue?: any, insertIndex?: number) => void;
+    add: (defaultValue?: any, insertIndex?: number) => void | Promise<void>;
     remove: (index: number | number[]) => void;
     move: (from: number, to: number) => void;
 };
@@ -357,6 +360,6 @@ export type FieldGroupProps = {
     className?: string;
 };
 export interface GroupEntity {
-    validate: (force: boolean) => ValidateMessage[];
+    validate: (force: boolean) => Promise<ValidateMessage[]>;
     reset: () => void;
 }

package/dist/cjs/Form/utils/validate.d.ts

@@ -1,3 +1,24 @@
-import { Rule } from '../interface';
-declare function validate(rule: Rule, value: unknown): boolean;
+import type { Rule } from '../interface';
+export interface ValidateResult {
+    passed: boolean;
+    message?: string;
+}
+/**
+ * Run a custom validator, dispatching between sync and async at runtime.
+ *
+ * Supports all of the following shapes (backwards compatible):
+ *  - sync `return true` / `return undefined` → pass
+ *  - sync `return false`                    → fail (use rule.message)
+ *  - sync `throw new Error(msg)`            → fail (use msg)
+ *  - async `return Promise.resolve()`       → pass
+ *  - async `return Promise.resolve(false)`  → fail (use rule.message)
+ *  - async `throw` / `return Promise.reject(new Error(msg))` → fail (use msg)
+ */
+export declare function runValidator(validator: NonNullable<Rule['validator']>, value: unknown): Promise<ValidateResult>;
+/**
+ * Validate a single rule against a value.
+ * Returns { passed, message? }. Sync rules short-circuit; the custom validator
+ * is awaited so async validators are supported.
+ */
+declare function validate(rule: Rule, value: unknown): Promise<ValidateResult>;
 export default validate;