도움 패널

도움 패널은 본문 콘텐츠의 섹션이나 일부 요소에 대한 개념/용어 설명, 옵션의 구성, 이용 방법 등과 관련된 정보나 도움말 콘텐츠를 제공하는 사이드 패널이다.

도움 패널은 본문 콘텐츠의 섹션이나 일부 요소에 대한 개념/용어 설명, 옵션의 구성, 이용 방법 등과 관련된 정보나 도움말 콘텐츠를 제공하는 사이드 패널이다.

사용 지침

복잡한 신청 폼·관리자 화면의 부수적 안내가 필요한 경우 우측 영역에 토글 패널로 배치하고, 본문 흐름을 가리지 않도록 닫기 동작을 명확히 제공합니다.

예제

Default

examples/help-panel/HelpPanelDefault.tsx
"use client"

import { Button } from "@/components/ui/dynamic/button"

With Tabs

examples/help-panel/HelpPanelWithTabs.tsx
"use client"

import { Button } from "@/components/ui/dynamic/button"

속성

이름타입기본값설명
absoluteStrokeWidthboolean
aria-labelstringDefines a string value that labels the current element. @see aria-labelledby.
classNamestring
idstring
onClickMouseEventHandler<SVGSVGElement>
sizestring | number
styleCSSProperties
tabIndexnumber
typestring