igniteui-angular 18.0.1 → 18.0.3

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 (36) hide show
  1. package/esm2022/lib/calendar/month-picker/month-picker.component.mjs +9 -1
  2. package/esm2022/lib/combo/combo.common.mjs +4 -5
  3. package/esm2022/lib/core/utils.mjs +1 -9
  4. package/esm2022/lib/directives/for-of/for_of.directive.mjs +2 -2
  5. package/esm2022/lib/directives/for-of/for_of.sync.service.mjs +6 -1
  6. package/esm2022/lib/grids/common/events.mjs +1 -1
  7. package/esm2022/lib/grids/common/grid.interface.mjs +1 -1
  8. package/esm2022/lib/grids/common/strategy.mjs +2 -2
  9. package/esm2022/lib/grids/common/types.mjs +1 -1
  10. package/esm2022/lib/grids/grid-base.directive.mjs +41 -38
  11. package/esm2022/lib/grids/hierarchical-grid/hierarchical-grid.component.mjs +2 -2
  12. package/esm2022/lib/simple-combo/simple-combo.component.mjs +33 -8
  13. package/fesm2022/igniteui-angular.mjs +90 -59
  14. package/fesm2022/igniteui-angular.mjs.map +1 -1
  15. package/lib/core/styles/components/icon-button/_icon-button-theme.scss +1 -0
  16. package/lib/core/utils.d.ts +0 -8
  17. package/lib/grids/common/events.d.ts +30 -30
  18. package/lib/grids/common/grid.interface.d.ts +49 -49
  19. package/lib/grids/common/strategy.d.ts +1 -1
  20. package/lib/grids/common/types.d.ts +2 -2
  21. package/lib/grids/grid-base.directive.d.ts +2 -1
  22. package/migrations/update-18_0_0/index.js +1 -1
  23. package/package.json +1 -1
  24. package/styles/maps/igniteui-angular-dark.css.map +1 -1
  25. package/styles/maps/igniteui-angular.css.map +1 -1
  26. package/styles/maps/igniteui-bootstrap-dark.css.map +1 -1
  27. package/styles/maps/igniteui-bootstrap-light.css.map +1 -1
  28. package/styles/maps/igniteui-dark-green.css.map +1 -1
  29. package/styles/maps/igniteui-fluent-dark-excel.css.map +1 -1
  30. package/styles/maps/igniteui-fluent-dark-word.css.map +1 -1
  31. package/styles/maps/igniteui-fluent-dark.css.map +1 -1
  32. package/styles/maps/igniteui-fluent-light-excel.css.map +1 -1
  33. package/styles/maps/igniteui-fluent-light-word.css.map +1 -1
  34. package/styles/maps/igniteui-fluent-light.css.map +1 -1
  35. package/styles/maps/igniteui-indigo-dark.css.map +1 -1
  36. package/styles/maps/igniteui-indigo-light.css.map +1 -1
@@ -5,7 +5,7 @@ import { NgModel, NgControl, FormControlName, NG_VALUE_ACCESSOR, Validators, NG_
5
5
  import { Observable, Subject, fromEvent, interval, animationFrameScheduler, noop, merge, Subscription, timer, pipe, takeUntil as takeUntil$1 } from 'rxjs';
6
6
  import { takeUntil, filter, first as first$2, throttle, throttleTime, startWith, take, debounce, tap, switchMap, skipLast, debounceTime, map, shareReplay, takeWhile, pluck } from 'rxjs/operators';
7
7
  import { isPlatformBrowser, formatDate as formatDate$1, CurrencyPipe, formatPercent, formatNumber, getLocaleCurrencyCode, DatePipe, getLocaleDateFormat, FormatWidth, getLocaleDateTimeFormat, DOCUMENT, NgTemplateOutlet, NgIf, NgClass, NgSwitch, NgSwitchCase, NgSwitchDefault, NgFor, TitleCasePipe, getLocaleFirstDayOfWeek, NgStyle, getLocaleCurrencySymbol, formatCurrency as formatCurrency$1, getLocaleNumberFormat, NumberFormatStyle, DecimalPipe, PercentPipe, getCurrencySymbol, AsyncPipe } from '@angular/common';
8
- import { mergeWith } from 'lodash-es';
8
+ import { mergeWith, isEqual as isEqual$1 } from 'lodash-es';
9
9
  import { strToU8, zip } from 'fflate';
10
10
  import * as i1 from '@angular/animations';
11
11
  import { style, animate, useAnimation } from '@angular/animations';
@@ -375,14 +375,6 @@ const isEqual = (obj1, obj2) => {
375
375
  }
376
376
  return obj1 === obj2;
377
377
  };
