1.1.1 • Published 7 years ago
@tillhub/tableify v1.1.1
@tillhub/tableify
Creates html table with customizable headers, classes and cell contents.
Install
npm install --save @tillhub/tableifyUsage
Tableify takes two arguments: items and options.
| Argument | Type | Example | Required |
|---|---|---|---|
| items | Array of objects | { name: 'a' }, { name: 'b' }, { name: 'c' } | true |
| options | Object | { showHeaders: false } | false |
const tableify = require('@tillhub/tableify')
const items = [
{
name: 'Lipstick',
vat_rate: 19,
net: 6.58,
currency: 'EUR'
},
{
name: 'Shoelaces',
vat_rate: 19,
net: 7.34,
currency: 'EUR'
},
{
name: 'Apple',
vat_rate: 7,
net: 0.43
},
{
name: 'Pears',
vat_rate: 7,
net: 0.77
}
]
const options = {
headers: [
'name',
'net',
{ field: 'vat_rate', show: true },
{ field: 'currency', show: false }
],
headerCellClass: function(row, col) {
if (col === 'vat_rate') return 'green'
},
bodyCellClass: function(row, col, content) {
if (content === 'Apple') return 'apple'
if (col === 'name') return 'red'
},
headerCellContent: function(row, col) {
if (map[col]) {
return map[col].custom || map[col].default
}
},
bodyCellContent: function(row, col, content) {
if (row.currency) {
if (col === 'net') {
return content.toLocaleString('de-DE', {
style: 'currency',
currency: row.currency
})
}
}
},
hideRow: function(row) {
if (row.name === 'Pears') return true
}
}
console.log(tableify(items, options))
/* RESULT
<table>
<thead>
<tr>
<th>Product</th>
<th>net</th>
<th class="green">VAT</th>
</tr>
</thead>
<tbody>
<tr>
<td class="red">Lipstick</td>
<td>€6.58</td>
<td>19</td>
</tr>
<tr>
<td class="red">Shoelaces</td>
<td>€7.34</td>
<td>19</td>
</tr>
<tr>
<td class="apple">Apple</td>
<td>0.43</td>
<td>7</td>
</tr>
</tbody>
</table>
*/Options
There are multiple alternatives for the options object.
| Name | Description | Type | Default |
|---|---|---|---|
| headers | Array of strings with headers. If omitted, tableify will get all keys from item objects. | Array of strings | unique keys from all item objects |
| headerCellClass | function that returns custom class names for a cell in the table header | Function(row, col)/String | -- |
| bodyCellClass | function that returns custom class names for a cell in the table body | Function(row, col, content)/String | -- |
| headerCellContent | function that returns custom content for a cell in table header | Function(row, col)/String | -- |
| bodyCellContent | function that returns custom content for a cell in table body | Function(row, col, content)/String | -- |
| hideRow | function that returns a boolean; if true, it will skip the row | Function(row)/Boolean | -- |
| showHeaders | boolean that hides/shows the complete header section | Boolean | true |
License
MIT © qtotuan