페이지 헤더

안정composite

화면 맨 위 제목 줄입니다. 제목·배지·설명과 오른쪽 버튼이 들어갑니다.

@tissue-ui/layout-react

설치

bash
npm install @tissue-ui/layout-react
tsx
import { PageHeader } from "@tissue-ui/layout-react";

언제 쓰나

  • 화면 최상단에 제목·설명과 주요 액션을 함께 배치할 때.

예제

제목 + 배지 + 액션

사용자

12

워크스페이스 구성원을 관리합니다.

제목 + 설명
배지·액션 없이 제목과 설명만.

결제 내역

지난 12개월간의 결제 기록입니다.

액션 여럿
오른쪽에 보조·주요 버튼을 나란히 둡니다.

주문 상세

제목만

설정

속성

속성타입설명
titlestring화면 제목입니다.
titleSuffixnode제목 옆에 붙이는 것입니다 (보통 배지).
descriptionstring제목 아래 짧은 설명입니다 (선택).
actionsnode오른쪽에 놓는 버튼들입니다.

위 옵션 말고도 className·onClick 같은 일반 HTML 속성을 그대로 넘길 수 있습니다.

상태
default
이 페이지의 옵션·상태는 실제 코드 정의에서 그대로 가져온 것입니다. 에이전트는 같은 내용을 llms.txt 로 읽습니다.