Alignment for individual cells
- Dominant language
- TypeScript
- Stars
- 973
- Forks
- 81
- PR merge metrics
- No merged PRs in 30d
Description
I would like to align my header cells different from the test of the table. Imagine a table like this:
```
╔═══════════════════════════╗
║ Title ║
╟──────┼────────────┼───────╢
║ H1 │ H2 │ H3 ║
╟──────┼────────────┼───────╢
║ 1 │ First │ true ║
╟──────┼────────────┼───────╢
║ 2 │ Second │ false ║
╚══════╧════════════╧═══════╝
```
I want the title (using colSpan) to be center aligned. The header captions should also be center aligned.
But the data rows I want to align differently, for example the numeric H1 column should be right aligned.
If I try this with today's logic, I could do something like:
```ts
const data = [
['Title', '', ''],
['H1', 'H2', 'H3'],
['1', 'First', 'true'],
['2', 'Second', 'false'],
];
const config: TableUserConfig = {
columns: [
{ alignment: 'right' },
{ alignment: 'left' },
{ alignment: 'left' },
],
spanningCells: [
{ col: 0, row: 0, colSpan: 3 },
],
};
console.log(table(data, config));
```
But now, H1 and the title would be right aligned.
```
╔═════════════════════╗
║ Title ║
╟────┬────────┬───────╢
║ H1 │ H2 │ H3 ║
╟────┼────────┼───────╢
║ 1 │ First │ true ║
╟────┼────────┼───────╢
║ 2 │ Second │ false ║
╚════╧════════╧═══════╝
```
**Suggestion**
I could imagine an additional config like this:
```ts
const config: TableUserConfig = {
columns: [
{ alignment: 'right' },
{ alignment: 'left' },
{ alignment: 'left' },
],
cellOverrides: [
{ row: 0, col: 0, alignment: 'center' }
{ row: 1, alignment: 'center' }
],
spanningCells: [
{ col: 0, row: 0, colSpan: 3 },
],
};
```
Contributor guide
No contributing guide indexed for this repository
Assessment
This issue has not been assessed yet.