@progress/kendo-angular-grid
Version:
Kendo UI Grid for Angular - high performance data grid with paging, filtering, virtualization, CRUD, and more.
115 lines (114 loc) • 6.1 kB
JavaScript
/**-----------------------------------------------------------------------------------------
* Copyright © 2025 Progress Software Corporation. All rights reserved.
* Licensed under commercial license. See LICENSE.md in the project root for more information
*-------------------------------------------------------------------------------------------*/
// eslint-disable no-access-missing-member
import { Component, Input } from '@angular/core';
import { ColumnComponent } from '../../columns/column.component';
import { FilterService } from '../filter.service';
import { BaseFilterCellComponent, localizeOperators } from '../base-filter-cell.component';
import { SizingOptionsService } from '../../layout/sizing-options.service';
import { ContextService } from '../../common/provider.service';
import { FilterInputDirective } from '../filter-input.directive';
import { FilterCellWrapperComponent } from './filter-cell-wrapper.component';
import { AutoCompleteComponent } from '@progress/kendo-angular-dropdowns';
import * as i0 from "@angular/core";
import * as i1 from "../filter.service";
import * as i2 from "../../columns/column.component";
import * as i3 from "../../common/provider.service";
import * as i4 from "../../layout/sizing-options.service";
const stringOperators = localizeOperators({
"filterContainsOperator": "contains",
"filterNotContainsOperator": "doesnotcontain",
"filterEqOperator": "eq",
"filterNotEqOperator": "neq",
"filterStartsWithOperator": "startswith",
"filterEndsWithOperator": "endswith",
"filterIsNullOperator": "isnull",
"filterIsNotNullOperator": "isnotnull",
"filterIsEmptyOperator": "isempty",
"filterIsNotEmptyOperator": "isnotempty"
});
/**
* @hidden
*/
export class AutoCompleteFilterCellComponent extends BaseFilterCellComponent {
ctx;
showOperators = true;
column;
data;
set valueField(value) {
this._valueField = value;
}
get valueField() {
return this._valueField ? this._valueField : this.column.field;
}
get currentFilter() {
return this.filterByField(this.column.field);
}
get currentOperator() {
return this.currentFilter ? this.currentFilter.operator : "contains";
}
size = 'medium';
_valueField;
subs;
constructor(filterService, column, ctx, sizingOptionsService) {
super(filterService);
this.ctx = ctx;
this.defaultOperators = stringOperators(this.ctx.localization);
this.column = column;
this.subs = sizingOptionsService.changes.subscribe(size => this.size = size);
}
ngOnDestroy() {
if (this.subs) {
this.subs.unsubscribe();
}
}
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: AutoCompleteFilterCellComponent, deps: [{ token: i1.FilterService }, { token: i2.ColumnComponent }, { token: i3.ContextService }, { token: i4.SizingOptionsService }], target: i0.ɵɵFactoryTarget.Component });
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: AutoCompleteFilterCellComponent, isStandalone: true, selector: "kendo-grid-autocomplete-filter-cell", inputs: { showOperators: "showOperators", column: "column", data: "data", valueField: "valueField" }, usesInheritance: true, ngImport: i0, template: `
<kendo-grid-filter-wrapper-cell
[column]="column"
[filter]="filter"
[operators]="operators"
[showOperators]="showOperators">
<kendo-autocomplete
kendoFilterInput
[data]="data"
[size]="size"
[valueField]="valueField"
[value]="currentFilter?.value">
</kendo-autocomplete>
</kendo-grid-filter-wrapper-cell>
`, isInline: true, dependencies: [{ kind: "component", type: FilterCellWrapperComponent, selector: "kendo-grid-filter-wrapper-cell", inputs: ["showOperators"] }, { kind: "component", type: AutoCompleteComponent, selector: "kendo-autocomplete", inputs: ["highlightFirst", "showStickyHeader", "focusableId", "data", "value", "valueField", "placeholder", "adaptiveMode", "title", "subtitle", "popupSettings", "listHeight", "loading", "clearButton", "suggest", "disabled", "itemDisabled", "readonly", "tabindex", "tabIndex", "filterable", "virtual", "size", "rounded", "fillMode", "inputAttributes"], outputs: ["valueChange", "filterChange", "open", "opened", "close", "closed", "focus", "blur", "inputFocus", "inputBlur"], exportAs: ["kendoAutoComplete"] }, { kind: "directive", type: FilterInputDirective, selector: "[kendoFilterInput]", inputs: ["filterDelay", "columnLabel", "value"] }] });
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: AutoCompleteFilterCellComponent, decorators: [{
type: Component,
args: [{
selector: 'kendo-grid-autocomplete-filter-cell',
template: `
<kendo-grid-filter-wrapper-cell
[column]="column"
[filter]="filter"
[operators]="operators"
[showOperators]="showOperators">
<kendo-autocomplete
kendoFilterInput
[data]="data"
[size]="size"
[valueField]="valueField"
[value]="currentFilter?.value">
</kendo-autocomplete>
</kendo-grid-filter-wrapper-cell>
`,
standalone: true,
imports: [FilterCellWrapperComponent, AutoCompleteComponent, FilterInputDirective]
}]
}], ctorParameters: function () { return [{ type: i1.FilterService }, { type: i2.ColumnComponent }, { type: i3.ContextService }, { type: i4.SizingOptionsService }]; }, propDecorators: { showOperators: [{
type: Input
}], column: [{
type: Input
}], data: [{
type: Input
}], valueField: [{
type: Input
}] } });