Function Resizer

packages/react-aria/stories/table/example-resizing.tsx:190–240

({
  column,
  layout,
  onResizeStart,
  onResize,
  onResizeEnd
}: {
  column: any;
  layout: any;
  onResizeStart: any;
  onResize: any;
  onResizeEnd: any;
})

  );
}
function Resizer({
  column,
  layout,
  onResizeStart,
  onResize,
  onResizeEnd
}: {
  column: any;
  layout: any;
  onResizeStart: any;
  onResize: any;
  onResizeEnd: any;
}): JSX.Element {
  let ref = useRef(null);
  let {resizerProps, inputProps} = useTableColumnResize(
    {
      column,
      'aria-label': 'Resizer',
      onResizeStart,
      onResize,
      onResizeEnd
    } as AriaTableColumnResizeProps<any>,
    layout,
    ref
  );

  return (
    <>
      <FocusRing within focusRingClass={classNames(styles, 'focus-ring')}>
        <div
          role="presentation"
          style={{
            cursor: undefined,
            alignSelf: 'stretch',
            width: '20px',
            border: '1px solid red',
            touchAction: 'none',
            flex: '0 0 auto',
            position: 'absolute',
            insetInlineEnd: 0,
            height: '100%'
          }}
          {...resizerProps}>
          <VisuallyHidden>
            <input ref={ref} {...inputProps} />
          </VisuallyHidden>
        </div>
      </FocusRing>
    </>
  );
}
export function TableColumnHeader({
  column,
  state,