Odigos UI Kit

This library contains directories shared across multiple Odigos UIs, available import paths are:

• components (re-usable and flexible)
• constants
• containers (logic based sections)
• contexts
• functions
• hooks
• icons
• snippets (re-usable but not flexible)
• store
• theme
• types
• visuals

Installation

Using npm:

npm i @odigos/ui-kit

Using yarn:

yarn add @odigos/ui-kit

Usage

Wrap your app with the theme provider:

import { ThemeProvider } from '@odigos/ui-kit/theme';

const AppProviders = () => {
  return (
    <ThemeProvider>
      <App />
    </ThemeProvider>
  );
};

Import anything else you'd need:

import { useTheme } from 'styled-components';
import { opacity } from '@odigos/ui-kit/theme';
import { Text } from '@odigos/ui-kit/components';
import { useDarkMode } from '@odigos/ui-kit/store';
import { ToggleDarkMode } from '@odigos/ui-kit/containers';

const App = () => {
  const { darkMode } = useDarkMode();

  return (
    <div>
      <ToggleDarkMode />
      <Text>{darkMode ? 'it is dark in here' : 'it is light in here'}</Text>
    </div>
  );
};