docs: Kitchen Design Copilot + Dev-only Design System Page RFC 추가

[RaptBliss]

요약

• 에이전트 코딩 환경에서 디자인 시스템 자동 구축/유지 흐름을 위한 RFC 문서를 추가했습니다.
• 문서 경로: docs/plans/20_kitchen_design_copilot_rfc.md

포함 내용

• Design Registry / Rule Engine / Auto-Fix / Agent Watch 구조
• Kitchen DevTool 탭 설계 (Design Health, Registry, Proposals, Watch)
• Dev-only 디자인 시스템 페이지(/__mandu/design-system) 설계
• 승인형 패치 적용 정책(자동 반영 금지)
• 규칙셋, 데이터 모델, CI 연계(check --design) 초안
• 단계별 로드맵, KPI, 리스크, Exit Criteria

기대 효과

• 코드가 늘어날수록 디자인 시스템 품질이 자동 강화되는 운영 체계 구축
• 누락 상태(empty/hover/loading/error 등) 조기 탐지 및 보완
• Dev 환경에서 실행 가능한 디자인 시스템 문서/프리뷰 제공

[coderabbitai]

Warning

Rate limit exceeded

@konamgil has exceeded the limit for the number of commits that can be reviewed per hour. Please wait 29 minutes and 57 seconds before requesting another review.

⌛ How to resolve this issue?

After the wait time has elapsed, a review can be triggered using the @coderabbitai review command as a PR comment. Alternatively, push new commits to this PR.

We recommend that you space out your commits to avoid hitting the rate limit.

🚦 How do rate limits work?

CodeRabbit enforces hourly rate limits for each developer per organization.

Our paid plans have higher rate limits than the trial, open-source and free plans. In all cases, we re-allow further reviews after a brief timeout.

Please see our FAQ for further information.

📥 Commits

Reviewing files that changed from the base of the PR and between 4f8a0ae and d8f2536.

📒 Files selected for processing (1)

• docs/plans/20_kitchen_design_copilot_rfc.md

✨ Finishing Touches

🧪 Generate unit tests (beta)

• Create PR with unit tests
• Post copyable unit tests in a comment
• Commit unit tests in branch docs/kitchen-design-copilot-rfc

---

Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out.

❤️ Share

• X
• Mastodon
• Reddit
• LinkedIn

_{Comment @coderabbitai help to get the list of available commands and usage tips.}

[gemini-code-assist]

Summary of Changes

Hello @RaptBliss, I'm Gemini Code Assist¹! I'm currently reviewing this pull request and will post my feedback shortly. In the meantime, here's a summary to help you and other reviewers quickly get up to speed!

이 PR은 에이전트 기반 코딩 환경에서 디자인 시스템의 품질을 자동으로 강화하고 유지하기 위한 'Mandu Kitchen Design Copilot' RFC 문서를 도입합니다. 이 문서는 디자인 시스템의 자동 구축 및 유지 관리 흐름을 위한 포괄적인 계획을 제시하며, 개발자가 코드를 작성하는 동안 디자인 일관성을 유지하고 잠재적인 문제를 조기에 발견할 수 있도록 돕는 것을 목표로 합니다. Kitchen DevTool에 통합될 Design Copilot와 개발 전용 디자인 시스템 페이지를 통해 개발 경험을 개선하고 디자인 시스템의 적용률을 높이는 데 중점을 둡니다.

Highlights

• RFC 문서 추가: 에이전트 코딩 환경에서 디자인 시스템의 자동 구축 및 유지 관리를 위한 RFC 문서를 추가했습니다.
• Design Copilot 핵심 요소 정의: Design Registry, Rule Engine, Auto-Fix Proposal, Agent Watch, Dev-only Design System Page를 포함한 Kitchen DevTool의 Design Copilot 핵심 5요소를 제안했습니다.
• DevTool 탭 및 Dev-only 디자인 시스템 페이지 설계: Design Health, Component Registry, Auto-Fix Proposals, Agent Watch 탭과 /__mandu/design-system 경로의 개발 전용 디자인 시스템 페이지 구조를 상세히 설명했습니다.
• 승인형 패치 정책: 자동 코드 반영을 금지하고 모든 패치는 사용자 승인 후 적용되는 정책을 명시했습니다.
• 규칙셋, 데이터 모델, CI 연계 초안: 초기 규칙 엔진, design-registry.json, design-rules.json, design-health-report.json 데이터 모델, 그리고 mandu check --design을 통한 CI 연계 방안을 제시했습니다.
• 로드맵, KPI, 리스크 및 Exit Criteria: Design Copilot의 단계별 로드맵, 핵심 성과 지표(KPI), 예상 리스크 및 대응 방안, 그리고 1차 완료를 위한 Exit Criteria를 정의했습니다.

Changelog

