• Dropdown Menu
  • 버튼 클릭 시 메뉴 리스트가 보여야 한다.
  • 외부를 클릭 시 리스트가 사라져야 한다.
  • 드롭다운 메뉴에 disabled 속성 사용 시 메뉴가 비활성화 되어야 한다.
  • 메뉴 리스트에 disabled 속성 사용 시 해당 리스트가 비활성화 되어야 한다.
  • 키보드(방향키)를 이용해 드롭다운 메뉴를 선택할 수 있어야 한다. (어려우므로, 후순위)
• Select ←기능적으로는 완성 ⇒ 코드리뷰
  • 버튼 클릭 시 옵션 리스트가 보여야 한다.
  • 외부를 클릭 시 리스트가 사라져야 한다.
  • form 내에서 required 속성 사용 시, 옵션을 선택하지 않은 경우 error를 띄워야 한다.
  • 옵션 리스트에 disabled 속성 사용 시 해당 옵션이 비활성화 되어야 한다.
  • 셀렉트에 disabled 속성 사용 시 셀렉트박스가 비활성화 되어야 한다.
  • 키보드(방향키)를 이용해 셀렉트 박스를 선택할 수 있어야 한다. (어려우므로, 후순위)
• Combobox
  • 검색이 가능해야 함
  • 검색어 일부를 입력 후 엔터키 누르면 가장 유사한 옵션으로 선택되어야 한다. 없을 시 빈값으로 변경되어야 한다. ⇒ 맨 앞에서부터 단어 일치여부 검증
  • 옵션 클릭 시 선택된 옵션이 input값에 자동 완성 되어야 한다.
  • 버튼 클릭 시 옵션 리스트가 보여야 한다.
  • 외부 클릭 시 리스트가 사라져야 한다.
• Toggle
  • 클릭 시 반대 값으로 변경되어야 한다.
  • 토글에 disabled 속성 사용 시 토글이 비활성화 되어야 한다.
• Modal
  • 외부를 클릭하거나 닫기 버튼 또는 ESC 클릭 시 모달창이 닫혀야 한다.
  • 내부에 텍스트 및 버튼이 포함될 수 있다.
  • 외부 컴포넌트에 관계 없이 모달 컴포넌트는 항상 최상단 노드에 위치해야 한다. ⇒ React Portal 이용
• Tabs
  • 탭 버튼 클릭 시 활성화된 버튼 강조 표시가 되어야 한다.
  • 탭 버튼 클릭 시 해당 탭 콘텐츠가 노출되어야 한다.
  • 활성화된 탭 기본 값이 있어야 한다.
  • 탭에 텍스트 또는 아이콘, 이미지를 포함할 수 있다.