🐛 Bug: DateFilter autocompletes on first character of the input

[timargeli]

Version: @inovua/reactdatagrid-community@5.10.2

The DateFilter autocompletes the input (when entered manually) on the first character to become 000[entered character]-01-01 instead of waiting for more characters. You can reproduce this on the "https://reactdatagrid.io/docs/filtering" site on the Date filters demo. It works fine (it doesn't autocomplete) when used with inrange, for example the demo with the Range filters.

The demo code copied from the site:

import React, { useState } from 'react'

import ReactDataGrid from '@inovua/reactdatagrid-enterprise' import '@inovua/reactdatagrid-enterprise/index.css'

import NumberFilter from '@inovua/reactdatagrid-community/NumberFilter' import DateFilter from '@inovua/reactdatagrid-community/DateFilter' import CheckBox from '@inovua/reactdatagrid-community/packages/CheckBox'

import flags from './flags' import contacts from './contacts'

const gridStyle = { minHeight: 600 }

const columns = [ { name: 'id', header: 'Id', defaultVisible: false, defaultWidth: 50, type: 'number' }, { name: 'firstName', defaultFlex: 1, maxWidth: 200, header: 'First name' }, { name: 'address', defaultFlex: 1, header: 'Address' }, { name: 'createdOn', header: 'User created date', defaultFlex: 1, // need to specify dateFormat dateFormat: 'YYYY-MM-DD', filterEditor: DateFilter, filterEditorProps: (props, { index }) => { // for range and notinrange operators, the index is 1 for the after field return { dateFormat: 'MM-DD-YYYY', placeholder: index == 1 ? 'Created date is before...': 'Created date is after...' } }, render: ({ value, cellProps: { dateFormat } }) => moment(value).format(dateFormat), } ];

const defaultFilterValue = [ { name: 'address', operator: 'startsWith', type: 'string', value: '' }, { name: 'firstName', operator: 'startsWith', type: 'string', value: '' }, { name: 'createdOn', operator: 'after', type: 'date', value: '' } ];

const App = () => { const [enableFiltering, setEnableFiltering] = useState(true);

return (

Filterable DataGrid with date filter

setEnableFiltering(value)}>Enable filtering

  <ReactDataGrid
    idProperty="id"
    style={gridStyle}
    enableFiltering={enableFiltering}
    defaultFilterValue={defaultFilterValue}
    columns={columns}
    dataSource={contacts}
  />
</div>

); }

export default () =>