UI kit
npm install @binarycapsule/ui-capsules
**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.
![]() | ![]() |
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
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'),
);
`
Please refer to the Components demo to get
further instructions on how to use each component.
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 (
variant="ghostGray"
onClick={() => setTheme(isDarkTheme ? 'light' : 'dark')}
aria-label="Change theme"
/>
);
};
``
Licensed under the MIT License.