Skip to content

Shared components - 모달#21

Merged
Hys-Lee merged 135 commits intoprography:mainfrom
Hys-Lee:shared-components
Jun 26, 2025
Merged

Shared components - 모달#21
Hys-Lee merged 135 commits intoprography:mainfrom
Hys-Lee:shared-components

Conversation

@Hys-Lee
Copy link
Collaborator

@Hys-Lee Hys-Lee commented Jun 25, 2025

Modal 추가 & 기존 공용 컴포넌트수정

Modal

  • ModalAddingGoal
  • ModalAddingSubGoal
  • ModalCompletingGoal
  • ModalDeletingSubGoal

Modal은 합성 컴포넌트로 만들었으며, 일단 Modal.button만 재료로 사용했습니다.

figma의 각 모달은 이를 기반으로 제작하였고, 이벤트 핸들링은 외부에서 책임지도록 했습니다.

기존 공용 컴포넌트

  • Checkbox: 배경색 변경
  • TodoItem: 제출 관련 디자인 변경
  • FloatingButton: 배경색 변경

Hys-Lee added 30 commits May 21, 2025 12:44
포크한 레포에 작동 테스틀 위해 연결
스토리북 형태도 세팅함
구조 수정 및 tailwind prefix에 맞게 mapping
이전 패키지 버전에선 빌드가 안 됐음.
Hys-Lee added 14 commits June 20, 2025 16:03
모달 공통 컴포넌트와 파생 컴포넌트 제작.
공통에서 종속적인 부분이 있어 합성 컴포넌트로 제작.
모달 전역 관리를 위해 zustand와 커스텀 훅을 사용.
svgr관련 세팅 대해 브랜치 꼬여서 임시 저장.
일단, 외부로 동작의 책임을 넘김.
기타 변경사항들은 코드 다듬기.
전체 border대해 round가 아니도록.
길이는 외부의 container에서 처리할 수 있도록.
useModal확인 용으로 사용했었어서, 기본 값으로 복원했습니다.
폴더 깔끔하게 수정.
스토리북에서 설명 및 사이드바 경로, docs에서 잘 보이도록 render추가.
모달 공통 타입 d.ts파일로 변경.
@Hys-Lee Hys-Lee requested a review from devgony June 25, 2025 06:50
@Hys-Lee Hys-Lee self-assigned this Jun 25, 2025
<div className="w-96 px-6 py-4 bg-indigo-500 inline-flex justify-start items-center gap-3">
<div className="w-full px-6 py-4 bg-indigo-500 inline-flex justify-start items-center gap-3">
<div className="min-w-0 flex-1 inline-flex flex-col justify-center items-start gap-2">
<p className="overflow-x-hidden self-stretch justify-center text-Color-white text-base font-bold font-['SUIT_Variable'] leading-tight">
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Suggested change
<p className="overflow-x-hidden self-stretch justify-center text-Color-white text-base font-bold font-['SUIT_Variable'] leading-tight">
<p className="overflow-x-hidden self-stretch justify-center text-Color-white text-base font-bold font-SUIT_Variable leading-tight">

font-SUIT_Variable 으로만 써도 인식 되는 것 같습니다. 다른 쪽두요!

Copy link
Collaborator Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

아 넵 맞습니답.

figma에서 코드 복사하면 font-['SUIT_Varaible'] 로 되길래,
수정하기 싫어서 이대로 적용 되도록 설정해서 크게 문제는 없을 것 같긴 합니다

@Hys-Lee Hys-Lee merged commit 7a22827 into prography:main Jun 26, 2025
2 of 3 checks passed
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants