File name
Commit message
Commit date
File name
Commit message
Commit date
File name
Commit message
Commit date
import type { ReactNode } from "react";
/**
* 컴포넌트 예제 하나. 사이드바의 "컴포넌트" 분류에 항목으로 뜬다.
*/
export interface ComponentExample {
/** 해시 링크와 React key에 쓰이는 식별자. kebab-case. */
id: string;
/** 사이드바에 표시할 이름. */
name: string;
/** 한 줄 설명 (선택). */
description?: string;
/**
* 이 컴포넌트가 가질 수 있는 상태들. variant·size·disabled처럼 **눈으로 비교해야 하는
* 조합을 빠짐없이** 넣는다 — 예제가 곧 회귀 확인 수단이다.
*/
variants: { label: string; node: ReactNode }[];
}
/**
* 컴포넌트를 만들 때마다 여기에 한 항목씩 추가한다. 사이드바·본문은 이 배열만 보고
* 그리므로 다른 파일을 고칠 필요가 없다.
*
* ```tsx
* import { Button } from "../core/components/button";
*
* export const COMPONENT_EXAMPLES: ComponentExample[] = [
* {
* id: "button",
* name: "Button",
* description: "기본 액션 버튼",
* variants: [
* { label: "primary", node: <Button variant="primary">확인</Button> },
* { label: "disabled", node: <Button disabled>확인</Button> },
* ],
* },
* ];
* ```
*/
export const COMPONENT_EXAMPLES: ComponentExample[] = [];