maru_design2 2.31.1 → 3.1.0

package/dist/components/molecules/dropdown/Dropdown.d.ts

@@ -1,9 +1,28 @@
 import React from 'react';
+import { DropdownItemOptions, DropdownVariant } from './types';
 import { TColor } from '../../../enums/color';
 import { TDropdownType } from '../../../enums/type';
 import { IconProps } from '../../atoms/icon';
 import './dropdown.scss';
-interface DropdownProps<T extends Record<string, any>> {
+export interface DropdownProps<T extends Record<string, any>> {
+    /** Visual variant; independent of the existing search type. */
+    variant?: DropdownVariant;
+    startIcon?: IconProps;
+    customStartIcon?: React.ReactNode;
+    badge?: React.ReactNode;
+    helperText?: React.ReactNode;
+    actionContent?: React.ReactNode;
+    onAction?: () => void;
+    actionDisabled?: boolean;
+    actionAriaLabel?: string;
+    clearAriaLabel?: string;
+    searchAriaLabel?: string;
+    searchClearAriaLabel?: string;
+    getItemProps?: (item: T) => DropdownItemOptions;
+    /** Menu width, independent of the complete control width. */
+    menuWidth?: number;
+    /** Accessible name when no visible label is supplied. */
+    'aria-label'?: string;
     data: T[];
     /**
      * 선택된 아이디
@@ -62,6 +81,11 @@ interface DropdownProps<T extends Record<string, any>> {
      * 메뉴 세로 크기(px) (@v1 menuPosition.height)
      */
     height?: number;
+    /**
+     * 텍스트와 화살표(아이콘) 사이 간격(px)
+     * @default 8
+     */
+    gap?: number;
     /**
      * 드롭다운 토글 버튼 사용자 정의 노드. (@v1 toggleChildren)
      */
@@ -77,6 +101,8 @@ interface DropdownProps<T extends Record<string, any>> {
      * 컴포넌트 위치의 기준이 될 엘리먼트 사용자 정의. (@v1 portalAnchor)
      */
     anchorEl?: HTMLElement | null;
+    /** 메뉴를 StyleProvider 루트로 분리합니다. 변형·스크롤이 있는 팝업 내부에서 사용합니다. 기본값 false */
+    portal?: boolean;
     /**
      * 메뉴 맨 밑에 버튼
      */
@@ -86,5 +112,4 @@ interface DropdownProps<T extends Record<string, any>> {
         onClick: () => void;
     };
 }
-export declare function Dropdown<T extends Record<string, any>>({ data, selectedId, onSelect, idKey, displayKey, className, placeholder, searchPlaceholder, disabled, color, stopPropagation, type, errorMessage, label, onClear, noDataMessage, noResultMessage, width, height, customButton, customMenuItem, anchorEl, menuBottomButton, }: DropdownProps<T>): import("react/jsx-runtime").JSX.Element;
-export {};
+export declare function Dropdown<T extends Record<string, any>>({ data, selectedId, onSelect, idKey, displayKey, className, placeholder, searchPlaceholder, disabled, color, stopPropagation, type, variant, startIcon, customStartIcon, badge, helperText, actionContent, onAction, actionDisabled, actionAriaLabel, clearAriaLabel, searchAriaLabel, searchClearAriaLabel, getItemProps, menuWidth, 'aria-label': ariaLabel, errorMessage, label, onClear, noDataMessage, noResultMessage, width, height, gap, customButton, customMenuItem, anchorEl, portal, menuBottomButton, }: DropdownProps<T>): React.JSX.Element;

package/dist/components/molecules/dropdown/OverflowText.d.ts

@@ -0,0 +1,5 @@
+import React from 'react';
+export declare function useOverflow(ref: React.RefObject<HTMLElement>, content: React.ReactNode): boolean;
+export default function OverflowText({ children, }: {
+    children: React.ReactNode;
+}): React.JSX.Element;

package/dist/components/molecules/dropdown/index.d.ts

@@ -1 +1,2 @@
 export * from './Dropdown';
+export type { DropdownVariant, DropdownItemVariant, DropdownItemOptions, } from './types';

package/dist/components/molecules/dropdown/menu/MenuItem.d.ts

@@ -1,16 +1,14 @@
 import React from 'react';
+import { DropdownCustomMenuItem, DropdownItemOptions } from '../types';
 interface Props<T extends Record<string, any>> {
     item: T;
     selectedId: string | undefined;
     onSelect: (id?: string) => void;
     idKey: string;
     displayKey: string;
-    width?: number;
-    customMenuItem?: ({ children, rowId, }: {
-        children: React.ReactNode;
-        rowId: string | number;
-    }) => JSX.Element;
+    customMenuItem?: DropdownCustomMenuItem;
+    options?: DropdownItemOptions;
     onClose: () => void;
 }
-declare function MenuItem<T extends Record<string, any>>({ item, selectedId, onSelect, idKey, displayKey, width, customMenuItem: CustomMenuItem, onClose, }: Props<T>): import("react/jsx-runtime").JSX.Element;
-export default MenuItem;
+export default function MenuItem<T extends Record<string, any>>({ item, selectedId, onSelect, idKey, displayKey, customMenuItem: CustomMenuItem, options, onClose, }: Props<T>): React.JSX.Element;
+export {};

package/dist/components/molecules/dropdown/menu/index.d.ts

@@ -1,7 +1,11 @@
 import React from 'react';
+import { DropdownCustomMenuItem, DropdownItemOptions, DropdownItemVariant } from '../types';
 import { TColor } from '../../../../enums/color';
 import { IconProps } from '../../../atoms/icon';
 interface Props<T extends Record<string, any>> {
+    id: string;
+    labelledBy: string;
+    initialFocus: 'selected' | 'first' | 'last';
     data: T[];
     selectedId: string | undefined;
     onSelect: (id?: string) => void;
@@ -9,23 +13,24 @@ interface Props<T extends Record<string, any>> {
     displayKey: string;
     color?: TColor;
     searchPlaceholder?: string;
+    searchAriaLabel?: string;
+    searchClearAriaLabel?: string;
     noDataMessage?: string;
     noResultMessage?: string;
     width?: number;
     height?: number;
-    customMenuItem?: ({ children, rowId, }: {
-        children: React.ReactNode;
-        rowId: string | number;
-    }) => JSX.Element;
+    customMenuItem?: DropdownCustomMenuItem;
+    getItemProps?: (item: T) => DropdownItemOptions;
+    defaultItemVariant: DropdownItemVariant;
     isSearch: boolean;
     parent: HTMLElement;
-    open: boolean;
-    onClose: () => void;
+    alignEnd: boolean;
+    onClose: (restoreFocus?: boolean) => void;
     menuBottomButton?: {
         content: string;
         startIcon?: IconProps;
         onClick: () => void;
     };
 }
-declare function DropdownMenu<T extends Record<string, any>>({ data, selectedId, onSelect, idKey, displayKey, color, searchPlaceholder, noDataMessage, noResultMessage, width, height, customMenuItem, isSearch, parent, open, onClose, menuBottomButton, }: Props<T>): import("react/jsx-runtime").JSX.Element;
-export default DropdownMenu;
+export default function DropdownMenu<T extends Record<string, any>>({ id, labelledBy, initialFocus, data, selectedId, onSelect, idKey, displayKey, color, searchPlaceholder, searchAriaLabel, searchClearAriaLabel, noDataMessage, noResultMessage, width, height, customMenuItem, getItemProps, defaultItemVariant, isSearch, parent, alignEnd, onClose, menuBottomButton, }: Props<T>): React.JSX.Element;
+export {};

package/dist/components/molecules/dropdown/toggleButton/Arrow.d.ts

@@ -1,9 +1,6 @@
-import { TColor } from '../../../../enums/color';
-interface Props {
+import React from 'react';
+import { DropdownVariant } from '../types';
+export default function Arrow({ open, variant, }: {
     open: boolean;
-    focus: boolean;
-    color: TColor;
-    disabled?: boolean;
-}
-declare function Arrow({ open, focus, color, disabled }: Props): import("react/jsx-runtime").JSX.Element;
-export default Arrow;
+    variant: DropdownVariant;
+}): React.JSX.Element;

package/dist/components/molecules/dropdown/toggleButton/Clear.d.ts

@@ -1,6 +1,5 @@
-interface Props {
-    focus: boolean;
+import React from 'react';
+export default function Clear({ onClear, ariaLabel, }: {
     onClear: () => void;
-}
-declare function Clear({ focus, onClear }: Props): import("react/jsx-runtime").JSX.Element;
-export default Clear;
+    ariaLabel?: string;
+}): React.JSX.Element;

package/dist/components/molecules/dropdown/toggleButton/index.d.ts

@@ -1,19 +1,33 @@
 import React from 'react';
+import { DropdownVariant } from '../types';
 import { TColor } from '../../../../enums/color';
+import { IconProps } from '../../../atoms/icon';
 interface Props<T extends Record<string, any>> {
+    id: string;
+    menuId: string;
+    triggerRef: React.RefObject<HTMLButtonElement>;
+    ariaLabel?: string;
+    describedBy?: string;
     displayKey: string;
     placeholder?: string;
     disabled?: boolean;
     color: TColor;
     stopPropagation?: boolean;
-    width?: number;
+    gap: number;
     customButton?: React.ReactNode;
+    variant: DropdownVariant;
+    startIcon?: IconProps;
+    customStartIcon?: React.ReactNode;
+    badge?: React.ReactNode;
     open: boolean;
     selected: T | undefined;
     errored?: boolean;
     hasClearBtn: boolean;
+    clearAriaLabel?: string;
+    popupRole?: 'menu' | 'dialog';
     onClear: () => void;
     onClick: () => void;
+    onKeyDown: React.KeyboardEventHandler<HTMLButtonElement>;
 }
-declare function DropdownToggleButton<T extends Record<string, any>>({ displayKey, placeholder, disabled, color, stopPropagation, width, customButton, open, selected, errored, hasClearBtn, onClear, onClick, }: Props<T>): import("react/jsx-runtime").JSX.Element;
+declare function DropdownToggleButton<T extends Record<string, any>>({ id, menuId, triggerRef, ariaLabel, describedBy, displayKey, placeholder, disabled, color, stopPropagation, gap, customButton, variant, startIcon, customStartIcon, badge, open, selected, errored, hasClearBtn, clearAriaLabel, popupRole, onClear, onClick, onKeyDown, }: Props<T>): React.JSX.Element;
 export default DropdownToggleButton;

package/dist/components/molecules/dropdown/types.d.ts

@@ -0,0 +1,28 @@
+import React from 'react';
+import { IconProps } from '../../atoms/icon';
+export type DropdownVariant = 'default' | 'button' | 'button-tag' | 'borderless';
+export type DropdownItemVariant = 'default' | 'model' | 'icon' | 'tag';
+/** Presentation and optional actions for one item; data remains caller-owned. */
+export interface DropdownItemOptions {
+    variant?: DropdownItemVariant;
+    startIcon?: IconProps;
+    customStartIcon?: React.ReactNode;
+    endIcon?: IconProps;
+    customEndIcon?: React.ReactNode;
+    supportingText?: React.ReactNode;
+    showDot?: boolean;
+    showSelectedCheck?: boolean;
+    disabled?: boolean;
+    action?: {
+        content: React.ReactNode;
+        ariaLabel: string;
+        onClick: () => void;
+        disabled?: boolean;
+    };
+    onRemove?: () => void;
+    removeAriaLabel?: string;
+}
+export type DropdownCustomMenuItem = (props: {
+    children: React.ReactNode;
+    rowId: string | number;
+}) => JSX.Element;

package/dist/components/molecules/inputWithAction/InputWithAction.d.ts

@@ -0,0 +1,14 @@
+import React from 'react';
+import { InputProps } from '../../atoms/input';
+import './input-with-action.scss';
+export interface InputWithActionProps extends InputProps {
+    /** 우측 액션 버튼 내용 */
+    actionContent: React.ReactNode;
+    /** 우측 액션 버튼 클릭 이벤트 */
+    onAction: () => void;
+    /** 액션 버튼만 별도로 비활성화할지 여부 */
+    actionDisabled?: boolean;
+    /** 액션 버튼의 접근성 이름 */
+    actionAriaLabel?: string;
+}
+export declare const InputWithAction: React.ForwardRefExoticComponent<InputWithActionProps & React.RefAttributes<HTMLInputElement>>;

package/dist/components/molecules/inputWithAction/index.d.ts

@@ -0,0 +1 @@
+export * from './InputWithAction';

package/dist/components/molecules/modal/Modal.d.ts

@@ -7,7 +7,12 @@ export interface ModalProps {
     onClose: () => void;
     open: boolean;
     /**
-     * 배경 클릭 시 컴포넌트 닫히는지 여부. (@v1 backdropOff)
+     * 제목이 없는 모달의 접근성 이름
+     */
+    ariaLabel?: string;
+    /**
+     * 배경에서 누르고 뗄 때 컴포넌트 닫히는지 여부. (@v1 backdropOff)
+     * 모달 안에서 시작해 바깥에서 떼는 드래그는 닫히지 않습니다.
      */
     backdrop?: boolean;
     /**
@@ -18,14 +23,27 @@ export interface ModalProps {
         disabled?: boolean;
     };
     className?: string;
+    /**
+     * 닫기 아이콘 버튼의 접근성 이름
+     */
+    closeButtonAriaLabel?: string;
     /**
      * 엔터키 비활성화 여부. (@v1 disableEnterKeyDown)
      */
     disabledEnter?: boolean;
+    /**
+     * true면 푸터 버튼이 하단 너비를 반반 차지합니다. 기본은 우측 정렬입니다.
+     */
+    fullFooter?: boolean;
     /**
      * 모달 닫기 버튼 숨김 여부. (@v1 hasCloseButton)
      */
     hiddenCloseButton?: boolean;
+    /**
+     * 타이틀 위 아이콘. 없으면 타이틀이 최상단입니다.
+     * Modal은 테두리 박스와 내부 사이즈만 담당하고, 아이콘 노드는 소비자가 넘깁니다.
+     */
+    icon?: React.ReactNode;
     /**
      * 모달 확인버튼 설정 (@v1 confirmButton)
      */
@@ -45,4 +63,4 @@ export interface ModalProps {
      */
     subTitle?: React.ReactNode;
 }
-export declare function Modal({ children, onClose, open, backdrop, cancelButton, className, disabledEnter, hiddenCloseButton, okButton, size, title, subTitle, }: ModalProps): import("react/jsx-runtime").JSX.Element;
+export declare function Modal({ children, onClose, open, ariaLabel, backdrop, cancelButton, className, closeButtonAriaLabel, disabledEnter, fullFooter, hiddenCloseButton, icon, okButton, size, title, subTitle, }: ModalProps): React.JSX.Element;

package/dist/components/molecules/multiSelectDropdown/MultiSelectDropdown.d.ts

@@ -1,5 +1,8 @@
+import React from 'react';
+import { DropdownVariant } from '../dropdown/types';
 import { TColor } from '../../../enums/color';
 import { TDropdownType } from '../../../enums/type';
+import '../dropdown/dropdown.scss';
 import './multi-select-dropdown.scss';
 export interface MultiSelectDropdownProps<T extends Record<string, any>> {
     data: T[];
@@ -19,7 +22,21 @@ export interface MultiSelectDropdownProps<T extends Record<string, any>> {
     /**
      * 드롭다운 버튼에 노출할 컨텐츠
      */
-    content: string;
+    content?: React.ReactNode;
+    /** Optional visual variant; default preserves the existing control. */
+    variant?: DropdownVariant;
+    /** Called only for two or more selections. No built-in language or i18n dependency. */
+    formatSelectedCount?: (count: number) => React.ReactNode;
+    actionContent?: React.ReactNode;
+    onAction?: () => void;
+    actionDisabled?: boolean;
+    actionAriaLabel?: string;
+    clearAriaLabel?: string;
+    searchAriaLabel?: string;
+    searchClearAriaLabel?: string;
+    helperText?: React.ReactNode;
+    menuWidth?: number;
+    'aria-label'?: string;
     className?: string;
     /**
      * 드롭다운 버튼의 placeholder
@@ -73,4 +90,4 @@ export interface MultiSelectDropdownProps<T extends Record<string, any>> {
      */
     anchorEl?: HTMLElement | null;
 }
-export declare function MultiSelectDropdown<T extends Record<string, any>>({ data, selectedIds, onSelect, idKey, displayKey, content, className, placeholder, searchPlaceholder, disabled, color, stopPropagation, type, errorMessage, label, allCheckLabel, onClear, noDataMessage, noResultMessage, width, height, anchorEl, }: MultiSelectDropdownProps<T>): import("react/jsx-runtime").JSX.Element;
+export declare function MultiSelectDropdown<T extends Record<string, any>>({ data, selectedIds, onSelect, idKey, displayKey, content, className, placeholder, searchPlaceholder, disabled, color, stopPropagation, type, variant, formatSelectedCount, actionContent, onAction, actionDisabled, actionAriaLabel, clearAriaLabel, searchAriaLabel, searchClearAriaLabel, helperText, menuWidth, 'aria-label': ariaLabel, errorMessage, label, allCheckLabel, onClear, noDataMessage, noResultMessage, width, height, anchorEl, }: MultiSelectDropdownProps<T>): React.JSX.Element;

package/dist/components/molecules/multiSelectDropdown/menu/MenuItem.d.ts

@@ -1,3 +1,4 @@
+import React from 'react';
 import { TColor } from '../../../../enums/color';
 interface Props<T extends Record<string, any>> {
     item: T;
@@ -8,5 +9,5 @@ interface Props<T extends Record<string, any>> {
     color?: TColor;
     width?: number;
 }
-declare function MenuItem<T extends Record<string, any>>({ item, selectedIds, onSelect, idKey, displayKey, color, width, }: Props<T>): import("react/jsx-runtime").JSX.Element;
+declare function MenuItem<T extends Record<string, any>>({ item, selectedIds, onSelect, idKey, displayKey, color, width, }: Props<T>): React.JSX.Element;
 export default MenuItem;

package/dist/components/molecules/multiSelectDropdown/menu/index.d.ts

@@ -1,5 +1,13 @@
+import React from 'react';
 import { TColor } from '../../../../enums/color';
 interface Props<T extends Record<string, any>> {
+    id: string;
+    labelledBy: string;
+    initialFocus: 'selected' | 'first' | 'last';
+    figmaVariant: boolean;
+    alignEnd: boolean;
+    searchAriaLabel?: string;
+    searchClearAriaLabel?: string;
     data: T[];
     selectedIds: string[];
     onSelect: (ids: string[]) => void;
@@ -14,8 +22,7 @@ interface Props<T extends Record<string, any>> {
     height?: number;
     isSearch: boolean;
     parent: HTMLElement;
-    open: boolean;
-    onClose: () => void;
+    onClose: (restoreFocus?: boolean) => void;
 }
-declare function DropdownMenu<T extends Record<string, any>>({ data, selectedIds, onSelect, idKey, displayKey, searchPlaceholder, allCheckLabel, color, noDataMessage, noResultMessage, width, height, isSearch, parent, open, onClose, }: Props<T>): import("react/jsx-runtime").JSX.Element;
+declare function DropdownMenu<T extends Record<string, any>>({ id, labelledBy, initialFocus, figmaVariant, alignEnd, searchAriaLabel, searchClearAriaLabel, data, selectedIds, onSelect, idKey, displayKey, searchPlaceholder, allCheckLabel, color, noDataMessage, noResultMessage, width, height, isSearch, parent, onClose, }: Props<T>): React.JSX.Element;
 export default DropdownMenu;

package/dist/components/molecules/multiSelectDropdown/toggleButton/Arrow.d.ts

@@ -1,3 +1,4 @@
+import React from 'react';
 import { TColor } from '../../../../enums/color';
 interface Props {
     open: boolean;
@@ -5,5 +6,5 @@ interface Props {
     color: TColor;
     disabled?: boolean;
 }
-declare function Arrow({ open, focus, color, disabled }: Props): import("react/jsx-runtime").JSX.Element;
+declare function Arrow({ open, focus, color, disabled }: Props): React.JSX.Element;
 export default Arrow;

package/dist/components/molecules/multiSelectDropdown/toggleButton/Clear.d.ts

@@ -1,6 +1,8 @@
+import React from 'react';
 interface Props {
     focus: boolean;
     onClear: () => void;
+    ariaLabel?: string;
 }
-declare function Clear({ focus, onClear }: Props): import("react/jsx-runtime").JSX.Element;
+declare function Clear({ focus, onClear, ariaLabel }: Props): React.JSX.Element;
 export default Clear;

package/dist/components/molecules/multiSelectDropdown/toggleButton/index.d.ts

@@ -1,6 +1,14 @@
+import React from 'react';
 import { TColor } from '../../../../enums/color';
 interface Props {
-    content: string;
+    content: React.ReactNode;
+    id: string;
+    menuId: string;
+    triggerRef: React.RefObject<HTMLButtonElement>;
+    ariaLabel?: string;
+    describedBy?: string;
+    clearAriaLabel?: string;
+    onKeyDown: React.KeyboardEventHandler<HTMLButtonElement>;
     placeholder?: string;
     disabled?: boolean;
     color: TColor;
@@ -13,5 +21,5 @@ interface Props {
     onClear: () => void;
     onClick: () => void;
 }
-declare function DropdownToggleButton({ content, placeholder, disabled, color, stopPropagation, width, open, selected, errored, hasClearBtn, onClear, onClick, }: Props): import("react/jsx-runtime").JSX.Element;
+declare function DropdownToggleButton({ content, id, menuId, triggerRef, ariaLabel, describedBy, clearAriaLabel, onKeyDown, placeholder, disabled, color, stopPropagation, width, open, selected, errored, hasClearBtn, onClear, onClick, }: Props): React.JSX.Element;
 export default DropdownToggleButton;

package/dist/components/molecules/numberInput/NumberInput.d.ts

@@ -0,0 +1,18 @@
+import React from 'react';
+import { InputProps } from '../../atoms/input';
+import './number-input.scss';
+export interface NumberInputProps extends Omit<InputProps, 'type' | 'value' | 'defaultValue' | 'onChange' | 'startNode' | 'endNode'> {
+    /** 제어할 숫자 문자열 */
+    value?: string;
+    /** 비제어 방식의 초기 숫자 문자열 */
+    defaultValue?: string;
+    /** 값이 변경될 때 호출되는 함수 */
+    onValueChange?: (value: string) => void;
+    /** 허용할 최솟값 */
+    min?: number;
+    /** 허용할 최댓값 */
+    max?: number;
+    /** 증감 단위 */
+    step?: number;
+}
+export declare const NumberInput: React.ForwardRefExoticComponent<NumberInputProps & React.RefAttributes<HTMLInputElement>>;

package/dist/components/molecules/numberInput/index.d.ts

@@ -0,0 +1 @@
+export * from './NumberInput';

package/dist/components/molecules/pagination/Pagination.d.ts

@@ -1,22 +1,33 @@
+import React from 'react';
 import './pagination.scss';
+export type PaginationVariant = 'default' | 'simple' | 'number';
 export interface PaginationProps {
-    /**
-     * 현재 페이지. (@v1 page.curPage)
-     */
+    /** 현재 페이지 (1부터 시작). */
     page: number;
-    /**
-     * 현재 페이지 설정 함수. (@v1 page.setPage)
-     */
+    /** 페이지 이동 요청. 부모에서 page와 표시 데이터를 갱신합니다. */
     onPageChange: (page: number) => void;
-    /**
-     * 총 페이지
-     */
+    /** 전체 페이지 수. 빈 목록은 0을 전달합니다. */
     totalPage: number;
-    className?: string;
-    /**
-     * prev, next 버튼 공간 차지 여부
-     */
+    /** 기본형 / 페이지 크기 선택형 / 번호형. @default 'default' */
+    variant?: PaginationVariant;
+    /** 기본형 왼쪽에 표시할 정확한 전체 항목 수. 생략하면 범위를 숨깁니다. */
+    totalCount?: number;
+    /** 페이지당 항목 수. simple에서는 부모가 관리하는 선택값입니다. @default 30 */
+    pageSize?: number;
+    /** simple의 페이지당 항목 수 선택지. @default [15, 30, 50, 100] */
+    pageSizeOptions?: number[];
+    /** simple의 개수 변경 요청. 부모에서 pageSize와 totalPage를 갱신하고 page를 1로 초기화하세요. */
+    onPageSizeChange?: (pageSize: number) => void;
+    /** 위쪽 구분선 표시. @default true */
+    divider?: boolean;
+    /** 전체 조작 비활성화. @default false */
+    disabled?: boolean;
+    /** visible: 경계의 이동 버튼을 비활성화해 표시. hidden: 공간을 남기고 숨김. */
     buttonVisibility?: 'visible' | 'hidden';
-    label: string;
+    /** 전체 페이지 수 뒤에 붙는 문구. @default '페이지' */
+    label?: string;
+    /** 탐색 영역의 접근성 이름. @default '페이지네이션' */
+    'aria-label'?: string;
+    className?: string;
 }
-export declare function Pagination({ page, onPageChange, totalPage, className, buttonVisibility, label, }: PaginationProps): import("react/jsx-runtime").JSX.Element;
+export declare function Pagination({ page, onPageChange, totalPage, variant, totalCount, pageSize, pageSizeOptions, onPageSizeChange, divider, disabled, buttonVisibility, label, 'aria-label': ariaLabel, className, }: PaginationProps): React.JSX.Element;

package/dist/components/molecules/searchInput/SearchInput.d.ts

@@ -31,4 +31,4 @@ export interface SearchInputProps extends Omit<React.InputHTMLAttributes<HTMLInp
         searchButtonContent?: string;
     };
 }
-export declare function SearchInput({ hiddenClearButton, className, filter, ...props }: SearchInputProps): import("react/jsx-runtime").JSX.Element;
+export declare function SearchInput({ hiddenClearButton, className, filter, ...props }: SearchInputProps): React.JSX.Element;

package/dist/components/molecules/searchInput/filter/FilterPopover.d.ts

@@ -12,5 +12,5 @@ interface Props {
     searchButtonContent?: string;
     onSearch: () => void;
 }
-declare function FilterPopover({ parent, onClose, formats, resetButtonContent, onReset, searchButtonContent, onSearch, }: Props): import("react/jsx-runtime").JSX.Element;
+declare function FilterPopover({ parent, onClose, formats, resetButtonContent, onReset, searchButtonContent, onSearch, }: Props): React.JSX.Element;
 export default FilterPopover;

package/dist/components/molecules/searchInput/filter/index.d.ts

@@ -13,5 +13,5 @@ interface Props {
     onSearch: () => void;
     inputWrapperRef: React.RefObject<HTMLDivElement>;
 }
-declare function Filter({ on, formats, hoverContent, resetButtonContent, onReset, searchButtonContent, onSearch, inputWrapperRef, }: Props): import("react/jsx-runtime").JSX.Element;
+declare function Filter({ on, formats, hoverContent, resetButtonContent, onReset, searchButtonContent, onSearch, inputWrapperRef, }: Props): React.JSX.Element;
 export default Filter;

package/dist/components/molecules/table/Colgroup.d.ts

@@ -1,3 +1,4 @@
+import React from 'react';
 import { IColumnFormats } from './types';
 interface Props {
     hasCheckbox?: boolean;
@@ -5,5 +6,5 @@ interface Props {
     formats: IColumnFormats[];
     hasActionCol: boolean;
 }
-declare function Colgroup({ hasCheckbox, hasRadio, formats, hasActionCol }: Props): import("react/jsx-runtime").JSX.Element;
+declare function Colgroup({ hasCheckbox, hasRadio, formats, hasActionCol }: Props): React.JSX.Element;
 export default Colgroup;

package/dist/components/molecules/table/Table.d.ts

@@ -1,3 +1,4 @@
+import React from 'react';
 import { TableProps } from './types';
 import './table.scss';
-export declare function Table({ rowIdKey, data, formats, maxHeight, sort, onSort, checkedIds, onCheck, radioCheckedId, onRadioCheck, filter, kebabMenu, binButton, chartButton, onRowClick, selectedRow, highlightRows, className, id, noData, loading, }: TableProps): import("react/jsx-runtime").JSX.Element;
+export declare function Table({ rowIdKey, data, formats, maxHeight, sort, onSort, checkedIds, onCheck, getCheckboxStatus, radioCheckedId, onRadioCheck, filter, kebabMenu, binButton, chartButton, onRowClick, selectedRow, highlightRows, disabledRows, className, id, noData, loading, }: TableProps): React.JSX.Element;

package/dist/components/molecules/table/body/BinButtonTd.d.ts

@@ -1,7 +1,8 @@
+import React from 'react';
 interface Props {
     rowId: string;
     hovered: boolean;
     onClick: (rowId: string) => void;
 }
-declare function BinButtonTd({ rowId, hovered, onClick }: Props): import("react/jsx-runtime").JSX.Element;
+declare function BinButtonTd({ rowId, hovered, onClick }: Props): React.JSX.Element;
 export default BinButtonTd;

package/dist/components/molecules/table/body/ChartButtonTd.d.ts

@@ -1,8 +1,9 @@
+import React from 'react';
 interface Props {
     rowId: string;
     hovered: boolean;
     selected?: boolean;
     onClick: (rowId: string) => void;
 }
-declare function ChartButtonTd({ rowId, hovered, selected, onClick }: Props): import("react/jsx-runtime").JSX.Element;
+declare function ChartButtonTd({ rowId, hovered, selected, onClick }: Props): React.JSX.Element;
 export default ChartButtonTd;

package/dist/components/molecules/table/body/CheckboxTd.d.ts

@@ -1,6 +1,9 @@
+import React from 'react';
 interface Props {
     checked: boolean;
+    disabled?: boolean;
+    hidden?: boolean;
     onCheck: (checked: boolean) => void;
 }
-declare function CheckboxTd({ checked, onCheck }: Props): import("react/jsx-runtime").JSX.Element;
+declare function CheckboxTd({ checked, disabled, hidden, onCheck }: Props): React.JSX.Element;
 export default CheckboxTd;

package/dist/components/molecules/table/body/EmptyTr.d.ts

@@ -4,5 +4,5 @@ interface Props {
     loadingContent?: React.ReactNode;
     emptyBodyHeight: number;
 }
-declare function EmptyTr({ noDataMessage, loadingContent, emptyBodyHeight }: Props): import("react/jsx-runtime").JSX.Element;
+declare function EmptyTr({ noDataMessage, loadingContent, emptyBodyHeight }: Props): React.JSX.Element;
 export default EmptyTr;

package/dist/components/molecules/table/body/KebabMenuTd.d.ts

@@ -3,5 +3,5 @@ interface Props {
     rowId: string;
     kebabContent?: (rowId: string, onClose: () => void) => React.ReactNode;
 }
-declare function KebabMenuTd({ rowId, kebabContent }: Props): import("react/jsx-runtime").JSX.Element | null;
+declare function KebabMenuTd({ rowId, kebabContent }: Props): React.JSX.Element | null;
 export default KebabMenuTd;

package/dist/components/molecules/table/body/RadioTd.d.ts

@@ -1,6 +1,8 @@
+import React from 'react';
 interface Props {
     checked: boolean;
+    disabled?: boolean;
     onCheck: (checked: boolean) => void;
 }
-declare function RadioTd({ checked, onCheck }: Props): import("react/jsx-runtime").JSX.Element;
+declare function RadioTd({ checked, disabled, onCheck }: Props): React.JSX.Element;
 export default RadioTd;

package/dist/components/molecules/table/body/Tr.d.ts

@@ -1,7 +1,8 @@
+import React from 'react';
 import { TableProps } from '../types';
 interface Props extends TableProps {
     row: Record<string, any>;
     hasActionCol: boolean;
 }
-declare function Tr({ row, rowIdKey, formats, checkedIds, onCheck, radioCheckedId, onRadioCheck, hasActionCol, kebabMenu, binButton, chartButton, onRowClick, selectedRow, highlightRows, }: Props): import("react/jsx-runtime").JSX.Element;
+declare function Tr({ row, rowIdKey, formats, checkedIds, onCheck, getCheckboxStatus, radioCheckedId, onRadioCheck, hasActionCol, kebabMenu, binButton, chartButton, onRowClick, selectedRow, highlightRows, disabledRows, }: Props): React.JSX.Element;
 export default Tr;

package/dist/components/molecules/table/body/index.d.ts

@@ -1,7 +1,8 @@
+import React from 'react';
 import { TableProps } from '../types';
 interface Props extends TableProps {
     hasActionCol: boolean;
     emptyBodyHeight: number;
 }
-declare function TBody({ rowIdKey, formats, data, checkedIds, onCheck, radioCheckedId, onRadioCheck, hasActionCol, kebabMenu, binButton, chartButton, onRowClick, selectedRow, highlightRows, noData, loading, emptyBodyHeight, }: Props): import("react/jsx-runtime").JSX.Element;
+declare function TBody({ rowIdKey, formats, data, checkedIds, onCheck, getCheckboxStatus, radioCheckedId, onRadioCheck, hasActionCol, kebabMenu, binButton, chartButton, onRowClick, selectedRow, highlightRows, disabledRows, noData, loading, emptyBodyHeight, }: Props): React.JSX.Element;
 export default TBody;

package/dist/components/molecules/table/header/FilterButtonsTh.d.ts

@@ -1,7 +1,8 @@
+import React from 'react';
 interface Props {
     toggle: boolean;
     onToggle: () => void;
     onReset?: () => void;
 }
-declare function FilterButtonsTh({ toggle, onToggle, onReset }: Props): import("react/jsx-runtime").JSX.Element;
+declare function FilterButtonsTh({ toggle, onToggle, onReset }: Props): React.JSX.Element;
 export default FilterButtonsTh;