378
- /**
379
- * Checks if provided variable is the value NaN
380
- *
381
- * @param value Value to check
382
- * @returns true if provided variable is NaN
383
- * @hidden
384
- */
385
- const isNaNvalue = (value) => isNaN(value) && value !== undefined && typeof value !== 'string';
386
378
  /**
387
379
  * Utility service taking care of various utility functions such as
388
380
  * detecting browser features, general cross browser DOM manipulation, etc.
@@ -1067,7 +1059,7 @@ class NoopSortingStrategy {
1067
1059
  }
1068
1060
  /**
1069
1061
  * Represents a class extending the IgxSorting class
1070
- * Provids custom data record sorting.
1062
+ * Provides custom data record sorting.
1071
1063
  */
1072
1064
  class IgxDataRecordSorting extends IgxSorting {
1073
1065
  /**
@@ -12650,6 +12642,11 @@ class IgxForOfSyncService {
12650
12642
  */
12651
12643
  setMaster(directive, forced = false) {
12652
12644
  const orientation = directive.igxForScrollOrientation;
12645
+ // in case master is not in dom, set a new master
12646
+ const isMasterInDom = this._master.get(orientation)?.dc?.instance?._viewContainer.element.nativeElement.isConnected;
12647
+ if (!isMasterInDom) {
12648
+ forced = true;
12649
+ }
12653
12650
  if (orientation && (forced || !this._master.has(orientation))) {
12654
12651
  this._master.set(orientation, directive);
12655
12652
  }
@@ -14075,7 +14072,7 @@ class IgxGridForOfDirective extends IgxForOfDirective {
14075
14072
  }
14076
14073
  if (this.igxForScrollOrientation === 'horizontal') {
14077
14074
  // in case collection has changes, reset sync service
14078
- this.syncService.setMaster(this, true);
14075
+ this.syncService.setMaster(this, this.igxGridForOfUniqueSizeCache);
14079
14076
  }
14080
14077
  }
14081
14078
  const defaultItemSize = 'igxForItemSize';
@@ -31617,6 +31614,10 @@ class IgxMonthPickerComponent extends IgxCalendarBaseDirective {
31617
31614
  if (this.isDecadeView) {
31618
31615
  this.viewDate = CalendarDay.from(this.viewDate).add('year', -15).native;
31619
31616
  }
31617
+ this.viewDateChanged.emit({
31618
+ previousValue: this.previousViewDate,
31619
+ currentValue: this.viewDate,
31620
+ });
31620
31621
  }
31621
31622
  /**
31622
31623
  * @hidden
@@ -31630,6 +31631,10 @@ class IgxMonthPickerComponent extends IgxCalendarBaseDirective {
31630
31631
  if (this.isDecadeView) {
31631
31632
  this.viewDate = CalendarDay.from(this.viewDate).add('year', 15).native;
31632
31633
  }
31634
+ this.viewDateChanged.emit({
31635
+ previousValue: this.previousViewDate,
31636
+ currentValue: this.viewDate,
31637
+ });
31633
31638
  }
31634
31639
  /**
31635
31640
  * @hidden
@@ -36458,9 +36463,7 @@ class IgxComboBaseDirective {
36458
36463
  return keys;
36459
36464
  }
36460
36465
  return keys.map(key => {
36461
- const item = isNaNvalue(key)
36462
- ? this.data.find(entry => isNaNvalue(entry[this.valueKey]))
36463
- : this.data.find(entry => entry[this.valueKey] === key);
36466
+ const item = this.data.find(entry => isEqual$1(entry[this.valueKey], key));
36464
36467
  return item !== undefined ? item : { [this.valueKey]: key };
36465
36468
  });
36466
36469
  }
@@ -37580,7 +37583,6 @@ class IgxSimpleComboComponent extends IgxComboBaseDirective {
37580
37583
  this.filterValue = this.searchValue = this.comboInput.value;
37581
37584
  return;
37582
37585
  }
37583
- this.filterValue = this.searchValue = '';
37584
37586
  });
37585
37587
  this.dropdown.opened.pipe(takeUntil(this.destroy$)).subscribe(() => {
37586
37588
  if (this.composing) {
@@ -37617,12 +37619,12 @@ class IgxSimpleComboComponent extends IgxComboBaseDirective {
37617
37619
  }
37618
37620
  /** @hidden @internal */
37619
37621
  handleInputChange(event) {
37620
- if (event !== undefined) {
37621
- this.filterValue = this.searchValue = typeof event === 'string' ? event : event.target.value;
37622
- }
37623
37622
  if (this.collapsed && this.comboInput.focused) {
37624
37623
  this.open();
37625
37624
  }
37625
+ if (event !== undefined) {
37626
+ this.filterValue = this.searchValue = typeof event === 'string' ? event : event.target.value;
37627
+ }
37626
37628
  if (!this.comboInput.value.trim() && super.selection.length) {
37627
37629
  // handle clearing of input by space
37628
37630
  this.clearSelection();
@@ -37630,7 +37632,19 @@ class IgxSimpleComboComponent extends IgxComboBaseDirective {
37630
37632
  this.filterValue = '';
37631
37633
  }
37632
37634
  if (super.selection.length) {
37633
- this.selectionService.clear(this.id);
37635
+ const args = {
37636
+ newValue: undefined,
37637
+ oldValue: this.selectedItem,
37638
+ newSelection: undefined,
37639
+ oldSelection: this.selection,
37640
+ displayText: typeof event === 'string' ? event : event?.target?.value,
37641
+ owner: this,
37642
+ cancel: false
37643
+ };
37644
+ this.selectionChanging.emit(args);
37645
+ if (!args.cancel) {
37646
+ this.selectionService.select_items(this.id, [], true);
37647
+ }
37634
37648
  }
37635
37649
  // when filtering the focused item should be the first item or the currently selected item
37636
37650
  if (!this.dropdown.focusedItem || this.dropdown.focusedItem.id !== this.dropdown.items[0].id) {
@@ -37718,12 +37732,15 @@ class IgxSimpleComboComponent extends IgxComboBaseDirective {
37718
37732
  if (this.disabled) {
37719
37733
  return;
37720
37734
  }
37735
+ const oldSelection = this.selection;
37721
37736
  this.clearSelection(true);
37722
37737
  if (!this.collapsed) {
37723
37738
  this.focusSearchInput(true);
37724
37739
  }
37725
37740
  event.stopPropagation();
37726
- this.comboInput.value = this.filterValue = this.searchValue = '';
37741
+ if (this.selection !== oldSelection) {
37742
+ this.comboInput.value = this.filterValue = this.searchValue = '';
37743
+ }
37727
37744
  this.dropdown.focusedItem = null;
37728
37745
  this.composing = false;
37729
37746
  this.comboInput.focus();
@@ -37802,6 +37819,14 @@ class IgxSimpleComboComponent extends IgxComboBaseDirective {
37802
37819
  else if (this.isRemote) {
37803
37820
  this.registerRemoteEntries(newValueAsArray, false);
37804
37821
  }
37822
+ else {
37823
+ args.displayText = this.createDisplayText(oldItems, []);
37824
+ const oldSelectionArray = args.oldSelection ? [args.oldSelection] : [];
37825
+ this.comboInput.value = this._displayValue = this.searchValue = this.createDisplayText(oldSelectionArray, []);
37826
+ if (this.isRemote) {
37827
+ this.registerRemoteEntries(newValueAsArray, false);
37828
+ }
37829
+ }
37805
37830
  }
37806
37831
  createDisplayText(newSelection, oldSelection) {
37807
37832
  if (this.isRemote) {
@@ -37862,7 +37887,10 @@ class IgxSimpleComboComponent extends IgxComboBaseDirective {
37862
37887
  }
37863
37888
  clear() {
37864
37889
  this.clearSelection(true);
37865
- this.comboInput.value = this._displayValue = this.searchValue = '';
37890
+ const oldSelection = this.selection;
37891
+ if (this.selection !== oldSelection) {
37892
+ this.comboInput.value = this._displayValue = this.searchValue = '';
37893
+ }
37866
37894
  }
37867
37895
  isValid(value) {
37868
37896
  return this.required
@@ -61138,6 +61166,12 @@ class IgxGridBaseDirective {
61138
61166
  get pagingState() {
61139
61167
  return this._pagingState;
61140
61168
  }
61169
+ /**
61170
+ * Represents the last search information.
61171
+ */
61172
+ get lastSearchInfo() {
61173
+ return this._lastSearchInfo;
61174
+ }
61141
61175
  /** @hidden @internal */
61142
61176
  get paginator() {
61143
61177
  return this.paginationComponents?.first;
@@ -62000,18 +62034,6 @@ class IgxGridBaseDirective {
62000
62034
  * @hidden @internal
62001
62035
  */
62002
62036
  this.disableTransitions = false;
62003
- /**
62004
- * Represents the last search information.
62005
- */
62006
- this.lastSearchInfo = {
62007
- searchText: '',
62008
- caseSensitive: false,
62009
- exactMatch: false,
62010
- activeMatchIndex: 0,
62011
- matchInfoCache: [],
62012
- matchCount: 0,
62013
- content: ''
62014
- };
62015
62037
  /**
62016
62038
  * @hidden @internal
62017
62039
  */
@@ -62125,6 +62147,15 @@ class IgxGridBaseDirective {
62125
62147
  this._filterStrategy = new FilteringStrategy();
62126
62148
  this._autoGeneratedCols = [];
62127
62149
  this._dataView = [];
62150
+ this._lastSearchInfo = {
62151
+ searchText: '',
62152
+ caseSensitive: false,
62153
+ exactMatch: false,
62154
+ activeMatchIndex: 0,
62155
+ matchInfoCache: [],
62156
+ matchCount: 0,
62157
+ content: ''
62158
+ };
62128
62159
  this._rowEditable = false;
62129
62160
  this._filteredSortedData = null;
62130
62161
  this._filteredData = null;
@@ -63797,20 +63828,20 @@ class IgxGridBaseDirective {
63797
63828
  * @param updateActiveInfo
63798
63829
  */
63799
63830
  refreshSearch(updateActiveInfo, endEdit = true) {
63800
- if (this.lastSearchInfo.searchText) {
63831
+ if (this._lastSearchInfo.searchText) {
63801
63832
  this.rebuildMatchCache();
63802
63833
  if (updateActiveInfo) {
63803
63834
  const activeInfo = this.textHighlightService.highlightGroupsMap.get(this.id);
63804
- this.lastSearchInfo.matchInfoCache.forEach((match, i) => {
63835
+ this._lastSearchInfo.matchInfoCache.forEach((match, i) => {
63805
63836
  if (match.column === activeInfo.column &&
63806
63837
  match.row === activeInfo.row &&
63807
63838
  match.index === activeInfo.index &&
63808
63839
  compareMaps(match.metadata, activeInfo.metadata)) {
63809
- this.lastSearchInfo.activeMatchIndex = i;
63840
+ this._lastSearchInfo.activeMatchIndex = i;
63810
63841
  }
63811
63842
  });
63812
63843
  }
63813
- return this.find(this.lastSearchInfo.searchText, 0, this.lastSearchInfo.caseSensitive, this.lastSearchInfo.exactMatch, false, endEdit);
63844
+ return this.find(this._lastSearchInfo.searchText, 0, this._lastSearchInfo.caseSensitive, this._lastSearchInfo.exactMatch, false, endEdit);
63814
63845
  }
63815
63846
  else {
63816
63847
  return 0;
@@ -63825,7 +63856,7 @@ class IgxGridBaseDirective {
63825
63856
  * ```
63826
63857
  */
63827
63858
  clearSearch() {
63828
- this.lastSearchInfo = {
63859
+ this._lastSearchInfo = {
63829
63860
  searchText: '',
63830
63861
  caseSensitive: false,
63831
63862
  exactMatch: false,
@@ -66008,10 +66039,10 @@ class IgxGridBaseDirective {
66008
66039
  const caseSensitiveResolved = caseSensitive ? true : false;
66009
66040
  const exactMatchResolved = exactMatch ? true : false;
66010
66041
  let rebuildCache = false;
66011
- if (this.lastSearchInfo.searchText !== text ||
66012
- this.lastSearchInfo.caseSensitive !== caseSensitiveResolved ||
66013
- this.lastSearchInfo.exactMatch !== exactMatchResolved) {
66014
- this.lastSearchInfo = {
66042
+ if (this._lastSearchInfo.searchText !== text ||
66043
+ this._lastSearchInfo.caseSensitive !== caseSensitiveResolved ||
66044
+ this._lastSearchInfo.exactMatch !== exactMatchResolved) {
66045
+ this._lastSearchInfo = {
66015
66046
  searchText: text,
66016
66047
  activeMatchIndex: 0,
66017
66048
  caseSensitive: caseSensitiveResolved,
@@ -66023,7 +66054,7 @@ class IgxGridBaseDirective {
66023
66054
  rebuildCache = true;
66024
66055
  }
66025
66056
  else {
66026
- this.lastSearchInfo.activeMatchIndex += increment;
66057
+ this._lastSearchInfo.activeMatchIndex += increment;
66027
66058
  }
66028
66059
  if (rebuildCache) {
66029
66060
  this.rowList.forEach((row) => {
@@ -66035,15 +66066,15 @@ class IgxGridBaseDirective {
66035
66066
  });
66036
66067
  this.rebuildMatchCache();
66037
66068
  }
66038
- if (this.lastSearchInfo.activeMatchIndex >= this.lastSearchInfo.matchCount) {
66039
- this.lastSearchInfo.activeMatchIndex = 0;
66069
+ if (this._lastSearchInfo.activeMatchIndex >= this._lastSearchInfo.matchCount) {
66070
+ this._lastSearchInfo.activeMatchIndex = 0;
66040
66071
  }
66041
- else if (this.lastSearchInfo.activeMatchIndex < 0) {
66042
- this.lastSearchInfo.activeMatchIndex = this.lastSearchInfo.matchCount - 1;
66072
+ else if (this._lastSearchInfo.activeMatchIndex < 0) {
66073
+ this._lastSearchInfo.activeMatchIndex = this._lastSearchInfo.matchCount - 1;
66043
66074
  }
66044
- if (this.lastSearchInfo.matchCount > 0) {
66045
- const matchInfo = this.lastSearchInfo.matchInfoCache[this.lastSearchInfo.activeMatchIndex];
66046
- this.lastSearchInfo = { ...this.lastSearchInfo };
66075
+ if (this._lastSearchInfo.matchCount > 0) {
66076
+ const matchInfo = this._lastSearchInfo.matchInfoCache[this._lastSearchInfo.activeMatchIndex];
66077
+ this._lastSearchInfo = { ...this._lastSearchInfo };
66047
66078
  if (scroll !== false) {
66048
66079
  this.scrollTo(matchInfo.row, matchInfo.column);
66049
66080
  }
@@ -66057,13 +66088,13 @@ class IgxGridBaseDirective {
66057
66088
  else {
66058
66089
  this.textHighlightService.clearActiveHighlight(this.id);
66059
66090
  }
66060
- return this.lastSearchInfo.matchCount;
66091
+ return this._lastSearchInfo.matchCount;
66061
66092
  }
66062
66093
  rebuildMatchCache() {
66063
- this.lastSearchInfo.matchInfoCache = [];
66064
- const caseSensitive = this.lastSearchInfo.caseSensitive;
66065
- const exactMatch = this.lastSearchInfo.exactMatch;
66066
- const searchText = caseSensitive ? this.lastSearchInfo.searchText : this.lastSearchInfo.searchText.toLowerCase();
66094
+ this._lastSearchInfo.matchInfoCache = [];
66095
+ const caseSensitive = this._lastSearchInfo.caseSensitive;
66096
+ const exactMatch = this._lastSearchInfo.exactMatch;
66097
+ const searchText = caseSensitive ? this._lastSearchInfo.searchText : this._lastSearchInfo.searchText.toLowerCase();
66067
66098
  const data = this.filteredSortedData;
66068
66099
  const columnItems = this.visibleColumns.filter((c) => !c.columnGroup).sort((c1, c2) => c1.visibleIndex - c2.visibleIndex);
66069
66100
  data.forEach((dataRow, rowIndex) => {
@@ -66084,7 +66115,7 @@ class IgxGridBaseDirective {
66084
66115
  index: 0,
66085
66116
  metadata: new Map([['pinned', this.isRecordPinnedByIndex(rowIndex)]])
66086
66117
  };
66087
- this.lastSearchInfo.matchInfoCache.push(mic);
66118
+ this._lastSearchInfo.matchInfoCache.push(mic);
66088
66119
  }
66089
66120
  }
66090
66121
  else {
@@ -66097,7 +66128,7 @@ class IgxGridBaseDirective {
66097
66128
  index: occurrenceIndex++,
66098
66129
  metadata: new Map([['pinned', this.isRecordPinnedByIndex(rowIndex)]])
66099
66130
  };
66100
- this.lastSearchInfo.matchInfoCache.push(mic);
66131
+ this._lastSearchInfo.matchInfoCache.push(mic);
66101
66132
  searchValue = searchValue.substring(searchIndex + searchText.length);
66102
66133
  searchIndex = searchValue.indexOf(searchText);
66103
66134
  }
@@ -66105,7 +66136,7 @@ class IgxGridBaseDirective {
66105
66136
  }
66106
66137
  });
66107
66138
  });
66108
- this.lastSearchInfo.matchCount = this.lastSearchInfo.matchInfoCache.length;
66139
+ this._lastSearchInfo.matchCount = this._lastSearchInfo.matchInfoCache.length;
66109
66140
  }
66110
66141
  updateDefaultRowHeight() {
66111
66142
  if (this.dataRowList.length > 0 && this.dataRowList.first.cells && this.dataRowList.first.cells.length > 0) {
@@ -81891,7 +81922,7 @@ class IgxHierarchicalGridComponent extends IgxHierarchicalGridBaseDirective {
81891
81922
  const colLength = this.columns.length;
81892
81923
  const topCols = this.columnList.filter((item) => colsArray.indexOf(item) === -1);
81893
81924
  if (topCols.length > 0) {
81894
- this.updateColumns(topCols);
81925
+ this.initColumns(topCols, (col) => this.columnInit.emit(col));
81895
81926
  if (recalcColSizes && this.columns.length !== colLength) {
81896
81927
  this.calculateGridSizes(false);
81897
81928
  }