Conversation
* fix(avatar): apply vanilla-extract * fix(avatar): type error
* refactor(badge): migrate module css to vanilla extract * chore: regenerate lock file * style(badge): apply color tokens * test(badge): color token update on test
* refactor(button): vanilla-extract * chore: no new line * fix(button): remove duplicated props
* chore(checkbox): update lock file * fix: resolve cyclic dependency * chore: remove uppercase input depency on lock file * chore: add typography dependency
* refactor(reset): improve css reset with modern best practices * chore(reset): delete storybook directory
* chore(side): add exclude dist, node_modules each component * chore(template): add exclude on template tsconfig * chore(tsconfig): add exclude on root tsconfig
* chore: change codeowners * chore: add @haedawn as a code owner
* chore(tokens): add tokens * feat(theme): implement theme provider * chore(token): remove unused tokens * feat(theme): add responsive style * chore(theme): add missing tsconfig, tsup.config * docs(theme): simplify theme
* fix(avatar): apply vanilla-extract (#143) * fix(avatar): apply vanilla-extract * fix(avatar): type error * refactor(badge): apply vanilla-extract (#144) * refactor(badge): migrate module css to vanilla extract * chore: regenerate lock file * style(badge): apply color tokens * test(badge): color token update on test * refactor(checkbox): migrate to vanilla-extract and refactor * refactor(checkbox): apply vanilla-extract for styling * refactor(checkbox): update Checkbox component structure to use compound components * chore(checkbox): remove unused styles and constants * test(checkbox): update tests to reflect new component structure and props * chore(checkbox): delete ref on Root * chore(checkbox): add optional id prop to Checkbox component * refactor(checkbox): simplify useControllableState hook * chore(checkbox): delete unused hook * refactor(checkbox): enhance props and structure * refactor(checkbox): enhance storybook and test code * chore(checkbox): update dependency include vanilla extract recipes * chore(checkbox): add user-event package in project * chore: add module.css type declarations * refactor(checkbox): accept and update feedback * chore(checkbox): replace HTMLAttrivutes to ComponentProps * chore(checkbox): delete useless code * chore(checkbox): resolve type error --------- Co-authored-by: y09n <euihyun.yang.9x@gmail.com>
|
|
Caution Review failedThe pull request is closed. Walkthrough이 변경사항은 SIPE 디자인 시스템의 주요 UI 컴포넌트(Avatar, Badge, Button, Card, Checkbox, Reset 등)를 CSS 모듈 및 인라인 스타일에서 vanilla-extract 기반의 타입 안전 CSS-in-TypeScript 스타일링으로 전환합니다. 또한, 테마 시스템과 디자인 토큰을 도입하고, Storybook 및 Netlify 배포 워크플로우, 각종 패키지 설정 파일, 테스트, 문서 등을 대대적으로 업데이트합니다. Changes
Sequence Diagram(s)sequenceDiagram
participant App
participant ThemeProvider
participant ThemeContext
participant Component
App->>ThemeProvider: ThemeProvider로 앱 감싸기
ThemeProvider->>ThemeContext: mode, setMode, toggleMode 제공
Component->>ThemeContext: useTheme()로 현재 모드/토글 함수 사용
ThemeProvider->>HTML: data-theme 속성(light/dark) 동기화
sequenceDiagram
participant CheckboxRoot
participant CheckboxInput
participant CheckboxLabel
participant useControllableState
CheckboxRoot->>useControllableState: checked 상태 관리(제어/비제어)
CheckboxRoot->>CheckboxInput: Context로 상태/props 전달
CheckboxInput->>CheckboxRoot: onChange 발생 시 상태 변경
CheckboxLabel->>CheckboxRoot: Context로 연결, htmlFor/id 연동
Possibly related PRs
Poem
Warning There were issues while running some tools. Please review the errors and either fix the tool's configuration or disable the tool if it's a critical failure. 🔧 ESLint
packages/avatar/src/Avatar.test.tsxOops! Something went wrong! :( ESLint: 9.20.0 Error: Cannot find module '@eslint/js'
packages/avatar/src/Avatar.css.tsOops! Something went wrong! :( ESLint: 9.20.0 Error: Cannot find module '@eslint/js'
packages/avatar/tsup.config.tsOops! Something went wrong! :( ESLint: 9.20.0 Error: Cannot find module '@eslint/js'
📜 Recent review detailsConfiguration used: CodeRabbit UI ⛔ Files ignored due to path filters (3)
📒 Files selected for processing (88)
✨ Finishing Touches
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. 🪧 TipsChatThere are 3 ways to chat with CodeRabbit:
SupportNeed help? Create a ticket on our support page for assistance with any issues or questions. Note: Be mindful of the bot's finite context window. It's strongly recommended to break down tasks such as reading entire modules into smaller chunks. For a focused discussion, use review comments to chat about specific files and their changes, instead of using the PR comments. CodeRabbit Commands (Invoked using PR comments)
Other keywords and placeholders
CodeRabbit Configuration File (
|
❌ Deploy Preview for side-design-system failed. Why did it fail? →
|
Changes
Visuals
Checklist
Additional Discussion Points
Summary by CodeRabbit
New Features
버그 수정
문서화
리팩터
테스트
환경설정/작업