@messaia/cdk 22.0.0-rc.13 → 22.0.0-rc.15

package/fesm2022/messaia-cdk.mjs

@@ -20,7 +20,7 @@ import { MatButtonModule, MatIconButton } from '@angular/material/button';
 import * as i4 from '@angular/material/icon';
 import { MatIcon, MatIconModule } from '@angular/material/icon';
 import * as i1$1 from '@angular/forms';
-import { FormsModule, FormArray, FormGroup, FormControl, NG_ASYNC_VALIDATORS, NG_VALUE_ACCESSOR, NG_VALIDATORS, AbstractControl, FormBuilder, ReactiveFormsModule, FormControlName, FormControlDirective, NgControl, NgForm, FormGroupDirective, ControlContainer, Validators } from '@angular/forms';
+import { FormsModule, FormArray, FormGroup, FormControl, Validators, NG_ASYNC_VALIDATORS, NG_VALUE_ACCESSOR, NG_VALIDATORS, AbstractControl, FormBuilder, ReactiveFormsModule, FormControlName, FormControlDirective, NgControl, NgForm, FormGroupDirective, ControlContainer } from '@angular/forms';
 import * as i2$1 from '@angular/material/form-field';
 import { MatFormFieldModule, MatFormFieldControl } from '@angular/material/form-field';
 import * as i3 from '@angular/material/progress-bar';
