@eagami/ui 5.71.1 → 5.71.2

package/README.md

@@ -78,6 +78,7 @@ Everything else is a CSS custom property you can override. See [Design tokens](h
 `showErrorsOn` sets when form components show a validation error:
 
 - `'change'` (the default): once the user changes the field and leaves it, or submits the form. A field the user tabs past stays quiet, and a new error waits until focus leaves the field.
+- `'blur'`: as soon as the user leaves the field, even unchanged, while a new error still waits until focus leaves the field.
 - `'touch'`: as soon as the user leaves the field, even unchanged, and live while they edit it after that.
 
 Set it app-wide with `forms`, or on a single field with the `showErrorsOn` input every form component takes:

package/fesm2022/eagami-ui.mjs

@@ -5570,7 +5570,7 @@ function controlErrorStateFrom(control, config) {
 	const destroyRef = inject(DestroyRef);
 	const host = inject(ElementRef, { optional: true });
 	const formsConfig = inject(EAGAMI_FORMS_CONFIG);
-	const showOnTouch = computed(() => (config.showErrorsOn?.() ?? formsConfig.showErrorsOn ?? "change") === "touch", ...ngDevMode ? [{ debugName: "showOnTouch" }] : /* istanbul ignore next */ []);
+	const showErrorsOn = computed(() => config.showErrorsOn?.() ?? formsConfig.showErrorsOn ?? "change", ...ngDevMode ? [{ debugName: "showErrorsOn" }] : /* istanbul ignore next */ []);
 	const revision = signal(0, ...ngDevMode ? [{ debugName: "revision" }] : /* istanbul ignore next */ []);
 	const editing = signal(false, ...ngDevMode ? [{ debugName: "editing" }] : /* istanbul ignore next */ []);
 	const revealedBySubmit = signal(false, ...ngDevMode ? [{ debugName: "revealedBySubmit" }] : /* istanbul ignore next */ []);
@@ -5634,14 +5634,14 @@ function controlErrorStateFrom(control, config) {
 		revision();
 		const ctrl = control();
 		if (!ctrl || !ctrl.invalid || !ctrl.touched || !ctrl.errors) return null;
-		if (ctrl.pristine && passedThrough() && !showOnTouch()) return null;
+		if (ctrl.pristine && passedThrough() && showErrorsOn() === "change") return null;
 		return resolveValidationMessage(ctrl.errors, config.errorMessages(), i18n.messages());
 	}, ...ngDevMode ? [{ debugName: "validationError" }] : /* istanbul ignore next */ []);
 	const autoError = linkedSignal({
 		...ngDevMode ? { debugName: "autoError" } : /* istanbul ignore next */ {},
 		source: () => ({
 			message: validationError(),
-			holding: revealPending() || editing() && !revealedBySubmit() && !showOnTouch()
+			holding: revealPending() || editing() && !revealedBySubmit() && showErrorsOn() !== "touch"
 		}),
 		computation: ({ message, holding }, previous) => previous?.value || !holding ? message : null
 	});