Hеllo,

This can already be done without a custom cell using the new DateInputs Props Context that allows customizing all internal components:

https://www.telerik.com/kendo-react-ui-develop/components/dateinputs/props-context/

With this we can set a placeholder to all DatePickers inside the TreeList.

Regards,
Stefan
Progress Telerik

Hello, Gaurav,

I have transferred this to an official public feature request.

We will monitor the community interest in it, and plan it accordingly.

I already added your vote for convenience.

Regards,
Stefan
Progress Telerik

Hello, Gaurav,

This will require a custom cell as the logic of the TreeListTextFilter is encapsulated. We understand that it may seem a lot to make a custom cell only for the placeholder, but React is based on a reusable component,  you can use that custom cell in multiple places. Also, in the future, you may need to customize another part of the cell, and having a custom cell already made, will make it easier as it will need to be added only to the custom reusable cell instead of modifying all instances of the TreeListTextFilter.

I can also share the source code of the TreeListTextFilter as this may prove helpful in making the custom cell:

/**
 * The props of the TextFilter component.
 */
export interface TextFilterProps {
    /**
     * The FilterDescriptor object which will be edited.
     */
    filter: FilterDescriptor;

    /**
     * The FilterChange event, triggered while editing the FilterOperator.
     */
    onFilterChange: (event: { nextFilter: FilterOperator }) => void;
}

/**
 * The TextFilter component used for editing text value of FilterDescriptor object.
 */
export class TextFilter extends React.Component<TextFilterProps> {
    /**
     * @hidden
     */
    static propTypes = {
        filter: PropTypes.object.isRequired,
        onFilterChange: PropTypes.func.isRequired
    };

    /**
     * @hidden
     */
    render() {
        return (
            <Input
                value={this.props.filter.value || ''}
                onChange={this.onChange}
            />
        );
    }

    private onChange = (event) => {
        this.props.onFilterChange.call(undefined, {
            nextFilter: { ...this.props.filter, value: event.value }
        });
    }
}

Regards,
Stefan
Progress Telerik

Hello, Gaurav,

This has to be added to the custom component used for the filtering.

I made an example showcasing a possible approach:

https://stackblitz.com/edit/react-tgpvnu?file=app%2FdropDownFilter.jsx

Still, please have in mind that this may vary depending on the real implementation of the custom filter cell.

Regards,
Stefan
Progress Telerik