Share your code. npm Orgs help your team discover, share, and reuse code. Create a free org »

    remark-grid-tablespublic

    remark-grid-tables Build Status Coverage Status

    This plugin parses custom Markdown syntax to describe tables. It was inspired by this syntax.

    It adds a new node type to the mdast produced by remark: gridTable.

    A gridTable mdast node can contain the following mdast node types:

    • tableHeader
    • tableRow
    • tableCell

    If you are using rehype, the stringified HTML result will be a table.

    It is up to you to have CSS rules producing the desired result for these table.

    Syntax

    For example:

    Grid table
     
    ## Basic example
     
    +-------+----------+------+
    | Table Headings   | Here |
    +-------+----------+------+
    | Sub   | Headings | Too  |
    +=======+==========+======+
    | cell  | column spanning |
    + spans +----------+------+
    | rows  | normal   | cell |
    +-------+----------+------+
    | multi | cells can be    |
    | line  | *formatted*     |
    |       | **paragraphs**  |
    | cells |                 |
    | too   |                 |
    +-------+-----------------+

    produces:

    <h1>Grid table</h1>
    <h2>Basic example</h2>
     
    <table>
      <thead>
        <tr>
          <th colspan="2" rowspan="1"><p>Table Headings</p></th>
          <th colspan="1" rowspan="1"><p>Here</p></th>
        </tr>
        <tr>
          <th colspan="1" rowspan="1"><p>Sub</p></th>
          <th colspan="1" rowspan="1"><p>Headings</p></th>
          <th colspan="1" rowspan="1"><p>Too</p></th>
        </tr>
      </thead>
      <tbody>
        <tr>
          <td colspan="1" rowspan="2"><p>cell
    spans
    rows</p></td>
          <td colspan="2" rowspan="1"><p>column spanning</p></td>
        </tr>
        <tr>
          <td colspan="1" rowspan="1"><p>normal</p></td>
          <td colspan="1" rowspan="1"><p>cell</p></td>
        </tr>
        <tr>
          <td colspan="1" rowspan="1"><p>multi
    line</p><p>cells
    too</p></td>
          <td colspan="2" rowspan="1"><p>cells can be
    <em>formatted</em>
    <strong>paragraphs</strong></p></td>
        </tr>
      </tbody>
    </table>

    Note: the top of a cell must be indicated by +- followed by some - or + and finished by -+.
    So, this is not a correct cell:

    +--+
    |a |
    +--+

    But, this is a correct cell:

    +---+
    | a |
    +---+

    Installation

    npm:

    npm install remark-grid-tables

    Usage

    Dependencies:

    const unified = require('unified')
    const remarkParse = require('remark-parse')
    const stringify = require('rehype-stringify')
    const remark2rehype = require('remark-rehype')
     
    const remarkGridTables = require('remark-grid-tables')

    Usage:

    unified()
      .use(remarkParse)
      .use(remarkGridTables)
      .use(remark2rehype)
      .use(stringify)

    License

    MIT © Zeste de Savoir

    Keywords

    install

    npm i remark-grid-tables

    Downloadsweekly downloads

    37

    version

    1.0.12

    license

    MIT

    repository

    githubgithub

    last publish

    collaborators

    • avatar
    • avatar