@hua-labs/ui 1.0.0 → 1.1.0-alpha.0.2

package/dist/components/ActionToolbar.d.ts

@@ -0,0 +1,65 @@
+import React from 'react';
+import type { IconName } from '../lib/icons';
+/**
+ * ActionButton 인터페이스
+ * @typedef {Object} ActionButton
+ * @property {string} label - 버튼 라벨 (데스크톱)
+ * @property {string} [labelMobile] - 버튼 라벨 (모바일, 없으면 label 사용)
+ * @property {IconName} [icon] - 버튼 아이콘
+ * @property {() => void} onClick - 클릭 핸들러
+ * @property {boolean} [disabled] - 비활성화 여부
+ * @property {'default' | 'outline' | 'destructive' | 'ghost'} [variant='outline'] - 버튼 스타일
+ * @property {Object} [badge] - 배지 정보
+ * @property {number} badge.count - 배지 숫자
+ * @property {'blue' | 'red' | 'gray' | 'green'} [badge.color='gray'] - 배지 색상
+ * @property {string} [className] - 추가 CSS 클래스
+ */
+export interface ActionButton {
+    label: string;
+    labelMobile?: string;
+    icon?: IconName;
+    onClick: () => void;
+    disabled?: boolean;
+    variant?: 'default' | 'outline' | 'destructive' | 'ghost';
+    badge?: {
+        count: number;
+        color?: 'blue' | 'red' | 'gray' | 'green';
+    };
+    className?: string;
+}
+/**
+ * ActionToolbar 컴포넌트의 props / ActionToolbar component props
+ * @typedef {Object} ActionToolbarProps
+ * @property {boolean} [isSelectMode=false] - 선택 모드 활성화 여부 / Enable select mode
+ * @property {number} [totalCount=0] - 전체 항목 개수 / Total item count
+ * @property {number} [selectedCount=0] - 선택된 항목 개수 / Selected item count
+ * @property {ActionButton[]} [actions=[]] - 일반 모드 액션 버튼들 / Normal mode action buttons
+ * @property {ActionButton[]} [selectModeActions=[]] - 선택 모드 액션 버튼들 / Select mode action buttons
+ * @property {() => void} [onToggleSelectMode] - 선택 모드 토글 함수 / Toggle select mode function
+ * @property {() => void} [onToggleSelectAll] - 전체 선택/해제 함수 / Toggle select all function
+ * @property {() => void} [onCancelSelect] - 선택 모드 취소 함수 / Cancel select mode function
+ * @property {boolean} [loading=false] - 로딩 상태 / Loading state
+ * @extends {React.HTMLAttributes<HTMLDivElement>}
+ */
+export interface ActionToolbarProps extends React.HTMLAttributes<HTMLDivElement> {
+    /** 선택 모드 활성화 여부 */
+    isSelectMode?: boolean;
+    /** 전체 항목 개수 */
+    totalCount?: number;
+    /** 선택된 항목 개수 */
+    selectedCount?: number;
+    /** 일반 모드 액션 버튼들 */
+    actions?: ActionButton[];
+    /** 선택 모드 액션 버튼들 */
+    selectModeActions?: ActionButton[];
+    /** 선택 모드 토글 함수 */
+    onToggleSelectMode?: () => void;
+    /** 전체 선택/해제 함수 */
+    onToggleSelectAll?: () => void;
+    /** 선택 모드 취소 함수 */
+    onCancelSelect?: () => void;
+    /** 로딩 상태 */
+    loading?: boolean;
+}
+export declare const ActionToolbar: React.NamedExoticComponent<ActionToolbarProps & React.RefAttributes<HTMLDivElement>>;
+//# sourceMappingURL=ActionToolbar.d.ts.map

package/dist/components/ActionToolbar.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ActionToolbar.d.ts","sourceRoot":"","sources":["../../src/components/ActionToolbar.tsx"],"names":[],"mappings":"AAEA,OAAO,KAA+B,MAAM,OAAO,CAAC;AAGpD,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,cAAc,CAAC;AAG7C;;;;;;;;;;;;;GAaG;AACH,MAAM,WAAW,YAAY;IAC3B,KAAK,EAAE,MAAM,CAAC;IACd,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,IAAI,CAAC,EAAE,QAAQ,CAAC;IAChB,OAAO,EAAE,MAAM,IAAI,CAAC;IACpB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,OAAO,CAAC,EAAE,SAAS,GAAG,SAAS,GAAG,aAAa,GAAG,OAAO,CAAC;IAC1D,KAAK,CAAC,EAAE;QACN,KAAK,EAAE,MAAM,CAAC;QACd,KAAK,CAAC,EAAE,MAAM,GAAG,KAAK,GAAG,MAAM,GAAG,OAAO,CAAC;KAC3C,CAAC;IACF,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED;;;;;;;;;;;;;GAaG;AACH,MAAM,WAAW,kBAAmB,SAAQ,KAAK,CAAC,cAAc,CAAC,cAAc,CAAC;IAC9E,mBAAmB;IACnB,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB,eAAe;IACf,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,gBAAgB;IAChB,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,mBAAmB;IACnB,OAAO,CAAC,EAAE,YAAY,EAAE,CAAC;IACzB,mBAAmB;IACnB,iBAAiB,CAAC,EAAE,YAAY,EAAE,CAAC;IACnC,kBAAkB;IAClB,kBAAkB,CAAC,EAAE,MAAM,IAAI,CAAC;IAChC,kBAAkB;IAClB,iBAAiB,CAAC,EAAE,MAAM,IAAI,CAAC;IAC/B,kBAAkB;IAClB,cAAc,CAAC,EAAE,MAAM,IAAI,CAAC;IAC5B,YAAY;IACZ,OAAO,CAAC,EAAE,OAAO,CAAC;CACnB;AAqLD,eAAO,MAAM,aAAa,sFAAqC,CAAC"}

package/dist/components/Alert.d.ts

@@ -1,4 +1,16 @@
 import React from "react";
