@colijnit/corecomponents_v12 12.2.13 → 12.2.15

package/bundles/colijnit-corecomponents_v12.umd.js

@@ -1422,6 +1422,7 @@
         CoreComponentsIcon["CashRegisterSimple"] = "cash_register_simple";
         CoreComponentsIcon["ChangeLocation"] = "change_location";
         CoreComponentsIcon["Check"] = "check";
+        CoreComponentsIcon["CheckDuotone"] = "check_duotone";
         CoreComponentsIcon["CheckRound"] = "check_round";
         CoreComponentsIcon["CheckRoundOpen"] = "check_round_open";
         CoreComponentsIcon["CheckSimple"] = "check_simple";
@@ -1720,6 +1721,7 @@
         "cash_register_simple": "<svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 512 512\"><path style= \"fill: #484f60\" d=\"M288 0C305.7 0 320 14.33 320 32V96C320 113.7 305.7 128 288 128H208V160H424.1C456.6 160 483.5 183.1 488.2 214.4L510.9 364.1C511.6 368.8 512 373.6 512 378.4V448C512 483.3 483.3 512 448 512H64C28.65 512 0 483.3 0 448V378.4C0 373.6 .3622 368.8 1.083 364.1L23.76 214.4C28.5 183.1 55.39 160 87.03 160H143.1V128H63.1C46.33 128 31.1 113.7 31.1 96V32C31.1 14.33 46.33 0 63.1 0L288 0zM96 48C87.16 48 80 55.16 80 64C80 72.84 87.16 80 96 80H256C264.8 80 272 72.84 272 64C272 55.16 264.8 48 256 48H96zM80 448H432C440.8 448 448 440.8 448 432C448 423.2 440.8 416 432 416H80C71.16 416 64 423.2 64 432C64 440.8 71.16 448 80 448zM112 216C98.75 216 88 226.7 88 240C88 253.3 98.75 264 112 264C125.3 264 136 253.3 136 240C136 226.7 125.3 216 112 216zM208 264C221.3 264 232 253.3 232 240C232 226.7 221.3 216 208 216C194.7 216 184 226.7 184 240C184 253.3 194.7 264 208 264zM160 296C146.7 296 136 306.7 136 320C136 333.3 146.7 344 160 344C173.3 344 184 333.3 184 320C184 306.7 173.3 296 160 296zM304 264C317.3 264 328 253.3 328 240C328 226.7 317.3 216 304 216C290.7 216 280 226.7 280 240C280 253.3 290.7 264 304 264zM256 296C242.7 296 232 306.7 232 320C232 333.3 242.7 344 256 344C269.3 344 280 333.3 280 320C280 306.7 269.3 296 256 296zM400 264C413.3 264 424 253.3 424 240C424 226.7 413.3 216 400 216C386.7 216 376 226.7 376 240C376 253.3 386.7 264 400 264zM352 296C338.7 296 328 306.7 328 320C328 333.3 338.7 344 352 344C365.3 344 376 333.3 376 320C376 306.7 365.3 296 352 296z\"/></svg>",
         "change_location": "<svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 50 50\"><polygon points=\"16.96 25 24.27 32.31 24.27 27.76 29.09 27.76 29.09 22.23 24.27 22.23 24.27 17.69 16.96 25\" fill=\"#484f60\"/><polygon points=\"16.21 23.18 10 23.18 10 26.82 16.21 26.82 14.39 25 16.21 23.18\" fill=\"#484f60\"/><polygon points=\"10 14.77 10 18.4 20.99 18.4 24.63 14.77 10 14.77\" fill=\"#484f60\"/><polygon points=\"10 31.6 10 35.23 24.63 35.23 20.99 31.6 10 31.6\" fill=\"#484f60\"/><polygon points=\"31.35 13.84 35.45 11.47 39.55 13.83 35.45 16.2 31.35 13.84\" fill=\"#484f60\"/><polygon points=\"40 19.32 39.99 14.59 35.89 16.96 35.9 18.05 39.06 19.86 40 19.32\" fill=\"#484f60\" opacity=\"0.5\"/><polygon points=\"35.02 16.96 30.91 14.6 30.92 19.34 31.84 19.87 35.02 18.03 35.02 16.96\" fill=\"#484f60\" opacity=\"0.25\"/><polygon points=\"31.35 22.26 35.45 19.88 39.55 22.24 35.45 24.62 31.35 22.26\" fill=\"#484f60\"/><polygon points=\"40 27.74 39.99 23 35.89 25.38 35.9 26.46 39.06 28.28 40 27.74\" fill=\"#484f60\" opacity=\"0.5\"/><polygon points=\"35.02 25.38 30.91 23.02 30.92 27.75 31.84 28.29 35.02 26.45 35.02 25.38\" fill=\"#484f60\" opacity=\"0.25\"/><polygon points=\"31.35 30.67 35.45 28.3 39.55 30.66 35.45 33.03 31.35 30.67\" fill=\"#484f60\"/><polygon points=\"35.89 33.79 39.99 31.42 40 36.15 35.9 38.53 35.89 33.79\" fill=\"#484f60\" opacity=\"0.5\"/><polygon points=\"30.92 36.17 30.91 31.43 35.02 33.8 35.03 38.53 30.92 36.17\" fill=\"#484f60\" opacity=\"0.25\"/></svg>",
         "check": "<svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 50 50\"><polygon points=\"16.97 22.92 20.78 28.61 29.96 13 36.16 13 20.78 37 13.84 26.9 16.97 22.92\" fill=\"#484f60\"/></svg>",
+        "check_duotone": "<svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 448 512\"><defs><style>.fa-secondary{opacity:.4}</style></defs><path class=\"fa-primary\" d=\"M438.6 105.4C451.1 117.9 451.1 138.1 438.6 150.6L182.6 406.6C170.1 419.1 149.9 419.1 137.4 406.6L9.372 278.6C-3.124 266.1-3.124 245.9 9.372 233.4C21.87 220.9 42.13 220.9 54.63 233.4L159.1 338.7L393.4 105.4C405.9 92.88 426.1 92.88 438.6 105.4H438.6z\"/></svg>",
         "check_round": "<svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 50 50\"><path d=\"M25,10A15,15,0,1,0,40,25,15,15,0,0,0,25,10ZM23,34l-6.24-9.09,2.81-3.59L23,26.45,27.66,16h5.58Z\" fill=\"#484f60\"/></svg>",
         "check_round_open": "<svg version=\"1.1\" xmlns=\"http://www.w3.org/2000/svg\" x=\"0px\" y=\"0px\" viewBox=\"0 0 50 50\" enable-background=\"new 0 0 50 50\" ><g><path fill=\"#2A363B\" d=\"M40.5,25.5C40.5,34,33.5,41,25,41S9.5,34,9.5,25.5S16.5,10,25,10S40.5,16.9,40.5,25.5z M10.5,25.5C10.5,33.5,17,40,25,40s14.5-6.5,14.5-14.5S33,11,25,11S10.5,17.5,10.5,25.5z\"/></g><polygon fill=\"#2A363B\" points=\"19.9,24 22.5,28 29,17.1 33.3,17.1 22.5,33.9 17.7,26.8 \"/></svg>",
         "check_simple": "<svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 50 50\"><polygon fill=\"#2A363B\" points=\"19.9,24 22.5,28 29,17.1 33.3,17.1 22.5,33.9 17.7,26.8 \"/></svg>",
