RAC Table: column header text with tabindex should have role="button"

[majornista]

When a column is resizable and/or sortable, the documentation suggests to add a tabIndex={-1} to the span containing the column header text, so that it can be focused independently from the resize handle button. See https://react-spectrum.adobe.com/react-aria/Table.html#column-resizing.

The example below illustrates how each of the column width props affects their respective column's resize behavior. Note that the column names are wrapped in a <span tabIndex={-1}> so that they can be focused with the keyboard in addition to the <ColumnResizer>.

react-spectrum/packages/react-aria-components/docs/Table.mdx

Line 946 in a7b1a28

<span tabIndex={-1} className="column-name">File Name</span>

When we add a tabindex, we should also add the interactive role, role="button".