@ieeesa-npm/presentation 0.0.4 → 0.0.6

package/fesm2022/ieeesa-npm-presentation.mjs

@@ -1,983 +1,1096 @@
 import * as i0 from '@angular/core';
-import { EventEmitter, Component, ViewChildren, Input, Output, Directive, ViewEncapsulation, ViewChild, Injectable, Inject, NgModule } from '@angular/core';
+import { Component, Input, ViewEncapsulation, Injectable, EventEmitter, Output, ViewChild, Inject, ViewChildren, Directive, NgModule } from '@angular/core';
 import * as i3 from '@angular/forms';
 import { ReactiveFormsModule, FormControl, FormsModule, Validators } from '@angular/forms';
 import * as i2 from '@angular/common';
 import { CommonModule } from '@angular/common';
 import * as i8 from '@angular/material/button';
 import { MatButtonModule } from '@angular/material/button';
-import { DynamicFormFieldDirective as DynamicFormFieldDirective$1 } from '@presentation/directives/dynamic-form-field/dynamic-form-field.directive';
-import { Subject, takeUntil, filter, debounceTime, distinctUntilChanged, fromEvent, map } from 'rxjs';
-import { InputComponent as InputComponent$1 } from '@presentation/components/input/input.component';
-import { AutocompleteComponent as AutocompleteComponent$1 } from '@presentation/components/autocomplete/autocomplete.component';
-import { CheckboxComponent as CheckboxComponent$1 } from '@presentation/components/checkbox/checkbox.component';
-import { DatePickerComponent as DatePickerComponent$1 } from '@presentation/components/date-picker/date-picker.component';
-import { RadioComponent as RadioComponent$1 } from '@presentation/components/radio/radio.component';
-import { SearchComponent as SearchComponent$1 } from '@presentation/components/search/search.component';
-import { SelectComponent as SelectComponent$1 } from '@presentation/components/select/select.component';
-import { TextAreaComponent as TextAreaComponent$1 } from '@presentation/components/text-area/text-area.component';
-import { FormControlType as FormControlType$1 } from '@presentation/models/form-control-types.model';
-import * as i5$2 from '@angular/material/icon';
-import { MatIconModule } from '@angular/material/icon';
+import { Subject, filter, debounceTime, distinctUntilChanged, takeUntil, fromEvent, map } from 'rxjs';
 import * as i5 from '@angular/material/input';
 import { MatInputModule } from '@angular/material/input';
-import { FormErrorComponent as FormErrorComponent$1 } from '@presentation/components/form-error/form-error.component';
-import * as buttonActionsInfo from '@presentation/assets/constants.json';
+import * as i5$2 from '@angular/material/icon';
+import { MatIconModule } from '@angular/material/icon';
 import * as i4 from '@angular/material/form-field';
 import { MatFormFieldModule } from '@angular/material/form-field';
-import * as i3$1 from '@angular/material/radio';
-import { MatRadioModule } from '@angular/material/radio';
-import * as i1 from '@presentation/services/form-utility.service';
-import * as i3$2 from '@angular/material/list';
-import { MatListModule } from '@angular/material/list';
-import * as i6 from '@angular/material/checkbox';
-import { MatCheckboxModule } from '@angular/material/checkbox';
 import * as i2$1 from '@angular/material/core';
-import { MatOptionModule, DateAdapter, MAT_DATE_LOCALE, MAT_DATE_FORMATS, MatNativeDateModule } from '@angular/material/core';
+import { MatOptionModule, MAT_DATE_FORMATS, MatNativeDateModule, DateAdapter, MAT_DATE_LOCALE } from '@angular/material/core';
 import * as i5$1 from '@angular/material/autocomplete';
 import { MAT_AUTOCOMPLETE_DEFAULT_OPTIONS, MatAutocompleteModule } from '@angular/material/autocomplete';
-import { ValidationPatterns } from '@presentation/validation-patterns';
-import { SearchType as SearchType$1 } from '@presentation/models/search.model';
+import * as i3$1 from '@angular/material/list';
+import { MatListModule } from '@angular/material/list';
+import * as i6 from '@angular/material/checkbox';
+import { MatCheckboxModule } from '@angular/material/checkbox';
 import { MomentDateAdapter, MAT_MOMENT_DATE_ADAPTER_OPTIONS } from '@angular/material-moment-adapter';
 import { MatExpansionModule } from '@angular/material/expansion';
 import * as i7 from '@angular/material/datepicker';
 import { MatDatepickerModule } from '@angular/material/datepicker';
 import { MatMenuModule } from '@angular/material/menu';
 import moment_ from 'moment';
-import { DatePickerHeaderComponent as DatePickerHeaderComponent$1 } from '@presentation/components/date-picker-header/date-picker-header.component';
-import { DateFormats } from '@presentation/date-formats';
-import { CalendarType as CalendarType$1 } from '@presentation/models/calendar.model';
-import * as i2$2 from '@presentation/services/datepicker.service';
+import { DateFormats as DateFormats$1 } from '@presentation/date-formats';
+import * as datePickerInfo from '@presentation/assets/constants.json';
+import * as i3$2 from '@presentation/services/datepicker.service';
+import * as i3$3 from '@angular/material/radio';
+import { MatRadioModule } from '@angular/material/radio';
 import * as i5$3 from '@angular/material/select';
 import { MAT_SELECT_CONFIG, MatSelectModule } from '@angular/material/select';
 
 /**
- * Creates a reactive form dynamically based on the passed form field configuration and handles the form events.
+ * Implements and displays form error messages and form submission error response message on submission of form.
  * @export
- * @class DynamicFormComponent
- * @implements {OnInit}
- * @implements {AfterContentInit}
+ * @class FormErrorComponent
  */
-class DynamicFormComponent {
+class FormErrorComponent {
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.3", ngImport: i0, type: FormErrorComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.3", type: FormErrorComponent, isStandalone: true, selector: "ieeesa-form-error", inputs: { formGroup: "formGroup", config: "config", submitResponse: "submitResponse" }, ngImport: i0, template: "<ng-container *ngIf=\"formGroup\">\r\n  <div\r\n    class=\"ieeesa-body-sm-14 ieeesa-form-error\"\r\n    *ngIf=\"\r\n      formGroup.controls[config.controlName]?.touched ||\r\n      (formGroup.controls[config.controlName]?.dirty &&\r\n        formGroup.controls[config.controlName]?.invalid)\r\n    \"\r\n  >\r\n    <p\r\n      *ngIf=\"formGroup.controls[config.controlName].errors?.['required']\"\r\n      class=\"ieeesa-form-error--text\"\r\n    >\r\n      {{ config.requiredErrorMessage }}\r\n    </p>\r\n    <p\r\n      *ngIf=\"formGroup.controls[config.controlName].errors?.['minlength']\"\r\n      class=\"ieeesa-form-error--text\"\r\n    >\r\n      {{ config.minErrorMessage }}\r\n    </p>\r\n    <p\r\n      *ngIf=\"formGroup.controls[config.controlName].errors?.['maxlength'] || formGroup.controls[config.controlName].errors?.['max']\"\r\n      class=\"ieeesa-form-error--text\"\r\n    >\r\n      {{ config.maxErrorMessage }}\r\n    </p>\r\n    <p\r\n      *ngIf=\"formGroup.controls[config.controlName].errors?.['pattern']\"\r\n      class=\"ieeesa-form-error--text\"\r\n    >\r\n      {{ config.patternErrorMessage }}\r\n    </p>\r\n    <p\r\n      *ngIf=\"\r\n          formGroup.controls[config.controlName].errors?.['email']\"\r\n      class=\"ieeesa-form-error--text\"\r\n    >\r\n      {{ config.invalidEmailErrorMessage }}\r\n    </p>\r\n  </div>\r\n  <div\r\n    class=\"ieeesa-form-error\"\r\n    *ngIf=\"\r\n      (formGroup.controls[config.controlName]?.touched ||\r\n        formGroup.controls[config.controlName]?.dirty) &&\r\n      submitResponse\r\n    \"\r\n  >\r\n    <p class=\"ieeesa-form-error--text mt-1\">\r\n      {{ submitResponse }}\r\n    </p>\r\n  </div>\r\n</ng-container>\r\n", styles: [".ieeesa-subtitle{text-align:left;font-family:Calibri Regular;font-size:1.56em;letter-spacing:0;color:#000;opacity:1}.ieeesa-body{text-align:left;font-family:Calibri Regular;font-size:1.25em;letter-spacing:0;color:#000;opacity:1}.ieeesa-display-lg-57{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:3.5625em;line-height:64px;color:#000;letter-spacing:0}.ieeesa-display-md-47{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:2.9375em;line-height:52px;color:#000;letter-spacing:0}.ieeesa-display-sm-38{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:2.375em;line-height:44px;color:#000;letter-spacing:0}.ieeesa-headline-lg-34{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:2.125em;line-height:40px;color:#000;letter-spacing:0}.ieeesa-headline-md-30{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1.875em;line-height:36px;color:#000;letter-spacing:0}.ieeesa-headline-sm-26{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1.625em;line-height:32px;color:#000;letter-spacing:0}.ieeesa-title-lg-bold-24{font-family:Calibri Regular;font-style:normal;font-weight:700;font-size:1.5em;line-height:28px;color:#000;letter-spacing:0}.ieeesa-title-lg-24{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1.5em;line-height:28px;color:#000;letter-spacing:0}.ieeesa-title-md-18{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1.125em;line-height:24px;color:#000;letter-spacing:.009375em}.ieeesa-title-sm-16{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1em;line-height:20px;color:#000;letter-spacing:.00625em}.ieeesa-label-lg-bold-16{font-family:Calibri Regular;font-style:normal;font-weight:700;font-size:1em;line-height:20px;color:#000;letter-spacing:.00625em}.ieeesa-label-lg-16{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1em;line-height:20px;color:#000;letter-spacing:.00625em}.ieeesa-label-md-14{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:.875em;line-height:16px;color:#000;letter-spacing:.03125em}.ieeesa-label-sm-13{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:.8125em;line-height:16px;color:#000;letter-spacing:.03125em}.ieeesa-body-lg-bold-18{font-family:Calibri Regular;font-style:normal;font-weight:700;font-size:1.125em;line-height:24px;color:#000;letter-spacing:.03125em}.ieeesa-body-lg-18{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1.125em;line-height:24px;color:#000;letter-spacing:.03125em}.ieeesa-body-md-16{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1em;line-height:20px;color:#000;letter-spacing:.015625em}.ieeesa-body-sm-14{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:.875em;line-height:16px;color:#000;letter-spacing:.025em}.ieeesa-title-inter-lg-bold-24{font-family:Inter Bold;font-style:normal;font-weight:700;font-size:1.5em;line-height:29px;color:#000;letter-spacing:0}.mat-mdc-button.mat-mdc-button-base.mat-primary-button,.mat-mdc-button.mat-mdc-button-base.mat-secondary-button{min-width:103px;width:auto;min-height:40px;height:auto;border-radius:3px;text-align:center;padding:.625em 1.5em;border:none;font-family:Calibri Regular;font-style:normal;font-weight:700;font-size:1em;line-height:20px;color:#000;letter-spacing:.00625em}.mat-mdc-button.mat-mdc-button-base>.mat-icon{margin-right:11px}.mat-mdc-button.mat-mdc-button-base.mat-primary-button{background-color:#00629b;color:#fff}.mat-mdc-button.mat-mdc-button-base.mat-primary-button:hover{background-color:#003e65}.mat-mdc-button.mat-mdc-button-base.mat-primary-button:active{background-color:#00629b}.mat-mdc-button.mat-mdc-button-base.mat-primary-button:disabled{background-color:#1c1b1f1f}.mat-mdc-button.mat-mdc-button-base.mat-secondary-button{color:#fff;background:#a7a8aa;box-shadow:0 1px 2px #0000004d,0 2px 6px 2px #00000026}.mat-mdc-button.mat-mdc-button-base.mat-secondary-button:hover{background:#a7a8aa}.mat-mdc-button.mat-mdc-button-base.mat-secondary-button:active{background:rgba(29,25,43,.12)}.mat-mdc-button.mat-mdc-button-base.mat-secondary-button:disabled{background:rgba(28,27,31,.12);color:#1c1b1f;opacity:.38}.ieeesa-text-button{color:#cac4d0;background:none;border:none}.flex-align-center{display:flex;align-items:center;justify-content:center}.mat-button-toggle-checked{background-color:#a7a8aa}.mat-button-toggle-checked .mat-button-toggle-label-content:before{font-family:\"Font Awesome 5 Free\";font-weight:900;content:\"\\f00c\";padding-right:.5625em}.mat-button-toggle-group .mat-button-toggle-label-content{font-family:Calibri Regular;font-style:normal;font-weight:700;font-size:1em;line-height:20px;color:#1c1b1f;letter-spacing:.00625em}@media (max-width: 768px){.mat-button-toggle-group .mat-button-toggle-label-content{max-width:8ch;text-overflow:ellipsis;white-space:nowrap;overflow:hidden;position:relative}}.cdk-overlay-pane{width:100%;min-width:312px}.ieeesa-form-error--text{color:#ba0c2f;padding-left:14px}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.3", ngImport: i0, type: FormErrorComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'ieeesa-form-error', standalone: true, imports: [CommonModule], template: "<ng-container *ngIf=\"formGroup\">\r\n  <div\r\n    class=\"ieeesa-body-sm-14 ieeesa-form-error\"\r\n    *ngIf=\"\r\n      formGroup.controls[config.controlName]?.touched ||\r\n      (formGroup.controls[config.controlName]?.dirty &&\r\n        formGroup.controls[config.controlName]?.invalid)\r\n    \"\r\n  >\r\n    <p\r\n      *ngIf=\"formGroup.controls[config.controlName].errors?.['required']\"\r\n      class=\"ieeesa-form-error--text\"\r\n    >\r\n      {{ config.requiredErrorMessage }}\r\n    </p>\r\n    <p\r\n      *ngIf=\"formGroup.controls[config.controlName].errors?.['minlength']\"\r\n      class=\"ieeesa-form-error--text\"\r\n    >\r\n      {{ config.minErrorMessage }}\r\n    </p>\r\n    <p\r\n      *ngIf=\"formGroup.controls[config.controlName].errors?.['maxlength'] || formGroup.controls[config.controlName].errors?.['max']\"\r\n      class=\"ieeesa-form-error--text\"\r\n    >\r\n      {{ config.maxErrorMessage }}\r\n    </p>\r\n    <p\r\n      *ngIf=\"formGroup.controls[config.controlName].errors?.['pattern']\"\r\n      class=\"ieeesa-form-error--text\"\r\n    >\r\n      {{ config.patternErrorMessage }}\r\n    </p>\r\n    <p\r\n      *ngIf=\"\r\n          formGroup.controls[config.controlName].errors?.['email']\"\r\n      class=\"ieeesa-form-error--text\"\r\n    >\r\n      {{ config.invalidEmailErrorMessage }}\r\n    </p>\r\n  </div>\r\n  <div\r\n    class=\"ieeesa-form-error\"\r\n    *ngIf=\"\r\n      (formGroup.controls[config.controlName]?.touched ||\r\n        formGroup.controls[config.controlName]?.dirty) &&\r\n      submitResponse\r\n    \"\r\n  >\r\n    <p class=\"ieeesa-form-error--text mt-1\">\r\n      {{ submitResponse }}\r\n    </p>\r\n  </div>\r\n</ng-container>\r\n", styles: [".ieeesa-subtitle{text-align:left;font-family:Calibri Regular;font-size:1.56em;letter-spacing:0;color:#000;opacity:1}.ieeesa-body{text-align:left;font-family:Calibri Regular;font-size:1.25em;letter-spacing:0;color:#000;opacity:1}.ieeesa-display-lg-57{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:3.5625em;line-height:64px;color:#000;letter-spacing:0}.ieeesa-display-md-47{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:2.9375em;line-height:52px;color:#000;letter-spacing:0}.ieeesa-display-sm-38{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:2.375em;line-height:44px;color:#000;letter-spacing:0}.ieeesa-headline-lg-34{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:2.125em;line-height:40px;color:#000;letter-spacing:0}.ieeesa-headline-md-30{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1.875em;line-height:36px;color:#000;letter-spacing:0}.ieeesa-headline-sm-26{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1.625em;line-height:32px;color:#000;letter-spacing:0}.ieeesa-title-lg-bold-24{font-family:Calibri Regular;font-style:normal;font-weight:700;font-size:1.5em;line-height:28px;color:#000;letter-spacing:0}.ieeesa-title-lg-24{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1.5em;line-height:28px;color:#000;letter-spacing:0}.ieeesa-title-md-18{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1.125em;line-height:24px;color:#000;letter-spacing:.009375em}.ieeesa-title-sm-16{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1em;line-height:20px;color:#000;letter-spacing:.00625em}.ieeesa-label-lg-bold-16{font-family:Calibri Regular;font-style:normal;font-weight:700;font-size:1em;line-height:20px;color:#000;letter-spacing:.00625em}.ieeesa-label-lg-16{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1em;line-height:20px;color:#000;letter-spacing:.00625em}.ieeesa-label-md-14{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:.875em;line-height:16px;color:#000;letter-spacing:.03125em}.ieeesa-label-sm-13{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:.8125em;line-height:16px;color:#000;letter-spacing:.03125em}.ieeesa-body-lg-bold-18{font-family:Calibri Regular;font-style:normal;font-weight:700;font-size:1.125em;line-height:24px;color:#000;letter-spacing:.03125em}.ieeesa-body-lg-18{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1.125em;line-height:24px;color:#000;letter-spacing:.03125em}.ieeesa-body-md-16{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1em;line-height:20px;color:#000;letter-spacing:.015625em}.ieeesa-body-sm-14{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:.875em;line-height:16px;color:#000;letter-spacing:.025em}.ieeesa-title-inter-lg-bold-24{font-family:Inter Bold;font-style:normal;font-weight:700;font-size:1.5em;line-height:29px;color:#000;letter-spacing:0}.mat-mdc-button.mat-mdc-button-base.mat-primary-button,.mat-mdc-button.mat-mdc-button-base.mat-secondary-button{min-width:103px;width:auto;min-height:40px;height:auto;border-radius:3px;text-align:center;padding:.625em 1.5em;border:none;font-family:Calibri Regular;font-style:normal;font-weight:700;font-size:1em;line-height:20px;color:#000;letter-spacing:.00625em}.mat-mdc-button.mat-mdc-button-base>.mat-icon{margin-right:11px}.mat-mdc-button.mat-mdc-button-base.mat-primary-button{background-color:#00629b;color:#fff}.mat-mdc-button.mat-mdc-button-base.mat-primary-button:hover{background-color:#003e65}.mat-mdc-button.mat-mdc-button-base.mat-primary-button:active{background-color:#00629b}.mat-mdc-button.mat-mdc-button-base.mat-primary-button:disabled{background-color:#1c1b1f1f}.mat-mdc-button.mat-mdc-button-base.mat-secondary-button{color:#fff;background:#a7a8aa;box-shadow:0 1px 2px #0000004d,0 2px 6px 2px #00000026}.mat-mdc-button.mat-mdc-button-base.mat-secondary-button:hover{background:#a7a8aa}.mat-mdc-button.mat-mdc-button-base.mat-secondary-button:active{background:rgba(29,25,43,.12)}.mat-mdc-button.mat-mdc-button-base.mat-secondary-button:disabled{background:rgba(28,27,31,.12);color:#1c1b1f;opacity:.38}.ieeesa-text-button{color:#cac4d0;background:none;border:none}.flex-align-center{display:flex;align-items:center;justify-content:center}.mat-button-toggle-checked{background-color:#a7a8aa}.mat-button-toggle-checked .mat-button-toggle-label-content:before{font-family:\"Font Awesome 5 Free\";font-weight:900;content:\"\\f00c\";padding-right:.5625em}.mat-button-toggle-group .mat-button-toggle-label-content{font-family:Calibri Regular;font-style:normal;font-weight:700;font-size:1em;line-height:20px;color:#1c1b1f;letter-spacing:.00625em}@media (max-width: 768px){.mat-button-toggle-group .mat-button-toggle-label-content{max-width:8ch;text-overflow:ellipsis;white-space:nowrap;overflow:hidden;position:relative}}.cdk-overlay-pane{width:100%;min-width:312px}.ieeesa-form-error--text{color:#ba0c2f;padding-left:14px}\n"] }]
+        }], propDecorators: { formGroup: [{
+                type: Input
+            }], config: [{
+                type: Input
+            }], submitResponse: [{
+                type: Input
+            }] } });
+
+var ariaLabel = {
+	clear: "Clear",
+	warning: "Warning",
+	previousMonth: "Previous month",
+	nextMonth: "Next month"
+};
+var button = {
+	cancel: "Cancel",
+	ok: "Ok"
+};
+var datePicker = {
+	selectDateLabel: "Select Date",
+	dateFormatLabel: "DD-MMM-YYYY",
+	startDateLabel: "Start Date",
+	endDateLabel: "End Date"
+};
+var dropdown = {
+	placeholderText: "Select your option(s)"
+};
+var textarea = {
+	maxLengthDefault: 1000
+};
+var autocomplete = {
+	minCharToSearch: 3,
+	debounceTime: 1000
+};
+var header = {
+	alt: {
+		logo: "Logo"
+	},
+	ariaLabel: {
+		helpLink: "Help Link",
+		userProfile: "User profile",
+		hamburgerMenu: "Hamburger Menu"
+	},
+	label: {
+		signOut: "Sign Out"
+	}
+};
+var footer = {
+	alt: {
+		logo: "IEEE Logo"
+	},
+	links: [
+		{
+			label: "Dashboard",
+			ariaLabel: "Dashboard",
+			redirectUrl: "#"
+		},
+		{
+			label: "Contact & Support",
+			ariaLabel: "Contact & Support",
+			redirectUrl: "https://www.ieee.org/about/contact.html"
+		},
+		{
+			label: "Accessibility",
+			ariaLabel: "Accessibility",
+			redirectUrl: "https://www.ieee.org/accessibility_statement.html"
+		},
+		{
+			label: "Nondiscrimination Policy",
+			ariaLabel: "Nondiscrimination Policy",
+			redirectUrl: "https://www.ieee.org/about/corporate/governance/p9-26.html"
+		},
+		{
+			label: "IEEE Ethics Reporting",
+			ariaLabel: "",
+			redirectUrl: "https://secure.ethicspoint.com/domain/media/en/gui/20410/index.html"
+		},
+		{
+			label: "IEEE Privacy Policy",
+			ariaLabel: "IEEE Privacy Policy",
+			redirectUrl: "https://www.ieee.org/security-privacy.html"
+		},
+		{
+			label: "IEEE SA Copyright Policy",
+			ariaLabel: "IEEE SA Copyright Policy",
+			redirectUrl: "https://standards.ieee.org/ipr/"
+		}
+	],
+	ieeeLogo: "assets/images/ieee-logo.svg",
+	copyright: {
+		link: "https://www.ieee.org/about/help/site-terms-conditions.html",
+		textPart1: "© Copyright",
+		textPart2: "IEEE – All rights reserved. Use of this website signifies your agreement to the",
+		hyperLinkPart3: " IEEE Terms and Conditions.",
+		textPart4: "A not-for-profit organization, IEEE is the world's largest technical professional organization dedicated to advancing technology for the benefit of humanity."
+	}
+};
+var constants = {
+	ariaLabel: ariaLabel,
+	button: button,
+	datePicker: datePicker,
+	dropdown: dropdown,
+	textarea: textarea,
+	autocomplete: autocomplete,
+	header: header,
+	footer: footer
+};
+
+var constantsInfo = /*#__PURE__*/Object.freeze({
+    __proto__: null,
+    ariaLabel: ariaLabel,
+    autocomplete: autocomplete,
+    button: button,
+    datePicker: datePicker,
+    default: constants,
+    dropdown: dropdown,
+    footer: footer,
+    header: header,
+    textarea: textarea
+});
+
+/**
+ * Provides implementation of input type number and text
+ * @export
+ * @class InputComponent
+ * @implements {FormField}
+ */
+class InputComponent {
+    constructor() {
+        this.invalidChars = ['-', '+', 'e'];
+        // eslint-disable-next-line @typescript-eslint/no-explicit-any
+        this.buttonActionsInfo = constantsInfo;
+    }
     /**
-     * FormGroups passed an an input and which contains configuration information of every form fields.
-     * @memberof DynamicFormComponent
+     * Handles keyboard event of type keydown to restrict invalid characters.
+     * @param {KeyboardEvent} event
+     * @memberof InputComponent
      */
-    set formGroups(value) {
-        this._formGroups = value;
-        this.createFormGroupArray();
+    onKeyDown(event) {
+        if ((this.invalidChars.includes(event.key.toLowerCase()) ||
+            (this.config.isInteger && event.key.toLowerCase() === '.')) &&
+            this.config.isNumber) {
+            event.preventDefault();
+        }
     }
-    get formGroups() {
-        return this._formGroups;
+    /**
+     * Clears the form group control value of type input
+     * @memberof InputComponent
+     */
+    clear() {
+        this.group.get(this.config.controlName)?.setValue('');
     }
     /**
-     * Sets submit response on form submit
-     * @memberof DynamicFormComponent
+     * Handles form control input on change event to set min and max value errors
+     * @memberof InputComponent
      */
-    set submitResponse(value) {
-        this._submitResponse = value;
+    onChange() {
+        if (this.config.max &&
+            this.config.isNumber &&
+            Number(this.group.get(this.config.controlName)?.value) > this.config.max) {
+            this.group.get(this.config.controlName)?.setErrors({
+                maxlength: true,
+            });
+        }
+        if (this.config.min &&
+            this.config.isNumber &&
+            this.group.get(this.config.controlName)?.value !== '' &&
+            Number(this.group.get(this.config.controlName)?.value) < this.config.min) {
+            this.group.get(this.config.controlName)?.setErrors({
+                minlength: true,
+            });
+        }
     }
-    // eslint-disable-next-line @typescript-eslint/no-explicit-any
-    get submitResponse() {
-        return this._submitResponse;
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.3", ngImport: i0, type: InputComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.3", type: InputComponent, isStandalone: true, selector: "ieeesa-input", ngImport: i0, template: "<div\r\n  [formGroup]=\"group\"\r\n  class=\"ieeesa-input-field\"\r\n  [ngClass]=\"\r\n    config.isLabelAlignedLeft\r\n      ? 'ieeesa-input-field__label-left'\r\n      : 'ieeesa-input-field__label-top'\r\n  \"\r\n>\r\n  <mat-label class=\"ieeesa-body-sm-14 ieeesa-input-field__label\">{{\r\n    config.label\r\n  }}</mat-label>\r\n  <mat-form-field>\r\n    <input\r\n      class=\"ieeesa-input-field__content ieeesa-body-sm-14\"\r\n      [type]=\"config.isNumber ? 'number' : 'text'\"\r\n      [min]=\"config.min\"\r\n      [max]=\"config.max\"\r\n      [maxlength]=\"config.maxLength ?? ''\"\r\n      [minlength]=\"config.minLength ?? ''\"\r\n      [placeholder]=\"config.placeholder ?? ''\"\r\n      [placeholder]=\"config.placeholder ?? ''\"\r\n      [formControlName]=\"config.controlName\"\r\n      [name]=\"config.controlName\"\r\n      (keydown)=\"onKeyDown($event)\"\r\n      (input)=\"onChange()\"\r\n      autocomplete=\"off\"\r\n      matInput\r\n    />\r\n    <button\r\n      *ngIf=\"\r\n        group.get(this.config.controlName)?.value &&\r\n        group.get(this.config.controlName)?.valid\r\n      \"\r\n      matSuffix\r\n      mat-icon-button\r\n      [attr.aria-label]=\"buttonActionsInfo.ariaLabel.clear\"\r\n      class=\"ieeesa-input-field__btn--clear\"\r\n      (click)=\"clear()\"\r\n    >\r\n      <i class=\"fa-regular fa-circle-xmark ieeesa-input-field__icon--clear\"></i>\r\n    </button>\r\n    <button\r\n      *ngIf=\"\r\n        group.get(this.config.controlName)?.invalid &&\r\n        group.get(this.config.controlName)?.dirty\r\n      \"\r\n      class=\"ieeesa-input-field__btn--warning\"\r\n      matSuffix\r\n      mat-icon-button\r\n      [attr.aria-label]=\"buttonActionsInfo.ariaLabel.warning\"\r\n    >\r\n      <i\r\n        class=\"fa-solid fa-circle-exclamation ieeesa-input-field__icon--warning\"\r\n      ></i>\r\n    </button>\r\n  </mat-form-field>\r\n  <ieeesa-form-error [formGroup]=\"group\" [config]=\"config\"> </ieeesa-form-error>\r\n</div>\r\n", styles: [".ieeesa-subtitle{text-align:left;font-family:Calibri Regular;font-size:1.56em;letter-spacing:0;color:#000;opacity:1}.ieeesa-body{text-align:left;font-family:Calibri Regular;font-size:1.25em;letter-spacing:0;color:#000;opacity:1}.ieeesa-display-lg-57{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:3.5625em;line-height:64px;color:#000;letter-spacing:0}.ieeesa-display-md-47{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:2.9375em;line-height:52px;color:#000;letter-spacing:0}.ieeesa-display-sm-38{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:2.375em;line-height:44px;color:#000;letter-spacing:0}.ieeesa-headline-lg-34{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:2.125em;line-height:40px;color:#000;letter-spacing:0}.ieeesa-headline-md-30{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1.875em;line-height:36px;color:#000;letter-spacing:0}.ieeesa-headline-sm-26{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1.625em;line-height:32px;color:#000;letter-spacing:0}.ieeesa-title-lg-bold-24{font-family:Calibri Regular;font-style:normal;font-weight:700;font-size:1.5em;line-height:28px;color:#000;letter-spacing:0}.ieeesa-title-lg-24{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1.5em;line-height:28px;color:#000;letter-spacing:0}.ieeesa-title-md-18{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1.125em;line-height:24px;color:#000;letter-spacing:.009375em}.ieeesa-title-sm-16{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1em;line-height:20px;color:#000;letter-spacing:.00625em}.ieeesa-label-lg-bold-16{font-family:Calibri Regular;font-style:normal;font-weight:700;font-size:1em;line-height:20px;color:#000;letter-spacing:.00625em}.ieeesa-label-lg-16{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1em;line-height:20px;color:#000;letter-spacing:.00625em}.ieeesa-label-md-14{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:.875em;line-height:16px;color:#000;letter-spacing:.03125em}.ieeesa-label-sm-13{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:.8125em;line-height:16px;color:#000;letter-spacing:.03125em}.ieeesa-body-lg-bold-18{font-family:Calibri Regular;font-style:normal;font-weight:700;font-size:1.125em;line-height:24px;color:#000;letter-spacing:.03125em}.ieeesa-body-lg-18{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1.125em;line-height:24px;color:#000;letter-spacing:.03125em}.ieeesa-body-md-16{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1em;line-height:20px;color:#000;letter-spacing:.015625em}.ieeesa-body-sm-14{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:.875em;line-height:16px;color:#000;letter-spacing:.025em}.ieeesa-title-inter-lg-bold-24{font-family:Inter Bold;font-style:normal;font-weight:700;font-size:1.5em;line-height:29px;color:#000;letter-spacing:0}.mat-mdc-button.mat-mdc-button-base.mat-primary-button,.mat-mdc-button.mat-mdc-button-base.mat-secondary-button{min-width:103px;width:auto;min-height:40px;height:auto;border-radius:3px;text-align:center;padding:.625em 1.5em;border:none;font-family:Calibri Regular;font-style:normal;font-weight:700;font-size:1em;line-height:20px;color:#000;letter-spacing:.00625em}.mat-mdc-button.mat-mdc-button-base>.mat-icon{margin-right:11px}.mat-mdc-button.mat-mdc-button-base.mat-primary-button{background-color:#00629b;color:#fff}.mat-mdc-button.mat-mdc-button-base.mat-primary-button:hover{background-color:#003e65}.mat-mdc-button.mat-mdc-button-base.mat-primary-button:active{background-color:#00629b}.mat-mdc-button.mat-mdc-button-base.mat-primary-button:disabled{background-color:#1c1b1f1f}.mat-mdc-button.mat-mdc-button-base.mat-secondary-button{color:#fff;background:#a7a8aa;box-shadow:0 1px 2px #0000004d,0 2px 6px 2px #00000026}.mat-mdc-button.mat-mdc-button-base.mat-secondary-button:hover{background:#a7a8aa}.mat-mdc-button.mat-mdc-button-base.mat-secondary-button:active{background:rgba(29,25,43,.12)}.mat-mdc-button.mat-mdc-button-base.mat-secondary-button:disabled{background:rgba(28,27,31,.12);color:#1c1b1f;opacity:.38}.ieeesa-text-button{color:#cac4d0;background:none;border:none}.flex-align-center{display:flex;align-items:center;justify-content:center}.mat-button-toggle-checked{background-color:#a7a8aa}.mat-button-toggle-checked .mat-button-toggle-label-content:before{font-family:\"Font Awesome 5 Free\";font-weight:900;content:\"\\f00c\";padding-right:.5625em}.mat-button-toggle-group .mat-button-toggle-label-content{font-family:Calibri Regular;font-style:normal;font-weight:700;font-size:1em;line-height:20px;color:#1c1b1f;letter-spacing:.00625em}@media (max-width: 768px){.mat-button-toggle-group .mat-button-toggle-label-content{max-width:8ch;text-overflow:ellipsis;white-space:nowrap;overflow:hidden;position:relative}}.cdk-overlay-pane{width:100%;min-width:312px}.ieeesa-input-field__warning-btn{display:none}.ieeesa-input-field__icon--clear,.ieeesa-input-field__icon--warning{height:20px;width:20px}.ieeesa-input-field__icon--warning{color:#ba0c2f}.ieeesa-input-field__btn--clear,.ieeesa-input-field__btn--warning{border:none;background-color:inherit}.ieeesa-input-field__content{font-family:Calibri Regular;font-size:1.125em}.ieeesa-input-field__label-left{display:flex}.ieeesa-input-field__label-top{display:block}.ieeesa-input-field .mat-mdc-form-field{min-height:52px;width:-webkit-fill-available}.ieeesa-input-field .mat-mdc-form-field-subscript-wrapper{display:none}.ieeesa-input-field .mat-mdc-text-field-wrapper{height:40px;min-width:210px;width:auto;background-color:#fffbfe;border-radius:4px 4px 0 0}.ieeesa-input-field .mat-mdc-form-field-focus-overlay{background-color:#fffbfe}.ieeesa-input-field .mdc-text-field--filled .mdc-line-ripple:after{border-bottom:2px solid #00b5e2;opacity:.5}.ieeesa-input-field .mdc-text-field--no-label:not(.mdc-text-field--outlined):not(.mdc-text-field--textarea) .mat-mdc-form-field-infix{padding-top:9px}.ieeesa-input-field .mat-mdc-form-field-icon-suffix,.ieeesa-input-field [dir=rtl] .mat-mdc-form-field-icon-prefix{padding:0 8px 16px 4px}.ieeesa-input-field:has(.mdc-line-ripple--active) .ieeesa-input-field__label{color:#00b5e2}.ieeesa-input-field:has(.mdc-line-ripple--active) .mat-mdc-form-field-focus-overlay{background-color:#1c1b1f;opacity:.2}.ieeesa-input-field:has(.mdc-text-field--invalid) .mdc-text-field--filled .mdc-line-ripple:after{border-bottom:2px solid #ba0c2f;opacity:.5}.ieeesa-input-field:has(.mdc-text-field--invalid) .ieeesa-input-field__btn--warning{display:block}.ieeesa-input-field:has(.mdc-text-field--invalid) .ieeesa-input-field__label{color:#ba0c2f}input::-webkit-outer-spin-button,input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i3.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i3.MinLengthValidator, selector: "[minlength][formControlName],[minlength][formControl],[minlength][ngModel]", inputs: ["minlength"] }, { kind: "directive", type: i3.MaxLengthValidator, selector: "[maxlength][formControlName],[maxlength][formControl],[maxlength][ngModel]", inputs: ["maxlength"] }, { kind: "directive", type: i3.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i3.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "component", type: FormErrorComponent, selector: "ieeesa-form-error", inputs: ["formGroup", "config", "submitResponse"] }, { kind: "ngmodule", type: MatInputModule }, { kind: "directive", type: i5.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl],      input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly"], exportAs: ["matInput"] }, { kind: "component", type: i4.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i4.MatLabel, selector: "mat-label" }, { kind: "directive", type: i4.MatSuffix, selector: "[matSuffix], [matIconSuffix], [matTextSuffix]", inputs: ["matTextSuffix"] }, { kind: "ngmodule", type: MatIconModule }], encapsulation: i0.ViewEncapsulation.None }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.3", ngImport: i0, type: InputComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'ieeesa-input', standalone: true, imports: [
+                        CommonModule,
+                        ReactiveFormsModule,
+                        FormErrorComponent,
+                        MatInputModule,
+                        MatIconModule,
+                    ], encapsulation: ViewEncapsulation.None, template: "<div\r\n  [formGroup]=\"group\"\r\n  class=\"ieeesa-input-field\"\r\n  [ngClass]=\"\r\n    config.isLabelAlignedLeft\r\n      ? 'ieeesa-input-field__label-left'\r\n      : 'ieeesa-input-field__label-top'\r\n  \"\r\n>\r\n  <mat-label class=\"ieeesa-body-sm-14 ieeesa-input-field__label\">{{\r\n    config.label\r\n  }}</mat-label>\r\n  <mat-form-field>\r\n    <input\r\n      class=\"ieeesa-input-field__content ieeesa-body-sm-14\"\r\n      [type]=\"config.isNumber ? 'number' : 'text'\"\r\n      [min]=\"config.min\"\r\n      [max]=\"config.max\"\r\n      [maxlength]=\"config.maxLength ?? ''\"\r\n      [minlength]=\"config.minLength ?? ''\"\r\n      [placeholder]=\"config.placeholder ?? ''\"\r\n      [placeholder]=\"config.placeholder ?? ''\"\r\n      [formControlName]=\"config.controlName\"\r\n      [name]=\"config.controlName\"\r\n      (keydown)=\"onKeyDown($event)\"\r\n      (input)=\"onChange()\"\r\n      autocomplete=\"off\"\r\n      matInput\r\n    />\r\n    <button\r\n      *ngIf=\"\r\n        group.get(this.config.controlName)?.value &&\r\n        group.get(this.config.controlName)?.valid\r\n      \"\r\n      matSuffix\r\n      mat-icon-button\r\n      [attr.aria-label]=\"buttonActionsInfo.ariaLabel.clear\"\r\n      class=\"ieeesa-input-field__btn--clear\"\r\n      (click)=\"clear()\"\r\n    >\r\n      <i class=\"fa-regular fa-circle-xmark ieeesa-input-field__icon--clear\"></i>\r\n    </button>\r\n    <button\r\n      *ngIf=\"\r\n        group.get(this.config.controlName)?.invalid &&\r\n        group.get(this.config.controlName)?.dirty\r\n      \"\r\n      class=\"ieeesa-input-field__btn--warning\"\r\n      matSuffix\r\n      mat-icon-button\r\n      [attr.aria-label]=\"buttonActionsInfo.ariaLabel.warning\"\r\n    >\r\n      <i\r\n        class=\"fa-solid fa-circle-exclamation ieeesa-input-field__icon--warning\"\r\n      ></i>\r\n    </button>\r\n  </mat-form-field>\r\n  <ieeesa-form-error [formGroup]=\"group\" [config]=\"config\"> </ieeesa-form-error>\r\n</div>\r\n", styles: [".ieeesa-subtitle{text-align:left;font-family:Calibri Regular;font-size:1.56em;letter-spacing:0;color:#000;opacity:1}.ieeesa-body{text-align:left;font-family:Calibri Regular;font-size:1.25em;letter-spacing:0;color:#000;opacity:1}.ieeesa-display-lg-57{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:3.5625em;line-height:64px;color:#000;letter-spacing:0}.ieeesa-display-md-47{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:2.9375em;line-height:52px;color:#000;letter-spacing:0}.ieeesa-display-sm-38{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:2.375em;line-height:44px;color:#000;letter-spacing:0}.ieeesa-headline-lg-34{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:2.125em;line-height:40px;color:#000;letter-spacing:0}.ieeesa-headline-md-30{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1.875em;line-height:36px;color:#000;letter-spacing:0}.ieeesa-headline-sm-26{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1.625em;line-height:32px;color:#000;letter-spacing:0}.ieeesa-title-lg-bold-24{font-family:Calibri Regular;font-style:normal;font-weight:700;font-size:1.5em;line-height:28px;color:#000;letter-spacing:0}.ieeesa-title-lg-24{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1.5em;line-height:28px;color:#000;letter-spacing:0}.ieeesa-title-md-18{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1.125em;line-height:24px;color:#000;letter-spacing:.009375em}.ieeesa-title-sm-16{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1em;line-height:20px;color:#000;letter-spacing:.00625em}.ieeesa-label-lg-bold-16{font-family:Calibri Regular;font-style:normal;font-weight:700;font-size:1em;line-height:20px;color:#000;letter-spacing:.00625em}.ieeesa-label-lg-16{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1em;line-height:20px;color:#000;letter-spacing:.00625em}.ieeesa-label-md-14{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:.875em;line-height:16px;color:#000;letter-spacing:.03125em}.ieeesa-label-sm-13{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:.8125em;line-height:16px;color:#000;letter-spacing:.03125em}.ieeesa-body-lg-bold-18{font-family:Calibri Regular;font-style:normal;font-weight:700;font-size:1.125em;line-height:24px;color:#000;letter-spacing:.03125em}.ieeesa-body-lg-18{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1.125em;line-height:24px;color:#000;letter-spacing:.03125em}.ieeesa-body-md-16{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1em;line-height:20px;color:#000;letter-spacing:.015625em}.ieeesa-body-sm-14{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:.875em;line-height:16px;color:#000;letter-spacing:.025em}.ieeesa-title-inter-lg-bold-24{font-family:Inter Bold;font-style:normal;font-weight:700;font-size:1.5em;line-height:29px;color:#000;letter-spacing:0}.mat-mdc-button.mat-mdc-button-base.mat-primary-button,.mat-mdc-button.mat-mdc-button-base.mat-secondary-button{min-width:103px;width:auto;min-height:40px;height:auto;border-radius:3px;text-align:center;padding:.625em 1.5em;border:none;font-family:Calibri Regular;font-style:normal;font-weight:700;font-size:1em;line-height:20px;color:#000;letter-spacing:.00625em}.mat-mdc-button.mat-mdc-button-base>.mat-icon{margin-right:11px}.mat-mdc-button.mat-mdc-button-base.mat-primary-button{background-color:#00629b;color:#fff}.mat-mdc-button.mat-mdc-button-base.mat-primary-button:hover{background-color:#003e65}.mat-mdc-button.mat-mdc-button-base.mat-primary-button:active{background-color:#00629b}.mat-mdc-button.mat-mdc-button-base.mat-primary-button:disabled{background-color:#1c1b1f1f}.mat-mdc-button.mat-mdc-button-base.mat-secondary-button{color:#fff;background:#a7a8aa;box-shadow:0 1px 2px #0000004d,0 2px 6px 2px #00000026}.mat-mdc-button.mat-mdc-button-base.mat-secondary-button:hover{background:#a7a8aa}.mat-mdc-button.mat-mdc-button-base.mat-secondary-button:active{background:rgba(29,25,43,.12)}.mat-mdc-button.mat-mdc-button-base.mat-secondary-button:disabled{background:rgba(28,27,31,.12);color:#1c1b1f;opacity:.38}.ieeesa-text-button{color:#cac4d0;background:none;border:none}.flex-align-center{display:flex;align-items:center;justify-content:center}.mat-button-toggle-checked{background-color:#a7a8aa}.mat-button-toggle-checked .mat-button-toggle-label-content:before{font-family:\"Font Awesome 5 Free\";font-weight:900;content:\"\\f00c\";padding-right:.5625em}.mat-button-toggle-group .mat-button-toggle-label-content{font-family:Calibri Regular;font-style:normal;font-weight:700;font-size:1em;line-height:20px;color:#1c1b1f;letter-spacing:.00625em}@media (max-width: 768px){.mat-button-toggle-group .mat-button-toggle-label-content{max-width:8ch;text-overflow:ellipsis;white-space:nowrap;overflow:hidden;position:relative}}.cdk-overlay-pane{width:100%;min-width:312px}.ieeesa-input-field__warning-btn{display:none}.ieeesa-input-field__icon--clear,.ieeesa-input-field__icon--warning{height:20px;width:20px}.ieeesa-input-field__icon--warning{color:#ba0c2f}.ieeesa-input-field__btn--clear,.ieeesa-input-field__btn--warning{border:none;background-color:inherit}.ieeesa-input-field__content{font-family:Calibri Regular;font-size:1.125em}.ieeesa-input-field__label-left{display:flex}.ieeesa-input-field__label-top{display:block}.ieeesa-input-field .mat-mdc-form-field{min-height:52px;width:-webkit-fill-available}.ieeesa-input-field .mat-mdc-form-field-subscript-wrapper{display:none}.ieeesa-input-field .mat-mdc-text-field-wrapper{height:40px;min-width:210px;width:auto;background-color:#fffbfe;border-radius:4px 4px 0 0}.ieeesa-input-field .mat-mdc-form-field-focus-overlay{background-color:#fffbfe}.ieeesa-input-field .mdc-text-field--filled .mdc-line-ripple:after{border-bottom:2px solid #00b5e2;opacity:.5}.ieeesa-input-field .mdc-text-field--no-label:not(.mdc-text-field--outlined):not(.mdc-text-field--textarea) .mat-mdc-form-field-infix{padding-top:9px}.ieeesa-input-field .mat-mdc-form-field-icon-suffix,.ieeesa-input-field [dir=rtl] .mat-mdc-form-field-icon-prefix{padding:0 8px 16px 4px}.ieeesa-input-field:has(.mdc-line-ripple--active) .ieeesa-input-field__label{color:#00b5e2}.ieeesa-input-field:has(.mdc-line-ripple--active) .mat-mdc-form-field-focus-overlay{background-color:#1c1b1f;opacity:.2}.ieeesa-input-field:has(.mdc-text-field--invalid) .mdc-text-field--filled .mdc-line-ripple:after{border-bottom:2px solid #ba0c2f;opacity:.5}.ieeesa-input-field:has(.mdc-text-field--invalid) .ieeesa-input-field__btn--warning{display:block}.ieeesa-input-field:has(.mdc-text-field--invalid) .ieeesa-input-field__label{color:#ba0c2f}input::-webkit-outer-spin-button,input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}\n"] }]
+        }] });
+
+var FormControlType;
+(function (FormControlType) {
+    // eslint-disable-next-line no-unused-vars
+    FormControlType["INPUT"] = "INPUT";
+    // eslint-disable-next-line no-unused-vars
+    FormControlType["TEXT_AREA"] = "TEXT_AREA";
+    // eslint-disable-next-line no-unused-vars
+    FormControlType["SELECT"] = "SELECT";
+    // eslint-disable-next-line no-unused-vars
+    FormControlType["SEARCH"] = "SEARCH";
+    // eslint-disable-next-line no-unused-vars
+    FormControlType["DATE"] = "DATE";
+    // eslint-disable-next-line no-unused-vars
+    FormControlType["CHECKBOX"] = "CHECKBOX";
+    // eslint-disable-next-line no-unused-vars
+    FormControlType["RADIO"] = "RADIO";
+    // eslint-disable-next-line no-unused-vars
+    FormControlType["AUTO_COMPLETE"] = "AUTO_COMPLETE";
+})(FormControlType || (FormControlType = {}));
+
+/**
+ * Creates form fields configuration and form group based on passed parameters.
+ * @export
+ * @class FormUtilityService
+ */
+class FormUtilityService {
+    // eslint-disable-next-line no-unused-vars, no-empty-function
+    constructor(fb) {
+        this.fb = fb;
     }
     /**
-     * Sets search response on form search event
-     * @memberof DynamicFormComponent
+     * Returns form fields configuration based on passed control name and type.
+     * @param {string} controlName
+     * @param {string} controlType
+     * @return {FieldConfig}
+     * @memberof FormUtilityService
      */
-    set searchResponse(value) {
-        this._searchResponse = value;
+    getFormFieldConfig(controlName, controlType) {
+        return {
+            controlName: controlName,
+            type: controlType,
+        };
     }
-    // eslint-disable-next-line @typescript-eslint/no-explicit-any
-    get searchResponse() {
-        return this._searchResponse;
+    /**
+     * Creates and returns form group with passed control name added.
+     * @param {string} controlName
+     * @return {FormGroup}
+     * @memberof FormUtilityService
+     */
+    getFormGroup(controlName) {
+        return this.fb.group({
+            [controlName]: [],
+        });
     }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.3", ngImport: i0, type: FormUtilityService, deps: [{ token: i3.FormBuilder }], target: i0.ɵɵFactoryTarget.Injectable }); }
+    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "16.1.3", ngImport: i0, type: FormUtilityService, providedIn: 'root' }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.3", ngImport: i0, type: FormUtilityService, decorators: [{
+            type: Injectable,
+            args: [{
+                    providedIn: 'root',
+                }]
+        }], ctorParameters: function () { return [{ type: i3.FormBuilder }]; } });
+
+/**
+ * Provides auto suggestion for the entered input by filtering the options from the given list of options.
+ * @export
+ * @class AutocompleteComponent
+ * @implements {OnInit}
+ * @implements {FormField}
+ * @implements {OnDestroy}
+ */
+class AutocompleteComponent {
     // eslint-disable-next-line no-unused-vars, no-empty-function
-    constructor(fb) {
-        this.fb = fb;
-        this.isSubmitButtonDisabled = false;
-        this.isLeftButtonDisabled = false;
-        this.isLeftButtonNeeded = false;
-        // eslint-disable-next-line @typescript-eslint/no-explicit-any
-        this.formSubmit = new EventEmitter();
-        // eslint-disable-next-line @typescript-eslint/no-explicit-any
-        this.formChange = new EventEmitter();
-        // eslint-disable-next-line @typescript-eslint/no-explicit-any
-        this.formInput = new EventEmitter();
-        // eslint-disable-next-line @typescript-eslint/no-explicit-any
-        this.formLeftButtonClicked = new EventEmitter();
-        // eslint-disable-next-line @typescript-eslint/no-explicit-any
-        this.formSearchApply = new EventEmitter();
-        this.formGroupsReference = new EventEmitter();
-        // eslint-disable-next-line @typescript-eslint/no-explicit-any
-        this.dropdownChange = new EventEmitter();
-        this.formDateSelected = new EventEmitter();
-        this.formSelectSearch = new EventEmitter();
-        this.formControlChange = new EventEmitter();
-        this.formAutoCompleteSearch = new EventEmitter();
+    constructor(formUtilityService) {
+        this.formUtilityService = formUtilityService;
+        this.value = '';
+        this.filteredOptions = [];
+        this.isSelectedOptionsVisible = true;
+        this.autoCompleteSearchValue = new EventEmitter();
         this.autoCompleteOptionSelected = new EventEmitter();
-        this.formAfterContentInit = new EventEmitter();
-        this.formSelectedDateRange = new EventEmitter();
-        this.formGroupArray = [];
+        this.destroy$ = new Subject();
         // eslint-disable-next-line @typescript-eslint/no-explicit-any
-        this.formControlArray = [];
-        this.legendsArray = [];
+        this.autocompleteConstInfo = constantsInfo;
+        this.optionsToFilter = [];
     }
     /**
-     * Implementation of ngOnInit lifecycle hook method to create form group
-     * @memberof DynamicFormComponent
+     * Implementation of ngOnInit lifecycle hook method to initialize components instance properties.
+     * @memberof AutocompleteComponent
      */
     ngOnInit() {
-        this.createFormGroupArray();
-    }
-    /**
-     * Emit generated form reference on ngAfterContentInit lifecycle hook.
-     * @memberof DynamicFormComponent
-     */
-    ngAfterContentInit() {
-        this.formAfterContentInit.emit(this.formGroupArray);
+        this.config =
+            this.config ??
+                this.formUtilityService.getFormFieldConfig('autocomplete', FormControlType.AUTO_COMPLETE);
+        this.group =
+            this.group ?? this.formUtilityService.getFormGroup('autocomplete');
+        this.filteredOptions =
+            this.config?.autoCompleteOptions ?? this.filteredOptions;
+        this.optionsToFilter = this.filteredOptions;
     }
     /**
-     * Creates form group on the basis of formGroups configuration input
-     * @return {void}
-     * @memberof DynamicFormComponent
+     * Filters the options on form control value changes.
+     * @memberof AutocompleteComponent
      */
-    createFormGroupArray() {
-        this.formGroupArray = [];
-        this.formControlArray = [];
-        this.legendsArray = [];
-        if (!this.formGroups) {
-            return;
-        }
-        this.formGroups?.formGroup?.forEach((element) => {
-            const controls = element.controls.filter((control) => control.type !== 'button');
-            this.formGroupArray.push(this.createGroup(controls));
-            this.formControlArray.push(controls);
-            this.legendsArray.push(element.legend);
-        });
-        this.form = this.fb.group({
-            children: this.formGroupArray,
+    filterOptions() {
+        this.group?.controls[this.config?.controlName]?.valueChanges
+            .pipe(
+        // eslint-disable-next-line @typescript-eslint/no-explicit-any
+        filter(
+        // eslint-disable-next-line @typescript-eslint/no-explicit-any
+        (res) => res.length >=
+            this.autocompleteConstInfo.autocomplete.minCharToSearch ||
+            res.length === 0), debounceTime(this.autocompleteConstInfo.autocomplete.debounceTime), distinctUntilChanged())
+            .pipe(takeUntil(this.destroy$))
+            .subscribe((text) => {
+            const options = this.optionsToFilter?.filter((item) => item.name.toLowerCase().includes(text.toLowerCase()));
+            this.filteredOptions = options ?? this.optionsToFilter;
+            this.autoCompleteSearchValue.emit(text);
         });
-        this.formGroupsReference.emit(this.formGroupArray);
     }
     /**
-     * Creates form group using form builder
-     * @param {any[]} controls
-     * @return {FormGroup}
-     * @memberof DynamicFormComponent
+     * Emits the selected option name when the form on change event is triggered and returns option name.
+     * @param {AutoCompleteOption} data // data is an selected option of filteredOptions.
+     * @return {string} // Returns selected option name as string
+     * @memberof AutocompleteComponent
      */
-    // eslint-disable-next-line @typescript-eslint/no-explicit-any
-    createGroup(controls) {
-        const group = this.fb.group({});
-        controls.forEach((control) => group.addControl(control.controlName, this.createControl(control)));
-        return group;
+    onChange(data) {
+        this.autoCompleteOptionSelected.emit(data.name);
+        return data.name;
     }
     /**
-     * Creates form control based on form field configuration
-     * @param {FieldConfig} control
-     * @return {FormControl}
-     * @memberof DynamicFormComponent
+     * Takes the index and the current item as arguments and needs to return the unique identifier for this item.
+     * @param {number} index
+     * @param {SelectOption} option
+     * @return {(number | string)}
+     * @memberof AutocompleteComponent
      */
-    createControl(control) {
-        const { disabled, validation, value } = control;
-        return this.fb.control({ disabled, value }, validation);
+    trackByFn(index, option) {
+        return option.id;
     }
     /**
-     * Emits formGroupArray
-     * @memberof DynamicFormComponent
+     * Implementation of ngOnDestroy lifecycle hook method to unsubscribe the open observable subscriptions.
+     * @memberof AutocompleteComponent
      */
-    onFormSubmit() {
-        this.formSubmit.emit(this.formGroupArray);
+    ngOnDestroy() {
+        this.destroy$.next(true);
+        this.destroy$.unsubscribe();
     }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.3", ngImport: i0, type: AutocompleteComponent, deps: [{ token: FormUtilityService }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.3", type: AutocompleteComponent, isStandalone: true, selector: "ieeesa-autocomplete", inputs: { filteredOptions: "filteredOptions", isSelectedOptionsVisible: "isSelectedOptionsVisible" }, outputs: { autoCompleteSearchValue: "autoCompleteSearchValue", autoCompleteOptionSelected: "autoCompleteOptionSelected" }, providers: [
+            {
+                provide: MAT_AUTOCOMPLETE_DEFAULT_OPTIONS,
+                useValue: { overlayPanelClass: 'ieeesa-autocomplete-overlay-pane' },
+            },
+        ], viewQueries: [{ propertyName: "autoComplete", first: true, predicate: ["autoComplete"], descendants: true }], ngImport: i0, template: "<div\r\n  class=\"ieeesa-autocomplete\"\r\n  [formGroup]=\"group\"\r\n  *ngIf=\"group\"\r\n  [ngClass]=\"\r\n    config.isLabelAlignedLeft\r\n      ? 'ieeesa-autocomplete-field__label-left'\r\n      : 'ieeesa-autocomplete-field__label-top'\r\n  \"\r\n>\r\n  <mat-label class=\"ieeesa-autocomplete__label\">{{ config.label }}</mat-label>\r\n  <mat-form-field class=\"ieeesa-autocomplete__mat-form\" appearance=\"outline\">\r\n    <input\r\n      matInput\r\n      class=\"ieeesa-autocomplete__input\"\r\n      [matAutocomplete]=\"auto\"\r\n      [placeholder]=\"config.placeholder ?? ''\"\r\n      [formControlName]=\"config.controlName\"\r\n      [name]=\"config.controlName\"\r\n      #autoComplete\r\n      (keypress)=\"filterOptions()\"\r\n    />\r\n    <mat-autocomplete\r\n      #auto=\"matAutocomplete\"\r\n      (optionSelected)=\"onChange($event.option.value)\"\r\n      class=\"ieeesa-autocomplete__autocomplete-list\"\r\n    >\r\n      <ng-container *ngIf=\"isSelectedOptionsVisible\">\r\n        <mat-option\r\n          *ngFor=\"let option of filteredOptions; trackBy: trackByFn\"\r\n          [value]=\"option.name\"\r\n        >\r\n          <span>{{ option.name }}</span>\r\n        </mat-option>\r\n      </ng-container>\r\n    </mat-autocomplete>\r\n    <button\r\n      type=\"button\"\r\n      matSuffix\r\n      mat-icon-button\r\n      [attr.aria-label]=\"autocompleteConstInfo.ariaLabel.clear\"\r\n      *ngIf=\"value\"\r\n      (click)=\"value = ''\"\r\n    >\r\n      <i class=\"fa-solid fa-xmark ieeesa-autocomplete__cancel-icon\"></i>\r\n    </button>\r\n  </mat-form-field>\r\n</div>\r\n", styles: [".ieeesa-subtitle{text-align:left;font-family:Calibri Regular;font-size:1.56em;letter-spacing:0;color:#000;opacity:1}.ieeesa-body{text-align:left;font-family:Calibri Regular;font-size:1.25em;letter-spacing:0;color:#000;opacity:1}.ieeesa-display-lg-57{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:3.5625em;line-height:64px;color:#000;letter-spacing:0}.ieeesa-display-md-47{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:2.9375em;line-height:52px;color:#000;letter-spacing:0}.ieeesa-display-sm-38{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:2.375em;line-height:44px;color:#000;letter-spacing:0}.ieeesa-headline-lg-34{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:2.125em;line-height:40px;color:#000;letter-spacing:0}.ieeesa-headline-md-30{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1.875em;line-height:36px;color:#000;letter-spacing:0}.ieeesa-headline-sm-26{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1.625em;line-height:32px;color:#000;letter-spacing:0}.ieeesa-title-lg-bold-24{font-family:Calibri Regular;font-style:normal;font-weight:700;font-size:1.5em;line-height:28px;color:#000;letter-spacing:0}.ieeesa-title-lg-24{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1.5em;line-height:28px;color:#000;letter-spacing:0}.ieeesa-title-md-18{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1.125em;line-height:24px;color:#000;letter-spacing:.009375em}.ieeesa-title-sm-16{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1em;line-height:20px;color:#000;letter-spacing:.00625em}.ieeesa-label-lg-bold-16{font-family:Calibri Regular;font-style:normal;font-weight:700;font-size:1em;line-height:20px;color:#000;letter-spacing:.00625em}.ieeesa-label-lg-16{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1em;line-height:20px;color:#000;letter-spacing:.00625em}.ieeesa-label-md-14{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:.875em;line-height:16px;color:#000;letter-spacing:.03125em}.ieeesa-label-sm-13{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:.8125em;line-height:16px;color:#000;letter-spacing:.03125em}.ieeesa-body-lg-bold-18{font-family:Calibri Regular;font-style:normal;font-weight:700;font-size:1.125em;line-height:24px;color:#000;letter-spacing:.03125em}.ieeesa-body-lg-18{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1.125em;line-height:24px;color:#000;letter-spacing:.03125em}.ieeesa-body-md-16{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1em;line-height:20px;color:#000;letter-spacing:.015625em}.ieeesa-body-sm-14{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:.875em;line-height:16px;color:#000;letter-spacing:.025em}.ieeesa-title-inter-lg-bold-24{font-family:Inter Bold;font-style:normal;font-weight:700;font-size:1.5em;line-height:29px;color:#000;letter-spacing:0}.mat-mdc-button.mat-mdc-button-base.mat-primary-button,.mat-mdc-button.mat-mdc-button-base.mat-secondary-button{min-width:103px;width:auto;min-height:40px;height:auto;border-radius:3px;text-align:center;padding:.625em 1.5em;border:none;font-family:Calibri Regular;font-style:normal;font-weight:700;font-size:1em;line-height:20px;color:#000;letter-spacing:.00625em}.mat-mdc-button.mat-mdc-button-base>.mat-icon{margin-right:11px}.mat-mdc-button.mat-mdc-button-base.mat-primary-button{background-color:#00629b;color:#fff}.mat-mdc-button.mat-mdc-button-base.mat-primary-button:hover{background-color:#003e65}.mat-mdc-button.mat-mdc-button-base.mat-primary-button:active{background-color:#00629b}.mat-mdc-button.mat-mdc-button-base.mat-primary-button:disabled{background-color:#1c1b1f1f}.mat-mdc-button.mat-mdc-button-base.mat-secondary-button{color:#fff;background:#a7a8aa;box-shadow:0 1px 2px #0000004d,0 2px 6px 2px #00000026}.mat-mdc-button.mat-mdc-button-base.mat-secondary-button:hover{background:#a7a8aa}.mat-mdc-button.mat-mdc-button-base.mat-secondary-button:active{background:rgba(29,25,43,.12)}.mat-mdc-button.mat-mdc-button-base.mat-secondary-button:disabled{background:rgba(28,27,31,.12);color:#1c1b1f;opacity:.38}.ieeesa-text-button{color:#cac4d0;background:none;border:none}.flex-align-center{display:flex;align-items:center;justify-content:center}.mat-button-toggle-checked{background-color:#a7a8aa}.mat-button-toggle-checked .mat-button-toggle-label-content:before{font-family:\"Font Awesome 5 Free\";font-weight:900;content:\"\\f00c\";padding-right:.5625em}.mat-button-toggle-group .mat-button-toggle-label-content{font-family:Calibri Regular;font-style:normal;font-weight:700;font-size:1em;line-height:20px;color:#1c1b1f;letter-spacing:.00625em}@media (max-width: 768px){.mat-button-toggle-group .mat-button-toggle-label-content{max-width:8ch;text-overflow:ellipsis;white-space:nowrap;overflow:hidden;position:relative}}.cdk-overlay-pane{width:100%;min-width:312px}.ieeesa-autocomplete__label-left{display:flex}.ieeesa-autocomplete__label-top{display:block}.ieeesa-autocomplete__cancel-icon{height:20px;width:20px}.ieeesa-autocomplete .mat-mdc-form-field{border-radius:4px 4px 0 0;width:-webkit-fill-available}.ieeesa-autocomplete .mat-mdc-form-field .mdc-text-field--outlined .mdc-floating-label--float-above{color:#00b5e2}.ieeesa-autocomplete .mat-focused .mat-mdc-form-field{caret-color:#00b5e2}.ieeesa-autocomplete .mat-focused .mdc-notched-outline__leading,.ieeesa-autocomplete .mat-focused .mdc-notched-outline__trailing,.ieeesa-autocomplete .mat-focused .mdc-notched-outline__notch{border-color:#00b5e2}.ieeesa-autocomplete .mat-mdc-text-field-wrapper{min-width:12.5em;width:auto;height:3.5em;flex:auto}.ieeesa-autocomplete .mat-mdc-form-field-subscript-wrapper{width:0px;position:relative;height:0px}.ieeesa-autocomplete-overlay-pane .mat-mdc-autocomplete-panel{padding:8px 0;background:linear-gradient(0deg,rgba(0,98,155,.0784313725),rgba(0,98,155,.0784313725)),#fffbfe;box-shadow:0 1px 2px #0000004d,0 2px 6px 2px #00000026;border-radius:4px}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i3.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i3.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i3.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "ngmodule", type: MatOptionModule }, { kind: "component", type: i2$1.MatOption, selector: "mat-option", exportAs: ["matOption"] }, { kind: "ngmodule", type: MatAutocompleteModule }, { kind: "component", type: i5$1.MatAutocomplete, selector: "mat-autocomplete", inputs: ["disableRipple", "hideSingleSelectionIndicator"], exportAs: ["matAutocomplete"] }, { kind: "directive", type: i5$1.MatAutocompleteTrigger, selector: "input[matAutocomplete], textarea[matAutocomplete]", exportAs: ["matAutocompleteTrigger"] }, { kind: "ngmodule", type: MatInputModule }, { kind: "directive", type: i5.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl],      input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly"], exportAs: ["matInput"] }, { kind: "component", type: i4.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i4.MatLabel, selector: "mat-label" }, { kind: "directive", type: i4.MatSuffix, selector: "[matSuffix], [matIconSuffix], [matTextSuffix]", inputs: ["matTextSuffix"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i8.MatIconButton, selector: "button[mat-icon-button]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }], encapsulation: i0.ViewEncapsulation.None }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.3", ngImport: i0, type: AutocompleteComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'ieeesa-autocomplete', standalone: true, imports: [
+                        CommonModule,
+                        ReactiveFormsModule,
+                        FormErrorComponent,
+                        MatOptionModule,
+                        MatAutocompleteModule,
+                        MatInputModule,
+                        MatIconModule,
+                        MatButtonModule,
+                    ], providers: [
+                        {
+                            provide: MAT_AUTOCOMPLETE_DEFAULT_OPTIONS,
+                            useValue: { overlayPanelClass: 'ieeesa-autocomplete-overlay-pane' },
+                        },
+                    ], encapsulation: ViewEncapsulation.None, template: "<div\r\n  class=\"ieeesa-autocomplete\"\r\n  [formGroup]=\"group\"\r\n  *ngIf=\"group\"\r\n  [ngClass]=\"\r\n    config.isLabelAlignedLeft\r\n      ? 'ieeesa-autocomplete-field__label-left'\r\n      : 'ieeesa-autocomplete-field__label-top'\r\n  \"\r\n>\r\n  <mat-label class=\"ieeesa-autocomplete__label\">{{ config.label }}</mat-label>\r\n  <mat-form-field class=\"ieeesa-autocomplete__mat-form\" appearance=\"outline\">\r\n    <input\r\n      matInput\r\n      class=\"ieeesa-autocomplete__input\"\r\n      [matAutocomplete]=\"auto\"\r\n      [placeholder]=\"config.placeholder ?? ''\"\r\n      [formControlName]=\"config.controlName\"\r\n      [name]=\"config.controlName\"\r\n      #autoComplete\r\n      (keypress)=\"filterOptions()\"\r\n    />\r\n    <mat-autocomplete\r\n      #auto=\"matAutocomplete\"\r\n      (optionSelected)=\"onChange($event.option.value)\"\r\n      class=\"ieeesa-autocomplete__autocomplete-list\"\r\n    >\r\n      <ng-container *ngIf=\"isSelectedOptionsVisible\">\r\n        <mat-option\r\n          *ngFor=\"let option of filteredOptions; trackBy: trackByFn\"\r\n          [value]=\"option.name\"\r\n        >\r\n          <span>{{ option.name }}</span>\r\n        </mat-option>\r\n      </ng-container>\r\n    </mat-autocomplete>\r\n    <button\r\n      type=\"button\"\r\n      matSuffix\r\n      mat-icon-button\r\n      [attr.aria-label]=\"autocompleteConstInfo.ariaLabel.clear\"\r\n      *ngIf=\"value\"\r\n      (click)=\"value = ''\"\r\n    >\r\n      <i class=\"fa-solid fa-xmark ieeesa-autocomplete__cancel-icon\"></i>\r\n    </button>\r\n  </mat-form-field>\r\n</div>\r\n", styles: [".ieeesa-subtitle{text-align:left;font-family:Calibri Regular;font-size:1.56em;letter-spacing:0;color:#000;opacity:1}.ieeesa-body{text-align:left;font-family:Calibri Regular;font-size:1.25em;letter-spacing:0;color:#000;opacity:1}.ieeesa-display-lg-57{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:3.5625em;line-height:64px;color:#000;letter-spacing:0}.ieeesa-display-md-47{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:2.9375em;line-height:52px;color:#000;letter-spacing:0}.ieeesa-display-sm-38{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:2.375em;line-height:44px;color:#000;letter-spacing:0}.ieeesa-headline-lg-34{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:2.125em;line-height:40px;color:#000;letter-spacing:0}.ieeesa-headline-md-30{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1.875em;line-height:36px;color:#000;letter-spacing:0}.ieeesa-headline-sm-26{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1.625em;line-height:32px;color:#000;letter-spacing:0}.ieeesa-title-lg-bold-24{font-family:Calibri Regular;font-style:normal;font-weight:700;font-size:1.5em;line-height:28px;color:#000;letter-spacing:0}.ieeesa-title-lg-24{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1.5em;line-height:28px;color:#000;letter-spacing:0}.ieeesa-title-md-18{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1.125em;line-height:24px;color:#000;letter-spacing:.009375em}.ieeesa-title-sm-16{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1em;line-height:20px;color:#000;letter-spacing:.00625em}.ieeesa-label-lg-bold-16{font-family:Calibri Regular;font-style:normal;font-weight:700;font-size:1em;line-height:20px;color:#000;letter-spacing:.00625em}.ieeesa-label-lg-16{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1em;line-height:20px;color:#000;letter-spacing:.00625em}.ieeesa-label-md-14{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:.875em;line-height:16px;color:#000;letter-spacing:.03125em}.ieeesa-label-sm-13{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:.8125em;line-height:16px;color:#000;letter-spacing:.03125em}.ieeesa-body-lg-bold-18{font-family:Calibri Regular;font-style:normal;font-weight:700;font-size:1.125em;line-height:24px;color:#000;letter-spacing:.03125em}.ieeesa-body-lg-18{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1.125em;line-height:24px;color:#000;letter-spacing:.03125em}.ieeesa-body-md-16{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1em;line-height:20px;color:#000;letter-spacing:.015625em}.ieeesa-body-sm-14{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:.875em;line-height:16px;color:#000;letter-spacing:.025em}.ieeesa-title-inter-lg-bold-24{font-family:Inter Bold;font-style:normal;font-weight:700;font-size:1.5em;line-height:29px;color:#000;letter-spacing:0}.mat-mdc-button.mat-mdc-button-base.mat-primary-button,.mat-mdc-button.mat-mdc-button-base.mat-secondary-button{min-width:103px;width:auto;min-height:40px;height:auto;border-radius:3px;text-align:center;padding:.625em 1.5em;border:none;font-family:Calibri Regular;font-style:normal;font-weight:700;font-size:1em;line-height:20px;color:#000;letter-spacing:.00625em}.mat-mdc-button.mat-mdc-button-base>.mat-icon{margin-right:11px}.mat-mdc-button.mat-mdc-button-base.mat-primary-button{background-color:#00629b;color:#fff}.mat-mdc-button.mat-mdc-button-base.mat-primary-button:hover{background-color:#003e65}.mat-mdc-button.mat-mdc-button-base.mat-primary-button:active{background-color:#00629b}.mat-mdc-button.mat-mdc-button-base.mat-primary-button:disabled{background-color:#1c1b1f1f}.mat-mdc-button.mat-mdc-button-base.mat-secondary-button{color:#fff;background:#a7a8aa;box-shadow:0 1px 2px #0000004d,0 2px 6px 2px #00000026}.mat-mdc-button.mat-mdc-button-base.mat-secondary-button:hover{background:#a7a8aa}.mat-mdc-button.mat-mdc-button-base.mat-secondary-button:active{background:rgba(29,25,43,.12)}.mat-mdc-button.mat-mdc-button-base.mat-secondary-button:disabled{background:rgba(28,27,31,.12);color:#1c1b1f;opacity:.38}.ieeesa-text-button{color:#cac4d0;background:none;border:none}.flex-align-center{display:flex;align-items:center;justify-content:center}.mat-button-toggle-checked{background-color:#a7a8aa}.mat-button-toggle-checked .mat-button-toggle-label-content:before{font-family:\"Font Awesome 5 Free\";font-weight:900;content:\"\\f00c\";padding-right:.5625em}.mat-button-toggle-group .mat-button-toggle-label-content{font-family:Calibri Regular;font-style:normal;font-weight:700;font-size:1em;line-height:20px;color:#1c1b1f;letter-spacing:.00625em}@media (max-width: 768px){.mat-button-toggle-group .mat-button-toggle-label-content{max-width:8ch;text-overflow:ellipsis;white-space:nowrap;overflow:hidden;position:relative}}.cdk-overlay-pane{width:100%;min-width:312px}.ieeesa-autocomplete__label-left{display:flex}.ieeesa-autocomplete__label-top{display:block}.ieeesa-autocomplete__cancel-icon{height:20px;width:20px}.ieeesa-autocomplete .mat-mdc-form-field{border-radius:4px 4px 0 0;width:-webkit-fill-available}.ieeesa-autocomplete .mat-mdc-form-field .mdc-text-field--outlined .mdc-floating-label--float-above{color:#00b5e2}.ieeesa-autocomplete .mat-focused .mat-mdc-form-field{caret-color:#00b5e2}.ieeesa-autocomplete .mat-focused .mdc-notched-outline__leading,.ieeesa-autocomplete .mat-focused .mdc-notched-outline__trailing,.ieeesa-autocomplete .mat-focused .mdc-notched-outline__notch{border-color:#00b5e2}.ieeesa-autocomplete .mat-mdc-text-field-wrapper{min-width:12.5em;width:auto;height:3.5em;flex:auto}.ieeesa-autocomplete .mat-mdc-form-field-subscript-wrapper{width:0px;position:relative;height:0px}.ieeesa-autocomplete-overlay-pane .mat-mdc-autocomplete-panel{padding:8px 0;background:linear-gradient(0deg,rgba(0,98,155,.0784313725),rgba(0,98,155,.0784313725)),#fffbfe;box-shadow:0 1px 2px #0000004d,0 2px 6px 2px #00000026;border-radius:4px}\n"] }]
+        }], ctorParameters: function () { return [{ type: FormUtilityService }]; }, propDecorators: { filteredOptions: [{
+                type: Input
+            }], isSelectedOptionsVisible: [{
+                type: Input
+            }], autoCompleteSearchValue: [{
+                type: Output
+            }], autoCompleteOptionSelected: [{
+                type: Output
+            }], autoComplete: [{
+                type: ViewChild,
+                args: ['autoComplete']
+            }] } });
+
+/**
+ * Provides implementation of all types of checkboxes.
+ * @export
+ * @class CheckboxComponent
+ * @implements {OnInit}
+ * @implements {FormField}
+ */
+class CheckboxComponent {
     /**
-     * Emits formGroupArray
-     * @memberof DynamicFormComponent
+     * Input property to get checkbox options.
+     * @memberof CheckboxComponent
+     * @usageNotes const checkboxes = [{ id: 1, name:"Angular"}]
      */
-    onLeftButtonClicked() {
-        this.formLeftButtonClicked.emit(this.formGroupArray);
+    set checkboxes(value) {
+        this._checkboxes = value;
     }
-    /**
-     * Emits formGroupArray
-     * @memberof DynamicFormComponent
-     */
-    onFormChange() {
-        this.formChange.emit(this.formGroupArray);
+    get checkboxes() {
+        return this._checkboxes;
     }
-    /**
-     * Handles form field select type drop down selection event
-     * @memberof DynamicFormComponent
-     */
-    onDropdownChange() {
-        this.dropdownChange.emit(this.formGroupArray);
+    // eslint-disable-next-line no-unused-vars, no-empty-function
+    constructor(formUtilityService) {
+        this.formUtilityService = formUtilityService;
+        this.checkboxSelection = new EventEmitter();
     }
     /**
-     * Handles form input change event
-     * @param {Event} event
-     * @memberof DynamicFormComponent
+     * Implementation of ngOnInit lifecycle hook method of component to initialize component instance properties.
+     * @memberof CheckboxComponent
      */
-    formInputChange(event) {
-        this.formControlChange.emit(event);
-        this.formInput.emit(this.formGroupArray);
+    ngOnInit() {
+        this.createFormGroupAndInitializeProperties();
     }
     /**
-     * Handles form field search apply event
-     * @param {Event} event
-     * @memberof DynamicFormComponent
+     * Creates form group and initializes components properties from config.
+     * @memberof CheckboxComponent
      */
-    onSearchApply(event) {
-        this.formSearchApply.emit(event);
+    createFormGroupAndInitializeProperties() {
+        this.checkboxes = this.config?.checkboxOptions ?? this.checkboxes;
+        this.group = this.group ?? this.formUtilityService.getFormGroup('checkbox');
+        this.checkboxes?.forEach((checkbox) => {
+            this.group.addControl(checkbox.id, new FormControl({
+                value: checkbox.checked,
+                disabled: checkbox.disabled,
+            }));
+        });
     }
     /**
-     * Handles search event inside form field select
-     * @param {Event} event
-     * @memberof DynamicFormComponent
+     * Sets checkbox selection and emits selected option on change event.
+     * @param {CheckboxOption} option
+     * @param {boolean} checked
+     * @memberof CheckboxComponent
      */
-    onSelectSearch(event) {
-        this.formSelectSearch.emit(event);
+    onChange(option, checked) {
+        option.checked = checked;
+        this.checkboxSelection.emit(option);
     }
     /**
-     * Takes the index and the formGroup as arguments and needs to return the unique identifier for this formGroup.
+     * Allows Angular to detect the specific checkbox option that needs to change or be added instead of rebuilding the whole checkbox options in DOM by tracking option unique Id.
      * @param {number} index
-     * @param {FormGroup} formGroup
-     * @memberof DynamicFormComponent
-     */
-    trackByFormGroup(index, formGroup) {
-        return formGroup.controls;
-    }
-    /**
-     * Handles form date selection event
-     * @param {string[]} event
-     * @memberof DynamicFormComponent
-     */
-    onDateSelected(event) {
-        this.formDateSelected.emit(event);
-    }
-    /**
-     * Emits selected form date range
-     * @param {{startDate: string, endDate: string}} dateRange
-     * @memberof DynamicFormComponent
-     */
-    onSelectedDateRange(dateRange) {
-        this.formSelectedDateRange.emit(dateRange);
-    }
-    /**
-     * Handles form field auto complete search event
-     * @param {Event} event
-     * @memberof DynamicFormComponent
-     */
-    onAutoCompleteSearch(event) {
-        this.formAutoCompleteSearch.emit(event);
-    }
-    /**
-     * Handles form field auto complete option selection event
-     * @memberof DynamicFormComponent
-     */
-    onAutoCompleteOptionSelected() {
-        this.autoCompleteOptionSelected.emit(this.formGroupArray);
-    }
-    /**
-     * Converts passed control name in hyphenated css class name
-     * @param {string} className
-     * @return {string}
-     * @memberof DynamicFormComponent
+     * @return {number}
+     * @memberof CheckboxComponent
      */
-    getRowClassName(className) {
-        return className
-            .replace(/([A-Z])/g, ' $1')
-            .toLowerCase()
-            .split(' ')
-            .join('-');
+    trackById(index, option) {
+        return option.id;
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.3", ngImport: i0, type: DynamicFormComponent, deps: [{ token: i3.FormBuilder }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.3", type: DynamicFormComponent, isStandalone: true, selector: "ieeesa-dynamic-form", inputs: { formGroups: "formGroups", submitResponse: "submitResponse", searchResponse: "searchResponse", colWidth: "colWidth", isLegendVisible: "isLegendVisible", rightButtonLabel: "rightButtonLabel", leftButtonLabel: "leftButtonLabel", isSubmitButtonDisabled: "isSubmitButtonDisabled", isLeftButtonDisabled: "isLeftButtonDisabled", isLeftButtonNeeded: "isLeftButtonNeeded" }, outputs: { formSubmit: "formSubmit", formChange: "formChange", formInput: "formInput", formLeftButtonClicked: "formLeftButtonClicked", formSearchApply: "formSearchApply", formGroupsReference: "formGroupsReference", dropdownChange: "dropdownChange", formDateSelected: "formDateSelected", formSelectSearch: "formSelectSearch", formControlChange: "formControlChange", formAutoCompleteSearch: "formAutoCompleteSearch", autoCompleteOptionSelected: "autoCompleteOptionSelected", formAfterContentInit: "formAfterContentInit", formSelectedDateRange: "formSelectedDateRange" }, viewQueries: [{ propertyName: "formFields", predicate: DynamicFormFieldDirective$1, descendants: true }], exportAs: ["dynamicForm"], ngImport: i0, template: "<form\r\n  class=\"ieeesa-dynamic-form\"\r\n  [formGroup]=\"form\"\r\n  (change)=\"onFormChange()\"\r\n  (ngSubmit)=\"onFormSubmit()\"\r\n  (input)=\"formInputChange($event)\"\r\n>\r\n  <fieldset\r\n    class=\"ieeesa-dynamic-form__fieldset p-2\"\r\n    *ngFor=\"\r\n      let formGrp of formGroupArray;\r\n      let i = index;\r\n      trackBy: trackByFormGroup\r\n    \"\r\n  >\r\n    <legend class=\"float-none w-auto p-2\" *ngIf=\"isLegendVisible\">\r\n      {{ legendsArray[i] }}:\r\n    </legend>\r\n    <div class=\"row\">\r\n      <div\r\n        class=\"col-{{ colWidth.xs }} col-sm-{{ colWidth.sm }} col-md-{{\r\n          colWidth.md\r\n        }} col-lg-{{ colWidth.lg }} col-xl-{{ colWidth.xl }}\r\n        ieeesa-dynamic-form__form-field\"\r\n        [ngClass]=\"getRowClassName(formControlArray[i][j].controlName)\"\r\n        *ngFor=\"let control of formControlArray[i]; let j = index\"\r\n      >\r\n        <ng-template\r\n          ieeesaDynamicFormField\r\n          [config]=\"formControlArray[i][j]\"\r\n          [group]=\"formGrp\"\r\n          [submitResponse]=\"submitResponse\"\r\n          [searchResponse]=\"searchResponse\"\r\n          (formSearchApply)=\"onSearchApply($event)\"\r\n          (formDropdownSelected)=\"onFormChange(); onDropdownChange()\"\r\n          (formDateSelected)=\"onDateSelected($event)\"\r\n          (formSelectedDateRange)=\"onSelectedDateRange($event)\"\r\n          (formSelectSearch)=\"onSelectSearch($event)\"\r\n          (formAutoCompleteSearch)=\"onAutoCompleteSearch($event)\"\r\n          (autoCompleteOptionSelected)=\"onAutoCompleteOptionSelected()\"\r\n        >\r\n        </ng-template>\r\n      </div>\r\n    </div>\r\n  </fieldset>\r\n  <div class=\"row\">\r\n    <div class=\"col-12 ieeesa-dynamic-form__actions\">\r\n      <button\r\n        type=\"submit\"\r\n        mat-button\r\n        class=\"mat-primary-button ieeesa-dynamic-form__actions--right-btn\"\r\n        [disabled]=\"isSubmitButtonDisabled\"\r\n      >\r\n        {{ rightButtonLabel }}\r\n      </button>\r\n      <button\r\n        *ngIf=\"isLeftButtonNeeded\"\r\n        type=\"button\"\r\n        mat-button\r\n        class=\"mat-secondary-button ieeesa-dynamic-form__actions--left-btn\"\r\n        (click)=\"onLeftButtonClicked()\"\r\n        [disabled]=\"isLeftButtonDisabled\"\r\n      >\r\n        {{ leftButtonLabel }}\r\n      </button>\r\n    </div>\r\n  </div>\r\n</form>\r\n", styles: [".ieeesa-subtitle{text-align:left;font-family:Calibri Regular;font-size:1.56em;letter-spacing:0;color:#000;opacity:1}.ieeesa-body{text-align:left;font-family:Calibri Regular;font-size:1.25em;letter-spacing:0;color:#000;opacity:1}.ieeesa-display-lg-57{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:3.5625em;line-height:64px;color:#000;letter-spacing:0}.ieeesa-display-md-47{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:2.9375em;line-height:52px;color:#000;letter-spacing:0}.ieeesa-display-sm-38{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:2.375em;line-height:44px;color:#000;letter-spacing:0}.ieeesa-headline-lg-34{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:2.125em;line-height:40px;color:#000;letter-spacing:0}.ieeesa-headline-md-30{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1.875em;line-height:36px;color:#000;letter-spacing:0}.ieeesa-headline-sm-26{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1.625em;line-height:32px;color:#000;letter-spacing:0}.ieeesa-title-lg-bold-24{font-family:Calibri Regular;font-style:normal;font-weight:700;font-size:1.5em;line-height:28px;color:#000;letter-spacing:0}.ieeesa-title-lg-24{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1.5em;line-height:28px;color:#000;letter-spacing:0}.ieeesa-title-md-18{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1.125em;line-height:24px;color:#000;letter-spacing:.009375em}.ieeesa-title-sm-16{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1em;line-height:20px;color:#000;letter-spacing:.00625em}.ieeesa-label-lg-bold-16{font-family:Calibri Regular;font-style:normal;font-weight:700;font-size:1em;line-height:20px;color:#000;letter-spacing:.00625em}.ieeesa-label-lg-16{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1em;line-height:20px;color:#000;letter-spacing:.00625em}.ieeesa-label-md-14{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:.875em;line-height:16px;color:#000;letter-spacing:.03125em}.ieeesa-label-sm-13{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:.8125em;line-height:16px;color:#000;letter-spacing:.03125em}.ieeesa-body-lg-bold-18{font-family:Calibri Regular;font-style:normal;font-weight:700;font-size:1.125em;line-height:24px;color:#000;letter-spacing:.03125em}.ieeesa-body-lg-18{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1.125em;line-height:24px;color:#000;letter-spacing:.03125em}.ieeesa-body-md-16{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1em;line-height:20px;color:#000;letter-spacing:.015625em}.ieeesa-body-sm-14{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:.875em;line-height:16px;color:#000;letter-spacing:.025em}.ieeesa-title-inter-lg-bold-24{font-family:Inter Bold;font-style:normal;font-weight:700;font-size:1.5em;line-height:29px;color:#000;letter-spacing:0}.mat-mdc-button.mat-mdc-button-base.mat-primary-button,.mat-mdc-button.mat-mdc-button-base.mat-secondary-button{min-width:103px;width:auto;min-height:40px;height:auto;border-radius:3px;text-align:center;padding:.625em 1.5em;border:none;font-family:Calibri Regular;font-style:normal;font-weight:700;font-size:1em;line-height:20px;color:#000;letter-spacing:.00625em}.mat-mdc-button.mat-mdc-button-base>.mat-icon{margin-right:11px}.mat-mdc-button.mat-mdc-button-base.mat-primary-button{background-color:#00629b;color:#fff}.mat-mdc-button.mat-mdc-button-base.mat-primary-button:hover{background-color:#003e65}.mat-mdc-button.mat-mdc-button-base.mat-primary-button:active{background-color:#00629b}.mat-mdc-button.mat-mdc-button-base.mat-primary-button:disabled{background-color:#1c1b1f1f}.mat-mdc-button.mat-mdc-button-base.mat-secondary-button{color:#fff;background:#a7a8aa;box-shadow:0 1px 2px #0000004d,0 2px 6px 2px #00000026}.mat-mdc-button.mat-mdc-button-base.mat-secondary-button:hover{background:#a7a8aa}.mat-mdc-button.mat-mdc-button-base.mat-secondary-button:active{background:rgba(29,25,43,.12)}.mat-mdc-button.mat-mdc-button-base.mat-secondary-button:disabled{background:rgba(28,27,31,.12);color:#1c1b1f;opacity:.38}.ieeesa-text-button{color:#cac4d0;background:none;border:none}.flex-align-center{display:flex;align-items:center;justify-content:center}.mat-button-toggle-checked{background-color:#a7a8aa}.mat-button-toggle-checked .mat-button-toggle-label-content:before{font-family:\"Font Awesome 5 Free\";font-weight:900;content:\"\\f00c\";padding-right:.5625em}.mat-button-toggle-group .mat-button-toggle-label-content{font-family:Calibri Regular;font-style:normal;font-weight:700;font-size:1em;line-height:20px;color:#1c1b1f;letter-spacing:.00625em}@media (max-width: 768px){.mat-button-toggle-group .mat-button-toggle-label-content{max-width:8ch;text-overflow:ellipsis;white-space:nowrap;overflow:hidden;position:relative}}.cdk-overlay-pane{width:100%;min-width:312px}.ieeesa-dynamic-form__actions{display:flex;flex-direction:row-reverse;padding-top:15px}.ieeesa-dynamic-form__actions--left-btn{margin-right:2%}.ieeesa-dynamic-form__form-field{padding-top:20px}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i3.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i3.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i3.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: DynamicFormFieldDirective$1, selector: "[ieeesaDynamicFormField]", inputs: ["config", "group", "submitResponse", "searchResponse"], outputs: ["formSearchApply", "formDropdownSelected", "formDateSelected", "formSelectedDateRange", "formSelectSearch", "formAutoCompleteSearch", "autoCompleteOptionSelected"] }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i8.MatButton, selector: "    button[mat-button], button[mat-raised-button], button[mat-flat-button],    button[mat-stroked-button]  ", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }] }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.3", ngImport: i0, type: CheckboxComponent, deps: [{ token: FormUtilityService }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.3", type: CheckboxComponent, isStandalone: true, selector: "ieeesa-checkbox", inputs: { checkboxes: "checkboxes" }, outputs: { checkboxSelection: "checkboxSelection" }, ngImport: i0, template: "<div\r\n  [formGroup]=\"group\"\r\n  class=\"ieeesa-checkbox-field\"\r\n  *ngIf=\"group\"\r\n  [ngClass]=\"\r\n    config.isLabelAlignedLeft\r\n      ? 'ieeesa-checkbox-field__label-left'\r\n      : 'ieeesa-checkbox-field__label-top'\r\n  \"\r\n>\r\n  <mat-label class=\"ieeesa-body-sm-14 ieeesa-checkbox-field__label\">{{\r\n    config.label\r\n  }}</mat-label>\r\n  <mat-list>\r\n    <mat-checkbox\r\n      *ngFor=\"let option of checkboxes; trackBy: trackById\"\r\n      [formControlName]=\"option.id\"\r\n      (change)=\"onChange(option, true)\"\r\n      [disabled]=\"option.disabled\"\r\n      [checked]=\"option.checked\"\r\n    >\r\n      {{ option.name }}\r\n    </mat-checkbox>\r\n  </mat-list>\r\n  <ieeesa-form-error [formGroup]=\"group\" [config]=\"config\"> </ieeesa-form-error>\r\n</div>\r\n", styles: [".ieeesa-subtitle{text-align:left;font-family:Calibri Regular;font-size:1.56em;letter-spacing:0;color:#000;opacity:1}.ieeesa-body{text-align:left;font-family:Calibri Regular;font-size:1.25em;letter-spacing:0;color:#000;opacity:1}.ieeesa-display-lg-57{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:3.5625em;line-height:64px;color:#000;letter-spacing:0}.ieeesa-display-md-47{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:2.9375em;line-height:52px;color:#000;letter-spacing:0}.ieeesa-display-sm-38{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:2.375em;line-height:44px;color:#000;letter-spacing:0}.ieeesa-headline-lg-34{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:2.125em;line-height:40px;color:#000;letter-spacing:0}.ieeesa-headline-md-30{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1.875em;line-height:36px;color:#000;letter-spacing:0}.ieeesa-headline-sm-26{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1.625em;line-height:32px;color:#000;letter-spacing:0}.ieeesa-title-lg-bold-24{font-family:Calibri Regular;font-style:normal;font-weight:700;font-size:1.5em;line-height:28px;color:#000;letter-spacing:0}.ieeesa-title-lg-24{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1.5em;line-height:28px;color:#000;letter-spacing:0}.ieeesa-title-md-18{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1.125em;line-height:24px;color:#000;letter-spacing:.009375em}.ieeesa-title-sm-16{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1em;line-height:20px;color:#000;letter-spacing:.00625em}.ieeesa-label-lg-bold-16{font-family:Calibri Regular;font-style:normal;font-weight:700;font-size:1em;line-height:20px;color:#000;letter-spacing:.00625em}.ieeesa-label-lg-16{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1em;line-height:20px;color:#000;letter-spacing:.00625em}.ieeesa-label-md-14{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:.875em;line-height:16px;color:#000;letter-spacing:.03125em}.ieeesa-label-sm-13{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:.8125em;line-height:16px;color:#000;letter-spacing:.03125em}.ieeesa-body-lg-bold-18{font-family:Calibri Regular;font-style:normal;font-weight:700;font-size:1.125em;line-height:24px;color:#000;letter-spacing:.03125em}.ieeesa-body-lg-18{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1.125em;line-height:24px;color:#000;letter-spacing:.03125em}.ieeesa-body-md-16{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1em;line-height:20px;color:#000;letter-spacing:.015625em}.ieeesa-body-sm-14{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:.875em;line-height:16px;color:#000;letter-spacing:.025em}.ieeesa-title-inter-lg-bold-24{font-family:Inter Bold;font-style:normal;font-weight:700;font-size:1.5em;line-height:29px;color:#000;letter-spacing:0}.mat-mdc-button.mat-mdc-button-base.mat-primary-button,.mat-mdc-button.mat-mdc-button-base.mat-secondary-button{min-width:103px;width:auto;min-height:40px;height:auto;border-radius:3px;text-align:center;padding:.625em 1.5em;border:none;font-family:Calibri Regular;font-style:normal;font-weight:700;font-size:1em;line-height:20px;color:#000;letter-spacing:.00625em}.mat-mdc-button.mat-mdc-button-base>.mat-icon{margin-right:11px}.mat-mdc-button.mat-mdc-button-base.mat-primary-button{background-color:#00629b;color:#fff}.mat-mdc-button.mat-mdc-button-base.mat-primary-button:hover{background-color:#003e65}.mat-mdc-button.mat-mdc-button-base.mat-primary-button:active{background-color:#00629b}.mat-mdc-button.mat-mdc-button-base.mat-primary-button:disabled{background-color:#1c1b1f1f}.mat-mdc-button.mat-mdc-button-base.mat-secondary-button{color:#fff;background:#a7a8aa;box-shadow:0 1px 2px #0000004d,0 2px 6px 2px #00000026}.mat-mdc-button.mat-mdc-button-base.mat-secondary-button:hover{background:#a7a8aa}.mat-mdc-button.mat-mdc-button-base.mat-secondary-button:active{background:rgba(29,25,43,.12)}.mat-mdc-button.mat-mdc-button-base.mat-secondary-button:disabled{background:rgba(28,27,31,.12);color:#1c1b1f;opacity:.38}.ieeesa-text-button{color:#cac4d0;background:none;border:none}.flex-align-center{display:flex;align-items:center;justify-content:center}.mat-button-toggle-checked{background-color:#a7a8aa}.mat-button-toggle-checked .mat-button-toggle-label-content:before{font-family:\"Font Awesome 5 Free\";font-weight:900;content:\"\\f00c\";padding-right:.5625em}.mat-button-toggle-group .mat-button-toggle-label-content{font-family:Calibri Regular;font-style:normal;font-weight:700;font-size:1em;line-height:20px;color:#1c1b1f;letter-spacing:.00625em}@media (max-width: 768px){.mat-button-toggle-group .mat-button-toggle-label-content{max-width:8ch;text-overflow:ellipsis;white-space:nowrap;overflow:hidden;position:relative}}.cdk-overlay-pane{width:100%;min-width:312px}.ieeesa-checkbox-field__label-left{display:flex;align-items:center}.ieeesa-checkbox-field__label-top{display:block}.ieeesa-checkbox-field .mat-mdc-list{display:flex;list-style-type:none}.ieeesa-checkbox-field .mat-mdc-checkbox .mat-mdc-checkbox-touch-target{height:40px;width:40px}.ieeesa-checkbox-field .mat-mdc-checkbox .mdc-checkbox:hover .mdc-checkbox__native-control:not([disabled])~.mdc-checkbox__ripple{background-color:#1c1b1f!important;opacity:.08!important}.ieeesa-checkbox-field .mat-mdc-checkbox .mdc-checkbox .mdc-checkbox__native-control:enabled:not(:checked):not(:indeterminate):not([data-indeterminate=true])~.mdc-checkbox__background{border-color:#49454f!important;background-color:transparent!important}.ieeesa-checkbox-field .mat-mdc-checkbox .mdc-checkbox:hover .mdc-checkbox__native-control:enabled:not(:checked):not(:indeterminate):not([data-indeterminate=true])~.mdc-checkbox__background{border-color:#1c1b1f!important;background-color:transparent!important}.ieeesa-checkbox-field .mat-mdc-checkbox .mdc-checkbox__native-control:focus:enabled:not(:checked):not(:indeterminate):not([data-indeterminate=true])~.mdc-checkbox__background{border-color:#1c1b1f!important;background-color:transparent!important}.ieeesa-checkbox-field .mat-mdc-checkbox.mat-accent.mat-mdc-checkbox-checked .mdc-checkbox__background{border-color:#00b5e2!important;background-color:#00b5e2!important}.ieeesa-checkbox-field .mat-mdc-checkbox.mat-accent.mat-mdc-checkbox-checked .mdc-checkbox:hover .mdc-checkbox__ripple{background-color:#6750a4!important;opacity:.08!important}.ieeesa-checkbox-field .mat-mdc-checkbox.mat-accent.mat-mdc-checkbox-checked .mdc-checkbox:focus .mdc-checkbox__ripple{background-color:#6750a4}.ieeesa-checkbox-field .mat-mdc-checkbox.mat-accent.mat-mdc-checkbox-checked .mat-mdc-checkbox-ripple:not(:empty){background-color:#6750a4!important;opacity:.12!important}.ieeesa-checkbox-field .mat-mdc-checkbox.mat-accent.mat-mdc-checkbox-checked .mdc-checkbox__ripple{background-color:#6750a4}.ieeesa-checkbox-field .mat-mdc-checkbox .mdc-checkbox .mdc-checkbox__native-control:enabled:indeterminate~.mdc-checkbox__background{border-color:#00b5e2!important;background-color:#00b5e2!important}.ieeesa-checkbox-field .mat-mdc-checkbox .mdc-checkbox:hover .mdc-checkbox__native-control[data-indeterminate=true]:enabled~.mdc-checkbox__background{border-color:#00b5e2!important;background-color:#00b5e2!important}.ieeesa-checkbox-field .mat-mdc-checkbox .mdc-checkbox .mdc-checkbox__native-control[disabled]:checked~.mdc-checkbox__background{border-color:#1c1b1f!important;background-color:#1c1b1f!important}.ieeesa-checkbox-field .mat-mdc-checkbox .mdc-checkbox .mdc-checkbox__native-control[disabled]:not(:checked):not(:indeterminate):not([data-indeterminate=true])~.mdc-checkbox__background{border-color:#1c1b1f!important;background-color:transparent!important}.ieeesa-checkbox-field .mat-mdc-checkbox .mdc-checkbox .mdc-checkbox__native-control[disabled]:indeterminate~.mdc-checkbox__background{border-color:#1c1b1f!important;background-color:#1c1b1f!important}.ng-valid.ng-submitted .mat-mdc-checkbox.checkbox.mat-accent.ng-pristine.ng-invalid.ng-touched .mdc-checkbox:hover .mdc-checkbox__ripple,.ng-valid.ng-submitted .mat-mdc-checkbox.checkbox.mat-accent.ng-pristine.ng-invalid.ng-untouched .mdc-checkbox:hover .mdc-checkbox__ripple,.ng-valid.ng-submitted .mat-mdc-checkbox.checkbox.mat-accent.ng-dirty.ng-invalid.ng-touched .mdc-checkbox:hover .mdc-checkbox__ripple{background-color:#b3261e!important;opacity:.08!important}.ng-valid.ng-submitted .mat-mdc-checkbox.checkbox.mat-accent.ng-pristine.ng-invalid.ng-touched .mdc-checkbox:focus .mdc-checkbox__ripple,.ng-valid.ng-submitted .mat-mdc-checkbox.checkbox.mat-accent.ng-pristine.ng-invalid.ng-untouched .mdc-checkbox:focus .mdc-checkbox__ripple,.ng-valid.ng-submitted .mat-mdc-checkbox.checkbox.mat-accent.ng-dirty.ng-invalid.ng-touched .mdc-checkbox:focus .mdc-checkbox__ripple{background-color:#b3261e!important;opacity:.12!important}.ng-valid.ng-submitted .mat-mdc-checkbox.checkbox.mat-accent.ng-pristine.ng-invalid.ng-touched .mdc-checkbox__ripple,.ng-valid.ng-submitted .mat-mdc-checkbox.checkbox.mat-accent.ng-pristine.ng-invalid.ng-untouched .mdc-checkbox__ripple,.ng-valid.ng-submitted .mat-mdc-checkbox.checkbox.mat-accent.ng-dirty.ng-invalid.ng-touched .mdc-checkbox__ripple{background-color:#b3261e}.ng-valid.ng-submitted .mat-mdc-checkbox.checkbox.mat-accent.ng-pristine.ng-invalid.ng-touched .mdc-checkbox__background,.ng-valid.ng-submitted .mat-mdc-checkbox.checkbox.mat-accent.ng-pristine.ng-invalid.ng-untouched .mdc-checkbox__background,.ng-valid.ng-submitted .mat-mdc-checkbox.checkbox.mat-accent.ng-dirty.ng-invalid.ng-touched .mdc-checkbox__background{border-color:#ba0c2f!important;background-color:transparent!important}.ng-valid.ng-submitted .mat-mdc-checkbox.mat-accent.mat-mdc-checkbox-checked.ng-dirty.ng-valid.ng-touched .mdc-checkbox__background{border-color:#ba0c2f!important;background-color:#ba0c2f!important}.ng-valid.ng-submitted .mat-mdc-checkbox.mat-accent.mat-mdc-checkbox-checked.ng-dirty.ng-valid.ng-touched .mdc-checkbox:hover .mdc-checkbox__ripple{background-color:#b3261e!important;opacity:.08!important}.ng-valid.ng-submitted .mat-mdc-checkbox.mat-accent.mat-mdc-checkbox-checked.ng-dirty.ng-valid.ng-touched .mdc-checkbox:focus .mdc-checkbox__ripple{background-color:#b3261e!important;opacity:.12!important}.ng-valid.ng-submitted .mat-mdc-checkbox.mat-accent.mat-mdc-checkbox-checked.ng-dirty.ng-valid.ng-touched .mdc-checkbox__ripple{background-color:#b3261e}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "ngmodule", type: MatListModule }, { kind: "component", type: i3$1.MatList, selector: "mat-list", exportAs: ["matList"] }, { kind: "ngmodule", type: MatButtonModule }, { kind: "ngmodule", type: MatInputModule }, { kind: "directive", type: i4.MatLabel, selector: "mat-label" }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "ngmodule", type: MatFormFieldModule }, { kind: "component", type: FormErrorComponent, selector: "ieeesa-form-error", inputs: ["formGroup", "config", "submitResponse"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i3.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i3.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "ngmodule", type: MatCheckboxModule }, { kind: "component", type: i6.MatCheckbox, selector: "mat-checkbox", inputs: ["disableRipple", "color", "tabIndex"], exportAs: ["matCheckbox"] }], encapsulation: i0.ViewEncapsulation.None }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.3", ngImport: i0, type: DynamicFormComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.3", ngImport: i0, type: CheckboxComponent, decorators: [{
             type: Component,
-            args: [{ exportAs: 'dynamicForm', selector: 'ieeesa-dynamic-form', standalone: true, imports: [
+            args: [{ selector: 'ieeesa-checkbox', standalone: true, imports: [
                         CommonModule,
-                        ReactiveFormsModule,
-                        DynamicFormFieldDirective$1,
+                        MatListModule,
                         MatButtonModule,
-                    ], template: "<form\r\n  class=\"ieeesa-dynamic-form\"\r\n  [formGroup]=\"form\"\r\n  (change)=\"onFormChange()\"\r\n  (ngSubmit)=\"onFormSubmit()\"\r\n  (input)=\"formInputChange($event)\"\r\n>\r\n  <fieldset\r\n    class=\"ieeesa-dynamic-form__fieldset p-2\"\r\n    *ngFor=\"\r\n      let formGrp of formGroupArray;\r\n      let i = index;\r\n      trackBy: trackByFormGroup\r\n    \"\r\n  >\r\n    <legend class=\"float-none w-auto p-2\" *ngIf=\"isLegendVisible\">\r\n      {{ legendsArray[i] }}:\r\n    </legend>\r\n    <div class=\"row\">\r\n      <div\r\n        class=\"col-{{ colWidth.xs }} col-sm-{{ colWidth.sm }} col-md-{{\r\n          colWidth.md\r\n        }} col-lg-{{ colWidth.lg }} col-xl-{{ colWidth.xl }}\r\n        ieeesa-dynamic-form__form-field\"\r\n        [ngClass]=\"getRowClassName(formControlArray[i][j].controlName)\"\r\n        *ngFor=\"let control of formControlArray[i]; let j = index\"\r\n      >\r\n        <ng-template\r\n          ieeesaDynamicFormField\r\n          [config]=\"formControlArray[i][j]\"\r\n          [group]=\"formGrp\"\r\n          [submitResponse]=\"submitResponse\"\r\n          [searchResponse]=\"searchResponse\"\r\n          (formSearchApply)=\"onSearchApply($event)\"\r\n          (formDropdownSelected)=\"onFormChange(); onDropdownChange()\"\r\n          (formDateSelected)=\"onDateSelected($event)\"\r\n          (formSelectedDateRange)=\"onSelectedDateRange($event)\"\r\n          (formSelectSearch)=\"onSelectSearch($event)\"\r\n          (formAutoCompleteSearch)=\"onAutoCompleteSearch($event)\"\r\n          (autoCompleteOptionSelected)=\"onAutoCompleteOptionSelected()\"\r\n        >\r\n        </ng-template>\r\n      </div>\r\n    </div>\r\n  </fieldset>\r\n  <div class=\"row\">\r\n    <div class=\"col-12 ieeesa-dynamic-form__actions\">\r\n      <button\r\n        type=\"submit\"\r\n        mat-button\r\n        class=\"mat-primary-button ieeesa-dynamic-form__actions--right-btn\"\r\n        [disabled]=\"isSubmitButtonDisabled\"\r\n      >\r\n        {{ rightButtonLabel }}\r\n      </button>\r\n      <button\r\n        *ngIf=\"isLeftButtonNeeded\"\r\n        type=\"button\"\r\n        mat-button\r\n        class=\"mat-secondary-button ieeesa-dynamic-form__actions--left-btn\"\r\n        (click)=\"onLeftButtonClicked()\"\r\n        [disabled]=\"isLeftButtonDisabled\"\r\n      >\r\n        {{ leftButtonLabel }}\r\n      </button>\r\n    </div>\r\n  </div>\r\n</form>\r\n", styles: [".ieeesa-subtitle{text-align:left;font-family:Calibri Regular;font-size:1.56em;letter-spacing:0;color:#000;opacity:1}.ieeesa-body{text-align:left;font-family:Calibri Regular;font-size:1.25em;letter-spacing:0;color:#000;opacity:1}.ieeesa-display-lg-57{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:3.5625em;line-height:64px;color:#000;letter-spacing:0}.ieeesa-display-md-47{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:2.9375em;line-height:52px;color:#000;letter-spacing:0}.ieeesa-display-sm-38{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:2.375em;line-height:44px;color:#000;letter-spacing:0}.ieeesa-headline-lg-34{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:2.125em;line-height:40px;color:#000;letter-spacing:0}.ieeesa-headline-md-30{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1.875em;line-height:36px;color:#000;letter-spacing:0}.ieeesa-headline-sm-26{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1.625em;line-height:32px;color:#000;letter-spacing:0}.ieeesa-title-lg-bold-24{font-family:Calibri Regular;font-style:normal;font-weight:700;font-size:1.5em;line-height:28px;color:#000;letter-spacing:0}.ieeesa-title-lg-24{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1.5em;line-height:28px;color:#000;letter-spacing:0}.ieeesa-title-md-18{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1.125em;line-height:24px;color:#000;letter-spacing:.009375em}.ieeesa-title-sm-16{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1em;line-height:20px;color:#000;letter-spacing:.00625em}.ieeesa-label-lg-bold-16{font-family:Calibri Regular;font-style:normal;font-weight:700;font-size:1em;line-height:20px;color:#000;letter-spacing:.00625em}.ieeesa-label-lg-16{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1em;line-height:20px;color:#000;letter-spacing:.00625em}.ieeesa-label-md-14{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:.875em;line-height:16px;color:#000;letter-spacing:.03125em}.ieeesa-label-sm-13{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:.8125em;line-height:16px;color:#000;letter-spacing:.03125em}.ieeesa-body-lg-bold-18{font-family:Calibri Regular;font-style:normal;font-weight:700;font-size:1.125em;line-height:24px;color:#000;letter-spacing:.03125em}.ieeesa-body-lg-18{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1.125em;line-height:24px;color:#000;letter-spacing:.03125em}.ieeesa-body-md-16{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1em;line-height:20px;color:#000;letter-spacing:.015625em}.ieeesa-body-sm-14{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:.875em;line-height:16px;color:#000;letter-spacing:.025em}.ieeesa-title-inter-lg-bold-24{font-family:Inter Bold;font-style:normal;font-weight:700;font-size:1.5em;line-height:29px;color:#000;letter-spacing:0}.mat-mdc-button.mat-mdc-button-base.mat-primary-button,.mat-mdc-button.mat-mdc-button-base.mat-secondary-button{min-width:103px;width:auto;min-height:40px;height:auto;border-radius:3px;text-align:center;padding:.625em 1.5em;border:none;font-family:Calibri Regular;font-style:normal;font-weight:700;font-size:1em;line-height:20px;color:#000;letter-spacing:.00625em}.mat-mdc-button.mat-mdc-button-base>.mat-icon{margin-right:11px}.mat-mdc-button.mat-mdc-button-base.mat-primary-button{background-color:#00629b;color:#fff}.mat-mdc-button.mat-mdc-button-base.mat-primary-button:hover{background-color:#003e65}.mat-mdc-button.mat-mdc-button-base.mat-primary-button:active{background-color:#00629b}.mat-mdc-button.mat-mdc-button-base.mat-primary-button:disabled{background-color:#1c1b1f1f}.mat-mdc-button.mat-mdc-button-base.mat-secondary-button{color:#fff;background:#a7a8aa;box-shadow:0 1px 2px #0000004d,0 2px 6px 2px #00000026}.mat-mdc-button.mat-mdc-button-base.mat-secondary-button:hover{background:#a7a8aa}.mat-mdc-button.mat-mdc-button-base.mat-secondary-button:active{background:rgba(29,25,43,.12)}.mat-mdc-button.mat-mdc-button-base.mat-secondary-button:disabled{background:rgba(28,27,31,.12);color:#1c1b1f;opacity:.38}.ieeesa-text-button{color:#cac4d0;background:none;border:none}.flex-align-center{display:flex;align-items:center;justify-content:center}.mat-button-toggle-checked{background-color:#a7a8aa}.mat-button-toggle-checked .mat-button-toggle-label-content:before{font-family:\"Font Awesome 5 Free\";font-weight:900;content:\"\\f00c\";padding-right:.5625em}.mat-button-toggle-group .mat-button-toggle-label-content{font-family:Calibri Regular;font-style:normal;font-weight:700;font-size:1em;line-height:20px;color:#1c1b1f;letter-spacing:.00625em}@media (max-width: 768px){.mat-button-toggle-group .mat-button-toggle-label-content{max-width:8ch;text-overflow:ellipsis;white-space:nowrap;overflow:hidden;position:relative}}.cdk-overlay-pane{width:100%;min-width:312px}.ieeesa-dynamic-form__actions{display:flex;flex-direction:row-reverse;padding-top:15px}.ieeesa-dynamic-form__actions--left-btn{margin-right:2%}.ieeesa-dynamic-form__form-field{padding-top:20px}\n"] }]
-        }], ctorParameters: function () { return [{ type: i3.FormBuilder }]; }, propDecorators: { formFields: [{
-                type: ViewChildren,
-                args: [DynamicFormFieldDirective$1]
-            }], formGroups: [{
-                type: Input
-            }], submitResponse: [{
-                type: Input
-            }], searchResponse: [{
-                type: Input
-            }], colWidth: [{
-                type: Input
-            }], isLegendVisible: [{
-                type: Input
-            }], rightButtonLabel: [{
-                type: Input
-            }], leftButtonLabel: [{
-                type: Input
-            }], isSubmitButtonDisabled: [{
+                        MatInputModule,
+                        FormsModule,
+                        MatFormFieldModule,
+                        FormErrorComponent,
+                        ReactiveFormsModule,
+                        MatCheckboxModule,
+                    ], encapsulation: ViewEncapsulation.None, template: "<div\r\n  [formGroup]=\"group\"\r\n  class=\"ieeesa-checkbox-field\"\r\n  *ngIf=\"group\"\r\n  [ngClass]=\"\r\n    config.isLabelAlignedLeft\r\n      ? 'ieeesa-checkbox-field__label-left'\r\n      : 'ieeesa-checkbox-field__label-top'\r\n  \"\r\n>\r\n  <mat-label class=\"ieeesa-body-sm-14 ieeesa-checkbox-field__label\">{{\r\n    config.label\r\n  }}</mat-label>\r\n  <mat-list>\r\n    <mat-checkbox\r\n      *ngFor=\"let option of checkboxes; trackBy: trackById\"\r\n      [formControlName]=\"option.id\"\r\n      (change)=\"onChange(option, true)\"\r\n      [disabled]=\"option.disabled\"\r\n      [checked]=\"option.checked\"\r\n    >\r\n      {{ option.name }}\r\n    </mat-checkbox>\r\n  </mat-list>\r\n  <ieeesa-form-error [formGroup]=\"group\" [config]=\"config\"> </ieeesa-form-error>\r\n</div>\r\n", styles: [".ieeesa-subtitle{text-align:left;font-family:Calibri Regular;font-size:1.56em;letter-spacing:0;color:#000;opacity:1}.ieeesa-body{text-align:left;font-family:Calibri Regular;font-size:1.25em;letter-spacing:0;color:#000;opacity:1}.ieeesa-display-lg-57{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:3.5625em;line-height:64px;color:#000;letter-spacing:0}.ieeesa-display-md-47{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:2.9375em;line-height:52px;color:#000;letter-spacing:0}.ieeesa-display-sm-38{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:2.375em;line-height:44px;color:#000;letter-spacing:0}.ieeesa-headline-lg-34{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:2.125em;line-height:40px;color:#000;letter-spacing:0}.ieeesa-headline-md-30{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1.875em;line-height:36px;color:#000;letter-spacing:0}.ieeesa-headline-sm-26{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1.625em;line-height:32px;color:#000;letter-spacing:0}.ieeesa-title-lg-bold-24{font-family:Calibri Regular;font-style:normal;font-weight:700;font-size:1.5em;line-height:28px;color:#000;letter-spacing:0}.ieeesa-title-lg-24{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1.5em;line-height:28px;color:#000;letter-spacing:0}.ieeesa-title-md-18{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1.125em;line-height:24px;color:#000;letter-spacing:.009375em}.ieeesa-title-sm-16{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1em;line-height:20px;color:#000;letter-spacing:.00625em}.ieeesa-label-lg-bold-16{font-family:Calibri Regular;font-style:normal;font-weight:700;font-size:1em;line-height:20px;color:#000;letter-spacing:.00625em}.ieeesa-label-lg-16{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1em;line-height:20px;color:#000;letter-spacing:.00625em}.ieeesa-label-md-14{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:.875em;line-height:16px;color:#000;letter-spacing:.03125em}.ieeesa-label-sm-13{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:.8125em;line-height:16px;color:#000;letter-spacing:.03125em}.ieeesa-body-lg-bold-18{font-family:Calibri Regular;font-style:normal;font-weight:700;font-size:1.125em;line-height:24px;color:#000;letter-spacing:.03125em}.ieeesa-body-lg-18{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1.125em;line-height:24px;color:#000;letter-spacing:.03125em}.ieeesa-body-md-16{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1em;line-height:20px;color:#000;letter-spacing:.015625em}.ieeesa-body-sm-14{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:.875em;line-height:16px;color:#000;letter-spacing:.025em}.ieeesa-title-inter-lg-bold-24{font-family:Inter Bold;font-style:normal;font-weight:700;font-size:1.5em;line-height:29px;color:#000;letter-spacing:0}.mat-mdc-button.mat-mdc-button-base.mat-primary-button,.mat-mdc-button.mat-mdc-button-base.mat-secondary-button{min-width:103px;width:auto;min-height:40px;height:auto;border-radius:3px;text-align:center;padding:.625em 1.5em;border:none;font-family:Calibri Regular;font-style:normal;font-weight:700;font-size:1em;line-height:20px;color:#000;letter-spacing:.00625em}.mat-mdc-button.mat-mdc-button-base>.mat-icon{margin-right:11px}.mat-mdc-button.mat-mdc-button-base.mat-primary-button{background-color:#00629b;color:#fff}.mat-mdc-button.mat-mdc-button-base.mat-primary-button:hover{background-color:#003e65}.mat-mdc-button.mat-mdc-button-base.mat-primary-button:active{background-color:#00629b}.mat-mdc-button.mat-mdc-button-base.mat-primary-button:disabled{background-color:#1c1b1f1f}.mat-mdc-button.mat-mdc-button-base.mat-secondary-button{color:#fff;background:#a7a8aa;box-shadow:0 1px 2px #0000004d,0 2px 6px 2px #00000026}.mat-mdc-button.mat-mdc-button-base.mat-secondary-button:hover{background:#a7a8aa}.mat-mdc-button.mat-mdc-button-base.mat-secondary-button:active{background:rgba(29,25,43,.12)}.mat-mdc-button.mat-mdc-button-base.mat-secondary-button:disabled{background:rgba(28,27,31,.12);color:#1c1b1f;opacity:.38}.ieeesa-text-button{color:#cac4d0;background:none;border:none}.flex-align-center{display:flex;align-items:center;justify-content:center}.mat-button-toggle-checked{background-color:#a7a8aa}.mat-button-toggle-checked .mat-button-toggle-label-content:before{font-family:\"Font Awesome 5 Free\";font-weight:900;content:\"\\f00c\";padding-right:.5625em}.mat-button-toggle-group .mat-button-toggle-label-content{font-family:Calibri Regular;font-style:normal;font-weight:700;font-size:1em;line-height:20px;color:#1c1b1f;letter-spacing:.00625em}@media (max-width: 768px){.mat-button-toggle-group .mat-button-toggle-label-content{max-width:8ch;text-overflow:ellipsis;white-space:nowrap;overflow:hidden;position:relative}}.cdk-overlay-pane{width:100%;min-width:312px}.ieeesa-checkbox-field__label-left{display:flex;align-items:center}.ieeesa-checkbox-field__label-top{display:block}.ieeesa-checkbox-field .mat-mdc-list{display:flex;list-style-type:none}.ieeesa-checkbox-field .mat-mdc-checkbox .mat-mdc-checkbox-touch-target{height:40px;width:40px}.ieeesa-checkbox-field .mat-mdc-checkbox .mdc-checkbox:hover .mdc-checkbox__native-control:not([disabled])~.mdc-checkbox__ripple{background-color:#1c1b1f!important;opacity:.08!important}.ieeesa-checkbox-field .mat-mdc-checkbox .mdc-checkbox .mdc-checkbox__native-control:enabled:not(:checked):not(:indeterminate):not([data-indeterminate=true])~.mdc-checkbox__background{border-color:#49454f!important;background-color:transparent!important}.ieeesa-checkbox-field .mat-mdc-checkbox .mdc-checkbox:hover .mdc-checkbox__native-control:enabled:not(:checked):not(:indeterminate):not([data-indeterminate=true])~.mdc-checkbox__background{border-color:#1c1b1f!important;background-color:transparent!important}.ieeesa-checkbox-field .mat-mdc-checkbox .mdc-checkbox__native-control:focus:enabled:not(:checked):not(:indeterminate):not([data-indeterminate=true])~.mdc-checkbox__background{border-color:#1c1b1f!important;background-color:transparent!important}.ieeesa-checkbox-field .mat-mdc-checkbox.mat-accent.mat-mdc-checkbox-checked .mdc-checkbox__background{border-color:#00b5e2!important;background-color:#00b5e2!important}.ieeesa-checkbox-field .mat-mdc-checkbox.mat-accent.mat-mdc-checkbox-checked .mdc-checkbox:hover .mdc-checkbox__ripple{background-color:#6750a4!important;opacity:.08!important}.ieeesa-checkbox-field .mat-mdc-checkbox.mat-accent.mat-mdc-checkbox-checked .mdc-checkbox:focus .mdc-checkbox__ripple{background-color:#6750a4}.ieeesa-checkbox-field .mat-mdc-checkbox.mat-accent.mat-mdc-checkbox-checked .mat-mdc-checkbox-ripple:not(:empty){background-color:#6750a4!important;opacity:.12!important}.ieeesa-checkbox-field .mat-mdc-checkbox.mat-accent.mat-mdc-checkbox-checked .mdc-checkbox__ripple{background-color:#6750a4}.ieeesa-checkbox-field .mat-mdc-checkbox .mdc-checkbox .mdc-checkbox__native-control:enabled:indeterminate~.mdc-checkbox__background{border-color:#00b5e2!important;background-color:#00b5e2!important}.ieeesa-checkbox-field .mat-mdc-checkbox .mdc-checkbox:hover .mdc-checkbox__native-control[data-indeterminate=true]:enabled~.mdc-checkbox__background{border-color:#00b5e2!important;background-color:#00b5e2!important}.ieeesa-checkbox-field .mat-mdc-checkbox .mdc-checkbox .mdc-checkbox__native-control[disabled]:checked~.mdc-checkbox__background{border-color:#1c1b1f!important;background-color:#1c1b1f!important}.ieeesa-checkbox-field .mat-mdc-checkbox .mdc-checkbox .mdc-checkbox__native-control[disabled]:not(:checked):not(:indeterminate):not([data-indeterminate=true])~.mdc-checkbox__background{border-color:#1c1b1f!important;background-color:transparent!important}.ieeesa-checkbox-field .mat-mdc-checkbox .mdc-checkbox .mdc-checkbox__native-control[disabled]:indeterminate~.mdc-checkbox__background{border-color:#1c1b1f!important;background-color:#1c1b1f!important}.ng-valid.ng-submitted .mat-mdc-checkbox.checkbox.mat-accent.ng-pristine.ng-invalid.ng-touched .mdc-checkbox:hover .mdc-checkbox__ripple,.ng-valid.ng-submitted .mat-mdc-checkbox.checkbox.mat-accent.ng-pristine.ng-invalid.ng-untouched .mdc-checkbox:hover .mdc-checkbox__ripple,.ng-valid.ng-submitted .mat-mdc-checkbox.checkbox.mat-accent.ng-dirty.ng-invalid.ng-touched .mdc-checkbox:hover .mdc-checkbox__ripple{background-color:#b3261e!important;opacity:.08!important}.ng-valid.ng-submitted .mat-mdc-checkbox.checkbox.mat-accent.ng-pristine.ng-invalid.ng-touched .mdc-checkbox:focus .mdc-checkbox__ripple,.ng-valid.ng-submitted .mat-mdc-checkbox.checkbox.mat-accent.ng-pristine.ng-invalid.ng-untouched .mdc-checkbox:focus .mdc-checkbox__ripple,.ng-valid.ng-submitted .mat-mdc-checkbox.checkbox.mat-accent.ng-dirty.ng-invalid.ng-touched .mdc-checkbox:focus .mdc-checkbox__ripple{background-color:#b3261e!important;opacity:.12!important}.ng-valid.ng-submitted .mat-mdc-checkbox.checkbox.mat-accent.ng-pristine.ng-invalid.ng-touched .mdc-checkbox__ripple,.ng-valid.ng-submitted .mat-mdc-checkbox.checkbox.mat-accent.ng-pristine.ng-invalid.ng-untouched .mdc-checkbox__ripple,.ng-valid.ng-submitted .mat-mdc-checkbox.checkbox.mat-accent.ng-dirty.ng-invalid.ng-touched .mdc-checkbox__ripple{background-color:#b3261e}.ng-valid.ng-submitted .mat-mdc-checkbox.checkbox.mat-accent.ng-pristine.ng-invalid.ng-touched .mdc-checkbox__background,.ng-valid.ng-submitted .mat-mdc-checkbox.checkbox.mat-accent.ng-pristine.ng-invalid.ng-untouched .mdc-checkbox__background,.ng-valid.ng-submitted .mat-mdc-checkbox.checkbox.mat-accent.ng-dirty.ng-invalid.ng-touched .mdc-checkbox__background{border-color:#ba0c2f!important;background-color:transparent!important}.ng-valid.ng-submitted .mat-mdc-checkbox.mat-accent.mat-mdc-checkbox-checked.ng-dirty.ng-valid.ng-touched .mdc-checkbox__background{border-color:#ba0c2f!important;background-color:#ba0c2f!important}.ng-valid.ng-submitted .mat-mdc-checkbox.mat-accent.mat-mdc-checkbox-checked.ng-dirty.ng-valid.ng-touched .mdc-checkbox:hover .mdc-checkbox__ripple{background-color:#b3261e!important;opacity:.08!important}.ng-valid.ng-submitted .mat-mdc-checkbox.mat-accent.mat-mdc-checkbox-checked.ng-dirty.ng-valid.ng-touched .mdc-checkbox:focus .mdc-checkbox__ripple{background-color:#b3261e!important;opacity:.12!important}.ng-valid.ng-submitted .mat-mdc-checkbox.mat-accent.mat-mdc-checkbox-checked.ng-dirty.ng-valid.ng-touched .mdc-checkbox__ripple{background-color:#b3261e}\n"] }]
+        }], ctorParameters: function () { return [{ type: FormUtilityService }]; }, propDecorators: { checkboxes: [{
                 type: Input
-            }], isLeftButtonDisabled: [{
-                type: Input
-            }], isLeftButtonNeeded: [{
-                type: Input
-            }], formSubmit: [{
-                type: Output
-            }], formChange: [{
-                type: Output
-            }], formInput: [{
-                type: Output
-            }], formLeftButtonClicked: [{
-                type: Output
-            }], formSearchApply: [{
-                type: Output
-            }], formGroupsReference: [{
-                type: Output
-            }], dropdownChange: [{
-                type: Output
-            }], formDateSelected: [{
-                type: Output
-            }], formSelectSearch: [{
-                type: Output
-            }], formControlChange: [{
-                type: Output
-            }], formAutoCompleteSearch: [{
-                type: Output
-            }], autoCompleteOptionSelected: [{
-                type: Output
-            }], formAfterContentInit: [{
-                type: Output
-            }], formSelectedDateRange: [{
+            }], checkboxSelection: [{
                 type: Output
             }] } });
 
-const components = {
-    [FormControlType$1.INPUT]: InputComponent$1,
-    [FormControlType$1.TEXT_AREA]: TextAreaComponent$1,
-    [FormControlType$1.SELECT]: SelectComponent$1,
-    [FormControlType$1.SEARCH]: SearchComponent$1,
-    [FormControlType$1.DATE]: DatePickerComponent$1,
-    [FormControlType$1.CHECKBOX]: CheckboxComponent$1,
-    [FormControlType$1.RADIO]: RadioComponent$1,
-    [FormControlType$1.AUTO_COMPLETE]: AutocompleteComponent$1,
-};
+const moment$1 = moment_;
 /**
- * Provides the implementation of DynamicFormFieldDirective which hosts and creates the form fields components dynamically.
+ * Provides implementation of date picker custom header and being used in date-picker component.
  * @export
- * @class DynamicFormFieldDirective
- * @implements {FormField}
+ * @class DatePickerHeaderComponent
  * @implements {OnInit}
  * @implements {OnDestroy}
  */
-class DynamicFormFieldDirective {
+class DatePickerHeaderComponent {
+    constructor(
+    // eslint-disable-next-line no-unused-vars
+    calendar, 
+    // eslint-disable-next-line no-unused-vars
+    dateAdapter, 
+    // eslint-disable-next-line no-unused-vars
+    dateFormats, 
+    // eslint-disable-next-line no-unused-vars
+    datepickerService // eslint-disable-next-line no-empty-function
+    ) {
+        this.calendar = calendar;
+        this.dateAdapter = dateAdapter;
+        this.dateFormats = dateFormats;
+        this.datepickerService = datepickerService;
+        this.destroy$ = new Subject();
+        this.arrowDirection = false;
+        this.isRangeSelection = false;
+        // eslint-disable-next-line @typescript-eslint/no-explicit-any
+        this.datePickerInfo = datePickerInfo;
+    }
     /**
-     * Sets the form field configuration
-     * @memberof DynamicFormFieldDirective
+     * Implementation of ngOnInit lifecycle hook method to initialize components instance properties.
+     * @memberof DatePickerHeaderComponent
      */
-    set config(value) {
-        this._config = value;
-        if (this.component) {
-            this.loadComponent();
+    ngOnInit() {
+        this.isRangeSelection = this.datepickerService.getCalendarType();
+        const selectedRange = this.datepickerService.getSelectedRange();
+        if (selectedRange) {
+            this.setRange(selectedRange);
         }
-    }
-    get config() {
-        return this._config;
+        this.datepickerService.range$
+            ?.pipe(takeUntil(this.destroy$))
+            .subscribe((range) => {
+            this.setRange(range);
+        });
+        this.selectedDate = this.datepickerService.selectedDate
+            ? moment$1(this.datepickerService.selectedDate).format(DateFormats$1.display.daysFormat) +
+                ', ' +
+                moment$1(this.datepickerService.selectedDate).date() +
+                ' ' +
+                moment$1(this.datepickerService.selectedDate).format(DateFormats$1.display.fullMonthLabel)
+            : '';
     }
     /**
-     * Sets the form group
-     * @memberof DynamicFormFieldDirective
+     * Sets the min and max date range.
+     * @param {({ start: Date | string; end: Date | string })} range
+     * @memberof DatePickerHeaderComponent
      */
-    set group(value) {
-        if (this.component?.instance) {
-            this.component.instance.group = value;
-        }
-        this._group = value;
-    }
-    get group() {
-        return this._group;
+    setRange(range) {
+        this.range = {
+            start: moment$1(range.start).date() +
+                ' ' +
+                moment$1(range.start).format(DateFormats$1.display.fullMonthLabel),
+            end: moment$1(range.end).date() +
+                ' ' +
+                moment$1(range.end).format(DateFormats$1.display.fullMonthLabel),
+        };
     }
     /**
-     * Sets the submit response of form submit event
-     * @memberof DynamicFormFieldDirective
+     * Implementation of getMonthLabel method to get the month label.
+     * @readonly
+     * @return {string}
+     * @memberof DatePickerHeaderComponent
      */
-    set submitResponse(value) {
-        if (this.component?.instance) {
-            this.component.instance.submitResponse = value;
+    get getMonthLabel() {
+        if (this.dateAdapter?.format) {
+            return this.dateAdapter.format(this.calendar.activeDate, this.dateFormats.display.monthYearA11yLabel);
         }
-        this._submitResponse = value;
-    }
-    // eslint-disable-next-line @typescript-eslint/no-explicit-any
-    get submitResponse() {
-        return this._submitResponse;
+        return '';
     }
     /**
-     * Sets the form search response of form search apply.
-     * @memberof DynamicFormFieldDirective
+     * Sets previous month in a calendar on click of previous month arrow in date picker.
+     * @param {('month' | 'year')} mode
+     * @memberof DatePickerHeaderComponent
      */
-    set searchResponse(value) {
-        if (this.component?.instance) {
-            this.component.instance.searchResponse = value;
-        }
-        this._searchResponse = value;
-    }
-    // eslint-disable-next-line @typescript-eslint/no-explicit-any
-    get searchResponse() {
-        return this._searchResponse;
-    }
-    // eslint-disable-next-line no-unused-vars, no-empty-function
-    constructor(container) {
-        this.container = container;
-        this.destroy$ = new Subject();
-        this.formSearchApply = new EventEmitter();
-        this.formDropdownSelected = new EventEmitter();
-        this.formDateSelected = new EventEmitter();
-        this.formSelectedDateRange = new EventEmitter();
-        this.formSelectSearch = new EventEmitter();
-        this.formAutoCompleteSearch = new EventEmitter();
-        this.autoCompleteOptionSelected = new EventEmitter();
+    setPreviousMonth(mode) {
+        this.calendar.activeDate =
+            mode === 'month'
+                ? this.dateAdapter.addCalendarMonths(this.calendar.activeDate, -1)
+                : this.dateAdapter.addCalendarYears(this.calendar.activeDate, -1);
     }
     /**
-     * Implementation of ngOnInit lifecycle hook method to call loadComponents method.
-     * @memberof DynamicFormFieldDirective
+     * Sets next month in a calendar on click of previous month arrow in date picker.
+     * @param {('month' | 'year')} mode
+     * @memberof DatePickerHeaderComponent
      */
-    ngOnInit() {
-        this.loadComponent();
+    setNextMonth(mode) {
+        this.calendar.activeDate =
+            mode === 'month'
+                ? this.dateAdapter.addCalendarMonths(this.calendar.activeDate, 1)
+                : this.dateAdapter.addCalendarYears(this.calendar.activeDate, 1);
     }
     /**
-     * Creates the component dynamically and initializes the instance properties of created component, also handles the created component events.
-     * @memberof DynamicFormFieldDirective
+     * Sets the calendar current view on the open of year drop down in date picker.
+     * @memberof DatePickerHeaderComponent
      */
-    loadComponent() {
-        if (!components[this.config?.type]) {
-            const supportedTypes = Object.keys(components).join(', ');
-            throw new Error(`Trying to use an unsupported type (${this.config.type}).
-            Supported types: ${supportedTypes}`);
-        }
-        this.component = this.container.createComponent(components[this.config?.type]);
-        if (this.component?.instance) {
-            this.component.instance.config = this.config;
-            this.component.instance.group = this.group;
-            this.component.instance.submitResponse = this.submitResponse;
-            this.component.instance.searchResponse = this.searchResponse;
-            if (this.config.type === FormControlType$1.SEARCH) {
-                this.component.instance.searchValue
-                    ?.pipe(takeUntil(this.destroy$))
-                    ?.subscribe((event) => {
-                    this.formSearchApply.emit(event);
-                });
-            }
-            else if (this.config.type === FormControlType$1.SELECT) {
-                this.component.instance.optionSelected
-                    ?.pipe(takeUntil(this.destroy$))
-                    ?.subscribe((event) => {
-                    this.formDropdownSelected.emit(event);
-                });
-                this.component.instance.optionSearched
-                    ?.pipe(takeUntil(this.destroy$))
-                    ?.subscribe((event) => {
-                    this.formSelectSearch.emit({
-                        searchEvent: event,
-                        controlName: this.config.controlName,
-                    });
-                });
-            }
-            else if (this.config.type === FormControlType$1.DATE) {
-                this.component.instance.selectedDate
-                    ?.pipe(takeUntil(this.destroy$))
-                    ?.subscribe((event) => {
-                    this.formDateSelected.emit(event);
-                });
-                this.component.instance.selectedDateRange
-                    ?.pipe(takeUntil(this.destroy$))
-                    ?.subscribe((event) => {
-                    this.formSelectedDateRange.emit(event);
-                });
-            }
-            else if (this.config.type === FormControlType$1.AUTO_COMPLETE) {
-                this.component.instance.autoCompleteSearchValue
-                    ?.pipe(takeUntil(this.destroy$))
-                    ?.subscribe((event) => {
-                    this.formAutoCompleteSearch.emit(event);
-                });
-                this.component.instance.autoCompleteOptionSelected
-                    ?.pipe(takeUntil(this.destroy$))
-                    ?.subscribe((event) => {
-                    this.autoCompleteOptionSelected.emit(event);
-                });
-            }
-        }
+    setCalendarView() {
+        this.calendar.currentView =
+            this.calendar.currentView === 'month' ? 'multi-year' : 'month';
+        this.arrowDirection = !this.arrowDirection;
     }
     /**
      * Implementation of ngOnDestroy lifecycle hook method to unsubscribe the open observable subscriptions.
-     * @memberof DynamicFormFieldDirective
+     * @memberof DatePickerHeaderComponent
      */
     ngOnDestroy() {
         this.destroy$.next(true);
         this.destroy$.unsubscribe();
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.3", ngImport: i0, type: DynamicFormFieldDirective, deps: [{ token: i0.ViewContainerRef }], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.1.3", type: DynamicFormFieldDirective, isStandalone: true, selector: "[ieeesaDynamicFormField]", inputs: { config: "config", group: "group", submitResponse: "submitResponse", searchResponse: "searchResponse" }, outputs: { formSearchApply: "formSearchApply", formDropdownSelected: "formDropdownSelected", formDateSelected: "formDateSelected", formSelectedDateRange: "formSelectedDateRange", formSelectSearch: "formSelectSearch", formAutoCompleteSearch: "formAutoCompleteSearch", autoCompleteOptionSelected: "autoCompleteOptionSelected" }, ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.3", ngImport: i0, type: DatePickerHeaderComponent, deps: [{ token: i7.MatCalendar }, { token: i2$1.DateAdapter }, { token: MAT_DATE_FORMATS }, { token: i3$2.DatepickerService }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.3", type: DatePickerHeaderComponent, isStandalone: true, selector: "ieeesa-date-picker-header", inputs: { group: "group" }, ngImport: i0, template: "<div class=\"ieeesa-datepicker-header--selected-date-container\">\r\n  <p class=\"ieeesa-label-lg-bold-16 ieeesa-datepicker-header__select-date-label\">\r\n    {{ datePickerInfo.datePicker.selectDateLabel }}\r\n  </p>\r\n  <p\r\n    class=\"headline-lg-34 ieeesa-datepicker-header__selected-date\"\r\n    *ngIf=\"range || isRangeSelection\"\r\n  >\r\n    {{ range.start }} - {{ range.end }}\r\n  </p>\r\n  <p\r\n    class=\"headline-lg-34 ieeesa-datepicker-header__selected-date\"\r\n    *ngIf=\"!isRangeSelection\"\r\n  >\r\n    {{ selectedDate }}\r\n  </p>\r\n</div>\r\n<div class=\"ieeesa-datepicker-header--content\">\r\n  <button\r\n    mat-button\r\n    type=\"button\"\r\n    class=\"ieeesa-datepicker-header--content--period-button ieeesa-label-lg-16\"\r\n    (click)=\"setCalendarView()\"\r\n    [attr.aria-label]=\"getMonthLabel\"\r\n    cdkAriaLive=\"polite\"\r\n  >\r\n    {{ getMonthLabel }}\r\n    <mat-icon\r\n      class=\"ieeesa-datepicker-header--content--period-button--arrow-icon\"\r\n      *ngIf=\"!arrowDirection\"\r\n      >arrow_drop_down</mat-icon\r\n    >\r\n    <mat-icon\r\n      class=\"ieeesa-datepicker-header--content--period-button--arrow-icon\"\r\n      *ngIf=\"arrowDirection\"\r\n      >arrow_drop_up</mat-icon\r\n    >\r\n  </button>\r\n  <button\r\n    mat-button\r\n    type=\"button\"\r\n    class=\"ieeesa-label-lg-16 ieeesa-datepicker-header--content--arrow-left-btn\"\r\n    [attr.aria-label]=\"datePickerInfo.ariaLabel.previousMonth\"\r\n    cdkAriaLive=\"polite\"\r\n  >\r\n    <mat-icon\r\n      (click)=\"setPreviousMonth('month')\"\r\n      class=\"ieeesa-datepicker-header__arrow-left\"\r\n      >keyboard_arrow_left</mat-icon\r\n    >\r\n  </button>\r\n  <button\r\n    mat-button\r\n    type=\"button\"\r\n    class=\"ieeesa-label-lg-16 ieeesa-datepicker-header--content--arrow-right-btn\"\r\n    [attr.aria-label]=\"datePickerInfo.ariaLabel.nextMonth\"\r\n    cdkAriaLive=\"polite\"\r\n  >\r\n    <mat-icon (click)=\"setNextMonth('month')\"> keyboard_arrow_right</mat-icon>\r\n  </button>\r\n</div>\r\n", styles: [".ieeesa-subtitle{text-align:left;font-family:Calibri Regular;font-size:1.56em;letter-spacing:0;color:#000;opacity:1}.ieeesa-body{text-align:left;font-family:Calibri Regular;font-size:1.25em;letter-spacing:0;color:#000;opacity:1}.ieeesa-display-lg-57{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:3.5625em;line-height:64px;color:#000;letter-spacing:0}.ieeesa-display-md-47{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:2.9375em;line-height:52px;color:#000;letter-spacing:0}.ieeesa-display-sm-38{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:2.375em;line-height:44px;color:#000;letter-spacing:0}.ieeesa-headline-lg-34{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:2.125em;line-height:40px;color:#000;letter-spacing:0}.ieeesa-headline-md-30{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1.875em;line-height:36px;color:#000;letter-spacing:0}.ieeesa-headline-sm-26{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1.625em;line-height:32px;color:#000;letter-spacing:0}.ieeesa-title-lg-bold-24{font-family:Calibri Regular;font-style:normal;font-weight:700;font-size:1.5em;line-height:28px;color:#000;letter-spacing:0}.ieeesa-title-lg-24{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1.5em;line-height:28px;color:#000;letter-spacing:0}.ieeesa-title-md-18{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1.125em;line-height:24px;color:#000;letter-spacing:.009375em}.ieeesa-title-sm-16{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1em;line-height:20px;color:#000;letter-spacing:.00625em}.ieeesa-label-lg-bold-16{font-family:Calibri Regular;font-style:normal;font-weight:700;font-size:1em;line-height:20px;color:#000;letter-spacing:.00625em}.ieeesa-label-lg-16{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1em;line-height:20px;color:#000;letter-spacing:.00625em}.ieeesa-label-md-14{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:.875em;line-height:16px;color:#000;letter-spacing:.03125em}.ieeesa-label-sm-13{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:.8125em;line-height:16px;color:#000;letter-spacing:.03125em}.ieeesa-body-lg-bold-18{font-family:Calibri Regular;font-style:normal;font-weight:700;font-size:1.125em;line-height:24px;color:#000;letter-spacing:.03125em}.ieeesa-body-lg-18{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1.125em;line-height:24px;color:#000;letter-spacing:.03125em}.ieeesa-body-md-16{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1em;line-height:20px;color:#000;letter-spacing:.015625em}.ieeesa-body-sm-14{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:.875em;line-height:16px;color:#000;letter-spacing:.025em}.ieeesa-title-inter-lg-bold-24{font-family:Inter Bold;font-style:normal;font-weight:700;font-size:1.5em;line-height:29px;color:#000;letter-spacing:0}.mat-mdc-button.mat-mdc-button-base.mat-primary-button,.mat-mdc-button.mat-mdc-button-base.mat-secondary-button{min-width:103px;width:auto;min-height:40px;height:auto;border-radius:3px;text-align:center;padding:.625em 1.5em;border:none;font-family:Calibri Regular;font-style:normal;font-weight:700;font-size:1em;line-height:20px;color:#000;letter-spacing:.00625em}.mat-mdc-button.mat-mdc-button-base>.mat-icon{margin-right:11px}.mat-mdc-button.mat-mdc-button-base.mat-primary-button{background-color:#00629b;color:#fff}.mat-mdc-button.mat-mdc-button-base.mat-primary-button:hover{background-color:#003e65}.mat-mdc-button.mat-mdc-button-base.mat-primary-button:active{background-color:#00629b}.mat-mdc-button.mat-mdc-button-base.mat-primary-button:disabled{background-color:#1c1b1f1f}.mat-mdc-button.mat-mdc-button-base.mat-secondary-button{color:#fff;background:#a7a8aa;box-shadow:0 1px 2px #0000004d,0 2px 6px 2px #00000026}.mat-mdc-button.mat-mdc-button-base.mat-secondary-button:hover{background:#a7a8aa}.mat-mdc-button.mat-mdc-button-base.mat-secondary-button:active{background:rgba(29,25,43,.12)}.mat-mdc-button.mat-mdc-button-base.mat-secondary-button:disabled{background:rgba(28,27,31,.12);color:#1c1b1f;opacity:.38}.ieeesa-text-button{color:#cac4d0;background:none;border:none}.flex-align-center{display:flex;align-items:center;justify-content:center}.mat-button-toggle-checked{background-color:#a7a8aa}.mat-button-toggle-checked .mat-button-toggle-label-content:before{font-family:\"Font Awesome 5 Free\";font-weight:900;content:\"\\f00c\";padding-right:.5625em}.mat-button-toggle-group .mat-button-toggle-label-content{font-family:Calibri Regular;font-style:normal;font-weight:700;font-size:1em;line-height:20px;color:#1c1b1f;letter-spacing:.00625em}@media (max-width: 768px){.mat-button-toggle-group .mat-button-toggle-label-content{max-width:8ch;text-overflow:ellipsis;white-space:nowrap;overflow:hidden;position:relative}}.cdk-overlay-pane{width:100%;min-width:312px}.ieeesa-datepicker-header--selected-date-container{padding:16px 27px 12px 24px;border-bottom:1px solid #cac4d0}.ieeesa-datepicker-header__selected-date{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:2.125em;line-height:40px;color:#1c1b1f;letter-spacing:0}.ieeesa-datepicker-header--content{display:flex;flex-direction:row;justify-content:space-between;align-items:center;width:100%;min-height:35px;border-top-right-radius:5px;border-top-left-radius:5px;padding:0 20px}.ieeesa-datepicker-header--content--period-button,.ieeesa-datepicker-header--content--arrow-left-btn,.ieeesa-datepicker-header--content--arrow-right-btn{margin:0;padding:0;border:unset;color:#49454f;background:linear-gradient(0deg,rgba(0,98,155,.11),rgba(0,98,155,.11)),#fffbfe}.ieeesa-datepicker-header--content--period-button--arrow-icon,.ieeesa-datepicker-header--content--arrow-left-btn--arrow-icon,.ieeesa-datepicker-header--content--arrow-right-btn--arrow-icon{position:relative;top:7px;color:#49454f}.ieeesa-datepicker-header__arrow-left{border:unset;color:#49454f;background:linear-gradient(0deg,rgba(0,98,155,.11),rgba(0,98,155,.11)),#fffbfe}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "ngmodule", type: MatDatepickerModule }, { kind: "ngmodule", type: MatFormFieldModule }, { kind: "ngmodule", type: MatNativeDateModule }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i5$2.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.3", ngImport: i0, type: DynamicFormFieldDirective, decorators: [{
-            type: Directive,
-            args: [{
-                    selector: '[ieeesaDynamicFormField]',
-                    standalone: true,
-                }]
-        }], ctorParameters: function () { return [{ type: i0.ViewContainerRef }]; }, propDecorators: { config: [{
-                type: Input
-            }], group: [{
-                type: Input
-            }], submitResponse: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.3", ngImport: i0, type: DatePickerHeaderComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'ieeesa-date-picker-header', standalone: true, imports: [
+                        CommonModule,
+                        MatDatepickerModule,
+                        MatFormFieldModule,
+                        MatNativeDateModule,
+                        MatIconModule,
+                    ], template: "<div class=\"ieeesa-datepicker-header--selected-date-container\">\r\n  <p class=\"ieeesa-label-lg-bold-16 ieeesa-datepicker-header__select-date-label\">\r\n    {{ datePickerInfo.datePicker.selectDateLabel }}\r\n  </p>\r\n  <p\r\n    class=\"headline-lg-34 ieeesa-datepicker-header__selected-date\"\r\n    *ngIf=\"range || isRangeSelection\"\r\n  >\r\n    {{ range.start }} - {{ range.end }}\r\n  </p>\r\n  <p\r\n    class=\"headline-lg-34 ieeesa-datepicker-header__selected-date\"\r\n    *ngIf=\"!isRangeSelection\"\r\n  >\r\n    {{ selectedDate }}\r\n  </p>\r\n</div>\r\n<div class=\"ieeesa-datepicker-header--content\">\r\n  <button\r\n    mat-button\r\n    type=\"button\"\r\n    class=\"ieeesa-datepicker-header--content--period-button ieeesa-label-lg-16\"\r\n    (click)=\"setCalendarView()\"\r\n    [attr.aria-label]=\"getMonthLabel\"\r\n    cdkAriaLive=\"polite\"\r\n  >\r\n    {{ getMonthLabel }}\r\n    <mat-icon\r\n      class=\"ieeesa-datepicker-header--content--period-button--arrow-icon\"\r\n      *ngIf=\"!arrowDirection\"\r\n      >arrow_drop_down</mat-icon\r\n    >\r\n    <mat-icon\r\n      class=\"ieeesa-datepicker-header--content--period-button--arrow-icon\"\r\n      *ngIf=\"arrowDirection\"\r\n      >arrow_drop_up</mat-icon\r\n    >\r\n  </button>\r\n  <button\r\n    mat-button\r\n    type=\"button\"\r\n    class=\"ieeesa-label-lg-16 ieeesa-datepicker-header--content--arrow-left-btn\"\r\n    [attr.aria-label]=\"datePickerInfo.ariaLabel.previousMonth\"\r\n    cdkAriaLive=\"polite\"\r\n  >\r\n    <mat-icon\r\n      (click)=\"setPreviousMonth('month')\"\r\n      class=\"ieeesa-datepicker-header__arrow-left\"\r\n      >keyboard_arrow_left</mat-icon\r\n    >\r\n  </button>\r\n  <button\r\n    mat-button\r\n    type=\"button\"\r\n    class=\"ieeesa-label-lg-16 ieeesa-datepicker-header--content--arrow-right-btn\"\r\n    [attr.aria-label]=\"datePickerInfo.ariaLabel.nextMonth\"\r\n    cdkAriaLive=\"polite\"\r\n  >\r\n    <mat-icon (click)=\"setNextMonth('month')\"> keyboard_arrow_right</mat-icon>\r\n  </button>\r\n</div>\r\n", styles: [".ieeesa-subtitle{text-align:left;font-family:Calibri Regular;font-size:1.56em;letter-spacing:0;color:#000;opacity:1}.ieeesa-body{text-align:left;font-family:Calibri Regular;font-size:1.25em;letter-spacing:0;color:#000;opacity:1}.ieeesa-display-lg-57{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:3.5625em;line-height:64px;color:#000;letter-spacing:0}.ieeesa-display-md-47{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:2.9375em;line-height:52px;color:#000;letter-spacing:0}.ieeesa-display-sm-38{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:2.375em;line-height:44px;color:#000;letter-spacing:0}.ieeesa-headline-lg-34{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:2.125em;line-height:40px;color:#000;letter-spacing:0}.ieeesa-headline-md-30{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1.875em;line-height:36px;color:#000;letter-spacing:0}.ieeesa-headline-sm-26{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1.625em;line-height:32px;color:#000;letter-spacing:0}.ieeesa-title-lg-bold-24{font-family:Calibri Regular;font-style:normal;font-weight:700;font-size:1.5em;line-height:28px;color:#000;letter-spacing:0}.ieeesa-title-lg-24{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1.5em;line-height:28px;color:#000;letter-spacing:0}.ieeesa-title-md-18{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1.125em;line-height:24px;color:#000;letter-spacing:.009375em}.ieeesa-title-sm-16{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1em;line-height:20px;color:#000;letter-spacing:.00625em}.ieeesa-label-lg-bold-16{font-family:Calibri Regular;font-style:normal;font-weight:700;font-size:1em;line-height:20px;color:#000;letter-spacing:.00625em}.ieeesa-label-lg-16{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1em;line-height:20px;color:#000;letter-spacing:.00625em}.ieeesa-label-md-14{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:.875em;line-height:16px;color:#000;letter-spacing:.03125em}.ieeesa-label-sm-13{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:.8125em;line-height:16px;color:#000;letter-spacing:.03125em}.ieeesa-body-lg-bold-18{font-family:Calibri Regular;font-style:normal;font-weight:700;font-size:1.125em;line-height:24px;color:#000;letter-spacing:.03125em}.ieeesa-body-lg-18{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1.125em;line-height:24px;color:#000;letter-spacing:.03125em}.ieeesa-body-md-16{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1em;line-height:20px;color:#000;letter-spacing:.015625em}.ieeesa-body-sm-14{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:.875em;line-height:16px;color:#000;letter-spacing:.025em}.ieeesa-title-inter-lg-bold-24{font-family:Inter Bold;font-style:normal;font-weight:700;font-size:1.5em;line-height:29px;color:#000;letter-spacing:0}.mat-mdc-button.mat-mdc-button-base.mat-primary-button,.mat-mdc-button.mat-mdc-button-base.mat-secondary-button{min-width:103px;width:auto;min-height:40px;height:auto;border-radius:3px;text-align:center;padding:.625em 1.5em;border:none;font-family:Calibri Regular;font-style:normal;font-weight:700;font-size:1em;line-height:20px;color:#000;letter-spacing:.00625em}.mat-mdc-button.mat-mdc-button-base>.mat-icon{margin-right:11px}.mat-mdc-button.mat-mdc-button-base.mat-primary-button{background-color:#00629b;color:#fff}.mat-mdc-button.mat-mdc-button-base.mat-primary-button:hover{background-color:#003e65}.mat-mdc-button.mat-mdc-button-base.mat-primary-button:active{background-color:#00629b}.mat-mdc-button.mat-mdc-button-base.mat-primary-button:disabled{background-color:#1c1b1f1f}.mat-mdc-button.mat-mdc-button-base.mat-secondary-button{color:#fff;background:#a7a8aa;box-shadow:0 1px 2px #0000004d,0 2px 6px 2px #00000026}.mat-mdc-button.mat-mdc-button-base.mat-secondary-button:hover{background:#a7a8aa}.mat-mdc-button.mat-mdc-button-base.mat-secondary-button:active{background:rgba(29,25,43,.12)}.mat-mdc-button.mat-mdc-button-base.mat-secondary-button:disabled{background:rgba(28,27,31,.12);color:#1c1b1f;opacity:.38}.ieeesa-text-button{color:#cac4d0;background:none;border:none}.flex-align-center{display:flex;align-items:center;justify-content:center}.mat-button-toggle-checked{background-color:#a7a8aa}.mat-button-toggle-checked .mat-button-toggle-label-content:before{font-family:\"Font Awesome 5 Free\";font-weight:900;content:\"\\f00c\";padding-right:.5625em}.mat-button-toggle-group .mat-button-toggle-label-content{font-family:Calibri Regular;font-style:normal;font-weight:700;font-size:1em;line-height:20px;color:#1c1b1f;letter-spacing:.00625em}@media (max-width: 768px){.mat-button-toggle-group .mat-button-toggle-label-content{max-width:8ch;text-overflow:ellipsis;white-space:nowrap;overflow:hidden;position:relative}}.cdk-overlay-pane{width:100%;min-width:312px}.ieeesa-datepicker-header--selected-date-container{padding:16px 27px 12px 24px;border-bottom:1px solid #cac4d0}.ieeesa-datepicker-header__selected-date{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:2.125em;line-height:40px;color:#1c1b1f;letter-spacing:0}.ieeesa-datepicker-header--content{display:flex;flex-direction:row;justify-content:space-between;align-items:center;width:100%;min-height:35px;border-top-right-radius:5px;border-top-left-radius:5px;padding:0 20px}.ieeesa-datepicker-header--content--period-button,.ieeesa-datepicker-header--content--arrow-left-btn,.ieeesa-datepicker-header--content--arrow-right-btn{margin:0;padding:0;border:unset;color:#49454f;background:linear-gradient(0deg,rgba(0,98,155,.11),rgba(0,98,155,.11)),#fffbfe}.ieeesa-datepicker-header--content--period-button--arrow-icon,.ieeesa-datepicker-header--content--arrow-left-btn--arrow-icon,.ieeesa-datepicker-header--content--arrow-right-btn--arrow-icon{position:relative;top:7px;color:#49454f}.ieeesa-datepicker-header__arrow-left{border:unset;color:#49454f;background:linear-gradient(0deg,rgba(0,98,155,.11),rgba(0,98,155,.11)),#fffbfe}\n"] }]
+        }], ctorParameters: function () { return [{ type: i7.MatCalendar }, { type: i2$1.DateAdapter }, { type: undefined, decorators: [{
+                    type: Inject,
+                    args: [MAT_DATE_FORMATS]
+                }] }, { type: i3$2.DatepickerService }]; }, propDecorators: { group: [{
                 type: Input
-            }], searchResponse: [{
-                type: Input
-            }], formSearchApply: [{
-                type: Output
-            }], formDropdownSelected: [{
-                type: Output
-            }], formDateSelected: [{
-                type: Output
-            }], formSelectedDateRange: [{
-                type: Output
-            }], formSelectSearch: [{
-                type: Output
-            }], formAutoCompleteSearch: [{
-                type: Output
-            }], autoCompleteOptionSelected: [{
-                type: Output
             }] } });
 
-/**
- * Implements and displays form error messages and form submission error response message on submission of form.
- * @export
- * @class FormErrorComponent
- */
-class FormErrorComponent {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.3", ngImport: i0, type: FormErrorComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.3", type: FormErrorComponent, isStandalone: true, selector: "ieeesa-form-error", inputs: { formGroup: "formGroup", config: "config", submitResponse: "submitResponse" }, ngImport: i0, template: "<ng-container *ngIf=\"formGroup\">\r\n  <div\r\n    class=\"ieeesa-body-sm-14 ieeesa-form-error\"\r\n    *ngIf=\"\r\n      formGroup.controls[config.controlName]?.touched ||\r\n      (formGroup.controls[config.controlName]?.dirty &&\r\n        formGroup.controls[config.controlName]?.invalid)\r\n    \"\r\n  >\r\n    <p\r\n      *ngIf=\"formGroup.controls[config.controlName].errors?.['required']\"\r\n      class=\"ieeesa-form-error--text\"\r\n    >\r\n      {{ config.requiredErrorMessage }}\r\n    </p>\r\n    <p\r\n      *ngIf=\"formGroup.controls[config.controlName].errors?.['minlength']\"\r\n      class=\"ieeesa-form-error--text\"\r\n    >\r\n      {{ config.minErrorMessage }}\r\n    </p>\r\n    <p\r\n      *ngIf=\"formGroup.controls[config.controlName].errors?.['maxlength'] || formGroup.controls[config.controlName].errors?.['max']\"\r\n      class=\"ieeesa-form-error--text\"\r\n    >\r\n      {{ config.maxErrorMessage }}\r\n    </p>\r\n    <p\r\n      *ngIf=\"formGroup.controls[config.controlName].errors?.['pattern']\"\r\n      class=\"ieeesa-form-error--text\"\r\n    >\r\n      {{ config.patternErrorMessage }}\r\n    </p>\r\n    <p\r\n      *ngIf=\"\r\n          formGroup.controls[config.controlName].errors?.['email']\"\r\n      class=\"ieeesa-form-error--text\"\r\n    >\r\n      {{ config.invalidEmailErrorMessage }}\r\n    </p>\r\n  </div>\r\n  <div\r\n    class=\"ieeesa-form-error\"\r\n    *ngIf=\"\r\n      (formGroup.controls[config.controlName]?.touched ||\r\n        formGroup.controls[config.controlName]?.dirty) &&\r\n      submitResponse\r\n    \"\r\n  >\r\n    <p class=\"ieeesa-form-error--text mt-1\">\r\n      {{ submitResponse }}\r\n    </p>\r\n  </div>\r\n</ng-container>\r\n", styles: [".ieeesa-subtitle{text-align:left;font-family:Calibri Regular;font-size:1.56em;letter-spacing:0;color:#000;opacity:1}.ieeesa-body{text-align:left;font-family:Calibri Regular;font-size:1.25em;letter-spacing:0;color:#000;opacity:1}.ieeesa-display-lg-57{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:3.5625em;line-height:64px;color:#000;letter-spacing:0}.ieeesa-display-md-47{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:2.9375em;line-height:52px;color:#000;letter-spacing:0}.ieeesa-display-sm-38{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:2.375em;line-height:44px;color:#000;letter-spacing:0}.ieeesa-headline-lg-34{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:2.125em;line-height:40px;color:#000;letter-spacing:0}.ieeesa-headline-md-30{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1.875em;line-height:36px;color:#000;letter-spacing:0}.ieeesa-headline-sm-26{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1.625em;line-height:32px;color:#000;letter-spacing:0}.ieeesa-title-lg-bold-24{font-family:Calibri Regular;font-style:normal;font-weight:700;font-size:1.5em;line-height:28px;color:#000;letter-spacing:0}.ieeesa-title-lg-24{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1.5em;line-height:28px;color:#000;letter-spacing:0}.ieeesa-title-md-18{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1.125em;line-height:24px;color:#000;letter-spacing:.009375em}.ieeesa-title-sm-16{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1em;line-height:20px;color:#000;letter-spacing:.00625em}.ieeesa-label-lg-bold-16{font-family:Calibri Regular;font-style:normal;font-weight:700;font-size:1em;line-height:20px;color:#000;letter-spacing:.00625em}.ieeesa-label-lg-16{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1em;line-height:20px;color:#000;letter-spacing:.00625em}.ieeesa-label-md-14{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:.875em;line-height:16px;color:#000;letter-spacing:.03125em}.ieeesa-label-sm-13{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:.8125em;line-height:16px;color:#000;letter-spacing:.03125em}.ieeesa-body-lg-bold-18{font-family:Calibri Regular;font-style:normal;font-weight:700;font-size:1.125em;line-height:24px;color:#000;letter-spacing:.03125em}.ieeesa-body-lg-18{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1.125em;line-height:24px;color:#000;letter-spacing:.03125em}.ieeesa-body-md-16{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1em;line-height:20px;color:#000;letter-spacing:.015625em}.ieeesa-body-sm-14{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:.875em;line-height:16px;color:#000;letter-spacing:.025em}.ieeesa-title-inter-lg-bold-24{font-family:Inter Bold;font-style:normal;font-weight:700;font-size:1.5em;line-height:29px;color:#000;letter-spacing:0}.mat-mdc-button.mat-mdc-button-base.mat-primary-button,.mat-mdc-button.mat-mdc-button-base.mat-secondary-button{min-width:103px;width:auto;min-height:40px;height:auto;border-radius:3px;text-align:center;padding:.625em 1.5em;border:none;font-family:Calibri Regular;font-style:normal;font-weight:700;font-size:1em;line-height:20px;color:#000;letter-spacing:.00625em}.mat-mdc-button.mat-mdc-button-base>.mat-icon{margin-right:11px}.mat-mdc-button.mat-mdc-button-base.mat-primary-button{background-color:#00629b;color:#fff}.mat-mdc-button.mat-mdc-button-base.mat-primary-button:hover{background-color:#003e65}.mat-mdc-button.mat-mdc-button-base.mat-primary-button:active{background-color:#00629b}.mat-mdc-button.mat-mdc-button-base.mat-primary-button:disabled{background-color:#1c1b1f1f}.mat-mdc-button.mat-mdc-button-base.mat-secondary-button{color:#fff;background:#a7a8aa;box-shadow:0 1px 2px #0000004d,0 2px 6px 2px #00000026}.mat-mdc-button.mat-mdc-button-base.mat-secondary-button:hover{background:#a7a8aa}.mat-mdc-button.mat-mdc-button-base.mat-secondary-button:active{background:rgba(29,25,43,.12)}.mat-mdc-button.mat-mdc-button-base.mat-secondary-button:disabled{background:rgba(28,27,31,.12);color:#1c1b1f;opacity:.38}.ieeesa-text-button{color:#cac4d0;background:none;border:none}.flex-align-center{display:flex;align-items:center;justify-content:center}.mat-button-toggle-checked{background-color:#a7a8aa}.mat-button-toggle-checked .mat-button-toggle-label-content:before{font-family:\"Font Awesome 5 Free\";font-weight:900;content:\"\\f00c\";padding-right:.5625em}.mat-button-toggle-group .mat-button-toggle-label-content{font-family:Calibri Regular;font-style:normal;font-weight:700;font-size:1em;line-height:20px;color:#1c1b1f;letter-spacing:.00625em}@media (max-width: 768px){.mat-button-toggle-group .mat-button-toggle-label-content{max-width:8ch;text-overflow:ellipsis;white-space:nowrap;overflow:hidden;position:relative}}.cdk-overlay-pane{width:100%;min-width:312px}.ieeesa-form-error--text{color:#ba0c2f;padding-left:14px}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] }); }
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.3", ngImport: i0, type: FormErrorComponent, decorators: [{
-            type: Component,
-            args: [{ selector: 'ieeesa-form-error', standalone: true, imports: [CommonModule], template: "<ng-container *ngIf=\"formGroup\">\r\n  <div\r\n    class=\"ieeesa-body-sm-14 ieeesa-form-error\"\r\n    *ngIf=\"\r\n      formGroup.controls[config.controlName]?.touched ||\r\n      (formGroup.controls[config.controlName]?.dirty &&\r\n        formGroup.controls[config.controlName]?.invalid)\r\n    \"\r\n  >\r\n    <p\r\n      *ngIf=\"formGroup.controls[config.controlName].errors?.['required']\"\r\n      class=\"ieeesa-form-error--text\"\r\n    >\r\n      {{ config.requiredErrorMessage }}\r\n    </p>\r\n    <p\r\n      *ngIf=\"formGroup.controls[config.controlName].errors?.['minlength']\"\r\n      class=\"ieeesa-form-error--text\"\r\n    >\r\n      {{ config.minErrorMessage }}\r\n    </p>\r\n    <p\r\n      *ngIf=\"formGroup.controls[config.controlName].errors?.['maxlength'] || formGroup.controls[config.controlName].errors?.['max']\"\r\n      class=\"ieeesa-form-error--text\"\r\n    >\r\n      {{ config.maxErrorMessage }}\r\n    </p>\r\n    <p\r\n      *ngIf=\"formGroup.controls[config.controlName].errors?.['pattern']\"\r\n      class=\"ieeesa-form-error--text\"\r\n    >\r\n      {{ config.patternErrorMessage }}\r\n    </p>\r\n    <p\r\n      *ngIf=\"\r\n          formGroup.controls[config.controlName].errors?.['email']\"\r\n      class=\"ieeesa-form-error--text\"\r\n    >\r\n      {{ config.invalidEmailErrorMessage }}\r\n    </p>\r\n  </div>\r\n  <div\r\n    class=\"ieeesa-form-error\"\r\n    *ngIf=\"\r\n      (formGroup.controls[config.controlName]?.touched ||\r\n        formGroup.controls[config.controlName]?.dirty) &&\r\n      submitResponse\r\n    \"\r\n  >\r\n    <p class=\"ieeesa-form-error--text mt-1\">\r\n      {{ submitResponse }}\r\n    </p>\r\n  </div>\r\n</ng-container>\r\n", styles: [".ieeesa-subtitle{text-align:left;font-family:Calibri Regular;font-size:1.56em;letter-spacing:0;color:#000;opacity:1}.ieeesa-body{text-align:left;font-family:Calibri Regular;font-size:1.25em;letter-spacing:0;color:#000;opacity:1}.ieeesa-display-lg-57{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:3.5625em;line-height:64px;color:#000;letter-spacing:0}.ieeesa-display-md-47{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:2.9375em;line-height:52px;color:#000;letter-spacing:0}.ieeesa-display-sm-38{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:2.375em;line-height:44px;color:#000;letter-spacing:0}.ieeesa-headline-lg-34{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:2.125em;line-height:40px;color:#000;letter-spacing:0}.ieeesa-headline-md-30{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1.875em;line-height:36px;color:#000;letter-spacing:0}.ieeesa-headline-sm-26{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1.625em;line-height:32px;color:#000;letter-spacing:0}.ieeesa-title-lg-bold-24{font-family:Calibri Regular;font-style:normal;font-weight:700;font-size:1.5em;line-height:28px;color:#000;letter-spacing:0}.ieeesa-title-lg-24{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1.5em;line-height:28px;color:#000;letter-spacing:0}.ieeesa-title-md-18{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1.125em;line-height:24px;color:#000;letter-spacing:.009375em}.ieeesa-title-sm-16{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1em;line-height:20px;color:#000;letter-spacing:.00625em}.ieeesa-label-lg-bold-16{font-family:Calibri Regular;font-style:normal;font-weight:700;font-size:1em;line-height:20px;color:#000;letter-spacing:.00625em}.ieeesa-label-lg-16{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1em;line-height:20px;color:#000;letter-spacing:.00625em}.ieeesa-label-md-14{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:.875em;line-height:16px;color:#000;letter-spacing:.03125em}.ieeesa-label-sm-13{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:.8125em;line-height:16px;color:#000;letter-spacing:.03125em}.ieeesa-body-lg-bold-18{font-family:Calibri Regular;font-style:normal;font-weight:700;font-size:1.125em;line-height:24px;color:#000;letter-spacing:.03125em}.ieeesa-body-lg-18{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1.125em;line-height:24px;color:#000;letter-spacing:.03125em}.ieeesa-body-md-16{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1em;line-height:20px;color:#000;letter-spacing:.015625em}.ieeesa-body-sm-14{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:.875em;line-height:16px;color:#000;letter-spacing:.025em}.ieeesa-title-inter-lg-bold-24{font-family:Inter Bold;font-style:normal;font-weight:700;font-size:1.5em;line-height:29px;color:#000;letter-spacing:0}.mat-mdc-button.mat-mdc-button-base.mat-primary-button,.mat-mdc-button.mat-mdc-button-base.mat-secondary-button{min-width:103px;width:auto;min-height:40px;height:auto;border-radius:3px;text-align:center;padding:.625em 1.5em;border:none;font-family:Calibri Regular;font-style:normal;font-weight:700;font-size:1em;line-height:20px;color:#000;letter-spacing:.00625em}.mat-mdc-button.mat-mdc-button-base>.mat-icon{margin-right:11px}.mat-mdc-button.mat-mdc-button-base.mat-primary-button{background-color:#00629b;color:#fff}.mat-mdc-button.mat-mdc-button-base.mat-primary-button:hover{background-color:#003e65}.mat-mdc-button.mat-mdc-button-base.mat-primary-button:active{background-color:#00629b}.mat-mdc-button.mat-mdc-button-base.mat-primary-button:disabled{background-color:#1c1b1f1f}.mat-mdc-button.mat-mdc-button-base.mat-secondary-button{color:#fff;background:#a7a8aa;box-shadow:0 1px 2px #0000004d,0 2px 6px 2px #00000026}.mat-mdc-button.mat-mdc-button-base.mat-secondary-button:hover{background:#a7a8aa}.mat-mdc-button.mat-mdc-button-base.mat-secondary-button:active{background:rgba(29,25,43,.12)}.mat-mdc-button.mat-mdc-button-base.mat-secondary-button:disabled{background:rgba(28,27,31,.12);color:#1c1b1f;opacity:.38}.ieeesa-text-button{color:#cac4d0;background:none;border:none}.flex-align-center{display:flex;align-items:center;justify-content:center}.mat-button-toggle-checked{background-color:#a7a8aa}.mat-button-toggle-checked .mat-button-toggle-label-content:before{font-family:\"Font Awesome 5 Free\";font-weight:900;content:\"\\f00c\";padding-right:.5625em}.mat-button-toggle-group .mat-button-toggle-label-content{font-family:Calibri Regular;font-style:normal;font-weight:700;font-size:1em;line-height:20px;color:#1c1b1f;letter-spacing:.00625em}@media (max-width: 768px){.mat-button-toggle-group .mat-button-toggle-label-content{max-width:8ch;text-overflow:ellipsis;white-space:nowrap;overflow:hidden;position:relative}}.cdk-overlay-pane{width:100%;min-width:312px}.ieeesa-form-error--text{color:#ba0c2f;padding-left:14px}\n"] }]
-        }], propDecorators: { formGroup: [{
-                type: Input
-            }], config: [{
-                type: Input
-            }], submitResponse: [{
-                type: Input
-            }] } });
+const DateFormats = {
+    display: {
+        dateInput: 'DD-MMM-YYYY',
+        monthYearA11yLabel: 'MMMM YYYY',
+        daysFormat: 'ddd',
+        monthFormat: 'YYYY-MM',
+        fullMonthLabel: 'MMM',
+        month: 'M',
+    },
+};
 
-/**
- * The NotificationComponent displays a notification with a heading, title, content, and an optional button.
- * Component can be reused in page not found, access denied, session expired notification, logged out pages.
- * @class NotificationComponent
- */
-class NotificationComponent {
-    constructor() {
-        this.buttonIcon = true;
-        this.notify = new EventEmitter();
-    }
-    /**
-     * Emits the notify event on clicking notify button.
-     */
-    onClick() {
-        this.notify.emit();
-    }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.3", ngImport: i0, type: NotificationComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.3", type: NotificationComponent, isStandalone: true, selector: "ieeesa-notification", inputs: { heading: "heading", title: "title", content: "content", buttonLabel: "buttonLabel", buttonIcon: "buttonIcon" }, outputs: { notify: "notify" }, ngImport: i0, template: "<div class=\"ieeesa-notification flex-align-center row\">\r\n  <div class=\"ieeesa-notification__body col-md-4 col-lg-4 p-4\">\r\n    <h1\r\n      class=\"ieeesa-notification__heading ieeesa-display-lg-57 text-capitalize\"\r\n      *ngIf=\"heading\"\r\n    >\r\n      {{ heading }}\r\n    </h1>\r\n    <p class=\"ieeesa-notification__title ieeesa-title-lg-bold-24\">\r\n      {{ title }}\r\n    </p>\r\n    <p class=\"ieeesa-notification__message ieeesa-title-md-18\">{{ content }}</p>\r\n    <button\r\n      mat-button\r\n      color=\"primary\"\r\n      class=\"ieeesa-notification__button ieeesa-label-lg-bold-16 mat-primary-button\"\r\n      (click)=\"onClick()\"\r\n    >\r\n      <i *ngIf=\"buttonIcon\" class=\"fa-solid fa-arrow-left\"></i>\r\n      {{ buttonLabel }}\r\n    </button>\r\n  </div>\r\n</div>\r\n", styles: [".ieeesa-subtitle{text-align:left;font-family:Calibri Regular;font-size:1.56em;letter-spacing:0;color:#000;opacity:1}.ieeesa-body{text-align:left;font-family:Calibri Regular;font-size:1.25em;letter-spacing:0;color:#000;opacity:1}.ieeesa-display-lg-57{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:3.5625em;line-height:64px;color:#000;letter-spacing:0}.ieeesa-display-md-47{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:2.9375em;line-height:52px;color:#000;letter-spacing:0}.ieeesa-display-sm-38{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:2.375em;line-height:44px;color:#000;letter-spacing:0}.ieeesa-headline-lg-34{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:2.125em;line-height:40px;color:#000;letter-spacing:0}.ieeesa-headline-md-30{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1.875em;line-height:36px;color:#000;letter-spacing:0}.ieeesa-headline-sm-26{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1.625em;line-height:32px;color:#000;letter-spacing:0}.ieeesa-title-lg-bold-24{font-family:Calibri Regular;font-style:normal;font-weight:700;font-size:1.5em;line-height:28px;color:#000;letter-spacing:0}.ieeesa-title-lg-24{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1.5em;line-height:28px;color:#000;letter-spacing:0}.ieeesa-title-md-18{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1.125em;line-height:24px;color:#000;letter-spacing:.009375em}.ieeesa-title-sm-16{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1em;line-height:20px;color:#000;letter-spacing:.00625em}.ieeesa-label-lg-bold-16{font-family:Calibri Regular;font-style:normal;font-weight:700;font-size:1em;line-height:20px;color:#000;letter-spacing:.00625em}.ieeesa-label-lg-16{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1em;line-height:20px;color:#000;letter-spacing:.00625em}.ieeesa-label-md-14{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:.875em;line-height:16px;color:#000;letter-spacing:.03125em}.ieeesa-label-sm-13{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:.8125em;line-height:16px;color:#000;letter-spacing:.03125em}.ieeesa-body-lg-bold-18{font-family:Calibri Regular;font-style:normal;font-weight:700;font-size:1.125em;line-height:24px;color:#000;letter-spacing:.03125em}.ieeesa-body-lg-18{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1.125em;line-height:24px;color:#000;letter-spacing:.03125em}.ieeesa-body-md-16{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1em;line-height:20px;color:#000;letter-spacing:.015625em}.ieeesa-body-sm-14{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:.875em;line-height:16px;color:#000;letter-spacing:.025em}.ieeesa-title-inter-lg-bold-24{font-family:Inter Bold;font-style:normal;font-weight:700;font-size:1.5em;line-height:29px;color:#000;letter-spacing:0}.mat-mdc-button.mat-mdc-button-base.mat-primary-button,.mat-mdc-button.mat-mdc-button-base.mat-secondary-button{min-width:103px;width:auto;min-height:40px;height:auto;border-radius:3px;text-align:center;padding:.625em 1.5em;border:none;font-family:Calibri Regular;font-style:normal;font-weight:700;font-size:1em;line-height:20px;color:#000;letter-spacing:.00625em}.mat-mdc-button.mat-mdc-button-base>.mat-icon{margin-right:11px}.mat-mdc-button.mat-mdc-button-base.mat-primary-button{background-color:#00629b;color:#fff}.mat-mdc-button.mat-mdc-button-base.mat-primary-button:hover{background-color:#003e65}.mat-mdc-button.mat-mdc-button-base.mat-primary-button:active{background-color:#00629b}.mat-mdc-button.mat-mdc-button-base.mat-primary-button:disabled{background-color:#1c1b1f1f}.mat-mdc-button.mat-mdc-button-base.mat-secondary-button{color:#fff;background:#a7a8aa;box-shadow:0 1px 2px #0000004d,0 2px 6px 2px #00000026}.mat-mdc-button.mat-mdc-button-base.mat-secondary-button:hover{background:#a7a8aa}.mat-mdc-button.mat-mdc-button-base.mat-secondary-button:active{background:rgba(29,25,43,.12)}.mat-mdc-button.mat-mdc-button-base.mat-secondary-button:disabled{background:rgba(28,27,31,.12);color:#1c1b1f;opacity:.38}.ieeesa-text-button{color:#cac4d0;background:none;border:none}.flex-align-center{display:flex;align-items:center;justify-content:center}.mat-button-toggle-checked{background-color:#a7a8aa}.mat-button-toggle-checked .mat-button-toggle-label-content:before{font-family:\"Font Awesome 5 Free\";font-weight:900;content:\"\\f00c\";padding-right:.5625em}.mat-button-toggle-group .mat-button-toggle-label-content{font-family:Calibri Regular;font-style:normal;font-weight:700;font-size:1em;line-height:20px;color:#1c1b1f;letter-spacing:.00625em}@media (max-width: 768px){.mat-button-toggle-group .mat-button-toggle-label-content{max-width:8ch;text-overflow:ellipsis;white-space:nowrap;overflow:hidden;position:relative}}.cdk-overlay-pane{width:100%;min-width:312px}.ieeesa-notification{text-align:center}.ieeesa-notification__body{box-shadow:0 1px 2px #0000004d,0 2px 6px 2px #00000026;border-radius:.5rem;margin:0 auto;font-family:Calibri Regular;padding:2em 0;background-color:#fff;height:max-content;display:flex;flex-direction:column;align-items:center}.ieeesa-notification__heading{color:#0188aa;margin:0;padding-bottom:.5rem}.ieeesa-notification__title{color:#0188aa;padding-bottom:2.5rem;margin:0}.ieeesa-notification__message{color:#002c37;letter-spacing:.03125em;padding-bottom:1rem;margin:0}.ieeesa-notification__button{margin-bottom:.5rem;color:#fff}.ieeesa-notification__button i{padding-right:.5rem}@media screen and (max-width: 576px){.ieeesa-notification__body{width:80%}}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i8.MatButton, selector: "    button[mat-button], button[mat-raised-button], button[mat-flat-button],    button[mat-stroked-button]  ", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }] }); }
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.3", ngImport: i0, type: NotificationComponent, decorators: [{
-            type: Component,
-            args: [{ selector: 'ieeesa-notification', standalone: true, imports: [CommonModule, MatIconModule, MatButtonModule], template: "<div class=\"ieeesa-notification flex-align-center row\">\r\n  <div class=\"ieeesa-notification__body col-md-4 col-lg-4 p-4\">\r\n    <h1\r\n      class=\"ieeesa-notification__heading ieeesa-display-lg-57 text-capitalize\"\r\n      *ngIf=\"heading\"\r\n    >\r\n      {{ heading }}\r\n    </h1>\r\n    <p class=\"ieeesa-notification__title ieeesa-title-lg-bold-24\">\r\n      {{ title }}\r\n    </p>\r\n    <p class=\"ieeesa-notification__message ieeesa-title-md-18\">{{ content }}</p>\r\n    <button\r\n      mat-button\r\n      color=\"primary\"\r\n      class=\"ieeesa-notification__button ieeesa-label-lg-bold-16 mat-primary-button\"\r\n      (click)=\"onClick()\"\r\n    >\r\n      <i *ngIf=\"buttonIcon\" class=\"fa-solid fa-arrow-left\"></i>\r\n      {{ buttonLabel }}\r\n    </button>\r\n  </div>\r\n</div>\r\n", styles: [".ieeesa-subtitle{text-align:left;font-family:Calibri Regular;font-size:1.56em;letter-spacing:0;color:#000;opacity:1}.ieeesa-body{text-align:left;font-family:Calibri Regular;font-size:1.25em;letter-spacing:0;color:#000;opacity:1}.ieeesa-display-lg-57{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:3.5625em;line-height:64px;color:#000;letter-spacing:0}.ieeesa-display-md-47{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:2.9375em;line-height:52px;color:#000;letter-spacing:0}.ieeesa-display-sm-38{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:2.375em;line-height:44px;color:#000;letter-spacing:0}.ieeesa-headline-lg-34{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:2.125em;line-height:40px;color:#000;letter-spacing:0}.ieeesa-headline-md-30{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1.875em;line-height:36px;color:#000;letter-spacing:0}.ieeesa-headline-sm-26{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1.625em;line-height:32px;color:#000;letter-spacing:0}.ieeesa-title-lg-bold-24{font-family:Calibri Regular;font-style:normal;font-weight:700;font-size:1.5em;line-height:28px;color:#000;letter-spacing:0}.ieeesa-title-lg-24{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1.5em;line-height:28px;color:#000;letter-spacing:0}.ieeesa-title-md-18{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1.125em;line-height:24px;color:#000;letter-spacing:.009375em}.ieeesa-title-sm-16{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1em;line-height:20px;color:#000;letter-spacing:.00625em}.ieeesa-label-lg-bold-16{font-family:Calibri Regular;font-style:normal;font-weight:700;font-size:1em;line-height:20px;color:#000;letter-spacing:.00625em}.ieeesa-label-lg-16{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1em;line-height:20px;color:#000;letter-spacing:.00625em}.ieeesa-label-md-14{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:.875em;line-height:16px;color:#000;letter-spacing:.03125em}.ieeesa-label-sm-13{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:.8125em;line-height:16px;color:#000;letter-spacing:.03125em}.ieeesa-body-lg-bold-18{font-family:Calibri Regular;font-style:normal;font-weight:700;font-size:1.125em;line-height:24px;color:#000;letter-spacing:.03125em}.ieeesa-body-lg-18{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1.125em;line-height:24px;color:#000;letter-spacing:.03125em}.ieeesa-body-md-16{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1em;line-height:20px;color:#000;letter-spacing:.015625em}.ieeesa-body-sm-14{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:.875em;line-height:16px;color:#000;letter-spacing:.025em}.ieeesa-title-inter-lg-bold-24{font-family:Inter Bold;font-style:normal;font-weight:700;font-size:1.5em;line-height:29px;color:#000;letter-spacing:0}.mat-mdc-button.mat-mdc-button-base.mat-primary-button,.mat-mdc-button.mat-mdc-button-base.mat-secondary-button{min-width:103px;width:auto;min-height:40px;height:auto;border-radius:3px;text-align:center;padding:.625em 1.5em;border:none;font-family:Calibri Regular;font-style:normal;font-weight:700;font-size:1em;line-height:20px;color:#000;letter-spacing:.00625em}.mat-mdc-button.mat-mdc-button-base>.mat-icon{margin-right:11px}.mat-mdc-button.mat-mdc-button-base.mat-primary-button{background-color:#00629b;color:#fff}.mat-mdc-button.mat-mdc-button-base.mat-primary-button:hover{background-color:#003e65}.mat-mdc-button.mat-mdc-button-base.mat-primary-button:active{background-color:#00629b}.mat-mdc-button.mat-mdc-button-base.mat-primary-button:disabled{background-color:#1c1b1f1f}.mat-mdc-button.mat-mdc-button-base.mat-secondary-button{color:#fff;background:#a7a8aa;box-shadow:0 1px 2px #0000004d,0 2px 6px 2px #00000026}.mat-mdc-button.mat-mdc-button-base.mat-secondary-button:hover{background:#a7a8aa}.mat-mdc-button.mat-mdc-button-base.mat-secondary-button:active{background:rgba(29,25,43,.12)}.mat-mdc-button.mat-mdc-button-base.mat-secondary-button:disabled{background:rgba(28,27,31,.12);color:#1c1b1f;opacity:.38}.ieeesa-text-button{color:#cac4d0;background:none;border:none}.flex-align-center{display:flex;align-items:center;justify-content:center}.mat-button-toggle-checked{background-color:#a7a8aa}.mat-button-toggle-checked .mat-button-toggle-label-content:before{font-family:\"Font Awesome 5 Free\";font-weight:900;content:\"\\f00c\";padding-right:.5625em}.mat-button-toggle-group .mat-button-toggle-label-content{font-family:Calibri Regular;font-style:normal;font-weight:700;font-size:1em;line-height:20px;color:#1c1b1f;letter-spacing:.00625em}@media (max-width: 768px){.mat-button-toggle-group .mat-button-toggle-label-content{max-width:8ch;text-overflow:ellipsis;white-space:nowrap;overflow:hidden;position:relative}}.cdk-overlay-pane{width:100%;min-width:312px}.ieeesa-notification{text-align:center}.ieeesa-notification__body{box-shadow:0 1px 2px #0000004d,0 2px 6px 2px #00000026;border-radius:.5rem;margin:0 auto;font-family:Calibri Regular;padding:2em 0;background-color:#fff;height:max-content;display:flex;flex-direction:column;align-items:center}.ieeesa-notification__heading{color:#0188aa;margin:0;padding-bottom:.5rem}.ieeesa-notification__title{color:#0188aa;padding-bottom:2.5rem;margin:0}.ieeesa-notification__message{color:#002c37;letter-spacing:.03125em;padding-bottom:1rem;margin:0}.ieeesa-notification__button{margin-bottom:.5rem;color:#fff}.ieeesa-notification__button i{padding-right:.5rem}@media screen and (max-width: 576px){.ieeesa-notification__body{width:80%}}\n"] }]
-        }], propDecorators: { heading: [{
-                type: Input
-            }], title: [{
-                type: Input
-            }], content: [{
-                type: Input
-            }], buttonLabel: [{
-                type: Input
-            }], buttonIcon: [{
-                type: Input
-            }], notify: [{
-                type: Output
-            }] } });
+var CalendarType;
+(function (CalendarType) {
+    // eslint-disable-next-line no-unused-vars
+    CalendarType[CalendarType["SINGLE_DATE_SELECTION"] = 1] = "SINGLE_DATE_SELECTION";
+    // eslint-disable-next-line no-unused-vars
+    CalendarType[CalendarType["CALENDAR"] = 2] = "CALENDAR";
+    // eslint-disable-next-line no-unused-vars
+    CalendarType[CalendarType["DATE_RANGE_SELECTION"] = 3] = "DATE_RANGE_SELECTION";
+})(CalendarType || (CalendarType = {}));
 
 /**
- * Provides implementation of input type number and text
+ * DatepickerService is used in date-picker and date-picker-header component to get date range, isRangeSelection, and selected date(s).
  * @export
- * @class InputComponent
- * @implements {FormField}
+ * @class DatepickerService
  */
-class InputComponent {
+class DatepickerService {
     constructor() {
-        this.invalidChars = ['-', '+', 'e'];
-        // eslint-disable-next-line @typescript-eslint/no-explicit-any
-        this.buttonActionsInfo = buttonActionsInfo;
+        this.destroy$ = new Subject();
+        this.range = new Subject();
+        this.range$ = this.range.asObservable();
+        this.isRangeSelection = false;
+        this.range$?.pipe(takeUntil(this.destroy$)).subscribe((range) => {
+            this.selectedRange = {
+                start: range.start,
+                end: range.end,
+            };
+        });
     }
     /**
-     * Handles keyboard event of type keydown to restrict invalid characters.
-     * @param {KeyboardEvent} event
-     * @memberof InputComponent
+     * Returns the calendar type.
+     * @return {boolean}
+     * @memberof DatepickerService
      */
-    onKeyDown(event) {
-        if ((this.invalidChars.includes(event.key.toLowerCase()) ||
-            (this.config.isInteger && event.key.toLowerCase() === '.')) &&
-            this.config.isNumber) {
-            event.preventDefault();
-        }
+    getCalendarType() {
+        return this.isRangeSelection;
     }
     /**
-     * Clears the form group control value of type input
-     * @memberof InputComponent
+     * Returns selected range
+     * @return {({ start: Date | string; end: Date | string })}
+     * @memberof DatepickerService
      */
-    clear() {
-        this.group.get(this.config.controlName)?.setValue('');
+    getSelectedRange() {
+        return this.selectedRange;
     }
     /**
-     * Handles form control input on change event to set min and max value errors
-     * @memberof InputComponent
+     * Implementation of ngOnDestroy lifecycle hook method to unsubscribe the open observable subscriptions.
+     * @memberof DatePickerHeaderComponent
      */
-    onChange() {
-        if (this.config.max &&
-            this.config.isNumber &&
-            Number(this.group.get(this.config.controlName)?.value) > this.config.max) {
-            this.group.get(this.config.controlName)?.setErrors({
-                maxlength: true,
-            });
-        }
-        if (this.config.min &&
-            this.config.isNumber &&
-            this.group.get(this.config.controlName)?.value !== '' &&
-            Number(this.group.get(this.config.controlName)?.value) < this.config.min) {
-            this.group.get(this.config.controlName)?.setErrors({
-                minlength: true,
-            });
-        }
+    ngOnDestroy() {
+        this.destroy$.next(true);
+        this.destroy$.unsubscribe();
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.3", ngImport: i0, type: InputComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.3", type: InputComponent, isStandalone: true, selector: "ieeesa-input", ngImport: i0, template: "<div\r\n  [formGroup]=\"group\"\r\n  class=\"ieeesa-input-field\"\r\n  [ngClass]=\"\r\n    config.isLabelAlignedLeft\r\n      ? 'ieeesa-input-field__label-left'\r\n      : 'ieeesa-input-field__label-top'\r\n  \"\r\n>\r\n  <mat-label class=\"ieeesa-body-sm-14 ieeesa-input-field__label\">{{\r\n    config.label\r\n  }}</mat-label>\r\n  <mat-form-field>\r\n    <input\r\n      class=\"ieeesa-input-field__content ieeesa-body-sm-14\"\r\n      [type]=\"config.isNumber ? 'number' : 'text'\"\r\n      [min]=\"config.min\"\r\n      [max]=\"config.max\"\r\n      [maxlength]=\"config.maxLength ?? ''\"\r\n      [minlength]=\"config.minLength ?? ''\"\r\n      [placeholder]=\"config.placeholder ?? ''\"\r\n      [placeholder]=\"config.placeholder ?? ''\"\r\n      [formControlName]=\"config.controlName\"\r\n      [name]=\"config.controlName\"\r\n      (keydown)=\"onKeyDown($event)\"\r\n      (input)=\"onChange()\"\r\n      autocomplete=\"off\"\r\n      matInput\r\n    />\r\n    <button\r\n      *ngIf=\"\r\n        group.get(this.config.controlName)?.value &&\r\n        group.get(this.config.controlName)?.valid\r\n      \"\r\n      matSuffix\r\n      mat-icon-button\r\n      [attr.aria-label]=\"buttonActionsInfo.ariaLabel.clear\"\r\n      class=\"ieeesa-input-field__btn--clear\"\r\n      (click)=\"clear()\"\r\n    >\r\n      <i class=\"fa-regular fa-circle-xmark ieeesa-input-field__icon--clear\"></i>\r\n    </button>\r\n    <button\r\n      *ngIf=\"\r\n        group.get(this.config.controlName)?.invalid &&\r\n        group.get(this.config.controlName)?.dirty\r\n      \"\r\n      class=\"ieeesa-input-field__btn--warning\"\r\n      matSuffix\r\n      mat-icon-button\r\n      [attr.aria-label]=\"buttonActionsInfo.ariaLabel.warning\"\r\n    >\r\n      <i\r\n        class=\"fa-solid fa-circle-exclamation ieeesa-input-field__icon--warning\"\r\n      ></i>\r\n    </button>\r\n  </mat-form-field>\r\n  <ieeesa-form-error [formGroup]=\"group\" [config]=\"config\"> </ieeesa-form-error>\r\n</div>\r\n", styles: [".ieeesa-subtitle{text-align:left;font-family:Calibri Regular;font-size:1.56em;letter-spacing:0;color:#000;opacity:1}.ieeesa-body{text-align:left;font-family:Calibri Regular;font-size:1.25em;letter-spacing:0;color:#000;opacity:1}.ieeesa-display-lg-57{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:3.5625em;line-height:64px;color:#000;letter-spacing:0}.ieeesa-display-md-47{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:2.9375em;line-height:52px;color:#000;letter-spacing:0}.ieeesa-display-sm-38{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:2.375em;line-height:44px;color:#000;letter-spacing:0}.ieeesa-headline-lg-34{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:2.125em;line-height:40px;color:#000;letter-spacing:0}.ieeesa-headline-md-30{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1.875em;line-height:36px;color:#000;letter-spacing:0}.ieeesa-headline-sm-26{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1.625em;line-height:32px;color:#000;letter-spacing:0}.ieeesa-title-lg-bold-24{font-family:Calibri Regular;font-style:normal;font-weight:700;font-size:1.5em;line-height:28px;color:#000;letter-spacing:0}.ieeesa-title-lg-24{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1.5em;line-height:28px;color:#000;letter-spacing:0}.ieeesa-title-md-18{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1.125em;line-height:24px;color:#000;letter-spacing:.009375em}.ieeesa-title-sm-16{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1em;line-height:20px;color:#000;letter-spacing:.00625em}.ieeesa-label-lg-bold-16{font-family:Calibri Regular;font-style:normal;font-weight:700;font-size:1em;line-height:20px;color:#000;letter-spacing:.00625em}.ieeesa-label-lg-16{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1em;line-height:20px;color:#000;letter-spacing:.00625em}.ieeesa-label-md-14{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:.875em;line-height:16px;color:#000;letter-spacing:.03125em}.ieeesa-label-sm-13{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:.8125em;line-height:16px;color:#000;letter-spacing:.03125em}.ieeesa-body-lg-bold-18{font-family:Calibri Regular;font-style:normal;font-weight:700;font-size:1.125em;line-height:24px;color:#000;letter-spacing:.03125em}.ieeesa-body-lg-18{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1.125em;line-height:24px;color:#000;letter-spacing:.03125em}.ieeesa-body-md-16{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1em;line-height:20px;color:#000;letter-spacing:.015625em}.ieeesa-body-sm-14{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:.875em;line-height:16px;color:#000;letter-spacing:.025em}.ieeesa-title-inter-lg-bold-24{font-family:Inter Bold;font-style:normal;font-weight:700;font-size:1.5em;line-height:29px;color:#000;letter-spacing:0}.mat-mdc-button.mat-mdc-button-base.mat-primary-button,.mat-mdc-button.mat-mdc-button-base.mat-secondary-button{min-width:103px;width:auto;min-height:40px;height:auto;border-radius:3px;text-align:center;padding:.625em 1.5em;border:none;font-family:Calibri Regular;font-style:normal;font-weight:700;font-size:1em;line-height:20px;color:#000;letter-spacing:.00625em}.mat-mdc-button.mat-mdc-button-base>.mat-icon{margin-right:11px}.mat-mdc-button.mat-mdc-button-base.mat-primary-button{background-color:#00629b;color:#fff}.mat-mdc-button.mat-mdc-button-base.mat-primary-button:hover{background-color:#003e65}.mat-mdc-button.mat-mdc-button-base.mat-primary-button:active{background-color:#00629b}.mat-mdc-button.mat-mdc-button-base.mat-primary-button:disabled{background-color:#1c1b1f1f}.mat-mdc-button.mat-mdc-button-base.mat-secondary-button{color:#fff;background:#a7a8aa;box-shadow:0 1px 2px #0000004d,0 2px 6px 2px #00000026}.mat-mdc-button.mat-mdc-button-base.mat-secondary-button:hover{background:#a7a8aa}.mat-mdc-button.mat-mdc-button-base.mat-secondary-button:active{background:rgba(29,25,43,.12)}.mat-mdc-button.mat-mdc-button-base.mat-secondary-button:disabled{background:rgba(28,27,31,.12);color:#1c1b1f;opacity:.38}.ieeesa-text-button{color:#cac4d0;background:none;border:none}.flex-align-center{display:flex;align-items:center;justify-content:center}.mat-button-toggle-checked{background-color:#a7a8aa}.mat-button-toggle-checked .mat-button-toggle-label-content:before{font-family:\"Font Awesome 5 Free\";font-weight:900;content:\"\\f00c\";padding-right:.5625em}.mat-button-toggle-group .mat-button-toggle-label-content{font-family:Calibri Regular;font-style:normal;font-weight:700;font-size:1em;line-height:20px;color:#1c1b1f;letter-spacing:.00625em}@media (max-width: 768px){.mat-button-toggle-group .mat-button-toggle-label-content{max-width:8ch;text-overflow:ellipsis;white-space:nowrap;overflow:hidden;position:relative}}.cdk-overlay-pane{width:100%;min-width:312px}.ieeesa-input-field__warning-btn{display:none}.ieeesa-input-field__icon--clear,.ieeesa-input-field__icon--warning{height:20px;width:20px}.ieeesa-input-field__icon--warning{color:#ba0c2f}.ieeesa-input-field__btn--clear,.ieeesa-input-field__btn--warning{border:none;background-color:inherit}.ieeesa-input-field__content{font-family:Calibri Regular;font-size:1.125em}.ieeesa-input-field__label-left{display:flex}.ieeesa-input-field__label-top{display:block}.ieeesa-input-field .mat-mdc-form-field{min-height:52px;width:-webkit-fill-available}.ieeesa-input-field .mat-mdc-form-field-subscript-wrapper{display:none}.ieeesa-input-field .mat-mdc-text-field-wrapper{height:40px;min-width:210px;width:auto;background-color:#fffbfe;border-radius:4px 4px 0 0}.ieeesa-input-field .mat-mdc-form-field-focus-overlay{background-color:#fffbfe}.ieeesa-input-field .mdc-text-field--filled .mdc-line-ripple:after{border-bottom:2px solid #00b5e2;opacity:.5}.ieeesa-input-field .mdc-text-field--no-label:not(.mdc-text-field--outlined):not(.mdc-text-field--textarea) .mat-mdc-form-field-infix{padding-top:9px}.ieeesa-input-field .mat-mdc-form-field-icon-suffix,.ieeesa-input-field [dir=rtl] .mat-mdc-form-field-icon-prefix{padding:0 8px 16px 4px}.ieeesa-input-field:has(.mdc-line-ripple--active) .ieeesa-input-field__label{color:#00b5e2}.ieeesa-input-field:has(.mdc-line-ripple--active) .mat-mdc-form-field-focus-overlay{background-color:#1c1b1f;opacity:.2}.ieeesa-input-field:has(.mdc-text-field--invalid) .mdc-text-field--filled .mdc-line-ripple:after{border-bottom:2px solid #ba0c2f;opacity:.5}.ieeesa-input-field:has(.mdc-text-field--invalid) .ieeesa-input-field__btn--warning{display:block}.ieeesa-input-field:has(.mdc-text-field--invalid) .ieeesa-input-field__label{color:#ba0c2f}input::-webkit-outer-spin-button,input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i3.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i3.MinLengthValidator, selector: "[minlength][formControlName],[minlength][formControl],[minlength][ngModel]", inputs: ["minlength"] }, { kind: "directive", type: i3.MaxLengthValidator, selector: "[maxlength][formControlName],[maxlength][formControl],[maxlength][ngModel]", inputs: ["maxlength"] }, { kind: "directive", type: i3.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i3.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "component", type: FormErrorComponent$1, selector: "ieeesa-form-error", inputs: ["formGroup", "config", "submitResponse"] }, { kind: "ngmodule", type: MatInputModule }, { kind: "directive", type: i5.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl],      input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly"], exportAs: ["matInput"] }, { kind: "component", type: i4.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i4.MatLabel, selector: "mat-label" }, { kind: "directive", type: i4.MatSuffix, selector: "[matSuffix], [matIconSuffix], [matTextSuffix]", inputs: ["matTextSuffix"] }, { kind: "ngmodule", type: MatIconModule }], encapsulation: i0.ViewEncapsulation.None }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.3", ngImport: i0, type: DatepickerService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
+    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "16.1.3", ngImport: i0, type: DatepickerService, providedIn: 'root' }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.3", ngImport: i0, type: InputComponent, decorators: [{
-            type: Component,
-            args: [{ selector: 'ieeesa-input', standalone: true, imports: [
-                        CommonModule,
-                        ReactiveFormsModule,
-                        FormErrorComponent$1,
-                        MatInputModule,
-                        MatIconModule,
-                    ], encapsulation: ViewEncapsulation.None, template: "<div\r\n  [formGroup]=\"group\"\r\n  class=\"ieeesa-input-field\"\r\n  [ngClass]=\"\r\n    config.isLabelAlignedLeft\r\n      ? 'ieeesa-input-field__label-left'\r\n      : 'ieeesa-input-field__label-top'\r\n  \"\r\n>\r\n  <mat-label class=\"ieeesa-body-sm-14 ieeesa-input-field__label\">{{\r\n    config.label\r\n  }}</mat-label>\r\n  <mat-form-field>\r\n    <input\r\n      class=\"ieeesa-input-field__content ieeesa-body-sm-14\"\r\n      [type]=\"config.isNumber ? 'number' : 'text'\"\r\n      [min]=\"config.min\"\r\n      [max]=\"config.max\"\r\n      [maxlength]=\"config.maxLength ?? ''\"\r\n      [minlength]=\"config.minLength ?? ''\"\r\n      [placeholder]=\"config.placeholder ?? ''\"\r\n      [placeholder]=\"config.placeholder ?? ''\"\r\n      [formControlName]=\"config.controlName\"\r\n      [name]=\"config.controlName\"\r\n      (keydown)=\"onKeyDown($event)\"\r\n      (input)=\"onChange()\"\r\n      autocomplete=\"off\"\r\n      matInput\r\n    />\r\n    <button\r\n      *ngIf=\"\r\n        group.get(this.config.controlName)?.value &&\r\n        group.get(this.config.controlName)?.valid\r\n      \"\r\n      matSuffix\r\n      mat-icon-button\r\n      [attr.aria-label]=\"buttonActionsInfo.ariaLabel.clear\"\r\n      class=\"ieeesa-input-field__btn--clear\"\r\n      (click)=\"clear()\"\r\n    >\r\n      <i class=\"fa-regular fa-circle-xmark ieeesa-input-field__icon--clear\"></i>\r\n    </button>\r\n    <button\r\n      *ngIf=\"\r\n        group.get(this.config.controlName)?.invalid &&\r\n        group.get(this.config.controlName)?.dirty\r\n      \"\r\n      class=\"ieeesa-input-field__btn--warning\"\r\n      matSuffix\r\n      mat-icon-button\r\n      [attr.aria-label]=\"buttonActionsInfo.ariaLabel.warning\"\r\n    >\r\n      <i\r\n        class=\"fa-solid fa-circle-exclamation ieeesa-input-field__icon--warning\"\r\n      ></i>\r\n    </button>\r\n  </mat-form-field>\r\n  <ieeesa-form-error [formGroup]=\"group\" [config]=\"config\"> </ieeesa-form-error>\r\n</div>\r\n", styles: [".ieeesa-subtitle{text-align:left;font-family:Calibri Regular;font-size:1.56em;letter-spacing:0;color:#000;opacity:1}.ieeesa-body{text-align:left;font-family:Calibri Regular;font-size:1.25em;letter-spacing:0;color:#000;opacity:1}.ieeesa-display-lg-57{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:3.5625em;line-height:64px;color:#000;letter-spacing:0}.ieeesa-display-md-47{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:2.9375em;line-height:52px;color:#000;letter-spacing:0}.ieeesa-display-sm-38{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:2.375em;line-height:44px;color:#000;letter-spacing:0}.ieeesa-headline-lg-34{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:2.125em;line-height:40px;color:#000;letter-spacing:0}.ieeesa-headline-md-30{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1.875em;line-height:36px;color:#000;letter-spacing:0}.ieeesa-headline-sm-26{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1.625em;line-height:32px;color:#000;letter-spacing:0}.ieeesa-title-lg-bold-24{font-family:Calibri Regular;font-style:normal;font-weight:700;font-size:1.5em;line-height:28px;color:#000;letter-spacing:0}.ieeesa-title-lg-24{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1.5em;line-height:28px;color:#000;letter-spacing:0}.ieeesa-title-md-18{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1.125em;line-height:24px;color:#000;letter-spacing:.009375em}.ieeesa-title-sm-16{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1em;line-height:20px;color:#000;letter-spacing:.00625em}.ieeesa-label-lg-bold-16{font-family:Calibri Regular;font-style:normal;font-weight:700;font-size:1em;line-height:20px;color:#000;letter-spacing:.00625em}.ieeesa-label-lg-16{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1em;line-height:20px;color:#000;letter-spacing:.00625em}.ieeesa-label-md-14{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:.875em;line-height:16px;color:#000;letter-spacing:.03125em}.ieeesa-label-sm-13{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:.8125em;line-height:16px;color:#000;letter-spacing:.03125em}.ieeesa-body-lg-bold-18{font-family:Calibri Regular;font-style:normal;font-weight:700;font-size:1.125em;line-height:24px;color:#000;letter-spacing:.03125em}.ieeesa-body-lg-18{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1.125em;line-height:24px;color:#000;letter-spacing:.03125em}.ieeesa-body-md-16{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1em;line-height:20px;color:#000;letter-spacing:.015625em}.ieeesa-body-sm-14{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:.875em;line-height:16px;color:#000;letter-spacing:.025em}.ieeesa-title-inter-lg-bold-24{font-family:Inter Bold;font-style:normal;font-weight:700;font-size:1.5em;line-height:29px;color:#000;letter-spacing:0}.mat-mdc-button.mat-mdc-button-base.mat-primary-button,.mat-mdc-button.mat-mdc-button-base.mat-secondary-button{min-width:103px;width:auto;min-height:40px;height:auto;border-radius:3px;text-align:center;padding:.625em 1.5em;border:none;font-family:Calibri Regular;font-style:normal;font-weight:700;font-size:1em;line-height:20px;color:#000;letter-spacing:.00625em}.mat-mdc-button.mat-mdc-button-base>.mat-icon{margin-right:11px}.mat-mdc-button.mat-mdc-button-base.mat-primary-button{background-color:#00629b;color:#fff}.mat-mdc-button.mat-mdc-button-base.mat-primary-button:hover{background-color:#003e65}.mat-mdc-button.mat-mdc-button-base.mat-primary-button:active{background-color:#00629b}.mat-mdc-button.mat-mdc-button-base.mat-primary-button:disabled{background-color:#1c1b1f1f}.mat-mdc-button.mat-mdc-button-base.mat-secondary-button{color:#fff;background:#a7a8aa;box-shadow:0 1px 2px #0000004d,0 2px 6px 2px #00000026}.mat-mdc-button.mat-mdc-button-base.mat-secondary-button:hover{background:#a7a8aa}.mat-mdc-button.mat-mdc-button-base.mat-secondary-button:active{background:rgba(29,25,43,.12)}.mat-mdc-button.mat-mdc-button-base.mat-secondary-button:disabled{background:rgba(28,27,31,.12);color:#1c1b1f;opacity:.38}.ieeesa-text-button{color:#cac4d0;background:none;border:none}.flex-align-center{display:flex;align-items:center;justify-content:center}.mat-button-toggle-checked{background-color:#a7a8aa}.mat-button-toggle-checked .mat-button-toggle-label-content:before{font-family:\"Font Awesome 5 Free\";font-weight:900;content:\"\\f00c\";padding-right:.5625em}.mat-button-toggle-group .mat-button-toggle-label-content{font-family:Calibri Regular;font-style:normal;font-weight:700;font-size:1em;line-height:20px;color:#1c1b1f;letter-spacing:.00625em}@media (max-width: 768px){.mat-button-toggle-group .mat-button-toggle-label-content{max-width:8ch;text-overflow:ellipsis;white-space:nowrap;overflow:hidden;position:relative}}.cdk-overlay-pane{width:100%;min-width:312px}.ieeesa-input-field__warning-btn{display:none}.ieeesa-input-field__icon--clear,.ieeesa-input-field__icon--warning{height:20px;width:20px}.ieeesa-input-field__icon--warning{color:#ba0c2f}.ieeesa-input-field__btn--clear,.ieeesa-input-field__btn--warning{border:none;background-color:inherit}.ieeesa-input-field__content{font-family:Calibri Regular;font-size:1.125em}.ieeesa-input-field__label-left{display:flex}.ieeesa-input-field__label-top{display:block}.ieeesa-input-field .mat-mdc-form-field{min-height:52px;width:-webkit-fill-available}.ieeesa-input-field .mat-mdc-form-field-subscript-wrapper{display:none}.ieeesa-input-field .mat-mdc-text-field-wrapper{height:40px;min-width:210px;width:auto;background-color:#fffbfe;border-radius:4px 4px 0 0}.ieeesa-input-field .mat-mdc-form-field-focus-overlay{background-color:#fffbfe}.ieeesa-input-field .mdc-text-field--filled .mdc-line-ripple:after{border-bottom:2px solid #00b5e2;opacity:.5}.ieeesa-input-field .mdc-text-field--no-label:not(.mdc-text-field--outlined):not(.mdc-text-field--textarea) .mat-mdc-form-field-infix{padding-top:9px}.ieeesa-input-field .mat-mdc-form-field-icon-suffix,.ieeesa-input-field [dir=rtl] .mat-mdc-form-field-icon-prefix{padding:0 8px 16px 4px}.ieeesa-input-field:has(.mdc-line-ripple--active) .ieeesa-input-field__label{color:#00b5e2}.ieeesa-input-field:has(.mdc-line-ripple--active) .mat-mdc-form-field-focus-overlay{background-color:#1c1b1f;opacity:.2}.ieeesa-input-field:has(.mdc-text-field--invalid) .mdc-text-field--filled .mdc-line-ripple:after{border-bottom:2px solid #ba0c2f;opacity:.5}.ieeesa-input-field:has(.mdc-text-field--invalid) .ieeesa-input-field__btn--warning{display:block}.ieeesa-input-field:has(.mdc-text-field--invalid) .ieeesa-input-field__label{color:#ba0c2f}input::-webkit-outer-spin-button,input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}\n"] }]
-        }] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.3", ngImport: i0, type: DatepickerService, decorators: [{
+            type: Injectable,
+            args: [{
+                    providedIn: 'root',
+                }]
+        }], ctorParameters: function () { return []; } });
 
-class TextAreaComponent {
-    constructor() {
-        // eslint-disable-next-line @typescript-eslint/no-explicit-any
-        this.constants = buttonActionsInfo;
+const moment = moment_;
+class CustomDateAdapter extends MomentDateAdapter {
+    /**
+     * Overrides the getDayOfWeekNames method of MomentDateAdapter to show first letter of day in capital in date picker header.
+     * @return {string[]}
+     * @memberof CustomDateAdapter
+     */
+    getDayOfWeekNames() {
+        return ['S', 'M', 'T', 'W', 'T', 'F', 'S'];
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.3", ngImport: i0, type: TextAreaComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.3", type: TextAreaComponent, isStandalone: true, selector: "ieeesa-text-area", ngImport: i0, template: "<div\r\n  class=\"ieeesa-text-area-field\"\r\n  [formGroup]=\"group\"\r\n  [ngClass]=\"\r\n    config.isLabelAlignedLeft\r\n      ? 'ieeesa-text-area-field__label-left'\r\n      : 'ieeesa-text-area-field__label-top'\r\n  \"\r\n>\r\n  <mat-label class=\"ieeesa-body-sm-14 ieeesa-text-area-field__label\">{{\r\n    config.label\r\n  }}</mat-label>\r\n  <mat-form-field appearance=\"fill\">\r\n    <textarea\r\n      name=\"config.name\"\r\n      matInput\r\n      [placeholder]=\"config.placeholder ?? ''\"\r\n      [formControlName]=\"config.controlName\"\r\n      [maxlength]=\"config.maxLength ?? constants.textarea.maxLengthDefault\"\r\n      [readonly]=\"config.isReadonly\"\r\n      class=\"ieeesa-text-area-field__content ieeesa-body-lg-18\"\r\n      [ngClass]=\"\r\n        config.isResize\r\n          ? 'ieeesa-text-area-field__resize'\r\n          : 'ieeesa-text-area-field__no-resize'\r\n      \"\r\n    >\r\n  {{ config.value }}</textarea\r\n    >\r\n  </mat-form-field>\r\n  <ieeesa-form-error [formGroup]=\"group\" [config]=\"config\"> </ieeesa-form-error>\r\n</div>\r\n", styles: [".ieeesa-subtitle{text-align:left;font-family:Calibri Regular;font-size:1.56em;letter-spacing:0;color:#000;opacity:1}.ieeesa-body{text-align:left;font-family:Calibri Regular;font-size:1.25em;letter-spacing:0;color:#000;opacity:1}.ieeesa-display-lg-57{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:3.5625em;line-height:64px;color:#000;letter-spacing:0}.ieeesa-display-md-47{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:2.9375em;line-height:52px;color:#000;letter-spacing:0}.ieeesa-display-sm-38{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:2.375em;line-height:44px;color:#000;letter-spacing:0}.ieeesa-headline-lg-34{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:2.125em;line-height:40px;color:#000;letter-spacing:0}.ieeesa-headline-md-30{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1.875em;line-height:36px;color:#000;letter-spacing:0}.ieeesa-headline-sm-26{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1.625em;line-height:32px;color:#000;letter-spacing:0}.ieeesa-title-lg-bold-24{font-family:Calibri Regular;font-style:normal;font-weight:700;font-size:1.5em;line-height:28px;color:#000;letter-spacing:0}.ieeesa-title-lg-24{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1.5em;line-height:28px;color:#000;letter-spacing:0}.ieeesa-title-md-18{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1.125em;line-height:24px;color:#000;letter-spacing:.009375em}.ieeesa-title-sm-16{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1em;line-height:20px;color:#000;letter-spacing:.00625em}.ieeesa-label-lg-bold-16{font-family:Calibri Regular;font-style:normal;font-weight:700;font-size:1em;line-height:20px;color:#000;letter-spacing:.00625em}.ieeesa-label-lg-16{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1em;line-height:20px;color:#000;letter-spacing:.00625em}.ieeesa-label-md-14{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:.875em;line-height:16px;color:#000;letter-spacing:.03125em}.ieeesa-label-sm-13{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:.8125em;line-height:16px;color:#000;letter-spacing:.03125em}.ieeesa-body-lg-bold-18{font-family:Calibri Regular;font-style:normal;font-weight:700;font-size:1.125em;line-height:24px;color:#000;letter-spacing:.03125em}.ieeesa-body-lg-18{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1.125em;line-height:24px;color:#000;letter-spacing:.03125em}.ieeesa-body-md-16{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1em;line-height:20px;color:#000;letter-spacing:.015625em}.ieeesa-body-sm-14{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:.875em;line-height:16px;color:#000;letter-spacing:.025em}.ieeesa-title-inter-lg-bold-24{font-family:Inter Bold;font-style:normal;font-weight:700;font-size:1.5em;line-height:29px;color:#000;letter-spacing:0}.mat-mdc-button.mat-mdc-button-base.mat-primary-button,.mat-mdc-button.mat-mdc-button-base.mat-secondary-button{min-width:103px;width:auto;min-height:40px;height:auto;border-radius:3px;text-align:center;padding:.625em 1.5em;border:none;font-family:Calibri Regular;font-style:normal;font-weight:700;font-size:1em;line-height:20px;color:#000;letter-spacing:.00625em}.mat-mdc-button.mat-mdc-button-base>.mat-icon{margin-right:11px}.mat-mdc-button.mat-mdc-button-base.mat-primary-button{background-color:#00629b;color:#fff}.mat-mdc-button.mat-mdc-button-base.mat-primary-button:hover{background-color:#003e65}.mat-mdc-button.mat-mdc-button-base.mat-primary-button:active{background-color:#00629b}.mat-mdc-button.mat-mdc-button-base.mat-primary-button:disabled{background-color:#1c1b1f1f}.mat-mdc-button.mat-mdc-button-base.mat-secondary-button{color:#fff;background:#a7a8aa;box-shadow:0 1px 2px #0000004d,0 2px 6px 2px #00000026}.mat-mdc-button.mat-mdc-button-base.mat-secondary-button:hover{background:#a7a8aa}.mat-mdc-button.mat-mdc-button-base.mat-secondary-button:active{background:rgba(29,25,43,.12)}.mat-mdc-button.mat-mdc-button-base.mat-secondary-button:disabled{background:rgba(28,27,31,.12);color:#1c1b1f;opacity:.38}.ieeesa-text-button{color:#cac4d0;background:none;border:none}.flex-align-center{display:flex;align-items:center;justify-content:center}.mat-button-toggle-checked{background-color:#a7a8aa}.mat-button-toggle-checked .mat-button-toggle-label-content:before{font-family:\"Font Awesome 5 Free\";font-weight:900;content:\"\\f00c\";padding-right:.5625em}.mat-button-toggle-group .mat-button-toggle-label-content{font-family:Calibri Regular;font-style:normal;font-weight:700;font-size:1em;line-height:20px;color:#1c1b1f;letter-spacing:.00625em}@media (max-width: 768px){.mat-button-toggle-group .mat-button-toggle-label-content{max-width:8ch;text-overflow:ellipsis;white-space:nowrap;overflow:hidden;position:relative}}.cdk-overlay-pane{width:100%;min-width:312px}.ieeesa-text-area-field__label-left{display:flex}.ieeesa-text-area-field__label-top{display:block}.ieeesa-text-area-field__content{min-width:444px;min-height:40px;width:auto;height:auto;border:none;padding-left:14px;border-radius:4px 4px 0 0}.ieeesa-text-area-field__no-resize{resize:none}.ieeesa-text-area-field__resize{resize:auto}.ieeesa-text-area-field .mat-mdc-form-field{width:-webkit-fill-available}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i3.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i3.MaxLengthValidator, selector: "[maxlength][formControlName],[maxlength][formControl],[maxlength][ngModel]", inputs: ["maxlength"] }, { kind: "directive", type: i3.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i3.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "component", type: FormErrorComponent$1, selector: "ieeesa-form-error", inputs: ["formGroup", "config", "submitResponse"] }, { kind: "ngmodule", type: MatFormFieldModule }, { kind: "component", type: i4.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i4.MatLabel, selector: "mat-label" }, { kind: "ngmodule", type: MatInputModule }, { kind: "directive", type: i5.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl],      input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly"], exportAs: ["matInput"] }], encapsulation: i0.ViewEncapsulation.None }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.3", ngImport: i0, type: CustomDateAdapter, deps: null, target: i0.ɵɵFactoryTarget.Injectable }); }
+    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "16.1.3", ngImport: i0, type: CustomDateAdapter }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.3", ngImport: i0, type: TextAreaComponent, decorators: [{
-            type: Component,
-            args: [{ selector: 'ieeesa-text-area', standalone: true, imports: [
-                        CommonModule,
-                        ReactiveFormsModule,
-                        FormErrorComponent$1,
-                        MatFormFieldModule,
-                        MatInputModule,
-                    ], encapsulation: ViewEncapsulation.None, template: "<div\r\n  class=\"ieeesa-text-area-field\"\r\n  [formGroup]=\"group\"\r\n  [ngClass]=\"\r\n    config.isLabelAlignedLeft\r\n      ? 'ieeesa-text-area-field__label-left'\r\n      : 'ieeesa-text-area-field__label-top'\r\n  \"\r\n>\r\n  <mat-label class=\"ieeesa-body-sm-14 ieeesa-text-area-field__label\">{{\r\n    config.label\r\n  }}</mat-label>\r\n  <mat-form-field appearance=\"fill\">\r\n    <textarea\r\n      name=\"config.name\"\r\n      matInput\r\n      [placeholder]=\"config.placeholder ?? ''\"\r\n      [formControlName]=\"config.controlName\"\r\n      [maxlength]=\"config.maxLength ?? constants.textarea.maxLengthDefault\"\r\n      [readonly]=\"config.isReadonly\"\r\n      class=\"ieeesa-text-area-field__content ieeesa-body-lg-18\"\r\n      [ngClass]=\"\r\n        config.isResize\r\n          ? 'ieeesa-text-area-field__resize'\r\n          : 'ieeesa-text-area-field__no-resize'\r\n      \"\r\n    >\r\n  {{ config.value }}</textarea\r\n    >\r\n  </mat-form-field>\r\n  <ieeesa-form-error [formGroup]=\"group\" [config]=\"config\"> </ieeesa-form-error>\r\n</div>\r\n", styles: [".ieeesa-subtitle{text-align:left;font-family:Calibri Regular;font-size:1.56em;letter-spacing:0;color:#000;opacity:1}.ieeesa-body{text-align:left;font-family:Calibri Regular;font-size:1.25em;letter-spacing:0;color:#000;opacity:1}.ieeesa-display-lg-57{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:3.5625em;line-height:64px;color:#000;letter-spacing:0}.ieeesa-display-md-47{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:2.9375em;line-height:52px;color:#000;letter-spacing:0}.ieeesa-display-sm-38{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:2.375em;line-height:44px;color:#000;letter-spacing:0}.ieeesa-headline-lg-34{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:2.125em;line-height:40px;color:#000;letter-spacing:0}.ieeesa-headline-md-30{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1.875em;line-height:36px;color:#000;letter-spacing:0}.ieeesa-headline-sm-26{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1.625em;line-height:32px;color:#000;letter-spacing:0}.ieeesa-title-lg-bold-24{font-family:Calibri Regular;font-style:normal;font-weight:700;font-size:1.5em;line-height:28px;color:#000;letter-spacing:0}.ieeesa-title-lg-24{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1.5em;line-height:28px;color:#000;letter-spacing:0}.ieeesa-title-md-18{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1.125em;line-height:24px;color:#000;letter-spacing:.009375em}.ieeesa-title-sm-16{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1em;line-height:20px;color:#000;letter-spacing:.00625em}.ieeesa-label-lg-bold-16{font-family:Calibri Regular;font-style:normal;font-weight:700;font-size:1em;line-height:20px;color:#000;letter-spacing:.00625em}.ieeesa-label-lg-16{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1em;line-height:20px;color:#000;letter-spacing:.00625em}.ieeesa-label-md-14{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:.875em;line-height:16px;color:#000;letter-spacing:.03125em}.ieeesa-label-sm-13{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:.8125em;line-height:16px;color:#000;letter-spacing:.03125em}.ieeesa-body-lg-bold-18{font-family:Calibri Regular;font-style:normal;font-weight:700;font-size:1.125em;line-height:24px;color:#000;letter-spacing:.03125em}.ieeesa-body-lg-18{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1.125em;line-height:24px;color:#000;letter-spacing:.03125em}.ieeesa-body-md-16{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1em;line-height:20px;color:#000;letter-spacing:.015625em}.ieeesa-body-sm-14{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:.875em;line-height:16px;color:#000;letter-spacing:.025em}.ieeesa-title-inter-lg-bold-24{font-family:Inter Bold;font-style:normal;font-weight:700;font-size:1.5em;line-height:29px;color:#000;letter-spacing:0}.mat-mdc-button.mat-mdc-button-base.mat-primary-button,.mat-mdc-button.mat-mdc-button-base.mat-secondary-button{min-width:103px;width:auto;min-height:40px;height:auto;border-radius:3px;text-align:center;padding:.625em 1.5em;border:none;font-family:Calibri Regular;font-style:normal;font-weight:700;font-size:1em;line-height:20px;color:#000;letter-spacing:.00625em}.mat-mdc-button.mat-mdc-button-base>.mat-icon{margin-right:11px}.mat-mdc-button.mat-mdc-button-base.mat-primary-button{background-color:#00629b;color:#fff}.mat-mdc-button.mat-mdc-button-base.mat-primary-button:hover{background-color:#003e65}.mat-mdc-button.mat-mdc-button-base.mat-primary-button:active{background-color:#00629b}.mat-mdc-button.mat-mdc-button-base.mat-primary-button:disabled{background-color:#1c1b1f1f}.mat-mdc-button.mat-mdc-button-base.mat-secondary-button{color:#fff;background:#a7a8aa;box-shadow:0 1px 2px #0000004d,0 2px 6px 2px #00000026}.mat-mdc-button.mat-mdc-button-base.mat-secondary-button:hover{background:#a7a8aa}.mat-mdc-button.mat-mdc-button-base.mat-secondary-button:active{background:rgba(29,25,43,.12)}.mat-mdc-button.mat-mdc-button-base.mat-secondary-button:disabled{background:rgba(28,27,31,.12);color:#1c1b1f;opacity:.38}.ieeesa-text-button{color:#cac4d0;background:none;border:none}.flex-align-center{display:flex;align-items:center;justify-content:center}.mat-button-toggle-checked{background-color:#a7a8aa}.mat-button-toggle-checked .mat-button-toggle-label-content:before{font-family:\"Font Awesome 5 Free\";font-weight:900;content:\"\\f00c\";padding-right:.5625em}.mat-button-toggle-group .mat-button-toggle-label-content{font-family:Calibri Regular;font-style:normal;font-weight:700;font-size:1em;line-height:20px;color:#1c1b1f;letter-spacing:.00625em}@media (max-width: 768px){.mat-button-toggle-group .mat-button-toggle-label-content{max-width:8ch;text-overflow:ellipsis;white-space:nowrap;overflow:hidden;position:relative}}.cdk-overlay-pane{width:100%;min-width:312px}.ieeesa-text-area-field__label-left{display:flex}.ieeesa-text-area-field__label-top{display:block}.ieeesa-text-area-field__content{min-width:444px;min-height:40px;width:auto;height:auto;border:none;padding-left:14px;border-radius:4px 4px 0 0}.ieeesa-text-area-field__no-resize{resize:none}.ieeesa-text-area-field__resize{resize:auto}.ieeesa-text-area-field .mat-mdc-form-field{width:-webkit-fill-available}\n"] }]
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.3", ngImport: i0, type: CustomDateAdapter, decorators: [{
+            type: Injectable
         }] });
-
 /**
- * Provides implementation of form field radio type component
+ * Date selection of type SINGLE_DATE_SELECTION, DATE_RANGE_SELECTION and CALENDAR and handling of calendar events.
  * @export
- * @class RadioComponent
- * @implements {OnInit}
+ * @class DatePickerComponent
  * @implements {FormField}
+ * @implements {OnInit}
+ * @implements {AfterViewInit}
  */
-class RadioComponent {
-    // eslint-disable-next-line no-unused-vars, no-empty-function
-    constructor(formUtilityService) {
-        this.formUtilityService = formUtilityService;
-        this.formControlName = 'radio';
-        this.radioGroup = [];
-        this.isDisabled = false;
-        this.selectedRadioOption = new EventEmitter();
-    }
+class DatePickerComponent {
     /**
-     * Implementation of ngOnInit lifecycle hook method to create form group and initialize components instance properties
-     * @memberof RadioComponent
+     * Gets preselected dates as an input.
+     * @memberof DatePickerComponent
      */
-    ngOnInit() {
-        if (!this.group) {
-            this.group =
-                this.group ??
-                    this.formUtilityService.getFormGroup(this.formControlName);
+    set selectedDates(value) {
+        this._selectedDates = value;
+        if (this.formControlName &&
+            this.selectedDates?.length === 1 &&
+            this.selectedDates[0] !== undefined &&
+            this.calendarType === CalendarType.SINGLE_DATE_SELECTION) {
+            this.datepickerService.selectedDate = value[0];
+            this.createFormGroup(value[0]);
+            this.datepickerService.isRangeSelection = false;
         }
-        this.initializeConfigProperties();
     }
     /**
-     * Initializes the components instance properties from config else it defines config
-     * @memberof RadioComponent
+     * Returns selected dates
+     * @readonly
+     * @type {string[]}
+     * @memberof DatePickerComponent
      */
-    initializeConfigProperties() {
-        if (this.config?.radioOptions) {
-            this.radioGroup = this.config.radioOptions;
-            this.isDisabled = this.config?.disabled ?? false;
-        }
-        this.config =
-            this.config ??
-                this.formUtilityService.getFormFieldConfig(this.formControlName, FormControlType$1.RADIO);
+    get selectedDates() {
+        return this._selectedDates;
     }
     /**
-     * Handles radio selection event on change of it
-     * @param {RadioOption} value
-     * @memberof RadioComponent
+     * Gets preselected date range as an input.
+     * @memberof DatePickerComponent
      */
-    onChange(value) {
-        this.selectedRadioOption.emit(value);
+    set selectedRange(value) {
+        this._selectedRange = value;
+        if (this.selectedRange?.length === 2 &&
+            this.calendarType === CalendarType.DATE_RANGE_SELECTION) {
+            this.createFormGroupWithRangeControls(value[0], value[1]);
+            this.setDateRange(value[0], value[1]);
+            this.datepickerService.isRangeSelection = true;
+        }
     }
     /**
-     * Allows Angular to detect the specific radio option that needs to change or be added instead of rebuilding the whole radio options in DOM by tracking option unique Id.
-     * @param {number} index
-     * @return {number}
-     * @memberof RadioComponent
+     * Returns selected date range
+     * @readonly
+     * @type {string[]}
+     * @memberof DatePickerComponent
      */
-    trackById(index, radio) {
-        return radio.id;
+    get selectedRange() {
+        return this._selectedRange;
+    }
+    constructor(
+    // eslint-disable-next-line no-unused-vars
+    fb, 
+    // eslint-disable-next-line no-unused-vars
+    changeDetectorRef, 
+    // eslint-disable-next-line no-unused-vars
+    datepickerService, 
+    // eslint-disable-next-line no-unused-vars
+    formUtilityService // eslint-disable-next-line no-empty-function,
+    ) {
+        this.fb = fb;
+        this.changeDetectorRef = changeDetectorRef;
+        this.datepickerService = datepickerService;
+        this.formUtilityService = formUtilityService;
+        this.datePickerHeader = DatePickerHeaderComponent;
+        this.calendarTypes = CalendarType;
+        this._selectedDates = [];
+        this._selectedRange = [];
+        this.calendarType = CalendarType.SINGLE_DATE_SELECTION;
+        this.placeholderLabel = '';
+        this.isDisabled = false;
+        this.isLabelAlignedLeft = false;
+        this.datepickerLabel = '';
+        this.selectedDate = new EventEmitter();
+        this.selectedDateRange = new EventEmitter();
+        // eslint-disable-next-line @typescript-eslint/no-explicit-any
+        this.buttonActionsInfo = constantsInfo;
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.3", ngImport: i0, type: RadioComponent, deps: [{ token: i1.FormUtilityService }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.3", type: RadioComponent, isStandalone: true, selector: "ieeesa-radio", inputs: { formControlName: "formControlName", radioGroup: "radioGroup", isDisabled: "isDisabled" }, outputs: { selectedRadioOption: "selectedRadioOption" }, ngImport: i0, template: "<div [formGroup]=\"group\" class=\"ieeesa-radio-field\" *ngIf=\"group\">\r\n  <mat-label\r\n    class=\"ieeesa-body-sm-14 ieeesa-radio-field__label\"\r\n    [ngClass]=\"\r\n      config.isLabelAlignedLeft\r\n        ? 'ieeesa-radio-field__label-left'\r\n        : 'ieeesa-radio-field__label-top'\r\n    \"\r\n    >{{ config.label }}</mat-label\r\n  >\r\n  <mat-radio-group\r\n    [formControlName]=\"config.controlName\"\r\n    [disabled]=\"isDisabled\"\r\n  >\r\n    <mat-radio-button\r\n      *ngFor=\"let radio of radioGroup; trackBy: trackById\"\r\n      [value]=\"radio.label\"\r\n      [name]=\"radio.label\"\r\n      [id]=\"'' + radio.id\"\r\n      (change)=\"onChange(radio)\"\r\n      [checked]=\"radio.checked\"\r\n      class=\"ieeesa-radio-field__button\"\r\n    >\r\n      {{ radio.label }}\r\n    </mat-radio-button>\r\n  </mat-radio-group>\r\n  <ieeesa-form-error [formGroup]=\"group\" [config]=\"config\"> </ieeesa-form-error>\r\n</div>\r\n", styles: [".ieeesa-subtitle{text-align:left;font-family:Calibri Regular;font-size:1.56em;letter-spacing:0;color:#000;opacity:1}.ieeesa-body{text-align:left;font-family:Calibri Regular;font-size:1.25em;letter-spacing:0;color:#000;opacity:1}.ieeesa-display-lg-57{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:3.5625em;line-height:64px;color:#000;letter-spacing:0}.ieeesa-display-md-47{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:2.9375em;line-height:52px;color:#000;letter-spacing:0}.ieeesa-display-sm-38{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:2.375em;line-height:44px;color:#000;letter-spacing:0}.ieeesa-headline-lg-34{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:2.125em;line-height:40px;color:#000;letter-spacing:0}.ieeesa-headline-md-30{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1.875em;line-height:36px;color:#000;letter-spacing:0}.ieeesa-headline-sm-26{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1.625em;line-height:32px;color:#000;letter-spacing:0}.ieeesa-title-lg-bold-24{font-family:Calibri Regular;font-style:normal;font-weight:700;font-size:1.5em;line-height:28px;color:#000;letter-spacing:0}.ieeesa-title-lg-24{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1.5em;line-height:28px;color:#000;letter-spacing:0}.ieeesa-title-md-18{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1.125em;line-height:24px;color:#000;letter-spacing:.009375em}.ieeesa-title-sm-16{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1em;line-height:20px;color:#000;letter-spacing:.00625em}.ieeesa-label-lg-bold-16{font-family:Calibri Regular;font-style:normal;font-weight:700;font-size:1em;line-height:20px;color:#000;letter-spacing:.00625em}.ieeesa-label-lg-16{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1em;line-height:20px;color:#000;letter-spacing:.00625em}.ieeesa-label-md-14{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:.875em;line-height:16px;color:#000;letter-spacing:.03125em}.ieeesa-label-sm-13{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:.8125em;line-height:16px;color:#000;letter-spacing:.03125em}.ieeesa-body-lg-bold-18{font-family:Calibri Regular;font-style:normal;font-weight:700;font-size:1.125em;line-height:24px;color:#000;letter-spacing:.03125em}.ieeesa-body-lg-18{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1.125em;line-height:24px;color:#000;letter-spacing:.03125em}.ieeesa-body-md-16{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1em;line-height:20px;color:#000;letter-spacing:.015625em}.ieeesa-body-sm-14{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:.875em;line-height:16px;color:#000;letter-spacing:.025em}.ieeesa-title-inter-lg-bold-24{font-family:Inter Bold;font-style:normal;font-weight:700;font-size:1.5em;line-height:29px;color:#000;letter-spacing:0}.mat-mdc-button.mat-mdc-button-base.mat-primary-button,.mat-mdc-button.mat-mdc-button-base.mat-secondary-button{min-width:103px;width:auto;min-height:40px;height:auto;border-radius:3px;text-align:center;padding:.625em 1.5em;border:none;font-family:Calibri Regular;font-style:normal;font-weight:700;font-size:1em;line-height:20px;color:#000;letter-spacing:.00625em}.mat-mdc-button.mat-mdc-button-base>.mat-icon{margin-right:11px}.mat-mdc-button.mat-mdc-button-base.mat-primary-button{background-color:#00629b;color:#fff}.mat-mdc-button.mat-mdc-button-base.mat-primary-button:hover{background-color:#003e65}.mat-mdc-button.mat-mdc-button-base.mat-primary-button:active{background-color:#00629b}.mat-mdc-button.mat-mdc-button-base.mat-primary-button:disabled{background-color:#1c1b1f1f}.mat-mdc-button.mat-mdc-button-base.mat-secondary-button{color:#fff;background:#a7a8aa;box-shadow:0 1px 2px #0000004d,0 2px 6px 2px #00000026}.mat-mdc-button.mat-mdc-button-base.mat-secondary-button:hover{background:#a7a8aa}.mat-mdc-button.mat-mdc-button-base.mat-secondary-button:active{background:rgba(29,25,43,.12)}.mat-mdc-button.mat-mdc-button-base.mat-secondary-button:disabled{background:rgba(28,27,31,.12);color:#1c1b1f;opacity:.38}.ieeesa-text-button{color:#cac4d0;background:none;border:none}.flex-align-center{display:flex;align-items:center;justify-content:center}.mat-button-toggle-checked{background-color:#a7a8aa}.mat-button-toggle-checked .mat-button-toggle-label-content:before{font-family:\"Font Awesome 5 Free\";font-weight:900;content:\"\\f00c\";padding-right:.5625em}.mat-button-toggle-group .mat-button-toggle-label-content{font-family:Calibri Regular;font-style:normal;font-weight:700;font-size:1em;line-height:20px;color:#1c1b1f;letter-spacing:.00625em}@media (max-width: 768px){.mat-button-toggle-group .mat-button-toggle-label-content{max-width:8ch;text-overflow:ellipsis;white-space:nowrap;overflow:hidden;position:relative}}.cdk-overlay-pane{width:100%;min-width:312px}.ieeesa-radio-field__label-left{display:inline-block;padding-right:20%}.ieeesa-radio-field__label-top{display:block}.ieeesa-radio-field .mat-mdc-radio-button .mdc-radio .mdc-radio__native-control:enabled+.mdc-radio__background .mdc-radio__inner-circle{border-color:#00b5e2!important}.ieeesa-radio-field .mat-mdc-radio-button .mdc-radio .mdc-radio__native-control:enabled:checked+.mdc-radio__background .mdc-radio__outer-circle{border-color:#00b5e2!important}.ieeesa-radio-field .mat-mdc-radio-button .mdc-radio .mdc-radio__native-control:enabled:not(:checked)+.mdc-radio__background .mdc-radio__outer-circle{border-color:#49454f}.ieeesa-radio-field .mat-mdc-radio-button .mdc-radio:hover .mdc-radio__native-control:enabled:not(:checked)+.mdc-radio__background .mdc-radio__outer-circle{border-color:#1c1b1f}.ieeesa-radio-field .mat-ripple-element{background-color:#6750a4}.ieeesa-radio-field .mat-mdc-radio-button.mat-mdc-radio-checked .mat-ripple-element{background-color:#1c1b1f}.ieeesa-radio-field .mat-mdc-radio-button .mat-radio-ripple .mat-ripple-element{opacity:.12}.ieeesa-radio-field .mat-mdc-radio-button .mdc-radio:hover .mdc-radio__native-control:not([disabled]):not(:focus)~.mdc-radio__background:before{opacity:.08}.ieeesa-radio-field .mat-mdc-radio-button.mat-accent{--mat-mdc-radio-checked-ripple-color: $ieeesa-radio-ripple-blue-color;--mat-mdc-radio-ripple-color: $ieeesa-background-black}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "ngmodule", type: MatRadioModule }, { kind: "directive", type: i3$1.MatRadioGroup, selector: "mat-radio-group", exportAs: ["matRadioGroup"] }, { kind: "component", type: i3$1.MatRadioButton, selector: "mat-radio-button", inputs: ["disableRipple", "tabIndex"], exportAs: ["matRadioButton"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i3.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i3.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "component", type: FormErrorComponent$1, selector: "ieeesa-form-error", inputs: ["formGroup", "config", "submitResponse"] }, { kind: "ngmodule", type: MatFormFieldModule }, { kind: "directive", type: i4.MatLabel, selector: "mat-label" }], encapsulation: i0.ViewEncapsulation.None }); }
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.3", ngImport: i0, type: RadioComponent, decorators: [{
-            type: Component,
-            args: [{ selector: 'ieeesa-radio', standalone: true, imports: [
-                        CommonModule,
-                        MatRadioModule,
-                        ReactiveFormsModule,
-                        FormErrorComponent$1,
-                        MatFormFieldModule,
-                    ], encapsulation: ViewEncapsulation.None, template: "<div [formGroup]=\"group\" class=\"ieeesa-radio-field\" *ngIf=\"group\">\r\n  <mat-label\r\n    class=\"ieeesa-body-sm-14 ieeesa-radio-field__label\"\r\n    [ngClass]=\"\r\n      config.isLabelAlignedLeft\r\n        ? 'ieeesa-radio-field__label-left'\r\n        : 'ieeesa-radio-field__label-top'\r\n    \"\r\n    >{{ config.label }}</mat-label\r\n  >\r\n  <mat-radio-group\r\n    [formControlName]=\"config.controlName\"\r\n    [disabled]=\"isDisabled\"\r\n  >\r\n    <mat-radio-button\r\n      *ngFor=\"let radio of radioGroup; trackBy: trackById\"\r\n      [value]=\"radio.label\"\r\n      [name]=\"radio.label\"\r\n      [id]=\"'' + radio.id\"\r\n      (change)=\"onChange(radio)\"\r\n      [checked]=\"radio.checked\"\r\n      class=\"ieeesa-radio-field__button\"\r\n    >\r\n      {{ radio.label }}\r\n    </mat-radio-button>\r\n  </mat-radio-group>\r\n  <ieeesa-form-error [formGroup]=\"group\" [config]=\"config\"> </ieeesa-form-error>\r\n</div>\r\n", styles: [".ieeesa-subtitle{text-align:left;font-family:Calibri Regular;font-size:1.56em;letter-spacing:0;color:#000;opacity:1}.ieeesa-body{text-align:left;font-family:Calibri Regular;font-size:1.25em;letter-spacing:0;color:#000;opacity:1}.ieeesa-display-lg-57{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:3.5625em;line-height:64px;color:#000;letter-spacing:0}.ieeesa-display-md-47{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:2.9375em;line-height:52px;color:#000;letter-spacing:0}.ieeesa-display-sm-38{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:2.375em;line-height:44px;color:#000;letter-spacing:0}.ieeesa-headline-lg-34{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:2.125em;line-height:40px;color:#000;letter-spacing:0}.ieeesa-headline-md-30{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1.875em;line-height:36px;color:#000;letter-spacing:0}.ieeesa-headline-sm-26{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1.625em;line-height:32px;color:#000;letter-spacing:0}.ieeesa-title-lg-bold-24{font-family:Calibri Regular;font-style:normal;font-weight:700;font-size:1.5em;line-height:28px;color:#000;letter-spacing:0}.ieeesa-title-lg-24{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1.5em;line-height:28px;color:#000;letter-spacing:0}.ieeesa-title-md-18{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1.125em;line-height:24px;color:#000;letter-spacing:.009375em}.ieeesa-title-sm-16{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1em;line-height:20px;color:#000;letter-spacing:.00625em}.ieeesa-label-lg-bold-16{font-family:Calibri Regular;font-style:normal;font-weight:700;font-size:1em;line-height:20px;color:#000;letter-spacing:.00625em}.ieeesa-label-lg-16{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1em;line-height:20px;color:#000;letter-spacing:.00625em}.ieeesa-label-md-14{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:.875em;line-height:16px;color:#000;letter-spacing:.03125em}.ieeesa-label-sm-13{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:.8125em;line-height:16px;color:#000;letter-spacing:.03125em}.ieeesa-body-lg-bold-18{font-family:Calibri Regular;font-style:normal;font-weight:700;font-size:1.125em;line-height:24px;color:#000;letter-spacing:.03125em}.ieeesa-body-lg-18{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1.125em;line-height:24px;color:#000;letter-spacing:.03125em}.ieeesa-body-md-16{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1em;line-height:20px;color:#000;letter-spacing:.015625em}.ieeesa-body-sm-14{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:.875em;line-height:16px;color:#000;letter-spacing:.025em}.ieeesa-title-inter-lg-bold-24{font-family:Inter Bold;font-style:normal;font-weight:700;font-size:1.5em;line-height:29px;color:#000;letter-spacing:0}.mat-mdc-button.mat-mdc-button-base.mat-primary-button,.mat-mdc-button.mat-mdc-button-base.mat-secondary-button{min-width:103px;width:auto;min-height:40px;height:auto;border-radius:3px;text-align:center;padding:.625em 1.5em;border:none;font-family:Calibri Regular;font-style:normal;font-weight:700;font-size:1em;line-height:20px;color:#000;letter-spacing:.00625em}.mat-mdc-button.mat-mdc-button-base>.mat-icon{margin-right:11px}.mat-mdc-button.mat-mdc-button-base.mat-primary-button{background-color:#00629b;color:#fff}.mat-mdc-button.mat-mdc-button-base.mat-primary-button:hover{background-color:#003e65}.mat-mdc-button.mat-mdc-button-base.mat-primary-button:active{background-color:#00629b}.mat-mdc-button.mat-mdc-button-base.mat-primary-button:disabled{background-color:#1c1b1f1f}.mat-mdc-button.mat-mdc-button-base.mat-secondary-button{color:#fff;background:#a7a8aa;box-shadow:0 1px 2px #0000004d,0 2px 6px 2px #00000026}.mat-mdc-button.mat-mdc-button-base.mat-secondary-button:hover{background:#a7a8aa}.mat-mdc-button.mat-mdc-button-base.mat-secondary-button:active{background:rgba(29,25,43,.12)}.mat-mdc-button.mat-mdc-button-base.mat-secondary-button:disabled{background:rgba(28,27,31,.12);color:#1c1b1f;opacity:.38}.ieeesa-text-button{color:#cac4d0;background:none;border:none}.flex-align-center{display:flex;align-items:center;justify-content:center}.mat-button-toggle-checked{background-color:#a7a8aa}.mat-button-toggle-checked .mat-button-toggle-label-content:before{font-family:\"Font Awesome 5 Free\";font-weight:900;content:\"\\f00c\";padding-right:.5625em}.mat-button-toggle-group .mat-button-toggle-label-content{font-family:Calibri Regular;font-style:normal;font-weight:700;font-size:1em;line-height:20px;color:#1c1b1f;letter-spacing:.00625em}@media (max-width: 768px){.mat-button-toggle-group .mat-button-toggle-label-content{max-width:8ch;text-overflow:ellipsis;white-space:nowrap;overflow:hidden;position:relative}}.cdk-overlay-pane{width:100%;min-width:312px}.ieeesa-radio-field__label-left{display:inline-block;padding-right:20%}.ieeesa-radio-field__label-top{display:block}.ieeesa-radio-field .mat-mdc-radio-button .mdc-radio .mdc-radio__native-control:enabled+.mdc-radio__background .mdc-radio__inner-circle{border-color:#00b5e2!important}.ieeesa-radio-field .mat-mdc-radio-button .mdc-radio .mdc-radio__native-control:enabled:checked+.mdc-radio__background .mdc-radio__outer-circle{border-color:#00b5e2!important}.ieeesa-radio-field .mat-mdc-radio-button .mdc-radio .mdc-radio__native-control:enabled:not(:checked)+.mdc-radio__background .mdc-radio__outer-circle{border-color:#49454f}.ieeesa-radio-field .mat-mdc-radio-button .mdc-radio:hover .mdc-radio__native-control:enabled:not(:checked)+.mdc-radio__background .mdc-radio__outer-circle{border-color:#1c1b1f}.ieeesa-radio-field .mat-ripple-element{background-color:#6750a4}.ieeesa-radio-field .mat-mdc-radio-button.mat-mdc-radio-checked .mat-ripple-element{background-color:#1c1b1f}.ieeesa-radio-field .mat-mdc-radio-button .mat-radio-ripple .mat-ripple-element{opacity:.12}.ieeesa-radio-field .mat-mdc-radio-button .mdc-radio:hover .mdc-radio__native-control:not([disabled]):not(:focus)~.mdc-radio__background:before{opacity:.08}.ieeesa-radio-field .mat-mdc-radio-button.mat-accent{--mat-mdc-radio-checked-ripple-color: $ieeesa-radio-ripple-blue-color;--mat-mdc-radio-ripple-color: $ieeesa-background-black}\n"] }]
-        }], ctorParameters: function () { return [{ type: i1.FormUtilityService }]; }, propDecorators: { formControlName: [{
-                type: Input
-            }], radioGroup: [{
-                type: Input
-            }], isDisabled: [{
-                type: Input
-            }], selectedRadioOption: [{
-                type: Output
-            }] } });
-
-/**
- * Provides implementation of all types of checkboxes.
- * @export
- * @class CheckboxComponent
- * @implements {OnInit}
- * @implements {FormField}
- */
-class CheckboxComponent {
     /**
-     * Input property to get checkbox options.
-     * @memberof CheckboxComponent
-     * @usageNotes const checkboxes = [{ id: 1, name:"Angular"}]
+     * Implementation of  ngOnInit lifecycle hook method to creates config if its undefined and sets components instance variables if config is defined. Sets the form group value if form group is defined.
+     * @memberof DatePickerComponent
      */
-    set checkboxes(value) {
-        this._checkboxes = value;
+    ngOnInit() {
+        if (!this.config) {
+            const controlName = this.formControlName ?? 'datepicker';
+            this.config = this.formUtilityService.getFormFieldConfig(controlName, FormControlType.DATE);
+            if (this.config &&
+                this.calendarType === CalendarType.DATE_RANGE_SELECTION) {
+                this.config.dateRangeControls = {
+                    startDate: 'startDate',
+                    endDate: 'endDate',
+                };
+            }
+        }
+        else {
+            this.initializePropertiesFromConfig();
+        }
+        if (!this.group) {
+            if (this.calendarType === CalendarType.SINGLE_DATE_SELECTION) {
+                this.createFormGroup();
+            }
+            else if (this.calendarType === CalendarType.DATE_RANGE_SELECTION) {
+                this.createFormGroupWithRangeControls();
+            }
+        }
     }
-    get checkboxes() {
-        return this._checkboxes;
+    /**
+     * Initializes properties from the config input
+     * @memberof DatePickerComponent
+     */
+    initializePropertiesFromConfig() {
+        this.calendarType =
+            this.config?.datePicker?.calendarType ??
+                CalendarType.SINGLE_DATE_SELECTION;
+        this.placeholderLabel = this.config?.datePicker?.placeholderLabel ?? '';
+        this.datepickerLabel = this.config?.datePicker?.label ?? '';
+        this.isLabelAlignedLeft =
+            this.config?.datePicker?.isLabelAlignedLeft ?? false;
+        this.dateRange = this.config?.datePicker?.dateRange ?? {
+            minDate: '',
+            maxDate: '',
+        };
+        this.isDisabled = !!this.config.disabled;
+        if (this.config.datePicker?.calendarType === CalendarType.DATE_RANGE_SELECTION) {
+            this.group.addControl('startDate', new FormControl());
+            this.group.addControl('endDate', new FormControl());
+        }
     }
-    // eslint-disable-next-line no-unused-vars, no-empty-function
-    constructor(formUtilityService) {
-        this.formUtilityService = formUtilityService;
-        this.checkboxSelection = new EventEmitter();
+    /**
+     * Handle date change event and emits the selected date.
+     * @memberof DatePickerComponent
+     */
+    onDateChange() {
+        this.selectedDate.emit(this.group?.get(this.config.controlName)?.value);
+        this.datepickerService.selectedDate = this.group?.get(this.config.controlName)?.value;
+        this.datepickerService.isRangeSelection = false;
     }
     /**
-     * Implementation of ngOnInit lifecycle hook method of component to initialize component instance properties.
-     * @memberof CheckboxComponent
+     * Sets and emits selected date range
+     * @memberof DatePickerComponent
      */
-    ngOnInit() {
-        this.createFormGroupAndInitializeProperties();
+    onDateRangeChange() {
+        this.datepickerService.isRangeSelection = true;
+        this.setDateRange(this.group.value.startDate ?? '', this.group.value.endDate ?? '');
+        this.selectedDateRange.emit({
+            startDate: this.group.value.startDate ?? '',
+            endDate: this.group.value.endDate ?? '',
+        });
     }
     /**
-     * Creates form group and initializes components properties from config.
-     * @memberof CheckboxComponent
+     * Sets the min and max date range.
+     * @param {(string | Date)} startDate
+     * @param {(string | Date)} endDate
+     * @memberof DatePickerComponent
      */
-    createFormGroupAndInitializeProperties() {
-        this.checkboxes = this.config?.checkboxOptions ?? this.checkboxes;
-        this.group = this.group ?? this.formUtilityService.getFormGroup('checkbox');
-        this.checkboxes?.forEach((checkbox) => {
-            this.group.addControl(checkbox.id, new FormControl({
-                value: checkbox.checked,
-                disabled: checkbox.disabled,
-            }));
+    setDateRange(startDate, endDate) {
+        this.datepickerService.range.next({
+            start: startDate,
+            end: endDate,
         });
     }
     /**
-     * Sets checkbox selection and emits selected option on change event.
-     * @param {CheckboxOption} option
-     * @param {boolean} checked
-     * @memberof CheckboxComponent
+     * Creates form group and initializes form value
+     * @param {string} [date]
+     * @memberof DatePickerComponent
      */
-    onChange(option, checked) {
-        option.checked = checked;
-        this.checkboxSelection.emit(option);
+    createFormGroup(date) {
+        this.group = this.fb.group({
+            [this.formControlName ? this.formControlName : 'datepicker']: date
+                ? [moment(date).utc(true).format()]
+                : [],
+        });
     }
     /**
-     * Allows Angular to detect the specific checkbox option that needs to change or be added instead of rebuilding the whole checkbox options in DOM by tracking option unique Id.
-     * @param {number} index
-     * @return {number}
-     * @memberof CheckboxComponent
+     * Creates form group with range type of controls and sets the min and max range values.
+     * @param {string} [startDate]
+     * @param {string} [endDate]
+     * @memberof DatePickerComponent
      */
-    trackById(index, option) {
-        return option.id;
+    createFormGroupWithRangeControls(startDate, endDate) {
+        this.group = this.fb.group({
+            startDate: startDate ? [moment(startDate).utc(true).format()] : [],
+            endDate: endDate ? [moment(endDate).utc(true).format()] : [],
+        });
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.3", ngImport: i0, type: CheckboxComponent, deps: [{ token: i1.FormUtilityService }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.3", type: CheckboxComponent, isStandalone: true, selector: "ieeesa-checkbox", inputs: { checkboxes: "checkboxes" }, outputs: { checkboxSelection: "checkboxSelection" }, ngImport: i0, template: "<div\r\n  [formGroup]=\"group\"\r\n  class=\"ieeesa-checkbox-field\"\r\n  *ngIf=\"group\"\r\n  [ngClass]=\"\r\n    config.isLabelAlignedLeft\r\n      ? 'ieeesa-checkbox-field__label-left'\r\n      : 'ieeesa-checkbox-field__label-top'\r\n  \"\r\n>\r\n  <mat-label class=\"ieeesa-body-sm-14 ieeesa-checkbox-field__label\">{{\r\n    config.label\r\n  }}</mat-label>\r\n  <mat-list>\r\n    <mat-checkbox\r\n      *ngFor=\"let option of checkboxes; trackBy: trackById\"\r\n      [formControlName]=\"option.id\"\r\n      (change)=\"onChange(option, true)\"\r\n      [disabled]=\"option.disabled\"\r\n      [checked]=\"option.checked\"\r\n    >\r\n      {{ option.name }}\r\n    </mat-checkbox>\r\n  </mat-list>\r\n  <ieeesa-form-error [formGroup]=\"group\" [config]=\"config\"> </ieeesa-form-error>\r\n</div>\r\n", styles: [".ieeesa-subtitle{text-align:left;font-family:Calibri Regular;font-size:1.56em;letter-spacing:0;color:#000;opacity:1}.ieeesa-body{text-align:left;font-family:Calibri Regular;font-size:1.25em;letter-spacing:0;color:#000;opacity:1}.ieeesa-display-lg-57{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:3.5625em;line-height:64px;color:#000;letter-spacing:0}.ieeesa-display-md-47{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:2.9375em;line-height:52px;color:#000;letter-spacing:0}.ieeesa-display-sm-38{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:2.375em;line-height:44px;color:#000;letter-spacing:0}.ieeesa-headline-lg-34{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:2.125em;line-height:40px;color:#000;letter-spacing:0}.ieeesa-headline-md-30{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1.875em;line-height:36px;color:#000;letter-spacing:0}.ieeesa-headline-sm-26{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1.625em;line-height:32px;color:#000;letter-spacing:0}.ieeesa-title-lg-bold-24{font-family:Calibri Regular;font-style:normal;font-weight:700;font-size:1.5em;line-height:28px;color:#000;letter-spacing:0}.ieeesa-title-lg-24{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1.5em;line-height:28px;color:#000;letter-spacing:0}.ieeesa-title-md-18{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1.125em;line-height:24px;color:#000;letter-spacing:.009375em}.ieeesa-title-sm-16{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1em;line-height:20px;color:#000;letter-spacing:.00625em}.ieeesa-label-lg-bold-16{font-family:Calibri Regular;font-style:normal;font-weight:700;font-size:1em;line-height:20px;color:#000;letter-spacing:.00625em}.ieeesa-label-lg-16{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1em;line-height:20px;color:#000;letter-spacing:.00625em}.ieeesa-label-md-14{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:.875em;line-height:16px;color:#000;letter-spacing:.03125em}.ieeesa-label-sm-13{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:.8125em;line-height:16px;color:#000;letter-spacing:.03125em}.ieeesa-body-lg-bold-18{font-family:Calibri Regular;font-style:normal;font-weight:700;font-size:1.125em;line-height:24px;color:#000;letter-spacing:.03125em}.ieeesa-body-lg-18{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1.125em;line-height:24px;color:#000;letter-spacing:.03125em}.ieeesa-body-md-16{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1em;line-height:20px;color:#000;letter-spacing:.015625em}.ieeesa-body-sm-14{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:.875em;line-height:16px;color:#000;letter-spacing:.025em}.ieeesa-title-inter-lg-bold-24{font-family:Inter Bold;font-style:normal;font-weight:700;font-size:1.5em;line-height:29px;color:#000;letter-spacing:0}.mat-mdc-button.mat-mdc-button-base.mat-primary-button,.mat-mdc-button.mat-mdc-button-base.mat-secondary-button{min-width:103px;width:auto;min-height:40px;height:auto;border-radius:3px;text-align:center;padding:.625em 1.5em;border:none;font-family:Calibri Regular;font-style:normal;font-weight:700;font-size:1em;line-height:20px;color:#000;letter-spacing:.00625em}.mat-mdc-button.mat-mdc-button-base>.mat-icon{margin-right:11px}.mat-mdc-button.mat-mdc-button-base.mat-primary-button{background-color:#00629b;color:#fff}.mat-mdc-button.mat-mdc-button-base.mat-primary-button:hover{background-color:#003e65}.mat-mdc-button.mat-mdc-button-base.mat-primary-button:active{background-color:#00629b}.mat-mdc-button.mat-mdc-button-base.mat-primary-button:disabled{background-color:#1c1b1f1f}.mat-mdc-button.mat-mdc-button-base.mat-secondary-button{color:#fff;background:#a7a8aa;box-shadow:0 1px 2px #0000004d,0 2px 6px 2px #00000026}.mat-mdc-button.mat-mdc-button-base.mat-secondary-button:hover{background:#a7a8aa}.mat-mdc-button.mat-mdc-button-base.mat-secondary-button:active{background:rgba(29,25,43,.12)}.mat-mdc-button.mat-mdc-button-base.mat-secondary-button:disabled{background:rgba(28,27,31,.12);color:#1c1b1f;opacity:.38}.ieeesa-text-button{color:#cac4d0;background:none;border:none}.flex-align-center{display:flex;align-items:center;justify-content:center}.mat-button-toggle-checked{background-color:#a7a8aa}.mat-button-toggle-checked .mat-button-toggle-label-content:before{font-family:\"Font Awesome 5 Free\";font-weight:900;content:\"\\f00c\";padding-right:.5625em}.mat-button-toggle-group .mat-button-toggle-label-content{font-family:Calibri Regular;font-style:normal;font-weight:700;font-size:1em;line-height:20px;color:#1c1b1f;letter-spacing:.00625em}@media (max-width: 768px){.mat-button-toggle-group .mat-button-toggle-label-content{max-width:8ch;text-overflow:ellipsis;white-space:nowrap;overflow:hidden;position:relative}}.cdk-overlay-pane{width:100%;min-width:312px}.ieeesa-checkbox-field__label-left{display:flex;align-items:center}.ieeesa-checkbox-field__label-top{display:block}.ieeesa-checkbox-field .mat-mdc-list{display:flex;list-style-type:none}.ieeesa-checkbox-field .mat-mdc-checkbox .mat-mdc-checkbox-touch-target{height:40px;width:40px}.ieeesa-checkbox-field .mat-mdc-checkbox .mdc-checkbox:hover .mdc-checkbox__native-control:not([disabled])~.mdc-checkbox__ripple{background-color:#1c1b1f!important;opacity:.08!important}.ieeesa-checkbox-field .mat-mdc-checkbox .mdc-checkbox .mdc-checkbox__native-control:enabled:not(:checked):not(:indeterminate):not([data-indeterminate=true])~.mdc-checkbox__background{border-color:#49454f!important;background-color:transparent!important}.ieeesa-checkbox-field .mat-mdc-checkbox .mdc-checkbox:hover .mdc-checkbox__native-control:enabled:not(:checked):not(:indeterminate):not([data-indeterminate=true])~.mdc-checkbox__background{border-color:#1c1b1f!important;background-color:transparent!important}.ieeesa-checkbox-field .mat-mdc-checkbox .mdc-checkbox__native-control:focus:enabled:not(:checked):not(:indeterminate):not([data-indeterminate=true])~.mdc-checkbox__background{border-color:#1c1b1f!important;background-color:transparent!important}.ieeesa-checkbox-field .mat-mdc-checkbox.mat-accent.mat-mdc-checkbox-checked .mdc-checkbox__background{border-color:#00b5e2!important;background-color:#00b5e2!important}.ieeesa-checkbox-field .mat-mdc-checkbox.mat-accent.mat-mdc-checkbox-checked .mdc-checkbox:hover .mdc-checkbox__ripple{background-color:#6750a4!important;opacity:.08!important}.ieeesa-checkbox-field .mat-mdc-checkbox.mat-accent.mat-mdc-checkbox-checked .mdc-checkbox:focus .mdc-checkbox__ripple{background-color:#6750a4}.ieeesa-checkbox-field .mat-mdc-checkbox.mat-accent.mat-mdc-checkbox-checked .mat-mdc-checkbox-ripple:not(:empty){background-color:#6750a4!important;opacity:.12!important}.ieeesa-checkbox-field .mat-mdc-checkbox.mat-accent.mat-mdc-checkbox-checked .mdc-checkbox__ripple{background-color:#6750a4}.ieeesa-checkbox-field .mat-mdc-checkbox .mdc-checkbox .mdc-checkbox__native-control:enabled:indeterminate~.mdc-checkbox__background{border-color:#00b5e2!important;background-color:#00b5e2!important}.ieeesa-checkbox-field .mat-mdc-checkbox .mdc-checkbox:hover .mdc-checkbox__native-control[data-indeterminate=true]:enabled~.mdc-checkbox__background{border-color:#00b5e2!important;background-color:#00b5e2!important}.ieeesa-checkbox-field .mat-mdc-checkbox .mdc-checkbox .mdc-checkbox__native-control[disabled]:checked~.mdc-checkbox__background{border-color:#1c1b1f!important;background-color:#1c1b1f!important}.ieeesa-checkbox-field .mat-mdc-checkbox .mdc-checkbox .mdc-checkbox__native-control[disabled]:not(:checked):not(:indeterminate):not([data-indeterminate=true])~.mdc-checkbox__background{border-color:#1c1b1f!important;background-color:transparent!important}.ieeesa-checkbox-field .mat-mdc-checkbox .mdc-checkbox .mdc-checkbox__native-control[disabled]:indeterminate~.mdc-checkbox__background{border-color:#1c1b1f!important;background-color:#1c1b1f!important}.ng-valid.ng-submitted .mat-mdc-checkbox.checkbox.mat-accent.ng-pristine.ng-invalid.ng-touched .mdc-checkbox:hover .mdc-checkbox__ripple,.ng-valid.ng-submitted .mat-mdc-checkbox.checkbox.mat-accent.ng-pristine.ng-invalid.ng-untouched .mdc-checkbox:hover .mdc-checkbox__ripple,.ng-valid.ng-submitted .mat-mdc-checkbox.checkbox.mat-accent.ng-dirty.ng-invalid.ng-touched .mdc-checkbox:hover .mdc-checkbox__ripple{background-color:#b3261e!important;opacity:.08!important}.ng-valid.ng-submitted .mat-mdc-checkbox.checkbox.mat-accent.ng-pristine.ng-invalid.ng-touched .mdc-checkbox:focus .mdc-checkbox__ripple,.ng-valid.ng-submitted .mat-mdc-checkbox.checkbox.mat-accent.ng-pristine.ng-invalid.ng-untouched .mdc-checkbox:focus .mdc-checkbox__ripple,.ng-valid.ng-submitted .mat-mdc-checkbox.checkbox.mat-accent.ng-dirty.ng-invalid.ng-touched .mdc-checkbox:focus .mdc-checkbox__ripple{background-color:#b3261e!important;opacity:.12!important}.ng-valid.ng-submitted .mat-mdc-checkbox.checkbox.mat-accent.ng-pristine.ng-invalid.ng-touched .mdc-checkbox__ripple,.ng-valid.ng-submitted .mat-mdc-checkbox.checkbox.mat-accent.ng-pristine.ng-invalid.ng-untouched .mdc-checkbox__ripple,.ng-valid.ng-submitted .mat-mdc-checkbox.checkbox.mat-accent.ng-dirty.ng-invalid.ng-touched .mdc-checkbox__ripple{background-color:#b3261e}.ng-valid.ng-submitted .mat-mdc-checkbox.checkbox.mat-accent.ng-pristine.ng-invalid.ng-touched .mdc-checkbox__background,.ng-valid.ng-submitted .mat-mdc-checkbox.checkbox.mat-accent.ng-pristine.ng-invalid.ng-untouched .mdc-checkbox__background,.ng-valid.ng-submitted .mat-mdc-checkbox.checkbox.mat-accent.ng-dirty.ng-invalid.ng-touched .mdc-checkbox__background{border-color:#ba0c2f!important;background-color:transparent!important}.ng-valid.ng-submitted .mat-mdc-checkbox.mat-accent.mat-mdc-checkbox-checked.ng-dirty.ng-valid.ng-touched .mdc-checkbox__background{border-color:#ba0c2f!important;background-color:#ba0c2f!important}.ng-valid.ng-submitted .mat-mdc-checkbox.mat-accent.mat-mdc-checkbox-checked.ng-dirty.ng-valid.ng-touched .mdc-checkbox:hover .mdc-checkbox__ripple{background-color:#b3261e!important;opacity:.08!important}.ng-valid.ng-submitted .mat-mdc-checkbox.mat-accent.mat-mdc-checkbox-checked.ng-dirty.ng-valid.ng-touched .mdc-checkbox:focus .mdc-checkbox__ripple{background-color:#b3261e!important;opacity:.12!important}.ng-valid.ng-submitted .mat-mdc-checkbox.mat-accent.mat-mdc-checkbox-checked.ng-dirty.ng-valid.ng-touched .mdc-checkbox__ripple{background-color:#b3261e}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "ngmodule", type: MatListModule }, { kind: "component", type: i3$2.MatList, selector: "mat-list", exportAs: ["matList"] }, { kind: "ngmodule", type: MatButtonModule }, { kind: "ngmodule", type: MatInputModule }, { kind: "directive", type: i4.MatLabel, selector: "mat-label" }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "ngmodule", type: MatFormFieldModule }, { kind: "component", type: FormErrorComponent$1, selector: "ieeesa-form-error", inputs: ["formGroup", "config", "submitResponse"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i3.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i3.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "ngmodule", type: MatCheckboxModule }, { kind: "component", type: i6.MatCheckbox, selector: "mat-checkbox", inputs: ["disableRipple", "color", "tabIndex"], exportAs: ["matCheckbox"] }], encapsulation: i0.ViewEncapsulation.None }); }
+    /**
+     * Checks if the form control has required validator.
+     * @return {boolean}
+     * @memberof DatePickerComponent
+     */
+    isRequired() {
+        return this.group?.controls[this.config?.controlName]?.hasValidator(Validators.required);
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.3", ngImport: i0, type: DatePickerComponent, deps: [{ token: i3.FormBuilder }, { token: i0.ChangeDetectorRef }, { token: DatepickerService }, { token: FormUtilityService }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.3", type: DatePickerComponent, isStandalone: true, selector: "ieeesa-date-picker", inputs: { selectedDates: "selectedDates", selectedRange: "selectedRange", calendarType: "calendarType", formControlName: "formControlName", placeholderLabel: "placeholderLabel", isDisabled: "isDisabled", isLabelAlignedLeft: "isLabelAlignedLeft", datepickerLabel: "datepickerLabel", dateRange: "dateRange" }, outputs: { selectedDate: "selectedDate", selectedDateRange: "selectedDateRange" }, providers: [
+            { provide: MAT_MOMENT_DATE_ADAPTER_OPTIONS, useValue: { useUtc: true } },
+            {
+                provide: DateAdapter,
+                useClass: CustomDateAdapter,
+                deps: [MAT_DATE_LOCALE, MAT_MOMENT_DATE_ADAPTER_OPTIONS],
+            },
+            {
+                provide: MAT_DATE_FORMATS,
+                useValue: DateFormats,
+            },
+        ], ngImport: i0, template: "<div class=\"ieeesa-datepicker\">\r\n  <div\r\n    [formGroup]=\"group\"\r\n    *ngIf=\"calendarType === calendarTypes.SINGLE_DATE_SELECTION\"\r\n    class=\"ieeesa-datepicker--single-selection\"\r\n    [ngClass]=\"!isRequired() ? 'ieeesa-datepicker__valid-date' : ''\"\r\n    [ngClass]=\"{\r\n      'ieeesa-datepicker__valid-date': !isRequired(),\r\n      'ieeesa-datepicker__label-left': isLabelAlignedLeft,\r\n      'ieeesa-datepicker__label-top': !isLabelAlignedLeft\r\n    }\"\r\n  >\r\n    <mat-label *ngIf=\"datepickerLabel\">{{ datepickerLabel }} </mat-label>\r\n    <mat-form-field>\r\n      <input\r\n        matInput\r\n        (dateInput)=\"onDateChange()\"\r\n        (click)=\"picker.open()\"\r\n        [matDatepicker]=\"picker\"\r\n        [formControlName]=\"config.controlName\"\r\n        [placeholder]=\"buttonActionsInfo?.datePicker?.dateFormatLabel\"\r\n        #calendar\r\n        readonly\r\n      />\r\n      <mat-datepicker-toggle\r\n        class=\"mat-datepicker-toggle\"\r\n        matIconSuffix\r\n        [for]=\"picker\"\r\n      ></mat-datepicker-toggle>\r\n      <mat-datepicker #picker [calendarHeaderComponent]=\"datePickerHeader\">\r\n        <mat-datepicker-actions>\r\n          <button\r\n            mat-button\r\n            class=\"mat-text-button ieeesa-datepicker__date-picker-button\"\r\n            type=\"button\"\r\n            matDatepickerCancel\r\n          >\r\n            {{ buttonActionsInfo?.button?.cancel }}\r\n          </button>\r\n          <button\r\n            mat-button\r\n            class=\"mat-text-button ieeesa-datepicker__date-picker-button\"\r\n            color=\"primary\"\r\n            type=\"button\"\r\n            matDatepickerApply\r\n          >\r\n            {{ buttonActionsInfo?.button?.ok }}\r\n          </button>\r\n        </mat-datepicker-actions>\r\n      </mat-datepicker>\r\n    </mat-form-field>\r\n    <ieeesa-form-error [formGroup]=\"group\" [config]=\"config\">\r\n    </ieeesa-form-error>\r\n  </div>\r\n\r\n  <div\r\n    [formGroup]=\"group\"\r\n    *ngIf=\"calendarType === calendarTypes.DATE_RANGE_SELECTION\"\r\n    class=\"ieeesa-datepicker--multi-selection\"\r\n    [ngClass]=\"\r\n      isLabelAlignedLeft\r\n        ? 'ieeesa-datepicker__label-left'\r\n        : 'ieeesa-datepicker__label-top'\r\n    \"\r\n  >\r\n    <mat-label *ngIf=\"datepickerLabel\">{{ datepickerLabel }} </mat-label>\r\n    <mat-form-field>\r\n      <mat-date-range-input [rangePicker]=\"rangePicker\" [formGroup]=\"group\">\r\n        <input\r\n          matStartDate\r\n          matInput\r\n          [formControlName]=\"config.dateRangeControls?.startDate ?? ''\"\r\n          [placeholder]=\"buttonActionsInfo?.datePicker?.dateFormatLabel + ' - '\"\r\n          (dateChange)=\"onDateRangeChange()\"\r\n        />\r\n        <input\r\n          matEndDate\r\n          matInput\r\n          [formControlName]=\"config.dateRangeControls?.endDate ?? ''\"\r\n          [placeholder]=\"buttonActionsInfo?.datePicker?.dateFormatLabel\"\r\n          (dateChange)=\"onDateRangeChange()\"\r\n        />\r\n      </mat-date-range-input>\r\n      <mat-datepicker-toggle\r\n        class=\"mat-datepicker-toggle\"\r\n        matIconSuffix\r\n        [for]=\"rangePicker\"\r\n      ></mat-datepicker-toggle>\r\n      <mat-date-range-picker\r\n        #rangePicker\r\n        [calendarHeaderComponent]=\"datePickerHeader\"\r\n        (dateInput)=\"onDateRangeChange()\"\r\n      >\r\n        <mat-date-range-picker-actions>\r\n          <button\r\n            mat-button\r\n            class=\"mat-text-button ieeesa-datepicker__date-picker-button\"\r\n            matDateRangePickerCancel\r\n            type=\"button\"\r\n          >\r\n            {{ buttonActionsInfo?.button?.cancel }}\r\n          </button>\r\n          <button\r\n            mat-button\r\n            class=\"mat-text-button ieeesa-datepicker__date-picker-button\"\r\n            color=\"primary\"\r\n            matDateRangePickerApply\r\n            (click)=\"onDateRangeChange()\"\r\n            type=\"button\"\r\n          >\r\n            {{ buttonActionsInfo?.button?.ok }}\r\n          </button>\r\n        </mat-date-range-picker-actions>\r\n      </mat-date-range-picker>\r\n    </mat-form-field>\r\n  </div>\r\n\r\n  <div\r\n    *ngIf=\"calendarType === calendarTypes.CALENDAR\"\r\n    class=\"ieeesa-datepicker--calendar\"\r\n  >\r\n    <mat-calendar\r\n      [headerComponent]=\"datePickerHeader\"\r\n      [(selected)]=\"calendarSelectedDate\"\r\n    >\r\n    </mat-calendar>\r\n  </div>\r\n</div>\r\n", styles: [".ieeesa-subtitle{text-align:left;font-family:Calibri Regular;font-size:1.56em;letter-spacing:0;color:#000;opacity:1}.ieeesa-body{text-align:left;font-family:Calibri Regular;font-size:1.25em;letter-spacing:0;color:#000;opacity:1}.ieeesa-display-lg-57{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:3.5625em;line-height:64px;color:#000;letter-spacing:0}.ieeesa-display-md-47{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:2.9375em;line-height:52px;color:#000;letter-spacing:0}.ieeesa-display-sm-38{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:2.375em;line-height:44px;color:#000;letter-spacing:0}.ieeesa-headline-lg-34{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:2.125em;line-height:40px;color:#000;letter-spacing:0}.ieeesa-headline-md-30{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1.875em;line-height:36px;color:#000;letter-spacing:0}.ieeesa-headline-sm-26{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1.625em;line-height:32px;color:#000;letter-spacing:0}.ieeesa-title-lg-bold-24{font-family:Calibri Regular;font-style:normal;font-weight:700;font-size:1.5em;line-height:28px;color:#000;letter-spacing:0}.ieeesa-title-lg-24{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1.5em;line-height:28px;color:#000;letter-spacing:0}.ieeesa-title-md-18{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1.125em;line-height:24px;color:#000;letter-spacing:.009375em}.ieeesa-title-sm-16{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1em;line-height:20px;color:#000;letter-spacing:.00625em}.ieeesa-label-lg-bold-16{font-family:Calibri Regular;font-style:normal;font-weight:700;font-size:1em;line-height:20px;color:#000;letter-spacing:.00625em}.ieeesa-label-lg-16{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1em;line-height:20px;color:#000;letter-spacing:.00625em}.ieeesa-label-md-14{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:.875em;line-height:16px;color:#000;letter-spacing:.03125em}.ieeesa-label-sm-13{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:.8125em;line-height:16px;color:#000;letter-spacing:.03125em}.ieeesa-body-lg-bold-18{font-family:Calibri Regular;font-style:normal;font-weight:700;font-size:1.125em;line-height:24px;color:#000;letter-spacing:.03125em}.ieeesa-body-lg-18{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1.125em;line-height:24px;color:#000;letter-spacing:.03125em}.ieeesa-body-md-16{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1em;line-height:20px;color:#000;letter-spacing:.015625em}.ieeesa-body-sm-14{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:.875em;line-height:16px;color:#000;letter-spacing:.025em}.ieeesa-title-inter-lg-bold-24{font-family:Inter Bold;font-style:normal;font-weight:700;font-size:1.5em;line-height:29px;color:#000;letter-spacing:0}.mat-mdc-button.mat-mdc-button-base.mat-primary-button,.mat-mdc-button.mat-mdc-button-base.mat-secondary-button{min-width:103px;width:auto;min-height:40px;height:auto;border-radius:3px;text-align:center;padding:.625em 1.5em;border:none;font-family:Calibri Regular;font-style:normal;font-weight:700;font-size:1em;line-height:20px;color:#000;letter-spacing:.00625em}.mat-mdc-button.mat-mdc-button-base>.mat-icon{margin-right:11px}.mat-mdc-button.mat-mdc-button-base.mat-primary-button{background-color:#00629b;color:#fff}.mat-mdc-button.mat-mdc-button-base.mat-primary-button:hover{background-color:#003e65}.mat-mdc-button.mat-mdc-button-base.mat-primary-button:active{background-color:#00629b}.mat-mdc-button.mat-mdc-button-base.mat-primary-button:disabled{background-color:#1c1b1f1f}.mat-mdc-button.mat-mdc-button-base.mat-secondary-button{color:#fff;background:#a7a8aa;box-shadow:0 1px 2px #0000004d,0 2px 6px 2px #00000026}.mat-mdc-button.mat-mdc-button-base.mat-secondary-button:hover{background:#a7a8aa}.mat-mdc-button.mat-mdc-button-base.mat-secondary-button:active{background:rgba(29,25,43,.12)}.mat-mdc-button.mat-mdc-button-base.mat-secondary-button:disabled{background:rgba(28,27,31,.12);color:#1c1b1f;opacity:.38}.ieeesa-text-button{color:#cac4d0;background:none;border:none}.flex-align-center{display:flex;align-items:center;justify-content:center}.mat-button-toggle-checked{background-color:#a7a8aa}.mat-button-toggle-checked .mat-button-toggle-label-content:before{font-family:\"Font Awesome 5 Free\";font-weight:900;content:\"\\f00c\";padding-right:.5625em}.mat-button-toggle-group .mat-button-toggle-label-content{font-family:Calibri Regular;font-style:normal;font-weight:700;font-size:1em;line-height:20px;color:#1c1b1f;letter-spacing:.00625em}@media (max-width: 768px){.mat-button-toggle-group .mat-button-toggle-label-content{max-width:8ch;text-overflow:ellipsis;white-space:nowrap;overflow:hidden;position:relative}}.cdk-overlay-pane{width:100%;min-width:312px}.ieeesa-datepicker{min-width:360px;width:auto}.ieeesa-datepicker__label-left{display:flex}.ieeesa-datepicker__label-top{display:block}.ieeesa-datepicker__date-picker-button{background:linear-gradient(0deg,rgba(0,98,155,.11),rgba(0,98,155,.11)),#fffbfe}.ieeesa-datepicker--calendar{background:linear-gradient(0deg,rgba(0,98,155,.11),rgba(0,98,155,.11)),#fffbfe;border-radius:16px}.ieeesa-datepicker--calendar .mat-calendar-body-cell-container{margin:0;padding-top:24px 0}.ieeesa-datepicker--calendar .mat-calendar-table-header th,.ieeesa-datepicker--calendar .mat-calendar-body td{height:24px!important;padding-top:24px!important;width:24px!important;padding-bottom:24px!important}.ieeesa-datepicker--calendar .mat-calendar-body-selected{background-color:#00b5e2;color:#fff;border:none;box-shadow:none}.ieeesa-datepicker--calendar .mat-calendar-body-cell:not(.mat-calendar-body-disabled):hover>.mat-calendar-body-cell-content:not(.mat-calendar-body-selected):not(.mat-calendar-body-comparison-identical){background-color:#00b5e2;color:#fff;border:none;box-shadow:none}.ieeesa-datepicker--calendar .mat-calendar-content{padding:0 8px 35px}.ieeesa-datepicker .mat-mdc-form-field{width:-webkit-fill-available}.ieeesa-datepicker .mat-mdc-text-field-wrapper.mdc-text-field.mdc-text-field--outlined.mdc-text-field--no-label,.ieeesa-datepicker .mdc-text-field--filled:not(.mdc-text-field--disabled){border:2px solid #00b5e2;border-radius:4px;height:56px;align-items:center;background-color:#f0f5f9}.ieeesa-datepicker .mdc-text-field--filled:not(.mdc-text-field--disabled) .mdc-line-ripple:before{border:none}.ieeesa-datepicker .mat-mdc-text-field-wrapper.mdc-text-field--outlined .mdc-text-field__input,.ieeesa-datepicker .mdc-text-field--no-label:not(.mdc-text-field--textarea) .mat-mdc-form-field-input-control.mdc-text-field__input{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1em;line-height:24px;color:#1c1b1f;letter-spacing:.03125em}.ieeesa-datepicker .mat-mdc-text-field-wrapper.mdc-text-field--outlined .mdc-text-field__input::placeholder,.ieeesa-datepicker .mdc-text-field--no-label:not(.mdc-text-field--textarea) .mat-mdc-form-field-input-control.mdc-text-field__input::placeholder{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1.125em;line-height:24px;color:#49454f;letter-spacing:.03125em}.ieeesa-datepicker .mat-mdc-form-field-hint{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1em;line-height:16px;color:#49454f;letter-spacing:.025em}.ieeesa-datepicker .mat-datepicker-toggle-default-icon{width:18px;height:20px}.mat-datepicker-popup .mat-datepicker-content-container{background:linear-gradient(0deg,rgba(0,98,155,.11),rgba(0,98,155,.11)),#fffbfe;border-radius:28px}.mat-datepicker-popup .mat-datepicker-content-container .mat-calendar-body-cell-content{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1.125em;line-height:24px;color:#1c1b1f;letter-spacing:.03125em}.mat-datepicker-popup .mat-datepicker-content-container .mat-calendar-body-selected{background-color:#00b5e2;color:#fff;border:none;box-shadow:none}.mat-datepicker-popup .mat-datepicker-content-container .mat-calendar-body-in-range:before{background-color:#a7a8aa;color:#49454f}.mat-datepicker-popup .mat-datepicker-content{border-radius:28px}.mat-datepicker-popup .mat-calendar-table-header{position:relative;top:25px}.mat-datepicker-popup .mat-calendar-table-header th,.mat-datepicker-popup .mat-calendar-body td{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1.125em;line-height:24px;color:#000;letter-spacing:.03125em}.mat-datepicker-popup .mat-calendar-table-header-divider,.mat-datepicker-popup .mat-calendar-body tr:first-child td:only-child{display:none}.mat-datepicker-popup .mat-calendar-body tr:first-child td:first-child:not(:only-child){visibility:hidden}.mat-datepicker-popup .mat-calendar-body{position:relative;top:20px}.mat-datepicker-popup .mat-mdc-menu-panel{min-width:360px;width:auto}.mat-datepicker-popup .mat-calendar-body-today{border-color:#00b5e2;color:#00b5e2}.mat-datepicker-popup .mat-datepicker-actions{padding:15px 10px 10px}.mat-datepicker-popup .mat-datepicker-toggle{color:#49454f}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i3.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i3.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i3.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "component", type: FormErrorComponent, selector: "ieeesa-form-error", inputs: ["formGroup", "config", "submitResponse"] }, { kind: "ngmodule", type: MatExpansionModule }, { kind: "ngmodule", type: MatMenuModule }, { kind: "ngmodule", type: MatIconModule }, { kind: "ngmodule", type: MatInputModule }, { kind: "directive", type: i5.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl],      input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly"], exportAs: ["matInput"] }, { kind: "component", type: i4.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i4.MatLabel, selector: "mat-label" }, { kind: "directive", type: i4.MatSuffix, selector: "[matSuffix], [matIconSuffix], [matTextSuffix]", inputs: ["matTextSuffix"] }, { kind: "ngmodule", type: MatFormFieldModule }, { kind: "ngmodule", type: MatDatepickerModule }, { kind: "component", type: i7.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: "component", type: i7.MatDatepicker, selector: "mat-datepicker", exportAs: ["matDatepicker"] }, { kind: "directive", type: i7.MatDatepickerInput, selector: "input[matDatepicker]", inputs: ["matDatepicker", "min", "max", "matDatepickerFilter"], exportAs: ["matDatepickerInput"] }, { kind: "component", type: i7.MatDatepickerToggle, selector: "mat-datepicker-toggle", inputs: ["for", "tabIndex", "aria-label", "disabled", "disableRipple"], exportAs: ["matDatepickerToggle"] }, { kind: "component", type: i7.MatDateRangeInput, selector: "mat-date-range-input", inputs: ["rangePicker", "required", "dateFilter", "min", "max", "disabled", "separator", "comparisonStart", "comparisonEnd"], exportAs: ["matDateRangeInput"] }, { kind: "directive", type: i7.MatStartDate, selector: "input[matStartDate]", inputs: ["errorStateMatcher"], outputs: ["dateChange", "dateInput"] }, { kind: "directive", type: i7.MatEndDate, selector: "input[matEndDate]", inputs: ["errorStateMatcher"], outputs: ["dateChange", "dateInput"] }, { kind: "component", type: i7.MatDateRangePicker, selector: "mat-date-range-picker", exportAs: ["matDateRangePicker"] }, { kind: "component", type: i7.MatDatepickerActions, selector: "mat-datepicker-actions, mat-date-range-picker-actions" }, { kind: "directive", type: i7.MatDatepickerCancel, selector: "[matDatepickerCancel], [matDateRangePickerCancel]" }, { kind: "directive", type: i7.MatDatepickerApply, selector: "[matDatepickerApply], [matDateRangePickerApply]" }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i8.MatButton, selector: "    button[mat-button], button[mat-raised-button], button[mat-flat-button],    button[mat-stroked-button]  ", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }], encapsulation: i0.ViewEncapsulation.None }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.3", ngImport: i0, type: CheckboxComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.3", ngImport: i0, type: DatePickerComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'ieeesa-checkbox', standalone: true, imports: [
+            args: [{ selector: 'ieeesa-date-picker', standalone: true, imports: [
                         CommonModule,
-                        MatListModule,
-                        MatButtonModule,
+                        ReactiveFormsModule,
+                        FormErrorComponent,
+                        MatExpansionModule,
+                        MatMenuModule,
+                        MatIconModule,
                         MatInputModule,
-                        FormsModule,
                         MatFormFieldModule,
-                        FormErrorComponent$1,
-                        ReactiveFormsModule,
-                        MatCheckboxModule,
-                    ], encapsulation: ViewEncapsulation.None, template: "<div\r\n  [formGroup]=\"group\"\r\n  class=\"ieeesa-checkbox-field\"\r\n  *ngIf=\"group\"\r\n  [ngClass]=\"\r\n    config.isLabelAlignedLeft\r\n      ? 'ieeesa-checkbox-field__label-left'\r\n      : 'ieeesa-checkbox-field__label-top'\r\n  \"\r\n>\r\n  <mat-label class=\"ieeesa-body-sm-14 ieeesa-checkbox-field__label\">{{\r\n    config.label\r\n  }}</mat-label>\r\n  <mat-list>\r\n    <mat-checkbox\r\n      *ngFor=\"let option of checkboxes; trackBy: trackById\"\r\n      [formControlName]=\"option.id\"\r\n      (change)=\"onChange(option, true)\"\r\n      [disabled]=\"option.disabled\"\r\n      [checked]=\"option.checked\"\r\n    >\r\n      {{ option.name }}\r\n    </mat-checkbox>\r\n  </mat-list>\r\n  <ieeesa-form-error [formGroup]=\"group\" [config]=\"config\"> </ieeesa-form-error>\r\n</div>\r\n", styles: [".ieeesa-subtitle{text-align:left;font-family:Calibri Regular;font-size:1.56em;letter-spacing:0;color:#000;opacity:1}.ieeesa-body{text-align:left;font-family:Calibri Regular;font-size:1.25em;letter-spacing:0;color:#000;opacity:1}.ieeesa-display-lg-57{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:3.5625em;line-height:64px;color:#000;letter-spacing:0}.ieeesa-display-md-47{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:2.9375em;line-height:52px;color:#000;letter-spacing:0}.ieeesa-display-sm-38{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:2.375em;line-height:44px;color:#000;letter-spacing:0}.ieeesa-headline-lg-34{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:2.125em;line-height:40px;color:#000;letter-spacing:0}.ieeesa-headline-md-30{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1.875em;line-height:36px;color:#000;letter-spacing:0}.ieeesa-headline-sm-26{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1.625em;line-height:32px;color:#000;letter-spacing:0}.ieeesa-title-lg-bold-24{font-family:Calibri Regular;font-style:normal;font-weight:700;font-size:1.5em;line-height:28px;color:#000;letter-spacing:0}.ieeesa-title-lg-24{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1.5em;line-height:28px;color:#000;letter-spacing:0}.ieeesa-title-md-18{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1.125em;line-height:24px;color:#000;letter-spacing:.009375em}.ieeesa-title-sm-16{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1em;line-height:20px;color:#000;letter-spacing:.00625em}.ieeesa-label-lg-bold-16{font-family:Calibri Regular;font-style:normal;font-weight:700;font-size:1em;line-height:20px;color:#000;letter-spacing:.00625em}.ieeesa-label-lg-16{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1em;line-height:20px;color:#000;letter-spacing:.00625em}.ieeesa-label-md-14{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:.875em;line-height:16px;color:#000;letter-spacing:.03125em}.ieeesa-label-sm-13{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:.8125em;line-height:16px;color:#000;letter-spacing:.03125em}.ieeesa-body-lg-bold-18{font-family:Calibri Regular;font-style:normal;font-weight:700;font-size:1.125em;line-height:24px;color:#000;letter-spacing:.03125em}.ieeesa-body-lg-18{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1.125em;line-height:24px;color:#000;letter-spacing:.03125em}.ieeesa-body-md-16{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1em;line-height:20px;color:#000;letter-spacing:.015625em}.ieeesa-body-sm-14{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:.875em;line-height:16px;color:#000;letter-spacing:.025em}.ieeesa-title-inter-lg-bold-24{font-family:Inter Bold;font-style:normal;font-weight:700;font-size:1.5em;line-height:29px;color:#000;letter-spacing:0}.mat-mdc-button.mat-mdc-button-base.mat-primary-button,.mat-mdc-button.mat-mdc-button-base.mat-secondary-button{min-width:103px;width:auto;min-height:40px;height:auto;border-radius:3px;text-align:center;padding:.625em 1.5em;border:none;font-family:Calibri Regular;font-style:normal;font-weight:700;font-size:1em;line-height:20px;color:#000;letter-spacing:.00625em}.mat-mdc-button.mat-mdc-button-base>.mat-icon{margin-right:11px}.mat-mdc-button.mat-mdc-button-base.mat-primary-button{background-color:#00629b;color:#fff}.mat-mdc-button.mat-mdc-button-base.mat-primary-button:hover{background-color:#003e65}.mat-mdc-button.mat-mdc-button-base.mat-primary-button:active{background-color:#00629b}.mat-mdc-button.mat-mdc-button-base.mat-primary-button:disabled{background-color:#1c1b1f1f}.mat-mdc-button.mat-mdc-button-base.mat-secondary-button{color:#fff;background:#a7a8aa;box-shadow:0 1px 2px #0000004d,0 2px 6px 2px #00000026}.mat-mdc-button.mat-mdc-button-base.mat-secondary-button:hover{background:#a7a8aa}.mat-mdc-button.mat-mdc-button-base.mat-secondary-button:active{background:rgba(29,25,43,.12)}.mat-mdc-button.mat-mdc-button-base.mat-secondary-button:disabled{background:rgba(28,27,31,.12);color:#1c1b1f;opacity:.38}.ieeesa-text-button{color:#cac4d0;background:none;border:none}.flex-align-center{display:flex;align-items:center;justify-content:center}.mat-button-toggle-checked{background-color:#a7a8aa}.mat-button-toggle-checked .mat-button-toggle-label-content:before{font-family:\"Font Awesome 5 Free\";font-weight:900;content:\"\\f00c\";padding-right:.5625em}.mat-button-toggle-group .mat-button-toggle-label-content{font-family:Calibri Regular;font-style:normal;font-weight:700;font-size:1em;line-height:20px;color:#1c1b1f;letter-spacing:.00625em}@media (max-width: 768px){.mat-button-toggle-group .mat-button-toggle-label-content{max-width:8ch;text-overflow:ellipsis;white-space:nowrap;overflow:hidden;position:relative}}.cdk-overlay-pane{width:100%;min-width:312px}.ieeesa-checkbox-field__label-left{display:flex;align-items:center}.ieeesa-checkbox-field__label-top{display:block}.ieeesa-checkbox-field .mat-mdc-list{display:flex;list-style-type:none}.ieeesa-checkbox-field .mat-mdc-checkbox .mat-mdc-checkbox-touch-target{height:40px;width:40px}.ieeesa-checkbox-field .mat-mdc-checkbox .mdc-checkbox:hover .mdc-checkbox__native-control:not([disabled])~.mdc-checkbox__ripple{background-color:#1c1b1f!important;opacity:.08!important}.ieeesa-checkbox-field .mat-mdc-checkbox .mdc-checkbox .mdc-checkbox__native-control:enabled:not(:checked):not(:indeterminate):not([data-indeterminate=true])~.mdc-checkbox__background{border-color:#49454f!important;background-color:transparent!important}.ieeesa-checkbox-field .mat-mdc-checkbox .mdc-checkbox:hover .mdc-checkbox__native-control:enabled:not(:checked):not(:indeterminate):not([data-indeterminate=true])~.mdc-checkbox__background{border-color:#1c1b1f!important;background-color:transparent!important}.ieeesa-checkbox-field .mat-mdc-checkbox .mdc-checkbox__native-control:focus:enabled:not(:checked):not(:indeterminate):not([data-indeterminate=true])~.mdc-checkbox__background{border-color:#1c1b1f!important;background-color:transparent!important}.ieeesa-checkbox-field .mat-mdc-checkbox.mat-accent.mat-mdc-checkbox-checked .mdc-checkbox__background{border-color:#00b5e2!important;background-color:#00b5e2!important}.ieeesa-checkbox-field .mat-mdc-checkbox.mat-accent.mat-mdc-checkbox-checked .mdc-checkbox:hover .mdc-checkbox__ripple{background-color:#6750a4!important;opacity:.08!important}.ieeesa-checkbox-field .mat-mdc-checkbox.mat-accent.mat-mdc-checkbox-checked .mdc-checkbox:focus .mdc-checkbox__ripple{background-color:#6750a4}.ieeesa-checkbox-field .mat-mdc-checkbox.mat-accent.mat-mdc-checkbox-checked .mat-mdc-checkbox-ripple:not(:empty){background-color:#6750a4!important;opacity:.12!important}.ieeesa-checkbox-field .mat-mdc-checkbox.mat-accent.mat-mdc-checkbox-checked .mdc-checkbox__ripple{background-color:#6750a4}.ieeesa-checkbox-field .mat-mdc-checkbox .mdc-checkbox .mdc-checkbox__native-control:enabled:indeterminate~.mdc-checkbox__background{border-color:#00b5e2!important;background-color:#00b5e2!important}.ieeesa-checkbox-field .mat-mdc-checkbox .mdc-checkbox:hover .mdc-checkbox__native-control[data-indeterminate=true]:enabled~.mdc-checkbox__background{border-color:#00b5e2!important;background-color:#00b5e2!important}.ieeesa-checkbox-field .mat-mdc-checkbox .mdc-checkbox .mdc-checkbox__native-control[disabled]:checked~.mdc-checkbox__background{border-color:#1c1b1f!important;background-color:#1c1b1f!important}.ieeesa-checkbox-field .mat-mdc-checkbox .mdc-checkbox .mdc-checkbox__native-control[disabled]:not(:checked):not(:indeterminate):not([data-indeterminate=true])~.mdc-checkbox__background{border-color:#1c1b1f!important;background-color:transparent!important}.ieeesa-checkbox-field .mat-mdc-checkbox .mdc-checkbox .mdc-checkbox__native-control[disabled]:indeterminate~.mdc-checkbox__background{border-color:#1c1b1f!important;background-color:#1c1b1f!important}.ng-valid.ng-submitted .mat-mdc-checkbox.checkbox.mat-accent.ng-pristine.ng-invalid.ng-touched .mdc-checkbox:hover .mdc-checkbox__ripple,.ng-valid.ng-submitted .mat-mdc-checkbox.checkbox.mat-accent.ng-pristine.ng-invalid.ng-untouched .mdc-checkbox:hover .mdc-checkbox__ripple,.ng-valid.ng-submitted .mat-mdc-checkbox.checkbox.mat-accent.ng-dirty.ng-invalid.ng-touched .mdc-checkbox:hover .mdc-checkbox__ripple{background-color:#b3261e!important;opacity:.08!important}.ng-valid.ng-submitted .mat-mdc-checkbox.checkbox.mat-accent.ng-pristine.ng-invalid.ng-touched .mdc-checkbox:focus .mdc-checkbox__ripple,.ng-valid.ng-submitted .mat-mdc-checkbox.checkbox.mat-accent.ng-pristine.ng-invalid.ng-untouched .mdc-checkbox:focus .mdc-checkbox__ripple,.ng-valid.ng-submitted .mat-mdc-checkbox.checkbox.mat-accent.ng-dirty.ng-invalid.ng-touched .mdc-checkbox:focus .mdc-checkbox__ripple{background-color:#b3261e!important;opacity:.12!important}.ng-valid.ng-submitted .mat-mdc-checkbox.checkbox.mat-accent.ng-pristine.ng-invalid.ng-touched .mdc-checkbox__ripple,.ng-valid.ng-submitted .mat-mdc-checkbox.checkbox.mat-accent.ng-pristine.ng-invalid.ng-untouched .mdc-checkbox__ripple,.ng-valid.ng-submitted .mat-mdc-checkbox.checkbox.mat-accent.ng-dirty.ng-invalid.ng-touched .mdc-checkbox__ripple{background-color:#b3261e}.ng-valid.ng-submitted .mat-mdc-checkbox.checkbox.mat-accent.ng-pristine.ng-invalid.ng-touched .mdc-checkbox__background,.ng-valid.ng-submitted .mat-mdc-checkbox.checkbox.mat-accent.ng-pristine.ng-invalid.ng-untouched .mdc-checkbox__background,.ng-valid.ng-submitted .mat-mdc-checkbox.checkbox.mat-accent.ng-dirty.ng-invalid.ng-touched .mdc-checkbox__background{border-color:#ba0c2f!important;background-color:transparent!important}.ng-valid.ng-submitted .mat-mdc-checkbox.mat-accent.mat-mdc-checkbox-checked.ng-dirty.ng-valid.ng-touched .mdc-checkbox__background{border-color:#ba0c2f!important;background-color:#ba0c2f!important}.ng-valid.ng-submitted .mat-mdc-checkbox.mat-accent.mat-mdc-checkbox-checked.ng-dirty.ng-valid.ng-touched .mdc-checkbox:hover .mdc-checkbox__ripple{background-color:#b3261e!important;opacity:.08!important}.ng-valid.ng-submitted .mat-mdc-checkbox.mat-accent.mat-mdc-checkbox-checked.ng-dirty.ng-valid.ng-touched .mdc-checkbox:focus .mdc-checkbox__ripple{background-color:#b3261e!important;opacity:.12!important}.ng-valid.ng-submitted .mat-mdc-checkbox.mat-accent.mat-mdc-checkbox-checked.ng-dirty.ng-valid.ng-touched .mdc-checkbox__ripple{background-color:#b3261e}\n"] }]
-        }], ctorParameters: function () { return [{ type: i1.FormUtilityService }]; }, propDecorators: { checkboxes: [{
+                        MatDatepickerModule,
+                        DatePickerHeaderComponent,
+                        MatButtonModule,
+                    ], providers: [
+                        { provide: MAT_MOMENT_DATE_ADAPTER_OPTIONS, useValue: { useUtc: true } },
+                        {
+                            provide: DateAdapter,
+                            useClass: CustomDateAdapter,
+                            deps: [MAT_DATE_LOCALE, MAT_MOMENT_DATE_ADAPTER_OPTIONS],
+                        },
+                        {
+                            provide: MAT_DATE_FORMATS,
+                            useValue: DateFormats,
+                        },
+                    ], encapsulation: ViewEncapsulation.None, template: "<div class=\"ieeesa-datepicker\">\r\n  <div\r\n    [formGroup]=\"group\"\r\n    *ngIf=\"calendarType === calendarTypes.SINGLE_DATE_SELECTION\"\r\n    class=\"ieeesa-datepicker--single-selection\"\r\n    [ngClass]=\"!isRequired() ? 'ieeesa-datepicker__valid-date' : ''\"\r\n    [ngClass]=\"{\r\n      'ieeesa-datepicker__valid-date': !isRequired(),\r\n      'ieeesa-datepicker__label-left': isLabelAlignedLeft,\r\n      'ieeesa-datepicker__label-top': !isLabelAlignedLeft\r\n    }\"\r\n  >\r\n    <mat-label *ngIf=\"datepickerLabel\">{{ datepickerLabel }} </mat-label>\r\n    <mat-form-field>\r\n      <input\r\n        matInput\r\n        (dateInput)=\"onDateChange()\"\r\n        (click)=\"picker.open()\"\r\n        [matDatepicker]=\"picker\"\r\n        [formControlName]=\"config.controlName\"\r\n        [placeholder]=\"buttonActionsInfo?.datePicker?.dateFormatLabel\"\r\n        #calendar\r\n        readonly\r\n      />\r\n      <mat-datepicker-toggle\r\n        class=\"mat-datepicker-toggle\"\r\n        matIconSuffix\r\n        [for]=\"picker\"\r\n      ></mat-datepicker-toggle>\r\n      <mat-datepicker #picker [calendarHeaderComponent]=\"datePickerHeader\">\r\n        <mat-datepicker-actions>\r\n          <button\r\n            mat-button\r\n            class=\"mat-text-button ieeesa-datepicker__date-picker-button\"\r\n            type=\"button\"\r\n            matDatepickerCancel\r\n          >\r\n            {{ buttonActionsInfo?.button?.cancel }}\r\n          </button>\r\n          <button\r\n            mat-button\r\n            class=\"mat-text-button ieeesa-datepicker__date-picker-button\"\r\n            color=\"primary\"\r\n            type=\"button\"\r\n            matDatepickerApply\r\n          >\r\n            {{ buttonActionsInfo?.button?.ok }}\r\n          </button>\r\n        </mat-datepicker-actions>\r\n      </mat-datepicker>\r\n    </mat-form-field>\r\n    <ieeesa-form-error [formGroup]=\"group\" [config]=\"config\">\r\n    </ieeesa-form-error>\r\n  </div>\r\n\r\n  <div\r\n    [formGroup]=\"group\"\r\n    *ngIf=\"calendarType === calendarTypes.DATE_RANGE_SELECTION\"\r\n    class=\"ieeesa-datepicker--multi-selection\"\r\n    [ngClass]=\"\r\n      isLabelAlignedLeft\r\n        ? 'ieeesa-datepicker__label-left'\r\n        : 'ieeesa-datepicker__label-top'\r\n    \"\r\n  >\r\n    <mat-label *ngIf=\"datepickerLabel\">{{ datepickerLabel }} </mat-label>\r\n    <mat-form-field>\r\n      <mat-date-range-input [rangePicker]=\"rangePicker\" [formGroup]=\"group\">\r\n        <input\r\n          matStartDate\r\n          matInput\r\n          [formControlName]=\"config.dateRangeControls?.startDate ?? ''\"\r\n          [placeholder]=\"buttonActionsInfo?.datePicker?.dateFormatLabel + ' - '\"\r\n          (dateChange)=\"onDateRangeChange()\"\r\n        />\r\n        <input\r\n          matEndDate\r\n          matInput\r\n          [formControlName]=\"config.dateRangeControls?.endDate ?? ''\"\r\n          [placeholder]=\"buttonActionsInfo?.datePicker?.dateFormatLabel\"\r\n          (dateChange)=\"onDateRangeChange()\"\r\n        />\r\n      </mat-date-range-input>\r\n      <mat-datepicker-toggle\r\n        class=\"mat-datepicker-toggle\"\r\n        matIconSuffix\r\n        [for]=\"rangePicker\"\r\n      ></mat-datepicker-toggle>\r\n      <mat-date-range-picker\r\n        #rangePicker\r\n        [calendarHeaderComponent]=\"datePickerHeader\"\r\n        (dateInput)=\"onDateRangeChange()\"\r\n      >\r\n        <mat-date-range-picker-actions>\r\n          <button\r\n            mat-button\r\n            class=\"mat-text-button ieeesa-datepicker__date-picker-button\"\r\n            matDateRangePickerCancel\r\n            type=\"button\"\r\n          >\r\n            {{ buttonActionsInfo?.button?.cancel }}\r\n          </button>\r\n          <button\r\n            mat-button\r\n            class=\"mat-text-button ieeesa-datepicker__date-picker-button\"\r\n            color=\"primary\"\r\n            matDateRangePickerApply\r\n            (click)=\"onDateRangeChange()\"\r\n            type=\"button\"\r\n          >\r\n            {{ buttonActionsInfo?.button?.ok }}\r\n          </button>\r\n        </mat-date-range-picker-actions>\r\n      </mat-date-range-picker>\r\n    </mat-form-field>\r\n  </div>\r\n\r\n  <div\r\n    *ngIf=\"calendarType === calendarTypes.CALENDAR\"\r\n    class=\"ieeesa-datepicker--calendar\"\r\n  >\r\n    <mat-calendar\r\n      [headerComponent]=\"datePickerHeader\"\r\n      [(selected)]=\"calendarSelectedDate\"\r\n    >\r\n    </mat-calendar>\r\n  </div>\r\n</div>\r\n", styles: [".ieeesa-subtitle{text-align:left;font-family:Calibri Regular;font-size:1.56em;letter-spacing:0;color:#000;opacity:1}.ieeesa-body{text-align:left;font-family:Calibri Regular;font-size:1.25em;letter-spacing:0;color:#000;opacity:1}.ieeesa-display-lg-57{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:3.5625em;line-height:64px;color:#000;letter-spacing:0}.ieeesa-display-md-47{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:2.9375em;line-height:52px;color:#000;letter-spacing:0}.ieeesa-display-sm-38{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:2.375em;line-height:44px;color:#000;letter-spacing:0}.ieeesa-headline-lg-34{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:2.125em;line-height:40px;color:#000;letter-spacing:0}.ieeesa-headline-md-30{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1.875em;line-height:36px;color:#000;letter-spacing:0}.ieeesa-headline-sm-26{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1.625em;line-height:32px;color:#000;letter-spacing:0}.ieeesa-title-lg-bold-24{font-family:Calibri Regular;font-style:normal;font-weight:700;font-size:1.5em;line-height:28px;color:#000;letter-spacing:0}.ieeesa-title-lg-24{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1.5em;line-height:28px;color:#000;letter-spacing:0}.ieeesa-title-md-18{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1.125em;line-height:24px;color:#000;letter-spacing:.009375em}.ieeesa-title-sm-16{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1em;line-height:20px;color:#000;letter-spacing:.00625em}.ieeesa-label-lg-bold-16{font-family:Calibri Regular;font-style:normal;font-weight:700;font-size:1em;line-height:20px;color:#000;letter-spacing:.00625em}.ieeesa-label-lg-16{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1em;line-height:20px;color:#000;letter-spacing:.00625em}.ieeesa-label-md-14{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:.875em;line-height:16px;color:#000;letter-spacing:.03125em}.ieeesa-label-sm-13{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:.8125em;line-height:16px;color:#000;letter-spacing:.03125em}.ieeesa-body-lg-bold-18{font-family:Calibri Regular;font-style:normal;font-weight:700;font-size:1.125em;line-height:24px;color:#000;letter-spacing:.03125em}.ieeesa-body-lg-18{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1.125em;line-height:24px;color:#000;letter-spacing:.03125em}.ieeesa-body-md-16{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1em;line-height:20px;color:#000;letter-spacing:.015625em}.ieeesa-body-sm-14{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:.875em;line-height:16px;color:#000;letter-spacing:.025em}.ieeesa-title-inter-lg-bold-24{font-family:Inter Bold;font-style:normal;font-weight:700;font-size:1.5em;line-height:29px;color:#000;letter-spacing:0}.mat-mdc-button.mat-mdc-button-base.mat-primary-button,.mat-mdc-button.mat-mdc-button-base.mat-secondary-button{min-width:103px;width:auto;min-height:40px;height:auto;border-radius:3px;text-align:center;padding:.625em 1.5em;border:none;font-family:Calibri Regular;font-style:normal;font-weight:700;font-size:1em;line-height:20px;color:#000;letter-spacing:.00625em}.mat-mdc-button.mat-mdc-button-base>.mat-icon{margin-right:11px}.mat-mdc-button.mat-mdc-button-base.mat-primary-button{background-color:#00629b;color:#fff}.mat-mdc-button.mat-mdc-button-base.mat-primary-button:hover{background-color:#003e65}.mat-mdc-button.mat-mdc-button-base.mat-primary-button:active{background-color:#00629b}.mat-mdc-button.mat-mdc-button-base.mat-primary-button:disabled{background-color:#1c1b1f1f}.mat-mdc-button.mat-mdc-button-base.mat-secondary-button{color:#fff;background:#a7a8aa;box-shadow:0 1px 2px #0000004d,0 2px 6px 2px #00000026}.mat-mdc-button.mat-mdc-button-base.mat-secondary-button:hover{background:#a7a8aa}.mat-mdc-button.mat-mdc-button-base.mat-secondary-button:active{background:rgba(29,25,43,.12)}.mat-mdc-button.mat-mdc-button-base.mat-secondary-button:disabled{background:rgba(28,27,31,.12);color:#1c1b1f;opacity:.38}.ieeesa-text-button{color:#cac4d0;background:none;border:none}.flex-align-center{display:flex;align-items:center;justify-content:center}.mat-button-toggle-checked{background-color:#a7a8aa}.mat-button-toggle-checked .mat-button-toggle-label-content:before{font-family:\"Font Awesome 5 Free\";font-weight:900;content:\"\\f00c\";padding-right:.5625em}.mat-button-toggle-group .mat-button-toggle-label-content{font-family:Calibri Regular;font-style:normal;font-weight:700;font-size:1em;line-height:20px;color:#1c1b1f;letter-spacing:.00625em}@media (max-width: 768px){.mat-button-toggle-group .mat-button-toggle-label-content{max-width:8ch;text-overflow:ellipsis;white-space:nowrap;overflow:hidden;position:relative}}.cdk-overlay-pane{width:100%;min-width:312px}.ieeesa-datepicker{min-width:360px;width:auto}.ieeesa-datepicker__label-left{display:flex}.ieeesa-datepicker__label-top{display:block}.ieeesa-datepicker__date-picker-button{background:linear-gradient(0deg,rgba(0,98,155,.11),rgba(0,98,155,.11)),#fffbfe}.ieeesa-datepicker--calendar{background:linear-gradient(0deg,rgba(0,98,155,.11),rgba(0,98,155,.11)),#fffbfe;border-radius:16px}.ieeesa-datepicker--calendar .mat-calendar-body-cell-container{margin:0;padding-top:24px 0}.ieeesa-datepicker--calendar .mat-calendar-table-header th,.ieeesa-datepicker--calendar .mat-calendar-body td{height:24px!important;padding-top:24px!important;width:24px!important;padding-bottom:24px!important}.ieeesa-datepicker--calendar .mat-calendar-body-selected{background-color:#00b5e2;color:#fff;border:none;box-shadow:none}.ieeesa-datepicker--calendar .mat-calendar-body-cell:not(.mat-calendar-body-disabled):hover>.mat-calendar-body-cell-content:not(.mat-calendar-body-selected):not(.mat-calendar-body-comparison-identical){background-color:#00b5e2;color:#fff;border:none;box-shadow:none}.ieeesa-datepicker--calendar .mat-calendar-content{padding:0 8px 35px}.ieeesa-datepicker .mat-mdc-form-field{width:-webkit-fill-available}.ieeesa-datepicker .mat-mdc-text-field-wrapper.mdc-text-field.mdc-text-field--outlined.mdc-text-field--no-label,.ieeesa-datepicker .mdc-text-field--filled:not(.mdc-text-field--disabled){border:2px solid #00b5e2;border-radius:4px;height:56px;align-items:center;background-color:#f0f5f9}.ieeesa-datepicker .mdc-text-field--filled:not(.mdc-text-field--disabled) .mdc-line-ripple:before{border:none}.ieeesa-datepicker .mat-mdc-text-field-wrapper.mdc-text-field--outlined .mdc-text-field__input,.ieeesa-datepicker .mdc-text-field--no-label:not(.mdc-text-field--textarea) .mat-mdc-form-field-input-control.mdc-text-field__input{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1em;line-height:24px;color:#1c1b1f;letter-spacing:.03125em}.ieeesa-datepicker .mat-mdc-text-field-wrapper.mdc-text-field--outlined .mdc-text-field__input::placeholder,.ieeesa-datepicker .mdc-text-field--no-label:not(.mdc-text-field--textarea) .mat-mdc-form-field-input-control.mdc-text-field__input::placeholder{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1.125em;line-height:24px;color:#49454f;letter-spacing:.03125em}.ieeesa-datepicker .mat-mdc-form-field-hint{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1em;line-height:16px;color:#49454f;letter-spacing:.025em}.ieeesa-datepicker .mat-datepicker-toggle-default-icon{width:18px;height:20px}.mat-datepicker-popup .mat-datepicker-content-container{background:linear-gradient(0deg,rgba(0,98,155,.11),rgba(0,98,155,.11)),#fffbfe;border-radius:28px}.mat-datepicker-popup .mat-datepicker-content-container .mat-calendar-body-cell-content{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1.125em;line-height:24px;color:#1c1b1f;letter-spacing:.03125em}.mat-datepicker-popup .mat-datepicker-content-container .mat-calendar-body-selected{background-color:#00b5e2;color:#fff;border:none;box-shadow:none}.mat-datepicker-popup .mat-datepicker-content-container .mat-calendar-body-in-range:before{background-color:#a7a8aa;color:#49454f}.mat-datepicker-popup .mat-datepicker-content{border-radius:28px}.mat-datepicker-popup .mat-calendar-table-header{position:relative;top:25px}.mat-datepicker-popup .mat-calendar-table-header th,.mat-datepicker-popup .mat-calendar-body td{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1.125em;line-height:24px;color:#000;letter-spacing:.03125em}.mat-datepicker-popup .mat-calendar-table-header-divider,.mat-datepicker-popup .mat-calendar-body tr:first-child td:only-child{display:none}.mat-datepicker-popup .mat-calendar-body tr:first-child td:first-child:not(:only-child){visibility:hidden}.mat-datepicker-popup .mat-calendar-body{position:relative;top:20px}.mat-datepicker-popup .mat-mdc-menu-panel{min-width:360px;width:auto}.mat-datepicker-popup .mat-calendar-body-today{border-color:#00b5e2;color:#00b5e2}.mat-datepicker-popup .mat-datepicker-actions{padding:15px 10px 10px}.mat-datepicker-popup .mat-datepicker-toggle{color:#49454f}\n"] }]
+        }], ctorParameters: function () { return [{ type: i3.FormBuilder }, { type: i0.ChangeDetectorRef }, { type: DatepickerService }, { type: FormUtilityService }]; }, propDecorators: { selectedDates: [{
                 type: Input
-            }], checkboxSelection: [{
+            }], selectedRange: [{
+                type: Input
+            }], calendarType: [{
+                type: Input
+            }], formControlName: [{
+                type: Input
+            }], placeholderLabel: [{
+                type: Input
+            }], isDisabled: [{
+                type: Input
+            }], isLabelAlignedLeft: [{
+                type: Input
+            }], datepickerLabel: [{
+                type: Input
+            }], dateRange: [{
+                type: Input
+            }], selectedDate: [{
+                type: Output
+            }], selectedDateRange: [{
                 type: Output
             }] } });
 
 /**
- * Provides auto suggestion for the entered input by filtering the options from the given list of options.
+ * Provides implementation of form field radio type component
  * @export
- * @class AutocompleteComponent
+ * @class RadioComponent
  * @implements {OnInit}
  * @implements {FormField}
- * @implements {OnDestroy}
  */
-class AutocompleteComponent {
+class RadioComponent {
     // eslint-disable-next-line no-unused-vars, no-empty-function
     constructor(formUtilityService) {
         this.formUtilityService = formUtilityService;
-        this.value = '';
-        this.filteredOptions = [];
-        this.isSelectedOptionsVisible = true;
-        this.autoCompleteSearchValue = new EventEmitter();
-        this.autoCompleteOptionSelected = new EventEmitter();
-        this.destroy$ = new Subject();
-        // eslint-disable-next-line @typescript-eslint/no-explicit-any
-        this.autocompleteConstInfo = buttonActionsInfo;
-        this.optionsToFilter = [];
+        this.formControlName = 'radio';
+        this.radioGroup = [];
+        this.isDisabled = false;
+        this.selectedRadioOption = new EventEmitter();
     }
     /**
-     * Implementation of ngOnInit lifecycle hook method to initialize components instance properties.
-     * @memberof AutocompleteComponent
+     * Implementation of ngOnInit lifecycle hook method to create form group and initialize components instance properties
+     * @memberof RadioComponent
      */
     ngOnInit() {
-        this.config =
-            this.config ??
-                this.formUtilityService.getFormFieldConfig('autocomplete', FormControlType$1.AUTO_COMPLETE);
-        this.group =
-            this.group ?? this.formUtilityService.getFormGroup('autocomplete');
-        this.filteredOptions =
-            this.config?.autoCompleteOptions ?? this.filteredOptions;
-        this.optionsToFilter = this.filteredOptions;
+        if (!this.group) {
+            this.group =
+                this.group ??
+                    this.formUtilityService.getFormGroup(this.formControlName);
+        }
+        this.initializeConfigProperties();
     }
     /**
-     * Filters the options on form control value changes.
-     * @memberof AutocompleteComponent
+     * Initializes the components instance properties from config else it defines config
+     * @memberof RadioComponent
      */
-    filterOptions() {
-        this.group?.controls[this.config?.controlName]?.valueChanges
-            .pipe(
-        // eslint-disable-next-line @typescript-eslint/no-explicit-any
-        filter(
-        // eslint-disable-next-line @typescript-eslint/no-explicit-any
-        (res) => res.length >=
-            this.autocompleteConstInfo.autocomplete.minCharToSearch ||
-            res.length === 0), debounceTime(this.autocompleteConstInfo.autocomplete.debounceTime), distinctUntilChanged())
-            .pipe(takeUntil(this.destroy$))
-            .subscribe((text) => {
-            const options = this.optionsToFilter?.filter((item) => item.name.toLowerCase().includes(text.toLowerCase()));
-            this.filteredOptions = options ?? this.optionsToFilter;
-            this.autoCompleteSearchValue.emit(text);
-        });
+    initializeConfigProperties() {
+        if (this.config?.radioOptions) {
+            this.radioGroup = this.config.radioOptions;
+            this.isDisabled = this.config?.disabled ?? false;
+        }
+        this.config =
+            this.config ??
+                this.formUtilityService.getFormFieldConfig(this.formControlName, FormControlType.RADIO);
     }
     /**
-     * Emits the selected option name when the form on change event is triggered and returns option name.
-     * @param {AutoCompleteOption} data // data is an selected option of filteredOptions.
-     * @return {string} // Returns selected option name as string
-     * @memberof AutocompleteComponent
+     * Handles radio selection event on change of it
+     * @param {RadioOption} value
+     * @memberof RadioComponent
      */
-    onChange(data) {
-        this.autoCompleteOptionSelected.emit(data.name);
-        return data.name;
+    onChange(value) {
+        this.selectedRadioOption.emit(value);
     }
     /**
-     * Takes the index and the current item as arguments and needs to return the unique identifier for this item.
+     * Allows Angular to detect the specific radio option that needs to change or be added instead of rebuilding the whole radio options in DOM by tracking option unique Id.
      * @param {number} index
-     * @param {SelectOption} option
-     * @return {(number | string)}
-     * @memberof AutocompleteComponent
-     */
-    trackByFn(index, option) {
-        return option.id;
-    }
-    /**
-     * Implementation of ngOnDestroy lifecycle hook method to unsubscribe the open observable subscriptions.
-     * @memberof AutocompleteComponent
+     * @return {number}
+     * @memberof RadioComponent
      */
-    ngOnDestroy() {
-        this.destroy$.next(true);
-        this.destroy$.unsubscribe();
+    trackById(index, radio) {
+        return radio.id;
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.3", ngImport: i0, type: AutocompleteComponent, deps: [{ token: i1.FormUtilityService }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.3", type: AutocompleteComponent, isStandalone: true, selector: "ieeesa-autocomplete", inputs: { filteredOptions: "filteredOptions", isSelectedOptionsVisible: "isSelectedOptionsVisible" }, outputs: { autoCompleteSearchValue: "autoCompleteSearchValue", autoCompleteOptionSelected: "autoCompleteOptionSelected" }, providers: [
-            {
-                provide: MAT_AUTOCOMPLETE_DEFAULT_OPTIONS,
-                useValue: { overlayPanelClass: 'ieeesa-autocomplete-overlay-pane' },
-            },
-        ], viewQueries: [{ propertyName: "autoComplete", first: true, predicate: ["autoComplete"], descendants: true }], ngImport: i0, template: "<div\r\n  class=\"ieeesa-autocomplete\"\r\n  [formGroup]=\"group\"\r\n  *ngIf=\"group\"\r\n  [ngClass]=\"\r\n    config.isLabelAlignedLeft\r\n      ? 'ieeesa-autocomplete-field__label-left'\r\n      : 'ieeesa-autocomplete-field__label-top'\r\n  \"\r\n>\r\n  <mat-label class=\"ieeesa-autocomplete__label\">{{ config.label }}</mat-label>\r\n  <mat-form-field class=\"ieeesa-autocomplete__mat-form\" appearance=\"outline\">\r\n    <input\r\n      matInput\r\n      class=\"ieeesa-autocomplete__input\"\r\n      [matAutocomplete]=\"auto\"\r\n      [placeholder]=\"config.placeholder ?? ''\"\r\n      [formControlName]=\"config.controlName\"\r\n      [name]=\"config.controlName\"\r\n      #autoComplete\r\n      (keypress)=\"filterOptions()\"\r\n    />\r\n    <mat-autocomplete\r\n      #auto=\"matAutocomplete\"\r\n      (optionSelected)=\"onChange($event.option.value)\"\r\n      class=\"ieeesa-autocomplete__autocomplete-list\"\r\n    >\r\n      <ng-container *ngIf=\"isSelectedOptionsVisible\">\r\n        <mat-option\r\n          *ngFor=\"let option of filteredOptions; trackBy: trackByFn\"\r\n          [value]=\"option.name\"\r\n        >\r\n          <span>{{ option.name }}</span>\r\n        </mat-option>\r\n      </ng-container>\r\n    </mat-autocomplete>\r\n    <button\r\n      type=\"button\"\r\n      matSuffix\r\n      mat-icon-button\r\n      [attr.aria-label]=\"autocompleteConstInfo.ariaLabel.clear\"\r\n      *ngIf=\"value\"\r\n      (click)=\"value = ''\"\r\n    >\r\n      <i class=\"fa-solid fa-xmark ieeesa-autocomplete__cancel-icon\"></i>\r\n    </button>\r\n  </mat-form-field>\r\n</div>\r\n", styles: [".ieeesa-subtitle{text-align:left;font-family:Calibri Regular;font-size:1.56em;letter-spacing:0;color:#000;opacity:1}.ieeesa-body{text-align:left;font-family:Calibri Regular;font-size:1.25em;letter-spacing:0;color:#000;opacity:1}.ieeesa-display-lg-57{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:3.5625em;line-height:64px;color:#000;letter-spacing:0}.ieeesa-display-md-47{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:2.9375em;line-height:52px;color:#000;letter-spacing:0}.ieeesa-display-sm-38{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:2.375em;line-height:44px;color:#000;letter-spacing:0}.ieeesa-headline-lg-34{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:2.125em;line-height:40px;color:#000;letter-spacing:0}.ieeesa-headline-md-30{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1.875em;line-height:36px;color:#000;letter-spacing:0}.ieeesa-headline-sm-26{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1.625em;line-height:32px;color:#000;letter-spacing:0}.ieeesa-title-lg-bold-24{font-family:Calibri Regular;font-style:normal;font-weight:700;font-size:1.5em;line-height:28px;color:#000;letter-spacing:0}.ieeesa-title-lg-24{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1.5em;line-height:28px;color:#000;letter-spacing:0}.ieeesa-title-md-18{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1.125em;line-height:24px;color:#000;letter-spacing:.009375em}.ieeesa-title-sm-16{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1em;line-height:20px;color:#000;letter-spacing:.00625em}.ieeesa-label-lg-bold-16{font-family:Calibri Regular;font-style:normal;font-weight:700;font-size:1em;line-height:20px;color:#000;letter-spacing:.00625em}.ieeesa-label-lg-16{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1em;line-height:20px;color:#000;letter-spacing:.00625em}.ieeesa-label-md-14{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:.875em;line-height:16px;color:#000;letter-spacing:.03125em}.ieeesa-label-sm-13{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:.8125em;line-height:16px;color:#000;letter-spacing:.03125em}.ieeesa-body-lg-bold-18{font-family:Calibri Regular;font-style:normal;font-weight:700;font-size:1.125em;line-height:24px;color:#000;letter-spacing:.03125em}.ieeesa-body-lg-18{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1.125em;line-height:24px;color:#000;letter-spacing:.03125em}.ieeesa-body-md-16{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1em;line-height:20px;color:#000;letter-spacing:.015625em}.ieeesa-body-sm-14{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:.875em;line-height:16px;color:#000;letter-spacing:.025em}.ieeesa-title-inter-lg-bold-24{font-family:Inter Bold;font-style:normal;font-weight:700;font-size:1.5em;line-height:29px;color:#000;letter-spacing:0}.mat-mdc-button.mat-mdc-button-base.mat-primary-button,.mat-mdc-button.mat-mdc-button-base.mat-secondary-button{min-width:103px;width:auto;min-height:40px;height:auto;border-radius:3px;text-align:center;padding:.625em 1.5em;border:none;font-family:Calibri Regular;font-style:normal;font-weight:700;font-size:1em;line-height:20px;color:#000;letter-spacing:.00625em}.mat-mdc-button.mat-mdc-button-base>.mat-icon{margin-right:11px}.mat-mdc-button.mat-mdc-button-base.mat-primary-button{background-color:#00629b;color:#fff}.mat-mdc-button.mat-mdc-button-base.mat-primary-button:hover{background-color:#003e65}.mat-mdc-button.mat-mdc-button-base.mat-primary-button:active{background-color:#00629b}.mat-mdc-button.mat-mdc-button-base.mat-primary-button:disabled{background-color:#1c1b1f1f}.mat-mdc-button.mat-mdc-button-base.mat-secondary-button{color:#fff;background:#a7a8aa;box-shadow:0 1px 2px #0000004d,0 2px 6px 2px #00000026}.mat-mdc-button.mat-mdc-button-base.mat-secondary-button:hover{background:#a7a8aa}.mat-mdc-button.mat-mdc-button-base.mat-secondary-button:active{background:rgba(29,25,43,.12)}.mat-mdc-button.mat-mdc-button-base.mat-secondary-button:disabled{background:rgba(28,27,31,.12);color:#1c1b1f;opacity:.38}.ieeesa-text-button{color:#cac4d0;background:none;border:none}.flex-align-center{display:flex;align-items:center;justify-content:center}.mat-button-toggle-checked{background-color:#a7a8aa}.mat-button-toggle-checked .mat-button-toggle-label-content:before{font-family:\"Font Awesome 5 Free\";font-weight:900;content:\"\\f00c\";padding-right:.5625em}.mat-button-toggle-group .mat-button-toggle-label-content{font-family:Calibri Regular;font-style:normal;font-weight:700;font-size:1em;line-height:20px;color:#1c1b1f;letter-spacing:.00625em}@media (max-width: 768px){.mat-button-toggle-group .mat-button-toggle-label-content{max-width:8ch;text-overflow:ellipsis;white-space:nowrap;overflow:hidden;position:relative}}.cdk-overlay-pane{width:100%;min-width:312px}.ieeesa-autocomplete__label-left{display:flex}.ieeesa-autocomplete__label-top{display:block}.ieeesa-autocomplete__cancel-icon{height:20px;width:20px}.ieeesa-autocomplete .mat-mdc-form-field{border-radius:4px 4px 0 0;width:-webkit-fill-available}.ieeesa-autocomplete .mat-mdc-form-field .mdc-text-field--outlined .mdc-floating-label--float-above{color:#00b5e2}.ieeesa-autocomplete .mat-focused .mat-mdc-form-field{caret-color:#00b5e2}.ieeesa-autocomplete .mat-focused .mdc-notched-outline__leading,.ieeesa-autocomplete .mat-focused .mdc-notched-outline__trailing,.ieeesa-autocomplete .mat-focused .mdc-notched-outline__notch{border-color:#00b5e2}.ieeesa-autocomplete .mat-mdc-text-field-wrapper{min-width:12.5em;width:auto;height:3.5em;flex:auto}.ieeesa-autocomplete .mat-mdc-form-field-subscript-wrapper{width:0px;position:relative;height:0px}.ieeesa-autocomplete-overlay-pane .mat-mdc-autocomplete-panel{padding:8px 0;background:linear-gradient(0deg,rgba(0,98,155,.0784313725),rgba(0,98,155,.0784313725)),#fffbfe;box-shadow:0 1px 2px #0000004d,0 2px 6px 2px #00000026;border-radius:4px}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i3.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i3.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i3.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "ngmodule", type: MatOptionModule }, { kind: "component", type: i2$1.MatOption, selector: "mat-option", exportAs: ["matOption"] }, { kind: "ngmodule", type: MatAutocompleteModule }, { kind: "component", type: i5$1.MatAutocomplete, selector: "mat-autocomplete", inputs: ["disableRipple", "hideSingleSelectionIndicator"], exportAs: ["matAutocomplete"] }, { kind: "directive", type: i5$1.MatAutocompleteTrigger, selector: "input[matAutocomplete], textarea[matAutocomplete]", exportAs: ["matAutocompleteTrigger"] }, { kind: "ngmodule", type: MatInputModule }, { kind: "directive", type: i5.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl],      input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly"], exportAs: ["matInput"] }, { kind: "component", type: i4.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i4.MatLabel, selector: "mat-label" }, { kind: "directive", type: i4.MatSuffix, selector: "[matSuffix], [matIconSuffix], [matTextSuffix]", inputs: ["matTextSuffix"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i8.MatIconButton, selector: "button[mat-icon-button]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }], encapsulation: i0.ViewEncapsulation.None }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.3", ngImport: i0, type: RadioComponent, deps: [{ token: FormUtilityService }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.3", type: RadioComponent, isStandalone: true, selector: "ieeesa-radio", inputs: { formControlName: "formControlName", radioGroup: "radioGroup", isDisabled: "isDisabled" }, outputs: { selectedRadioOption: "selectedRadioOption" }, ngImport: i0, template: "<div [formGroup]=\"group\" class=\"ieeesa-radio-field\" *ngIf=\"group\">\r\n  <mat-label\r\n    class=\"ieeesa-body-sm-14 ieeesa-radio-field__label\"\r\n    [ngClass]=\"\r\n      config.isLabelAlignedLeft\r\n        ? 'ieeesa-radio-field__label-left'\r\n        : 'ieeesa-radio-field__label-top'\r\n    \"\r\n    >{{ config.label }}</mat-label\r\n  >\r\n  <mat-radio-group\r\n    [formControlName]=\"config.controlName\"\r\n    [disabled]=\"isDisabled\"\r\n  >\r\n    <mat-radio-button\r\n      *ngFor=\"let radio of radioGroup; trackBy: trackById\"\r\n      [value]=\"radio.label\"\r\n      [name]=\"radio.label\"\r\n      [id]=\"'' + radio.id\"\r\n      (change)=\"onChange(radio)\"\r\n      [checked]=\"radio.checked\"\r\n      class=\"ieeesa-radio-field__button\"\r\n    >\r\n      {{ radio.label }}\r\n    </mat-radio-button>\r\n  </mat-radio-group>\r\n  <ieeesa-form-error [formGroup]=\"group\" [config]=\"config\"> </ieeesa-form-error>\r\n</div>\r\n", styles: [".ieeesa-subtitle{text-align:left;font-family:Calibri Regular;font-size:1.56em;letter-spacing:0;color:#000;opacity:1}.ieeesa-body{text-align:left;font-family:Calibri Regular;font-size:1.25em;letter-spacing:0;color:#000;opacity:1}.ieeesa-display-lg-57{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:3.5625em;line-height:64px;color:#000;letter-spacing:0}.ieeesa-display-md-47{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:2.9375em;line-height:52px;color:#000;letter-spacing:0}.ieeesa-display-sm-38{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:2.375em;line-height:44px;color:#000;letter-spacing:0}.ieeesa-headline-lg-34{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:2.125em;line-height:40px;color:#000;letter-spacing:0}.ieeesa-headline-md-30{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1.875em;line-height:36px;color:#000;letter-spacing:0}.ieeesa-headline-sm-26{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1.625em;line-height:32px;color:#000;letter-spacing:0}.ieeesa-title-lg-bold-24{font-family:Calibri Regular;font-style:normal;font-weight:700;font-size:1.5em;line-height:28px;color:#000;letter-spacing:0}.ieeesa-title-lg-24{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1.5em;line-height:28px;color:#000;letter-spacing:0}.ieeesa-title-md-18{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1.125em;line-height:24px;color:#000;letter-spacing:.009375em}.ieeesa-title-sm-16{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1em;line-height:20px;color:#000;letter-spacing:.00625em}.ieeesa-label-lg-bold-16{font-family:Calibri Regular;font-style:normal;font-weight:700;font-size:1em;line-height:20px;color:#000;letter-spacing:.00625em}.ieeesa-label-lg-16{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1em;line-height:20px;color:#000;letter-spacing:.00625em}.ieeesa-label-md-14{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:.875em;line-height:16px;color:#000;letter-spacing:.03125em}.ieeesa-label-sm-13{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:.8125em;line-height:16px;color:#000;letter-spacing:.03125em}.ieeesa-body-lg-bold-18{font-family:Calibri Regular;font-style:normal;font-weight:700;font-size:1.125em;line-height:24px;color:#000;letter-spacing:.03125em}.ieeesa-body-lg-18{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1.125em;line-height:24px;color:#000;letter-spacing:.03125em}.ieeesa-body-md-16{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1em;line-height:20px;color:#000;letter-spacing:.015625em}.ieeesa-body-sm-14{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:.875em;line-height:16px;color:#000;letter-spacing:.025em}.ieeesa-title-inter-lg-bold-24{font-family:Inter Bold;font-style:normal;font-weight:700;font-size:1.5em;line-height:29px;color:#000;letter-spacing:0}.mat-mdc-button.mat-mdc-button-base.mat-primary-button,.mat-mdc-button.mat-mdc-button-base.mat-secondary-button{min-width:103px;width:auto;min-height:40px;height:auto;border-radius:3px;text-align:center;padding:.625em 1.5em;border:none;font-family:Calibri Regular;font-style:normal;font-weight:700;font-size:1em;line-height:20px;color:#000;letter-spacing:.00625em}.mat-mdc-button.mat-mdc-button-base>.mat-icon{margin-right:11px}.mat-mdc-button.mat-mdc-button-base.mat-primary-button{background-color:#00629b;color:#fff}.mat-mdc-button.mat-mdc-button-base.mat-primary-button:hover{background-color:#003e65}.mat-mdc-button.mat-mdc-button-base.mat-primary-button:active{background-color:#00629b}.mat-mdc-button.mat-mdc-button-base.mat-primary-button:disabled{background-color:#1c1b1f1f}.mat-mdc-button.mat-mdc-button-base.mat-secondary-button{color:#fff;background:#a7a8aa;box-shadow:0 1px 2px #0000004d,0 2px 6px 2px #00000026}.mat-mdc-button.mat-mdc-button-base.mat-secondary-button:hover{background:#a7a8aa}.mat-mdc-button.mat-mdc-button-base.mat-secondary-button:active{background:rgba(29,25,43,.12)}.mat-mdc-button.mat-mdc-button-base.mat-secondary-button:disabled{background:rgba(28,27,31,.12);color:#1c1b1f;opacity:.38}.ieeesa-text-button{color:#cac4d0;background:none;border:none}.flex-align-center{display:flex;align-items:center;justify-content:center}.mat-button-toggle-checked{background-color:#a7a8aa}.mat-button-toggle-checked .mat-button-toggle-label-content:before{font-family:\"Font Awesome 5 Free\";font-weight:900;content:\"\\f00c\";padding-right:.5625em}.mat-button-toggle-group .mat-button-toggle-label-content{font-family:Calibri Regular;font-style:normal;font-weight:700;font-size:1em;line-height:20px;color:#1c1b1f;letter-spacing:.00625em}@media (max-width: 768px){.mat-button-toggle-group .mat-button-toggle-label-content{max-width:8ch;text-overflow:ellipsis;white-space:nowrap;overflow:hidden;position:relative}}.cdk-overlay-pane{width:100%;min-width:312px}.ieeesa-radio-field__label-left{display:inline-block;padding-right:20%}.ieeesa-radio-field__label-top{display:block}.ieeesa-radio-field .mat-mdc-radio-button .mdc-radio .mdc-radio__native-control:enabled+.mdc-radio__background .mdc-radio__inner-circle{border-color:#00b5e2!important}.ieeesa-radio-field .mat-mdc-radio-button .mdc-radio .mdc-radio__native-control:enabled:checked+.mdc-radio__background .mdc-radio__outer-circle{border-color:#00b5e2!important}.ieeesa-radio-field .mat-mdc-radio-button .mdc-radio .mdc-radio__native-control:enabled:not(:checked)+.mdc-radio__background .mdc-radio__outer-circle{border-color:#49454f}.ieeesa-radio-field .mat-mdc-radio-button .mdc-radio:hover .mdc-radio__native-control:enabled:not(:checked)+.mdc-radio__background .mdc-radio__outer-circle{border-color:#1c1b1f}.ieeesa-radio-field .mat-ripple-element{background-color:#6750a4}.ieeesa-radio-field .mat-mdc-radio-button.mat-mdc-radio-checked .mat-ripple-element{background-color:#1c1b1f}.ieeesa-radio-field .mat-mdc-radio-button .mat-radio-ripple .mat-ripple-element{opacity:.12}.ieeesa-radio-field .mat-mdc-radio-button .mdc-radio:hover .mdc-radio__native-control:not([disabled]):not(:focus)~.mdc-radio__background:before{opacity:.08}.ieeesa-radio-field .mat-mdc-radio-button.mat-accent{--mat-mdc-radio-checked-ripple-color: $ieeesa-radio-ripple-blue-color;--mat-mdc-radio-ripple-color: $ieeesa-background-black}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "ngmodule", type: MatRadioModule }, { kind: "directive", type: i3$3.MatRadioGroup, selector: "mat-radio-group", exportAs: ["matRadioGroup"] }, { kind: "component", type: i3$3.MatRadioButton, selector: "mat-radio-button", inputs: ["disableRipple", "tabIndex"], exportAs: ["matRadioButton"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i3.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i3.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "component", type: FormErrorComponent, selector: "ieeesa-form-error", inputs: ["formGroup", "config", "submitResponse"] }, { kind: "ngmodule", type: MatFormFieldModule }, { kind: "directive", type: i4.MatLabel, selector: "mat-label" }], encapsulation: i0.ViewEncapsulation.None }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.3", ngImport: i0, type: AutocompleteComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.3", ngImport: i0, type: RadioComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'ieeesa-autocomplete', standalone: true, imports: [
+            args: [{ selector: 'ieeesa-radio', standalone: true, imports: [
                         CommonModule,
+                        MatRadioModule,
                         ReactiveFormsModule,
-                        FormErrorComponent$1,
-                        MatOptionModule,
-                        MatAutocompleteModule,
-                        MatInputModule,
-                        MatIconModule,
-                        MatButtonModule,
-                    ], providers: [
-                        {
-                            provide: MAT_AUTOCOMPLETE_DEFAULT_OPTIONS,
-                            useValue: { overlayPanelClass: 'ieeesa-autocomplete-overlay-pane' },
-                        },
-                    ], encapsulation: ViewEncapsulation.None, template: "<div\r\n  class=\"ieeesa-autocomplete\"\r\n  [formGroup]=\"group\"\r\n  *ngIf=\"group\"\r\n  [ngClass]=\"\r\n    config.isLabelAlignedLeft\r\n      ? 'ieeesa-autocomplete-field__label-left'\r\n      : 'ieeesa-autocomplete-field__label-top'\r\n  \"\r\n>\r\n  <mat-label class=\"ieeesa-autocomplete__label\">{{ config.label }}</mat-label>\r\n  <mat-form-field class=\"ieeesa-autocomplete__mat-form\" appearance=\"outline\">\r\n    <input\r\n      matInput\r\n      class=\"ieeesa-autocomplete__input\"\r\n      [matAutocomplete]=\"auto\"\r\n      [placeholder]=\"config.placeholder ?? ''\"\r\n      [formControlName]=\"config.controlName\"\r\n      [name]=\"config.controlName\"\r\n      #autoComplete\r\n      (keypress)=\"filterOptions()\"\r\n    />\r\n    <mat-autocomplete\r\n      #auto=\"matAutocomplete\"\r\n      (optionSelected)=\"onChange($event.option.value)\"\r\n      class=\"ieeesa-autocomplete__autocomplete-list\"\r\n    >\r\n      <ng-container *ngIf=\"isSelectedOptionsVisible\">\r\n        <mat-option\r\n          *ngFor=\"let option of filteredOptions; trackBy: trackByFn\"\r\n          [value]=\"option.name\"\r\n        >\r\n          <span>{{ option.name }}</span>\r\n        </mat-option>\r\n      </ng-container>\r\n    </mat-autocomplete>\r\n    <button\r\n      type=\"button\"\r\n      matSuffix\r\n      mat-icon-button\r\n      [attr.aria-label]=\"autocompleteConstInfo.ariaLabel.clear\"\r\n      *ngIf=\"value\"\r\n      (click)=\"value = ''\"\r\n    >\r\n      <i class=\"fa-solid fa-xmark ieeesa-autocomplete__cancel-icon\"></i>\r\n    </button>\r\n  </mat-form-field>\r\n</div>\r\n", styles: [".ieeesa-subtitle{text-align:left;font-family:Calibri Regular;font-size:1.56em;letter-spacing:0;color:#000;opacity:1}.ieeesa-body{text-align:left;font-family:Calibri Regular;font-size:1.25em;letter-spacing:0;color:#000;opacity:1}.ieeesa-display-lg-57{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:3.5625em;line-height:64px;color:#000;letter-spacing:0}.ieeesa-display-md-47{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:2.9375em;line-height:52px;color:#000;letter-spacing:0}.ieeesa-display-sm-38{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:2.375em;line-height:44px;color:#000;letter-spacing:0}.ieeesa-headline-lg-34{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:2.125em;line-height:40px;color:#000;letter-spacing:0}.ieeesa-headline-md-30{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1.875em;line-height:36px;color:#000;letter-spacing:0}.ieeesa-headline-sm-26{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1.625em;line-height:32px;color:#000;letter-spacing:0}.ieeesa-title-lg-bold-24{font-family:Calibri Regular;font-style:normal;font-weight:700;font-size:1.5em;line-height:28px;color:#000;letter-spacing:0}.ieeesa-title-lg-24{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1.5em;line-height:28px;color:#000;letter-spacing:0}.ieeesa-title-md-18{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1.125em;line-height:24px;color:#000;letter-spacing:.009375em}.ieeesa-title-sm-16{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1em;line-height:20px;color:#000;letter-spacing:.00625em}.ieeesa-label-lg-bold-16{font-family:Calibri Regular;font-style:normal;font-weight:700;font-size:1em;line-height:20px;color:#000;letter-spacing:.00625em}.ieeesa-label-lg-16{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1em;line-height:20px;color:#000;letter-spacing:.00625em}.ieeesa-label-md-14{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:.875em;line-height:16px;color:#000;letter-spacing:.03125em}.ieeesa-label-sm-13{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:.8125em;line-height:16px;color:#000;letter-spacing:.03125em}.ieeesa-body-lg-bold-18{font-family:Calibri Regular;font-style:normal;font-weight:700;font-size:1.125em;line-height:24px;color:#000;letter-spacing:.03125em}.ieeesa-body-lg-18{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1.125em;line-height:24px;color:#000;letter-spacing:.03125em}.ieeesa-body-md-16{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1em;line-height:20px;color:#000;letter-spacing:.015625em}.ieeesa-body-sm-14{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:.875em;line-height:16px;color:#000;letter-spacing:.025em}.ieeesa-title-inter-lg-bold-24{font-family:Inter Bold;font-style:normal;font-weight:700;font-size:1.5em;line-height:29px;color:#000;letter-spacing:0}.mat-mdc-button.mat-mdc-button-base.mat-primary-button,.mat-mdc-button.mat-mdc-button-base.mat-secondary-button{min-width:103px;width:auto;min-height:40px;height:auto;border-radius:3px;text-align:center;padding:.625em 1.5em;border:none;font-family:Calibri Regular;font-style:normal;font-weight:700;font-size:1em;line-height:20px;color:#000;letter-spacing:.00625em}.mat-mdc-button.mat-mdc-button-base>.mat-icon{margin-right:11px}.mat-mdc-button.mat-mdc-button-base.mat-primary-button{background-color:#00629b;color:#fff}.mat-mdc-button.mat-mdc-button-base.mat-primary-button:hover{background-color:#003e65}.mat-mdc-button.mat-mdc-button-base.mat-primary-button:active{background-color:#00629b}.mat-mdc-button.mat-mdc-button-base.mat-primary-button:disabled{background-color:#1c1b1f1f}.mat-mdc-button.mat-mdc-button-base.mat-secondary-button{color:#fff;background:#a7a8aa;box-shadow:0 1px 2px #0000004d,0 2px 6px 2px #00000026}.mat-mdc-button.mat-mdc-button-base.mat-secondary-button:hover{background:#a7a8aa}.mat-mdc-button.mat-mdc-button-base.mat-secondary-button:active{background:rgba(29,25,43,.12)}.mat-mdc-button.mat-mdc-button-base.mat-secondary-button:disabled{background:rgba(28,27,31,.12);color:#1c1b1f;opacity:.38}.ieeesa-text-button{color:#cac4d0;background:none;border:none}.flex-align-center{display:flex;align-items:center;justify-content:center}.mat-button-toggle-checked{background-color:#a7a8aa}.mat-button-toggle-checked .mat-button-toggle-label-content:before{font-family:\"Font Awesome 5 Free\";font-weight:900;content:\"\\f00c\";padding-right:.5625em}.mat-button-toggle-group .mat-button-toggle-label-content{font-family:Calibri Regular;font-style:normal;font-weight:700;font-size:1em;line-height:20px;color:#1c1b1f;letter-spacing:.00625em}@media (max-width: 768px){.mat-button-toggle-group .mat-button-toggle-label-content{max-width:8ch;text-overflow:ellipsis;white-space:nowrap;overflow:hidden;position:relative}}.cdk-overlay-pane{width:100%;min-width:312px}.ieeesa-autocomplete__label-left{display:flex}.ieeesa-autocomplete__label-top{display:block}.ieeesa-autocomplete__cancel-icon{height:20px;width:20px}.ieeesa-autocomplete .mat-mdc-form-field{border-radius:4px 4px 0 0;width:-webkit-fill-available}.ieeesa-autocomplete .mat-mdc-form-field .mdc-text-field--outlined .mdc-floating-label--float-above{color:#00b5e2}.ieeesa-autocomplete .mat-focused .mat-mdc-form-field{caret-color:#00b5e2}.ieeesa-autocomplete .mat-focused .mdc-notched-outline__leading,.ieeesa-autocomplete .mat-focused .mdc-notched-outline__trailing,.ieeesa-autocomplete .mat-focused .mdc-notched-outline__notch{border-color:#00b5e2}.ieeesa-autocomplete .mat-mdc-text-field-wrapper{min-width:12.5em;width:auto;height:3.5em;flex:auto}.ieeesa-autocomplete .mat-mdc-form-field-subscript-wrapper{width:0px;position:relative;height:0px}.ieeesa-autocomplete-overlay-pane .mat-mdc-autocomplete-panel{padding:8px 0;background:linear-gradient(0deg,rgba(0,98,155,.0784313725),rgba(0,98,155,.0784313725)),#fffbfe;box-shadow:0 1px 2px #0000004d,0 2px 6px 2px #00000026;border-radius:4px}\n"] }]
-        }], ctorParameters: function () { return [{ type: i1.FormUtilityService }]; }, propDecorators: { filteredOptions: [{
+                        FormErrorComponent,
+                        MatFormFieldModule,
+                    ], encapsulation: ViewEncapsulation.None, template: "<div [formGroup]=\"group\" class=\"ieeesa-radio-field\" *ngIf=\"group\">\r\n  <mat-label\r\n    class=\"ieeesa-body-sm-14 ieeesa-radio-field__label\"\r\n    [ngClass]=\"\r\n      config.isLabelAlignedLeft\r\n        ? 'ieeesa-radio-field__label-left'\r\n        : 'ieeesa-radio-field__label-top'\r\n    \"\r\n    >{{ config.label }}</mat-label\r\n  >\r\n  <mat-radio-group\r\n    [formControlName]=\"config.controlName\"\r\n    [disabled]=\"isDisabled\"\r\n  >\r\n    <mat-radio-button\r\n      *ngFor=\"let radio of radioGroup; trackBy: trackById\"\r\n      [value]=\"radio.label\"\r\n      [name]=\"radio.label\"\r\n      [id]=\"'' + radio.id\"\r\n      (change)=\"onChange(radio)\"\r\n      [checked]=\"radio.checked\"\r\n      class=\"ieeesa-radio-field__button\"\r\n    >\r\n      {{ radio.label }}\r\n    </mat-radio-button>\r\n  </mat-radio-group>\r\n  <ieeesa-form-error [formGroup]=\"group\" [config]=\"config\"> </ieeesa-form-error>\r\n</div>\r\n", styles: [".ieeesa-subtitle{text-align:left;font-family:Calibri Regular;font-size:1.56em;letter-spacing:0;color:#000;opacity:1}.ieeesa-body{text-align:left;font-family:Calibri Regular;font-size:1.25em;letter-spacing:0;color:#000;opacity:1}.ieeesa-display-lg-57{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:3.5625em;line-height:64px;color:#000;letter-spacing:0}.ieeesa-display-md-47{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:2.9375em;line-height:52px;color:#000;letter-spacing:0}.ieeesa-display-sm-38{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:2.375em;line-height:44px;color:#000;letter-spacing:0}.ieeesa-headline-lg-34{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:2.125em;line-height:40px;color:#000;letter-spacing:0}.ieeesa-headline-md-30{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1.875em;line-height:36px;color:#000;letter-spacing:0}.ieeesa-headline-sm-26{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1.625em;line-height:32px;color:#000;letter-spacing:0}.ieeesa-title-lg-bold-24{font-family:Calibri Regular;font-style:normal;font-weight:700;font-size:1.5em;line-height:28px;color:#000;letter-spacing:0}.ieeesa-title-lg-24{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1.5em;line-height:28px;color:#000;letter-spacing:0}.ieeesa-title-md-18{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1.125em;line-height:24px;color:#000;letter-spacing:.009375em}.ieeesa-title-sm-16{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1em;line-height:20px;color:#000;letter-spacing:.00625em}.ieeesa-label-lg-bold-16{font-family:Calibri Regular;font-style:normal;font-weight:700;font-size:1em;line-height:20px;color:#000;letter-spacing:.00625em}.ieeesa-label-lg-16{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1em;line-height:20px;color:#000;letter-spacing:.00625em}.ieeesa-label-md-14{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:.875em;line-height:16px;color:#000;letter-spacing:.03125em}.ieeesa-label-sm-13{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:.8125em;line-height:16px;color:#000;letter-spacing:.03125em}.ieeesa-body-lg-bold-18{font-family:Calibri Regular;font-style:normal;font-weight:700;font-size:1.125em;line-height:24px;color:#000;letter-spacing:.03125em}.ieeesa-body-lg-18{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1.125em;line-height:24px;color:#000;letter-spacing:.03125em}.ieeesa-body-md-16{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1em;line-height:20px;color:#000;letter-spacing:.015625em}.ieeesa-body-sm-14{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:.875em;line-height:16px;color:#000;letter-spacing:.025em}.ieeesa-title-inter-lg-bold-24{font-family:Inter Bold;font-style:normal;font-weight:700;font-size:1.5em;line-height:29px;color:#000;letter-spacing:0}.mat-mdc-button.mat-mdc-button-base.mat-primary-button,.mat-mdc-button.mat-mdc-button-base.mat-secondary-button{min-width:103px;width:auto;min-height:40px;height:auto;border-radius:3px;text-align:center;padding:.625em 1.5em;border:none;font-family:Calibri Regular;font-style:normal;font-weight:700;font-size:1em;line-height:20px;color:#000;letter-spacing:.00625em}.mat-mdc-button.mat-mdc-button-base>.mat-icon{margin-right:11px}.mat-mdc-button.mat-mdc-button-base.mat-primary-button{background-color:#00629b;color:#fff}.mat-mdc-button.mat-mdc-button-base.mat-primary-button:hover{background-color:#003e65}.mat-mdc-button.mat-mdc-button-base.mat-primary-button:active{background-color:#00629b}.mat-mdc-button.mat-mdc-button-base.mat-primary-button:disabled{background-color:#1c1b1f1f}.mat-mdc-button.mat-mdc-button-base.mat-secondary-button{color:#fff;background:#a7a8aa;box-shadow:0 1px 2px #0000004d,0 2px 6px 2px #00000026}.mat-mdc-button.mat-mdc-button-base.mat-secondary-button:hover{background:#a7a8aa}.mat-mdc-button.mat-mdc-button-base.mat-secondary-button:active{background:rgba(29,25,43,.12)}.mat-mdc-button.mat-mdc-button-base.mat-secondary-button:disabled{background:rgba(28,27,31,.12);color:#1c1b1f;opacity:.38}.ieeesa-text-button{color:#cac4d0;background:none;border:none}.flex-align-center{display:flex;align-items:center;justify-content:center}.mat-button-toggle-checked{background-color:#a7a8aa}.mat-button-toggle-checked .mat-button-toggle-label-content:before{font-family:\"Font Awesome 5 Free\";font-weight:900;content:\"\\f00c\";padding-right:.5625em}.mat-button-toggle-group .mat-button-toggle-label-content{font-family:Calibri Regular;font-style:normal;font-weight:700;font-size:1em;line-height:20px;color:#1c1b1f;letter-spacing:.00625em}@media (max-width: 768px){.mat-button-toggle-group .mat-button-toggle-label-content{max-width:8ch;text-overflow:ellipsis;white-space:nowrap;overflow:hidden;position:relative}}.cdk-overlay-pane{width:100%;min-width:312px}.ieeesa-radio-field__label-left{display:inline-block;padding-right:20%}.ieeesa-radio-field__label-top{display:block}.ieeesa-radio-field .mat-mdc-radio-button .mdc-radio .mdc-radio__native-control:enabled+.mdc-radio__background .mdc-radio__inner-circle{border-color:#00b5e2!important}.ieeesa-radio-field .mat-mdc-radio-button .mdc-radio .mdc-radio__native-control:enabled:checked+.mdc-radio__background .mdc-radio__outer-circle{border-color:#00b5e2!important}.ieeesa-radio-field .mat-mdc-radio-button .mdc-radio .mdc-radio__native-control:enabled:not(:checked)+.mdc-radio__background .mdc-radio__outer-circle{border-color:#49454f}.ieeesa-radio-field .mat-mdc-radio-button .mdc-radio:hover .mdc-radio__native-control:enabled:not(:checked)+.mdc-radio__background .mdc-radio__outer-circle{border-color:#1c1b1f}.ieeesa-radio-field .mat-ripple-element{background-color:#6750a4}.ieeesa-radio-field .mat-mdc-radio-button.mat-mdc-radio-checked .mat-ripple-element{background-color:#1c1b1f}.ieeesa-radio-field .mat-mdc-radio-button .mat-radio-ripple .mat-ripple-element{opacity:.12}.ieeesa-radio-field .mat-mdc-radio-button .mdc-radio:hover .mdc-radio__native-control:not([disabled]):not(:focus)~.mdc-radio__background:before{opacity:.08}.ieeesa-radio-field .mat-mdc-radio-button.mat-accent{--mat-mdc-radio-checked-ripple-color: $ieeesa-radio-ripple-blue-color;--mat-mdc-radio-ripple-color: $ieeesa-background-black}\n"] }]
+        }], ctorParameters: function () { return [{ type: FormUtilityService }]; }, propDecorators: { formControlName: [{
                 type: Input
-            }], isSelectedOptionsVisible: [{
+            }], radioGroup: [{
                 type: Input
-            }], autoCompleteSearchValue: [{
-                type: Output
-            }], autoCompleteOptionSelected: [{
+            }], isDisabled: [{
+                type: Input
+            }], selectedRadioOption: [{
                 type: Output
-            }], autoComplete: [{
-                type: ViewChild,
-                args: ['autoComplete']
             }] } });
 
+const ValidationPatterns = {
+    alphanumeric: /^[a-zA-Z0-9 _-]+$/,
+    mixOfAlphanumeric: /^[0-9]*[a-zA-Z]+[a-zA-Z0-9 _()-]*$/,
+    numeric: '^0|[1-9][0-9]*$',
+    email: /^[a-z0-9._%+-]+@[a-z0-9.-]+\\.[a-z]{2,4}$/,
+};
+
+var SearchType;
+(function (SearchType) {
+    // eslint-disable-next-line no-unused-vars
+    SearchType["EMAIL"] = "EMAIL";
+    // eslint-disable-next-line no-unused-vars
+    SearchType["AUTO"] = "AUTO";
+    // eslint-disable-next-line no-unused-vars
+    SearchType["ON_CLICK"] = "ON_CLICK";
+})(SearchType || (SearchType = {}));
+
 const MIN_CHAR = 3;
 /**
  * Component support search capability and used as a form filed with type search and independently as search component.
@@ -996,12 +1109,12 @@ class SearchComponent {
         this.formUtilityService = formUtilityService;
         this.formControlName = 'search';
         this.placeholderLabel = '';
-        this.searchType = SearchType$1.AUTO;
+        this.searchType = SearchType.AUTO;
         this.searchTerm = '';
         this.searchValue = new EventEmitter();
         this.destroy$ = new Subject();
         // eslint-disable-next-line @typescript-eslint/no-explicit-any
-        this.searchInfo = buttonActionsInfo;
+        this.searchInfo = constantsInfo;
     }
     /**
      * Implementation of ngOnInit lifecycle hook method to initialize config and form group if its undefined
@@ -1010,7 +1123,7 @@ class SearchComponent {
     ngOnInit() {
         this.config =
             this.config ??
-                this.formUtilityService.getFormFieldConfig(this.formControlName, FormControlType$1.SEARCH);
+                this.formUtilityService.getFormFieldConfig(this.formControlName, FormControlType.SEARCH);
         this.group =
             this.group ?? this.formUtilityService.getFormGroup(this.formControlName);
     }
@@ -1019,7 +1132,7 @@ class SearchComponent {
      * @memberof SearchComponent
      */
     ngAfterViewInit() {
-        if (this.searchType === SearchType$1.AUTO && this.searchControl) {
+        if (this.searchType === SearchType.AUTO && this.searchControl) {
             fromEvent(this.searchControl?.nativeElement, 'keyup')
                 .pipe(
             // eslint-disable-next-line @typescript-eslint/no-explicit-any
@@ -1069,20 +1182,20 @@ class SearchComponent {
         this.destroy$.next(true);
         this.destroy$.unsubscribe();
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.3", ngImport: i0, type: SearchComponent, deps: [{ token: i1.FormUtilityService }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.3", type: SearchComponent, isStandalone: true, selector: "ieeesa-search", inputs: { formControlName: "formControlName", placeholderLabel: "placeholderLabel", searchType: "searchType", searchTerm: "searchTerm" }, outputs: { searchValue: "searchValue" }, viewQueries: [{ propertyName: "searchControl", first: true, predicate: ["searchControl"], descendants: true }], ngImport: i0, template: "<div\r\n  [formGroup]=\"group\"\r\n  class=\"ieeesa-search-field\"\r\n  *ngIf=\"group\"\r\n  [ngClass]=\"\r\n    config.isLabelAlignedLeft\r\n      ? 'ieeesa-search-field__label-left'\r\n      : 'ieeesa-search-field__label-top'\r\n  \"\r\n>\r\n  <mat-label class=\"ieeesa-body-sm-14 ieeesa-search-field__label\">{{\r\n    config.label\r\n  }}</mat-label>\r\n  <mat-form-field appearance=\"outline\">\r\n    <span class=\"ieeesa-search-field__content\">\r\n      <input\r\n        matInput\r\n        autocomplete=\"off\"\r\n        [type]=\"searchType\"\r\n        [formControlName]=\"config.controlName\"\r\n        [placeholder]=\"placeholderLabel\"\r\n        (change)=\"onChange()\"\r\n        (input)=\"onSearchInputChange()\"\r\n        bindon-ngModel=\"searchTerm\"\r\n        #searchControl\r\n      />\r\n      <i\r\n        class=\"fa-solid fa-magnifying-glass ieeesa-search-field__search-icon\"\r\n      ></i>\r\n    </span>\r\n  </mat-form-field>\r\n  <ieeesa-form-error [formGroup]=\"group\" [config]=\"config\"> </ieeesa-form-error>\r\n</div>\r\n", styles: [".ieeesa-subtitle{text-align:left;font-family:Calibri Regular;font-size:1.56em;letter-spacing:0;color:#000;opacity:1}.ieeesa-body{text-align:left;font-family:Calibri Regular;font-size:1.25em;letter-spacing:0;color:#000;opacity:1}.ieeesa-display-lg-57{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:3.5625em;line-height:64px;color:#000;letter-spacing:0}.ieeesa-display-md-47{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:2.9375em;line-height:52px;color:#000;letter-spacing:0}.ieeesa-display-sm-38{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:2.375em;line-height:44px;color:#000;letter-spacing:0}.ieeesa-headline-lg-34{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:2.125em;line-height:40px;color:#000;letter-spacing:0}.ieeesa-headline-md-30{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1.875em;line-height:36px;color:#000;letter-spacing:0}.ieeesa-headline-sm-26{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1.625em;line-height:32px;color:#000;letter-spacing:0}.ieeesa-title-lg-bold-24{font-family:Calibri Regular;font-style:normal;font-weight:700;font-size:1.5em;line-height:28px;color:#000;letter-spacing:0}.ieeesa-title-lg-24{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1.5em;line-height:28px;color:#000;letter-spacing:0}.ieeesa-title-md-18{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1.125em;line-height:24px;color:#000;letter-spacing:.009375em}.ieeesa-title-sm-16{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1em;line-height:20px;color:#000;letter-spacing:.00625em}.ieeesa-label-lg-bold-16{font-family:Calibri Regular;font-style:normal;font-weight:700;font-size:1em;line-height:20px;color:#000;letter-spacing:.00625em}.ieeesa-label-lg-16{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1em;line-height:20px;color:#000;letter-spacing:.00625em}.ieeesa-label-md-14{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:.875em;line-height:16px;color:#000;letter-spacing:.03125em}.ieeesa-label-sm-13{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:.8125em;line-height:16px;color:#000;letter-spacing:.03125em}.ieeesa-body-lg-bold-18{font-family:Calibri Regular;font-style:normal;font-weight:700;font-size:1.125em;line-height:24px;color:#000;letter-spacing:.03125em}.ieeesa-body-lg-18{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1.125em;line-height:24px;color:#000;letter-spacing:.03125em}.ieeesa-body-md-16{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1em;line-height:20px;color:#000;letter-spacing:.015625em}.ieeesa-body-sm-14{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:.875em;line-height:16px;color:#000;letter-spacing:.025em}.ieeesa-title-inter-lg-bold-24{font-family:Inter Bold;font-style:normal;font-weight:700;font-size:1.5em;line-height:29px;color:#000;letter-spacing:0}.mat-mdc-button.mat-mdc-button-base.mat-primary-button,.mat-mdc-button.mat-mdc-button-base.mat-secondary-button{min-width:103px;width:auto;min-height:40px;height:auto;border-radius:3px;text-align:center;padding:.625em 1.5em;border:none;font-family:Calibri Regular;font-style:normal;font-weight:700;font-size:1em;line-height:20px;color:#000;letter-spacing:.00625em}.mat-mdc-button.mat-mdc-button-base>.mat-icon{margin-right:11px}.mat-mdc-button.mat-mdc-button-base.mat-primary-button{background-color:#00629b;color:#fff}.mat-mdc-button.mat-mdc-button-base.mat-primary-button:hover{background-color:#003e65}.mat-mdc-button.mat-mdc-button-base.mat-primary-button:active{background-color:#00629b}.mat-mdc-button.mat-mdc-button-base.mat-primary-button:disabled{background-color:#1c1b1f1f}.mat-mdc-button.mat-mdc-button-base.mat-secondary-button{color:#fff;background:#a7a8aa;box-shadow:0 1px 2px #0000004d,0 2px 6px 2px #00000026}.mat-mdc-button.mat-mdc-button-base.mat-secondary-button:hover{background:#a7a8aa}.mat-mdc-button.mat-mdc-button-base.mat-secondary-button:active{background:rgba(29,25,43,.12)}.mat-mdc-button.mat-mdc-button-base.mat-secondary-button:disabled{background:rgba(28,27,31,.12);color:#1c1b1f;opacity:.38}.ieeesa-text-button{color:#cac4d0;background:none;border:none}.flex-align-center{display:flex;align-items:center;justify-content:center}.mat-button-toggle-checked{background-color:#a7a8aa}.mat-button-toggle-checked .mat-button-toggle-label-content:before{font-family:\"Font Awesome 5 Free\";font-weight:900;content:\"\\f00c\";padding-right:.5625em}.mat-button-toggle-group .mat-button-toggle-label-content{font-family:Calibri Regular;font-style:normal;font-weight:700;font-size:1em;line-height:20px;color:#1c1b1f;letter-spacing:.00625em}@media (max-width: 768px){.mat-button-toggle-group .mat-button-toggle-label-content{max-width:8ch;text-overflow:ellipsis;white-space:nowrap;overflow:hidden;position:relative}}.cdk-overlay-pane{width:100%;min-width:312px}.ieeesa-search-field__search-icon{height:20px;width:20px}.ieeesa-search-field__content{display:flex;align-items:center}.ieeesa-search-field__label-left{display:flex}.ieeesa-search-field__label-top{display:block}.ieeesa-search-field .mat-mdc-form-field{height:50px;width:-webkit-fill-available;padding:0 5px}.ieeesa-search-field .mat-form-field-flex{display:flex;align-items:center;height:40px;margin-left:0}.ieeesa-search-field .mat-mdc-input-element{padding-left:5px}.ieeesa-search-field .mat-mdc-form-field-infix{padding-top:10px;padding-bottom:0}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i3.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i3.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i3.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "component", type: FormErrorComponent$1, selector: "ieeesa-form-error", inputs: ["formGroup", "config", "submitResponse"] }, { kind: "ngmodule", type: MatFormFieldModule }, { kind: "component", type: i4.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i4.MatLabel, selector: "mat-label" }, { kind: "ngmodule", type: MatInputModule }, { kind: "directive", type: i5.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl],      input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly"], exportAs: ["matInput"] }, { kind: "ngmodule", type: MatIconModule }], encapsulation: i0.ViewEncapsulation.None }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.3", ngImport: i0, type: SearchComponent, deps: [{ token: FormUtilityService }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.3", type: SearchComponent, isStandalone: true, selector: "ieeesa-search", inputs: { formControlName: "formControlName", placeholderLabel: "placeholderLabel", searchType: "searchType", searchTerm: "searchTerm" }, outputs: { searchValue: "searchValue" }, viewQueries: [{ propertyName: "searchControl", first: true, predicate: ["searchControl"], descendants: true }], ngImport: i0, template: "<div\r\n  [formGroup]=\"group\"\r\n  class=\"ieeesa-search-field\"\r\n  *ngIf=\"group\"\r\n  [ngClass]=\"\r\n    config.isLabelAlignedLeft\r\n      ? 'ieeesa-search-field__label-left'\r\n      : 'ieeesa-search-field__label-top'\r\n  \"\r\n>\r\n  <mat-label class=\"ieeesa-body-sm-14 ieeesa-search-field__label\">{{\r\n    config.label\r\n  }}</mat-label>\r\n  <mat-form-field appearance=\"outline\">\r\n    <span class=\"ieeesa-search-field__content\">\r\n      <input\r\n        matInput\r\n        autocomplete=\"off\"\r\n        [type]=\"searchType\"\r\n        [formControlName]=\"config.controlName\"\r\n        [placeholder]=\"placeholderLabel\"\r\n        (change)=\"onChange()\"\r\n        (input)=\"onSearchInputChange()\"\r\n        bindon-ngModel=\"searchTerm\"\r\n        #searchControl\r\n      />\r\n      <i\r\n        class=\"fa-solid fa-magnifying-glass ieeesa-search-field__search-icon\"\r\n      ></i>\r\n    </span>\r\n  </mat-form-field>\r\n  <ieeesa-form-error [formGroup]=\"group\" [config]=\"config\"> </ieeesa-form-error>\r\n</div>\r\n", styles: [".ieeesa-subtitle{text-align:left;font-family:Calibri Regular;font-size:1.56em;letter-spacing:0;color:#000;opacity:1}.ieeesa-body{text-align:left;font-family:Calibri Regular;font-size:1.25em;letter-spacing:0;color:#000;opacity:1}.ieeesa-display-lg-57{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:3.5625em;line-height:64px;color:#000;letter-spacing:0}.ieeesa-display-md-47{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:2.9375em;line-height:52px;color:#000;letter-spacing:0}.ieeesa-display-sm-38{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:2.375em;line-height:44px;color:#000;letter-spacing:0}.ieeesa-headline-lg-34{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:2.125em;line-height:40px;color:#000;letter-spacing:0}.ieeesa-headline-md-30{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1.875em;line-height:36px;color:#000;letter-spacing:0}.ieeesa-headline-sm-26{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1.625em;line-height:32px;color:#000;letter-spacing:0}.ieeesa-title-lg-bold-24{font-family:Calibri Regular;font-style:normal;font-weight:700;font-size:1.5em;line-height:28px;color:#000;letter-spacing:0}.ieeesa-title-lg-24{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1.5em;line-height:28px;color:#000;letter-spacing:0}.ieeesa-title-md-18{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1.125em;line-height:24px;color:#000;letter-spacing:.009375em}.ieeesa-title-sm-16{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1em;line-height:20px;color:#000;letter-spacing:.00625em}.ieeesa-label-lg-bold-16{font-family:Calibri Regular;font-style:normal;font-weight:700;font-size:1em;line-height:20px;color:#000;letter-spacing:.00625em}.ieeesa-label-lg-16{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1em;line-height:20px;color:#000;letter-spacing:.00625em}.ieeesa-label-md-14{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:.875em;line-height:16px;color:#000;letter-spacing:.03125em}.ieeesa-label-sm-13{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:.8125em;line-height:16px;color:#000;letter-spacing:.03125em}.ieeesa-body-lg-bold-18{font-family:Calibri Regular;font-style:normal;font-weight:700;font-size:1.125em;line-height:24px;color:#000;letter-spacing:.03125em}.ieeesa-body-lg-18{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1.125em;line-height:24px;color:#000;letter-spacing:.03125em}.ieeesa-body-md-16{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1em;line-height:20px;color:#000;letter-spacing:.015625em}.ieeesa-body-sm-14{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:.875em;line-height:16px;color:#000;letter-spacing:.025em}.ieeesa-title-inter-lg-bold-24{font-family:Inter Bold;font-style:normal;font-weight:700;font-size:1.5em;line-height:29px;color:#000;letter-spacing:0}.mat-mdc-button.mat-mdc-button-base.mat-primary-button,.mat-mdc-button.mat-mdc-button-base.mat-secondary-button{min-width:103px;width:auto;min-height:40px;height:auto;border-radius:3px;text-align:center;padding:.625em 1.5em;border:none;font-family:Calibri Regular;font-style:normal;font-weight:700;font-size:1em;line-height:20px;color:#000;letter-spacing:.00625em}.mat-mdc-button.mat-mdc-button-base>.mat-icon{margin-right:11px}.mat-mdc-button.mat-mdc-button-base.mat-primary-button{background-color:#00629b;color:#fff}.mat-mdc-button.mat-mdc-button-base.mat-primary-button:hover{background-color:#003e65}.mat-mdc-button.mat-mdc-button-base.mat-primary-button:active{background-color:#00629b}.mat-mdc-button.mat-mdc-button-base.mat-primary-button:disabled{background-color:#1c1b1f1f}.mat-mdc-button.mat-mdc-button-base.mat-secondary-button{color:#fff;background:#a7a8aa;box-shadow:0 1px 2px #0000004d,0 2px 6px 2px #00000026}.mat-mdc-button.mat-mdc-button-base.mat-secondary-button:hover{background:#a7a8aa}.mat-mdc-button.mat-mdc-button-base.mat-secondary-button:active{background:rgba(29,25,43,.12)}.mat-mdc-button.mat-mdc-button-base.mat-secondary-button:disabled{background:rgba(28,27,31,.12);color:#1c1b1f;opacity:.38}.ieeesa-text-button{color:#cac4d0;background:none;border:none}.flex-align-center{display:flex;align-items:center;justify-content:center}.mat-button-toggle-checked{background-color:#a7a8aa}.mat-button-toggle-checked .mat-button-toggle-label-content:before{font-family:\"Font Awesome 5 Free\";font-weight:900;content:\"\\f00c\";padding-right:.5625em}.mat-button-toggle-group .mat-button-toggle-label-content{font-family:Calibri Regular;font-style:normal;font-weight:700;font-size:1em;line-height:20px;color:#1c1b1f;letter-spacing:.00625em}@media (max-width: 768px){.mat-button-toggle-group .mat-button-toggle-label-content{max-width:8ch;text-overflow:ellipsis;white-space:nowrap;overflow:hidden;position:relative}}.cdk-overlay-pane{width:100%;min-width:312px}.ieeesa-search-field__search-icon{height:20px;width:20px}.ieeesa-search-field__content{display:flex;align-items:center}.ieeesa-search-field__label-left{display:flex}.ieeesa-search-field__label-top{display:block}.ieeesa-search-field .mat-mdc-form-field{height:50px;width:-webkit-fill-available;padding:0 5px}.ieeesa-search-field .mat-form-field-flex{display:flex;align-items:center;height:40px;margin-left:0}.ieeesa-search-field .mat-mdc-input-element{padding-left:5px}.ieeesa-search-field .mat-mdc-form-field-infix{padding-top:10px;padding-bottom:0}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i3.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i3.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i3.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "component", type: FormErrorComponent, selector: "ieeesa-form-error", inputs: ["formGroup", "config", "submitResponse"] }, { kind: "ngmodule", type: MatFormFieldModule }, { kind: "component", type: i4.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i4.MatLabel, selector: "mat-label" }, { kind: "ngmodule", type: MatInputModule }, { kind: "directive", type: i5.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl],      input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly"], exportAs: ["matInput"] }, { kind: "ngmodule", type: MatIconModule }], encapsulation: i0.ViewEncapsulation.None }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.3", ngImport: i0, type: SearchComponent, decorators: [{
             type: Component,
             args: [{ selector: 'ieeesa-search', standalone: true, imports: [
                         CommonModule,
                         ReactiveFormsModule,
-                        FormErrorComponent$1,
+                        FormErrorComponent,
                         MatFormFieldModule,
                         MatInputModule,
                         MatIconModule,
                     ], encapsulation: ViewEncapsulation.None, template: "<div\r\n  [formGroup]=\"group\"\r\n  class=\"ieeesa-search-field\"\r\n  *ngIf=\"group\"\r\n  [ngClass]=\"\r\n    config.isLabelAlignedLeft\r\n      ? 'ieeesa-search-field__label-left'\r\n      : 'ieeesa-search-field__label-top'\r\n  \"\r\n>\r\n  <mat-label class=\"ieeesa-body-sm-14 ieeesa-search-field__label\">{{\r\n    config.label\r\n  }}</mat-label>\r\n  <mat-form-field appearance=\"outline\">\r\n    <span class=\"ieeesa-search-field__content\">\r\n      <input\r\n        matInput\r\n        autocomplete=\"off\"\r\n        [type]=\"searchType\"\r\n        [formControlName]=\"config.controlName\"\r\n        [placeholder]=\"placeholderLabel\"\r\n        (change)=\"onChange()\"\r\n        (input)=\"onSearchInputChange()\"\r\n        bindon-ngModel=\"searchTerm\"\r\n        #searchControl\r\n      />\r\n      <i\r\n        class=\"fa-solid fa-magnifying-glass ieeesa-search-field__search-icon\"\r\n      ></i>\r\n    </span>\r\n  </mat-form-field>\r\n  <ieeesa-form-error [formGroup]=\"group\" [config]=\"config\"> </ieeesa-form-error>\r\n</div>\r\n", styles: [".ieeesa-subtitle{text-align:left;font-family:Calibri Regular;font-size:1.56em;letter-spacing:0;color:#000;opacity:1}.ieeesa-body{text-align:left;font-family:Calibri Regular;font-size:1.25em;letter-spacing:0;color:#000;opacity:1}.ieeesa-display-lg-57{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:3.5625em;line-height:64px;color:#000;letter-spacing:0}.ieeesa-display-md-47{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:2.9375em;line-height:52px;color:#000;letter-spacing:0}.ieeesa-display-sm-38{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:2.375em;line-height:44px;color:#000;letter-spacing:0}.ieeesa-headline-lg-34{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:2.125em;line-height:40px;color:#000;letter-spacing:0}.ieeesa-headline-md-30{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1.875em;line-height:36px;color:#000;letter-spacing:0}.ieeesa-headline-sm-26{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1.625em;line-height:32px;color:#000;letter-spacing:0}.ieeesa-title-lg-bold-24{font-family:Calibri Regular;font-style:normal;font-weight:700;font-size:1.5em;line-height:28px;color:#000;letter-spacing:0}.ieeesa-title-lg-24{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1.5em;line-height:28px;color:#000;letter-spacing:0}.ieeesa-title-md-18{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1.125em;line-height:24px;color:#000;letter-spacing:.009375em}.ieeesa-title-sm-16{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1em;line-height:20px;color:#000;letter-spacing:.00625em}.ieeesa-label-lg-bold-16{font-family:Calibri Regular;font-style:normal;font-weight:700;font-size:1em;line-height:20px;color:#000;letter-spacing:.00625em}.ieeesa-label-lg-16{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1em;line-height:20px;color:#000;letter-spacing:.00625em}.ieeesa-label-md-14{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:.875em;line-height:16px;color:#000;letter-spacing:.03125em}.ieeesa-label-sm-13{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:.8125em;line-height:16px;color:#000;letter-spacing:.03125em}.ieeesa-body-lg-bold-18{font-family:Calibri Regular;font-style:normal;font-weight:700;font-size:1.125em;line-height:24px;color:#000;letter-spacing:.03125em}.ieeesa-body-lg-18{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1.125em;line-height:24px;color:#000;letter-spacing:.03125em}.ieeesa-body-md-16{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1em;line-height:20px;color:#000;letter-spacing:.015625em}.ieeesa-body-sm-14{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:.875em;line-height:16px;color:#000;letter-spacing:.025em}.ieeesa-title-inter-lg-bold-24{font-family:Inter Bold;font-style:normal;font-weight:700;font-size:1.5em;line-height:29px;color:#000;letter-spacing:0}.mat-mdc-button.mat-mdc-button-base.mat-primary-button,.mat-mdc-button.mat-mdc-button-base.mat-secondary-button{min-width:103px;width:auto;min-height:40px;height:auto;border-radius:3px;text-align:center;padding:.625em 1.5em;border:none;font-family:Calibri Regular;font-style:normal;font-weight:700;font-size:1em;line-height:20px;color:#000;letter-spacing:.00625em}.mat-mdc-button.mat-mdc-button-base>.mat-icon{margin-right:11px}.mat-mdc-button.mat-mdc-button-base.mat-primary-button{background-color:#00629b;color:#fff}.mat-mdc-button.mat-mdc-button-base.mat-primary-button:hover{background-color:#003e65}.mat-mdc-button.mat-mdc-button-base.mat-primary-button:active{background-color:#00629b}.mat-mdc-button.mat-mdc-button-base.mat-primary-button:disabled{background-color:#1c1b1f1f}.mat-mdc-button.mat-mdc-button-base.mat-secondary-button{color:#fff;background:#a7a8aa;box-shadow:0 1px 2px #0000004d,0 2px 6px 2px #00000026}.mat-mdc-button.mat-mdc-button-base.mat-secondary-button:hover{background:#a7a8aa}.mat-mdc-button.mat-mdc-button-base.mat-secondary-button:active{background:rgba(29,25,43,.12)}.mat-mdc-button.mat-mdc-button-base.mat-secondary-button:disabled{background:rgba(28,27,31,.12);color:#1c1b1f;opacity:.38}.ieeesa-text-button{color:#cac4d0;background:none;border:none}.flex-align-center{display:flex;align-items:center;justify-content:center}.mat-button-toggle-checked{background-color:#a7a8aa}.mat-button-toggle-checked .mat-button-toggle-label-content:before{font-family:\"Font Awesome 5 Free\";font-weight:900;content:\"\\f00c\";padding-right:.5625em}.mat-button-toggle-group .mat-button-toggle-label-content{font-family:Calibri Regular;font-style:normal;font-weight:700;font-size:1em;line-height:20px;color:#1c1b1f;letter-spacing:.00625em}@media (max-width: 768px){.mat-button-toggle-group .mat-button-toggle-label-content{max-width:8ch;text-overflow:ellipsis;white-space:nowrap;overflow:hidden;position:relative}}.cdk-overlay-pane{width:100%;min-width:312px}.ieeesa-search-field__search-icon{height:20px;width:20px}.ieeesa-search-field__content{display:flex;align-items:center}.ieeesa-search-field__label-left{display:flex}.ieeesa-search-field__label-top{display:block}.ieeesa-search-field .mat-mdc-form-field{height:50px;width:-webkit-fill-available;padding:0 5px}.ieeesa-search-field .mat-form-field-flex{display:flex;align-items:center;height:40px;margin-left:0}.ieeesa-search-field .mat-mdc-input-element{padding-left:5px}.ieeesa-search-field .mat-mdc-form-field-infix{padding-top:10px;padding-bottom:0}\n"] }]
-        }], ctorParameters: function () { return [{ type: i1.FormUtilityService }]; }, propDecorators: { formControlName: [{
+        }], ctorParameters: function () { return [{ type: FormUtilityService }]; }, propDecorators: { formControlName: [{
                 type: Input
             }], placeholderLabel: [{
                 type: Input
@@ -1097,790 +1210,792 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.3", ngImpor
                 args: ['searchControl']
             }] } });
 
-const moment$1 = moment_;
-class CustomDateAdapter extends MomentDateAdapter {
-    /**
-     * Overrides the getDayOfWeekNames method of MomentDateAdapter to show first letter of day in capital in date picker header.
-     * @return {string[]}
-     * @memberof CustomDateAdapter
-     */
-    getDayOfWeekNames() {
-        return ['S', 'M', 'T', 'W', 'T', 'F', 'S'];
-    }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.3", ngImport: i0, type: CustomDateAdapter, deps: null, target: i0.ɵɵFactoryTarget.Injectable }); }
-    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "16.1.3", ngImport: i0, type: CustomDateAdapter }); }
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.3", ngImport: i0, type: CustomDateAdapter, decorators: [{
-            type: Injectable
-        }] });
 /**
- * Date selection of type SINGLE_DATE_SELECTION, DATE_RANGE_SELECTION and CALENDAR and handling of calendar events.
+ * Component implementation supports select type of form filed and select type is configurable to support single selection or multi-selection with multilevel or single level.
  * @export
- * @class DatePickerComponent
- * @implements {FormField}
+ * @class SelectComponent
  * @implements {OnInit}
  * @implements {AfterViewInit}
+ * @implements {OnDestroy}
  */
-class DatePickerComponent {
+class SelectComponent {
     /**
-     * Gets preselected dates as an input.
-     * @memberof DatePickerComponent
+     * Takes isSortNeeded as input to check if the passed options are sorted or not.
+     * @memberof SelectComponent
      */
-    set selectedDates(value) {
-        this._selectedDates = value;
-        if (this.formControlName &&
-            this.selectedDates?.length === 1 &&
-            this.selectedDates[0] !== undefined &&
-            this.calendarType === CalendarType$1.SINGLE_DATE_SELECTION) {
-            this.datepickerService.selectedDate = value[0];
-            this.createFormGroup(value[0]);
-            this.datepickerService.isRangeSelection = false;
-        }
+    set isSortNeeded(value) {
+        this._isSortNeeded = value;
+    }
+    get isSortNeeded() {
+        return this._isSortNeeded;
     }
     /**
-     * Returns selected dates
-     * @readonly
-     * @type {string[]}
-     * @memberof DatePickerComponent
+     * Sets the dropdown options for selection.
+     * @memberof SelectComponent
      */
-    get selectedDates() {
-        return this._selectedDates;
+    set dropdownOptions(value) {
+        this._dropdownOptions = value;
+    }
+    get dropdownOptions() {
+        return this._dropdownOptions;
     }
     /**
-     * Gets preselected date range as an input.
-     * @memberof DatePickerComponent
+     * Sets the selected option
+     * @memberof SelectComponent
      */
-    set selectedRange(value) {
-        this._selectedRange = value;
-        if (this.selectedRange?.length === 2 &&
-            this.calendarType === CalendarType$1.DATE_RANGE_SELECTION) {
-            this.createFormGroupWithRangeControls(value[0], value[1]);
-            this.setDateRange(value[0], value[1]);
-            this.datepickerService.isRangeSelection = true;
+    set selectedOptions(value) {
+        if (Array.isArray(value)) {
+            this._selectedOptions = this.arraySorting(value);
+        }
+        else {
+            this._selectedOptions = value;
         }
     }
-    /**
-     * Returns selected date range
-     * @readonly
-     * @type {string[]}
-     * @memberof DatePickerComponent
-     */
-    get selectedRange() {
-        return this._selectedRange;
+    get selectedOptions() {
+        return this._selectedOptions;
     }
     constructor(
     // eslint-disable-next-line no-unused-vars
-    fb, 
-    // eslint-disable-next-line no-unused-vars
-    changeDetectorRef, 
-    // eslint-disable-next-line no-unused-vars
-    datepickerService, 
-    // eslint-disable-next-line no-unused-vars
-    formUtilityService // eslint-disable-next-line no-empty-function,
+    formUtilityService // eslint-disable-next-line no-empty-function
     ) {
-        this.fb = fb;
-        this.changeDetectorRef = changeDetectorRef;
-        this.datepickerService = datepickerService;
         this.formUtilityService = formUtilityService;
-        this.datePickerHeader = DatePickerHeaderComponent$1;
-        this.calendarTypes = CalendarType$1;
-        this._selectedDates = [];
-        this._selectedRange = [];
-        this.calendarType = CalendarType$1.SINGLE_DATE_SELECTION;
-        this.placeholderLabel = '';
-        this.isDisabled = false;
-        this.isLabelAlignedLeft = false;
-        this.datepickerLabel = '';
-        this.selectedDate = new EventEmitter();
-        this.selectedDateRange = new EventEmitter();
+        this.arrowDirection = false;
+        this.searchType = SearchType.AUTO;
         // eslint-disable-next-line @typescript-eslint/no-explicit-any
-        this.buttonActionsInfo = buttonActionsInfo;
+        this.dropdownInfo = constantsInfo;
+        this._isSortNeeded = true;
+        this.formControlName = 'select';
+        this.isMultiLevel = false;
+        this.isLabelAlignedLeft = false;
+        this.selectLabel = '';
+        this.isMultiSelect = false;
+        this.isDisabled = false;
+        this.isSearch = false;
+        this.placeholderText = this.dropdownInfo.dropdown.placeholderText;
+        this.optionSelected = new EventEmitter();
+        this.optionSearched = new EventEmitter();
     }
     /**
-     * Implementation of  ngOnInit lifecycle hook method to creates config if its undefined and sets components instance variables if config is defined. Sets the form group value if form group is defined.
-     * @memberof DatePickerComponent
+     * Initializes components instance properties from config if its defined otherwise creates form group and config.
+     * @memberof SelectComponent
      */
     ngOnInit() {
-        if (!this.config) {
-            const controlName = this.formControlName ?? 'datepicker';
-            this.config = this.formUtilityService.getFormFieldConfig(controlName, FormControlType$1.DATE);
-            if (this.config &&
-                this.calendarType === CalendarType$1.DATE_RANGE_SELECTION) {
-                this.config.dateRangeControls = {
-                    startDate: 'startDate',
-                    endDate: 'endDate',
-                };
-            }
-        }
-        else {
-            this.initializePropertiesFromConfig();
-        }
-        if (!this.group) {
-            if (this.calendarType === CalendarType$1.SINGLE_DATE_SELECTION) {
-                this.createFormGroup();
-            }
-            else if (this.calendarType === CalendarType$1.DATE_RANGE_SELECTION) {
-                this.createFormGroupWithRangeControls();
-            }
+        this.updateArrowDirection(false);
+        this.group =
+            this.group ?? this.formUtilityService.getFormGroup(this.formControlName);
+        this.config =
+            this.config ??
+                this.formUtilityService.getFormFieldConfig(this.formControlName, FormControlType.SELECT);
+        if (this.config) {
+            this.isMultiSelect = this.config.isMultiSelect ?? false;
+            this.dropdownOptions =
+                this.config?.dropdownOptions ?? this.dropdownOptions;
+            this.selectedOptions = this.config?.value;
+            this.selectLabel = this.config?.label ?? '';
+            this.placeholderText = this.config?.placeholder ?? this.placeholderText;
+            this.isMultiSelect = this.config?.isMultiSelect ?? this.isMultiSelect;
+            this.isDisabled = this.config?.disabled ?? this.isDisabled;
+            this.searchType = this.config?.searchType ?? this.searchType;
+            this.isSortNeeded = this.config?.isSortNeeded ?? this.isSortNeeded;
         }
     }
     /**
-     * Initializes properties from the config input
-     * @memberof DatePickerComponent
+     * Emits selected option on changes the selected option.
+     * @param {SelectOption} event
+     * @memberof SelectComponent
      */
-    initializePropertiesFromConfig() {
-        this.calendarType =
-            this.config?.datePicker?.calendarType ??
-                CalendarType$1.SINGLE_DATE_SELECTION;
-        this.placeholderLabel = this.config?.datePicker?.placeholderLabel ?? '';
-        this.datepickerLabel = this.config?.datePicker?.label ?? '';
-        this.isLabelAlignedLeft =
-            this.config?.datePicker?.isLabelAlignedLeft ?? false;
-        this.dateRange = this.config?.datePicker?.dateRange ?? {
-            minDate: '',
-            maxDate: '',
-        };
-        this.isDisabled = !!this.config.disabled;
-        if (this.config.datePicker?.calendarType === CalendarType$1.DATE_RANGE_SELECTION) {
-            this.group.addControl('startDate', new FormControl());
-            this.group.addControl('endDate', new FormControl());
-        }
+    onChange(event) {
+        this.optionSelected.emit(event);
     }
     /**
-     * Handle date change event and emits the selected date.
-     * @memberof DatePickerComponent
+     * Sets the select dropdown arrow direction
+     * @param {boolean} opened
+     * @memberof SelectComponent
      */
-    onDateChange() {
-        this.selectedDate.emit(this.group?.get(this.config.controlName)?.value);
-        this.datepickerService.selectedDate = this.group?.get(this.config.controlName)?.value;
-        this.datepickerService.isRangeSelection = false;
+    updateArrowDirection(opened) {
+        this.arrowDirection = opened;
     }
     /**
-     * Sets and emits selected date range
-     * @memberof DatePickerComponent
+     * Takes the index and the current option as arguments and needs to return the unique identifier for this option.
+     * @param {number} index
+     * @param {SelectOption} option
+     * @return {(number | string)}
+     * @memberof SelectComponent
      */
-    onDateRangeChange() {
-        this.datepickerService.isRangeSelection = true;
-        this.setDateRange(this.group.value.startDate ?? '', this.group.value.endDate ?? '');
-        this.selectedDateRange.emit({
-            startDate: this.group.value.startDate ?? '',
-            endDate: this.group.value.endDate ?? '',
-        });
+    trackByFn(index, option) {
+        return option.id;
     }
     /**
-     * Sets the min and max date range.
-     * @param {(string | Date)} startDate
-     * @param {(string | Date)} endDate
-     * @memberof DatePickerComponent
+     * Emits searched options on filtering options in select dropdown
+     * @param {string} searchText
+     * @memberof SelectComponent
      */
-    setDateRange(startDate, endDate) {
-        this.datepickerService.range.next({
-            start: startDate,
-            end: endDate,
-        });
+    onOptionSearch(searchText) {
+        this.optionSearched.emit(searchText);
     }
     /**
-     * Creates form group and initializes form value
-     * @param {string} [date]
-     * @memberof DatePickerComponent
+     * Compares the two passed options
+     * @param {any} option1
+     * @param {any} option2
+     * @return {boolean}
+     * @memberof SelectComponent
      */
-    createFormGroup(date) {
-        this.group = this.fb.group({
-            [this.formControlName ? this.formControlName : 'datepicker']: date
-                ? [moment$1(date).utc(true).format()]
-                : [],
-        });
+    // eslint-disable-next-line @typescript-eslint/no-explicit-any
+    comparer(option1, option2) {
+        return option1 && option2 ? option1.id === option2.id : option1 === option2;
     }
     /**
-     * Creates form group with range type of controls and sets the min and max range values.
-     * @param {string} [startDate]
-     * @param {string} [endDate]
-     * @memberof DatePickerComponent
+     * Sorts the options
+     * @memberof SelectComponent
      */
-    createFormGroupWithRangeControls(startDate, endDate) {
-        this.group = this.fb.group({
-            startDate: startDate ? [moment$1(startDate).utc(true).format()] : [],
-            endDate: endDate ? [moment$1(endDate).utc(true).format()] : [],
-        });
+    ngAfterViewInit() {
+        if (this.isSortNeeded && Array.isArray(this.dropdownOptions)) {
+            this.dropdownOptions = this.arraySorting(this.dropdownOptions);
+        }
     }
     /**
-     * Checks if the form control has required validator.
-     * @return {boolean}
-     * @memberof DatePickerComponent
+     * Sorts the options by using arraySorting method
+     * @memberof SelectComponent
      */
-    isRequired() {
-        return this.group?.controls[this.config?.controlName]?.hasValidator(Validators.required);
+    sortOptions() {
+        if (this.isSortNeeded && Array.isArray(this.dropdownOptions)) {
+            this.sortedOptions = this.arraySorting(this.dropdownOptions);
+        }
+        else {
+            this.sortedOptions = this.dropdownOptions;
+        }
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.3", ngImport: i0, type: DatePickerComponent, deps: [{ token: i3.FormBuilder }, { token: i0.ChangeDetectorRef }, { token: i2$2.DatepickerService }, { token: i1.FormUtilityService }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.3", type: DatePickerComponent, isStandalone: true, selector: "ieeesa-date-picker", inputs: { selectedDates: "selectedDates", selectedRange: "selectedRange", calendarType: "calendarType", formControlName: "formControlName", placeholderLabel: "placeholderLabel", isDisabled: "isDisabled", isLabelAlignedLeft: "isLabelAlignedLeft", datepickerLabel: "datepickerLabel", dateRange: "dateRange" }, outputs: { selectedDate: "selectedDate", selectedDateRange: "selectedDateRange" }, providers: [
-            { provide: MAT_MOMENT_DATE_ADAPTER_OPTIONS, useValue: { useUtc: true } },
-            {
-                provide: DateAdapter,
-                useClass: CustomDateAdapter,
-                deps: [MAT_DATE_LOCALE, MAT_MOMENT_DATE_ADAPTER_OPTIONS],
-            },
+    /**
+     * Utility method to sort dropdown options in ascending order.
+     * @param {SelectOption[]} list
+     * @return {SelectOption[]}
+     * @memberof SelectComponent
+     */
+    arraySorting(list) {
+        const clonedValue = [...list];
+        const sort = clonedValue.sort((a, b) => {
+            if (a.name.toLowerCase() === b.name.toLowerCase())
+                return 0;
+            if (a.name.toLowerCase() === 'all')
+                return -1;
+            if (b.name.toLowerCase() === 'all')
+                return 1;
+            if (a.name.toLowerCase() < b.name.toLowerCase())
+                return -1;
+            if (a.name.toLowerCase() > b.name.toLowerCase())
+                return 1;
+            return 0;
+        });
+        return sort;
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.3", ngImport: i0, type: SelectComponent, deps: [{ token: FormUtilityService }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.3", type: SelectComponent, isStandalone: true, selector: "ieeesa-select", inputs: { isSortNeeded: "isSortNeeded", dropdownOptions: "dropdownOptions", selectedOptions: "selectedOptions", formControlName: "formControlName", isMultiLevel: "isMultiLevel", isLabelAlignedLeft: "isLabelAlignedLeft", selectLabel: "selectLabel", isMultiSelect: "isMultiSelect", isDisabled: "isDisabled", isSearch: "isSearch", placeholderText: "placeholderText" }, outputs: { optionSelected: "optionSelected", optionSearched: "optionSearched" }, providers: [
             {
-                provide: MAT_DATE_FORMATS,
-                useValue: DateFormats,
+                provide: MAT_SELECT_CONFIG,
+                useValue: { overlayPanelClass: 'ieeesa-select-overlay-pane' },
             },
-        ], ngImport: i0, template: "<div class=\"ieeesa-datepicker\">\r\n  <div\r\n    [formGroup]=\"group\"\r\n    *ngIf=\"calendarType === calendarTypes.SINGLE_DATE_SELECTION\"\r\n    class=\"ieeesa-datepicker--single-selection\"\r\n    [ngClass]=\"!isRequired() ? 'ieeesa-datepicker__valid-date' : ''\"\r\n    [ngClass]=\"{\r\n      'ieeesa-datepicker__valid-date': !isRequired(),\r\n      'ieeesa-datepicker__label-left': isLabelAlignedLeft,\r\n      'ieeesa-datepicker__label-top': !isLabelAlignedLeft\r\n    }\"\r\n  >\r\n    <mat-label *ngIf=\"datepickerLabel\">{{ datepickerLabel }} </mat-label>\r\n    <mat-form-field>\r\n      <input\r\n        matInput\r\n        (dateInput)=\"onDateChange()\"\r\n        (click)=\"picker.open()\"\r\n        [matDatepicker]=\"picker\"\r\n        [formControlName]=\"config.controlName\"\r\n        [placeholder]=\"buttonActionsInfo?.datePicker?.dateFormatLabel\"\r\n        #calendar\r\n        readonly\r\n      />\r\n      <mat-datepicker-toggle\r\n        class=\"mat-datepicker-toggle\"\r\n        matIconSuffix\r\n        [for]=\"picker\"\r\n      ></mat-datepicker-toggle>\r\n      <mat-datepicker #picker [calendarHeaderComponent]=\"datePickerHeader\">\r\n        <mat-datepicker-actions>\r\n          <button\r\n            mat-button\r\n            class=\"mat-text-button ieeesa-datepicker__date-picker-button\"\r\n            type=\"button\"\r\n            matDatepickerCancel\r\n          >\r\n            {{ buttonActionsInfo?.button?.cancel }}\r\n          </button>\r\n          <button\r\n            mat-button\r\n            class=\"mat-text-button ieeesa-datepicker__date-picker-button\"\r\n            color=\"primary\"\r\n            type=\"button\"\r\n            matDatepickerApply\r\n          >\r\n            {{ buttonActionsInfo?.button?.ok }}\r\n          </button>\r\n        </mat-datepicker-actions>\r\n      </mat-datepicker>\r\n    </mat-form-field>\r\n    <ieeesa-form-error [formGroup]=\"group\" [config]=\"config\">\r\n    </ieeesa-form-error>\r\n  </div>\r\n\r\n  <div\r\n    [formGroup]=\"group\"\r\n    *ngIf=\"calendarType === calendarTypes.DATE_RANGE_SELECTION\"\r\n    class=\"ieeesa-datepicker--multi-selection\"\r\n    [ngClass]=\"\r\n      isLabelAlignedLeft\r\n        ? 'ieeesa-datepicker__label-left'\r\n        : 'ieeesa-datepicker__label-top'\r\n    \"\r\n  >\r\n    <mat-label *ngIf=\"datepickerLabel\">{{ datepickerLabel }} </mat-label>\r\n    <mat-form-field>\r\n      <mat-date-range-input [rangePicker]=\"rangePicker\" [formGroup]=\"group\">\r\n        <input\r\n          matStartDate\r\n          matInput\r\n          [formControlName]=\"config.dateRangeControls?.startDate ?? ''\"\r\n          [placeholder]=\"buttonActionsInfo?.datePicker?.dateFormatLabel + ' - '\"\r\n          (dateChange)=\"onDateRangeChange()\"\r\n        />\r\n        <input\r\n          matEndDate\r\n          matInput\r\n          [formControlName]=\"config.dateRangeControls?.endDate ?? ''\"\r\n          [placeholder]=\"buttonActionsInfo?.datePicker?.dateFormatLabel\"\r\n          (dateChange)=\"onDateRangeChange()\"\r\n        />\r\n      </mat-date-range-input>\r\n      <mat-datepicker-toggle\r\n        class=\"mat-datepicker-toggle\"\r\n        matIconSuffix\r\n        [for]=\"rangePicker\"\r\n      ></mat-datepicker-toggle>\r\n      <mat-date-range-picker\r\n        #rangePicker\r\n        [calendarHeaderComponent]=\"datePickerHeader\"\r\n        (dateInput)=\"onDateRangeChange()\"\r\n      >\r\n        <mat-date-range-picker-actions>\r\n          <button\r\n            mat-button\r\n            class=\"mat-text-button ieeesa-datepicker__date-picker-button\"\r\n            matDateRangePickerCancel\r\n            type=\"button\"\r\n          >\r\n            {{ buttonActionsInfo?.button?.cancel }}\r\n          </button>\r\n          <button\r\n            mat-button\r\n            class=\"mat-text-button ieeesa-datepicker__date-picker-button\"\r\n            color=\"primary\"\r\n            matDateRangePickerApply\r\n            (click)=\"onDateRangeChange()\"\r\n            type=\"button\"\r\n          >\r\n            {{ buttonActionsInfo?.button?.ok }}\r\n          </button>\r\n        </mat-date-range-picker-actions>\r\n      </mat-date-range-picker>\r\n    </mat-form-field>\r\n  </div>\r\n\r\n  <div\r\n    *ngIf=\"calendarType === calendarTypes.CALENDAR\"\r\n    class=\"ieeesa-datepicker--calendar\"\r\n  >\r\n    <mat-calendar\r\n      [headerComponent]=\"datePickerHeader\"\r\n      [(selected)]=\"calendarSelectedDate\"\r\n    >\r\n    </mat-calendar>\r\n  </div>\r\n</div>\r\n", styles: [".ieeesa-subtitle{text-align:left;font-family:Calibri Regular;font-size:1.56em;letter-spacing:0;color:#000;opacity:1}.ieeesa-body{text-align:left;font-family:Calibri Regular;font-size:1.25em;letter-spacing:0;color:#000;opacity:1}.ieeesa-display-lg-57{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:3.5625em;line-height:64px;color:#000;letter-spacing:0}.ieeesa-display-md-47{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:2.9375em;line-height:52px;color:#000;letter-spacing:0}.ieeesa-display-sm-38{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:2.375em;line-height:44px;color:#000;letter-spacing:0}.ieeesa-headline-lg-34{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:2.125em;line-height:40px;color:#000;letter-spacing:0}.ieeesa-headline-md-30{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1.875em;line-height:36px;color:#000;letter-spacing:0}.ieeesa-headline-sm-26{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1.625em;line-height:32px;color:#000;letter-spacing:0}.ieeesa-title-lg-bold-24{font-family:Calibri Regular;font-style:normal;font-weight:700;font-size:1.5em;line-height:28px;color:#000;letter-spacing:0}.ieeesa-title-lg-24{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1.5em;line-height:28px;color:#000;letter-spacing:0}.ieeesa-title-md-18{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1.125em;line-height:24px;color:#000;letter-spacing:.009375em}.ieeesa-title-sm-16{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1em;line-height:20px;color:#000;letter-spacing:.00625em}.ieeesa-label-lg-bold-16{font-family:Calibri Regular;font-style:normal;font-weight:700;font-size:1em;line-height:20px;color:#000;letter-spacing:.00625em}.ieeesa-label-lg-16{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1em;line-height:20px;color:#000;letter-spacing:.00625em}.ieeesa-label-md-14{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:.875em;line-height:16px;color:#000;letter-spacing:.03125em}.ieeesa-label-sm-13{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:.8125em;line-height:16px;color:#000;letter-spacing:.03125em}.ieeesa-body-lg-bold-18{font-family:Calibri Regular;font-style:normal;font-weight:700;font-size:1.125em;line-height:24px;color:#000;letter-spacing:.03125em}.ieeesa-body-lg-18{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1.125em;line-height:24px;color:#000;letter-spacing:.03125em}.ieeesa-body-md-16{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1em;line-height:20px;color:#000;letter-spacing:.015625em}.ieeesa-body-sm-14{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:.875em;line-height:16px;color:#000;letter-spacing:.025em}.ieeesa-title-inter-lg-bold-24{font-family:Inter Bold;font-style:normal;font-weight:700;font-size:1.5em;line-height:29px;color:#000;letter-spacing:0}.mat-mdc-button.mat-mdc-button-base.mat-primary-button,.mat-mdc-button.mat-mdc-button-base.mat-secondary-button{min-width:103px;width:auto;min-height:40px;height:auto;border-radius:3px;text-align:center;padding:.625em 1.5em;border:none;font-family:Calibri Regular;font-style:normal;font-weight:700;font-size:1em;line-height:20px;color:#000;letter-spacing:.00625em}.mat-mdc-button.mat-mdc-button-base>.mat-icon{margin-right:11px}.mat-mdc-button.mat-mdc-button-base.mat-primary-button{background-color:#00629b;color:#fff}.mat-mdc-button.mat-mdc-button-base.mat-primary-button:hover{background-color:#003e65}.mat-mdc-button.mat-mdc-button-base.mat-primary-button:active{background-color:#00629b}.mat-mdc-button.mat-mdc-button-base.mat-primary-button:disabled{background-color:#1c1b1f1f}.mat-mdc-button.mat-mdc-button-base.mat-secondary-button{color:#fff;background:#a7a8aa;box-shadow:0 1px 2px #0000004d,0 2px 6px 2px #00000026}.mat-mdc-button.mat-mdc-button-base.mat-secondary-button:hover{background:#a7a8aa}.mat-mdc-button.mat-mdc-button-base.mat-secondary-button:active{background:rgba(29,25,43,.12)}.mat-mdc-button.mat-mdc-button-base.mat-secondary-button:disabled{background:rgba(28,27,31,.12);color:#1c1b1f;opacity:.38}.ieeesa-text-button{color:#cac4d0;background:none;border:none}.flex-align-center{display:flex;align-items:center;justify-content:center}.mat-button-toggle-checked{background-color:#a7a8aa}.mat-button-toggle-checked .mat-button-toggle-label-content:before{font-family:\"Font Awesome 5 Free\";font-weight:900;content:\"\\f00c\";padding-right:.5625em}.mat-button-toggle-group .mat-button-toggle-label-content{font-family:Calibri Regular;font-style:normal;font-weight:700;font-size:1em;line-height:20px;color:#1c1b1f;letter-spacing:.00625em}@media (max-width: 768px){.mat-button-toggle-group .mat-button-toggle-label-content{max-width:8ch;text-overflow:ellipsis;white-space:nowrap;overflow:hidden;position:relative}}.cdk-overlay-pane{width:100%;min-width:312px}.ieeesa-datepicker{min-width:360px;width:auto}.ieeesa-datepicker__label-left{display:flex}.ieeesa-datepicker__label-top{display:block}.ieeesa-datepicker__date-picker-button{background:linear-gradient(0deg,rgba(0,98,155,.11),rgba(0,98,155,.11)),#fffbfe}.ieeesa-datepicker--calendar{background:linear-gradient(0deg,rgba(0,98,155,.11),rgba(0,98,155,.11)),#fffbfe;border-radius:16px}.ieeesa-datepicker--calendar .mat-calendar-body-cell-container{margin:0;padding-top:24px 0}.ieeesa-datepicker--calendar .mat-calendar-table-header th,.ieeesa-datepicker--calendar .mat-calendar-body td{height:24px!important;padding-top:24px!important;width:24px!important;padding-bottom:24px!important}.ieeesa-datepicker--calendar .mat-calendar-body-selected{background-color:#00b5e2;color:#fff;border:none;box-shadow:none}.ieeesa-datepicker--calendar .mat-calendar-body-cell:not(.mat-calendar-body-disabled):hover>.mat-calendar-body-cell-content:not(.mat-calendar-body-selected):not(.mat-calendar-body-comparison-identical){background-color:#00b5e2;color:#fff;border:none;box-shadow:none}.ieeesa-datepicker--calendar .mat-calendar-content{padding:0 8px 35px}.ieeesa-datepicker .mat-mdc-form-field{width:-webkit-fill-available}.ieeesa-datepicker .mat-mdc-text-field-wrapper.mdc-text-field.mdc-text-field--outlined.mdc-text-field--no-label,.ieeesa-datepicker .mdc-text-field--filled:not(.mdc-text-field--disabled){border:2px solid #00b5e2;border-radius:4px;height:56px;align-items:center;background-color:#f0f5f9}.ieeesa-datepicker .mdc-text-field--filled:not(.mdc-text-field--disabled) .mdc-line-ripple:before{border:none}.ieeesa-datepicker .mat-mdc-text-field-wrapper.mdc-text-field--outlined .mdc-text-field__input,.ieeesa-datepicker .mdc-text-field--no-label:not(.mdc-text-field--textarea) .mat-mdc-form-field-input-control.mdc-text-field__input{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1em;line-height:24px;color:#1c1b1f;letter-spacing:.03125em}.ieeesa-datepicker .mat-mdc-text-field-wrapper.mdc-text-field--outlined .mdc-text-field__input::placeholder,.ieeesa-datepicker .mdc-text-field--no-label:not(.mdc-text-field--textarea) .mat-mdc-form-field-input-control.mdc-text-field__input::placeholder{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1.125em;line-height:24px;color:#49454f;letter-spacing:.03125em}.ieeesa-datepicker .mat-mdc-form-field-hint{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1em;line-height:16px;color:#49454f;letter-spacing:.025em}.ieeesa-datepicker .mat-datepicker-toggle-default-icon{width:18px;height:20px}.mat-datepicker-popup .mat-datepicker-content-container{background:linear-gradient(0deg,rgba(0,98,155,.11),rgba(0,98,155,.11)),#fffbfe;border-radius:28px}.mat-datepicker-popup .mat-datepicker-content-container .mat-calendar-body-cell-content{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1.125em;line-height:24px;color:#1c1b1f;letter-spacing:.03125em}.mat-datepicker-popup .mat-datepicker-content-container .mat-calendar-body-selected{background-color:#00b5e2;color:#fff;border:none;box-shadow:none}.mat-datepicker-popup .mat-datepicker-content-container .mat-calendar-body-in-range:before{background-color:#a7a8aa;color:#49454f}.mat-datepicker-popup .mat-datepicker-content{border-radius:28px}.mat-datepicker-popup .mat-calendar-table-header{position:relative;top:25px}.mat-datepicker-popup .mat-calendar-table-header th,.mat-datepicker-popup .mat-calendar-body td{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1.125em;line-height:24px;color:#000;letter-spacing:.03125em}.mat-datepicker-popup .mat-calendar-table-header-divider,.mat-datepicker-popup .mat-calendar-body tr:first-child td:only-child{display:none}.mat-datepicker-popup .mat-calendar-body tr:first-child td:first-child:not(:only-child){visibility:hidden}.mat-datepicker-popup .mat-calendar-body{position:relative;top:20px}.mat-datepicker-popup .mat-mdc-menu-panel{min-width:360px;width:auto}.mat-datepicker-popup .mat-calendar-body-today{border-color:#00b5e2;color:#00b5e2}.mat-datepicker-popup .mat-datepicker-actions{padding:15px 10px 10px}.mat-datepicker-popup .mat-datepicker-toggle{color:#49454f}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i3.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i3.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i3.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "component", type: FormErrorComponent$1, selector: "ieeesa-form-error", inputs: ["formGroup", "config", "submitResponse"] }, { kind: "ngmodule", type: MatExpansionModule }, { kind: "ngmodule", type: MatMenuModule }, { kind: "ngmodule", type: MatIconModule }, { kind: "ngmodule", type: MatInputModule }, { kind: "directive", type: i5.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl],      input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly"], exportAs: ["matInput"] }, { kind: "component", type: i4.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i4.MatLabel, selector: "mat-label" }, { kind: "directive", type: i4.MatSuffix, selector: "[matSuffix], [matIconSuffix], [matTextSuffix]", inputs: ["matTextSuffix"] }, { kind: "ngmodule", type: MatFormFieldModule }, { kind: "ngmodule", type: MatDatepickerModule }, { kind: "component", type: i7.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: "component", type: i7.MatDatepicker, selector: "mat-datepicker", exportAs: ["matDatepicker"] }, { kind: "directive", type: i7.MatDatepickerInput, selector: "input[matDatepicker]", inputs: ["matDatepicker", "min", "max", "matDatepickerFilter"], exportAs: ["matDatepickerInput"] }, { kind: "component", type: i7.MatDatepickerToggle, selector: "mat-datepicker-toggle", inputs: ["for", "tabIndex", "aria-label", "disabled", "disableRipple"], exportAs: ["matDatepickerToggle"] }, { kind: "component", type: i7.MatDateRangeInput, selector: "mat-date-range-input", inputs: ["rangePicker", "required", "dateFilter", "min", "max", "disabled", "separator", "comparisonStart", "comparisonEnd"], exportAs: ["matDateRangeInput"] }, { kind: "directive", type: i7.MatStartDate, selector: "input[matStartDate]", inputs: ["errorStateMatcher"], outputs: ["dateChange", "dateInput"] }, { kind: "directive", type: i7.MatEndDate, selector: "input[matEndDate]", inputs: ["errorStateMatcher"], outputs: ["dateChange", "dateInput"] }, { kind: "component", type: i7.MatDateRangePicker, selector: "mat-date-range-picker", exportAs: ["matDateRangePicker"] }, { kind: "component", type: i7.MatDatepickerActions, selector: "mat-datepicker-actions, mat-date-range-picker-actions" }, { kind: "directive", type: i7.MatDatepickerCancel, selector: "[matDatepickerCancel], [matDateRangePickerCancel]" }, { kind: "directive", type: i7.MatDatepickerApply, selector: "[matDatepickerApply], [matDateRangePickerApply]" }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i8.MatButton, selector: "    button[mat-button], button[mat-raised-button], button[mat-flat-button],    button[mat-stroked-button]  ", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }], encapsulation: i0.ViewEncapsulation.None }); }
+        ], viewQueries: [{ propertyName: "formFields", predicate: SearchComponent, descendants: true }], ngImport: i0, template: "<div\r\n  [formGroup]=\"group\"\r\n  class=\"ieeesa-select-field\"\r\n  *ngIf=\"group\"\r\n  [ngClass]=\"\r\n    isLabelAlignedLeft\r\n      ? 'ieeesa-select-field__label-left'\r\n      : 'ieeesa-select-field__label-top'\r\n  \"\r\n>\r\n  <mat-label class=\"ieeesa-select-field__label\">{{ selectLabel }}</mat-label>\r\n  <mat-form-field\r\n    [ngClass]=\"\r\n      arrowDirection\r\n        ? 'ieeesa-select-field__arrow-up'\r\n        : 'ieeesa-select-field__arrow-down'\r\n    \"\r\n  >\r\n    <mat-select\r\n      disableOptionCentering\r\n      *ngIf=\"isMultiSelect\"\r\n      (openedChange)=\"updateArrowDirection($event)\"\r\n      (selectionChange)=\"onChange($event.value)\"\r\n      [formControlName]=\"config.controlName\"\r\n      [multiple]=\"isMultiSelect\"\r\n      [disabled]=\"isDisabled\"\r\n      [placeholder]=\"placeholderText\"\r\n      [compareWith]=\"comparer\"\r\n    >\r\n      <ieeesa-search\r\n        *ngIf=\"isSearch\"\r\n        [searchType]=\"searchType\"\r\n        (searchValue)=\"onOptionSearch($event)\"\r\n      ></ieeesa-search>\r\n      <ng-container\r\n        *ngIf=\"!isMultiLevel\"\r\n        [ngTemplateOutlet]=\"dropdownOptionsTemplateRef\"\r\n        [ngTemplateOutletContext]=\"{ data: dropdownOptions }\"\r\n      >\r\n      </ng-container>\r\n      <ng-container *ngIf=\"isMultiLevel\">\r\n        <mat-optgroup\r\n          *ngFor=\"let option of dropdownOptions; trackBy: trackByFn\"\r\n          [label]=\"option.name\"\r\n        >\r\n          <ng-container\r\n            [ngTemplateOutlet]=\"dropdownOptionsTemplateRef\"\r\n            [ngTemplateOutletContext]=\"{ data: option.option_groups }\"\r\n          >\r\n          </ng-container>\r\n        </mat-optgroup>\r\n      </ng-container>\r\n      <ng-template #dropdownOptionsTemplateRef let-options=\"data\">\r\n        <mat-option\r\n          *ngFor=\"let option of options; trackBy: trackByFn\"\r\n          [value]=\"option\"\r\n        >\r\n          {{ option.name }}\r\n        </mat-option>\r\n      </ng-template>\r\n    </mat-select>\r\n\r\n    <mat-select\r\n      disableOptionCentering\r\n      *ngIf=\"!isMultiSelect\"\r\n      [multiple]=\"isMultiSelect\"\r\n      (openedChange)=\"updateArrowDirection($event)\"\r\n      (selectionChange)=\"onChange($event.value)\"\r\n      [formControlName]=\"config.controlName\"\r\n      [disabled]=\"isDisabled\"\r\n      [placeholder]=\"placeholderText\"\r\n    >\r\n      <ieeesa-search\r\n        *ngIf=\"isSearch\"\r\n        [searchType]=\"searchType\"\r\n        (searchValue)=\"onOptionSearch($event)\"\r\n      ></ieeesa-search>\r\n      <ng-container\r\n        *ngIf=\"!isMultiLevel\"\r\n        [ngTemplateOutlet]=\"dropdownOptionsTemplateRef\"\r\n        [ngTemplateOutletContext]=\"{ data: dropdownOptions }\"\r\n      >\r\n      </ng-container>\r\n      <ng-container *ngIf=\"isMultiLevel\">\r\n        <mat-optgroup\r\n          *ngFor=\"let option of dropdownOptions; trackBy: trackByFn\"\r\n          [label]=\"option.name\"\r\n        >\r\n          <ng-container\r\n            [ngTemplateOutlet]=\"dropdownOptionsTemplateRef\"\r\n            [ngTemplateOutletContext]=\"{ data: option.option_groups }\"\r\n          >\r\n          </ng-container>\r\n        </mat-optgroup>\r\n      </ng-container>\r\n      <ng-template #dropdownOptionsTemplateRef let-options=\"data\">\r\n        <mat-option\r\n          *ngFor=\"let option of options; trackBy: trackByFn\"\r\n          [value]=\"option\"\r\n        >\r\n          {{ option.name }}\r\n        </mat-option>\r\n      </ng-template>\r\n    </mat-select>\r\n  </mat-form-field>\r\n  <ieeesa-form-error [formGroup]=\"group\" [config]=\"config\"> </ieeesa-form-error>\r\n</div>\r\n", styles: [".ieeesa-subtitle{text-align:left;font-family:Calibri Regular;font-size:1.56em;letter-spacing:0;color:#000;opacity:1}.ieeesa-body{text-align:left;font-family:Calibri Regular;font-size:1.25em;letter-spacing:0;color:#000;opacity:1}.ieeesa-display-lg-57{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:3.5625em;line-height:64px;color:#000;letter-spacing:0}.ieeesa-display-md-47{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:2.9375em;line-height:52px;color:#000;letter-spacing:0}.ieeesa-display-sm-38{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:2.375em;line-height:44px;color:#000;letter-spacing:0}.ieeesa-headline-lg-34{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:2.125em;line-height:40px;color:#000;letter-spacing:0}.ieeesa-headline-md-30{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1.875em;line-height:36px;color:#000;letter-spacing:0}.ieeesa-headline-sm-26{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1.625em;line-height:32px;color:#000;letter-spacing:0}.ieeesa-title-lg-bold-24{font-family:Calibri Regular;font-style:normal;font-weight:700;font-size:1.5em;line-height:28px;color:#000;letter-spacing:0}.ieeesa-title-lg-24{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1.5em;line-height:28px;color:#000;letter-spacing:0}.ieeesa-title-md-18{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1.125em;line-height:24px;color:#000;letter-spacing:.009375em}.ieeesa-title-sm-16{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1em;line-height:20px;color:#000;letter-spacing:.00625em}.ieeesa-label-lg-bold-16{font-family:Calibri Regular;font-style:normal;font-weight:700;font-size:1em;line-height:20px;color:#000;letter-spacing:.00625em}.ieeesa-label-lg-16{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1em;line-height:20px;color:#000;letter-spacing:.00625em}.ieeesa-label-md-14{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:.875em;line-height:16px;color:#000;letter-spacing:.03125em}.ieeesa-label-sm-13{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:.8125em;line-height:16px;color:#000;letter-spacing:.03125em}.ieeesa-body-lg-bold-18{font-family:Calibri Regular;font-style:normal;font-weight:700;font-size:1.125em;line-height:24px;color:#000;letter-spacing:.03125em}.ieeesa-body-lg-18{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1.125em;line-height:24px;color:#000;letter-spacing:.03125em}.ieeesa-body-md-16{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1em;line-height:20px;color:#000;letter-spacing:.015625em}.ieeesa-body-sm-14{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:.875em;line-height:16px;color:#000;letter-spacing:.025em}.ieeesa-title-inter-lg-bold-24{font-family:Inter Bold;font-style:normal;font-weight:700;font-size:1.5em;line-height:29px;color:#000;letter-spacing:0}.mat-mdc-button.mat-mdc-button-base.mat-primary-button,.mat-mdc-button.mat-mdc-button-base.mat-secondary-button{min-width:103px;width:auto;min-height:40px;height:auto;border-radius:3px;text-align:center;padding:.625em 1.5em;border:none;font-family:Calibri Regular;font-style:normal;font-weight:700;font-size:1em;line-height:20px;color:#000;letter-spacing:.00625em}.mat-mdc-button.mat-mdc-button-base>.mat-icon{margin-right:11px}.mat-mdc-button.mat-mdc-button-base.mat-primary-button{background-color:#00629b;color:#fff}.mat-mdc-button.mat-mdc-button-base.mat-primary-button:hover{background-color:#003e65}.mat-mdc-button.mat-mdc-button-base.mat-primary-button:active{background-color:#00629b}.mat-mdc-button.mat-mdc-button-base.mat-primary-button:disabled{background-color:#1c1b1f1f}.mat-mdc-button.mat-mdc-button-base.mat-secondary-button{color:#fff;background:#a7a8aa;box-shadow:0 1px 2px #0000004d,0 2px 6px 2px #00000026}.mat-mdc-button.mat-mdc-button-base.mat-secondary-button:hover{background:#a7a8aa}.mat-mdc-button.mat-mdc-button-base.mat-secondary-button:active{background:rgba(29,25,43,.12)}.mat-mdc-button.mat-mdc-button-base.mat-secondary-button:disabled{background:rgba(28,27,31,.12);color:#1c1b1f;opacity:.38}.ieeesa-text-button{color:#cac4d0;background:none;border:none}.flex-align-center{display:flex;align-items:center;justify-content:center}.mat-button-toggle-checked{background-color:#a7a8aa}.mat-button-toggle-checked .mat-button-toggle-label-content:before{font-family:\"Font Awesome 5 Free\";font-weight:900;content:\"\\f00c\";padding-right:.5625em}.mat-button-toggle-group .mat-button-toggle-label-content{font-family:Calibri Regular;font-style:normal;font-weight:700;font-size:1em;line-height:20px;color:#1c1b1f;letter-spacing:.00625em}@media (max-width: 768px){.mat-button-toggle-group .mat-button-toggle-label-content{max-width:8ch;text-overflow:ellipsis;white-space:nowrap;overflow:hidden;position:relative}}.cdk-overlay-pane{width:100%;min-width:312px}.ieeesa-select-field .mat-mdc-form-field{width:-webkit-fill-available}.ieeesa-select-field__arrow-up .mat-mdc-select-arrow{border:solid #595758;border-width:0 2px 2px 0;display:inline-block;padding:4px;margin:0 10px;transform:rotate(-135deg);-webkit-transform:rotate(-135deg)}.ieeesa-select-field__arrow-up .mat-mdc-select-arrow svg{display:none}.ieeesa-select-field__arrow-down .mat-mdc-select-arrow{border:solid #595758;border-width:0 2px 2px 0;display:inline-block;padding:4px;margin:0 10px;transform:rotate(45deg);-webkit-transform:rotate(45deg)}.ieeesa-select-field__arrow-down .mat-mdc-select-arrow svg{display:none}.ieeesa-select-field__label-left{display:flex}.ieeesa-select-field__label-top{display:block}.ieeesa-select-field .mdc-text-field--filled .mdc-line-ripple:after{border-bottom-color:#918f90!important}.ieeesa-select-field .mdc-text-field--filled .mdc-line-ripple:before{border-bottom-color:#918f90!important}.ieeesa-select-field .mdc-line-ripple--active:after{opacity:0}.ieeesa-select-field .mat-mdc-select-placeholder{font-size:1em;font-weight:400;color:#000}.ieeesa-select-field .mdc-text-field--filled:not(.mdc-text-field--disabled){background-color:#fffbfe}.ieeesa-select-field .mdc-text-field--focused,.ieeesa-select-field .mat-mdc-form-field-focus-overlay,.ieeesa-select-overlay-pane .mat-mdc-select-panel{background-color:#fffbfe}.ieeesa-select-overlay-pane .mdc-list-item__primary-text{color:#000}.ieeesa-select-overlay-pane .mat-mdc-option .mat-pseudo-checkbox-minimal{margin-left:0;float:right}.ieeesa-select-overlay-pane .mat-primary .mat-pseudo-checkbox-checked.mat-pseudo-checkbox-minimal:after{display:none}.ieeesa-select-overlay-pane .ieeesa-search-field .mat-mdc-form-field-infix{width:100%}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: SearchComponent, selector: "ieeesa-search", inputs: ["formControlName", "placeholderLabel", "searchType", "searchTerm"], outputs: ["searchValue"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i3.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i3.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "component", type: FormErrorComponent, selector: "ieeesa-form-error", inputs: ["formGroup", "config", "submitResponse"] }, { kind: "ngmodule", type: MatFormFieldModule }, { kind: "component", type: i4.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i4.MatLabel, selector: "mat-label" }, { kind: "ngmodule", type: MatInputModule }, { kind: "ngmodule", type: MatIconModule }, { kind: "ngmodule", type: MatSelectModule }, { kind: "component", type: i5$3.MatSelect, selector: "mat-select", inputs: ["disabled", "disableRipple", "tabIndex", "panelWidth", "hideSingleSelectionIndicator"], exportAs: ["matSelect"] }, { kind: "component", type: i2$1.MatOption, selector: "mat-option", exportAs: ["matOption"] }, { kind: "component", type: i2$1.MatOptgroup, selector: "mat-optgroup", inputs: ["disabled"], exportAs: ["matOptgroup"] }], encapsulation: i0.ViewEncapsulation.None }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.3", ngImport: i0, type: DatePickerComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.3", ngImport: i0, type: SelectComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'ieeesa-date-picker', standalone: true, imports: [
+            args: [{ selector: 'ieeesa-select', standalone: true, imports: [
                         CommonModule,
+                        SearchComponent,
                         ReactiveFormsModule,
-                        FormErrorComponent$1,
-                        MatExpansionModule,
-                        MatMenuModule,
-                        MatIconModule,
-                        MatInputModule,
+                        FormErrorComponent,
                         MatFormFieldModule,
-                        MatDatepickerModule,
-                        DatePickerHeaderComponent$1,
-                        MatButtonModule,
+                        MatInputModule,
+                        MatIconModule,
+                        MatSelectModule,
                     ], providers: [
-                        { provide: MAT_MOMENT_DATE_ADAPTER_OPTIONS, useValue: { useUtc: true } },
-                        {
-                            provide: DateAdapter,
-                            useClass: CustomDateAdapter,
-                            deps: [MAT_DATE_LOCALE, MAT_MOMENT_DATE_ADAPTER_OPTIONS],
-                        },
                         {
-                            provide: MAT_DATE_FORMATS,
-                            useValue: DateFormats,
+                            provide: MAT_SELECT_CONFIG,
+                            useValue: { overlayPanelClass: 'ieeesa-select-overlay-pane' },
                         },
-                    ], encapsulation: ViewEncapsulation.None, template: "<div class=\"ieeesa-datepicker\">\r\n  <div\r\n    [formGroup]=\"group\"\r\n    *ngIf=\"calendarType === calendarTypes.SINGLE_DATE_SELECTION\"\r\n    class=\"ieeesa-datepicker--single-selection\"\r\n    [ngClass]=\"!isRequired() ? 'ieeesa-datepicker__valid-date' : ''\"\r\n    [ngClass]=\"{\r\n      'ieeesa-datepicker__valid-date': !isRequired(),\r\n      'ieeesa-datepicker__label-left': isLabelAlignedLeft,\r\n      'ieeesa-datepicker__label-top': !isLabelAlignedLeft\r\n    }\"\r\n  >\r\n    <mat-label *ngIf=\"datepickerLabel\">{{ datepickerLabel }} </mat-label>\r\n    <mat-form-field>\r\n      <input\r\n        matInput\r\n        (dateInput)=\"onDateChange()\"\r\n        (click)=\"picker.open()\"\r\n        [matDatepicker]=\"picker\"\r\n        [formControlName]=\"config.controlName\"\r\n        [placeholder]=\"buttonActionsInfo?.datePicker?.dateFormatLabel\"\r\n        #calendar\r\n        readonly\r\n      />\r\n      <mat-datepicker-toggle\r\n        class=\"mat-datepicker-toggle\"\r\n        matIconSuffix\r\n        [for]=\"picker\"\r\n      ></mat-datepicker-toggle>\r\n      <mat-datepicker #picker [calendarHeaderComponent]=\"datePickerHeader\">\r\n        <mat-datepicker-actions>\r\n          <button\r\n            mat-button\r\n            class=\"mat-text-button ieeesa-datepicker__date-picker-button\"\r\n            type=\"button\"\r\n            matDatepickerCancel\r\n          >\r\n            {{ buttonActionsInfo?.button?.cancel }}\r\n          </button>\r\n          <button\r\n            mat-button\r\n            class=\"mat-text-button ieeesa-datepicker__date-picker-button\"\r\n            color=\"primary\"\r\n            type=\"button\"\r\n            matDatepickerApply\r\n          >\r\n            {{ buttonActionsInfo?.button?.ok }}\r\n          </button>\r\n        </mat-datepicker-actions>\r\n      </mat-datepicker>\r\n    </mat-form-field>\r\n    <ieeesa-form-error [formGroup]=\"group\" [config]=\"config\">\r\n    </ieeesa-form-error>\r\n  </div>\r\n\r\n  <div\r\n    [formGroup]=\"group\"\r\n    *ngIf=\"calendarType === calendarTypes.DATE_RANGE_SELECTION\"\r\n    class=\"ieeesa-datepicker--multi-selection\"\r\n    [ngClass]=\"\r\n      isLabelAlignedLeft\r\n        ? 'ieeesa-datepicker__label-left'\r\n        : 'ieeesa-datepicker__label-top'\r\n    \"\r\n  >\r\n    <mat-label *ngIf=\"datepickerLabel\">{{ datepickerLabel }} </mat-label>\r\n    <mat-form-field>\r\n      <mat-date-range-input [rangePicker]=\"rangePicker\" [formGroup]=\"group\">\r\n        <input\r\n          matStartDate\r\n          matInput\r\n          [formControlName]=\"config.dateRangeControls?.startDate ?? ''\"\r\n          [placeholder]=\"buttonActionsInfo?.datePicker?.dateFormatLabel + ' - '\"\r\n          (dateChange)=\"onDateRangeChange()\"\r\n        />\r\n        <input\r\n          matEndDate\r\n          matInput\r\n          [formControlName]=\"config.dateRangeControls?.endDate ?? ''\"\r\n          [placeholder]=\"buttonActionsInfo?.datePicker?.dateFormatLabel\"\r\n          (dateChange)=\"onDateRangeChange()\"\r\n        />\r\n      </mat-date-range-input>\r\n      <mat-datepicker-toggle\r\n        class=\"mat-datepicker-toggle\"\r\n        matIconSuffix\r\n        [for]=\"rangePicker\"\r\n      ></mat-datepicker-toggle>\r\n      <mat-date-range-picker\r\n        #rangePicker\r\n        [calendarHeaderComponent]=\"datePickerHeader\"\r\n        (dateInput)=\"onDateRangeChange()\"\r\n      >\r\n        <mat-date-range-picker-actions>\r\n          <button\r\n            mat-button\r\n            class=\"mat-text-button ieeesa-datepicker__date-picker-button\"\r\n            matDateRangePickerCancel\r\n            type=\"button\"\r\n          >\r\n            {{ buttonActionsInfo?.button?.cancel }}\r\n          </button>\r\n          <button\r\n            mat-button\r\n            class=\"mat-text-button ieeesa-datepicker__date-picker-button\"\r\n            color=\"primary\"\r\n            matDateRangePickerApply\r\n            (click)=\"onDateRangeChange()\"\r\n            type=\"button\"\r\n          >\r\n            {{ buttonActionsInfo?.button?.ok }}\r\n          </button>\r\n        </mat-date-range-picker-actions>\r\n      </mat-date-range-picker>\r\n    </mat-form-field>\r\n  </div>\r\n\r\n  <div\r\n    *ngIf=\"calendarType === calendarTypes.CALENDAR\"\r\n    class=\"ieeesa-datepicker--calendar\"\r\n  >\r\n    <mat-calendar\r\n      [headerComponent]=\"datePickerHeader\"\r\n      [(selected)]=\"calendarSelectedDate\"\r\n    >\r\n    </mat-calendar>\r\n  </div>\r\n</div>\r\n", styles: [".ieeesa-subtitle{text-align:left;font-family:Calibri Regular;font-size:1.56em;letter-spacing:0;color:#000;opacity:1}.ieeesa-body{text-align:left;font-family:Calibri Regular;font-size:1.25em;letter-spacing:0;color:#000;opacity:1}.ieeesa-display-lg-57{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:3.5625em;line-height:64px;color:#000;letter-spacing:0}.ieeesa-display-md-47{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:2.9375em;line-height:52px;color:#000;letter-spacing:0}.ieeesa-display-sm-38{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:2.375em;line-height:44px;color:#000;letter-spacing:0}.ieeesa-headline-lg-34{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:2.125em;line-height:40px;color:#000;letter-spacing:0}.ieeesa-headline-md-30{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1.875em;line-height:36px;color:#000;letter-spacing:0}.ieeesa-headline-sm-26{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1.625em;line-height:32px;color:#000;letter-spacing:0}.ieeesa-title-lg-bold-24{font-family:Calibri Regular;font-style:normal;font-weight:700;font-size:1.5em;line-height:28px;color:#000;letter-spacing:0}.ieeesa-title-lg-24{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1.5em;line-height:28px;color:#000;letter-spacing:0}.ieeesa-title-md-18{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1.125em;line-height:24px;color:#000;letter-spacing:.009375em}.ieeesa-title-sm-16{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1em;line-height:20px;color:#000;letter-spacing:.00625em}.ieeesa-label-lg-bold-16{font-family:Calibri Regular;font-style:normal;font-weight:700;font-size:1em;line-height:20px;color:#000;letter-spacing:.00625em}.ieeesa-label-lg-16{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1em;line-height:20px;color:#000;letter-spacing:.00625em}.ieeesa-label-md-14{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:.875em;line-height:16px;color:#000;letter-spacing:.03125em}.ieeesa-label-sm-13{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:.8125em;line-height:16px;color:#000;letter-spacing:.03125em}.ieeesa-body-lg-bold-18{font-family:Calibri Regular;font-style:normal;font-weight:700;font-size:1.125em;line-height:24px;color:#000;letter-spacing:.03125em}.ieeesa-body-lg-18{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1.125em;line-height:24px;color:#000;letter-spacing:.03125em}.ieeesa-body-md-16{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1em;line-height:20px;color:#000;letter-spacing:.015625em}.ieeesa-body-sm-14{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:.875em;line-height:16px;color:#000;letter-spacing:.025em}.ieeesa-title-inter-lg-bold-24{font-family:Inter Bold;font-style:normal;font-weight:700;font-size:1.5em;line-height:29px;color:#000;letter-spacing:0}.mat-mdc-button.mat-mdc-button-base.mat-primary-button,.mat-mdc-button.mat-mdc-button-base.mat-secondary-button{min-width:103px;width:auto;min-height:40px;height:auto;border-radius:3px;text-align:center;padding:.625em 1.5em;border:none;font-family:Calibri Regular;font-style:normal;font-weight:700;font-size:1em;line-height:20px;color:#000;letter-spacing:.00625em}.mat-mdc-button.mat-mdc-button-base>.mat-icon{margin-right:11px}.mat-mdc-button.mat-mdc-button-base.mat-primary-button{background-color:#00629b;color:#fff}.mat-mdc-button.mat-mdc-button-base.mat-primary-button:hover{background-color:#003e65}.mat-mdc-button.mat-mdc-button-base.mat-primary-button:active{background-color:#00629b}.mat-mdc-button.mat-mdc-button-base.mat-primary-button:disabled{background-color:#1c1b1f1f}.mat-mdc-button.mat-mdc-button-base.mat-secondary-button{color:#fff;background:#a7a8aa;box-shadow:0 1px 2px #0000004d,0 2px 6px 2px #00000026}.mat-mdc-button.mat-mdc-button-base.mat-secondary-button:hover{background:#a7a8aa}.mat-mdc-button.mat-mdc-button-base.mat-secondary-button:active{background:rgba(29,25,43,.12)}.mat-mdc-button.mat-mdc-button-base.mat-secondary-button:disabled{background:rgba(28,27,31,.12);color:#1c1b1f;opacity:.38}.ieeesa-text-button{color:#cac4d0;background:none;border:none}.flex-align-center{display:flex;align-items:center;justify-content:center}.mat-button-toggle-checked{background-color:#a7a8aa}.mat-button-toggle-checked .mat-button-toggle-label-content:before{font-family:\"Font Awesome 5 Free\";font-weight:900;content:\"\\f00c\";padding-right:.5625em}.mat-button-toggle-group .mat-button-toggle-label-content{font-family:Calibri Regular;font-style:normal;font-weight:700;font-size:1em;line-height:20px;color:#1c1b1f;letter-spacing:.00625em}@media (max-width: 768px){.mat-button-toggle-group .mat-button-toggle-label-content{max-width:8ch;text-overflow:ellipsis;white-space:nowrap;overflow:hidden;position:relative}}.cdk-overlay-pane{width:100%;min-width:312px}.ieeesa-datepicker{min-width:360px;width:auto}.ieeesa-datepicker__label-left{display:flex}.ieeesa-datepicker__label-top{display:block}.ieeesa-datepicker__date-picker-button{background:linear-gradient(0deg,rgba(0,98,155,.11),rgba(0,98,155,.11)),#fffbfe}.ieeesa-datepicker--calendar{background:linear-gradient(0deg,rgba(0,98,155,.11),rgba(0,98,155,.11)),#fffbfe;border-radius:16px}.ieeesa-datepicker--calendar .mat-calendar-body-cell-container{margin:0;padding-top:24px 0}.ieeesa-datepicker--calendar .mat-calendar-table-header th,.ieeesa-datepicker--calendar .mat-calendar-body td{height:24px!important;padding-top:24px!important;width:24px!important;padding-bottom:24px!important}.ieeesa-datepicker--calendar .mat-calendar-body-selected{background-color:#00b5e2;color:#fff;border:none;box-shadow:none}.ieeesa-datepicker--calendar .mat-calendar-body-cell:not(.mat-calendar-body-disabled):hover>.mat-calendar-body-cell-content:not(.mat-calendar-body-selected):not(.mat-calendar-body-comparison-identical){background-color:#00b5e2;color:#fff;border:none;box-shadow:none}.ieeesa-datepicker--calendar .mat-calendar-content{padding:0 8px 35px}.ieeesa-datepicker .mat-mdc-form-field{width:-webkit-fill-available}.ieeesa-datepicker .mat-mdc-text-field-wrapper.mdc-text-field.mdc-text-field--outlined.mdc-text-field--no-label,.ieeesa-datepicker .mdc-text-field--filled:not(.mdc-text-field--disabled){border:2px solid #00b5e2;border-radius:4px;height:56px;align-items:center;background-color:#f0f5f9}.ieeesa-datepicker .mdc-text-field--filled:not(.mdc-text-field--disabled) .mdc-line-ripple:before{border:none}.ieeesa-datepicker .mat-mdc-text-field-wrapper.mdc-text-field--outlined .mdc-text-field__input,.ieeesa-datepicker .mdc-text-field--no-label:not(.mdc-text-field--textarea) .mat-mdc-form-field-input-control.mdc-text-field__input{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1em;line-height:24px;color:#1c1b1f;letter-spacing:.03125em}.ieeesa-datepicker .mat-mdc-text-field-wrapper.mdc-text-field--outlined .mdc-text-field__input::placeholder,.ieeesa-datepicker .mdc-text-field--no-label:not(.mdc-text-field--textarea) .mat-mdc-form-field-input-control.mdc-text-field__input::placeholder{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1.125em;line-height:24px;color:#49454f;letter-spacing:.03125em}.ieeesa-datepicker .mat-mdc-form-field-hint{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1em;line-height:16px;color:#49454f;letter-spacing:.025em}.ieeesa-datepicker .mat-datepicker-toggle-default-icon{width:18px;height:20px}.mat-datepicker-popup .mat-datepicker-content-container{background:linear-gradient(0deg,rgba(0,98,155,.11),rgba(0,98,155,.11)),#fffbfe;border-radius:28px}.mat-datepicker-popup .mat-datepicker-content-container .mat-calendar-body-cell-content{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1.125em;line-height:24px;color:#1c1b1f;letter-spacing:.03125em}.mat-datepicker-popup .mat-datepicker-content-container .mat-calendar-body-selected{background-color:#00b5e2;color:#fff;border:none;box-shadow:none}.mat-datepicker-popup .mat-datepicker-content-container .mat-calendar-body-in-range:before{background-color:#a7a8aa;color:#49454f}.mat-datepicker-popup .mat-datepicker-content{border-radius:28px}.mat-datepicker-popup .mat-calendar-table-header{position:relative;top:25px}.mat-datepicker-popup .mat-calendar-table-header th,.mat-datepicker-popup .mat-calendar-body td{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1.125em;line-height:24px;color:#000;letter-spacing:.03125em}.mat-datepicker-popup .mat-calendar-table-header-divider,.mat-datepicker-popup .mat-calendar-body tr:first-child td:only-child{display:none}.mat-datepicker-popup .mat-calendar-body tr:first-child td:first-child:not(:only-child){visibility:hidden}.mat-datepicker-popup .mat-calendar-body{position:relative;top:20px}.mat-datepicker-popup .mat-mdc-menu-panel{min-width:360px;width:auto}.mat-datepicker-popup .mat-calendar-body-today{border-color:#00b5e2;color:#00b5e2}.mat-datepicker-popup .mat-datepicker-actions{padding:15px 10px 10px}.mat-datepicker-popup .mat-datepicker-toggle{color:#49454f}\n"] }]
-        }], ctorParameters: function () { return [{ type: i3.FormBuilder }, { type: i0.ChangeDetectorRef }, { type: i2$2.DatepickerService }, { type: i1.FormUtilityService }]; }, propDecorators: { selectedDates: [{
+                    ], encapsulation: ViewEncapsulation.None, template: "<div\r\n  [formGroup]=\"group\"\r\n  class=\"ieeesa-select-field\"\r\n  *ngIf=\"group\"\r\n  [ngClass]=\"\r\n    isLabelAlignedLeft\r\n      ? 'ieeesa-select-field__label-left'\r\n      : 'ieeesa-select-field__label-top'\r\n  \"\r\n>\r\n  <mat-label class=\"ieeesa-select-field__label\">{{ selectLabel }}</mat-label>\r\n  <mat-form-field\r\n    [ngClass]=\"\r\n      arrowDirection\r\n        ? 'ieeesa-select-field__arrow-up'\r\n        : 'ieeesa-select-field__arrow-down'\r\n    \"\r\n  >\r\n    <mat-select\r\n      disableOptionCentering\r\n      *ngIf=\"isMultiSelect\"\r\n      (openedChange)=\"updateArrowDirection($event)\"\r\n      (selectionChange)=\"onChange($event.value)\"\r\n      [formControlName]=\"config.controlName\"\r\n      [multiple]=\"isMultiSelect\"\r\n      [disabled]=\"isDisabled\"\r\n      [placeholder]=\"placeholderText\"\r\n      [compareWith]=\"comparer\"\r\n    >\r\n      <ieeesa-search\r\n        *ngIf=\"isSearch\"\r\n        [searchType]=\"searchType\"\r\n        (searchValue)=\"onOptionSearch($event)\"\r\n      ></ieeesa-search>\r\n      <ng-container\r\n        *ngIf=\"!isMultiLevel\"\r\n        [ngTemplateOutlet]=\"dropdownOptionsTemplateRef\"\r\n        [ngTemplateOutletContext]=\"{ data: dropdownOptions }\"\r\n      >\r\n      </ng-container>\r\n      <ng-container *ngIf=\"isMultiLevel\">\r\n        <mat-optgroup\r\n          *ngFor=\"let option of dropdownOptions; trackBy: trackByFn\"\r\n          [label]=\"option.name\"\r\n        >\r\n          <ng-container\r\n            [ngTemplateOutlet]=\"dropdownOptionsTemplateRef\"\r\n            [ngTemplateOutletContext]=\"{ data: option.option_groups }\"\r\n          >\r\n          </ng-container>\r\n        </mat-optgroup>\r\n      </ng-container>\r\n      <ng-template #dropdownOptionsTemplateRef let-options=\"data\">\r\n        <mat-option\r\n          *ngFor=\"let option of options; trackBy: trackByFn\"\r\n          [value]=\"option\"\r\n        >\r\n          {{ option.name }}\r\n        </mat-option>\r\n      </ng-template>\r\n    </mat-select>\r\n\r\n    <mat-select\r\n      disableOptionCentering\r\n      *ngIf=\"!isMultiSelect\"\r\n      [multiple]=\"isMultiSelect\"\r\n      (openedChange)=\"updateArrowDirection($event)\"\r\n      (selectionChange)=\"onChange($event.value)\"\r\n      [formControlName]=\"config.controlName\"\r\n      [disabled]=\"isDisabled\"\r\n      [placeholder]=\"placeholderText\"\r\n    >\r\n      <ieeesa-search\r\n        *ngIf=\"isSearch\"\r\n        [searchType]=\"searchType\"\r\n        (searchValue)=\"onOptionSearch($event)\"\r\n      ></ieeesa-search>\r\n      <ng-container\r\n        *ngIf=\"!isMultiLevel\"\r\n        [ngTemplateOutlet]=\"dropdownOptionsTemplateRef\"\r\n        [ngTemplateOutletContext]=\"{ data: dropdownOptions }\"\r\n      >\r\n      </ng-container>\r\n      <ng-container *ngIf=\"isMultiLevel\">\r\n        <mat-optgroup\r\n          *ngFor=\"let option of dropdownOptions; trackBy: trackByFn\"\r\n          [label]=\"option.name\"\r\n        >\r\n          <ng-container\r\n            [ngTemplateOutlet]=\"dropdownOptionsTemplateRef\"\r\n            [ngTemplateOutletContext]=\"{ data: option.option_groups }\"\r\n          >\r\n          </ng-container>\r\n        </mat-optgroup>\r\n      </ng-container>\r\n      <ng-template #dropdownOptionsTemplateRef let-options=\"data\">\r\n        <mat-option\r\n          *ngFor=\"let option of options; trackBy: trackByFn\"\r\n          [value]=\"option\"\r\n        >\r\n          {{ option.name }}\r\n        </mat-option>\r\n      </ng-template>\r\n    </mat-select>\r\n  </mat-form-field>\r\n  <ieeesa-form-error [formGroup]=\"group\" [config]=\"config\"> </ieeesa-form-error>\r\n</div>\r\n", styles: [".ieeesa-subtitle{text-align:left;font-family:Calibri Regular;font-size:1.56em;letter-spacing:0;color:#000;opacity:1}.ieeesa-body{text-align:left;font-family:Calibri Regular;font-size:1.25em;letter-spacing:0;color:#000;opacity:1}.ieeesa-display-lg-57{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:3.5625em;line-height:64px;color:#000;letter-spacing:0}.ieeesa-display-md-47{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:2.9375em;line-height:52px;color:#000;letter-spacing:0}.ieeesa-display-sm-38{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:2.375em;line-height:44px;color:#000;letter-spacing:0}.ieeesa-headline-lg-34{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:2.125em;line-height:40px;color:#000;letter-spacing:0}.ieeesa-headline-md-30{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1.875em;line-height:36px;color:#000;letter-spacing:0}.ieeesa-headline-sm-26{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1.625em;line-height:32px;color:#000;letter-spacing:0}.ieeesa-title-lg-bold-24{font-family:Calibri Regular;font-style:normal;font-weight:700;font-size:1.5em;line-height:28px;color:#000;letter-spacing:0}.ieeesa-title-lg-24{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1.5em;line-height:28px;color:#000;letter-spacing:0}.ieeesa-title-md-18{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1.125em;line-height:24px;color:#000;letter-spacing:.009375em}.ieeesa-title-sm-16{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1em;line-height:20px;color:#000;letter-spacing:.00625em}.ieeesa-label-lg-bold-16{font-family:Calibri Regular;font-style:normal;font-weight:700;font-size:1em;line-height:20px;color:#000;letter-spacing:.00625em}.ieeesa-label-lg-16{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1em;line-height:20px;color:#000;letter-spacing:.00625em}.ieeesa-label-md-14{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:.875em;line-height:16px;color:#000;letter-spacing:.03125em}.ieeesa-label-sm-13{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:.8125em;line-height:16px;color:#000;letter-spacing:.03125em}.ieeesa-body-lg-bold-18{font-family:Calibri Regular;font-style:normal;font-weight:700;font-size:1.125em;line-height:24px;color:#000;letter-spacing:.03125em}.ieeesa-body-lg-18{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1.125em;line-height:24px;color:#000;letter-spacing:.03125em}.ieeesa-body-md-16{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1em;line-height:20px;color:#000;letter-spacing:.015625em}.ieeesa-body-sm-14{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:.875em;line-height:16px;color:#000;letter-spacing:.025em}.ieeesa-title-inter-lg-bold-24{font-family:Inter Bold;font-style:normal;font-weight:700;font-size:1.5em;line-height:29px;color:#000;letter-spacing:0}.mat-mdc-button.mat-mdc-button-base.mat-primary-button,.mat-mdc-button.mat-mdc-button-base.mat-secondary-button{min-width:103px;width:auto;min-height:40px;height:auto;border-radius:3px;text-align:center;padding:.625em 1.5em;border:none;font-family:Calibri Regular;font-style:normal;font-weight:700;font-size:1em;line-height:20px;color:#000;letter-spacing:.00625em}.mat-mdc-button.mat-mdc-button-base>.mat-icon{margin-right:11px}.mat-mdc-button.mat-mdc-button-base.mat-primary-button{background-color:#00629b;color:#fff}.mat-mdc-button.mat-mdc-button-base.mat-primary-button:hover{background-color:#003e65}.mat-mdc-button.mat-mdc-button-base.mat-primary-button:active{background-color:#00629b}.mat-mdc-button.mat-mdc-button-base.mat-primary-button:disabled{background-color:#1c1b1f1f}.mat-mdc-button.mat-mdc-button-base.mat-secondary-button{color:#fff;background:#a7a8aa;box-shadow:0 1px 2px #0000004d,0 2px 6px 2px #00000026}.mat-mdc-button.mat-mdc-button-base.mat-secondary-button:hover{background:#a7a8aa}.mat-mdc-button.mat-mdc-button-base.mat-secondary-button:active{background:rgba(29,25,43,.12)}.mat-mdc-button.mat-mdc-button-base.mat-secondary-button:disabled{background:rgba(28,27,31,.12);color:#1c1b1f;opacity:.38}.ieeesa-text-button{color:#cac4d0;background:none;border:none}.flex-align-center{display:flex;align-items:center;justify-content:center}.mat-button-toggle-checked{background-color:#a7a8aa}.mat-button-toggle-checked .mat-button-toggle-label-content:before{font-family:\"Font Awesome 5 Free\";font-weight:900;content:\"\\f00c\";padding-right:.5625em}.mat-button-toggle-group .mat-button-toggle-label-content{font-family:Calibri Regular;font-style:normal;font-weight:700;font-size:1em;line-height:20px;color:#1c1b1f;letter-spacing:.00625em}@media (max-width: 768px){.mat-button-toggle-group .mat-button-toggle-label-content{max-width:8ch;text-overflow:ellipsis;white-space:nowrap;overflow:hidden;position:relative}}.cdk-overlay-pane{width:100%;min-width:312px}.ieeesa-select-field .mat-mdc-form-field{width:-webkit-fill-available}.ieeesa-select-field__arrow-up .mat-mdc-select-arrow{border:solid #595758;border-width:0 2px 2px 0;display:inline-block;padding:4px;margin:0 10px;transform:rotate(-135deg);-webkit-transform:rotate(-135deg)}.ieeesa-select-field__arrow-up .mat-mdc-select-arrow svg{display:none}.ieeesa-select-field__arrow-down .mat-mdc-select-arrow{border:solid #595758;border-width:0 2px 2px 0;display:inline-block;padding:4px;margin:0 10px;transform:rotate(45deg);-webkit-transform:rotate(45deg)}.ieeesa-select-field__arrow-down .mat-mdc-select-arrow svg{display:none}.ieeesa-select-field__label-left{display:flex}.ieeesa-select-field__label-top{display:block}.ieeesa-select-field .mdc-text-field--filled .mdc-line-ripple:after{border-bottom-color:#918f90!important}.ieeesa-select-field .mdc-text-field--filled .mdc-line-ripple:before{border-bottom-color:#918f90!important}.ieeesa-select-field .mdc-line-ripple--active:after{opacity:0}.ieeesa-select-field .mat-mdc-select-placeholder{font-size:1em;font-weight:400;color:#000}.ieeesa-select-field .mdc-text-field--filled:not(.mdc-text-field--disabled){background-color:#fffbfe}.ieeesa-select-field .mdc-text-field--focused,.ieeesa-select-field .mat-mdc-form-field-focus-overlay,.ieeesa-select-overlay-pane .mat-mdc-select-panel{background-color:#fffbfe}.ieeesa-select-overlay-pane .mdc-list-item__primary-text{color:#000}.ieeesa-select-overlay-pane .mat-mdc-option .mat-pseudo-checkbox-minimal{margin-left:0;float:right}.ieeesa-select-overlay-pane .mat-primary .mat-pseudo-checkbox-checked.mat-pseudo-checkbox-minimal:after{display:none}.ieeesa-select-overlay-pane .ieeesa-search-field .mat-mdc-form-field-infix{width:100%}\n"] }]
+        }], ctorParameters: function () { return [{ type: FormUtilityService }]; }, propDecorators: { formFields: [{
+                type: ViewChildren,
+                args: [SearchComponent]
+            }], isSortNeeded: [{
                 type: Input
-            }], selectedRange: [{
+            }], dropdownOptions: [{
                 type: Input
-            }], calendarType: [{
+            }], selectedOptions: [{
                 type: Input
             }], formControlName: [{
                 type: Input
-            }], placeholderLabel: [{
-                type: Input
-            }], isDisabled: [{
+            }], isMultiLevel: [{
                 type: Input
             }], isLabelAlignedLeft: [{
                 type: Input
-            }], datepickerLabel: [{
+            }], selectLabel: [{
                 type: Input
-            }], dateRange: [{
+            }], isMultiSelect: [{
                 type: Input
-            }], selectedDate: [{
+            }], isDisabled: [{
+                type: Input
+            }], isSearch: [{
+                type: Input
+            }], placeholderText: [{
+                type: Input
+            }], optionSelected: [{
                 type: Output
-            }], selectedDateRange: [{
+            }], optionSearched: [{
                 type: Output
             }] } });
 
-const moment = moment_;
+class TextAreaComponent {
+    constructor() {
+        // eslint-disable-next-line @typescript-eslint/no-explicit-any
+        this.constants = constantsInfo;
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.3", ngImport: i0, type: TextAreaComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.3", type: TextAreaComponent, isStandalone: true, selector: "ieeesa-text-area", ngImport: i0, template: "<div\r\n  class=\"ieeesa-text-area-field\"\r\n  [formGroup]=\"group\"\r\n  [ngClass]=\"\r\n    config.isLabelAlignedLeft\r\n      ? 'ieeesa-text-area-field__label-left'\r\n      : 'ieeesa-text-area-field__label-top'\r\n  \"\r\n>\r\n  <mat-label class=\"ieeesa-body-sm-14 ieeesa-text-area-field__label\">{{\r\n    config.label\r\n  }}</mat-label>\r\n  <mat-form-field appearance=\"fill\">\r\n    <textarea\r\n      name=\"config.name\"\r\n      matInput\r\n      [placeholder]=\"config.placeholder ?? ''\"\r\n      [formControlName]=\"config.controlName\"\r\n      [maxlength]=\"config.maxLength ?? constants.textarea.maxLengthDefault\"\r\n      [readonly]=\"config.isReadonly\"\r\n      class=\"ieeesa-text-area-field__content ieeesa-body-lg-18\"\r\n      [ngClass]=\"\r\n        config.isResize\r\n          ? 'ieeesa-text-area-field__resize'\r\n          : 'ieeesa-text-area-field__no-resize'\r\n      \"\r\n    >\r\n  {{ config.value }}</textarea\r\n    >\r\n  </mat-form-field>\r\n  <ieeesa-form-error [formGroup]=\"group\" [config]=\"config\"> </ieeesa-form-error>\r\n</div>\r\n", styles: [".ieeesa-subtitle{text-align:left;font-family:Calibri Regular;font-size:1.56em;letter-spacing:0;color:#000;opacity:1}.ieeesa-body{text-align:left;font-family:Calibri Regular;font-size:1.25em;letter-spacing:0;color:#000;opacity:1}.ieeesa-display-lg-57{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:3.5625em;line-height:64px;color:#000;letter-spacing:0}.ieeesa-display-md-47{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:2.9375em;line-height:52px;color:#000;letter-spacing:0}.ieeesa-display-sm-38{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:2.375em;line-height:44px;color:#000;letter-spacing:0}.ieeesa-headline-lg-34{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:2.125em;line-height:40px;color:#000;letter-spacing:0}.ieeesa-headline-md-30{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1.875em;line-height:36px;color:#000;letter-spacing:0}.ieeesa-headline-sm-26{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1.625em;line-height:32px;color:#000;letter-spacing:0}.ieeesa-title-lg-bold-24{font-family:Calibri Regular;font-style:normal;font-weight:700;font-size:1.5em;line-height:28px;color:#000;letter-spacing:0}.ieeesa-title-lg-24{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1.5em;line-height:28px;color:#000;letter-spacing:0}.ieeesa-title-md-18{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1.125em;line-height:24px;color:#000;letter-spacing:.009375em}.ieeesa-title-sm-16{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1em;line-height:20px;color:#000;letter-spacing:.00625em}.ieeesa-label-lg-bold-16{font-family:Calibri Regular;font-style:normal;font-weight:700;font-size:1em;line-height:20px;color:#000;letter-spacing:.00625em}.ieeesa-label-lg-16{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1em;line-height:20px;color:#000;letter-spacing:.00625em}.ieeesa-label-md-14{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:.875em;line-height:16px;color:#000;letter-spacing:.03125em}.ieeesa-label-sm-13{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:.8125em;line-height:16px;color:#000;letter-spacing:.03125em}.ieeesa-body-lg-bold-18{font-family:Calibri Regular;font-style:normal;font-weight:700;font-size:1.125em;line-height:24px;color:#000;letter-spacing:.03125em}.ieeesa-body-lg-18{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1.125em;line-height:24px;color:#000;letter-spacing:.03125em}.ieeesa-body-md-16{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1em;line-height:20px;color:#000;letter-spacing:.015625em}.ieeesa-body-sm-14{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:.875em;line-height:16px;color:#000;letter-spacing:.025em}.ieeesa-title-inter-lg-bold-24{font-family:Inter Bold;font-style:normal;font-weight:700;font-size:1.5em;line-height:29px;color:#000;letter-spacing:0}.mat-mdc-button.mat-mdc-button-base.mat-primary-button,.mat-mdc-button.mat-mdc-button-base.mat-secondary-button{min-width:103px;width:auto;min-height:40px;height:auto;border-radius:3px;text-align:center;padding:.625em 1.5em;border:none;font-family:Calibri Regular;font-style:normal;font-weight:700;font-size:1em;line-height:20px;color:#000;letter-spacing:.00625em}.mat-mdc-button.mat-mdc-button-base>.mat-icon{margin-right:11px}.mat-mdc-button.mat-mdc-button-base.mat-primary-button{background-color:#00629b;color:#fff}.mat-mdc-button.mat-mdc-button-base.mat-primary-button:hover{background-color:#003e65}.mat-mdc-button.mat-mdc-button-base.mat-primary-button:active{background-color:#00629b}.mat-mdc-button.mat-mdc-button-base.mat-primary-button:disabled{background-color:#1c1b1f1f}.mat-mdc-button.mat-mdc-button-base.mat-secondary-button{color:#fff;background:#a7a8aa;box-shadow:0 1px 2px #0000004d,0 2px 6px 2px #00000026}.mat-mdc-button.mat-mdc-button-base.mat-secondary-button:hover{background:#a7a8aa}.mat-mdc-button.mat-mdc-button-base.mat-secondary-button:active{background:rgba(29,25,43,.12)}.mat-mdc-button.mat-mdc-button-base.mat-secondary-button:disabled{background:rgba(28,27,31,.12);color:#1c1b1f;opacity:.38}.ieeesa-text-button{color:#cac4d0;background:none;border:none}.flex-align-center{display:flex;align-items:center;justify-content:center}.mat-button-toggle-checked{background-color:#a7a8aa}.mat-button-toggle-checked .mat-button-toggle-label-content:before{font-family:\"Font Awesome 5 Free\";font-weight:900;content:\"\\f00c\";padding-right:.5625em}.mat-button-toggle-group .mat-button-toggle-label-content{font-family:Calibri Regular;font-style:normal;font-weight:700;font-size:1em;line-height:20px;color:#1c1b1f;letter-spacing:.00625em}@media (max-width: 768px){.mat-button-toggle-group .mat-button-toggle-label-content{max-width:8ch;text-overflow:ellipsis;white-space:nowrap;overflow:hidden;position:relative}}.cdk-overlay-pane{width:100%;min-width:312px}.ieeesa-text-area-field__label-left{display:flex}.ieeesa-text-area-field__label-top{display:block}.ieeesa-text-area-field__content{min-width:444px;min-height:40px;width:auto;height:auto;border:none;padding-left:14px;border-radius:4px 4px 0 0}.ieeesa-text-area-field__no-resize{resize:none}.ieeesa-text-area-field__resize{resize:auto}.ieeesa-text-area-field .mat-mdc-form-field{width:-webkit-fill-available}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i3.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i3.MaxLengthValidator, selector: "[maxlength][formControlName],[maxlength][formControl],[maxlength][ngModel]", inputs: ["maxlength"] }, { kind: "directive", type: i3.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i3.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "component", type: FormErrorComponent, selector: "ieeesa-form-error", inputs: ["formGroup", "config", "submitResponse"] }, { kind: "ngmodule", type: MatFormFieldModule }, { kind: "component", type: i4.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i4.MatLabel, selector: "mat-label" }, { kind: "ngmodule", type: MatInputModule }, { kind: "directive", type: i5.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl],      input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly"], exportAs: ["matInput"] }], encapsulation: i0.ViewEncapsulation.None }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.3", ngImport: i0, type: TextAreaComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'ieeesa-text-area', standalone: true, imports: [
+                        CommonModule,
+                        ReactiveFormsModule,
+                        FormErrorComponent,
+                        MatFormFieldModule,
+                        MatInputModule,
+                    ], encapsulation: ViewEncapsulation.None, template: "<div\r\n  class=\"ieeesa-text-area-field\"\r\n  [formGroup]=\"group\"\r\n  [ngClass]=\"\r\n    config.isLabelAlignedLeft\r\n      ? 'ieeesa-text-area-field__label-left'\r\n      : 'ieeesa-text-area-field__label-top'\r\n  \"\r\n>\r\n  <mat-label class=\"ieeesa-body-sm-14 ieeesa-text-area-field__label\">{{\r\n    config.label\r\n  }}</mat-label>\r\n  <mat-form-field appearance=\"fill\">\r\n    <textarea\r\n      name=\"config.name\"\r\n      matInput\r\n      [placeholder]=\"config.placeholder ?? ''\"\r\n      [formControlName]=\"config.controlName\"\r\n      [maxlength]=\"config.maxLength ?? constants.textarea.maxLengthDefault\"\r\n      [readonly]=\"config.isReadonly\"\r\n      class=\"ieeesa-text-area-field__content ieeesa-body-lg-18\"\r\n      [ngClass]=\"\r\n        config.isResize\r\n          ? 'ieeesa-text-area-field__resize'\r\n          : 'ieeesa-text-area-field__no-resize'\r\n      \"\r\n    >\r\n  {{ config.value }}</textarea\r\n    >\r\n  </mat-form-field>\r\n  <ieeesa-form-error [formGroup]=\"group\" [config]=\"config\"> </ieeesa-form-error>\r\n</div>\r\n", styles: [".ieeesa-subtitle{text-align:left;font-family:Calibri Regular;font-size:1.56em;letter-spacing:0;color:#000;opacity:1}.ieeesa-body{text-align:left;font-family:Calibri Regular;font-size:1.25em;letter-spacing:0;color:#000;opacity:1}.ieeesa-display-lg-57{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:3.5625em;line-height:64px;color:#000;letter-spacing:0}.ieeesa-display-md-47{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:2.9375em;line-height:52px;color:#000;letter-spacing:0}.ieeesa-display-sm-38{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:2.375em;line-height:44px;color:#000;letter-spacing:0}.ieeesa-headline-lg-34{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:2.125em;line-height:40px;color:#000;letter-spacing:0}.ieeesa-headline-md-30{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1.875em;line-height:36px;color:#000;letter-spacing:0}.ieeesa-headline-sm-26{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1.625em;line-height:32px;color:#000;letter-spacing:0}.ieeesa-title-lg-bold-24{font-family:Calibri Regular;font-style:normal;font-weight:700;font-size:1.5em;line-height:28px;color:#000;letter-spacing:0}.ieeesa-title-lg-24{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1.5em;line-height:28px;color:#000;letter-spacing:0}.ieeesa-title-md-18{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1.125em;line-height:24px;color:#000;letter-spacing:.009375em}.ieeesa-title-sm-16{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1em;line-height:20px;color:#000;letter-spacing:.00625em}.ieeesa-label-lg-bold-16{font-family:Calibri Regular;font-style:normal;font-weight:700;font-size:1em;line-height:20px;color:#000;letter-spacing:.00625em}.ieeesa-label-lg-16{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1em;line-height:20px;color:#000;letter-spacing:.00625em}.ieeesa-label-md-14{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:.875em;line-height:16px;color:#000;letter-spacing:.03125em}.ieeesa-label-sm-13{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:.8125em;line-height:16px;color:#000;letter-spacing:.03125em}.ieeesa-body-lg-bold-18{font-family:Calibri Regular;font-style:normal;font-weight:700;font-size:1.125em;line-height:24px;color:#000;letter-spacing:.03125em}.ieeesa-body-lg-18{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1.125em;line-height:24px;color:#000;letter-spacing:.03125em}.ieeesa-body-md-16{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1em;line-height:20px;color:#000;letter-spacing:.015625em}.ieeesa-body-sm-14{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:.875em;line-height:16px;color:#000;letter-spacing:.025em}.ieeesa-title-inter-lg-bold-24{font-family:Inter Bold;font-style:normal;font-weight:700;font-size:1.5em;line-height:29px;color:#000;letter-spacing:0}.mat-mdc-button.mat-mdc-button-base.mat-primary-button,.mat-mdc-button.mat-mdc-button-base.mat-secondary-button{min-width:103px;width:auto;min-height:40px;height:auto;border-radius:3px;text-align:center;padding:.625em 1.5em;border:none;font-family:Calibri Regular;font-style:normal;font-weight:700;font-size:1em;line-height:20px;color:#000;letter-spacing:.00625em}.mat-mdc-button.mat-mdc-button-base>.mat-icon{margin-right:11px}.mat-mdc-button.mat-mdc-button-base.mat-primary-button{background-color:#00629b;color:#fff}.mat-mdc-button.mat-mdc-button-base.mat-primary-button:hover{background-color:#003e65}.mat-mdc-button.mat-mdc-button-base.mat-primary-button:active{background-color:#00629b}.mat-mdc-button.mat-mdc-button-base.mat-primary-button:disabled{background-color:#1c1b1f1f}.mat-mdc-button.mat-mdc-button-base.mat-secondary-button{color:#fff;background:#a7a8aa;box-shadow:0 1px 2px #0000004d,0 2px 6px 2px #00000026}.mat-mdc-button.mat-mdc-button-base.mat-secondary-button:hover{background:#a7a8aa}.mat-mdc-button.mat-mdc-button-base.mat-secondary-button:active{background:rgba(29,25,43,.12)}.mat-mdc-button.mat-mdc-button-base.mat-secondary-button:disabled{background:rgba(28,27,31,.12);color:#1c1b1f;opacity:.38}.ieeesa-text-button{color:#cac4d0;background:none;border:none}.flex-align-center{display:flex;align-items:center;justify-content:center}.mat-button-toggle-checked{background-color:#a7a8aa}.mat-button-toggle-checked .mat-button-toggle-label-content:before{font-family:\"Font Awesome 5 Free\";font-weight:900;content:\"\\f00c\";padding-right:.5625em}.mat-button-toggle-group .mat-button-toggle-label-content{font-family:Calibri Regular;font-style:normal;font-weight:700;font-size:1em;line-height:20px;color:#1c1b1f;letter-spacing:.00625em}@media (max-width: 768px){.mat-button-toggle-group .mat-button-toggle-label-content{max-width:8ch;text-overflow:ellipsis;white-space:nowrap;overflow:hidden;position:relative}}.cdk-overlay-pane{width:100%;min-width:312px}.ieeesa-text-area-field__label-left{display:flex}.ieeesa-text-area-field__label-top{display:block}.ieeesa-text-area-field__content{min-width:444px;min-height:40px;width:auto;height:auto;border:none;padding-left:14px;border-radius:4px 4px 0 0}.ieeesa-text-area-field__no-resize{resize:none}.ieeesa-text-area-field__resize{resize:auto}.ieeesa-text-area-field .mat-mdc-form-field{width:-webkit-fill-available}\n"] }]
+        }] });
+
+const components = {
+    [FormControlType.INPUT]: InputComponent,
+    [FormControlType.TEXT_AREA]: TextAreaComponent,
+    [FormControlType.SELECT]: SelectComponent,
+    [FormControlType.SEARCH]: SearchComponent,
+    [FormControlType.DATE]: DatePickerComponent,
+    [FormControlType.CHECKBOX]: CheckboxComponent,
+    [FormControlType.RADIO]: RadioComponent,
+    [FormControlType.AUTO_COMPLETE]: AutocompleteComponent,
+};
 /**
- * Provides implementation of date picker custom header and being used in date-picker component.
+ * Provides the implementation of DynamicFormFieldDirective which hosts and creates the form fields components dynamically.
  * @export
- * @class DatePickerHeaderComponent
+ * @class DynamicFormFieldDirective
+ * @implements {FormField}
  * @implements {OnInit}
  * @implements {OnDestroy}
  */
-class DatePickerHeaderComponent {
-    constructor(
-    // eslint-disable-next-line no-unused-vars
-    calendar, 
-    // eslint-disable-next-line no-unused-vars
-    dateAdapter, 
-    // eslint-disable-next-line no-unused-vars
-    dateFormats, 
-    // eslint-disable-next-line no-unused-vars
-    datepickerService // eslint-disable-next-line no-empty-function
-    ) {
-        this.calendar = calendar;
-        this.dateAdapter = dateAdapter;
-        this.dateFormats = dateFormats;
-        this.datepickerService = datepickerService;
-        this.destroy$ = new Subject();
-        this.arrowDirection = false;
-        this.isRangeSelection = false;
-        // eslint-disable-next-line @typescript-eslint/no-explicit-any
-        this.datePickerInfo = buttonActionsInfo;
-    }
+class DynamicFormFieldDirective {
     /**
-     * Implementation of ngOnInit lifecycle hook method to initialize components instance properties.
-     * @memberof DatePickerHeaderComponent
+     * Sets the form field configuration
+     * @memberof DynamicFormFieldDirective
      */
-    ngOnInit() {
-        this.isRangeSelection = this.datepickerService.getCalendarType();
-        const selectedRange = this.datepickerService.getSelectedRange();
-        if (selectedRange) {
-            this.setRange(selectedRange);
+    set config(value) {
+        this._config = value;
+        if (this.component) {
+            this.loadComponent();
         }
-        this.datepickerService.range$
-            ?.pipe(takeUntil(this.destroy$))
-            .subscribe((range) => {
-            this.setRange(range);
-        });
-        this.selectedDate = this.datepickerService.selectedDate
-            ? moment(this.datepickerService.selectedDate).format(DateFormats.display.daysFormat) +
-                ', ' +
-                moment(this.datepickerService.selectedDate).date() +
-                ' ' +
-                moment(this.datepickerService.selectedDate).format(DateFormats.display.fullMonthLabel)
-            : '';
+    }
+    get config() {
+        return this._config;
     }
     /**
-     * Sets the min and max date range.
-     * @param {({ start: Date | string; end: Date | string })} range
-     * @memberof DatePickerHeaderComponent
+     * Sets the form group
+     * @memberof DynamicFormFieldDirective
      */
-    setRange(range) {
-        this.range = {
-            start: moment(range.start).date() +
-                ' ' +
-                moment(range.start).format(DateFormats.display.fullMonthLabel),
-            end: moment(range.end).date() +
-                ' ' +
-                moment(range.end).format(DateFormats.display.fullMonthLabel),
-        };
+    set group(value) {
+        if (this.component?.instance) {
+            this.component.instance.group = value;
+        }
+        this._group = value;
+    }
+    get group() {
+        return this._group;
     }
     /**
-     * Implementation of getMonthLabel method to get the month label.
-     * @readonly
-     * @return {string}
-     * @memberof DatePickerHeaderComponent
+     * Sets the submit response of form submit event
+     * @memberof DynamicFormFieldDirective
      */
-    get getMonthLabel() {
-        if (this.dateAdapter?.format) {
-            return this.dateAdapter.format(this.calendar.activeDate, this.dateFormats.display.monthYearA11yLabel);
+    set submitResponse(value) {
+        if (this.component?.instance) {
+            this.component.instance.submitResponse = value;
         }
-        return '';
+        this._submitResponse = value;
+    }
+    // eslint-disable-next-line @typescript-eslint/no-explicit-any
+    get submitResponse() {
+        return this._submitResponse;
     }
     /**
-     * Sets previous month in a calendar on click of previous month arrow in date picker.
-     * @param {('month' | 'year')} mode
-     * @memberof DatePickerHeaderComponent
+     * Sets the form search response of form search apply.
+     * @memberof DynamicFormFieldDirective
      */
-    setPreviousMonth(mode) {
-        this.calendar.activeDate =
-            mode === 'month'
-                ? this.dateAdapter.addCalendarMonths(this.calendar.activeDate, -1)
-                : this.dateAdapter.addCalendarYears(this.calendar.activeDate, -1);
+    set searchResponse(value) {
+        if (this.component?.instance) {
+            this.component.instance.searchResponse = value;
+        }
+        this._searchResponse = value;
+    }
+    // eslint-disable-next-line @typescript-eslint/no-explicit-any
+    get searchResponse() {
+        return this._searchResponse;
+    }
+    // eslint-disable-next-line no-unused-vars, no-empty-function
+    constructor(container) {
+        this.container = container;
+        this.destroy$ = new Subject();
+        this.formSearchApply = new EventEmitter();
+        this.formDropdownSelected = new EventEmitter();
+        this.formDateSelected = new EventEmitter();
+        this.formSelectedDateRange = new EventEmitter();
+        this.formSelectSearch = new EventEmitter();
+        this.formAutoCompleteSearch = new EventEmitter();
+        this.autoCompleteOptionSelected = new EventEmitter();
     }
     /**
-     * Sets next month in a calendar on click of previous month arrow in date picker.
-     * @param {('month' | 'year')} mode
-     * @memberof DatePickerHeaderComponent
+     * Implementation of ngOnInit lifecycle hook method to call loadComponents method.
+     * @memberof DynamicFormFieldDirective
      */
-    setNextMonth(mode) {
-        this.calendar.activeDate =
-            mode === 'month'
-                ? this.dateAdapter.addCalendarMonths(this.calendar.activeDate, 1)
-                : this.dateAdapter.addCalendarYears(this.calendar.activeDate, 1);
+    ngOnInit() {
+        this.loadComponent();
     }
     /**
-     * Sets the calendar current view on the open of year drop down in date picker.
-     * @memberof DatePickerHeaderComponent
+     * Creates the component dynamically and initializes the instance properties of created component, also handles the created component events.
+     * @memberof DynamicFormFieldDirective
      */
-    setCalendarView() {
-        this.calendar.currentView =
-            this.calendar.currentView === 'month' ? 'multi-year' : 'month';
-        this.arrowDirection = !this.arrowDirection;
+    loadComponent() {
+        if (!components[this.config?.type]) {
+            const supportedTypes = Object.keys(components).join(', ');
+            throw new Error(`Trying to use an unsupported type (${this.config.type}).
+            Supported types: ${supportedTypes}`);
+        }
+        this.component = this.container.createComponent(components[this.config?.type]);
+        if (this.component?.instance) {
+            this.component.instance.config = this.config;
+            this.component.instance.group = this.group;
+            this.component.instance.submitResponse = this.submitResponse;
+            this.component.instance.searchResponse = this.searchResponse;
+            if (this.config.type === FormControlType.SEARCH) {
+                this.component.instance.searchValue
+                    ?.pipe(takeUntil(this.destroy$))
+                    ?.subscribe((event) => {
+                    this.formSearchApply.emit(event);
+                });
+            }
+            else if (this.config.type === FormControlType.SELECT) {
+                this.component.instance.optionSelected
+                    ?.pipe(takeUntil(this.destroy$))
+                    ?.subscribe((event) => {
+                    this.formDropdownSelected.emit(event);
+                });
+                this.component.instance.optionSearched
+                    ?.pipe(takeUntil(this.destroy$))
+                    ?.subscribe((event) => {
+                    this.formSelectSearch.emit({
+                        searchEvent: event,
+                        controlName: this.config.controlName,
+                    });
+                });
+            }
+            else if (this.config.type === FormControlType.DATE) {
+                this.component.instance.selectedDate
+                    ?.pipe(takeUntil(this.destroy$))
+                    ?.subscribe((event) => {
+                    this.formDateSelected.emit(event);
+                });
+                this.component.instance.selectedDateRange
+                    ?.pipe(takeUntil(this.destroy$))
+                    ?.subscribe((event) => {
+                    this.formSelectedDateRange.emit(event);
+                });
+            }
+            else if (this.config.type === FormControlType.AUTO_COMPLETE) {
+                this.component.instance.autoCompleteSearchValue
+                    ?.pipe(takeUntil(this.destroy$))
+                    ?.subscribe((event) => {
+                    this.formAutoCompleteSearch.emit(event);
+                });
+                this.component.instance.autoCompleteOptionSelected
+                    ?.pipe(takeUntil(this.destroy$))
+                    ?.subscribe((event) => {
+                    this.autoCompleteOptionSelected.emit(event);
+                });
+            }
+        }
     }
     /**
      * Implementation of ngOnDestroy lifecycle hook method to unsubscribe the open observable subscriptions.
-     * @memberof DatePickerHeaderComponent
+     * @memberof DynamicFormFieldDirective
      */
     ngOnDestroy() {
         this.destroy$.next(true);
         this.destroy$.unsubscribe();
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.3", ngImport: i0, type: DatePickerHeaderComponent, deps: [{ token: i7.MatCalendar }, { token: i2$1.DateAdapter }, { token: MAT_DATE_FORMATS }, { token: i2$2.DatepickerService }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.3", type: DatePickerHeaderComponent, isStandalone: true, selector: "ieeesa-date-picker-header", inputs: { group: "group" }, ngImport: i0, template: "<div class=\"ieeesa-datepicker-header--selected-date-container\">\r\n  <p class=\"ieeesa-label-lg-bold-16 ieeesa-datepicker-header__select-date-label\">\r\n    {{ datePickerInfo.datePicker.selectDateLabel }}\r\n  </p>\r\n  <p\r\n    class=\"headline-lg-34 ieeesa-datepicker-header__selected-date\"\r\n    *ngIf=\"range || isRangeSelection\"\r\n  >\r\n    {{ range.start }} - {{ range.end }}\r\n  </p>\r\n  <p\r\n    class=\"headline-lg-34 ieeesa-datepicker-header__selected-date\"\r\n    *ngIf=\"!isRangeSelection\"\r\n  >\r\n    {{ selectedDate }}\r\n  </p>\r\n</div>\r\n<div class=\"ieeesa-datepicker-header--content\">\r\n  <button\r\n    mat-button\r\n    type=\"button\"\r\n    class=\"ieeesa-datepicker-header--content--period-button ieeesa-label-lg-16\"\r\n    (click)=\"setCalendarView()\"\r\n    [attr.aria-label]=\"getMonthLabel\"\r\n    cdkAriaLive=\"polite\"\r\n  >\r\n    {{ getMonthLabel }}\r\n    <mat-icon\r\n      class=\"ieeesa-datepicker-header--content--period-button--arrow-icon\"\r\n      *ngIf=\"!arrowDirection\"\r\n      >arrow_drop_down</mat-icon\r\n    >\r\n    <mat-icon\r\n      class=\"ieeesa-datepicker-header--content--period-button--arrow-icon\"\r\n      *ngIf=\"arrowDirection\"\r\n      >arrow_drop_up</mat-icon\r\n    >\r\n  </button>\r\n  <button\r\n    mat-button\r\n    type=\"button\"\r\n    class=\"ieeesa-label-lg-16 ieeesa-datepicker-header--content--arrow-left-btn\"\r\n    [attr.aria-label]=\"datePickerInfo.ariaLabel.previousMonth\"\r\n    cdkAriaLive=\"polite\"\r\n  >\r\n    <mat-icon\r\n      (click)=\"setPreviousMonth('month')\"\r\n      class=\"ieeesa-datepicker-header__arrow-left\"\r\n      >keyboard_arrow_left</mat-icon\r\n    >\r\n  </button>\r\n  <button\r\n    mat-button\r\n    type=\"button\"\r\n    class=\"ieeesa-label-lg-16 ieeesa-datepicker-header--content--arrow-right-btn\"\r\n    [attr.aria-label]=\"datePickerInfo.ariaLabel.nextMonth\"\r\n    cdkAriaLive=\"polite\"\r\n  >\r\n    <mat-icon (click)=\"setNextMonth('month')\"> keyboard_arrow_right</mat-icon>\r\n  </button>\r\n</div>\r\n", styles: [".ieeesa-subtitle{text-align:left;font-family:Calibri Regular;font-size:1.56em;letter-spacing:0;color:#000;opacity:1}.ieeesa-body{text-align:left;font-family:Calibri Regular;font-size:1.25em;letter-spacing:0;color:#000;opacity:1}.ieeesa-display-lg-57{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:3.5625em;line-height:64px;color:#000;letter-spacing:0}.ieeesa-display-md-47{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:2.9375em;line-height:52px;color:#000;letter-spacing:0}.ieeesa-display-sm-38{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:2.375em;line-height:44px;color:#000;letter-spacing:0}.ieeesa-headline-lg-34{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:2.125em;line-height:40px;color:#000;letter-spacing:0}.ieeesa-headline-md-30{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1.875em;line-height:36px;color:#000;letter-spacing:0}.ieeesa-headline-sm-26{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1.625em;line-height:32px;color:#000;letter-spacing:0}.ieeesa-title-lg-bold-24{font-family:Calibri Regular;font-style:normal;font-weight:700;font-size:1.5em;line-height:28px;color:#000;letter-spacing:0}.ieeesa-title-lg-24{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1.5em;line-height:28px;color:#000;letter-spacing:0}.ieeesa-title-md-18{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1.125em;line-height:24px;color:#000;letter-spacing:.009375em}.ieeesa-title-sm-16{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1em;line-height:20px;color:#000;letter-spacing:.00625em}.ieeesa-label-lg-bold-16{font-family:Calibri Regular;font-style:normal;font-weight:700;font-size:1em;line-height:20px;color:#000;letter-spacing:.00625em}.ieeesa-label-lg-16{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1em;line-height:20px;color:#000;letter-spacing:.00625em}.ieeesa-label-md-14{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:.875em;line-height:16px;color:#000;letter-spacing:.03125em}.ieeesa-label-sm-13{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:.8125em;line-height:16px;color:#000;letter-spacing:.03125em}.ieeesa-body-lg-bold-18{font-family:Calibri Regular;font-style:normal;font-weight:700;font-size:1.125em;line-height:24px;color:#000;letter-spacing:.03125em}.ieeesa-body-lg-18{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1.125em;line-height:24px;color:#000;letter-spacing:.03125em}.ieeesa-body-md-16{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1em;line-height:20px;color:#000;letter-spacing:.015625em}.ieeesa-body-sm-14{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:.875em;line-height:16px;color:#000;letter-spacing:.025em}.ieeesa-title-inter-lg-bold-24{font-family:Inter Bold;font-style:normal;font-weight:700;font-size:1.5em;line-height:29px;color:#000;letter-spacing:0}.mat-mdc-button.mat-mdc-button-base.mat-primary-button,.mat-mdc-button.mat-mdc-button-base.mat-secondary-button{min-width:103px;width:auto;min-height:40px;height:auto;border-radius:3px;text-align:center;padding:.625em 1.5em;border:none;font-family:Calibri Regular;font-style:normal;font-weight:700;font-size:1em;line-height:20px;color:#000;letter-spacing:.00625em}.mat-mdc-button.mat-mdc-button-base>.mat-icon{margin-right:11px}.mat-mdc-button.mat-mdc-button-base.mat-primary-button{background-color:#00629b;color:#fff}.mat-mdc-button.mat-mdc-button-base.mat-primary-button:hover{background-color:#003e65}.mat-mdc-button.mat-mdc-button-base.mat-primary-button:active{background-color:#00629b}.mat-mdc-button.mat-mdc-button-base.mat-primary-button:disabled{background-color:#1c1b1f1f}.mat-mdc-button.mat-mdc-button-base.mat-secondary-button{color:#fff;background:#a7a8aa;box-shadow:0 1px 2px #0000004d,0 2px 6px 2px #00000026}.mat-mdc-button.mat-mdc-button-base.mat-secondary-button:hover{background:#a7a8aa}.mat-mdc-button.mat-mdc-button-base.mat-secondary-button:active{background:rgba(29,25,43,.12)}.mat-mdc-button.mat-mdc-button-base.mat-secondary-button:disabled{background:rgba(28,27,31,.12);color:#1c1b1f;opacity:.38}.ieeesa-text-button{color:#cac4d0;background:none;border:none}.flex-align-center{display:flex;align-items:center;justify-content:center}.mat-button-toggle-checked{background-color:#a7a8aa}.mat-button-toggle-checked .mat-button-toggle-label-content:before{font-family:\"Font Awesome 5 Free\";font-weight:900;content:\"\\f00c\";padding-right:.5625em}.mat-button-toggle-group .mat-button-toggle-label-content{font-family:Calibri Regular;font-style:normal;font-weight:700;font-size:1em;line-height:20px;color:#1c1b1f;letter-spacing:.00625em}@media (max-width: 768px){.mat-button-toggle-group .mat-button-toggle-label-content{max-width:8ch;text-overflow:ellipsis;white-space:nowrap;overflow:hidden;position:relative}}.cdk-overlay-pane{width:100%;min-width:312px}.ieeesa-datepicker-header--selected-date-container{padding:16px 27px 12px 24px;border-bottom:1px solid #cac4d0}.ieeesa-datepicker-header__selected-date{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:2.125em;line-height:40px;color:#1c1b1f;letter-spacing:0}.ieeesa-datepicker-header--content{display:flex;flex-direction:row;justify-content:space-between;align-items:center;width:100%;min-height:35px;border-top-right-radius:5px;border-top-left-radius:5px;padding:0 20px}.ieeesa-datepicker-header--content--period-button,.ieeesa-datepicker-header--content--arrow-left-btn,.ieeesa-datepicker-header--content--arrow-right-btn{margin:0;padding:0;border:unset;color:#49454f;background:linear-gradient(0deg,rgba(0,98,155,.11),rgba(0,98,155,.11)),#fffbfe}.ieeesa-datepicker-header--content--period-button--arrow-icon,.ieeesa-datepicker-header--content--arrow-left-btn--arrow-icon,.ieeesa-datepicker-header--content--arrow-right-btn--arrow-icon{position:relative;top:7px;color:#49454f}.ieeesa-datepicker-header__arrow-left{border:unset;color:#49454f;background:linear-gradient(0deg,rgba(0,98,155,.11),rgba(0,98,155,.11)),#fffbfe}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "ngmodule", type: MatDatepickerModule }, { kind: "ngmodule", type: MatFormFieldModule }, { kind: "ngmodule", type: MatNativeDateModule }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i5$2.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }] }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.3", ngImport: i0, type: DynamicFormFieldDirective, deps: [{ token: i0.ViewContainerRef }], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.1.3", type: DynamicFormFieldDirective, isStandalone: true, selector: "[ieeesaDynamicFormField]", inputs: { config: "config", group: "group", submitResponse: "submitResponse", searchResponse: "searchResponse" }, outputs: { formSearchApply: "formSearchApply", formDropdownSelected: "formDropdownSelected", formDateSelected: "formDateSelected", formSelectedDateRange: "formSelectedDateRange", formSelectSearch: "formSelectSearch", formAutoCompleteSearch: "formAutoCompleteSearch", autoCompleteOptionSelected: "autoCompleteOptionSelected" }, ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.3", ngImport: i0, type: DatePickerHeaderComponent, decorators: [{
-            type: Component,
-            args: [{ selector: 'ieeesa-date-picker-header', standalone: true, imports: [
-                        CommonModule,
-                        MatDatepickerModule,
-                        MatFormFieldModule,
-                        MatNativeDateModule,
-                        MatIconModule,
-                    ], template: "<div class=\"ieeesa-datepicker-header--selected-date-container\">\r\n  <p class=\"ieeesa-label-lg-bold-16 ieeesa-datepicker-header__select-date-label\">\r\n    {{ datePickerInfo.datePicker.selectDateLabel }}\r\n  </p>\r\n  <p\r\n    class=\"headline-lg-34 ieeesa-datepicker-header__selected-date\"\r\n    *ngIf=\"range || isRangeSelection\"\r\n  >\r\n    {{ range.start }} - {{ range.end }}\r\n  </p>\r\n  <p\r\n    class=\"headline-lg-34 ieeesa-datepicker-header__selected-date\"\r\n    *ngIf=\"!isRangeSelection\"\r\n  >\r\n    {{ selectedDate }}\r\n  </p>\r\n</div>\r\n<div class=\"ieeesa-datepicker-header--content\">\r\n  <button\r\n    mat-button\r\n    type=\"button\"\r\n    class=\"ieeesa-datepicker-header--content--period-button ieeesa-label-lg-16\"\r\n    (click)=\"setCalendarView()\"\r\n    [attr.aria-label]=\"getMonthLabel\"\r\n    cdkAriaLive=\"polite\"\r\n  >\r\n    {{ getMonthLabel }}\r\n    <mat-icon\r\n      class=\"ieeesa-datepicker-header--content--period-button--arrow-icon\"\r\n      *ngIf=\"!arrowDirection\"\r\n      >arrow_drop_down</mat-icon\r\n    >\r\n    <mat-icon\r\n      class=\"ieeesa-datepicker-header--content--period-button--arrow-icon\"\r\n      *ngIf=\"arrowDirection\"\r\n      >arrow_drop_up</mat-icon\r\n    >\r\n  </button>\r\n  <button\r\n    mat-button\r\n    type=\"button\"\r\n    class=\"ieeesa-label-lg-16 ieeesa-datepicker-header--content--arrow-left-btn\"\r\n    [attr.aria-label]=\"datePickerInfo.ariaLabel.previousMonth\"\r\n    cdkAriaLive=\"polite\"\r\n  >\r\n    <mat-icon\r\n      (click)=\"setPreviousMonth('month')\"\r\n      class=\"ieeesa-datepicker-header__arrow-left\"\r\n      >keyboard_arrow_left</mat-icon\r\n    >\r\n  </button>\r\n  <button\r\n    mat-button\r\n    type=\"button\"\r\n    class=\"ieeesa-label-lg-16 ieeesa-datepicker-header--content--arrow-right-btn\"\r\n    [attr.aria-label]=\"datePickerInfo.ariaLabel.nextMonth\"\r\n    cdkAriaLive=\"polite\"\r\n  >\r\n    <mat-icon (click)=\"setNextMonth('month')\"> keyboard_arrow_right</mat-icon>\r\n  </button>\r\n</div>\r\n", styles: [".ieeesa-subtitle{text-align:left;font-family:Calibri Regular;font-size:1.56em;letter-spacing:0;color:#000;opacity:1}.ieeesa-body{text-align:left;font-family:Calibri Regular;font-size:1.25em;letter-spacing:0;color:#000;opacity:1}.ieeesa-display-lg-57{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:3.5625em;line-height:64px;color:#000;letter-spacing:0}.ieeesa-display-md-47{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:2.9375em;line-height:52px;color:#000;letter-spacing:0}.ieeesa-display-sm-38{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:2.375em;line-height:44px;color:#000;letter-spacing:0}.ieeesa-headline-lg-34{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:2.125em;line-height:40px;color:#000;letter-spacing:0}.ieeesa-headline-md-30{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1.875em;line-height:36px;color:#000;letter-spacing:0}.ieeesa-headline-sm-26{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1.625em;line-height:32px;color:#000;letter-spacing:0}.ieeesa-title-lg-bold-24{font-family:Calibri Regular;font-style:normal;font-weight:700;font-size:1.5em;line-height:28px;color:#000;letter-spacing:0}.ieeesa-title-lg-24{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1.5em;line-height:28px;color:#000;letter-spacing:0}.ieeesa-title-md-18{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1.125em;line-height:24px;color:#000;letter-spacing:.009375em}.ieeesa-title-sm-16{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1em;line-height:20px;color:#000;letter-spacing:.00625em}.ieeesa-label-lg-bold-16{font-family:Calibri Regular;font-style:normal;font-weight:700;font-size:1em;line-height:20px;color:#000;letter-spacing:.00625em}.ieeesa-label-lg-16{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1em;line-height:20px;color:#000;letter-spacing:.00625em}.ieeesa-label-md-14{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:.875em;line-height:16px;color:#000;letter-spacing:.03125em}.ieeesa-label-sm-13{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:.8125em;line-height:16px;color:#000;letter-spacing:.03125em}.ieeesa-body-lg-bold-18{font-family:Calibri Regular;font-style:normal;font-weight:700;font-size:1.125em;line-height:24px;color:#000;letter-spacing:.03125em}.ieeesa-body-lg-18{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1.125em;line-height:24px;color:#000;letter-spacing:.03125em}.ieeesa-body-md-16{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1em;line-height:20px;color:#000;letter-spacing:.015625em}.ieeesa-body-sm-14{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:.875em;line-height:16px;color:#000;letter-spacing:.025em}.ieeesa-title-inter-lg-bold-24{font-family:Inter Bold;font-style:normal;font-weight:700;font-size:1.5em;line-height:29px;color:#000;letter-spacing:0}.mat-mdc-button.mat-mdc-button-base.mat-primary-button,.mat-mdc-button.mat-mdc-button-base.mat-secondary-button{min-width:103px;width:auto;min-height:40px;height:auto;border-radius:3px;text-align:center;padding:.625em 1.5em;border:none;font-family:Calibri Regular;font-style:normal;font-weight:700;font-size:1em;line-height:20px;color:#000;letter-spacing:.00625em}.mat-mdc-button.mat-mdc-button-base>.mat-icon{margin-right:11px}.mat-mdc-button.mat-mdc-button-base.mat-primary-button{background-color:#00629b;color:#fff}.mat-mdc-button.mat-mdc-button-base.mat-primary-button:hover{background-color:#003e65}.mat-mdc-button.mat-mdc-button-base.mat-primary-button:active{background-color:#00629b}.mat-mdc-button.mat-mdc-button-base.mat-primary-button:disabled{background-color:#1c1b1f1f}.mat-mdc-button.mat-mdc-button-base.mat-secondary-button{color:#fff;background:#a7a8aa;box-shadow:0 1px 2px #0000004d,0 2px 6px 2px #00000026}.mat-mdc-button.mat-mdc-button-base.mat-secondary-button:hover{background:#a7a8aa}.mat-mdc-button.mat-mdc-button-base.mat-secondary-button:active{background:rgba(29,25,43,.12)}.mat-mdc-button.mat-mdc-button-base.mat-secondary-button:disabled{background:rgba(28,27,31,.12);color:#1c1b1f;opacity:.38}.ieeesa-text-button{color:#cac4d0;background:none;border:none}.flex-align-center{display:flex;align-items:center;justify-content:center}.mat-button-toggle-checked{background-color:#a7a8aa}.mat-button-toggle-checked .mat-button-toggle-label-content:before{font-family:\"Font Awesome 5 Free\";font-weight:900;content:\"\\f00c\";padding-right:.5625em}.mat-button-toggle-group .mat-button-toggle-label-content{font-family:Calibri Regular;font-style:normal;font-weight:700;font-size:1em;line-height:20px;color:#1c1b1f;letter-spacing:.00625em}@media (max-width: 768px){.mat-button-toggle-group .mat-button-toggle-label-content{max-width:8ch;text-overflow:ellipsis;white-space:nowrap;overflow:hidden;position:relative}}.cdk-overlay-pane{width:100%;min-width:312px}.ieeesa-datepicker-header--selected-date-container{padding:16px 27px 12px 24px;border-bottom:1px solid #cac4d0}.ieeesa-datepicker-header__selected-date{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:2.125em;line-height:40px;color:#1c1b1f;letter-spacing:0}.ieeesa-datepicker-header--content{display:flex;flex-direction:row;justify-content:space-between;align-items:center;width:100%;min-height:35px;border-top-right-radius:5px;border-top-left-radius:5px;padding:0 20px}.ieeesa-datepicker-header--content--period-button,.ieeesa-datepicker-header--content--arrow-left-btn,.ieeesa-datepicker-header--content--arrow-right-btn{margin:0;padding:0;border:unset;color:#49454f;background:linear-gradient(0deg,rgba(0,98,155,.11),rgba(0,98,155,.11)),#fffbfe}.ieeesa-datepicker-header--content--period-button--arrow-icon,.ieeesa-datepicker-header--content--arrow-left-btn--arrow-icon,.ieeesa-datepicker-header--content--arrow-right-btn--arrow-icon{position:relative;top:7px;color:#49454f}.ieeesa-datepicker-header__arrow-left{border:unset;color:#49454f;background:linear-gradient(0deg,rgba(0,98,155,.11),rgba(0,98,155,.11)),#fffbfe}\n"] }]
-        }], ctorParameters: function () { return [{ type: i7.MatCalendar }, { type: i2$1.DateAdapter }, { type: undefined, decorators: [{
-                    type: Inject,
-                    args: [MAT_DATE_FORMATS]
-                }] }, { type: i2$2.DatepickerService }]; }, propDecorators: { group: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.3", ngImport: i0, type: DynamicFormFieldDirective, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: '[ieeesaDynamicFormField]',
+                    standalone: true,
+                }]
+        }], ctorParameters: function () { return [{ type: i0.ViewContainerRef }]; }, propDecorators: { config: [{
+                type: Input
+            }], group: [{
                 type: Input
+            }], submitResponse: [{
+                type: Input
+            }], searchResponse: [{
+                type: Input
+            }], formSearchApply: [{
+                type: Output
+            }], formDropdownSelected: [{
+                type: Output
+            }], formDateSelected: [{
+                type: Output
+            }], formSelectedDateRange: [{
+                type: Output
+            }], formSelectSearch: [{
+                type: Output
+            }], formAutoCompleteSearch: [{
+                type: Output
+            }], autoCompleteOptionSelected: [{
+                type: Output
             }] } });
 
 /**
- * Component implementation supports select type of form filed and select type is configurable to support single selection or multi-selection with multilevel or single level.
+ * Creates a reactive form dynamically based on the passed form field configuration and handles the form events.
  * @export
- * @class SelectComponent
+ * @class DynamicFormComponent
  * @implements {OnInit}
- * @implements {AfterViewInit}
- * @implements {OnDestroy}
+ * @implements {AfterContentInit}
  */
-class SelectComponent {
+class DynamicFormComponent {
     /**
-     * Takes isSortNeeded as input to check if the passed options are sorted or not.
-     * @memberof SelectComponent
+     * FormGroups passed an an input and which contains configuration information of every form fields.
+     * @memberof DynamicFormComponent
      */
-    set isSortNeeded(value) {
-        this._isSortNeeded = value;
+    set formGroups(value) {
+        this._formGroups = value;
+        this.createFormGroupArray();
     }
-    get isSortNeeded() {
-        return this._isSortNeeded;
+    get formGroups() {
+        return this._formGroups;
     }
     /**
-     * Sets the dropdown options for selection.
-     * @memberof SelectComponent
+     * Sets submit response on form submit
+     * @memberof DynamicFormComponent
      */
-    set dropdownOptions(value) {
-        this._dropdownOptions = value;
+    set submitResponse(value) {
+        this._submitResponse = value;
     }
-    get dropdownOptions() {
-        return this._dropdownOptions;
+    // eslint-disable-next-line @typescript-eslint/no-explicit-any
+    get submitResponse() {
+        return this._submitResponse;
     }
     /**
-     * Sets the selected option
-     * @memberof SelectComponent
+     * Sets search response on form search event
+     * @memberof DynamicFormComponent
      */
-    set selectedOptions(value) {
-        if (Array.isArray(value)) {
-            this._selectedOptions = this.arraySorting(value);
-        }
-        else {
-            this._selectedOptions = value;
-        }
+    set searchResponse(value) {
+        this._searchResponse = value;
     }
-    get selectedOptions() {
-        return this._selectedOptions;
+    // eslint-disable-next-line @typescript-eslint/no-explicit-any
+    get searchResponse() {
+        return this._searchResponse;
     }
-    constructor(
-    // eslint-disable-next-line no-unused-vars
-    formUtilityService // eslint-disable-next-line no-empty-function
-    ) {
-        this.formUtilityService = formUtilityService;
-        this.arrowDirection = false;
-        this.searchType = SearchType$1.AUTO;
+    // eslint-disable-next-line no-unused-vars, no-empty-function
+    constructor(fb) {
+        this.fb = fb;
+        this.isSubmitButtonDisabled = false;
+        this.isLeftButtonDisabled = false;
+        this.isLeftButtonNeeded = false;
         // eslint-disable-next-line @typescript-eslint/no-explicit-any
-        this.dropdownInfo = buttonActionsInfo;
-        this._isSortNeeded = true;
-        this.formControlName = 'select';
-        this.isMultiLevel = false;
-        this.isLabelAlignedLeft = false;
-        this.selectLabel = '';
-        this.isMultiSelect = false;
-        this.isDisabled = false;
-        this.isSearch = false;
-        this.placeholderText = this.dropdownInfo.dropdown.placeholderText;
-        this.optionSelected = new EventEmitter();
-        this.optionSearched = new EventEmitter();
+        this.formSubmit = new EventEmitter();
+        // eslint-disable-next-line @typescript-eslint/no-explicit-any
+        this.formChange = new EventEmitter();
+        // eslint-disable-next-line @typescript-eslint/no-explicit-any
+        this.formInput = new EventEmitter();
+        // eslint-disable-next-line @typescript-eslint/no-explicit-any
+        this.formLeftButtonClicked = new EventEmitter();
+        // eslint-disable-next-line @typescript-eslint/no-explicit-any
+        this.formSearchApply = new EventEmitter();
+        this.formGroupsReference = new EventEmitter();
+        // eslint-disable-next-line @typescript-eslint/no-explicit-any
+        this.dropdownChange = new EventEmitter();
+        this.formDateSelected = new EventEmitter();
+        this.formSelectSearch = new EventEmitter();
+        this.formControlChange = new EventEmitter();
+        this.formAutoCompleteSearch = new EventEmitter();
+        this.autoCompleteOptionSelected = new EventEmitter();
+        this.formAfterContentInit = new EventEmitter();
+        this.formSelectedDateRange = new EventEmitter();
+        this.formGroupArray = [];
+        // eslint-disable-next-line @typescript-eslint/no-explicit-any
+        this.formControlArray = [];
+        this.legendsArray = [];
     }
     /**
-     * Initializes components instance properties from config if its defined otherwise creates form group and config.
-     * @memberof SelectComponent
+     * Implementation of ngOnInit lifecycle hook method to create form group
+     * @memberof DynamicFormComponent
      */
     ngOnInit() {
-        this.updateArrowDirection(false);
-        this.group =
-            this.group ?? this.formUtilityService.getFormGroup(this.formControlName);
-        this.config =
-            this.config ??
-                this.formUtilityService.getFormFieldConfig(this.formControlName, FormControlType$1.SELECT);
-        if (this.config) {
-            this.isMultiSelect = this.config.isMultiSelect ?? false;
-            this.dropdownOptions =
-                this.config?.dropdownOptions ?? this.dropdownOptions;
-            this.selectedOptions = this.config?.value;
-            this.selectLabel = this.config?.label ?? '';
-            this.placeholderText = this.config?.placeholder ?? this.placeholderText;
-            this.isMultiSelect = this.config?.isMultiSelect ?? this.isMultiSelect;
-            this.isDisabled = this.config?.disabled ?? this.isDisabled;
-            this.searchType = this.config?.searchType ?? this.searchType;
-            this.isSortNeeded = this.config?.isSortNeeded ?? this.isSortNeeded;
+        this.createFormGroupArray();
+    }
+    /**
+     * Emit generated form reference on ngAfterContentInit lifecycle hook.
+     * @memberof DynamicFormComponent
+     */
+    ngAfterContentInit() {
+        this.formAfterContentInit.emit(this.formGroupArray);
+    }
+    /**
+     * Creates form group on the basis of formGroups configuration input
+     * @return {void}
+     * @memberof DynamicFormComponent
+     */
+    createFormGroupArray() {
+        this.formGroupArray = [];
+        this.formControlArray = [];
+        this.legendsArray = [];
+        if (!this.formGroups) {
+            return;
         }
+        this.formGroups?.formGroup?.forEach((element) => {
+            const controls = element.controls.filter((control) => control.type !== 'button');
+            this.formGroupArray.push(this.createGroup(controls));
+            this.formControlArray.push(controls);
+            this.legendsArray.push(element.legend);
+        });
+        this.form = this.fb.group({
+            children: this.formGroupArray,
+        });
+        this.formGroupsReference.emit(this.formGroupArray);
     }
     /**
-     * Emits selected option on changes the selected option.
-     * @param {SelectOption} event
-     * @memberof SelectComponent
+     * Creates form group using form builder
+     * @param {any[]} controls
+     * @return {FormGroup}
+     * @memberof DynamicFormComponent
      */
-    onChange(event) {
-        this.optionSelected.emit(event);
+    // eslint-disable-next-line @typescript-eslint/no-explicit-any
+    createGroup(controls) {
+        const group = this.fb.group({});
+        controls.forEach((control) => group.addControl(control.controlName, this.createControl(control)));
+        return group;
     }
     /**
-     * Sets the select dropdown arrow direction
-     * @param {boolean} opened
-     * @memberof SelectComponent
+     * Creates form control based on form field configuration
+     * @param {FieldConfig} control
+     * @return {FormControl}
+     * @memberof DynamicFormComponent
      */
-    updateArrowDirection(opened) {
-        this.arrowDirection = opened;
+    createControl(control) {
+        const { disabled, validation, value } = control;
+        return this.fb.control({ disabled, value }, validation);
     }
     /**
-     * Takes the index and the current option as arguments and needs to return the unique identifier for this option.
+     * Emits formGroupArray
+     * @memberof DynamicFormComponent
+     */
+    onFormSubmit() {
+        this.formSubmit.emit(this.formGroupArray);
+    }
+    /**
+     * Emits formGroupArray
+     * @memberof DynamicFormComponent
+     */
+    onLeftButtonClicked() {
+        this.formLeftButtonClicked.emit(this.formGroupArray);
+    }
+    /**
+     * Emits formGroupArray
+     * @memberof DynamicFormComponent
+     */
+    onFormChange() {
+        this.formChange.emit(this.formGroupArray);
+    }
+    /**
+     * Handles form field select type drop down selection event
+     * @memberof DynamicFormComponent
+     */
+    onDropdownChange() {
+        this.dropdownChange.emit(this.formGroupArray);
+    }
+    /**
+     * Handles form input change event
+     * @param {Event} event
+     * @memberof DynamicFormComponent
+     */
+    formInputChange(event) {
+        this.formControlChange.emit(event);
+        this.formInput.emit(this.formGroupArray);
+    }
+    /**
+     * Handles form field search apply event
+     * @param {Event} event
+     * @memberof DynamicFormComponent
+     */
+    onSearchApply(event) {
+        this.formSearchApply.emit(event);
+    }
+    /**
+     * Handles search event inside form field select
+     * @param {Event} event
+     * @memberof DynamicFormComponent
+     */
+    onSelectSearch(event) {
+        this.formSelectSearch.emit(event);
+    }
+    /**
+     * Takes the index and the formGroup as arguments and needs to return the unique identifier for this formGroup.
      * @param {number} index
-     * @param {SelectOption} option
-     * @return {(number | string)}
-     * @memberof SelectComponent
+     * @param {FormGroup} formGroup
+     * @memberof DynamicFormComponent
      */
-    trackByFn(index, option) {
-        return option.id;
+    trackByFormGroup(index, formGroup) {
+        return formGroup.controls;
     }
     /**
-     * Emits searched options on filtering options in select dropdown
-     * @param {string} searchText
-     * @memberof SelectComponent
+     * Handles form date selection event
+     * @param {string[]} event
+     * @memberof DynamicFormComponent
      */
-    onOptionSearch(searchText) {
-        this.optionSearched.emit(searchText);
+    onDateSelected(event) {
+        this.formDateSelected.emit(event);
     }
     /**
-     * Compares the two passed options
-     * @param {any} option1
-     * @param {any} option2
-     * @return {boolean}
-     * @memberof SelectComponent
+     * Emits selected form date range
+     * @param {{startDate: string, endDate: string}} dateRange
+     * @memberof DynamicFormComponent
      */
-    // eslint-disable-next-line @typescript-eslint/no-explicit-any
-    comparer(option1, option2) {
-        return option1 && option2 ? option1.id === option2.id : option1 === option2;
+    onSelectedDateRange(dateRange) {
+        this.formSelectedDateRange.emit(dateRange);
     }
     /**
-     * Sorts the options
-     * @memberof SelectComponent
+     * Handles form field auto complete search event
+     * @param {Event} event
+     * @memberof DynamicFormComponent
      */
-    ngAfterViewInit() {
-        if (this.isSortNeeded && Array.isArray(this.dropdownOptions)) {
-            this.dropdownOptions = this.arraySorting(this.dropdownOptions);
-        }
+    onAutoCompleteSearch(event) {
+        this.formAutoCompleteSearch.emit(event);
     }
     /**
-     * Sorts the options by using arraySorting method
-     * @memberof SelectComponent
+     * Handles form field auto complete option selection event
+     * @memberof DynamicFormComponent
      */
-    sortOptions() {
-        if (this.isSortNeeded && Array.isArray(this.dropdownOptions)) {
-            this.sortedOptions = this.arraySorting(this.dropdownOptions);
-        }
-        else {
-            this.sortedOptions = this.dropdownOptions;
-        }
+    onAutoCompleteOptionSelected() {
+        this.autoCompleteOptionSelected.emit(this.formGroupArray);
     }
     /**
-     * Utility method to sort dropdown options in ascending order.
-     * @param {SelectOption[]} list
-     * @return {SelectOption[]}
-     * @memberof SelectComponent
+     * Converts passed control name in hyphenated css class name
+     * @param {string} className
+     * @return {string}
+     * @memberof DynamicFormComponent
      */
-    arraySorting(list) {
-        const clonedValue = [...list];
-        const sort = clonedValue.sort((a, b) => {
-            if (a.name.toLowerCase() === b.name.toLowerCase())
-                return 0;
-            if (a.name.toLowerCase() === 'all')
-                return -1;
-            if (b.name.toLowerCase() === 'all')
-                return 1;
-            if (a.name.toLowerCase() < b.name.toLowerCase())
-                return -1;
-            if (a.name.toLowerCase() > b.name.toLowerCase())
-                return 1;
-            return 0;
-        });
-        return sort;
+    getRowClassName(className) {
+        return className
+            .replace(/([A-Z])/g, ' $1')
+            .toLowerCase()
+            .split(' ')
+            .join('-');
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.3", ngImport: i0, type: SelectComponent, deps: [{ token: i1.FormUtilityService }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.3", type: SelectComponent, isStandalone: true, selector: "ieeesa-select", inputs: { isSortNeeded: "isSortNeeded", dropdownOptions: "dropdownOptions", selectedOptions: "selectedOptions", formControlName: "formControlName", isMultiLevel: "isMultiLevel", isLabelAlignedLeft: "isLabelAlignedLeft", selectLabel: "selectLabel", isMultiSelect: "isMultiSelect", isDisabled: "isDisabled", isSearch: "isSearch", placeholderText: "placeholderText" }, outputs: { optionSelected: "optionSelected", optionSearched: "optionSearched" }, providers: [
-            {
-                provide: MAT_SELECT_CONFIG,
-                useValue: { overlayPanelClass: 'ieeesa-select-overlay-pane' },
-            },
-        ], viewQueries: [{ propertyName: "formFields", predicate: SearchComponent$1, descendants: true }], ngImport: i0, template: "<div\r\n  [formGroup]=\"group\"\r\n  class=\"ieeesa-select-field\"\r\n  *ngIf=\"group\"\r\n  [ngClass]=\"\r\n    isLabelAlignedLeft\r\n      ? 'ieeesa-select-field__label-left'\r\n      : 'ieeesa-select-field__label-top'\r\n  \"\r\n>\r\n  <mat-label class=\"ieeesa-select-field__label\">{{ selectLabel }}</mat-label>\r\n  <mat-form-field\r\n    [ngClass]=\"\r\n      arrowDirection\r\n        ? 'ieeesa-select-field__arrow-up'\r\n        : 'ieeesa-select-field__arrow-down'\r\n    \"\r\n  >\r\n    <mat-select\r\n      disableOptionCentering\r\n      *ngIf=\"isMultiSelect\"\r\n      (openedChange)=\"updateArrowDirection($event)\"\r\n      (selectionChange)=\"onChange($event.value)\"\r\n      [formControlName]=\"config.controlName\"\r\n      [multiple]=\"isMultiSelect\"\r\n      [disabled]=\"isDisabled\"\r\n      [placeholder]=\"placeholderText\"\r\n      [compareWith]=\"comparer\"\r\n    >\r\n      <ieeesa-search\r\n        *ngIf=\"isSearch\"\r\n        [searchType]=\"searchType\"\r\n        (searchValue)=\"onOptionSearch($event)\"\r\n      ></ieeesa-search>\r\n      <ng-container\r\n        *ngIf=\"!isMultiLevel\"\r\n        [ngTemplateOutlet]=\"dropdownOptionsTemplateRef\"\r\n        [ngTemplateOutletContext]=\"{ data: dropdownOptions }\"\r\n      >\r\n      </ng-container>\r\n      <ng-container *ngIf=\"isMultiLevel\">\r\n        <mat-optgroup\r\n          *ngFor=\"let option of dropdownOptions; trackBy: trackByFn\"\r\n          [label]=\"option.name\"\r\n        >\r\n          <ng-container\r\n            [ngTemplateOutlet]=\"dropdownOptionsTemplateRef\"\r\n            [ngTemplateOutletContext]=\"{ data: option.option_groups }\"\r\n          >\r\n          </ng-container>\r\n        </mat-optgroup>\r\n      </ng-container>\r\n      <ng-template #dropdownOptionsTemplateRef let-options=\"data\">\r\n        <mat-option\r\n          *ngFor=\"let option of options; trackBy: trackByFn\"\r\n          [value]=\"option\"\r\n        >\r\n          {{ option.name }}\r\n        </mat-option>\r\n      </ng-template>\r\n    </mat-select>\r\n\r\n    <mat-select\r\n      disableOptionCentering\r\n      *ngIf=\"!isMultiSelect\"\r\n      [multiple]=\"isMultiSelect\"\r\n      (openedChange)=\"updateArrowDirection($event)\"\r\n      (selectionChange)=\"onChange($event.value)\"\r\n      [formControlName]=\"config.controlName\"\r\n      [disabled]=\"isDisabled\"\r\n      [placeholder]=\"placeholderText\"\r\n    >\r\n      <ieeesa-search\r\n        *ngIf=\"isSearch\"\r\n        [searchType]=\"searchType\"\r\n        (searchValue)=\"onOptionSearch($event)\"\r\n      ></ieeesa-search>\r\n      <ng-container\r\n        *ngIf=\"!isMultiLevel\"\r\n        [ngTemplateOutlet]=\"dropdownOptionsTemplateRef\"\r\n        [ngTemplateOutletContext]=\"{ data: dropdownOptions }\"\r\n      >\r\n      </ng-container>\r\n      <ng-container *ngIf=\"isMultiLevel\">\r\n        <mat-optgroup\r\n          *ngFor=\"let option of dropdownOptions; trackBy: trackByFn\"\r\n          [label]=\"option.name\"\r\n        >\r\n          <ng-container\r\n            [ngTemplateOutlet]=\"dropdownOptionsTemplateRef\"\r\n            [ngTemplateOutletContext]=\"{ data: option.option_groups }\"\r\n          >\r\n          </ng-container>\r\n        </mat-optgroup>\r\n      </ng-container>\r\n      <ng-template #dropdownOptionsTemplateRef let-options=\"data\">\r\n        <mat-option\r\n          *ngFor=\"let option of options; trackBy: trackByFn\"\r\n          [value]=\"option\"\r\n        >\r\n          {{ option.name }}\r\n        </mat-option>\r\n      </ng-template>\r\n    </mat-select>\r\n  </mat-form-field>\r\n  <ieeesa-form-error [formGroup]=\"group\" [config]=\"config\"> </ieeesa-form-error>\r\n</div>\r\n", styles: [".ieeesa-subtitle{text-align:left;font-family:Calibri Regular;font-size:1.56em;letter-spacing:0;color:#000;opacity:1}.ieeesa-body{text-align:left;font-family:Calibri Regular;font-size:1.25em;letter-spacing:0;color:#000;opacity:1}.ieeesa-display-lg-57{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:3.5625em;line-height:64px;color:#000;letter-spacing:0}.ieeesa-display-md-47{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:2.9375em;line-height:52px;color:#000;letter-spacing:0}.ieeesa-display-sm-38{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:2.375em;line-height:44px;color:#000;letter-spacing:0}.ieeesa-headline-lg-34{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:2.125em;line-height:40px;color:#000;letter-spacing:0}.ieeesa-headline-md-30{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1.875em;line-height:36px;color:#000;letter-spacing:0}.ieeesa-headline-sm-26{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1.625em;line-height:32px;color:#000;letter-spacing:0}.ieeesa-title-lg-bold-24{font-family:Calibri Regular;font-style:normal;font-weight:700;font-size:1.5em;line-height:28px;color:#000;letter-spacing:0}.ieeesa-title-lg-24{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1.5em;line-height:28px;color:#000;letter-spacing:0}.ieeesa-title-md-18{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1.125em;line-height:24px;color:#000;letter-spacing:.009375em}.ieeesa-title-sm-16{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1em;line-height:20px;color:#000;letter-spacing:.00625em}.ieeesa-label-lg-bold-16{font-family:Calibri Regular;font-style:normal;font-weight:700;font-size:1em;line-height:20px;color:#000;letter-spacing:.00625em}.ieeesa-label-lg-16{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1em;line-height:20px;color:#000;letter-spacing:.00625em}.ieeesa-label-md-14{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:.875em;line-height:16px;color:#000;letter-spacing:.03125em}.ieeesa-label-sm-13{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:.8125em;line-height:16px;color:#000;letter-spacing:.03125em}.ieeesa-body-lg-bold-18{font-family:Calibri Regular;font-style:normal;font-weight:700;font-size:1.125em;line-height:24px;color:#000;letter-spacing:.03125em}.ieeesa-body-lg-18{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1.125em;line-height:24px;color:#000;letter-spacing:.03125em}.ieeesa-body-md-16{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1em;line-height:20px;color:#000;letter-spacing:.015625em}.ieeesa-body-sm-14{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:.875em;line-height:16px;color:#000;letter-spacing:.025em}.ieeesa-title-inter-lg-bold-24{font-family:Inter Bold;font-style:normal;font-weight:700;font-size:1.5em;line-height:29px;color:#000;letter-spacing:0}.mat-mdc-button.mat-mdc-button-base.mat-primary-button,.mat-mdc-button.mat-mdc-button-base.mat-secondary-button{min-width:103px;width:auto;min-height:40px;height:auto;border-radius:3px;text-align:center;padding:.625em 1.5em;border:none;font-family:Calibri Regular;font-style:normal;font-weight:700;font-size:1em;line-height:20px;color:#000;letter-spacing:.00625em}.mat-mdc-button.mat-mdc-button-base>.mat-icon{margin-right:11px}.mat-mdc-button.mat-mdc-button-base.mat-primary-button{background-color:#00629b;color:#fff}.mat-mdc-button.mat-mdc-button-base.mat-primary-button:hover{background-color:#003e65}.mat-mdc-button.mat-mdc-button-base.mat-primary-button:active{background-color:#00629b}.mat-mdc-button.mat-mdc-button-base.mat-primary-button:disabled{background-color:#1c1b1f1f}.mat-mdc-button.mat-mdc-button-base.mat-secondary-button{color:#fff;background:#a7a8aa;box-shadow:0 1px 2px #0000004d,0 2px 6px 2px #00000026}.mat-mdc-button.mat-mdc-button-base.mat-secondary-button:hover{background:#a7a8aa}.mat-mdc-button.mat-mdc-button-base.mat-secondary-button:active{background:rgba(29,25,43,.12)}.mat-mdc-button.mat-mdc-button-base.mat-secondary-button:disabled{background:rgba(28,27,31,.12);color:#1c1b1f;opacity:.38}.ieeesa-text-button{color:#cac4d0;background:none;border:none}.flex-align-center{display:flex;align-items:center;justify-content:center}.mat-button-toggle-checked{background-color:#a7a8aa}.mat-button-toggle-checked .mat-button-toggle-label-content:before{font-family:\"Font Awesome 5 Free\";font-weight:900;content:\"\\f00c\";padding-right:.5625em}.mat-button-toggle-group .mat-button-toggle-label-content{font-family:Calibri Regular;font-style:normal;font-weight:700;font-size:1em;line-height:20px;color:#1c1b1f;letter-spacing:.00625em}@media (max-width: 768px){.mat-button-toggle-group .mat-button-toggle-label-content{max-width:8ch;text-overflow:ellipsis;white-space:nowrap;overflow:hidden;position:relative}}.cdk-overlay-pane{width:100%;min-width:312px}.ieeesa-select-field .mat-mdc-form-field{width:-webkit-fill-available}.ieeesa-select-field__arrow-up .mat-mdc-select-arrow{border:solid #595758;border-width:0 2px 2px 0;display:inline-block;padding:4px;margin:0 10px;transform:rotate(-135deg);-webkit-transform:rotate(-135deg)}.ieeesa-select-field__arrow-up .mat-mdc-select-arrow svg{display:none}.ieeesa-select-field__arrow-down .mat-mdc-select-arrow{border:solid #595758;border-width:0 2px 2px 0;display:inline-block;padding:4px;margin:0 10px;transform:rotate(45deg);-webkit-transform:rotate(45deg)}.ieeesa-select-field__arrow-down .mat-mdc-select-arrow svg{display:none}.ieeesa-select-field__label-left{display:flex}.ieeesa-select-field__label-top{display:block}.ieeesa-select-field .mdc-text-field--filled .mdc-line-ripple:after{border-bottom-color:#918f90!important}.ieeesa-select-field .mdc-text-field--filled .mdc-line-ripple:before{border-bottom-color:#918f90!important}.ieeesa-select-field .mdc-line-ripple--active:after{opacity:0}.ieeesa-select-field .mat-mdc-select-placeholder{font-size:1em;font-weight:400;color:#000}.ieeesa-select-field .mdc-text-field--filled:not(.mdc-text-field--disabled){background-color:#fffbfe}.ieeesa-select-field .mdc-text-field--focused,.ieeesa-select-field .mat-mdc-form-field-focus-overlay,.ieeesa-select-overlay-pane .mat-mdc-select-panel{background-color:#fffbfe}.ieeesa-select-overlay-pane .mdc-list-item__primary-text{color:#000}.ieeesa-select-overlay-pane .mat-mdc-option .mat-pseudo-checkbox-minimal{margin-left:0;float:right}.ieeesa-select-overlay-pane .mat-primary .mat-pseudo-checkbox-checked.mat-pseudo-checkbox-minimal:after{display:none}.ieeesa-select-overlay-pane .ieeesa-search-field .mat-mdc-form-field-infix{width:100%}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: SearchComponent$1, selector: "ieeesa-search", inputs: ["formControlName", "placeholderLabel", "searchType", "searchTerm"], outputs: ["searchValue"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i3.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i3.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "component", type: FormErrorComponent$1, selector: "ieeesa-form-error", inputs: ["formGroup", "config", "submitResponse"] }, { kind: "ngmodule", type: MatFormFieldModule }, { kind: "component", type: i4.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i4.MatLabel, selector: "mat-label" }, { kind: "ngmodule", type: MatInputModule }, { kind: "ngmodule", type: MatIconModule }, { kind: "ngmodule", type: MatSelectModule }, { kind: "component", type: i5$3.MatSelect, selector: "mat-select", inputs: ["disabled", "disableRipple", "tabIndex", "panelWidth", "hideSingleSelectionIndicator"], exportAs: ["matSelect"] }, { kind: "component", type: i2$1.MatOption, selector: "mat-option", exportAs: ["matOption"] }, { kind: "component", type: i2$1.MatOptgroup, selector: "mat-optgroup", inputs: ["disabled"], exportAs: ["matOptgroup"] }], encapsulation: i0.ViewEncapsulation.None }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.3", ngImport: i0, type: DynamicFormComponent, deps: [{ token: i3.FormBuilder }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.3", type: DynamicFormComponent, isStandalone: true, selector: "ieeesa-dynamic-form", inputs: { formGroups: "formGroups", submitResponse: "submitResponse", searchResponse: "searchResponse", colWidth: "colWidth", isLegendVisible: "isLegendVisible", rightButtonLabel: "rightButtonLabel", leftButtonLabel: "leftButtonLabel", isSubmitButtonDisabled: "isSubmitButtonDisabled", isLeftButtonDisabled: "isLeftButtonDisabled", isLeftButtonNeeded: "isLeftButtonNeeded" }, outputs: { formSubmit: "formSubmit", formChange: "formChange", formInput: "formInput", formLeftButtonClicked: "formLeftButtonClicked", formSearchApply: "formSearchApply", formGroupsReference: "formGroupsReference", dropdownChange: "dropdownChange", formDateSelected: "formDateSelected", formSelectSearch: "formSelectSearch", formControlChange: "formControlChange", formAutoCompleteSearch: "formAutoCompleteSearch", autoCompleteOptionSelected: "autoCompleteOptionSelected", formAfterContentInit: "formAfterContentInit", formSelectedDateRange: "formSelectedDateRange" }, viewQueries: [{ propertyName: "formFields", predicate: DynamicFormFieldDirective, descendants: true }], exportAs: ["dynamicForm"], ngImport: i0, template: "<form\r\n  class=\"ieeesa-dynamic-form\"\r\n  [formGroup]=\"form\"\r\n  (change)=\"onFormChange()\"\r\n  (ngSubmit)=\"onFormSubmit()\"\r\n  (input)=\"formInputChange($event)\"\r\n>\r\n  <fieldset\r\n    class=\"ieeesa-dynamic-form__fieldset p-2\"\r\n    *ngFor=\"\r\n      let formGrp of formGroupArray;\r\n      let i = index;\r\n      trackBy: trackByFormGroup\r\n    \"\r\n  >\r\n    <legend class=\"float-none w-auto p-2\" *ngIf=\"isLegendVisible\">\r\n      {{ legendsArray[i] }}:\r\n    </legend>\r\n    <div class=\"row\">\r\n      <div\r\n        class=\"col-{{ colWidth.xs }} col-sm-{{ colWidth.sm }} col-md-{{\r\n          colWidth.md\r\n        }} col-lg-{{ colWidth.lg }} col-xl-{{ colWidth.xl }}\r\n        ieeesa-dynamic-form__form-field\"\r\n        [ngClass]=\"getRowClassName(formControlArray[i][j].controlName)\"\r\n        *ngFor=\"let control of formControlArray[i]; let j = index\"\r\n      >\r\n        <ng-template\r\n          ieeesaDynamicFormField\r\n          [config]=\"formControlArray[i][j]\"\r\n          [group]=\"formGrp\"\r\n          [submitResponse]=\"submitResponse\"\r\n          [searchResponse]=\"searchResponse\"\r\n          (formSearchApply)=\"onSearchApply($event)\"\r\n          (formDropdownSelected)=\"onFormChange(); onDropdownChange()\"\r\n          (formDateSelected)=\"onDateSelected($event)\"\r\n          (formSelectedDateRange)=\"onSelectedDateRange($event)\"\r\n          (formSelectSearch)=\"onSelectSearch($event)\"\r\n          (formAutoCompleteSearch)=\"onAutoCompleteSearch($event)\"\r\n          (autoCompleteOptionSelected)=\"onAutoCompleteOptionSelected()\"\r\n        >\r\n        </ng-template>\r\n      </div>\r\n    </div>\r\n  </fieldset>\r\n  <div class=\"row\">\r\n    <div class=\"col-12 ieeesa-dynamic-form__actions\">\r\n      <button\r\n        type=\"submit\"\r\n        mat-button\r\n        class=\"mat-primary-button ieeesa-dynamic-form__actions--right-btn\"\r\n        [disabled]=\"isSubmitButtonDisabled\"\r\n      >\r\n        {{ rightButtonLabel }}\r\n      </button>\r\n      <button\r\n        *ngIf=\"isLeftButtonNeeded\"\r\n        type=\"button\"\r\n        mat-button\r\n        class=\"mat-secondary-button ieeesa-dynamic-form__actions--left-btn\"\r\n        (click)=\"onLeftButtonClicked()\"\r\n        [disabled]=\"isLeftButtonDisabled\"\r\n      >\r\n        {{ leftButtonLabel }}\r\n      </button>\r\n    </div>\r\n  </div>\r\n</form>\r\n", styles: [".ieeesa-subtitle{text-align:left;font-family:Calibri Regular;font-size:1.56em;letter-spacing:0;color:#000;opacity:1}.ieeesa-body{text-align:left;font-family:Calibri Regular;font-size:1.25em;letter-spacing:0;color:#000;opacity:1}.ieeesa-display-lg-57{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:3.5625em;line-height:64px;color:#000;letter-spacing:0}.ieeesa-display-md-47{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:2.9375em;line-height:52px;color:#000;letter-spacing:0}.ieeesa-display-sm-38{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:2.375em;line-height:44px;color:#000;letter-spacing:0}.ieeesa-headline-lg-34{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:2.125em;line-height:40px;color:#000;letter-spacing:0}.ieeesa-headline-md-30{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1.875em;line-height:36px;color:#000;letter-spacing:0}.ieeesa-headline-sm-26{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1.625em;line-height:32px;color:#000;letter-spacing:0}.ieeesa-title-lg-bold-24{font-family:Calibri Regular;font-style:normal;font-weight:700;font-size:1.5em;line-height:28px;color:#000;letter-spacing:0}.ieeesa-title-lg-24{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1.5em;line-height:28px;color:#000;letter-spacing:0}.ieeesa-title-md-18{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1.125em;line-height:24px;color:#000;letter-spacing:.009375em}.ieeesa-title-sm-16{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1em;line-height:20px;color:#000;letter-spacing:.00625em}.ieeesa-label-lg-bold-16{font-family:Calibri Regular;font-style:normal;font-weight:700;font-size:1em;line-height:20px;color:#000;letter-spacing:.00625em}.ieeesa-label-lg-16{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1em;line-height:20px;color:#000;letter-spacing:.00625em}.ieeesa-label-md-14{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:.875em;line-height:16px;color:#000;letter-spacing:.03125em}.ieeesa-label-sm-13{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:.8125em;line-height:16px;color:#000;letter-spacing:.03125em}.ieeesa-body-lg-bold-18{font-family:Calibri Regular;font-style:normal;font-weight:700;font-size:1.125em;line-height:24px;color:#000;letter-spacing:.03125em}.ieeesa-body-lg-18{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1.125em;line-height:24px;color:#000;letter-spacing:.03125em}.ieeesa-body-md-16{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1em;line-height:20px;color:#000;letter-spacing:.015625em}.ieeesa-body-sm-14{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:.875em;line-height:16px;color:#000;letter-spacing:.025em}.ieeesa-title-inter-lg-bold-24{font-family:Inter Bold;font-style:normal;font-weight:700;font-size:1.5em;line-height:29px;color:#000;letter-spacing:0}.mat-mdc-button.mat-mdc-button-base.mat-primary-button,.mat-mdc-button.mat-mdc-button-base.mat-secondary-button{min-width:103px;width:auto;min-height:40px;height:auto;border-radius:3px;text-align:center;padding:.625em 1.5em;border:none;font-family:Calibri Regular;font-style:normal;font-weight:700;font-size:1em;line-height:20px;color:#000;letter-spacing:.00625em}.mat-mdc-button.mat-mdc-button-base>.mat-icon{margin-right:11px}.mat-mdc-button.mat-mdc-button-base.mat-primary-button{background-color:#00629b;color:#fff}.mat-mdc-button.mat-mdc-button-base.mat-primary-button:hover{background-color:#003e65}.mat-mdc-button.mat-mdc-button-base.mat-primary-button:active{background-color:#00629b}.mat-mdc-button.mat-mdc-button-base.mat-primary-button:disabled{background-color:#1c1b1f1f}.mat-mdc-button.mat-mdc-button-base.mat-secondary-button{color:#fff;background:#a7a8aa;box-shadow:0 1px 2px #0000004d,0 2px 6px 2px #00000026}.mat-mdc-button.mat-mdc-button-base.mat-secondary-button:hover{background:#a7a8aa}.mat-mdc-button.mat-mdc-button-base.mat-secondary-button:active{background:rgba(29,25,43,.12)}.mat-mdc-button.mat-mdc-button-base.mat-secondary-button:disabled{background:rgba(28,27,31,.12);color:#1c1b1f;opacity:.38}.ieeesa-text-button{color:#cac4d0;background:none;border:none}.flex-align-center{display:flex;align-items:center;justify-content:center}.mat-button-toggle-checked{background-color:#a7a8aa}.mat-button-toggle-checked .mat-button-toggle-label-content:before{font-family:\"Font Awesome 5 Free\";font-weight:900;content:\"\\f00c\";padding-right:.5625em}.mat-button-toggle-group .mat-button-toggle-label-content{font-family:Calibri Regular;font-style:normal;font-weight:700;font-size:1em;line-height:20px;color:#1c1b1f;letter-spacing:.00625em}@media (max-width: 768px){.mat-button-toggle-group .mat-button-toggle-label-content{max-width:8ch;text-overflow:ellipsis;white-space:nowrap;overflow:hidden;position:relative}}.cdk-overlay-pane{width:100%;min-width:312px}.ieeesa-dynamic-form__actions{display:flex;flex-direction:row-reverse;padding-top:15px}.ieeesa-dynamic-form__actions--left-btn{margin-right:2%}.ieeesa-dynamic-form__form-field{padding-top:20px}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i3.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i3.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i3.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: DynamicFormFieldDirective, selector: "[ieeesaDynamicFormField]", inputs: ["config", "group", "submitResponse", "searchResponse"], outputs: ["formSearchApply", "formDropdownSelected", "formDateSelected", "formSelectedDateRange", "formSelectSearch", "formAutoCompleteSearch", "autoCompleteOptionSelected"] }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i8.MatButton, selector: "    button[mat-button], button[mat-raised-button], button[mat-flat-button],    button[mat-stroked-button]  ", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.3", ngImport: i0, type: SelectComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.3", ngImport: i0, type: DynamicFormComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'ieeesa-select', standalone: true, imports: [
+            args: [{ exportAs: 'dynamicForm', selector: 'ieeesa-dynamic-form', standalone: true, imports: [
                         CommonModule,
-                        SearchComponent$1,
                         ReactiveFormsModule,
-                        FormErrorComponent$1,
-                        MatFormFieldModule,
-                        MatInputModule,
-                        MatIconModule,
-                        MatSelectModule,
-                    ], providers: [
-                        {
-                            provide: MAT_SELECT_CONFIG,
-                            useValue: { overlayPanelClass: 'ieeesa-select-overlay-pane' },
-                        },
-                    ], encapsulation: ViewEncapsulation.None, template: "<div\r\n  [formGroup]=\"group\"\r\n  class=\"ieeesa-select-field\"\r\n  *ngIf=\"group\"\r\n  [ngClass]=\"\r\n    isLabelAlignedLeft\r\n      ? 'ieeesa-select-field__label-left'\r\n      : 'ieeesa-select-field__label-top'\r\n  \"\r\n>\r\n  <mat-label class=\"ieeesa-select-field__label\">{{ selectLabel }}</mat-label>\r\n  <mat-form-field\r\n    [ngClass]=\"\r\n      arrowDirection\r\n        ? 'ieeesa-select-field__arrow-up'\r\n        : 'ieeesa-select-field__arrow-down'\r\n    \"\r\n  >\r\n    <mat-select\r\n      disableOptionCentering\r\n      *ngIf=\"isMultiSelect\"\r\n      (openedChange)=\"updateArrowDirection($event)\"\r\n      (selectionChange)=\"onChange($event.value)\"\r\n      [formControlName]=\"config.controlName\"\r\n      [multiple]=\"isMultiSelect\"\r\n      [disabled]=\"isDisabled\"\r\n      [placeholder]=\"placeholderText\"\r\n      [compareWith]=\"comparer\"\r\n    >\r\n      <ieeesa-search\r\n        *ngIf=\"isSearch\"\r\n        [searchType]=\"searchType\"\r\n        (searchValue)=\"onOptionSearch($event)\"\r\n      ></ieeesa-search>\r\n      <ng-container\r\n        *ngIf=\"!isMultiLevel\"\r\n        [ngTemplateOutlet]=\"dropdownOptionsTemplateRef\"\r\n        [ngTemplateOutletContext]=\"{ data: dropdownOptions }\"\r\n      >\r\n      </ng-container>\r\n      <ng-container *ngIf=\"isMultiLevel\">\r\n        <mat-optgroup\r\n          *ngFor=\"let option of dropdownOptions; trackBy: trackByFn\"\r\n          [label]=\"option.name\"\r\n        >\r\n          <ng-container\r\n            [ngTemplateOutlet]=\"dropdownOptionsTemplateRef\"\r\n            [ngTemplateOutletContext]=\"{ data: option.option_groups }\"\r\n          >\r\n          </ng-container>\r\n        </mat-optgroup>\r\n      </ng-container>\r\n      <ng-template #dropdownOptionsTemplateRef let-options=\"data\">\r\n        <mat-option\r\n          *ngFor=\"let option of options; trackBy: trackByFn\"\r\n          [value]=\"option\"\r\n        >\r\n          {{ option.name }}\r\n        </mat-option>\r\n      </ng-template>\r\n    </mat-select>\r\n\r\n    <mat-select\r\n      disableOptionCentering\r\n      *ngIf=\"!isMultiSelect\"\r\n      [multiple]=\"isMultiSelect\"\r\n      (openedChange)=\"updateArrowDirection($event)\"\r\n      (selectionChange)=\"onChange($event.value)\"\r\n      [formControlName]=\"config.controlName\"\r\n      [disabled]=\"isDisabled\"\r\n      [placeholder]=\"placeholderText\"\r\n    >\r\n      <ieeesa-search\r\n        *ngIf=\"isSearch\"\r\n        [searchType]=\"searchType\"\r\n        (searchValue)=\"onOptionSearch($event)\"\r\n      ></ieeesa-search>\r\n      <ng-container\r\n        *ngIf=\"!isMultiLevel\"\r\n        [ngTemplateOutlet]=\"dropdownOptionsTemplateRef\"\r\n        [ngTemplateOutletContext]=\"{ data: dropdownOptions }\"\r\n      >\r\n      </ng-container>\r\n      <ng-container *ngIf=\"isMultiLevel\">\r\n        <mat-optgroup\r\n          *ngFor=\"let option of dropdownOptions; trackBy: trackByFn\"\r\n          [label]=\"option.name\"\r\n        >\r\n          <ng-container\r\n            [ngTemplateOutlet]=\"dropdownOptionsTemplateRef\"\r\n            [ngTemplateOutletContext]=\"{ data: option.option_groups }\"\r\n          >\r\n          </ng-container>\r\n        </mat-optgroup>\r\n      </ng-container>\r\n      <ng-template #dropdownOptionsTemplateRef let-options=\"data\">\r\n        <mat-option\r\n          *ngFor=\"let option of options; trackBy: trackByFn\"\r\n          [value]=\"option\"\r\n        >\r\n          {{ option.name }}\r\n        </mat-option>\r\n      </ng-template>\r\n    </mat-select>\r\n  </mat-form-field>\r\n  <ieeesa-form-error [formGroup]=\"group\" [config]=\"config\"> </ieeesa-form-error>\r\n</div>\r\n", styles: [".ieeesa-subtitle{text-align:left;font-family:Calibri Regular;font-size:1.56em;letter-spacing:0;color:#000;opacity:1}.ieeesa-body{text-align:left;font-family:Calibri Regular;font-size:1.25em;letter-spacing:0;color:#000;opacity:1}.ieeesa-display-lg-57{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:3.5625em;line-height:64px;color:#000;letter-spacing:0}.ieeesa-display-md-47{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:2.9375em;line-height:52px;color:#000;letter-spacing:0}.ieeesa-display-sm-38{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:2.375em;line-height:44px;color:#000;letter-spacing:0}.ieeesa-headline-lg-34{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:2.125em;line-height:40px;color:#000;letter-spacing:0}.ieeesa-headline-md-30{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1.875em;line-height:36px;color:#000;letter-spacing:0}.ieeesa-headline-sm-26{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1.625em;line-height:32px;color:#000;letter-spacing:0}.ieeesa-title-lg-bold-24{font-family:Calibri Regular;font-style:normal;font-weight:700;font-size:1.5em;line-height:28px;color:#000;letter-spacing:0}.ieeesa-title-lg-24{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1.5em;line-height:28px;color:#000;letter-spacing:0}.ieeesa-title-md-18{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1.125em;line-height:24px;color:#000;letter-spacing:.009375em}.ieeesa-title-sm-16{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1em;line-height:20px;color:#000;letter-spacing:.00625em}.ieeesa-label-lg-bold-16{font-family:Calibri Regular;font-style:normal;font-weight:700;font-size:1em;line-height:20px;color:#000;letter-spacing:.00625em}.ieeesa-label-lg-16{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1em;line-height:20px;color:#000;letter-spacing:.00625em}.ieeesa-label-md-14{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:.875em;line-height:16px;color:#000;letter-spacing:.03125em}.ieeesa-label-sm-13{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:.8125em;line-height:16px;color:#000;letter-spacing:.03125em}.ieeesa-body-lg-bold-18{font-family:Calibri Regular;font-style:normal;font-weight:700;font-size:1.125em;line-height:24px;color:#000;letter-spacing:.03125em}.ieeesa-body-lg-18{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1.125em;line-height:24px;color:#000;letter-spacing:.03125em}.ieeesa-body-md-16{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1em;line-height:20px;color:#000;letter-spacing:.015625em}.ieeesa-body-sm-14{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:.875em;line-height:16px;color:#000;letter-spacing:.025em}.ieeesa-title-inter-lg-bold-24{font-family:Inter Bold;font-style:normal;font-weight:700;font-size:1.5em;line-height:29px;color:#000;letter-spacing:0}.mat-mdc-button.mat-mdc-button-base.mat-primary-button,.mat-mdc-button.mat-mdc-button-base.mat-secondary-button{min-width:103px;width:auto;min-height:40px;height:auto;border-radius:3px;text-align:center;padding:.625em 1.5em;border:none;font-family:Calibri Regular;font-style:normal;font-weight:700;font-size:1em;line-height:20px;color:#000;letter-spacing:.00625em}.mat-mdc-button.mat-mdc-button-base>.mat-icon{margin-right:11px}.mat-mdc-button.mat-mdc-button-base.mat-primary-button{background-color:#00629b;color:#fff}.mat-mdc-button.mat-mdc-button-base.mat-primary-button:hover{background-color:#003e65}.mat-mdc-button.mat-mdc-button-base.mat-primary-button:active{background-color:#00629b}.mat-mdc-button.mat-mdc-button-base.mat-primary-button:disabled{background-color:#1c1b1f1f}.mat-mdc-button.mat-mdc-button-base.mat-secondary-button{color:#fff;background:#a7a8aa;box-shadow:0 1px 2px #0000004d,0 2px 6px 2px #00000026}.mat-mdc-button.mat-mdc-button-base.mat-secondary-button:hover{background:#a7a8aa}.mat-mdc-button.mat-mdc-button-base.mat-secondary-button:active{background:rgba(29,25,43,.12)}.mat-mdc-button.mat-mdc-button-base.mat-secondary-button:disabled{background:rgba(28,27,31,.12);color:#1c1b1f;opacity:.38}.ieeesa-text-button{color:#cac4d0;background:none;border:none}.flex-align-center{display:flex;align-items:center;justify-content:center}.mat-button-toggle-checked{background-color:#a7a8aa}.mat-button-toggle-checked .mat-button-toggle-label-content:before{font-family:\"Font Awesome 5 Free\";font-weight:900;content:\"\\f00c\";padding-right:.5625em}.mat-button-toggle-group .mat-button-toggle-label-content{font-family:Calibri Regular;font-style:normal;font-weight:700;font-size:1em;line-height:20px;color:#1c1b1f;letter-spacing:.00625em}@media (max-width: 768px){.mat-button-toggle-group .mat-button-toggle-label-content{max-width:8ch;text-overflow:ellipsis;white-space:nowrap;overflow:hidden;position:relative}}.cdk-overlay-pane{width:100%;min-width:312px}.ieeesa-select-field .mat-mdc-form-field{width:-webkit-fill-available}.ieeesa-select-field__arrow-up .mat-mdc-select-arrow{border:solid #595758;border-width:0 2px 2px 0;display:inline-block;padding:4px;margin:0 10px;transform:rotate(-135deg);-webkit-transform:rotate(-135deg)}.ieeesa-select-field__arrow-up .mat-mdc-select-arrow svg{display:none}.ieeesa-select-field__arrow-down .mat-mdc-select-arrow{border:solid #595758;border-width:0 2px 2px 0;display:inline-block;padding:4px;margin:0 10px;transform:rotate(45deg);-webkit-transform:rotate(45deg)}.ieeesa-select-field__arrow-down .mat-mdc-select-arrow svg{display:none}.ieeesa-select-field__label-left{display:flex}.ieeesa-select-field__label-top{display:block}.ieeesa-select-field .mdc-text-field--filled .mdc-line-ripple:after{border-bottom-color:#918f90!important}.ieeesa-select-field .mdc-text-field--filled .mdc-line-ripple:before{border-bottom-color:#918f90!important}.ieeesa-select-field .mdc-line-ripple--active:after{opacity:0}.ieeesa-select-field .mat-mdc-select-placeholder{font-size:1em;font-weight:400;color:#000}.ieeesa-select-field .mdc-text-field--filled:not(.mdc-text-field--disabled){background-color:#fffbfe}.ieeesa-select-field .mdc-text-field--focused,.ieeesa-select-field .mat-mdc-form-field-focus-overlay,.ieeesa-select-overlay-pane .mat-mdc-select-panel{background-color:#fffbfe}.ieeesa-select-overlay-pane .mdc-list-item__primary-text{color:#000}.ieeesa-select-overlay-pane .mat-mdc-option .mat-pseudo-checkbox-minimal{margin-left:0;float:right}.ieeesa-select-overlay-pane .mat-primary .mat-pseudo-checkbox-checked.mat-pseudo-checkbox-minimal:after{display:none}.ieeesa-select-overlay-pane .ieeesa-search-field .mat-mdc-form-field-infix{width:100%}\n"] }]
-        }], ctorParameters: function () { return [{ type: i1.FormUtilityService }]; }, propDecorators: { formFields: [{
+                        DynamicFormFieldDirective,
+                        MatButtonModule,
+                    ], template: "<form\r\n  class=\"ieeesa-dynamic-form\"\r\n  [formGroup]=\"form\"\r\n  (change)=\"onFormChange()\"\r\n  (ngSubmit)=\"onFormSubmit()\"\r\n  (input)=\"formInputChange($event)\"\r\n>\r\n  <fieldset\r\n    class=\"ieeesa-dynamic-form__fieldset p-2\"\r\n    *ngFor=\"\r\n      let formGrp of formGroupArray;\r\n      let i = index;\r\n      trackBy: trackByFormGroup\r\n    \"\r\n  >\r\n    <legend class=\"float-none w-auto p-2\" *ngIf=\"isLegendVisible\">\r\n      {{ legendsArray[i] }}:\r\n    </legend>\r\n    <div class=\"row\">\r\n      <div\r\n        class=\"col-{{ colWidth.xs }} col-sm-{{ colWidth.sm }} col-md-{{\r\n          colWidth.md\r\n        }} col-lg-{{ colWidth.lg }} col-xl-{{ colWidth.xl }}\r\n        ieeesa-dynamic-form__form-field\"\r\n        [ngClass]=\"getRowClassName(formControlArray[i][j].controlName)\"\r\n        *ngFor=\"let control of formControlArray[i]; let j = index\"\r\n      >\r\n        <ng-template\r\n          ieeesaDynamicFormField\r\n          [config]=\"formControlArray[i][j]\"\r\n          [group]=\"formGrp\"\r\n          [submitResponse]=\"submitResponse\"\r\n          [searchResponse]=\"searchResponse\"\r\n          (formSearchApply)=\"onSearchApply($event)\"\r\n          (formDropdownSelected)=\"onFormChange(); onDropdownChange()\"\r\n          (formDateSelected)=\"onDateSelected($event)\"\r\n          (formSelectedDateRange)=\"onSelectedDateRange($event)\"\r\n          (formSelectSearch)=\"onSelectSearch($event)\"\r\n          (formAutoCompleteSearch)=\"onAutoCompleteSearch($event)\"\r\n          (autoCompleteOptionSelected)=\"onAutoCompleteOptionSelected()\"\r\n        >\r\n        </ng-template>\r\n      </div>\r\n    </div>\r\n  </fieldset>\r\n  <div class=\"row\">\r\n    <div class=\"col-12 ieeesa-dynamic-form__actions\">\r\n      <button\r\n        type=\"submit\"\r\n        mat-button\r\n        class=\"mat-primary-button ieeesa-dynamic-form__actions--right-btn\"\r\n        [disabled]=\"isSubmitButtonDisabled\"\r\n      >\r\n        {{ rightButtonLabel }}\r\n      </button>\r\n      <button\r\n        *ngIf=\"isLeftButtonNeeded\"\r\n        type=\"button\"\r\n        mat-button\r\n        class=\"mat-secondary-button ieeesa-dynamic-form__actions--left-btn\"\r\n        (click)=\"onLeftButtonClicked()\"\r\n        [disabled]=\"isLeftButtonDisabled\"\r\n      >\r\n        {{ leftButtonLabel }}\r\n      </button>\r\n    </div>\r\n  </div>\r\n</form>\r\n", styles: [".ieeesa-subtitle{text-align:left;font-family:Calibri Regular;font-size:1.56em;letter-spacing:0;color:#000;opacity:1}.ieeesa-body{text-align:left;font-family:Calibri Regular;font-size:1.25em;letter-spacing:0;color:#000;opacity:1}.ieeesa-display-lg-57{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:3.5625em;line-height:64px;color:#000;letter-spacing:0}.ieeesa-display-md-47{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:2.9375em;line-height:52px;color:#000;letter-spacing:0}.ieeesa-display-sm-38{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:2.375em;line-height:44px;color:#000;letter-spacing:0}.ieeesa-headline-lg-34{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:2.125em;line-height:40px;color:#000;letter-spacing:0}.ieeesa-headline-md-30{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1.875em;line-height:36px;color:#000;letter-spacing:0}.ieeesa-headline-sm-26{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1.625em;line-height:32px;color:#000;letter-spacing:0}.ieeesa-title-lg-bold-24{font-family:Calibri Regular;font-style:normal;font-weight:700;font-size:1.5em;line-height:28px;color:#000;letter-spacing:0}.ieeesa-title-lg-24{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1.5em;line-height:28px;color:#000;letter-spacing:0}.ieeesa-title-md-18{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1.125em;line-height:24px;color:#000;letter-spacing:.009375em}.ieeesa-title-sm-16{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1em;line-height:20px;color:#000;letter-spacing:.00625em}.ieeesa-label-lg-bold-16{font-family:Calibri Regular;font-style:normal;font-weight:700;font-size:1em;line-height:20px;color:#000;letter-spacing:.00625em}.ieeesa-label-lg-16{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1em;line-height:20px;color:#000;letter-spacing:.00625em}.ieeesa-label-md-14{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:.875em;line-height:16px;color:#000;letter-spacing:.03125em}.ieeesa-label-sm-13{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:.8125em;line-height:16px;color:#000;letter-spacing:.03125em}.ieeesa-body-lg-bold-18{font-family:Calibri Regular;font-style:normal;font-weight:700;font-size:1.125em;line-height:24px;color:#000;letter-spacing:.03125em}.ieeesa-body-lg-18{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1.125em;line-height:24px;color:#000;letter-spacing:.03125em}.ieeesa-body-md-16{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1em;line-height:20px;color:#000;letter-spacing:.015625em}.ieeesa-body-sm-14{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:.875em;line-height:16px;color:#000;letter-spacing:.025em}.ieeesa-title-inter-lg-bold-24{font-family:Inter Bold;font-style:normal;font-weight:700;font-size:1.5em;line-height:29px;color:#000;letter-spacing:0}.mat-mdc-button.mat-mdc-button-base.mat-primary-button,.mat-mdc-button.mat-mdc-button-base.mat-secondary-button{min-width:103px;width:auto;min-height:40px;height:auto;border-radius:3px;text-align:center;padding:.625em 1.5em;border:none;font-family:Calibri Regular;font-style:normal;font-weight:700;font-size:1em;line-height:20px;color:#000;letter-spacing:.00625em}.mat-mdc-button.mat-mdc-button-base>.mat-icon{margin-right:11px}.mat-mdc-button.mat-mdc-button-base.mat-primary-button{background-color:#00629b;color:#fff}.mat-mdc-button.mat-mdc-button-base.mat-primary-button:hover{background-color:#003e65}.mat-mdc-button.mat-mdc-button-base.mat-primary-button:active{background-color:#00629b}.mat-mdc-button.mat-mdc-button-base.mat-primary-button:disabled{background-color:#1c1b1f1f}.mat-mdc-button.mat-mdc-button-base.mat-secondary-button{color:#fff;background:#a7a8aa;box-shadow:0 1px 2px #0000004d,0 2px 6px 2px #00000026}.mat-mdc-button.mat-mdc-button-base.mat-secondary-button:hover{background:#a7a8aa}.mat-mdc-button.mat-mdc-button-base.mat-secondary-button:active{background:rgba(29,25,43,.12)}.mat-mdc-button.mat-mdc-button-base.mat-secondary-button:disabled{background:rgba(28,27,31,.12);color:#1c1b1f;opacity:.38}.ieeesa-text-button{color:#cac4d0;background:none;border:none}.flex-align-center{display:flex;align-items:center;justify-content:center}.mat-button-toggle-checked{background-color:#a7a8aa}.mat-button-toggle-checked .mat-button-toggle-label-content:before{font-family:\"Font Awesome 5 Free\";font-weight:900;content:\"\\f00c\";padding-right:.5625em}.mat-button-toggle-group .mat-button-toggle-label-content{font-family:Calibri Regular;font-style:normal;font-weight:700;font-size:1em;line-height:20px;color:#1c1b1f;letter-spacing:.00625em}@media (max-width: 768px){.mat-button-toggle-group .mat-button-toggle-label-content{max-width:8ch;text-overflow:ellipsis;white-space:nowrap;overflow:hidden;position:relative}}.cdk-overlay-pane{width:100%;min-width:312px}.ieeesa-dynamic-form__actions{display:flex;flex-direction:row-reverse;padding-top:15px}.ieeesa-dynamic-form__actions--left-btn{margin-right:2%}.ieeesa-dynamic-form__form-field{padding-top:20px}\n"] }]
+        }], ctorParameters: function () { return [{ type: i3.FormBuilder }]; }, propDecorators: { formFields: [{
                 type: ViewChildren,
-                args: [SearchComponent$1]
-            }], isSortNeeded: [{
-                type: Input
-            }], dropdownOptions: [{
+                args: [DynamicFormFieldDirective]
+            }], formGroups: [{
                 type: Input
-            }], selectedOptions: [{
+            }], submitResponse: [{
                 type: Input
-            }], formControlName: [{
+            }], searchResponse: [{
                 type: Input
-            }], isMultiLevel: [{
+            }], colWidth: [{
                 type: Input
-            }], isLabelAlignedLeft: [{
+            }], isLegendVisible: [{
                 type: Input
-            }], selectLabel: [{
+            }], rightButtonLabel: [{
                 type: Input
-            }], isMultiSelect: [{
+            }], leftButtonLabel: [{
                 type: Input
-            }], isDisabled: [{
+            }], isSubmitButtonDisabled: [{
                 type: Input
-            }], isSearch: [{
+            }], isLeftButtonDisabled: [{
                 type: Input
-            }], placeholderText: [{
+            }], isLeftButtonNeeded: [{
                 type: Input
-            }], optionSelected: [{
+            }], formSubmit: [{
                 type: Output
-            }], optionSearched: [{
+            }], formChange: [{
+                type: Output
+            }], formInput: [{
+                type: Output
+            }], formLeftButtonClicked: [{
+                type: Output
+            }], formSearchApply: [{
+                type: Output
+            }], formGroupsReference: [{
+                type: Output
+            }], dropdownChange: [{
+                type: Output
+            }], formDateSelected: [{
+                type: Output
+            }], formSelectSearch: [{
+                type: Output
+            }], formControlChange: [{
+                type: Output
+            }], formAutoCompleteSearch: [{
+                type: Output
+            }], autoCompleteOptionSelected: [{
+                type: Output
+            }], formAfterContentInit: [{
+                type: Output
+            }], formSelectedDateRange: [{
                 type: Output
             }] } });
 
-var SearchType;
-(function (SearchType) {
-    // eslint-disable-next-line no-unused-vars
-    SearchType["EMAIL"] = "EMAIL";
-    // eslint-disable-next-line no-unused-vars
-    SearchType["AUTO"] = "AUTO";
-    // eslint-disable-next-line no-unused-vars
-    SearchType["ON_CLICK"] = "ON_CLICK";
-})(SearchType || (SearchType = {}));
-
-var CalendarType;
-(function (CalendarType) {
-    // eslint-disable-next-line no-unused-vars
-    CalendarType[CalendarType["SINGLE_DATE_SELECTION"] = 1] = "SINGLE_DATE_SELECTION";
-    // eslint-disable-next-line no-unused-vars
-    CalendarType[CalendarType["CALENDAR"] = 2] = "CALENDAR";
-    // eslint-disable-next-line no-unused-vars
-    CalendarType[CalendarType["DATE_RANGE_SELECTION"] = 3] = "DATE_RANGE_SELECTION";
-})(CalendarType || (CalendarType = {}));
-
-var FormControlType;
-(function (FormControlType) {
-    // eslint-disable-next-line no-unused-vars
-    FormControlType["INPUT"] = "INPUT";
-    // eslint-disable-next-line no-unused-vars
-    FormControlType["TEXT_AREA"] = "TEXT_AREA";
-    // eslint-disable-next-line no-unused-vars
-    FormControlType["SELECT"] = "SELECT";
-    // eslint-disable-next-line no-unused-vars
-    FormControlType["SEARCH"] = "SEARCH";
-    // eslint-disable-next-line no-unused-vars
-    FormControlType["DATE"] = "DATE";
-    // eslint-disable-next-line no-unused-vars
-    FormControlType["CHECKBOX"] = "CHECKBOX";
-    // eslint-disable-next-line no-unused-vars
-    FormControlType["RADIO"] = "RADIO";
-    // eslint-disable-next-line no-unused-vars
-    FormControlType["AUTO_COMPLETE"] = "AUTO_COMPLETE";
-})(FormControlType || (FormControlType = {}));
-
-/**
- * Creates form fields configuration and form group based on passed parameters.
- * @export
- * @class FormUtilityService
- */
-class FormUtilityService {
-    // eslint-disable-next-line no-unused-vars, no-empty-function
-    constructor(fb) {
-        this.fb = fb;
-    }
-    /**
-     * Returns form fields configuration based on passed control name and type.
-     * @param {string} controlName
-     * @param {string} controlType
-     * @return {FieldConfig}
-     * @memberof FormUtilityService
-     */
-    getFormFieldConfig(controlName, controlType) {
-        return {
-            controlName: controlName,
-            type: controlType,
-        };
-    }
-    /**
-     * Creates and returns form group with passed control name added.
-     * @param {string} controlName
-     * @return {FormGroup}
-     * @memberof FormUtilityService
-     */
-    getFormGroup(controlName) {
-        return this.fb.group({
-            [controlName]: [],
-        });
-    }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.3", ngImport: i0, type: FormUtilityService, deps: [{ token: i3.FormBuilder }], target: i0.ɵɵFactoryTarget.Injectable }); }
-    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "16.1.3", ngImport: i0, type: FormUtilityService, providedIn: 'root' }); }
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.3", ngImport: i0, type: FormUtilityService, decorators: [{
-            type: Injectable,
-            args: [{
-                    providedIn: 'root',
-                }]
-        }], ctorParameters: function () { return [{ type: i3.FormBuilder }]; } });
-
 /**
- * DatepickerService is used in date-picker and date-picker-header component to get date range, isRangeSelection, and selected date(s).
- * @export
- * @class DatepickerService
+ * The NotificationComponent displays a notification with a heading, title, content, and an optional button.
+ * Component can be reused in page not found, access denied, session expired notification, logged out pages.
+ * @class NotificationComponent
  */
-class DatepickerService {
+class NotificationComponent {
     constructor() {
-        this.destroy$ = new Subject();
-        this.range = new Subject();
-        this.range$ = this.range.asObservable();
-        this.isRangeSelection = false;
-        this.range$?.pipe(takeUntil(this.destroy$)).subscribe((range) => {
-            this.selectedRange = {
-                start: range.start,
-                end: range.end,
-            };
-        });
-    }
-    /**
-     * Returns the calendar type.
-     * @return {boolean}
-     * @memberof DatepickerService
-     */
-    getCalendarType() {
-        return this.isRangeSelection;
-    }
-    /**
-     * Returns selected range
-     * @return {({ start: Date | string; end: Date | string })}
-     * @memberof DatepickerService
-     */
-    getSelectedRange() {
-        return this.selectedRange;
+        this.buttonIcon = true;
+        this.notify = new EventEmitter();
     }
     /**
-     * Implementation of ngOnDestroy lifecycle hook method to unsubscribe the open observable subscriptions.
-     * @memberof DatePickerHeaderComponent
+     * Emits the notify event on clicking notify button.
      */
-    ngOnDestroy() {
-        this.destroy$.next(true);
-        this.destroy$.unsubscribe();
+    onClick() {
+        this.notify.emit();
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.3", ngImport: i0, type: DatepickerService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
-    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "16.1.3", ngImport: i0, type: DatepickerService, providedIn: 'root' }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.3", ngImport: i0, type: NotificationComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.3", type: NotificationComponent, isStandalone: true, selector: "ieeesa-notification", inputs: { heading: "heading", title: "title", content: "content", buttonLabel: "buttonLabel", buttonIcon: "buttonIcon" }, outputs: { notify: "notify" }, ngImport: i0, template: "<div class=\"ieeesa-notification flex-align-center row\">\r\n  <div class=\"ieeesa-notification__body col-md-4 col-lg-4 p-4\">\r\n    <h1\r\n      class=\"ieeesa-notification__heading ieeesa-display-lg-57 text-capitalize\"\r\n      *ngIf=\"heading\"\r\n    >\r\n      {{ heading }}\r\n    </h1>\r\n    <p class=\"ieeesa-notification__title ieeesa-title-lg-bold-24\">\r\n      {{ title }}\r\n    </p>\r\n    <p class=\"ieeesa-notification__message ieeesa-title-md-18\">{{ content }}</p>\r\n    <button\r\n      mat-button\r\n      color=\"primary\"\r\n      class=\"ieeesa-notification__button ieeesa-label-lg-bold-16 mat-primary-button\"\r\n      (click)=\"onClick()\"\r\n    >\r\n      <i *ngIf=\"buttonIcon\" class=\"fa-solid fa-arrow-left\"></i>\r\n      {{ buttonLabel }}\r\n    </button>\r\n  </div>\r\n</div>\r\n", styles: [".ieeesa-subtitle{text-align:left;font-family:Calibri Regular;font-size:1.56em;letter-spacing:0;color:#000;opacity:1}.ieeesa-body{text-align:left;font-family:Calibri Regular;font-size:1.25em;letter-spacing:0;color:#000;opacity:1}.ieeesa-display-lg-57{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:3.5625em;line-height:64px;color:#000;letter-spacing:0}.ieeesa-display-md-47{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:2.9375em;line-height:52px;color:#000;letter-spacing:0}.ieeesa-display-sm-38{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:2.375em;line-height:44px;color:#000;letter-spacing:0}.ieeesa-headline-lg-34{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:2.125em;line-height:40px;color:#000;letter-spacing:0}.ieeesa-headline-md-30{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1.875em;line-height:36px;color:#000;letter-spacing:0}.ieeesa-headline-sm-26{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1.625em;line-height:32px;color:#000;letter-spacing:0}.ieeesa-title-lg-bold-24{font-family:Calibri Regular;font-style:normal;font-weight:700;font-size:1.5em;line-height:28px;color:#000;letter-spacing:0}.ieeesa-title-lg-24{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1.5em;line-height:28px;color:#000;letter-spacing:0}.ieeesa-title-md-18{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1.125em;line-height:24px;color:#000;letter-spacing:.009375em}.ieeesa-title-sm-16{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1em;line-height:20px;color:#000;letter-spacing:.00625em}.ieeesa-label-lg-bold-16{font-family:Calibri Regular;font-style:normal;font-weight:700;font-size:1em;line-height:20px;color:#000;letter-spacing:.00625em}.ieeesa-label-lg-16{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1em;line-height:20px;color:#000;letter-spacing:.00625em}.ieeesa-label-md-14{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:.875em;line-height:16px;color:#000;letter-spacing:.03125em}.ieeesa-label-sm-13{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:.8125em;line-height:16px;color:#000;letter-spacing:.03125em}.ieeesa-body-lg-bold-18{font-family:Calibri Regular;font-style:normal;font-weight:700;font-size:1.125em;line-height:24px;color:#000;letter-spacing:.03125em}.ieeesa-body-lg-18{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1.125em;line-height:24px;color:#000;letter-spacing:.03125em}.ieeesa-body-md-16{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1em;line-height:20px;color:#000;letter-spacing:.015625em}.ieeesa-body-sm-14{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:.875em;line-height:16px;color:#000;letter-spacing:.025em}.ieeesa-title-inter-lg-bold-24{font-family:Inter Bold;font-style:normal;font-weight:700;font-size:1.5em;line-height:29px;color:#000;letter-spacing:0}.mat-mdc-button.mat-mdc-button-base.mat-primary-button,.mat-mdc-button.mat-mdc-button-base.mat-secondary-button{min-width:103px;width:auto;min-height:40px;height:auto;border-radius:3px;text-align:center;padding:.625em 1.5em;border:none;font-family:Calibri Regular;font-style:normal;font-weight:700;font-size:1em;line-height:20px;color:#000;letter-spacing:.00625em}.mat-mdc-button.mat-mdc-button-base>.mat-icon{margin-right:11px}.mat-mdc-button.mat-mdc-button-base.mat-primary-button{background-color:#00629b;color:#fff}.mat-mdc-button.mat-mdc-button-base.mat-primary-button:hover{background-color:#003e65}.mat-mdc-button.mat-mdc-button-base.mat-primary-button:active{background-color:#00629b}.mat-mdc-button.mat-mdc-button-base.mat-primary-button:disabled{background-color:#1c1b1f1f}.mat-mdc-button.mat-mdc-button-base.mat-secondary-button{color:#fff;background:#a7a8aa;box-shadow:0 1px 2px #0000004d,0 2px 6px 2px #00000026}.mat-mdc-button.mat-mdc-button-base.mat-secondary-button:hover{background:#a7a8aa}.mat-mdc-button.mat-mdc-button-base.mat-secondary-button:active{background:rgba(29,25,43,.12)}.mat-mdc-button.mat-mdc-button-base.mat-secondary-button:disabled{background:rgba(28,27,31,.12);color:#1c1b1f;opacity:.38}.ieeesa-text-button{color:#cac4d0;background:none;border:none}.flex-align-center{display:flex;align-items:center;justify-content:center}.mat-button-toggle-checked{background-color:#a7a8aa}.mat-button-toggle-checked .mat-button-toggle-label-content:before{font-family:\"Font Awesome 5 Free\";font-weight:900;content:\"\\f00c\";padding-right:.5625em}.mat-button-toggle-group .mat-button-toggle-label-content{font-family:Calibri Regular;font-style:normal;font-weight:700;font-size:1em;line-height:20px;color:#1c1b1f;letter-spacing:.00625em}@media (max-width: 768px){.mat-button-toggle-group .mat-button-toggle-label-content{max-width:8ch;text-overflow:ellipsis;white-space:nowrap;overflow:hidden;position:relative}}.cdk-overlay-pane{width:100%;min-width:312px}.ieeesa-notification{text-align:center}.ieeesa-notification__body{box-shadow:0 1px 2px #0000004d,0 2px 6px 2px #00000026;border-radius:.5rem;margin:0 auto;font-family:Calibri Regular;padding:2em 0;background-color:#fff;height:max-content;display:flex;flex-direction:column;align-items:center}.ieeesa-notification__heading{color:#0188aa;margin:0;padding-bottom:.5rem}.ieeesa-notification__title{color:#0188aa;padding-bottom:2.5rem;margin:0}.ieeesa-notification__message{color:#002c37;letter-spacing:.03125em;padding-bottom:1rem;margin:0}.ieeesa-notification__button{margin-bottom:.5rem;color:#fff}.ieeesa-notification__button i{padding-right:.5rem}@media screen and (max-width: 576px){.ieeesa-notification__body{width:80%}}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i8.MatButton, selector: "    button[mat-button], button[mat-raised-button], button[mat-flat-button],    button[mat-stroked-button]  ", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.3", ngImport: i0, type: DatepickerService, decorators: [{
-            type: Injectable,
-            args: [{
-                    providedIn: 'root',
-                }]
-        }], ctorParameters: function () { return []; } });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.3", ngImport: i0, type: NotificationComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'ieeesa-notification', standalone: true, imports: [CommonModule, MatIconModule, MatButtonModule], template: "<div class=\"ieeesa-notification flex-align-center row\">\r\n  <div class=\"ieeesa-notification__body col-md-4 col-lg-4 p-4\">\r\n    <h1\r\n      class=\"ieeesa-notification__heading ieeesa-display-lg-57 text-capitalize\"\r\n      *ngIf=\"heading\"\r\n    >\r\n      {{ heading }}\r\n    </h1>\r\n    <p class=\"ieeesa-notification__title ieeesa-title-lg-bold-24\">\r\n      {{ title }}\r\n    </p>\r\n    <p class=\"ieeesa-notification__message ieeesa-title-md-18\">{{ content }}</p>\r\n    <button\r\n      mat-button\r\n      color=\"primary\"\r\n      class=\"ieeesa-notification__button ieeesa-label-lg-bold-16 mat-primary-button\"\r\n      (click)=\"onClick()\"\r\n    >\r\n      <i *ngIf=\"buttonIcon\" class=\"fa-solid fa-arrow-left\"></i>\r\n      {{ buttonLabel }}\r\n    </button>\r\n  </div>\r\n</div>\r\n", styles: [".ieeesa-subtitle{text-align:left;font-family:Calibri Regular;font-size:1.56em;letter-spacing:0;color:#000;opacity:1}.ieeesa-body{text-align:left;font-family:Calibri Regular;font-size:1.25em;letter-spacing:0;color:#000;opacity:1}.ieeesa-display-lg-57{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:3.5625em;line-height:64px;color:#000;letter-spacing:0}.ieeesa-display-md-47{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:2.9375em;line-height:52px;color:#000;letter-spacing:0}.ieeesa-display-sm-38{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:2.375em;line-height:44px;color:#000;letter-spacing:0}.ieeesa-headline-lg-34{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:2.125em;line-height:40px;color:#000;letter-spacing:0}.ieeesa-headline-md-30{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1.875em;line-height:36px;color:#000;letter-spacing:0}.ieeesa-headline-sm-26{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1.625em;line-height:32px;color:#000;letter-spacing:0}.ieeesa-title-lg-bold-24{font-family:Calibri Regular;font-style:normal;font-weight:700;font-size:1.5em;line-height:28px;color:#000;letter-spacing:0}.ieeesa-title-lg-24{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1.5em;line-height:28px;color:#000;letter-spacing:0}.ieeesa-title-md-18{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1.125em;line-height:24px;color:#000;letter-spacing:.009375em}.ieeesa-title-sm-16{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1em;line-height:20px;color:#000;letter-spacing:.00625em}.ieeesa-label-lg-bold-16{font-family:Calibri Regular;font-style:normal;font-weight:700;font-size:1em;line-height:20px;color:#000;letter-spacing:.00625em}.ieeesa-label-lg-16{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1em;line-height:20px;color:#000;letter-spacing:.00625em}.ieeesa-label-md-14{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:.875em;line-height:16px;color:#000;letter-spacing:.03125em}.ieeesa-label-sm-13{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:.8125em;line-height:16px;color:#000;letter-spacing:.03125em}.ieeesa-body-lg-bold-18{font-family:Calibri Regular;font-style:normal;font-weight:700;font-size:1.125em;line-height:24px;color:#000;letter-spacing:.03125em}.ieeesa-body-lg-18{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1.125em;line-height:24px;color:#000;letter-spacing:.03125em}.ieeesa-body-md-16{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:1em;line-height:20px;color:#000;letter-spacing:.015625em}.ieeesa-body-sm-14{font-family:Calibri Regular;font-style:normal;font-weight:400;font-size:.875em;line-height:16px;color:#000;letter-spacing:.025em}.ieeesa-title-inter-lg-bold-24{font-family:Inter Bold;font-style:normal;font-weight:700;font-size:1.5em;line-height:29px;color:#000;letter-spacing:0}.mat-mdc-button.mat-mdc-button-base.mat-primary-button,.mat-mdc-button.mat-mdc-button-base.mat-secondary-button{min-width:103px;width:auto;min-height:40px;height:auto;border-radius:3px;text-align:center;padding:.625em 1.5em;border:none;font-family:Calibri Regular;font-style:normal;font-weight:700;font-size:1em;line-height:20px;color:#000;letter-spacing:.00625em}.mat-mdc-button.mat-mdc-button-base>.mat-icon{margin-right:11px}.mat-mdc-button.mat-mdc-button-base.mat-primary-button{background-color:#00629b;color:#fff}.mat-mdc-button.mat-mdc-button-base.mat-primary-button:hover{background-color:#003e65}.mat-mdc-button.mat-mdc-button-base.mat-primary-button:active{background-color:#00629b}.mat-mdc-button.mat-mdc-button-base.mat-primary-button:disabled{background-color:#1c1b1f1f}.mat-mdc-button.mat-mdc-button-base.mat-secondary-button{color:#fff;background:#a7a8aa;box-shadow:0 1px 2px #0000004d,0 2px 6px 2px #00000026}.mat-mdc-button.mat-mdc-button-base.mat-secondary-button:hover{background:#a7a8aa}.mat-mdc-button.mat-mdc-button-base.mat-secondary-button:active{background:rgba(29,25,43,.12)}.mat-mdc-button.mat-mdc-button-base.mat-secondary-button:disabled{background:rgba(28,27,31,.12);color:#1c1b1f;opacity:.38}.ieeesa-text-button{color:#cac4d0;background:none;border:none}.flex-align-center{display:flex;align-items:center;justify-content:center}.mat-button-toggle-checked{background-color:#a7a8aa}.mat-button-toggle-checked .mat-button-toggle-label-content:before{font-family:\"Font Awesome 5 Free\";font-weight:900;content:\"\\f00c\";padding-right:.5625em}.mat-button-toggle-group .mat-button-toggle-label-content{font-family:Calibri Regular;font-style:normal;font-weight:700;font-size:1em;line-height:20px;color:#1c1b1f;letter-spacing:.00625em}@media (max-width: 768px){.mat-button-toggle-group .mat-button-toggle-label-content{max-width:8ch;text-overflow:ellipsis;white-space:nowrap;overflow:hidden;position:relative}}.cdk-overlay-pane{width:100%;min-width:312px}.ieeesa-notification{text-align:center}.ieeesa-notification__body{box-shadow:0 1px 2px #0000004d,0 2px 6px 2px #00000026;border-radius:.5rem;margin:0 auto;font-family:Calibri Regular;padding:2em 0;background-color:#fff;height:max-content;display:flex;flex-direction:column;align-items:center}.ieeesa-notification__heading{color:#0188aa;margin:0;padding-bottom:.5rem}.ieeesa-notification__title{color:#0188aa;padding-bottom:2.5rem;margin:0}.ieeesa-notification__message{color:#002c37;letter-spacing:.03125em;padding-bottom:1rem;margin:0}.ieeesa-notification__button{margin-bottom:.5rem;color:#fff}.ieeesa-notification__button i{padding-right:.5rem}@media screen and (max-width: 576px){.ieeesa-notification__body{width:80%}}\n"] }]
+        }], propDecorators: { heading: [{
+                type: Input
+            }], title: [{
+                type: Input
+            }], content: [{
+                type: Input
+            }], buttonLabel: [{
+                type: Input
+            }], buttonIcon: [{
+                type: Input
+            }], notify: [{
+                type: Output
+            }] } });
 
 class PresentationModule {
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.3", ngImport: i0, type: PresentationModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }