@arcteryx/components-table

Arc'teryx Tables

Styled, zebra-striped tables. The

component offers a styled-wrapper to wrap basic html tables.

Install

npm install --save @arcteryx/components-table

Usage

import { Table } from "@arcteryx/components-table";
<Table>
  <table>
    <tbody>
      <tr>
        <th>Header</th>
      </tr>
      <tr>
        <td>123</td>
      </tr>
    </tbody>
  </table>
</Table>

Content Toggle

The purpose of this component is to switch between cm/inch tables, but it could be used for any content.

It takes an array of options that will be shown as buttons, and selecting these will search the DOM and toggle content accordingly.

import { Table } from "@arcteryx/components-table";

<ContentToggle items={contentToggleItems} name="sizing" default="cm" />

<div class="content--sizing content--cm">stuff</div>
<div class="content--sizing content--inches">other stuff</div>