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

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

@@ -1 +1 @@
-{"version":3,"file":"ScrollProgress.d.ts","sourceRoot":"","sources":["../../src/components/ScrollProgress.tsx"],"names":[],"mappings":"AAEA,OAAO,KAA8B,MAAM,OAAO,CAAA;AAGlD,MAAM,WAAW,mBAAmB;IAClC,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,MAAM,CAAC,EAAE,MAAM,CAAA;IACf,KAAK,CAAC,EAAE,SAAS,GAAG,SAAS,GAAG,WAAW,GAAG,UAAU,CAAA;IACxD,QAAQ,CAAC,EAAE,KAAK,GAAG,QAAQ,CAAA;IAC3B,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,cAAc,CAAC,EAAE,OAAO,CAAA;CACzB;AAED,QAAA,MAAM,cAAc,4FA6ElB,CAAA;AAIF,OAAO,EAAE,cAAc,EAAE,CAAA"}
+{"version":3,"file":"ScrollProgress.d.ts","sourceRoot":"","sources":["../../src/components/ScrollProgress.tsx"],"names":[],"mappings":"AAEA,OAAO,KAA8B,MAAM,OAAO,CAAA;AAGlD;;;;;;;;;GASG;AACH,MAAM,WAAW,mBAAmB;IAClC,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,MAAM,CAAC,EAAE,MAAM,CAAA;IACf,KAAK,CAAC,EAAE,SAAS,GAAG,SAAS,GAAG,WAAW,GAAG,UAAU,CAAA;IACxD,QAAQ,CAAC,EAAE,KAAK,GAAG,QAAQ,CAAA;IAC3B,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,cAAc,CAAC,EAAE,OAAO,CAAA;CACzB;AAED;;;;;;;;;;;;;;;;;;;;;;;;;;GA0BG;AACH,QAAA,MAAM,cAAc,4FA8ElB,CAAA;AAIF,OAAO,EAAE,cAAc,EAAE,CAAA"}

package/dist/components/ScrollToTop.d.ts

