UNPKG

igniteui-angular

Version:

Ignite UI for Angular is a dependency-free Angular toolkit for building modern web apps

306 lines (305 loc) 10 kB
import { DoCheck, EventEmitter, IterableDiffer, IterableDiffers, PipeTransform, QueryList } from '@angular/core'; import { ColumnDisplayOrder } from '../common/enums'; import { ColumnType, GridType } from '../common/grid.interface'; import { IColumnToggledEventArgs } from '../common/events'; import { IgxCheckboxComponent } from '../../checkbox/checkbox.component'; import { IgxColumnActionsBaseDirective } from './column-actions-base.directive'; import * as i0 from "@angular/core"; /** * Providing reference to `IgxColumnActionsComponent`: * ```typescript * @ViewChild('columnActions', { read: IgxColumnActionsComponent }) * public columnActions: IgxColumnActionsComponent; */ export declare class IgxColumnActionsComponent implements DoCheck { private differs; /** * Gets/Sets the grid to provide column actions for. * * @example * ```typescript * let grid = this.columnActions.grid; * ``` */ grid: GridType; /** * Gets/sets the indentation of columns in the column list based on their hierarchy level. * * @example * ``` * <igx-column-actions [indentation]="15"></igx-column-actions> * ``` */ indentation: number; /** * Sets/Gets the css class selector. * By default the value of the `class` attribute is `"igx-column-actions"`. * ```typescript * let cssCLass = this.columnHidingUI.cssClass; * ``` * ```typescript * this.columnHidingUI.cssClass = 'column-chooser'; * ``` */ cssClass: string; /** * Gets/sets the max height of the columns area. * * @remarks * The default max height is 100%. * @example * ```html * <igx-column-actions [columnsAreaMaxHeight]="200px"></igx-column-actions> * ``` */ columnsAreaMaxHeight: string; /** * Shows/hides the columns filtering input from the UI. * * @example * ```html * <igx-column-actions [hideFilter]="true"></igx-column-actions> * ``` */ hideFilter: boolean; /** * Gets the checkbox components representing column items currently present in the dropdown * * @example * ```typescript * let columnItems = this.columnActions.columnItems; * ``` */ columnItems: QueryList<IgxCheckboxComponent>; /** * Gets/sets the title of the column actions component. * * @example * ```html * <igx-column-actions [title]="'Pin Columns'"></igx-column-actions> * ``` */ title: string; /** * An event that is emitted after a column's checked state is changed. * Provides references to the `column` and the `checked` properties as event arguments. * ```html * <igx-column-actions (columnToggled)="columnToggled($event)"></igx-column-actions> * ``` */ columnToggled: EventEmitter<IColumnToggledEventArgs>; /** * @hidden @internal */ actionableColumns: ColumnType[]; /** * @hidden @internal */ filteredColumns: ColumnType[]; /** * @hidden @internal */ pipeTrigger: number; /** * @hidden @internal */ actionsDirective: IgxColumnActionsBaseDirective; protected _differ: IterableDiffer<any> | null; /** * @hidden @internal */ private _filterColumnsPrompt; /** * @hidden @internal */ private _filterCriteria; /** * @hidden @internal */ private _columnDisplayOrder; /** * @hidden @internal */ private _uncheckAllText; /** * @hidden @internal */ private _checkAllText; /** * @hidden @internal */ private _id; constructor(differs: IterableDiffers); /** * Gets the prompt that is displayed in the filter input. * * @example * ```typescript * let filterColumnsPrompt = this.columnActions.filterColumnsPrompt; * ``` */ get filterColumnsPrompt(): string; /** * Sets the prompt that is displayed in the filter input. * * @example * ```html * <igx-column-actions [filterColumnsPrompt]="'Type here to search'"></igx-column-actions> * ``` */ set filterColumnsPrompt(value: string); /** * Gets the value which filters the columns list. * * @example * ```typescript * let filterCriteria = this.columnActions.filterCriteria; * ``` */ get filterCriteria(): string; /** * Sets the value which filters the columns list. * * @example * ```html * <igx-column-actions [filterCriteria]="'ID'"></igx-column-actions> * ``` */ set filterCriteria(value: string); /** * Gets the display order of the columns. * * @example * ```typescript * let columnDisplayOrder = this.columnActions.columnDisplayOrder; * ``` */ get columnDisplayOrder(): ColumnDisplayOrder; /** * Sets the display order of the columns. * * @example * ```typescript * this.columnActions.columnDisplayOrder = ColumnDisplayOrder.Alphabetical; * ``` */ set columnDisplayOrder(value: ColumnDisplayOrder); /** * Gets the text of the button that unchecks all columns. * * @remarks * If unset it is obtained from the IgxColumnActionsBased derived directive applied. * @example * ```typescript * let uncheckAllText = this.columnActions.uncheckAllText; * ``` */ get uncheckAllText(): string; /** * Sets the text of the button that unchecks all columns. * * @example * ```html * <igx-column-actions [uncheckAllText]="'Show All'"></igx-column-actions> * ``` */ set uncheckAllText(value: string); /** * Gets the text of the button that checks all columns. * * @remarks * If unset it is obtained from the IgxColumnActionsBased derived directive applied. * @example * ```typescript * let uncheckAllText = this.columnActions.uncheckAllText; * ``` */ get checkAllText(): string; /** * Sets the text of the button that checks all columns. * * @remarks * If unset it is obtained from the IgxColumnActionsBased derived directive applied. * @example * ```html * <igx-column-actions [checkAllText]="'Hide All'"></igx-column-actions> * ``` */ set checkAllText(value: string); /** * @hidden @internal */ get checkAllDisabled(): boolean; /** * @hidden @internal */ get uncheckAllDisabled(): boolean; /** * Gets/Sets the value of the `id` attribute. * * @remarks * If not provided it will be automatically generated. * @example * ```html * <igx-column-actions [id]="'igx-actions-1'"></igx-column-actions> * ``` */ get id(): string; set id(value: string); /** * @hidden @internal */ get titleID(): string; /** * @hidden @internal */ trackChanges: (index: any, col: any) => string; /** * @hidden @internal */ ngDoCheck(): void; /** * Unchecks all columns and performs the appropriate action. * * @example * ```typescript * this.columnActions.uncheckAllColumns(); * ``` */ uncheckAllColumns(): void; /** * Checks all columns and performs the appropriate action. * * @example * ```typescript * this.columnActions.checkAllColumns(); * ``` */ checkAllColumns(): void; /** * @hidden @internal */ toggleColumn(column: ColumnType): void; static ɵfac: i0.ɵɵFactoryDeclaration<IgxColumnActionsComponent, never>; static ɵcmp: i0.ɵɵComponentDeclaration<IgxColumnActionsComponent, "igx-column-actions", never, { "grid": { "alias": "grid"; "required": false; }; "indentation": { "alias": "indentation"; "required": false; }; "columnsAreaMaxHeight": { "alias": "columnsAreaMaxHeight"; "required": false; }; "hideFilter": { "alias": "hideFilter"; "required": false; }; "title": { "alias": "title"; "required": false; }; "filterColumnsPrompt": { "alias": "filterColumnsPrompt"; "required": false; }; "filterCriteria": { "alias": "filterCriteria"; "required": false; }; "columnDisplayOrder": { "alias": "columnDisplayOrder"; "required": false; }; "uncheckAllText": { "alias": "uncheckAllText"; "required": false; }; "checkAllText": { "alias": "checkAllText"; "required": false; }; "id": { "alias": "id"; "required": false; }; }, { "columnToggled": "columnToggled"; }, never, never, true, never>; static ngAcceptInputType_hideFilter: unknown; } export declare class IgxColumnActionEnabledPipe implements PipeTransform { protected columnActions: IgxColumnActionsComponent; constructor(columnActions: IgxColumnActionsComponent); transform(collection: ColumnType[], actionFilter: (value: ColumnType, index: number, array: ColumnType[]) => boolean, _pipeTrigger: number): ColumnType[]; static ɵfac: i0.ɵɵFactoryDeclaration<IgxColumnActionEnabledPipe, never>; static ɵpipe: i0.ɵɵPipeDeclaration<IgxColumnActionEnabledPipe, "columnActionEnabled", true>; } export declare class IgxFilterActionColumnsPipe implements PipeTransform { protected columnActions: IgxColumnActionsComponent; constructor(columnActions: IgxColumnActionsComponent); transform(collection: ColumnType[], filterCriteria: string, _pipeTrigger: number): ColumnType[]; static ɵfac: i0.ɵɵFactoryDeclaration<IgxFilterActionColumnsPipe, never>; static ɵpipe: i0.ɵɵPipeDeclaration<IgxFilterActionColumnsPipe, "filterActionColumns", true>; } export declare class IgxSortActionColumnsPipe implements PipeTransform { transform(collection: ColumnType[], displayOrder: ColumnDisplayOrder, _pipeTrigger: number): ColumnType[]; static ɵfac: i0.ɵɵFactoryDeclaration<IgxSortActionColumnsPipe, never>; static ɵpipe: i0.ɵɵPipeDeclaration<IgxSortActionColumnsPipe, "sortActionColumns", true>; }