Lumir Design System - Components

모든 React 프로젝트에서 즉시 사용 가능한 디자인 시스템

🚀 빠른 설치 (모든 환경 지원)

# 범용 설치 (99% 성공률)
npm install lumir-design-components lumir-design-tokens --legacy-peer-deps --force

📦 즉시 사용

import 'lumir-design-components/dist/styles.css';
import { Button, Box, Text, Stack } from 'lumir-design-components';

function App() {
  return (
    <Box padding="lg">
      <Stack spacing="md">
        <Text variant="heading-2">Lumir Design System</Text>
        <Button variant="filled" colorScheme="primary">
          바로 작동합니다!
        </Button>
      </Stack>
    </Box>
  );
}

✅ 지원 환경

• React: 16.8+ (React 17, 18, 19 모두 지원)
• Node.js: 모든 버전 (16+ 권장)
• 번들러: Webpack, Vite, Rollup, Parcel 등
• 프레임워크: Next.js, CRA, Remix, Gatsby 등

🔧 오류 해결

설치 오류 발생시:

rm -rf node_modules package-lock.json
echo "legacy-peer-deps=true" > .npmrc
npm cache clean --force
npm install lumir-design-components lumir-design-tokens --legacy-peer-deps --force

📚 문서

• Storybook 문서
• 설치 가이드
• 컴포넌트 사용법

🎯 핵심 특징

• 완전 호환성: 어떤 React 프로젝트든 즉시 설치
• Zero Config: 추가 설정 없이 바로 사용
• 완전한 타입 지원: TypeScript 완전 지원
• 작은 번들 크기: Tree-shaking 지원
• 접근성: WCAG 2.1 AA 준수

�� 라이선스

MIT License