@skyux/ag-grid 6.2.3 → 6.3.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (34) hide show
  1. package/documentation.json +520 -329
  2. package/esm2020/index.mjs +3 -1
  3. package/esm2020/lib/modules/ag-grid/cell-editors/cell-editor-autocomplete/cell-editor-autocomplete.component.mjs +38 -5
  4. package/esm2020/lib/modules/ag-grid/cell-editors/cell-editor-autocomplete/cell-editor-autocomplete.module.mjs +15 -5
  5. package/esm2020/lib/modules/ag-grid/cell-editors/cell-editor-currency/cell-editor-currency.component.mjs +44 -9
  6. package/esm2020/lib/modules/ag-grid/cell-editors/cell-editor-currency/cell-editor-currency.module.mjs +15 -5
  7. package/esm2020/lib/modules/ag-grid/cell-editors/cell-editor-datepicker/cell-editor-datepicker.component.mjs +60 -13
  8. package/esm2020/lib/modules/ag-grid/cell-editors/cell-editor-datepicker/cell-editor-datepicker.module.mjs +5 -5
  9. package/esm2020/lib/modules/ag-grid/cell-editors/cell-editor-lookup/cell-editor-lookup.component.mjs +37 -10
  10. package/esm2020/lib/modules/ag-grid/cell-editors/cell-editor-number/cell-editor-number.component.mjs +35 -5
  11. package/esm2020/lib/modules/ag-grid/cell-editors/cell-editor-number/cell-editor-number.module.mjs +5 -5
  12. package/esm2020/lib/modules/ag-grid/cell-editors/cell-editor-text/cell-editor-text.component.mjs +34 -5
  13. package/esm2020/lib/modules/ag-grid/cell-editors/cell-editor-text/cell-editor-text.module.mjs +5 -5
  14. package/esm2020/lib/modules/ag-grid/types/cell-editor-initial-action.mjs +13 -0
  15. package/esm2020/lib/modules/ag-grid/types/cell-editor-utils.mjs +31 -0
  16. package/fesm2015/skyux-ag-grid.mjs +300 -62
  17. package/fesm2015/skyux-ag-grid.mjs.map +1 -1
  18. package/fesm2020/skyux-ag-grid.mjs +298 -59
  19. package/fesm2020/skyux-ag-grid.mjs.map +1 -1
  20. package/index.d.ts +2 -0
  21. package/lib/modules/ag-grid/cell-editors/cell-editor-autocomplete/cell-editor-autocomplete.component.d.ts +4 -2
  22. package/lib/modules/ag-grid/cell-editors/cell-editor-autocomplete/cell-editor-autocomplete.module.d.ts +1 -1
  23. package/lib/modules/ag-grid/cell-editors/cell-editor-currency/cell-editor-currency.component.d.ts +8 -3
  24. package/lib/modules/ag-grid/cell-editors/cell-editor-currency/cell-editor-currency.module.d.ts +1 -1
  25. package/lib/modules/ag-grid/cell-editors/cell-editor-datepicker/cell-editor-datepicker.component.d.ts +7 -4
  26. package/lib/modules/ag-grid/cell-editors/cell-editor-datepicker/cell-editor-datepicker.module.d.ts +1 -1
  27. package/lib/modules/ag-grid/cell-editors/cell-editor-lookup/cell-editor-lookup.component.d.ts +2 -1
  28. package/lib/modules/ag-grid/cell-editors/cell-editor-number/cell-editor-number.component.d.ts +4 -2
  29. package/lib/modules/ag-grid/cell-editors/cell-editor-number/cell-editor-number.module.d.ts +1 -1
  30. package/lib/modules/ag-grid/cell-editors/cell-editor-text/cell-editor-text.component.d.ts +4 -2
  31. package/lib/modules/ag-grid/cell-editors/cell-editor-text/cell-editor-text.module.d.ts +1 -1
  32. package/lib/modules/ag-grid/types/cell-editor-initial-action.d.ts +11 -0
  33. package/lib/modules/ag-grid/types/cell-editor-utils.d.ts +9 -0
  34. package/package.json +12 -12
@@ -9,20 +9,21 @@ import { SkyDataManagerModule } from '@skyux/data-manager';
9
9
  import * as i1$2 from '@skyux/layout';
10
10
  import { SkyInlineDeleteModule } from '@skyux/layout';
11
11
  import { AgGridAngular, AgGridModule } from 'ag-grid-angular';
12
- import { Subject } from 'rxjs';
13
- import { takeUntil, filter } from 'rxjs/operators';
12
+ import { Subject, fromEvent } from 'rxjs';
13
+ import { takeUntil, filter, first } from 'rxjs/operators';
14
14
  import * as i1$4 from '@angular/forms';
15
- import { FormsModule, FormGroup, FormControl, ReactiveFormsModule } from '@angular/forms';
15
+ import { FormGroup, FormControl, ReactiveFormsModule, FormsModule } from '@angular/forms';
16
16
  import * as i1$3 from '@skyux/lookup';
17
17
  import { SkyAutocompleteModule, SkyLookupModule } from '@skyux/lookup';
18
18
  import * as i3$1 from '@skyux/i18n';
19
19
  import { getLibStringForLocale, SkyI18nModule, SKY_LIB_RESOURCES_PROVIDERS } from '@skyux/i18n';
20
+ import { __classPrivateFieldSet, __classPrivateFieldGet } from 'tslib';
21
+ import { KeyCode, PopupComponent, Events, RowNode } from 'ag-grid-community';
20
22
  import * as i2 from '@skyux/autonumeric';
21
23
  import { SkyAutonumericModule } from '@skyux/autonumeric';
22
24
  import * as i2$1 from '@skyux/datetime';
23
25
  import { SkyDatepickerModule } from '@skyux/datetime';
24
26
  import * as i1$5 from '@skyux/theme';
25
- import { PopupComponent, Events, RowNode } from 'ag-grid-community';
26
27
  import * as i1$6 from '@skyux/forms';
27
28
  import { SkyInputBoxModule, SkyCheckboxModule } from '@skyux/forms';
28
29
  import * as i1$7 from '@skyux/indicators';
@@ -725,32 +726,103 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.2", ngImpor
725
726
  }]
726
727
  }] });
727
728
 
729
+ /** The intiial action that a cell editor should take when initialized. */
730
+ var SkyAgGridCellEditorInitialAction;
731
+ (function (SkyAgGridCellEditorInitialAction) {
732
+ /** The cell should be cleared. */
733
+ SkyAgGridCellEditorInitialAction[SkyAgGridCellEditorInitialAction["Delete"] = 0] = "Delete";
734
+ /** The cell value should be highlighted. */
735
+ SkyAgGridCellEditorInitialAction[SkyAgGridCellEditorInitialAction["Highlighted"] = 1] = "Highlighted";
736
+ /** The cell value should be replaced with the initializing value. */
737
+ SkyAgGridCellEditorInitialAction[SkyAgGridCellEditorInitialAction["Replace"] = 2] = "Replace";
738
+ /** The cell should not be modified and the cursor is placed at the end of the value. */
739
+ SkyAgGridCellEditorInitialAction[SkyAgGridCellEditorInitialAction["Untouched"] = 3] = "Untouched";
740
+ })(SkyAgGridCellEditorInitialAction || (SkyAgGridCellEditorInitialAction = {}));
741
+
742
+ class SkyAgGridCellEditorUtils {
743
+ /**
744
+ * Gets the intiial action that a cell editor should take when initialized.
745
+ * @param params The editor's initializing parameters.
746
+ */
747
+ static getEditorInitialAction(params) {
748
+ if (params.cellStartedEdit) {
749
+ if (params.eventKey === KeyCode.BACKSPACE ||
750
+ params.eventKey === KeyCode.DELETE) {
751
+ return SkyAgGridCellEditorInitialAction.Delete;
752
+ }
753
+ else if (params.charPress) {
754
+ return SkyAgGridCellEditorInitialAction.Replace;
755
+ }
756
+ else {
757
+ if (params.eventKey !== KeyCode.F2) {
758
+ return SkyAgGridCellEditorInitialAction.Highlighted;
759
+ }
760
+ else {
761
+ return SkyAgGridCellEditorInitialAction.Untouched;
762
+ }
763
+ }
764
+ }
765
+ else {
766
+ return SkyAgGridCellEditorInitialAction.Untouched;
767
+ }
768
+ }
769
+ }
770
+
771
+ var _SkyAgGridCellEditorAutocompleteComponent_triggerType;
728
772
  /**
729
773
  * @internal
730
774
  */
