# react-slds

> React components for Lightning Design System

Latest version **0.1.2** (published 2018-08-28) · MIT license · 0 weekly downloads

> **Deprecated.** This package is deprecated.

## Install

```sh
npm install react-slds
pnpm add react-slds
yarn add react-slds
bun add react-slds
```

## Health

**Score 10/100 (F)** — status: deprecated.

Negative: deprecated.

## Facts

| | |
|---|---|
| Version | 0.1.2 |
| Published | 2018-08-28 |
| First published | 2018-08-12 |
| Weekly downloads | 0 |
| License | MIT |
| TypeScript types | none |
| Module format | CommonJS |
| Dependencies | 7 |
| Unpacked size | 266.1 KB |
| Known vulnerabilities | 0 |
| Install scripts | no |
| Maintainers | reiniergs |
| Keywords | react, components, slds, lightning, library |

## Links

- npm: https://www.npmjs.com/package/react-slds
- Repository: https://github.com/reiniergs/react-lightning-components
- Homepage: https://github.com/reiniergs/react-lightning-components#readme
- Issues: https://github.com/reiniergs/react-lightning-components/issues
- npm.io page: https://npm.io/package/react-slds

## Dependencies (7)

- [react](https://npm.io/package/react.md) ^16.4.2
- [react-dom](https://npm.io/package/react-dom.md) ^16.4.2
- [classnames](https://npm.io/package/classnames.md) ^2.2.5
- [prop-types](https://npm.io/package/prop-types.md) ^15.6.2
- [file-loader](https://npm.io/package/file-loader.md) ^1.1.11
- [clipboard-copy](https://npm.io/package/clipboard-copy.md) ^2.0.0
- [react-codemirror2](https://npm.io/package/react-codemirror2.md) ^5.1.0

## Alternatives

- [mobx-react](https://npm.io/package/mobx-react.md) — 2.8M weekly downloads
- [rc-tree](https://npm.io/package/rc-tree.md) — 2.6M weekly downloads
- [@react-oauth/google](https://npm.io/package/@react-oauth/google.md) — 1.3M weekly downloads
- [@wagmi/connectors](https://npm.io/package/@wagmi/connectors.md) — 877.0K weekly downloads
- [vee-validate](https://npm.io/package/vee-validate.md) — 836.4K weekly downloads

## Recent versions

- 0.1.2 (latest) — 2018-08-28
- 0.0.6 — 2018-08-16
- 0.0.5 — 2018-08-12
- 0.0.4 — 2018-08-12
- 0.0.3 — 2018-08-12
- 0.0.2 — 2018-08-12
- 0.0.1 — 2018-08-12

## README

<p align="center">
  <a href="https://react-lightning-components.firebaseapp.com/" rel="noopener" target="_blank"><img width="100%" src="https://github.com/reiniergs/react-lightning-components/blob/master/assets/images/background-home.svg" alt="React Lightning Component logo"></a></p>
</p>

<div align="center">
<p align="center">
[React Lightning Components](https://react-lightning-components.firebaseapp.com/ ) are [react](http://facebook.github.io/react/) components that implement [Lightning Design System.](https://www.lightningdesignsystem.com/)
</p>
[![CircleCI](https://circleci.com/gh/reiniergs/react-lightning-components/tree/master.svg?style=svg)](https://circleci.com/gh/reiniergs/react-lightning-components/tree/master)
[![Coverage Status](https://coveralls.io/repos/github/reiniergs/react-lightning-components/badge.svg?branch=master)](https://coveralls.io/github/reiniergs/react-lightning-components?branch=master)
[![License: MIT](https://img.shields.io/badge/License-MIT-yellow.svg)](https://opensource.org/licenses/MIT)
</div>


## Installation

Lightning Design System is available as an [npm package](https://www.npmjs.com/package/react-slds).

```bash
$ yarn add react-slds
```
 ##### or
 
```bash
$ npm install react-slds --save
```
 

## Usage

Here is a quick example to get you started, **it's all you need**:
```
import React from 'react';
import ReactDOM from 'react-dom';
import Button from 'react-slds/components/button';

function App() {
    return (
        <Button 
            label="Hello World!" 
            variant="brand" 
            onClick={() => alert('Hello World!')} 
        />
    );    
}

ReactDOM.render(
    <App />,
    document.getElementById('container')
);
```

Yes, it's really all you need to get started as you can see in this live and interactive demo:

[![Edit Button](https://codesandbox.io/static/img/play-codesandbox.svg)](https://codesandbox.io/s/52wqonrr44?from-embed)

## Running locally
1. git clone https://github.com/reiniergs/react-lightning-components.git
2. cd react-lightning-components
3. npm install
4. npm start
5. navigate to http://localhost:6060/

---
_Source: https://npm.io/package/react-slds · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._