KRDS 작업 계획

KRDS 작업 계획

1. Token Foundation

• packages/ui/src/tokens/design-tokens.ts에 KRDS source, primitive, semantic, mode, responsive 값을 둔다.
• packages/ui/src/styles/global.css에서 KRDS semantic token을 shadcn CSS 변수로 연결한다.
• 검증: KRDS/Foundation/Tokens Storybook story에서 light와 high contrast 값을 확인한다.

2. Component Token Adapter

• Button, Input, Select, Card, Dialog, Tooltip에 KRDS component token을 연결한다.
• Radix primitive 구조와 기존 public export는 유지한다.
• 검증: 각 컴포넌트 Storybook story에서 기본, disabled, invalid, open overlay, high contrast 상태를 확인한다.

3. Documentation

• vault/public/design-system/08-krds를 KRDS 운영 문서 위치로 사용한다.
• pnpm sync:content로 Astro 문서에 동기화한다.
• 검증: Astro의 design-system/08-krds/* 경로에서 문서가 렌더링되는지 확인한다.

4. Review Loop

• 컴포넌트 적용 현황은 KRDS/Overview/Adoption Matrix와 이 문서의 적용 현황 페이지를 함께 갱신한다.
• 새 컴포넌트를 KRDS에 맞출 때는 토큰 매핑, Storybook story, 적용 현황을 함께 수정한다.