731
775
  class SkyAgGridCellEditorAutocompleteComponent {
732
776
  constructor() {
777
+ this.editorForm = new FormGroup({
778
+ selection: new FormControl(),
779
+ });
733
780
  this.skyComponentProperties = {};
781
+ _SkyAgGridCellEditorAutocompleteComponent_triggerType.set(this, void 0);
734
782
  }
735
783
  agInit(params) {
736
784
  this.params = params;
737
- this.currentSelection = this.params.value;
785
+ __classPrivateFieldSet(this, _SkyAgGridCellEditorAutocompleteComponent_triggerType, SkyAgGridCellEditorUtils.getEditorInitialAction(params), "f");
786
+ const control = this.editorForm.get('selection');
787
+ switch (__classPrivateFieldGet(this, _SkyAgGridCellEditorAutocompleteComponent_triggerType, "f")) {
788
+ case SkyAgGridCellEditorInitialAction.Delete:
789
+ control.setValue(undefined);
790
+ break;
791
+ case SkyAgGridCellEditorInitialAction.Replace:
792
+ case SkyAgGridCellEditorInitialAction.Highlighted:
793
+ case SkyAgGridCellEditorInitialAction.Untouched:
794
+ default:
795
+ control.setValue(params.value);
796
+ break;
797
+ }
738
798
  this.columnHeader = this.params.colDef && this.params.colDef.headerName;
739
799
  this.rowNumber = this.params.rowIndex + 1;
740
800
  this.skyComponentProperties = this.params.skyComponentProperties || {};
741
801
  }
742
802
  afterGuiAttached() {
743
803
  this.input.nativeElement.focus();
804
+ if (__classPrivateFieldGet(this, _SkyAgGridCellEditorAutocompleteComponent_triggerType, "f") === SkyAgGridCellEditorInitialAction.Replace) {
805
+ this.input.nativeElement.select();
806
+ this.input.nativeElement.setRangeText(this.params.charPress);
807
+ // Ensure the cursor is at the end of the text.
808
+ this.input.nativeElement.setSelectionRange(this.params.charPress.length, this.params.charPress.length);
809
+ this.input.nativeElement.dispatchEvent(new Event('input'));
810
+ }
811
+ if (__classPrivateFieldGet(this, _SkyAgGridCellEditorAutocompleteComponent_triggerType, "f") === SkyAgGridCellEditorInitialAction.Highlighted) {
812
+ this.input.nativeElement.select();
813
+ }
744
814
  }
745
815
  getValue() {
746
- return this.currentSelection;
816
+ const val = this.editorForm.get('selection').value;
817
+ return val !== undefined && val !== null ? val : undefined;
747
818
  }
748
819
  }
820
+ _SkyAgGridCellEditorAutocompleteComponent_triggerType = new WeakMap();
749
821
  SkyAgGridCellEditorAutocompleteComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: SkyAgGridCellEditorAutocompleteComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
750
- SkyAgGridCellEditorAutocompleteComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.2", type: SkyAgGridCellEditorAutocompleteComponent, selector: "sky-ag-grid-cell-editor-autocomplete", viewQueries: [{ propertyName: "input", first: true, predicate: ["skyCellEditorAutocomplete"], descendants: true, read: ElementRef }], ngImport: i0, template: "<div class=\"sky-ag-grid-cell-editor-autocomplete\">\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 >\n <input\n skyAutocomplete\n #skyCellEditorAutocomplete\n type=\"text\"\n [(ngModel)]=\"currentSelection\"\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"], components: [{ type: i1$3.λ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"] }], directives: [{ type: i1$3.λ1, selector: "input[skyAutocomplete], textarea[skyAutocomplete]", inputs: ["autocompleteAttribute", "disabled"] }, { type: i1$4.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { type: i1$4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i1$4.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }], pipes: { "skyLibResources": i3$1.SkyLibResourcesPipe }, changeDetection: i0.ChangeDetectionStrategy.OnPush });
822
+ SkyAgGridCellEditorAutocompleteComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.2", type: SkyAgGridCellEditorAutocompleteComponent, selector: "sky-ag-grid-cell-editor-autocomplete", 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 >\n <input\n formControlName=\"selection\"\n skyAutocomplete\n #skyCellEditorAutocomplete\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"], components: [{ type: i1$3.λ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"] }], directives: [{ type: i1$4.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { type: i1$4.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { type: i1$4.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { type: i1$3.λ1, selector: "input[skyAutocomplete], textarea[skyAutocomplete]", inputs: ["autocompleteAttribute", "disabled"] }, { type: i1$4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i1$4.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }], pipes: { "skyLibResources": i3$1.SkyLibResourcesPipe }, changeDetection: i0.ChangeDetectionStrategy.OnPush });
751
823
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: SkyAgGridCellEditorAutocompleteComponent, decorators: [{
752
824
  type: Component,
753
- args: [{ selector: 'sky-ag-grid-cell-editor-autocomplete', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"sky-ag-grid-cell-editor-autocomplete\">\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 >\n <input\n skyAutocomplete\n #skyCellEditorAutocomplete\n type=\"text\"\n [(ngModel)]=\"currentSelection\"\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"] }]
825
+ args: [{ selector: 'sky-ag-grid-cell-editor-autocomplete', changeDetection: ChangeDetectionStrategy.OnPush, 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 >\n <input\n formControlName=\"selection\"\n skyAutocomplete\n #skyCellEditorAutocomplete\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"] }]
754
826
  }], propDecorators: { input: [{
755
827
  type: ViewChild,
756
828
  args: ['skyCellEditorAutocomplete', { read: ElementRef }]
@@ -759,23 +831,39 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.2", ngImpor
759
831
  class SkyAgGridCellEditorAutocompleteModule {
760
832
  }
761
833
  SkyAgGridCellEditorAutocompleteModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: SkyAgGridCellEditorAutocompleteModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
762
- SkyAgGridCellEditorAutocompleteModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: SkyAgGridCellEditorAutocompleteModule, declarations: [SkyAgGridCellEditorAutocompleteComponent], imports: [FormsModule, SkyAgGridResourcesModule, SkyAutocompleteModule], exports: [SkyAgGridCellEditorAutocompleteComponent] });
763
- SkyAgGridCellEditorAutocompleteModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: SkyAgGridCellEditorAutocompleteModule, imports: [[FormsModule, SkyAgGridResourcesModule, SkyAutocompleteModule]] });
834
+ SkyAgGridCellEditorAutocompleteModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: SkyAgGridCellEditorAutocompleteModule, declarations: [SkyAgGridCellEditorAutocompleteComponent], imports: [ReactiveFormsModule,
835
+ SkyAgGridResourcesModule,
836
+ SkyAutocompleteModule], exports: [SkyAgGridCellEditorAutocompleteComponent] });
837
+ SkyAgGridCellEditorAutocompleteModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: SkyAgGridCellEditorAutocompleteModule, imports: [[
838
+ ReactiveFormsModule,
839
+ SkyAgGridResourcesModule,
840
+ SkyAutocompleteModule,
841
+ ]] });
764
842
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: SkyAgGridCellEditorAutocompleteModule, decorators: [{
765
843
  type: NgModule,
766
844
  args: [{
767
- imports: [FormsModule, SkyAgGridResourcesModule, SkyAutocompleteModule],
845
+ imports: [
846
+ ReactiveFormsModule,
847
+ SkyAgGridResourcesModule,
848
+ SkyAutocompleteModule,
849
+ ],
768
850
  declarations: [SkyAgGridCellEditorAutocompleteComponent],
769
851
  exports: [SkyAgGridCellEditorAutocompleteComponent],
770
852
  }]
771
853
  }] });
772
854
 
855
+ var _SkyAgGridCellEditorCurrencyComponent_triggerType;
773
856
  /**
774
857
  * @internal
775
858
  */
