Fyndiq-component-table NPM

fyndiq-component-table

A Table component for Fyndiq

Installation

The component can be installed through NPM:

npm i -S fyndiq-component-table

Usage

import React from 'react'
import { Table, Row, Cell } from 'fyndiq-component-table'

// Normal usage
<Table>
  <Row head>
    <Cell>Column 1</Cell>
    <Cell>Column 2</Cell>
    <Cell>Column 3</Cell>
  </Row>
  <Row>
    <Cell>Row 1 - Column 1</Cell>
    <Cell>Row 1 - Column 2</Cell>
    <Cell>Row 1 - Column 3</Cell>
  </Row>
  <Row>
    <Cell>Row 2 - Column 1</Cell>
    <Cell>Row 2 - Column 2</Cell>
    <Cell>Row 2 - Column 3</Cell>
  </Row>
</Table>

API

Table

The component Table has the following customizable props:

Name	Type	Description	Default value
className	String	Additional classname	`''`
children	Node	Content of the table	`''`

Row

The component Row has the following customizable props:

Name	Type	Description	Default value
className	String	Additional classname	`''`
size	String	Vertical size of the row. Can be `s`, `m` or `l`	`m`
head	Bool	If set to true, will render a header	`false`
interactive	Bool	If set to true, will visually react to mouse over	`false`
noBorder	Bool	If set to true, will not add a bottom border	`false`
verticalCenter	Bool	Controls the vertical centering of the content	`true`
children	Node	Content of the row	`''`