React Native용 완성도 높은 UI 컴포넌트 라이브러리 및 디자인 시스템 구축 도구

npm install react-native-ui-lib

import {Colors, Typography, Spacings} from 'react-native-ui-lib';

Colors.loadColors({
  primaryColor: '#2364AA',
  secondaryColor: '#81C3D7',
  textColor: '#221D23',
  errorColor: '#E63B2E',
  successColor: '#ADC76F',
  warnColor: '#FF963C'
});

Typography.loadTypographies({
  heading: {fontSize: 36, fontWeight: '600'},
  subheading: {fontSize: 28, fontWeight: '500'},
  body: {fontSize: 18, fontWeight: '400'}
});

Spacings.loadSpacings({
  page: 20,
  card: 12,
  gridGutter: 16
});

import {ThemeManager} from 'react-native-ui-lib';

ThemeManager.setComponentTheme('Card', {
  borderRadius: 8
});

import {View, Text, Card, Button} from 'react-native-ui-lib';

export default function MyScreen() {
  return (
    <View flex padding-page>
      <Text heading marginB-s4>My Screen</Text>
      <Card height={100} center padding-card marginB-s4>
        <Text body>This is an example card</Text>
      </Card>
      <Button label="Button" body bg-primaryColor></Button>
    </View>
  );
}