Have ideas to improve npm?Join in the discussion! »

    react-lightning-design-system
    TypeScript icon, indicating that this package has built-in type declarations

    4.3.3 • Public • Published

    React Lightning Design System

    Build Status

    Salesforce Lightning Design System components built with React.

    See the demo.

    Install

    $ npm install react-lightning-design-system
    

    Example

    import React from 'react';
    import ReactDOM from 'react-dom';
    import { Button } from 'react-lightning-design-system';
    
    function click() { alert('Clicked'); }
    
    ReactDOM.render(
      <div>
        <Button onClick={ click }>Simple</Button>
        <Button type='neutral' onClick={ click }>Neutral</Button>
        <Button type='brand' onClick={ click }>Brand</Button>
        <Button type='neutral' icon='download' iconAlign='left' onClick={ click }>Icon #1</Button>
        <Button type='neutral' disabled>Disabled Neutral</Button>
        <Button type='brand' disabled>Disabled Brand</Button>
      </div>
    , document.body);

    See more examples in examples directory.

    Running example stories locally

    This repo ships with a react storybook based story scripts. To run stories and get component examples, follow these steps:

    1. run npm install
    2. run npm run storybook
    3. Find the stories running on localhost:9001.

    Snapshot testing in react storybook

    This repo ships with story snapshots to examine differences in rendering as a result of changes to source code.

    To identify render differences run npm run test:storyshots. If all changes are intentional run npm run test:storyshots -- -u. To learn about other run options including interactive mode, read Snapshot Testing in React Storybook

    Install

    npm i react-lightning-design-system

    DownloadsWeekly Downloads

    210

    Version

    4.3.3

    License

    MIT

    Unpacked Size

    1.6 MB

    Total Files

    250

    Last publish

    Collaborators

    • avatar