fix validation

build/blocks/library/view.asset.php

@@ -1 +1 @@
-<?php return array('dependencies' => array('@wordpress/interactivity'), 'version' => 'e5bdc4cc6b081b483c28', 'type' => 'module');
+<?php return array('dependencies' => array('@wordpress/interactivity'), 'version' => 'b6da6d7c67961392502d', 'type' => 'module');

formello.php

@@ -16,7 +16,7 @@
  * Plugin URI:        https://formello.net
  * Description:       Lightweight Gutenberg contact form builder, blazingly fast with no external dependencies and ReCaptcha support.
  * Requires Plugins:  gutenberg
- * Version:           2.6.0
+ * Version:           2.6.1
  * Author:            Francesco Pepe
  * Author URI:        https://www.francescopepe.com/
  * License:           GPL-2.0+

readme.txt

@@ -4,7 +4,7 @@ Donate link: 	   https://formello.net
 Tags:              form, contact form, form block, gutenberg form, block
 Requires at least: 6.6
 Tested up to:      6.7
-Stable tag:        2.6.0
+Stable tag:        2.6.1
 Requires PHP:      7.0
 License:           GPL-2.0-or-later
 License URI:       https://www.gnu.org/licenses/gpl-2.0.html
@@ -130,6 +130,9 @@ Yes, you can insert Formello forms using a shortcode.
 
 == Changelog ==
 
+= 2.6.1 =
+* Fix validation
+
 = 2.6.0 =
 * Fix textarea new line
 * Update dataviews

src/blocks/library/view.js

@@ -11,6 +11,10 @@ import { config as jsConfig } from './config';
 
 const toggleInputError = () => {
 	const { ref } = getElement();
+	const context = getContext();
+	if ( ! ref.validity.valid ) {
+		console.log( ref.validity, ref );
+	}
 	let error = ref.parentNode.querySelector( '.error-message' );
 	if ( ! error ) {
 		const checked = ref
@@ -37,7 +41,15 @@ const toggleInputError = () => {
 			.closest( '.wp-block-formello-multichoices' )
 			.querySelector( '.error-message' );
 	}
-	error.innerHTML = 'dasd asdasd';
+
+	if ( ref.validity.typeMismatch || ref.validity.badInput ) {
+		error.innerHTML = context.messages.patternMismatch[ ref.type ];
+	}
+	if ( ref.validity.valueMissing ) {
+		error.innerHTML = context.messages.missingValue.hasOwnProperty( ref.type )
+			? context.messages.missingValue[ ref.type ]
+			: context.messages.missingValue.default;
+	}
 };
 
 const showLoading = ( e, force ) => {
@@ -166,23 +178,27 @@ const { state } = store( 'formello', {
 			e.stopPropagation();
 
 			const { ref } = getElement();
+			const context = getContext();
 
-			const isFormValid = ref.checkValidity();
+			if ( context.enableJsValidation ) {
+				const isFormValid = ref.checkValidity();
+				if ( ! isFormValid ) {
+					// Set the focus to the first invalid input.
+					const firstInvalidInputEl = ref.querySelector(
+						'input:invalid, select:invalid'
+					);
+					firstInvalidInputEl?.scrollIntoView( {
+						behavior: 'smooth',
+						block: 'end',
+						inline: 'nearest',
+					} );
+					firstInvalidInputEl?.focus();
 
-			if ( isFormValid ) {
-				formSubmit( e );
+					return;
+				}
 			}
 
-			// Set the focus to the first invalid input.
-			const firstInvalidInputEl = ref.querySelector(
-				'input:invalid, select:invalid'
-			);
-			firstInvalidInputEl?.scrollIntoView( {
-				behavior: 'smooth',
-				block: 'end',
-				inline: 'nearest',
-			} );
-			firstInvalidInputEl?.focus();
+			formSubmit( e );
 		},
 		setOutput: () => {
 			const { ref } = getElement();
@@ -191,14 +207,18 @@ const { state } = store( 'formello', {
 			}
 		},
 		validateInput: () => {
-			toggleInputError();
+			const context = getContext();
+			if ( context.enableJsValidation ) {
+				toggleInputError();
+			}
 		},
 	},
 	callbacks: {
 		init: () => {
 			const context = getContext();
 
 			const config = getConfig();
+
 			context.messages = {
 				...jsConfig.bouncer.messages,
 				...config.settings.messages,