@@ -6312,7 +6314,7 @@
     InputTextComponent.decorators = [
         { type: i0.Component, args: [{
                     selector: 'co-input-text',
-                    template: "\n    <div class=\"input-text-wrapper\" overlayParent #parentForOverlay=\"overlayParent\">\n      <co-icon *ngIf=\"leftIcon || leftIconData\" class=\"input-text-left-icon\" [icon]=\"leftIcon\" [iconData]=\"leftIconData\"\n               (click)=\"handleLeftIconClick($event)\" (mousedown)=\"handleLeftIconMouseDown($event)\"\n               (mouseup)=\"handleLeftIconMouseUp($event)\"></co-icon>\n      <div *ngIf=\"leftIcon || leftIconData\" class=\"spacer left-icon\"></div>\n      <div class=\"input-wrapper\">\n        <label *ngIf=\"showPlaceholderOnFocus || (!showPlaceholderOnFocus && !hasValue && !focused)\"\n               [textContent]=\"placeholder\"></label>\n        <input #input\n               [class.input-input-hidden]=\"useContent\"\n               [ngClass]=\"align\"\n               [type]=\"digitsOnly ? 'number' : type\"\n               [pattern]=\"type === 'date' ? pattern : undefined\"\n               [ngModel]=\"model\"\n               [min]=\"(type === 'number' || type === 'date') && this.min ? this.min : undefined\"\n               [max]=\"(type === 'number' || type === 'date') && this.max ? this.max : undefined\"\n               [readonly]=\"readonly\"\n               [required]=\"required\"\n               (ngModelChange)=\"modelChange.emit($event)\"\n               (keydown)=\"digitsOnly ? excludeNonDigitChars($event) : true\"\n        >\n        <ng-container *ngIf=\"useContent\">\n          <div class=\"input-content-wrapper\">\n            <ng-content></ng-content>\n          </div>\n        </ng-container>\n        <co-icon [class.show]=\"showClearButton && hasValue && focused && !readonly\" class=\"input-text-clear-button\" [icon]=\"icons.CrossSkinny\" (click)=\"clearInput($event)\"></co-icon>\n        <div class=\"required-indicator\"></div>\n      </div>\n      <div *ngIf=\"rightIcon || rightIconData\" class=\"spacer right-icon\"></div>\n      <co-icon *ngIf=\"rightIcon || rightIconData\" class=\"input-text-right-icon\" [icon]=\"rightIcon\" [iconData]=\"rightIconData\"\n               (click)=\"handleRightIconClick($event)\" (mousedown)=\"handleRightIconMouseDown($event)\" (mouseup)=\"handleRightIconMouseUp($event)\"></co-icon>\n    </div>\n    <!--\n            <co-commit-buttons *ngIf=\"showSaveCancel && focused && canSaveOrCancel\"\n                               [committing]=\"committing\"\n                               [commitFinished]=\"commitFinished\"\n                               (commitClick)=\"commitClick($event)\"\n                               (cancelClick)=\"cancelClick($event)\"\n            >\n            </co-commit-buttons>\n    -->\n  ",
+                    template: "\n    <div class=\"input-text-wrapper\" overlayParent #parentForOverlay=\"overlayParent\">\n      <co-icon *ngIf=\"leftIcon || leftIconData\" class=\"input-text-left-icon\" [icon]=\"leftIcon\" [iconData]=\"leftIconData\"\n               (click)=\"handleLeftIconClick($event)\" (mousedown)=\"handleLeftIconMouseDown($event)\"\n               (mouseup)=\"handleLeftIconMouseUp($event)\"></co-icon>\n      <div *ngIf=\"leftIcon || leftIconData\" class=\"spacer left-icon\"></div>\n      <div class=\"input-wrapper\">\n        <label *ngIf=\"showPlaceholderOnFocus || (!showPlaceholderOnFocus && !hasValue && !focused)\"\n               [textContent]=\"placeholder\"></label>\n        <input #input\n               [class.input-input-hidden]=\"useContent\"\n               [ngClass]=\"align\"\n               [type]=\"digitsOnly ? 'number' : type\"\n               [pattern]=\"type === 'date' ? pattern : undefined\"\n               [ngModel]=\"model\"\n               [min]=\"(type === 'number' || type === 'date') && this.min ? this.min : undefined\"\n               [max]=\"(type === 'number' || type === 'date') && this.max ? this.max : undefined\"\n               [readonly]=\"readonly\"\n               [required]=\"required\"\n               (ngModelChange)=\"modelChange.emit($event)\"\n               (keydown)=\"digitsOnly ? excludeNonDigitChars($event) : true\"\n               (keyup)=\"keyUp.emit($event)\"\n        >\n        <ng-container *ngIf=\"useContent\">\n          <div class=\"input-content-wrapper\">\n            <ng-content></ng-content>\n          </div>\n        </ng-container>\n        <co-icon [class.show]=\"showClearButton && hasValue && focused && !readonly\" class=\"input-text-clear-button\" [icon]=\"icons.CrossSkinny\" (click)=\"clearInput($event)\"></co-icon>\n        <div class=\"required-indicator\"></div>\n      </div>\n      <div *ngIf=\"rightIcon || rightIconData\" class=\"spacer right-icon\"></div>\n      <co-icon *ngIf=\"rightIcon || rightIconData\" class=\"input-text-right-icon\" [icon]=\"rightIcon\" [iconData]=\"rightIconData\"\n               (click)=\"handleRightIconClick($event)\" (mousedown)=\"handleRightIconMouseDown($event)\" (mouseup)=\"handleRightIconMouseUp($event)\"></co-icon>\n    </div>\n    <!--\n            <co-commit-buttons *ngIf=\"showSaveCancel && focused && canSaveOrCancel\"\n                               [committing]=\"committing\"\n                               [commitFinished]=\"commitFinished\"\n                               (commitClick)=\"commitClick($event)\"\n                               (cancelClick)=\"cancelClick($event)\"\n            >\n            </co-commit-buttons>\n    -->\n  ",
                     providers: [
                         OverlayService, {
                             provide: SCREEN_CONFIG_ADAPTER_COMPONENT_INTERFACE_NAME,
@@ -8164,7 +8166,7 @@
     InputSearchComponent.decorators = [
         { type: i0.Component, args: [{
                     selector: 'co-input-search',
-                    template: "\n    <co-input-text\n      [ngClass]=\"customCssClass\"\n      [model]=\"model\"\n      [leftIcon]=\"useLeftIcon ? searchIcon : null\"\n      [rightIcon]=\"useRightIcon ? searchIcon : null\"\n      [leftIconData]=\"useLeftIcon && leftIconData ? leftIconData : undefined\"\n      [rightIconData]=\"useRightIcon && rightIconData ? rightIconData : undefined\"\n      [placeholder]=\"placeholder\"\n      [customHeight]=\"true\"\n      [showPlaceholderOnFocus]=\"false\"\n      (modelChange)=\"modelChange.emit($event)\"\n      (leftIconClick)=\"leftIconClick.emit($event)\"\n      (rightIconClick)=\"rightIconClick.emit($event)\"\n    ></co-input-text>\n  ",
+                    template: "\n    <co-input-text\n      [ngClass]=\"customCssClass\"\n      [model]=\"model\"\n      [leftIcon]=\"useLeftIcon ? searchIcon : null\"\n      [rightIcon]=\"useRightIcon ? searchIcon : null\"\n      [leftIconData]=\"useLeftIcon && leftIconData ? leftIconData : undefined\"\n      [rightIconData]=\"useRightIcon && rightIconData ? rightIconData : undefined\"\n      [placeholder]=\"placeholder\"\n      [customHeight]=\"true\"\n      [showPlaceholderOnFocus]=\"false\"\n      (modelChange)=\"modelChange.emit($event)\"\n      (leftIconClick)=\"leftIconClick.emit($event)\"\n      (rightIconClick)=\"rightIconClick.emit($event)\"\n      (keyup)=\"keyUp.emit($event)\"\n    ></co-input-text>\n  ",
                     providers: [
                         OverlayService
                     ],
@@ -9899,6 +9901,9 @@
                 this.validateAndSave();
             }
         };
+        SimpleGridComponent.prototype.handleClickOutsideRow = function () {
+            this.validateAndSave();
+        };
         SimpleGridComponent.prototype.isRowDisabled = function (row) {
             if (this.rowDisabledFn && (typeof this.rowDisabledFn === 'function')) {
                 return this.rowDisabledFn.call(this, row);
@@ -9916,26 +9921,34 @@
             return !!singleColumn;
         };
         SimpleGridComponent.prototype.addNewRow = function () {
-            var _this = this;
-            if (this.inlineEdit) {
-                var valid = this.validateAndSave();
-                this._detectChanges();
-                if (valid) {
-                    this.data.push({});
-                    this._newRow = true;
-                    this.editRowIndex = this.data.length - 1;
-                    this._nextAvailableCellToEdit(true).then(function (index) {
-                        _this.editCellIndex = index;
-                        _this._detectChanges();
-                    });
-                    this.editing = true;
-                    this.rowToEdit = this.data[this.data.length - 1];
-                    this._detectChanges();
-                }
-            }
-            else {
-                this.addRow.next();
-            }
+            return __awaiter(this, void 0, void 0, function () {
+                var valid, _a;
+                return __generator(this, function (_b) {
+                    switch (_b.label) {
+                        case 0:
+                            if (!this.inlineEdit) return [3 /*break*/, 3];
+                            valid = this.validateAndSave();
+                            if (!valid) return [3 /*break*/, 2];
+                            this.data.push({});
+                            this._detectChanges();
+                            this._newRow = true;
+                            this.editing = true;
+                            this.editRowIndex = this.data.length - 1;
+                            this.rowToEdit = this.data[this.editRowIndex];
+                            _a = this;
+                            return [4 /*yield*/, this._nextAvailableCellToEdit(true)];
+                        case 1:
+                            _a.editCellIndex = _b.sent();
+                            this._detectChanges();
+                            _b.label = 2;
+                        case 2: return [3 /*break*/, 4];
+                        case 3:
+                            this.addRow.next();
+                            _b.label = 4;
+                        case 4: return [2 /*return*/];
+                    }
+                });
+            });
         };
         SimpleGridComponent.prototype.validateAndSave = function (stopediting) {
             if (stopediting === void 0) { stopediting = true; }
@@ -9960,8 +9973,7 @@
             else {
                 this.data[this.editRowIndex] = this.rowToEdit;
             }
-            this._newRow = false;
-            this.editing = false;
+            this._resetEdit();
             this._detectChanges();
         };
         SimpleGridComponent.prototype.removeRow = function () {
@@ -9982,7 +9994,7 @@
         };
         SimpleGridComponent.prototype.selectTheRow = function (index, emit) {
             if (emit === void 0) { emit = true; }
-            if (this.selectedRowIndex !== index && ((this.editing && this.validateAndSave()) || !this.editing)) {
+            if (this.selectedRowIndex === -1 || (this.selectedRowIndex !== index && ((this.editing && this.validateAndSave()) || !this.editing))) {
                 this.selectedRowIndex = index;
             }
             if (emit) {
@@ -10003,18 +10015,31 @@
             }
             this._resetDblClick();
         };
-        SimpleGridComponent.prototype.editRow = function (event) {
+        SimpleGridComponent.prototype.editRow = function (event, selectCell) {
             var _this = this;
+            if (selectCell === void 0) { selectCell = true; }
             this.editRowIndex = this.selectedRowIndex;
             this.rowToEdit = this.data[this.editRowIndex];
             this.editing = true;
-            this._nextAvailableCellToEdit(true).then(function (index) {
-                _this.editCellIndex = index;
-            });
+            if (selectCell) {
+                this._nextAvailableCellToEdit(true).then(function (index) {
+                    _this.editCellIndex = index;
+                });
+            }
             this._detectChanges();
         };
-        SimpleGridComponent.prototype.handleCellClick = function (index) {
-            this.editCellIndex = index;
+        SimpleGridComponent.prototype.handleCellClick = function (event, row, rowIndex, cellIndex) {
+            if (this.isRowDisabled(row)) {
+                this.selectedRowIndex = -1;
+                return;
+            }
+            this.selectTheRow(rowIndex, false);
+            if (this.inlineEdit) {
+                this.editRowIndex = rowIndex;
+                this.editCellIndex = cellIndex;
+                this.editing = true;
+                this.editRow(event, false);
+            }
             this._detectChanges();
         };
         SimpleGridComponent.prototype._resetDblClick = function () {
@@ -10136,10 +10161,7 @@
             }
             this._newRow = false;
             if (stopediting) {
-                this.editRowIndex = -1;
-                this.editCellIndex = -1;
-                this.editing = false;
-                this.rowToEdit = undefined;
+                this._resetEdit();
             }
             this._detectChanges();
         };
@@ -10155,12 +10177,20 @@
         SimpleGridComponent.prototype._detectChanges = function () {
             this._changeDetection.detectChanges();
         };
+        SimpleGridComponent.prototype._resetEdit = function () {
+            this._newRow = false;
+            this.selectedRowIndex = -1;
+            this.editRowIndex = -1;
+            this.editCellIndex = -1;
+            this.editing = false;
+            this.rowToEdit = undefined;
+        };
         return SimpleGridComponent;
     }(BaseSimpleGridComponent));
     SimpleGridComponent.decorators = [
         { type: i0.Component, args: [{
                     selector: 'co-simple-grid',
-                    template: "\n    <co-grid-toolbar *ngIf=\"showToolbar\" [class.right]=\"rightToolbar\"\n                     [showEdit]=\"showEdit\"\n                     [showAdd]=\"showAdd\"\n                     [showDelete]=\"showDelete\"\n                     [deleteEnabled]=\"selectedRowIndex > -1\"\n                     (addClick)=\"addNewRow()\"\n                     (editClick)=\"editRow($event)\"\n                     (saveClick)=\"validateAndSave()\"\n                     (cancelClick)=\"cancelEditRow()\"\n                     (deleteClick)=\"removeRow()\"\n    ></co-grid-toolbar>\n    <table class=\"simple-grid-table\">\n      <colgroup>\n        <col *ngFor=\"let column of headerColumns; let index = index\"\n             [class.simple-grid-column-auto-fit]=\"column.autoFit\"\n             [style.width.px]=\"column.width\"\n             [style.min-width.px]=\"MIN_COLUMN_WIDTH\">\n      </colgroup>\n      <thead>\n      <tr>\n        <th scope=\"col\" #headerCell class=\"simple-grid-column-header\" *ngFor=\"let column of headerColumns; let index = index\">\n          <div class=\"simple-grid-column-header-wrapper\" [class.resizable]=\"resizable\"\n               [ngClass]=\"column.textAlign ? column.textAlign : defaultTextAlign\">\n            <ng-container *ngIf=\"column.headerTemplate; else noHeaderTemplate\">\n              <ng-container [ngTemplateOutlet]=\"column.headerTemplate\"></ng-container>\n            </ng-container>\n            <ng-template #noHeaderTemplate>\n              <div class=\"simple-grid-column-header-label\" [ngClass]=\"column.textAlign ? column.textAlign : defaultTextAlign\"\n                   [textContent]=\"column.headerText || '&nbsp;'\"\n              ></div>\n            </ng-template>\n            <div *ngIf=\"resizable && column.resizable\" class=\"simple-grid-column-sizer\"\n                 (mousedown)=\"handleSizerMouseDown($event, column)\"\n            ></div>\n          </div>\n        </th>\n      </tr>\n      </thead>\n      <tbody #dropList cdkDropList cdkDropListOrientation=\"vertical\"\n             class=\"simple-grid-drag-drop-list\"\n             [cdkDropListDisabled]=\"!dragDropEnabled\"\n             [cdkDropListData]=\"data\"\n             [cdkDropListEnterPredicate]=\"handleCanDragDrop\"\n             (cdkDropListDropped)=\"handleDrop($event)\">\n        <tr class=\"simple-grid-row\" [class.selected]=\"rowIndex === selectedRowIndex && !editing\" observeVisibility\n            [class.disabled]=\"isRowDisabled(row)\"\n          [class.editing]=\"rowIndex === editRowIndex\" *ngFor=\"let row of (!!rowsPerPage ? (data | paginate: {itemsPerPage: rowsPerPage, currentPage: currentPage}) : data); last as last; let rowIndex = index\" cdkDrag\n          (click)=\"handleClickRow($event, rowIndex, row)\" (dblclick)=\"handleDblClickRow($event, rowIndex, row)\" (visibilityChange)=\"rowVisible.next(row)\">\n          <co-form-test class=\"simple-grid-row-form\">\n            <ng-container *ngIf=\"isSingleColumnRow(row)\">\n              <td class=\"simple-grid-single-column-cell\" [attr.colspan]=\"headerColumns.length\">\n                <co-simple-grid-cell\n                  [column]=\"columns[singleColumnIndex(row)]\"\n                  [row]=\"row\"\n                  [editMode]=\"false\"\n                ></co-simple-grid-cell>\n              </td>\n            </ng-container>\n            <ng-container *ngIf=\"!isSingleColumnRow(row)\">\n              <ng-container *ngFor=\"let column of headerColumns; let columnIndex = index\">\n                <td class=\"simple-grid-column-cell\" *ngIf=\"columnIndex !== singleColumnIndex(row)\">\n                  <co-simple-grid-cell\n                    [column]=\"column\"\n                    [row]=\"row\"\n                    [editMode]=\"inlineEdit && editing && rowIndex === editRowIndex\"\n                    [fieldEditMode]=\"editCellIndex === columnIndex\"\n                    (cellClick)=\"handleCellClick(columnIndex)\"\n                  ></co-simple-grid-cell>\n                  <div *ngIf=\"column.resizable\" class=\"simple-grid-column-sizer-placeholder\"></div>\n                </td>\n              </ng-container>\n            </ng-container>\n          </co-form-test>\n        </tr>\n      </tbody>\n    </table>\n    <co-pagination-bar *ngIf=\"data?.length > rowsPerPage\" class=\"pagination-bar\"\n                       [itemsPerPage]=\"rowsPerPage\"\n                       [currentPage]=\"currentPage\"\n                       [totalItems]=\"data.length\"\n                       [autoHide]=\"true\"\n                       (previousClick)=\"goToPreviousPage()\"\n                       (nextClick)=\"goToNextPage()\"\n                       (pageClick)=\"setCurrentPage($event)\"\n                        ></co-pagination-bar>\n  ",
+                    template: "\n    <co-grid-toolbar *ngIf=\"showToolbar\" [class.right]=\"rightToolbar\"\n                     [showEdit]=\"showEdit\"\n                     [showAdd]=\"showAdd\"\n                     [showDelete]=\"showDelete\"\n                     [deleteEnabled]=\"selectedRowIndex > -1\"\n                     (addClick)=\"addNewRow()\"\n                     (editClick)=\"editRow($event)\"\n                     (saveClick)=\"validateAndSave()\"\n                     (cancelClick)=\"cancelEditRow()\"\n                     (deleteClick)=\"removeRow()\"\n    ></co-grid-toolbar>\n    <table class=\"simple-grid-table\" [clickOutside]=\"editing\" (clickOutside)=\"handleClickOutsideRow()\">\n      <colgroup>\n        <col *ngFor=\"let column of headerColumns; let index = index\"\n             [class.simple-grid-column-auto-fit]=\"column.autoFit\"\n             [style.width.px]=\"column.width\"\n             [style.min-width.px]=\"MIN_COLUMN_WIDTH\">\n      </colgroup>\n      <thead>\n      <tr>\n        <th scope=\"col\" #headerCell class=\"simple-grid-column-header\" *ngFor=\"let column of headerColumns; let index = index\">\n          <div class=\"simple-grid-column-header-wrapper\" [class.resizable]=\"resizable\"\n               [ngClass]=\"column.textAlign ? column.textAlign : defaultTextAlign\">\n            <ng-container *ngIf=\"column.headerTemplate; else noHeaderTemplate\">\n              <ng-container [ngTemplateOutlet]=\"column.headerTemplate\"></ng-container>\n            </ng-container>\n            <ng-template #noHeaderTemplate>\n              <div class=\"simple-grid-column-header-label\" [ngClass]=\"column.textAlign ? column.textAlign : defaultTextAlign\"\n                   [textContent]=\"column.headerText || '&nbsp;'\"\n              ></div>\n            </ng-template>\n            <div *ngIf=\"resizable && column.resizable\" class=\"simple-grid-column-sizer\"\n                 (mousedown)=\"handleSizerMouseDown($event, column)\"\n            ></div>\n          </div>\n        </th>\n      </tr>\n      </thead>\n      <tbody #dropList cdkDropList cdkDropListOrientation=\"vertical\"\n             class=\"simple-grid-drag-drop-list\"\n             [cdkDropListDisabled]=\"!dragDropEnabled || editing\"\n             [cdkDropListData]=\"data\"\n             [cdkDropListEnterPredicate]=\"handleCanDragDrop\"\n             (cdkDropListDropped)=\"handleDrop($event)\">\n        <tr class=\"simple-grid-row\" [class.selected]=\"rowIndex === selectedRowIndex && !editing\" observeVisibility\n            [class.disabled]=\"isRowDisabled(row)\"\n          [class.editing]=\"rowIndex === editRowIndex\" *ngFor=\"let row of (!!rowsPerPage ? (data | paginate: {itemsPerPage: rowsPerPage, currentPage: currentPage}) : data); last as last; let rowIndex = index\" cdkDrag\n          (click)=\"handleClickRow($event, rowIndex, row)\" (dblclick)=\"handleDblClickRow($event, rowIndex, row)\" (visibilityChange)=\"rowVisible.next(row)\">\n          <co-form-test class=\"simple-grid-row-form\">\n            <ng-container *ngIf=\"isSingleColumnRow(row)\">\n              <td class=\"simple-grid-single-column-cell\" [attr.colspan]=\"headerColumns.length\">\n                <co-simple-grid-cell\n                  [column]=\"columns[singleColumnIndex(row)]\"\n                  [row]=\"row\"\n                  [editMode]=\"false\"\n                ></co-simple-grid-cell>\n              </td>\n            </ng-container>\n            <ng-container *ngIf=\"!isSingleColumnRow(row)\">\n              <ng-container *ngFor=\"let column of headerColumns; let columnIndex = index\">\n                <td class=\"simple-grid-column-cell\" *ngIf=\"columnIndex !== singleColumnIndex(row)\">\n                  <co-simple-grid-cell\n                    [column]=\"column\"\n                    [row]=\"row\"\n                    [editMode]=\"inlineEdit && editing && rowIndex === editRowIndex\"\n                    [fieldEditMode]=\"editCellIndex === columnIndex && rowIndex === editRowIndex\"\n                    (cellClick)=\"handleCellClick($event, row, rowIndex, columnIndex)\"\n                  ></co-simple-grid-cell>\n                  <div *ngIf=\"column.resizable\" class=\"simple-grid-column-sizer-placeholder\"></div>\n                </td>\n              </ng-container>\n            </ng-container>\n          </co-form-test>\n        </tr>\n      </tbody>\n    </table>\n    <co-pagination-bar *ngIf=\"data?.length > rowsPerPage\" class=\"pagination-bar\"\n                       [itemsPerPage]=\"rowsPerPage\"\n                       [currentPage]=\"currentPage\"\n                       [totalItems]=\"data.length\"\n                       [autoHide]=\"true\"\n                       (previousClick)=\"goToPreviousPage()\"\n                       (nextClick)=\"goToNextPage()\"\n                       (pageClick)=\"setCurrentPage($event)\"\n                        ></co-pagination-bar>\n  ",
                     providers: [
                         FormMasterService
                     ],
@@ -10670,11 +10700,21 @@
         function SimpleGridCellComponent(_changeDetector) {
             this._changeDetector = _changeDetector;
             this.defaultTextAlign = exports.ColumnAlign.Left;
-            this.editMode = false;
+            this._editMode = false;
             this.cellClick = new i0.EventEmitter();
             this._fieldEditMode = false;
             this._focused = false;
         }
+        Object.defineProperty(SimpleGridCellComponent.prototype, "editMode", {
+            get: function () {
+                return this._editMode;
+            },
+            set: function (value) {
+                this._editMode = value;
+            },
+            enumerable: false,
+            configurable: true
+        });
         Object.defineProperty(SimpleGridCellComponent.prototype, "editTemplateContent", {
             set: function (template) {
                 if (template) {
@@ -10725,7 +10765,7 @@
             }
         };
         SimpleGridCellComponent.prototype._setFocusComponent = function () {
-            if (this.editMode && this.fieldEditMode) {
+            if (this._editMode && this.fieldEditMode) {
                 var element = this._getElement();
                 if (element) {
                     var focusEvent = this._createNewEvent(element, 'focus');
@@ -10796,7 +10836,7 @@
     SimpleGridCellComponent.decorators = [
         { type: i0.Component, args: [{
                     selector: "co-simple-grid-cell",
-                    template: "\n    <div class=\"simple-grid-column-cell-value\" [ngClass]=\"column.textAlign ? column.textAlign : defaultTextAlign\">\n      <ng-container *ngIf=\"editMode; else noInlineEdit\">\n        <ng-container #editTemplate *ngIf=\"column.editTemplate; else noEditTemplate\"\n                      [ngTemplateOutlet]=\"column.editTemplate\"\n                      [ngTemplateOutletContext]=\"{value: row[column.field], row: row}\"></ng-container>\n        <ng-template #noEditTemplate>\n          <ng-container *ngIf=\"column.template; else noTemplate\">\n            <ng-container [ngTemplateOutlet]=\"column.template\"\n                          [ngTemplateOutletContext]=\"{value: row[column.field], row: row}\"></ng-container>\n          </ng-container>\n          <ng-template #noTemplate>\n            <co-input-text [(model)]=\"row[column.field]\" [required]=\"column.required\"></co-input-text>\n          </ng-template>\n        </ng-template>\n      </ng-container>\n      <ng-template #noInlineEdit>\n        <ng-container *ngIf=\"column.template; else noTemplate\">\n          <ng-container [ngTemplateOutlet]=\"column.template\"\n                        [ngTemplateOutletContext]=\"{value: row[column.field], row: row}\"></ng-container>\n        </ng-container>\n        <ng-template #noTemplate>\n          <span [textContent]=\"column.getFieldValue(row[column.field])\"></span>\n        </ng-template>\n      </ng-template>\n    </div>\n  ",
+                    template: "\n      <div class=\"simple-grid-column-cell-value\" [ngClass]=\"column.textAlign ? column.textAlign : defaultTextAlign\">\n          <ng-container *ngIf=\"editMode; else noInlineEdit\">\n              <div class=\"simple-grid-column-cell-field\">\n                <ng-container #editTemplate *ngIf=\"column.editTemplate; else noEditTemplate\"\n                              [ngTemplateOutlet]=\"column.editTemplate\"\n                              [ngTemplateOutletContext]=\"{value: row[column.field], row: row}\"></ng-container>\n                <ng-template #noEditTemplate>\n                    <ng-container *ngIf=\"column.template; else noTemplate\">\n                        <ng-container [ngTemplateOutlet]=\"column.template\"\n                                      [ngTemplateOutletContext]=\"{value: row[column.field], row: row}\"></ng-container>\n                    </ng-container>\n                    <ng-template #noTemplate>\n                        <co-input-text [(model)]=\"row[column.field]\" [required]=\"column.required\"></co-input-text>\n                    </ng-template>\n                </ng-template>\n              </div>\n          </ng-container>\n          <ng-template #noInlineEdit>\n              <div class=\"simple-grid-column-cell-field\">\n                <ng-container *ngIf=\"column.template; else noTemplate\">\n                    <ng-container [ngTemplateOutlet]=\"column.template\"\n                                  [ngTemplateOutletContext]=\"{value: row[column.field], row: row}\"></ng-container>\n                </ng-container>\n                <ng-template #noTemplate>\n                    <span [textContent]=\"column.getFieldValue(row[column.field])\"></span>\n                </ng-template>\n              </div>\n          </ng-template>\n      </div>\n  ",
                     encapsulation: i0.ViewEncapsulation.None
                 },] }
     ];
@@ -10804,12 +10844,12 @@
         { type: i0.ChangeDetectorRef }
     ]; };
     SimpleGridCellComponent.propDecorators = {
+        editMode: [{ type: i0.Input }],
         editTemplateContent: [{ type: i0.ViewChild, args: ["editTemplate", { read: BaseInputComponent },] }],
         noEditTemplateContent: [{ type: i0.ViewChild, args: ["noEditTemplate",] }],
         noTemplateContent: [{ type: i0.ViewChild, args: ["noTemplate",] }],
         column: [{ type: i0.Input }],
         row: [{ type: i0.Input }],
-        editMode: [{ type: i0.Input }],
         fieldEditMode: [{ type: i0.Input }],
         cellClick: [{ type: i0.Output }],
         showClass: [{ type: i0.HostBinding, args: ["class.co-simple-grid-cell",] }],
@@ -10901,7 +10941,8 @@
                         FormModule,
                         ObserveVisibilityModule,
                         PaginationModule,
-                        PaginationBarModule
+                        PaginationBarModule,
+                        ClickoutsideModule
                     ],
                     declarations: [
                         SimpleGridComponent,
@@ -11662,87 +11703,273 @@
                 },] }
     ];
 
-    var FilterPipe = /** @class */ (function () {
-        function FilterPipe() {
+    var CoreDynamicComponentService = /** @class */ (function () {
+        function CoreDynamicComponentService(_compFactoryResolver, appRef, injector) {
+            this._compFactoryResolver = _compFactoryResolver;
+            this.appRef = appRef;
+            this.injector = injector;
+            this._componentRefs = [];
         }
-        FilterPipe.prototype.transform = function (items, field, value) {
-            if (!items || !field) {
-                return items;
+        CoreDynamicComponentService.prototype.getComponentRefs = function () {
+            return this._componentRefs;
+        };
+        CoreDynamicComponentService.prototype.createAndReturnComponentRef = function (componentClass, inputs) {
+            var _this = this;
+            return new Promise(function (resolve) {
+                var componentRef = _this._compFactoryResolver
+                    .resolveComponentFactory(componentClass)
+                    .create(_this.injector);
+                if (inputs) {
+                    for (var property in inputs) {
+                        if (inputs.hasOwnProperty(property)) {
+                            componentRef.instance[property] = inputs[property];
+                        }
+                    }
+                }
+                _this.appRef.attachView(componentRef.hostView);
+                var domElem = componentRef.hostView
+                    .rootNodes[0];
+                document.body.appendChild(domElem);
+                componentRef.onDestroy(function () {
+                    _this.appRef.detachView(componentRef.hostView);
+                });
+                resolve(componentRef);
+            });
+        };
+        CoreDynamicComponentService.prototype.createComponent = function (componentClass, inputs, outputs, providers) {
+            var _this = this;
+            return new Promise(function (resolve) {
+                if (providers) {
+                    i0.Injector.create(providers, _this.injector);
+                }
+                var componentRef = _this._compFactoryResolver
+                    .resolveComponentFactory(componentClass)
+                    .create(_this.injector);
+                _this._componentRefs.push(componentRef);
+                if (inputs) {
+                    for (var property in inputs) {
+                        if (inputs.hasOwnProperty(property)) {
+                            componentRef.instance[property] = inputs[property];
+                        }
+                    }
+                }
+                if (outputs) {
+                    var _loop_1 = function (event) {
+                        if (outputs.hasOwnProperty(event)) {
+                            componentRef.instance[event].subscribe(function () { return outputs[event](); });
+                        }
+                    };
+                    for (var event in outputs) {
+                        _loop_1(event);
+                    }
+                }
+                _this.appRef.attachView(componentRef.hostView);
+                var domElem = componentRef.hostView
+                    .rootNodes[0];
+                document.body.appendChild(domElem);
+                componentRef.onDestroy(function () {
+                    _this.appRef.detachView(componentRef.hostView);
+                });
+                componentRef.instance.onClose = function (button, output, rememberChoice) {
+                    var idx = _this._componentRefs.indexOf(componentRef);
+                    _this.appRef.detachView(componentRef.hostView);
+                    _this._componentRefs[idx] = undefined;
+                    _this._componentRefs.splice(idx, 1);
+                    if (outputs) {
+                        for (var event in outputs) {
+                            if (outputs.hasOwnProperty(event)) {
+                                componentRef.instance[event].unsubscribe();
+                            }
+                        }
+                    }
+                    resolve({ button: button, output: output ? output : undefined, rememberChoice: rememberChoice });
+                };
+            });
+        };
+        return CoreDynamicComponentService;
+    }());
+    CoreDynamicComponentService.ɵprov = i0__namespace.ɵɵdefineInjectable({ factory: function CoreDynamicComponentService_Factory() { return new CoreDynamicComponentService(i0__namespace.ɵɵinject(i0__namespace.ComponentFactoryResolver), i0__namespace.ɵɵinject(i0__namespace.ApplicationRef), i0__namespace.ɵɵinject(i0__namespace.INJECTOR)); }, token: CoreDynamicComponentService, providedIn: "root" });
+    CoreDynamicComponentService.decorators = [
+        { type: i0.Injectable, args: [{
+                    providedIn: "root"
+                },] }
+    ];
+    CoreDynamicComponentService.ctorParameters = function () { return [
+        { type: i0.ComponentFactoryResolver },
+        { type: i0.ApplicationRef },
+        { type: i0.Injector }
+    ]; };
+
+    var AppPopupType;
+    (function (AppPopupType) {
+        AppPopupType[AppPopupType["Error"] = 0] = "Error";
+        AppPopupType[AppPopupType["Warning"] = 1] = "Warning";
+        AppPopupType[AppPopupType["Information"] = 2] = "Information";
+        AppPopupType[AppPopupType["Confirmation"] = 3] = "Confirmation";
+    })(AppPopupType || (AppPopupType = {}));
+
+    var AppPopupButtonType;
+    (function (AppPopupButtonType) {
+        AppPopupButtonType[AppPopupButtonType["Ok"] = 0] = "Ok";
+        AppPopupButtonType[AppPopupButtonType["Open"] = 1] = "Open";
+        AppPopupButtonType[AppPopupButtonType["Save"] = 2] = "Save";
+        AppPopupButtonType[AppPopupButtonType["Cancel"] = 3] = "Cancel";
+        AppPopupButtonType[AppPopupButtonType["Yes"] = 4] = "Yes";
+        AppPopupButtonType[AppPopupButtonType["No"] = 5] = "No";
+        AppPopupButtonType[AppPopupButtonType["NoButton"] = 6] = "NoButton";
+    })(AppPopupButtonType || (AppPopupButtonType = {}));
+
+    var DialogBaseComponent = /** @class */ (function () {
+        function DialogBaseComponent() {
+        }
+        DialogBaseComponent.prototype.onClose = function (eventType, output, rememberChoice) {
+            return;
+        };
+        return DialogBaseComponent;
+    }());
+
+    var ConfirmationDialogComponent = /** @class */ (function (_super) {
+        __extends(ConfirmationDialogComponent, _super);
+        function ConfirmationDialogComponent(iconCacheService) {
+            var _this = _super.call(this) || this;
+            _this.iconCacheService = iconCacheService;
+            _this.icons = exports.CoreComponentsIcon;
+            _this.ptype = AppPopupType;
+            _this.showRememberCheckbox = false;
+            _this.rememberChoice = false;
+            return _this;
+        }
+        ConfirmationDialogComponent.prototype.showClass = function () {
+            return true;
+        };
+        ConfirmationDialogComponent.prototype.handleYesClick = function (event) {
+            this.onClose(AppPopupButtonType.Yes, undefined, this.rememberChoice);
+        };
+        ConfirmationDialogComponent.prototype.handleNoClick = function (event) {
+            this.onClose(AppPopupButtonType.No, undefined, this.rememberChoice);
+        };
+        ConfirmationDialogComponent.prototype.handleOkClick = function (event) {
+            this.onClose(AppPopupButtonType.Ok, undefined, this.rememberChoice);
+        };
+        return ConfirmationDialogComponent;
+    }(DialogBaseComponent));
+    ConfirmationDialogComponent.decorators = [
+        { type: i0.Component, args: [{
+                    selector: "co-confirmation-dialog",
+                    template: "\n    <co-dialog [showCloseIcon]=\"false\" [headerTemplate]=\"headerTemplate\" [footerTemplate]=\"footerTemplate\">\n      <div class=\"confirmation-dialog-wrapper\">\n        <div class=\"text\" [innerHTML]=\"text\"></div>\n        <co-collapsible [headerTitle]=\"'DETAILS' | coreLocalize\" [iconData]=\"iconCacheService.getIcon(icons.TriangleDown)\" *ngIf=\"details\">\n          <div class=\"dialog-details\" [innerHTML]=\"details\"></div>\n        </co-collapsible>\n      </div>\n    </co-dialog>\n    <ng-template #headerTemplate>\n      <div class=\"co-dialog-header-title\" [textContent]=\"title\"></div>\n    </ng-template>\n    <ng-template #footerTemplate>\n      <div class=\"co-dialog-footer-button-wrapper\">\n        <ng-container *ngIf=\"type === ptype.Confirmation\">\n          <co-button class=\"save-button\"\n                     [label]=\"'YES' | coreLocalize\"\n                     (click)=\"handleYesClick($event)\"></co-button>\n          <co-button class=\"close-button\"\n                     [label]=\"'NO' | coreLocalize\"\n                     (click)=\"handleNoClick($event)\"></co-button>\n        </ng-container>\n        <ng-container *ngIf=\"type === ptype.Information || type === ptype.Error || type === ptype.Warning\">\n          <co-button class=\"save-button\"\n                     [iconData]=\"iconCacheService.getIcon(icons.CheckDuotone)\"\n                     (click)=\"handleYesClick($event)\"></co-button>\n        </ng-container>\n      </div>\n      <ng-container *ngIf=\"showRememberCheckbox\">\n        <co-input-checkbox [label]=\"'REMEMBER_CHOICE' | coreLocalize\" [(model)]=\"rememberChoice\"></co-input-checkbox>\n      </ng-container>\n    </ng-template>\n  ",
+                    encapsulation: i0.ViewEncapsulation.None
+                },] }
+    ];
+    ConfirmationDialogComponent.ctorParameters = function () { return [
+        { type: IconCacheService }
+    ]; };
+    ConfirmationDialogComponent.propDecorators = {
+        title: [{ type: i0.Input }],
+        text: [{ type: i0.Input }],
+        details: [{ type: i0.Input }],
+        type: [{ type: i0.Input }],
+        showRememberCheckbox: [{ type: i0.Input }],
+        showClass: [{ type: i0.HostBinding, args: ["class.co-confirmation-dialog",] }]
+    };
+
+    var CoreDialogService = /** @class */ (function () {
+        function CoreDialogService(_compFactoryResolver, appRef, injector, dynamicComponentService) {
+            this._compFactoryResolver = _compFactoryResolver;
+            this.appRef = appRef;
+            this.injector = injector;
+            this.dynamicComponentService = dynamicComponentService;
+            this._componentRefs = [];
+        }
+        CoreDialogService.prototype.showYesNo = function (title, text, showRememberChoice) {
+            if (showRememberChoice === void 0) { showRememberChoice = false; }
+            return __awaiter(this, void 0, void 0, function () {
+                var data;
+                return __generator(this, function (_a) {
+                    data = {
+                        title: title,
+                        text: text,
+                        type: AppPopupType.Confirmation,
+                        showRememberCheckbox: showRememberChoice
+                    };
+                    return [2 /*return*/, this.dynamicComponentService.createComponent(ConfirmationDialogComponent, data)];
+                });
+            });
+        };
+        CoreDialogService.prototype.showError = function (message, details) {
+            var data = {
+                title: 'ERROR',
+                text: message,
+                type: AppPopupType.Error
+            };
+            if (details) {
+                data.details = details;
             }
-            return items.filter(function (item) { return item[field] === value; });
+            return this.dynamicComponentService.createComponent(ConfirmationDialogComponent, data);
         };
-        return FilterPipe;
+        CoreDialogService.prototype.showInformation = function (message) {
+            var data = {
+                title: 'INFORMATION',
+                text: message,
+                type: AppPopupType.Information
+            };
+            return this.dynamicComponentService.createComponent(ConfirmationDialogComponent, data);
+        };
+        CoreDialogService.prototype.showWarning = function (message) {
+            var data = {
+                title: 'WARNING',
+                text: message,
+                type: AppPopupType.Warning
+            };
+            return this.dynamicComponentService.createComponent(ConfirmationDialogComponent, data);
+        };
+        return CoreDialogService;
     }());
-    FilterPipe.decorators = [
-        { type: i0.Pipe, args: [{
-                    name: "filter",
-                    pure: false
+    CoreDialogService.ɵprov = i0__namespace.ɵɵdefineInjectable({ factory: function CoreDialogService_Factory() { return new CoreDialogService(i0__namespace.ɵɵinject(i0__namespace.ComponentFactoryResolver), i0__namespace.ɵɵinject(i0__namespace.ApplicationRef), i0__namespace.ɵɵinject(i0__namespace.INJECTOR), i0__namespace.ɵɵinject(CoreDynamicComponentService)); }, token: CoreDialogService, providedIn: "root" });
+    CoreDialogService.decorators = [
+        { type: i0.Injectable, args: [{
+                    providedIn: "root"
                 },] }
-    ];
+    ];
+    CoreDialogService.ctorParameters = function () { return [
+        { type: i0.ComponentFactoryResolver },
+        { type: i0.ApplicationRef },
+        { type: i0.Injector },
+        { type: CoreDynamicComponentService }
+    ]; };
 
-    var FilterPipeModule = /** @class */ (function () {
-        function FilterPipeModule() {
+    var CoreDialogModule = /** @class */ (function () {
+        function CoreDialogModule() {
         }
-        return FilterPipeModule;
+        CoreDialogModule.forRoot = function () {
+            return {
+                ngModule: CoreDialogModule,
+                providers: [
+                    CoreDialogService
+                ]
+            };
+        };
+        return CoreDialogModule;
     }());
-    FilterPipeModule.decorators = [
+    CoreDialogModule.decorators = [
         { type: i0.NgModule, args: [{
+                    imports: [
+                        common.CommonModule,
+                        CoDialogModule,
+                        CollapsibleModule,
+                        CoreComponentsTranslationModule,
+                        ButtonModule,
+                        InputCheckboxModule
+                    ],
                     declarations: [
-                        FilterPipe
+                        ConfirmationDialogComponent
                     ],
-                    exports: [
-                        FilterPipe
-                    ]
+                    providers: [
+                        CoreDialogService
+                    ],
+                    exports: []
                 },] }
     ];
 
-    function equalValidator(valueGetterFn) {
-        return function (control) {
-            var isValid = true;
-            if (valueGetterFn) {
-                var mustBeEqualTo = valueGetterFn.call(this);
-                isValid = control.value === mustBeEqualTo;
-            }
-            return isValid ? null : { "equality": "MESSAGE_FIELD_WRONG_VALUE" };
-        };
-    }
-
-    function passwordValidator(userNameGetterFn) {
-        return function (control) {
-            if (control && control.value) {
-                var username = userNameGetterFn.call(this);
-                var errorString = getValidatePasswordErrorString(StringUtils.ToStringOrDefault(control.value), username);
-                if (errorString) {
-                    return { "password": errorString };
-                }
-            }
-        };
-    }
-    // @returns undefined if valid, or an error string if there's an error
-    function getValidatePasswordErrorString(password, username) {
-        var minimumPasswordLength = 10;
-        var lengthOk = password && minimumPasswordLength <= password.length;
-        if (!lengthOk) {
-            return "PASSWORD_MUST_BE_10_CHARACTERS";
-        }
-        var atLeastOneNumber = RegExp(".*[0-9].*").test(password);
-        var atLeastOneLetter = RegExp(".*[a-zA-Z].*").test(password);
-        var atLeastOneSpecial = RegExp(".*[!@#$%&*()'+,\\-./:;<=>?\\[\\]^_`{|}\\\\].*").test(password);
-        if (!atLeastOneNumber || !atLeastOneLetter || !atLeastOneSpecial) {
-            return "PASSWORD_MUST_CONTAIN_LETTER_NUMBER_SPECIAL";
-        }
-        var hasUsernameInPassword = username && RegExp(".*" + username.trim() + ".*", "i").test(password);
-        if (hasUsernameInPassword) {
-            return "PASSWORD_CONTAINS_USERNAME";
-        }
-    }
-
-    function emailValidator(control) {
-        var emailRegex = /^(([^<>()\[\]\\.,;:\s@"]+(\.[^<>()\[\]\\.,;:\s@"]+)*)|(".+"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$/;
-        var isValid = !!emailRegex.test(control.value);
-        return isValid ? null : { 'email': 'MESSAGE_EMAIL_NOT_CORRECT' };
-    }
-
     var FilterItemComponent = /** @class */ (function () {
         function FilterItemComponent(iconService, _changeDetector) {
             this.iconService = iconService;
@@ -12353,36 +12580,409 @@
                 },] }
     ];
 
-    var TooltipComponent = /** @class */ (function () {
-        function TooltipComponent(_elementRef, _changeDetector) {
-            this._elementRef = _elementRef;
-            this._changeDetector = _changeDetector;
-            this.top = -100;
-            this.left = -100;
-            this.bottom = false;
-            this.animate = true;
+    var CheckmarkOverlayComponent = /** @class */ (function () {
+        function CheckmarkOverlayComponent(_renderer) {
+            var _this = this;
+            this._renderer = _renderer;
+            this.showOverlay = false;
+            this.showWrapper = false;
+            this._visible = false;
+            this._handleAnimationIteration = function (event) {
+                _this.animateDivs.forEach(function (a) { return _this._renderer.removeClass(a.nativeElement, 'animate'); });
+                event.currentTarget.removeEventListener('animationiteration', _this._handleAnimationIteration);
+            };
         }
-        Object.defineProperty(TooltipComponent.prototype, "hostElement", {
+        Object.defineProperty(CheckmarkOverlayComponent.prototype, "content", {
+            set: function (children) {
+                this.animateDivs = children.toArray();
+                this._checkAnimation();
+            },
+            enumerable: false,
+            configurable: true
+        });
+        Object.defineProperty(CheckmarkOverlayComponent.prototype, "visible", {
             get: function () {
-                return this._hostElement;
+                return this._visible;
             },
             set: function (value) {
-                this._hostElement = value;
-                // this._positionTooltip();
+                var _this = this;
+                if (value) {
+                    this.showOverlay = true;
+                    this.showWrapper = true;
+                }
+                else {
+                    setTimeout(function () { return _this.showOverlay = false; }, 800);
+                    setTimeout(function () { return _this.showWrapper = false; }, 600);
+                }
+                this._visible = value;
+                this._checkAnimation();
+                this._checkAnimationFinished();
             },
             enumerable: false,
             configurable: true
         });
-        TooltipComponent.prototype.showClass = function () {
+        CheckmarkOverlayComponent.prototype.showClass = function () {
             return true;
         };
-        TooltipComponent.prototype.ngAfterViewInit = function () {
+        CheckmarkOverlayComponent.prototype._checkAnimation = function () {
             var _this = this;
-            setTimeout(function () {
-                _this._positionTooltip();
-            });
-        };
-        TooltipComponent.prototype._positionTooltip = function () {
+            if (this.visible && this.animateDivs) {
+                this.animateDivs.forEach(function (a) { return _this._renderer.addClass(a.nativeElement, 'animate'); });
+            }
+        };
+        CheckmarkOverlayComponent.prototype._checkAnimationFinished = function () {
+            var _this = this;
+            if (!this.visible && this.animateDivs) {
+                this.animateDivs.forEach(function (a) {
+                    a.nativeElement.addEventListener('animationiteration', _this._handleAnimationIteration);
+                });
+            }
+        };
+        return CheckmarkOverlayComponent;
+    }());
+    CheckmarkOverlayComponent.decorators = [
+        { type: i0.Component, args: [{
+                    selector: "co-checkmark-overlay",
+                    template: "\n    <div *ngIf=\"showOverlay\">\n      <div class=\"checkmark-overlay-wrapper\" *ngIf=\"showWrapper\" @showHideSaveCancel>\n        <div class=\"checkmark-buttons-button save\" [class.finished]=\"!visible\">\n          <div class=\"save-button-spinner\">\n            <div #animatediv></div>\n            <div #animatediv></div>\n            <div #animatediv></div>\n            <div #animatediv></div>\n          </div>\n          <div class=\"spinner-checkmark\" *ngIf=\"!visible && successful\"></div>\n        </div>\n      </div>\n    </div>\n  ",
+                    animations: [
+                        animations.trigger('showHideSaveCancel', [
+                            animations.state('*', animations.style({ transform: 'scaleY(1)', opacity: 1 })),
+                            animations.state('void', animations.style({ transform: 'scaleY(0)', opacity: 0 })),
+                            animations.transition('void <=> *', animations.animate(200))
+                        ]),
+                    ],
+                    encapsulation: i0.ViewEncapsulation.None
+                },] }
+    ];
+    CheckmarkOverlayComponent.ctorParameters = function () { return [
+        { type: i0.Renderer2 }
+    ]; };
+    CheckmarkOverlayComponent.propDecorators = {
+        content: [{ type: i0.ViewChildren, args: ['animatediv', { read: i0.ElementRef },] }],
+        visible: [{ type: i0.Input }],
+        successful: [{ type: i0.Input }],
+        showClass: [{ type: i0.HostBinding, args: ["class.co-checkmark-overlay",] }]
+    };
+
+    var CheckmarkOverlayModule = /** @class */ (function () {
+        function CheckmarkOverlayModule() {
+        }
+        return CheckmarkOverlayModule;
+    }());
+    CheckmarkOverlayModule.decorators = [
+        { type: i0.NgModule, args: [{
+                    imports: [
+                        common.CommonModule
+                    ],
+                    declarations: [
+                        CheckmarkOverlayComponent
+                    ],
+                    exports: [
+                        CheckmarkOverlayComponent
+                    ]
+                },] }
+    ];
+
+    var FilterItemViewmodel = /** @class */ (function () {
+        function FilterItemViewmodel(code, description, checked, count, valueName) {
+            this.checked = false;
+            this.code = code;
+            this.description = description === null || description === void 0 ? void 0 : description.toString();
+            this.checked = checked;
+            this.count = count;
+            this.valueName = valueName;
+        }
+        FilterItemViewmodel.prototype.codeAsNumber = function () { return NumberUtils.ParseInt(this.code); };
+        return FilterItemViewmodel;
+    }());
+
+    var FilterViewmodel = /** @class */ (function () {
+        function FilterViewmodel(collection, fields) {
+            var _this = this;
+            this.filterItems = [];
+            collection.forEach(function (item) {
+                var _a, _b, _c;
+                _this.filterItems.push(new FilterItemViewmodel(item[fields.value], item[fields.text], (_a = item.checked) !== null && _a !== void 0 ? _a : false, (_b = item.count) !== null && _b !== void 0 ? _b : null, (_c = item.valueName) !== null && _c !== void 0 ? _c : null));
+            });
+        }
+        return FilterViewmodel;
+    }());
+
+    var BarCodeScanner = /** @class */ (function () {
+        function BarCodeScanner() {
+            var _this = this;
+            this._buffer = [];
+            this._keyPress = function (event) {
+                if (event.key === "Enter") {
+                    document.dispatchEvent(_this._createScanEvent());
+                    _this._buffer.length = 0;
+                }
+                else {
+                    var str = event.key;
+                    _this._buffer.push(str);
+                }
+            };
+            document.addEventListener('keypress', this._keyPress);
+        }
+        BarCodeScanner.prototype.close = function () {
+            document.removeEventListener('keypress', this._keyPress);
+        };
+        BarCodeScanner.prototype._createScanEvent = function () {
+            return new CustomEvent("barcodescanned", { detail: this._buffer.join("") });
+        };
+        return BarCodeScanner;
+    }());
+
+    var ScannerService = /** @class */ (function () {
+        function ScannerService(_ngZone) {
+            var _this = this;
+            this._ngZone = _ngZone;
+            this.barCodeScanner = new BarCodeScanner();
+            this._barCodeScanned = function (event) {
+                if (_this._activeInput) {
+                    _this._activeInput.triggerCodeScanned(event.detail);
+                }
+            };
+            document.addEventListener("barcodescanned", this._barCodeScanned);
+        }
+        ScannerService.prototype.ngOnDestroy = function () {
+            document.removeEventListener("barcodescanned", this._barCodeScanned);
+            this.barCodeScanner.close();
+        };
+        ScannerService.prototype.registerInput = function (input) {
+            this._activeInput = input;
+        };
+        return ScannerService;
+    }());
+    ScannerService.decorators = [
+        { type: i0.Injectable }
+    ];
+    ScannerService.ctorParameters = function () { return [
+        { type: i0.NgZone }
+    ]; };
+
+    var InputScannerComponent = /** @class */ (function () {
+        function InputScannerComponent(_scannerService) {
+            this._scannerService = _scannerService;
+            this.centerLabel = false;
+            this.useLeftIcon = false;
+            this.useRightIcon = false;
+            this.modelChange = new i0.EventEmitter();
+            this.leftIconClick = new i0.EventEmitter();
+            this.rightIconClick = new i0.EventEmitter();
+            this.search = new i0.EventEmitter();
+            this.barCodeScanned = new i0.EventEmitter();
+            this._scannerService.registerInput(this);
+        }
+        InputScannerComponent.prototype.showClass = function () {
+            return true;
+        };
+        InputScannerComponent.prototype.triggerCodeScanned = function (code) {
+            this.model = code;
+            this.barCodeScanned.next(this.model);
+        };
+        return InputScannerComponent;
+    }());
+    InputScannerComponent.decorators = [
+        { type: i0.Component, args: [{
+                    selector: 'co-input-scanner',
+                    template: "\n      <co-input-search\n              [(model)]=\"model\"\n              [customCssClass]=\"customCssClass\"\n              [placeholder]=\"placeholder\"\n              [centerLabel]=\"centerLabel\"\n              [useLeftIcon]=\"useLeftIcon\"\n              [leftIconData]=\"leftIconData\"\n              [useRightIcon]=\"useRightIcon\"\n              [rightIconData]=\"rightIconData\"\n              (leftIconClick)=\"leftIconClick.emit($event)\"\n              (rightIconClick)=\"rightIconClick.emit($event)\"\n              (search)=\"search.emit($event)\"\n      ></co-input-search>\n    ",
+                    providers: [
+                        ScannerService,
+                        OverlayService
+                    ],
+                    encapsulation: i0.ViewEncapsulation.None
+                },] }
+    ];
+    InputScannerComponent.ctorParameters = function () { return [
+        { type: ScannerService }
+    ]; };
+    InputScannerComponent.propDecorators = {
+        model: [{ type: i0.Input }],
+        placeholder: [{ type: i0.Input }],
+        centerLabel: [{ type: i0.Input }],
+        useLeftIcon: [{ type: i0.Input }],
+        useRightIcon: [{ type: i0.Input }],
+        leftIconData: [{ type: i0.Input }],
+        rightIconData: [{ type: i0.Input }],
+        customCssClass: [{ type: i0.Input }],
+        modelChange: [{ type: i0.Output }],
+        leftIconClick: [{ type: i0.Output }],
+        rightIconClick: [{ type: i0.Output }],
+        search: [{ type: i0.Output }],
+        barCodeScanned: [{ type: i0.Output }],
+        showClass: [{ type: i0.HostBinding, args: ['class.co-input-scanner',] }]
+    };
+
+    var InputScannerModule = /** @class */ (function () {
+        function InputScannerModule() {
+        }
+        return InputScannerModule;
+    }());
+    InputScannerModule.decorators = [
+        { type: i0.NgModule, args: [{
+                    imports: [
+                        common.CommonModule,
+                        InputSearchModule
+                    ],
+                    declarations: [
+                        InputScannerComponent
+                    ],
+                    exports: [
+                        InputScannerComponent
+                    ]
+                },] }
+    ];
+
+    var LoaderComponent = /** @class */ (function () {
+        function LoaderComponent() {
+        }
+        LoaderComponent.prototype.showClass = function () {
+            return true;
+        };
+        return LoaderComponent;
+    }());
+    LoaderComponent.decorators = [
+        { type: i0.Component, args: [{
+                    selector: 'co-loader',
+                    template: "\n      <svg version=\"1.1\" xmlns=\"http://www.w3.org/2000/svg\" xmlns:xlink=\"http://www.w3.org/1999/xlink\" x=\"0px\" y=\"0px\"\n           viewBox=\"0 0 200 200\" xml:space=\"preserve\">\n        <defs>\n          <linearGradient id=\"gradientFade\" x1=\"20%\" x2=\"50%\" y1=\"60%\" y2=\"100%\">\n            <stop offset=\"0%\" class=\"spinner-gradient-stop\" />\n            <stop offset=\"25%\" stop-opacity=\"75%\" class=\"spinner-gradient-stop\" />\n            <stop offset=\"50%\" stop-opacity=\"50%\" class=\"spinner-gradient-stop\" />\n            <stop offset=\"75%\" stop-opacity=\"25%\" class=\"spinner-gradient-stop\" />\n            <stop offset=\"100%\" stop-opacity=\"5%\" class=\"spinner-gradient-stop\" />\n          </linearGradient>\n        </defs>          \n        <g id=\"mask\">\n            <ellipse transform=\"matrix(0.7071 -0.7071 0.7071 0.7071 -41.0887 100.8995)\" class=\"circle\" cx=\"101.25\" cy=\"101.25\" rx=\"77.58\"\n                     ry=\"77.58\"/>\n        </g>\n        <g>\n            <circle id=\"ring\" class=\"ring-color\" cx=\"100\" cy=\"100\" r=\"90\" fill=\"transparent\" />\n        </g>\n        <g id=\"js\">\n          <path class=\"main-color\" d=\"M87.93,149.17c-0.12-0.17-0.08-0.4,0.09-0.52l0.61-0.45c2.92-2.14,4.34-4.61,4.34-7.56l0-20.64h2.47\n            c0.74,0,1.34,0.6,1.34,1.34v18.32c0,2.97-0.65,5.4-1.93,7.23c-0.61,0.89-1.25,1.66-1.9,2.28c-0.63,0.6-1.41,1.23-2.3,1.87\n            l-0.65,0.47c-0.18,0.12-0.42,0.08-0.54-0.1L87.93,149.17z\"/>\n              <path class=\"main-color\" d=\"M107.12,142.92c-2.24,0-4.18-0.59-5.79-1.75l0,0c-0.47-0.34-0.59-1-0.27-1.48l1.06-1.59\n            c0.12-0.17,0.35-0.22,0.53-0.11l0.58,0.38c1.18,0.77,2.43,1.14,3.84,1.14c1.36,0,2.39-0.25,3.05-0.75\n            c0.59-0.44,0.86-1.04,0.86-1.92c0-0.59-0.22-1.15-0.68-1.71c-0.55-0.67-1.23-1.29-2.02-1.84c-0.85-0.58-1.74-1.22-2.66-1.88\n            c-0.97-0.7-1.81-1.55-2.5-2.53c-0.75-1.06-1.12-2.23-1.12-3.46c0-1.67,0.63-3.02,1.89-4.01c1.17-0.93,2.74-1.4,4.66-1.4\n            c1.83,0,3.55,0.37,5.13,1.11l0.62,0.29c0.19,0.09,0.27,0.31,0.19,0.5l-1.03,2.37c-0.08,0.19-0.31,0.28-0.5,0.2l-0.64-0.27\n            c-1.22-0.52-2.45-0.78-3.64-0.78c-3.01,0-3.01,1.31-3.01,1.94c0,0.63,0.22,1.21,0.68,1.77c0.55,0.67,1.22,1.28,2.01,1.8\n            c0.91,0.61,1.8,1.22,2.66,1.82c0.97,0.68,1.82,1.52,2.5,2.47c0.75,1.04,1.13,2.2,1.13,3.44c0,2.05-0.72,3.64-2.14,4.72\n            C111.17,142.4,109.36,142.92,107.12,142.92z\"/>\n        </g>\n        <g id=\"i\">\n          <path class=\"second-color\" d=\"M38.1,100.24V80.62c0-0.18,0.14-0.32,0.32-0.32h2.53c0.88,0,1.6,0.72,1.6,1.6v18.34\n            c0,0.18-0.14,0.32-0.32,0.32h-3.8C38.25,100.56,38.1,100.42,38.1,100.24z\"/>\n        </g>\n        <g id=\"n\">\n          <path class=\"second-color\" d=\"M126.95,107l-14.97-17.18c-0.19-0.22-0.56-0.09-0.56,0.21v16.62c0,0.18-0.14,0.32-0.32,0.32h-3.8\n            c-0.18,0-0.32-0.14-0.32-0.32V82.12c0-0.88,0.72-1.6,1.6-1.6h1.07c0.09,0,0.18,0.04,0.24,0.11l14.97,17.22\n            c0.19,0.22,0.56,0.09,0.56-0.21V80.99c0-0.18,0.14-0.32,0.32-0.32h3.8c0.18,0,0.32,0.14,0.32,0.32v25.81\n            c0,0.18-0.14,0.32-0.32,0.32h-2.35C127.1,107.11,127.01,107.07,126.95,107z\"/>\n        </g>\n        <g id=\"e\">\n          <path class=\"second-color\" d=\"M150.28,105.37V80.99c0-0.18,0.14-0.32,0.32-0.32h13.12c0.18,0,0.32,0.14,0.32,0.32v3.59\n            c0,0.18-0.14,0.32-0.32,0.32h-8.68c-0.18,0-0.32,0.14-0.32,0.32v5.14c0,0.18,0.14,0.32,0.32,0.32h7.77c0.18,0,0.32,0.14,0.32,0.32\n            v3.55c0,0.18-0.14,0.32-0.32,0.32h-7.77c-0.18,0-0.32,0.14-0.32,0.32v7.17c0,0.18,0.14,0.32,0.32,0.32h9.04\n            c0.18,0,0.32,0.14,0.32,0.32v3.66c0,0.18-0.14,0.32-0.32,0.32h-12.2C151,106.97,150.28,106.25,150.28,105.37z\"/>\n        </g>\n        <g id=\"o\">\n        <path class=\"second-color\" d=\"M67.44,86.2c0.59,0.54,0.68,1.43,0.23,2.09c-0.41,0.6-0.75,1.24-1.01,1.92c-0.42,1.1-0.63,2.31-0.63,3.61\n          c0,1.3,0.21,2.51,0.63,3.61c0.42,1.1,1.04,2.1,1.88,2.98c0.82,0.87,1.75,1.53,2.8,1.97c1.04,0.44,2.19,0.66,3.44,0.66\n          c1.25,0,2.4-0.22,3.43-0.66c1.04-0.44,1.97-1.09,2.78-1.97c0.83-0.88,1.45-1.88,1.86-2.98c0.42-1.1,0.63-2.31,0.63-3.61\n          c0-1.3-0.21-2.51-0.63-3.62c-0.42-1.1-1.04-2.11-1.87-3c-0.81-0.87-1.74-1.53-2.78-1.97c-1.04-0.44-2.18-0.66-3.43-0.66\n          c-0.77,0-1.49,0.08-2.18,0.25c-0.75,0.18-1.53-0.19-1.84-0.9l-1.03-2.32c-0.07-0.17,0-0.36,0.17-0.43\n          c1.49-0.58,3.12-0.87,4.86-0.87c1.87,0,3.59,0.33,5.17,0.99c1.58,0.66,3,1.64,4.27,2.95c1.26,1.3,2.21,2.76,2.84,4.36\n          c0.63,1.6,0.95,3.34,0.95,5.22c0,1.88-0.32,3.62-0.95,5.22c-0.63,1.6-1.58,3.06-2.84,4.36c-1.27,1.31-2.69,2.29-4.27,2.95\n          c-1.58,0.66-3.31,0.99-5.17,0.99c-1.87,0-3.6-0.33-5.17-0.99c-1.58-0.66-3-1.64-4.27-2.95c-1.26-1.3-2.21-2.76-2.84-4.36\n          c-0.63-1.6-0.95-3.34-0.95-5.22c0-1.88,0.32-3.62,0.95-5.22c0.6-1.51,1.47-2.88,2.63-4.13c0.12-0.13,0.32-0.13,0.45-0.02\n          L67.44,86.2z\"/>\n        </g>\n        <g id=\"smile\">\n          <path class=\"main-color\" d=\"M101.26,178.35c-3.73-0.01-7.38-0.28-10.86-0.82c-3.62-0.57-6.94-1.38-9.85-2.4c-3.01-1.05-5.69-2.3-7.94-3.73\n            c-1.09-0.71-2.1-1.76-2.99-2.84c0.98,0.74,2.03,1.44,3.16,2.07c2.38,1.38,5.13,2.58,8.16,3.55c5.99,1.93,13.15,2.99,20.17,2.99\n            h0.31c7.01,0,14.17-1.06,20.16-2.99c3.03-0.97,5.78-2.16,8.17-3.55c1.12-0.64,2.17-1.32,3.15-2.06c-0.89,1.08-1.89,2.13-2.99,2.83\n            c-2.25,1.42-4.92,2.67-7.94,3.72c-2.91,1.02-6.23,1.83-9.85,2.4C108.65,178.07,105,178.35,101.26,178.35z\"/>\n        </g>\n    </svg>\n  ",
+                    encapsulation: i0.ViewEncapsulation.None
+                },] }
+    ];
+    LoaderComponent.propDecorators = {
+        showClass: [{ type: i0.HostBinding, args: ['class.co-loader',] }]
+    };
+
+    var LoaderModule = /** @class */ (function () {
+        function LoaderModule() {
+        }
+        return LoaderModule;
+    }());
+    LoaderModule.decorators = [
+        { type: i0.NgModule, args: [{
+                    imports: [
+                        common.CommonModule
+                    ],
+                    declarations: [
+                        LoaderComponent
+                    ],
+                    exports: [
+                        LoaderComponent
+                    ]
+                },] }
+    ];
+
+    var FilterPipe = /** @class */ (function () {
+        function FilterPipe() {
+        }
+        FilterPipe.prototype.transform = function (items, field, value) {
+            if (!items || !field) {
+                return items;
+            }
+            return items.filter(function (item) { return item[field] === value; });
+        };
+        return FilterPipe;
+    }());
+    FilterPipe.decorators = [
+        { type: i0.Pipe, args: [{
+                    name: "filter",
+                    pure: false
+                },] }
+    ];
+
+    var FilterPipeModule = /** @class */ (function () {
+        function FilterPipeModule() {
+        }
+        return FilterPipeModule;
+    }());
+    FilterPipeModule.decorators = [
+        { type: i0.NgModule, args: [{
+                    declarations: [
+                        FilterPipe
+                    ],
+                    exports: [
+                        FilterPipe
+                    ]
+                },] }
+    ];
+
+    function equalValidator(valueGetterFn) {
+        return function (control) {
+            var isValid = true;
+            if (valueGetterFn) {
+                var mustBeEqualTo = valueGetterFn.call(this);
+                isValid = control.value === mustBeEqualTo;
+            }
+            return isValid ? null : { "equality": "MESSAGE_FIELD_WRONG_VALUE" };
+        };
+    }
+
+    function passwordValidator(userNameGetterFn) {
+        return function (control) {
+            if (control && control.value) {
+                var username = userNameGetterFn.call(this);
+                var errorString = getValidatePasswordErrorString(StringUtils.ToStringOrDefault(control.value), username);
+                if (errorString) {
+                    return { "password": errorString };
+                }
+            }
+        };
+    }
+    // @returns undefined if valid, or an error string if there's an error
+    function getValidatePasswordErrorString(password, username) {
+        var minimumPasswordLength = 10;
+        var lengthOk = password && minimumPasswordLength <= password.length;
+        if (!lengthOk) {
+            return "PASSWORD_MUST_BE_10_CHARACTERS";
+        }
+        var atLeastOneNumber = RegExp(".*[0-9].*").test(password);
+        var atLeastOneLetter = RegExp(".*[a-zA-Z].*").test(password);
+        var atLeastOneSpecial = RegExp(".*[!@#$%&*()'+,\\-./:;<=>?\\[\\]^_`{|}\\\\].*").test(password);
+        if (!atLeastOneNumber || !atLeastOneLetter || !atLeastOneSpecial) {
+            return "PASSWORD_MUST_CONTAIN_LETTER_NUMBER_SPECIAL";
+        }
+        var hasUsernameInPassword = username && RegExp(".*" + username.trim() + ".*", "i").test(password);
+        if (hasUsernameInPassword) {
+            return "PASSWORD_CONTAINS_USERNAME";
+        }
+    }
+
+    function emailValidator(control) {
+        var emailRegex = /^(([^<>()\[\]\\.,;:\s@"]+(\.[^<>()\[\]\\.,;:\s@"]+)*)|(".+"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$/;
+        var isValid = !!emailRegex.test(control.value);
+        return isValid ? null : { 'email': 'MESSAGE_EMAIL_NOT_CORRECT' };
+    }
+
+    var TooltipComponent = /** @class */ (function () {
+        function TooltipComponent(_elementRef, _changeDetector) {
+            this._elementRef = _elementRef;
+            this._changeDetector = _changeDetector;
+            this.top = -100;
+            this.left = -100;
+            this.bottom = false;
+            this.animate = true;
+        }
+        Object.defineProperty(TooltipComponent.prototype, "hostElement", {
+            get: function () {
+                return this._hostElement;
+            },
+            set: function (value) {
+                this._hostElement = value;
+                // this._positionTooltip();
+            },
+            enumerable: false,
+            configurable: true
+        });
+        TooltipComponent.prototype.showClass = function () {
+            return true;
+        };
+        TooltipComponent.prototype.ngAfterViewInit = function () {
+            var _this = this;
+            setTimeout(function () {
+                _this._positionTooltip();
+            });
+        };
+        TooltipComponent.prototype._positionTooltip = function () {
             if (this.hostElement && this._elementRef && this._elementRef.nativeElement) {
                 var rect = this.hostElement.getBoundingClientRect();
                 var ownRect = this._elementRef.nativeElement.getBoundingClientRect();
@@ -12552,109 +13152,6 @@
                 },] }
     ];
 
-    var CheckmarkOverlayComponent = /** @class */ (function () {
-        function CheckmarkOverlayComponent(_renderer) {
-            var _this = this;
-            this._renderer = _renderer;
-            this.showOverlay = false;
-            this.showWrapper = false;
-            this._visible = false;
-            this._handleAnimationIteration = function (event) {
-                _this.animateDivs.forEach(function (a) { return _this._renderer.removeClass(a.nativeElement, 'animate'); });
-                event.currentTarget.removeEventListener('animationiteration', _this._handleAnimationIteration);
-            };
-        }
-        Object.defineProperty(CheckmarkOverlayComponent.prototype, "content", {
-            set: function (children) {
-                this.animateDivs = children.toArray();
-                this._checkAnimation();
-            },
-            enumerable: false,
-            configurable: true
-        });
-        Object.defineProperty(CheckmarkOverlayComponent.prototype, "visible", {
-            get: function () {
-                return this._visible;
-            },
-            set: function (value) {
-                var _this = this;
-                if (value) {
-                    this.showOverlay = true;
-                    this.showWrapper = true;
-                }
-                else {
-                    setTimeout(function () { return _this.showOverlay = false; }, 800);
-                    setTimeout(function () { return _this.showWrapper = false; }, 600);
-                }
-                this._visible = value;
-                this._checkAnimation();
-                this._checkAnimationFinished();
-            },
-            enumerable: false,
-            configurable: true
-        });
-        CheckmarkOverlayComponent.prototype.showClass = function () {
-            return true;
-        };
-        CheckmarkOverlayComponent.prototype._checkAnimation = function () {
-            var _this = this;
-            if (this.visible && this.animateDivs) {
-                this.animateDivs.forEach(function (a) { return _this._renderer.addClass(a.nativeElement, 'animate'); });
-            }
-        };
-        CheckmarkOverlayComponent.prototype._checkAnimationFinished = function () {
-            var _this = this;
-            if (!this.visible && this.animateDivs) {
-                this.animateDivs.forEach(function (a) {
-                    a.nativeElement.addEventListener('animationiteration', _this._handleAnimationIteration);
-                });
-            }
-        };
-        return CheckmarkOverlayComponent;
-    }());
-    CheckmarkOverlayComponent.decorators = [
-        { type: i0.Component, args: [{
-                    selector: "co-checkmark-overlay",
-                    template: "\n    <div *ngIf=\"showOverlay\">\n      <div class=\"checkmark-overlay-wrapper\" *ngIf=\"showWrapper\" @showHideSaveCancel>\n        <div class=\"checkmark-buttons-button save\" [class.finished]=\"!visible\">\n          <div class=\"save-button-spinner\">\n            <div #animatediv></div>\n            <div #animatediv></div>\n            <div #animatediv></div>\n            <div #animatediv></div>\n          </div>\n          <div class=\"spinner-checkmark\" *ngIf=\"!visible && successful\"></div>\n        </div>\n      </div>\n    </div>\n  ",
-                    animations: [
-                        animations.trigger('showHideSaveCancel', [
-                            animations.state('*', animations.style({ transform: 'scaleY(1)', opacity: 1 })),
-                            animations.state('void', animations.style({ transform: 'scaleY(0)', opacity: 0 })),
-                            animations.transition('void <=> *', animations.animate(200))
-                        ]),
-                    ],
-                    encapsulation: i0.ViewEncapsulation.None
-                },] }
-    ];
-    CheckmarkOverlayComponent.ctorParameters = function () { return [
-        { type: i0.Renderer2 }
-    ]; };
-    CheckmarkOverlayComponent.propDecorators = {
-        content: [{ type: i0.ViewChildren, args: ['animatediv', { read: i0.ElementRef },] }],
-        visible: [{ type: i0.Input }],
-        successful: [{ type: i0.Input }],
-        showClass: [{ type: i0.HostBinding, args: ["class.co-checkmark-overlay",] }]
-    };
-
-    var CheckmarkOverlayModule = /** @class */ (function () {
-        function CheckmarkOverlayModule() {
-        }
-        return CheckmarkOverlayModule;
-    }());
-    CheckmarkOverlayModule.decorators = [
-        { type: i0.NgModule, args: [{
-                    imports: [
-                        common.CommonModule
-                    ],
-                    declarations: [
-                        CheckmarkOverlayComponent
-                    ],
-                    exports: [
-                        CheckmarkOverlayComponent
-                    ]
-                },] }
-    ];
-
     var BaseModuleScreenConfigService = /** @class */ (function () {
         function BaseModuleScreenConfigService() {
             // emits the params of the loaded config, each time when a new config was loaded
@@ -13104,31 +13601,6 @@
                 },] }
     ];
 
-    var FilterItemViewmodel = /** @class */ (function () {
-        function FilterItemViewmodel(code, description, checked, count, valueName) {
-            this.checked = false;
-            this.code = code;
-            this.description = description === null || description === void 0 ? void 0 : description.toString();
-            this.checked = checked;
-            this.count = count;
-            this.valueName = valueName;
-        }
-        FilterItemViewmodel.prototype.codeAsNumber = function () { return NumberUtils.ParseInt(this.code); };
-        return FilterItemViewmodel;
-    }());
-
-    var FilterViewmodel = /** @class */ (function () {
-        function FilterViewmodel(collection, fields) {
-            var _this = this;
-            this.filterItems = [];
-            collection.forEach(function (item) {
-                var _a, _b, _c;
-                _this.filterItems.push(new FilterItemViewmodel(item[fields.value], item[fields.text], (_a = item.checked) !== null && _a !== void 0 ? _a : false, (_b = item.count) !== null && _b !== void 0 ? _b : null, (_c = item.valueName) !== null && _c !== void 0 ? _c : null));
-            });
-        }
-        return FilterViewmodel;
-    }());
-
     var ColorSequenceService = /** @class */ (function () {
         function ColorSequenceService() {
             this.colors = new Map();
@@ -13189,6 +13661,8 @@
     exports.ColorSequenceService = ColorSequenceService;
     exports.CoreComponentsTranslationModule = CoreComponentsTranslationModule;
     exports.CoreComponentsTranslationService = CoreComponentsTranslationService;
+    exports.CoreDialogModule = CoreDialogModule;
+    exports.CoreDialogService = CoreDialogService;
     exports.DoubleCalendarComponent = DoubleCalendarComponent;
     exports.DoubleCalendarModule = DoubleCalendarModule;
     exports.FilterItemComponent = FilterItemComponent;
@@ -13222,6 +13696,8 @@
     exports.InputNumberPickerModule = InputNumberPickerModule;
     exports.InputRadioButtonComponent = InputRadioButtonComponent;
     exports.InputRadioButtonModule = InputRadioButtonModule;
+    exports.InputScannerComponent = InputScannerComponent;
+    exports.InputScannerModule = InputScannerModule;
     exports.InputSearchComponent = InputSearchComponent;
     exports.InputSearchModule = InputSearchModule;
     exports.InputTextComponent = InputTextComponent;
@@ -13233,6 +13709,8 @@
     exports.ListOfValuesComponent = ListOfValuesComponent;
     exports.ListOfValuesModule = ListOfValuesModule;
     exports.ListOfValuesPopupComponent = ListOfValuesPopupComponent;
+    exports.LoaderComponent = LoaderComponent;
+    exports.LoaderModule = LoaderModule;
     exports.NgZoneWrapperService = NgZoneWrapperService;
     exports.ObserveVisibilityModule = ObserveVisibilityModule;
     exports.OrientationOfDirection = OrientationOfDirection;
@@ -13277,12 +13755,16 @@
     exports["ɵbb"] = PaginatePipe;
     exports["ɵbc"] = SimpleGridCellComponent;
     exports["ɵbd"] = ListOfValuesMultiselectPopupComponent;
-    exports["ɵbe"] = PrependPipeModule;
-    exports["ɵbf"] = PrependPipe;
-    exports["ɵbg"] = TooltipModule;
-    exports["ɵbh"] = TooltipComponent;
-    exports["ɵbi"] = TooltipDirective;
+    exports["ɵbe"] = ConfirmationDialogComponent;
+    exports["ɵbf"] = DialogBaseComponent;
+    exports["ɵbg"] = CoreDynamicComponentService;
+    exports["ɵbh"] = PrependPipeModule;
+    exports["ɵbi"] = PrependPipe;
     exports["ɵbj"] = CheckmarkOverlayComponent;
+    exports["ɵbk"] = ScannerService;
+    exports["ɵbl"] = TooltipModule;
+    exports["ɵbm"] = TooltipComponent;
+    exports["ɵbn"] = TooltipDirective;
     exports["ɵc"] = MD_RIPPLE_GLOBAL_OPTIONS;
     exports["ɵd"] = CoRippleDirective;
     exports["ɵe"] = CoViewportRulerService;