@laser-ui/components 1.5.0 → 1.5.1

package/CHANGELOG.md

@@ -2,6 +2,12 @@
 
 All notable changes to this project will be documented in this file. See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## [1.5.1](https://github.com/laser-ui/laser-ui/compare/v1.5.0...v1.5.1) (2024-11-01)
+
+### Bug Fixes
+
+- **components:** fix form run async validator ([82010e8](https://github.com/laser-ui/laser-ui/commit/82010e83ad8c4de021a3bda9f1a552564ac06c54))
+
 # [1.5.0](https://github.com/laser-ui/laser-ui/compare/v1.4.0...v1.5.0) (2024-10-15)
 
 ### Features

package/form/FormItem.js

@@ -6,7 +6,7 @@ import CheckCircleFilled from '@material-design-icons/svg/filled/check_circle.sv
 import ErrorFilled from '@material-design-icons/svg/filled/error.svg?react';
 import HelpOutlineOutlined from '@material-design-icons/svg/outlined/help_outline.svg?react';
 import { isBoolean, isFunction, isNull, isNumber, isString, isUndefined } from 'lodash';
-import { useContext, useId, useRef } from 'react';
+import { useContext, useEffect, useId, useRef } from 'react';
 import { FormError } from './internal/FormError';
 import { Validators } from './model/validators';
 import { CLASSES, FormContext, FormGroupContext } from './vars';
@@ -41,7 +41,9 @@ export function FormItem(props) {
             if (isNull(formControl)) {
                 throw new Error(`Cant find '${controlName}', please check if name exists!`);
             }
-            formControl._emitChange = forceUpdate;
+            formControl._emitChange = () => {
+                formControl._emitChange = true;
+            };
             obj[controlName] = {
                 control: formControl,
                 invalid: false,
@@ -52,6 +54,24 @@ export function FormItem(props) {
         });
         return obj;
     })();
+    useEffect(() => {
+        const clear = [];
+        for (const { control } of Object.values(formControlProviders)) {
+            if (control._emitChange === true) {
+                forceUpdate();
+            }
+            control._emitChange = forceUpdate;
+            clear.push(() => {
+                // eslint-disable-next-line @typescript-eslint/no-empty-function
+                control._emitChange = () => { };
+            });
+        }
+        return () => {
+            for (const cb of clear) {
+                cb();
+            }
+        };
+    }, []);
     const required = (() => {
         if (isBoolean(requiredProp)) {
             return requiredProp;

package/form/hooks.js

@@ -1,6 +1,6 @@
 import { useEventCallback, useForceUpdate, useIsomorphicLayoutEffect } from '@laser-ui/hooks';
 import { isString } from 'lodash';
-import { useRef, useState } from 'react';
+import { useEffect, useRef, useState } from 'react';
 export function useForm(initForm, deps) {
     const forceUpdate = useForceUpdate();
     const emitChange = useEventCallback((control) => {
@@ -39,7 +39,9 @@ export function useForm(initForm, deps) {
     });
     const [form, setForm] = useState(() => {
         const form = initForm();
-        form._emitChange = emitChange;
+        form._emitChange = () => {
+            form._emitChange = true;
+        };
         return form;
     });
     const previousDeps = useRef([]);
@@ -55,5 +57,15 @@ export function useForm(initForm, deps) {
         }
         forceUpdate();
     });
+    useEffect(() => {
+        if (form._emitChange === true) {
+            forceUpdate();
+        }
+        form._emitChange = emitChange;
+        return () => {
+            // eslint-disable-next-line @typescript-eslint/no-empty-function
+            form._emitChange = () => { };
+        };
+    }, []);
     return [form, updateForm];
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@laser-ui/components",
-  "version": "1.5.0",
+  "version": "1.5.1",
   "description": "React components.",
   "keywords": [
     "ui",
@@ -40,5 +40,5 @@
     "access": "public",
     "directory": "../../dist/libs/components"
   },
-  "gitHead": "316da1ed34c626ca27819993998c0a745455d0b4"
+  "gitHead": "4867e61f312f16adc087c0a4ed0c3b9bdbf83afe"
 }