UI-Capsules - React UI Kit 👷‍♂💊🚧 wip️

$3

**This library is a breakable toy. New versions will often contain breaking
changes, even for non-major releases.**

---

React UI kit.

The Components demo (wip) can be visited here.

Install

UI-Capsules is available at npm. To add it to your app run:

``
npm i @binarycapsule/ui-capsules
`

The following peer dependencies should also be installed:

`
npm i react@17 react-dom@17 styled-components@6
`

Setup

Wrap your application with UiCaps:

`jsx
import React from 'react';
import ReactDOM from 'react-dom';
import { UiCaps } from '@binarycapsule/ui-capsules';
import { App } from './App.tsx';

ReactDOM.render(




,
document.getElementById('root'),
);
`

Usage

Please refer to the Components demo to get
further instructions on how to use each component.

$3

To toggle dark theme, use the useUiCapsContext hook:

`jsx
import React from 'react';
import { IconButton, useUiCapsContext } from '@binarycapsule/ui-capsules';

const App = () => {
const { isDarkTheme, setTheme } = useUiCapsContext();

return (
icon={isDarkTheme ? 'moon' : 'sun'}
variant="ghostGray"
onClick={() => setTheme(isDarkTheme ? 'light' : 'dark')}
aria-label="Change theme"
/>
);
};
``

Licensing

Licensed under the MIT License.