@mondrianai/runyourai-design-system 0.0.13 → 0.0.15

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/dist/index.d.mts CHANGED
@@ -309,28 +309,35 @@ interface ComboboxProps {
309
309
  declare function Combobox({ options, value, onValueChange, placeholder, searchPlaceholder, showSearch, footer, className, disabled, }: ComboboxProps): react_jsx_runtime.JSX.Element;
310
310
 
311
311
  type DatePickerLocale = 'ko' | 'en' | 'jp';
312
- type DatePickerMode = 'date' | 'offset';
312
+ type DatePickerMode = 'date' | 'offset' | 'range';
313
+ type DateRange = {
314
+ start?: Date;
315
+ end?: Date;
316
+ };
313
317
  interface DatePickerProps {
314
- /** Controlled value */
318
+ /** Controlled value (date / offset modes) */
315
319
  value?: Date;
316
- /** Uncontrolled default value */
320
+ /** Uncontrolled default value (date / offset modes) */
317
321
  defaultValue?: Date;
318
- /** Called when user selects a date */
322
+ /** Called when user selects a date (date / offset modes) */
319
323
  onChange?: (date: Date | undefined) => void;
320
324
  /**
321
- * 'date' — trigger shows formatted date (e.g. "June 01, 2025")
325
+ * 'date' — trigger shows formatted date (e.g. "June 01, 2025")
322
326
  * 'offset' — trigger shows days-from-today (e.g. "In 2 days")
327
+ * 'range' — user interactively picks start + end; use range / onRangeChange
323
328
  */
324
329
  mode?: DatePickerMode;
330
+ /** Controlled range value. Used when mode='range'. */
331
+ range?: DateRange;
332
+ /** Uncontrolled default range. Used when mode='range'. */
333
+ defaultRange?: DateRange;
334
+ /** Called when the selected range changes. Used when mode='range'. */
335
+ onRangeChange?: (range: DateRange) => void;
325
336
  /** When true, dates before today cannot be selected and prev-month nav is blocked at current month */
326
337
  disablePast?: boolean;
327
338
  locale?: DatePickerLocale;
328
339
  /** Override the placeholder shown when no date is selected */
329
340
  placeholder?: string;
330
- /**
331
- * Receives the selected date and returns a helper string rendered below the trigger.
332
- * Only shown when mode='offset' and a date is selected.
333
- */
334
341
  className?: string;
335
342
  /**
336
343
  * [minYear, maxYear] for the year dropdown.
@@ -341,7 +348,7 @@ interface DatePickerProps {
341
348
  showTodayLabel?: boolean;
342
349
  disabled?: boolean;
343
350
  }
344
- declare function DatePicker({ value, defaultValue, onChange, mode, disablePast, locale, placeholder, className, yearRange, showTodayLabel, disabled, }: DatePickerProps): react_jsx_runtime.JSX.Element;
351
+ declare function DatePicker({ value, defaultValue, onChange, mode, range, defaultRange, onRangeChange, disablePast, locale, placeholder, className, yearRange, showTodayLabel, disabled, }: DatePickerProps): react_jsx_runtime.JSX.Element;
345
352
 
346
353
  interface FieldProps {
347
354
  /** 필드 레이블 */
@@ -707,11 +714,15 @@ type SidebarSubMenuItem = {
707
714
  titleBadge?: string | number;
708
715
  onClick?: () => void;
709
716
  isExternal?: boolean;
717
+ /** 아이템 행 우측에 렌더링되는 커스텀 콘텐츠. 링크 외부에 위치하므로 버튼 등 인터랙티브 요소를 포함할 수 있습니다. */
718
+ rightContent?: React$1.ReactNode;
710
719
  };
711
720
  type SidebarMainMenuItem = {
712
721
  type?: 'item';
713
722
  id: string;
714
723
  title: string;
724
+ /** 서브메뉴 패널 헤더 영역을 커스텀할 ReactNode. 미지정 시 title 문자열을 기본 스타일로 표시합니다. */
725
+ panelHeader?: React$1.ReactNode;
715
726
  href: string;
716
727
  icon: React$1.ReactNode;
717
728
  isActive?: boolean;
@@ -742,7 +753,7 @@ declare function SidebarLink({ href, className, style, onClick, children, }: {
742
753
  onClick?: () => void;
743
754
  children: React$1.ReactNode;
744
755
  }): React$1.ReactElement<unknown, string | React$1.JSXElementConstructor<any>>;
745
- declare function Sidebar({ logo, menus, avatar, utilities, panelTopContent, panelCenterContent, panelBottomContent, className, LinkComponent, }: {
756
+ declare function Sidebar({ logo, menus, avatar, utilities, panelTopContent, panelCenterContent, panelBottomContent, className, LinkComponent, isPanelOpen: isPanelOpenProp, onPanelOpenChange, mainMenuIconSize, }: {
746
757
  logo: React$1.ReactNode;
747
758
  menus: SidebarMainMenuItem[];
748
759
  avatar: React$1.ReactNode;
@@ -752,6 +763,20 @@ declare function Sidebar({ logo, menus, avatar, utilities, panelTopContent, pane
752
763
  panelBottomContent?: React$1.ReactNode;
753
764
  className?: string;
754
765
  LinkComponent: SidebarLinkComponent;
766
+ /**
767
+ * 서브메뉴 패널의 열림 상태를 외부에서 제어합니다.
768
+ * - `true` / `false`: controlled 모드 — subMenus 배열 길이와 관계없이 이 값을 따릅니다.
769
+ * - `undefined` (기본값): uncontrolled 모드 — activeMenu의 subMenus가 있을 때 자동으로 열립니다.
770
+ */
771
+ isPanelOpen?: boolean;
772
+ /** 패널 열림 상태가 변경될 때 호출됩니다. controlled / uncontrolled 모두 동작합니다. */
773
+ onPanelOpenChange?: (isOpen: boolean) => void;
774
+ /**
775
+ * 좌측 메인 메뉴(내비게이터) 아이콘 컨테이너 크기.
776
+ * - `'md'` (기본값): 32px
777
+ * - `'lg'`: 40px
778
+ */
779
+ mainMenuIconSize?: 'md' | 'lg';
755
780
  }): react_jsx_runtime.JSX.Element;
756
781
 
757
782
  interface SkeletonProps extends React$1.HTMLAttributes<HTMLDivElement> {
@@ -796,13 +821,17 @@ interface TabsProps<T extends string = string> {
796
821
  * "pill" — 회색 배경 컨테이너 + 흰 배경 active (segment control 스타일)
797
822
  * "underline" — 하단 밑줄 active (default)
798
823
  */
799
- variant?: 'pill' | 'underline';
824
+ variant?: "pill" | "underline";
800
825
  /** 컨테이너를 w-full로 펼치고 각 탭 버튼을 균등 분할(flex-1)합니다 */
801
826
  block?: boolean;
802
827
  /** Tailwind height 클래스 (e.g. "h-[36px]"). 지정 시 내부 버튼 패딩도 자동 조정됩니다. */
803
828
  height?: string;
804
829
  className?: string;
805
830
  }
831
+ /**
832
+ * 디자인 시스템에서는 동일 뷰의 데이터 전환을 위해 ToggleGroup 대신 Tabs를 사용합니다.
833
+ * Tabs의 원래 목적으로도 사용하며, 한 화면에 두 가지의 의미로 Tabs를 사용하지 않습니다.
834
+ */
806
835
  declare function Tabs<T extends string = string>({ allTabs, current, onTabChange, variant, block, height, className, }: TabsProps<T>): react_jsx_runtime.JSX.Element;
807
836
 
808
837
  interface ToggleProps extends Omit<React$1.ButtonHTMLAttributes<HTMLButtonElement>, 'onClick'> {
@@ -1519,4 +1548,4 @@ declare function WordFileIcon({ className }: {
1519
1548
  className?: string;
1520
1549
  }): react_jsx_runtime.JSX.Element;
1521
1550
 
1522
- 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, 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, CardAction, CardContent, CardDescription, CardFooter, CardHeader, CardTitle, 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, DatePicker, type DatePickerLocale, type DatePickerMode, type DatePickerProps, DeepSeekIcon, DownloadIcon, Drawer, type DrawerProps, DriveIcon, DropdownMenu, DropdownMenuCheckboxItem, DropdownMenuContent, DropdownMenuGroup, DropdownMenuItem, DropdownMenuLabel, DropdownMenuPortal, DropdownMenuRadioGroup, DropdownMenuRadioItem, DropdownMenuSeparator, DropdownMenuShortcut, DropdownMenuSub, DropdownMenuSubContent, DropdownMenuSubTrigger, DropdownMenuTrigger, Empty, EmptyTrayIcon, Field, FieldDivider, type FieldProps, FieldRow, type FieldRowProps, FieldSection, type FieldSectionProps, FileCodeIcon, FileSearchIcon, FileTypeCornerIcon, FolderAmberIcon, FolderBlueIcon, FolderClosedIcon, FolderGreenIcon, FolderVioletIcon, GeminiIcon, GoogleIcon, HangulFileIcon, Header, type HeaderNavItem, type HeaderProps, HeadingIcon, HtmlFileIcon, ICON_NODES, Icon, type IconProps, ImageIcon, ImportIcon, IndentIcon, Input, InputGroup, InputGroupAddon, InputGroupButton, InputGroupInput, InputGroupText, InputGroupTextarea, InputOTP, InputOTPGroup, InputOTPSeparator, InputOTPSlot, ItalicIcon, KbCard, type KbCardMetadataItem, type KbCardProps, KeyRoundIcon, type LanguageItem, LayersIcon, LayoutGridIcon, LineChartIcon, LinkIcon, ListIcon, ListOrderedIcon, MarkdownFileIcon, MarkdownMessage, Menubar, MenubarContent, MenubarGroup, MenubarItem, MenubarMenu, MenubarSeparator, MenubarShortcut, MenubarSub, MenubarSubContent, MenubarSubTrigger, MenubarTrigger, MessageCircleIcon, MessageFooter, type MessageFooterProps, MessagesSquareIcon, Modal, type ModalProps, MyPageIcon, type NavDropdownItem, type NotificationItem, NumberBadge, type NumberBadgeProps, OpenAiIcon, OutdentIcon, Pagination, PanelLeftIcon, PdfFileIcon, PenLineIcon, PencilLineIcon, PresentationIcon, Progress, type ProgressProps, type ProgressThreshold, 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, StrikethroughIcon, Switch, SwitchField, type SwitchFieldProps, type TabItem, Table, type TableColumn, type TablePaginationConfig, TablePropertiesIcon, type TableProps, type TableSortingItem, Tabs, type TabsProps, Toggle, ToggleGroup, type ToggleGroupItemData, type ToggleGroupProps, type ToggleProps, Tooltip, type TooltipProps, TooltipProvider, TooltipWithIcon, type TooltipWithIconProps, TrashIcon, UpstageIcon, type UserMenuSection, type UserMenuSectionItem, UserMessageBubble, WandSparklesIcon, WordFileIcon, buttonVariants, toggleBaseClasses, toggleSizeClasses };
1551
+ 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, 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, CardAction, CardContent, CardDescription, CardFooter, CardHeader, CardTitle, 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, DatePicker, type DatePickerLocale, type DatePickerMode, type DatePickerProps, type DateRange, DeepSeekIcon, DownloadIcon, Drawer, type DrawerProps, DriveIcon, DropdownMenu, DropdownMenuCheckboxItem, DropdownMenuContent, DropdownMenuGroup, DropdownMenuItem, DropdownMenuLabel, DropdownMenuPortal, DropdownMenuRadioGroup, DropdownMenuRadioItem, DropdownMenuSeparator, DropdownMenuShortcut, DropdownMenuSub, DropdownMenuSubContent, DropdownMenuSubTrigger, DropdownMenuTrigger, Empty, EmptyTrayIcon, Field, FieldDivider, type FieldProps, FieldRow, type FieldRowProps, FieldSection, type FieldSectionProps, FileCodeIcon, FileSearchIcon, FileTypeCornerIcon, FolderAmberIcon, FolderBlueIcon, FolderClosedIcon, FolderGreenIcon, FolderVioletIcon, GeminiIcon, GoogleIcon, HangulFileIcon, Header, type HeaderNavItem, type HeaderProps, HeadingIcon, HtmlFileIcon, ICON_NODES, Icon, type IconProps, ImageIcon, ImportIcon, IndentIcon, Input, InputGroup, InputGroupAddon, InputGroupButton, InputGroupInput, InputGroupText, InputGroupTextarea, InputOTP, InputOTPGroup, InputOTPSeparator, InputOTPSlot, ItalicIcon, KbCard, type KbCardMetadataItem, type KbCardProps, KeyRoundIcon, type LanguageItem, LayersIcon, LayoutGridIcon, LineChartIcon, LinkIcon, ListIcon, ListOrderedIcon, MarkdownFileIcon, MarkdownMessage, Menubar, MenubarContent, MenubarGroup, MenubarItem, MenubarMenu, MenubarSeparator, MenubarShortcut, MenubarSub, MenubarSubContent, MenubarSubTrigger, MenubarTrigger, MessageCircleIcon, MessageFooter, type MessageFooterProps, MessagesSquareIcon, Modal, type ModalProps, MyPageIcon, type NavDropdownItem, type NotificationItem, NumberBadge, type NumberBadgeProps, OpenAiIcon, OutdentIcon, Pagination, PanelLeftIcon, PdfFileIcon, PenLineIcon, PencilLineIcon, PresentationIcon, Progress, type ProgressProps, type ProgressThreshold, 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, StrikethroughIcon, Switch, SwitchField, type SwitchFieldProps, type TabItem, Table, type TableColumn, type TablePaginationConfig, TablePropertiesIcon, type TableProps, type TableSortingItem, Tabs, type TabsProps, Toggle, ToggleGroup, type ToggleGroupItemData, type ToggleGroupProps, type ToggleProps, Tooltip, type TooltipProps, TooltipProvider, TooltipWithIcon, type TooltipWithIconProps, TrashIcon, UpstageIcon, type UserMenuSection, type UserMenuSectionItem, UserMessageBubble, WandSparklesIcon, WordFileIcon, buttonVariants, toggleBaseClasses, toggleSizeClasses };
package/dist/index.d.ts CHANGED
@@ -309,28 +309,35 @@ interface ComboboxProps {
309
309
  declare function Combobox({ options, value, onValueChange, placeholder, searchPlaceholder, showSearch, footer, className, disabled, }: ComboboxProps): react_jsx_runtime.JSX.Element;
310
310
 
311
311
  type DatePickerLocale = 'ko' | 'en' | 'jp';
312
- type DatePickerMode = 'date' | 'offset';
312
+ type DatePickerMode = 'date' | 'offset' | 'range';
313
+ type DateRange = {
314
+ start?: Date;
315
+ end?: Date;
316
+ };
313
317
  interface DatePickerProps {
314
- /** Controlled value */
318
+ /** Controlled value (date / offset modes) */
315
319
  value?: Date;
316
- /** Uncontrolled default value */
320
+ /** Uncontrolled default value (date / offset modes) */
317
321
  defaultValue?: Date;
318
- /** Called when user selects a date */
322
+ /** Called when user selects a date (date / offset modes) */
319
323
  onChange?: (date: Date | undefined) => void;
320
324
  /**
321
- * 'date' — trigger shows formatted date (e.g. "June 01, 2025")
325
+ * 'date' — trigger shows formatted date (e.g. "June 01, 2025")
322
326
  * 'offset' — trigger shows days-from-today (e.g. "In 2 days")
327
+ * 'range' — user interactively picks start + end; use range / onRangeChange
323
328
  */
324
329
  mode?: DatePickerMode;
330
+ /** Controlled range value. Used when mode='range'. */
331
+ range?: DateRange;
332
+ /** Uncontrolled default range. Used when mode='range'. */
333
+ defaultRange?: DateRange;
334
+ /** Called when the selected range changes. Used when mode='range'. */
335
+ onRangeChange?: (range: DateRange) => void;
325
336
  /** When true, dates before today cannot be selected and prev-month nav is blocked at current month */
326
337
  disablePast?: boolean;
327
338
  locale?: DatePickerLocale;
328
339
  /** Override the placeholder shown when no date is selected */
329
340
  placeholder?: string;
330
- /**
331
- * Receives the selected date and returns a helper string rendered below the trigger.
332
- * Only shown when mode='offset' and a date is selected.
333
- */
334
341
  className?: string;
335
342
  /**
336
343
  * [minYear, maxYear] for the year dropdown.
@@ -341,7 +348,7 @@ interface DatePickerProps {
341
348
  showTodayLabel?: boolean;
342
349
  disabled?: boolean;
343
350
  }
344
- declare function DatePicker({ value, defaultValue, onChange, mode, disablePast, locale, placeholder, className, yearRange, showTodayLabel, disabled, }: DatePickerProps): react_jsx_runtime.JSX.Element;
351
+ declare function DatePicker({ value, defaultValue, onChange, mode, range, defaultRange, onRangeChange, disablePast, locale, placeholder, className, yearRange, showTodayLabel, disabled, }: DatePickerProps): react_jsx_runtime.JSX.Element;
345
352
 
346
353
  interface FieldProps {
347
354
  /** 필드 레이블 */
@@ -707,11 +714,15 @@ type SidebarSubMenuItem = {
707
714
  titleBadge?: string | number;
708
715
  onClick?: () => void;
709
716
  isExternal?: boolean;
717
+ /** 아이템 행 우측에 렌더링되는 커스텀 콘텐츠. 링크 외부에 위치하므로 버튼 등 인터랙티브 요소를 포함할 수 있습니다. */
718
+ rightContent?: React$1.ReactNode;
710
719
  };
711
720
  type SidebarMainMenuItem = {
712
721
  type?: 'item';
713
722
  id: string;
714
723
  title: string;
724
+ /** 서브메뉴 패널 헤더 영역을 커스텀할 ReactNode. 미지정 시 title 문자열을 기본 스타일로 표시합니다. */
725
+ panelHeader?: React$1.ReactNode;
715
726
  href: string;
716
727
  icon: React$1.ReactNode;
717
728
  isActive?: boolean;
@@ -742,7 +753,7 @@ declare function SidebarLink({ href, className, style, onClick, children, }: {
742
753
  onClick?: () => void;
743
754
  children: React$1.ReactNode;
744
755
  }): React$1.ReactElement<unknown, string | React$1.JSXElementConstructor<any>>;
745
- declare function Sidebar({ logo, menus, avatar, utilities, panelTopContent, panelCenterContent, panelBottomContent, className, LinkComponent, }: {
756
+ declare function Sidebar({ logo, menus, avatar, utilities, panelTopContent, panelCenterContent, panelBottomContent, className, LinkComponent, isPanelOpen: isPanelOpenProp, onPanelOpenChange, mainMenuIconSize, }: {
746
757
  logo: React$1.ReactNode;
747
758
  menus: SidebarMainMenuItem[];
748
759
  avatar: React$1.ReactNode;
@@ -752,6 +763,20 @@ declare function Sidebar({ logo, menus, avatar, utilities, panelTopContent, pane
752
763
  panelBottomContent?: React$1.ReactNode;
753
764
  className?: string;
754
765
  LinkComponent: SidebarLinkComponent;
766
+ /**
767
+ * 서브메뉴 패널의 열림 상태를 외부에서 제어합니다.
768
+ * - `true` / `false`: controlled 모드 — subMenus 배열 길이와 관계없이 이 값을 따릅니다.
769
+ * - `undefined` (기본값): uncontrolled 모드 — activeMenu의 subMenus가 있을 때 자동으로 열립니다.
770
+ */
771
+ isPanelOpen?: boolean;
772
+ /** 패널 열림 상태가 변경될 때 호출됩니다. controlled / uncontrolled 모두 동작합니다. */
773
+ onPanelOpenChange?: (isOpen: boolean) => void;
774
+ /**
775
+ * 좌측 메인 메뉴(내비게이터) 아이콘 컨테이너 크기.
776
+ * - `'md'` (기본값): 32px
777
+ * - `'lg'`: 40px
778
+ */
779
+ mainMenuIconSize?: 'md' | 'lg';
755
780
  }): react_jsx_runtime.JSX.Element;
756
781
 
757
782
  interface SkeletonProps extends React$1.HTMLAttributes<HTMLDivElement> {
@@ -796,13 +821,17 @@ interface TabsProps<T extends string = string> {
796
821
  * "pill" — 회색 배경 컨테이너 + 흰 배경 active (segment control 스타일)
797
822
  * "underline" — 하단 밑줄 active (default)
798
823
  */
799
- variant?: 'pill' | 'underline';
824
+ variant?: "pill" | "underline";
800
825
  /** 컨테이너를 w-full로 펼치고 각 탭 버튼을 균등 분할(flex-1)합니다 */
801
826
  block?: boolean;
802
827
  /** Tailwind height 클래스 (e.g. "h-[36px]"). 지정 시 내부 버튼 패딩도 자동 조정됩니다. */
803
828
  height?: string;
804
829
  className?: string;
805
830
  }
831
+ /**
832
+ * 디자인 시스템에서는 동일 뷰의 데이터 전환을 위해 ToggleGroup 대신 Tabs를 사용합니다.
833
+ * Tabs의 원래 목적으로도 사용하며, 한 화면에 두 가지의 의미로 Tabs를 사용하지 않습니다.
834
+ */
806
835
  declare function Tabs<T extends string = string>({ allTabs, current, onTabChange, variant, block, height, className, }: TabsProps<T>): react_jsx_runtime.JSX.Element;
807
836
 
808
837
  interface ToggleProps extends Omit<React$1.ButtonHTMLAttributes<HTMLButtonElement>, 'onClick'> {
@@ -1519,4 +1548,4 @@ declare function WordFileIcon({ className }: {
1519
1548
  className?: string;
1520
1549
  }): react_jsx_runtime.JSX.Element;
1521
1550
 
1522
- 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, 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, CardAction, CardContent, CardDescription, CardFooter, CardHeader, CardTitle, 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, DatePicker, type DatePickerLocale, type DatePickerMode, type DatePickerProps, DeepSeekIcon, DownloadIcon, Drawer, type DrawerProps, DriveIcon, DropdownMenu, DropdownMenuCheckboxItem, DropdownMenuContent, DropdownMenuGroup, DropdownMenuItem, DropdownMenuLabel, DropdownMenuPortal, DropdownMenuRadioGroup, DropdownMenuRadioItem, DropdownMenuSeparator, DropdownMenuShortcut, DropdownMenuSub, DropdownMenuSubContent, DropdownMenuSubTrigger, DropdownMenuTrigger, Empty, EmptyTrayIcon, Field, FieldDivider, type FieldProps, FieldRow, type FieldRowProps, FieldSection, type FieldSectionProps, FileCodeIcon, FileSearchIcon, FileTypeCornerIcon, FolderAmberIcon, FolderBlueIcon, FolderClosedIcon, FolderGreenIcon, FolderVioletIcon, GeminiIcon, GoogleIcon, HangulFileIcon, Header, type HeaderNavItem, type HeaderProps, HeadingIcon, HtmlFileIcon, ICON_NODES, Icon, type IconProps, ImageIcon, ImportIcon, IndentIcon, Input, InputGroup, InputGroupAddon, InputGroupButton, InputGroupInput, InputGroupText, InputGroupTextarea, InputOTP, InputOTPGroup, InputOTPSeparator, InputOTPSlot, ItalicIcon, KbCard, type KbCardMetadataItem, type KbCardProps, KeyRoundIcon, type LanguageItem, LayersIcon, LayoutGridIcon, LineChartIcon, LinkIcon, ListIcon, ListOrderedIcon, MarkdownFileIcon, MarkdownMessage, Menubar, MenubarContent, MenubarGroup, MenubarItem, MenubarMenu, MenubarSeparator, MenubarShortcut, MenubarSub, MenubarSubContent, MenubarSubTrigger, MenubarTrigger, MessageCircleIcon, MessageFooter, type MessageFooterProps, MessagesSquareIcon, Modal, type ModalProps, MyPageIcon, type NavDropdownItem, type NotificationItem, NumberBadge, type NumberBadgeProps, OpenAiIcon, OutdentIcon, Pagination, PanelLeftIcon, PdfFileIcon, PenLineIcon, PencilLineIcon, PresentationIcon, Progress, type ProgressProps, type ProgressThreshold, 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, StrikethroughIcon, Switch, SwitchField, type SwitchFieldProps, type TabItem, Table, type TableColumn, type TablePaginationConfig, TablePropertiesIcon, type TableProps, type TableSortingItem, Tabs, type TabsProps, Toggle, ToggleGroup, type ToggleGroupItemData, type ToggleGroupProps, type ToggleProps, Tooltip, type TooltipProps, TooltipProvider, TooltipWithIcon, type TooltipWithIconProps, TrashIcon, UpstageIcon, type UserMenuSection, type UserMenuSectionItem, UserMessageBubble, WandSparklesIcon, WordFileIcon, buttonVariants, toggleBaseClasses, toggleSizeClasses };
1551
+ 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, 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, CardAction, CardContent, CardDescription, CardFooter, CardHeader, CardTitle, 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, DatePicker, type DatePickerLocale, type DatePickerMode, type DatePickerProps, type DateRange, DeepSeekIcon, DownloadIcon, Drawer, type DrawerProps, DriveIcon, DropdownMenu, DropdownMenuCheckboxItem, DropdownMenuContent, DropdownMenuGroup, DropdownMenuItem, DropdownMenuLabel, DropdownMenuPortal, DropdownMenuRadioGroup, DropdownMenuRadioItem, DropdownMenuSeparator, DropdownMenuShortcut, DropdownMenuSub, DropdownMenuSubContent, DropdownMenuSubTrigger, DropdownMenuTrigger, Empty, EmptyTrayIcon, Field, FieldDivider, type FieldProps, FieldRow, type FieldRowProps, FieldSection, type FieldSectionProps, FileCodeIcon, FileSearchIcon, FileTypeCornerIcon, FolderAmberIcon, FolderBlueIcon, FolderClosedIcon, FolderGreenIcon, FolderVioletIcon, GeminiIcon, GoogleIcon, HangulFileIcon, Header, type HeaderNavItem, type HeaderProps, HeadingIcon, HtmlFileIcon, ICON_NODES, Icon, type IconProps, ImageIcon, ImportIcon, IndentIcon, Input, InputGroup, InputGroupAddon, InputGroupButton, InputGroupInput, InputGroupText, InputGroupTextarea, InputOTP, InputOTPGroup, InputOTPSeparator, InputOTPSlot, ItalicIcon, KbCard, type KbCardMetadataItem, type KbCardProps, KeyRoundIcon, type LanguageItem, LayersIcon, LayoutGridIcon, LineChartIcon, LinkIcon, ListIcon, ListOrderedIcon, MarkdownFileIcon, MarkdownMessage, Menubar, MenubarContent, MenubarGroup, MenubarItem, MenubarMenu, MenubarSeparator, MenubarShortcut, MenubarSub, MenubarSubContent, MenubarSubTrigger, MenubarTrigger, MessageCircleIcon, MessageFooter, type MessageFooterProps, MessagesSquareIcon, Modal, type ModalProps, MyPageIcon, type NavDropdownItem, type NotificationItem, NumberBadge, type NumberBadgeProps, OpenAiIcon, OutdentIcon, Pagination, PanelLeftIcon, PdfFileIcon, PenLineIcon, PencilLineIcon, PresentationIcon, Progress, type ProgressProps, type ProgressThreshold, 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, StrikethroughIcon, Switch, SwitchField, type SwitchFieldProps, type TabItem, Table, type TableColumn, type TablePaginationConfig, TablePropertiesIcon, type TableProps, type TableSortingItem, Tabs, type TabsProps, Toggle, ToggleGroup, type ToggleGroupItemData, type ToggleGroupProps, type ToggleProps, Tooltip, type TooltipProps, TooltipProvider, TooltipWithIcon, type TooltipWithIconProps, TrashIcon, UpstageIcon, type UserMenuSection, type UserMenuSectionItem, UserMessageBubble, WandSparklesIcon, WordFileIcon, buttonVariants, toggleBaseClasses, toggleSizeClasses };