@mskcc/carbon-react/README.md

Carbon react components for the MSKCC DSM

# @mskcc/carbon-react

> React components for the MSKCC Design System

## Getting started

To install `@mskcc/carbon-react` in your project, you will need to run the
following command using [npm](https://www.npmjs.com/):

```bash
npm install -S @mskcc/carbon-react
```

If you prefer [Yarn](https://yarnpkg.com/en/), use the following command
instead:

```bash
yarn add @mskcc/carbon-react
```

This package requires [Dart Sass](http://npmjs.com/package/sass) in order to
compile styles.

If you're new to Sass, we recommend checking out the following resources and
links:

- [Sass Basics](https://sass-lang.com/guide)
- [The Sass `@use` documentation for Sass modules](https://sass-lang.com/documentation/at-rules/use/)
- [The Carbon Design System FAQ on Sass](https://carbondesignsystem.com/migrating/faq/#sass-and-package-management)

For info on how to configure Sass for your project, here are some common
framework's documentation worth reviewing:

- [Next.js with Sass](https://nextjs.org/docs/basic-features/built-in-css-support#sass-support)
- [Remix with Sass](https://remix.run/docs/en/1.18.0/guides/styling#css-preprocessors)
- [Gatsby with Sass](https://www.gatsbyjs.com/docs/how-to/styling/sass/)

Or if you're just using a bundler:

- [Parcel with Sass](https://v2.parceljs.org/languages/sass/)
- [Vite with Sass](https://vitejs.dev/guide/features.html#css-pre-processors)

Or anything else not listed above:

- [Webpack with Sass](https://webpack.js.org/loaders/sass-loader/)
- [Create React App with Sass](https://create-react-app.dev/docs/adding-a-sass-stylesheet/)
- [Snowpack with Sass](https://www.snowpack.dev/guides/sass/)

Once you get Sass up and running in your project, you may need to configure Sass
to include `node_modules` in its `includePaths` option. For more information,
checkout the [configuration](../styles/docs/sass.md#configuration) section in
our Sass docs.

## Usage

The `@mskcc/carbon-react` package provides components and icons for the Carbon
Design System.

To use a component, you can import it directly from the package:

```jsx
import { Button } from '@mskcc/carbon-react';

function MyComponent() {
  return <Button>Example usage</Button>;
}
```

## 📖 API Documentation

If you're looking for `@mskcc/carbon-react` API documentation, check out:

- [Storybook](https://components.mskcc.org/)
- [Icon Library](https://www.carbondesignsystem.com/guidelines/icons/library/)

## 🙌 Contributing

We're always looking for contributors to help us fix bugs, build new features,
or help us improve the project documentation. If you're interested, definitely
check out our [Contributing Guide](/.github/CONTRIBUTING.md)! 👀