@@ -3837,6 +3837,10 @@ class ApplicationUtil {
         return regex;
     }
     static configureControl(control, config, type) {
+        if (control && typeof control.setValidatorConfig === 'function') {
+            control.setValidatorConfig(type, config);
+            return;
+        }
         if (!control.validatorConfig) {
             let jObject = {};
             jObject[type] = config;
@@ -4437,9 +4441,9 @@ class RxFormControl extends FormControl {
     _baseObject;
     _sanitizers;
     /**
- * Current language used for error message localization.
- * @type {string | undefined}
- */
+     * Current language used for error message localization.
+     * @type {string | undefined}
+     */
     _language;
     /**
      * The key or name of the control.
@@ -4521,6 +4525,16 @@ class RxFormControl extends FormControl {
      * @type {{ [key: string]: string }}
      */
     backEndErrors = {};
+    /**
+     * Persisted validator metadata indexed by validator name.
+     * @type {{ [key: string]: any }}
+     */
+    _validatorConfigStore = {};
+    /**
+     * Runtime validator metadata consumed by existing template validation flow.
+     * @type {{ [key: string]: any } | undefined}
+     */
+    validatorConfig;
     /**
      * Indicates if updating the control element's class should be performed.
      * @type {boolean | Function | undefined}
@@ -4542,16 +4556,26 @@ class RxFormControl extends FormControl {
      * @type {string[]}
      */
     get errorMessages() {
+        /* If no message expression is configured, rely on standard error generation. */
         if (!this._messageExpression) {
-            if (this._errorMessages.length == 0 && this.errors)
+            /* Build messages on demand when errors exist and cache is empty. */
+            if (this._errorMessages.length == 0 && this.errors) {
                 this.setControlErrorMessages();
+            }
         }
-        else if (this._messageExpression && !this._isPassedExpression)
+        /* If expression mode is enabled but not passed, hide all messages. */
+        else if (this._messageExpression && !this._isPassedExpression) {
             return [];
-        if (!this.errors && this._errorMessages.length > 0)
+        }
+        /* If errors were cleared, reset message cache accordingly. */
+        if (!this.errors && this._errorMessages.length > 0) {
             this.setControlErrorMessages();
-        if (this._language != this.getLanguage())
+        }
+        /* If language changed, rebuild translated messages. */
+        if (this._language != this.getLanguage()) {
             this.setControlErrorMessages();
+        }
+        /* Return the computed error message list. */
         return this._errorMessages;
     }
     /**
@@ -4561,32 +4585,53 @@ class RxFormControl extends FormControl {
      * @type {string | undefined}
      */
     get errorMessage() {
+        /* If no message expression is configured, rely on standard error generation. */
         if (!this._messageExpression) {
+            /* Build single message lazily when errors exist and cache is empty. */
             if (this._errorMessage == undefined && this.errors) {
                 this.setControlErrorMessages();
             }
         }
+        /* If expression mode is enabled but not passed, hide message output. */
         else if (this._messageExpression && !this._isPassedExpression) {
             return undefined;
         }
+        /* If errors were cleared, reset single-message cache accordingly. */
         if (!this.errors && this._errorMessage) {
             this.setControlErrorMessages();
         }
+        /* If language changed, rebuild translated single message. */
         if (this._language != this.getLanguage()) {
             this.setControlErrorMessages();
         }
+        /* Return the computed single error message. */
         return this._errorMessage;
     }
     /**
      * Gets the associated entity object.
      * @type {any}
      */
-    get entityObject() { return this._entityObject; }
+    get entityObject() {
+        /* Return the entity object linked to this control instance. */
+        return this._entityObject;
+    }
     /**
      * Gets the base object for comparison or reset.
      * @type {any}
      */
-    get baseObject() { return this._baseObject; }
+    get baseObject() {
+        /* Return the base object used for dirty/modified comparisons. */
+        return this._baseObject;
+    }
+    /**
+     * @method isModified
+     * @description Gets whether the control value is modified compared to its base value.
+     * @returns {boolean} True when the control has been modified.
+     */
+    get isModified() {
+        /* Return whether the current control value differs from the stored base value. */
+        return this._isModified;
+    }
     /**
      * Constructor to initialize RxFormControl.
      * @param formState Initial state or value of the control.
@@ -4597,301 +4642,715 @@ class RxFormControl extends FormControl {
      * @param _sanitizers Array of data sanitizers to preprocess values.
      */
     constructor(formState, validatorOrOpts, _entityObject, _baseObject, controlName, _sanitizers) {
+        /* Delegate base control construction to Angular FormControl. */
         super(formState, validatorOrOpts);
         this._entityObject = _entityObject;
         this._baseObject = _baseObject;
         this._sanitizers = _sanitizers;
+        /* Patch errors property behavior for localization-aware recalculation. */
         this.defineErrorsProperty();
+        /* Capture initial/base value snapshot for modified-state comparisons. */
         this._baseValue = formState === undefined ? null : this.getFormState(formState);
+        /* Initialize modified-state flag. */
         this._isModified = false;
+        /* Store control key name. */
         this.keyName = controlName;
+        /* Cache synchronous validators for later probing and metadata checks. */
         this._validators = validatorOrOpts.validators;
+        /* Cache asynchronous validators for later inspection. */
         this._asyncValidators = validatorOrOpts.asyncValidators;
+        /* Resolve configured error-message binding strategy. */
         this._errorMessageBindingStrategy = ReactiveFormConfig.get("reactiveForm.errorMessageBindingStrategy");
+        /* Apply number-format bootstrap conversion when float sanitizer is configured. */
         if (this._sanitizers) {
+            /* Find float sanitizer configuration. */
             var floatSanitizer = this._sanitizers.filter(t => t.name == "toFloat")[0];
+            /* Convert decimal symbol in base value if locale uses commas. */
             if (floatSanitizer && this._baseValue && ReactiveFormConfig.number && ReactiveFormConfig.number["decimalSymbol"] == ",") {
+                /* Stringify base value for symbol replacement. */
                 let baseValue = String(this._baseValue);
+                /* Replace decimal point only when present. */
                 if (baseValue.indexOf('.') != -1) {
+                    /* Store converted base value using configured decimal symbol. */
                     this._baseValue = baseValue.replace(".", ReactiveFormConfig.number["decimalSymbol"]);
+                    /* Keep underlying FormControl value synchronized with converted base value. */
                     super.setValue(this._baseValue);
                 }
             }
         }
     }
+    /**
+     * Defines a getter and setter for the 'errors' property to handle dynamic error message updates.
+     * This allows the control to re-evaluate its errors when the language changes or when validation is triggered.
+     * @returns {void}
+     */
     defineErrorsProperty() {
+        /* Redefine errors access so language changes can force validator re-evaluation lazily. */
         Object.defineProperty(this, "errors", {
             configurable: true,
             get() {
+                /* Recompute errors when language changes and validator exists. */
                 if (this._language && this._language != this.getLanguage() && this.validator) {
                     this["errors"] = this.validator(this);
                 }
+                /* Return backing error store value. */
                 return this._errors;
             },
+            /* Persist assigned errors into backing store. */
             set(value) { this._errors = value; },
         });
     }
+    /**
+     * Gets the current language for error message localization.
+     * @param value Optional value to determine the language context.
+     * @returns {string | undefined} The current language code.
+     */
     getFormState(value) {
+        /* Clone arrays to avoid mutating the original form-state reference. */
+        /* Start from incoming value. */
         let baseValue = value;
+        /* Clone arrays to prevent shared reference mutation. */
         if (Array.isArray(value)) {
             baseValue = [];
+            /* Copy each array item into new base-value array. */
             value.forEach(t => baseValue.push(t));
         }
+        /* Return normalized base-state value. */
         return baseValue;
     }
-    get isModified() {
-        return this._isModified;
-    }
+    /**
+     * @method getValidators
+     * @description Returns a shallow copy of synchronous validators.
+     * @returns {ValidatorFn[]} Synchronous validator functions.
+     */
     getValidators() {
+        /* Return a normalized copy of synchronous validators. */
         return this.getValidatorSource(this._validators);
     }
+    /**
+     * @method getAsyncValidators
+     * @description Returns a shallow copy of asynchronous validators.
+     * @returns {AsyncValidatorFn[]} Asynchronous validator functions.
+     */
     getAsyncValidators() {
+        /* Return a normalized copy of asynchronous validators. */
         return this.getValidatorSource(this._asyncValidators);
     }
+    /**
+     * @method setValidatorConfig
+     * @description Persists validator configuration metadata by validator type.
+     * @param {string} type Validator name.
+     * @param {any} config Validator configuration object.
+     */
+    setValidatorConfig(type, config) {
+        /* Persist normalized validator configuration and keep compatibility with validatorConfig consumers. */
+        const normalizedConfig = config === '' || config === undefined || config === null ? true : config;
+        this._validatorConfigStore[type] = normalizedConfig;
+        this.validatorConfig = this._validatorConfigStore;
+    }
+    /**
+     * @method getValidatorConfig
+     * @description Returns persisted validator configuration by validator name.
+     * @param {string} type Validator name.
+     * @returns {any} Validator configuration value.
+     */
+    getValidatorConfig(type) {
+        /* Return persisted metadata for a specific validator type. */
+        return this._validatorConfigStore[type];
+    }
+    /**
+     * @method isRequiredActive
+     * @description Evaluates whether required validation is currently active, including dynamic conditional expressions.
+     * @returns {boolean} True when required is active for this control.
+     */
+    isRequiredActive() {
+        /* Check if the control has a native required validator. */
+        const nativeRequired = typeof this.hasValidator === 'function' ? this.hasValidator(Validators.required) : false;
+        /* Check if the control has a persisted required configuration. If not, probe the validators to determine if required is active. */
+        const requiredConfig = this.getValidatorConfig('required');
+        /* If no persisted configuration exists, probe the validators to determine if required is active. */
+        if (requiredConfig === undefined) {
+            /* Get the list of synchronous validators for this control. */
+            const validators = this.getValidators();
+            /* Check if any of the validators return a required error when evaluated with a probe control. */
+            const requiredByProbe = validators.some((validator) => {
+                try {
+                    /* Create a probe control to evaluate the validator without affecting the actual control state. */
+                    const probe = Object.create(this);
+                    /* Define a temporary value for the probe control to evaluate the validator. */
+                    Object.defineProperty(probe, 'value', {
+                        configurable: true,
+                        enumerable: true,
+                        value: null,
+                        writable: true
+                    });
+                    /* Evaluate the validator with the probe control and check if it returns a required error. */
+                    const result = validator(probe);
+                    /* Return true if the validator indicates that required validation is active. */
+                    return !!(result && result['required']);
+                }
+                catch {
+                    return false;
+                }
+            });
+            /* Return true if either the native required validator is present or if any of the validators indicate that required validation is active. */
+            return nativeRequired || requiredByProbe;
+        }
+        /* If a persisted required configuration exists, evaluate it to determine if required validation is active. */
+        if (typeof requiredConfig === 'boolean') {
+            return nativeRequired || requiredConfig;
+        }
+        /* If the persisted required configuration is an object, evaluate it using the FormProvider to determine if required validation is active. */
+        if (requiredConfig && typeof requiredConfig === 'object') {
+            return nativeRequired || !!FormProvider.processRule(this, requiredConfig);
+        }
+        /* Fallback to return true if either the native required validator is present or if the persisted required configuration is truthy. */
+        return nativeRequired || !!requiredConfig;
+    }
+    /**
+     * @method getValidatorSource
+     * @description Normalizes validator input to an array copy.
+     * @param {any[]} validators Validator value or array to normalize.
+     * @returns {any[]} Array of validators.
+     */
     getValidatorSource(validators) {
-        if (validators)
+        /* Normalize validators into an array to simplify downstream iteration. */
+        if (validators) {
             return Array.isArray(validators) ? [...validators] : [validators];
+        }
         return [];
     }
+    /**
+     * @method setValidators
+     * @description Sets synchronous validators and stores the source list.
+     * @param {ValidatorFn | ValidatorFn[] | null} newValidator Validator or validators to assign.
+     * @returns {void}
+     */
     setValidators(newValidator) {
+        /* Cache synchronous validators locally before delegating to Angular base implementation. */
         this._validators = newValidator;
         super.setValidators(newValidator);
     }
+    /**
+     * @method setAsyncValidators
+     * @description Sets asynchronous validators and stores the source list.
+     * @param {AsyncValidatorFn | AsyncValidatorFn[] | null} newValidator Async validator or validators to assign.
+     * @returns {void}
+     */
     setAsyncValidators(newValidator) {
+        /* Cache asynchronous validators locally before delegating to Angular base implementation. */
         this._asyncValidators = newValidator;
         super.setAsyncValidators(newValidator);
     }
+    /**
+     * @method setValue
+     * @description Sets control value, synchronizes entity/base objects, and runs expression hooks.
+     * @param {any} value New control value.
+     * @param {{ dirty?: boolean; updateChanged?: boolean; onlySelf?: boolean; emitEvent?: boolean; isThroughDynamic?: boolean; }} options Optional behavior flags.
+     * @returns {void}
+     */
     setValue(value, options) {
+        /* Synchronize value into entity/base structures, then run expression and patch hooks. */
+        /* Mark parent as currently changing to avoid recursive side effects. */
         this.parent.changing = true;
+        /* Sanitize incoming value before storing into bound entity object. */
         let parsedValue = this.getSanitizedValue(value);
-        if (options && options.dirty)
+        /* If requested, update the base object snapshot with raw value. */
+        if (options && options.dirty) {
             this._baseObject[this.keyName] = value;
+        }
+        /* Store sanitized value into bound entity model. */
         this._entityObject[this.keyName] = parsedValue;
+        /* Delegate actual control value update to base class implementation. */
         super.setValue(value, options);
+        /* Recompute and bind error messages after value change. */
         this.bindError();
+        /* Recompute and bind dynamic class output after value change. */
         this.bindClassName();
+        /* Execute conditional decorator expressions tied to this control. */
         this.executeExpressions();
+        /* Recompute modified state and invoke parent patch callback. */
         this.callPatch();
+        /* Notify root value-changed synchronization hook when enabled. */
         if (options && !options.updateChanged && this.root[VALUE_CHANGED_SYNC]) {
             this.root[VALUE_CHANGED_SYNC]();
         }
+        /* Clear parent changing marker after update pipeline completes. */
         this.parent.changing = false;
     }
+    /**
+     * @method getControlValue
+     * @description Returns the sanitized current control value.
+     * @returns {any} Sanitized control value.
+     */
     getControlValue() {
+        /* Return sanitized value representation for external consumers. */
         return this.getSanitizedValue(this.value);
     }
+    /**
+     * @method bindError
+     * @description Re-evaluates message expression and refreshes computed errors.
+     * @returns {void}
+     */
     bindError() {
-        if (this._messageExpression)
+        /* Evaluate error expression gates and refresh computed errors cache. */
+        if (this._messageExpression) {
             this._isPassedExpression = this.executeExpression(this._messageExpression, this);
+        }
+        /* Recompute error messages based on current errors and language context. */
         this.setControlErrorMessages();
-        var t = this;
-        t["errors"] = this.errors;
+        /* Update the language cache to reflect current language context. */
+        var self = this;
+        /* Update the errors property to trigger any dependent bindings or observers. */
+        self["errors"] = this.errors;
     }
+    /**
+     * @method bindClassName
+     * @description Evaluates and applies dynamic CSS class output for the control element.
+     * @returns {void}
+     */
     bindClassName() {
+        /* Evaluate and publish dynamic class-name output when a callback is configured. */
         if (this.updateOnElementClass && typeof this.updateOnElementClass === "function") {
             let className = this.executeExpression(this._classNameExpression, this);
             let updateElement = this.updateOnElementClass;
             updateElement(className);
         }
     }
+    /**
+     * @method setBackEndErrors
+     * @description Assigns backend validation errors to the control and updates visible messages.
+     * @param {{ [key: string]: string }} error Backend error map.
+     * @returns {void}
+     */
     setBackEndErrors(error) {
+        /* Merge backend errors into local storage and recompute visible messages. */
         Object.keys(error).forEach(key => this.backEndErrors[key] = error[key]);
+        /* Recompute visible error messages after backend error assignment. */
         this.setControlErrorMessages();
     }
+    /**
+     * @method clearBackEndErrors
+     * @description Clears all backend errors or selected backend error keys.
+     * @param {{ [key: string]: any } | undefined} errors Optional map of keys to remove.
+     * @returns {void}
+     */
     clearBackEndErrors(errors) {
-        if (!errors)
+        /* Remove all or selected backend errors, then refresh message state. */
+        if (!errors) {
             this.backEndErrors = {};
-        else
+        }
+        else {
             Object.keys(errors).forEach(t => delete this.backEndErrors[t]);
+        }
+        /* Recompute visible error messages after backend error clearance. */
         this.setControlErrorMessages();
     }
+    /**
+     * @method markAsTouched
+     * @description Marks control as touched and triggers dependent expression refreshes on state change.
+     * @param {{ onlySelf?: boolean } | undefined} opts Angular control options.
+     * @returns {void}
+     */
     markAsTouched(opts) {
+        /* Trigger dependent expression updates only when touched state actually changes. */
         let currentState = this.touched;
         super.markAsTouched(opts);
-        if (currentState != this.touched)
+        if (currentState != this.touched) {
             this.runControlPropChangeExpression([TOUCHED, UNTOUCHED]);
+        }
     }
+    /**
+     * @method markAsUntouched
+     * @description Marks control as untouched and triggers dependent expression refreshes on state change.
+     * @param {{ onlySelf?: boolean } | undefined} opts Angular control options.
+     * @returns {void}
+     */
     markAsUntouched(opts) {
+        /* Trigger dependent expression updates only when untouched state actually changes. */
         let currentState = this.untouched;
         super.markAsUntouched(opts);
-        if (currentState != this.untouched)
+        if (currentState != this.untouched) {
             this.runControlPropChangeExpression([UNTOUCHED, TOUCHED]);
+        }
     }
+    /**
+     * @method markAsDirty
+     * @description Marks control as dirty and triggers dependent expression refreshes on state change.
+     * @param {{ onlySelf?: boolean } | undefined} opts Angular control options.
+     * @returns {void}
+     */
     markAsDirty(opts) {
+        /* Keep custom dirty flag in sync and propagate expression updates when needed. */
         let currentState = this._dirty;
         super.markAsDirty(opts);
         this._dirty = true;
-        if (currentState != this._dirty)
+        if (currentState != this._dirty) {
             this.runControlPropChangeExpression([DIRTY]);
+        }
     }
+    /**
+     * @method markAsPristine
+     * @description Marks control as pristine and triggers dependent expression refreshes on state change.
+     * @param {{ onlySelf?: boolean } | undefined} opts Angular control options.
+     * @returns {void}
+     */
     markAsPristine(opts) {
+        /* Propagate expression updates only when pristine state actually changes. */
         let currentState = this.pristine;
         super.markAsPristine(opts);
-        if (currentState != this.pristine)
+        if (currentState != this.pristine) {
             this.runControlPropChangeExpression([PRISTINE]);
+        }
     }
+    /**
+     * @method markAsPending
+     * @description Marks control pending via base flow and triggers dependent expression refreshes on state change.
+     * @param {{ onlySelf?: boolean; emitEvent?: boolean } | undefined} opts Angular control options.
+     * @returns {void}
+     */
     markAsPending(opts) {
+        /* Propagate expression updates only when pending state actually changes. */
         let currentState = this.pending;
         super.markAsDirty(opts);
-        if (currentState != this.pending)
+        if (currentState != this.pending) {
             this.runControlPropChangeExpression([PENDING]);
+        }
     }
+    /**
+     * @method runControlPropChangeExpression
+     * @description Executes error/class expression updates for changed control state flags.
+     * @param {string[]} propNames State property names to evaluate.
+     * @returns {void}
+     */
     runControlPropChangeExpression(propNames) {
+        /* Re-run mapped error/class expressions for each changed control-state property. */
         propNames.forEach(name => {
-            if ((this._controlProp && this._messageExpression && this._controlProp[name]) || (!this._messageExpression && this.checkErrorMessageStrategy()))
+            /* Refresh errors when property is tracked by message-expression dependencies. */
+            if ((this._controlProp && this._messageExpression && this._controlProp[name]) || (!this._messageExpression && this.checkErrorMessageStrategy())) {
                 this.bindError();
-            if (this._classNameControlProp && this._classNameControlProp[name])
+            }
+            /* Refresh class names when property is tracked by class-expression dependencies. */
+            if (this._classNameControlProp && this._classNameControlProp[name]) {
                 this.bindClassName();
+            }
         });
     }
+    /**
+     * @method refresh
+     * @description Rebuilds decorator expressions and refreshes current error state.
+     * @returns {void}
+     */
     refresh() {
+        /* Rebind expressions and conditional controls, then refresh current error state. */
+        /* Reload expression metadata from model container. */
         this.getMessageExpression(this.parent, this.keyName);
+        /* Rebuild disabled-expression control references. */
         this.bindConditionalControls(DECORATORS["disabled"], "_refDisableControls");
+        /* Rebuild error-expression control references. */
         this.bindConditionalControls(DECORATORS["error"], "_refMessageControls");
+        /* Rebuild class-expression control references. */
         this.bindConditionalControls(DECORATORS["elementClass"], "_refClassNameControls");
+        /* Execute all expression pipelines with current state. */
         this.executeExpressions();
+        /* Rebind errors once references and expressions are refreshed. */
         this.bindError();
     }
+    /**
+     * @method reset
+     * @description Resets control value to provided value or stored base value and clears dirty flag.
+     * @param {any} value Optional value to reset to.
+     * @param {any} options Reset options passed to setValue.
+     * @returns {void}
+     */
     reset(value, options = {}) {
-        if (value !== undefined)
+        /* Reset to provided value or base snapshot and clear local dirty tracker. */
+        /* If a value is provided, reset using that value. */
+        if (value !== undefined) {
             this.setValue(value, options);
-        else
+        }
+        else {
+            /* Otherwise reset to stored base-value snapshot. */
             this.setValue(this.getFormState(this._baseValue), options);
+        }
+        /* Clear custom dirty state after reset. */
         this._dirty = false;
     }
+    /**
+     * @method commit
+     * @description Commits current value as base value and re-evaluates modification state.
+     * @returns {void}
+     */
     commit() {
+        /* Accept current value as new baseline and recompute modified state. */
         this._baseValue = this.value;
         this.callPatch();
     }
+    /**
+     * @method callPatch
+     * @description Updates modification flag and notifies parent patch hook when available.
+     * @returns {void}
+     */
     callPatch() {
+        /* Update modified flag and notify parent patch callback when available. */
+        /* Compare normalized base/current values to compute modified state. */
         this._isModified = this.getValue(this._baseValue) != this.getValue(this.value);
-        if (this.parent && this.parent[PATCH])
+        /* Notify parent patch callback when parent exposes it. */
+        if (this.parent && this.parent[PATCH]) {
             this.parent[PATCH](this.keyName);
+        }
     }
+    /**
+     * @method checkErrorMessageStrategy
+     * @description Evaluates whether error messages should be bound according to strategy and state.
+     * @returns {boolean} True when error binding is currently enabled.
+     */
     checkErrorMessageStrategy() {
+        /* Resolve whether error messages should bind under the configured strategy. */
+        /* Initialize with bind-enabled default. */
         let isBind = true;
+        /* Switch by configured error-binding strategy. */
         switch (this._errorMessageBindingStrategy) {
             case ErrorMessageBindingStrategy.OnSubmit:
+                /* Bind only after form submission. */
                 isBind = this.parent.submitted;
                 break;
             case ErrorMessageBindingStrategy.OnDirty:
+                /* Bind only when control is dirty. */
                 isBind = this._dirty;
                 break;
             case ErrorMessageBindingStrategy.OnTouched:
+                /* Bind only when control is touched. */
                 isBind = this.touched;
                 break;
             case ErrorMessageBindingStrategy.OnDirtyOrTouched:
+                /* Bind when control is dirty or touched. */
                 isBind = this._dirty || this.touched;
                 break;
             case ErrorMessageBindingStrategy.OnDirtyOrSubmit:
+                /* Bind when control is dirty or form is submitted. */
                 isBind = this._dirty || this.parent.submitted;
                 break;
             case ErrorMessageBindingStrategy.OnTouchedOrSubmit:
+                /* Bind when control is touched or form is submitted. */
                 isBind = this.touched || this.parent.submitted;
                 break;
             default:
+                /* Fallback strategy keeps binding enabled. */
                 isBind = true;
         }
+        /* Return final strategy decision. */
         return isBind;
     }
+    /**
+     * @method executeExpressions
+     * @description Executes conditional decorator expressions for disabled state, errors, and element classes.
+     * @returns {void}
+     */
     executeExpressions() {
+        /* Execute conditional expressions for disabled, error, and class-name behaviors. */
         this.processExpression("_refDisableControls", "disabled");
         this.processExpression("_refMessageControls", "bindError");
         this.processExpression("_refClassNameControls", "bindClassName");
     }
+    /**
+     * @method getMessageExpression
+     * @description Loads message/class expression metadata from the model container.
+     * @param {FormGroup} formGroup Parent form group.
+     * @param {string} keyName Control key name.
+     * @returns {void}
+     */
     getMessageExpression(formGroup, keyName) {
+        /* Load decorator metadata that drives conditional error and class bindings. */
+        /* Proceed only when form group contains model instance metadata. */
         if (formGroup[MODEL_INSTANCE]) {
+            /* Resolve metadata container for the model instance constructor. */
             let instanceContainer = defaultContainer.get(formGroup[MODEL_INSTANCE].constructor);
+            /* Apply metadata only when a container is found. */
             if (instanceContainer) {
+                /* Load conditional message expression for this control key. */
                 this._messageExpression = instanceContainer.nonValidationDecorators.error.conditionalExpressions[keyName];
+                /* Load control-property dependencies for message updates. */
                 this._controlProp = instanceContainer.nonValidationDecorators.error.controlProp[this.keyName];
+                /* Load conditional class-name expression for this control key. */
                 this._classNameExpression = instanceContainer.nonValidationDecorators.elementClass.conditionalExpressions[keyName];
+                /* Load control-property dependencies for class-name updates. */
                 this._classNameControlProp = instanceContainer.nonValidationDecorators.elementClass.controlProp[keyName];
-                if (this._classNameExpression)
+                /* Enable element-class update mode when class expression exists. */
+                if (this._classNameExpression) {
                     this.updateOnElementClass = true;
+                }
             }
         }
     }
+    /**
+     * @method getSanitizedValue
+     * @description Applies configured sanitizers to a value in declaration order.
+     * @param {any} value Raw value.
+     * @returns {any} Sanitized value.
+     */
     getSanitizedValue(value) {
+        /* Apply configured sanitizers in order to normalize outgoing values. */
+        /* Iterate all configured sanitizers if available. */
         if (this._sanitizers) {
             for (let sanitizer of this._sanitizers) {
+                /* Apply sanitizer transformation with its configuration. */
                 value = SANITIZERS[sanitizer.name](value, sanitizer.config);
             }
         }
+        /* Return sanitized value result. */
         return value;
     }
+    /**
+     * @method bindConditionalControls
+     * @description Builds and stores control references for conditional decorator expressions.
+     * @param {string} decoratorType Decorator type key.
+     * @param {string} refName Property name that stores computed references.
+     * @returns {void}
+     */
     bindConditionalControls(decoratorType, refName) {
+        /* Create provider for requested decorator type and entity context. */
         this._disableProvider = new DisableProvider(decoratorType, this._entityObject);
+        /* Load zero-argument expression control references. */
         this[refName] = this._disableProvider.zeroArgumentProcess(this, this.keyName);
+        /* Append one-argument expression control references. */
         this._disableProvider.oneArgumentProcess(this, `${this.keyName}${RXCODE}1`).forEach(t => this[refName].push(t));
     }
+    /**
+     * @method setControlErrorMessages
+     * @description Computes and stores control error messages from validation and backend sources.
+     * @returns {void}
+     */
     setControlErrorMessages() {
+        /* Build error messages when strategy allows binding or expression passes. */
         if ((!this._messageExpression && this.checkErrorMessageStrategy()) || this._isPassedExpression) {
+            /* Reset error-message collection before rebuild. */
             this._errorMessages = [];
+            /* Process validation errors when present. */
             if (this.errors) {
                 Object.keys(this.errors).forEach(t => {
+                    /* If parent exists, also sync into parent control-error registry. */
                     if (this.parent) {
                         this.parent[CONTROLS_ERROR][this.keyName] = this._errorMessage = this.getErrorMessage(this.errors, t);
+                        /* Fallback to shaped error object when direct message is missing. */
                         if (!this._errorMessage) {
                             let errorObject = ObjectMaker.toJson(t, undefined, this.errors[t] && this.errors[t][t] ? [this.errors[t][t]] : []);
                             this.parent[CONTROLS_ERROR][this.keyName] = this._errorMessage = this.getErrorMessage(errorObject, t);
                         }
                     }
                     else {
+                        /* Resolve message directly when parent context is not available. */
                         this._errorMessage = this.getErrorMessage(this.errors, t);
                     }
+                    /* Append resolved message to message list. */
                     this._errorMessages.push(this._errorMessage);
                 });
             }
             else {
+                /* Clear current message when no validation errors remain. */
                 this._errorMessage = undefined;
+                /* Remove parent control-error registry value when parent exists. */
                 if (this.parent) {
                     this.parent[CONTROLS_ERROR][this.keyName] = undefined;
                     delete this.parent[CONTROLS_ERROR][this.keyName];
                 }
             }
+            /* Merge backend error messages after validator-message build. */
             let backEndErrors = Object.keys(this.backEndErrors);
-            if (backEndErrors.length > 0)
+            if (backEndErrors.length > 0) {
                 backEndErrors.forEach(t => { this._errorMessages.push(this._errorMessage = this.backEndErrors[t]); });
+            }
         }
         else {
+            /* Expression/strategy says hide errors, so clear caches. */
             this._errorMessages = [];
             this._errorMessage = undefined;
         }
+        /* Store language snapshot used for current error-message cache. */
         this._language = this.getLanguage();
     }
+    /**
+     * @method getLanguage
+     * @description Gets active language from reactive form i18n config.
+     * @returns {string | undefined} Active language code.
+     */
     getLanguage() {
+        /* Return the current reactive-form language code when i18n is configured. */
         return (ReactiveFormConfig.i18n && ReactiveFormConfig.i18n.language) ? ReactiveFormConfig.i18n.language : undefined;
     }
+    /**
+     * @method getErrorMessage
+     * @description Reads a formatted error message for a validation key.
+     * @param {{ [key: string]: string }} errorObject Validation error object.
+     * @param {string} keyName Validation key.
+     * @returns {string | undefined} Resolved error message.
+     */
     getErrorMessage(errorObject, keyName) {
+        /* Return resolved message when payload is present for key. */
         if (errorObject[keyName] && errorObject[keyName][MESSAGE]) {
             return errorObject[keyName][MESSAGE];
         }
+        /* Return undefined when no message payload exists. */
         return;
     }
+    /**
+     * @method processExpression
+     * @description Applies a conditional operation to referenced controls.
+     * @param {string} propName Reference property name.
+     * @param {string} operationType Operation identifier.
+     * @returns {void}
+     */
     processExpression(propName, operationType) {
-        if (this[propName])
+        /* Proceed only when expression reference list exists. */
+        if (this[propName]) {
             for (var controlInfo of this[propName]) {
+                /* Resolve target control either from root scope or relative scope. */
                 let control = controlInfo.isRoot ? ApplicationUtil.getControl(controlInfo.controlPath, ApplicationUtil.getRootFormGroup(this)) : ApplicationUtil.getFormControl(controlInfo.controlPath, this);
+                /* Execute operation only when target control is resolved. */
                 if (control) {
                     if (operationType == "disabled") {
+                        /* Evaluate conditional expression to determine disabled state. */
                         let result = this.executeExpression(controlInfo.conditionalExpression, control);
-                        if (result)
+                        if (result) {
+                            /* Disable target control when expression evaluates truthy. */
                             control.disable();
-                        else
+                        }
+                        else {
+                            /* Enable target control when expression evaluates falsy. */
                             control.enable();
+                        }
                     }
-                    else if (operationType == "bindError")
+                    else if (operationType == "bindError") {
+                        /* Trigger error binding pipeline on target control. */
                         control.bindError();
-                    else if (operationType == "bindClassName")
+                    }
+                    else if (operationType == "bindClassName") {
+                        /* Trigger class-name binding pipeline on target control. */
                         control.bindClassName();
+                    }
                 }
             }
+        }
     }
+    /**
+     * @method executeExpression
+     * @description Executes a conditional expression using model instance context.
+     * @param {Function} expression Expression function.
+     * @param {AbstractControl} control Control used as expression argument.
+     * @returns {Boolean} Expression result.
+     */
     executeExpression(expression, control) {
+        /* Execute expression with model instance context and parent-model helpers. */
         return expression.call(control.parent[MODEL_INSTANCE], control, ApplicationUtil.getParentModelInstanceValue(this), control.parent[MODEL_INSTANCE]);
     }
+    /**
+     * @method getValue
+     * @description Normalizes nullable/empty values for comparison.
+     * @param {any} value Source value.
+     * @returns {any} Normalized comparable value.
+     */
     getValue(value) {
+        /* Normalize nullable and empty values for stable comparisons. */
         return value !== undefined && value !== null && value !== "" ? value : "";
     }
 }
@@ -11390,7 +11849,7 @@ function rangeAsyncValidatorExtension(config) {
 }
 
 function requiredValidatorExtension(config) {
-    return baseValidator(config, AnnotationTypes["required"], requiredValidator(config));
+    return baseValidator(config ?? true, AnnotationTypes["required"], requiredValidator(config));
 }
 
 function timeValidatorExtension(config) {
@@ -23168,6 +23627,60 @@ var FormFieldType;
     FormFieldType[FormFieldType["Custom"] = 100] = "Custom";
 })(FormFieldType || (FormFieldType = {}));
 
+/**
+ * @function hasRequiredValidator
+ * @description Checks required state using runtime marker, native Angular validators and Rx validator metadata.
+ * @param {AbstractControl | null | undefined} control The control to evaluate.
+ * @returns {boolean} True when the control should be treated as required.
+ */
+const hasRequiredValidator = (control) => {
+    if (!control) {
+        return false;
+    }
+    /* Use the explicit required-state API when available on the control instance. */
+    const controlWithRequiredApi = control;
+    if (typeof controlWithRequiredApi.isRequiredActive === 'function') {
+        return controlWithRequiredApi.isRequiredActive();
+    }
+    /* Fallback for plain Angular controls that do not use RxFormControl. */
+    return typeof control.hasValidator === 'function' ? control.hasValidator(Validators.required) : false;
+};
+
+/**
+ * @class MatInputRequiredDirective
+ * @description Synchronizes Angular Material input required marker with tracked control required state.
+ */
+class MatInputRequiredDirective {
+    input;
+    /**
+     * @constructor
+     * @param {MatInput} input Material input instance.
+     */
+    constructor(input) {
+        this.input = input;
+    }
+    /**
+     * @method ngDoCheck
+     * @description Updates Material input required flag when control required state changes.
+     */
+    ngDoCheck() {
+        const isRequired = hasRequiredValidator(this.input.ngControl?.control);
+        if (isRequired !== this.input.required) {
+            this.input.required = isRequired;
+            this.input.ngOnChanges();
+        }
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: MatInputRequiredDirective, deps: [{ token: i3$2.MatInput }], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.0.7", type: MatInputRequiredDirective, isStandalone: true, selector: "[matInput][formControl]:not([required]), [matInput][formControlName]:not([required])", ngImport: i0 });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: MatInputRequiredDirective, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: '[matInput][formControl]:not([required]), [matInput][formControlName]:not([required])',
+                    standalone: true
+                }]
+        }], ctorParameters: () => [{ type: i3$2.MatInput }] });
+
 /**
  * Directive that optionally enforces a fixed, non-removable prefix
  * at the beginning of an input field.
@@ -23904,7 +24417,7 @@ class MsaGenericFormAutocompleteFieldComponent extends MsaGenericFormFieldBaseCo
                 <mat-error>{{errorMessage}}</mat-error>
             }
         </mat-form-field>
-    `, isInline: true, styles: ["mat-form-field{width:100%;height:100%}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$1.DefaultValueAccessor, selector: "input:not([type=checkbox]):not([ngNoCva])[formControlName],textarea:not([ngNoCva])[formControlName],input:not([type=checkbox]):not([ngNoCva])[formControl],textarea:not([ngNoCva])[formControl],input:not([type=checkbox]):not([ngNoCva])[ngModel],textarea:not([ngNoCva])[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "ngmodule", type: MatFormFieldModule }, { kind: "component", type: i2$1.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i2$1.MatLabel, selector: "mat-label" }, { kind: "directive", type: i2$1.MatHint, selector: "mat-hint", inputs: ["align", "id"] }, { kind: "directive", type: i2$1.MatError, selector: "mat-error, [matError]", inputs: ["id"] }, { kind: "directive", type: i2$1.MatSuffix, selector: "[matSuffix], [matIconSuffix], [matTextSuffix]", inputs: ["matTextSuffix"] }, { kind: "ngmodule", type: MatInputModule }, { kind: "directive", type: i3$2.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl],      input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly", "disabledInteractive"], exportAs: ["matInput"] }, { kind: "ngmodule", type: MatAutocompleteModule }, { kind: "component", type: i4$2.MatAutocomplete, selector: "mat-autocomplete", inputs: ["aria-label", "aria-labelledby", "displayWith", "autoActiveFirstOption", "autoSelectActiveOption", "requireSelection", "panelWidth", "disableRipple", "class", "hideSingleSelectionIndicator"], outputs: ["optionSelected", "opened", "closed", "optionActivated"], exportAs: ["matAutocomplete"] }, { kind: "component", type: i2$2.MatOption, selector: "mat-option", inputs: ["value", "id", "disabled"], outputs: ["onSelectionChange"], exportAs: ["matOption"] }, { kind: "directive", type: i4$2.MatAutocompleteTrigger, selector: "input[matAutocomplete], textarea[matAutocomplete]", inputs: ["matAutocomplete", "matAutocompletePosition", "matAutocompleteConnectedTo", "autocomplete", "matAutocompleteDisabled"], exportAs: ["matAutocompleteTrigger"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i4.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: MatIconButton, selector: "button[mat-icon-button], a[mat-icon-button], button[matIconButton], a[matIconButton]", exportAs: ["matButton", "matAnchor"] }, { kind: "directive", type: PrefixDirective, selector: "[prefix]", inputs: ["prefix"] }, { kind: "pipe", type: FuncPipe, name: "func" }], viewProviders: [{ provide: ControlContainer, useExisting: FormGroupDirective }] });
+    `, isInline: true, styles: ["mat-form-field{width:100%;height:100%}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$1.DefaultValueAccessor, selector: "input:not([type=checkbox]):not([ngNoCva])[formControlName],textarea:not([ngNoCva])[formControlName],input:not([type=checkbox]):not([ngNoCva])[formControl],textarea:not([ngNoCva])[formControl],input:not([type=checkbox]):not([ngNoCva])[ngModel],textarea:not([ngNoCva])[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "ngmodule", type: MatFormFieldModule }, { kind: "component", type: i2$1.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i2$1.MatLabel, selector: "mat-label" }, { kind: "directive", type: i2$1.MatHint, selector: "mat-hint", inputs: ["align", "id"] }, { kind: "directive", type: i2$1.MatError, selector: "mat-error, [matError]", inputs: ["id"] }, { kind: "directive", type: i2$1.MatSuffix, selector: "[matSuffix], [matIconSuffix], [matTextSuffix]", inputs: ["matTextSuffix"] }, { kind: "ngmodule", type: MatInputModule }, { kind: "directive", type: i3$2.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl],      input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly", "disabledInteractive"], exportAs: ["matInput"] }, { kind: "ngmodule", type: MatAutocompleteModule }, { kind: "component", type: i4$2.MatAutocomplete, selector: "mat-autocomplete", inputs: ["aria-label", "aria-labelledby", "displayWith", "autoActiveFirstOption", "autoSelectActiveOption", "requireSelection", "panelWidth", "disableRipple", "class", "hideSingleSelectionIndicator"], outputs: ["optionSelected", "opened", "closed", "optionActivated"], exportAs: ["matAutocomplete"] }, { kind: "component", type: i2$2.MatOption, selector: "mat-option", inputs: ["value", "id", "disabled"], outputs: ["onSelectionChange"], exportAs: ["matOption"] }, { kind: "directive", type: i4$2.MatAutocompleteTrigger, selector: "input[matAutocomplete], textarea[matAutocomplete]", inputs: ["matAutocomplete", "matAutocompletePosition", "matAutocompleteConnectedTo", "autocomplete", "matAutocompleteDisabled"], exportAs: ["matAutocompleteTrigger"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i4.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: MatIconButton, selector: "button[mat-icon-button], a[mat-icon-button], button[matIconButton], a[matIconButton]", exportAs: ["matButton", "matAnchor"] }, { kind: "directive", type: MatInputRequiredDirective, selector: "[matInput][formControl]:not([required]), [matInput][formControlName]:not([required])" }, { kind: "directive", type: PrefixDirective, selector: "[prefix]", inputs: ["prefix"] }, { kind: "pipe", type: FuncPipe, name: "func" }], viewProviders: [{ provide: ControlContainer, useExisting: FormGroupDirective }] });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: MsaGenericFormAutocompleteFieldComponent, decorators: [{
             type: Component,
@@ -23916,6 +24429,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.7", ngImpor
                         MatAutocompleteModule,
                         MatIconModule,
                         MatIconButton,
+                        MatInputRequiredDirective,
                         PrefixDirective,
                         FuncPipe
                     ], viewProviders: [{ provide: ControlContainer, useExisting: FormGroupDirective }], template: `
@@ -24000,11 +24514,11 @@ class MsaGenericFormCalendarFieldComponent extends MsaGenericFormFieldBaseCompon
                 <mat-error layout-margin>{{errorMessage}}</mat-error>
             }
         </mat-form-field>
-    `, isInline: true, styles: ["mat-form-field{width:100%;height:100%}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$1.DefaultValueAccessor, selector: "input:not([type=checkbox]):not([ngNoCva])[formControlName],textarea:not([ngNoCva])[formControlName],input:not([type=checkbox]):not([ngNoCva])[formControl],textarea:not([ngNoCva])[formControl],input:not([type=checkbox]):not([ngNoCva])[ngModel],textarea:not([ngNoCva])[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "ngmodule", type: MatFormFieldModule }, { kind: "component", type: i2$1.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i2$1.MatLabel, selector: "mat-label" }, { kind: "directive", type: i2$1.MatHint, selector: "mat-hint", inputs: ["align", "id"] }, { kind: "directive", type: i2$1.MatError, selector: "mat-error, [matError]", inputs: ["id"] }, { kind: "ngmodule", type: MatInputModule }, { kind: "directive", type: i3$2.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl],      input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly", "disabledInteractive"], exportAs: ["matInput"] }, { kind: "ngmodule", type: MatDatepickerModule }, { kind: "component", type: i4$1.MatCalendar, selector: "mat-calendar", inputs: ["headerComponent", "startAt", "startView", "selected", "minDate", "maxDate", "dateFilter", "dateClass", "comparisonStart", "comparisonEnd", "startDateAccessibleName", "endDateAccessibleName"], outputs: ["selectedChange", "yearSelected", "monthSelected", "viewChanged", "_userSelection", "_userDragDrop"], exportAs: ["matCalendar"] }], viewProviders: [{ provide: ControlContainer, useExisting: FormGroupDirective }] });
+    `, isInline: true, styles: ["mat-form-field{width:100%;height:100%}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$1.DefaultValueAccessor, selector: "input:not([type=checkbox]):not([ngNoCva])[formControlName],textarea:not([ngNoCva])[formControlName],input:not([type=checkbox]):not([ngNoCva])[formControl],textarea:not([ngNoCva])[formControl],input:not([type=checkbox]):not([ngNoCva])[ngModel],textarea:not([ngNoCva])[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "ngmodule", type: MatFormFieldModule }, { kind: "component", type: i2$1.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i2$1.MatLabel, selector: "mat-label" }, { kind: "directive", type: i2$1.MatHint, selector: "mat-hint", inputs: ["align", "id"] }, { kind: "directive", type: i2$1.MatError, selector: "mat-error, [matError]", inputs: ["id"] }, { kind: "ngmodule", type: MatInputModule }, { kind: "directive", type: i3$2.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl],      input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly", "disabledInteractive"], exportAs: ["matInput"] }, { kind: "ngmodule", type: MatDatepickerModule }, { kind: "component", type: i4$1.MatCalendar, selector: "mat-calendar", inputs: ["headerComponent", "startAt", "startView", "selected", "minDate", "maxDate", "dateFilter", "dateClass", "comparisonStart", "comparisonEnd", "startDateAccessibleName", "endDateAccessibleName"], outputs: ["selectedChange", "yearSelected", "monthSelected", "viewChanged", "_userSelection", "_userDragDrop"], exportAs: ["matCalendar"] }, { kind: "directive", type: MatInputRequiredDirective, selector: "[matInput][formControl]:not([required]), [matInput][formControlName]:not([required])" }], viewProviders: [{ provide: ControlContainer, useExisting: FormGroupDirective }] });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: MsaGenericFormCalendarFieldComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'msa-generic-form-calendar-field', standalone: true, imports: [CommonModule, ReactiveFormsModule, MatFormFieldModule, MatInputModule, MatDatepickerModule], viewProviders: [{ provide: ControlContainer, useExisting: FormGroupDirective }], template: `
+            args: [{ selector: 'msa-generic-form-calendar-field', standalone: true, imports: [CommonModule, ReactiveFormsModule, MatFormFieldModule, MatInputModule, MatDatepickerModule, MatInputRequiredDirective], viewProviders: [{ provide: ControlContainer, useExisting: FormGroupDirective }], template: `
         <mat-form-field [class]="field.cssClass" floatLabel="always" class="form-field-type-calendar">
             <mat-label>{{field.label}}</mat-label>
             <input input="hidden" hidden matInput [formControlName]="field.name!" />
@@ -24335,7 +24849,7 @@ class MsaGenericFormColorFieldComponent extends MsaGenericFormFieldBaseComponent
                 <mat-error>{{errorMessage}}</mat-error>
             }
         </mat-form-field>
-    `, isInline: true, styles: ["mat-form-field{width:100%;height:100%}.color-picker{width:1.6rem!important;height:1.6rem!important;padding:2px!important;margin:8px;display:inline-block;box-sizing:border-box;border-color:transparent!important;border-radius:100%;background:#fff;cursor:pointer;padding:3px;box-shadow:0 1px 1px #0003,0 1px 1px 1px #00000024,0 1px 1px 1px #0000001f;appearance:none;-webkit-appearance:none}.color-picker::-webkit-color-swatch-wrapper{padding:0}.color-picker::-webkit-color-swatch{border:1px solid rgba(0,0,0,.2);border-radius:999px}.color-picker::-moz-color-swatch{border:1px solid rgba(0,0,0,.2);border-radius:999px}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$1.DefaultValueAccessor, selector: "input:not([type=checkbox]):not([ngNoCva])[formControlName],textarea:not([ngNoCva])[formControlName],input:not([type=checkbox]):not([ngNoCva])[formControl],textarea:not([ngNoCva])[formControl],input:not([type=checkbox]):not([ngNoCva])[ngModel],textarea:not([ngNoCva])[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.MinLengthValidator, selector: "[minlength][formControlName],[minlength][formControl],[minlength][ngModel]", inputs: ["minlength"] }, { kind: "directive", type: i1$1.MaxLengthValidator, selector: "[maxlength][formControlName],[maxlength][formControl],[maxlength][ngModel]", inputs: ["maxlength"] }, { kind: "directive", type: i1$1.PatternValidator, selector: "[pattern][formControlName],[pattern][formControl],[pattern][ngModel]", inputs: ["pattern"] }, { kind: "directive", type: i1$1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "ngmodule", type: MatFormFieldModule }, { kind: "component", type: i2$1.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i2$1.MatLabel, selector: "mat-label" }, { kind: "directive", type: i2$1.MatHint, selector: "mat-hint", inputs: ["align", "id"] }, { kind: "directive", type: i2$1.MatError, selector: "mat-error, [matError]", inputs: ["id"] }, { kind: "directive", type: i2$1.MatSuffix, selector: "[matSuffix], [matIconSuffix], [matTextSuffix]", inputs: ["matTextSuffix"] }, { kind: "ngmodule", type: MatInputModule }, { kind: "directive", type: i3$2.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl],      input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly", "disabledInteractive"], exportAs: ["matInput"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i4.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: MatIconButton, selector: "button[mat-icon-button], a[mat-icon-button], button[matIconButton], a[matIconButton]", exportAs: ["matButton", "matAnchor"] }, { kind: "directive", type: OnlyNumberDirective, selector: "[onlyNumber]", inputs: ["onlyNumber", "excludePrefix"] }, { kind: "pipe", type: FuncPipe, name: "func" }], viewProviders: [{ provide: ControlContainer, useExisting: FormGroupDirective }] });
+    `, isInline: true, styles: ["mat-form-field{width:100%;height:100%}.color-picker{width:1.6rem!important;height:1.6rem!important;padding:2px!important;margin:8px;display:inline-block;box-sizing:border-box;border-color:transparent!important;border-radius:100%;background:#fff;cursor:pointer;padding:3px;box-shadow:0 1px 1px #0003,0 1px 1px 1px #00000024,0 1px 1px 1px #0000001f;appearance:none;-webkit-appearance:none}.color-picker::-webkit-color-swatch-wrapper{padding:0}.color-picker::-webkit-color-swatch{border:1px solid rgba(0,0,0,.2);border-radius:999px}.color-picker::-moz-color-swatch{border:1px solid rgba(0,0,0,.2);border-radius:999px}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$1.DefaultValueAccessor, selector: "input:not([type=checkbox]):not([ngNoCva])[formControlName],textarea:not([ngNoCva])[formControlName],input:not([type=checkbox]):not([ngNoCva])[formControl],textarea:not([ngNoCva])[formControl],input:not([type=checkbox]):not([ngNoCva])[ngModel],textarea:not([ngNoCva])[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.MinLengthValidator, selector: "[minlength][formControlName],[minlength][formControl],[minlength][ngModel]", inputs: ["minlength"] }, { kind: "directive", type: i1$1.MaxLengthValidator, selector: "[maxlength][formControlName],[maxlength][formControl],[maxlength][ngModel]", inputs: ["maxlength"] }, { kind: "directive", type: i1$1.PatternValidator, selector: "[pattern][formControlName],[pattern][formControl],[pattern][ngModel]", inputs: ["pattern"] }, { kind: "directive", type: i1$1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "ngmodule", type: MatFormFieldModule }, { kind: "component", type: i2$1.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i2$1.MatLabel, selector: "mat-label" }, { kind: "directive", type: i2$1.MatHint, selector: "mat-hint", inputs: ["align", "id"] }, { kind: "directive", type: i2$1.MatError, selector: "mat-error, [matError]", inputs: ["id"] }, { kind: "directive", type: i2$1.MatSuffix, selector: "[matSuffix], [matIconSuffix], [matTextSuffix]", inputs: ["matTextSuffix"] }, { kind: "ngmodule", type: MatInputModule }, { kind: "directive", type: i3$2.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl],      input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly", "disabledInteractive"], exportAs: ["matInput"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i4.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: MatIconButton, selector: "button[mat-icon-button], a[mat-icon-button], button[matIconButton], a[matIconButton]", exportAs: ["matButton", "matAnchor"] }, { kind: "directive", type: MatInputRequiredDirective, selector: "[matInput][formControl]:not([required]), [matInput][formControlName]:not([required])" }, { kind: "directive", type: OnlyNumberDirective, selector: "[onlyNumber]", inputs: ["onlyNumber", "excludePrefix"] }, { kind: "pipe", type: FuncPipe, name: "func" }], viewProviders: [{ provide: ControlContainer, useExisting: FormGroupDirective }] });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: MsaGenericFormColorFieldComponent, decorators: [{
             type: Component,
@@ -24346,6 +24860,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.7", ngImpor
                         MatInputModule,
                         MatIconModule,
                         MatIconButton,
+                        MatInputRequiredDirective,
                         FuncPipe,
                         OnlyNumberDirective
                     ], viewProviders: [{ provide: ControlContainer, useExisting: FormGroupDirective }], template: `
@@ -24486,11 +25001,11 @@ class MsaGenericFormDateFieldComponent extends MsaGenericFormFieldBaseComponent
                 <mat-error>{{errorMessage}}</mat-error>
             }
         </mat-form-field>
-    `, isInline: true, styles: ["mat-form-field{width:100%;height:100%}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$1.DefaultValueAccessor, selector: "input:not([type=checkbox]):not([ngNoCva])[formControlName],textarea:not([ngNoCva])[formControlName],input:not([type=checkbox]):not([ngNoCva])[formControl],textarea:not([ngNoCva])[formControl],input:not([type=checkbox]):not([ngNoCva])[ngModel],textarea:not([ngNoCva])[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "ngmodule", type: MatFormFieldModule }, { kind: "component", type: i2$1.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i2$1.MatLabel, selector: "mat-label" }, { kind: "directive", type: i2$1.MatHint, selector: "mat-hint", inputs: ["align", "id"] }, { kind: "directive", type: i2$1.MatError, selector: "mat-error, [matError]", inputs: ["id"] }, { kind: "directive", type: i2$1.MatSuffix, selector: "[matSuffix], [matIconSuffix], [matTextSuffix]", inputs: ["matTextSuffix"] }, { kind: "ngmodule", type: MatInputModule }, { kind: "directive", type: i3$2.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl],      input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly", "disabledInteractive"], exportAs: ["matInput"] }, { kind: "ngmodule", type: MatDatepickerModule }, { kind: "component", type: i4$1.MatDatepicker, selector: "mat-datepicker", exportAs: ["matDatepicker"] }, { kind: "directive", type: i4$1.MatDatepickerInput, selector: "input[matDatepicker]", inputs: ["matDatepicker", "min", "max", "matDatepickerFilter"], exportAs: ["matDatepickerInput"] }, { kind: "component", type: i4$1.MatDatepickerToggle, selector: "mat-datepicker-toggle", inputs: ["for", "tabIndex", "aria-label", "disabled", "disableRipple"], exportAs: ["matDatepickerToggle"] }, { kind: "pipe", type: i1$2.DatePipe, name: "date" }], viewProviders: [{ provide: ControlContainer, useExisting: FormGroupDirective }] });
+    `, isInline: true, styles: ["mat-form-field{width:100%;height:100%}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$1.DefaultValueAccessor, selector: "input:not([type=checkbox]):not([ngNoCva])[formControlName],textarea:not([ngNoCva])[formControlName],input:not([type=checkbox]):not([ngNoCva])[formControl],textarea:not([ngNoCva])[formControl],input:not([type=checkbox]):not([ngNoCva])[ngModel],textarea:not([ngNoCva])[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "ngmodule", type: MatFormFieldModule }, { kind: "component", type: i2$1.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i2$1.MatLabel, selector: "mat-label" }, { kind: "directive", type: i2$1.MatHint, selector: "mat-hint", inputs: ["align", "id"] }, { kind: "directive", type: i2$1.MatError, selector: "mat-error, [matError]", inputs: ["id"] }, { kind: "directive", type: i2$1.MatSuffix, selector: "[matSuffix], [matIconSuffix], [matTextSuffix]", inputs: ["matTextSuffix"] }, { kind: "ngmodule", type: MatInputModule }, { kind: "directive", type: i3$2.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl],      input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly", "disabledInteractive"], exportAs: ["matInput"] }, { kind: "ngmodule", type: MatDatepickerModule }, { kind: "component", type: i4$1.MatDatepicker, selector: "mat-datepicker", exportAs: ["matDatepicker"] }, { kind: "directive", type: i4$1.MatDatepickerInput, selector: "input[matDatepicker]", inputs: ["matDatepicker", "min", "max", "matDatepickerFilter"], exportAs: ["matDatepickerInput"] }, { kind: "component", type: i4$1.MatDatepickerToggle, selector: "mat-datepicker-toggle", inputs: ["for", "tabIndex", "aria-label", "disabled", "disableRipple"], exportAs: ["matDatepickerToggle"] }, { kind: "directive", type: MatInputRequiredDirective, selector: "[matInput][formControl]:not([required]), [matInput][formControlName]:not([required])" }, { kind: "pipe", type: i1$2.DatePipe, name: "date" }], viewProviders: [{ provide: ControlContainer, useExisting: FormGroupDirective }] });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: MsaGenericFormDateFieldComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'msa-generic-form-date-field', standalone: true, imports: [CommonModule, ReactiveFormsModule, MatFormFieldModule, MatInputModule, MatDatepickerModule], viewProviders: [{ provide: ControlContainer, useExisting: FormGroupDirective }], template: `
+            args: [{ selector: 'msa-generic-form-date-field', standalone: true, imports: [CommonModule, ReactiveFormsModule, MatFormFieldModule, MatInputModule, MatDatepickerModule, MatInputRequiredDirective], viewProviders: [{ provide: ControlContainer, useExisting: FormGroupDirective }], template: `
         <mat-form-field [class]="field.cssClass">
             <mat-label>{{field.label}}</mat-label>
             <div flex layout="row" layout-align="start center" [class]="{'has-time': field.showTime}">
@@ -25521,6 +26036,40 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.7", ngImpor
     `, styles: ["mat-form-field{width:100%;height:100%}\n"] }]
         }] });
 
+/**
+ * @class MatSelectRequiredDirective
+ * @description Synchronizes Angular Material select required marker with tracked control required state.
+ */
+class MatSelectRequiredDirective {
+    input;
+    /**
+     * @constructor
+     * @param {MatSelect} input Material select instance.
+     */
+    constructor(input) {
+        this.input = input;
+    }
+    /**
+     * @method ngDoCheck
+     * @description Updates Material select required flag when control required state changes.
+     */
+    ngDoCheck() {
+        const isRequired = hasRequiredValidator(this.input.ngControl?.control);
+        if (isRequired !== this.input.required) {
+            this.input.required = isRequired;
+        }
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: MatSelectRequiredDirective, deps: [{ token: i2$2.MatSelect }], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.0.7", type: MatSelectRequiredDirective, isStandalone: true, selector: "mat-select[formControl]:not([required]), mat-select[formControlName]:not([required])", ngImport: i0 });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: MatSelectRequiredDirective, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: 'mat-select[formControl]:not([required]), mat-select[formControlName]:not([required])',
+                    standalone: true
+                }]
+        }], ctorParameters: () => [{ type: i2$2.MatSelect }] });
+
 /**
  * @class MsaGenericFormSelectFieldComponent
  * @description Renders a Select case for `MsaGenericFormComponent`.
@@ -25557,7 +26106,7 @@ class MsaGenericFormSelectFieldComponent extends MsaGenericFormFieldBaseComponen
                 <mat-error>{{errorMessage}}</mat-error>
             }
         </mat-form-field>
-    `, isInline: true, styles: ["mat-form-field{width:100%;height:100%}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "ngmodule", type: MatFormFieldModule }, { kind: "component", type: i2$1.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i2$1.MatLabel, selector: "mat-label" }, { kind: "directive", type: i2$1.MatHint, selector: "mat-hint", inputs: ["align", "id"] }, { kind: "directive", type: i2$1.MatError, selector: "mat-error, [matError]", inputs: ["id"] }, { kind: "directive", type: i2$1.MatSuffix, selector: "[matSuffix], [matIconSuffix], [matTextSuffix]", inputs: ["matTextSuffix"] }, { kind: "ngmodule", type: MatSelectModule }, { kind: "component", type: i2$2.MatSelect, selector: "mat-select", inputs: ["aria-describedby", "panelClass", "disabled", "disableRipple", "tabIndex", "hideSingleSelectionIndicator", "placeholder", "required", "multiple", "disableOptionCentering", "compareWith", "value", "aria-label", "aria-labelledby", "errorStateMatcher", "typeaheadDebounceInterval", "sortComparator", "id", "panelWidth", "canSelectNullableOptions"], outputs: ["openedChange", "opened", "closed", "selectionChange", "valueChange"], exportAs: ["matSelect"] }, { kind: "component", type: i2$2.MatOption, selector: "mat-option", inputs: ["value", "id", "disabled"], outputs: ["onSelectionChange"], exportAs: ["matOption"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i4.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: MatIconButton, selector: "button[mat-icon-button], a[mat-icon-button], button[matIconButton], a[matIconButton]", exportAs: ["matButton", "matAnchor"] }, { kind: "directive", type: DisableControlDirective, selector: "[disableControl]", inputs: ["disableControl"] }, { kind: "pipe", type: FuncPipe, name: "func" }], viewProviders: [{ provide: ControlContainer, useExisting: FormGroupDirective }] });
+    `, isInline: true, styles: ["mat-form-field{width:100%;height:100%}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "ngmodule", type: MatFormFieldModule }, { kind: "component", type: i2$1.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i2$1.MatLabel, selector: "mat-label" }, { kind: "directive", type: i2$1.MatHint, selector: "mat-hint", inputs: ["align", "id"] }, { kind: "directive", type: i2$1.MatError, selector: "mat-error, [matError]", inputs: ["id"] }, { kind: "directive", type: i2$1.MatSuffix, selector: "[matSuffix], [matIconSuffix], [matTextSuffix]", inputs: ["matTextSuffix"] }, { kind: "ngmodule", type: MatSelectModule }, { kind: "component", type: i2$2.MatSelect, selector: "mat-select", inputs: ["aria-describedby", "panelClass", "disabled", "disableRipple", "tabIndex", "hideSingleSelectionIndicator", "placeholder", "required", "multiple", "disableOptionCentering", "compareWith", "value", "aria-label", "aria-labelledby", "errorStateMatcher", "typeaheadDebounceInterval", "sortComparator", "id", "panelWidth", "canSelectNullableOptions"], outputs: ["openedChange", "opened", "closed", "selectionChange", "valueChange"], exportAs: ["matSelect"] }, { kind: "component", type: i2$2.MatOption, selector: "mat-option", inputs: ["value", "id", "disabled"], outputs: ["onSelectionChange"], exportAs: ["matOption"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i4.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: MatIconButton, selector: "button[mat-icon-button], a[mat-icon-button], button[matIconButton], a[matIconButton]", exportAs: ["matButton", "matAnchor"] }, { kind: "directive", type: MatSelectRequiredDirective, selector: "mat-select[formControl]:not([required]), mat-select[formControlName]:not([required])" }, { kind: "directive", type: DisableControlDirective, selector: "[disableControl]", inputs: ["disableControl"] }, { kind: "pipe", type: FuncPipe, name: "func" }], viewProviders: [{ provide: ControlContainer, useExisting: FormGroupDirective }] });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: MsaGenericFormSelectFieldComponent, decorators: [{
             type: Component,
@@ -25568,6 +26117,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.7", ngImpor
                         MatSelectModule,
                         MatIconModule,
                         MatIconButton,
+                        MatSelectRequiredDirective,
                         DisableControlDirective,
                         FuncPipe
                     ], viewProviders: [{ provide: ControlContainer, useExisting: FormGroupDirective }], template: `
@@ -25788,7 +26338,7 @@ class MsaGenericFormTextFieldComponent extends MsaGenericFormFieldBaseComponent
                 <mat-error>{{errorMessage}}</mat-error>
             }
         </mat-form-field>
-    `, isInline: true, styles: ["mat-form-field{width:100%;height:100%}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$1.DefaultValueAccessor, selector: "input:not([type=checkbox]):not([ngNoCva])[formControlName],textarea:not([ngNoCva])[formControlName],input:not([type=checkbox]):not([ngNoCva])[formControl],textarea:not([ngNoCva])[formControl],input:not([type=checkbox]):not([ngNoCva])[ngModel],textarea:not([ngNoCva])[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.MinLengthValidator, selector: "[minlength][formControlName],[minlength][formControl],[minlength][ngModel]", inputs: ["minlength"] }, { kind: "directive", type: i1$1.MaxLengthValidator, selector: "[maxlength][formControlName],[maxlength][formControl],[maxlength][ngModel]", inputs: ["maxlength"] }, { kind: "directive", type: i1$1.PatternValidator, selector: "[pattern][formControlName],[pattern][formControl],[pattern][ngModel]", inputs: ["pattern"] }, { kind: "directive", type: i1$1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "ngmodule", type: MatFormFieldModule }, { kind: "component", type: i2$1.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i2$1.MatLabel, selector: "mat-label" }, { kind: "directive", type: i2$1.MatHint, selector: "mat-hint", inputs: ["align", "id"] }, { kind: "directive", type: i2$1.MatError, selector: "mat-error, [matError]", inputs: ["id"] }, { kind: "directive", type: i2$1.MatSuffix, selector: "[matSuffix], [matIconSuffix], [matTextSuffix]", inputs: ["matTextSuffix"] }, { kind: "ngmodule", type: MatInputModule }, { kind: "directive", type: i3$2.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl],      input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly", "disabledInteractive"], exportAs: ["matInput"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i4.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: MatIconButton, selector: "button[mat-icon-button], a[mat-icon-button], button[matIconButton], a[matIconButton]", exportAs: ["matButton", "matAnchor"] }, { kind: "directive", type: AutofocusDirective, selector: "[autoFocus]", inputs: ["focusDelay", "selectText", "autoFocus"] }, { kind: "directive", type: OnlyNumberDirective, selector: "[onlyNumber]", inputs: ["onlyNumber", "excludePrefix"] }, { kind: "directive", type: PrefixDirective, selector: "[prefix]", inputs: ["prefix"] }, { kind: "directive", type: ParseDecimalDirective, selector: "[parseDecimal]", inputs: ["parseDecimalEnabled"] }, { kind: "directive", type: RemoveWhitespaceDirective, selector: "[removeWhitespace]", inputs: ["removeWhitespace"] }, { kind: "pipe", type: FuncPipe, name: "func" }], viewProviders: [{ provide: ControlContainer, useExisting: FormGroupDirective }] });
+    `, isInline: true, styles: ["mat-form-field{width:100%;height:100%}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$1.DefaultValueAccessor, selector: "input:not([type=checkbox]):not([ngNoCva])[formControlName],textarea:not([ngNoCva])[formControlName],input:not([type=checkbox]):not([ngNoCva])[formControl],textarea:not([ngNoCva])[formControl],input:not([type=checkbox]):not([ngNoCva])[ngModel],textarea:not([ngNoCva])[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.MinLengthValidator, selector: "[minlength][formControlName],[minlength][formControl],[minlength][ngModel]", inputs: ["minlength"] }, { kind: "directive", type: i1$1.MaxLengthValidator, selector: "[maxlength][formControlName],[maxlength][formControl],[maxlength][ngModel]", inputs: ["maxlength"] }, { kind: "directive", type: i1$1.PatternValidator, selector: "[pattern][formControlName],[pattern][formControl],[pattern][ngModel]", inputs: ["pattern"] }, { kind: "directive", type: i1$1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "ngmodule", type: MatFormFieldModule }, { kind: "component", type: i2$1.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i2$1.MatLabel, selector: "mat-label" }, { kind: "directive", type: i2$1.MatHint, selector: "mat-hint", inputs: ["align", "id"] }, { kind: "directive", type: i2$1.MatError, selector: "mat-error, [matError]", inputs: ["id"] }, { kind: "directive", type: i2$1.MatSuffix, selector: "[matSuffix], [matIconSuffix], [matTextSuffix]", inputs: ["matTextSuffix"] }, { kind: "ngmodule", type: MatInputModule }, { kind: "directive", type: i3$2.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl],      input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly", "disabledInteractive"], exportAs: ["matInput"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i4.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: MatIconButton, selector: "button[mat-icon-button], a[mat-icon-button], button[matIconButton], a[matIconButton]", exportAs: ["matButton", "matAnchor"] }, { kind: "directive", type: MatInputRequiredDirective, selector: "[matInput][formControl]:not([required]), [matInput][formControlName]:not([required])" }, { kind: "directive", type: AutofocusDirective, selector: "[autoFocus]", inputs: ["focusDelay", "selectText", "autoFocus"] }, { kind: "directive", type: OnlyNumberDirective, selector: "[onlyNumber]", inputs: ["onlyNumber", "excludePrefix"] }, { kind: "directive", type: PrefixDirective, selector: "[prefix]", inputs: ["prefix"] }, { kind: "directive", type: ParseDecimalDirective, selector: "[parseDecimal]", inputs: ["parseDecimalEnabled"] }, { kind: "directive", type: RemoveWhitespaceDirective, selector: "[removeWhitespace]", inputs: ["removeWhitespace"] }, { kind: "pipe", type: FuncPipe, name: "func" }], viewProviders: [{ provide: ControlContainer, useExisting: FormGroupDirective }] });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: MsaGenericFormTextFieldComponent, decorators: [{
             type: Component,
@@ -25799,6 +26349,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.7", ngImpor
                         MatInputModule,
                         MatIconModule,
                         MatIconButton,
+                        MatInputRequiredDirective,
                         AutofocusDirective,
                         FuncPipe,
                         OnlyNumberDirective,
@@ -25881,7 +26432,7 @@ class MsaGenericFormTextareaFieldComponent extends MsaGenericFormFieldBaseCompon
                 <mat-error>{{errorMessage}}</mat-error>
             }
         </mat-form-field>
-    `, isInline: true, styles: ["mat-form-field{width:100%;height:100%}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$1.DefaultValueAccessor, selector: "input:not([type=checkbox]):not([ngNoCva])[formControlName],textarea:not([ngNoCva])[formControlName],input:not([type=checkbox]):not([ngNoCva])[formControl],textarea:not([ngNoCva])[formControl],input:not([type=checkbox]):not([ngNoCva])[ngModel],textarea:not([ngNoCva])[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "ngmodule", type: MatFormFieldModule }, { kind: "component", type: i2$1.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i2$1.MatLabel, selector: "mat-label" }, { kind: "directive", type: i2$1.MatHint, selector: "mat-hint", inputs: ["align", "id"] }, { kind: "directive", type: i2$1.MatError, selector: "mat-error, [matError]", inputs: ["id"] }, { kind: "directive", type: i2$1.MatSuffix, selector: "[matSuffix], [matIconSuffix], [matTextSuffix]", inputs: ["matTextSuffix"] }, { kind: "ngmodule", type: MatInputModule }, { kind: "directive", type: i3$2.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl],      input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly", "disabledInteractive"], exportAs: ["matInput"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i4.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: MatIconButton, selector: "button[mat-icon-button], a[mat-icon-button], button[matIconButton], a[matIconButton]", exportAs: ["matButton", "matAnchor"] }, { kind: "directive", type: PrefixDirective, selector: "[prefix]", inputs: ["prefix"] }, { kind: "directive", type: RemoveWhitespaceDirective, selector: "[removeWhitespace]", inputs: ["removeWhitespace"] }, { kind: "pipe", type: FuncPipe, name: "func" }], viewProviders: [{ provide: ControlContainer, useExisting: FormGroupDirective }] });
+    `, isInline: true, styles: ["mat-form-field{width:100%;height:100%}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$1.DefaultValueAccessor, selector: "input:not([type=checkbox]):not([ngNoCva])[formControlName],textarea:not([ngNoCva])[formControlName],input:not([type=checkbox]):not([ngNoCva])[formControl],textarea:not([ngNoCva])[formControl],input:not([type=checkbox]):not([ngNoCva])[ngModel],textarea:not([ngNoCva])[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "ngmodule", type: MatFormFieldModule }, { kind: "component", type: i2$1.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i2$1.MatLabel, selector: "mat-label" }, { kind: "directive", type: i2$1.MatHint, selector: "mat-hint", inputs: ["align", "id"] }, { kind: "directive", type: i2$1.MatError, selector: "mat-error, [matError]", inputs: ["id"] }, { kind: "directive", type: i2$1.MatSuffix, selector: "[matSuffix], [matIconSuffix], [matTextSuffix]", inputs: ["matTextSuffix"] }, { kind: "ngmodule", type: MatInputModule }, { kind: "directive", type: i3$2.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl],      input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly", "disabledInteractive"], exportAs: ["matInput"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i4.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: MatIconButton, selector: "button[mat-icon-button], a[mat-icon-button], button[matIconButton], a[matIconButton]", exportAs: ["matButton", "matAnchor"] }, { kind: "directive", type: MatInputRequiredDirective, selector: "[matInput][formControl]:not([required]), [matInput][formControlName]:not([required])" }, { kind: "directive", type: PrefixDirective, selector: "[prefix]", inputs: ["prefix"] }, { kind: "directive", type: RemoveWhitespaceDirective, selector: "[removeWhitespace]", inputs: ["removeWhitespace"] }, { kind: "pipe", type: FuncPipe, name: "func" }], viewProviders: [{ provide: ControlContainer, useExisting: FormGroupDirective }] });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: MsaGenericFormTextareaFieldComponent, decorators: [{
             type: Component,
@@ -25892,6 +26443,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.7", ngImpor
                         MatInputModule,
                         MatIconModule,
                         MatIconButton,
+                        MatInputRequiredDirective,
                         FuncPipe,
                         PrefixDirective,
                         RemoveWhitespaceDirective
@@ -26433,7 +26985,7 @@ class VdGenericFormComponent {
         console.log(message, optionalParams);
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: VdGenericFormComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.7", type: VdGenericFormComponent, isStandalone: true, selector: "vd-generic-form", inputs: { formGroup: "formGroup", classType: "classType", formDefinition: "formDefinition", fieldGroups: "fieldGroups", groupName: "groupName", fieldSets: "fieldSets", context: "context", debugValue: "debugValue", readonly: "readonly", separatorKeysCodes: "separatorKeysCodes" }, outputs: { onInit: "init" }, queries: [{ propertyName: "editorTemplate", first: true, predicate: VdEditorDirective, descendants: true }, { propertyName: "codeTemplate", first: true, predicate: VdCodeDirective, descendants: true }, { propertyName: "fileTemplate", first: true, predicate: VdFileDirective, descendants: true }, { propertyName: "customTemplate", first: true, predicate: VdCustomDirective, descendants: true }, { propertyName: "bottom", first: true, predicate: ["bottom"], descendants: true }, { propertyName: "customFields", first: true, predicate: ["customFields"], descendants: true }, { propertyName: "customFieldsTemplates", predicate: VdGenericFormCustomFieldDirective }], ngImport: i0, template: "@if (formGroup && fieldRows) {\n    <div [formGroup]=\"formGroup!\">\n        <!-- #region Fields -->\n        @for (fields of fieldRows; track fields; let i = $index) {\n            <div layout-gt-sm=\"row\" layout=\"column\">\n                @for (field of fields; track field) {\n                    @if (!field.hidden && !(field.hide && field.hide(formValue, formGroup, context))) {\n                        @switch (field.type) {\n                            <!-- #region Text input -->\n                            @case (FormFieldType.Text) {\n                                <msa-generic-form-text-field [field]=\"field\"\n                                                             [formGroup]=\"formGroup\"\n                                                             [readonly]=\"readonly ?? false\"\n                                                             [context]=\"context\"\n                                                             [attr.flex]=\"field.flex||0\"\n                                                             layout-margin>\n                                </msa-generic-form-text-field>\n                            }\n                            <!-- #endregion -->\n\n                            <!-- #region Textarea -->\n                            @case (FormFieldType.TextArea) {\n                                <msa-generic-form-textarea-field [field]=\"field\"\n                                                                 [formGroup]=\"formGroup\" [readonly]=\"readonly ?? false\"\n                                                                 [context]=\"context\"\n                                                                 [attr.flex]=\"field.flex||0\"\n                                                                 layout-margin>\n                                </msa-generic-form-textarea-field>\n                            }\n                            <!-- #endregion -->\n\n                            <!-- #region Enum -->\n                            @case (FormFieldType.Enum) {\n                                <msa-generic-form-enum-field [field]=\"field\" [formGroup]=\"formGroup\"\n                                                             [readonly]=\"readonly ?? false\"\n                                                             [context]=\"context\"\n                                                             [attr.flex]=\"field.flex||0\"\n                                                             layout-margin>\n                                </msa-generic-form-enum-field>\n                            }\n                            <!-- #endregion -->\n\n                            <!-- #region VdSelect -->\n                            @case (FormFieldType.VdSelect) {\n                                <msa-generic-form-msa-select-field [field]=\"field\"\n                                                                   [formGroup]=\"formGroup\"\n                                                                   [readonly]=\"readonly ?? false\"\n                                                                   [context]=\"context\"\n                                                                   [attr.flex]=\"field.flex||0\"\n                                                                   layout-margin>\n                                </msa-generic-form-msa-select-field>\n                            }\n                            <!-- #endregion -->\n\n                            <!-- #region VdList -->\n                            @case (FormFieldType.VdList) {\n                                <msa-generic-form-msa-list-field [field]=\"field\"\n                                                                 [formGroup]=\"formGroup\"\n                                                                 [readonly]=\"readonly ?? false\"\n                                                                 [context]=\"context\"\n                                                                 [attr.flex]=\"field.flex||0\"\n                                                                 layout-margin>\n                                </msa-generic-form-msa-list-field>\n                            }\n                            <!-- #endregion -->\n\n                            <!-- #region Chips -->\n                            @case (FormFieldType.Chips) {\n                                <msa-generic-form-chips-field [field]=\"field\"\n                                                              [formGroup]=\"formGroup\"\n                                                              [readonly]=\"readonly ?? false\"\n                                                              [context]=\"context\"\n                                                              [separatorKeysCodes]=\"separatorKeysCodes\"\n                                                              [autocompleteFilteredOptions]=\"autocompleteFilteredOptions\"\n                                                              [filterAutocomplete]=\"filterAutocomplete.bind(this)\"\n                                                              [autocompleteValueSelected]=\"autocompleteValueSelected.bind(this)\"\n                                                              [addChip]=\"addChip.bind(this)\"\n                                                              [onPasteChips]=\"onPasteChips.bind(this)\"\n                                                              [removeChip]=\"removeChip.bind(this)\"\n                                                              [attr.flex]=\"field.flex||0\"\n                                                              layout-margin>\n                                </msa-generic-form-chips-field>\n                            }\n                            <!-- #endregion -->\n\n                            <!-- #region VdChips -->\n                            @case (FormFieldType.VdChips) {\n                                <msa-generic-form-msa-chips-field [field]=\"field\"\n                                                                  [formGroup]=\"formGroup\"\n                                                                  [readonly]=\"readonly ?? false\"\n                                                                  [context]=\"context\"\n                                                                  [attr.flex]=\"field.flex||0\"\n                                                                  layout-margin>\n                                </msa-generic-form-msa-chips-field>\n                            }\n                            <!-- #endregion -->\n\n                            <!-- #region Select -->\n                            @case (FormFieldType.Select) {\n                                <msa-generic-form-select-field [field]=\"field\"\n                                                               [formGroup]=\"formGroup\"\n                                                               [readonly]=\"readonly ?? false\"\n                                                               [context]=\"context\"\n                                                               [attr.flex]=\"field.flex||0\"\n                                                               layout-margin>\n                                </msa-generic-form-select-field>\n                            }\n                            <!-- #endregion -->\n\n                            <!-- #region Autocomplete -->\n                            @case (FormFieldType.Autocomplete) {\n                                <msa-generic-form-autocomplete-field [field]=\"field\"\n                                                                     [formGroup]=\"formGroup\"\n                                                                     [readonly]=\"readonly ?? false\"\n                                                                     [context]=\"context\"\n                                                                     [autocompleteFilteredOptions]=\"autocompleteFilteredOptions\"\n                                                                     [filterAutocomplete]=\"filterAutocomplete.bind(this)\"\n                                                                     [attr.flex]=\"field.flex||0\"\n                                                                     layout-margin>\n                                </msa-generic-form-autocomplete-field>\n                            }\n                            <!-- #endregion -->\n\n                            <!-- #region Date -->\n                            @case (FormFieldType.Date) {\n                                <msa-generic-form-date-field [field]=\"field\"\n                                                             [formGroup]=\"formGroup\"\n                                                             [readonly]=\"readonly ?? false\"\n                                                             [context]=\"context\"\n                                                             [datePickerHeaderComponent]=\"datePickerHeaderComponent\"\n                                                             [handleDatePickerFilterAsync]=\"handleDatePickerFilterAsync.bind(this)\"\n                                                             [handleDatePickerOpened]=\"handleDatePickerOpened.bind(this)\"\n                                                             [attr.flex]=\"field.flex||0\"\n                                                             layout-margin>\n                                </msa-generic-form-date-field>\n                            }\n                            <!-- #endregion -->\n\n                            <!-- #region Calendar -->\n                            @case (FormFieldType.Calendar) {\n                                <msa-generic-form-calendar-field [field]=\"field\"\n                                                                 [formGroup]=\"formGroup\"\n                                                                 [readonly]=\"readonly ?? false\"\n                                                                 [context]=\"context\"\n                                                                 [datePickerHeaderComponent]=\"datePickerHeaderComponent\"\n                                                                 [handleCalendarFilterAsync]=\"handleCalendarFilterAsync.bind(this)\"\n                                                                 [attr.flex]=\"field.flex||0\"\n                                                                 layout-margin>\n                                </msa-generic-form-calendar-field>\n                            }\n                            <!-- #endregion -->\n\n                            <!-- #region Color input -->\n                            @case (FormFieldType.Color) {\n                                <msa-generic-form-color-field [field]=\"field\"\n                                                              [formGroup]=\"formGroup\"\n                                                              [readonly]=\"readonly ?? false\"\n                                                              [context]=\"context\"\n                                                              [attr.flex]=\"field.flex||0\"\n                                                              layout-margin>\n                                </msa-generic-form-color-field>\n                            }\n                            <!-- #endregion -->\n\n                            <!-- #region Checkbox -->\n                            @case (FormFieldType.Checkbox) {\n                                <msa-generic-form-checkbox-field [field]=\"field\"\n                                                                 [formGroup]=\"formGroup\"\n                                                                 [readonly]=\"readonly ?? false\"\n                                                                 [context]=\"context\"\n                                                                 [attr.flex]=\"field.flex||0\">\n                                </msa-generic-form-checkbox-field>\n                            }\n                            <!-- #endregion -->\n\n                            <!-- #region Radio -->\n                            @case(FormFieldType.Radio) {\n                                <msa-generic-form-radio-field [field]=\"field\"\n                                                              [formGroup]=\"formGroup\"\n                                                              [readonly]=\"readonly ?? false\"\n                                                              [context]=\"context\"\n                                                              [attr.flex]=\"field.flex||0\"\n                                                              layout-margin>\n                                </msa-generic-form-radio-field>\n                            }\n                            <!-- #endregion -->\n\n                            <!-- #region Editor -->\n                            @case (FormFieldType.Editor) {\n                                <msa-generic-form-editor-field [field]=\"field\"\n                                                               [formGroup]=\"formGroup\"\n                                                               [editorTemplate]=\"editorTemplate\"\n                                                               [attr.flex]=\"field.flex||0\"\n                                                               layout-margin>\n                                </msa-generic-form-editor-field>\n                            }\n                            <!-- #endregion -->\n\n                            <!-- #region Code -->\n                            @case (FormFieldType.Code) {\n                                <msa-generic-form-code-field [field]=\"field\"\n                                                             [formGroup]=\"formGroup\"\n                                                             [codeTemplate]=\"codeTemplate\"\n                                                             [attr.flex]=\"field.flex||0\"\n                                                             layout-margin>\n                                </msa-generic-form-code-field>\n                            }\n                            <!-- #endregion -->\n\n                            <!-- #region File -->\n                            @case (FormFieldType.File) {\n                                <msa-generic-form-file-field [field]=\"field\"\n                                                             [formGroup]=\"formGroup\"\n                                                             [readonly]=\"readonly ?? false\"\n                                                             [context]=\"context\"\n                                                             [attr.flex]=\"field.flex||0\"\n                                                             layout-margin>\n                                </msa-generic-form-file-field>\n                            }\n                            <!-- #endregion -->\n\n                            <!-- #region Custom -->\n                            @case (FormFieldType.Custom) {\n                                <msa-generic-form-custom-field [field]=\"field\"\n                                                               [formGroup]=\"formGroup\"\n                                                               [customTemplate]=\"customTemplate\"\n                                                               [attr.flex]=\"field.flex||0\"\n                                                               layout-margin>\n                                </msa-generic-form-custom-field>\n                            }\n                            <!-- #endregion -->\n                        }\n                    }\n                }\n\n                <!-- #region Template for custom fields -->\n                @for (customField of customFieldsTemplates; track customField) {\n                    @if (customField?.templateRef && customField.row == fields[0]?.row && customField.inline) {\n                        <ng-template [ngTemplateOutlet]=\"$safeNavigationMigration(customField?.templateRef)!\" [ngTemplateOutletContext]=\"{formGroup: formGroup}\"></ng-template>\n                    }\n                }\n                <!-- #endregion -->\n            </div>\n            <!-- #region Template for custom fields -->\n            @if (customFields) {\n                <ng-container [ngTemplateOutlet]=\"customFields\" [ngTemplateOutletContext]=\"{formGroup: formGroup, row: fields[0].row}\"></ng-container>\n            } @for (customField of customFieldsTemplates; track customField) {\n                @if(customField?.templateRef && customField.row ==  ((($safeNavigationMigration(fields[0]?.row) | func:formValue:formGroup:context) ??0)+1) && !customField.inline) {\n                    <ng-template [ngTemplateOutlet]=\"$safeNavigationMigration(customField?.templateRef)!\" [ngTemplateOutletContext]=\"{formGroup: formGroup}\"></ng-template>\n                }\n            }\n            <!-- #endregion -->\n        }\n        <!-- #endregion -->\n\n        <!-- #region Form bottom -->\n        @if (bottom) {\n            <ng-container [ngTemplateOutlet]=\"bottom\" [ngTemplateOutletContext]=\"{formGroup: formGroup}\"></ng-container>\n        }\n        <!-- #endregion -->\n\n        <!-- #region Template for suffix buttons -->\n        <ng-template #suffixButtons let-field>\n            @for (suffixButton of field.suffixButtons; track suffixButton) {\n                <ng-container matSuffix>\n                    @if (!suffixButton.hide || !suffixButton.hide(formValue, context)) {\n                        <button type=\"button\"\n                                mat-icon-button\n                                (click)=\"suffixButton.event && suffixButton.event(formValue, context)\">\n                            <mat-icon fontSet=\"material-symbols-outlined\">{{suffixButton.icon}}</mat-icon>\n                        </button>\n                    }\n                </ng-container>\n            }\n        </ng-template>\n        <!-- #endregion -->\n        <!-- #region Debug value -->\n        @if (debugValue) {\n            <code>\n                <pre>{{formValue | json}}</pre>\n            </code>\n        }\n        <!-- #endregion -->\n    </div>\n}", styles: [".mat-checkbox-wrap mat-error{transform:translate(36px,-20px);max-width:93%;font-size:var(--mat-typography-caption-font-size, 12px)}::ng-deep .mat-mdc-form-field .mat-mdc-text-field-wrapper .mat-mdc-form-field-flex .mat-mdc-form-field-icon-suffix .color-picker{width:40px;display:block}::ng-deep .mat-mdc-form-field .mat-mdc-text-field-wrapper .mat-mdc-form-field-flex .has-time input:first-child{width:84px;max-width:inherit;min-width:84px}::ng-deep .mat-mdc-form-field-type-mat-chip-grid .mat-mdc-form-field-infix{padding-top:7px!important;padding-bottom:7px!important}::ng-deep .mat-mdc-form-field-type-mat-chip-grid .mat-mdc-chip{padding-top:0!important;padding-bottom:0!important;margin-top:2px!important;margin-bottom:2px!important;margin-left:4px!important}.radio-form-field{width:100%}.radio-form-field ::ng-deep .mat-mdc-form-field-infix{padding-top:0!important;padding-bottom:0!important}.radio-form-field ::ng-deep .mat-mdc-floating-label{transform:translateY(-1.5em) scale(1)}.radio-form-field mat-radio-group{display:flex;flex-direction:row;gap:20px;padding-top:4px;margin-left:-12px}.radio-form-field .mat-mdc-form-field-infix{min-height:48px;display:flex;align-items:center}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$2.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],[formArray],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "ngmodule", type: 
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.7", type: VdGenericFormComponent, isStandalone: true, selector: "vd-generic-form", inputs: { formGroup: "formGroup", classType: "classType", formDefinition: "formDefinition", fieldGroups: "fieldGroups", groupName: "groupName", fieldSets: "fieldSets", context: "context", debugValue: "debugValue", readonly: "readonly", separatorKeysCodes: "separatorKeysCodes" }, outputs: { onInit: "init" }, queries: [{ propertyName: "editorTemplate", first: true, predicate: VdEditorDirective, descendants: true }, { propertyName: "codeTemplate", first: true, predicate: VdCodeDirective, descendants: true }, { propertyName: "fileTemplate", first: true, predicate: VdFileDirective, descendants: true }, { propertyName: "customTemplate", first: true, predicate: VdCustomDirective, descendants: true }, { propertyName: "bottom", first: true, predicate: ["bottom"], descendants: true }, { propertyName: "customFields", first: true, predicate: ["customFields"], descendants: true }, { propertyName: "customFieldsTemplates", predicate: VdGenericFormCustomFieldDirective }], ngImport: i0, template: "@if (formGroup && fieldRows) {\n    <div [formGroup]=\"formGroup!\">\n        <!-- #region Fields -->\n        @for (fields of fieldRows; track fields; let i = $index) {\n            <div layout-gt-sm=\"row\" layout=\"column\">\n                @for (field of fields; track field) {\n                    @if (!field.hidden && !(field.hide && field.hide(formValue, formGroup, context))) {\n                        @switch (field.type) {\n                            <!-- #region Text input -->\n                            @case (FormFieldType.Text) {\n                                <msa-generic-form-text-field [field]=\"field\" [formGroup]=\"formGroup\" [readonly]=\"readonly ?? false\" [context]=\"context\" [attr.flex]=\"field.flex||0\" [attr.data-row]=\"field.row\" layout-margin>\n                                </msa-generic-form-text-field>\n                            }\n                            <!-- #endregion -->\n                            <!-- #region Textarea -->\n                            @case (FormFieldType.TextArea) {\n                                <msa-generic-form-textarea-field [field]=\"field\" [formGroup]=\"formGroup\" [readonly]=\"readonly ?? false\" [context]=\"context\" [attr.flex]=\"field.flex||0\" [attr.data-row]=\"field.row\" layout-margin>\n                                </msa-generic-form-textarea-field>\n                            }\n                            <!-- #endregion -->\n                            <!-- #region Enum -->\n                            @case (FormFieldType.Enum) {\n                                <msa-generic-form-enum-field [field]=\"field\" [formGroup]=\"formGroup\" [readonly]=\"readonly ?? false\" [context]=\"context\" [attr.flex]=\"field.flex||0\" [attr.data-row]=\"field.row\" layout-margin>\n                                </msa-generic-form-enum-field>\n                            }\n                            <!-- #endregion -->\n                            <!-- #region VdSelect -->\n                            @case (FormFieldType.VdSelect) {\n                                <msa-generic-form-msa-select-field [field]=\"field\" [formGroup]=\"formGroup\" [readonly]=\"readonly ?? false\" [context]=\"context\" [attr.flex]=\"field.flex||0\" [attr.data-row]=\"field.row\" layout-margin>\n                                </msa-generic-form-msa-select-field>\n                            }\n                            <!-- #endregion -->\n                            <!-- #region VdList -->\n                            @case (FormFieldType.VdList) {\n                                <msa-generic-form-msa-list-field [field]=\"field\" [formGroup]=\"formGroup\" [readonly]=\"readonly ?? false\" [context]=\"context\" [attr.flex]=\"field.flex||0\" [attr.data-row]=\"field.row\" layout-margin>\n                                </msa-generic-form-msa-list-field>\n                            }\n                            <!-- #endregion -->\n                            <!-- #region Chips -->\n                            @case (FormFieldType.Chips) {\n                                <msa-generic-form-chips-field [field]=\"field\" [formGroup]=\"formGroup\" [readonly]=\"readonly ?? false\" [context]=\"context\" [separatorKeysCodes]=\"separatorKeysCodes\" [autocompleteFilteredOptions]=\"autocompleteFilteredOptions\" [filterAutocomplete]=\"filterAutocomplete.bind(this)\" [autocompleteValueSelected]=\"autocompleteValueSelected.bind(this)\" [addChip]=\"addChip.bind(this)\" [onPasteChips]=\"onPasteChips.bind(this)\" [removeChip]=\"removeChip.bind(this)\" [attr.flex]=\"field.flex||0\" [attr.data-row]=\"field.row\" layout-margin>\n                                </msa-generic-form-chips-field>\n                            }\n                            <!-- #endregion -->\n                            <!-- #region VdChips -->\n                            @case (FormFieldType.VdChips) {\n                                <msa-generic-form-msa-chips-field [field]=\"field\" [formGroup]=\"formGroup\" [readonly]=\"readonly ?? false\" [context]=\"context\" [attr.flex]=\"field.flex||0\" [attr.data-row]=\"field.row\" layout-margin>\n                                </msa-generic-form-msa-chips-field>\n                            }\n                            <!-- #endregion -->\n                            <!-- #region Select -->\n                            @case (FormFieldType.Select) {\n                                <msa-generic-form-select-field [field]=\"field\" [formGroup]=\"formGroup\" [readonly]=\"readonly ?? false\" [context]=\"context\" [attr.flex]=\"field.flex||0\" [attr.data-row]=\"field.row\" layout-margin>\n                                </msa-generic-form-select-field>\n                            }\n                            <!-- #endregion -->\n                            <!-- #region Autocomplete -->\n                            @case (FormFieldType.Autocomplete) {\n                                <msa-generic-form-autocomplete-field [field]=\"field\" [formGroup]=\"formGroup\" [readonly]=\"readonly ?? false\" [context]=\"context\" [autocompleteFilteredOptions]=\"autocompleteFilteredOptions\" [filterAutocomplete]=\"filterAutocomplete.bind(this)\" [attr.flex]=\"field.flex||0\" [attr.data-row]=\"field.row\" layout-margin>\n                                </msa-generic-form-autocomplete-field>\n                            }\n                            <!-- #endregion -->\n                            <!-- #region Date -->\n                            @case (FormFieldType.Date) {\n                                <msa-generic-form-date-field [field]=\"field\" [formGroup]=\"formGroup\" [readonly]=\"readonly ?? false\" [context]=\"context\" [datePickerHeaderComponent]=\"datePickerHeaderComponent\" [handleDatePickerFilterAsync]=\"handleDatePickerFilterAsync.bind(this)\" [handleDatePickerOpened]=\"handleDatePickerOpened.bind(this)\" [attr.flex]=\"field.flex||0\" [attr.data-row]=\"field.row\" layout-margin>\n                                </msa-generic-form-date-field>\n                            }\n                            <!-- #endregion -->\n                            <!-- #region Calendar -->\n                            @case (FormFieldType.Calendar) {\n                                <msa-generic-form-calendar-field [field]=\"field\" [formGroup]=\"formGroup\" [readonly]=\"readonly ?? false\" [context]=\"context\" [datePickerHeaderComponent]=\"datePickerHeaderComponent\" [handleCalendarFilterAsync]=\"handleCalendarFilterAsync.bind(this)\" [attr.flex]=\"field.flex||0\" [attr.data-row]=\"field.row\" layout-margin>\n                                </msa-generic-form-calendar-field>\n                            }\n                            <!-- #endregion -->\n                            <!-- #region Color input -->\n                            @case (FormFieldType.Color) {\n                                <msa-generic-form-color-field [field]=\"field\" [formGroup]=\"formGroup\" [readonly]=\"readonly ?? false\" [context]=\"context\" [attr.flex]=\"field.flex||0\" [attr.data-row]=\"field.row\" layout-margin>\n                                </msa-generic-form-color-field>\n                            }\n                            <!-- #endregion -->\n                            <!-- #region Checkbox -->\n                            @case (FormFieldType.Checkbox) {\n                                <msa-generic-form-checkbox-field [field]=\"field\" [formGroup]=\"formGroup\" [readonly]=\"readonly ?? false\" [context]=\"context\" [attr.flex]=\"field.flex||0\" [attr.data-row]=\"field.row\">\n                                </msa-generic-form-checkbox-field>\n                            }\n                            <!-- #endregion -->\n                            <!-- #region Radio -->\n                            @case(FormFieldType.Radio) {\n                                <msa-generic-form-radio-field [field]=\"field\" [formGroup]=\"formGroup\" [readonly]=\"readonly ?? false\" [context]=\"context\" [attr.flex]=\"field.flex||0\" [attr.data-row]=\"field.row\" layout-margin>\n                                </msa-generic-form-radio-field>\n                            }\n                            <!-- #endregion -->\n                            <!-- #region Editor -->\n                            @case (FormFieldType.Editor) {\n                                <msa-generic-form-editor-field [field]=\"field\" [formGroup]=\"formGroup\" [editorTemplate]=\"editorTemplate\" [attr.flex]=\"field.flex||0\" [attr.data-row]=\"field.row\" layout-margin>\n                                </msa-generic-form-editor-field>\n                            }\n                            <!-- #endregion -->\n                            <!-- #region Code -->\n                            @case (FormFieldType.Code) {\n                                <msa-generic-form-code-field [field]=\"field\" [formGroup]=\"formGroup\" [codeTemplate]=\"codeTemplate\" [attr.flex]=\"field.flex||0\" [attr.data-row]=\"field.row\" layout-margin>\n                                </msa-generic-form-code-field>\n                            }\n                            <!-- #endregion -->\n                            <!-- #region File -->\n                            @case (FormFieldType.File) {\n                                <msa-generic-form-file-field [field]=\"field\" [formGroup]=\"formGroup\" [readonly]=\"readonly ?? false\" [context]=\"context\" [attr.flex]=\"field.flex||0\" [attr.data-row]=\"field.row\" layout-margin>\n                                </msa-generic-form-file-field>\n                            }\n                            <!-- #endregion -->\n                            <!-- #region Custom -->\n                            @case (FormFieldType.Custom) {\n                                <msa-generic-form-custom-field [field]=\"field\" [formGroup]=\"formGroup\" [customTemplate]=\"customTemplate\" [attr.flex]=\"field.flex||0\" [attr.data-row]=\"field.row\" layout-margin>\n                                </msa-generic-form-custom-field>\n                            }\n                            <!-- #endregion -->\n                        }\n                    }\n                }\n                <!-- #region Template for custom fields -->\n                @for (customField of customFieldsTemplates; track customField) {\n                    @if (customField?.templateRef && customField.row == fields[0]?.row && customField.inline) {\n                        <ng-template [ngTemplateOutlet]=\"$safeNavigationMigration(customField?.templateRef)!\" [ngTemplateOutletContext]=\"{formGroup: formGroup}\"></ng-template>\n                    }\n                }\n                <!-- #endregion -->\n            </div>\n            <!-- #region Template for custom fields -->\n            @if (customFields) {\n                <ng-container [ngTemplateOutlet]=\"customFields\" [ngTemplateOutletContext]=\"{formGroup: formGroup, row: fields[0].row}\"></ng-container>\n            } @for (customField of customFieldsTemplates; track customField) {\n                @if(customField?.templateRef && customField.row ==  ((($safeNavigationMigration(fields[0]?.row) | func:formValue:formGroup:context) ??0)+1) && !customField.inline) {\n                    <ng-template [ngTemplateOutlet]=\"$safeNavigationMigration(customField?.templateRef)!\" [ngTemplateOutletContext]=\"{formGroup: formGroup}\"></ng-template>\n                }\n            }\n            <!-- #endregion -->\n        }\n        <!-- #endregion -->\n        <!-- #region Form bottom -->\n        @if (bottom) {\n            <ng-container [ngTemplateOutlet]=\"bottom\" [ngTemplateOutletContext]=\"{formGroup: formGroup}\"></ng-container>\n        }\n        <!-- #endregion -->\n        <!-- #region Template for suffix buttons -->\n        <ng-template #suffixButtons let-field>\n            @for (suffixButton of field.suffixButtons; track suffixButton) {\n                <ng-container matSuffix>\n                    @if (!suffixButton.hide || !suffixButton.hide(formValue, context)) {\n                        <button type=\"button\" mat-icon-button (click)=\"suffixButton.event && suffixButton.event(formValue, context)\">\n                            <mat-icon fontSet=\"material-symbols-outlined\">{{suffixButton.icon}}</mat-icon>\n                        </button>\n                    }\n                </ng-container>\n            }\n        </ng-template>\n        <!-- #endregion -->\n        <!-- #region Debug value -->\n        @if (debugValue) {\n            <code>\n                <pre>{{formValue | json}}</pre>\n            </code>\n        }\n        <!-- #endregion -->\n    </div>\n}", styles: [".mat-checkbox-wrap mat-error{transform:translate(36px,-20px);max-width:93%;font-size:var(--mat-typography-caption-font-size, 12px)}::ng-deep .mat-mdc-form-field .mat-mdc-text-field-wrapper .mat-mdc-form-field-flex .mat-mdc-form-field-icon-suffix .color-picker{width:40px;display:block}::ng-deep .mat-mdc-form-field .mat-mdc-text-field-wrapper .mat-mdc-form-field-flex .has-time input:first-child{width:84px;max-width:inherit;min-width:84px}::ng-deep .mat-mdc-form-field-type-mat-chip-grid .mat-mdc-form-field-infix{padding-top:7px!important;padding-bottom:7px!important}::ng-deep .mat-mdc-form-field-type-mat-chip-grid .mat-mdc-chip{padding-top:0!important;padding-bottom:0!important;margin-top:2px!important;margin-bottom:2px!important;margin-left:4px!important}.radio-form-field{width:100%}.radio-form-field ::ng-deep .mat-mdc-form-field-infix{padding-top:0!important;padding-bottom:0!important}.radio-form-field ::ng-deep .mat-mdc-floating-label{transform:translateY(-1.5em) scale(1)}.radio-form-field mat-radio-group{display:flex;flex-direction:row;gap:20px;padding-top:4px;margin-left:-12px}.radio-form-field .mat-mdc-form-field-infix{min-height:48px;display:flex;align-items:center}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$2.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],[formArray],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "ngmodule", type: 
                 //--------------------
                 MatAutocompleteModule }, { kind: "ngmodule", type: MatChipsModule }, { kind: "ngmodule", type: MatDatepickerModule }, { kind: "ngmodule", type: MatFormFieldModule }, { kind: "directive", type: i2$1.MatSuffix, selector: "[matSuffix], [matIconSuffix], [matTextSuffix]", inputs: ["matTextSuffix"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i4.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: MatIconButton, selector: "button[mat-icon-button], a[mat-icon-button], button[matIconButton], a[matIconButton]", exportAs: ["matButton", "matAnchor"] }, { kind: "ngmodule", type: MatInputModule }, { kind: "ngmodule", type: MatSelectModule }, { kind: "ngmodule", type: MatCheckboxModule }, { kind: "ngmodule", type: MatRadioModule }, { kind: "ngmodule", type: 
                 //--------------------
@@ -26483,7 +27035,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.7", ngImpor
                         MsaGenericFormMsaSelectFieldComponent,
                         MsaGenericFormMsaChipsFieldComponent,
                         MsaGenericFormMsaListFieldComponent
-                    ], template: "@if (formGroup && fieldRows) {\n    <div [formGroup]=\"formGroup!\">\n        <!-- #region Fields -->\n        @for (fields of fieldRows; track fields; let i = $index) {\n            <div layout-gt-sm=\"row\" layout=\"column\">\n                @for (field of fields; track field) {\n                    @if (!field.hidden && !(field.hide && field.hide(formValue, formGroup, context))) {\n                        @switch (field.type) {\n                            <!-- #region Text input -->\n                            @case (FormFieldType.Text) {\n                                <msa-generic-form-text-field [field]=\"field\"\n                                                             [formGroup]=\"formGroup\"\n                                                             [readonly]=\"readonly ?? false\"\n                                                             [context]=\"context\"\n                                                             [attr.flex]=\"field.flex||0\"\n                                                             layout-margin>\n                                </msa-generic-form-text-field>\n                            }\n                            <!-- #endregion -->\n\n                            <!-- #region Textarea -->\n                            @case (FormFieldType.TextArea) {\n                                <msa-generic-form-textarea-field [field]=\"field\"\n                                                                 [formGroup]=\"formGroup\" [readonly]=\"readonly ?? false\"\n                                                                 [context]=\"context\"\n                                                                 [attr.flex]=\"field.flex||0\"\n                                                                 layout-margin>\n                                </msa-generic-form-textarea-field>\n                            }\n                            <!-- #endregion -->\n\n                            <!-- #region Enum -->\n                            @case (FormFieldType.Enum) {\n                                <msa-generic-form-enum-field [field]=\"field\" [formGroup]=\"formGroup\"\n                                                             [readonly]=\"readonly ?? false\"\n                                                             [context]=\"context\"\n                                                             [attr.flex]=\"field.flex||0\"\n                                                             layout-margin>\n                                </msa-generic-form-enum-field>\n                            }\n                            <!-- #endregion -->\n\n                            <!-- #region VdSelect -->\n                            @case (FormFieldType.VdSelect) {\n                                <msa-generic-form-msa-select-field [field]=\"field\"\n                                                                   [formGroup]=\"formGroup\"\n                                                                   [readonly]=\"readonly ?? false\"\n                                                                   [context]=\"context\"\n                                                                   [attr.flex]=\"field.flex||0\"\n                                                                   layout-margin>\n                                </msa-generic-form-msa-select-field>\n                            }\n                            <!-- #endregion -->\n\n                            <!-- #region VdList -->\n                            @case (FormFieldType.VdList) {\n                                <msa-generic-form-msa-list-field [field]=\"field\"\n                                                                 [formGroup]=\"formGroup\"\n                                                                 [readonly]=\"readonly ?? false\"\n                                                                 [context]=\"context\"\n                                                                 [attr.flex]=\"field.flex||0\"\n                                                                 layout-margin>\n                                </msa-generic-form-msa-list-field>\n                            }\n                            <!-- #endregion -->\n\n                            <!-- #region Chips -->\n                            @case (FormFieldType.Chips) {\n                                <msa-generic-form-chips-field [field]=\"field\"\n                                                              [formGroup]=\"formGroup\"\n                                                              [readonly]=\"readonly ?? false\"\n                                                              [context]=\"context\"\n                                                              [separatorKeysCodes]=\"separatorKeysCodes\"\n                                                              [autocompleteFilteredOptions]=\"autocompleteFilteredOptions\"\n                                                              [filterAutocomplete]=\"filterAutocomplete.bind(this)\"\n                                                              [autocompleteValueSelected]=\"autocompleteValueSelected.bind(this)\"\n                                                              [addChip]=\"addChip.bind(this)\"\n                                                              [onPasteChips]=\"onPasteChips.bind(this)\"\n                                                              [removeChip]=\"removeChip.bind(this)\"\n                                                              [attr.flex]=\"field.flex||0\"\n                                                              layout-margin>\n                                </msa-generic-form-chips-field>\n                            }\n                            <!-- #endregion -->\n\n                            <!-- #region VdChips -->\n                            @case (FormFieldType.VdChips) {\n                                <msa-generic-form-msa-chips-field [field]=\"field\"\n                                                                  [formGroup]=\"formGroup\"\n                                                                  [readonly]=\"readonly ?? false\"\n                                                                  [context]=\"context\"\n                                                                  [attr.flex]=\"field.flex||0\"\n                                                                  layout-margin>\n                                </msa-generic-form-msa-chips-field>\n                            }\n                            <!-- #endregion -->\n\n                            <!-- #region Select -->\n                            @case (FormFieldType.Select) {\n                                <msa-generic-form-select-field [field]=\"field\"\n                                                               [formGroup]=\"formGroup\"\n                                                               [readonly]=\"readonly ?? false\"\n                                                               [context]=\"context\"\n                                                               [attr.flex]=\"field.flex||0\"\n                                                               layout-margin>\n                                </msa-generic-form-select-field>\n                            }\n                            <!-- #endregion -->\n\n                            <!-- #region Autocomplete -->\n                            @case (FormFieldType.Autocomplete) {\n                                <msa-generic-form-autocomplete-field [field]=\"field\"\n                                                                     [formGroup]=\"formGroup\"\n                                                                     [readonly]=\"readonly ?? false\"\n                                                                     [context]=\"context\"\n                                                                     [autocompleteFilteredOptions]=\"autocompleteFilteredOptions\"\n                                                                     [filterAutocomplete]=\"filterAutocomplete.bind(this)\"\n                                                                     [attr.flex]=\"field.flex||0\"\n                                                                     layout-margin>\n                                </msa-generic-form-autocomplete-field>\n                            }\n                            <!-- #endregion -->\n\n                            <!-- #region Date -->\n                            @case (FormFieldType.Date) {\n                                <msa-generic-form-date-field [field]=\"field\"\n                                                             [formGroup]=\"formGroup\"\n                                                             [readonly]=\"readonly ?? false\"\n                                                             [context]=\"context\"\n                                                             [datePickerHeaderComponent]=\"datePickerHeaderComponent\"\n                                                             [handleDatePickerFilterAsync]=\"handleDatePickerFilterAsync.bind(this)\"\n                                                             [handleDatePickerOpened]=\"handleDatePickerOpened.bind(this)\"\n                                                             [attr.flex]=\"field.flex||0\"\n                                                             layout-margin>\n                                </msa-generic-form-date-field>\n                            }\n                            <!-- #endregion -->\n\n                            <!-- #region Calendar -->\n                            @case (FormFieldType.Calendar) {\n                                <msa-generic-form-calendar-field [field]=\"field\"\n                                                                 [formGroup]=\"formGroup\"\n                                                                 [readonly]=\"readonly ?? false\"\n                                                                 [context]=\"context\"\n                                                                 [datePickerHeaderComponent]=\"datePickerHeaderComponent\"\n                                                                 [handleCalendarFilterAsync]=\"handleCalendarFilterAsync.bind(this)\"\n                                                                 [attr.flex]=\"field.flex||0\"\n                                                                 layout-margin>\n                                </msa-generic-form-calendar-field>\n                            }\n                            <!-- #endregion -->\n\n                            <!-- #region Color input -->\n                            @case (FormFieldType.Color) {\n                                <msa-generic-form-color-field [field]=\"field\"\n                                                              [formGroup]=\"formGroup\"\n                                                              [readonly]=\"readonly ?? false\"\n                                                              [context]=\"context\"\n                                                              [attr.flex]=\"field.flex||0\"\n                                                              layout-margin>\n                                </msa-generic-form-color-field>\n                            }\n                            <!-- #endregion -->\n\n                            <!-- #region Checkbox -->\n                            @case (FormFieldType.Checkbox) {\n                                <msa-generic-form-checkbox-field [field]=\"field\"\n                                                                 [formGroup]=\"formGroup\"\n                                                                 [readonly]=\"readonly ?? false\"\n                                                                 [context]=\"context\"\n                                                                 [attr.flex]=\"field.flex||0\">\n                                </msa-generic-form-checkbox-field>\n                            }\n                            <!-- #endregion -->\n\n                            <!-- #region Radio -->\n                            @case(FormFieldType.Radio) {\n                                <msa-generic-form-radio-field [field]=\"field\"\n                                                              [formGroup]=\"formGroup\"\n                                                              [readonly]=\"readonly ?? false\"\n                                                              [context]=\"context\"\n                                                              [attr.flex]=\"field.flex||0\"\n                                                              layout-margin>\n                                </msa-generic-form-radio-field>\n                            }\n                            <!-- #endregion -->\n\n                            <!-- #region Editor -->\n                            @case (FormFieldType.Editor) {\n                                <msa-generic-form-editor-field [field]=\"field\"\n                                                               [formGroup]=\"formGroup\"\n                                                               [editorTemplate]=\"editorTemplate\"\n                                                               [attr.flex]=\"field.flex||0\"\n                                                               layout-margin>\n                                </msa-generic-form-editor-field>\n                            }\n                            <!-- #endregion -->\n\n                            <!-- #region Code -->\n                            @case (FormFieldType.Code) {\n                                <msa-generic-form-code-field [field]=\"field\"\n                                                             [formGroup]=\"formGroup\"\n                                                             [codeTemplate]=\"codeTemplate\"\n                                                             [attr.flex]=\"field.flex||0\"\n                                                             layout-margin>\n                                </msa-generic-form-code-field>\n                            }\n                            <!-- #endregion -->\n\n                            <!-- #region File -->\n                            @case (FormFieldType.File) {\n                                <msa-generic-form-file-field [field]=\"field\"\n                                                             [formGroup]=\"formGroup\"\n                                                             [readonly]=\"readonly ?? false\"\n                                                             [context]=\"context\"\n                                                             [attr.flex]=\"field.flex||0\"\n                                                             layout-margin>\n                                </msa-generic-form-file-field>\n                            }\n                            <!-- #endregion -->\n\n                            <!-- #region Custom -->\n                            @case (FormFieldType.Custom) {\n                                <msa-generic-form-custom-field [field]=\"field\"\n                                                               [formGroup]=\"formGroup\"\n                                                               [customTemplate]=\"customTemplate\"\n                                                               [attr.flex]=\"field.flex||0\"\n                                                               layout-margin>\n                                </msa-generic-form-custom-field>\n                            }\n                            <!-- #endregion -->\n                        }\n                    }\n                }\n\n                <!-- #region Template for custom fields -->\n                @for (customField of customFieldsTemplates; track customField) {\n                    @if (customField?.templateRef && customField.row == fields[0]?.row && customField.inline) {\n                        <ng-template [ngTemplateOutlet]=\"$safeNavigationMigration(customField?.templateRef)!\" [ngTemplateOutletContext]=\"{formGroup: formGroup}\"></ng-template>\n                    }\n                }\n                <!-- #endregion -->\n            </div>\n            <!-- #region Template for custom fields -->\n            @if (customFields) {\n                <ng-container [ngTemplateOutlet]=\"customFields\" [ngTemplateOutletContext]=\"{formGroup: formGroup, row: fields[0].row}\"></ng-container>\n            } @for (customField of customFieldsTemplates; track customField) {\n                @if(customField?.templateRef && customField.row ==  ((($safeNavigationMigration(fields[0]?.row) | func:formValue:formGroup:context) ??0)+1) && !customField.inline) {\n                    <ng-template [ngTemplateOutlet]=\"$safeNavigationMigration(customField?.templateRef)!\" [ngTemplateOutletContext]=\"{formGroup: formGroup}\"></ng-template>\n                }\n            }\n            <!-- #endregion -->\n        }\n        <!-- #endregion -->\n\n        <!-- #region Form bottom -->\n        @if (bottom) {\n            <ng-container [ngTemplateOutlet]=\"bottom\" [ngTemplateOutletContext]=\"{formGroup: formGroup}\"></ng-container>\n        }\n        <!-- #endregion -->\n\n        <!-- #region Template for suffix buttons -->\n        <ng-template #suffixButtons let-field>\n            @for (suffixButton of field.suffixButtons; track suffixButton) {\n                <ng-container matSuffix>\n                    @if (!suffixButton.hide || !suffixButton.hide(formValue, context)) {\n                        <button type=\"button\"\n                                mat-icon-button\n                                (click)=\"suffixButton.event && suffixButton.event(formValue, context)\">\n                            <mat-icon fontSet=\"material-symbols-outlined\">{{suffixButton.icon}}</mat-icon>\n                        </button>\n                    }\n                </ng-container>\n            }\n        </ng-template>\n        <!-- #endregion -->\n        <!-- #region Debug value -->\n        @if (debugValue) {\n            <code>\n                <pre>{{formValue | json}}</pre>\n            </code>\n        }\n        <!-- #endregion -->\n    </div>\n}", styles: [".mat-checkbox-wrap mat-error{transform:translate(36px,-20px);max-width:93%;font-size:var(--mat-typography-caption-font-size, 12px)}::ng-deep .mat-mdc-form-field .mat-mdc-text-field-wrapper .mat-mdc-form-field-flex .mat-mdc-form-field-icon-suffix .color-picker{width:40px;display:block}::ng-deep .mat-mdc-form-field .mat-mdc-text-field-wrapper .mat-mdc-form-field-flex .has-time input:first-child{width:84px;max-width:inherit;min-width:84px}::ng-deep .mat-mdc-form-field-type-mat-chip-grid .mat-mdc-form-field-infix{padding-top:7px!important;padding-bottom:7px!important}::ng-deep .mat-mdc-form-field-type-mat-chip-grid .mat-mdc-chip{padding-top:0!important;padding-bottom:0!important;margin-top:2px!important;margin-bottom:2px!important;margin-left:4px!important}.radio-form-field{width:100%}.radio-form-field ::ng-deep .mat-mdc-form-field-infix{padding-top:0!important;padding-bottom:0!important}.radio-form-field ::ng-deep .mat-mdc-floating-label{transform:translateY(-1.5em) scale(1)}.radio-form-field mat-radio-group{display:flex;flex-direction:row;gap:20px;padding-top:4px;margin-left:-12px}.radio-form-field .mat-mdc-form-field-infix{min-height:48px;display:flex;align-items:center}\n"] }]
+                    ], template: "@if (formGroup && fieldRows) {\n    <div [formGroup]=\"formGroup!\">\n        <!-- #region Fields -->\n        @for (fields of fieldRows; track fields; let i = $index) {\n            <div layout-gt-sm=\"row\" layout=\"column\">\n                @for (field of fields; track field) {\n                    @if (!field.hidden && !(field.hide && field.hide(formValue, formGroup, context))) {\n                        @switch (field.type) {\n                            <!-- #region Text input -->\n                            @case (FormFieldType.Text) {\n                                <msa-generic-form-text-field [field]=\"field\" [formGroup]=\"formGroup\" [readonly]=\"readonly ?? false\" [context]=\"context\" [attr.flex]=\"field.flex||0\" [attr.data-row]=\"field.row\" layout-margin>\n                                </msa-generic-form-text-field>\n                            }\n                            <!-- #endregion -->\n                            <!-- #region Textarea -->\n                            @case (FormFieldType.TextArea) {\n                                <msa-generic-form-textarea-field [field]=\"field\" [formGroup]=\"formGroup\" [readonly]=\"readonly ?? false\" [context]=\"context\" [attr.flex]=\"field.flex||0\" [attr.data-row]=\"field.row\" layout-margin>\n                                </msa-generic-form-textarea-field>\n                            }\n                            <!-- #endregion -->\n                            <!-- #region Enum -->\n                            @case (FormFieldType.Enum) {\n                                <msa-generic-form-enum-field [field]=\"field\" [formGroup]=\"formGroup\" [readonly]=\"readonly ?? false\" [context]=\"context\" [attr.flex]=\"field.flex||0\" [attr.data-row]=\"field.row\" layout-margin>\n                                </msa-generic-form-enum-field>\n                            }\n                            <!-- #endregion -->\n                            <!-- #region VdSelect -->\n                            @case (FormFieldType.VdSelect) {\n                                <msa-generic-form-msa-select-field [field]=\"field\" [formGroup]=\"formGroup\" [readonly]=\"readonly ?? false\" [context]=\"context\" [attr.flex]=\"field.flex||0\" [attr.data-row]=\"field.row\" layout-margin>\n                                </msa-generic-form-msa-select-field>\n                            }\n                            <!-- #endregion -->\n                            <!-- #region VdList -->\n                            @case (FormFieldType.VdList) {\n                                <msa-generic-form-msa-list-field [field]=\"field\" [formGroup]=\"formGroup\" [readonly]=\"readonly ?? false\" [context]=\"context\" [attr.flex]=\"field.flex||0\" [attr.data-row]=\"field.row\" layout-margin>\n                                </msa-generic-form-msa-list-field>\n                            }\n                            <!-- #endregion -->\n                            <!-- #region Chips -->\n                            @case (FormFieldType.Chips) {\n                                <msa-generic-form-chips-field [field]=\"field\" [formGroup]=\"formGroup\" [readonly]=\"readonly ?? false\" [context]=\"context\" [separatorKeysCodes]=\"separatorKeysCodes\" [autocompleteFilteredOptions]=\"autocompleteFilteredOptions\" [filterAutocomplete]=\"filterAutocomplete.bind(this)\" [autocompleteValueSelected]=\"autocompleteValueSelected.bind(this)\" [addChip]=\"addChip.bind(this)\" [onPasteChips]=\"onPasteChips.bind(this)\" [removeChip]=\"removeChip.bind(this)\" [attr.flex]=\"field.flex||0\" [attr.data-row]=\"field.row\" layout-margin>\n                                </msa-generic-form-chips-field>\n                            }\n                            <!-- #endregion -->\n                            <!-- #region VdChips -->\n                            @case (FormFieldType.VdChips) {\n                                <msa-generic-form-msa-chips-field [field]=\"field\" [formGroup]=\"formGroup\" [readonly]=\"readonly ?? false\" [context]=\"context\" [attr.flex]=\"field.flex||0\" [attr.data-row]=\"field.row\" layout-margin>\n                                </msa-generic-form-msa-chips-field>\n                            }\n                            <!-- #endregion -->\n                            <!-- #region Select -->\n                            @case (FormFieldType.Select) {\n                                <msa-generic-form-select-field [field]=\"field\" [formGroup]=\"formGroup\" [readonly]=\"readonly ?? false\" [context]=\"context\" [attr.flex]=\"field.flex||0\" [attr.data-row]=\"field.row\" layout-margin>\n                                </msa-generic-form-select-field>\n                            }\n                            <!-- #endregion -->\n                            <!-- #region Autocomplete -->\n                            @case (FormFieldType.Autocomplete) {\n                                <msa-generic-form-autocomplete-field [field]=\"field\" [formGroup]=\"formGroup\" [readonly]=\"readonly ?? false\" [context]=\"context\" [autocompleteFilteredOptions]=\"autocompleteFilteredOptions\" [filterAutocomplete]=\"filterAutocomplete.bind(this)\" [attr.flex]=\"field.flex||0\" [attr.data-row]=\"field.row\" layout-margin>\n                                </msa-generic-form-autocomplete-field>\n                            }\n                            <!-- #endregion -->\n                            <!-- #region Date -->\n                            @case (FormFieldType.Date) {\n                                <msa-generic-form-date-field [field]=\"field\" [formGroup]=\"formGroup\" [readonly]=\"readonly ?? false\" [context]=\"context\" [datePickerHeaderComponent]=\"datePickerHeaderComponent\" [handleDatePickerFilterAsync]=\"handleDatePickerFilterAsync.bind(this)\" [handleDatePickerOpened]=\"handleDatePickerOpened.bind(this)\" [attr.flex]=\"field.flex||0\" [attr.data-row]=\"field.row\" layout-margin>\n                                </msa-generic-form-date-field>\n                            }\n                            <!-- #endregion -->\n                            <!-- #region Calendar -->\n                            @case (FormFieldType.Calendar) {\n                                <msa-generic-form-calendar-field [field]=\"field\" [formGroup]=\"formGroup\" [readonly]=\"readonly ?? false\" [context]=\"context\" [datePickerHeaderComponent]=\"datePickerHeaderComponent\" [handleCalendarFilterAsync]=\"handleCalendarFilterAsync.bind(this)\" [attr.flex]=\"field.flex||0\" [attr.data-row]=\"field.row\" layout-margin>\n                                </msa-generic-form-calendar-field>\n                            }\n                            <!-- #endregion -->\n                            <!-- #region Color input -->\n                            @case (FormFieldType.Color) {\n                                <msa-generic-form-color-field [field]=\"field\" [formGroup]=\"formGroup\" [readonly]=\"readonly ?? false\" [context]=\"context\" [attr.flex]=\"field.flex||0\" [attr.data-row]=\"field.row\" layout-margin>\n                                </msa-generic-form-color-field>\n                            }\n                            <!-- #endregion -->\n                            <!-- #region Checkbox -->\n                            @case (FormFieldType.Checkbox) {\n                                <msa-generic-form-checkbox-field [field]=\"field\" [formGroup]=\"formGroup\" [readonly]=\"readonly ?? false\" [context]=\"context\" [attr.flex]=\"field.flex||0\" [attr.data-row]=\"field.row\">\n                                </msa-generic-form-checkbox-field>\n                            }\n                            <!-- #endregion -->\n                            <!-- #region Radio -->\n                            @case(FormFieldType.Radio) {\n                                <msa-generic-form-radio-field [field]=\"field\" [formGroup]=\"formGroup\" [readonly]=\"readonly ?? false\" [context]=\"context\" [attr.flex]=\"field.flex||0\" [attr.data-row]=\"field.row\" layout-margin>\n                                </msa-generic-form-radio-field>\n                            }\n                            <!-- #endregion -->\n                            <!-- #region Editor -->\n                            @case (FormFieldType.Editor) {\n                                <msa-generic-form-editor-field [field]=\"field\" [formGroup]=\"formGroup\" [editorTemplate]=\"editorTemplate\" [attr.flex]=\"field.flex||0\" [attr.data-row]=\"field.row\" layout-margin>\n                                </msa-generic-form-editor-field>\n                            }\n                            <!-- #endregion -->\n                            <!-- #region Code -->\n                            @case (FormFieldType.Code) {\n                                <msa-generic-form-code-field [field]=\"field\" [formGroup]=\"formGroup\" [codeTemplate]=\"codeTemplate\" [attr.flex]=\"field.flex||0\" [attr.data-row]=\"field.row\" layout-margin>\n                                </msa-generic-form-code-field>\n                            }\n                            <!-- #endregion -->\n                            <!-- #region File -->\n                            @case (FormFieldType.File) {\n                                <msa-generic-form-file-field [field]=\"field\" [formGroup]=\"formGroup\" [readonly]=\"readonly ?? false\" [context]=\"context\" [attr.flex]=\"field.flex||0\" [attr.data-row]=\"field.row\" layout-margin>\n                                </msa-generic-form-file-field>\n                            }\n                            <!-- #endregion -->\n                            <!-- #region Custom -->\n                            @case (FormFieldType.Custom) {\n                                <msa-generic-form-custom-field [field]=\"field\" [formGroup]=\"formGroup\" [customTemplate]=\"customTemplate\" [attr.flex]=\"field.flex||0\" [attr.data-row]=\"field.row\" layout-margin>\n                                </msa-generic-form-custom-field>\n                            }\n                            <!-- #endregion -->\n                        }\n                    }\n                }\n                <!-- #region Template for custom fields -->\n                @for (customField of customFieldsTemplates; track customField) {\n                    @if (customField?.templateRef && customField.row == fields[0]?.row && customField.inline) {\n                        <ng-template [ngTemplateOutlet]=\"$safeNavigationMigration(customField?.templateRef)!\" [ngTemplateOutletContext]=\"{formGroup: formGroup}\"></ng-template>\n                    }\n                }\n                <!-- #endregion -->\n            </div>\n            <!-- #region Template for custom fields -->\n            @if (customFields) {\n                <ng-container [ngTemplateOutlet]=\"customFields\" [ngTemplateOutletContext]=\"{formGroup: formGroup, row: fields[0].row}\"></ng-container>\n            } @for (customField of customFieldsTemplates; track customField) {\n                @if(customField?.templateRef && customField.row ==  ((($safeNavigationMigration(fields[0]?.row) | func:formValue:formGroup:context) ??0)+1) && !customField.inline) {\n                    <ng-template [ngTemplateOutlet]=\"$safeNavigationMigration(customField?.templateRef)!\" [ngTemplateOutletContext]=\"{formGroup: formGroup}\"></ng-template>\n                }\n            }\n            <!-- #endregion -->\n        }\n        <!-- #endregion -->\n        <!-- #region Form bottom -->\n        @if (bottom) {\n            <ng-container [ngTemplateOutlet]=\"bottom\" [ngTemplateOutletContext]=\"{formGroup: formGroup}\"></ng-container>\n        }\n        <!-- #endregion -->\n        <!-- #region Template for suffix buttons -->\n        <ng-template #suffixButtons let-field>\n            @for (suffixButton of field.suffixButtons; track suffixButton) {\n                <ng-container matSuffix>\n                    @if (!suffixButton.hide || !suffixButton.hide(formValue, context)) {\n                        <button type=\"button\" mat-icon-button (click)=\"suffixButton.event && suffixButton.event(formValue, context)\">\n                            <mat-icon fontSet=\"material-symbols-outlined\">{{suffixButton.icon}}</mat-icon>\n                        </button>\n                    }\n                </ng-container>\n            }\n        </ng-template>\n        <!-- #endregion -->\n        <!-- #region Debug value -->\n        @if (debugValue) {\n            <code>\n                <pre>{{formValue | json}}</pre>\n            </code>\n        }\n        <!-- #endregion -->\n    </div>\n}", styles: [".mat-checkbox-wrap mat-error{transform:translate(36px,-20px);max-width:93%;font-size:var(--mat-typography-caption-font-size, 12px)}::ng-deep .mat-mdc-form-field .mat-mdc-text-field-wrapper .mat-mdc-form-field-flex .mat-mdc-form-field-icon-suffix .color-picker{width:40px;display:block}::ng-deep .mat-mdc-form-field .mat-mdc-text-field-wrapper .mat-mdc-form-field-flex .has-time input:first-child{width:84px;max-width:inherit;min-width:84px}::ng-deep .mat-mdc-form-field-type-mat-chip-grid .mat-mdc-form-field-infix{padding-top:7px!important;padding-bottom:7px!important}::ng-deep .mat-mdc-form-field-type-mat-chip-grid .mat-mdc-chip{padding-top:0!important;padding-bottom:0!important;margin-top:2px!important;margin-bottom:2px!important;margin-left:4px!important}.radio-form-field{width:100%}.radio-form-field ::ng-deep .mat-mdc-form-field-infix{padding-top:0!important;padding-bottom:0!important}.radio-form-field ::ng-deep .mat-mdc-floating-label{transform:translateY(-1.5em) scale(1)}.radio-form-field mat-radio-group{display:flex;flex-direction:row;gap:20px;padding-top:4px;margin-left:-12px}.radio-form-field .mat-mdc-form-field-infix{min-height:48px;display:flex;align-items:center}\n"] }]
         }], propDecorators: { formGroup: [{
                 type: Input
             }], classType: [{
@@ -30524,5 +31076,5 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.7", ngImpor
  * Generated bundle index. Do not edit.
  */
 