• docs/plans/20_kitchen_design_copilot_rfc.md
  • Mandu Kitchen Design Copilot RFC 문서가 추가되었습니다.
  • 문제 정의, 제안 요약, 제품 구조, DevTool 세부 탭, Dev-only 디자인 시스템 페이지, 규칙 엔진, 데이터 모델, 승인형 실행 정책, CI/검증 연계, 단계별 로드맵, KPI, 리스크 및 Exit Criteria에 대한 내용이 포함되었습니다.

Using Gemini Code Assist

The full guide for Gemini Code Assist can be found on our documentation page, here are some quick tips.

Invoking Gemini

You can request assistance from Gemini at any point by creating a comment using either /gemini <command> or @gemini-code-assist <command>. Below is a summary of the supported commands on the current page.

Feature	Command	Description
Code Review	/gemini review	Performs a code review for the current pull request in its current state.
Pull Request Summary	/gemini summary	Provides a summary of the current pull request in its current state.
Comment	@gemini-code-assist	Responds in comments when explicitly tagged, both in pull request comments and review comments.
Help	/gemini help	Displays a list of available commands.

Customization

To customize Gemini Code Assist for GitHub experience, repository maintainers can create a configuration file and/or provide a custom code review style guide (such as PEP-8 for Python) by creating and adding files to a .gemini/ folder in the base of the repository. Detailed instructions can be found here.

Limitations & Feedback

Gemini Code Assist may make mistakes. Please leave feedback on any instances where its feedback is incorrect or counter productive. You can react with 👍 and 👎 on @gemini-code-assist comments. If you're interested in giving your feedback about your experience with Gemini Code Assist for Github and other Google products, sign up here.

You can also get AI-powered code generation, chat, as well as code reviews directly in the IDE at no cost with the Gemini Code Assist IDE Extension.

Footnotes

1. Review the Privacy Notices, Generative AI Prohibited Use Policy, Terms of Service, and learn how to configure Gemini Code Assist in GitHub here. Gemini can make mistakes, so double check it and use code with caution. ↩

[gemini-code-assist]

Code Review

이 PR은 'Kitchen Design Copilot' 기능에 대한 RFC(의견 수렴 요청) 문서를 추가합니다. 문서는 체계적으로 작성되었으며, 디자인 시스템의 일관성과 품질을 개선하기 위한 포괄적인 해결책을 제안하고 있습니다. Design Registry, Rule Engine, 개발 전용 라이브 디자인 시스템 페이지와 같은 제안된 기능들이 매우 기대됩니다. RFC의 일부 구현 세부 사항, 특히 규칙 엔진의 구체성, 컴포넌트 인덱싱 메커니즘, 컴포넌트 상태 프리뷰 방식에 대해 더 명확히 할 수 있는 몇 가지 제안 사항을 코멘트로 남겼습니다.

[gemini-code-assist]

모든 컴포넌트 상태를 시각화하는 State Matrix 기능은 매우 유용해 보입니다. loading, empty, error와 같이 props로 제어되는 상태들을 어떻게 렌더링할 계획인지 궁금합니다. State Matrix가 자동으로 작동하려면 컴포넌트가 특정 props 규칙(예: isLoading, items, error 등)을 따라야 하나요? 이 규칙이나 메커니즘을 RFC에 명시하면, 이 도구와 호환되는 컴포넌트를 만들거나 업데이트해야 하는 개발자들에게 큰 도움이 될 것입니다.

[gemini-code-assist]

'클릭 가능한 div 경고' 규칙은 접근성 향상을 위한 좋은 시작점입니다. 이 규칙을 더 구체화하여 실행 가능한 제안을 제공하면 좋을 것 같습니다. 예를 들어, onClick 핸들러는 있지만 role="button"이나 tabIndex="0" 같은 적절한 ARIA 속성이 없는 div에 대해 경고하는 것을 제안합니다. 그리고 해결책으로 올바른 ARIA 속성을 추가하거나, 더 나아가 시맨틱한 <button> 요소로 대체하도록 안내할 수 있습니다. 이렇게 하면 개발자가 문제를 더 명확하게 해결할 수 있을 것입니다.

[gemini-code-assist]

design-registry.json에 컴포넌트를 자동으로 인덱싱하는 기능은 이 시스템의 핵심입니다. 인덱싱이 어떤 방식으로 동작할지에 대한 간략한 설명이 추가되면 RFC가 더 명확해질 것 같습니다. 예를 들어, 컴포넌트를 어떻게 식별하는지(파일/폴더 규칙, 특정 export 명명 규칙 등), 그리고 '유사 컴포넌트'는 어떤 기준으로 탐지하는지(AST 분석, 구조적 해싱 등)에 대한 내용이 포함되면 좋겠습니다. 이러한 '어떻게'에 대한 설명은 제안을 더 견고하게 만들고 구현 시 발생할 수 있는 문제를 예측하는 데 도움이 될 것입니다.