@vallift/ngl 22.0.14 → 22.0.16

package/fesm2022/vallift-ngl.mjs

@@ -14579,15 +14579,24 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.1", ngImpor
         }], propDecorators: { type: [{ type: i0.Input, args: [{ isSignal: true, alias: "type", required: false }] }], appearance: [{ type: i0.Input, args: [{ isSignal: true, alias: "appearance", required: false }] }], size: [{ type: i0.Input, args: [{ isSignal: true, alias: "size", required: false }] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], loading: [{ type: i0.Input, args: [{ isSignal: true, alias: "loading", required: false }] }], fullWidth: [{ type: i0.Input, args: [{ isSignal: true, alias: "fullWidth", required: false }] }], iconSrc: [{ type: i0.Input, args: [{ isSignal: true, alias: "iconSrc", required: false }] }], iconSize: [{ type: i0.Input, args: [{ isSignal: true, alias: "iconSize", required: false }] }], clicked: [{ type: i0.Output, args: ["clicked"] }] } });
 
 class SignalError {
-    getSignalFieldErrorMessage = getSignalFieldErrorMessage;
+    signalFormErrors = inject(SIGNAL_FORM_ERRORS);
     formField = input.required(/* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "formField" }] : /* istanbul ignore next */ []));
+    fieldState = computed(() => this.formField()(), /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "fieldState" }] : /* istanbul ignore next */ []));
+    showError = computed(() => {
+        const state = this.fieldState();
+        return state.invalid() && (state.touched() || state.dirty());
+    }, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "showError" }] : /* istanbul ignore next */ []));
+    errorMessage = computed(() => getSignalValidationErrorMessage(this.fieldState().errors(), this.signalFormErrors), /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "errorMessage" }] : /* istanbul ignore next */ []));
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.1", ngImport: i0, type: SignalError, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "22.0.1", type: SignalError, isStandalone: true, selector: "lib-signal-error", inputs: { formField: { classPropertyName: "formField", publicName: "formField", isSignal: true, isRequired: true, transformFunction: null } }, ngImport: i0, template: "<p class=\"text-caption text-error\">{{ getSignalFieldErrorMessage(formField()) }}</p>\n", styles: [""] });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "22.0.1", type: SignalError, isStandalone: true, selector: "lib-signal-error", inputs: { formField: { classPropertyName: "formField", publicName: "formField", isSignal: true, isRequired: true, transformFunction: null } }, ngImport: i0, template: "<div\n  class=\"grid transition-[grid-template-rows,margin-top] duration-300 ease-in-out\"\n  [ngClass]=\"showError() ? 'grid-rows-[1fr] mt-2' : 'grid-rows-[0fr] mt-0'\">\n  <p\n    class=\"overflow-hidden min-h-0 text-caption text-error transition-[opacity,transform] duration-300 ease-in-out\"\n    [class.opacity-0]=\"!showError()\"\n    [class.opacity-100]=\"showError()\"\n    [class.-translate-y-1]=\"!showError()\"\n    [class.translate-y-0]=\"showError()\"\n    [attr.role]=\"showError() ? 'alert' : null\"\n    [attr.aria-hidden]=\"!showError()\">\n    {{ showError() ? (errorMessage() ?? '') : '' }}\n  </p>\n</div>\n", styles: [""], dependencies: [{ kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }] });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.1", ngImport: i0, type: SignalError, decorators: [{
             type: Component,
-            args: [{ selector: 'lib-signal-error', imports: [], template: "<p class=\"text-caption text-error\">{{ getSignalFieldErrorMessage(formField()) }}</p>\n" }]
+            args: [{ selector: 'lib-signal-error', imports: [NgClass], template: "<div\n  class=\"grid transition-[grid-template-rows,margin-top] duration-300 ease-in-out\"\n  [ngClass]=\"showError() ? 'grid-rows-[1fr] mt-2' : 'grid-rows-[0fr] mt-0'\">\n  <p\n    class=\"overflow-hidden min-h-0 text-caption text-error transition-[opacity,transform] duration-300 ease-in-out\"\n    [class.opacity-0]=\"!showError()\"\n    [class.opacity-100]=\"showError()\"\n    [class.-translate-y-1]=\"!showError()\"\n    [class.translate-y-0]=\"showError()\"\n    [attr.role]=\"showError() ? 'alert' : null\"\n    [attr.aria-hidden]=\"!showError()\">\n    {{ showError() ? (errorMessage() ?? '') : '' }}\n  </p>\n</div>\n" }]
         }], propDecorators: { formField: [{ type: i0.Input, args: [{ isSignal: true, alias: "formField", required: true }] }] } });
 
 class DateUtils {