@yozora/html-table NPM

This component is for rendering the Yozora Markdown AST node ITable, ITableRow and ITableCell produced by @yozora/tokenizer-table into HTML string.

This component has been built into @yozora/html-markdown, you can use it directly.

Install

npm
```
npm install --save @yozora/html-table
```
yarn
```
yarn add @yozora/html-table
```

Usage

Basic:

import type { ITable, IYastNode } from '@yozora/ast'
import renderTable from '@yozora/html-table'

// The implementation of the following function has been omitted.
const renderChildren: (nodes: IYastNode[]) => string = function () {}

const table = {
  "type": "table",
  "columns": [
    { "align": "center" },
    { "align": "right" },
    { "align": null }
  ],
  "children": [
    {
      "type": "tableRow",
      "children": [
        {
          "type": "tableCell",
          "children": [{ "type": "text", "value": "abc" }]
        },
        {
          "type": "tableCell",
          "children": [{ "type": "text", "value": "defghi" }]
        },
        {
          "type": "tableCell",
          "children": [{ "type": "text", "value": "xyz" }]
        }
      ]
    },
    {
      "type": "tableRow",
      "children": [
        {
          "type": "tableCell",
          "children": [{ "type": "text", "value": "bar" }]
        },
        {
          "type": "tableCell",
          "children": [{ "type": "text", "value": "baz" }]
        },
        {
          "type": "tableCell",
          "children": [{ "type": "text", "value": "defghi" }]
        }
      ]
    }
  ]
}
renderTable(table as ITable, renderChildren)
// => <table class="yozora-table-item"><thead class="yozora-table__thead"><tr class="yozora-table-row"><th class="yozora-table-cell" align="center"><span class="yozora-text">abc</span></th><th class="yozora-table-cell" align="right"><span class="yozora-text">defghi</span></th><th class="yozora-table-cell"><span class="yozora-text">xyz</span></th></tr></thead><tbody class="yozora-table__tbody"><tr class="yozora-table-row"><td class="yozora-table-cell" align="center"><span class="yozora-text">bar</span></td><td class="yozora-table-cell" align="right"><span class="yozora-text">baz</span></td><td class="yozora-table-cell"><span class="yozora-text">defghi</span></td></tr></tbody></table>