Avatar #2151
Assignees
Labels
feat:component
Issue or PR related to a new component
Comments
yangwooseong
added a commit
that referenced
this issue
Apr 22, 2024
<!-- How to write a good PR title: - Follow [the Conventional Commits specification](https://www.conventionalcommits.org/en/v1.0.0/). - Give as much context as necessary and as little as possible - Prefix it with [WIP] while it’s a work in progress --> ## Self Checklist - [x] I wrote a PR title in **English** and added an appropriate **label** to the PR. - [x] I wrote the commit message in **English** and to follow [**the Conventional Commits specification**](https://www.conventionalcommits.org/en/v1.0.0/). - [x] I [added the **changeset**](https://github.com/changesets/changesets/blob/main/docs/adding-a-changeset.md) about the changes that needed to be released. (or didn't have to) - [x] I wrote or updated **documentation** related to the changes. (or didn't have to) - [x] I wrote or updated **tests** related to the changes. (or didn't have to) - [x] I tested the changes in various browsers. (or didn't have to) - Windows: Chrome, Edge, (Optional) Firefox - macOS: Chrome, Edge, Safari, (Optional) Firefox ## Related Issue <!-- Please link to issue if one exists --> <!-- Fixes #0000 --> - Fixes #2151 ## Summary <!-- Please brief explanation of the changes made --> - 새로운 디자인 토큰을 활용하여 AlphaAvatar 컴포넌트를 구현합니다. ## Details <!-- Please elaborate description of the changes --> - 컴포넌트 스펙 상으로 달라지는 점은 사이즈에 `16`이 추가되는 것 말고는 없었기 때문에 기존의 구현을 거의 그대로 가져왔습니다. 내부적으로 사용하는 Status, useToken 는 새롭게 구현한 후에 교체할 예정입니다. 특히 useTokens 는 베지어 안에서 사용하고 있는 곳이 많지 않기 때문에, 리디자인된 토큰이 안정화되고 나서 구현해도 좋아보입니다. - 컴포넌트 스타일링에서 리디자인된 토큰을 사용하고 있는 곳은 없었고, 다만 opcity: 0.4에 해당하는 토큰이 필요해서 alpha 토큰에 추가했습니다. - useProgressiveImage 훅의 테스트 코드에서 cachedImageMap 을 사용하기 위해 훅에서 불필요하게 cachedImageMap를 인자로 받는 것을 개선했습니다. 이제 테스트 코드 안에서 Image 를 mocking해서 onLoad 를 실행하기 때문에 cachedImageMap를 받을 필요가 없어집니다. 구현은 Radix 코드를 참고했습니다 ([#](https://github.dev/radix-ui/primitives/blob/main/packages/react/avatar/src/Avatar.tsx)) ### Breaking change? (Yes/No) <!-- If Yes, please describe the impact and migration path for users --> - No ## References <!-- Please list any other resources or points the reviewer should be aware of --> - [컴포넌트 스펙](https://www.notion.so/channelio/Avatar-37c59db14440427d93704fdeed2f5d4a) - [피그마](https://www.figma.com/file/aJJF4bU82uR0jAsmWp5wlE/Navigation?type=design&node-id=1-19365&mode=design&t=bjyqBRXT4H49ZRju-4)
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
No description provided.
The text was updated successfully, but these errors were encountered: