@kakadu/components
v1.6.5
Published
Kakadu components library
Maintainers
thomaslindstr_mReadme
Kakadu Components
Storybook
View the online component Storybook in Chromatic here.
Installation
First, install the package via npm:
npm install @kakadu/componentsNext, import the base stylesheet and the ThemeSetter in your application’s entry point (for example _app.tsx). For notifications to work, you’ll also need the NotificationProvider.
import React from 'react';
import {type AppProps} from 'next/app';
import {ThemeSetter} from '@kakadu/components';
import '@kakadu/components/components.css';
export default function App({Component, pageProps}: AppProps) {
return (
<>
<ThemeSetter />
<NotificationProvider>
<Component {...pageProps} />
</NotificationProvider>
</>
);
}Then, in your _document.tsx (or equivalent), import the theme class name and the FontFamilyHead:
import React from 'react';
import Document, {Html, Head, Main, NextScript} from 'next/document';
import {theme, FontFamilyHead} from '@kakadu/components';
export default class CustomDocument extends Document {
render() {
return (
<Html suppressHydrationWarning className={theme}>
<Head>
<FontFamilyHead />
</Head>
<body>
<Main />
<NextScript />
</body>
</Html>
);
}
}Development
Storybook
To run Storybook locally:
npm run storybookOnce started, open http://localhost:6006 in your browser.
Publishing and release
- Commit your changes.
- Depending on the changeset, run
npm version major|minor|patch. - Run
npm publish.