Skip to content
📐A table component for Ink.
Branch: master
Clone or download
Fetching latest commit…
Cannot retrieve the latest commit at this time.
Permalink
Type Name Latest commit message Commit time
Failed to load latest commit information.
examples
media
src
.babelrc
.gitignore
.travis.yml
README.md
package-lock.json
package.json
renovate.json
test.js
yarn.lock

README.md

ink-table

Build Status npm version

A table component for Ink.

Install

npm install ink-table

Usage

import Table from 'ink-table'

const data = [
  {
    name: "Sosa Saunders",
    gender: "male",
    age: 17,
    email: "sosa.saunders@mail.com",
    phone: "+1 (809) 435-2786"
  },
  {
    name: "Angelina Kirk",
    gender: "female",
    age: 3,
    email: "angelina@kirk.io",
    phone: "+1 (870) 567-3516"
  },
  {
    name: "Bradford Rosales",
    gender: "male",
    age: 20,
    email: "bradfordrosales@fast.com",
    phone: "+1 (918) 573-3240"
  },
  {
    name: "Gwen Schroeder",
    gender: "female",
    age: 17,
    email: "gwen@corp.xyz",
    phone: "+1 (987) 417-2062"
  },
  {
    name: "Ellison Mann",
    gender: "male",
    age: 5,
    email: "ellisonmann@katakana.com",
    phone: "+1 (889) 411-2186"
  }
];

const Basic = () => (
  <Table data={data} />
);

render(<Basic />);

Props

data array<object>

List of all the values (rows).

padding number

Offset inside each cell. This is considered one side value (set to 2 will have 2 spaces on the left and on the right - 4 combined).

header ({children}) => h

A component used as header cell. Value is passed as children prop. (Recommend using <Color/> with chalk props.)

cell ({children}) => h

A component used as regular cell. Value is passed as children prop. (Recommend using <Color/> with chalk props.)

skeleton ({children}) => h

A component used as skeleton (lines and crosses ...). Value is passed as children prop. (Recommend using <Color/> with chalk props.)

License

MIT © Matic Zavadlal

You can’t perform that action at this time.