Implement AlphaAvatar component
#2162
Merged
Conversation
This file contains 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
🦋 Changeset detectedLatest commit: 301a2b9 The changes in this PR will be included in the next version bump. This PR includes changesets to release 3 packages
Not sure what this means? Click here to learn what changesets are. Click here if you're a maintainer who wants to add another changeset to this PR |
Chromatic Report🚀 Congratulations! Your build was successful! |
Codecov ReportAttention: Patch coverage is
Additional details and impacted files@@ Coverage Diff @@
## main #2162 +/- ##
=========================================
+ Coverage 0 86.80% +86.80%
=========================================
Files 0 128 +128
Lines 0 2735 +2735
Branches 0 815 +815
=========================================
+ Hits 0 2374 +2374
- Misses 0 356 +356
- Partials 0 5 +5 ☔ View full report in Codecov by Sentry. |
sungik-choi
approved these changes
Apr 18, 2024
Comment on lines
+26
to
+27
| // TODO: Replace this with useAlphaTokens | ||
| return useTokens().global.radius['radius-42-p'] |
There was a problem hiding this comment.
alpha 토큰에 있을텐데 주석 적어주신대로 나중에 변경해도 될 거 같아요
| export const Avatar = forwardRef<HTMLDivElement, AvatarProps>(function Avatar( | ||
| { | ||
| avatarUrl = '', | ||
| fallbackUrl = defaultAvatarUrl, |
| disabled={!smoothCorners} | ||
| borderRadius={AVATAR_BORDER_RADIUS} | ||
| shadow={showBorder ? shadow : undefined} | ||
| backgroundColor="bg-white-normal" |
There was a problem hiding this comment.
여기도 가능하면 사용할 수 있을텐데, 타입 정의 변경이 필요
There was a problem hiding this comment.
새로운 타입을 갖는 AlphaSmoothCornersBox를 만들어야겠네요
sungik-choi
pushed a commit
that referenced
this pull request
Apr 26, 2024
This PR was opened by the [Changesets release](https://github.com/changesets/action) GitHub action. When you're ready to do a release, you can merge this and the packages will be published to npm automatically. If you're not ready to do a release yet, that's fine, whenever you add more changesets to main, this PR will be updated. # Releases ## @channel.io/bezier-react@2.0.3 ### Patch Changes - Implement `AlphaAvatar` component. ([#2162](#2162)) by @yangwooseong - Add `AlphaAvatarGroup` component ([#2177](#2177)) by @yangwooseong - Updated dependencies - @channel.io/bezier-tokens@0.2.2 ## @channel.io/bezier-tokens@0.2.2 ### Patch Changes - Add `opacity-disabled` to alpha token. ([#2162](#2162)) by @yangwooseong - Fix the value of alpha color.cobalt.300 ([#2160](#2160)) by @sungik-choi ## bezier-figma-plugin@0.5.3 ### Patch Changes - Updated dependencies - @channel.io/bezier-react@2.0.3 Co-authored-by: github-actions[bot] <github-actions[bot]@users.noreply.github.com>
yangwooseong
pushed a commit
to yangwooseong/bezier-react
that referenced
this pull request
May 2, 2024
This PR was opened by the [Changesets release](https://github.com/changesets/action) GitHub action. When you're ready to do a release, you can merge this and the packages will be published to npm automatically. If you're not ready to do a release yet, that's fine, whenever you add more changesets to main, this PR will be updated. # Releases ## @channel.io/bezier-react@2.0.3 ### Patch Changes - Implement `AlphaAvatar` component. ([channel-io#2162](channel-io#2162)) by @yangwooseong - Add `AlphaAvatarGroup` component ([channel-io#2177](channel-io#2177)) by @yangwooseong - Updated dependencies - @channel.io/bezier-tokens@0.2.2 ## @channel.io/bezier-tokens@0.2.2 ### Patch Changes - Add `opacity-disabled` to alpha token. ([channel-io#2162](channel-io#2162)) by @yangwooseong - Fix the value of alpha color.cobalt.300 ([channel-io#2160](channel-io#2160)) by @sungik-choi ## bezier-figma-plugin@0.5.3 ### Patch Changes - Updated dependencies - @channel.io/bezier-react@2.0.3 Co-authored-by: github-actions[bot] <github-actions[bot]@users.noreply.github.com>
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
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.
Self Checklist
Related Issue
Summary
Details
16이 추가되는 것 말고는 없었기 때문에 기존의 구현을 거의 그대로 가져왔습니다. 내부적으로 사용하는 Status, useToken 는 새롭게 구현한 후에 교체할 예정입니다. 특히 useTokens 는 베지어 안에서 사용하고 있는 곳이 많지 않기 때문에, 리디자인된 토큰이 안정화되고 나서 구현해도 좋아보입니다.Breaking change? (Yes/No)
References