Conversation
디자인시스템에 아코디언 컴포넌트인 `PrezelAccordion`을 새롭게 추가했습니다. * `AnimatedVisibility`를 이용한 펼치기/접기 애니메이션 구현 * 헤더, 라벨, 콘텐츠 영역을 커스텀할 수 있는 슬롯 구조 적용 * `showDivider` 옵션을 통한 구분선 표시 기능 제공 * 상태별 미리보기(Collapsed, Expanded, Interactive) 추가
아이콘 세트를 전반적으로 업데이트하고, 명명 규칙을 통일했습니다. * 신규 아이콘 추가: `Menu`, `Search`, `Upload`, `Lock`, `Storage`, `QuestionCircle` 등 * 기존 아이콘 리팩토링: `Calendar`, `Balloon`, `Check`, `Person`, `Video` 등 벡터 패스 및 색상 수정 * 아이콘 명명 규칙 변경: `WarningCircle` -> `WarningCircleOutlined` 등 형태에 따른 접미사 추가 * `PrezelIcons` 클래스 내 리소스 참조 업데이트 및 신규 아이콘 등록 * 불필요한 아이콘 삭제 (`ic_info`, `ic_warning`) 및 `PrezelAccordion` 코드 스타일 수정
Walkthrough새로운 PrezelAccordion 컴포저블 컴포넌트가 추가되었으며, 확장/축소 상태, 헤더 렌더링, 애니메이션 콘텐츠 영역을 지원합니다. 동시에 PrezelIcons에서 Edit, Lock, Menu, Search, Setting, Storage, Upload 등 여러 새로운 아이콘 상수가 추가되었고, Info와 InfoCircle은 제거되었습니다. 기존 Info 및 Warning 아이콘의 다양한 변형(Filled, Outlined)이 추가되었으며, 다수의 벡터 드로어블 파일(.xml)이 업데이트 또는 새로 생성되었습니다. Possibly related PRs
🚥 Pre-merge checks | ✅ 4 | ❌ 1❌ Failed checks (1 warning)
✅ Passed checks (4 passed)
✏️ Tip: You can configure your own custom pre-merge checks in the settings. 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: 2
🤖 Fix all issues with AI agents
In
`@Prezel/core/designsystem/src/main/res/drawable/core_designsystem_ic_calendar.xml`:
- Around line 7-8: Update the calendar drawable's fill color: locate the
android:fillColor attribute in core_designsystem_ic_calendar.xml (the <path>
element containing the calendar android:pathData) and change its value from
"#2F3238" to "#6E737D" so it matches the other design system icons.
In
`@Prezel/core/designsystem/src/main/res/drawable/core_designsystem_ic_menu.xml`:
- Around line 1-9: The vector drawable's pathData defines three horizontal dots
(a "more" icon) but the resource is named core_designsystem_ic_menu.xml (which
implies a hamburger/menu icon); either update the pathData to the three-line
hamburger shape in the <path> (replace the current dot pathData) or rename the
asset to reflect "more" (e.g., core_designsystem_ic_more) and update any
references; locate the <vector> and its <path> (android:pathData) in
core_designsystem_ic_menu.xml to make the change so resource name and visual
match the design system convention.
🧹 Nitpick comments (5)
Prezel/core/designsystem/src/main/res/drawable/core_designsystem_ic_person.xml (1)
6-11: 하드코딩된fillColor대신 테마 컬러 참조 고려두 path 모두
fillColor가#6E737D로 하드코딩되어 있습니다. Compose에서tint를 통해 항상 색상을 오버라이드한다면 문제없지만, 그렇지 않은 경우 다크 모드 등 테마 전환 시 아이콘이 배경과 구분되지 않을 수 있습니다.AI 요약에 따르면 이번 PR의 다른 아이콘들도 동일한 패턴을 사용하고 있으므로, 전체 아이콘 세트에 대해 일관된 방침이 있는지 확인해 주세요.
Prezel/core/designsystem/src/main/res/drawable/core_designsystem_ic_search.xml (1)
1-9: 새 Search 아이콘 추가 확인.아이콘 구조와 fillColor가 일관됩니다. 참고로,
TopAppBar.kt(Line 112)에서PrezelIcons.Blank을 contentDescription"검색"으로 사용하고 있는 부분이 있습니다. 이 새로운Search아이콘으로 교체하는 것이 적절할 수 있습니다.Prezel/core/designsystem/src/main/java/com/team/prezel/core/designsystem/component/PrezelAccordion.kt (3)
115-125: 접근성: chevron 아이콘에contentDescription추가 권장
contentDescription = null로 설정되어 있어 스크린 리더 사용자가 아코디언의 확장/축소 상태를 인지할 수 없습니다. 확장 상태에 따라 적절한 설명을 제공하는 것이 좋습니다.또한,
R.drawable.core_designsystem_ic_chevron_down을 직접 참조하는 대신PrezelIcons.ChevronDown을 사용하면 다른 컴포넌트(PrezelRadio,PrezelCheckbox등)와 일관성을 유지할 수 있습니다.♻️ 제안
`@Composable` private fun PrezelAccordionChevron(rotation: Float) { Icon( - painter = painterResource(R.drawable.core_designsystem_ic_chevron_down), - contentDescription = null, + painter = painterResource(PrezelIcons.ChevronDown), + contentDescription = "Toggle accordion", modifier = Modifier .size(24.dp) .rotate(rotation), tint = PrezelTheme.colors.iconRegular, ) }
40-77: 공개 API 시그니처 검토전체적으로 잘 구성되어 있습니다. 슬롯 기반 API로 header/label/content를 분리하고,
AnimatedVisibility기반의 확장/축소, ripple 제거 클릭 정책 등 PR 목표를 충실히 구현했습니다.한 가지 고려할 점:
enabled = false일 때 chevron이 여전히 표시되고 시각적 비활성화 표시가 없습니다. 비활성 상태의 시각적 피드백(예: 투명도 조절)을 추가하면 사용자 경험이 개선될 수 있습니다.
87-112: 헤더 영역의 클릭 영역과 접근성 시맨틱스
clickablemodifier에indication = null과 커스텀interactionSource를 사용하여 ripple을 제거한 것은 PR 목표와 일치합니다. 다만, 접근성 향상을 위해semantics혹은toggleablemodifier를 활용하여 확장/축소 역할(Role)을 명시하면 TalkBack 등 보조 기술에서 더 나은 경험을 제공할 수 있습니다. 참고로PrezelCheckbox에서는toggleable에Role.Checkbox를 사용하고 있습니다.
| android:pathData="M21,18.5C21,19.881 19.881,21 18.5,21H5.5C4.119,21 3,19.881 3,18.5V10.5H21V18.5ZM15,1.999C15.414,1.999 15.75,2.335 15.75,2.749V4H18.5C19.881,4 21,5.119 21,6.5V9.5H3V6.5C3,5.119 4.119,4 5.5,4H8.25V2.749C8.25,2.335 8.586,1.999 9,1.999C9.414,1.999 9.75,2.335 9.75,2.749V4H14.25V2.749C14.25,2.335 14.586,1.999 15,1.999Z" | ||
| android:fillColor="#2F3238"/> |
There was a problem hiding this comment.
🧩 Analysis chain
🏁 Script executed:
#!/bin/bash
# Search for fillColor in all design system icon drawable files
rg -n 'fillColor' --glob 'Prezel/core/designsystem/src/main/res/drawable/core_designsystem_ic_*.xml' -A 0 -B 0Repository: Team-Prezel/Prezel-Android
Length of output: 6342
캘린더 아이콘의 fillColor를 #6E737D로 수정 필요
fillColor="#2F3238"로 설정되어 있으나, 다른 모든 디자인 시스템 아이콘(49개)은 #6E737D를 일관되게 사용하고 있습니다. 캘린더 아이콘만 유일하게 다른 색상을 사용하고 있으므로 #6E737D로 통일해야 합니다.
🤖 Prompt for AI Agents
In
`@Prezel/core/designsystem/src/main/res/drawable/core_designsystem_ic_calendar.xml`
around lines 7 - 8, Update the calendar drawable's fill color: locate the
android:fillColor attribute in core_designsystem_ic_calendar.xml (the <path>
element containing the calendar android:pathData) and change its value from
"#2F3238" to "#6E737D" so it matches the other design system icons.
| <vector xmlns:android="http://schemas.android.com/apk/res/android" | ||
| android:width="24dp" | ||
| android:height="24dp" | ||
| android:viewportWidth="24" | ||
| android:viewportHeight="24"> | ||
| <path | ||
| android:pathData="M4.5,10.5C5.328,10.5 6,11.172 6,12C6,12.828 5.328,13.5 4.5,13.5C3.672,13.5 3,12.828 3,12C3,11.172 3.672,10.5 4.5,10.5ZM12,10.5C12.828,10.5 13.5,11.172 13.5,12C13.5,12.828 12.828,13.5 12,13.5C11.172,13.5 10.5,12.828 10.5,12C10.5,11.172 11.172,10.5 12,10.5ZM19.5,10.5C20.328,10.5 21,11.172 21,12C21,12.828 20.328,13.5 19.5,13.5C18.672,13.5 18,12.828 18,12C18,11.172 18.672,10.5 19.5,10.5Z" | ||
| android:fillColor="#6E737D"/> | ||
| </vector> |
There was a problem hiding this comment.
아이콘 이름과 실제 모양 불일치 가능성 확인 필요.
pathData를 분석하면, 세 개의 원(점)이 수평으로 나열된 형태로 보입니다. 이는 일반적으로 "더보기(More)" 아이콘에 해당하며, "메뉴(Menu)"라고 하면 보통 세 줄(햄버거) 아이콘을 의미합니다. 팀 내 디자인 시스템의 네이밍 규칙에 맞는지 확인해 주세요.
🤖 Prompt for AI Agents
In `@Prezel/core/designsystem/src/main/res/drawable/core_designsystem_ic_menu.xml`
around lines 1 - 9, The vector drawable's pathData defines three horizontal dots
(a "more" icon) but the resource is named core_designsystem_ic_menu.xml (which
implies a hamburger/menu icon); either update the pathData to the three-line
hamburger shape in the <path> (replace the current dot pathData) or rename the
asset to reflect "more" (e.g., core_designsystem_ic_more) and update any
references; locate the <vector> and its <path> (android:pathData) in
core_designsystem_ic_menu.xml to make the change so resource name and visual
match the design system convention.
1 participant
📌 작업 내용
PrezelAccordion 구현
PrezelIcon 업데이트
🧩 관련 이슈
📸 스크린샷
2026-02-08.22.10.42.mov
Summary by CodeRabbit
릴리스 노트