Skip to content

Dev Setup

Get set up using Nebula in your app.

Installation

Start by making sure you have an npm token from the @ovotech npm org.

Or if you prefer:

You'll also need to ensure the following peerDependencies are installed:

  • react
  • react-native (for react native components)
  • react-native-svg (for react native components)
  • react-native-picker-select (for react native components)
  • styled-components
  • @react-aria/dialog (for modal component)
  • @react-aria/focus (for modal component)
  • @react-aria/overlays (for modal component)

Theming

Nebula uses styled-components (opens in new window)  and it is necessary to provide a theme which you can import from @ovotech/nebula.

This can be done using styled-component's <ThemeProvider> at the root of the app.

See Theming for more information.

Using the components

CSS Reset

When using them on the web, the design system components rely on global styles to provide a CSS reset (opens in new window) 

We export one of these which uses sensible defaults and can be found here: