To use Baukasten in your React project, install the following packages:

npm i @hygraph/baukasten @emotion/react @emotion/styled @fontsource/inter

After installation, you need to wrap your React application root with the BaukastenProvider component. Additionally, you should also import the Inter font stylesheet.

import * as React from 'react';

// 1. import `BaukastenProvider` component
import { BaukastenProvider } from '@hygraph/baukasten';

// 2. import Inter font stylesheet
import '@fontsource/inter/variable-full.css';

function App() {
  // 3. Wrap you app root with BaukastenProvider.
  return (
    <BaukastenProvider global>
      <YourApp />
    </BaukastenProvider>
  );
}