@colijnit/corecomponents_v12 259.1.21 → 259.1.23

package/bundles/colijnit-corecomponents_v12.umd.js

@@ -2274,6 +2274,7 @@
             this.keyDown = new i0.EventEmitter();
             this.keyUp = new i0.EventEmitter();
             this.modelChange = new i0.EventEmitter();
+            this.selectedValueChange = new i0.EventEmitter();
             this.userModelChange = new i0.EventEmitter();
             this.hiddenChange = new i0.EventEmitter();
             this.cancelClicked = new i0.EventEmitter();
@@ -3186,6 +3187,7 @@
         keyDown: [{ type: i0.Output }],
         keyUp: [{ type: i0.Output }],
         modelChange: [{ type: i0.Output }],
+        selectedValueChange: [{ type: i0.Output }],
         userModelChange: [{ type: i0.Output }],
         hiddenChange: [{ type: i0.Output }],
         cancelClicked: [{ type: i0.Output }],
@@ -10839,7 +10841,7 @@
     SimpleGridComponent.decorators = [
         { type: i0.Component, args: [{
                     selector: 'co-simple-grid',
-                    template: "\n    <co-grid-toolbar\n      *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\n    <table\n      id=\"simple-grid-table\"\n      class=\"simple-grid-table\"\n      [clickOutside]=\"editing\"\n      (clickOutside)=\"handleClickOutsideRow()\">\n      <colgroup>\n        <col\n          *ngFor=\"let column of headerColumnsCopy; 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\n          scope=\"col\"\n          #headerCell\n          class=\"simple-grid-column-header\"\n          *ngFor=\"let column of headerColumnsCopy; let index = index\">\n          <div\n            class=\"simple-grid-column-header-wrapper\"\n            [class.resizable]=\"resizable\"\n            [class.selected]=\"column.isSelected\"\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\n                class=\"simple-grid-column-header-label\"\n                [ngClass]=\"column.textAlign ? column.textAlign : defaultTextAlign\"\n                [class.with-menu]=\"showGridSettings\"\n                [class.with-sort]=\"showColumnSort\"\n                [textContent]=\"column.headerText || '&nbsp;'\" [title]=\"column.headerText\"\n                (click)=\"showColumnSort ? sortColumn(column, column.field) : toggleColumnMenu(column)\">\n              </div>\n\n              <div class=\"sort-column\" *ngIf=\"showColumnSort\">\n                <co-button\n                  (click)=\"sortColumn(column, column?.field)\"\n                  [iconData]=\"icons.getIcon(Icons.ArrowUpArrowDown)\">\n                </co-button>\n              </div>\n\n              <div class=\"column-menu\" *ngIf=\"column.isSelected\">\n                <h3 [textContent]=\"'COLUMN_OPTIONS' | coreLocalize\"></h3>\n                <ul>\n                  <li (click)=\"hideColumn(column)\">Hide Column</li>\n                  <li (click)=\"sortColumn(column, column.field)\">Sort Column</li>\n                </ul>\n              </div>\n            </ng-template>\n            <div\n              *ngIf=\"resizable && column.resizable\"\n              class=\"simple-grid-column-sizer\"\n              (mousedown)=\"handleSizerMouseDown($event, column)\">\n            </div>\n          </div>\n        </th>\n      </tr>\n\n      <div *ngIf=\"showGridSettings\" class=\"grid-settings\">\n        <co-button\n          [class.selected]=\"isSettingsMenuOpen\"\n          [iconData]=\"icons.getIcon(Icons.CogWheels)\"\n          (click)=\"toggleSettingsMenu()\">\n        </co-button>\n\n        <div class=\"settings-menu\" *ngIf=\"isSettingsMenuOpen\">\n          <h3 [textContent]=\"'GRID_OPTIONS' | coreLocalize\"></h3>\n          <ul>\n            <li (click)=\"exportToExcel()\">Export to Excel</li>\n            <li *ngIf=\"headerColumnsCopy.length !== headerColumns.length\" (click)=\"showAllColumns()\">\n              Show All Columns\n            </li>\n          </ul>\n        </div>\n      </div>\n      </thead>\n      <tbody\n        #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      <co-form class=\"simple-grid-row-form\">\n        <tr\n          #rowElement\n          class=\"simple-grid-row\"\n          [class.selected]=\"rowIndex === selectedRowIndex && !editing\" observeVisibility\n          [class.disabled]=\"getIsRowDisabled(rowIndex)\"\n          [class.editing]=\"rowIndex === editRowIndex\"\n          *ngFor=\"let row of (!!rowsPerPage ? (data | paginate: {itemsPerPage: rowsPerPage, currentPage: currentPage}) : data); last as last; let rowIndex = index\"\n          cdkDrag\n          (click)=\"handleClickRow($event, rowIndex)\" (dblclick)=\"handleDblClickRow($event, rowIndex, row)\"\n          (visibilityChange)=\"rowVisible.next(row)\"\n          (mouseenter)=\"hoveredRowIndex = rowIndex\"\n          (mouseleave)=\"hoveredRowIndex = -1\"\n        >\n          <ng-container *ngIf=\"isSingleColumnRow(row)\">\n            <td class=\"simple-grid-single-column-cell\" [attr.colspan]=\"headerColumnsCopy.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 headerColumnsCopy; 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 *ngIf=\"inlineEdit && showRowButtons\">\n              <div class=\"icons-container\" *ngIf=\"!editing\">\n                <co-icon class=\"icon-item icon-edit\"\n                         [iconData]=\"icons.getIcon(Icons.PenToSquareSolid)\" *ngIf=\"hoveredRowIndex === rowIndex\"\n                         (click)=\"editRow($event, true, rowIndex); $event.stopPropagation()\"></co-icon>\n                <co-icon class=\"icon-item icon-delete\"\n                         [iconData]=\"icons.getIcon(Icons.TrashBin)\" *ngIf=\"hoveredRowIndex === rowIndex\"\n                         (click)=\"selectTheRow(rowIndex); removeRow();\"></co-icon>\n              </div>\n              <div class=\"icons-container\">\n                <co-button class=\"save-button\"\n                           *ngIf=\"editing && (selectedRowIndex === rowIndex || (isNewRow && rowIndex === editRowIndex))\"\n                           [iconData]=\"icons.getIcon(Icons.CheckDuotone)\"\n                           (click)=\"validateAndSave(); $event.stopPropagation()\"></co-button>\n                <co-button class=\"close-button\"\n                           *ngIf=\"editing && (selectedRowIndex === rowIndex || (isNewRow && rowIndex === editRowIndex))\"\n                           [iconData]=\"icons.getIcon(Icons.CrossSkinny)\"\n                           (click)=\"cancelEditRow(); $event.stopPropagation() \"></co-button>\n              </div>\n            </ng-container>\n            <ng-container *ngIf=\"!(inlineEdit && showRowButtons) && showDelete\">\n              <div class=\"icons-container\">\n                <co-icon class=\"icon-item icon-delete\"\n                         [iconData]=\"icons.getIcon(Icons.TrashBin)\" *ngIf=\"hoveredRowIndex === rowIndex\"\n                         (click)=\"selectTheRow(rowIndex); removeRow();\">\n                </co-icon>\n              </div>\n            </ng-container>\n          </ng-container>\n        </tr>\n      </co-form>\n      </tbody>\n    </table>\n    <co-pagination-bar\n      *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\n      *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\n    <table\n      id=\"simple-grid-table\"\n      class=\"simple-grid-table\"\n      [clickOutside]=\"editing\"\n      (clickOutside)=\"handleClickOutsideRow()\">\n      <colgroup>\n        <col\n          *ngFor=\"let column of headerColumnsCopy; 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        <col\n          *ngIf=\"((inlineEdit && showRowButtons) || (showDelete && !showRowButtons)) && (hoveredRowIndex >= 0 || selectedRowIndex >= 0 || isNewRow)\"\n          [class.icons-col]=\"true\"\n          [class.col-width-row-buttons]=\"inlineEdit && showRowButtons\"\n          [class.col-width-delete]=\"!showRowButtons && showDelete\">\n      </colgroup>\n      <thead>\n      <tr>\n        <th\n          scope=\"col\"\n          #headerCell\n          class=\"simple-grid-column-header\"\n          *ngFor=\"let column of headerColumnsCopy; let index = index\">\n          <div\n            class=\"simple-grid-column-header-wrapper\"\n            [class.resizable]=\"resizable\"\n            [class.selected]=\"column.isSelected\"\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\n                class=\"simple-grid-column-header-label\"\n                [ngClass]=\"column.textAlign ? column.textAlign : defaultTextAlign\"\n                [class.with-menu]=\"showGridSettings\"\n                [class.with-sort]=\"showColumnSort\"\n                [textContent]=\"column.headerText || '&nbsp;'\" [title]=\"column.headerText\"\n                (click)=\"showColumnSort ? sortColumn(column, column.field) : toggleColumnMenu(column)\">\n              </div>\n\n              <div class=\"sort-column\" *ngIf=\"showColumnSort\">\n                <co-button\n                  (click)=\"sortColumn(column, column?.field)\"\n                  [iconData]=\"icons.getIcon(Icons.ArrowUpArrowDown)\">\n                </co-button>\n              </div>\n\n              <div class=\"column-menu\" *ngIf=\"column.isSelected\">\n                <h3 [textContent]=\"'COLUMN_OPTIONS' | coreLocalize\"></h3>\n                <ul>\n                  <li (click)=\"hideColumn(column)\">Hide Column</li>\n                  <li (click)=\"sortColumn(column, column.field)\">Sort Column</li>\n                </ul>\n              </div>\n            </ng-template>\n            <div\n              *ngIf=\"resizable && column.resizable\"\n              class=\"simple-grid-column-sizer\"\n              (mousedown)=\"handleSizerMouseDown($event, column)\">\n            </div>\n          </div>\n        </th>\n      </tr>\n\n      <div *ngIf=\"showGridSettings\" class=\"grid-settings\">\n        <co-button\n          [class.selected]=\"isSettingsMenuOpen\"\n          [iconData]=\"icons.getIcon(Icons.CogWheels)\"\n          (click)=\"toggleSettingsMenu()\">\n        </co-button>\n\n        <div class=\"settings-menu\" *ngIf=\"isSettingsMenuOpen\">\n          <h3 [textContent]=\"'GRID_OPTIONS' | coreLocalize\"></h3>\n          <ul>\n            <li (click)=\"exportToExcel()\">Export to Excel</li>\n            <li *ngIf=\"headerColumnsCopy.length !== headerColumns.length\" (click)=\"showAllColumns()\">\n              Show All Columns\n            </li>\n          </ul>\n        </div>\n      </div>\n      </thead>\n      <tbody\n        #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      <co-form class=\"simple-grid-row-form\">\n        <tr\n          #rowElement\n          class=\"simple-grid-row\"\n          [class.selected]=\"rowIndex === selectedRowIndex && !editing\" observeVisibility\n          [class.disabled]=\"getIsRowDisabled(rowIndex)\"\n          [class.editing]=\"rowIndex === editRowIndex\"\n          *ngFor=\"let row of (!!rowsPerPage ? (data | paginate: {itemsPerPage: rowsPerPage, currentPage: currentPage}) : data); last as last; let rowIndex = index\"\n          cdkDrag\n          (click)=\"handleClickRow($event, rowIndex)\" (dblclick)=\"handleDblClickRow($event, rowIndex, row)\"\n          (visibilityChange)=\"rowVisible.next(row)\"\n          (mouseenter)=\"hoveredRowIndex = rowIndex\"\n          (mouseleave)=\"hoveredRowIndex = -1\"\n        >\n          <ng-container *ngIf=\"isSingleColumnRow(row)\">\n            <td class=\"simple-grid-single-column-cell\" [attr.colspan]=\"headerColumnsCopy.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 headerColumnsCopy; 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 *ngIf=\"(inlineEdit && showRowButtons) || (showDelete && !showRowButtons)\">\n              <td class=\"icons-container\"\n                  *ngIf=\"(editRowIndex <= -1 && selectedRowIndex === -1 && hoveredRowIndex === rowIndex) || selectedRowIndex === rowIndex || (isNewRow && rowIndex === editRowIndex)\">\n                <ng-container>\n                  <co-icon class=\"icon-item icon-edit\"\n                           *ngIf=\"!editing && (inlineEdit && showRowButtons)\"\n                           [iconData]=\"icons.getIcon(Icons.PenToSquareSolid)\"\n                           (click)=\"editRow($event, true, rowIndex); $event.stopPropagation()\"></co-icon>\n                  <co-icon class=\"icon-item icon-delete\"\n                           [iconData]=\"icons.getIcon(Icons.TrashBin)\"\n                           *ngIf=\"(!editing && (inlineEdit || !inlineEdit) && showRowButtons) || (!showRowButtons && showDelete)\"\n                           (click)=\"selectTheRow(rowIndex); removeRow();\"></co-icon>\n                </ng-container>\n                <ng-container *ngIf=\"editing && inlineEdit && showRowButtons && (selectedRowIndex === rowIndex || isNewRow)\">\n                  <co-button class=\"save-button\"\n                             [iconData]=\"icons.getIcon(Icons.CheckDuotone)\"\n                             (click)=\"validateAndSave(); $event.stopPropagation()\"></co-button>\n                  <co-button class=\"close-button\"\n                             [iconData]=\"icons.getIcon(Icons.CrossSkinny)\"\n                             (click)=\"cancelEditRow(); $event.stopPropagation() \"></co-button>\n                </ng-container>\n              </td>\n            </ng-container>\n          </ng-container>\n        </tr>\n      </co-form>\n      </tbody>\n    </table>\n    <co-pagination-bar\n      *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],
                     changeDetection: i0.ChangeDetectionStrategy.OnPush,
                     encapsulation: i0.ViewEncapsulation.None
@@ -11697,6 +11699,7 @@
             this.iconCacheService = iconCacheService;
             this._elementRef = _elementRef;
             this.multiselect = false;
+            this.showToggleAll = false;
             this.displayField = 'description';
             this.searchDisabled = false;
             this.modelChange = new i0.EventEmitter();
@@ -11704,6 +11707,7 @@
             this.keyDown = new i0.EventEmitter();
             this.viewModels = [];
             this.viewModelsMain = [];
+            this.allSelected = false;
             this._collection = [];
             this._searchTerm = '';
             this._lovItems = [];
@@ -11784,12 +11788,13 @@
                     case KeyboardKey.Up:
                         this.selectNextOption(true);
                         return false;
-                    case KeyboardKey.SpaceBar:
+                    case KeyboardKey.Enter:
                         if (this.highLightModel) {
                             this.selectViewModel(this.highLightModel, false);
                         }
                         else {
                             this.keyDown.next(event);
+                            return true;
                         }
                         return false;
                     default:
@@ -11874,6 +11879,27 @@
                 this._scrollIntoView();
             }
         };
+        ListOfValuesPopupComponent.prototype.selectAll = function () {
+            if (this.viewModels.length > 0) {
+                this.viewModels.forEach(function (vm) { return vm.checked = true; });
+                this.selectOptions();
+            }
+        };
+        ListOfValuesPopupComponent.prototype.toggleAll = function () {
+            if (!this.allSelected) {
+                if (this.viewModels.length > 0) {
+                    this.viewModels.forEach(function (vm) { return vm.checked = true; });
+                    this.selectOptions();
+                }
+            }
+            else {
+                if (this.viewModels.length > 0) {
+                    this.viewModels.forEach(function (vm) { return vm.checked = false; });
+                    this.selectOptions();
+                }
+            }
+            this.allSelected = !this.allSelected;
+        };
         ListOfValuesPopupComponent.prototype._prepareViewModelsMain = function () {
             var _this = this;
             this.viewModelsMain.length = 0;
@@ -11917,7 +11943,7 @@
     ListOfValuesPopupComponent.decorators = [
         { type: i0.Component, args: [{
                     selector: 'co-list-of-values-popup',
-                    template: "\n    <div class=\"lov-options\" [overlay]=\"parentForOverlay\" [inheritWidth]=\"true\" [ngClass]=\"customCssClass\"\n         id=\"lov-popup\"\n         role=\"listbox\" [tabindex]=\"-1\"\n         (clickOutside)=\"closePopup.emit($event)\">\n      <co-input-search *ngIf=\"multiselect\"\n                       tabindex=\"-1\"\n                       [(model)]=\"searchTerm\"\n                       [placeholder]=\"searchPlaceholder\"\n                       (keydown)=\"handleInputKeyDown($event)\"\n                       (modelChange)=\"filterViewModels()\"></co-input-search>\n      <ul class=\"dropdown-list\" #dropDownList>\n        <li\n          #lovItem\n          *ngFor=\"let viewModel of viewModels; let index = index\"\n          [class.selected]=\"viewModel === highLightModel || viewModels.length === 1\"\n          (click)=\"selectViewModel(viewModel, !multiselect)\"\n          role=\"option\">\n          <ng-container *ngIf=\"!multiselect\">\n              <co-icon *ngIf=\"viewModel.model[optionIcon]\" class=\"input-text-left-icon\" [iconData]=\"iconCacheService.getIcon(viewModel.model[optionIcon])\">\n              </co-icon>\n            <span class=\"lov-options-text\" [textContent]=\"viewModel.model[displayField]\"></span>\n          </ng-container>\n          <ng-container *ngIf=\"multiselect\">\n            <co-input-checkbox [model]=\"viewModel.checked\"\n                               (modelChange)=\"selectViewModel(viewModel, false)\"></co-input-checkbox>\n            <span class=\"lov-options-text\" [textContent]=\"viewModel.model[displayField]\"></span>\n          </ng-container>\n        </li>\n      </ul>\n    </div>\n  ",
+                    template: "\n      <div class=\"lov-options\" [overlay]=\"parentForOverlay\" [inheritWidth]=\"true\" [ngClass]=\"customCssClass\"\n           id=\"lov-popup\"\n           role=\"listbox\" [tabindex]=\"-1\"\n           (clickOutside)=\"closePopup.emit($event)\">\n          <co-input-search *ngIf=\"multiselect\"\n                           tabindex=\"-1\"\n                           [(model)]=\"searchTerm\"\n                           [placeholder]=\"searchPlaceholder\"\n                           (keydown)=\"handleInputKeyDown($event)\"\n                           (modelChange)=\"filterViewModels()\"></co-input-search>\n          <div class=\"row gap\" *ngIf=\"showToggleAll && multiselect\">\n              <co-input-checkbox [model]=\"allSelected\" (modelChange)=\"toggleAll()\"></co-input-checkbox>\n              <span [textContent]=\"'DESELECT_ALL' | coreLocalize\" (click)=\"toggleAll()\"></span>\n          </div>\n          <ul class=\"dropdown-list\" #dropDownList>\n              <li\n                      #lovItem\n                      *ngFor=\"let viewModel of viewModels; let index = index\"\n                      [class.selected]=\"viewModel === highLightModel || viewModels.length === 1\"\n                      (click)=\"selectViewModel(viewModel, !multiselect)\"\n                      role=\"option\">\n                  <ng-container *ngIf=\"!multiselect\">\n                      <co-icon *ngIf=\"viewModel.model[optionIcon]\" class=\"input-text-left-icon\" [iconData]=\"iconCacheService.getIcon(viewModel.model[optionIcon])\">\n                      </co-icon>\n                      <span class=\"lov-options-text\" [textContent]=\"viewModel.model[displayField]\"></span>\n                  </ng-container>\n                  <ng-container *ngIf=\"multiselect\">\n                      <co-input-checkbox [model]=\"viewModel.checked\"\n                                         (modelChange)=\"selectViewModel(viewModel, false)\"></co-input-checkbox>\n                      <span class=\"lov-options-text\" [textContent]=\"viewModel.model[displayField]\"></span>\n                  </ng-container>\n              </li>\n          </ul>\n      </div>\n  ",
                     encapsulation: i0.ViewEncapsulation.None
                 },] }
     ];
@@ -11931,6 +11957,7 @@
         inputSearch: [{ type: i0.ViewChild, args: [InputSearchComponent,] }],
         model: [{ type: i0.Input }],
         multiselect: [{ type: i0.Input }],
+        showToggleAll: [{ type: i0.Input }],
         displayField: [{ type: i0.Input }],
         searchPlaceholder: [{ type: i0.Input }],
         customCssClass: [{ type: i0.Input }],
@@ -11958,6 +11985,7 @@
             _this.elementRef = elementRef;
             _this.icons = exports.CoreComponentsIcon;
             _this.multiselect = false;
+            _this.showToggleAll = false;
             _this.largeCollection = false;
             _this.displayField = 'description';
             _this.searchDisabled = false;
@@ -12117,6 +12145,7 @@
                 searchPlaceholder: this.searchPlaceholder,
                 displayField: this.displayField,
                 multiselect: this.multiselect,
+                showToggleAll: this.showToggleAll,
                 model: this.model,
                 collection: this.collection,
                 optionIcon: this.optionIcon,
@@ -12148,7 +12177,7 @@
                 }
             }
             this.setModel(option);
-            this.modelChange.emit(this.model);
+            this.selectedValueChange.emit(option);
             this.detectChanges();
         };
         ListOfValuesComponent.prototype.closePopup = function () {
@@ -12226,6 +12255,7 @@
         model: [{ type: i0.Input }],
         parentForOverlay: [{ type: i0.ViewChild, args: ['parentForOverlay', { read: i0.ElementRef },] }],
         multiselect: [{ type: i0.HostBinding, args: ['class.custom-height',] }, { type: i0.HostBinding, args: ['class.multi-select',] }, { type: i0.Input }],
+        showToggleAll: [{ type: i0.Input }],
         largeCollection: [{ type: i0.Input }],
         displayField: [{ type: i0.Input }],
         optionIcon: [{ type: i0.Input }],
@@ -12354,7 +12384,8 @@
                         OverlayModule,
                         ClickoutsideModule,
                         IconModule,
-                        InputSearchModule
+                        InputSearchModule,
+                        CoreComponentsTranslationModule
                     ],
                     declarations: [
                         ListOfValuesComponent,
@@ -15131,6 +15162,11 @@
         };
         HourSchedulingExpandableComponent.prototype.handleDrop = function (dragEvent, hour) {
             var _this = this;
+            dragEvent.preventDefault();
+            dragEvent.stopPropagation();
+            if (!this.schedule[this.objectsProp] || !this.schedule[this.objectsProp].find(function (object) { var _a; return object[_this.idProp] === _this.currentDraggingObject && ((_a = _this.currentDraggingObject) === null || _a === void 0 ? void 0 : _a.id); })) {
+                this.currentDraggingObject = undefined;
+            }
             if (this.currentDraggingObject) {
                 //The order was scheduled and needs to be moved
                 var start = this.currentDraggingObject.start;
@@ -15148,17 +15184,17 @@
                     scheduledObject.top = this.timeDifference(this.schedule[this.childProp][this.startTimeProp], scheduledObject.start);
                     scheduledObject.height = this.timeDifference(scheduledObject.start, scheduledObject.end);
                     this.timeChangeEvent.emit(originalObject);
-                    this.currentDraggingObject = undefined;
                 }
+                this.currentDraggingObject = undefined;
             }
             else {
                 var parsed = this.tryParseJSONObject(dragEvent.dataTransfer.getData("text"));
                 if (!parsed) {
                     this.newObjectPlanEvent.emit({ currentHour: hour, data: parsed.toString() });
-                    return;
                 }
-                //Move between calendars is still too buggy
-                // this.moveBetweenCalendarsEvent.emit({hour: hour, data: parsed});
+                else {
+                    this.moveBetweenCalendarsEvent.emit({ hour: hour, data: parsed });
+                }
             }
         };
         HourSchedulingExpandableComponent.prototype.allowDrop = function (event, hour) {
@@ -15345,8 +15381,10 @@
             return true;
         };
         HourSchedulingExpandableTemplateComponent.prototype.onExpandableDragStart = function (event, obj, onDragStartCustom) {
-            onDragStartCustom === null || onDragStartCustom === void 0 ? void 0 : onDragStartCustom.call(obj);
-            event.dataTransfer.setData("text", JSON.stringify({ obj: obj }));
+            event.dataTransfer.setData('text', JSON.stringify({ obj: obj }));
+            if (onDragStartCustom) {
+                onDragStartCustom === null || onDragStartCustom === void 0 ? void 0 : onDragStartCustom.call(obj);
+            }
         };
         HourSchedulingExpandableTemplateComponent.prototype.calculateLeftAndWidthOfObjects = function () {
             var layoutData = new Array(this._objects.length);
@@ -15358,8 +15396,9 @@
             var overlapGroups = [];
             var processed = new Set();
             for (var i = 0; i < this._objects.length; i++) {
-                if (processed.has(i))
+                if (processed.has(i)) {
                     continue;
+                }
                 var group = [i];
                 var objA = this._objects[i];
                 var startA = new Date(objA.start);
@@ -15393,8 +15432,8 @@
     }());
     HourSchedulingExpandableTemplateComponent.decorators = [
         { type: i0.Component, args: [{
-                    selector: "co-hour-scheduling-expandable-template",
-                    template: "\n       \n            <div\n                    *ngFor=\"let obj of objects\"\n                    [class]=\"'custom-scheduled-object'\"\n                    [class.selected]=\"obj.selected\"\n                    [draggable]=\"!obj.selected\"\n                    [style.--height]=\"obj.height + 'px'\"\n                    [style.--top]=\"obj.top + 'px'\"\n                    [style.--left]=\"layouts[objects.indexOf(obj)].leftPercent + '%'\"\n                    [style.--width]=\"layouts[objects.indexOf(obj)].widthPercent + '%'\"\n                    (click)=\"onSelectBlock(obj)\"\n                    (dragstart)=\"onExpandableDragStart($event, obj, onDragStartCustom(obj) )\">\n\n                <div\n                        *ngIf=\"obj.selected\"\n                        class=\"top-resizer\"\n                        (mousedown)=\"onResizeStart($event, obj, 'top')\"></div>\n                <ng-template\n                        [ngTemplateOutlet]=\"objectTemplate\"\n                        [ngTemplateOutletContext]=\"{\n              object: obj\n            }\"\n                >\n                </ng-template>\n                <div *ngIf=\"obj.selected\"\n                     class=\"bottom-resizer\"\n                     (mousedown)=\"onResizeStart($event, obj, 'bottom')\"></div>\n            </div>\n    ",
+                    selector: 'co-hour-scheduling-expandable-template',
+                    template: "\n\n      <div\n              *ngFor=\"let obj of objects\"\n              [class]=\"'custom-scheduled-object'\"\n              [class.selected]=\"obj.selected\"\n              [draggable]=\"!obj.selected\"\n              [style.--height]=\"obj.height + 'px'\"\n              [style.--top]=\"obj.top + 'px'\"\n              [style.--left]=\"layouts[objects.indexOf(obj)].leftPercent + '%'\"\n              [style.--width]=\"layouts[objects.indexOf(obj)].widthPercent + '%'\"\n              (click)=\"onSelectBlock(obj)\"\n              (dragstart)=\"onExpandableDragStart($event, obj, onDragStartCustom(obj) )\">\n\n          <div\n                  *ngIf=\"obj.selected\"\n                  class=\"top-resizer\"\n                  (mousedown)=\"onResizeStart($event, obj, 'top')\"></div>\n          <ng-template\n                  [ngTemplateOutlet]=\"objectTemplate\"\n                  [ngTemplateOutletContext]=\"{\n              object: obj\n            }\"\n          >\n          </ng-template>\n          <div *ngIf=\"obj.selected\"\n               class=\"bottom-resizer\"\n               (mousedown)=\"onResizeStart($event, obj, 'bottom')\"></div>\n      </div>\n  ",
                     encapsulation: i0.ViewEncapsulation.None
                 },] }
     ];
