react-base-table icon indicating copy to clipboard operation
react-base-table copied to clipboard

Published 20 hours ago • verified publisher icon Autodesk

fix: render footer below table

Open mobot11 opened this issue 3 years ago • 4 comments

This allows for better keyboard navigation when rendering focusable content in the footer. The current location leads to buttons rendered in the table footer being tabbed to before tabbing to the table.

mobot11 avatar Mar 26 '21 00:03 mobot11

@nihgwu hopefully this isn't considered a breaking change. Not sure what kind of side effects this may have.

mobot11 avatar Mar 26 '21 00:03 mobot11

It does have side effects, you can try to change the dom node of this example https://autodesk.github.io/react-base-table/examples/footer-renderer, the top border of footer(actually it's the bottom border of table body) is overlapped

nihgwu avatar Mar 29 '21 20:03 nihgwu

This will probably break consumer snapshots as well. Can you consider making this enhancement in the future? It will help with accessibility.

mobot11 avatar Mar 29 '21 20:03 mobot11

If .BaseTable is updated to be display: flex and position: absolute is removed from .BaseTable__table and .BaseTable__footer, it allows them to stack correctly. This should also be compatible with the header if it was similarly changed and would allow it to stack correctly in the DOM as well.

highspotjeremy avatar Apr 01 '21 22:04 highspotjeremy