React Material-Table column widths do not auto-adjust if column filter is applied

Question

In React JS I am using Material-Table. The column widths do not auto-adjust to the width of the data if filtering is set to true on the column. It works fine if filtering is set to false (see pic). I have also tried all types of custom column widths, minWidths, maxWidths using numbers, pixels, percentages, etc. and having filtering options set at all columns as opposed to overall at the Material-table props.

Sample code:

const columns = [
       
        {
            field: 'EventId',
            title: 'Event Id',            
            editable: true,
        },
       {
            field: 'Quantity',
            title: 'Qty',            
            editable: true,
            filtering: false,
        },


<MaterialTable
addRowPosition: 'first',
 search: true,
paging: true,
sorting: true,
columnsButton: true,                            
tableLayout: "Auto", // also tried using 'Fixed;
actionsColumnIndex: -1,
filtering: true, // also tried set to false and set at column level
etc etc...