How to add left-side dropdown to choose the operator

I try to add left-side dropdown in filter.DateRange, but i don't know how to do it

I would like to user have possibilty to choose range or single date with '<' , '>' etc in one column.

Solution

The left-side dropdown you're talking about is only available for Compound Filters and the Date Range is not a Compound Filter. There is no need and no use case for this Filter to be a Compound Filter, I will not add such feature. You can however set the Operator to be inclusive (>= date1 && <= date2) or exclusive (> date1 && < date2) in your column definition. The Range Filters versus Compound Filters are very different, you cannot add all operators of a Compound Filter into a Range Filter (<, <=, <>, >, >=) that just doesn't make any sense, what make sense on a range is to know if it's inclusive/exclusive and that is available just not dynamically.

this.columnDefinitions = [
  {
    id: 'finish', name: 'Finish', field: 'finish', 
    formatter: Formatters.dateIso, 
    type: FieldType.date,
    filter: {
      model: Filters.dateRange,
      operator: OperatorType.rangeInclusive, // defaults to exclusive
    }
  },
  // ...
];

If you really wish to somehow build a Compound Date Range Filter, your only option left would be to create your own Custom Filter, for that follow the instruction on the Wiki - Custom Filter, you could possible Extend the built-in Date Filter.