UI Kit of Zignaly.
If you're working on the Zignaly momnorepo, you already are using it.
If you're using it on an outside project... OK let's get started.
This library expects these peer dependencies:
"react": "18.2.0",
"react-dom": "18.2.0",
"@types/react": "18.0.35",
"@types/react-dom": "18.0.11",
(duh)
"react-i18next": "14.0.1",
"i18next": "23.8.1",
for components with translations (ZigInputAmount
, ZigImageInput
, ZigFilters
, ZigTable
, ZigRisk
, ZScoreRing
, ZigSearch
and ZModal
)
"react-router-dom": "6.22.3"
for the ZigMenu
and ZigSubHeader
components
"@emotion/react": "11.9.3",
"@emotion/styled": "11.9.3",
for styled components.
yarn add @zignaly-open/ui
You probably won't be able to claim @zignaly-open/ui
as a dependent on your tax returns but you still have tpo provide for it.
import { ThemeProvider, getZignalyThemeExport } from '@zignaly-open/ui';
import { addZignalyUiResources } from '@zignaly-open/ui/i18n';
import i18n from './your/i18next';
// adds the translationsdefined in zignaly-ui to your i18next instance as resources
addZignalyUiResources(i18n);
// create the base theme
const mui = getZignalyThemeExport('dark');
export default () => {
return (
<ThemeProvider theme={mui}>
<I18nextProvider i18n={i18n}>
<YourAppGoesHere />
</I18nextProvider>
</ThemeProvider>
);
};