docs: improve CLAUDE.md structure with modular rules system#598
docs: improve CLAUDE.md structure with modular rules system#598MaxLee-dev wants to merge 10 commits into
Conversation
Co-Authored-By: Claude Sonnet 4.6 (1M context) <noreply@anthropic.com>
…ing, and documentation
|
The latest updates on your projects. Learn more about Vercel for GitHub.
|
|
|
No actionable comments were generated in the recent review. 🎉 ℹ️ Recent review info⚙️ Run configurationConfiguration used: Path: .coderabbit.yaml Review profile: CHILL Plan: Pro Run ID: 📒 Files selected for processing (1)
📝 WalkthroughWalkthroughThis pull request adds repository and package-specific Claude Code guidance, covering component APIs, Vanilla Extract styling, testing, TypeScript conventions, Storybook documentation, development workflows, and environment versions. ChangesComponent Development Standards for
Estimated code review effort: 2 (Simple) | ~12 minutes Possibly related PRs
🚥 Pre-merge checks | ✅ 4✅ Passed checks (4 passed)
✨ Finishing Touches🧪 Generate unit tests (beta)
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. Comment |
![coderabbitai[bot]](https://avatars.githubusercontent.com/in/347564?s=60&v=4){kind=small}
There was a problem hiding this comment.
Actionable comments posted: 7
🤖 Prompt for all review comments with AI agents
Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
Inline comments:
In @.claude/rules/component-api.md:
- Around line 14-21: The fenced code block showing the component folder
structure is missing a language tag and triggers markdownlint MD040; update the
block in component-api.md (the block with the lines listing
src/components/button/ etc.) to include a language identifier (for example use
```text or ```bash) immediately after the opening backticks so the fence is
labeled and MD040 is resolved.
In @.claude/rules/docs.md:
- Around line 16-20: The fenced code block showing the folder structure (the
block containing "src/components/button/" and its files) is unlabeled which
triggers markdownlint MD040; fix it by adding a language label after the opening
backticks (e.g., use "text" or "bash") so the block becomes a labeled fenced
code block and the lint rule is satisfied.
In @.claude/rules/styling.md:
- Around line 16-25: The markdown fenced code blocks shown (the block containing
the snippets for resolveStyles, cn, and BaseComponent) are missing language
tags; update those fenced blocks by adding an explicit language label (e.g.,
```text or ```markdown) so they pass MD040 linting—specifically edit the block
that documents resolveStyles, cn, and <BaseComponent .../> and the similar block
around lines 193–199 to prepend the appropriate language identifier.
In @.claude/rules/testing.md:
- Around line 66-70: The fenced code block showing the file tree
("src/components/button/" with "button.tsx" and "button.test.tsx") is missing a
language tag which triggers MD040; update the opening fence from ``` to include
a language (e.g., ```text or ```bash) so the block is language-qualified; ensure
the same fence content (the file tree) remains unchanged and commit the markdown
edit.
In `@CLAUDE.md`:
- Around line 88-90: Update the fenced code block containing "<type>(<scope>):
<subject>" to specify a language for markdownlint (MD040); change the opening
fence from ``` to ```text so the block reads as a text code block and resolves
the linter warning.
In `@packages/core/CLAUDE.md`:
- Around line 27-34: Several fenced code blocks in the CLAUDE.md file are
missing language identifiers (e.g., the block that starts with
"src/components/button/"); update each unlabeled fenced block by adding an
appropriate language tag (for example use ```text or ```bash for file
trees/terminal snippets, or ```tsx/```tsx for React code) so that the blocks
that contain the "src/components/button/" listing and the other unlabeled blocks
are annotated with the correct language identifier.
- Around line 15-19: Update the malformed rule file paths in CLAUDE.md by
replacing the incorrect `@.claude/...` prefixes with the repo-conventional
`.claude/...` versions (e.g. change `@.claude/rules/component-api.md`,
`@.claude/rules/styling.md`, `@.claude/rules/typescript.md`,
`@.claude/rules/testing.md`, `@.claude/rules/docs.md` to
`.claude/rules/component-api.md`, `.claude/rules/styling.md`,
`.claude/rules/typescript.md`, `.claude/rules/testing.md`,
`.claude/rules/docs.md`) so the links match the actual `.claude/rules/`
directory at the repo root.
🪄 Autofix (Beta)
Fix all unresolved CodeRabbit comments on this PR:
- Push a commit to this branch (recommended)
- Create a new PR with the fixes
ℹ️ Review info
⚙️ Run configuration
Configuration used: Path: .coderabbit.yaml
Review profile: CHILL
Plan: Pro
Run ID: be792c6b-b5b7-469e-854b-f74a86305352
📒 Files selected for processing (7)
.claude/rules/component-api.md.claude/rules/docs.md.claude/rules/styling.md.claude/rules/testing.md.claude/rules/typescript.mdCLAUDE.mdpackages/core/CLAUDE.md
|
✅ All tests passed!
Click here if you need to update snapshots. |
Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
Add language tags to fenced code blocks (MD040) across CLAUDE.md and .claude/rules/* files. Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
… interface detail Co-Authored-By: Claude Sonnet 4.6 (1M context) <noreply@anthropic.com>
…rove-claude-md
…rove-claude-md
- unify @vapor-ui/core component count (34+ → 40+) across root and core - soften axe coverage claims to "required for new, backfilling existing" - update website toolchain versions to match root packageManager/.nvmrc - document Dialog layout-convenience parts (Header/Body/Footer) Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
|
@coderabbitai review |
|
@coderabbitai review |
✅ Action performedReview finished.
|
| Constants use `CONSTANT_CASE` with `as const`: | ||
|
|
||
| ```ts | ||
| const MAX_RETRY_COUNT = 3 as const; | ||
| ``` |
There was a problem hiding this comment.
What do you think about applying as const only when the constant is an object type? Since primitive values already have sufficiently narrowed types, it feels like we don’t really need to specify as const for them!
| ## Imports | ||
|
|
||
| Namespace import aliases use `lowerCamelCase`: | ||
|
|
||
| ```ts | ||
| // ✅ | ||
| import * as fooBar from './foo-bar'; | ||
| // ❌ | ||
| import * as FooBar from './foo-bar'; | ||
| ``` |
There was a problem hiding this comment.
Since there are cases where components are imported using a namespace pattern, how about removing this convention?
| import * as FooBar from './foo-bar'; | ||
| ``` | ||
|
|
||
| ## Coding Style |
There was a problem hiding this comment.
This seems to be related to code conventions—is there a particular reason you added it to the typescript.md document?
There was a problem hiding this comment.
It seems this was already in the TypeScript section when I was moving this over. Since it didn't seem necessary for this particular typescript.md file, I deleted it.!
…rove-claude-md
- as const는 객체 상수에만 적용 (primitive는 이미 리터럴 타입으로 추론됨) - namespace import lowerCamelCase 규칙 제거 (React, Dialog 등 PascalCase 관례와 모순) - Coding Style 섹션 제거 (포매팅은 Prettier가 강제) Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
3 participants
Summary
Why
The previous `packages/core/CLAUDE.md` was essentially a translated copy of `.gemini/styleguide.md` — it mixed generic coding conventions with package-specific rules, had no root-level CLAUDE.md, and lacked the architectural context Claude Code needs most (compound component patterns, RSC-safe export structure, Vanilla Extract styling primitives). This led to repeated mistakes such as using `Object.assign` for compound exports, hard-coded style values, and incorrect prop types.
The new structure separates concerns:
Key decisions documented
Summary by CodeRabbit
Release Notes