Announcing prosemirror-tables-sections

Show
1

Hello, I just published prosemirror-tables-sections, a module derived from prosemirror-tables that adds support for table’s caption, thead, tbody and tfoot.

Your feedback is welcome.

5 Likes
2

Great to see activity in this space. Thanks for publishing this!

3

very cool project. i’d appreciate it if you could deploy a static page for the demo!

1 Like
4

@marijn: the demo seems to work fine now, but I can’t compile the README.md with builddocs (see build_readme script in package.json), could you give me some hints?

@intaek-h: do you know of sites that let you upload such a static page (something like codepen)?

@both: thank you for looking into my project.

5

I just published version 0.3.0 that lets you add/remove table head, foot and bodies.

The demo has been adapted to show the new features.

The core features are there; I could add commands to merge/split sections.

I need to update documentation and understand how to publish it as a npm package.

6

I published the package on npmjs as @massifrg/prosemirror-tables-sections.

Current version is 0.4.1.

2 Likes
7

There’s a new version (0.4.8) that adds commands to make a new table body, head or foot, out of the currently selected rows.

You don’t need to fully select the rows, the new section is made out of the rows touched by the selection.

The commands are makeBody, makeHead and makeFoot; they don’t alter the selection.

They’ve been added to the demo.

makeHead works only when you select the first rows, makeFoot only when you select the last ones. Both turn all the head or foot cells into header_cell (<th> in HTML).

1 Like
8

There’s a new version 0.6.0, that goes back to the original implementation of column resizing – the one in prosemirror-tables. Keeping sections, of course.

Going back to that implementation should solve the problems in column widths at table creation and copy-paste.

It’s also a cleaner implementation, that should ease the task of people looking at the code of both prosemirror-tables and prosemirror-tables-sections.

9

Version 0.6.1 is out.

It adds two commands:

  • setComputedStyleColumnWidths, that sets the cells widths of a table to the actual values you may have set with CSS. It uses window.getComputedStyle to retrieve those widths. If there’s a column selection, it sets the widths of the selected columns’ cells only, otherwise it sets all the cells widths of the (inner) table in the selection.

  • setRelativeColumnWidths(widths: number[], minwidth?: number), that returns a Command to set the relative widths of the (inner) table in the selection. The relative widths must be in the range 0…1.

    The table width is the one obtained with window.getComputedStyle. The new cells will get a col width = rel width * table width.

    If you specify minwidth, the columns will not be narrower than that.

    If widths.length is greater than the number of columns, the exceeding widths will be ignored.

    If widths.length is lesser than the number of columns, only the first column widths will be set.

The code of this version has been checked with the current version of prosemirror-tables (resulting in a bug being fixed).

10

New version 0.6.3 is out.

It should fix a nasty bug in tablemap problems detection.