Column and row span not available

[tamilarasan-n-dev]

how can i span the column or row common for n time to row or column , like a column is common for two columns

[ayonious]

@Tamil-0714 could you also give an example?

[tamilarasan-n-dev]

@Tamil-0714 could you also give an example?

This is the output of the html file here the column CIA mark is common for all column i want to display exactly same as this in terminal, how can span columns

[ayonious]

I dont see any column named "CIA mark" but I suppose you mean "Current CIA". You can use Title in this case. Thats the best option we have for this.

[tamilarasan-n-dev]

I dont see any column named "CIA mark" but I suppose you mean "Current CIA". You can use Title in this case. Thats the best option we have for this.

Ok see the assignment and test column that is common to (one,two, three) and (mid , end ) column how can I achieve that ,

Is there any way to achieve same this table in terminal

[ayonious]

No this can't be achieved with current features. This looks like too complicated feature. If this is needed for many people we will implement it.

[nulltoken]

@ayonious I'd be interested in being able to render something like this.

               ┌─────────────────────────────────────────────────┐
               │                     ZZZZZZZZZZZ                 │
┌──────────────┼────────────────┬───────────────┬────────────────┼─────────┐
│ AAAA         │    BBBBBBB     │        CCCCCC │          DDDDD │   EEEEE │
├──────────────┼────────────────┼───────────────┼────────────────┼─────────┤
│ ...          │      ...       │           ... │            ... │     ... │
└──────────────┴────────────────┴───────────────┴────────────────┴─────────┘

IOW, the ability to group several consecutive columns and identify them as a group.

Would this feature feel of any interest to you? Would that be the case, I'd be happy to contribute some code and tests to make it happen.

However, I might need some guidance from you to craft a way to surface the feature in a user-friendly way that would fit the library style and vision.

[nulltoken]

FWIW, the simpler design I can think of would be something along the lines of:

const table = new Table({
  groups: [ ColumnGroupKind.Blank, { name: "ZZZZZZZ", alignment: "center", width: 3 } ]
});

Although simple, it comes with a cornercase that would need to be dealt with: How should the lib behave when the summed widths exceeds the total number of columns?

[nulltoken]

@ayonious I'm working on a spike.

Current progress is as follows:

 PASS  test/render.test.ts
  Table Rendering Tests

    [...]

    Grouped columns headers
      √ should render single group (3 ms)
      √ should render consecutive groups (2 ms)
      √ should render consecutive groups with a placeholder at the start (1 ms)
      √ should render consecutive groups with a placeholder at the end (2 ms)
      √ should render consecutive groups with a placeholder in between (2 ms)
      √ should render consecutive groups with placeholders (2 ms)
      ○ skipped should cope with very long group names
      should throw when total table width is narrower than total width of group headers
        √ ending with a group header (1 ms)
        √ ending with a placeholder (1 ms)
        √ being one too large group header
        √ being one too large placeholder

