ngx-histaff-alpha 6.3.6 → 6.3.8

package/fesm2022/{ngx-histaff-alpha-ngx-histaff-alpha-YPc6xct6.mjs → ngx-histaff-alpha-ngx-histaff-alpha-BJ3ZVba7.mjs}

@@ -3881,11 +3881,12 @@ class AppInitializationService {
             if (window.opener && window.opener.globalPopupId) {
                 //alert(window.opener.globalPopupId);
             }
-            fetch('../../assets/app.config.json').then(res => res.json()).then(({ APP_TYPE, APP_UIID, ALLOW_IN_APP_NOTIFICATION, SHOW_LOGIN_NOTIFICATION, IGNORE_PARTIAL_URL_MATCH_FOR_FUNCTION, IGNORE_PARTIAL_URL_MATCH_FOR_PROFILE_CENTER, USE_BUILTIN_OTP, USE_CAPTCHA, BASE_URL, BASE_URL_FOR_STATISTIC, GOLIVE_URL, DEBUG_ENABLED, USE_DEMO_AVATAR, LOGO_LOGIN, LOGO_HEADER, HOME_BACKGROUND_IMAGE, FORM_CONTROL_REQUIRED_HIGHLIGHT_COLOR, OAUTH2_OIDC_ENABLED, OAUTH2_OIDC_CLIENT_ID, OAUTH2_OIDC_LOGIN_URI, OAUTH2_OIDC_REDIRECT_URI, OAUTH2_OIDC_SCOPE, OFFICE365_DEV, OFFICE365_PROD, SAML2ADFS_ENABLED, SAML2ADFS_IDP, SAML2ADFS_IDENTIFIER, SAML2ADFS_WA_SIGNIN, SAML2ADFS_WA_SIGNOUT, SAML2ADFS_WREPLY, HANGFIRE_PATH, STATIC_FOLDER, WORKFLOW_ENABLE_DEBUG_MODE, }) => {
+            fetch('../../assets/app.config.json').then(res => res.json()).then(({ APP_TYPE, APP_UIID, ALLOW_IN_APP_NOTIFICATION, SHOW_LOGIN_NOTIFICATION, FEDERATION_COM_PARTY_ENABLED, IGNORE_PARTIAL_URL_MATCH_FOR_FUNCTION, IGNORE_PARTIAL_URL_MATCH_FOR_PROFILE_CENTER, USE_BUILTIN_OTP, USE_CAPTCHA, BASE_URL, BASE_URL_FOR_STATISTIC, GOLIVE_URL, DEBUG_ENABLED, USE_DEMO_AVATAR, LOGO_LOGIN, LOGO_HEADER, HOME_BACKGROUND_IMAGE, FORM_CONTROL_REQUIRED_HIGHLIGHT_COLOR, OAUTH2_OIDC_ENABLED, OAUTH2_OIDC_CLIENT_ID, OAUTH2_OIDC_LOGIN_URI, OAUTH2_OIDC_REDIRECT_URI, OAUTH2_OIDC_SCOPE, OFFICE365_DEV, OFFICE365_PROD, SAML2ADFS_ENABLED, SAML2ADFS_IDP, SAML2ADFS_IDENTIFIER, SAML2ADFS_WA_SIGNIN, SAML2ADFS_WA_SIGNOUT, SAML2ADFS_WREPLY, HANGFIRE_PATH, STATIC_FOLDER, WORKFLOW_ENABLE_DEBUG_MODE, }) => {
                 this.appConfigService.APP_TYPE = APP_TYPE;
                 this.appConfigService.APP_UIID = APP_UIID;
                 this.appConfigService.ALLOW_IN_APP_NOTIFICATION = ALLOW_IN_APP_NOTIFICATION;
                 this.appConfigService.SHOW_LOGIN_NOTIFICATION = SHOW_LOGIN_NOTIFICATION;
+                this.appConfigService.FEDERATION_COM_PARTY_ENABLED = FEDERATION_COM_PARTY_ENABLED;
                 this.appConfigService.IGNORE_PARTIAL_URL_MATCH_FOR_FUNCTION = IGNORE_PARTIAL_URL_MATCH_FOR_FUNCTION;
                 this.appConfigService.IGNORE_PARTIAL_URL_MATCH_FOR_PROFILE_CENTER = IGNORE_PARTIAL_URL_MATCH_FOR_PROFILE_CENTER;
                 this.appConfigService.USE_BUILTIN_OTP = USE_BUILTIN_OTP;
@@ -9176,7 +9177,7 @@ class SocketService {
             .withUrl(this.appConfigService.BASE_URL + '/hubs/signal', {
             accessTokenFactory: () => token,
             skipNegotiation: true,
-            transport: HttpTransportType.WebSockets
+            transport: HttpTransportType.WebSockets || HttpTransportType.ServerSentEvents || HttpTransportType.LongPolling
         })
             .configureLogging(LogLevel.Information)
             .build();
@@ -24465,7 +24466,7 @@ class CoreShiftCollectionComponent extends BaseComponent {
         this.filteredShifts = this.fullShifts;
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: CoreShiftCollectionComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.5", type: CoreShiftCollectionComponent, isStandalone: true, selector: "core-shift-collection", inputs: { height: "height", relativeMode: "relativeMode" }, viewQueries: [{ propertyName: "container", first: true, predicate: ["container"], descendants: true }, { propertyName: "header", first: true, predicate: ["header"], descendants: true }], usesInheritance: true, ngImport: i0, template: "<div #container class=\"core-shift-collection-container\" draggable=\"true\">\r\n    <div class=\"p-relative\">\r\n        <div #header class=\"header\" [ngStyle]=\"{\r\n            cursor: relativeMode ? 'auto' : 'move'\r\n        }\">\r\n            <span>{{ 'SHIFT_COLLECTION' | translate: lang | uppercase }}</span>\r\n            @if (!relativeMode) {\r\n                <i class=\"feather-x\" (click)=\"onClose($event)\"></i>\r\n            }\r\n        </div>\r\n        <div class=\"lookup-wrapper d-flex d-flex-start p15\">\r\n            <div class=\"advanced-search d-flex d-flex-v h-100\">\r\n                <div class=\"pointer\"  [appTooltip]=\"'UI_COMMON_ADVANCED_FILTER' | translate: lang\" (click)=\"onAdvancedSearchToggle()\">\r\n                    <i class=\"feather-sliders\"></i>\r\n                </div>\r\n                @if (codeKeyword.length || nameKeyword.length || symbolCodeKeyword.length || symbolNameKeyword.length) {\r\n                <div class=\"pointer\" [appTooltip]=\"'UI_COMMON_FILTER_RESET' | translate: lang\" (click)=\"onFilterReset()\">\r\n                    <i class=\"feather-x\"></i>\r\n                </div>\r\n                }\r\n            </div>\r\n            <div class=\"lookup w-100\">\r\n                <input class=\"form-control\" placeholder=\"Code...\" [(ngModel)]=\"codeKeyword\"\r\n                    (ngModelChange)=\"onCodeKeywordChange($event)\">\r\n\r\n                @if (showAdvancedSearch) {\r\n                <input class=\"form-control\" placeholder=\"Name...\" [(ngModel)]=\"nameKeyword\"\r\n                    (ngModelChange)=\"onNameKeywordChange($event)\">\r\n                <input class=\"form-control\" placeholder=\"Symbol code...\" [(ngModel)]=\"symbolCodeKeyword\"\r\n                    (ngModelChange)=\"onSymbolCodeKeywordChange($event)\">\r\n                <input class=\"form-control\" placeholder=\"Symbol name...\" [(ngModel)]=\"symbolNameKeyword\"\r\n                    (ngModelChange)=\"onSymbolNameKeywordChange($event)\">\r\n                }\r\n            </div>\r\n        </div>\r\n        <div class=\"scroll-wrapper\">\r\n            <core-scroll [localOptions]=\"filteredShifts\" [itemTemplate]=\"itemTemplateRef\"\r\n                [itemCount]=\"filteredShifts.length\" [height]=\"height - 50 - searchHeight\" [childHeight]=\"itemHeight\">\r\n            </core-scroll>\r\n        </div>\r\n    </div>\r\n</div>\r\n\r\n<ng-template #itemTemplateRef let-context=\"context\">\r\n    <li [ngStyle]=\"{ height: itemHeight + 'px' }\">\r\n        <core-shift-card [ngModel]=\"context\"></core-shift-card>\r\n    </li>\r\n</ng-template>", styles: [".core-shift-collection-container{--starter-x: 0px;background-color:#fff;width:320px;position:fixed;display:block;z-index:9;top:0;left:var(--starter-x);box-shadow:.4rem 0 2rem #0000002e;border-radius:2px}.core-shift-collection-container .header{padding:15px;display:block;height:50px}.core-shift-collection-container .header i{color:gray;font-size:24px;float:right;cursor:pointer}.core-shift-collection-container .lookup{padding:15px}.core-shift-collection-container .lookup input:not(:last-child){margin-bottom:15px}li{margin-left:9px;margin-right:9px;border-radius:2px}\n"], dependencies: [{ kind: "directive", type: NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "pipe", type: UpperCasePipe, name: "uppercase" }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$3.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: i1$3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: CoreScrollComponent, selector: "core-scroll", inputs: ["localOptions", "itemTemplate", "itemCount", "height", "childHeight", "renderAhread"] }, { kind: "component", type: CoreShiftCardComponent, selector: "core-shift-card" }, { kind: "pipe", type: TranslatePipe, name: "translate" }, { kind: "directive", type: TooltipDirective, selector: "[appTooltip]", inputs: ["appTooltip", "showAnyway", "color", "backgroundColor", "position"] }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.5", type: CoreShiftCollectionComponent, isStandalone: true, selector: "core-shift-collection", inputs: { height: "height", disabled: "disabled", relativeMode: "relativeMode" }, viewQueries: [{ propertyName: "container", first: true, predicate: ["container"], descendants: true }, { propertyName: "header", first: true, predicate: ["header"], descendants: true }], usesInheritance: true, ngImport: i0, template: "<div #container class=\"core-shift-collection-container\" draggable=\"true\">\r\n    <div class=\"p-relative\">\r\n        <div #header class=\"header\" [ngStyle]=\"{\r\n            cursor: relativeMode ? 'auto' : 'move'\r\n        }\">\r\n            <span>{{ 'SHIFT_COLLECTION' | translate: lang | uppercase }}</span>\r\n            @if (!relativeMode) {\r\n                <i class=\"feather-x\" (click)=\"onClose($event)\"></i>\r\n            }\r\n        </div>\r\n        <div class=\"lookup-wrapper d-flex d-flex-start p15\">\r\n            <div class=\"advanced-search d-flex d-flex-v h-100\">\r\n                <div class=\"pointer\"  [appTooltip]=\"'UI_COMMON_ADVANCED_FILTER' | translate: lang\" (click)=\"onAdvancedSearchToggle()\">\r\n                    <i class=\"feather-sliders\"></i>\r\n                </div>\r\n                @if (codeKeyword.length || nameKeyword.length || symbolCodeKeyword.length || symbolNameKeyword.length) {\r\n                <div class=\"pointer\" [appTooltip]=\"'UI_COMMON_FILTER_RESET' | translate: lang\" (click)=\"onFilterReset()\">\r\n                    <i class=\"feather-x\"></i>\r\n                </div>\r\n                }\r\n            </div>\r\n            <div class=\"lookup w-100\">\r\n                <input class=\"form-control\" placeholder=\"Code...\" [(ngModel)]=\"codeKeyword\"\r\n                    (ngModelChange)=\"onCodeKeywordChange($event)\">\r\n\r\n                @if (showAdvancedSearch) {\r\n                <input class=\"form-control\" placeholder=\"Name...\" [(ngModel)]=\"nameKeyword\"\r\n                    (ngModelChange)=\"onNameKeywordChange($event)\">\r\n                <input class=\"form-control\" placeholder=\"Symbol code...\" [(ngModel)]=\"symbolCodeKeyword\"\r\n                    (ngModelChange)=\"onSymbolCodeKeywordChange($event)\">\r\n                <input class=\"form-control\" placeholder=\"Symbol name...\" [(ngModel)]=\"symbolNameKeyword\"\r\n                    (ngModelChange)=\"onSymbolNameKeywordChange($event)\">\r\n                }\r\n            </div>\r\n        </div>\r\n        <div class=\"scroll-wrapper\">\r\n            <core-scroll [localOptions]=\"filteredShifts\" [itemTemplate]=\"itemTemplateRef\"\r\n                [itemCount]=\"filteredShifts.length\" [height]=\"height - 50 - searchHeight\" [childHeight]=\"itemHeight\">\r\n            </core-scroll>\r\n        </div>\r\n    </div>\r\n</div>\r\n\r\n<ng-template #itemTemplateRef let-context=\"context\">\r\n    <li [ngStyle]=\"{ height: itemHeight + 'px' }\">\r\n        <core-shift-card [ngModel]=\"context\"></core-shift-card>\r\n    </li>\r\n</ng-template>", styles: [".core-shift-collection-container{--starter-x: 0px;background-color:#fff;width:320px;position:fixed;display:block;z-index:9;top:0;left:var(--starter-x);box-shadow:.4rem 0 2rem #0000002e;border-radius:2px}.core-shift-collection-container .header{padding:15px;display:block;height:50px}.core-shift-collection-container .header i{color:gray;font-size:24px;float:right;cursor:pointer}.core-shift-collection-container .lookup{padding:15px}.core-shift-collection-container .lookup input:not(:last-child){margin-bottom:15px}li{margin-left:9px;margin-right:9px;border-radius:2px}\n"], dependencies: [{ kind: "directive", type: NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "pipe", type: UpperCasePipe, name: "uppercase" }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$3.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: i1$3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: CoreScrollComponent, selector: "core-scroll", inputs: ["localOptions", "itemTemplate", "itemCount", "height", "childHeight", "renderAhread"] }, { kind: "component", type: CoreShiftCardComponent, selector: "core-shift-card" }, { kind: "pipe", type: TranslatePipe, name: "translate" }, { kind: "directive", type: TooltipDirective, selector: "[appTooltip]", inputs: ["appTooltip", "showAnyway", "color", "backgroundColor", "position"] }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: CoreShiftCollectionComponent, decorators: [{
             type: Component,
@@ -24481,6 +24482,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.5", ngImpor
         }], propDecorators: { height: [{
                 type: Input,
                 args: [{ required: true }]
+            }], disabled: [{
+                type: Input
             }], relativeMode: [{
                 type: Input
             }], container: [{
@@ -25594,7 +25597,7 @@ class CoreControlNoFormArrayComponent extends BaseComponent {
         }
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: CoreControlNoFormArrayComponent, deps: [{ token: MultiLanguageService }, { token: AlertService }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.5", type: CoreControlNoFormArrayComponent, isStandalone: true, selector: "core-control-no-form-array", inputs: { control: "control", checkError$: "checkError$", rangeLimit: "rangeLimit" }, host: { listeners: { "window:click": "onWindowClick()" } }, usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "<div class=\"core-control-container\">\r\n\r\n    <div [formGroup]=\"form\" [class.hidden]=\"!!control.hidden\">\r\n\r\n        @if (!control.headless!) {\r\n            <label [class]=\"'control-label' +  (required ? ' required' : '')\" [attr.for]=\"control.field\"\r\n                [class.d-none]=\"!!control.hidden\"\r\n                [class.avatar-label]=\"control.uploadFileType==='IMAGE_AVATAR'\" [appTooltip]=\"control.tooltip! | translate: lang\" \r\n                [htmlTooltip]=\"control.htmlTooltip!\"\r\n                [backgroundColor]=\"'white'\"\r\n                [ngStyle]=\"{\r\n                    display: 'inline-block'\r\n                }\">\r\n                {{(control.controlType!=='CHECKBOX' && control.controlType!=='BUTTON') ? (control.label | translate: lang) : ''}}\r\n            </label>\r\n\r\n            @if (!!control.hint! && control.controlType !== 'CHECKBOX') {\r\n                <i class=\"feather-help-circle\" [appTooltip]=\"control.hint!\" [showAnyway]=\"true\" [ngStyle]=\"{\r\n                    display: 'inline-block',\r\n                    marginLeft: '2px'\r\n                }\" [class.d-none]=\"!!control.hidden\"></i>\r\n            }\r\n        }\r\n\r\n        <!-- START: FORM-CONTROL SESSION-->\r\n\r\n        <ng-container>\r\n        @switch (control.controlType) {\r\n            @case (\"CALCULATED\") {\r\n                <div class=\"calculated-view\" [htmlTooltip]=\"calculatedControlInfo\" [tooltipContext]=\"{control: control}\" [backgroundColor]=\"'#fff'\">\r\n                    <i class=\"feather-box\"></i><span>{{ control.field! }}</span>\r\n                </div>\r\n            }\r\n            @case (\"TEXTBOX\") {\r\n\r\n                <input *ngIf=\"control.type === 'date'\"\r\n                    [formControlName]=\"control.field\"\r\n                    type=\"date\"\r\n                    useValueAsDate\r\n                    class=\"form-control\"\r\n                    [readonly]=\"control.readonly\"\r\n                    [placeholder]=\"control.placeholder || ''\"\r\n                    [class.form-control-disabled]=\"!!control.disabled\" />\r\n              \r\n                <input *ngIf=\"control.type === 'time'\"\r\n                    [formControlName]=\"control.field\"\r\n                    type=\"time\"\r\n                    class=\"form-control\"\r\n                    [readonly]=\"control.readonly\"\r\n                    [placeholder]=\"control.placeholder || ''\"\r\n                    [class.form-control-disabled]=\"!!control.disabled\" />\r\n              \r\n                <input *ngIf=\"control.type === 'number'\"\r\n                    [formControlName]=\"control.field\"\r\n                    type=\"number\"\r\n                    step=\"{{ control.step || 1 }}\"\r\n                    class=\"form-control\"\r\n                    style=\"text-align: right;\"\r\n                    [readonly]=\"control.readonly\"\r\n                    [placeholder]=\"control.placeholder || ''\"\r\n                    [class.form-control-disabled]=\"!!control.disabled\" />\r\n              \r\n                <input *ngIf=\"['string', 'text', 'email', 'url', 'password'].includes(control.type || 'text')\"\r\n                    [formControlName]=\"control.field\"\r\n                    [type]=\"control.type\"\r\n                    class=\"form-control\"\r\n                    [readonly]=\"control.readonly\"\r\n                    [placeholder]=\"control.placeholder || ''\"\r\n                    [value]=\"form.get(control.field)?.value | tableCell: control.pipe : lang\"\r\n                    [attr.pattern]=\"getPattern(control) || null\"\r\n                    [appTooltip]=\"form.get(control.field)?.value\"\r\n                    (focus)=\"onFocus($event)\"\r\n                    (blur)=\"onBlur($event)\"\r\n                    [class.form-control-disabled]=\"!!control.disabled\" />\r\n\r\n                <!-- <input *ngIf=\"control.type==='calculated'\"\r\n                    [formControlName]=\"control.field\"\r\n                    type=\"text\"\r\n                    class=\"form-control\"\r\n                    [readonly]=\"true\"\r\n                    [placeholder]=\"control.placeholder || ''\"\r\n                    [value]=\"form.get(control.field)?.value | tableCell: control.pipe : lang\"\r\n                    [attr.pattern]=\"getPattern(control) || null\"\r\n                    [appTooltip]=\"form.get(control.field)?.value\"\r\n                    (focus)=\"onFocus($event)\"\r\n                    (blur)=\"onBlur($event)\"\r\n                    [class.form-control-disabled]=\"true\" /> -->\r\n\r\n            }\r\n            @case (\"CURRENCY\") {\r\n                <core-currency-input [formControlName]=\"control.field\" [placeholder]=\"control.placeholder! || ''\"></core-currency-input>\r\n            }\r\n            @case (\"TEXTAREA\") {\r\n                <textarea [rows]=\"control.textareaRows?.toString() || '3'\" [ngStyle]=\"{ height: 'unset' }\"\r\n                    [formControlName]=\"control.field\" class=\"form-control\" [readonly]=\"control.readonly\" [placeholder]=\"control.placeholder! || ''\"></textarea>\r\n            }\r\n            @case (\"CHECKBOX\") {\r\n                <core-checkbox [formControlName]=\"control.field\" [text]=\"control.label\"\r\n                    [inputValue]=\"control.value\" [tooltip]=\"control.hint!\"></core-checkbox>\r\n            }\r\n            @case (\"IOS_SWITCHER\") {\r\n                <div class=\"gap-for-ios-switcher\"></div>\r\n                <core-ios-switcher [formControlName]=\"control.field\" />\r\n            }\r\n            @case (\"MCC\") {\r\n                <core-mcc [formControlName]=\"control.field\" [columns]=\"control.columns!\" [shownFrom]=\"control.shownFrom!\" \r\n                [apiDefinition]=\"control.apiDefinition!\" [getByIdApi]=\"control.getByIdApi!\" [selectedRow$]=\"control.selectedRow$!\"\r\n                [outerParam$]=\"control.outerParam$!\"\r\n                [placeholder]=\"control.placeholder! || ''\"\r\n                ></core-mcc>\r\n            }\r\n            @case (\"DATEPICKER\") {\r\n                <core-date-picker [formControlName]=\"control.field\" [showPlaceholder]=\"control.showPlaceholder!\" [rangeLimit]=\"control.rangeLimit!\" [popupAlign]=\"control.popupAlign!\" [placeholder]=\"control.placeholder! || ''\"></core-date-picker>\r\n            }\r\n\r\n            @case (\"DROPDOWN\") {\r\n                @if (!!control.dropdownOptions$) {\r\n                    <core-dropdown \r\n                        [formControlName]=\"control.field\" \r\n                        [options$]=\"control.dropdownOptions$!\"\r\n                        [getByIdObject$]=\"control.getByIdObject$!\" \r\n                        [shownFrom]=\"control.shownFrom!\" \r\n                        [placeholder]=\"control.placeholder! || ''\"\r\n\r\n                        [optionApiDriven]=\"control.optionApiDriven!\"\r\n                        [optionApi]=\"control.optionApi!\"\r\n                        [optionHttpVerb]=\"control.optionHttpVerb!\"\r\n                        [optionHttpPayload]=\"control.optionHttpPayload!\"\r\n                        [optionValueFrom]=\"control.optionValueFrom!\"\r\n                        [optionTextFrom]=\"control.optionTextFrom!\"\r\n                    ></core-dropdown>\r\n                } @else {\r\n                    No dropdownOptions$ detected\r\n                }\r\n            }\r\n            @case (\"LIST\") {\r\n                <core-list [formControlName]=\"control.field\" [options]=\"control.listOptions!\" [placeholder]=\"control.placeholder! || ''\"></core-list>\r\n            }\r\n            @case (\"CHECKLIST\") {\r\n                @if (!!control.checklistOptions$) {\r\n                    <core-checklist [formControlName]=\"control.field\" [options$]=\"control.checklistOptions$!\"\r\n                        [getByIdObject$]=\"control.getByIdObject$!\" [shownFrom]=\"control.shownFrom!\" [placeholder]=\"control.placeholder! || ''\"></core-checklist>\r\n                }\r\n            }\r\n            @case (\"FILEUPLOADER\") {\r\n                @if (!!control.uploadFileType) {\r\n                    <core-file-uploader [formControlName]=\"control.field\" [uploadFileType]=\"control.uploadFileType\"\r\n                        [fileDataControlName]=\"control.fileDataControlName!\"\r\n                        [fileNameControlName]=\"control.fileNameControlName!\"\r\n                        [fileTypeControlName]=\"control.fileTypeControlName!\"\r\n                        [verticalMode]=\"control.verticalMode!\"></core-file-uploader>\r\n                }\r\n            }\r\n            @case (\"ATTACHMENT\") {\r\n                <core-attachment ngDefaultControl [formControlName]=\"control.field\" [assignTo]=\"control.assignTo!\"\r\n                    [valueToShow]=\"control.valueToShow!\" [placeholder]=\"control.placeholder! || ''\"></core-attachment>\r\n            }\r\n            @case (\"GRIDBUFFER\") {\r\n                @if (!!control.gridBufferFormSections && !!control.gridBufferTableColumns) {\r\n                    <core-grid-buffer [formControlName]=\"control.field\" [formSections]=\"control.gridBufferFormSections\"\r\n                        [gridColumns]=\"control.gridBufferTableColumns\"\r\n                        (onBufferFormCreated)=\"!!control.onBufferFormCreated ? control.onBufferFormCreated($event) : null\"></core-grid-buffer>\r\n                }\r\n            }\r\n            @case (\"ORGTREECHECK\") {\r\n                <core-org-tree [formControlName]=\"control.field\"\r\n                    [accessorMode]=\"coreOrgTreeDefaultAccessorMode\" [height]=\"control.height!\"></core-org-tree>\r\n            }\r\n            @case (\"RADIOGROUP\") {\r\n                <core-radio-group [formControlName]=\"control.field\"\r\n                    [options$]=\"control.radioGroupOptions$!\"\r\n                    [vertical]=\"control.verticalMode!\"\r\n                    ></core-radio-group>\r\n            }\r\n            @case (\"MONTHSELECTOR\") {\r\n                <core-month-selector [formControlName]=\"control.field\" [placeholder]=\"control.placeholder! || ''\"></core-month-selector>\r\n            }\r\n            @case (\"SHIFTCELL\") {\r\n                <core-shift-cell [formControlName]=\"control.field\"></core-shift-cell>\r\n            }\r\n            @case (\"SHIFTCOLLECTION\") {\r\n                <core-shift-collection [relativeMode]=\"true\" [height]=\"control.height || 800\"></core-shift-collection>\r\n            }\r\n            @case(\"TOPICPICKER\") {\r\n                <core-topic-picker [formControlName]=\"control.field\" [popupHeight]=\"control.popupHeight!\" [getByIdApi]=\"control.getByIdApi!\"></core-topic-picker>\r\n            }\r\n            @case (\"SEEKER\") {\r\n                @switch(control.seekerSourceType) {\r\n                    @case(\"JOB_SEEK\") {\r\n                        <core-form-control-seeker\r\n                            [excludeExistingList]=\"control.excludeExistingList!\"\r\n                            [multiMode]=\"control.multiMode!\" [multiModeTableHeight]=\"control.multiModeTableHeight!\" [multiModeRowHeight]=\"control.multiModeRowHeight!\"\r\n                            [objectList$]=\"control.objectList$!\" [formControlName]=\"control.field\"\r\n                            [seekerSourceType]=\"control.seekerSourceType!\" \r\n                            [preDefinedOuterParam$]=\"control.preDefinedOuterParam$!\"\r\n                            [preDefinedOuterFilter$]=\"control.preDefinedOuterFilter$!\"\r\n                            [boundFrom]=\"control.boundFrom!\" [shownFrom]=\"control.shownFrom!\" [alsoBindTo]=\"control.alsoBindTo!\"\r\n                            [getByIdObject$]=\"control.getByIdObject$!\"\r\n                            [click$]=\"control.click$\"\r\n                            [multiModeExtendedColumns]=\"control.multiModeExtendedColumns!\"\r\n                            [multiModeExtendedSections]=\"control.multiModeExtendedSections!\"\r\n                            [editBufferData$]=\"control.editBufferData$!\"\r\n                            [indirectBinding]=\"control.indirectBinding!\"\r\n                            [bindGridIdTo]=\"control.bindGridIdTo!\"\r\n                            [useTheseColumns]=\"control.useTheseColumns!\"\r\n                            [hideOrgTree]=\"control.hideOrgTree!\"\r\n                            [sourceSpaceHeight]=\"control.sourceSpaceHeight!\"\r\n                            (selectedDataChange)=\"selectedDataChange($event)\"\r\n                            (fullValueRowChange)=\"fullValueRowChange($event)\"\r\n                        ></core-form-control-seeker>\r\n                    }\r\n                    @case(\"EMPLOYEE_SEEK\") {\r\n                        <core-form-control-seeker\r\n                            [excludeExistingList]=\"control.excludeExistingList!\"\r\n                            [multiMode]=\"control.multiMode!\" [multiModeTableHeight]=\"control.multiModeTableHeight!\" [multiModeRowHeight]=\"control.multiModeRowHeight!\"\r\n                            [objectList$]=\"control.objectList$!\" [formControlName]=\"control.field\"\r\n                            [seekerSourceType]=\"control.seekerSourceType!\" \r\n                            [preDefinedOuterParam$]=\"control.preDefinedOuterParam$!\"\r\n                            [preDefinedOuterFilter$]=\"control.preDefinedOuterFilter$!\"\r\n                            [boundFrom]=\"control.boundFrom!\" [shownFrom]=\"control.shownFrom!\" [alsoBindTo]=\"control.alsoBindTo!\"\r\n                            [getByIdObject$]=\"control.getByIdObject$!\"\r\n                            [click$]=\"control.click$\"\r\n                            [multiModeExtendedColumns]=\"control.multiModeExtendedColumns!\"\r\n                            [multiModeExtendedSections]=\"control.multiModeExtendedSections!\"\r\n                            [editBufferData$]=\"control.editBufferData$!\"\r\n                            [indirectBinding]=\"control.indirectBinding!\"\r\n                            [bindGridIdTo]=\"control.bindGridIdTo!\"\r\n                            [useTheseColumns]=\"control.useTheseColumns!\"\r\n                            [hideOrgTree]=\"control.hideOrgTree!\"\r\n                            [sourceSpaceHeight]=\"control.sourceSpaceHeight!\"\r\n                            [placeholder]=\"control.placeholder! || ''\"\r\n                            (selectedDataChange)=\"selectedDataChange($event)\"\r\n                            (fullValueRowChange)=\"fullValueRowChange($event)\"\r\n                        ></core-form-control-seeker>\r\n                    }\r\n                    @case(\"CONTRACT_SEEK\") {\r\n                        <core-form-control-seeker\r\n                            [excludeExistingList]=\"control.excludeExistingList!\"\r\n                            [multiMode]=\"control.multiMode!\" [multiModeTableHeight]=\"control.multiModeTableHeight!\" [multiModeRowHeight]=\"control.multiModeRowHeight!\"\r\n                            [objectList$]=\"control.objectList$!\" [formControlName]=\"control.field\"\r\n                            [seekerSourceType]=\"control.seekerSourceType!\" [boundFrom]=\"control.boundFrom!\"\r\n                            [preDefinedOuterParam$]=\"control.preDefinedOuterParam$!\" \r\n                            [preDefinedOuterFilter$]=\"control.preDefinedOuterFilter$!\"\r\n                            [shownFrom]=\"control.shownFrom!\"\r\n                            [alsoBindTo]=\"control.alsoBindTo!\"\r\n                            [getByIdObject$]=\"control.getByIdObject$!\"\r\n                            [multiModeExtendedColumns]=\"control.multiModeExtendedColumns!\"\r\n                            [multiModeExtendedSections]=\"control.multiModeExtendedSections!\"\r\n                            [click$]=\"control.click$\"\r\n                            [useTheseColumns]=\"control.useTheseColumns!\"\r\n                            [hideOrgTree]=\"control.hideOrgTree!\"\r\n                            [sourceSpaceHeight]=\"control.sourceSpaceHeight!\"\r\n                            [placeholder]=\"control.placeholder! || ''\"\r\n                            (selectedDataChange)=\"selectedDataChange($event)\"\r\n                            (fullValueRowChange)=\"fullValueRowChange($event)\"\r\n                        ></core-form-control-seeker>\r\n                    }\r\n                    @case(\"WORKING_SEEK\") {\r\n                        <core-form-control-seeker \r\n                            [excludeExistingList]=\"control.excludeExistingList!\"\r\n                            [multiMode]=\"control.multiMode!\" [multiModeTableHeight]=\"control.multiModeTableHeight!\" [multiModeRowHeight]=\"control.multiModeRowHeight!\"\r\n                            [objectList$]=\"control.objectList$!\" [formControlName]=\"control.field\"\r\n                            [seekerSourceType]=\"control.seekerSourceType!\" \r\n                            [preDefinedOuterParam$]=\"control.preDefinedOuterParam$!\"\r\n                            [preDefinedOuterFilter$]=\"control.preDefinedOuterFilter$!\"\r\n                            [boundFrom]=\"control.boundFrom!\" [shownFrom]=\"control.shownFrom!\" [alsoBindTo]=\"control.alsoBindTo!\"\r\n                            [getByIdObject$]=\"control.getByIdObject$!\"\r\n                            [multiModeExtendedColumns]=\"control.multiModeExtendedColumns!\"\r\n                            [multiModeExtendedSections]=\"control.multiModeExtendedSections!\"\r\n                            [click$]=\"control.click$\"\r\n                            [useTheseColumns]=\"control.useTheseColumns!\"\r\n                            [hideOrgTree]=\"control.hideOrgTree!\"\r\n                            [sourceSpaceHeight]=\"control.sourceSpaceHeight!\"\r\n                            [placeholder]=\"control.placeholder! || ''\"\r\n                            (selectedDataChange)=\"selectedDataChange($event)\"\r\n                            (fullValueRowChange)=\"fullValueRowChange($event)\"\r\n                        ></core-form-control-seeker>\r\n                    }\r\n                    @case(\"WAGE_SEEK\") {\r\n                        <core-form-control-seeker \r\n                            [excludeExistingList]=\"control.excludeExistingList!\"\r\n                            [formControlName]=\"control.field\"\r\n                            [multiMode]=\"control.multiMode!\" [multiModeTableHeight]=\"control.multiModeTableHeight!\" [multiModeRowHeight]=\"control.multiModeRowHeight!\"\r\n                            [objectList$]=\"control.objectList$!\"\r\n                            [seekerSourceType]=\"control.seekerSourceType!\" \r\n                            [preDefinedOuterParam$]=\"control.preDefinedOuterParam$!\"\r\n                            [preDefinedOuterFilter$]=\"control.preDefinedOuterFilter$!\"\r\n                            [boundFrom]=\"control.boundFrom!\" [shownFrom]=\"control.shownFrom!\" [alsoBindTo]=\"control.alsoBindTo!\"\r\n                            [getByIdObject$]=\"control.getByIdObject$!\"\r\n                            [multiModeExtendedColumns]=\"control.multiModeExtendedColumns!\"\r\n                            [multiModeExtendedSections]=\"control.multiModeExtendedSections!\"\r\n                            [click$]=\"control.click$\"\r\n                            [useTheseColumns]=\"control.useTheseColumns!\"\r\n                            [hideOrgTree]=\"control.hideOrgTree!\"\r\n                            [sourceSpaceHeight]=\"control.sourceSpaceHeight!\"\r\n                            [placeholder]=\"control.placeholder! || ''\"\r\n                            (selectedDataChange)=\"selectedDataChange($event)\"\r\n                            (fullValueRowChange)=\"fullValueRowChange($event)\"\r\n                        ></core-form-control-seeker>\r\n                    }\r\n                    @case(\"POSITION_SEEK\") {\r\n                        <core-form-control-seeker \r\n                            [excludeExistingList]=\"control.excludeExistingList!\"\r\n                            [objectList$]=\"control.objectList$!\"\r\n                            [multiMode]=\"control.multiMode!\" [multiModeTableHeight]=\"control.multiModeTableHeight!\" [multiModeRowHeight]=\"control.multiModeRowHeight!\"\r\n                            [formControlName]=\"control.field\" [alsoBindTo]=\"control.alsoBindTo!\"\r\n                            [seekerSourceType]=\"control.seekerSourceType!\" \r\n                            [preDefinedOuterParam$]=\"control.preDefinedOuterParam$!\"\r\n                            [preDefinedOuterFilter$]=\"control.preDefinedOuterFilter$!\"\r\n                            [boundFrom]=\"control.boundFrom!\" [shownFrom]=\"control.shownFrom!\"\r\n                            [getByIdObject$]=\"control.getByIdObject$!\"\r\n                            [multiModeExtendedColumns]=\"control.multiModeExtendedColumns!\"\r\n                            [multiModeExtendedSections]=\"control.multiModeExtendedSections!\"\r\n                            [seekerVerifyIgnore]=\"control.seekerVerifyIgnore!\"\r\n                            [click$]=\"control.click$\"\r\n                            [useTheseColumns]=\"control.useTheseColumns!\"\r\n                            [hideOrgTree]=\"control.hideOrgTree!\"\r\n                            [sourceSpaceHeight]=\"control.sourceSpaceHeight!\"\r\n                            [placeholder]=\"control.placeholder! || ''\"\r\n                            (selectedDataChange)=\"selectedDataChange($event)\"\r\n                            (fullValueRowChange)=\"fullValueRowChange($event)\"\r\n                        ></core-form-control-seeker>\r\n                    }\r\n                    @case(\"POSITION_CONCURRENT_SEEK\") {\r\n                        <core-form-control-seeker\r\n                            [excludeExistingList]=\"control.excludeExistingList!\"\r\n                            [multiMode]=\"control.multiMode!\" [multiModeTableHeight]=\"control.multiModeTableHeight!\" [multiModeRowHeight]=\"control.multiModeRowHeight!\"\r\n                            [formControlName]=\"control.field\" [alsoBindTo]=\"control.alsoBindTo!\"\r\n                            [seekerSourceType]=\"control.seekerSourceType!\" \r\n                            [preDefinedOuterParam$]=\"control.preDefinedOuterParam$!\"\r\n                            [preDefinedOuterFilter$]=\"control.preDefinedOuterFilter$!\"\r\n                            [boundFrom]=\"control.boundFrom!\" [shownFrom]=\"control.shownFrom!\"\r\n                            [getByIdObject$]=\"control.getByIdObject$!\"\r\n                            [multiModeExtendedColumns]=\"control.multiModeExtendedColumns!\"\r\n                            [multiModeExtendedSections]=\"control.multiModeExtendedSections!\"\r\n                            [multiModeTableHeight]=\"control.multiModeTableHeight!\"\r\n                            [click$]=\"control.click$\"\r\n                            [useTheseColumns]=\"control.useTheseColumns!\"\r\n                            [hideOrgTree]=\"control.hideOrgTree!\"\r\n                            [sourceSpaceHeight]=\"control.sourceSpaceHeight!\"\r\n                            [placeholder]=\"control.placeholder! || ''\"\r\n                            (selectedDataChange)=\"selectedDataChange($event)\"\r\n                            (fullValueRowChange)=\"fullValueRowChange($event)\"\r\n                        ></core-form-control-seeker>\r\n                    }\r\n                    @case(\"FORM_SEEK\") {\r\n                        <core-form-control-seeker\r\n                            [excludeExistingList]=\"control.excludeExistingList!\"\r\n                            [multiMode]=\"control.multiMode!\" [multiModeTableHeight]=\"control.multiModeTableHeight!\" [multiModeRowHeight]=\"control.multiModeRowHeight!\"\r\n                            [formControlName]=\"control.field\" [alsoBindTo]=\"control.alsoBindTo!\"\r\n                            [seekerSourceType]=\"control.seekerSourceType!\" \r\n                            [preDefinedOuterParam$]=\"control.preDefinedOuterParam$!\"\r\n                            [preDefinedOuterFilter$]=\"control.preDefinedOuterFilter$!\"\r\n                            [boundFrom]=\"control.boundFrom!\" [shownFrom]=\"control.shownFrom!\"\r\n                            [getByIdObject$]=\"control.getByIdObject$!\"\r\n                            [multiModeExtendedColumns]=\"control.multiModeExtendedColumns!\"\r\n                            [multiModeExtendedSections]=\"control.multiModeExtendedSections!\"\r\n                            [multiModeTableHeight]=\"control.multiModeTableHeight!\"\r\n                            [click$]=\"control.click$\"\r\n                            [useTheseColumns]=\"control.useTheseColumns!\"\r\n                            [hideOrgTree]=\"control.hideOrgTree!\"\r\n                            [sourceSpaceHeight]=\"control.sourceSpaceHeight!\"\r\n                            [placeholder]=\"control.placeholder! || ''\"\r\n                            (selectedDataChange)=\"selectedDataChange($event)\"\r\n                            (fullValueRowChange)=\"fullValueRowChange($event)\"\r\n                        ></core-form-control-seeker>\r\n                    }\r\n                    @case(\"ORGANIZATION_UNIT_SEEK\") {\r\n                        <core-form-control-seeker\r\n                            [formControlName]=\"control.field\" [seekerSourceType]=\"control.seekerSourceType!\"\r\n                            [boundFrom]=\"control.boundFrom!\" [alsoBindTo]=\"control.alsoBindTo!\" [shownFrom]=\"control.shownFrom!\"\r\n                            [getByIdObject$]=\"control.getByIdObject$!\"\r\n                            [click$]=\"control.click$\"\r\n                            [placeholder]=\"control.placeholder! || ''\"\r\n                        ></core-form-control-seeker>\r\n                    }\r\n                }\r\n            }\r\n        }\r\n        </ng-container>\r\n\r\n        @if (control.controlType==='BUTTON') {\r\n        <ng-container>\r\n            <button type=\"button\" class=\"btn btn-secondary text\" (click)=\"oHandleClick($event)\">{{control.label| translate: lang}}</button>\r\n        </ng-container>\r\n        }\r\n        <!-- END: FORM-CONTROL SESSION-->\r\n\r\n        <!-- START: ERROR SESSION-->\r\n        @if (!!errors!.length) {\r\n        <div>\r\n            @for (error of errors; track $index) {\r\n            <div class=\"form-control-error\">\r\n                {{ error.errorMessage | translate: lang }}\r\n            </div>\r\n            }\r\n        </div>\r\n        }\r\n\r\n        @if (!errors!.length && !!checkError$.value) {\r\n        <div>\r\n            <div>\r\n                {{ '&nbsp;' }}\r\n            </div>\r\n        </div>\r\n        }\r\n        <!-- END: ERROR SESSION-->\r\n\r\n    </div>\r\n\r\n\r\n</div>\r\n\r\n<ng-template #calculatedControlInfo let-control=\"control\">\r\n    <div class=\"calculated-tooltip-container\">\r\n        <div class=\"calculated-field-row\">\r\n        <span class=\"label\">Name:</span>\r\n        <span class=\"value\">{{ control?.field || 'N/A' }}</span>\r\n        </div>        \r\n        <div class=\"calculated-field-row\">\r\n        <span class=\"label\">Evaluation Mode:</span>\r\n        <span class=\"value\">{{ control?.evaluationMode || 'N/A' }}</span>\r\n        </div>\r\n        <div class=\"calculated-field-row\">\r\n        <span class=\"label\">Return Type:</span>\r\n        <span class=\"value\">{{ control?.returnType || 'N/A' }}</span>\r\n        </div>\r\n        <div class=\"calculated-field-row\">\r\n        <span class=\"label\">Depends On:</span>\r\n        <span class=\"value\" *ngIf=\"control?.dependsOn?.length > 0; else noDepends\">\r\n            <code *ngFor=\"let dep of control?.dependsOn; let last = last\">{{ dep }}<span *ngIf=\"!last\">, </span></code>\r\n        </span>\r\n        <ng-template #noDepends><em class=\"no-depends\">None</em></ng-template>\r\n        </div>\r\n        <div *ngIf=\"!!control?.isUnsafe\" class=\"warning\">\r\n        \u26A0\uFE0F This script is marked as <strong>unsafe</strong> and will not be executed.\r\n        </div>\r\n        <div class=\"calculated-field-row\">\r\n        <span class=\"label\">Script:</span>\r\n        <pre class=\"code-block\">{{ control?.script || 'No script provided.' }}</pre>\r\n        </div>\r\n    </div>\r\n</ng-template>", styles: [".core-control-container{font-size:var(--typo-basic-font-size)!important}.core-control-container .control-label{color:#848484}.core-control-container>div.hidden{display:none}.core-control-container label{color:#464646}.core-control-container label.required:after{content:\"*\";color:#ff040b}.core-control-container label.avatar-label{width:var(--size-file-uploader);display:flex;align-items:center;justify-content:center}.core-control-container input[type=number]{padding-right:12px;position:relative}.core-control-container input[type=number]::-webkit-inner-spin-button{position:absolute;right:.3em;margin-left:.5em}.core-control-container input[type=number]{-moz-appearance:textfield}.core-control-container i.feather-help-circle{color:#848484}.core-control-container .gap-for-ios-switcher{height:5px}.core-control-container .calculated-view{-webkit-user-select:none;user-select:none;cursor:pointer;height:35px;width:160px;background-color:#d8f3dc;color:#1b4332;border:1px solid #95d5b2;border-radius:50px;font-size:14px;font-weight:500;display:flex;align-items:center;justify-content:flex-start;font-family:Segoe UI,sans-serif;letter-spacing:.5px;padding:8px}.core-control-container .calculated-view i{font-size:18px;width:18px;height:18px;margin-right:8px}.core-control-container .calculated-view span{width:calc(100% - 26px);overflow:hidden;text-overflow:ellipsis;text-wrap:nowrap}.calculated-tooltip-container{background-color:#fff;border:1px solid #ddd;padding:1rem;border-radius:6px;font-size:14px;color:#333;box-shadow:0 4px 10px #0000000d;max-width:360px}.calculated-tooltip-container .calculated-field-row{margin-bottom:.75rem}.calculated-tooltip-container .label{font-weight:500;color:#555!important;display:inline-block;min-width:140px}.calculated-tooltip-container .value{color:#222!important}.calculated-tooltip-container .warning{color:#b91c1c;background:#fef2f2;border:1px solid #fca5a5;padding:.5rem;border-radius:4px;margin-bottom:1rem;font-size:13px}.calculated-tooltip-container .code-block{background:#f8f9fa;border:1px solid #ddd;padding:.75rem;font-family:monospace;font-size:12px;white-space:pre-wrap;color:#111!important;border-radius:4px;overflow-x:auto}.calculated-tooltip-container .no-depends{color:#888;font-style:italic}.calculated-tooltip-container pre{overflow:hidden}.calculated-tooltip-container label.required~input:not([disabled]),.calculated-tooltip-container label.required~textarea:not([disabled]),.calculated-tooltip-container label.required~select:not([disabled]){background-color:#ff0!important}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$3.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: i1$3.NumberValueAccessor, selector: "input[type=number][formControlName],input[type=number][formControl],input[type=number][ngModel]" }, { kind: "directive", type: i1$3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$3.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$3.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$3.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "pipe", type: TranslatePipe, name: "translate" }, { kind: "pipe", type: TableCellPipe, name: "tableCell" }, { kind: "component", type: CoreDropdownComponent, selector: "core-dropdown", inputs: ["getByIdObject$", "paramMode", "shownFrom", "options$", "height", "placeholder", "loading", "warningDisable", "clearDisable", "fitHeightWithItemCount", "itemHeight", "optionApiDriven", "optionApi", "optionHttpVerb", "optionHttpPayload", "optionValueFrom", "optionTextFrom"] }, { kind: "component", type: CoreListComponent, selector: "core-list", inputs: ["title", "height", "options", "placeholder"] }, { kind: "component", type: CoreChecklistComponent, selector: "core-checklist", inputs: ["paramMode", "getByIdObject$", "shownFrom", "options$", "height", "placeholder", "loading", "readonly", "disabled"] }, { kind: "component", type: CoreFormControlSeekerComponent, selector: "core-form-control-seeker", inputs: ["title", "showPageHeader", "preDefinedOuterParam$", "preDefinedOuterFilter$", "click$", "getByIdObject$", "getByIdApi", "paramMode", "multiMode", "objectList$", "useTheseColumns", "hideOrgTree", "excludedColumns", "excludeExistingList", "placeholder", "sourceSpaceHeight", "indirectBinding", "bindGridIdTo", "multiModeExtendedColumns", "multiModeExtendedSections", "editBufferData$", "multiModeTableHeight", "multiModeRowHeight", "seekerSourceType", "boundFrom", "shownFrom", "alsoBindTo", "seekerVerifyIgnore", "disabledDoubleClick"], outputs: ["onDoubleClick", "selectedDataChange", "fullValueRowChange"] }, { kind: "component", type: CoreCheckboxComponent, selector: "core-checkbox", inputs: ["text", "tooltipPosition", "tooltip", "inputValue", "disabled"], outputs: ["onClick"] }, { kind: "component", type: CoreFileUploaderComponent, selector: "core-file-uploader", inputs: ["uploadFileType", "fileDataControlName", "fileNameControlName", "fileTypeControlName", "avatarSize", "defaultAvatar", "hidePreview", "verticalMode"] }, { kind: "component", type: CoreAttachmentComponent, selector: "core-attachment", inputs: ["assignTo", "readonly", "valueToShow", "placeholder", "upFlag$", "downFlag$"] }, { kind: "component", type: CoreGridBufferComponent, selector: "core-grid-buffer", inputs: ["padding", "placeholder", "tableHeight", "liteMode", "formSections", "gridColumns"], outputs: ["onBufferFormCreated"] }, { kind: "component", type: CoreDatePickerComponent, selector: "core-date-picker", inputs: ["enableTimeZoneConverter", "showPlaceholder", "popupWidth", "popupXPadding", "popupAlign", "rangeLimit", "placeholder", "readonly", "disabled"] }, { kind: "component", type: CoreOrgTreeComponent, selector: "core-org-tree", inputs: ["lineColor", "fullWidthMode", "accessorMode", "searchMode", "fullRendering", "height", "disabledLoopExpand", "showCheckInheritance", "excludedIds$", "stateIsolated$"], outputs: ["itemDoubleClick", "itemClick"] }, { kind: "component", type: CoreRadioGroupComponent, selector: "core-radio-group", inputs: ["options$", "vertical", "columnCount", "gapY", "defaultValue"] }, { kind: "component", type: CoreMccComponent, selector: "core-mcc", inputs: ["height", "columns", "shownFrom", "apiDefinition", "getByIdApi", "outerParam$", "selectedRow$", "outerFilterOperators", "outerInOperators", "placeholder"] }, { kind: "component", type: CoreMonthSelectorComponent, selector: "core-month-selector", inputs: ["align", "placeholder"], outputs: ["onYearClick"] }, { kind: "directive", type: TooltipDirective, selector: "[appTooltip]", inputs: ["appTooltip", "showAnyway", "color", "backgroundColor", "position"] }, { kind: "component", type: CoreCurrencyInputComponent, selector: "core-currency-input", inputs: ["currencySign", "placeholder"], outputs: ["onLeftFocus"] }, { kind: "component", type: CoreShiftCellComponent, selector: "core-shift-cell", inputs: ["$readOnly", "$hideStarterPlusSign", "$hideStickersWhileDragover", "$backgroundColor"] }, { kind: "component", type: CoreShiftCollectionComponent, selector: "core-shift-collection", inputs: ["height", "relativeMode"] }, { kind: "component", type: CoreTopicPickerComponent, selector: "core-topic-picker", inputs: ["popupHeight", "getByIdApi"] }, { kind: "component", type: CoreIosSwitcherComponent, selector: "core-ios-switcher", inputs: ["bgColor", "showOnOffText", "width", "height", "readonly"] }, { kind: "directive", type: HtmlTooltipDirective, selector: "[htmlTooltip]", inputs: ["htmlTooltip", "tooltipContext", "maxWidthUnset", "backgroundColor", "hold$"] }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.5", type: CoreControlNoFormArrayComponent, isStandalone: true, selector: "core-control-no-form-array", inputs: { control: "control", checkError$: "checkError$", rangeLimit: "rangeLimit", readonly: "readonly", disabled: "disabled" }, host: { listeners: { "window:click": "onWindowClick()" } }, usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "<div class=\"core-control-container\">\r\n\r\n    <div [formGroup]=\"form\" [class.hidden]=\"!!control.hidden\">\r\n\r\n        @if (!control.headless!) {\r\n            <label [class]=\"'control-label' +  (required ? ' required' : '')\" [attr.for]=\"control.field\"\r\n                [class.d-none]=\"!!control.hidden\"\r\n                [class.avatar-label]=\"control.uploadFileType==='IMAGE_AVATAR'\" [appTooltip]=\"control.tooltip! | translate: lang\" \r\n                [htmlTooltip]=\"control.htmlTooltip!\"\r\n                [backgroundColor]=\"'white'\"\r\n                [ngStyle]=\"{\r\n                    display: 'inline-block'\r\n                }\">\r\n                {{(control.controlType!=='CHECKBOX' && control.controlType!=='BUTTON') ? (control.label | translate: lang) : ''}}\r\n            </label>\r\n\r\n            @if (!!control.hint! && control.controlType !== 'CHECKBOX') {\r\n                <i class=\"feather-help-circle\" [appTooltip]=\"control.hint!\" [showAnyway]=\"true\" [ngStyle]=\"{\r\n                    display: 'inline-block',\r\n                    marginLeft: '2px'\r\n                }\" [class.d-none]=\"!!control.hidden\"></i>\r\n            }\r\n        }\r\n\r\n        <!-- START: FORM-CONTROL SESSION-->\r\n\r\n        <ng-container>\r\n        @switch (control.controlType) {\r\n            @case (\"CALCULATED\") {\r\n                <div class=\"calculated-view\" [htmlTooltip]=\"calculatedControlInfo\" [tooltipContext]=\"{control: control}\" [backgroundColor]=\"'#fff'\">\r\n                    <i class=\"feather-box\"></i><span>{{ control.field! }}</span>\r\n                </div>\r\n            }\r\n            @case (\"TEXTBOX\") {\r\n\r\n                <input *ngIf=\"control.type === 'date'\"\r\n                    [formControlName]=\"control.field\"\r\n                    type=\"date\"\r\n                    useValueAsDate\r\n                    class=\"form-control\"\r\n                    [placeholder]=\"control.placeholder || ''\"\r\n                    [class.form-control-disabled]=\"disabled || !!control.disabled\" />\r\n              \r\n                <input *ngIf=\"control.type === 'time'\"\r\n                    [formControlName]=\"control.field\"\r\n                    type=\"time\"\r\n                    class=\"form-control\"\r\n                    [placeholder]=\"control.placeholder || ''\"\r\n                    [class.form-control-disabled]=\"disabled || !!control.disabled\" />\r\n              \r\n                <input *ngIf=\"control.type === 'number'\"\r\n                    [formControlName]=\"control.field\"\r\n                    type=\"number\"\r\n                    step=\"{{ control.step || 1 }}\"\r\n                    class=\"form-control\"\r\n                    style=\"text-align: right;\"\r\n                    [placeholder]=\"control.placeholder || ''\"\r\n                    [class.form-control-disabled]=\"disabled || !!control.disabled\" />\r\n              \r\n                <input *ngIf=\"['string', 'text', 'email', 'url', 'password'].includes(control.type || 'text')\"\r\n                    [formControlName]=\"control.field\"\r\n                    [type]=\"control.type\"\r\n                    class=\"form-control\"\r\n                    [placeholder]=\"control.placeholder || ''\"\r\n                    [value]=\"form.get(control.field)?.value | tableCell: control.pipe : lang\"\r\n                    [attr.pattern]=\"getPattern(control) || null\"\r\n                    [appTooltip]=\"form.get(control.field)?.value\"\r\n                    (focus)=\"onFocus($event)\"\r\n                    (blur)=\"onBlur($event)\"\r\n                    [class.form-control-disabled]=\"disabled || !!control.disabled\" />\r\n\r\n                <!-- <input *ngIf=\"control.type==='calculated'\"\r\n                    [formControlName]=\"control.field\"\r\n                    type=\"text\"\r\n                    class=\"form-control\"\r\n                    [readonly]=\"true\"\r\n                    [placeholder]=\"control.placeholder || ''\"\r\n                    [value]=\"form.get(control.field)?.value | tableCell: control.pipe : lang\"\r\n                    [attr.pattern]=\"getPattern(control) || null\"\r\n                    [appTooltip]=\"form.get(control.field)?.value\"\r\n                    (focus)=\"onFocus($event)\"\r\n                    (blur)=\"onBlur($event)\"\r\n                    [class.form-control-disabled]=\"true\" /> -->\r\n\r\n            }\r\n            @case (\"CURRENCY\") {\r\n                <core-currency-input \r\n                    [disabled]=\"!!disabled || !!control.disabled\"\r\n                    [formControlName]=\"control.field\" [placeholder]=\"control.placeholder! || ''\"></core-currency-input>\r\n            }\r\n            @case (\"TEXTAREA\") {\r\n                <textarea \r\n                    [rows]=\"control.textareaRows?.toString() || '3'\" [ngStyle]=\"{ height: 'unset' }\"\r\n                    [class.form-control-disabled]=\"disabled || !!control.disabled\"\r\n                    [formControlName]=\"control.field\" class=\"form-control\" [readonly]=\"control.readonly\" [placeholder]=\"control.placeholder! || ''\"></textarea>\r\n            }\r\n            @case (\"CHECKBOX\") {\r\n                <core-checkbox \r\n                    [disabled]=\"!!disabled || !!control.disabled\"\r\n                    [formControlName]=\"control.field\" [text]=\"control.label\"\r\n                    [inputValue]=\"control.value\" [tooltip]=\"control.hint!\"></core-checkbox>\r\n            }\r\n            @case (\"IOS_SWITCHER\") {\r\n                <div class=\"gap-for-ios-switcher\"></div>\r\n                <core-ios-switcher [disabled]=\"!!disabled || !!control.disabled\" [formControlName]=\"control.field\" />\r\n            }\r\n            @case (\"MCC\") {\r\n                <core-mcc [formControlName]=\"control.field\" [columns]=\"control.columns!\" [shownFrom]=\"control.shownFrom!\" \r\n                [apiDefinition]=\"control.apiDefinition!\" [getByIdApi]=\"control.getByIdApi!\" [selectedRow$]=\"control.selectedRow$!\"\r\n                [outerParam$]=\"control.outerParam$!\"\r\n                [disabled]=\"!!disabled || !!control.disabled\"\r\n                [placeholder]=\"control.placeholder! || ''\"\r\n                ></core-mcc>\r\n            }\r\n            @case (\"DATEPICKER\") {\r\n                <core-date-picker \r\n                    [disabled]=\"!!disabled || !!control.disabled\"\r\n                    [formControlName]=\"control.field\" [showPlaceholder]=\"control.showPlaceholder!\" [rangeLimit]=\"control.rangeLimit!\" [popupAlign]=\"control.popupAlign!\" [placeholder]=\"control.placeholder! || ''\"></core-date-picker>\r\n            }\r\n\r\n            @case (\"DROPDOWN\") {\r\n                @if (!!control.dropdownOptions$) {\r\n                    <core-dropdown \r\n                        [formControlName]=\"control.field\" \r\n                        [options$]=\"control.dropdownOptions$!\"\r\n                        [getByIdObject$]=\"control.getByIdObject$!\" \r\n                        [shownFrom]=\"control.shownFrom!\" \r\n                        [placeholder]=\"control.placeholder! || ''\"\r\n                        [disabled]=\"!!disabled || !!control.disabled\"\r\n                        [optionApiDriven]=\"control.optionApiDriven!\"\r\n                        [optionApi]=\"control.optionApi!\"\r\n                        [optionHttpVerb]=\"control.optionHttpVerb!\"\r\n                        [optionHttpPayload]=\"control.optionHttpPayload!\"\r\n                        [optionValueFrom]=\"control.optionValueFrom!\"\r\n                        [optionTextFrom]=\"control.optionTextFrom!\"\r\n                    ></core-dropdown>\r\n                } @else {\r\n                    No dropdownOptions$ detected\r\n                }\r\n            }\r\n            @case (\"LIST\") {\r\n                <core-list \r\n                    [disabled]=\"!!disabled || !!control.disabled\"\r\n                    [formControlName]=\"control.field\" [options]=\"control.listOptions!\" [placeholder]=\"control.placeholder! || ''\"></core-list>\r\n            }\r\n            @case (\"CHECKLIST\") {\r\n                @if (!!control.checklistOptions$) {\r\n                    <core-checklist \r\n                        [disabled]=\"!!disabled || !!control.disabled\"\r\n                        [formControlName]=\"control.field\" [options$]=\"control.checklistOptions$!\"\r\n                        [getByIdObject$]=\"control.getByIdObject$!\" [shownFrom]=\"control.shownFrom!\" [placeholder]=\"control.placeholder! || ''\"></core-checklist>\r\n                }\r\n            }\r\n            @case (\"FILEUPLOADER\") {\r\n                @if (!!control.uploadFileType) {\r\n                    <core-file-uploader \r\n                        [disabled]=\"!!disabled || !!control.disabled\"\r\n                        [formControlName]=\"control.field\" [uploadFileType]=\"control.uploadFileType\"\r\n                        [fileDataControlName]=\"control.fileDataControlName!\"\r\n                        [fileNameControlName]=\"control.fileNameControlName!\"\r\n                        [fileTypeControlName]=\"control.fileTypeControlName!\"\r\n                        [verticalMode]=\"control.verticalMode!\"></core-file-uploader>\r\n                }\r\n            }\r\n            @case (\"ATTACHMENT\") {\r\n                <core-attachment ngDefaultControl [formControlName]=\"control.field\" [assignTo]=\"control.assignTo!\"\r\n                    [disabled]=\"!!disabled || !!control.disabled\"\r\n                    [valueToShow]=\"control.valueToShow!\" [placeholder]=\"control.placeholder! || ''\"></core-attachment>\r\n            }\r\n            @case (\"GRIDBUFFER\") {\r\n                @if (!!control.gridBufferFormSections && !!control.gridBufferTableColumns) {\r\n                    <core-grid-buffer [formControlName]=\"control.field\" [formSections]=\"control.gridBufferFormSections\"\r\n                        [disabled]=\"!!disabled || !!control.disabled\"\r\n                        [gridColumns]=\"control.gridBufferTableColumns\"\r\n                        (onBufferFormCreated)=\"!!control.onBufferFormCreated ? control.onBufferFormCreated($event) : null\"></core-grid-buffer>\r\n                }\r\n            }\r\n            @case (\"ORGTREECHECK\") {\r\n                <core-org-tree \r\n                    [disabled]=\"!!disabled || !!control.disabled\"\r\n                    [formControlName]=\"control.field\"\r\n                    [accessorMode]=\"coreOrgTreeDefaultAccessorMode\" [height]=\"control.height!\"></core-org-tree>\r\n            }\r\n            @case (\"RADIOGROUP\") {\r\n                <core-radio-group [formControlName]=\"control.field\"\r\n                    [disabled]=\"!!disabled || !!control.disabled\"\r\n                    [options$]=\"control.radioGroupOptions$!\"\r\n                    [vertical]=\"control.verticalMode!\"\r\n                    ></core-radio-group>\r\n            }\r\n            @case (\"MONTHSELECTOR\") {\r\n                <core-month-selector \r\n                    [disabled]=\"!!disabled || !!control.disabled\"\r\n                    [formControlName]=\"control.field\" [placeholder]=\"control.placeholder! || ''\"></core-month-selector>\r\n            }\r\n            @case (\"SHIFTCELL\") {\r\n                <core-shift-cell \r\n                    [disabled]=\"!!disabled || !!control.disabled\"\r\n                    [formControlName]=\"control.field\"></core-shift-cell>\r\n            }\r\n            @case (\"SHIFTCOLLECTION\") {\r\n                <core-shift-collection \r\n                    [disabled]=\"!!disabled || !!control.disabled\"\r\n                    [relativeMode]=\"true\" [height]=\"control.height || 800\"></core-shift-collection>\r\n            }\r\n            @case(\"TOPICPICKER\") {\r\n                <core-topic-picker \r\n                    [disabled]=\"!!disabled || !!control.disabled\"\r\n                    [formControlName]=\"control.field\" [popupHeight]=\"control.popupHeight!\" [getByIdApi]=\"control.getByIdApi!\"></core-topic-picker>\r\n            }\r\n            @case (\"SEEKER\") {\r\n                @switch(control.seekerSourceType) {\r\n                    @case(\"JOB_SEEK\") {\r\n                        <core-form-control-seeker\r\n                            [disabled]=\"!!disabled || !!control.disabled\"\r\n                            [excludeExistingList]=\"control.excludeExistingList!\"\r\n                            [multiMode]=\"control.multiMode!\" [multiModeTableHeight]=\"control.multiModeTableHeight!\" [multiModeRowHeight]=\"control.multiModeRowHeight!\"\r\n                            [objectList$]=\"control.objectList$!\" [formControlName]=\"control.field\"\r\n                            [seekerSourceType]=\"control.seekerSourceType!\" \r\n                            [preDefinedOuterParam$]=\"control.preDefinedOuterParam$!\"\r\n                            [preDefinedOuterFilter$]=\"control.preDefinedOuterFilter$!\"\r\n                            [boundFrom]=\"control.boundFrom!\" [shownFrom]=\"control.shownFrom!\" [alsoBindTo]=\"control.alsoBindTo!\"\r\n                            [getByIdObject$]=\"control.getByIdObject$!\"\r\n                            [click$]=\"control.click$\"\r\n                            [multiModeExtendedColumns]=\"control.multiModeExtendedColumns!\"\r\n                            [multiModeExtendedSections]=\"control.multiModeExtendedSections!\"\r\n                            [editBufferData$]=\"control.editBufferData$!\"\r\n                            [indirectBinding]=\"control.indirectBinding!\"\r\n                            [bindGridIdTo]=\"control.bindGridIdTo!\"\r\n                            [useTheseColumns]=\"control.useTheseColumns!\"\r\n                            [hideOrgTree]=\"control.hideOrgTree!\"\r\n                            [sourceSpaceHeight]=\"control.sourceSpaceHeight!\"\r\n                            (selectedDataChange)=\"selectedDataChange($event)\"\r\n                            (fullValueRowChange)=\"fullValueRowChange($event)\"\r\n                        ></core-form-control-seeker>\r\n                    }\r\n                    @case(\"EMPLOYEE_SEEK\") {\r\n                        <core-form-control-seeker\r\n                            [excludeExistingList]=\"control.excludeExistingList!\"\r\n                            [disabled]=\"!!disabled || !!control.disabled\"\r\n                            [multiMode]=\"control.multiMode!\" [multiModeTableHeight]=\"control.multiModeTableHeight!\" [multiModeRowHeight]=\"control.multiModeRowHeight!\"\r\n                            [objectList$]=\"control.objectList$!\" [formControlName]=\"control.field\"\r\n                            [seekerSourceType]=\"control.seekerSourceType!\" \r\n                            [preDefinedOuterParam$]=\"control.preDefinedOuterParam$!\"\r\n                            [preDefinedOuterFilter$]=\"control.preDefinedOuterFilter$!\"\r\n                            [boundFrom]=\"control.boundFrom!\" [shownFrom]=\"control.shownFrom!\" [alsoBindTo]=\"control.alsoBindTo!\"\r\n                            [getByIdObject$]=\"control.getByIdObject$!\"\r\n                            [click$]=\"control.click$\"\r\n                            [multiModeExtendedColumns]=\"control.multiModeExtendedColumns!\"\r\n                            [multiModeExtendedSections]=\"control.multiModeExtendedSections!\"\r\n                            [editBufferData$]=\"control.editBufferData$!\"\r\n                            [indirectBinding]=\"control.indirectBinding!\"\r\n                            [bindGridIdTo]=\"control.bindGridIdTo!\"\r\n                            [useTheseColumns]=\"control.useTheseColumns!\"\r\n                            [hideOrgTree]=\"control.hideOrgTree!\"\r\n                            [sourceSpaceHeight]=\"control.sourceSpaceHeight!\"\r\n                            [placeholder]=\"control.placeholder! || ''\"\r\n                            (selectedDataChange)=\"selectedDataChange($event)\"\r\n                            (fullValueRowChange)=\"fullValueRowChange($event)\"\r\n                        ></core-form-control-seeker>\r\n                    }\r\n                    @case(\"CONTRACT_SEEK\") {\r\n                        <core-form-control-seeker\r\n                            [disabled]=\"!!disabled || !!control.disabled\"\r\n                            [excludeExistingList]=\"control.excludeExistingList!\"\r\n                            [multiMode]=\"control.multiMode!\" [multiModeTableHeight]=\"control.multiModeTableHeight!\" [multiModeRowHeight]=\"control.multiModeRowHeight!\"\r\n                            [objectList$]=\"control.objectList$!\" [formControlName]=\"control.field\"\r\n                            [seekerSourceType]=\"control.seekerSourceType!\" [boundFrom]=\"control.boundFrom!\"\r\n                            [preDefinedOuterParam$]=\"control.preDefinedOuterParam$!\" \r\n                            [preDefinedOuterFilter$]=\"control.preDefinedOuterFilter$!\"\r\n                            [shownFrom]=\"control.shownFrom!\"\r\n                            [alsoBindTo]=\"control.alsoBindTo!\"\r\n                            [getByIdObject$]=\"control.getByIdObject$!\"\r\n                            [multiModeExtendedColumns]=\"control.multiModeExtendedColumns!\"\r\n                            [multiModeExtendedSections]=\"control.multiModeExtendedSections!\"\r\n                            [click$]=\"control.click$\"\r\n                            [useTheseColumns]=\"control.useTheseColumns!\"\r\n                            [hideOrgTree]=\"control.hideOrgTree!\"\r\n                            [sourceSpaceHeight]=\"control.sourceSpaceHeight!\"\r\n                            [placeholder]=\"control.placeholder! || ''\"\r\n                            (selectedDataChange)=\"selectedDataChange($event)\"\r\n                            (fullValueRowChange)=\"fullValueRowChange($event)\"\r\n                        ></core-form-control-seeker>\r\n                    }\r\n                    @case(\"WORKING_SEEK\") {\r\n                        <core-form-control-seeker \r\n                            [disabled]=\"!!disabled || !!control.disabled\"\r\n                            [excludeExistingList]=\"control.excludeExistingList!\"\r\n                            [multiMode]=\"control.multiMode!\" [multiModeTableHeight]=\"control.multiModeTableHeight!\" [multiModeRowHeight]=\"control.multiModeRowHeight!\"\r\n                            [objectList$]=\"control.objectList$!\" [formControlName]=\"control.field\"\r\n                            [seekerSourceType]=\"control.seekerSourceType!\" \r\n                            [preDefinedOuterParam$]=\"control.preDefinedOuterParam$!\"\r\n                            [preDefinedOuterFilter$]=\"control.preDefinedOuterFilter$!\"\r\n                            [boundFrom]=\"control.boundFrom!\" [shownFrom]=\"control.shownFrom!\" [alsoBindTo]=\"control.alsoBindTo!\"\r\n                            [getByIdObject$]=\"control.getByIdObject$!\"\r\n                            [multiModeExtendedColumns]=\"control.multiModeExtendedColumns!\"\r\n                            [multiModeExtendedSections]=\"control.multiModeExtendedSections!\"\r\n                            [click$]=\"control.click$\"\r\n                            [useTheseColumns]=\"control.useTheseColumns!\"\r\n                            [hideOrgTree]=\"control.hideOrgTree!\"\r\n                            [sourceSpaceHeight]=\"control.sourceSpaceHeight!\"\r\n                            [placeholder]=\"control.placeholder! || ''\"\r\n                            (selectedDataChange)=\"selectedDataChange($event)\"\r\n                            (fullValueRowChange)=\"fullValueRowChange($event)\"\r\n                        ></core-form-control-seeker>\r\n                    }\r\n                    @case(\"WAGE_SEEK\") {\r\n                        <core-form-control-seeker \r\n                            [disabled]=\"!!disabled || !!control.disabled\"\r\n                            [excludeExistingList]=\"control.excludeExistingList!\"\r\n                            [formControlName]=\"control.field\"\r\n                            [multiMode]=\"control.multiMode!\" [multiModeTableHeight]=\"control.multiModeTableHeight!\" [multiModeRowHeight]=\"control.multiModeRowHeight!\"\r\n                            [objectList$]=\"control.objectList$!\"\r\n                            [seekerSourceType]=\"control.seekerSourceType!\" \r\n                            [preDefinedOuterParam$]=\"control.preDefinedOuterParam$!\"\r\n                            [preDefinedOuterFilter$]=\"control.preDefinedOuterFilter$!\"\r\n                            [boundFrom]=\"control.boundFrom!\" [shownFrom]=\"control.shownFrom!\" [alsoBindTo]=\"control.alsoBindTo!\"\r\n                            [getByIdObject$]=\"control.getByIdObject$!\"\r\n                            [multiModeExtendedColumns]=\"control.multiModeExtendedColumns!\"\r\n                            [multiModeExtendedSections]=\"control.multiModeExtendedSections!\"\r\n                            [click$]=\"control.click$\"\r\n                            [useTheseColumns]=\"control.useTheseColumns!\"\r\n                            [hideOrgTree]=\"control.hideOrgTree!\"\r\n                            [sourceSpaceHeight]=\"control.sourceSpaceHeight!\"\r\n                            [placeholder]=\"control.placeholder! || ''\"\r\n                            (selectedDataChange)=\"selectedDataChange($event)\"\r\n                            (fullValueRowChange)=\"fullValueRowChange($event)\"\r\n                        ></core-form-control-seeker>\r\n                    }\r\n                    @case(\"POSITION_SEEK\") {\r\n                        <core-form-control-seeker \r\n                            [disabled]=\"!!disabled || !!control.disabled\"\r\n                            [excludeExistingList]=\"control.excludeExistingList!\"\r\n                            [objectList$]=\"control.objectList$!\"\r\n                            [multiMode]=\"control.multiMode!\" [multiModeTableHeight]=\"control.multiModeTableHeight!\" [multiModeRowHeight]=\"control.multiModeRowHeight!\"\r\n                            [formControlName]=\"control.field\" [alsoBindTo]=\"control.alsoBindTo!\"\r\n                            [seekerSourceType]=\"control.seekerSourceType!\" \r\n                            [preDefinedOuterParam$]=\"control.preDefinedOuterParam$!\"\r\n                            [preDefinedOuterFilter$]=\"control.preDefinedOuterFilter$!\"\r\n                            [boundFrom]=\"control.boundFrom!\" [shownFrom]=\"control.shownFrom!\"\r\n                            [getByIdObject$]=\"control.getByIdObject$!\"\r\n                            [multiModeExtendedColumns]=\"control.multiModeExtendedColumns!\"\r\n                            [multiModeExtendedSections]=\"control.multiModeExtendedSections!\"\r\n                            [seekerVerifyIgnore]=\"control.seekerVerifyIgnore!\"\r\n                            [click$]=\"control.click$\"\r\n                            [useTheseColumns]=\"control.useTheseColumns!\"\r\n                            [hideOrgTree]=\"control.hideOrgTree!\"\r\n                            [sourceSpaceHeight]=\"control.sourceSpaceHeight!\"\r\n                            [placeholder]=\"control.placeholder! || ''\"\r\n                            (selectedDataChange)=\"selectedDataChange($event)\"\r\n                            (fullValueRowChange)=\"fullValueRowChange($event)\"\r\n                        ></core-form-control-seeker>\r\n                    }\r\n                    @case(\"POSITION_CONCURRENT_SEEK\") {\r\n                        <core-form-control-seeker\r\n                            [disabled]=\"!!disabled || !!control.disabled\"\r\n                            [excludeExistingList]=\"control.excludeExistingList!\"\r\n                            [multiMode]=\"control.multiMode!\" [multiModeTableHeight]=\"control.multiModeTableHeight!\" [multiModeRowHeight]=\"control.multiModeRowHeight!\"\r\n                            [formControlName]=\"control.field\" [alsoBindTo]=\"control.alsoBindTo!\"\r\n                            [seekerSourceType]=\"control.seekerSourceType!\" \r\n                            [preDefinedOuterParam$]=\"control.preDefinedOuterParam$!\"\r\n                            [preDefinedOuterFilter$]=\"control.preDefinedOuterFilter$!\"\r\n                            [boundFrom]=\"control.boundFrom!\" [shownFrom]=\"control.shownFrom!\"\r\n                            [getByIdObject$]=\"control.getByIdObject$!\"\r\n                            [multiModeExtendedColumns]=\"control.multiModeExtendedColumns!\"\r\n                            [multiModeExtendedSections]=\"control.multiModeExtendedSections!\"\r\n                            [multiModeTableHeight]=\"control.multiModeTableHeight!\"\r\n                            [click$]=\"control.click$\"\r\n                            [useTheseColumns]=\"control.useTheseColumns!\"\r\n                            [hideOrgTree]=\"control.hideOrgTree!\"\r\n                            [sourceSpaceHeight]=\"control.sourceSpaceHeight!\"\r\n                            [placeholder]=\"control.placeholder! || ''\"\r\n                            (selectedDataChange)=\"selectedDataChange($event)\"\r\n                            (fullValueRowChange)=\"fullValueRowChange($event)\"\r\n                        ></core-form-control-seeker>\r\n                    }\r\n                    @case(\"FORM_SEEK\") {\r\n                        <core-form-control-seeker\r\n                            [disabled]=\"!!disabled || !!control.disabled\"\r\n                            [excludeExistingList]=\"control.excludeExistingList!\"\r\n                            [multiMode]=\"control.multiMode!\" [multiModeTableHeight]=\"control.multiModeTableHeight!\" [multiModeRowHeight]=\"control.multiModeRowHeight!\"\r\n                            [formControlName]=\"control.field\" [alsoBindTo]=\"control.alsoBindTo!\"\r\n                            [seekerSourceType]=\"control.seekerSourceType!\" \r\n                            [preDefinedOuterParam$]=\"control.preDefinedOuterParam$!\"\r\n                            [preDefinedOuterFilter$]=\"control.preDefinedOuterFilter$!\"\r\n                            [boundFrom]=\"control.boundFrom!\" [shownFrom]=\"control.shownFrom!\"\r\n                            [getByIdObject$]=\"control.getByIdObject$!\"\r\n                            [multiModeExtendedColumns]=\"control.multiModeExtendedColumns!\"\r\n                            [multiModeExtendedSections]=\"control.multiModeExtendedSections!\"\r\n                            [multiModeTableHeight]=\"control.multiModeTableHeight!\"\r\n                            [click$]=\"control.click$\"\r\n                            [useTheseColumns]=\"control.useTheseColumns!\"\r\n                            [hideOrgTree]=\"control.hideOrgTree!\"\r\n                            [sourceSpaceHeight]=\"control.sourceSpaceHeight!\"\r\n                            [placeholder]=\"control.placeholder! || ''\"\r\n                            (selectedDataChange)=\"selectedDataChange($event)\"\r\n                            (fullValueRowChange)=\"fullValueRowChange($event)\"\r\n                        ></core-form-control-seeker>\r\n                    }\r\n                    @case(\"ORGANIZATION_UNIT_SEEK\") {\r\n                        <core-form-control-seeker\r\n                            [disabled]=\"!!disabled || !!control.disabled\"\r\n                            [formControlName]=\"control.field\" [seekerSourceType]=\"control.seekerSourceType!\"\r\n                            [boundFrom]=\"control.boundFrom!\" [alsoBindTo]=\"control.alsoBindTo!\" [shownFrom]=\"control.shownFrom!\"\r\n                            [getByIdObject$]=\"control.getByIdObject$!\"\r\n                            [click$]=\"control.click$\"\r\n                            [placeholder]=\"control.placeholder! || ''\"\r\n                        ></core-form-control-seeker>\r\n                    }\r\n                }\r\n            }\r\n        }\r\n        </ng-container>\r\n\r\n        @if (control.controlType==='BUTTON') {\r\n        <ng-container>\r\n            <button type=\"button\" class=\"btn btn-secondary text\" (click)=\"oHandleClick($event)\">{{control.label| translate: lang}}</button>\r\n        </ng-container>\r\n        }\r\n        <!-- END: FORM-CONTROL SESSION-->\r\n\r\n        <!-- START: ERROR SESSION-->\r\n        @if (!!errors!.length) {\r\n        <div>\r\n            @for (error of errors; track $index) {\r\n            <div class=\"form-control-error\">\r\n                {{ error.errorMessage | translate: lang }}\r\n            </div>\r\n            }\r\n        </div>\r\n        }\r\n\r\n        @if (!errors!.length && !!checkError$.value) {\r\n        <div>\r\n            <div>\r\n                {{ '&nbsp;' }}\r\n            </div>\r\n        </div>\r\n        }\r\n        <!-- END: ERROR SESSION-->\r\n\r\n    </div>\r\n\r\n\r\n</div>\r\n\r\n<ng-template #calculatedControlInfo let-control=\"control\">\r\n    <div class=\"calculated-tooltip-container\">\r\n        <div class=\"calculated-field-row\">\r\n        <span class=\"label\">Name:</span>\r\n        <span class=\"value\">{{ control?.field || 'N/A' }}</span>\r\n        </div>        \r\n        <div class=\"calculated-field-row\">\r\n        <span class=\"label\">Evaluation Mode:</span>\r\n        <span class=\"value\">{{ control?.evaluationMode || 'N/A' }}</span>\r\n        </div>\r\n        <div class=\"calculated-field-row\">\r\n        <span class=\"label\">Return Type:</span>\r\n        <span class=\"value\">{{ control?.returnType || 'N/A' }}</span>\r\n        </div>\r\n        <div class=\"calculated-field-row\">\r\n        <span class=\"label\">Depends On:</span>\r\n        <span class=\"value\" *ngIf=\"control?.dependsOn?.length > 0; else noDepends\">\r\n            <code *ngFor=\"let dep of control?.dependsOn; let last = last\">{{ dep }}<span *ngIf=\"!last\">, </span></code>\r\n        </span>\r\n        <ng-template #noDepends><em class=\"no-depends\">None</em></ng-template>\r\n        </div>\r\n        <div *ngIf=\"!!control?.isUnsafe\" class=\"warning\">\r\n        \u26A0\uFE0F This script is marked as <strong>unsafe</strong> and will not be executed.\r\n        </div>\r\n        <div class=\"calculated-field-row\">\r\n        <span class=\"label\">Script:</span>\r\n        <pre class=\"code-block\">{{ control?.script || 'No script provided.' }}</pre>\r\n        </div>\r\n    </div>\r\n</ng-template>", styles: [".core-control-container{font-size:var(--typo-basic-font-size)!important}.core-control-container .control-label{color:#848484}.core-control-container>div.hidden{display:none}.core-control-container label{color:#464646}.core-control-container label.required:after{content:\"*\";color:#ff040b}.core-control-container label.avatar-label{width:var(--size-file-uploader);display:flex;align-items:center;justify-content:center}.core-control-container input[type=number]{padding-right:12px;position:relative}.core-control-container input[type=number]::-webkit-inner-spin-button{position:absolute;right:.3em;margin-left:.5em}.core-control-container input[type=number]{-moz-appearance:textfield}.core-control-container i.feather-help-circle{color:#848484}.core-control-container .gap-for-ios-switcher{height:5px}.core-control-container .calculated-view{-webkit-user-select:none;user-select:none;cursor:pointer;height:35px;width:160px;background-color:#d8f3dc;color:#1b4332;border:1px solid #95d5b2;border-radius:50px;font-size:14px;font-weight:500;display:flex;align-items:center;justify-content:flex-start;font-family:Segoe UI,sans-serif;letter-spacing:.5px;padding:8px}.core-control-container .calculated-view i{font-size:18px;width:18px;height:18px;margin-right:8px}.core-control-container .calculated-view span{width:calc(100% - 26px);overflow:hidden;text-overflow:ellipsis;text-wrap:nowrap}.calculated-tooltip-container{background-color:#fff;border:1px solid #ddd;padding:1rem;border-radius:6px;font-size:14px;color:#333;box-shadow:0 4px 10px #0000000d;max-width:360px}.calculated-tooltip-container .calculated-field-row{margin-bottom:.75rem}.calculated-tooltip-container .label{font-weight:500;color:#555!important;display:inline-block;min-width:140px}.calculated-tooltip-container .value{color:#222!important}.calculated-tooltip-container .warning{color:#b91c1c;background:#fef2f2;border:1px solid #fca5a5;padding:.5rem;border-radius:4px;margin-bottom:1rem;font-size:13px}.calculated-tooltip-container .code-block{background:#f8f9fa;border:1px solid #ddd;padding:.75rem;font-family:monospace;font-size:12px;white-space:pre-wrap;color:#111!important;border-radius:4px;overflow-x:auto}.calculated-tooltip-container .no-depends{color:#888;font-style:italic}.calculated-tooltip-container pre{overflow:hidden}.calculated-tooltip-container label.required~input:not([disabled]),.calculated-tooltip-container label.required~textarea:not([disabled]),.calculated-tooltip-container label.required~select:not([disabled]){background-color:#ff0!important}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$3.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: i1$3.NumberValueAccessor, selector: "input[type=number][formControlName],input[type=number][formControl],input[type=number][ngModel]" }, { kind: "directive", type: i1$3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$3.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$3.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$3.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "pipe", type: TranslatePipe, name: "translate" }, { kind: "pipe", type: TableCellPipe, name: "tableCell" }, { kind: "component", type: CoreDropdownComponent, selector: "core-dropdown", inputs: ["getByIdObject$", "paramMode", "shownFrom", "options$", "height", "placeholder", "loading", "warningDisable", "clearDisable", "fitHeightWithItemCount", "itemHeight", "optionApiDriven", "optionApi", "optionHttpVerb", "optionHttpPayload", "optionValueFrom", "optionTextFrom"] }, { kind: "component", type: CoreListComponent, selector: "core-list", inputs: ["title", "height", "options", "placeholder"] }, { kind: "component", type: CoreChecklistComponent, selector: "core-checklist", inputs: ["paramMode", "getByIdObject$", "shownFrom", "options$", "height", "placeholder", "loading", "readonly", "disabled"] }, { kind: "component", type: CoreFormControlSeekerComponent, selector: "core-form-control-seeker", inputs: ["title", "showPageHeader", "preDefinedOuterParam$", "preDefinedOuterFilter$", "click$", "getByIdObject$", "getByIdApi", "paramMode", "multiMode", "objectList$", "useTheseColumns", "hideOrgTree", "excludedColumns", "excludeExistingList", "placeholder", "sourceSpaceHeight", "indirectBinding", "bindGridIdTo", "multiModeExtendedColumns", "multiModeExtendedSections", "editBufferData$", "multiModeTableHeight", "multiModeRowHeight", "seekerSourceType", "boundFrom", "shownFrom", "alsoBindTo", "seekerVerifyIgnore", "disabledDoubleClick"], outputs: ["onDoubleClick", "selectedDataChange", "fullValueRowChange"] }, { kind: "component", type: CoreCheckboxComponent, selector: "core-checkbox", inputs: ["text", "tooltipPosition", "tooltip", "inputValue", "disabled"], outputs: ["onClick"] }, { kind: "component", type: CoreFileUploaderComponent, selector: "core-file-uploader", inputs: ["uploadFileType", "fileDataControlName", "fileNameControlName", "fileTypeControlName", "avatarSize", "defaultAvatar", "hidePreview", "verticalMode"] }, { kind: "component", type: CoreAttachmentComponent, selector: "core-attachment", inputs: ["assignTo", "readonly", "valueToShow", "placeholder", "upFlag$", "downFlag$"] }, { kind: "component", type: CoreGridBufferComponent, selector: "core-grid-buffer", inputs: ["padding", "placeholder", "tableHeight", "liteMode", "formSections", "gridColumns"], outputs: ["onBufferFormCreated"] }, { kind: "component", type: CoreDatePickerComponent, selector: "core-date-picker", inputs: ["enableTimeZoneConverter", "showPlaceholder", "popupWidth", "popupXPadding", "popupAlign", "rangeLimit", "placeholder", "readonly", "disabled"] }, { kind: "component", type: CoreOrgTreeComponent, selector: "core-org-tree", inputs: ["lineColor", "fullWidthMode", "accessorMode", "searchMode", "fullRendering", "height", "disabledLoopExpand", "showCheckInheritance", "excludedIds$", "stateIsolated$"], outputs: ["itemDoubleClick", "itemClick"] }, { kind: "component", type: CoreRadioGroupComponent, selector: "core-radio-group", inputs: ["options$", "vertical", "columnCount", "gapY", "defaultValue"] }, { kind: "component", type: CoreMccComponent, selector: "core-mcc", inputs: ["height", "columns", "shownFrom", "apiDefinition", "getByIdApi", "outerParam$", "selectedRow$", "outerFilterOperators", "outerInOperators", "placeholder"] }, { kind: "component", type: CoreMonthSelectorComponent, selector: "core-month-selector", inputs: ["align", "placeholder"], outputs: ["onYearClick"] }, { kind: "directive", type: TooltipDirective, selector: "[appTooltip]", inputs: ["appTooltip", "showAnyway", "color", "backgroundColor", "position"] }, { kind: "component", type: CoreCurrencyInputComponent, selector: "core-currency-input", inputs: ["currencySign", "placeholder"], outputs: ["onLeftFocus"] }, { kind: "component", type: CoreShiftCellComponent, selector: "core-shift-cell", inputs: ["$readOnly", "$hideStarterPlusSign", "$hideStickersWhileDragover", "$backgroundColor"] }, { kind: "component", type: CoreShiftCollectionComponent, selector: "core-shift-collection", inputs: ["height", "disabled", "relativeMode"] }, { kind: "component", type: CoreTopicPickerComponent, selector: "core-topic-picker", inputs: ["popupHeight", "getByIdApi"] }, { kind: "component", type: CoreIosSwitcherComponent, selector: "core-ios-switcher", inputs: ["bgColor", "showOnOffText", "width", "height", "readonly"] }, { kind: "directive", type: HtmlTooltipDirective, selector: "[htmlTooltip]", inputs: ["htmlTooltip", "tooltipContext", "maxWidthUnset", "backgroundColor", "hold$"] }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: CoreControlNoFormArrayComponent, decorators: [{
             type: Component,
@@ -25625,24 +25628,29 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.5", ngImpor
                         CoreTopicPickerComponent,
                         CoreIosSwitcherComponent,
                         HtmlTooltipDirective
-                    ], template: "<div class=\"core-control-container\">\r\n\r\n    <div [formGroup]=\"form\" [class.hidden]=\"!!control.hidden\">\r\n\r\n        @if (!control.headless!) {\r\n            <label [class]=\"'control-label' +  (required ? ' required' : '')\" [attr.for]=\"control.field\"\r\n                [class.d-none]=\"!!control.hidden\"\r\n                [class.avatar-label]=\"control.uploadFileType==='IMAGE_AVATAR'\" [appTooltip]=\"control.tooltip! | translate: lang\" \r\n                [htmlTooltip]=\"control.htmlTooltip!\"\r\n                [backgroundColor]=\"'white'\"\r\n                [ngStyle]=\"{\r\n                    display: 'inline-block'\r\n                }\">\r\n                {{(control.controlType!=='CHECKBOX' && control.controlType!=='BUTTON') ? (control.label | translate: lang) : ''}}\r\n            </label>\r\n\r\n            @if (!!control.hint! && control.controlType !== 'CHECKBOX') {\r\n                <i class=\"feather-help-circle\" [appTooltip]=\"control.hint!\" [showAnyway]=\"true\" [ngStyle]=\"{\r\n                    display: 'inline-block',\r\n                    marginLeft: '2px'\r\n                }\" [class.d-none]=\"!!control.hidden\"></i>\r\n            }\r\n        }\r\n\r\n        <!-- START: FORM-CONTROL SESSION-->\r\n\r\n        <ng-container>\r\n        @switch (control.controlType) {\r\n            @case (\"CALCULATED\") {\r\n                <div class=\"calculated-view\" [htmlTooltip]=\"calculatedControlInfo\" [tooltipContext]=\"{control: control}\" [backgroundColor]=\"'#fff'\">\r\n                    <i class=\"feather-box\"></i><span>{{ control.field! }}</span>\r\n                </div>\r\n            }\r\n            @case (\"TEXTBOX\") {\r\n\r\n                <input *ngIf=\"control.type === 'date'\"\r\n                    [formControlName]=\"control.field\"\r\n                    type=\"date\"\r\n                    useValueAsDate\r\n                    class=\"form-control\"\r\n                    [readonly]=\"control.readonly\"\r\n                    [placeholder]=\"control.placeholder || ''\"\r\n                    [class.form-control-disabled]=\"!!control.disabled\" />\r\n              \r\n                <input *ngIf=\"control.type === 'time'\"\r\n                    [formControlName]=\"control.field\"\r\n                    type=\"time\"\r\n                    class=\"form-control\"\r\n                    [readonly]=\"control.readonly\"\r\n                    [placeholder]=\"control.placeholder || ''\"\r\n                    [class.form-control-disabled]=\"!!control.disabled\" />\r\n              \r\n                <input *ngIf=\"control.type === 'number'\"\r\n                    [formControlName]=\"control.field\"\r\n                    type=\"number\"\r\n                    step=\"{{ control.step || 1 }}\"\r\n                    class=\"form-control\"\r\n                    style=\"text-align: right;\"\r\n                    [readonly]=\"control.readonly\"\r\n                    [placeholder]=\"control.placeholder || ''\"\r\n                    [class.form-control-disabled]=\"!!control.disabled\" />\r\n              \r\n                <input *ngIf=\"['string', 'text', 'email', 'url', 'password'].includes(control.type || 'text')\"\r\n                    [formControlName]=\"control.field\"\r\n                    [type]=\"control.type\"\r\n                    class=\"form-control\"\r\n                    [readonly]=\"control.readonly\"\r\n                    [placeholder]=\"control.placeholder || ''\"\r\n                    [value]=\"form.get(control.field)?.value | tableCell: control.pipe : lang\"\r\n                    [attr.pattern]=\"getPattern(control) || null\"\r\n                    [appTooltip]=\"form.get(control.field)?.value\"\r\n                    (focus)=\"onFocus($event)\"\r\n                    (blur)=\"onBlur($event)\"\r\n                    [class.form-control-disabled]=\"!!control.disabled\" />\r\n\r\n                <!-- <input *ngIf=\"control.type==='calculated'\"\r\n                    [formControlName]=\"control.field\"\r\n                    type=\"text\"\r\n                    class=\"form-control\"\r\n                    [readonly]=\"true\"\r\n                    [placeholder]=\"control.placeholder || ''\"\r\n                    [value]=\"form.get(control.field)?.value | tableCell: control.pipe : lang\"\r\n                    [attr.pattern]=\"getPattern(control) || null\"\r\n                    [appTooltip]=\"form.get(control.field)?.value\"\r\n                    (focus)=\"onFocus($event)\"\r\n                    (blur)=\"onBlur($event)\"\r\n                    [class.form-control-disabled]=\"true\" /> -->\r\n\r\n            }\r\n            @case (\"CURRENCY\") {\r\n                <core-currency-input [formControlName]=\"control.field\" [placeholder]=\"control.placeholder! || ''\"></core-currency-input>\r\n            }\r\n            @case (\"TEXTAREA\") {\r\n                <textarea [rows]=\"control.textareaRows?.toString() || '3'\" [ngStyle]=\"{ height: 'unset' }\"\r\n                    [formControlName]=\"control.field\" class=\"form-control\" [readonly]=\"control.readonly\" [placeholder]=\"control.placeholder! || ''\"></textarea>\r\n            }\r\n            @case (\"CHECKBOX\") {\r\n                <core-checkbox [formControlName]=\"control.field\" [text]=\"control.label\"\r\n                    [inputValue]=\"control.value\" [tooltip]=\"control.hint!\"></core-checkbox>\r\n            }\r\n            @case (\"IOS_SWITCHER\") {\r\n                <div class=\"gap-for-ios-switcher\"></div>\r\n                <core-ios-switcher [formControlName]=\"control.field\" />\r\n            }\r\n            @case (\"MCC\") {\r\n                <core-mcc [formControlName]=\"control.field\" [columns]=\"control.columns!\" [shownFrom]=\"control.shownFrom!\" \r\n                [apiDefinition]=\"control.apiDefinition!\" [getByIdApi]=\"control.getByIdApi!\" [selectedRow$]=\"control.selectedRow$!\"\r\n                [outerParam$]=\"control.outerParam$!\"\r\n                [placeholder]=\"control.placeholder! || ''\"\r\n                ></core-mcc>\r\n            }\r\n            @case (\"DATEPICKER\") {\r\n                <core-date-picker [formControlName]=\"control.field\" [showPlaceholder]=\"control.showPlaceholder!\" [rangeLimit]=\"control.rangeLimit!\" [popupAlign]=\"control.popupAlign!\" [placeholder]=\"control.placeholder! || ''\"></core-date-picker>\r\n            }\r\n\r\n            @case (\"DROPDOWN\") {\r\n                @if (!!control.dropdownOptions$) {\r\n                    <core-dropdown \r\n                        [formControlName]=\"control.field\" \r\n                        [options$]=\"control.dropdownOptions$!\"\r\n                        [getByIdObject$]=\"control.getByIdObject$!\" \r\n                        [shownFrom]=\"control.shownFrom!\" \r\n                        [placeholder]=\"control.placeholder! || ''\"\r\n\r\n                        [optionApiDriven]=\"control.optionApiDriven!\"\r\n                        [optionApi]=\"control.optionApi!\"\r\n                        [optionHttpVerb]=\"control.optionHttpVerb!\"\r\n                        [optionHttpPayload]=\"control.optionHttpPayload!\"\r\n                        [optionValueFrom]=\"control.optionValueFrom!\"\r\n                        [optionTextFrom]=\"control.optionTextFrom!\"\r\n                    ></core-dropdown>\r\n                } @else {\r\n                    No dropdownOptions$ detected\r\n                }\r\n            }\r\n            @case (\"LIST\") {\r\n                <core-list [formControlName]=\"control.field\" [options]=\"control.listOptions!\" [placeholder]=\"control.placeholder! || ''\"></core-list>\r\n            }\r\n            @case (\"CHECKLIST\") {\r\n                @if (!!control.checklistOptions$) {\r\n                    <core-checklist [formControlName]=\"control.field\" [options$]=\"control.checklistOptions$!\"\r\n                        [getByIdObject$]=\"control.getByIdObject$!\" [shownFrom]=\"control.shownFrom!\" [placeholder]=\"control.placeholder! || ''\"></core-checklist>\r\n                }\r\n            }\r\n            @case (\"FILEUPLOADER\") {\r\n                @if (!!control.uploadFileType) {\r\n                    <core-file-uploader [formControlName]=\"control.field\" [uploadFileType]=\"control.uploadFileType\"\r\n                        [fileDataControlName]=\"control.fileDataControlName!\"\r\n                        [fileNameControlName]=\"control.fileNameControlName!\"\r\n                        [fileTypeControlName]=\"control.fileTypeControlName!\"\r\n                        [verticalMode]=\"control.verticalMode!\"></core-file-uploader>\r\n                }\r\n            }\r\n            @case (\"ATTACHMENT\") {\r\n                <core-attachment ngDefaultControl [formControlName]=\"control.field\" [assignTo]=\"control.assignTo!\"\r\n                    [valueToShow]=\"control.valueToShow!\" [placeholder]=\"control.placeholder! || ''\"></core-attachment>\r\n            }\r\n            @case (\"GRIDBUFFER\") {\r\n                @if (!!control.gridBufferFormSections && !!control.gridBufferTableColumns) {\r\n                    <core-grid-buffer [formControlName]=\"control.field\" [formSections]=\"control.gridBufferFormSections\"\r\n                        [gridColumns]=\"control.gridBufferTableColumns\"\r\n                        (onBufferFormCreated)=\"!!control.onBufferFormCreated ? control.onBufferFormCreated($event) : null\"></core-grid-buffer>\r\n                }\r\n            }\r\n            @case (\"ORGTREECHECK\") {\r\n                <core-org-tree [formControlName]=\"control.field\"\r\n                    [accessorMode]=\"coreOrgTreeDefaultAccessorMode\" [height]=\"control.height!\"></core-org-tree>\r\n            }\r\n            @case (\"RADIOGROUP\") {\r\n                <core-radio-group [formControlName]=\"control.field\"\r\n                    [options$]=\"control.radioGroupOptions$!\"\r\n                    [vertical]=\"control.verticalMode!\"\r\n                    ></core-radio-group>\r\n            }\r\n            @case (\"MONTHSELECTOR\") {\r\n                <core-month-selector [formControlName]=\"control.field\" [placeholder]=\"control.placeholder! || ''\"></core-month-selector>\r\n            }\r\n            @case (\"SHIFTCELL\") {\r\n                <core-shift-cell [formControlName]=\"control.field\"></core-shift-cell>\r\n            }\r\n            @case (\"SHIFTCOLLECTION\") {\r\n                <core-shift-collection [relativeMode]=\"true\" [height]=\"control.height || 800\"></core-shift-collection>\r\n            }\r\n            @case(\"TOPICPICKER\") {\r\n                <core-topic-picker [formControlName]=\"control.field\" [popupHeight]=\"control.popupHeight!\" [getByIdApi]=\"control.getByIdApi!\"></core-topic-picker>\r\n            }\r\n            @case (\"SEEKER\") {\r\n                @switch(control.seekerSourceType) {\r\n                    @case(\"JOB_SEEK\") {\r\n                        <core-form-control-seeker\r\n                            [excludeExistingList]=\"control.excludeExistingList!\"\r\n                            [multiMode]=\"control.multiMode!\" [multiModeTableHeight]=\"control.multiModeTableHeight!\" [multiModeRowHeight]=\"control.multiModeRowHeight!\"\r\n                            [objectList$]=\"control.objectList$!\" [formControlName]=\"control.field\"\r\n                            [seekerSourceType]=\"control.seekerSourceType!\" \r\n                            [preDefinedOuterParam$]=\"control.preDefinedOuterParam$!\"\r\n                            [preDefinedOuterFilter$]=\"control.preDefinedOuterFilter$!\"\r\n                            [boundFrom]=\"control.boundFrom!\" [shownFrom]=\"control.shownFrom!\" [alsoBindTo]=\"control.alsoBindTo!\"\r\n                            [getByIdObject$]=\"control.getByIdObject$!\"\r\n                            [click$]=\"control.click$\"\r\n                            [multiModeExtendedColumns]=\"control.multiModeExtendedColumns!\"\r\n                            [multiModeExtendedSections]=\"control.multiModeExtendedSections!\"\r\n                            [editBufferData$]=\"control.editBufferData$!\"\r\n                            [indirectBinding]=\"control.indirectBinding!\"\r\n                            [bindGridIdTo]=\"control.bindGridIdTo!\"\r\n                            [useTheseColumns]=\"control.useTheseColumns!\"\r\n                            [hideOrgTree]=\"control.hideOrgTree!\"\r\n                            [sourceSpaceHeight]=\"control.sourceSpaceHeight!\"\r\n                            (selectedDataChange)=\"selectedDataChange($event)\"\r\n                            (fullValueRowChange)=\"fullValueRowChange($event)\"\r\n                        ></core-form-control-seeker>\r\n                    }\r\n                    @case(\"EMPLOYEE_SEEK\") {\r\n                        <core-form-control-seeker\r\n                            [excludeExistingList]=\"control.excludeExistingList!\"\r\n                            [multiMode]=\"control.multiMode!\" [multiModeTableHeight]=\"control.multiModeTableHeight!\" [multiModeRowHeight]=\"control.multiModeRowHeight!\"\r\n                            [objectList$]=\"control.objectList$!\" [formControlName]=\"control.field\"\r\n                            [seekerSourceType]=\"control.seekerSourceType!\" \r\n                            [preDefinedOuterParam$]=\"control.preDefinedOuterParam$!\"\r\n                            [preDefinedOuterFilter$]=\"control.preDefinedOuterFilter$!\"\r\n                            [boundFrom]=\"control.boundFrom!\" [shownFrom]=\"control.shownFrom!\" [alsoBindTo]=\"control.alsoBindTo!\"\r\n                            [getByIdObject$]=\"control.getByIdObject$!\"\r\n                            [click$]=\"control.click$\"\r\n                            [multiModeExtendedColumns]=\"control.multiModeExtendedColumns!\"\r\n                            [multiModeExtendedSections]=\"control.multiModeExtendedSections!\"\r\n                            [editBufferData$]=\"control.editBufferData$!\"\r\n                            [indirectBinding]=\"control.indirectBinding!\"\r\n                            [bindGridIdTo]=\"control.bindGridIdTo!\"\r\n                            [useTheseColumns]=\"control.useTheseColumns!\"\r\n                            [hideOrgTree]=\"control.hideOrgTree!\"\r\n                            [sourceSpaceHeight]=\"control.sourceSpaceHeight!\"\r\n                            [placeholder]=\"control.placeholder! || ''\"\r\n                            (selectedDataChange)=\"selectedDataChange($event)\"\r\n                            (fullValueRowChange)=\"fullValueRowChange($event)\"\r\n                        ></core-form-control-seeker>\r\n                    }\r\n                    @case(\"CONTRACT_SEEK\") {\r\n                        <core-form-control-seeker\r\n                            [excludeExistingList]=\"control.excludeExistingList!\"\r\n                            [multiMode]=\"control.multiMode!\" [multiModeTableHeight]=\"control.multiModeTableHeight!\" [multiModeRowHeight]=\"control.multiModeRowHeight!\"\r\n                            [objectList$]=\"control.objectList$!\" [formControlName]=\"control.field\"\r\n                            [seekerSourceType]=\"control.seekerSourceType!\" [boundFrom]=\"control.boundFrom!\"\r\n                            [preDefinedOuterParam$]=\"control.preDefinedOuterParam$!\" \r\n                            [preDefinedOuterFilter$]=\"control.preDefinedOuterFilter$!\"\r\n                            [shownFrom]=\"control.shownFrom!\"\r\n                            [alsoBindTo]=\"control.alsoBindTo!\"\r\n                            [getByIdObject$]=\"control.getByIdObject$!\"\r\n                            [multiModeExtendedColumns]=\"control.multiModeExtendedColumns!\"\r\n                            [multiModeExtendedSections]=\"control.multiModeExtendedSections!\"\r\n                            [click$]=\"control.click$\"\r\n                            [useTheseColumns]=\"control.useTheseColumns!\"\r\n                            [hideOrgTree]=\"control.hideOrgTree!\"\r\n                            [sourceSpaceHeight]=\"control.sourceSpaceHeight!\"\r\n                            [placeholder]=\"control.placeholder! || ''\"\r\n                            (selectedDataChange)=\"selectedDataChange($event)\"\r\n                            (fullValueRowChange)=\"fullValueRowChange($event)\"\r\n                        ></core-form-control-seeker>\r\n                    }\r\n                    @case(\"WORKING_SEEK\") {\r\n                        <core-form-control-seeker \r\n                            [excludeExistingList]=\"control.excludeExistingList!\"\r\n                            [multiMode]=\"control.multiMode!\" [multiModeTableHeight]=\"control.multiModeTableHeight!\" [multiModeRowHeight]=\"control.multiModeRowHeight!\"\r\n                            [objectList$]=\"control.objectList$!\" [formControlName]=\"control.field\"\r\n                            [seekerSourceType]=\"control.seekerSourceType!\" \r\n                            [preDefinedOuterParam$]=\"control.preDefinedOuterParam$!\"\r\n                            [preDefinedOuterFilter$]=\"control.preDefinedOuterFilter$!\"\r\n                            [boundFrom]=\"control.boundFrom!\" [shownFrom]=\"control.shownFrom!\" [alsoBindTo]=\"control.alsoBindTo!\"\r\n                            [getByIdObject$]=\"control.getByIdObject$!\"\r\n                            [multiModeExtendedColumns]=\"control.multiModeExtendedColumns!\"\r\n                            [multiModeExtendedSections]=\"control.multiModeExtendedSections!\"\r\n                            [click$]=\"control.click$\"\r\n                            [useTheseColumns]=\"control.useTheseColumns!\"\r\n                            [hideOrgTree]=\"control.hideOrgTree!\"\r\n                            [sourceSpaceHeight]=\"control.sourceSpaceHeight!\"\r\n                            [placeholder]=\"control.placeholder! || ''\"\r\n                            (selectedDataChange)=\"selectedDataChange($event)\"\r\n                            (fullValueRowChange)=\"fullValueRowChange($event)\"\r\n                        ></core-form-control-seeker>\r\n                    }\r\n                    @case(\"WAGE_SEEK\") {\r\n                        <core-form-control-seeker \r\n                            [excludeExistingList]=\"control.excludeExistingList!\"\r\n                            [formControlName]=\"control.field\"\r\n                            [multiMode]=\"control.multiMode!\" [multiModeTableHeight]=\"control.multiModeTableHeight!\" [multiModeRowHeight]=\"control.multiModeRowHeight!\"\r\n                            [objectList$]=\"control.objectList$!\"\r\n                            [seekerSourceType]=\"control.seekerSourceType!\" \r\n                            [preDefinedOuterParam$]=\"control.preDefinedOuterParam$!\"\r\n                            [preDefinedOuterFilter$]=\"control.preDefinedOuterFilter$!\"\r\n                            [boundFrom]=\"control.boundFrom!\" [shownFrom]=\"control.shownFrom!\" [alsoBindTo]=\"control.alsoBindTo!\"\r\n                            [getByIdObject$]=\"control.getByIdObject$!\"\r\n                            [multiModeExtendedColumns]=\"control.multiModeExtendedColumns!\"\r\n                            [multiModeExtendedSections]=\"control.multiModeExtendedSections!\"\r\n                            [click$]=\"control.click$\"\r\n                            [useTheseColumns]=\"control.useTheseColumns!\"\r\n                            [hideOrgTree]=\"control.hideOrgTree!\"\r\n                            [sourceSpaceHeight]=\"control.sourceSpaceHeight!\"\r\n                            [placeholder]=\"control.placeholder! || ''\"\r\n                            (selectedDataChange)=\"selectedDataChange($event)\"\r\n                            (fullValueRowChange)=\"fullValueRowChange($event)\"\r\n                        ></core-form-control-seeker>\r\n                    }\r\n                    @case(\"POSITION_SEEK\") {\r\n                        <core-form-control-seeker \r\n                            [excludeExistingList]=\"control.excludeExistingList!\"\r\n                            [objectList$]=\"control.objectList$!\"\r\n                            [multiMode]=\"control.multiMode!\" [multiModeTableHeight]=\"control.multiModeTableHeight!\" [multiModeRowHeight]=\"control.multiModeRowHeight!\"\r\n                            [formControlName]=\"control.field\" [alsoBindTo]=\"control.alsoBindTo!\"\r\n                            [seekerSourceType]=\"control.seekerSourceType!\" \r\n                            [preDefinedOuterParam$]=\"control.preDefinedOuterParam$!\"\r\n                            [preDefinedOuterFilter$]=\"control.preDefinedOuterFilter$!\"\r\n                            [boundFrom]=\"control.boundFrom!\" [shownFrom]=\"control.shownFrom!\"\r\n                            [getByIdObject$]=\"control.getByIdObject$!\"\r\n                            [multiModeExtendedColumns]=\"control.multiModeExtendedColumns!\"\r\n                            [multiModeExtendedSections]=\"control.multiModeExtendedSections!\"\r\n                            [seekerVerifyIgnore]=\"control.seekerVerifyIgnore!\"\r\n                            [click$]=\"control.click$\"\r\n                            [useTheseColumns]=\"control.useTheseColumns!\"\r\n                            [hideOrgTree]=\"control.hideOrgTree!\"\r\n                            [sourceSpaceHeight]=\"control.sourceSpaceHeight!\"\r\n                            [placeholder]=\"control.placeholder! || ''\"\r\n                            (selectedDataChange)=\"selectedDataChange($event)\"\r\n                            (fullValueRowChange)=\"fullValueRowChange($event)\"\r\n                        ></core-form-control-seeker>\r\n                    }\r\n                    @case(\"POSITION_CONCURRENT_SEEK\") {\r\n                        <core-form-control-seeker\r\n                            [excludeExistingList]=\"control.excludeExistingList!\"\r\n                            [multiMode]=\"control.multiMode!\" [multiModeTableHeight]=\"control.multiModeTableHeight!\" [multiModeRowHeight]=\"control.multiModeRowHeight!\"\r\n                            [formControlName]=\"control.field\" [alsoBindTo]=\"control.alsoBindTo!\"\r\n                            [seekerSourceType]=\"control.seekerSourceType!\" \r\n                            [preDefinedOuterParam$]=\"control.preDefinedOuterParam$!\"\r\n                            [preDefinedOuterFilter$]=\"control.preDefinedOuterFilter$!\"\r\n                            [boundFrom]=\"control.boundFrom!\" [shownFrom]=\"control.shownFrom!\"\r\n                            [getByIdObject$]=\"control.getByIdObject$!\"\r\n                            [multiModeExtendedColumns]=\"control.multiModeExtendedColumns!\"\r\n                            [multiModeExtendedSections]=\"control.multiModeExtendedSections!\"\r\n                            [multiModeTableHeight]=\"control.multiModeTableHeight!\"\r\n                            [click$]=\"control.click$\"\r\n                            [useTheseColumns]=\"control.useTheseColumns!\"\r\n                            [hideOrgTree]=\"control.hideOrgTree!\"\r\n                            [sourceSpaceHeight]=\"control.sourceSpaceHeight!\"\r\n                            [placeholder]=\"control.placeholder! || ''\"\r\n                            (selectedDataChange)=\"selectedDataChange($event)\"\r\n                            (fullValueRowChange)=\"fullValueRowChange($event)\"\r\n                        ></core-form-control-seeker>\r\n                    }\r\n                    @case(\"FORM_SEEK\") {\r\n                        <core-form-control-seeker\r\n                            [excludeExistingList]=\"control.excludeExistingList!\"\r\n                            [multiMode]=\"control.multiMode!\" [multiModeTableHeight]=\"control.multiModeTableHeight!\" [multiModeRowHeight]=\"control.multiModeRowHeight!\"\r\n                            [formControlName]=\"control.field\" [alsoBindTo]=\"control.alsoBindTo!\"\r\n                            [seekerSourceType]=\"control.seekerSourceType!\" \r\n                            [preDefinedOuterParam$]=\"control.preDefinedOuterParam$!\"\r\n                            [preDefinedOuterFilter$]=\"control.preDefinedOuterFilter$!\"\r\n                            [boundFrom]=\"control.boundFrom!\" [shownFrom]=\"control.shownFrom!\"\r\n                            [getByIdObject$]=\"control.getByIdObject$!\"\r\n                            [multiModeExtendedColumns]=\"control.multiModeExtendedColumns!\"\r\n                            [multiModeExtendedSections]=\"control.multiModeExtendedSections!\"\r\n                            [multiModeTableHeight]=\"control.multiModeTableHeight!\"\r\n                            [click$]=\"control.click$\"\r\n                            [useTheseColumns]=\"control.useTheseColumns!\"\r\n                            [hideOrgTree]=\"control.hideOrgTree!\"\r\n                            [sourceSpaceHeight]=\"control.sourceSpaceHeight!\"\r\n                            [placeholder]=\"control.placeholder! || ''\"\r\n                            (selectedDataChange)=\"selectedDataChange($event)\"\r\n                            (fullValueRowChange)=\"fullValueRowChange($event)\"\r\n                        ></core-form-control-seeker>\r\n                    }\r\n                    @case(\"ORGANIZATION_UNIT_SEEK\") {\r\n                        <core-form-control-seeker\r\n                            [formControlName]=\"control.field\" [seekerSourceType]=\"control.seekerSourceType!\"\r\n                            [boundFrom]=\"control.boundFrom!\" [alsoBindTo]=\"control.alsoBindTo!\" [shownFrom]=\"control.shownFrom!\"\r\n                            [getByIdObject$]=\"control.getByIdObject$!\"\r\n                            [click$]=\"control.click$\"\r\n                            [placeholder]=\"control.placeholder! || ''\"\r\n                        ></core-form-control-seeker>\r\n                    }\r\n                }\r\n            }\r\n        }\r\n        </ng-container>\r\n\r\n        @if (control.controlType==='BUTTON') {\r\n        <ng-container>\r\n            <button type=\"button\" class=\"btn btn-secondary text\" (click)=\"oHandleClick($event)\">{{control.label| translate: lang}}</button>\r\n        </ng-container>\r\n        }\r\n        <!-- END: FORM-CONTROL SESSION-->\r\n\r\n        <!-- START: ERROR SESSION-->\r\n        @if (!!errors!.length) {\r\n        <div>\r\n            @for (error of errors; track $index) {\r\n            <div class=\"form-control-error\">\r\n                {{ error.errorMessage | translate: lang }}\r\n            </div>\r\n            }\r\n        </div>\r\n        }\r\n\r\n        @if (!errors!.length && !!checkError$.value) {\r\n        <div>\r\n            <div>\r\n                {{ '&nbsp;' }}\r\n            </div>\r\n        </div>\r\n        }\r\n        <!-- END: ERROR SESSION-->\r\n\r\n    </div>\r\n\r\n\r\n</div>\r\n\r\n<ng-template #calculatedControlInfo let-control=\"control\">\r\n    <div class=\"calculated-tooltip-container\">\r\n        <div class=\"calculated-field-row\">\r\n        <span class=\"label\">Name:</span>\r\n        <span class=\"value\">{{ control?.field || 'N/A' }}</span>\r\n        </div>        \r\n        <div class=\"calculated-field-row\">\r\n        <span class=\"label\">Evaluation Mode:</span>\r\n        <span class=\"value\">{{ control?.evaluationMode || 'N/A' }}</span>\r\n        </div>\r\n        <div class=\"calculated-field-row\">\r\n        <span class=\"label\">Return Type:</span>\r\n        <span class=\"value\">{{ control?.returnType || 'N/A' }}</span>\r\n        </div>\r\n        <div class=\"calculated-field-row\">\r\n        <span class=\"label\">Depends On:</span>\r\n        <span class=\"value\" *ngIf=\"control?.dependsOn?.length > 0; else noDepends\">\r\n            <code *ngFor=\"let dep of control?.dependsOn; let last = last\">{{ dep }}<span *ngIf=\"!last\">, </span></code>\r\n        </span>\r\n        <ng-template #noDepends><em class=\"no-depends\">None</em></ng-template>\r\n        </div>\r\n        <div *ngIf=\"!!control?.isUnsafe\" class=\"warning\">\r\n        \u26A0\uFE0F This script is marked as <strong>unsafe</strong> and will not be executed.\r\n        </div>\r\n        <div class=\"calculated-field-row\">\r\n        <span class=\"label\">Script:</span>\r\n        <pre class=\"code-block\">{{ control?.script || 'No script provided.' }}</pre>\r\n        </div>\r\n    </div>\r\n</ng-template>", styles: [".core-control-container{font-size:var(--typo-basic-font-size)!important}.core-control-container .control-label{color:#848484}.core-control-container>div.hidden{display:none}.core-control-container label{color:#464646}.core-control-container label.required:after{content:\"*\";color:#ff040b}.core-control-container label.avatar-label{width:var(--size-file-uploader);display:flex;align-items:center;justify-content:center}.core-control-container input[type=number]{padding-right:12px;position:relative}.core-control-container input[type=number]::-webkit-inner-spin-button{position:absolute;right:.3em;margin-left:.5em}.core-control-container input[type=number]{-moz-appearance:textfield}.core-control-container i.feather-help-circle{color:#848484}.core-control-container .gap-for-ios-switcher{height:5px}.core-control-container .calculated-view{-webkit-user-select:none;user-select:none;cursor:pointer;height:35px;width:160px;background-color:#d8f3dc;color:#1b4332;border:1px solid #95d5b2;border-radius:50px;font-size:14px;font-weight:500;display:flex;align-items:center;justify-content:flex-start;font-family:Segoe UI,sans-serif;letter-spacing:.5px;padding:8px}.core-control-container .calculated-view i{font-size:18px;width:18px;height:18px;margin-right:8px}.core-control-container .calculated-view span{width:calc(100% - 26px);overflow:hidden;text-overflow:ellipsis;text-wrap:nowrap}.calculated-tooltip-container{background-color:#fff;border:1px solid #ddd;padding:1rem;border-radius:6px;font-size:14px;color:#333;box-shadow:0 4px 10px #0000000d;max-width:360px}.calculated-tooltip-container .calculated-field-row{margin-bottom:.75rem}.calculated-tooltip-container .label{font-weight:500;color:#555!important;display:inline-block;min-width:140px}.calculated-tooltip-container .value{color:#222!important}.calculated-tooltip-container .warning{color:#b91c1c;background:#fef2f2;border:1px solid #fca5a5;padding:.5rem;border-radius:4px;margin-bottom:1rem;font-size:13px}.calculated-tooltip-container .code-block{background:#f8f9fa;border:1px solid #ddd;padding:.75rem;font-family:monospace;font-size:12px;white-space:pre-wrap;color:#111!important;border-radius:4px;overflow-x:auto}.calculated-tooltip-container .no-depends{color:#888;font-style:italic}.calculated-tooltip-container pre{overflow:hidden}.calculated-tooltip-container label.required~input:not([disabled]),.calculated-tooltip-container label.required~textarea:not([disabled]),.calculated-tooltip-container label.required~select:not([disabled]){background-color:#ff0!important}\n"] }]
+                    ], template: "<div class=\"core-control-container\">\r\n\r\n    <div [formGroup]=\"form\" [class.hidden]=\"!!control.hidden\">\r\n\r\n        @if (!control.headless!) {\r\n            <label [class]=\"'control-label' +  (required ? ' required' : '')\" [attr.for]=\"control.field\"\r\n                [class.d-none]=\"!!control.hidden\"\r\n                [class.avatar-label]=\"control.uploadFileType==='IMAGE_AVATAR'\" [appTooltip]=\"control.tooltip! | translate: lang\" \r\n                [htmlTooltip]=\"control.htmlTooltip!\"\r\n                [backgroundColor]=\"'white'\"\r\n                [ngStyle]=\"{\r\n                    display: 'inline-block'\r\n                }\">\r\n                {{(control.controlType!=='CHECKBOX' && control.controlType!=='BUTTON') ? (control.label | translate: lang) : ''}}\r\n            </label>\r\n\r\n            @if (!!control.hint! && control.controlType !== 'CHECKBOX') {\r\n                <i class=\"feather-help-circle\" [appTooltip]=\"control.hint!\" [showAnyway]=\"true\" [ngStyle]=\"{\r\n                    display: 'inline-block',\r\n                    marginLeft: '2px'\r\n                }\" [class.d-none]=\"!!control.hidden\"></i>\r\n            }\r\n        }\r\n\r\n        <!-- START: FORM-CONTROL SESSION-->\r\n\r\n        <ng-container>\r\n        @switch (control.controlType) {\r\n            @case (\"CALCULATED\") {\r\n                <div class=\"calculated-view\" [htmlTooltip]=\"calculatedControlInfo\" [tooltipContext]=\"{control: control}\" [backgroundColor]=\"'#fff'\">\r\n                    <i class=\"feather-box\"></i><span>{{ control.field! }}</span>\r\n                </div>\r\n            }\r\n            @case (\"TEXTBOX\") {\r\n\r\n                <input *ngIf=\"control.type === 'date'\"\r\n                    [formControlName]=\"control.field\"\r\n                    type=\"date\"\r\n                    useValueAsDate\r\n                    class=\"form-control\"\r\n                    [placeholder]=\"control.placeholder || ''\"\r\n                    [class.form-control-disabled]=\"disabled || !!control.disabled\" />\r\n              \r\n                <input *ngIf=\"control.type === 'time'\"\r\n                    [formControlName]=\"control.field\"\r\n                    type=\"time\"\r\n                    class=\"form-control\"\r\n                    [placeholder]=\"control.placeholder || ''\"\r\n                    [class.form-control-disabled]=\"disabled || !!control.disabled\" />\r\n              \r\n                <input *ngIf=\"control.type === 'number'\"\r\n                    [formControlName]=\"control.field\"\r\n                    type=\"number\"\r\n                    step=\"{{ control.step || 1 }}\"\r\n                    class=\"form-control\"\r\n                    style=\"text-align: right;\"\r\n                    [placeholder]=\"control.placeholder || ''\"\r\n                    [class.form-control-disabled]=\"disabled || !!control.disabled\" />\r\n              \r\n                <input *ngIf=\"['string', 'text', 'email', 'url', 'password'].includes(control.type || 'text')\"\r\n                    [formControlName]=\"control.field\"\r\n                    [type]=\"control.type\"\r\n                    class=\"form-control\"\r\n                    [placeholder]=\"control.placeholder || ''\"\r\n                    [value]=\"form.get(control.field)?.value | tableCell: control.pipe : lang\"\r\n                    [attr.pattern]=\"getPattern(control) || null\"\r\n                    [appTooltip]=\"form.get(control.field)?.value\"\r\n                    (focus)=\"onFocus($event)\"\r\n                    (blur)=\"onBlur($event)\"\r\n                    [class.form-control-disabled]=\"disabled || !!control.disabled\" />\r\n\r\n                <!-- <input *ngIf=\"control.type==='calculated'\"\r\n                    [formControlName]=\"control.field\"\r\n                    type=\"text\"\r\n                    class=\"form-control\"\r\n                    [readonly]=\"true\"\r\n                    [placeholder]=\"control.placeholder || ''\"\r\n                    [value]=\"form.get(control.field)?.value | tableCell: control.pipe : lang\"\r\n                    [attr.pattern]=\"getPattern(control) || null\"\r\n                    [appTooltip]=\"form.get(control.field)?.value\"\r\n                    (focus)=\"onFocus($event)\"\r\n                    (blur)=\"onBlur($event)\"\r\n                    [class.form-control-disabled]=\"true\" /> -->\r\n\r\n            }\r\n            @case (\"CURRENCY\") {\r\n                <core-currency-input \r\n                    [disabled]=\"!!disabled || !!control.disabled\"\r\n                    [formControlName]=\"control.field\" [placeholder]=\"control.placeholder! || ''\"></core-currency-input>\r\n            }\r\n            @case (\"TEXTAREA\") {\r\n                <textarea \r\n                    [rows]=\"control.textareaRows?.toString() || '3'\" [ngStyle]=\"{ height: 'unset' }\"\r\n                    [class.form-control-disabled]=\"disabled || !!control.disabled\"\r\n                    [formControlName]=\"control.field\" class=\"form-control\" [readonly]=\"control.readonly\" [placeholder]=\"control.placeholder! || ''\"></textarea>\r\n            }\r\n            @case (\"CHECKBOX\") {\r\n                <core-checkbox \r\n                    [disabled]=\"!!disabled || !!control.disabled\"\r\n                    [formControlName]=\"control.field\" [text]=\"control.label\"\r\n                    [inputValue]=\"control.value\" [tooltip]=\"control.hint!\"></core-checkbox>\r\n            }\r\n            @case (\"IOS_SWITCHER\") {\r\n                <div class=\"gap-for-ios-switcher\"></div>\r\n                <core-ios-switcher [disabled]=\"!!disabled || !!control.disabled\" [formControlName]=\"control.field\" />\r\n            }\r\n            @case (\"MCC\") {\r\n                <core-mcc [formControlName]=\"control.field\" [columns]=\"control.columns!\" [shownFrom]=\"control.shownFrom!\" \r\n                [apiDefinition]=\"control.apiDefinition!\" [getByIdApi]=\"control.getByIdApi!\" [selectedRow$]=\"control.selectedRow$!\"\r\n                [outerParam$]=\"control.outerParam$!\"\r\n                [disabled]=\"!!disabled || !!control.disabled\"\r\n                [placeholder]=\"control.placeholder! || ''\"\r\n                ></core-mcc>\r\n            }\r\n            @case (\"DATEPICKER\") {\r\n                <core-date-picker \r\n                    [disabled]=\"!!disabled || !!control.disabled\"\r\n                    [formControlName]=\"control.field\" [showPlaceholder]=\"control.showPlaceholder!\" [rangeLimit]=\"control.rangeLimit!\" [popupAlign]=\"control.popupAlign!\" [placeholder]=\"control.placeholder! || ''\"></core-date-picker>\r\n            }\r\n\r\n            @case (\"DROPDOWN\") {\r\n                @if (!!control.dropdownOptions$) {\r\n                    <core-dropdown \r\n                        [formControlName]=\"control.field\" \r\n                        [options$]=\"control.dropdownOptions$!\"\r\n                        [getByIdObject$]=\"control.getByIdObject$!\" \r\n                        [shownFrom]=\"control.shownFrom!\" \r\n                        [placeholder]=\"control.placeholder! || ''\"\r\n                        [disabled]=\"!!disabled || !!control.disabled\"\r\n                        [optionApiDriven]=\"control.optionApiDriven!\"\r\n                        [optionApi]=\"control.optionApi!\"\r\n                        [optionHttpVerb]=\"control.optionHttpVerb!\"\r\n                        [optionHttpPayload]=\"control.optionHttpPayload!\"\r\n                        [optionValueFrom]=\"control.optionValueFrom!\"\r\n                        [optionTextFrom]=\"control.optionTextFrom!\"\r\n                    ></core-dropdown>\r\n                } @else {\r\n                    No dropdownOptions$ detected\r\n                }\r\n            }\r\n            @case (\"LIST\") {\r\n                <core-list \r\n                    [disabled]=\"!!disabled || !!control.disabled\"\r\n                    [formControlName]=\"control.field\" [options]=\"control.listOptions!\" [placeholder]=\"control.placeholder! || ''\"></core-list>\r\n            }\r\n            @case (\"CHECKLIST\") {\r\n                @if (!!control.checklistOptions$) {\r\n                    <core-checklist \r\n                        [disabled]=\"!!disabled || !!control.disabled\"\r\n                        [formControlName]=\"control.field\" [options$]=\"control.checklistOptions$!\"\r\n                        [getByIdObject$]=\"control.getByIdObject$!\" [shownFrom]=\"control.shownFrom!\" [placeholder]=\"control.placeholder! || ''\"></core-checklist>\r\n                }\r\n            }\r\n            @case (\"FILEUPLOADER\") {\r\n                @if (!!control.uploadFileType) {\r\n                    <core-file-uploader \r\n                        [disabled]=\"!!disabled || !!control.disabled\"\r\n                        [formControlName]=\"control.field\" [uploadFileType]=\"control.uploadFileType\"\r\n                        [fileDataControlName]=\"control.fileDataControlName!\"\r\n                        [fileNameControlName]=\"control.fileNameControlName!\"\r\n                        [fileTypeControlName]=\"control.fileTypeControlName!\"\r\n                        [verticalMode]=\"control.verticalMode!\"></core-file-uploader>\r\n                }\r\n            }\r\n            @case (\"ATTACHMENT\") {\r\n                <core-attachment ngDefaultControl [formControlName]=\"control.field\" [assignTo]=\"control.assignTo!\"\r\n                    [disabled]=\"!!disabled || !!control.disabled\"\r\n                    [valueToShow]=\"control.valueToShow!\" [placeholder]=\"control.placeholder! || ''\"></core-attachment>\r\n            }\r\n            @case (\"GRIDBUFFER\") {\r\n                @if (!!control.gridBufferFormSections && !!control.gridBufferTableColumns) {\r\n                    <core-grid-buffer [formControlName]=\"control.field\" [formSections]=\"control.gridBufferFormSections\"\r\n                        [disabled]=\"!!disabled || !!control.disabled\"\r\n                        [gridColumns]=\"control.gridBufferTableColumns\"\r\n                        (onBufferFormCreated)=\"!!control.onBufferFormCreated ? control.onBufferFormCreated($event) : null\"></core-grid-buffer>\r\n                }\r\n            }\r\n            @case (\"ORGTREECHECK\") {\r\n                <core-org-tree \r\n                    [disabled]=\"!!disabled || !!control.disabled\"\r\n                    [formControlName]=\"control.field\"\r\n                    [accessorMode]=\"coreOrgTreeDefaultAccessorMode\" [height]=\"control.height!\"></core-org-tree>\r\n            }\r\n            @case (\"RADIOGROUP\") {\r\n                <core-radio-group [formControlName]=\"control.field\"\r\n                    [disabled]=\"!!disabled || !!control.disabled\"\r\n                    [options$]=\"control.radioGroupOptions$!\"\r\n                    [vertical]=\"control.verticalMode!\"\r\n                    ></core-radio-group>\r\n            }\r\n            @case (\"MONTHSELECTOR\") {\r\n                <core-month-selector \r\n                    [disabled]=\"!!disabled || !!control.disabled\"\r\n                    [formControlName]=\"control.field\" [placeholder]=\"control.placeholder! || ''\"></core-month-selector>\r\n            }\r\n            @case (\"SHIFTCELL\") {\r\n                <core-shift-cell \r\n                    [disabled]=\"!!disabled || !!control.disabled\"\r\n                    [formControlName]=\"control.field\"></core-shift-cell>\r\n            }\r\n            @case (\"SHIFTCOLLECTION\") {\r\n                <core-shift-collection \r\n                    [disabled]=\"!!disabled || !!control.disabled\"\r\n                    [relativeMode]=\"true\" [height]=\"control.height || 800\"></core-shift-collection>\r\n            }\r\n            @case(\"TOPICPICKER\") {\r\n                <core-topic-picker \r\n                    [disabled]=\"!!disabled || !!control.disabled\"\r\n                    [formControlName]=\"control.field\" [popupHeight]=\"control.popupHeight!\" [getByIdApi]=\"control.getByIdApi!\"></core-topic-picker>\r\n            }\r\n            @case (\"SEEKER\") {\r\n                @switch(control.seekerSourceType) {\r\n                    @case(\"JOB_SEEK\") {\r\n                        <core-form-control-seeker\r\n                            [disabled]=\"!!disabled || !!control.disabled\"\r\n                            [excludeExistingList]=\"control.excludeExistingList!\"\r\n                            [multiMode]=\"control.multiMode!\" [multiModeTableHeight]=\"control.multiModeTableHeight!\" [multiModeRowHeight]=\"control.multiModeRowHeight!\"\r\n                            [objectList$]=\"control.objectList$!\" [formControlName]=\"control.field\"\r\n                            [seekerSourceType]=\"control.seekerSourceType!\" \r\n                            [preDefinedOuterParam$]=\"control.preDefinedOuterParam$!\"\r\n                            [preDefinedOuterFilter$]=\"control.preDefinedOuterFilter$!\"\r\n                            [boundFrom]=\"control.boundFrom!\" [shownFrom]=\"control.shownFrom!\" [alsoBindTo]=\"control.alsoBindTo!\"\r\n                            [getByIdObject$]=\"control.getByIdObject$!\"\r\n                            [click$]=\"control.click$\"\r\n                            [multiModeExtendedColumns]=\"control.multiModeExtendedColumns!\"\r\n                            [multiModeExtendedSections]=\"control.multiModeExtendedSections!\"\r\n                            [editBufferData$]=\"control.editBufferData$!\"\r\n                            [indirectBinding]=\"control.indirectBinding!\"\r\n                            [bindGridIdTo]=\"control.bindGridIdTo!\"\r\n                            [useTheseColumns]=\"control.useTheseColumns!\"\r\n                            [hideOrgTree]=\"control.hideOrgTree!\"\r\n                            [sourceSpaceHeight]=\"control.sourceSpaceHeight!\"\r\n                            (selectedDataChange)=\"selectedDataChange($event)\"\r\n                            (fullValueRowChange)=\"fullValueRowChange($event)\"\r\n                        ></core-form-control-seeker>\r\n                    }\r\n                    @case(\"EMPLOYEE_SEEK\") {\r\n                        <core-form-control-seeker\r\n                            [excludeExistingList]=\"control.excludeExistingList!\"\r\n                            [disabled]=\"!!disabled || !!control.disabled\"\r\n                            [multiMode]=\"control.multiMode!\" [multiModeTableHeight]=\"control.multiModeTableHeight!\" [multiModeRowHeight]=\"control.multiModeRowHeight!\"\r\n                            [objectList$]=\"control.objectList$!\" [formControlName]=\"control.field\"\r\n                            [seekerSourceType]=\"control.seekerSourceType!\" \r\n                            [preDefinedOuterParam$]=\"control.preDefinedOuterParam$!\"\r\n                            [preDefinedOuterFilter$]=\"control.preDefinedOuterFilter$!\"\r\n                            [boundFrom]=\"control.boundFrom!\" [shownFrom]=\"control.shownFrom!\" [alsoBindTo]=\"control.alsoBindTo!\"\r\n                            [getByIdObject$]=\"control.getByIdObject$!\"\r\n                            [click$]=\"control.click$\"\r\n                            [multiModeExtendedColumns]=\"control.multiModeExtendedColumns!\"\r\n                            [multiModeExtendedSections]=\"control.multiModeExtendedSections!\"\r\n                            [editBufferData$]=\"control.editBufferData$!\"\r\n                            [indirectBinding]=\"control.indirectBinding!\"\r\n                            [bindGridIdTo]=\"control.bindGridIdTo!\"\r\n                            [useTheseColumns]=\"control.useTheseColumns!\"\r\n                            [hideOrgTree]=\"control.hideOrgTree!\"\r\n                            [sourceSpaceHeight]=\"control.sourceSpaceHeight!\"\r\n                            [placeholder]=\"control.placeholder! || ''\"\r\n                            (selectedDataChange)=\"selectedDataChange($event)\"\r\n                            (fullValueRowChange)=\"fullValueRowChange($event)\"\r\n                        ></core-form-control-seeker>\r\n                    }\r\n                    @case(\"CONTRACT_SEEK\") {\r\n                        <core-form-control-seeker\r\n                            [disabled]=\"!!disabled || !!control.disabled\"\r\n                            [excludeExistingList]=\"control.excludeExistingList!\"\r\n                            [multiMode]=\"control.multiMode!\" [multiModeTableHeight]=\"control.multiModeTableHeight!\" [multiModeRowHeight]=\"control.multiModeRowHeight!\"\r\n                            [objectList$]=\"control.objectList$!\" [formControlName]=\"control.field\"\r\n                            [seekerSourceType]=\"control.seekerSourceType!\" [boundFrom]=\"control.boundFrom!\"\r\n                            [preDefinedOuterParam$]=\"control.preDefinedOuterParam$!\" \r\n                            [preDefinedOuterFilter$]=\"control.preDefinedOuterFilter$!\"\r\n                            [shownFrom]=\"control.shownFrom!\"\r\n                            [alsoBindTo]=\"control.alsoBindTo!\"\r\n                            [getByIdObject$]=\"control.getByIdObject$!\"\r\n                            [multiModeExtendedColumns]=\"control.multiModeExtendedColumns!\"\r\n                            [multiModeExtendedSections]=\"control.multiModeExtendedSections!\"\r\n                            [click$]=\"control.click$\"\r\n                            [useTheseColumns]=\"control.useTheseColumns!\"\r\n                            [hideOrgTree]=\"control.hideOrgTree!\"\r\n                            [sourceSpaceHeight]=\"control.sourceSpaceHeight!\"\r\n                            [placeholder]=\"control.placeholder! || ''\"\r\n                            (selectedDataChange)=\"selectedDataChange($event)\"\r\n                            (fullValueRowChange)=\"fullValueRowChange($event)\"\r\n                        ></core-form-control-seeker>\r\n                    }\r\n                    @case(\"WORKING_SEEK\") {\r\n                        <core-form-control-seeker \r\n                            [disabled]=\"!!disabled || !!control.disabled\"\r\n                            [excludeExistingList]=\"control.excludeExistingList!\"\r\n                            [multiMode]=\"control.multiMode!\" [multiModeTableHeight]=\"control.multiModeTableHeight!\" [multiModeRowHeight]=\"control.multiModeRowHeight!\"\r\n                            [objectList$]=\"control.objectList$!\" [formControlName]=\"control.field\"\r\n                            [seekerSourceType]=\"control.seekerSourceType!\" \r\n                            [preDefinedOuterParam$]=\"control.preDefinedOuterParam$!\"\r\n                            [preDefinedOuterFilter$]=\"control.preDefinedOuterFilter$!\"\r\n                            [boundFrom]=\"control.boundFrom!\" [shownFrom]=\"control.shownFrom!\" [alsoBindTo]=\"control.alsoBindTo!\"\r\n                            [getByIdObject$]=\"control.getByIdObject$!\"\r\n                            [multiModeExtendedColumns]=\"control.multiModeExtendedColumns!\"\r\n                            [multiModeExtendedSections]=\"control.multiModeExtendedSections!\"\r\n                            [click$]=\"control.click$\"\r\n                            [useTheseColumns]=\"control.useTheseColumns!\"\r\n                            [hideOrgTree]=\"control.hideOrgTree!\"\r\n                            [sourceSpaceHeight]=\"control.sourceSpaceHeight!\"\r\n                            [placeholder]=\"control.placeholder! || ''\"\r\n                            (selectedDataChange)=\"selectedDataChange($event)\"\r\n                            (fullValueRowChange)=\"fullValueRowChange($event)\"\r\n                        ></core-form-control-seeker>\r\n                    }\r\n                    @case(\"WAGE_SEEK\") {\r\n                        <core-form-control-seeker \r\n                            [disabled]=\"!!disabled || !!control.disabled\"\r\n                            [excludeExistingList]=\"control.excludeExistingList!\"\r\n                            [formControlName]=\"control.field\"\r\n                            [multiMode]=\"control.multiMode!\" [multiModeTableHeight]=\"control.multiModeTableHeight!\" [multiModeRowHeight]=\"control.multiModeRowHeight!\"\r\n                            [objectList$]=\"control.objectList$!\"\r\n                            [seekerSourceType]=\"control.seekerSourceType!\" \r\n                            [preDefinedOuterParam$]=\"control.preDefinedOuterParam$!\"\r\n                            [preDefinedOuterFilter$]=\"control.preDefinedOuterFilter$!\"\r\n                            [boundFrom]=\"control.boundFrom!\" [shownFrom]=\"control.shownFrom!\" [alsoBindTo]=\"control.alsoBindTo!\"\r\n                            [getByIdObject$]=\"control.getByIdObject$!\"\r\n                            [multiModeExtendedColumns]=\"control.multiModeExtendedColumns!\"\r\n                            [multiModeExtendedSections]=\"control.multiModeExtendedSections!\"\r\n                            [click$]=\"control.click$\"\r\n                            [useTheseColumns]=\"control.useTheseColumns!\"\r\n                            [hideOrgTree]=\"control.hideOrgTree!\"\r\n                            [sourceSpaceHeight]=\"control.sourceSpaceHeight!\"\r\n                            [placeholder]=\"control.placeholder! || ''\"\r\n                            (selectedDataChange)=\"selectedDataChange($event)\"\r\n                            (fullValueRowChange)=\"fullValueRowChange($event)\"\r\n                        ></core-form-control-seeker>\r\n                    }\r\n                    @case(\"POSITION_SEEK\") {\r\n                        <core-form-control-seeker \r\n                            [disabled]=\"!!disabled || !!control.disabled\"\r\n                            [excludeExistingList]=\"control.excludeExistingList!\"\r\n                            [objectList$]=\"control.objectList$!\"\r\n                            [multiMode]=\"control.multiMode!\" [multiModeTableHeight]=\"control.multiModeTableHeight!\" [multiModeRowHeight]=\"control.multiModeRowHeight!\"\r\n                            [formControlName]=\"control.field\" [alsoBindTo]=\"control.alsoBindTo!\"\r\n                            [seekerSourceType]=\"control.seekerSourceType!\" \r\n                            [preDefinedOuterParam$]=\"control.preDefinedOuterParam$!\"\r\n                            [preDefinedOuterFilter$]=\"control.preDefinedOuterFilter$!\"\r\n                            [boundFrom]=\"control.boundFrom!\" [shownFrom]=\"control.shownFrom!\"\r\n                            [getByIdObject$]=\"control.getByIdObject$!\"\r\n                            [multiModeExtendedColumns]=\"control.multiModeExtendedColumns!\"\r\n                            [multiModeExtendedSections]=\"control.multiModeExtendedSections!\"\r\n                            [seekerVerifyIgnore]=\"control.seekerVerifyIgnore!\"\r\n                            [click$]=\"control.click$\"\r\n                            [useTheseColumns]=\"control.useTheseColumns!\"\r\n                            [hideOrgTree]=\"control.hideOrgTree!\"\r\n                            [sourceSpaceHeight]=\"control.sourceSpaceHeight!\"\r\n                            [placeholder]=\"control.placeholder! || ''\"\r\n                            (selectedDataChange)=\"selectedDataChange($event)\"\r\n                            (fullValueRowChange)=\"fullValueRowChange($event)\"\r\n                        ></core-form-control-seeker>\r\n                    }\r\n                    @case(\"POSITION_CONCURRENT_SEEK\") {\r\n                        <core-form-control-seeker\r\n                            [disabled]=\"!!disabled || !!control.disabled\"\r\n                            [excludeExistingList]=\"control.excludeExistingList!\"\r\n                            [multiMode]=\"control.multiMode!\" [multiModeTableHeight]=\"control.multiModeTableHeight!\" [multiModeRowHeight]=\"control.multiModeRowHeight!\"\r\n                            [formControlName]=\"control.field\" [alsoBindTo]=\"control.alsoBindTo!\"\r\n                            [seekerSourceType]=\"control.seekerSourceType!\" \r\n                            [preDefinedOuterParam$]=\"control.preDefinedOuterParam$!\"\r\n                            [preDefinedOuterFilter$]=\"control.preDefinedOuterFilter$!\"\r\n                            [boundFrom]=\"control.boundFrom!\" [shownFrom]=\"control.shownFrom!\"\r\n                            [getByIdObject$]=\"control.getByIdObject$!\"\r\n                            [multiModeExtendedColumns]=\"control.multiModeExtendedColumns!\"\r\n                            [multiModeExtendedSections]=\"control.multiModeExtendedSections!\"\r\n                            [multiModeTableHeight]=\"control.multiModeTableHeight!\"\r\n                            [click$]=\"control.click$\"\r\n                            [useTheseColumns]=\"control.useTheseColumns!\"\r\n                            [hideOrgTree]=\"control.hideOrgTree!\"\r\n                            [sourceSpaceHeight]=\"control.sourceSpaceHeight!\"\r\n                            [placeholder]=\"control.placeholder! || ''\"\r\n                            (selectedDataChange)=\"selectedDataChange($event)\"\r\n                            (fullValueRowChange)=\"fullValueRowChange($event)\"\r\n                        ></core-form-control-seeker>\r\n                    }\r\n                    @case(\"FORM_SEEK\") {\r\n                        <core-form-control-seeker\r\n                            [disabled]=\"!!disabled || !!control.disabled\"\r\n                            [excludeExistingList]=\"control.excludeExistingList!\"\r\n                            [multiMode]=\"control.multiMode!\" [multiModeTableHeight]=\"control.multiModeTableHeight!\" [multiModeRowHeight]=\"control.multiModeRowHeight!\"\r\n                            [formControlName]=\"control.field\" [alsoBindTo]=\"control.alsoBindTo!\"\r\n                            [seekerSourceType]=\"control.seekerSourceType!\" \r\n                            [preDefinedOuterParam$]=\"control.preDefinedOuterParam$!\"\r\n                            [preDefinedOuterFilter$]=\"control.preDefinedOuterFilter$!\"\r\n                            [boundFrom]=\"control.boundFrom!\" [shownFrom]=\"control.shownFrom!\"\r\n                            [getByIdObject$]=\"control.getByIdObject$!\"\r\n                            [multiModeExtendedColumns]=\"control.multiModeExtendedColumns!\"\r\n                            [multiModeExtendedSections]=\"control.multiModeExtendedSections!\"\r\n                            [multiModeTableHeight]=\"control.multiModeTableHeight!\"\r\n                            [click$]=\"control.click$\"\r\n                            [useTheseColumns]=\"control.useTheseColumns!\"\r\n                            [hideOrgTree]=\"control.hideOrgTree!\"\r\n                            [sourceSpaceHeight]=\"control.sourceSpaceHeight!\"\r\n                            [placeholder]=\"control.placeholder! || ''\"\r\n                            (selectedDataChange)=\"selectedDataChange($event)\"\r\n                            (fullValueRowChange)=\"fullValueRowChange($event)\"\r\n                        ></core-form-control-seeker>\r\n                    }\r\n                    @case(\"ORGANIZATION_UNIT_SEEK\") {\r\n                        <core-form-control-seeker\r\n                            [disabled]=\"!!disabled || !!control.disabled\"\r\n                            [formControlName]=\"control.field\" [seekerSourceType]=\"control.seekerSourceType!\"\r\n                            [boundFrom]=\"control.boundFrom!\" [alsoBindTo]=\"control.alsoBindTo!\" [shownFrom]=\"control.shownFrom!\"\r\n                            [getByIdObject$]=\"control.getByIdObject$!\"\r\n                            [click$]=\"control.click$\"\r\n                            [placeholder]=\"control.placeholder! || ''\"\r\n                        ></core-form-control-seeker>\r\n                    }\r\n                }\r\n            }\r\n        }\r\n        </ng-container>\r\n\r\n        @if (control.controlType==='BUTTON') {\r\n        <ng-container>\r\n            <button type=\"button\" class=\"btn btn-secondary text\" (click)=\"oHandleClick($event)\">{{control.label| translate: lang}}</button>\r\n        </ng-container>\r\n        }\r\n        <!-- END: FORM-CONTROL SESSION-->\r\n\r\n        <!-- START: ERROR SESSION-->\r\n        @if (!!errors!.length) {\r\n        <div>\r\n            @for (error of errors; track $index) {\r\n            <div class=\"form-control-error\">\r\n                {{ error.errorMessage | translate: lang }}\r\n            </div>\r\n            }\r\n        </div>\r\n        }\r\n\r\n        @if (!errors!.length && !!checkError$.value) {\r\n        <div>\r\n            <div>\r\n                {{ '&nbsp;' }}\r\n            </div>\r\n        </div>\r\n        }\r\n        <!-- END: ERROR SESSION-->\r\n\r\n    </div>\r\n\r\n\r\n</div>\r\n\r\n<ng-template #calculatedControlInfo let-control=\"control\">\r\n    <div class=\"calculated-tooltip-container\">\r\n        <div class=\"calculated-field-row\">\r\n        <span class=\"label\">Name:</span>\r\n        <span class=\"value\">{{ control?.field || 'N/A' }}</span>\r\n        </div>        \r\n        <div class=\"calculated-field-row\">\r\n        <span class=\"label\">Evaluation Mode:</span>\r\n        <span class=\"value\">{{ control?.evaluationMode || 'N/A' }}</span>\r\n        </div>\r\n        <div class=\"calculated-field-row\">\r\n        <span class=\"label\">Return Type:</span>\r\n        <span class=\"value\">{{ control?.returnType || 'N/A' }}</span>\r\n        </div>\r\n        <div class=\"calculated-field-row\">\r\n        <span class=\"label\">Depends On:</span>\r\n        <span class=\"value\" *ngIf=\"control?.dependsOn?.length > 0; else noDepends\">\r\n            <code *ngFor=\"let dep of control?.dependsOn; let last = last\">{{ dep }}<span *ngIf=\"!last\">, </span></code>\r\n        </span>\r\n        <ng-template #noDepends><em class=\"no-depends\">None</em></ng-template>\r\n        </div>\r\n        <div *ngIf=\"!!control?.isUnsafe\" class=\"warning\">\r\n        \u26A0\uFE0F This script is marked as <strong>unsafe</strong> and will not be executed.\r\n        </div>\r\n        <div class=\"calculated-field-row\">\r\n        <span class=\"label\">Script:</span>\r\n        <pre class=\"code-block\">{{ control?.script || 'No script provided.' }}</pre>\r\n        </div>\r\n    </div>\r\n</ng-template>", styles: [".core-control-container{font-size:var(--typo-basic-font-size)!important}.core-control-container .control-label{color:#848484}.core-control-container>div.hidden{display:none}.core-control-container label{color:#464646}.core-control-container label.required:after{content:\"*\";color:#ff040b}.core-control-container label.avatar-label{width:var(--size-file-uploader);display:flex;align-items:center;justify-content:center}.core-control-container input[type=number]{padding-right:12px;position:relative}.core-control-container input[type=number]::-webkit-inner-spin-button{position:absolute;right:.3em;margin-left:.5em}.core-control-container input[type=number]{-moz-appearance:textfield}.core-control-container i.feather-help-circle{color:#848484}.core-control-container .gap-for-ios-switcher{height:5px}.core-control-container .calculated-view{-webkit-user-select:none;user-select:none;cursor:pointer;height:35px;width:160px;background-color:#d8f3dc;color:#1b4332;border:1px solid #95d5b2;border-radius:50px;font-size:14px;font-weight:500;display:flex;align-items:center;justify-content:flex-start;font-family:Segoe UI,sans-serif;letter-spacing:.5px;padding:8px}.core-control-container .calculated-view i{font-size:18px;width:18px;height:18px;margin-right:8px}.core-control-container .calculated-view span{width:calc(100% - 26px);overflow:hidden;text-overflow:ellipsis;text-wrap:nowrap}.calculated-tooltip-container{background-color:#fff;border:1px solid #ddd;padding:1rem;border-radius:6px;font-size:14px;color:#333;box-shadow:0 4px 10px #0000000d;max-width:360px}.calculated-tooltip-container .calculated-field-row{margin-bottom:.75rem}.calculated-tooltip-container .label{font-weight:500;color:#555!important;display:inline-block;min-width:140px}.calculated-tooltip-container .value{color:#222!important}.calculated-tooltip-container .warning{color:#b91c1c;background:#fef2f2;border:1px solid #fca5a5;padding:.5rem;border-radius:4px;margin-bottom:1rem;font-size:13px}.calculated-tooltip-container .code-block{background:#f8f9fa;border:1px solid #ddd;padding:.75rem;font-family:monospace;font-size:12px;white-space:pre-wrap;color:#111!important;border-radius:4px;overflow-x:auto}.calculated-tooltip-container .no-depends{color:#888;font-style:italic}.calculated-tooltip-container pre{overflow:hidden}.calculated-tooltip-container label.required~input:not([disabled]),.calculated-tooltip-container label.required~textarea:not([disabled]),.calculated-tooltip-container label.required~select:not([disabled]){background-color:#ff0!important}\n"] }]
         }], ctorParameters: () => [{ type: MultiLanguageService }, { type: AlertService }], propDecorators: { control: [{
                 type: Input
             }], checkError$: [{
                 type: Input
             }], rangeLimit: [{
                 type: Input
+            }], readonly: [{
+                type: Input
+            }], disabled: [{
+                type: Input
             }], onWindowClick: [{
                 type: HostListener,
                 args: ['window:click']
             }] } });
 
-class CoreFormArrayComponent {
+class CoreFormArrayComponent extends CoreFormControlBaseComponent {
     constructor() {
+        super();
         this.lang = signal('vi');
         this.controlGroups = signal([]);
         this.subscriptions = [];
-        this.enrichment = inject(CoreFormEnrichmentService);
+        //enrichment = inject(CoreFormEnrichmentService);
         this.cfs = inject(CoreFormService);
         const mls = inject(MultiLanguageService);
         this.subscriptions.push(mls.lang$.subscribe(x => this.lang.set(x)));
@@ -25709,13 +25717,13 @@ class CoreFormArrayComponent {
         this.subscriptions.forEach(x => x?.unsubscribe());
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: CoreFormArrayComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.5", type: CoreFormArrayComponent, isStandalone: true, selector: "core-form-array", inputs: { formArrayName: "formArrayName", parentFormGroup: "parentFormGroup", formArray: "formArray", config: "config", checkError$: "checkError$" }, providers: [
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.5", type: CoreFormArrayComponent, isStandalone: true, selector: "core-form-array", inputs: { formArrayName: "formArrayName", parentFormGroup: "parentFormGroup", formArray: "formArray", config: "config", checkError$: "checkError$", readonly: "readonly", disabled: "disabled" }, providers: [
             {
                 provide: NG_VALUE_ACCESSOR,
                 multi: true,
                 useExisting: forwardRef(() => CoreFormArrayComponent),
             }
-        ], usesOnChanges: true, ngImport: i0, template: "<div class=\"core-form-array-container\">\r\n\r\n\r\n    @for (group of controlGroups(); track $index; let i = $index) {\r\n    <!-- \u2705 Parent owns the formGroup context -->\r\n    <div class=\"form-array-item\" [formGroup]=\"group\">\r\n\r\n        <div class=\"form-array-content\">\r\n            @for (section of config; track $index) {\r\n            @if (!section.hidden) {\r\n            <div class=\"section\">\r\n                <!-- @if (section.caption) {\r\n                <div class=\"section-caption\">{{ section.caption }}</div>\r\n                } -->\r\n\r\n                @for (row of section.rows; track $index) {\r\n                <div class=\"row mb15\">\r\n                    @for (col of row; track $index) {\r\n                    <div [class]=\"'col-md-' + col.flexSize\">\r\n                        <!-- no [form] needed -->\r\n                        <core-control-no-form-array [control]=\"col\" [checkError$]=\"checkError$\"></core-control-no-form-array>\r\n                    </div>\r\n                    }\r\n                </div>\r\n                }\r\n            </div>\r\n            }\r\n            }\r\n        </div>\r\n\r\n        <div class=\"form-array-toolbar\">\r\n            <button type=\"button\" class=\"btn btn-danger btn-sm feather-trash-2\" (click)=\"removeItem(i)\"\r\n                [appTooltip]=\"'Remove group'\" [showAnyway]=\"true\"></button>\r\n        </div>\r\n    </div>\r\n    }\r\n\r\n    <div class=\"form-array-footer\">\r\n        <button type=\"button\" class=\"btn btn-success btn-sm feather-file-plus\" (click)=\"addItem()\"\r\n            [appTooltip]=\"'Add group'\" [showAnyway]=\"true\"></button>\r\n    </div>\r\n</div>", styles: [".core-form-array-container{padding:15px;border:1px solid #ced4da}.core-form-array-container .form-array-item{display:flex;align-items:flex-start}.core-form-array-container .form-array-item>*{display:inline-block!important}.core-form-array-container .form-array-item .form-array-content{width:calc(100% - 46px)}.core-form-array-container .form-array-item .form-array-toolbar{width:14px;padding-left:12px;transform:translateY(25px)}\n"], dependencies: [{ kind: "directive", type: TooltipDirective, selector: "[appTooltip]", inputs: ["appTooltip", "showAnyway", "color", "backgroundColor", "position"] }, { kind: "component", type: CoreControlNoFormArrayComponent, selector: "core-control-no-form-array", inputs: ["control", "checkError$", "rangeLimit"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$3.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$3.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+        ], usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "<div class=\"core-form-array-container\">\r\n\r\n\r\n    @for (group of controlGroups(); track $index; let i = $index) {\r\n    <!-- \u2705 Parent owns the formGroup context -->\r\n    <div class=\"form-array-item\" [formGroup]=\"group\">\r\n\r\n        <div class=\"form-array-content\">\r\n            @for (section of config; track $index) {\r\n            @if (!section.hidden) {\r\n            <div class=\"section\">\r\n                <!-- @if (section.caption) {\r\n                <div class=\"section-caption\">{{ section.caption }}</div>\r\n                } -->\r\n\r\n                @for (row of section.rows; track $index) {\r\n                <div class=\"row mb15\">\r\n                    @for (col of row; track $index) {\r\n                    <div [class]=\"'col-md-' + col.flexSize\">\r\n                        <!-- no [form] needed -->\r\n                        <core-control-no-form-array \r\n                            [control]=\"col\" \r\n                            [readonly]=\"!!disabled || !!col.readonly\"\r\n                            [disabled]=\"!!disabled || !!col.disabled\"\r\n                            [checkError$]=\"checkError$\">\r\n                        </core-control-no-form-array>\r\n                    </div>\r\n                    }\r\n                </div>\r\n                }\r\n            </div>\r\n            }\r\n            }\r\n        </div>\r\n\r\n        @if (!disabled && !readonly) {\r\n        <div class=\"form-array-toolbar\">\r\n            <button type=\"button\" class=\"btn btn-danger btn-sm feather-trash-2\" (click)=\"removeItem(i)\"\r\n                [appTooltip]=\"'Remove group'\" [showAnyway]=\"true\"></button>\r\n        </div>\r\n        }\r\n    </div>\r\n    }\r\n\r\n    @if (!disabled && !readonly) {\r\n    <div class=\"form-array-footer\">\r\n        <button type=\"button\" class=\"btn btn-success btn-sm feather-file-plus\" (click)=\"addItem()\"\r\n            [appTooltip]=\"'Add group'\" [showAnyway]=\"true\"></button>\r\n    </div>\r\n    }\r\n</div>", styles: [".core-form-array-container{padding:15px;border:1px solid #ced4da}.core-form-array-container .form-array-item{display:flex;align-items:flex-start}.core-form-array-container .form-array-item>*{display:inline-block!important}.core-form-array-container .form-array-item .form-array-content{width:calc(100% - 46px)}.core-form-array-container .form-array-item .form-array-toolbar{width:14px;padding-left:12px;transform:translateY(25px)}\n"], dependencies: [{ kind: "directive", type: TooltipDirective, selector: "[appTooltip]", inputs: ["appTooltip", "showAnyway", "color", "backgroundColor", "position"] }, { kind: "component", type: CoreControlNoFormArrayComponent, selector: "core-control-no-form-array", inputs: ["control", "checkError$", "rangeLimit", "readonly", "disabled"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$3.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$3.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: CoreFormArrayComponent, decorators: [{
             type: Component,
@@ -25731,7 +25739,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.5", ngImpor
                         TooltipDirective,
                         CoreControlNoFormArrayComponent,
                         ReactiveFormsModule
-                    ], template: "<div class=\"core-form-array-container\">\r\n\r\n\r\n    @for (group of controlGroups(); track $index; let i = $index) {\r\n    <!-- \u2705 Parent owns the formGroup context -->\r\n    <div class=\"form-array-item\" [formGroup]=\"group\">\r\n\r\n        <div class=\"form-array-content\">\r\n            @for (section of config; track $index) {\r\n            @if (!section.hidden) {\r\n            <div class=\"section\">\r\n                <!-- @if (section.caption) {\r\n                <div class=\"section-caption\">{{ section.caption }}</div>\r\n                } -->\r\n\r\n                @for (row of section.rows; track $index) {\r\n                <div class=\"row mb15\">\r\n                    @for (col of row; track $index) {\r\n                    <div [class]=\"'col-md-' + col.flexSize\">\r\n                        <!-- no [form] needed -->\r\n                        <core-control-no-form-array [control]=\"col\" [checkError$]=\"checkError$\"></core-control-no-form-array>\r\n                    </div>\r\n                    }\r\n                </div>\r\n                }\r\n            </div>\r\n            }\r\n            }\r\n        </div>\r\n\r\n        <div class=\"form-array-toolbar\">\r\n            <button type=\"button\" class=\"btn btn-danger btn-sm feather-trash-2\" (click)=\"removeItem(i)\"\r\n                [appTooltip]=\"'Remove group'\" [showAnyway]=\"true\"></button>\r\n        </div>\r\n    </div>\r\n    }\r\n\r\n    <div class=\"form-array-footer\">\r\n        <button type=\"button\" class=\"btn btn-success btn-sm feather-file-plus\" (click)=\"addItem()\"\r\n            [appTooltip]=\"'Add group'\" [showAnyway]=\"true\"></button>\r\n    </div>\r\n</div>", styles: [".core-form-array-container{padding:15px;border:1px solid #ced4da}.core-form-array-container .form-array-item{display:flex;align-items:flex-start}.core-form-array-container .form-array-item>*{display:inline-block!important}.core-form-array-container .form-array-item .form-array-content{width:calc(100% - 46px)}.core-form-array-container .form-array-item .form-array-toolbar{width:14px;padding-left:12px;transform:translateY(25px)}\n"] }]
+                    ], template: "<div class=\"core-form-array-container\">\r\n\r\n\r\n    @for (group of controlGroups(); track $index; let i = $index) {\r\n    <!-- \u2705 Parent owns the formGroup context -->\r\n    <div class=\"form-array-item\" [formGroup]=\"group\">\r\n\r\n        <div class=\"form-array-content\">\r\n            @for (section of config; track $index) {\r\n            @if (!section.hidden) {\r\n            <div class=\"section\">\r\n                <!-- @if (section.caption) {\r\n                <div class=\"section-caption\">{{ section.caption }}</div>\r\n                } -->\r\n\r\n                @for (row of section.rows; track $index) {\r\n                <div class=\"row mb15\">\r\n                    @for (col of row; track $index) {\r\n                    <div [class]=\"'col-md-' + col.flexSize\">\r\n                        <!-- no [form] needed -->\r\n                        <core-control-no-form-array \r\n                            [control]=\"col\" \r\n                            [readonly]=\"!!disabled || !!col.readonly\"\r\n                            [disabled]=\"!!disabled || !!col.disabled\"\r\n                            [checkError$]=\"checkError$\">\r\n                        </core-control-no-form-array>\r\n                    </div>\r\n                    }\r\n                </div>\r\n                }\r\n            </div>\r\n            }\r\n            }\r\n        </div>\r\n\r\n        @if (!disabled && !readonly) {\r\n        <div class=\"form-array-toolbar\">\r\n            <button type=\"button\" class=\"btn btn-danger btn-sm feather-trash-2\" (click)=\"removeItem(i)\"\r\n                [appTooltip]=\"'Remove group'\" [showAnyway]=\"true\"></button>\r\n        </div>\r\n        }\r\n    </div>\r\n    }\r\n\r\n    @if (!disabled && !readonly) {\r\n    <div class=\"form-array-footer\">\r\n        <button type=\"button\" class=\"btn btn-success btn-sm feather-file-plus\" (click)=\"addItem()\"\r\n            [appTooltip]=\"'Add group'\" [showAnyway]=\"true\"></button>\r\n    </div>\r\n    }\r\n</div>", styles: [".core-form-array-container{padding:15px;border:1px solid #ced4da}.core-form-array-container .form-array-item{display:flex;align-items:flex-start}.core-form-array-container .form-array-item>*{display:inline-block!important}.core-form-array-container .form-array-item .form-array-content{width:calc(100% - 46px)}.core-form-array-container .form-array-item .form-array-toolbar{width:14px;padding-left:12px;transform:translateY(25px)}\n"] }]
         }], ctorParameters: () => [], propDecorators: { formArrayName: [{
                 type: Input,
                 args: [{ required: true }]
@@ -25747,6 +25755,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.5", ngImpor
             }], checkError$: [{
                 type: Input,
                 args: [{ required: true }]
+            }], readonly: [{
+                type: Input
+            }], disabled: [{
+                type: Input
             }] } });
 
 class CoreDocgenToolbarComponent {
@@ -26765,7 +26777,7 @@ class CoreControlComponent extends BaseComponent {
         }
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: CoreControlComponent, deps: [{ token: MultiLanguageService }, { token: AlertService }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.5", type: CoreControlComponent, isStandalone: true, selector: "core-control", inputs: { control: "control", form: "form", checkError$: "checkError$", rangeLimit: "rangeLimit" }, host: { listeners: { "window:click": "onWindowClick()" } }, usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "<div class=\"core-control-container\">\r\n\r\n    <div [formGroup]=\"form\" [class.hidden]=\"!!control.hidden\">\r\n\r\n        @if (!control.headless!) {\r\n            <label [class]=\"'control-label' +  (required ? ' required' : '')\" [attr.for]=\"control.field\"\r\n                [class.d-none]=\"!!control.hidden\"\r\n                [class.avatar-label]=\"control.uploadFileType==='IMAGE_AVATAR'\" [appTooltip]=\"control.tooltip! | translate: lang\" \r\n                [htmlTooltip]=\"control.htmlTooltip!\"\r\n                [backgroundColor]=\"'white'\"\r\n                [ngStyle]=\"{\r\n                    display: 'inline-block'\r\n                }\">\r\n                {{(control.controlType!=='CHECKBOX' && control.controlType!=='BUTTON') ? (control.label | translate: lang) : ''}}\r\n            </label>\r\n\r\n            @if (!!control.hint! && control.controlType !== 'CHECKBOX') {\r\n                <i class=\"feather-help-circle\" [appTooltip]=\"control.hint!\" [showAnyway]=\"true\" [ngStyle]=\"{\r\n                    display: 'inline-block',\r\n                    marginLeft: '2px'\r\n                }\" [class.d-none]=\"!!control.hidden\"></i>\r\n            }\r\n        }\r\n\r\n        <!-- START: FORM-CONTROL SESSION-->\r\n\r\n        <ng-container>\r\n        @switch (control.controlType) {\r\n            @case (\"FORM_ARRAY\") {\r\n                <core-form-array\r\n                    [formArrayName]=\"control.field!\"\r\n                    [parentFormGroup]=\"form\"\r\n                    [formArray]=\"formArray\"\r\n                    [config]=\"control.formArraySections! ?? []\"\r\n                    [checkError$]=\"checkError$\">\r\n                </core-form-array>\r\n            }\r\n            @case (\"CALCULATED\") {\r\n                <div class=\"calculated-view\" [htmlTooltip]=\"calculatedControlInfo\" [tooltipContext]=\"{control: control}\" [backgroundColor]=\"'#fff'\">\r\n                    <i class=\"feather-box\"></i><span>{{ control.field! }}</span>\r\n                </div>\r\n            }\r\n            @case (\"TEXTBOX\") {\r\n\r\n                <input *ngIf=\"control.type === 'date'\"\r\n                    [formControlName]=\"control.field\"\r\n                    type=\"date\"\r\n                    useValueAsDate\r\n                    class=\"form-control\"\r\n                    [readonly]=\"control.readonly\"\r\n                    [placeholder]=\"control.placeholder || ''\"\r\n                    [class.required-highlight]=\"!!required\"\r\n                    [class.form-control-disabled]=\"!!control.disabled\" />\r\n              \r\n                <input *ngIf=\"control.type === 'time'\"\r\n                    [formControlName]=\"control.field\"\r\n                    type=\"time\"\r\n                    class=\"form-control\"\r\n                    [readonly]=\"control.readonly\"\r\n                    [placeholder]=\"control.placeholder || ''\"\r\n                    [class.required-highlight]=\"!!required\"\r\n                    [class.form-control-disabled]=\"!!control.disabled\" />\r\n              \r\n                <input *ngIf=\"control.type === 'number'\"\r\n                    [formControlName]=\"control.field\"\r\n                    type=\"number\"\r\n                    step=\"{{ control.step || 1 }}\"\r\n                    class=\"form-control\"\r\n                    style=\"text-align: right;\"\r\n                    [readonly]=\"control.readonly\"\r\n                    [placeholder]=\"control.placeholder || ''\"\r\n                    [class.required-highlight]=\"!!required\"\r\n                    [class.form-control-disabled]=\"!!control.disabled\" />\r\n              \r\n                <input *ngIf=\"['string', 'text', 'email', 'url', 'password'].includes(control.type || 'text')\"\r\n                    [formControlName]=\"control.field\"\r\n                    [type]=\"control.type\"\r\n                    class=\"form-control\"\r\n                    [readonly]=\"control.readonly\"\r\n                    [placeholder]=\"control.placeholder || ''\"\r\n                    [value]=\"form.get(control.field)?.value | tableCell: control.pipe : lang\"\r\n                    [attr.pattern]=\"getPattern(control) || null\"\r\n                    [appTooltip]=\"form.get(control.field)?.value\"\r\n                    (focus)=\"onFocus($event)\"\r\n                    (blur)=\"onBlur($event)\"\r\n                    [class.required-highlight]=\"!!required\"\r\n                    [class.form-control-disabled]=\"!!control.disabled\" />\r\n            }\r\n            @case (\"CURRENCY\") {\r\n                <core-currency-input [required]=\"required\" [formControlName]=\"control.field\" [placeholder]=\"control.placeholder! || ''\"></core-currency-input>\r\n            }\r\n            @case (\"TEXTAREA\") {\r\n                <textarea [rows]=\"control.textareaRows?.toString() || '3'\" [ngStyle]=\"{ height: 'unset' }\"\r\n                    [class.required-highlight]=\"!!required\"\r\n                    [formControlName]=\"control.field\" class=\"form-control\" [readonly]=\"control.readonly\" [placeholder]=\"control.placeholder! || ''\"></textarea>\r\n            }\r\n            @case (\"CHECKBOX\") {\r\n                <core-checkbox [formControlName]=\"control.field\" [text]=\"control.label\"\r\n                    [inputValue]=\"control.value\" [tooltip]=\"control.hint!\"></core-checkbox>\r\n            }\r\n            @case (\"IOS_SWITCHER\") {\r\n                <div class=\"gap-for-ios-switcher\"></div>\r\n                <core-ios-switcher [formControlName]=\"control.field\" />\r\n            }\r\n            @case (\"MCC\") {\r\n                <core-mcc [required]=\"required\" [formControlName]=\"control.field\" [columns]=\"control.columns!\" [shownFrom]=\"control.shownFrom!\" \r\n                [apiDefinition]=\"control.apiDefinition!\" [getByIdApi]=\"control.getByIdApi!\" [selectedRow$]=\"control.selectedRow$!\"\r\n                [outerParam$]=\"control.outerParam$!\"\r\n                [placeholder]=\"control.placeholder! || ''\"\r\n                ></core-mcc>\r\n            }\r\n            @case (\"DATEPICKER\") {\r\n                <core-date-picker [required]=\"required\" [formControlName]=\"control.field\" [showPlaceholder]=\"control.showPlaceholder!\" [rangeLimit]=\"control.rangeLimit!\" [popupAlign]=\"control.popupAlign!\" [placeholder]=\"control.placeholder! || ''\"></core-date-picker>\r\n            }\r\n\r\n            @case (\"DROPDOWN\") {\r\n                @if (!!control.dropdownOptions$ || !!control.optionApiDriven) {\r\n                    <core-dropdown \r\n                        [required]=\"required\" \r\n                        [formControlName]=\"control.field\" \r\n                        [options$]=\"control.dropdownOptions$!\"\r\n                        [getByIdObject$]=\"control.getByIdObject$!\" \r\n                        [shownFrom]=\"control.shownFrom!\" \r\n                        [placeholder]=\"control.placeholder! || ''\"\r\n\r\n                        [optionApiDriven]=\"control.optionApiDriven!\"\r\n                        [optionApi]=\"control.optionApi!\"\r\n                        [optionHttpVerb]=\"control.optionHttpVerb!\"\r\n                        [optionHttpPayload]=\"control.optionHttpPayload!\"\r\n                        [optionValueFrom]=\"control.optionValueFrom!\"\r\n                        [optionTextFrom]=\"control.optionTextFrom!\"\r\n                    ></core-dropdown>\r\n                } @else {\r\n                    No dropdownOptions$ | optionApiDriven detected\r\n                }\r\n            }\r\n            @case (\"LIST\") {\r\n                <core-list [required]=\"required\" [formControlName]=\"control.field\" [options]=\"control.listOptions!\" [placeholder]=\"control.placeholder! || ''\"></core-list>\r\n            }\r\n            @case (\"CHECKLIST\") {\r\n                @if (!!control.checklistOptions$) {\r\n                    <core-checklist [required]=\"required\" [formControlName]=\"control.field\" [options$]=\"control.checklistOptions$!\"\r\n                        [getByIdObject$]=\"control.getByIdObject$!\" [shownFrom]=\"control.shownFrom!\" [placeholder]=\"control.placeholder! || ''\"></core-checklist>\r\n                }\r\n            }\r\n            @case (\"FILEUPLOADER\") {\r\n                @if (!!control.uploadFileType) {\r\n                    <core-file-uploader [required]=\"required\" [formControlName]=\"control.field\" [uploadFileType]=\"control.uploadFileType\"\r\n                        [fileDataControlName]=\"control.fileDataControlName!\"\r\n                        [fileNameControlName]=\"control.fileNameControlName!\"\r\n                        [fileTypeControlName]=\"control.fileTypeControlName!\"\r\n                        [verticalMode]=\"control.verticalMode!\"></core-file-uploader>\r\n                } @else {\r\n                    <div class=\"dev-declaration\">Please add uploadFileType</div>\r\n                }\r\n            }\r\n            @case (\"ATTACHMENT\") {\r\n                <core-attachment ngDefaultControl [required]=\"required\" [formControlName]=\"control.field\" [assignTo]=\"control.assignTo!\"\r\n                    [valueToShow]=\"control.valueToShow!\" [placeholder]=\"control.placeholder! || ''\"></core-attachment>\r\n            }\r\n            @case (\"GRIDBUFFER\") {\r\n                @if (!!control.gridBufferFormSections && !!control.gridBufferTableColumns) {\r\n                    <core-grid-buffer [required]=\"required\" [formControlName]=\"control.field\" [formSections]=\"control.gridBufferFormSections\"\r\n                        [gridColumns]=\"control.gridBufferTableColumns\"\r\n                        [placeholder]=\"control.placeholder! || ''\"\r\n                        [tableHeight]=\"control.tableHeight ?? 300\"\r\n                        [liteMode]=\"control.liteMode ?? false\"\r\n                        (onBufferFormCreated)=\"!!control.onBufferFormCreated ? control.onBufferFormCreated($event) : null\"></core-grid-buffer>\r\n                }\r\n            }\r\n            @case (\"ORGTREECHECK\") {\r\n                <core-org-tree [required]=\"required\" [formControlName]=\"control.field\"\r\n                    [accessorMode]=\"coreOrgTreeDefaultAccessorMode\" [height]=\"control.height!\"></core-org-tree>\r\n            }\r\n            @case (\"RADIOGROUP\") {\r\n                <core-radio-group [required]=\"required\" [formControlName]=\"control.field\"\r\n                    [options$]=\"control.radioGroupOptions$!\"\r\n                    [vertical]=\"control.verticalMode!\"\r\n                    ></core-radio-group>\r\n            }\r\n            @case (\"MONTHSELECTOR\") {\r\n                <core-month-selector [required]=\"required\" [formControlName]=\"control.field\" [placeholder]=\"control.placeholder! || ''\"></core-month-selector>\r\n            }\r\n            @case (\"SHIFTCELL\") {\r\n                <core-shift-cell [formControlName]=\"control.field\"></core-shift-cell>\r\n            }\r\n            @case (\"SHIFTCOLLECTION\") {\r\n                <core-shift-collection [relativeMode]=\"true\" [height]=\"control.height || 800\"></core-shift-collection>\r\n            }\r\n            @case(\"TOPICPICKER\") {\r\n                <core-topic-picker [required]=\"required\" [formControlName]=\"control.field\" [popupHeight]=\"control.popupHeight!\" [getByIdApi]=\"control.getByIdApi!\"></core-topic-picker>\r\n            }\r\n            @case(\"STICKER_COLLECTION\") {\r\n                  <core-sticker-collection\r\n                    [formControlName]=\"control.field\"\r\n                    [required]=\"required\"\r\n                    [$items]=\"control.stickerCollectionItems!\"\r\n                    [$shownFrom]=\"control.stickerCollectionShownFrom!\"\r\n                    [$tooltipFrom]=\"control.stickerCollectionTooltipFrom!\"\r\n                    [$initialChecked]=\"control.stickerCollectionInitialChecked!\"\r\n                    >\r\n                </core-sticker-collection>\r\n            }\r\n            @case (\"SEEKER\") {\r\n                @switch(control.seekerSourceType) {\r\n                    @case(\"JOB_SEEK\") {\r\n                        <core-form-control-seeker\r\n                            [required]=\"required\" \r\n                            [excludeExistingList]=\"control.excludeExistingList!\"\r\n                            [multiMode]=\"control.multiMode!\" [multiModeTableHeight]=\"control.multiModeTableHeight!\" [multiModeRowHeight]=\"control.multiModeRowHeight!\"\r\n                            [objectList$]=\"control.objectList$!\" [formControlName]=\"control.field\"\r\n                            [seekerSourceType]=\"control.seekerSourceType!\" \r\n                            [preDefinedOuterParam$]=\"control.preDefinedOuterParam$!\"\r\n                            [preDefinedOuterFilter$]=\"control.preDefinedOuterFilter$!\"\r\n                            [boundFrom]=\"control.boundFrom!\" [shownFrom]=\"control.shownFrom!\" [alsoBindTo]=\"control.alsoBindTo!\"\r\n                            [getByIdObject$]=\"control.getByIdObject$!\"\r\n                            [click$]=\"control.click$\"\r\n                            [multiModeExtendedColumns]=\"control.multiModeExtendedColumns!\"\r\n                            [multiModeExtendedSections]=\"control.multiModeExtendedSections!\"\r\n                            [editBufferData$]=\"control.editBufferData$!\"\r\n                            [indirectBinding]=\"control.indirectBinding!\"\r\n                            [bindGridIdTo]=\"control.bindGridIdTo!\"\r\n                            [useTheseColumns]=\"control.useTheseColumns!\"\r\n                            [hideOrgTree]=\"control.hideOrgTree!\"\r\n                            [sourceSpaceHeight]=\"control.sourceSpaceHeight!\"\r\n                            (selectedDataChange)=\"selectedDataChange($event)\"\r\n                            (fullValueRowChange)=\"fullValueRowChange($event)\"\r\n                        ></core-form-control-seeker>\r\n                    }\r\n                    @case(\"EMPLOYEE_SEEK\") {\r\n                        <core-form-control-seeker\r\n                            [required]=\"required\" \r\n                            [excludeExistingList]=\"control.excludeExistingList!\"\r\n                            [multiMode]=\"control.multiMode!\" [multiModeTableHeight]=\"control.multiModeTableHeight!\" [multiModeRowHeight]=\"control.multiModeRowHeight!\"\r\n                            [objectList$]=\"control.objectList$!\" [formControlName]=\"control.field\"\r\n                            [seekerSourceType]=\"control.seekerSourceType!\" \r\n                            [preDefinedOuterParam$]=\"control.preDefinedOuterParam$!\"\r\n                            [preDefinedOuterFilter$]=\"control.preDefinedOuterFilter$!\"\r\n                            [boundFrom]=\"control.boundFrom!\" [shownFrom]=\"control.shownFrom!\" [alsoBindTo]=\"control.alsoBindTo!\"\r\n                            [getByIdObject$]=\"control.getByIdObject$!\"\r\n                            [click$]=\"control.click$\"\r\n                            [multiModeExtendedColumns]=\"control.multiModeExtendedColumns!\"\r\n                            [multiModeExtendedSections]=\"control.multiModeExtendedSections!\"\r\n                            [editBufferData$]=\"control.editBufferData$!\"\r\n                            [indirectBinding]=\"control.indirectBinding!\"\r\n                            [bindGridIdTo]=\"control.bindGridIdTo!\"\r\n                            [useTheseColumns]=\"control.useTheseColumns!\"\r\n                            [hideOrgTree]=\"control.hideOrgTree!\"\r\n                            [sourceSpaceHeight]=\"control.sourceSpaceHeight!\"\r\n                            [placeholder]=\"control.placeholder! || ''\"\r\n                            (selectedDataChange)=\"selectedDataChange($event)\"\r\n                            (fullValueRowChange)=\"fullValueRowChange($event)\"\r\n                        ></core-form-control-seeker>\r\n                    }\r\n                    @case(\"CONTRACT_SEEK\") {\r\n                        <core-form-control-seeker\r\n                            [required]=\"required\" \r\n                            [excludeExistingList]=\"control.excludeExistingList!\"\r\n                            [multiMode]=\"control.multiMode!\" [multiModeTableHeight]=\"control.multiModeTableHeight!\" [multiModeRowHeight]=\"control.multiModeRowHeight!\"\r\n                            [objectList$]=\"control.objectList$!\" [formControlName]=\"control.field\"\r\n                            [seekerSourceType]=\"control.seekerSourceType!\" [boundFrom]=\"control.boundFrom!\"\r\n                            [preDefinedOuterParam$]=\"control.preDefinedOuterParam$!\" \r\n                            [preDefinedOuterFilter$]=\"control.preDefinedOuterFilter$!\"\r\n                            [shownFrom]=\"control.shownFrom!\"\r\n                            [alsoBindTo]=\"control.alsoBindTo!\"\r\n                            [getByIdObject$]=\"control.getByIdObject$!\"\r\n                            [multiModeExtendedColumns]=\"control.multiModeExtendedColumns!\"\r\n                            [multiModeExtendedSections]=\"control.multiModeExtendedSections!\"\r\n                            [click$]=\"control.click$\"\r\n                            [useTheseColumns]=\"control.useTheseColumns!\"\r\n                            [hideOrgTree]=\"control.hideOrgTree!\"\r\n                            [sourceSpaceHeight]=\"control.sourceSpaceHeight!\"\r\n                            [placeholder]=\"control.placeholder! || ''\"\r\n                            (selectedDataChange)=\"selectedDataChange($event)\"\r\n                            (fullValueRowChange)=\"fullValueRowChange($event)\"\r\n                        ></core-form-control-seeker>\r\n                    }\r\n                    @case(\"WORKING_SEEK\") {\r\n                        <core-form-control-seeker \r\n                            [required]=\"required\" \r\n                            [excludeExistingList]=\"control.excludeExistingList!\"\r\n                            [multiMode]=\"control.multiMode!\" [multiModeTableHeight]=\"control.multiModeTableHeight!\" [multiModeRowHeight]=\"control.multiModeRowHeight!\"\r\n                            [objectList$]=\"control.objectList$!\" [formControlName]=\"control.field\"\r\n                            [seekerSourceType]=\"control.seekerSourceType!\" \r\n                            [preDefinedOuterParam$]=\"control.preDefinedOuterParam$!\"\r\n                            [preDefinedOuterFilter$]=\"control.preDefinedOuterFilter$!\"\r\n                            [boundFrom]=\"control.boundFrom!\" [shownFrom]=\"control.shownFrom!\" [alsoBindTo]=\"control.alsoBindTo!\"\r\n                            [getByIdObject$]=\"control.getByIdObject$!\"\r\n                            [multiModeExtendedColumns]=\"control.multiModeExtendedColumns!\"\r\n                            [multiModeExtendedSections]=\"control.multiModeExtendedSections!\"\r\n                            [click$]=\"control.click$\"\r\n                            [useTheseColumns]=\"control.useTheseColumns!\"\r\n                            [hideOrgTree]=\"control.hideOrgTree!\"\r\n                            [sourceSpaceHeight]=\"control.sourceSpaceHeight!\"\r\n                            [placeholder]=\"control.placeholder! || ''\"\r\n                            (selectedDataChange)=\"selectedDataChange($event)\"\r\n                            (fullValueRowChange)=\"fullValueRowChange($event)\"\r\n                        ></core-form-control-seeker>\r\n                    }\r\n                    @case(\"WAGE_SEEK\") {\r\n                        <core-form-control-seeker \r\n                            [required]=\"required\" \r\n                            [excludeExistingList]=\"control.excludeExistingList!\"\r\n                            [formControlName]=\"control.field\"\r\n                            [multiMode]=\"control.multiMode!\" [multiModeTableHeight]=\"control.multiModeTableHeight!\" [multiModeRowHeight]=\"control.multiModeRowHeight!\"\r\n                            [objectList$]=\"control.objectList$!\"\r\n                            [seekerSourceType]=\"control.seekerSourceType!\" \r\n                            [preDefinedOuterParam$]=\"control.preDefinedOuterParam$!\"\r\n                            [preDefinedOuterFilter$]=\"control.preDefinedOuterFilter$!\"\r\n                            [boundFrom]=\"control.boundFrom!\" [shownFrom]=\"control.shownFrom!\" [alsoBindTo]=\"control.alsoBindTo!\"\r\n                            [getByIdObject$]=\"control.getByIdObject$!\"\r\n                            [multiModeExtendedColumns]=\"control.multiModeExtendedColumns!\"\r\n                            [multiModeExtendedSections]=\"control.multiModeExtendedSections!\"\r\n                            [click$]=\"control.click$\"\r\n                            [useTheseColumns]=\"control.useTheseColumns!\"\r\n                            [hideOrgTree]=\"control.hideOrgTree!\"\r\n                            [sourceSpaceHeight]=\"control.sourceSpaceHeight!\"\r\n                            [placeholder]=\"control.placeholder! || ''\"\r\n                            (selectedDataChange)=\"selectedDataChange($event)\"\r\n                            (fullValueRowChange)=\"fullValueRowChange($event)\"\r\n                        ></core-form-control-seeker>\r\n                    }\r\n                    @case(\"POSITION_SEEK\") {\r\n                        <core-form-control-seeker \r\n                            [required]=\"required\" \r\n                            [excludeExistingList]=\"control.excludeExistingList!\"\r\n                            [objectList$]=\"control.objectList$!\"\r\n                            [multiMode]=\"control.multiMode!\" [multiModeTableHeight]=\"control.multiModeTableHeight!\" [multiModeRowHeight]=\"control.multiModeRowHeight!\"\r\n                            [formControlName]=\"control.field\" [alsoBindTo]=\"control.alsoBindTo!\"\r\n                            [seekerSourceType]=\"control.seekerSourceType!\" \r\n                            [preDefinedOuterParam$]=\"control.preDefinedOuterParam$!\"\r\n                            [preDefinedOuterFilter$]=\"control.preDefinedOuterFilter$!\"\r\n                            [boundFrom]=\"control.boundFrom!\" [shownFrom]=\"control.shownFrom!\"\r\n                            [getByIdObject$]=\"control.getByIdObject$!\"\r\n                            [multiModeExtendedColumns]=\"control.multiModeExtendedColumns!\"\r\n                            [multiModeExtendedSections]=\"control.multiModeExtendedSections!\"\r\n                            [seekerVerifyIgnore]=\"control.seekerVerifyIgnore!\"\r\n                            [click$]=\"control.click$\"\r\n                            [useTheseColumns]=\"control.useTheseColumns!\"\r\n                            [hideOrgTree]=\"control.hideOrgTree!\"\r\n                            [sourceSpaceHeight]=\"control.sourceSpaceHeight!\"\r\n                            [placeholder]=\"control.placeholder! || ''\"\r\n                            (selectedDataChange)=\"selectedDataChange($event)\"\r\n                            (fullValueRowChange)=\"fullValueRowChange($event)\"\r\n                        ></core-form-control-seeker>\r\n                    }\r\n                    @case(\"POSITION_CONCURRENT_SEEK\") {\r\n                        <core-form-control-seeker\r\n                            [required]=\"required\" \r\n                            [excludeExistingList]=\"control.excludeExistingList!\"\r\n                            [multiMode]=\"control.multiMode!\" [multiModeTableHeight]=\"control.multiModeTableHeight!\" [multiModeRowHeight]=\"control.multiModeRowHeight!\"\r\n                            [formControlName]=\"control.field\" [alsoBindTo]=\"control.alsoBindTo!\"\r\n                            [seekerSourceType]=\"control.seekerSourceType!\" \r\n                            [preDefinedOuterParam$]=\"control.preDefinedOuterParam$!\"\r\n                            [preDefinedOuterFilter$]=\"control.preDefinedOuterFilter$!\"\r\n                            [boundFrom]=\"control.boundFrom!\" [shownFrom]=\"control.shownFrom!\"\r\n                            [getByIdObject$]=\"control.getByIdObject$!\"\r\n                            [multiModeExtendedColumns]=\"control.multiModeExtendedColumns!\"\r\n                            [multiModeExtendedSections]=\"control.multiModeExtendedSections!\"\r\n                            [multiModeTableHeight]=\"control.multiModeTableHeight!\"\r\n                            [click$]=\"control.click$\"\r\n                            [useTheseColumns]=\"control.useTheseColumns!\"\r\n                            [hideOrgTree]=\"control.hideOrgTree!\"\r\n                            [sourceSpaceHeight]=\"control.sourceSpaceHeight!\"\r\n                            [placeholder]=\"control.placeholder! || ''\"\r\n                            (selectedDataChange)=\"selectedDataChange($event)\"\r\n                            (fullValueRowChange)=\"fullValueRowChange($event)\"\r\n                        ></core-form-control-seeker>\r\n                    }\r\n                    @case(\"FORM_SEEK\") {\r\n                        <core-form-control-seeker\r\n                            [required]=\"required\" \r\n                            [excludeExistingList]=\"control.excludeExistingList!\"\r\n                            [multiMode]=\"control.multiMode!\" [multiModeTableHeight]=\"control.multiModeTableHeight!\" [multiModeRowHeight]=\"control.multiModeRowHeight!\"\r\n                            [formControlName]=\"control.field\" [alsoBindTo]=\"control.alsoBindTo!\"\r\n                            [seekerSourceType]=\"control.seekerSourceType!\" \r\n                            [preDefinedOuterParam$]=\"control.preDefinedOuterParam$!\"\r\n                            [preDefinedOuterFilter$]=\"control.preDefinedOuterFilter$!\"\r\n                            [boundFrom]=\"control.boundFrom!\" [shownFrom]=\"control.shownFrom!\"\r\n                            [getByIdObject$]=\"control.getByIdObject$!\"\r\n                            [multiModeExtendedColumns]=\"control.multiModeExtendedColumns!\"\r\n                            [multiModeExtendedSections]=\"control.multiModeExtendedSections!\"\r\n                            [multiModeTableHeight]=\"control.multiModeTableHeight!\"\r\n                            [click$]=\"control.click$\"\r\n                            [useTheseColumns]=\"control.useTheseColumns!\"\r\n                            [hideOrgTree]=\"control.hideOrgTree!\"\r\n                            [sourceSpaceHeight]=\"control.sourceSpaceHeight!\"\r\n                            [placeholder]=\"control.placeholder! || ''\"\r\n                            (selectedDataChange)=\"selectedDataChange($event)\"\r\n                            (fullValueRowChange)=\"fullValueRowChange($event)\"\r\n                        ></core-form-control-seeker>\r\n                    }\r\n                    @case(\"ORGANIZATION_UNIT_SEEK\") {\r\n                        <core-form-control-seeker\r\n                            [required]=\"required\" \r\n                            [formControlName]=\"control.field\" [seekerSourceType]=\"control.seekerSourceType!\"\r\n                            [boundFrom]=\"control.boundFrom!\" [alsoBindTo]=\"control.alsoBindTo!\" [shownFrom]=\"control.shownFrom!\"\r\n                            [getByIdObject$]=\"control.getByIdObject$!\"\r\n                            [click$]=\"control.click$\"\r\n                            [placeholder]=\"control.placeholder! || ''\"\r\n                        ></core-form-control-seeker>\r\n                    }\r\n                }\r\n            }\r\n            @case (\"LIQUID_WYSIWYG\") {\r\n                <core-liquid-wysiwyg\r\n                    [formControlName]=\"control.field\"\r\n                    [getByIdObject$]=\"control.getByIdObject$!\"\r\n                    [placeholder]=\"control.placeholder! || ''\"\r\n                    [$liquidOptions]=\"control.liquidOptions!\"\r\n                    [$textareaRows]=\"control.textareaRows!\"\r\n                    [$showLiquidSourceOnly]=\"control.showLiquidSourceOnly!\"\r\n                    [$isForWorkflowEmail]=\"control.isForWorkflowEmail!\"\r\n                />\r\n            }\r\n        }\r\n        </ng-container>\r\n\r\n        <ng-container *ngIf=\"control.controlType==='BUTTON'\">\r\n            <button type=\"button\" class=\"btn btn-secondary text\" (click)=\"oHandleClick($event)\">{{control.label| translate: lang}}</button>\r\n        </ng-container>\r\n        <!-- END: FORM-CONTROL SESSION-->\r\n\r\n        <!-- START: ERROR SESSION-->\r\n        <div *ngIf=\"!!errors!.length\">\r\n            <div class=\"form-control-error\" *ngFor=\"let error of errors\">\r\n                {{ error.errorMessage | translate: lang }}\r\n            </div>\r\n        </div>\r\n        <div *ngIf=\"!!!errors!.length && !!checkError$.value\">\r\n            <div>\r\n                {{ '&nbsp;' }}\r\n            </div>\r\n        </div>\r\n        <!-- END: ERROR SESSION-->\r\n\r\n    </div>\r\n\r\n\r\n</div>\r\n\r\n<ng-template #calculatedControlInfo let-control=\"control\">\r\n    <div class=\"calculated-tooltip-container\">\r\n        <div class=\"calculated-field-row\">\r\n        <span class=\"label\">Name:</span>\r\n        <span class=\"value\">{{ control?.field || 'N/A' }}</span>\r\n        </div>        \r\n        <div class=\"calculated-field-row\">\r\n        <span class=\"label\">Evaluation Mode:</span>\r\n        <span class=\"value\">{{ control?.evaluationMode || 'N/A' }}</span>\r\n        </div>\r\n        <div class=\"calculated-field-row\">\r\n        <span class=\"label\">Return Type:</span>\r\n        <span class=\"value\">{{ control?.returnType || 'N/A' }}</span>\r\n        </div>\r\n        <div class=\"calculated-field-row\">\r\n        <span class=\"label\">Depends On:</span>\r\n        <span class=\"value\" *ngIf=\"control?.dependsOn?.length > 0; else noDepends\">\r\n            <code *ngFor=\"let dep of control?.dependsOn; let last = last\">{{ dep }}<span *ngIf=\"!last\">, </span></code>\r\n        </span>\r\n        <ng-template #noDepends><em class=\"no-depends\">None</em></ng-template>\r\n        </div>\r\n        <div *ngIf=\"!!control?.isUnsafe\" class=\"warning\">\r\n        \u26A0\uFE0F This script is marked as <strong>unsafe</strong> and will not be executed.\r\n        </div>\r\n        <div class=\"calculated-field-row\">\r\n        <span class=\"label\">Script:</span>\r\n        <pre class=\"code-block\">{{ control?.script || 'No script provided.' }}</pre>\r\n        </div>\r\n    </div>\r\n</ng-template>", styles: [".core-control-container{font-size:var(--typo-basic-font-size)!important}.core-control-container .control-label{color:#848484}.core-control-container>div.hidden{display:none}.core-control-container label{color:#464646}.core-control-container label.required:after{content:\"*\";color:#ff040b}.core-control-container label.avatar-label{width:var(--size-file-uploader);display:flex;align-items:center;justify-content:center}.core-control-container input[type=number]{padding-right:12px;position:relative}.core-control-container input[type=number]::-webkit-inner-spin-button{position:absolute;right:.3em;margin-left:.5em}.core-control-container input[type=number]{-moz-appearance:textfield}.core-control-container i.feather-help-circle{color:#848484}.core-control-container .gap-for-ios-switcher{height:5px}.core-control-container .calculated-view{-webkit-user-select:none;user-select:none;cursor:pointer;height:35px;width:160px;background-color:#d8f3dc;color:#1b4332;border:1px solid #95d5b2;border-radius:50px;font-size:14px;font-weight:500;display:flex;align-items:center;justify-content:flex-start;font-family:Segoe UI,sans-serif;letter-spacing:.5px;padding:8px}.core-control-container .calculated-view i{font-size:18px;width:18px;height:18px;margin-right:8px}.core-control-container .calculated-view span{width:calc(100% - 26px);overflow:hidden;text-overflow:ellipsis;text-wrap:nowrap}.calculated-tooltip-container{background-color:#fff;border:1px solid #ddd;padding:1rem;border-radius:6px;font-size:14px;color:#333;box-shadow:0 4px 10px #0000000d;max-width:360px}.calculated-tooltip-container .calculated-field-row{margin-bottom:.75rem}.calculated-tooltip-container .label{font-weight:500;color:#555!important;display:inline-block;min-width:140px}.calculated-tooltip-container .value{color:#222!important}.calculated-tooltip-container .warning{color:#b91c1c;background:#fef2f2;border:1px solid #fca5a5;padding:.5rem;border-radius:4px;margin-bottom:1rem;font-size:13px}.calculated-tooltip-container .code-block{background:#f8f9fa;border:1px solid #ddd;padding:.75rem;font-family:monospace;font-size:12px;white-space:pre-wrap;color:#111!important;border-radius:4px;overflow-x:auto}.calculated-tooltip-container .no-depends{color:#888;font-style:italic}.calculated-tooltip-container pre{overflow:hidden}.calculated-tooltip-container label.required~input:not([disabled]),.calculated-tooltip-container label.required~textarea:not([disabled]),.calculated-tooltip-container label.required~select:not([disabled]){background-color:#ff0!important}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$3.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: i1$3.NumberValueAccessor, selector: "input[type=number][formControlName],input[type=number][formControl],input[type=number][ngModel]" }, { kind: "directive", type: i1$3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$3.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$3.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i1$3.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$3.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "directive", type: i1$3.FormArrayName, selector: "[formArrayName]", inputs: ["formArrayName"] }, { kind: "pipe", type: TranslatePipe, name: "translate" }, { kind: "pipe", type: TableCellPipe, name: "tableCell" }, { kind: "component", type: CoreFormArrayComponent, selector: "core-form-array", inputs: ["formArrayName", "parentFormGroup", "formArray", "config", "checkError$"] }, { kind: "component", type: CoreDropdownComponent, selector: "core-dropdown", inputs: ["getByIdObject$", "paramMode", "shownFrom", "options$", "height", "placeholder", "loading", "warningDisable", "clearDisable", "fitHeightWithItemCount", "itemHeight", "optionApiDriven", "optionApi", "optionHttpVerb", "optionHttpPayload", "optionValueFrom", "optionTextFrom"] }, { kind: "component", type: CoreListComponent, selector: "core-list", inputs: ["title", "height", "options", "placeholder"] }, { kind: "component", type: CoreChecklistComponent, selector: "core-checklist", inputs: ["paramMode", "getByIdObject$", "shownFrom", "options$", "height", "placeholder", "loading", "readonly", "disabled"] }, { kind: "component", type: CoreFormControlSeekerComponent, selector: "core-form-control-seeker", inputs: ["title", "showPageHeader", "preDefinedOuterParam$", "preDefinedOuterFilter$", "click$", "getByIdObject$", "getByIdApi", "paramMode", "multiMode", "objectList$", "useTheseColumns", "hideOrgTree", "excludedColumns", "excludeExistingList", "placeholder", "sourceSpaceHeight", "indirectBinding", "bindGridIdTo", "multiModeExtendedColumns", "multiModeExtendedSections", "editBufferData$", "multiModeTableHeight", "multiModeRowHeight", "seekerSourceType", "boundFrom", "shownFrom", "alsoBindTo", "seekerVerifyIgnore", "disabledDoubleClick"], outputs: ["onDoubleClick", "selectedDataChange", "fullValueRowChange"] }, { kind: "component", type: CoreCheckboxComponent, selector: "core-checkbox", inputs: ["text", "tooltipPosition", "tooltip", "inputValue", "disabled"], outputs: ["onClick"] }, { kind: "component", type: CoreFileUploaderComponent, selector: "core-file-uploader", inputs: ["uploadFileType", "fileDataControlName", "fileNameControlName", "fileTypeControlName", "avatarSize", "defaultAvatar", "hidePreview", "verticalMode"] }, { kind: "component", type: CoreAttachmentComponent, selector: "core-attachment", inputs: ["assignTo", "readonly", "valueToShow", "placeholder", "upFlag$", "downFlag$"] }, { kind: "component", type: CoreGridBufferComponent, selector: "core-grid-buffer", inputs: ["padding", "placeholder", "tableHeight", "liteMode", "formSections", "gridColumns"], outputs: ["onBufferFormCreated"] }, { kind: "component", type: CoreDatePickerComponent, selector: "core-date-picker", inputs: ["enableTimeZoneConverter", "showPlaceholder", "popupWidth", "popupXPadding", "popupAlign", "rangeLimit", "placeholder", "readonly", "disabled"] }, { kind: "component", type: CoreOrgTreeComponent, selector: "core-org-tree", inputs: ["lineColor", "fullWidthMode", "accessorMode", "searchMode", "fullRendering", "height", "disabledLoopExpand", "showCheckInheritance", "excludedIds$", "stateIsolated$"], outputs: ["itemDoubleClick", "itemClick"] }, { kind: "component", type: CoreRadioGroupComponent, selector: "core-radio-group", inputs: ["options$", "vertical", "columnCount", "gapY", "defaultValue"] }, { kind: "component", type: CoreMccComponent, selector: "core-mcc", inputs: ["height", "columns", "shownFrom", "apiDefinition", "getByIdApi", "outerParam$", "selectedRow$", "outerFilterOperators", "outerInOperators", "placeholder"] }, { kind: "component", type: CoreMonthSelectorComponent, selector: "core-month-selector", inputs: ["align", "placeholder"], outputs: ["onYearClick"] }, { kind: "directive", type: TooltipDirective, selector: "[appTooltip]", inputs: ["appTooltip", "showAnyway", "color", "backgroundColor", "position"] }, { kind: "component", type: CoreCurrencyInputComponent, selector: "core-currency-input", inputs: ["currencySign", "placeholder"], outputs: ["onLeftFocus"] }, { kind: "component", type: CoreShiftCellComponent, selector: "core-shift-cell", inputs: ["$readOnly", "$hideStarterPlusSign", "$hideStickersWhileDragover", "$backgroundColor"] }, { kind: "component", type: CoreShiftCollectionComponent, selector: "core-shift-collection", inputs: ["height", "relativeMode"] }, { kind: "component", type: CoreTopicPickerComponent, selector: "core-topic-picker", inputs: ["popupHeight", "getByIdApi"] }, { kind: "component", type: CoreIosSwitcherComponent, selector: "core-ios-switcher", inputs: ["bgColor", "showOnOffText", "width", "height", "readonly"] }, { kind: "component", type: CoreLiquidWysiwygComponent, selector: "core-liquid-wysiwyg", inputs: ["$liquidOptions", "$textareaRows", "$height", "$readonly", "$showLiquidSourceOnly", "$isForWorkflowEmail", "getByIdObject$", "placeholder"] }, { kind: "component", type: CoreStickerCollectionComponent, selector: "core-sticker-collection", inputs: ["$items", "$shownFrom", "$tooltipFrom", "$initialChecked", "$showMore", "$showMoreTooltip", "$hideShowMoreIfNotSelected", "$enableFilter"], outputs: ["$checkedChange", "$onShowMore"] }, { kind: "directive", type: HtmlTooltipDirective, selector: "[htmlTooltip]", inputs: ["htmlTooltip", "tooltipContext", "maxWidthUnset", "backgroundColor", "hold$"] }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.5", type: CoreControlComponent, isStandalone: true, selector: "core-control", inputs: { control: "control", form: "form", checkError$: "checkError$", rangeLimit: "rangeLimit" }, host: { listeners: { "window:click": "onWindowClick()" } }, usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "<div class=\"core-control-container\">\r\n\r\n    <div [formGroup]=\"form\" [class.hidden]=\"!!control.hidden\">\r\n\r\n        @if (!control.headless!) {\r\n            <label [class]=\"'control-label' +  (required ? ' required' : '')\" [attr.for]=\"control.field\"\r\n                [class.d-none]=\"!!control.hidden\"\r\n                [class.avatar-label]=\"control.uploadFileType==='IMAGE_AVATAR'\" [appTooltip]=\"control.tooltip! | translate: lang\" \r\n                [htmlTooltip]=\"control.htmlTooltip!\"\r\n                [backgroundColor]=\"'white'\"\r\n                [ngStyle]=\"{\r\n                    display: 'inline-block'\r\n                }\">\r\n                {{(control.controlType!=='CHECKBOX' && control.controlType!=='BUTTON') ? (control.label | translate: lang) : ''}}\r\n            </label>\r\n\r\n            @if (!!control.hint! && control.controlType !== 'CHECKBOX') {\r\n                <i class=\"feather-help-circle\" [appTooltip]=\"control.hint!\" [showAnyway]=\"true\" [ngStyle]=\"{\r\n                    display: 'inline-block',\r\n                    marginLeft: '2px'\r\n                }\" [class.d-none]=\"!!control.hidden\"></i>\r\n            }\r\n        }\r\n\r\n        <!-- START: FORM-CONTROL SESSION-->\r\n\r\n        <ng-container>\r\n        @switch (control.controlType) {\r\n            @case (\"FORM_ARRAY\") {\r\n                <core-form-array\r\n                    [formArrayName]=\"control.field!\"\r\n                    [parentFormGroup]=\"form\"\r\n                    [formArray]=\"formArray\"\r\n                    [config]=\"control.formArraySections! ?? []\"\r\n                    [disabled]=\"control.disabled!\"\r\n                    [readonly]=\"control.readonly!\"\r\n                    [checkError$]=\"checkError$\">\r\n                </core-form-array>\r\n            }\r\n            @case (\"CALCULATED\") {\r\n                <div class=\"calculated-view\" [htmlTooltip]=\"calculatedControlInfo\" [tooltipContext]=\"{control: control}\" [backgroundColor]=\"'#fff'\">\r\n                    <i class=\"feather-box\"></i><span>{{ control.field! }}</span>\r\n                </div>\r\n            }\r\n            @case (\"TEXTBOX\") {\r\n\r\n                <input *ngIf=\"control.type === 'date'\"\r\n                    [formControlName]=\"control.field\"\r\n                    type=\"date\"\r\n                    useValueAsDate\r\n                    class=\"form-control\"\r\n                    [readonly]=\"control.readonly\"\r\n                    [placeholder]=\"control.placeholder || ''\"\r\n                    [class.required-highlight]=\"!!required\"\r\n                    [class.form-control-disabled]=\"!!control.disabled\" />\r\n              \r\n                <input *ngIf=\"control.type === 'time'\"\r\n                    [formControlName]=\"control.field\"\r\n                    type=\"time\"\r\n                    class=\"form-control\"\r\n                    [readonly]=\"control.readonly\"\r\n                    [placeholder]=\"control.placeholder || ''\"\r\n                    [class.required-highlight]=\"!!required\"\r\n                    [class.form-control-disabled]=\"!!control.disabled\" />\r\n              \r\n                <input *ngIf=\"control.type === 'number'\"\r\n                    [formControlName]=\"control.field\"\r\n                    type=\"number\"\r\n                    step=\"{{ control.step || 1 }}\"\r\n                    class=\"form-control\"\r\n                    style=\"text-align: right;\"\r\n                    [readonly]=\"control.readonly\"\r\n                    [placeholder]=\"control.placeholder || ''\"\r\n                    [class.required-highlight]=\"!!required\"\r\n                    [class.form-control-disabled]=\"!!control.disabled\" />\r\n              \r\n                <input *ngIf=\"['string', 'text', 'email', 'url', 'password'].includes(control.type || 'text')\"\r\n                    [formControlName]=\"control.field\"\r\n                    [type]=\"control.type\"\r\n                    class=\"form-control\"\r\n                    [readonly]=\"control.readonly\"\r\n                    [placeholder]=\"control.placeholder || ''\"\r\n                    [value]=\"form.get(control.field)?.value | tableCell: control.pipe : lang\"\r\n                    [attr.pattern]=\"getPattern(control) || null\"\r\n                    [appTooltip]=\"form.get(control.field)?.value\"\r\n                    (focus)=\"onFocus($event)\"\r\n                    (blur)=\"onBlur($event)\"\r\n                    [class.required-highlight]=\"!!required\"\r\n                    [class.form-control-disabled]=\"!!control.disabled\" />\r\n            }\r\n            @case (\"CURRENCY\") {\r\n                <core-currency-input [required]=\"required\" [formControlName]=\"control.field\" [placeholder]=\"control.placeholder! || ''\"></core-currency-input>\r\n            }\r\n            @case (\"TEXTAREA\") {\r\n                <textarea [rows]=\"control.textareaRows?.toString() || '3'\" [ngStyle]=\"{ height: 'unset' }\"\r\n                    [class.required-highlight]=\"!!required\"\r\n                    [formControlName]=\"control.field\" class=\"form-control\" [readonly]=\"control.readonly\" [placeholder]=\"control.placeholder! || ''\"></textarea>\r\n            }\r\n            @case (\"CHECKBOX\") {\r\n                <core-checkbox [formControlName]=\"control.field\" [text]=\"control.label\"\r\n                    [inputValue]=\"control.value\" [tooltip]=\"control.hint!\"></core-checkbox>\r\n            }\r\n            @case (\"IOS_SWITCHER\") {\r\n                <div class=\"gap-for-ios-switcher\"></div>\r\n                <core-ios-switcher [formControlName]=\"control.field\" />\r\n            }\r\n            @case (\"MCC\") {\r\n                <core-mcc [required]=\"required\" [formControlName]=\"control.field\" [columns]=\"control.columns!\" [shownFrom]=\"control.shownFrom!\" \r\n                [apiDefinition]=\"control.apiDefinition!\" [getByIdApi]=\"control.getByIdApi!\" [selectedRow$]=\"control.selectedRow$!\"\r\n                [outerParam$]=\"control.outerParam$!\"\r\n                [placeholder]=\"control.placeholder! || ''\"\r\n                ></core-mcc>\r\n            }\r\n            @case (\"DATEPICKER\") {\r\n                <core-date-picker [required]=\"required\" [formControlName]=\"control.field\" [showPlaceholder]=\"control.showPlaceholder!\" [rangeLimit]=\"control.rangeLimit!\" [popupAlign]=\"control.popupAlign!\" [placeholder]=\"control.placeholder! || ''\"></core-date-picker>\r\n            }\r\n\r\n            @case (\"DROPDOWN\") {\r\n                @if (!!control.dropdownOptions$ || !!control.optionApiDriven) {\r\n                    <core-dropdown \r\n                        [required]=\"required\" \r\n                        [formControlName]=\"control.field\" \r\n                        [options$]=\"control.dropdownOptions$!\"\r\n                        [getByIdObject$]=\"control.getByIdObject$!\" \r\n                        [shownFrom]=\"control.shownFrom!\" \r\n                        [placeholder]=\"control.placeholder! || ''\"\r\n\r\n                        [optionApiDriven]=\"control.optionApiDriven!\"\r\n                        [optionApi]=\"control.optionApi!\"\r\n                        [optionHttpVerb]=\"control.optionHttpVerb!\"\r\n                        [optionHttpPayload]=\"control.optionHttpPayload!\"\r\n                        [optionValueFrom]=\"control.optionValueFrom!\"\r\n                        [optionTextFrom]=\"control.optionTextFrom!\"\r\n                    ></core-dropdown>\r\n                } @else {\r\n                    No dropdownOptions$ | optionApiDriven detected\r\n                }\r\n            }\r\n            @case (\"LIST\") {\r\n                <core-list [required]=\"required\" [formControlName]=\"control.field\" [options]=\"control.listOptions!\" [placeholder]=\"control.placeholder! || ''\"></core-list>\r\n            }\r\n            @case (\"CHECKLIST\") {\r\n                @if (!!control.checklistOptions$) {\r\n                    <core-checklist [required]=\"required\" [formControlName]=\"control.field\" [options$]=\"control.checklistOptions$!\"\r\n                        [getByIdObject$]=\"control.getByIdObject$!\" [shownFrom]=\"control.shownFrom!\" [placeholder]=\"control.placeholder! || ''\"></core-checklist>\r\n                }\r\n            }\r\n            @case (\"FILEUPLOADER\") {\r\n                @if (!!control.uploadFileType) {\r\n                    <core-file-uploader [required]=\"required\" [formControlName]=\"control.field\" [uploadFileType]=\"control.uploadFileType\"\r\n                        [fileDataControlName]=\"control.fileDataControlName!\"\r\n                        [fileNameControlName]=\"control.fileNameControlName!\"\r\n                        [fileTypeControlName]=\"control.fileTypeControlName!\"\r\n                        [verticalMode]=\"control.verticalMode!\"></core-file-uploader>\r\n                } @else {\r\n                    <div class=\"dev-declaration\">Please add uploadFileType</div>\r\n                }\r\n            }\r\n            @case (\"ATTACHMENT\") {\r\n                <core-attachment ngDefaultControl [required]=\"required\" [formControlName]=\"control.field\" [assignTo]=\"control.assignTo!\"\r\n                    [valueToShow]=\"control.valueToShow!\" [placeholder]=\"control.placeholder! || ''\"></core-attachment>\r\n            }\r\n            @case (\"GRIDBUFFER\") {\r\n                @if (!!control.gridBufferFormSections && !!control.gridBufferTableColumns) {\r\n                    <core-grid-buffer [required]=\"required\" [formControlName]=\"control.field\" [formSections]=\"control.gridBufferFormSections\"\r\n                        [gridColumns]=\"control.gridBufferTableColumns\"\r\n                        [placeholder]=\"control.placeholder! || ''\"\r\n                        [tableHeight]=\"control.tableHeight ?? 300\"\r\n                        [liteMode]=\"control.liteMode ?? false\"\r\n                        (onBufferFormCreated)=\"!!control.onBufferFormCreated ? control.onBufferFormCreated($event) : null\"></core-grid-buffer>\r\n                }\r\n            }\r\n            @case (\"ORGTREECHECK\") {\r\n                <core-org-tree [required]=\"required\" [formControlName]=\"control.field\"\r\n                    [accessorMode]=\"coreOrgTreeDefaultAccessorMode\" [height]=\"control.height!\"></core-org-tree>\r\n            }\r\n            @case (\"RADIOGROUP\") {\r\n                <core-radio-group [required]=\"required\" [formControlName]=\"control.field\"\r\n                    [options$]=\"control.radioGroupOptions$!\"\r\n                    [vertical]=\"control.verticalMode!\"\r\n                    ></core-radio-group>\r\n            }\r\n            @case (\"MONTHSELECTOR\") {\r\n                <core-month-selector [required]=\"required\" [formControlName]=\"control.field\" [placeholder]=\"control.placeholder! || ''\"></core-month-selector>\r\n            }\r\n            @case (\"SHIFTCELL\") {\r\n                <core-shift-cell [formControlName]=\"control.field\"></core-shift-cell>\r\n            }\r\n            @case (\"SHIFTCOLLECTION\") {\r\n                <core-shift-collection [relativeMode]=\"true\" [height]=\"control.height || 800\"></core-shift-collection>\r\n            }\r\n            @case(\"TOPICPICKER\") {\r\n                <core-topic-picker [required]=\"required\" [formControlName]=\"control.field\" [popupHeight]=\"control.popupHeight!\" [getByIdApi]=\"control.getByIdApi!\"></core-topic-picker>\r\n            }\r\n            @case(\"STICKER_COLLECTION\") {\r\n                  <core-sticker-collection\r\n                    [formControlName]=\"control.field\"\r\n                    [required]=\"required\"\r\n                    [$items]=\"control.stickerCollectionItems!\"\r\n                    [$shownFrom]=\"control.stickerCollectionShownFrom!\"\r\n                    [$tooltipFrom]=\"control.stickerCollectionTooltipFrom!\"\r\n                    [$initialChecked]=\"control.stickerCollectionInitialChecked!\"\r\n                    >\r\n                </core-sticker-collection>\r\n            }\r\n            @case (\"SEEKER\") {\r\n                @switch(control.seekerSourceType) {\r\n                    @case(\"JOB_SEEK\") {\r\n                        <core-form-control-seeker\r\n                            [required]=\"required\" \r\n                            [excludeExistingList]=\"control.excludeExistingList!\"\r\n                            [multiMode]=\"control.multiMode!\" [multiModeTableHeight]=\"control.multiModeTableHeight!\" [multiModeRowHeight]=\"control.multiModeRowHeight!\"\r\n                            [objectList$]=\"control.objectList$!\" [formControlName]=\"control.field\"\r\n                            [seekerSourceType]=\"control.seekerSourceType!\" \r\n                            [preDefinedOuterParam$]=\"control.preDefinedOuterParam$!\"\r\n                            [preDefinedOuterFilter$]=\"control.preDefinedOuterFilter$!\"\r\n                            [boundFrom]=\"control.boundFrom!\" [shownFrom]=\"control.shownFrom!\" [alsoBindTo]=\"control.alsoBindTo!\"\r\n                            [getByIdObject$]=\"control.getByIdObject$!\"\r\n                            [click$]=\"control.click$\"\r\n                            [multiModeExtendedColumns]=\"control.multiModeExtendedColumns!\"\r\n                            [multiModeExtendedSections]=\"control.multiModeExtendedSections!\"\r\n                            [editBufferData$]=\"control.editBufferData$!\"\r\n                            [indirectBinding]=\"control.indirectBinding!\"\r\n                            [bindGridIdTo]=\"control.bindGridIdTo!\"\r\n                            [useTheseColumns]=\"control.useTheseColumns!\"\r\n                            [hideOrgTree]=\"control.hideOrgTree!\"\r\n                            [sourceSpaceHeight]=\"control.sourceSpaceHeight!\"\r\n                            (selectedDataChange)=\"selectedDataChange($event)\"\r\n                            (fullValueRowChange)=\"fullValueRowChange($event)\"\r\n                        ></core-form-control-seeker>\r\n                    }\r\n                    @case(\"EMPLOYEE_SEEK\") {\r\n                        <core-form-control-seeker\r\n                            [required]=\"required\" \r\n                            [excludeExistingList]=\"control.excludeExistingList!\"\r\n                            [multiMode]=\"control.multiMode!\" [multiModeTableHeight]=\"control.multiModeTableHeight!\" [multiModeRowHeight]=\"control.multiModeRowHeight!\"\r\n                            [objectList$]=\"control.objectList$!\" [formControlName]=\"control.field\"\r\n                            [seekerSourceType]=\"control.seekerSourceType!\" \r\n                            [preDefinedOuterParam$]=\"control.preDefinedOuterParam$!\"\r\n                            [preDefinedOuterFilter$]=\"control.preDefinedOuterFilter$!\"\r\n                            [boundFrom]=\"control.boundFrom!\" [shownFrom]=\"control.shownFrom!\" [alsoBindTo]=\"control.alsoBindTo!\"\r\n                            [getByIdObject$]=\"control.getByIdObject$!\"\r\n                            [click$]=\"control.click$\"\r\n                            [multiModeExtendedColumns]=\"control.multiModeExtendedColumns!\"\r\n                            [multiModeExtendedSections]=\"control.multiModeExtendedSections!\"\r\n                            [editBufferData$]=\"control.editBufferData$!\"\r\n                            [indirectBinding]=\"control.indirectBinding!\"\r\n                            [bindGridIdTo]=\"control.bindGridIdTo!\"\r\n                            [useTheseColumns]=\"control.useTheseColumns!\"\r\n                            [hideOrgTree]=\"control.hideOrgTree!\"\r\n                            [sourceSpaceHeight]=\"control.sourceSpaceHeight!\"\r\n                            [placeholder]=\"control.placeholder! || ''\"\r\n                            (selectedDataChange)=\"selectedDataChange($event)\"\r\n                            (fullValueRowChange)=\"fullValueRowChange($event)\"\r\n                        ></core-form-control-seeker>\r\n                    }\r\n                    @case(\"CONTRACT_SEEK\") {\r\n                        <core-form-control-seeker\r\n                            [required]=\"required\" \r\n                            [excludeExistingList]=\"control.excludeExistingList!\"\r\n                            [multiMode]=\"control.multiMode!\" [multiModeTableHeight]=\"control.multiModeTableHeight!\" [multiModeRowHeight]=\"control.multiModeRowHeight!\"\r\n                            [objectList$]=\"control.objectList$!\" [formControlName]=\"control.field\"\r\n                            [seekerSourceType]=\"control.seekerSourceType!\" [boundFrom]=\"control.boundFrom!\"\r\n                            [preDefinedOuterParam$]=\"control.preDefinedOuterParam$!\" \r\n                            [preDefinedOuterFilter$]=\"control.preDefinedOuterFilter$!\"\r\n                            [shownFrom]=\"control.shownFrom!\"\r\n                            [alsoBindTo]=\"control.alsoBindTo!\"\r\n                            [getByIdObject$]=\"control.getByIdObject$!\"\r\n                            [multiModeExtendedColumns]=\"control.multiModeExtendedColumns!\"\r\n                            [multiModeExtendedSections]=\"control.multiModeExtendedSections!\"\r\n                            [click$]=\"control.click$\"\r\n                            [useTheseColumns]=\"control.useTheseColumns!\"\r\n                            [hideOrgTree]=\"control.hideOrgTree!\"\r\n                            [sourceSpaceHeight]=\"control.sourceSpaceHeight!\"\r\n                            [placeholder]=\"control.placeholder! || ''\"\r\n                            (selectedDataChange)=\"selectedDataChange($event)\"\r\n                            (fullValueRowChange)=\"fullValueRowChange($event)\"\r\n                        ></core-form-control-seeker>\r\n                    }\r\n                    @case(\"WORKING_SEEK\") {\r\n                        <core-form-control-seeker \r\n                            [required]=\"required\" \r\n                            [excludeExistingList]=\"control.excludeExistingList!\"\r\n                            [multiMode]=\"control.multiMode!\" [multiModeTableHeight]=\"control.multiModeTableHeight!\" [multiModeRowHeight]=\"control.multiModeRowHeight!\"\r\n                            [objectList$]=\"control.objectList$!\" [formControlName]=\"control.field\"\r\n                            [seekerSourceType]=\"control.seekerSourceType!\" \r\n                            [preDefinedOuterParam$]=\"control.preDefinedOuterParam$!\"\r\n                            [preDefinedOuterFilter$]=\"control.preDefinedOuterFilter$!\"\r\n                            [boundFrom]=\"control.boundFrom!\" [shownFrom]=\"control.shownFrom!\" [alsoBindTo]=\"control.alsoBindTo!\"\r\n                            [getByIdObject$]=\"control.getByIdObject$!\"\r\n                            [multiModeExtendedColumns]=\"control.multiModeExtendedColumns!\"\r\n                            [multiModeExtendedSections]=\"control.multiModeExtendedSections!\"\r\n                            [click$]=\"control.click$\"\r\n                            [useTheseColumns]=\"control.useTheseColumns!\"\r\n                            [hideOrgTree]=\"control.hideOrgTree!\"\r\n                            [sourceSpaceHeight]=\"control.sourceSpaceHeight!\"\r\n                            [placeholder]=\"control.placeholder! || ''\"\r\n                            (selectedDataChange)=\"selectedDataChange($event)\"\r\n                            (fullValueRowChange)=\"fullValueRowChange($event)\"\r\n                        ></core-form-control-seeker>\r\n                    }\r\n                    @case(\"WAGE_SEEK\") {\r\n                        <core-form-control-seeker \r\n                            [required]=\"required\" \r\n                            [excludeExistingList]=\"control.excludeExistingList!\"\r\n                            [formControlName]=\"control.field\"\r\n                            [multiMode]=\"control.multiMode!\" [multiModeTableHeight]=\"control.multiModeTableHeight!\" [multiModeRowHeight]=\"control.multiModeRowHeight!\"\r\n                            [objectList$]=\"control.objectList$!\"\r\n                            [seekerSourceType]=\"control.seekerSourceType!\" \r\n                            [preDefinedOuterParam$]=\"control.preDefinedOuterParam$!\"\r\n                            [preDefinedOuterFilter$]=\"control.preDefinedOuterFilter$!\"\r\n                            [boundFrom]=\"control.boundFrom!\" [shownFrom]=\"control.shownFrom!\" [alsoBindTo]=\"control.alsoBindTo!\"\r\n                            [getByIdObject$]=\"control.getByIdObject$!\"\r\n                            [multiModeExtendedColumns]=\"control.multiModeExtendedColumns!\"\r\n                            [multiModeExtendedSections]=\"control.multiModeExtendedSections!\"\r\n                            [click$]=\"control.click$\"\r\n                            [useTheseColumns]=\"control.useTheseColumns!\"\r\n                            [hideOrgTree]=\"control.hideOrgTree!\"\r\n                            [sourceSpaceHeight]=\"control.sourceSpaceHeight!\"\r\n                            [placeholder]=\"control.placeholder! || ''\"\r\n                            (selectedDataChange)=\"selectedDataChange($event)\"\r\n                            (fullValueRowChange)=\"fullValueRowChange($event)\"\r\n                        ></core-form-control-seeker>\r\n                    }\r\n                    @case(\"POSITION_SEEK\") {\r\n                        <core-form-control-seeker \r\n                            [required]=\"required\" \r\n                            [excludeExistingList]=\"control.excludeExistingList!\"\r\n                            [objectList$]=\"control.objectList$!\"\r\n                            [multiMode]=\"control.multiMode!\" [multiModeTableHeight]=\"control.multiModeTableHeight!\" [multiModeRowHeight]=\"control.multiModeRowHeight!\"\r\n                            [formControlName]=\"control.field\" [alsoBindTo]=\"control.alsoBindTo!\"\r\n                            [seekerSourceType]=\"control.seekerSourceType!\" \r\n                            [preDefinedOuterParam$]=\"control.preDefinedOuterParam$!\"\r\n                            [preDefinedOuterFilter$]=\"control.preDefinedOuterFilter$!\"\r\n                            [boundFrom]=\"control.boundFrom!\" [shownFrom]=\"control.shownFrom!\"\r\n                            [getByIdObject$]=\"control.getByIdObject$!\"\r\n                            [multiModeExtendedColumns]=\"control.multiModeExtendedColumns!\"\r\n                            [multiModeExtendedSections]=\"control.multiModeExtendedSections!\"\r\n                            [seekerVerifyIgnore]=\"control.seekerVerifyIgnore!\"\r\n                            [click$]=\"control.click$\"\r\n                            [useTheseColumns]=\"control.useTheseColumns!\"\r\n                            [hideOrgTree]=\"control.hideOrgTree!\"\r\n                            [sourceSpaceHeight]=\"control.sourceSpaceHeight!\"\r\n                            [placeholder]=\"control.placeholder! || ''\"\r\n                            (selectedDataChange)=\"selectedDataChange($event)\"\r\n                            (fullValueRowChange)=\"fullValueRowChange($event)\"\r\n                        ></core-form-control-seeker>\r\n                    }\r\n                    @case(\"POSITION_CONCURRENT_SEEK\") {\r\n                        <core-form-control-seeker\r\n                            [required]=\"required\" \r\n                            [excludeExistingList]=\"control.excludeExistingList!\"\r\n                            [multiMode]=\"control.multiMode!\" [multiModeTableHeight]=\"control.multiModeTableHeight!\" [multiModeRowHeight]=\"control.multiModeRowHeight!\"\r\n                            [formControlName]=\"control.field\" [alsoBindTo]=\"control.alsoBindTo!\"\r\n                            [seekerSourceType]=\"control.seekerSourceType!\" \r\n                            [preDefinedOuterParam$]=\"control.preDefinedOuterParam$!\"\r\n                            [preDefinedOuterFilter$]=\"control.preDefinedOuterFilter$!\"\r\n                            [boundFrom]=\"control.boundFrom!\" [shownFrom]=\"control.shownFrom!\"\r\n                            [getByIdObject$]=\"control.getByIdObject$!\"\r\n                            [multiModeExtendedColumns]=\"control.multiModeExtendedColumns!\"\r\n                            [multiModeExtendedSections]=\"control.multiModeExtendedSections!\"\r\n                            [multiModeTableHeight]=\"control.multiModeTableHeight!\"\r\n                            [click$]=\"control.click$\"\r\n                            [useTheseColumns]=\"control.useTheseColumns!\"\r\n                            [hideOrgTree]=\"control.hideOrgTree!\"\r\n                            [sourceSpaceHeight]=\"control.sourceSpaceHeight!\"\r\n                            [placeholder]=\"control.placeholder! || ''\"\r\n                            (selectedDataChange)=\"selectedDataChange($event)\"\r\n                            (fullValueRowChange)=\"fullValueRowChange($event)\"\r\n                        ></core-form-control-seeker>\r\n                    }\r\n                    @case(\"FORM_SEEK\") {\r\n                        <core-form-control-seeker\r\n                            [required]=\"required\" \r\n                            [excludeExistingList]=\"control.excludeExistingList!\"\r\n                            [multiMode]=\"control.multiMode!\" [multiModeTableHeight]=\"control.multiModeTableHeight!\" [multiModeRowHeight]=\"control.multiModeRowHeight!\"\r\n                            [formControlName]=\"control.field\" [alsoBindTo]=\"control.alsoBindTo!\"\r\n                            [seekerSourceType]=\"control.seekerSourceType!\" \r\n                            [preDefinedOuterParam$]=\"control.preDefinedOuterParam$!\"\r\n                            [preDefinedOuterFilter$]=\"control.preDefinedOuterFilter$!\"\r\n                            [boundFrom]=\"control.boundFrom!\" [shownFrom]=\"control.shownFrom!\"\r\n                            [getByIdObject$]=\"control.getByIdObject$!\"\r\n                            [multiModeExtendedColumns]=\"control.multiModeExtendedColumns!\"\r\n                            [multiModeExtendedSections]=\"control.multiModeExtendedSections!\"\r\n                            [multiModeTableHeight]=\"control.multiModeTableHeight!\"\r\n                            [click$]=\"control.click$\"\r\n                            [useTheseColumns]=\"control.useTheseColumns!\"\r\n                            [hideOrgTree]=\"control.hideOrgTree!\"\r\n                            [sourceSpaceHeight]=\"control.sourceSpaceHeight!\"\r\n                            [placeholder]=\"control.placeholder! || ''\"\r\n                            (selectedDataChange)=\"selectedDataChange($event)\"\r\n                            (fullValueRowChange)=\"fullValueRowChange($event)\"\r\n                        ></core-form-control-seeker>\r\n                    }\r\n                    @case(\"ORGANIZATION_UNIT_SEEK\") {\r\n                        <core-form-control-seeker\r\n                            [required]=\"required\" \r\n                            [formControlName]=\"control.field\" [seekerSourceType]=\"control.seekerSourceType!\"\r\n                            [boundFrom]=\"control.boundFrom!\" [alsoBindTo]=\"control.alsoBindTo!\" [shownFrom]=\"control.shownFrom!\"\r\n                            [getByIdObject$]=\"control.getByIdObject$!\"\r\n                            [click$]=\"control.click$\"\r\n                            [placeholder]=\"control.placeholder! || ''\"\r\n                        ></core-form-control-seeker>\r\n                    }\r\n                }\r\n            }\r\n            @case (\"LIQUID_WYSIWYG\") {\r\n                <core-liquid-wysiwyg\r\n                    [formControlName]=\"control.field\"\r\n                    [getByIdObject$]=\"control.getByIdObject$!\"\r\n                    [placeholder]=\"control.placeholder! || ''\"\r\n                    [$liquidOptions]=\"control.liquidOptions!\"\r\n                    [$textareaRows]=\"control.textareaRows!\"\r\n                    [$showLiquidSourceOnly]=\"control.showLiquidSourceOnly!\"\r\n                    [$isForWorkflowEmail]=\"control.isForWorkflowEmail!\"\r\n                />\r\n            }\r\n        }\r\n        </ng-container>\r\n\r\n        <ng-container *ngIf=\"control.controlType==='BUTTON'\">\r\n            <button type=\"button\" class=\"btn btn-secondary text\" (click)=\"oHandleClick($event)\">{{control.label| translate: lang}}</button>\r\n        </ng-container>\r\n        <!-- END: FORM-CONTROL SESSION-->\r\n\r\n        <!-- START: ERROR SESSION-->\r\n        <div *ngIf=\"!!errors!.length\">\r\n            <div class=\"form-control-error\" *ngFor=\"let error of errors\">\r\n                {{ error.errorMessage | translate: lang }}\r\n            </div>\r\n        </div>\r\n        <div *ngIf=\"!!!errors!.length && !!checkError$.value\">\r\n            <div>\r\n                {{ '&nbsp;' }}\r\n            </div>\r\n        </div>\r\n        <!-- END: ERROR SESSION-->\r\n\r\n    </div>\r\n\r\n\r\n</div>\r\n\r\n<ng-template #calculatedControlInfo let-control=\"control\">\r\n    <div class=\"calculated-tooltip-container\">\r\n        <div class=\"calculated-field-row\">\r\n        <span class=\"label\">Name:</span>\r\n        <span class=\"value\">{{ control?.field || 'N/A' }}</span>\r\n        </div>        \r\n        <div class=\"calculated-field-row\">\r\n        <span class=\"label\">Evaluation Mode:</span>\r\n        <span class=\"value\">{{ control?.evaluationMode || 'N/A' }}</span>\r\n        </div>\r\n        <div class=\"calculated-field-row\">\r\n        <span class=\"label\">Return Type:</span>\r\n        <span class=\"value\">{{ control?.returnType || 'N/A' }}</span>\r\n        </div>\r\n        <div class=\"calculated-field-row\">\r\n        <span class=\"label\">Depends On:</span>\r\n        <span class=\"value\" *ngIf=\"control?.dependsOn?.length > 0; else noDepends\">\r\n            <code *ngFor=\"let dep of control?.dependsOn; let last = last\">{{ dep }}<span *ngIf=\"!last\">, </span></code>\r\n        </span>\r\n        <ng-template #noDepends><em class=\"no-depends\">None</em></ng-template>\r\n        </div>\r\n        <div *ngIf=\"!!control?.isUnsafe\" class=\"warning\">\r\n        \u26A0\uFE0F This script is marked as <strong>unsafe</strong> and will not be executed.\r\n        </div>\r\n        <div class=\"calculated-field-row\">\r\n        <span class=\"label\">Script:</span>\r\n        <pre class=\"code-block\">{{ control?.script || 'No script provided.' }}</pre>\r\n        </div>\r\n    </div>\r\n</ng-template>", styles: [".core-control-container{font-size:var(--typo-basic-font-size)!important}.core-control-container .control-label{color:#848484}.core-control-container>div.hidden{display:none}.core-control-container label{color:#464646}.core-control-container label.required:after{content:\"*\";color:#ff040b}.core-control-container label.avatar-label{width:var(--size-file-uploader);display:flex;align-items:center;justify-content:center}.core-control-container input[type=number]{padding-right:12px;position:relative}.core-control-container input[type=number]::-webkit-inner-spin-button{position:absolute;right:.3em;margin-left:.5em}.core-control-container input[type=number]{-moz-appearance:textfield}.core-control-container i.feather-help-circle{color:#848484}.core-control-container .gap-for-ios-switcher{height:5px}.core-control-container .calculated-view{-webkit-user-select:none;user-select:none;cursor:pointer;height:35px;width:160px;background-color:#d8f3dc;color:#1b4332;border:1px solid #95d5b2;border-radius:50px;font-size:14px;font-weight:500;display:flex;align-items:center;justify-content:flex-start;font-family:Segoe UI,sans-serif;letter-spacing:.5px;padding:8px}.core-control-container .calculated-view i{font-size:18px;width:18px;height:18px;margin-right:8px}.core-control-container .calculated-view span{width:calc(100% - 26px);overflow:hidden;text-overflow:ellipsis;text-wrap:nowrap}.calculated-tooltip-container{background-color:#fff;border:1px solid #ddd;padding:1rem;border-radius:6px;font-size:14px;color:#333;box-shadow:0 4px 10px #0000000d;max-width:360px}.calculated-tooltip-container .calculated-field-row{margin-bottom:.75rem}.calculated-tooltip-container .label{font-weight:500;color:#555!important;display:inline-block;min-width:140px}.calculated-tooltip-container .value{color:#222!important}.calculated-tooltip-container .warning{color:#b91c1c;background:#fef2f2;border:1px solid #fca5a5;padding:.5rem;border-radius:4px;margin-bottom:1rem;font-size:13px}.calculated-tooltip-container .code-block{background:#f8f9fa;border:1px solid #ddd;padding:.75rem;font-family:monospace;font-size:12px;white-space:pre-wrap;color:#111!important;border-radius:4px;overflow-x:auto}.calculated-tooltip-container .no-depends{color:#888;font-style:italic}.calculated-tooltip-container pre{overflow:hidden}.calculated-tooltip-container label.required~input:not([disabled]),.calculated-tooltip-container label.required~textarea:not([disabled]),.calculated-tooltip-container label.required~select:not([disabled]){background-color:#ff0!important}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$3.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: i1$3.NumberValueAccessor, selector: "input[type=number][formControlName],input[type=number][formControl],input[type=number][ngModel]" }, { kind: "directive", type: i1$3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$3.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$3.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i1$3.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$3.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "directive", type: i1$3.FormArrayName, selector: "[formArrayName]", inputs: ["formArrayName"] }, { kind: "pipe", type: TranslatePipe, name: "translate" }, { kind: "pipe", type: TableCellPipe, name: "tableCell" }, { kind: "component", type: CoreFormArrayComponent, selector: "core-form-array", inputs: ["formArrayName", "parentFormGroup", "formArray", "config", "checkError$", "readonly", "disabled"] }, { kind: "component", type: CoreDropdownComponent, selector: "core-dropdown", inputs: ["getByIdObject$", "paramMode", "shownFrom", "options$", "height", "placeholder", "loading", "warningDisable", "clearDisable", "fitHeightWithItemCount", "itemHeight", "optionApiDriven", "optionApi", "optionHttpVerb", "optionHttpPayload", "optionValueFrom", "optionTextFrom"] }, { kind: "component", type: CoreListComponent, selector: "core-list", inputs: ["title", "height", "options", "placeholder"] }, { kind: "component", type: CoreChecklistComponent, selector: "core-checklist", inputs: ["paramMode", "getByIdObject$", "shownFrom", "options$", "height", "placeholder", "loading", "readonly", "disabled"] }, { kind: "component", type: CoreFormControlSeekerComponent, selector: "core-form-control-seeker", inputs: ["title", "showPageHeader", "preDefinedOuterParam$", "preDefinedOuterFilter$", "click$", "getByIdObject$", "getByIdApi", "paramMode", "multiMode", "objectList$", "useTheseColumns", "hideOrgTree", "excludedColumns", "excludeExistingList", "placeholder", "sourceSpaceHeight", "indirectBinding", "bindGridIdTo", "multiModeExtendedColumns", "multiModeExtendedSections", "editBufferData$", "multiModeTableHeight", "multiModeRowHeight", "seekerSourceType", "boundFrom", "shownFrom", "alsoBindTo", "seekerVerifyIgnore", "disabledDoubleClick"], outputs: ["onDoubleClick", "selectedDataChange", "fullValueRowChange"] }, { kind: "component", type: CoreCheckboxComponent, selector: "core-checkbox", inputs: ["text", "tooltipPosition", "tooltip", "inputValue", "disabled"], outputs: ["onClick"] }, { kind: "component", type: CoreFileUploaderComponent, selector: "core-file-uploader", inputs: ["uploadFileType", "fileDataControlName", "fileNameControlName", "fileTypeControlName", "avatarSize", "defaultAvatar", "hidePreview", "verticalMode"] }, { kind: "component", type: CoreAttachmentComponent, selector: "core-attachment", inputs: ["assignTo", "readonly", "valueToShow", "placeholder", "upFlag$", "downFlag$"] }, { kind: "component", type: CoreGridBufferComponent, selector: "core-grid-buffer", inputs: ["padding", "placeholder", "tableHeight", "liteMode", "formSections", "gridColumns"], outputs: ["onBufferFormCreated"] }, { kind: "component", type: CoreDatePickerComponent, selector: "core-date-picker", inputs: ["enableTimeZoneConverter", "showPlaceholder", "popupWidth", "popupXPadding", "popupAlign", "rangeLimit", "placeholder", "readonly", "disabled"] }, { kind: "component", type: CoreOrgTreeComponent, selector: "core-org-tree", inputs: ["lineColor", "fullWidthMode", "accessorMode", "searchMode", "fullRendering", "height", "disabledLoopExpand", "showCheckInheritance", "excludedIds$", "stateIsolated$"], outputs: ["itemDoubleClick", "itemClick"] }, { kind: "component", type: CoreRadioGroupComponent, selector: "core-radio-group", inputs: ["options$", "vertical", "columnCount", "gapY", "defaultValue"] }, { kind: "component", type: CoreMccComponent, selector: "core-mcc", inputs: ["height", "columns", "shownFrom", "apiDefinition", "getByIdApi", "outerParam$", "selectedRow$", "outerFilterOperators", "outerInOperators", "placeholder"] }, { kind: "component", type: CoreMonthSelectorComponent, selector: "core-month-selector", inputs: ["align", "placeholder"], outputs: ["onYearClick"] }, { kind: "directive", type: TooltipDirective, selector: "[appTooltip]", inputs: ["appTooltip", "showAnyway", "color", "backgroundColor", "position"] }, { kind: "component", type: CoreCurrencyInputComponent, selector: "core-currency-input", inputs: ["currencySign", "placeholder"], outputs: ["onLeftFocus"] }, { kind: "component", type: CoreShiftCellComponent, selector: "core-shift-cell", inputs: ["$readOnly", "$hideStarterPlusSign", "$hideStickersWhileDragover", "$backgroundColor"] }, { kind: "component", type: CoreShiftCollectionComponent, selector: "core-shift-collection", inputs: ["height", "disabled", "relativeMode"] }, { kind: "component", type: CoreTopicPickerComponent, selector: "core-topic-picker", inputs: ["popupHeight", "getByIdApi"] }, { kind: "component", type: CoreIosSwitcherComponent, selector: "core-ios-switcher", inputs: ["bgColor", "showOnOffText", "width", "height", "readonly"] }, { kind: "component", type: CoreLiquidWysiwygComponent, selector: "core-liquid-wysiwyg", inputs: ["$liquidOptions", "$textareaRows", "$height", "$readonly", "$showLiquidSourceOnly", "$isForWorkflowEmail", "getByIdObject$", "placeholder"] }, { kind: "component", type: CoreStickerCollectionComponent, selector: "core-sticker-collection", inputs: ["$items", "$shownFrom", "$tooltipFrom", "$initialChecked", "$showMore", "$showMoreTooltip", "$hideShowMoreIfNotSelected", "$enableFilter"], outputs: ["$checkedChange", "$onShowMore"] }, { kind: "directive", type: HtmlTooltipDirective, selector: "[htmlTooltip]", inputs: ["htmlTooltip", "tooltipContext", "maxWidthUnset", "backgroundColor", "hold$"] }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: CoreControlComponent, decorators: [{
             type: Component,
@@ -26799,7 +26811,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.5", ngImpor
                         CoreLiquidWysiwygComponent,
                         CoreStickerCollectionComponent,
                         HtmlTooltipDirective
-                    ], template: "<div class=\"core-control-container\">\r\n\r\n    <div [formGroup]=\"form\" [class.hidden]=\"!!control.hidden\">\r\n\r\n        @if (!control.headless!) {\r\n            <label [class]=\"'control-label' +  (required ? ' required' : '')\" [attr.for]=\"control.field\"\r\n                [class.d-none]=\"!!control.hidden\"\r\n                [class.avatar-label]=\"control.uploadFileType==='IMAGE_AVATAR'\" [appTooltip]=\"control.tooltip! | translate: lang\" \r\n                [htmlTooltip]=\"control.htmlTooltip!\"\r\n                [backgroundColor]=\"'white'\"\r\n                [ngStyle]=\"{\r\n                    display: 'inline-block'\r\n                }\">\r\n                {{(control.controlType!=='CHECKBOX' && control.controlType!=='BUTTON') ? (control.label | translate: lang) : ''}}\r\n            </label>\r\n\r\n            @if (!!control.hint! && control.controlType !== 'CHECKBOX') {\r\n                <i class=\"feather-help-circle\" [appTooltip]=\"control.hint!\" [showAnyway]=\"true\" [ngStyle]=\"{\r\n                    display: 'inline-block',\r\n                    marginLeft: '2px'\r\n                }\" [class.d-none]=\"!!control.hidden\"></i>\r\n            }\r\n        }\r\n\r\n        <!-- START: FORM-CONTROL SESSION-->\r\n\r\n        <ng-container>\r\n        @switch (control.controlType) {\r\n            @case (\"FORM_ARRAY\") {\r\n                <core-form-array\r\n                    [formArrayName]=\"control.field!\"\r\n                    [parentFormGroup]=\"form\"\r\n                    [formArray]=\"formArray\"\r\n                    [config]=\"control.formArraySections! ?? []\"\r\n                    [checkError$]=\"checkError$\">\r\n                </core-form-array>\r\n            }\r\n            @case (\"CALCULATED\") {\r\n                <div class=\"calculated-view\" [htmlTooltip]=\"calculatedControlInfo\" [tooltipContext]=\"{control: control}\" [backgroundColor]=\"'#fff'\">\r\n                    <i class=\"feather-box\"></i><span>{{ control.field! }}</span>\r\n                </div>\r\n            }\r\n            @case (\"TEXTBOX\") {\r\n\r\n                <input *ngIf=\"control.type === 'date'\"\r\n                    [formControlName]=\"control.field\"\r\n                    type=\"date\"\r\n                    useValueAsDate\r\n                    class=\"form-control\"\r\n                    [readonly]=\"control.readonly\"\r\n                    [placeholder]=\"control.placeholder || ''\"\r\n                    [class.required-highlight]=\"!!required\"\r\n                    [class.form-control-disabled]=\"!!control.disabled\" />\r\n              \r\n                <input *ngIf=\"control.type === 'time'\"\r\n                    [formControlName]=\"control.field\"\r\n                    type=\"time\"\r\n                    class=\"form-control\"\r\n                    [readonly]=\"control.readonly\"\r\n                    [placeholder]=\"control.placeholder || ''\"\r\n                    [class.required-highlight]=\"!!required\"\r\n                    [class.form-control-disabled]=\"!!control.disabled\" />\r\n              \r\n                <input *ngIf=\"control.type === 'number'\"\r\n                    [formControlName]=\"control.field\"\r\n                    type=\"number\"\r\n                    step=\"{{ control.step || 1 }}\"\r\n                    class=\"form-control\"\r\n                    style=\"text-align: right;\"\r\n                    [readonly]=\"control.readonly\"\r\n                    [placeholder]=\"control.placeholder || ''\"\r\n                    [class.required-highlight]=\"!!required\"\r\n                    [class.form-control-disabled]=\"!!control.disabled\" />\r\n              \r\n                <input *ngIf=\"['string', 'text', 'email', 'url', 'password'].includes(control.type || 'text')\"\r\n                    [formControlName]=\"control.field\"\r\n                    [type]=\"control.type\"\r\n                    class=\"form-control\"\r\n                    [readonly]=\"control.readonly\"\r\n                    [placeholder]=\"control.placeholder || ''\"\r\n                    [value]=\"form.get(control.field)?.value | tableCell: control.pipe : lang\"\r\n                    [attr.pattern]=\"getPattern(control) || null\"\r\n                    [appTooltip]=\"form.get(control.field)?.value\"\r\n                    (focus)=\"onFocus($event)\"\r\n                    (blur)=\"onBlur($event)\"\r\n                    [class.required-highlight]=\"!!required\"\r\n                    [class.form-control-disabled]=\"!!control.disabled\" />\r\n            }\r\n            @case (\"CURRENCY\") {\r\n                <core-currency-input [required]=\"required\" [formControlName]=\"control.field\" [placeholder]=\"control.placeholder! || ''\"></core-currency-input>\r\n            }\r\n            @case (\"TEXTAREA\") {\r\n                <textarea [rows]=\"control.textareaRows?.toString() || '3'\" [ngStyle]=\"{ height: 'unset' }\"\r\n                    [class.required-highlight]=\"!!required\"\r\n                    [formControlName]=\"control.field\" class=\"form-control\" [readonly]=\"control.readonly\" [placeholder]=\"control.placeholder! || ''\"></textarea>\r\n            }\r\n            @case (\"CHECKBOX\") {\r\n                <core-checkbox [formControlName]=\"control.field\" [text]=\"control.label\"\r\n                    [inputValue]=\"control.value\" [tooltip]=\"control.hint!\"></core-checkbox>\r\n            }\r\n            @case (\"IOS_SWITCHER\") {\r\n                <div class=\"gap-for-ios-switcher\"></div>\r\n                <core-ios-switcher [formControlName]=\"control.field\" />\r\n            }\r\n            @case (\"MCC\") {\r\n                <core-mcc [required]=\"required\" [formControlName]=\"control.field\" [columns]=\"control.columns!\" [shownFrom]=\"control.shownFrom!\" \r\n                [apiDefinition]=\"control.apiDefinition!\" [getByIdApi]=\"control.getByIdApi!\" [selectedRow$]=\"control.selectedRow$!\"\r\n                [outerParam$]=\"control.outerParam$!\"\r\n                [placeholder]=\"control.placeholder! || ''\"\r\n                ></core-mcc>\r\n            }\r\n            @case (\"DATEPICKER\") {\r\n                <core-date-picker [required]=\"required\" [formControlName]=\"control.field\" [showPlaceholder]=\"control.showPlaceholder!\" [rangeLimit]=\"control.rangeLimit!\" [popupAlign]=\"control.popupAlign!\" [placeholder]=\"control.placeholder! || ''\"></core-date-picker>\r\n            }\r\n\r\n            @case (\"DROPDOWN\") {\r\n                @if (!!control.dropdownOptions$ || !!control.optionApiDriven) {\r\n                    <core-dropdown \r\n                        [required]=\"required\" \r\n                        [formControlName]=\"control.field\" \r\n                        [options$]=\"control.dropdownOptions$!\"\r\n                        [getByIdObject$]=\"control.getByIdObject$!\" \r\n                        [shownFrom]=\"control.shownFrom!\" \r\n                        [placeholder]=\"control.placeholder! || ''\"\r\n\r\n                        [optionApiDriven]=\"control.optionApiDriven!\"\r\n                        [optionApi]=\"control.optionApi!\"\r\n                        [optionHttpVerb]=\"control.optionHttpVerb!\"\r\n                        [optionHttpPayload]=\"control.optionHttpPayload!\"\r\n                        [optionValueFrom]=\"control.optionValueFrom!\"\r\n                        [optionTextFrom]=\"control.optionTextFrom!\"\r\n                    ></core-dropdown>\r\n                } @else {\r\n                    No dropdownOptions$ | optionApiDriven detected\r\n                }\r\n            }\r\n            @case (\"LIST\") {\r\n                <core-list [required]=\"required\" [formControlName]=\"control.field\" [options]=\"control.listOptions!\" [placeholder]=\"control.placeholder! || ''\"></core-list>\r\n            }\r\n            @case (\"CHECKLIST\") {\r\n                @if (!!control.checklistOptions$) {\r\n                    <core-checklist [required]=\"required\" [formControlName]=\"control.field\" [options$]=\"control.checklistOptions$!\"\r\n                        [getByIdObject$]=\"control.getByIdObject$!\" [shownFrom]=\"control.shownFrom!\" [placeholder]=\"control.placeholder! || ''\"></core-checklist>\r\n                }\r\n            }\r\n            @case (\"FILEUPLOADER\") {\r\n                @if (!!control.uploadFileType) {\r\n                    <core-file-uploader [required]=\"required\" [formControlName]=\"control.field\" [uploadFileType]=\"control.uploadFileType\"\r\n                        [fileDataControlName]=\"control.fileDataControlName!\"\r\n                        [fileNameControlName]=\"control.fileNameControlName!\"\r\n                        [fileTypeControlName]=\"control.fileTypeControlName!\"\r\n                        [verticalMode]=\"control.verticalMode!\"></core-file-uploader>\r\n                } @else {\r\n                    <div class=\"dev-declaration\">Please add uploadFileType</div>\r\n                }\r\n            }\r\n            @case (\"ATTACHMENT\") {\r\n                <core-attachment ngDefaultControl [required]=\"required\" [formControlName]=\"control.field\" [assignTo]=\"control.assignTo!\"\r\n                    [valueToShow]=\"control.valueToShow!\" [placeholder]=\"control.placeholder! || ''\"></core-attachment>\r\n            }\r\n            @case (\"GRIDBUFFER\") {\r\n                @if (!!control.gridBufferFormSections && !!control.gridBufferTableColumns) {\r\n                    <core-grid-buffer [required]=\"required\" [formControlName]=\"control.field\" [formSections]=\"control.gridBufferFormSections\"\r\n                        [gridColumns]=\"control.gridBufferTableColumns\"\r\n                        [placeholder]=\"control.placeholder! || ''\"\r\n                        [tableHeight]=\"control.tableHeight ?? 300\"\r\n                        [liteMode]=\"control.liteMode ?? false\"\r\n                        (onBufferFormCreated)=\"!!control.onBufferFormCreated ? control.onBufferFormCreated($event) : null\"></core-grid-buffer>\r\n                }\r\n            }\r\n            @case (\"ORGTREECHECK\") {\r\n                <core-org-tree [required]=\"required\" [formControlName]=\"control.field\"\r\n                    [accessorMode]=\"coreOrgTreeDefaultAccessorMode\" [height]=\"control.height!\"></core-org-tree>\r\n            }\r\n            @case (\"RADIOGROUP\") {\r\n                <core-radio-group [required]=\"required\" [formControlName]=\"control.field\"\r\n                    [options$]=\"control.radioGroupOptions$!\"\r\n                    [vertical]=\"control.verticalMode!\"\r\n                    ></core-radio-group>\r\n            }\r\n            @case (\"MONTHSELECTOR\") {\r\n                <core-month-selector [required]=\"required\" [formControlName]=\"control.field\" [placeholder]=\"control.placeholder! || ''\"></core-month-selector>\r\n            }\r\n            @case (\"SHIFTCELL\") {\r\n                <core-shift-cell [formControlName]=\"control.field\"></core-shift-cell>\r\n            }\r\n            @case (\"SHIFTCOLLECTION\") {\r\n                <core-shift-collection [relativeMode]=\"true\" [height]=\"control.height || 800\"></core-shift-collection>\r\n            }\r\n            @case(\"TOPICPICKER\") {\r\n                <core-topic-picker [required]=\"required\" [formControlName]=\"control.field\" [popupHeight]=\"control.popupHeight!\" [getByIdApi]=\"control.getByIdApi!\"></core-topic-picker>\r\n            }\r\n            @case(\"STICKER_COLLECTION\") {\r\n                  <core-sticker-collection\r\n                    [formControlName]=\"control.field\"\r\n                    [required]=\"required\"\r\n                    [$items]=\"control.stickerCollectionItems!\"\r\n                    [$shownFrom]=\"control.stickerCollectionShownFrom!\"\r\n                    [$tooltipFrom]=\"control.stickerCollectionTooltipFrom!\"\r\n                    [$initialChecked]=\"control.stickerCollectionInitialChecked!\"\r\n                    >\r\n                </core-sticker-collection>\r\n            }\r\n            @case (\"SEEKER\") {\r\n                @switch(control.seekerSourceType) {\r\n                    @case(\"JOB_SEEK\") {\r\n                        <core-form-control-seeker\r\n                            [required]=\"required\" \r\n                            [excludeExistingList]=\"control.excludeExistingList!\"\r\n                            [multiMode]=\"control.multiMode!\" [multiModeTableHeight]=\"control.multiModeTableHeight!\" [multiModeRowHeight]=\"control.multiModeRowHeight!\"\r\n                            [objectList$]=\"control.objectList$!\" [formControlName]=\"control.field\"\r\n                            [seekerSourceType]=\"control.seekerSourceType!\" \r\n                            [preDefinedOuterParam$]=\"control.preDefinedOuterParam$!\"\r\n                            [preDefinedOuterFilter$]=\"control.preDefinedOuterFilter$!\"\r\n                            [boundFrom]=\"control.boundFrom!\" [shownFrom]=\"control.shownFrom!\" [alsoBindTo]=\"control.alsoBindTo!\"\r\n                            [getByIdObject$]=\"control.getByIdObject$!\"\r\n                            [click$]=\"control.click$\"\r\n                            [multiModeExtendedColumns]=\"control.multiModeExtendedColumns!\"\r\n                            [multiModeExtendedSections]=\"control.multiModeExtendedSections!\"\r\n                            [editBufferData$]=\"control.editBufferData$!\"\r\n                            [indirectBinding]=\"control.indirectBinding!\"\r\n                            [bindGridIdTo]=\"control.bindGridIdTo!\"\r\n                            [useTheseColumns]=\"control.useTheseColumns!\"\r\n                            [hideOrgTree]=\"control.hideOrgTree!\"\r\n                            [sourceSpaceHeight]=\"control.sourceSpaceHeight!\"\r\n                            (selectedDataChange)=\"selectedDataChange($event)\"\r\n                            (fullValueRowChange)=\"fullValueRowChange($event)\"\r\n                        ></core-form-control-seeker>\r\n                    }\r\n                    @case(\"EMPLOYEE_SEEK\") {\r\n                        <core-form-control-seeker\r\n                            [required]=\"required\" \r\n                            [excludeExistingList]=\"control.excludeExistingList!\"\r\n                            [multiMode]=\"control.multiMode!\" [multiModeTableHeight]=\"control.multiModeTableHeight!\" [multiModeRowHeight]=\"control.multiModeRowHeight!\"\r\n                            [objectList$]=\"control.objectList$!\" [formControlName]=\"control.field\"\r\n                            [seekerSourceType]=\"control.seekerSourceType!\" \r\n                            [preDefinedOuterParam$]=\"control.preDefinedOuterParam$!\"\r\n                            [preDefinedOuterFilter$]=\"control.preDefinedOuterFilter$!\"\r\n                            [boundFrom]=\"control.boundFrom!\" [shownFrom]=\"control.shownFrom!\" [alsoBindTo]=\"control.alsoBindTo!\"\r\n                            [getByIdObject$]=\"control.getByIdObject$!\"\r\n                            [click$]=\"control.click$\"\r\n                            [multiModeExtendedColumns]=\"control.multiModeExtendedColumns!\"\r\n                            [multiModeExtendedSections]=\"control.multiModeExtendedSections!\"\r\n                            [editBufferData$]=\"control.editBufferData$!\"\r\n                            [indirectBinding]=\"control.indirectBinding!\"\r\n                            [bindGridIdTo]=\"control.bindGridIdTo!\"\r\n                            [useTheseColumns]=\"control.useTheseColumns!\"\r\n                            [hideOrgTree]=\"control.hideOrgTree!\"\r\n                            [sourceSpaceHeight]=\"control.sourceSpaceHeight!\"\r\n                            [placeholder]=\"control.placeholder! || ''\"\r\n                            (selectedDataChange)=\"selectedDataChange($event)\"\r\n                            (fullValueRowChange)=\"fullValueRowChange($event)\"\r\n                        ></core-form-control-seeker>\r\n                    }\r\n                    @case(\"CONTRACT_SEEK\") {\r\n                        <core-form-control-seeker\r\n                            [required]=\"required\" \r\n                            [excludeExistingList]=\"control.excludeExistingList!\"\r\n                            [multiMode]=\"control.multiMode!\" [multiModeTableHeight]=\"control.multiModeTableHeight!\" [multiModeRowHeight]=\"control.multiModeRowHeight!\"\r\n                            [objectList$]=\"control.objectList$!\" [formControlName]=\"control.field\"\r\n                            [seekerSourceType]=\"control.seekerSourceType!\" [boundFrom]=\"control.boundFrom!\"\r\n                            [preDefinedOuterParam$]=\"control.preDefinedOuterParam$!\" \r\n                            [preDefinedOuterFilter$]=\"control.preDefinedOuterFilter$!\"\r\n                            [shownFrom]=\"control.shownFrom!\"\r\n                            [alsoBindTo]=\"control.alsoBindTo!\"\r\n                            [getByIdObject$]=\"control.getByIdObject$!\"\r\n                            [multiModeExtendedColumns]=\"control.multiModeExtendedColumns!\"\r\n                            [multiModeExtendedSections]=\"control.multiModeExtendedSections!\"\r\n                            [click$]=\"control.click$\"\r\n                            [useTheseColumns]=\"control.useTheseColumns!\"\r\n                            [hideOrgTree]=\"control.hideOrgTree!\"\r\n                            [sourceSpaceHeight]=\"control.sourceSpaceHeight!\"\r\n                            [placeholder]=\"control.placeholder! || ''\"\r\n                            (selectedDataChange)=\"selectedDataChange($event)\"\r\n                            (fullValueRowChange)=\"fullValueRowChange($event)\"\r\n                        ></core-form-control-seeker>\r\n                    }\r\n                    @case(\"WORKING_SEEK\") {\r\n                        <core-form-control-seeker \r\n                            [required]=\"required\" \r\n                            [excludeExistingList]=\"control.excludeExistingList!\"\r\n                            [multiMode]=\"control.multiMode!\" [multiModeTableHeight]=\"control.multiModeTableHeight!\" [multiModeRowHeight]=\"control.multiModeRowHeight!\"\r\n                            [objectList$]=\"control.objectList$!\" [formControlName]=\"control.field\"\r\n                            [seekerSourceType]=\"control.seekerSourceType!\" \r\n                            [preDefinedOuterParam$]=\"control.preDefinedOuterParam$!\"\r\n                            [preDefinedOuterFilter$]=\"control.preDefinedOuterFilter$!\"\r\n                            [boundFrom]=\"control.boundFrom!\" [shownFrom]=\"control.shownFrom!\" [alsoBindTo]=\"control.alsoBindTo!\"\r\n                            [getByIdObject$]=\"control.getByIdObject$!\"\r\n                            [multiModeExtendedColumns]=\"control.multiModeExtendedColumns!\"\r\n                            [multiModeExtendedSections]=\"control.multiModeExtendedSections!\"\r\n                            [click$]=\"control.click$\"\r\n                            [useTheseColumns]=\"control.useTheseColumns!\"\r\n                            [hideOrgTree]=\"control.hideOrgTree!\"\r\n                            [sourceSpaceHeight]=\"control.sourceSpaceHeight!\"\r\n                            [placeholder]=\"control.placeholder! || ''\"\r\n                            (selectedDataChange)=\"selectedDataChange($event)\"\r\n                            (fullValueRowChange)=\"fullValueRowChange($event)\"\r\n                        ></core-form-control-seeker>\r\n                    }\r\n                    @case(\"WAGE_SEEK\") {\r\n                        <core-form-control-seeker \r\n                            [required]=\"required\" \r\n                            [excludeExistingList]=\"control.excludeExistingList!\"\r\n                            [formControlName]=\"control.field\"\r\n                            [multiMode]=\"control.multiMode!\" [multiModeTableHeight]=\"control.multiModeTableHeight!\" [multiModeRowHeight]=\"control.multiModeRowHeight!\"\r\n                            [objectList$]=\"control.objectList$!\"\r\n                            [seekerSourceType]=\"control.seekerSourceType!\" \r\n                            [preDefinedOuterParam$]=\"control.preDefinedOuterParam$!\"\r\n                            [preDefinedOuterFilter$]=\"control.preDefinedOuterFilter$!\"\r\n                            [boundFrom]=\"control.boundFrom!\" [shownFrom]=\"control.shownFrom!\" [alsoBindTo]=\"control.alsoBindTo!\"\r\n                            [getByIdObject$]=\"control.getByIdObject$!\"\r\n                            [multiModeExtendedColumns]=\"control.multiModeExtendedColumns!\"\r\n                            [multiModeExtendedSections]=\"control.multiModeExtendedSections!\"\r\n                            [click$]=\"control.click$\"\r\n                            [useTheseColumns]=\"control.useTheseColumns!\"\r\n                            [hideOrgTree]=\"control.hideOrgTree!\"\r\n                            [sourceSpaceHeight]=\"control.sourceSpaceHeight!\"\r\n                            [placeholder]=\"control.placeholder! || ''\"\r\n                            (selectedDataChange)=\"selectedDataChange($event)\"\r\n                            (fullValueRowChange)=\"fullValueRowChange($event)\"\r\n                        ></core-form-control-seeker>\r\n                    }\r\n                    @case(\"POSITION_SEEK\") {\r\n                        <core-form-control-seeker \r\n                            [required]=\"required\" \r\n                            [excludeExistingList]=\"control.excludeExistingList!\"\r\n                            [objectList$]=\"control.objectList$!\"\r\n                            [multiMode]=\"control.multiMode!\" [multiModeTableHeight]=\"control.multiModeTableHeight!\" [multiModeRowHeight]=\"control.multiModeRowHeight!\"\r\n                            [formControlName]=\"control.field\" [alsoBindTo]=\"control.alsoBindTo!\"\r\n                            [seekerSourceType]=\"control.seekerSourceType!\" \r\n                            [preDefinedOuterParam$]=\"control.preDefinedOuterParam$!\"\r\n                            [preDefinedOuterFilter$]=\"control.preDefinedOuterFilter$!\"\r\n                            [boundFrom]=\"control.boundFrom!\" [shownFrom]=\"control.shownFrom!\"\r\n                            [getByIdObject$]=\"control.getByIdObject$!\"\r\n                            [multiModeExtendedColumns]=\"control.multiModeExtendedColumns!\"\r\n                            [multiModeExtendedSections]=\"control.multiModeExtendedSections!\"\r\n                            [seekerVerifyIgnore]=\"control.seekerVerifyIgnore!\"\r\n                            [click$]=\"control.click$\"\r\n                            [useTheseColumns]=\"control.useTheseColumns!\"\r\n                            [hideOrgTree]=\"control.hideOrgTree!\"\r\n                            [sourceSpaceHeight]=\"control.sourceSpaceHeight!\"\r\n                            [placeholder]=\"control.placeholder! || ''\"\r\n                            (selectedDataChange)=\"selectedDataChange($event)\"\r\n                            (fullValueRowChange)=\"fullValueRowChange($event)\"\r\n                        ></core-form-control-seeker>\r\n                    }\r\n                    @case(\"POSITION_CONCURRENT_SEEK\") {\r\n                        <core-form-control-seeker\r\n                            [required]=\"required\" \r\n                            [excludeExistingList]=\"control.excludeExistingList!\"\r\n                            [multiMode]=\"control.multiMode!\" [multiModeTableHeight]=\"control.multiModeTableHeight!\" [multiModeRowHeight]=\"control.multiModeRowHeight!\"\r\n                            [formControlName]=\"control.field\" [alsoBindTo]=\"control.alsoBindTo!\"\r\n                            [seekerSourceType]=\"control.seekerSourceType!\" \r\n                            [preDefinedOuterParam$]=\"control.preDefinedOuterParam$!\"\r\n                            [preDefinedOuterFilter$]=\"control.preDefinedOuterFilter$!\"\r\n                            [boundFrom]=\"control.boundFrom!\" [shownFrom]=\"control.shownFrom!\"\r\n                            [getByIdObject$]=\"control.getByIdObject$!\"\r\n                            [multiModeExtendedColumns]=\"control.multiModeExtendedColumns!\"\r\n                            [multiModeExtendedSections]=\"control.multiModeExtendedSections!\"\r\n                            [multiModeTableHeight]=\"control.multiModeTableHeight!\"\r\n                            [click$]=\"control.click$\"\r\n                            [useTheseColumns]=\"control.useTheseColumns!\"\r\n                            [hideOrgTree]=\"control.hideOrgTree!\"\r\n                            [sourceSpaceHeight]=\"control.sourceSpaceHeight!\"\r\n                            [placeholder]=\"control.placeholder! || ''\"\r\n                            (selectedDataChange)=\"selectedDataChange($event)\"\r\n                            (fullValueRowChange)=\"fullValueRowChange($event)\"\r\n                        ></core-form-control-seeker>\r\n                    }\r\n                    @case(\"FORM_SEEK\") {\r\n                        <core-form-control-seeker\r\n                            [required]=\"required\" \r\n                            [excludeExistingList]=\"control.excludeExistingList!\"\r\n                            [multiMode]=\"control.multiMode!\" [multiModeTableHeight]=\"control.multiModeTableHeight!\" [multiModeRowHeight]=\"control.multiModeRowHeight!\"\r\n                            [formControlName]=\"control.field\" [alsoBindTo]=\"control.alsoBindTo!\"\r\n                            [seekerSourceType]=\"control.seekerSourceType!\" \r\n                            [preDefinedOuterParam$]=\"control.preDefinedOuterParam$!\"\r\n                            [preDefinedOuterFilter$]=\"control.preDefinedOuterFilter$!\"\r\n                            [boundFrom]=\"control.boundFrom!\" [shownFrom]=\"control.shownFrom!\"\r\n                            [getByIdObject$]=\"control.getByIdObject$!\"\r\n                            [multiModeExtendedColumns]=\"control.multiModeExtendedColumns!\"\r\n                            [multiModeExtendedSections]=\"control.multiModeExtendedSections!\"\r\n                            [multiModeTableHeight]=\"control.multiModeTableHeight!\"\r\n                            [click$]=\"control.click$\"\r\n                            [useTheseColumns]=\"control.useTheseColumns!\"\r\n                            [hideOrgTree]=\"control.hideOrgTree!\"\r\n                            [sourceSpaceHeight]=\"control.sourceSpaceHeight!\"\r\n                            [placeholder]=\"control.placeholder! || ''\"\r\n                            (selectedDataChange)=\"selectedDataChange($event)\"\r\n                            (fullValueRowChange)=\"fullValueRowChange($event)\"\r\n                        ></core-form-control-seeker>\r\n                    }\r\n                    @case(\"ORGANIZATION_UNIT_SEEK\") {\r\n                        <core-form-control-seeker\r\n                            [required]=\"required\" \r\n                            [formControlName]=\"control.field\" [seekerSourceType]=\"control.seekerSourceType!\"\r\n                            [boundFrom]=\"control.boundFrom!\" [alsoBindTo]=\"control.alsoBindTo!\" [shownFrom]=\"control.shownFrom!\"\r\n                            [getByIdObject$]=\"control.getByIdObject$!\"\r\n                            [click$]=\"control.click$\"\r\n                            [placeholder]=\"control.placeholder! || ''\"\r\n                        ></core-form-control-seeker>\r\n                    }\r\n                }\r\n            }\r\n            @case (\"LIQUID_WYSIWYG\") {\r\n                <core-liquid-wysiwyg\r\n                    [formControlName]=\"control.field\"\r\n                    [getByIdObject$]=\"control.getByIdObject$!\"\r\n                    [placeholder]=\"control.placeholder! || ''\"\r\n                    [$liquidOptions]=\"control.liquidOptions!\"\r\n                    [$textareaRows]=\"control.textareaRows!\"\r\n                    [$showLiquidSourceOnly]=\"control.showLiquidSourceOnly!\"\r\n                    [$isForWorkflowEmail]=\"control.isForWorkflowEmail!\"\r\n                />\r\n            }\r\n        }\r\n        </ng-container>\r\n\r\n        <ng-container *ngIf=\"control.controlType==='BUTTON'\">\r\n            <button type=\"button\" class=\"btn btn-secondary text\" (click)=\"oHandleClick($event)\">{{control.label| translate: lang}}</button>\r\n        </ng-container>\r\n        <!-- END: FORM-CONTROL SESSION-->\r\n\r\n        <!-- START: ERROR SESSION-->\r\n        <div *ngIf=\"!!errors!.length\">\r\n            <div class=\"form-control-error\" *ngFor=\"let error of errors\">\r\n                {{ error.errorMessage | translate: lang }}\r\n            </div>\r\n        </div>\r\n        <div *ngIf=\"!!!errors!.length && !!checkError$.value\">\r\n            <div>\r\n                {{ '&nbsp;' }}\r\n            </div>\r\n        </div>\r\n        <!-- END: ERROR SESSION-->\r\n\r\n    </div>\r\n\r\n\r\n</div>\r\n\r\n<ng-template #calculatedControlInfo let-control=\"control\">\r\n    <div class=\"calculated-tooltip-container\">\r\n        <div class=\"calculated-field-row\">\r\n        <span class=\"label\">Name:</span>\r\n        <span class=\"value\">{{ control?.field || 'N/A' }}</span>\r\n        </div>        \r\n        <div class=\"calculated-field-row\">\r\n        <span class=\"label\">Evaluation Mode:</span>\r\n        <span class=\"value\">{{ control?.evaluationMode || 'N/A' }}</span>\r\n        </div>\r\n        <div class=\"calculated-field-row\">\r\n        <span class=\"label\">Return Type:</span>\r\n        <span class=\"value\">{{ control?.returnType || 'N/A' }}</span>\r\n        </div>\r\n        <div class=\"calculated-field-row\">\r\n        <span class=\"label\">Depends On:</span>\r\n        <span class=\"value\" *ngIf=\"control?.dependsOn?.length > 0; else noDepends\">\r\n            <code *ngFor=\"let dep of control?.dependsOn; let last = last\">{{ dep }}<span *ngIf=\"!last\">, </span></code>\r\n        </span>\r\n        <ng-template #noDepends><em class=\"no-depends\">None</em></ng-template>\r\n        </div>\r\n        <div *ngIf=\"!!control?.isUnsafe\" class=\"warning\">\r\n        \u26A0\uFE0F This script is marked as <strong>unsafe</strong> and will not be executed.\r\n        </div>\r\n        <div class=\"calculated-field-row\">\r\n        <span class=\"label\">Script:</span>\r\n        <pre class=\"code-block\">{{ control?.script || 'No script provided.' }}</pre>\r\n        </div>\r\n    </div>\r\n</ng-template>", styles: [".core-control-container{font-size:var(--typo-basic-font-size)!important}.core-control-container .control-label{color:#848484}.core-control-container>div.hidden{display:none}.core-control-container label{color:#464646}.core-control-container label.required:after{content:\"*\";color:#ff040b}.core-control-container label.avatar-label{width:var(--size-file-uploader);display:flex;align-items:center;justify-content:center}.core-control-container input[type=number]{padding-right:12px;position:relative}.core-control-container input[type=number]::-webkit-inner-spin-button{position:absolute;right:.3em;margin-left:.5em}.core-control-container input[type=number]{-moz-appearance:textfield}.core-control-container i.feather-help-circle{color:#848484}.core-control-container .gap-for-ios-switcher{height:5px}.core-control-container .calculated-view{-webkit-user-select:none;user-select:none;cursor:pointer;height:35px;width:160px;background-color:#d8f3dc;color:#1b4332;border:1px solid #95d5b2;border-radius:50px;font-size:14px;font-weight:500;display:flex;align-items:center;justify-content:flex-start;font-family:Segoe UI,sans-serif;letter-spacing:.5px;padding:8px}.core-control-container .calculated-view i{font-size:18px;width:18px;height:18px;margin-right:8px}.core-control-container .calculated-view span{width:calc(100% - 26px);overflow:hidden;text-overflow:ellipsis;text-wrap:nowrap}.calculated-tooltip-container{background-color:#fff;border:1px solid #ddd;padding:1rem;border-radius:6px;font-size:14px;color:#333;box-shadow:0 4px 10px #0000000d;max-width:360px}.calculated-tooltip-container .calculated-field-row{margin-bottom:.75rem}.calculated-tooltip-container .label{font-weight:500;color:#555!important;display:inline-block;min-width:140px}.calculated-tooltip-container .value{color:#222!important}.calculated-tooltip-container .warning{color:#b91c1c;background:#fef2f2;border:1px solid #fca5a5;padding:.5rem;border-radius:4px;margin-bottom:1rem;font-size:13px}.calculated-tooltip-container .code-block{background:#f8f9fa;border:1px solid #ddd;padding:.75rem;font-family:monospace;font-size:12px;white-space:pre-wrap;color:#111!important;border-radius:4px;overflow-x:auto}.calculated-tooltip-container .no-depends{color:#888;font-style:italic}.calculated-tooltip-container pre{overflow:hidden}.calculated-tooltip-container label.required~input:not([disabled]),.calculated-tooltip-container label.required~textarea:not([disabled]),.calculated-tooltip-container label.required~select:not([disabled]){background-color:#ff0!important}\n"] }]
+                    ], template: "<div class=\"core-control-container\">\r\n\r\n    <div [formGroup]=\"form\" [class.hidden]=\"!!control.hidden\">\r\n\r\n        @if (!control.headless!) {\r\n            <label [class]=\"'control-label' +  (required ? ' required' : '')\" [attr.for]=\"control.field\"\r\n                [class.d-none]=\"!!control.hidden\"\r\n                [class.avatar-label]=\"control.uploadFileType==='IMAGE_AVATAR'\" [appTooltip]=\"control.tooltip! | translate: lang\" \r\n                [htmlTooltip]=\"control.htmlTooltip!\"\r\n                [backgroundColor]=\"'white'\"\r\n                [ngStyle]=\"{\r\n                    display: 'inline-block'\r\n                }\">\r\n                {{(control.controlType!=='CHECKBOX' && control.controlType!=='BUTTON') ? (control.label | translate: lang) : ''}}\r\n            </label>\r\n\r\n            @if (!!control.hint! && control.controlType !== 'CHECKBOX') {\r\n                <i class=\"feather-help-circle\" [appTooltip]=\"control.hint!\" [showAnyway]=\"true\" [ngStyle]=\"{\r\n                    display: 'inline-block',\r\n                    marginLeft: '2px'\r\n                }\" [class.d-none]=\"!!control.hidden\"></i>\r\n            }\r\n        }\r\n\r\n        <!-- START: FORM-CONTROL SESSION-->\r\n\r\n        <ng-container>\r\n        @switch (control.controlType) {\r\n            @case (\"FORM_ARRAY\") {\r\n                <core-form-array\r\n                    [formArrayName]=\"control.field!\"\r\n                    [parentFormGroup]=\"form\"\r\n                    [formArray]=\"formArray\"\r\n                    [config]=\"control.formArraySections! ?? []\"\r\n                    [disabled]=\"control.disabled!\"\r\n                    [readonly]=\"control.readonly!\"\r\n                    [checkError$]=\"checkError$\">\r\n                </core-form-array>\r\n            }\r\n            @case (\"CALCULATED\") {\r\n                <div class=\"calculated-view\" [htmlTooltip]=\"calculatedControlInfo\" [tooltipContext]=\"{control: control}\" [backgroundColor]=\"'#fff'\">\r\n                    <i class=\"feather-box\"></i><span>{{ control.field! }}</span>\r\n                </div>\r\n            }\r\n            @case (\"TEXTBOX\") {\r\n\r\n                <input *ngIf=\"control.type === 'date'\"\r\n                    [formControlName]=\"control.field\"\r\n                    type=\"date\"\r\n                    useValueAsDate\r\n                    class=\"form-control\"\r\n                    [readonly]=\"control.readonly\"\r\n                    [placeholder]=\"control.placeholder || ''\"\r\n                    [class.required-highlight]=\"!!required\"\r\n                    [class.form-control-disabled]=\"!!control.disabled\" />\r\n              \r\n                <input *ngIf=\"control.type === 'time'\"\r\n                    [formControlName]=\"control.field\"\r\n                    type=\"time\"\r\n                    class=\"form-control\"\r\n                    [readonly]=\"control.readonly\"\r\n                    [placeholder]=\"control.placeholder || ''\"\r\n                    [class.required-highlight]=\"!!required\"\r\n                    [class.form-control-disabled]=\"!!control.disabled\" />\r\n              \r\n                <input *ngIf=\"control.type === 'number'\"\r\n                    [formControlName]=\"control.field\"\r\n                    type=\"number\"\r\n                    step=\"{{ control.step || 1 }}\"\r\n                    class=\"form-control\"\r\n                    style=\"text-align: right;\"\r\n                    [readonly]=\"control.readonly\"\r\n                    [placeholder]=\"control.placeholder || ''\"\r\n                    [class.required-highlight]=\"!!required\"\r\n                    [class.form-control-disabled]=\"!!control.disabled\" />\r\n              \r\n                <input *ngIf=\"['string', 'text', 'email', 'url', 'password'].includes(control.type || 'text')\"\r\n                    [formControlName]=\"control.field\"\r\n                    [type]=\"control.type\"\r\n                    class=\"form-control\"\r\n                    [readonly]=\"control.readonly\"\r\n                    [placeholder]=\"control.placeholder || ''\"\r\n                    [value]=\"form.get(control.field)?.value | tableCell: control.pipe : lang\"\r\n                    [attr.pattern]=\"getPattern(control) || null\"\r\n                    [appTooltip]=\"form.get(control.field)?.value\"\r\n                    (focus)=\"onFocus($event)\"\r\n                    (blur)=\"onBlur($event)\"\r\n                    [class.required-highlight]=\"!!required\"\r\n                    [class.form-control-disabled]=\"!!control.disabled\" />\r\n            }\r\n            @case (\"CURRENCY\") {\r\n                <core-currency-input [required]=\"required\" [formControlName]=\"control.field\" [placeholder]=\"control.placeholder! || ''\"></core-currency-input>\r\n            }\r\n            @case (\"TEXTAREA\") {\r\n                <textarea [rows]=\"control.textareaRows?.toString() || '3'\" [ngStyle]=\"{ height: 'unset' }\"\r\n                    [class.required-highlight]=\"!!required\"\r\n                    [formControlName]=\"control.field\" class=\"form-control\" [readonly]=\"control.readonly\" [placeholder]=\"control.placeholder! || ''\"></textarea>\r\n            }\r\n            @case (\"CHECKBOX\") {\r\n                <core-checkbox [formControlName]=\"control.field\" [text]=\"control.label\"\r\n                    [inputValue]=\"control.value\" [tooltip]=\"control.hint!\"></core-checkbox>\r\n            }\r\n            @case (\"IOS_SWITCHER\") {\r\n                <div class=\"gap-for-ios-switcher\"></div>\r\n                <core-ios-switcher [formControlName]=\"control.field\" />\r\n            }\r\n            @case (\"MCC\") {\r\n                <core-mcc [required]=\"required\" [formControlName]=\"control.field\" [columns]=\"control.columns!\" [shownFrom]=\"control.shownFrom!\" \r\n                [apiDefinition]=\"control.apiDefinition!\" [getByIdApi]=\"control.getByIdApi!\" [selectedRow$]=\"control.selectedRow$!\"\r\n                [outerParam$]=\"control.outerParam$!\"\r\n                [placeholder]=\"control.placeholder! || ''\"\r\n                ></core-mcc>\r\n            }\r\n            @case (\"DATEPICKER\") {\r\n                <core-date-picker [required]=\"required\" [formControlName]=\"control.field\" [showPlaceholder]=\"control.showPlaceholder!\" [rangeLimit]=\"control.rangeLimit!\" [popupAlign]=\"control.popupAlign!\" [placeholder]=\"control.placeholder! || ''\"></core-date-picker>\r\n            }\r\n\r\n            @case (\"DROPDOWN\") {\r\n                @if (!!control.dropdownOptions$ || !!control.optionApiDriven) {\r\n                    <core-dropdown \r\n                        [required]=\"required\" \r\n                        [formControlName]=\"control.field\" \r\n                        [options$]=\"control.dropdownOptions$!\"\r\n                        [getByIdObject$]=\"control.getByIdObject$!\" \r\n                        [shownFrom]=\"control.shownFrom!\" \r\n                        [placeholder]=\"control.placeholder! || ''\"\r\n\r\n                        [optionApiDriven]=\"control.optionApiDriven!\"\r\n                        [optionApi]=\"control.optionApi!\"\r\n                        [optionHttpVerb]=\"control.optionHttpVerb!\"\r\n                        [optionHttpPayload]=\"control.optionHttpPayload!\"\r\n                        [optionValueFrom]=\"control.optionValueFrom!\"\r\n                        [optionTextFrom]=\"control.optionTextFrom!\"\r\n                    ></core-dropdown>\r\n                } @else {\r\n                    No dropdownOptions$ | optionApiDriven detected\r\n                }\r\n            }\r\n            @case (\"LIST\") {\r\n                <core-list [required]=\"required\" [formControlName]=\"control.field\" [options]=\"control.listOptions!\" [placeholder]=\"control.placeholder! || ''\"></core-list>\r\n            }\r\n            @case (\"CHECKLIST\") {\r\n                @if (!!control.checklistOptions$) {\r\n                    <core-checklist [required]=\"required\" [formControlName]=\"control.field\" [options$]=\"control.checklistOptions$!\"\r\n                        [getByIdObject$]=\"control.getByIdObject$!\" [shownFrom]=\"control.shownFrom!\" [placeholder]=\"control.placeholder! || ''\"></core-checklist>\r\n                }\r\n            }\r\n            @case (\"FILEUPLOADER\") {\r\n                @if (!!control.uploadFileType) {\r\n                    <core-file-uploader [required]=\"required\" [formControlName]=\"control.field\" [uploadFileType]=\"control.uploadFileType\"\r\n                        [fileDataControlName]=\"control.fileDataControlName!\"\r\n                        [fileNameControlName]=\"control.fileNameControlName!\"\r\n                        [fileTypeControlName]=\"control.fileTypeControlName!\"\r\n                        [verticalMode]=\"control.verticalMode!\"></core-file-uploader>\r\n                } @else {\r\n                    <div class=\"dev-declaration\">Please add uploadFileType</div>\r\n                }\r\n            }\r\n            @case (\"ATTACHMENT\") {\r\n                <core-attachment ngDefaultControl [required]=\"required\" [formControlName]=\"control.field\" [assignTo]=\"control.assignTo!\"\r\n                    [valueToShow]=\"control.valueToShow!\" [placeholder]=\"control.placeholder! || ''\"></core-attachment>\r\n            }\r\n            @case (\"GRIDBUFFER\") {\r\n                @if (!!control.gridBufferFormSections && !!control.gridBufferTableColumns) {\r\n                    <core-grid-buffer [required]=\"required\" [formControlName]=\"control.field\" [formSections]=\"control.gridBufferFormSections\"\r\n                        [gridColumns]=\"control.gridBufferTableColumns\"\r\n                        [placeholder]=\"control.placeholder! || ''\"\r\n                        [tableHeight]=\"control.tableHeight ?? 300\"\r\n                        [liteMode]=\"control.liteMode ?? false\"\r\n                        (onBufferFormCreated)=\"!!control.onBufferFormCreated ? control.onBufferFormCreated($event) : null\"></core-grid-buffer>\r\n                }\r\n            }\r\n            @case (\"ORGTREECHECK\") {\r\n                <core-org-tree [required]=\"required\" [formControlName]=\"control.field\"\r\n                    [accessorMode]=\"coreOrgTreeDefaultAccessorMode\" [height]=\"control.height!\"></core-org-tree>\r\n            }\r\n            @case (\"RADIOGROUP\") {\r\n                <core-radio-group [required]=\"required\" [formControlName]=\"control.field\"\r\n                    [options$]=\"control.radioGroupOptions$!\"\r\n                    [vertical]=\"control.verticalMode!\"\r\n                    ></core-radio-group>\r\n            }\r\n            @case (\"MONTHSELECTOR\") {\r\n                <core-month-selector [required]=\"required\" [formControlName]=\"control.field\" [placeholder]=\"control.placeholder! || ''\"></core-month-selector>\r\n            }\r\n            @case (\"SHIFTCELL\") {\r\n                <core-shift-cell [formControlName]=\"control.field\"></core-shift-cell>\r\n            }\r\n            @case (\"SHIFTCOLLECTION\") {\r\n                <core-shift-collection [relativeMode]=\"true\" [height]=\"control.height || 800\"></core-shift-collection>\r\n            }\r\n            @case(\"TOPICPICKER\") {\r\n                <core-topic-picker [required]=\"required\" [formControlName]=\"control.field\" [popupHeight]=\"control.popupHeight!\" [getByIdApi]=\"control.getByIdApi!\"></core-topic-picker>\r\n            }\r\n            @case(\"STICKER_COLLECTION\") {\r\n                  <core-sticker-collection\r\n                    [formControlName]=\"control.field\"\r\n                    [required]=\"required\"\r\n                    [$items]=\"control.stickerCollectionItems!\"\r\n                    [$shownFrom]=\"control.stickerCollectionShownFrom!\"\r\n                    [$tooltipFrom]=\"control.stickerCollectionTooltipFrom!\"\r\n                    [$initialChecked]=\"control.stickerCollectionInitialChecked!\"\r\n                    >\r\n                </core-sticker-collection>\r\n            }\r\n            @case (\"SEEKER\") {\r\n                @switch(control.seekerSourceType) {\r\n                    @case(\"JOB_SEEK\") {\r\n                        <core-form-control-seeker\r\n                            [required]=\"required\" \r\n                            [excludeExistingList]=\"control.excludeExistingList!\"\r\n                            [multiMode]=\"control.multiMode!\" [multiModeTableHeight]=\"control.multiModeTableHeight!\" [multiModeRowHeight]=\"control.multiModeRowHeight!\"\r\n                            [objectList$]=\"control.objectList$!\" [formControlName]=\"control.field\"\r\n                            [seekerSourceType]=\"control.seekerSourceType!\" \r\n                            [preDefinedOuterParam$]=\"control.preDefinedOuterParam$!\"\r\n                            [preDefinedOuterFilter$]=\"control.preDefinedOuterFilter$!\"\r\n                            [boundFrom]=\"control.boundFrom!\" [shownFrom]=\"control.shownFrom!\" [alsoBindTo]=\"control.alsoBindTo!\"\r\n                            [getByIdObject$]=\"control.getByIdObject$!\"\r\n                            [click$]=\"control.click$\"\r\n                            [multiModeExtendedColumns]=\"control.multiModeExtendedColumns!\"\r\n                            [multiModeExtendedSections]=\"control.multiModeExtendedSections!\"\r\n                            [editBufferData$]=\"control.editBufferData$!\"\r\n                            [indirectBinding]=\"control.indirectBinding!\"\r\n                            [bindGridIdTo]=\"control.bindGridIdTo!\"\r\n                            [useTheseColumns]=\"control.useTheseColumns!\"\r\n                            [hideOrgTree]=\"control.hideOrgTree!\"\r\n                            [sourceSpaceHeight]=\"control.sourceSpaceHeight!\"\r\n                            (selectedDataChange)=\"selectedDataChange($event)\"\r\n                            (fullValueRowChange)=\"fullValueRowChange($event)\"\r\n                        ></core-form-control-seeker>\r\n                    }\r\n                    @case(\"EMPLOYEE_SEEK\") {\r\n                        <core-form-control-seeker\r\n                            [required]=\"required\" \r\n                            [excludeExistingList]=\"control.excludeExistingList!\"\r\n                            [multiMode]=\"control.multiMode!\" [multiModeTableHeight]=\"control.multiModeTableHeight!\" [multiModeRowHeight]=\"control.multiModeRowHeight!\"\r\n                            [objectList$]=\"control.objectList$!\" [formControlName]=\"control.field\"\r\n                            [seekerSourceType]=\"control.seekerSourceType!\" \r\n                            [preDefinedOuterParam$]=\"control.preDefinedOuterParam$!\"\r\n                            [preDefinedOuterFilter$]=\"control.preDefinedOuterFilter$!\"\r\n                            [boundFrom]=\"control.boundFrom!\" [shownFrom]=\"control.shownFrom!\" [alsoBindTo]=\"control.alsoBindTo!\"\r\n                            [getByIdObject$]=\"control.getByIdObject$!\"\r\n                            [click$]=\"control.click$\"\r\n                            [multiModeExtendedColumns]=\"control.multiModeExtendedColumns!\"\r\n                            [multiModeExtendedSections]=\"control.multiModeExtendedSections!\"\r\n                            [editBufferData$]=\"control.editBufferData$!\"\r\n                            [indirectBinding]=\"control.indirectBinding!\"\r\n                            [bindGridIdTo]=\"control.bindGridIdTo!\"\r\n                            [useTheseColumns]=\"control.useTheseColumns!\"\r\n                            [hideOrgTree]=\"control.hideOrgTree!\"\r\n                            [sourceSpaceHeight]=\"control.sourceSpaceHeight!\"\r\n                            [placeholder]=\"control.placeholder! || ''\"\r\n                            (selectedDataChange)=\"selectedDataChange($event)\"\r\n                            (fullValueRowChange)=\"fullValueRowChange($event)\"\r\n                        ></core-form-control-seeker>\r\n                    }\r\n                    @case(\"CONTRACT_SEEK\") {\r\n                        <core-form-control-seeker\r\n                            [required]=\"required\" \r\n                            [excludeExistingList]=\"control.excludeExistingList!\"\r\n                            [multiMode]=\"control.multiMode!\" [multiModeTableHeight]=\"control.multiModeTableHeight!\" [multiModeRowHeight]=\"control.multiModeRowHeight!\"\r\n                            [objectList$]=\"control.objectList$!\" [formControlName]=\"control.field\"\r\n                            [seekerSourceType]=\"control.seekerSourceType!\" [boundFrom]=\"control.boundFrom!\"\r\n                            [preDefinedOuterParam$]=\"control.preDefinedOuterParam$!\" \r\n                            [preDefinedOuterFilter$]=\"control.preDefinedOuterFilter$!\"\r\n                            [shownFrom]=\"control.shownFrom!\"\r\n                            [alsoBindTo]=\"control.alsoBindTo!\"\r\n                            [getByIdObject$]=\"control.getByIdObject$!\"\r\n                            [multiModeExtendedColumns]=\"control.multiModeExtendedColumns!\"\r\n                            [multiModeExtendedSections]=\"control.multiModeExtendedSections!\"\r\n                            [click$]=\"control.click$\"\r\n                            [useTheseColumns]=\"control.useTheseColumns!\"\r\n                            [hideOrgTree]=\"control.hideOrgTree!\"\r\n                            [sourceSpaceHeight]=\"control.sourceSpaceHeight!\"\r\n                            [placeholder]=\"control.placeholder! || ''\"\r\n                            (selectedDataChange)=\"selectedDataChange($event)\"\r\n                            (fullValueRowChange)=\"fullValueRowChange($event)\"\r\n                        ></core-form-control-seeker>\r\n                    }\r\n                    @case(\"WORKING_SEEK\") {\r\n                        <core-form-control-seeker \r\n                            [required]=\"required\" \r\n                            [excludeExistingList]=\"control.excludeExistingList!\"\r\n                            [multiMode]=\"control.multiMode!\" [multiModeTableHeight]=\"control.multiModeTableHeight!\" [multiModeRowHeight]=\"control.multiModeRowHeight!\"\r\n                            [objectList$]=\"control.objectList$!\" [formControlName]=\"control.field\"\r\n                            [seekerSourceType]=\"control.seekerSourceType!\" \r\n                            [preDefinedOuterParam$]=\"control.preDefinedOuterParam$!\"\r\n                            [preDefinedOuterFilter$]=\"control.preDefinedOuterFilter$!\"\r\n                            [boundFrom]=\"control.boundFrom!\" [shownFrom]=\"control.shownFrom!\" [alsoBindTo]=\"control.alsoBindTo!\"\r\n                            [getByIdObject$]=\"control.getByIdObject$!\"\r\n                            [multiModeExtendedColumns]=\"control.multiModeExtendedColumns!\"\r\n                            [multiModeExtendedSections]=\"control.multiModeExtendedSections!\"\r\n                            [click$]=\"control.click$\"\r\n                            [useTheseColumns]=\"control.useTheseColumns!\"\r\n                            [hideOrgTree]=\"control.hideOrgTree!\"\r\n                            [sourceSpaceHeight]=\"control.sourceSpaceHeight!\"\r\n                            [placeholder]=\"control.placeholder! || ''\"\r\n                            (selectedDataChange)=\"selectedDataChange($event)\"\r\n                            (fullValueRowChange)=\"fullValueRowChange($event)\"\r\n                        ></core-form-control-seeker>\r\n                    }\r\n                    @case(\"WAGE_SEEK\") {\r\n                        <core-form-control-seeker \r\n                            [required]=\"required\" \r\n                            [excludeExistingList]=\"control.excludeExistingList!\"\r\n                            [formControlName]=\"control.field\"\r\n                            [multiMode]=\"control.multiMode!\" [multiModeTableHeight]=\"control.multiModeTableHeight!\" [multiModeRowHeight]=\"control.multiModeRowHeight!\"\r\n                            [objectList$]=\"control.objectList$!\"\r\n                            [seekerSourceType]=\"control.seekerSourceType!\" \r\n                            [preDefinedOuterParam$]=\"control.preDefinedOuterParam$!\"\r\n                            [preDefinedOuterFilter$]=\"control.preDefinedOuterFilter$!\"\r\n                            [boundFrom]=\"control.boundFrom!\" [shownFrom]=\"control.shownFrom!\" [alsoBindTo]=\"control.alsoBindTo!\"\r\n                            [getByIdObject$]=\"control.getByIdObject$!\"\r\n                            [multiModeExtendedColumns]=\"control.multiModeExtendedColumns!\"\r\n                            [multiModeExtendedSections]=\"control.multiModeExtendedSections!\"\r\n                            [click$]=\"control.click$\"\r\n                            [useTheseColumns]=\"control.useTheseColumns!\"\r\n                            [hideOrgTree]=\"control.hideOrgTree!\"\r\n                            [sourceSpaceHeight]=\"control.sourceSpaceHeight!\"\r\n                            [placeholder]=\"control.placeholder! || ''\"\r\n                            (selectedDataChange)=\"selectedDataChange($event)\"\r\n                            (fullValueRowChange)=\"fullValueRowChange($event)\"\r\n                        ></core-form-control-seeker>\r\n                    }\r\n                    @case(\"POSITION_SEEK\") {\r\n                        <core-form-control-seeker \r\n                            [required]=\"required\" \r\n                            [excludeExistingList]=\"control.excludeExistingList!\"\r\n                            [objectList$]=\"control.objectList$!\"\r\n                            [multiMode]=\"control.multiMode!\" [multiModeTableHeight]=\"control.multiModeTableHeight!\" [multiModeRowHeight]=\"control.multiModeRowHeight!\"\r\n                            [formControlName]=\"control.field\" [alsoBindTo]=\"control.alsoBindTo!\"\r\n                            [seekerSourceType]=\"control.seekerSourceType!\" \r\n                            [preDefinedOuterParam$]=\"control.preDefinedOuterParam$!\"\r\n                            [preDefinedOuterFilter$]=\"control.preDefinedOuterFilter$!\"\r\n                            [boundFrom]=\"control.boundFrom!\" [shownFrom]=\"control.shownFrom!\"\r\n                            [getByIdObject$]=\"control.getByIdObject$!\"\r\n                            [multiModeExtendedColumns]=\"control.multiModeExtendedColumns!\"\r\n                            [multiModeExtendedSections]=\"control.multiModeExtendedSections!\"\r\n                            [seekerVerifyIgnore]=\"control.seekerVerifyIgnore!\"\r\n                            [click$]=\"control.click$\"\r\n                            [useTheseColumns]=\"control.useTheseColumns!\"\r\n                            [hideOrgTree]=\"control.hideOrgTree!\"\r\n                            [sourceSpaceHeight]=\"control.sourceSpaceHeight!\"\r\n                            [placeholder]=\"control.placeholder! || ''\"\r\n                            (selectedDataChange)=\"selectedDataChange($event)\"\r\n                            (fullValueRowChange)=\"fullValueRowChange($event)\"\r\n                        ></core-form-control-seeker>\r\n                    }\r\n                    @case(\"POSITION_CONCURRENT_SEEK\") {\r\n                        <core-form-control-seeker\r\n                            [required]=\"required\" \r\n                            [excludeExistingList]=\"control.excludeExistingList!\"\r\n                            [multiMode]=\"control.multiMode!\" [multiModeTableHeight]=\"control.multiModeTableHeight!\" [multiModeRowHeight]=\"control.multiModeRowHeight!\"\r\n                            [formControlName]=\"control.field\" [alsoBindTo]=\"control.alsoBindTo!\"\r\n                            [seekerSourceType]=\"control.seekerSourceType!\" \r\n                            [preDefinedOuterParam$]=\"control.preDefinedOuterParam$!\"\r\n                            [preDefinedOuterFilter$]=\"control.preDefinedOuterFilter$!\"\r\n                            [boundFrom]=\"control.boundFrom!\" [shownFrom]=\"control.shownFrom!\"\r\n                            [getByIdObject$]=\"control.getByIdObject$!\"\r\n                            [multiModeExtendedColumns]=\"control.multiModeExtendedColumns!\"\r\n                            [multiModeExtendedSections]=\"control.multiModeExtendedSections!\"\r\n                            [multiModeTableHeight]=\"control.multiModeTableHeight!\"\r\n                            [click$]=\"control.click$\"\r\n                            [useTheseColumns]=\"control.useTheseColumns!\"\r\n                            [hideOrgTree]=\"control.hideOrgTree!\"\r\n                            [sourceSpaceHeight]=\"control.sourceSpaceHeight!\"\r\n                            [placeholder]=\"control.placeholder! || ''\"\r\n                            (selectedDataChange)=\"selectedDataChange($event)\"\r\n                            (fullValueRowChange)=\"fullValueRowChange($event)\"\r\n                        ></core-form-control-seeker>\r\n                    }\r\n                    @case(\"FORM_SEEK\") {\r\n                        <core-form-control-seeker\r\n                            [required]=\"required\" \r\n                            [excludeExistingList]=\"control.excludeExistingList!\"\r\n                            [multiMode]=\"control.multiMode!\" [multiModeTableHeight]=\"control.multiModeTableHeight!\" [multiModeRowHeight]=\"control.multiModeRowHeight!\"\r\n                            [formControlName]=\"control.field\" [alsoBindTo]=\"control.alsoBindTo!\"\r\n                            [seekerSourceType]=\"control.seekerSourceType!\" \r\n                            [preDefinedOuterParam$]=\"control.preDefinedOuterParam$!\"\r\n                            [preDefinedOuterFilter$]=\"control.preDefinedOuterFilter$!\"\r\n                            [boundFrom]=\"control.boundFrom!\" [shownFrom]=\"control.shownFrom!\"\r\n                            [getByIdObject$]=\"control.getByIdObject$!\"\r\n                            [multiModeExtendedColumns]=\"control.multiModeExtendedColumns!\"\r\n                            [multiModeExtendedSections]=\"control.multiModeExtendedSections!\"\r\n                            [multiModeTableHeight]=\"control.multiModeTableHeight!\"\r\n                            [click$]=\"control.click$\"\r\n                            [useTheseColumns]=\"control.useTheseColumns!\"\r\n                            [hideOrgTree]=\"control.hideOrgTree!\"\r\n                            [sourceSpaceHeight]=\"control.sourceSpaceHeight!\"\r\n                            [placeholder]=\"control.placeholder! || ''\"\r\n                            (selectedDataChange)=\"selectedDataChange($event)\"\r\n                            (fullValueRowChange)=\"fullValueRowChange($event)\"\r\n                        ></core-form-control-seeker>\r\n                    }\r\n                    @case(\"ORGANIZATION_UNIT_SEEK\") {\r\n                        <core-form-control-seeker\r\n                            [required]=\"required\" \r\n                            [formControlName]=\"control.field\" [seekerSourceType]=\"control.seekerSourceType!\"\r\n                            [boundFrom]=\"control.boundFrom!\" [alsoBindTo]=\"control.alsoBindTo!\" [shownFrom]=\"control.shownFrom!\"\r\n                            [getByIdObject$]=\"control.getByIdObject$!\"\r\n                            [click$]=\"control.click$\"\r\n                            [placeholder]=\"control.placeholder! || ''\"\r\n                        ></core-form-control-seeker>\r\n                    }\r\n                }\r\n            }\r\n            @case (\"LIQUID_WYSIWYG\") {\r\n                <core-liquid-wysiwyg\r\n                    [formControlName]=\"control.field\"\r\n                    [getByIdObject$]=\"control.getByIdObject$!\"\r\n                    [placeholder]=\"control.placeholder! || ''\"\r\n                    [$liquidOptions]=\"control.liquidOptions!\"\r\n                    [$textareaRows]=\"control.textareaRows!\"\r\n                    [$showLiquidSourceOnly]=\"control.showLiquidSourceOnly!\"\r\n                    [$isForWorkflowEmail]=\"control.isForWorkflowEmail!\"\r\n                />\r\n            }\r\n        }\r\n        </ng-container>\r\n\r\n        <ng-container *ngIf=\"control.controlType==='BUTTON'\">\r\n            <button type=\"button\" class=\"btn btn-secondary text\" (click)=\"oHandleClick($event)\">{{control.label| translate: lang}}</button>\r\n        </ng-container>\r\n        <!-- END: FORM-CONTROL SESSION-->\r\n\r\n        <!-- START: ERROR SESSION-->\r\n        <div *ngIf=\"!!errors!.length\">\r\n            <div class=\"form-control-error\" *ngFor=\"let error of errors\">\r\n                {{ error.errorMessage | translate: lang }}\r\n            </div>\r\n        </div>\r\n        <div *ngIf=\"!!!errors!.length && !!checkError$.value\">\r\n            <div>\r\n                {{ '&nbsp;' }}\r\n            </div>\r\n        </div>\r\n        <!-- END: ERROR SESSION-->\r\n\r\n    </div>\r\n\r\n\r\n</div>\r\n\r\n<ng-template #calculatedControlInfo let-control=\"control\">\r\n    <div class=\"calculated-tooltip-container\">\r\n        <div class=\"calculated-field-row\">\r\n        <span class=\"label\">Name:</span>\r\n        <span class=\"value\">{{ control?.field || 'N/A' }}</span>\r\n        </div>        \r\n        <div class=\"calculated-field-row\">\r\n        <span class=\"label\">Evaluation Mode:</span>\r\n        <span class=\"value\">{{ control?.evaluationMode || 'N/A' }}</span>\r\n        </div>\r\n        <div class=\"calculated-field-row\">\r\n        <span class=\"label\">Return Type:</span>\r\n        <span class=\"value\">{{ control?.returnType || 'N/A' }}</span>\r\n        </div>\r\n        <div class=\"calculated-field-row\">\r\n        <span class=\"label\">Depends On:</span>\r\n        <span class=\"value\" *ngIf=\"control?.dependsOn?.length > 0; else noDepends\">\r\n            <code *ngFor=\"let dep of control?.dependsOn; let last = last\">{{ dep }}<span *ngIf=\"!last\">, </span></code>\r\n        </span>\r\n        <ng-template #noDepends><em class=\"no-depends\">None</em></ng-template>\r\n        </div>\r\n        <div *ngIf=\"!!control?.isUnsafe\" class=\"warning\">\r\n        \u26A0\uFE0F This script is marked as <strong>unsafe</strong> and will not be executed.\r\n        </div>\r\n        <div class=\"calculated-field-row\">\r\n        <span class=\"label\">Script:</span>\r\n        <pre class=\"code-block\">{{ control?.script || 'No script provided.' }}</pre>\r\n        </div>\r\n    </div>\r\n</ng-template>", styles: [".core-control-container{font-size:var(--typo-basic-font-size)!important}.core-control-container .control-label{color:#848484}.core-control-container>div.hidden{display:none}.core-control-container label{color:#464646}.core-control-container label.required:after{content:\"*\";color:#ff040b}.core-control-container label.avatar-label{width:var(--size-file-uploader);display:flex;align-items:center;justify-content:center}.core-control-container input[type=number]{padding-right:12px;position:relative}.core-control-container input[type=number]::-webkit-inner-spin-button{position:absolute;right:.3em;margin-left:.5em}.core-control-container input[type=number]{-moz-appearance:textfield}.core-control-container i.feather-help-circle{color:#848484}.core-control-container .gap-for-ios-switcher{height:5px}.core-control-container .calculated-view{-webkit-user-select:none;user-select:none;cursor:pointer;height:35px;width:160px;background-color:#d8f3dc;color:#1b4332;border:1px solid #95d5b2;border-radius:50px;font-size:14px;font-weight:500;display:flex;align-items:center;justify-content:flex-start;font-family:Segoe UI,sans-serif;letter-spacing:.5px;padding:8px}.core-control-container .calculated-view i{font-size:18px;width:18px;height:18px;margin-right:8px}.core-control-container .calculated-view span{width:calc(100% - 26px);overflow:hidden;text-overflow:ellipsis;text-wrap:nowrap}.calculated-tooltip-container{background-color:#fff;border:1px solid #ddd;padding:1rem;border-radius:6px;font-size:14px;color:#333;box-shadow:0 4px 10px #0000000d;max-width:360px}.calculated-tooltip-container .calculated-field-row{margin-bottom:.75rem}.calculated-tooltip-container .label{font-weight:500;color:#555!important;display:inline-block;min-width:140px}.calculated-tooltip-container .value{color:#222!important}.calculated-tooltip-container .warning{color:#b91c1c;background:#fef2f2;border:1px solid #fca5a5;padding:.5rem;border-radius:4px;margin-bottom:1rem;font-size:13px}.calculated-tooltip-container .code-block{background:#f8f9fa;border:1px solid #ddd;padding:.75rem;font-family:monospace;font-size:12px;white-space:pre-wrap;color:#111!important;border-radius:4px;overflow-x:auto}.calculated-tooltip-container .no-depends{color:#888;font-style:italic}.calculated-tooltip-container pre{overflow:hidden}.calculated-tooltip-container label.required~input:not([disabled]),.calculated-tooltip-container label.required~textarea:not([disabled]),.calculated-tooltip-container label.required~select:not([disabled]){background-color:#ff0!important}\n"] }]
         }], ctorParameters: () => [{ type: MultiLanguageService }, { type: AlertService }], propDecorators: { control: [{
                 type: Input
             }], form: [{
@@ -28485,7 +28497,7 @@ class AtShiftPatternComponent extends BaseEditComponent {
         this.atShiftPatternService.activePattern$.next(undefined);
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: AtShiftPatternComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.5", type: AtShiftPatternComponent, isStandalone: true, selector: "core-at-shift-pattern", viewQueries: [{ propertyName: "sticker", first: true, predicate: ["sticker"], descendants: true }], usesInheritance: true, ngImport: i0, template: "<div class=\"core-at-shift-pattern-container\">\r\n\r\n    <!-- <core-page-header [title]=\"title\" (buttonClick)=\"onCorePageHeaderButtonClick($event)\"></core-page-header> -->\r\n\r\n    @if (workShiftDndService.shiftCollectionOpen$ | async) {\r\n    <core-shift-collection [height]=\"(shiftCollectionHeight$ | async) || 800\"></core-shift-collection>\r\n    }\r\n\r\n    <div class=\"d-flex d-flex-between content-wrapper position-relative\">\r\n        <div class=\"list-block\">\r\n            <core-page-list [apiDefinition]=\"apiDefinition\" [columns]=\"columns\" [editRoute]=\"editRoute\" [crud]=\"crud\"\r\n                [title]=\"title\" [autoResizeWithWindow]=\"true\" [checkboxExplicity]=\"true\"\r\n                (listChange)=\"onListChange($event)\" (corePageHeaderButtonClick)=\"onCorePageHeaderButtonClick($event)\"\r\n                (onInstanceCreated)=\"onInstanceCreated($event)\" (rowClick)=\"rowClick($event)\"></core-page-list>\r\n        </div>\r\n\r\n        @if (!(atShiftPatternService.activePattern$ | async)) {\r\n        <div class=\"anim-block\">\r\n            <div class=\"alert is-success\">\r\n                <p class=\"alert-title\"><span class=\"ti-light-bulb\" aria-hidden=\"true\"></span>\r\n                    @if (lang === 'vi') {\r\n                    G\u1EE2I \u00DD\r\n                    } @else {\r\n                    TIP\r\n                    }\r\n\r\n                </p>\r\n\r\n                <div>\r\n                    @if (lang === 'vi') {\r\n                    M\u1EABu x\u1EBFp ca l\u00E0 c\u00F4ng c\u1EE5 tr\u1EF1c quan v\u00E0 ti\u1EC7n l\u1EE3i gi\u00FAp ph\u00F2ng nh\u00E2n s\u1EF1 (HR) qu\u1EA3n l\u00FD v\u00E0 b\u1ED1 tr\u00ED ca l\u00E0m vi\u1EC7c\r\n                    cho nh\u00E2n vi\u00EAn m\u1ED9t c\u00E1ch hi\u1EC7u qu\u1EA3. M\u00E0n h\u00ECnh n\u00E0y \u0111\u01B0\u1EE3c thi\u1EBFt k\u1EBF \u0111\u1EC3 \u0111\u00E1p \u1EE9ng nhu c\u1EA7u l\u1EADp k\u1EBF ho\u1EA1ch c\u00F4ng\r\n                    vi\u1EC7c h\u00E0ng ng\u00E0y, h\u00E0ng tu\u1EA7n ho\u1EB7c theo chu k\u1EF3 c\u1EE5 th\u1EC3, \u0111\u1EA3m b\u1EA3o t\u00EDnh linh ho\u1EA1t v\u00E0 s\u1EF1 d\u1EC5 d\u00E0ng trong qu\u1EA3n\r\n                    l\u00FD.\r\n\r\n                    <p></p>\r\n                    <div class=\"square-before\">\r\n                        <b style='color: gray;'>X\u1EBFp ca theo m\u1EABu tu\u1EA7n (WEEK)</b>:\r\n                        Cho ph\u00E9p HR b\u1ED1 tr\u00ED ca l\u00E0m vi\u1EC7c d\u1EF1a tr\u00EAn c\u00E1c th\u1EE9 trong tu\u1EA7n, v\u00ED d\u1EE5: th\u1EE9 Hai, th\u1EE9 Ba, v.v. Ph\u00F9 h\u1EE3p\r\n                        cho\r\n                        nh\u1EEFng chu k\u1EF3 l\u00E0m vi\u1EC7c l\u1EB7p l\u1EA1i \u0111\u1ECBnh k\u1EF3 (v\u00ED d\u1EE5: l\u1ECBch l\u00E0m vi\u1EC7c tu\u1EA7n).\r\n                    </div>\r\n\r\n                    <p></p>\r\n                    <div class=\"square-before\">\r\n                        <b style='color: gray;'>X\u1EBFp ca theo chu\u1ED7i ng\u00E0y (DAYS)</b>:\r\n                        D\u00E0nh cho c\u00E1c tr\u01B0\u1EDDng h\u1EE3p x\u1EBFp ca kh\u00F4ng c\u1ED1 \u0111\u1ECBnh theo th\u1EE9 trong tu\u1EA7n m\u00E0 d\u1EF1a tr\u00EAn m\u1ED9t chu\u1ED7i ng\u00E0y li\u00EAn\r\n                        t\u1EE5c. HR c\u00F3 th\u1EC3 ch\u1EC9 \u0111\u1ECBnh b\u1EAFt \u0111\u1EA7u t\u1EEB ng\u00E0y b\u1EA5t k\u1EF3 v\u00E0 thi\u1EBFt l\u1EADp c\u00E1c ca l\u00E0m vi\u1EC7c t\u01B0\u01A1ng \u1EE9ng.\r\n                    </div>\r\n\r\n                    <p></p>\r\n                    <div class=\"square-before\">\r\n                        \u1EA4n F1 \u0111\u1EC3 c\u00F3 th\u00EAm chi ti\u1EBFt\r\n                    </div>\r\n                    } @else {\r\n                    Shift Scheduling Template is an intuitive and convenient tool to help HR departments effectively\r\n                    manage\r\n                    and assign work shifts for employees. This screen is designed to meet the needs of daily, weekly, or\r\n                    specific cycle-based work planning, ensuring flexibility and ease of management.\r\n\r\n                    <p></p>\r\n                    <div class=\"square-before\">\r\n                        <b style='color: gray;'>Schedule shifts by weekly pattern (WEEK)</b>:\r\n                        Allows HR to assign work shifts based on days of the week, e.g., Monday, Tuesday, etc. This is\r\n                        suitable for recurring work cycles (e.g., weekly schedules).\r\n                    </div>\r\n\r\n                    <p></p>\r\n                    <div class=\"square-before\">\r\n                        <b style='color: gray;'>Schedule shifts by sequence of days (DAYS)</b>:\r\n                        Designed for cases where shifts are assigned based on a continuous sequence of days rather than\r\n                        specific days of the week. HR can specify any start date and set up corresponding work shifts.\r\n                    </div>\r\n\r\n                    <p></p>\r\n                    <div class=\"square-before\">\r\n                        Press F1 for more details\r\n                    </div>\r\n                    }\r\n                </div>\r\n\r\n            </div>\r\n        </div>\r\n        }\r\n\r\n        @if (!!(atShiftPatternService.activePattern$ | async)) {\r\n        <div class=\"detail-block\">\r\n            <!-- <div class=\"tenant-settings\">\r\n                <div class=\"the-six-wrapper\" [appTooltip]=\"lang==='vi' ? 'C\u00E0i \u0111\u1EB7t th\u00EAm' : 'More settings'\"\r\n                    [showAnyway]=\"true\" (click)=\"toggleMoreSettings()\">\uD83C\uDFB2</div>\r\n            </div> -->\r\n            <div class=\"details-wrapper\">\r\n                <div class=\"details-title\">\r\n                    \u2728 {{ (atShiftPatternService.activePattern$ | async)?.code }}\r\n                </div>\r\n                <core-at-shift-pattern-detail [data$]=\"atShiftPatternService.activePattern$\"\r\n                    (onCellChange)=\"onCellChange($event)\"></core-at-shift-pattern-detail>\r\n            </div>\r\n        </div>\r\n        }\r\n\r\n        @if (showMoreSettings) {\r\n        <div @fadeSwitch class=\"more-settings-panel\">\r\n\r\n            <div class=\"alert alert-info small mt-2\" role=\"alert\">\r\n            @if (lang === 'vi') {\r\n                <p class=\"mb-0\">\r\n                C\u00E1c ng\u00E0y ngh\u1EC9 m\u1EB7c \u0111\u1ECBnh s\u1EBD \u0111\u01B0\u1EE3c \u00E1p d\u1EE5ng khi b\u1EA1n m\u1EDF m\u1ED9t m\u1EABu tu\u1EA7n ch\u01B0a c\u00F3 d\u1EEF li\u1EC7u.<br />\r\n                B\u1EA1n c\u00F3 th\u1EC3 ch\u1ECDn nh\u1EEFng ng\u00E0y th\u01B0\u1EDDng ngh\u1EC9 (v\u00ED d\u1EE5 Th\u1EE9 B\u1EA3y, Ch\u1EE7 Nh\u1EADt) v\u00E0 g\u00E1n ca \u201COFF\u201D cho c\u00E1c ng\u00E0y \u0111\u00F3.<br />\r\n                Thay \u0111\u1ED5i ch\u1EC9 \u0111\u01B0\u1EE3c l\u01B0u l\u1EA1i khi b\u1EA1n nh\u1EA5n n\u00FAt <strong>Save</strong> tr\u00EAn thanh c\u00F4ng c\u1EE5 c\u1EE7a trang.\r\n                </p>\r\n            } @else {\r\n                <p class=\"mb-0\">\r\n                Default off days are applied automatically when you open a weekly template that has no data yet.<br />\r\n                You can select the usual off days (e.g., Saturday, Sunday) and assign the \u201COFF\u201D shift to them.<br />\r\n                Changes will only be saved when you click <strong>Save</strong> in the page toolbar.\r\n                </p>\r\n            }\r\n            </div>\r\n\r\n            <div class=\"mb-2\">{{ lang === 'vi' ? 'Ng\u00E0y ngh\u1EC9 m\u1EB7c \u0111\u1ECBnh' : 'Default off days'}}</div>\r\n            <div class=\"mb-2\">\r\n                <core-sticker-collection [$items]=\"treatedAsOffDays\" [$shownFrom]=\"'weekday'\"\r\n                    [$initialChecked]=\"defaultTreatedAsOffDays || []\"\r\n                    ($checkedChange)=\"onTreatedAsOffDaysChange($event)\" />\r\n            </div>\r\n            <core-shift-cell [(ngModel)]=\"commonOffDayShiftCell\" />\r\n            <div class=\"d-flex d-flex-end\">\r\n                <div class=\"d-flex\">\r\n                    @if (loading) {\r\n                    <core-terminal-spinner />\r\n                    }\r\n                    <button class=\"btn btn-sm btn-primary me-2\" (click)=\"onMoreSettingsSave()\">Save</button>\r\n                    <button class=\"btn btn-sm btn-secondary\" (click)=\"onCloseMoreSettings()\">Close</button>\r\n                </div>\r\n            </div>\r\n        </div>\r\n        }\r\n\r\n    </div>\r\n\r\n\r\n    @if (!!loading) {\r\n    <app-fullscreen-modal-loader></app-fullscreen-modal-loader>\r\n    }\r\n\r\n    <ng-template #sticker let-code=\"context.status\">\r\n        <core-status-sticker [code]=\"code\" [isTrueCode]=\"true\"></core-status-sticker>\r\n    </ng-template>\r\n\r\n</div>", styles: [".core-at-shift-pattern-container .list-block{width:50vw}.core-at-shift-pattern-container .anim-container{height:calc(100vh - 60px);display:flex;align-items:flex-start;justify-content:flex-end}.core-at-shift-pattern-container .anim-block,.core-at-shift-pattern-container .detail-block{margin-left:15px;padding-top:50px;display:flex}.core-at-shift-pattern-container .anim-block{width:100%;flex-direction:column;align-items:center;justify-content:space-around}.core-at-shift-pattern-container .detail-block{position:relative;width:100%;align-items:flex-start;justify-content:center}.core-at-shift-pattern-container .details-wrapper{background-color:bisque;padding:0 15px 15px;width:100%;overflow-x:scroll;position:relative}.core-at-shift-pattern-container .details-wrapper .details-title{height:40px;display:flex;align-items:center;justify-content:flex-start;font-weight:700}.core-at-shift-pattern-container .details-wrapper .col-md-4{min-width:280px}.core-at-shift-pattern-container .content-wrapper{align-items:flex-start}.core-at-shift-pattern-container .more-settings-panel{font-size:13px;z-index:1;padding:15px;display:block;position:absolute;min-width:100px;min-height:100px;top:52px;right:2px;background-color:#fff;box-shadow:.4rem 0 2rem #0000002e}.core-at-shift-pattern-container .more-settings-panel .off-day-dropzone{background-color:bisque}\n"], dependencies: [{ kind: "pipe", type: AsyncPipe, name: "async" }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: CoreStickerCollectionComponent, selector: "core-sticker-collection", inputs: ["$items", "$shownFrom", "$tooltipFrom", "$initialChecked", "$showMore", "$showMoreTooltip", "$hideShowMoreIfNotSelected", "$enableFilter"], outputs: ["$checkedChange", "$onShowMore"] }, { kind: "component", type: CoreStatusStickerComponent, selector: "core-status-sticker", inputs: ["code", "caption", "width", "isTrueCode"] }, { kind: "component", type: CorePageListComponent, selector: "core-page-list", inputs: ["normalMode", "hideHeader", "hideButtonGroup", "seekerMode", "mccMode", "height", "headerWrap", "headerFirstRowHeight", "enableTimeZoneConverterForDateTimePeriodParameters", "showParamKit", "enableFilterKit", "datePeriodComparisonFor", "datePeriodComparisonForLabelKey", "statusInclusionFor", "statusInclusionForLabelKey", "statusOptionsApi", "statusOptions$", "showOrgParam", "showOrgParamDropdown", "hideGeneralSearch", "hideDatePeriodComparison", "hideStatusInclusion", "filterOperators$", "camelCaseDtoStatusIdField", "gridStatusColumn", "title", "hasIdOfStringType", "hideCheck", "apiDefinition", "columns", "useTheseColumns", "hideOrgTree", "frozen", "inlineTools", "inlineToolItems", "editRoute", "crud", "showListInlineTools", "top", "left", "hideLeft", "outerParam$", "outerFilter$", "outerSort", "outerFilterOperators", "outerInOperators", "autoResizeWithWindow", "extraManualOffset", "wrap", "rowHeight", "selfResolveCorePageHeaderButtonClick", "clearData$", "deleteValidateFn", "generateTemplateRequest", "importPreviewPath", "columnSearchDefaultOpen", "fixedPageSize", "disableDoubleClick", "noPaddingCell", "disableHighlightOnClick", "loading$", "excludedIds$", "disableDialogInformationLines", "changeTracking", "primaryKey", "changedItems$", "tabMode", "paramRows", "disableFilterHub", "autoColumnFitAvailableSpace", "ignoredDefaultActions", "checkboxExplicity", "auxOutletName", "forceReloadingFlag$"], outputs: ["corePageHeaderButtonClick", "rowClick", "rowDoubleClick", "selectedIdsChange", "selectedDataChange", "onInstanceCreated", "onInputFileBase64DataReady", "listChange"] }, { kind: "component", type: AtShiftPatternDetailComponent, selector: "core-at-shift-pattern-detail", inputs: ["data$"], outputs: ["onCellChange"] }, { kind: "component", type: FullscreenModalLoaderComponent, selector: "app-fullscreen-modal-loader", inputs: ["content"] }, { kind: "component", type: CoreShiftCellComponent, selector: "core-shift-cell", inputs: ["$readOnly", "$hideStarterPlusSign", "$hideStickersWhileDragover", "$backgroundColor"] }, { kind: "component", type: CoreTerminalSpinnerComponent, selector: "core-terminal-spinner" }, { kind: "component", type: CoreShiftCollectionComponent, selector: "core-shift-collection", inputs: ["height", "relativeMode"] }], animations: [
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.5", type: AtShiftPatternComponent, isStandalone: true, selector: "core-at-shift-pattern", viewQueries: [{ propertyName: "sticker", first: true, predicate: ["sticker"], descendants: true }], usesInheritance: true, ngImport: i0, template: "<div class=\"core-at-shift-pattern-container\">\r\n\r\n    <!-- <core-page-header [title]=\"title\" (buttonClick)=\"onCorePageHeaderButtonClick($event)\"></core-page-header> -->\r\n\r\n    @if (workShiftDndService.shiftCollectionOpen$ | async) {\r\n    <core-shift-collection [height]=\"(shiftCollectionHeight$ | async) || 800\"></core-shift-collection>\r\n    }\r\n\r\n    <div class=\"d-flex d-flex-between content-wrapper position-relative\">\r\n        <div class=\"list-block\">\r\n            <core-page-list [apiDefinition]=\"apiDefinition\" [columns]=\"columns\" [editRoute]=\"editRoute\" [crud]=\"crud\"\r\n                [title]=\"title\" [autoResizeWithWindow]=\"true\" [checkboxExplicity]=\"true\"\r\n                (listChange)=\"onListChange($event)\" (corePageHeaderButtonClick)=\"onCorePageHeaderButtonClick($event)\"\r\n                (onInstanceCreated)=\"onInstanceCreated($event)\" (rowClick)=\"rowClick($event)\"></core-page-list>\r\n        </div>\r\n\r\n        @if (!(atShiftPatternService.activePattern$ | async)) {\r\n        <div class=\"anim-block\">\r\n            <div class=\"alert is-success\">\r\n                <p class=\"alert-title\"><span class=\"ti-light-bulb\" aria-hidden=\"true\"></span>\r\n                    @if (lang === 'vi') {\r\n                    G\u1EE2I \u00DD\r\n                    } @else {\r\n                    TIP\r\n                    }\r\n\r\n                </p>\r\n\r\n                <div>\r\n                    @if (lang === 'vi') {\r\n                    M\u1EABu x\u1EBFp ca l\u00E0 c\u00F4ng c\u1EE5 tr\u1EF1c quan v\u00E0 ti\u1EC7n l\u1EE3i gi\u00FAp ph\u00F2ng nh\u00E2n s\u1EF1 (HR) qu\u1EA3n l\u00FD v\u00E0 b\u1ED1 tr\u00ED ca l\u00E0m vi\u1EC7c\r\n                    cho nh\u00E2n vi\u00EAn m\u1ED9t c\u00E1ch hi\u1EC7u qu\u1EA3. M\u00E0n h\u00ECnh n\u00E0y \u0111\u01B0\u1EE3c thi\u1EBFt k\u1EBF \u0111\u1EC3 \u0111\u00E1p \u1EE9ng nhu c\u1EA7u l\u1EADp k\u1EBF ho\u1EA1ch c\u00F4ng\r\n                    vi\u1EC7c h\u00E0ng ng\u00E0y, h\u00E0ng tu\u1EA7n ho\u1EB7c theo chu k\u1EF3 c\u1EE5 th\u1EC3, \u0111\u1EA3m b\u1EA3o t\u00EDnh linh ho\u1EA1t v\u00E0 s\u1EF1 d\u1EC5 d\u00E0ng trong qu\u1EA3n\r\n                    l\u00FD.\r\n\r\n                    <p></p>\r\n                    <div class=\"square-before\">\r\n                        <b style='color: gray;'>X\u1EBFp ca theo m\u1EABu tu\u1EA7n (WEEK)</b>:\r\n                        Cho ph\u00E9p HR b\u1ED1 tr\u00ED ca l\u00E0m vi\u1EC7c d\u1EF1a tr\u00EAn c\u00E1c th\u1EE9 trong tu\u1EA7n, v\u00ED d\u1EE5: th\u1EE9 Hai, th\u1EE9 Ba, v.v. Ph\u00F9 h\u1EE3p\r\n                        cho\r\n                        nh\u1EEFng chu k\u1EF3 l\u00E0m vi\u1EC7c l\u1EB7p l\u1EA1i \u0111\u1ECBnh k\u1EF3 (v\u00ED d\u1EE5: l\u1ECBch l\u00E0m vi\u1EC7c tu\u1EA7n).\r\n                    </div>\r\n\r\n                    <p></p>\r\n                    <div class=\"square-before\">\r\n                        <b style='color: gray;'>X\u1EBFp ca theo chu\u1ED7i ng\u00E0y (DAYS)</b>:\r\n                        D\u00E0nh cho c\u00E1c tr\u01B0\u1EDDng h\u1EE3p x\u1EBFp ca kh\u00F4ng c\u1ED1 \u0111\u1ECBnh theo th\u1EE9 trong tu\u1EA7n m\u00E0 d\u1EF1a tr\u00EAn m\u1ED9t chu\u1ED7i ng\u00E0y li\u00EAn\r\n                        t\u1EE5c. HR c\u00F3 th\u1EC3 ch\u1EC9 \u0111\u1ECBnh b\u1EAFt \u0111\u1EA7u t\u1EEB ng\u00E0y b\u1EA5t k\u1EF3 v\u00E0 thi\u1EBFt l\u1EADp c\u00E1c ca l\u00E0m vi\u1EC7c t\u01B0\u01A1ng \u1EE9ng.\r\n                    </div>\r\n\r\n                    <p></p>\r\n                    <div class=\"square-before\">\r\n                        \u1EA4n F1 \u0111\u1EC3 c\u00F3 th\u00EAm chi ti\u1EBFt\r\n                    </div>\r\n                    } @else {\r\n                    Shift Scheduling Template is an intuitive and convenient tool to help HR departments effectively\r\n                    manage\r\n                    and assign work shifts for employees. This screen is designed to meet the needs of daily, weekly, or\r\n                    specific cycle-based work planning, ensuring flexibility and ease of management.\r\n\r\n                    <p></p>\r\n                    <div class=\"square-before\">\r\n                        <b style='color: gray;'>Schedule shifts by weekly pattern (WEEK)</b>:\r\n                        Allows HR to assign work shifts based on days of the week, e.g., Monday, Tuesday, etc. This is\r\n                        suitable for recurring work cycles (e.g., weekly schedules).\r\n                    </div>\r\n\r\n                    <p></p>\r\n                    <div class=\"square-before\">\r\n                        <b style='color: gray;'>Schedule shifts by sequence of days (DAYS)</b>:\r\n                        Designed for cases where shifts are assigned based on a continuous sequence of days rather than\r\n                        specific days of the week. HR can specify any start date and set up corresponding work shifts.\r\n                    </div>\r\n\r\n                    <p></p>\r\n                    <div class=\"square-before\">\r\n                        Press F1 for more details\r\n                    </div>\r\n                    }\r\n                </div>\r\n\r\n            </div>\r\n        </div>\r\n        }\r\n\r\n        @if (!!(atShiftPatternService.activePattern$ | async)) {\r\n        <div class=\"detail-block\">\r\n            <!-- <div class=\"tenant-settings\">\r\n                <div class=\"the-six-wrapper\" [appTooltip]=\"lang==='vi' ? 'C\u00E0i \u0111\u1EB7t th\u00EAm' : 'More settings'\"\r\n                    [showAnyway]=\"true\" (click)=\"toggleMoreSettings()\">\uD83C\uDFB2</div>\r\n            </div> -->\r\n            <div class=\"details-wrapper\">\r\n                <div class=\"details-title\">\r\n                    \u2728 {{ (atShiftPatternService.activePattern$ | async)?.code }}\r\n                </div>\r\n                <core-at-shift-pattern-detail [data$]=\"atShiftPatternService.activePattern$\"\r\n                    (onCellChange)=\"onCellChange($event)\"></core-at-shift-pattern-detail>\r\n            </div>\r\n        </div>\r\n        }\r\n\r\n        @if (showMoreSettings) {\r\n        <div @fadeSwitch class=\"more-settings-panel\">\r\n\r\n            <div class=\"alert alert-info small mt-2\" role=\"alert\">\r\n            @if (lang === 'vi') {\r\n                <p class=\"mb-0\">\r\n                C\u00E1c ng\u00E0y ngh\u1EC9 m\u1EB7c \u0111\u1ECBnh s\u1EBD \u0111\u01B0\u1EE3c \u00E1p d\u1EE5ng khi b\u1EA1n m\u1EDF m\u1ED9t m\u1EABu tu\u1EA7n ch\u01B0a c\u00F3 d\u1EEF li\u1EC7u.<br />\r\n                B\u1EA1n c\u00F3 th\u1EC3 ch\u1ECDn nh\u1EEFng ng\u00E0y th\u01B0\u1EDDng ngh\u1EC9 (v\u00ED d\u1EE5 Th\u1EE9 B\u1EA3y, Ch\u1EE7 Nh\u1EADt) v\u00E0 g\u00E1n ca \u201COFF\u201D cho c\u00E1c ng\u00E0y \u0111\u00F3.<br />\r\n                Thay \u0111\u1ED5i ch\u1EC9 \u0111\u01B0\u1EE3c l\u01B0u l\u1EA1i khi b\u1EA1n nh\u1EA5n n\u00FAt <strong>Save</strong> tr\u00EAn thanh c\u00F4ng c\u1EE5 c\u1EE7a trang.\r\n                </p>\r\n            } @else {\r\n                <p class=\"mb-0\">\r\n                Default off days are applied automatically when you open a weekly template that has no data yet.<br />\r\n                You can select the usual off days (e.g., Saturday, Sunday) and assign the \u201COFF\u201D shift to them.<br />\r\n                Changes will only be saved when you click <strong>Save</strong> in the page toolbar.\r\n                </p>\r\n            }\r\n            </div>\r\n\r\n            <div class=\"mb-2\">{{ lang === 'vi' ? 'Ng\u00E0y ngh\u1EC9 m\u1EB7c \u0111\u1ECBnh' : 'Default off days'}}</div>\r\n            <div class=\"mb-2\">\r\n                <core-sticker-collection [$items]=\"treatedAsOffDays\" [$shownFrom]=\"'weekday'\"\r\n                    [$initialChecked]=\"defaultTreatedAsOffDays || []\"\r\n                    ($checkedChange)=\"onTreatedAsOffDaysChange($event)\" />\r\n            </div>\r\n            <core-shift-cell [(ngModel)]=\"commonOffDayShiftCell\" />\r\n            <div class=\"d-flex d-flex-end\">\r\n                <div class=\"d-flex\">\r\n                    @if (loading) {\r\n                    <core-terminal-spinner />\r\n                    }\r\n                    <button class=\"btn btn-sm btn-primary me-2\" (click)=\"onMoreSettingsSave()\">Save</button>\r\n                    <button class=\"btn btn-sm btn-secondary\" (click)=\"onCloseMoreSettings()\">Close</button>\r\n                </div>\r\n            </div>\r\n        </div>\r\n        }\r\n\r\n    </div>\r\n\r\n\r\n    @if (!!loading) {\r\n    <app-fullscreen-modal-loader></app-fullscreen-modal-loader>\r\n    }\r\n\r\n    <ng-template #sticker let-code=\"context.status\">\r\n        <core-status-sticker [code]=\"code\" [isTrueCode]=\"true\"></core-status-sticker>\r\n    </ng-template>\r\n\r\n</div>", styles: [".core-at-shift-pattern-container .list-block{width:50vw}.core-at-shift-pattern-container .anim-container{height:calc(100vh - 60px);display:flex;align-items:flex-start;justify-content:flex-end}.core-at-shift-pattern-container .anim-block,.core-at-shift-pattern-container .detail-block{margin-left:15px;padding-top:50px;display:flex}.core-at-shift-pattern-container .anim-block{width:100%;flex-direction:column;align-items:center;justify-content:space-around}.core-at-shift-pattern-container .detail-block{position:relative;width:100%;align-items:flex-start;justify-content:center}.core-at-shift-pattern-container .details-wrapper{background-color:bisque;padding:0 15px 15px;width:100%;overflow-x:scroll;position:relative}.core-at-shift-pattern-container .details-wrapper .details-title{height:40px;display:flex;align-items:center;justify-content:flex-start;font-weight:700}.core-at-shift-pattern-container .details-wrapper .col-md-4{min-width:280px}.core-at-shift-pattern-container .content-wrapper{align-items:flex-start}.core-at-shift-pattern-container .more-settings-panel{font-size:13px;z-index:1;padding:15px;display:block;position:absolute;min-width:100px;min-height:100px;top:52px;right:2px;background-color:#fff;box-shadow:.4rem 0 2rem #0000002e}.core-at-shift-pattern-container .more-settings-panel .off-day-dropzone{background-color:bisque}\n"], dependencies: [{ kind: "pipe", type: AsyncPipe, name: "async" }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: CoreStickerCollectionComponent, selector: "core-sticker-collection", inputs: ["$items", "$shownFrom", "$tooltipFrom", "$initialChecked", "$showMore", "$showMoreTooltip", "$hideShowMoreIfNotSelected", "$enableFilter"], outputs: ["$checkedChange", "$onShowMore"] }, { kind: "component", type: CoreStatusStickerComponent, selector: "core-status-sticker", inputs: ["code", "caption", "width", "isTrueCode"] }, { kind: "component", type: CorePageListComponent, selector: "core-page-list", inputs: ["normalMode", "hideHeader", "hideButtonGroup", "seekerMode", "mccMode", "height", "headerWrap", "headerFirstRowHeight", "enableTimeZoneConverterForDateTimePeriodParameters", "showParamKit", "enableFilterKit", "datePeriodComparisonFor", "datePeriodComparisonForLabelKey", "statusInclusionFor", "statusInclusionForLabelKey", "statusOptionsApi", "statusOptions$", "showOrgParam", "showOrgParamDropdown", "hideGeneralSearch", "hideDatePeriodComparison", "hideStatusInclusion", "filterOperators$", "camelCaseDtoStatusIdField", "gridStatusColumn", "title", "hasIdOfStringType", "hideCheck", "apiDefinition", "columns", "useTheseColumns", "hideOrgTree", "frozen", "inlineTools", "inlineToolItems", "editRoute", "crud", "showListInlineTools", "top", "left", "hideLeft", "outerParam$", "outerFilter$", "outerSort", "outerFilterOperators", "outerInOperators", "autoResizeWithWindow", "extraManualOffset", "wrap", "rowHeight", "selfResolveCorePageHeaderButtonClick", "clearData$", "deleteValidateFn", "generateTemplateRequest", "importPreviewPath", "columnSearchDefaultOpen", "fixedPageSize", "disableDoubleClick", "noPaddingCell", "disableHighlightOnClick", "loading$", "excludedIds$", "disableDialogInformationLines", "changeTracking", "primaryKey", "changedItems$", "tabMode", "paramRows", "disableFilterHub", "autoColumnFitAvailableSpace", "ignoredDefaultActions", "checkboxExplicity", "auxOutletName", "forceReloadingFlag$"], outputs: ["corePageHeaderButtonClick", "rowClick", "rowDoubleClick", "selectedIdsChange", "selectedDataChange", "onInstanceCreated", "onInputFileBase64DataReady", "listChange"] }, { kind: "component", type: AtShiftPatternDetailComponent, selector: "core-at-shift-pattern-detail", inputs: ["data$"], outputs: ["onCellChange"] }, { kind: "component", type: FullscreenModalLoaderComponent, selector: "app-fullscreen-modal-loader", inputs: ["content"] }, { kind: "component", type: CoreShiftCellComponent, selector: "core-shift-cell", inputs: ["$readOnly", "$hideStarterPlusSign", "$hideStickersWhileDragover", "$backgroundColor"] }, { kind: "component", type: CoreTerminalSpinnerComponent, selector: "core-terminal-spinner" }, { kind: "component", type: CoreShiftCollectionComponent, selector: "core-shift-collection", inputs: ["height", "disabled", "relativeMode"] }], animations: [
             trigger('fadeSwitch', [
                 state('visible', style({ opacity: 1 })),
                 state('hidden', style({ opacity: 0 })),
@@ -30576,7 +30588,7 @@ class AtWorksignComponent extends BaseComponent {
         }
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: AtWorksignComponent, deps: [{ token: MultiLanguageService }, { token: CoreButtonGroupService }, { token: OrganizationService }, { token: AppService }, { token: AtWorksignService }, { token: AlertService }, { token: CorePageListService }, { token: i1$1.Router }, { token: i1$1.ActivatedRoute }, { token: DialogService }, { token: WorkShiftDndService }, { token: CoreDatetimeService }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.5", type: AtWorksignComponent, isStandalone: true, selector: "core-at-worksign", viewQueries: [{ propertyName: "$shiftCells", predicate: ["shiftCell"], descendants: true, read: TemplateRef, isSignal: true }, { propertyName: "orgNameWithLock", first: true, predicate: ["orgNameWithLock"], descendants: true }], usesInheritance: true, ngImport: i0, template: "@if (!!$longTaskIsRunning()) {\r\n<core-api-progress></core-api-progress>\r\n}\r\n<div class=\"at-worksign-container\">\r\n\r\n  <!-- @if ($loading()) {\r\n  <app-fullscreen-modal-loader [content]=\"threeDots\"></app-fullscreen-modal-loader>\r\n  } -->\r\n\r\n  <core-page-list [top]=\"top\" [title]=\"title\" [apiDefinition]=\"apiDefinition\" [columns]=\"columns\"\r\n    [disableDoubleClick]=\"true\" [selfResolveCorePageHeaderButtonClick]=\"true\" [rowHeight]=\"'71px'\" [frozen]=\"2\"\r\n    [columnSearchDefaultOpen]=\"true\" [editRoute]=\"editRoute\" [crud]=\"crud\" [loading$]=\"loading$\" [normalMode]=\"true\"\r\n    [outerInOperators]=\"outerInOperators\" [outerParam$]=\"outerParam$\" [changeTracking]=\"true\"\r\n    [changedItems$]=\"changedItems$\" [outerFilterOperators]=\"$filterOperators()\" [extraManualOffset]=\"55\"\r\n    [fixedPageSize]=\"10\" [autoResizeWithWindow]=\"true\" (corePageHeaderButtonClick)=\"onCorePageHeaderButtonClick($event)\"\r\n    (rowDoubleClick)=\"onRowDoubleClick($event)\" (onInstanceCreated)=\"onListInstanceCreated($event)\"\r\n    [autoColumnFitAvailableSpace]=\"false\"></core-page-list>\r\n\r\n  @if (showShiftCollection) {\r\n  <core-shift-collection [height]=\"800\"></core-shift-collection>\r\n  }\r\n\r\n  <!-- @for (day of $visibleDays(); track $index) {\r\n  <ng-template #shiftCell let-context=\"context\" let-isLocked=\"context.isLocked\">\r\n    {{ context['shifts' + ($index + 1)] | json }}\r\n    <core-shift-cell [ngModel]=\"context['shifts' + ($index + 1)]\" [$readOnly]=\"isLocked\"\r\n      (ngModelChange)=\"onCellChange('shifts' + ($index + 1), $event, context)\"></core-shift-cell>\r\n  </ng-template>\r\n  } -->\r\n\r\n  @for (dateStr of $visibleDays(); track $index) {\r\n  <ng-template #shiftCell let-context=\"context\" let-isLocked=\"context.isLocked\">\r\n    <core-shift-cell [ngModel]=\"context.shiftMap?.[dateStr]\" [$readOnly]=\"isLocked\"\r\n      (ngModelChange)=\"onCellChange(dateStr, $event, context)\">\r\n    </core-shift-cell>\r\n  </ng-template>\r\n  }\r\n\r\n  <ng-template #threeDots>\r\n    <app-threedots></app-threedots>\r\n  </ng-template>\r\n\r\n  <ng-template #orgNameWithLock let-context=\"context\" let-orgName=\"context.orgName\" let-isLocked=\"context.isLocked\">\r\n    <div class=\"d-flex d-flex-start orgNameWrapper\" [htmlTooltip]=\"orgBranch\"\r\n      [tooltipContext]=\"{ orgId: context['orgId'] }\">\r\n      <div class=\"icon-wrapper\">\r\n        @if (!!isLocked) {\r\n        \uD83D\uDD12\r\n        <!-- <i class=\"feather-lock\"></i> -->\r\n        } @else {\r\n        \uD83D\uDD16\r\n        <!-- <i class=\"feather-bookmark\"></i> -->\r\n        }\r\n      </div>\r\n      <div class=\"org-name\">{{ orgName }}</div>\r\n    </div>\r\n  </ng-template>\r\n\r\n  <ng-template #orgBranch let-orgId=\"orgId\">\r\n    <core-org-branch [$currentId]=\"orgId\" />\r\n  </ng-template>\r\n\r\n  <ng-template #top>\r\n    <div class=\"d-flex d-flex-start mb15 pd5\">\r\n      <div class=\"param-wrapper w250 mr15\">\r\n        <div class=\"form-group vertical\">\r\n          <core-org-param [accessorMode]=\"orgParamAccessorMode\" [(ngModel)]=\"orgIds\"\r\n            (ngModelChange)=\"onOrgIdsChange($event)\"></core-org-param>\r\n        </div>\r\n      </div>\r\n      <div class=\"param-wrapper w150 mr15\">\r\n        <div class=\"form-group vertical\">\r\n          <core-month-selector [(ngModel)]=\"currentMonth\"\r\n            (ngModelChange)=\"onCurrentMonthChange($event)\"></core-month-selector>\r\n        </div>\r\n      </div>\r\n      <div class=\"param-wrapper w150 mr15\">\r\n        <div class=\"form-group vertical\">\r\n          <core-dropdown [paramMode]=\"true\" [(ngModel)]=\"subPeriodOption\"\r\n            (ngModelChange)=\"onSubPeriodOptionChange($event)\" [options$]=\"subPeriodOptions$\"\r\n            [getByIdObject$]=\"subPeriodGetByIdObject$\" [shownFrom]=\"''\" [clearDisable]=\"true\"\r\n            [fitHeightWithItemCount]=\"true\"></core-dropdown>\r\n        </div>\r\n      </div>\r\n      <div class=\"param-wrapper w150 mr15\">\r\n        <div class=\"form-group vertical\">\r\n          <div class=\"d-flex d-flex-around\">\r\n            @if (!fullPeriodMode) {\r\n            <div (click)=\"goPreviousSevenDays()\" [class.disabled]=\"$startDateString()===$startPeriodString()\"><i\r\n                class=\"feather-arrow-left fs24 color-gray pointer\"></i></div>\r\n            }\r\n            <h6 style=\"color: gray;\" class=\"h35 d-flex no-margin user-select-none\">{{ $startDate() | tableCell:\r\n              \"DATE_DDMM\"\r\n              :\r\n              lang }} - {{\r\n              $endDate() | tableCell: \"DATE_DDMM\" : lang }}</h6>\r\n            @if (!fullPeriodMode) {\r\n            <div (click)=\"goNextSevenDays()\" [class.disabled]=\"$endDateString()===$endPeriodString()\"><i\r\n                class=\"feather-arrow-right fs24 color-gray pointer\"></i></div>\r\n            }\r\n            @if ($loading()) {\r\n            <core-terminal-spinner />\r\n            }\r\n          </div>\r\n        </div>\r\n      </div>\r\n    </div>\r\n  </ng-template>\r\n\r\n</div>", styles: [".icon-wrapper{display:block;width:20px;height:20px}.icon-wrapper i{color:#d3d3d3;font-size:20px}.icon-wrapper i.feather-lock{color:#000}.org-name{display:block;margin-left:8px;width:100%;overflow:hidden;text-overflow:ellipsis}.pd5{padding:5px}.pointer{cursor:pointer}\n"], dependencies: [{ kind: "component", type: CoreShiftCellComponent, selector: "core-shift-cell", inputs: ["$readOnly", "$hideStarterPlusSign", "$hideStickersWhileDragover", "$backgroundColor"] }, { kind: "component", type: CoreTerminalSpinnerComponent, selector: "core-terminal-spinner" }, { kind: "component", type: CoreOrgBranchComponent, selector: "core-org-branch", inputs: ["$levelUp", "$currentId"] }, { kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: CorePageListComponent, selector: "core-page-list", inputs: ["normalMode", "hideHeader", "hideButtonGroup", "seekerMode", "mccMode", "height", "headerWrap", "headerFirstRowHeight", "enableTimeZoneConverterForDateTimePeriodParameters", "showParamKit", "enableFilterKit", "datePeriodComparisonFor", "datePeriodComparisonForLabelKey", "statusInclusionFor", "statusInclusionForLabelKey", "statusOptionsApi", "statusOptions$", "showOrgParam", "showOrgParamDropdown", "hideGeneralSearch", "hideDatePeriodComparison", "hideStatusInclusion", "filterOperators$", "camelCaseDtoStatusIdField", "gridStatusColumn", "title", "hasIdOfStringType", "hideCheck", "apiDefinition", "columns", "useTheseColumns", "hideOrgTree", "frozen", "inlineTools", "inlineToolItems", "editRoute", "crud", "showListInlineTools", "top", "left", "hideLeft", "outerParam$", "outerFilter$", "outerSort", "outerFilterOperators", "outerInOperators", "autoResizeWithWindow", "extraManualOffset", "wrap", "rowHeight", "selfResolveCorePageHeaderButtonClick", "clearData$", "deleteValidateFn", "generateTemplateRequest", "importPreviewPath", "columnSearchDefaultOpen", "fixedPageSize", "disableDoubleClick", "noPaddingCell", "disableHighlightOnClick", "loading$", "excludedIds$", "disableDialogInformationLines", "changeTracking", "primaryKey", "changedItems$", "tabMode", "paramRows", "disableFilterHub", "autoColumnFitAvailableSpace", "ignoredDefaultActions", "checkboxExplicity", "auxOutletName", "forceReloadingFlag$"], outputs: ["corePageHeaderButtonClick", "rowClick", "rowDoubleClick", "selectedIdsChange", "selectedDataChange", "onInstanceCreated", "onInputFileBase64DataReady", "listChange"] }, { kind: "component", type: CoreDropdownComponent, selector: "core-dropdown", inputs: ["getByIdObject$", "paramMode", "shownFrom", "options$", "height", "placeholder", "loading", "warningDisable", "clearDisable", "fitHeightWithItemCount", "itemHeight", "optionApiDriven", "optionApi", "optionHttpVerb", "optionHttpPayload", "optionValueFrom", "optionTextFrom"] }, { kind: "component", type: CoreOrgParamComponent, selector: "core-org-param", inputs: ["accessorMode"] }, { kind: "component", type: CoreMonthSelectorComponent, selector: "core-month-selector", inputs: ["align", "placeholder"], outputs: ["onYearClick"] }, { kind: "component", type: CoreShiftCollectionComponent, selector: "core-shift-collection", inputs: ["height", "relativeMode"] }, { kind: "pipe", type: TableCellPipe, name: "tableCell" }, { kind: "component", type: ThreedotsComponent, selector: "app-threedots" }, { kind: "component", type: CoreApiProgressComponent, selector: "core-api-progress", outputs: ["onClose"] }, { kind: "directive", type: HtmlTooltipDirective, selector: "[htmlTooltip]", inputs: ["htmlTooltip", "tooltipContext", "maxWidthUnset", "backgroundColor", "hold$"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.5", type: AtWorksignComponent, isStandalone: true, selector: "core-at-worksign", viewQueries: [{ propertyName: "$shiftCells", predicate: ["shiftCell"], descendants: true, read: TemplateRef, isSignal: true }, { propertyName: "orgNameWithLock", first: true, predicate: ["orgNameWithLock"], descendants: true }], usesInheritance: true, ngImport: i0, template: "@if (!!$longTaskIsRunning()) {\r\n<core-api-progress></core-api-progress>\r\n}\r\n<div class=\"at-worksign-container\">\r\n\r\n  <!-- @if ($loading()) {\r\n  <app-fullscreen-modal-loader [content]=\"threeDots\"></app-fullscreen-modal-loader>\r\n  } -->\r\n\r\n  <core-page-list [top]=\"top\" [title]=\"title\" [apiDefinition]=\"apiDefinition\" [columns]=\"columns\"\r\n    [disableDoubleClick]=\"true\" [selfResolveCorePageHeaderButtonClick]=\"true\" [rowHeight]=\"'71px'\" [frozen]=\"2\"\r\n    [columnSearchDefaultOpen]=\"true\" [editRoute]=\"editRoute\" [crud]=\"crud\" [loading$]=\"loading$\" [normalMode]=\"true\"\r\n    [outerInOperators]=\"outerInOperators\" [outerParam$]=\"outerParam$\" [changeTracking]=\"true\"\r\n    [changedItems$]=\"changedItems$\" [outerFilterOperators]=\"$filterOperators()\" [extraManualOffset]=\"55\"\r\n    [fixedPageSize]=\"10\" [autoResizeWithWindow]=\"true\" (corePageHeaderButtonClick)=\"onCorePageHeaderButtonClick($event)\"\r\n    (rowDoubleClick)=\"onRowDoubleClick($event)\" (onInstanceCreated)=\"onListInstanceCreated($event)\"\r\n    [autoColumnFitAvailableSpace]=\"false\"></core-page-list>\r\n\r\n  @if (showShiftCollection) {\r\n  <core-shift-collection [height]=\"800\"></core-shift-collection>\r\n  }\r\n\r\n  <!-- @for (day of $visibleDays(); track $index) {\r\n  <ng-template #shiftCell let-context=\"context\" let-isLocked=\"context.isLocked\">\r\n    {{ context['shifts' + ($index + 1)] | json }}\r\n    <core-shift-cell [ngModel]=\"context['shifts' + ($index + 1)]\" [$readOnly]=\"isLocked\"\r\n      (ngModelChange)=\"onCellChange('shifts' + ($index + 1), $event, context)\"></core-shift-cell>\r\n  </ng-template>\r\n  } -->\r\n\r\n  @for (dateStr of $visibleDays(); track $index) {\r\n  <ng-template #shiftCell let-context=\"context\" let-isLocked=\"context.isLocked\">\r\n    <core-shift-cell [ngModel]=\"context.shiftMap?.[dateStr]\" [$readOnly]=\"isLocked\"\r\n      (ngModelChange)=\"onCellChange(dateStr, $event, context)\">\r\n    </core-shift-cell>\r\n  </ng-template>\r\n  }\r\n\r\n  <ng-template #threeDots>\r\n    <app-threedots></app-threedots>\r\n  </ng-template>\r\n\r\n  <ng-template #orgNameWithLock let-context=\"context\" let-orgName=\"context.orgName\" let-isLocked=\"context.isLocked\">\r\n    <div class=\"d-flex d-flex-start orgNameWrapper\" [htmlTooltip]=\"orgBranch\"\r\n      [tooltipContext]=\"{ orgId: context['orgId'] }\">\r\n      <div class=\"icon-wrapper\">\r\n        @if (!!isLocked) {\r\n        \uD83D\uDD12\r\n        <!-- <i class=\"feather-lock\"></i> -->\r\n        } @else {\r\n        \uD83D\uDD16\r\n        <!-- <i class=\"feather-bookmark\"></i> -->\r\n        }\r\n      </div>\r\n      <div class=\"org-name\">{{ orgName }}</div>\r\n    </div>\r\n  </ng-template>\r\n\r\n  <ng-template #orgBranch let-orgId=\"orgId\">\r\n    <core-org-branch [$currentId]=\"orgId\" />\r\n  </ng-template>\r\n\r\n  <ng-template #top>\r\n    <div class=\"d-flex d-flex-start mb15 pd5\">\r\n      <div class=\"param-wrapper w250 mr15\">\r\n        <div class=\"form-group vertical\">\r\n          <core-org-param [accessorMode]=\"orgParamAccessorMode\" [(ngModel)]=\"orgIds\"\r\n            (ngModelChange)=\"onOrgIdsChange($event)\"></core-org-param>\r\n        </div>\r\n      </div>\r\n      <div class=\"param-wrapper w150 mr15\">\r\n        <div class=\"form-group vertical\">\r\n          <core-month-selector [(ngModel)]=\"currentMonth\"\r\n            (ngModelChange)=\"onCurrentMonthChange($event)\"></core-month-selector>\r\n        </div>\r\n      </div>\r\n      <div class=\"param-wrapper w150 mr15\">\r\n        <div class=\"form-group vertical\">\r\n          <core-dropdown [paramMode]=\"true\" [(ngModel)]=\"subPeriodOption\"\r\n            (ngModelChange)=\"onSubPeriodOptionChange($event)\" [options$]=\"subPeriodOptions$\"\r\n            [getByIdObject$]=\"subPeriodGetByIdObject$\" [shownFrom]=\"''\" [clearDisable]=\"true\"\r\n            [fitHeightWithItemCount]=\"true\"></core-dropdown>\r\n        </div>\r\n      </div>\r\n      <div class=\"param-wrapper w150 mr15\">\r\n        <div class=\"form-group vertical\">\r\n          <div class=\"d-flex d-flex-around\">\r\n            @if (!fullPeriodMode) {\r\n            <div (click)=\"goPreviousSevenDays()\" [class.disabled]=\"$startDateString()===$startPeriodString()\"><i\r\n                class=\"feather-arrow-left fs24 color-gray pointer\"></i></div>\r\n            }\r\n            <h6 style=\"color: gray;\" class=\"h35 d-flex no-margin user-select-none\">{{ $startDate() | tableCell:\r\n              \"DATE_DDMM\"\r\n              :\r\n              lang }} - {{\r\n              $endDate() | tableCell: \"DATE_DDMM\" : lang }}</h6>\r\n            @if (!fullPeriodMode) {\r\n            <div (click)=\"goNextSevenDays()\" [class.disabled]=\"$endDateString()===$endPeriodString()\"><i\r\n                class=\"feather-arrow-right fs24 color-gray pointer\"></i></div>\r\n            }\r\n            @if ($loading()) {\r\n            <core-terminal-spinner />\r\n            }\r\n          </div>\r\n        </div>\r\n      </div>\r\n    </div>\r\n  </ng-template>\r\n\r\n</div>", styles: [".icon-wrapper{display:block;width:20px;height:20px}.icon-wrapper i{color:#d3d3d3;font-size:20px}.icon-wrapper i.feather-lock{color:#000}.org-name{display:block;margin-left:8px;width:100%;overflow:hidden;text-overflow:ellipsis}.pd5{padding:5px}.pointer{cursor:pointer}\n"], dependencies: [{ kind: "component", type: CoreShiftCellComponent, selector: "core-shift-cell", inputs: ["$readOnly", "$hideStarterPlusSign", "$hideStickersWhileDragover", "$backgroundColor"] }, { kind: "component", type: CoreTerminalSpinnerComponent, selector: "core-terminal-spinner" }, { kind: "component", type: CoreOrgBranchComponent, selector: "core-org-branch", inputs: ["$levelUp", "$currentId"] }, { kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: CorePageListComponent, selector: "core-page-list", inputs: ["normalMode", "hideHeader", "hideButtonGroup", "seekerMode", "mccMode", "height", "headerWrap", "headerFirstRowHeight", "enableTimeZoneConverterForDateTimePeriodParameters", "showParamKit", "enableFilterKit", "datePeriodComparisonFor", "datePeriodComparisonForLabelKey", "statusInclusionFor", "statusInclusionForLabelKey", "statusOptionsApi", "statusOptions$", "showOrgParam", "showOrgParamDropdown", "hideGeneralSearch", "hideDatePeriodComparison", "hideStatusInclusion", "filterOperators$", "camelCaseDtoStatusIdField", "gridStatusColumn", "title", "hasIdOfStringType", "hideCheck", "apiDefinition", "columns", "useTheseColumns", "hideOrgTree", "frozen", "inlineTools", "inlineToolItems", "editRoute", "crud", "showListInlineTools", "top", "left", "hideLeft", "outerParam$", "outerFilter$", "outerSort", "outerFilterOperators", "outerInOperators", "autoResizeWithWindow", "extraManualOffset", "wrap", "rowHeight", "selfResolveCorePageHeaderButtonClick", "clearData$", "deleteValidateFn", "generateTemplateRequest", "importPreviewPath", "columnSearchDefaultOpen", "fixedPageSize", "disableDoubleClick", "noPaddingCell", "disableHighlightOnClick", "loading$", "excludedIds$", "disableDialogInformationLines", "changeTracking", "primaryKey", "changedItems$", "tabMode", "paramRows", "disableFilterHub", "autoColumnFitAvailableSpace", "ignoredDefaultActions", "checkboxExplicity", "auxOutletName", "forceReloadingFlag$"], outputs: ["corePageHeaderButtonClick", "rowClick", "rowDoubleClick", "selectedIdsChange", "selectedDataChange", "onInstanceCreated", "onInputFileBase64DataReady", "listChange"] }, { kind: "component", type: CoreDropdownComponent, selector: "core-dropdown", inputs: ["getByIdObject$", "paramMode", "shownFrom", "options$", "height", "placeholder", "loading", "warningDisable", "clearDisable", "fitHeightWithItemCount", "itemHeight", "optionApiDriven", "optionApi", "optionHttpVerb", "optionHttpPayload", "optionValueFrom", "optionTextFrom"] }, { kind: "component", type: CoreOrgParamComponent, selector: "core-org-param", inputs: ["accessorMode"] }, { kind: "component", type: CoreMonthSelectorComponent, selector: "core-month-selector", inputs: ["align", "placeholder"], outputs: ["onYearClick"] }, { kind: "component", type: CoreShiftCollectionComponent, selector: "core-shift-collection", inputs: ["height", "disabled", "relativeMode"] }, { kind: "pipe", type: TableCellPipe, name: "tableCell" }, { kind: "component", type: ThreedotsComponent, selector: "app-threedots" }, { kind: "component", type: CoreApiProgressComponent, selector: "core-api-progress", outputs: ["onClose"] }, { kind: "directive", type: HtmlTooltipDirective, selector: "[htmlTooltip]", inputs: ["htmlTooltip", "tooltipContext", "maxWidthUnset", "backgroundColor", "hold$"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: AtWorksignComponent, decorators: [{
             type: Component,
@@ -31574,7 +31586,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.5", ngImpor
 const hrmSchemaRoutes = [
     {
         path: '',
-        loadComponent: () => import('./ngx-histaff-alpha-hrm-schema.component-BEt_LyNb.mjs').then(m => m.HrmSchemaComponent)
+        loadComponent: () => import('./ngx-histaff-alpha-hrm-schema.component-DhcmippJ.mjs').then(m => m.HrmSchemaComponent)
     }
 ];
 
@@ -33747,7 +33759,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.5", ngImpor
 const simpleChatRoutes = [
     {
         path: '',
-        loadComponent: () => import('./ngx-histaff-alpha-simple-chat.component-pL0ykKNj.mjs').then(m => m.SimpleChatComponent)
+        loadComponent: () => import('./ngx-histaff-alpha-simple-chat.component-Da4H2k5o.mjs').then(m => m.SimpleChatComponent)
     }
 ];
 
@@ -36186,185 +36198,1922 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.5", ngImpor
                     ], template: "<div class=\"modal-container\">\r\n    <div class=\"modal-container-root\">\r\n        <div class=\"edit-container\">\r\n\r\n            <core-page-header [title]=\"'EDIT_ACTION_SVG_ICON'\" [hideButtonGroup]=\"true\"></core-page-header>\r\n\r\n            <div class=\"object-property w-100 fw700 color-gray\">\r\n                <div>{{ id }} <span> \u2022 </span> {{ code }} <span> \u2022 </span> {{ (code || '') | translate: lang }} </div>\r\n            </div>\r\n\r\n            <div class=\"h15\"></div>\r\n\r\n            <div class=\"d-flex d-flex-between\">\r\n\r\n                <div class=\"entry\">\r\n                    <div class=\"label\">Enter Svg element here:</div>\r\n                    <textarea class=\"form-control\" [(ngModel)]=\"svg\" [rows]=\"'10'\"\r\n                        [ngStyle]=\"{ height: 'unset'}\"></textarea>\r\n                </div>\r\n                <div class=\"preview d-flex d-flex-v d-flex-between\">\r\n                    <div class=\"label\">Preview:</div>\r\n                    <div class=\"preview-icon\" [innerHtml]=\"svg | stringHtml\">\r\n\r\n                    </div>\r\n                </div>\r\n\r\n            </div>\r\n\r\n            <div class=\"h15\"></div>\r\n            <div class=\"d-flex d-flex-end\">\r\n                <core-button-group-vns [showCaption]=\"true\" [forHeader]=\"false\" (buttonClick)=\"onButtonClick($event)\"\r\n                    [shownItems]=\"buttonItems\" class=\"buttonGroupCustom\"></core-button-group-vns>\r\n            </div>\r\n        </div>\r\n    </div>\r\n</div>", styles: [".edit-container{width:800px;height:400px;padding:0 15px 15px;background-color:#fff}.edit-container .entry{width:655px}.edit-container .preview{width:100px;height:100px}\n"] }]
         }], ctorParameters: () => [{ type: MultiLanguageService }, { type: ActionService }, { type: AppService }, { type: AlertService }] });
 
-class CorePaginationComponent {
-    constructor() {
-        this.$currentPage = input.required();
-        this.$height = input.required();
-        this.$pageCount = input.required();
-        this.$loading = input.required();
-        this.$suspendCurrentPageSubscription = input();
-        this.$showAdd = input();
-        this.$background = input();
-        this.$fixedPageSize = input();
-        this.$onClickAdd = output();
-        this.$container = viewChild('container');
-        this.$current = viewChild('current');
-        this.$aperture = viewChild('aperture');
-        this.$currentButtonContent = signal('1');
-        this.$suspendCurrentPage = signal(true);
-        this.$navigationDirection = signal(1);
-        this.subscriptions = [];
-    }
-    ngOnInit() { }
-    goFirst() {
-        this.$navigationDirection.set(-1);
-        this.$suspendCurrentPage.set(false);
-        setTimeout(() => {
-            if (!!this.$pageCount())
-                this.$currentPage().next(1);
-            this.$aperture()?.nativeElement.style.setProperty('animation-name', 'rotatebackwards');
-        });
-    }
-    goLast() {
-        this.$navigationDirection.set(1);
-        this.$suspendCurrentPage.set(false);
-        setTimeout(() => {
-            if (!!this.$pageCount())
-                this.$currentPage().next(this.$pageCount());
-            this.$aperture()?.nativeElement.style.setProperty('animation-name', 'rotateforwards');
-        });
+const COM_MOKEUP_DATA = [
+    {
+        "id": 2,
+        "name": "Hanoi Office Test",
+        "parentId": 1,
+        "orderNum": 99999,
+        "protected": false,
+        "level": null,
+        "code": "HOT",
+        "isActive": true
+    },
+    {
+        "id": 3,
+        "name": "Corporate Group ",
+        "parentId": 2,
+        "orderNum": 99999,
+        "protected": false,
+        "level": null,
+        "code": "CG",
+        "isActive": true
+    },
+    {
+        "id": 4,
+        "name": "BACKEND_ONLY.HU_ORGANIZATION.NAME.TI",
+        "parentId": 2,
+        "orderNum": 99999,
+        "protected": false,
+        "level": null,
+        "code": "TI",
+        "isActive": true
+    },
+    {
+        "id": 5,
+        "name": "Project and Investment",
+        "parentId": 2,
+        "orderNum": 99999,
+        "protected": false,
+        "level": null,
+        "code": "PI",
+        "isActive": true
+    },
+    {
+        "id": 6,
+        "name": "Treasury & Accounting Department",
+        "parentId": 3,
+        "orderNum": 99999,
+        "protected": false,
+        "level": null,
+        "code": "TA",
+        "isActive": true
+    },
+    {
+        "id": 7,
+        "name": "Legal &Risk Management department",
+        "parentId": 3,
+        "orderNum": 99999,
+        "protected": false,
+        "level": null,
+        "code": "LR",
+        "isActive": true
+    },
+    {
+        "id": 8,
+        "name": "Corporate Planning & Coordination department",
+        "parentId": 3,
+        "orderNum": 99999,
+        "protected": false,
+        "level": null,
+        "code": "CC",
+        "isActive": true
+    },
+    {
+        "id": 9,
+        "name": "Administration and Planning department",
+        "parentId": 3,
+        "orderNum": 99999,
+        "protected": false,
+        "level": null,
+        "code": "Admin",
+        "isActive": true
+    },
+    {
+        "id": 10,
+        "name": "Da Nang Office",
+        "parentId": 3,
+        "orderNum": 99999,
+        "protected": false,
+        "level": null,
+        "code": "DN",
+        "isActive": true
+    },
+    {
+        "id": 11,
+        "name": "Ha Noi Iron, Steel & Non-ferrous Metal department",
+        "parentId": 4,
+        "orderNum": 99999,
+        "protected": false,
+        "level": null,
+        "code": "IS",
+        "isActive": true
+    },
+    {
+        "id": 12,
+        "name": "Ha Noi Chemicals, Plastics and Mineral Resources department\n",
+        "parentId": 4,
+        "orderNum": 99999,
+        "protected": false,
+        "level": null,
+        "code": "HNC",
+        "isActive": true
+    },
+    {
+        "id": 13,
+        "name": "Mineral Resources department",
+        "parentId": 4,
+        "orderNum": 99999,
+        "protected": false,
+        "level": null,
+        "code": "MR",
+        "isActive": true
+    },
+    {
+        "id": 14,
+        "name": "BACKEND_ONLY.HU_ORGANIZATION.NAME.TP",
+        "parentId": 5,
+        "orderNum": 99999,
+        "protected": false,
+        "level": null,
+        "code": "TP",
+        "isActive": true
+    },
+    {
+        "id": 15,
+        "name": "Automotive Department Business ",
+        "parentId": 5,
+        "orderNum": 99999,
+        "protected": false,
+        "level": null,
+        "code": "ADB",
+        "isActive": true
+    },
+    {
+        "id": 16,
+        "name": "Environment & Infrastructure Project Business department\n",
+        "parentId": 5,
+        "orderNum": 99999,
+        "protected": false,
+        "level": null,
+        "code": "EIPB",
+        "isActive": true
+    },
+    {
+        "id": 17,
+        "name": "Power Infrastructure Business department",
+        "parentId": 5,
+        "orderNum": 99999,
+        "protected": false,
+        "level": null,
+        "code": "PIB",
+        "isActive": true
+    },
+    {
+        "id": 18,
+        "name": "General Director",
+        "parentId": 3,
+        "orderNum": 99999,
+        "protected": false,
+        "level": null,
+        "code": "GD",
+        "isActive": true
+    },
+    {
+        "id": 30,
+        "name": "Ho Chi Minh Office",
+        "parentId": 1,
+        "orderNum": 99999,
+        "protected": false,
+        "level": null,
+        "code": "A",
+        "isActive": true
+    },
+    {
+        "id": 31,
+        "name": "Corporate Group",
+        "parentId": 30,
+        "orderNum": 99999,
+        "protected": false,
+        "level": null,
+        "code": "B",
+        "isActive": true
+    },
+    {
+        "id": 32,
+        "name": "Metal, Chemical, Natural Resources & Living-related Business Group",
+        "parentId": 30,
+        "orderNum": 99999,
+        "protected": false,
+        "level": null,
+        "code": "C",
+        "isActive": true
+    },
+    {
+        "id": 33,
+        "name": "Project & Machinery Group",
+        "parentId": 30,
+        "orderNum": 99999,
+        "protected": false,
+        "level": null,
+        "code": "D",
+        "isActive": true
+    },
+    {
+        "id": 43,
+        "name": "Administration and Planning department ",
+        "parentId": 31,
+        "orderNum": 99999,
+        "protected": false,
+        "level": null,
+        "code": "43",
+        "isActive": true
+    },
+    {
+        "id": 44,
+        "name": "Treasury & Accounting Department",
+        "parentId": 31,
+        "orderNum": 99999,
+        "protected": false,
+        "level": null,
+        "code": "E",
+        "isActive": true
+    },
+    {
+        "id": 45,
+        "name": "Legal & Risk Management Department",
+        "parentId": 31,
+        "orderNum": 99999,
+        "protected": false,
+        "level": null,
+        "code": "CZ",
+        "isActive": true
+    },
+    {
+        "id": 46,
+        "name": "BACKEND_ONLY.HU_ORGANIZATION.NAME.TUBULARS PRODUCTS DEPT.",
+        "parentId": 32,
+        "orderNum": 99999,
+        "protected": false,
+        "level": null,
+        "code": "F",
+        "isActive": true
+    },
+    {
+        "id": 47,
+        "name": "Iron, Steel & Non-Ferrous Metal Dept",
+        "parentId": 32,
+        "orderNum": 99999,
+        "protected": false,
+        "level": null,
+        "code": "G",
+        "isActive": true
+    },
+    {
+        "id": 48,
+        "name": "Energy Dept.",
+        "parentId": 32,
+        "orderNum": 99999,
+        "protected": false,
+        "level": null,
+        "code": "H",
+        "isActive": true
+    },
+    {
+        "id": 49,
+        "name": "Chemicals and Plastics Dept",
+        "parentId": 32,
+        "orderNum": 99999,
+        "protected": false,
+        "level": null,
+        "code": "I",
+        "isActive": true
+    },
+    {
+        "id": 50,
+        "name": "Media, Food, Materials & Real Estate dept\n",
+        "parentId": 32,
+        "orderNum": 99999,
+        "protected": false,
+        "level": null,
+        "code": "J",
+        "isActive": true
+    },
+    {
+        "id": 51,
+        "name": "Transportation Project Dept",
+        "parentId": 33,
+        "orderNum": 99999,
+        "protected": false,
+        "level": null,
+        "code": "K",
+        "isActive": true
+    },
+    {
+        "id": 52,
+        "name": "Power Infrastructure Business Dept.",
+        "parentId": 33,
+        "orderNum": 99999,
+        "protected": false,
+        "level": null,
+        "code": "L",
+        "isActive": true
+    },
+    {
+        "id": 2111,
+        "name": "Corporate Planning and Coordination Department",
+        "parentId": 31,
+        "orderNum": 99999,
+        "protected": false,
+        "level": null,
+        "code": "CPC",
+        "isActive": true
+    },
+    {
+        "id": 2131,
+        "name": "Corporate Group test",
+        "parentId": 3,
+        "orderNum": 99999,
+        "protected": false,
+        "level": null,
+        "code": "81",
+        "isActive": true
+    },
+    {
+        "id": 2132,
+        "name": "phòng kiểm thử 34",
+        "parentId": 1,
+        "orderNum": 99999,
+        "protected": false,
+        "level": null,
+        "code": "PKT34",
+        "isActive": true
+    },
+    {
+        "id": 22146,
+        "name": "Hanoi Office",
+        "parentId": 22145,
+        "orderNum": 99999,
+        "protected": false,
+        "level": null,
+        "code": "HNIZZ",
+        "isActive": true
+    },
+    {
+        "id": 22147,
+        "name": "Business Development Department",
+        "parentId": 22146,
+        "orderNum": 99999,
+        "protected": false,
+        "level": null,
+        "code": "BDD",
+        "isActive": true
+    },
+    {
+        "id": 22148,
+        "name": "Corporate Group ",
+        "parentId": 22146,
+        "orderNum": 99999,
+        "protected": false,
+        "level": null,
+        "code": "CU",
+        "isActive": true
+    },
+    {
+        "id": 22149,
+        "name": "Human Resources Department",
+        "parentId": 22148,
+        "orderNum": 99999,
+        "protected": false,
+        "level": null,
+        "code": "HRD",
+        "isActive": true
+    },
+    {
+        "id": 22150,
+        "name": "Corporate Services Department",
+        "parentId": 22148,
+        "orderNum": 99999,
+        "protected": false,
+        "level": null,
+        "code": "CSD",
+        "isActive": true
+    },
+    {
+        "id": 22151,
+        "name": "Treasury & Accounting Department",
+        "parentId": 22148,
+        "orderNum": 99999,
+        "protected": false,
+        "level": null,
+        "code": "T&AD",
+        "isActive": true
+    },
+    {
+        "id": 22152,
+        "name": "Legal & Risk Department",
+        "parentId": 22148,
+        "orderNum": 99999,
+        "protected": false,
+        "level": null,
+        "code": "L&RD",
+        "isActive": true
+    },
+    {
+        "id": 22153,
+        "name": "Infrastructure, Automotive, Energy & Urban Business Group",
+        "parentId": 22146,
+        "orderNum": 99999,
+        "protected": false,
+        "level": null,
+        "code": "IAE&UBG",
+        "isActive": true
+    },
+    {
+        "id": 22154,
+        "name": "Automotive Business Department",
+        "parentId": 22153,
+        "orderNum": 99999,
+        "protected": false,
+        "level": null,
+        "code": "ABD",
+        "isActive": true
+    },
+    {
+        "id": 22155,
+        "name": "Energy Department",
+        "parentId": 22153,
+        "orderNum": 99999,
+        "protected": false,
+        "level": null,
+        "code": "ED",
+        "isActive": true
+    },
+    {
+        "id": 22156,
+        "name": "Energy Innovation Initiatives Department",
+        "parentId": 22153,
+        "orderNum": 99999,
+        "protected": false,
+        "level": null,
+        "code": "EIID",
+        "isActive": true
+    },
+    {
+        "id": 22157,
+        "name": "Power Infrastructure Business department",
+        "parentId": 22153,
+        "orderNum": 99999,
+        "protected": false,
+        "level": null,
+        "code": "PIBD",
+        "isActive": true
+    },
+    {
+        "id": 22158,
+        "name": "Social Infrastructure, Transportation & Urban Business Department",
+        "parentId": 22153,
+        "orderNum": 99999,
+        "protected": false,
+        "level": null,
+        "code": "SIT&UBD",
+        "isActive": true
+    },
+    {
+        "id": 22159,
+        "name": "Lifestyle & Chemicals Group",
+        "parentId": 22146,
+        "orderNum": 99999,
+        "protected": false,
+        "level": null,
+        "code": "L&CG",
+        "isActive": true
+    },
+    {
+        "id": 22160,
+        "name": "Lifestyle & Retail Business Department",
+        "parentId": 22159,
+        "orderNum": 99999,
+        "protected": false,
+        "level": null,
+        "code": "L&RBD",
+        "isActive": true
+    },
+    {
+        "id": 22161,
+        "name": "Chemicals & Plastics Department",
+        "parentId": 22159,
+        "orderNum": 99999,
+        "protected": false,
+        "level": null,
+        "code": "C&PD",
+        "isActive": true
+    },
+    {
+        "id": 22162,
+        "name": "Steel & Mineral Resources Group",
+        "parentId": 22146,
+        "orderNum": 99999,
+        "protected": false,
+        "level": null,
+        "code": "S&MRG",
+        "isActive": true
+    },
+    {
+        "id": 22163,
+        "name": "Hanoi Steel & Non-ferrous Department",
+        "parentId": 22162,
+        "orderNum": 99999,
+        "protected": false,
+        "level": null,
+        "code": "HS&ND",
+        "isActive": true
+    },
+    {
+        "id": 22164,
+        "name": "Ho Chi Minh City Office",
+        "parentId": 22145,
+        "orderNum": 99999,
+        "protected": false,
+        "level": null,
+        "code": "HMCZZ",
+        "isActive": true
+    },
+    {
+        "id": 22165,
+        "name": "Business Development Department",
+        "parentId": 22164,
+        "orderNum": 99999,
+        "protected": false,
+        "level": null,
+        "code": "BD",
+        "isActive": true
+    },
+    {
+        "id": 22166,
+        "name": "Infrastructure, Automotive, Energy & Urban Business Group",
+        "parentId": 22164,
+        "orderNum": 99999,
+        "protected": false,
+        "level": null,
+        "code": "IAE&UB",
+        "isActive": true
+    },
+    {
+        "id": 22167,
+        "name": "Lifestyle & Chemicals Group",
+        "parentId": 22164,
+        "orderNum": 99999,
+        "protected": false,
+        "level": null,
+        "code": "L&C",
+        "isActive": true
+    },
+    {
+        "id": 22168,
+        "name": "Steel & Mineral Resources Group",
+        "parentId": 22164,
+        "orderNum": 99999,
+        "protected": false,
+        "level": null,
+        "code": "S&MR",
+        "isActive": true
+    },
+    {
+        "id": 22169,
+        "name": "Automotive Business Department",
+        "parentId": 22166,
+        "orderNum": 99999,
+        "protected": false,
+        "level": null,
+        "code": "AB",
+        "isActive": true
+    },
+    {
+        "id": 22170,
+        "name": "Energy Department",
+        "parentId": 22166,
+        "orderNum": 99999,
+        "protected": false,
+        "level": null,
+        "code": "EU",
+        "isActive": true
+    },
+    {
+        "id": 22171,
+        "name": "Energy Innovation Initiatives Department",
+        "parentId": 22166,
+        "orderNum": 99999,
+        "protected": false,
+        "level": null,
+        "code": "EII",
+        "isActive": true
+    },
+    {
+        "id": 22172,
+        "name": "Social Infrastructure, Transportation & Urban Business Department",
+        "parentId": 22166,
+        "orderNum": 99999,
+        "protected": false,
+        "level": null,
+        "code": "SIT&UB",
+        "isActive": true
+    },
+    {
+        "id": 22173,
+        "name": "Chemicals & Plastics Department",
+        "parentId": 22167,
+        "orderNum": 99999,
+        "protected": false,
+        "level": null,
+        "code": "C&P",
+        "isActive": true
+    },
+    {
+        "id": 22174,
+        "name": "Digital & Food Related Department",
+        "parentId": 22167,
+        "orderNum": 99999,
+        "protected": false,
+        "level": null,
+        "code": "D&FRD",
+        "isActive": true
+    },
+    {
+        "id": 22175,
+        "name": "HCMC Steel & Non-ferrous",
+        "parentId": 22168,
+        "orderNum": 99999,
+        "protected": false,
+        "level": null,
+        "code": "HS&N",
+        "isActive": true
+    },
+    {
+        "id": 22176,
+        "name": "Tubular Products Department",
+        "parentId": 22168,
+        "orderNum": 99999,
+        "protected": false,
+        "level": null,
+        "code": "TPD",
+        "isActive": true
+    },
+    {
+        "id": 22177,
+        "name": "Energy Department",
+        "parentId": 5,
+        "orderNum": 99999,
+        "protected": false,
+        "level": null,
+        "code": "EDB",
+        "isActive": true
+    },
+    {
+        "id": 22178,
+        "name": "rtyrt",
+        "parentId": 2134,
+        "orderNum": 99999,
+        "protected": false,
+        "level": null,
+        "code": "R",
+        "isActive": true
+    },
+    {
+        "id": 22179,
+        "name": "vp test test",
+        "parentId": 1,
+        "orderNum": 99999,
+        "protected": false,
+        "level": null,
+        "code": "VTT",
+        "isActive": true
+    },
+    {
+        "id": 22180,
+        "name": "hưng yên ofice",
+        "parentId": 22145,
+        "orderNum": 99999,
+        "protected": false,
+        "level": null,
+        "code": "HYO",
+        "isActive": false
+    },
+    {
+        "id": 22181,
+        "name": "hy city",
+        "parentId": 22179,
+        "orderNum": 99999,
+        "protected": false,
+        "level": null,
+        "code": "HC",
+        "isActive": true
+    },
+    {
+        "id": 22182,
+        "name": "122",
+        "parentId": 22147,
+        "orderNum": 99999,
+        "protected": false,
+        "level": null,
+        "code": "122",
+        "isActive": true
+    },
+    {
+        "id": 22183,
+        "name": "247",
+        "parentId": 22145,
+        "orderNum": 99999,
+        "protected": false,
+        "level": null,
+        "code": "247",
+        "isActive": false
+    },
+    {
+        "id": 22184,
+        "name": "247",
+        "parentId": 22183,
+        "orderNum": 99999,
+        "protected": false,
+        "level": null,
+        "code": "66",
+        "isActive": false
+    },
+    {
+        "id": 22185,
+        "name": "zalo",
+        "parentId": 22183,
+        "orderNum": 99999,
+        "protected": false,
+        "level": null,
+        "code": "Z",
+        "isActive": false
+    },
+    {
+        "id": 22186,
+        "name": "vp testet",
+        "parentId": 12139,
+        "orderNum": 99999,
+        "protected": false,
+        "level": null,
+        "code": "VT",
+        "isActive": true
+    },
+    {
+        "id": 22187,
+        "name": "văn phòng Đà Nẵng",
+        "parentId": 22164,
+        "orderNum": 99999,
+        "protected": false,
+        "level": null,
+        "code": "Đà Nẵng office",
+        "isActive": false
+    },
+    {
+        "id": 22188,
+        "name": "VĂn Phòng miền nam",
+        "parentId": 22145,
+        "orderNum": 99999,
+        "protected": false,
+        "level": null,
+        "code": "Miền Nam office",
+        "isActive": false
+    },
+    {
+        "id": 2134,
+        "name": "Văn phòng Hà Nội",
+        "parentId": 1,
+        "orderNum": 99999,
+        "protected": false,
+        "level": null,
+        "code": "VPHN",
+        "isActive": true
+    },
+    {
+        "id": 12134,
+        "name": "Văn phòng Hà nội 2 ",
+        "parentId": 2134,
+        "orderNum": 99999,
+        "protected": false,
+        "level": null,
+        "code": "VPHN2",
+        "isActive": true
+    },
+    {
+        "id": 12135,
+        "name": "BACKEND_ONLY.HU_ORGANIZATION.NAME.TEST",
+        "parentId": 1,
+        "orderNum": 99999,
+        "protected": false,
+        "level": null,
+        "code": "T",
+        "isActive": false
+    },
+    {
+        "id": 12136,
+        "name": "Phòng Development",
+        "parentId": 1,
+        "orderNum": 99999,
+        "protected": false,
+        "level": null,
+        "code": "PD",
+        "isActive": false
+    },
+    {
+        "id": 12137,
+        "name": "Nhóm thực tập sinh BA",
+        "parentId": 2132,
+        "orderNum": 99999,
+        "protected": false,
+        "level": null,
+        "code": "NTTSB",
+        "isActive": false
+    },
+    {
+        "id": 12138,
+        "name": "Cá nhân ",
+        "parentId": 12137,
+        "orderNum": 99999,
+        "protected": false,
+        "level": null,
+        "code": "CN",
+        "isActive": false
+    },
+    {
+        "id": 12139,
+        "name": "Văn phòng Test",
+        "parentId": 1,
+        "orderNum": 99999,
+        "protected": false,
+        "level": null,
+        "code": "VPT",
+        "isActive": true
+    },
+    {
+        "id": 12140,
+        "name": "Phòng BA Test 1",
+        "parentId": 12139,
+        "orderNum": 99999,
+        "protected": false,
+        "level": null,
+        "code": "PBT1",
+        "isActive": false
+    },
+    {
+        "id": 12141,
+        "name": "Phòng BA Test 2",
+        "parentId": 12139,
+        "orderNum": 99999,
+        "protected": false,
+        "level": null,
+        "code": "PBT2",
+        "isActive": false
+    },
+    {
+        "id": 12142,
+        "name": "Phòng BA Test 3",
+        "parentId": 12139,
+        "orderNum": 99999,
+        "protected": false,
+        "level": null,
+        "code": "PBT3",
+        "isActive": false
+    },
+    {
+        "id": 12143,
+        "name": "BACKEND_ONLY.HU_ORGANIZATION.NAME.TEST 1",
+        "parentId": 12139,
+        "orderNum": 99999,
+        "protected": false,
+        "level": null,
+        "code": "T1",
+        "isActive": false
+    },
+    {
+        "id": 12146,
+        "name": "Văn phòng Test 2",
+        "parentId": 1,
+        "orderNum": 99999,
+        "protected": false,
+        "level": null,
+        "code": "VPT2",
+        "isActive": false
+    },
+    {
+        "id": 12147,
+        "name": "TEST KK",
+        "parentId": 1,
+        "orderNum": 99999,
+        "protected": false,
+        "level": null,
+        "code": "TK",
+        "isActive": false
+    },
+    {
+        "id": 12149,
+        "name": "Tester 3",
+        "parentId": 12146,
+        "orderNum": 99999,
+        "protected": false,
+        "level": null,
+        "code": "T3",
+        "isActive": false
+    },
+    {
+        "id": 12150,
+        "name": "Tester 4",
+        "parentId": 12146,
+        "orderNum": 99999,
+        "protected": false,
+        "level": null,
+        "code": "T4",
+        "isActive": false
+    },
+    {
+        "id": 12151,
+        "name": "Tester 5",
+        "parentId": 12146,
+        "orderNum": 99999,
+        "protected": false,
+        "level": null,
+        "code": "T5",
+        "isActive": false
+    },
+    {
+        "id": 12152,
+        "name": "vp test 1",
+        "parentId": 1,
+        "orderNum": 99999,
+        "protected": false,
+        "level": null,
+        "code": "VT1",
+        "isActive": false
+    },
+    {
+        "id": 12155,
+        "name": "Group A",
+        "parentId": 12139,
+        "orderNum": 99999,
+        "protected": false,
+        "level": null,
+        "code": "GA",
+        "isActive": false
+    },
+    {
+        "id": 12156,
+        "name": "vp thuongtest 3",
+        "parentId": 2,
+        "orderNum": 99999,
+        "protected": false,
+        "level": null,
+        "code": "VT3",
+        "isActive": false
+    },
+    {
+        "id": 12158,
+        "name": "vp thuongtest 2",
+        "parentId": 1,
+        "orderNum": 99999,
+        "protected": false,
+        "level": null,
+        "code": "VT2",
+        "isActive": false
+    },
+    {
+        "id": 12159,
+        "name": "vp thuong test 3",
+        "parentId": 1,
+        "orderNum": 99999,
+        "protected": false,
+        "level": null,
+        "code": "VTT3",
+        "isActive": true
+    },
+    {
+        "id": 12160,
+        "name": "Phong ban test data",
+        "parentId": 1,
+        "orderNum": 99999,
+        "protected": false,
+        "level": null,
+        "code": "PBTD",
+        "isActive": false
+    },
+    {
+        "id": 22144,
+        "name": "Testing K 1",
+        "parentId": 12159,
+        "orderNum": 99999,
+        "protected": false,
+        "level": null,
+        "code": "TK1",
+        "isActive": true
+    },
+    {
+        "id": 22145,
+        "name": "Sumitomo Corporation Vietnam LLC",
+        "parentId": null,
+        "orderNum": 2,
+        "protected": false,
+        "level": null,
+        "code": "SCVL",
+        "isActive": true
+    },
+    {
+        "id": 2133,
+        "name": "Phòng ba 1",
+        "parentId": 2132,
+        "orderNum": 2,
+        "protected": false,
+        "level": null,
+        "code": "PB1",
+        "isActive": true
+    },
+    {
+        "id": 1,
+        "name": "SCVN",
+        "parentId": null,
+        "orderNum": 1,
+        "protected": false,
+        "level": null,
+        "code": "S",
+        "isActive": true
     }
-    goPrevious() {
-        this.$navigationDirection.set(-1);
-        this.$suspendCurrentPage.set(false);
-        setTimeout(() => {
-            if (!!this.$pageCount())
-                this.$currentPage().next(this.$currentPage().value - 1);
-            this.$aperture()?.nativeElement.style.setProperty('animation-name', 'rotatebackwards');
+];
+
+class ComPartyService {
+    constructor(recursiveService, alertService) {
+        this.recursiveService = recursiveService;
+        this.alertService = alertService;
+        this.instances = [];
+        this.loading = true;
+        this.comTreeData$ = new BehaviorSubject([]);
+        this.comTreeDataWithPeople$ = new BehaviorSubject([]);
+        this.linerData$ = new BehaviorSubject([]);
+        this.buildTreeFlag$ = new BehaviorSubject(false);
+        this.status$ = new BehaviorSubject({
+            selectedKey: undefined,
+            activeKeys: [],
+            checkedKeys: [],
+            expandedKeys: [],
+            checkInheritance: true
         });
-    }
-    goNext() {
-        this.$navigationDirection.set(1);
-        this.$suspendCurrentPage.set(false);
-        setTimeout(() => {
-            if (!!this.$pageCount())
-                this.$currentPage().next(this.$currentPage().value + 1);
-            this.$aperture()?.nativeElement.style.setProperty('animation-name', 'rotateforwards');
+        this.linerData$.subscribe(xs => {
+            const idCountMap = new Map();
+            xs.forEach(item => {
+                const id = item.id;
+                idCountMap.set(id, (idCountMap.get(id) ?? 0) + 1);
+            });
+            const duplicates = Array.from(idCountMap.entries())
+                .filter(([_, count]) => count > 1)
+                .map(([id]) => id);
+            if (!!duplicates.length) {
+                if (isDevMode()) {
+                    alertService.error('🔁 Duplicate IDs: ' + duplicates.reduce((a, c) => a + ";" + c, ''), alertOptions);
+                }
+            }
         });
     }
-    onClickAddLocal() {
-        this.$onClickAdd.emit();
-    }
-    ngAfterViewInit() {
-        setTimeout(() => {
-            this.subscriptions.push(this.$currentPage().subscribe(x => this.$currentButtonContent.set(x.toString())));
-            this.mouseDownStream$ = fromEvent(this.$current().nativeElement, 'mousedown', _ => {
-                this.$currentButtonContent.set(`${this.$currentPage().value}/${this.$pageCount()}`);
-            });
-            this.touchStartStream$ = fromEvent(this.$current().nativeElement, 'touchstart', _ => {
-                this.$currentButtonContent.set(`${this.$currentPage().value}/${this.$pageCount()}`);
+    buildComTreeData(status = {
+        selectedKey: undefined,
+        activeKeys: [],
+        checkedKeys: [],
+        expandedKeys: [],
+        checkInheritance: true
+    }) {
+        this.loading = true;
+        const cloneCopy = JSON.parse(JSON.stringify(this.linerData$.value));
+        if (typeof Worker !== 'undefined') {
+            // Create a new
+            console.log("🟢🟢 Worker works");
+            const worker = new Worker(liner_to_nested_array_script);
+            worker.addEventListener('message', ({ data }) => {
+                const newData = data.list;
+                this.comTreeData$.next(newData);
+                this.loading = false;
             });
-            this.mouseUpStream$ = fromEvent(this.$current().nativeElement, 'mouseup', _ => {
-                this.$currentButtonContent.set(`${this.$currentPage().value}`);
+            worker.postMessage({
+                list: cloneCopy,
+                keyField: 'id',
+                titleField: 'name',
+                parentField: 'parentId',
+                activeField: 'active',
+                checkedField: 'checked',
+                expandedField: 'expand',
+                status
             });
-            this.touchEndStream$ = fromEvent(this.$current().nativeElement, 'touchend', _ => {
-                this.$currentButtonContent.set(`${this.$currentPage().value}`);
+        }
+        else {
+            // Web workers are not supported in this environment.
+            // You should add a fallback so that your program still executes correctly.
+            this.recursiveService
+                .linerArrayToNestedArray(cloneCopy, 'id', 'name', 'parentId', 'active', 'checked', 'expand', status)
+                .subscribe((obj) => {
+                const newData = obj.list;
+                this.comTreeData$.next(newData);
+                this.loading = false;
             });
-            this.mouseDownSubscription$ = this.mouseDownStream$.subscribe();
-            this.touchStartSubscription$ = this.touchStartStream$.subscribe();
-            this.mouseUpSubscription$ = this.mouseUpStream$.subscribe();
-            this.touchEndSubscription$ = this.touchEndStream$.subscribe();
-            if (this.$background())
-                setTimeout(() => this.$container().nativeElement.style.setProperty('--bg', this.$background()));
-            if (this.$height())
-                this.$container()?.nativeElement.style.setProperty('--height', this.$height() + 'px');
-        });
+        }
     }
-    ngOnDestroy() {
-        if (this.mouseDownSubscription$)
-            this.mouseDownSubscription$.unsubscribe();
-        if (this.touchStartSubscription$)
-            this.touchStartSubscription$.unsubscribe();
-        if (this.mouseUpSubscription$)
-            this.mouseUpSubscription$.unsubscribe();
-        if (this.touchEndSubscription$)
-            this.touchEndSubscription$.unsubscribe();
+    getComLinearData(userId) {
+        return of({
+            ok: true,
+            status: 200,
+            body: {
+                statusCode: 200,
+                innerBody: COM_MOKEUP_DATA
+            }
+        });
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: CorePaginationComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.5", type: CorePaginationComponent, isStandalone: true, selector: "core-pagination", inputs: { $currentPage: { classPropertyName: "$currentPage", publicName: "$currentPage", isSignal: true, isRequired: true, transformFunction: null }, $height: { classPropertyName: "$height", publicName: "$height", isSignal: true, isRequired: true, transformFunction: null }, $pageCount: { classPropertyName: "$pageCount", publicName: "$pageCount", isSignal: true, isRequired: true, transformFunction: null }, $loading: { classPropertyName: "$loading", publicName: "$loading", isSignal: true, isRequired: true, transformFunction: null }, $suspendCurrentPageSubscription: { classPropertyName: "$suspendCurrentPageSubscription", publicName: "$suspendCurrentPageSubscription", isSignal: true, isRequired: false, transformFunction: null }, $showAdd: { classPropertyName: "$showAdd", publicName: "$showAdd", isSignal: true, isRequired: false, transformFunction: null }, $background: { classPropertyName: "$background", publicName: "$background", isSignal: true, isRequired: false, transformFunction: null }, $fixedPageSize: { classPropertyName: "$fixedPageSize", publicName: "$fixedPageSize", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { $onClickAdd: "$onClickAdd" }, viewQueries: [{ propertyName: "$container", first: true, predicate: ["container"], descendants: true, isSignal: true }, { propertyName: "$current", first: true, predicate: ["current"], descendants: true, isSignal: true }, { propertyName: "$aperture", first: true, predicate: ["aperture"], descendants: true, isSignal: true }], ngImport: i0, template: "<div #container class=\"pagination-container d-flex-between\">\r\n    <div class=\"pagination-container\">\r\n        <div class=\"first\" [class.disable]=\"!$pageCount() || $currentPage().value===1\" (click)=\"goFirst()\"></div>\r\n        <div class=\"previous\" [class.disable]=\"!$pageCount() || $currentPage().value===1\" (click)=\"goPrevious()\"></div>\r\n        <div #current class=\"current\">\r\n            <div class=\"d-flex-center\">\r\n                <i #aperture class=\"feather-aperture aperture \" [class.visible]=\"$loading()\"></i>\r\n                @if (!$loading()) {\r\n                    <span class=\"current-text\">{{ $currentButtonContent() }}</span>\r\n                }\r\n            </div>\r\n        </div>\r\n        <div class=\"next\" [class.disable]=\"!$pageCount() || ($currentPage() | async)===$pageCount()\" (click)=\"goNext()\"></div>\r\n        <div class=\"last\" [class.disable]=\"!$pageCount() || ($currentPage() | async)===$pageCount()\" (click)=\"goLast()\"></div>\r\n    </div>\r\n    @if ($showAdd()) {\r\n        <a (click)=\"onClickAddLocal()\">\r\n            <div class=\"add\"></div>\r\n        </a>\r\n    }\r\n</div>", styles: [".pagination-container{--bg: #848484;--color: white;--height: 38px;--button-size: 50px;--font-size: 18px;--aperture-size: 30px}@keyframes rotateforwards{0%{transform:rotate(0)}to{transform:rotate(360deg)}}@keyframes rotatebackwards{0%{transform:rotate(0)}to{transform:rotate(-360deg)}}.pagination-container .add:before{font-family:feather;content:\"\\e9b1\";font-weight:700;font-size:var(--font-size);color:#fff;background:var(--bg);width:var(--button-size);height:var(--button-size);display:flex;align-items:center;justify-content:center;border-top-right-radius:50%;border-bottom-right-radius:50%}.pagination-container .pagination-container{height:var(--height);display:flex}.pagination-container .pagination-container>div{display:inline-block;cursor:pointer;margin-right:2px}.pagination-container .pagination-container .disable{cursor:default;opacity:.5!important}.pagination-container .pagination-container .current{border-radius:50%;margin:0 5px;opacity:1;transition:2s}.pagination-container .pagination-container .aperture{width:var(--aperture-size);height:var(--aperture-size);opacity:0;transition:.25s ease-out;animation:rotateforwards 1s linear infinite}.pagination-container .pagination-container .aperture:before{font-size:var(--aperture-size)}.pagination-container .pagination-container .visible{opacity:1;transition:.25s ease-out}.pagination-container .pagination-container .current,.pagination-container .pagination-container .loading{width:var(--button-size);height:var(--button-size);background:var(--bg);color:var(--color)}.pagination-container .pagination-container .current-text{position:absolute}.pagination-container .pagination-container .current>div{width:var(--button-size);height:var(--button-size);display:flex;align-items:center;justify-content:center}.pagination-container .pagination-container div:before{font-family:feather;font-size:var(--font-size);width:var(--button-size);height:var(--button-size);background:var(--bg);color:var(--color);display:flex;align-items:center;justify-content:center}.pagination-container .pagination-container .first:before{content:\"\\e933\"}.pagination-container .pagination-container .previous:before{content:\"\\e92f\"}.pagination-container .pagination-container .next:before{content:\"\\e930\"}.pagination-container .pagination-container .last:before{content:\"\\e934\"}\n"], dependencies: [{ kind: "pipe", type: AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: ComPartyService, deps: [{ token: RecursiveService }, { token: AlertService }], target: i0.ɵɵFactoryTarget.Injectable }); }
+    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: ComPartyService, providedIn: 'root' }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: CorePaginationComponent, decorators: [{
-            type: Component,
-            args: [{ selector: 'core-pagination', changeDetection: ChangeDetectionStrategy.OnPush, imports: [
-                        NgStyle,
-                        AsyncPipe,
-                    ], template: "<div #container class=\"pagination-container d-flex-between\">\r\n    <div class=\"pagination-container\">\r\n        <div class=\"first\" [class.disable]=\"!$pageCount() || $currentPage().value===1\" (click)=\"goFirst()\"></div>\r\n        <div class=\"previous\" [class.disable]=\"!$pageCount() || $currentPage().value===1\" (click)=\"goPrevious()\"></div>\r\n        <div #current class=\"current\">\r\n            <div class=\"d-flex-center\">\r\n                <i #aperture class=\"feather-aperture aperture \" [class.visible]=\"$loading()\"></i>\r\n                @if (!$loading()) {\r\n                    <span class=\"current-text\">{{ $currentButtonContent() }}</span>\r\n                }\r\n            </div>\r\n        </div>\r\n        <div class=\"next\" [class.disable]=\"!$pageCount() || ($currentPage() | async)===$pageCount()\" (click)=\"goNext()\"></div>\r\n        <div class=\"last\" [class.disable]=\"!$pageCount() || ($currentPage() | async)===$pageCount()\" (click)=\"goLast()\"></div>\r\n    </div>\r\n    @if ($showAdd()) {\r\n        <a (click)=\"onClickAddLocal()\">\r\n            <div class=\"add\"></div>\r\n        </a>\r\n    }\r\n</div>", styles: [".pagination-container{--bg: #848484;--color: white;--height: 38px;--button-size: 50px;--font-size: 18px;--aperture-size: 30px}@keyframes rotateforwards{0%{transform:rotate(0)}to{transform:rotate(360deg)}}@keyframes rotatebackwards{0%{transform:rotate(0)}to{transform:rotate(-360deg)}}.pagination-container .add:before{font-family:feather;content:\"\\e9b1\";font-weight:700;font-size:var(--font-size);color:#fff;background:var(--bg);width:var(--button-size);height:var(--button-size);display:flex;align-items:center;justify-content:center;border-top-right-radius:50%;border-bottom-right-radius:50%}.pagination-container .pagination-container{height:var(--height);display:flex}.pagination-container .pagination-container>div{display:inline-block;cursor:pointer;margin-right:2px}.pagination-container .pagination-container .disable{cursor:default;opacity:.5!important}.pagination-container .pagination-container .current{border-radius:50%;margin:0 5px;opacity:1;transition:2s}.pagination-container .pagination-container .aperture{width:var(--aperture-size);height:var(--aperture-size);opacity:0;transition:.25s ease-out;animation:rotateforwards 1s linear infinite}.pagination-container .pagination-container .aperture:before{font-size:var(--aperture-size)}.pagination-container .pagination-container .visible{opacity:1;transition:.25s ease-out}.pagination-container .pagination-container .current,.pagination-container .pagination-container .loading{width:var(--button-size);height:var(--button-size);background:var(--bg);color:var(--color)}.pagination-container .pagination-container .current-text{position:absolute}.pagination-container .pagination-container .current>div{width:var(--button-size);height:var(--button-size);display:flex;align-items:center;justify-content:center}.pagination-container .pagination-container div:before{font-family:feather;font-size:var(--font-size);width:var(--button-size);height:var(--button-size);background:var(--bg);color:var(--color);display:flex;align-items:center;justify-content:center}.pagination-container .pagination-container .first:before{content:\"\\e933\"}.pagination-container .pagination-container .previous:before{content:\"\\e92f\"}.pagination-container .pagination-container .next:before{content:\"\\e930\"}.pagination-container .pagination-container .last:before{content:\"\\e934\"}\n"] }]
-        }], ctorParameters: () => [] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: ComPartyService, decorators: [{
+            type: Injectable,
+            args: [{
+                    providedIn: 'root'
+                }]
+        }], ctorParameters: () => [{ type: RecursiveService }, { type: AlertService }] });
 
-class CoreCompareDbPipelineComponent extends BaseComponent {
-    constructor(mls, appService) {
-        super(mls);
+class CoreComTreeComponent extends CoreFormControlBaseComponent {
+    writeValue(obj) {
+        this.value = obj;
+        switch (this.accessorMode) {
+            case EnumCoreOrgTreeaAccessorMode.CHECKED:
+                if (!!obj) {
+                    const checkedKeys = [];
+                    this.checkedIds = obj; // <=== 24/10/2023
+                    obj.map(x => checkedKeys.push(x.toString()));
+                    this.loading = true;
+                    this.recursiveService.writeValueChecked(checkedKeys, this.data, this.disabledLoopExpand).subscribe(_ => {
+                        this.loading = false;
+                        if (!!this.data && !!this.data?.length)
+                            this.data[0].tree$Expanded = true;
+                    });
+                }
+                break;
+            case EnumCoreOrgTreeaAccessorMode.ACTIVATED_SINGLE:
+            case EnumCoreOrgTreeaAccessorMode.ACTIVATED_INHERITANCE:
+                if (!!obj) {
+                    const activatedKeys = [];
+                    obj.map(x => activatedKeys.push(x.toString()));
+                    this.loading = true;
+                    this.recursiveService.writeValueActivated(activatedKeys, this.data, this.disabledLoopExpand).subscribe(_ => {
+                        this.loading = false;
+                        if (!!this.data && !!this.data?.length)
+                            this.data[0].tree$Expanded = true;
+                    });
+                }
+                break;
+            default:
+                break;
+        }
+        if (this.accessorMode === EnumCoreOrgTreeaAccessorMode.CHECKED) {
+        }
+        else /* EnumCoreOrgTreeaAccessorMode.ACTIVATED_SINGLE or EnumCoreOrgTreeaAccessorMode.ACTIVATED_INHERITANCE */ {
+        }
+    }
+    setDisabledState(disabled) {
+        this.disabled = disabled;
+    }
+    constructor(
+    //public override injector: Injector,
+    authService, recursiveService, mls, layoutService, coreOrgTreeService, 
+    // private coreOrgTreeState: CoreOrgTreeState,
+    alertService, comPartyService) {
+        super( /*injector*/);
+        this.authService = authService;
+        this.recursiveService = recursiveService;
         this.mls = mls;
-        this.appService = appService;
-        this.data = [];
-        this.tabHeaders = ["Dev-Test-Live", "Dev-Extended"];
-        this.activeTabIndex = 0;
-        this.columns = [
-            {
-                field: 'id',
-                type: 'string',
-                caption: 'id',
-                align: 'left',
-                hidden: true,
-                width: 0
-            },
-            {
-                field: 'difference',
-                type: 'string',
-                caption: 'Problem',
-                align: 'left',
-                sortDisabled: true,
-                width: 300
-            },
-            {
-                field: 'conflictType',
-                type: 'string',
-                caption: 'Marker',
-                align: 'center',
-                width: 50
-            },
-            {
-                field: 'sourceAlias',
-                type: 'string',
-                caption: 'Source',
-                align: 'left',
-                sortDisabled: true,
-                width: 60
-            },
-            {
-                field: 'targetAlias',
-                type: 'string',
-                caption: 'Target',
-                align: 'left',
-                sortDisabled: true,
-                width: 200
-            },
-            {
-                field: 'tableName',
-                type: 'string',
-                caption: 'Table',
-                align: 'left',
-                sortDisabled: true,
-                width: 200
-            },
-            {
-                field: 'columnName',
-                type: 'string',
-                caption: 'Column',
-                align: 'left',
-                sortDisabled: true,
-                width: 200
-            },
-            {
-                field: 'sourceType',
-                type: 'string',
-                caption: 'Source type',
-                align: 'left',
-                sortDisabled: true,
-                width: 100
-            },
-            {
-                field: 'sourceIsPrimaryKey',
+        this.layoutService = layoutService;
+        this.coreOrgTreeService = coreOrgTreeService;
+        this.alertService = alertService;
+        this.comPartyService = comPartyService;
+        this.lineColor = 'transparent';
+        this.accessorMode = EnumCoreOrgTreeaAccessorMode.CHECKED;
+        //TO BE NEW
+        this.searchMode = EnumCoreOrgTreeaSearchMode.REDUCE;
+        this.excludedIds$ = new BehaviorSubject([]); // 2024-05-10: to be implemented
+        this.stateIsolated$ = new BehaviorSubject(false);
+        this.itemDoubleClick = new EventEmitter();
+        this.itemClick = new EventEmitter();
+        this.showSearch = false;
+        this.hiddenToolClickStream$ = new BehaviorSubject('');
+        this.value = [];
+        this.appConfigService = inject(AppConfigService);
+        this.activeIds = [];
+        this.checkedIds = [];
+        this.subscriptions = [];
+        this.search$ = new Subject();
+        this.searchPlaceholder = "Tìm kiếm...";
+        this.checkInheritance = true; // default value is true
+        this.showDissolved = false; // default value is false
+        this.initializing = true;
+        // this.reduced$ = this.coreOrgTreeState.coreOrgTreeReduced$;
+        this.initializing = false;
+    }
+    ngOnChanges(changes) {
+        if (changes['height']) {
+            this.resizeHeight();
+        }
+    }
+    ngOnInit() {
+        super.register();
+        //this.layoutService.leftbarOpen$.next(false);
+        this.instanceNumber = new Date().getTime();
+        const newInstance = {
+            instanceNumber: this.instanceNumber,
+            selectedKey$: new BehaviorSubject(undefined),
+            activeKeys$: new BehaviorSubject([]),
+            checkedKeys$: new BehaviorSubject([]),
+            expandedKeys$: new BehaviorSubject([]),
+            checkInheritance$: new BehaviorSubject(true)
+        };
+        this.comPartyService.instances.push(newInstance);
+        // Check xem chiều cao height có được truyền vào hay không
+        if (this.height === undefined) {
+            if (isDevMode()) {
+                //this.alertService.warn("CoreOrgTree không nhận được chiều cao (height) truyền vào từ lớp ngoài. Chiều cao mặc định sẽ được tính toán dựa vào bố cục chính.", alertOptions);
+            }
+            this.subscriptions.push(this.layoutService.contentContainerHeight$.subscribe(x => {
+                // basicSpacing là paddingBottom của lớp content-container
+                this.height = x - this.layoutService.corePageHeaderHeight - this.layoutService.basicSpacing;
+            }));
+        }
+        this.subscriptions.push(this.comPartyService.linerData$.subscribe((x) => this.linearComArray = x));
+        this.subscriptions.push(this.comPartyService.buildTreeFlag$.pipe(skip(1)).subscribe(_ => {
+            this.buildComTreeData();
+        }));
+        this.subscriptions.push(this.stateIsolated$.subscribe(x => {
+            if (x) {
+                if (!!this.statusSubscription) {
+                    this.statusSubscription.unsubscribe();
+                }
+            }
+            else {
+                if (!this.statusSubscription) {
+                    this.statusSubscription = this.comPartyService.status$.subscribe((x) => {
+                        console.log("this.organizationService.status$ changes", x);
+                        const newActiveIds = [];
+                        x.activeKeys.map((k) => {
+                            newActiveIds.push(Number(k));
+                        });
+                        this.activeIds = newActiveIds;
+                        if (this.accessorMode !== EnumCoreOrgTreeaAccessorMode.CHECKED) {
+                            this.value = this.activeIds;
+                            this.onChange(this.activeIds);
+                        }
+                        this.selectedKey = x.selectedKey;
+                    });
+                }
+            }
+        }));
+        this.subscriptions.push(this.coreOrgTreeService.showSearch$.subscribe(x => this.showSearch = x));
+        this.subscriptions.push(this.hiddenToolClickStream$.pipe(buffer(this.hiddenToolClickStream$.pipe(debounceTime(250))), map$1(clicks => clicks.length), filter(clicksLength => clicksLength >= 5))
+            .subscribe(_ => {
+            this.coreOrgTreeService.showSearch$.next(!this.coreOrgTreeService.showSearch$.value);
+        }));
+        this.subscriptions.push(this.search$
+            .pipe(filter((x) => x !== null), debounceTime(500), distinctUntilChanged(), switchMap((text) => {
+            console.log('switchMap works');
+            this.loading = true;
+            // AUG 2024 NEW : MUST BE TESTED
+            if (this.searchMode === EnumCoreOrgTreeaSearchMode.HIGHLIGHT) {
+                return this.recursiveService.findItem(text, this.data);
+            }
+            else {
+                return of(this.recursiveService.reducingFilter(this.scrollContainer, text));
+            }
+        }))
+            .subscribe((x) => {
+            this.loading = false;
+            // if (this.searchMode === EnumCoreOrgTreeaSearchMode.REDUCE) {
+            //   this.dataFiltered = x as IOrgTreeItem[];
+            // }
+        }));
+        this.subscriptions.push(this.comPartyService.status$
+            .pipe(filter((value) => !!!this.initializing && !!value))
+            .subscribe((x) => {
+            if (!!localStorage) {
+                localStorage.setItem('coreOrgTreeStatus', JSON.stringify(x));
+            }
+        }));
+        this.subscriptions.push(this.mls.lang$.subscribe((x) => (this.lang = x)));
+    }
+    buildComTree(comLinerData) {
+        if (!this.appConfigService.FEDERATION_COM_PARTY_ENABLED)
+            return;
+        this.comPartyService.linerData$.next(comLinerData);
+        const cloneCopy = JSON.parse(JSON.stringify(comLinerData));
+        console.group("comLinerData...", comLinerData);
+        if (!!comLinerData) {
+            if (typeof Worker !== 'undefined') {
+                console.log('🟢 Worker works');
+                // Create a new
+                const worker = new Worker(liner_to_nested_array_script);
+                worker.addEventListener("message", ({ data }) => {
+                    console.log("ComTreeData calculation finished!", new Date().getTime());
+                    this.comPartyService.loading = false;
+                    this.comPartyService.comTreeData$.next(data.list);
+                    this.comPartyService.linerData$.next(data.rawList);
+                });
+                console.log("ComTreeData is being calculated by Worker...");
+                console.log("this.comPartyService.status$.value", this.comPartyService.status$.value);
+                worker.postMessage({
+                    list: cloneCopy,
+                    keyField: 'id',
+                    titleField: 'name',
+                    parentField: 'parentId',
+                    activeField: 'active',
+                    checkedField: 'checked',
+                    expandedField: 'expanded',
+                    status: this.comPartyService.status$.value, // <=== this had been already retrieved on app-initialization
+                    orderBy: 'orderNum'
+                });
+            }
+            else {
+                // Web workers are not supported in this environment.
+                // You should add a fallback so that your program still executes correctly.
+                console.log("this.comPartyService.status$.value", this.comPartyService.status$.value);
+                this.subscriptions.push(this.recursiveService.linerArrayToNestedArray(cloneCopy, 'id', 'name', 'parentId', 'active', 'checked', 'expand', this.comPartyService.status$.value // <=== this had been already retrieved on app-initialization
+                )
+                    .subscribe(data => {
+                    console.log("data", data);
+                    this.comPartyService.comTreeData$.next(data.list);
+                    this.comPartyService.linerData$.next(data.rawList);
+                }));
+            }
+        }
+    }
+    resizeHeight() {
+        // height is not given and the tree resize as standard
+        if (!!!this.height) {
+            const sizeHeaderHeight = Number(getComputedStyle(document.documentElement)
+                .getPropertyValue('--size-header-height')
+                .replace('px', ''));
+            const sizeCorePageHeaderHeight = Number(getComputedStyle(document.documentElement)
+                .getPropertyValue('--size-core-page-header-height')
+                .replace('px', ''));
+            const containerHeight = window.innerHeight - sizeHeaderHeight - sizeCorePageHeaderHeight;
+            const pageHeaderHeight = Number(getComputedStyle(document.documentElement)
+                .getPropertyValue('--size-core-page-header-height')
+                .replace('px', ''));
+            const paginationHeight = Number(getComputedStyle(document.documentElement)
+                .getPropertyValue('--size-core-pagination-height')
+                .replace('px', ''));
+            const sizeMarginCorePaginationFull = Number(getComputedStyle(document.documentElement)
+                .getPropertyValue('--size-margin-core-pagination')
+                .replace('px', ''));
+            const height = containerHeight - pageHeaderHeight - paginationHeight + sizeMarginCorePaginationFull;
+            console.log(height);
+            this.container?.nativeElement.style.setProperty('--height', height + 'px');
+        }
+        else {
+            this.container?.nativeElement.style.setProperty('--height', this.height + 'px');
+        }
+    }
+    ngAfterViewInit() {
+        setTimeout(() => {
+            if (!!this.authService.data$.value?.id && (!this.comPartyService.linerData$?.value || (!!this.comPartyService.linerData$?.value && !this.comPartyService.linerData$?.value.length))) {
+                this.comPartyService.getComLinearData(this.authService.data$.value.id).pipe(tap$1(_ => this.loading = true), finalize$1(() => this.loading = false)).subscribe(x => {
+                    if (x.ok && x.status === 200 && x.body?.statusCode === 200) {
+                        this.comPartyService.linerData$.next(x.body.innerBody.map(i => ({
+                            ...i,
+                            active: i.isActive
+                        })));
+                        this.comPartyService.buildTreeFlag$.next(!this.comPartyService.buildTreeFlag$.value);
+                    }
+                });
+            }
+            this.subscriptions.push(this.comPartyService.comTreeData$.subscribe((x) => {
+                this.data = x;
+                //this.dataFiltered = JSON.parse(JSON.stringify(x));
+                console.log("new Data coming", this.data, new Date().getTime());
+                if (!!this.data) {
+                    if (!!this.data.length)
+                        this.data[0].tree$Expanded = true;
+                }
+            }));
+            this.subscriptions.push(this.coreOrgTreeService.arrowFontSize$.subscribe(x => {
+                this.container?.nativeElement.style.setProperty('--arrow-font-size', x + 'px');
+            }));
+            this.subscriptions.push(this.coreOrgTreeService.titleWrapperMaxWidth$.pipe(filter(x => !!x)).subscribe(x => {
+                this.container?.nativeElement.style.setProperty('--title-wrapper-max-width', x + 'px');
+            }));
+            this.subscriptions.push(this.comPartyService.status$.subscribe(x => {
+                if (this.accessorMode === EnumCoreOrgTreeaAccessorMode.ACTIVATED_INHERITANCE && !!x.activeKeys) {
+                    this.onChange(x.activeKeys.map(i => Number(i)));
+                }
+                else if (this.accessorMode === EnumCoreOrgTreeaAccessorMode.ACTIVATED_SINGLE) {
+                    // tạm thời bỏ qua
+                }
+                else if (this.accessorMode === EnumCoreOrgTreeaAccessorMode.CHECKED && !!x.checkedKeys) {
+                    this.onChange(x.checkedKeys.map(i => Number(i)));
+                }
+            }));
+        });
+    }
+    // onItemClickLocal(e: IComTreeItem): void {
+    //   this.linnerOrgArray.map((x) => (x.active = false));
+    //   setTimeout(() => this.buildTreeData());
+    // }
+    onToggleItem(e) {
+        const cloneCopy = JSON.parse(JSON.stringify(this.linearComArray));
+        const filter = cloneCopy.filter((x) => x.id === e.id);
+        if (filter.length === 1) {
+            filter[0].expand = !!!e.expand;
+        }
+        this.linearComArray = cloneCopy;
+        setTimeout(() => this.buildComTreeData());
+    }
+    // buildTreeData(): void {
+    //   this.loading = true;
+    //   const cloneCopy = JSON.parse(JSON.stringify(this.linnerOrgArray));
+    //   if (typeof Worker !== 'undefined') {
+    //     // Create a new
+    //     console.log("🟢🟢 Worker works");
+    //     this.worker = new Worker(liner_to_nested_array_script);
+    //     this.worker.addEventListener('message', ({ data }) => {
+    //       this.data = data.list;
+    //       //this.dataFiltered = JSON.parse(JSON.stringify(data.list));
+    //       if (!!this.data && !!this.data?.length) this.data[0].tree$Expanded = true;
+    //       this.loading = false;
+    //     });
+    //     this.worker.postMessage({
+    //       list: cloneCopy,
+    //       keyField: 'id',
+    //       titleField: 'name',
+    //       parentField: 'parentId',
+    //       activeField: 'active',
+    //       //inheritantActiveField: 'inheritantActive',
+    //       checkedField: 'checked',
+    //       expandedField: 'expand',
+    //     });
+    //   } else {
+    //     // Web workers are not supported in this environment.
+    //     // You should add a fallback so that your program still executes correctly.
+    //     const status = this.organizationService.status$.value;
+    //     this.subscriptions.push(
+    //       this.recursiveService
+    //         .linerArrayToNestedArray(
+    //           cloneCopy,
+    //           'id',
+    //           'name',
+    //           'parentId',
+    //           'active',
+    //           'checked',
+    //           'expand',
+    //           //status
+    //         )
+    //         .subscribe((obj) => {
+    //           this.data = obj.list;
+    //           //this.dataFiltered = JSON.parse(JSON.stringify(obj.list));
+    //           if (!!this.data && !!this.data?.length) this.data[0].tree$Expanded = true;
+    //           this.loading = false;
+    //         })
+    //     );
+    //   }
+    // }
+    buildComTreeData() {
+        this.loading = true;
+        const cloneCopy = JSON.parse(JSON.stringify(this.linearComArray));
+        // ✅ ADD THIS FILTER
+        const filteredList = !this.showDissolved
+            ? cloneCopy.filter(x => x.active === true)
+            : cloneCopy;
+        if (typeof Worker !== 'undefined') {
+            this.worker = new Worker(liner_to_nested_array_script);
+            this.worker.addEventListener('message', ({ data }) => {
+                this.data = data.list;
+                if (!!this.data?.length)
+                    this.data[0].tree$Expanded = true;
+                this.loading = false;
+            });
+            // ✅ USE filteredList INSTEAD OF cloneCopy
+            this.worker.postMessage({
+                list: filteredList,
+                keyField: 'id',
+                titleField: 'name',
+                parentField: 'parentId',
+                activeField: 'active',
+                checkedField: 'checked',
+                expandedField: 'expand',
+            });
+        }
+        else {
+            this.subscriptions.push(this.recursiveService
+                .linerArrayToNestedArray(filteredList, // ✅ use filteredList
+            'id', 'name', 'parentId', 'active', 'checked', 'expand')
+                .subscribe((obj) => {
+                this.data = obj.list;
+                if (!!this.data?.length)
+                    this.data[0].tree$Expanded = true;
+                this.loading = false;
+            }));
+        }
+    }
+    onExpandTogglerClick(e, event) {
+        event.stopPropagation();
+        const newValue = !e.tree$Expanded;
+        e.tree$Expanded = newValue;
+        // updating status with newValue
+        const currentExpandedIds = this.comPartyService.status$.value?.expandedKeys;
+        let newExpandedIds = currentExpandedIds?.filter((_) => !!!currentExpandedIds.includes(e.id.toString()));
+        if (newValue) {
+            newExpandedIds?.push(e.id.toString());
+        }
+        newExpandedIds?.sort();
+        const newExpandedKeys = [];
+        newExpandedIds.map((x) => newExpandedKeys.push(x.toString()));
+        this.comPartyService.status$.next({
+            ...this.comPartyService.status$.value,
+            expandedKeys: newExpandedKeys,
+        });
+    }
+    onItemCheck(e, newValue) {
+        this.itemClick?.emit(e);
+        if (this.accessorMode !== EnumCoreOrgTreeaAccessorMode.CHECKED)
+            return;
+        // We have this var to hold nodes that are being changed
+        let toggledIds;
+        // We should calculate a new state into this var: 
+        const newCheckedIds = JSON.parse(JSON.stringify(this.checkedIds));
+        // We will call this function after toggledIds changed
+        const changeValue = () => {
+            // If newValue === true, we will disctintly push changed ids to the state
+            // Otherwise we will remove them from the state
+            if (!!newValue) {
+                toggledIds.map(x => {
+                    if (!!!newCheckedIds.includes(x)) {
+                        newCheckedIds.push(x);
+                    }
+                });
+                // Then asign the state to the newCheckedIds
+                this.checkedIds = newCheckedIds;
+            }
+            else {
+                const filter = newCheckedIds.filter(x => !!!toggledIds.includes(x));
+                // Then asign the state to the filter
+                this.checkedIds = filter;
+            }
+            // After the cases of if/else, make the control change with onChange
+            this.value = this.checkedIds;
+            this.onChange(this.checkedIds);
+            this.markAsTouched();
+        };
+        /* start: THIS CODE SCOPE calculates toggledIds */
+        if (this.checkInheritance) {
+            // If true, all the nested items will be checked/unchecked
+            this.recursiveService
+                .nestedToggleCheck(e, newValue, this.showDissolved)
+                .then((x) => {
+                let currentCheckedKeys = this.comPartyService.status$.value.checkedKeys || [];
+                if (!!newValue) {
+                    x.map(item => {
+                        if (currentCheckedKeys.filter(i => i === item.toString()).length === 0) {
+                            currentCheckedKeys.push(item.toString());
+                        }
+                    });
+                }
+                else {
+                    currentCheckedKeys = currentCheckedKeys.filter(i => !x.includes(Number(i)));
+                }
+                this.comPartyService.status$.next({
+                    ...this.comPartyService.status$.value,
+                    checkedKeys: currentCheckedKeys //x.map(item => item.toString())
+                });
+                // The ids have been changed
+                toggledIds = x;
+                // Now toggledIds were set. We call the function we declared
+                changeValue();
+            })
+                .catch((x) => {
+                console.error(x);
+            });
+        }
+        else {
+            // Otherwise we simply toggle check for current item only
+            toggledIds = [e.id];
+            // Now toggledIds were set. We call the function we declared
+            changeValue();
+        }
+        /* end: THIS CODE SCOPE calculates toggledIds */
+        // That is. Happy debugging!
+    }
+    onCheckIncludeDissolvedChange(value) {
+        console.log("onCheckIncludeDissolvedChange", value);
+    }
+    onCheckInheritanceChange(value) {
+        this.comPartyService.status$.next({
+            ...this.comPartyService.status$.value,
+            checkInheritance: value,
+        });
+    }
+    onObjectClick(e, event) {
+        // remove highlight class
+        // TO DO
+        if (!!e.protected)
+            return;
+        this.itemClick?.emit(e);
+        if (this.accessorMode === EnumCoreOrgTreeaAccessorMode.CHECKED)
+            return;
+        let activeIds = [];
+        this.data.map((item) => (item.active = false));
+        if (this.accessorMode ===
+            EnumCoreOrgTreeaAccessorMode.ACTIVATED_INHERITANCE ||
+            !!!this.accessorMode) {
+            // If true, all the nested items will be active, the others are inactive
+            this.recursiveService
+                .nestedResetActive(e, true)
+                .then((x) => {
+                activeIds = x;
+                activeIds.sort();
+                const newActiveKeys = [];
+                activeIds.map((x) => newActiveKeys.push(x.toString()));
+                this.comPartyService.status$.next({
+                    ...this.comPartyService.status$.value,
+                    activeKeys: newActiveKeys,
+                    selectedKey: e.id.toString()
+                });
+                this.activeIds = activeIds;
+                console.log(this.activeIds);
+                this.onChange(activeIds);
+            })
+                .catch((x) => {
+                console.error(x);
+            });
+        }
+        else {
+            // ACTIVATED_SINGLE
+            // Otherwise we simply set current item to be active only
+            activeIds = [e.id];
+            this.activeIds = activeIds;
+            this.comPartyService.status$.next({
+                ...this.comPartyService.status$.value,
+                activeKeys: [e.id.toString()],
+                selectedKey: e.id.toString(),
+            });
+            this.onChange(activeIds);
+        }
+        const { detail } = event;
+        if (detail === 2) {
+            console.log('This was a dblclick');
+            this.itemDoubleClick.emit(e);
+        }
+        this.selectedItem = e;
+    }
+    onSearchChange(text) {
+        this.search$.next(text);
+    }
+    onHiddenToolClick(e) {
+        e.stopPropagation();
+        this.hiddenToolClickStream$.next(crypto.randomUUID());
+    }
+    ngOnDestroy() {
+        if (this.worker) {
+            this.worker.terminate();
+        }
+        this.subscriptions.map((x) => x?.unsubscribe());
+        if (!!this.instanceNumber) {
+            const tryToFind = this.comPartyService.instances.filter((x) => x.instanceNumber === this.instanceNumber);
+            if (!!tryToFind.length) {
+                const newInstances = this.comPartyService.instances.filter((x) => x.instanceNumber !== this.instanceNumber);
+                this.comPartyService.instances = newInstances;
+            }
+        }
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: CoreComTreeComponent, deps: [{ token: AuthService }, { token: RecursiveService }, { token: MultiLanguageService }, { token: LayoutService }, { token: CoreOrgTreeService }, { token: AlertService }, { token: ComPartyService }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.5", type: CoreComTreeComponent, isStandalone: true, selector: "core-com-tree", inputs: { lineColor: "lineColor", fullWidthMode: "fullWidthMode", accessorMode: "accessorMode", searchMode: "searchMode", fullRendering: "fullRendering", height: "height", disabledLoopExpand: "disabledLoopExpand", showCheckInheritance: "showCheckInheritance", excludedIds$: "excludedIds$", stateIsolated$: "stateIsolated$" }, outputs: { itemDoubleClick: "itemDoubleClick", itemClick: "itemClick" }, providers: [
+            {
+                provide: NG_VALUE_ACCESSOR,
+                useExisting: forwardRef(() => CoreComTreeComponent),
+                multi: true
+            }
+        ], viewQueries: [{ propertyName: "container", first: true, predicate: ["container"], descendants: true }, { propertyName: "scrollContainer", first: true, predicate: ["scrollContainer"], descendants: true }, { propertyName: "displayContent", first: true, predicate: ["displayContent"], descendants: true }, { propertyName: "reducedIconWrapper", first: true, predicate: ["reducedIconWrapper"], descendants: true }], usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "<div #container class=\"core-org-tree-container\" [class.full-width]=\"!!fullWidthMode\" *ngIf=\"!!data\" \r\n    [style.position]=\"'relative'\"\r\n    [style.width]=\"'100%'\"\r\n    [style.minWidth]=\"'310px'\"\r\n    [style.height]=\"height + 'px'\"\r\n    >\r\n    <div #displayContent class=\"custom-org-tree\">\r\n        @if (showSearch) {\r\n        <div class=\"core-org-tree-header d-flex-between\">\r\n            <div class=\"m5\">\r\n                <input type=\"text\" class=\"form-control\" [(ngModel)]=\"search\" (ngModelChange)=\"onSearchChange($event)\"\r\n                    [placeholder]=\"searchPlaceholder | translate: lang\" [class.full-width]=\"!!fullWidthMode\">\r\n            </div>\r\n        </div>\r\n        }\r\n        <ng-container>\r\n\r\n            <div #scrollContainer class=\"scroll-container\" \r\n                [style.height]=\"height - layoutService.coreOrgTreeTopHeight * (showSearch ? 1 : 0) - layoutService.coreOrgTreeBottomHeight + 'px'\" \r\n                [style.overflow]=\"'scroll'\" \r\n            >\r\n                <div class=\"hidden-tool\" (click)=\"onHiddenToolClick($event)\"></div>\r\n                <core-loading-surface [loading]=\"loading\" [height]=\"scrollContainerHeight\"></core-loading-surface>\r\n                <!-- @for (root of dataFiltered; track root) { -->\r\n                @if (!!data && !!data.length) {\r\n                    @for (root of data; track $index) {\r\n                        @defer(on viewport(scrollContainer)) {\r\n                        <ul class=\"root\" [class.collapsed]=\"!!!root.tree$Expanded\">\r\n                            <ng-container *ngTemplateOutlet=\"item; context: { context: root }\"></ng-container>\r\n                        </ul>\r\n                        } @placeholder() {\r\n                            Placeholder...\r\n                        } @loading() {\r\n                            Loading...\r\n                        } @error() {\r\n                            Error...\r\n                        }\r\n                    }\r\n                } @else {\r\n                    No items\r\n                }\r\n            </div>\r\n            <div \r\n                [style.display]=\"'block'\"\r\n                [style.position]=\"'absolute'\"\r\n                [style.bottom]=\"'0px'\"\r\n                [style.left]=\"'0px'\"\r\n                [style.right]=\"'0px'\"\r\n                [style.height]=\"layoutService.corePaginationHeight + 'px'\"\r\n                [style.paddingLeft]=\"layoutService.basicSpacing + 'px'\"\r\n                [style.paddingRight]=\"layoutService.basicSpacing + 'px'\"\r\n                [style.lineHeight]=\"layoutService.corePaginationHeight + 'px'\"\r\n                [style.overflow]=\"'hidden'\"\r\n            >\r\n                <div \r\n                    [style.height]=\"layoutService.corePaginationHeight + 'px'\"\r\n                    [style.position]=\"'relative'\"\r\n                    [style.display]=\"'flex'\"\r\n                    [style.alignItems]=\"'center'\"\r\n                    [style.justifyContent]=\"'space-between'\"\r\n                >\r\n                    <div>\r\n                        <core-checkbox [(ngModel)]=\"showDissolved\"\r\n                            (ngModelChange)=\"onCheckIncludeDissolvedChange($event)\"\r\n                            [text]=\"'UI.CORE_ORG_TREE.SHOW_OUTDATED_UNITS_ABBREVIATED'\"\r\n                            [tooltip]=\"'UI.CORE_ORG_TREE.SHOW_OUTDATED_UNITS'\" tooltipPosition=\"above\"></core-checkbox>\r\n                    </div>\r\n                    @if (accessorMode === 'CHECKED') {\r\n                        <div class=\"check-inheritance-wrapper\">\r\n                            @if (showCheckInheritance) {\r\n                                <core-checkbox [(ngModel)]=\"checkInheritance\"\r\n                                    (ngModelChange)=\"onCheckInheritanceChange($event)\"\r\n                                    [text]=\"'UI.CORE_ORG_TREE.CHECK_INHERITANCE'\"></core-checkbox>\r\n                                }\r\n                        </div>\r\n                    }\r\n                </div>\r\n            </div>\r\n\r\n            <ng-template #item let-context=\"context\" let-id=\"context.id\" let-title=\"context.tree$Title\"\r\n                let-highlighted=\"context.tree$Highlighted\" let-hasChildren=\"context.tree$HasChildren\"\r\n                let-hasActiveChildren=\"context.tree$HasActiveChildren\" let-children=\"context.tree$Children\"\r\n                let-expanded=\"context.tree$Expanded\" let-isActive=\"context.isActive\" let-active=\"context.tree$Active\"\r\n                let-checked=\"context.tree$Checked\" let-protected=\"context.protected\">\r\n\r\n                @if ((!showDissolved && !!isActive) || (!!showDissolved)) {\r\n                <li [class.has-children]=\"!!hasChildren\" [class.collapsed]=\"!!hasChildren && !!!expanded\">\r\n                    <!-- (click)=\"accessorMode !== 'CHECKED' ? onObjectClick(context, $event) : $event.preventDefault()\" -->\r\n                    <span (click)=\"onObjectClick(context, $event)\">\r\n                        @if ((!!showDissolved && !!hasChildren) || (!showDissolved && !!hasActiveChildren)) {\r\n                            <i class=\"expand-toggler feather-chevron-down\" (click)=\"onExpandTogglerClick(context, $event)\"></i>\r\n                        }\r\n\r\n                        @if (accessorMode === 'CHECKED' && !protected) {\r\n                        <core-checkbox (onClick)=\"onItemCheck(context, $event)\" [inputValue]=\"checked\"\r\n                            [disabled]=\"disabled\"></core-checkbox>\r\n                        }\r\n                        <object [class.active]=\"accessorMode != 'CHECKED' && selectedKey===id.toString()\"\r\n                            [class.highlighted]=\"highlighted\" [class.dissolved]=\"!isActive\"\r\n                            [class.protected]=\"protected\" [appTooltip]=\"title\">\r\n                            {{ title }}\r\n                        </object>\r\n                    </span>\r\n                    @if (!!children.length) {\r\n                    <ul [class.collapsed]=\" !!!expanded\">\r\n                        @for (child of children; track $index) {\r\n                        @if (!!expanded || !!fullRendering) {\r\n\r\n                        <ng-container *ngTemplateOutlet=\"item; context: { context: child }\"></ng-container>\r\n\r\n                        }\r\n                        }\r\n                    </ul>\r\n                    }\r\n                </li>\r\n                }\r\n            </ng-template>\r\n        </ng-container>\r\n    </div>\r\n</div>", styles: [""], dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$3.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: i1$3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: CoreCheckboxComponent, selector: "core-checkbox", inputs: ["text", "tooltipPosition", "tooltip", "inputValue", "disabled"], outputs: ["onClick"] }, { kind: "component", type: CoreLoadingSurfaceComponent, selector: "core-loading-surface", inputs: ["loading", "height"] }, { kind: "pipe", type: TranslatePipe, name: "translate" }, { kind: "directive", type: TooltipDirective, selector: "[appTooltip]", inputs: ["appTooltip", "showAnyway", "color", "backgroundColor", "position"] }] }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: CoreComTreeComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'core-com-tree', imports: [
+                        FormsModule,
+                        NgIf,
+                        CoreCheckboxComponent,
+                        CoreLoadingSurfaceComponent,
+                        TranslatePipe,
+                        TooltipDirective,
+                    ], providers: [
+                        {
+                            provide: NG_VALUE_ACCESSOR,
+                            useExisting: forwardRef(() => CoreComTreeComponent),
+                            multi: true
+                        }
+                    ], template: "<div #container class=\"core-org-tree-container\" [class.full-width]=\"!!fullWidthMode\" *ngIf=\"!!data\" \r\n    [style.position]=\"'relative'\"\r\n    [style.width]=\"'100%'\"\r\n    [style.minWidth]=\"'310px'\"\r\n    [style.height]=\"height + 'px'\"\r\n    >\r\n    <div #displayContent class=\"custom-org-tree\">\r\n        @if (showSearch) {\r\n        <div class=\"core-org-tree-header d-flex-between\">\r\n            <div class=\"m5\">\r\n                <input type=\"text\" class=\"form-control\" [(ngModel)]=\"search\" (ngModelChange)=\"onSearchChange($event)\"\r\n                    [placeholder]=\"searchPlaceholder | translate: lang\" [class.full-width]=\"!!fullWidthMode\">\r\n            </div>\r\n        </div>\r\n        }\r\n        <ng-container>\r\n\r\n            <div #scrollContainer class=\"scroll-container\" \r\n                [style.height]=\"height - layoutService.coreOrgTreeTopHeight * (showSearch ? 1 : 0) - layoutService.coreOrgTreeBottomHeight + 'px'\" \r\n                [style.overflow]=\"'scroll'\" \r\n            >\r\n                <div class=\"hidden-tool\" (click)=\"onHiddenToolClick($event)\"></div>\r\n                <core-loading-surface [loading]=\"loading\" [height]=\"scrollContainerHeight\"></core-loading-surface>\r\n                <!-- @for (root of dataFiltered; track root) { -->\r\n                @if (!!data && !!data.length) {\r\n                    @for (root of data; track $index) {\r\n                        @defer(on viewport(scrollContainer)) {\r\n                        <ul class=\"root\" [class.collapsed]=\"!!!root.tree$Expanded\">\r\n                            <ng-container *ngTemplateOutlet=\"item; context: { context: root }\"></ng-container>\r\n                        </ul>\r\n                        } @placeholder() {\r\n                            Placeholder...\r\n                        } @loading() {\r\n                            Loading...\r\n                        } @error() {\r\n                            Error...\r\n                        }\r\n                    }\r\n                } @else {\r\n                    No items\r\n                }\r\n            </div>\r\n            <div \r\n                [style.display]=\"'block'\"\r\n                [style.position]=\"'absolute'\"\r\n                [style.bottom]=\"'0px'\"\r\n                [style.left]=\"'0px'\"\r\n                [style.right]=\"'0px'\"\r\n                [style.height]=\"layoutService.corePaginationHeight + 'px'\"\r\n                [style.paddingLeft]=\"layoutService.basicSpacing + 'px'\"\r\n                [style.paddingRight]=\"layoutService.basicSpacing + 'px'\"\r\n                [style.lineHeight]=\"layoutService.corePaginationHeight + 'px'\"\r\n                [style.overflow]=\"'hidden'\"\r\n            >\r\n                <div \r\n                    [style.height]=\"layoutService.corePaginationHeight + 'px'\"\r\n                    [style.position]=\"'relative'\"\r\n                    [style.display]=\"'flex'\"\r\n                    [style.alignItems]=\"'center'\"\r\n                    [style.justifyContent]=\"'space-between'\"\r\n                >\r\n                    <div>\r\n                        <core-checkbox [(ngModel)]=\"showDissolved\"\r\n                            (ngModelChange)=\"onCheckIncludeDissolvedChange($event)\"\r\n                            [text]=\"'UI.CORE_ORG_TREE.SHOW_OUTDATED_UNITS_ABBREVIATED'\"\r\n                            [tooltip]=\"'UI.CORE_ORG_TREE.SHOW_OUTDATED_UNITS'\" tooltipPosition=\"above\"></core-checkbox>\r\n                    </div>\r\n                    @if (accessorMode === 'CHECKED') {\r\n                        <div class=\"check-inheritance-wrapper\">\r\n                            @if (showCheckInheritance) {\r\n                                <core-checkbox [(ngModel)]=\"checkInheritance\"\r\n                                    (ngModelChange)=\"onCheckInheritanceChange($event)\"\r\n                                    [text]=\"'UI.CORE_ORG_TREE.CHECK_INHERITANCE'\"></core-checkbox>\r\n                                }\r\n                        </div>\r\n                    }\r\n                </div>\r\n            </div>\r\n\r\n            <ng-template #item let-context=\"context\" let-id=\"context.id\" let-title=\"context.tree$Title\"\r\n                let-highlighted=\"context.tree$Highlighted\" let-hasChildren=\"context.tree$HasChildren\"\r\n                let-hasActiveChildren=\"context.tree$HasActiveChildren\" let-children=\"context.tree$Children\"\r\n                let-expanded=\"context.tree$Expanded\" let-isActive=\"context.isActive\" let-active=\"context.tree$Active\"\r\n                let-checked=\"context.tree$Checked\" let-protected=\"context.protected\">\r\n\r\n                @if ((!showDissolved && !!isActive) || (!!showDissolved)) {\r\n                <li [class.has-children]=\"!!hasChildren\" [class.collapsed]=\"!!hasChildren && !!!expanded\">\r\n                    <!-- (click)=\"accessorMode !== 'CHECKED' ? onObjectClick(context, $event) : $event.preventDefault()\" -->\r\n                    <span (click)=\"onObjectClick(context, $event)\">\r\n                        @if ((!!showDissolved && !!hasChildren) || (!showDissolved && !!hasActiveChildren)) {\r\n                            <i class=\"expand-toggler feather-chevron-down\" (click)=\"onExpandTogglerClick(context, $event)\"></i>\r\n                        }\r\n\r\n                        @if (accessorMode === 'CHECKED' && !protected) {\r\n                        <core-checkbox (onClick)=\"onItemCheck(context, $event)\" [inputValue]=\"checked\"\r\n                            [disabled]=\"disabled\"></core-checkbox>\r\n                        }\r\n                        <object [class.active]=\"accessorMode != 'CHECKED' && selectedKey===id.toString()\"\r\n                            [class.highlighted]=\"highlighted\" [class.dissolved]=\"!isActive\"\r\n                            [class.protected]=\"protected\" [appTooltip]=\"title\">\r\n                            {{ title }}\r\n                        </object>\r\n                    </span>\r\n                    @if (!!children.length) {\r\n                    <ul [class.collapsed]=\" !!!expanded\">\r\n                        @for (child of children; track $index) {\r\n                        @if (!!expanded || !!fullRendering) {\r\n\r\n                        <ng-container *ngTemplateOutlet=\"item; context: { context: child }\"></ng-container>\r\n\r\n                        }\r\n                        }\r\n                    </ul>\r\n                    }\r\n                </li>\r\n                }\r\n            </ng-template>\r\n        </ng-container>\r\n    </div>\r\n</div>" }]
+        }], ctorParameters: () => [{ type: AuthService }, { type: RecursiveService }, { type: MultiLanguageService }, { type: LayoutService }, { type: CoreOrgTreeService }, { type: AlertService }, { type: ComPartyService }], propDecorators: { lineColor: [{
+                type: Input
+            }], fullWidthMode: [{
+                type: Input
+            }], accessorMode: [{
+                type: Input
+            }], searchMode: [{
+                type: Input
+            }], fullRendering: [{
+                type: Input
+            }], height: [{
+                type: Input
+            }], disabledLoopExpand: [{
+                type: Input
+            }], showCheckInheritance: [{
+                type: Input
+            }], excludedIds$: [{
+                type: Input
+            }], stateIsolated$: [{
+                type: Input
+            }], itemDoubleClick: [{
+                type: Output
+            }], itemClick: [{
+                type: Output
+            }], container: [{
+                type: ViewChild,
+                args: ['container']
+            }], scrollContainer: [{
+                type: ViewChild,
+                args: ['scrollContainer']
+            }], displayContent: [{
+                type: ViewChild,
+                args: ['displayContent']
+            }], reducedIconWrapper: [{
+                type: ViewChild,
+                args: ['reducedIconWrapper']
+            }] } });
+
+class CorePaginationComponent {
+    constructor() {
+        this.$currentPage = input.required();
+        this.$height = input.required();
+        this.$pageCount = input.required();
+        this.$loading = input.required();
+        this.$suspendCurrentPageSubscription = input();
+        this.$showAdd = input();
+        this.$background = input();
+        this.$fixedPageSize = input();
+        this.$onClickAdd = output();
+        this.$container = viewChild('container');
+        this.$current = viewChild('current');
+        this.$aperture = viewChild('aperture');
+        this.$currentButtonContent = signal('1');
+        this.$suspendCurrentPage = signal(true);
+        this.$navigationDirection = signal(1);
+        this.subscriptions = [];
+    }
+    ngOnInit() { }
+    goFirst() {
+        this.$navigationDirection.set(-1);
+        this.$suspendCurrentPage.set(false);
+        setTimeout(() => {
+            if (!!this.$pageCount())
+                this.$currentPage().next(1);
+            this.$aperture()?.nativeElement.style.setProperty('animation-name', 'rotatebackwards');
+        });
+    }
+    goLast() {
+        this.$navigationDirection.set(1);
+        this.$suspendCurrentPage.set(false);
+        setTimeout(() => {
+            if (!!this.$pageCount())
+                this.$currentPage().next(this.$pageCount());
+            this.$aperture()?.nativeElement.style.setProperty('animation-name', 'rotateforwards');
+        });
+    }
+    goPrevious() {
+        this.$navigationDirection.set(-1);
+        this.$suspendCurrentPage.set(false);
+        setTimeout(() => {
+            if (!!this.$pageCount())
+                this.$currentPage().next(this.$currentPage().value - 1);
+            this.$aperture()?.nativeElement.style.setProperty('animation-name', 'rotatebackwards');
+        });
+    }
+    goNext() {
+        this.$navigationDirection.set(1);
+        this.$suspendCurrentPage.set(false);
+        setTimeout(() => {
+            if (!!this.$pageCount())
+                this.$currentPage().next(this.$currentPage().value + 1);
+            this.$aperture()?.nativeElement.style.setProperty('animation-name', 'rotateforwards');
+        });
+    }
+    onClickAddLocal() {
+        this.$onClickAdd.emit();
+    }
+    ngAfterViewInit() {
+        setTimeout(() => {
+            this.subscriptions.push(this.$currentPage().subscribe(x => this.$currentButtonContent.set(x.toString())));
+            this.mouseDownStream$ = fromEvent(this.$current().nativeElement, 'mousedown', _ => {
+                this.$currentButtonContent.set(`${this.$currentPage().value}/${this.$pageCount()}`);
+            });
+            this.touchStartStream$ = fromEvent(this.$current().nativeElement, 'touchstart', _ => {
+                this.$currentButtonContent.set(`${this.$currentPage().value}/${this.$pageCount()}`);
+            });
+            this.mouseUpStream$ = fromEvent(this.$current().nativeElement, 'mouseup', _ => {
+                this.$currentButtonContent.set(`${this.$currentPage().value}`);
+            });
+            this.touchEndStream$ = fromEvent(this.$current().nativeElement, 'touchend', _ => {
+                this.$currentButtonContent.set(`${this.$currentPage().value}`);
+            });
+            this.mouseDownSubscription$ = this.mouseDownStream$.subscribe();
+            this.touchStartSubscription$ = this.touchStartStream$.subscribe();
+            this.mouseUpSubscription$ = this.mouseUpStream$.subscribe();
+            this.touchEndSubscription$ = this.touchEndStream$.subscribe();
+            if (this.$background())
+                setTimeout(() => this.$container().nativeElement.style.setProperty('--bg', this.$background()));
+            if (this.$height())
+                this.$container()?.nativeElement.style.setProperty('--height', this.$height() + 'px');
+        });
+    }
+    ngOnDestroy() {
+        if (this.mouseDownSubscription$)
+            this.mouseDownSubscription$.unsubscribe();
+        if (this.touchStartSubscription$)
+            this.touchStartSubscription$.unsubscribe();
+        if (this.mouseUpSubscription$)
+            this.mouseUpSubscription$.unsubscribe();
+        if (this.touchEndSubscription$)
+            this.touchEndSubscription$.unsubscribe();
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: CorePaginationComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.5", type: CorePaginationComponent, isStandalone: true, selector: "core-pagination", inputs: { $currentPage: { classPropertyName: "$currentPage", publicName: "$currentPage", isSignal: true, isRequired: true, transformFunction: null }, $height: { classPropertyName: "$height", publicName: "$height", isSignal: true, isRequired: true, transformFunction: null }, $pageCount: { classPropertyName: "$pageCount", publicName: "$pageCount", isSignal: true, isRequired: true, transformFunction: null }, $loading: { classPropertyName: "$loading", publicName: "$loading", isSignal: true, isRequired: true, transformFunction: null }, $suspendCurrentPageSubscription: { classPropertyName: "$suspendCurrentPageSubscription", publicName: "$suspendCurrentPageSubscription", isSignal: true, isRequired: false, transformFunction: null }, $showAdd: { classPropertyName: "$showAdd", publicName: "$showAdd", isSignal: true, isRequired: false, transformFunction: null }, $background: { classPropertyName: "$background", publicName: "$background", isSignal: true, isRequired: false, transformFunction: null }, $fixedPageSize: { classPropertyName: "$fixedPageSize", publicName: "$fixedPageSize", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { $onClickAdd: "$onClickAdd" }, viewQueries: [{ propertyName: "$container", first: true, predicate: ["container"], descendants: true, isSignal: true }, { propertyName: "$current", first: true, predicate: ["current"], descendants: true, isSignal: true }, { propertyName: "$aperture", first: true, predicate: ["aperture"], descendants: true, isSignal: true }], ngImport: i0, template: "<div #container class=\"pagination-container d-flex-between\">\r\n    <div class=\"pagination-container\">\r\n        <div class=\"first\" [class.disable]=\"!$pageCount() || $currentPage().value===1\" (click)=\"goFirst()\"></div>\r\n        <div class=\"previous\" [class.disable]=\"!$pageCount() || $currentPage().value===1\" (click)=\"goPrevious()\"></div>\r\n        <div #current class=\"current\">\r\n            <div class=\"d-flex-center\">\r\n                <i #aperture class=\"feather-aperture aperture \" [class.visible]=\"$loading()\"></i>\r\n                @if (!$loading()) {\r\n                    <span class=\"current-text\">{{ $currentButtonContent() }}</span>\r\n                }\r\n            </div>\r\n        </div>\r\n        <div class=\"next\" [class.disable]=\"!$pageCount() || ($currentPage() | async)===$pageCount()\" (click)=\"goNext()\"></div>\r\n        <div class=\"last\" [class.disable]=\"!$pageCount() || ($currentPage() | async)===$pageCount()\" (click)=\"goLast()\"></div>\r\n    </div>\r\n    @if ($showAdd()) {\r\n        <a (click)=\"onClickAddLocal()\">\r\n            <div class=\"add\"></div>\r\n        </a>\r\n    }\r\n</div>", styles: [".pagination-container{--bg: #848484;--color: white;--height: 38px;--button-size: 50px;--font-size: 18px;--aperture-size: 30px}@keyframes rotateforwards{0%{transform:rotate(0)}to{transform:rotate(360deg)}}@keyframes rotatebackwards{0%{transform:rotate(0)}to{transform:rotate(-360deg)}}.pagination-container .add:before{font-family:feather;content:\"\\e9b1\";font-weight:700;font-size:var(--font-size);color:#fff;background:var(--bg);width:var(--button-size);height:var(--button-size);display:flex;align-items:center;justify-content:center;border-top-right-radius:50%;border-bottom-right-radius:50%}.pagination-container .pagination-container{height:var(--height);display:flex}.pagination-container .pagination-container>div{display:inline-block;cursor:pointer;margin-right:2px}.pagination-container .pagination-container .disable{cursor:default;opacity:.5!important}.pagination-container .pagination-container .current{border-radius:50%;margin:0 5px;opacity:1;transition:2s}.pagination-container .pagination-container .aperture{width:var(--aperture-size);height:var(--aperture-size);opacity:0;transition:.25s ease-out;animation:rotateforwards 1s linear infinite}.pagination-container .pagination-container .aperture:before{font-size:var(--aperture-size)}.pagination-container .pagination-container .visible{opacity:1;transition:.25s ease-out}.pagination-container .pagination-container .current,.pagination-container .pagination-container .loading{width:var(--button-size);height:var(--button-size);background:var(--bg);color:var(--color)}.pagination-container .pagination-container .current-text{position:absolute}.pagination-container .pagination-container .current>div{width:var(--button-size);height:var(--button-size);display:flex;align-items:center;justify-content:center}.pagination-container .pagination-container div:before{font-family:feather;font-size:var(--font-size);width:var(--button-size);height:var(--button-size);background:var(--bg);color:var(--color);display:flex;align-items:center;justify-content:center}.pagination-container .pagination-container .first:before{content:\"\\e933\"}.pagination-container .pagination-container .previous:before{content:\"\\e92f\"}.pagination-container .pagination-container .next:before{content:\"\\e930\"}.pagination-container .pagination-container .last:before{content:\"\\e934\"}\n"], dependencies: [{ kind: "pipe", type: AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: CorePaginationComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'core-pagination', changeDetection: ChangeDetectionStrategy.OnPush, imports: [
+                        NgStyle,
+                        AsyncPipe,
+                    ], template: "<div #container class=\"pagination-container d-flex-between\">\r\n    <div class=\"pagination-container\">\r\n        <div class=\"first\" [class.disable]=\"!$pageCount() || $currentPage().value===1\" (click)=\"goFirst()\"></div>\r\n        <div class=\"previous\" [class.disable]=\"!$pageCount() || $currentPage().value===1\" (click)=\"goPrevious()\"></div>\r\n        <div #current class=\"current\">\r\n            <div class=\"d-flex-center\">\r\n                <i #aperture class=\"feather-aperture aperture \" [class.visible]=\"$loading()\"></i>\r\n                @if (!$loading()) {\r\n                    <span class=\"current-text\">{{ $currentButtonContent() }}</span>\r\n                }\r\n            </div>\r\n        </div>\r\n        <div class=\"next\" [class.disable]=\"!$pageCount() || ($currentPage() | async)===$pageCount()\" (click)=\"goNext()\"></div>\r\n        <div class=\"last\" [class.disable]=\"!$pageCount() || ($currentPage() | async)===$pageCount()\" (click)=\"goLast()\"></div>\r\n    </div>\r\n    @if ($showAdd()) {\r\n        <a (click)=\"onClickAddLocal()\">\r\n            <div class=\"add\"></div>\r\n        </a>\r\n    }\r\n</div>", styles: [".pagination-container{--bg: #848484;--color: white;--height: 38px;--button-size: 50px;--font-size: 18px;--aperture-size: 30px}@keyframes rotateforwards{0%{transform:rotate(0)}to{transform:rotate(360deg)}}@keyframes rotatebackwards{0%{transform:rotate(0)}to{transform:rotate(-360deg)}}.pagination-container .add:before{font-family:feather;content:\"\\e9b1\";font-weight:700;font-size:var(--font-size);color:#fff;background:var(--bg);width:var(--button-size);height:var(--button-size);display:flex;align-items:center;justify-content:center;border-top-right-radius:50%;border-bottom-right-radius:50%}.pagination-container .pagination-container{height:var(--height);display:flex}.pagination-container .pagination-container>div{display:inline-block;cursor:pointer;margin-right:2px}.pagination-container .pagination-container .disable{cursor:default;opacity:.5!important}.pagination-container .pagination-container .current{border-radius:50%;margin:0 5px;opacity:1;transition:2s}.pagination-container .pagination-container .aperture{width:var(--aperture-size);height:var(--aperture-size);opacity:0;transition:.25s ease-out;animation:rotateforwards 1s linear infinite}.pagination-container .pagination-container .aperture:before{font-size:var(--aperture-size)}.pagination-container .pagination-container .visible{opacity:1;transition:.25s ease-out}.pagination-container .pagination-container .current,.pagination-container .pagination-container .loading{width:var(--button-size);height:var(--button-size);background:var(--bg);color:var(--color)}.pagination-container .pagination-container .current-text{position:absolute}.pagination-container .pagination-container .current>div{width:var(--button-size);height:var(--button-size);display:flex;align-items:center;justify-content:center}.pagination-container .pagination-container div:before{font-family:feather;font-size:var(--font-size);width:var(--button-size);height:var(--button-size);background:var(--bg);color:var(--color);display:flex;align-items:center;justify-content:center}.pagination-container .pagination-container .first:before{content:\"\\e933\"}.pagination-container .pagination-container .previous:before{content:\"\\e92f\"}.pagination-container .pagination-container .next:before{content:\"\\e930\"}.pagination-container .pagination-container .last:before{content:\"\\e934\"}\n"] }]
+        }], ctorParameters: () => [] });
+
+class CoreCompareDbPipelineComponent extends BaseComponent {
+    constructor(mls, appService) {
+        super(mls);
+        this.mls = mls;
+        this.appService = appService;
+        this.data = [];
+        this.tabHeaders = ["Dev-Test-Live", "Dev-Extended"];
+        this.activeTabIndex = 0;
+        this.columns = [
+            {
+                field: 'id',
+                type: 'string',
+                caption: 'id',
+                align: 'left',
+                hidden: true,
+                width: 0
+            },
+            {
+                field: 'difference',
+                type: 'string',
+                caption: 'Problem',
+                align: 'left',
+                sortDisabled: true,
+                width: 300
+            },
+            {
+                field: 'conflictType',
+                type: 'string',
+                caption: 'Marker',
+                align: 'center',
+                width: 50
+            },
+            {
+                field: 'sourceAlias',
+                type: 'string',
+                caption: 'Source',
+                align: 'left',
+                sortDisabled: true,
+                width: 60
+            },
+            {
+                field: 'targetAlias',
+                type: 'string',
+                caption: 'Target',
+                align: 'left',
+                sortDisabled: true,
+                width: 200
+            },
+            {
+                field: 'tableName',
+                type: 'string',
+                caption: 'Table',
+                align: 'left',
+                sortDisabled: true,
+                width: 200
+            },
+            {
+                field: 'columnName',
+                type: 'string',
+                caption: 'Column',
+                align: 'left',
+                sortDisabled: true,
+                width: 200
+            },
+            {
+                field: 'sourceType',
+                type: 'string',
+                caption: 'Source type',
+                align: 'left',
+                sortDisabled: true,
+                width: 100
+            },
+            {
+                field: 'sourceIsPrimaryKey',
                 type: 'boolean',
                 caption: 'Source is PK',
                 align: 'center',
@@ -36743,860 +38492,221 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.5", ngImpor
             args: [{ selector: 'confirm-dialog-state', standalone: false, template: "<div class=\"confirm-dialog-state-container\">\r\n    <div class=\"container container-fluid\">\r\n        <div class=\"row\">\r\n            <div class=\"col-md-4 label\">busy</div>\r\n            <div class=\"col-md-8 font-bold\">{{ ds.busy }}</div>\r\n        </div>\r\n        <div class=\"row\">\r\n            <div class=\"col-md-4 label\">showConfirmDialog</div>\r\n            <div class=\"col-md-8 font-bold\">{{ ds.showConfirmDialog$.value }}</div>\r\n        </div>\r\n        <div class=\"row\">\r\n            <div class=\"col-md-4 label\">dialogConfirmed</div>\r\n            <div class=\"col-md-8 font-bold\">{{ ds.dialogConfirmed$.value }}</div>\r\n        </div>\r\n        <div class=\"row\">\r\n            <div class=\"col-md-4 label\">title</div>\r\n            <div class=\"col-md-8 font-bold\">{{ ds.title$.value }}</div>\r\n        </div>\r\n        <div class=\"row\">\r\n            <div class=\"col-md-4 label\">body</div>\r\n            <div class=\"col-md-8 font-bold\">{{ ds.body$.value }}</div>\r\n        </div>\r\n    </div>\r\n</div>\r\n\r\n<!--\r\n\r\n      busy!: boolean;\r\n\r\n  showConfirmDialog$ = new BehaviorSubject<boolean | undefined>(undefined);\r\n  canDeactivate$ = new Subject<boolean>;\r\n  dialogConfirmed$ = new BehaviorSubject<IDialogConfirmModel | undefined>(undefined);\r\n\r\n  title$ = new Subject<EnumTranslateKey>;\r\n  body$ = new Subject<EnumTranslateKey>;\r\n  okButtonText$ = new Subject<EnumTranslateKey>;\r\n  cancelButtonText$ = new Subject<EnumTranslateKey>;\r\n  showCancelOnly$ = new Subject<boolean>;\r\n  informationLines$ = new Subject<string[]>;\r\n-->", styles: [".confirm-dialog-state-container{position:fixed;display:block;top:calc(var(--size-header-height) + var(--size-layout-block-cell-spacing));left:var(--size-layout-block-cell-spacing);z-index:9999999;width:320px;height:320px}\n"] }]
         }], ctorParameters: () => [{ type: DialogService }] });
 
-class CoreLazyMountComponent {
-    constructor() {
-        this.vcRef = inject(ViewContainerRef);
-    }
-    set props(value) {
-        this._props = value;
-        this.assignInputs();
-    }
-    async ngOnInit() {
-        if (this.loadComponent) {
-            const componentType = await this.loadComponent();
-            this.componentRef = this.vcRef.createComponent(componentType);
-            this.assignInputs();
-        }
-    }
-    assignInputs() {
-        if (this.componentRef && this._props) {
-            Object.assign(this.componentRef.instance, this._props);
-            this.componentRef.changeDetectorRef.markForCheck();
-        }
-    }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: CoreLazyMountComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.5", type: CoreLazyMountComponent, isStandalone: true, selector: "core-lazy-mount", inputs: { loadComponent: "loadComponent", props: "props" }, ngImport: i0, template: "", styles: [""] }); }
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: CoreLazyMountComponent, decorators: [{
-            type: Component,
-            args: [{ selector: 'core-lazy-mount', imports: [], template: "" }]
-        }], propDecorators: { loadComponent: [{
-                type: Input
-            }], props: [{
-                type: Input
-            }] } });
-
-class ModuleItemComponent extends BaseComponent {
-    constructor(mls, navigatorService, cdr, menuService) {
-        super(mls);
-        this.mls = mls;
-        this.navigatorService = navigatorService;
-        this.cdr = cdr;
-        this.menuService = menuService;
-        this.$item = input.required();
-        this.$itemPadding = input(5);
-        this.$width = input.required();
-        this.$height = input.required();
-        this.$iconTextVerticalMargin = input(25);
-        this.$active = signal(false);
-        this.iconClickStream$ = new BehaviorSubject('');
-    }
-    ngOnInit() {
-        this.subscriptions.push(this.mls.lang$.subscribe(x => {
-            this.lang = x;
-            this.cdr.markForCheck();
-        }));
-        if (!!localStorage) {
-            const activeRootMenuItemId = Number(localStorage.getItem('activeRootMenuItemId') || '0');
-            const active = activeRootMenuItemId === this.$item()?.id;
-            this.$active.set(active);
-        }
-    }
-    onClick(e, item) {
-        this.iconClickStream$.next(crypto.randomUUID());
-        if (!!item) {
-            this.navigatorService.clickedItem$.next(item);
-        }
-        if (localStorage.getItem('moduleDesignMode') === 'on')
-            return;
-        this.navigatorService.activeRootMenuItemId$.next(item?.id);
-        if (!!localStorage) {
-            localStorage.setItem('activeRootMenuItemId', (item?.id || 0).toString());
-        }
-        this.menuService.isOpen$.next(true); // trigger the LeftBar to be opened at the first time
-    }
-    ngAfterViewInit() {
-        this.subscriptions.push(this.navigatorService.activeRootMenuItemId$.subscribe(x => {
-            const active = x === this.$item()?.id;
-            this.$active.set(active);
-        }));
-        this.subscriptions.push(this.iconClickStream$.pipe(buffer(this.iconClickStream$.pipe(debounceTime(250))), map$1(clicks => clicks.length), filter(clicksLength => clicksLength >= 5))
-            .subscribe(_ => {
-            this.navigatorService.showEditSvg$.next(true);
-        }));
-    }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: ModuleItemComponent, deps: [{ token: MultiLanguageService }, { token: NavigatorService }, { token: i0.ChangeDetectorRef }, { token: MenuService }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.5", type: ModuleItemComponent, isStandalone: true, selector: "app-module-item", inputs: { $item: { classPropertyName: "$item", publicName: "$item", isSignal: true, isRequired: true, transformFunction: null }, $itemPadding: { classPropertyName: "$itemPadding", publicName: "$itemPadding", isSignal: true, isRequired: false, transformFunction: null }, $width: { classPropertyName: "$width", publicName: "$width", isSignal: true, isRequired: true, transformFunction: null }, $height: { classPropertyName: "$height", publicName: "$height", isSignal: true, isRequired: true, transformFunction: null }, $iconTextVerticalMargin: { classPropertyName: "$iconTextVerticalMargin", publicName: "$iconTextVerticalMargin", isSignal: true, isRequired: false, transformFunction: null } }, usesInheritance: true, ngImport: i0, template: "<div class=\"menu-item-wrapper\" \r\n    [class.active] = \"$active()\"\r\n    (click)=\"onClick($event, $item())\" [ngStyle]=\"{\r\n    width: $width() + 'px',\r\n    height: $height() + 'px',\r\n    padding: $itemPadding() + 'px',\r\n    visibility: !!$item() ? 'visible' : 'hidden'\r\n}\">\r\n    @if (!!$item()) {\r\n    <div class=\"d-flex d-flex-v d-flex-center\">\r\n        @if ($item()!.iconSvg) {\r\n        <div class=\"d-block\">\r\n            <i class=\"module-icon\">\r\n                <span [innerHtml]=\"$item()!.iconSvg! | stringHtml\"></span>\r\n            </i>\r\n        </div>\r\n        } @else if ($item()!.iconClass) {\r\n        <div>\r\n            <i [class]=\"$item()!.iconClass + ' module-icon'\"></i>\r\n        </div>\r\n        }\r\n        <div [ngStyle]=\"{\r\n            height: $iconTextVerticalMargin() + 'px'\r\n        }\"></div>\r\n        <div class=\"module-code\" [appTooltip]=\"$item()!.code! | translate: lang\" [ngStyle]=\"{\r\n            width: $width() - $itemPadding() * 2 + 'px'\r\n        }\">{{ $item()!.code! | translate: lang}}</div>\r\n    </div>\r\n    }\r\n</div>", styles: [".menu-item-wrapper{display:flex;align-items:center;justify-content:center;box-sizing:border-box;-webkit-user-select:none;user-select:none}.menu-item-wrapper:not(.active){cursor:pointer}.menu-item-wrapper:not(.active):hover{background-color:var(--color-bg-main)}.menu-item-wrapper.active{color:var(--color-basic-orange)}.module-code{font-size:var(--typo-basic-font-size);overflow:hidden;white-space:nowrap;text-overflow:ellipsis;text-align:center}\n"], dependencies: [{ kind: "directive", type: NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "directive", type: TooltipDirective, selector: "[appTooltip]", inputs: ["appTooltip", "showAnyway", "color", "backgroundColor", "position"] }, { kind: "pipe", type: StringHtmlPipe, name: "stringHtml" }, { kind: "pipe", type: TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: ModuleItemComponent, decorators: [{
-            type: Component,
-            args: [{ selector: 'app-module-item', changeDetection: ChangeDetectionStrategy.OnPush, imports: [
-                        NgStyle,
-                        TooltipDirective,
-                        StringHtmlPipe,
-                        TranslatePipe,
-                    ], template: "<div class=\"menu-item-wrapper\" \r\n    [class.active] = \"$active()\"\r\n    (click)=\"onClick($event, $item())\" [ngStyle]=\"{\r\n    width: $width() + 'px',\r\n    height: $height() + 'px',\r\n    padding: $itemPadding() + 'px',\r\n    visibility: !!$item() ? 'visible' : 'hidden'\r\n}\">\r\n    @if (!!$item()) {\r\n    <div class=\"d-flex d-flex-v d-flex-center\">\r\n        @if ($item()!.iconSvg) {\r\n        <div class=\"d-block\">\r\n            <i class=\"module-icon\">\r\n                <span [innerHtml]=\"$item()!.iconSvg! | stringHtml\"></span>\r\n            </i>\r\n        </div>\r\n        } @else if ($item()!.iconClass) {\r\n        <div>\r\n            <i [class]=\"$item()!.iconClass + ' module-icon'\"></i>\r\n        </div>\r\n        }\r\n        <div [ngStyle]=\"{\r\n            height: $iconTextVerticalMargin() + 'px'\r\n        }\"></div>\r\n        <div class=\"module-code\" [appTooltip]=\"$item()!.code! | translate: lang\" [ngStyle]=\"{\r\n            width: $width() - $itemPadding() * 2 + 'px'\r\n        }\">{{ $item()!.code! | translate: lang}}</div>\r\n    </div>\r\n    }\r\n</div>", styles: [".menu-item-wrapper{display:flex;align-items:center;justify-content:center;box-sizing:border-box;-webkit-user-select:none;user-select:none}.menu-item-wrapper:not(.active){cursor:pointer}.menu-item-wrapper:not(.active):hover{background-color:var(--color-bg-main)}.menu-item-wrapper.active{color:var(--color-basic-orange)}.module-code{font-size:var(--typo-basic-font-size);overflow:hidden;white-space:nowrap;text-overflow:ellipsis;text-align:center}\n"] }]
-        }], ctorParameters: () => [{ type: MultiLanguageService }, { type: NavigatorService }, { type: i0.ChangeDetectorRef }, { type: MenuService }] });
-
-class CoreRootMenuItemPickerComponent extends BaseComponent {
-    constructor(mls, ahs, renderer, navigatorService, layoutService, domService, menuService, sysMenuService, authService, appConfigService) {
-        super(mls);
-        this.mls = mls;
-        this.ahs = ahs;
-        this.renderer = renderer;
-        this.navigatorService = navigatorService;
-        this.layoutService = layoutService;
-        this.domService = domService;
-        this.menuService = menuService;
-        this.sysMenuService = sysMenuService;
-        this.authService = authService;
-        this.appConfigService = appConfigService;
-        this.logoPath = 'data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTE1IiBoZWlnaHQ9IjI5IiB2aWV3Qm94PSIwIDAgMTE1IDI5IiBmaWxsPSJub25lIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciPg0KPHBhdGggZmlsbC1ydWxlPSJldmVub2RkIiBjbGlwLXJ1bGU9ImV2ZW5vZGQiIGQ9Ik0wIDI4LjU1MjhWOC41NzY4NkgyLjU2MzI5VjE2LjgxMzRIMTIuNTIzNVY4LjU3Njg2SDE1LjA4NjhWMjguNTMzOUgxMi41MjM1VjE5LjE0MjNIMi41ODE2VjI4LjUzMzlIMFYyOC41NTI4Wk0xOS4wNzgyIDExLjM2MDJWOC41NzY4NkgyMS40NTg0VjExLjM2MDJIMTkuMDc4MlpNMTkuMDc4MiAyOC41NTI4VjE0LjA4NjhIMjEuNDU4NFYyOC41NTI4SDE5LjA3ODJaTTI0LjIyMzEgMjIuMDc3MkwyOC4wMzE1IDIxLjY3OTZDMjguMjUxMiAyMi45ODYxIDI4LjcyNzIgMjMuOTUxNyAyOS40MjMgMjQuNTc2NkMzMC4xMTg3IDI1LjIwMTQgMzEuMDcwOCAyNS41MDQ0IDMyLjI0MjYgMjUuNTA0NEMzMy40ODc2IDI1LjUwNDQgMzQuNDIxNCAyNS4yMjAzIDM1LjA2MjIgMjQuNjcxMkMzNS43MDMgMjQuMTIyMSAzNi4wMTQzIDIzLjQ5NzMgMzYuMDE0MyAyMi43NTg5QzM2LjAxNDMgMjIuMjg1NSAzNS44ODYxIDIxLjg2ODkgMzUuNjExNSAyMS41NDdDMzUuMzM2OCAyMS4yMjUyIDM0Ljg3OTEgMjAuOTIyMiAzNC4yMiAyMC42NzYxQzMzLjc2MjIgMjAuNTI0NiAzMi43MzY5IDIwLjIyMTYgMzEuMTI1NyAxOS44MDUxQzI5LjAzODUgMTkuMjc0OSAyNy41NzM3IDE4LjYxMjIgMjYuNzQ5OCAxNy44MTY5QzI1LjU1OTcgMTYuNzE4NyAyNC45OTIxIDE1LjM3NDQgMjQuOTkyMSAxMy44MDI4QzI0Ljk5MjEgMTIuNzgwMyAyNS4yNjY4IDExLjgxNDcgMjUuODE2IDEwLjk0MzdDMjYuMzgzNiAxMC4wNTM4IDI3LjE3MDkgOS4zNzIxMSAyOC4yMTQ1IDguOTE3NjhDMjkuMjc2NSA4LjQ0NDMyIDMwLjUyMTUgOC4yMTcxIDMyLjAwNDYgOC4yMTcxQzM0LjQyMTQgOC4yMTcxIDM2LjIzNCA4Ljc2NjIgMzcuNDYwNyA5Ljg2NDQxQzM4LjY4NzQgMTAuOTgxNSAzOS4zMDk5IDEyLjQ1ODQgMzkuMzgzMiAxNC4zMTRMMzUuNDgzMyAxNC40NjU1QzM1LjMxODUgMTMuNDI0MSAzNC45NzA3IDEyLjY4NTcgMzQuNDIxNCAxMi4yNTAyQzMzLjg3MjEgMTEuODE0NyAzMy4wNjY1IDExLjU2ODUgMzEuOTY3OSAxMS41Njg1QzMwLjg1MTEgMTEuNTY4NSAyOS45NzIyIDExLjgxNDcgMjkuMzMxNCAxMi4yODhDMjguOTI4NiAxMi42MDk5IDI4LjcwODkgMTMuMDI2NSAyOC43MDg5IDEzLjUzNzdDMjguNzA4OSAxNC4wMTExIDI4LjkxMDMgMTQuNDI3NiAyOS4yOTQ4IDE0Ljc0OTVDMjkuNzcwOCAxNS4xODUgMzAuOTc5MiAxNS42Mzk1IDMyLjg2NTEgMTYuMTEyOEMzNC43NTA5IDE2LjU2NzIgMzYuMTYwOCAxNy4wNDA2IDM3LjA1NzkgMTcuNTUxOEMzNy45NTUxIDE4LjA0NDEgMzguNjY5MSAxOC43MjU4IDM5LjE4MTggMTkuNTc3OEMzOS42OTQ0IDIwLjQ0ODggMzkuOTUwOCAyMS40OTAyIDM5Ljk1MDggMjIuNzU4OUMzOS45NTA4IDIzLjg5NDkgMzkuNjM5NSAyNC45NzQyIDM5LjAxNyAyNS45Nzc3QzM4LjQxMjggMjYuOTgxMyAzNy41MzQgMjcuNzE5NyAzNi40MTcxIDI4LjE5MzFDMzUuMzAwMiAyOC42ODU0IDMzLjkwODcgMjguOTEyNiAzMi4yMjQzIDI4LjkxMjZDMjkuNzg5MSAyOC45MTI2IDI3LjkwMzMgMjguMzI1NiAyNi42MDMzIDI3LjE3MDZDMjUuMjY2OCAyNS45OTY3IDI0LjQ3OTUgMjQuMjkyNiAyNC4yMjMxIDIyLjA3NzJaTTQ5LjU4MTQgMTQuMDY3OVYxNy4wOTc0SDQ3LjA1NDhWMjIuOTY3MUM0Ny4wNTQ4IDI0LjE0MTEgNDcuMDczMSAyNC44NDE3IDQ3LjEwOTcgMjUuMDQ5OUM0Ny4xNjQ2IDI1LjIzOTMgNDcuMjc0NSAyNS40MDk3IDQ3LjQ1NzYgMjUuNTQyMkM0Ny42MjIzIDI1LjY3NDggNDcuODIzNyAyNS43MzE2IDQ4LjA4MDEgMjUuNzMxNkM0OC40MjggMjUuNzMxNiA0OC45MjIzIDI1LjU5OSA0OS41NjMxIDI1LjM3MThMNDkuODc0NCAyOC4zNDQ2QzQ5LjAxMzkgMjguNzIzMiA0OC4wNjE4IDI4LjkxMjYgNDYuOTYzMiAyOC45MTI2QzQ2LjMwNDEgMjguOTEyNiA0NS42OTk5IDI4Ljc5OSA0NS4xNjg5IDI4LjU3MThDNDQuNjM3OSAyOC4zNDQ2IDQ0LjIzNTEgMjguMDQxNiA0My45Nzg4IDI3LjY2MjlDNDMuNzQwOCAyNy4zMDMyIDQzLjU1NzcgMjYuNzkxOSA0My40NjYxIDI2LjE2NzFDNDMuMzkyOSAyNS43MTI2IDQzLjM1NjMgMjQuODIyNyA0My4zNTYzIDIzLjQ1OTRWMTcuMTE2NEg0MS42NzE4VjE0LjA4NjhINDMuMzU2M1YxMS4yMDg4TDQ3LjA1NDggOC45NTU1NVYxNC4wODY4SDQ5LjU4MTRWMTQuMDY3OVpNNTQuOTI3NyAxOC41MzY0TDUxLjU3NzEgMTcuOTMwNUM1MS45NjE2IDE2LjUxMDQgNTIuNjAyNSAxNS40NjkgNTMuNTE3OSAxNC43ODc0QzU0LjQ1MTcgMTQuMTI0NyA1NS44MjQ5IDEzLjc4MzkgNTcuNjM3NSAxMy43ODM5QzU5LjI4NTMgMTMuNzgzOSA2MC41MTIxIDEzLjk3MzIgNjEuMzE3NyAxNC4zODk4QzYyLjEyMzMgMTQuNzg3NCA2Mi42OTA5IDE1LjI5ODYgNjMuMDIwNCAxNS45MjM1QzYzLjM1IDE2LjU0ODMgNjMuNTE0OCAxNy42ODQ0IDYzLjUxNDggMTkuMzMxN0w2My40NTk4IDIzLjgwMDNDNjMuNDU5OCAyNS4wNjg5IDYzLjUxNDggMjUuOTk2NyA2My42NDI5IDI2LjYwMjZDNjMuNzUyOCAyNy4yMDg1IDYzLjk5MDggMjcuODcxMiA2NC4zMDIxIDI4LjU1MjhINjAuNjQwMkM2MC41MzA0IDI4LjMwNjcgNjAuNDIwNSAyNy45MjggNjAuMjkyMyAyNy40MzU3QzYwLjIzNzQgMjcuMjA4NSA2MC4xODI1IDI3LjA1NyA2MC4xNDU5IDI2Ljk4MTNDNTkuNTIzNCAyNy42MjUgNTguODQ1OSAyOC4wOTg0IDU4LjEzMTkgMjguNDIwM0M1Ny40MTc4IDI4Ljc0MjIgNTYuNjQ4OCAyOC44OTM3IDU1Ljg0MzIgMjguODkzN0M1NC40MTUxIDI4Ljg5MzcgNTMuMjc5OSAyOC40OTYgNTIuNDU2IDI3LjY4MThDNTEuNjMyMSAyNi44ODY2IDUxLjIxMSAyNS44NjQxIDUxLjIxMSAyNC42MTQ0QzUxLjIxMSAyMy44MDAzIDUxLjM5NDEgMjMuMDgwNyA1MS43Nzg1IDIyLjQzN0M1Mi4xNjMgMjEuODEyMSA1Mi42NzU3IDIxLjMwMDkgNTMuMzcxNCAyMC45NjAxQzU0LjA0ODkgMjAuNjM4MiA1NS4wMTkzIDIwLjMzNTIgNTYuMzAwOSAyMC4wNzAxQzU4LjAyMiAxOS43NDgzIDU5LjIzMDQgMTkuNDI2NCA1OS44ODk1IDE5LjE0MjNWMTguNzYzN0M1OS44ODk1IDE4LjAwNjMgNTkuNzA2NSAxNy40OTUgNTkuMzc2OSAxNy4xNzMyQzU5LjAyOSAxNi44NTEzIDU4LjM1MTYgMTYuNjgwOSA1Ny4zODEyIDE2LjY4MDlDNTYuNzIyIDE2LjY4MDkgNTYuMjA5NCAxNi44MzIzIDU1Ljg0MzIgMTcuMDk3NEM1NS40NDA0IDE3LjM4MTQgNTUuMTQ3NCAxNy44NTQ4IDU0LjkyNzcgMTguNTM2NFpNNTkuODg5NSAyMS42NDE3QzU5LjQxMzUgMjEuNzkzMiA1OC42NjI4IDIyLjAwMTUgNTcuNjM3NSAyMi4yMjg3QzU2LjYxMjIgMjIuNDU1OSA1NS45NTMxIDIyLjY4MzEgNTUuNjIzNSAyMi44OTE0QzU1LjE0NzQgMjMuMjUxMiA1NC44OTExIDIzLjY4NjYgNTQuODkxMSAyNC4yMzU3QzU0Ljg5MTEgMjQuNzg0OSA1NS4wNzQyIDI1LjIzOTMgNTUuNDc3IDI1LjYzNjlDNTUuODYxNSAyNi4wMzQ1IDU2LjMzNzUgMjYuMjIzOSA1Ni45NDE3IDI2LjIyMzlDNTcuNjE5MiAyNi4yMjM5IDU4LjI2IDI1Ljk5NjcgNTguODY0MiAyNS41NDIyQzU5LjMwMzYgMjUuMjAxNCA1OS41OTY2IDI0Ljc4NDkgNTkuNzQzMSAyNC4yNzM2QzU5LjgzNDYgMjMuOTUxNyA1OS44ODk1IDIzLjMwOCA1OS44ODk1IDIyLjM5OTFWMjEuNjQxN1pNNjUuNTQ3MSAxNC4wNjc5SDY3LjU5NzdWMTIuOTg4NkM2Ny41OTc3IDExLjc1NzkgNjcuNzI1OSAxMC44Njc5IDY3Ljk4MjIgMTAuMjYyQzY4LjIzODYgOS42NTYxMyA2OC42OTYzIDkuMTYzODMgNjkuMzczNyA4Ljc4NTE0QzcwLjA1MTIgOC40MDY0NSA3MC45MTE3IDguMjE3MSA3MS45MzcgOC4yMTcxQzcyLjk5OSA4LjIxNzEgNzQuMDQyNiA4LjM2ODU4IDc1LjA0OTYgOC43MDk0TDc0LjU3MzYgMTEuMzYwMkM3My45Njk0IDExLjIwODggNzMuMzgzNSAxMS4xMzMgNzIuODUyNSAxMS4xMzNDNzIuMzAzMiAxMS4xMzMgNzEuOTE4NyAxMS4yNjU2IDcxLjY2MjQgMTEuNTMwN0M3MS40MDYxIDExLjc5NTcgNzEuMzE0NSAxMi4yODggNzEuMzE0NSAxMy4wNDU0VjE0LjA2NzlINzQuMDc5MlYxNy4wNzg1SDcxLjMxNDVWMjguNTMzOUg2Ny42MTZWMTcuMDc4NUg2NS41NjU0VjE0LjA2NzlINjUuNTQ3MVpNNzQuNTE4NiAxNC4wNjc5SDc2LjU2OTNWMTIuOTg4NkM3Ni41NjkzIDExLjc1NzkgNzYuNjk3NCAxMC44Njc5IDc2Ljk1MzggMTAuMjYyQzc3LjIxMDEgOS42NTYxMyA3Ny42Njc4IDkuMTYzODMgNzguMzQ1MyA4Ljc4NTE0Qzc5LjAyMjcgOC40MDY0NSA3OS44ODMyIDguMjE3MSA4MC45MDg2IDguMjE3MUM4MS45NzA1IDguMjE3MSA4My4wMTQxIDguMzY4NTggODQuMDIxMSA4LjcwOTRMODMuNTQ1MSAxMS4zNjAyQzgyLjk0MDkgMTEuMjA4OCA4Mi4zNTUgMTEuMTMzIDgxLjgwNTcgMTEuMTMzQzgxLjI1NjQgMTEuMTMzIDgwLjg3MTkgMTEuMjY1NiA4MC42MTU2IDExLjUzMDdDODAuMzk1OSAxMS43OTU3IDgwLjI2NzcgMTIuMjg4IDgwLjI2NzcgMTMuMDQ1NFYxNC4wNjc5SDgzLjAzMjRWMTcuMDc4NUg4MC4yNjc3VjI4LjUzMzlINzYuNTY5M1YxNy4wNzg1SDc0LjUxODZWMTQuMDY3OVoiIGZpbGw9ImJsYWNrIi8+DQo8cGF0aCBmaWxsLXJ1bGU9ImV2ZW5vZGQiIGNsaXAtcnVsZT0iZXZlbm9kZCIgZD0iTTk4LjY0OTggNS4yNDQ3N0M5Ny45NTQgMi43ODMyOCA5NS42NDcxIDIuNDA0NTkgOTMuNzI0NiAzLjc2Nzg4QzkxLjc0NzIgNS4xNjkwMyA5MC40Mjg5IDguMTk4NTcgOTEuMTA2NCAxMC42MjIyQzkxLjgwMjEgMTMuMDgzNyA5NC4xMDkxIDEzLjQ2MjQgOTYuMDMxNiAxMi4xMThDOTguMDA5IDEwLjcxNjkgOTkuMzI3MiA3LjY2ODQgOTguNjQ5OCA1LjI0NDc3WiIgZmlsbD0iI0YzNzU0MCIvPg0KPHBhdGggZmlsbC1ydWxlPSJldmVub2RkIiBjbGlwLXJ1bGU9ImV2ZW5vZGQiIGQ9Ik05MS4xNDI4IDI3LjgxNDlDOTEuOTMwMSAyNy4xMTQzIDkyLjk3MzggMjYuNDUxNiA5My44MTYgMjUuODgzNkw5NS40NjM4IDI0LjgyMzJDOTcuODQ0IDIwLjAzMjggMTAxLjA0OCAxNS41NDUzIDEwNC40MTcgMTEuNDU1NEMxMDcuNDkzIDcuNjg3NDQgMTExLjA4MiAzLjc0OTA1IDExNSAwLjkwODg2TDExNC4zNDEgMEMxMTAuMTQ4IDIuMjkxMDggMTA2LjMwMyA1LjQxNTI5IDEwMi44NDIgOC43NjY3MUM5OS4xOTg5IDEyLjMwNzUgOTUuODQ4MyAxNi4yMjY5IDkzLjE1NjggMjAuNTgxOUw5My4wNDcgMjAuNzMzNEw5Mi4yNzggMTkuMDY3MUM5MS43MTA0IDE3Ljg1NTMgOTAuMTM1OCAxNC42NTU0IDg4LjU0MjkgMTQuNjU1NEM4Ni45NSAxNC42NTU0IDg1LjQzMDMgMTUuODI5MyA4NC4zMTM1IDE2Ljk0NjRDODUuMzAyMiAxNy4zMDYyIDg2LjEyNjEgMTcuOTg3OCA4Ni43ODUyIDE4LjgyMUM4Ny44MTA1IDIwLjA3MDYgODguNjM0NSAyMS43NzQ4IDg5LjI5MzYgMjMuMjcwNkw4OS45MTYxIDI0LjY3MTdDOTAuMzE4OSAyNS42NzUzIDkwLjgxMzMgMjYuNzkyNCA5MS4xNDI4IDI3LjgxNDlaIiBmaWxsPSIjRjM3NTQwIi8+DQo8L3N2Zz4NCg==';
-        this.itemsPerRow = 4;
-        this.iconTextVerticalMargin = 25;
-        this.items = [[]];
-        this.zIndex = 1;
-        this.imageErrorResolverType = EnumImageResolverType.LOGO;
-        this.headerHeight = 0;
-        this.width = 400;
-        this.layoutService.modulePanelWidth$.subscribe(x => this.width = x);
-    }
-    ngOnInit() {
-        this.subscriptions.push(this.mls.lang$.subscribe(x => this.lang = x));
-        this.subscriptions.push(this.authService.data$.subscribe(x => this.isRoot = !!x?.isRoot));
-        this.scrollWidth = this.layoutService.modulePanelWidth$.value - this.layoutService.basicSpacing * 2;
-        this.scrollHeight = window.innerHeight - this.layoutService.headerHeight$.value - this.layoutService.basicSpacing * 2;
-        this.itemWidth = this.scrollWidth / 4;
-    }
-    transformTo2DArray(flatList) {
-        const result = [];
-        for (let i = 0; i < flatList.length; i += this.itemsPerRow) {
-            const row = flatList.slice(i, i + this.itemsPerRow);
-            // If the last row has fewer than itemsPerRow, pad it with undefineds
-            while (row.length < this.itemsPerRow) {
-                row.push(undefined);
-            }
-            result.push(row);
-        }
-        return result;
-    }
-    ngAfterViewInit() {
-        setTimeout(() => {
-            this.designMode = localStorage.getItem('moduleDesignMode') === 'on';
-            this.zIndex = this.domService.getMaxZIndex() + 1;
-            // this.listenerFn = this.renderer.listen('window', 'click', (e: Event) => {
-            //   if (!this.designMode) {
-            //     if (this.container && !!!this.container.nativeElement.contains(e.target)) {
-            //       this.ahs.activeKey$.next(undefined);
-            //     }
-            //   }
-            // });
-            this.subscriptions.push(this.navigatorService.rootNavigatorItems$.subscribe(x => {
-                // Transform the flat list into a 2D array
-                this.items = this.transformTo2DArray(x);
-            }));
-            this.subscriptions.push(this.layoutService.headerHeight$.subscribe(x => {
-                this.headerHeight = x;
-            }));
-            if (!!localStorage) {
-                const activeRootMenuItemId = Number(localStorage.getItem('activeRootMenuItemId') || '0');
-                this.navigatorService.activeRootMenuItemId$.next(activeRootMenuItemId);
-            }
-            if (window.innerWidth < this.layoutService.modulePanelWidth$.value) {
-                this.layoutService.modulePanelWidth$.next(window.innerWidth);
-            }
-        });
-    }
-    onDesignModeClick(e) {
-        e.stopPropagation();
-        if (localStorage.getItem('moduleDesignMode') === 'on') {
-            localStorage.setItem('moduleDesignMode', 'off');
-            this.designMode = false;
-        }
-        else {
-            localStorage.setItem('moduleDesignMode', 'on');
-            this.designMode = true;
-        }
-    }
-    ngOnDestroy() {
-        this.subscriptions.map(x => x?.unsubscribe());
-        if (this.listenerFn)
-            this.listenerFn();
-    }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: CoreRootMenuItemPickerComponent, deps: [{ token: MultiLanguageService }, { token: ApplicationHelpService }, { token: i0.Renderer2 }, { token: NavigatorService }, { token: LayoutService }, { token: DomService }, { token: MenuService }, { token: SysMenuService }, { token: AuthService }, { token: AppConfigService }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.5", type: CoreRootMenuItemPickerComponent, isStandalone: true, selector: "core-root-menu-item-picker", inputs: { logoPath: "logoPath", itemsPerRow: "itemsPerRow", iconTextVerticalMargin: "iconTextVerticalMargin" }, viewQueries: [{ propertyName: "container", first: true, predicate: ["container"], descendants: true }], usesInheritance: true, ngImport: i0, template: "<div #container class=\"core-root-menu-item-picker-container\" [ngStyle]=\"{\r\n    zIndex: zIndex,\r\n}\">\r\n    <div class=\"mudule-picker-header d-flex d-flex-between\" [ngStyle]=\"{\r\n        height: 59 + 'px'\r\n    }\">\r\n        <div class=\"HEADER_LOGO\">\r\n            <div class=\"logo-wrapper d-flex\">\r\n                <img src=\"logoPath\" class=\"lg\" [ngStyle]=\"{\r\n                    width: '130px',\r\n                    height: '59px',\r\n                    transform: 'translate(0, -5px)'\r\n                }\" appImageErrorResolver [type]=\"imageErrorResolverType\">\r\n            </div>\r\n        </div>\r\n        @if (!!isRoot) {\r\n            <i \r\n                [class.feather-square]=\"!designMode\" \r\n                [class.feather-play]=\"!!designMode\" \r\n                class=\"stop-mode-icon\" \r\n                (click)=\"onDesignModeClick($event)\"\r\n                [appTooltip]=\"!designMode ? 'Chuy\u1EC3n sang ch\u1EBF \u0111\u1ED9 thi\u1EBFt k\u1EBF' : 'Chuy\u1EC3n v\u1EC1 ch\u1EBF \u0111\u1ED9 b\u00ECnh th\u01B0\u1EDDng'\"\r\n            ></i>\r\n        }\r\n    </div>\r\n\r\n    <div class=\"header-bottom\" [ngStyle]=\"{\r\n        width: width + 'px'\r\n    }\">\r\n        <core-line></core-line>\r\n    </div>\r\n\r\n    <div class=\"h15\"></div>\r\n\r\n    <div class=\"scroll\" [ngStyle]=\"{\r\n        width: width + 'px',\r\n        height: scrollHeight + 'px'\r\n    }\">\r\n        @for (row of items; track $index) {\r\n            <div class=\"menu-row\">\r\n                @for (item of row; track $index) {\r\n                    <app-module-item [$item]=\"item\" [$width]=\"itemWidth\" [$height]=\"100\" [$iconTextVerticalMargin]=\"iconTextVerticalMargin\"></app-module-item>\r\n                }\r\n            </div>\r\n        }\r\n    </div>\r\n\r\n</div>", styles: [".core-root-menu-item-picker-container .header-bottom{position:absolute;top:59px;left:0}.core-root-menu-item-picker-container .scroll{overflow-x:hidden;overflow-y:auto;display:flex;flex-direction:column;align-items:flex-start;flex-wrap:wrap;-ms-overflow-style:none}.core-root-menu-item-picker-container .scroll::-webkit-scrollbar{display:none}.core-root-menu-item-picker-container .menu-row{display:flex;flex-wrap:nowrap;justify-content:space-between}.core-root-menu-item-picker-container .stop-mode-icon{cursor:pointer;width:24px;height:24px;font-size:24px}\n"], dependencies: [{ kind: "component", type: CoreLineComponent, selector: "core-line" }, { kind: "directive", type: NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "component", type: ModuleItemComponent, selector: "app-module-item", inputs: ["$item", "$itemPadding", "$width", "$height", "$iconTextVerticalMargin"] }, { kind: "directive", type: ImageErrorResolverDirective, selector: "[appImageErrorResolver]", inputs: ["type", "isFemale"] }, { kind: "directive", type: TooltipDirective, selector: "[appTooltip]", inputs: ["appTooltip", "showAnyway", "color", "backgroundColor", "position"] }] }); }
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: CoreRootMenuItemPickerComponent, decorators: [{
-            type: Component,
-            args: [{ selector: 'core-root-menu-item-picker', imports: [
-                        CoreLineComponent,
-                        NgStyle,
-                        ModuleItemComponent,
-                        ImageErrorResolverDirective,
-                        TooltipDirective,
-                    ], template: "<div #container class=\"core-root-menu-item-picker-container\" [ngStyle]=\"{\r\n    zIndex: zIndex,\r\n}\">\r\n    <div class=\"mudule-picker-header d-flex d-flex-between\" [ngStyle]=\"{\r\n        height: 59 + 'px'\r\n    }\">\r\n        <div class=\"HEADER_LOGO\">\r\n            <div class=\"logo-wrapper d-flex\">\r\n                <img src=\"logoPath\" class=\"lg\" [ngStyle]=\"{\r\n                    width: '130px',\r\n                    height: '59px',\r\n                    transform: 'translate(0, -5px)'\r\n                }\" appImageErrorResolver [type]=\"imageErrorResolverType\">\r\n            </div>\r\n        </div>\r\n        @if (!!isRoot) {\r\n            <i \r\n                [class.feather-square]=\"!designMode\" \r\n                [class.feather-play]=\"!!designMode\" \r\n                class=\"stop-mode-icon\" \r\n                (click)=\"onDesignModeClick($event)\"\r\n                [appTooltip]=\"!designMode ? 'Chuy\u1EC3n sang ch\u1EBF \u0111\u1ED9 thi\u1EBFt k\u1EBF' : 'Chuy\u1EC3n v\u1EC1 ch\u1EBF \u0111\u1ED9 b\u00ECnh th\u01B0\u1EDDng'\"\r\n            ></i>\r\n        }\r\n    </div>\r\n\r\n    <div class=\"header-bottom\" [ngStyle]=\"{\r\n        width: width + 'px'\r\n    }\">\r\n        <core-line></core-line>\r\n    </div>\r\n\r\n    <div class=\"h15\"></div>\r\n\r\n    <div class=\"scroll\" [ngStyle]=\"{\r\n        width: width + 'px',\r\n        height: scrollHeight + 'px'\r\n    }\">\r\n        @for (row of items; track $index) {\r\n            <div class=\"menu-row\">\r\n                @for (item of row; track $index) {\r\n                    <app-module-item [$item]=\"item\" [$width]=\"itemWidth\" [$height]=\"100\" [$iconTextVerticalMargin]=\"iconTextVerticalMargin\"></app-module-item>\r\n                }\r\n            </div>\r\n        }\r\n    </div>\r\n\r\n</div>", styles: [".core-root-menu-item-picker-container .header-bottom{position:absolute;top:59px;left:0}.core-root-menu-item-picker-container .scroll{overflow-x:hidden;overflow-y:auto;display:flex;flex-direction:column;align-items:flex-start;flex-wrap:wrap;-ms-overflow-style:none}.core-root-menu-item-picker-container .scroll::-webkit-scrollbar{display:none}.core-root-menu-item-picker-container .menu-row{display:flex;flex-wrap:nowrap;justify-content:space-between}.core-root-menu-item-picker-container .stop-mode-icon{cursor:pointer;width:24px;height:24px;font-size:24px}\n"] }]
-        }], ctorParameters: () => [{ type: MultiLanguageService }, { type: ApplicationHelpService }, { type: i0.Renderer2 }, { type: NavigatorService }, { type: LayoutService }, { type: DomService }, { type: MenuService }, { type: SysMenuService }, { type: AuthService }, { type: AppConfigService }], propDecorators: { logoPath: [{
-                type: Input
-            }], itemsPerRow: [{
-                type: Input
-            }], iconTextVerticalMargin: [{
-                type: Input
-            }], container: [{
-                type: ViewChild,
-                args: ['container']
-            }] } });
-
-class CoreRootMenuItemPickerService {
-    constructor() { }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: CoreRootMenuItemPickerService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
-    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: CoreRootMenuItemPickerService, providedIn: 'root' }); }
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: CoreRootMenuItemPickerService, decorators: [{
-            type: Injectable,
-            args: [{
-                    providedIn: 'root'
-                }]
-        }], ctorParameters: () => [] });
-
-class ComPartyService {
-    constructor(recursiveService, alertService) {
-        this.recursiveService = recursiveService;
-        this.alertService = alertService;
-        this.instances = [];
-        this.loading = true;
-        this.comTreeData$ = new BehaviorSubject([]);
-        this.comTreeDataWithPeople$ = new BehaviorSubject([]);
-        this.linerData$ = new BehaviorSubject([]);
-        this.buildTreeFlag$ = new BehaviorSubject(false);
-        this.status$ = new BehaviorSubject({
-            selectedKey: undefined,
-            activeKeys: [],
-            checkedKeys: [],
-            expandedKeys: [],
-            checkInheritance: true
-        });
-        this.linerData$.subscribe(xs => {
-            const idCountMap = new Map();
-            xs.forEach(item => {
-                const id = item.id;
-                idCountMap.set(id, (idCountMap.get(id) ?? 0) + 1);
-            });
-            const duplicates = Array.from(idCountMap.entries())
-                .filter(([_, count]) => count > 1)
-                .map(([id]) => id);
-            if (!!duplicates.length) {
-                if (isDevMode()) {
-                    alertService.error('🔁 Duplicate IDs: ' + duplicates.reduce((a, c) => a + ";" + c, ''), alertOptions);
-                }
-            }
-        });
-    }
-    buildTreeData(status = {
-        selectedKey: undefined,
-        activeKeys: [],
-        checkedKeys: [],
-        expandedKeys: [],
-        checkInheritance: true
-    }) {
-        this.loading = true;
-        const cloneCopy = JSON.parse(JSON.stringify(this.linerData$.value));
-        if (typeof Worker !== 'undefined') {
-            // Create a new
-            console.log("🟢🟢 Worker works");
-            const worker = new Worker(liner_to_nested_array_script);
-            worker.addEventListener('message', ({ data }) => {
-                const newData = data.list;
-                this.comTreeData$.next(newData);
-                this.loading = false;
-            });
-            worker.postMessage({
-                list: cloneCopy,
-                keyField: 'id',
-                titleField: 'name',
-                parentField: 'parentId',
-                activeField: 'active',
-                checkedField: 'checked',
-                expandedField: 'expand',
-                status
-            });
-        }
-        else {
-            // Web workers are not supported in this environment.
-            // You should add a fallback so that your program still executes correctly.
-            this.recursiveService
-                .linerArrayToNestedArray(cloneCopy, 'id', 'name', 'parentId', 'active', 'checked', 'expand', status)
-                .subscribe((obj) => {
-                const newData = obj.list;
-                this.comTreeData$.next(newData);
-                this.loading = false;
-            });
-        }
-    }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: ComPartyService, deps: [{ token: RecursiveService }, { token: AlertService }], target: i0.ɵɵFactoryTarget.Injectable }); }
-    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: ComPartyService, providedIn: 'root' }); }
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: ComPartyService, decorators: [{
-            type: Injectable,
-            args: [{
-                    providedIn: 'root'
-                }]
-        }], ctorParameters: () => [{ type: RecursiveService }, { type: AlertService }] });
-
-class CoreComTreeComponent extends CoreFormControlBaseComponent {
-    writeValue(obj) {
-        this.value = obj;
-        switch (this.accessorMode) {
-            case EnumCoreOrgTreeaAccessorMode.CHECKED:
-                if (!!obj) {
-                    const checkedKeys = [];
-                    this.checkedIds = obj; // <=== 24/10/2023
-                    obj.map(x => checkedKeys.push(x.toString()));
-                    this.loading = true;
-                    this.recursiveService.writeValueChecked(checkedKeys, this.data, this.disabledLoopExpand).subscribe(_ => {
-                        this.loading = false;
-                        if (!!this.data && !!this.data?.length)
-                            this.data[0].tree$Expanded = true;
-                    });
-                }
-                break;
-            case EnumCoreOrgTreeaAccessorMode.ACTIVATED_SINGLE:
-            case EnumCoreOrgTreeaAccessorMode.ACTIVATED_INHERITANCE:
-                if (!!obj) {
-                    const activatedKeys = [];
-                    obj.map(x => activatedKeys.push(x.toString()));
-                    this.loading = true;
-                    this.recursiveService.writeValueActivated(activatedKeys, this.data, this.disabledLoopExpand).subscribe(_ => {
-                        this.loading = false;
-                        if (!!this.data && !!this.data?.length)
-                            this.data[0].tree$Expanded = true;
-                    });
-                }
-                break;
-            default:
-                break;
-        }
-        if (this.accessorMode === EnumCoreOrgTreeaAccessorMode.CHECKED) {
-        }
-        else /* EnumCoreOrgTreeaAccessorMode.ACTIVATED_SINGLE or EnumCoreOrgTreeaAccessorMode.ACTIVATED_INHERITANCE */ {
-        }
-    }
-    setDisabledState(disabled) {
-        this.disabled = disabled;
-    }
-    constructor(
-    //public override injector: Injector,
-    authService, recursiveService, mls, layoutService, coreOrgTreeService, 
-    // private coreOrgTreeState: CoreOrgTreeState,
-    alertService, organizationService) {
-        super( /*injector*/);
-        this.authService = authService;
-        this.recursiveService = recursiveService;
-        this.mls = mls;
-        this.layoutService = layoutService;
-        this.coreOrgTreeService = coreOrgTreeService;
-        this.alertService = alertService;
-        this.organizationService = organizationService;
-        this.lineColor = 'transparent';
-        this.accessorMode = EnumCoreOrgTreeaAccessorMode.CHECKED;
-        //TO BE NEW
-        this.searchMode = EnumCoreOrgTreeaSearchMode.REDUCE;
-        this.excludedIds$ = new BehaviorSubject([]); // 2024-05-10: to be implemented
-        this.stateIsolated$ = new BehaviorSubject(false);
-        this.itemDoubleClick = new EventEmitter();
-        this.itemClick = new EventEmitter();
-        this.showSearch = false;
-        this.hiddenToolClickStream$ = new BehaviorSubject('');
-        this.value = [];
-        this.activeIds = [];
-        this.checkedIds = [];
-        this.subscriptions = [];
-        this.search$ = new Subject();
-        this.searchPlaceholder = "Tìm kiếm...";
-        this.checkInheritance = true; // default value is true
-        this.showDissolved = false; // default value is false
-        this.initializing = true;
-        // this.reduced$ = this.coreOrgTreeState.coreOrgTreeReduced$;
-        this.initializing = false;
-    }
-    ngOnChanges(changes) {
-        if (changes['height']) {
-            this.resizeHeight();
-        }
-    }
-    ngOnInit() {
-        super.register();
-        //this.layoutService.leftbarOpen$.next(false);
-        this.instanceNumber = new Date().getTime();
-        const newInstance = {
-            instanceNumber: this.instanceNumber,
-            selectedKey$: new BehaviorSubject(undefined),
-            activeKeys$: new BehaviorSubject([]),
-            checkedKeys$: new BehaviorSubject([]),
-            expandedKeys$: new BehaviorSubject([]),
-            checkInheritance$: new BehaviorSubject(true)
-        };
-        this.organizationService.instances.push(newInstance);
-        // Check xem chiều cao height có được truyền vào hay không
-        if (this.height === undefined) {
-            if (isDevMode()) {
-                //this.alertService.warn("CoreOrgTree không nhận được chiều cao (height) truyền vào từ lớp ngoài. Chiều cao mặc định sẽ được tính toán dựa vào bố cục chính.", alertOptions);
-            }
-            this.subscriptions.push(this.layoutService.contentContainerHeight$.subscribe(x => {
-                // basicSpacing là paddingBottom của lớp content-container
-                this.height = x - this.layoutService.corePageHeaderHeight - this.layoutService.basicSpacing;
-            }));
-        }
-        this.subscriptions.push(this.organizationService.linerData$.subscribe((x) => {
-            this.linnerOrgArray = x;
-        }));
-        this.subscriptions.push(this.organizationService.buildTreeFlag$.pipe(skip(1)).subscribe(_ => {
-            this.buildTreeData();
-        }));
-        this.subscriptions.push(this.stateIsolated$.subscribe(x => {
-            if (x) {
-                if (!!this.statusSubscription) {
-                    this.statusSubscription.unsubscribe();
-                }
-            }
-            else {
-                if (!this.statusSubscription) {
-                    this.statusSubscription = this.organizationService.status$.subscribe((x) => {
-                        console.log("this.organizationService.status$ changes", x);
-                        const newActiveIds = [];
-                        x.activeKeys.map((k) => {
-                            newActiveIds.push(Number(k));
-                        });
-                        this.activeIds = newActiveIds;
-                        if (this.accessorMode !== EnumCoreOrgTreeaAccessorMode.CHECKED) {
-                            this.value = this.activeIds;
-                            this.onChange(this.activeIds);
-                        }
-                        this.selectedKey = x.selectedKey;
-                    });
-                }
-            }
-        }));
-        this.subscriptions.push(this.coreOrgTreeService.showSearch$.subscribe(x => this.showSearch = x));
-        this.subscriptions.push(this.hiddenToolClickStream$.pipe(buffer(this.hiddenToolClickStream$.pipe(debounceTime(250))), map$1(clicks => clicks.length), filter(clicksLength => clicksLength >= 5))
-            .subscribe(_ => {
-            this.coreOrgTreeService.showSearch$.next(!this.coreOrgTreeService.showSearch$.value);
-        }));
-        this.subscriptions.push(this.search$
-            .pipe(filter((x) => x !== null), debounceTime(500), distinctUntilChanged(), switchMap((text) => {
-            console.log('switchMap works');
-            this.loading = true;
-            // AUG 2024 NEW : MUST BE TESTED
-            if (this.searchMode === EnumCoreOrgTreeaSearchMode.HIGHLIGHT) {
-                return this.recursiveService.findItem(text, this.data);
-            }
-            else {
-                return of(this.recursiveService.reducingFilter(this.scrollContainer, text));
-            }
-        }))
-            .subscribe((x) => {
-            this.loading = false;
-            // if (this.searchMode === EnumCoreOrgTreeaSearchMode.REDUCE) {
-            //   this.dataFiltered = x as IOrgTreeItem[];
-            // }
-        }));
-        this.subscriptions.push(this.organizationService.status$
-            .pipe(filter((value) => !!!this.initializing && !!value))
-            .subscribe((x) => {
-            if (!!localStorage) {
-                localStorage.setItem('coreOrgTreeStatus', JSON.stringify(x));
-            }
-        }));
-        this.subscriptions.push(this.mls.lang$.subscribe((x) => (this.lang = x)));
-    }
-    resizeHeight() {
-        // height is not given and the tree resize as standard
-        if (!!!this.height) {
-            const sizeHeaderHeight = Number(getComputedStyle(document.documentElement)
-                .getPropertyValue('--size-header-height')
-                .replace('px', ''));
-            const sizeCorePageHeaderHeight = Number(getComputedStyle(document.documentElement)
-                .getPropertyValue('--size-core-page-header-height')
-                .replace('px', ''));
-            const containerHeight = window.innerHeight - sizeHeaderHeight - sizeCorePageHeaderHeight;
-            const pageHeaderHeight = Number(getComputedStyle(document.documentElement)
-                .getPropertyValue('--size-core-page-header-height')
-                .replace('px', ''));
-            const paginationHeight = Number(getComputedStyle(document.documentElement)
-                .getPropertyValue('--size-core-pagination-height')
-                .replace('px', ''));
-            const sizeMarginCorePaginationFull = Number(getComputedStyle(document.documentElement)
-                .getPropertyValue('--size-margin-core-pagination')
-                .replace('px', ''));
-            const height = containerHeight - pageHeaderHeight - paginationHeight + sizeMarginCorePaginationFull;
-            console.log(height);
-            this.container?.nativeElement.style.setProperty('--height', height + 'px');
-        }
-        else {
-            this.container?.nativeElement.style.setProperty('--height', this.height + 'px');
+class CoreLazyMountComponent {
+    constructor() {
+        this.vcRef = inject(ViewContainerRef);
+    }
+    set props(value) {
+        this._props = value;
+        this.assignInputs();
+    }
+    async ngOnInit() {
+        if (this.loadComponent) {
+            const componentType = await this.loadComponent();
+            this.componentRef = this.vcRef.createComponent(componentType);
+            this.assignInputs();
         }
     }
-    ngAfterViewInit() {
-        setTimeout(() => {
-            this.subscriptions.push(this.organizationService.comTreeData$.subscribe((x) => {
-                this.data = x;
-                //this.dataFiltered = JSON.parse(JSON.stringify(x));
-                console.log("new Data coming", this.data, new Date().getTime());
-                if (!!this.data) {
-                    if (!!this.data.length)
-                        this.data[0].tree$Expanded = true;
-                }
-            }));
-            this.subscriptions.push(this.coreOrgTreeService.arrowFontSize$.subscribe(x => {
-                this.container?.nativeElement.style.setProperty('--arrow-font-size', x + 'px');
-            }));
-            this.subscriptions.push(this.coreOrgTreeService.titleWrapperMaxWidth$.pipe(filter(x => !!x)).subscribe(x => {
-                this.container?.nativeElement.style.setProperty('--title-wrapper-max-width', x + 'px');
-            }));
-            this.subscriptions.push(this.organizationService.status$.subscribe(x => {
-                if (this.accessorMode === EnumCoreOrgTreeaAccessorMode.ACTIVATED_INHERITANCE && !!x.activeKeys) {
-                    this.onChange(x.activeKeys.map(i => Number(i)));
-                }
-                else if (this.accessorMode === EnumCoreOrgTreeaAccessorMode.ACTIVATED_SINGLE) {
-                    // tạm thời bỏ qua
-                }
-                else if (this.accessorMode === EnumCoreOrgTreeaAccessorMode.CHECKED && !!x.checkedKeys) {
-                    this.onChange(x.checkedKeys.map(i => Number(i)));
-                }
-            }));
-        });
+    assignInputs() {
+        if (this.componentRef && this._props) {
+            Object.assign(this.componentRef.instance, this._props);
+            this.componentRef.changeDetectorRef.markForCheck();
+        }
     }
-    onItemClickLocal(e) {
-        this.linnerOrgArray.map((x) => (x.active = false));
-        setTimeout(() => this.buildTreeData());
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: CoreLazyMountComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.5", type: CoreLazyMountComponent, isStandalone: true, selector: "core-lazy-mount", inputs: { loadComponent: "loadComponent", props: "props" }, ngImport: i0, template: "", styles: [""] }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: CoreLazyMountComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'core-lazy-mount', imports: [], template: "" }]
+        }], propDecorators: { loadComponent: [{
+                type: Input
+            }], props: [{
+                type: Input
+            }] } });
+
+class ModuleItemComponent extends BaseComponent {
+    constructor(mls, navigatorService, cdr, menuService) {
+        super(mls);
+        this.mls = mls;
+        this.navigatorService = navigatorService;
+        this.cdr = cdr;
+        this.menuService = menuService;
+        this.$item = input.required();
+        this.$itemPadding = input(5);
+        this.$width = input.required();
+        this.$height = input.required();
+        this.$iconTextVerticalMargin = input(25);
+        this.$active = signal(false);
+        this.iconClickStream$ = new BehaviorSubject('');
     }
-    onToggleItem(e) {
-        const cloneCopy = JSON.parse(JSON.stringify(this.linnerOrgArray));
-        const filter = cloneCopy.filter((x) => x.id === e.id);
-        if (filter.length === 1) {
-            filter[0].expand = !!!e.expand;
+    ngOnInit() {
+        this.subscriptions.push(this.mls.lang$.subscribe(x => {
+            this.lang = x;
+            this.cdr.markForCheck();
+        }));
+        if (!!localStorage) {
+            const activeRootMenuItemId = Number(localStorage.getItem('activeRootMenuItemId') || '0');
+            const active = activeRootMenuItemId === this.$item()?.id;
+            this.$active.set(active);
         }
-        this.linnerOrgArray = cloneCopy;
-        setTimeout(() => this.buildTreeData());
     }
-    // buildTreeData(): void {
-    //   this.loading = true;
-    //   const cloneCopy = JSON.parse(JSON.stringify(this.linnerOrgArray));
-    //   if (typeof Worker !== 'undefined') {
-    //     // Create a new
-    //     console.log("🟢🟢 Worker works");
-    //     this.worker = new Worker(liner_to_nested_array_script);
-    //     this.worker.addEventListener('message', ({ data }) => {
-    //       this.data = data.list;
-    //       //this.dataFiltered = JSON.parse(JSON.stringify(data.list));
-    //       if (!!this.data && !!this.data?.length) this.data[0].tree$Expanded = true;
-    //       this.loading = false;
-    //     });
-    //     this.worker.postMessage({
-    //       list: cloneCopy,
-    //       keyField: 'id',
-    //       titleField: 'name',
-    //       parentField: 'parentId',
-    //       activeField: 'active',
-    //       //inheritantActiveField: 'inheritantActive',
-    //       checkedField: 'checked',
-    //       expandedField: 'expand',
-    //     });
-    //   } else {
-    //     // Web workers are not supported in this environment.
-    //     // You should add a fallback so that your program still executes correctly.
-    //     const status = this.organizationService.status$.value;
-    //     this.subscriptions.push(
-    //       this.recursiveService
-    //         .linerArrayToNestedArray(
-    //           cloneCopy,
-    //           'id',
-    //           'name',
-    //           'parentId',
-    //           'active',
-    //           'checked',
-    //           'expand',
-    //           //status
-    //         )
-    //         .subscribe((obj) => {
-    //           this.data = obj.list;
-    //           //this.dataFiltered = JSON.parse(JSON.stringify(obj.list));
-    //           if (!!this.data && !!this.data?.length) this.data[0].tree$Expanded = true;
-    //           this.loading = false;
-    //         })
-    //     );
-    //   }
-    // }
-    buildTreeData() {
-        this.loading = true;
-        const cloneCopy = JSON.parse(JSON.stringify(this.linnerOrgArray));
-        // ✅ ADD THIS FILTER
-        const filteredList = !this.showDissolved
-            ? cloneCopy.filter(x => x.active === true)
-            : cloneCopy;
-        if (typeof Worker !== 'undefined') {
-            this.worker = new Worker(liner_to_nested_array_script);
-            this.worker.addEventListener('message', ({ data }) => {
-                this.data = data.list;
-                if (!!this.data?.length)
-                    this.data[0].tree$Expanded = true;
-                this.loading = false;
-            });
-            // ✅ USE filteredList INSTEAD OF cloneCopy
-            this.worker.postMessage({
-                list: filteredList,
-                keyField: 'id',
-                titleField: 'name',
-                parentField: 'parentId',
-                activeField: 'active',
-                checkedField: 'checked',
-                expandedField: 'expand',
-            });
+    onClick(e, item) {
+        this.iconClickStream$.next(crypto.randomUUID());
+        if (!!item) {
+            this.navigatorService.clickedItem$.next(item);
         }
-        else {
-            this.subscriptions.push(this.recursiveService
-                .linerArrayToNestedArray(filteredList, // ✅ use filteredList
-            'id', 'name', 'parentId', 'active', 'checked', 'expand')
-                .subscribe((obj) => {
-                this.data = obj.list;
-                if (!!this.data?.length)
-                    this.data[0].tree$Expanded = true;
-                this.loading = false;
-            }));
+        if (localStorage.getItem('moduleDesignMode') === 'on')
+            return;
+        this.navigatorService.activeRootMenuItemId$.next(item?.id);
+        if (!!localStorage) {
+            localStorage.setItem('activeRootMenuItemId', (item?.id || 0).toString());
         }
+        this.menuService.isOpen$.next(true); // trigger the LeftBar to be opened at the first time
     }
-    onExpandTogglerClick(e, event) {
-        event.stopPropagation();
-        const newValue = !e.tree$Expanded;
-        e.tree$Expanded = newValue;
-        // updating status with newValue
-        const currentExpandedIds = this.organizationService.status$.value?.expandedKeys;
-        let newExpandedIds = currentExpandedIds?.filter((_) => !!!currentExpandedIds.includes(e.id.toString()));
-        if (newValue) {
-            newExpandedIds?.push(e.id.toString());
-        }
-        newExpandedIds?.sort();
-        const newExpandedKeys = [];
-        newExpandedIds.map((x) => newExpandedKeys.push(x.toString()));
-        this.organizationService.status$.next({
-            ...this.organizationService.status$.value,
-            expandedKeys: newExpandedKeys,
-        });
+    ngAfterViewInit() {
+        this.subscriptions.push(this.navigatorService.activeRootMenuItemId$.subscribe(x => {
+            const active = x === this.$item()?.id;
+            this.$active.set(active);
+        }));
+        this.subscriptions.push(this.iconClickStream$.pipe(buffer(this.iconClickStream$.pipe(debounceTime(250))), map$1(clicks => clicks.length), filter(clicksLength => clicksLength >= 5))
+            .subscribe(_ => {
+            this.navigatorService.showEditSvg$.next(true);
+        }));
     }
-    onItemCheck(e, newValue) {
-        this.itemClick?.emit(e);
-        if (this.accessorMode !== EnumCoreOrgTreeaAccessorMode.CHECKED)
-            return;
-        // We have this var to hold nodes that are being changed
-        let toggledIds;
-        // We should calculate a new state into this var: 
-        const newCheckedIds = JSON.parse(JSON.stringify(this.checkedIds));
-        // We will call this function after toggledIds changed
-        const changeValue = () => {
-            // If newValue === true, we will disctintly push changed ids to the state
-            // Otherwise we will remove them from the state
-            if (!!newValue) {
-                toggledIds.map(x => {
-                    if (!!!newCheckedIds.includes(x)) {
-                        newCheckedIds.push(x);
-                    }
-                });
-                // Then asign the state to the newCheckedIds
-                this.checkedIds = newCheckedIds;
-            }
-            else {
-                const filter = newCheckedIds.filter(x => !!!toggledIds.includes(x));
-                // Then asign the state to the filter
-                this.checkedIds = filter;
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: ModuleItemComponent, deps: [{ token: MultiLanguageService }, { token: NavigatorService }, { token: i0.ChangeDetectorRef }, { token: MenuService }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.5", type: ModuleItemComponent, isStandalone: true, selector: "app-module-item", inputs: { $item: { classPropertyName: "$item", publicName: "$item", isSignal: true, isRequired: true, transformFunction: null }, $itemPadding: { classPropertyName: "$itemPadding", publicName: "$itemPadding", isSignal: true, isRequired: false, transformFunction: null }, $width: { classPropertyName: "$width", publicName: "$width", isSignal: true, isRequired: true, transformFunction: null }, $height: { classPropertyName: "$height", publicName: "$height", isSignal: true, isRequired: true, transformFunction: null }, $iconTextVerticalMargin: { classPropertyName: "$iconTextVerticalMargin", publicName: "$iconTextVerticalMargin", isSignal: true, isRequired: false, transformFunction: null } }, usesInheritance: true, ngImport: i0, template: "<div class=\"menu-item-wrapper\" \r\n    [class.active] = \"$active()\"\r\n    (click)=\"onClick($event, $item())\" [ngStyle]=\"{\r\n    width: $width() + 'px',\r\n    height: $height() + 'px',\r\n    padding: $itemPadding() + 'px',\r\n    visibility: !!$item() ? 'visible' : 'hidden'\r\n}\">\r\n    @if (!!$item()) {\r\n    <div class=\"d-flex d-flex-v d-flex-center\">\r\n        @if ($item()!.iconSvg) {\r\n        <div class=\"d-block\">\r\n            <i class=\"module-icon\">\r\n                <span [innerHtml]=\"$item()!.iconSvg! | stringHtml\"></span>\r\n            </i>\r\n        </div>\r\n        } @else if ($item()!.iconClass) {\r\n        <div>\r\n            <i [class]=\"$item()!.iconClass + ' module-icon'\"></i>\r\n        </div>\r\n        }\r\n        <div [ngStyle]=\"{\r\n            height: $iconTextVerticalMargin() + 'px'\r\n        }\"></div>\r\n        <div class=\"module-code\" [appTooltip]=\"$item()!.code! | translate: lang\" [ngStyle]=\"{\r\n            width: $width() - $itemPadding() * 2 + 'px'\r\n        }\">{{ $item()!.code! | translate: lang}}</div>\r\n    </div>\r\n    }\r\n</div>", styles: [".menu-item-wrapper{display:flex;align-items:center;justify-content:center;box-sizing:border-box;-webkit-user-select:none;user-select:none}.menu-item-wrapper:not(.active){cursor:pointer}.menu-item-wrapper:not(.active):hover{background-color:var(--color-bg-main)}.menu-item-wrapper.active{color:var(--color-basic-orange)}.module-code{font-size:var(--typo-basic-font-size);overflow:hidden;white-space:nowrap;text-overflow:ellipsis;text-align:center}\n"], dependencies: [{ kind: "directive", type: NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "directive", type: TooltipDirective, selector: "[appTooltip]", inputs: ["appTooltip", "showAnyway", "color", "backgroundColor", "position"] }, { kind: "pipe", type: StringHtmlPipe, name: "stringHtml" }, { kind: "pipe", type: TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: ModuleItemComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'app-module-item', changeDetection: ChangeDetectionStrategy.OnPush, imports: [
+                        NgStyle,
+                        TooltipDirective,
+                        StringHtmlPipe,
+                        TranslatePipe,
+                    ], template: "<div class=\"menu-item-wrapper\" \r\n    [class.active] = \"$active()\"\r\n    (click)=\"onClick($event, $item())\" [ngStyle]=\"{\r\n    width: $width() + 'px',\r\n    height: $height() + 'px',\r\n    padding: $itemPadding() + 'px',\r\n    visibility: !!$item() ? 'visible' : 'hidden'\r\n}\">\r\n    @if (!!$item()) {\r\n    <div class=\"d-flex d-flex-v d-flex-center\">\r\n        @if ($item()!.iconSvg) {\r\n        <div class=\"d-block\">\r\n            <i class=\"module-icon\">\r\n                <span [innerHtml]=\"$item()!.iconSvg! | stringHtml\"></span>\r\n            </i>\r\n        </div>\r\n        } @else if ($item()!.iconClass) {\r\n        <div>\r\n            <i [class]=\"$item()!.iconClass + ' module-icon'\"></i>\r\n        </div>\r\n        }\r\n        <div [ngStyle]=\"{\r\n            height: $iconTextVerticalMargin() + 'px'\r\n        }\"></div>\r\n        <div class=\"module-code\" [appTooltip]=\"$item()!.code! | translate: lang\" [ngStyle]=\"{\r\n            width: $width() - $itemPadding() * 2 + 'px'\r\n        }\">{{ $item()!.code! | translate: lang}}</div>\r\n    </div>\r\n    }\r\n</div>", styles: [".menu-item-wrapper{display:flex;align-items:center;justify-content:center;box-sizing:border-box;-webkit-user-select:none;user-select:none}.menu-item-wrapper:not(.active){cursor:pointer}.menu-item-wrapper:not(.active):hover{background-color:var(--color-bg-main)}.menu-item-wrapper.active{color:var(--color-basic-orange)}.module-code{font-size:var(--typo-basic-font-size);overflow:hidden;white-space:nowrap;text-overflow:ellipsis;text-align:center}\n"] }]
+        }], ctorParameters: () => [{ type: MultiLanguageService }, { type: NavigatorService }, { type: i0.ChangeDetectorRef }, { type: MenuService }] });
+
+class CoreRootMenuItemPickerComponent extends BaseComponent {
+    constructor(mls, ahs, renderer, navigatorService, layoutService, domService, menuService, sysMenuService, authService, appConfigService) {
+        super(mls);
+        this.mls = mls;
+        this.ahs = ahs;
+        this.renderer = renderer;
+        this.navigatorService = navigatorService;
+        this.layoutService = layoutService;
+        this.domService = domService;
+        this.menuService = menuService;
+        this.sysMenuService = sysMenuService;
+        this.authService = authService;
+        this.appConfigService = appConfigService;
+        this.logoPath = 'data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTE1IiBoZWlnaHQ9IjI5IiB2aWV3Qm94PSIwIDAgMTE1IDI5IiBmaWxsPSJub25lIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciPg0KPHBhdGggZmlsbC1ydWxlPSJldmVub2RkIiBjbGlwLXJ1bGU9ImV2ZW5vZGQiIGQ9Ik0wIDI4LjU1MjhWOC41NzY4NkgyLjU2MzI5VjE2LjgxMzRIMTIuNTIzNVY4LjU3Njg2SDE1LjA4NjhWMjguNTMzOUgxMi41MjM1VjE5LjE0MjNIMi41ODE2VjI4LjUzMzlIMFYyOC41NTI4Wk0xOS4wNzgyIDExLjM2MDJWOC41NzY4NkgyMS40NTg0VjExLjM2MDJIMTkuMDc4MlpNMTkuMDc4MiAyOC41NTI4VjE0LjA4NjhIMjEuNDU4NFYyOC41NTI4SDE5LjA3ODJaTTI0LjIyMzEgMjIuMDc3MkwyOC4wMzE1IDIxLjY3OTZDMjguMjUxMiAyMi45ODYxIDI4LjcyNzIgMjMuOTUxNyAyOS40MjMgMjQuNTc2NkMzMC4xMTg3IDI1LjIwMTQgMzEuMDcwOCAyNS41MDQ0IDMyLjI0MjYgMjUuNTA0NEMzMy40ODc2IDI1LjUwNDQgMzQuNDIxNCAyNS4yMjAzIDM1LjA2MjIgMjQuNjcxMkMzNS43MDMgMjQuMTIyMSAzNi4wMTQzIDIzLjQ5NzMgMzYuMDE0MyAyMi43NTg5QzM2LjAxNDMgMjIuMjg1NSAzNS44ODYxIDIxLjg2ODkgMzUuNjExNSAyMS41NDdDMzUuMzM2OCAyMS4yMjUyIDM0Ljg3OTEgMjAuOTIyMiAzNC4yMiAyMC42NzYxQzMzLjc2MjIgMjAuNTI0NiAzMi43MzY5IDIwLjIyMTYgMzEuMTI1NyAxOS44MDUxQzI5LjAzODUgMTkuMjc0OSAyNy41NzM3IDE4LjYxMjIgMjYuNzQ5OCAxNy44MTY5QzI1LjU1OTcgMTYuNzE4NyAyNC45OTIxIDE1LjM3NDQgMjQuOTkyMSAxMy44MDI4QzI0Ljk5MjEgMTIuNzgwMyAyNS4yNjY4IDExLjgxNDcgMjUuODE2IDEwLjk0MzdDMjYuMzgzNiAxMC4wNTM4IDI3LjE3MDkgOS4zNzIxMSAyOC4yMTQ1IDguOTE3NjhDMjkuMjc2NSA4LjQ0NDMyIDMwLjUyMTUgOC4yMTcxIDMyLjAwNDYgOC4yMTcxQzM0LjQyMTQgOC4yMTcxIDM2LjIzNCA4Ljc2NjIgMzcuNDYwNyA5Ljg2NDQxQzM4LjY4NzQgMTAuOTgxNSAzOS4zMDk5IDEyLjQ1ODQgMzkuMzgzMiAxNC4zMTRMMzUuNDgzMyAxNC40NjU1QzM1LjMxODUgMTMuNDI0MSAzNC45NzA3IDEyLjY4NTcgMzQuNDIxNCAxMi4yNTAyQzMzLjg3MjEgMTEuODE0NyAzMy4wNjY1IDExLjU2ODUgMzEuOTY3OSAxMS41Njg1QzMwLjg1MTEgMTEuNTY4NSAyOS45NzIyIDExLjgxNDcgMjkuMzMxNCAxMi4yODhDMjguOTI4NiAxMi42MDk5IDI4LjcwODkgMTMuMDI2NSAyOC43MDg5IDEzLjUzNzdDMjguNzA4OSAxNC4wMTExIDI4LjkxMDMgMTQuNDI3NiAyOS4yOTQ4IDE0Ljc0OTVDMjkuNzcwOCAxNS4xODUgMzAuOTc5MiAxNS42Mzk1IDMyLjg2NTEgMTYuMTEyOEMzNC43NTA5IDE2LjU2NzIgMzYuMTYwOCAxNy4wNDA2IDM3LjA1NzkgMTcuNTUxOEMzNy45NTUxIDE4LjA0NDEgMzguNjY5MSAxOC43MjU4IDM5LjE4MTggMTkuNTc3OEMzOS42OTQ0IDIwLjQ0ODggMzkuOTUwOCAyMS40OTAyIDM5Ljk1MDggMjIuNzU4OUMzOS45NTA4IDIzLjg5NDkgMzkuNjM5NSAyNC45NzQyIDM5LjAxNyAyNS45Nzc3QzM4LjQxMjggMjYuOTgxMyAzNy41MzQgMjcuNzE5NyAzNi40MTcxIDI4LjE5MzFDMzUuMzAwMiAyOC42ODU0IDMzLjkwODcgMjguOTEyNiAzMi4yMjQzIDI4LjkxMjZDMjkuNzg5MSAyOC45MTI2IDI3LjkwMzMgMjguMzI1NiAyNi42MDMzIDI3LjE3MDZDMjUuMjY2OCAyNS45OTY3IDI0LjQ3OTUgMjQuMjkyNiAyNC4yMjMxIDIyLjA3NzJaTTQ5LjU4MTQgMTQuMDY3OVYxNy4wOTc0SDQ3LjA1NDhWMjIuOTY3MUM0Ny4wNTQ4IDI0LjE0MTEgNDcuMDczMSAyNC44NDE3IDQ3LjEwOTcgMjUuMDQ5OUM0Ny4xNjQ2IDI1LjIzOTMgNDcuMjc0NSAyNS40MDk3IDQ3LjQ1NzYgMjUuNTQyMkM0Ny42MjIzIDI1LjY3NDggNDcuODIzNyAyNS43MzE2IDQ4LjA4MDEgMjUuNzMxNkM0OC40MjggMjUuNzMxNiA0OC45MjIzIDI1LjU5OSA0OS41NjMxIDI1LjM3MThMNDkuODc0NCAyOC4zNDQ2QzQ5LjAxMzkgMjguNzIzMiA0OC4wNjE4IDI4LjkxMjYgNDYuOTYzMiAyOC45MTI2QzQ2LjMwNDEgMjguOTEyNiA0NS42OTk5IDI4Ljc5OSA0NS4xNjg5IDI4LjU3MThDNDQuNjM3OSAyOC4zNDQ2IDQ0LjIzNTEgMjguMDQxNiA0My45Nzg4IDI3LjY2MjlDNDMuNzQwOCAyNy4zMDMyIDQzLjU1NzcgMjYuNzkxOSA0My40NjYxIDI2LjE2NzFDNDMuMzkyOSAyNS43MTI2IDQzLjM1NjMgMjQuODIyNyA0My4zNTYzIDIzLjQ1OTRWMTcuMTE2NEg0MS42NzE4VjE0LjA4NjhINDMuMzU2M1YxMS4yMDg4TDQ3LjA1NDggOC45NTU1NVYxNC4wODY4SDQ5LjU4MTRWMTQuMDY3OVpNNTQuOTI3NyAxOC41MzY0TDUxLjU3NzEgMTcuOTMwNUM1MS45NjE2IDE2LjUxMDQgNTIuNjAyNSAxNS40NjkgNTMuNTE3OSAxNC43ODc0QzU0LjQ1MTcgMTQuMTI0NyA1NS44MjQ5IDEzLjc4MzkgNTcuNjM3NSAxMy43ODM5QzU5LjI4NTMgMTMuNzgzOSA2MC41MTIxIDEzLjk3MzIgNjEuMzE3NyAxNC4zODk4QzYyLjEyMzMgMTQuNzg3NCA2Mi42OTA5IDE1LjI5ODYgNjMuMDIwNCAxNS45MjM1QzYzLjM1IDE2LjU0ODMgNjMuNTE0OCAxNy42ODQ0IDYzLjUxNDggMTkuMzMxN0w2My40NTk4IDIzLjgwMDNDNjMuNDU5OCAyNS4wNjg5IDYzLjUxNDggMjUuOTk2NyA2My42NDI5IDI2LjYwMjZDNjMuNzUyOCAyNy4yMDg1IDYzLjk5MDggMjcuODcxMiA2NC4zMDIxIDI4LjU1MjhINjAuNjQwMkM2MC41MzA0IDI4LjMwNjcgNjAuNDIwNSAyNy45MjggNjAuMjkyMyAyNy40MzU3QzYwLjIzNzQgMjcuMjA4NSA2MC4xODI1IDI3LjA1NyA2MC4xNDU5IDI2Ljk4MTNDNTkuNTIzNCAyNy42MjUgNTguODQ1OSAyOC4wOTg0IDU4LjEzMTkgMjguNDIwM0M1Ny40MTc4IDI4Ljc0MjIgNTYuNjQ4OCAyOC44OTM3IDU1Ljg0MzIgMjguODkzN0M1NC40MTUxIDI4Ljg5MzcgNTMuMjc5OSAyOC40OTYgNTIuNDU2IDI3LjY4MThDNTEuNjMyMSAyNi44ODY2IDUxLjIxMSAyNS44NjQxIDUxLjIxMSAyNC42MTQ0QzUxLjIxMSAyMy44MDAzIDUxLjM5NDEgMjMuMDgwNyA1MS43Nzg1IDIyLjQzN0M1Mi4xNjMgMjEuODEyMSA1Mi42NzU3IDIxLjMwMDkgNTMuMzcxNCAyMC45NjAxQzU0LjA0ODkgMjAuNjM4MiA1NS4wMTkzIDIwLjMzNTIgNTYuMzAwOSAyMC4wNzAxQzU4LjAyMiAxOS43NDgzIDU5LjIzMDQgMTkuNDI2NCA1OS44ODk1IDE5LjE0MjNWMTguNzYzN0M1OS44ODk1IDE4LjAwNjMgNTkuNzA2NSAxNy40OTUgNTkuMzc2OSAxNy4xNzMyQzU5LjAyOSAxNi44NTEzIDU4LjM1MTYgMTYuNjgwOSA1Ny4zODEyIDE2LjY4MDlDNTYuNzIyIDE2LjY4MDkgNTYuMjA5NCAxNi44MzIzIDU1Ljg0MzIgMTcuMDk3NEM1NS40NDA0IDE3LjM4MTQgNTUuMTQ3NCAxNy44NTQ4IDU0LjkyNzcgMTguNTM2NFpNNTkuODg5NSAyMS42NDE3QzU5LjQxMzUgMjEuNzkzMiA1OC42NjI4IDIyLjAwMTUgNTcuNjM3NSAyMi4yMjg3QzU2LjYxMjIgMjIuNDU1OSA1NS45NTMxIDIyLjY4MzEgNTUuNjIzNSAyMi44OTE0QzU1LjE0NzQgMjMuMjUxMiA1NC44OTExIDIzLjY4NjYgNTQuODkxMSAyNC4yMzU3QzU0Ljg5MTEgMjQuNzg0OSA1NS4wNzQyIDI1LjIzOTMgNTUuNDc3IDI1LjYzNjlDNTUuODYxNSAyNi4wMzQ1IDU2LjMzNzUgMjYuMjIzOSA1Ni45NDE3IDI2LjIyMzlDNTcuNjE5MiAyNi4yMjM5IDU4LjI2IDI1Ljk5NjcgNTguODY0MiAyNS41NDIyQzU5LjMwMzYgMjUuMjAxNCA1OS41OTY2IDI0Ljc4NDkgNTkuNzQzMSAyNC4yNzM2QzU5LjgzNDYgMjMuOTUxNyA1OS44ODk1IDIzLjMwOCA1OS44ODk1IDIyLjM5OTFWMjEuNjQxN1pNNjUuNTQ3MSAxNC4wNjc5SDY3LjU5NzdWMTIuOTg4NkM2Ny41OTc3IDExLjc1NzkgNjcuNzI1OSAxMC44Njc5IDY3Ljk4MjIgMTAuMjYyQzY4LjIzODYgOS42NTYxMyA2OC42OTYzIDkuMTYzODMgNjkuMzczNyA4Ljc4NTE0QzcwLjA1MTIgOC40MDY0NSA3MC45MTE3IDguMjE3MSA3MS45MzcgOC4yMTcxQzcyLjk5OSA4LjIxNzEgNzQuMDQyNiA4LjM2ODU4IDc1LjA0OTYgOC43MDk0TDc0LjU3MzYgMTEuMzYwMkM3My45Njk0IDExLjIwODggNzMuMzgzNSAxMS4xMzMgNzIuODUyNSAxMS4xMzNDNzIuMzAzMiAxMS4xMzMgNzEuOTE4NyAxMS4yNjU2IDcxLjY2MjQgMTEuNTMwN0M3MS40MDYxIDExLjc5NTcgNzEuMzE0NSAxMi4yODggNzEuMzE0NSAxMy4wNDU0VjE0LjA2NzlINzQuMDc5MlYxNy4wNzg1SDcxLjMxNDVWMjguNTMzOUg2Ny42MTZWMTcuMDc4NUg2NS41NjU0VjE0LjA2NzlINjUuNTQ3MVpNNzQuNTE4NiAxNC4wNjc5SDc2LjU2OTNWMTIuOTg4NkM3Ni41NjkzIDExLjc1NzkgNzYuNjk3NCAxMC44Njc5IDc2Ljk1MzggMTAuMjYyQzc3LjIxMDEgOS42NTYxMyA3Ny42Njc4IDkuMTYzODMgNzguMzQ1MyA4Ljc4NTE0Qzc5LjAyMjcgOC40MDY0NSA3OS44ODMyIDguMjE3MSA4MC45MDg2IDguMjE3MUM4MS45NzA1IDguMjE3MSA4My4wMTQxIDguMzY4NTggODQuMDIxMSA4LjcwOTRMODMuNTQ1MSAxMS4zNjAyQzgyLjk0MDkgMTEuMjA4OCA4Mi4zNTUgMTEuMTMzIDgxLjgwNTcgMTEuMTMzQzgxLjI1NjQgMTEuMTMzIDgwLjg3MTkgMTEuMjY1NiA4MC42MTU2IDExLjUzMDdDODAuMzk1OSAxMS43OTU3IDgwLjI2NzcgMTIuMjg4IDgwLjI2NzcgMTMuMDQ1NFYxNC4wNjc5SDgzLjAzMjRWMTcuMDc4NUg4MC4yNjc3VjI4LjUzMzlINzYuNTY5M1YxNy4wNzg1SDc0LjUxODZWMTQuMDY3OVoiIGZpbGw9ImJsYWNrIi8+DQo8cGF0aCBmaWxsLXJ1bGU9ImV2ZW5vZGQiIGNsaXAtcnVsZT0iZXZlbm9kZCIgZD0iTTk4LjY0OTggNS4yNDQ3N0M5Ny45NTQgMi43ODMyOCA5NS42NDcxIDIuNDA0NTkgOTMuNzI0NiAzLjc2Nzg4QzkxLjc0NzIgNS4xNjkwMyA5MC40Mjg5IDguMTk4NTcgOTEuMTA2NCAxMC42MjIyQzkxLjgwMjEgMTMuMDgzNyA5NC4xMDkxIDEzLjQ2MjQgOTYuMDMxNiAxMi4xMThDOTguMDA5IDEwLjcxNjkgOTkuMzI3MiA3LjY2ODQgOTguNjQ5OCA1LjI0NDc3WiIgZmlsbD0iI0YzNzU0MCIvPg0KPHBhdGggZmlsbC1ydWxlPSJldmVub2RkIiBjbGlwLXJ1bGU9ImV2ZW5vZGQiIGQ9Ik05MS4xNDI4IDI3LjgxNDlDOTEuOTMwMSAyNy4xMTQzIDkyLjk3MzggMjYuNDUxNiA5My44MTYgMjUuODgzNkw5NS40NjM4IDI0LjgyMzJDOTcuODQ0IDIwLjAzMjggMTAxLjA0OCAxNS41NDUzIDEwNC40MTcgMTEuNDU1NEMxMDcuNDkzIDcuNjg3NDQgMTExLjA4MiAzLjc0OTA1IDExNSAwLjkwODg2TDExNC4zNDEgMEMxMTAuMTQ4IDIuMjkxMDggMTA2LjMwMyA1LjQxNTI5IDEwMi44NDIgOC43NjY3MUM5OS4xOTg5IDEyLjMwNzUgOTUuODQ4MyAxNi4yMjY5IDkzLjE1NjggMjAuNTgxOUw5My4wNDcgMjAuNzMzNEw5Mi4yNzggMTkuMDY3MUM5MS43MTA0IDE3Ljg1NTMgOTAuMTM1OCAxNC42NTU0IDg4LjU0MjkgMTQuNjU1NEM4Ni45NSAxNC42NTU0IDg1LjQzMDMgMTUuODI5MyA4NC4zMTM1IDE2Ljk0NjRDODUuMzAyMiAxNy4zMDYyIDg2LjEyNjEgMTcuOTg3OCA4Ni43ODUyIDE4LjgyMUM4Ny44MTA1IDIwLjA3MDYgODguNjM0NSAyMS43NzQ4IDg5LjI5MzYgMjMuMjcwNkw4OS45MTYxIDI0LjY3MTdDOTAuMzE4OSAyNS42NzUzIDkwLjgxMzMgMjYuNzkyNCA5MS4xNDI4IDI3LjgxNDlaIiBmaWxsPSIjRjM3NTQwIi8+DQo8L3N2Zz4NCg==';
+        this.itemsPerRow = 4;
+        this.iconTextVerticalMargin = 25;
+        this.items = [[]];
+        this.zIndex = 1;
+        this.imageErrorResolverType = EnumImageResolverType.LOGO;
+        this.headerHeight = 0;
+        this.width = 400;
+        this.layoutService.modulePanelWidth$.subscribe(x => this.width = x);
+    }
+    ngOnInit() {
+        this.subscriptions.push(this.mls.lang$.subscribe(x => this.lang = x));
+        this.subscriptions.push(this.authService.data$.subscribe(x => this.isRoot = !!x?.isRoot));
+        this.scrollWidth = this.layoutService.modulePanelWidth$.value - this.layoutService.basicSpacing * 2;
+        this.scrollHeight = window.innerHeight - this.layoutService.headerHeight$.value - this.layoutService.basicSpacing * 2;
+        this.itemWidth = this.scrollWidth / 4;
+    }
+    transformTo2DArray(flatList) {
+        const result = [];
+        for (let i = 0; i < flatList.length; i += this.itemsPerRow) {
+            const row = flatList.slice(i, i + this.itemsPerRow);
+            // If the last row has fewer than itemsPerRow, pad it with undefineds
+            while (row.length < this.itemsPerRow) {
+                row.push(undefined);
             }
-            // After the cases of if/else, make the control change with onChange
-            this.value = this.checkedIds;
-            this.onChange(this.checkedIds);
-            this.markAsTouched();
-        };
-        /* start: THIS CODE SCOPE calculates toggledIds */
-        if (this.checkInheritance) {
-            // If true, all the nested items will be checked/unchecked
-            this.recursiveService
-                .nestedToggleCheck(e, newValue, this.showDissolved)
-                .then((x) => {
-                let currentCheckedKeys = this.organizationService.status$.value.checkedKeys || [];
-                if (!!newValue) {
-                    x.map(item => {
-                        if (currentCheckedKeys.filter(i => i === item.toString()).length === 0) {
-                            currentCheckedKeys.push(item.toString());
-                        }
-                    });
-                }
-                else {
-                    currentCheckedKeys = currentCheckedKeys.filter(i => !x.includes(Number(i)));
-                }
-                this.organizationService.status$.next({
-                    ...this.organizationService.status$.value,
-                    checkedKeys: currentCheckedKeys //x.map(item => item.toString())
-                });
-                // The ids have been changed
-                toggledIds = x;
-                // Now toggledIds were set. We call the function we declared
-                changeValue();
-            })
-                .catch((x) => {
-                console.error(x);
-            });
-        }
-        else {
-            // Otherwise we simply toggle check for current item only
-            toggledIds = [e.id];
-            // Now toggledIds were set. We call the function we declared
-            changeValue();
+            result.push(row);
         }
-        /* end: THIS CODE SCOPE calculates toggledIds */
-        // That is. Happy debugging!
-    }
-    onCheckIncludeDissolvedChange(value) {
-        console.log("onCheckIncludeDissolvedChange", value);
+        return result;
     }
-    onCheckInheritanceChange(value) {
-        this.organizationService.status$.next({
-            ...this.organizationService.status$.value,
-            checkInheritance: value,
+    ngAfterViewInit() {
+        setTimeout(() => {
+            this.designMode = localStorage.getItem('moduleDesignMode') === 'on';
+            this.zIndex = this.domService.getMaxZIndex() + 1;
+            // this.listenerFn = this.renderer.listen('window', 'click', (e: Event) => {
+            //   if (!this.designMode) {
+            //     if (this.container && !!!this.container.nativeElement.contains(e.target)) {
+            //       this.ahs.activeKey$.next(undefined);
+            //     }
+            //   }
+            // });
+            this.subscriptions.push(this.navigatorService.rootNavigatorItems$.subscribe(x => {
+                // Transform the flat list into a 2D array
+                this.items = this.transformTo2DArray(x);
+            }));
+            this.subscriptions.push(this.layoutService.headerHeight$.subscribe(x => {
+                this.headerHeight = x;
+            }));
+            if (!!localStorage) {
+                const activeRootMenuItemId = Number(localStorage.getItem('activeRootMenuItemId') || '0');
+                this.navigatorService.activeRootMenuItemId$.next(activeRootMenuItemId);
+            }
+            if (window.innerWidth < this.layoutService.modulePanelWidth$.value) {
+                this.layoutService.modulePanelWidth$.next(window.innerWidth);
+            }
         });
     }
-    onObjectClick(e, event) {
-        // remove highlight class
-        // TO DO
-        if (!!e.protected)
-            return;
-        this.itemClick?.emit(e);
-        if (this.accessorMode === EnumCoreOrgTreeaAccessorMode.CHECKED)
-            return;
-        let activeIds = [];
-        this.data.map((item) => (item.active = false));
-        if (this.accessorMode ===
-            EnumCoreOrgTreeaAccessorMode.ACTIVATED_INHERITANCE ||
-            !!!this.accessorMode) {
-            // If true, all the nested items will be active, the others are inactive
-            this.recursiveService
-                .nestedResetActive(e, true)
-                .then((x) => {
-                activeIds = x;
-                activeIds.sort();
-                const newActiveKeys = [];
-                activeIds.map((x) => newActiveKeys.push(x.toString()));
-                this.organizationService.status$.next({
-                    ...this.organizationService.status$.value,
-                    activeKeys: newActiveKeys,
-                    selectedKey: e.id.toString()
-                });
-                this.activeIds = activeIds;
-                console.log(this.activeIds);
-                this.onChange(activeIds);
-            })
-                .catch((x) => {
-                console.error(x);
-            });
+    onDesignModeClick(e) {
+        e.stopPropagation();
+        if (localStorage.getItem('moduleDesignMode') === 'on') {
+            localStorage.setItem('moduleDesignMode', 'off');
+            this.designMode = false;
         }
         else {
-            // ACTIVATED_SINGLE
-            // Otherwise we simply set current item to be active only
-            activeIds = [e.id];
-            this.activeIds = activeIds;
-            this.organizationService.status$.next({
-                ...this.organizationService.status$.value,
-                activeKeys: [e.id.toString()],
-                selectedKey: e.id.toString(),
-            });
-            this.onChange(activeIds);
-        }
-        const { detail } = event;
-        if (detail === 2) {
-            console.log('This was a dblclick');
-            this.itemDoubleClick.emit(e);
+            localStorage.setItem('moduleDesignMode', 'on');
+            this.designMode = true;
         }
-        this.selectedItem = e;
-    }
-    onSearchChange(text) {
-        this.search$.next(text);
-    }
-    onHiddenToolClick(e) {
-        e.stopPropagation();
-        this.hiddenToolClickStream$.next(crypto.randomUUID());
     }
     ngOnDestroy() {
-        if (this.worker) {
-            this.worker.terminate();
-        }
-        this.subscriptions.map((x) => x?.unsubscribe());
-        if (!!this.instanceNumber) {
-            const tryToFind = this.organizationService.instances.filter((x) => x.instanceNumber === this.instanceNumber);
-            if (!!tryToFind.length) {
-                const newInstances = this.organizationService.instances.filter((x) => x.instanceNumber !== this.instanceNumber);
-                this.organizationService.instances = newInstances;
-            }
-        }
+        this.subscriptions.map(x => x?.unsubscribe());
+        if (this.listenerFn)
+            this.listenerFn();
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: CoreComTreeComponent, deps: [{ token: AuthService }, { token: RecursiveService }, { token: MultiLanguageService }, { token: LayoutService }, { token: CoreOrgTreeService }, { token: AlertService }, { token: ComPartyService }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.5", type: CoreComTreeComponent, isStandalone: true, selector: "core-com-tree", inputs: { lineColor: "lineColor", fullWidthMode: "fullWidthMode", accessorMode: "accessorMode", searchMode: "searchMode", fullRendering: "fullRendering", height: "height", disabledLoopExpand: "disabledLoopExpand", showCheckInheritance: "showCheckInheritance", excludedIds$: "excludedIds$", stateIsolated$: "stateIsolated$" }, outputs: { itemDoubleClick: "itemDoubleClick", itemClick: "itemClick" }, providers: [
-            {
-                provide: NG_VALUE_ACCESSOR,
-                useExisting: forwardRef(() => CoreComTreeComponent),
-                multi: true
-            }
-        ], viewQueries: [{ propertyName: "container", first: true, predicate: ["container"], descendants: true }, { propertyName: "scrollContainer", first: true, predicate: ["scrollContainer"], descendants: true }, { propertyName: "displayContent", first: true, predicate: ["displayContent"], descendants: true }, { propertyName: "reducedIconWrapper", first: true, predicate: ["reducedIconWrapper"], descendants: true }], usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "<div #container class=\"core-org-tree-container\" [class.full-width]=\"!!fullWidthMode\" *ngIf=\"!!data\" [ngStyle]=\"{\r\n        position : 'relative',\r\n        width: '100%',\r\n        minWidth: '310px',\r\n        height: height + 'px'\r\n    }\">\r\n    <div #displayContent class=\"custom-org-tree\">\r\n        @if (showSearch) {\r\n        <div class=\"core-org-tree-header d-flex-between\">\r\n            <div class=\"m5\">\r\n                <input type=\"text\" class=\"form-control\" [(ngModel)]=\"search\" (ngModelChange)=\"onSearchChange($event)\"\r\n                    [placeholder]=\"searchPlaceholder | translate: lang\" [class.full-width]=\"!!fullWidthMode\">\r\n            </div>\r\n        </div>\r\n        }\r\n        <ng-container>\r\n\r\n            <div #scrollContainer class=\"scroll-container\" [ngStyle]=\"{\r\n                height: height - layoutService.coreOrgTreeTopHeight * (showSearch ? 1 : 0) - layoutService.coreOrgTreeBottomHeight + 'px',\r\n                overflow: 'scroll'\r\n                }\">\r\n                <div class=\"hidden-tool\" (click)=\"onHiddenToolClick($event)\"></div>\r\n                <core-loading-surface [loading]=\"loading\" [height]=\"scrollContainerHeight\"></core-loading-surface>\r\n                <!-- @for (root of dataFiltered; track root) { -->\r\n                @for (root of data; track $index) {\r\n                @defer(on viewport(scrollContainer)) {\r\n                <ul class=\"root\" [class.collapsed]=\"!!!root.tree$Expanded\">\r\n                    <ng-container *ngTemplateOutlet=\"item; context: { context: root }\"></ng-container>\r\n                </ul>\r\n                } @placeholder() {\r\n                Placeholder...\r\n                } @loading() {\r\n                Loading...\r\n                } @error() {\r\n                Error...\r\n                }\r\n\r\n                }\r\n            </div>\r\n            <div [ngStyle]=\"{\r\n                display: 'block',\r\n                position: 'absolute',\r\n                bottom: '0px',\r\n                left: '0px',\r\n                right: '0px',\r\n                height: layoutService.corePaginationHeight + 'px',\r\n                paddingLeft: layoutService.basicSpacing + 'px',\r\n                paddingRight: layoutService.basicSpacing + 'px',\r\n                lineHeight: layoutService.corePaginationHeight + 'px',\r\n                overflow: 'hidden'\r\n            }\">\r\n                <div [ngStyle]=\"{\r\n                    height: layoutService.corePaginationHeight + 'px',\r\n                    position: 'relative',\r\n                    display: 'flex',\r\n                    alignItems: 'center',\r\n                    justifyContent: 'space-between'\r\n                }\">\r\n                    <div>\r\n                        <core-checkbox [(ngModel)]=\"showDissolved\"\r\n                            (ngModelChange)=\"onCheckIncludeDissolvedChange($event)\"\r\n                            [text]=\"'UI.CORE_ORG_TREE.SHOW_OUTDATED_UNITS_ABBREVIATED'\"\r\n                            [tooltip]=\"'UI.CORE_ORG_TREE.SHOW_OUTDATED_UNITS'\" tooltipPosition=\"above\"></core-checkbox>\r\n                    </div>\r\n                    @if (accessorMode === 'CHECKED') {\r\n                        <div class=\"check-inheritance-wrapper\">\r\n                            @if (showCheckInheritance) {\r\n                                <core-checkbox [(ngModel)]=\"checkInheritance\"\r\n                                    (ngModelChange)=\"onCheckInheritanceChange($event)\"\r\n                                    [text]=\"'UI.CORE_ORG_TREE.CHECK_INHERITANCE'\"></core-checkbox>\r\n                                }\r\n                        </div>\r\n                    }\r\n                </div>\r\n            </div>\r\n\r\n            <ng-template #item let-context=\"context\" let-id=\"context.id\" let-title=\"context.tree$Title\"\r\n                let-highlighted=\"context.tree$Highlighted\" let-hasChildren=\"context.tree$HasChildren\"\r\n                let-hasActiveChildren=\"context.tree$HasActiveChildren\" let-children=\"context.tree$Children\"\r\n                let-expanded=\"context.tree$Expanded\" let-isActive=\"context.isActive\" let-active=\"context.tree$Active\"\r\n                let-checked=\"context.tree$Checked\" let-protected=\"context.protected\">\r\n\r\n                @if ((!showDissolved && !!isActive) || (!!showDissolved)) {\r\n                <li [class.has-children]=\"!!hasChildren\" [class.collapsed]=\"!!hasChildren && !!!expanded\">\r\n                    <!-- (click)=\"accessorMode !== 'CHECKED' ? onObjectClick(context, $event) : $event.preventDefault()\" -->\r\n                    <span (click)=\"onObjectClick(context, $event)\">\r\n                        @if ((!!showDissolved && !!hasChildren) || (!showDissolved && !!hasActiveChildren)) {\r\n                            <i class=\"expand-toggler feather-chevron-down\" (click)=\"onExpandTogglerClick(context, $event)\"></i>\r\n                        }\r\n\r\n                        @if (accessorMode === 'CHECKED' && !protected) {\r\n                        <core-checkbox (onClick)=\"onItemCheck(context, $event)\" [inputValue]=\"checked\"\r\n                            [disabled]=\"disabled\"></core-checkbox>\r\n                        }\r\n                        <object [class.active]=\"accessorMode != 'CHECKED' && selectedKey===id.toString()\"\r\n                            [class.highlighted]=\"highlighted\" [class.dissolved]=\"!isActive\"\r\n                            [class.protected]=\"protected\" [appTooltip]=\"title\">\r\n                            {{ title }}\r\n                        </object>\r\n                    </span>\r\n                    @if (!!children.length) {\r\n                    <ul [class.collapsed]=\" !!!expanded\">\r\n                        @for (child of children; track $index) {\r\n                        @if (!!expanded || !!fullRendering) {\r\n\r\n                        <ng-container *ngTemplateOutlet=\"item; context: { context: child }\"></ng-container>\r\n\r\n                        }\r\n                        }\r\n                    </ul>\r\n                    }\r\n                </li>\r\n                }\r\n            </ng-template>\r\n        </ng-container>\r\n    </div>\r\n</div>", styles: [""], dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$3.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: i1$3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "component", type: CoreCheckboxComponent, selector: "core-checkbox", inputs: ["text", "tooltipPosition", "tooltip", "inputValue", "disabled"], outputs: ["onClick"] }, { kind: "component", type: CoreLoadingSurfaceComponent, selector: "core-loading-surface", inputs: ["loading", "height"] }, { kind: "pipe", type: TranslatePipe, name: "translate" }, { kind: "directive", type: TooltipDirective, selector: "[appTooltip]", inputs: ["appTooltip", "showAnyway", "color", "backgroundColor", "position"] }] }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: CoreRootMenuItemPickerComponent, deps: [{ token: MultiLanguageService }, { token: ApplicationHelpService }, { token: i0.Renderer2 }, { token: NavigatorService }, { token: LayoutService }, { token: DomService }, { token: MenuService }, { token: SysMenuService }, { token: AuthService }, { token: AppConfigService }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.5", type: CoreRootMenuItemPickerComponent, isStandalone: true, selector: "core-root-menu-item-picker", inputs: { logoPath: "logoPath", itemsPerRow: "itemsPerRow", iconTextVerticalMargin: "iconTextVerticalMargin" }, viewQueries: [{ propertyName: "container", first: true, predicate: ["container"], descendants: true }], usesInheritance: true, ngImport: i0, template: "<div #container class=\"core-root-menu-item-picker-container\" [ngStyle]=\"{\r\n    zIndex: zIndex,\r\n}\">\r\n    <div class=\"mudule-picker-header d-flex d-flex-between\" [ngStyle]=\"{\r\n        height: 59 + 'px'\r\n    }\">\r\n        <div class=\"HEADER_LOGO\">\r\n            <div class=\"logo-wrapper d-flex\">\r\n                <img src=\"logoPath\" class=\"lg\" [ngStyle]=\"{\r\n                    width: '130px',\r\n                    height: '59px',\r\n                    transform: 'translate(0, -5px)'\r\n                }\" appImageErrorResolver [type]=\"imageErrorResolverType\">\r\n            </div>\r\n        </div>\r\n        @if (!!isRoot) {\r\n            <i \r\n                [class.feather-square]=\"!designMode\" \r\n                [class.feather-play]=\"!!designMode\" \r\n                class=\"stop-mode-icon\" \r\n                (click)=\"onDesignModeClick($event)\"\r\n                [appTooltip]=\"!designMode ? 'Chuy\u1EC3n sang ch\u1EBF \u0111\u1ED9 thi\u1EBFt k\u1EBF' : 'Chuy\u1EC3n v\u1EC1 ch\u1EBF \u0111\u1ED9 b\u00ECnh th\u01B0\u1EDDng'\"\r\n            ></i>\r\n        }\r\n    </div>\r\n\r\n    <div class=\"header-bottom\" [ngStyle]=\"{\r\n        width: width + 'px'\r\n    }\">\r\n        <core-line></core-line>\r\n    </div>\r\n\r\n    <div class=\"h15\"></div>\r\n\r\n    <div class=\"scroll\" [ngStyle]=\"{\r\n        width: width + 'px',\r\n        height: scrollHeight + 'px'\r\n    }\">\r\n        @for (row of items; track $index) {\r\n            <div class=\"menu-row\">\r\n                @for (item of row; track $index) {\r\n                    <app-module-item [$item]=\"item\" [$width]=\"itemWidth\" [$height]=\"100\" [$iconTextVerticalMargin]=\"iconTextVerticalMargin\"></app-module-item>\r\n                }\r\n            </div>\r\n        }\r\n    </div>\r\n\r\n</div>", styles: [".core-root-menu-item-picker-container .header-bottom{position:absolute;top:59px;left:0}.core-root-menu-item-picker-container .scroll{overflow-x:hidden;overflow-y:auto;display:flex;flex-direction:column;align-items:flex-start;flex-wrap:wrap;-ms-overflow-style:none}.core-root-menu-item-picker-container .scroll::-webkit-scrollbar{display:none}.core-root-menu-item-picker-container .menu-row{display:flex;flex-wrap:nowrap;justify-content:space-between}.core-root-menu-item-picker-container .stop-mode-icon{cursor:pointer;width:24px;height:24px;font-size:24px}\n"], dependencies: [{ kind: "component", type: CoreLineComponent, selector: "core-line" }, { kind: "directive", type: NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "component", type: ModuleItemComponent, selector: "app-module-item", inputs: ["$item", "$itemPadding", "$width", "$height", "$iconTextVerticalMargin"] }, { kind: "directive", type: ImageErrorResolverDirective, selector: "[appImageErrorResolver]", inputs: ["type", "isFemale"] }, { kind: "directive", type: TooltipDirective, selector: "[appTooltip]", inputs: ["appTooltip", "showAnyway", "color", "backgroundColor", "position"] }] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: CoreComTreeComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: CoreRootMenuItemPickerComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'core-com-tree', imports: [
-                        FormsModule,
+            args: [{ selector: 'core-root-menu-item-picker', imports: [
+                        CoreLineComponent,
                         NgStyle,
-                        CoreCheckboxComponent,
-                        CoreLoadingSurfaceComponent,
-                        TranslatePipe,
+                        ModuleItemComponent,
+                        ImageErrorResolverDirective,
                         TooltipDirective,
-                    ], providers: [
-                        {
-                            provide: NG_VALUE_ACCESSOR,
-                            useExisting: forwardRef(() => CoreComTreeComponent),
-                            multi: true
-                        }
-                    ], template: "<div #container class=\"core-org-tree-container\" [class.full-width]=\"!!fullWidthMode\" *ngIf=\"!!data\" [ngStyle]=\"{\r\n        position : 'relative',\r\n        width: '100%',\r\n        minWidth: '310px',\r\n        height: height + 'px'\r\n    }\">\r\n    <div #displayContent class=\"custom-org-tree\">\r\n        @if (showSearch) {\r\n        <div class=\"core-org-tree-header d-flex-between\">\r\n            <div class=\"m5\">\r\n                <input type=\"text\" class=\"form-control\" [(ngModel)]=\"search\" (ngModelChange)=\"onSearchChange($event)\"\r\n                    [placeholder]=\"searchPlaceholder | translate: lang\" [class.full-width]=\"!!fullWidthMode\">\r\n            </div>\r\n        </div>\r\n        }\r\n        <ng-container>\r\n\r\n            <div #scrollContainer class=\"scroll-container\" [ngStyle]=\"{\r\n                height: height - layoutService.coreOrgTreeTopHeight * (showSearch ? 1 : 0) - layoutService.coreOrgTreeBottomHeight + 'px',\r\n                overflow: 'scroll'\r\n                }\">\r\n                <div class=\"hidden-tool\" (click)=\"onHiddenToolClick($event)\"></div>\r\n                <core-loading-surface [loading]=\"loading\" [height]=\"scrollContainerHeight\"></core-loading-surface>\r\n                <!-- @for (root of dataFiltered; track root) { -->\r\n                @for (root of data; track $index) {\r\n                @defer(on viewport(scrollContainer)) {\r\n                <ul class=\"root\" [class.collapsed]=\"!!!root.tree$Expanded\">\r\n                    <ng-container *ngTemplateOutlet=\"item; context: { context: root }\"></ng-container>\r\n                </ul>\r\n                } @placeholder() {\r\n                Placeholder...\r\n                } @loading() {\r\n                Loading...\r\n                } @error() {\r\n                Error...\r\n                }\r\n\r\n                }\r\n            </div>\r\n            <div [ngStyle]=\"{\r\n                display: 'block',\r\n                position: 'absolute',\r\n                bottom: '0px',\r\n                left: '0px',\r\n                right: '0px',\r\n                height: layoutService.corePaginationHeight + 'px',\r\n                paddingLeft: layoutService.basicSpacing + 'px',\r\n                paddingRight: layoutService.basicSpacing + 'px',\r\n                lineHeight: layoutService.corePaginationHeight + 'px',\r\n                overflow: 'hidden'\r\n            }\">\r\n                <div [ngStyle]=\"{\r\n                    height: layoutService.corePaginationHeight + 'px',\r\n                    position: 'relative',\r\n                    display: 'flex',\r\n                    alignItems: 'center',\r\n                    justifyContent: 'space-between'\r\n                }\">\r\n                    <div>\r\n                        <core-checkbox [(ngModel)]=\"showDissolved\"\r\n                            (ngModelChange)=\"onCheckIncludeDissolvedChange($event)\"\r\n                            [text]=\"'UI.CORE_ORG_TREE.SHOW_OUTDATED_UNITS_ABBREVIATED'\"\r\n                            [tooltip]=\"'UI.CORE_ORG_TREE.SHOW_OUTDATED_UNITS'\" tooltipPosition=\"above\"></core-checkbox>\r\n                    </div>\r\n                    @if (accessorMode === 'CHECKED') {\r\n                        <div class=\"check-inheritance-wrapper\">\r\n                            @if (showCheckInheritance) {\r\n                                <core-checkbox [(ngModel)]=\"checkInheritance\"\r\n                                    (ngModelChange)=\"onCheckInheritanceChange($event)\"\r\n                                    [text]=\"'UI.CORE_ORG_TREE.CHECK_INHERITANCE'\"></core-checkbox>\r\n                                }\r\n                        </div>\r\n                    }\r\n                </div>\r\n            </div>\r\n\r\n            <ng-template #item let-context=\"context\" let-id=\"context.id\" let-title=\"context.tree$Title\"\r\n                let-highlighted=\"context.tree$Highlighted\" let-hasChildren=\"context.tree$HasChildren\"\r\n                let-hasActiveChildren=\"context.tree$HasActiveChildren\" let-children=\"context.tree$Children\"\r\n                let-expanded=\"context.tree$Expanded\" let-isActive=\"context.isActive\" let-active=\"context.tree$Active\"\r\n                let-checked=\"context.tree$Checked\" let-protected=\"context.protected\">\r\n\r\n                @if ((!showDissolved && !!isActive) || (!!showDissolved)) {\r\n                <li [class.has-children]=\"!!hasChildren\" [class.collapsed]=\"!!hasChildren && !!!expanded\">\r\n                    <!-- (click)=\"accessorMode !== 'CHECKED' ? onObjectClick(context, $event) : $event.preventDefault()\" -->\r\n                    <span (click)=\"onObjectClick(context, $event)\">\r\n                        @if ((!!showDissolved && !!hasChildren) || (!showDissolved && !!hasActiveChildren)) {\r\n                            <i class=\"expand-toggler feather-chevron-down\" (click)=\"onExpandTogglerClick(context, $event)\"></i>\r\n                        }\r\n\r\n                        @if (accessorMode === 'CHECKED' && !protected) {\r\n                        <core-checkbox (onClick)=\"onItemCheck(context, $event)\" [inputValue]=\"checked\"\r\n                            [disabled]=\"disabled\"></core-checkbox>\r\n                        }\r\n                        <object [class.active]=\"accessorMode != 'CHECKED' && selectedKey===id.toString()\"\r\n                            [class.highlighted]=\"highlighted\" [class.dissolved]=\"!isActive\"\r\n                            [class.protected]=\"protected\" [appTooltip]=\"title\">\r\n                            {{ title }}\r\n                        </object>\r\n                    </span>\r\n                    @if (!!children.length) {\r\n                    <ul [class.collapsed]=\" !!!expanded\">\r\n                        @for (child of children; track $index) {\r\n                        @if (!!expanded || !!fullRendering) {\r\n\r\n                        <ng-container *ngTemplateOutlet=\"item; context: { context: child }\"></ng-container>\r\n\r\n                        }\r\n                        }\r\n                    </ul>\r\n                    }\r\n                </li>\r\n                }\r\n            </ng-template>\r\n        </ng-container>\r\n    </div>\r\n</div>" }]
-        }], ctorParameters: () => [{ type: AuthService }, { type: RecursiveService }, { type: MultiLanguageService }, { type: LayoutService }, { type: CoreOrgTreeService }, { type: AlertService }, { type: ComPartyService }], propDecorators: { lineColor: [{
-                type: Input
-            }], fullWidthMode: [{
-                type: Input
-            }], accessorMode: [{
-                type: Input
-            }], searchMode: [{
-                type: Input
-            }], fullRendering: [{
-                type: Input
-            }], height: [{
-                type: Input
-            }], disabledLoopExpand: [{
-                type: Input
-            }], showCheckInheritance: [{
+                    ], template: "<div #container class=\"core-root-menu-item-picker-container\" [ngStyle]=\"{\r\n    zIndex: zIndex,\r\n}\">\r\n    <div class=\"mudule-picker-header d-flex d-flex-between\" [ngStyle]=\"{\r\n        height: 59 + 'px'\r\n    }\">\r\n        <div class=\"HEADER_LOGO\">\r\n            <div class=\"logo-wrapper d-flex\">\r\n                <img src=\"logoPath\" class=\"lg\" [ngStyle]=\"{\r\n                    width: '130px',\r\n                    height: '59px',\r\n                    transform: 'translate(0, -5px)'\r\n                }\" appImageErrorResolver [type]=\"imageErrorResolverType\">\r\n            </div>\r\n        </div>\r\n        @if (!!isRoot) {\r\n            <i \r\n                [class.feather-square]=\"!designMode\" \r\n                [class.feather-play]=\"!!designMode\" \r\n                class=\"stop-mode-icon\" \r\n                (click)=\"onDesignModeClick($event)\"\r\n                [appTooltip]=\"!designMode ? 'Chuy\u1EC3n sang ch\u1EBF \u0111\u1ED9 thi\u1EBFt k\u1EBF' : 'Chuy\u1EC3n v\u1EC1 ch\u1EBF \u0111\u1ED9 b\u00ECnh th\u01B0\u1EDDng'\"\r\n            ></i>\r\n        }\r\n    </div>\r\n\r\n    <div class=\"header-bottom\" [ngStyle]=\"{\r\n        width: width + 'px'\r\n    }\">\r\n        <core-line></core-line>\r\n    </div>\r\n\r\n    <div class=\"h15\"></div>\r\n\r\n    <div class=\"scroll\" [ngStyle]=\"{\r\n        width: width + 'px',\r\n        height: scrollHeight + 'px'\r\n    }\">\r\n        @for (row of items; track $index) {\r\n            <div class=\"menu-row\">\r\n                @for (item of row; track $index) {\r\n                    <app-module-item [$item]=\"item\" [$width]=\"itemWidth\" [$height]=\"100\" [$iconTextVerticalMargin]=\"iconTextVerticalMargin\"></app-module-item>\r\n                }\r\n            </div>\r\n        }\r\n    </div>\r\n\r\n</div>", styles: [".core-root-menu-item-picker-container .header-bottom{position:absolute;top:59px;left:0}.core-root-menu-item-picker-container .scroll{overflow-x:hidden;overflow-y:auto;display:flex;flex-direction:column;align-items:flex-start;flex-wrap:wrap;-ms-overflow-style:none}.core-root-menu-item-picker-container .scroll::-webkit-scrollbar{display:none}.core-root-menu-item-picker-container .menu-row{display:flex;flex-wrap:nowrap;justify-content:space-between}.core-root-menu-item-picker-container .stop-mode-icon{cursor:pointer;width:24px;height:24px;font-size:24px}\n"] }]
+        }], ctorParameters: () => [{ type: MultiLanguageService }, { type: ApplicationHelpService }, { type: i0.Renderer2 }, { type: NavigatorService }, { type: LayoutService }, { type: DomService }, { type: MenuService }, { type: SysMenuService }, { type: AuthService }, { type: AppConfigService }], propDecorators: { logoPath: [{
                 type: Input
-            }], excludedIds$: [{
+            }], itemsPerRow: [{
                 type: Input
-            }], stateIsolated$: [{
+            }], iconTextVerticalMargin: [{
                 type: Input
-            }], itemDoubleClick: [{
-                type: Output
-            }], itemClick: [{
-                type: Output
             }], container: [{
                 type: ViewChild,
                 args: ['container']
-            }], scrollContainer: [{
-                type: ViewChild,
-                args: ['scrollContainer']
-            }], displayContent: [{
-                type: ViewChild,
-                args: ['displayContent']
-            }], reducedIconWrapper: [{
-                type: ViewChild,
-                args: ['reducedIconWrapper']
             }] } });
 
+class CoreRootMenuItemPickerService {
+    constructor() { }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: CoreRootMenuItemPickerService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
+    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: CoreRootMenuItemPickerService, providedIn: 'root' }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: CoreRootMenuItemPickerService, decorators: [{
+            type: Injectable,
+            args: [{
+                    providedIn: 'root'
+                }]
+        }], ctorParameters: () => [] });
+
 class CoreComProfileComponent extends BaseComponent {
     ngOnChanges(changes) {
         this.cdr.markForCheck();
@@ -38026,11 +39136,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.5", ngImpor
 const coreDocGenRoutes = [
     {
         path: 'template-list',
-        loadComponent: () => import('./ngx-histaff-alpha-template-list.component-36QflRwY.mjs').then(m => m.TemplateListComponent),
+        loadComponent: () => import('./ngx-histaff-alpha-template-list.component-CVK_Ewx4.mjs').then(m => m.TemplateListComponent),
     },
     {
         path: ":id",
-        loadComponent: () => import('./ngx-histaff-alpha-core-template-editor.component-BBWim535.mjs').then(m => m.CoreTemplateEditorComponent),
+        loadComponent: () => import('./ngx-histaff-alpha-core-template-editor.component-CwYRUlbM.mjs').then(m => m.CoreTemplateEditorComponent),
         canDeactivate: [CanDeactivateGuard]
     },
     {
@@ -38059,7 +39169,7 @@ const coreFormDesignRoutes = [
     },
     {
         path: ':id',
-        loadComponent: () => import('./ngx-histaff-alpha-core-form-design.component-BDh-358_.mjs').then(function (n) { return n.c; }).then(m => m.CoreFormDesignComponent)
+        loadComponent: () => import('./ngx-histaff-alpha-core-form-design.component-Jzy7HTBy.mjs').then(function (n) { return n.c; }).then(m => m.CoreFormDesignComponent)
     }
 ];
 
@@ -38952,7 +40062,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.5", ngImpor
 const coreNavigationTrackerRoutes = [
     {
         path: '',
-        loadComponent: () => import('./ngx-histaff-alpha-tracker-studio.component-DlAdz6Wq.mjs').then(m => m.TrackerStudioComponent)
+        loadComponent: () => import('./ngx-histaff-alpha-tracker-studio.component-8tqyVAcU.mjs').then(m => m.TrackerStudioComponent)
     }
 ];
 
@@ -41541,33 +42651,33 @@ const coreWorkflowRoutes = [
                     {
                         path: 'form-assign/:id',
                         outlet: "formAssignAux",
-                        loadComponent: () => import('./ngx-histaff-alpha-wf-form-assign.component-V9exT_fm.mjs').then(m => m.WfFormAssignComponent),
+                        loadComponent: () => import('./ngx-histaff-alpha-wf-form-assign.component-CRs1A8j_.mjs').then(m => m.WfFormAssignComponent),
                         canDeactivate: [CanDeactivateGuard]
                     }
                 ]
             },
             {
                 path: 'global-config',
-                loadComponent: () => import('./ngx-histaff-alpha-wf-global-config.component-BuCfL80F.mjs').then(m => m.WfGlobalConfigComponent)
+                loadComponent: () => import('./ngx-histaff-alpha-wf-global-config.component-yeFb4wxY.mjs').then(m => m.WfGlobalConfigComponent)
             },
             {
                 path: 'db-settings',
-                loadComponent: () => import('./ngx-histaff-alpha-db-settings.component-CqNPzdzL.mjs').then(m => m.DbSettingsComponent)
+                loadComponent: () => import('./ngx-histaff-alpha-db-settings.component-CpjFcS3r.mjs').then(m => m.DbSettingsComponent)
             },
             {
                 path: 'workflow-consume',
-                loadComponent: () => import('./ngx-histaff-alpha-core-workflow-consume.component-CvGswHbB.mjs').then(m => m.CoreWorkflowConsumeComponent),
+                loadComponent: () => import('./ngx-histaff-alpha-core-workflow-consume.component-Fma_hNMb.mjs').then(m => m.CoreWorkflowConsumeComponent),
                 children: [
                     {
                         path: ':id',
                         outlet: "workflowConsume",
-                        loadComponent: () => import('./ngx-histaff-alpha-live-form.component-FW_M5cI5.mjs').then(function (n) { return n.l; }).then(m => m.LiveFormComponent),
+                        loadComponent: () => import('./ngx-histaff-alpha-live-form.component-iX23HD-T.mjs').then(function (n) { return n.l; }).then(m => m.LiveFormComponent),
                     }
                 ]
             },
             {
                 path: 'workflow-consume/:id',
-                loadComponent: () => import('./ngx-histaff-alpha-live-form.component-FW_M5cI5.mjs').then(function (n) { return n.l; }).then(m => m.LiveFormComponent),
+                loadComponent: () => import('./ngx-histaff-alpha-live-form.component-iX23HD-T.mjs').then(function (n) { return n.l; }).then(m => m.LiveFormComponent),
             },
             {
                 path: 'workflow-group-edit/:id',
@@ -41577,17 +42687,17 @@ const coreWorkflowRoutes = [
             },
             {
                 path: 'design/:id',
-                loadChildren: () => import('./ngx-histaff-alpha-design-wrapper.route-B_EjwkZd.mjs').then(m => m.wfDesignWrapperRoutes),
+                loadChildren: () => import('./ngx-histaff-alpha-design-wrapper.route-BPTxhFez.mjs').then(m => m.wfDesignWrapperRoutes),
             },
         ]
     },
     {
         path: 'react/:id',
-        loadComponent: () => import('./ngx-histaff-alpha-wf-instance-step-react.component-OAdGYvAN.mjs').then(m => m.WfInstanceStepReactComponent)
+        loadComponent: () => import('./ngx-histaff-alpha-wf-instance-step-react.component-Bri0bRw3.mjs').then(m => m.WfInstanceStepReactComponent)
     },
     {
         path: 'status/:id',
-        loadComponent: () => import('./ngx-histaff-alpha-wf-instance-status.component-DJuPBwqR.mjs').then(m => m.WfInstanceStatusComponent)
+        loadComponent: () => import('./ngx-histaff-alpha-wf-instance-status.component-Jahj4MO-.mjs').then(m => m.WfInstanceStatusComponent)
     }
 ];
 
@@ -43448,7 +44558,11 @@ class NavigatorComponent {
                     else if (this.menuClickedItem?.tree$Tier == 3) { //nếu là 3 cấp
                         array = x.filter(y => y.id == this.menuClickedItem.id);
                         arrayParrent = x.filter(y => y.id == this.menuClickedItem.tree$Parent);
+                        if (!arrayParrent.length)
+                            return;
                         let arrayGrandParrent = x.filter(z => z.id == arrayParrent[0].parent);
+                        if (!arrayGrandParrent.length)
+                            return;
                         let element = document.getElementById('main-menu-' + arrayParrent[0].id);
                         let element2 = document.getElementById('main-menu-' + arrayGrandParrent[0].id);
                         array[0].tree$Selected = true;
@@ -44208,5 +45322,5 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.5", ngImpor
  * Generated bundle index. Do not edit.
  */
 
-export { CoreButtonGroupVnsComponent as $, AppService as A, BaseComponent as B, ChatService as C, DialogService as D, EnumCoreTablePipeType as E, FullscreenModalLoaderComponent as F, CoreDatePickerComponent as G, CoreFormControlSeekerComponent as H, ImageErrorResolverDirective as I, CoreCurrencyInputComponent as J, EnumActorSourceType as K, CoreParamControlComponent as L, MultiLanguageService as M, CoreRadioGroupComponent as N, GptService as O, ApplicationHelpService as P, HotKeysDirective as Q, EnumCorePageEditMode as R, SocketService as S, TranslatePipe as T, CoreFormComponent as U, NavigatorService as V, JsonService as W, AppConfigService as X, EnumCoreButtonVNSCode as Y, READONLY_WORKFLOW_FIELDS as Z, noneAutoClosedAlertOptions as _, CorePageListComponent as a, CommonHttpRequestService as a$, CoreStickerCollectionComponent as a0, HtmlTooltipDirective as a1, CoreControlNoFormArrayComponent as a2, EnumFormDesignMode as a3, CoreControlComponent as a4, JsonSafePipe as a5, CoreAttachmentComponent as a6, CoreMonthSelectorComponent as a7, EnumImageResolverType as a8, NormalizeHumanNamePipe as a9, EnumStyleButtonClass as aA, CanActivateFunctionUrlMapperGuard as aB, InitializationCanActivateFn as aC, InitializationCanMatchFn as aD, httpInterceptorProviders as aE, InterceptorSkipHeader as aF, appTypeInterceptor as aG, baseUrlInterceptor as aH, authInterceptor as aI, graphInterceptor as aJ, tokenInterceptor as aK, responseInterceptor as aL, timeZoneInterceptor as aM, cachingInterceptor as aN, langInterceptor as aO, EnumFilterOperator as aP, OnlineUsersComponent as aQ, ActionService as aR, AppInitializationService as aS, AuthService as aT, CacheService as aU, EnumSwUpdateVersionUpdatesEventType as aV, CheckForUpdateService as aW, EnumDeviceType as aX, EnumBrowserType as aY, EnumOsType as aZ, ClientService as a_, CoreIosSwitcherComponent as aa, SunnyRotatingComponent as ab, MapAppdemoToServerPipePipe as ac, MapAttachmentToServerPipe as ad, MapNewsfeedMediaToServerPipe as ae, StringHtmlPipe as af, UploadedFilenameCutoffPipe as ag, DialogStateComponent as ah, FooterComponent as ai, RightchatComponent as aj, WaittingScreenComponent as ak, longAlertOptions as al, attachmentOptions as am, CORE_VNS_BUTTONS as an, defaultPaging as ao, DESKTOP_SCREEN_HEDER_HEIGHT as ap, MOBILE_SCREEN_HEDER_HEIGHT as aq, themeBlue as ar, DATE_VALUE_ACCESSOR as as, DateValueAccessor as at, EnumDragType as au, EnumErrorType as av, EnumIconClass as aw, EnumProfileInfoSector as ax, EnumSignalRType as ay, EnumSortDirection as az, CoreCheckboxComponent as b, MutationViewComponent as b$, TLA_CONFIG as b0, ConfigService as b1, CoreTableService as b2, DndService as b3, DocxMergeService as b4, FilterKitService as b5, GrpcService as b6, HeaderService as b7, HistoryService as b8, HttpErrorHandler as b9, TopicPermissionService as bA, TopicTreeService as bB, UploadedFileService as bC, UrlService as bD, UserActivityService as bE, EvaluateDialogService as bF, EnumWorkScheduleViewMode as bG, WorkShiftDndService as bH, AtShiftPatternComponent as bI, AtShiftPatternApplyComponent as bJ, AtShiftPatternEditComponent as bK, AtWorksignComponent as bL, AtWorksignService as bM, FunctionComponent as bN, IndividualScheduleApplyComponent as bO, FunctionEditComponent as bP, FunctionIgnoreComponent as bQ, FunctionIgnoreEditComponent as bR, GroupFunctionComponent as bS, GroupFunctionEditComponent as bT, hrmSchemaRoutes as bU, InMemoryComponent as bV, LanguageComponent as bW, LanguageEditComponent as bX, MenuComponent as bY, MenuEditComponent as bZ, MutationLogComponent as b_, HubConnectionService as ba, IpServiceService as bb, LayoutService as bc, LiquidJsService as bd, MapService as be, MenuService as bf, MessageService as bg, ModalService as bh, OrganizationService as bi, PkceService as bj, PositionTransferService as bk, EnumNotificationDir as bl, NotificationActionType as bm, PushNotificationService as bn, RandomAvatarService as bo, RequestCache as bp, RequestCacheWithMap as bq, ResponseService as br, RoutingService as bs, EnumSsrsExpressFileExtension as bt, EnumSsrsExpressExportFormat as bu, SsrsExpressService as bv, StatisticService as bw, StatisticAuthService as bx, SysMenuService as by, TimeSheetService as bz, BaseEditComponent as c, CoreEmployeeSeekerComponent as c$, PaSalaryPolicyComponent as c0, PaSalaryPolicyEditComponent as c1, PortalRouteComponent as c2, ScheduleOverviewComponent as c3, simpleChatRoutes as c4, PortalRouteEditComponent as c5, SysOtherListComponent as c6, SysOtherListEditComponent as c7, SysOtherListTypeComponent as c8, SysOtherListTypeEditComponent as c9, NewlyCreatedTokenService as cA, CoreApiProgressComponent as cB, CoreButtonGroupComponent as cC, EnumCoreButtonCode as cD, ActionSvgEditComponent as cE, CoreButtonGroupService as cF, CoreButtonVnsComponent as cG, CoreCommonParamKitComponent as cH, CoreCompareDbPipelineComponent as cI, CoreCompositionState as cJ, CoreCompositionService as cK, CoreCompositionComponent as cL, CoreConfirmDialogComponent as cM, ConfirmDialogStateComponent as cN, CoreLazyMountComponent as cO, CoreRootMenuItemPickerComponent as cP, CoreRootMenuItemPickerService as cQ, ECoreTableToolCode as cR, ECoreTableToolClass as cS, CoreTableComponent as cT, CoreComProfileComponent as cU, CoreContractSeekerComponent as cV, CoreControlNoGridBufferComponent as cW, CoreControlNoSeekerComponent as cX, coreDocGenRoutes as cY, CoreDocgenToolbarComponent as cZ, CoreEmployeeScheduleComponent as c_, SysActionComponent as ca, SysActionEditComponent as cb, SysFunctionActionComponent as cc, SysFunctionActionEditComponent as cd, SysFunctionActionMapperComponent as ce, SysFunctionUrlMapperComponent as cf, FunctionEditService as cg, SysModuleComponent as ch, SysModuleEditComponent as ci, SysRouteAccessComponent as cj, liner_to_nested_array_script as ck, blob_to_base64_script as cl, AlertComponent as cm, EnumAlertType as cn, IAlertOptions as co, AnimatedTextService as cp, AnimatedTextComponent as cq, BaseDropdownComponent as cr, ButtonGroupModule as cs, ButtonGroupService as ct, ButtonGroupComponent as cu, EnumButtonCaptionCode as cv, CoreButtonComponent as cw, CoreAccordionComponent as cx, CoreAccordionService as cy, CoreActiveUserCountComponent as cz, EnumFormBaseContolType as d, CorePermissionActionsComponent as d$, EnumCoreFileUploaderType as d0, CoreFileUploaderComponent as d1, CoreFilterHubComponent as d2, CoreFilterHubService as d3, ControlBase as d4, Textbox as d5, CoreControlService as d6, CustomValidators as d7, URL_PATTERN as d8, coreFormDesignRoutes as d9, CoreOauthCallbackOffice365Component as dA, EnumCoreOrgTreeaAccessorMode as dB, EnumCoreOrgTreeaSearchMode as dC, CoreOrgTreeComponent as dD, CoreOrgTreeState as dE, CoreOrgTreeService as dF, CoreOrgUnitSeekerComponent as dG, CoreOrgchartflexComponent as dH, CoreOrgParamComponent as dI, EnumCorePageEditBootstrapClass as dJ, EnumCorePageEditFieldType as dK, CorePageEditService as dL, CorePageEditLiteComponent as dM, CorePageEditTabComponent as dN, EnumExType as dO, CorePageListService as dP, CorePageListState as dQ, CorePageListContentComponent as dR, EnumCoreViewItemType as dS, CorePageViewComponent as dT, CorePaginationComponent as dU, CorePaginationFullComponent as dV, CorePaginationFullService as dW, CoreFileFormatPickerComponent as dX, CorePermissionService as dY, EnumPermissionObjectType as dZ, CorePermissionComponent as d_, CoreFormTabComponent as da, CoreFormLiteComponent as db, CoreFormControlBaseComponent as dc, EnumCoreSeekerColumnJob as dd, EnumCoreSeekerColumnStaffProfile as de, EnumCoreSeekerColumnContract as df, EnumCoreSeekerColumnWorking as dg, EnumCoreSeekerColumnWage as dh, EnumCoreSeekerColumnPosition as di, EnumCoreSeekerColumnPositionConcurrent as dj, EnumCoreSeekerColumnAutoForm as dk, SeekerService as dl, CoreGridBufferComponent as dm, CoreHeaderParamsComponent as dn, CoreHelperComponent as dp, CoreLineComponent as dq, CoreLiquidWysiwygComponent as dr, CoreListComponent as ds, CoreListLazyComponent as dt, CoreLoadingSurfaceComponent as du, CoreMccComponent as dv, CoreMonthPickerComponent as dw, CoreNavigationTrackerComponent as dx, coreNavigationTrackerRoutes as dy, CoreOauthCallbackComponent as dz, CorePageEditComponent as e, StringService as e$, CorePositionConcurrentSeekerComponent as e0, CorePositionSeekerComponent as e1, CoreQrcodeComponent as e2, EnumOparator as e3, CoreQueryBuilderComponent as e4, CoreReducerIconComponent as e5, CoreRotatingTextComponent as e6, CoreRouteAccumulatorComponent as e7, CoreRoutingHistoryComponent as e8, CoreSalaryPolicyPickerComponent as e9, CoreD3Service as eA, CorePieComponent as eB, CoreScatterPlotComponent as eC, EnumHrComparisonCode as eD, EnumICoreStatisticWidgetDataType as eE, CoreStatisticWidgetComponent as eF, DecisionComponent as eG, EvaluateDialogComponent as eH, HuconcurrentlyComponent as eI, JobComponent as eJ, LanguageChangerComponent as eK, DEFAULT_SVG as eL, ItemComponent as eM, NavigatorComponent as eN, OtpInputComponent as eO, OtpInputService as eP, PageTitleComponent as eQ, PaginationComponent as eR, FilterPipe as eS, normalizeHumanName as eT, PositionComponent as eU, PositionEditService as eV, CoreDatetimeService as eW, FileService as eX, LongTaskService as eY, EnumRecursiveFields as eZ, RecursiveService as e_, CoreScrollComponent as ea, CoreScrollLazyComponent as eb, CoreSeenByComponent as ec, CoreShiftCardComponent as ed, CoreShiftCellComponent as ee, CoreShiftCollectionComponent as ef, CoreShiftStickerComponent as eg, STICKER_COLOR_SCHEMA as eh, CoreStatusStickerComponent as ei, CoreSubFormGroupComponent as ej, CoreTabListComponent as ek, CoreTagsComponent as el, CoreTopicPickerComponent as em, EnumCoreArticleCategoryTreeaAccessorMode as en, CoreTopicTreeComponent as eo, CoreTreeComponent as ep, EnumCoreTreeGridEditMode as eq, CoreTreeGridComponent as er, CoreWageSeekerComponent as es, CoreWorkingSeekerComponent as et, coreWorkflowRoutes as eu, CoreWorkflowBuilderComponent as ev, CoreWorkflowGroupEditComponent as ew, CoreYearPickerComponent as ex, CoreYearSelectorComponent as ey, EnumCoreD3ScaleType as ez, CorePageHeaderComponent as f, UnicodeService as f0, StaffProfileComponent as f1, ThreedotsComponent as f2, TooltipComponent as f3, UserActivityComponent as f4, WageComponent as f5, tooltip_directive as f6, coreStickerCollection_component as f7, dragReorder_directive as f8, CoreTabsComponent as g, CoreWorkflowService as h, EnumCoreFormControlSeekerSourceType as i, AlertService as j, CoreFormService as k, DbService as l, AiHintForColumnComponent as m, CoreWorkflowListComponent as n, TooltipDirective as o, DragReorderDirective as p, CanDeactivateGuard as q, TableCellPipe as r, MapAvatarToServerPipe as s, alertOptions as t, CoreTerminalSpinnerComponent as u, CoreFormDesignService as v, EnumWorkflowStepType as w, DomService as x, CoreDropdownComponent as y, CoreChecklistComponent as z };
-//# sourceMappingURL=ngx-histaff-alpha-ngx-histaff-alpha-YPc6xct6.mjs.map
+export { CoreButtonGroupVnsComponent as $, AppService as A, BaseComponent as B, ChatService as C, DialogService as D, EnumCoreTablePipeType as E, FullscreenModalLoaderComponent as F, CoreDatePickerComponent as G, CoreFormControlSeekerComponent as H, ImageErrorResolverDirective as I, CoreCurrencyInputComponent as J, EnumActorSourceType as K, CoreParamControlComponent as L, MultiLanguageService as M, CoreRadioGroupComponent as N, GptService as O, ApplicationHelpService as P, HotKeysDirective as Q, EnumCorePageEditMode as R, SocketService as S, TranslatePipe as T, CoreFormComponent as U, NavigatorService as V, JsonService as W, AppConfigService as X, EnumCoreButtonVNSCode as Y, READONLY_WORKFLOW_FIELDS as Z, noneAutoClosedAlertOptions as _, CorePageListComponent as a, CommonHttpRequestService as a$, CoreStickerCollectionComponent as a0, HtmlTooltipDirective as a1, CoreControlNoFormArrayComponent as a2, EnumFormDesignMode as a3, CoreControlComponent as a4, JsonSafePipe as a5, CoreAttachmentComponent as a6, CoreMonthSelectorComponent as a7, EnumImageResolverType as a8, NormalizeHumanNamePipe as a9, EnumStyleButtonClass as aA, CanActivateFunctionUrlMapperGuard as aB, InitializationCanActivateFn as aC, InitializationCanMatchFn as aD, httpInterceptorProviders as aE, InterceptorSkipHeader as aF, appTypeInterceptor as aG, baseUrlInterceptor as aH, authInterceptor as aI, graphInterceptor as aJ, tokenInterceptor as aK, responseInterceptor as aL, timeZoneInterceptor as aM, cachingInterceptor as aN, langInterceptor as aO, EnumFilterOperator as aP, OnlineUsersComponent as aQ, ActionService as aR, AppInitializationService as aS, AuthService as aT, CacheService as aU, EnumSwUpdateVersionUpdatesEventType as aV, CheckForUpdateService as aW, EnumDeviceType as aX, EnumBrowserType as aY, EnumOsType as aZ, ClientService as a_, CoreIosSwitcherComponent as aa, SunnyRotatingComponent as ab, MapAppdemoToServerPipePipe as ac, MapAttachmentToServerPipe as ad, MapNewsfeedMediaToServerPipe as ae, StringHtmlPipe as af, UploadedFilenameCutoffPipe as ag, DialogStateComponent as ah, FooterComponent as ai, RightchatComponent as aj, WaittingScreenComponent as ak, longAlertOptions as al, attachmentOptions as am, CORE_VNS_BUTTONS as an, defaultPaging as ao, DESKTOP_SCREEN_HEDER_HEIGHT as ap, MOBILE_SCREEN_HEDER_HEIGHT as aq, themeBlue as ar, DATE_VALUE_ACCESSOR as as, DateValueAccessor as at, EnumDragType as au, EnumErrorType as av, EnumIconClass as aw, EnumProfileInfoSector as ax, EnumSignalRType as ay, EnumSortDirection as az, CoreCheckboxComponent as b, MutationViewComponent as b$, TLA_CONFIG as b0, ConfigService as b1, CoreTableService as b2, DndService as b3, DocxMergeService as b4, FilterKitService as b5, GrpcService as b6, HeaderService as b7, HistoryService as b8, HttpErrorHandler as b9, TopicPermissionService as bA, TopicTreeService as bB, UploadedFileService as bC, UrlService as bD, UserActivityService as bE, EvaluateDialogService as bF, EnumWorkScheduleViewMode as bG, WorkShiftDndService as bH, AtShiftPatternComponent as bI, AtShiftPatternApplyComponent as bJ, AtShiftPatternEditComponent as bK, AtWorksignComponent as bL, AtWorksignService as bM, FunctionComponent as bN, IndividualScheduleApplyComponent as bO, FunctionEditComponent as bP, FunctionIgnoreComponent as bQ, FunctionIgnoreEditComponent as bR, GroupFunctionComponent as bS, GroupFunctionEditComponent as bT, hrmSchemaRoutes as bU, InMemoryComponent as bV, LanguageComponent as bW, LanguageEditComponent as bX, MenuComponent as bY, MenuEditComponent as bZ, MutationLogComponent as b_, HubConnectionService as ba, IpServiceService as bb, LayoutService as bc, LiquidJsService as bd, MapService as be, MenuService as bf, MessageService as bg, ModalService as bh, OrganizationService as bi, PkceService as bj, PositionTransferService as bk, EnumNotificationDir as bl, NotificationActionType as bm, PushNotificationService as bn, RandomAvatarService as bo, RequestCache as bp, RequestCacheWithMap as bq, ResponseService as br, RoutingService as bs, EnumSsrsExpressFileExtension as bt, EnumSsrsExpressExportFormat as bu, SsrsExpressService as bv, StatisticService as bw, StatisticAuthService as bx, SysMenuService as by, TimeSheetService as bz, BaseEditComponent as c, CoreDocgenToolbarComponent as c$, PaSalaryPolicyComponent as c0, PaSalaryPolicyEditComponent as c1, PortalRouteComponent as c2, ScheduleOverviewComponent as c3, simpleChatRoutes as c4, PortalRouteEditComponent as c5, SysOtherListComponent as c6, SysOtherListEditComponent as c7, SysOtherListTypeComponent as c8, SysOtherListTypeEditComponent as c9, NewlyCreatedTokenService as cA, CoreApiProgressComponent as cB, CoreButtonGroupComponent as cC, EnumCoreButtonCode as cD, ActionSvgEditComponent as cE, CoreButtonGroupService as cF, CoreButtonVnsComponent as cG, CoreComTreeComponent as cH, ComPartyService as cI, CoreCommonParamKitComponent as cJ, CoreCompareDbPipelineComponent as cK, CoreCompositionState as cL, CoreCompositionService as cM, CoreCompositionComponent as cN, CoreConfirmDialogComponent as cO, ConfirmDialogStateComponent as cP, CoreLazyMountComponent as cQ, CoreRootMenuItemPickerComponent as cR, CoreRootMenuItemPickerService as cS, ECoreTableToolCode as cT, ECoreTableToolClass as cU, CoreTableComponent as cV, CoreComProfileComponent as cW, CoreContractSeekerComponent as cX, CoreControlNoGridBufferComponent as cY, CoreControlNoSeekerComponent as cZ, coreDocGenRoutes as c_, SysActionComponent as ca, SysActionEditComponent as cb, SysFunctionActionComponent as cc, SysFunctionActionEditComponent as cd, SysFunctionActionMapperComponent as ce, SysFunctionUrlMapperComponent as cf, FunctionEditService as cg, SysModuleComponent as ch, SysModuleEditComponent as ci, SysRouteAccessComponent as cj, liner_to_nested_array_script as ck, blob_to_base64_script as cl, AlertComponent as cm, EnumAlertType as cn, IAlertOptions as co, AnimatedTextService as cp, AnimatedTextComponent as cq, BaseDropdownComponent as cr, ButtonGroupModule as cs, ButtonGroupService as ct, ButtonGroupComponent as cu, EnumButtonCaptionCode as cv, CoreButtonComponent as cw, CoreAccordionComponent as cx, CoreAccordionService as cy, CoreActiveUserCountComponent as cz, EnumFormBaseContolType as d, EnumPermissionObjectType as d$, CoreEmployeeScheduleComponent as d0, CoreEmployeeSeekerComponent as d1, EnumCoreFileUploaderType as d2, CoreFileUploaderComponent as d3, CoreFilterHubComponent as d4, CoreFilterHubService as d5, ControlBase as d6, Textbox as d7, CoreControlService as d8, CustomValidators as d9, coreNavigationTrackerRoutes as dA, CoreOauthCallbackComponent as dB, CoreOauthCallbackOffice365Component as dC, EnumCoreOrgTreeaAccessorMode as dD, EnumCoreOrgTreeaSearchMode as dE, CoreOrgTreeComponent as dF, CoreOrgTreeState as dG, CoreOrgTreeService as dH, CoreOrgUnitSeekerComponent as dI, CoreOrgchartflexComponent as dJ, CoreOrgParamComponent as dK, EnumCorePageEditBootstrapClass as dL, EnumCorePageEditFieldType as dM, CorePageEditService as dN, CorePageEditLiteComponent as dO, CorePageEditTabComponent as dP, EnumExType as dQ, CorePageListService as dR, CorePageListState as dS, CorePageListContentComponent as dT, EnumCoreViewItemType as dU, CorePageViewComponent as dV, CorePaginationComponent as dW, CorePaginationFullComponent as dX, CorePaginationFullService as dY, CoreFileFormatPickerComponent as dZ, CorePermissionService as d_, URL_PATTERN as da, coreFormDesignRoutes as db, CoreFormTabComponent as dc, CoreFormLiteComponent as dd, CoreFormControlBaseComponent as de, EnumCoreSeekerColumnJob as df, EnumCoreSeekerColumnStaffProfile as dg, EnumCoreSeekerColumnContract as dh, EnumCoreSeekerColumnWorking as di, EnumCoreSeekerColumnWage as dj, EnumCoreSeekerColumnPosition as dk, EnumCoreSeekerColumnPositionConcurrent as dl, EnumCoreSeekerColumnAutoForm as dm, SeekerService as dn, CoreGridBufferComponent as dp, CoreHeaderParamsComponent as dq, CoreHelperComponent as dr, CoreLineComponent as ds, CoreLiquidWysiwygComponent as dt, CoreListComponent as du, CoreListLazyComponent as dv, CoreLoadingSurfaceComponent as dw, CoreMccComponent as dx, CoreMonthPickerComponent as dy, CoreNavigationTrackerComponent as dz, CorePageEditComponent as e, EnumRecursiveFields as e$, CorePermissionComponent as e0, CorePermissionActionsComponent as e1, CorePositionConcurrentSeekerComponent as e2, CorePositionSeekerComponent as e3, CoreQrcodeComponent as e4, EnumOparator as e5, CoreQueryBuilderComponent as e6, CoreReducerIconComponent as e7, CoreRotatingTextComponent as e8, CoreRouteAccumulatorComponent as e9, CoreYearSelectorComponent as eA, EnumCoreD3ScaleType as eB, CoreD3Service as eC, CorePieComponent as eD, CoreScatterPlotComponent as eE, EnumHrComparisonCode as eF, EnumICoreStatisticWidgetDataType as eG, CoreStatisticWidgetComponent as eH, DecisionComponent as eI, EvaluateDialogComponent as eJ, HuconcurrentlyComponent as eK, JobComponent as eL, LanguageChangerComponent as eM, DEFAULT_SVG as eN, ItemComponent as eO, NavigatorComponent as eP, OtpInputComponent as eQ, OtpInputService as eR, PageTitleComponent as eS, PaginationComponent as eT, FilterPipe as eU, normalizeHumanName as eV, PositionComponent as eW, PositionEditService as eX, CoreDatetimeService as eY, FileService as eZ, LongTaskService as e_, CoreRoutingHistoryComponent as ea, CoreSalaryPolicyPickerComponent as eb, CoreScrollComponent as ec, CoreScrollLazyComponent as ed, CoreSeenByComponent as ee, CoreShiftCardComponent as ef, CoreShiftCellComponent as eg, CoreShiftCollectionComponent as eh, CoreShiftStickerComponent as ei, STICKER_COLOR_SCHEMA as ej, CoreStatusStickerComponent as ek, CoreSubFormGroupComponent as el, CoreTabListComponent as em, CoreTagsComponent as en, CoreTopicPickerComponent as eo, EnumCoreArticleCategoryTreeaAccessorMode as ep, CoreTopicTreeComponent as eq, CoreTreeComponent as er, EnumCoreTreeGridEditMode as es, CoreTreeGridComponent as et, CoreWageSeekerComponent as eu, CoreWorkingSeekerComponent as ev, coreWorkflowRoutes as ew, CoreWorkflowBuilderComponent as ex, CoreWorkflowGroupEditComponent as ey, CoreYearPickerComponent as ez, CorePageHeaderComponent as f, RecursiveService as f0, StringService as f1, UnicodeService as f2, StaffProfileComponent as f3, ThreedotsComponent as f4, TooltipComponent as f5, UserActivityComponent as f6, WageComponent as f7, tooltip_directive as f8, coreStickerCollection_component as f9, dragReorder_directive as fa, CoreTabsComponent as g, CoreWorkflowService as h, EnumCoreFormControlSeekerSourceType as i, AlertService as j, CoreFormService as k, DbService as l, AiHintForColumnComponent as m, CoreWorkflowListComponent as n, TooltipDirective as o, DragReorderDirective as p, CanDeactivateGuard as q, TableCellPipe as r, MapAvatarToServerPipe as s, alertOptions as t, CoreTerminalSpinnerComponent as u, CoreFormDesignService as v, EnumWorkflowStepType as w, DomService as x, CoreDropdownComponent as y, CoreChecklistComponent as z };
+//# sourceMappingURL=ngx-histaff-alpha-ngx-histaff-alpha-BJ3ZVba7.mjs.map