igniteui-angular-data-grids 21.1.0 → 22.0.0-alpha.0

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

@@ -1,955 +0,0 @@
-import { Output, EventEmitter, Component, ViewChild, ElementRef, Input, ChangeDetectionStrategy } from '@angular/core';
-import { AngularRenderer } from "igniteui-angular-core";
-import { fromSize, toSize, ensureEnum, brushToString, stringToBrush, ensureBool, initializePropertiesFromCss, NamePatcher, toSpinal } from "igniteui-angular-core";
-import { FontInfo } from "igniteui-angular-core";
-import { delegateCombine } from "igniteui-angular-core";
-import { CheckboxList } from './CheckboxList';
-import { IgxCheckedChangedEventArgs } from "./igx-checked-changed-event-args";
-import { IgxSelectAllCheckboxChangedEventArgs } from "./igx-select-all-checkbox-changed-event-args";
-import { IgxDataGridComponent } from "./igx-data-grid-component";
-import { SyncableObservableCollection$1 } from "igniteui-angular-core";
-import { PrimaryKeyValue } from "./PrimaryKeyValue";
-import { IgxGridSelectedKeysCollection } from "./igx-grid-selected-keys-collection";
-import { GridSelectedKeysCollection as GridSelectedKeysCollection_internal } from "./GridSelectedKeysCollection";
-import { CheckboxListIndexType_$type } from "./CheckboxListIndexType";
-import { InputGroupDisplayType_$type } from "igniteui-angular-inputs";
-import { BaseControlTheme_$type } from "igniteui-angular-core";
-import { ControlDisplayDensity_$type } from "igniteui-angular-core";
-import { ScrollbarStyle_$type } from "igniteui-angular-core";
-import { IgxCheckboxListIndexTypeChangedEventArgs } from './igx-checkbox-list-index-type-changed-event-args';
-import { IgxCheckboxListKeysClearedEventArgs } from './igx-checkbox-list-keys-cleared-event-args';
-import * as i0 from "@angular/core";
-import * as i1 from "./igx-data-grid-component";
-// IgxDatasGridModule.register();
-export let IgxCheckboxListComponent = /*@__PURE__*/ (() => {
-    class IgxCheckboxListComponent {
-        constructor(renderer, _elRef, ngZone, injector, componentFactoryResolver) {
-            this.renderer = renderer;
-            this._elRef = _elRef;
-            this.ngZone = ngZone;
-            this.injector = injector;
-            this.componentFactoryResolver = componentFactoryResolver;
-            this._dataSource = null;
-            this._wrapper = null;
-            this._root = null;
-            this._implementation = null;
-            this._keys = null;
-            this.__p = null;
-            this._hasUserValues = new Set();
-            this._stylingContainer = null;
-            this._stylingParent = null;
-            this._inStyling = false;
-            this._selectedKeyAdded = null;
-            this._selectedKeyRemoved = null;
-            this._checkedChanged = null;
-            this._labelClicked = null;
-            this._indexTypeChanged = null;
-            this._keysCleared = null;
-            this._selectAllCheckboxChanged = null;
-            this._zoneRunner = null;
-            if (this._styling) {
-                NamePatcher.ensureStylablePatched(Object.getPrototypeOf(this));
-            }
-            this._implementation = this.createImplementation();
-            var checkboxList = this.i;
-            this._checkboxList = checkboxList;
-        }
-        set height(value) {
-            this._height = value;
-            this.renderer.setStyle(this._elRef.element.nativeElement, "height", value);
-            this._checkboxList.notifySizeChanged();
-        }
-        get height() {
-            return this._height;
-        }
-        set width(value) {
-            this._width = value;
-            this.renderer.setStyle(this._elRef.element.nativeElement, "width", value);
-            this._checkboxList.notifySizeChanged();
-        }
-        get width() {
-            return this._width;
-        }
-        set dataSource(value) {
-            this._dataSource = value;
-            if (this._checkboxList != null) {
-                this._checkboxList.itemsSource = this._dataSource;
-            }
-        }
-        get dataSource() {
-            return this._dataSource;
-        }
-        // supports angular themes or custom properties set in CSS
-        updateStyle() {
-            this._styling(this._root, this);
-        }
-        ngOnDestroy() {
-            this._checkboxList.destroy();
-            this._wrapper.destroy();
-        }
-        ngAfterViewInit() {
-            if (this.renderer && this._listGrid != null && this._listContainer != null) {
-                this.container = this._listContainer.nativeElement;
-                this._root = this.container;
-                var ren = new AngularRenderer(this.container, this.renderer, window.document, this.ngZone, true, null);
-                this._wrapper = ren;
-                var filterHr = ren.getWrapper(this._hrElement.nativeElement);
-                filterHr.setStyleProperty("border-top", "1px solid #dde2eb");
-                filterHr.setStyleProperty("border-left", "0px");
-                filterHr.setStyleProperty("border-right", "0px");
-                filterHr.setStyleProperty("border-bottom", "0px");
-                this.i.provideHrElement(filterHr);
-                var selectAllSectionWrapper = ren.getWrapper(this._selectAllSection.nativeElement);
-                this._checkboxList.provideContainer(ren, this._listGrid.i, selectAllSectionWrapper);
-                this._checkboxList.notifySizeChanged();
-                ren.addSizeWatcher(() => {
-                    this._checkboxList.notifySizeChanged();
-                });
-            }
-            this._styling(this._root, this);
-            this.i.notifySizeChanged();
-            this.updateStyle();
-        }
-        createImplementation() {
-            return new CheckboxList();
-        }
-        get i() {
-            return this._implementation;
-        }
-        /**
-         * Gets the collection responsible for selection in the CheckboxList. Selection is determined by two factors:
-         * whether everything is selected or deselected and the values present in this collection. If everything is
-         * selected then any items in this collection will be deselected. If everything is deselected then any items in
-         * this collection will be selected. The CheckboxList defaults all items as deselected. This state can change
-         * when you use the SelectAll and DeselectAll methods.
-        */
-        get keys() {
-            if (this._keys === null) {
-                let coll = new IgxGridSelectedKeysCollection();
-                let innerColl = this.i.keys;
-                if (!innerColl) {
-                    innerColl = new GridSelectedKeysCollection_internal();
-                }
-                this._keys = coll._fromInner(innerColl);
-            }
-            return this._keys;
-        }
-        set keys(v) {
-            if (this._keys !== null) {
-                this._keys._setSyncTarget(null);
-                this._keys = null;
-            }
-            let coll = new IgxGridSelectedKeysCollection();
-            this._keys = coll._fromOuter(v);
-            let syncColl = new SyncableObservableCollection$1(PrimaryKeyValue.$type);
-            let innerColl = this.i.keys;
-            if (!innerColl) {
-                innerColl = new GridSelectedKeysCollection_internal();
-            }
-            syncColl._inner = innerColl;
-            syncColl.clear();
-            this._keys._setSyncTarget(syncColl);
-        }
-        /**
-         * Gets or sets the primary key to use for the CheckboxList.
-        */
-        get primaryKey() {
-            return this.i.primaryKey;
-        }
-        set primaryKey(v) {
-            if (v && !Array.isArray(v) && typeof (v) == "string") {
-                const re = /\s*(?:,|\s|$)\s*/gm;
-                v = v.split(re);
-            }
-            this.i.primaryKey = v;
-        }
-        get isDetached() {
-            return this.i.a0;
-        }
-        /**
-         * Gets or Sets the property name that contains the values.
-        */
-        get dataMemberPath() {
-            return this.i.dataMemberPath;
-        }
-        set dataMemberPath(v) {
-            this.i.dataMemberPath = v;
-        }
-        get dataLegendTarget() {
-            return this.i.dataLegendTarget;
-        }
-        set dataLegendTarget(v) {
-            this.i.dataLegendTarget = v;
-        }
-        /**
-         * Gets or Sets the property name that contains the values.
-        */
-        get subtitleMemberPath() {
-            return this.i.subtitleMemberPath;
-        }
-        set subtitleMemberPath(v) {
-            this.i.subtitleMemberPath = v;
-        }
-        get propertyTypeMemberPath() {
-            return this.i.propertyTypeMemberPath;
-        }
-        set propertyTypeMemberPath(v) {
-            this.i.propertyTypeMemberPath = v;
-        }
-        /**
-         * Gets or Sets the property name that contains the values.
-        */
-        get selectedMemberPath() {
-            return this.i.selectedMemberPath;
-        }
-        set selectedMemberPath(v) {
-            this.i.selectedMemberPath = v;
-        }
-        /**
-         * Gets or Sets the property name that contains the values.
-        */
-        get filterPlaceholderText() {
-            return this.i.cf;
-        }
-        set filterPlaceholderText(v) {
-            this.i.cf = v;
-        }
-        /**
-         * Gets or Sets the property name that contains the values.
-        */
-        get searchInputType() {
-            return this.i.aa;
-        }
-        set searchInputType(v) {
-            this.i.aa = ensureEnum(InputGroupDisplayType_$type, v);
-        }
-        /**
-         * Gets or Sets the property name that contains the values.
-        */
-        get rowHeight() {
-            return this.i.bn;
-        }
-        set rowHeight(v) {
-            this.i.bn = +v;
-        }
-        get actualRowHeight() {
-            return this.i.bl;
-        }
-        /**
-         * Gets or Sets the property name that contains the values.
-        */
-        get cellTextStyle() {
-            if (this.i.ao == null) {
-                return null;
-            }
-            return this.i.ao.fontString;
-        }
-        set cellTextStyle(v) {
-            let fi = new FontInfo();
-            fi.fontString = v;
-            this.i.ao = fi;
-        }
-        /**
-         * Gets or Sets the property name that contains the values.
-        */
-        get indexType() {
-            return this.i.indexType;
-        }
-        set indexType(v) {
-            this.i.indexType = ensureEnum(CheckboxListIndexType_$type, v);
-        }
-        /**
-         * Gets or Sets the property name that contains the values.
-        */
-        get baseTheme() {
-            return this.i.baseTheme;
-        }
-        set baseTheme(v) {
-            this.i.baseTheme = ensureEnum(BaseControlTheme_$type, v);
-        }
-        /**
-         * Gets or Sets the property name that contains the values.
-        */
-        get density() {
-            return this.i.density;
-        }
-        set density(v) {
-            this.i.density = ensureEnum(ControlDisplayDensity_$type, v);
-        }
-        /**
-         * Gets or sets the search icon color.
-        */
-        get searchIconColor() {
-            return brushToString(this.i.searchIconColor);
-        }
-        set searchIconColor(v) {
-            this.i.searchIconColor = stringToBrush(v);
-        }
-        /**
-         * Gets or sets the search background color.
-        */
-        get searchBackgroundColor() {
-            return brushToString(this.i.fs);
-        }
-        set searchBackgroundColor(v) {
-            this.i.fs = stringToBrush(v);
-        }
-        /**
-         * Gets or sets the search background color.
-        */
-        get labelClickTriggersChange() {
-            return this.i.labelClickTriggersChange;
-        }
-        set labelClickTriggersChange(v) {
-            this.i.labelClickTriggersChange = ensureBool(v);
-        }
-        /**
-         * Gets or sets the search text color.
-        */
-        get searchTextColor() {
-            return brushToString(this.i.searchTextColor);
-        }
-        set searchTextColor(v) {
-            this.i.searchTextColor = stringToBrush(v);
-        }
-        /**
-         * Gets or sets the search border color.
-        */
-        get searchBorderColor() {
-            return brushToString(this.i.searchBorderColor);
-        }
-        set searchBorderColor(v) {
-            this.i.searchBorderColor = stringToBrush(v);
-        }
-        /**
-         * Gets or sets the search focus border color.
-        */
-        get searchFocusBorderColor() {
-            return brushToString(this.i.searchFocusBorderColor);
-        }
-        set searchFocusBorderColor(v) {
-            this.i.searchFocusBorderColor = stringToBrush(v);
-        }
-        /**
-         * Gets or sets the text style.
-        */
-        get searchTextStyle() {
-            if (this.i.ap == null) {
-                return null;
-            }
-            return this.i.ap.fontString;
-        }
-        set searchTextStyle(v) {
-            let fi = new FontInfo();
-            fi.fontString = v;
-            this.i.ap = fi;
-        }
-        /**
-         * Gets or sets the checkbox tick color.
-        */
-        get checkboxTickColor() {
-            return brushToString(this.i.fg);
-        }
-        set checkboxTickColor(v) {
-            this.i.fg = stringToBrush(v);
-        }
-        /**
-         * Gets or sets the checkbox background color when checked.
-        */
-        get checkboxCheckedBackgroundColor() {
-            return brushToString(this.i.checkboxCheckedBackgroundColor);
-        }
-        set checkboxCheckedBackgroundColor(v) {
-            this.i.checkboxCheckedBackgroundColor = stringToBrush(v);
-        }
-        /**
-         * Gets or sets the checkbox background color when unchecked.
-        */
-        get checkboxUncheckedBackgroundColor() {
-            return brushToString(this.i.checkboxUncheckedBackgroundColor);
-        }
-        set checkboxUncheckedBackgroundColor(v) {
-            this.i.checkboxUncheckedBackgroundColor = stringToBrush(v);
-        }
-        /**
-         * Gets or sets the checkbox border color when checked.
-        */
-        get checkboxCheckedBorderColor() {
-            return brushToString(this.i.checkboxCheckedBorderColor);
-        }
-        set checkboxCheckedBorderColor(v) {
-            this.i.checkboxCheckedBorderColor = stringToBrush(v);
-        }
-        /**
-         * Gets or sets the checkbox border color when unchecked.
-        */
-        get checkboxUncheckedBorderColor() {
-            return brushToString(this.i.checkboxUncheckedBorderColor);
-        }
-        set checkboxUncheckedBorderColor(v) {
-            this.i.checkboxUncheckedBorderColor = stringToBrush(v);
-        }
-        /**
-         * Gets or sets the corner radius to use for the checkbox.
-        */
-        get checkboxCornerRadius() {
-            return this.i.checkboxCornerRadius;
-        }
-        set checkboxCornerRadius(v) {
-            this.i.checkboxCornerRadius = +v;
-        }
-        /**
-         * Gets or sets the style of scrollbar.
-        */
-        get scrollbarStyle() {
-            return this.i.ad;
-        }
-        set scrollbarStyle(v) {
-            this.i.ad = ensureEnum(ScrollbarStyle_$type, v);
-        }
-        /**
-         * Gets or sets the scrollbar background color.
-        */
-        get scrollbarBackground() {
-            return brushToString(this.i.scrollbarBackground);
-        }
-        set scrollbarBackground(v) {
-            this.i.scrollbarBackground = stringToBrush(v);
-        }
-        /**
-         * Gets or sets the scrollbar thumb background color when the pointer is over it.
-        */
-        get scrollbarHoverBackground() {
-            return brushToString(this.i.scrollbarHoverBackground);
-        }
-        set scrollbarHoverBackground(v) {
-            this.i.scrollbarHoverBackground = stringToBrush(v);
-        }
-        /**
-         * Gets or sets the scrollbar thumb background color when the user is dragging it.
-        */
-        get scrollbarActiveBackground() {
-            return brushToString(this.i.scrollbarActiveBackground);
-        }
-        set scrollbarActiveBackground(v) {
-            this.i.scrollbarActiveBackground = stringToBrush(v);
-        }
-        /**
-         * Gets / sets the caption of the "Select All" checkbox.
-        */
-        get selectAllCaption() {
-            return this.i.c3;
-        }
-        set selectAllCaption(v) {
-            this.i.c3 = v;
-        }
-        /**
-         * Gets or sets the color to use for the "Select All" label.
-        */
-        get selectAllCaptionTextColor() {
-            return brushToString(this.i.selectAllCaptionTextColor);
-        }
-        set selectAllCaptionTextColor(v) {
-            this.i.selectAllCaptionTextColor = stringToBrush(v);
-        }
-        /**
-         * Gets or sets the color to use for the actual header selectAllCaption text.
-        */
-        get actualSelectAllCaptionTextColor() {
-            return brushToString(this.i.fc);
-        }
-        set actualSelectAllCaptionTextColor(v) {
-            this.i.fc = stringToBrush(v);
-        }
-        /**
-         * Gets / sets whether the "Select all" checkbox is visible.
-        */
-        get showSelectAll() {
-            return this.i.showSelectAll;
-        }
-        set showSelectAll(v) {
-            this.i.showSelectAll = ensureBool(v);
-        }
-        /**
-         * Gets or sets the color to use for the background of the component.
-        */
-        get backgroundColor() {
-            return brushToString(this.i.backgroundColor);
-        }
-        set backgroundColor(v) {
-            this.i.backgroundColor = stringToBrush(v);
-        }
-        /**
-         * Gets or sets the color to use when hovering over a grid row.
-        */
-        get rowHoverBackgroundColor() {
-            return brushToString(this.i.rowHoverBackgroundColor);
-        }
-        set rowHoverBackgroundColor(v) {
-            this.i.rowHoverBackgroundColor = stringToBrush(v);
-        }
-        /**
-         * Gets or sets the color to use for the text of the component.
-        */
-        get textColor() {
-            return brushToString(this.i.textColor);
-        }
-        set textColor(v) {
-            this.i.textColor = stringToBrush(v);
-        }
-        /**
-         * Gets or sets whether the filter input is visible.
-        */
-        get showFilter() {
-            return this.i.a8;
-        }
-        set showFilter(v) {
-            this.i.a8 = ensureBool(v);
-        }
-        /**
-         * Gets or sets whether row hover highlighting is enabled.
-        */
-        get isRowHoverEnabled() {
-            return this.i.a4;
-        }
-        set isRowHoverEnabled(v) {
-            this.i.a4 = ensureBool(v);
-        }
-        /**
-         * Gets or sets whether checkbox should be displayed to the right.
-        */
-        get checkboxAlignedRight() {
-            return this.i.checkboxAlignedRight;
-        }
-        set checkboxAlignedRight(v) {
-            this.i.checkboxAlignedRight = ensureBool(v);
-        }
-        findByName(name) {
-            if (this.findEphemera) {
-                if (name && name.indexOf("@@e:") == 0) {
-                    return this.findEphemera(name);
-                }
-            }
-            if (this.keys != null && this.keys.findByName && this.keys.findByName(name)) {
-                return this.keys.findByName(name);
-            }
-            return null;
-        }
-        get hasUserValues() {
-            return this._hasUserValues;
-        }
-        __m(propertyName) {
-            if (!this._inStyling) {
-                this._hasUserValues.add(propertyName);
-            }
-        }
-        _styling(container, component, parent) {
-            if (this._inStyling) {
-                return;
-            }
-            this._inStyling = true;
-            this._stylingContainer = container;
-            this._stylingParent = component;
-            let genericPrefix = "";
-            let typeName = this.i.$type.name;
-            if (typeName.indexOf("Xam") === 0) {
-                typeName = typeName.substring(3);
-            }
-            genericPrefix = toSpinal("CheckboxListComponent");
-            let additionalPrefixes = [];
-            let prefix = toSpinal(typeName);
-            additionalPrefixes.push(prefix + "-");
-            let b = this.i.$type.baseType;
-            while (b && b.name != "Object" &&
-                b.name != "Base" &&
-                b.name != "Control" &&
-                b.Name != "DependencyObject" &&
-                b.Name != "FrameworkElement") {
-                typeName = b.name;
-                if (typeName.indexOf("Xam") === 0) {
-                    typeName = typeName.substring(3);
-                }
-                let basePrefix = toSpinal(typeName);
-                additionalPrefixes.push(basePrefix + "-");
-                b = b.baseType;
-            }
-            if (parent) {
-                let parentTypeName = parent.i.$type.name;
-                if (parentTypeName.indexOf("Xam") === 0) {
-                    parentTypeName = parentTypeName.substring(3);
-                }
-                let parentPrefix = toSpinal(parentTypeName);
-                additionalPrefixes.push(parentPrefix + "-" + genericPrefix + "-");
-                additionalPrefixes.push(parentPrefix + "-" + prefix + "-");
-            }
-            initializePropertiesFromCss(container, this, genericPrefix + "-", this.hasUserValues, false, additionalPrefixes);
-            if (this._otherStyling) {
-                this._otherStyling(container, component, parent);
-            }
-            this._inStyling = false;
-        }
-        /**
-     * selects all the items in the checkbox list.
-    
-    */
-        selectAll() {
-            this.i.en();
-        }
-        /**
-         * Deselects all the items in the checkbox list.
-        
-        */
-        deselectAll() {
-            this.i.dj();
-        }
-        notifySetItem(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.
-         * This should not be called if the data that the grid is bound to is already observable.
-        
-        */
-        notifyClearItems() {
-            this.i.du();
-        }
-        notifyInsertItem(index, newItem) {
-            this.i.dv(index, newItem);
-        }
-        notifyRemoveItem(index, oldItem) {
-            this.i.dx(index, oldItem);
-        }
-        refresh() {
-            this.i.refresh();
-        }
-        addKeyValue(value) {
-            this.i.de(value);
-        }
-        removeKeyValue(value) {
-            this.i.el(value);
-        }
-        getDesiredSize(availableSize) {
-            let iv = this.i.getDesiredSize(toSize(availableSize));
-            return fromSize(iv);
-        }
-        /**
-         * Exports visual information about the current state of the grid.
-        
-        */
-        exportVisualModel() {
-            let iv = this.i.br();
-            return (iv);
-        }
-        /**
-         * Returns a serialized copy of the exported visual model
-        
-        */
-        exportSerializedVisualModel() {
-            let iv = this.i.ce();
-            return (iv);
-        }
-        /**
-         * Returns true if no items are selected / checked; otherwise false.
-        
-        */
-        isNothingSelected() {
-            let iv = this.i.a2();
-            return (iv);
-        }
-        /**
-         * Returns true if all of the items are selected / checked; otherwise false.
-        
-        */
-        isEverythingSelected() {
-            let iv = this.i.a1();
-            return (iv);
-        }
-        /**
-         * Called when an item is added.
-        */
-        get selectedKeyAdded() {
-            if (this._selectedKeyAdded == null) {
-                this._selectedKeyAdded = new EventEmitter();
-                this.i.selectedKeyAdded = delegateCombine(this.i.selectedKeyAdded, (o, e) => {
-                    let outerArgs = new IgxCheckedChangedEventArgs();
-                    outerArgs._provideImplementation(e);
-                    if (this.beforeSelectedKeyAdded) {
-                        this.beforeSelectedKeyAdded(this, outerArgs);
-                    }
-                    this._selectedKeyAdded.emit({
-                        sender: this,
-                        args: outerArgs
-                    });
-                });
-            }
-            return this._selectedKeyAdded;
-        }
-        /**
-         * Called when an item is removed.
-        */
-        get selectedKeyRemoved() {
-            if (this._selectedKeyRemoved == null) {
-                this._selectedKeyRemoved = new EventEmitter();
-                this.i.selectedKeyRemoved = delegateCombine(this.i.selectedKeyRemoved, (o, e) => {
-                    let outerArgs = new IgxCheckedChangedEventArgs();
-                    outerArgs._provideImplementation(e);
-                    if (this.beforeSelectedKeyRemoved) {
-                        this.beforeSelectedKeyRemoved(this, outerArgs);
-                    }
-                    this._selectedKeyRemoved.emit({
-                        sender: this,
-                        args: outerArgs
-                    });
-                });
-            }
-            return this._selectedKeyRemoved;
-        }
-        /**
-         * Called when a checkbox is checked or unchecked.
-        */
-        get checkedChanged() {
-            if (this._checkedChanged == null) {
-                this._checkedChanged = new EventEmitter();
-                this.i.checkedChanged = delegateCombine(this.i.checkedChanged, (o, e) => {
-                    let outerArgs = new IgxCheckedChangedEventArgs();
-                    outerArgs._provideImplementation(e);
-                    if (this.beforeCheckedChanged) {
-                        this.beforeCheckedChanged(this, outerArgs);
-                    }
-                    this._checkedChanged.emit({
-                        sender: this,
-                        args: outerArgs
-                    });
-                });
-            }
-            return this._checkedChanged;
-        }
-        get labelClicked() {
-            if (this._labelClicked == null) {
-                this._labelClicked = new EventEmitter();
-                this.i.labelClicked = delegateCombine(this.i.labelClicked, (o, e) => {
-                    let outerArgs = new IgxCheckedChangedEventArgs();
-                    outerArgs._provideImplementation(e);
-                    if (this.beforeLabelClicked) {
-                        this.beforeLabelClicked(this, outerArgs);
-                    }
-                    this._labelClicked.emit({
-                        sender: this,
-                        args: outerArgs
-                    });
-                });
-            }
-            return this._labelClicked;
-        }
-        get indexTypeChanged() {
-            if (this._indexTypeChanged == null) {
-                this._indexTypeChanged = new EventEmitter();
-                this.i.indexTypeChanged = delegateCombine(this.i.indexTypeChanged, (o, e) => {
-                    this._runInZone(() => {
-                        let outerArgs = new IgxCheckboxListIndexTypeChangedEventArgs();
-                        outerArgs._provideImplementation(e);
-                        if (this.beforeIndexTypeChanged) {
-                            this.beforeIndexTypeChanged(this, outerArgs);
-                        }
-                        this._indexTypeChanged.emit({
-                            sender: this,
-                            args: outerArgs
-                        });
-                    });
-                });
-            }
-            return this._indexTypeChanged;
-        }
-        get keysCleared() {
-            if (this._keysCleared == null) {
-                this._keysCleared = new EventEmitter();
-                this.i.keysCleared = delegateCombine(this.i.keysCleared, (o, e) => {
-                    this._runInZone(() => {
-                        let outerArgs = new IgxCheckboxListKeysClearedEventArgs();
-                        outerArgs._provideImplementation(e);
-                        if (this.beforeKeysCleared) {
-                            this.beforeKeysCleared(this, outerArgs);
-                        }
-                        this._keysCleared.emit({
-                            sender: this,
-                            args: outerArgs
-                        });
-                    });
-                });
-            }
-            return this._keysCleared;
-        }
-        /**
-         * Called when the SelectAll checkbox is checked or unchecked.
-        */
-        get selectAllCheckboxChanged() {
-            if (this._selectAllCheckboxChanged == null) {
-                this._selectAllCheckboxChanged = new EventEmitter();
-                this.i.selectAllCheckboxChanged = delegateCombine(this.i.selectAllCheckboxChanged, (o, e) => {
-                    let outerArgs = new IgxSelectAllCheckboxChangedEventArgs();
-                    outerArgs._provideImplementation(e);
-                    if (this.beforeSelectAllCheckboxChanged) {
-                        this.beforeSelectAllCheckboxChanged(this, outerArgs);
-                    }
-                    this._selectAllCheckboxChanged.emit({
-                        sender: this,
-                        args: outerArgs
-                    });
-                });
-            }
-            return this._selectAllCheckboxChanged;
-        }
-        _runInZone(act) {
-            if (this._zoneRunner != null) {
-                this._zoneRunner(act);
-            }
-            else {
-                act();
-            }
-        }
-    }
-    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", 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%">
-                <div>             
-                </div>
-                <hr #hrElement>
-                <div #selectAllSection key='checkBoxListSelectAllSection'></div>
-                <igx-data-grid #listGrid headerHeight="0"></igx-data-grid>
-                </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;
-})();
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: IgxCheckboxListComponent, decorators: [{
-            type: Component,
-            args: [{
-                    selector: 'igx-checkbox-list',
-                    template: `<div #listContainer style="width: 100%; height: 100%">
-                <div>             
-                </div>
-                <hr #hrElement>
-                <div #selectAllSection key='checkBoxListSelectAllSection'></div>
-                <igx-data-grid #listGrid headerHeight="0"></igx-data-grid>
-                </div>`,
-                    changeDetection: ChangeDetectionStrategy.OnPush,
-                    providers: [],
-                    host: { 'class': 'ig-checkbox-list igx-checkbox-list' },
-                    styles: [`
-		:host {
-			display: block;
-		}
-	`]
-                }]
-        }], ctorParameters: function () { return [{ type: i0.Renderer2 }, { type: i0.ViewContainerRef }, { type: i0.NgZone }, { type: i0.Injector }, { type: i0.ComponentFactoryResolver }]; }, propDecorators: { _listGrid: [{
-                type: ViewChild,
-                args: ["listGrid", { read: IgxDataGridComponent, static: true }]
-            }], _listContainer: [{
-                type: ViewChild,
-                args: ["listContainer", { read: ElementRef, static: true }]
-            }], _hrElement: [{
-                type: ViewChild,
-                args: ["hrElement", { read: ElementRef, static: true }]
-            }], _selectAllSection: [{
-                type: ViewChild,
-                args: ['selectAllSection', { read: ElementRef, static: true }]
-            }], height: [{
-                type: Input
-            }], width: [{
-                type: Input
-            }], dataSource: [{
-                type: Input
-            }], keys: [{
-                type: Input
-            }], primaryKey: [{
-                type: Input
-            }], dataMemberPath: [{
-                type: Input
-            }], dataLegendTarget: [{
-                type: Input
-            }], subtitleMemberPath: [{
-                type: Input
-            }], propertyTypeMemberPath: [{
-                type: Input
-            }], selectedMemberPath: [{
-                type: Input
-            }], filterPlaceholderText: [{
-                type: Input
-            }], searchInputType: [{
-                type: Input
-            }], rowHeight: [{
-                type: Input
-            }], cellTextStyle: [{
-                type: Input
-            }], indexType: [{
-                type: Input
-            }], baseTheme: [{
-                type: Input
-            }], density: [{
-                type: Input
-            }], searchIconColor: [{
-                type: Input
-            }], searchBackgroundColor: [{
-                type: Input
-            }], labelClickTriggersChange: [{
-                type: Input
-            }], searchTextColor: [{
-                type: Input
-            }], searchBorderColor: [{
-                type: Input
-            }], searchFocusBorderColor: [{
-                type: Input
-            }], searchTextStyle: [{
-                type: Input
-            }], checkboxTickColor: [{
-                type: Input
-            }], checkboxCheckedBackgroundColor: [{
-                type: Input
-            }], checkboxUncheckedBackgroundColor: [{
-                type: Input
-            }], checkboxCheckedBorderColor: [{
-                type: Input
-            }], checkboxUncheckedBorderColor: [{
-                type: Input
-            }], checkboxCornerRadius: [{
-                type: Input
-            }], scrollbarStyle: [{
-                type: Input
-            }], scrollbarBackground: [{
-                type: Input
-            }], scrollbarHoverBackground: [{
-                type: Input
-            }], scrollbarActiveBackground: [{
-                type: Input
-            }], selectAllCaption: [{
-                type: Input
-            }], selectAllCaptionTextColor: [{
-                type: Input
-            }], actualSelectAllCaptionTextColor: [{
-                type: Input
-            }], showSelectAll: [{
-                type: Input
-            }], backgroundColor: [{
-                type: Input
-            }], rowHoverBackgroundColor: [{
-                type: Input
-            }], textColor: [{
-                type: Input
-            }], showFilter: [{
-                type: Input
-            }], isRowHoverEnabled: [{
-                type: Input
-            }], checkboxAlignedRight: [{
-                type: Input
-            }], selectedKeyAdded: [{
-                type: Output
-            }], selectedKeyRemoved: [{
-                type: Output
-            }], checkedChanged: [{
-                type: Output
-            }], labelClicked: [{
-                type: Output
-            }], indexTypeChanged: [{
-                type: Output
-            }], keysCleared: [{
-                type: Output
-            }], selectAllCheckboxChanged: [{
-                type: Output
-            }] } });