@@ -1,15 +1,52 @@
-import React from 'react';
-export interface ScrollToTopProps {
-    className?: string;
+import React from "react";
+import { IconName } from "../lib/icons";
+/**
+ * ScrollToTop 컴포넌트의 props / ScrollToTop component props
+ * @typedef {Object} ScrollToTopProps
+ * @property {number} [threshold=400] - 표시 임계값 (px, 이 값 이상 스크롤 시 표시) / Display threshold (px, shows when scrolled beyond this value)
+ * @property {boolean} [smooth=true] - 부드러운 스크롤 여부 / Smooth scroll
+ * @property {string} [className] - 추가 CSS 클래스 / Additional CSS class
+ * @property {IconName} [icon='arrowUp'] - 아이콘 이름 / Icon name
+ * @property {"sm" | "md" | "lg"} [size="md"] - 버튼 크기 / Button size
+ * @property {"default" | "primary" | "secondary" | "outline" | "ghost"} [variant="default"] - 버튼 스타일 변형 / Button style variant
+ * @property {boolean} [showOnMount=false] - 마운트 시 즉시 표시 여부 / Show immediately on mount
+ * @extends {React.HTMLAttributes<HTMLButtonElement>}
+ */
+export interface ScrollToTopProps extends React.HTMLAttributes<HTMLButtonElement> {
     threshold?: number;
-    position?: 'bottom-right' | 'bottom-left' | 'bottom-center';
-    size?: 'sm' | 'md' | 'lg';
-    variant?: 'default' | 'primary' | 'secondary' | 'outline';
-    showIcon?: boolean;
-    iconName?: string;
-    iconSize?: number;
-    animated?: boolean;
+    smooth?: boolean;
+    className?: string;
+    icon?: IconName;
+    size?: "sm" | "md" | "lg";
+    variant?: "default" | "primary" | "secondary" | "outline" | "ghost";
+    showOnMount?: boolean;
 }
-declare const ScrollToTop: React.ForwardRefExoticComponent<ScrollToTopProps & React.RefAttributes<HTMLDivElement>>;
+/**
+ * ScrollToTop 컴포넌트 / ScrollToTop component
+ *
+ * 페이지 상단으로 스크롤하는 버튼 컴포넌트입니다.
+ * 지정된 임계값 이상 스크롤 시 자동으로 표시됩니다.
+ *
+ * Button component that scrolls to top of page.
+ * Automatically appears when scrolled beyond specified threshold.
+ *
+ * @component
+ * @example
+ * // 기본 사용 / Basic usage
+ * <ScrollToTop />
+ *
+ * @example
+ * // 커스텀 설정 / Custom settings
+ * <ScrollToTop
+ *   threshold={500}
+ *   variant="primary"
+ *   size="lg"
+ *   icon="arrowUp"
+ * />
+ *
+ * @param {ScrollToTopProps} props - ScrollToTop 컴포넌트의 props / ScrollToTop component props
+ * @returns {JSX.Element} ScrollToTop 컴포넌트 / ScrollToTop component
+ */
+declare const ScrollToTop: ({ className, threshold, smooth, icon, size, variant, showOnMount, ...props }: ScrollToTopProps) => import("react/jsx-runtime").JSX.Element;
 export { ScrollToTop };
 //# sourceMappingURL=ScrollToTop.d.ts.map

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

@@ -1 +1 @@
-{"version":3,"file":"ScrollToTop.d.ts","sourceRoot":"","sources":["../../src/components/ScrollToTop.tsx"],"names":[],"mappings":"AAEA,OAAO,KAA8B,MAAM,OAAO,CAAA;AAKlD,MAAM,WAAW,gBAAgB;IAC/B,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,QAAQ,CAAC,EAAE,cAAc,GAAG,aAAa,GAAG,eAAe,CAAA;IAC3D,IAAI,CAAC,EAAE,IAAI,GAAG,IAAI,GAAG,IAAI,CAAA;IACzB,OAAO,CAAC,EAAE,SAAS,GAAG,SAAS,GAAG,WAAW,GAAG,SAAS,CAAA;IACzD,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,QAAQ,CAAC,EAAE,MAAM,CAAA;IACjB,QAAQ,CAAC,EAAE,MAAM,CAAA;IACjB,QAAQ,CAAC,EAAE,OAAO,CAAA;CACnB;AAED,QAAA,MAAM,WAAW,yFAsGf,CAAA;AAIF,OAAO,EAAE,WAAW,EAAE,CAAA"}
+{"version":3,"file":"ScrollToTop.d.ts","sourceRoot":"","sources":["../../src/components/ScrollToTop.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,MAAM,OAAO,CAAA;AAGzB,OAAO,EAAE,QAAQ,EAAE,MAAM,cAAc,CAAA;AAGvC;;;;;;;;;;;GAWG;AACH,MAAM,WAAW,gBAAiB,SAAQ,KAAK,CAAC,cAAc,CAAC,iBAAiB,CAAC;IAC/E,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,MAAM,CAAC,EAAE,OAAO,CAAA;IAChB,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,IAAI,CAAC,EAAE,QAAQ,CAAA;IACf,IAAI,CAAC,EAAE,IAAI,GAAG,IAAI,GAAG,IAAI,CAAA;IACzB,OAAO,CAAC,EAAE,SAAS,GAAG,SAAS,GAAG,WAAW,GAAG,SAAS,GAAG,OAAO,CAAA;IACnE,WAAW,CAAC,EAAE,OAAO,CAAA;CACtB;AAED;;;;;;;;;;;;;;;;;;;;;;;;;GAyBG;AACH,QAAA,MAAM,WAAW,GAAI,8EASlB,gBAAgB,4CA8ClB,CAAA;AAED,OAAO,EAAE,WAAW,EAAE,CAAA"}

package/dist/components/SectionHeader.d.ts

@@ -0,0 +1,42 @@
+import React from "react";
+/**
+ * SectionHeader 컴포넌트의 props / SectionHeader component props
+ * @typedef {Object} SectionHeaderProps
+ * @property {string} title - 섹션 제목 / Section title
+ * @property {string} [description] - 섹션 설명 / Section description
+ * @property {React.ReactNode} [action] - 액션 버튼 또는 요소 / Action button or element
+ * @extends {React.HTMLAttributes<HTMLDivElement>}
+ */
+export interface SectionHeaderProps extends React.HTMLAttributes<HTMLDivElement> {
+    title: string;
+    description?: string;
+    action?: React.ReactNode;
+}
+/**
+ * SectionHeader 컴포넌트 / SectionHeader component
+ *
+ * 섹션의 헤더를 표시하는 컴포넌트입니다.
+ * 제목, 설명, 액션 버튼을 포함할 수 있습니다.
+ *
+ * Component that displays section header.
+ * Can include title, description, and action button.
+ *
+ * @component
+ * @example
+ * // 기본 사용 / Basic usage
+ * <SectionHeader title="섹션 제목" />
+ *
+ * @example
+ * // 설명과 액션 포함 / With description and action
+ * <SectionHeader
+ *   title="알림"
+ *   description="최근 알림 목록"
+ *   action={<Button>모두 읽음</Button>}
+ * />
+ *
+ * @param {SectionHeaderProps} props - SectionHeader 컴포넌트의 props / SectionHeader component props
+ * @param {React.Ref<HTMLDivElement>} ref - div 요소 ref / div element ref
+ * @returns {JSX.Element} SectionHeader 컴포넌트 / SectionHeader component
+ */
+export declare const SectionHeader: React.ForwardRefExoticComponent<SectionHeaderProps & React.RefAttributes<HTMLDivElement>>;
+//# sourceMappingURL=SectionHeader.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"SectionHeader.d.ts","sourceRoot":"","sources":["../../src/components/SectionHeader.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,MAAM,OAAO,CAAC;AAG1B;;;;;;;GAOG;AACH,MAAM,WAAW,kBAAmB,SAAQ,KAAK,CAAC,cAAc,CAAC,cAAc,CAAC;IAC9E,KAAK,EAAE,MAAM,CAAC;IACd,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,MAAM,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;CAC1B;AAED;;;;;;;;;;;;;;;;;;;;;;;;;GAyBG;AACH,eAAO,MAAM,aAAa,2FAsCzB,CAAC"}

package/dist/components/Select.d.ts

@@ -1,16 +1,73 @@
-import * as React from "react";
+import React from "react";
+/**
+ * Select 컴포넌트의 props / Select component props
+ * @typedef {Object} SelectProps
+ * @property {"default" | "outline" | "filled" | "ghost" | "glass"} [variant="default"] - Select 스타일 변형 / Select style variant
+ * @property {"sm" | "md" | "lg"} [size="md"] - Select 크기 / Select size
+ * @property {boolean} [error=false] - 에러 상태 표시 / Error state
+ * @property {boolean} [success=false] - 성공 상태 표시 / Success state
+ * @property {React.ReactNode} [leftIcon] - 왼쪽 아이콘 / Left icon
+ * @property {string} [placeholder] - 플레이스홀더 텍스트 / Placeholder text
+ * @extends {Omit<React.SelectHTMLAttributes<HTMLSelectElement>, 'size'>}
+ */
 export interface SelectProps extends Omit<React.SelectHTMLAttributes<HTMLSelectElement>, 'size'> {
-    variant?: "default" | "outline" | "filled" | "ghost";
+    variant?: "default" | "outline" | "filled" | "ghost" | "glass";
     size?: "sm" | "md" | "lg";
     error?: boolean;
     success?: boolean;
     leftIcon?: React.ReactNode;
     placeholder?: string;
 }
+/**
+ * SelectOption 컴포넌트의 props / SelectOption component props
+ * @typedef {Object} SelectOptionProps
+ * @property {string} value - 옵션 값 / Option value
+ * @property {React.ReactNode} children - 옵션 표시 텍스트 / Option display text
+ * @extends {React.OptionHTMLAttributes<HTMLOptionElement>}
+ */
 export interface SelectOptionProps extends React.OptionHTMLAttributes<HTMLOptionElement> {
     value: string;
     children: React.ReactNode;
 }
+/**
+ * Select 컴포넌트 / Select component
+ *
+ * 드롭다운 선택 메뉴를 제공하는 컴포넌트입니다.
+ * 다양한 스타일 변형과 크기를 지원하며, 접근성 속성을 포함합니다.
+ *
+ * Dropdown selection menu component.
+ * Supports various style variants and sizes, includes accessibility attributes.
+ *
+ * @component
+ * @example
+ * // 기본 사용 / Basic usage
+ * <Select>
+ *   <option value="option1">옵션 1</option>
+ *   <option value="option2">옵션 2</option>
+ * </Select>
+ *
+ * @example
+ * // 에러 상태와 아이콘 / Error state with icon
+ * <Select
+ *   error
+ *   leftIcon={<Icon name="alert" />}
+ *   aria-label="국가 선택"
+ * >
+ *   <option value="">국가를 선택하세요</option>
+ *   <option value="kr">한국</option>
+ *   <option value="us">미국</option>
+ * </Select>
+ *
+ * @example
+ * // 다양한 변형 / Various variants
+ * <Select variant="outline" size="lg">
+ *   <option value="1">항목 1</option>
+ * </Select>
+ *
+ * @param {SelectProps} props - Select 컴포넌트의 props / Select component props
+ * @param {React.Ref<HTMLSelectElement>} ref - select 요소 ref / select element ref
+ * @returns {JSX.Element} Select 컴포넌트 / Select component
+ */
 declare const Select: React.ForwardRefExoticComponent<SelectProps & React.RefAttributes<HTMLSelectElement>>;
 declare const SelectOption: React.ForwardRefExoticComponent<SelectOptionProps & React.RefAttributes<HTMLOptionElement>>;
 export { Select, SelectOption };

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

@@ -1 +1 @@
-{"version":3,"file":"Select.d.ts","sourceRoot":"","sources":["../../src/components/Select.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAI9B,MAAM,WAAW,WAAY,SAAQ,IAAI,CAAC,KAAK,CAAC,oBAAoB,CAAC,iBAAiB,CAAC,EAAE,MAAM,CAAC;IAC9F,OAAO,CAAC,EAAE,SAAS,GAAG,SAAS,GAAG,QAAQ,GAAG,OAAO,CAAA;IACpD,IAAI,CAAC,EAAE,IAAI,GAAG,IAAI,GAAG,IAAI,CAAA;IACzB,KAAK,CAAC,EAAE,OAAO,CAAA;IACf,OAAO,CAAC,EAAE,OAAO,CAAA;IACjB,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;IAC1B,WAAW,CAAC,EAAE,MAAM,CAAA;CACrB;AAED,MAAM,WAAW,iBAAkB,SAAQ,KAAK,CAAC,oBAAoB,CAAC,iBAAiB,CAAC;IACtF,KAAK,EAAE,MAAM,CAAA;IACb,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAA;CAC1B;AAED,QAAA,MAAM,MAAM,uFAgEX,CAAA;AAGD,QAAA,MAAM,YAAY,6FAQjB,CAAA;AAGD,OAAO,EAAE,MAAM,EAAE,YAAY,EAAE,CAAA"}
+{"version":3,"file":"Select.d.ts","sourceRoot":"","sources":["../../src/components/Select.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,MAAM,OAAO,CAAA;AAIzB;;;;;;;;;;GAUG;AACH,MAAM,WAAW,WAAY,SAAQ,IAAI,CAAC,KAAK,CAAC,oBAAoB,CAAC,iBAAiB,CAAC,EAAE,MAAM,CAAC;IAC9F,OAAO,CAAC,EAAE,SAAS,GAAG,SAAS,GAAG,QAAQ,GAAG,OAAO,GAAG,OAAO,CAAA;IAC9D,IAAI,CAAC,EAAE,IAAI,GAAG,IAAI,GAAG,IAAI,CAAA;IACzB,KAAK,CAAC,EAAE,OAAO,CAAA;IACf,OAAO,CAAC,EAAE,OAAO,CAAA;IACjB,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;IAC1B,WAAW,CAAC,EAAE,MAAM,CAAA;CACrB;AAED;;;;;;GAMG;AACH,MAAM,WAAW,iBAAkB,SAAQ,KAAK,CAAC,oBAAoB,CAAC,iBAAiB,CAAC;IACtF,KAAK,EAAE,MAAM,CAAA;IACb,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAA;CAC1B;AAED;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAsCG;AACH,QAAA,MAAM,MAAM,uFA+FX,CAAA;AAGD,QAAA,MAAM,YAAY,6FAQjB,CAAA;AAGD,OAAO,EAAE,MAAM,EAAE,YAAY,EAAE,CAAA"}

package/dist/components/Skeleton.d.ts

@@ -1,4 +1,14 @@
-import * as React from "react";
+import React from "react";
+/**
+ * Skeleton 컴포넌트의 props
+ * @typedef {Object} SkeletonProps
+ * @property {"text" | "circular" | "rectangular" | "rounded"} [variant="text"] - Skeleton 모양
+ * @property {string | number} [width] - 너비 (기본값: variant에 따라 다름)
+ * @property {string | number} [height] - 높이 (기본값: variant에 따라 다름)
+ * @property {"pulse" | "wave" | "shimmer"} [animation="pulse"] - 애니메이션 타입
+ * @property {string} [className] - 추가 CSS 클래스
+ * @extends {React.HTMLAttributes<HTMLDivElement>}
+ */
 export interface SkeletonProps extends React.HTMLAttributes<HTMLDivElement> {
     variant?: "text" | "circular" | "rectangular" | "rounded";
     width?: string | number;
@@ -6,6 +16,37 @@ export interface SkeletonProps extends React.HTMLAttributes<HTMLDivElement> {
     animation?: "pulse" | "wave" | "shimmer";
     className?: string;
 }
+/**
+ * Skeleton 컴포넌트 / Skeleton component
+ *
+ * 로딩 중 콘텐츠의 플레이스홀더를 표시하는 스켈레톤 컴포넌트입니다.
+ * 다양한 모양과 애니메이션을 지원합니다.
+ *
+ * Skeleton component that displays placeholders for content while loading.
+ * Supports various shapes and animations.
+ *
+ * @component
+ * @example
+ * // 기본 사용 (텍스트) / Basic usage (text)
+ * <Skeleton />
+ *
+ * @example
+ * // 원형 아바타 / Circular avatar
+ * <Skeleton variant="circular" width={40} height={40} />
+ *
+ * @example
+ * // Wave 애니메이션 / Wave animation
+ * <Skeleton
+ *   variant="rounded"
+ *   width="100%"
+ *   height={200}
+ *   animation="wave"
+ * />
+ *
+ * @param {SkeletonProps} props - Skeleton 컴포넌트의 props / Skeleton component props
+ * @param {React.Ref<HTMLDivElement>} ref - div 요소 ref / div element ref
+ * @returns {JSX.Element} Skeleton 컴포넌트 / Skeleton component
+ */
 declare const Skeleton: React.ForwardRefExoticComponent<SkeletonProps & React.RefAttributes<HTMLDivElement>>;
 export declare const SkeletonText: React.ForwardRefExoticComponent<Omit<SkeletonProps, "variant"> & React.RefAttributes<HTMLDivElement>>;
 export declare const SkeletonCircle: React.ForwardRefExoticComponent<Omit<SkeletonProps, "variant"> & React.RefAttributes<HTMLDivElement>>;
@@ -13,6 +54,8 @@ export declare const SkeletonRectangle: React.ForwardRefExoticComponent<Omit<Ske
 export declare const SkeletonRounded: React.ForwardRefExoticComponent<Omit<SkeletonProps, "variant"> & React.RefAttributes<HTMLDivElement>>;
 export declare const SkeletonCard: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLDivElement> & React.RefAttributes<HTMLDivElement>>;
 export declare const SkeletonAvatar: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLDivElement> & React.RefAttributes<HTMLDivElement>>;
+export declare const SkeletonImage: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLDivElement> & React.RefAttributes<HTMLDivElement>>;
+export declare const SkeletonUserProfile: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLDivElement> & React.RefAttributes<HTMLDivElement>>;
 export declare const SkeletonList: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLDivElement> & React.RefAttributes<HTMLDivElement>>;
 export declare const SkeletonTable: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLDivElement> & React.RefAttributes<HTMLDivElement>>;
 export { Skeleton };

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

@@ -1 +1 @@
-{"version":3,"file":"Skeleton.d.ts","sourceRoot":"","sources":["../../src/components/Skeleton.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAG9B,MAAM,WAAW,aAAc,SAAQ,KAAK,CAAC,cAAc,CAAC,cAAc,CAAC;IACzE,OAAO,CAAC,EAAE,MAAM,GAAG,UAAU,GAAG,aAAa,GAAG,SAAS,CAAA;IACzD,KAAK,CAAC,EAAE,MAAM,GAAG,MAAM,CAAA;IACvB,MAAM,CAAC,EAAE,MAAM,GAAG,MAAM,CAAA;IACxB,SAAS,CAAC,EAAE,OAAO,GAAG,MAAM,GAAG,SAAS,CAAA;IACxC,SAAS,CAAC,EAAE,MAAM,CAAA;CACnB;AAED,QAAA,MAAM,QAAQ,sFAuEb,CAAA;AAID,eAAO,MAAM,YAAY,uGAIxB,CAAA;AAGD,eAAO,MAAM,cAAc,uGAI1B,CAAA;AAGD,eAAO,MAAM,iBAAiB,uGAI7B,CAAA;AAGD,eAAO,MAAM,eAAe,uGAI3B,CAAA;AAID,eAAO,MAAM,YAAY,6GAsBxB,CAAA;AAGD,eAAO,MAAM,cAAc,6GAc1B,CAAA;AAGD,eAAO,MAAM,YAAY,6GAkBxB,CAAA;AAGD,eAAO,MAAM,aAAa,6GAyBzB,CAAA;AAGD,OAAO,EAAE,QAAQ,EAAE,CAAA"}
+{"version":3,"file":"Skeleton.d.ts","sourceRoot":"","sources":["../../src/components/Skeleton.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,MAAM,OAAO,CAAA;AAGzB;;;;;;;;;GASG;AACH,MAAM,WAAW,aAAc,SAAQ,KAAK,CAAC,cAAc,CAAC,cAAc,CAAC;IACzE,OAAO,CAAC,EAAE,MAAM,GAAG,UAAU,GAAG,aAAa,GAAG,SAAS,CAAA;IACzD,KAAK,CAAC,EAAE,MAAM,GAAG,MAAM,CAAA;IACvB,MAAM,CAAC,EAAE,MAAM,GAAG,MAAM,CAAA;IACxB,SAAS,CAAC,EAAE,OAAO,GAAG,MAAM,GAAG,SAAS,CAAA;IACxC,SAAS,CAAC,EAAE,MAAM,CAAA;CACnB;AAED;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA8BG;AACH,QAAA,MAAM,QAAQ,sFAuEb,CAAA;AAID,eAAO,MAAM,YAAY,uGAIxB,CAAA;AAGD,eAAO,MAAM,cAAc,uGAI1B,CAAA;AAGD,eAAO,MAAM,iBAAiB,uGAI7B,CAAA;AAGD,eAAO,MAAM,eAAe,uGAI3B,CAAA;AAID,eAAO,MAAM,YAAY,6GAsBxB,CAAA;AAGD,eAAO,MAAM,cAAc,6GAc1B,CAAA;AAGD,eAAO,MAAM,aAAa,6GAWzB,CAAA;AAGD,eAAO,MAAM,mBAAmB,6GAoB/B,CAAA;AAGD,eAAO,MAAM,YAAY,6GAkBxB,CAAA;AAGD,eAAO,MAAM,aAAa,6GAyBzB,CAAA;AAGD,OAAO,EAAE,QAAQ,EAAE,CAAA"}

package/dist/components/Slider.d.ts

@@ -0,0 +1,75 @@
+import React from "react";
+/**
+ * Slider 컴포넌트의 props
+ * @typedef {Object} SliderProps
+ * @property {"default" | "primary" | "success" | "warning" | "danger"} [variant="default"] - Slider 스타일 변형
+ * @property {"sm" | "md" | "lg"} [size="md"] - Slider 크기
+ * @property {boolean} [showValue=false] - 현재 값 표시 여부
+ * @property {boolean} [showLabel=false] - 라벨 표시 여부
+ * @property {string} [label] - 라벨 텍스트
+ * @property {number} [min=0] - 최소값
+ * @property {number} [max=100] - 최대값
+ * @property {number} [step=1] - 단계값
+ * @property {number | number[]} [value=0] - 현재 값 (배열이면 범위 슬라이더)
+ * @property {(value: number | number[]) => void} [onValueChange] - 값 변경 콜백
+ * @property {"horizontal" | "vertical"} [orientation="horizontal"] - Slider 방향
+ * @property {boolean} [disabled=false] - 비활성화 여부
+ * @property {string} [className] - 추가 CSS 클래스
+ * @extends {Omit<React.InputHTMLAttributes<HTMLInputElement>, 'type' | 'value' | 'onChange' | 'size'>}
+ */
+export interface SliderProps extends Omit<React.InputHTMLAttributes<HTMLInputElement>, 'type' | 'value' | 'onChange' | 'size'> {
+    variant?: "default" | "primary" | "success" | "warning" | "danger";
+    size?: "sm" | "md" | "lg";
+    showValue?: boolean;
+    showLabel?: boolean;
+    label?: string;
+    min?: number;
+    max?: number;
+    step?: number;
+    value?: number | number[];
+    onValueChange?: (value: number | number[]) => void;
+    orientation?: "horizontal" | "vertical";
+    disabled?: boolean;
+    className?: string;
+}
+/**
+ * Slider 컴포넌트 / Slider component
+ *
+ * 숫자 값을 선택하는 슬라이더 컴포넌트입니다.
+ * 단일 값 또는 범위 값을 선택할 수 있습니다.
+ *
+ * Slider component for selecting numeric values.
+ * Supports single value or range value selection.
+ *
+ * @component
+ * @example
+ * // 기본 사용 / Basic usage
+ * const [value, setValue] = useState(50)
+ * <Slider value={value} onValueChange={setValue} />
+ *
+ * @example
+ * // 범위 슬라이더 / Range slider
+ * const [range, setRange] = useState([20, 80])
+ * <Slider
+ *   value={range}
+ *   onValueChange={setRange}
+ *   showValue
+ *   label="가격 범위"
+ * />
+ *
+ * @example
+ * // 세로 슬라이더 / Vertical slider
+ * <Slider
+ *   orientation="vertical"
+ *   variant="primary"
+ *   size="lg"
+ *   className="h-64"
+ * />
+ *
+ * @param {SliderProps} props - Slider 컴포넌트의 props / Slider component props
+ * @param {React.Ref<HTMLInputElement>} ref - input 요소 ref / input element ref
+ * @returns {JSX.Element} Slider 컴포넌트 / Slider component
+ */
+declare const Slider: React.ForwardRefExoticComponent<SliderProps & React.RefAttributes<HTMLInputElement>>;
+export { Slider };
+//# sourceMappingURL=Slider.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"Slider.d.ts","sourceRoot":"","sources":["../../src/components/Slider.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,MAAM,OAAO,CAAA;AAGzB;;;;;;;;;;;;;;;;;GAiBG;AACH,MAAM,WAAW,WAAY,SAAQ,IAAI,CAAC,KAAK,CAAC,mBAAmB,CAAC,gBAAgB,CAAC,EAAE,MAAM,GAAG,OAAO,GAAG,UAAU,GAAG,MAAM,CAAC;IAC5H,OAAO,CAAC,EAAE,SAAS,GAAG,SAAS,GAAG,SAAS,GAAG,SAAS,GAAG,QAAQ,CAAA;IAClE,IAAI,CAAC,EAAE,IAAI,GAAG,IAAI,GAAG,IAAI,CAAA;IACzB,SAAS,CAAC,EAAE,OAAO,CAAA;IACnB,SAAS,CAAC,EAAE,OAAO,CAAA;IACnB,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,GAAG,CAAC,EAAE,MAAM,CAAA;IACZ,GAAG,CAAC,EAAE,MAAM,CAAA;IACZ,IAAI,CAAC,EAAE,MAAM,CAAA;IACb,KAAK,CAAC,EAAE,MAAM,GAAG,MAAM,EAAE,CAAA;IACzB,aAAa,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,GAAG,MAAM,EAAE,KAAK,IAAI,CAAA;IAClD,WAAW,CAAC,EAAE,YAAY,GAAG,UAAU,CAAA;IACvC,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,SAAS,CAAC,EAAE,MAAM,CAAA;CACnB;AAED;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAqCG;AACH,QAAA,MAAM,MAAM,sFAsOX,CAAA;AAGD,OAAO,EAAE,MAAM,EAAE,CAAA"}

package/dist/components/Stack.d.ts

@@ -1,4 +1,14 @@
-import * as React from "react";
+import React from "react";
+/**
+ * Stack 컴포넌트의 props
+ * @typedef {Object} StackProps
+ * @property {"vertical" | "horizontal"} [direction="vertical"] - 스택 방향
+ * @property {"none" | "sm" | "md" | "lg" | "xl"} [spacing="md"] - 아이템 간 간격
+ * @property {"start" | "center" | "end" | "stretch"} [align="start"] - 교차축 정렬
+ * @property {"start" | "center" | "end" | "between" | "around" | "evenly"} [justify="start"] - 주축 정렬
+ * @property {boolean} [wrap=false] - 아이템 줄바꿈 허용
+ * @extends {React.HTMLAttributes<HTMLDivElement>}
+ */
 export interface StackProps extends React.HTMLAttributes<HTMLDivElement> {
     direction?: "vertical" | "horizontal";
     spacing?: "none" | "sm" | "md" | "lg" | "xl";
@@ -6,6 +16,37 @@ export interface StackProps extends React.HTMLAttributes<HTMLDivElement> {
     justify?: "start" | "center" | "end" | "between" | "around" | "evenly";
     wrap?: boolean;
 }
+/**
+ * Stack 컴포넌트
+ *
+ * Flexbox를 사용한 스택 레이아웃 컴포넌트입니다.
+ * 수직 또는 수평 방향으로 아이템을 배치하고 정렬할 수 있습니다.
+ *
+ * @component
+ * @example
+ * // 기본 수직 스택
+ * <Stack spacing="md">
+ *   <div>아이템 1</div>
+ *   <div>아이템 2</div>
+ * </Stack>
+ *
+ * @example
+ * // 수평 스택, 중앙 정렬
+ * <Stack direction="horizontal" spacing="lg" align="center" justify="between">
+ *   <Button>왼쪽</Button>
+ *   <Button>오른쪽</Button>
+ * </Stack>
+ *
+ * @example
+ * // 줄바꿈 허용
+ * <Stack direction="horizontal" wrap spacing="sm">
+ *   {tags.map(tag => <Badge key={tag}>{tag}</Badge>)}
+ * </Stack>
+ *
+ * @param {StackProps} props - Stack 컴포넌트의 props
+ * @param {React.Ref<HTMLDivElement>} ref - div 요소 ref
+ * @returns {JSX.Element} Stack 컴포넌트
+ */
 declare const Stack: React.ForwardRefExoticComponent<StackProps & React.RefAttributes<HTMLDivElement>>;
 export { Stack };
 //# sourceMappingURL=Stack.d.ts.map

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

@@ -1 +1 @@
-{"version":3,"file":"Stack.d.ts","sourceRoot":"","sources":["../../src/components/Stack.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAG9B,MAAM,WAAW,UAAW,SAAQ,KAAK,CAAC,cAAc,CAAC,cAAc,CAAC;IACtE,SAAS,CAAC,EAAE,UAAU,GAAG,YAAY,CAAA;IACrC,OAAO,CAAC,EAAE,MAAM,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,CAAA;IAC5C,KAAK,CAAC,EAAE,OAAO,GAAG,QAAQ,GAAG,KAAK,GAAG,SAAS,CAAA;IAC9C,OAAO,CAAC,EAAE,OAAO,GAAG,QAAQ,GAAG,KAAK,GAAG,SAAS,GAAG,QAAQ,GAAG,QAAQ,CAAA;IACtE,IAAI,CAAC,EAAE,OAAO,CAAA;CACf;AAED,QAAA,MAAM,KAAK,mFAsDV,CAAA;AAGD,OAAO,EAAE,KAAK,EAAE,CAAA"}
+{"version":3,"file":"Stack.d.ts","sourceRoot":"","sources":["../../src/components/Stack.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,MAAM,OAAO,CAAA;AAGzB;;;;;;;;;GASG;AACH,MAAM,WAAW,UAAW,SAAQ,KAAK,CAAC,cAAc,CAAC,cAAc,CAAC;IACtE,SAAS,CAAC,EAAE,UAAU,GAAG,YAAY,CAAA;IACrC,OAAO,CAAC,EAAE,MAAM,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,CAAA;IAC5C,KAAK,CAAC,EAAE,OAAO,GAAG,QAAQ,GAAG,KAAK,GAAG,SAAS,CAAA;IAC9C,OAAO,CAAC,EAAE,OAAO,GAAG,QAAQ,GAAG,KAAK,GAAG,SAAS,GAAG,QAAQ,GAAG,QAAQ,CAAA;IACtE,IAAI,CAAC,EAAE,OAAO,CAAA;CACf;AAED;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA8BG;AACH,QAAA,MAAM,KAAK,mFAsDV,CAAA;AAGD,OAAO,EAAE,KAAK,EAAE,CAAA"}

package/dist/components/StatsPanel.d.ts

@@ -0,0 +1,72 @@
+import React from "react";
+/**
+ * StatsPanelItem 인터페이스 / StatsPanelItem interface
+ * @typedef {Object} StatsPanelItem
+ * @property {string} label - 통계 항목 라벨 / Stat item label
+ * @property {string | React.ReactNode} value - 통계 값 / Stat value
+ * @property {string | React.ReactNode} [description] - 통계 설명 / Stat description
+ * @property {"up" | "down" | "neutral"} [trend] - 추세 방향 / Trend direction
+ * @property {string} [trendValue] - 추세 값 / Trend value
+ * @property {"primary" | "secondary" | "neutral" | "warning"} [accent] - 강조 색상 / Accent color
+ * @property {React.ReactNode} [icon] - 아이콘 / Icon
+ */
+export interface StatsPanelItem {
+    label: string;
+    value: string | React.ReactNode;
+    description?: string | React.ReactNode;
+    trend?: "up" | "down" | "neutral";
+    trendValue?: string;
+    accent?: "primary" | "secondary" | "neutral" | "warning";
+    icon?: React.ReactNode;
+}
+/**
+ * StatsPanel 컴포넌트의 props / StatsPanel component props
+ * @typedef {Object} StatsPanelProps
+ * @property {string} [title] - 패널 제목 / Panel title
+ * @property {StatsPanelItem[]} items - 통계 항목 배열 / Stat items array
+ * @property {1 | 2 | 3 | 4} [columns=4] - 그리드 컬럼 수 / Grid column count
+ * @property {boolean} [loading=false] - 로딩 상태 / Loading state
+ * @extends {React.HTMLAttributes<HTMLDivElement>}
+ */
+export interface StatsPanelProps extends React.HTMLAttributes<HTMLDivElement> {
+    title?: string;
+    items: StatsPanelItem[];
+    columns?: 1 | 2 | 3 | 4;
+    loading?: boolean;
+}
+/**
+ * StatsPanel 컴포넌트 / StatsPanel component
+ *
+ * 통계 정보를 표시하는 패널 컴포넌트입니다.
+ * 여러 통계 항목을 그리드 형태로 표시하며, 추세 정보를 포함할 수 있습니다.
+ *
+ * Panel component that displays statistics.
+ * Shows multiple stat items in grid format and can include trend information.
+ *
+ * @component
+ * @example
+ * // 기본 사용 / Basic usage
+ * <StatsPanel
+ *   items={[
+ *     { label: "총 사용자", value: "1,234", trend: "up", trendValue: "+12%" },
+ *     { label: "활성 사용자", value: "567", trend: "down", trendValue: "-5%" }
+ *   ]}
+ * />
+ *
+ * @example
+ * // 2열 그리드, 제목 포함 / 2-column grid with title
+ * <StatsPanel
+ *   title="통계"
+ *   columns={2}
+ *   items={[
+ *     { label: "항목 1", value: "100", accent: "primary" },
+ *     { label: "항목 2", value: "200", accent: "secondary" }
+ *   ]}
+ * />
+ *
+ * @param {StatsPanelProps} props - StatsPanel 컴포넌트의 props / StatsPanel component props
+ * @param {React.Ref<HTMLDivElement>} ref - div 요소 ref / div element ref
+ * @returns {JSX.Element} StatsPanel 컴포넌트 / StatsPanel component
+ */
+export declare const StatsPanel: React.ForwardRefExoticComponent<StatsPanelProps & React.RefAttributes<HTMLDivElement>>;
+//# sourceMappingURL=StatsPanel.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"StatsPanel.d.ts","sourceRoot":"","sources":["../../src/components/StatsPanel.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,MAAM,OAAO,CAAC;AAG1B;;;;;;;;;;GAUG;AACH,MAAM,WAAW,cAAc;IAC7B,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,EAAE,MAAM,GAAG,KAAK,CAAC,SAAS,CAAC;IAChC,WAAW,CAAC,EAAE,MAAM,GAAG,KAAK,CAAC,SAAS,CAAC;IACvC,KAAK,CAAC,EAAE,IAAI,GAAG,MAAM,GAAG,SAAS,CAAC;IAClC,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,MAAM,CAAC,EAAE,SAAS,GAAG,WAAW,GAAG,SAAS,GAAG,SAAS,CAAC;IACzD,IAAI,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;CACxB;AAED;;;;;;;;GAQG;AACH,MAAM,WAAW,eAAgB,SAAQ,KAAK,CAAC,cAAc,CAAC,cAAc,CAAC;IAC3E,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,KAAK,EAAE,cAAc,EAAE,CAAC;IACxB,OAAO,CAAC,EAAE,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,CAAC;IACxB,OAAO,CAAC,EAAE,OAAO,CAAC;CACnB;AAED;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAiCG;AACH,eAAO,MAAM,UAAU,wFAyJtB,CAAC"}

package/dist/components/Switch.d.ts

@@ -1,12 +1,58 @@
-import * as React from "react";
+import React from "react";
+/**
+ * Switch 컴포넌트의 props / Switch component props
+ * @typedef {Object} SwitchProps
+ * @property {"default" | "outline" | "filled" | "glass"} [variant="default"] - Switch 스타일 변형 / Switch style variant
+ * @property {"sm" | "md" | "lg"} [size="md"] - Switch 크기 / Switch size
+ * @property {boolean} [error=false] - 에러 상태 표시 / Error state
+ * @property {boolean} [success=false] - 성공 상태 표시 / Success state
+ * @property {string} [label] - 스위치 레이블 텍스트 / Switch label text
+ * @property {string} [description] - 스위치 설명 텍스트 / Switch description text
+ * @extends {Omit<React.InputHTMLAttributes<HTMLInputElement>, 'size'>}
+ */
 export interface SwitchProps extends Omit<React.InputHTMLAttributes<HTMLInputElement>, 'size'> {
-    variant?: "default" | "outline" | "filled";
+    variant?: "default" | "outline" | "filled" | "glass";
     size?: "sm" | "md" | "lg";
     error?: boolean;
     success?: boolean;
     label?: string;
     description?: string;
 }
+/**
+ * Switch 컴포넌트 / Switch component
+ *
+ * 토글 스위치 입력 필드를 제공하는 컴포넌트입니다.
+ * ARIA 속성을 자동으로 설정하여 접근성을 지원합니다.
+ *
+ * Toggle switch input field component.
+ * Automatically sets ARIA attributes for accessibility support.
+ *
+ * @component
+ * @example
+ * // 기본 사용 / Basic usage
+ * <Switch label="알림 받기" />
+ *
+ * @example
+ * // 제어 컴포넌트 / Controlled component
+ * const [enabled, setEnabled] = useState(false)
+ * <Switch
+ *   checked={enabled}
+ *   onChange={(e) => setEnabled(e.target.checked)}
+ *   label="다크 모드"
+ * />
+ *
+ * @example
+ * // 에러 상태 / Error state
+ * <Switch
+ *   label="필수 설정"
+ *   description="이 설정을 활성화해야 합니다"
+ *   error
+ * />
+ *
+ * @param {SwitchProps} props - Switch 컴포넌트의 props / Switch component props
+ * @param {React.Ref<HTMLInputElement>} ref - input 요소 ref / input element ref
+ * @returns {JSX.Element} Switch 컴포넌트 / Switch component
+ */
 declare const Switch: React.ForwardRefExoticComponent<SwitchProps & React.RefAttributes<HTMLInputElement>>;
 export { Switch };
 //# sourceMappingURL=Switch.d.ts.map

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

@@ -1 +1 @@
-{"version":3,"file":"Switch.d.ts","sourceRoot":"","sources":["../../src/components/Switch.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAG9B,MAAM,WAAW,WAAY,SAAQ,IAAI,CAAC,KAAK,CAAC,mBAAmB,CAAC,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAC5F,OAAO,CAAC,EAAE,SAAS,GAAG,SAAS,GAAG,QAAQ,CAAA;IAC1C,IAAI,CAAC,EAAE,IAAI,GAAG,IAAI,GAAG,IAAI,CAAA;IACzB,KAAK,CAAC,EAAE,OAAO,CAAA;IACf,OAAO,CAAC,EAAE,OAAO,CAAA;IACjB,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,WAAW,CAAC,EAAE,MAAM,CAAA;CACrB;AAED,QAAA,MAAM,MAAM,sFAsFX,CAAA;AAGD,OAAO,EAAE,MAAM,EAAE,CAAA"}
+{"version":3,"file":"Switch.d.ts","sourceRoot":"","sources":["../../src/components/Switch.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,MAAM,OAAO,CAAA;AAGzB;;;;;;;;;;GAUG;AACH,MAAM,WAAW,WAAY,SAAQ,IAAI,CAAC,KAAK,CAAC,mBAAmB,CAAC,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAC5F,OAAO,CAAC,EAAE,SAAS,GAAG,SAAS,GAAG,QAAQ,GAAG,OAAO,CAAA;IACpD,IAAI,CAAC,EAAE,IAAI,GAAG,IAAI,GAAG,IAAI,CAAA;IACzB,KAAK,CAAC,EAAE,OAAO,CAAA;IACf,OAAO,CAAC,EAAE,OAAO,CAAA;IACjB,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,WAAW,CAAC,EAAE,MAAM,CAAA;CACrB;AAED;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAkCG;AACH,QAAA,MAAM,MAAM,sFAkGX,CAAA;AAGD,OAAO,EAAE,MAAM,EAAE,CAAA"}