@visualteams/ui-kit NPM

VisualTeams

@visualteams/ui-kit

UI components and theme for VisualTeams Plugins

Installation

yarn add @visualteams/ui-kit

Usage

Colors

The UI-Kit export all colors used in the VisualTeams App

import COLORS from '@visualteams/ui-kit/colors'

const App = () => {
  return <div style={{ color: COLORS.primary }}>Welcome to the jungle !</div>
}

Color Name	Description
primary	Primary color of the App
secondary	Secondary color of the App
success	Indicate a success event, block, …
danger	Indicate an error, a warning, …

Material-ui theming

The UI-Kit export a Material-ui theme object which help you to use the same component design as the VisualTeams App

import { MuiThemeProvider } from "@material-ui/core/styles";
import { Button } from "@material-ui/core";

import theme from "@visualteams/ui-kit/theme";

const App = () => {
    return <MuiThemeProvider theme={theme}>
      <Button>Click me !</Button>
    </MuiThemeProvider>
}