@skyux/ag-grid 11.36.2 → 11.38.0

package/fesm2022/skyux-ag-grid.mjs

@@ -1,7 +1,7 @@
 import * as i1$1 from '@angular/common';
 import { DOCUMENT, CommonModule, AsyncPipe, NgTemplateOutlet } from '@angular/common';
 import * as i0 from '@angular/core';
-import { NgModule, Injectable, inject, ChangeDetectorRef, ElementRef, booleanAttribute, Component, ChangeDetectionStrategy, ContentChild, HostBinding, Input, contentChildren, effect, Directive, TemplateRef, ViewChildren, ViewChild, EventEmitter, EnvironmentInjector, ViewContainerRef, Output, HostListener, ViewEncapsulation, computed, signal, Optional } from '@angular/core';
+import { NgModule, Injectable, input, numberAttribute, computed, inject, ChangeDetectorRef, ElementRef, booleanAttribute, Component, ChangeDetectionStrategy, ContentChild, HostBinding, Input, contentChildren, effect, Directive, TemplateRef, ViewChildren, ViewChild, EventEmitter, contentChild, EnvironmentInjector, ViewContainerRef, Output, HostListener, ViewEncapsulation, signal, Optional } from '@angular/core';
 import * as i1 from '@skyux/core';
 import { SkyMutationObserverService, SkyMediaQueryService, SkyAffixService, SkyDynamicComponentService, SkyOverlayService, SkyScrollableHostService, SKY_STACKING_CONTEXT, SkyAffixAutoFitContext, SkyIdModule, SkyNumericModule, SkyDynamicComponentLocation, SkyViewkeeperModule, SkyLogService } from '@skyux/core';
 import * as i1$2 from '@skyux/data-manager';
@@ -18,7 +18,7 @@ import { AgGridAngular, AgGridModule } from 'ag-grid-angular';
 import * as i3 from '@skyux/i18n';
 import { SkyLibResourcesService, SkyI18nModule } from '@skyux/i18n';
 import { toSignal } from '@angular/core/rxjs-interop';
-import { Subject, BehaviorSubject, ReplaySubject, takeUntil, combineLatest, distinctUntilChanged, of, take, fromEvent, Subscription, fromEventPattern, isObservable } from 'rxjs';
+import { Subject, BehaviorSubject, ReplaySubject, takeUntil, combineLatest, distinctUntilChanged, of, take, merge, debounce, animationFrames, fromEvent, Subscription, fromEventPattern, isObservable } from 'rxjs';
 import { takeUntil as takeUntil$1, filter, first } from 'rxjs/operators';
 import { ModuleRegistry, ModuleNames, KeyCode, PopupComponent } from 'ag-grid-community';
 import * as i1$3 from '@angular/forms';
