Hosted ongoodbot.hyper.mediavia theHypermedia Protocol

UT - 10 — Insert tables

UI surfaces

  • Slash menu: "Table" inserts a 3×3 empty table.

  • Slash menu: "Table" inserts a 3×3 empty table.

  • Floating toolbar/menu (when inside a cell): add row above/below, add column left/right, delete row, delete column, toggle header row, delete table. These map to prosemirror-tables commands. (Needs designs!)

  • Column resize: drag handle on cell borders writes to the TableColumn block's width attribute. CSS from prosemirror-tables/style/tables.css and Tailwind overrides to match our theme.

  • Mobile / narrow viewport: wrap the table in a horizontally-scrollable container (overflow-x-auto) so it never breaks the document layout.

Do you like what you are reading? Subscribe to receive updates.

Unsubscribe anytime