Package Exports

react-figma-plugin-ds
react-figma-plugin-ds/figma-plugin-ds.css

This package does not declare an exports field, so the exports above have been automatically detected and optimized by JSPM instead. If any package subpath is missing, it is recommended to post an issue to the original package (react-figma-plugin-ds) to support the "exports" field. If that is not possible, create a JSPM override to customize the exports field for this package.

Readme

react-figma-plugin-ds

React components of Figma design system based on thomas-lowry/figma-plugin-ds, and implements UI2: Figma Design System.

DEMO HERE

🚀 Get Started

Follow these steps to start using React Figma components:

Installation:

# with npm
npm i react-figma-plugin-ds

# with yarn
yarn add react-figma-plugin-ds

Usage:

import React from "react";
import { Disclosure, Tip, Title, Checkbox, Button } from "react-figma-plugin-ds";
import "react-figma-plugin-ds/figma-plugin-ds.css";

export default (props) => {
  return (
    <>
      <Title size="large" weight="bold">
        My plugin
      </Title>

      <Disclosure label="Getting started" isDefaultExpanded>
        <Tip iconName="resolve">Install</Tip>
        <Tip iconName="play">Start</Tip>
        <Tip iconName="library">Read the docs</Tip>
      </Disclosure>

      <Checkbox label="I promise to star this repo!" />

      <Button>Start</Button>
    </>
  );
};

Discover all components with properties on demo page. Each of that has playground and as result in top right corner you can easily copy final code.

📝 License

MIT