@progress/kendo-react-grid/dist/es/columnMenu/GridColumnMenuFilter.d.ts

KendoReact Grid package

import * as React from 'react';
import { CompositeFilterDescriptor } from '@progress/kendo-data-query';
import { GridColumnMenuFilterUIProps } from '../interfaces/GridColumnMenuFilterUIProps';
import { GridColumnMenuFilterBaseProps } from '../interfaces/GridColumnMenuFilterBaseProps';
import { ComponentType } from 'react';
/**
 * @hidden
 */
export declare const rootFilterOrDefault: (rootFilter: CompositeFilterDescriptor) => CompositeFilterDescriptor;
/**
 * @hidden
 */
export declare const filterGroupByField: (field: string, filter: CompositeFilterDescriptor) => CompositeFilterDescriptor;
/**
 * The props of the GridColumnMenuFilter component.
 */
export interface GridColumnMenuFilterProps extends GridColumnMenuFilterBaseProps {
    /**
     * Controls the expand state of the filter component.
     */
    expanded?: boolean;
    /**
     * Triggers on each subsequent expand state of the filter component.
     */
    onExpandChange?: (nextExpandState: boolean) => void;
    /**
     * If set to `false`, the second filter operator and the input will be hidden.
     */
    hideSecondFilter?: boolean;
    /**
     * Specifies a React element that will be cloned and rendered inside the UI of the column-menu filter component
     * ([see example]({% slug column_menu_grid %}#toc-customizing-the-filter-component)).
     */
    filterUI?: ComponentType<GridColumnMenuFilterUIProps>;
}
/**
 * @hidden
 */
export interface GridColumnMenuFilterStateProps {
    expanded: boolean;
    filterGroup: CompositeFilterDescriptor;
}
/**
 * @example
 * ```jsx
 * class TextColumnMenu extends React.Component {
 *     render() {
 *         return (
 *         <div>
 *             <GridColumnMenuSort {...this.props} />
 *             <GridColumnMenuFilter {...this.props} />
 *         </div>);
 *     }
 * }
 *
 * class App extends React.PureComponent {
 *     constructor(props) {
 *         super(props);
 *
 *         this.state = this.createAppState({
 *             take: 10,
 *             skip: 0
 *         });
 *     }
 *
 *     createAppState(dataState) {
 *         return {
 *             result: process(products.slice(0), dataState),
 *             dataState: dataState
 *         };
 *     }
 *
 *     dataStateChange = (event) => {
 *         this.setState(this.createAppState(event.data));
 *     }
 *
 *     render() {
 *         return (
 *             <div>
 *                 <Grid
 *                     data={this.state.result}
 *                     {...this.state.dataState}
 *                     onDataStateChange={this.dataStateChange}
 *                     sortable={true}
 *                     pageable={true}
 *                 >
 *                     <Column field="ProductID" title="Product ID" />
 *                     <Column field="ProductName" columnMenu={TextColumnMenu} />
 *                 </Grid>
 *                 <br />
 *             </div>
 *         );
 *     }
 * }
 *
 * ReactDOM.render(<App />, document.querySelector('my-app'));
 * ```
 */
export declare class GridColumnMenuFilter extends React.Component<GridColumnMenuFilterProps, GridColumnMenuFilterStateProps> {
    /**
     * Can be used to check if filtering is applied to a specific field ([see example]({% slug column_menu_grid %}#toc-styling-the-column-menu-icon)). Useful for creating active filter indicators.
     */
    static active: (field: string, filter?: CompositeFilterDescriptor) => boolean;
    constructor(props: GridColumnMenuFilterProps);
    /**
     * @hidden
     */
    removeGroup(group: CompositeFilterDescriptor, rootFilter: CompositeFilterDescriptor): CompositeFilterDescriptor;
    /**
     * @hidden
     */
    insertGroup(group: CompositeFilterDescriptor, rootFilter: CompositeFilterDescriptor): CompositeFilterDescriptor;
    /**
     * @hidden
     */
    isControlled: () => boolean;
    /**
     * @hidden
     */
    onFilterExpand: () => void;
    /**
     * @hidden
     */
    firstFilterChange: (e: any) => void;
    /**
     * @hidden
     */
    secondFilterChange: (e: any) => void;
    /**
     * @hidden
     */
    filterChange(filterIndex: number, e: {
        value: number;
        operator: string;
    }): void;
    /**
     * @hidden
     */
    logicChange: (e: any) => void;
    /**
     * @hidden
     */
    clear: (e: React.SyntheticEvent<any>) => void;
    /**
     * @hidden
     */
    currentFilterGroup: () => CompositeFilterDescriptor;
    /**
     * @hidden
     */
    submit: (e: React.SyntheticEvent<any>) => void;
    /**
     * @hidden
     */
    render(): JSX.Element;
}