Skip to content
React components for the Carbon Design System
Branch: master
Clone or download
asudoh fix(Tabs): avoid stale tab ref cache (#2224)
The problem happens when `selected` and `children` changes at the same
time.

Fixes #2204.
Latest commit 2335c44 Apr 20, 2019
Permalink
Type Name Latest commit message Commit time
Failed to load latest commit information.
.circleci chore(ci): re-enable storybook, remove experimental (#2199) Apr 12, 2019
.github chore(format): run prettier (#2099) Mar 27, 2019
.storybook chore(project): update babel deps, remove unused plugins (#2211) Apr 16, 2019
.yarn-offline-mirror chore: update carbon-components for storybook (#2221) Apr 17, 2019
config test(components): support v10 code (#2031) Mar 20, 2019
docs docs(migration): add block to refer to Carbon X (#2210) Apr 13, 2019
examples
scripts chore(rollup): update rollup and config (#2216) Apr 15, 2019
src fix(Tabs): avoid stale tab ref cache (#2224) Apr 20, 2019
ssr-tests
.aat.yml a11y testing for all components Jan 16, 2017
.all-contributorsrc fix(data-table): update skeleton for IE11 compatibility (#1531) Nov 9, 2018
.cfignore chore: add staticfile and cfignore for deploys (#387) Dec 1, 2017
.editorconfig Search (#38) Aug 3, 2016
.gitignore chore(build): supporting experimental for deploy preview (#1711) Jan 11, 2019
.prettierignore docs: move docs to github folder, update instructions (#651) Mar 1, 2018
.yarnrc
LICENSE chore(license): add LICENSE file and update field in package.json (#269) Oct 11, 2017
README.md docs(7.x): update docs to reference v7 instead of v10 (#2100) Mar 27, 2019
Staticfile chore: add staticfile and cfignore for deploys (#387) Dec 1, 2017
package.json chore(commitlint): disable scope-case (#2225) Apr 19, 2019
yarn.lock chore: update carbon-components for storybook (#2221) Apr 17, 2019

README.md

carbon-components-react

Carbon Components is released under the Apache-2.0 license CircleCI All Contributors PRs welcome!

A collection of Carbon Components implemented using React.

Getting Started

Run the following command using npm:

npm install -S carbon-components-react carbon-components carbon-icons

If you prefer Yarn, use the following command instead:

yarn add carbon-components-react carbon-components carbon-icons
  1. These components require the use of Webpack in your project. See our webpack.config.js for an example configuration.

  2. Components do not import any of the styles themselves, use the scss or css from carbon-components to bring in styling. You can also use the unpkg cdn to bring in the styles wholesale - unpkg.com/carbon-components/css/carbon-components.css aliases the latest css file.

  3. For older browsers (e.g. IE11), polyfills listed in carbon-components-react/.storybook/polyfills.js file is required.

If you just want to try out carbon-components-react, you can also use CodeSandbox.

Edit carbon-components-react

Usage

List of Available Components

View available React Components here. You can see usage information in several ways:

  1. Clicking the blue Show Info icon in the top right corner of the selected component. You can see the list of available React props
  2. Clicking the STORY tab at the bottom. This tab contains the code that shows how the component is being used
  3. Clicking the KNOBS tab at the bottom and changing values there. Most knobs are shown as something like Button kind (kind), where kind is the name of React prop
  4. Clicking the ACTION LOGGER tab at the bottom and interacting with the selected component. You may see something like onClick which typically indicates that the event handler (React prop) with the same name is called. You can also expand the twistie to see the details of the event
  5. Clicking the README tab at the bottom. You can see some more document for some components

📚 Documentation

Contributing

Please check out our Contribution Guidelines for detailed information on how you can lend a hand.

To update the Contributors section, follow these instructions

Contributors

Thanks goes to these wonderful people:


Brian Han

💻

Chris Dhanaraj

💻

Nick Sandonato

💻

TJ Egan

💻

Mari Johannessen

💻

Sam Doyle

💻

alex weidner

💻

Ciaran Hannigan

💻

Ian Fleming

💻

Eddie Monge

💻

Reinaldo Cruz

💻

Yu Cao

💻

Megan Becvarik

💻

Astha

💻

Jason Lengstorf

💻

Nathan Friedly

💻

Matt Hamann

💻

Greg

💻

Anthony Oliveri

💻

Jorge Padilla

💻

German Attanasio

💻

Ritchie Martori

💻

Akira Sudoh

💻

holmansze

💻

Josh Black

💻 📖 💡 🚇

Tayler Aitken

🎨 📖

Bethany Sonefeld

🎨

Dmitri Wolf

💻

James

💻

Kade Keith

💻

Mira Murali

💻

alisonemiller

💻

bjones526

💻

sandhya-r-reddy

💻

Alison Joseph

💻

Dogukan

💻

Erika Dsouza

💻

Jeroen Schaftenaar

💻

Joseph Meis

💻

Paul Sachs

💻

Ryan Mackey

💻

Toni

💻

shyfruan

💻

Joseph Gordon

💻

Logan McCaul

💻

Matt Chapman

💻

Scott Dickerson

💻

Darío Hereñú

💻

James Zhang

💻

Simone Riccardelli

💻

Tom

💻

Zeus Courtois

💻

Andrew Daniel

🐛 💻

Andy

🐛 💻

Nicholas Lee

💻

David Menendez

💻

Prashant Farkya

💻

Tibor Cz

📖

Xixiang Chen

💻

s100

💻

Becca Ellsworth

💻

Zack Grossbart

💻

Yohanna Gadelrab

💻 🐛 ⚠️ 📖

Carlos Eduardo Monti

💻 📖

Thomas Brown

💻
You can’t perform that action at this time.