Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

[ Feat ] Toggle Button 퍼블리싱 #21

Merged
merged 5 commits into from
Sep 14, 2024
Merged

[ Feat ] Toggle Button 퍼블리싱 #21

merged 5 commits into from
Sep 14, 2024

Conversation

wuzoo
Copy link
Member

@wuzoo wuzoo commented Sep 11, 2024 •
edited
Loading

#️⃣ Related Issue

Closes #20

✅ Done Task

  • 토글 버튼 컴포넌트 생성

☀️ New-insight

일단 @vanilla-extract/recipe 라이브러리를 통해 recipe API를 활용하여 손쉽게 variant 컴포넌트를 생성해주었습니다. 최근에 바닐라 익스트랙 관련해서 멘토링을 들은 적이 있는데 해당 API를 통해서 손쉽게 베리언트 속성에 따라 컴포넌트 스타일을 적용할 수 있다고 배웠는데, 이를 적용해보았습니다.
물론 기존의 css 라이브러리에도 styleVariants 라는 API가 있는데요. 이는 하나의 함수 안에서 base 스타일 생성을 하지 못하여 항상 style 함수 안에 배열을 할당하여 composition으로 구성해주어야 하기 때문에 variant 작성 시 조금 더 불편함이 있다고 생각합니다.

💎 PR Point

  1. 일단 해당 토글버튼을 퍼블리싱하는데 있어서 html 태그부터 좀 고민하는 과정을 겪었는데요. div로 할 것이냐, button으로 할 것이냐, input으로 할 것이냐를 고민했던 것 같습니다. 하지만 클릭하면 active 상태가 되게끔 하는 토글버튼의 성격 상, input의 체크박스로 구현하는 것이 가독성 측면에서나, 시맨틱 태그 + 스크린 리더 측면에서나 옳다고 판단하여 input 태그를 적용하였습니다.
  2. 저는 SEO와 접근성을 특히나 중요시 하는데요. 따라서 WAI-ARIA를 공통 컴포넌트 단에서는 필요하다면 꼭 작성해주는 편입니다. role에 switch 그리고 해당 요소가 체크된 상태인지를 스크린 리더에게 알려주는 aria-checked를 같이 작성해주었습니다.
  3. input의 기존 인터페이스를 그대로 상속하였습니다. 일단 공통 컴포넌트는 무한한 확장성을 지녀야한다고 생각하는데요. 따라서 제가 지정한 토글 버튼의 인터페이스 뿐만 아니라 외부에서 기존의 input이 지닐 수 있는 속성들을 그대로 사용가능하도록 하기 위해서 ComponentPropsWithoutRef 를 통해 input 인터페이스를 상속해주었습니다.
  • 추가적으로 theme 설정이 완료된다면 반영할 것 반영하겠습니다 + 이제 리뷰어 할당 잘 되는 것 같군요

📸 Screenshot

2024-09-11.3.14.26.mov

@j-nary j-nary added ✨ Feat 새로운 기능 구현 JIN 이진 WUZ 최주용 and removed JIN 이진 labels Sep 11, 2024
j-nary
j-nary reviewed Sep 11, 2024
View reviewed changes
Copy link
Member

@j-nary j-nary left a comment •
edited
Loading

Choose a reason for hiding this comment

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

SEO를 고려한 input 태그 적용이나 recipe를 사용하여 스타일에 variant 준 부분이 돋보이네요!
LGTM 많이 배워갑니다
자잘한 코리 한 번만 확인해주세용 ~

next.config.mjs Outdated
Copy link
Member

Choose a reason for hiding this comment

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

p3) json 린트 설정이 다른 것 같아요 .. 계속해서 불필요한 변경사항들이 생기네요
어떻게 해결하면 좋을까요 ?

Copy link
Member Author

Choose a reason for hiding this comment

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

확인해보겠습니다 . . .

src/app/layout.tsx
@@ -1,4 +1,4 @@
import Providers from "@/components/common/Provider";
import Providers from "@/components/common/Provider/Provider";
Copy link
Member

Choose a reason for hiding this comment

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

p4) 컴포넌트 폴더에 파일명은 index.tsx 로 통일하는 것은 어떻게 생각하시나요?

Copy link
Member Author

Choose a reason for hiding this comment

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

FE 팀원들과 논의된 사항인가요 ?

Copy link
Member

Choose a reason for hiding this comment

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

다른 분들의 의견도 궁금합니다!

src/components/common/ToggleButton/ToggleButton.css.ts
@@ -0,0 +1,51 @@
import { recipe } from "@vanilla-extract/recipes";

