Huge News!Announcing our $40M Series B led by Abstract Ventures.Learn More
Socket
Sign inDemoInstall
Socket

@salesforce/design-system-react

Package Overview
Dependencies
Maintainers
47
Versions
99
Alerts
File Explorer

Advanced tools

Socket logo

Install Socket

Detect and block malicious and high-risk dependencies

Install

@salesforce/design-system-react

Salesforce Lightning Design System for React

  • 0.10.61
  • latest
  • Source
  • npm
  • Socket score

Version published
Weekly downloads
9.5K
increased by20.16%
Maintainers
47
Weekly downloads
 
Created
Source

Design System for React

Accessible, localization-friendly, presentational React components

Install

$ npm install @salesforce-ux/design-system @salesforce/design-system-react

Getting Started

Welcome to the project! :wave: This library is the React implementation of the Salesforce Lightning Design System. This library has a peer dependency on @salesforce-ux/design-system, react, and react-dom.

Quick Setup (CommonJS)

A CommonJS-compatible version has been included within the NPM package to allows usage without transpiling. Use the following named import syntax to access CommonJS components from /lib/index.js:

import { Button } from '@salesforce/design-system-react';

<Button label="Hello Button" />

Recommended usage requires that your babel presets are set up correctly. create-react-app and environments that do not transpile code within node_modules are not compatible with the component import below. All the examples on the documentation site use this syntax. You can use the Babel preset, @salesforce/babel-preset-design-system-react, to get started. This preset will keep Babel compatible with Design System React and allow ES6 module benefits such as tree-shaking.

import Button from '@salesforce/design-system-react/components/button';

<Button label="Hello Button" />
Transpile with .babelrc settings
{
  "presets": ["@salesforce/babel-preset-design-system-react"]
}

Licenses

Got feedback?

If you have support questions, please post a question to StackOverflow and tag with design-system-react. If you find any bugs, create a GitHub Issue.

Keywords

FAQs

Package last updated on 25 Sep 2024

Did you know?

Socket

Socket for GitHub automatically highlights issues in each pull request and monitors the health of all your open source dependencies. Discover the contents of your packages and block harmful activity before you install or update your dependencies.

Install

Related posts

SocketSocket SOC 2 Logo

Product

  • Package Alerts
  • Integrations
  • Docs
  • Pricing
  • FAQ
  • Roadmap
  • Changelog

Packages

npm

Stay in touch

Get open source security insights delivered straight into your inbox.


  • Terms
  • Privacy
  • Security

Made with ⚡️ by Socket Inc