qms-angular 1.0.65 → 1.0.70

package/bundles/qms-angular.umd.js

@@ -1,8 +1,8 @@
 (function (global, factory) {
-    typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports, require('@angular/core'), require('rxjs'), require('@angular/common'), require('@angular/forms'), require('@angular/material/form-field'), require('@angular/material/radio'), require('@angular/material/dialog'), require('rxjs/operators'), require('@angular/material/autocomplete'), require('@angular/cdk/overlay'), require('@angular/cdk/portal'), require('@angular/material/input'), require('@angular/material/card'), require('@angular/material/icon'), require('@angular/material/checkbox'), require('@angular/material/chips'), require('@angular/material/button'), require('@angular/material/core'), require('@angular/material/progress-spinner'), require('@angular/cdk/a11y'), require('@angular/cdk/coercion'), require('@angular/cdk/collections'), require('@angular/platform-browser/animations'), require('moment'), require('@angular/material/list'), require('@angular/material/expansion'), require('@angular/cdk/scrolling'), require('@angular/material/sidenav'), require('@angular/material/tree'), require('@angular/material/menu'), require('@angular/platform-browser'), require('@angular/cdk/tree'), require('@angular/common/http'), require('@angular/material/button-toggle'), require('@angular/material/select'), require('@angular/material/snack-bar'), require('@ckeditor/ckeditor5-angular'), require('jquery'), require('lodash'), require('@angular/material/tooltip'), require('@angular/material/badge'), require('@angular/material/toolbar'), require('@angular/cdk/stepper'), require('@angular/material/stepper'), require('@angular/material/slide-toggle')) :
-    typeof define === 'function' && define.amd ? define('qms-angular', ['exports', '@angular/core', 'rxjs', '@angular/common', '@angular/forms', '@angular/material/form-field', '@angular/material/radio', '@angular/material/dialog', 'rxjs/operators', '@angular/material/autocomplete', '@angular/cdk/overlay', '@angular/cdk/portal', '@angular/material/input', '@angular/material/card', '@angular/material/icon', '@angular/material/checkbox', '@angular/material/chips', '@angular/material/button', '@angular/material/core', '@angular/material/progress-spinner', '@angular/cdk/a11y', '@angular/cdk/coercion', '@angular/cdk/collections', '@angular/platform-browser/animations', 'moment', '@angular/material/list', '@angular/material/expansion', '@angular/cdk/scrolling', '@angular/material/sidenav', '@angular/material/tree', '@angular/material/menu', '@angular/platform-browser', '@angular/cdk/tree', '@angular/common/http', '@angular/material/button-toggle', '@angular/material/select', '@angular/material/snack-bar', '@ckeditor/ckeditor5-angular', 'jquery', 'lodash', '@angular/material/tooltip', '@angular/material/badge', '@angular/material/toolbar', '@angular/cdk/stepper', '@angular/material/stepper', '@angular/material/slide-toggle'], factory) :
-    (global = typeof globalThis !== 'undefined' ? globalThis : global || self, factory(global['qms-angular'] = {}, global.ng.core, global.rxjs, global.ng.common, global.ng.forms, global.ng.material.formField, global.ng.material.radio, global.ng.material.dialog, global.rxjs.operators, global.ng.material.autocomplete, global.ng.cdk.overlay, global.ng.cdk.portal, global.ng.material.input, global.ng.material.card, global.ng.material.icon, global.ng.material.checkbox, global.ng.material.chips, global.ng.material.button, global.ng.material.core, global.ng.material.progressSpinner, global.ng.cdk.a11y, global.ng.cdk.coercion, global.ng.cdk.collections, global.ng.platformBrowser.animations, global.moment, global.ng.material.list, global.ng.material.expansion, global.ng.cdk.scrolling, global.ng.material.sidenav, global.ng.material.tree, global.ng.material.menu, global.ng.platformBrowser, global.ng.cdk.tree, global.ng.common.http, global.ng.material.buttonToggle, global.ng.material.select, global.ng.material.snackBar, global.ckeditor5Angular, global.$$1, global._, global.ng.material.tooltip, global.ng.material.badge, global.ng.material.toolbar, global.ng.cdk.stepper, global.ng.material.stepper, global.ng.material.slideToggle));
-}(this, (function (exports, i0, rxjs, common, forms, formField, radio, dialog, operators, autocomplete, overlay, portal, input, card, icon, checkbox, chips, button, core, progressSpinner, a11y, coercion, collections, animations, moment, list, expansion, scrolling, sidenav, tree$1, menu, platformBrowser, tree, i1, buttonToggle, select, snackBar, ckeditor5Angular, $$1, _, tooltip, badge, toolbar, stepper$1, stepper, slideToggle) { 'use strict';
+    typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports, require('@angular/core'), require('rxjs'), require('@angular/common'), require('@angular/forms'), require('@angular/material/form-field'), require('@angular/material/radio'), require('@angular/material/dialog'), require('rxjs/operators'), require('@angular/material/autocomplete'), require('@angular/cdk/overlay'), require('@angular/cdk/portal'), require('@angular/material/input'), require('@angular/material/card'), require('@angular/material/icon'), require('@angular/material/checkbox'), require('@angular/material/chips'), require('@angular/material/button'), require('@angular/material/core'), require('@angular/material/progress-spinner'), require('@angular/cdk/a11y'), require('@angular/cdk/coercion'), require('@angular/cdk/collections'), require('@angular/platform-browser/animations'), require('moment'), require('@angular/material/list'), require('@angular/material/expansion'), require('@angular/cdk/scrolling'), require('@angular/material/sidenav'), require('@angular/material/tree'), require('@angular/material/menu'), require('@angular/platform-browser'), require('@angular/cdk/tree'), require('@angular/common/http'), require('@angular/material/button-toggle'), require('@angular/material/select'), require('@angular/material/snack-bar'), require('@ckeditor/ckeditor5-angular'), require('jquery'), require('lodash'), require('@angular/material/tooltip'), require('@angular/material/badge'), require('@angular/material/toolbar'), require('@angular/cdk/stepper'), require('@angular/material/stepper'), require('@angular/material/slide-toggle'), require('@angular/cdk/drag-drop')) :
+    typeof define === 'function' && define.amd ? define('qms-angular', ['exports', '@angular/core', 'rxjs', '@angular/common', '@angular/forms', '@angular/material/form-field', '@angular/material/radio', '@angular/material/dialog', 'rxjs/operators', '@angular/material/autocomplete', '@angular/cdk/overlay', '@angular/cdk/portal', '@angular/material/input', '@angular/material/card', '@angular/material/icon', '@angular/material/checkbox', '@angular/material/chips', '@angular/material/button', '@angular/material/core', '@angular/material/progress-spinner', '@angular/cdk/a11y', '@angular/cdk/coercion', '@angular/cdk/collections', '@angular/platform-browser/animations', 'moment', '@angular/material/list', '@angular/material/expansion', '@angular/cdk/scrolling', '@angular/material/sidenav', '@angular/material/tree', '@angular/material/menu', '@angular/platform-browser', '@angular/cdk/tree', '@angular/common/http', '@angular/material/button-toggle', '@angular/material/select', '@angular/material/snack-bar', '@ckeditor/ckeditor5-angular', 'jquery', 'lodash', '@angular/material/tooltip', '@angular/material/badge', '@angular/material/toolbar', '@angular/cdk/stepper', '@angular/material/stepper', '@angular/material/slide-toggle', '@angular/cdk/drag-drop'], factory) :
+    (global = typeof globalThis !== 'undefined' ? globalThis : global || self, factory(global['qms-angular'] = {}, global.ng.core, global.rxjs, global.ng.common, global.ng.forms, global.ng.material.formField, global.ng.material.radio, global.ng.material.dialog, global.rxjs.operators, global.ng.material.autocomplete, global.ng.cdk.overlay, global.ng.cdk.portal, global.ng.material.input, global.ng.material.card, global.ng.material.icon, global.ng.material.checkbox, global.ng.material.chips, global.ng.material.button, global.ng.material.core, global.ng.material.progressSpinner, global.ng.cdk.a11y, global.ng.cdk.coercion, global.ng.cdk.collections, global.ng.platformBrowser.animations, global.moment, global.ng.material.list, global.ng.material.expansion, global.ng.cdk.scrolling, global.ng.material.sidenav, global.ng.material.tree, global.ng.material.menu, global.ng.platformBrowser, global.ng.cdk.tree, global.ng.common.http, global.ng.material.buttonToggle, global.ng.material.select, global.ng.material.snackBar, global.ckeditor5Angular, global.$$1, global._, global.ng.material.tooltip, global.ng.material.badge, global.ng.material.toolbar, global.ng.cdk.stepper, global.ng.material.stepper, global.ng.material.slideToggle, global.ng.cdk.dragDrop));
+}(this, (function (exports, i0, rxjs, common, forms, formField, radio, dialog, operators, autocomplete, overlay, portal, input, card, icon, checkbox, chips, button, core, progressSpinner, a11y, coercion, collections, animations, moment, list, expansion, scrolling, sidenav, tree$1, menu, platformBrowser, tree, i1, buttonToggle, select, snackBar, ckeditor5Angular, $$1, _, tooltip, badge, toolbar, stepper$1, stepper, slideToggle, dragDrop) { 'use strict';
 
     function _interopNamespace(e) {
         if (e && e.__esModule) return e;
@@ -658,12 +658,16 @@
             item.isDelete = true;
             this.updateLog.emit(item);
         };
+        QMSComment.prototype.regretItem = function (item) {
+            item.isDelete = false;
+            this.updateLog.emit(item);
+        };
         return QMSComment;
     }());
     QMSComment.decorators = [
         { type: i0.Component, args: [{
                     selector: 'qms-comment',
-                    template: "<div class=\"qms-comment\" *ngFor=\"let item of sourceLog; let i = index\">\r\n  <mat-card-header *ngIf=\"!item.isDelete\">\r\n    <mat-card-subtitle\r\n      >{{ item.user }} {{ item.date | dateFormat }}\r\n    </mat-card-subtitle>\r\n  </mat-card-header>\r\n  <mat-card-content>\r\n    <div\r\n      qms-scrollbar\r\n      *ngIf=\"!item.isEdit && !item.isDelete\"\r\n      class=\"content\"\r\n      [ngClass]=\"{ secondary: 0 != i % 2 }\"\r\n      [innerHTML]=\"showContent(item.content)\"\r\n    ></div>\r\n    <div class=\"content delete-action-wrap\" *ngIf=\"item.isDelete\">\r\n      <i>{{ LANG.DELETE_MESSAGE_COMMENT }}</i>\r\n      <button qms-btn-text class=\"btn-action\" (click)=\"item.isDelete = false\">\r\n        {{ LANG.REGRET }}\r\n      </button>\r\n    </div>\r\n    <mat-form-field *ngIf=\"item.isEdit && !item.isDelete\" qms-form-textarea>\r\n      <textarea\r\n        qms-scrollbar\r\n        class=\"textarea-comment\"\r\n        matInput\r\n        cdkTextareaAutosize\r\n        cdkAutosizeMinRows=\"1\"\r\n        cdkAutosizeMaxRows=\"5\"\r\n        [(ngModel)]=\"item.editedContent\"\r\n      ></textarea>\r\n    </mat-form-field>\r\n  </mat-card-content>\r\n  <mat-card-actions *ngIf=\"item.isDraft && !item.isEdit && !item.isDelete\">\r\n    <a class=\"btn-action\" (click)=\"editContent(item)\"> {{ LANG.EDIT }} </a>\r\n    <a class=\"btn-action ml-20\" (click)=\"removeItem(item)\">{{ LANG.DELETE }}</a>\r\n  </mat-card-actions>\r\n  <mat-card-actions *ngIf=\"item.isEdit\" class=\"edit-action-wrap\">\r\n    <button qms-btn (click)=\"saveEditedContent(item)\">{{ LANG.SAVE }}</button>\r\n    <button qms-btn-text (click)=\"item.isEdit = false\" class=\"ml-10\">\r\n      {{ LANG.CANCEL }}\r\n    </button>\r\n  </mat-card-actions>\r\n</div>\r\n",
+                    template: "<div class=\"qms-comment\" *ngFor=\"let item of sourceLog; let i = index\">\r\n  <mat-card-header *ngIf=\"!item.isDelete\">\r\n    <mat-card-subtitle\r\n      >{{ item.user }} {{ item.date | dateFormat }}\r\n    </mat-card-subtitle>\r\n  </mat-card-header>\r\n  <mat-card-content>\r\n    <div\r\n      qms-scrollbar\r\n      *ngIf=\"!item.isEdit && !item.isDelete\"\r\n      class=\"content\"\r\n      [ngClass]=\"{ secondary: 0 != i % 2 }\"\r\n      [innerHTML]=\"showContent(item.content)\"\r\n    ></div>\r\n    <div class=\"content delete-action-wrap\" *ngIf=\"item.isDelete\">\r\n      <i>{{ LANG.DELETE_MESSAGE_COMMENT }}</i>\r\n      <button qms-btn-text class=\"btn-action\" (click)=\"regretItem(item)\">\r\n        {{ LANG.REGRET }}\r\n      </button>\r\n    </div>\r\n    <mat-form-field *ngIf=\"item.isEdit && !item.isDelete\" qms-form-textarea>\r\n      <textarea\r\n        qms-scrollbar\r\n        class=\"textarea-comment\"\r\n        matInput\r\n        cdkTextareaAutosize\r\n        cdkAutosizeMinRows=\"1\"\r\n        cdkAutosizeMaxRows=\"5\"\r\n        [(ngModel)]=\"item.editedContent\"\r\n      ></textarea>\r\n    </mat-form-field>\r\n  </mat-card-content>\r\n  <mat-card-actions *ngIf=\"item.isDraft && !item.isEdit && !item.isDelete\">\r\n    <a class=\"btn-action\" (click)=\"editContent(item)\"> {{ LANG.EDIT }} </a>\r\n    <a class=\"btn-action ml-20\" (click)=\"removeItem(item)\">{{ LANG.DELETE }}</a>\r\n  </mat-card-actions>\r\n  <mat-card-actions *ngIf=\"item.isEdit\" class=\"edit-action-wrap\">\r\n    <button qms-btn (click)=\"saveEditedContent(item)\">{{ LANG.SAVE }}</button>\r\n    <button qms-btn-text (click)=\"item.isEdit = false\" class=\"ml-10\">\r\n      {{ LANG.CANCEL }}\r\n    </button>\r\n  </mat-card-actions>\r\n</div>\r\n",
                     host: { 'class': 'qms-comment' },
                     changeDetection: i0.ChangeDetectionStrategy.OnPush,
                     styles: ["@font-face{font-family:Open Sans;font-style:normal;font-weight:400;font-display:swap;src:url(https://fonts.gstatic.com/s/opensans/v20/mem8YaGs126MiZpBA-UFWJ0bbck.woff2) format(\"woff2\");unicode-range:U+0460-052f,U+1c80-1c88,U+20b4,U+2de0-2dff,U+a640-a69f,U+fe2e-fe2f}@font-face{font-family:Open Sans;font-style:normal;font-weight:400;font-display:swap;src:url(https://fonts.gstatic.com/s/opensans/v20/mem8YaGs126MiZpBA-UFUZ0bbck.woff2) format(\"woff2\");unicode-range:U+0400-045f,U+0490-0491,U+04b0-04b1,U+2116}@font-face{font-family:Open Sans;font-style:normal;font-weight:400;font-display:swap;src:url(https://fonts.gstatic.com/s/opensans/v20/mem8YaGs126MiZpBA-UFWZ0bbck.woff2) format(\"woff2\");unicode-range:U+1f??}@font-face{font-family:Open Sans;font-style:normal;font-weight:400;font-display:swap;src:url(https://fonts.gstatic.com/s/opensans/v20/mem8YaGs126MiZpBA-UFVp0bbck.woff2) format(\"woff2\");unicode-range:U+0370-03ff}@font-face{font-family:Open Sans;font-style:normal;font-weight:400;font-display:swap;src:url(https://fonts.gstatic.com/s/opensans/v20/mem8YaGs126MiZpBA-UFWp0bbck.woff2) format(\"woff2\");unicode-range:U+0102-0103,U+0110-0111,U+0128-0129,U+0168-0169,U+01a0-01a1,U+01af-01b0,U+1ea0-1ef9,U+20ab}@font-face{font-family:Open Sans;font-style:normal;font-weight:400;font-display:swap;src:url(https://fonts.gstatic.com/s/opensans/v20/mem8YaGs126MiZpBA-UFW50bbck.woff2) format(\"woff2\");unicode-range:U+0100-024f,U+0259,U+1e??,U+2020,U+20a0-20ab,U+20ad-20cf,U+2113,U+2c60-2c7f,U+a720-a7ff}@font-face{font-family:Open Sans;font-style:normal;font-weight:400;font-display:swap;src:url(https://fonts.gstatic.com/s/opensans/v20/mem8YaGs126MiZpBA-UFVZ0b.woff2) format(\"woff2\");unicode-range:U+00??,U+0131,U+0152-0153,U+02bb-02bc,U+02c6,U+02da,U+02dc,U+2000-206f,U+2074,U+20ac,U+2122,U+2191,U+2193,U+2212,U+2215,U+feff,U+fffd}@font-face{font-family:Raleway;font-style:normal;font-weight:400;font-display:swap;src:url(https://fonts.gstatic.com/s/raleway/v19/1Ptxg8zYS_SKggPN4iEgvnHyvveLxVvaorCFPrEHJA.woff2) format(\"woff2\");unicode-range:U+0460-052f,U+1c80-1c88,U+20b4,U+2de0-2dff,U+a640-a69f,U+fe2e-fe2f}@font-face{font-family:Raleway;font-style:normal;font-weight:400;font-display:swap;src:url(https://fonts.gstatic.com/s/raleway/v19/1Ptxg8zYS_SKggPN4iEgvnHyvveLxVvaorCMPrEHJA.woff2) format(\"woff2\");unicode-range:U+0400-045f,U+0490-0491,U+04b0-04b1,U+2116}@font-face{font-family:Raleway;font-style:normal;font-weight:400;font-display:swap;src:url(https://fonts.gstatic.com/s/raleway/v19/1Ptxg8zYS_SKggPN4iEgvnHyvveLxVvaorCHPrEHJA.woff2) format(\"woff2\");unicode-range:U+0102-0103,U+0110-0111,U+0128-0129,U+0168-0169,U+01a0-01a1,U+01af-01b0,U+1ea0-1ef9,U+20ab}@font-face{font-family:Raleway;font-style:normal;font-weight:400;font-display:swap;src:url(https://fonts.gstatic.com/s/raleway/v19/1Ptxg8zYS_SKggPN4iEgvnHyvveLxVvaorCGPrEHJA.woff2) format(\"woff2\");unicode-range:U+0100-024f,U+0259,U+1e??,U+2020,U+20a0-20ab,U+20ad-20cf,U+2113,U+2c60-2c7f,U+a720-a7ff}@font-face{font-family:Raleway;font-style:normal;font-weight:400;font-display:swap;src:url(https://fonts.gstatic.com/s/raleway/v19/1Ptxg8zYS_SKggPN4iEgvnHyvveLxVvaorCIPrE.woff2) format(\"woff2\");unicode-range:U+00??,U+0131,U+0152-0153,U+02bb-02bc,U+02c6,U+02da,U+02dc,U+2000-206f,U+2074,U+20ac,U+2122,U+2191,U+2193,U+2212,U+2215,U+feff,U+fffd}.qms-comment{font-family:Open Sans;margin-bottom:1rem;display:block}.qms-comment .mat-card-subtitle{font-size:.75rem;color:rgba(0,0,0,.6)}.qms-comment .mat-card-content .content{padding:10px 16px;background-color:rgba(0,0,0,.04);display:block;border-radius:4px;font-size:.875rem;max-height:125px;overflow-y:auto}.qms-comment .mat-card-content .content.delete-action-wrap{display:flex;justify-content:space-between;align-items:center}.qms-comment .mat-card-content .content.secondary{background-color:rgba(62,87,183,.12)}.qms-comment .mat-card-content .qms-form{width:100%}.qms-comment .btn-action{color:#1954a9;font-weight:600;font-size:13px;cursor:pointer}.qms-comment .textarea-comment{font-size:.875rem}.ml-10{margin-left:10px}.mt-15{margin-top:15px}.ml-20{margin-left:20px}.edit-action-wrap{display:block;margin-top:-10px}"]
@@ -880,23 +884,6 @@
         qmsSuffix: [{ type: i0.ContentChild, args: [QMSSuffixDirective, { static: false },] }]
     };
 
-    var TestOnlyComponent = /** @class */ (function () {
-        function TestOnlyComponent() {
-            this.text = "";
-        }
-        return TestOnlyComponent;
-    }());
-    TestOnlyComponent.decorators = [
-        { type: i0.Component, args: [{
-                    selector: 'qms-test-only',
-                    template: "<div class=\"test-container\">\r\n    <h1 class=\"content\">{{ text }}</h1>\r\n</div>",
-                    styles: [".test-container .content{background-color:#f4e9e5;max-height:36vw;overflow-y:scroll;overflow-x:hidden}"]
-                },] }
-    ];
-    TestOnlyComponent.propDecorators = {
-        text: [{ type: i0.Input }]
-    };
-
     var QMSChipInputChipListDirective = /** @class */ (function () {
         function QMSChipInputChipListDirective(ele) {
             this.ele = ele;
@@ -1889,76 +1876,6 @@
         { type: i0.ElementRef }
     ]; };
 
-    var QMSTabGroupAdvancedDirective = /** @class */ (function () {
-        function QMSTabGroupAdvancedDirective(ele) {
-            this.ele = ele;
-        }
-        QMSTabGroupAdvancedDirective.prototype.ngOnInit = function () {
-            if (this.ele) {
-                this.ele.nativeElement.classList.add('qms-tab-group-advanced');
-                if (this.color) {
-                    this.ele.nativeElement.classList.add(this.color);
-                }
-                if (this.type === 'fixed') {
-                    this.ele.nativeElement.classList.add('qms-tab-group-advanced-fixed');
-                }
-            }
-        };
-        return QMSTabGroupAdvancedDirective;
-    }());
-    QMSTabGroupAdvancedDirective.decorators = [
-        { type: i0.Directive, args: [{
-                    selector: '[qms-tab-group-advanced]',
-                },] }
-    ];
-    QMSTabGroupAdvancedDirective.ctorParameters = function () { return [
-        { type: i0.ElementRef }
-    ]; };
-    QMSTabGroupAdvancedDirective.propDecorators = {
-        color: [{ type: i0.Input }],
-        type: [{ type: i0.Input }]
-    };
-
-    var QMSTabGroupDirective = /** @class */ (function () {
-        function QMSTabGroupDirective(ele) {
-            this.ele = ele;
-        }
-        QMSTabGroupDirective.prototype.ngOnInit = function () {
-            if (this.ele) {
-                this.ele.nativeElement.classList.add('qms-tab-group');
-            }
-        };
-        return QMSTabGroupDirective;
-    }());
-    QMSTabGroupDirective.decorators = [
-        { type: i0.Directive, args: [{
-                    selector: '[qms-tab-group]',
-                },] }
-    ];
-    QMSTabGroupDirective.ctorParameters = function () { return [
-        { type: i0.ElementRef }
-    ]; };
-
-    var QMSTabLabelDirective = /** @class */ (function () {
-        function QMSTabLabelDirective(ele) {
-            this.ele = ele;
-        }
-        QMSTabLabelDirective.prototype.ngOnInit = function () {
-            if (this.ele) {
-                this.ele.nativeElement.classList.add('qms-tab-label');
-            }
-        };
-        return QMSTabLabelDirective;
-    }());
-    QMSTabLabelDirective.decorators = [
-        { type: i0.Directive, args: [{
-                    selector: '[qms-tab-label]',
-                },] }
-    ];
-    QMSTabLabelDirective.ctorParameters = function () { return [
-        { type: i0.ElementRef }
-    ]; };
-
     var QMSTextBlockLine = /** @class */ (function () {
         function QMSTextBlockLine(elRef, renderer) {
             this.elRef = elRef;
@@ -3121,7 +3038,7 @@
             return attributes.some(function (attribute) { return _this._getHostElement().hasAttribute(attribute); });
         };
         QMSButtonIcon.prototype.ngAfterViewInit = function () {
-            if (this.type) {
+            if (this.active) {
                 this.renderer.addClass(this._elementRef.nativeElement, 'active-icon');
             }
             this._focusMonitor.monitor(this._elementRef, true);
@@ -3140,10 +3057,10 @@
                         '[attr.disabled]': 'disabled || null',
                         '[class._qms-animation-noopable]': '_animationMode === "NoopAnimations"',
                         '[class.qms-btn-disabled]': 'disabled',
-                        '[class.active-icon]': 'type',
+                        '[class.active-icon]': 'active',
                     },
                     template: "<span class=\"qms-btn-icon-wrapper\"><ng-content></ng-content></span>\r\n<span class=\"qms-button-focus-overlay\"></span>\r\n",
-                    inputs: ['disabled', 'color', 'type'],
+                    inputs: ['disabled', 'color', 'active'],
                     encapsulation: i0.ViewEncapsulation.None,
                     changeDetection: i0.ChangeDetectionStrategy.OnPush,
                     styles: ["@font-face{font-family:Open Sans;font-style:normal;font-weight:400;font-display:swap;src:url(https://fonts.gstatic.com/s/opensans/v20/mem8YaGs126MiZpBA-UFWJ0bbck.woff2) format(\"woff2\");unicode-range:U+0460-052f,U+1c80-1c88,U+20b4,U+2de0-2dff,U+a640-a69f,U+fe2e-fe2f}@font-face{font-family:Open Sans;font-style:normal;font-weight:400;font-display:swap;src:url(https://fonts.gstatic.com/s/opensans/v20/mem8YaGs126MiZpBA-UFUZ0bbck.woff2) format(\"woff2\");unicode-range:U+0400-045f,U+0490-0491,U+04b0-04b1,U+2116}@font-face{font-family:Open Sans;font-style:normal;font-weight:400;font-display:swap;src:url(https://fonts.gstatic.com/s/opensans/v20/mem8YaGs126MiZpBA-UFWZ0bbck.woff2) format(\"woff2\");unicode-range:U+1f??}@font-face{font-family:Open Sans;font-style:normal;font-weight:400;font-display:swap;src:url(https://fonts.gstatic.com/s/opensans/v20/mem8YaGs126MiZpBA-UFVp0bbck.woff2) format(\"woff2\");unicode-range:U+0370-03ff}@font-face{font-family:Open Sans;font-style:normal;font-weight:400;font-display:swap;src:url(https://fonts.gstatic.com/s/opensans/v20/mem8YaGs126MiZpBA-UFWp0bbck.woff2) format(\"woff2\");unicode-range:U+0102-0103,U+0110-0111,U+0128-0129,U+0168-0169,U+01a0-01a1,U+01af-01b0,U+1ea0-1ef9,U+20ab}@font-face{font-family:Open Sans;font-style:normal;font-weight:400;font-display:swap;src:url(https://fonts.gstatic.com/s/opensans/v20/mem8YaGs126MiZpBA-UFW50bbck.woff2) format(\"woff2\");unicode-range:U+0100-024f,U+0259,U+1e??,U+2020,U+20a0-20ab,U+20ad-20cf,U+2113,U+2c60-2c7f,U+a720-a7ff}@font-face{font-family:Open Sans;font-style:normal;font-weight:400;font-display:swap;src:url(https://fonts.gstatic.com/s/opensans/v20/mem8YaGs126MiZpBA-UFVZ0b.woff2) format(\"woff2\");unicode-range:U+00??,U+0131,U+0152-0153,U+02bb-02bc,U+02c6,U+02da,U+02dc,U+2000-206f,U+2074,U+20ac,U+2122,U+2191,U+2193,U+2212,U+2215,U+feff,U+fffd}@font-face{font-family:Raleway;font-style:normal;font-weight:400;font-display:swap;src:url(https://fonts.gstatic.com/s/raleway/v19/1Ptxg8zYS_SKggPN4iEgvnHyvveLxVvaorCFPrEHJA.woff2) format(\"woff2\");unicode-range:U+0460-052f,U+1c80-1c88,U+20b4,U+2de0-2dff,U+a640-a69f,U+fe2e-fe2f}@font-face{font-family:Raleway;font-style:normal;font-weight:400;font-display:swap;src:url(https://fonts.gstatic.com/s/raleway/v19/1Ptxg8zYS_SKggPN4iEgvnHyvveLxVvaorCMPrEHJA.woff2) format(\"woff2\");unicode-range:U+0400-045f,U+0490-0491,U+04b0-04b1,U+2116}@font-face{font-family:Raleway;font-style:normal;font-weight:400;font-display:swap;src:url(https://fonts.gstatic.com/s/raleway/v19/1Ptxg8zYS_SKggPN4iEgvnHyvveLxVvaorCHPrEHJA.woff2) format(\"woff2\");unicode-range:U+0102-0103,U+0110-0111,U+0128-0129,U+0168-0169,U+01a0-01a1,U+01af-01b0,U+1ea0-1ef9,U+20ab}@font-face{font-family:Raleway;font-style:normal;font-weight:400;font-display:swap;src:url(https://fonts.gstatic.com/s/raleway/v19/1Ptxg8zYS_SKggPN4iEgvnHyvveLxVvaorCGPrEHJA.woff2) format(\"woff2\");unicode-range:U+0100-024f,U+0259,U+1e??,U+2020,U+20a0-20ab,U+20ad-20cf,U+2113,U+2c60-2c7f,U+a720-a7ff}@font-face{font-family:Raleway;font-style:normal;font-weight:400;font-display:swap;src:url(https://fonts.gstatic.com/s/raleway/v19/1Ptxg8zYS_SKggPN4iEgvnHyvveLxVvaorCIPrE.woff2) format(\"woff2\");unicode-range:U+00??,U+0131,U+0152-0153,U+02bb-02bc,U+02c6,U+02da,U+02dc,U+2000-206f,U+2074,U+20ac,U+2122,U+2191,U+2193,U+2212,U+2215,U+feff,U+fffd}.qms-btn{height:36px;line-height:34px;padding:0 10px;background-color:#1954a9;color:#fff}.qms-btn:not([disabled]):focus:not(:focus-visible){box-shadow:none}.qms-btn:not([disabled]):focus{background-color:#1954a9;box-shadow:0 0 0 2px #8caad4}.qms-btn:not([disabled]):hover{background-color:#2873df;color:#fff}.qms-btn.qms-primary{background-color:#1954a9;color:#fff}.qms-btn.qms-primary:not([disabled]):focus:not(:focus-visible){box-shadow:none}.qms-btn.qms-primary:not([disabled]):focus{background-color:#1954a9;box-shadow:0 0 0 2px #8caad4}.qms-btn.qms-primary:not([disabled]):hover{background-color:#2873df;color:#fff}.qms-btn.qms-secondary{background-color:#9e360f;color:#fff}.qms-btn.qms-secondary:not([disabled]):focus:not(:focus-visible){box-shadow:none}.qms-btn.qms-secondary:not([disabled]):focus{background-color:#9e360f;box-shadow:0 0 0 2px #cf9b87}.qms-btn.qms-secondary:not([disabled]):hover{background-color:#b63e11;color:#fff}.qms-btn-lg{height:48px;line-height:38px;padding:4px 14px;background-color:#1954a9;color:#fff}.qms-btn-lg:not([disabled]):focus:not(:focus-visible){box-shadow:none}.qms-btn-lg:not([disabled]):focus{background-color:#1954a9;box-shadow:0 0 0 2px #8caad4}.qms-btn-lg:not([disabled]):hover{background-color:#2873df;color:#fff}.qms-btn-lg.qms-primary{background-color:#1954a9;color:#fff}.qms-btn-lg.qms-primary:not([disabled]):focus:not(:focus-visible){box-shadow:none}.qms-btn-lg.qms-primary:not([disabled]):focus{background-color:#1954a9;box-shadow:0 0 0 2px #8caad4}.qms-btn-lg.qms-primary:not([disabled]):hover{background-color:#2873df;color:#fff}.qms-btn-lg.qms-secondary{background-color:#9e360f;color:#fff}.qms-btn-lg.qms-secondary:not([disabled]):focus:not(:focus-visible){box-shadow:none}.qms-btn-lg.qms-secondary:not([disabled]):focus{background-color:#9e360f;box-shadow:0 0 0 2px #cf9b87}.qms-btn-lg.qms-secondary:not([disabled]):hover{background-color:#b63e11;color:#fff}.qms-btn-outlined{height:36px;line-height:34px;padding:0 9px;background-color:#fff;color:#1954a9;border:1px solid rgba(0,0,0,.12)}.qms-btn-outlined:not([disabled]):focus:not(:focus-visible){box-shadow:none}.qms-btn-outlined:not([disabled]):focus{background-color:#fff;color:#1954a9;box-shadow:0 0 0 2px #1954a9}.qms-btn-outlined:not([disabled]):hover{background-color:rgba(40,115,223,.06);color:#1954a9}.qms-btn-outlined.qms-primary{background-color:#fff;color:#1954a9;border:1px solid rgba(0,0,0,.12)}.qms-btn-outlined.qms-primary:not([disabled]):focus:not(:focus-visible){box-shadow:none}.qms-btn-outlined.qms-primary:not([disabled]):focus{background-color:#fff;color:#1954a9;box-shadow:0 0 0 2px #1954a9}.qms-btn-outlined.qms-primary:not([disabled]):hover{background-color:rgba(40,115,223,.06);color:#1954a9}.qms-btn-outlined.qms-secondary{background-color:#fff;color:#9e360f;border:1px solid #9e360f}.qms-btn-outlined.qms-secondary:not([disabled]):focus:not(:focus-visible){box-shadow:none}.qms-btn-outlined.qms-secondary:not([disabled]):focus{background-color:#fff;color:#b63e11;box-shadow:0 0 0 2px #872e0d}.qms-btn-outlined.qms-secondary:not([disabled]):hover{background-color:rgba(207,71,20,.06);color:#b63e11;border:1px solid #b63e11}.qms-btn-outlined-lg{height:48px;line-height:38px;padding:4px 13px;background-color:#fff;color:#1954a9;border:1px solid rgba(0,0,0,.12)}.qms-btn-outlined-lg:not([disabled]):focus:not(:focus-visible){box-shadow:none}.qms-btn-outlined-lg:not([disabled]):focus{background-color:#fff;color:#1954a9;box-shadow:0 0 0 2px #1954a9}.qms-btn-outlined-lg:not([disabled]):hover{background-color:rgba(40,115,223,.06);color:#1954a9}.qms-btn-outlined-lg.qms-primary{background-color:#fff;color:#1954a9;border:1px solid rgba(0,0,0,.12)}.qms-btn-outlined-lg.qms-primary:not([disabled]):focus:not(:focus-visible){box-shadow:none}.qms-btn-outlined-lg.qms-primary:not([disabled]):focus{background-color:#fff;color:#1954a9;box-shadow:0 0 0 2px #1954a9}.qms-btn-outlined-lg.qms-primary:not([disabled]):hover{background-color:rgba(40,115,223,.06);color:#1954a9}.qms-btn-outlined-lg.qms-secondary{background-color:#fff;color:#9e360f;border:1px solid #9e360f}.qms-btn-outlined-lg.qms-secondary:not([disabled]):focus:not(:focus-visible){box-shadow:none}.qms-btn-outlined-lg.qms-secondary:not([disabled]):focus{background-color:#fff;color:#b63e11;box-shadow:0 0 0 2px #872e0d}.qms-btn-outlined-lg.qms-secondary:not([disabled]):hover{background-color:rgba(207,71,20,.06);color:#b63e11;border:1px solid #b63e11}.qms-btn-text{height:36px;line-height:34px;padding:0 10px;background-color:transparent;color:#1954a9}.qms-btn-text:not([disabled]):focus:not(:focus-visible){box-shadow:none}.qms-btn-text:not([disabled]):focus{background-color:transparent;color:#1954a9;box-shadow:0 0 0 2px #1954a9}.qms-btn-text:not([disabled]):hover{background-color:rgba(40,115,223,.06);color:#1954a9}.qms-btn-text.qms-primary{background-color:transparent;color:#1954a9}.qms-btn-text.qms-primary:not([disabled]):focus:not(:focus-visible){box-shadow:none}.qms-btn-text.qms-primary:not([disabled]):focus{background-color:transparent;color:#1954a9;box-shadow:0 0 0 2px #1954a9}.qms-btn-text.qms-primary:not([disabled]):hover{background-color:rgba(40,115,223,.06);color:#1954a9}.qms-btn-text.qms-secondary{background-color:transparent;color:#9e360f}.qms-btn-text.qms-secondary:not([disabled]):focus:not(:focus-visible){box-shadow:none}.qms-btn-text.qms-secondary:not([disabled]):focus{background-color:transparent;color:#b63e11;box-shadow:0 0 0 2px #872e0d}.qms-btn-text.qms-secondary:not([disabled]):hover{background-color:rgba(207,71,20,.06);color:#b63e11}.qms-btn-text-lg{height:48px;line-height:38px;padding:4px 14px;background-color:transparent;color:#1954a9}.qms-btn-text-lg:not([disabled]):focus:not(:focus-visible){box-shadow:none}.qms-btn-text-lg:not([disabled]):focus{background-color:transparent;color:#1954a9;box-shadow:0 0 0 2px #1954a9}.qms-btn-text-lg:not([disabled]):hover{background-color:rgba(40,115,223,.06);color:#1954a9}.qms-btn-text-lg.qms-primary{background-color:transparent;color:#1954a9}.qms-btn-text-lg.qms-primary:not([disabled]):focus:not(:focus-visible){box-shadow:none}.qms-btn-text-lg.qms-primary:not([disabled]):focus{background-color:transparent;color:#1954a9;box-shadow:0 0 0 2px #1954a9}.qms-btn-text-lg.qms-primary:not([disabled]):hover{background-color:rgba(40,115,223,.06);color:#1954a9}.qms-btn-text-lg.qms-secondary{background-color:transparent;color:#9e360f}.qms-btn-text-lg.qms-secondary:not([disabled]):focus:not(:focus-visible){box-shadow:none}.qms-btn-text-lg.qms-secondary:not([disabled]):focus{background-color:transparent;color:#b63e11;box-shadow:0 0 0 2px #872e0d}.qms-btn-text-lg.qms-secondary:not([disabled]):hover{background-color:rgba(207,71,20,.06);color:#b63e11}.qms-btn-fab,.qms-btn-fab-sm{min-width:0;width:56px;height:56px;padding:0;flex-shrink:0;box-shadow:0 8px 10px rgba(0,0,0,.14),0 3px 14px rgba(0,0,0,.12),0 5px 5px rgba(0,0,0,.2);background-color:#1954a9;color:#fff}.qms-btn-fab-sm .qms-btn-wrapper,.qms-btn-fab .qms-btn-wrapper{padding:16px 0;display:inline-block;line-height:24px}.qms-btn-fab-sm:not([disabled]):focus:not(:focus-visible),.qms-btn-fab:not([disabled]):focus:not(:focus-visible){box-shadow:none}.qms-btn-fab-sm:not([disabled]):focus,.qms-btn-fab:not([disabled]):focus{background-color:#1954a9;box-shadow:0 0 0 2px #8caad4}.qms-btn-fab-sm:not([disabled]):hover,.qms-btn-fab:not([disabled]):hover{background-color:#2873df;color:#fff}.qms-btn-fab-sm:not([disabled]):focus:not(:focus-visible),.qms-btn-fab:not([disabled]):focus:not(:focus-visible){box-shadow:0 8px 10px rgba(0,0,0,.14),0 3px 14px rgba(0,0,0,.12),0 5px 5px rgba(0,0,0,.2)}.qms-btn-fab-sm:not([disabled]):focus,.qms-btn-fab:not([disabled]):focus{box-shadow:0 0 0 2px #8caad4,0 8px 10px rgba(0,0,0,.14),0 3px 14px rgba(0,0,0,.12),0 5px 5px rgba(0,0,0,.2)}.qms-btn-fab.qms-primary,.qms-primary.qms-btn-fab-sm{background-color:#1954a9;color:#fff}.qms-btn-fab.qms-primary:not([disabled]):focus:not(:focus-visible),.qms-primary.qms-btn-fab-sm:not([disabled]):focus:not(:focus-visible){box-shadow:none}.qms-btn-fab.qms-primary:not([disabled]):focus,.qms-primary.qms-btn-fab-sm:not([disabled]):focus{background-color:#1954a9;box-shadow:0 0 0 2px #8caad4}.qms-btn-fab.qms-primary:not([disabled]):hover,.qms-primary.qms-btn-fab-sm:not([disabled]):hover{background-color:#2873df;color:#fff}.qms-btn-fab.qms-primary:not([disabled]):focus:not(:focus-visible),.qms-primary.qms-btn-fab-sm:not([disabled]):focus:not(:focus-visible){box-shadow:0 8px 10px rgba(0,0,0,.14),0 3px 14px rgba(0,0,0,.12),0 5px 5px rgba(0,0,0,.2)}.qms-btn-fab.qms-primary:not([disabled]):focus,.qms-primary.qms-btn-fab-sm:not([disabled]):focus{box-shadow:0 0 0 2px #8caad4,0 8px 10px rgba(0,0,0,.14),0 3px 14px rgba(0,0,0,.12),0 5px 5px rgba(0,0,0,.2)}.qms-btn-fab.qms-secondary,.qms-secondary.qms-btn-fab-sm{background-color:#9e360f;color:#fff}.qms-btn-fab.qms-secondary:not([disabled]):focus:not(:focus-visible),.qms-secondary.qms-btn-fab-sm:not([disabled]):focus:not(:focus-visible){box-shadow:none}.qms-btn-fab.qms-secondary:not([disabled]):focus,.qms-secondary.qms-btn-fab-sm:not([disabled]):focus{background-color:#9e360f;box-shadow:0 0 0 2px #cf9b87}.qms-btn-fab.qms-secondary:not([disabled]):hover,.qms-secondary.qms-btn-fab-sm:not([disabled]):hover{background-color:#b63e11;color:#fff}.qms-btn-fab.qms-secondary:not([disabled]):focus:not(:focus-visible),.qms-secondary.qms-btn-fab-sm:not([disabled]):focus:not(:focus-visible){box-shadow:0 8px 10px rgba(0,0,0,.14),0 3px 14px rgba(0,0,0,.12),0 5px 5px rgba(0,0,0,.2)}.qms-btn-fab.qms-secondary:not([disabled]):focus,.qms-secondary.qms-btn-fab-sm:not([disabled]):focus{box-shadow:0 0 0 2px #cf9b87,0 8px 10px rgba(0,0,0,.14),0 3px 14px rgba(0,0,0,.12),0 5px 5px rgba(0,0,0,.2)}.qms-btn-fab-sm{min-width:0;width:40px;height:40px;padding:0;flex-shrink:0;box-shadow:0 8px 10px rgba(0,0,0,.14),0 3px 14px rgba(0,0,0,.12),0 5px 5px rgba(0,0,0,.2)}.qms-btn-fab-sm .qms-btn-wrapper{padding:8px 0;display:inline-block;line-height:24px}.qms-btn-fab-outlined,.qms-btn-fab-outlined-sm{min-width:0;width:56px;height:56px;padding:0;flex-shrink:0;box-shadow:0 8px 10px rgba(0,0,0,.14),0 3px 14px rgba(0,0,0,.12),0 5px 5px rgba(0,0,0,.2);background-color:#fff;color:#1954a9;border:1px solid rgba(0,0,0,.12)}.qms-btn-fab-outlined-sm .qms-btn-wrapper,.qms-btn-fab-outlined .qms-btn-wrapper{padding:16px 0;display:inline-block;line-height:24px}.qms-btn-fab-outlined-sm:not([disabled]):focus:not(:focus-visible),.qms-btn-fab-outlined:not([disabled]):focus:not(:focus-visible){box-shadow:0 8px 10px rgba(0,0,0,.14),0 3px 14px rgba(0,0,0,.12),0 5px 5px rgba(0,0,0,.2)}.qms-btn-fab-outlined-sm:not([disabled]):focus,.qms-btn-fab-outlined:not([disabled]):focus{background-color:#fff;color:#1954a9;box-shadow:0 0 0 2px #1954a9,0 8px 10px rgba(0,0,0,.14),0 3px 14px rgba(0,0,0,.12),0 5px 5px rgba(0,0,0,.2)}.qms-btn-fab-outlined-sm:not([disabled]):hover,.qms-btn-fab-outlined:not([disabled]):hover{background-color:rgba(40,115,223,.06);color:#1954a9}.qms-btn-fab-outlined.qms-primary,.qms-primary.qms-btn-fab-outlined-sm{background-color:#fff;color:#1954a9;border:1px solid rgba(0,0,0,.12)}.qms-btn-fab-outlined.qms-primary:not([disabled]):focus:not(:focus-visible),.qms-primary.qms-btn-fab-outlined-sm:not([disabled]):focus:not(:focus-visible){box-shadow:0 8px 10px rgba(0,0,0,.14),0 3px 14px rgba(0,0,0,.12),0 5px 5px rgba(0,0,0,.2)}.qms-btn-fab-outlined.qms-primary:not([disabled]):focus,.qms-primary.qms-btn-fab-outlined-sm:not([disabled]):focus{background-color:#fff;color:#1954a9;box-shadow:0 0 0 2px #1954a9,0 8px 10px rgba(0,0,0,.14),0 3px 14px rgba(0,0,0,.12),0 5px 5px rgba(0,0,0,.2)}.qms-btn-fab-outlined.qms-primary:not([disabled]):hover,.qms-primary.qms-btn-fab-outlined-sm:not([disabled]):hover{background-color:rgba(40,115,223,.06);color:#1954a9}.qms-btn-fab-outlined.qms-secondary,.qms-secondary.qms-btn-fab-outlined-sm{background-color:#fff;color:#9e360f;border:1px solid rgba(0,0,0,.12)}.qms-btn-fab-outlined.qms-secondary:not([disabled]):focus:not(:focus-visible),.qms-secondary.qms-btn-fab-outlined-sm:not([disabled]):focus:not(:focus-visible){box-shadow:0 8px 10px rgba(0,0,0,.14),0 3px 14px rgba(0,0,0,.12),0 5px 5px rgba(0,0,0,.2)}.qms-btn-fab-outlined.qms-secondary:not([disabled]):focus,.qms-secondary.qms-btn-fab-outlined-sm:not([disabled]):focus{background-color:#fff;color:#b63e11;box-shadow:0 0 0 2px #872e0d,0 8px 10px rgba(0,0,0,.14),0 3px 14px rgba(0,0,0,.12),0 5px 5px rgba(0,0,0,.2)}.qms-btn-fab-outlined.qms-secondary:not([disabled]):hover,.qms-secondary.qms-btn-fab-outlined-sm:not([disabled]):hover{background-color:rgba(207,71,20,.06);color:#b63e11}.qms-btn-fab-outlined-sm{min-width:0;width:40px;height:40px;padding:0;flex-shrink:0;box-shadow:0 8px 10px rgba(0,0,0,.14),0 3px 14px rgba(0,0,0,.12),0 5px 5px rgba(0,0,0,.2)}.qms-btn-fab-outlined-sm .qms-btn-wrapper{padding:8px 0;display:inline-block;line-height:24px}.qms-btn-fab-ext{box-shadow:0 8px 10px rgba(0,0,0,.14),0 3px 14px rgba(0,0,0,.12),0 5px 5px rgba(0,0,0,.2);padding:0 16px;border-radius:30px;line-height:54px;height:56px;background-color:#1954a9;color:#fff}.qms-btn-fab-ext:not([disabled]):focus:not(:focus-visible){box-shadow:none}.qms-btn-fab-ext:not([disabled]):focus{background-color:#1954a9;box-shadow:0 0 0 2px #8caad4}.qms-btn-fab-ext:not([disabled]):hover{background-color:#2873df;color:#fff}.qms-btn-fab-ext:not([disabled]):focus:not(:focus-visible){box-shadow:0 8px 10px rgba(0,0,0,.14),0 3px 14px rgba(0,0,0,.12),0 5px 5px rgba(0,0,0,.2)}.qms-btn-fab-ext:not([disabled]):focus{box-shadow:0 0 0 2px #8caad4,0 8px 10px rgba(0,0,0,.14),0 3px 14px rgba(0,0,0,.12),0 5px 5px rgba(0,0,0,.2)}.qms-btn-fab-ext.qms-primary{background-color:#1954a9;color:#fff}.qms-btn-fab-ext.qms-primary:not([disabled]):focus:not(:focus-visible){box-shadow:none}.qms-btn-fab-ext.qms-primary:not([disabled]):focus{background-color:#1954a9;box-shadow:0 0 0 2px #8caad4}.qms-btn-fab-ext.qms-primary:not([disabled]):hover{background-color:#2873df;color:#fff}.qms-btn-fab-ext.qms-primary:not([disabled]):focus:not(:focus-visible){box-shadow:0 8px 10px rgba(0,0,0,.14),0 3px 14px rgba(0,0,0,.12),0 5px 5px rgba(0,0,0,.2)}.qms-btn-fab-ext.qms-primary:not([disabled]):focus{box-shadow:0 0 0 2px #8caad4,0 8px 10px rgba(0,0,0,.14),0 3px 14px rgba(0,0,0,.12),0 5px 5px rgba(0,0,0,.2)}.qms-btn-fab-ext.qms-secondary{background-color:#9e360f;color:#fff}.qms-btn-fab-ext.qms-secondary:not([disabled]):focus:not(:focus-visible){box-shadow:none}.qms-btn-fab-ext.qms-secondary:not([disabled]):focus{background-color:#9e360f;box-shadow:0 0 0 2px #cf9b87}.qms-btn-fab-ext.qms-secondary:not([disabled]):hover{background-color:#b63e11;color:#fff}.qms-btn-fab-ext.qms-secondary:not([disabled]):focus:not(:focus-visible){box-shadow:0 8px 10px rgba(0,0,0,.14),0 3px 14px rgba(0,0,0,.12),0 5px 5px rgba(0,0,0,.2)}.qms-btn-fab-ext.qms-secondary:not([disabled]):focus{box-shadow:0 0 0 2px #cf9b87,0 8px 10px rgba(0,0,0,.14),0 3px 14px rgba(0,0,0,.12),0 5px 5px rgba(0,0,0,.2)}.qms-btn-fab-outlined-ext{box-shadow:0 8px 10px rgba(0,0,0,.14),0 3px 14px rgba(0,0,0,.12),0 5px 5px rgba(0,0,0,.2);padding:0 16px;border-radius:30px;line-height:54px;height:56px;background-color:#fff;color:#1954a9;border:1px solid rgba(0,0,0,.12)}.qms-btn-fab-outlined-ext:not([disabled]):focus:not(:focus-visible){box-shadow:0 8px 10px rgba(0,0,0,.14),0 3px 14px rgba(0,0,0,.12),0 5px 5px rgba(0,0,0,.2)}.qms-btn-fab-outlined-ext:not([disabled]):focus{background-color:#fff;color:#1954a9;box-shadow:0 0 0 2px #1954a9,0 8px 10px rgba(0,0,0,.14),0 3px 14px rgba(0,0,0,.12),0 5px 5px rgba(0,0,0,.2)}.qms-btn-fab-outlined-ext:not([disabled]):hover{background-color:rgba(40,115,223,.06);color:#1954a9}.qms-btn-fab-outlined-ext.qms-primary{background-color:#fff;color:#1954a9;border:1px solid rgba(0,0,0,.12)}.qms-btn-fab-outlined-ext.qms-primary:not([disabled]):focus:not(:focus-visible){box-shadow:0 8px 10px rgba(0,0,0,.14),0 3px 14px rgba(0,0,0,.12),0 5px 5px rgba(0,0,0,.2)}.qms-btn-fab-outlined-ext.qms-primary:not([disabled]):focus{background-color:#fff;color:#1954a9;box-shadow:0 0 0 2px #1954a9,0 8px 10px rgba(0,0,0,.14),0 3px 14px rgba(0,0,0,.12),0 5px 5px rgba(0,0,0,.2)}.qms-btn-fab-outlined-ext.qms-primary:not([disabled]):hover{background-color:rgba(40,115,223,.06);color:#1954a9}.qms-btn-fab-outlined-ext.qms-secondary{background-color:#fff;color:#9e360f;border:1px solid rgba(0,0,0,.12)}.qms-btn-fab-outlined-ext.qms-secondary:not([disabled]):focus:not(:focus-visible){box-shadow:0 8px 10px rgba(0,0,0,.14),0 3px 14px rgba(0,0,0,.12),0 5px 5px rgba(0,0,0,.2)}.qms-btn-fab-outlined-ext.qms-secondary:not([disabled]):focus{background-color:#fff;color:#b63e11;box-shadow:0 0 0 2px #872e0d,0 8px 10px rgba(0,0,0,.14),0 3px 14px rgba(0,0,0,.12),0 5px 5px rgba(0,0,0,.2)}.qms-btn-fab-outlined-ext.qms-secondary:not([disabled]):hover{background-color:rgba(207,71,20,.06);color:#b63e11}.qms-btn-icon{box-sizing:border-box;position:relative;overflow:hidden;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;cursor:pointer;outline:none;-webkit-tap-highlight-color:transparent;display:inline-block;white-space:nowrap;text-decoration:none;vertical-align:baseline;text-align:center;margin:0;font-family:Open Sans;font-weight:600;font-size:14px;letter-spacing:1px;font-style:normal}.qms-btn-icon.qms-btn-disabled{cursor:default;background:#e4e4e4;color:rgba(0,0,0,.38)}.qms-btn-icon .mat-icon{font-size:24px!important;padding-bottom:1px}.qms-btn-icon::-moz-focus-inner{border:0}.qms-btn-icon:not([disabled]):hover{text-decoration:none}.qms-btn-icon .qms-btn-icon-wrapper>*{vertical-align:middle}.qms-btn-icon:after{content:\"\";position:absolute;top:50%;left:50%;width:10px;height:10px;background:hsla(0,0%,100%,.5);opacity:0;border-radius:100%;transform:scale(1) translate(-50%);transform-origin:50% 50%}.qms-btn-icon{padding:0;min-width:0;width:48px;height:48px;line-height:48px;border-radius:50%;flex-shrink:0;border:none;background:transparent}.qms-btn-icon:focus{outline:0}.qms-btn-icon:not([disabled]):focus:not(:focus-visible){box-shadow:none}.qms-btn-icon.qms-light{color:rgba(0,0,0,.6)}.qms-btn-icon.qms-light:not([disabled]):focus,.qms-btn-icon.qms-light:not([disabled]):hover{background-color:rgba(0,0,0,.08);color:#323232}.qms-btn-icon.qms-light:not([disabled]):active{background-color:rgba(0,0,0,.24);color:#323232}.qms-btn-icon.qms-light.qms-btn-disabled{color:rgba(0,0,0,.24);background-color:transparent}.qms-btn-icon.qms-light:not(.qms-btn-disabled).active-icon{color:#1954a9}.qms-btn-icon.qms-light:not(.qms-btn-disabled).active-icon:not([disabled]):active,.qms-btn-icon.qms-light:not(.qms-btn-disabled).active-icon:not([disabled]):focus,.qms-btn-icon.qms-light:not(.qms-btn-disabled).active-icon:not([disabled]):hover{background-color:#e5eefb;color:#1954a9}.qms-btn-icon.qms-dark{color:#fff}.qms-btn-icon.qms-dark:not([disabled]):focus,.qms-btn-icon.qms-dark:not([disabled]):hover{background-color:hsla(0,0%,100%,.08)}.qms-btn-icon.qms-dark:not([disabled]):active{background-color:hsla(0,0%,100%,.24)}.qms-btn-icon.qms-dark.qms-btn-disabled{color:hsla(0,0%,100%,.24);background-color:transparent}.qms-btn-icon.qms-dark.active-icon{color:#f6b59d}.qms-btn-icon.qms-dark.active-icon:not([disabled]):focus,.qms-btn-icon.qms-dark.active-icon:not([disabled]):hover{background-color:hsla(0,0%,100%,.08)}.qms-btn-icon.qms-dark.active-icon:not([disabled]):active{background-color:hsla(0,0%,100%,.24)}.qms-btn-icon .qms-button-focus-overlay{opacity:0;transition:opacity .2s cubic-bezier(.35,0,.25,1),background-color .2s cubic-bezier(.35,0,.25,1);top:0;left:0;right:0;bottom:0;position:absolute;pointer-events:none;border-radius:inherit}.qms-btn-icon .qms-btn-icon-wrapper .mat-icon{vertical-align:middle;line-height:24px}.icon-wrapper{display:flex;flex-direction:column;flex-wrap:nowrap;align-items:center}.icon-wrapper.light.disabled .caption{color:rgba(0,0,0,.24);cursor:default;background-color:transparent}.icon-wrapper.light.active .caption{color:#1954a9}.icon-wrapper.light:not(.disabled):hover .caption{color:#323232}.icon-wrapper.light:not(.disabled):focus .caption{color:rgba(0,0,0,.6)}.icon-wrapper.light:not(.disabled):active .caption{color:#323232}.icon-wrapper.light .caption{color:rgba(0,0,0,.6)}.icon-wrapper.dark.disabled .caption{color:hsla(0,0%,100%,.24);cursor:default;background-color:transparent}.icon-wrapper.dark.active .caption{color:#f6b59d}.icon-wrapper.dark .caption{color:#fff}.icon-wrapper .caption{font-size:.75rem;line-height:16px;font-family:Open Sans;font-weight:400}@-webkit-keyframes ripple{0%{transform:scale(0);opacity:1}20%{transform:scale(25);opacity:1}to{opacity:0;transform:scale(40)}}@keyframes ripple{0%{transform:scale(0);opacity:1}20%{transform:scale(25);opacity:1}to{opacity:0;transform:scale(40)}}"]
@@ -3156,7 +3073,7 @@
         { type: String, decorators: [{ type: i0.Optional }, { type: i0.Inject, args: [animations.ANIMATION_MODULE_TYPE,] }] }
     ]; };
     QMSButtonIcon.propDecorators = {
-        type: [{ type: i0.Input, args: ['type',] }]
+        active: [{ type: i0.Input, args: ['active',] }]
     };
 
     var QMSButtonModule = /** @class */ (function () {
@@ -3265,6 +3182,288 @@
         { type: i0.NgModule, args: [{},] }
     ];
 
+    var QMSAppBar = /** @class */ (function () {
+        function QMSAppBar(elRef) {
+            this.elRef = elRef;
+            this.mode = "dark";
+        }
+        QMSAppBar.prototype.ngOnInit = function () {
+        };
+        QMSAppBar.prototype.ngAfterViewChecked = function () {
+            this.elRef.nativeElement.classList.add("qms-app-bar-" + this.mode);
+        };
+        return QMSAppBar;
+    }());
+    QMSAppBar.decorators = [
+        { type: i0.Directive, args: [{
+                    selector: '[qms-app-bar]'
+                },] }
+    ];
+    QMSAppBar.ctorParameters = function () { return [
+        { type: i0.ElementRef }
+    ]; };
+    QMSAppBar.propDecorators = {
+        mode: [{ type: i0.Input, args: ['mode',] }]
+    };
+
+    var QMSTableExpandDirective = /** @class */ (function () {
+        function QMSTableExpandDirective(_el, renderer) {
+            this._el = _el;
+            this.renderer = renderer;
+            this._el.nativeElement.classList.add('qms-table');
+        }
+        QMSTableExpandDirective.prototype.ngAfterViewChecked = function () {
+            var e_1, _c;
+            var matRows = this._el.nativeElement.querySelectorAll('mat-row');
+            try {
+                for (var _d = __values(Object.entries(matRows)), _e = _d.next(); !_e.done; _e = _d.next()) {
+                    var _f = __read(_e.value, 2), key = _f[0], value = _f[1];
+                    this.renderer.addClass(value, 'qms-row');
+                }
+            }
+            catch (e_1_1) { e_1 = { error: e_1_1 }; }
+            finally {
+                try {
+                    if (_e && !_e.done && (_c = _d.return)) _c.call(_d);
+                }
+                finally { if (e_1) throw e_1.error; }
+            }
+        };
+        return QMSTableExpandDirective;
+    }());
+    QMSTableExpandDirective.decorators = [
+        { type: i0.Directive, args: [{
+                    selector: '[qms-table-expand]',
+                    host: { 'class': 'qms-table-expand' }
+                },] }
+    ];
+    QMSTableExpandDirective.ctorParameters = function () { return [
+        { type: i0.ElementRef },
+        { type: i0.Renderer2 }
+    ]; };
+    var QMSTableDirective = /** @class */ (function () {
+        function QMSTableDirective(_el, renderer) {
+            this._el = _el;
+            this.renderer = renderer;
+        }
+        QMSTableDirective.prototype.ngAfterViewChecked = function () {
+            var e_2, _c;
+            var matRows = this._el.nativeElement.querySelectorAll('mat-row');
+            try {
+                for (var _d = __values(Object.entries(matRows)), _e = _d.next(); !_e.done; _e = _d.next()) {
+                    var _f = __read(_e.value, 2), key = _f[0], value = _f[1];
+                    this.renderer.addClass(value, 'qms-row');
+                }
+            }
+            catch (e_2_1) { e_2 = { error: e_2_1 }; }
+            finally {
+                try {
+                    if (_e && !_e.done && (_c = _d.return)) _c.call(_d);
+                }
+                finally { if (e_2) throw e_2.error; }
+            }
+        };
+        return QMSTableDirective;
+    }());
+    QMSTableDirective.decorators = [
+        { type: i0.Directive, args: [{
+                    selector: '[qms-table]',
+                    host: { 'class': 'qms-table' }
+                },] }
+    ];
+    QMSTableDirective.ctorParameters = function () { return [
+        { type: i0.ElementRef },
+        { type: i0.Renderer2 }
+    ]; };
+    var QMSTableChildrenDirective = /** @class */ (function () {
+        function QMSTableChildrenDirective(_el, renderer) {
+            this._el = _el;
+            this.renderer = renderer;
+        }
+        QMSTableChildrenDirective.prototype.ngAfterViewChecked = function () {
+            var e_3, _c;
+            var matRows = this._el.nativeElement.querySelectorAll('mat-row');
+            try {
+                for (var _d = __values(Object.entries(matRows)), _e = _d.next(); !_e.done; _e = _d.next()) {
+                    var _f = __read(_e.value, 2), key = _f[0], value = _f[1];
+                    this.renderer.addClass(value, 'qms-row-children');
+                    this.renderer.addClass(value, 'qms-row-group');
+                }
+            }
+            catch (e_3_1) { e_3 = { error: e_3_1 }; }
+            finally {
+                try {
+                    if (_e && !_e.done && (_c = _d.return)) _c.call(_d);
+                }
+                finally { if (e_3) throw e_3.error; }
+            }
+        };
+        return QMSTableChildrenDirective;
+    }());
+    QMSTableChildrenDirective.decorators = [
+        { type: i0.Directive, args: [{
+                    selector: '[qms-table-children]',
+                    host: { 'class': 'qms-table-children' }
+                },] }
+    ];
+    QMSTableChildrenDirective.ctorParameters = function () { return [
+        { type: i0.ElementRef },
+        { type: i0.Renderer2 }
+    ]; };
+    var QMSRowExpandDirective = /** @class */ (function () {
+        function QMSRowExpandDirective() {
+        }
+        return QMSRowExpandDirective;
+    }());
+    QMSRowExpandDirective.decorators = [
+        { type: i0.Directive, args: [{
+                    selector: '[qms-row-expand]',
+                    host: { 'class': 'qms-row-expand' }
+                },] }
+    ];
+    QMSRowExpandDirective.ctorParameters = function () { return []; };
+    var QMSRowDetailDirective = /** @class */ (function () {
+        function QMSRowDetailDirective() {
+        }
+        return QMSRowDetailDirective;
+    }());
+    QMSRowDetailDirective.decorators = [
+        { type: i0.Directive, args: [{
+                    selector: '[qms-row-detail]',
+                    host: { 'class': 'qms-row-detail' }
+                },] }
+    ];
+    QMSRowDetailDirective.ctorParameters = function () { return []; };
+    var QMSCollapseGroupDirective = /** @class */ (function () {
+        function QMSCollapseGroupDirective() {
+        }
+        return QMSCollapseGroupDirective;
+    }());
+    QMSCollapseGroupDirective.decorators = [
+        { type: i0.Directive, args: [{
+                    selector: '[qms-collapse-group]',
+                    host: { 'class': 'qms-collapse-group' }
+                },] }
+    ];
+    QMSCollapseGroupDirective.ctorParameters = function () { return []; };
+    var CdkDetailRowDirective = /** @class */ (function () {
+        function CdkDetailRowDirective(vcRef, _el) {
+            this.vcRef = vcRef;
+            this._el = _el;
+            this.focusClass = 'focus-grid-style';
+            this.onRowExpandEvent = new i0.EventEmitter();
+        }
+        Object.defineProperty(CdkDetailRowDirective.prototype, "expended", {
+            get: function () {
+                return this.opened;
+            },
+            enumerable: false,
+            configurable: true
+        });
+        Object.defineProperty(CdkDetailRowDirective.prototype, "cdkDetailRow", {
+            set: function (value) {
+                if (value !== this.row) {
+                    this.row = value;
+                }
+            },
+            enumerable: false,
+            configurable: true
+        });
+        Object.defineProperty(CdkDetailRowDirective.prototype, "template", {
+            set: function (value) {
+                if (value !== this.tRef) {
+                    this.tRef = value;
+                }
+            },
+            enumerable: false,
+            configurable: true
+        });
+        Object.defineProperty(CdkDetailRowDirective.prototype, "otherTemplate", {
+            set: function (value) {
+                if (value !== this.othertRef) {
+                    this.othertRef = value;
+                }
+            },
+            enumerable: false,
+            configurable: true
+        });
+        CdkDetailRowDirective.prototype.ngOnChanges = function (changes) {
+            this.vcRef.clear();
+            if (this.othertRef && this.row) {
+                this.vcRef.createEmbeddedView(this.othertRef, { $implicit: this.row });
+            }
+        };
+        CdkDetailRowDirective.prototype.ngOnInit = function () {
+            var _a, _b;
+            this.vcRef.clear();
+            if (this.othertRef && this.row) {
+                this.vcRef.createEmbeddedView(this.othertRef, { $implicit: this.row });
+                if (((_a = this.row) === null || _a === void 0 ? void 0 : _a.children) && ((_b = this.row) === null || _b === void 0 ? void 0 : _b.children.length) > 0) {
+                    this._el.nativeElement.classList.add('qms-row-group');
+                }
+            }
+        };
+        CdkDetailRowDirective.prototype.onClick = function () {
+            this.toggle();
+        };
+        CdkDetailRowDirective.prototype.onClickItem = function (event) {
+            if (event && event.parentNode && event.parentNode.classList && !event.parentNode.classList.contains(this.focusClass)) {
+                var elements = document.getElementsByClassName(this.focusClass);
+                while (elements.length > 0) {
+                    elements[0].classList.remove(this.focusClass);
+                }
+            }
+        };
+        CdkDetailRowDirective.prototype.onKeydown = function (event) {
+            var elements = document.getElementsByClassName(this.focusClass);
+            if (event && elements && elements.length > 0) {
+                //To do
+            }
+        };
+        CdkDetailRowDirective.prototype.toggle = function () {
+            if (this.opened) {
+                this.vcRef.clear();
+                if (this.othertRef) {
+                    this.vcRef.createEmbeddedView(this.othertRef, { $implicit: this.row });
+                }
+            }
+            else {
+                this.render();
+            }
+            this.opened = !this.opened;
+            this.onRowExpandEvent.emit(this.opened);
+        };
+        CdkDetailRowDirective.prototype.render = function () {
+            this.vcRef.clear();
+            if (this.tRef && this.row) {
+                this.vcRef.createEmbeddedView(this.tRef, { $implicit: this.row });
+                if (this.othertRef) {
+                    this.vcRef.createEmbeddedView(this.othertRef, { $implicit: this.row });
+                }
+            }
+        };
+        return CdkDetailRowDirective;
+    }());
+    CdkDetailRowDirective.decorators = [
+        { type: i0.Directive, args: [{
+                    selector: '[cdkDetailRow]'
+                },] }
+    ];
+    CdkDetailRowDirective.ctorParameters = function () { return [
+        { type: i0.ViewContainerRef },
+        { type: i0.ElementRef }
+    ]; };
+    CdkDetailRowDirective.propDecorators = {
+        onRowExpandEvent: [{ type: i0.Output }],
+        expended: [{ type: i0.HostBinding, args: ['class.expanded',] }],
+        cdkDetailRow: [{ type: i0.Input }],
+        template: [{ type: i0.Input, args: ['cdkDetailRowTpl',] }],
+        otherTemplate: [{ type: i0.Input, args: ['cdkotherTemplate',] }],
+        onClick: [{ type: i0.HostListener, args: ['click',] }],
+        onClickItem: [{ type: i0.HostListener, args: ['document:click', ['$event.target'],] }],
+        onKeydown: [{ type: i0.HostListener, args: ['document:keydown', ['$event.target'],] }]
+    };
+
     var ɵ0$2 = { appearance: 'fill' }, ɵ1 = { color: 'none' };
     var QmsAngularModule = /** @class */ (function () {
         function QmsAngularModule() {
@@ -3275,7 +3474,6 @@
         { type: i0.NgModule, args: [{
                     declarations: [
                         QmsAngularComponent,
-                        TestOnlyComponent,
                         MarginDirective,
                         QMSSearchFieldDirective,
                         QMSInputClearDirective,
@@ -3311,9 +3509,13 @@
                         QMSDrawerContentDirective,
                         QMSDrawerHeaderActionDirective,
                         QMSToolTipRendererDirective,
-                        QMSTabLabelDirective,
-                        QMSTabGroupDirective,
-                        QMSTabGroupAdvancedDirective,
+                        QMSTableExpandDirective,
+                        QMSTableDirective,
+                        QMSRowDetailDirective,
+                        QMSTableChildrenDirective,
+                        QMSRowExpandDirective,
+                        CdkDetailRowDirective,
+                        QMSCollapseGroupDirective,
                         DateFormatPipe,
                         QMSChipInputDirective,
                         QMSChipInputSelectFieldDirective,
@@ -3322,7 +3524,8 @@
                         QMSChipInputChipListDirective,
                         ScrollToSelectedDirective,
                         QMSTooltipImageDirective,
-                        SelectDialog
+                        SelectDialog,
+                        QMSAppBar
                     ],
                     imports: [
                         common.CommonModule,
@@ -3334,7 +3537,6 @@
                     exports: [
                         QmsAngularComponent,
                         MarginDirective,
-                        TestOnlyComponent,
                         QMSSearchFieldDirective,
                         QMSInputClearDirective,
                         QMSFormFieldDirective,
@@ -3368,9 +3570,6 @@
                         QMSDrawerContentDirective,
                         QMSDrawerHeaderActionDirective,
                         QMSToolTipRendererDirective,
-                        QMSTabLabelDirective,
-                        QMSTabGroupDirective,
-                        QMSTabGroupAdvancedDirective,
                         DateFormatPipe,
                         QMSChipInputDirective,
                         QMSChipInputSelectFieldDirective,
@@ -3379,7 +3578,15 @@
                         QMSChipInputChipListDirective,
                         ScrollToSelectedDirective,
                         QMSTooltipImageDirective,
-                        SelectDialog
+                        SelectDialog,
+                        QMSAppBar,
+                        QMSTableExpandDirective,
+                        QMSTableDirective,
+                        QMSTableChildrenDirective,
+                        QMSRowDetailDirective,
+                        QMSRowExpandDirective,
+                        CdkDetailRowDirective,
+                        QMSCollapseGroupDirective
                     ],
                     providers: [
                         { provide: formField.MAT_FORM_FIELD_DEFAULT_OPTIONS, useValue: ɵ0$2 },
@@ -4315,14 +4522,14 @@
         DocumentNodeType[DocumentNodeType["RegionalFolder"] = 8] = "RegionalFolder";
     })(DocumentNodeType$1 || (DocumentNodeType$1 = {}));
 
-    var RelatedConst = /** @class */ (function () {
+    var RelatedConst$1 = /** @class */ (function () {
         function RelatedConst() {
         }
         return RelatedConst;
     }());
-    RelatedConst.IS_DISPLAY_SEARCH_RESULT = 'IS_DISPLAY_SEARCH_RESULT';
-    RelatedConst.HIDE_SEARCH_RESULT = 'HIDE_SEARCH_RESULT';
-    RelatedConst.SHOW_SEARCH_RESULT = 'SHOW_SEARCH_RESULT';
+    RelatedConst$1.IS_DISPLAY_SEARCH_RESULT = 'IS_DISPLAY_SEARCH_RESULT';
+    RelatedConst$1.HIDE_SEARCH_RESULT = 'HIDE_SEARCH_RESULT';
+    RelatedConst$1.SHOW_SEARCH_RESULT = 'SHOW_SEARCH_RESULT';
 
     var TreeNode$1 = /** @class */ (function () {
         function TreeNode() {
@@ -4330,14 +4537,14 @@
         return TreeNode;
     }());
 
-    var objData$1 = {};
-    var json = JSON;
-    function buildArrayTree$1(obj, level) {
+    var objData$2 = {};
+    var json$1 = JSON;
+    function buildArrayTree$2(obj, level) {
         var _this = this;
         return Object.keys(obj).reduce(function (accumulator, key) {
             var value = obj[key];
             var node = new TreeNode$1();
-            var keyObj = json.parse(key);
+            var keyObj = json$1.parse(key);
             node.id = keyObj["id"];
             node.name = keyObj["name"];
             node.parentId = keyObj["parentId"];
@@ -4353,9 +4560,9 @@
             return accumulator.concat(node);
         }, []);
     }
-    function buildObjectTree$1(arr) {
+    function buildObjectTree$2(arr) {
         var _this = this;
-        objData$1 = {};
+        objData$2 = {};
         var objTreeData;
         var root = arr.filter(function (x) {
             return x.parentId === '';
@@ -4365,7 +4572,7 @@
         });
         return objTreeData;
     }
-    function findParent$1(id, array) {
+    function findParent$2(id, array) {
         var objParent = {};
         var parent = array.filter(function (x) {
             return x.rootId === id;
@@ -4377,7 +4584,7 @@
                 parentId: item.rootId,
                 levelType: item.levelType
             };
-            objParent[json.stringify(parentKey)] = null;
+            objParent[json$1.stringify(parentKey)] = null;
         });
         // find child
         var child = array.filter(function (x) {
@@ -4393,10 +4600,10 @@
             levelType: parent[0].levelType
         };
         // add node to tree
-        objData$1[json.stringify(key)] = objParent;
-        return objData$1;
+        objData$2[json$1.stringify(key)] = objParent;
+        return objData$2;
     }
-    function findChild$1(id, objParent, array) {
+    function findChild$2(id, objParent, array) {
         var _this = this;
         var subNode = array.filter(function (x) {
             return x.parentId === id;
@@ -4409,7 +4616,7 @@
                 parentId: item.rootId,
                 levelType: item.levelType
             };
-            processNode[json.stringify(nodeKey)] = null;
+            processNode[json$1.stringify(nodeKey)] = null;
             _this.findChild(item.rootId, processNode, array);
             var key = {
                 id: item.rootId,
@@ -4417,14 +4624,14 @@
                 parentId: id,
                 levelType: item.levelType
             };
-            objParent[json.stringify(key)] = Object.assign(Object.assign({}, objParent[json.stringify(key)]), processNode);
+            objParent[json$1.stringify(key)] = Object.assign(Object.assign({}, objParent[json$1.stringify(key)]), processNode);
         });
     }
-    var TreeFunctions = {
-        buildArrayTree: buildArrayTree$1,
-        buildObjectTree: buildObjectTree$1,
-        findParent: findParent$1,
-        findChild: findChild$1
+    var TreeFunctions$1 = {
+        buildArrayTree: buildArrayTree$2,
+        buildObjectTree: buildObjectTree$2,
+        findParent: findParent$2,
+        findChild: findChild$2
     };
 
     var TreeFlatNode = /** @class */ (function () {
@@ -4574,8 +4781,8 @@
                 }
             });
             this.filterData = this.treeData;
-            this.treeObject = TreeFunctions.buildObjectTree(this.filterData);
-            this.dataSource.data = TreeFunctions.buildArrayTree(this.treeObject || {}, 0).map(function (element) {
+            this.treeObject = TreeFunctions$1.buildObjectTree(this.filterData);
+            this.dataSource.data = TreeFunctions$1.buildArrayTree(this.treeObject || {}, 0).map(function (element) {
                 var item = _this.sortDataTree(element);
                 element = null;
                 element = Object.assign({}, item);
@@ -4694,6 +4901,9 @@
         TreeComponent.prototype.checkDisabledList = function () {
             var _this = this;
             // Disable List
+            for (var i = 0; i < this.treeControl.dataNodes.length; i++) {
+                this.treeControl.dataNodes[i].disabled = false;
+            }
             if (this.disabledList.length) {
                 var _loop_3 = function (i) {
                     this_3.disabledList.forEach(function (x) {
@@ -4958,8 +5168,8 @@
             this.checkBoxEvent.emit(this.checklistSelection.selected);
         };
         TreeComponent.prototype.selectNode = function (node) {
-            if (window[RelatedConst.IS_DISPLAY_SEARCH_RESULT]) {
-                window.postMessage(RelatedConst.HIDE_SEARCH_RESULT, '*');
+            if (window[RelatedConst$1.IS_DISPLAY_SEARCH_RESULT]) {
+                window.postMessage(RelatedConst$1.HIDE_SEARCH_RESULT, '*');
             }
             if (this.treeConfig.selectOne) {
                 node.itemType = this.checkDataTypeSelectNode(node);
@@ -4998,8 +5208,8 @@
                 this.selectNodeEvent.emit(node);
                 return;
             }
-            if (window[RelatedConst.IS_DISPLAY_SEARCH_RESULT]) {
-                window.postMessage(RelatedConst.HIDE_SEARCH_RESULT, '*');
+            if (window[RelatedConst$1.IS_DISPLAY_SEARCH_RESULT]) {
+                window.postMessage(RelatedConst$1.HIDE_SEARCH_RESULT, '*');
             }
             // set useExpandFeature = true to improve performance of tree loading
             if (!isExpandNode || !this.useExpandFeature) {
@@ -5230,9 +5440,9 @@
     TreeComponent.decorators = [
         { type: i0.Component, args: [{
                     selector: 'qms-tree',
-                    template: "<mat-tree\r\n  [dataSource]=\"dataSource\"\r\n  [treeControl]=\"treeControl\"\r\n  class=\"tree__container\"\r\n>\r\n  <mat-tree-node\r\n    class=\"tree-branch\"\r\n    *matTreeNodeDef=\"let node\"\r\n    matTreeNodeToggle\r\n    matTreeNodePadding\r\n  >\r\n    <!-- form thu 1 - child -->\r\n    <mat-checkbox\r\n      qms-group-options\r\n      [disabled]=\"node.disabled\"\r\n      color=\"default\"\r\n      *ngIf=\"node.name && showCheckBox && !onlyCheckBoxForChild && !onlyFolder\"\r\n      class=\"checklist-leaf-node\"\r\n      [checked]=\"checklistSelection.isSelected(node)\"\r\n      (change)=\"todoItemSelectionToggle(node)\"\r\n    >\r\n    </mat-checkbox>\r\n\r\n    <!-- form thu 2 -->\r\n    <mat-checkbox\r\n      qms-group-options\r\n      [disabled]=\"node.disabled\"\r\n      color=\"default\"\r\n      *ngIf=\"node.name && showCheckBox && onlyCheckBoxForChild && !onlyFolder\"\r\n      class=\"ml-10 checklist-leaf-node\"\r\n      [checked]=\"checklistSelection.isSelected(node)\"\r\n      (change)=\"todoItemSelectionToggle(node)\"\r\n    ></mat-checkbox>\r\n    <div\r\n      class=\"expand-node\"\r\n      *ngIf=\"node.name && !onlyFolder\"\r\n      [class.bgSelected]=\"\r\n        treeConfig.selectOne &&\r\n        idCheckIcon == idToCheckSelectOne(node.id, node.parentId)\r\n      \"\r\n      (click)=\"selectNode(node)\"\r\n      [id]=\"getNodeId(node)\"\r\n    >\r\n      <div class=\"expand-node__text\">\r\n        <mat-icon\r\n          *ngIf=\"displayType === itemIconType.name && !onlyCheckBoxForChild\"\r\n          class=\"mat-icon-rtl-mirror material-icons-outlined\"\r\n        >\r\n          {{ itemIcon }}\r\n        </mat-icon>\r\n\r\n        <mat-icon\r\n          *ngIf=\"displayType === itemIconType.svg && !onlyCheckBoxForChild\"\r\n          class=\"mat-icon-rtl-mirror material-icons-outlined\"\r\n          [svgIcon]=\"itemIconSvg\"\r\n        >\r\n        </mat-icon>\r\n\r\n        <img\r\n          *ngIf=\"displayType === itemIconType.path && !onlyCheckBoxForChild\"\r\n          class=\"mat-icon\"\r\n          [src]=\"itemIconPath\"\r\n        />\r\n\r\n        <img\r\n          *ngIf=\"displayType === itemIconType.base64 && !onlyCheckBoxForChild\"\r\n          class=\"mat-icon image-base64\"\r\n          [src]=\"getImagePath()\"\r\n        />\r\n\r\n        <mat-icon\r\n          *ngIf=\"displayType === itemIconType.none && !onlyCheckBoxForChild\"\r\n          class=\"mat-icon-rtl-mirror material-icons-outlined\"\r\n          [svgIcon]=\"getItemIcon(node)\"\r\n        ></mat-icon>\r\n        <span\r\n          class=\"text-node\"\r\n          [class.select-one-checked]=\"\r\n            treeConfig.selectOne &&\r\n            idCheckIcon == idToCheckSelectOne(node.id, node.parentId)\r\n          \"\r\n          >{{ node.name }}</span\r\n        >\r\n      </div>\r\n      <mat-icon\r\n        class=\"select-one-checked\"\r\n        *ngIf=\"\r\n          treeConfig.selectOne &&\r\n          idCheckIcon == idToCheckSelectOne(node.id, node.parentId)\r\n        \"\r\n        >done</mat-icon\r\n      >\r\n    </div>\r\n  </mat-tree-node>\r\n\r\n  <mat-tree-node *matTreeNodeDef=\"let node; when: hasChild\" matTreeNodePadding>\r\n    <!-- form thu 1 - parent -->\r\n    <mat-checkbox\r\n      qms-group-options\r\n      [disabled]=\"node.disabled\"\r\n      color=\"default\"\r\n      *ngIf=\"node.name && showCheckBox && !onlyCheckBoxForChild\"\r\n      [checked]=\"descendantsAllSelected(node)\"\r\n      [indeterminate]=\"descendantsPartiallySelected(node)\"\r\n      (change)=\"todoItemSelectionToggle(node)\"\r\n    ></mat-checkbox>\r\n    <button\r\n      class=\"button-boder\"\r\n      mat-icon-button\r\n      matTreeNodeToggle\r\n      [disableRipple]=\"!node.hasChild\"\r\n      [attr.aria-label]=\"'toggle ' + node.filename\"\r\n      *ngIf=\"node.name\"\r\n    >\r\n      <mat-icon\r\n        *ngIf=\"openIcon && closeIcon\"\r\n        class=\"mat-icon-rtl-mirror\"\r\n        [ngStyle]=\"{\r\n          color: treeControl.isExpanded(node) ? openIconColor : closeIconColor\r\n        }\"\r\n        >{{ getNodeIcon(node) }}</mat-icon\r\n      >\r\n      <mat-icon\r\n        *ngIf=\"!openIcon || !closeIcon\"\r\n        class=\"mat-icon-rtl-mirror\"\r\n        [ngClass]=\"{\r\n          'open-icon': treeControl.isExpanded(node),\r\n          'not-department-icon': moduleId !== dataType.document\r\n        }\"\r\n        [svgIcon]=\"getNodeIcon(node)\"\r\n      >\r\n      </mat-icon>\r\n    </button>\r\n    <span\r\n      *ngIf=\"expandOnTitleClick\"\r\n      matTreeNodeToggle\r\n      class=\"text-node-parent\"\r\n      style=\"cursor: pointer\"\r\n      (click)=\"onExpandNode(node)\"\r\n      [ngStyle]=\"{\r\n        color: treeControl.isExpanded(node) ? openIconColor : '#000000'\r\n      }\"\r\n    >\r\n      <span>{{ node.name }}</span>\r\n    </span>\r\n    <span\r\n      *ngIf=\"!expandOnTitleClick\"\r\n      class=\"text-node-parent\"\r\n      (click)=\"selectFolderNode(node)\"\r\n      style=\"cursor: pointer\"\r\n      [id]=\"getNodeId(node)\"\r\n    >\r\n      <span\r\n        [class.select-one-checked]=\"\r\n          treeConfig.selectOne &&\r\n          idCheckIcon == idToCheckSelectOne(node.id, node.parentId)\r\n        \"\r\n        >{{ node.name }}</span\r\n      >\r\n      <mat-icon\r\n        class=\"select-one-checked\"\r\n        *ngIf=\"\r\n          treeConfig.selectOne &&\r\n          idCheckIcon == idToCheckSelectOne(node.id, node.parentId)\r\n        \"\r\n        >done</mat-icon\r\n      >\r\n    </span>\r\n  </mat-tree-node>\r\n</mat-tree>\r\n",
+                    template: "<mat-tree\r\n  [dataSource]=\"dataSource\"\r\n  [treeControl]=\"treeControl\"\r\n  class=\"tree__container\"\r\n>\r\n  <mat-tree-node\r\n    class=\"tree-branch\"\r\n    *matTreeNodeDef=\"let node\"\r\n    matTreeNodeToggle\r\n    matTreeNodePadding\r\n  >\r\n    <!-- form thu 1 - child -->\r\n    <mat-checkbox\r\n      qms-group-options\r\n      [disabled]=\"node.disabled\"\r\n      color=\"default\"\r\n      *ngIf=\"node.name && showCheckBox && !onlyCheckBoxForChild && !onlyFolder\"\r\n      class=\"checklist-leaf-node\"\r\n      [checked]=\"checklistSelection.isSelected(node)\"\r\n      (change)=\"todoItemSelectionToggle(node)\"\r\n    >\r\n    </mat-checkbox>\r\n\r\n    <!-- form thu 2 -->\r\n    <mat-checkbox\r\n      qms-group-options\r\n      [disabled]=\"node.disabled\"\r\n      color=\"default\"\r\n      *ngIf=\"node.name && showCheckBox && onlyCheckBoxForChild && !onlyFolder\"\r\n      class=\"ml-10 checklist-leaf-node\"\r\n      [checked]=\"checklistSelection.isSelected(node)\"\r\n      (change)=\"todoItemSelectionToggle(node)\"\r\n    ></mat-checkbox>\r\n    <div\r\n      class=\"expand-node\"\r\n      *ngIf=\"node.name && !onlyFolder\"\r\n      [class.bgSelected]=\"\r\n        treeConfig.selectOne &&\r\n        idCheckIcon == idToCheckSelectOne(node.id, node.parentId)\r\n      \"\r\n      (click)=\"selectNode(node)\"\r\n      [id]=\"getNodeId(node)\"\r\n    >\r\n      <div class=\"expand-node__text\">\r\n        <mat-icon\r\n          *ngIf=\"displayType === itemIconType.name && !onlyCheckBoxForChild\"\r\n          class=\"mat-icon-rtl-mirror material-icons-outlined\"\r\n        >\r\n          {{ itemIcon }}\r\n        </mat-icon>\r\n\r\n        <mat-icon\r\n          *ngIf=\"displayType === itemIconType.svg\"\r\n          class=\"mat-icon-rtl-mirror material-icons-outlined\"\r\n          [svgIcon]=\"itemIconSvg\"\r\n        >\r\n        </mat-icon>\r\n\r\n        <img\r\n          *ngIf=\"displayType === itemIconType.path\"\r\n          class=\"mat-icon\"\r\n          [src]=\"itemIconPath\"\r\n        />\r\n\r\n        <img\r\n          *ngIf=\"displayType === itemIconType.base64\"\r\n          class=\"mat-icon image-base64\"\r\n          [src]=\"getImagePath()\"\r\n        />\r\n\r\n        <mat-icon\r\n          *ngIf=\"displayType === itemIconType.none\"\r\n          class=\"mat-icon-rtl-mirror material-icons-outlined\"\r\n          [svgIcon]=\"getItemIcon(node)\"\r\n        ></mat-icon>\r\n        <span\r\n          class=\"text-node\"\r\n          [class.select-one-checked]=\"\r\n            treeConfig.selectOne &&\r\n            idCheckIcon == idToCheckSelectOne(node.id, node.parentId)\r\n          \"\r\n          >{{ node.name }}</span\r\n        >\r\n      </div>\r\n      <mat-icon\r\n        class=\"select-one-checked\"\r\n        *ngIf=\"\r\n          treeConfig.selectOne &&\r\n          idCheckIcon == idToCheckSelectOne(node.id, node.parentId)\r\n        \"\r\n        >done</mat-icon\r\n      >\r\n    </div>\r\n  </mat-tree-node>\r\n\r\n  <mat-tree-node *matTreeNodeDef=\"let node; when: hasChild\" matTreeNodePadding>\r\n    <!-- form thu 1 - parent -->\r\n    <mat-checkbox\r\n      qms-group-options\r\n      [disabled]=\"node.disabled\"\r\n      color=\"default\"\r\n      *ngIf=\"node.name && showCheckBox && !onlyCheckBoxForChild\"\r\n      [checked]=\"descendantsAllSelected(node)\"\r\n      [indeterminate]=\"descendantsPartiallySelected(node)\"\r\n      (change)=\"todoItemSelectionToggle(node)\"\r\n    ></mat-checkbox>\r\n    <button\r\n      class=\"button-boder\"\r\n      mat-icon-button\r\n      matTreeNodeToggle\r\n      [disableRipple]=\"!node.hasChild\"\r\n      [attr.aria-label]=\"'toggle ' + node.filename\"\r\n      *ngIf=\"node.name\"\r\n    >\r\n      <mat-icon\r\n        *ngIf=\"openIcon && closeIcon\"\r\n        class=\"mat-icon-rtl-mirror\"\r\n        [ngStyle]=\"{\r\n          color: treeControl.isExpanded(node) ? openIconColor : closeIconColor\r\n        }\"\r\n        >{{ getNodeIcon(node) }}</mat-icon\r\n      >\r\n      <mat-icon\r\n        *ngIf=\"!openIcon || !closeIcon\"\r\n        class=\"mat-icon-rtl-mirror\"\r\n        [ngClass]=\"{\r\n          'open-icon': treeControl.isExpanded(node),\r\n          'not-department-icon': moduleId !== dataType.document\r\n        }\"\r\n        [svgIcon]=\"getNodeIcon(node)\"\r\n      >\r\n      </mat-icon>\r\n    </button>\r\n    <span\r\n      *ngIf=\"expandOnTitleClick\"\r\n      matTreeNodeToggle\r\n      class=\"text-node-parent\"\r\n      style=\"cursor: pointer\"\r\n      (click)=\"onExpandNode(node)\"\r\n      [ngStyle]=\"{\r\n        color: treeControl.isExpanded(node) ? openIconColor : '#000000'\r\n      }\"\r\n    >\r\n      <span>{{ node.name }}</span>\r\n    </span>\r\n    <span\r\n      *ngIf=\"!expandOnTitleClick\"\r\n      class=\"text-node-parent\"\r\n      (click)=\"selectFolderNode(node)\"\r\n      style=\"cursor: pointer\"\r\n      [id]=\"getNodeId(node)\"\r\n    >\r\n      <span\r\n        [class.select-one-checked]=\"\r\n          treeConfig.selectOne &&\r\n          idCheckIcon == idToCheckSelectOne(node.id, node.parentId)\r\n        \"\r\n        >{{ node.name }}</span\r\n      >\r\n      <mat-icon\r\n        class=\"select-one-checked\"\r\n        *ngIf=\"\r\n          treeConfig.selectOne &&\r\n          idCheckIcon == idToCheckSelectOne(node.id, node.parentId)\r\n        \"\r\n        >done</mat-icon\r\n      >\r\n    </span>\r\n  </mat-tree-node>\r\n</mat-tree>\r\n",
                     encapsulation: i0.ViewEncapsulation.None,
-                    styles: ["@font-face{font-family:Open Sans;font-style:normal;font-weight:400;font-display:swap;src:url(https://fonts.gstatic.com/s/opensans/v20/mem8YaGs126MiZpBA-UFWJ0bbck.woff2) format(\"woff2\");unicode-range:U+0460-052f,U+1c80-1c88,U+20b4,U+2de0-2dff,U+a640-a69f,U+fe2e-fe2f}@font-face{font-family:Open Sans;font-style:normal;font-weight:400;font-display:swap;src:url(https://fonts.gstatic.com/s/opensans/v20/mem8YaGs126MiZpBA-UFUZ0bbck.woff2) format(\"woff2\");unicode-range:U+0400-045f,U+0490-0491,U+04b0-04b1,U+2116}@font-face{font-family:Open Sans;font-style:normal;font-weight:400;font-display:swap;src:url(https://fonts.gstatic.com/s/opensans/v20/mem8YaGs126MiZpBA-UFWZ0bbck.woff2) format(\"woff2\");unicode-range:U+1f??}@font-face{font-family:Open Sans;font-style:normal;font-weight:400;font-display:swap;src:url(https://fonts.gstatic.com/s/opensans/v20/mem8YaGs126MiZpBA-UFVp0bbck.woff2) format(\"woff2\");unicode-range:U+0370-03ff}@font-face{font-family:Open Sans;font-style:normal;font-weight:400;font-display:swap;src:url(https://fonts.gstatic.com/s/opensans/v20/mem8YaGs126MiZpBA-UFWp0bbck.woff2) format(\"woff2\");unicode-range:U+0102-0103,U+0110-0111,U+0128-0129,U+0168-0169,U+01a0-01a1,U+01af-01b0,U+1ea0-1ef9,U+20ab}@font-face{font-family:Open Sans;font-style:normal;font-weight:400;font-display:swap;src:url(https://fonts.gstatic.com/s/opensans/v20/mem8YaGs126MiZpBA-UFW50bbck.woff2) format(\"woff2\");unicode-range:U+0100-024f,U+0259,U+1e??,U+2020,U+20a0-20ab,U+20ad-20cf,U+2113,U+2c60-2c7f,U+a720-a7ff}@font-face{font-family:Open Sans;font-style:normal;font-weight:400;font-display:swap;src:url(https://fonts.gstatic.com/s/opensans/v20/mem8YaGs126MiZpBA-UFVZ0b.woff2) format(\"woff2\");unicode-range:U+00??,U+0131,U+0152-0153,U+02bb-02bc,U+02c6,U+02da,U+02dc,U+2000-206f,U+2074,U+20ac,U+2122,U+2191,U+2193,U+2212,U+2215,U+feff,U+fffd}@font-face{font-family:Raleway;font-style:normal;font-weight:400;font-display:swap;src:url(https://fonts.gstatic.com/s/raleway/v19/1Ptxg8zYS_SKggPN4iEgvnHyvveLxVvaorCFPrEHJA.woff2) format(\"woff2\");unicode-range:U+0460-052f,U+1c80-1c88,U+20b4,U+2de0-2dff,U+a640-a69f,U+fe2e-fe2f}@font-face{font-family:Raleway;font-style:normal;font-weight:400;font-display:swap;src:url(https://fonts.gstatic.com/s/raleway/v19/1Ptxg8zYS_SKggPN4iEgvnHyvveLxVvaorCMPrEHJA.woff2) format(\"woff2\");unicode-range:U+0400-045f,U+0490-0491,U+04b0-04b1,U+2116}@font-face{font-family:Raleway;font-style:normal;font-weight:400;font-display:swap;src:url(https://fonts.gstatic.com/s/raleway/v19/1Ptxg8zYS_SKggPN4iEgvnHyvveLxVvaorCHPrEHJA.woff2) format(\"woff2\");unicode-range:U+0102-0103,U+0110-0111,U+0128-0129,U+0168-0169,U+01a0-01a1,U+01af-01b0,U+1ea0-1ef9,U+20ab}@font-face{font-family:Raleway;font-style:normal;font-weight:400;font-display:swap;src:url(https://fonts.gstatic.com/s/raleway/v19/1Ptxg8zYS_SKggPN4iEgvnHyvveLxVvaorCGPrEHJA.woff2) format(\"woff2\");unicode-range:U+0100-024f,U+0259,U+1e??,U+2020,U+20a0-20ab,U+20ad-20cf,U+2113,U+2c60-2c7f,U+a720-a7ff}@font-face{font-family:Raleway;font-style:normal;font-weight:400;font-display:swap;src:url(https://fonts.gstatic.com/s/raleway/v19/1Ptxg8zYS_SKggPN4iEgvnHyvveLxVvaorCIPrE.woff2) format(\"woff2\");unicode-range:U+00??,U+0131,U+0152-0153,U+02bb-02bc,U+02c6,U+02da,U+02dc,U+2000-206f,U+2074,U+20ac,U+2122,U+2191,U+2193,U+2212,U+2215,U+feff,U+fffd}.tree__container{font-family:Open Sans;font-style:normal;font-weight:400;font-size:.875rem;line-height:19px;color:#323232}.tree__container .mat-tree-node{color:#000;min-height:0}.tree__container .mat-tree-node .mat-checkbox.qms-group-options{padding:0}.tree__container .mat-tree-node .mat-checkbox.qms-group-options .mat-checkbox-inner-container{margin-right:11px}.tree__container .button{margin-left:6px}.tree__container .button:focus,.tree__container .button:hover{background-color:#009ef2;border-radius:2px;width:auto}.tree__container .button-boder:focus,.tree__container .button:focus{outline:0}.tree__container .button-folder-boder:focus{outline:0}.tree__container .button-folder-boder:focus,.tree__container .button-folder-boder:hover{background-color:#009ef2;border-radius:2px;width:auto}.tree__container .expand-node{margin-left:8px;min-height:32px;justify-content:space-between;width:100%}.tree__container .expand-node,.tree__container .expand-node .expand-node__text{display:flex;align-items:center}.tree__container .expand-node .mat-icon{color:rgba(0,0,0,.6);margin-right:17px;min-width:-webkit-fit-content;min-width:-moz-fit-content;min-width:fit-content}.tree__container .expand-node .mat-icon svg{display:block;min-width:-webkit-fit-content;min-width:-moz-fit-content;min-width:fit-content}.tree__container .expand-node.bgSelected .select-one-checked{color:#1954a9}.tree__container .text-node-parent{width:100%;display:flex;align-items:center;justify-content:space-between;margin-left:10px;cursor:pointer}.tree__container .text-node-parent.active-item{color:#1954a9!important}.tree__container .text-node-parent .select-one-checked{color:#1954a9}.tree__container .mr-11{margin-right:11px}.tree__container .ml-10{margin-left:10px}.tree__container .tree-branch:hover{background-color:#e5eefb}.tree__container .image-base64{width:20px;height:20px}.tree__container .mat-checkbox.qms-group-options.mat-checkbox-checked{background:transparent!important}::ng-deep .mat-tree .mat-checkbox.qms-group-options{padding:0}::ng-deep .mat-tree .mat-checkbox.qms-group-options.mat-checkbox-checked{background-color:transparent}::ng-deep .mat-tree .mat-checkbox.qms-group-options .mat-checkbox-inner-container{margin-right:0}svg{display:block;min-width:-webkit-fit-content;min-width:-moz-fit-content;min-width:fit-content}.open-icon.not-department-icon svg path,.open-icon svg path:first-child{fill:#1954a9}"]
+                    styles: ["@font-face{font-family:Open Sans;font-style:normal;font-weight:400;font-display:swap;src:url(https://fonts.gstatic.com/s/opensans/v20/mem8YaGs126MiZpBA-UFWJ0bbck.woff2) format(\"woff2\");unicode-range:U+0460-052f,U+1c80-1c88,U+20b4,U+2de0-2dff,U+a640-a69f,U+fe2e-fe2f}@font-face{font-family:Open Sans;font-style:normal;font-weight:400;font-display:swap;src:url(https://fonts.gstatic.com/s/opensans/v20/mem8YaGs126MiZpBA-UFUZ0bbck.woff2) format(\"woff2\");unicode-range:U+0400-045f,U+0490-0491,U+04b0-04b1,U+2116}@font-face{font-family:Open Sans;font-style:normal;font-weight:400;font-display:swap;src:url(https://fonts.gstatic.com/s/opensans/v20/mem8YaGs126MiZpBA-UFWZ0bbck.woff2) format(\"woff2\");unicode-range:U+1f??}@font-face{font-family:Open Sans;font-style:normal;font-weight:400;font-display:swap;src:url(https://fonts.gstatic.com/s/opensans/v20/mem8YaGs126MiZpBA-UFVp0bbck.woff2) format(\"woff2\");unicode-range:U+0370-03ff}@font-face{font-family:Open Sans;font-style:normal;font-weight:400;font-display:swap;src:url(https://fonts.gstatic.com/s/opensans/v20/mem8YaGs126MiZpBA-UFWp0bbck.woff2) format(\"woff2\");unicode-range:U+0102-0103,U+0110-0111,U+0128-0129,U+0168-0169,U+01a0-01a1,U+01af-01b0,U+1ea0-1ef9,U+20ab}@font-face{font-family:Open Sans;font-style:normal;font-weight:400;font-display:swap;src:url(https://fonts.gstatic.com/s/opensans/v20/mem8YaGs126MiZpBA-UFW50bbck.woff2) format(\"woff2\");unicode-range:U+0100-024f,U+0259,U+1e??,U+2020,U+20a0-20ab,U+20ad-20cf,U+2113,U+2c60-2c7f,U+a720-a7ff}@font-face{font-family:Open Sans;font-style:normal;font-weight:400;font-display:swap;src:url(https://fonts.gstatic.com/s/opensans/v20/mem8YaGs126MiZpBA-UFVZ0b.woff2) format(\"woff2\");unicode-range:U+00??,U+0131,U+0152-0153,U+02bb-02bc,U+02c6,U+02da,U+02dc,U+2000-206f,U+2074,U+20ac,U+2122,U+2191,U+2193,U+2212,U+2215,U+feff,U+fffd}@font-face{font-family:Raleway;font-style:normal;font-weight:400;font-display:swap;src:url(https://fonts.gstatic.com/s/raleway/v19/1Ptxg8zYS_SKggPN4iEgvnHyvveLxVvaorCFPrEHJA.woff2) format(\"woff2\");unicode-range:U+0460-052f,U+1c80-1c88,U+20b4,U+2de0-2dff,U+a640-a69f,U+fe2e-fe2f}@font-face{font-family:Raleway;font-style:normal;font-weight:400;font-display:swap;src:url(https://fonts.gstatic.com/s/raleway/v19/1Ptxg8zYS_SKggPN4iEgvnHyvveLxVvaorCMPrEHJA.woff2) format(\"woff2\");unicode-range:U+0400-045f,U+0490-0491,U+04b0-04b1,U+2116}@font-face{font-family:Raleway;font-style:normal;font-weight:400;font-display:swap;src:url(https://fonts.gstatic.com/s/raleway/v19/1Ptxg8zYS_SKggPN4iEgvnHyvveLxVvaorCHPrEHJA.woff2) format(\"woff2\");unicode-range:U+0102-0103,U+0110-0111,U+0128-0129,U+0168-0169,U+01a0-01a1,U+01af-01b0,U+1ea0-1ef9,U+20ab}@font-face{font-family:Raleway;font-style:normal;font-weight:400;font-display:swap;src:url(https://fonts.gstatic.com/s/raleway/v19/1Ptxg8zYS_SKggPN4iEgvnHyvveLxVvaorCGPrEHJA.woff2) format(\"woff2\");unicode-range:U+0100-024f,U+0259,U+1e??,U+2020,U+20a0-20ab,U+20ad-20cf,U+2113,U+2c60-2c7f,U+a720-a7ff}@font-face{font-family:Raleway;font-style:normal;font-weight:400;font-display:swap;src:url(https://fonts.gstatic.com/s/raleway/v19/1Ptxg8zYS_SKggPN4iEgvnHyvveLxVvaorCIPrE.woff2) format(\"woff2\");unicode-range:U+00??,U+0131,U+0152-0153,U+02bb-02bc,U+02c6,U+02da,U+02dc,U+2000-206f,U+2074,U+20ac,U+2122,U+2191,U+2193,U+2212,U+2215,U+feff,U+fffd}.tree__container{font-family:Open Sans;font-style:normal;font-weight:400;font-size:.875rem;line-height:19px;color:#323232}.tree__container .mat-tree-node{color:#000;min-height:0}.tree__container .mat-tree-node .mat-checkbox.qms-group-options{padding:0}.tree__container .mat-tree-node .mat-checkbox.qms-group-options .mat-checkbox-inner-container{margin-right:11px}.tree__container .button{margin-left:6px}.tree__container .button:focus,.tree__container .button:hover{background-color:#009ef2;border-radius:2px;width:auto}.tree__container .button-boder:focus,.tree__container .button:focus{outline:0}.tree__container .button-folder-boder:focus{outline:0}.tree__container .button-folder-boder:focus,.tree__container .button-folder-boder:hover{background-color:#009ef2;border-radius:2px;width:auto}.tree__container .expand-node{margin-left:8px;min-height:32px;justify-content:space-between;width:100%}.tree__container .expand-node,.tree__container .expand-node .expand-node__text{display:flex;align-items:center}.tree__container .expand-node .mat-icon{color:rgba(0,0,0,.6);margin-right:17px;min-width:-webkit-fit-content;min-width:-moz-fit-content;min-width:fit-content}.tree__container .expand-node .mat-icon svg{display:block;min-width:-webkit-fit-content;min-width:-moz-fit-content;min-width:fit-content}.tree__container .expand-node.bgSelected .select-one-checked{color:#1954a9}.tree__container .text-node-parent{width:100%;display:flex;align-items:center;justify-content:space-between;margin-left:10px;cursor:pointer}.tree__container .text-node-parent.active-item{color:#1954a9!important}.tree__container .text-node-parent .select-one-checked{color:#1954a9}.tree__container .mr-11{margin-right:11px}.tree__container .ml-10{margin-left:10px}.tree__container .tree-branch:hover{background-color:#e5eefb}.tree__container .image-base64{width:20px;height:20px}.tree__container .mat-checkbox.qms-group-options.mat-checkbox-checked{background:transparent!important}::ng-deep .mat-tree .mat-checkbox.qms-group-options{padding:0}::ng-deep .mat-tree .mat-checkbox.qms-group-options.mat-checkbox-checked{background-color:transparent}::ng-deep .mat-tree .mat-checkbox.qms-group-options .mat-checkbox-inner-container{margin-right:0}svg{display:block;min-width:-webkit-fit-content;min-width:-moz-fit-content;min-width:fit-content}.open-icon.not-department-icon svg path,.open-icon svg path:first-child{fill:#1954a9}.mat-checkbox.mat-checkbox-disabled.qms-group-options.mat-checkbox-checked .mat-checkbox-background{background-color:#e0e0e0!important}"]
                 },] }
     ];
     TreeComponent.ctorParameters = function () { return [
@@ -5620,7 +5830,7 @@
             this.globalService.setSplitviewValue([]);
         };
         RelatedPopupComponent.prototype.onMessage = function (event) {
-            if (event.data === RelatedConst.HIDE_SEARCH_RESULT) {
+            if (event.data === RelatedConst$1.HIDE_SEARCH_RESULT) {
                 // this.autoComplete.closePanel();
             }
         };
@@ -6697,7 +6907,7 @@
     RelatedPopupComponent.decorators = [
         { type: i0.Component, args: [{
                     selector: 'qms-related-popup',
-                    template: "<div id=\"qmslib_related_popup\" class=\"qmslib__related__popup__container\">\r\n  <div id=\"qmslib_related_popup_header\">\r\n    <span mat-icon-button class=\"button__close\" (click)=\"onCloseClick()\">\r\n      <mat-icon mat-icon>close</mat-icon>\r\n    </span>\r\n    <div id=\"qmslib_related_popup_header_001\" mat-dialog-content>\r\n      <span>{{ moduleName | uppercase }}</span>\r\n    </div>\r\n  </div>\r\n\r\n  <div id=\"qmslib_related_popup_search\" class=\"input__field\">\r\n    <input\r\n      type=\"text\"\r\n      placeholder=\"{{ LANG.SEARCH }}\"\r\n      matInput\r\n      [formControl]=\"myControl\"\r\n      [matAutocomplete]=\"auto\"\r\n    />\r\n    <mat-icon>search</mat-icon>\r\n  </div>\r\n\r\n  <div class=\"line__divider\"></div>\r\n\r\n  <mat-autocomplete\r\n    #auto=\"matAutocomplete\"\r\n    class=\"mat-autocomplete_related-viewport\"\r\n    (optionSelected)=\"selectRelated($event.option.value)\"\r\n    [displayWith]=\"displayWhenSelectRelatedOption\"\r\n  >\r\n    <cdk-virtual-scroll-viewport\r\n      qms-scrollbar\r\n      itemSize=\"10\"\r\n      [class.related-viewport]=\"isInputValue\"\r\n    >\r\n      <ng-container *ngFor=\"let type of searchOrder\">\r\n        <div\r\n          class=\"search__module-result\"\r\n          *ngIf=\"canShowSearchOption(type.value)\"\r\n        >\r\n          <span class=\"search__module-title\">{{ getTitle(type.value) }}</span>\r\n          <mat-option\r\n            class=\"search__option\"\r\n            *ngFor=\"let option of getModuleFilteredOptions(type.value)\"\r\n            [value]=\"option\"\r\n            [disabled]=\"option.disabled\"\r\n          >\r\n            <qms-list-item type=\"image-square\">\r\n              <mat-icon\r\n                leading-icon\r\n                type=\"image-square\"\r\n                [svgIcon]=\"getNodeIcon(option)\"\r\n              ></mat-icon>\r\n              <div qms-list-header>\r\n                <div\r\n                  qms-line\r\n                  type=\"caption\"\r\n                  qms-tool-tip=\"{{\r\n                    isEllipsisActive(searchItemResult) ? option.parentName : ''\r\n                  }}\"\r\n                  mode=\"dark\"\r\n                  *ngIf=\"getParentName(option)\"\r\n                >\r\n                  <span #searchItemResult class=\"search__result__parent-name\">\r\n                    {{ option.parentName }}\r\n                  </span>\r\n                </div>\r\n                <div qms-line type=\"subtitle\" class=\"search__option-name\">\r\n                  {{ option.itemName }}\r\n                </div>\r\n                <div\r\n                  class=\"caption\"\r\n                  *ngIf=\"option.breadcumbs && option.breadcumbs.length\"\r\n                >\r\n                  <qms-breadcrumb\r\n                    class=\"breadcrumb-containe\"\r\n                    type=\"table\"\r\n                    numDisplayItem=\"1\"\r\n                    [nodes]=\"option.breadcumbs\"\r\n                  >\r\n                  </qms-breadcrumb>\r\n                </div>\r\n              </div>\r\n              <div qms-line color=\"default-subtitle\" *ngIf=\"getItemId(option)\">\r\n                <span class=\"material-icons-outlined search__description-icon\">\r\n                  local_offer\r\n                </span>\r\n                {{ getItemId(option) }}\r\n              </div>\r\n            </qms-list-item>\r\n          </mat-option>\r\n        </div>\r\n      </ng-container>\r\n    </cdk-virtual-scroll-viewport>\r\n  </mat-autocomplete>\r\n\r\n  <div class=\"row\">\r\n    <div\r\n      class=\"qms-scrollbar qmslib_related_popup_content\"\r\n      [ngClass]=\"{\r\n        panel__content_item: checkedNodeList.length,\r\n        panel__content: !checkedNodeList.length,\r\n        'col-6': splitView,\r\n        'col-12': !splitView\r\n      }\"\r\n    >\r\n      <mat-expansion-panel\r\n        hideToggle\r\n        id=\"qmslib_related_popup_common_001\"\r\n        [expanded]=\"isCommonExpanded\"\r\n        (opened)=\"isCommonExpanded = true\"\r\n        (closed)=\"isCommonExpanded = false\"\r\n        class=\"panel-tree\"\r\n      >\r\n        <mat-expansion-panel-header class=\"padding-5\">\r\n          <mat-panel-title *ngIf=\"moduleId === module.documentProcess\">\r\n            {{ LANG.PROCESSES | uppercase }}\r\n          </mat-panel-title>\r\n          <mat-panel-title *ngIf=\"moduleId === module.deviation\">\r\n            {{ LANG.DEVIATION | uppercase }}\r\n          </mat-panel-title>\r\n          <mat-panel-title *ngIf=\"moduleId === module.checklist\">\r\n            {{ LANG.CHECKLIST | uppercase }}\r\n          </mat-panel-title>\r\n          <mat-panel-title *ngIf=\"moduleId === module.risk\">\r\n            {{ LANG.ASSESSMENT | uppercase }}\r\n          </mat-panel-title>\r\n          <button qms-btn-icon class=\"related_popup_toggle-btn\">\r\n            <mat-icon>\r\n              {{\r\n                isCommonExpanded ? \"keyboard_arrow_up\" : \"keyboard_arrow_down\"\r\n              }}\r\n            </mat-icon>\r\n          </button>\r\n        </mat-expansion-panel-header>\r\n        <div id=\"qmslib_related_popup_common_002\">\r\n          <qms-tree\r\n            [treeData]=\"treeData1\"\r\n            [treeConfig]=\"treeConfig1\"\r\n            [selectedData]=\"selectedData\"\r\n            [selectedRiskData]=\"selectedRiskData\"\r\n            [disabledList]=\"disabledList\"\r\n            (checkBoxEvent)=\"getCommonCheckedNode($event)\"\r\n            (nodeExpandEvent)=\"getChildrenOfFolder($event, dataType.area)\"\r\n            (selectNodeEvent)=\"selectNodeTreeEvent($event)\"\r\n            (getChildNodeSelectOne)=\"getChildNodeSelectOne($event)\"\r\n            [expandOnTitleClick]=\"!splitView\"\r\n            [parentNodeOnClick]=\"parentNodeSelected\"\r\n            (treeControlNodes)=\"selectTreeControlNodeProcess($event)\"\r\n          ></qms-tree>\r\n        </div>\r\n      </mat-expansion-panel>\r\n\r\n      <div\r\n        *ngIf=\"moduleId === module.documentProcess\"\r\n        class=\"line__divider\"\r\n      ></div>\r\n\r\n      <mat-expansion-panel\r\n        hideToggle\r\n        *ngIf=\"moduleId === module.documentProcess\"\r\n        id=\"qmslib_related_popup_document_001\"\r\n        [expanded]=\"isDocumentExpanded\"\r\n        (opened)=\"isDocumentExpanded = true\"\r\n        (closed)=\"isDocumentExpanded = false\"\r\n        class=\"panel-tree\"\r\n      >\r\n        <mat-expansion-panel-header class=\"padding-5\">\r\n          <mat-panel-title> {{ LANG.DOCUMENTS | uppercase }} </mat-panel-title>\r\n          <button qms-btn-icon class=\"related_popup_toggle-btn\">\r\n            <mat-icon>\r\n              {{\r\n                isDocumentExpanded ? \"keyboard_arrow_up\" : \"keyboard_arrow_down\"\r\n              }}\r\n            </mat-icon>\r\n          </button>\r\n        </mat-expansion-panel-header>\r\n        <div id=\"qmslib_related_popup_document_002\">\r\n          <qms-tree\r\n            [treeData]=\"treeData2\"\r\n            [treeConfig]=\"treeConfig2\"\r\n            [selectedData]=\"selectedData2\"\r\n            [disabledList]=\"disabledList2\"\r\n            (checkBoxEvent)=\"getDocumentCheckedNode($event)\"\r\n            (nodeExpandEvent)=\"getChildrenOfFolder($event, dataType.folder)\"\r\n            (selectNodeEvent)=\"selectNodeTreeEvent($event)\"\r\n            (getChildNodeSelectOne)=\"getChildNodeSelectOne($event)\"\r\n            [expandOnTitleClick]=\"!splitView\"\r\n            [parentNodeOnClick]=\"parentNodeSelected\"\r\n            (treeControlNodes)=\"selectTreeControlNodeDocument($event)\"\r\n          ></qms-tree>\r\n        </div>\r\n      </mat-expansion-panel>\r\n    </div>\r\n    <div\r\n      *ngIf=\"splitView\"\r\n      class=\"\r\n        qms-scrollbar\r\n        qmslib-related-popup-splitview qmslib_related_popup_content\r\n        col-6\r\n      \"\r\n      [ngClass]=\"{\r\n        panel__content_item: checkedNodeList.length,\r\n        panel__content: !checkedNodeList.length\r\n      }\"\r\n    >\r\n      <div class=\"splitview-header\" *ngIf=\"selectedFolder\">\r\n        {{ splitViewTitle }}\r\n      </div>\r\n      <div class=\"expand-node\" *ngFor=\"let node of itemInSplitview\">\r\n        <mat-checkbox\r\n          qms-group-options\r\n          [disabled]=\"node.disabled\"\r\n          color=\"default\"\r\n          [checked]=\"isNodeSelected(node)\"\r\n          (change)=\"toggleSelectItem(node)\"\r\n        ></mat-checkbox>\r\n        <mat-icon\r\n          class=\"mat-icon-rtl-mirror material-icons-outlined\"\r\n          [svgIcon]=\"getNodeIcon(node)\"\r\n        ></mat-icon>\r\n        <span class=\"text-node\">{{ node.itemName }}</span>\r\n      </div>\r\n    </div>\r\n  </div>\r\n\r\n  <div *ngIf=\"checkedNodeList.length\" class=\"line__divider\"></div>\r\n\r\n  <div *ngIf=\"checkedNodeList.length\" class=\"panel__item qms-scrollbar\">\r\n    <div class=\"related__item__inline\" *ngFor=\"let item of checkedNodeList\">\r\n      <button\r\n        *ngIf=\"item.itemName\"\r\n        mat-button\r\n        class=\"related__item__content\"\r\n        qms-tool-tip=\"{{\r\n          isEllipsisActive(itemName) ? getItemChipName(item) : ''\r\n        }}\"\r\n        mode=\"dark\"\r\n      >\r\n        <span class=\"related__item__content_name\" #itemName>{{\r\n          getItemChipName(item)\r\n        }}</span>\r\n        <mat-icon\r\n          *ngIf=\"!(treeConfig1?.selectOne || treeConfig2?.selectOne)\"\r\n          (click)=\"removeCheckedNodeList(item)\"\r\n          >cancel</mat-icon\r\n        >\r\n      </button>\r\n    </div>\r\n  </div>\r\n\r\n  <div class=\"line__divider\"></div>\r\n\r\n  <div class=\"confirm__button__groups\">\r\n    <button\r\n      *ngIf=\"!checkedNodeList.length\"\r\n      qms-btn\r\n      style=\"margin-top: 7px\"\r\n      (click)=\"onAddClick()\"\r\n    >\r\n      {{ LANG.ADD }}\r\n    </button>\r\n    <button\r\n      *ngIf=\"checkedNodeList.length\"\r\n      qms-btn\r\n      style=\"margin-top: 0px\"\r\n      (click)=\"onAddClick()\"\r\n    >\r\n      {{ LANG.ADD }} ({{ checkedNodeList.length }})\r\n    </button>\r\n    <button\r\n      qms-btn-text\r\n      [ngStyle]=\"{ 'margin-top': checkedNodeList.length ? '0px' : '7px' }\"\r\n      (click)=\"onCloseClick()\"\r\n    >\r\n      {{ LANG.CANCEL }}\r\n    </button>\r\n  </div>\r\n</div>\r\n",
+                    template: "<div id=\"qmslib_related_popup\" class=\"qmslib__related__popup__container\">\r\n  <div id=\"qmslib_related_popup_header\">\r\n    <span mat-icon-button class=\"button__close\" (click)=\"onCloseClick()\">\r\n      <mat-icon mat-icon>close</mat-icon>\r\n    </span>\r\n    <div id=\"qmslib_related_popup_header_001\" mat-dialog-content>\r\n      <span>{{ moduleName | uppercase }}</span>\r\n    </div>\r\n  </div>\r\n\r\n  <div id=\"qmslib_related_popup_search\" class=\"input__field\">\r\n    <input\r\n      type=\"text\"\r\n      placeholder=\"{{ LANG.SEARCH }}\"\r\n      matInput\r\n      [formControl]=\"myControl\"\r\n      [matAutocomplete]=\"auto\"\r\n    />\r\n    <mat-icon>search</mat-icon>\r\n  </div>\r\n\r\n  <div class=\"line__divider\"></div>\r\n\r\n  <mat-autocomplete\r\n    #auto=\"matAutocomplete\"\r\n    class=\"mat-autocomplete_related-viewport\"\r\n    (optionSelected)=\"selectRelated($event.option.value)\"\r\n    [displayWith]=\"displayWhenSelectRelatedOption\"\r\n  >\r\n    <cdk-virtual-scroll-viewport\r\n      qms-scrollbar\r\n      itemSize=\"10\"\r\n      [class.related-viewport]=\"isInputValue\"\r\n    >\r\n      <ng-container *ngFor=\"let type of searchOrder\">\r\n        <div\r\n          class=\"search__module-result\"\r\n          *ngIf=\"canShowSearchOption(type.value)\"\r\n        >\r\n          <span class=\"search__module-title\">{{ getTitle(type.value) }}</span>\r\n          <mat-option\r\n            class=\"search__option\"\r\n            *ngFor=\"let option of getModuleFilteredOptions(type.value)\"\r\n            [value]=\"option\"\r\n            [disabled]=\"option.disabled\"\r\n          >\r\n            <qms-list-item type=\"image-square\">\r\n              <mat-icon\r\n                leading-icon\r\n                type=\"image-square\"\r\n                [svgIcon]=\"getNodeIcon(option)\"\r\n              ></mat-icon>\r\n              <div qms-list-header>\r\n                <div\r\n                  qms-line\r\n                  type=\"caption\"\r\n                  qms-tool-tip=\"{{\r\n                    isEllipsisActive(searchItemResult) ? option.parentName : ''\r\n                  }}\"\r\n                  mode=\"dark\"\r\n                  *ngIf=\"getParentName(option)\"\r\n                >\r\n                  <span #searchItemResult class=\"search__result__parent-name\">\r\n                    {{ option.parentName }}\r\n                  </span>\r\n                </div>\r\n                <div qms-line type=\"subtitle\" class=\"search__option-name\">\r\n                  {{ option.itemName }}\r\n                </div>\r\n                <div\r\n                  class=\"caption\"\r\n                  *ngIf=\"option.breadcumbs && option.breadcumbs.length\"\r\n                >\r\n                  <qms-breadcrumb\r\n                    class=\"breadcrumb-containe\"\r\n                    type=\"table\"\r\n                    numDisplayItem=\"1\"\r\n                    [nodes]=\"option.breadcumbs\"\r\n                  >\r\n                  </qms-breadcrumb>\r\n                </div>\r\n              </div>\r\n              <div qms-line color=\"default-subtitle\" *ngIf=\"getItemId(option)\">\r\n                <span class=\"material-icons-outlined search__description-icon\">\r\n                  local_offer\r\n                </span>\r\n                {{ getItemId(option) }}\r\n              </div>\r\n            </qms-list-item>\r\n          </mat-option>\r\n        </div>\r\n      </ng-container>\r\n    </cdk-virtual-scroll-viewport>\r\n  </mat-autocomplete>\r\n\r\n  <div class=\"row\">\r\n    <div\r\n      class=\"qms-scrollbar qmslib_related_popup_content\"\r\n      [ngClass]=\"{\r\n        panel__content_item: checkedNodeList.length,\r\n        panel__content: !checkedNodeList.length,\r\n        'col-6': splitView,\r\n        'col-12': !splitView\r\n      }\"\r\n    >\r\n      <ng-container *ngIf=\"treeData1.length > 0\">\r\n        <mat-expansion-panel\r\n          hideToggle\r\n          id=\"qmslib_related_popup_common_001\"\r\n          [expanded]=\"isCommonExpanded\"\r\n          (opened)=\"isCommonExpanded = true\"\r\n          (closed)=\"isCommonExpanded = false\"\r\n          class=\"panel-tree\"\r\n        >\r\n          <mat-expansion-panel-header class=\"padding-5\">\r\n            <mat-panel-title *ngIf=\"moduleId === module.documentProcess\">\r\n              {{ LANG.PROCESSES | uppercase }}\r\n            </mat-panel-title>\r\n            <mat-panel-title *ngIf=\"moduleId === module.deviation\">\r\n              {{ LANG.DEVIATION | uppercase }}\r\n            </mat-panel-title>\r\n            <mat-panel-title *ngIf=\"moduleId === module.checklist\">\r\n              {{ LANG.CHECKLIST | uppercase }}\r\n            </mat-panel-title>\r\n            <mat-panel-title *ngIf=\"moduleId === module.risk\">\r\n              {{ LANG.ASSESSMENT | uppercase }}\r\n            </mat-panel-title>\r\n            <button qms-btn-icon class=\"related_popup_toggle-btn\">\r\n              <mat-icon>\r\n                {{\r\n                  isCommonExpanded ? \"keyboard_arrow_up\" : \"keyboard_arrow_down\"\r\n                }}\r\n              </mat-icon>\r\n            </button>\r\n          </mat-expansion-panel-header>\r\n          <div id=\"qmslib_related_popup_common_002\">\r\n            <qms-tree\r\n              [treeData]=\"treeData1\"\r\n              [treeConfig]=\"treeConfig1\"\r\n              [selectedData]=\"selectedData\"\r\n              [selectedRiskData]=\"selectedRiskData\"\r\n              [disabledList]=\"disabledList\"\r\n              (checkBoxEvent)=\"getCommonCheckedNode($event)\"\r\n              (nodeExpandEvent)=\"getChildrenOfFolder($event, dataType.area)\"\r\n              (selectNodeEvent)=\"selectNodeTreeEvent($event)\"\r\n              (getChildNodeSelectOne)=\"getChildNodeSelectOne($event)\"\r\n              [expandOnTitleClick]=\"!splitView\"\r\n              [parentNodeOnClick]=\"parentNodeSelected\"\r\n              (treeControlNodes)=\"selectTreeControlNodeProcess($event)\"\r\n            ></qms-tree>\r\n          </div>\r\n        </mat-expansion-panel>\r\n      </ng-container>\r\n\r\n      <ng-container *ngIf=\"treeData2.length > 0\">\r\n        <div\r\n          *ngIf=\"moduleId === module.documentProcess\"\r\n          class=\"line__divider\"\r\n        ></div>\r\n\r\n        <mat-expansion-panel\r\n          hideToggle\r\n          *ngIf=\"moduleId === module.documentProcess\"\r\n          id=\"qmslib_related_popup_document_001\"\r\n          [expanded]=\"isDocumentExpanded\"\r\n          (opened)=\"isDocumentExpanded = true\"\r\n          (closed)=\"isDocumentExpanded = false\"\r\n          class=\"panel-tree\"\r\n        >\r\n          <mat-expansion-panel-header class=\"padding-5\">\r\n            <mat-panel-title>\r\n              {{ LANG.DOCUMENTS | uppercase }}\r\n            </mat-panel-title>\r\n            <button qms-btn-icon class=\"related_popup_toggle-btn\">\r\n              <mat-icon>\r\n                {{\r\n                  isDocumentExpanded\r\n                    ? \"keyboard_arrow_up\"\r\n                    : \"keyboard_arrow_down\"\r\n                }}\r\n              </mat-icon>\r\n            </button>\r\n          </mat-expansion-panel-header>\r\n          <div id=\"qmslib_related_popup_document_002\">\r\n            <qms-tree\r\n              [treeData]=\"treeData2\"\r\n              [treeConfig]=\"treeConfig2\"\r\n              [selectedData]=\"selectedData2\"\r\n              [disabledList]=\"disabledList2\"\r\n              (checkBoxEvent)=\"getDocumentCheckedNode($event)\"\r\n              (nodeExpandEvent)=\"getChildrenOfFolder($event, dataType.folder)\"\r\n              (selectNodeEvent)=\"selectNodeTreeEvent($event)\"\r\n              (getChildNodeSelectOne)=\"getChildNodeSelectOne($event)\"\r\n              [expandOnTitleClick]=\"!splitView\"\r\n              [parentNodeOnClick]=\"parentNodeSelected\"\r\n              (treeControlNodes)=\"selectTreeControlNodeDocument($event)\"\r\n            ></qms-tree>\r\n          </div>\r\n        </mat-expansion-panel>\r\n      </ng-container>\r\n    </div>\r\n    <div\r\n      *ngIf=\"splitView\"\r\n      class=\"\r\n        qms-scrollbar\r\n        qmslib-related-popup-splitview qmslib_related_popup_content\r\n        col-6\r\n      \"\r\n      [ngClass]=\"{\r\n        panel__content_item: checkedNodeList.length,\r\n        panel__content: !checkedNodeList.length\r\n      }\"\r\n    >\r\n      <div class=\"splitview-header\" *ngIf=\"selectedFolder\">\r\n        {{ splitViewTitle }}\r\n      </div>\r\n      <div class=\"expand-node\" *ngFor=\"let node of itemInSplitview\">\r\n        <mat-checkbox\r\n          qms-group-options\r\n          [disabled]=\"node.disabled\"\r\n          color=\"default\"\r\n          [checked]=\"isNodeSelected(node)\"\r\n          (change)=\"toggleSelectItem(node)\"\r\n        ></mat-checkbox>\r\n        <mat-icon\r\n          class=\"mat-icon-rtl-mirror material-icons-outlined\"\r\n          [svgIcon]=\"getNodeIcon(node)\"\r\n        ></mat-icon>\r\n        <span class=\"text-node\">{{ node.itemName }}</span>\r\n      </div>\r\n    </div>\r\n  </div>\r\n\r\n  <div *ngIf=\"checkedNodeList.length\" class=\"line__divider\"></div>\r\n\r\n  <div *ngIf=\"checkedNodeList.length\" class=\"panel__item qms-scrollbar\">\r\n    <div class=\"related__item__inline\" *ngFor=\"let item of checkedNodeList\">\r\n      <button\r\n        *ngIf=\"item.itemName\"\r\n        mat-button\r\n        class=\"related__item__content\"\r\n        qms-tool-tip=\"{{\r\n          isEllipsisActive(itemName) ? getItemChipName(item) : ''\r\n        }}\"\r\n        mode=\"dark\"\r\n      >\r\n        <span class=\"related__item__content_name\" #itemName>{{\r\n          getItemChipName(item)\r\n        }}</span>\r\n        <mat-icon\r\n          *ngIf=\"!(treeConfig1?.selectOne || treeConfig2?.selectOne)\"\r\n          (click)=\"removeCheckedNodeList(item)\"\r\n          >cancel</mat-icon\r\n        >\r\n      </button>\r\n    </div>\r\n  </div>\r\n\r\n  <div class=\"line__divider\"></div>\r\n\r\n  <div class=\"confirm__button__groups\">\r\n    <button\r\n      *ngIf=\"!checkedNodeList.length\"\r\n      qms-btn\r\n      style=\"margin-top: 7px\"\r\n      (click)=\"onAddClick()\"\r\n    >\r\n      {{ LANG.ADD }}\r\n    </button>\r\n    <button\r\n      *ngIf=\"checkedNodeList.length\"\r\n      qms-btn\r\n      style=\"margin-top: 0px\"\r\n      (click)=\"onAddClick()\"\r\n    >\r\n      {{ LANG.ADD }} ({{ checkedNodeList.length }})\r\n    </button>\r\n    <button\r\n      qms-btn-text\r\n      [ngStyle]=\"{ 'margin-top': checkedNodeList.length ? '0px' : '7px' }\"\r\n      (click)=\"onCloseClick()\"\r\n    >\r\n      {{ LANG.CANCEL }}\r\n    </button>\r\n  </div>\r\n</div>\r\n",
                     encapsulation: i0.ViewEncapsulation.None,
                     styles: [".qms-scrollbar::-webkit-scrollbar{width:12px}.qms-scrollbar::-webkit-scrollbar-track{background:rgba(0,0,0,.12);background-clip:content-box}.qms-scrollbar::-webkit-scrollbar-thumb{background:rgba(0,0,0,.38);border-radius:20px;width:4px;border:4px solid transparent;background-clip:content-box}.qms-scrollbar::-webkit-scrollbar-thumb:hover{background:rgba(0,0,0,.5);background-clip:content-box;border:4px solid transparent}.qms-scrollbar.none-scroll-bg::-webkit-scrollbar-track{background:transparent;background-clip:content-box}.qms__popup .button__close{float:right;top:-24px;right:-24px;cursor:pointer}.qms__danger button{border:none;color:#fff;padding:0;text-align:center;text-decoration:none;display:inline-block;cursor:pointer;height:20px;width:20px;font-family:Open Sans;font-size:12px;font-weight:600;font-style:normal;line-height:16px}.qms__danger .red{background-color:#9e360f;margin-left:10px}.qms__danger .yellow{background-color:#e4cf53;margin-left:10px;color:#323232}.qms__danger .green{background-color:#00804c;margin-left:10px}.confirm__button__groups{margin-top:11px}.confirm__button__groups button{min-height:36px;width:auto;font-family:Open Sans;font-weight:500;font-size:14px;letter-spacing:1px;line-height:16px;padding-left:15px;padding-right:15px;margin-right:5px;float:right}.confirm__button__groups .confirm{background:#f8f9f9}.confirm__button__groups .confirm:hover{background:#001983;color:#fff}.confirm__button__groups .confirm:disabled{cursor:not-allowed}.confirm__button__groups .cancel{background:#f8f9f9}.confirm__button__groups .cancel:hover{background:#001983;color:#fff}.qmslib__related__popup__container .input__field{display:flex;align-items:center}.qmslib__related__popup__container .input__field input{width:100%;padding:10px;outline:none;border:none;background:#eee}.qmslib__related__popup__container .input__field .mat-icon{margin-left:-30px;cursor:pointer;vertical-align:middle}.qmslib__related__popup__container .line__divider{border-bottom:1px solid #ccc;height:1px;margin-top:10px;min-width:300px;max-width:100%}.qmslib__related__popup__container .button__close{float:right;top:-24px;right:-24px;cursor:pointer}.qmslib__related__popup__container .panel__content{height:450px;overflow:auto;margin-top:12px}.qmslib__related__popup__container .panel__content_item{height:350px;overflow:auto;margin-top:12px}.qmslib__related__popup__container .panel-tree .mat-expansion-panel-body{padding:0 12px 12px}.qmslib__related__popup__container .mat-expansion-panel-header{height:30px;font-size:12px;letter-spacing:1px;font-family:Raleway;font-weight:600;padding:0}.qmslib__related__popup__container .mat-expansion-panel-header .mat-expansion-panel-header-title{align-items:center;margin-left:12px}.qmslib__related__popup__container .mat-expansion-panel-header .related_popup_toggle-btn{width:1.5rem;height:1.5rem;line-height:1.5rem}.qmslib__related__popup__container .mat-expansion-panel:not([class*=mat-elevation-z]){box-shadow:none}.qmslib__related__popup__container .panel__item{height:100px;margin-top:12px;overflow-x:hidden;overflow-y:auto;padding-right:5px;width:100%;max-width:100%;display:flex;flex-wrap:wrap;align-content:flex-start}.qmslib__related__popup__container .panel__item .related__item__inline{max-width:100%}.qmslib__related__popup__container .panel__item .related__item__content{height:32px;line-height:32px;background-color:#e5e5e5;max-width:100%;margin-bottom:5px;margin-left:2.5px;margin-right:2.5px}.qmslib__related__popup__container .panel__item .related__item__content .mat-icon{color:#8e8e8e;font-size:24px}.qmslib__related__popup__container .panel__item .related__item__content span.related__item__content_name{display:inline-block;min-width:calc(100% - 13px);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:278px}.qmslib__related__popup__container .qmslib-related-popup-splitview{background-color:#fff;border-left:1px solid #ccc;height:450px;overflow-y:auto;margin-top:12px}.qmslib__related__popup__container .qmslib-related-popup-splitview.panel__content{height:450px;overflow:auto;margin-top:12px}.qmslib__related__popup__container .qmslib-related-popup-splitview.panel__content_item{height:350px;overflow:auto;margin-top:12px}.qmslib__related__popup__container .qmslib-related-popup-splitview .splitview-header{height:30px;font-size:12px;letter-spacing:1px;font-family:RALEWAY;font-weight:600;display:flex;align-items:center}.qmslib__related__popup__container .qmslib-related-popup-splitview .mat-checkbox.qms-group-options{padding:0}.qmslib__related__popup__container .qmslib-related-popup-splitview .mat-checkbox.qms-group-options .mat-checkbox-inner-container{margin-right:11px}.qmslib__related__popup__container .qmslib-related-popup-splitview .mat-checkbox.qms-group-options.mat-checkbox-checked{background:transparent!important}.qmslib__related__popup__container .qmslib-related-popup-splitview .expand-node{margin-left:8px;display:flex;align-items:center;min-height:40px}.qmslib__related__popup__container .qmslib-related-popup-splitview .expand-node .mat-icon{color:rgba(0,0,0,.6);margin-right:17px;min-width:-webkit-fit-content;min-width:-moz-fit-content;min-width:fit-content}.qmslib__related__popup__container .qmslib-related-popup-splitview .expand-node .mat-icon svg{display:block;min-width:-webkit-fit-content;min-width:-moz-fit-content;min-width:fit-content}cdk-virtual-scroll-viewport{overflow-x:hidden}cdk-virtual-scroll-viewport .search__module-result{margin:1.5rem;padding:0 0 .5rem}cdk-virtual-scroll-viewport .search__module-result .search__module-title{font-size:14px;font-weight:600}cdk-virtual-scroll-viewport .search__module-result .search__option{height:auto;line-height:normal;padding:8px 0;border-bottom:1px solid #e0e0e0}cdk-virtual-scroll-viewport .search__module-result .search__option .qms-list-item.mat-2-line.image-item{height:auto}cdk-virtual-scroll-viewport .search__module-result .search__option .qms-list-item-content{margin:0;border-bottom:none}cdk-virtual-scroll-viewport .search__module-result .search__option .qms-list-item-content .wrap-image.image-square{width:2.5rem;height:100%;background:transparent;align-self:center;margin-right:0}cdk-virtual-scroll-viewport .search__module-result .search__option .qms-list-item-content .wrap-image.image-square img{width:24px;height:24px}cdk-virtual-scroll-viewport .search__module-result .search__option .qms-list-item-content .material-icons-outlined.leading-icon,cdk-virtual-scroll-viewport .search__module-result .search__option .qms-list-item-content mat-icon.leading-icon{padding:4px 0 4px 4px}cdk-virtual-scroll-viewport .search__module-result .search__option .qms-list-item-content .subtitle{font-weight:400}cdk-virtual-scroll-viewport .search__module-result .search__option .qms-list-item-content .caption{overflow:hidden;line-height:normal;white-space:normal;text-overflow:ellipsis;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;padding:0;margin:0}cdk-virtual-scroll-viewport .search__module-result .search__option .qms-list-item-content .caption span.search__result__parent-name{display:inline-block;width:auto;width:calc(100% - 13px);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}cdk-virtual-scroll-viewport .search__module-result .search__option .qms-list-item-content .default-subtitle{color:rgba(0,0,0,.38)}cdk-virtual-scroll-viewport .search__module-result .search__option .qms-list-item-content .search__description-icon{margin-right:0;width:12px;height:12px;font-size:12px}cdk-virtual-scroll-viewport .search__module-result .search__option .qms-list-item-content .qms-list-text{border-bottom:none}cdk-virtual-scroll-viewport .search__module-result .search__option .qms-list-item-content .breadcrumb-containe .qms-breadcrumb-item .mat-icon{font-size:16px!important;padding-bottom:1px}cdk-virtual-scroll-viewport .search__module-result .mat-option[aria-disabled=true] .breadcrumb-containe .qms-breadcrumb-item-text,cdk-virtual-scroll-viewport .search__module-result .mat-option[aria-disabled=true] .breadcrumb-containe .qms-breadcrumb-item .mat-icon,cdk-virtual-scroll-viewport .search__module-result .mat-option[aria-disabled=true] .subtitle{color:rgba(0,0,0,.38)}cdk-virtual-scroll-viewport .search__module-result svg{display:block}#qmslib_related_popup_header_001{margin-bottom:20px;padding:0;font-weight:600;font-family:Raleway}.padding-5{padding:5px}.mat-autocomplete_related-viewport{height:100%;max-height:100%!important}.mat-autocomplete_related-viewport .cdk-virtual-scroll-content-wrapper{width:100%}.mat-autocomplete_related-viewport .related-viewport{min-height:300px}"]
                 },] }
@@ -7800,8 +8010,8 @@
         return TreeNode;
     }());
 
-    var objData = {};
-    function buildArrayTree(obj, level) {
+    var objData$1 = {};
+    function buildArrayTree$1(obj, level) {
         var _this = this;
         return Object.keys(obj).reduce(function (accumulator, key) {
             var value = obj[key];
@@ -7820,9 +8030,9 @@
             return accumulator.concat(node);
         }, []);
     }
-    function buildObjectTree(arr) {
+    function buildObjectTree$1(arr) {
         var _this = this;
-        objData = {};
+        objData$1 = {};
         var objTreeData;
         var root = arr.filter(function (x) {
             return x.parentId === '';
@@ -7832,7 +8042,7 @@
         });
         return objTreeData;
     }
-    function findParent(id, array) {
+    function findParent$1(id, array) {
         var objParent = {};
         var parent = array.filter(function (x) {
             return x.rootId === id;
@@ -7848,10 +8058,10 @@
             this.findChild(id, objParent, array);
         }
         // add node to tree
-        objData[parent[0].rootId + "_" + parent[0].rootName] = objParent;
-        return objData;
+        objData$1[parent[0].rootId + "_" + parent[0].rootName] = objParent;
+        return objData$1;
     }
-    function findChild(id, objParent, array) {
+    function findChild$1(id, objParent, array) {
         var subNode = array.filter(function (x) {
             return x.parentId === id;
         });
@@ -7859,14 +8069,14 @@
             var processNode = {};
             processNode[item.childId + "_" + item.childName] = null;
             objParent[item.rootId + "_" + item.subName] = processNode;
-            findChild(item.rootId, processNode, array);
+            findChild$1(item.rootId, processNode, array);
         });
     }
     var QMSCKEditorTreeFunctions = {
-        buildArrayTree: buildArrayTree,
-        buildObjectTree: buildObjectTree,
-        findParent: findParent,
-        findChild: findChild
+        buildArrayTree: buildArrayTree$1,
+        buildObjectTree: buildObjectTree$1,
+        findParent: findParent$1,
+        findChild: findChild$1
     };
 
     var QMSCKEditorTreeService = /** @class */ (function (_super) {
@@ -9045,7 +9255,7 @@
             },
             language: 'en',
             table: {
-                contentToolbar: ['tableColumn', 'tableRow', 'mergeTableCells']
+                contentToolbar: ['tableColumn', 'tableRow', 'mergeTableCells', 'tableProperties', 'tableCellProperties']
             },
             image: {
                 styles: ['alignLeft', 'alignCenter', 'alignRight'],
@@ -16442,7 +16652,7 @@
         { type: i0.Component, args: [{
                     selector: 'app-qms-app-bar',
                     template: "<div class=\"qms-app-bar-container\">\r\n    <mat-toolbar class=\"bar-container\" *ngIf=\"!isNomalType\">\r\n        <span class=\"w-100\">\r\n            <span class=\"col-4 d-inline-flex align-items-lg-center\">\r\n                <div *ngIf=\"hideMenuDropdown\" class=\"border align-self-center\">\r\n                    <div *ngIf=\"logoSvgPath\" class=\"logo-container\">\r\n                        <img [src]=\"logoSvgPath\" alt=\"\" />\r\n                    </div>\r\n                </div>\r\n                <div *ngIf=\"!hideMenuDropdown\">\r\n                    <button #menu class=\"collapse-icon\" mat-button>\r\n                        <mat-icon class=\"mat-icon-rtl-mirror\" (click)=\"onMenuClicked()\">\r\n                            menu\r\n                        </mat-icon>\r\n                    </button>\r\n                    <img [src]=\"logoSvgPath\" alt=\"\" />\r\n                </div>\r\n                <div class=\"pr-8\"></div>\r\n                <span class=\"content-title\">{{title}}</span>\r\n                <div class=\"spacer\"></div>\r\n            </span>\r\n            <span class=\"align-items-sm-center col-4 d-inline-flex justify-content-center\">\r\n                <div *ngIf=\"imgSvgPath\" class=\"img-container\" [class.bg-transparent]=\"isImgSvgTransparent\">\r\n                    <img [src]=\"imgSvgPath\" alt=\"\" />\r\n                </div>\r\n            </span>\r\n            <span class=\"col-4 d-inline-flex justify-content-end right-icon\">\r\n                <button (click)=\"onRightIconClicked(item.icon)\" *ngFor=\"let item of rightIcons\" class=\"menu-item-icon\"\r\n                    mat-button>\r\n                    <mat-icon *ngIf=\"item.icon == 'notifications_none'\" matBadge=\"{{notifications}}\"\r\n                        matBadgeColor=\"warn\">\r\n                        {{item.icon}}\r\n                    </mat-icon>\r\n                    <mat-icon *ngIf=\"item.icon != 'notifications_none'\"\r\n                        class=\"material-icons-outlined mat-icon-rtl-mirror\">\r\n                        {{item.icon}}\r\n                    </mat-icon>\r\n                    <span class=\"mg-l-3\">{{item.tooltip}}</span>\r\n                </button>\r\n            </span>\r\n        </span>\r\n    </mat-toolbar>\r\n    <mat-toolbar class=\"bar-prv-container\" *ngIf=\"isNomalType\">\r\n        <button class=\"icon-title\" #menu qms-btn-text (click)=\"onClickLeftFirstIcon()\">\r\n            <mat-icon class=\"cusor-pointer\">\r\n                {{leftFirstIcon}}\r\n            </mat-icon>\r\n        </button>\r\n        <span class=\"content-title\">{{title}}</span>\r\n        <div class=\"spacer\"></div>\r\n        <div class=\"right-content\">\r\n            <button qms-btn-text (click)=\"onCancel()\" class=\"cusor-pointer mr-10\" *ngIf=\"cancelTitle\">\r\n                {{cancelTitle}}\r\n            </button>\r\n            <button qms-btn [disabled]=\"disabledConfirmAction\" class=\"cusor-pointer\" (click)=\"onConfirm()\" *ngIf=\"confirmTitle\">\r\n                {{confirmTitle}}\r\n            </button>\r\n        </div>\r\n    </mat-toolbar>\r\n</div>",
-                    styles: [".qms-app-bar-container{height:56px}.qms-app-bar-container .spacer{flex:1 1 auto}.qms-app-bar-container .mat-toolbar{background:#00324e;color:#fff;height:56px}.qms-app-bar-container .bar-prv-container{background:#e4e4e4}.qms-app-bar-container .bar-prv-container .close-icon,.qms-app-bar-container .bar-prv-container .title-icon{color:#323232}.qms-app-bar-container .bar-prv-container .right-content button{line-height:16px!important}.qms-app-bar-container .bar-prv-container .right-content .mr-10{margin-right:10px}.qms-app-bar-container .bar-prv-container button:first-child:hover{background-color:rgba(0,0,0,.08)}.qms-app-bar-container .bar-prv-container .icon-title{color:#666;padding:0;min-width:0;width:40px;height:40px;flex-shrink:0;line-height:40px;border-radius:50%;margin-right:11px}.qms-app-bar-container .bar-prv-container .content-title{font-family:Raleway;font-size:18px;font-style:normal;font-weight:600;line-height:21px;letter-spacing:0;text-align:left;color:#323232}.qms-app-bar-container .bar-container{padding:0!important}.qms-app-bar-container .bar-container .logo-container{background:#fff;padding:12px;height:56px}.qms-app-bar-container .bar-container .img-container{height:40px;background:#fff;padding:2px}.qms-app-bar-container .bar-container .bg-transparent{background:transparent;height:40px;padding:2px}.qms-app-bar-container .bar-container .right-icon button:last-child{min-width:unset!important}.qms-app-bar-container .bar-container ::ng-deep .mat-badge-warn .mat-badge-content{background-color:#9e360f!important}.qms-app-bar-container .pr-8{padding-right:8px}"]
+                    styles: [".qms-app-bar-container{height:56px}.qms-app-bar-container .spacer{flex:1 1 auto}.qms-app-bar-container .mat-toolbar{background:#00324e;color:#fff;height:56px}.qms-app-bar-container .bar-prv-container{background:#e4e4e4}.qms-app-bar-container .bar-prv-container .close-icon,.qms-app-bar-container .bar-prv-container .title-icon{color:#323232}.qms-app-bar-container .bar-prv-container .right-content button{line-height:16px!important}.qms-app-bar-container .bar-prv-container .right-content .mr-10{margin-right:10px}.qms-app-bar-container .bar-prv-container button:first-child:hover{background-color:rgba(0,0,0,.08)}.qms-app-bar-container .bar-prv-container .icon-title{color:#666;padding:0;min-width:0;width:40px;height:40px;flex-shrink:0;line-height:40px;border-radius:50%;margin-right:11px}.qms-app-bar-container .bar-prv-container .content-title{font-family:Raleway;font-size:18px;font-style:normal;font-weight:600;line-height:21px;letter-spacing:0;text-align:left;color:#323232}.qms-app-bar-container .bar-container{padding:0!important}.qms-app-bar-container .bar-container .logo-container{background:#fff;padding:12px;height:56px}.qms-app-bar-container .bar-container .img-container{height:40px;background:#fff;padding:2px}.qms-app-bar-container .bar-container .bg-transparent{background:transparent;height:40px;padding:2px}.qms-app-bar-container .bar-container .right-icon button:last-child{min-width:unset!important}.qms-app-bar-container .bar-container ::ng-deep .mat-badge-warn .mat-badge-content{background-color:#9e360f!important}.qms-app-bar-container .bar-container .content-title{font-family:Raleway;font-size:18px;font-style:normal;font-weight:600;line-height:21px;letter-spacing:0;text-align:left;color:#fff}.qms-app-bar-container .pr-8{padding-right:8px}"]
                 },] }
     ];
     QmsAppBarComponent.ctorParameters = function () { return []; };
@@ -16492,20 +16702,6 @@
                 },] }
     ];
 
-    var IconModel = /** @class */ (function () {
-        function IconModel(icon, tooltip, cssClass, svg, isShow) {
-            if (cssClass === void 0) { cssClass = ''; }
-            if (svg === void 0) { svg = false; }
-            if (isShow === void 0) { isShow = true; }
-            this.icon = icon;
-            this.tooltip = tooltip;
-            this.svg = svg;
-            this.cssClass = cssClass;
-            this.isShow = isShow;
-        }
-        return IconModel;
-    }());
-
     var ConfirmDialog = /** @class */ (function () {
         function ConfirmDialog() {
             this.title = '';
@@ -16562,6 +16758,99 @@
                 },] }
     ];
 
+    var QMSTabGroupAdvancedDirective = /** @class */ (function () {
+        function QMSTabGroupAdvancedDirective(ele) {
+            this.ele = ele;
+        }
+        QMSTabGroupAdvancedDirective.prototype.ngOnInit = function () {
+            if (this.ele) {
+                this.ele.nativeElement.classList.add('qms-tab-group-advanced');
+                if (this.color) {
+                    this.ele.nativeElement.classList.add(this.color);
+                }
+                if (this.type === 'fixed') {
+                    this.ele.nativeElement.classList.add('qms-tab-group-advanced-fixed');
+                }
+            }
+        };
+        return QMSTabGroupAdvancedDirective;
+    }());
+    QMSTabGroupAdvancedDirective.decorators = [
+        { type: i0.Directive, args: [{
+                    selector: '[qms-tab-group-advanced]',
+                },] }
+    ];
+    QMSTabGroupAdvancedDirective.ctorParameters = function () { return [
+        { type: i0.ElementRef }
+    ]; };
+    QMSTabGroupAdvancedDirective.propDecorators = {
+        color: [{ type: i0.Input }],
+        type: [{ type: i0.Input }]
+    };
+
+    var QMSTabGroupDirective = /** @class */ (function () {
+        function QMSTabGroupDirective(ele) {
+            this.ele = ele;
+        }
+        QMSTabGroupDirective.prototype.ngOnInit = function () {
+            if (this.ele) {
+                this.ele.nativeElement.classList.add('qms-tab-group');
+            }
+        };
+        return QMSTabGroupDirective;
+    }());
+    QMSTabGroupDirective.decorators = [
+        { type: i0.Directive, args: [{
+                    selector: '[qms-tab-group]',
+                },] }
+    ];
+    QMSTabGroupDirective.ctorParameters = function () { return [
+        { type: i0.ElementRef }
+    ]; };
+
+    var QMSTabLabelDirective = /** @class */ (function () {
+        function QMSTabLabelDirective(ele) {
+            this.ele = ele;
+        }
+        QMSTabLabelDirective.prototype.ngOnInit = function () {
+            if (this.ele) {
+                this.ele.nativeElement.classList.add('qms-tab-label');
+            }
+        };
+        return QMSTabLabelDirective;
+    }());
+    QMSTabLabelDirective.decorators = [
+        { type: i0.Directive, args: [{
+                    selector: '[qms-tab-label]',
+                },] }
+    ];
+    QMSTabLabelDirective.ctorParameters = function () { return [
+        { type: i0.ElementRef }
+    ]; };
+
+    var QMSTabModule = /** @class */ (function () {
+        function QMSTabModule() {
+        }
+        return QMSTabModule;
+    }());
+    QMSTabModule.decorators = [
+        { type: i0.NgModule, args: [{
+                    declarations: [
+                        QMSTabGroupAdvancedDirective,
+                        QMSTabGroupDirective,
+                        QMSTabLabelDirective
+                    ],
+                    imports: [
+                        common.CommonModule
+                    ],
+                    exports: [
+                        QMSTabGroupAdvancedDirective,
+                        QMSTabGroupDirective,
+                        QMSTabLabelDirective
+                    ]
+                },] }
+    ];
+
     var QmsBannerContent = /** @class */ (function () {
         function QmsBannerContent() {
         }
@@ -16589,7 +16878,7 @@
 
     var QmsBannerComponent = /** @class */ (function () {
         function QmsBannerComponent() {
-            this.type = exports.BannerType.primary;
+            this.type = '' || exports.BannerType.primary;
             this.contents = [];
             this.buttonClick = new i0.EventEmitter();
         }
@@ -16733,6 +17022,76 @@
                 },] }
     ];
 
+    var QmsStatusDropdownClassTypeMapping = {
+        1: 'light',
+        2: 'warning',
+        3: 'success',
+        4: 'danger'
+    };
+    var QmsStatusDropdownComponent = /** @class */ (function () {
+        function QmsStatusDropdownComponent() {
+            this.options = [];
+            this.valueChange = new i0.EventEmitter();
+        }
+        QmsStatusDropdownComponent.prototype.getClassType = function (type) {
+            return QmsStatusDropdownClassTypeMapping[type];
+        };
+        QmsStatusDropdownComponent.prototype.onModelChange = function () {
+            this.valueChange.emit(this.value);
+        };
+        return QmsStatusDropdownComponent;
+    }());
+    QmsStatusDropdownComponent.decorators = [
+        { type: i0.Component, args: [{
+                    selector: 'qms-status-dropdown',
+                    template: "<div id=\"qms-status-dropdown-container\" class=\"qms-status-dropdown-container {{ getClassType(value) }}\">\r\n    <mat-form-field class=\"material-custom-multiselect height-40\" [style.width]=\"width\">\r\n        <mat-select [(ngModel)]=\"value\" (ngModelChange)=\"onModelChange()\">\r\n            <ng-container *ngIf=\"options\">\r\n                <mat-option *ngFor=\"let option of options\" [value]=\"option.type\">\r\n                    <label class=\"qms-label qms-label-{{ getClassType(option.type) }}\">{{ option.text }}</label>\r\n                </mat-option>\r\n            </ng-container>\r\n        </mat-select>\r\n    </mat-form-field>\r\n</div>",
+                    styles: [".qms-status-dropdown-container ::ng-deep .material-custom-multiselect{height:40px}.qms-status-dropdown-container ::ng-deep .material-custom-multiselect.mat-focused{outline:1px solid #1954a9;border-radius:2px}.qms-status-dropdown-container ::ng-deep .material-custom-multiselect .mat-form-field-flex{border-radius:2px;padding:0 17.5px 0 16px;width:100%;height:40px}.qms-status-dropdown-container ::ng-deep .material-custom-multiselect .mat-form-field-flex .mat-select-min-line{font-family:Open Sans;font-size:14px;font-weight:600;line-height:16px;letter-spacing:1px}.qms-status-dropdown-container ::ng-deep .material-custom-multiselect .mat-form-field-infix{padding-top:0;border-top:10px solid transparent}.qms-status-dropdown-container ::ng-deep .material-custom-multiselect .mat-form-field-infix .mat-select-value-text{line-height:16px}.qms-status-dropdown-container ::ng-deep .material-custom-multiselect .mat-form-field-wrapper .mat-form-field-underline{display:none}.qms-status-dropdown-container.warning ::ng-deep .material-custom-multiselect .mat-form-field-flex{background-color:#e4cf53}.qms-status-dropdown-container.warning ::ng-deep .material-custom-multiselect .mat-form-field-flex .mat-select-arrow-wrapper .mat-select-arrow{color:rgba(0,0,0,.6)}.qms-status-dropdown-container.warning ::ng-deep .material-custom-multiselect .mat-select-value{color:#323232}.qms-status-dropdown-container.warning ::ng-deep .material-custom-multiselect .mat-select-arrow{color:#323232}.qms-status-dropdown-container.light ::ng-deep .material-custom-multiselect .mat-form-field-flex{background-color:rgba(0,0,0,.1)}.qms-status-dropdown-container.light ::ng-deep .material-custom-multiselect .mat-form-field-flex .mat-select-arrow-wrapper .mat-select-arrow{color:rgba(0,0,0,.6)}.qms-status-dropdown-container.light ::ng-deep .material-custom-multiselect .mat-select-value{color:#323232}.qms-status-dropdown-container.light ::ng-deep .material-custom-multiselect .mat-select-arrow{color:#323232}.qms-status-dropdown-container.danger ::ng-deep .material-custom-multiselect .mat-form-field-flex{background-color:#9e360f}.qms-status-dropdown-container.danger ::ng-deep .material-custom-multiselect .mat-form-field-flex .mat-select-arrow-wrapper .mat-select-arrow{color:hsla(0,0%,100%,.6)}.qms-status-dropdown-container.danger ::ng-deep .material-custom-multiselect .mat-select-value{color:#fff}.qms-status-dropdown-container.danger ::ng-deep .material-custom-multiselect .mat-select-arrow{color:#fff}.qms-status-dropdown-container.success ::ng-deep .material-custom-multiselect .mat-form-field-flex{background-color:#005832}.qms-status-dropdown-container.success ::ng-deep .material-custom-multiselect .mat-select-value{color:#fff}.qms-status-dropdown-container.success ::ng-deep .material-custom-multiselect .mat-select-arrow{color:#fff}.qms-status-dropdown-container.success ::ng-deep .material-custom-multiselect .mat-select-arrow-wrapper .mat-select-arrow{color:hsla(0,0%,100%,.6)}.qms-status-dropdown-container ::ng-deep mat-select .mat-select-value{font-size:14px;line-height:16px;color:#323232;font-weight:500}.qms-status-dropdown-container ::ng-deep mat-select .mat-select-arrow-wrapper{padding-top:17.5px}.qms-status-dropdown-container ::ng-deep mat-select .mat-select-arrow-wrapper .mat-select-arrow{border-top:4px solid}.qms-status-dropdown-container ::ng-deep mat-option .mat-option-custom .mat-pseudo-checkbox-checked:after{top:3px;width:11px;height:5px;border-left:3px solid}"]
+                },] }
+    ];
+    QmsStatusDropdownComponent.propDecorators = {
+        options: [{ type: i0.Input }],
+        value: [{ type: i0.Input }],
+        width: [{ type: i0.Input }],
+        valueChange: [{ type: i0.Output }]
+    };
+
+    var QmsStatusDropdownModule = /** @class */ (function () {
+        function QmsStatusDropdownModule() {
+        }
+        return QmsStatusDropdownModule;
+    }());
+    QmsStatusDropdownModule.decorators = [
+        { type: i0.NgModule, args: [{
+                    declarations: [
+                        QmsStatusDropdownComponent
+                    ],
+                    imports: [
+                        common.CommonModule,
+                        forms.FormsModule,
+                        forms.ReactiveFormsModule,
+                        select.MatSelectModule,
+                        core.MatOptionModule,
+                        formField.MatFormFieldModule
+                    ],
+                    exports: [
+                        QmsStatusDropdownComponent
+                    ]
+                },] }
+    ];
+
+    exports.QmsStatusDropdownType = void 0;
+    (function (QmsStatusDropdownType) {
+        QmsStatusDropdownType[QmsStatusDropdownType["Light"] = 1] = "Light";
+        QmsStatusDropdownType[QmsStatusDropdownType["Warning"] = 2] = "Warning";
+        QmsStatusDropdownType[QmsStatusDropdownType["Success"] = 3] = "Success";
+        QmsStatusDropdownType[QmsStatusDropdownType["Danger"] = 4] = "Danger";
+    })(exports.QmsStatusDropdownType || (exports.QmsStatusDropdownType = {}));
+    var QmsStatusDropdownOption = /** @class */ (function () {
+        function QmsStatusDropdownOption() {
+        }
+        return QmsStatusDropdownOption;
+    }());
+
     var QMSTableAction = /** @class */ (function () {
         function QMSTableAction(elRef) {
             this.elRef = elRef;
@@ -16811,15 +17170,48 @@
         return BreadcrumbNode;
     }());
 
-    var StepModel = /** @class */ (function () {
-        function StepModel(id, name, disabled, selected) {
-            this.id = id;
-            this.disabled = disabled;
-            this.name = name;
-            this.selected = selected;
+    var RelatedConst = /** @class */ (function () {
+        function RelatedConst() {
         }
-        return StepModel;
-    }());
+        return RelatedConst;
+    }());
+    RelatedConst.IS_DISPLAY_SEARCH_RESULT = 'IS_DISPLAY_SEARCH_RESULT';
+    RelatedConst.HIDE_SEARCH_RESULT = 'HIDE_SEARCH_RESULT';
+    RelatedConst.SHOW_SEARCH_RESULT = 'SHOW_SEARCH_RESULT';
+
+    exports.DataType = void 0;
+    (function (DataType) {
+        DataType[DataType["process"] = 2] = "process";
+        DataType[DataType["document"] = 1] = "document";
+        DataType[DataType["area"] = 3] = "area";
+        DataType[DataType["folder"] = 4] = "folder";
+        DataType[DataType["deviation"] = 5] = "deviation";
+        DataType[DataType["checklist"] = 6] = "checklist";
+        DataType[DataType["risk"] = 7] = "risk";
+        DataType[DataType["deviationType"] = 8] = "deviationType";
+        DataType[DataType["checklistCategory"] = 9] = "checklistCategory";
+        DataType[DataType["riskFolder"] = 10] = "riskFolder";
+    })(exports.DataType || (exports.DataType = {}));
+
+    exports.DocumentNodeType = void 0;
+    (function (DocumentNodeType) {
+        DocumentNodeType[DocumentNodeType["Document"] = 1] = "Document";
+        DocumentNodeType[DocumentNodeType["LinkDocument"] = 2] = "LinkDocument";
+        DocumentNodeType[DocumentNodeType["FileDocument"] = 3] = "FileDocument";
+        DocumentNodeType[DocumentNodeType["ShortcutDocument"] = 4] = "ShortcutDocument";
+        DocumentNodeType[DocumentNodeType["Folder"] = 5] = "Folder";
+        DocumentNodeType[DocumentNodeType["TopFolder"] = 6] = "TopFolder";
+        DocumentNodeType[DocumentNodeType["DepartmentFolder"] = 7] = "DepartmentFolder";
+        DocumentNodeType[DocumentNodeType["RegionalFolder"] = 8] = "RegionalFolder";
+    })(exports.DocumentNodeType || (exports.DocumentNodeType = {}));
+
+    exports.ModuleType = void 0;
+    (function (ModuleType) {
+        ModuleType[ModuleType["documentProcess"] = 1] = "documentProcess";
+        ModuleType[ModuleType["deviation"] = 2] = "deviation";
+        ModuleType[ModuleType["checklist"] = 3] = "checklist";
+        ModuleType[ModuleType["risk"] = 4] = "risk";
+    })(exports.ModuleType || (exports.ModuleType = {}));
 
     /* eslint-disable @typescript-eslint/explicit-module-boundary-types */
     var QmsStepperComponent = /** @class */ (function () {
@@ -16835,14 +17227,15 @@
         };
         QmsStepperComponent.prototype.changeStep = function (selectedIndex) {
             this.currentStep = selectedIndex;
-            this.selectionChangeEvent.emit(selectedIndex);
+            this.selectionChangeEvent.emit(this.currentStep);
         };
         return QmsStepperComponent;
     }());
     QmsStepperComponent.decorators = [
         { type: i0.Component, args: [{
+                    changeDetection: i0.ChangeDetectionStrategy.OnPush,
                     selector: 'app-qms-stepper',
-                    template: "<div class=\"qms-stepper-container\">\r\n    <div *ngIf=\"isHorizontal\">\r\n        <mat-horizontal-stepper [style.width.px]=\"width\" labelPosition=\"{{labelPosition}}\" #stepper\r\n            (selectionChange)=\"changeStep($event)\" class=\"overflow-auto\" [selectedIndex]=\"currentStep\">\r\n            <mat-step *ngFor=\"let step of steps; let i = index;\" [completed]=\"false\"\r\n                [aria-labelledby]=\"step.disabled ? 'disabled' : 'step-item'\">\r\n                <ng-template matStepLabel>\r\n                    <span tabindex=\"0\" (keydown.enter)=\"changeStep(i)\" class=\"title-step\">{{step.name}}</span>\r\n                </ng-template>\r\n                <ng-template matStepContent>\r\n                </ng-template>\r\n            </mat-step>\r\n            <ng-template matStepperIcon=\"edit\">\r\n                {{stepper.selectedIndex + 1}}\r\n            </ng-template>\r\n        </mat-horizontal-stepper>\r\n    </div>\r\n    <div *ngIf=\"!isHorizontal\">\r\n        <mat-vertical-stepper [style.height.px]=\"height\" #stepper (selectionChange)=\"changeStep($event.selectedIndex)\"\r\n            [selectedIndex]=\"currentStep\" class=\"overflow-auto\">\r\n            <mat-step *ngFor=\"let step of steps; let i = index;\" [completed]=\"false\"\r\n                [aria-labelledby]=\"step.disabled ? 'disabled' : 'step-item'\">\r\n                <ng-template matStepLabel>\r\n                    <span tabindex=\"0\" (keydown.enter)=\"changeStep(i)\" class=\"title-step\">{{step.name}}</span>\r\n                </ng-template>\r\n                <ng-template matStepContent>\r\n                </ng-template>\r\n            </mat-step>\r\n            <ng-template matStepperIcon=\"edit\">\r\n                <span>{{stepper.selectedIndex + 1}}</span>\r\n            </ng-template>\r\n        </mat-vertical-stepper>\r\n    </div>\r\n</div>",
+                    template: "<div class=\"qms-stepper-container\">\r\n    <div *ngIf=\"isHorizontal\">\r\n        <mat-horizontal-stepper [style.width.px]=\"width\" labelPosition=\"{{labelPosition}}\" #stepper\r\n            (selectionChange)=\"changeStep($event.selectedIndex)\" class=\"overflow-auto\" [selectedIndex]=\"currentStep\">\r\n            <mat-step *ngFor=\"let step of steps; let i = index;\" [completed]=\"false\"\r\n                [aria-labelledby]=\"step.disabled ? 'disabled' : 'step-item'\">\r\n                <ng-template matStepLabel>\r\n                    <span tabindex=\"0\" (keydown.enter)=\"changeStep(i)\" class=\"title-step\">{{step.name}}</span>\r\n                </ng-template>\r\n                <ng-template matStepContent>\r\n                </ng-template>\r\n            </mat-step>\r\n            <ng-template matStepperIcon=\"edit\">\r\n                {{stepper.selectedIndex + 1}}\r\n            </ng-template>\r\n        </mat-horizontal-stepper>\r\n    </div>\r\n    <div *ngIf=\"!isHorizontal\">\r\n        <mat-vertical-stepper [style.height.px]=\"height\" #stepper (selectionChange)=\"changeStep($event.selectedIndex)\"\r\n            [selectedIndex]=\"currentStep\" class=\"overflow-auto\">\r\n            <mat-step *ngFor=\"let step of steps; let i = index;\" [completed]=\"false\"\r\n                [aria-labelledby]=\"step.disabled ? 'disabled' : 'step-item'\">\r\n                <ng-template matStepLabel>\r\n                    <span tabindex=\"0\" (keydown.enter)=\"changeStep(i)\" class=\"title-step\">{{step.name}}</span>\r\n                </ng-template>\r\n                <ng-template matStepContent>\r\n                </ng-template>\r\n            </mat-step>\r\n            <ng-template matStepperIcon=\"edit\">\r\n                <span>{{stepper.selectedIndex + 1}}</span>\r\n            </ng-template>\r\n        </mat-vertical-stepper>\r\n    </div>\r\n</div>",
                     styles: [".qms-stepper-container ::ng-deep .mat-step-header[aria-labelledby=step-item]{height:22px!important;padding:8px 12px;left:0;top:0;border-radius:4px;color:#fff}.qms-stepper-container ::ng-deep .mat-step-header[aria-labelledby=step-item].mat-horizontal-stepper-header{width:auto}.qms-stepper-container ::ng-deep .mat-step-header[aria-labelledby=step-item].mat-vertical-stepper-header{width:156px}.qms-stepper-container ::ng-deep .mat-step-header .mat-step-icon{background:rgba(0,0,0,.6);margin-right:14px}.qms-stepper-container ::ng-deep .mat-step-header .mat-step-icon-selected{background-color:#1954a9!important;color:#fff}.qms-stepper-container ::ng-deep .mat-step-header[aria-selected=true] .title-step{font-weight:600!important;outline:none!important}.qms-stepper-container ::ng-deep mat-step-header:active{background:#e5eefb}.qms-stepper-container ::ng-deep mat-step-header:active mat-step-label{color:#fff}.qms-stepper-container ::ng-deep mat-step-header:active mat-step-icon{color:#323232;background:rgba(0,0,0,.6)}.qms-stepper-container ::ng-deep mat-step-header .mat-ripple-element{background-color:rgba(229,238,251,.3)}.qms-stepper-container ::ng-deep mat-step-header:hover{background:#f2f7fd}.qms-stepper-container ::ng-deep mat-step-header:hover mat-step-label{color:#fff}.qms-stepper-container ::ng-deep mat-step-header:hover mat-step-icon{color:#323232;background:rgba(0,0,0,.6)}.qms-stepper-container ::ng-deep .mat-step-header[aria-labelledby=disabled]{pointer-events:none!important;cursor:not-allowed;opacity:.6;height:22px!important;width:156px;left:0;top:0;border-radius:4px;padding:8px 12px}.qms-stepper-container ::ng-deep mat-step-header:focus{border:2px solid #1954a9}.qms-stepper-container ::ng-deep mat-step-header:focus mat-step-label{color:#fff}.qms-stepper-container ::ng-deep mat-step-header:focus mat-step-icon{color:#323232;background:rgba(0,0,0,.6)}.qms-stepper-container ::ng-deep mat-step-header.mat-step-header.cdk-keyboard-focused,.qms-stepper-container ::ng-deep mat-step-header.mat-step-header.cdk-program-focused{border:3px solid #1954a9;background:#fff}.qms-stepper-container ::ng-deep mat-step-header:focus:not(:focus-visible){border:none}.qms-stepper-container ::ng-deep .mat-step-header[aria-labelledby=active]{pointer-events:none!important;cursor:not-allowed;opacity:.6}.qms-stepper-container .title-step{font-family:Open Sans;font-size:14px;font-style:normal;font-weight:400;letter-spacing:0;text-align:center;color:#323232;outline:none!important}.qms-stepper-container ::ng-deep .mat-step-icon{width:24px;height:24px}.qms-stepper-container ::ng-deep .mat-step-icon .mat-step-icon-content{font-family:Open Sans;font-size:14px;font-style:normal;font-weight:400;letter-spacing:0;text-align:center;color:#fff;padding-top:1px}.qms-stepper-container ::ng-deep .mat-stepper-vertical-line:before{border-left-width:0;border-right-width:0}.qms-stepper-container ::ng-deep .mat-stepper-vertical-line{margin-left:23px;background:#0000001f;height:30px;width:1px}.qms-stepper-container ::ng-deep .mat-stepper-horizontal-line{height:1px;width:22px!important;left:0;top:18px;border-radius:0;margin:8px;background:#0000001f;max-width:22px!important}"]
                 },] }
     ];
@@ -17018,6 +17411,7 @@
         function SelectPopupData() {
             this.treeData = [];
             this.headerName = '';
+            this.selectIncludeLabel = '';
             this.selectedNode = [];
             this.disabledList = [];
         }
@@ -17061,6 +17455,7 @@
             this.data = data;
             this.ngUnsubscribe = new rxjs.Subject();
             this.headerName = '';
+            this.selectIncludeLabel = '';
             this.treeData = [];
             this.checkedNodeList = [];
             this.selectedOptions = [];
@@ -17094,6 +17489,7 @@
             this.checkedNodeList = (data === null || data === void 0 ? void 0 : data.selectedList) || [];
             this.includeChildren = data === null || data === void 0 ? void 0 : data.includeChildren;
             this.editItem = data.editItem;
+            this.selectIncludeLabel = data.selectIncludeLabel;
             appIconService.registerProcessIcon(iconRegistry, domSanitizer);
             appIconService.registerProcessAreaIcon(iconRegistry, domSanitizer);
             appIconService.registerDocumentIcon(iconRegistry, domSanitizer);
@@ -17172,19 +17568,17 @@
         SelectIncludeChildrenPopUpComponent.prototype.removeCheckedNodeList = function (item) {
             var index = this.checkedNodeList.findIndex(function (x) { return (x.id.toLowerCase() === item.id.toLowerCase() && x.parentId.toLowerCase() === item.parentId.toLowerCase()); });
             if (index >= 0) {
-                var position = this.selectedOptions.findIndex(function (x) { return x.id === item.id && x.parentId === item.parentId; });
-                if (position >= 0) {
-                    this.selectedOptions.splice(position, 1);
-                }
                 if (this.checkedNodeList[index].type === exports.SelectOptionTypes.IncludeChildren) {
                     this.removeIncludeChildren(item);
-                }
-                if (this.includeChildren) {
                     this.refactorSelectList(item);
                 }
                 else {
-                    this.checkedNodeList.splice(index, 1);
+                    var position = this.selectedOptions.findIndex(function (x) { return x.id === item.id && x.parentId === item.parentId; });
+                    if (position >= 0) {
+                        this.selectedOptions.splice(position, 1);
+                    }
                 }
+                this.checkedNodeList.splice(index, 1);
                 this.enableSelectedNode({ id: item.id, parentId: item.parentId, itemName: item.name, type: exports.SelectOptionTypes.IncludeChildren });
                 this.selectedData = this.mapSelectOptionToTreeNode(this.selectedOptions);
             }
@@ -17241,11 +17635,6 @@
         SelectIncludeChildrenPopUpComponent.prototype.getImagePath = function (item) {
             return this.domSanitizer.bypassSecurityTrustResourceUrl(item.itemIconBase64);
         };
-        SelectIncludeChildrenPopUpComponent.prototype.isMatchTrue = function (arr, arr2) {
-            return arr.every(function (i) {
-                return arr2.includes(i);
-            });
-        };
         SelectIncludeChildrenPopUpComponent.prototype.setResultHeight = function (arr) {
             var maxHeight = 484;
             var popup_content = document.getElementsByClassName('qmslib_related_popup_content')[0];
@@ -17307,12 +17696,14 @@
             listChildren = this.getAllChildrenNodeRecursive(listChildren, item);
             var itemIndex = this.selectedOptions.findIndex(function (node) { return node.id === item.id && node.parentId === item.parentId; });
             if (itemIndex >= 0) {
+                this.enableSelectedNode(this.selectedOptions[itemIndex]);
                 this.selectedOptions.splice(itemIndex, 1);
             }
             listChildren.forEach(function (x) {
                 var index = _this.selectedOptions.findIndex(function (node) { return node.id === x.id && node.parentId === x.parentId; });
                 if (index >= 0) {
                     _this.selectedOptions.splice(index, 1);
+                    _this.disabledList = _this.disabledList.filter(function (node) { return !(x.id === node.id && x.parentId === node.parentId); });
                 }
             });
         };
@@ -17400,30 +17791,17 @@
                     disabled: false,
                 });
             }
-            else {
-                // this.selectRelated(node);
-            }
         };
         SelectIncludeChildrenPopUpComponent.prototype.isNodeSelected = function (node) {
             return this.checkedNodeList.filter(function (x) { return (x.id.toLowerCase() === node.id.toLowerCase() && x.parentId.toLowerCase() === node.parentId.toLowerCase()); }).length > 0;
         };
         SelectIncludeChildrenPopUpComponent.prototype.getChildrenOfFolder = function (node) {
-            // if (this.splitView) {
-            // const parentTexts = this.elem.nativeElement.querySelectorAll('.text-node-parent');
-            // [].forEach.call(parentTexts, (el) => {
-            //     el.classList.remove('active-item');
-            // });
-            // const itemElement = document.querySelectorAll(`#_${node.parentId ? node.parentId : ''}_${node.id}_${node.level}`);
-            // [].forEach.call(itemElement, (el) => {
-            //     el.classList.add('active-item');
-            // });
             var item = new SelectOption();
             item.id = node.id;
             item.itemName = node.name;
             item.levelType = node.levelType;
             this.selectedFolder = node;
             this.onExpandFolder.emit(item);
-            // }
         };
         SelectIncludeChildrenPopUpComponent.prototype.selectNodeTreeEvent = function (node) {
             var position = this.selectedOptions.findIndex(function (x) { return x.id === node.id && x.parentId === node.parentId; });
@@ -17489,14 +17867,15 @@
         SelectIncludeChildrenPopUpComponent.prototype.setValue = function (e) {
             var _this = this;
             this.includeChildren = !!e.checked;
-            if (!this.includeChildren) {
-                this.checkedNodeList.forEach(function (node) {
-                    _this.disableSelectedNode(node);
-                });
-            }
-            else {
-                this.disabledList = this.orginalDisableList;
-            }
+            this.disabledList = $.extend(true, [], this.orginalDisableList || []);
+            this.checkedNodeList.forEach(function (node) {
+                if (!_this.includeChildren) {
+                    _this.disableSelectIncludeNode(node);
+                }
+                else {
+                    _this.disableSelectSingleNode(node);
+                }
+            });
         };
         SelectIncludeChildrenPopUpComponent.prototype.mapSelectOptionToTreeNode = function (list) {
             return list.map(function (x) {
@@ -17529,8 +17908,9 @@
                 var selectedParentList = parentList.filter(function (x) { return _this.selectedOptions
                     .findIndex(function (selectedNode) { return x.id === selectedNode.id && x.parentId === selectedNode.parentId; }) >= 0; });
                 if (selectedParentList.length > 0) {
-                    var highestSelectedNode = selectedParentList[selectedParentList.length - 1];
-                    this.combineNodes(highestSelectedNode);
+                    var highestSelectedNode_1 = selectedParentList[selectedParentList.length - 1];
+                    this.combineNodes(highestSelectedNode_1);
+                    this.disabledList = this.disabledList.filter(function (x) { return !(x.id === highestSelectedNode_1.id && x.parentId === highestSelectedNode_1.parentId); });
                 }
                 else {
                     this.combineNodes({
@@ -17539,6 +17919,7 @@
                         type: exports.SelectOptionTypes.IncludeChildren,
                         parentId: node.parentId
                     });
+                    this.disabledList = this.disabledList.filter(function (x) { return !(x.id === node.id && x.parentId === node.parentId); });
                 }
             }
             else {
@@ -17571,10 +17952,11 @@
                 }
                 var selectIndex = _this.selectedOptions.findIndex(function (node) { return node.id === child.id && node.parentId === child.parentId; });
                 if (selectIndex >= 0) {
+                    _this.disabledList = _this.disabledList.filter(function (node) { return !(child.id === node.id && child.parentId === node.parentId); });
                     nodeList.push(child);
                 }
             });
-            if (nodeList.length > 0 || children.length === 0) {
+            if (selectedNodeIndex >= 0 || nodeList.length > 0 || children.length === 0) {
                 if (selectedNodeIndex < 0) {
                     this.checkedNodeList.push({
                         id: root.id,
@@ -17607,18 +17989,20 @@
             }
             return listParent;
         };
-        SelectIncludeChildrenPopUpComponent.prototype.disableSelectedNode = function (node) {
+        SelectIncludeChildrenPopUpComponent.prototype.disableSelectIncludeNode = function (node) {
             var _this = this;
             if (node.type === exports.SelectOptionTypes.IncludeChildren) {
                 var children = [];
-                children = this.getAllChildrenNodeRecursive(children, {
-                    id: node.id,
-                    name: node.itemName,
-                    parentId: node.parentId,
-                    level: 0,
-                    expandable: true,
-                    hasChild: true,
-                    disabled: false
+                children = node.children.map(function (x) {
+                    return {
+                        id: x.id,
+                        name: x.itemName,
+                        parentId: node.id,
+                        level: 0,
+                        expandable: true,
+                        hasChild: true,
+                        disabled: false
+                    };
                 });
                 var disableNodes_1 = [];
                 var index = this.disabledList.findIndex(function (x) { return x.id === node.id && x.parentId === node.parentId; });
@@ -17634,6 +18018,16 @@
                 this.disabledList = __spreadArray(__spreadArray([], __read(this.disabledList)), __read(disableNodes_1));
             }
         };
+        SelectIncludeChildrenPopUpComponent.prototype.disableSelectSingleNode = function (node) {
+            if (node.type === exports.SelectOptionTypes.SelectOne) {
+                var disableNodes = [];
+                var index = this.disabledList.findIndex(function (x) { return x.id === node.id && x.parentId === node.parentId; });
+                if (index < 0) {
+                    disableNodes.push(node);
+                }
+                this.disabledList = __spreadArray(__spreadArray([], __read(this.disabledList)), __read(disableNodes));
+            }
+        };
         SelectIncludeChildrenPopUpComponent.prototype.enableSelectedNode = function (node) {
             var children = [];
             children = this.getAllChildrenNodeRecursive(children, {
@@ -17653,7 +18047,7 @@
     SelectIncludeChildrenPopUpComponent.decorators = [
         { type: i0.Component, args: [{
                     selector: 'qms-select-include-children-popup',
-                    template: "<div id=\"qmslib_related_popup\" class=\"qmslib__related__popup__container\">\r\n  <div id=\"qmslib_related_popup_header\">\r\n    <span mat-icon-button class=\"button__close\" (click)=\"onCloseClick()\">\r\n      <mat-icon mat-icon>close</mat-icon>\r\n    </span>\r\n    <div id=\"qmslib_related_popup_header_001\" mat-dialog-content>\r\n      <span>{{ headerName | uppercase }}</span>\r\n    </div>\r\n  </div>\r\n\r\n  <div\r\n    id=\"qmslib_related_popup_search\"\r\n    class=\"input__field\"\r\n    (click)=\"showSearchResult()\"\r\n  >\r\n    <input\r\n      #name\r\n      type=\"text\"\r\n      placeholder=\"{{ LANG.SEARCH }}\"\r\n      matInput\r\n      [formControl]=\"myControl\"\r\n      [matAutocomplete]=\"auto\"\r\n      #autoCompleteInputSearch\r\n    />\r\n    <mat-icon>search</mat-icon>\r\n  </div>\r\n  <div class=\"select__toggle-include\">\r\n    <mat-slide-toggle\r\n      [checked]=\"includeChildren\"\r\n      (change)=\"setValue($event)\"\r\n      color=\"default\"\r\n      qms-group-options\r\n    >\r\n      <span class=\"text-label\">Select label</span>\r\n    </mat-slide-toggle>\r\n  </div>\r\n  <div class=\"line__divider\"></div>\r\n\r\n  <mat-autocomplete\r\n    #auto=\"matAutocomplete\"\r\n    [displayWith]=\"displayRelated\"\r\n    class=\"mat-autocomplete_related-viewport\"\r\n  >\r\n    <cdk-virtual-scroll-viewport\r\n      qms-scrollbar\r\n      itemSize=\"10\"\r\n      class=\"related-viewport\"\r\n    >\r\n      <div class=\"search__module-result\" *ngIf=\"filteredOptions\">\r\n        <mat-option\r\n          class=\"search__option\"\r\n          *ngFor=\"let option of filteredOptions\"\r\n          [value]=\"option\"\r\n          (click)=\"selectSearchOption(option)\"\r\n        >\r\n          <qms-list-item type=\"image-square\">\r\n            <mat-icon\r\n              leading-icon\r\n              *ngIf=\"getItemIconType(option) === itemIconType.name\"\r\n              class=\"mat-icon-rtl-mirror material-icons-outlined\"\r\n              type=\"image-square\"\r\n            >\r\n              {{ option.itemIcon }}\r\n            </mat-icon>\r\n\r\n            <mat-icon\r\n              leading-icon\r\n              *ngIf=\"getItemIconType(option) === itemIconType.svg\"\r\n              class=\"mat-icon-rtl-mirror material-icons-outlined\"\r\n              type=\"image-square\"\r\n              [svgIcon]=\"option.itemIconSvg\"\r\n            >\r\n            </mat-icon>\r\n\r\n            <img\r\n              leading-icon\r\n              *ngIf=\"getItemIconType(option) === itemIconType.path\"\r\n              class=\"mat-icon\"\r\n              [src]=\"option.itemIconPath\"\r\n              type=\"image-square\"\r\n            />\r\n\r\n            <img\r\n              leading-icon\r\n              *ngIf=\"getItemIconType(option) === itemIconType.base64\"\r\n              class=\"mat-icon image-base64\"\r\n              [src]=\"getImagePath(option)\"\r\n              type=\"image-square\"\r\n            />\r\n            <div qms-list-header>\r\n              <div qms-line type=\"subtitle\" class=\"search__option-name\">\r\n                {{ option.itemName }}\r\n              </div>\r\n            </div>\r\n          </qms-list-item>\r\n        </mat-option>\r\n      </div>\r\n    </cdk-virtual-scroll-viewport>\r\n  </mat-autocomplete>\r\n\r\n  <div class=\"row\">\r\n    <div\r\n      class=\"qms-scrollbar qmslib_related_popup_content col-12\"\r\n      [ngClass]=\"{\r\n        panel__content_item: checkedNodeList.length,\r\n        panel__content: !checkedNodeList.length\r\n      }\"\r\n    >\r\n      <div id=\"qmslib_related_popup_common_002\">\r\n        <qms-tree\r\n          [treeData]=\"treeData\"\r\n          [treeConfig]=\"treeConfig\"\r\n          [selectedData]=\"selectedData\"\r\n          [selectedRiskData]=\"selectedRiskData\"\r\n          [disabledList]=\"disabledList\"\r\n          (checkBoxEvent)=\"getCommonCheckedNode($event)\"\r\n          (nodeExpandEvent)=\"getChildrenOfFolder($event)\"\r\n          (selectNodeEvent)=\"selectNodeTreeEvent($event)\"\r\n        ></qms-tree>\r\n      </div>\r\n    </div>\r\n\r\n    <div *ngIf=\"checkedNodeList.length\" class=\"line__divider\"></div>\r\n\r\n    <div *ngIf=\"checkedNodeList.length\" class=\"panel__item qms-scrollbar\">\r\n      <div class=\"related__item__inline\" *ngFor=\"let item of checkedNodeList\">\r\n        <button\r\n          *ngIf=\"item.itemName\"\r\n          mat-button\r\n          class=\"related__item__content\"\r\n          qms-tool-tip=\"{{\r\n            isEllipsisActive(itemName) ? getItemChipName(item) : ''\r\n          }}\"\r\n          mode=\"dark\"\r\n        >\r\n          <span class=\"related__item__content_name\" #itemName>\r\n            {{ getItemChipName(item) }}\r\n            <span\r\n              class=\"select__include-children__count\"\r\n              *ngIf=\"item.noSelectedChildren > 0\"\r\n            >\r\n              {{ getItemSelectedChildrenRatio(item) }}\r\n            </span>\r\n          </span>\r\n\r\n          <mat-icon (click)=\"removeCheckedNodeList(item)\">cancel</mat-icon>\r\n        </button>\r\n      </div>\r\n    </div>\r\n\r\n    <div class=\"line__divider\"></div>\r\n\r\n    <div class=\"confirm__button__groups\">\r\n      <button\r\n        *ngIf=\"!checkedNodeList.length\"\r\n        qms-btn\r\n        style=\"margin-top: 7px\"\r\n        (click)=\"onAddClick()\"\r\n      >\r\n        {{ LANG.ADD }}\r\n      </button>\r\n      <button\r\n        *ngIf=\"checkedNodeList.length\"\r\n        qms-btn\r\n        style=\"margin-top: 0px\"\r\n        (click)=\"onAddClick()\"\r\n      >\r\n        {{ LANG.ADD }} ({{ checkedNodeList.length }})\r\n      </button>\r\n      <button\r\n        qms-btn-text\r\n        [ngStyle]=\"{ 'margin-top': checkedNodeList.length ? '0px' : '7px' }\"\r\n        (click)=\"onCloseClick()\"\r\n      >\r\n        {{ LANG.CANCEL }}\r\n      </button>\r\n    </div>\r\n  </div>\r\n</div>\r\n",
+                    template: "<div id=\"qmslib_related_popup\" class=\"qmslib__related__popup__container\">\r\n  <div id=\"qmslib_related_popup_header\">\r\n    <span mat-icon-button class=\"button__close\" (click)=\"onCloseClick()\">\r\n      <mat-icon mat-icon>close</mat-icon>\r\n    </span>\r\n    <div id=\"qmslib_related_popup_header_001\" mat-dialog-content>\r\n      <span>{{ headerName | uppercase }}</span>\r\n    </div>\r\n  </div>\r\n\r\n  <div\r\n    id=\"qmslib_related_popup_search\"\r\n    class=\"input__field\"\r\n    (click)=\"showSearchResult()\"\r\n  >\r\n    <input\r\n      #name\r\n      type=\"text\"\r\n      placeholder=\"{{ LANG.SEARCH }}\"\r\n      matInput\r\n      [formControl]=\"myControl\"\r\n      [matAutocomplete]=\"auto\"\r\n      #autoCompleteInputSearch\r\n    />\r\n    <mat-icon>search</mat-icon>\r\n  </div>\r\n  <div class=\"select__toggle-include\">\r\n    <mat-slide-toggle\r\n      [checked]=\"includeChildren\"\r\n      (change)=\"setValue($event)\"\r\n      color=\"default\"\r\n      qms-group-options\r\n    >\r\n      <span class=\"text-label\">{{ selectIncludeLabel }}</span>\r\n    </mat-slide-toggle>\r\n  </div>\r\n  <div class=\"line__divider\"></div>\r\n\r\n  <mat-autocomplete\r\n    #auto=\"matAutocomplete\"\r\n    [displayWith]=\"displayRelated\"\r\n    class=\"mat-autocomplete_related-viewport\"\r\n  >\r\n    <cdk-virtual-scroll-viewport\r\n      qms-scrollbar\r\n      itemSize=\"10\"\r\n      class=\"related-viewport\"\r\n    >\r\n      <div class=\"search__module-result\" *ngIf=\"filteredOptions\">\r\n        <mat-option\r\n          class=\"search__option\"\r\n          *ngFor=\"let option of filteredOptions\"\r\n          [value]=\"option\"\r\n          (click)=\"selectSearchOption(option)\"\r\n        >\r\n          <qms-list-item type=\"image-square\">\r\n            <mat-icon\r\n              leading-icon\r\n              *ngIf=\"getItemIconType(option) === itemIconType.name\"\r\n              class=\"mat-icon-rtl-mirror material-icons-outlined\"\r\n              type=\"image-square\"\r\n            >\r\n              {{ option.itemIcon }}\r\n            </mat-icon>\r\n\r\n            <mat-icon\r\n              leading-icon\r\n              *ngIf=\"getItemIconType(option) === itemIconType.svg\"\r\n              class=\"mat-icon-rtl-mirror material-icons-outlined\"\r\n              type=\"image-square\"\r\n              [svgIcon]=\"option.itemIconSvg\"\r\n            >\r\n            </mat-icon>\r\n\r\n            <img\r\n              leading-icon\r\n              *ngIf=\"getItemIconType(option) === itemIconType.path\"\r\n              class=\"mat-icon\"\r\n              [src]=\"option.itemIconPath\"\r\n              type=\"image-square\"\r\n            />\r\n\r\n            <img\r\n              leading-icon\r\n              *ngIf=\"getItemIconType(option) === itemIconType.base64\"\r\n              class=\"mat-icon image-base64\"\r\n              [src]=\"getImagePath(option)\"\r\n              type=\"image-square\"\r\n            />\r\n            <div qms-list-header>\r\n              <div qms-line type=\"subtitle\" class=\"search__option-name\">\r\n                {{ option.itemName }}\r\n              </div>\r\n            </div>\r\n          </qms-list-item>\r\n        </mat-option>\r\n      </div>\r\n    </cdk-virtual-scroll-viewport>\r\n  </mat-autocomplete>\r\n\r\n  <div class=\"row\">\r\n    <div\r\n      class=\"qms-scrollbar qmslib_related_popup_content col-12\"\r\n      [ngClass]=\"{\r\n        panel__content_item: checkedNodeList.length,\r\n        panel__content: !checkedNodeList.length\r\n      }\"\r\n    >\r\n      <div id=\"qmslib_related_popup_common_002\">\r\n        <qms-tree\r\n          [treeData]=\"treeData\"\r\n          [treeConfig]=\"treeConfig\"\r\n          [selectedData]=\"selectedData\"\r\n          [selectedRiskData]=\"selectedRiskData\"\r\n          [disabledList]=\"disabledList\"\r\n          (checkBoxEvent)=\"getCommonCheckedNode($event)\"\r\n          (nodeExpandEvent)=\"getChildrenOfFolder($event)\"\r\n          (selectNodeEvent)=\"selectNodeTreeEvent($event)\"\r\n        ></qms-tree>\r\n      </div>\r\n    </div>\r\n\r\n    <div *ngIf=\"checkedNodeList.length\" class=\"line__divider\"></div>\r\n\r\n    <div *ngIf=\"checkedNodeList.length\" class=\"panel__item qms-scrollbar\">\r\n      <div class=\"related__item__inline\" *ngFor=\"let item of checkedNodeList\">\r\n        <button\r\n          *ngIf=\"item.itemName\"\r\n          mat-button\r\n          class=\"related__item__content\"\r\n          qms-tool-tip=\"{{\r\n            isEllipsisActive(itemName) ? getItemChipName(item) : ''\r\n          }}\"\r\n          mode=\"dark\"\r\n        >\r\n          <span class=\"related__item__content_name\" #itemName>\r\n            {{ getItemChipName(item) }}\r\n            <span\r\n              class=\"select__include-children__count\"\r\n              *ngIf=\"item.noSelectedChildren > 0\"\r\n            >\r\n              {{ getItemSelectedChildrenRatio(item) }}\r\n            </span>\r\n          </span>\r\n\r\n          <mat-icon (click)=\"removeCheckedNodeList(item)\">cancel</mat-icon>\r\n        </button>\r\n      </div>\r\n    </div>\r\n\r\n    <div class=\"line__divider\"></div>\r\n\r\n    <div class=\"confirm__button__groups\">\r\n      <button\r\n        *ngIf=\"!checkedNodeList.length\"\r\n        qms-btn\r\n        style=\"margin-top: 7px\"\r\n        (click)=\"onAddClick()\"\r\n      >\r\n        {{ LANG.ADD }}\r\n      </button>\r\n      <button\r\n        *ngIf=\"checkedNodeList.length\"\r\n        qms-btn\r\n        style=\"margin-top: 0px\"\r\n        (click)=\"onAddClick()\"\r\n      >\r\n        {{ LANG.ADD }} ({{ checkedNodeList.length }})\r\n      </button>\r\n      <button\r\n        qms-btn-text\r\n        [ngStyle]=\"{ 'margin-top': checkedNodeList.length ? '0px' : '7px' }\"\r\n        (click)=\"onCloseClick()\"\r\n      >\r\n        {{ LANG.CANCEL }}\r\n      </button>\r\n    </div>\r\n  </div>\r\n</div>\r\n",
                     encapsulation: i0.ViewEncapsulation.None,
                     styles: [".qms-scrollbar::-webkit-scrollbar{width:12px}.qms-scrollbar::-webkit-scrollbar-track{background:rgba(0,0,0,.12);background-clip:content-box}.qms-scrollbar::-webkit-scrollbar-thumb{background:rgba(0,0,0,.38);border-radius:20px;width:4px;border:4px solid transparent;background-clip:content-box}.qms-scrollbar::-webkit-scrollbar-thumb:hover{background:rgba(0,0,0,.5);background-clip:content-box;border:4px solid transparent}.qms-scrollbar.none-scroll-bg::-webkit-scrollbar-track{background:transparent;background-clip:content-box}.qms__popup .button__close{float:right;top:-24px;right:-24px;cursor:pointer}.qms__danger button{border:none;color:#fff;padding:0;text-align:center;text-decoration:none;display:inline-block;cursor:pointer;height:20px;width:20px;font-family:Open Sans;font-size:12px;font-weight:600;font-style:normal;line-height:16px}.qms__danger .red{background-color:#9e360f;margin-left:10px}.qms__danger .yellow{background-color:#e4cf53;margin-left:10px;color:#323232}.qms__danger .green{background-color:#00804c;margin-left:10px}.confirm__button__groups{margin-top:11px}.confirm__button__groups button{min-height:36px;width:auto;font-family:Open Sans;font-weight:500;font-size:14px;letter-spacing:1px;line-height:16px;padding-left:15px;padding-right:15px;margin-right:5px;float:right}.confirm__button__groups .confirm{background:#f8f9f9}.confirm__button__groups .confirm:hover{background:#001983;color:#fff}.confirm__button__groups .confirm:disabled{cursor:not-allowed}.confirm__button__groups .cancel{background:#f8f9f9}.confirm__button__groups .cancel:hover{background:#001983;color:#fff}.qmslib__related__popup__container .input__field{display:flex;align-items:center}.qmslib__related__popup__container .input__field input{width:100%;padding:10px;outline:none;border:none;background:#eee}.qmslib__related__popup__container .input__field .mat-icon{margin-left:-30px;cursor:pointer;vertical-align:middle}.qmslib__related__popup__container .line__divider{border-bottom:1px solid #ccc;height:1px;margin-top:10px;min-width:300px;max-width:100%}.qmslib__related__popup__container .button__close{float:right;top:-24px;right:-24px;cursor:pointer}.qmslib__related__popup__container .panel__content{height:450px;overflow:auto;margin-top:12px}.qmslib__related__popup__container .panel__content_item{height:350px;overflow:auto;margin-top:12px}.qmslib__related__popup__container .panel-tree .mat-expansion-panel-body{padding:0 12px 12px}.qmslib__related__popup__container .mat-expansion-panel-header{height:30px;font-size:12px;letter-spacing:1px;font-family:Raleway;font-weight:600;padding:0}.qmslib__related__popup__container .mat-expansion-panel-header .mat-expansion-panel-header-title{align-items:center;margin-left:12px}.qmslib__related__popup__container .mat-expansion-panel-header .related_popup_toggle-btn{width:1.5rem;height:1.5rem;line-height:1.5rem}.qmslib__related__popup__container .mat-expansion-panel:not([class*=mat-elevation-z]){box-shadow:none}.qmslib__related__popup__container .panel__item{height:100px;margin-top:12px;overflow-x:hidden;overflow-y:auto;padding-right:5px;width:100%;max-width:100%;display:flex;flex-wrap:wrap;align-content:flex-start}.qmslib__related__popup__container .panel__item .related__item__inline{max-width:100%}.qmslib__related__popup__container .panel__item .select__toggle-include{width:100%}.qmslib__related__popup__container .panel__item .related__item__content{height:32px;line-height:32px;background-color:#e5e5e5;max-width:100%;margin-bottom:5px;margin-left:2.5px;margin-right:2.5px}.qmslib__related__popup__container .panel__item .related__item__content .mat-icon{color:#8e8e8e;font-size:24px}.qmslib__related__popup__container .panel__item .related__item__content span.related__item__content_name{display:inline-block;min-width:calc(100% - 13px);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:320px}.qmslib__related__popup__container .panel__item .related__item__content span.related__item__content_name .select__include-children__count{font-size:.75rem;color:rgba(0,0,0,.38)}.qmslib__related__popup__container .qmslib-related-popup-splitview{background-color:#fff;border-left:1px solid #ccc;height:450px;overflow-y:auto;margin-top:12px}.qmslib__related__popup__container .qmslib-related-popup-splitview.panel__content{height:450px;overflow:auto;margin-top:12px}.qmslib__related__popup__container .qmslib-related-popup-splitview.panel__content_item{height:350px;overflow:auto;margin-top:12px}.qmslib__related__popup__container .qmslib-related-popup-splitview .splitview-header{height:30px;font-size:12px;letter-spacing:1px;font-family:RALEWAY;font-weight:600;display:flex;align-items:center}.qmslib__related__popup__container .qmslib-related-popup-splitview .mat-checkbox.qms-group-options{padding:0}.qmslib__related__popup__container .qmslib-related-popup-splitview .mat-checkbox.qms-group-options .mat-checkbox-inner-container{margin-right:11px}.qmslib__related__popup__container .qmslib-related-popup-splitview .mat-checkbox.qms-group-options.mat-checkbox-checked{background:transparent!important}.qmslib__related__popup__container .qmslib-related-popup-splitview .expand-node{margin-left:8px;display:flex;align-items:center;min-height:40px}.qmslib__related__popup__container .qmslib-related-popup-splitview .expand-node .mat-icon{color:rgba(0,0,0,.6);margin-right:17px;min-width:-webkit-fit-content;min-width:-moz-fit-content;min-width:fit-content}.qmslib__related__popup__container .qmslib-related-popup-splitview .expand-node .mat-icon svg{display:block;min-width:-webkit-fit-content;min-width:-moz-fit-content;min-width:fit-content}cdk-virtual-scroll-viewport{overflow-x:hidden}cdk-virtual-scroll-viewport .search__module-result{margin:1.5rem;padding:0 0 .5rem}cdk-virtual-scroll-viewport .search__module-result .search__module-title{font-size:14px;font-weight:600}cdk-virtual-scroll-viewport .search__module-result .search__option{height:auto;line-height:normal;padding:8px 0;border-bottom:1px solid #e0e0e0}cdk-virtual-scroll-viewport .search__module-result .search__option .qms-list-item.mat-2-line.image-item{height:auto}cdk-virtual-scroll-viewport .search__module-result .search__option .qms-list-item-content{margin:0;border-bottom:none}cdk-virtual-scroll-viewport .search__module-result .search__option .qms-list-item-content .wrap-image.image-square{width:2.5rem;height:100%;background:transparent;align-self:center;margin-right:0}cdk-virtual-scroll-viewport .search__module-result .search__option .qms-list-item-content .wrap-image.image-square img{width:24px;height:24px}cdk-virtual-scroll-viewport .search__module-result .search__option .qms-list-item-content .material-icons-outlined.leading-icon,cdk-virtual-scroll-viewport .search__module-result .search__option .qms-list-item-content mat-icon.leading-icon{padding:4px 0 4px 4px}cdk-virtual-scroll-viewport .search__module-result .search__option .qms-list-item-content .subtitle{font-weight:400}cdk-virtual-scroll-viewport .search__module-result .search__option .qms-list-item-content .caption{overflow:hidden;line-height:normal;white-space:normal;text-overflow:ellipsis;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;padding:0;margin:0}cdk-virtual-scroll-viewport .search__module-result .search__option .qms-list-item-content .caption span.search__result__parent-name{display:inline-block;width:auto;width:calc(100% - 13px);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}cdk-virtual-scroll-viewport .search__module-result .search__option .qms-list-item-content .default-subtitle{color:rgba(0,0,0,.38)}cdk-virtual-scroll-viewport .search__module-result .search__option .qms-list-item-content .search__description-icon{margin-right:0;width:12px;height:12px;font-size:12px}cdk-virtual-scroll-viewport .search__module-result .search__option .qms-list-item-content .qms-list-text{border-bottom:none}cdk-virtual-scroll-viewport .search__module-result .search__option .qms-list-item-content .breadcrumb-containe .qms-breadcrumb-item .mat-icon{font-size:16px!important;padding-bottom:1px}cdk-virtual-scroll-viewport .search__module-result svg{display:block}#qmslib_related_popup_header_001{margin-bottom:20px;padding:0;font-weight:600;font-family:Raleway}.padding-5{padding:5px}.mat-autocomplete_related-viewport{height:100%;max-height:100%!important}.mat-autocomplete_related-viewport .cdk-virtual-scroll-content-wrapper{width:100%}.mat-autocomplete_related-viewport .related-viewport{min-height:10.25rem}"]
                 },] }
@@ -17736,7 +18130,8 @@
         function QmsBadgesComponent() {
             this.typeBadges = BadgesType;
             this.sizeCircleBadges = BadgeCircleSize;
-            this.type = BadgesType.circle;
+            this.type = '' || BadgesType.circle;
+            this.size = '' || BadgeCircleSize.small;
         }
         QmsBadgesComponent.prototype.ngOnInit = function () {
             if (this.type === BadgesType.circle) {
@@ -17748,8 +18143,8 @@
     QmsBadgesComponent.decorators = [
         { type: i0.Component, args: [{
                     selector: 'qms-badges',
-                    template: "<div\r\n  class=\"qms-badges-container badges-container-{{ color }} text-color-{{\r\n    color\r\n  }} font-size-12 line-height-22 qms-badges-default\"\r\n  *ngIf=\"type === typeBadges.default\"\r\n>\r\n  <mat-icon class=\"font-size-16\" *ngIf=\"icon\">{{ icon }}</mat-icon\r\n  >\r\n  <span *ngIf=\"contents\">{{ contents }}</span>\r\n</div>\r\n<div\r\n  *ngIf=\"type === typeBadges.circle\"\r\n  class=\"qms-badges-circle-{{ size }} badges-container-circle-{{ color }} text-color-write\"\r\n>\r\n  <span *ngIf=\"contents > 99 && size !== sizeCircleBadges.small\" class=\"font-size-8\">{{ \"99\" }}+</span>\r\n  <span *ngIf=\"contents < 100 && size !== sizeCircleBadges.small\" class=\"font-size-12\">{{ contents }}</span>\r\n</div>\r\n\r\n<div\r\n  class=\"qms-badges-container badges-container-icon-{{ color }} font-size-12 line-height-22 qms-badges-default\"\r\n  *ngIf=\"type === typeBadges.icon\"\r\n>\r\n  <mat-icon class=\"font-size-16 text-color-write\" *ngIf=\"icon\">{{ icon }}</mat-icon\r\n  >\r\n</div>\r\n",
-                    styles: ["@font-face{font-family:Open Sans;font-style:normal;font-weight:400;font-display:swap;src:url(https://fonts.gstatic.com/s/opensans/v20/mem8YaGs126MiZpBA-UFWJ0bbck.woff2) format(\"woff2\");unicode-range:U+0460-052f,U+1c80-1c88,U+20b4,U+2de0-2dff,U+a640-a69f,U+fe2e-fe2f}@font-face{font-family:Open Sans;font-style:normal;font-weight:400;font-display:swap;src:url(https://fonts.gstatic.com/s/opensans/v20/mem8YaGs126MiZpBA-UFUZ0bbck.woff2) format(\"woff2\");unicode-range:U+0400-045f,U+0490-0491,U+04b0-04b1,U+2116}@font-face{font-family:Open Sans;font-style:normal;font-weight:400;font-display:swap;src:url(https://fonts.gstatic.com/s/opensans/v20/mem8YaGs126MiZpBA-UFWZ0bbck.woff2) format(\"woff2\");unicode-range:U+1f??}@font-face{font-family:Open Sans;font-style:normal;font-weight:400;font-display:swap;src:url(https://fonts.gstatic.com/s/opensans/v20/mem8YaGs126MiZpBA-UFVp0bbck.woff2) format(\"woff2\");unicode-range:U+0370-03ff}@font-face{font-family:Open Sans;font-style:normal;font-weight:400;font-display:swap;src:url(https://fonts.gstatic.com/s/opensans/v20/mem8YaGs126MiZpBA-UFWp0bbck.woff2) format(\"woff2\");unicode-range:U+0102-0103,U+0110-0111,U+0128-0129,U+0168-0169,U+01a0-01a1,U+01af-01b0,U+1ea0-1ef9,U+20ab}@font-face{font-family:Open Sans;font-style:normal;font-weight:400;font-display:swap;src:url(https://fonts.gstatic.com/s/opensans/v20/mem8YaGs126MiZpBA-UFW50bbck.woff2) format(\"woff2\");unicode-range:U+0100-024f,U+0259,U+1e??,U+2020,U+20a0-20ab,U+20ad-20cf,U+2113,U+2c60-2c7f,U+a720-a7ff}@font-face{font-family:Open Sans;font-style:normal;font-weight:400;font-display:swap;src:url(https://fonts.gstatic.com/s/opensans/v20/mem8YaGs126MiZpBA-UFVZ0b.woff2) format(\"woff2\");unicode-range:U+00??,U+0131,U+0152-0153,U+02bb-02bc,U+02c6,U+02da,U+02dc,U+2000-206f,U+2074,U+20ac,U+2122,U+2191,U+2193,U+2212,U+2215,U+feff,U+fffd}@font-face{font-family:Raleway;font-style:normal;font-weight:400;font-display:swap;src:url(https://fonts.gstatic.com/s/raleway/v19/1Ptxg8zYS_SKggPN4iEgvnHyvveLxVvaorCFPrEHJA.woff2) format(\"woff2\");unicode-range:U+0460-052f,U+1c80-1c88,U+20b4,U+2de0-2dff,U+a640-a69f,U+fe2e-fe2f}@font-face{font-family:Raleway;font-style:normal;font-weight:400;font-display:swap;src:url(https://fonts.gstatic.com/s/raleway/v19/1Ptxg8zYS_SKggPN4iEgvnHyvveLxVvaorCMPrEHJA.woff2) format(\"woff2\");unicode-range:U+0400-045f,U+0490-0491,U+04b0-04b1,U+2116}@font-face{font-family:Raleway;font-style:normal;font-weight:400;font-display:swap;src:url(https://fonts.gstatic.com/s/raleway/v19/1Ptxg8zYS_SKggPN4iEgvnHyvveLxVvaorCHPrEHJA.woff2) format(\"woff2\");unicode-range:U+0102-0103,U+0110-0111,U+0128-0129,U+0168-0169,U+01a0-01a1,U+01af-01b0,U+1ea0-1ef9,U+20ab}@font-face{font-family:Raleway;font-style:normal;font-weight:400;font-display:swap;src:url(https://fonts.gstatic.com/s/raleway/v19/1Ptxg8zYS_SKggPN4iEgvnHyvveLxVvaorCGPrEHJA.woff2) format(\"woff2\");unicode-range:U+0100-024f,U+0259,U+1e??,U+2020,U+20a0-20ab,U+20ad-20cf,U+2113,U+2c60-2c7f,U+a720-a7ff}@font-face{font-family:Raleway;font-style:normal;font-weight:400;font-display:swap;src:url(https://fonts.gstatic.com/s/raleway/v19/1Ptxg8zYS_SKggPN4iEgvnHyvveLxVvaorCIPrE.woff2) format(\"woff2\");unicode-range:U+00??,U+0131,U+0152-0153,U+02bb-02bc,U+02c6,U+02da,U+02dc,U+2000-206f,U+2074,U+20ac,U+2122,U+2191,U+2193,U+2212,U+2215,U+feff,U+fffd}.badges-container-primary{background-color:#b7daf8}.badges-container-yellow{background-color:rgba(228,207,83,.3)}.badges-container-green{background-color:rgba(0,128,76,.1);border:#005935}.badges-container-red{background-color:rgba(176,0,32,.08)}.badges-container-orange{background-color:#faede8}.badges-container-grey{background-color:#e5e5e5}.badges-container-brown{background-color:#f0eae7}.badges-container-primary-icon{background-color:#00324e}.badges-container-icon-green{background-color:#005935}.badges-container-icon-red{background-color:#b00020}.badges-container-icon-orange{background-color:#9e360f}.badges-container-icon-brown{background-color:#59280b}.badges-container-circle-primary{background-color:#00324e}.badges-container-circle-orange{background-color:#9e360f}.text-color-primary{color:#00324e}.text-color-red{color:#b00020}.text-color-green{color:#005935}.text-color-yellow{color:#726729}.text-color-grey{color:#525252}.text-color-brown{color:#59280b}.text-color-orange{color:#9e360f}.text-color-write{color:#fff}.qms-badges-container{display:flex;align-items:center;width:100%;height:100%;font-family:Open Sans;font-style:normal;font-weight:600;font-size:12px;line-height:16px}.qms-badges-container-text{margin-top:10px;margin-bottom:10px}.qms-badges-container .margin-horizontal-17{margin-left:17px;margin-right:17px}.qms-badges-container .qms-badges-button{margin-left:auto;margin-right:8px}.qms-badges-circle-large{width:24px;height:24px}.qms-badges-circle-large,.qms-badges-circle-medium{border-radius:50%;display:flex;align-items:center;justify-content:center}.qms-badges-circle-medium{width:20px;height:20px}.qms-badges-circle-small{width:10px;height:10px;border-radius:50%}.qms-badges-circle-small,.qms-badges-default{display:flex;align-items:center;justify-content:center}.qms-badges-default{height:24px;padding:0 5px;border-radius:4px}.qms-badges-default .mat-icon{width:auto;height:auto}.font-bold{font-weight:700}.font-size-14{font-size:14px}.font-size-16{font-size:16px}.font-size-12{font-size:12px}.font-size-8{font-size:8px}.line-height-22{line-height:22px}"]
+                    template: "<div\r\n  class=\"qms-badges-container badges-container-{{ color }} text-color-{{\r\n    color\r\n  }} font-size-14 line-height-22 qms-badges-default\"\r\n  *ngIf=\"type === typeBadges.default\"\r\n>\r\n  <mat-icon class=\"font-size-16\" *ngIf=\"icon && !fontIconGG\">{{\r\n    icon\r\n  }}</mat-icon>\r\n  <mat-icon\r\n    *ngIf=\"itemIconSvg\"\r\n    class=\"mat-icon-rtl-mirror material-icons-outlined item-icon\"\r\n    [svgIcon]=\"itemIconSvg\"\r\n  ></mat-icon>\r\n  <img *ngIf=\"itemIconPath\" [src]=\"itemIconPath\" />\r\n  <span *ngIf=\"icon && fontIconGG\" class=\"{{ fontIconGG }}\">{{ icon }}</span>\r\n  <span *ngIf=\"contents\">{{ contents }}</span>\r\n</div>\r\n\r\n<div\r\n  *ngIf=\"type === typeBadges.circle\"\r\n  class=\"qms-badges-circle-{{ size }} badges-container-circle-{{\r\n    color\r\n  }} text-color-white\"\r\n>\r\n  <span\r\n    *ngIf=\"contents > 99 && size !== sizeCircleBadges.small\"\r\n    class=\"font-size-8\"\r\n  >\r\n    {{ \"99\" }}+\r\n  </span>\r\n  <span\r\n    *ngIf=\"contents < 100 && size !== sizeCircleBadges.small\"\r\n    class=\"font-size-12\"\r\n  >\r\n    {{ contents }}\r\n  </span>\r\n</div>\r\n\r\n<div\r\n  class=\"qms-badges-container badges-container-icon-{{\r\n    color\r\n  }} font-size-12 line-height-22 qms-badges-default\"\r\n  *ngIf=\"type === typeBadges.icon\"\r\n>\r\n  <mat-icon class=\"font-size-16 text-color-white\" *ngIf=\"icon && !fontIconGG\">{{\r\n    icon\r\n  }}</mat-icon>\r\n  <mat-icon\r\n    *ngIf=\"itemIconSvg\"\r\n    class=\"mat-icon-rtl-mirror material-icons-outlined item-icon\"\r\n    [svgIcon]=\"itemIconSvg\"\r\n  ></mat-icon>\r\n  <img *ngIf=\"itemIconPath\" [src]=\"itemIconPath\" />\r\n  <span *ngIf=\"fontIconGG\" class=\"text-color-white {{ fontIconGG }}\">\r\n    {{ icon }}</span\r\n  >\r\n</div>\r\n",
+                    styles: ["@font-face{font-family:Open Sans;font-style:normal;font-weight:400;font-display:swap;src:url(https://fonts.gstatic.com/s/opensans/v20/mem8YaGs126MiZpBA-UFWJ0bbck.woff2) format(\"woff2\");unicode-range:U+0460-052f,U+1c80-1c88,U+20b4,U+2de0-2dff,U+a640-a69f,U+fe2e-fe2f}@font-face{font-family:Open Sans;font-style:normal;font-weight:400;font-display:swap;src:url(https://fonts.gstatic.com/s/opensans/v20/mem8YaGs126MiZpBA-UFUZ0bbck.woff2) format(\"woff2\");unicode-range:U+0400-045f,U+0490-0491,U+04b0-04b1,U+2116}@font-face{font-family:Open Sans;font-style:normal;font-weight:400;font-display:swap;src:url(https://fonts.gstatic.com/s/opensans/v20/mem8YaGs126MiZpBA-UFWZ0bbck.woff2) format(\"woff2\");unicode-range:U+1f??}@font-face{font-family:Open Sans;font-style:normal;font-weight:400;font-display:swap;src:url(https://fonts.gstatic.com/s/opensans/v20/mem8YaGs126MiZpBA-UFVp0bbck.woff2) format(\"woff2\");unicode-range:U+0370-03ff}@font-face{font-family:Open Sans;font-style:normal;font-weight:400;font-display:swap;src:url(https://fonts.gstatic.com/s/opensans/v20/mem8YaGs126MiZpBA-UFWp0bbck.woff2) format(\"woff2\");unicode-range:U+0102-0103,U+0110-0111,U+0128-0129,U+0168-0169,U+01a0-01a1,U+01af-01b0,U+1ea0-1ef9,U+20ab}@font-face{font-family:Open Sans;font-style:normal;font-weight:400;font-display:swap;src:url(https://fonts.gstatic.com/s/opensans/v20/mem8YaGs126MiZpBA-UFW50bbck.woff2) format(\"woff2\");unicode-range:U+0100-024f,U+0259,U+1e??,U+2020,U+20a0-20ab,U+20ad-20cf,U+2113,U+2c60-2c7f,U+a720-a7ff}@font-face{font-family:Open Sans;font-style:normal;font-weight:400;font-display:swap;src:url(https://fonts.gstatic.com/s/opensans/v20/mem8YaGs126MiZpBA-UFVZ0b.woff2) format(\"woff2\");unicode-range:U+00??,U+0131,U+0152-0153,U+02bb-02bc,U+02c6,U+02da,U+02dc,U+2000-206f,U+2074,U+20ac,U+2122,U+2191,U+2193,U+2212,U+2215,U+feff,U+fffd}@font-face{font-family:Raleway;font-style:normal;font-weight:400;font-display:swap;src:url(https://fonts.gstatic.com/s/raleway/v19/1Ptxg8zYS_SKggPN4iEgvnHyvveLxVvaorCFPrEHJA.woff2) format(\"woff2\");unicode-range:U+0460-052f,U+1c80-1c88,U+20b4,U+2de0-2dff,U+a640-a69f,U+fe2e-fe2f}@font-face{font-family:Raleway;font-style:normal;font-weight:400;font-display:swap;src:url(https://fonts.gstatic.com/s/raleway/v19/1Ptxg8zYS_SKggPN4iEgvnHyvveLxVvaorCMPrEHJA.woff2) format(\"woff2\");unicode-range:U+0400-045f,U+0490-0491,U+04b0-04b1,U+2116}@font-face{font-family:Raleway;font-style:normal;font-weight:400;font-display:swap;src:url(https://fonts.gstatic.com/s/raleway/v19/1Ptxg8zYS_SKggPN4iEgvnHyvveLxVvaorCHPrEHJA.woff2) format(\"woff2\");unicode-range:U+0102-0103,U+0110-0111,U+0128-0129,U+0168-0169,U+01a0-01a1,U+01af-01b0,U+1ea0-1ef9,U+20ab}@font-face{font-family:Raleway;font-style:normal;font-weight:400;font-display:swap;src:url(https://fonts.gstatic.com/s/raleway/v19/1Ptxg8zYS_SKggPN4iEgvnHyvveLxVvaorCGPrEHJA.woff2) format(\"woff2\");unicode-range:U+0100-024f,U+0259,U+1e??,U+2020,U+20a0-20ab,U+20ad-20cf,U+2113,U+2c60-2c7f,U+a720-a7ff}@font-face{font-family:Raleway;font-style:normal;font-weight:400;font-display:swap;src:url(https://fonts.gstatic.com/s/raleway/v19/1Ptxg8zYS_SKggPN4iEgvnHyvveLxVvaorCIPrE.woff2) format(\"woff2\");unicode-range:U+00??,U+0131,U+0152-0153,U+02bb-02bc,U+02c6,U+02da,U+02dc,U+2000-206f,U+2074,U+20ac,U+2122,U+2191,U+2193,U+2212,U+2215,U+feff,U+fffd}.badges-container-primary{background-color:#b7daf8}.badges-container-yellow{background-color:rgba(228,207,83,.3)}.badges-container-green{background-color:rgba(0,128,76,.1);border:#005935}.badges-container-red{background-color:#f4e9e6}.badges-container-orange{background-color:#faede8}.badges-container-grey{background-color:#e5e5e5}.badges-container-brown{background-color:#f0eae7}.badges-container-icon-primary{background-color:#00324e}.badges-container-icon-green{background-color:#005935}.badges-container-icon-orange,.badges-container-icon-red{background-color:#9e360f}.badges-container-icon-brown{background-color:#59280b}.badges-container-icon-yellow{background-color:rgba(228,207,83,.3)}.badges-container-circle-primary{background-color:#00324e}.badges-container-circle-orange{background-color:#9e360f}.text-color-primary{color:#00324e}.text-color-red{color:#74280b}.text-color-green{color:#005935}.text-color-yellow{color:#726729}.text-color-grey{color:#525252}.text-color-brown{color:#59280b}.text-color-orange{color:#9e360f}.text-color-white{color:#fff}.qms-badges-container{display:flex;align-items:center;width:100%;height:100%;font-family:Open Sans;font-style:normal;font-weight:600;font-size:12px;line-height:16px}.qms-badges-container-text{margin-top:10px;margin-bottom:10px}.qms-badges-container .margin-horizontal-17{margin-left:17px;margin-right:17px}.qms-badges-container .qms-badges-button{margin-left:auto;margin-right:8px}.qms-badges-circle-large{width:24px;height:24px}.qms-badges-circle-large,.qms-badges-circle-medium{border-radius:50%;display:flex;align-items:center;justify-content:center}.qms-badges-circle-medium{width:20px;height:20px}.qms-badges-circle-small{width:10px;height:10px;border-radius:50%}.qms-badges-circle-small,.qms-badges-default{display:flex;align-items:center;justify-content:center}.qms-badges-default{height:24px;padding:0 6px;border-radius:4px}.qms-badges-default .mat-icon{width:auto;height:auto}.font-bold{font-weight:700}.font-size-14{font-size:14px}.font-size-16{font-size:16px}.font-size-12{font-size:12px}.font-size-8{font-size:8px}.line-height-22{line-height:22px}"]
                 },] }
     ];
     QmsBadgesComponent.propDecorators = {
@@ -17757,7 +18152,10 @@
         color: [{ type: i0.Input }],
         contents: [{ type: i0.Input }],
         size: [{ type: i0.Input }],
-        icon: [{ type: i0.Input }]
+        icon: [{ type: i0.Input }],
+        itemIconPath: [{ type: i0.Input }],
+        itemIconSvg: [{ type: i0.Input }],
+        fontIconGG: [{ type: i0.Input }]
     };
 
     var QmsBadgesModule = /** @class */ (function () {
@@ -18231,6 +18629,2261 @@
         return ISelectOneItem;
     }());
 
+    var NewTreeModel = /** @class */ (function () {
+        function NewTreeModel() {
+        }
+        return NewTreeModel;
+    }());
+
+    var NewTreeNode = /** @class */ (function () {
+        function NewTreeNode() {
+        }
+        return NewTreeNode;
+    }());
+
+    var objData = {};
+    var json = JSON;
+    function buildArrayTree(obj, level) {
+        var _this = this;
+        return Object.keys(obj).reduce(function (accumulator, key) {
+            var value = obj[key];
+            var node = new NewTreeNode();
+            var keyObj = json.parse(key);
+            node.id = keyObj["id"];
+            node.name = keyObj["name"];
+            node.parentId = keyObj["parentId"];
+            node.levelType = keyObj["levelType"];
+            node.expandable = keyObj["expandable"];
+            if (value != null) {
+                if (typeof value === 'object') {
+                    node.children = _this.buildArrayTree(value, level + 1);
+                }
+                else {
+                    node.name = value;
+                }
+            }
+            return accumulator.concat(node);
+        }, []);
+    }
+    function buildObjectTree(arr) {
+        var _this = this;
+        objData = {};
+        var objTreeData;
+        var root = arr.filter(function (x) {
+            return x.parentId === '';
+        });
+        root.forEach(function (item) {
+            objTreeData = _this.findParent(item, arr);
+        });
+        return objTreeData;
+    }
+    function findParent(item, array) {
+        if (item) {
+            var objParent_1 = {};
+            // find child
+            var childFolder = array.filter(function (x) {
+                return x.parentId === item.id && x.expandable;
+            });
+            if (childFolder.length > 0) {
+                this.findChild(item.id, objParent_1, array);
+            }
+            var items = array.filter(function (x) {
+                return x.parentId === item.id && !x.expandable;
+            });
+            items.forEach(function (item) {
+                var parentKey = {
+                    id: item.id,
+                    name: item.name,
+                    parentId: item.parentId,
+                    levelType: item.levelType,
+                    expandable: item.expandable
+                };
+                objParent_1[json.stringify(parentKey)] = null;
+            });
+            var key = {
+                id: item.id,
+                name: item.name,
+                parentId: '',
+                levelType: item.levelType,
+                expandable: item.expandable
+            };
+            // add node to tree
+            objData[json.stringify(key)] = objParent_1;
+        }
+        return objData;
+    }
+    function findChild(id, objParent, array) {
+        var _this = this;
+        var subNode = array.filter(function (x) {
+            return x.parentId === id;
+        });
+        subNode.forEach(function (item) {
+            var processNode = {};
+            if (item.expandable) {
+                _this.findChild(item.id, processNode, array);
+            }
+            var key = {
+                id: item.id,
+                name: item.name,
+                parentId: id,
+                levelType: item.levelType,
+                expandable: item.expandable
+            };
+            objParent[json.stringify(key)] = Object.assign(Object.assign({}, objParent[json.stringify(key)]), processNode);
+        });
+    }
+    var TreeFunctions = {
+        buildArrayTree: buildArrayTree,
+        buildObjectTree: buildObjectTree,
+        findParent: findParent,
+        findChild: findChild,
+    };
+
+    var NewTreeComponent = /** @class */ (function () {
+        function NewTreeComponent(cdRef, domSanitizer, iconRegistry, appIconService) {
+            var _this = this;
+            this.cdRef = cdRef;
+            this.domSanitizer = domSanitizer;
+            this.iconRegistry = iconRegistry;
+            this.appIconService = appIconService;
+            this.treeData = [];
+            this.selectedData = [];
+            this.selectedRiskData = [];
+            this.disabledList = [];
+            this.expandToChildNode = [];
+            this.selectNodeEvent = new i0.EventEmitter();
+            this.selectFolderEvent = new i0.EventEmitter();
+            this.checkBoxEvent = new i0.EventEmitter();
+            this.childCheckedEvent = new i0.EventEmitter();
+            this.nodeExpandEvent = new i0.EventEmitter();
+            this.getChildNodeSelectOne = new i0.EventEmitter();
+            this.treeControlNodes = new i0.EventEmitter();
+            this.listParentObj = {};
+            this.filterData = [];
+            this.arrIndex = [];
+            this.checkedNodeList = [];
+            this.useExpandFeature = true;
+            this.allowSelectFolder = false;
+            this.areaOfCurrentProcess = '';
+            this.showCheckBox = false;
+            this.allowMultipleCheck = true;
+            this.singleSelectedNode = false;
+            this.onlyCheckBoxForChild = false;
+            this.onlyFolder = false;
+            this.itemIconType = ItemIconType;
+            this.displayType = 1;
+            this.openIcon = '';
+            this.openIconColor = '#1954A9';
+            this.closeIcon = '';
+            this.closeIconColor = '#000000';
+            this.itemIcon = '';
+            this.itemIconSvg = '';
+            this.itemIconPath = '';
+            this.itemIconBase64 = '';
+            this.treeControl = new tree.FlatTreeControl(function (node) {
+                return node.level;
+            }, function (node) {
+                return node.expandable;
+            });
+            this.isChecked = false;
+            this.idCheckIcon = '';
+            this.listChildNode = [];
+            this.dataType = DataType$1;
+            this.transformer = function (node, level) {
+                var checkHasChild = true;
+                if (!node.children) {
+                    checkHasChild = false;
+                }
+                else if (node.expandable) {
+                    checkHasChild = false;
+                }
+                // tslint:disable-next-line:max-line-length
+                else if (!!node.children &&
+                    node.children.length &&
+                    node.children.length === 1 &&
+                    !node.children[0].name &&
+                    node.id.toString() === _this.areaOfCurrentProcess) {
+                    checkHasChild = false;
+                }
+                if (!(_this.listParentObj[node.id] === 1)) {
+                    checkHasChild = false;
+                }
+                return {
+                    expandable: node.expandable,
+                    name: node.name,
+                    level: level,
+                    id: node.id,
+                    hasChild: checkHasChild,
+                    parentId: node.parentId,
+                    disabled: false,
+                    levelType: node.levelType
+                };
+            };
+            this.treeFlattener = new tree$1.MatTreeFlattener(this.transformer, function (node) {
+                return node.level;
+            }, function (node) {
+                return node.expandable;
+            }, function (node) {
+                return node.children;
+            });
+            this.dataSource = new tree$1.MatTreeFlatDataSource(this.treeControl, this.treeFlattener);
+            this.hasChild = function (_, node) {
+                return node.expandable;
+            };
+            iconRegistry.addSvgIconLiteral('keyboard_up', domSanitizer.bypassSecurityTrustHtml(KEYBOARD_UP_ICON));
+            iconRegistry.addSvgIconLiteral('keyboard_down', domSanitizer.bypassSecurityTrustHtml(KEYBOARD_DOWN_ICON));
+            appIconService.registerProcessIcon(iconRegistry, domSanitizer);
+            appIconService.registerProcessAreaIcon(iconRegistry, domSanitizer);
+            appIconService.registerDocumentIcon(iconRegistry, domSanitizer);
+            appIconService.registerFolderIcon(iconRegistry, domSanitizer);
+            appIconService.registerDeviationIcon(iconRegistry, domSanitizer);
+            appIconService.registerChecklistIcon(iconRegistry, domSanitizer);
+            appIconService.registerRiskIcon(iconRegistry, domSanitizer);
+        }
+        NewTreeComponent.prototype.ngOnChanges = function (changes) {
+            if (changes.treeData && JSON.stringify(changes.treeData.currentValue) !== JSON.stringify(changes.treeData.previousValue)) {
+                this.treeData = __spreadArray(__spreadArray([], __read(this.treeData)), [changes.treeData.currentValue]);
+                this.initTreeData();
+            }
+            if (changes.selectedData &&
+                (changes.selectedData.currentValue.length > 0 ||
+                    JSON.stringify(changes.selectedData.currentValue) !==
+                        JSON.stringify(changes.selectedData.previousValue))) {
+                if (changes.selectedData.currentValue) {
+                    this.checkSelected(changes.selectedData.currentValue);
+                }
+                else {
+                    for (var i = 0; i < this.treeControl.dataNodes.length; i++) {
+                        this.checklistSelection.deselect(this.treeControl.dataNodes[i]);
+                    }
+                }
+            }
+            if (changes.disabledList && JSON.stringify(changes.disabledList.currentValue) !== JSON.stringify(changes.disabledList.previousValue)) {
+                this.checkDisabledList();
+            }
+            // expand all parent to show node
+            if (changes.expandToChildNode && JSON.stringify(changes.expandToChildNode.currentValue) !== JSON.stringify(changes.expandToChildNode.previousValue)) {
+                this.openExpandToChildNode();
+            }
+        };
+        NewTreeComponent.prototype.ngOnInit = function () {
+            // this.initTreeData();
+        };
+        NewTreeComponent.prototype.initTreeData = function () {
+            var _this = this;
+            var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u;
+            this.treeData.forEach(function (item) {
+                if (!!item.parentId && item.parentId.length > 0) {
+                    _this.listParentObj[item.parentId] = 1;
+                }
+                if (item.id && item.id.length > 0) {
+                    _this.listParentObj[item.parentId] = 1;
+                }
+            });
+            this.filterData = this.treeData;
+            this.treeObject = TreeFunctions.buildObjectTree(this.filterData);
+            this.dataSource.data = TreeFunctions.buildArrayTree(this.treeObject || {}, 0).map(function (element) {
+                var item = _this.sortDataTree(element);
+                element = null;
+                element = Object.assign({}, item);
+                return element;
+            });
+            this.useExpandFeature = !((_a = this.treeConfig) === null || _a === void 0 ? void 0 : _a.showCheckBox);
+            this.allowSelectFolder = (_b = this.treeConfig) === null || _b === void 0 ? void 0 : _b.allowSelectFolder;
+            this.areaOfCurrentProcess = (_c = this.treeConfig) === null || _c === void 0 ? void 0 : _c.areaOfCurrentProcess;
+            this.showCheckBox = (_d = this.treeConfig) === null || _d === void 0 ? void 0 : _d.showCheckBox;
+            this.onlyCheckBoxForChild = (_e = this.treeConfig) === null || _e === void 0 ? void 0 : _e.onlyCheckBoxForChild;
+            this.moduleId = (_f = this.treeConfig) === null || _f === void 0 ? void 0 : _f.moduleId;
+            this.openIcon = (_g = this.treeConfig) === null || _g === void 0 ? void 0 : _g.openIcon;
+            this.openIconColor = ((_h = this.treeConfig) === null || _h === void 0 ? void 0 : _h.openIconColor) ? (_j = this.treeConfig) === null || _j === void 0 ? void 0 : _j.openIconColor : this.openIconColor;
+            this.closeIcon = (_k = this.treeConfig) === null || _k === void 0 ? void 0 : _k.closeIcon;
+            this.closeIconColor = ((_l = this.treeConfig) === null || _l === void 0 ? void 0 : _l.closeIconColor) ? (_m = this.treeConfig) === null || _m === void 0 ? void 0 : _m.closeIconColor : this.closeIconColor;
+            this.itemIcon = (_o = this.treeConfig) === null || _o === void 0 ? void 0 : _o.itemIcon;
+            this.itemIconSvg = (_p = this.treeConfig) === null || _p === void 0 ? void 0 : _p.itemIconSvg;
+            this.itemIconPath = (_q = this.treeConfig) === null || _q === void 0 ? void 0 : _q.itemIconPath;
+            this.itemIconBase64 = this.domSanitizer.bypassSecurityTrustResourceUrl((_r = this.treeConfig) === null || _r === void 0 ? void 0 : _r.itemIconBase64);
+            this.allowMultipleCheck = (_s = this.treeConfig) === null || _s === void 0 ? void 0 : _s.allowMultipleCheck;
+            this.singleSelectedNode = (_t = this.treeConfig) === null || _t === void 0 ? void 0 : _t.singleSelectedNode;
+            this.onlyFolder = (_u = this.treeConfig) === null || _u === void 0 ? void 0 : _u.onlyFolder;
+            this.checklistSelection = new collections.SelectionModel(this.allowMultipleCheck); /* true: multiple */
+            this.displayType = this.getItemIconType(this.treeConfig);
+            // Expand child node tree
+            if (this.treeConfig.expandAll) {
+                this.treeControl.expandAll();
+            }
+            //Disabled node
+            if (this.disabledList.length) {
+                this.checkDisabledList();
+            }
+            if (this.selectedData.length) {
+                this.checkSelected(this.selectedData);
+            }
+            // Risk Tree
+            if (this.selectedRiskData.length) {
+                var selectedData_1 = [];
+                var _loop_1 = function (i) {
+                    this_1.selectedRiskData.forEach(function (x) {
+                        var index = selectedData_1.findIndex(function (el) { return el.id === x.rootId; });
+                        if (x.rootId === _this.treeControl.dataNodes[i].id && index < 0) {
+                            selectedData_1.push(_this.treeControl.dataNodes[i]);
+                        }
+                    });
+                };
+                var this_1 = this;
+                for (var i = 0; i < this.treeControl.dataNodes.length; i++) {
+                    _loop_1(i);
+                }
+                this.checkSelected(selectedData_1);
+                this.checkBoxEvent.emit(selectedData_1);
+            }
+            // keep expand
+            if (this.parentNodeOnClick && Object.keys(this.parentNodeOnClick).length) {
+                var tempParent = [];
+                var root = new TreeFlatNode();
+                for (var i = 0; i < this.treeControl.dataNodes.length; i++) {
+                    var tree = this.treeControl.dataNodes[i];
+                    if (this.parentNodeOnClick.parentId === tree.parentId && this.parentNodeOnClick.id === tree.id
+                        || this.parentNodeOnClick.parentId === tree.id) {
+                        tempParent = __spreadArray(__spreadArray([], __read(tempParent)), [this.getParent(tree)]);
+                        root = tree;
+                    }
+                }
+                tempParent.push(root);
+                tempParent.forEach(function (x) {
+                    _this.treeControl.expand(x);
+                });
+            }
+        };
+        NewTreeComponent.prototype.getParent = function (node) {
+            var treeControl = this.treeControl;
+            var currentLevel = treeControl.getLevel(node);
+            if (currentLevel < 1) {
+                return null;
+            }
+            var index = treeControl.dataNodes.indexOf(node) - 1;
+            for (var i = index; i >= 0; i--) {
+                var currentNode = treeControl.dataNodes[i];
+                if (treeControl.getLevel(currentNode) < currentLevel) {
+                    return currentNode;
+                }
+            }
+        };
+        NewTreeComponent.prototype.openExpandToChildNode = function () {
+            var _this = this;
+            if (this.expandToChildNode.length) {
+                if (this.expandToChildNode[0] === '') {
+                    this.idCheckIcon = '';
+                    this.treeControl.collapseAll();
+                    this.cdRef.detectChanges();
+                    return;
+                }
+                var itemMarkChecked = this.expandToChildNode[this.expandToChildNode.length - 1].toUpperCase();
+                this.idCheckIcon = itemMarkChecked;
+                // get all children nodes on same level
+                var listChildNodeSameLevel = this.findChildNode(itemMarkChecked, this.dataSource.data);
+                // get all children in all level
+                this.listChildNode = [];
+                this.getChild(listChildNodeSameLevel);
+                this.getChildNodeSelectOne.emit(this.listChildNode);
+                var _loop_2 = function (i) {
+                    if (itemMarkChecked === this_2.treeControl.dataNodes[i].id) {
+                        this_2.selectNodeEvent.emit(this_2.treeControl.dataNodes[i]);
+                    }
+                    this_2.expandToChildNode.forEach(function (el) {
+                        if (_this.treeControl.dataNodes[i].id === el.toUpperCase()) {
+                            _this.treeControl.expand(_this.treeControl.dataNodes[i]);
+                        }
+                    });
+                };
+                var this_2 = this;
+                for (var i = 0; i < this.treeControl.dataNodes.length; i++) {
+                    _loop_2(i);
+                }
+            }
+        };
+        NewTreeComponent.prototype.checkDisabledList = function () {
+            var _this = this;
+            // Disable List
+            if (this.disabledList.length) {
+                var _loop_3 = function (i) {
+                    this_3.disabledList.forEach(function (x) {
+                        var _a;
+                        if (x.id === _this.treeControl.dataNodes[i].id
+                            && (!x.parentId || x.parentId === ((_a = _this.treeControl.dataNodes[i]) === null || _a === void 0 ? void 0 : _a.parentId))) {
+                            _this.treeControl.dataNodes[i].disabled = true;
+                        }
+                    });
+                };
+                var this_3 = this;
+                for (var i = 0; i < this.treeControl.dataNodes.length; i++) {
+                    _loop_3(i);
+                }
+            }
+            //Selected node with select one
+            if (this.disabledList.length && this.treeConfig.selectOne) {
+                var itemMarkChecked = this.disabledList[this.disabledList.length - 1].toUpperCase();
+                this.idCheckIcon = itemMarkChecked;
+                // get all children nodes on same level
+                var listChildNodeSameLevel = this.findChildNode(itemMarkChecked, this.dataSource.data);
+                // get all children in all level
+                this.listChildNode = [];
+                this.getChild(listChildNodeSameLevel);
+                this.getChildNodeSelectOne.emit(this.listChildNode);
+                var _loop_4 = function (i) {
+                    if (itemMarkChecked === this_4.treeControl.dataNodes[i].id) {
+                        this_4.selectNodeEvent.emit(this_4.treeControl.dataNodes[i]);
+                    }
+                    this_4.disabledList.forEach(function (el) {
+                        if (_this.treeControl.dataNodes[i].id === el.toUpperCase()) {
+                            _this.treeControl.expand(_this.treeControl.dataNodes[i]);
+                        }
+                    });
+                    // remove all children nodes when user dont need to show them
+                    this_4.listChildNode.forEach(function (el) {
+                        var _a;
+                        if (el.id && ((_a = _this.treeControl.dataNodes[i]) === null || _a === void 0 ? void 0 : _a.id) === el.id) {
+                            _this.treeControl.dataNodes.splice(i, 1);
+                        }
+                    });
+                };
+                var this_4 = this;
+                for (var i = 0; i < this.treeControl.dataNodes.length; i++) {
+                    _loop_4(i);
+                }
+            }
+            else {
+                this.idCheckIcon = '';
+                this.treeControl.collapseAll();
+                this.cdRef.detectChanges();
+            }
+        };
+        NewTreeComponent.prototype.getChild = function (obj) {
+            for (var i = 0; i < obj.children.length; i++) {
+                if (obj.children[i].children) {
+                    this.getChild(obj.children[i]);
+                    delete obj.children[i].children;
+                    this.listChildNode.push(obj.children[i]);
+                }
+                else {
+                    this.listChildNode.push(obj.children[i]);
+                }
+            }
+        };
+        NewTreeComponent.prototype.sortDataTree = function (obj) {
+            var _this = this;
+            if (obj.children) {
+                var child_1 = [];
+                var leafNode = obj.children.filter(function (x) { return !x.children; });
+                var subFolderNode = obj.children.filter(function (x) { return x.children; });
+                // for(let index = subFolderNode.length - 1; index >= 0 ; index--){
+                //   let el = subFolderNode[index];
+                //   this.sortDataTree(el);
+                //   child.unshift(el);
+                // }
+                subFolderNode.forEach(function (element) {
+                    var el = element;
+                    _this.sortDataTree(el);
+                    child_1.push(el);
+                });
+                leafNode.forEach(function (element) {
+                    var el = element;
+                    child_1.push(el);
+                });
+                obj.children = child_1;
+            }
+            return obj;
+        };
+        NewTreeComponent.prototype.getImagePath = function () {
+            return this.domSanitizer.bypassSecurityTrustResourceUrl(this.treeConfig.itemIconBase64);
+        };
+        NewTreeComponent.prototype.checkSelected = function (itemSelected) {
+            var _this = this;
+            setTimeout(function () {
+                if (!_this.treeControl['dataNodes'])
+                    return;
+                for (var i = 0; i < _this.treeControl.dataNodes.length; i++) {
+                    var tree = _this.treeControl.dataNodes[i];
+                    _this.checklistSelection.deselect(tree);
+                    for (var j = 0; j < itemSelected.length; j++) {
+                        var element = itemSelected[j];
+                        if (tree.id.toLocaleLowerCase() === element.id.toLocaleLowerCase() && (!element.parentId || tree.parentId.toLocaleLowerCase() === element.parentId.toLocaleLowerCase())) {
+                            _this.checklistSelection.select(tree);
+                        }
+                    }
+                }
+            }, 500);
+        };
+        NewTreeComponent.prototype.checkSelectedSameNode = function (itemSelected, flag) {
+            for (var i = 0; i < this.treeControl.dataNodes.length; i++) {
+                var tree = this.treeControl.dataNodes[i];
+                for (var j = 0; j < itemSelected.length; j++) {
+                    var element = itemSelected[j];
+                    if (element.id && tree.id === element.id
+                        && tree.parentId === element.parentId && !tree.disabled) {
+                        flag ? this.checklistSelection.select(tree) : this.checklistSelection.deselect(tree);
+                    }
+                }
+            }
+        };
+        NewTreeComponent.prototype.getItemIconType = function (treeConfig) {
+            if (treeConfig.itemIcon && treeConfig.itemIcon.length)
+                return this.itemIconType.name;
+            if (treeConfig.itemIconPath && treeConfig.itemIconPath.length)
+                return this.itemIconType.path;
+            if (treeConfig.itemIconBase64 && treeConfig.itemIconBase64.length)
+                return this.itemIconType.base64;
+            if (treeConfig.itemIconSvg && treeConfig.itemIconSvg.length)
+                return this.itemIconType.svg;
+            return this.itemIconType.none;
+        };
+        /** Whether all the descendants of the node are selected */
+        NewTreeComponent.prototype.descendantsAllSelected = function (node) {
+            var _this = this;
+            var descendants = !this.singleSelectedNode ? this.treeControl.getDescendants(node).filter(function (item) { return !item.disabled; }) : [];
+            if (!descendants.length) {
+                return this.checklistSelection.isSelected(node);
+            }
+            var selected = this.checklistSelection.isSelected(node);
+            var allSelected = descendants.every(function (child) { return _this.checklistSelection.isSelected(child); });
+            if (!selected && allSelected) {
+                this.checklistSelection.select(node);
+                this.cdRef.markForCheck();
+            }
+            return allSelected;
+        };
+        /** Whether part of the descendants are selected */
+        NewTreeComponent.prototype.descendantsPartiallySelected = function (node) {
+            var _this = this;
+            var descendants = !this.singleSelectedNode ? this.treeControl.getDescendants(node).filter(function (item) { return !item.disabled; }) : [];
+            var result = descendants.some(function (child) { return _this.checklistSelection.isSelected(child); });
+            return result && !this.descendantsAllSelected(node);
+        };
+        /** Toggle the to-do item selection. Select/deselect all the descendants node */
+        NewTreeComponent.prototype.todoItemSelectionToggle = function (node) {
+            var _v, _w;
+            var _this = this;
+            switch (this.moduleId) {
+                case DataType$1.document:
+                    node.itemType = node.expandable ? DataType$1.folder : DataType$1.document;
+                    break;
+                case DataType$1.process:
+                    node.itemType = node.expandable ? DataType$1.area : DataType$1.process;
+                    break;
+                case DataType$1.checklist:
+                    node.itemType = node.expandable ? DataType$1.checklistCategory : DataType$1.checklist;
+                    break;
+                case DataType$1.deviation:
+                    node.itemType = node.expandable ? DataType$1.deviationType : DataType$1.deviation;
+                    break;
+                case DataType$1.risk:
+                    node.itemType = node.expandable ? DataType$1.riskFolder : DataType$1.risk;
+                    break;
+            }
+            this.selectNodeEvent.emit(node);
+            // tree have duplicate node
+            if (this.treeConfig.canHaveDupId) {
+                for (var i = 0; i < this.treeControl.dataNodes.length; i++) {
+                    if (this.treeControl.dataNodes[i].id === node.id
+                        && this.treeControl.dataNodes[i].parentId === node.parentId
+                        && !this.treeControl.dataNodes[i].disabled) {
+                        this.checklistSelection.toggle(this.treeControl.dataNodes[i]);
+                    }
+                }
+            }
+            else {
+                this.checklistSelection.toggle(node);
+            }
+            // process/ document single selected
+            if (this.singleSelectedNode) {
+                this.checkBoxEvent.emit(this.checklistSelection.selected);
+            }
+            else {
+                var descendants = this.treeControl.getDescendants(node).filter(function (item) { return !item.disabled; });
+                this.checkSelectedSameNode(descendants, this.descendantsAllSelected(node));
+                !this.descendantsAllSelected(node)
+                    ? (_v = this.checklistSelection).select.apply(_v, __spreadArray([], __read(descendants))) : (_w = this.checklistSelection).deselect.apply(_w, __spreadArray([], __read(descendants)));
+                this.cdRef.markForCheck();
+                var allNodeIsParent = this.checklistSelection.selected.every(function (child) { return child.expandable; });
+                if (allNodeIsParent) {
+                    this.checklistSelection.selected.forEach(function (element) {
+                        _this.checklistSelection.deselect(element);
+                    });
+                }
+                this.checkBoxEvent.emit(this.checklistSelection.selected);
+            }
+        };
+        NewTreeComponent.prototype.todoChildSelectionToggle = function (node) {
+            for (var i = 0; i < this.treeControl.dataNodes.length; i++) {
+                if (this.treeControl.dataNodes[i].id === node.id
+                    && this.treeControl.dataNodes[i].parentId === node.parentId
+                    && !this.treeControl.dataNodes[i].disabled) {
+                    this.checklistSelection.toggle(this.treeControl.dataNodes[i]);
+                }
+            }
+            // this.checklistSelection.toggle(node);
+            this.cdRef.markForCheck();
+            this.checkBoxEvent.emit(this.checklistSelection.selected);
+        };
+        NewTreeComponent.prototype.todoItemSelection = function (nodes) {
+            var _this = this;
+            nodes.forEach(function (node) {
+                for (var i = 0; i < _this.treeControl.dataNodes.length; i++) {
+                    if (_this.treeControl.dataNodes[i].id === node.id &&
+                        _this.treeControl.dataNodes[i].parentId === node.parentId &&
+                        !_this.treeControl.dataNodes[i].disabled && !_this.treeControl.dataNodes[i].expandable) {
+                        if (!_this.checklistSelection.isSelected(_this.treeControl.dataNodes[i]))
+                            _this.checklistSelection.toggle(_this.treeControl.dataNodes[i]);
+                    }
+                }
+            });
+            this.checkBoxEvent.emit(this.checklistSelection.selected);
+        };
+        NewTreeComponent.prototype.todoItemSelectionProcessDocument = function (nodes) {
+            var _this = this;
+            nodes.forEach(function (node) {
+                for (var i = 0; i < _this.treeControl.dataNodes.length; i++) {
+                    if (_this.treeControl.dataNodes[i].id === node.id &&
+                        _this.treeControl.dataNodes[i].parentId === node.parentId &&
+                        !_this.treeControl.dataNodes[i].disabled && !_this.treeControl.dataNodes[i].expandable) {
+                        if (!_this.checklistSelection.isSelected(_this.treeControl.dataNodes[i]))
+                            _this.checklistSelection.toggle(_this.treeControl.dataNodes[i]);
+                    }
+                }
+            });
+            setTimeout(function () {
+                _this.checkBoxEvent.emit(_this.checklistSelection.selected);
+                _this.treeControlNodes.emit(_this.treeControl);
+            }, 500);
+        };
+        NewTreeComponent.prototype.todoFolderSelection = function (nodes) {
+            var _this = this;
+            nodes.forEach(function (node) {
+                for (var i = 0; i < _this.treeControl.dataNodes.length; i++) {
+                    if (_this.treeControl.dataNodes[i].id === node.id &&
+                        _this.treeControl.dataNodes[i].parentId === node.parentId &&
+                        !_this.treeControl.dataNodes[i].disabled && _this.treeControl.dataNodes[i].expandable) {
+                        if (!_this.checklistSelection.isSelected(_this.treeControl.dataNodes[i]))
+                            _this.todoItemSelectionToggle(_this.treeControl.dataNodes[i]);
+                    }
+                }
+            });
+            this.checkBoxEvent.emit(this.checklistSelection.selected);
+        };
+        NewTreeComponent.prototype.selectNode = function (node) {
+            if (window[RelatedConst$1.IS_DISPLAY_SEARCH_RESULT]) {
+                window.postMessage(RelatedConst$1.HIDE_SEARCH_RESULT, '*');
+            }
+            if (this.treeConfig.selectOne) {
+                node.itemType = this.checkDataTypeSelectNode(node);
+                this.idCheckIcon = node.id;
+                this.selectNodeEvent.emit(node);
+            }
+        };
+        NewTreeComponent.prototype.checkDataTypeSelectNode = function (node) {
+            var itemType = -1;
+            switch (this.moduleId) {
+                case DataType$1.process:
+                    itemType = node.expandable ? DataType$1.area : DataType$1.process;
+                    break;
+                case DataType$1.document:
+                    itemType = node.expandable ? DataType$1.folder : DataType$1.document;
+                    break;
+                default:
+                    itemType = this.moduleId;
+                    break;
+            }
+            return itemType;
+        };
+        NewTreeComponent.prototype.selectFolder = function (node) {
+            this.selectFolderEvent.emit(node);
+        };
+        NewTreeComponent.prototype.onExpandNode = function (node, isExpandNode) {
+            var _this = this;
+            if (isExpandNode) {
+                this.nodeExpandEvent.emit(node);
+            }
+            if (this.treeConfig.selectOne) {
+                this.idCheckIcon = node.id;
+                node.itemType = this.checkDataTypeSelectNode(node);
+                this.selectNodeEvent.emit(node);
+            }
+            if (window[RelatedConst$1.IS_DISPLAY_SEARCH_RESULT]) {
+                window.postMessage(RelatedConst$1.HIDE_SEARCH_RESULT, '*');
+            }
+            // set useExpandFeature = true to improve performance of tree loading
+            if (!isExpandNode || !this.useExpandFeature) {
+                for (var i = 0; i < this.arrIndex.length; i++) {
+                    if (this.arrIndex[i] === node.id) {
+                        this.arrIndex.splice(i, 1);
+                    }
+                }
+                return;
+            }
+            // get array index to expand node after refresh datasource
+            var index = 0;
+            var isChange = false;
+            var isRemove = false;
+            this.arrIndex.push(node.id);
+            var childArray = this.treeData.filter(function (x) {
+                return x.parentId === node.id;
+            });
+            var rootId = '0';
+            var parentElement;
+            var childrenList;
+            if (childArray.length === 0) {
+                return;
+            }
+            childArray.forEach(function (item) {
+                if (item.parentId === rootId) {
+                    return;
+                }
+                // get child node from original datasource
+                var child = _this.getChildNode(item.parentId, childArray);
+                rootId = item.parentId;
+                index = _this.getNodeIndex(child.id, undefined, _this.dataSource['_treeControl'].dataNodes);
+                if (index > -1) {
+                    return;
+                }
+                // add child node to expand node
+                parentElement = _this.findChildNode(node.id, _this.dataSource.data);
+                if (parentElement) {
+                    // temporary remove all node without children => purpose to add node folder first
+                    if (!isRemove) {
+                        childrenList = __spreadArray([], __read(parentElement.children));
+                        _this.removeChildren(parentElement);
+                        isRemove = true;
+                    }
+                    // add node folder first
+                    parentElement.children.push(child);
+                    isChange = true;
+                }
+            });
+            // add node without children again
+            if (isRemove) {
+                this.addChildren(parentElement, childrenList);
+            }
+            // refresh data and expand tree node from root node
+            if (isChange) {
+                this.refreshTreeData();
+                this.arrIndex.forEach(function (item) {
+                    index = _this.getNodeIndex(item, undefined, _this.dataSource['_treeControl'].dataNodes);
+                    _this.treeControl.expand(_this.treeControl.dataNodes[index]);
+                });
+                isChange = false;
+            }
+        };
+        NewTreeComponent.prototype.removeChildren = function (parentElement) {
+            if (parentElement.children) {
+                parentElement.children.length = 0;
+            }
+        };
+        NewTreeComponent.prototype.addChildren = function (parentElement, childrenList) {
+            if (childrenList) {
+                childrenList.forEach(function (e) {
+                    parentElement.children.push(e);
+                });
+            }
+        };
+        NewTreeComponent.prototype.getNodeIndex = function (id, level, data) {
+            if (level) {
+                return data.findIndex(function (x) {
+                    return x.id === id && x.level === level;
+                });
+            }
+            return data.findIndex(function (x) {
+                return x.id === id;
+            });
+        };
+        NewTreeComponent.prototype.getChildNode = function (rootId, data) {
+            var childArray = data.filter(function (x) {
+                return x.rootId === rootId;
+            });
+            var child = { id: childArray[0].rootId, name: childArray[0].subName, children: [] };
+            childArray.forEach(function (item) {
+                child.children.push({ id: item.childId, name: item.childName, parentId: rootId, expandable: false });
+            });
+            return child;
+        };
+        NewTreeComponent.prototype.findChildNode = function (id, data) {
+            var e_1, _v, e_2, _w;
+            try {
+                // eslint-disable-next-line no-restricted-syntax
+                for (var data_1 = __values(data), data_1_1 = data_1.next(); !data_1_1.done; data_1_1 = data_1.next()) {
+                    var currentFather = data_1_1.value;
+                    if (currentFather.id === id) {
+                        return currentFather;
+                    }
+                    if (currentFather.children) {
+                        var currentChild = currentFather.children.find(function (x) {
+                            return x.id === id;
+                        });
+                        if (currentChild) {
+                            return currentChild;
+                        }
+                        try {
+                            // eslint-disable-next-line no-restricted-syntax
+                            for (var _x = (e_2 = void 0, __values(currentFather.children)), _y = _x.next(); !_y.done; _y = _x.next()) {
+                                var currentChild1 = _y.value;
+                                if (id !== currentChild1.id) {
+                                    var result = this.findChildNode(id, currentFather.children);
+                                    if (result !== false) {
+                                        return result;
+                                    }
+                                }
+                            }
+                        }
+                        catch (e_2_1) { e_2 = { error: e_2_1 }; }
+                        finally {
+                            try {
+                                if (_y && !_y.done && (_w = _x.return)) _w.call(_x);
+                            }
+                            finally { if (e_2) throw e_2.error; }
+                        }
+                    }
+                }
+            }
+            catch (e_1_1) { e_1 = { error: e_1_1 }; }
+            finally {
+                try {
+                    if (data_1_1 && !data_1_1.done && (_v = data_1.return)) _v.call(data_1);
+                }
+                finally { if (e_1) throw e_1.error; }
+            }
+            return false;
+        };
+        NewTreeComponent.prototype.refreshTreeData = function () {
+            var data = this.dataSource.data;
+            this.dataSource.data = [];
+            this.dataSource.data = data;
+        };
+        NewTreeComponent.prototype.getNodeIcon = function (node) {
+            if (this.openIcon && this.closeIcon) {
+                return this.treeControl.isExpanded(node) ? this.openIcon : this.closeIcon;
+            }
+            switch (this.moduleId) {
+                case DataType$1.document: {
+                    var nodeData = this.treeData.filter(function (x) { return x.id === node.id; });
+                    if (nodeData.length > 0) {
+                        switch (nodeData[0].levelType) {
+                            case DocumentNodeType$1.DepartmentFolder:
+                                return this.treeControl.isExpanded(node) ? 'department_folder_outlined' : 'department_folder';
+                            case DocumentNodeType$1.RegionalFolder:
+                                return this.treeControl.isExpanded(node) ? 'regional_folder_outlined' : 'regional_folder';
+                            case DocumentNodeType$1.TopFolder:
+                                return this.treeControl.isExpanded(node) ? 'enterprise_folder_outlined' : 'enterprise_folder';
+                            case DocumentNodeType$1.Folder:
+                                return this.treeControl.isExpanded(node) ? 'local_folder_outlined' : 'local_folder';
+                            default:
+                                return this.treeControl.isExpanded(node) ? 'folder_outlined' : 'folder';
+                        }
+                    }
+                    return this.treeControl.isExpanded(node) ? 'folder_outlined' : 'folder';
+                }
+                case DataType$1.process:
+                    return this.treeControl.isExpanded(node) ? 'process_area_outlined' : 'process_area';
+                default:
+                    return this.treeControl.isExpanded(node) ? 'keyboard_up' : 'keyboard_down';
+            }
+        };
+        NewTreeComponent.prototype.getItemIcon = function (node) {
+            switch (this.moduleId) {
+                case DataType$1.document:
+                    var parent = this.treeData.filter(function (x) { return x.id === node.parentId; });
+                    if (parent.length > 0) {
+                        switch (parent[0].levelType) {
+                            case DocumentNodeType$1.DepartmentFolder:
+                                return 'document_department';
+                            case DocumentNodeType$1.RegionalFolder:
+                                return 'document_regional';
+                            case DocumentNodeType$1.TopFolder:
+                                return 'document_enterprise';
+                            case DocumentNodeType$1.Folder:
+                                return 'document_local';
+                            default:
+                                return 'document';
+                        }
+                    }
+                    return 'document';
+                case DataType$1.process:
+                    return 'process';
+                case DataType$1.checklist:
+                    return 'checklist';
+                case DataType$1.deviation:
+                    return 'deviation';
+                case DataType$1.risk:
+                    return 'risk';
+                default:
+                    return 'document';
+            }
+        };
+        NewTreeComponent.prototype.getNodeId = function (node) {
+            return "_" + (node.parentId ? node.parentId : '') + "_" + node.id + "_" + node.level;
+        };
+        NewTreeComponent.prototype.getNodeByIdAndParentId = function (nodeId, parentId) {
+            return this.treeControl.dataNodes.find(function (x) {
+                return x.id === nodeId && x.parentId === parentId;
+            });
+        };
+        NewTreeComponent.prototype.expandNode = function (node) {
+            this.treeControl.expand(node);
+        };
+        return NewTreeComponent;
+    }());
+    NewTreeComponent.decorators = [
+        { type: i0.Component, args: [{
+                    selector: 'qms-tree-new',
+                    template: "<mat-tree\r\n  [dataSource]=\"dataSource\"\r\n  [treeControl]=\"treeControl\"\r\n  class=\"tree__container\"\r\n>\r\n  <mat-tree-node\r\n    class=\"tree-branch\"\r\n    *matTreeNodeDef=\"let node\"\r\n    matTreeNodeToggle\r\n    matTreeNodePadding\r\n  >\r\n    <!-- form thu 1 - child -->\r\n    <mat-checkbox\r\n      qms-group-options\r\n      [disabled]=\"node.disabled\"\r\n      color=\"default\"\r\n      *ngIf=\"node.name && showCheckBox && !onlyCheckBoxForChild && !onlyFolder\"\r\n      class=\"checklist-leaf-node\"\r\n      [checked]=\"checklistSelection.isSelected(node)\"\r\n      (change)=\"todoItemSelectionToggle(node)\"\r\n    >\r\n    </mat-checkbox>\r\n\r\n    <!-- form thu 2 -->\r\n    <mat-checkbox\r\n      qms-group-options\r\n      [disabled]=\"node.disabled\"\r\n      color=\"default\"\r\n      *ngIf=\"node.name && showCheckBox && onlyCheckBoxForChild && !onlyFolder\"\r\n      class=\"ml-10 checklist-leaf-node\"\r\n      [checked]=\"checklistSelection.isSelected(node)\"\r\n      (change)=\"todoItemSelectionToggle(node)\"\r\n    ></mat-checkbox>\r\n    <div\r\n      class=\"expand-node\"\r\n      *ngIf=\"node.name && !onlyFolder\"\r\n      [class.bgSelected]=\"treeConfig.selectOne && idCheckIcon == node.id\"\r\n      (click)=\"selectNode(node)\"\r\n      [id]=\"getNodeId(node)\"\r\n    >\r\n      <div class=\"expand-node__text\">\r\n        <mat-icon\r\n          *ngIf=\"displayType === itemIconType.name && !onlyCheckBoxForChild\"\r\n          class=\"mat-icon-rtl-mirror material-icons-outlined\"\r\n        >\r\n          {{ itemIcon }}\r\n        </mat-icon>\r\n\r\n        <mat-icon\r\n          *ngIf=\"displayType === itemIconType.svg && !onlyCheckBoxForChild\"\r\n          class=\"mat-icon-rtl-mirror material-icons-outlined\"\r\n          [svgIcon]=\"itemIconSvg\"\r\n        >\r\n        </mat-icon>\r\n\r\n        <img\r\n          *ngIf=\"displayType === itemIconType.path && !onlyCheckBoxForChild\"\r\n          class=\"mat-icon\"\r\n          [src]=\"itemIconPath\"\r\n        />\r\n\r\n        <img\r\n          *ngIf=\"displayType === itemIconType.base64 && !onlyCheckBoxForChild\"\r\n          class=\"mat-icon image-base64\"\r\n          [src]=\"getImagePath()\"\r\n        />\r\n\r\n        <mat-icon\r\n          *ngIf=\"displayType === itemIconType.none && !onlyCheckBoxForChild\"\r\n          class=\"mat-icon-rtl-mirror material-icons-outlined\"\r\n          [svgIcon]=\"getItemIcon(node)\"\r\n        ></mat-icon>\r\n        <span class=\"text-node\">{{ node.name }}</span>\r\n      </div>\r\n      <mat-icon\r\n        class=\"icon-check\"\r\n        *ngIf=\"treeConfig.selectOne && idCheckIcon == node.id\"\r\n        >done</mat-icon\r\n      >\r\n    </div>\r\n  </mat-tree-node>\r\n\r\n  <mat-tree-node *matTreeNodeDef=\"let node; when: hasChild\" matTreeNodePadding>\r\n    <!-- form thu 1 - parent -->\r\n    <mat-checkbox\r\n      qms-group-options\r\n      [disabled]=\"node.disabled\"\r\n      color=\"default\"\r\n      *ngIf=\"node.name && showCheckBox && !onlyCheckBoxForChild\"\r\n      [checked]=\"descendantsAllSelected(node)\"\r\n      [indeterminate]=\"descendantsPartiallySelected(node)\"\r\n      (change)=\"todoItemSelectionToggle(node)\"\r\n    ></mat-checkbox>\r\n    <button\r\n      class=\"button-boder\"\r\n      mat-icon-button\r\n      matTreeNodeToggle\r\n      [disableRipple]=\"!node.hasChild\"\r\n      [attr.aria-label]=\"'toggle ' + node.filename\"\r\n      *ngIf=\"node.name\"\r\n      (click)=\"onExpandNode(node, treeControl.isExpanded(node))\"\r\n    >\r\n      <mat-icon\r\n        *ngIf=\"openIcon && closeIcon\"\r\n        class=\"mat-icon-rtl-mirror\"\r\n        [ngStyle]=\"{\r\n          color: treeControl.isExpanded(node) ? openIconColor : closeIconColor\r\n        }\"\r\n        >{{ getNodeIcon(node) }}</mat-icon\r\n      >\r\n      <mat-icon\r\n        *ngIf=\"!openIcon || !closeIcon\"\r\n        class=\"mat-icon-rtl-mirror\"\r\n        [ngClass]=\"{\r\n          'open-icon': treeControl.isExpanded(node),\r\n          'not-department-icon': moduleId !== dataType.document\r\n        }\"\r\n        [svgIcon]=\"getNodeIcon(node)\"\r\n      >\r\n      </mat-icon>\r\n    </button>\r\n    <span\r\n      *ngIf=\"expandOnTitleClick\"\r\n      matTreeNodeToggle\r\n      class=\"text-node-parent\"\r\n      style=\"cursor: pointer\"\r\n      (click)=\"onExpandNode(node, treeControl.isExpanded(node))\"\r\n      [ngStyle]=\"{\r\n        color: treeControl.isExpanded(node) ? openIconColor : '#000000'\r\n      }\"\r\n    >\r\n      <span>{{ node.name }}</span>\r\n      <mat-icon\r\n        class=\"icon-check\"\r\n        *ngIf=\"treeConfig.selectOne && idCheckIcon == node.id\"\r\n        >done</mat-icon\r\n      >\r\n    </span>\r\n    <span\r\n      *ngIf=\"!expandOnTitleClick\"\r\n      class=\"text-node-parent\"\r\n      (click)=\"selectFolder(node)\"\r\n      style=\"cursor: pointer\"\r\n      [id]=\"getNodeId(node)\"\r\n    >\r\n      <span>{{ node.name }}</span>\r\n      <mat-icon\r\n        class=\"icon-check\"\r\n        *ngIf=\"treeConfig.selectOne && idCheckIcon == node.id\"\r\n        >done</mat-icon\r\n      >\r\n    </span>\r\n  </mat-tree-node>\r\n</mat-tree>\r\n",
+                    encapsulation: i0.ViewEncapsulation.None,
+                    styles: ["@font-face{font-family:Open Sans;font-style:normal;font-weight:400;font-display:swap;src:url(https://fonts.gstatic.com/s/opensans/v20/mem8YaGs126MiZpBA-UFWJ0bbck.woff2) format(\"woff2\");unicode-range:U+0460-052f,U+1c80-1c88,U+20b4,U+2de0-2dff,U+a640-a69f,U+fe2e-fe2f}@font-face{font-family:Open Sans;font-style:normal;font-weight:400;font-display:swap;src:url(https://fonts.gstatic.com/s/opensans/v20/mem8YaGs126MiZpBA-UFUZ0bbck.woff2) format(\"woff2\");unicode-range:U+0400-045f,U+0490-0491,U+04b0-04b1,U+2116}@font-face{font-family:Open Sans;font-style:normal;font-weight:400;font-display:swap;src:url(https://fonts.gstatic.com/s/opensans/v20/mem8YaGs126MiZpBA-UFWZ0bbck.woff2) format(\"woff2\");unicode-range:U+1f??}@font-face{font-family:Open Sans;font-style:normal;font-weight:400;font-display:swap;src:url(https://fonts.gstatic.com/s/opensans/v20/mem8YaGs126MiZpBA-UFVp0bbck.woff2) format(\"woff2\");unicode-range:U+0370-03ff}@font-face{font-family:Open Sans;font-style:normal;font-weight:400;font-display:swap;src:url(https://fonts.gstatic.com/s/opensans/v20/mem8YaGs126MiZpBA-UFWp0bbck.woff2) format(\"woff2\");unicode-range:U+0102-0103,U+0110-0111,U+0128-0129,U+0168-0169,U+01a0-01a1,U+01af-01b0,U+1ea0-1ef9,U+20ab}@font-face{font-family:Open Sans;font-style:normal;font-weight:400;font-display:swap;src:url(https://fonts.gstatic.com/s/opensans/v20/mem8YaGs126MiZpBA-UFW50bbck.woff2) format(\"woff2\");unicode-range:U+0100-024f,U+0259,U+1e??,U+2020,U+20a0-20ab,U+20ad-20cf,U+2113,U+2c60-2c7f,U+a720-a7ff}@font-face{font-family:Open Sans;font-style:normal;font-weight:400;font-display:swap;src:url(https://fonts.gstatic.com/s/opensans/v20/mem8YaGs126MiZpBA-UFVZ0b.woff2) format(\"woff2\");unicode-range:U+00??,U+0131,U+0152-0153,U+02bb-02bc,U+02c6,U+02da,U+02dc,U+2000-206f,U+2074,U+20ac,U+2122,U+2191,U+2193,U+2212,U+2215,U+feff,U+fffd}@font-face{font-family:Raleway;font-style:normal;font-weight:400;font-display:swap;src:url(https://fonts.gstatic.com/s/raleway/v19/1Ptxg8zYS_SKggPN4iEgvnHyvveLxVvaorCFPrEHJA.woff2) format(\"woff2\");unicode-range:U+0460-052f,U+1c80-1c88,U+20b4,U+2de0-2dff,U+a640-a69f,U+fe2e-fe2f}@font-face{font-family:Raleway;font-style:normal;font-weight:400;font-display:swap;src:url(https://fonts.gstatic.com/s/raleway/v19/1Ptxg8zYS_SKggPN4iEgvnHyvveLxVvaorCMPrEHJA.woff2) format(\"woff2\");unicode-range:U+0400-045f,U+0490-0491,U+04b0-04b1,U+2116}@font-face{font-family:Raleway;font-style:normal;font-weight:400;font-display:swap;src:url(https://fonts.gstatic.com/s/raleway/v19/1Ptxg8zYS_SKggPN4iEgvnHyvveLxVvaorCHPrEHJA.woff2) format(\"woff2\");unicode-range:U+0102-0103,U+0110-0111,U+0128-0129,U+0168-0169,U+01a0-01a1,U+01af-01b0,U+1ea0-1ef9,U+20ab}@font-face{font-family:Raleway;font-style:normal;font-weight:400;font-display:swap;src:url(https://fonts.gstatic.com/s/raleway/v19/1Ptxg8zYS_SKggPN4iEgvnHyvveLxVvaorCGPrEHJA.woff2) format(\"woff2\");unicode-range:U+0100-024f,U+0259,U+1e??,U+2020,U+20a0-20ab,U+20ad-20cf,U+2113,U+2c60-2c7f,U+a720-a7ff}@font-face{font-family:Raleway;font-style:normal;font-weight:400;font-display:swap;src:url(https://fonts.gstatic.com/s/raleway/v19/1Ptxg8zYS_SKggPN4iEgvnHyvveLxVvaorCIPrE.woff2) format(\"woff2\");unicode-range:U+00??,U+0131,U+0152-0153,U+02bb-02bc,U+02c6,U+02da,U+02dc,U+2000-206f,U+2074,U+20ac,U+2122,U+2191,U+2193,U+2212,U+2215,U+feff,U+fffd}.tree__container{font-family:Open Sans;font-style:normal;font-weight:400;font-size:.875rem;line-height:19px;color:#323232}.tree__container .mat-tree-node{color:#000;min-height:0}.tree__container .mat-tree-node .mat-checkbox.qms-group-options{padding:0}.tree__container .mat-tree-node .mat-checkbox.qms-group-options .mat-checkbox-inner-container{margin-right:11px}.tree__container .button{margin-left:6px}.tree__container .button:focus,.tree__container .button:hover{background-color:#009ef2;border-radius:2px;width:auto}.tree__container .button-boder:focus,.tree__container .button:focus{outline:0}.tree__container .button-folder-boder:focus{outline:0}.tree__container .button-folder-boder:focus,.tree__container .button-folder-boder:hover{background-color:#009ef2;border-radius:2px;width:auto}.tree__container .expand-node{margin-left:8px;min-height:32px;justify-content:space-between;width:100%}.tree__container .expand-node,.tree__container .expand-node .expand-node__text{display:flex;align-items:center}.tree__container .expand-node .mat-icon{color:rgba(0,0,0,.6);margin-right:17px;min-width:-webkit-fit-content;min-width:-moz-fit-content;min-width:fit-content}.tree__container .expand-node .mat-icon svg{display:block;min-width:-webkit-fit-content;min-width:-moz-fit-content;min-width:fit-content}.tree__container .expand-node.bgSelected .icon-check{color:#1954a9}.tree__container .text-node-parent{width:100%;display:flex;align-items:center;justify-content:space-between;margin-left:10px;cursor:pointer}.tree__container .text-node-parent.active-item{color:#1954a9!important}.tree__container .text-node-parent.bgSelected .icon-check{color:#1954a9}.tree__container .mr-11{margin-right:11px}.tree__container .ml-10{margin-left:10px}.tree__container .tree-branch:hover{background-color:#e5eefb}.tree__container .image-base64{width:20px;height:20px}.tree__container .mat-checkbox.qms-group-options.mat-checkbox-checked{background:transparent!important}::ng-deep .mat-tree .mat-checkbox.qms-group-options{padding:0}::ng-deep .mat-tree .mat-checkbox.qms-group-options.mat-checkbox-checked{background-color:transparent}::ng-deep .mat-tree .mat-checkbox.qms-group-options .mat-checkbox-inner-container{margin-right:0}svg{display:block;min-width:-webkit-fit-content;min-width:-moz-fit-content;min-width:fit-content}.open-icon.not-department-icon svg path,.open-icon svg path:first-child{fill:#1954a9}"]
+                },] }
+    ];
+    NewTreeComponent.ctorParameters = function () { return [
+        { type: i0.ChangeDetectorRef },
+        { type: platformBrowser.DomSanitizer },
+        { type: icon.MatIconRegistry },
+        { type: QMSIconRegistryService }
+    ]; };
+    NewTreeComponent.propDecorators = {
+        treeData: [{ type: i0.Input }],
+        treeConfig: [{ type: i0.Input }],
+        selectedData: [{ type: i0.Input }],
+        selectedRiskData: [{ type: i0.Input }],
+        disabledList: [{ type: i0.Input }],
+        expandOnTitleClick: [{ type: i0.Input }],
+        expandToChildNode: [{ type: i0.Input }],
+        parentNodeOnClick: [{ type: i0.Input }],
+        selectNodeEvent: [{ type: i0.Output }],
+        selectFolderEvent: [{ type: i0.Output }],
+        checkBoxEvent: [{ type: i0.Output }],
+        childCheckedEvent: [{ type: i0.Output }],
+        nodeExpandEvent: [{ type: i0.Output }],
+        getChildNodeSelectOne: [{ type: i0.Output }],
+        treeControlNodes: [{ type: i0.Output }]
+    };
+
+    var QMSNewTreeModule = /** @class */ (function () {
+        function QMSNewTreeModule() {
+        }
+        return QMSNewTreeModule;
+    }());
+    QMSNewTreeModule.decorators = [
+        { type: i0.NgModule, args: [{
+                    declarations: [
+                        NewTreeComponent,
+                    ],
+                    imports: [
+                        common.CommonModule,
+                        tree$1.MatTreeModule,
+                        formField.MatFormFieldModule,
+                        icon.MatIconModule,
+                        button.MatButtonModule,
+                        checkbox.MatCheckboxModule,
+                        autocomplete.MatAutocompleteModule,
+                        forms.ReactiveFormsModule,
+                        scrolling.ScrollingModule,
+                        card.MatCardModule,
+                        sidenav.MatSidenavModule,
+                        list.MatListModule,
+                        SharedMaterialModule,
+                        QMSListModule,
+                        QmsAngularModule,
+                        QMSBreadcrumbModule,
+                        QMSAppIconModule
+                    ],
+                    exports: [
+                        NewTreeComponent,
+                    ]
+                },] }
+    ];
+
+    var SelectProcessDocumentPopupData = /** @class */ (function () {
+        function SelectProcessDocumentPopupData() {
+            this.moduleId = 0;
+            this.moduleName = '';
+            this.treeData1 = [];
+            this.treeData2 = [];
+            this.selectedNode = [];
+            this.disabledList = [];
+            this.disabledList2 = [];
+            this.splitView = false;
+        }
+        return SelectProcessDocumentPopupData;
+    }());
+
+    var QMSProcessDocumentItem = /** @class */ (function () {
+        function QMSProcessDocumentItem() {
+        }
+        return QMSProcessDocumentItem;
+    }());
+
+    var QMSSelectProcessDocumentGlobalService = /** @class */ (function () {
+        function QMSSelectProcessDocumentGlobalService() {
+            this.searchRelated = new rxjs.BehaviorSubject([]);
+            this.splitViewValue = new rxjs.BehaviorSubject([]);
+            this.getProcessAreaChildren = new rxjs.BehaviorSubject([]);
+            this.getFolderChildren = new rxjs.BehaviorSubject([]);
+        }
+        QMSSelectProcessDocumentGlobalService.prototype.setSearchRelated = function (result) {
+            this.searchRelated.next(result);
+        };
+        QMSSelectProcessDocumentGlobalService.prototype.setSplitviewValue = function (result) {
+            this.splitViewValue.next(result);
+        };
+        QMSSelectProcessDocumentGlobalService.prototype.setProcessAreaChildren = function (result) {
+            this.getProcessAreaChildren.next(result);
+        };
+        QMSSelectProcessDocumentGlobalService.prototype.setFolderChildren = function (result) {
+            this.getFolderChildren.next(result);
+        };
+        return QMSSelectProcessDocumentGlobalService;
+    }());
+    QMSSelectProcessDocumentGlobalService.ɵprov = i0__namespace.ɵɵdefineInjectable({ factory: function QMSSelectProcessDocumentGlobalService_Factory() { return new QMSSelectProcessDocumentGlobalService(); }, token: QMSSelectProcessDocumentGlobalService, providedIn: "root" });
+    QMSSelectProcessDocumentGlobalService.decorators = [
+        { type: i0.Injectable, args: [{ providedIn: 'root' },] }
+    ];
+    QMSSelectProcessDocumentGlobalService.ctorParameters = function () { return []; };
+
+    var SelectProcessDocumentPopupComponent = /** @class */ (function () {
+        function SelectProcessDocumentPopupComponent(cdRef, translate, dialogRef, globalService, iconRegistry, sanitizer, appIconService, elem, data) {
+            this.cdRef = cdRef;
+            this.translate = translate;
+            this.dialogRef = dialogRef;
+            this.globalService = globalService;
+            this.iconRegistry = iconRegistry;
+            this.sanitizer = sanitizer;
+            this.appIconService = appIconService;
+            this.elem = elem;
+            this.data = data;
+            this.ngUnsubscribe = new rxjs.Subject();
+            this.moduleId = 0;
+            this.moduleName = '';
+            this.treeData1 = [];
+            this.treeData2 = [];
+            this.checkedNodeList = [];
+            this.selectedNode = [];
+            this.selectedData = [];
+            this.selectedData2 = [];
+            this.commonCheckedList = [];
+            this.documentCheckedList = [];
+            this.singleProcessList = [];
+            this.singleDocumentList = [];
+            this.module = exports.ModuleType;
+            this.dataType = exports.DataType;
+            this.itemType = 0;
+            this.selectedRiskData = [];
+            this.disabledList = [];
+            this.disabledList2 = [];
+            this.isDocumentExpanded = true;
+            this.isCommonExpanded = true;
+            this.singleSelectedNode = false;
+            this.searchOrder = [];
+            this.myControl = new forms.FormControl();
+            this.filteredOptions = [];
+            this.isInputValue = false;
+            this.itemInSplitview = [];
+            this.selectedFolder = null;
+            this.splitViewTitle = null;
+            this.listChildrenSelectOne = [];
+            this.onSearch = new i0.EventEmitter();
+            this.onSelectFolderItem = new i0.EventEmitter();
+            this.onExpandProcessArea = new i0.EventEmitter();
+            this.onExpandFolder = new i0.EventEmitter();
+            this.parentNodeSelected = new TreeFlatNode();
+            this.moduleId = data.moduleId;
+            this.moduleName = data.moduleName;
+            this.treeData1 = data.treeData1;
+            this.treeData2 = data.treeData2;
+            this.treeConfig1 = data.treeConfig1;
+            this.treeConfig2 = data.treeConfig2;
+            this.selectedRiskData = (data === null || data === void 0 ? void 0 : data.selectedNode) || [];
+            this.singleSelectedNode = data.treeConfig1.singleSelectedNode;
+            this.disabledList = data.disabledList || [];
+            this.disabledList2 = data.disabledList2 || [];
+            this.splitView = data.splitView;
+            this.isSelectOne = data.isSelectOne;
+            this.canOnlySelectItem = data.canOnlySelectItem;
+            appIconService.registerProcessIcon(iconRegistry, sanitizer);
+            appIconService.registerProcessAreaIcon(iconRegistry, sanitizer);
+            appIconService.registerDocumentIcon(iconRegistry, sanitizer);
+            appIconService.registerFolderIcon(iconRegistry, sanitizer);
+        }
+        SelectProcessDocumentPopupComponent.prototype.ngOnDestroy = function () {
+            this.ngUnsubscribe.next();
+            this.ngUnsubscribe.complete();
+            this.globalService.setSearchRelated([]);
+            this.selectedFolder = null;
+            this.globalService.setSplitviewValue([]);
+        };
+        SelectProcessDocumentPopupComponent.prototype.onMessage = function (event) {
+            if (event.data === RelatedConst.HIDE_SEARCH_RESULT) {
+                // this.autoComplete.closePanel();
+            }
+        };
+        SelectProcessDocumentPopupComponent.prototype.ngOnInit = function () {
+            var _this = this;
+            this.translate.getLanguageSubject$.pipe().subscribe(function (res) {
+                if (res) {
+                    _this.LANG = _this.translate.getObjectLang(res);
+                }
+            });
+            this.globalService.searchRelated.pipe(operators.takeUntil(this.ngUnsubscribe)).subscribe(function (res) {
+                if (res && res.length) {
+                    _this.filteredOptions = res;
+                }
+            });
+            this.globalService.splitViewValue.pipe(operators.takeUntil(this.ngUnsubscribe)).subscribe(function (res) {
+                _this.itemInSplitview = res;
+                if (res.length) {
+                    var listNodeProcess_1 = [];
+                    var listNodeDocs_1 = [];
+                    res.forEach(function (item) {
+                        var newNodeProcess = new NewTreeModel();
+                        newNodeProcess.id = item.id;
+                        newNodeProcess.name = item.itemName;
+                        newNodeProcess.displayId = +item.itemNumberId;
+                        newNodeProcess.parentId = item.parentId;
+                        newNodeProcess.statusId = item.status;
+                        if (item.itemType === exports.DataType.process) {
+                            listNodeProcess_1.push(newNodeProcess);
+                        }
+                        else {
+                            var newNodeDocs = new NewTreeModel();
+                            newNodeDocs.statusName = item.statusName;
+                            listNodeDocs_1.push(newNodeDocs);
+                        }
+                    });
+                    if (_this.checkedNodeList.length) {
+                        _this.selectedData = [];
+                        _this.selectedData2 = [];
+                        var selectProcess_1 = [];
+                        var selectDocument_1 = [];
+                        _this.checkedNodeList.forEach(function (x) {
+                            var newNode = {
+                                disabled: false,
+                                expandable: (x.itemType == exports.DataType.area || x.itemType == exports.DataType.folder) ? true : false,
+                                hasChild: (x.itemType == exports.DataType.area || x.itemType == exports.DataType.folder) ? true : false,
+                                id: x.id,
+                                level: 0,
+                                levelType: undefined,
+                                name: x.itemName,
+                                parentId: x.parentId
+                            };
+                            if (x.itemType === exports.DataType.area || x.itemType === exports.DataType.process) {
+                                _this.treeData1.forEach(function (item) {
+                                    if (item.id && x.id === item.id) {
+                                        selectProcess_1.push(newNode);
+                                    }
+                                });
+                            }
+                            else {
+                                _this.treeData2.forEach(function (item) {
+                                    if (item.id && x.id === item.id) {
+                                        selectDocument_1.push(newNode);
+                                    }
+                                });
+                            }
+                        });
+                        _this.selectedData = __spreadArray(__spreadArray([], __read(_this.selectedData)), __read(selectProcess_1));
+                        _this.selectedData2 = __spreadArray(__spreadArray([], __read(_this.selectedData2)), __read(selectDocument_1));
+                    }
+                }
+            });
+            this.myControl.valueChanges.pipe(operators.debounceTime(1000)).subscribe(function (val) {
+                _this.isInputValue = true;
+                _this.onSearchRelated(val);
+            });
+            this.globalService.getProcessAreaChildren.pipe(operators.takeUntil(this.ngUnsubscribe)).subscribe(function (res) {
+                if (res.length > 0 && _this.dataTrees) {
+                    var notShownChildren_1 = [];
+                    res.forEach(function (x) {
+                        var index = _this.treeData1.findIndex(function (item) { return item.id === x.id && item.parentId === x.parentId && x.expandable == item.expandable; });
+                        if (index < 0) {
+                            notShownChildren_1.push(x);
+                        }
+                    });
+                    _this.treeData1 = __spreadArray(__spreadArray([], __read(_this.treeData1)), __read(notShownChildren_1));
+                }
+            });
+            this.globalService.getFolderChildren.pipe(operators.takeUntil(this.ngUnsubscribe)).subscribe(function (res) {
+                if (res.length > 0 && _this.dataTrees) {
+                    var notShownChildren_2 = [];
+                    res.forEach(function (x) {
+                        var index = _this.treeData2.findIndex(function (item) { return item.id === x.id && item.parentId === x.parentId && x.expandable == item.expandable; });
+                        if (index < 0) {
+                            notShownChildren_2.push(x);
+                        }
+                    });
+                    _this.treeData2 = __spreadArray(__spreadArray([], __read(_this.treeData2)), __read(notShownChildren_2));
+                }
+            });
+            this.itemType = this.dataType.process;
+            this.searchOrder = this.getSearchOrder();
+        };
+        SelectProcessDocumentPopupComponent.prototype.ngAfterViewChecked = function () {
+        };
+        SelectProcessDocumentPopupComponent.prototype.removeCheckedNodeList = function (item) {
+            var _this = this;
+            this.selectedData = [];
+            this.selectedData2 = [];
+            this.checkedNodeList = this.checkedNodeList.filter(function (x) { return (x.id.toLowerCase() !== item.id.toLowerCase() || x.parentId.toLowerCase() !== item.parentId.toLowerCase()); });
+            var tempArr = [];
+            var tempArrDocument = [];
+            var newSelectProcessList = [];
+            var newSelectDocumentList = [];
+            this.commonCheckedList.forEach(function (element) {
+                _this.checkedNodeList.forEach(function (x) {
+                    if (element.id.toLowerCase() === x.id.toLowerCase() && element.parentId.toLowerCase() === x.parentId.toLowerCase()) {
+                        tempArr.push(element);
+                    }
+                });
+            });
+            this.singleProcessList.forEach(function (element) {
+                _this.checkedNodeList.forEach(function (x) {
+                    if (element.id.toLowerCase() === x.id.toLowerCase() && element.parentId.toLowerCase() === x.parentId.toLowerCase()) {
+                        newSelectProcessList.push(element);
+                    }
+                });
+            });
+            this.singleProcessList = newSelectProcessList;
+            if (tempArr.length > 0) {
+                this.selectedData = __spreadArray([], __read(tempArr));
+            }
+            this.documentCheckedList.forEach(function (element) {
+                _this.checkedNodeList.forEach(function (x) {
+                    if (element.id.toLowerCase() === x.id.toLowerCase() && element.parentId.toLowerCase() === x.parentId.toLowerCase()) {
+                        tempArrDocument.push(element);
+                    }
+                });
+            });
+            this.singleDocumentList.forEach(function (element) {
+                _this.checkedNodeList.forEach(function (x) {
+                    if (element.id.toLowerCase() === x.id.toLowerCase() && element.parentId.toLowerCase() === x.parentId.toLowerCase()) {
+                        newSelectDocumentList.push(element);
+                    }
+                });
+            });
+            this.singleDocumentList = newSelectDocumentList;
+            if (tempArrDocument.length > 0) {
+                this.selectedData2 = __spreadArray([], __read(tempArrDocument));
+            }
+        };
+        SelectProcessDocumentPopupComponent.prototype.setResultHeight = function (arr) {
+            var maxHeight = 484;
+            var popup_content = document.getElementsByClassName('qmslib_related_popup_content')[0];
+            var line__divider = document.getElementsByClassName('line__divider')[0];
+            if (popup_content && line__divider) {
+                maxHeight = this.getOffsetHeight(popup_content, true) + this.getOffsetHeight(line__divider, true) * 2;
+            }
+            var contentResult = document.getElementsByClassName('cdk-virtual-scroll-content-wrapper')[0];
+            var viewreports = document.getElementsByClassName('related-viewport')[0];
+            if (viewreports) {
+                if (contentResult.offsetHeight <= maxHeight) {
+                    viewreports.style.height = contentResult.offsetHeight + "px";
+                }
+                else {
+                    viewreports.style.height = maxHeight + "px";
+                }
+            }
+        };
+        SelectProcessDocumentPopupComponent.prototype.onSearchRelated = function (_val) {
+            this.filteredOptions = [];
+            if (typeof (_val) === 'object') {
+                this.myControl.setValue('');
+                this.isInputValue = false;
+            }
+            else if (typeof (_val) === 'string') {
+                if (!!_val) {
+                    this.onSearch.emit(_val);
+                }
+            }
+        };
+        SelectProcessDocumentPopupComponent.prototype.getModuleFilteredOptions = function (moduleId) {
+            if (this.listChildrenSelectOne.length) {
+                for (var index = 0; index < this.listChildrenSelectOne.length; index++) {
+                    var firstEl = this.listChildrenSelectOne[index];
+                    for (var j = 0; j < this.filteredOptions.length; j++) {
+                        var secondEl = this.filteredOptions[j];
+                        if (firstEl.id === secondEl.id) {
+                            this.filteredOptions.splice(j, 1);
+                        }
+                    }
+                }
+            }
+            return this.filteredOptions.filter(function (x) { return x.itemType === moduleId; });
+        };
+        SelectProcessDocumentPopupComponent.prototype.showSearchResult = function () {
+            // this.autoComplete.openPanel();
+        };
+        SelectProcessDocumentPopupComponent.prototype.displayRelated = function (related) {
+            return related ? related.itemName : undefined;
+        };
+        SelectProcessDocumentPopupComponent.prototype.selectRelated = function (item) {
+            var _this = this;
+            var index = -1;
+            this.selectedNode = [];
+            if (this.treeConfig1.showCheckBox) {
+                index = this.checkedNodeList.findIndex(function (x) {
+                    return x.id === item.id && x.parentId === item.parentId;
+                });
+            }
+            if (index < 0) {
+                var position = -1;
+                var node = void 0;
+                var typeId = void 0;
+                if (item.itemType === this.dataType.document) {
+                    // document  
+                    var isExistInDisabled = this.disabledList2.findIndex(function (x) {
+                        return x.id && x.id.toLowerCase() === item.id.toLowerCase();
+                    });
+                    if (isExistInDisabled >= 0) {
+                        return;
+                    }
+                    position = this.treeData2.findIndex(function (x) {
+                        return x.id === item.id && x.parentId === item.parentId && !x.expandable;
+                    });
+                    if (position >= 0) {
+                        this.addToChecklistNodeAndSelectedData(item);
+                        node = this.treeData2[position];
+                        typeId = this.dataType.document;
+                        var treeNode = {
+                            id: node.childId,
+                            name: node.childName,
+                            children: [],
+                            parentId: node.rootId,
+                            expandable: false
+                        };
+                        this.dataTrees.toArray()[1].todoItemSelectionProcessDocument([treeNode]);
+                    }
+                    else {
+                        this.addNodeToTree(item);
+                        this.addToChecklistNodeAndSelectedData(item);
+                        setTimeout(function () {
+                            var treeNode = {
+                                id: item.id,
+                                name: item.itemName,
+                                children: [],
+                                parentId: item.parentId,
+                                expandable: false
+                            };
+                            _this.dataTrees.toArray()[1].todoItemSelectionProcessDocument([treeNode]);
+                        }, 500);
+                    }
+                }
+                else if (item.itemType === this.dataType.folder) {
+                    position = this.treeData2.findIndex(function (x) {
+                        return x.id.toLowerCase() === item.id.toLowerCase() && (!item.parentId || x.parentId.toLowerCase() === item.parentId.toLowerCase());
+                    });
+                    typeId = item.itemType;
+                    if (position >= 0) {
+                        node = this.treeData2[position];
+                        var treeNode = {
+                            id: node.id,
+                            name: node.name,
+                            children: [],
+                            parentId: node.parentId,
+                            expandable: true,
+                        };
+                        this.dataTrees.toArray()[1].todoFolderSelection([treeNode]);
+                    }
+                    else {
+                        this.addNodeToTree(item);
+                        this.addToChecklistNodeAndSelectedData(item);
+                    }
+                    return;
+                }
+                else if (item.itemType === this.dataType.area) {
+                    position = this.treeData1.findIndex(function (x) {
+                        return x.id.toLowerCase() === item.id.toLowerCase() && (!item.parentId || x.parentId.toLowerCase() === item.parentId.toLowerCase()) && x.expandable;
+                    });
+                    typeId = item.itemType;
+                    if (position >= 0) {
+                        node = this.treeData1[position];
+                        var treeNode = {
+                            id: node.id,
+                            name: node.name,
+                            children: [],
+                            parentId: node.parentId,
+                            expandable: true
+                        };
+                        this.dataTrees.toArray()[0].todoFolderSelection([treeNode]);
+                    }
+                    else {
+                        this.addNodeToTree(item);
+                        this.addToChecklistNodeAndSelectedData(item);
+                    }
+                    return;
+                }
+                else {
+                    var isExistInDisabled = this.disabledList.findIndex(function (x) {
+                        return x.id.toLowerCase() === item.id.toLowerCase() && (!item.parentId || x.parentId.toLowerCase() === item.parentId.toLowerCase());
+                    });
+                    if (isExistInDisabled >= 0) {
+                        return;
+                    }
+                    position = this.treeData1.findIndex(function (x) {
+                        return x.id.toLowerCase() === item.id.toLowerCase() && x.parentId.toLowerCase() === item.parentId.toLowerCase() && !x.expandable;
+                    });
+                    if (position >= 0) {
+                        node = this.treeData1[position];
+                        typeId = this.itemType;
+                        var treeNode = {
+                            id: node.childId,
+                            name: node.childName,
+                            children: [],
+                            parentId: node.rootId,
+                            expandable: false
+                        };
+                        this.addToChecklistNodeAndSelectedData(item);
+                        this.dataTrees.toArray()[0].todoItemSelectionProcessDocument([treeNode]);
+                    }
+                    else {
+                        this.addNodeToTree(item);
+                        this.addToChecklistNodeAndSelectedData(item);
+                        setTimeout(function () {
+                            var treeNode = {
+                                id: item.id,
+                                name: item.itemName,
+                                children: [],
+                                parentId: item.parentId,
+                                expandable: false
+                            };
+                            _this.dataTrees.toArray()[0].todoItemSelectionProcessDocument([treeNode]);
+                        }, 500);
+                    }
+                }
+            }
+        };
+        SelectProcessDocumentPopupComponent.prototype.addNodeToTree = function (item) {
+            var newNodeDocs = new NewTreeModel();
+            newNodeDocs.id = item.id;
+            newNodeDocs.name = item.itemName;
+            newNodeDocs.parentId = item.parentId;
+            newNodeDocs.statusId = item === null || item === void 0 ? void 0 : item['itemStatus'];
+            newNodeDocs.statusName = item === null || item === void 0 ? void 0 : item['statusName'];
+            newNodeDocs.displayId = +item.itemNumberId;
+            newNodeDocs.expandable = item.itemType == exports.DataType.folder || item.itemType == exports.DataType.area ? true : false;
+            if (item.itemType == exports.DataType.folder || item.itemType == exports.DataType.document) {
+                if (this.treeData2.findIndex(function (x) { return x.id.toLowerCase() === newNodeDocs.id.toLowerCase() &&
+                    (!newNodeDocs.parentId || x.parentId.toLowerCase() === newNodeDocs.parentId.toLowerCase()) && x.expandable === newNodeDocs.expandable; }) >= 0) {
+                    this.treeData2 = __spreadArray(__spreadArray([], __read(this.treeData2)), [newNodeDocs]);
+                }
+            }
+            else {
+                if (this.treeData1.findIndex(function (x) { return x.id.toLowerCase() === newNodeDocs.id.toLowerCase() &&
+                    (!newNodeDocs.parentId || x.parentId.toLowerCase() === newNodeDocs.parentId.toLowerCase()) && x.expandable === newNodeDocs.expandable; }) >= 0) {
+                    this.treeData1 = __spreadArray(__spreadArray([], __read(this.treeData1)), [newNodeDocs]);
+                }
+            }
+        };
+        SelectProcessDocumentPopupComponent.prototype.addToChecklistNode = function (item) {
+            var newNodeDocs = new NewTreeModel();
+            newNodeDocs.id = item.id;
+            newNodeDocs.name = item.itemName;
+            newNodeDocs.parentId = item.parentId;
+            newNodeDocs.statusId = item === null || item === void 0 ? void 0 : item['itemStatus'];
+            newNodeDocs.statusName = item === null || item === void 0 ? void 0 : item['statusName'];
+            newNodeDocs.displayId = +item.itemNumberId;
+            newNodeDocs.expandable = item.itemType == exports.DataType.folder || item.itemType == exports.DataType.area ? true : false;
+            if (this.isSelectOne) {
+                this.checkedNodeList = [];
+                this.documentCheckedList = [];
+                this.commonCheckedList = [];
+            }
+            var index = this.checkedNodeList.findIndex(function (x) { return x.id.toLowerCase() === newNodeDocs.id.toLowerCase() &&
+                (!newNodeDocs.parentId || x.parentId.toLowerCase() === newNodeDocs.parentId.toLowerCase()) && x.expandable === newNodeDocs.expandable; });
+            if (index < 0) {
+                if (item.itemType == exports.DataType.folder || item.itemType == exports.DataType.document) {
+                    this.documentCheckedList.push({
+                        id: newNodeDocs.id,
+                        name: newNodeDocs.name,
+                        itemType: item.itemType,
+                        parentId: newNodeDocs.parentId,
+                        levelType: newNodeDocs.levelType,
+                        level: 0,
+                        disabled: false,
+                        expandable: newNodeDocs.expandable,
+                        hasChild: newNodeDocs.expandable
+                    });
+                }
+                else {
+                    this.commonCheckedList.push({
+                        id: newNodeDocs.id,
+                        name: newNodeDocs.name,
+                        itemType: item.itemType,
+                        parentId: newNodeDocs.parentId,
+                        levelType: newNodeDocs.levelType,
+                        level: 0,
+                        disabled: false,
+                        expandable: newNodeDocs.expandable,
+                        hasChild: newNodeDocs.expandable
+                    });
+                }
+                this.checkedNodeList.push({
+                    moduleId: this.moduleId,
+                    id: item.id,
+                    itemName: newNodeDocs.name,
+                    itemType: item.itemType,
+                    parentId: newNodeDocs.parentId,
+                    parentName: item.parentName,
+                    itemNumberId: item.itemNumberId,
+                    levelType: item.levelType,
+                    expandable: newNodeDocs.expandable,
+                    statusName: item.statusName,
+                    status: item.status,
+                    displayId: Number.parseFloat(item.itemNumberId)
+                });
+            }
+        };
+        SelectProcessDocumentPopupComponent.prototype.addSelectedData = function (item) {
+            var _this = this;
+            var selectProcess = [];
+            var selectDocument = [];
+            this.selectedData = [];
+            this.selectedData2 = [];
+            if (this.checkedNodeList.length) {
+                this.checkedNodeList.forEach(function (x) {
+                    var node = {
+                        disabled: false,
+                        expandable: x.itemType == exports.DataType.area || x.itemType == exports.DataType.folder ? true : false,
+                        hasChild: x.itemType == exports.DataType.area || x.itemType == exports.DataType.folder ? true : false,
+                        id: x.id,
+                        level: 0,
+                        levelType: undefined,
+                        name: x.itemName,
+                        parentId: x.parentId
+                    };
+                    if (x.itemType === exports.DataType.area || x.itemType === exports.DataType.process) {
+                        _this.treeData1.forEach(function (item) {
+                            if (item.id && x.id.toLowerCase() === item.id.toLowerCase() &&
+                                (!x.parentId || x.parentId.toLowerCase() === item.parentId.toLowerCase())) {
+                                selectProcess.push(node);
+                            }
+                        });
+                    }
+                    else {
+                        _this.treeData2.forEach(function (item) {
+                            if (item.id && x.id.toLowerCase() === item.id.toLowerCase() &&
+                                (!x.parentId || x.parentId.toLowerCase() === item.parentId.toLowerCase())) {
+                                selectDocument.push(node);
+                            }
+                        });
+                    }
+                });
+            }
+            if (!this.isSelectOne) {
+                this.selectedData = __spreadArray(__spreadArray([], __read(this.selectedData)), __read(selectProcess));
+                this.selectedData2 = __spreadArray(__spreadArray([], __read(this.selectedData2)), __read(selectDocument));
+            }
+            if (item.itemType === exports.DataType.folder || item.itemType === exports.DataType.document) {
+                if (this.selectedData2.findIndex(function (x) { return x.id.toLowerCase() === item.id.toLowerCase() &&
+                    (!item.parentId || x.parentId.toLowerCase() === item.parentId.toLowerCase()) && x.expandable === item.expandable; }) < 0) {
+                    this.selectedData2 = __spreadArray(__spreadArray([], __read(this.selectedData2)), [item]);
+                }
+            }
+            else {
+                if (this.selectedData.findIndex(function (x) { return x.id.toLowerCase() === item.id.toLowerCase() &&
+                    (!item.parentId || x.parentId.toLowerCase() === item.parentId.toLowerCase()) && x.expandable === item.expandable; }) < 0) {
+                    this.selectedData = __spreadArray(__spreadArray([], __read(this.selectedData)), [item]);
+                }
+            }
+        };
+        SelectProcessDocumentPopupComponent.prototype.addToChecklistNodeAndSelectedData = function (item) {
+            this.addToChecklistNode(item);
+            this.addSelectedData({
+                id: item.id,
+                name: item.itemName,
+                expandable: item.itemType == exports.DataType.area || item.itemType == exports.DataType.folder,
+                level: 0,
+                disabled: false,
+                hasChild: item.itemType == exports.DataType.area || item.itemType == exports.DataType.folder,
+            });
+        };
+        SelectProcessDocumentPopupComponent.prototype.setTypeProcess = function (expand) {
+            return expand ? this.dataType.area : this.dataType.process;
+        };
+        SelectProcessDocumentPopupComponent.prototype.onCloseClick = function () {
+            this.selectedFolder = null;
+            this.itemInSplitview = [];
+            this.dialogRef.close();
+        };
+        ;
+        SelectProcessDocumentPopupComponent.prototype.onAddClick = function () {
+            // if (this.treeConfig1.showCheckBox) {
+            this.selectedFolder = null;
+            this.itemInSplitview = [];
+            this.dialogRef.close(this.checkedNodeList);
+        };
+        SelectProcessDocumentPopupComponent.prototype.getStatusName = function (id) {
+            var statusName = '';
+            this.treeData2.forEach(function (x) {
+                if (id.toString() === x.id) {
+                    statusName = x.statusName;
+                }
+            });
+            return statusName;
+        };
+        SelectProcessDocumentPopupComponent.prototype.selectTreeControlNodeDocument = function (treeNodes) {
+            this.treeControlNodeDocument = null;
+            this.treeControlNodeDocument = treeNodes;
+            this.treeControlNodeDocument.dataNodes = this.treeControlNodeDocument.dataNodes.filter(function (x) { return x.name !== null && x.name !== ''; });
+        };
+        SelectProcessDocumentPopupComponent.prototype.selectTreeControlNodeProcess = function (treeNodes) {
+            this.treeControlNodeProcess = null;
+            this.treeControlNodeProcess = treeNodes;
+            this.treeControlNodeProcess.dataNodes = this.treeControlNodeProcess.dataNodes.filter(function (x) { return x.name !== null && x.name !== ''; });
+        };
+        SelectProcessDocumentPopupComponent.prototype.getStatusDocs = function (id) {
+            return this.treeData2.filter(function (x) { return x.id === id; })[0].statusId;
+        };
+        SelectProcessDocumentPopupComponent.prototype.getStatusProcess = function (id) {
+            return this.treeData1.filter(function (x) { return x.id === id; })[0].statusId;
+        };
+        SelectProcessDocumentPopupComponent.prototype.getOffsetHeight = function (element, includeMargin) {
+            var elmHeight = 0, elmMargin = 0;
+            elmHeight = element.offsetHeight;
+            if (includeMargin) {
+                var style = window.getComputedStyle(element);
+                elmMargin = parseFloat(style.marginTop.replace('px', '')) + parseFloat(style.marginBottom.replace('px', ''));
+            }
+            return (elmHeight + elmMargin);
+        };
+        SelectProcessDocumentPopupComponent.prototype.getItemChipName = function (item) {
+            return item.itemName;
+        };
+        SelectProcessDocumentPopupComponent.prototype.isEllipsisActive = function (e) {
+            return e ? (e.clientWidth < e.scrollWidth) : false;
+        };
+        SelectProcessDocumentPopupComponent.prototype.getNodeIcon = function (item) {
+            switch (item.itemType) {
+                case exports.DataType.folder: {
+                    switch (item.levelType) {
+                        case exports.DocumentNodeType.DepartmentFolder:
+                            return 'department_folder_outlined';
+                        case exports.DocumentNodeType.RegionalFolder:
+                            return 'regional_folder_outlined';
+                        case exports.DocumentNodeType.TopFolder:
+                            return 'enterprise_folder_outlined';
+                        case exports.DocumentNodeType.Folder:
+                            return 'local_folder_outlined';
+                        default:
+                            return 'folder_outlined';
+                    }
+                }
+                case exports.DataType.document: {
+                    switch (item.levelType) {
+                        case exports.DocumentNodeType.DepartmentFolder:
+                            return 'document_department';
+                        case exports.DocumentNodeType.RegionalFolder:
+                            return 'document_regional';
+                        case exports.DocumentNodeType.TopFolder:
+                            return 'document_enterprise';
+                        case exports.DocumentNodeType.Folder:
+                            return 'document_local';
+                        default:
+                            return 'document';
+                    }
+                }
+                case exports.DataType.area:
+                    return 'process_area_outlined';
+                case exports.DataType.process:
+                    return 'process';
+                default:
+                    return 'folder_outlined';
+            }
+        };
+        SelectProcessDocumentPopupComponent.prototype.getSearchOrder = function () {
+            var _this = this;
+            var searchTypes = Object.keys(this.dataType)
+                .map(function (key) { return ({ value: _this.dataType[key], key: key }); });
+            searchTypes = searchTypes.slice(searchTypes.length / 2);
+            return searchTypes;
+        };
+        SelectProcessDocumentPopupComponent.prototype.getTitle = function (type) {
+            switch (type) {
+                case exports.DataType.process:
+                    return this.LANG.PROCESSES;
+                case exports.DataType.area:
+                    return this.LANG.PROCESS_AREA;
+                case exports.DataType.document:
+                    return this.LANG.DOCUMENTS;
+                case exports.DataType.folder:
+                    return this.LANG.FOLDER;
+            }
+        };
+        SelectProcessDocumentPopupComponent.prototype.getItemId = function (item) {
+            if (item.itemType === this.dataType.process) {
+                return this.LANG.PROCESS_ID + ": " + item.itemNumberId + "; " + item.statusName;
+            }
+            else if (item.itemType === this.dataType.document) {
+                return this.LANG.DOCUMENT_ID + ": " + item.itemNumberId + "; " + item.statusName;
+            }
+            return null;
+        };
+        SelectProcessDocumentPopupComponent.prototype.toggleSelectItem = function (node) {
+            var selectedNode = this.checkedNodeList.find(function (x) { return (x.id.toLowerCase() === node.id.toLowerCase() && x.parentId.toLowerCase() === node.parentId.toLowerCase()); });
+            if (selectedNode) {
+                this.removeCheckedNodeList({
+                    id: selectedNode.id,
+                    itemName: node.itemName,
+                    parentId: selectedNode.parentId,
+                    expandable: false,
+                    itemType: selectedNode.itemType,
+                    moduleId: this.moduleId,
+                    itemNumberId: selectedNode.itemNumberId
+                });
+            }
+            else {
+                this.selectRelated(node);
+            }
+        };
+        SelectProcessDocumentPopupComponent.prototype.isNodeSelected = function (node) {
+            return this.checkedNodeList.filter(function (x) { return (x.id.toLowerCase() === node.id.toLowerCase() && x.parentId.toLowerCase() === node.parentId.toLowerCase()); }).length > 0;
+        };
+        SelectProcessDocumentPopupComponent.prototype.getChildrenOfFolder = function (node, type) {
+            var item = new QMSProcessDocumentItem();
+            item.id = node.id;
+            item.itemType = type;
+            item.itemName = node.name;
+            item.levelType = node.levelType;
+            this.selectedFolder = node;
+            this.parentNodeSelected = new TreeFlatNode();
+            this.parentNodeSelected = Object.assign({}, node);
+            if (item.itemType == exports.DataType.area)
+                this.onExpandProcessArea.emit(item);
+            else
+                this.onExpandFolder.emit(item);
+        };
+        SelectProcessDocumentPopupComponent.prototype.canShowSearchOption = function (moduleId) {
+            return this.getModuleFilteredOptions(moduleId).length > 0;
+        };
+        SelectProcessDocumentPopupComponent.prototype.selectNodeTreeEvent = function (node) {
+            if (!node.itemType) {
+                return;
+            }
+            var index = this.checkedNodeList.findIndex(function (x) { return x.id.toLowerCase() === node.id.toLowerCase()
+                && (!node.parentId || x.parentId.toLowerCase() === node.parentId.toLowerCase()) && x.itemType == node.itemType; });
+            if (index >= 0) {
+                this.removeCheckedNodeList({
+                    id: node.id,
+                    itemName: node.name,
+                    parentId: node.parentId,
+                    expandable: false,
+                    itemType: node.itemType,
+                    moduleId: this.moduleId,
+                    itemNumberId: node.id
+                });
+                return;
+            }
+            else {
+                var item = void 0;
+                var status = 0;
+                var statusName = '';
+                if (node.itemType == exports.DataType.folder || node.itemType == exports.DataType.document) {
+                    item = this.treeData2.find(function (x) { return x.id.toLowerCase() === node.id.toLowerCase()
+                        && (!node.parentId || x.parentId.toLowerCase() === node.parentId.toLowerCase()) && x.expandable == node.expandable; });
+                }
+                else {
+                    item = this.treeData1.find(function (x) { return x.id.toLowerCase() === node.id.toLowerCase()
+                        && (!node.parentId || x.parentId.toLowerCase() === node.parentId.toLowerCase()) && x.expandable == node.expandable; });
+                }
+                if (item) {
+                    statusName = item.statusName;
+                    status = item.statusId;
+                }
+                this.addToChecklistNode({
+                    id: node.id,
+                    itemName: node.name,
+                    parentId: node.parentId,
+                    itemType: node.itemType,
+                    status: status,
+                    statusName: statusName,
+                    itemNumberId: item.displayId.toString(),
+                    levelType: item.levelType
+                });
+                this.addSelectedData(node);
+            }
+        };
+        SelectProcessDocumentPopupComponent.prototype.getChildNodeSelectOne = function (listChildren) {
+            this.listChildrenSelectOne = [];
+            this.listChildrenSelectOne = listChildren;
+        };
+        SelectProcessDocumentPopupComponent.prototype.getItemOfFolder = function (node, type) {
+            if (this.splitView) {
+                var parentTexts = this.elem.nativeElement.querySelectorAll('.text-node-parent');
+                [].forEach.call(parentTexts, function (el) {
+                    el.classList.remove('active-item');
+                });
+                var itemElement = document.querySelectorAll("#_" + (node.parentId ? node.parentId : '') + "_" + node.id + "_" + node.level);
+                [].forEach.call(itemElement, function (el) {
+                    el.classList.add('active-item');
+                });
+                if (type === this.dataType.folder) {
+                    this.splitViewTitle = this.LANG.MESSAGE.DOCUMENTS_IN.toUpperCase() + " \"" + node.name + "\"";
+                }
+                else if (type === this.dataType.area) {
+                    this.splitViewTitle = this.LANG.MESSAGE.PROCESSES_IN.toUpperCase() + " \"" + node.name + "\"";
+                }
+                var item = new QMSProcessDocumentItem();
+                item.id = node.id;
+                item.itemType = type;
+                item.itemName = node.name;
+                item.levelType = node.levelType;
+                this.selectedFolder = node;
+                this.parentNodeSelected = new TreeFlatNode();
+                this.parentNodeSelected = Object.assign({}, node);
+                this.onSelectFolderItem.emit(item);
+            }
+        };
+        return SelectProcessDocumentPopupComponent;
+    }());
+    SelectProcessDocumentPopupComponent.decorators = [
+        { type: i0.Component, args: [{
+                    selector: 'qms-select-process-document',
+                    template: "<div id=\"qmslib_related_popup\" class=\"qmslib__related__popup__container\">\r\n    <div id=\"qmslib_related_popup_header\">\r\n      <span mat-icon-button class=\"button__close\" (click)=\"onCloseClick()\">\r\n        <mat-icon mat-icon>close</mat-icon>\r\n      </span>\r\n      <div id=\"qmslib_related_popup_header_001\" mat-dialog-content>\r\n        <span>{{ moduleName | uppercase }}</span>\r\n      </div>\r\n    </div>\r\n  \r\n    <div id=\"qmslib_related_popup_search\" class=\"input__field\">\r\n      <input\r\n        type=\"text\"\r\n        placeholder=\"{{ LANG.SEARCH }}\"\r\n        matInput\r\n        [formControl]=\"myControl\"\r\n        [matAutocomplete]=\"auto\"\r\n      />\r\n      <mat-icon>search</mat-icon>\r\n    </div>\r\n  \r\n    <div class=\"line__divider\"></div>\r\n  \r\n    <mat-autocomplete\r\n      #auto=\"matAutocomplete\"\r\n      class=\"mat-autocomplete_related-viewport\"\r\n    >\r\n      <cdk-virtual-scroll-viewport\r\n        qms-scrollbar\r\n        itemSize=\"10\"\r\n        [class.related-viewport]=\"isInputValue\"\r\n      >\r\n        <ng-container *ngFor=\"let type of searchOrder\">\r\n          <div\r\n            class=\"search__module-result\"\r\n            *ngIf=\"canShowSearchOption(type.value)\"\r\n          >\r\n            <span class=\"search__module-title\">{{ getTitle(type.value) }}</span>\r\n            <mat-option\r\n              class=\"search__option\"\r\n              *ngFor=\"let option of getModuleFilteredOptions(type.value)\"\r\n              [value]=\"option\"\r\n              (click)=\"selectRelated(option)\"\r\n            >\r\n              <qms-list-item type=\"image-square\">\r\n                <mat-icon\r\n                  leading-icon\r\n                  type=\"image-square\"\r\n                  [svgIcon]=\"getNodeIcon(option)\"\r\n                ></mat-icon>\r\n                <div qms-list-header>\r\n                  <div qms-line type=\"subtitle\" class=\"search__option-name\">\r\n                    {{ option.itemName }}\r\n                  </div>\r\n                  <div\r\n                    class=\"caption\"\r\n                    *ngIf=\"option.breadcumbs && option.breadcumbs.length\"\r\n                  >\r\n                    <qms-breadcrumb\r\n                      class=\"breadcrumb-containe\"\r\n                      type=\"table\"\r\n                      numDisplayItem=\"1\"\r\n                      [nodes]=\"option.breadcumbs\"\r\n                    >\r\n                    </qms-breadcrumb>\r\n                  </div>\r\n                </div>\r\n                <div qms-line color=\"default-subtitle\" *ngIf=\"getItemId(option)\">\r\n                  <span class=\"material-icons-outlined search__description-icon\">\r\n                    local_offer\r\n                  </span>\r\n                  {{ getItemId(option) }}\r\n                </div>\r\n              </qms-list-item>\r\n            </mat-option>\r\n          </div>\r\n        </ng-container>\r\n      </cdk-virtual-scroll-viewport>\r\n    </mat-autocomplete>\r\n  \r\n    <div class=\"row\">\r\n      <div\r\n        class=\"qms-scrollbar qmslib_related_popup_content\"\r\n        [ngClass]=\"{\r\n          panel__content_item: checkedNodeList.length,\r\n          panel__content: !checkedNodeList.length,\r\n          'col-6': splitView,\r\n          'col-12': !splitView\r\n        }\"\r\n      >\r\n        <mat-expansion-panel\r\n          hideToggle\r\n          id=\"qmslib_related_popup_common_001\"\r\n          [expanded]=\"isCommonExpanded\"\r\n          (opened)=\"isCommonExpanded = true\"\r\n          (closed)=\"isCommonExpanded = false\"\r\n          class=\"panel-tree\"\r\n        >\r\n          <mat-expansion-panel-header class=\"padding-5\">\r\n            <mat-panel-title *ngIf=\"moduleId === module.documentProcess\">\r\n              {{ LANG.PROCESSES | uppercase }}\r\n            </mat-panel-title>\r\n            <button qms-btn-icon class=\"related_popup_toggle-btn\">\r\n              <mat-icon>\r\n                {{\r\n                  isCommonExpanded ? \"keyboard_arrow_up\" : \"keyboard_arrow_down\"\r\n                }}\r\n              </mat-icon>\r\n            </button>\r\n          </mat-expansion-panel-header>\r\n          <div id=\"qmslib_related_popup_common_002\">\r\n            <qms-tree-new\r\n              [treeData]=\"treeData1\"\r\n              [treeConfig]=\"treeConfig1\"\r\n              [selectedData]=\"selectedData\"\r\n              [selectedRiskData]=\"selectedRiskData\"\r\n              [disabledList]=\"disabledList\"\r\n              (nodeExpandEvent)=\"getChildrenOfFolder($event, dataType.area)\"\r\n              (selectNodeEvent)=\"selectNodeTreeEvent($event)\"\r\n              (getChildNodeSelectOne)=\"getChildNodeSelectOne($event)\"\r\n              (selectFolderEvent)=\"getItemOfFolder($event, dataType.area)\"\r\n              [expandOnTitleClick]=\"!splitView\"\r\n              [parentNodeOnClick]=\"parentNodeSelected\"\r\n              (treeControlNodes)=\"selectTreeControlNodeProcess($event)\"\r\n            ></qms-tree-new>\r\n          </div>\r\n        </mat-expansion-panel>\r\n  \r\n        <div\r\n          *ngIf=\"moduleId === module.documentProcess\"\r\n          class=\"line__divider\"\r\n        ></div>\r\n  \r\n        <mat-expansion-panel\r\n          hideToggle\r\n          *ngIf=\"moduleId === module.documentProcess\"\r\n          id=\"qmslib_related_popup_document_001\"\r\n          [expanded]=\"isDocumentExpanded\"\r\n          (opened)=\"isDocumentExpanded = true\"\r\n          (closed)=\"isDocumentExpanded = false\"\r\n          class=\"panel-tree\"\r\n        >\r\n          <mat-expansion-panel-header class=\"padding-5\">\r\n            <mat-panel-title> {{ LANG.DOCUMENTS | uppercase }} </mat-panel-title>\r\n            <button qms-btn-icon class=\"related_popup_toggle-btn\">\r\n              <mat-icon>\r\n                {{\r\n                  isDocumentExpanded ? \"keyboard_arrow_up\" : \"keyboard_arrow_down\"\r\n                }}\r\n              </mat-icon>\r\n            </button>\r\n          </mat-expansion-panel-header>\r\n          <div id=\"qmslib_related_popup_document_002\">\r\n            <qms-tree-new\r\n              [treeData]=\"treeData2\"\r\n              [treeConfig]=\"treeConfig2\"\r\n              [selectedData]=\"selectedData2\"\r\n              [disabledList]=\"disabledList2\"\r\n              (nodeExpandEvent)=\"getChildrenOfFolder($event, dataType.folder)\"\r\n              (selectNodeEvent)=\"selectNodeTreeEvent($event)\"\r\n              (getChildNodeSelectOne)=\"getChildNodeSelectOne($event)\"\r\n              (selectFolderEvent)=\"getItemOfFolder($event, dataType.folder)\"\r\n              [expandOnTitleClick]=\"!splitView\"\r\n              [parentNodeOnClick]=\"parentNodeSelected\"\r\n              (treeControlNodes)=\"selectTreeControlNodeDocument($event)\"\r\n            ></qms-tree-new>\r\n          </div>\r\n        </mat-expansion-panel>\r\n      </div>\r\n      <div\r\n        *ngIf=\"splitView\"\r\n        class=\"\r\n          qms-scrollbar\r\n          qmslib-related-popup-splitview qmslib_related_popup_content\r\n          col-6\r\n        \"\r\n        [ngClass]=\"{\r\n          panel__content_item: checkedNodeList.length,\r\n          panel__content: !checkedNodeList.length\r\n        }\"\r\n      >\r\n        <div class=\"splitview-header\" *ngIf=\"selectedFolder\">\r\n          {{ splitViewTitle }}\r\n        </div>\r\n        <div class=\"expand-node\" *ngFor=\"let node of itemInSplitview\">\r\n          <mat-checkbox\r\n            qms-group-options\r\n            [disabled]=\"node.disabled\"\r\n            color=\"default\"\r\n            [checked]=\"isNodeSelected(node)\"\r\n            (change)=\"toggleSelectItem(node)\"\r\n          ></mat-checkbox>\r\n          <mat-icon\r\n            class=\"mat-icon-rtl-mirror material-icons-outlined\"\r\n            [svgIcon]=\"getNodeIcon(node)\"\r\n          ></mat-icon>\r\n          <span class=\"text-node\">{{ node.itemName }}</span>\r\n        </div>\r\n      </div>\r\n    </div>\r\n  \r\n    <div *ngIf=\"checkedNodeList.length\" class=\"line__divider\"></div>\r\n  \r\n    <div *ngIf=\"checkedNodeList.length\" class=\"panel__item qms-scrollbar\">\r\n      <div class=\"related__item__inline\" *ngFor=\"let item of checkedNodeList\">\r\n        <button\r\n          *ngIf=\"item.itemName\"\r\n          mat-button\r\n          class=\"related__item__content\"\r\n          qms-tool-tip=\"{{\r\n            isEllipsisActive(itemName) ? getItemChipName(item) : ''\r\n          }}\"\r\n          mode=\"dark\"\r\n        >\r\n          <span class=\"related__item__content_name\" #itemName>{{\r\n            getItemChipName(item)\r\n          }}</span>\r\n          <mat-icon\r\n            *ngIf=\"!(treeConfig1?.selectOne || treeConfig2?.selectOne)\"\r\n            (click)=\"removeCheckedNodeList(item)\"\r\n            >cancel</mat-icon\r\n          >\r\n        </button>\r\n      </div>\r\n    </div>\r\n  \r\n    <div class=\"line__divider\"></div>\r\n  \r\n    <div class=\"confirm__button__groups\">\r\n      <button\r\n        *ngIf=\"!checkedNodeList.length\"\r\n        qms-btn\r\n        style=\"margin-top: 7px\"\r\n        (click)=\"onAddClick()\"\r\n      >\r\n        {{ LANG.ADD }}\r\n      </button>\r\n      <button\r\n        *ngIf=\"checkedNodeList.length\"\r\n        qms-btn\r\n        style=\"margin-top: 0px\"\r\n        (click)=\"onAddClick()\"\r\n      >\r\n        {{ LANG.ADD }} ({{ checkedNodeList.length }})\r\n      </button>\r\n      <button\r\n        qms-btn-text\r\n        [ngStyle]=\"{ 'margin-top': checkedNodeList.length ? '0px' : '7px' }\"\r\n        (click)=\"onCloseClick()\"\r\n      >\r\n        {{ LANG.CANCEL }}\r\n      </button>\r\n    </div>\r\n  </div>\r\n  ",
+                    encapsulation: i0.ViewEncapsulation.None,
+                    styles: [".qms-scrollbar::-webkit-scrollbar{width:12px}.qms-scrollbar::-webkit-scrollbar-track{background:rgba(0,0,0,.12);background-clip:content-box}.qms-scrollbar::-webkit-scrollbar-thumb{background:rgba(0,0,0,.38);border-radius:20px;width:4px;border:4px solid transparent;background-clip:content-box}.qms-scrollbar::-webkit-scrollbar-thumb:hover{background:rgba(0,0,0,.5);background-clip:content-box;border:4px solid transparent}.qms-scrollbar.none-scroll-bg::-webkit-scrollbar-track{background:transparent;background-clip:content-box}.qms__popup .button__close{float:right;top:-24px;right:-24px;cursor:pointer}.qms__danger button{border:none;color:#fff;padding:0;text-align:center;text-decoration:none;display:inline-block;cursor:pointer;height:20px;width:20px;font-family:Open Sans;font-size:12px;font-weight:600;font-style:normal;line-height:16px}.qms__danger .red{background-color:#9e360f;margin-left:10px}.qms__danger .yellow{background-color:#e4cf53;margin-left:10px;color:#323232}.qms__danger .green{background-color:#00804c;margin-left:10px}.confirm__button__groups{margin-top:11px}.confirm__button__groups button{min-height:36px;width:auto;font-family:Open Sans;font-weight:500;font-size:14px;letter-spacing:1px;line-height:16px;padding-left:15px;padding-right:15px;margin-right:5px;float:right}.confirm__button__groups .confirm{background:#f8f9f9}.confirm__button__groups .confirm:hover{background:#001983;color:#fff}.confirm__button__groups .confirm:disabled{cursor:not-allowed}.confirm__button__groups .cancel{background:#f8f9f9}.confirm__button__groups .cancel:hover{background:#001983;color:#fff}.qmslib__related__popup__container .input__field{display:flex;align-items:center}.qmslib__related__popup__container .input__field input{width:100%;padding:10px;outline:none;border:none;background:#eee}.qmslib__related__popup__container .input__field .mat-icon{margin-left:-30px;cursor:pointer;vertical-align:middle}.qmslib__related__popup__container .line__divider{border-bottom:1px solid #ccc;height:1px;margin-top:10px;min-width:300px;max-width:100%}.qmslib__related__popup__container .button__close{float:right;top:-24px;right:-24px;cursor:pointer}.qmslib__related__popup__container .panel__content{height:450px;overflow:auto;margin-top:12px}.qmslib__related__popup__container .panel__content_item{height:350px;overflow:auto;margin-top:12px}.qmslib__related__popup__container .panel-tree .mat-expansion-panel-body{padding:0 12px 12px}.qmslib__related__popup__container .mat-expansion-panel-header{height:30px;font-size:12px;letter-spacing:1px;font-family:Raleway;font-weight:600;padding:0}.qmslib__related__popup__container .mat-expansion-panel-header .mat-expansion-panel-header-title{align-items:center;margin-left:12px}.qmslib__related__popup__container .mat-expansion-panel-header .related_popup_toggle-btn{width:1.5rem;height:1.5rem;line-height:1.5rem}.qmslib__related__popup__container .mat-expansion-panel:not([class*=mat-elevation-z]){box-shadow:none}.qmslib__related__popup__container .panel__item{height:100px;margin-top:12px;overflow-x:hidden;overflow-y:auto;padding-right:5px;width:100%;max-width:100%;display:flex;flex-wrap:wrap;align-content:flex-start}.qmslib__related__popup__container .panel__item .related__item__inline{max-width:100%}.qmslib__related__popup__container .panel__item .related__item__content{height:32px;line-height:32px;background-color:#e5e5e5;max-width:100%;margin-bottom:5px;margin-left:2.5px;margin-right:2.5px}.qmslib__related__popup__container .panel__item .related__item__content .mat-icon{color:#8e8e8e;font-size:24px}.qmslib__related__popup__container .panel__item .related__item__content span.related__item__content_name{display:inline-block;min-width:calc(100% - 13px);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:278px}.qmslib__related__popup__container .qmslib-related-popup-splitview{background-color:#fff;border-left:1px solid #ccc;height:450px;overflow-y:auto;margin-top:12px}.qmslib__related__popup__container .qmslib-related-popup-splitview.panel__content{height:450px;overflow:auto;margin-top:12px}.qmslib__related__popup__container .qmslib-related-popup-splitview.panel__content_item{height:350px;overflow:auto;margin-top:12px}.qmslib__related__popup__container .qmslib-related-popup-splitview .splitview-header{height:30px;font-size:12px;letter-spacing:1px;font-family:RALEWAY;font-weight:600;display:flex;align-items:center}.qmslib__related__popup__container .qmslib-related-popup-splitview .mat-checkbox.qms-group-options{padding:0}.qmslib__related__popup__container .qmslib-related-popup-splitview .mat-checkbox.qms-group-options .mat-checkbox-inner-container{margin-right:11px}.qmslib__related__popup__container .qmslib-related-popup-splitview .mat-checkbox.qms-group-options.mat-checkbox-checked{background:transparent!important}.qmslib__related__popup__container .qmslib-related-popup-splitview .expand-node{margin-left:8px;display:flex;align-items:center;min-height:40px}.qmslib__related__popup__container .qmslib-related-popup-splitview .expand-node .mat-icon{color:rgba(0,0,0,.6);margin-right:17px;min-width:-webkit-fit-content;min-width:-moz-fit-content;min-width:fit-content}.qmslib__related__popup__container .qmslib-related-popup-splitview .expand-node .mat-icon svg{display:block;min-width:-webkit-fit-content;min-width:-moz-fit-content;min-width:fit-content}cdk-virtual-scroll-viewport{overflow-x:hidden}cdk-virtual-scroll-viewport .search__module-result{margin:1.5rem;padding:0 0 .5rem}cdk-virtual-scroll-viewport .search__module-result .search__module-title{font-size:14px;font-weight:600}cdk-virtual-scroll-viewport .search__module-result .search__option{height:auto;line-height:normal;padding:8px 0;border-bottom:1px solid #e0e0e0}cdk-virtual-scroll-viewport .search__module-result .search__option .qms-list-item.mat-2-line.image-item{height:auto}cdk-virtual-scroll-viewport .search__module-result .search__option .qms-list-item-content{margin:0;border-bottom:none}cdk-virtual-scroll-viewport .search__module-result .search__option .qms-list-item-content .wrap-image.image-square{width:2.5rem;height:100%;background:transparent;align-self:center;margin-right:0}cdk-virtual-scroll-viewport .search__module-result .search__option .qms-list-item-content .wrap-image.image-square img{width:24px;height:24px}cdk-virtual-scroll-viewport .search__module-result .search__option .qms-list-item-content .material-icons-outlined.leading-icon,cdk-virtual-scroll-viewport .search__module-result .search__option .qms-list-item-content mat-icon.leading-icon{padding:4px 0 4px 4px}cdk-virtual-scroll-viewport .search__module-result .search__option .qms-list-item-content .subtitle{font-weight:400}cdk-virtual-scroll-viewport .search__module-result .search__option .qms-list-item-content .caption{overflow:hidden;line-height:normal;white-space:normal;text-overflow:ellipsis;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;padding:0;margin:0}cdk-virtual-scroll-viewport .search__module-result .search__option .qms-list-item-content .caption span.search__result__parent-name{display:inline-block;width:auto;width:calc(100% - 13px);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}cdk-virtual-scroll-viewport .search__module-result .search__option .qms-list-item-content .default-subtitle{color:rgba(0,0,0,.38)}cdk-virtual-scroll-viewport .search__module-result .search__option .qms-list-item-content .search__description-icon{margin-right:0;width:12px;height:12px;font-size:12px}cdk-virtual-scroll-viewport .search__module-result .search__option .qms-list-item-content .qms-list-text{border-bottom:none}cdk-virtual-scroll-viewport .search__module-result .search__option .qms-list-item-content .breadcrumb-containe .qms-breadcrumb-item .mat-icon{font-size:16px!important;padding-bottom:1px}cdk-virtual-scroll-viewport .search__module-result svg{display:block}#qmslib_related_popup_header_001{margin-bottom:20px;padding:0;font-weight:600;font-family:Raleway}.padding-5{padding:5px}.mat-autocomplete_related-viewport{height:100%;max-height:100%!important}.mat-autocomplete_related-viewport .cdk-virtual-scroll-content-wrapper{width:100%}.mat-autocomplete_related-viewport .related-viewport{min-height:10.25rem}"]
+                },] }
+    ];
+    SelectProcessDocumentPopupComponent.ctorParameters = function () { return [
+        { type: i0.ChangeDetectorRef },
+        { type: TranslateLibraryService },
+        { type: dialog.MatDialogRef },
+        { type: QMSSelectProcessDocumentGlobalService },
+        { type: icon.MatIconRegistry },
+        { type: platformBrowser.DomSanitizer },
+        { type: QMSIconRegistryService },
+        { type: i0.ElementRef },
+        { type: SelectProcessDocumentPopupData, decorators: [{ type: i0.Inject, args: [dialog.MAT_DIALOG_DATA,] }] }
+    ]; };
+    SelectProcessDocumentPopupComponent.propDecorators = {
+        dataTrees: [{ type: i0.ViewChildren, args: [NewTreeComponent, {},] }],
+        autoComplete: [{ type: i0.ViewChild, args: ['autoCompleteInputSearch', { read: autocomplete.MatAutocompleteTrigger, static: true },] }],
+        onMessage: [{ type: i0.HostListener, args: ['window:message', ['$event'],] }]
+    };
+
+    var QMSSelectProcessDocumentModule = /** @class */ (function () {
+        function QMSSelectProcessDocumentModule() {
+        }
+        return QMSSelectProcessDocumentModule;
+    }());
+    QMSSelectProcessDocumentModule.decorators = [
+        { type: i0.NgModule, args: [{
+                    declarations: [
+                        SelectProcessDocumentPopupComponent
+                    ],
+                    imports: [
+                        common.CommonModule,
+                        tree$1.MatTreeModule,
+                        icon.MatIconModule,
+                        button.MatButtonModule,
+                        checkbox.MatCheckboxModule,
+                        expansion.MatExpansionModule,
+                        autocomplete.MatAutocompleteModule,
+                        forms.ReactiveFormsModule,
+                        scrolling.ScrollingModule,
+                        card.MatCardModule,
+                        sidenav.MatSidenavModule,
+                        list.MatListModule,
+                        SharedMaterialModule,
+                        QMSListModule,
+                        QmsAngularModule,
+                        QMSBreadcrumbModule,
+                        QMSAppIconModule,
+                        QMSTreeModule,
+                        QMSButtonModule,
+                        slideToggle.MatSlideToggleModule,
+                        QMSNewTreeModule
+                    ],
+                    exports: [
+                        SelectProcessDocumentPopupComponent
+                    ]
+                },] }
+    ];
+
+    var SelectedProcessDocumentItem = /** @class */ (function () {
+        function SelectedProcessDocumentItem() {
+        }
+        return SelectedProcessDocumentItem;
+    }());
+
+    var QMSNavigationDrawerComponent = /** @class */ (function () {
+        function QMSNavigationDrawerComponent() {
+            this.treeData = [];
+            this.addNodeEvent = new i0.EventEmitter();
+            this.addFavoriteEvent = new i0.EventEmitter();
+            this.drogLocationEvent = new i0.EventEmitter();
+            this.showAddIcon = true;
+            this.openNodes = [];
+            this.dragDropListDisabled = false;
+            this.nodesExpand = new i0.EventEmitter();
+            this.onClickNodeEvent = new i0.EventEmitter();
+            this.addFavoriteTooltip = 'Legg til favoritt';
+            this.deleteFavoriteTooltip = 'Slett favoritt';
+            this.addNodeTooltip = 'Legg til lokasjon';
+            this.expandedNodeSet = new Set();
+            this.dragging = false;
+            this.expandDelay = 1000;
+            this.isHover = false;
+            this.treeControl = new tree.FlatTreeControl(function (node) { return node.level; }, function (node) { return node.expandable; });
+            this.treeFlattener = new tree$1.MatTreeFlattener(this._transformer, function (node) { return node.level; }, function (node) { return node.expandable; }, function (node) { return node.children; });
+            this.dataSource = new tree$1.MatTreeFlatDataSource(this.treeControl, this.treeFlattener);
+            this.hoverNode = {};
+            this.expandingNodes = [];
+            this.hasChild = function (_, node) { return node.expandable; };
+            this.dataSource.data = this.treeData;
+        }
+        QMSNavigationDrawerComponent.prototype._transformer = function (node, level) {
+            return {
+                expandable: !!node.children && node.children.length > 0,
+                name: node.name,
+                level: level,
+                id: node.id,
+                isReadOnly: node.isReadOnly,
+                favorite: node.favorite,
+                disabled: node.disabled
+            };
+        };
+        QMSNavigationDrawerComponent.prototype.ngOnInit = function () {
+            var _this = this;
+            this.openNodes.forEach(function (item) {
+                _this.treeControl.expand(_this.treeControl.dataNodes.find(function (p) { return p.id.toString() === item; }));
+            });
+        };
+        QMSNavigationDrawerComponent.prototype.ngOnChanges = function (changes) {
+            var _this = this;
+            this.dataSource.data = this.treeData;
+            if (this.filterText) {
+                this.expandNodeSearched(this.treeData, this.filterText);
+            }
+            if (changes.openNodes) {
+                this.openNodes.forEach(function (item) {
+                    _this.treeControl.expand(_this.treeControl.dataNodes.find(function (p) { return p.id.toString() === item; }));
+                });
+            }
+        };
+        QMSNavigationDrawerComponent.prototype.expandNodeSearched = function (nodesOrigin, txtSearch) {
+            var _this = this;
+            nodesOrigin.forEach(function (item) {
+                if (!item.name.toLocaleLowerCase().includes(txtSearch.toLocaleLowerCase())) {
+                    _this.treeControl.expand(_this.treeControl.dataNodes.find(function (p) { return p.id.toString() === item.id; }));
+                    if (item.children.length > 0) {
+                        _this.expandNodeSearched(item.children, txtSearch);
+                    }
+                }
+            });
+        };
+        QMSNavigationDrawerComponent.prototype.onClickNode = function (nodeId) {
+            this.onClickNodeEvent.emit(nodeId);
+        };
+        QMSNavigationDrawerComponent.prototype.onOver = function (node) {
+            this.hoverNode = node;
+        };
+        QMSNavigationDrawerComponent.prototype.addNewNode = function (nodeId, event) {
+            event.stopPropagation();
+            event.preventDefault();
+            this.addNodeEvent.emit(nodeId);
+        };
+        QMSNavigationDrawerComponent.prototype.addFavoriteNode = function (nodeId, event) {
+            event.stopPropagation();
+            event.preventDefault();
+            this.addFavoriteEvent.emit(nodeId);
+        };
+        QMSNavigationDrawerComponent.prototype.ngOnDestroy = function () {
+            if (this.activeNodeLocation) {
+                this.activeNodeLocation.unsubscribe();
+            }
+        };
+        /**
+         * This constructs an array of nodes that matches the DOM,
+         * and calls rememberExpandedTreeNodes to persist expand state
+         */
+        QMSNavigationDrawerComponent.prototype.visibleNodes = function () {
+            var _this = this;
+            this.rememberExpandedTreeNodes(this.treeControl, this.expandedNodeSet);
+            var result = [];
+            function addExpandedChildren(node, expanded) {
+                result.push(node);
+                if (expanded.has(node.id)) {
+                    node.children.map(function (child) { return addExpandedChildren(child, expanded); });
+                }
+            }
+            this.dataSource.data.forEach(function (node) {
+                addExpandedChildren(node, _this.expandedNodeSet);
+            });
+            return result;
+        };
+        /**
+         * Handle the drop - here we rearrange the data based on the drop event,
+         * then rebuild the tree.
+         * */
+        QMSNavigationDrawerComponent.prototype.drop = function (event) {
+            // Save data for backup
+            var node = event.item.data;
+            var backupChangedNode = JSON.parse(JSON.stringify(node));
+            var backupData = JSON.parse(JSON.stringify(this.dataSource.data));
+            // ignore drops outside of the tree
+            if (!event.isPointerOverContainer) {
+                return;
+            }
+            // construct a list of visible nodes, this will match the DOM.
+            // the cdkDragDrop event.currentIndex jives with visible nodes.
+            // it calls rememberExpandedTreeNodes to persist expand state
+            var visibleNodes = this.visibleNodes();
+            // deep clone the data source so we can mutate it
+            var changedData = JSON.parse(JSON.stringify(this.dataSource.data));
+            // recursive find function to find siblings of node
+            function findNodeSiblings(arr, id) {
+                var result, subResult;
+                arr.forEach(function (item) {
+                    if (item.id === id) {
+                        result = arr;
+                    }
+                    else if (item.children) {
+                        subResult = findNodeSiblings(item.children, id);
+                        if (subResult) {
+                            result = subResult;
+                        }
+                    }
+                });
+                return result;
+            }
+            // remove the node from its old place
+            var siblings = findNodeSiblings(changedData, node.id);
+            var siblingIndex = siblings.findIndex(function (n) { return n.id === node.id; });
+            // const nodeToInsert: TreeNode = siblings.splice(siblingIndex, 1)[0];
+            var nodeToInsert = siblings.splice(siblingIndex, 1)[0];
+            // determine where to insert the node
+            var nodeAtDest = visibleNodes[event.currentIndex];
+            if (nodeAtDest.id === nodeToInsert.id) {
+                return;
+            }
+            // determine drop index relative to destination array
+            var relativeIndex = event.currentIndex; // default if no parent
+            var nodeAtDestFlatNode = this.treeControl.dataNodes.find(function (n) { return nodeAtDest.id === n.id; });
+            var parent = this.getParentNode(nodeAtDestFlatNode);
+            if (parent) {
+                var parentIndex = visibleNodes.findIndex(function (n) { return n.id === parent.id; }) + 1;
+                relativeIndex = event.currentIndex - parentIndex;
+                // update parentId for nodeToInsert
+                nodeToInsert.parentId = parent.id;
+            }
+            else {
+                nodeToInsert.parentId = guidHelper.empty;
+            }
+            // update new order for nodeToInsert
+            nodeToInsert.order = relativeIndex;
+            // insert node
+            var newSiblings = findNodeSiblings(changedData, nodeAtDest.id);
+            if (!newSiblings) {
+                return;
+            }
+            newSiblings.splice(relativeIndex, 0, nodeToInsert);
+            // rebuild tree with mutated data
+            this.rebuildTreeForData(changedData);
+            // update New Location Order for new insert node
+            this.updateNewOrderForNodeSiblings(newSiblings);
+            this.drogLocationEvent.emit({
+                newSiblings: newSiblings,
+                changedNode: backupChangedNode,
+                oldDataSource: backupData
+            });
+        };
+        QMSNavigationDrawerComponent.prototype.updateNewOrderForNodeSiblings = function (newSiblings) {
+            var newOrder = 0;
+            newSiblings.forEach(function (item) {
+                item.order = newOrder;
+                newOrder = newOrder + 1;
+            });
+        };
+        /**
+         * Experimental - opening tree nodes as you drag over them
+        */
+        QMSNavigationDrawerComponent.prototype.dragStart = function () {
+            this.dragging = true;
+        };
+        QMSNavigationDrawerComponent.prototype.dragEnd = function () {
+            this.dragging = false;
+        };
+        QMSNavigationDrawerComponent.prototype.dragHover = function (node) {
+            var _this = this;
+            this.isHover = true;
+            if (this.dragging) {
+                clearTimeout(this.expandTimeout);
+                this.expandTimeout = setTimeout(function () {
+                    _this.treeControl.expand(node);
+                }, this.expandDelay);
+            }
+        };
+        QMSNavigationDrawerComponent.prototype.dragHoverEnd = function () {
+            this.isHover = false;
+            if (this.dragging) {
+                clearTimeout(this.expandTimeout);
+            }
+        };
+        /**
+         * The following methods are for persisting the tree expand state
+         * after being rebuilt
+         */
+        QMSNavigationDrawerComponent.prototype.rebuildTreeForData = function (data) {
+            this.rememberExpandedTreeNodes(this.treeControl, this.expandedNodeSet);
+            this.treeData = data;
+            this.dataSource.data = data;
+            this.forgetMissingExpandedNodes(this.treeControl, this.expandedNodeSet);
+            this.expandNodesById(this.treeControl.dataNodes, Array.from(this.expandedNodeSet));
+        };
+        QMSNavigationDrawerComponent.prototype.rememberExpandedTreeNodes = function (treeControl, expandedNodeSet) {
+            if (treeControl.dataNodes) {
+                treeControl.dataNodes.forEach(function (node) {
+                    if (treeControl.isExpandable(node) && treeControl.isExpanded(node)) {
+                        // capture latest expanded state
+                        expandedNodeSet.add(node.id.toString());
+                    }
+                });
+            }
+        };
+        QMSNavigationDrawerComponent.prototype.forgetMissingExpandedNodes = function (treeControl, expandedNodeSet) {
+            if (treeControl.dataNodes) {
+                expandedNodeSet.forEach(function (nodeId) {
+                    // maintain expanded node state
+                    if (!treeControl.dataNodes.find(function (n) { return n.id.toString() === nodeId; })) {
+                        // if the tree doesn't have the previous node, remove it from the expanded list
+                        expandedNodeSet.delete(nodeId);
+                    }
+                });
+            }
+        };
+        QMSNavigationDrawerComponent.prototype.expandNodesById = function (flatNodes, ids) {
+            var _this = this;
+            if (!flatNodes || flatNodes.length === 0) {
+                return;
+            }
+            var idSet = new Set(ids);
+            return flatNodes.forEach(function (node) {
+                if (idSet.has(node.id.toString())) {
+                    _this.treeControl.expand(node);
+                    _this.expandingNodes.push(node);
+                    var parent = _this.getParentNode(node);
+                    while (parent) {
+                        _this.treeControl.expand(parent);
+                        _this.expandingNodes.push(parent);
+                        parent = _this.getParentNode(parent);
+                    }
+                }
+            });
+        };
+        QMSNavigationDrawerComponent.prototype.getParentNode = function (node) {
+            var currentLevel = node.level;
+            if (currentLevel < 1) {
+                return null;
+            }
+            var startIndex = this.treeControl.dataNodes.indexOf(node) - 1;
+            for (var i = startIndex; i >= 0; i--) {
+                var currentNode = this.treeControl.dataNodes[i];
+                if (currentNode.level < currentLevel) {
+                    return currentNode;
+                }
+            }
+            return null;
+        };
+        QMSNavigationDrawerComponent.prototype.onKeyDownNode = function (event, node) {
+            if (event.key == 'Enter') {
+                this.onClickToggleNode(node);
+            }
+        };
+        QMSNavigationDrawerComponent.prototype.onClickToggleNode = function (node) {
+            if (this.treeControl.isExpanded(node)) {
+                this.treeControl.expand(node);
+                this._addExpandingNode(node);
+            }
+            else {
+                this.treeControl.collapse(node);
+                this._removeExpandingNodes(node.id);
+            }
+            this.nodesExpand.emit({ node: node, isExpand: this.treeControl.isExpanded(node) });
+        };
+        QMSNavigationDrawerComponent.prototype.setHoverFavorite = function (id) {
+            this.hoverFavoriteNodeId = id;
+        };
+        QMSNavigationDrawerComponent.prototype.expandNodes = function () {
+            this._expandNodesLoop(this.treeData);
+        };
+        QMSNavigationDrawerComponent.prototype._expandNodesLoop = function (data) {
+            var _this = this;
+            data.forEach(function (node) {
+                var expandingNode = _this.expandingNodes.some(function (x) { return x.id === node.id; });
+                if (expandingNode) {
+                    _this.onClickToggleNode(expandingNode);
+                }
+                data.forEach(function (item) {
+                    if (Array.isArray(item.children)) {
+                        _this._expandNodesLoop(item.children);
+                    }
+                });
+            });
+        };
+        QMSNavigationDrawerComponent.prototype._addExpandingNode = function (node) {
+            if (!this.expandingNodes.some(function (x) { return x.id === node.id; })) {
+                this.expandingNodes.push(node);
+            }
+        };
+        QMSNavigationDrawerComponent.prototype._removeExpandingNodes = function (nodeId) {
+            this.expandingNodes = this.expandingNodes.filter(function (x) { return x.id !== nodeId; });
+        };
+        return QMSNavigationDrawerComponent;
+    }());
+    QMSNavigationDrawerComponent.decorators = [
+        { type: i0.Component, args: [{
+                    selector: 'app-qms-navigation-drawer',
+                    template: "<mat-tree class=\"qms-navigation-drawer-container\" [dataSource]=\"dataSource\" [treeControl]=\"treeControl\" cdkDropList\r\n  (cdkDropListDropped)=\"drop($event)\" [cdkDropListDisabled]=\"dragDropListDisabled\">\r\n  <!-- This is the tree node template for leaf nodes -->\r\n  <mat-tree-node *matTreeNodeDef=\"let node\" routerLinkActive=\"active\" (mouseover)=\"onOver(node)\" matTreeNodePadding\r\n    matTreeNodePaddingIndent=\"34\" cdkDrag [cdkDragData]=\"node\" (mouseenter)=\"dragHover(node)\"\r\n    (mouseleave)=\"dragHoverEnd()\" (cdkDragStarted)=\"dragStart()\" (cdkDragReleased)=\"dragEnd()\"\r\n    [ngClass]=\"{'expand-node' : treeControl.isExpanded(node), 'collapse-node': !treeControl.isExpanded(node)}\">\r\n    <div *ngIf=\"!node.isReadOnly\" (click)=\"onClickNode(node.id)\"\r\n      class=\"tree-content\">\r\n      <div class=\"span-text\" mode=\"dark\" position=\"below\">{{ node.name }}</div>\r\n      <button tabindex=\"-1\" class=\"button-icon collapse-expand-icon space-icon\" mat-icon-button>\r\n        <img class=\"img-icon\" [src]=\"faIconPath\" alt=\"\" />\r\n      </button>\r\n      <button tabindex=\"-1\" class=\"button-icon add-icon\"\r\n        *ngIf=\"showFavoriteIcon && (node.id === hoverNode.id || node.favorite)\"\r\n        (click)=\"addFavoriteNode(node.id, $event)\" (mouseenter)=\"setHoverFavorite(node.id)\"\r\n        (mouseleave)=\"setHoverFavorite(null)\" [ngClass]=\"{'btn-favorite': (node.id === hoverNode.id && showAddIcon)}\"\r\n        matTooltip=\"{{!node.favorite ? addFavoriteTooltip : deleteFavoriteTooltip}}\" mode=\"dark\" position=\"below\"\r\n        mat-icon-button>\r\n        <mat-icon class=\"mat-icon-rtl-mirror blur-icon\" [class.favorite]=\"true\">\r\n          {{node.favorite && node.id !== hoverFavoriteNodeId && !favoriteMode\r\n          ? 'star_rate_outline' :\r\n          (hoverFavoriteNodeId !== null || (isHover && node.id === hoverNode.id)) && !favoriteMode ? 'star_border' : ''\r\n          }}\r\n          {{node.id === hoverNode.id && favoriteMode && isHover ? 'close' : ''}}\r\n        </mat-icon>\r\n      </button>\r\n      <button tabindex=\"-1\" class=\"button-icon add-icon\" *ngIf=\"node.id === hoverNode.id && showAddIcon\"\r\n        matTooltip=\"{{addNodeTooltip}}\" (click)=\"addNewNode(node.id, $event)\" mode=\"dark\" position=\"below\"\r\n        mat-icon-button>\r\n        <mat-icon class=\"mat-icon-rtl-mirror add-icon\">\r\n          add\r\n        </mat-icon>\r\n      </button>\r\n    </div>\r\n  </mat-tree-node>\r\n  <!-- This is the tree node template for expandable nodes -->\r\n  <mat-tree-node *matTreeNodeDef=\"let node;when: hasChild\" routerLinkActive=\"active\" (mouseover)=\"onOver(node)\"\r\n    matTreeNodePadding matTreeNodePaddingIndent=\"34\" cdkDrag [cdkDragData]=\"node\" (mouseenter)=\"dragHover(node)\"\r\n    (mouseleave)=\"dragHoverEnd()\" (cdkDragStarted)=\"dragStart()\" (cdkDragReleased)=\"dragEnd()\" [ngClass]=\"\r\n    {'expand-node' : treeControl.isExpanded(node), 'collapse-node': !treeControl.isExpanded(node)}\">\r\n    <div *ngIf=\"!node.isReadOnly\" (click)=\"onClickNode(node.id)\"\r\n      class=\"tree-content\" (keydown)=\"onKeyDownNode($event, node)\">\r\n      <span class=\"span-text\" mode=\"dark\" position=\"below\">{{ node.name }}</span>\r\n      <button tabindex=\"-1\" class=\"button-icon space-icon collapse-expand-icon\" mat-icon-button matTreeNodeToggle\r\n        [attr.aria-label]=\"'toggle ' + node.name\" (click)=\"onClickToggleNode(node)\">\r\n        <mat-icon class=\"mat-icon-rtl-mirror arrow-icon left-icon\">\r\n          {{treeControl.isExpanded(node) ? 'expand_less' : 'expand_more'}}\r\n        </mat-icon>\r\n      </button>\r\n      <button tabindex=\"-1\" class=\"button-icon add-icon\"\r\n        matTooltip=\"{{!node.favorite ? addFavoriteTooltip : deleteFavoriteTooltip}}\"\r\n        *ngIf=\"showFavoriteIcon && (node.id === hoverNode.id || node.favorite)\"\r\n        (click)=\"addFavoriteNode(node.id, $event)\"\r\n        [ngClass]=\"{'btn-favorite': (node.id === hoverNode.id && showAddIcon)}\" (mouseenter)=\"setHoverFavorite(node.id)\"\r\n        (mouseleave)=\"setHoverFavorite(null)\" mode=\"dark\" position=\"below\" mat-icon-button>\r\n        <mat-icon class=\"mat-icon-rtl-mirror blur-icon\" [class.favorite]=\"true\">\r\n          {{node.favorite && node.id !== hoverFavoriteNodeId && !favoriteMode\r\n          ? 'star_rate_outline' :\r\n          (hoverFavoriteNodeId !== null || (isHover && node.id === hoverNode.id)) && !favoriteMode ? 'star_border' : ''\r\n          }}\r\n          {{node.id === hoverNode.id && favoriteMode && isHover ? 'close' : ''}}\r\n        </mat-icon>\r\n      </button>\r\n      <button tabindex=\"-1\" class=\"button-icon add-icon\" *ngIf=\"node.id === hoverNode.id && showAddIcon\"\r\n        matTooltip=\"{{addNodeTooltip}}\" (click)=\"addNewNode(node.id, $event)\" mat-icon-button>\r\n        <mat-icon class=\"mat-icon-rtl-mirror add-icon\">\r\n          add\r\n        </mat-icon>\r\n      </button>\r\n    </div>\r\n  </mat-tree-node>\r\n</mat-tree>",
+                    styles: ["::ng-deep mat-tree.qms-navigation-drawer-container .mat-tree-node{width:272px!important;height:48px!important}::ng-deep mat-tree.qms-navigation-drawer-container .mat-tree-node{min-height:34px;margin:16px 0;padding-right:34px}::ng-deep mat-tree.qms-navigation-drawer-container .mat-tree-node .tree-content{width:100%;position:relative;cursor:pointer}::ng-deep mat-tree.qms-navigation-drawer-container .mat-tree-node .arrow-icon{color:#00324e}::ng-deep mat-tree.qms-navigation-drawer-container .mat-tree-node .collapse-expand-icon{color:#3e57b7}::ng-deep mat-tree.qms-navigation-drawer-container .mat-tree-node .collapse-expand-icon:hover{background:rgba(0,0,0,.08)}::ng-deep mat-tree.qms-navigation-drawer-container .mat-tree-node .add-icon{color:#3e57b7}::ng-deep mat-tree.qms-navigation-drawer-container .mat-tree-node .add-icon:hover{background:rgba(0,0,0,.08)}::ng-deep mat-tree.qms-navigation-drawer-container .mat-tree-node .left-icon{color:#919191}::ng-deep mat-tree.qms-navigation-drawer-container .mat-tree-node.expand-node{padding-left:0;position:static;height:32px;left:calc(50% - 216px/2);top:0;font-family:Open Sans;font-style:normal;font-weight:400;font-size:14px;line-height:19px;display:flex;align-items:center;color:#1954a9;flex:none;order:0;align-self:stretch;flex-grow:1}::ng-deep mat-tree.qms-navigation-drawer-container .mat-tree-node.expand-node ::ng-deep mat-icon{color:#1954a9!important}::ng-deep mat-tree.qms-navigation-drawer-container .mat-tree-node.collapse-node{position:static;height:32px;left:calc(50% - 176px/2);top:0;font-family:Open Sans;font-style:normal;font-weight:400;font-size:14px;line-height:19px;display:flex;align-items:center;color:#323232;flex:none;order:0;align-self:stretch;flex-grow:1}::ng-deep mat-tree.qms-navigation-drawer-container .mat-tree-node .tree-content .button-icon{width:30px;height:30px;line-height:30px!important;border-radius:50%}::ng-deep mat-tree.qms-navigation-drawer-container .mat-tree-node .tree-content .button-icon:hover{border-radius:50%}::ng-deep mat-tree.qms-navigation-drawer-container .mat-tree-node .tree-content .img-icon{max-height:25px;max-width:25px}::ng-deep mat-tree.qms-navigation-drawer-container .mat-tree-node .tree-content .add-icon{position:absolute;top:-2px;right:-34px}::ng-deep mat-tree.qms-navigation-drawer-container .mat-tree-node .tree-content .add-icon mat-icon{top:3px;right:3px;border-radius:50%}::ng-deep mat-tree.qms-navigation-drawer-container .mat-tree-node .tree-content .favorite{color:#b13514}::ng-deep mat-tree.qms-navigation-drawer-container .mat-tree-node .tree-content .btn-favorite{right:-5px;color:unset}::ng-deep mat-tree.qms-navigation-drawer-container .mat-tree-node .tree-content .space-icon{position:absolute;top:-5px;left:0}::ng-deep mat-tree.qms-navigation-drawer-container .mat-tree-node .tree-content .span-text{position:relative;overflow:hidden;text-overflow:ellipsis;padding-left:42px;max-width:calc(100% - 56px);display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}::ng-deep mat-tree.qms-navigation-drawer-container .mat-tree-node .tree-content .span-text:after{content:\"\";display:block;clear:both}::ng-deep mat-tree.qms-navigation-drawer-container .mat-tree-node:first-child{margin:0}::ng-deep mat-tree.qms-navigation-drawer-container .mat-tree-node.collapse-node:hover{background:#00000014}::ng-deep mat-tree.qms-navigation-drawer-container .mat-tree-node.collapse-node:active{background:#0000001f}::ng-deep mat-tree.qms-navigation-drawer-container .mat-tree-node.expand-node:active{background:#f2f7fd}"]
+                },] }
+    ];
+    QMSNavigationDrawerComponent.ctorParameters = function () { return []; };
+    QMSNavigationDrawerComponent.propDecorators = {
+        treeData: [{ type: i0.Input }],
+        showFavoriteIcon: [{ type: i0.Input }],
+        favoriteMode: [{ type: i0.Input }],
+        addNodeEvent: [{ type: i0.Output }],
+        addFavoriteEvent: [{ type: i0.Output }],
+        drogLocationEvent: [{ type: i0.Output }],
+        showAddIcon: [{ type: i0.Input }],
+        openNodes: [{ type: i0.Input }],
+        dragDropListDisabled: [{ type: i0.Input }],
+        nodesExpand: [{ type: i0.Output }],
+        filterText: [{ type: i0.Input }],
+        faIconPath: [{ type: i0.Input }],
+        onClickNodeEvent: [{ type: i0.Output }],
+        addFavoriteTooltip: [{ type: i0.Input }],
+        deleteFavoriteTooltip: [{ type: i0.Input }],
+        addNodeTooltip: [{ type: i0.Input }]
+    };
+
+    var QMSNavigationDrawerModule = /** @class */ (function () {
+        function QMSNavigationDrawerModule() {
+        }
+        return QMSNavigationDrawerModule;
+    }());
+    QMSNavigationDrawerModule.decorators = [
+        { type: i0.NgModule, args: [{
+                    declarations: [
+                        QMSNavigationDrawerComponent
+                    ],
+                    imports: [
+                        common.CommonModule,
+                        icon.MatIconModule,
+                        toolbar.MatToolbarModule,
+                        button.MatButtonModule,
+                        QMSButtonModule,
+                        tooltip.MatTooltipModule,
+                        dragDrop.DragDropModule,
+                        tree$1.MatTreeModule
+                    ],
+                    exports: [
+                        QMSNavigationDrawerComponent
+                    ]
+                },] }
+    ];
+
     /*
      * Public API Surface of qms-angular
      */
@@ -18249,6 +20902,7 @@
     exports.ButtonToggleChange = ButtonToggleChange;
     exports.CHECKLIST_ICON = CHECKLIST_ICON;
     exports.CKEditorEventConst = CKEditorEventConst;
+    exports.CdkDetailRowDirective = CdkDetailRowDirective;
     exports.ConfirmDialog = ConfirmDialog;
     exports.DEPARTMENT_FOLDER_ICON = DEPARTMENT_FOLDER_ICON;
     exports.DEPARTMENT_FOLDER_OUTLINED_ICON = DEPARTMENT_FOLDER_OUTLINED_ICON;
@@ -18263,7 +20917,6 @@
     exports.ENTERPRISE_FOLDER_OUTLINED_ICON = ENTERPRISE_FOLDER_OUTLINED_ICON;
     exports.FlowChartConst = FlowChartConst;
     exports.ISelectOneItem = ISelectOneItem;
-    exports.IconModel = IconModel;
     exports.InformationCoverItem = InformationCoverItem;
     exports.KEYBOARD_DOWN_ICON = KEYBOARD_DOWN_ICON;
     exports.KEYBOARD_UP_ICON = KEYBOARD_UP_ICON;
@@ -18272,11 +20925,14 @@
     exports.MarginDirective = MarginDirective;
     exports.NORMAL_FOLDER_ICON = NORMAL_FOLDER_ICON;
     exports.NORMAL_FOLDER_OUTLINED_ICON = NORMAL_FOLDER_OUTLINED_ICON;
+    exports.NewTreeComponent = NewTreeComponent;
+    exports.NewTreeModel = NewTreeModel;
     exports.PROCESS_AREA_ICON = PROCESS_AREA_ICON;
     exports.PROCESS_AREA_OUTLINED_ICON = PROCESS_AREA_OUTLINED_ICON;
     exports.PROCESS_ICON = PROCESS_ICON;
     exports.PopupData = PopupData;
     exports.QMSAnchor = QMSAnchor;
+    exports.QMSAppBar = QMSAppBar;
     exports.QMSAppIconModule = QMSAppIconModule;
     exports.QMSAttachmentListDirective = QMSAttachmentListDirective;
     exports.QMSBreadcrumb = QMSBreadcrumb;
@@ -18320,6 +20976,7 @@
     exports.QMSChipInputSelectDropWDownDirective = QMSChipInputSelectDropWDownDirective;
     exports.QMSChipInputSelectFieldDirective = QMSChipInputSelectFieldDirective;
     exports.QMSChipInputSelectTriggerDirective = QMSChipInputSelectTriggerDirective;
+    exports.QMSCollapseGroupDirective = QMSCollapseGroupDirective;
     exports.QMSComment = QMSComment;
     exports.QMSConfirmDialog = QMSConfirmDialog;
     exports.QMSDialogConfig = QMSDialogConfig;
@@ -18353,12 +21010,18 @@
     exports.QMSListLeadingIcon = QMSListLeadingIcon;
     exports.QMSListLine = QMSListLine;
     exports.QMSListModule = QMSListModule;
+    exports.QMSNavigationDrawerComponent = QMSNavigationDrawerComponent;
+    exports.QMSNavigationDrawerModule = QMSNavigationDrawerModule;
+    exports.QMSNewTreeModule = QMSNewTreeModule;
+    exports.QMSProcessDocumentItem = QMSProcessDocumentItem;
     exports.QMSRangeSliderDirective = QMSRangeSliderDirective;
     exports.QMSRangeSliderLockUpDirective = QMSRangeSliderLockUpDirective;
     exports.QMSRelatedGlobalService = QMSRelatedGlobalService;
     exports.QMSRelatedModule = QMSRelatedModule;
     exports.QMSRichText = QMSRichText;
     exports.QMSRichTextModule = QMSRichTextModule;
+    exports.QMSRowDetailDirective = QMSRowDetailDirective;
+    exports.QMSRowExpandDirective = QMSRowExpandDirective;
     exports.QMSScrolableAttachmentListDirective = QMSScrolableAttachmentListDirective;
     exports.QMSScrollbarDirective = QMSScrollbarDirective;
     exports.QMSSearchFieldDirective = QMSSearchFieldDirective;
@@ -18366,14 +21029,20 @@
     exports.QMSSelectIncludeChildrenModule = QMSSelectIncludeChildrenModule;
     exports.QMSSelectOneGlobalService = QMSSelectOneGlobalService;
     exports.QMSSelectOneModule = QMSSelectOneModule;
+    exports.QMSSelectProcessDocumentGlobalService = QMSSelectProcessDocumentGlobalService;
+    exports.QMSSelectProcessDocumentModule = QMSSelectProcessDocumentModule;
     exports.QMSSnackbarConfig = QMSSnackbarConfig;
     exports.QMSSuffixDirective = QMSSuffixDirective;
     exports.QMSSuffixFieldDirective = QMSSuffixFieldDirective;
     exports.QMSTabGroupAdvancedDirective = QMSTabGroupAdvancedDirective;
     exports.QMSTabGroupDirective = QMSTabGroupDirective;
     exports.QMSTabLabelDirective = QMSTabLabelDirective;
+    exports.QMSTabModule = QMSTabModule;
     exports.QMSTableAction = QMSTableAction;
     exports.QMSTableActionBlock = QMSTableActionBlock;
+    exports.QMSTableChildrenDirective = QMSTableChildrenDirective;
+    exports.QMSTableDirective = QMSTableDirective;
+    exports.QMSTableExpandDirective = QMSTableExpandDirective;
     exports.QMSTableModule = QMSTableModule;
     exports.QMSTextBlockDirective = QMSTextBlockDirective;
     exports.QMSTextBlockLine = QMSTextBlockLine;
@@ -18404,11 +21073,15 @@
     exports.QmsReportContentPortraitComponent = QmsReportContentPortraitComponent;
     exports.QmsReportCoverPortraitComponent = QmsReportCoverPortraitComponent;
     exports.QmsReportModule = QmsReportModule;
+    exports.QmsStatusDropdownComponent = QmsStatusDropdownComponent;
+    exports.QmsStatusDropdownModule = QmsStatusDropdownModule;
+    exports.QmsStatusDropdownOption = QmsStatusDropdownOption;
     exports.QmsStepperComponent = QmsStepperComponent;
     exports.QmsStepperModule = QmsStepperModule;
     exports.REGIONAL_FOLDER_ICON = REGIONAL_FOLDER_ICON;
     exports.REGIONAL_FOLDER_OUTLINED_ICON = REGIONAL_FOLDER_OUTLINED_ICON;
     exports.RISK_ICON = RISK_ICON;
+    exports.RelatedConst = RelatedConst;
     exports.RelatedContentComponent = RelatedContentComponent;
     exports.RelatedListComponent = RelatedListComponent;
     exports.RelatedPopupComponent = RelatedPopupComponent;
@@ -18428,14 +21101,15 @@
     exports.SelectOnePopupData = SelectOnePopupData;
     exports.SelectOption = SelectOption;
     exports.SelectPopupData = SelectPopupData;
+    exports.SelectProcessDocumentPopupComponent = SelectProcessDocumentPopupComponent;
+    exports.SelectProcessDocumentPopupData = SelectProcessDocumentPopupData;
     exports.SelectedOption = SelectedOption;
+    exports.SelectedProcessDocumentItem = SelectedProcessDocumentItem;
     exports.SharedModule = SharedModule;
     exports.ShowHideSearchResultConst = ShowHideSearchResultConst;
     exports.SideNav = SideNav;
     exports.SideNavItem = SideNavItem;
     exports.SidenavComponent = SidenavComponent;
-    exports.StepModel = StepModel;
-    exports.TestOnlyComponent = TestOnlyComponent;
     exports.TranslateLibraryService = TranslateLibraryService;
     exports.TreeComponent = TreeComponent;
     exports.TreeConfig = TreeConfig;