@skyux/ag-grid 12.14.0 → 12.14.1

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.
@@ -1816,10 +1816,12 @@ class SkyAgGridCellEditorLookupComponent {
1816
1816
  this.useAsyncSearch = false;
1817
1817
  this.labelText = undefined;
1818
1818
  this.#lookupOpen = false;
1819
+ this.#selectionModalOpen = false;
1819
1820
  this.#changeDetector = inject(ChangeDetectorRef);
1820
1821
  this.#elementRef = inject((ElementRef));
1821
1822
  }
1822
1823
  #lookupOpen;
1824
+ #selectionModalOpen;
1823
1825
  #params;
1824
1826
  #triggerType;
1825
1827
  #changeDetector;
@@ -1920,19 +1922,24 @@ class SkyAgGridCellEditorLookupComponent {
1920
1922
  this.#lookupOpen = isOpen;
1921
1923
  this.#stopEditingOnBlur();
1922
1924
  }
1925
+ onSelectionModalOpenChange(isOpen) {
1926
+ this.#selectionModalOpen = isOpen;
1927
+ this.#stopEditingOnBlur();
1928
+ }
1923
1929
  #updateComponentProperties(params) {
1924
1930
  const skyLookupProperties = params.skyComponentProperties;
1925
1931
  return applySkyLookupPropertiesDefaults(skyLookupProperties);
1926
1932
  }
1927
1933
  #stopEditingOnBlur() {
1928
1934
  if (!this.#lookupOpen &&
1935
+ !this.#selectionModalOpen &&
1929
1936
  this.#params?.api.getGridOption('stopEditingWhenCellsLoseFocus') &&
1930
1937
  !this.#elementRef.nativeElement.matches(':focus-within')) {
1931
1938
  this.#params?.api.stopEditing();
1932
1939
  }
1933
1940
  }
1934
1941
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.7", ngImport: i0, type: SkyAgGridCellEditorLookupComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
1935
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.7", type: SkyAgGridCellEditorLookupComponent, isStandalone: true, 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: "ngmodule", type: SkyInputBoxModule }, { kind: "component", type: i1$4.λ10, selector: "sky-input-box", inputs: ["hasErrors", "disabled", "labelText", "characterLimit", "stacked", "helpPopoverTitle", "helpPopoverContent", "helpKey", "hintText"] }, { kind: "ngmodule", type: FormsModule }, { 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: "ngmodule", type: ReactiveFormsModule }, { 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: "ngmodule", type: SkyLookupModule }, { kind: "component", type: i2.λ4, selector: "sky-lookup", inputs: ["ariaLabel", "ariaLabelledBy", "autocompleteAttribute", "data", "disabled", "required", "enableShowMore", "placeholderText", "idProperty", "showAddButton", "showMoreConfig", "selectMode", "wrapperClass"], outputs: ["addClick", "openChange"] }, { kind: "ngmodule", type: SkyIdModule }, { kind: "directive", type: i1.λ2, selector: "[skyId]", exportAs: ["skyId"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
1942
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.7", type: SkyAgGridCellEditorLookupComponent, isStandalone: true, 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 (selectionModalOpenChange)=\"onSelectionModalOpenChange($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: "ngmodule", type: SkyInputBoxModule }, { kind: "component", type: i1$4.λ10, selector: "sky-input-box", inputs: ["hasErrors", "disabled", "labelText", "characterLimit", "stacked", "helpPopoverTitle", "helpPopoverContent", "helpKey", "hintText"] }, { kind: "ngmodule", type: FormsModule }, { 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: "ngmodule", type: ReactiveFormsModule }, { 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: "ngmodule", type: SkyLookupModule }, { kind: "component", type: i2.λ4, selector: "sky-lookup", inputs: ["ariaLabel", "ariaLabelledBy", "autocompleteAttribute", "data", "disabled", "required", "enableShowMore", "placeholderText", "idProperty", "showAddButton", "showMoreConfig", "selectMode", "wrapperClass"], outputs: ["addClick", "openChange", "selectionModalOpenChange"] }, { kind: "ngmodule", type: SkyIdModule }, { kind: "directive", type: i1.λ2, selector: "[skyId]", exportAs: ["skyId"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
1936
1943
  }
1937
1944
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.7", ngImport: i0, type: SkyAgGridCellEditorLookupComponent, decorators: [{
1938
1945
  type: Component,
@@ -1942,7 +1949,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.7", ngImpor
1942
1949
  ReactiveFormsModule,
1943
1950
  SkyLookupModule,
1944
1951
  SkyIdModule,
1945
- ], 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"] }]
1952
+ ], 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 (selectionModalOpenChange)=\"onSelectionModalOpenChange($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"] }]
1946
1953
  }], propDecorators: { width: [{
1947
1954
  type: HostBinding,
1948
1955
  args: ['style.width.px']