igniteui-angular 15.0.1 → 15.0.2
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/esm2020/lib/grids/filtering/base/grid-filtering-row.component.mjs +3 -3
- package/fesm2015/igniteui-angular.mjs +2 -2
- package/fesm2015/igniteui-angular.mjs.map +1 -1
- package/fesm2020/igniteui-angular.mjs +2 -2
- package/fesm2020/igniteui-angular.mjs.map +1 -1
- package/migrations/update-15_0_0/index.js +33 -0
- package/package.json +1 -1
|
@@ -58599,10 +58599,10 @@ class IgxGridFilteringRowComponent {
|
|
|
58599
58599
|
}
|
|
58600
58600
|
}
|
|
58601
58601
|
IgxGridFilteringRowComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.0.0", ngImport: i0, type: IgxGridFilteringRowComponent, deps: [{ token: IgxFilteringService }, { token: i0.ElementRef }, { token: i0.ChangeDetectorRef }, { token: PlatformUtil }], target: i0.ɵɵFactoryTarget.Component });
|
|
58602
|
-
IgxGridFilteringRowComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.0.0", type: IgxGridFilteringRowComponent, selector: "igx-grid-filtering-row", inputs: { column: "column", value: "value" }, host: { listeners: { "keydown": "onKeydownHandler($event)" }, properties: { "class.igx-grid__filtering-row": "this.defaultCSSClass", "class.igx-grid__filtering-row--compact": "this.compactCSSClass", "class.igx-grid__filtering-row--cosy": "this.cosyCSSClass" } }, viewQueries: [{ propertyName: "defaultFilterUI", first: true, predicate: ["defaultFilterUI"], descendants: true, read: TemplateRef, static: true }, { propertyName: "defaultDateUI", first: true, predicate: ["defaultDateUI"], descendants: true, read: TemplateRef, static: true }, { propertyName: "defaultTimeUI", first: true, predicate: ["defaultTimeUI"], descendants: true, read: TemplateRef, static: true }, { propertyName: "defaultDateTimeUI", first: true, predicate: ["defaultDateTimeUI"], descendants: true, read: TemplateRef, static: true }, { propertyName: "input", first: true, predicate: ["input"], descendants: true, read: ElementRef }, { propertyName: "dropDownConditions", first: true, predicate: ["inputGroupConditions"], descendants: true, read: IgxDropDownComponent, static: true }, { propertyName: "chipsArea", first: true, predicate: ["chipsArea"], descendants: true, read: IgxChipsAreaComponent, static: true }, { propertyName: "inputGroup", first: true, predicate: ["inputGroup"], descendants: true, read: ElementRef }, { propertyName: "picker", first: true, predicate: ["picker"], descendants: true }, { propertyName: "inputGroupPrefix", first: true, predicate: ["inputGroupPrefix"], descendants: true, read: ElementRef }, { propertyName: "container", first: true, predicate: ["container"], descendants: true, static: true }, { propertyName: "operand", first: true, predicate: ["operand"], descendants: true }, { propertyName: "closeButton", first: true, predicate: ["closeButton"], descendants: true, static: true }, { propertyName: "dropDownOperators", predicate: ["operators"], descendants: true, read: IgxDropDownComponent }], ngImport: i0, template: "<!-- Have to apply styles inline because of the overlay outlet ... -->\n<igx-drop-down #inputGroupConditions [displayDensity]=\"displayDensity\" [height]=\"'200px'\" (selectionChanging)=\"onConditionsChanged($event)\">\n <igx-drop-down-item *ngFor=\"let condition of conditions\"\n [value]=\"condition\"\n [selected]=\"isConditionSelected(condition)\">\n <div class=\"igx-grid__filtering-dropdown-items\">\n <igx-icon family=\"imx-icons\" [name]=\"getCondition(condition).iconName\"></igx-icon>\n <span class=\"igx-grid__filtering-dropdown-text\">{{ translateCondition(condition) }}</span>\n </div>\n </igx-drop-down-item>\n</igx-drop-down>\n\n<ng-template #defaultFilterUI>\n <igx-input-group #inputGroup type=\"box\" [displayDensity]=\"displayDensity\" (focusout)=\"onInputGroupFocusout()\">\n <igx-prefix #inputGroupPrefix\n (click)=\"inputGroupPrefixClick($event)\"\n (keydown)=\"onPrefixKeyDown($event)\"\n tabindex=\"0\"\n [igxDropDownItemNavigation]=\"inputGroupConditions\">\n <igx-icon family=\"imx-icons\" [name]=\"getIconName()\"></igx-icon>\n </igx-prefix>\n <input\n #input\n igxInput\n tabindex=\"0\"\n [placeholder]=\"placeholder\"\n autocomplete=\"off\"\n [value]=\"value\"\n (input)=\"onInput($event)\"\n [type]=\"type\"\n [readonly]=\"isUnaryCondition\"\n (click)=\"onInputClick()\"\n (compositionstart)=\"onCompositionStart()\"\n (compositionend)=\"onCompositionEnd()\"\n (keydown)=\"onInputKeyDown($event)\"\n (keyup)=\"onInputKeyUp()\"/>\n <igx-suffix *ngIf=\"value || value === 0\" >\n <igx-icon (keydown)=\"onCommitKeyDown($event)\" (click)=\"onCommitClick()\" tabindex=\"0\">done</igx-icon>\n <igx-icon (keydown)=\"onClearKeyDown($event)\" (click)=\"onClearClick()\" tabindex=\"0\">clear</igx-icon>\n </igx-suffix>\n </igx-input-group>\n</ng-template>\n\n<ng-template #defaultDateUI>\n <igx-date-picker #picker\n [(value)]=\"value\"\n [readOnly]=\"true\"\n [outlet]=\"filteringService.grid.outlet\"\n [locale]=\"filteringService.grid.locale\"\n (click)=\"expression.condition.isUnary ? null : picker.open()\"\n type=\"box\"\n [displayFormat]=\"column.pipeArgs.format\"\n [formatter]=\"column.formatter\"\n [placeholder]=\"placeholder\"\n [weekStart]=\"column.pipeArgs.weekStart\"\n [displayDensity]=\"displayDensity\"\n (keydown)=\"onInputKeyDown($event)\"\n (focusout)=\"onInputGroupFocusout()\"\n (closed)=\"focusEditElement()\">\n <igx-prefix #inputGroupPrefix\n tabindex=\"0\"\n (click)=\"inputGroupPrefixClick($event)\"\n (keydown)=\"onPrefixKeyDown($event)\"\n [igxDropDownItemNavigation]=\"inputGroupConditions\">\n <igx-icon family=\"imx-icons\" [name]=\"expression.condition.iconName\"></igx-icon>\n </igx-prefix>\n <igx-suffix *ngIf=\"value\">\n <igx-icon tabindex=\"0\" (keydown)=\"onCommitKeyDown($event)\" (click)=\"onCommitClick($event)\">done</igx-icon>\n <igx-icon tabindex=\"0\" (keydown)=\"onClearKeyDown($event)\" (click)=\"clearInput($event)\">clear</igx-icon>\n </igx-suffix>\n <!-- disable default icons -->\n <igx-picker-toggle></igx-picker-toggle>\n <igx-picker-clear></igx-picker-clear>\n </igx-date-picker>\n</ng-template>\n\n<ng-template #defaultTimeUI>\n <igx-time-picker #picker\n [(value)]=\"value\"\n [inputFormat]=\"column.defaultTimeFormat\"\n [locale]=\"filteringService.grid.locale\"\n [formatter]=\"column.formatter\"\n [outlet]=\"filteringService.grid.outlet\"\n [displayDensity]=\"displayDensity\"\n type=\"box\"\n [readOnly]=\"true\"\n [placeholder]=\"placeholder\"\n (closed)=\"focusEditElement()\"\n (focusout)=\"onInputGroupFocusout()\"\n (keydown)=\"onInputKeyDown($event)\"\n (click)=\"expression.condition.isUnary ? null : picker.open()\">\n <igx-prefix #inputGroupPrefix\n tabindex=\"0\"\n (click)=\"inputGroupPrefixClick($event)\"\n (keydown)=\"onPrefixKeyDown($event)\"\n [igxDropDownItemNavigation]=\"inputGroupConditions\">\n <igx-icon family=\"imx-icons\" [name]=\"expression.condition.iconName\"></igx-icon>\n </igx-prefix>\n <igx-suffix *ngIf=\"value\">\n <igx-icon tabindex=\"0\" (keydown)=\"onCommitKeyDown($event)\" (click)=\"onCommitClick($event)\">done</igx-icon>\n <igx-icon tabindex=\"0\" (keydown)=\"onClearKeyDown($event)\" (click)=\"clearInput($event)\">clear</igx-icon>\n </igx-suffix>\n <!-- disable default icons -->\n <igx-picker-toggle></igx-picker-toggle>\n <igx-picker-clear></igx-picker-clear>\n </igx-time-picker>\n</ng-template>\n\n<ng-template #defaultDateTimeUI>\n <igx-input-group #inputGroup type=\"box\" [displayDensity]=\"displayDensity\" (focusout)=\"onInputGroupFocusout()\">\n <igx-prefix #inputGroupPrefix\n (click)=\"inputGroupPrefixClick($event)\"\n (keydown)=\"onPrefixKeyDown($event)\"\n tabindex=\"0\"\n [igxDropDownItemNavigation]=\"inputGroupConditions\">\n <igx-icon family=\"imx-icons\" [name]=\"getIconName()\"></igx-icon>\n </igx-prefix>\n <input\n #input\n igxInput\n tabindex=\"0\"\n [placeholder]=\"placeholder\"\n [igxDateTimeEditor]=\"column.defaultDateTimeFormat\"\n [value]=\"value\"\n (valueChange)=\"onInput($event)\"\n [readonly]=\"isUnaryCondition\"\n (click)=\"onInputClick()\"\n (keydown)=\"onInputKeyDown($event)\"\n (keyup)=\"onInputKeyUp()\"/>\n <igx-suffix *ngIf=\"value || value === 0\" >\n <igx-icon (keydown)=\"onCommitKeyDown($event)\" (click)=\"onCommitClick()\" tabindex=\"0\">done</igx-icon>\n <igx-icon (keydown)=\"onClearKeyDown($event)\" (click)=\"onClearClick()\" tabindex=\"0\">clear</igx-icon>\n </igx-suffix>\n </igx-input-group>\n</ng-template>\n\n<ng-container *ngTemplateOutlet=\"template; context: { $implicit: this }\"></ng-container>\n\n<button igxButton=\"icon\" class=\"igx-grid__filtering-row-scroll-start\" *ngIf=\"showArrows\" (keydown)=\"onLeftArrowKeyDown($event)\" (click)=\"scrollChipsOnArrowPress('left')\">\n <igx-icon>navigate_before</igx-icon>\n</button>\n\n<div #container class=\"igx-grid__filtering-row-main\">\n <div>\n <igx-chips-area #chipsArea>\n <ng-container *ngFor=\"let item of expressionsList; index as i; let last = last;\" tabindex=\"0\">\n <igx-chip #chip id='chip'\n (pointerdown)=\"onChipPointerdown($event, chip)\"\n (click)=\"onChipClick($event, item)\"\n (keydown)=\"onChipKeyDown($event, item)\"\n (remove)=\"onChipRemoved($event, item)\"\n [selectable]=\"false\"\n [selected]=\"item.isSelected\"\n [displayDensity]=\"displayDensity\"\n [removable]=\"true\">\n <igx-icon\n igxPrefix\n family=\"imx-icons\"\n [name]=\"item.expression.condition.iconName\">\n </igx-icon>\n <span>{{filteringService.getChipLabel(item.expression)}}</span>\n </igx-chip>\n\n <span id='operand' *ngIf=\"!last\">\n <button igxButton (click)=\"toggleOperatorsDropDown($event, i)\" [igxDropDownItemNavigation]=\"operators\" [displayDensity]=\"displayDensity\">\n <igx-icon>expand_more</igx-icon>\n <span>{{filteringService.getOperatorAsString(item.afterOperator)}}</span>\n </button>\n <igx-drop-down [displayDensity]=\"column.grid.displayDensity\" #operators (selectionChanging)=\"onLogicOperatorChanged($event, item)\">\n <igx-drop-down-item [value]=\"0\" [selected]=\"item.afterOperator === 0\">{{filteringService.grid.resourceStrings.igx_grid_filter_operator_and}}</igx-drop-down-item>\n <igx-drop-down-item [value]=\"1\" [selected]=\"item.afterOperator === 1\">{{filteringService.grid.resourceStrings.igx_grid_filter_operator_or}}</igx-drop-down-item>\n </igx-drop-down>\n </span>\n </ng-container>\n </igx-chips-area>\n </div>\n</div>\n\n<button igxButton=\"icon\" class=\"igx-grid__filtering-row-scroll-end\" *ngIf=\"showArrows\" (click)=\"scrollChipsOnArrowPress('right')\">\n <igx-icon>navigate_next</igx-icon>\n</button>\n\n<div #buttonsContainer [ngClass]=\"isNarrowWidth ? 'igx-grid__filtering-row-editing-buttons--small' : 'igx-grid__filtering-row-editing-buttons'\">\n <button [displayDensity]=\"displayDensity\" [igxButton]=\"isNarrowWidth ? 'icon' : 'flat'\" igxRipple (click)=\"clearFiltering()\" [disabled]=\"disabled\" [tabindex]=\"disabled\">\n <igx-icon>refresh</igx-icon>\n <span>{{isNarrowWidth ? '' : filteringService.grid.resourceStrings.igx_grid_filter_row_reset}}</span>\n </button>\n <button #closeButton [displayDensity]=\"displayDensity\" [igxButton]=\"isNarrowWidth ? 'icon' : 'flat'\" igxRipple (click)=\"close()\">\n <igx-icon>close</igx-icon>\n <span>{{isNarrowWidth ? '' : filteringService.grid.resourceStrings.igx_grid_filter_row_close}}</span>\n </button>\n</div>\n", dependencies: [{ kind: "directive", type: i1$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: IgxButtonDirective, selector: "[igxButton]", inputs: ["selected", "igxButton", "igxButtonColor", "igxButtonBackground", "igxLabel", "disabled"], outputs: ["buttonClick", "buttonSelected"] }, { kind: "component", type: IgxDatePickerComponent, selector: "igx-date-picker", inputs: ["hideOutsideDays", "displayMonthsCount", "showWeekNumbers", "formatter", "headerOrientation", "todayButtonLabel", "cancelButtonLabel", "spinLoop", "spinDelta", "outlet", "id", "formatViews", "disabledDates", "specialDates", "calendarFormat", "value", "minValue", "maxValue", "resourceStrings", "readOnly"], outputs: ["valueChange", "validationFailed"] }, { kind: "component", type: IgxPickerToggleComponent, selector: "igx-picker-toggle", outputs: ["clicked"] }, { kind: "component", type: IgxPickerClearComponent, selector: "igx-picker-clear" }, { kind: "component", type: IgxIconComponent, selector: "igx-icon", inputs: ["family", "active", "name"] }, { kind: "directive", type: IgxRippleDirective, selector: "[igxRipple]", inputs: ["igxRippleTarget", "igxRipple", "igxRippleDuration", "igxRippleCentered", "igxRippleDisabled"] }, { 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: IgxPrefixDirective, selector: "igx-prefix,[igxPrefix]" }, { kind: "directive", type: IgxSuffixDirective, selector: "igx-suffix,[igxSuffix]" }, { kind: "component", type: IgxChipsAreaComponent, selector: "igx-chips-area", inputs: ["class", "width", "height"], outputs: ["reorder", "selectionChange", "moveStart", "moveEnd"] }, { kind: "component", type: IgxChipComponent, selector: "igx-chip", inputs: ["id", "tabIndex", "data", "draggable", "animateOnRelease", "hideBaseOnDrag", "removable", "removeIcon", "selectable", "selectIcon", "class", "disabled", "selected", "color", "resourceStrings"], outputs: ["selectedChange", "moveStart", "moveEnd", "remove", "chipClick", "selectedChanging", "selectedChanged", "keyDown", "dragEnter", "dragLeave", "dragOver", "dragDrop"] }, { kind: "component", type: IgxDropDownComponent, selector: "igx-drop-down", inputs: ["allowItemsFocus", "labelledBy"], outputs: ["opening", "opened", "closing", "closed"] }, { kind: "component", type: IgxDropDownItemComponent, selector: "igx-drop-down-item" }, { kind: "directive", type: IgxDropDownItemNavigationDirective, selector: "[igxDropDownItemNavigation]", inputs: ["igxDropDownItemNavigation"] }, { kind: "component", type: IgxTimePickerComponent, selector: "igx-time-picker", inputs: ["id", "displayFormat", "inputFormat", "mode", "minValue", "maxValue", "spinLoop", "formatter", "headerOrientation", "readOnly", "value", "resourceStrings", "okButtonLabel", "cancelButtonLabel", "itemsDelta"], outputs: ["selected", "valueChange", "validationFailed"] }, { kind: "directive", type: IgxDateTimeEditorDirective, selector: "[igxDateTimeEditor]", inputs: ["locale", "minValue", "maxValue", "spinLoop", "displayFormat", "igxDateTimeEditor", "value", "spinDelta"], outputs: ["valueChange", "validationFailed"], exportAs: ["igxDateTimeEditor"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
58602
|
+
IgxGridFilteringRowComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.0.0", type: IgxGridFilteringRowComponent, selector: "igx-grid-filtering-row", inputs: { column: "column", value: "value" }, host: { listeners: { "keydown": "onKeydownHandler($event)" }, properties: { "class.igx-grid__filtering-row": "this.defaultCSSClass", "class.igx-grid__filtering-row--compact": "this.compactCSSClass", "class.igx-grid__filtering-row--cosy": "this.cosyCSSClass" } }, viewQueries: [{ propertyName: "defaultFilterUI", first: true, predicate: ["defaultFilterUI"], descendants: true, read: TemplateRef, static: true }, { propertyName: "defaultDateUI", first: true, predicate: ["defaultDateUI"], descendants: true, read: TemplateRef, static: true }, { propertyName: "defaultTimeUI", first: true, predicate: ["defaultTimeUI"], descendants: true, read: TemplateRef, static: true }, { propertyName: "defaultDateTimeUI", first: true, predicate: ["defaultDateTimeUI"], descendants: true, read: TemplateRef, static: true }, { propertyName: "input", first: true, predicate: ["input"], descendants: true, read: ElementRef }, { propertyName: "dropDownConditions", first: true, predicate: ["inputGroupConditions"], descendants: true, read: IgxDropDownComponent, static: true }, { propertyName: "chipsArea", first: true, predicate: ["chipsArea"], descendants: true, read: IgxChipsAreaComponent, static: true }, { propertyName: "inputGroup", first: true, predicate: ["inputGroup"], descendants: true, read: ElementRef }, { propertyName: "picker", first: true, predicate: ["picker"], descendants: true }, { propertyName: "inputGroupPrefix", first: true, predicate: ["inputGroupPrefix"], descendants: true, read: ElementRef }, { propertyName: "container", first: true, predicate: ["container"], descendants: true, static: true }, { propertyName: "operand", first: true, predicate: ["operand"], descendants: true }, { propertyName: "closeButton", first: true, predicate: ["closeButton"], descendants: true, static: true }, { propertyName: "dropDownOperators", predicate: ["operators"], descendants: true, read: IgxDropDownComponent }], ngImport: i0, template: "<!-- Have to apply styles inline because of the overlay outlet ... -->\n<igx-drop-down #inputGroupConditions [displayDensity]=\"displayDensity\" [height]=\"'200px'\" (selectionChanging)=\"onConditionsChanged($event)\">\n <igx-drop-down-item *ngFor=\"let condition of conditions\"\n [value]=\"condition\"\n [selected]=\"isConditionSelected(condition)\">\n <div class=\"igx-grid__filtering-dropdown-items\">\n <igx-icon family=\"imx-icons\" [name]=\"getCondition(condition).iconName\"></igx-icon>\n <span class=\"igx-grid__filtering-dropdown-text\">{{ translateCondition(condition) }}</span>\n </div>\n </igx-drop-down-item>\n</igx-drop-down>\n\n<ng-template #defaultFilterUI>\n <igx-input-group #inputGroup type=\"box\" [displayDensity]=\"displayDensity\" (focusout)=\"onInputGroupFocusout()\">\n <igx-prefix #inputGroupPrefix\n (click)=\"inputGroupPrefixClick($event)\"\n (keydown)=\"onPrefixKeyDown($event)\"\n tabindex=\"0\"\n [igxDropDownItemNavigation]=\"inputGroupConditions\">\n <igx-icon family=\"imx-icons\" [name]=\"getIconName()\"></igx-icon>\n </igx-prefix>\n <input\n #input\n igxInput\n tabindex=\"0\"\n [placeholder]=\"placeholder\"\n autocomplete=\"off\"\n [value]=\"value\"\n (input)=\"onInput($event)\"\n [type]=\"type\"\n [readonly]=\"isUnaryCondition\"\n (click)=\"onInputClick()\"\n (compositionstart)=\"onCompositionStart()\"\n (compositionend)=\"onCompositionEnd()\"\n (keydown)=\"onInputKeyDown($event)\"\n (keyup)=\"onInputKeyUp()\"/>\n <igx-suffix *ngIf=\"value || value === 0\" >\n <igx-icon (keydown)=\"onCommitKeyDown($event)\" (click)=\"onCommitClick()\" tabindex=\"0\">done</igx-icon>\n <igx-icon (keydown)=\"onClearKeyDown($event)\" (click)=\"onClearClick()\" tabindex=\"0\">clear</igx-icon>\n </igx-suffix>\n </igx-input-group>\n</ng-template>\n\n<ng-template #defaultDateUI>\n <igx-date-picker #picker\n [(value)]=\"value\"\n [readOnly]=\"true\"\n [outlet]=\"filteringService.grid.outlet\"\n [locale]=\"filteringService.grid.locale\"\n (click)=\"expression.condition.isUnary ? null : picker.open()\"\n type=\"box\"\n [displayFormat]=\"column.pipeArgs.format\"\n [formatter]=\"column.formatter\"\n [placeholder]=\"placeholder\"\n [weekStart]=\"column.pipeArgs.weekStart\"\n [displayDensity]=\"displayDensity\"\n (keydown)=\"onInputKeyDown($event)\"\n (focusout)=\"onInputGroupFocusout()\"\n (closed)=\"focusEditElement()\">\n <igx-prefix #inputGroupPrefix\n tabindex=\"0\"\n (click)=\"inputGroupPrefixClick($event)\"\n (keydown)=\"onPrefixKeyDown($event)\"\n [igxDropDownItemNavigation]=\"inputGroupConditions\">\n <igx-icon family=\"imx-icons\" [name]=\"expression.condition.iconName\"></igx-icon>\n </igx-prefix>\n <igx-suffix *ngIf=\"value\">\n <igx-icon tabindex=\"0\" (keydown)=\"onCommitKeyDown($event)\" (click)=\"onCommitClick($event)\">done</igx-icon>\n <igx-icon tabindex=\"0\" (keydown)=\"onClearKeyDown($event)\" (click)=\"clearInput($event)\">clear</igx-icon>\n </igx-suffix>\n <!-- disable default icons -->\n <igx-picker-toggle></igx-picker-toggle>\n <igx-picker-clear></igx-picker-clear>\n </igx-date-picker>\n</ng-template>\n\n<ng-template #defaultTimeUI>\n <igx-time-picker #picker\n [(value)]=\"value\"\n [inputFormat]=\"column.defaultTimeFormat\"\n [locale]=\"filteringService.grid.locale\"\n [formatter]=\"column.formatter\"\n [outlet]=\"filteringService.grid.outlet\"\n [displayDensity]=\"displayDensity\"\n type=\"box\"\n [readOnly]=\"true\"\n [placeholder]=\"placeholder\"\n (closed)=\"focusEditElement()\"\n (focusout)=\"onInputGroupFocusout()\"\n (keydown)=\"onInputKeyDown($event)\"\n (click)=\"expression.condition.isUnary ? null : picker.open()\">\n <igx-prefix #inputGroupPrefix\n tabindex=\"0\"\n (click)=\"inputGroupPrefixClick($event)\"\n (keydown)=\"onPrefixKeyDown($event)\"\n [igxDropDownItemNavigation]=\"inputGroupConditions\">\n <igx-icon family=\"imx-icons\" [name]=\"expression.condition.iconName\"></igx-icon>\n </igx-prefix>\n <igx-suffix *ngIf=\"value\">\n <igx-icon tabindex=\"0\" (keydown)=\"onCommitKeyDown($event)\" (click)=\"onCommitClick($event)\">done</igx-icon>\n <igx-icon tabindex=\"0\" (keydown)=\"onClearKeyDown($event)\" (click)=\"clearInput($event)\">clear</igx-icon>\n </igx-suffix>\n <!-- disable default icons -->\n <igx-picker-toggle></igx-picker-toggle>\n <igx-picker-clear></igx-picker-clear>\n </igx-time-picker>\n</ng-template>\n\n<ng-template #defaultDateTimeUI>\n <igx-input-group #inputGroup type=\"box\" [displayDensity]=\"displayDensity\" (focusout)=\"onInputGroupFocusout()\">\n <igx-prefix #inputGroupPrefix\n (click)=\"inputGroupPrefixClick($event)\"\n (keydown)=\"onPrefixKeyDown($event)\"\n tabindex=\"0\"\n [igxDropDownItemNavigation]=\"inputGroupConditions\">\n <igx-icon family=\"imx-icons\" [name]=\"getIconName()\"></igx-icon>\n </igx-prefix>\n <input\n #input\n igxInput\n tabindex=\"0\"\n [placeholder]=\"placeholder\"\n [igxDateTimeEditor]=\"column.defaultDateTimeFormat\"\n [value]=\"value\"\n (valueChange)=\"onInput($event)\"\n [readonly]=\"isUnaryCondition\"\n (click)=\"onInputClick()\"\n (keydown)=\"onInputKeyDown($event)\"\n (keyup)=\"onInputKeyUp()\"/>\n <igx-suffix *ngIf=\"value || value === 0\" >\n <igx-icon (keydown)=\"onCommitKeyDown($event)\" (click)=\"onCommitClick()\" tabindex=\"0\">done</igx-icon>\n <igx-icon (keydown)=\"onClearKeyDown($event)\" (click)=\"onClearClick()\" tabindex=\"0\">clear</igx-icon>\n </igx-suffix>\n </igx-input-group>\n</ng-template>\n\n<ng-container *ngTemplateOutlet=\"template; context: { $implicit: this }\"></ng-container>\n\n<button igxButton=\"icon\" type=\"button\" class=\"igx-grid__filtering-row-scroll-start\" *ngIf=\"showArrows\" (keydown)=\"onLeftArrowKeyDown($event)\" (click)=\"scrollChipsOnArrowPress('left')\">\n <igx-icon>navigate_before</igx-icon>\n</button>\n\n<div #container class=\"igx-grid__filtering-row-main\">\n <div>\n <igx-chips-area #chipsArea>\n <ng-container *ngFor=\"let item of expressionsList; index as i; let last = last;\" tabindex=\"0\">\n <igx-chip #chip id='chip'\n (pointerdown)=\"onChipPointerdown($event, chip)\"\n (click)=\"onChipClick($event, item)\"\n (keydown)=\"onChipKeyDown($event, item)\"\n (remove)=\"onChipRemoved($event, item)\"\n [selectable]=\"false\"\n [selected]=\"item.isSelected\"\n [displayDensity]=\"displayDensity\"\n [removable]=\"true\">\n <igx-icon\n igxPrefix\n family=\"imx-icons\"\n [name]=\"item.expression.condition.iconName\">\n </igx-icon>\n <span>{{filteringService.getChipLabel(item.expression)}}</span>\n </igx-chip>\n\n <span id='operand' *ngIf=\"!last\">\n <button igxButton type=\"button\" (click)=\"toggleOperatorsDropDown($event, i)\" [igxDropDownItemNavigation]=\"operators\" [displayDensity]=\"displayDensity\">\n <igx-icon>expand_more</igx-icon>\n <span>{{filteringService.getOperatorAsString(item.afterOperator)}}</span>\n </button>\n <igx-drop-down [displayDensity]=\"column.grid.displayDensity\" #operators (selectionChanging)=\"onLogicOperatorChanged($event, item)\">\n <igx-drop-down-item [value]=\"0\" [selected]=\"item.afterOperator === 0\">{{filteringService.grid.resourceStrings.igx_grid_filter_operator_and}}</igx-drop-down-item>\n <igx-drop-down-item [value]=\"1\" [selected]=\"item.afterOperator === 1\">{{filteringService.grid.resourceStrings.igx_grid_filter_operator_or}}</igx-drop-down-item>\n </igx-drop-down>\n </span>\n </ng-container>\n </igx-chips-area>\n </div>\n</div>\n\n<button igxButton=\"icon\" type=\"button\" class=\"igx-grid__filtering-row-scroll-end\" *ngIf=\"showArrows\" (click)=\"scrollChipsOnArrowPress('right')\">\n <igx-icon>navigate_next</igx-icon>\n</button>\n\n<div #buttonsContainer [ngClass]=\"isNarrowWidth ? 'igx-grid__filtering-row-editing-buttons--small' : 'igx-grid__filtering-row-editing-buttons'\">\n <button [displayDensity]=\"displayDensity\" [igxButton]=\"isNarrowWidth ? 'icon' : 'flat'\" type=\"button\" igxRipple (click)=\"clearFiltering()\" [disabled]=\"disabled\" [tabindex]=\"disabled\">\n <igx-icon>refresh</igx-icon>\n <span>{{isNarrowWidth ? '' : filteringService.grid.resourceStrings.igx_grid_filter_row_reset}}</span>\n </button>\n <button #closeButton [displayDensity]=\"displayDensity\" [igxButton]=\"isNarrowWidth ? 'icon' : 'flat'\" type=\"button\" igxRipple (click)=\"close()\">\n <igx-icon>close</igx-icon>\n <span>{{isNarrowWidth ? '' : filteringService.grid.resourceStrings.igx_grid_filter_row_close}}</span>\n </button>\n</div>\n", dependencies: [{ kind: "directive", type: i1$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: IgxButtonDirective, selector: "[igxButton]", inputs: ["selected", "igxButton", "igxButtonColor", "igxButtonBackground", "igxLabel", "disabled"], outputs: ["buttonClick", "buttonSelected"] }, { kind: "component", type: IgxDatePickerComponent, selector: "igx-date-picker", inputs: ["hideOutsideDays", "displayMonthsCount", "showWeekNumbers", "formatter", "headerOrientation", "todayButtonLabel", "cancelButtonLabel", "spinLoop", "spinDelta", "outlet", "id", "formatViews", "disabledDates", "specialDates", "calendarFormat", "value", "minValue", "maxValue", "resourceStrings", "readOnly"], outputs: ["valueChange", "validationFailed"] }, { kind: "component", type: IgxPickerToggleComponent, selector: "igx-picker-toggle", outputs: ["clicked"] }, { kind: "component", type: IgxPickerClearComponent, selector: "igx-picker-clear" }, { kind: "component", type: IgxIconComponent, selector: "igx-icon", inputs: ["family", "active", "name"] }, { kind: "directive", type: IgxRippleDirective, selector: "[igxRipple]", inputs: ["igxRippleTarget", "igxRipple", "igxRippleDuration", "igxRippleCentered", "igxRippleDisabled"] }, { 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: IgxPrefixDirective, selector: "igx-prefix,[igxPrefix]" }, { kind: "directive", type: IgxSuffixDirective, selector: "igx-suffix,[igxSuffix]" }, { kind: "component", type: IgxChipsAreaComponent, selector: "igx-chips-area", inputs: ["class", "width", "height"], outputs: ["reorder", "selectionChange", "moveStart", "moveEnd"] }, { kind: "component", type: IgxChipComponent, selector: "igx-chip", inputs: ["id", "tabIndex", "data", "draggable", "animateOnRelease", "hideBaseOnDrag", "removable", "removeIcon", "selectable", "selectIcon", "class", "disabled", "selected", "color", "resourceStrings"], outputs: ["selectedChange", "moveStart", "moveEnd", "remove", "chipClick", "selectedChanging", "selectedChanged", "keyDown", "dragEnter", "dragLeave", "dragOver", "dragDrop"] }, { kind: "component", type: IgxDropDownComponent, selector: "igx-drop-down", inputs: ["allowItemsFocus", "labelledBy"], outputs: ["opening", "opened", "closing", "closed"] }, { kind: "component", type: IgxDropDownItemComponent, selector: "igx-drop-down-item" }, { kind: "directive", type: IgxDropDownItemNavigationDirective, selector: "[igxDropDownItemNavigation]", inputs: ["igxDropDownItemNavigation"] }, { kind: "component", type: IgxTimePickerComponent, selector: "igx-time-picker", inputs: ["id", "displayFormat", "inputFormat", "mode", "minValue", "maxValue", "spinLoop", "formatter", "headerOrientation", "readOnly", "value", "resourceStrings", "okButtonLabel", "cancelButtonLabel", "itemsDelta"], outputs: ["selected", "valueChange", "validationFailed"] }, { kind: "directive", type: IgxDateTimeEditorDirective, selector: "[igxDateTimeEditor]", inputs: ["locale", "minValue", "maxValue", "spinLoop", "displayFormat", "igxDateTimeEditor", "value", "spinDelta"], outputs: ["valueChange", "validationFailed"], exportAs: ["igxDateTimeEditor"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
58603
58603
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.0", ngImport: i0, type: IgxGridFilteringRowComponent, decorators: [{
|
|
58604
58604
|
type: Component,
|
|
58605
|
-
args: [{ changeDetection: ChangeDetectionStrategy.OnPush, selector: 'igx-grid-filtering-row', template: "<!-- Have to apply styles inline because of the overlay outlet ... -->\n<igx-drop-down #inputGroupConditions [displayDensity]=\"displayDensity\" [height]=\"'200px'\" (selectionChanging)=\"onConditionsChanged($event)\">\n <igx-drop-down-item *ngFor=\"let condition of conditions\"\n [value]=\"condition\"\n [selected]=\"isConditionSelected(condition)\">\n <div class=\"igx-grid__filtering-dropdown-items\">\n <igx-icon family=\"imx-icons\" [name]=\"getCondition(condition).iconName\"></igx-icon>\n <span class=\"igx-grid__filtering-dropdown-text\">{{ translateCondition(condition) }}</span>\n </div>\n </igx-drop-down-item>\n</igx-drop-down>\n\n<ng-template #defaultFilterUI>\n <igx-input-group #inputGroup type=\"box\" [displayDensity]=\"displayDensity\" (focusout)=\"onInputGroupFocusout()\">\n <igx-prefix #inputGroupPrefix\n (click)=\"inputGroupPrefixClick($event)\"\n (keydown)=\"onPrefixKeyDown($event)\"\n tabindex=\"0\"\n [igxDropDownItemNavigation]=\"inputGroupConditions\">\n <igx-icon family=\"imx-icons\" [name]=\"getIconName()\"></igx-icon>\n </igx-prefix>\n <input\n #input\n igxInput\n tabindex=\"0\"\n [placeholder]=\"placeholder\"\n autocomplete=\"off\"\n [value]=\"value\"\n (input)=\"onInput($event)\"\n [type]=\"type\"\n [readonly]=\"isUnaryCondition\"\n (click)=\"onInputClick()\"\n (compositionstart)=\"onCompositionStart()\"\n (compositionend)=\"onCompositionEnd()\"\n (keydown)=\"onInputKeyDown($event)\"\n (keyup)=\"onInputKeyUp()\"/>\n <igx-suffix *ngIf=\"value || value === 0\" >\n <igx-icon (keydown)=\"onCommitKeyDown($event)\" (click)=\"onCommitClick()\" tabindex=\"0\">done</igx-icon>\n <igx-icon (keydown)=\"onClearKeyDown($event)\" (click)=\"onClearClick()\" tabindex=\"0\">clear</igx-icon>\n </igx-suffix>\n </igx-input-group>\n</ng-template>\n\n<ng-template #defaultDateUI>\n <igx-date-picker #picker\n [(value)]=\"value\"\n [readOnly]=\"true\"\n [outlet]=\"filteringService.grid.outlet\"\n [locale]=\"filteringService.grid.locale\"\n (click)=\"expression.condition.isUnary ? null : picker.open()\"\n type=\"box\"\n [displayFormat]=\"column.pipeArgs.format\"\n [formatter]=\"column.formatter\"\n [placeholder]=\"placeholder\"\n [weekStart]=\"column.pipeArgs.weekStart\"\n [displayDensity]=\"displayDensity\"\n (keydown)=\"onInputKeyDown($event)\"\n (focusout)=\"onInputGroupFocusout()\"\n (closed)=\"focusEditElement()\">\n <igx-prefix #inputGroupPrefix\n tabindex=\"0\"\n (click)=\"inputGroupPrefixClick($event)\"\n (keydown)=\"onPrefixKeyDown($event)\"\n [igxDropDownItemNavigation]=\"inputGroupConditions\">\n <igx-icon family=\"imx-icons\" [name]=\"expression.condition.iconName\"></igx-icon>\n </igx-prefix>\n <igx-suffix *ngIf=\"value\">\n <igx-icon tabindex=\"0\" (keydown)=\"onCommitKeyDown($event)\" (click)=\"onCommitClick($event)\">done</igx-icon>\n <igx-icon tabindex=\"0\" (keydown)=\"onClearKeyDown($event)\" (click)=\"clearInput($event)\">clear</igx-icon>\n </igx-suffix>\n <!-- disable default icons -->\n <igx-picker-toggle></igx-picker-toggle>\n <igx-picker-clear></igx-picker-clear>\n </igx-date-picker>\n</ng-template>\n\n<ng-template #defaultTimeUI>\n <igx-time-picker #picker\n [(value)]=\"value\"\n [inputFormat]=\"column.defaultTimeFormat\"\n [locale]=\"filteringService.grid.locale\"\n [formatter]=\"column.formatter\"\n [outlet]=\"filteringService.grid.outlet\"\n [displayDensity]=\"displayDensity\"\n type=\"box\"\n [readOnly]=\"true\"\n [placeholder]=\"placeholder\"\n (closed)=\"focusEditElement()\"\n (focusout)=\"onInputGroupFocusout()\"\n (keydown)=\"onInputKeyDown($event)\"\n (click)=\"expression.condition.isUnary ? null : picker.open()\">\n <igx-prefix #inputGroupPrefix\n tabindex=\"0\"\n (click)=\"inputGroupPrefixClick($event)\"\n (keydown)=\"onPrefixKeyDown($event)\"\n [igxDropDownItemNavigation]=\"inputGroupConditions\">\n <igx-icon family=\"imx-icons\" [name]=\"expression.condition.iconName\"></igx-icon>\n </igx-prefix>\n <igx-suffix *ngIf=\"value\">\n <igx-icon tabindex=\"0\" (keydown)=\"onCommitKeyDown($event)\" (click)=\"onCommitClick($event)\">done</igx-icon>\n <igx-icon tabindex=\"0\" (keydown)=\"onClearKeyDown($event)\" (click)=\"clearInput($event)\">clear</igx-icon>\n </igx-suffix>\n <!-- disable default icons -->\n <igx-picker-toggle></igx-picker-toggle>\n <igx-picker-clear></igx-picker-clear>\n </igx-time-picker>\n</ng-template>\n\n<ng-template #defaultDateTimeUI>\n <igx-input-group #inputGroup type=\"box\" [displayDensity]=\"displayDensity\" (focusout)=\"onInputGroupFocusout()\">\n <igx-prefix #inputGroupPrefix\n (click)=\"inputGroupPrefixClick($event)\"\n (keydown)=\"onPrefixKeyDown($event)\"\n tabindex=\"0\"\n [igxDropDownItemNavigation]=\"inputGroupConditions\">\n <igx-icon family=\"imx-icons\" [name]=\"getIconName()\"></igx-icon>\n </igx-prefix>\n <input\n #input\n igxInput\n tabindex=\"0\"\n [placeholder]=\"placeholder\"\n [igxDateTimeEditor]=\"column.defaultDateTimeFormat\"\n [value]=\"value\"\n (valueChange)=\"onInput($event)\"\n [readonly]=\"isUnaryCondition\"\n (click)=\"onInputClick()\"\n (keydown)=\"onInputKeyDown($event)\"\n (keyup)=\"onInputKeyUp()\"/>\n <igx-suffix *ngIf=\"value || value === 0\" >\n <igx-icon (keydown)=\"onCommitKeyDown($event)\" (click)=\"onCommitClick()\" tabindex=\"0\">done</igx-icon>\n <igx-icon (keydown)=\"onClearKeyDown($event)\" (click)=\"onClearClick()\" tabindex=\"0\">clear</igx-icon>\n </igx-suffix>\n </igx-input-group>\n</ng-template>\n\n<ng-container *ngTemplateOutlet=\"template; context: { $implicit: this }\"></ng-container>\n\n<button igxButton=\"icon\" class=\"igx-grid__filtering-row-scroll-start\" *ngIf=\"showArrows\" (keydown)=\"onLeftArrowKeyDown($event)\" (click)=\"scrollChipsOnArrowPress('left')\">\n <igx-icon>navigate_before</igx-icon>\n</button>\n\n<div #container class=\"igx-grid__filtering-row-main\">\n <div>\n <igx-chips-area #chipsArea>\n <ng-container *ngFor=\"let item of expressionsList; index as i; let last = last;\" tabindex=\"0\">\n <igx-chip #chip id='chip'\n (pointerdown)=\"onChipPointerdown($event, chip)\"\n (click)=\"onChipClick($event, item)\"\n (keydown)=\"onChipKeyDown($event, item)\"\n (remove)=\"onChipRemoved($event, item)\"\n [selectable]=\"false\"\n [selected]=\"item.isSelected\"\n [displayDensity]=\"displayDensity\"\n [removable]=\"true\">\n <igx-icon\n igxPrefix\n family=\"imx-icons\"\n [name]=\"item.expression.condition.iconName\">\n </igx-icon>\n <span>{{filteringService.getChipLabel(item.expression)}}</span>\n </igx-chip>\n\n <span id='operand' *ngIf=\"!last\">\n <button igxButton (click)=\"toggleOperatorsDropDown($event, i)\" [igxDropDownItemNavigation]=\"operators\" [displayDensity]=\"displayDensity\">\n <igx-icon>expand_more</igx-icon>\n <span>{{filteringService.getOperatorAsString(item.afterOperator)}}</span>\n </button>\n <igx-drop-down [displayDensity]=\"column.grid.displayDensity\" #operators (selectionChanging)=\"onLogicOperatorChanged($event, item)\">\n <igx-drop-down-item [value]=\"0\" [selected]=\"item.afterOperator === 0\">{{filteringService.grid.resourceStrings.igx_grid_filter_operator_and}}</igx-drop-down-item>\n <igx-drop-down-item [value]=\"1\" [selected]=\"item.afterOperator === 1\">{{filteringService.grid.resourceStrings.igx_grid_filter_operator_or}}</igx-drop-down-item>\n </igx-drop-down>\n </span>\n </ng-container>\n </igx-chips-area>\n </div>\n</div>\n\n<button igxButton=\"icon\" class=\"igx-grid__filtering-row-scroll-end\" *ngIf=\"showArrows\" (click)=\"scrollChipsOnArrowPress('right')\">\n <igx-icon>navigate_next</igx-icon>\n</button>\n\n<div #buttonsContainer [ngClass]=\"isNarrowWidth ? 'igx-grid__filtering-row-editing-buttons--small' : 'igx-grid__filtering-row-editing-buttons'\">\n <button [displayDensity]=\"displayDensity\" [igxButton]=\"isNarrowWidth ? 'icon' : 'flat'\" igxRipple (click)=\"clearFiltering()\" [disabled]=\"disabled\" [tabindex]=\"disabled\">\n <igx-icon>refresh</igx-icon>\n <span>{{isNarrowWidth ? '' : filteringService.grid.resourceStrings.igx_grid_filter_row_reset}}</span>\n </button>\n <button #closeButton [displayDensity]=\"displayDensity\" [igxButton]=\"isNarrowWidth ? 'icon' : 'flat'\" igxRipple (click)=\"close()\">\n <igx-icon>close</igx-icon>\n <span>{{isNarrowWidth ? '' : filteringService.grid.resourceStrings.igx_grid_filter_row_close}}</span>\n </button>\n</div>\n" }]
|
|
58605
|
+
args: [{ changeDetection: ChangeDetectionStrategy.OnPush, selector: 'igx-grid-filtering-row', template: "<!-- Have to apply styles inline because of the overlay outlet ... -->\n<igx-drop-down #inputGroupConditions [displayDensity]=\"displayDensity\" [height]=\"'200px'\" (selectionChanging)=\"onConditionsChanged($event)\">\n <igx-drop-down-item *ngFor=\"let condition of conditions\"\n [value]=\"condition\"\n [selected]=\"isConditionSelected(condition)\">\n <div class=\"igx-grid__filtering-dropdown-items\">\n <igx-icon family=\"imx-icons\" [name]=\"getCondition(condition).iconName\"></igx-icon>\n <span class=\"igx-grid__filtering-dropdown-text\">{{ translateCondition(condition) }}</span>\n </div>\n </igx-drop-down-item>\n</igx-drop-down>\n\n<ng-template #defaultFilterUI>\n <igx-input-group #inputGroup type=\"box\" [displayDensity]=\"displayDensity\" (focusout)=\"onInputGroupFocusout()\">\n <igx-prefix #inputGroupPrefix\n (click)=\"inputGroupPrefixClick($event)\"\n (keydown)=\"onPrefixKeyDown($event)\"\n tabindex=\"0\"\n [igxDropDownItemNavigation]=\"inputGroupConditions\">\n <igx-icon family=\"imx-icons\" [name]=\"getIconName()\"></igx-icon>\n </igx-prefix>\n <input\n #input\n igxInput\n tabindex=\"0\"\n [placeholder]=\"placeholder\"\n autocomplete=\"off\"\n [value]=\"value\"\n (input)=\"onInput($event)\"\n [type]=\"type\"\n [readonly]=\"isUnaryCondition\"\n (click)=\"onInputClick()\"\n (compositionstart)=\"onCompositionStart()\"\n (compositionend)=\"onCompositionEnd()\"\n (keydown)=\"onInputKeyDown($event)\"\n (keyup)=\"onInputKeyUp()\"/>\n <igx-suffix *ngIf=\"value || value === 0\" >\n <igx-icon (keydown)=\"onCommitKeyDown($event)\" (click)=\"onCommitClick()\" tabindex=\"0\">done</igx-icon>\n <igx-icon (keydown)=\"onClearKeyDown($event)\" (click)=\"onClearClick()\" tabindex=\"0\">clear</igx-icon>\n </igx-suffix>\n </igx-input-group>\n</ng-template>\n\n<ng-template #defaultDateUI>\n <igx-date-picker #picker\n [(value)]=\"value\"\n [readOnly]=\"true\"\n [outlet]=\"filteringService.grid.outlet\"\n [locale]=\"filteringService.grid.locale\"\n (click)=\"expression.condition.isUnary ? null : picker.open()\"\n type=\"box\"\n [displayFormat]=\"column.pipeArgs.format\"\n [formatter]=\"column.formatter\"\n [placeholder]=\"placeholder\"\n [weekStart]=\"column.pipeArgs.weekStart\"\n [displayDensity]=\"displayDensity\"\n (keydown)=\"onInputKeyDown($event)\"\n (focusout)=\"onInputGroupFocusout()\"\n (closed)=\"focusEditElement()\">\n <igx-prefix #inputGroupPrefix\n tabindex=\"0\"\n (click)=\"inputGroupPrefixClick($event)\"\n (keydown)=\"onPrefixKeyDown($event)\"\n [igxDropDownItemNavigation]=\"inputGroupConditions\">\n <igx-icon family=\"imx-icons\" [name]=\"expression.condition.iconName\"></igx-icon>\n </igx-prefix>\n <igx-suffix *ngIf=\"value\">\n <igx-icon tabindex=\"0\" (keydown)=\"onCommitKeyDown($event)\" (click)=\"onCommitClick($event)\">done</igx-icon>\n <igx-icon tabindex=\"0\" (keydown)=\"onClearKeyDown($event)\" (click)=\"clearInput($event)\">clear</igx-icon>\n </igx-suffix>\n <!-- disable default icons -->\n <igx-picker-toggle></igx-picker-toggle>\n <igx-picker-clear></igx-picker-clear>\n </igx-date-picker>\n</ng-template>\n\n<ng-template #defaultTimeUI>\n <igx-time-picker #picker\n [(value)]=\"value\"\n [inputFormat]=\"column.defaultTimeFormat\"\n [locale]=\"filteringService.grid.locale\"\n [formatter]=\"column.formatter\"\n [outlet]=\"filteringService.grid.outlet\"\n [displayDensity]=\"displayDensity\"\n type=\"box\"\n [readOnly]=\"true\"\n [placeholder]=\"placeholder\"\n (closed)=\"focusEditElement()\"\n (focusout)=\"onInputGroupFocusout()\"\n (keydown)=\"onInputKeyDown($event)\"\n (click)=\"expression.condition.isUnary ? null : picker.open()\">\n <igx-prefix #inputGroupPrefix\n tabindex=\"0\"\n (click)=\"inputGroupPrefixClick($event)\"\n (keydown)=\"onPrefixKeyDown($event)\"\n [igxDropDownItemNavigation]=\"inputGroupConditions\">\n <igx-icon family=\"imx-icons\" [name]=\"expression.condition.iconName\"></igx-icon>\n </igx-prefix>\n <igx-suffix *ngIf=\"value\">\n <igx-icon tabindex=\"0\" (keydown)=\"onCommitKeyDown($event)\" (click)=\"onCommitClick($event)\">done</igx-icon>\n <igx-icon tabindex=\"0\" (keydown)=\"onClearKeyDown($event)\" (click)=\"clearInput($event)\">clear</igx-icon>\n </igx-suffix>\n <!-- disable default icons -->\n <igx-picker-toggle></igx-picker-toggle>\n <igx-picker-clear></igx-picker-clear>\n </igx-time-picker>\n</ng-template>\n\n<ng-template #defaultDateTimeUI>\n <igx-input-group #inputGroup type=\"box\" [displayDensity]=\"displayDensity\" (focusout)=\"onInputGroupFocusout()\">\n <igx-prefix #inputGroupPrefix\n (click)=\"inputGroupPrefixClick($event)\"\n (keydown)=\"onPrefixKeyDown($event)\"\n tabindex=\"0\"\n [igxDropDownItemNavigation]=\"inputGroupConditions\">\n <igx-icon family=\"imx-icons\" [name]=\"getIconName()\"></igx-icon>\n </igx-prefix>\n <input\n #input\n igxInput\n tabindex=\"0\"\n [placeholder]=\"placeholder\"\n [igxDateTimeEditor]=\"column.defaultDateTimeFormat\"\n [value]=\"value\"\n (valueChange)=\"onInput($event)\"\n [readonly]=\"isUnaryCondition\"\n (click)=\"onInputClick()\"\n (keydown)=\"onInputKeyDown($event)\"\n (keyup)=\"onInputKeyUp()\"/>\n <igx-suffix *ngIf=\"value || value === 0\" >\n <igx-icon (keydown)=\"onCommitKeyDown($event)\" (click)=\"onCommitClick()\" tabindex=\"0\">done</igx-icon>\n <igx-icon (keydown)=\"onClearKeyDown($event)\" (click)=\"onClearClick()\" tabindex=\"0\">clear</igx-icon>\n </igx-suffix>\n </igx-input-group>\n</ng-template>\n\n<ng-container *ngTemplateOutlet=\"template; context: { $implicit: this }\"></ng-container>\n\n<button igxButton=\"icon\" type=\"button\" class=\"igx-grid__filtering-row-scroll-start\" *ngIf=\"showArrows\" (keydown)=\"onLeftArrowKeyDown($event)\" (click)=\"scrollChipsOnArrowPress('left')\">\n <igx-icon>navigate_before</igx-icon>\n</button>\n\n<div #container class=\"igx-grid__filtering-row-main\">\n <div>\n <igx-chips-area #chipsArea>\n <ng-container *ngFor=\"let item of expressionsList; index as i; let last = last;\" tabindex=\"0\">\n <igx-chip #chip id='chip'\n (pointerdown)=\"onChipPointerdown($event, chip)\"\n (click)=\"onChipClick($event, item)\"\n (keydown)=\"onChipKeyDown($event, item)\"\n (remove)=\"onChipRemoved($event, item)\"\n [selectable]=\"false\"\n [selected]=\"item.isSelected\"\n [displayDensity]=\"displayDensity\"\n [removable]=\"true\">\n <igx-icon\n igxPrefix\n family=\"imx-icons\"\n [name]=\"item.expression.condition.iconName\">\n </igx-icon>\n <span>{{filteringService.getChipLabel(item.expression)}}</span>\n </igx-chip>\n\n <span id='operand' *ngIf=\"!last\">\n <button igxButton type=\"button\" (click)=\"toggleOperatorsDropDown($event, i)\" [igxDropDownItemNavigation]=\"operators\" [displayDensity]=\"displayDensity\">\n <igx-icon>expand_more</igx-icon>\n <span>{{filteringService.getOperatorAsString(item.afterOperator)}}</span>\n </button>\n <igx-drop-down [displayDensity]=\"column.grid.displayDensity\" #operators (selectionChanging)=\"onLogicOperatorChanged($event, item)\">\n <igx-drop-down-item [value]=\"0\" [selected]=\"item.afterOperator === 0\">{{filteringService.grid.resourceStrings.igx_grid_filter_operator_and}}</igx-drop-down-item>\n <igx-drop-down-item [value]=\"1\" [selected]=\"item.afterOperator === 1\">{{filteringService.grid.resourceStrings.igx_grid_filter_operator_or}}</igx-drop-down-item>\n </igx-drop-down>\n </span>\n </ng-container>\n </igx-chips-area>\n </div>\n</div>\n\n<button igxButton=\"icon\" type=\"button\" class=\"igx-grid__filtering-row-scroll-end\" *ngIf=\"showArrows\" (click)=\"scrollChipsOnArrowPress('right')\">\n <igx-icon>navigate_next</igx-icon>\n</button>\n\n<div #buttonsContainer [ngClass]=\"isNarrowWidth ? 'igx-grid__filtering-row-editing-buttons--small' : 'igx-grid__filtering-row-editing-buttons'\">\n <button [displayDensity]=\"displayDensity\" [igxButton]=\"isNarrowWidth ? 'icon' : 'flat'\" type=\"button\" igxRipple (click)=\"clearFiltering()\" [disabled]=\"disabled\" [tabindex]=\"disabled\">\n <igx-icon>refresh</igx-icon>\n <span>{{isNarrowWidth ? '' : filteringService.grid.resourceStrings.igx_grid_filter_row_reset}}</span>\n </button>\n <button #closeButton [displayDensity]=\"displayDensity\" [igxButton]=\"isNarrowWidth ? 'icon' : 'flat'\" type=\"button\" igxRipple (click)=\"close()\">\n <igx-icon>close</igx-icon>\n <span>{{isNarrowWidth ? '' : filteringService.grid.resourceStrings.igx_grid_filter_row_close}}</span>\n </button>\n</div>\n" }]
|
|
58606
58606
|
}], ctorParameters: function () { return [{ type: IgxFilteringService }, { type: i0.ElementRef }, { type: i0.ChangeDetectorRef }, { type: PlatformUtil }]; }, propDecorators: { column: [{
|
|
58607
58607
|
type: Input
|
|
58608
58608
|
}], value: [{
|