igniteui-angular 12.3.16 → 12.3.17

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 (42) hide show
  1. package/README.md +252 -252
  2. package/bundles/igniteui-angular.umd.js +14 -14
  3. package/bundles/igniteui-angular.umd.js.map +1 -1
  4. package/esm2015/lib/carousel/carousel-base.js +1 -1
  5. package/esm2015/lib/carousel/public_api.js +1 -1
  6. package/esm2015/lib/grids/common/cell.interface.js +1 -1
  7. package/esm2015/lib/grids/filtering/advanced-filtering/advanced-filtering-dialog.component.js +2 -2
  8. package/esm2015/lib/grids/filtering/excel-style/excel-style-header.component.js +2 -2
  9. package/esm2015/lib/grids/filtering/excel-style/public_api.js +1 -1
  10. package/esm2015/lib/grids/grid-public-cell.js +1 -1
  11. package/esm2015/lib/grids/grid-public-row.js +1 -1
  12. package/esm2015/lib/grids/grouping/group-by-area.directive.js +1 -1
  13. package/esm2015/lib/grids/toolbar/grid-toolbar-advanced-filtering.component.js +2 -2
  14. package/esm2015/lib/grids/toolbar/grid-toolbar-exporter.component.js +2 -2
  15. package/esm2015/lib/grids/toolbar/grid-toolbar-hiding.component.js +2 -2
  16. package/esm2015/lib/grids/toolbar/grid-toolbar-pinning.component.js +2 -2
  17. package/esm2015/lib/grids/tree-grid/tree-grid.filtering.strategy.js +1 -1
  18. package/esm2015/lib/tabs/bottom-nav/bottom-nav-content.component.js +2 -2
  19. package/esm2015/lib/tabs/bottom-nav/bottom-nav-header.component.js +2 -2
  20. package/esm2015/lib/tabs/bottom-nav/bottom-nav-item.component.js +2 -2
  21. package/esm2015/lib/tabs/bottom-nav/bottom-nav.component.js +2 -2
  22. package/esm2015/lib/tabs/bottom-nav/bottom-nav.directives.js +1 -1
  23. package/esm2015/lib/tabs/bottom-nav/bottom-nav.module.js +1 -1
  24. package/esm2015/lib/tabs/bottom-nav/public_api.js +1 -1
  25. package/esm2015/lib/tabs/public_api.js +1 -1
  26. package/esm2015/lib/tabs/tab-content.directive.js +1 -1
  27. package/esm2015/lib/tabs/tab-header.directive.js +1 -1
  28. package/esm2015/lib/tabs/tab-item.directive.js +1 -1
  29. package/esm2015/lib/tabs/tabs/public_api.js +1 -1
  30. package/esm2015/lib/tabs/tabs/tab-content.component.js +2 -2
  31. package/esm2015/lib/tabs/tabs/tab-header.component.js +2 -2
  32. package/esm2015/lib/tabs/tabs/tab-item.component.js +2 -2
  33. package/esm2015/lib/tabs/tabs/tabs.component.js +2 -2
  34. package/esm2015/lib/tabs/tabs/tabs.directives.js +1 -1
  35. package/esm2015/lib/tabs/tabs/tabs.module.js +1 -1
  36. package/esm2015/lib/tabs/tabs.base.js +1 -1
  37. package/esm2015/lib/tabs/tabs.directive.js +1 -1
  38. package/fesm2015/igniteui-angular.js +14 -14
  39. package/fesm2015/igniteui-angular.js.map +1 -1
  40. package/igniteui-angular.metadata.json +1 -1
  41. package/migrations/update-12_1_0/changes/classes.json +28 -28
  42. package/package.json +1 -1
@@ -46181,7 +46181,7 @@
46181
46181
  { type: i0.Component, args: [{
46182
46182
  preserveWhitespaces: false,
46183
46183
  selector: 'igx-excel-style-header',
46184
- template: "<header *ngIf=\"esf.column\"\r\n class=\"igx-excel-filter__menu-header\">\r\n <h4>{{ esf.column.header || esf.column.field }}</h4>\r\n <div class=\"igx-excel-filter__menu-header-actions\">\r\n <button *ngIf=\"showSelecting\"\r\n igxButton=\"icon\"\r\n (click)=\"esf.onSelect()\"\r\n [ngClass]=\"esf.selectedClass()\"\r\n [attr.aria-label]=\"esf.column.selected ? esf.grid.resourceStrings.igx_grid_excel_deselect : esf.grid.resourceStrings.igx_grid_excel_select\"\r\n >\r\n <igx-icon>done</igx-icon>\r\n </button>\r\n <button *ngIf=\"showPinning\"\r\n igxButton=\"icon\"\r\n (click)=\"esf.onPin()\"\r\n [attr.aria-label]=\"esf.column.pinned ? esf.grid.resourceStrings.igx_grid_excel_unpin : esf.grid.resourceStrings.igx_grid_excel_pin\"\r\n >\r\n <igx-icon family=\"imx-icons\" [name]=\"esf.column.pinned ? 'unpin-left' : 'pin-left'\"></igx-icon>\r\n </button>\r\n <button *ngIf=\"showHiding\"\r\n igxButton=\"icon\"\r\n (click)=\"esf.onHideToggle()\"\r\n [attr.aria-label]=\"esf.column.hidden ? esf.grid.resourceStrings.igx_grid_excel_show : esf.grid.resourceStrings.igx_grid_excel_hide\"\r\n >\r\n <igx-icon>{{ esf.column.hidden ? 'visibility' : 'visibility_off' }}</igx-icon>\r\n </button>\r\n </div>\r\n</header>\r\n"
46184
+ template: "<header *ngIf=\"esf.column\"\n class=\"igx-excel-filter__menu-header\">\n <h4>{{ esf.column.header || esf.column.field }}</h4>\n <div class=\"igx-excel-filter__menu-header-actions\">\n <button *ngIf=\"showSelecting\"\n igxButton=\"icon\"\n (click)=\"esf.onSelect()\"\n [ngClass]=\"esf.selectedClass()\"\n [attr.aria-label]=\"esf.column.selected ? esf.grid.resourceStrings.igx_grid_excel_deselect : esf.grid.resourceStrings.igx_grid_excel_select\"\n >\n <igx-icon>done</igx-icon>\n </button>\n <button *ngIf=\"showPinning\"\n igxButton=\"icon\"\n (click)=\"esf.onPin()\"\n [attr.aria-label]=\"esf.column.pinned ? esf.grid.resourceStrings.igx_grid_excel_unpin : esf.grid.resourceStrings.igx_grid_excel_pin\"\n >\n <igx-icon family=\"imx-icons\" [name]=\"esf.column.pinned ? 'unpin-left' : 'pin-left'\"></igx-icon>\n </button>\n <button *ngIf=\"showHiding\"\n igxButton=\"icon\"\n (click)=\"esf.onHideToggle()\"\n [attr.aria-label]=\"esf.column.hidden ? esf.grid.resourceStrings.igx_grid_excel_show : esf.grid.resourceStrings.igx_grid_excel_hide\"\n >\n <igx-icon>{{ esf.column.hidden ? 'visibility' : 'visibility_off' }}</igx-icon>\n </button>\n </div>\n</header>\n"
46185
46185
  },] }
46186
46186
  ];
