Tables

table, .prop-name, .type-badge, .default-val

데이터를 표 형식으로 표시하기 위한 테이블 스타일입니다.

Basic Table

기본적인 데이터 테이블 스타일입니다.

이름	역할	상태
김철수	프론트엔드 개발자	활성
이영희	백엔드 개발자	활성
박지민	디자이너	대기

Simple Data Table

doc-system 클래스 내부에서 자동으로 스타일이 적용됩니다.

<table>
    <thead>
        <tr>
            <th>이름</th>
            <th>역할</th>
            <th>상태</th>
        </tr>
    </thead>
    <tbody>
        <tr>
            <td>김철수</td>
            <td>프론트엔드 개발자</td>
            <td><span class="badge primary">활성</span></td>
        </tr>
    </tbody>
</table>

API Documentation Table

컴포넌트 API 문서에 사용되는 특수 스타일입니다.

속성명	타입	기본값	설명
size	string	'md'	컴포넌트의 크기를 지정합니다.
disabled	boolean	false	비활성화 상태를 설정합니다.
onChange	function	undefined	값이 변경될 때 호출되는 콜백 함수입니다.

Props Table

prop-name, type-badge, default-val 클래스로 스타일을 적용합니다.

<td><span class="prop-name">size</span></td>
<td><span class="type-badge">string</span></td>
<td><span class="default-val">'md'</span></td>

Events Table

이벤트 문서화를 위한 테이블 예제입니다.

이벤트	Payload	설명
click	MouseEvent	요소를 클릭했을 때 발생합니다.
change	{ value: any }	값이 변경되었을 때 발생합니다.
focus	FocusEvent	요소가 포커스를 받았을 때 발생합니다.
blur	FocusEvent	요소에서 포커스가 벗어났을 때 발생합니다.

Slots Table

슬롯 문서화를 위한 테이블 예제입니다.

슬롯	설명
default	기본 콘텐츠 영역입니다.
header	상단 헤더 영역입니다.
footer	하단 푸터 영역입니다.
icon	아이콘을 배치할 영역입니다.