+/**
+ * Alert 컴포넌트의 props
+ * @typedef {Object} AlertProps
+ * @property {"default" | "success" | "warning" | "error" | "info"} [variant="default"] - Alert 스타일 변형
+ * @property {string} [title] - Alert 제목
+ * @property {string} [description] - Alert 설명
+ * @property {React.ReactNode} [icon] - 커스텀 아이콘
+ * @property {React.ReactNode} [action] - 액션 버튼/요소
+ * @property {boolean} [closable=false] - 닫기 버튼 표시 여부
+ * @property {() => void} [onClose] - 닫기 버튼 클릭 시 호출되는 콜백
+ * @extends {React.HTMLAttributes<HTMLDivElement>}
+ */
 export interface AlertProps extends React.HTMLAttributes<HTMLDivElement> {
     variant?: "default" | "success" | "warning" | "error" | "info";
     title?: string;
@@ -8,6 +20,43 @@ export interface AlertProps extends React.HTMLAttributes<HTMLDivElement> {
     closable?: boolean;
     onClose?: () => void;
 }
+/**
+ * Alert 컴포넌트 / Alert component
+ *
+ * 사용자에게 중요한 정보나 경고를 표시하는 컴포넌트입니다.
+ * 다양한 변형(variant)을 지원하며, 아이콘, 제목, 설명, 액션 버튼을 포함할 수 있습니다.
+ *
+ * Component for displaying important information or warnings to users.
+ * Supports various variants and can include icons, titles, descriptions, and action buttons.
+ *
+ * @component
+ * @example
+ * // 기본 사용 / Basic usage
+ * <Alert variant="info" title="정보" description="이것은 정보 메시지입니다." />
+ *
+ * @example
+ * // 닫기 버튼 포함 / With close button
+ * <Alert
+ *   variant="warning"
+ *   title="경고"
+ *   closable
+ *   onClose={() => console.log('닫기')}
+ * />
+ *
+ * @example
+ * // 커스텀 아이콘과 액션 / Custom icon and action
+ * <Alert
+ *   variant="success"
+ *   icon={<Icon name="check" />}
+ *   action={<Button size="sm">확인</Button>}
+ * >
+ *   작업이 완료되었습니다.
+ * </Alert>
+ *
+ * @param {AlertProps} props - Alert 컴포넌트의 props / Alert component props
+ * @param {React.Ref<HTMLDivElement>} ref - div 요소 ref / div element ref
+ * @returns {JSX.Element} Alert 컴포넌트 / Alert component
+ */
 declare const Alert: React.ForwardRefExoticComponent<AlertProps & React.RefAttributes<HTMLDivElement>>;
 export declare const AlertSuccess: React.ForwardRefExoticComponent<Omit<AlertProps, "variant"> & React.RefAttributes<HTMLDivElement>>;
 export declare const AlertWarning: React.ForwardRefExoticComponent<Omit<AlertProps, "variant"> & React.RefAttributes<HTMLDivElement>>;

package/dist/components/Alert.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Alert.d.ts","sourceRoot":"","sources":["../../src/components/Alert.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,MAAM,OAAO,CAAA;AAGzB,MAAM,WAAW,UAAW,SAAQ,KAAK,CAAC,cAAc,CAAC,cAAc,CAAC;IACtE,OAAO,CAAC,EAAE,SAAS,GAAG,SAAS,GAAG,SAAS,GAAG,OAAO,GAAG,MAAM,CAAA;IAC9D,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,WAAW,CAAC,EAAE,MAAM,CAAA;IACpB,IAAI,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;IACtB,MAAM,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;IACxB,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,OAAO,CAAC,EAAE,MAAM,IAAI,CAAA;CACrB;AAED,QAAA,MAAM,KAAK,mFAuIV,CAAA;AAID,eAAO,MAAM,YAAY,oGAIxB,CAAA;AAGD,eAAO,MAAM,YAAY,oGAIxB,CAAA;AAGD,eAAO,MAAM,UAAU,oGAItB,CAAA;AAGD,eAAO,MAAM,SAAS,oGAIrB,CAAA;AAGD,OAAO,EAAE,KAAK,EAAE,CAAA"}
+{"version":3,"file":"Alert.d.ts","sourceRoot":"","sources":["../../src/components/Alert.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,MAAM,OAAO,CAAA;AAGzB;;;;;;;;;;;GAWG;AACH,MAAM,WAAW,UAAW,SAAQ,KAAK,CAAC,cAAc,CAAC,cAAc,CAAC;IACtE,OAAO,CAAC,EAAE,SAAS,GAAG,SAAS,GAAG,SAAS,GAAG,OAAO,GAAG,MAAM,CAAA;IAC9D,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,WAAW,CAAC,EAAE,MAAM,CAAA;IACpB,IAAI,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;IACtB,MAAM,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;IACxB,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,OAAO,CAAC,EAAE,MAAM,IAAI,CAAA;CACrB;AAED;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAoCG;AACH,QAAA,MAAM,KAAK,mFAuIV,CAAA;AAID,eAAO,MAAM,YAAY,oGAIxB,CAAA;AAGD,eAAO,MAAM,YAAY,oGAIxB,CAAA;AAGD,eAAO,MAAM,UAAU,oGAItB,CAAA;AAGD,eAAO,MAAM,SAAS,oGAIrB,CAAA;AAGD,OAAO,EAAE,KAAK,EAAE,CAAA"}

package/dist/components/Autocomplete.d.ts

@@ -0,0 +1,88 @@
+import React from "react";
+/**
+ * Autocomplete 옵션 인터페이스 / Autocomplete option interface
+ * @typedef {Object} AutocompleteOption
+ * @property {string} value - 옵션 값 / Option value
+ * @property {string} label - 옵션 라벨 / Option label
+ * @property {string} [description] - 옵션 설명 / Option description
+ * @property {React.ReactNode} [icon] - 옵션 아이콘 / Option icon
+ * @property {Record<string, unknown>} [data] - 추가 데이터 / Additional data
+ */
+export interface AutocompleteOption {
+    value: string;
+    label: string;
+    description?: string;
+    icon?: React.ReactNode;
+    data?: Record<string, unknown>;
+}
+/**
+ * Autocomplete 컴포넌트의 props / Autocomplete component props
+ * @typedef {Object} AutocompleteProps
+ * @property {AutocompleteOption[]} options - 옵션 목록 / Options list
+ * @property {string} [value] - 선택된 값 / Selected value
+ * @property {(value: string, option?: AutocompleteOption) => void} [onChange] - 값 변경 핸들러 / Value change handler
+ * @property {string} [placeholder="검색하거나 선택하세요"] - 플레이스홀더 / Placeholder
+ * @property {boolean} [disabled=false] - 비활성화 상태 / Disabled state
+ * @property {boolean} [error=false] - 에러 상태 / Error state
+ * @property {boolean} [loading=false] - 로딩 상태 / Loading state
+ * @property {number} [maxHeight=300] - 드롭다운 최대 높이 (px) / Dropdown max height in px
+ * @property {boolean} [clearable=true] - 지우기 버튼 표시 / Show clear button
+ * @property {boolean} [filterable=true] - 필터링 활성화 / Enable filtering
+ * @property {(query: string) => AutocompleteOption[] | Promise<AutocompleteOption[]>} [onSearch] - 검색 핸들러 (비동기 지원) / Search handler (async support)
+ * @property {React.ReactNode} [emptyText="결과가 없습니다"] - 빈 결과 텍스트 / Empty result text
+ * @property {"sm" | "md" | "lg"} [size="md"] - 크기 / Size
+ * @property {string} [className] - 추가 클래스명 / Additional class name
+ * @extends {Omit<React.HTMLAttributes<HTMLDivElement>, 'onChange'>}
+ */
+export interface AutocompleteProps extends Omit<React.HTMLAttributes<HTMLDivElement>, 'onChange'> {
+    options: AutocompleteOption[];
+    value?: string;
+    onChange?: (value: string, option?: AutocompleteOption) => void;
+    placeholder?: string;
+    disabled?: boolean;
+    error?: boolean;
+    loading?: boolean;
+    maxHeight?: number;
+    clearable?: boolean;
+    filterable?: boolean;
+    onSearch?: (query: string) => AutocompleteOption[] | Promise<AutocompleteOption[]>;
+    emptyText?: string;
+    size?: "sm" | "md" | "lg";
+    className?: string;
+}
+/**
+ * Autocomplete 컴포넌트 / Autocomplete component
+ *
+ * 자동완성 입력 컴포넌트입니다.
+ * 입력하면서 옵션을 필터링하고 선택할 수 있습니다.
+ *
+ * Autocomplete input component.
+ * Filters and selects options as you type.
+ *
+ * @component
+ * @example
+ * // 기본 사용 / Basic usage
+ * <Autocomplete
+ *   options={[
+ *     { value: "1", label: "옵션 1" },
+ *     { value: "2", label: "옵션 2" }
+ *   ]}
+ *   onChange={(value) => console.log(value)}
+ * />
+ *
+ * @example
+ * // 비동기 검색 / Async search
+ * <Autocomplete
+ *   options={options}
+ *   onSearch={async (query) => {
+ *     const results = await searchAPI(query)
+ *     return results
+ *   }}
+ *   loading={isLoading}
+ * />
+ *
+ * @param {AutocompleteProps} props - Autocomplete 컴포넌트의 props / Autocomplete component props
+ * @returns {JSX.Element} Autocomplete 컴포넌트 / Autocomplete component
+ */
+export declare const Autocomplete: React.ForwardRefExoticComponent<AutocompleteProps & React.RefAttributes<HTMLDivElement>>;
+//# sourceMappingURL=Autocomplete.d.ts.map

package/dist/components/Autocomplete.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Autocomplete.d.ts","sourceRoot":"","sources":["../../src/components/Autocomplete.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,MAAM,OAAO,CAAA;AAKzB;;;;;;;;GAQG;AACH,MAAM,WAAW,kBAAkB;IACjC,KAAK,EAAE,MAAM,CAAA;IACb,KAAK,EAAE,MAAM,CAAA;IACb,WAAW,CAAC,EAAE,MAAM,CAAA;IACpB,IAAI,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;IACtB,IAAI,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,CAAA;CAC/B;AAED;;;;;;;;;;;;;;;;;;GAkBG;AACH,MAAM,WAAW,iBAAkB,SAAQ,IAAI,CAAC,KAAK,CAAC,cAAc,CAAC,cAAc,CAAC,EAAE,UAAU,CAAC;IAC/F,OAAO,EAAE,kBAAkB,EAAE,CAAA;IAC7B,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,EAAE,MAAM,CAAC,EAAE,kBAAkB,KAAK,IAAI,CAAA;IAC/D,WAAW,CAAC,EAAE,MAAM,CAAA;IACpB,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,KAAK,CAAC,EAAE,OAAO,CAAA;IACf,OAAO,CAAC,EAAE,OAAO,CAAA;IACjB,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,SAAS,CAAC,EAAE,OAAO,CAAA;IACnB,UAAU,CAAC,EAAE,OAAO,CAAA;IACpB,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,kBAAkB,EAAE,GAAG,OAAO,CAAC,kBAAkB,EAAE,CAAC,CAAA;IAClF,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,IAAI,CAAC,EAAE,IAAI,GAAG,IAAI,GAAG,IAAI,CAAA;IACzB,SAAS,CAAC,EAAE,MAAM,CAAA;CACnB;AAQD;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAiCG;AACH,eAAO,MAAM,YAAY,0FAqQxB,CAAA"}

package/dist/components/Avatar.d.ts

@@ -1,13 +1,83 @@
-import * as React from "react";
+import React from "react";
+/**
+ * Avatar 컴포넌트의 props / Avatar component props
+ * @typedef {Object} AvatarProps
+ * @property {"sm" | "md" | "lg"} [size="md"] - 아바타 크기 / Avatar size
+ * @property {"default" | "glass"} [variant="default"] - 아바타 스타일 변형 / Avatar style variant
+ * @property {string} [src] - 이미지 URL / Image URL
+ * @property {string} [alt] - 이미지 대체 텍스트 / Image alt text
+ * @extends {React.HTMLAttributes<HTMLDivElement>}
+ */
 export interface AvatarProps extends React.HTMLAttributes<HTMLDivElement> {
     size?: "sm" | "md" | "lg";
+    variant?: "default" | "glass";
+    src?: string;
+    alt?: string;
 }
+/**
+ * AvatarImage 컴포넌트의 props
+ * @typedef {Object} AvatarImageProps
+ * @extends {React.ImgHTMLAttributes<HTMLImageElement>}
+ */
 export interface AvatarImageProps extends React.ImgHTMLAttributes<HTMLImageElement> {
 }
+/**
+ * AvatarFallback 컴포넌트의 props
+ * @typedef {Object} AvatarFallbackProps
+ * @extends {React.HTMLAttributes<HTMLDivElement>}
+ */
 export interface AvatarFallbackProps extends React.HTMLAttributes<HTMLDivElement> {
 }
+/**
+ * Avatar 컴포넌트 / Avatar component
+ *
+ * 사용자 프로필 이미지를 표시하는 컴포넌트입니다.
+ * 이미지가 없을 경우 대체 텍스트나 초기 문자를 표시합니다.
+ *
+ * Component for displaying user profile images.
+ * Shows fallback text or initials when image is not available.
+ *
+ * @component
+ * @example
+ * // 기본 사용 (이미지) / Basic usage (with image)
+ * <Avatar src="/user.jpg" alt="사용자" />
+ *
+ * @example
+ * // 대체 텍스트 / Fallback text
+ * <Avatar alt="홍길동">홍</Avatar>
+ *
+ * @example
+ * // Glass 스타일 / Glass style
+ * <Avatar variant="glass" size="lg" src="/user.jpg" alt="사용자" />
+ *
+ * @param {AvatarProps} props - Avatar 컴포넌트의 props / Avatar component props
+ * @param {React.Ref<HTMLDivElement>} ref - div 요소 ref / div element ref
+ * @returns {JSX.Element} Avatar 컴포넌트 / Avatar component
+ */
 declare const Avatar: React.ForwardRefExoticComponent<AvatarProps & React.RefAttributes<HTMLDivElement>>;
+/**
+ * AvatarImage 컴포넌트 / AvatarImage component
+ *
+ * 아바타 이미지를 표시하는 컴포넌트입니다.
+ * Displays the avatar image.
+ *
+ * @component
+ * @param {AvatarImageProps} props - AvatarImage 컴포넌트의 props / AvatarImage component props
+ * @param {React.Ref<HTMLImageElement>} ref - img 요소 ref / img element ref
+ * @returns {JSX.Element} AvatarImage 컴포넌트 / AvatarImage component
+ */
 declare const AvatarImage: React.ForwardRefExoticComponent<AvatarImageProps & React.RefAttributes<HTMLImageElement>>;
+/**
+ * AvatarFallback 컴포넌트 / AvatarFallback component
+ *
+ * 아바타 이미지가 없을 때 표시되는 대체 컴포넌트입니다.
+ * Fallback component displayed when avatar image is not available.
+ *
+ * @component
+ * @param {AvatarFallbackProps} props - AvatarFallback 컴포넌트의 props / AvatarFallback component props
+ * @param {React.Ref<HTMLDivElement>} ref - div 요소 ref / div element ref
+ * @returns {JSX.Element} AvatarFallback 컴포넌트 / AvatarFallback component
+ */
 declare const AvatarFallback: React.ForwardRefExoticComponent<AvatarFallbackProps & React.RefAttributes<HTMLDivElement>>;
 export { Avatar, AvatarImage, AvatarFallback };
 //# sourceMappingURL=Avatar.d.ts.map

package/dist/components/Avatar.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Avatar.d.ts","sourceRoot":"","sources":["../../src/components/Avatar.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAG9B,MAAM,WAAW,WAAY,SAAQ,KAAK,CAAC,cAAc,CAAC,cAAc,CAAC;IACvE,IAAI,CAAC,EAAE,IAAI,GAAG,IAAI,GAAG,IAAI,CAAA;CAC1B;AAED,MAAM,WAAW,gBAAiB,SAAQ,KAAK,CAAC,iBAAiB,CAAC,gBAAgB,CAAC;CAAG;AAEtF,MAAM,WAAW,mBAAoB,SAAQ,KAAK,CAAC,cAAc,CAAC,cAAc,CAAC;CAAG;AAEpF,QAAA,MAAM,MAAM,oFAoBX,CAAA;AAGD,QAAA,MAAM,WAAW,2FAQhB,CAAA;AAGD,QAAA,MAAM,cAAc,4FAWnB,CAAA;AAGD,OAAO,EAAE,MAAM,EAAE,WAAW,EAAE,cAAc,EAAE,CAAA"}
+{"version":3,"file":"Avatar.d.ts","sourceRoot":"","sources":["../../src/components/Avatar.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,MAAM,OAAO,CAAA;AAGzB;;;;;;;;GAQG;AACH,MAAM,WAAW,WAAY,SAAQ,KAAK,CAAC,cAAc,CAAC,cAAc,CAAC;IACvE,IAAI,CAAC,EAAE,IAAI,GAAG,IAAI,GAAG,IAAI,CAAA;IACzB,OAAO,CAAC,EAAE,SAAS,GAAG,OAAO,CAAA;IAC7B,GAAG,CAAC,EAAE,MAAM,CAAA;IACZ,GAAG,CAAC,EAAE,MAAM,CAAA;CACb;AAED;;;;GAIG;AACH,MAAM,WAAW,gBAAiB,SAAQ,KAAK,CAAC,iBAAiB,CAAC,gBAAgB,CAAC;CAAG;AAEtF;;;;GAIG;AACH,MAAM,WAAW,mBAAoB,SAAQ,KAAK,CAAC,cAAc,CAAC,cAAc,CAAC;CAAG;AAEpF;;;;;;;;;;;;;;;;;;;;;;;;;GAyBG;AACH,QAAA,MAAM,MAAM,oFAkCX,CAAA;AAGD;;;;;;;;;;GAUG;AACH,QAAA,MAAM,WAAW,2FAQhB,CAAA;AAGD;;;;;;;;;;GAUG;AACH,QAAA,MAAM,cAAc,4FAWnB,CAAA;AAGD,OAAO,EAAE,MAAM,EAAE,WAAW,EAAE,cAAc,EAAE,CAAA"}

package/dist/components/Badge.d.ts

@@ -1,7 +1,37 @@
 import React from "react";
+/**
+ * Badge 컴포넌트의 props / Badge component props
+ * @typedef {Object} BadgeProps
+ * @property {"default" | "secondary" | "destructive" | "error" | "outline" | "glass"} [variant="default"] - Badge 스타일 변형 / Badge style variant
+ * @extends {React.HTMLAttributes<HTMLDivElement>}
+ */
 export interface BadgeProps extends React.HTMLAttributes<HTMLDivElement> {
-    variant?: "default" | "secondary" | "destructive" | "outline";
+    variant?: "default" | "secondary" | "destructive" | "error" | "outline" | "glass";
 }
-declare const Badge: React.ForwardRefExoticComponent<BadgeProps & React.RefAttributes<HTMLDivElement>>;
+/**
+ * Badge 컴포넌트 / Badge component
+ *
+ * 상태나 카테고리를 표시하는 작은 배지 컴포넌트입니다.
+ * React.memo로 최적화되어 있어 불필요한 리렌더링을 방지합니다.
+ *
+ * Small badge component for displaying status or category.
+ * Optimized with React.memo to prevent unnecessary re-renders.
+ *
+ * @component
+ * @example
+ * // 기본 사용 / Basic usage
+ * <Badge>New</Badge>
+ *
+ * @example
+ * // 다양한 변형 / Various variants
+ * <Badge variant="destructive">완료</Badge>
+ * <Badge variant="error">오류</Badge>
+ * <Badge variant="outline">대기</Badge>
+ *
+ * @param {BadgeProps} props - Badge 컴포넌트의 props / Badge component props
+ * @param {React.Ref<HTMLDivElement>} ref - div 요소 ref / div element ref
+ * @returns {JSX.Element} Badge 컴포넌트 / Badge component
+ */
+declare const Badge: React.NamedExoticComponent<BadgeProps & React.RefAttributes<HTMLDivElement>>;
 export { Badge };
 //# sourceMappingURL=Badge.d.ts.map

package/dist/components/Badge.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Badge.d.ts","sourceRoot":"","sources":["../../src/components/Badge.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,MAAM,OAAO,CAAA;AAGzB,MAAM,WAAW,UAAW,SAAQ,KAAK,CAAC,cAAc,CAAC,cAAc,CAAC;IACtE,OAAO,CAAC,EAAE,SAAS,GAAG,WAAW,GAAG,aAAa,GAAG,SAAS,CAAA;CAC9D;AAED,QAAA,MAAM,KAAK,mFAqBV,CAAA;AAGD,OAAO,EAAE,KAAK,EAAE,CAAA"}
+{"version":3,"file":"Badge.d.ts","sourceRoot":"","sources":["../../src/components/Badge.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,MAAM,OAAO,CAAA;AAGzB;;;;;GAKG;AACH,MAAM,WAAW,UAAW,SAAQ,KAAK,CAAC,cAAc,CAAC,cAAc,CAAC;IACtE,OAAO,CAAC,EAAE,SAAS,GAAG,WAAW,GAAG,aAAa,GAAG,OAAO,GAAG,SAAS,GAAG,OAAO,CAAA;CAClF;AAED;;;;;;;;;;;;;;;;;;;;;;;GAuBG;AACH,QAAA,MAAM,KAAK,8EAuBT,CAAA;AAGF,OAAO,EAAE,KAAK,EAAE,CAAA"}

package/dist/components/Bookmark.d.ts

@@ -0,0 +1,49 @@
+import React from "react";
+/**
+ * Bookmark 컴포넌트의 props / Bookmark component props
+ * @typedef {Object} BookmarkProps
+ * @property {string} id - 북마크 고유 ID / Bookmark unique ID
+ * @property {string} [storageKey='bookmarks'] - localStorage 키 / localStorage key
+ * @property {boolean} [defaultBookmarked=false] - 기본 북마크 상태 / Default bookmarked state
+ * @property {(bookmarked: boolean) => void} [onBookmarkChange] - 북마크 상태 변경 콜백 / Bookmark state change callback
+ * @property {'sm' | 'md' | 'lg'} [size='md'] - Bookmark 크기 / Bookmark size
+ * @property {'default' | 'filled' | 'outline'} [variant='default'] - Bookmark 스타일 변형 / Bookmark style variant
+ * @extends {React.HTMLAttributes<HTMLButtonElement>}
+ */
+export interface BookmarkProps extends React.HTMLAttributes<HTMLButtonElement> {
+    id: string;
+    storageKey?: string;
+    defaultBookmarked?: boolean;
+    onBookmarkChange?: (bookmarked: boolean) => void;
+    size?: 'sm' | 'md' | 'lg';
+    variant?: 'default' | 'filled' | 'outline';
+}
+/**
+ * Bookmark 컴포넌트 / Bookmark component
+ *
+ * 북마크 기능을 제공하는 버튼 컴포넌트입니다.
+ * localStorage에 북마크 상태를 저장하며, 여러 항목의 북마크를 관리할 수 있습니다.
+ *
+ * Button component that provides bookmark functionality.
+ * Saves bookmark state to localStorage and can manage bookmarks for multiple items.
+ *
+ * @component
+ * @example
+ * // 기본 사용 / Basic usage
+ * <Bookmark id="article-1" />
+ *
+ * @example
+ * // 상태 변경 감지 / State change detection
+ * <Bookmark
+ *   id="article-1"
+ *   onBookmarkChange={(bookmarked) => console.log(bookmarked)}
+ *   variant="filled"
+ * />
+ *
+ * @param {BookmarkProps} props - Bookmark 컴포넌트의 props / Bookmark component props
+ * @param {React.Ref<HTMLButtonElement>} ref - button 요소 ref / button element ref
+ * @returns {JSX.Element} Bookmark 컴포넌트 / Bookmark component
+ */
+declare const Bookmark: React.ForwardRefExoticComponent<BookmarkProps & React.RefAttributes<HTMLButtonElement>>;
+export { Bookmark };
+//# sourceMappingURL=Bookmark.d.ts.map

package/dist/components/Bookmark.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Bookmark.d.ts","sourceRoot":"","sources":["../../src/components/Bookmark.tsx"],"names":[],"mappings":"AAEA,OAAO,KAA8B,MAAM,OAAO,CAAA;AAIlD;;;;;;;;;;GAUG;AACH,MAAM,WAAW,aAAc,SAAQ,KAAK,CAAC,cAAc,CAAC,iBAAiB,CAAC;IAC5E,EAAE,EAAE,MAAM,CAAA;IACV,UAAU,CAAC,EAAE,MAAM,CAAA;IACnB,iBAAiB,CAAC,EAAE,OAAO,CAAA;IAC3B,gBAAgB,CAAC,EAAE,CAAC,UAAU,EAAE,OAAO,KAAK,IAAI,CAAA;IAChD,IAAI,CAAC,EAAE,IAAI,GAAG,IAAI,GAAG,IAAI,CAAA;IACzB,OAAO,CAAC,EAAE,SAAS,GAAG,QAAQ,GAAG,SAAS,CAAA;CAC3C;AAED;;;;;;;;;;;;;;;;;;;;;;;;;GAyBG;AACH,QAAA,MAAM,QAAQ,yFAgFb,CAAA;AAID,OAAO,EAAE,QAAQ,EAAE,CAAA"}

package/dist/components/BottomSheet.d.ts

@@ -1,4 +1,20 @@
-import * as React from "react";
+import React from "react";
+/**
+ * BottomSheet 컴포넌트의 props / BottomSheet component props
+ * @typedef {Object} BottomSheetProps
+ * @property {boolean} open - BottomSheet 열림/닫힘 상태 / BottomSheet open/close state
+ * @property {(open: boolean) => void} onOpenChange - 상태 변경 콜백 / State change callback
+ * @property {React.ReactNode} children - BottomSheet 내용 / BottomSheet content
+ * @property {string} [className] - 추가 CSS 클래스 / Additional CSS class
+ * @property {"sm" | "md" | "lg" | "xl" | "full"} [height="md"] - BottomSheet 높이 / BottomSheet height
+ * @property {boolean} [showBackdrop=true] - 배경 오버레이 표시 여부 / Show backdrop overlay
+ * @property {string} [backdropClassName] - 배경 오버레이 추가 CSS 클래스 / Backdrop overlay additional CSS class
+ * @property {boolean} [closeOnBackdropClick=true] - 배경 클릭 시 닫기 여부 / Close on backdrop click
+ * @property {boolean} [closeOnEscape=true] - ESC 키로 닫기 여부 / Close on ESC key
+ * @property {boolean} [showDragHandle=true] - 드래그 핸들 표시 여부 / Show drag handle
+ * @property {number[]} [snapPoints=[25, 50, 75, 100]] - 스냅 포인트 (퍼센트) / Snap points (percentage)
+ * @property {number} [defaultSnap=50] - 기본 스냅 포인트 (퍼센트) / Default snap point (percentage)
+ */
 interface BottomSheetProps {
     open: boolean;
     onOpenChange: (open: boolean) => void;
@@ -6,24 +22,98 @@ interface BottomSheetProps {
     className?: string;
     height?: "sm" | "md" | "lg" | "xl" | "full";
     showBackdrop?: boolean;
+    backdropClassName?: string;
     closeOnBackdropClick?: boolean;
     closeOnEscape?: boolean;
     showDragHandle?: boolean;
     snapPoints?: number[];
     defaultSnap?: number;
 }
+/**
+ * BottomSheet 컴포넌트 / BottomSheet component
+ *
+ * 화면 하단에서 올라오는 시트 컴포넌트입니다.
+ * 모바일 친화적인 UI를 제공하며, 드래그로 높이를 조절할 수 있습니다.
+ * 스냅 포인트를 지원하여 특정 높이에서 멈출 수 있습니다.
+ *
+ * Sheet component that slides up from the bottom of the screen.
+ * Provides mobile-friendly UI and allows height adjustment by dragging.
+ * Supports snap points to stop at specific heights.
+ *
+ * @component
+ * @example
+ * // 기본 사용 / Basic usage
+ * const [open, setOpen] = useState(false)
+ *
+ * <BottomSheet open={open} onOpenChange={setOpen}>
+ *   <BottomSheetHeader>제목</BottomSheetHeader>
+ *   <BottomSheetContent>내용</BottomSheetContent>
+ * </BottomSheet>
+ *
+ * @example
+ * // 커스텀 스냅 포인트 / Custom snap points
+ * <BottomSheet
+ *   open={open}
+ *   onOpenChange={setOpen}
+ *   snapPoints={[30, 60, 90]}
+ *   defaultSnap={30}
+ * >
+ *   <BottomSheetContent>내용</BottomSheetContent>
+ * </BottomSheet>
+ *
+ * @param {BottomSheetProps} props - BottomSheet 컴포넌트의 props / BottomSheet component props
+ * @param {React.Ref<HTMLDivElement>} ref - BottomSheet 컨테이너 ref / BottomSheet container ref
+ * @returns {JSX.Element} BottomSheet 컴포넌트 / BottomSheet component
+ *
+ * @todo 접근성 개선: role="dialog", aria-modal="true" 추가 필요 / Accessibility: Add role="dialog", aria-modal="true"
+ * @todo 접근성 개선: aria-labelledby, aria-describedby 연결 필요 / Accessibility: Connect aria-labelledby, aria-describedby
+ */
 declare const BottomSheet: React.ForwardRefExoticComponent<BottomSheetProps & React.RefAttributes<HTMLDivElement>>;
+/**
+ * BottomSheetHeader 컴포넌트의 props / BottomSheetHeader component props
+ * @typedef {Object} BottomSheetHeaderProps
+ * @property {React.ReactNode} children - 헤더 내용 / Header content
+ * @property {string} [className] - 추가 CSS 클래스 / Additional CSS class
+ * @property {boolean} [showCloseButton=true] - 닫기 버튼 표시 여부 / Show close button
+ * @property {() => void} [onClose] - 닫기 버튼 클릭 콜백 / Close button click callback
+ */
 interface BottomSheetHeaderProps {
     children: React.ReactNode;
     className?: string;
     showCloseButton?: boolean;
     onClose?: () => void;
 }
+/**
+ * BottomSheetHeader 컴포넌트 / BottomSheetHeader component
+ * BottomSheet의 헤더 영역을 표시합니다.
+ * Displays the header area of a BottomSheet.
+ *
+ * @component
+ * @param {BottomSheetHeaderProps} props - BottomSheetHeader 컴포넌트의 props / BottomSheetHeader component props
+ * @param {React.Ref<HTMLDivElement>} ref - div 요소 ref / div element ref
+ * @returns {JSX.Element} BottomSheetHeader 컴포넌트 / BottomSheetHeader component
+ */
 declare const BottomSheetHeader: React.ForwardRefExoticComponent<BottomSheetHeaderProps & React.RefAttributes<HTMLDivElement>>;
+/**
+ * BottomSheetContent 컴포넌트의 props / BottomSheetContent component props
+ * @typedef {Object} BottomSheetContentProps
+ * @property {React.ReactNode} children - 콘텐츠 / Content
+ * @property {string} [className] - 추가 CSS 클래스 / Additional CSS class
+ */
 interface BottomSheetContentProps {
     children: React.ReactNode;
     className?: string;
 }
+/**
+ * BottomSheetContent 컴포넌트 / BottomSheetContent component
+ * BottomSheet의 메인 콘텐츠 영역을 표시합니다.
+ * Displays the main content area of a BottomSheet.
+ *
+ * @component
+ * @param {BottomSheetContentProps} props - BottomSheetContent 컴포넌트의 props / BottomSheetContent component props
+ * @param {React.Ref<HTMLDivElement>} ref - div 요소 ref / div element ref
+ * @returns {JSX.Element} BottomSheetContent 컴포넌트 / BottomSheetContent component
+ */
 declare const BottomSheetContent: React.ForwardRefExoticComponent<BottomSheetContentProps & React.RefAttributes<HTMLDivElement>>;
 export { BottomSheet, BottomSheetHeader, BottomSheetContent };
 //# sourceMappingURL=BottomSheet.d.ts.map

package/dist/components/BottomSheet.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"BottomSheet.d.ts","sourceRoot":"","sources":["../../src/components/BottomSheet.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAI9B,UAAU,gBAAgB;IACxB,IAAI,EAAE,OAAO,CAAA;IACb,YAAY,EAAE,CAAC,IAAI,EAAE,OAAO,KAAK,IAAI,CAAA;IACrC,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAA;IACzB,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,MAAM,CAAC,EAAE,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,MAAM,CAAA;IAC3C,YAAY,CAAC,EAAE,OAAO,CAAA;IACtB,oBAAoB,CAAC,EAAE,OAAO,CAAA;IAC9B,aAAa,CAAC,EAAE,OAAO,CAAA;IACvB,cAAc,CAAC,EAAE,OAAO,CAAA;IACxB,UAAU,CAAC,EAAE,MAAM,EAAE,CAAA;IACrB,WAAW,CAAC,EAAE,MAAM,CAAA;CACrB;AAED,QAAA,MAAM,WAAW,yFA4IhB,CAAA;AAGD,UAAU,sBAAsB;IAC9B,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAA;IACzB,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,eAAe,CAAC,EAAE,OAAO,CAAA;IACzB,OAAO,CAAC,EAAE,MAAM,IAAI,CAAA;CACrB;AAED,QAAA,MAAM,iBAAiB,+FAoBtB,CAAA;AAGD,UAAU,uBAAuB;IAC/B,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAA;IACzB,SAAS,CAAC,EAAE,MAAM,CAAA;CACnB;AAED,QAAA,MAAM,kBAAkB,gGAYvB,CAAA;AAGD,OAAO,EAAE,WAAW,EAAE,iBAAiB,EAAE,kBAAkB,EAAE,CAAA"}
+{"version":3,"file":"BottomSheet.d.ts","sourceRoot":"","sources":["../../src/components/BottomSheet.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,MAAM,OAAO,CAAA;AAIzB;;;;;;;;;;;;;;;GAeG;AACH,UAAU,gBAAgB;IACxB,IAAI,EAAE,OAAO,CAAA;IACb,YAAY,EAAE,CAAC,IAAI,EAAE,OAAO,KAAK,IAAI,CAAA;IACrC,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAA;IACzB,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,MAAM,CAAC,EAAE,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,MAAM,CAAA;IAC3C,YAAY,CAAC,EAAE,OAAO,CAAA;IACtB,iBAAiB,CAAC,EAAE,MAAM,CAAA;IAC1B,oBAAoB,CAAC,EAAE,OAAO,CAAA;IAC9B,aAAa,CAAC,EAAE,OAAO,CAAA;IACvB,cAAc,CAAC,EAAE,OAAO,CAAA;IACxB,UAAU,CAAC,EAAE,MAAM,EAAE,CAAA;IACrB,WAAW,CAAC,EAAE,MAAM,CAAA;CACrB;AAED;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAsCG;AACH,QAAA,MAAM,WAAW,yFA8IhB,CAAA;AAGD;;;;;;;GAOG;AACH,UAAU,sBAAsB;IAC9B,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAA;IACzB,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,eAAe,CAAC,EAAE,OAAO,CAAA;IACzB,OAAO,CAAC,EAAE,MAAM,IAAI,CAAA;CACrB;AAED;;;;;;;;;GASG;AACH,QAAA,MAAM,iBAAiB,+FAoBtB,CAAA;AAGD;;;;;GAKG;AACH,UAAU,uBAAuB;IAC/B,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAA;IACzB,SAAS,CAAC,EAAE,MAAM,CAAA;CACnB;AAED;;;;;;;;;GASG;AACH,QAAA,MAAM,kBAAkB,gGAYvB,CAAA;AAGD,OAAO,EAAE,WAAW,EAAE,iBAAiB,EAAE,kBAAkB,EAAE,CAAA"}

package/dist/components/Breadcrumb.d.ts

@@ -1,27 +1,86 @@
-import * as React from "react";
-interface BreadcrumbItem {
+import React from "react";
+/**
+ * Breadcrumb 항목 타입 / Breadcrumb item type
+ */
+export interface BreadcrumbItemData {
     label: string;
     href?: string;
     icon?: string;
-    onClick?: () => void;
 }
-interface BreadcrumbProps {
-    items: BreadcrumbItem[];
-    separator?: React.ReactNode;
-    className?: string;
+/**
+ * Breadcrumb 컴포넌트의 props / Breadcrumb component props
+ * @typedef {Object} BreadcrumbProps
+ * @property {React.ReactNode} [children] - BreadcrumbItem 컴포넌트들 / BreadcrumbItem components
+ * @property {BreadcrumbItemData[]} [items] - Breadcrumb 항목 배열 (children 대신 사용 가능) / Breadcrumb items array (alternative to children)
+ * @property {number} [maxItems] - 최대 표시할 항목 수 (긴 경로 처리) / Maximum number of items to display (for long paths)
+ * @property {boolean} [showHomeIcon] - 홈 아이콘 표시 여부 / Show home icon
+ * @property {string} [homeLabel] - 홈 라벨 (기본: "Home") / Home label (default: "Home")
+ * @property {React.ReactNode} [separator] - 항목 사이 구분자 (기본: chevronRight 아이콘) / Separator between items (default: chevronRight icon)
+ * @property {'default' | 'subtle' | 'transparent' | 'glass'} [variant='default'] - Breadcrumb 스타일 변형 / Breadcrumb style variant
+ * @extends {React.HTMLAttributes<HTMLDivElement>}
+ */
+export interface BreadcrumbProps extends React.HTMLAttributes<HTMLDivElement> {
+    children?: React.ReactNode;
+    items?: BreadcrumbItemData[];
     maxItems?: number;
     showHomeIcon?: boolean;
     homeLabel?: string;
-    homeHref?: string;
+    separator?: React.ReactNode;
+    variant?: 'default' | 'subtle' | 'transparent' | 'glass';
 }
-declare const Breadcrumb: React.ForwardRefExoticComponent<BreadcrumbProps & React.RefAttributes<HTMLDivElement>>;
-interface BreadcrumbItemProps {
+/**
+ * BreadcrumbItem 컴포넌트의 props / BreadcrumbItem component props
+ * @typedef {Object} BreadcrumbItemProps
+ * @property {string} [href] - 링크 URL (없으면 일반 텍스트) / Link URL (plain text if not provided)
+ * @property {boolean} [isCurrent=false] - 현재 페이지 여부 / Current page indicator
+ * @property {React.ReactNode} children - 항목 텍스트 / Item text
+ * @property {string} [className] - 추가 CSS 클래스 / Additional CSS class
+ */
+export interface BreadcrumbItemProps {
+    href?: string;
+    isCurrent?: boolean;
     children: React.ReactNode;
     className?: string;
-    href?: string;
-    onClick?: () => void;
-    isActive?: boolean;
 }
-declare const BreadcrumbItem: React.ForwardRefExoticComponent<BreadcrumbItemProps & React.RefAttributes<HTMLButtonElement | HTMLAnchorElement>>;
+/**
+ * Breadcrumb 컴포넌트 / Breadcrumb component
+ *
+ * 네비게이션 경로를 표시하는 breadcrumb 컴포넌트입니다.
+ * 현재 위치와 경로를 시각적으로 표현합니다.
+ *
+ * Breadcrumb component for displaying navigation paths.
+ * Visually represents current location and path.
+ *
+ * @component
+ * @example
+ * // 기본 사용 / Basic usage
+ * <Breadcrumb>
+ *   <BreadcrumbItem href="/">홈</BreadcrumbItem>
+ *   <BreadcrumbItem href="/products">상품</BreadcrumbItem>
+ *   <BreadcrumbItem isCurrent>상세</BreadcrumbItem>
+ * </Breadcrumb>
+ *
+ * @example
+ * // 커스텀 구분자 / Custom separator
+ * <Breadcrumb separator={<span>/</span>}>
+ *   <BreadcrumbItem href="/">홈</BreadcrumbItem>
+ *   <BreadcrumbItem isCurrent>현재</BreadcrumbItem>
+ * </Breadcrumb>
+ *
+ * @param {BreadcrumbProps} props - Breadcrumb 컴포넌트의 props / Breadcrumb component props
+ * @param {React.Ref<HTMLDivElement>} ref - nav 요소 ref / nav element ref
+ * @returns {JSX.Element} Breadcrumb 컴포넌트 / Breadcrumb component
+ */
+declare const Breadcrumb: React.ForwardRefExoticComponent<BreadcrumbProps & React.RefAttributes<HTMLDivElement>>;
+/**
+ * BreadcrumbItem 컴포넌트
+ * Breadcrumb의 개별 항목을 표시합니다.
+ *
+ * @component
+ * @param {BreadcrumbItemProps} props - BreadcrumbItem 컴포넌트의 props
+ * @param {React.Ref<HTMLLIElement>} ref - li 요소 ref
+ * @returns {JSX.Element} BreadcrumbItem 컴포넌트
+ */
+declare const BreadcrumbItem: React.ForwardRefExoticComponent<BreadcrumbItemProps & React.RefAttributes<HTMLLIElement>>;
 export { Breadcrumb, BreadcrumbItem };
 //# sourceMappingURL=Breadcrumb.d.ts.map