Pulsar is a library of [React](https://reactjs.org/) components built with
[styled-components](https://www.styled-components.com/).
## Getting started
1. Install this library with:
```bash
yarn add @swingby-protocol/pulsar react-spring styled-components polished
yarn add --dev @types/styled-components
```
2. Use `` with no props at the root of your app so that you get automatic
theme switching out of the box. Optionally, you may also use ``.
```tsx
import React from 'react';
import {
PulsarThemeProvider,
Button,
PulsarGlobalStyles,
PulsarToastContainer,
} from '@swingby-protocol/pulsar';
export const MyApp = () => {
return (
{/* Optional, to load the Inter font with `next/head`, `react-helmet`, etc. */}
{/* Optional */}
My cool app
{/* Put this somewhere near the root of your app if you are going to use toasts */}
);
};
```
If you are using Next.js, you should probably use `` in your `_app.tsx`
file.
### TypeScrip integration
Add a definitions file like the following anywhere in your project.
```tsx
// DefaultTheme.d.ts
import 'styled-components';
import { PulsarThemeProvider } from '@swingby-protocol/pulsar';
declare module 'styled-components' {
export interface DefaultTheme extends PulsarThemeProvider {}
}
```
