@mondrianai/runyourai-design-system 0.0.4 → 0.0.6

package/README.md

@@ -16,6 +16,26 @@ npm install @mondrianai/runyourai-design-system
 yarn add @mondrianai/runyourai-design-system
 ```
 
+## Local Development (yalc)
+
+소비 앱에서 로컬 빌드를 테스트할 때는 [yalc](https://github.com/wclr/yalc)를 사용합니다.
+
+```bash
+# 최초 1회: 소비 앱에 yalc 연결
+# (design system 레포에서)
+yalc publish
+# (소비 앱 레포에서)
+yalc add @mondrianai/runyourai-design-system
+
+# 이후 변경사항 반영 시 (design system 레포에서)
+npm run build && yalc push
+# 소비 앱 dev 서버 재시작 필요
+```
+
+> **주의**: `sidebar.tsx`, `button.tsx` 등 컴포넌트 소스를 수정한 경우, 반드시 `npm run build && yalc push` 를 실행해야 소비 앱에 변경사항이 반영됩니다. 소스 파일을 수정해도 소비 앱의 dev server hot-reload만으로는 dist가 갱신되지 않습니다.
+
+---
+
 ## Setup
 
 ### 1. 패키지 설치
@@ -89,6 +109,24 @@ export default nextConfig;
 > - `url(...)` 형태의 외부 폰트 import가 있다면 `@import 'tailwindcss'` **앞에** 위치시킵니다.
 > - `@mondrianai/runyourai-design-system/styles`, `@mondrianai/runyourai-design-system/tailwind-theme`는 `@import 'tailwindcss'` **뒤에** 위치시킵니다.
 
+> **디자인 토큰 오버라이드 주의**
+>
+> `:root`에서 디자인 시스템 CSS 변수를 오버라이드할 때, **컴포넌트 표면색 토큰**(`--background`, `--card`, `--popover` 등)을 페이지 배경색 설정 목적으로 변경하면 안 됩니다. 이 변수들은 `Button` outline, `Card`, `Popover` 등 컴포넌트의 배경색에 직접 사용됩니다.
+>
+> **페이지 배경색**은 CSS 토큰 오버라이드 대신 `html`/`body`에 직접 지정하세요.
+>
+> ```css
+> /* ❌ 잘못된 예 — Button outline 등 컴포넌트 배경색까지 바뀜 */
+> :root {
+>   --background: #fdfdfd;
+> }
+>
+> /* ✅ 올바른 예 — 페이지 배경만 변경, 컴포넌트 토큰 무영향 */
+> html, body {
+>   background-color: #fdfdfd;
+> }
+> ```
+
 > **기존 CSS 리셋 주의 (Tailwind v4)**
 > 프로젝트에 `* { margin: 0; padding: 0; }` 같은 전역 리셋이 있다면 반드시 `@layer base`로 감싸야 합니다. Tailwind v4에서 레이어 밖의 스타일은 `@layer utilities`보다 우선순위가 높아 `px-*`, `py-*` 등의 유틸리티 클래스가 무효화됩니다.
 >

package/dist/index.d.mts

@@ -179,7 +179,7 @@ interface DrawerProps {
     metadata?: React$1.ReactNode;
     className?: string;
 }
-declare function Drawer({ open, onClose, title, children, metadata, className, }: DrawerProps): react_jsx_runtime.JSX.Element;
+declare function Drawer({ open, onClose, title, children, metadata, className, }: DrawerProps): react_jsx_runtime.JSX.Element | null;
 
 interface EmptyProps {
     image?: React$1.ReactNode;
@@ -445,6 +445,8 @@ interface KbCardProps {
     name: string;
     metadata?: KbCardMetadataItem[];
     icon?: React$1.ReactNode;
+    /** 아이콘 우측 상단에 노출할 콘텐츠 (e.g. 스크랩 날짜). selectable 모드에서는 무시됨. */
+    topRight?: React$1.ReactNode;
     selectable?: boolean;
     checked?: boolean;
     onCheckedChange?: (checked: boolean) => void;
@@ -452,7 +454,7 @@ interface KbCardProps {
     onClick?: () => void;
     className?: string;
 }
-declare function KbCard({ name, metadata, icon, selectable, checked, onCheckedChange, onClick, className, }: KbCardProps): react_jsx_runtime.JSX.Element;
+declare function KbCard({ name, metadata, icon, topRight, selectable, checked, onCheckedChange, onClick, className, }: KbCardProps): react_jsx_runtime.JSX.Element;
 
 declare function MarkdownMessage({ content, isStreaming, footerMeta, className, }: {
     content: string;
@@ -473,6 +475,13 @@ interface ModalProps {
      * ex) trigger={(open) => <Button onClick={open}>열기</Button>}
      */
     trigger?: (open: () => void) => React$1.ReactNode;
+    /**
+     * controlled 모드: 외부에서 열림 상태를 직접 제어.
+     * onOpenChange와 함께 사용.
+     */
+    open?: boolean;
+    /** controlled 모드에서 열림 상태 변경 콜백 */
+    onOpenChange?: (open: boolean) => void;
     /**
      * footer 버튼 렌더 방식
      * confirm  — 취소 + default(검정) 확인 버튼
@@ -508,7 +517,7 @@ interface ModalProps {
     /** 모달 패널에 추가할 className */
     className?: string;
 }
-declare function Modal({ id, trigger, variant, title, description, showCloseButton, children, cancelLabel, confirmLabel, onConfirm, onCancel, confirmDisabled, closeOnOverlayClick, className, isLoading, }: ModalProps): react_jsx_runtime.JSX.Element;
+declare function Modal({ id, trigger, open: openProp, onOpenChange, variant, title, description, showCloseButton, children, cancelLabel, confirmLabel, onConfirm, onCancel, confirmDisabled, closeOnOverlayClick, className, isLoading, }: ModalProps): react_jsx_runtime.JSX.Element;
 
 declare const Menubar: React$1.ForwardRefExoticComponent<Omit<Menubar$1.MenubarProps & React$1.RefAttributes<HTMLDivElement>, "ref"> & React$1.RefAttributes<HTMLDivElement>>;
 declare const MenubarMenu: {
@@ -677,6 +686,13 @@ declare function Sidebar({ logo, menus, avatar, utilities, panelTopContent, pane
     LinkComponent: SidebarLinkComponent;
 }): react_jsx_runtime.JSX.Element;
 
+declare const skeletonVariants: (props?: ({
+    size?: "sm" | "md" | "lg" | null | undefined;
+} & class_variance_authority_types.ClassProp) | undefined) => string;
+interface SkeletonProps extends React$1.HTMLAttributes<HTMLDivElement>, VariantProps<typeof skeletonVariants> {
+}
+declare function Skeleton({ className, size, style, ...props }: SkeletonProps): react_jsx_runtime.JSX.Element;
+
 declare const Slider: React$1.ForwardRefExoticComponent<Omit<Slider$1.SliderProps & React$1.RefAttributes<HTMLSpanElement>, "ref"> & React$1.RefAttributes<HTMLSpanElement>>;
 
 interface StepperStep {
@@ -695,6 +711,27 @@ interface StepperProps {
 }
 declare function Stepper({ steps, currentStep, className }: StepperProps): react_jsx_runtime.JSX.Element;
 
+interface CircleIndicatorProps {
+    /** 사용량 (바이트 또는 임의 단위) */
+    used: number;
+    /** 전체 용량 */
+    total: number;
+    /** 중앙에 표시할 아이콘 */
+    icon?: React$1.ReactNode;
+    /** hover 시 표시할 툴팁 텍스트 */
+    tooltip?: string;
+    /**
+     * progress arc 색상. CSS color 값 또는 디자인 시스템 토큰을 받습니다.
+     * 예) "#3b82f6" | "var(--color-primary)" | "var(--color-blue-500)"
+     * 미지정 시 primary 색상이 적용됩니다.
+     */
+    color?: string;
+    /** 컴포넌트 크기 (px, 기본값 44) */
+    size?: number;
+    className?: string;
+}
+declare function CircleIndicator({ used, total, icon, tooltip, color, size, className, }: CircleIndicatorProps): react_jsx_runtime.JSX.Element;
+
 declare const Switch: React__default.ForwardRefExoticComponent<Omit<Switch$1.SwitchProps & React__default.RefAttributes<HTMLButtonElement>, "ref"> & React__default.RefAttributes<HTMLButtonElement>>;
 interface SwitchFieldProps extends React__default.ComponentPropsWithoutRef<typeof Switch$1.Root> {
     /** 레이블 텍스트 */
@@ -705,7 +742,7 @@ interface SwitchFieldProps extends React__default.ComponentPropsWithoutRef<typeo
 }
 declare function SwitchField({ label, description, className, id, ...props }: SwitchFieldProps): react_jsx_runtime.JSX.Element;
 
-type SortDirection = 'asc' | 'desc' | null;
+type SortDirection = 'ASC' | 'DESC' | null;
 interface TableColumn<T> {
     key: string;
     header: string;
@@ -1049,11 +1086,6 @@ declare function FileTypeCornerIcon({ className }: {
     className?: string;
 }): react_jsx_runtime.JSX.Element;
 
-/**
- * Folder-amber icon — amber-colored folder from Figma design system.
- * Uses <img> to preserve complex gradient fills and filters.
- * Source: public/icons/folder-amber.svg
- */
 declare function FolderAmberIcon({ className }: {
     className?: string;
 }): react_jsx_runtime.JSX.Element;
@@ -1079,6 +1111,10 @@ declare function FolderVioletIcon({ className }: {
     className?: string;
 }): react_jsx_runtime.JSX.Element;
 
+declare function HangulFileIcon({ className }: {
+    className?: string;
+}): react_jsx_runtime.JSX.Element;
+
 /**
  * Heading icon — SVG downloaded from Figma design system.
  * Source: Figma node (lucide/heading)
@@ -1087,6 +1123,10 @@ declare function HeadingIcon({ className }: {
     className?: string;
 }): react_jsx_runtime.JSX.Element;
 
+declare function HtmlFileIcon({ className }: {
+    className?: string;
+}): react_jsx_runtime.JSX.Element;
+
 /**
  * Image icon — SVG downloaded from Figma design system.
  * Source: Figma node (lucide/image)
@@ -1178,6 +1218,10 @@ declare function MessageCircleIcon({ className }: {
     className?: string;
 }): react_jsx_runtime.JSX.Element;
 
+declare function MarkdownFileIcon({ className }: {
+    className?: string;
+}): react_jsx_runtime.JSX.Element;
+
 /**
  * Messages-square icon — SVG downloaded directly from Figma design system.
  * Uses stroke="currentColor" for CSS color control.
@@ -1212,6 +1256,10 @@ declare function PdfFileIcon({ className }: {
     className?: string;
 }): react_jsx_runtime.JSX.Element;
 
+declare function RefreshCwIcon({ className }: {
+    className?: string;
+}): react_jsx_runtime.JSX.Element;
+
 interface PenLineIconProps {
     className?: string;
 }
@@ -1327,4 +1375,4 @@ declare function WordFileIcon({ className }: {
     className?: string;
 }): react_jsx_runtime.JSX.Element;
 
-export { Accordion, AccordionContent, AccordionItem, AccordionTrigger, AgentBlogIcon, AgentCsIcon, AgentDataIcon, AgentHrIcon, AgentMailIcon, AgentTrendIcon, AiAgentIcon, AiBuilderIcon, AiCloudIcon, AiDatacenterIcon, Alert, AlertDescription, AlertDialog, AlertDialogAction, AlertDialogCancel, AlertDialogContent, AlertDialogDescription, AlertDialogFooter, AlertDialogHeader, AlertDialogOverlay, AlertDialogPortal, AlertDialogTitle, AlertDialogTrigger, AlertTitle, AlignJustifyIcon, AlignLeftIcon, ArrowDownIcon, type AvailabilityStatus, Avatar, AvatarGroup, type AvatarGroupItem, type AvatarGroupProps, type AvatarProps, type AvatarSize, BADGE_VARIANT_STYLES, Badge, type BadgeProps, type BadgeVariant, BlockquoteIcon, BoldIcon, BookOpenIcon, BookUpIcon, Breadcrumb, Button, type ButtonProps, Card, type CardProps, type CardSpec, Checkbox, CheckboxCard, type CheckboxCardProps, type CheckboxProps, ChevronsUpDownIcon, ChoiceCardGroup, type ChoiceCardGroupProps, ChoiceCardItem, type ChoiceCardItemProps, CircleCheckFillIcon, CircleHelpIcon, CircleOutlineIcon, ClaudeIcon, CodeIcon, CodeSquareIcon, Collapsible, CollapsibleContent, type CollapsibleProps, CollapsibleRoot, CollapsibleTrigger, type CollapsibleWorkspace, Combobox, type ComboboxOption, type ComboboxProps, CreditIcon, DataSection, type DataSectionProps, DeepSeekIcon, DownloadIcon, Drawer, type DrawerProps, DriveIcon, Empty, EmptyTrayIcon, Field, FieldDivider, type FieldProps, FieldRow, type FieldRowProps, FieldSection, type FieldSectionProps, FileCodeIcon, FileSearchIcon, FileTypeCornerIcon, FolderAmberIcon, FolderBlueIcon, FolderClosedIcon, FolderGreenIcon, FolderVioletIcon, GeminiIcon, GoogleIcon, GroupedSelect, Header, type HeaderNavItem, type HeaderProps, HeadingIcon, ICON_NODES, Icon, type IconProps, ImageIcon, ImportIcon, IndentIcon, ItalicIcon, KbCard, type KbCardMetadataItem, type KbCardProps, KeyRoundIcon, type LanguageItem, LayersIcon, LayoutGridIcon, LineChartIcon, LinkIcon, ListIcon, ListOrderedIcon, type MachineType, MarkdownMessage, Menubar, MenubarContent, MenubarGroup, MenubarItem, MenubarMenu, MenubarSeparator, MenubarShortcut, MenubarSub, MenubarSubContent, MenubarSubTrigger, MenubarTrigger, MessageCircleIcon, MessageFooter, type MessageFooterProps, MessagesSquareIcon, Modal, type ModalProps, type ModelGroup, type ModelItem, MyPageIcon, type NavDropdownItem, type NotificationItem, NumberBadge, type NumberBadgeProps, OpenAiIcon, OutdentIcon, Pagination, PanelLeftIcon, PdfFileIcon, PenLineIcon, PencilLineIcon, PresentationIcon, Providers, RyaiLogoIcon, SearchInput, type SearchInputProps, SegmentedControl, Select, type SelectGroup, type SelectOption, type SelectProps, Sheet, SheetFileIcon, ShoppingBagIcon, Sidebar, SidebarLink, type SidebarMainMenuItem, type SidebarSubMenuItem, type SidebarUtilityItem, SlideFileIcon, Slider, SmileIcon, type SortDirection, SortIcon, SparklesIcon, SquareCheckIcon, SquareCheckOutlineIcon, StarIcon, Stepper, type StepperProps, type StepperStep, StrikethroughIcon, Switch, SwitchField, type SwitchFieldProps, Table, type TableColumn, type TablePaginationConfig, TablePropertiesIcon, type TableProps, type TableSortingItem, Tooltip, type TooltipProps, TooltipProvider, TooltipWithIcon, type TooltipWithIconProps, TrashIcon, UpstageIcon, type UserMenuSection, type UserMenuSectionItem, UserMessageBubble, WandSparklesIcon, WordFileIcon, buttonVariants };
+export { Accordion, AccordionContent, AccordionItem, AccordionTrigger, AgentBlogIcon, AgentCsIcon, AgentDataIcon, AgentHrIcon, AgentMailIcon, AgentTrendIcon, AiAgentIcon, AiBuilderIcon, AiCloudIcon, AiDatacenterIcon, Alert, AlertDescription, AlertDialog, AlertDialogAction, AlertDialogCancel, AlertDialogContent, AlertDialogDescription, AlertDialogFooter, AlertDialogHeader, AlertDialogOverlay, AlertDialogPortal, AlertDialogTitle, AlertDialogTrigger, AlertTitle, AlignJustifyIcon, AlignLeftIcon, ArrowDownIcon, type AvailabilityStatus, Avatar, AvatarGroup, type AvatarGroupItem, type AvatarGroupProps, type AvatarProps, type AvatarSize, BADGE_VARIANT_STYLES, Badge, type BadgeProps, type BadgeVariant, BlockquoteIcon, BoldIcon, BookOpenIcon, BookUpIcon, Breadcrumb, Button, type ButtonProps, Card, type CardProps, type CardSpec, Checkbox, CheckboxCard, type CheckboxCardProps, type CheckboxProps, ChevronsUpDownIcon, ChoiceCardGroup, type ChoiceCardGroupProps, ChoiceCardItem, type ChoiceCardItemProps, CircleCheckFillIcon, CircleHelpIcon, CircleIndicator, type CircleIndicatorProps, CircleOutlineIcon, ClaudeIcon, CodeIcon, CodeSquareIcon, Collapsible, CollapsibleContent, type CollapsibleProps, CollapsibleRoot, CollapsibleTrigger, type CollapsibleWorkspace, Combobox, type ComboboxOption, type ComboboxProps, CreditIcon, DataSection, type DataSectionProps, DeepSeekIcon, DownloadIcon, Drawer, type DrawerProps, DriveIcon, Empty, EmptyTrayIcon, Field, FieldDivider, type FieldProps, FieldRow, type FieldRowProps, FieldSection, type FieldSectionProps, FileCodeIcon, FileSearchIcon, FileTypeCornerIcon, FolderAmberIcon, FolderBlueIcon, FolderClosedIcon, FolderGreenIcon, FolderVioletIcon, GeminiIcon, GoogleIcon, GroupedSelect, HangulFileIcon, Header, type HeaderNavItem, type HeaderProps, HeadingIcon, HtmlFileIcon, ICON_NODES, Icon, type IconProps, ImageIcon, ImportIcon, IndentIcon, ItalicIcon, KbCard, type KbCardMetadataItem, type KbCardProps, KeyRoundIcon, type LanguageItem, LayersIcon, LayoutGridIcon, LineChartIcon, LinkIcon, ListIcon, ListOrderedIcon, type MachineType, MarkdownFileIcon, MarkdownMessage, Menubar, MenubarContent, MenubarGroup, MenubarItem, MenubarMenu, MenubarSeparator, MenubarShortcut, MenubarSub, MenubarSubContent, MenubarSubTrigger, MenubarTrigger, MessageCircleIcon, MessageFooter, type MessageFooterProps, MessagesSquareIcon, Modal, type ModalProps, type ModelGroup, type ModelItem, MyPageIcon, type NavDropdownItem, type NotificationItem, NumberBadge, type NumberBadgeProps, OpenAiIcon, OutdentIcon, Pagination, PanelLeftIcon, PdfFileIcon, PenLineIcon, PencilLineIcon, PresentationIcon, Providers, RefreshCwIcon, RyaiLogoIcon, SearchInput, type SearchInputProps, SegmentedControl, Select, type SelectGroup, type SelectOption, type SelectProps, Sheet, SheetFileIcon, ShoppingBagIcon, Sidebar, SidebarLink, type SidebarMainMenuItem, type SidebarSubMenuItem, type SidebarUtilityItem, Skeleton, type SkeletonProps, SlideFileIcon, Slider, SmileIcon, type SortDirection, SortIcon, SparklesIcon, SquareCheckIcon, SquareCheckOutlineIcon, StarIcon, Stepper, type StepperProps, type StepperStep, StrikethroughIcon, Switch, SwitchField, type SwitchFieldProps, Table, type TableColumn, type TablePaginationConfig, TablePropertiesIcon, type TableProps, type TableSortingItem, Tooltip, type TooltipProps, TooltipProvider, TooltipWithIcon, type TooltipWithIconProps, TrashIcon, UpstageIcon, type UserMenuSection, type UserMenuSectionItem, UserMessageBubble, WandSparklesIcon, WordFileIcon, buttonVariants };

package/dist/index.d.ts

@@ -179,7 +179,7 @@ interface DrawerProps {
     metadata?: React$1.ReactNode;
     className?: string;
 }
-declare function Drawer({ open, onClose, title, children, metadata, className, }: DrawerProps): react_jsx_runtime.JSX.Element;
+declare function Drawer({ open, onClose, title, children, metadata, className, }: DrawerProps): react_jsx_runtime.JSX.Element | null;
 
 interface EmptyProps {
     image?: React$1.ReactNode;
@@ -445,6 +445,8 @@ interface KbCardProps {
     name: string;
     metadata?: KbCardMetadataItem[];
     icon?: React$1.ReactNode;
+    /** 아이콘 우측 상단에 노출할 콘텐츠 (e.g. 스크랩 날짜). selectable 모드에서는 무시됨. */
+    topRight?: React$1.ReactNode;
     selectable?: boolean;
     checked?: boolean;
     onCheckedChange?: (checked: boolean) => void;
@@ -452,7 +454,7 @@ interface KbCardProps {
     onClick?: () => void;
     className?: string;
 }
-declare function KbCard({ name, metadata, icon, selectable, checked, onCheckedChange, onClick, className, }: KbCardProps): react_jsx_runtime.JSX.Element;
+declare function KbCard({ name, metadata, icon, topRight, selectable, checked, onCheckedChange, onClick, className, }: KbCardProps): react_jsx_runtime.JSX.Element;
 
 declare function MarkdownMessage({ content, isStreaming, footerMeta, className, }: {
     content: string;
@@ -473,6 +475,13 @@ interface ModalProps {
      * ex) trigger={(open) => <Button onClick={open}>열기</Button>}
      */
     trigger?: (open: () => void) => React$1.ReactNode;
+    /**
+     * controlled 모드: 외부에서 열림 상태를 직접 제어.
+     * onOpenChange와 함께 사용.
+     */
+    open?: boolean;
+    /** controlled 모드에서 열림 상태 변경 콜백 */
+    onOpenChange?: (open: boolean) => void;
     /**
      * footer 버튼 렌더 방식
      * confirm  — 취소 + default(검정) 확인 버튼
@@ -508,7 +517,7 @@ interface ModalProps {
     /** 모달 패널에 추가할 className */
     className?: string;
 }
-declare function Modal({ id, trigger, variant, title, description, showCloseButton, children, cancelLabel, confirmLabel, onConfirm, onCancel, confirmDisabled, closeOnOverlayClick, className, isLoading, }: ModalProps): react_jsx_runtime.JSX.Element;
+declare function Modal({ id, trigger, open: openProp, onOpenChange, variant, title, description, showCloseButton, children, cancelLabel, confirmLabel, onConfirm, onCancel, confirmDisabled, closeOnOverlayClick, className, isLoading, }: ModalProps): react_jsx_runtime.JSX.Element;
 
 declare const Menubar: React$1.ForwardRefExoticComponent<Omit<Menubar$1.MenubarProps & React$1.RefAttributes<HTMLDivElement>, "ref"> & React$1.RefAttributes<HTMLDivElement>>;
 declare const MenubarMenu: {
@@ -677,6 +686,13 @@ declare function Sidebar({ logo, menus, avatar, utilities, panelTopContent, pane
     LinkComponent: SidebarLinkComponent;
 }): react_jsx_runtime.JSX.Element;
 
+declare const skeletonVariants: (props?: ({
+    size?: "sm" | "md" | "lg" | null | undefined;
+} & class_variance_authority_types.ClassProp) | undefined) => string;
+interface SkeletonProps extends React$1.HTMLAttributes<HTMLDivElement>, VariantProps<typeof skeletonVariants> {
+}
+declare function Skeleton({ className, size, style, ...props }: SkeletonProps): react_jsx_runtime.JSX.Element;
+
 declare const Slider: React$1.ForwardRefExoticComponent<Omit<Slider$1.SliderProps & React$1.RefAttributes<HTMLSpanElement>, "ref"> & React$1.RefAttributes<HTMLSpanElement>>;
 
 interface StepperStep {
@@ -695,6 +711,27 @@ interface StepperProps {
 }
 declare function Stepper({ steps, currentStep, className }: StepperProps): react_jsx_runtime.JSX.Element;
 
+interface CircleIndicatorProps {
+    /** 사용량 (바이트 또는 임의 단위) */
+    used: number;
+    /** 전체 용량 */
+    total: number;
+    /** 중앙에 표시할 아이콘 */
+    icon?: React$1.ReactNode;
+    /** hover 시 표시할 툴팁 텍스트 */
+    tooltip?: string;
+    /**
+     * progress arc 색상. CSS color 값 또는 디자인 시스템 토큰을 받습니다.
+     * 예) "#3b82f6" | "var(--color-primary)" | "var(--color-blue-500)"
+     * 미지정 시 primary 색상이 적용됩니다.
+     */
+    color?: string;
+    /** 컴포넌트 크기 (px, 기본값 44) */
+    size?: number;
+    className?: string;
+}
+declare function CircleIndicator({ used, total, icon, tooltip, color, size, className, }: CircleIndicatorProps): react_jsx_runtime.JSX.Element;
+
 declare const Switch: React__default.ForwardRefExoticComponent<Omit<Switch$1.SwitchProps & React__default.RefAttributes<HTMLButtonElement>, "ref"> & React__default.RefAttributes<HTMLButtonElement>>;
 interface SwitchFieldProps extends React__default.ComponentPropsWithoutRef<typeof Switch$1.Root> {
     /** 레이블 텍스트 */
@@ -705,7 +742,7 @@ interface SwitchFieldProps extends React__default.ComponentPropsWithoutRef<typeo
 }
 declare function SwitchField({ label, description, className, id, ...props }: SwitchFieldProps): react_jsx_runtime.JSX.Element;
 
-type SortDirection = 'asc' | 'desc' | null;
+type SortDirection = 'ASC' | 'DESC' | null;
 interface TableColumn<T> {
     key: string;
     header: string;
@@ -1049,11 +1086,6 @@ declare function FileTypeCornerIcon({ className }: {
     className?: string;
 }): react_jsx_runtime.JSX.Element;
 
-/**
- * Folder-amber icon — amber-colored folder from Figma design system.
- * Uses <img> to preserve complex gradient fills and filters.
- * Source: public/icons/folder-amber.svg
- */
 declare function FolderAmberIcon({ className }: {
     className?: string;
 }): react_jsx_runtime.JSX.Element;
@@ -1079,6 +1111,10 @@ declare function FolderVioletIcon({ className }: {
     className?: string;
 }): react_jsx_runtime.JSX.Element;
 
+declare function HangulFileIcon({ className }: {
+    className?: string;
+}): react_jsx_runtime.JSX.Element;
+
 /**
  * Heading icon — SVG downloaded from Figma design system.
  * Source: Figma node (lucide/heading)
@@ -1087,6 +1123,10 @@ declare function HeadingIcon({ className }: {
     className?: string;
 }): react_jsx_runtime.JSX.Element;
 
+declare function HtmlFileIcon({ className }: {
+    className?: string;
+}): react_jsx_runtime.JSX.Element;
+
 /**
  * Image icon — SVG downloaded from Figma design system.
  * Source: Figma node (lucide/image)
@@ -1178,6 +1218,10 @@ declare function MessageCircleIcon({ className }: {
     className?: string;
 }): react_jsx_runtime.JSX.Element;
 
+declare function MarkdownFileIcon({ className }: {
+    className?: string;
+}): react_jsx_runtime.JSX.Element;
+
 /**
  * Messages-square icon — SVG downloaded directly from Figma design system.
  * Uses stroke="currentColor" for CSS color control.
@@ -1212,6 +1256,10 @@ declare function PdfFileIcon({ className }: {
     className?: string;
 }): react_jsx_runtime.JSX.Element;
 
+declare function RefreshCwIcon({ className }: {
+    className?: string;
+}): react_jsx_runtime.JSX.Element;
+
 interface PenLineIconProps {
     className?: string;
 }
@@ -1327,4 +1375,4 @@ declare function WordFileIcon({ className }: {
     className?: string;
 }): react_jsx_runtime.JSX.Element;
 
-export { Accordion, AccordionContent, AccordionItem, AccordionTrigger, AgentBlogIcon, AgentCsIcon, AgentDataIcon, AgentHrIcon, AgentMailIcon, AgentTrendIcon, AiAgentIcon, AiBuilderIcon, AiCloudIcon, AiDatacenterIcon, Alert, AlertDescription, AlertDialog, AlertDialogAction, AlertDialogCancel, AlertDialogContent, AlertDialogDescription, AlertDialogFooter, AlertDialogHeader, AlertDialogOverlay, AlertDialogPortal, AlertDialogTitle, AlertDialogTrigger, AlertTitle, AlignJustifyIcon, AlignLeftIcon, ArrowDownIcon, type AvailabilityStatus, Avatar, AvatarGroup, type AvatarGroupItem, type AvatarGroupProps, type AvatarProps, type AvatarSize, BADGE_VARIANT_STYLES, Badge, type BadgeProps, type BadgeVariant, BlockquoteIcon, BoldIcon, BookOpenIcon, BookUpIcon, Breadcrumb, Button, type ButtonProps, Card, type CardProps, type CardSpec, Checkbox, CheckboxCard, type CheckboxCardProps, type CheckboxProps, ChevronsUpDownIcon, ChoiceCardGroup, type ChoiceCardGroupProps, ChoiceCardItem, type ChoiceCardItemProps, CircleCheckFillIcon, CircleHelpIcon, CircleOutlineIcon, ClaudeIcon, CodeIcon, CodeSquareIcon, Collapsible, CollapsibleContent, type CollapsibleProps, CollapsibleRoot, CollapsibleTrigger, type CollapsibleWorkspace, Combobox, type ComboboxOption, type ComboboxProps, CreditIcon, DataSection, type DataSectionProps, DeepSeekIcon, DownloadIcon, Drawer, type DrawerProps, DriveIcon, Empty, EmptyTrayIcon, Field, FieldDivider, type FieldProps, FieldRow, type FieldRowProps, FieldSection, type FieldSectionProps, FileCodeIcon, FileSearchIcon, FileTypeCornerIcon, FolderAmberIcon, FolderBlueIcon, FolderClosedIcon, FolderGreenIcon, FolderVioletIcon, GeminiIcon, GoogleIcon, GroupedSelect, Header, type HeaderNavItem, type HeaderProps, HeadingIcon, ICON_NODES, Icon, type IconProps, ImageIcon, ImportIcon, IndentIcon, ItalicIcon, KbCard, type KbCardMetadataItem, type KbCardProps, KeyRoundIcon, type LanguageItem, LayersIcon, LayoutGridIcon, LineChartIcon, LinkIcon, ListIcon, ListOrderedIcon, type MachineType, MarkdownMessage, Menubar, MenubarContent, MenubarGroup, MenubarItem, MenubarMenu, MenubarSeparator, MenubarShortcut, MenubarSub, MenubarSubContent, MenubarSubTrigger, MenubarTrigger, MessageCircleIcon, MessageFooter, type MessageFooterProps, MessagesSquareIcon, Modal, type ModalProps, type ModelGroup, type ModelItem, MyPageIcon, type NavDropdownItem, type NotificationItem, NumberBadge, type NumberBadgeProps, OpenAiIcon, OutdentIcon, Pagination, PanelLeftIcon, PdfFileIcon, PenLineIcon, PencilLineIcon, PresentationIcon, Providers, RyaiLogoIcon, SearchInput, type SearchInputProps, SegmentedControl, Select, type SelectGroup, type SelectOption, type SelectProps, Sheet, SheetFileIcon, ShoppingBagIcon, Sidebar, SidebarLink, type SidebarMainMenuItem, type SidebarSubMenuItem, type SidebarUtilityItem, SlideFileIcon, Slider, SmileIcon, type SortDirection, SortIcon, SparklesIcon, SquareCheckIcon, SquareCheckOutlineIcon, StarIcon, Stepper, type StepperProps, type StepperStep, StrikethroughIcon, Switch, SwitchField, type SwitchFieldProps, Table, type TableColumn, type TablePaginationConfig, TablePropertiesIcon, type TableProps, type TableSortingItem, Tooltip, type TooltipProps, TooltipProvider, TooltipWithIcon, type TooltipWithIconProps, TrashIcon, UpstageIcon, type UserMenuSection, type UserMenuSectionItem, UserMessageBubble, WandSparklesIcon, WordFileIcon, buttonVariants };
+export { Accordion, AccordionContent, AccordionItem, AccordionTrigger, AgentBlogIcon, AgentCsIcon, AgentDataIcon, AgentHrIcon, AgentMailIcon, AgentTrendIcon, AiAgentIcon, AiBuilderIcon, AiCloudIcon, AiDatacenterIcon, Alert, AlertDescription, AlertDialog, AlertDialogAction, AlertDialogCancel, AlertDialogContent, AlertDialogDescription, AlertDialogFooter, AlertDialogHeader, AlertDialogOverlay, AlertDialogPortal, AlertDialogTitle, AlertDialogTrigger, AlertTitle, AlignJustifyIcon, AlignLeftIcon, ArrowDownIcon, type AvailabilityStatus, Avatar, AvatarGroup, type AvatarGroupItem, type AvatarGroupProps, type AvatarProps, type AvatarSize, BADGE_VARIANT_STYLES, Badge, type BadgeProps, type BadgeVariant, BlockquoteIcon, BoldIcon, BookOpenIcon, BookUpIcon, Breadcrumb, Button, type ButtonProps, Card, type CardProps, type CardSpec, Checkbox, CheckboxCard, type CheckboxCardProps, type CheckboxProps, ChevronsUpDownIcon, ChoiceCardGroup, type ChoiceCardGroupProps, ChoiceCardItem, type ChoiceCardItemProps, CircleCheckFillIcon, CircleHelpIcon, CircleIndicator, type CircleIndicatorProps, CircleOutlineIcon, ClaudeIcon, CodeIcon, CodeSquareIcon, Collapsible, CollapsibleContent, type CollapsibleProps, CollapsibleRoot, CollapsibleTrigger, type CollapsibleWorkspace, Combobox, type ComboboxOption, type ComboboxProps, CreditIcon, DataSection, type DataSectionProps, DeepSeekIcon, DownloadIcon, Drawer, type DrawerProps, DriveIcon, Empty, EmptyTrayIcon, Field, FieldDivider, type FieldProps, FieldRow, type FieldRowProps, FieldSection, type FieldSectionProps, FileCodeIcon, FileSearchIcon, FileTypeCornerIcon, FolderAmberIcon, FolderBlueIcon, FolderClosedIcon, FolderGreenIcon, FolderVioletIcon, GeminiIcon, GoogleIcon, GroupedSelect, HangulFileIcon, Header, type HeaderNavItem, type HeaderProps, HeadingIcon, HtmlFileIcon, ICON_NODES, Icon, type IconProps, ImageIcon, ImportIcon, IndentIcon, ItalicIcon, KbCard, type KbCardMetadataItem, type KbCardProps, KeyRoundIcon, type LanguageItem, LayersIcon, LayoutGridIcon, LineChartIcon, LinkIcon, ListIcon, ListOrderedIcon, type MachineType, MarkdownFileIcon, MarkdownMessage, Menubar, MenubarContent, MenubarGroup, MenubarItem, MenubarMenu, MenubarSeparator, MenubarShortcut, MenubarSub, MenubarSubContent, MenubarSubTrigger, MenubarTrigger, MessageCircleIcon, MessageFooter, type MessageFooterProps, MessagesSquareIcon, Modal, type ModalProps, type ModelGroup, type ModelItem, MyPageIcon, type NavDropdownItem, type NotificationItem, NumberBadge, type NumberBadgeProps, OpenAiIcon, OutdentIcon, Pagination, PanelLeftIcon, PdfFileIcon, PenLineIcon, PencilLineIcon, PresentationIcon, Providers, RefreshCwIcon, RyaiLogoIcon, SearchInput, type SearchInputProps, SegmentedControl, Select, type SelectGroup, type SelectOption, type SelectProps, Sheet, SheetFileIcon, ShoppingBagIcon, Sidebar, SidebarLink, type SidebarMainMenuItem, type SidebarSubMenuItem, type SidebarUtilityItem, Skeleton, type SkeletonProps, SlideFileIcon, Slider, SmileIcon, type SortDirection, SortIcon, SparklesIcon, SquareCheckIcon, SquareCheckOutlineIcon, StarIcon, Stepper, type StepperProps, type StepperStep, StrikethroughIcon, Switch, SwitchField, type SwitchFieldProps, Table, type TableColumn, type TablePaginationConfig, TablePropertiesIcon, type TableProps, type TableSortingItem, Tooltip, type TooltipProps, TooltipProvider, TooltipWithIcon, type TooltipWithIconProps, TrashIcon, UpstageIcon, type UserMenuSection, type UserMenuSectionItem, UserMessageBubble, WandSparklesIcon, WordFileIcon, buttonVariants };