Reusable React components that adhere to Einride's design system.
Einride UI consists of these packages:
@einride/ui
: Core UI components.@einride/ui-dates
: Date components.@einride/ui-labs
: Experimental components that are not yet added to@einride/ui
.@einride/ui-maps
: Mapping components.
Install @einride/ui
together with its peer dependencies:
yarn add @einride/ui @emotion/react @emotion/styled framer-motion
Install the other packages depending on your requirements.
<EinrideProvider>
needs to wrap all @einride/ui components. The provider sets up the theme and
color schemes. It's common to put it in the <App>
component in the top of the component tree.
import { EinrideProvider } from "@einride/ui"
export const App = (): React.JSX.Element => {
return <EinrideProvider>{/* All @einride/ui components go here! */}</EinrideProvider>
}
See Contributing Guide.
All currently available components are documented in our Storybook.
MIT