igniteui-angular-data-grids 21.1.0-beta.1 → 21.1.0

package/esm5/lib/igx-checkbox-list-component.js

@@ -374,10 +374,10 @@ var IgxCheckboxListComponent = /** @class */ /*@__PURE__*/ (function () {
          * Gets or sets the search background color.
         */
         get: function () {
-            return brushToString(this.i.fm);
+            return brushToString(this.i.fs);
         },
         set: function (v) {
-            this.i.fm = stringToBrush(v);
+            this.i.fs = stringToBrush(v);
         },
         enumerable: false,
         configurable: true
@@ -457,10 +457,10 @@ var IgxCheckboxListComponent = /** @class */ /*@__PURE__*/ (function () {
          * Gets or sets the checkbox tick color.
         */
         get: function () {
-            return brushToString(this.i.fc);
+            return brushToString(this.i.fg);
         },
         set: function (v) {
-            this.i.fc = stringToBrush(v);
+            this.i.fg = stringToBrush(v);
         },
         enumerable: false,
         configurable: true
@@ -548,10 +548,36 @@ var IgxCheckboxListComponent = /** @class */ /*@__PURE__*/ (function () {
          * Gets or sets the scrollbar background color.
         */
         get: function () {
-            return brushToString(this.i.fl);
+            return brushToString(this.i.scrollbarBackground);
+        },
+        set: function (v) {
+            this.i.scrollbarBackground = stringToBrush(v);
+        },
+        enumerable: false,
+        configurable: true
+    });
+    Object.defineProperty(IgxCheckboxListComponent.prototype, "scrollbarHoverBackground", {
+        /**
+         * Gets or sets the scrollbar thumb background color when the pointer is over it.
+        */
+        get: function () {
+            return brushToString(this.i.scrollbarHoverBackground);
+        },
+        set: function (v) {
+            this.i.scrollbarHoverBackground = stringToBrush(v);
+        },
+        enumerable: false,
+        configurable: true
+    });
+    Object.defineProperty(IgxCheckboxListComponent.prototype, "scrollbarActiveBackground", {
+        /**
+         * Gets or sets the scrollbar thumb background color when the user is dragging it.
+        */
+        get: function () {
+            return brushToString(this.i.scrollbarActiveBackground);
         },
         set: function (v) {
-            this.i.fl = stringToBrush(v);
+            this.i.scrollbarActiveBackground = stringToBrush(v);
         },
         enumerable: false,
         configurable: true
@@ -561,10 +587,10 @@ var IgxCheckboxListComponent = /** @class */ /*@__PURE__*/ (function () {
          * Gets / sets the caption of the "Select All" checkbox.
         */
         get: function () {
-            return this.i.c1;
+            return this.i.c3;
         },
         set: function (v) {
-            this.i.c1 = v;
+            this.i.c3 = v;
         },
         enumerable: false,
         configurable: true
@@ -587,10 +613,10 @@ var IgxCheckboxListComponent = /** @class */ /*@__PURE__*/ (function () {
          * Gets or sets the color to use for the actual header selectAllCaption text.
         */
         get: function () {
-            return brushToString(this.i.e8);
+            return brushToString(this.i.fc);
         },
         set: function (v) {
-            this.i.e8 = stringToBrush(v);
+            this.i.fc = stringToBrush(v);
         },
         enumerable: false,
         configurable: true
@@ -759,17 +785,17 @@ var IgxCheckboxListComponent = /** @class */ /*@__PURE__*/ (function () {
 
 */
     IgxCheckboxListComponent.prototype.selectAll = function () {
-        this.i.el();
+        this.i.en();
     };
     /**
      * Deselects all the items in the checkbox list.
     
     */
     IgxCheckboxListComponent.prototype.deselectAll = function () {
-        this.i.dh();
+        this.i.dj();
     };
     IgxCheckboxListComponent.prototype.notifySetItem = function (index, oldItem, newItem) {
-        this.i.dw(index, oldItem, newItem);
+        this.i.dy(index, oldItem, newItem);
     };
     /**
      * Manually notifies the checkboxlist's grid that the data it has bound to has been cleared and needs to be re-examined.
@@ -777,22 +803,22 @@ var IgxCheckboxListComponent = /** @class */ /*@__PURE__*/ (function () {
     
     */
     IgxCheckboxListComponent.prototype.notifyClearItems = function () {
-        this.i.ds();
+        this.i.du();
     };
     IgxCheckboxListComponent.prototype.notifyInsertItem = function (index, newItem) {
-        this.i.dt(index, newItem);
+        this.i.dv(index, newItem);
     };
     IgxCheckboxListComponent.prototype.notifyRemoveItem = function (index, oldItem) {
-        this.i.dv(index, oldItem);
+        this.i.dx(index, oldItem);
     };
     IgxCheckboxListComponent.prototype.refresh = function () {
         this.i.refresh();
     };
     IgxCheckboxListComponent.prototype.addKeyValue = function (value) {
-        this.i.dc(value);
+        this.i.de(value);
     };
     IgxCheckboxListComponent.prototype.removeKeyValue = function (value) {
-        this.i.ej(value);
+        this.i.el(value);
     };
     IgxCheckboxListComponent.prototype.getDesiredSize = function (availableSize) {
         var iv = this.i.getDesiredSize(toSize(availableSize));
@@ -1009,7 +1035,7 @@ var IgxCheckboxListComponent = /** @class */ /*@__PURE__*/ (function () {
         }
     };
     IgxCheckboxListComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: IgxCheckboxListComponent, deps: [{ token: i0.Renderer2 }, { token: i0.ViewContainerRef }, { token: i0.NgZone }, { token: i0.Injector }, { token: i0.ComponentFactoryResolver }], target: i0.ɵɵFactoryTarget.Component });
-    IgxCheckboxListComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.17", type: IgxCheckboxListComponent, selector: "igx-checkbox-list", inputs: { height: "height", width: "width", dataSource: "dataSource", keys: "keys", primaryKey: "primaryKey", dataMemberPath: "dataMemberPath", dataLegendTarget: "dataLegendTarget", subtitleMemberPath: "subtitleMemberPath", propertyTypeMemberPath: "propertyTypeMemberPath", selectedMemberPath: "selectedMemberPath", filterPlaceholderText: "filterPlaceholderText", searchInputType: "searchInputType", rowHeight: "rowHeight", cellTextStyle: "cellTextStyle", indexType: "indexType", baseTheme: "baseTheme", density: "density", searchIconColor: "searchIconColor", searchBackgroundColor: "searchBackgroundColor", labelClickTriggersChange: "labelClickTriggersChange", searchTextColor: "searchTextColor", searchBorderColor: "searchBorderColor", searchFocusBorderColor: "searchFocusBorderColor", searchTextStyle: "searchTextStyle", checkboxTickColor: "checkboxTickColor", checkboxCheckedBackgroundColor: "checkboxCheckedBackgroundColor", checkboxUncheckedBackgroundColor: "checkboxUncheckedBackgroundColor", checkboxCheckedBorderColor: "checkboxCheckedBorderColor", checkboxUncheckedBorderColor: "checkboxUncheckedBorderColor", checkboxCornerRadius: "checkboxCornerRadius", scrollbarStyle: "scrollbarStyle", scrollbarBackground: "scrollbarBackground", selectAllCaption: "selectAllCaption", selectAllCaptionTextColor: "selectAllCaptionTextColor", actualSelectAllCaptionTextColor: "actualSelectAllCaptionTextColor", showSelectAll: "showSelectAll", backgroundColor: "backgroundColor", rowHoverBackgroundColor: "rowHoverBackgroundColor", textColor: "textColor", showFilter: "showFilter", isRowHoverEnabled: "isRowHoverEnabled", checkboxAlignedRight: "checkboxAlignedRight" }, outputs: { selectedKeyAdded: "selectedKeyAdded", selectedKeyRemoved: "selectedKeyRemoved", checkedChanged: "checkedChanged", labelClicked: "labelClicked", indexTypeChanged: "indexTypeChanged", keysCleared: "keysCleared", selectAllCheckboxChanged: "selectAllCheckboxChanged" }, host: { classAttribute: "ig-checkbox-list igx-checkbox-list" }, providers: [], viewQueries: [{ propertyName: "_listGrid", first: true, predicate: ["listGrid"], descendants: true, read: IgxDataGridComponent, static: true }, { propertyName: "_listContainer", first: true, predicate: ["listContainer"], descendants: true, read: ElementRef, static: true }, { propertyName: "_hrElement", first: true, predicate: ["hrElement"], descendants: true, read: ElementRef, static: true }, { propertyName: "_selectAllSection", first: true, predicate: ["selectAllSection"], descendants: true, read: ElementRef, static: true }], ngImport: i0, template: "<div #listContainer style=\"width: 100%; height: 100%\">\n                <div>             \n                </div>\n                <hr #hrElement>\n                <div #selectAllSection key='checkBoxListSelectAllSection'></div>\n                <igx-data-grid #listGrid headerHeight=\"0\"></igx-data-grid>\n                </div>", isInline: true, styles: ["\n\t\t:host {\n\t\t\tdisplay: block;\n\t\t}\n\t"], components: [{ type: i1.IgxDataGridComponent, selector: "igx-data-grid", inputs: ["height", "width", "dataSource", "theme", "columnResizingMode", "columnMovingMode", "isRowHoverEnabled", "rowHoverBackground", "rowHoverTextColor", "editRowBorder", "editRowBorderWidthBottom", "editRowBorderWidthLeft", "editRowBorderWidthRight", "editRowBorderWidthTop", "sectionHeader", "summaryRowRoot", "summaryRowSection", "rowSeparator", "headerRowSeparator", "headerSeparator", "columnResizingSeparator", "columnMovingSeparator", "pinnedAreaSeparator", "autoGenerateDesiredProperties", "dataSourceDesiredProperties", "density", "actualRowHeight", "rowHeight", "defaultColumnMinWidth", "actualHeaderHeight", "headerHeight", "headerClickAction", "editMode", "editModeClickAction", "editOnKeyPress", "autoGenerateColumns", "rowSeparatorHeight", "isPlaceholderRenderingEnabled", "columnAddingAnimationMode", "columnPropertyUpdatingAnimationMode", "cellDataLoadedAnimationMode", "rowSelectionAnimationMode", "rowHoverAnimationMode", "cellSelectionAnimationMode", "animationSettings", "columnResizingAnimationMode", "columnShowingAnimationMode", "columnMovingAnimationMode", "columnHidingAnimationMode", "columnExchangingAnimationMode", "selectionMode", "activationMode", "selectionBehavior", "mouseDragSelectionEnabled", "selectedItems", "selectedKeys", "selectedCells", "selectedCellRanges", "pinnedItems", "pinnedKeys", "isColumnOptionsEnabled", "useNewerColumnOptionsMenu", "isGroupRowSticky", "isHeaderSeparatorVisible", "cellSelectedBackground", "cellSelectedTextColor", "sectionHeaderSelectedBackground", "summaryRootBackground", "summarySectionBackground", "pinnedRowOpacity", "editTextStyle", "editOpacity", "deletedTextColor", "stickyRowBackground", "pinnedRowBackground", "lastStickyRowBackground", "activeCell", "cellBackground", "cellTextColor", "headerSortIndicatorColor", "headerSortIndicatorStyle", "cellTextStyle", "sectionHeaderBackground", "sectionHeaderTextColor", "sectionHeaderExpansionIndicatorIconColor", "sectionHeaderTextStyle", "summaryRootLabelTextStyle", "summarySectionLabelTextStyle", "summaryRootValueTextColor", "summaryRootValueTextStyle", "summarySectionValueTextStyle", "summarySectionValueTextColor", "summaryRootLabelTextColor", "summarySectionLabelTextColor", "summaryRootSelectedBackground", "summarySectionSelectedBackground", "pinnedAreaSeparatorWidth", "headerSeparatorWidth", "headerSeparatorBackground", "headerBackground", "headerTextColor", "headerTextStyle", "rowSeparatorBackground", "headerRowSeparatorBackground", "rowSeparatorStickyRowBackground", "rowSeparatorLastStickyRowBackground", "rowSeparatorPinnedRowBackground", "columnResizingSeparatorWidth", "columnResizingSeparatorOpacity", "columnMovingSeparatorWidth", "columnMovingSeparatorOpacity", "columnResizingSeparatorBackground", "columnMovingSeparatorBackground", "shiftSectionContent", "columnOptionsIconAlignment", "columnOptionsIconColor", "columnOptionsIconBehavior", "actualBorder", "border", "actualBorderWidth", "borderWidthBottom", "borderWidthLeft", "borderWidthRight", "borderWidthTop", "notifyOnAllSelectionChanges", "cornerRadiusBottomRight", "cornerRadiusBottomLeft", "cornerRadiusTopLeft", "cornerRadiusTopRight", "actualCornerRadiusBottomRight", "actualCornerRadiusBottomLeft", "actualCornerRadiusTopLeft", "actualCornerRadiusTopRight", "isActiveCellStyleEnabled", "stopPropagation", "actualBackground", "background", "responsiveStates", "initialSorts", "initialGroups", "initialSummaries", "summaryScope", "isGroupCollapsable", "groupHeaderDisplayMode", "isGroupExpandedDefault", "expandCollapseOnSectionHeaderClick", "groupSummaryDisplayMode", "autoAcceptEdits", "primaryKey", "actualPrimaryKey", "actualColumns", "reactsToSortChanges", "reactsToGroupChanges", "reactsToFilterChanges", "enterBehavior", "enterBehaviorAfterEdit", "isColumnOptionsSummariesEnabled", "isColumnOptionsGroupingEnabled", "mergedCellMode", "mergedCellEvaluationCriteria", "mergedCellVerticalAlignment", "filterUIType", "filterLogicalOperator", "filterComparisonType", "todayOverride", "clearSelectionOnEscape", "pageSize", "isToolbarColumnChooserVisible", "isToolbarColumnPinningVisible", "toolbarTitle", "toolbarColumnChooserText", "toolbarColumnChooserTitle", "toolbarColumnPinningText", "toolbarColumnPinningTitle", "scrollbarStyle", "scrollbarBackground", "columnOptionsBackground", "columnOptionsTextColor", "columnOptionsTextStyle", "columnOptionsHoverBackgroundColor", "columnOptionsToolTipBackgroundColor", "columnOptionsToolTipTextColor", "columnOptionsHighlightColor", "columnOptionsSeparatorColor", "columnOptionsGroupHeaderBackground", "columnOptionsGroupHeaderTextColor", "columnOptionsGroupHeaderTextStyle", "columnOptionsAccentColor", "columnOptionsRowHeight", "allowCopyOperation", "maxSelectedCellRanges", "deferEventForRowDragSelection"], outputs: ["filterExpressionsChanging", "filterExpressionsChanged", "cellPreviewPointerDown", "cellPreviewPointerUp", "cellPointerDown", "cellPointerUp", "cellClicked", "filterRowDataBinding", "filterRowDataBound", "sortDescriptionsChanged", "groupDescriptionsChanged", "summaryDescriptionsChanged", "columnHiddenChanged", "columnPinnedChanged", "cellValueChanging", "dataCommitted", "dataCommitting", "rootSummariesChanged", "sizeChanged", "actualColumnsChanged", "columnsAutoGenerated", "selectedItemsChanged", "selectedKeysChanged", "selectedCellsChanged", "selectionChanged", "activeCellChanged", "selectedCellRangesChanged", "columnWidthChanged", "cellEditStarted", "cellEditEnded", "rowEditStarted", "rowEditEnded", "customFilterRequested", "actualPrimaryKeyChange"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+    IgxCheckboxListComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.17", type: IgxCheckboxListComponent, selector: "igx-checkbox-list", inputs: { height: "height", width: "width", dataSource: "dataSource", keys: "keys", primaryKey: "primaryKey", dataMemberPath: "dataMemberPath", dataLegendTarget: "dataLegendTarget", subtitleMemberPath: "subtitleMemberPath", propertyTypeMemberPath: "propertyTypeMemberPath", selectedMemberPath: "selectedMemberPath", filterPlaceholderText: "filterPlaceholderText", searchInputType: "searchInputType", rowHeight: "rowHeight", cellTextStyle: "cellTextStyle", indexType: "indexType", baseTheme: "baseTheme", density: "density", searchIconColor: "searchIconColor", searchBackgroundColor: "searchBackgroundColor", labelClickTriggersChange: "labelClickTriggersChange", searchTextColor: "searchTextColor", searchBorderColor: "searchBorderColor", searchFocusBorderColor: "searchFocusBorderColor", searchTextStyle: "searchTextStyle", checkboxTickColor: "checkboxTickColor", checkboxCheckedBackgroundColor: "checkboxCheckedBackgroundColor", checkboxUncheckedBackgroundColor: "checkboxUncheckedBackgroundColor", checkboxCheckedBorderColor: "checkboxCheckedBorderColor", checkboxUncheckedBorderColor: "checkboxUncheckedBorderColor", checkboxCornerRadius: "checkboxCornerRadius", scrollbarStyle: "scrollbarStyle", scrollbarBackground: "scrollbarBackground", scrollbarHoverBackground: "scrollbarHoverBackground", scrollbarActiveBackground: "scrollbarActiveBackground", selectAllCaption: "selectAllCaption", selectAllCaptionTextColor: "selectAllCaptionTextColor", actualSelectAllCaptionTextColor: "actualSelectAllCaptionTextColor", showSelectAll: "showSelectAll", backgroundColor: "backgroundColor", rowHoverBackgroundColor: "rowHoverBackgroundColor", textColor: "textColor", showFilter: "showFilter", isRowHoverEnabled: "isRowHoverEnabled", checkboxAlignedRight: "checkboxAlignedRight" }, outputs: { selectedKeyAdded: "selectedKeyAdded", selectedKeyRemoved: "selectedKeyRemoved", checkedChanged: "checkedChanged", labelClicked: "labelClicked", indexTypeChanged: "indexTypeChanged", keysCleared: "keysCleared", selectAllCheckboxChanged: "selectAllCheckboxChanged" }, host: { classAttribute: "ig-checkbox-list igx-checkbox-list" }, providers: [], viewQueries: [{ propertyName: "_listGrid", first: true, predicate: ["listGrid"], descendants: true, read: IgxDataGridComponent, static: true }, { propertyName: "_listContainer", first: true, predicate: ["listContainer"], descendants: true, read: ElementRef, static: true }, { propertyName: "_hrElement", first: true, predicate: ["hrElement"], descendants: true, read: ElementRef, static: true }, { propertyName: "_selectAllSection", first: true, predicate: ["selectAllSection"], descendants: true, read: ElementRef, static: true }], ngImport: i0, template: "<div #listContainer style=\"width: 100%; height: 100%\">\n                <div>             \n                </div>\n                <hr #hrElement>\n                <div #selectAllSection key='checkBoxListSelectAllSection'></div>\n                <igx-data-grid #listGrid headerHeight=\"0\"></igx-data-grid>\n                </div>", isInline: true, styles: ["\n\t\t:host {\n\t\t\tdisplay: block;\n\t\t}\n\t"], components: [{ type: i1.IgxDataGridComponent, selector: "igx-data-grid", inputs: ["height", "width", "dataSource", "theme", "columnResizingMode", "columnMovingMode", "isRowHoverEnabled", "rowHoverBackground", "rowHoverTextColor", "editRowBorder", "editRowBorderWidthBottom", "editRowBorderWidthLeft", "editRowBorderWidthRight", "editRowBorderWidthTop", "sectionHeader", "summaryRowRoot", "summaryRowSection", "rowSeparator", "headerRowSeparator", "headerSeparator", "columnResizingSeparator", "columnMovingSeparator", "pinnedAreaSeparator", "autoGenerateDesiredProperties", "dataSourceDesiredProperties", "density", "actualRowHeight", "rowHeight", "defaultColumnMinWidth", "actualHeaderHeight", "headerHeight", "headerClickAction", "editMode", "editModeClickAction", "editOnKeyPress", "autoGenerateColumns", "rowSeparatorHeight", "isPlaceholderRenderingEnabled", "columnAddingAnimationMode", "columnPropertyUpdatingAnimationMode", "cellDataLoadedAnimationMode", "rowSelectionAnimationMode", "rowHoverAnimationMode", "cellSelectionAnimationMode", "animationSettings", "columnResizingAnimationMode", "columnShowingAnimationMode", "columnMovingAnimationMode", "columnHidingAnimationMode", "columnExchangingAnimationMode", "selectionMode", "activationMode", "selectionBehavior", "mouseDragSelectionEnabled", "selectedItems", "selectedKeys", "selectedCells", "selectedCellRanges", "pinnedItems", "pinnedKeys", "isColumnOptionsEnabled", "useNewerColumnOptionsMenu", "isGroupRowSticky", "isHeaderSeparatorVisible", "cellSelectedBackground", "cellSelectedTextColor", "sectionHeaderSelectedBackground", "summaryRootBackground", "summarySectionBackground", "pinnedRowOpacity", "editTextStyle", "editOpacity", "deletedTextColor", "stickyRowBackground", "pinnedRowBackground", "lastStickyRowBackground", "activeCell", "cellBackground", "cellTextColor", "headerSortIndicatorColor", "headerSortIndicatorStyle", "cellTextStyle", "sectionHeaderBackground", "sectionHeaderTextColor", "sectionHeaderExpansionIndicatorIconColor", "sectionHeaderTextStyle", "summaryRootLabelTextStyle", "summarySectionLabelTextStyle", "summaryRootValueTextColor", "summaryRootValueTextStyle", "summarySectionValueTextStyle", "summarySectionValueTextColor", "summaryRootLabelTextColor", "summarySectionLabelTextColor", "summaryRootSelectedBackground", "summarySectionSelectedBackground", "pinnedAreaSeparatorWidth", "headerSeparatorWidth", "headerSeparatorBackground", "headerBackground", "headerTextColor", "headerTextStyle", "rowSeparatorBackground", "headerRowSeparatorBackground", "rowSeparatorStickyRowBackground", "rowSeparatorLastStickyRowBackground", "rowSeparatorPinnedRowBackground", "columnResizingSeparatorWidth", "columnResizingSeparatorOpacity", "columnMovingSeparatorWidth", "columnMovingSeparatorOpacity", "columnResizingSeparatorBackground", "columnMovingSeparatorBackground", "shiftSectionContent", "columnOptionsIconAlignment", "columnOptionsIconColor", "columnOptionsIconBehavior", "actualBorder", "border", "actualBorderWidth", "borderWidthBottom", "borderWidthLeft", "borderWidthRight", "borderWidthTop", "notifyOnAllSelectionChanges", "cornerRadiusBottomRight", "cornerRadiusBottomLeft", "cornerRadiusTopLeft", "cornerRadiusTopRight", "actualCornerRadiusBottomRight", "actualCornerRadiusBottomLeft", "actualCornerRadiusTopLeft", "actualCornerRadiusTopRight", "isActiveCellStyleEnabled", "stopPropagation", "actualBackground", "background", "responsiveStates", "initialSorts", "initialGroups", "initialSummaries", "summaryScope", "isGroupCollapsable", "groupHeaderDisplayMode", "isGroupExpandedDefault", "expandCollapseOnSectionHeaderClick", "groupSummaryDisplayMode", "autoAcceptEdits", "primaryKey", "actualPrimaryKey", "actualColumns", "reactsToSortChanges", "reactsToGroupChanges", "reactsToFilterChanges", "enterBehavior", "enterBehaviorAfterEdit", "isColumnOptionsSummariesEnabled", "isColumnOptionsGroupingEnabled", "mergedCellMode", "mergedCellEvaluationCriteria", "mergedCellVerticalAlignment", "filterUIType", "filterLogicalOperator", "filterComparisonType", "todayOverride", "clearSelectionOnEscape", "pageSize", "isToolbarColumnChooserVisible", "isToolbarColumnPinningVisible", "toolbarTitle", "toolbarColumnChooserText", "toolbarColumnChooserTitle", "toolbarColumnPinningText", "toolbarColumnPinningTitle", "scrollbarStyle", "scrollbarBackground", "scrollbarHoverBackground", "scrollbarActiveBackground", "columnOptionsBackground", "columnOptionsScrollbarBackground", "columnOptionsScrollbarHoverBackground", "columnOptionsScrollbarActiveBackground", "columnOptionsTextColor", "columnOptionsTextStyle", "columnOptionsHoverBackgroundColor", "columnOptionsToolTipBackgroundColor", "columnOptionsToolTipTextColor", "columnOptionsHighlightColor", "columnOptionsSeparatorColor", "columnOptionsGroupHeaderBackground", "columnOptionsGroupHeaderTextColor", "columnOptionsGroupHeaderTextStyle", "columnOptionsAccentColor", "columnOptionsRowHeight", "allowCopyOperation", "maxSelectedCellRanges", "deferEventForRowDragSelection"], outputs: ["filterExpressionsChanging", "filterExpressionsChanged", "cellPreviewPointerDown", "cellPreviewPointerUp", "cellPointerDown", "cellPointerUp", "cellClicked", "filterRowDataBinding", "filterRowDataBound", "sortDescriptionsChanged", "groupDescriptionsChanged", "summaryDescriptionsChanged", "columnHiddenChanged", "columnPinnedChanged", "cellValueChanging", "dataCommitted", "dataCommitting", "rootSummariesChanged", "sizeChanged", "actualColumnsChanged", "columnsAutoGenerated", "selectedItemsChanged", "selectedKeysChanged", "selectedCellsChanged", "selectionChanged", "activeCellChanged", "selectedCellRangesChanged", "columnWidthChanged", "cellEditStarted", "cellEditEnded", "rowEditStarted", "rowEditEnded", "customFilterRequested", "actualPrimaryKeyChange"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
     return IgxCheckboxListComponent;
 }());
 export { IgxCheckboxListComponent };
@@ -1099,6 +1125,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImpo
                 type: Input
             }], scrollbarBackground: [{
                 type: Input
+            }], scrollbarHoverBackground: [{
+                type: Input
+            }], scrollbarActiveBackground: [{
+                type: Input
             }], selectAllCaption: [{
                 type: Input
             }], selectAllCaptionTextColor: [{

package/esm5/lib/igx-column-chooser-component.js

@@ -286,7 +286,7 @@ var IgxColumnChooserComponent = /** @class */ /*@__PURE__*/ (function () {
         }
     };
     IgxColumnChooserComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: IgxColumnChooserComponent, deps: [{ token: i0.Renderer2 }, { token: i0.ViewContainerRef }, { token: i0.NgZone }, { token: i0.Injector }, { token: i0.ComponentFactoryResolver }], target: i0.ɵɵFactoryTarget.Component });
-    IgxColumnChooserComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.17", type: IgxColumnChooserComponent, selector: "igx-column-chooser", inputs: { height: "height", width: "width", targetGrid: "targetGrid", title: "title", titleStyle: "titleStyle", titleColor: "titleColor", filterPlaceholderText: "filterPlaceholderText", baseTheme: "baseTheme", density: "density", backgroundColor: "backgroundColor" }, host: { classAttribute: "ig-column-chooser igx-column-chooser" }, providers: [], viewQueries: [{ propertyName: "_checkboxList", first: true, predicate: ["checkboxList"], descendants: true, read: IgxCheckboxListComponent, static: true }, { propertyName: "_chooserContainer", first: true, predicate: ["chooserContainer"], descendants: true, read: ElementRef, static: true }], ngImport: i0, template: "<div #chooserContainer>\n                <span></span>\n                <igx-checkbox-list #checkboxList></igx-checkbox-list>\n                </div>", isInline: true, styles: ["\n\t\t:host {\n\t\t\tdisplay: block;\n\t\t}\n\t"], components: [{ type: i1.IgxCheckboxListComponent, selector: "igx-checkbox-list", inputs: ["height", "width", "dataSource", "keys", "primaryKey", "dataMemberPath", "dataLegendTarget", "subtitleMemberPath", "propertyTypeMemberPath", "selectedMemberPath", "filterPlaceholderText", "searchInputType", "rowHeight", "cellTextStyle", "indexType", "baseTheme", "density", "searchIconColor", "searchBackgroundColor", "labelClickTriggersChange", "searchTextColor", "searchBorderColor", "searchFocusBorderColor", "searchTextStyle", "checkboxTickColor", "checkboxCheckedBackgroundColor", "checkboxUncheckedBackgroundColor", "checkboxCheckedBorderColor", "checkboxUncheckedBorderColor", "checkboxCornerRadius", "scrollbarStyle", "scrollbarBackground", "selectAllCaption", "selectAllCaptionTextColor", "actualSelectAllCaptionTextColor", "showSelectAll", "backgroundColor", "rowHoverBackgroundColor", "textColor", "showFilter", "isRowHoverEnabled", "checkboxAlignedRight"], outputs: ["selectedKeyAdded", "selectedKeyRemoved", "checkedChanged", "labelClicked", "indexTypeChanged", "keysCleared", "selectAllCheckboxChanged"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+    IgxColumnChooserComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.17", type: IgxColumnChooserComponent, selector: "igx-column-chooser", inputs: { height: "height", width: "width", targetGrid: "targetGrid", title: "title", titleStyle: "titleStyle", titleColor: "titleColor", filterPlaceholderText: "filterPlaceholderText", baseTheme: "baseTheme", density: "density", backgroundColor: "backgroundColor" }, host: { classAttribute: "ig-column-chooser igx-column-chooser" }, providers: [], viewQueries: [{ propertyName: "_checkboxList", first: true, predicate: ["checkboxList"], descendants: true, read: IgxCheckboxListComponent, static: true }, { propertyName: "_chooserContainer", first: true, predicate: ["chooserContainer"], descendants: true, read: ElementRef, static: true }], ngImport: i0, template: "<div #chooserContainer>\n                <span></span>\n                <igx-checkbox-list #checkboxList></igx-checkbox-list>\n                </div>", isInline: true, styles: ["\n\t\t:host {\n\t\t\tdisplay: block;\n\t\t}\n\t"], components: [{ type: i1.IgxCheckboxListComponent, selector: "igx-checkbox-list", inputs: ["height", "width", "dataSource", "keys", "primaryKey", "dataMemberPath", "dataLegendTarget", "subtitleMemberPath", "propertyTypeMemberPath", "selectedMemberPath", "filterPlaceholderText", "searchInputType", "rowHeight", "cellTextStyle", "indexType", "baseTheme", "density", "searchIconColor", "searchBackgroundColor", "labelClickTriggersChange", "searchTextColor", "searchBorderColor", "searchFocusBorderColor", "searchTextStyle", "checkboxTickColor", "checkboxCheckedBackgroundColor", "checkboxUncheckedBackgroundColor", "checkboxCheckedBorderColor", "checkboxUncheckedBorderColor", "checkboxCornerRadius", "scrollbarStyle", "scrollbarBackground", "scrollbarHoverBackground", "scrollbarActiveBackground", "selectAllCaption", "selectAllCaptionTextColor", "actualSelectAllCaptionTextColor", "showSelectAll", "backgroundColor", "rowHoverBackgroundColor", "textColor", "showFilter", "isRowHoverEnabled", "checkboxAlignedRight"], outputs: ["selectedKeyAdded", "selectedKeyRemoved", "checkedChanged", "labelClicked", "indexTypeChanged", "keysCleared", "selectAllCheckboxChanged"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
     return IgxColumnChooserComponent;
 }());
 export { IgxColumnChooserComponent };

package/esm5/lib/igx-column-moving-separator-component.js

@@ -40,30 +40,30 @@ var IgxColumnMovingSeparatorComponent = /** @class */ /*@__PURE__*/ (function (_
          * Gets or sets the separator width for this column.
         */
         get: function () {
-            return this.i.g7;
+            return this.i.g8;
         },
         set: function (v) {
-            this.i.g7 = +v;
+            this.i.g8 = +v;
         },
         enumerable: false,
         configurable: true
     });
     Object.defineProperty(IgxColumnMovingSeparatorComponent.prototype, "actualOpacity", {
         get: function () {
-            return this.i.g4;
+            return this.i.g5;
         },
         set: function (v) {
-            this.i.g4 = +v;
+            this.i.g5 = +v;
         },
         enumerable: false,
         configurable: true
     });
     Object.defineProperty(IgxColumnMovingSeparatorComponent.prototype, "opacity", {
         get: function () {
-            return this.i.g5;
+            return this.i.g6;
         },
         set: function (v) {
-            this.i.g5 = +v;
+            this.i.g6 = +v;
         },
         enumerable: false,
         configurable: true

package/esm5/lib/igx-column-pinning-component.js

@@ -285,7 +285,7 @@ var IgxColumnPinningComponent = /** @class */ /*@__PURE__*/ (function () {
         }
     };
     IgxColumnPinningComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: IgxColumnPinningComponent, deps: [{ token: i0.Renderer2 }, { token: i0.ViewContainerRef }, { token: i0.NgZone }, { token: i0.Injector }, { token: i0.ComponentFactoryResolver }], target: i0.ɵɵFactoryTarget.Component });
-    IgxColumnPinningComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.17", type: IgxColumnPinningComponent, selector: "igx-column-pinning", inputs: { height: "height", width: "width", targetGrid: "targetGrid", title: "title", titleStyle: "titleStyle", titleColor: "titleColor", filterPlaceholderText: "filterPlaceholderText", baseTheme: "baseTheme", density: "density", backgroundColor: "backgroundColor" }, host: { classAttribute: "ig-column-pinning igx-column-pinning" }, providers: [], viewQueries: [{ propertyName: "_checkboxList", first: true, predicate: ["checkboxList"], descendants: true, read: IgxCheckboxListComponent, static: true }, { propertyName: "_pinningContainer", first: true, predicate: ["pinningContainer"], descendants: true, read: ElementRef, static: true }], ngImport: i0, template: "<div #pinningContainer>\n                <span></span>\n                <igx-checkbox-list #checkboxList ></igx-checkbox-list>\n                </div>", isInline: true, styles: ["\n\t\t:host {\n\t\t\tdisplay: block;\n\t\t}\n\t"], components: [{ type: i1.IgxCheckboxListComponent, selector: "igx-checkbox-list", inputs: ["height", "width", "dataSource", "keys", "primaryKey", "dataMemberPath", "dataLegendTarget", "subtitleMemberPath", "propertyTypeMemberPath", "selectedMemberPath", "filterPlaceholderText", "searchInputType", "rowHeight", "cellTextStyle", "indexType", "baseTheme", "density", "searchIconColor", "searchBackgroundColor", "labelClickTriggersChange", "searchTextColor", "searchBorderColor", "searchFocusBorderColor", "searchTextStyle", "checkboxTickColor", "checkboxCheckedBackgroundColor", "checkboxUncheckedBackgroundColor", "checkboxCheckedBorderColor", "checkboxUncheckedBorderColor", "checkboxCornerRadius", "scrollbarStyle", "scrollbarBackground", "selectAllCaption", "selectAllCaptionTextColor", "actualSelectAllCaptionTextColor", "showSelectAll", "backgroundColor", "rowHoverBackgroundColor", "textColor", "showFilter", "isRowHoverEnabled", "checkboxAlignedRight"], outputs: ["selectedKeyAdded", "selectedKeyRemoved", "checkedChanged", "labelClicked", "indexTypeChanged", "keysCleared", "selectAllCheckboxChanged"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+    IgxColumnPinningComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.17", type: IgxColumnPinningComponent, selector: "igx-column-pinning", inputs: { height: "height", width: "width", targetGrid: "targetGrid", title: "title", titleStyle: "titleStyle", titleColor: "titleColor", filterPlaceholderText: "filterPlaceholderText", baseTheme: "baseTheme", density: "density", backgroundColor: "backgroundColor" }, host: { classAttribute: "ig-column-pinning igx-column-pinning" }, providers: [], viewQueries: [{ propertyName: "_checkboxList", first: true, predicate: ["checkboxList"], descendants: true, read: IgxCheckboxListComponent, static: true }, { propertyName: "_pinningContainer", first: true, predicate: ["pinningContainer"], descendants: true, read: ElementRef, static: true }], ngImport: i0, template: "<div #pinningContainer>\n                <span></span>\n                <igx-checkbox-list #checkboxList ></igx-checkbox-list>\n                </div>", isInline: true, styles: ["\n\t\t:host {\n\t\t\tdisplay: block;\n\t\t}\n\t"], components: [{ type: i1.IgxCheckboxListComponent, selector: "igx-checkbox-list", inputs: ["height", "width", "dataSource", "keys", "primaryKey", "dataMemberPath", "dataLegendTarget", "subtitleMemberPath", "propertyTypeMemberPath", "selectedMemberPath", "filterPlaceholderText", "searchInputType", "rowHeight", "cellTextStyle", "indexType", "baseTheme", "density", "searchIconColor", "searchBackgroundColor", "labelClickTriggersChange", "searchTextColor", "searchBorderColor", "searchFocusBorderColor", "searchTextStyle", "checkboxTickColor", "checkboxCheckedBackgroundColor", "checkboxUncheckedBackgroundColor", "checkboxCheckedBorderColor", "checkboxUncheckedBorderColor", "checkboxCornerRadius", "scrollbarStyle", "scrollbarBackground", "scrollbarHoverBackground", "scrollbarActiveBackground", "selectAllCaption", "selectAllCaptionTextColor", "actualSelectAllCaptionTextColor", "showSelectAll", "backgroundColor", "rowHoverBackgroundColor", "textColor", "showFilter", "isRowHoverEnabled", "checkboxAlignedRight"], outputs: ["selectedKeyAdded", "selectedKeyRemoved", "checkedChanged", "labelClicked", "indexTypeChanged", "keysCleared", "selectAllCheckboxChanged"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
     return IgxColumnPinningComponent;
 }());
 export { IgxColumnPinningComponent };

package/esm5/lib/igx-column-resizing-separator-component.js

@@ -37,20 +37,20 @@ var IgxColumnResizingSeparatorComponent = /** @class */ /*@__PURE__*/ (function
     };
     Object.defineProperty(IgxColumnResizingSeparatorComponent.prototype, "actualOpacity", {
         get: function () {
-            return this.i.g4;
+            return this.i.g5;
         },
         set: function (v) {
-            this.i.g4 = +v;
+            this.i.g5 = +v;
         },
         enumerable: false,
         configurable: true
     });
     Object.defineProperty(IgxColumnResizingSeparatorComponent.prototype, "opacity", {
         get: function () {
-            return this.i.g5;
+            return this.i.g6;
         },
         set: function (v) {
-            this.i.g5 = +v;
+            this.i.g6 = +v;
         },
         enumerable: false,
         configurable: true

package/esm5/lib/igx-combo-box-column-component.js

@@ -44,10 +44,10 @@ var IgxComboBoxColumnComponent = /** @class */ /*@__PURE__*/ (function (_super)
          * Gets the actual data source that is being used by the combo. If a collection was provided for the combobox data, an implicit LocalDataSource is created, and this is available via this property.
         */
         get: function () {
-            return this.i.sg;
+            return this.i.s2;
         },
         set: function (v) {
-            this.i.sg = v;
+            this.i.s2 = v;
         },
         enumerable: false,
         configurable: true
@@ -57,10 +57,10 @@ var IgxComboBoxColumnComponent = /** @class */ /*@__PURE__*/ (function (_super)
          * Gets or sets the ComboBox data source.
         */
         get: function () {
-            return this.i.sh;
+            return this.i.s3;
         },
         set: function (v) {
-            this.i.sh = v;
+            this.i.s3 = v;
         },
         enumerable: false,
         configurable: true
@@ -70,10 +70,10 @@ var IgxComboBoxColumnComponent = /** @class */ /*@__PURE__*/ (function (_super)
          * Gets or sets the ComboBox text field.
         */
         get: function () {
-            return this.i.sl;
+            return this.i.s7;
         },
         set: function (v) {
-            this.i.sl = v;
+            this.i.s7 = v;
         },
         enumerable: false,
         configurable: true
@@ -83,10 +83,10 @@ var IgxComboBoxColumnComponent = /** @class */ /*@__PURE__*/ (function (_super)
          * Gets or sets the ComboBox value field.
         */
         get: function () {
-            return this.i.sm;
+            return this.i.s8;
         },
         set: function (v) {
-            this.i.sm = v;
+            this.i.s8 = v;
         },
         enumerable: false,
         configurable: true
@@ -96,14 +96,14 @@ var IgxComboBoxColumnComponent = /** @class */ /*@__PURE__*/ (function (_super)
          * Gets or sets the ComboBox value field.
         */
         get: function () {
-            return this.i.se;
+            return this.i.s0;
         },
         set: function (v) {
             if (v && !Array.isArray(v) && typeof (v) == "string") {
                 var re = /\s*(?:,|\s|$)\s*/gm;
                 v = v.split(re);
             }
-            this.i.se = v;
+            this.i.s0 = v;
         },
         enumerable: false,
         configurable: true

package/esm5/lib/igx-data-binding-event-args.js

@@ -71,6 +71,9 @@ var IgxDataBindingEventArgs = /** @class */ /*@__PURE__*/ (function () {
                     case "FilterCellModel":
                         extTypeName = "IgxFilterCellInfo";
                         break;
+                    case "SummaryCellModel":
+                        extTypeName = "IgxSummaryCellInfo";
+                        break;
                 }
                 if (extTypeName) {
                     if (TypeRegistrar.isRegistered(extTypeName)) {