@acorex/components 21.0.1-next.50 → 21.0.1-next.52

package/fesm2022/acorex-components-form.mjs

@@ -1,4 +1,5 @@
 import { AXEvent, MXValueComponent, AXComponent, MXBaseComponent, AXValuableComponent } from '@acorex/cdk/common';
+import { AXCheckBoxComponent } from '@acorex/components/check-box';
 import { AXLabelComponent } from '@acorex/components/label';
 import { AXSelectBoxComponent } from '@acorex/components/select-box';
 import { AXUnsubscriber } from '@acorex/core/utils';
@@ -69,7 +70,7 @@ class AXFormComponent extends MXValueComponent {
          */
         this.labelMode = input('static', ...(ngDevMode ? [{ debugName: "labelMode" }] : []));
         this.look = input(null, ...(ngDevMode ? [{ debugName: "look" }] : []));
-        this.content = contentChildren(AXFormFieldComponent, ...(ngDevMode ? [{ debugName: "content", descendants: true }] : [{ descendants: true }]));
+        this.content = contentChildren(AXFormFieldComponent, { ...(ngDevMode ? { debugName: "content" } : {}), descendants: true });
         this.#applyLooks = effect(() => {
             const currentLook = this.look();
             if (!currentLook)
@@ -217,23 +218,23 @@ class AXFormComponent extends MXValueComponent {
     ngOnDestroy() {
         this._clearSubs();
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.3", ngImport: i0, type: AXFormComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "20.3.3", type: AXFormComponent, isStandalone: true, selector: "ax-form", inputs: { disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: false, isRequired: false, transformFunction: null }, readonly: { classPropertyName: "readonly", publicName: "readonly", isSignal: false, isRequired: false, transformFunction: null }, labelMode: { classPropertyName: "labelMode", publicName: "labelMode", isSignal: true, isRequired: false, transformFunction: null }, look: { classPropertyName: "look", publicName: "look", isSignal: true, isRequired: false, transformFunction: null }, messageStyle: { classPropertyName: "messageStyle", publicName: "messageStyle", isSignal: true, isRequired: false, transformFunction: null }, updateOn: { classPropertyName: "updateOn", publicName: "updateOn", isSignal: false, isRequired: false, transformFunction: null }, inUserInteractionActive: { classPropertyName: "inUserInteractionActive", publicName: "inUserInteractionActive", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { onValidate: "onValidate", updateOnChange: "updateOnChange" }, providers: [{ provide: AXComponent, useExisting: AXFormComponent }], queries: [{ propertyName: "content", predicate: AXFormFieldComponent, descendants: true, isSignal: true }], usesInheritance: true, ngImport: i0, template: `<form (submit)="_handleSubmit($event)" (reset)="_handleReset()" class="ax-{{ messageStyle() }}-error">
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.3", ngImport: i0, type: AXFormComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "21.1.3", type: AXFormComponent, isStandalone: true, selector: "ax-form", inputs: { disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: false, isRequired: false, transformFunction: null }, readonly: { classPropertyName: "readonly", publicName: "readonly", isSignal: false, isRequired: false, transformFunction: null }, labelMode: { classPropertyName: "labelMode", publicName: "labelMode", isSignal: true, isRequired: false, transformFunction: null }, look: { classPropertyName: "look", publicName: "look", isSignal: true, isRequired: false, transformFunction: null }, messageStyle: { classPropertyName: "messageStyle", publicName: "messageStyle", isSignal: true, isRequired: false, transformFunction: null }, updateOn: { classPropertyName: "updateOn", publicName: "updateOn", isSignal: false, isRequired: false, transformFunction: null }, inUserInteractionActive: { classPropertyName: "inUserInteractionActive", publicName: "inUserInteractionActive", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { onValidate: "onValidate", updateOnChange: "updateOnChange" }, providers: [{ provide: AXComponent, useExisting: AXFormComponent }], queries: [{ propertyName: "content", predicate: AXFormFieldComponent, descendants: true, isSignal: true }], usesInheritance: true, ngImport: i0, template: `<form (submit)="_handleSubmit($event)" (reset)="_handleReset()" class="ax-{{ messageStyle() }}-error">
     <ng-content></ng-content>
   </form>`, isInline: true, styles: ["form{height:inherit}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.3", ngImport: i0, type: AXFormComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.3", ngImport: i0, type: AXFormComponent, decorators: [{
             type: Component,
             args: [{ selector: 'ax-form', template: `<form (submit)="_handleSubmit($event)" (reset)="_handleReset()" class="ax-{{ messageStyle() }}-error">
     <ng-content></ng-content>
   </form>`, inputs: ['disabled', 'readonly'], encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, providers: [{ provide: AXComponent, useExisting: AXFormComponent }], styles: ["form{height:inherit}\n"] }]
-        }], ctorParameters: () => [], propDecorators: { onValidate: [{
+        }], ctorParameters: () => [], propDecorators: { labelMode: [{ type: i0.Input, args: [{ isSignal: true, alias: "labelMode", required: false }] }], look: [{ type: i0.Input, args: [{ isSignal: true, alias: "look", required: false }] }], content: [{ type: i0.ContentChildren, args: [i0.forwardRef(() => AXFormFieldComponent), { ...{ descendants: true }, isSignal: true }] }], messageStyle: [{ type: i0.Input, args: [{ isSignal: true, alias: "messageStyle", required: false }] }], onValidate: [{
                 type: Output
             }], updateOnChange: [{
                 type: Output
             }], updateOn: [{
                 type: Input
-            }] } });
+            }], inUserInteractionActive: [{ type: i0.Input, args: [{ isSignal: true, alias: "inUserInteractionActive", required: false }] }] } });
 
 /**
  * A container component for form fields that provides styling and structure.
@@ -260,9 +261,8 @@ class AXFormFieldComponent extends MXBaseComponent {
         this.host = inject(ViewContainerRef);
         afterNextRender(() => {
             this.setRequired();
-            this.setLabelMode();
             this.listeningEvent();
-            this.calcIndentSize();
+            // this.calcIndentSize();
             this.autoSetLabelAssociation();
         });
         effect(() => {
@@ -270,7 +270,7 @@ class AXFormFieldComponent extends MXBaseComponent {
         });
     }
     ngAfterContentChecked() {
-        this.calcIndentSize();
+        // this.calcIndentSize();
     }
     /**
      * Calculates and sets the indentation size for the label based on the width of the prefix element.
@@ -279,7 +279,7 @@ class AXFormFieldComponent extends MXBaseComponent {
     calcIndentSize() {
         const prefix = this.input?.getHostElement()?.querySelector('ax-prefix');
         if (prefix && this.label) {
-            this.label.getHostElement().style.insetInlineStart = `calc(${prefix?.clientWidth}px + var(--ax-comp-editor-gap))`;
+            this.label.getHostElement().style.insetInlineStart = `calc(${prefix?.clientWidth}px + calc(var(--spacing) * 2) + calc(var(--spacing) * 3))`;
             this.label.getHostElement().style.paddingInline = '0px';
         }
     }
@@ -307,6 +307,8 @@ class AXFormFieldComponent extends MXBaseComponent {
      * @ignone
      */
     listeningEvent() {
+        if (this.input instanceof AXCheckBoxComponent)
+            return;
         const focusEvent = this.input?.['onFocus'];
         focusEvent?.subscribe((e) => {
             // this.handleFloating('focus');
@@ -356,6 +358,7 @@ class AXFormFieldComponent extends MXBaseComponent {
      */
     get __hostClass() {
         let hasValue;
+        let isCheckbox = this.input instanceof AXCheckBoxComponent;
         if (this.input) {
             if (this.input instanceof AXSelectBoxComponent && this.input.multiple) {
                 hasValue = this.input.value?.length;
@@ -364,15 +367,20 @@ class AXFormFieldComponent extends MXBaseComponent {
                 hasValue = this.input.value;
             }
         }
-        return [`ax-state-${this._labelMode()}-label`, `${hasValue && 'ax-state-has-value'}`];
+        if (isCheckbox) {
+            return [`ax-state-static-label`];
+        }
+        else {
+            return [`ax-state-${this._labelMode()}-label`, `${hasValue && 'ax-state-has-value'}`];
+        }
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.3", ngImport: i0, type: AXFormFieldComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "20.3.3", type: AXFormFieldComponent, isStandalone: true, selector: "ax-form-field", inputs: { labelMode: { classPropertyName: "labelMode", publicName: "labelMode", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class": "this.__hostClass" } }, providers: [AXUnsubscriber, { provide: AXComponent, useExisting: AXFormFieldComponent }], queries: [{ propertyName: "input", first: true, predicate: AXValuableComponent, descendants: true }, { propertyName: "label", first: true, predicate: AXLabelComponent, descendants: true }], usesInheritance: true, ngImport: i0, template: `<ng-content></ng-content>`, isInline: true, styles: ["ax-form-field{position:relative;display:block;width:100%}ax-form-field.ax-state-floating-label{--ax-sys-size-base: 3.5rem}ax-form-field.ax-state-floating-label>ax-label{position:absolute;top:calc(var(--ax-sys-size-base, 3.5rem) / 2);transform:translateY(-50%);inset-inline-start:1rem;pointer-events:none;z-index:10;display:inline-grid;transition-property:transform,top;transition-duration:var(--ax-sys-transition-duration);transition-timing-function:var(--ax-sys-transition-timing-function)}ax-form-field.ax-state-floating-label>ax-label label{margin:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}ax-form-field.ax-state-floating-label .ax-input::placeholder,ax-form-field.ax-state-floating-label .ax-input .ax-placeholder{opacity:0}ax-form-field.ax-state-floating-label.ax-state-focused>ax-label,ax-form-field.ax-state-floating-label.ax-state-has-value>ax-label{transform:translateY(-115%) translate(-2.5%) scale(.95);inset-inline-start:.5rem}ax-form-field.ax-state-floating-label.ax-state-focused>ax-label label,ax-form-field.ax-state-floating-label.ax-state-has-value>ax-label label{font-size:.75rem;color:rgba(var(--ax-sys-body-text-color),.5)}ax-form-field.ax-state-floating-label.ax-state-focused .ax-input,ax-form-field.ax-state-floating-label.ax-state-focused .ax-content,ax-form-field.ax-state-floating-label.ax-state-focused ax-text-area,ax-form-field.ax-state-floating-label.ax-state-has-value .ax-input,ax-form-field.ax-state-floating-label.ax-state-has-value .ax-content,ax-form-field.ax-state-floating-label.ax-state-has-value ax-text-area{padding-top:.875rem}ax-form-field.ax-state-floating-label.ax-state-focused .ax-input::placeholder,ax-form-field.ax-state-floating-label.ax-state-focused .ax-content::placeholder,ax-form-field.ax-state-floating-label.ax-state-focused ax-text-area::placeholder,ax-form-field.ax-state-floating-label.ax-state-has-value .ax-input::placeholder,ax-form-field.ax-state-floating-label.ax-state-has-value .ax-content::placeholder,ax-form-field.ax-state-floating-label.ax-state-has-value ax-text-area::placeholder{opacity:1}ax-form-field.ax-state-floating-label.ax-state-focused .ax-chips-container,ax-form-field.ax-state-floating-label.ax-state-has-value .ax-chips-container{padding:0}ax-form-field.ax-state-floating-label.ax-state-focused ax-text-area .ax-editor-container,ax-form-field.ax-state-floating-label.ax-state-has-value ax-text-area .ax-editor-container{padding-top:1.5rem}ax-form-field.ax-state-floating-label.ax-state-focused ax-text-area textarea,ax-form-field.ax-state-floating-label.ax-state-has-value ax-text-area textarea{padding-top:0!important}ax-form-field.ax-state-over-label{--ax-sys-size-base: 3.5rem}ax-form-field.ax-state-over-label>ax-label{position:absolute;pointer-events:none;z-index:10;display:inline-grid;top:10%;transform:translateY(-10%);inset-inline-start:.5rem;transition-property:transform,top;transition-duration:var(--ax-sys-transition-duration);transition-timing-function:var(--ax-sys-transition-timing-function)}ax-form-field.ax-state-over-label>ax-label label{margin:0;overflow:hidden;text-overflow:ellipsis;font-size:.75rem;white-space:nowrap}ax-form-field.ax-state-over-label .ax-input,ax-form-field.ax-state-over-label .ax-content,ax-form-field.ax-state-over-label ax-text-area{padding-top:1rem}ax-form-field.ax-state-over-label.ax-state-focused ax-text-area .ax-editor-container,ax-form-field.ax-state-over-label.ax-state-has-value ax-text-area .ax-editor-container{padding-top:1.5rem}ax-form-field.ax-state-over-label.ax-state-focused ax-text-area textarea,ax-form-field.ax-state-over-label.ax-state-has-value ax-text-area textarea{padding-top:0!important}ax-form-field.ax-state-floating-label .ax-chips-container.ax-multiple,ax-form-field.ax-state-over-label .ax-chips-container.ax-multiple{padding-top:1.5rem!important;padding-inline-start:.75rem}ax-form-field .ax-error-message{margin-top:.25rem;margin-bottom:.25rem;display:block;font-size:.75rem;line-height:1rem}ax-form{width:100%}ax-form form.ax-bottom-error .ax-error-message{color:rgba(var(--ax-sys-color-danger-surface))}ax-form form.ax-float-error .ax-error-message{position:absolute;bottom:-2.5rem;z-index:20;display:block;width:fit-content;border-radius:.375rem;border-width:1px;border-color:rgba(var(--ax-sys-color-border-danger-surface));background-color:rgba(var(--ax-sys-color-danger-surface));color:rgba(var(--ax-sys-color-on-danger-surface));padding:.25rem .5rem;font-weight:400}ax-form form.ax-float-error .ax-error-message:before,ax-form form.ax-float-error .ax-error-message:after{pointer-events:none;position:absolute;bottom:100%;inset-inline-start:.75rem;z-index:20;height:0px;width:0px;border-bottom-color:rgba(var(--ax-sys-color-danger-surface));border-inline-end-color:transparent;border-inline-start-color:transparent;border-top-color:transparent;content:\"\"}ax-form form.ax-float-error .ax-error-message:before{margin-inline-start:-1px;border-width:4px;border-bottom-color:rgba(var(--ax-sys-color-danger-surface))}ax-form form.ax-float-error .ax-error-message:after{border-width:4px}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.3", ngImport: i0, type: AXFormFieldComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.1.3", type: AXFormFieldComponent, isStandalone: true, selector: "ax-form-field", inputs: { labelMode: { classPropertyName: "labelMode", publicName: "labelMode", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class": "this.__hostClass" } }, providers: [AXUnsubscriber, { provide: AXComponent, useExisting: AXFormFieldComponent }], queries: [{ propertyName: "input", first: true, predicate: AXValuableComponent, descendants: true }, { propertyName: "label", first: true, predicate: AXLabelComponent, descendants: true }], usesInheritance: true, ngImport: i0, template: `<ng-content></ng-content>`, isInline: true, styles: ["@layer properties{@supports (((-webkit-hyphens:none)) and (not (margin-trim:inline))) or ((-moz-orient:inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--tw-translate-x:0;--tw-translate-y:0;--tw-translate-z:0}}}@layer utilities{form .ax-error-message{margin-top:calc(var(--spacing,.25rem) * 1);font-size:var(--text-sm,.875rem);line-height:var(--tw-leading,var(--text-sm--line-height,calc(1.25 / .875)));color:var(--color-danger-600,rgba(var(--ax-sys-color-danger-600)))}form.ax-float-error .ax-error-message:before{content:\"\";inset-inline-start:calc(var(--spacing,.25rem) * 2);top:calc(var(--spacing,.25rem) * -1);z-index:-10;width:calc(var(--spacing,.25rem) * 3);height:calc(var(--spacing,.25rem) * 3);background-color:var(--color-danger-600,rgba(var(--ax-sys-color-danger-600)));position:absolute;rotate:45deg}form.ax-float-error .ax-error-message{inset-inline-start:calc(var(--spacing,.25rem) * 0);bottom:calc(var(--spacing,.25rem) * 0);z-index:20;--tw-translate-y:100%;height:fit-content;translate:var(--tw-translate-x) var(--tw-translate-y);border-radius:var(--radius-sm,.25rem);background-color:var(--color-danger-600,rgba(var(--ax-sys-color-danger-600)));padding-inline:calc(var(--spacing,.25rem) * 2);padding-block:calc(var(--spacing,.25rem) * .5);font-size:var(--text-xs,.75rem);line-height:var(--tw-leading,var(--text-xs--line-height,calc(1 / .75)));color:var(--color-on-danger,rgba(var(--ax-sys-color-on-danger-surface)));position:absolute}:is(.ax-md ax-form-field.ax-state-floating-label,.ax-md ax-form-field.ax-state-over-label) .ax-editor-container{height:calc(var(--spacing,.25rem) * 14)}:is(.ax-sm ax-form-field.ax-state-floating-label,.ax-sm ax-form-field.ax-state-over-label) .ax-editor-container{height:calc(var(--spacing,.25rem) * 12)}:is(.ax-xs ax-form-field.ax-state-floating-label,.ax-xs ax-form-field.ax-state-over-label) .ax-editor-container{height:calc(var(--spacing,.25rem) * 10)}:is(.ax-lg ax-form-field.ax-state-floating-label,.ax-lg ax-form-field.ax-state-over-label) .ax-editor-container{height:calc(var(--spacing,.25rem) * 16)}:is(.ax-xl ax-form-field.ax-state-floating-label,.ax-xl ax-form-field.ax-state-over-label) .ax-editor-container{height:calc(var(--spacing,.25rem) * 18)}ax-form-field{width:100%;display:block;position:relative}:is(ax-form-field.ax-state-floating-label,ax-form-field.ax-state-over-label,ax-form-field.ax-state-over-label.ax-md) .ax-editor-container{height:calc(var(--spacing,.25rem) * 14)}:is(ax-form-field.ax-state-floating-label,ax-form-field.ax-state-over-label) .ax-editor-container{align-items:center}:is(ax-form-field.ax-state-floating-label,ax-form-field.ax-state-over-label) .ax-editor-container .ax-content,:is(ax-form-field.ax-state-floating-label,ax-form-field.ax-state-over-label) .ax-editor-container .ax-input,:is(ax-form-field.ax-state-floating-label,ax-form-field.ax-state-over-label) .ax-editor-container ax-prefix,:is(ax-form-field.ax-state-floating-label,ax-form-field.ax-state-over-label) .ax-editor-container ax-suffix{padding-top:calc(var(--spacing,.25rem) * 7)!important;padding-bottom:calc(var(--spacing,.25rem) * 2)!important}:is(ax-form-field.ax-state-floating-label,ax-form-field.ax-state-over-label) .ax-editor-container .ax-editor-container .ax-content{padding-top:calc(var(--spacing,.25rem) * 3)!important;padding-bottom:calc(var(--spacing,.25rem) * 0)!important}:is(ax-form-field.ax-state-floating-label,ax-form-field.ax-state-over-label) .ax-editor-container .ax-editor-container .ax-content ax-prefix,:is(ax-form-field.ax-state-floating-label,ax-form-field.ax-state-over-label) .ax-editor-container .ax-editor-container .ax-content ax-suffix{padding-top:calc(var(--spacing,.25rem) * 0)!important}:is(ax-form-field.ax-state-floating-label,ax-form-field.ax-state-over-label) ax-label{z-index:10;transition-property:all;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function,cubic-bezier(.4, 0, .2, 1)));transition-duration:var(--tw-duration,var(--default-transition-duration,.15s));--tw-translate-y: -50% ;translate:var(--tw-translate-x) var(--tw-translate-y);inset-inline-start:calc(var(--spacing,.25rem) * 3);position:absolute;top:50%}:is(ax-form-field.ax-state-floating-label,ax-form-field.ax-state-over-label) ax-label label{margin-bottom:calc(var(--spacing,.25rem) * 0)}:is(ax-form-field.ax-state-floating-label,ax-form-field.ax-state-over-label) .ax-input::placeholder,:is(ax-form-field.ax-state-floating-label,ax-form-field.ax-state-over-label) .ax-placeholder,:is(ax-form-field.ax-state-floating-label,ax-form-field.ax-state-over-label) ax-prefix,:is(ax-form-field.ax-state-floating-label,ax-form-field.ax-state-over-label) ax-suffix{opacity:0}:is(:is(ax-form-field.ax-state-floating-label,ax-form-field.ax-state-over-label).ax-state-has-value,:is(ax-form-field.ax-state-floating-label,ax-form-field.ax-state-over-label).ax-state-focused,:is(ax-form-field.ax-state-floating-label,ax-form-field.ax-state-over-label).ax-state-over-label) ax-label{inset-inline-start:calc(var(--spacing,.25rem) * 3);top:calc(var(--spacing,.25rem) * 4);padding-inline:calc(var(--spacing,.25rem) * 1);padding:calc(var(--spacing,.25rem) * 0)!important}:is(:is(ax-form-field.ax-state-floating-label,ax-form-field.ax-state-over-label).ax-state-has-value,:is(ax-form-field.ax-state-floating-label,ax-form-field.ax-state-over-label).ax-state-focused,:is(ax-form-field.ax-state-floating-label,ax-form-field.ax-state-over-label).ax-state-over-label) ax-label label{margin-bottom:calc(var(--spacing,.25rem) * 0);font-size:var(--text-xs,.75rem);line-height:var(--tw-leading,var(--text-xs--line-height,calc(1 / .75)))}:is(:is(ax-form-field.ax-state-floating-label,ax-form-field.ax-state-over-label).ax-state-has-value,:is(ax-form-field.ax-state-floating-label,ax-form-field.ax-state-over-label).ax-state-focused,:is(ax-form-field.ax-state-floating-label,ax-form-field.ax-state-over-label).ax-state-over-label) .ax-input::placeholder,:is(:is(ax-form-field.ax-state-floating-label,ax-form-field.ax-state-over-label).ax-state-has-value,:is(ax-form-field.ax-state-floating-label,ax-form-field.ax-state-over-label).ax-state-focused,:is(ax-form-field.ax-state-floating-label,ax-form-field.ax-state-over-label).ax-state-over-label) .ax-placeholder,:is(:is(ax-form-field.ax-state-floating-label,ax-form-field.ax-state-over-label).ax-state-has-value,:is(ax-form-field.ax-state-floating-label,ax-form-field.ax-state-over-label).ax-state-focused,:is(ax-form-field.ax-state-floating-label,ax-form-field.ax-state-over-label).ax-state-over-label) ax-prefix,:is(:is(ax-form-field.ax-state-floating-label,ax-form-field.ax-state-over-label).ax-state-has-value,:is(ax-form-field.ax-state-floating-label,ax-form-field.ax-state-over-label).ax-state-focused,:is(ax-form-field.ax-state-floating-label,ax-form-field.ax-state-over-label).ax-state-over-label) ax-suffix{opacity:1}:is(:is(ax-form-field.ax-state-floating-label,ax-form-field.ax-state-over-label).ax-state-has-value,:is(ax-form-field.ax-state-floating-label,ax-form-field.ax-state-over-label).ax-state-focused,:is(ax-form-field.ax-state-floating-label,ax-form-field.ax-state-over-label).ax-state-over-label) ax-prefix .ax-editor-container .ax-input,:is(:is(ax-form-field.ax-state-floating-label,ax-form-field.ax-state-over-label).ax-state-has-value,:is(ax-form-field.ax-state-floating-label,ax-form-field.ax-state-over-label).ax-state-focused,:is(ax-form-field.ax-state-floating-label,ax-form-field.ax-state-over-label).ax-state-over-label) ax-prefix .ax-editor-container .ax-content{padding-top:calc(var(--spacing,.25rem) * 1)!important}}@property --tw-translate-x{syntax:\"*\";inherits:false;initial-value:0}@property --tw-translate-y{syntax:\"*\";inherits:false;initial-value:0}@property --tw-translate-z{syntax:\"*\";inherits:false;initial-value:0}\n/*! tailwindcss v4.2.1 | MIT License | https://tailwindcss.com */\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.3", ngImport: i0, type: AXFormFieldComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.3", ngImport: i0, type: AXFormFieldComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'ax-form-field', template: `<ng-content></ng-content>`, encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, providers: [AXUnsubscriber, { provide: AXComponent, useExisting: AXFormFieldComponent }], styles: ["ax-form-field{position:relative;display:block;width:100%}ax-form-field.ax-state-floating-label{--ax-sys-size-base: 3.5rem}ax-form-field.ax-state-floating-label>ax-label{position:absolute;top:calc(var(--ax-sys-size-base, 3.5rem) / 2);transform:translateY(-50%);inset-inline-start:1rem;pointer-events:none;z-index:10;display:inline-grid;transition-property:transform,top;transition-duration:var(--ax-sys-transition-duration);transition-timing-function:var(--ax-sys-transition-timing-function)}ax-form-field.ax-state-floating-label>ax-label label{margin:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}ax-form-field.ax-state-floating-label .ax-input::placeholder,ax-form-field.ax-state-floating-label .ax-input .ax-placeholder{opacity:0}ax-form-field.ax-state-floating-label.ax-state-focused>ax-label,ax-form-field.ax-state-floating-label.ax-state-has-value>ax-label{transform:translateY(-115%) translate(-2.5%) scale(.95);inset-inline-start:.5rem}ax-form-field.ax-state-floating-label.ax-state-focused>ax-label label,ax-form-field.ax-state-floating-label.ax-state-has-value>ax-label label{font-size:.75rem;color:rgba(var(--ax-sys-body-text-color),.5)}ax-form-field.ax-state-floating-label.ax-state-focused .ax-input,ax-form-field.ax-state-floating-label.ax-state-focused .ax-content,ax-form-field.ax-state-floating-label.ax-state-focused ax-text-area,ax-form-field.ax-state-floating-label.ax-state-has-value .ax-input,ax-form-field.ax-state-floating-label.ax-state-has-value .ax-content,ax-form-field.ax-state-floating-label.ax-state-has-value ax-text-area{padding-top:.875rem}ax-form-field.ax-state-floating-label.ax-state-focused .ax-input::placeholder,ax-form-field.ax-state-floating-label.ax-state-focused .ax-content::placeholder,ax-form-field.ax-state-floating-label.ax-state-focused ax-text-area::placeholder,ax-form-field.ax-state-floating-label.ax-state-has-value .ax-input::placeholder,ax-form-field.ax-state-floating-label.ax-state-has-value .ax-content::placeholder,ax-form-field.ax-state-floating-label.ax-state-has-value ax-text-area::placeholder{opacity:1}ax-form-field.ax-state-floating-label.ax-state-focused .ax-chips-container,ax-form-field.ax-state-floating-label.ax-state-has-value .ax-chips-container{padding:0}ax-form-field.ax-state-floating-label.ax-state-focused ax-text-area .ax-editor-container,ax-form-field.ax-state-floating-label.ax-state-has-value ax-text-area .ax-editor-container{padding-top:1.5rem}ax-form-field.ax-state-floating-label.ax-state-focused ax-text-area textarea,ax-form-field.ax-state-floating-label.ax-state-has-value ax-text-area textarea{padding-top:0!important}ax-form-field.ax-state-over-label{--ax-sys-size-base: 3.5rem}ax-form-field.ax-state-over-label>ax-label{position:absolute;pointer-events:none;z-index:10;display:inline-grid;top:10%;transform:translateY(-10%);inset-inline-start:.5rem;transition-property:transform,top;transition-duration:var(--ax-sys-transition-duration);transition-timing-function:var(--ax-sys-transition-timing-function)}ax-form-field.ax-state-over-label>ax-label label{margin:0;overflow:hidden;text-overflow:ellipsis;font-size:.75rem;white-space:nowrap}ax-form-field.ax-state-over-label .ax-input,ax-form-field.ax-state-over-label .ax-content,ax-form-field.ax-state-over-label ax-text-area{padding-top:1rem}ax-form-field.ax-state-over-label.ax-state-focused ax-text-area .ax-editor-container,ax-form-field.ax-state-over-label.ax-state-has-value ax-text-area .ax-editor-container{padding-top:1.5rem}ax-form-field.ax-state-over-label.ax-state-focused ax-text-area textarea,ax-form-field.ax-state-over-label.ax-state-has-value ax-text-area textarea{padding-top:0!important}ax-form-field.ax-state-floating-label .ax-chips-container.ax-multiple,ax-form-field.ax-state-over-label .ax-chips-container.ax-multiple{padding-top:1.5rem!important;padding-inline-start:.75rem}ax-form-field .ax-error-message{margin-top:.25rem;margin-bottom:.25rem;display:block;font-size:.75rem;line-height:1rem}ax-form{width:100%}ax-form form.ax-bottom-error .ax-error-message{color:rgba(var(--ax-sys-color-danger-surface))}ax-form form.ax-float-error .ax-error-message{position:absolute;bottom:-2.5rem;z-index:20;display:block;width:fit-content;border-radius:.375rem;border-width:1px;border-color:rgba(var(--ax-sys-color-border-danger-surface));background-color:rgba(var(--ax-sys-color-danger-surface));color:rgba(var(--ax-sys-color-on-danger-surface));padding:.25rem .5rem;font-weight:400}ax-form form.ax-float-error .ax-error-message:before,ax-form form.ax-float-error .ax-error-message:after{pointer-events:none;position:absolute;bottom:100%;inset-inline-start:.75rem;z-index:20;height:0px;width:0px;border-bottom-color:rgba(var(--ax-sys-color-danger-surface));border-inline-end-color:transparent;border-inline-start-color:transparent;border-top-color:transparent;content:\"\"}ax-form form.ax-float-error .ax-error-message:before{margin-inline-start:-1px;border-width:4px;border-bottom-color:rgba(var(--ax-sys-color-danger-surface))}ax-form form.ax-float-error .ax-error-message:after{border-width:4px}\n"] }]
-        }], ctorParameters: () => [], propDecorators: { input: [{
+            args: [{ selector: 'ax-form-field', template: `<ng-content></ng-content>`, encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, providers: [AXUnsubscriber, { provide: AXComponent, useExisting: AXFormFieldComponent }], styles: ["@layer properties{@supports (((-webkit-hyphens:none)) and (not (margin-trim:inline))) or ((-moz-orient:inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--tw-translate-x:0;--tw-translate-y:0;--tw-translate-z:0}}}@layer utilities{form .ax-error-message{margin-top:calc(var(--spacing,.25rem) * 1);font-size:var(--text-sm,.875rem);line-height:var(--tw-leading,var(--text-sm--line-height,calc(1.25 / .875)));color:var(--color-danger-600,rgba(var(--ax-sys-color-danger-600)))}form.ax-float-error .ax-error-message:before{content:\"\";inset-inline-start:calc(var(--spacing,.25rem) * 2);top:calc(var(--spacing,.25rem) * -1);z-index:-10;width:calc(var(--spacing,.25rem) * 3);height:calc(var(--spacing,.25rem) * 3);background-color:var(--color-danger-600,rgba(var(--ax-sys-color-danger-600)));position:absolute;rotate:45deg}form.ax-float-error .ax-error-message{inset-inline-start:calc(var(--spacing,.25rem) * 0);bottom:calc(var(--spacing,.25rem) * 0);z-index:20;--tw-translate-y:100%;height:fit-content;translate:var(--tw-translate-x) var(--tw-translate-y);border-radius:var(--radius-sm,.25rem);background-color:var(--color-danger-600,rgba(var(--ax-sys-color-danger-600)));padding-inline:calc(var(--spacing,.25rem) * 2);padding-block:calc(var(--spacing,.25rem) * .5);font-size:var(--text-xs,.75rem);line-height:var(--tw-leading,var(--text-xs--line-height,calc(1 / .75)));color:var(--color-on-danger,rgba(var(--ax-sys-color-on-danger-surface)));position:absolute}:is(.ax-md ax-form-field.ax-state-floating-label,.ax-md ax-form-field.ax-state-over-label) .ax-editor-container{height:calc(var(--spacing,.25rem) * 14)}:is(.ax-sm ax-form-field.ax-state-floating-label,.ax-sm ax-form-field.ax-state-over-label) .ax-editor-container{height:calc(var(--spacing,.25rem) * 12)}:is(.ax-xs ax-form-field.ax-state-floating-label,.ax-xs ax-form-field.ax-state-over-label) .ax-editor-container{height:calc(var(--spacing,.25rem) * 10)}:is(.ax-lg ax-form-field.ax-state-floating-label,.ax-lg ax-form-field.ax-state-over-label) .ax-editor-container{height:calc(var(--spacing,.25rem) * 16)}:is(.ax-xl ax-form-field.ax-state-floating-label,.ax-xl ax-form-field.ax-state-over-label) .ax-editor-container{height:calc(var(--spacing,.25rem) * 18)}ax-form-field{width:100%;display:block;position:relative}:is(ax-form-field.ax-state-floating-label,ax-form-field.ax-state-over-label,ax-form-field.ax-state-over-label.ax-md) .ax-editor-container{height:calc(var(--spacing,.25rem) * 14)}:is(ax-form-field.ax-state-floating-label,ax-form-field.ax-state-over-label) .ax-editor-container{align-items:center}:is(ax-form-field.ax-state-floating-label,ax-form-field.ax-state-over-label) .ax-editor-container .ax-content,:is(ax-form-field.ax-state-floating-label,ax-form-field.ax-state-over-label) .ax-editor-container .ax-input,:is(ax-form-field.ax-state-floating-label,ax-form-field.ax-state-over-label) .ax-editor-container ax-prefix,:is(ax-form-field.ax-state-floating-label,ax-form-field.ax-state-over-label) .ax-editor-container ax-suffix{padding-top:calc(var(--spacing,.25rem) * 7)!important;padding-bottom:calc(var(--spacing,.25rem) * 2)!important}:is(ax-form-field.ax-state-floating-label,ax-form-field.ax-state-over-label) .ax-editor-container .ax-editor-container .ax-content{padding-top:calc(var(--spacing,.25rem) * 3)!important;padding-bottom:calc(var(--spacing,.25rem) * 0)!important}:is(ax-form-field.ax-state-floating-label,ax-form-field.ax-state-over-label) .ax-editor-container .ax-editor-container .ax-content ax-prefix,:is(ax-form-field.ax-state-floating-label,ax-form-field.ax-state-over-label) .ax-editor-container .ax-editor-container .ax-content ax-suffix{padding-top:calc(var(--spacing,.25rem) * 0)!important}:is(ax-form-field.ax-state-floating-label,ax-form-field.ax-state-over-label) ax-label{z-index:10;transition-property:all;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function,cubic-bezier(.4, 0, .2, 1)));transition-duration:var(--tw-duration,var(--default-transition-duration,.15s));--tw-translate-y: -50% ;translate:var(--tw-translate-x) var(--tw-translate-y);inset-inline-start:calc(var(--spacing,.25rem) * 3);position:absolute;top:50%}:is(ax-form-field.ax-state-floating-label,ax-form-field.ax-state-over-label) ax-label label{margin-bottom:calc(var(--spacing,.25rem) * 0)}:is(ax-form-field.ax-state-floating-label,ax-form-field.ax-state-over-label) .ax-input::placeholder,:is(ax-form-field.ax-state-floating-label,ax-form-field.ax-state-over-label) .ax-placeholder,:is(ax-form-field.ax-state-floating-label,ax-form-field.ax-state-over-label) ax-prefix,:is(ax-form-field.ax-state-floating-label,ax-form-field.ax-state-over-label) ax-suffix{opacity:0}:is(:is(ax-form-field.ax-state-floating-label,ax-form-field.ax-state-over-label).ax-state-has-value,:is(ax-form-field.ax-state-floating-label,ax-form-field.ax-state-over-label).ax-state-focused,:is(ax-form-field.ax-state-floating-label,ax-form-field.ax-state-over-label).ax-state-over-label) ax-label{inset-inline-start:calc(var(--spacing,.25rem) * 3);top:calc(var(--spacing,.25rem) * 4);padding-inline:calc(var(--spacing,.25rem) * 1);padding:calc(var(--spacing,.25rem) * 0)!important}:is(:is(ax-form-field.ax-state-floating-label,ax-form-field.ax-state-over-label).ax-state-has-value,:is(ax-form-field.ax-state-floating-label,ax-form-field.ax-state-over-label).ax-state-focused,:is(ax-form-field.ax-state-floating-label,ax-form-field.ax-state-over-label).ax-state-over-label) ax-label label{margin-bottom:calc(var(--spacing,.25rem) * 0);font-size:var(--text-xs,.75rem);line-height:var(--tw-leading,var(--text-xs--line-height,calc(1 / .75)))}:is(:is(ax-form-field.ax-state-floating-label,ax-form-field.ax-state-over-label).ax-state-has-value,:is(ax-form-field.ax-state-floating-label,ax-form-field.ax-state-over-label).ax-state-focused,:is(ax-form-field.ax-state-floating-label,ax-form-field.ax-state-over-label).ax-state-over-label) .ax-input::placeholder,:is(:is(ax-form-field.ax-state-floating-label,ax-form-field.ax-state-over-label).ax-state-has-value,:is(ax-form-field.ax-state-floating-label,ax-form-field.ax-state-over-label).ax-state-focused,:is(ax-form-field.ax-state-floating-label,ax-form-field.ax-state-over-label).ax-state-over-label) .ax-placeholder,:is(:is(ax-form-field.ax-state-floating-label,ax-form-field.ax-state-over-label).ax-state-has-value,:is(ax-form-field.ax-state-floating-label,ax-form-field.ax-state-over-label).ax-state-focused,:is(ax-form-field.ax-state-floating-label,ax-form-field.ax-state-over-label).ax-state-over-label) ax-prefix,:is(:is(ax-form-field.ax-state-floating-label,ax-form-field.ax-state-over-label).ax-state-has-value,:is(ax-form-field.ax-state-floating-label,ax-form-field.ax-state-over-label).ax-state-focused,:is(ax-form-field.ax-state-floating-label,ax-form-field.ax-state-over-label).ax-state-over-label) ax-suffix{opacity:1}:is(:is(ax-form-field.ax-state-floating-label,ax-form-field.ax-state-over-label).ax-state-has-value,:is(ax-form-field.ax-state-floating-label,ax-form-field.ax-state-over-label).ax-state-focused,:is(ax-form-field.ax-state-floating-label,ax-form-field.ax-state-over-label).ax-state-over-label) ax-prefix .ax-editor-container .ax-input,:is(:is(ax-form-field.ax-state-floating-label,ax-form-field.ax-state-over-label).ax-state-has-value,:is(ax-form-field.ax-state-floating-label,ax-form-field.ax-state-over-label).ax-state-focused,:is(ax-form-field.ax-state-floating-label,ax-form-field.ax-state-over-label).ax-state-over-label) ax-prefix .ax-editor-container .ax-content{padding-top:calc(var(--spacing,.25rem) * 1)!important}}@property --tw-translate-x{syntax:\"*\";inherits:false;initial-value:0}@property --tw-translate-y{syntax:\"*\";inherits:false;initial-value:0}@property --tw-translate-z{syntax:\"*\";inherits:false;initial-value:0}\n/*! tailwindcss v4.2.1 | MIT License | https://tailwindcss.com */\n"] }]
+        }], ctorParameters: () => [], propDecorators: { labelMode: [{ type: i0.Input, args: [{ isSignal: true, alias: "labelMode", required: false }] }], input: [{
                 type: ContentChild,
                 args: [AXValuableComponent]
             }], label: [{
@@ -431,13 +439,13 @@ class AXValidationRuleDirective {
     get ruleOptions() {
         return Object.assign({ message: this.message(), name: this.host.name }, this.options());
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.3", ngImport: i0, type: AXValidationRuleDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "20.3.3", type: AXValidationRuleDirective, isStandalone: true, selector: "ax-validation-rule", inputs: { rule: { classPropertyName: "rule", publicName: "rule", isSignal: true, isRequired: false, transformFunction: null }, options: { classPropertyName: "options", publicName: "options", isSignal: true, isRequired: false, transformFunction: null }, message: { classPropertyName: "message", publicName: "message", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.3", ngImport: i0, type: AXValidationRuleDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "21.1.3", type: AXValidationRuleDirective, isStandalone: true, selector: "ax-validation-rule", inputs: { rule: { classPropertyName: "rule", publicName: "rule", isSignal: true, isRequired: false, transformFunction: null }, options: { classPropertyName: "options", publicName: "options", isSignal: true, isRequired: false, transformFunction: null }, message: { classPropertyName: "message", publicName: "message", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.3", ngImport: i0, type: AXValidationRuleDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.3", ngImport: i0, type: AXValidationRuleDirective, decorators: [{
             type: Directive,
             args: [{ selector: 'ax-validation-rule' }]
-        }] });
+        }], propDecorators: { rule: [{ type: i0.Input, args: [{ isSignal: true, alias: "rule", required: false }] }], options: [{ type: i0.Input, args: [{ isSignal: true, alias: "options", required: false }] }], message: [{ type: i0.Input, args: [{ isSignal: true, alias: "message", required: false }] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }] } });
 
 /**
  * Displays validation summaries in the form of an alert.
@@ -529,8 +537,8 @@ class AXValidationSummaryComponent extends MXBaseComponent {
     ngOnDestroy() {
         this.sub?.unsubscribe();
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.3", ngImport: i0, type: AXValidationSummaryComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.3", type: AXValidationSummaryComponent, isStandalone: true, selector: "ax-validation-summary", inputs: { title: "title", displayMode: "displayMode", timeOut: "timeOut", autoHide: "autoHide" }, providers: [{ provide: AXComponent, useExisting: AXValidationSummaryComponent }], usesInheritance: true, ngImport: i0, template: `
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.3", ngImport: i0, type: AXValidationSummaryComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.1.3", type: AXValidationSummaryComponent, isStandalone: true, selector: "ax-validation-summary", inputs: { title: "title", displayMode: "displayMode", timeOut: "timeOut", autoHide: "autoHide" }, providers: [{ provide: AXComponent, useExisting: AXValidationSummaryComponent }], usesInheritance: true, ngImport: i0, template: `
     @if (displayMode === 'alert' && _content) {
       <ax-alert color="danger" [timeOut]="_timeOut" #a (onClosed)="_handleOnDismissed()">
         <ax-icon></ax-icon>
@@ -547,7 +555,7 @@ class AXValidationSummaryComponent extends MXBaseComponent {
     }
   `, isInline: true, dependencies: [{ kind: "component", type: AXAlertComponent, selector: "ax-alert", inputs: ["color", "timeOut"], outputs: ["colorChange", "onClosed", "timeOutChange"] }, { kind: "component", type: AXDecoratorIconComponent, selector: "ax-icon", inputs: ["icon"] }, { kind: "component", type: AXDecoratorGenericComponent, selector: "ax-footer, ax-header, ax-content, ax-divider, ax-form-hint, ax-prefix, ax-suffix, ax-text, ax-title, ax-subtitle, ax-placeholder, ax-overlay" }, { kind: "component", type: AXButtonComponent, selector: "ax-button", inputs: ["disabled", "size", "tabIndex", "color", "look", "text", "toggleable", "selected", "iconOnly", "type", "loadingText"], outputs: ["onBlur", "onFocus", "onClick", "selectedChange", "toggleableChange", "lookChange", "colorChange", "disabledChange", "loadingTextChange"] }, { kind: "pipe", type: AsyncPipe, name: "async" }, { kind: "pipe", type: AXTranslatorPipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.3", ngImport: i0, type: AXValidationSummaryComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.3", ngImport: i0, type: AXValidationSummaryComponent, decorators: [{
             type: Component,
             args: [{
                     selector: 'ax-validation-summary',
@@ -590,8 +598,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.3", ngImpor
             }] } });
 
 class AXFormModule {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.3", ngImport: i0, type: AXFormModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
-    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "20.3.3", ngImport: i0, type: AXFormModule, imports: [CommonModule,
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.3", ngImport: i0, type: AXFormModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
+    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "21.1.3", ngImport: i0, type: AXFormModule, imports: [CommonModule,
             AXDecoratorModule,
             AXAlertModule,
             AXButtonModule,
@@ -601,7 +609,7 @@ class AXFormModule {
             AXFormComponent,
             AXValidationRuleDirective,
             AXValidationSummaryComponent], exports: [AXFormFieldComponent, AXFormComponent, AXValidationRuleDirective, AXValidationSummaryComponent] }); }
-    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "20.3.3", ngImport: i0, type: AXFormModule, imports: [CommonModule,
+    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "21.1.3", ngImport: i0, type: AXFormModule, imports: [CommonModule,
             AXDecoratorModule,
             AXAlertModule,
             AXButtonModule,
@@ -609,7 +617,7 @@ class AXFormModule {
             AXTranslationModule,
             AXValidationSummaryComponent] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.3", ngImport: i0, type: AXFormModule, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.3", ngImport: i0, type: AXFormModule, decorators: [{
             type: NgModule,
             args: [{
                     imports: [