소개
OpenIoT Design System 은 OpenIoT 의 모든 Next.js 제품이 공유하는 토큰·컴포넌트 라이브러리예요. private npm 패키지로 배포돼요.
패키지 구성
| Prop | Type | Default | 설명 |
|---|---|---|---|
| @openiot/tokens | CSS + JS | Tailwind v4 | 디자인 토큰(@theme) · 다크 모드 · JS 미러 |
| @openiot/ui | React | shadcn/Radix | Button · Badge · Input · Dialog |
| @openiot/utils | TS | — | cn() · useDisclosure · useMediaQuery |
| @openiot/icons | React | Figma | 커스텀 아이콘 152종 · lucide 래퍼 · 브랜드 로고 |
스택
- Next.js 16 (App Router) · React 19 · TypeScript 5.9
- Tailwind v4 (@theme CSS-first) · tsdown 언번들 빌드('use client' 보존)
- Changesets + GitHub Packages 로 버전·배포 관리 (Node 22)
다음 단계
설치와 Tailwind 연결은 설치 가이드에서, 사용 가능한 컴포넌트는 컴포넌트 페이지에서 확인하세요.