implement full width resize handler

Describe the bug

The header.getResizeHandler() works well if the table is not full-width. But when working with full-width tables, it does not handle the ColumnSizingState properly.

Your minimal, reproducible example

none

Steps to reproduce

My idea is that we need full-width Resize Handler apart from normal Resize Handler when the table is full-width.

The normal Resize Handler updates the current column size in the ColumnSizingState, but full-width Resize Handler will update the size of both the current column and the next resizable column in the ColumnSizingState.

The logic is simple -->

• if there is ANY resizable column after the current column (not need be adjacent, meaning one of the next columns), update the current column size like normal resize handler, and also, update the size of the FIRST resizable column as many as amount of the width change in negative to keep the table width the same.
• if there is NO resizable column after the current column, do not update the current column size.
• while updating the ColumnSizingState, respect the min width of the current column and the the FIRST resizable column in order to keep the column sizes in stable.

Expected behavior

I am volunteer to implement the full-width resize handler.

I want to get the package authors' idea and also others' about the way of implementation.

(assume we have a state variable for full width called isFullWidth)

Option-1

to create a separate resize handler --> header.getFullWidthResizeHandler()

the usage could be in the table:

<div
  {...{
    onMouseDown: isFullWidth ? header.getFullWidthResizeHandler() : header.getResizeHandler(),
    onTouchStart: isFullWidth ? header.getFullWidthResizeHandler() : header.getResizeHandler(),
  }}
/>

Option-2

to update the current getResizeHandler() having a parameter for full-width --> header.getResizeHandler(isFullWidth)

the usage could be in the table:

<div
  {...{
    onMouseDown: header.getResizeHandler(isFullWidth),
    onTouchStart: header.getResizeHandler(isFullWidth),
  }}
/>

After getting your opinions, I am going to proceed for the implementation and will make a PR.

How often does this bug happen?

None

Screenshots or Videos

No response

Platform

macos

react-table version

8.8.6

TypeScript version

4.9.4

Additional context

No response

Terms & Code of Conduct

• I agree to follow this project's Code of Conduct
• I understand that if my bug cannot be reliable reproduced in a debuggable environment, it will probably not be fixed and this issue may even be closed.

Start by reviewing header.getResizeHandler() and the ColumnSizingState behavior described in the issue. Determine how a full-width handler should preserve total table width while respecting the minimum sizes of the current and first later resizable columns, then verify the behavior with a reproducible example and relevant existing resize tests.