-export { AbstractMatFormField, AbstractSelectFormField, ActionItem, Api, ApiResponse, AppEvent, AppEventType, AppSetting, AppStorage, AsyncValidationDirective, AuditEntity, AuditUser, AuthHelper, AuthUser, AutofocusDirective, BaseComponent, BaseDirective, BaseEntity, BaseInterceptor, BaseService, BindPipe, CachingInterceptor, Column, ColumnObject, Common, CommonError, CommonHandlerContext, ConfirmExitGuard, ContextHelper, DIALOG_PROVIDER, DIALOG_PROVIDER_FACTORY, DataSourceFilterDirective, DataSourcePipe, DatePickerHeaderComponent, DisableControlDirective, Display, DisplayNameNumberProjection, DisplayNameProjection, DynamicBuilder, DynamicComponentCompiler, EXPORT_DIALOG_COMPONENT, EmptyStringResetDirective, EnumMetadata, EnumPipe, EnumService, EqualValidator, ErrorMessageBindingStrategy, EventQueueService, Facet, FacetValue, FieldFuncPipe, FileControlDirective, FileService, FileSizePipe, FilterClearComponent, FilterDateComponent, FilterGlue, FilterInputComponent, FilterOperator, FilterPipe, FilterSelectComponent, FirstLetterPipe, Form, FormArrayPipe, FormBuilderConfiguration, FormControlPipe, FormDefinition, FormField, FormFieldDefinition, FormFieldGroup, FormFieldGroupDefinition, FormFieldType, FormGroupPipe, FuncPipe, GenericEmbeddedListComponent, GenericFormBaseComponent, GenericFormComponent, GenericListComponent, GenericReactiveFormComponent, GenericService, GlobalRoles, Grid, GroupFilterPipe, HtmlControlTemplateDirective, IAbstractControl, Icon, ImageFileControlDirective, IpVersion, KeyValue, KeysPipe, LayoutToggle, LoadingScreenInterceptor, LoadingScreenService, MEDIA_PROVIDER, MEDIA_PROVIDER_FACTORY, MatFormFieldEditorDirective, MatFormFieldRadioDirective, MatFormFieldReadonlyDirective, Menu, MenuClient, MenuDepartment, MenuFormIncludesResolve, MenuItem, MenuItemClient, MenuItemDepartment, MenuItemFormIncludesResolve, MenuItemService, MenuItemTarget, MenuListProjectionResolve, MenuResolve, MenuScope, MenuSettings, MenuSettingsResolve, MessageType, ModifiableEntity, MonthNamePipe, MsaEditFormActionsComponent, MsaEnumDisplayComponent, NameNumberProjection, NameProjection, NativeElementInjectorDirective, NumericValueType, OnlyNumberDirective, OrderPipe, Pagination, PaginatorIntl, ParseDecimalDirective, Permission, PlaceholderPipe, PrefixDirective, PrintService, PropertyJoinPipe, ReactiveFormConfig, ReactiveTypedFormsModule, RemoveWhitespaceDirective, ResetFormType, RxFormArray, RxFormBuilder, RxFormControl, RxFormControlDirective, RxFormGroup, RxReactiveFormsModule, RxwebFormDirective, RxwebValidators, SafeHtmlPipe, Salutation, SaveAction, SplitPipe, SubMenuResolve, SuffixButton, Table, TableColumn, TableColumnConfig, TableColumnType, TableConfig, TableDataSource, TableDefinition, TableQueryConfig, TableStaticDataSource, TaskDialogData, Templates, TimePipe, TitleCase, TitleProjection, TruncatePipe, TypedForm, TypedFormBuilder, UniqueValidatorDirective, UrlValidationType, Utils, ValidationAlphabetLocale, ValueAccessorBase, ValuesPipe, VdAlertDialogComponent, VdChipsComponent, VdCodeDirective, VdConfirmDialogComponent, VdCustomDirective, VdDelayedHoverDirective, VdDialogActionsDirective, VdDialogComponent, VdDialogContentDirective, VdDialogHeaderActionsComponent, VdDialogHeaderComponent, VdDialogMaximizeDirective, VdDialogService, VdDialogTitleDirective, VdDynamicMenuComponent, VdDynamicTableComponent, VdDynamicTableConfigDialogComponent, VdEditorDirective, VdFileDirective, VdFileInputComponent, VdFileModule, VdFilterOptionDirective, VdGenericFormComponent, VdGenericFormCustomFieldDirective, VdLayoutCardOverComponent, VdLayoutCloseDirective, VdLayoutCompactComponent, VdLayoutComponent, VdLayoutFooterComponent, VdLayoutManageListCloseDirective, VdLayoutManageListComponent, VdLayoutManageListOpenDirective, VdLayoutManageListToggleDirective, VdLayoutNavComponent, VdLayoutNavListCloseDirective, VdLayoutNavListComponent, VdLayoutNavListOpenDirective, VdLayoutNavListToggleDirective, VdLayoutOpenDirective, VdLayoutToggleDirective, VdListOptionDirective, VdListToolbarComponent, VdMediaService, VdMediaToggleDirective, VdMenuComponent, VdNavigationDrawerComponent, VdNavigationDrawerMenuDirective, VdNavigationDrawerToolbarDirective, VdPromptDialogComponent, VdSelectComponent, VdSelectOptionDirective, VdSelectTriggerDirective, VdTableFieldDirective, VdTaskDialogComponent, allOf, allOfAsync, alpha, alphaAsync, alphaNumeric, alphaNumericAsync, and, ascii, async, blacklist, choice, choiceAsync, compare, compose, contains, containsAsync, creditCard, creditCardAsync, cusip, custom, customAsync, dataUri, date, dateAsync, different, digit, disable, elementClass, email, endpointMetadataKey, endsWith, endsWithAsync, error, escape, even, extension, extensionAsync, factor, factorAsync, file, fileAsync, fileSize, fileSizeAsync, formDefinitionMetadataKey, formFieldGroupsMetadataKey, formFieldsMetadataKey, getDisplay, getEndpoint, getFormDefinition, getFormGroups, getTableDefinition, graphql, greaterThan, greaterThanAsync, greaterThanEqualTo, greaterThanEqualToAsync, grid, headerMetadataKey, hexColor, iban, ibanAsync, image, imageAsync, json, latLong, latitude, leapYear, lessThan, lessThanAsync, lessThanEqualTo, lessThanEqualToAsync, longitude, lowerCase, ltrim, mac, mask, maxDate, maxDateAsync, maxLength, maxLengthAsync, maxNumber, maxNumberAsync, maxTime, maxTimeAsync, minDate, minDateAsync, minLength, minLengthAsync, minNumber, minNumberAsync, minTime, minTimeAsync, mixinDisableRipple, mixinDisabled, model, noneOf, noneOfAsync, not, notEmpty, numeric, numericAsync, odd, oneOf, oneOfAsync, or, parseProjectionString, password, passwordAsync, pattern, patternAsync, port, prefix, primeNumber, prop, propArray, propObject, range, rangeAsync, required, requiredTrue, rtrim, rule, sanitize, startsWith, startsWithAsync, stripLow, suffix, tableColumnsMetadataKey, tableDefinitionMetadataKey, time, timeAsync, toBoolean, toDate, toDouble, toFloat, toInt, toString, trim, unique, updateOn, upperCase, url, urlAsync, whitelist };
+export { AbstractMatFormField, AbstractSelectFormField, ActionItem, Api, ApiResponse, AppEvent, AppEventType, AppSetting, AppStorage, AsyncValidationDirective, AuditEntity, AuditUser, AuthHelper, AuthUser, AutofocusDirective, BaseComponent, BaseDirective, BaseEntity, BaseInterceptor, BaseService, BindPipe, CachingInterceptor, Column, ColumnObject, Common, CommonError, CommonHandlerContext, ConfirmExitGuard, ContextHelper, DIALOG_PROVIDER, DIALOG_PROVIDER_FACTORY, DataSourceFilterDirective, DataSourcePipe, DatePickerHeaderComponent, DisableControlDirective, Display, DisplayNameNumberProjection, DisplayNameProjection, DynamicBuilder, DynamicComponentCompiler, EXPORT_DIALOG_COMPONENT, EmptyStringResetDirective, EnumMetadata, EnumPipe, EnumService, EqualValidator, ErrorMessageBindingStrategy, EventQueueService, Facet, FacetValue, FieldFuncPipe, FileControlDirective, FileService, FileSizePipe, FilterClearComponent, FilterDateComponent, FilterGlue, FilterInputComponent, FilterOperator, FilterPipe, FilterSelectComponent, FirstLetterPipe, Form, FormArrayPipe, FormBuilderConfiguration, FormControlPipe, FormDefinition, FormField, FormFieldDefinition, FormFieldGroup, FormFieldGroupDefinition, FormFieldType, FormGroupPipe, FuncPipe, GenericEmbeddedListComponent, GenericFormBaseComponent, GenericFormComponent, GenericListComponent, GenericReactiveFormComponent, GenericService, GlobalRoles, Grid, GroupFilterPipe, HtmlControlTemplateDirective, IAbstractControl, Icon, ImageFileControlDirective, IpVersion, KeyValue, KeysPipe, LayoutToggle, LoadingScreenInterceptor, LoadingScreenService, MEDIA_PROVIDER, MEDIA_PROVIDER_FACTORY, MatFormFieldEditorDirective, MatFormFieldRadioDirective, MatFormFieldReadonlyDirective, MatInputRequiredDirective, MatSelectRequiredDirective, Menu, MenuClient, MenuDepartment, MenuFormIncludesResolve, MenuItem, MenuItemClient, MenuItemDepartment, MenuItemFormIncludesResolve, MenuItemService, MenuItemTarget, MenuListProjectionResolve, MenuResolve, MenuScope, MenuSettings, MenuSettingsResolve, MessageType, ModifiableEntity, MonthNamePipe, MsaEditFormActionsComponent, MsaEnumDisplayComponent, NameNumberProjection, NameProjection, NativeElementInjectorDirective, NumericValueType, OnlyNumberDirective, OrderPipe, Pagination, PaginatorIntl, ParseDecimalDirective, Permission, PlaceholderPipe, PrefixDirective, PrintService, PropertyJoinPipe, ReactiveFormConfig, ReactiveTypedFormsModule, RemoveWhitespaceDirective, ResetFormType, RxFormArray, RxFormBuilder, RxFormControl, RxFormControlDirective, RxFormGroup, RxReactiveFormsModule, RxwebFormDirective, RxwebValidators, SafeHtmlPipe, Salutation, SaveAction, SplitPipe, SubMenuResolve, SuffixButton, Table, TableColumn, TableColumnConfig, TableColumnType, TableConfig, TableDataSource, TableDefinition, TableQueryConfig, TableStaticDataSource, TaskDialogData, Templates, TimePipe, TitleCase, TitleProjection, TruncatePipe, TypedForm, TypedFormBuilder, UniqueValidatorDirective, UrlValidationType, Utils, ValidationAlphabetLocale, ValueAccessorBase, ValuesPipe, VdAlertDialogComponent, VdChipsComponent, VdCodeDirective, VdConfirmDialogComponent, VdCustomDirective, VdDelayedHoverDirective, VdDialogActionsDirective, VdDialogComponent, VdDialogContentDirective, VdDialogHeaderActionsComponent, VdDialogHeaderComponent, VdDialogMaximizeDirective, VdDialogService, VdDialogTitleDirective, VdDynamicMenuComponent, VdDynamicTableComponent, VdDynamicTableConfigDialogComponent, VdEditorDirective, VdFileDirective, VdFileInputComponent, VdFileModule, VdFilterOptionDirective, VdGenericFormComponent, VdGenericFormCustomFieldDirective, VdLayoutCardOverComponent, VdLayoutCloseDirective, VdLayoutCompactComponent, VdLayoutComponent, VdLayoutFooterComponent, VdLayoutManageListCloseDirective, VdLayoutManageListComponent, VdLayoutManageListOpenDirective, VdLayoutManageListToggleDirective, VdLayoutNavComponent, VdLayoutNavListCloseDirective, VdLayoutNavListComponent, VdLayoutNavListOpenDirective, VdLayoutNavListToggleDirective, VdLayoutOpenDirective, VdLayoutToggleDirective, VdListOptionDirective, VdListToolbarComponent, VdMediaService, VdMediaToggleDirective, VdMenuComponent, VdNavigationDrawerComponent, VdNavigationDrawerMenuDirective, VdNavigationDrawerToolbarDirective, VdPromptDialogComponent, VdSelectComponent, VdSelectOptionDirective, VdSelectTriggerDirective, VdTableFieldDirective, VdTaskDialogComponent, allOf, allOfAsync, alpha, alphaAsync, alphaNumeric, alphaNumericAsync, and, ascii, async, blacklist, choice, choiceAsync, compare, compose, contains, containsAsync, creditCard, creditCardAsync, cusip, custom, customAsync, dataUri, date, dateAsync, different, digit, disable, elementClass, email, endpointMetadataKey, endsWith, endsWithAsync, error, escape, even, extension, extensionAsync, factor, factorAsync, file, fileAsync, fileSize, fileSizeAsync, formDefinitionMetadataKey, formFieldGroupsMetadataKey, formFieldsMetadataKey, getDisplay, getEndpoint, getFormDefinition, getFormGroups, getTableDefinition, graphql, greaterThan, greaterThanAsync, greaterThanEqualTo, greaterThanEqualToAsync, grid, hasRequiredValidator, headerMetadataKey, hexColor, iban, ibanAsync, image, imageAsync, json, latLong, latitude, leapYear, lessThan, lessThanAsync, lessThanEqualTo, lessThanEqualToAsync, longitude, lowerCase, ltrim, mac, mask, maxDate, maxDateAsync, maxLength, maxLengthAsync, maxNumber, maxNumberAsync, maxTime, maxTimeAsync, minDate, minDateAsync, minLength, minLengthAsync, minNumber, minNumberAsync, minTime, minTimeAsync, mixinDisableRipple, mixinDisabled, model, noneOf, noneOfAsync, not, notEmpty, numeric, numericAsync, odd, oneOf, oneOfAsync, or, parseProjectionString, password, passwordAsync, pattern, patternAsync, port, prefix, primeNumber, prop, propArray, propObject, range, rangeAsync, required, requiredTrue, rtrim, rule, sanitize, startsWith, startsWithAsync, stripLow, suffix, tableColumnsMetadataKey, tableDefinitionMetadataKey, time, timeAsync, toBoolean, toDate, toDouble, toFloat, toInt, toString, trim, unique, updateOn, upperCase, url, urlAsync, whitelist };
 //# sourceMappingURL=messaia-cdk.mjs.map