igniteui-angular 17.2.23 → 17.2.25
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.
- package/esm2022/lib/combo/combo.common.mjs +8 -17
- package/esm2022/lib/combo/combo.component.mjs +3 -3
- package/esm2022/lib/grids/filtering/excel-style/excel-style-filtering.component.mjs +14 -1
- package/esm2022/lib/navigation-drawer/navigation-drawer.component.mjs +3 -3
- package/esm2022/lib/query-builder/query-builder.component.mjs +18 -3
- package/esm2022/lib/services/exporter-common/export-utilities.mjs +4 -2
- package/esm2022/lib/slider/slider.component.mjs +4 -4
- package/fesm2022/igniteui-angular.mjs +47 -26
- package/fesm2022/igniteui-angular.mjs.map +1 -1
- package/lib/combo/combo.common.d.ts +1 -3
- package/lib/core/styles/components/dialog/_dialog-theme.scss +5 -12
- package/lib/core/styles/components/drop-down/_drop-down-theme.scss +10 -4
- package/lib/core/styles/typography/_bootstrap.scss +3 -3
- package/lib/core/styles/typography/_fluent.scss +9 -2
- package/lib/grids/filtering/excel-style/excel-style-filtering.component.d.ts +1 -0
- package/package.json +1 -1
- package/styles/igniteui-angular-dark.css +1 -1
- package/styles/igniteui-angular.css +1 -1
- package/styles/igniteui-bootstrap-dark.css +1 -1
- package/styles/igniteui-bootstrap-light.css +1 -1
- package/styles/igniteui-dark-green.css +1 -1
- package/styles/igniteui-fluent-dark-excel.css +1 -1
- package/styles/igniteui-fluent-dark-word.css +1 -1
- package/styles/igniteui-fluent-dark.css +1 -1
- package/styles/igniteui-fluent-light-excel.css +1 -1
- package/styles/igniteui-fluent-light-word.css +1 -1
- package/styles/igniteui-fluent-light.css +1 -1
- package/styles/igniteui-indigo-dark.css +1 -1
- package/styles/igniteui-indigo-light.css +1 -1
- package/styles/maps/igniteui-angular-dark.css.map +1 -1
- package/styles/maps/igniteui-angular.css.map +1 -1
- package/styles/maps/igniteui-bootstrap-dark.css.map +1 -1
- package/styles/maps/igniteui-bootstrap-light.css.map +1 -1
- package/styles/maps/igniteui-dark-green.css.map +1 -1
- package/styles/maps/igniteui-fluent-dark-excel.css.map +1 -1
- package/styles/maps/igniteui-fluent-dark-word.css.map +1 -1
- package/styles/maps/igniteui-fluent-dark.css.map +1 -1
- package/styles/maps/igniteui-fluent-light-excel.css.map +1 -1
- package/styles/maps/igniteui-fluent-light-word.css.map +1 -1
- package/styles/maps/igniteui-fluent-light.css.map +1 -1
- package/styles/maps/igniteui-indigo-dark.css.map +1 -1
- package/styles/maps/igniteui-indigo-light.css.map +1 -1
|
@@ -1328,7 +1328,9 @@ class ExportUtilities {
|
|
|
1328
1328
|
.replace(/</g, '<')
|
|
1329
1329
|
.replace(/>/g, '>')
|
|
1330
1330
|
.replace(/"/g, '"')
|
|
1331
|
-
.replace(/'/g, ''')
|
|
1331
|
+
.replace(/'/g, ''')
|
|
1332
|
+
// Bug #14944 - Remove the not supported null character (\u0000, \x00)
|
|
1333
|
+
.replace(/\x00/g, '');
|
|
1332
1334
|
}
|
|
1333
1335
|
}
|
|
1334
1336
|
}
|
|
@@ -35689,17 +35691,11 @@ class IgxComboBaseDirective extends DisplayDensityBase {
|
|
|
35689
35691
|
return;
|
|
35690
35692
|
}
|
|
35691
35693
|
const selection = this.selectionService.get(this._id);
|
|
35694
|
+
this.selectionService.clear(this._id);
|
|
35692
35695
|
this._id = value;
|
|
35693
35696
|
if (selection) {
|
|
35694
35697
|
this.selectionService.set(this._id, selection);
|
|
35695
35698
|
}
|
|
35696
|
-
if (this.dropdown?.open) {
|
|
35697
|
-
this.dropdown.close();
|
|
35698
|
-
}
|
|
35699
|
-
if (this.inputGroup?.isFocused) {
|
|
35700
|
-
this.inputGroup.element.nativeElement.blur();
|
|
35701
|
-
this.inputGroup.isFocused = false;
|
|
35702
|
-
}
|
|
35703
35699
|
}
|
|
35704
35700
|
/**
|
|
35705
35701
|
* Configures the drop down list height
|
|
@@ -36569,13 +36565,14 @@ class IgxComboBaseDirective extends DisplayDensityBase {
|
|
|
36569
36565
|
if (!e.event) {
|
|
36570
36566
|
this.comboInput?.nativeElement.focus();
|
|
36571
36567
|
}
|
|
36568
|
+
else {
|
|
36569
|
+
this._onTouchedCallback();
|
|
36570
|
+
this.updateValidity();
|
|
36571
|
+
}
|
|
36572
36572
|
}
|
|
36573
36573
|
/** @hidden @internal */
|
|
36574
36574
|
handleClosed() {
|
|
36575
36575
|
this.closed.emit({ owner: this });
|
|
36576
|
-
if (this.comboInput.nativeElement !== document.activeElement) {
|
|
36577
|
-
this.validateComboState();
|
|
36578
|
-
}
|
|
36579
36576
|
}
|
|
36580
36577
|
/** @hidden @internal */
|
|
36581
36578
|
handleKeyDown(event) {
|
|
@@ -36609,14 +36606,10 @@ class IgxComboBaseDirective extends DisplayDensityBase {
|
|
|
36609
36606
|
onBlur() {
|
|
36610
36607
|
if (this.collapsed) {
|
|
36611
36608
|
this._onTouchedCallback();
|
|
36612
|
-
this.
|
|
36609
|
+
this.updateValidity();
|
|
36613
36610
|
}
|
|
36614
36611
|
}
|
|
36615
36612
|
/** @hidden @internal */
|
|
36616
|
-
onFocus() {
|
|
36617
|
-
this._onTouchedCallback();
|
|
36618
|
-
}
|
|
36619
|
-
/** @hidden @internal */
|
|
36620
36613
|
setActiveDescendant() {
|
|
36621
36614
|
this.activeDescendant = this.dropdown.focusedItem?.id || '';
|
|
36622
36615
|
}
|
|
@@ -36624,7 +36617,7 @@ class IgxComboBaseDirective extends DisplayDensityBase {
|
|
|
36624
36617
|
toggleCaseSensitive() {
|
|
36625
36618
|
this.filteringOptions = Object.assign({}, this.filteringOptions, { caseSensitive: !this.filteringOptions.caseSensitive });
|
|
36626
36619
|
}
|
|
36627
|
-
|
|
36620
|
+
updateValidity() {
|
|
36628
36621
|
if (this.ngControl && this.ngControl.invalid) {
|
|
36629
36622
|
this.valid = IgxInputState.INVALID;
|
|
36630
36623
|
}
|
|
@@ -37525,7 +37518,7 @@ class IgxComboComponent extends IgxComboBaseDirective {
|
|
|
37525
37518
|
IgxComboAPIService,
|
|
37526
37519
|
{ provide: IGX_COMBO_COMPONENT, useExisting: IgxComboComponent },
|
|
37527
37520
|
{ provide: NG_VALUE_ACCESSOR, useExisting: IgxComboComponent, multi: true }
|
|
37528
|
-
], viewQueries: [{ propertyName: "dropdown", first: true, predicate: IgxComboDropDownComponent, descendants: true, static: true }], usesInheritance: true, ngImport: i0, template: "<igx-input-group #inputGroup [displayDensity]=\"displayDensity\" [type]=\"type\" (click)=\"onClick($event)\">\n <ng-container ngProjectAs=\"[igxLabel]\">\n <ng-content select=\"[igxLabel]\"></ng-content>\n </ng-container>\n <ng-container ngProjectAs=\"igx-prefix\">\n <ng-content select=\"igx-prefix\"></ng-content>\n </ng-container>\n <ng-container ngProjectAs=\"igx-hint, [igxHint]\">\n <ng-content select=\"igx-hint, [igxHint]\"></ng-content>\n </ng-container>\n <input igxInput #comboInput name=\"comboInput\" type=\"text\" [value]=\"displayValue\" readonly\n [attr.placeholder]=\"placeholder\" [disabled]=\"disabled\"\n role=\"combobox\" aria-haspopup=\"listbox\"\n [attr.aria-expanded]=\"!dropdown.collapsed\" [attr.aria-controls]=\"dropdown.listId\"\n [attr.aria-labelledby]=\"ariaLabelledBy || label?.id || placeholder\"\n (blur)=\"onBlur()\"
|
|
37521
|
+
], viewQueries: [{ propertyName: "dropdown", first: true, predicate: IgxComboDropDownComponent, descendants: true, static: true }], usesInheritance: true, ngImport: i0, template: "<igx-input-group #inputGroup [displayDensity]=\"displayDensity\" [type]=\"type\" (click)=\"onClick($event)\">\n <ng-container ngProjectAs=\"[igxLabel]\">\n <ng-content select=\"[igxLabel]\"></ng-content>\n </ng-container>\n <ng-container ngProjectAs=\"igx-prefix\">\n <ng-content select=\"igx-prefix\"></ng-content>\n </ng-container>\n <ng-container ngProjectAs=\"igx-hint, [igxHint]\">\n <ng-content select=\"igx-hint, [igxHint]\"></ng-content>\n </ng-container>\n <input igxInput #comboInput name=\"comboInput\" type=\"text\" [value]=\"displayValue\" readonly\n [attr.placeholder]=\"placeholder\" [disabled]=\"disabled\"\n role=\"combobox\" aria-haspopup=\"listbox\"\n [attr.aria-expanded]=\"!dropdown.collapsed\" [attr.aria-controls]=\"dropdown.listId\"\n [attr.aria-labelledby]=\"ariaLabelledBy || label?.id || placeholder\"\n (blur)=\"onBlur()\" />\n <ng-container ngProjectAs=\"igx-suffix\">\n <ng-content select=\"igx-suffix\"></ng-content>\n </ng-container>\n <igx-suffix *ngIf=\"displayValue\" [attr.aria-label]=\"resourceStrings.igx_combo_clearItems_placeholder\" class=\"igx-combo__clear-button\"\n (click)=\"handleClearItems($event)\">\n <ng-container *ngIf=\"clearIconTemplate\">\n <ng-container *ngTemplateOutlet=\"clearIconTemplate\"></ng-container>\n </ng-container>\n <igx-icon *ngIf=\"!clearIconTemplate\">\n {{ clearIcon }}\n </igx-icon>\n </igx-suffix>\n <igx-suffix class=\"igx-combo__toggle-button\">\n <ng-container *ngIf=\"toggleIconTemplate\">\n <ng-container *ngTemplateOutlet=\"toggleIconTemplate; context: {$implicit: collapsed}\"></ng-container>\n </ng-container>\n <igx-icon *ngIf=\"!toggleIconTemplate\">\n {{ toggleIcon }}\n </igx-icon>\n </igx-suffix>\n</igx-input-group>\n<igx-combo-drop-down #igxComboDropDown class=\"igx-combo__drop-down\" [displayDensity]=\"displayDensity\"\n [labelledBy]=\"ariaLabelledBy || label?.id || placeholder || ''\"\n [width]=\"itemsWidth || '100%'\" (opening)=\"handleOpening($event)\" (closing)=\"handleClosing($event)\"\n (opened)=\"handleOpened()\" (closed)=\"handleClosed()\">\n <div class=\"igx-combo__search\">\n <igx-input-group *ngIf=\"displaySearchInput\" [displayDensity]=\"displayDensity\" theme=\"material\" >\n <input igxInput #searchInput name=\"searchInput\" autocomplete=\"off\" type=\"text\"\n [(ngModel)]=\"searchValue\" (ngModelChange)=\"handleInputChange($event)\" (keyup)=\"handleKeyUp($event)\"\n (keydown)=\"handleKeyDown($event)\" (focus)=\"dropdown.onBlur($event)\" [attr.placeholder]=\"searchPlaceholder\"\n aria-autocomplete=\"list\" role=\"searchbox\" aria-label=\"search\"/>\n <igx-suffix *ngIf=\"showSearchCaseIcon\" (click)=\"toggleCaseSensitive()\">\n <span [ngClass]=\"filteringOptions.caseSensitive? 'igx-combo__case-icon--active' : 'igx-combo__case-icon'\">\n <igx-icon family=\"imx-icons\" name=\"case-sensitive\" [active]=\"filteringOptions.caseSensitive\"></igx-icon>\n </span>\n </igx-suffix>\n </igx-input-group>\n </div>\n <ng-container *ngTemplateOutlet=\"headerTemplate\">\n </ng-container>\n <div #dropdownItemContainer class=\"igx-combo__content\" [style.overflow]=\"'hidden'\"\n [style.maxHeight.rem]=\"itemsMaxHeightInRem\" [igxDropDownItemNavigation]=\"dropdown\" (focus)=\"dropdown.onFocus()\"\n [tabindex]=\"dropdown.collapsed ? -1 : 0\" [attr.id]=\"dropdown.id\" aria-multiselectable=\"true\"\n [attr.aria-activedescendant]=\"activeDescendant\">\n <igx-combo-item [itemHeight]=\"itemHeight\" *igxFor=\"let item of data\n | comboFiltering:filterValue:displayKey:filteringOptions:filterFunction\n | comboGrouping:groupKey:valueKey:groupSortingDirection:compareCollator;\n index as rowIndex; containerSize: itemsMaxHeight; scrollOrientation: 'vertical'; itemSize: itemHeight\"\n [value]=\"item\" [isHeader]=\"item?.isHeader\" [index]=\"rowIndex\" [role]=\"item?.isHeader? 'group' : 'option'\">\n <ng-container *ngIf=\"item?.isHeader\">\n <ng-container\n *ngTemplateOutlet=\"headerItemTemplate ? headerItemTemplate : headerItemBase;\n context: {$implicit: item, data: data, valueKey: valueKey, groupKey: groupKey, displayKey: displayKey}\">\n </ng-container>\n </ng-container>\n <!-- if item is 'null' it should be displayed and !!(item?.isHeader) would resolve it to 'false' and not display it -->\n <ng-container *ngIf=\"!item?.isHeader\">\n <ng-container #listItem\n *ngTemplateOutlet=\"template; context: {$implicit: item, data: data, valueKey: valueKey, displayKey: displayKey};\">\n </ng-container>\n </ng-container>\n </igx-combo-item>\n </div>\n <div class=\"igx-combo__add\" *ngIf=\"filteredData.length === 0 || isAddButtonVisible()\">\n <div class=\"igx-combo__empty\" *ngIf=\"filteredData.length === 0\">\n <ng-container *ngTemplateOutlet=\"emptyTemplate ? emptyTemplate : empty\">\n </ng-container>\n </div>\n <igx-combo-add-item [itemHeight]=\"itemHeight\" *ngIf=\"isAddButtonVisible()\"\n [tabindex]=\"dropdown.collapsed ? -1 : customValueFlag ? 1 : -1\" class=\"igx-combo__add-item\" role=\"button\"\n [attr.aria-label]=\"resourceStrings.igx_combo_addCustomValues_placeholder\" [index]=\"virtualScrollContainer.igxForOf.length\">\n <ng-container *ngTemplateOutlet=\"addItemTemplate ? addItemTemplate : addItemDefault\">\n </ng-container>\n </igx-combo-add-item>\n </div>\n <ng-container *ngTemplateOutlet=\"footerTemplate\">\n </ng-container>\n</igx-combo-drop-down>\n<ng-template #complex let-display let-data=\"data\" let-key=\"displayKey\">\n {{display[key]}}\n</ng-template>\n<ng-template #primitive let-display>\n {{display}}\n</ng-template>\n<ng-template #empty>\n <span>{{resourceStrings.igx_combo_empty_message}}</span>\n</ng-template>\n<ng-template #addItemDefault let-control>\n <button type=\"button\" igxButton=\"flat\" igxRipple>{{ resourceStrings.igx_combo_addCustomValues_placeholder }}</button>\n</ng-template>\n<ng-template #headerItemBase let-item let-key=\"valueKey\" let-groupKey=\"groupKey\">\n {{ item[key] }}\n</ng-template>\n", dependencies: [{ kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i4.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i4.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: IgxInputGroupComponent, selector: "igx-input-group", inputs: ["resourceStrings", "suppressInputAutofocus", "type", "theme"] }, { kind: "directive", type: IgxInputDirective, selector: "[igxInput]", inputs: ["value", "disabled", "required"], exportAs: ["igxInput"] }, { kind: "directive", type: IgxSuffixDirective, selector: "igx-suffix,[igxSuffix],[igxEnd]" }, { kind: "component", type: IgxIconComponent, selector: "igx-icon", inputs: ["family", "active", "name"] }, { kind: "component", type: IgxComboDropDownComponent, selector: "igx-combo-drop-down", inputs: ["singleMode"] }, { kind: "directive", type: IgxDropDownItemNavigationDirective, selector: "[igxDropDownItemNavigation]", inputs: ["igxDropDownItemNavigation"] }, { kind: "directive", type: IgxForOfDirective, selector: "[igxFor][igxForOf]", inputs: ["igxForOf", "igxForSizePropName", "igxForScrollOrientation", "igxForScrollContainer", "igxForContainerSize", "igxForItemSize", "igxForTotalItemCount", "igxForTrackBy"], outputs: ["chunkLoad", "scrollbarVisibilityChanged", "contentSizeChange", "dataChanged", "beforeViewDestroyed", "chunkPreload"] }, { kind: "component", type: IgxComboItemComponent, selector: "igx-combo-item", inputs: ["itemHeight", "ariaLabel", "singleMode"] }, { kind: "component", type: IgxComboAddItemComponent, selector: "igx-combo-add-item" }, { kind: "directive", type: IgxButtonDirective, selector: "[igxButton]", inputs: ["selected", "igxButton", "igxLabel"], outputs: ["buttonSelected"] }, { kind: "directive", type: IgxRippleDirective, selector: "[igxRipple]", inputs: ["igxRippleTarget", "igxRipple", "igxRippleDuration", "igxRippleCentered", "igxRippleDisabled"] }, { kind: "pipe", type: IgxComboFilteringPipe, name: "comboFiltering" }, { kind: "pipe", type: IgxComboGroupingPipe, name: "comboGrouping" }] }); }
|
|
37529
37522
|
}
|
|
37530
37523
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.4", ngImport: i0, type: IgxComboComponent, decorators: [{
|
|
37531
37524
|
type: Component,
|
|
@@ -37551,7 +37544,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.4", ngImpor
|
|
|
37551
37544
|
IgxRippleDirective,
|
|
37552
37545
|
IgxComboFilteringPipe,
|
|
37553
37546
|
IgxComboGroupingPipe
|
|
37554
|
-
], template: "<igx-input-group #inputGroup [displayDensity]=\"displayDensity\" [type]=\"type\" (click)=\"onClick($event)\">\n <ng-container ngProjectAs=\"[igxLabel]\">\n <ng-content select=\"[igxLabel]\"></ng-content>\n </ng-container>\n <ng-container ngProjectAs=\"igx-prefix\">\n <ng-content select=\"igx-prefix\"></ng-content>\n </ng-container>\n <ng-container ngProjectAs=\"igx-hint, [igxHint]\">\n <ng-content select=\"igx-hint, [igxHint]\"></ng-content>\n </ng-container>\n <input igxInput #comboInput name=\"comboInput\" type=\"text\" [value]=\"displayValue\" readonly\n [attr.placeholder]=\"placeholder\" [disabled]=\"disabled\"\n role=\"combobox\" aria-haspopup=\"listbox\"\n [attr.aria-expanded]=\"!dropdown.collapsed\" [attr.aria-controls]=\"dropdown.listId\"\n [attr.aria-labelledby]=\"ariaLabelledBy || label?.id || placeholder\"\n (blur)=\"onBlur()\"
|
|
37547
|
+
], template: "<igx-input-group #inputGroup [displayDensity]=\"displayDensity\" [type]=\"type\" (click)=\"onClick($event)\">\n <ng-container ngProjectAs=\"[igxLabel]\">\n <ng-content select=\"[igxLabel]\"></ng-content>\n </ng-container>\n <ng-container ngProjectAs=\"igx-prefix\">\n <ng-content select=\"igx-prefix\"></ng-content>\n </ng-container>\n <ng-container ngProjectAs=\"igx-hint, [igxHint]\">\n <ng-content select=\"igx-hint, [igxHint]\"></ng-content>\n </ng-container>\n <input igxInput #comboInput name=\"comboInput\" type=\"text\" [value]=\"displayValue\" readonly\n [attr.placeholder]=\"placeholder\" [disabled]=\"disabled\"\n role=\"combobox\" aria-haspopup=\"listbox\"\n [attr.aria-expanded]=\"!dropdown.collapsed\" [attr.aria-controls]=\"dropdown.listId\"\n [attr.aria-labelledby]=\"ariaLabelledBy || label?.id || placeholder\"\n (blur)=\"onBlur()\" />\n <ng-container ngProjectAs=\"igx-suffix\">\n <ng-content select=\"igx-suffix\"></ng-content>\n </ng-container>\n <igx-suffix *ngIf=\"displayValue\" [attr.aria-label]=\"resourceStrings.igx_combo_clearItems_placeholder\" class=\"igx-combo__clear-button\"\n (click)=\"handleClearItems($event)\">\n <ng-container *ngIf=\"clearIconTemplate\">\n <ng-container *ngTemplateOutlet=\"clearIconTemplate\"></ng-container>\n </ng-container>\n <igx-icon *ngIf=\"!clearIconTemplate\">\n {{ clearIcon }}\n </igx-icon>\n </igx-suffix>\n <igx-suffix class=\"igx-combo__toggle-button\">\n <ng-container *ngIf=\"toggleIconTemplate\">\n <ng-container *ngTemplateOutlet=\"toggleIconTemplate; context: {$implicit: collapsed}\"></ng-container>\n </ng-container>\n <igx-icon *ngIf=\"!toggleIconTemplate\">\n {{ toggleIcon }}\n </igx-icon>\n </igx-suffix>\n</igx-input-group>\n<igx-combo-drop-down #igxComboDropDown class=\"igx-combo__drop-down\" [displayDensity]=\"displayDensity\"\n [labelledBy]=\"ariaLabelledBy || label?.id || placeholder || ''\"\n [width]=\"itemsWidth || '100%'\" (opening)=\"handleOpening($event)\" (closing)=\"handleClosing($event)\"\n (opened)=\"handleOpened()\" (closed)=\"handleClosed()\">\n <div class=\"igx-combo__search\">\n <igx-input-group *ngIf=\"displaySearchInput\" [displayDensity]=\"displayDensity\" theme=\"material\" >\n <input igxInput #searchInput name=\"searchInput\" autocomplete=\"off\" type=\"text\"\n [(ngModel)]=\"searchValue\" (ngModelChange)=\"handleInputChange($event)\" (keyup)=\"handleKeyUp($event)\"\n (keydown)=\"handleKeyDown($event)\" (focus)=\"dropdown.onBlur($event)\" [attr.placeholder]=\"searchPlaceholder\"\n aria-autocomplete=\"list\" role=\"searchbox\" aria-label=\"search\"/>\n <igx-suffix *ngIf=\"showSearchCaseIcon\" (click)=\"toggleCaseSensitive()\">\n <span [ngClass]=\"filteringOptions.caseSensitive? 'igx-combo__case-icon--active' : 'igx-combo__case-icon'\">\n <igx-icon family=\"imx-icons\" name=\"case-sensitive\" [active]=\"filteringOptions.caseSensitive\"></igx-icon>\n </span>\n </igx-suffix>\n </igx-input-group>\n </div>\n <ng-container *ngTemplateOutlet=\"headerTemplate\">\n </ng-container>\n <div #dropdownItemContainer class=\"igx-combo__content\" [style.overflow]=\"'hidden'\"\n [style.maxHeight.rem]=\"itemsMaxHeightInRem\" [igxDropDownItemNavigation]=\"dropdown\" (focus)=\"dropdown.onFocus()\"\n [tabindex]=\"dropdown.collapsed ? -1 : 0\" [attr.id]=\"dropdown.id\" aria-multiselectable=\"true\"\n [attr.aria-activedescendant]=\"activeDescendant\">\n <igx-combo-item [itemHeight]=\"itemHeight\" *igxFor=\"let item of data\n | comboFiltering:filterValue:displayKey:filteringOptions:filterFunction\n | comboGrouping:groupKey:valueKey:groupSortingDirection:compareCollator;\n index as rowIndex; containerSize: itemsMaxHeight; scrollOrientation: 'vertical'; itemSize: itemHeight\"\n [value]=\"item\" [isHeader]=\"item?.isHeader\" [index]=\"rowIndex\" [role]=\"item?.isHeader? 'group' : 'option'\">\n <ng-container *ngIf=\"item?.isHeader\">\n <ng-container\n *ngTemplateOutlet=\"headerItemTemplate ? headerItemTemplate : headerItemBase;\n context: {$implicit: item, data: data, valueKey: valueKey, groupKey: groupKey, displayKey: displayKey}\">\n </ng-container>\n </ng-container>\n <!-- if item is 'null' it should be displayed and !!(item?.isHeader) would resolve it to 'false' and not display it -->\n <ng-container *ngIf=\"!item?.isHeader\">\n <ng-container #listItem\n *ngTemplateOutlet=\"template; context: {$implicit: item, data: data, valueKey: valueKey, displayKey: displayKey};\">\n </ng-container>\n </ng-container>\n </igx-combo-item>\n </div>\n <div class=\"igx-combo__add\" *ngIf=\"filteredData.length === 0 || isAddButtonVisible()\">\n <div class=\"igx-combo__empty\" *ngIf=\"filteredData.length === 0\">\n <ng-container *ngTemplateOutlet=\"emptyTemplate ? emptyTemplate : empty\">\n </ng-container>\n </div>\n <igx-combo-add-item [itemHeight]=\"itemHeight\" *ngIf=\"isAddButtonVisible()\"\n [tabindex]=\"dropdown.collapsed ? -1 : customValueFlag ? 1 : -1\" class=\"igx-combo__add-item\" role=\"button\"\n [attr.aria-label]=\"resourceStrings.igx_combo_addCustomValues_placeholder\" [index]=\"virtualScrollContainer.igxForOf.length\">\n <ng-container *ngTemplateOutlet=\"addItemTemplate ? addItemTemplate : addItemDefault\">\n </ng-container>\n </igx-combo-add-item>\n </div>\n <ng-container *ngTemplateOutlet=\"footerTemplate\">\n </ng-container>\n</igx-combo-drop-down>\n<ng-template #complex let-display let-data=\"data\" let-key=\"displayKey\">\n {{display[key]}}\n</ng-template>\n<ng-template #primitive let-display>\n {{display}}\n</ng-template>\n<ng-template #empty>\n <span>{{resourceStrings.igx_combo_empty_message}}</span>\n</ng-template>\n<ng-template #addItemDefault let-control>\n <button type=\"button\" igxButton=\"flat\" igxRipple>{{ resourceStrings.igx_combo_addCustomValues_placeholder }}</button>\n</ng-template>\n<ng-template #headerItemBase let-item let-key=\"valueKey\" let-groupKey=\"groupKey\">\n {{ item[key] }}\n</ng-template>\n" }]
|
|
37555
37548
|
}], ctorParameters: () => [{ type: i0.ElementRef }, { type: i0.ChangeDetectorRef }, { type: IgxSelectionAPIService }, { type: IgxComboAPIService }, { type: IgxIconService }, { type: undefined, decorators: [{
|
|
37556
37549
|
type: Optional
|
|
37557
37550
|
}, {
|
|
@@ -47236,10 +47229,25 @@ class IgxQueryBuilderComponent extends DisplayDensityBase {
|
|
|
47236
47229
|
*/
|
|
47237
47230
|
deleteGroup() {
|
|
47238
47231
|
const selectedGroup = this.contextualGroup;
|
|
47239
|
-
|
|
47232
|
+
let parent = selectedGroup.parent;
|
|
47240
47233
|
if (parent) {
|
|
47241
|
-
|
|
47234
|
+
let index = parent.children.indexOf(selectedGroup);
|
|
47242
47235
|
parent.children.splice(index, 1);
|
|
47236
|
+
if (parent.children.length === 0) {
|
|
47237
|
+
let childGroup = parent;
|
|
47238
|
+
parent = parent.parent;
|
|
47239
|
+
while (parent && parent.children.length === 1) {
|
|
47240
|
+
childGroup = parent;
|
|
47241
|
+
parent = parent.parent;
|
|
47242
|
+
}
|
|
47243
|
+
if (parent) {
|
|
47244
|
+
index = parent.children.indexOf(childGroup);
|
|
47245
|
+
parent.children.splice(index, 1);
|
|
47246
|
+
}
|
|
47247
|
+
else {
|
|
47248
|
+
this.rootGroup = null;
|
|
47249
|
+
}
|
|
47250
|
+
}
|
|
47243
47251
|
}
|
|
47244
47252
|
else {
|
|
47245
47253
|
this.rootGroup = null;
|
|
@@ -53483,6 +53491,11 @@ class IgxGridExcelStyleFilteringComponent extends BaseFilteringComponent {
|
|
|
53483
53491
|
renderValues() {
|
|
53484
53492
|
this.filterValues = this.generateFilterValues();
|
|
53485
53493
|
this.generateListData();
|
|
53494
|
+
this.expressionsList.forEach(expr => {
|
|
53495
|
+
if (this.column.dataType === GridColumnDataType.String && this.column.filteringIgnoreCase && expr.expression.searchVal) {
|
|
53496
|
+
this.modifyExpression(expr);
|
|
53497
|
+
}
|
|
53498
|
+
});
|
|
53486
53499
|
}
|
|
53487
53500
|
generateFilterValues() {
|
|
53488
53501
|
const formatValue = (value) => {
|
|
@@ -53508,6 +53521,14 @@ class IgxGridExcelStyleFilteringComponent extends BaseFilteringComponent {
|
|
|
53508
53521
|
const filterValues = new Set(this.expressionsList.reduce(processExpression, []));
|
|
53509
53522
|
return filterValues;
|
|
53510
53523
|
}
|
|
53524
|
+
modifyExpression(expr) {
|
|
53525
|
+
const lowerCaseFilterValues = new Set(Array.from(expr.expression.searchVal).map((value) => value.toLowerCase()));
|
|
53526
|
+
this.grid.data.forEach(item => {
|
|
53527
|
+
if (lowerCaseFilterValues.has(item[this.column.field]?.toLowerCase())) {
|
|
53528
|
+
expr.expression.searchVal.add(item[this.column.field]);
|
|
53529
|
+
}
|
|
53530
|
+
});
|
|
53531
|
+
}
|
|
53511
53532
|
generateListData() {
|
|
53512
53533
|
this.listData = new Array();
|
|
53513
53534
|
const shouldUpdateSelection = this.areExpressionsSelectable();
|
|
@@ -83384,11 +83405,11 @@ class IgxNavigationDrawerComponent {
|
|
|
83384
83405
|
});
|
|
83385
83406
|
}
|
|
83386
83407
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.2.4", ngImport: i0, type: IgxNavigationDrawerComponent, deps: [{ token: ElementRef }, { token: IgxNavigationService, optional: true }, { token: i0.Renderer2 }, { token: HammerGesturesManager }, { token: PlatformUtil }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
83387
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "16.1.0", version: "17.2.4", type: IgxNavigationDrawerComponent, isStandalone: true, selector: "igx-nav-drawer", inputs: { id: "id", position: "position", enableGestures: ["enableGestures", "enableGestures", booleanAttribute], pinThreshold: "pinThreshold", pin: ["pin", "pin", booleanAttribute], width: "width", disableAnimation: ["disableAnimation", "disableAnimation", booleanAttribute], miniWidth: "miniWidth", isOpen: ["isOpen", "isOpen", booleanAttribute] }, outputs: { isOpenChange: "isOpenChange", pinChange: "pinChange", opening: "opening", opened: "opened", closing: "closing", closed: "closed" }, host: { properties: { "class.igx-nav-drawer": "this.cssClass", "attr.id": "this.id", "class.igx-nav-drawer--disable-animation": "this.disableAnimation", "style.flexBasis": "this.flexWidth", "style.order": "this.isPinnedRight" } }, providers: [HammerGesturesManager], queries: [{ propertyName: "contentTemplate", first: true, predicate: IgxNavDrawerTemplateDirective, descendants: true, read: IgxNavDrawerTemplateDirective }, { propertyName: "miniTemplate", first: true, predicate: IgxNavDrawerMiniTemplateDirective, descendants: true, read: IgxNavDrawerMiniTemplateDirective }], viewQueries: [{ propertyName: "_drawer", first: true, predicate: ["aside"], descendants: true, static: true }, { propertyName: "_overlay", first: true, predicate: ["overlay"], descendants: true, static: true }, { propertyName: "_styleDummy", first: true, predicate: ["dummy"], descendants: true, static: true }], usesOnChanges: true, ngImport: i0, template: "<ng-template #defaultItemsTemplate>\n <div igxDrawerItem [isHeader]=\"true\">Navigation Drawer</div>\n <div igxDrawerItem> Start by adding</div>\n <div igxDrawerItem> <code><ng-template igxDrawer></code> </div>\n <div igxDrawerItem> And some items inside </div>\n <div igxDrawerItem> Style with igxDrawerItem </div>\n <div igxDrawerItem> and igxRipple directives</div>\n</ng-template>\n\n<div [hidden]=\"pin\"\n class=\"igx-nav-drawer__overlay\"\n [class.igx-nav-drawer__overlay--hidden]=\"!isOpen\"\n [class.igx-nav-drawer--disable-animation]=\"disableAnimation\"\n (click)=\"close()\" #overlay>\n</div>\n<
|
|
83408
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "16.1.0", version: "17.2.4", type: IgxNavigationDrawerComponent, isStandalone: true, selector: "igx-nav-drawer", inputs: { id: "id", position: "position", enableGestures: ["enableGestures", "enableGestures", booleanAttribute], pinThreshold: "pinThreshold", pin: ["pin", "pin", booleanAttribute], width: "width", disableAnimation: ["disableAnimation", "disableAnimation", booleanAttribute], miniWidth: "miniWidth", isOpen: ["isOpen", "isOpen", booleanAttribute] }, outputs: { isOpenChange: "isOpenChange", pinChange: "pinChange", opening: "opening", opened: "opened", closing: "closing", closed: "closed" }, host: { properties: { "class.igx-nav-drawer": "this.cssClass", "attr.id": "this.id", "class.igx-nav-drawer--disable-animation": "this.disableAnimation", "style.flexBasis": "this.flexWidth", "style.order": "this.isPinnedRight" } }, providers: [HammerGesturesManager], queries: [{ propertyName: "contentTemplate", first: true, predicate: IgxNavDrawerTemplateDirective, descendants: true, read: IgxNavDrawerTemplateDirective }, { propertyName: "miniTemplate", first: true, predicate: IgxNavDrawerMiniTemplateDirective, descendants: true, read: IgxNavDrawerMiniTemplateDirective }], viewQueries: [{ propertyName: "_drawer", first: true, predicate: ["aside"], descendants: true, static: true }, { propertyName: "_overlay", first: true, predicate: ["overlay"], descendants: true, static: true }, { propertyName: "_styleDummy", first: true, predicate: ["dummy"], descendants: true, static: true }], usesOnChanges: true, ngImport: i0, template: "<ng-template #defaultItemsTemplate>\n <div igxDrawerItem [isHeader]=\"true\">Navigation Drawer</div>\n <div igxDrawerItem> Start by adding</div>\n <div igxDrawerItem> <code><ng-template igxDrawer></code> </div>\n <div igxDrawerItem> And some items inside </div>\n <div igxDrawerItem> Style with igxDrawerItem </div>\n <div igxDrawerItem> and igxRipple directives</div>\n</ng-template>\n\n<div [hidden]=\"pin\"\n class=\"igx-nav-drawer__overlay\"\n [class.igx-nav-drawer__overlay--hidden]=\"!isOpen\"\n [class.igx-nav-drawer--disable-animation]=\"disableAnimation\"\n (click)=\"close()\" #overlay>\n</div>\n<nav\n class=\"igx-nav-drawer__aside\"\n [class.igx-nav-drawer__aside--collapsed]=\"!miniTemplate && !isOpen\"\n [class.igx-nav-drawer__aside--mini]=\"miniTemplate && !isOpen\"\n [class.igx-nav-drawer__aside--normal]=\"!miniTemplate || isOpen\"\n [class.igx-nav-drawer__aside--pinned]=\"pin\"\n [class.igx-nav-drawer__aside--right]=\"position === 'right'\" #aside\n [class.igx-nav-drawer--disable-animation]=\"disableAnimation\">\n\n <ng-container *ngTemplateOutlet=\"template || defaultItemsTemplate\"></ng-container>\n</nav>\n<div class=\"igx-nav-drawer__style-dummy\" #dummy></div>\n", styles: [":host{display:block;height:100%}\n"], dependencies: [{ kind: "directive", type: IgxNavDrawerItemDirective, selector: "[igxDrawerItem]", inputs: ["active", "isHeader"], exportAs: ["igxDrawerItem"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }] }); }
|
|
83388
83409
|
}
|
|
83389
83410
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.4", ngImport: i0, type: IgxNavigationDrawerComponent, decorators: [{
|
|
83390
83411
|
type: Component,
|
|
83391
|
-
args: [{ providers: [HammerGesturesManager], selector: 'igx-nav-drawer', standalone: true, imports: [IgxNavDrawerItemDirective, NgTemplateOutlet], template: "<ng-template #defaultItemsTemplate>\n <div igxDrawerItem [isHeader]=\"true\">Navigation Drawer</div>\n <div igxDrawerItem> Start by adding</div>\n <div igxDrawerItem> <code><ng-template igxDrawer></code> </div>\n <div igxDrawerItem> And some items inside </div>\n <div igxDrawerItem> Style with igxDrawerItem </div>\n <div igxDrawerItem> and igxRipple directives</div>\n</ng-template>\n\n<div [hidden]=\"pin\"\n class=\"igx-nav-drawer__overlay\"\n [class.igx-nav-drawer__overlay--hidden]=\"!isOpen\"\n [class.igx-nav-drawer--disable-animation]=\"disableAnimation\"\n (click)=\"close()\" #overlay>\n</div>\n<
|
|
83412
|
+
args: [{ providers: [HammerGesturesManager], selector: 'igx-nav-drawer', standalone: true, imports: [IgxNavDrawerItemDirective, NgTemplateOutlet], template: "<ng-template #defaultItemsTemplate>\n <div igxDrawerItem [isHeader]=\"true\">Navigation Drawer</div>\n <div igxDrawerItem> Start by adding</div>\n <div igxDrawerItem> <code><ng-template igxDrawer></code> </div>\n <div igxDrawerItem> And some items inside </div>\n <div igxDrawerItem> Style with igxDrawerItem </div>\n <div igxDrawerItem> and igxRipple directives</div>\n</ng-template>\n\n<div [hidden]=\"pin\"\n class=\"igx-nav-drawer__overlay\"\n [class.igx-nav-drawer__overlay--hidden]=\"!isOpen\"\n [class.igx-nav-drawer--disable-animation]=\"disableAnimation\"\n (click)=\"close()\" #overlay>\n</div>\n<nav\n class=\"igx-nav-drawer__aside\"\n [class.igx-nav-drawer__aside--collapsed]=\"!miniTemplate && !isOpen\"\n [class.igx-nav-drawer__aside--mini]=\"miniTemplate && !isOpen\"\n [class.igx-nav-drawer__aside--normal]=\"!miniTemplate || isOpen\"\n [class.igx-nav-drawer__aside--pinned]=\"pin\"\n [class.igx-nav-drawer__aside--right]=\"position === 'right'\" #aside\n [class.igx-nav-drawer--disable-animation]=\"disableAnimation\">\n\n <ng-container *ngTemplateOutlet=\"template || defaultItemsTemplate\"></ng-container>\n</nav>\n<div class=\"igx-nav-drawer__style-dummy\" #dummy></div>\n", styles: [":host{display:block;height:100%}\n"] }]
|
|
83392
83413
|
}], ctorParameters: () => [{ type: i0.ElementRef, decorators: [{
|
|
83393
83414
|
type: Inject,
|
|
83394
83415
|
args: [ElementRef]
|
|
@@ -85221,12 +85242,12 @@ class IgxSliderComponent {
|
|
|
85221
85242
|
normalizeByStep(value) {
|
|
85222
85243
|
if (this.isRange) {
|
|
85223
85244
|
this._value = {
|
|
85224
|
-
lower: value.lower
|
|
85225
|
-
upper: value.upper
|
|
85245
|
+
lower: Math.floor(value.lower / this.step) * this.step,
|
|
85246
|
+
upper: Math.floor(value.upper / this.step) * this.step
|
|
85226
85247
|
};
|
|
85227
85248
|
}
|
|
85228
85249
|
else {
|
|
85229
|
-
this._value = value
|
|
85250
|
+
this._value = Math.floor(value / this.step) * this.step;
|
|
85230
85251
|
}
|
|
85231
85252
|
}
|
|
85232
85253
|
updateTrack() {
|