Ag-Grid React headerComponentFramework small click target on mobile?

Question

I'm working on a grid system with Ag-Grid, and would like to put an SVG icon (and other things) in the header of a column. Their example uses cellRendererFramework to render custom content in the column header. My issue, however, is that when I try to do so, the area that triggers the onClick event for my component is actually outside of my component for devices that have a touch screen. Everything works fine if I use a mouse, but I need it to work on mobile as well.

I will note that the clickable areas extend to the edge of the blue element (my custom header component), but I highlighted slightly outside to show the edges.

Here's my code for the columnDefs:

const gridOptions = {
    columnDefs: [
      {
        headerName: 'Type',
        field: 'metadata.type',
        headerComponentFramework: (props) => {
          return (
            <div
              onClick={() => {
                console.log('column header clicked'); // Only logged when click is within the red areas
                props.setSort(sortDirection, false);
              }}
            >
                Header Title
            </div>
          );
        },
        width: 250,
        resizable: true,
        sortable: true,
      },
      // Other column defs
    ]
}

Some other things I'll note: - When it does work, the following error is logged to the console. I haven't found anything helpful while researching it, though.

[Intervention] Ignored attempt to cancel a touchstart event with cancelable=false, for example because scrolling is in progress and cannot be interrupted.

• In the example, I'm using an inline functional component, but I've also tried it with a functional component declared as a constant, and also a class component. The results were the same
• I have other columns using the cellRendererFramework, and they are working fine.
• When I resize the column, the component area grows, but the click targets stay the same.
• I'm using the material theme, but I've tried it with Balham, and the result was no different.
• Probably unrelated, but I'm using Typescript, and there doesn't seem to be any types for the props of the headerComponentFramework component.