With the following output:

    ┌──────────────────────────────────────────────────────┐
    │                          G1                          │
    ├────┬────┬────┬─────────┬────┬────┬────┬────┬─────────┤
    │  A │  B │  C │       D │  E │  F │  G │  H │       I │
    ├────┼────┼────┼─────────┼────┼────┼────┼────┼─────────┤
    │ A1 │ B1 │ C1 │      D1 │ E1 │ F1 │ G1 │ H1 │ I 00001 │
    │ A2 │ B2 │ C2 │ D 00002 │ E2 │ F2 │ G2 │ H2 │      I2 │
    └────┴────┴────┴─────────┴────┴────┴────┴────┴─────────┘

      at Table.printTable (src/console-table-printer.ts:41:13)

  console.log
    ┌─────────┬──────────────┬─────────────────────────────┐
    │   G1    │      G2      │             G3              │
    ├────┬────┼────┬─────────┼────┬────┬────┬────┬─────────┤
    │  A │  B │  C │       D │  E │  F │  G │  H │       I │
    ├────┼────┼────┼─────────┼────┼────┼────┼────┼─────────┤
    │ A1 │ B1 │ C1 │      D1 │ E1 │ F1 │ G1 │ H1 │ I 00001 │
    │ A2 │ B2 │ C2 │ D 00002 │ E2 │ F2 │ G2 │ H2 │      I2 │
    └────┴────┴────┴─────────┴────┴────┴────┴────┴─────────┘

      at Table.printTable (src/console-table-printer.ts:41:13)

  console.log
         ┌─────────┬──────────────┬────────────────────────┐
         │   G1    │      G2      │           G3           │
    ┌────┼────┬────┼─────────┬────┼────┬────┬────┬─────────┤
    │  A │  B │  C │       D │  E │  F │  G │  H │       I │
    ├────┼────┼────┼─────────┼────┼────┼────┼────┼─────────┤
    │ A1 │ B1 │ C1 │      D1 │ E1 │ F1 │ G1 │ H1 │ I 00001 │
    │ A2 │ B2 │ C2 │ D 00002 │ E2 │ F2 │ G2 │ H2 │      I2 │
    └────┴────┴────┴─────────┴────┴────┴────┴────┴─────────┘

      at Table.printTable (src/console-table-printer.ts:41:13)

  console.log
    ┌─────────┬──────────────┬───────────────────┐
    │   G1    │      G2      │        G3         │
    ├────┬────┼────┬─────────┼────┬────┬────┬────┼─────────┐
    │  A │  B │  C │       D │  E │  F │  G │  H │       I │
    ├────┼────┼────┼─────────┼────┼────┼────┼────┼─────────┤
    │ A1 │ B1 │ C1 │      D1 │ E1 │ F1 │ G1 │ H1 │ I 00001 │
    │ A2 │ B2 │ C2 │ D 00002 │ E2 │ F2 │ G2 │ H2 │      I2 │
    └────┴────┴────┴─────────┴────┴────┴────┴────┴─────────┘

      at Table.printTable (src/console-table-printer.ts:41:13)

  console.log
    ┌─────────┬──────────────┐    ┌────────────────────────┐
    │   G1    │      G2      │    │           G3           │
    ├────┬────┼────┬─────────┼────┼────┬────┬────┬─────────┤
    │  A │  B │  C │       D │  E │  F │  G │  H │       I │
    ├────┼────┼────┼─────────┼────┼────┼────┼────┼─────────┤
    │ A1 │ B1 │ C1 │      D1 │ E1 │ F1 │ G1 │ H1 │ I 00001 │
    │ A2 │ B2 │ C2 │ D 00002 │ E2 │ F2 │ G2 │ H2 │      I2 │
    └────┴────┴────┴─────────┴────┴────┴────┴────┴─────────┘

      at Table.printTable (src/console-table-printer.ts:41:13)

  console.log
         ┌─────────┐         ┌─────────┬─────────┐
         │   G1    │         │   G2    │   G3    │
    ┌────┼────┬────┼─────────┼────┬────┼────┬────┼─────────┐
    │  A │  B │  C │       D │  E │  F │  G │  H │       I │
    ├────┼────┼────┼─────────┼────┼────┼────┼────┼─────────┤
    │ A1 │ B1 │ C1 │      D1 │ E1 │ F1 │ G1 │ H1 │ I 00001 │
    │ A2 │ B2 │ C2 │ D 00002 │ E2 │ F2 │ G2 │ H2 │      I2 │
    └────┴────┴────┴─────────┴────┴────┴────┴────┴─────────┘

      at Table.printTable (src/console-table-printer.ts:41:13)

Current test for the last output is

    const buildTestTable = (
      groupedHeaders?: GroupedColumnsHeaderOrPlaceholder[]
    ): Table => {
      const table = new Table({
        groupedColumnsHeaders: groupedHeaders,
      });

      table.addRow({
        A: `A1`,
        B: `B1`,
        C: `C1`,
        D: `D1`,
        E: `E1`,
        F: `F1`,
        G: `G1`,
        H: `H1`,
        I: `I 00001`,
      });

      table.addRow({
        A: `A2`,
        B: `B2`,
        C: `C2`,
        D: `D 00002`,
        E: `E2`,
        F: `F2`,
        G: `G2`,
        H: `H2`,
        I: `I2`,
      });

      return table;
    };

    it('should render consecutive groups with placeholders', () => {
      const table = buildTestTable([
        { kind: 'PLACEHOLDER', width: 1 },
        { name: 'G1', width: 2 },
        { kind: 'PLACEHOLDER', width: 1 },
        { name: 'G2', width: 2 },
        { name: 'G3', width: 2 },
      ]);

      const rendered = table.render();
      expect(rendered).toMatchSnapshot();
      table.printTable();
    });

Code is a bit crude as of now. But it looks like I've got a working prototype. I've still got one last corner case (that I can think of) to tackle.