app/assets/javascripts/content_editor/extensions/table_row.js


1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51

import { TableRow } from '@tiptap/extension-table-row';

export const tiptapExtension = TableRow.extend({
  allowGapCursor: false,
});

export function serializer(state, node) {
  const isHeaderRow = node.child(0).type.name === 'tableHeader';

  const renderRow = () => {
    const cellWidths = [];

    state.flushClose(1);

    state.write('| ');
    node.forEach((cell, _, i) => {
      if (i) state.write(' | ');

      const { length } = state.out;
      state.render(cell, node, i);
      cellWidths.push(state.out.length - length);
    });
    state.write(' |');

    state.closeBlock(node);

    return cellWidths;
  };

  const renderHeaderRow = (cellWidths) => {
    state.flushClose(1);

    state.write('|');
    node.forEach((cell, _, i) => {
      if (i) state.write('|');

      state.write(cell.attrs.align === 'center' ? ':' : '-');
      state.write(state.repeat('-', cellWidths[i]));
      state.write(cell.attrs.align === 'center' || cell.attrs.align === 'right' ? ':' : '-');
    });
    state.write('|');

    state.closeBlock(node);
  };

  if (isHeaderRow) {
    renderHeaderRow(renderRow());
  } else {
    renderRow();
  }
}