refactor: 웹에 맞게 Toast.style 수정 #84
Conversation
- args를 내부에서 정의하지 않고 외부에서 전달하도록 함
- 관련 있는 것끼리 묶고 중간에 개행 추가함
| @@ -93,15 +76,22 @@ type Story = StoryObj<typeof Toast>; | |||
| export const SingleLine: Story = { | |||
| args: { | |||
| children: '토스트 메시지', | |||
| duration: 'short', | |||
There was a problem hiding this comment.
스토리북에서 토스트가 한 번 뜬 이후 다시 나타나지 않는 게 살짝 불편한데, 사용처에 duration 설정을 온전히 맡기고 기본 값은 무한으로 설정해두는 거 어떠신가요?
ToastHook만 duration long 유지하고, SingleLine, MultiLine은 설정하지 않으면 좋을 것 같아요
There was a problem hiding this comment.
내부에 삭제 버튼이 존재하지 않는다는 점에서 YDS의 Toast는 사용자에게 피드백을 제공한 뒤 자체적으로 사라져야 하는 컴포넌트이고, 이러한 역할을 생각했을 때 duration의 기본값을 무한대로 설정하는 것이 어색하게 느껴집니다. 문서 조회에서 발생한 문제를 컴포넌트 코드의 수정으로 해결하는 것도 적절하지 않다는 생각이 들어요
말씀하신 불편함에는 저 역시도 공감합니다! 문서를 좀 다듬어보고 리뷰 요청 다시 넣을게요~
There was a problem hiding this comment.
토스트가 생겼다 사라지는 것을 무한으로 반복해도 좋을 것 같네요 (일정 간격을 두고)
There was a problem hiding this comment.
혹시 Single Line, Multi Line은 무한 반복이 불가능할까요?
There was a problem hiding this comment.
사용자가 원하는 시점에 원하는 옵션으로 다시 조회하는 기능이 낫다고 생각했고, 그 기능은 현재 PrimaryBlock에서 충분히 가능하기 때문에 필요성을 잘 모르겠어서 일단 추가하지 않았습니다
- ToastHook 스토리를 Primary로 취급하게끔 정의 순서를 변경함 - 버튼 텍스트 height 수정 - 불필요한 Docs block 삭제
1️⃣ 어떤 작업을 했나요? (Summary)
기존 코드에 영향을 미치지 않는 변경사항
웹에서
Toast를 사용했을 때 위치, 너비 문제가 있어 웹에 맞게 수정했습니다width를 사용자가 지정할 수 있습니다. 지나치게 작거나 (fit-content 미만) 클 경우 (화면 사이즈 초과) 적용되지 않습니다
스크롤 위치와 관계 없이 현재 화면 기준으로 위치를 수정했습니다 (원래는 absolute로 잡아놔서 스크롤 내려야 보였음)
바뀐 내용에 맞게 문서를 일부 수정했습니다
2️⃣ 알아두시면 좋아요!
화면 전체에
StyledToastWrapper가 뜨고 그 안에StyledToast가 위치하는 형태입니다3️⃣ 추후 작업
4️⃣ 체크리스트 (Checklist)
main브랜치의 최신 코드를pull받았나요?