@maiertech/components v0.24.0

title: '@maiertech/components'

Package @maiertech/components is a library of React components built with Theme UI.

Install

Run

yarn add @maiertech/components

to add it to your dependencies. Install peer dependencies react, react-dom and theme-ui.

You need to wrap your app with ThemeProvider from theme-ui. You can provide a theme, e.g., @maiertech/preset):

import { ThemeProvider } from 'theme-ui';
import preset from '@maiertech/preset';

const app = (
  <ThemeProvider theme={preset}>
    <App />
  </ThemeProvider>
);

The preset should not make any changes to to breakpoints, which are Styled System's default breakpoints ['40em', '52em', '64em'].

Import components like this:

import { PostPreview, Tags } from '@maiertech/components';

Docs

Read the docs at https://design-system.maier.tech/components. You can run the docs locally with

yarn workspace docs run dev

Contributing

Work with two terminals. In the first terminal run

yarn workspace @undataforum/components run watch

and in the second terminal run

yarn workspace docs run dev

The first command watches for changes in the @maiertech/components workspace and bundles the @maiertech/components package whenever it detects changes. The second command launches the docs, which use the local @maiertech/components package as dependency.