feat(ui5-table): improve horizontal scrolling #9293
Conversation
DonkeyCo
commented
Jun 24, 2024
DonkeyCo
commented
- add horizontal scrollbar, when overflow-mode is set to Scroll
- when selection is enabled, the column is fixed to the left
- handle focus when focus below fixed column
- fixed selection cell to the left - table has its own scrollbar when in Scroll mode - documented restrictions
packages/main/src/Table.ts
Outdated
| * @public | ||
| */ | ||
| @property() | ||
| height = "auto"; |
There was a problem hiding this comment.
I am not sure if i liked this property, i guess you know why.
There was a problem hiding this comment.
Removed it for now. Leads to issues if you set the table to Scroll mode (because of overflow-x: auto)
packages/main/src/Table.ts
Outdated
| top: elementRect.top - stickyBottom, | ||
| }); | ||
| // Handles focus in the table, when the focus is below a sticky element | ||
| scrollElementIntoView(this._scrollContainer, e.target as HTMLElement, this._stickyElements); |
There was a problem hiding this comment.
this will be really complicated when e.g. if group headers came into topic also doing this calculation on every focusin feels a little wrong.
we are discussing how to handle this for the m/Table better there with using scroll-padding-top but here in WC we somehow do not know the scroll container, heights might change, bla bla.
There was a problem hiding this comment.
scroll-padding-top would be a nice solution as well for the WC, but there is a problem with the focus.
If the element is outside of the container/not visible, focusing the element will center it in the viewport, which is a bit weird.
We could circumvent this by doing a programatic call to element.scrollIntoView(), then it is aligned to the top
There was a problem hiding this comment.
If the element is outside of the container/not visible, focusing the element will center it in the viewport, which is a bit weird.
I didn't get how user will focus if the element is not visible, but if this is the default of the browser then it should be fine.
- adjust code according to feedback - adjust focus logic to account for rtl
