지표 묶음
상세의 라벨 · 값 줄을 작은 제목 아래로 묶어요. 빈 칸은 저절로 빠져요.
모바일PCStatCell · SubHead · StatSection · StatGroup
고르기#
- 이 이름은 스탯 행(StatRow)에 합쳤어요. 모양은 그대로이고, 새로 쓸 때는 정본을 써요.
스탯 행 문서 보기 →
인터페이스#
타입에서 자동으로 뽑은 표예요.
StatCell#
| 속성 | 기본값 | 타입 | 설명 |
|---|---|---|---|
| k* | - | ReactNode | |
| v* | - | ReactNode | |
| g | - | string | |
| chip | - | string | |
| color | - | string |
SubHead#
| 속성 | 기본값 | 타입 | 설명 |
|---|---|---|---|
| title* | - | ReactNode | 마우스를 올리면 뜨는 설명이에요. label이 없으면 이름으로도 써요. |
| hint | - | ReactNode | 값 아래 한 줄이에요. |
StatSection#
| 속성 | 기본값 | 타입 | 설명 |
|---|---|---|---|
| title* | - | ReactNode | 마우스를 올리면 뜨는 설명이에요. label이 없으면 이름으로도 써요. |
| hint | - | ReactNode | 값 아래 한 줄이에요. |
| children* | - | ReactNode | 안에 그릴 내용이에요. |
StatGroup#
| 속성 | 기본값 | 타입 | 설명 |
|---|---|---|---|
| title* | - | string | 마우스를 올리면 뜨는 설명이에요. label이 없으면 이름으로도 써요. |
| hint | - | ReactNode | 값 아래 한 줄이에요. |
| cells* | - | ReactNode[] |
* 필수예요. 표는 타입에서 자동으로 뽑았어요.
접근성#
- 라벨과 값이 한 줄 글자로 읽혀요.
플랫폼별 차이#
| 플랫폼 | 차이 |
|---|---|
| 모바일 | PC와 같은 모양이에요. 글자 역할만 폰 크기로 바뀌어요. |
| PC | 마우스가 있는 기기에서만 hover가 켜지고, 키보드 초점 링이 보여요. |