46187
46187
  IgxExcelStyleHeaderComponent.ctorParameters = function () { return [
@@ -51831,7 +51831,7 @@
51831
51831
  IgxAdvancedFilteringDialogComponent.decorators = [
51832
51832
  { type: i0.Component, args: [{
51833
51833
  selector: 'igx-advanced-filtering-dialog',
51834
- template: "<article\n *ngIf=\"grid\"\n class=\"igx-advanced-filter\"\n igxDrag\n [ghost]=\"false\"\n [dragTolerance]=\"0\"\n (dragStart)=\"dragStart($event)\"\n (dragEnd)=\"dragEnd()\"\n (dragMove)=\"onDragMove($event)\"\n (keydown)=\"onKeyDown($event)\"\n [ngClass]=\"{\n 'igx-advanced-filter--cosy': grid.displayDensity === 'cosy',\n 'igx-advanced-filter--compact': grid.displayDensity === 'compact',\n 'igx-advanced-filter--inline': inline\n }\"\n>\n <header class=\"igx-advanced-filter__header\" igxDragHandle>\n <h4 class=\"igx-typography__h6\" style=\"pointer-events: none;\">\n {{ grid.resourceStrings.igx_grid_advanced_filter_title }}\n </h4>\n <div class=\"igx-filter-legend\">\n <div class=\"igx-filter-legend__item--and\">\n <span>{{ grid.resourceStrings.igx_grid_advanced_filter_and_label }}</span>\n </div>\n <div class=\"igx-filter-legend__item--or\">\n <span>{{ grid.resourceStrings.igx_grid_advanced_filter_or_label }}</span>\n </div>\n </div>\n </header>\n\n <article #expressionsContainer\n class=\"igx-advanced-filter__main\"\n (scroll)=\"onExpressionsScrolled()\">\n <ng-container *ngIf=\"!rootGroup\">\n\n <button #addRootAndGroupButton\n igxButton=\"outlined\"\n [displayDensity]=\"displayDensity\"\n (click)=\"addAndGroup()\"\n >\n <igx-icon>add</igx-icon>\n <span>{{grid.resourceStrings.igx_grid_advanced_filter_and_group}}</span>\n </button>\n\n <button igxButton=\"outlined\" [displayDensity]=\"displayDensity\" (click)=\"addOrGroup()\">\n <igx-icon>add</igx-icon>\n <span>{{grid.resourceStrings.igx_grid_advanced_filter_or_group}}</span>\n </button>\n\n <div class=\"igx-filter-empty\">\n <h6 class=\"igx-filter-empty__title\">\n {{grid.resourceStrings.igx_grid_advanced_filter_initial_text}}\n </h6>\n </div>\n </ng-container>\n\n <ng-template #addExpressionsTemplate let-expressionItem let-afterExpression=\"afterExpression\">\n <button #addConditionButton\n igxButton=\"outlined\"\n [displayDensity]=\"displayDensity\"\n [disabled]=\"hasEditedExpression\"\n (click)=\"addCondition(expressionItem, afterExpression)\"\n >\n <igx-icon>add</igx-icon>\n <span>{{grid.resourceStrings.igx_grid_advanced_filter_add_condition}}</span>\n </button>\n\n <button igxButton=\"outlined\"\n [displayDensity]=\"displayDensity\"\n [disabled]=\"hasEditedExpression\"\n (click)=\"addAndGroup(expressionItem, afterExpression)\">\n <igx-icon>add</igx-icon>\n <span>{{grid.resourceStrings.igx_grid_advanced_filter_and_group}}</span>\n </button>\n\n <button igxButton=\"outlined\"\n [displayDensity]=\"displayDensity\"\n [disabled]=\"hasEditedExpression\"\n (click)=\"addOrGroup(expressionItem, afterExpression)\">\n <igx-icon>add</igx-icon>\n <span>{{grid.resourceStrings.igx_grid_advanced_filter_or_group}}</span>\n </button>\n\n </ng-template>\n\n <ng-template #filterOperandTemplate let-expressionItem>\n <div *ngIf=\"!expressionItem.inEditMode\"\n class=\"igx-filter-tree__expression-item\"\n (mouseenter)=\"expressionItem.hovered = true\"\n (mouseleave)=\"expressionItem.hovered = false\"\n >\n <igx-chip [data]=\"expressionItem\"\n [displayDensity]=\"displayDensity === 'compact' ? 'cosy' : displayDensity\"\n [removable]=\"true\"\n [selected]=\"expressionItem.selected\"\n (keydown)=\"invokeClick($event)\"\n (click)=\"onChipClick(expressionItem)\"\n (dblclick)=\"onChipDblClick(expressionItem)\"\n (remove)=\"onChipRemove(expressionItem)\"\n (selectedChanged)=\"onChipSelectionEnd()\"\n >\n <span igxPrefix class=\"igx-filter-tree__expression-column\">{{ expressionItem.columnHeader || expressionItem.expression.fieldName }}</span>\n <igx-prefix>\n <igx-icon family=\"imx-icons\" [name]=\"expressionItem.expression.condition.iconName\">\n </igx-icon>\n </igx-prefix>\n <span class=\"igx-filter-tree__expression-condition\">\n {{ getConditionFriendlyName(expressionItem.expression.condition.name) }}\n </span>\n <span igxSuffix *ngIf=\"!expressionItem.expression.condition.isUnary\">\n {{\n isDate(expressionItem.expression.searchVal)\n ? getFormatter(expressionItem.expression.fieldName)\n ? (expressionItem.expression.searchVal | columnFormatter:getFormatter(expressionItem.expression.fieldName):undefined)\n : (expressionItem.expression.searchVal | date:getFormat(expressionItem.expression.fieldName):undefined:grid.locale)\n : expressionItem.expression.searchVal\n }}\n </span>\n </igx-chip>\n <div class=\"igx-filter-tree__expression-actions\"\n *ngIf=\"(expressionItem.selected && selectedExpressions.length === 1) || expressionItem.hovered\">\n <igx-icon\n tabindex=\"0\"\n (keydown)=\"invokeClick($event)\"\n (click)=\"enterExpressionEdit(expressionItem)\">\n edit\n </igx-icon>\n <igx-icon\n tabindex=\"0\"\n (keydown)=\"invokeClick($event)\"\n (click)=\"enterExpressionAdd(expressionItem)\"\n *ngIf=\"!expressionItem.inAddMode && (expressionItem.parent !== currentGroup || expressionItem !== currentGroup.children[currentGroup.children.length - 1])\"\n >\n add\n </igx-icon>\n </div>\n </div>\n\n <div *ngIf=\"expressionItem.inEditMode\"\n #editingInputsContainer\n class=\"igx-filter-tree__inputs\"\n >\n <igx-select #columnSelect\n type=\"box\"\n [displayDensity]=\"'compact'\"\n [overlaySettings]=\"columnSelectOverlaySettings\"\n [placeholder]=\"grid.resourceStrings.igx_grid_advanced_filter_column_placeholder\"\n [(ngModel)]=\"selectedColumn\">\n <igx-select-item *ngFor=\"let column of filterableColumns\" [value]=\"column\">\n {{column.header || column.field}}\n </igx-select-item>\n </igx-select>\n\n <igx-select #conditionSelect\n type=\"box\"\n [displayDensity]=\"'compact'\"\n [overlaySettings]=\"conditionSelectOverlaySettings\"\n [placeholder]=\"grid.resourceStrings.igx_grid_filter_condition_placeholder\"\n [(ngModel)]=\"selectedCondition\"\n [disabled]=\"!selectedColumn\">\n <igx-prefix *ngIf=\"selectedColumn && conditionSelect.value && selectedColumn.filters.condition(conditionSelect.value)\">\n <igx-icon family=\"imx-icons\" [name]=\"selectedColumn.filters.condition(conditionSelect.value).iconName\">\n </igx-icon>\n </igx-prefix>\n <igx-select-item *ngFor=\"let condition of getConditionList()\" [value]=\"condition\" [text]=\"getConditionFriendlyName(condition)\">\n <div class=\"igx-grid__filtering-dropdown-items\">\n <igx-icon family=\"imx-icons\"\n [name]=\"selectedColumn.filters.condition(condition).iconName\">\n </igx-icon>\n <span class=\"igx-grid__filtering-dropdown-text\">{{getConditionFriendlyName(condition)}}</span>\n </div>\n </igx-select-item>\n </igx-select>\n\n <igx-input-group *ngIf=\"!selectedColumn || (selectedColumn.dataType !== 'date' && selectedColumn.dataType !== 'time' && selectedColumn.dataType !== 'dateTime')\"\n type=\"box\"\n [displayDensity]=\"'compact'\">\n <input #searchValueInput\n igxInput\n [disabled]=\"!selectedColumn || !selectedCondition\n || (selectedColumn && selectedColumn.filters.condition(selectedCondition).isUnary)\"\n [type]=\"selectedColumn && selectedColumn.dataType === 'number' ? 'number' : 'text'\"\n [placeholder]=\"grid.resourceStrings.igx_grid_advanced_filter_value_placeholder\"\n [(ngModel)]=\"searchValue\"/>\n </igx-input-group>\n\n <igx-date-picker #picker *ngIf=\"selectedColumn && selectedColumn.dataType === 'date'\"\n [(value)]=\"searchValue\"\n (keydown)=\"openPicker($event)\"\n [formatter]=\"selectedColumn.formatter\"\n [displayFormat]=\"selectedColumn.pipeArgs.format\"\n (click)=\"picker.open()\"\n type=\"box\"\n [readOnly]=\"true\"\n [displayDensity]=\"'compact'\"\n [locale]=\"grid.locale\"\n [outlet]=\"grid.outlet\"\n [displayFormat]=\"selectedColumn.pipeArgs.format\"\n [placeholder]=\"grid.resourceStrings.igx_grid_filter_row_date_placeholder\"\n [disabled]=\"!selectedColumn || !selectedCondition\n || (selectedColumn && selectedColumn.filters.condition(selectedCondition).isUnary)\">\n <!-- disable default icons -->\n <igx-picker-toggle></igx-picker-toggle>\n <igx-picker-clear></igx-picker-clear>\n </igx-date-picker>\n\n <igx-time-picker #picker *ngIf=\"selectedColumn && selectedColumn.dataType === 'time'\"\n [inputFormat]=\"selectedColumn.defaultTimeFormat\"\n [(value)]=\"searchValue\"\n [formatter]=\"selectedColumn.formatter\"\n [locale]=\"grid.locale\"\n [outlet]=\"grid.outlet\"\n (click)=\"picker.open()\"\n (keydown)=\"openPicker($event)\"\n [displayDensity]=\"'compact'\"\n [placeholder]=\"grid.resourceStrings.igx_grid_filter_row_time_placeholder\"\n type=\"box\"\n [readOnly]=\"true\"\n [disabled]=\"!selectedColumn || !selectedCondition ||\n (selectedColumn && selectedColumn.filters.condition(selectedCondition).isUnary)\">\n <!-- disable default icons -->\n <igx-picker-toggle></igx-picker-toggle>\n <igx-picker-clear></igx-picker-clear>\n </igx-time-picker>\n\n <igx-input-group #inputGroup type=\"box\" *ngIf=\"selectedColumn && selectedColumn.dataType === 'dateTime'\"\n type=\"box\"\n [displayDensity]=\"'compact'\">\n <input #input igxInput tabindex=\"0\"\n [placeholder]=\"grid.resourceStrings.igx_grid_filter_row_date_placeholder\"\n [igxDateTimeEditor]=\"selectedColumn.defaultDateTimeFormat\"\n [(ngModel)]=\"searchValue\"\n [disabled]=\"!selectedColumn || !selectedCondition || (selectedColumn && selectedColumn.filters.condition(selectedCondition).isUnary)\"/>\n </igx-input-group>\n\n <div class=\"igx-filter-tree__inputs-actions\">\n <button igxButton=\"icon\"\n [displayDensity]=\"displayDensity\"\n [disabled]=\"!operandCanBeCommitted()\"\n (click)=\"commitOperandEdit()\">\n <igx-icon>check</igx-icon>\n </button>\n <button igxButton=\"icon\"\n [displayDensity]=\"displayDensity\"\n (click)=\"cancelOperandEdit()\">\n <igx-icon>close</igx-icon>\n </button>\n </div>\n </div>\n\n <div *ngIf=\"expressionItem.inAddMode\"\n #addModeContainer\n class=\"igx-filter-tree__buttons\"\n >\n <ng-container *ngTemplateOutlet=\"addExpressionsTemplate; context: context(expressionItem.parent, expressionItem)\"></ng-container>\n <button igxButton=\"icon\"\n [displayDensity]=\"displayDensity\"\n (click)=\"cancelOperandAdd()\">\n <igx-icon>close</igx-icon>\n </button>\n </div>\n\n </ng-template>\n\n <ng-template #expressionTreeTemplate let-expressionItem>\n <div class=\"igx-filter-tree\">\n <div tabindex=\"0\"\n class=\"igx-filter-tree__line\"\n [ngClass]=\"{\n 'igx-filter-tree__line--and': expressionItem.operator === 0,\n 'igx-filter-tree__line--or': expressionItem.operator === 1,\n 'igx-filter-tree__line--selected': expressionItem.selected\n }\"\n (keydown)=\"invokeClick($event)\"\n (click)=\"onGroupClick(expressionItem)\"\n ></div>\n\n <div class=\"igx-filter-tree__expression\">\n <ng-container *ngFor=\"let expr of expressionItem.children\">\n <ng-container *ngTemplateOutlet=\"isExpressionGroup(expr) ? expressionTreeTemplate : filterOperandTemplate; context: context(expr)\"></ng-container>\n </ng-container>\n <div *ngIf=\"currentGroup === expressionItem\"\n #currentGroupButtonsContainer\n class=\"igx-filter-tree__buttons\">\n <ng-container *ngTemplateOutlet=\"addExpressionsTemplate; context: context(expressionItem)\"></ng-container>\n <button igxButton=\"outlined\"\n *ngIf=\"expressionItem !== rootGroup\"\n [displayDensity]=\"displayDensity\"\n [disabled]=\"hasEditedExpression || expressionItem.children.length < 2\"\n (click)=\"endGroup(expressionItem)\">\n <span>{{grid.resourceStrings.igx_grid_advanced_filter_end_group}}</span>\n </button>\n </div>\n </div>\n </div>\n\n </ng-template>\n\n <ng-container *ngIf=\"rootGroup\">\n <ng-container *ngTemplateOutlet=\"expressionTreeTemplate; context: context(rootGroup)\"></ng-container>\n </ng-container>\n\n <div igxToggle\n class=\"igx-filter-contextual-menu\"\n (keydown)=\"onKeyDown($event)\"\n (closed)=\"contextMenuClosed()\"\n [ngClass]=\"{\n 'igx-filter-contextual-menu--cosy': displayDensity === 'cosy',\n 'igx-filter-contextual-menu--compact': displayDensity === 'compact'\n }\"\n >\n <button igxButton=\"icon\"\n class=\"igx-filter-contextual-menu__close-btn\"\n (click)=\"clearSelection()\"\n >\n <igx-icon>close</igx-icon>\n </button>\n\n <ng-container *ngIf=\"contextualGroup\">\n <igx-buttongroup [displayDensity]=\"displayDensity\"\n [multiSelection]=\"false\"\n [values]=\"filteringLogics\"\n type=\"outline\"\n (selected)=\"selectFilteringLogic($event)\">\n </igx-buttongroup>\n\n <button\n igxButton=\"outlined\"\n [displayDensity]=\"displayDensity\"\n [disabled]=\"!contextualGroup.parent\"\n (click)=\"ungroup()\"\n >\n <igx-icon family=\"imx-icons\" name=\"ungroup\"></igx-icon>\n <span>{{grid.resourceStrings.igx_grid_advanced_filter_ungroup}}</span>\n </button>\n <button\n igxButton=\"outlined\"\n [displayDensity]=\"displayDensity\"\n (click)=\"deleteGroup()\"\n class=\"igx-filter-contextual-menu__delete-btn\"\n >\n <igx-icon>delete</igx-icon>\n <span>{{grid.resourceStrings.igx_grid_advanced_filter_delete}}</span>\n </button>\n </ng-container>\n <ng-container *ngIf=\"!contextualGroup\">\n <button\n igxButton=\"outlined\"\n [displayDensity]=\"displayDensity\"\n (click)=\"createAndGroup()\"\n >\n {{grid.resourceStrings.igx_grid_advanced_filter_create_and_group}}\n </button>\n <button\n igxButton=\"outlined\"\n [displayDensity]=\"displayDensity\"\n (click)=\"createOrGroup()\"\n >\n {{grid.resourceStrings.igx_grid_advanced_filter_create_or_group}}\n </button>\n <button\n igxButton=\"outlined\"\n [displayDensity]=\"displayDensity\"\n (click)=\"deleteFilters()\"\n class=\"igx-filter-contextual-menu__delete-btn\"\n >\n {{grid.resourceStrings.igx_grid_advanced_filter_delete_filters}}\n </button>\n </ng-container>\n </div>\n </article>\n\n <footer class=\"igx-excel-filter__secondary-footer\">\n <div class=\"igx-excel-filter__clear\">\n <button\n igxButton=\"flat\"\n [displayDensity]=\"displayDensity\"\n (click)=\"onClearButtonClick($event)\">\n {{ grid.resourceStrings.igx_grid_excel_custom_dialog_clear }}\n </button>\n </div>\n <div class=\"igx-excel-filter__cancel\">\n <button\n igxButton=\"flat\"\n [displayDensity]=\"displayDensity\"\n (click)=\"cancelChanges()\">\n {{ grid.resourceStrings.igx_grid_excel_cancel }}\n </button>\n </div>\n <div class=\"igx-excel-filter__apply\">\n <button\n igxButton=\"raised\"\n [displayDensity]=\"displayDensity\"\n (click)=\"onApplyButtonClick($event)\">\n {{ grid.resourceStrings.igx_grid_excel_apply }}\n </button>\n </div>\n </footer>\n</article>\n<div #overlayOutlet\n igxOverlayOutlet\n class=\"igx-advanced-filter__outlet\"\n (pointerdown)=\"onOutletPointerDown($event)\">\n</div>\n"
51834
+ template: "<article\n *ngIf=\"grid\"\n class=\"igx-advanced-filter\"\n igxDrag\n [ghost]=\"false\"\n [dragTolerance]=\"0\"\n (dragStart)=\"dragStart($event)\"\n (dragEnd)=\"dragEnd()\"\n (dragMove)=\"onDragMove($event)\"\n (keydown)=\"onKeyDown($event)\"\n [ngClass]=\"{\n 'igx-advanced-filter--cosy': grid.displayDensity === 'cosy',\n 'igx-advanced-filter--compact': grid.displayDensity === 'compact',\n 'igx-advanced-filter--inline': inline\n }\"\n>\n <header class=\"igx-advanced-filter__header\" igxDragHandle>\n <h4 class=\"igx-typography__h6\" style=\"pointer-events: none;\">\n {{ grid.resourceStrings.igx_grid_advanced_filter_title }}\n </h4>\n <div class=\"igx-filter-legend\">\n <div class=\"igx-filter-legend__item--and\">\n <span>{{ grid.resourceStrings.igx_grid_advanced_filter_and_label }}</span>\n </div>\n <div class=\"igx-filter-legend__item--or\">\n <span>{{ grid.resourceStrings.igx_grid_advanced_filter_or_label }}</span>\n </div>\n </div>\n </header>\n\n <article #expressionsContainer\n class=\"igx-advanced-filter__main\"\n (scroll)=\"onExpressionsScrolled()\">\n <ng-container *ngIf=\"!rootGroup\">\n\n <button #addRootAndGroupButton\n igxButton=\"outlined\"\n [displayDensity]=\"displayDensity\"\n (click)=\"addAndGroup()\"\n >\n <igx-icon>add</igx-icon>\n <span>{{grid.resourceStrings.igx_grid_advanced_filter_and_group}}</span>\n </button>\n\n <button igxButton=\"outlined\" [displayDensity]=\"displayDensity\" (click)=\"addOrGroup()\">\n <igx-icon>add</igx-icon>\n <span>{{grid.resourceStrings.igx_grid_advanced_filter_or_group}}</span>\n </button>\n\n <div class=\"igx-filter-empty\">\n <h6 class=\"igx-filter-empty__title\">\n {{grid.resourceStrings.igx_grid_advanced_filter_initial_text}}\n </h6>\n </div>\n </ng-container>\n\n <ng-template #addExpressionsTemplate let-expressionItem let-afterExpression=\"afterExpression\">\n <button #addConditionButton\n igxButton=\"outlined\"\n [displayDensity]=\"displayDensity\"\n [disabled]=\"hasEditedExpression\"\n (click)=\"addCondition(expressionItem, afterExpression)\"\n >\n <igx-icon>add</igx-icon>\n <span>{{grid.resourceStrings.igx_grid_advanced_filter_add_condition}}</span>\n </button>\n\n <button igxButton=\"outlined\"\n [displayDensity]=\"displayDensity\"\n [disabled]=\"hasEditedExpression\"\n (click)=\"addAndGroup(expressionItem, afterExpression)\">\n <igx-icon>add</igx-icon>\n <span>{{grid.resourceStrings.igx_grid_advanced_filter_and_group}}</span>\n </button>\n\n <button igxButton=\"outlined\"\n [displayDensity]=\"displayDensity\"\n [disabled]=\"hasEditedExpression\"\n (click)=\"addOrGroup(expressionItem, afterExpression)\">\n <igx-icon>add</igx-icon>\n <span>{{grid.resourceStrings.igx_grid_advanced_filter_or_group}}</span>\n </button>\n\n </ng-template>\n\n <ng-template #filterOperandTemplate let-expressionItem>\n <div *ngIf=\"!expressionItem.inEditMode\"\n class=\"igx-filter-tree__expression-item\"\n (mouseenter)=\"expressionItem.hovered = true\"\n (mouseleave)=\"expressionItem.hovered = false\"\n >\n <igx-chip [data]=\"expressionItem\"\n [displayDensity]=\"displayDensity === 'compact' ? 'cosy' : displayDensity\"\n [removable]=\"true\"\n [selected]=\"expressionItem.selected\"\n (keydown)=\"invokeClick($event)\"\n (click)=\"onChipClick(expressionItem)\"\n (dblclick)=\"onChipDblClick(expressionItem)\"\n (remove)=\"onChipRemove(expressionItem)\"\n (selectedChanged)=\"onChipSelectionEnd()\"\n >\n <span igxPrefix class=\"igx-filter-tree__expression-column\">{{ expressionItem.columnHeader || expressionItem.expression.fieldName }}</span>\n <igx-prefix>\n <igx-icon family=\"imx-icons\" [name]=\"expressionItem.expression.condition.iconName\">\n </igx-icon>\n </igx-prefix>\n <span class=\"igx-filter-tree__expression-condition\">\n {{ getConditionFriendlyName(expressionItem.expression.condition.name) }}\n </span>\n <span igxSuffix *ngIf=\"!expressionItem.expression.condition.isUnary\">\n {{\n isDate(expressionItem.expression.searchVal)\n ? getFormatter(expressionItem.expression.fieldName)\n ? (expressionItem.expression.searchVal | columnFormatter:getFormatter(expressionItem.expression.fieldName):undefined)\n : (expressionItem.expression.searchVal | date:getFormat(expressionItem.expression.fieldName):undefined:grid.locale)\n : expressionItem.expression.searchVal\n }}\n </span>\n </igx-chip>\n <div class=\"igx-filter-tree__expression-actions\"\n *ngIf=\"(expressionItem.selected && selectedExpressions.length === 1) || expressionItem.hovered\">\n <igx-icon\n tabindex=\"0\"\n (keydown)=\"invokeClick($event)\"\n (click)=\"enterExpressionEdit(expressionItem)\">\n edit\n </igx-icon>\n <igx-icon\n tabindex=\"0\"\n (keydown)=\"invokeClick($event)\"\n (click)=\"enterExpressionAdd(expressionItem)\"\n *ngIf=\"!expressionItem.inAddMode && (expressionItem.parent !== currentGroup || expressionItem !== currentGroup.children[currentGroup.children.length - 1])\"\n >\n add\n </igx-icon>\n </div>\n </div>\n\n <div *ngIf=\"expressionItem.inEditMode\"\n #editingInputsContainer\n class=\"igx-filter-tree__inputs\"\n >\n <igx-select #columnSelect\n type=\"box\"\n [displayDensity]=\"'compact'\"\n [overlaySettings]=\"columnSelectOverlaySettings\"\n [placeholder]=\"grid.resourceStrings.igx_grid_advanced_filter_column_placeholder\"\n [(ngModel)]=\"selectedColumn\">\n <igx-select-item *ngFor=\"let column of filterableColumns\" [value]=\"column\">\n {{column.header || column.field}}\n </igx-select-item>\n </igx-select>\n\n <igx-select #conditionSelect\n type=\"box\"\n [displayDensity]=\"'compact'\"\n [overlaySettings]=\"conditionSelectOverlaySettings\"\n [placeholder]=\"grid.resourceStrings.igx_grid_filter_condition_placeholder\"\n [(ngModel)]=\"selectedCondition\"\n [disabled]=\"!selectedColumn\">\n <igx-prefix *ngIf=\"selectedColumn && conditionSelect.value && selectedColumn.filters.condition(conditionSelect.value)\">\n <igx-icon family=\"imx-icons\" [name]=\"selectedColumn.filters.condition(conditionSelect.value).iconName\">\n </igx-icon>\n </igx-prefix>\n <igx-select-item *ngFor=\"let condition of getConditionList()\" [value]=\"condition\" [text]=\"getConditionFriendlyName(condition)\">\n <div class=\"igx-grid__filtering-dropdown-items\">\n <igx-icon family=\"imx-icons\"\n [name]=\"selectedColumn.filters.condition(condition).iconName\">\n </igx-icon>\n <span class=\"igx-grid__filtering-dropdown-text\">{{getConditionFriendlyName(condition)}}</span>\n </div>\n </igx-select-item>\n </igx-select>\n\n <igx-input-group *ngIf=\"!selectedColumn || (selectedColumn.dataType !== 'date' && selectedColumn.dataType !== 'time' && selectedColumn.dataType !== 'dateTime')\"\n type=\"box\"\n [displayDensity]=\"'compact'\">\n <input #searchValueInput\n igxInput\n [disabled]=\"!selectedColumn || !selectedCondition\n || (selectedColumn && selectedColumn.filters.condition(selectedCondition).isUnary)\"\n [type]=\"selectedColumn && selectedColumn.dataType === 'number' ? 'number' : 'text'\"\n [placeholder]=\"grid.resourceStrings.igx_grid_advanced_filter_value_placeholder\"\n [(ngModel)]=\"searchValue\"/>\n </igx-input-group>\n\n <igx-date-picker #picker *ngIf=\"selectedColumn && selectedColumn.dataType === 'date'\"\n [(value)]=\"searchValue\"\n (keydown)=\"openPicker($event)\"\n [formatter]=\"selectedColumn.formatter\"\n [displayFormat]=\"selectedColumn.pipeArgs.format\"\n (click)=\"picker.open()\"\n type=\"box\"\n [readOnly]=\"true\"\n [displayDensity]=\"'compact'\"\n [locale]=\"grid.locale\"\n [outlet]=\"grid.outlet\"\n [displayFormat]=\"selectedColumn.pipeArgs.format\"\n [placeholder]=\"grid.resourceStrings.igx_grid_filter_row_date_placeholder\"\n [disabled]=\"!selectedColumn || !selectedCondition\n || (selectedColumn && selectedColumn.filters.condition(selectedCondition).isUnary)\">\n <!-- disable default icons -->\n <igx-picker-toggle></igx-picker-toggle>\n <igx-picker-clear></igx-picker-clear>\n </igx-date-picker>\n\n <igx-time-picker #picker *ngIf=\"selectedColumn && selectedColumn.dataType === 'time'\"\n [inputFormat]=\"selectedColumn.defaultTimeFormat\"\n [(value)]=\"searchValue\"\n [formatter]=\"selectedColumn.formatter\"\n [locale]=\"grid.locale\"\n [outlet]=\"grid.outlet\"\n (click)=\"picker.open()\"\n (keydown)=\"openPicker($event)\"\n [displayDensity]=\"'compact'\"\n [placeholder]=\"grid.resourceStrings.igx_grid_filter_row_time_placeholder\"\n type=\"box\"\n [readOnly]=\"true\"\n [disabled]=\"!selectedColumn || !selectedCondition ||\n (selectedColumn && selectedColumn.filters.condition(selectedCondition).isUnary)\">\n <!-- disable default icons -->\n <igx-picker-toggle></igx-picker-toggle>\n <igx-picker-clear></igx-picker-clear>\n </igx-time-picker>\n\n <igx-input-group #inputGroup type=\"box\" *ngIf=\"selectedColumn && selectedColumn.dataType === 'dateTime'\"\n type=\"box\"\n [displayDensity]=\"'compact'\">\n <input #input igxInput tabindex=\"0\"\n [placeholder]=\"grid.resourceStrings.igx_grid_filter_row_date_placeholder\"\n [igxDateTimeEditor]=\"selectedColumn.defaultDateTimeFormat\"\n [(ngModel)]=\"searchValue\"\n [disabled]=\"!selectedColumn || !selectedCondition || (selectedColumn && selectedColumn.filters.condition(selectedCondition).isUnary)\"/>\n </igx-input-group>\n\n <div class=\"igx-filter-tree__inputs-actions\">\n <button igxButton=\"icon\"\n [displayDensity]=\"displayDensity\"\n [disabled]=\"!operandCanBeCommitted()\"\n (click)=\"commitOperandEdit()\">\n <igx-icon>check</igx-icon>\n </button>\n <button igxButton=\"icon\"\n [displayDensity]=\"displayDensity\"\n (click)=\"cancelOperandEdit()\">\n <igx-icon>close</igx-icon>\n </button>\n </div>\n </div>\n\n <div *ngIf=\"expressionItem.inAddMode\"\n #addModeContainer\n class=\"igx-filter-tree__buttons\"\n >\n <ng-container *ngTemplateOutlet=\"addExpressionsTemplate; context: context(expressionItem.parent, expressionItem)\"></ng-container>\n <button igxButton=\"icon\"\n [displayDensity]=\"displayDensity\"\n (click)=\"cancelOperandAdd()\">\n <igx-icon>close</igx-icon>\n </button>\n </div>\n\n </ng-template>\n\n <ng-template #expressionTreeTemplate let-expressionItem>\n <div class=\"igx-filter-tree\">\n <div tabindex=\"0\"\n class=\"igx-filter-tree__line\"\n [ngClass]=\"{\n 'igx-filter-tree__line--and': expressionItem.operator === 0,\n 'igx-filter-tree__line--or': expressionItem.operator === 1,\n 'igx-filter-tree__line--selected': expressionItem.selected\n }\"\n (keydown)=\"invokeClick($event)\"\n (click)=\"onGroupClick(expressionItem)\"\n ></div>\n\n <div class=\"igx-filter-tree__expression\">\n <ng-container *ngFor=\"let expr of expressionItem.children\">\n <ng-container *ngTemplateOutlet=\"isExpressionGroup(expr) ? expressionTreeTemplate : filterOperandTemplate; context: context(expr)\"></ng-container>\n </ng-container>\n <div *ngIf=\"currentGroup === expressionItem\"\n #currentGroupButtonsContainer\n class=\"igx-filter-tree__buttons\">\n <ng-container *ngTemplateOutlet=\"addExpressionsTemplate; context: context(expressionItem)\"></ng-container>\n <button igxButton=\"outlined\"\n *ngIf=\"expressionItem !== rootGroup\"\n [displayDensity]=\"displayDensity\"\n [disabled]=\"hasEditedExpression || expressionItem.children.length < 2\"\n (click)=\"endGroup(expressionItem)\">\n <span>{{grid.resourceStrings.igx_grid_advanced_filter_end_group}}</span>\n </button>\n </div>\n </div>\n </div>\n\n </ng-template>\n\n <ng-container *ngIf=\"rootGroup\">\n <ng-container *ngTemplateOutlet=\"expressionTreeTemplate; context: context(rootGroup)\"></ng-container>\n </ng-container>\n\n <div igxToggle\n class=\"igx-filter-contextual-menu\"\n (keydown)=\"onKeyDown($event)\"\n (closed)=\"contextMenuClosed()\"\n [ngClass]=\"{\n 'igx-filter-contextual-menu--cosy': displayDensity === 'cosy',\n 'igx-filter-contextual-menu--compact': displayDensity === 'compact'\n }\"\n >\n <button igxButton=\"icon\"\n class=\"igx-filter-contextual-menu__close-btn\"\n (click)=\"clearSelection()\"\n >\n <igx-icon>close</igx-icon>\n </button>\n\n <ng-container *ngIf=\"contextualGroup\">\n <igx-buttongroup [displayDensity]=\"displayDensity\"\n [multiSelection]=\"false\"\n [values]=\"filteringLogics\"\n type=\"outline\"\n (selected)=\"selectFilteringLogic($event)\">\n </igx-buttongroup>\n\n <button\n igxButton=\"outlined\"\n [displayDensity]=\"displayDensity\"\n [disabled]=\"!contextualGroup.parent\"\n (click)=\"ungroup()\"\n >\n <igx-icon family=\"imx-icons\" name=\"ungroup\"></igx-icon>\n <span>{{grid.resourceStrings.igx_grid_advanced_filter_ungroup}}</span>\n </button>\n <button\n igxButton=\"outlined\"\n [displayDensity]=\"displayDensity\"\n (click)=\"deleteGroup()\"\n class=\"igx-filter-contextual-menu__delete-btn\"\n >\n <igx-icon>delete</igx-icon>\n <span>{{grid.resourceStrings.igx_grid_advanced_filter_delete}}</span>\n </button>\n </ng-container>\n <ng-container *ngIf=\"!contextualGroup\">\n <button\n igxButton=\"outlined\"\n [displayDensity]=\"displayDensity\"\n (click)=\"createAndGroup()\"\n >\n {{grid.resourceStrings.igx_grid_advanced_filter_create_and_group}}\n </button>\n <button\n igxButton=\"outlined\"\n [displayDensity]=\"displayDensity\"\n (click)=\"createOrGroup()\"\n >\n {{grid.resourceStrings.igx_grid_advanced_filter_create_or_group}}\n </button>\n <button\n igxButton=\"outlined\"\n [displayDensity]=\"displayDensity\"\n (click)=\"deleteFilters()\"\n class=\"igx-filter-contextual-menu__delete-btn\"\n >\n {{grid.resourceStrings.igx_grid_advanced_filter_delete_filters}}\n </button>\n </ng-container>\n </div>\n </article>\n\n <footer class=\"igx-excel-filter__secondary-footer\">\n <div class=\"igx-excel-filter__clear\">\n <button\n igxButton=\"flat\"\n type=\"button\"\n [displayDensity]=\"displayDensity\"\n (click)=\"onClearButtonClick($event)\">\n {{ grid.resourceStrings.igx_grid_excel_custom_dialog_clear }}\n </button>\n </div>\n <div class=\"igx-excel-filter__cancel\">\n <button\n igxButton=\"flat\"\n type=\"button\"\n [displayDensity]=\"displayDensity\"\n (click)=\"cancelChanges()\">\n {{ grid.resourceStrings.igx_grid_excel_cancel }}\n </button>\n </div>\n <div class=\"igx-excel-filter__apply\">\n <button\n igxButton=\"raised\"\n type=\"button\"\n [displayDensity]=\"displayDensity\"\n (click)=\"onApplyButtonClick($event)\">\n {{ grid.resourceStrings.igx_grid_excel_apply }}\n </button>\n </div>\n </footer>\n</article>\n<div #overlayOutlet\n igxOverlayOutlet\n class=\"igx-advanced-filter__outlet\"\n (pointerdown)=\"onOutletPointerDown($event)\">\n</div>\n"
51835
51835
  },] }
51836
51836
  ];
51837
51837
  IgxAdvancedFilteringDialogComponent.ctorParameters = function () { return [
@@ -71189,7 +71189,7 @@
71189
71189
  IgxGridToolbarAdvancedFilteringComponent.decorators = [
71190
71190
  { type: i0.Component, args: [{
71191
71191
  selector: 'igx-grid-toolbar-advanced-filtering',
71192
- template: "<button igxButton=\"outlined\" [displayDensity]=\"grid.displayDensity\" name=\"btnAdvancedFiltering\" igxRipple\n [title]=\"grid?.resourceStrings.igx_grid_toolbar_advanced_filtering_button_tooltip\"\n (click)=\"grid.openAdvancedFilteringDialog(overlaySettings)\"\n [ngClass]=\"grid.advancedFilteringExpressionsTree ? 'igx-grid-toolbar__adv-filter--filtered' : 'igx-grid-toolbar__adv-filter'\">\n <igx-icon>filter_list</igx-icon>\n <span #ref>\n <ng-content></ng-content>\n </span>\n <span *ngIf=\"!ref.childNodes.length\">{{ grid?.resourceStrings.igx_grid_toolbar_advanced_filtering_button_label }}</span>\n</button>\n"
71192
+ template: "<button igxButton=\"outlined\" type=\"button\" [displayDensity]=\"grid.displayDensity\" name=\"btnAdvancedFiltering\" igxRipple\n [title]=\"grid?.resourceStrings.igx_grid_toolbar_advanced_filtering_button_tooltip\"\n (click)=\"grid.openAdvancedFilteringDialog(overlaySettings)\"\n [ngClass]=\"grid.advancedFilteringExpressionsTree ? 'igx-grid-toolbar__adv-filter--filtered' : 'igx-grid-toolbar__adv-filter'\">\n <igx-icon>filter_list</igx-icon>\n <span #ref>\n <ng-content></ng-content>\n </span>\n <span *ngIf=\"!ref.childNodes.length\">{{ grid?.resourceStrings.igx_grid_toolbar_advanced_filtering_button_label }}</span>\n</button>\n"
71193
71193
  },] }
71194
71194
  ];
71195
71195
  IgxGridToolbarAdvancedFilteringComponent.ctorParameters = function () { return [
@@ -71461,7 +71461,7 @@
71461
71461
  IgxGridToolbarExporterComponent.decorators = [
71462
71462
  { type: i0.Component, args: [{
71463
71463
  selector: 'igx-grid-toolbar-exporter',
71464
- template: "<button [title]=\"grid?.resourceStrings.igx_grid_toolbar_exporter_button_tooltip\" [disabled]=\"isExporting\"\n igxButton=\"outlined\" [displayDensity]=\"grid.displayDensity\" igxRipple #btn (click)=\"toggle(btn, toggleRef)\">\n\n <igx-icon>import_export</igx-icon>\n <span #ref>\n <ng-content></ng-content>\n </span>\n <span *ngIf=\"!ref.childNodes.length\">\n {{ grid.exportText || grid?.resourceStrings.igx_grid_toolbar_exporter_button_label }}\n </span>\n <igx-icon>arrow_drop_down</igx-icon>\n</button>\n\n<div class=\"igx-grid-toolbar__dropdown\" id=\"btnExport\">\n <ul class=\"igx-grid-toolbar__dd-list\" igxToggle #toggleRef=\"toggle\">\n <li *ngIf=\"grid.exportExcel || exportExcel\" #btnExportExcel id=\"btnExportExcel\"\n class=\"igx-grid-toolbar__dd-list-items\" igxRipple (click)=\"export('excel', toggleRef)\">\n\n <ng-template #excel>\n <ng-content select=[excelText],excel-text></ng-content>\n </ng-template>\n <excel-text *ngIf=\"!hasExcelAttr\">\n {{ grid.exportExcelText || grid?.resourceStrings.igx_grid_toolbar_exporter_excel_entry_text}}\n </excel-text>\n <ng-container *ngTemplateOutlet=\"excel\"></ng-container>\n </li>\n\n <li *ngIf=\"grid.exportCsv || exportCSV\" #btnExportCsv id=\"btnExportCsv\" class=\"igx-grid-toolbar__dd-list-items\"\n igxRipple (click)=\"export('csv', toggleRef)\">\n\n <ng-template #csv>\n <ng-content select=[csvText],csv-text></ng-content>\n </ng-template>\n <csv-text *ngIf=\"!hasCSVAttr\">\n {{ grid.exportCsvText || grid?.resourceStrings.igx_grid_toolbar_exporter_csv_entry_text }}</csv-text>\n <ng-container *ngTemplateOutlet=\"csv\"></ng-container>\n </li>\n </ul>\n</div>\n"
71464
+ template: "<button [title]=\"grid?.resourceStrings.igx_grid_toolbar_exporter_button_tooltip\" [disabled]=\"isExporting\"\n igxButton=\"outlined\" type=\"button\" [displayDensity]=\"grid.displayDensity\" igxRipple #btn (click)=\"toggle(btn, toggleRef)\">\n\n <igx-icon>import_export</igx-icon>\n <span #ref>\n <ng-content></ng-content>\n </span>\n <span *ngIf=\"!ref.childNodes.length\">\n {{ grid.exportText || grid?.resourceStrings.igx_grid_toolbar_exporter_button_label }}\n </span>\n <igx-icon>arrow_drop_down</igx-icon>\n</button>\n\n<div class=\"igx-grid-toolbar__dropdown\" id=\"btnExport\">\n <ul class=\"igx-grid-toolbar__dd-list\" igxToggle #toggleRef=\"toggle\">\n <li *ngIf=\"grid.exportExcel || exportExcel\" #btnExportExcel id=\"btnExportExcel\"\n class=\"igx-grid-toolbar__dd-list-items\" igxRipple (click)=\"export('excel', toggleRef)\">\n\n <ng-template #excel>\n <ng-content select=[excelText],excel-text></ng-content>\n </ng-template>\n <excel-text *ngIf=\"!hasExcelAttr\">\n {{ grid.exportExcelText || grid?.resourceStrings.igx_grid_toolbar_exporter_excel_entry_text}}\n </excel-text>\n <ng-container *ngTemplateOutlet=\"excel\"></ng-container>\n </li>\n\n <li *ngIf=\"grid.exportCsv || exportCSV\" #btnExportCsv id=\"btnExportCsv\" class=\"igx-grid-toolbar__dd-list-items\"\n igxRipple (click)=\"export('csv', toggleRef)\">\n\n <ng-template #csv>\n <ng-content select=[csvText],csv-text></ng-content>\n </ng-template>\n <csv-text *ngIf=\"!hasCSVAttr\">\n {{ grid.exportCsvText || grid?.resourceStrings.igx_grid_toolbar_exporter_csv_entry_text }}</csv-text>\n <ng-container *ngTemplateOutlet=\"csv\"></ng-container>\n </li>\n </ul>\n</div>\n"
71465
71465
  },] }
71466
71466
  ];
71467
71467
  IgxGridToolbarExporterComponent.ctorParameters = function () { return [
@@ -71508,7 +71508,7 @@
71508
71508
  IgxGridToolbarHidingComponent.decorators = [
71509
71509
  { type: i0.Component, args: [{
71510
71510
  selector: 'igx-grid-toolbar-hiding',
71511
- template: "<ng-container *ngIf=\"grid.rendered$ | async\">\n <button [title]=\"grid?.resourceStrings.igx_grid_toolbar_hiding_button_tooltip\" #btn igxButton=\"outlined\"\n name=\"btnColumnHiding\" (click)=\"toggle(btn, ref, actions)\" [displayDensity]=\"grid.displayDensity\">\n <igx-icon>{{ !grid.hiddenColumnsCount ? 'visibility' : 'visibility_off' }}</igx-icon>\n <span>{{ grid.hiddenColumnsCount }}</span>\n <span>{{ grid.hiddenColumnsText }}</span>\n </button>\n <igx-column-actions #actions igxColumnHiding igxToggle (opened)=\"focusSearch(ref.element)\" #ref=\"toggle\"\n [grid]=\"grid\" [title]=\"grid.columnHidingTitleInternal || title || grid?.resourceStrings.igx_grid_toolbar_hiding_title\"\n [filterColumnsPrompt]=\"prompt || grid?.resourceStrings.igx_grid_toolbar_actions_filter_prompt\"\n [hideFilter]=\"hideFilter\" [filterCriteria]=\"filterCriteria\" [columnDisplayOrder]=\"columnDisplayOrder\" [columnsAreaMaxHeight]=\"columnsAreaMaxHeight\"\n [uncheckAllText]=\"uncheckAllText\" [checkAllText]=\"checkAllText\" [indentation]=\"indentetion\">\n </igx-column-actions>\n</ng-container>\n"
71511
+ template: "<ng-container *ngIf=\"grid.rendered$ | async\">\n <button [title]=\"grid?.resourceStrings.igx_grid_toolbar_hiding_button_tooltip\" #btn igxButton=\"outlined\" type=\"button\"\n name=\"btnColumnHiding\" (click)=\"toggle(btn, ref, actions)\" [displayDensity]=\"grid.displayDensity\">\n <igx-icon>{{ !grid.hiddenColumnsCount ? 'visibility' : 'visibility_off' }}</igx-icon>\n <span>{{ grid.hiddenColumnsCount }}</span>\n <span>{{ grid.hiddenColumnsText }}</span>\n </button>\n <igx-column-actions #actions igxColumnHiding igxToggle (opened)=\"focusSearch(ref.element)\" #ref=\"toggle\"\n [grid]=\"grid\" [title]=\"grid.columnHidingTitleInternal || title || grid?.resourceStrings.igx_grid_toolbar_hiding_title\"\n [filterColumnsPrompt]=\"prompt || grid?.resourceStrings.igx_grid_toolbar_actions_filter_prompt\"\n [hideFilter]=\"hideFilter\" [filterCriteria]=\"filterCriteria\" [columnDisplayOrder]=\"columnDisplayOrder\" [columnsAreaMaxHeight]=\"columnsAreaMaxHeight\"\n [uncheckAllText]=\"uncheckAllText\" [checkAllText]=\"checkAllText\" [indentation]=\"indentetion\">\n </igx-column-actions>\n</ng-container>\n"
71512
71512
  },] }
71513
71513
  ];
71514
71514
  IgxGridToolbarHidingComponent.propDecorators = {
@@ -71544,7 +71544,7 @@
71544
71544
  IgxGridToolbarPinningComponent.decorators = [
71545
71545
  { type: i0.Component, args: [{
71546
71546
  selector: 'igx-grid-toolbar-pinning',
71547
- template: "<ng-container *ngIf=\"grid.rendered$ | async\">\n <button [title]=\"grid?.resourceStrings.igx_grid_toolbar_pinning_button_tooltip\" #btn igxButton=\"outlined\"\n name=\"btnColumnPinning\" (click)=\"toggle(btn, ref, actions)\" [displayDensity]=\"grid.displayDensity\">\n <igx-icon family=\"imx-icons\" [name]=\"!grid.pinnedColumnsCount ? 'unpin-left' : 'pin-left'\"></igx-icon>\n <span>{{ grid.pinnedColumnsCount }}</span>\n <span>{{ grid.pinnedColumnsTextInternal }}</span>\n </button>\n <igx-column-actions #actions igxColumnPinning igxToggle (opened)=\"focusSearch(ref.element)\" #ref=\"toggle\"\n [grid]=\"grid\" [title]=\"grid.columnPinningTitleInternal || title || grid?.resourceStrings.igx_grid_toolbar_pinning_title\"\n [filterColumnsPrompt]=\"prompt || grid?.resourceStrings.igx_grid_toolbar_actions_filter_prompt\"\n [hideFilter]=\"hideFilter\" [filterCriteria]=\"filterCriteria\" [columnDisplayOrder]=\"columnDisplayOrder\" [columnsAreaMaxHeight]=\"columnsAreaMaxHeight\"\n [uncheckAllText]=\"uncheckAllText\" [checkAllText]=\"checkAllText\" [indentation]=\"indentetion\">\n </igx-column-actions>\n</ng-container>\n"
71547
+ template: "<ng-container *ngIf=\"grid.rendered$ | async\">\n <button [title]=\"grid?.resourceStrings.igx_grid_toolbar_pinning_button_tooltip\" #btn igxButton=\"outlined\" type=\"button\"\n name=\"btnColumnPinning\" (click)=\"toggle(btn, ref, actions)\" [displayDensity]=\"grid.displayDensity\">\n <igx-icon family=\"imx-icons\" [name]=\"!grid.pinnedColumnsCount ? 'unpin-left' : 'pin-left'\"></igx-icon>\n <span>{{ grid.pinnedColumnsCount }}</span>\n <span>{{ grid.pinnedColumnsTextInternal }}</span>\n </button>\n <igx-column-actions #actions igxColumnPinning igxToggle (opened)=\"focusSearch(ref.element)\" #ref=\"toggle\"\n [grid]=\"grid\" [title]=\"grid.columnPinningTitleInternal || title || grid?.resourceStrings.igx_grid_toolbar_pinning_title\"\n [filterColumnsPrompt]=\"prompt || grid?.resourceStrings.igx_grid_toolbar_actions_filter_prompt\"\n [hideFilter]=\"hideFilter\" [filterCriteria]=\"filterCriteria\" [columnDisplayOrder]=\"columnDisplayOrder\" [columnsAreaMaxHeight]=\"columnsAreaMaxHeight\"\n [uncheckAllText]=\"uncheckAllText\" [checkAllText]=\"checkAllText\" [indentation]=\"indentetion\">\n </igx-column-actions>\n</ng-container>\n"
71548
71548
  },] }
71549
71549
  ];
71550
71550
  IgxGridToolbarPinningComponent.propDecorators = {
@@ -81635,7 +81635,7 @@
81635
81635
  IgxBottomNavComponent.decorators = [
81636
81636
  { type: i0.Component, args: [{
81637
81637
  selector: 'igx-bottom-nav',
81638
- template: "<ng-container *ngFor=\"let tab of items; let i = index\">\r\n <ng-container *ngTemplateOutlet=\"tab.panelTemplate\"></ng-container>\r\n</ng-container>\r\n\r\n<div\r\n #tablist\r\n role=\"tablist\"\r\n class=\"igx-bottom-nav__menu igx-bottom-nav__menu--bottom\"\r\n aria-orientation=\"horizontal\"\r\n>\r\n <ng-container *ngFor=\"let tab of items; let i = index\">\r\n <ng-container *ngTemplateOutlet=\"tab.headerTemplate\"></ng-container>\r\n </ng-container>\r\n</div>\r\n",
81638
+ template: "<ng-container *ngFor=\"let tab of items; let i = index\">\n <ng-container *ngTemplateOutlet=\"tab.panelTemplate\"></ng-container>\n</ng-container>\n\n<div\n #tablist\n role=\"tablist\"\n class=\"igx-bottom-nav__menu igx-bottom-nav__menu--bottom\"\n aria-orientation=\"horizontal\"\n>\n <ng-container *ngFor=\"let tab of items; let i = index\">\n <ng-container *ngTemplateOutlet=\"tab.headerTemplate\"></ng-container>\n </ng-container>\n</div>\n",
81639
81639
  providers: [{ provide: IgxTabsBase, useExisting: IgxBottomNavComponent }]
81640
81640
  },] }
81641
81641
  ];
@@ -81650,7 +81650,7 @@
81650
81650
  IgxBottomNavItemComponent.decorators = [
81651
81651
  { type: i0.Component, args: [{
81652
81652
  selector: 'igx-bottom-nav-item',
81653
- template: "<ng-template #headerTemplate>\r\n <ng-content select=\"igx-bottom-nav-header\"></ng-content>\r\n</ng-template>\r\n<ng-template #panelTemplate>\r\n <ng-content select=\"igx-bottom-nav-content\"></ng-content>\r\n</ng-template>\r\n",
81653
+ template: "<ng-template #headerTemplate>\n <ng-content select=\"igx-bottom-nav-header\"></ng-content>\n</ng-template>\n<ng-template #panelTemplate>\n <ng-content select=\"igx-bottom-nav-content\"></ng-content>\n</ng-template>\n",
81654
81654
  providers: [{ provide: IgxTabItemDirective, useExisting: IgxBottomNavItemComponent }]
81655
81655
  },] }
81656
81656
  ];
@@ -81689,7 +81689,7 @@
81689
81689
  IgxBottomNavHeaderComponent.decorators = [
81690
81690
  { type: i0.Component, args: [{
81691
81691
  selector: 'igx-bottom-nav-header',
81692
- template: "<ng-content></ng-content>\r\n",
81692
+ template: "<ng-content></ng-content>\n",
81693
81693
  providers: [{ provide: IgxTabHeaderBase, useExisting: IgxBottomNavHeaderComponent }]
81694
81694
  },] }
81695
81695
  ];
@@ -81733,7 +81733,7 @@
81733
81733
  IgxBottomNavContentComponent.decorators = [
81734
81734
  { type: i0.Component, args: [{
81735
81735
  selector: 'igx-bottom-nav-content',
81736
- template: "<ng-content *ngIf=\"tab.selected || tab.previous\"></ng-content>\r\n",
81736
+ template: "<ng-content *ngIf=\"tab.selected || tab.previous\"></ng-content>\n",
81737
81737
  providers: [{ provide: IgxTabContentBase, useExisting: IgxBottomNavContentComponent }]
81738
81738
  },] }
81739
81739
  ];
@@ -82032,7 +82032,7 @@
82032
82032
  IgxTabsComponent.decorators = [
82033
82033
  { type: i0.Component, args: [{
82034
82034
  selector: 'igx-tabs',
82035
- template: "<div #headerContainer class=\"igx-tabs__header\">\r\n <button\r\n #leftButton\r\n igxButton=\"icon\"\r\n igxRipple\r\n class=\"igx-tabs__header-button\"\r\n (click)=\"scrollLeft()\"\r\n >\r\n <igx-icon>navigate_before</igx-icon>\r\n </button>\r\n <div #viewPort class=\"igx-tabs__header-content\">\r\n <div\r\n #itemsWrapper\r\n class=\"igx-tabs__header-wrapper\" \r\n role=\"tablist\"\r\n >\r\n <div \r\n #itemsContainer\r\n class=\"igx-tabs__header-scroll\"\r\n [ngClass]=\"resolveHeaderScrollClasses()\"\r\n >\r\n <ng-container *ngFor=\"let tab of items; let i = index\">\r\n <ng-container *ngTemplateOutlet=\"tab.headerTemplate\"></ng-container>\r\n </ng-container>\r\n </div>\r\n <div\r\n #selectedIndicator\r\n *ngIf=\"items.length > 0\"\r\n class=\"igx-tabs__header-active-indicator\"\r\n >\r\n </div>\r\n </div>\r\n </div>\r\n <button\r\n #rightButton\r\n igxButton=\"icon\"\r\n igxRipple\r\n class=\"igx-tabs__header-button\"\r\n (click)=\"scrollRight()\"\r\n >\r\n <igx-icon>navigate_next</igx-icon>\r\n </button>\r\n</div>\r\n<div class=\"igx-tabs__panels\">\r\n <ng-container *ngFor=\"let tab of items; let i = index\">\r\n <ng-container *ngTemplateOutlet=\"tab.panelTemplate\"></ng-container>\r\n </ng-container>\r\n</div>\r\n",
82035
+ template: "<div #headerContainer class=\"igx-tabs__header\">\n <button\n #leftButton\n igxButton=\"icon\"\n igxRipple\n class=\"igx-tabs__header-button\"\n (click)=\"scrollLeft()\"\n >\n <igx-icon>navigate_before</igx-icon>\n </button>\n <div #viewPort class=\"igx-tabs__header-content\">\n <div\n #itemsWrapper\n class=\"igx-tabs__header-wrapper\" \n role=\"tablist\"\n >\n <div \n #itemsContainer\n class=\"igx-tabs__header-scroll\"\n [ngClass]=\"resolveHeaderScrollClasses()\"\n >\n <ng-container *ngFor=\"let tab of items; let i = index\">\n <ng-container *ngTemplateOutlet=\"tab.headerTemplate\"></ng-container>\n </ng-container>\n </div>\n <div\n #selectedIndicator\n *ngIf=\"items.length > 0\"\n class=\"igx-tabs__header-active-indicator\"\n >\n </div>\n </div>\n </div>\n <button\n #rightButton\n igxButton=\"icon\"\n igxRipple\n class=\"igx-tabs__header-button\"\n (click)=\"scrollRight()\"\n >\n <igx-icon>navigate_next</igx-icon>\n </button>\n</div>\n<div class=\"igx-tabs__panels\">\n <ng-container *ngFor=\"let tab of items; let i = index\">\n <ng-container *ngTemplateOutlet=\"tab.panelTemplate\"></ng-container>\n </ng-container>\n</div>\n",
82036
82036
  providers: [{ provide: IgxTabsBase, useExisting: IgxTabsComponent }]
82037
82037
  },] }
82038
82038
  ];
@@ -82063,7 +82063,7 @@
82063
82063
  IgxTabItemComponent.decorators = [
82064
82064
  { type: i0.Component, args: [{
82065
82065
  selector: 'igx-tab-item',
82066
- template: "<ng-template #headerTemplate>\r\n <ng-content select=\"igx-tab-header\"></ng-content>\r\n</ng-template>\r\n<ng-template #panelTemplate>\r\n <ng-content select=\"igx-tab-content\"></ng-content>\r\n</ng-template>\r\n",
82066
+ template: "<ng-template #headerTemplate>\n <ng-content select=\"igx-tab-header\"></ng-content>\n</ng-template>\n<ng-template #panelTemplate>\n <ng-content select=\"igx-tab-content\"></ng-content>\n</ng-template>\n",
82067
82067
  providers: [{ provide: IgxTabItemDirective, useExisting: IgxTabItemComponent }]
82068
82068
  },] }
82069
82069
  ];
@@ -82177,7 +82177,7 @@
82177
82177
  IgxTabHeaderComponent.decorators = [
82178
82178
  { type: i0.Component, args: [{
82179
82179
  selector: 'igx-tab-header',
82180
- template: "<ng-content select=\"igx-prefix,[igxPrefix]\"></ng-content>\r\n\r\n<div class=\"igx-tabs__header-item-inner\">\r\n <ng-content></ng-content>\r\n</div>\r\n\r\n<ng-content select=\"igx-suffix,[igxSuffix]\"></ng-content>\r\n",
82180
+ template: "<ng-content select=\"igx-prefix,[igxPrefix]\"></ng-content>\n\n<div class=\"igx-tabs__header-item-inner\">\n <ng-content></ng-content>\n</div>\n\n<ng-content select=\"igx-suffix,[igxSuffix]\"></ng-content>\n",
82181
82181
  providers: [{ provide: IgxTabHeaderBase, useExisting: IgxTabHeaderComponent }]
82182
82182
  },] }
82183
82183
  ];
@@ -82229,7 +82229,7 @@
82229
82229
  IgxTabContentComponent.decorators = [
82230
82230
  { type: i0.Component, args: [{
82231
82231
  selector: 'igx-tab-content',
82232
- template: "<ng-content *ngIf=\"tab.selected || tab.previous\"></ng-content>\r\n",
82232
+ template: "<ng-content *ngIf=\"tab.selected || tab.previous\"></ng-content>\n",
82233
82233
  providers: [{ provide: IgxTabContentBase, useExisting: IgxTabContentComponent }]
82234
82234
  },] }
82235
82235
  ];