Installation

Vibrant UI는 현재 웹(React DOM)과 네이티브(React Native)를 지원합니다.

Web

Install Library

npm

npm install @vibrant-ui/components @vibrant-ui/core

Yarn

yarn add @vibrant-ui/components @vibrant-ui/core

Configure VibrantProvider for Web

App.tsx

import { VibrantProvider } from '@vibrant-ui/core';

// react entrypoint
const App = ({ children }) => {
  return <VibrantProvider>{children}</VibrantProvider>;
};

React Native

Install Library

웹과 동일한 라이브러리를 사용합니다

npm

npm install @vibrant-ui/components @vibrant-ui/core

Yarn

yarn add @vibrant-ui/components @vibrant-ui/core

Configure VibrantProvider for Native

App.tsx

import {
  VibrantProvider,
  createShadowsComponent,
} from '@vibrant-ui/core';
import type { Dependencies } from '@vibrant-ui/core';

import * as ReactSpringNative from '@react-spring/native';
import { Shadow } from 'react-native-shadow-2';
import { LinearGradient } from 'expo-linear-gradient';

const dependencies: Dependencies = {
  reactSpringModule: ReactSpringNative,
  nativeShadows: createShadowsComponent(Shadow),
  nativeLinearGradient: LinearGradient,
};

const App = ({ children }) => {
  return (
    <VibrantProvider dependencies={dependencies}>
      {children}
    </VibrantProvider>
  );
};