How to use the uno-react.ValidatorForm.addValidationRule function in uno-react

},
        );
    };

    const onCloseDialog = () => {
        setDialog(false);
        setReset(true);
    };

    const marginButton = recaptcha.siteKey && recaptcha.siteKey !== '' ? '25px 0 0 180px' : '100px 0 0 180px';

    ValidatorForm.addValidationRule('isUserName', (value: string) =>
        new RegExp(validationRegex.usernameRegex).test(value),
    );

    ValidatorForm.addValidationRule('isUserEmail', (value: string) =>
        new RegExp(validationRegex.emailRegex).test(value),
    );

    ValidatorForm.addValidationRule('isPasswordMatch', (value: string, comparedValue: any) => value === comparedValue);

    return (
        <>

const onCloseDialog = () => {
        setDialog(false);
        setReset(true);
    };

    const marginButton = recaptcha.siteKey && recaptcha.siteKey !== '' ? '25px 0 0 180px' : '100px 0 0 180px';

    ValidatorForm.addValidationRule('isUserName', (value: string) =>
        new RegExp(validationRegex.usernameRegex).test(value),
    );

    ValidatorForm.addValidationRule('isUserEmail', (value: string) =>
        new RegExp(validationRegex.emailRegex).test(value),
    );

    ValidatorForm.addValidationRule('isPasswordMatch', (value: string, comparedValue: any) => value === comparedValue);

    return (
        <>

return;
                }
                setDialog(true);
                setDisabled(false);
            },
        );
    };

    const onCloseDialog = () => {
        setDialog(false);
        setReset(true);
    };

    const marginButton = recaptcha.siteKey && recaptcha.siteKey !== '' ? '25px 0 0 180px' : '100px 0 0 180px';

    ValidatorForm.addValidationRule('isUserName', (value: string) =>
        new RegExp(validationRegex.usernameRegex).test(value),
    );

    ValidatorForm.addValidationRule('isUserEmail', (value: string) =>
        new RegExp(validationRegex.emailRegex).test(value),
    );

    ValidatorForm.addValidationRule('isPasswordMatch', (value: string, comparedValue: any) => value === comparedValue);

    return (
        <>

const onCancel = () => setOpen(false);
    const onOpen = () => setOpen(true);

    const changeNotes = (event: any) => setState({
        ...state,
        Comments: event.target.value,
    });

    const handleSubmit = () => {
        alert(`Hi, this is the comment: ${state.Comments}`);
        onCancel();
    };

    const challengePassword = (password: string) => password.length > 3;
    ValidatorForm.addValidationRule('passwordChallenging', (value: string) => challengePassword(value));

    const Actions: React.FunctionComponent = () => (
        
            
                <button color="default">
                    Cancel</button>