@Alan_G Thanks for replying.
On sorting, I’m just talking about the visual/interaction pattern. So column headings could be, for example, marked as “sortable”, and/or as “sorted desc” or “sorted asc” and even “next sort” (for what the sorting will be if clicked) so that the component can render the appropriate icon and implement the appropriate hover behaviour that is consistent across shopify pages. I’ve implemented this myself for my tables, but the behaviour doesn’t quite match what shopify have. And if I recall, I also lose the automatic header alignment (based on numeric values or not) and have to introduce that manually, in order to get the sorting icons in there reasonably.
It’s been awhile but my comment on the table component was about wide tables (even on wide screens) being clipped – so columns just fall outside the box that is displayed. This isn’t just a function of the number of columns and screen width – it’s a function of how wide each column is, and that can depend on data that’s in them – e.g. are the product titles long? The clipping is obviously not what’s intended for a table. I solved this by wrapping the whole table in a div that can scroll, but ideally the table could handle this, allowing, for example, the table body to scroll while the filters and search bar do not and adjust to the width of the viewport. This is what Shopify’s tables do (still based on some version of React Polaris, I believe) and it’s quite nice.
I am able to hide columns, but I’m not aware of a good way to query the width of the table that might help with auto hiding based on clipping or calculated widths. That might be nice.
The listSlot thing is fine for narrow screens – though see my post about how these don’t render properly in the mobile app.
I don’t know if there’s any progress using the web components for the main shopify pages (products, orders, etc), but the table features are in a state where you really can’t build anything as nice as them – certainly not in a way that will lead different implementations to maintain a consistent look and feel, which it think is some of the point of the web components. There just aren’t enough features in the components.
There is also no “data table” replacement – something where I can put column totals up top – and the present web component is not flexible enough to let me build one. At least I haven’t figured out how to do so in a robust way. This would need to work on mobile too.