shadcn-datagrid 0.1.0
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.cjs +1599 -0
- package/dist/index.cjs.map +1 -0
- package/dist/index.d.cts +173 -0
- package/dist/index.d.ts +173 -0
- package/dist/index.js +1569 -0
- package/dist/index.js.map +1 -0
- package/package.json +60 -0
package/dist/index.d.ts
ADDED
|
@@ -0,0 +1,173 @@
|
|
|
1
|
+
import * as react from 'react';
|
|
2
|
+
import { ReactNode, RefObject } from 'react';
|
|
3
|
+
|
|
4
|
+
type SortDirection = 'asc' | 'desc' | null;
|
|
5
|
+
type ColumnType = 'string' | 'number' | 'date' | 'boolean';
|
|
6
|
+
type TextAlign = 'Left' | 'Right' | 'Center';
|
|
7
|
+
type FormatType = 'C2' | 'N2' | string;
|
|
8
|
+
type ActionMode = 'dropdown' | 'icons';
|
|
9
|
+
type ActionVariant = 'default' | 'destructive';
|
|
10
|
+
interface SortConfig {
|
|
11
|
+
field: string;
|
|
12
|
+
direction: SortDirection;
|
|
13
|
+
}
|
|
14
|
+
interface TooltipConfig<T> {
|
|
15
|
+
/** Custom content renderer for the tooltip. If omitted, shows the raw cell value. */
|
|
16
|
+
content?: (data: T) => ReactNode;
|
|
17
|
+
/** Tooltip placement side. Default: 'top' */
|
|
18
|
+
side?: 'top' | 'bottom' | 'left' | 'right';
|
|
19
|
+
/** Custom className for the tooltip content */
|
|
20
|
+
className?: string;
|
|
21
|
+
}
|
|
22
|
+
interface ColumnConfig<T> {
|
|
23
|
+
field: keyof T | string;
|
|
24
|
+
headerText: string;
|
|
25
|
+
width?: number | string;
|
|
26
|
+
minWidth?: number;
|
|
27
|
+
maxWidth?: number;
|
|
28
|
+
visible?: boolean;
|
|
29
|
+
textAlign?: TextAlign;
|
|
30
|
+
format?: FormatType;
|
|
31
|
+
type?: ColumnType;
|
|
32
|
+
allowSorting?: boolean;
|
|
33
|
+
template?: (data: T, rowIndex: number) => ReactNode;
|
|
34
|
+
exportFormatter?: (data: T) => string;
|
|
35
|
+
headerTemplate?: () => ReactNode;
|
|
36
|
+
className?: string;
|
|
37
|
+
headerClassName?: string;
|
|
38
|
+
/** Allow resizing this column. Default: true (when enableColumnResize is on). */
|
|
39
|
+
allowResizing?: boolean;
|
|
40
|
+
/**
|
|
41
|
+
* Tooltip configuration.
|
|
42
|
+
* - `false` or omitted → no tooltip (default)
|
|
43
|
+
* - `true` → auto-tooltip: shows the raw cell text only when truncated
|
|
44
|
+
* - `TooltipConfig<T>` object → custom tooltip with full control
|
|
45
|
+
*/
|
|
46
|
+
tooltip?: boolean | TooltipConfig<T>;
|
|
47
|
+
}
|
|
48
|
+
interface ActionItem<T> {
|
|
49
|
+
label: string;
|
|
50
|
+
icon?: ReactNode;
|
|
51
|
+
onClick: (data: T) => void;
|
|
52
|
+
variant?: ActionVariant;
|
|
53
|
+
hidden?: (data: T) => boolean;
|
|
54
|
+
disabled?: (data: T) => boolean;
|
|
55
|
+
}
|
|
56
|
+
interface ActionConfig<T> {
|
|
57
|
+
mode: ActionMode;
|
|
58
|
+
actions: ActionItem<T>[];
|
|
59
|
+
showOnHover?: boolean;
|
|
60
|
+
showHeader?: boolean;
|
|
61
|
+
headerText?: string;
|
|
62
|
+
width?: number;
|
|
63
|
+
}
|
|
64
|
+
interface BulkActionItem<T> {
|
|
65
|
+
label: string;
|
|
66
|
+
icon?: ReactNode;
|
|
67
|
+
onClick: (selectedData: T[]) => void;
|
|
68
|
+
variant?: ActionVariant;
|
|
69
|
+
}
|
|
70
|
+
interface BulkActionConfig<T> {
|
|
71
|
+
enabled: boolean;
|
|
72
|
+
actions: BulkActionItem<T>[];
|
|
73
|
+
}
|
|
74
|
+
interface PaginationConfig {
|
|
75
|
+
page: number;
|
|
76
|
+
pageSize: number;
|
|
77
|
+
total: number;
|
|
78
|
+
pageSizeOptions?: number[];
|
|
79
|
+
onPageChange: (page: number) => void;
|
|
80
|
+
onPageSizeChange: (pageSize: number) => void;
|
|
81
|
+
}
|
|
82
|
+
type ContextMenuItem<T> = {
|
|
83
|
+
type?: 'item';
|
|
84
|
+
label: string;
|
|
85
|
+
icon?: ReactNode;
|
|
86
|
+
onClick: (data: T) => void;
|
|
87
|
+
variant?: ActionVariant;
|
|
88
|
+
hidden?: (data: T) => boolean;
|
|
89
|
+
disabled?: (data: T) => boolean;
|
|
90
|
+
} | {
|
|
91
|
+
type: 'separator';
|
|
92
|
+
} | {
|
|
93
|
+
type: 'label';
|
|
94
|
+
label: string;
|
|
95
|
+
};
|
|
96
|
+
type ExportFormat = 'csv' | 'print' | string;
|
|
97
|
+
interface ExportConfig<T> {
|
|
98
|
+
enabled: boolean;
|
|
99
|
+
formats?: ExportFormat[];
|
|
100
|
+
fileName?: string;
|
|
101
|
+
onCustomExport?: (format: string, data: T[], columns: ColumnConfig<T>[]) => void;
|
|
102
|
+
}
|
|
103
|
+
interface ChildRowConfig<T> {
|
|
104
|
+
enabled: boolean;
|
|
105
|
+
childColumns?: ColumnConfig<any>[];
|
|
106
|
+
getChildData?: (row: T) => any[] | undefined;
|
|
107
|
+
fetchChildData?: (row: T) => Promise<any[]>;
|
|
108
|
+
childKeyField?: string;
|
|
109
|
+
expandedByDefault?: boolean;
|
|
110
|
+
}
|
|
111
|
+
interface DataGridClassNames {
|
|
112
|
+
root?: string;
|
|
113
|
+
toolbar?: string;
|
|
114
|
+
tableContainer?: string;
|
|
115
|
+
table?: string;
|
|
116
|
+
header?: string;
|
|
117
|
+
headerRow?: string;
|
|
118
|
+
headerCell?: string;
|
|
119
|
+
body?: string;
|
|
120
|
+
row?: string;
|
|
121
|
+
rowSelected?: string;
|
|
122
|
+
rowExpanded?: string;
|
|
123
|
+
cell?: string;
|
|
124
|
+
cellCheckbox?: string;
|
|
125
|
+
cellActions?: string;
|
|
126
|
+
cellExpander?: string;
|
|
127
|
+
pagination?: string;
|
|
128
|
+
empty?: string;
|
|
129
|
+
contextMenu?: string;
|
|
130
|
+
exportToolbar?: string;
|
|
131
|
+
childRow?: string;
|
|
132
|
+
}
|
|
133
|
+
interface DataGridProps<T extends object> {
|
|
134
|
+
columns: ColumnConfig<T>[];
|
|
135
|
+
data: T[];
|
|
136
|
+
isLoading?: boolean;
|
|
137
|
+
skeletonRowCount?: number;
|
|
138
|
+
pagination?: PaginationConfig;
|
|
139
|
+
actionConfig?: ActionConfig<T>;
|
|
140
|
+
bulkActionConfig?: BulkActionConfig<T>;
|
|
141
|
+
contextMenuItems?: ContextMenuItem<T>[];
|
|
142
|
+
exportConfig?: ExportConfig<T>;
|
|
143
|
+
childRowConfig?: ChildRowConfig<T>;
|
|
144
|
+
emptyMessage?: string;
|
|
145
|
+
emptyComponent?: ReactNode;
|
|
146
|
+
onRowClick?: (data: T) => void;
|
|
147
|
+
className?: string;
|
|
148
|
+
classNames?: DataGridClassNames;
|
|
149
|
+
keyField?: keyof T;
|
|
150
|
+
sortConfig?: SortConfig;
|
|
151
|
+
onSort?: (ordering: string | null) => void;
|
|
152
|
+
tableContainerRef?: RefObject<HTMLDivElement | null>;
|
|
153
|
+
stickyHeader?: boolean;
|
|
154
|
+
rowHeight?: number;
|
|
155
|
+
headerHeight?: number;
|
|
156
|
+
maxBodyHeight?: number | string;
|
|
157
|
+
alternatingRows?: boolean;
|
|
158
|
+
enableColumnResize?: boolean;
|
|
159
|
+
showHeaderBorder?: boolean;
|
|
160
|
+
}
|
|
161
|
+
|
|
162
|
+
declare function DataGrid<T extends object>({ columns, data, isLoading, skeletonRowCount, pagination, actionConfig, bulkActionConfig, contextMenuItems, exportConfig, childRowConfig, emptyMessage, emptyComponent, onRowClick, className, classNames, keyField, sortConfig: externalSortConfig, onSort, tableContainerRef: externalContainerRef, stickyHeader, rowHeight, maxBodyHeight, alternatingRows, enableColumnResize, showHeaderBorder, }: DataGridProps<T>): react.JSX.Element;
|
|
163
|
+
|
|
164
|
+
declare function getCellExportValue<T extends object>(row: T, col: ColumnConfig<T>, rowIndex: number): string;
|
|
165
|
+
declare function exportToCsv<T extends object>(data: T[], columns: ColumnConfig<T>[], fileName: string): void;
|
|
166
|
+
declare function exportToPrint<T extends object>(data: T[], columns: ColumnConfig<T>[]): void;
|
|
167
|
+
|
|
168
|
+
declare function formatCurrency(value: unknown, locale?: string, currency?: string): string;
|
|
169
|
+
declare function formatNumber(value: unknown, locale?: string): string;
|
|
170
|
+
declare function formatDateValue(value: unknown, dateFormat?: string): string;
|
|
171
|
+
declare function formatValue(value: unknown, formatType?: FormatType, type?: string): string;
|
|
172
|
+
|
|
173
|
+
export { type ActionConfig, type ActionItem, type ActionMode, type ActionVariant, type BulkActionConfig, type BulkActionItem, type ChildRowConfig, type ColumnConfig, type ColumnType, type ContextMenuItem, DataGrid, type DataGridClassNames, type DataGridProps, type ExportConfig, type ExportFormat, type FormatType, type PaginationConfig, type SortConfig, type SortDirection, type TextAlign, type TooltipConfig, exportToCsv, exportToPrint, formatCurrency, formatDateValue, formatNumber, formatValue, getCellExportValue };
|