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

Re-implement Switch component using Switch in Radix UI #711

Closed
Tracked by #1105
, #983
...
sungik-choi opened this issue Jan 28, 2022 · 1 comment · Fixed by #1002
Closed
Tracked by #1105
, #983
...

Re-implement Switch component using Switch in Radix UI #711

sungik-choi opened this issue Jan 28, 2022 · 1 comment · Fixed by #1002
Assignees
@Dogdriip
Labels
a11y Issue or PR related to accessibility enhancement Issues or PR related to making existing features better #reimplementation Issue or PR related to Reimplementation of existing components (#1105)

Comments

@sungik-choi
Copy link
Contributor

sungik-choi commented Jan 28, 2022 •
edited
Loading

현재 상황

현재 Switch 컴포넌트는 단순 div 엘리먼트로 구현되어있습니다.

문제점

의미없는 div 엘리먼트여서 발생하는 문제점들이 있습니다.

  1. 시맨틱하지 않습니다.
  2. 키보드 접근이 되지 않습니다.
  3. 키보드를 통한 조작이 불가합니다.

어떻게 개선할 수 있는지

Switch 컴포넌트는 형태가 다를 뿐, 하나의 체크박스와 UX가 동일합니다. 체크박스를 커스텀 스타일링한 방식으로 구현을 변경해야합니다.

업데이트 (2022.11.09)

Reference
@sungik-choi sungik-choi added the enhancement Issues or PR related to making existing features better label Jan 28, 2022
@sungik-choi sungik-choi changed the title Switch 컴포넌트 구현을 input checkbox 로 변경 Switch 컴포넌트 구현을 input checkbox 엘리먼트로 변경 Jan 28, 2022
@sungik-choi sungik-choi added the a11y Issue or PR related to accessibility label Feb 3, 2022
@sungik-choi sungik-choi added this to the 1.0.0 milestone Apr 28, 2022
@sungik-choi sungik-choi mentioned this issue Apr 29, 2022
Closed
8 tasks
@sungik-choi sungik-choi removed this from the 1.0.0 milestone May 18, 2022
@sungik-choi sungik-choi mentioned this issue Jun 29, 2022
Merged
8 tasks
@Dogdriip Dogdriip self-assigned this Jun 29, 2022
@Dogdriip
Copy link
Contributor

Dogdriip commented Jul 4, 2022

참고: https://www.w3schools.com/howto/howto_css_switch.asp

@Dogdriip Dogdriip mentioned this issue Jul 8, 2022
Merged
11 tasks
@sungik-choi sungik-choi changed the title Switch 컴포넌트 구현을 input checkbox 엘리먼트로 변경 Re-implement Switch component using Switch in Radix UI Nov 9, 2022
@sungik-choi sungik-choi mentioned this issue Nov 9, 2022
Closed
@sungik-choi sungik-choi moved this to Q4 2022 in Bezier React Nov 9, 2022
@Dogdriip Dogdriip mentioned this issue Nov 10, 2022
Merged
8 tasks
Repository owner moved this from Q4 2022 to Future in Bezier React Dec 5, 2022
@sungik-choi sungik-choi moved this from Future to Q4 2022 in Bezier React Dec 5, 2022
@sungik-choi sungik-choi moved this from 📌 Backlog to ✅ Done in Bezier React Jan 17, 2023
@sungik-choi sungik-choi added the #reimplementation Issue or PR related to Reimplementation of existing components (#1105) label Jan 17, 2023
@sungik-choi sungik-choi mentioned this issue Jan 17, 2023
Closed
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Assignees

@Dogdriip Dogdriip

Labels
a11y Issue or PR related to accessibility enhancement Issues or PR related to making existing features better #reimplementation Issue or PR related to Reimplementation of existing components (#1105)
Projects
No open projects
Bezier React
Archived in project
Milestone
No milestone
Development

Successfully merging a pull request may close this issue.

Apply @radix-ui/react-switch primitives to Switch component Dogdriip/bezier-react
3 participants
@Dogdriip @rktguswjd @sungik-choi