A multiplatform React-based design system inspired by GitHub Primer.
Dulplicate Community File Demo Figma document
- Web (Storybook React):
yarn storybook:web - iOS simulator (Storybook React Native):
yarn storybook:ios - Figma plugin (React Figma):
yarn figma:webpack:watch
βββ .storybook - @storybook/react configuration
βββ .storybook-native - @storybook/react-native configuration
βββ android - gradle project for React Native app
βββ assets - React Native app assets
βββ ios - iOS project for React Native app
βββ src
β βββ components
| βββ fonts - fonts for web
| βββ frames - frames for displaying through React Figma
| βββ helpers - frames for displaying through React Figma
| βββ hooks - React Hooks
| βββ styles - global styles for web
| βββ tokens - design system tokens (colors, spacing, etc.)
| βββ wrappers - universal wrappers for base UI elements (buttons, images, etc.)
β βββ App.tsx - React Figma app
β βββ code.tsx - entty point for Figma plugin Main-thead
β βββ ui.html - entty point for Figma plugin UI-thead
β βββ ui.tsx
βββ app.json - react-native config file
βββ babel.config.js - babel config for react-native
βββ figma.d.ts - figma plugin typings
βββ figma.webpack.confgi.js - Webpack config for react-figma
βββ manifest.json - Figma plugin manifest
βββ metro.config.js - config for Metro bundler
βββ now.json - config for Zeit Now
βββ package.json
βββ tsconfig.json
βββ yarn.lock