Backoffice UI

React components based on Material Design. edekadigital.github.io/backoffice-ui

Usage

1. Install

npm i -S @edekadigital/backoffice-ui

2. Load "Roboto" font

<link
  rel="stylesheet"
  href="https://fonts.googleapis.com/css?family=Roboto:300,400,500"
/>

3. Render BackofficeUiProvider

import { BackofficeUiProvider } from '@edekadigital/backoffice-ui';

export const App = () => (
  <BackofficeUiProvider>
    <SomeComponent />
    {/* ... */}
  </BackofficeUiProvider>
);

4. Use components

import { Button } from '@edekadigital/backoffice-ui';

export const SomeComponent = () => (
  <>
    {/* ... */}
    <Button>Some label</Button>
  </>
);

Development

Commands

| Command | Description | | -------------------------- | ------------------------------------------------- | | npm run storybook | Start development mode (Storybook) | | npm run build-storybook | Export storybook into a static web app | | npm run build | Build library (cjs + es6) | | npm run test, npm test | Run tests (TODO) | | npm run check | Checks code for formatting and lint issues | | npm run fix | Fixes formatting and linting issues (if possible) | | npm run clean | Removes all files generated by the build |

Resources

• React
• Storybook