export const buttonStyle = recipe({
Copy link
Member

Choose a reason for hiding this comment

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

우왕 신기하당 !
덕분에 좋은 기능들 알아가네요! 감사합니다 👍

src/components/common/ToggleButton/ToggleButton.css.ts

appearance: "none",

width: "40px",
Copy link
Member

Choose a reason for hiding this comment

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

p2) 단위 rem으로 통일하는 건 어떻게 생각하시나요? global.css 에 '65.7%' 인지 뭔지 하는 거 설정해두었거든요!

Copy link
Member Author

Choose a reason for hiding this comment

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

넵 수정하겠습니다 ~

@j-nary j-nary self-requested a review September 11, 2024 15:47
hwangjokim
hwangjokim reviewed Sep 11, 2024
View reviewed changes
Copy link
Contributor

@hwangjokim hwangjokim left a comment

Choose a reason for hiding this comment

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

WAI-ARIA 신경안쓰면 놓치기 쉬운데 고려하시는것도 좋고, 고민하셨던 내용도 좋네요~
다만 �디자인 시스템 잡히기 전에는 제대로 돌려보면서 리뷰하는게 쉽지 않아보이긴 합니다

피그마상 w, h는 40에 24고 그렇게 잘 작성해주셨는데 user agent styleshee때문에 마진이 박힌다던지.. 하고있습니다. reset.css같은걸 써야하나 싶기도 하고요.

고생하셨습니다!

ptyoiy
ptyoiy approved these changes Sep 13, 2024
View reviewed changes
Copy link
Contributor

@ptyoiy ptyoiy left a comment

Choose a reason for hiding this comment

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

아마 review로 잘못 단 거를 보셨을텐데, 그때 리뷰 내용인 focus-visible 및 hover 효과 디자인은 회의 안건에 적어 놨습니다. 일단은 기획자님이 디자이너 분께 연락 드렸다고 하네요.
나머지는 괜찮은 것 같습니다! 고생하셨습니다~

@github-actions github-actions bot added size/s and removed size/m labels Sep 14, 2024
@wuzoo wuzoo merged commit c9d28e7 into main Sep 14, 2024
2 checks passed
j-nary added a commit that referenced this pull request Oct 15, 2024
@j-nary @wuzoo
@ptyoiy @hwangjokim
[ Deploy ] v1: OnboardingPage (#114)
86e930a 
* init: 템플릿 추가

* init: 폴더 구조 세팅

* fix: 이슈 템플릿 확정

* fix: 이슈 템플릿 확정

* fix: 이슈 템플릿 확정

* init: README 설정

* [ Init ] Biome 설정 (#3)

* fix: pnpm-lock 파일 pr size labeler 에서 제거 + prSize 커스텀

* init: biome 설치

* init: biome 설정 파일 추가

* fix: ignore 파일 추가

* feat: useArrowFunction 속성 추가

* fix: React 전역 인식 옵션 추가

* fix: import sorting안됨 이슈 해결

* [ Fix ] biome 적용 안 됨 이슈 해결 (#12)

* fix: files 수정

* feat: console warning으로 변경

* [ Init ] Jotai + Vanilla Extract 초기 세팅 (#6)

* feat: jotai Provider 생성

* docs: jotai 설치 + 임시 atom 추가

* docs: vanilla-extract setting

* feat: Jotai SSR을 위한 Providers 세팅

* chore: Provider에 대한 주석 추가

* [ Init ] assets setting (#9)

* init: svgr 초기 세팅 및 사용 예시 추가

* init: icon 및 컴포넌트 변환 cli 추가

* chore: lock 파일 제거

* feat: icon export 생성기 추가 & pacakge.json script 추가

* chore: icon 파일 통합 및 폴더명 컨벤션 적용

* fix: 코리반영

---------

Co-authored-by: Lee jin <[email protected]>

* [ Docs ] Lint, Build, Assign Reviewer Workflow 생성 (#13)

* docs: assign reviewer, build workflow 생성

* docs: lint step 추가

* chore: yml file name change

* docs: cache pnpm 삭제

* chore: 모든 Page 임시 템플릿 생성

* docs: artifact path 수정

* docs: artifact path: next

* docs: artifact path: .next

* docs: target branch 제거

* chore: biome lint workflow test

* docs: run biome ci for ci environment

* chore: console.log 삭제

* docs: biome ci formatter disabled test

* docs: lint error return test

* chore: biome test 코드 삭제

* chore: noBarrelFile, noReExportAll off

* docs: type check by tsc + seperate cd pipeline

* docs: concurrently check 생성하여 workflow 반영

* docs: name 수정

* fix: biome lint error resolve

* docs: pnpm lock file update

* chore: check script ci로 수정하고 biome ignore 추가

* [ FIX ]  Add vanilaExtract setting to next.config.mjs and .nvmrc (#17)

* fix: Add vanilaExtract setting to next.config.mjs

* init: Add nvmrc

* [ Feat ] 디자인 시스템 구축 (#22)

* feat: 디자인 시스템 구축

* fix: next.config 수정 및 tailwindcss 제거

* feat: button에 style 적용

* feat: themeClass 추가

* fix: createThemeContract 제거

* feat: reset, normalize 스타일 설정

* docs: globals.css 파일 제거 -> globalStyle 로 대체

* fix: createGlobalTheme으로 변경 (스코프 불필요)

* feat: zIndex 추가, spacing 보류

* [ Feat ] lottie 세팅 (#18)

* init: gif, lottie json 등 나머지 assets 추가

* feat: lottie animation 재생 컴포넌트 추가

* chore: public 디렉토리 수정

* init: 누락된 assets 추가

---------

Co-authored-by: Lee jin <[email protected]>

* [ Feat ] Toggle Button 퍼블리싱 (#21)

* chore: Provider -> common/Provider

* docs: vanilla extract recipe for variant component

* feat: ToggleButton component publishing

* chore: 불필요 use client 삭제

* [ Feat ] 공통 컴포넌트 Button 구현 (#26)

* feat: 버튼 공통 컴포넌트 구현

* feat: 왼쪽 플러스 아이콘 추가

* docs: 테스트 코드 삭제

* fix: 불필요한 import 삭제

* fix: import type

* refactor: 코드리뷰 반영

* fix: isActive 쓰임 변경

* refactor: width:100%  코드리뷰 반영

* fix: disabled 인터페이스 속성 제거

* fix: button type 제거

* docs: 불필요한 파일 제거

* fix: 불필요한 인터페이스 삭제

* fix: 불필요한 인터페이스 삭제2

* [ Init ] CD 파이프라인 구축 (#24)

* init: Add CD Pipeline

* fix: Trigger cd pipeline when push to main

* Change branch triggering CD to 'deploy'

* [ Feat ] 공통 컴포넌트 Avatar 구현 (#28)

* feat: Avatar 컴포넌트 구현

* feat: userIcon 추가

* feat: role 속성 추가

* refactor: 코드리뷰 반영

* refactor: 인터페이스 변경

* refactor: 키 밸류 자동 삽입

* refactor: imageProps 내려받기

* refactor: 버튼 태그 삭제

* refactor: 불필요한 인터페이스 삭제

* refactor: Image 태그 role 추가

* refactor: inset 추가

* fix: 혼날뻔

* refactor: inset 되돌리기

* [ Feat ] header 및 드롭다운 토글 기능 구현 (#31)

* init: reset icon 컨벤션 적용, logo 아이콘 추가

* feat: header 구현, authAtom 적용

* feat: header dropdown 클릭 기능 구현

* chore: todo 추가, 들여쓰기를 탭 대신 공백으로 변경, build error 수정

* refactor: 코드 리뷰 반영 (분리, 커스텀훅)

* refactor: dropdown 분리

* refactor: css 속성 개행, util 파일 명 수정, useOutsideClick 코리 반영

* refactor: style 분리 코리반영

* refactor: 충돌 해결, 로그인 버튼 교체

* refactor: 코리 반영(outsideHook, dropdown)

* [ Refactor ] 폴더구조 변경 (#34)

* test: README 임시 업데이트

* refactor: 폴더구조 변경

* fix: 파일명 변경

* fix: CI 빌드 에러 해결

* fix: CI 빌드 에러 해결

* refactor: 파일, 폴더명 컨벤션 확립

* refactor: 찐최종

* fix: github 대소문자 구분 설정 후 커밋

* fix: CI 빌드 에러 해결 시도

* fix: CI 빌드 에러 해결 시도 2

* fix: CI 빌드에러 해결 시도 3

* [ Fix ] 폴더명 대소문자 관련 CI 빌드에러 해결 (#37)

* docs: avatar 삭제

* �docs: animation 삭제

* docs: button 삭제

* docs: dropdown 삭제

* �docs: toggleButton 삭제

* �docs: provider 삭제

* [ Init ] storybook 세팅 및 예시 추가(Page, Animation, Button, Dropdown) (#35)

* init: storybook 세팅 및 예시 추가(Animation)

* Squashed commit of the following:

commit f460fa7
Author: Lee jin <[email protected]>
Date:   Mon Sep 16 00:41:02 2024 +0900

    [ Fix ] 폴더명 대소문자 관련 CI 빌드에러 해결 (#37)

commit 9ee37bf
Author: Lee jin <[email protected]>
Date:   Mon Sep 16 00:29:12 2024 +0900

    [ Refactor ] 폴더구조 변경 (#34)

commit 5150c26
Author: ptyoiy <[email protected]>
Date:   Sun Sep 15 16:18:10 2024 +0900

    [ Feat ] header 및 드롭다운 토글 기능 구현 (#31)


* feat: storybook addon 추가, app router 적용, css 조정

* feat: jsdoc 반영하는 기능 추가, hook/util mdx 생성기 추가(storybook)

* fix: lock update

* chore: 코드 컨벤션 누락된 부분 수정, 주석 제거

* fix: core.ignorecase, 대소문자 변경 적용

* refactor: stories.tsx 포맷을 CSF3으로 변경

* chore: 코리 반영 (중복 속성 제거)

---------

Co-authored-by: hwangjokim <[email protected]>

* [ Feat ] alarm list component 구현 (#41)

* feat: alarm list 컴포넌트 구현, 헤더 내부 컴포넌트 수정

* fix: page에 임시로 use client 사용

* refactor: useOutsideClick 훅 esc키로도 작동하게 수정

* chore: 주석 추가, css 순서별 개행

* refactor: 코리 반영 (jsx구조, 변수명 수정)

* refactor: 코리 반영(shared 이동, 매개변수명 수정, 간격 조정, globalStyle 추가))

* fix: storybook 버그 수정

* chore: 스크롤바 style theme으로 이동

* [ Feat ] Modal 공통컴포넌트 구현 (#44)

* feat: Modal 컴포넌트 구현

* feat: focus trap 추가

* feat: Modal Storybook 추가

* fix: CI 빌드 에러 해결

* fix: 사용하지 않는 import 제거

* fix: CI 빌드 에러 해결

* [ Feat ] Atom과 Timeout을 통한 Toast 렌더링, ToastProvider 설정 (#50)

* feat: createPortal을 이용한 Portal 래퍼 컴포넌트 생성

* feat: Toast 컴포넌트 퍼블리싱

* chore: 초기 토스트 컨테이너, 토스트 컴포넌트 스타일

* feat: toast atom, useToast 훅 생성

* feat: 전역 toast list를 렌더링하는 동시에 onClose 핸들러 전달

* refactor: 단 하나의 토스트를 띄우도록 변경

* style: animation keyframe 생성

* feat: list가 아닌 하나의 toast를 update

* feat: ref, timeout을 통한 useTimeout 커스텀 훅 생성

* feat: useTimeout을 통해 show hide 제어 + toast atom을 통한 조건부 토스트 렌더링

* chore: 불필요 prop 삭제

* docs: toast story 작성

* docs: storybook provider 추가

* chore: storybook title 수정

* chore: decorator로 파일 네이밍 수정

* feat: renderRef를 추가하여 null로 업데이트 시 렌더링 이슈 해결

* chore: image format declare

* refactor: clear timeout logic 수정

* chore: Timeout type shared로 이동하여 삭제

* [ Feat ] Datepicker 구현  (#51)

* react-datepicker test v1

* feat: Implement datepicker

* refactor: Make props more general

* chore: CSS 정리

* add : Add component to story

---------

Co-authored-by: Lee jin <[email protected]>

* [ Feat ] Context를 통한 TabGroup 컴파운드 컴포넌트 구현 (#46)

* style: list 요소 style none 추가

* feat: 선택된 tab, 현재 tab variant에 대한 reducer와 context 생성

* feat: icon과 indicator를 추가한 Tab Item 컴포넌트

* feat: state, dispatch 커스텀 훅 선언

* feat: children의 idx를 통해 selected된 id 패널을 렌더링하도록 구현

* chore: darkMode parameter 추가

* feat: context를 통한 list, panel, tab, tabs, indicator 상태 공유

* refactor: setVariant actions 삭제

* refactor: 추가적인 wai-aria 명시

* feat: motion layoutId로 transition 시 공통된 애니메이션 적용

* refactor: tabStyle의 font를 textStyle로 분리

* refactor: null | undefined를 ! 로 처리

* chore: tab, panel에 맞는 id prop 추가

* [ Refactor ] 모든 파일 일괄 포매터 적용 및 CI 설정

* [ Fix ] Format-on-save가 정상 작동하게 수정 (#71)

* fix: Fix broken format-on-save for biome

* Fix Tabgroup format

* [ Fix ] 리뷰어 자동할당 (#69)

* fix: 리뷰어 자동할당

* fix: CI 빌드에러 해결

* [ Feat ] Add common-input component (#38)

* feat: Add common-input component

* fix: add 'use client' and update prop types

* refactor: Apply comments

* Add : Add component's to storyBook

* chore: update textarea's figma url

* style: bar 제거 및 ErrorInfo 컴포넌트 분리

* chore: Organize imports and add story

* Apply comments

* Remove unused code

* Remove useless fragment

* style: Change focus-within to focus

* style: Seperate supportingText from  components

* style: Seperate supportingText from  components

* [ Feat ] EditAvatar 구현 + storybook (#66)

* feat: EditAvatar UI구현

* feat: EditAvatar 구현

* feat: EditAvatar storybook 작성

* feat: onImageChange 추가

* fix: CI 빌드에러 해결

* feat: label 추가 및 pickedImage null일 경우 처리

* fix: fileReader 창 두 번 뜨는 이슈 해결

* docs: unused import 삭제

* fix: CI 빌드에러 해결

* feat: onKeydown 추가

* [ Feat ] onboarding page 구현 및 스토리북 테스트 (#48)

* feat: onboarding 첫번째 section 구현

* feat: 두번째 section 구현

* feat: section scroll 기능 구현

* feat: 세번째 섹션 구현, css variants 통일, 스크롤 기능 css로 교체

* style: 이미지 최적화

* feat: footer 구현, 스크롤 css global에 적용

* refactor: 접근성 리펙토링

* fix: route segment storybook 세팅 변경

* chore: 클라이언트 컴포넌트 영역 적절한 곳으로 변경

* fix: pnpm run check error

* refactor: scroll style을 페이지 단으로 이동

* fix: css 간격 조정, route를 "/"으로 변경

* chore: 누락된 간격 조정 적용

* feat: 이미지에 fade-in 효과 적용

* chore: gitkeep 제거

* chore: 변수 엑세스 위치 교체

* Squashed commit of the following:

commit 1c994ce
Author: HwangDo <[email protected]>
Date:   Wed Oct 2 23:38:25 2024 +0900

    [ Refactor ] 모든 파일 일괄 포매터 적용 및 CI 설정

commit fff7961
Author: 최주용 <[email protected]>
Date:   Wed Oct 2 23:02:18 2024 +0900

    [ Feat ] Context를 통한 TabGroup 컴파운드 컴포넌트 구현 (#46)

    * style: list 요소 style none 추가

    * feat: 선택된 tab, 현재 tab variant에 대한 reducer와 context 생성

    * feat: icon과 indicator를 추가한 Tab Item 컴포넌트

    * feat: state, dispatch 커스텀 훅 선언

    * feat: children의 idx를 통해 selected된 id 패널을 렌더링하도록 구현

    * chore: darkMode parameter 추가

    * feat: context를 통한 list, panel, tab, tabs, indicator 상태 공유

    * refactor: setVariant actions 삭제

    * refactor: 추가적인 wai-aria 명시

    * feat: motion layoutId로 transition 시 공통된 애니메이션 적용

    * refactor: tabStyle의 font를 textStyle로 분리

    * refactor: null | undefined를 ! 로 처리

    * chore: tab, panel에 맞는 id prop 추가

commit f71a72a
Author: HwangDo <[email protected]>
Date:   Wed Sep 25 22:36:35 2024 +0900

    [ Feat ] Datepicker 구현  (#51)

    * react-datepicker test v1

    * feat: Implement datepicker

    * refactor: Make props more general

    * chore: CSS 정리

    * add : Add component to story

    ---------

    Co-authored-by: Lee jin <[email protected]>

commit 1b6639d
Author: 최주용 <[email protected]>
Date:   Tue Sep 24 14:05:21 2024 +0900

    [ Feat ] Atom과 Timeout을 통한 Toast 렌더링, ToastProvider 설정 (#50)

    * feat: createPortal을 이용한 Portal 래퍼 컴포넌트 생성

    * feat: Toast 컴포넌트 퍼블리싱

    * chore: 초기 토스트 컨테이너, 토스트 컴포넌트 스타일

    * feat: toast atom, useToast 훅 생성

    * feat: 전역 toast list를 렌더링하는 동시에 onClose 핸들러 전달

    * refactor: 단 하나의 토스트를 띄우도록 변경

    * style: animation keyframe 생성

    * feat: list가 아닌 하나의 toast를 update

    * feat: ref, timeout을 통한 useTimeout 커스텀 훅 생성

    * feat: useTimeout을 통해 show hide 제어 + toast atom을 통한 조건부 토스트 렌더링

    * chore: 불필요 prop 삭제

    * docs: toast story 작성

    * docs: storybook provider 추가

    * chore: storybook title 수정

    * chore: decorator로 파일 네이밍 수정

    * feat: renderRef를 추가하여 null로 업데이트 시 렌더링 이슈 해결

    * chore: image format declare

    * refactor: clear timeout logic 수정

    * chore: Timeout type shared로 이동하여 삭제

commit 38ef230
Author: Lee jin <[email protected]>
Date:   Tue Sep 24 05:26:45 2024 +0900

    [ Feat ] Modal 공통컴포넌트 구현 (#44)

    * feat: Modal 컴포넌트 구현

    * feat: focus trap 추가

    * feat: Modal Storybook 추가

    * fix: CI 빌드 에러 해결

    * fix: 사용하지 않는 import 제거

    * fix: CI 빌드 에러 해결

commit 6582c59
Author: ptyoiy <[email protected]>
Date:   Sun Sep 22 17:46:24 2024 +0900

    [ Feat ] alarm list component 구현 (#41)

    * feat: alarm list 컴포넌트 구현, 헤더 내부 컴포넌트 수정

    * fix: page에 임시로 use client 사용

    * refactor: useOutsideClick 훅 esc키로도 작동하게 수정

    * chore: 주석 추가, css 순서별 개행

    * refactor: 코리 반영 (jsx구조, 변수명 수정)

    * refactor: 코리 반영(shared 이동, 매개변수명 수정, 간격 조정, globalStyle 추가))

    * fix: storybook 버그 수정

    * chore: 스크롤바 style theme으로 이동

* refactor: 옵저버 공통 hook으로 이동, 잘못된 버튼 구현 수정

* Squashed commit of the following:

commit a26a410
Author: HwangDo <[email protected]>
Date:   Thu Oct 3 21:04:39 2024 +0900

    [ Feat ] Add common-input component (#38)

    * feat: Add common-input component

    * fix: add 'use client' and update prop types

    * refactor: Apply comments

    * Add : Add component's to storyBook

    * chore: update textarea's figma url

    * style: bar 제거 및 ErrorInfo 컴포넌트 분리

    * chore: Organize imports and add story

    * Apply comments

    * Remove unused code

    * Remove useless fragment

    * style: Change focus-within to focus

    * style: Seperate supportingText from  components

    * style: Seperate supportingText from  components

commit 45a2edc
Author: Lee jin <[email protected]>
Date:   Thu Oct 3 21:02:43 2024 +0900

    [ Fix ] 리뷰어 자동할당 (#69)

    * fix: 리뷰어 자동할당

    * fix: CI 빌드에러 해결

commit f48ca35
Author: HwangDo <[email protected]>
Date:   Thu Oct 3 21:02:06 2024 +0900

    [ Fix ] Format-on-save가 정상 작동하게 수정 (#71)

    * fix: Fix broken format-on-save for biome

    * Fix Tabgroup format

* fix: format

* fix: format

* [ Feat ] pagination component 구현 (#62)

* feat: pagination 컴포넌트 구현 (7칸+버튼2칸)

* refactor: 페이지 번호 생성 함수 개선

* chore: 안쓰는 코드 제거

* docs: story 작성

* docs: 스토리 업데이트

* style: 버튼에 cursor: pointer 추가

* refactor: page 생성 함수 분리

* refactor: 코리 반영(변수명, 파일 분리)

* refactor: 코리 반영 (범위 함수 [close, open) 방식으로 변경)

* fix: ci error

* [ Refactor ] Menu 컴포넌트 분리 (#52)

* feat: Menu 컴포넌트 공통 컴포넌트로 분리

* feat: storybook @example 부분 syntax highlight 적용

* refactor: 코드리뷰 반영, Menu 컴포넌트 개선

* docs: Menu, Dropdown 스토리 업데이트

* Squashed commit of the following:

commit 566d877
Author: ptyoiy <[email protected]>
Date:   Sat Oct 5 05:11:00 2024 +0900

    [ Feat ] pagination component 구현 (#62)

    * feat: pagination 컴포넌트 구현 (7칸+버튼2칸)

    * refactor: 페이지 번호 생성 함수 개선

    * chore: 안쓰는 코드 제거

    * docs: story 작성

    * docs: 스토리 업데이트

    * style: 버튼에 cursor: pointer 추가

    * refactor: page 생성 함수 분리

    * refactor: 코리 반영(변수명, 파일 분리)

    * refactor: 코리 반영 (범위 함수 [close, open) 방식으로 변경)

    * fix: ci error

commit 6baf056
Author: ptyoiy <[email protected]>
Date:   Fri Oct 4 03:11:35 2024 +0900

    [ Feat ] onboarding page 구현 및 스토리북 테스트 (#48)

    * feat: onboarding 첫번째 section 구현

    * feat: 두번째 section 구현

    * feat: section scroll 기능 구현

    * feat: 세번째 섹션 구현, css variants 통일, 스크롤 기능 css로 교체

    * style: 이미지 최적화

    * feat: footer 구현, 스크롤 css global에 적용

    * refactor: 접근성 리펙토링

    * fix: route segment storybook 세팅 변경

    * chore: 클라이언트 컴포넌트 영역 적절한 곳으로 변경

    * fix: pnpm run check error

    * refactor: scroll style을 페이지 단으로 이동

    * fix: css 간격 조정, route를 "/"으로 변경

    * chore: 누락된 간격 조정 적용

    * feat: 이미지에 fade-in 효과 적용

    * chore: gitkeep 제거

    * chore: 변수 엑세스 위치 교체

    * Squashed commit of the following:

    commit 1c994ce
    Author: HwangDo <[email protected]>
    Date:   Wed Oct 2 23:38:25 2024 +0900

        [ Refactor ] 모든 파일 일괄 포매터 적용 및 CI 설정

    commit fff7961
    Author: 최주용 <[email protected]>
    Date:   Wed Oct 2 23:02:18 2024 +0900

        [ Feat ] Context를 통한 TabGroup 컴파운드 컴포넌트 구현 (#46)

        * style: list 요소 style none 추가

        * feat: 선택된 tab, 현재 tab variant에 대한 reducer와 context 생성

        * feat: icon과 indicator를 추가한 Tab Item 컴포넌트

        * feat: state, dispatch 커스텀 훅 선언

        * feat: children의 idx를 통해 selected된 id 패널을 렌더링하도록 구현

        * chore: darkMode parameter 추가

        * feat: context를 통한 list, panel, tab, tabs, indicator 상태 공유

        * refactor: setVariant actions 삭제

        * refactor: 추가적인 wai-aria 명시

        * feat: motion layoutId로 transition 시 공통된 애니메이션 적용

        * refactor: tabStyle의 font를 textStyle로 분리

        * refactor: null | undefined를 ! 로 처리

        * chore: tab, panel에 맞는 id prop 추가

    commit f71a72a
    Author: HwangDo <[email protected]>
    Date:   Wed Sep 25 22:36:35 2024 +0900

        [ Feat ] Datepicker 구현  (#51)

        * react-datepicker test v1

        * feat: Implement datepicker

        * refactor: Make props more general

        * chore: CSS 정리

        * add : Add component to story

        ---------

        Co-authored-by: Lee jin <[email protected]>

    commit 1b6639d
    Author: 최주용 <[email protected]>
    Date:   Tue Sep 24 14:05:21 2024 +0900

        [ Feat ] Atom과 Timeout을 통한 Toast 렌더링, ToastProvider 설정 (#50)

        * feat: createPortal을 이용한 Portal 래퍼 컴포넌트 생성

        * feat: Toast 컴포넌트 퍼블리싱

        * chore: 초기 토스트 컨테이너, 토스트 컴포넌트 스타일

        * feat: toast atom, useToast 훅 생성

        * feat: 전역 toast list를 렌더링하는 동시에 onClose 핸들러 전달

        * refactor: 단 하나의 토스트를 띄우도록 변경

        * style: animation keyframe 생성

        * feat: list가 아닌 하나의 toast를 update

        * feat: ref, timeout을 통한 useTimeout 커스텀 훅 생성

        * feat: useTimeout을 통해 show hide 제어 + toast atom을 통한 조건부 토스트 렌더링

        * chore: 불필요 prop 삭제

        * docs: toast story 작성

        * docs: storybook provider 추가

        * chore: storybook title 수정

        * chore: decorator로 파일 네이밍 수정

        * feat: renderRef를 추가하여 null로 업데이트 시 렌더링 이슈 해결

        * chore: image format declare

        * refactor: clear timeout logic 수정

        * chore: Timeout type shared로 이동하여 삭제

    commit 38ef230
    Author: Lee jin <[email protected]>
    Date:   Tue Sep 24 05:26:45 2024 +0900

        [ Feat ] Modal 공통컴포넌트 구현 (#44)

        * feat: Modal 컴포넌트 구현

        * feat: focus trap 추가

        * feat: Modal Storybook 추가

        * fix: CI 빌드 에러 해결

        * fix: 사용하지 않는 import 제거

        * fix: CI 빌드 에러 해결

    commit 6582c59
    Author: ptyoiy <[email protected]>
    Date:   Sun Sep 22 17:46:24 2024 +0900

        [ Feat ] alarm list component 구현 (#41)

        * feat: alarm list 컴포넌트 구현, 헤더 내부 컴포넌트 수정

        * fix: page에 임시로 use client 사용

        * refactor: useOutsideClick 훅 esc키로도 작동하게 수정

        * chore: 주석 추가, css 순서별 개행

        * refactor: 코리 반영 (jsx구조, 변수명 수정)

        * refactor: 코리 반영(shared 이동, 매개변수명 수정, 간격 조정, globalStyle 추가))

        * fix: storybook 버그 수정

        * chore: 스크롤바 style theme으로 이동

    * refactor: 옵저버 공통 hook으로 이동, 잘못된 버튼 구현 수정

    * Squashed commit of the following:

    commit a26a410
    Author: HwangDo <[email protected]>
    Date:   Thu Oct 3 21:04:39 2024 +0900

        [ Feat ] Add common-input component (#38)

        * feat: Add common-input component

        * fix: add 'use client' and update prop types

        * refactor: Apply comments

        * Add : Add component's to storyBook

        * chore: update textarea's figma url

        * style: bar 제거 및 ErrorInfo 컴포넌트 분리

        * chore: Organize imports and add story

        * Apply comments

        * Remove unused code

        * Remove useless fragment

        * style: Change focus-within to focus

        * style: Seperate supportingText from  components

        * style: Seperate supportingText from  components

    commit 45a2edc
    Author: Lee jin <[email protected]>
    Date:   Thu Oct 3 21:02:43 2024 +0900

        [ Fix ] 리뷰어 자동할당 (#69)

        * fix: 리뷰어 자동할당

        * fix: CI 빌드에러 해결

    commit f48ca35
    Author: HwangDo <[email protected]>
    Date:   Thu Oct 3 21:02:06 2024 +0900

        [ Fix ] Format-on-save가 정상 작동하게 수정 (#71)

        * fix: Fix broken format-on-save for biome

        * Fix Tabgroup format

    * fix: format

    * fix: format

commit 0e0cbf7
Author: Lee jin <[email protected]>
Date:   Fri Oct 4 03:08:43 2024 +0900

    [ Feat ] EditAvatar 구현 + storybook (#66)

    * feat: EditAvatar UI구현

    * feat: EditAvatar 구현

    * feat: EditAvatar storybook 작성

    * feat: onImageChange 추가

    * fix: CI 빌드에러 해결

    * feat: label 추가 및 pickedImage null일 경우 처리

    * fix: fileReader 창 두 번 뜨는 이슈 해결

    * docs: unused import 삭제

    * fix: CI 빌드에러 해결

    * feat: onKeydown 추가

commit a26a410
Author: HwangDo <[email protected]>
Date:   Thu Oct 3 21:04:39 2024 +0900

    [ Feat ] Add common-input component (#38)

    * feat: Add common-input component

    * fix: add 'use client' and update prop types

    * refactor: Apply comments

    * Add : Add component's to storyBook

    * chore: update textarea's figma url

    * style: bar 제거 및 ErrorInfo 컴포넌트 분리

    * chore: Organize imports and add story

    * Apply comments

    * Remove unused code

    * Remove useless fragment

    * style: Change focus-within to focus

    * style: Seperate supportingText from  components

    * style: Seperate supportingText from  components

commit 45a2edc
Author: Lee jin <[email protected]>
Date:   Thu Oct 3 21:02:43 2024 +0900

    [ Fix ] 리뷰어 자동할당 (#69)

    * fix: 리뷰어 자동할당

    * fix: CI 빌드에러 해결

commit f48ca35
Author: HwangDo <[email protected]>
Date:   Thu Oct 3 21:02:06 2024 +0900

    [ Fix ] Format-on-save가 정상 작동하게 수정 (#71)

    * fix: Fix broken format-on-save for biome

    * Fix Tabgroup format

commit 1c994ce
Author: HwangDo <[email protected]>
Date:   Wed Oct 2 23:38:25 2024 +0900

    [ Refactor ] 모든 파일 일괄 포매터 적용 및 CI 설정

commit fff7961
Author: 최주용 <[email protected]>
Date:   Wed Oct 2 23:02:18 2024 +0900

    [ Feat ] Context를 통한 TabGroup 컴파운드 컴포넌트 구현 (#46)

    * style: list 요소 style none 추가

    * feat: 선택된 tab, 현재 tab variant에 대한 reducer와 context 생성

    * feat: icon과 indicator를 추가한 Tab Item 컴포넌트

    * feat: state, dispatch 커스텀 훅 선언

    * feat: children의 idx를 통해 selected된 id 패널을 렌더링하도록 구현

    * chore: darkMode parameter 추가

    * feat: context를 통한 list, panel, tab, tabs, indicator 상태 공유

    * refactor: setVariant actions 삭제

    * refactor: 추가적인 wai-aria 명시

    * feat: motion layoutId로 transition 시 공통된 애니메이션 적용

    * refactor: tabStyle의 font를 textStyle로 분리

    * refactor: null | undefined를 ! 로 처리

    * chore: tab, panel에 맞는 id prop 추가

commit f71a72a
Author: HwangDo <[email protected]>
Date:   Wed Sep 25 22:36:35 2024 +0900

    [ Feat ] Datepicker 구현  (#51)

    * react-datepicker test v1

    * feat: Implement datepicker

    * refactor: Make props more general

    * chore: CSS 정리

    * add : Add component to story

    ---------

    Co-authored-by: Lee jin <[email protected]>

commit 1b6639d
Author: 최주용 <[email protected]>
Date:   Tue Sep 24 14:05:21 2024 +0900

    [ Feat ] Atom과 Timeout을 통한 Toast 렌더링, ToastProvider 설정 (#50)

    * feat: createPortal을 이용한 Portal 래퍼 컴포넌트 생성

    * feat: Toast 컴포넌트 퍼블리싱

    * chore: 초기 토스트 컨테이너, 토스트 컴포넌트 스타일

    * feat: toast atom, useToast 훅 생성

    * feat: 전역 toast list를 렌더링하는 동시에 onClose 핸들러 전달

    * refactor: 단 하나의 토스트를 띄우도록 변경

    * style: animation keyframe 생성

    * feat: list가 아닌 하나의 toast를 update

    * feat: ref, timeout을 통한 useTimeout 커스텀 훅 생성

    * feat: useTimeout을 통해 show hide 제어 + toast atom을 통한 조건부 토스트 렌더링

    * chore: 불필요 prop 삭제

    * docs: toast story 작성

    * docs: storybook provider 추가

    * chore: storybook title 수정

    * chore: decorator로 파일 네이밍 수정

    * feat: renderRef를 추가하여 null로 업데이트 시 렌더링 이슈 해결

    * chore: image format declare

    * refactor: clear timeout logic 수정

    * chore: Timeout type shared로 이동하여 삭제

commit 38ef230
Author: Lee jin <[email protected]>
Date:   Tue Sep 24 05:26:45 2024 +0900

    [ Feat ] Modal 공통컴포넌트 구현 (#44)

    * feat: Modal 컴포넌트 구현

    * feat: focus trap 추가

    * feat: Modal Storybook 추가

    * fix: CI 빌드 에러 해결

    * fix: 사용하지 않는 import 제거

    * fix: CI 빌드 에러 해결

* fix: ci error

* fix: import error

* [ Feat ] Form 공통 컴포넌트 구현 (#57)

* feat: form 공통 컴포넌트 구현

* docs: Form 스토리 작성

* feat: form util 구현

* refactor: form util 매개변수 간소화, 스토리에 form util 적용

* chore: 주석 제거

* refactor: 파일 분리 및 clsx로 교체

* Squashed commit of the following:

commit 7c0dda6
Author: hwangjokim <[email protected]>
Date:   Sun Sep 29 20:58:55 2024 +0900

    style: Seperate supportingText from  components

commit 5a2df10
Author: hwangjokim <[email protected]>
Date:   Sun Sep 29 20:58:05 2024 +0900

    style: Seperate supportingText from  components

commit 27766d2
Author: hwangjokim <[email protected]>
Date:   Sat Sep 28 22:51:38 2024 +0900

    style: Change focus-within to focus

commit 8e7e43e
Author: hwangjokim <[email protected]>
Date:   Sat Sep 28 22:34:00 2024 +0900

    Remove useless fragment

commit 25ec259
Author: hwangjokim <[email protected]>
Date:   Sat Sep 28 22:30:22 2024 +0900

    Remove unused code

commit 6417797
Author: hwangjokim <[email protected]>
Date:   Sat Sep 28 22:26:47 2024 +0900

    Apply comments

commit cba01b3
Merge: 8b997e9 6582c59
Author: hwangjokim <[email protected]>
Date:   Sun Sep 22 22:18:43 2024 +0900

    Merge branch 'main' into init/#5/input-component

commit 8b997e9
Author: hwangjokim <[email protected]>
Date:   Sun Sep 22 22:16:25 2024 +0900

    chore: Organize imports and add story

commit 86b01d2
Author: hwangjokim <[email protected]>
Date:   Sun Sep 22 21:38:05 2024 +0900

    style: bar 제거 및 ErrorInfo 컴포넌트 분리

commit 2406e3c
Author: hwangjokim <[email protected]>
Date:   Sun Sep 22 01:58:53 2024 +0900

    chore: update textarea's figma url

commit 6568fae
Author: hwangjokim <[email protected]>
Date:   Sun Sep 22 01:52:43 2024 +0900

    Add : Add component's to storyBook

commit fe04540
Author: hwangjokim <[email protected]>
Date:   Sun Sep 22 01:44:41 2024 +0900

    refactor: Apply comments

commit a3e8089
Author: hwangjokim <[email protected]>
Date:   Wed Sep 18 16:53:58 2024 +0900

    fix: add 'use client' and update prop types

commit 1087c62
Author: hwangjokim <[email protected]>
Date:   Wed Sep 18 01:12:09 2024 +0900

    feat: Add common-input component

* feat: form description 추가

* docs: 스토리 수정 - SupportingText(FormDescription) 적용

* Squashed commit of the following:

commit f71a72a
Author: HwangDo <[email protected]>
Date:   Wed Sep 25 22:36:35 2024 +0900

    [ Feat ] Datepicker 구현  (#51)

    * react-datepicker test v1

    * feat: Implement datepicker

    * refactor: Make props more general

    * chore: CSS 정리

    * add : Add component to story

    ---------

    Co-authored-by: Lee jin <[email protected]>

* docs: DatePicker 스토리에 적용

* refactor: Form 추상화를 통한 사용법 단순화

* refactor: 재검사 함수 주입 방법 수정, 다양한 재검사 로직 추가

* fix: mode: onTouched 적용

* refactor: Form 컴포넌트 추상화 및 story 작성

* Squashed commit of the following:

commit 6baf056
Author: ptyoiy <[email protected]>
Date:   Fri Oct 4 03:11:35 2024 +0900

    [ Feat ] onboarding page 구현 및 스토리북 테스트 (#48)

    * feat: onboarding 첫번째 section 구현

    * feat: 두번째 section 구현

    * feat: section scroll 기능 구현

    * feat: 세번째 섹션 구현, css variants 통일, 스크롤 기능 css로 교체

    * style: 이미지 최적화

    * feat: footer 구현, 스크롤 css global에 적용

    * refactor: 접근성 리펙토링

    * fix: route segment storybook 세팅 변경

    * chore: 클라이언트 컴포넌트 영역 적절한 곳으로 변경

    * fix: pnpm run check error

    * refactor: scroll style을 페이지 단으로 이동

    * fix: css 간격 조정, route를 "/"으로 변경

    * chore: 누락된 간격 조정 적용

    * feat: 이미지에 fade-in 효과 적용

    * chore: gitkeep 제거

    * chore: 변수 엑세스 위치 교체

    * Squashed commit of the following:

    commit 1c994ce
    Author: HwangDo <[email protected]>
    Date:   Wed Oct 2 23:38:25 2024 +0900

        [ Refactor ] 모든 파일 일괄 포매터 적용 및 CI 설정

    commit fff7961
    Author: 최주용 <[email protected]>
    Date:   Wed Oct 2 23:02:18 2024 +0900

        [ Feat ] Context를 통한 TabGroup 컴파운드 컴포넌트 구현 (#46)

        * style: list 요소 style none 추가

        * feat: 선택된 tab, 현재 tab variant에 대한 reducer와 context 생성

        * feat: icon과 indicator를 추가한 Tab Item 컴포넌트

        * feat: state, dispatch 커스텀 훅 선언

        * feat: children의 idx를 통해 selected된 id 패널을 렌더링하도록 구현

        * chore: darkMode parameter 추가

        * feat: context를 통한 list, panel, tab, tabs, indicator 상태 공유

        * refactor: setVariant actions 삭제

        * refactor: 추가적인 wai-aria 명시

        * feat: motion layoutId로 transition 시 공통된 애니메이션 적용

        * refactor: tabStyle의 font를 textStyle로 분리

        * refactor: null | undefined를 ! 로 처리

        * chore: tab, panel에 맞는 id prop 추가

    commit f71a72a
    Author: HwangDo <[email protected]>
    Date:   Wed Sep 25 22:36:35 2024 +0900

        [ Feat ] Datepicker 구현  (#51)

        * react-datepicker test v1

        * feat: Implement datepicker

        * refactor: Make props more general

        * chore: CSS 정리

        * add : Add component to story

        ---------

        Co-authored-by: Lee jin <[email protected]>

    commit 1b6639d
    Author: 최주용 <[email protected]>
    Date:   Tue Sep 24 14:05:21 2024 +0900

        [ Feat ] Atom과 Timeout을 통한 Toast 렌더링, ToastProvider 설정 (#50)

        * feat: createPortal을 이용한 Portal 래퍼 컴포넌트 생성

        * feat: Toast 컴포넌트 퍼블리싱

        * chore: 초기 토스트 컨테이너, 토스트 컴포넌트 스타일

        * feat: toast atom, useToast 훅 생성

        * feat: 전역 toast list를 렌더링하는 동시에 onClose 핸들러 전달

        * refactor: 단 하나의 토스트를 띄우도록 변경

        * style: animation keyframe 생성

        * feat: list가 아닌 하나의 toast를 update

        * feat: ref, timeout을 통한 useTimeout 커스텀 훅 생성

        * feat: useTimeout을 통해 show hide 제어 + toast atom을 통한 조건부 토스트 렌더링

        * chore: 불필요 prop 삭제

        * docs: toast story 작성

        * docs: storybook provider 추가

        * chore: storybook title 수정

        * chore: decorator로 파일 네이밍 수정

        * feat: renderRef를 추가하여 null로 업데이트 시 렌더링 이슈 해결

        * chore: image format declare

        * refactor: clear timeout logic 수정

        * chore: Timeout type shared로 이동하여 삭제

    commit 38ef230
    Author: Lee jin <[email protected]>
    Date:   Tue Sep 24 05:26:45 2024 +0900

        [ Feat ] Modal 공통컴포넌트 구현 (#44)

        * feat: Modal 컴포넌트 구현

        * feat: focus trap 추가

        * feat: Modal Storybook 추가

        * fix: CI 빌드 에러 해결

        * fix: 사용하지 않는 import 제거

        * fix: CI 빌드 에러 해결

    commit 6582c59
    Author: ptyoiy <[email protected]>
    Date:   Sun Sep 22 17:46:24 2024 +0900

        [ Feat ] alarm list component 구현 (#41)

        * feat: alarm list 컴포넌트 구현, 헤더 내부 컴포넌트 수정

        * fix: page에 임시로 use client 사용

        * refactor: useOutsideClick 훅 esc키로도 작동하게 수정

        * chore: 주석 추가, css 순서별 개행

        * refactor: 코리 반영 (jsx구조, 변수명 수정)

        * refactor: 코리 반영(shared 이동, 매개변수명 수정, 간격 조정, globalStyle 추가))

        * fix: storybook 버그 수정

        * chore: 스크롤바 style theme으로 이동

    * refactor: 옵저버 공통 hook으로 이동, 잘못된 버튼 구현 수정

    * Squashed commit of the following:

    commit a26a410
    Author: HwangDo <[email protected]>
    Date:   Thu Oct 3 21:04:39 2024 +0900

        [ Feat ] Add common-input component (#38)

        * feat: Add common-input component

        * fix: add 'use client' and update prop types

        * refactor: Apply comments

        * Add : Add component's to storyBook

        * chore: update textarea's figma url

        * style: bar 제거 및 ErrorInfo 컴포넌트 분리

        * chore: Organize imports and add story

        * Apply comments

        * Remove unused code

        * Remove useless fragment

        * style: Change focus-within to focus

        * style: Seperate supportingText from  components

        * style: Seperate supportingText from  components

    commit 45a2edc
    Author: Lee jin <[email protected]>
    Date:   Thu Oct 3 21:02:43 2024 +0900

        [ Fix ] 리뷰어 자동할당 (#69)

        * fix: 리뷰어 자동할당

        * fix: CI 빌드에러 해결

    commit f48ca35
    Author: HwangDo <[email protected]>
    Date:   Thu Oct 3 21:02:06 2024 +0900

        [ Fix ] Format-on-save가 정상 작동하게 수정 (#71)

        * fix: Fix broken format-on-save for biome

        * Fix Tabgroup format

    * fix: format

    * fix: format

commit 0e0cbf7
Author: Lee jin <[email protected]>
Date:   Fri Oct 4 03:08:43 2024 +0900

    [ Feat ] EditAvatar 구현 + storybook (#66)

    * feat: EditAvatar UI구현

    * feat: EditAvatar 구현

    * feat: EditAvatar storybook 작성

    * feat: onImageChange 추가

    * fix: CI 빌드에러 해결

    * feat: label 추가 및 pickedImage null일 경우 처리

    * fix: fileReader 창 두 번 뜨는 이슈 해결

    * docs: unused import 삭제

    * fix: CI 빌드에러 해결

    * feat: onKeydown 추가

commit a26a410
Author: HwangDo <[email protected]>
Date:   Thu Oct 3 21:04:39 2024 +0900

    [ Feat ] Add common-input component (#38)

    * feat: Add common-input component

    * fix: add 'use client' and update prop types

    * refactor: Apply comments

    * Add : Add component's to storyBook

    * chore: update textarea's figma url

    * style: bar 제거 및 ErrorInfo 컴포넌트 분리

    * chore: Organize imports and add story

    * Apply comments

    * Remove unused code

    * Remove useless fragment

    * style: Change focus-within to focus

    * style: Seperate supportingText from  components

    * style: Seperate supportingText from  components

commit 45a2edc
Author: Lee jin <[email protected]>
Date:   Thu Oct 3 21:02:43 2024 +0900

    [ Fix ] 리뷰어 자동할당 (#69)

    * fix: 리뷰어 자동할당

    * fix: CI 빌드에러 해결

commit f48ca35
Author: HwangDo <[email protected]>
Date:   Thu Oct 3 21:02:06 2024 +0900

    [ Fix ] Format-on-save가 정상 작동하게 수정 (#71)

    * fix: Fix broken format-on-save for biome

    * Fix Tabgroup format

commit 1c994ce
Author: HwangDo <[email protected]>
Date:   Wed Oct 2 23:38:25 2024 +0900

    [ Refactor ] 모든 파일 일괄 포매터 적용 및 CI 설정

commit fff7961
Author: 최주용 <[email protected]>
Date:   Wed Oct 2 23:02:18 2024 +0900

    [ Feat ] Context를 통한 TabGroup 컴파운드 컴포넌트 구현 (#46)

    * style: list 요소 style none 추가

    * feat: 선택된 tab, 현재 tab variant에 대한 reducer와 context 생성

    * feat: icon과 indicator를 추가한 Tab Item 컴포넌트

    * feat: state, dispatch 커스텀 훅 선언

    * feat: children의 idx를 통해 selected된 id 패널을 렌더링하도록 구현

    * chore: darkMode parameter 추가

    * feat: context를 통한 list, panel, tab, tabs, indicator 상태 공유

    * refactor: setVariant actions 삭제

    * refactor: 추가적인 wai-aria 명시

    * feat: motion layoutId로 transition 시 공통된 애니메이션 적용

    * refactor: tabStyle의 font를 textStyle로 분리

    * refactor: null | undefined를 ! 로 처리

    * chore: tab, panel에 맞는 id prop 추가

commit f71a72a
Author: HwangDo <[email protected]>
Date:   Wed Sep 25 22:36:35 2024 +0900

    [ Feat ] Datepicker 구현  (#51)

    * react-datepicker test v1

    * feat: Implement datepicker

    * refactor: Make props more general

    * chore: CSS 정리

    * add : Add component to story

    ---------

    Co-authored-by: Lee jin <[email protected]>

* feat: date type 전용 라벨 추가, date type story 작성

* chore: 주석, 타입 수정

* fix: format

* chore: 변경 line 수 축약

* fix: ci error

* fix: type error

* refactor: 코리 반영 (파일 분리, context 제거)

* fix: ci error

* fix: ci error

* Update index.tsx

* [ Style ] Button 디자인 마이그레이션 (#85)

* [ Feat ] Sidebar 컴포넌트 구현 및 탭 Icon prop 방식 수정 (#67)

* chore: use client 처리 + 추가 스타일

* refactor: panel을 요소 그대로 clone하여 prop 추가한 후 렌더링

* style: userSelect none 추가

* feat: renderProp을 통해 icon 주입

* feat: Sidebar 퍼블리싱

* chore: globalStyle import

* refactor: Tab renderedIcon 적용

* chore: story 수정

* fix: formatter

* [ Feat ] 다중 항목에 대한 Carousel 컴포넌트 퍼블리싱 (#73)

* feat: currentIndex, itemRef 설정하여 viewing 슬라이드 관리

* feat: currentIndex 시 자신으로 ref 교체

* feat: Arrow 컴포넌트 분리

* chore: svg 교체

* chore: slider wrapper pos absolute

* feat: query matchs 여부에 따른 callback 실행하는 커스텀 훅 생성

* chore: 주석 추가

* feat: media match 여부에 따른 sliding count 변경

* chore: formatter apply

* feat: 마지막 index view에서는 right arrow도 사라지도록 수정

* chore: currentIndex 비교 연산 상수화

* refactor: viewport에 따른 slideCount 수정

* [ Feat ] profile image type 추가 및 field props 통합 (#84)

* feat: profile image type 추가 및 field props 통합

* fix: textarea에 clsx 적용

* [ Feat ] JoinGroup 퍼블리싱 (#75)

* docs: btn_delete svg 추가

* fix: Modal 배경색 transparent 로 변경

* feat: Modal Container 구현

* feat: GroupInfoCard 구현

* feat: DecisionPrompt 구현

* feat: 버튼 퍼블리싱

* refactor: 코드리뷰 반영

* chore: p태그로 롤백

* chore: h1 태그 사용

* chore: 코드리뷰 반영

* refactor: Modal CloseBtn 추가

* fix: 변수 네이밍 컨벤션 지키기

* [ Refactor ] api 폴더구조 리팩토링 (#92)

* refactor: src/api 폴더구조 리팩토링

* chore: console 주석 처리

* fix: import 경로 수정

* feat: README 업데이트

* feat: README 업데이트

* [ Feat ] Problem List Item 컴포넌트 퍼블리싱 (#87)

* feat: common checkbox publishing

* chore: playground story 추가

* feat: tier image 반환하는 유틸 함수 작성

* feat: create tier, tier detail type

* feat: list, item 컴포넌트 퍼블리싱

* refactor: date format change

* chore: item component use client

* style: ellipsis 적용

* chore: span -> time tag

* chore: aria-label 반영

* [ Feat ] CreateGroup + GroupInfoForm (#89)

* docs: btn_delete svg 추가

* fix: Modal 배경색 transparent 로 변경

* feat: Modal Container 구현

* feat: GroupInfoCard 구현

* feat: DecisionPrompt 구현

* feat: 버튼 퍼블리싱

* refactor: 코드리뷰 반영

* feat: EditAvatar 추가

* feat: 스터디 이름 Form

* feat: Date Form

* feat: Flex 컴포넌트 구현

* feat: className, props 추가

* fix: date schema 변경

* feat: formatDate 함수 구현

* feat: Date Form  추가

* feat: Desc Form 추가

* feat: 에러 supportingText 추가

* docs: 불필요한 파일 삭제

* feat: profile image type 추가 및 field props 통합

* fix: textarea에 clsx 적용

* feat: #82 반영사항 적용

* feat: 성공 toast 추가

* feat: LinkWithCopy 구현

* fix: form import 경로 수정

* fix: date 기본값 삭제

* refactor: 시맨틱 태그 변경

* chore: Modal 수정사항 반영

* feat: ToastProvider 추가 및 클립보드 복사 아이콘 변경

* refactor: 코드리뷰 반영

---------

Co-authored-by: ptyoiy <[email protected]>

* [ Feat ] 라우트 이동을 관리하는 NavBar 컴포넌트 퍼블리싱 (#90)

* feat: navBar by routing publishing

* feat: Item NavBar Object로 assign

* docs: metadata 추가

* refactor: router.push -> Link

* refactore: 불필요한 prop 제거 및 상수화

* [ Feat ] Login page 구현 (#93)

* feat: 로그인 페이지 구현, 유효성 검사 적용

* fix: format error

* feat: favicon 설정 (#96)

* [ Feat ] table 구현 (#94)

* feat: 기본 테이블 요소 구현

* feat: 테이블 header 구현

* feat: 테이블 body 구현

* refactor: 컴포넌트 구조 통합 및 폴더구조 컨벤션 적용

* style: text style 및 상태 아이콘 추가

* style: 간격 조정

* style: 알림 설정 style 추가

* chore: style 변경 누락

* style: 속성명 통합(align), column 타입 간소화

* docs: 스토리 작성

* chore: 안쓰는 패키지 제거, 타입명 수정

* fix: format error

* chore: type.ts 이동

* [ Feat ] 모든 페이지의 Sidebar 퍼블리싱 (#101)

* feat: UserPage-Dashboard Sidebar 퍼블리싱

* feat: UserPage-Setting Sidebar 퍼블리싱

* feat: GroupPage-Dashboard Sidebar 퍼블리싱

* fix: MemberAvatar 활용

* feat: 모든 페이지에 sidebar 추가

* feat: RoleChip 추가

* fix: CI 빌드에러 해결

* refactor: 코드리뷰 반영

* refactor: ts-pattern 사용

* refactor: 코드리뷰 반영

* refactor: page 컴포넌트 main 태그로 변경

* [ Fix ] onboarding-section3의 이미지 레이아웃 문제 해결 (#103)

* fix: section3, main layout

* fix: back color

* fix: merge error

* [ Refactor ] 폴더 구조

* Revert "[ Fix ] onboarding-section3의 이미지 레이아웃 문제 해결 (#103)"

This reverts commit c4f654c.

* Revert "[ Refactor ] 폴더 구조"

This reverts commit b9d8a36.

* [ Refactor ] 폴더 구조

* [ Fix ] onboarding section1, 폴더 구조 (#110)

* fix: section3, main layout

* fix: back color

* fix: merge error

* refactor: 폴더구조 컨벤션 적용

* fix: import error

* refactor: modal에 dynamic import 적용

* fix: ssr error

* fix: build, start 시 globalStyle 적용 안되는 이슈

* [ Feat ] instagram, mail 링크 추가 (#113)

* feat: instagram, mail 링크 추가

* fix: CI 빌드에러 해결

---------

Co-authored-by: 최주용 <[email protected]>
Co-authored-by: ptyoiy <[email protected]>
Co-authored-by: HwangDo <[email protected]>
Co-authored-by: hwangjokim <[email protected]>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Reviewers

@ptyoiy ptyoiy ptyoiy approved these changes

@hwangjokim hwangjokim hwangjokim approved these changes

@j-nary j-nary Awaiting requested review from j-nary

Assignees

@wuzoo wuzoo

Labels
✨ Feat 새로운 기능 구현 size/s WUZ 최주용
Projects
None yet
Milestone
No milestone
Development

Successfully merging this pull request may close these issues.

Toggle Button 컴포넌트 퍼블리싱
4 participants
@wuzoo @ptyoiy @j-nary @hwangjokim