Spaces:
Running
Table columns resize by dragging a cell border
The table extension was configured with resizable: false, so column widths were fixed. This turns it on: hover a cell border and drag.
prosemirror-tables does the work — what was missing was the configuration and the two CSS rules that make it findable. It draws the handle itself and asks for a cursor by putting .resize-cursor on the editor; with neither styled the feature works but is invisible, so you would never know the border was grabbable.
The last column stays out of it (lastColumnResizable: false). The table is width: 100% of a fixed page, so leaving one column elastic lets it absorb what the others give up and keeps the table inside the margins. Make every column draggable and the table grows past them instead. cellMinWidth: 48 stops a column being collapsed to nothing by a stray drag.
Widths are cell attributes, so they ride Yjs like any other edit: they sync to other people in the document, not just the session that set them.
Test drags a border, asserts the column narrowed, asserts the table itself did not move, then reloads and asserts the width came from the document rather than the session.
Two limits, both left alone rather than half-done:
- Resizing is mouse-driven, so it does not work by touch — on mobile tables still scroll sideways.
- A suggestion that replaces a table block carries markdown, which has nowhere to record a width, so accepting one resets that table's columns.
Independent of the other PRs in this set, but it touches client/src/doc.js, client/app.css and test/browser.js, which they also touch — expect textual conflicts depending on merge order.
Rebased onto main and resolved the test/browser.js conflict: both test blocks kept, the table-resize test first (while the playground document with the seeded table is open), main's switcher test after it. Full smoke + browser suites pass on the merged tree.