Navigation

Submenu

화면 내 각 섹션으로 이동할 수 있는 서브메뉴 컴포넌트입니다. SubmenuButton 리스트를 포함하며, 클릭 시 해당 섹션으로 스크롤 이동합니다.

import { Submenu } from "@/shared/ui/widget/navigation"

인터랙티브 데모

Active Item

tsx

<Submenu
  items={items}
  activeId="company"
  onItemClick={(targetId) => setActiveId(targetId)}
/>

기본 사용과 활성 상태 예시입니다.

개별 버튼의 Default / Active 상태입니다.

Prop	Type	Required	Default	설명
`items`	`SubmenuItem[]` interface SubmenuItem { label: string; targetId: string; }	✓	—	메뉴 아이템 목록
`activeId`	`string`	—	—	현재 활성 아이템의 targetId
`onItemClick`	`(targetId: string) => void`	—	—	아이템 클릭 시 콜백
`className`	`string`	—	—	추가 CSS 클래스

Prop	Type	Required	Default	설명
`label`	`string`	✓	—	버튼 라벨 텍스트
`active`	`boolean`	—	false	활성 상태 여부 (텍스트 색상 변경)
`onClick`	`() => void`	—	—	클릭 핸들러
`className`	`string`	—	—	추가 CSS 클래스