단지 목록 카드

제목 · 한 줄 부제 · 단지 줄 몇 개를 담는 카드예요. 같은 라벨은 묶음 머리에 한 번, 5줄 뒤는 더 보기 안에 접히고(링크는 그대로), 줄 사이는 8px이에요.

모바일PCPickRows · PickList실제 데이터 · 2026-11 기준

고르기#

이 부품을 언제 쓰고, 언제 다른 것을 쓰는지예요.

제목 있는 카드에 단지 줄을 여러 개 담을 때 써요. 줄은 이름·값·메타 한 줄이고, 같은 라벨은 묶음 머리(group)에 한 번, 5줄 뒤는 더 보기(visible)로 접되 링크는 그대로, 줄 사이는 8px이에요.

아래 이름들은 이 부품의 별칭·프리셋이에요. 새로 쓸 때는 PickList · PickRows를 써요.

타입에서 자동으로 뽑은 표예요.

속성	기본값	타입	설명
rows*	-	PickRow[]
visible	PICK_VISIBLE	number	펼쳐 보이는 줄 수 - 나머지는 '더 보기' 안(서버 HTML에 그대로). 0 이하면 모두 펼친다.
cols	-	boolean	격자로 펼칠지(항목이 많을 때). 기본은 세로 한 줄씩.
className	-	string	배치용 클래스예요. 모양(색·크기)은 덮어쓰지 않아요.

속성	기본값	타입	설명
title*	-	string	마우스를 올리면 뜨는 설명이에요. label이 없으면 이름으로도 써요.
sub	-	string	부제 - 한 줄(범위·정렬 기준만). 긴 설명은 페이지의 '설명' 접힘에.
rows*	-	PickRow[]
note	-	string	목록 아래 조건 메모 한 줄(투자 고지는 넣지 않는다 - 고지는 푸터 한 곳).
footer	-	ReactNode
ai	-	boolean	AI 산출물인가 - 글로우 셸과 제목 그라디언트가 켜진다.
cols	-	boolean
visible	PICK_VISIBLE	number
className	-	string	배치용 클래스예요. 모양(색·크기)은 덮어쓰지 않아요.

* 필수예요. 표는 타입에서 자동으로 뽑았어요.

플랫폼별 차이
플랫폼	차이
모바일	PC와 같은 모양이에요. 글자 역할만 폰 크기로 바뀌어요.
PC	마우스가 있는 기기에서만 hover가 켜지고, 키보드 초점 링이 보여요.