@@ -334,6 +334,15 @@ class SkyAgGridWrapperComponent {
     #hasEditableClass;
     constructor() {
         this.isNormalLayout = false;
+        /**
+         * The minimum height of the grid in pixels. The default value is `50`.
+         */
+        this.minHeight = input(50, {
+            transform: numberAttribute,
+        });
+        this.minHeightStyle = computed(() => {
+            return `--sky-ag-grid-min-height: ${this.minHeight()}px;`;
+        });
         this.#_viewkeeperClasses = [];
         this.#ngUnsubscribe = new Subject();
         this.#themeSvc = inject(SkyThemeService, {
@@ -548,11 +557,11 @@ class SkyAgGridWrapperComponent {
         }
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: SkyAgGridWrapperComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "16.1.0", version: "18.2.13", type: SkyAgGridWrapperComponent, selector: "sky-ag-grid-wrapper", inputs: { compact: ["compact", "compact", booleanAttribute] }, host: { properties: { "class.sky-ag-grid-layout-normal": "this.isNormalLayout" } }, queries: [{ propertyName: "agGrid", first: true, predicate: AgGridAngular, descendants: true, static: true }], ngImport: i0, template: "<span\n  class=\"nav-anchor\"\n  tabindex=\"0\"\n  [id]=\"beforeAnchorId\"\n  (focusin)=\"onAnchorFocus($event)\"\n>\n</span>\n<div\n  class=\"sky-ag-grid\"\n  tabindex=\"0\"\n  [class.sky-ag-grid-top-scrollbar]=\"\n    agGrid?.gridOptions?.context &&\n    agGrid?.gridOptions?.context['enableTopScroll']\n  \"\n  [ngClass]=\"wrapperClasses$ | async\"\n  [id]=\"gridId\"\n  [skyViewkeeper]=\"viewkeeperClasses\"\n  (keydown)=\"onGridKeydown($event)\"\n  (keyup.escape)=\"onKeyUpEscape($event)\"\n>\n  <ng-content />\n</div>\n<span\n  tabindex=\"0\"\n  class=\"nav-anchor\"\n  [id]=\"afterAnchorId\"\n  (focusin)=\"onAnchorFocus($event)\"\n>\n</span>\n", dependencies: [{ kind: "directive", type: i1$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.λ3, selector: "[skyViewkeeper]", inputs: ["skyViewkeeper"] }, { kind: "pipe", type: i1$1.AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "18.2.13", type: SkyAgGridWrapperComponent, selector: "sky-ag-grid-wrapper", inputs: { compact: { classPropertyName: "compact", publicName: "compact", isSignal: false, isRequired: false, transformFunction: booleanAttribute }, minHeight: { classPropertyName: "minHeight", publicName: "minHeight", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class.sky-ag-grid-layout-normal": "this.isNormalLayout" } }, queries: [{ propertyName: "agGrid", first: true, predicate: AgGridAngular, descendants: true, static: true }], ngImport: i0, template: "<span\n  class=\"nav-anchor\"\n  tabindex=\"0\"\n  [id]=\"beforeAnchorId\"\n  (focusin)=\"onAnchorFocus($event)\"\n>\n</span>\n<div\n  class=\"sky-ag-grid\"\n  tabindex=\"0\"\n  [class.sky-ag-grid-top-scrollbar]=\"\n    agGrid?.gridOptions?.context &&\n    agGrid?.gridOptions?.context['enableTopScroll']\n  \"\n  [ngClass]=\"wrapperClasses$ | async\"\n  [id]=\"gridId\"\n  [skyViewkeeper]=\"viewkeeperClasses\"\n  [style]=\"minHeightStyle()\"\n  (keydown)=\"onGridKeydown($event)\"\n  (keyup.escape)=\"onKeyUpEscape($event)\"\n>\n  <ng-content />\n</div>\n<span\n  tabindex=\"0\"\n  class=\"nav-anchor\"\n  [id]=\"afterAnchorId\"\n  (focusin)=\"onAnchorFocus($event)\"\n>\n</span>\n", dependencies: [{ kind: "directive", type: i1$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.λ3, selector: "[skyViewkeeper]", inputs: ["skyViewkeeper"] }, { kind: "pipe", type: i1$1.AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: SkyAgGridWrapperComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'sky-ag-grid-wrapper', changeDetection: ChangeDetectionStrategy.OnPush, template: "<span\n  class=\"nav-anchor\"\n  tabindex=\"0\"\n  [id]=\"beforeAnchorId\"\n  (focusin)=\"onAnchorFocus($event)\"\n>\n</span>\n<div\n  class=\"sky-ag-grid\"\n  tabindex=\"0\"\n  [class.sky-ag-grid-top-scrollbar]=\"\n    agGrid?.gridOptions?.context &&\n    agGrid?.gridOptions?.context['enableTopScroll']\n  \"\n  [ngClass]=\"wrapperClasses$ | async\"\n  [id]=\"gridId\"\n  [skyViewkeeper]=\"viewkeeperClasses\"\n  (keydown)=\"onGridKeydown($event)\"\n  (keyup.escape)=\"onKeyUpEscape($event)\"\n>\n  <ng-content />\n</div>\n<span\n  tabindex=\"0\"\n  class=\"nav-anchor\"\n  [id]=\"afterAnchorId\"\n  (focusin)=\"onAnchorFocus($event)\"\n>\n</span>\n" }]
+            args: [{ selector: 'sky-ag-grid-wrapper', changeDetection: ChangeDetectionStrategy.OnPush, template: "<span\n  class=\"nav-anchor\"\n  tabindex=\"0\"\n  [id]=\"beforeAnchorId\"\n  (focusin)=\"onAnchorFocus($event)\"\n>\n</span>\n<div\n  class=\"sky-ag-grid\"\n  tabindex=\"0\"\n  [class.sky-ag-grid-top-scrollbar]=\"\n    agGrid?.gridOptions?.context &&\n    agGrid?.gridOptions?.context['enableTopScroll']\n  \"\n  [ngClass]=\"wrapperClasses$ | async\"\n  [id]=\"gridId\"\n  [skyViewkeeper]=\"viewkeeperClasses\"\n  [style]=\"minHeightStyle()\"\n  (keydown)=\"onGridKeydown($event)\"\n  (keyup.escape)=\"onKeyUpEscape($event)\"\n>\n  <ng-content />\n</div>\n<span\n  tabindex=\"0\"\n  class=\"nav-anchor\"\n  [id]=\"afterAnchorId\"\n  (focusin)=\"onAnchorFocus($event)\"\n>\n</span>\n" }]
         }], ctorParameters: () => [], propDecorators: { agGrid: [{
                 type: ContentChild,
                 args: [AgGridAngular, {
@@ -973,7 +982,7 @@ class SkyAgGridRowDeleteDirective {
                 });
                 if (this.#rowDeleteComponent.inlineDeleteTemplateRef) {
                     overlay.attachTemplate(this.#rowDeleteComponent.inlineDeleteTemplateRef, {
-                        $implicit: this.agGrid.api.getRowNode(id),
+                        $implicit: this.agGrid()?.api.getRowNode(id),
                         tableWidth: () => this.#elementRef.nativeElement.querySelector('.sky-ag-grid')
                             .offsetWidth,
                         getRowDeleteItem: (row) => this.getRowDeleteItem(row),
@@ -1037,6 +1046,7 @@ class SkyAgGridRowDeleteDirective {
     #scrollableHostService;
     #stackingContext;
     #viewContainerRef;
+    #viewInit;
     constructor() {
         /**
          * Emits a `SkyAgGridRowDeleteCancelArgs` object when a row's inline delete is cancelled.
@@ -1051,6 +1061,7 @@ class SkyAgGridRowDeleteDirective {
          */
         this.rowDeleteIdsChange = new EventEmitter();
         this.#rowDeleteConfigs = [];
+        this.agGrid = contentChild(AgGridAngular);
         this.#ngUnsubscribe = new Subject();
         this.#rowDeleteContents = {};
         this.#clipPath = new BehaviorSubject(undefined);
@@ -1064,6 +1075,7 @@ class SkyAgGridRowDeleteDirective {
         this.#scrollableHostService = inject(SkyScrollableHostService);
         this.#stackingContext = inject(SKY_STACKING_CONTEXT, { optional: true });
         this.#viewContainerRef = inject(ViewContainerRef);
+        this.#viewInit = new Subject();
         this.#hasStackingContext = !!this.#stackingContext;
         if (this.#stackingContext) {
             this.#stackingContext.zIndex
@@ -1072,29 +1084,22 @@ class SkyAgGridRowDeleteDirective {
                 this.#zIndex.next(zIndex);
             });
         }
+        effect(() => {
+            const agGrid = this.agGrid();
+            if (agGrid) {
+                merge(agGrid.filterChanged, agGrid.firstDataRendered, agGrid.gridReady, agGrid.rowDataUpdated, agGrid.sortChanged, this.#viewInit)
+                    .pipe(takeUntil$1(this.#ngUnsubscribe), debounce(() => animationFrames()))
+                    .subscribe(() => {
+                    this.#updateRowDeleteStates();
+                });
+            }
+        });
     }
     ngAfterContentInit() {
         this.#rowDeleteComponent = this.#dynamicComponentSvc.createComponent(SkyAgGridRowDeleteComponent, {
             environmentInjector: this.#environmentInjector,
             viewContainerRef: this.#viewContainerRef,
         }).instance;
-        if (this.agGrid) {
-            this.agGrid.rowDataUpdated
-                .pipe(takeUntil$1(this.#ngUnsubscribe))
-                .subscribe(() => {
-                this.#updateRowDeleteStates();
-            });
-            this.agGrid.sortChanged
-                .pipe(takeUntil$1(this.#ngUnsubscribe))
-                .subscribe(() => {
-                this.#updateRowDeleteStates();
-            });
-            this.agGrid.filterChanged
-                .pipe(takeUntil$1(this.#ngUnsubscribe))
-                .subscribe(() => {
-                this.#updateRowDeleteStates();
-            });
-        }
     }
     ngAfterViewInit() {
         if (this.#hasStackingContext) {
@@ -1105,6 +1110,7 @@ class SkyAgGridRowDeleteDirective {
                 this.#clipPath.next(clipPath);
             });
         }
+        this.#viewInit.next();
     }
     ngOnDestroy() {
         this.#ngUnsubscribe.next();
@@ -1148,20 +1154,16 @@ class SkyAgGridRowDeleteDirective {
     }
     #destroyRowDelete(id) {
         const rowDeleteContents = this.#rowDeleteContents[id];
-        /* sanity check */
-        /* istanbul ignore else */
-        if (rowDeleteContents) {
-            rowDeleteContents.affixer.destroy();
-            this.#overlayService.close(rowDeleteContents.overlay);
-            delete this.#rowDeleteContents[id];
-            this.#rowDeleteConfigs = this.#rowDeleteConfigs.filter((config) => config.id !== id);
-            this.#rowDeleteIdsInternal = this.rowDeleteIds?.filter((arrayId) => arrayId !== id);
-            this.rowDeleteIdsChange.emit(this.#rowDeleteIdsInternal);
-        }
+        rowDeleteContents?.affixer.destroy();
+        this.#overlayService.close(rowDeleteContents?.overlay);
+        delete this.#rowDeleteContents[id];
+        this.#rowDeleteConfigs = this.#rowDeleteConfigs.filter((config) => config.id !== id);
+        this.#rowDeleteIdsInternal = this.rowDeleteIds?.filter((arrayId) => arrayId !== id);
+        this.rowDeleteIdsChange.emit(this.#rowDeleteIdsInternal);
     }
     #updateRowDeleteStates() {
         this.#rowDeleteConfigs.forEach((config) => {
-            if (!this.agGrid?.api.getRowNode(config.id)) {
+            if (!this.agGrid()?.api.getRowNode(config.id)) {
                 this.#destroyRowDelete(config.id);
             }
             else {
@@ -1173,7 +1175,7 @@ class SkyAgGridRowDeleteDirective {
         this.#changeDetector.markForCheck();
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: SkyAgGridRowDeleteDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "18.2.13", type: SkyAgGridRowDeleteDirective, selector: "[skyAgGridRowDelete]", inputs: { rowDeleteIds: "rowDeleteIds" }, outputs: { rowDeleteCancel: "rowDeleteCancel", rowDeleteConfirm: "rowDeleteConfirm", rowDeleteIdsChange: "rowDeleteIdsChange" }, queries: [{ propertyName: "agGrid", first: true, predicate: AgGridAngular, descendants: true }], ngImport: i0 }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.2.0", version: "18.2.13", type: SkyAgGridRowDeleteDirective, selector: "[skyAgGridRowDelete]", inputs: { rowDeleteIds: "rowDeleteIds" }, outputs: { rowDeleteCancel: "rowDeleteCancel", rowDeleteConfirm: "rowDeleteConfirm", rowDeleteIdsChange: "rowDeleteIdsChange" }, queries: [{ propertyName: "agGrid", first: true, predicate: AgGridAngular, descendants: true, isSignal: true }], ngImport: i0 }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: SkyAgGridRowDeleteDirective, decorators: [{
             type: Directive,
@@ -1188,9 +1190,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImpo
                 type: Output
             }], rowDeleteIdsChange: [{
                 type: Output
-            }], agGrid: [{
-                type: ContentChild,
-                args: [AgGridAngular]
             }] } });
 
 /** The initial action that a cell editor should take when initialized. */
@@ -1256,8 +1255,16 @@ class SkyAgGridCellEditorAutocompleteComponent {
     #triggerType;
     #params;
     #elementRef;
-    onBlur() {
-        this.#stopEditingOnBlur();
+    onBlur(event) {
+        if (event.relatedTarget &&
+            event.relatedTarget === this.#params?.eGridCell) {
+            // If focus is being set to the grid cell, schedule focus on the input.
+            // This happens when the refreshCells API is called.
+            this.afterGuiAttached();
+        }
+        else {
+            this.#stopEditingOnBlur();
+        }
     }
     agInit(params) {
         this.#params = params;
@@ -1315,7 +1322,7 @@ class SkyAgGridCellEditorAutocompleteComponent {
         }
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: SkyAgGridCellEditorAutocompleteComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.13", type: SkyAgGridCellEditorAutocompleteComponent, selector: "sky-ag-grid-cell-editor-autocomplete", host: { listeners: { "blur": "onBlur()" } }, viewQueries: [{ propertyName: "input", first: true, predicate: ["skyCellEditorAutocomplete"], descendants: true, read: ElementRef }], ngImport: i0, template: "<div class=\"sky-ag-grid-cell-editor-autocomplete\" [formGroup]=\"editorForm\">\n  <sky-autocomplete\n    [data]=\"skyComponentProperties.data\"\n    [debounceTime]=\"skyComponentProperties.debounceTime\"\n    [descriptorProperty]=\"skyComponentProperties.descriptorProperty\"\n    [propertiesToSearch]=\"skyComponentProperties.propertiesToSearch\"\n    [search]=\"skyComponentProperties.search\"\n    [searchFilters]=\"skyComponentProperties.searchFilters\"\n    [searchResultsLimit]=\"skyComponentProperties.searchResultsLimit\"\n    [searchResultTemplate]=\"skyComponentProperties.searchResultTemplate\"\n    [searchTextMinimumCharacters]=\"\n      skyComponentProperties.searchTextMinimumCharacters\n    \"\n    (selectionChange)=\"\n      skyComponentProperties.selectionChange &&\n        skyComponentProperties.selectionChange($event)\n    \"\n    (openChange)=\"onAutocompleteOpenChange($event)\"\n  >\n    <input\n      #skyCellEditorAutocomplete\n      formControlName=\"selection\"\n      skyAutocomplete\n      type=\"text\"\n      [attr.aria-label]=\"\n        'sky_ag_grid_cell_editor_autocomplete_aria_label'\n          | skyLibResources: columnHeader : rowNumber\n      \"\n    />\n  </sky-autocomplete>\n</div>\n", styles: ["sky-autocomplete input{border:none;box-shadow:none}\n"], dependencies: [{ kind: "directive", type: i1$3.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$3.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$3.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$3.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "component", type: i2$1.λ2, selector: "sky-autocomplete", inputs: ["ariaLabelledBy", "data", "debounceTime", "descriptorProperty", "enableShowMore", "messageStream", "wrapperClass", "propertiesToSearch", "search", "searchResultTemplate", "searchTextMinimumCharacters", "searchFilters", "searchResultsLimit", "showAddButton", "noResultsFoundText", "searchAsyncDisabled"], outputs: ["addClick", "showMoreClick", "selectionChange", "searchAsync", "openChange"] }, { kind: "directive", type: i2$1.λ1, selector: "input[skyAutocomplete], textarea[skyAutocomplete]", inputs: ["autocompleteAttribute", "disabled"] }, { kind: "pipe", type: i3.SkyLibResourcesPipe, name: "skyLibResources" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.13", type: SkyAgGridCellEditorAutocompleteComponent, selector: "sky-ag-grid-cell-editor-autocomplete", host: { listeners: { "focusout": "onBlur($event)" } }, viewQueries: [{ propertyName: "input", first: true, predicate: ["skyCellEditorAutocomplete"], descendants: true, read: ElementRef }], ngImport: i0, template: "<div class=\"sky-ag-grid-cell-editor-autocomplete\" [formGroup]=\"editorForm\">\n  <sky-autocomplete\n    [data]=\"skyComponentProperties.data\"\n    [debounceTime]=\"skyComponentProperties.debounceTime\"\n    [descriptorProperty]=\"skyComponentProperties.descriptorProperty\"\n    [propertiesToSearch]=\"skyComponentProperties.propertiesToSearch\"\n    [search]=\"skyComponentProperties.search\"\n    [searchFilters]=\"skyComponentProperties.searchFilters\"\n    [searchResultsLimit]=\"skyComponentProperties.searchResultsLimit\"\n    [searchResultTemplate]=\"skyComponentProperties.searchResultTemplate\"\n    [searchTextMinimumCharacters]=\"\n      skyComponentProperties.searchTextMinimumCharacters\n    \"\n    (selectionChange)=\"\n      skyComponentProperties.selectionChange &&\n        skyComponentProperties.selectionChange($event)\n    \"\n    (openChange)=\"onAutocompleteOpenChange($event)\"\n  >\n    <input\n      #skyCellEditorAutocomplete\n      formControlName=\"selection\"\n      skyAutocomplete\n      type=\"text\"\n      [attr.aria-label]=\"\n        'sky_ag_grid_cell_editor_autocomplete_aria_label'\n          | skyLibResources: columnHeader : rowNumber\n      \"\n    />\n  </sky-autocomplete>\n</div>\n", styles: ["sky-autocomplete input{border:none;box-shadow:none}\n"], dependencies: [{ kind: "directive", type: i1$3.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$3.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$3.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$3.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "component", type: i2$1.λ2, selector: "sky-autocomplete", inputs: ["ariaLabelledBy", "data", "debounceTime", "descriptorProperty", "enableShowMore", "messageStream", "wrapperClass", "propertiesToSearch", "search", "searchResultTemplate", "searchTextMinimumCharacters", "searchFilters", "searchResultsLimit", "showAddButton", "noResultsFoundText", "searchAsyncDisabled"], outputs: ["addClick", "showMoreClick", "selectionChange", "searchAsync", "openChange"] }, { kind: "directive", type: i2$1.λ1, selector: "input[skyAutocomplete], textarea[skyAutocomplete]", inputs: ["autocompleteAttribute", "disabled"] }, { kind: "pipe", type: i3.SkyLibResourcesPipe, name: "skyLibResources" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: SkyAgGridCellEditorAutocompleteComponent, decorators: [{
             type: Component,
@@ -1325,7 +1332,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImpo
                 args: ['skyCellEditorAutocomplete', { read: ElementRef }]
             }], onBlur: [{
                 type: HostListener,
-                args: ['blur']
+                args: ['focusout', ['$event']]
             }] } });
 
 class SkyAgGridCellEditorAutocompleteModule {
@@ -1365,6 +1372,13 @@ class SkyAgGridCellEditorCurrencyComponent {
         this.#changeDetector = inject(ChangeDetectorRef);
         this.#initialized = false;
     }
+    onFocusOut(event) {
+        if (event.relatedTarget && event.relatedTarget === this.params?.eGridCell) {
+            // If focus is being set to the grid cell, schedule focus on the input.
+            // This happens when the refreshCells API is called.
+            this.afterGuiAttached();
+        }
+    }
     #triggerType;
     #changeDetector;
     #initialized;
@@ -1446,7 +1460,7 @@ class SkyAgGridCellEditorCurrencyComponent {
         this.#initialized = true;
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: SkyAgGridCellEditorCurrencyComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.13", type: SkyAgGridCellEditorCurrencyComponent, selector: "sky-ag-grid-cell-editor-currency", viewQueries: [{ propertyName: "input", first: true, predicate: ["skyCellEditorCurrency"], descendants: true, read: ElementRef }], ngImport: i0, template: "<ng-container [formGroup]=\"editorForm\">\n  <input\n    #skyCellEditorCurrency\n    type=\"text\"\n    [formControl]=\"currency\"\n    [attr.aria-label]=\"\n      'sky_ag_grid_cell_editor_currency_aria_label'\n        | skyLibResources: columnHeader : rowNumber\n    \"\n    [style.width.px]=\"columnWidth\"\n    [style.height.px]=\"rowHeightWithoutBorders\"\n    [skyAutonumeric]=\"skyComponentProperties\"\n    [skyAutonumericFormChangesUnformatted]=\"params?.eventKey?.length === 1\"\n    (keyup.enter)=\"onPressEnter()\"\n    (keyup.escape)=\"onPressEscape()\"\n  />\n</ng-container>\n", styles: ["input{border:none;padding-left:11px}\n"], dependencies: [{ kind: "directive", type: i1$3.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$3.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$3.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$3.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i2$2.λ1, selector: "input[skyAutonumeric]", inputs: ["skyAutonumeric", "skyAutonumericFormChangesUnformatted"] }, { kind: "pipe", type: i3.SkyLibResourcesPipe, name: "skyLibResources" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.13", type: SkyAgGridCellEditorCurrencyComponent, selector: "sky-ag-grid-cell-editor-currency", host: { listeners: { "focusout": "onFocusOut($event)" } }, viewQueries: [{ propertyName: "input", first: true, predicate: ["skyCellEditorCurrency"], descendants: true, read: ElementRef }], ngImport: i0, template: "<ng-container [formGroup]=\"editorForm\">\n  <input\n    #skyCellEditorCurrency\n    type=\"text\"\n    [formControl]=\"currency\"\n    [attr.aria-label]=\"\n      'sky_ag_grid_cell_editor_currency_aria_label'\n        | skyLibResources: columnHeader : rowNumber\n    \"\n    [style.width.px]=\"columnWidth\"\n    [style.height.px]=\"rowHeightWithoutBorders\"\n    [skyAutonumeric]=\"skyComponentProperties\"\n    [skyAutonumericFormChangesUnformatted]=\"params?.eventKey?.length === 1\"\n    (keyup.enter)=\"onPressEnter()\"\n    (keyup.escape)=\"onPressEscape()\"\n  />\n</ng-container>\n", styles: ["input{border:none;padding-left:11px}\n"], dependencies: [{ kind: "directive", type: i1$3.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$3.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$3.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$3.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i2$2.λ1, selector: "input[skyAutonumeric]", inputs: ["skyAutonumeric", "skyAutonumericFormChangesUnformatted"] }, { kind: "pipe", type: i3.SkyLibResourcesPipe, name: "skyLibResources" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: SkyAgGridCellEditorCurrencyComponent, decorators: [{
             type: Component,
@@ -1454,6 +1468,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImpo
         }], propDecorators: { input: [{
                 type: ViewChild,
                 args: ['skyCellEditorCurrency', { read: ElementRef }]
+            }], onFocusOut: [{
+                type: HostListener,
+                args: ['focusout', ['$event']]
             }] } });
 
 class SkyAgGridCellEditorCurrencyModule {
@@ -1696,8 +1713,16 @@ class SkyAgGridCellEditorLookupComponent {
     #triggerType;
     #changeDetector;
     #elementRef;
-    onBlur() {
-        this.#stopEditingOnBlur();
+    onBlur(event) {
+        if (event.relatedTarget &&
+            event.relatedTarget === this.#params?.eGridCell) {
+            // If focus is being set to the grid cell, schedule focus on the input.
+            // This happens when the refreshCells API is called.
+            this.afterGuiAttached();
+        }
+        else {
+            this.#stopEditingOnBlur();
+        }
     }
     agInit(params) {
         this.#params = params;
@@ -1796,7 +1821,7 @@ class SkyAgGridCellEditorLookupComponent {
         }
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: SkyAgGridCellEditorLookupComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.13", type: SkyAgGridCellEditorLookupComponent, selector: "sky-ag-grid-cell-editor-lookup", host: { listeners: { "blur": "onBlur()" }, properties: { "style.width.px": "this.width" } }, ngImport: i0, template: "@if (isAlive && useAsyncSearch) {\n  <sky-input-box\n    [disabled]=\"skyComponentProperties?.disabled\"\n    [formGroup]=\"editorForm\"\n  >\n    <sky-lookup\n      formControlName=\"selection\"\n      [ariaLabelledBy]=\"\n        skyComponentProperties?.ariaLabelledBy ?? screenReaderLabel.id\n      \"\n      [autocompleteAttribute]=\"skyComponentProperties?.autocompleteAttribute\"\n      [data]=\"skyComponentProperties?.data\"\n      [debounceTime]=\"skyComponentProperties?.debounceTime\"\n      [descriptorProperty]=\"skyComponentProperties?.descriptorProperty\"\n      [enableShowMore]=\"skyComponentProperties?.enableShowMore\"\n      [idProperty]=\"skyComponentProperties?.idProperty\"\n      [placeholderText]=\"skyComponentProperties?.placeholderText\"\n      [propertiesToSearch]=\"skyComponentProperties?.propertiesToSearch\"\n      [search]=\"skyComponentProperties?.search\"\n      [searchFilters]=\"skyComponentProperties?.searchFilters\"\n      [searchResultsLimit]=\"skyComponentProperties?.searchResultsLimit\"\n      [searchResultTemplate]=\"skyComponentProperties?.searchResultTemplate\"\n      [searchTextMinimumCharacters]=\"\n        skyComponentProperties?.searchTextMinimumCharacters\n      \"\n      [selectMode]=\"skyComponentProperties?.selectMode\"\n      [showAddButton]=\"skyComponentProperties?.showAddButton\"\n      [showMoreConfig]=\"skyComponentProperties?.showMoreConfig\"\n      [wrapperClass]=\"skyComponentProperties?.wrapperClass\"\n      (searchAsync)=\"skyComponentProperties?.searchAsync?.($event)\"\n      (addClick)=\"skyComponentProperties?.addClick?.($event)\"\n      (openChange)=\"onLookupOpenChange($event)\"\n    />\n  </sky-input-box>\n}\n@if (isAlive && !useAsyncSearch) {\n  <sky-input-box\n    [disabled]=\"skyComponentProperties?.disabled\"\n    [formGroup]=\"editorForm\"\n  >\n    <sky-lookup\n      formControlName=\"selection\"\n      [ariaLabelledBy]=\"\n        skyComponentProperties?.ariaLabelledBy ?? screenReaderLabel.id\n      \"\n      [autocompleteAttribute]=\"skyComponentProperties?.autocompleteAttribute\"\n      [data]=\"skyComponentProperties?.data\"\n      [debounceTime]=\"skyComponentProperties?.debounceTime\"\n      [descriptorProperty]=\"skyComponentProperties?.descriptorProperty\"\n      [enableShowMore]=\"skyComponentProperties?.enableShowMore\"\n      [idProperty]=\"skyComponentProperties?.idProperty\"\n      [placeholderText]=\"skyComponentProperties?.placeholderText\"\n      [propertiesToSearch]=\"skyComponentProperties?.propertiesToSearch\"\n      [search]=\"skyComponentProperties?.search\"\n      [searchFilters]=\"skyComponentProperties?.searchFilters\"\n      [searchResultsLimit]=\"skyComponentProperties?.searchResultsLimit\"\n      [searchResultTemplate]=\"skyComponentProperties?.searchResultTemplate\"\n      [searchTextMinimumCharacters]=\"\n        skyComponentProperties?.searchTextMinimumCharacters\n      \"\n      [selectMode]=\"skyComponentProperties?.selectMode\"\n      [showAddButton]=\"skyComponentProperties?.showAddButton\"\n      [showMoreConfig]=\"skyComponentProperties?.showMoreConfig\"\n      [wrapperClass]=\"skyComponentProperties?.wrapperClass\"\n      (addClick)=\"skyComponentProperties?.addClick?.($event)\"\n      (openChange)=\"onLookupOpenChange($event)\"\n    />\n  </sky-input-box>\n}\n<div #screenReaderLabel=\"skyId\" class=\"sky-screen-reader-only\" skyId>\n  {{ labelText }}\n</div>\n", styles: [":host{display:block}\n"], dependencies: [{ kind: "directive", type: i1$3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$3.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$3.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$3.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "directive", type: i1.λ2, selector: "[skyId]", exportAs: ["skyId"] }, { kind: "component", type: i3$1.λ10, selector: "sky-input-box", inputs: ["hasErrors", "disabled", "labelText", "characterLimit", "stacked", "helpPopoverTitle", "helpPopoverContent", "helpKey", "hintText"] }, { kind: "component", type: i2$1.λ4, selector: "sky-lookup", inputs: ["ariaLabel", "ariaLabelledBy", "autocompleteAttribute", "data", "disabled", "required", "enableShowMore", "placeholderText", "idProperty", "showAddButton", "showMoreConfig", "selectMode", "wrapperClass"], outputs: ["addClick", "openChange"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.13", type: SkyAgGridCellEditorLookupComponent, selector: "sky-ag-grid-cell-editor-lookup", host: { listeners: { "focusout": "onBlur($event)" }, properties: { "style.width.px": "this.width" } }, ngImport: i0, template: "@if (isAlive && useAsyncSearch) {\n  <sky-input-box\n    [disabled]=\"skyComponentProperties?.disabled\"\n    [formGroup]=\"editorForm\"\n  >\n    <sky-lookup\n      formControlName=\"selection\"\n      [ariaLabelledBy]=\"\n        skyComponentProperties?.ariaLabelledBy ?? screenReaderLabel.id\n      \"\n      [autocompleteAttribute]=\"skyComponentProperties?.autocompleteAttribute\"\n      [data]=\"skyComponentProperties?.data\"\n      [debounceTime]=\"skyComponentProperties?.debounceTime\"\n      [descriptorProperty]=\"skyComponentProperties?.descriptorProperty\"\n      [enableShowMore]=\"skyComponentProperties?.enableShowMore\"\n      [idProperty]=\"skyComponentProperties?.idProperty\"\n      [placeholderText]=\"skyComponentProperties?.placeholderText\"\n      [propertiesToSearch]=\"skyComponentProperties?.propertiesToSearch\"\n      [search]=\"skyComponentProperties?.search\"\n      [searchFilters]=\"skyComponentProperties?.searchFilters\"\n      [searchResultsLimit]=\"skyComponentProperties?.searchResultsLimit\"\n      [searchResultTemplate]=\"skyComponentProperties?.searchResultTemplate\"\n      [searchTextMinimumCharacters]=\"\n        skyComponentProperties?.searchTextMinimumCharacters\n      \"\n      [selectMode]=\"skyComponentProperties?.selectMode\"\n      [showAddButton]=\"skyComponentProperties?.showAddButton\"\n      [showMoreConfig]=\"skyComponentProperties?.showMoreConfig\"\n      [wrapperClass]=\"skyComponentProperties?.wrapperClass\"\n      (searchAsync)=\"skyComponentProperties?.searchAsync?.($event)\"\n      (addClick)=\"skyComponentProperties?.addClick?.($event)\"\n      (openChange)=\"onLookupOpenChange($event)\"\n    />\n  </sky-input-box>\n}\n@if (isAlive && !useAsyncSearch) {\n  <sky-input-box\n    [disabled]=\"skyComponentProperties?.disabled\"\n    [formGroup]=\"editorForm\"\n  >\n    <sky-lookup\n      formControlName=\"selection\"\n      [ariaLabelledBy]=\"\n        skyComponentProperties?.ariaLabelledBy ?? screenReaderLabel.id\n      \"\n      [autocompleteAttribute]=\"skyComponentProperties?.autocompleteAttribute\"\n      [data]=\"skyComponentProperties?.data\"\n      [debounceTime]=\"skyComponentProperties?.debounceTime\"\n      [descriptorProperty]=\"skyComponentProperties?.descriptorProperty\"\n      [enableShowMore]=\"skyComponentProperties?.enableShowMore\"\n      [idProperty]=\"skyComponentProperties?.idProperty\"\n      [placeholderText]=\"skyComponentProperties?.placeholderText\"\n      [propertiesToSearch]=\"skyComponentProperties?.propertiesToSearch\"\n      [search]=\"skyComponentProperties?.search\"\n      [searchFilters]=\"skyComponentProperties?.searchFilters\"\n      [searchResultsLimit]=\"skyComponentProperties?.searchResultsLimit\"\n      [searchResultTemplate]=\"skyComponentProperties?.searchResultTemplate\"\n      [searchTextMinimumCharacters]=\"\n        skyComponentProperties?.searchTextMinimumCharacters\n      \"\n      [selectMode]=\"skyComponentProperties?.selectMode\"\n      [showAddButton]=\"skyComponentProperties?.showAddButton\"\n      [showMoreConfig]=\"skyComponentProperties?.showMoreConfig\"\n      [wrapperClass]=\"skyComponentProperties?.wrapperClass\"\n      (addClick)=\"skyComponentProperties?.addClick?.($event)\"\n      (openChange)=\"onLookupOpenChange($event)\"\n    />\n  </sky-input-box>\n}\n<div #screenReaderLabel=\"skyId\" class=\"sky-screen-reader-only\" skyId>\n  {{ labelText }}\n</div>\n", styles: [":host{display:block}\n"], dependencies: [{ kind: "directive", type: i1$3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$3.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$3.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$3.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "directive", type: i1.λ2, selector: "[skyId]", exportAs: ["skyId"] }, { kind: "component", type: i3$1.λ10, selector: "sky-input-box", inputs: ["hasErrors", "disabled", "labelText", "characterLimit", "stacked", "helpPopoverTitle", "helpPopoverContent", "helpKey", "hintText"] }, { kind: "component", type: i2$1.λ4, selector: "sky-lookup", inputs: ["ariaLabel", "ariaLabelledBy", "autocompleteAttribute", "data", "disabled", "required", "enableShowMore", "placeholderText", "idProperty", "showAddButton", "showMoreConfig", "selectMode", "wrapperClass"], outputs: ["addClick", "openChange"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: SkyAgGridCellEditorLookupComponent, decorators: [{
             type: Component,
@@ -1806,7 +1831,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImpo
                 args: ['style.width.px']
             }], onBlur: [{
                 type: HostListener,
-                args: ['blur']
+                args: ['focusout', ['$event']]
             }] } });
 
 class SkyAgGridCellEditorLookupModule {
@@ -1843,6 +1868,14 @@ class SkyAgGridCellEditorNumberComponent {
             number: new UntypedFormControl(),
         });
     }
+    onFocusOut(event) {
+        if (event.relatedTarget &&
+            event.relatedTarget === this.#params?.eGridCell) {
+            // If focus is being set to the grid cell, schedule focus on the input.
+            // This happens when the refreshCells API is called.
+            this.afterGuiAttached();
+        }
+    }
     #params;
     #triggerType;
     /**
@@ -1879,12 +1912,15 @@ class SkyAgGridCellEditorNumberComponent {
      * afterGuiAttached is called by agGrid after the editor is rendered in the DOM. Once it is attached the editor is ready to be focused on.
      */
     afterGuiAttached() {
-        if (this.input) {
-            this.input.nativeElement.focus();
-            if (this.#triggerType === SkyAgGridCellEditorInitialAction.Highlighted) {
-                this.input.nativeElement.select();
+        // AG Grid sets focus to the cell via setTimeout, and this queues the input to focus after that.
+        setTimeout(() => {
+            if (this.input) {
+                this.input.nativeElement.focus();
+                if (this.#triggerType === SkyAgGridCellEditorInitialAction.Highlighted) {
+                    this.input.nativeElement.select();
+                }
             }
-        }
+        });
     }
     /**
      * getValue is called by agGrid when editing is stopped to get the new value of the cell.
@@ -1894,7 +1930,7 @@ class SkyAgGridCellEditorNumberComponent {
         return val !== undefined && val !== null ? val : undefined;
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: SkyAgGridCellEditorNumberComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.13", type: SkyAgGridCellEditorNumberComponent, selector: "sky-ag-grid-cell-editor-number", viewQueries: [{ propertyName: "input", first: true, predicate: ["skyCellEditorNumber"], descendants: true, read: ElementRef }], ngImport: i0, template: "<ng-container [formGroup]=\"editorForm\">\n  <input\n    #skyCellEditorNumber\n    formControlName=\"number\"\n    type=\"number\"\n    [attr.aria-label]=\"\n      'sky_ag_grid_cell_editor_number_aria_label'\n        | skyLibResources: columnHeader : rowNumber\n    \"\n    [style.width.px]=\"columnWidth\"\n    [style.height.px]=\"rowHeightWithoutBorders\"\n    [max]=\"max ?? null\"\n    [min]=\"min ?? null\"\n  />\n</ng-container>\n", styles: ["input{border:none;text-align:right}\n"], dependencies: [{ kind: "directive", type: i1$3.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$3.NumberValueAccessor, selector: "input[type=number][formControlName],input[type=number][formControl],input[type=number][ngModel]" }, { kind: "directive", type: i1$3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$3.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$3.MinValidator, selector: "input[type=number][min][formControlName],input[type=number][min][formControl],input[type=number][min][ngModel]", inputs: ["min"] }, { kind: "directive", type: i1$3.MaxValidator, selector: "input[type=number][max][formControlName],input[type=number][max][formControl],input[type=number][max][ngModel]", inputs: ["max"] }, { kind: "directive", type: i1$3.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$3.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "pipe", type: i3.SkyLibResourcesPipe, name: "skyLibResources" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.13", type: SkyAgGridCellEditorNumberComponent, selector: "sky-ag-grid-cell-editor-number", host: { listeners: { "focusout": "onFocusOut($event)" } }, viewQueries: [{ propertyName: "input", first: true, predicate: ["skyCellEditorNumber"], descendants: true, read: ElementRef }], ngImport: i0, template: "<ng-container [formGroup]=\"editorForm\">\n  <input\n    #skyCellEditorNumber\n    formControlName=\"number\"\n    type=\"number\"\n    [attr.aria-label]=\"\n      'sky_ag_grid_cell_editor_number_aria_label'\n        | skyLibResources: columnHeader : rowNumber\n    \"\n    [style.width.px]=\"columnWidth\"\n    [style.height.px]=\"rowHeightWithoutBorders\"\n    [max]=\"max ?? null\"\n    [min]=\"min ?? null\"\n  />\n</ng-container>\n", styles: ["input{border:none;text-align:right}\n"], dependencies: [{ kind: "directive", type: i1$3.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$3.NumberValueAccessor, selector: "input[type=number][formControlName],input[type=number][formControl],input[type=number][ngModel]" }, { kind: "directive", type: i1$3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$3.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$3.MinValidator, selector: "input[type=number][min][formControlName],input[type=number][min][formControl],input[type=number][min][ngModel]", inputs: ["min"] }, { kind: "directive", type: i1$3.MaxValidator, selector: "input[type=number][max][formControlName],input[type=number][max][formControl],input[type=number][max][ngModel]", inputs: ["max"] }, { kind: "directive", type: i1$3.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$3.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "pipe", type: i3.SkyLibResourcesPipe, name: "skyLibResources" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: SkyAgGridCellEditorNumberComponent, decorators: [{
             type: Component,
@@ -1902,6 +1938,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImpo
         }], propDecorators: { input: [{
                 type: ViewChild,
                 args: ['skyCellEditorNumber', { read: ElementRef }]
+            }], onFocusOut: [{
+                type: HostListener,
+                args: ['focusout', ['$event']]
             }] } });
 
 class SkyAgGridCellEditorNumberModule {
@@ -1927,6 +1966,14 @@ class SkyAgGridCellEditorTextComponent {
             text: new UntypedFormControl(),
         });
     }
+    onFocusOut(event) {
+        if (event.relatedTarget &&
+            event.relatedTarget === this.#params?.eGridCell) {
+            // If focus is being set to the grid cell, schedule focus on the input.
+            // This happens when the refreshCells API is called.
+            this.afterGuiAttached();
+        }
+    }
     #params;
     #triggerType;
     /**
@@ -1979,7 +2026,7 @@ class SkyAgGridCellEditorTextComponent {
         return this.editorForm.get('text')?.value || undefined;
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: SkyAgGridCellEditorTextComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.13", type: SkyAgGridCellEditorTextComponent, selector: "sky-ag-grid-cell-editor-text", viewQueries: [{ propertyName: "input", first: true, predicate: ["skyCellEditorText"], descendants: true, read: ElementRef }], ngImport: i0, template: "<ng-container [formGroup]=\"editorForm\">\n  <input\n    #skyCellEditorText\n    formControlName=\"text\"\n    type=\"text\"\n    [attr.aria-label]=\"\n      'sky_ag_grid_cell_editor_text_aria_label'\n        | skyLibResources: columnHeader : rowNumber\n    \"\n    [style.width.px]=\"columnWidth\"\n    [style.height.px]=\"rowHeightWithoutBorders\"\n    [maxlength]=\"maxlength ?? null\"\n  />\n</ng-container>\n", styles: ["input{border:none;padding-left:11px}\n"], dependencies: [{ kind: "directive", type: i1$3.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$3.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$3.MaxLengthValidator, selector: "[maxlength][formControlName],[maxlength][formControl],[maxlength][ngModel]", inputs: ["maxlength"] }, { kind: "directive", type: i1$3.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$3.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "pipe", type: i3.SkyLibResourcesPipe, name: "skyLibResources" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.13", type: SkyAgGridCellEditorTextComponent, selector: "sky-ag-grid-cell-editor-text", host: { listeners: { "focusout": "onFocusOut($event)" } }, viewQueries: [{ propertyName: "input", first: true, predicate: ["skyCellEditorText"], descendants: true, read: ElementRef }], ngImport: i0, template: "<ng-container [formGroup]=\"editorForm\">\n  <input\n    #skyCellEditorText\n    formControlName=\"text\"\n    type=\"text\"\n    [attr.aria-label]=\"\n      'sky_ag_grid_cell_editor_text_aria_label'\n        | skyLibResources: columnHeader : rowNumber\n    \"\n    [style.width.px]=\"columnWidth\"\n    [style.height.px]=\"rowHeightWithoutBorders\"\n    [maxlength]=\"maxlength ?? null\"\n  />\n</ng-container>\n", styles: ["input{border:none;padding-left:11px}\n"], dependencies: [{ kind: "directive", type: i1$3.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$3.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$3.MaxLengthValidator, selector: "[maxlength][formControlName],[maxlength][formControl],[maxlength][ngModel]", inputs: ["maxlength"] }, { kind: "directive", type: i1$3.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$3.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "pipe", type: i3.SkyLibResourcesPipe, name: "skyLibResources" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: SkyAgGridCellEditorTextComponent, decorators: [{
             type: Component,
@@ -1987,6 +2034,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImpo
         }], propDecorators: { input: [{
                 type: ViewChild,
                 args: ['skyCellEditorText', { read: ElementRef }]
+            }], onFocusOut: [{
+                type: HostListener,
+                args: ['focusout', ['$event']]
             }] } });
 
 class SkyAgGridCellEditorTextModule {