Modernize shadcn/ui components (data-slot + ref-as-prop) & improve example sidebar - #125
Merged
Merged
Conversation
The shadcn registry/CLI is unreachable from this environment, so the components were brought up to the latest shadcn conventions by hand. - Convert all 40 forwardRef UI components to plain function components using React 19's ref-as-prop, and add data-slot attributes throughout (drops React.ElementRef/ComponentPropsWithoutRef + displayName boilerplate). Classes, cva variants, exports and behavior are preserved (incl. the custom Sheet size variant and the recharts-v3 chart types). - Fix pagination to use React.ComponentProps<typeof Button> now that button.tsx no longer exports ButtonProps. - Rework the example AppSidebar: single-demo groups render as flat links, multi-demo groups become collapsible sections that auto-open when active or while searching; add a search empty-state and a footer with theme/language/GitHub actions. - i18n the sidebar chrome + the example breadcrumb "Home" (en + ko, parity preserved). Verified: 0 forwardRef remain, 40 data-slot, tsc 0 errors, lint 0 errors, tests 7/7, build + dev OK, i18n parity intact. Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com> Claude-Session: https://claude.ai/code/session_017oJ9xs9iSZN3ahQ6hKsh3u
|
The latest updates on your projects. Learn more about Vercel for GitHub.
|
This branch was successfully deployed
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
2 participants
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
개요 / Summary
shadcn/ui 컴포넌트를 최신 컨벤션으로 현행화하고, 예제 페이지의 sidebar를 개선했습니다.
1) 컴포넌트 현행화 (40개)
forwardRef→ 함수 컴포넌트(React 19 ref-as-prop) 전환 +data-slot속성 추가.React.ElementRef/ComponentPropsWithoutRef/displayName보일러플레이트 제거.sizevariant, recharts v3 chart 타입, carousel embla ref, formuseFormField, sidebar 키보드 단축키 등 포함).ButtonPropsexport 제거에 맞춰 pagination을React.ComponentProps<typeof Button>사용으로 수정.2) 예제 Sidebar 개선
검증
forwardRefdata-slot적용 컴포넌트pnpm tscpnpm lintpnpm testpnpm build🤖 Generated with Claude Code
https://claude.ai/code/session_017oJ9xs9iSZN3ahQ6hKsh3u
Generated by Claude Code