Skip to content
React components and demo for the Tabler UI theme.
CSS JavaScript Other
Branch: master
Clone or download
Latest commit 824e607 Jun 28, 2019
Permalink
Type Name Latest commit message Commit time
Failed to load latest commit information.
docs chore(yarn): update lock files and only mention yarn in docs May 25, 2018
example useExact for subNavItems (#412) Jun 1, 2019
flow-typed/npm Adds classnames flow types Apr 13, 2018
scripts fix(runflow): Added ablity to use global flow command to runflow script. Oct 1, 2018
src Edit to <Table.Header> example (#444) Jun 8, 2019
.babelrc init create-react-library@2.3.4 Apr 13, 2018
.editorconfig init create-react-library@2.3.4 Apr 13, 2018
.eslintrc feat(DropdownItem): add onClickProp Jul 29, 2018
.flowconfig chore(flow): ignore errors from eslint-plugin-jsx-a11y Jul 1, 2018
.gitignore chore(vim): Add vim temp files to gitignore Dec 3, 2018
.prettierrc chore(): update yarn.lock from previous update + remove prettier parser Jun 2, 2018
CHANGELOG.md chore(release): 1.30.1 --skip Jun 1, 2019
CONTRIBUTING.md docs(contributing): adds mention of commintlint May 20, 2018
LICENSE Updated Copyright Date Jan 20, 2019
PULL_REQUEST_TEMPLATE.md Merge branch 'master' of github.com:tabler/tabler-react into tabs May 8, 2018
README.md Update README.md Jun 28, 2019
commitlint.config.js build(commitlint): Remove case requirements May 22, 2018
greenkeeper.json chore(package): Told greenkeeper to ignore webpack updates Dec 5, 2018
package-lock.json chore(release): 1.30.1 --skip Jun 1, 2019
package.json fix(docs): copy index.html to 404.html after build Jun 2, 2019
release.config.js fix(semantic-release): fix config May 25, 2018
rollup.config.js build(rollup): remove css modules support Jun 2, 2018
styleguide.config.js Merge branch 'master' into social-networks-list Jun 2, 2018
yarn.lock chore(release): 1.30.0 --skip Jun 1, 2019

README.md

Update - June 2019: Version 2

Alpha now available on NPM:

npm install tabler-react@alpha yarn add tabler-react@alpha

Check out the latest progress and get involved on this branch, or add your thoughts and requests to this issue.

Tabler React

React implementation of the Tabler Dashboard UI Kit

NPM Type definitions Greenkeeper badge Commitizen friendly

Demo | Documentation | Issues | Slack.

Install

Make sure you have Node.js 8+ and yarn installed.

yarn add tabler-react

Example

import React, { Component } from "react";

import "tabler-react/dist/Tabler.css";

import { Card, Button } from "tabler-react";

class MyCard extends Component {
  render() {
    return (
      <Card>
        <Card.Header>
          <Card.Title>Card Title</Card.Title>
        </Card.Header>
        <Card.Body>
          <Button color="primary">A Button</Button>
        </Card.Body>
      </Card>
    );
  }
}

For more examples and documentation see the demo website

Contributing

There are plenty of opputunities to get involved. Pick an outstanding task, let us know what you are working on and fire away with any questions.

The package is made up of 2 main folders:

  • /src contains all the Tabler React components
  • /example is our create-react-app based demo website

To setup and run a local copy:

  1. Clone this repo with git clone https://github.com/tabler/tabler-react
  2. Run yarn install in the root folder
  3. Run yarn install in the example folder
  4. In seperate terminal windows, run yarn start in the root and example folders.

You should now be up and running with live browser reloading of the example website while you work on Tabler React components in the /src folder.

When you're done working on your changes, submit a PR with the details and include a screenshot if you've changed anything visually.

License

MIT © jonthomp, AaronCoplan and the contributors.

You can’t perform that action at this time.