@skyux/ag-grid 7.4.2 → 7.6.0

package/fesm2015/skyux-ag-grid.mjs

@@ -121,7 +121,7 @@ function applySkyLookupPropertiesDefaults(skyLookupProperties) {
     };
 }
 
-/** The intiial action that a cell editor should take when initialized. */
+/** The initial action that a cell editor should take when initialized. */
 var SkyAgGridCellEditorInitialAction;
 (function (SkyAgGridCellEditorInitialAction) {
     /** The cell should be cleared. */
@@ -136,7 +136,7 @@ var SkyAgGridCellEditorInitialAction;
 
 class SkyAgGridCellEditorUtils {
     /**
-     * Gets the intiial action that a cell editor should take when initialized.
+     * Gets the initial action that a cell editor should take when initialized.
      * @param params The editor's initializing parameters.
      */
     static getEditorInitialAction(params) {
@@ -400,8 +400,8 @@ class SkyAgGridCellEditorDatepickerComponent extends PopupComponent {
         const datepickerInputEl = (_a = this.datepickerInput) === null || _a === void 0 ? void 0 : _a.nativeElement;
         if (datepickerInputEl) {
             datepickerInputEl.focus();
-            // Programatically set the value of in the input; however, do not do this via the form control so that the value is not formatted when editing starts.
-            // Watch for the first blur and fire a 'change' event as programatic changes won't queue a change event, but we need to do this so that formatting happens if the user tabs to the calendar button.
+            // programmatically set the value of in the input; however, do not do this via the form control so that the value is not formatted when editing starts.
+            // Watch for the first blur and fire a 'change' event as programmatic changes won't queue a change event, but we need to do this so that formatting happens if the user tabs to the calendar button.
             if (__classPrivateFieldGet(this, _SkyAgGridCellEditorDatepickerComponent_triggerType, "f") === SkyAgGridCellEditorInitialAction.Replace) {
                 fromEvent(datepickerInputEl, 'blur')
                     .pipe(first())
@@ -932,7 +932,7 @@ class SkyAgGridCellRendererRowSelectorComponent {
     /**
      * Used by agGrid to update cell value after a user triggers a refresh. It updates the cell DOM and returns true when the refresh is
      * successful, or false if the cell should be destroyed and rerendered. If consumers have external logic that changes the value of a
-     * checkbox cell, rerendering it will gurantee the change applies without knowing the consumer's implementation.
+     * checkbox cell, rerendering it will guarantee the change applies without knowing the consumer's implementation.
      */
     refresh() {
         return false;
@@ -1012,7 +1012,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.11", ngImpo
             type: Injectable
         }] });
 
-var _SkyAgGridHeaderGroupComponent_instances, _SkyAgGridHeaderGroupComponent_columnGroup, _SkyAgGridHeaderGroupComponent_isExpandedSubject, _SkyAgGridHeaderGroupComponent_subscriptions, _SkyAgGridHeaderGroupComponent_changeDetector, _SkyAgGridHeaderGroupComponent_dynamicComponentService, _SkyAgGridHeaderGroupComponent_viewInitialized, _SkyAgGridHeaderGroupComponent_agIntialized, _SkyAgGridHeaderGroupComponent_updateInlineHelp;
+var _SkyAgGridHeaderGroupComponent_instances, _SkyAgGridHeaderGroupComponent_columnGroup, _SkyAgGridHeaderGroupComponent_isExpandedSubject, _SkyAgGridHeaderGroupComponent_subscriptions, _SkyAgGridHeaderGroupComponent_changeDetector, _SkyAgGridHeaderGroupComponent_dynamicComponentService, _SkyAgGridHeaderGroupComponent_viewInitialized, _SkyAgGridHeaderGroupComponent_agInitialized, _SkyAgGridHeaderGroupComponent_updateInlineHelp;
 /**
  * @internal
  */
@@ -1026,7 +1026,7 @@ class SkyAgGridHeaderGroupComponent {
         _SkyAgGridHeaderGroupComponent_changeDetector.set(this, void 0);
         _SkyAgGridHeaderGroupComponent_dynamicComponentService.set(this, void 0);
         _SkyAgGridHeaderGroupComponent_viewInitialized.set(this, false);
-        _SkyAgGridHeaderGroupComponent_agIntialized.set(this, false);
+        _SkyAgGridHeaderGroupComponent_agInitialized.set(this, false);
         __classPrivateFieldSet(this, _SkyAgGridHeaderGroupComponent_changeDetector, changeDetector, "f");
         __classPrivateFieldSet(this, _SkyAgGridHeaderGroupComponent_dynamicComponentService, dynamicComponentService, "f");
         this.isExpanded$ = __classPrivateFieldGet(this, _SkyAgGridHeaderGroupComponent_isExpandedSubject, "f").asObservable();
@@ -1040,7 +1040,7 @@ class SkyAgGridHeaderGroupComponent {
         __classPrivateFieldGet(this, _SkyAgGridHeaderGroupComponent_subscriptions, "f").unsubscribe();
     }
     agInit(params) {
-        __classPrivateFieldSet(this, _SkyAgGridHeaderGroupComponent_agIntialized, true, "f");
+        __classPrivateFieldSet(this, _SkyAgGridHeaderGroupComponent_agInitialized, true, "f");
         this.params = params;
         __classPrivateFieldGet(this, _SkyAgGridHeaderGroupComponent_subscriptions, "f").unsubscribe();
         if (!params) {
@@ -1063,9 +1063,9 @@ class SkyAgGridHeaderGroupComponent {
         (_a = this.params) === null || _a === void 0 ? void 0 : _a.setExpanded($event);
     }
 }
-_SkyAgGridHeaderGroupComponent_columnGroup = new WeakMap(), _SkyAgGridHeaderGroupComponent_isExpandedSubject = new WeakMap(), _SkyAgGridHeaderGroupComponent_subscriptions = new WeakMap(), _SkyAgGridHeaderGroupComponent_changeDetector = new WeakMap(), _SkyAgGridHeaderGroupComponent_dynamicComponentService = new WeakMap(), _SkyAgGridHeaderGroupComponent_viewInitialized = new WeakMap(), _SkyAgGridHeaderGroupComponent_agIntialized = new WeakMap(), _SkyAgGridHeaderGroupComponent_instances = new WeakSet(), _SkyAgGridHeaderGroupComponent_updateInlineHelp = function _SkyAgGridHeaderGroupComponent_updateInlineHelp() {
+_SkyAgGridHeaderGroupComponent_columnGroup = new WeakMap(), _SkyAgGridHeaderGroupComponent_isExpandedSubject = new WeakMap(), _SkyAgGridHeaderGroupComponent_subscriptions = new WeakMap(), _SkyAgGridHeaderGroupComponent_changeDetector = new WeakMap(), _SkyAgGridHeaderGroupComponent_dynamicComponentService = new WeakMap(), _SkyAgGridHeaderGroupComponent_viewInitialized = new WeakMap(), _SkyAgGridHeaderGroupComponent_agInitialized = new WeakMap(), _SkyAgGridHeaderGroupComponent_instances = new WeakSet(), _SkyAgGridHeaderGroupComponent_updateInlineHelp = function _SkyAgGridHeaderGroupComponent_updateInlineHelp() {
     var _a, _b, _c, _d, _e, _f, _g;
-    if (!__classPrivateFieldGet(this, _SkyAgGridHeaderGroupComponent_viewInitialized, "f") || !__classPrivateFieldGet(this, _SkyAgGridHeaderGroupComponent_agIntialized, "f")) {
+    if (!__classPrivateFieldGet(this, _SkyAgGridHeaderGroupComponent_viewInitialized, "f") || !__classPrivateFieldGet(this, _SkyAgGridHeaderGroupComponent_agInitialized, "f")) {
         return;
     }
     const colGroupDef = (_b = (_a = this.params) === null || _a === void 0 ? void 0 : _a.columnGroup) === null || _b === void 0 ? void 0 : _b.getColGroupDef();
@@ -1111,7 +1111,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.11", ngImpo
             type: Injectable
         }] });
 
-var _SkyAgGridHeaderComponent_instances, _SkyAgGridHeaderComponent_subscriptions, _SkyAgGridHeaderComponent_changeDetector, _SkyAgGridHeaderComponent_dynamicComponentService, _SkyAgGridHeaderComponent_inlineHelpComponentRef, _SkyAgGridHeaderComponent_viewInitialized, _SkyAgGridHeaderComponent_agIntialized, _SkyAgGridHeaderComponent_updateInlineHelp, _SkyAgGridHeaderComponent_updateSort, _SkyAgGridHeaderComponent_updateSortIndex;
+var _SkyAgGridHeaderComponent_instances, _SkyAgGridHeaderComponent_subscriptions, _SkyAgGridHeaderComponent_changeDetector, _SkyAgGridHeaderComponent_dynamicComponentService, _SkyAgGridHeaderComponent_inlineHelpComponentRef, _SkyAgGridHeaderComponent_viewInitialized, _SkyAgGridHeaderComponent_agInitialized, _SkyAgGridHeaderComponent_updateInlineHelp, _SkyAgGridHeaderComponent_updateSort, _SkyAgGridHeaderComponent_updateSortIndex;
 /**
  * @internal
  */
@@ -1128,7 +1128,7 @@ class SkyAgGridHeaderComponent {
         _SkyAgGridHeaderComponent_dynamicComponentService.set(this, void 0);
         _SkyAgGridHeaderComponent_inlineHelpComponentRef.set(this, void 0);
         _SkyAgGridHeaderComponent_viewInitialized.set(this, false);
-        _SkyAgGridHeaderComponent_agIntialized.set(this, false);
+        _SkyAgGridHeaderComponent_agInitialized.set(this, false);
         __classPrivateFieldSet(this, _SkyAgGridHeaderComponent_changeDetector, changeDetector, "f");
         __classPrivateFieldSet(this, _SkyAgGridHeaderComponent_dynamicComponentService, dynamicComponentService, "f");
     }
@@ -1140,7 +1140,7 @@ class SkyAgGridHeaderComponent {
         __classPrivateFieldGet(this, _SkyAgGridHeaderComponent_subscriptions, "f").unsubscribe();
     }
     agInit(params) {
-        __classPrivateFieldSet(this, _SkyAgGridHeaderComponent_agIntialized, true, "f");
+        __classPrivateFieldSet(this, _SkyAgGridHeaderComponent_agInitialized, true, "f");
         this.params = params;
         __classPrivateFieldGet(this, _SkyAgGridHeaderComponent_subscriptions, "f").unsubscribe();
         if (!params) {
@@ -1175,17 +1175,19 @@ class SkyAgGridHeaderComponent {
         (_a = this.params) === null || _a === void 0 ? void 0 : _a.showColumnMenu($event.target);
     }
     onSortRequested(event) {
-        var _a;
-        (_a = this.params) === null || _a === void 0 ? void 0 : _a.progressSort(!!event.shiftKey);
+        var _a, _b;
+        if ((_a = this.params) === null || _a === void 0 ? void 0 : _a.enableSorting) {
+            (_b = this.params) === null || _b === void 0 ? void 0 : _b.progressSort(event.shiftKey);
+        }
     }
     refresh(params) {
         this.agInit(params);
         return false;
     }
 }
-_SkyAgGridHeaderComponent_subscriptions = new WeakMap(), _SkyAgGridHeaderComponent_changeDetector = new WeakMap(), _SkyAgGridHeaderComponent_dynamicComponentService = new WeakMap(), _SkyAgGridHeaderComponent_inlineHelpComponentRef = new WeakMap(), _SkyAgGridHeaderComponent_viewInitialized = new WeakMap(), _SkyAgGridHeaderComponent_agIntialized = new WeakMap(), _SkyAgGridHeaderComponent_instances = new WeakSet(), _SkyAgGridHeaderComponent_updateInlineHelp = function _SkyAgGridHeaderComponent_updateInlineHelp() {
+_SkyAgGridHeaderComponent_subscriptions = new WeakMap(), _SkyAgGridHeaderComponent_changeDetector = new WeakMap(), _SkyAgGridHeaderComponent_dynamicComponentService = new WeakMap(), _SkyAgGridHeaderComponent_inlineHelpComponentRef = new WeakMap(), _SkyAgGridHeaderComponent_viewInitialized = new WeakMap(), _SkyAgGridHeaderComponent_agInitialized = new WeakMap(), _SkyAgGridHeaderComponent_instances = new WeakSet(), _SkyAgGridHeaderComponent_updateInlineHelp = function _SkyAgGridHeaderComponent_updateInlineHelp() {
     var _a, _b, _c, _d, _e;
-    if (!__classPrivateFieldGet(this, _SkyAgGridHeaderComponent_viewInitialized, "f") || !__classPrivateFieldGet(this, _SkyAgGridHeaderComponent_agIntialized, "f")) {
+    if (!__classPrivateFieldGet(this, _SkyAgGridHeaderComponent_viewInitialized, "f") || !__classPrivateFieldGet(this, _SkyAgGridHeaderComponent_agInitialized, "f")) {
         return;
     }
     const inlineHelpComponent = (_a = this.params) === null || _a === void 0 ? void 0 : _a.inlineHelpComponent;
@@ -1230,10 +1232,10 @@ _SkyAgGridHeaderComponent_subscriptions = new WeakMap(), _SkyAgGridHeaderCompone
     }
 };
 SkyAgGridHeaderComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.11", ngImport: i0, type: SkyAgGridHeaderComponent, deps: [{ token: i0.ChangeDetectorRef }, { token: i1.SkyDynamicComponentService }], target: i0.ɵɵFactoryTarget.Component });
-SkyAgGridHeaderComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.11", type: SkyAgGridHeaderComponent, selector: "sky-ag-grid-header", viewQueries: [{ propertyName: "inlineHelpContainer", first: true, predicate: ["inlineHelpContainer"], descendants: true, read: ElementRef, static: true }], ngImport: i0, template: "<div class=\"ag-cell-label-container\" role=\"presentation\">\n  <span\n    *ngIf=\"params?.enableMenu\"\n    class=\"ag-header-icon ag-header-cell-menu-button\"\n    aria-hidden=\"true\"\n    (click)=\"onMenuClick($event)\"\n  >\n    <sky-icon *skyThemeIf=\"'default'\" icon=\"menu\"></sky-icon>\n    <sky-icon *skyThemeIf=\"'modern'\" icon=\"menu\" iconType=\"skyux\"></sky-icon>\n  </span>\n  <div\n    class=\"ag-header-cell-label\"\n    role=\"presentation\"\n    (click)=\"onSortRequested($event)\"\n  >\n    <span class=\"ag-header-cell-text\">{{ params?.displayName }}</span>\n    <span\n      *ngIf=\"filterEnabled$ | async\"\n      class=\"ag-header-icon ag-header-label-icon ag-filter-icon\"\n      aria-hidden=\"true\"\n    >\n      <sky-icon *skyThemeIf=\"'default'\" icon=\"filter\"></sky-icon>\n      <sky-icon\n        *skyThemeIf=\"'modern'\"\n        icon=\"filter\"\n        iconType=\"skyux\"\n      ></sky-icon>\n    </span>\n    <span *ngIf=\"params?.enableSorting\" class=\"ag-sort-indicator-container\">\n      <sky-icon\n        *ngIf=\"(sortOrder$ | async) === 'desc'\"\n        icon=\"caret-down\"\n        class=\"ag-header-label-icon\"\n      ></sky-icon>\n      <sky-icon\n        *ngIf=\"(sortOrder$ | async) === 'asc'\"\n        icon=\"caret-up\"\n        class=\"ag-header-label-icon\"\n      ></sky-icon>\n      <span\n        *ngIf=\"sortIndexDisplay$ | async as sortIndexDisplay\"\n        class=\"ag-sort-indicator-icon ag-sort-order\"\n        aria-hidden=\"true\"\n        >{{ sortIndexDisplay }}</span\n      >\n    </span>\n  </div>\n</div>\n<span class=\"sky-control-help-container\" #inlineHelpContainer></span>\n", styles: [":host{display:flex;max-width:100%;align-items:center;align-content:center}.ag-header-cell-label{padding-right:0;padding-left:0}button{cursor:pointer;flex-grow:0;flex-shrink:0}\n"], dependencies: [{ kind: "directive", type: i2$3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i3$2.λ4, selector: "sky-icon", inputs: ["icon", "iconType", "size", "fixedWidth", "variant"] }, { kind: "directive", type: i1$2.λ3, selector: "[skyThemeIf]", inputs: ["skyThemeIf"] }, { kind: "pipe", type: i2$3.AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+SkyAgGridHeaderComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.11", type: SkyAgGridHeaderComponent, selector: "sky-ag-grid-header", viewQueries: [{ propertyName: "inlineHelpContainer", first: true, predicate: ["inlineHelpContainer"], descendants: true, read: ElementRef, static: true }], ngImport: i0, template: "<div class=\"ag-cell-label-container\" role=\"presentation\">\n  <span\n    *ngIf=\"params?.enableMenu\"\n    class=\"ag-header-icon ag-header-cell-menu-button\"\n    aria-hidden=\"true\"\n    (click)=\"onMenuClick($event)\"\n  >\n    <sky-icon *skyThemeIf=\"'default'\" icon=\"menu\"></sky-icon>\n    <sky-icon *skyThemeIf=\"'modern'\" icon=\"menu\" iconType=\"skyux\"></sky-icon>\n  </span>\n  <div\n    [class.ag-header-cell-label-sortable]=\"params?.enableSorting\"\n    class=\"ag-header-cell-label\"\n    role=\"presentation\"\n    (click)=\"onSortRequested($event)\"\n  >\n    <span class=\"ag-header-cell-text\">\n      <ng-template #notSortingHeaderText>{{ params?.displayName }}</ng-template>\n      <button\n        *ngIf=\"params?.enableSorting; else notSortingHeaderText\"\n        class=\"sky-btn-link-inline\"\n        (click)=\"onSortRequested($event)\"\n      >\n        <ng-container *ngTemplateOutlet=\"notSortingHeaderText\"></ng-container>\n      </button>\n    </span>\n    <span\n      *ngIf=\"filterEnabled$ | async\"\n      class=\"ag-header-icon ag-header-label-icon ag-filter-icon\"\n      aria-hidden=\"true\"\n    >\n      <sky-icon *skyThemeIf=\"'default'\" icon=\"filter\"></sky-icon>\n      <sky-icon\n        *skyThemeIf=\"'modern'\"\n        icon=\"filter\"\n        iconType=\"skyux\"\n      ></sky-icon>\n    </span>\n    <span *ngIf=\"params?.enableSorting\" class=\"ag-sort-indicator-container\">\n      <sky-icon\n        *ngIf=\"(sortOrder$ | async) === 'desc'\"\n        icon=\"caret-down\"\n        class=\"ag-header-label-icon\"\n      ></sky-icon>\n      <sky-icon\n        *ngIf=\"(sortOrder$ | async) === 'asc'\"\n        icon=\"caret-up\"\n        class=\"ag-header-label-icon\"\n      ></sky-icon>\n      <span\n        *ngIf=\"sortIndexDisplay$ | async as sortIndexDisplay\"\n        class=\"ag-sort-indicator-icon ag-sort-order\"\n        aria-hidden=\"true\"\n        >{{ sortIndexDisplay }}</span\n      >\n    </span>\n  </div>\n</div>\n<span class=\"sky-control-help-container\" #inlineHelpContainer></span>\n", styles: [":host{display:flex;max-width:100%;align-items:center;align-content:center}.ag-header-cell-label{padding-right:0;padding-left:0}.ag-header-cell-label button{text-transform:inherit}button{cursor:pointer;flex-grow:0;flex-shrink:0}\n"], dependencies: [{ kind: "directive", type: i2$3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2$3.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: i3$2.λ4, selector: "sky-icon", inputs: ["icon", "iconType", "size", "fixedWidth", "variant"] }, { kind: "directive", type: i1$2.λ3, selector: "[skyThemeIf]", inputs: ["skyThemeIf"] }, { kind: "pipe", type: i2$3.AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.11", ngImport: i0, type: SkyAgGridHeaderComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'sky-ag-grid-header', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"ag-cell-label-container\" role=\"presentation\">\n  <span\n    *ngIf=\"params?.enableMenu\"\n    class=\"ag-header-icon ag-header-cell-menu-button\"\n    aria-hidden=\"true\"\n    (click)=\"onMenuClick($event)\"\n  >\n    <sky-icon *skyThemeIf=\"'default'\" icon=\"menu\"></sky-icon>\n    <sky-icon *skyThemeIf=\"'modern'\" icon=\"menu\" iconType=\"skyux\"></sky-icon>\n  </span>\n  <div\n    class=\"ag-header-cell-label\"\n    role=\"presentation\"\n    (click)=\"onSortRequested($event)\"\n  >\n    <span class=\"ag-header-cell-text\">{{ params?.displayName }}</span>\n    <span\n      *ngIf=\"filterEnabled$ | async\"\n      class=\"ag-header-icon ag-header-label-icon ag-filter-icon\"\n      aria-hidden=\"true\"\n    >\n      <sky-icon *skyThemeIf=\"'default'\" icon=\"filter\"></sky-icon>\n      <sky-icon\n        *skyThemeIf=\"'modern'\"\n        icon=\"filter\"\n        iconType=\"skyux\"\n      ></sky-icon>\n    </span>\n    <span *ngIf=\"params?.enableSorting\" class=\"ag-sort-indicator-container\">\n      <sky-icon\n        *ngIf=\"(sortOrder$ | async) === 'desc'\"\n        icon=\"caret-down\"\n        class=\"ag-header-label-icon\"\n      ></sky-icon>\n      <sky-icon\n        *ngIf=\"(sortOrder$ | async) === 'asc'\"\n        icon=\"caret-up\"\n        class=\"ag-header-label-icon\"\n      ></sky-icon>\n      <span\n        *ngIf=\"sortIndexDisplay$ | async as sortIndexDisplay\"\n        class=\"ag-sort-indicator-icon ag-sort-order\"\n        aria-hidden=\"true\"\n        >{{ sortIndexDisplay }}</span\n      >\n    </span>\n  </div>\n</div>\n<span class=\"sky-control-help-container\" #inlineHelpContainer></span>\n", styles: [":host{display:flex;max-width:100%;align-items:center;align-content:center}.ag-header-cell-label{padding-right:0;padding-left:0}button{cursor:pointer;flex-grow:0;flex-shrink:0}\n"] }]
+            args: [{ selector: 'sky-ag-grid-header', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"ag-cell-label-container\" role=\"presentation\">\n  <span\n    *ngIf=\"params?.enableMenu\"\n    class=\"ag-header-icon ag-header-cell-menu-button\"\n    aria-hidden=\"true\"\n    (click)=\"onMenuClick($event)\"\n  >\n    <sky-icon *skyThemeIf=\"'default'\" icon=\"menu\"></sky-icon>\n    <sky-icon *skyThemeIf=\"'modern'\" icon=\"menu\" iconType=\"skyux\"></sky-icon>\n  </span>\n  <div\n    [class.ag-header-cell-label-sortable]=\"params?.enableSorting\"\n    class=\"ag-header-cell-label\"\n    role=\"presentation\"\n    (click)=\"onSortRequested($event)\"\n  >\n    <span class=\"ag-header-cell-text\">\n      <ng-template #notSortingHeaderText>{{ params?.displayName }}</ng-template>\n      <button\n        *ngIf=\"params?.enableSorting; else notSortingHeaderText\"\n        class=\"sky-btn-link-inline\"\n        (click)=\"onSortRequested($event)\"\n      >\n        <ng-container *ngTemplateOutlet=\"notSortingHeaderText\"></ng-container>\n      </button>\n    </span>\n    <span\n      *ngIf=\"filterEnabled$ | async\"\n      class=\"ag-header-icon ag-header-label-icon ag-filter-icon\"\n      aria-hidden=\"true\"\n    >\n      <sky-icon *skyThemeIf=\"'default'\" icon=\"filter\"></sky-icon>\n      <sky-icon\n        *skyThemeIf=\"'modern'\"\n        icon=\"filter\"\n        iconType=\"skyux\"\n      ></sky-icon>\n    </span>\n    <span *ngIf=\"params?.enableSorting\" class=\"ag-sort-indicator-container\">\n      <sky-icon\n        *ngIf=\"(sortOrder$ | async) === 'desc'\"\n        icon=\"caret-down\"\n        class=\"ag-header-label-icon\"\n      ></sky-icon>\n      <sky-icon\n        *ngIf=\"(sortOrder$ | async) === 'asc'\"\n        icon=\"caret-up\"\n        class=\"ag-header-label-icon\"\n      ></sky-icon>\n      <span\n        *ngIf=\"sortIndexDisplay$ | async as sortIndexDisplay\"\n        class=\"ag-sort-indicator-icon ag-sort-order\"\n        aria-hidden=\"true\"\n        >{{ sortIndexDisplay }}</span\n      >\n    </span>\n  </div>\n</div>\n<span class=\"sky-control-help-container\" #inlineHelpContainer></span>\n", styles: [":host{display:flex;max-width:100%;align-items:center;align-content:center}.ag-header-cell-label{padding-right:0;padding-left:0}.ag-header-cell-label button{text-transform:inherit}button{cursor:pointer;flex-grow:0;flex-shrink:0}\n"] }]
         }], ctorParameters: function () { return [{ type: i0.ChangeDetectorRef }, { type: i1.SkyDynamicComponentService }]; }, propDecorators: { inlineHelpContainer: [{
                 type: ViewChild,
                 args: ['inlineHelpContainer', { read: ElementRef, static: true }]
@@ -1266,17 +1268,17 @@ var SkyCellType;
     /**
      * **Edit mode**
      * <br/>
-     * Specifies that cells in the column will be edited as  [SKY UX autocomplete components](https://developer.blackbaud.com/skyux/components/autocomplete). You can set any of the autocomplete component's properties by passing `SkyCellEditorAutocompleteParams` in the [column definition's `cellEditorParams` property](https://www.ag-grid.com/angular-data-grid/column-properties/#reference-editing). These params can be updated as other cell edits are made or [provided dynamically](https://www.ag-grid.com/javascript-grid-cell-editing/#dynamic-parameters) based on other cell values. See the demo for an example. Text can be entered and a value selected from the provided list.
+     * Cells in the column will be edited as  [SKY UX autocomplete components](https://developer.blackbaud.com/skyux/components/autocomplete). You can set any of the autocomplete component's properties by passing `SkyCellEditorAutocompleteParams` in the [column definition's `cellEditorParams` property](https://www.ag-grid.com/angular-data-grid/column-properties/#reference-editing). These params can be updated as other cell edits are made or [provided dynamically](https://www.ag-grid.com/javascript-grid-cell-editing/#dynamic-parameters) based on other cell values. See the demo for an example. Text can be entered and a value selected from the provided list.
      * <br/><br/>
      * **Read-only mode**
      * <br/>
-     * Specifies that cells the column will display the currently selected value's name property by default. If the autocomplete needs to show a different property or needs to be formatted in any way, you can [define a `valueFormatter`](https://www.ag-grid.com/javascript-grid-value-formatters/) on the column definition.
+     * Cells the column will display the currently selected value's name property by default. If the autocomplete needs to show a different property or needs to be formatted in any way, you can [define a `valueFormatter`](https://www.ag-grid.com/javascript-grid-value-formatters/) on the column definition.
      */
     SkyCellType["Autocomplete"] = "skyCellAutocomplete";
     /**
      * **Edit mode**
      * <br/>
-     * Specifies that cells in the column will be edited as a currency amount.
+     * Cells in the column will be edited as a currency amount.
      * <br/><br/>
      * **Read-only mode**
      * <br/>
@@ -1292,31 +1294,31 @@ var SkyCellType;
     /**
      * **Edit mode**
      * <br/>
-     * Specifies that cells in the column will be edited as [SKY UX datepicker components](https://developer.blackbaud.com/skyux/components/datepicker). You can set any of the datepicker component's properties by passing `SkyCellEditorDatepickerParams` in the [column definition's `cellEditorParams` property](https://www.ag-grid.com/angular-data-grid/column-properties/#reference-editing). These params can be updated as other cell edits are made or [provided dynamically](https://www.ag-grid.com/javascript-grid-cell-editing/#dynamic-parameters) based on other cell values. See the demo for an example. Date values can be entered.
+     * Cells in the column will be edited as [SKY UX datepicker components](https://developer.blackbaud.com/skyux/components/datepicker). You can set any of the datepicker component's properties by passing `SkyCellEditorDatepickerParams` in the [column definition's `cellEditorParams` property](https://www.ag-grid.com/angular-data-grid/column-properties/#reference-editing). These params can be updated as other cell edits are made or [provided dynamically](https://www.ag-grid.com/javascript-grid-cell-editing/#dynamic-parameters) based on other cell values. See the demo for an example. Date values can be entered.
      * <br/><br/>
      * **Read-only mode**
      * <br/>
-     * Specifies that cells in the column will display the currently selected date formatted as `MM-DD-YYYY`, or the date format of the locale passed to `getGridOptions()`. If you would like to overwrite this format, you can [define a `valueFormatter`](https://www.ag-grid.com/javascript-grid-value-formatters/) on the column definition. See the demo for an example.
+     * Cells in the column will display the currently selected date formatted as `MM-DD-YYYY`, or the date format of the locale passed to `getGridOptions()`. If you would like to overwrite this format, you can [define a `valueFormatter`](https://www.ag-grid.com/javascript-grid-value-formatters/) on the column definition. See the demo for an example.
      */
     SkyCellType["Date"] = "skyCellDate";
     /**
      * **Edit mode**
      * <br/>
-     * Specifies that cells in the column will be edited as [SKY UX lookup components](https://developer.blackbaud.com/skyux-v5/components/lookup). You can set any of the lookup component's properties by passing `SkyCellEditorLookupParams` in the [column definition's `cellEditorParams` property](https://www.ag-grid.com/angular-data-grid/column-properties/#reference-editing). These params can be updated as other cell edits are made or [provided dynamically](https://www.ag-grid.com/javascript-grid-cell-editing/#dynamic-parameters) based on other cell values. See the demo for an example. Text can be entered and a value selected from the provided list.
+     * Cells in the column will be edited as [SKY UX lookup components](https://developer.blackbaud.com/skyux-v5/components/lookup). You can set any of the lookup component's properties by passing `SkyCellEditorLookupParams` in the [column definition's `cellEditorParams` property](https://www.ag-grid.com/angular-data-grid/column-properties/#reference-editing). These params can be updated as other cell edits are made or [provided dynamically](https://www.ag-grid.com/javascript-grid-cell-editing/#dynamic-parameters) based on other cell values. See the demo for an example. Text can be entered and a value selected from the provided list.
      * <br/><br/>
      * **Read-only mode**
      * <br/>
-     * Specifies that cells the column will display, by default, either: the name(s) of the selected value(s) if there are less than 6, or a summary count of the values if there are more than 5. If the lookup needs to show a different property or needs to be formatted in any way, you can [define a `valueFormatter`](https://www.ag-grid.com/javascript-grid-value-formatters/) on the column definition.
+     * Cells the column will display, by default, either: the name(s) of the selected value(s) if there are less than 6, or a summary count of the values if there are more than 5. If the lookup needs to show a different property or needs to be formatted in any way, you can [define a `valueFormatter`](https://www.ag-grid.com/javascript-grid-value-formatters/) on the column definition.
      */
     SkyCellType["Lookup"] = "skyCellLookup";
     /**
      * **Edit mode**
      * <br/>
-     * Specifies that cells in the column will be edited as HTML number `inputs`. Only numbers can be entered.
+     * Cells in the column will be edited as HTML number `inputs`. Only numbers can be entered.
      * <br/><br/>
      * **Read-only mode**
      * <br/>
-     * Specifies that cells in the column will render as the number value.
+     * Cells in the column will render as the number value.
      */
     SkyCellType["Number"] = "skyCellNumber";
     /**
@@ -1328,23 +1330,23 @@ var SkyCellType;
     /**
      * **Edit and read-only modes**
      * <br/>
-     * Specifies that cells in the column will render as [SKY UX checkbox components](https://developer.blackbaud.com/skyux/components/checkbox). It allows the user to select multiple rows, and adds a highlight to selected rows. The [Ag Grid `rowNode`](https://www.ag-grid.com/javascript-grid-row-node/) will be updated to reflect the selected state.
+     * Cells in the column will render as [SKY UX checkbox components](https://developer.blackbaud.com/skyux/components/checkbox). It allows the user to select multiple rows, and adds a highlight to selected rows. The [Ag Grid `rowNode`](https://www.ag-grid.com/javascript-grid-row-node/) will be updated to reflect the selected state.
      */
     SkyCellType["RowSelector"] = "skyCellRowSelector";
     /**
      * **Edit mode**
      * <br/>
-     * Specifies that cells in the column will be edited as HTML text `inputs`. Any characters can be entered.
+     * Cells in the column will be edited as HTML text `inputs`. Any characters can be entered.
      * <br/><br/>
      * **Read-only mode**
      * <br/>
-     * Specifies cells in the column will render as their string value.
+     * Cells in the column will render as their string value.
      */
     SkyCellType["Text"] = "skyCellText";
     /**
      * **Edit and read-only modes**
      * <br/>
-     * Specifies cell in the column will be passed to a validator function which flags erroneous entries. You can set the validator function and message by passing them to [column definition's `cellRendererParams` property](https://www.ag-grid.com/angular-data-grid/column-properties/#reference-editing) as `skyComponentProperties.validator` and `skyComponentProperties.validatorMessage`. SkyCellType.Validator can be combined with other cell types, such as SkyCellType.Autocomplete or SkyCellType.Date, by using the array syntax for the [column definition's `type` property](https://www.ag-grid.com/angular-data-grid/column-properties/#reference-editing).
+     * Cells in the column will be passed to a validator function that flags erroneous entries. You can set the validator function and message by passing them to [column definition's `cellRendererParams` property](https://www.ag-grid.com/angular-data-grid/column-properties/#reference-editing) as `skyComponentProperties.validator` and `skyComponentProperties.validatorMessage`. SkyCellType.Validator can be combined with other cell types, such as SkyCellType.Autocomplete or SkyCellType.Date, by using the array syntax for the [column definition's `type` property](https://www.ag-grid.com/angular-data-grid/column-properties/#reference-editing).
      */
     SkyCellType["Validator"] = "skyCellValidator";
 })(SkyCellType || (SkyCellType = {}));
@@ -2265,7 +2267,7 @@ class SkyAgGridRowDeleteDirective {
         __classPrivateFieldSet(this, _SkyAgGridRowDeleteDirective_viewContainerRef, viewContainerRef, "f");
     }
     /**
-     * Specifies the ids of the data in the rows on which inline delete's should be shown.
+     * The IDs of the data in the rows where the inline delete appears.
      */
     set rowDeleteIds(value) {
         __classPrivateFieldSet(this, _SkyAgGridRowDeleteDirective_rowDeleteIdsInternal, value, "f");