fone-design-system_v2 1.0.35 → 1.0.37
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.
|
@@ -2,7 +2,6 @@ import { Cell as TableCell } from '@tanstack/react-table';
|
|
|
2
2
|
interface Props<T extends object = any> {
|
|
3
3
|
id: string;
|
|
4
4
|
cell: TableCell<T, unknown>;
|
|
5
|
-
isHover?: boolean;
|
|
6
5
|
setTableData: React.Dispatch<React.SetStateAction<T[]>>;
|
|
7
6
|
isSelected: boolean;
|
|
8
7
|
setRowSelection: React.Dispatch<React.SetStateAction<Record<string, boolean>>>;
|
|
@@ -10,5 +9,5 @@ interface Props<T extends object = any> {
|
|
|
10
9
|
radio: boolean;
|
|
11
10
|
style?: React.CSSProperties;
|
|
12
11
|
}
|
|
13
|
-
declare const CellDatePicker2: <T extends object>({ cell,
|
|
12
|
+
declare const CellDatePicker2: <T extends object>({ cell, setTableData, isSelected, setRowSelection, isClicked, radio, style, }: Props) => import("react/jsx-runtime").JSX.Element;
|
|
14
13
|
export default CellDatePicker2;
|
|
@@ -2,7 +2,6 @@ import { Cell as TableCell } from '@tanstack/react-table';
|
|
|
2
2
|
interface Props<T extends object = any> {
|
|
3
3
|
align?: "start" | "center" | "end" | "right";
|
|
4
4
|
cell: TableCell<T, unknown>;
|
|
5
|
-
isHover: boolean;
|
|
6
5
|
setTableData: React.Dispatch<React.SetStateAction<T[]>>;
|
|
7
6
|
setRowSelection: React.Dispatch<React.SetStateAction<Record<string, boolean>>>;
|
|
8
7
|
isSelected: boolean;
|
|
@@ -14,5 +13,5 @@ interface Props<T extends object = any> {
|
|
|
14
13
|
radio: boolean;
|
|
15
14
|
isClicked: boolean;
|
|
16
15
|
}
|
|
17
|
-
declare const CellModal: <T extends object>({ cell,
|
|
16
|
+
declare const CellModal: <T extends object>({ cell, setTableData, setRowSelection, setCurrentEditingCell, radio, isClicked, isSelected, }: Props) => import("react/jsx-runtime").JSX.Element;
|
|
18
17
|
export default CellModal;
|
|
@@ -29,27 +29,47 @@ export type ColumnDef<T extends object> = TanstackColumnDef<T> & {
|
|
|
29
29
|
onChange?: (value: any) => void;
|
|
30
30
|
};
|
|
31
31
|
export interface Table2Props<T extends object> {
|
|
32
|
+
/** 테이블에 표시할 데이터 배열을 설정합니다. */
|
|
32
33
|
data: T[] | undefined;
|
|
34
|
+
/** 테이블의 열 정의 배열을 설정합니다. */
|
|
33
35
|
columns: ColumnDef<T>[];
|
|
36
|
+
/** 행 번호(No) 열 표시 여부를 설정합니다. */
|
|
34
37
|
No?: boolean;
|
|
38
|
+
/** 체크박스 표시 여부를 설정합니다. */
|
|
35
39
|
checkbox?: boolean;
|
|
40
|
+
/** 체크박스를 하나의 행만 선택할 수 있도록 설정합니다. */
|
|
36
41
|
radio?: boolean;
|
|
42
|
+
/** 체크박스 선택 시 동작할 콜백 함수를 설정합니다. */
|
|
37
43
|
onChecked?: (checkedRows: T[], rowIndex: number) => void;
|
|
44
|
+
/** 삭제 버튼 클릭 시 동작할 콜백 함수를 설정합니다. */
|
|
38
45
|
onDelete?: (checkedRows: T[]) => void;
|
|
46
|
+
/** 저장 버튼 클릭 시 동작할 콜백 함수를 설정합니다. */
|
|
39
47
|
onSave?: (checkedRows: T[], allRows: T[]) => void;
|
|
48
|
+
/** 행 클릭 시 동작할 콜백 함수를 설정합니다. */
|
|
40
49
|
onRowClick?: (row: T, rowIndex: number) => void;
|
|
50
|
+
/** 행 더블 클릭 시 동작할 콜백 함수를 설정합니다. */
|
|
41
51
|
onRowDoubleClick?: (row: T, rowIndex: number) => void;
|
|
52
|
+
/** 테이블 상단에 표시할 제목을 설정합니다. */
|
|
42
53
|
title?: string | null;
|
|
54
|
+
/** 테이블 상단에 합계 표시 여부를 설정합니다. */
|
|
43
55
|
isTotal?: boolean;
|
|
56
|
+
/** 삭제 버튼 클릭 시 추가 중인 행까지 전부 전달하도록 설정합니다. */
|
|
44
57
|
deleteAllData?: boolean;
|
|
58
|
+
/** 테이블 우측 상단에 표시할 커스텀 버튼 영역을 설정합니다. */
|
|
45
59
|
buttons?: React.ReactNode;
|
|
60
|
+
/** 로딩 상태 표시 여부를 설정합니다. */
|
|
46
61
|
isLoading?: boolean;
|
|
62
|
+
/** 플러스(+) 버튼 표시 여부를 설정합니다. */
|
|
47
63
|
isPlusButton?: boolean;
|
|
64
|
+
/** 특정 행으로 스크롤할 인덱스를 설정합니다. */
|
|
48
65
|
scrollTo?: number;
|
|
66
|
+
/** 모달에 전달받은 데이터를 테이블에 설정합니다. */
|
|
49
67
|
modalData?: {
|
|
50
68
|
[key: string]: any;
|
|
51
69
|
} | string;
|
|
70
|
+
/** 행 추가 버튼 클릭 시 동작할 콜백 함수를 설정합니다. */
|
|
52
71
|
onAddFn?: () => void;
|
|
72
|
+
/** 페이지네이션을 설정합니다. */
|
|
53
73
|
pagination?: {
|
|
54
74
|
page: number;
|
|
55
75
|
size: number;
|
|
@@ -57,14 +77,23 @@ export interface Table2Props<T extends object> {
|
|
|
57
77
|
totalPages: number;
|
|
58
78
|
onPageChange: (page: number) => void;
|
|
59
79
|
};
|
|
80
|
+
/** onAddFn을 설정했을 경우 행 추가 기능 활성화 여부를 설정합니다. */
|
|
60
81
|
isAddRowActive?: boolean;
|
|
82
|
+
/** 모달 적용 시 동작할 콜백 함수를 설정합니다. */
|
|
61
83
|
onModalApplied?: () => void;
|
|
84
|
+
/** 클릭 트리거를 줄 행의 인덱스를 설정합니다. */
|
|
62
85
|
rowClickTriggerIdx?: number;
|
|
86
|
+
/** 삭제 버튼 클릭시 추가로 실행할 콜백 함수를 설정합니다. */
|
|
63
87
|
onDelFn?: (rows: T[]) => void;
|
|
88
|
+
/** 행 클릭 시 체크박스 선택 여부를 설정합니다. */
|
|
64
89
|
isClickedCheckbox?: boolean;
|
|
90
|
+
/** 테이블 데이터 변경 시 동작할 콜백 함수를 설정합니다. */
|
|
65
91
|
onTableDataChange?: (data: T[]) => void;
|
|
92
|
+
/** 체크할 행의 인덱스를 설정합니다. */
|
|
66
93
|
checkboxCheckedIdx?: number;
|
|
94
|
+
/** 선택된 아이템 배열을 설정합니다. */
|
|
67
95
|
selectedItems?: any[];
|
|
96
|
+
/** 선택된 아이템 배열을 설정하는 함수를 설정합니다. */
|
|
68
97
|
setSelectedItems?: React.Dispatch<React.SetStateAction<any[]>>;
|
|
69
98
|
}
|
|
70
99
|
declare const Table2: <T extends object>({ data, columns, checkbox, radio, onChecked, onDelete, deleteAllData, onSave, onRowClick, onRowDoubleClick, title, isTotal, buttons, isLoading, isPlusButton, scrollTo, modalData, onAddFn, pagination, isAddRowActive, onModalApplied, rowClickTriggerIdx, onDelFn, isClickedCheckbox, onTableDataChange, checkboxCheckedIdx, No, selectedItems, setSelectedItems, }: Table2Props<T>) => import("react/jsx-runtime").JSX.Element;
|