- In your React project, install dependency:
If you're using yarn:
yarn add @interchain-ui/react
If you're using npm:
npm i @interchain-ui/react
- Setting up your root layout/ route:
- import the css stylesheet into your root layout:
// This is a global CSS reset, optional
import '@interchain-ui/react/globalStyles';
// This is all components styles
import '@interchain-ui/react/styles';
- wrap the root layout with our
ThemeProvider
and attach the theming class to a container:
import { ThemeProvider, useTheme } from '@interchain-ui/react';
const MyRootLayout = (props) => {
const { theme, themeClass, setTheme } = useTheme();
return (
<ThemeProvider>
<main className={themeClass}>
{props.children}
</main>
</ThemeProvider>
);
};
- You can start to use our components at this point. All components are in: https://interchain-storybook-static.surge.sh/
We will frequently update this page and a nicer components explorer is on the way! Any questions let me know.
This is looking great, are there any limitations integrating this with nextjs 14? It would be awesome to get some examples.