pui-react-sortable-table

pui-react-sortable-table

A React component that provides a table that can be sorted by column

Pivotal UI React (GitHub, npm) is a collection of React components for rapidly building and prototyping UIs.

This component requires React v0.13

See the Pivotal UI Styleguide for fully rendered examples.

Components

TableHeader

Wrapper for a th

Properties

• sortable
  • boolean: (defaults to false) indicates whether the table can be sorted by this column;

TableCell

Wrapper for a td

TableRow

Wrapper for a tr

SortableTable

A table that can be sorted by column

var {SortableTable, TableHeader, TableRow, TableCell} = require('pui-react-sortable-table');
var MyComponent = React.createClass({
  render() {
    var headers = [
      <TableHeader sortable={true}>c1</TableHeader>,
      <TableHeader sortable={true}>c2</TableHeader>,
     ];
    var data = [
      {c1: 'yes', c2: 'foo'},
      {c1: 'no', c2: 'bar'}
    ];
    return <SortableTable headers={headers}>
      {sortTableData.map(function(datum, key) {
        return (
          <TableRow key={key}>
            <TableCell>{datum.c1}</TableCell>
            <TableCell>{datum.c2}</TableCell>
          </TableRow>
        );
      })}
    </SortableTable>;
  }
});

Properties

• headers
  • Array<Object>: A list of TableHeader components

---

(c) Copyright 2015 Pivotal Software, Inc. All Rights Reserved.