@@ -15406,9 +15445,29 @@
         onSelectBlock: [{ type: i0.Input }],
         startTimeProp: [{ type: i0.Input }],
         endTimeProp: [{ type: i0.Input }],
-        showClass: [{ type: i0.HostBinding, args: ["class.co-hour-scheduling-expandable-template",] }]
+        showClass: [{ type: i0.HostBinding, args: ['class.co-hour-scheduling-expandable-template',] }]
     };
 
+    var HourSchedulingExpandableTemplateModule = /** @class */ (function () {
+        function HourSchedulingExpandableTemplateModule() {
+        }
+        return HourSchedulingExpandableTemplateModule;
+    }());
+    HourSchedulingExpandableTemplateModule.decorators = [
+        { type: i0.NgModule, args: [{
+                    imports: [
+                        common.CommonModule,
+                    ],
+                    declarations: [
+                        HourSchedulingExpandableTemplateComponent
+                    ],
+                    exports: [
+                        HourSchedulingExpandableTemplateComponent
+                    ],
+                    providers: [common.DatePipe]
+                },] }
+    ];
+
     var HourSchedulingTestObjectComponent = /** @class */ (function () {
         function HourSchedulingTestObjectComponent() {
         }
@@ -15462,14 +15521,13 @@
                     imports: [
                         common.CommonModule,
                         HourSchedulingComponentModule,
+                        HourSchedulingExpandableTemplateModule
                     ],
                     declarations: [
                         HourSchedulingExpandableComponent,
-                        HourSchedulingExpandableTemplateComponent
                     ],
                     exports: [
                         HourSchedulingExpandableComponent,
-                        HourSchedulingExpandableTemplateComponent
                     ],
                     providers: [common.DatePipe]
                 },] }
@@ -15536,6 +15594,7 @@
     exports.HourSchedulingExpandableComponent = HourSchedulingExpandableComponent;
     exports.HourSchedulingExpandableComponentModule = HourSchedulingExpandableComponentModule;
     exports.HourSchedulingExpandableTemplateComponent = HourSchedulingExpandableTemplateComponent;
+    exports.HourSchedulingExpandableTemplateModule = HourSchedulingExpandableTemplateModule;
     exports.IconCacheService = IconCacheService;
     exports.IconCollapseHandleComponent = IconCollapseHandleComponent;
     exports.IconCollapseHandleModule = IconCollapseHandleModule;