776
859
  class SkyAgGridCellEditorCurrencyComponent {
777
- constructor() {
860
+ constructor(changeDetector) {
861
+ this.changeDetector = changeDetector;
778
862
  this.skyComponentProperties = {};
863
+ this.editorForm = new FormGroup({
864
+ currency: new FormControl(),
865
+ });
866
+ _SkyAgGridCellEditorCurrencyComponent_triggerType.set(this, void 0);
779
867
  }
780
868
  /**
781
869
  * agInit is called by agGrid once after the editor is created and provides the editor with the information it needs.
@@ -783,7 +871,6 @@ class SkyAgGridCellEditorCurrencyComponent {
783
871
  */
784
872
  agInit(params) {
785
873
  this.params = params;
786
- this.value = this.params.value;
787
874
  this.columnHeader = this.params.colDef.headerName;
788
875
  this.rowNumber = this.params.rowIndex + 1;
789
876
  this.columnWidth = this.params.column.getActualWidth();
@@ -799,12 +886,37 @@ class SkyAgGridCellEditorCurrencyComponent {
799
886
  */
800
887
  afterGuiAttached() {
801
888
  this.input.nativeElement.focus();
889
+ // This setup is in `afterGuiAttached` due to the lifecycle of autonumeric which will highlight the initial value if it is in place when it renders.
890
+ // Since we don't want that, we set the initial value after autonumeric initializes.
891
+ __classPrivateFieldSet(this, _SkyAgGridCellEditorCurrencyComponent_triggerType, SkyAgGridCellEditorUtils.getEditorInitialAction(this.params), "f");
892
+ const control = this.editorForm.get('currency');
893
+ switch (__classPrivateFieldGet(this, _SkyAgGridCellEditorCurrencyComponent_triggerType, "f")) {
894
+ case SkyAgGridCellEditorInitialAction.Delete:
895
+ control.setValue(undefined);
896
+ break;
897
+ case SkyAgGridCellEditorInitialAction.Replace:
898
+ control.setValue(parseFloat(this.params.charPress) || undefined);
899
+ break;
900
+ case SkyAgGridCellEditorInitialAction.Highlighted:
901
+ case SkyAgGridCellEditorInitialAction.Untouched:
902
+ default:
903
+ control.setValue(parseFloat(this.params.value));
904
+ break;
905
+ }
906
+ this.changeDetector.markForCheck();
907
+ // Without the `setTimeout` there is inconsistent behavior with the highlighting when no initial value is present.
908
+ setTimeout(() => {
909
+ if (__classPrivateFieldGet(this, _SkyAgGridCellEditorCurrencyComponent_triggerType, "f") === SkyAgGridCellEditorInitialAction.Highlighted) {
910
+ this.input.nativeElement.select();
911
+ }
912
+ }, 100);
802
913
  }
803
914
  /**
804
915
  * getValue is called by agGrid when editing is stopped to get the new value of the cell.
805
916
  */
806
917
  getValue() {
807
- return this.value;
918
+ const val = this.editorForm.get('currency').value;
919
+ return val !== undefined && val !== null ? val : undefined;
808
920
  }
809
921
  /**
810
922
  * The autoNumeric library's event handler suppresses the escape key event. This additional handler re-enables AG Grid's default functionality.
@@ -814,12 +926,13 @@ class SkyAgGridCellEditorCurrencyComponent {
814
926
  this.params.api.setFocusedCell(this.params.rowIndex, this.params.column);
815
927
  }
816
928
  }
817
- SkyAgGridCellEditorCurrencyComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: SkyAgGridCellEditorCurrencyComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
818
- SkyAgGridCellEditorCurrencyComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.2", type: SkyAgGridCellEditorCurrencyComponent, selector: "sky-ag-grid-cell-editor-currency", viewQueries: [{ propertyName: "input", first: true, predicate: ["skyCellEditorCurrency"], descendants: true, read: ElementRef }], ngImport: i0, template: "<input\n type=\"text\"\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 [(ngModel)]=\"value\"\n [skyAutonumeric]=\"skyComponentProperties\"\n (keyup.escape)=\"onPressEscape()\"\n #skyCellEditorCurrency\n/>\n", styles: ["input{border:none;padding-left:11px}\n"], directives: [{ type: i1$4.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { type: i2.λ1, selector: "input[skyAutonumeric]", inputs: ["skyAutonumeric"] }, { type: i1$4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i1$4.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }], pipes: { "skyLibResources": i3$1.SkyLibResourcesPipe }, changeDetection: i0.ChangeDetectionStrategy.OnPush });
929
+ _SkyAgGridCellEditorCurrencyComponent_triggerType = new WeakMap();
930
+ SkyAgGridCellEditorCurrencyComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: SkyAgGridCellEditorCurrencyComponent, deps: [{ token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
931
+ SkyAgGridCellEditorCurrencyComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.2", 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 formControlName=\"currency\"\n type=\"text\"\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?.charPress\"\n (keyup.escape)=\"onPressEscape()\"\n #skyCellEditorCurrency\n />\n</ng-container>\n", styles: ["input{border:none;padding-left:11px}\n"], directives: [{ type: i1$4.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { type: i1$4.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { type: i1$4.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { type: i2.λ1, selector: "input[skyAutonumeric]", inputs: ["skyAutonumeric", "skyAutonumericFormChangesUnformatted"] }, { type: i1$4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i1$4.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }], pipes: { "skyLibResources": i3$1.SkyLibResourcesPipe }, changeDetection: i0.ChangeDetectionStrategy.OnPush });
819
932
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: SkyAgGridCellEditorCurrencyComponent, decorators: [{
820
933
  type: Component,
821
- args: [{ selector: 'sky-ag-grid-cell-editor-currency', changeDetection: ChangeDetectionStrategy.OnPush, template: "<input\n type=\"text\"\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 [(ngModel)]=\"value\"\n [skyAutonumeric]=\"skyComponentProperties\"\n (keyup.escape)=\"onPressEscape()\"\n #skyCellEditorCurrency\n/>\n", styles: ["input{border:none;padding-left:11px}\n"] }]
822
- }], propDecorators: { input: [{
934
+ args: [{ selector: 'sky-ag-grid-cell-editor-currency', changeDetection: ChangeDetectionStrategy.OnPush, template: "<ng-container [formGroup]=\"editorForm\">\n <input\n formControlName=\"currency\"\n type=\"text\"\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?.charPress\"\n (keyup.escape)=\"onPressEscape()\"\n #skyCellEditorCurrency\n />\n</ng-container>\n", styles: ["input{border:none;padding-left:11px}\n"] }]
935
+ }], ctorParameters: function () { return [{ type: i0.ChangeDetectorRef }]; }, propDecorators: { input: [{
823
936
  type: ViewChild,
824
937
  args: ['skyCellEditorCurrency', { read: ElementRef }]
825
938
  }] } });
@@ -827,25 +940,41 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.2", ngImpor
827
940
  class SkyAgGridCellEditorCurrencyModule {
828
941
  }
829
942
  SkyAgGridCellEditorCurrencyModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: SkyAgGridCellEditorCurrencyModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
830
- SkyAgGridCellEditorCurrencyModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: SkyAgGridCellEditorCurrencyModule, declarations: [SkyAgGridCellEditorCurrencyComponent], imports: [SkyAgGridResourcesModule, FormsModule, SkyAutonumericModule], exports: [SkyAgGridCellEditorCurrencyComponent] });
831
- SkyAgGridCellEditorCurrencyModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: SkyAgGridCellEditorCurrencyModule, imports: [[SkyAgGridResourcesModule, FormsModule, SkyAutonumericModule]] });
943
+ SkyAgGridCellEditorCurrencyModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: SkyAgGridCellEditorCurrencyModule, declarations: [SkyAgGridCellEditorCurrencyComponent], imports: [SkyAgGridResourcesModule,
944
+ ReactiveFormsModule,
945
+ SkyAutonumericModule], exports: [SkyAgGridCellEditorCurrencyComponent] });
946
+ SkyAgGridCellEditorCurrencyModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: SkyAgGridCellEditorCurrencyModule, imports: [[
947
+ SkyAgGridResourcesModule,
948
+ ReactiveFormsModule,
949
+ SkyAutonumericModule,
950
+ ]] });
832
951
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: SkyAgGridCellEditorCurrencyModule, decorators: [{
833
952
  type: NgModule,
834
953
  args: [{
835
- imports: [SkyAgGridResourcesModule, FormsModule, SkyAutonumericModule],
954
+ imports: [
955
+ SkyAgGridResourcesModule,
956
+ ReactiveFormsModule,
957
+ SkyAutonumericModule,
958
+ ],
836
959
  declarations: [SkyAgGridCellEditorCurrencyComponent],
837
960
  exports: [SkyAgGridCellEditorCurrencyComponent],
838
961
  }]
839
962
  }] });
840
963
 
964
+ var _SkyAgGridCellEditorDatepickerComponent_triggerType;
841
965
  /**
842
966
  * @internal
843
967
  */
844
968
  class SkyAgGridCellEditorDatepickerComponent extends PopupComponent {
845
- constructor(themeSvc) {
969
+ constructor(changeDetector, themeSvc) {
846
970
  super();
971
+ this.changeDetector = changeDetector;
847
972
  this.themeSvc = themeSvc;
973
+ this.editorForm = new FormGroup({
974
+ date: new FormControl(),
975
+ });
848
976
  this.skyComponentProperties = {};
977
+ _SkyAgGridCellEditorDatepickerComponent_triggerType.set(this, void 0);
849
978
  }
850
979
  /**
851
980
  * agInit is called by agGrid once after the editor is created and provides the editor with the information it needs.
@@ -853,7 +982,25 @@ class SkyAgGridCellEditorDatepickerComponent extends PopupComponent {
853
982
  */
854
983
  agInit(params) {
855
984
  this.params = params;
856
- this.currentDate = this.params.value;
985
+ __classPrivateFieldSet(this, _SkyAgGridCellEditorDatepickerComponent_triggerType, SkyAgGridCellEditorUtils.getEditorInitialAction(params), "f");
986
+ const control = this.editorForm.get('date');
987
+ switch (__classPrivateFieldGet(this, _SkyAgGridCellEditorDatepickerComponent_triggerType, "f")) {
988
+ case SkyAgGridCellEditorInitialAction.Delete:
989
+ control.setValue(undefined);
990
+ break;
991
+ case SkyAgGridCellEditorInitialAction.Replace:
992
+ control.setValue(params.charPress);
993
+ break;
994
+ case SkyAgGridCellEditorInitialAction.Highlighted:
995
+ case SkyAgGridCellEditorInitialAction.Untouched:
996
+ default:
997
+ control.setValue(params.value);
998
+ break;
999
+ }
1000
+ if (this.params.skyComponentProperties?.disabled) {
1001
+ control.disable();
1002
+ }
1003
+ this.changeDetector.markForCheck();
857
1004
  this.skyComponentProperties = this.params.skyComponentProperties || {};
858
1005
  this.columnWidth = this.params.column.getActualWidth();
859
1006
  this.columnWidthWithoutBorders = this.columnWidth - 2;
@@ -876,25 +1023,42 @@ class SkyAgGridCellEditorDatepickerComponent extends PopupComponent {
876
1023
  * 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.
877
1024
  */
878
1025
  afterGuiAttached() {
879
- this.focusOnDatepickerInput();
1026
+ const datepickerInputEl = this.datepickerInput
1027
+ .nativeElement;
1028
+ datepickerInputEl.focus();
1029
+ // 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.
1030
+ // 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.
1031
+ if (__classPrivateFieldGet(this, _SkyAgGridCellEditorDatepickerComponent_triggerType, "f") === SkyAgGridCellEditorInitialAction.Replace) {
1032
+ fromEvent(datepickerInputEl, 'blur')
1033
+ .pipe(first())
1034
+ .subscribe(() => {
1035
+ datepickerInputEl.dispatchEvent(new Event('change'));
1036
+ });
1037
+ datepickerInputEl.select();
1038
+ datepickerInputEl.setRangeText(this.params.charPress);
1039
+ // Ensure the cursor is at the end of the text.
1040
+ datepickerInputEl.setSelectionRange(this.params.charPress.length, this.params.charPress.length);
1041
+ }
1042
+ // this.changeDetector.markForCheck();
1043
+ if (__classPrivateFieldGet(this, _SkyAgGridCellEditorDatepickerComponent_triggerType, "f") === SkyAgGridCellEditorInitialAction.Highlighted) {
1044
+ datepickerInputEl.select();
1045
+ }
880
1046
  }
881
1047
  /**
882
1048
  * getValue is called by agGrid when editing is stopped to get the new value of the cell.
883
1049
  */
884
1050
  getValue() {
885
1051
  this.datepickerInput.nativeElement.blur();
886
- return this.currentDate;
887
- }
888
- focusOnDatepickerInput() {
889
- this.datepickerInput.nativeElement.focus();
1052
+ return this.editorForm.get('date').value;
890
1053
  }
891
1054
  }
892
- SkyAgGridCellEditorDatepickerComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: SkyAgGridCellEditorDatepickerComponent, deps: [{ token: i1$5.SkyThemeService, optional: true }], target: i0.ɵɵFactoryTarget.Component });
893
- SkyAgGridCellEditorDatepickerComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.2", type: SkyAgGridCellEditorDatepickerComponent, selector: "sky-ag-grid-cell-editor-datepicker", viewQueries: [{ propertyName: "datepickerInput", first: true, predicate: ["skyCellEditorDatepickerInput"], descendants: true, read: ElementRef }], usesInheritance: true, ngImport: i0, template: "<div\n class=\"sky-ag-grid-cell-editor-datepicker\"\n [style.width.px]=\"columnWidthWithoutBorders\"\n>\n <sky-datepicker\n data-sky-id=\"cell-datepicker\"\n pickerClass=\"ag-custom-component-popup\"\n >\n <input\n skyDatepickerInput\n [disabled]=\"skyComponentProperties.disabled\"\n [minDate]=\"skyComponentProperties.minDate\"\n [maxDate]=\"skyComponentProperties.maxDate\"\n [dateFormat]=\"skyComponentProperties.dateFormat\"\n [startingDay]=\"skyComponentProperties.startingDay\"\n [skyDatepickerNoValidate]=\"skyComponentProperties.skyDatepickerNoValidate\"\n [style.height.px]=\"rowHeightWithoutBorders\"\n [(ngModel)]=\"currentDate\"\n #skyCellEditorDatepickerInput\n />\n </sky-datepicker>\n</div>\n", styles: [".sky-ag-grid-cell-editor-datepicker{position:relative;top:1px;left:1px}.sky-ag-grid-cell-editor-datepicker sky-datepicker input.sky-form-control{box-shadow:none;border-width:1px;border-style:solid;border-color:transparent #cdcfd2 transparent transparent}.sky-ag-grid-cell-editor-datepicker sky-datepicker .sky-input-group-datepicker-btn{border-radius:0}:host-context(.sky-theme-modern) .sky-ag-grid-cell-editor-datepicker{position:static;top:initial;left:initial}:host-context(.sky-theme-modern) .sky-ag-grid-cell-editor-datepicker sky-datepicker input.sky-form-control{border-radius:0;border:1px solid #1870B8}:host-context(.sky-theme-modern) .sky-ag-grid-cell-editor-datepicker sky-datepicker input.sky-form-control:focus{border-width:2px!important}.sky-theme-modern .sky-ag-grid-cell-editor-datepicker{position:static;top:initial;left:initial}.sky-theme-modern .sky-ag-grid-cell-editor-datepicker sky-datepicker input.sky-form-control{border-radius:0;border:1px solid #1870B8}.sky-theme-modern .sky-ag-grid-cell-editor-datepicker sky-datepicker input.sky-form-control:focus{border-width:2px!important}\n"], components: [{ type: i2$1.λ2, selector: "sky-datepicker", inputs: ["pickerClass"], outputs: ["calendarDateRangeChange"] }], directives: [{ type: i1$4.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { type: i2$1.λ3, selector: "[skyDatepickerInput]", inputs: ["dateFormat", "disabled", "maxDate", "minDate", "skyDatepickerInput", "skyDatepickerNoValidate", "startingDay", "strict"] }, { type: i1$4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i1$4.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
1055
+ _SkyAgGridCellEditorDatepickerComponent_triggerType = new WeakMap();
1056
+ SkyAgGridCellEditorDatepickerComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: SkyAgGridCellEditorDatepickerComponent, deps: [{ token: i0.ChangeDetectorRef }, { token: i1$5.SkyThemeService, optional: true }], target: i0.ɵɵFactoryTarget.Component });
1057
+ SkyAgGridCellEditorDatepickerComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.2", type: SkyAgGridCellEditorDatepickerComponent, selector: "sky-ag-grid-cell-editor-datepicker", viewQueries: [{ propertyName: "datepickerInput", first: true, predicate: ["skyCellEditorDatepickerInput"], descendants: true, read: ElementRef }], usesInheritance: true, ngImport: i0, template: "<div\n class=\"sky-ag-grid-cell-editor-datepicker\"\n [formGroup]=\"editorForm\"\n [style.width.px]=\"columnWidthWithoutBorders\"\n>\n <sky-datepicker\n data-sky-id=\"cell-datepicker\"\n pickerClass=\"ag-custom-component-popup\"\n >\n <input\n formControlName=\"date\"\n skyDatepickerInput\n [minDate]=\"skyComponentProperties.minDate\"\n [maxDate]=\"skyComponentProperties.maxDate\"\n [dateFormat]=\"skyComponentProperties.dateFormat\"\n [startingDay]=\"skyComponentProperties.startingDay\"\n [skyDatepickerNoValidate]=\"skyComponentProperties.skyDatepickerNoValidate\"\n [style.height.px]=\"rowHeightWithoutBorders\"\n #skyCellEditorDatepickerInput\n />\n </sky-datepicker>\n</div>\n", styles: [".sky-ag-grid-cell-editor-datepicker{position:relative;top:1px;left:1px}.sky-ag-grid-cell-editor-datepicker sky-datepicker input.sky-form-control{box-shadow:none;border-width:1px;border-style:solid;border-color:transparent #cdcfd2 transparent transparent}.sky-ag-grid-cell-editor-datepicker sky-datepicker .sky-input-group-datepicker-btn{border-radius:0}:host-context(.sky-theme-modern) .sky-ag-grid-cell-editor-datepicker{position:static;top:initial;left:initial}:host-context(.sky-theme-modern) .sky-ag-grid-cell-editor-datepicker sky-datepicker input.sky-form-control{border-radius:0;border:1px solid #1870B8}:host-context(.sky-theme-modern) .sky-ag-grid-cell-editor-datepicker sky-datepicker input.sky-form-control:focus{border-width:2px!important}.sky-theme-modern .sky-ag-grid-cell-editor-datepicker{position:static;top:initial;left:initial}.sky-theme-modern .sky-ag-grid-cell-editor-datepicker sky-datepicker input.sky-form-control{border-radius:0;border:1px solid #1870B8}.sky-theme-modern .sky-ag-grid-cell-editor-datepicker sky-datepicker input.sky-form-control:focus{border-width:2px!important}\n"], components: [{ type: i2$1.λ2, selector: "sky-datepicker", inputs: ["pickerClass"], outputs: ["calendarDateRangeChange"] }], directives: [{ type: i1$4.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { type: i1$4.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { type: i1$4.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { type: i1$4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i1$4.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { type: i2$1.λ3, selector: "[skyDatepickerInput]", inputs: ["dateFormat", "disabled", "maxDate", "minDate", "skyDatepickerInput", "skyDatepickerNoValidate", "startingDay", "strict"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
894
1058
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: SkyAgGridCellEditorDatepickerComponent, decorators: [{
895
1059
  type: Component,
896
- args: [{ selector: 'sky-ag-grid-cell-editor-datepicker', changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, template: "<div\n class=\"sky-ag-grid-cell-editor-datepicker\"\n [style.width.px]=\"columnWidthWithoutBorders\"\n>\n <sky-datepicker\n data-sky-id=\"cell-datepicker\"\n pickerClass=\"ag-custom-component-popup\"\n >\n <input\n skyDatepickerInput\n [disabled]=\"skyComponentProperties.disabled\"\n [minDate]=\"skyComponentProperties.minDate\"\n [maxDate]=\"skyComponentProperties.maxDate\"\n [dateFormat]=\"skyComponentProperties.dateFormat\"\n [startingDay]=\"skyComponentProperties.startingDay\"\n [skyDatepickerNoValidate]=\"skyComponentProperties.skyDatepickerNoValidate\"\n [style.height.px]=\"rowHeightWithoutBorders\"\n [(ngModel)]=\"currentDate\"\n #skyCellEditorDatepickerInput\n />\n </sky-datepicker>\n</div>\n", styles: [".sky-ag-grid-cell-editor-datepicker{position:relative;top:1px;left:1px}.sky-ag-grid-cell-editor-datepicker sky-datepicker input.sky-form-control{box-shadow:none;border-width:1px;border-style:solid;border-color:transparent #cdcfd2 transparent transparent}.sky-ag-grid-cell-editor-datepicker sky-datepicker .sky-input-group-datepicker-btn{border-radius:0}:host-context(.sky-theme-modern) .sky-ag-grid-cell-editor-datepicker{position:static;top:initial;left:initial}:host-context(.sky-theme-modern) .sky-ag-grid-cell-editor-datepicker sky-datepicker input.sky-form-control{border-radius:0;border:1px solid #1870B8}:host-context(.sky-theme-modern) .sky-ag-grid-cell-editor-datepicker sky-datepicker input.sky-form-control:focus{border-width:2px!important}.sky-theme-modern .sky-ag-grid-cell-editor-datepicker{position:static;top:initial;left:initial}.sky-theme-modern .sky-ag-grid-cell-editor-datepicker sky-datepicker input.sky-form-control{border-radius:0;border:1px solid #1870B8}.sky-theme-modern .sky-ag-grid-cell-editor-datepicker sky-datepicker input.sky-form-control:focus{border-width:2px!important}\n"] }]
897
- }], ctorParameters: function () { return [{ type: i1$5.SkyThemeService, decorators: [{
1060
+ args: [{ selector: 'sky-ag-grid-cell-editor-datepicker', changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, template: "<div\n class=\"sky-ag-grid-cell-editor-datepicker\"\n [formGroup]=\"editorForm\"\n [style.width.px]=\"columnWidthWithoutBorders\"\n>\n <sky-datepicker\n data-sky-id=\"cell-datepicker\"\n pickerClass=\"ag-custom-component-popup\"\n >\n <input\n formControlName=\"date\"\n skyDatepickerInput\n [minDate]=\"skyComponentProperties.minDate\"\n [maxDate]=\"skyComponentProperties.maxDate\"\n [dateFormat]=\"skyComponentProperties.dateFormat\"\n [startingDay]=\"skyComponentProperties.startingDay\"\n [skyDatepickerNoValidate]=\"skyComponentProperties.skyDatepickerNoValidate\"\n [style.height.px]=\"rowHeightWithoutBorders\"\n #skyCellEditorDatepickerInput\n />\n </sky-datepicker>\n</div>\n", styles: [".sky-ag-grid-cell-editor-datepicker{position:relative;top:1px;left:1px}.sky-ag-grid-cell-editor-datepicker sky-datepicker input.sky-form-control{box-shadow:none;border-width:1px;border-style:solid;border-color:transparent #cdcfd2 transparent transparent}.sky-ag-grid-cell-editor-datepicker sky-datepicker .sky-input-group-datepicker-btn{border-radius:0}:host-context(.sky-theme-modern) .sky-ag-grid-cell-editor-datepicker{position:static;top:initial;left:initial}:host-context(.sky-theme-modern) .sky-ag-grid-cell-editor-datepicker sky-datepicker input.sky-form-control{border-radius:0;border:1px solid #1870B8}:host-context(.sky-theme-modern) .sky-ag-grid-cell-editor-datepicker sky-datepicker input.sky-form-control:focus{border-width:2px!important}.sky-theme-modern .sky-ag-grid-cell-editor-datepicker{position:static;top:initial;left:initial}.sky-theme-modern .sky-ag-grid-cell-editor-datepicker sky-datepicker input.sky-form-control{border-radius:0;border:1px solid #1870B8}.sky-theme-modern .sky-ag-grid-cell-editor-datepicker sky-datepicker input.sky-form-control:focus{border-width:2px!important}\n"] }]
1061
+ }], ctorParameters: function () { return [{ type: i0.ChangeDetectorRef }, { type: i1$5.SkyThemeService, decorators: [{
898
1062
  type: Optional
899
1063
  }] }]; }, propDecorators: { datepickerInput: [{
900
1064
  type: ViewChild,
@@ -904,12 +1068,12 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.2", ngImpor
904
1068
  class SkyAgGridCellEditorDatepickerModule {
905
1069
  }
906
1070
  SkyAgGridCellEditorDatepickerModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: SkyAgGridCellEditorDatepickerModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
907
- SkyAgGridCellEditorDatepickerModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: SkyAgGridCellEditorDatepickerModule, declarations: [SkyAgGridCellEditorDatepickerComponent], imports: [SkyDatepickerModule, FormsModule], exports: [SkyAgGridCellEditorDatepickerComponent] });
908
- SkyAgGridCellEditorDatepickerModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: SkyAgGridCellEditorDatepickerModule, imports: [[SkyDatepickerModule, FormsModule]] });
1071
+ SkyAgGridCellEditorDatepickerModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: SkyAgGridCellEditorDatepickerModule, declarations: [SkyAgGridCellEditorDatepickerComponent], imports: [SkyDatepickerModule, ReactiveFormsModule], exports: [SkyAgGridCellEditorDatepickerComponent] });
1072
+ SkyAgGridCellEditorDatepickerModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: SkyAgGridCellEditorDatepickerModule, imports: [[SkyDatepickerModule, ReactiveFormsModule]] });
909
1073
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: SkyAgGridCellEditorDatepickerModule, decorators: [{
910
1074
  type: NgModule,
911
1075
  args: [{
912
- imports: [SkyDatepickerModule, FormsModule],
1076
+ imports: [SkyDatepickerModule, ReactiveFormsModule],
913
1077
  declarations: [SkyAgGridCellEditorDatepickerComponent],
914
1078
  exports: [SkyAgGridCellEditorDatepickerComponent],
915
1079
  }]
@@ -944,6 +1108,7 @@ function applySkyLookupPropertiesDefaults(skyLookupProperties) {
944
1108
  };
945
1109
  }
946
1110
 
1111
+ var _SkyAgGridCellEditorLookupComponent_triggerType;
947
1112
  /**
948
1113
  * @internal
949
1114
  */
@@ -952,21 +1117,33 @@ class SkyAgGridCellEditorLookupComponent {
952
1117
  this.changeDetector = changeDetector;
953
1118
  this.elementRef = elementRef;
954
1119
  this.isAlive = false;
955
- this.lookupForm = new FormGroup({
956
- currentSelection: new FormControl({
1120
+ this.editorForm = new FormGroup({
1121
+ selection: new FormControl({
957
1122
  value: [],
958
1123
  disabled: false,
959
1124
  }),
960
1125
  });
961
1126
  this.useAsyncSearch = false;
1127
+ _SkyAgGridCellEditorLookupComponent_triggerType.set(this, void 0);
962
1128
  }
963
1129
  agInit(params) {
964
1130
  this.params = params;
965
1131
  if (!Array.isArray(this.params.value)) {
966
1132
  throw new Error(`Lookup value must be an array`);
967
1133
  }
968
- const control = this.lookupForm.get('currentSelection');
969
- control.setValue(this.params.value);
1134
+ __classPrivateFieldSet(this, _SkyAgGridCellEditorLookupComponent_triggerType, SkyAgGridCellEditorUtils.getEditorInitialAction(params), "f");
1135
+ const control = this.editorForm.get('selection');
1136
+ switch (__classPrivateFieldGet(this, _SkyAgGridCellEditorLookupComponent_triggerType, "f")) {
1137
+ case SkyAgGridCellEditorInitialAction.Delete:
1138
+ control.setValue([]);
1139
+ break;
1140
+ case SkyAgGridCellEditorInitialAction.Replace:
1141
+ case SkyAgGridCellEditorInitialAction.Highlighted:
1142
+ case SkyAgGridCellEditorInitialAction.Untouched:
1143
+ default:
1144
+ control.setValue(params.value);
1145
+ break;
1146
+ }
970
1147
  if (this.params.skyComponentProperties.disabled) {
971
1148
  control.disable();
972
1149
  }
@@ -991,25 +1168,36 @@ class SkyAgGridCellEditorLookupComponent {
991
1168
  return this.elementRef.nativeElement;
992
1169
  }
993
1170
  getValue() {
994
- return this.lookupForm.get('currentSelection').value;
1171
+ return this.editorForm.get('selection').value;
995
1172
  }
996
1173
  isPopup() {
997
1174
  return true;
998
1175
  }
999
- /*istanbul ignore next*/
1000
1176
  afterGuiAttached() {
1001
- this.elementRef.nativeElement.querySelector('.sky-lookup-input')?.focus();
1177
+ const lookupInput = this.elementRef.nativeElement.querySelector('.sky-lookup-input');
1178
+ lookupInput.focus();
1179
+ if (__classPrivateFieldGet(this, _SkyAgGridCellEditorLookupComponent_triggerType, "f") === SkyAgGridCellEditorInitialAction.Replace) {
1180
+ lookupInput.select();
1181
+ lookupInput.setRangeText(this.params.charPress);
1182
+ // Ensure the cursor is at the end of the text.
1183
+ lookupInput.setSelectionRange(lookupInput.value.length, lookupInput.value.length);
1184
+ lookupInput.dispatchEvent(new Event('input'));
1185
+ }
1186
+ if (__classPrivateFieldGet(this, _SkyAgGridCellEditorLookupComponent_triggerType, "f") === SkyAgGridCellEditorInitialAction.Highlighted) {
1187
+ lookupInput.select();
1188
+ }
1002
1189
  }
1003
1190
  updateComponentProperties(params) {
1004
1191
  const skyLookupProperties = params.skyComponentProperties;
1005
1192
  return applySkyLookupPropertiesDefaults(skyLookupProperties);
1006
1193
  }
1007
1194
  }
1195
+ _SkyAgGridCellEditorLookupComponent_triggerType = new WeakMap();
1008
1196
  SkyAgGridCellEditorLookupComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: SkyAgGridCellEditorLookupComponent, deps: [{ token: i0.ChangeDetectorRef }, { token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component });
1009
- SkyAgGridCellEditorLookupComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.2", type: SkyAgGridCellEditorLookupComponent, selector: "sky-ag-grid-cell-editor-lookup", host: { properties: { "style.width.px": "this.width" } }, ngImport: i0, template: "<sky-input-box\n *ngIf=\"isAlive && useAsyncSearch\"\n [disabled]=\"skyComponentProperties?.disabled\"\n [formGroup]=\"lookupForm\"\n>\n <sky-lookup\n [ariaLabel]=\"skyComponentProperties?.ariaLabel\"\n [autocompleteAttribute]=\"skyComponentProperties?.autocompleteAttribute\"\n [data]=\"skyComponentProperties?.data\"\n [debounceTime]=\"skyComponentProperties?.debounceTime\"\n [descriptorProperty]=\"skyComponentProperties?.descriptorProperty\"\n [enableShowMore]=\"skyComponentProperties?.enableShowMore\"\n formControlName=\"currentSelection\"\n [idProperty]=\"skyComponentProperties?.idProperty\"\n [placeholderText]=\"skyComponentProperties?.placeholderText\"\n [propertiesToSearch]=\"skyComponentProperties?.propertiesToSearch\"\n [searchFilters]=\"skyComponentProperties?.searchFilters\"\n [searchResultsLimit]=\"skyComponentProperties?.searchResultsLimit\"\n [searchResultTemplate]=\"skyComponentProperties?.searchResultTemplate\"\n [searchTextMinimumCharacters]=\"\n skyComponentProperties?.searchTextMinimumCharacters\n \"\n (searchAsync)=\"skyComponentProperties.searchAsync($event)\"\n [selectMode]=\"skyComponentProperties?.selectMode\"\n [showAddButton]=\"skyComponentProperties?.showAddButton\"\n [showMoreConfig]=\"skyComponentProperties?.showMoreConfig\"\n [wrapperClass]=\"skyComponentProperties?.wrapperClass\"\n >\n </sky-lookup>\n</sky-input-box>\n<sky-input-box\n *ngIf=\"isAlive && !useAsyncSearch\"\n [disabled]=\"skyComponentProperties?.disabled\"\n [formGroup]=\"lookupForm\"\n>\n <sky-lookup\n [ariaLabel]=\"skyComponentProperties?.ariaLabel\"\n [autocompleteAttribute]=\"skyComponentProperties?.autocompleteAttribute\"\n [data]=\"skyComponentProperties?.data\"\n [debounceTime]=\"skyComponentProperties?.debounceTime\"\n [descriptorProperty]=\"skyComponentProperties?.descriptorProperty\"\n [enableShowMore]=\"skyComponentProperties?.enableShowMore\"\n formControlName=\"currentSelection\"\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 >\n </sky-lookup>\n</sky-input-box>\n", styles: [":host{display:block}\n"], components: [{ type: i1$6.λ10, selector: "sky-input-box", inputs: ["hasErrors", "disabled"] }, { type: i1$3.λ4, selector: "sky-lookup", inputs: ["ariaLabel", "ariaLabelledBy", "autocompleteAttribute", "data", "disabled", "enableShowMore", "placeholderText", "idProperty", "showAddButton", "showMoreConfig", "selectMode", "wrapperClass"], outputs: ["addClick"] }], directives: [{ type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i1$4.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { type: i1$4.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { type: i1$4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i1$4.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
1197
+ SkyAgGridCellEditorLookupComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.2", type: SkyAgGridCellEditorLookupComponent, selector: "sky-ag-grid-cell-editor-lookup", host: { properties: { "style.width.px": "this.width" } }, ngImport: i0, template: "<sky-input-box\n *ngIf=\"isAlive && useAsyncSearch\"\n [disabled]=\"skyComponentProperties?.disabled\"\n [formGroup]=\"editorForm\"\n>\n <sky-lookup\n [ariaLabel]=\"skyComponentProperties?.ariaLabel\"\n [autocompleteAttribute]=\"skyComponentProperties?.autocompleteAttribute\"\n [data]=\"skyComponentProperties?.data\"\n [debounceTime]=\"skyComponentProperties?.debounceTime\"\n [descriptorProperty]=\"skyComponentProperties?.descriptorProperty\"\n [enableShowMore]=\"skyComponentProperties?.enableShowMore\"\n formControlName=\"selection\"\n [idProperty]=\"skyComponentProperties?.idProperty\"\n [placeholderText]=\"skyComponentProperties?.placeholderText\"\n [propertiesToSearch]=\"skyComponentProperties?.propertiesToSearch\"\n [searchFilters]=\"skyComponentProperties?.searchFilters\"\n [searchResultsLimit]=\"skyComponentProperties?.searchResultsLimit\"\n [searchResultTemplate]=\"skyComponentProperties?.searchResultTemplate\"\n [searchTextMinimumCharacters]=\"\n skyComponentProperties?.searchTextMinimumCharacters\n \"\n (searchAsync)=\"skyComponentProperties.searchAsync($event)\"\n [selectMode]=\"skyComponentProperties?.selectMode\"\n [showAddButton]=\"skyComponentProperties?.showAddButton\"\n [showMoreConfig]=\"skyComponentProperties?.showMoreConfig\"\n [wrapperClass]=\"skyComponentProperties?.wrapperClass\"\n >\n </sky-lookup>\n</sky-input-box>\n<sky-input-box\n *ngIf=\"isAlive && !useAsyncSearch\"\n [disabled]=\"skyComponentProperties?.disabled\"\n [formGroup]=\"editorForm\"\n>\n <sky-lookup\n [ariaLabel]=\"skyComponentProperties?.ariaLabel\"\n [autocompleteAttribute]=\"skyComponentProperties?.autocompleteAttribute\"\n [data]=\"skyComponentProperties?.data\"\n [debounceTime]=\"skyComponentProperties?.debounceTime\"\n [descriptorProperty]=\"skyComponentProperties?.descriptorProperty\"\n [enableShowMore]=\"skyComponentProperties?.enableShowMore\"\n formControlName=\"selection\"\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 >\n </sky-lookup>\n</sky-input-box>\n", styles: [":host{display:block}\n"], components: [{ type: i1$6.λ10, selector: "sky-input-box", inputs: ["hasErrors", "disabled"] }, { type: i1$3.λ4, selector: "sky-lookup", inputs: ["ariaLabel", "ariaLabelledBy", "autocompleteAttribute", "data", "disabled", "enableShowMore", "placeholderText", "idProperty", "showAddButton", "showMoreConfig", "selectMode", "wrapperClass"], outputs: ["addClick"] }], directives: [{ type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i1$4.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { type: i1$4.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { type: i1$4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i1$4.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
1010
1198
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: SkyAgGridCellEditorLookupComponent, decorators: [{
1011
1199
  type: Component,
1012
- args: [{ selector: 'sky-ag-grid-cell-editor-lookup', changeDetection: ChangeDetectionStrategy.OnPush, template: "<sky-input-box\n *ngIf=\"isAlive && useAsyncSearch\"\n [disabled]=\"skyComponentProperties?.disabled\"\n [formGroup]=\"lookupForm\"\n>\n <sky-lookup\n [ariaLabel]=\"skyComponentProperties?.ariaLabel\"\n [autocompleteAttribute]=\"skyComponentProperties?.autocompleteAttribute\"\n [data]=\"skyComponentProperties?.data\"\n [debounceTime]=\"skyComponentProperties?.debounceTime\"\n [descriptorProperty]=\"skyComponentProperties?.descriptorProperty\"\n [enableShowMore]=\"skyComponentProperties?.enableShowMore\"\n formControlName=\"currentSelection\"\n [idProperty]=\"skyComponentProperties?.idProperty\"\n [placeholderText]=\"skyComponentProperties?.placeholderText\"\n [propertiesToSearch]=\"skyComponentProperties?.propertiesToSearch\"\n [searchFilters]=\"skyComponentProperties?.searchFilters\"\n [searchResultsLimit]=\"skyComponentProperties?.searchResultsLimit\"\n [searchResultTemplate]=\"skyComponentProperties?.searchResultTemplate\"\n [searchTextMinimumCharacters]=\"\n skyComponentProperties?.searchTextMinimumCharacters\n \"\n (searchAsync)=\"skyComponentProperties.searchAsync($event)\"\n [selectMode]=\"skyComponentProperties?.selectMode\"\n [showAddButton]=\"skyComponentProperties?.showAddButton\"\n [showMoreConfig]=\"skyComponentProperties?.showMoreConfig\"\n [wrapperClass]=\"skyComponentProperties?.wrapperClass\"\n >\n </sky-lookup>\n</sky-input-box>\n<sky-input-box\n *ngIf=\"isAlive && !useAsyncSearch\"\n [disabled]=\"skyComponentProperties?.disabled\"\n [formGroup]=\"lookupForm\"\n>\n <sky-lookup\n [ariaLabel]=\"skyComponentProperties?.ariaLabel\"\n [autocompleteAttribute]=\"skyComponentProperties?.autocompleteAttribute\"\n [data]=\"skyComponentProperties?.data\"\n [debounceTime]=\"skyComponentProperties?.debounceTime\"\n [descriptorProperty]=\"skyComponentProperties?.descriptorProperty\"\n [enableShowMore]=\"skyComponentProperties?.enableShowMore\"\n formControlName=\"currentSelection\"\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 >\n </sky-lookup>\n</sky-input-box>\n", styles: [":host{display:block}\n"] }]
1200
+ args: [{ selector: 'sky-ag-grid-cell-editor-lookup', changeDetection: ChangeDetectionStrategy.OnPush, template: "<sky-input-box\n *ngIf=\"isAlive && useAsyncSearch\"\n [disabled]=\"skyComponentProperties?.disabled\"\n [formGroup]=\"editorForm\"\n>\n <sky-lookup\n [ariaLabel]=\"skyComponentProperties?.ariaLabel\"\n [autocompleteAttribute]=\"skyComponentProperties?.autocompleteAttribute\"\n [data]=\"skyComponentProperties?.data\"\n [debounceTime]=\"skyComponentProperties?.debounceTime\"\n [descriptorProperty]=\"skyComponentProperties?.descriptorProperty\"\n [enableShowMore]=\"skyComponentProperties?.enableShowMore\"\n formControlName=\"selection\"\n [idProperty]=\"skyComponentProperties?.idProperty\"\n [placeholderText]=\"skyComponentProperties?.placeholderText\"\n [propertiesToSearch]=\"skyComponentProperties?.propertiesToSearch\"\n [searchFilters]=\"skyComponentProperties?.searchFilters\"\n [searchResultsLimit]=\"skyComponentProperties?.searchResultsLimit\"\n [searchResultTemplate]=\"skyComponentProperties?.searchResultTemplate\"\n [searchTextMinimumCharacters]=\"\n skyComponentProperties?.searchTextMinimumCharacters\n \"\n (searchAsync)=\"skyComponentProperties.searchAsync($event)\"\n [selectMode]=\"skyComponentProperties?.selectMode\"\n [showAddButton]=\"skyComponentProperties?.showAddButton\"\n [showMoreConfig]=\"skyComponentProperties?.showMoreConfig\"\n [wrapperClass]=\"skyComponentProperties?.wrapperClass\"\n >\n </sky-lookup>\n</sky-input-box>\n<sky-input-box\n *ngIf=\"isAlive && !useAsyncSearch\"\n [disabled]=\"skyComponentProperties?.disabled\"\n [formGroup]=\"editorForm\"\n>\n <sky-lookup\n [ariaLabel]=\"skyComponentProperties?.ariaLabel\"\n [autocompleteAttribute]=\"skyComponentProperties?.autocompleteAttribute\"\n [data]=\"skyComponentProperties?.data\"\n [debounceTime]=\"skyComponentProperties?.debounceTime\"\n [descriptorProperty]=\"skyComponentProperties?.descriptorProperty\"\n [enableShowMore]=\"skyComponentProperties?.enableShowMore\"\n formControlName=\"selection\"\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 >\n </sky-lookup>\n</sky-input-box>\n", styles: [":host{display:block}\n"] }]
1013
1201
  }], ctorParameters: function () { return [{ type: i0.ChangeDetectorRef }, { type: i0.ElementRef }]; }, propDecorators: { width: [{
1014
1202
  type: HostBinding,
1015
1203
  args: ['style.width.px']
@@ -1045,17 +1233,38 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.2", ngImpor
1045
1233
  }]
1046
1234
  }] });
1047
1235
 
1236
+ var _SkyAgGridCellEditorNumberComponent_triggerType;
1048
1237
  /**
1049
1238
  * @internal
1050
1239
  */
1051
1240
  class SkyAgGridCellEditorNumberComponent {
1241
+ constructor() {
1242
+ this.editorForm = new FormGroup({
1243
+ number: new FormControl(),
1244
+ });
1245
+ _SkyAgGridCellEditorNumberComponent_triggerType.set(this, void 0);
1246
+ }
1052
1247
  /**
1053
1248
  * agInit is called by agGrid once after the editor is created and provides the editor with the information it needs.
1054
1249
  * @param params The cell editor params that include data about the cell, column, row, and grid.
1055
1250
  */
1056
1251
  agInit(params) {
1057
1252
  this.params = params;
1058
- this.value = this.params.value;
1253
+ __classPrivateFieldSet(this, _SkyAgGridCellEditorNumberComponent_triggerType, SkyAgGridCellEditorUtils.getEditorInitialAction(params), "f");
1254
+ const control = this.editorForm.get('number');
1255
+ switch (__classPrivateFieldGet(this, _SkyAgGridCellEditorNumberComponent_triggerType, "f")) {
1256
+ case SkyAgGridCellEditorInitialAction.Delete:
1257
+ control.setValue(undefined);
1258
+ break;
1259
+ case SkyAgGridCellEditorInitialAction.Replace:
1260
+ control.setValue(parseFloat(this.params.charPress) || undefined);
1261
+ break;
1262
+ case SkyAgGridCellEditorInitialAction.Highlighted:
1263
+ case SkyAgGridCellEditorInitialAction.Untouched:
1264
+ default:
1265
+ control.setValue(params.value);
1266
+ break;
1267
+ }
1059
1268
  this.max = params.skyComponentProperties?.max;
1060
1269
  this.min = params.skyComponentProperties?.min;
1061
1270
  this.columnHeader = this.params.colDef.headerName;
@@ -1069,19 +1278,24 @@ class SkyAgGridCellEditorNumberComponent {
1069
1278
  */
1070
1279
  afterGuiAttached() {
1071
1280
  this.input.nativeElement.focus();
1281
+ if (__classPrivateFieldGet(this, _SkyAgGridCellEditorNumberComponent_triggerType, "f") === SkyAgGridCellEditorInitialAction.Highlighted) {
1282
+ this.input.nativeElement.select();
1283
+ }
1072
1284
  }
1073
1285
  /**
1074
1286
  * getValue is called by agGrid when editing is stopped to get the new value of the cell.
1075
1287
  */
1076
1288
  getValue() {
1077
- return this.value;
1289
+ const val = this.editorForm.get('number').value;
1290
+ return val !== undefined && val !== null ? val : undefined;
1078
1291
  }
1079
1292
  }
1293
+ _SkyAgGridCellEditorNumberComponent_triggerType = new WeakMap();
1080
1294
  SkyAgGridCellEditorNumberComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: SkyAgGridCellEditorNumberComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
1081
- SkyAgGridCellEditorNumberComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.2", type: SkyAgGridCellEditorNumberComponent, selector: "sky-ag-grid-cell-editor-number", viewQueries: [{ propertyName: "input", first: true, predicate: ["skyCellEditorNumber"], descendants: true, read: ElementRef }], ngImport: i0, template: "<input\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 [(ngModel)]=\"value\"\n [max]=\"max\"\n [min]=\"min\"\n #skyCellEditorNumber\n/>\n", styles: ["input{border:none;text-align:right}\n"], directives: [{ type: i1$4.NumberValueAccessor, selector: "input[type=number][formControlName],input[type=number][formControl],input[type=number][ngModel]" }, { type: i1$4.MaxValidator, selector: "input[type=number][max][formControlName],input[type=number][max][formControl],input[type=number][max][ngModel]", inputs: ["max"] }, { type: i1$4.MinValidator, selector: "input[type=number][min][formControlName],input[type=number][min][formControl],input[type=number][min][ngModel]", inputs: ["min"] }, { type: i1$4.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { type: i1$4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i1$4.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }], pipes: { "skyLibResources": i3$1.SkyLibResourcesPipe }, changeDetection: i0.ChangeDetectionStrategy.OnPush });
1295
+ SkyAgGridCellEditorNumberComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.2", 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 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\"\n [min]=\"min\"\n #skyCellEditorNumber\n />\n</ng-container>\n", styles: ["input{border:none;text-align:right}\n"], directives: [{ type: i1$4.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { type: i1$4.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { type: i1$4.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { type: i1$4.NumberValueAccessor, selector: "input[type=number][formControlName],input[type=number][formControl],input[type=number][ngModel]" }, { type: i1$4.MaxValidator, selector: "input[type=number][max][formControlName],input[type=number][max][formControl],input[type=number][max][ngModel]", inputs: ["max"] }, { type: i1$4.MinValidator, selector: "input[type=number][min][formControlName],input[type=number][min][formControl],input[type=number][min][ngModel]", inputs: ["min"] }, { type: i1$4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i1$4.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }], pipes: { "skyLibResources": i3$1.SkyLibResourcesPipe }, changeDetection: i0.ChangeDetectionStrategy.OnPush });
1082
1296
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: SkyAgGridCellEditorNumberComponent, decorators: [{
1083
1297
  type: Component,
1084
- args: [{ selector: 'sky-ag-grid-cell-editor-number', changeDetection: ChangeDetectionStrategy.OnPush, template: "<input\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 [(ngModel)]=\"value\"\n [max]=\"max\"\n [min]=\"min\"\n #skyCellEditorNumber\n/>\n", styles: ["input{border:none;text-align:right}\n"] }]
1298
+ args: [{ selector: 'sky-ag-grid-cell-editor-number', changeDetection: ChangeDetectionStrategy.OnPush, template: "<ng-container [formGroup]=\"editorForm\">\n <input\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\"\n [min]=\"min\"\n #skyCellEditorNumber\n />\n</ng-container>\n", styles: ["input{border:none;text-align:right}\n"] }]
1085
1299
  }], propDecorators: { input: [{
1086
1300
  type: ViewChild,
1087
1301
  args: ['skyCellEditorNumber', { read: ElementRef }]
@@ -1090,28 +1304,49 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.2", ngImpor
1090
1304
  class SkyAgGridCellEditorNumberModule {
1091
1305
  }
1092
1306
  SkyAgGridCellEditorNumberModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: SkyAgGridCellEditorNumberModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
1093
- SkyAgGridCellEditorNumberModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: SkyAgGridCellEditorNumberModule, declarations: [SkyAgGridCellEditorNumberComponent], imports: [SkyAgGridResourcesModule, FormsModule], exports: [SkyAgGridCellEditorNumberComponent] });
1094
- SkyAgGridCellEditorNumberModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: SkyAgGridCellEditorNumberModule, imports: [[SkyAgGridResourcesModule, FormsModule]] });
1307
+ SkyAgGridCellEditorNumberModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: SkyAgGridCellEditorNumberModule, declarations: [SkyAgGridCellEditorNumberComponent], imports: [SkyAgGridResourcesModule, ReactiveFormsModule], exports: [SkyAgGridCellEditorNumberComponent] });
1308
+ SkyAgGridCellEditorNumberModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: SkyAgGridCellEditorNumberModule, imports: [[SkyAgGridResourcesModule, ReactiveFormsModule]] });
1095
1309
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: SkyAgGridCellEditorNumberModule, decorators: [{
1096
1310
  type: NgModule,
1097
1311
  args: [{
1098
- imports: [SkyAgGridResourcesModule, FormsModule],
1312
+ imports: [SkyAgGridResourcesModule, ReactiveFormsModule],
1099
1313
  declarations: [SkyAgGridCellEditorNumberComponent],
1100
1314
  exports: [SkyAgGridCellEditorNumberComponent],
1101
1315
  }]
1102
1316
  }] });
1103
1317
 
1318
+ var _SkyAgGridCellEditorTextComponent_triggerType;
1104
1319
  /**
1105
1320
  * @internal
1106
1321
  */
1107
1322
  class SkyAgGridCellEditorTextComponent {
1323
+ constructor() {
1324
+ this.editorForm = new FormGroup({
1325
+ text: new FormControl(),
1326
+ });
1327
+ _SkyAgGridCellEditorTextComponent_triggerType.set(this, void 0);
1328
+ }
1108
1329
  /**
1109
1330
  * agInit is called by agGrid once after the editor is created and provides the editor with the information it needs.
1110
1331
  * @param params The cell editor params that include data about the cell, column, row, and grid.
1111
1332
  */
1112
1333
  agInit(params) {
1113
1334
  this.params = params;
1114
- this.value = this.params.charPress || this.params.value;
1335
+ __classPrivateFieldSet(this, _SkyAgGridCellEditorTextComponent_triggerType, SkyAgGridCellEditorUtils.getEditorInitialAction(params), "f");
1336
+ const control = this.editorForm.get('text');
1337
+ switch (__classPrivateFieldGet(this, _SkyAgGridCellEditorTextComponent_triggerType, "f")) {
1338
+ case SkyAgGridCellEditorInitialAction.Delete:
1339
+ control.setValue(undefined);
1340
+ break;
1341
+ case SkyAgGridCellEditorInitialAction.Replace:
1342
+ control.setValue(params.charPress);
1343
+ break;
1344
+ case SkyAgGridCellEditorInitialAction.Highlighted:
1345
+ case SkyAgGridCellEditorInitialAction.Untouched:
1346
+ default:
1347
+ control.setValue(params.value);
1348
+ break;
1349
+ }
1115
1350
  this.maxlength = params.skyComponentProperties?.maxlength;
1116
1351
  this.columnHeader = this.params.colDef.headerName;
1117
1352
  this.rowNumber = this.params.rowIndex + 1;
@@ -1124,19 +1359,23 @@ class SkyAgGridCellEditorTextComponent {
1124
1359
  */
1125
1360
  afterGuiAttached() {
1126
1361
  this.input.nativeElement.focus();
1362
+ if (__classPrivateFieldGet(this, _SkyAgGridCellEditorTextComponent_triggerType, "f") === SkyAgGridCellEditorInitialAction.Highlighted) {
1363
+ this.input.nativeElement.select();
1364
+ }
1127
1365
  }
1128
1366
  /**
1129
1367
  * getValue is called by agGrid when editing is stopped to get the new value of the cell.
1130
1368
  */
1131
1369
  getValue() {
1132
- return this.value;
1370
+ return this.editorForm.get('text').value || undefined;
1133
1371
  }
1134
1372
  }
1373
+ _SkyAgGridCellEditorTextComponent_triggerType = new WeakMap();
1135
1374
  SkyAgGridCellEditorTextComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: SkyAgGridCellEditorTextComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
1136
- SkyAgGridCellEditorTextComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.2", type: SkyAgGridCellEditorTextComponent, selector: "sky-ag-grid-cell-editor-text", viewQueries: [{ propertyName: "input", first: true, predicate: ["skyCellEditorText"], descendants: true, read: ElementRef }], ngImport: i0, template: "<input\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 [(ngModel)]=\"value\"\n [maxlength]=\"maxlength\"\n #skyCellEditorText\n/>\n", styles: ["input{border:none;padding-left:11px}\n"], directives: [{ type: i1$4.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { type: i1$4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i1$4.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { type: i1$4.MaxLengthValidator, selector: "[maxlength][formControlName],[maxlength][formControl],[maxlength][ngModel]", inputs: ["maxlength"] }], pipes: { "skyLibResources": i3$1.SkyLibResourcesPipe }, changeDetection: i0.ChangeDetectionStrategy.OnPush });
1375
+ SkyAgGridCellEditorTextComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.2", 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 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\"\n #skyCellEditorText\n />\n</ng-container>\n", styles: ["input{border:none;padding-left:11px}\n"], directives: [{ type: i1$4.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { type: i1$4.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { type: i1$4.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { type: i1$4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i1$4.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { type: i1$4.MaxLengthValidator, selector: "[maxlength][formControlName],[maxlength][formControl],[maxlength][ngModel]", inputs: ["maxlength"] }], pipes: { "skyLibResources": i3$1.SkyLibResourcesPipe }, changeDetection: i0.ChangeDetectionStrategy.OnPush });
1137
1376
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: SkyAgGridCellEditorTextComponent, decorators: [{
1138
1377
  type: Component,
1139
- args: [{ selector: 'sky-ag-grid-cell-editor-text', changeDetection: ChangeDetectionStrategy.OnPush, template: "<input\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 [(ngModel)]=\"value\"\n [maxlength]=\"maxlength\"\n #skyCellEditorText\n/>\n", styles: ["input{border:none;padding-left:11px}\n"] }]
1378
+ args: [{ selector: 'sky-ag-grid-cell-editor-text', changeDetection: ChangeDetectionStrategy.OnPush, template: "<ng-container [formGroup]=\"editorForm\">\n <input\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\"\n #skyCellEditorText\n />\n</ng-container>\n", styles: ["input{border:none;padding-left:11px}\n"] }]
1140
1379
  }], propDecorators: { input: [{
1141
1380
  type: ViewChild,
1142
1381
  args: ['skyCellEditorText', { read: ElementRef }]
@@ -1145,12 +1384,12 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.2", ngImpor
1145
1384
  class SkyAgGridCellEditorTextModule {
1146
1385
  }
1147
1386
  SkyAgGridCellEditorTextModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: SkyAgGridCellEditorTextModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
1148
- SkyAgGridCellEditorTextModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: SkyAgGridCellEditorTextModule, declarations: [SkyAgGridCellEditorTextComponent], imports: [SkyAgGridResourcesModule, FormsModule], exports: [SkyAgGridCellEditorTextComponent] });
1149
- SkyAgGridCellEditorTextModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: SkyAgGridCellEditorTextModule, imports: [[SkyAgGridResourcesModule, FormsModule]] });
1387
+ SkyAgGridCellEditorTextModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: SkyAgGridCellEditorTextModule, declarations: [SkyAgGridCellEditorTextComponent], imports: [SkyAgGridResourcesModule, ReactiveFormsModule], exports: [SkyAgGridCellEditorTextComponent] });
1388
+ SkyAgGridCellEditorTextModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: SkyAgGridCellEditorTextModule, imports: [[SkyAgGridResourcesModule, ReactiveFormsModule]] });
1150
1389
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: SkyAgGridCellEditorTextModule, decorators: [{
1151
1390
  type: NgModule,
1152
1391
  args: [{
1153
- imports: [SkyAgGridResourcesModule, FormsModule],
1392
+ imports: [SkyAgGridResourcesModule, ReactiveFormsModule],
1154
1393
  declarations: [SkyAgGridCellEditorTextComponent],
1155
1394
  exports: [SkyAgGridCellEditorTextComponent],
1156
1395
  }]
@@ -2123,5 +2362,5 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.2", ngImpor
2123
2362
  * Generated bundle index. Do not edit.
2124
2363
  */
2125
2364
 
2126
- export { SkyAgGridModule, SkyAgGridService, SkyCellClass, SkyCellType, SkyHeaderClass, SkyAgGridCellEditorAutocompleteComponent as λ1, SkyAgGridCellRendererValidatorTooltipComponent as λ10, SkyAgGridCellValidatorTooltipComponent as λ11, SkyAgGridWrapperComponent as λ12, SkyAgGridRowDeleteDirective as λ13, SkyAgGridDataManagerAdapterDirective as λ14, SkyAgGridCellEditorLookupComponent as λ15, SkyAgGridCellRendererLookupComponent as λ16, SkyAgGridCellEditorTextComponent as λ2, SkyAgGridCellEditorCurrencyComponent as λ3, SkyAgGridCellEditorNumberComponent as λ4, SkyAgGridCellEditorDatepickerComponent as λ5, SkyAgGridRowDeleteComponent as λ6, SkyAgGridCellRendererRowSelectorComponent as λ7, SkyAgGridCellRendererCurrencyValidatorComponent as λ8, SkyAgGridCellRendererCurrencyComponent as λ9 };
2365
+ export { SkyAgGridCellEditorInitialAction, SkyAgGridCellEditorUtils, SkyAgGridModule, SkyAgGridService, SkyCellClass, SkyCellType, SkyHeaderClass, SkyAgGridCellEditorAutocompleteComponent as λ1, SkyAgGridCellRendererValidatorTooltipComponent as λ10, SkyAgGridCellValidatorTooltipComponent as λ11, SkyAgGridWrapperComponent as λ12, SkyAgGridRowDeleteDirective as λ13, SkyAgGridDataManagerAdapterDirective as λ14, SkyAgGridCellEditorLookupComponent as λ15, SkyAgGridCellRendererLookupComponent as λ16, SkyAgGridCellEditorTextComponent as λ2, SkyAgGridCellEditorCurrencyComponent as λ3, SkyAgGridCellEditorNumberComponent as λ4, SkyAgGridCellEditorDatepickerComponent as λ5, SkyAgGridRowDeleteComponent as λ6, SkyAgGridCellRendererRowSelectorComponent as λ7, SkyAgGridCellRendererCurrencyValidatorComponent as λ8, SkyAgGridCellRendererCurrencyComponent as λ9 };
2127
2366
  //# sourceMappingURL=skyux-ag-grid.mjs.map