@schemavaults/ui 0.13.10 → 0.13.12
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/components/ui/datatable/datatable.d.ts +7 -5
- package/dist/components/ui/datatable/datatable.js +18 -7
- package/dist/components/ui/datatable/datatable.js.map +1 -1
- package/dist/components/ui/datatable/index.d.ts +3 -2
- package/dist/components/ui/datatable/index.js +2 -1
- package/dist/components/ui/datatable/index.js.map +1 -1
- package/package.json +1 -1
|
@@ -1,10 +1,11 @@
|
|
|
1
1
|
import { type ColumnDef, type VisibilityState } from "@tanstack/react-table";
|
|
2
2
|
import { type ReactElement, type FC } from "react";
|
|
3
|
-
export
|
|
4
|
-
|
|
5
|
-
|
|
3
|
+
export type { ColumnDef };
|
|
4
|
+
export interface DatatableProps<TData extends object, TValue = unknown> {
|
|
5
|
+
data: TData[];
|
|
6
|
+
columns: ColumnDef<TData, TValue>[];
|
|
6
7
|
initialVisibleColumns: VisibilityState;
|
|
7
|
-
HeaderButtons
|
|
8
|
+
HeaderButtons?: FC;
|
|
8
9
|
datatypeLabel: string;
|
|
9
10
|
/**
|
|
10
11
|
* Column(s) to search. Can be:
|
|
@@ -16,4 +17,5 @@ export interface DatatableProps<T extends object> {
|
|
|
16
17
|
/** Enable global filtering across all columns. Overrides searchColumn if true. */
|
|
17
18
|
enableGlobalFilter?: boolean;
|
|
18
19
|
}
|
|
19
|
-
export declare function Datatable<
|
|
20
|
+
export declare function Datatable<TData extends object, TValue = unknown>({ data, columns, initialVisibleColumns, datatypeLabel, searchColumn, enableGlobalFilter, HeaderButtons, }: DatatableProps<TData, TValue>): ReactElement;
|
|
21
|
+
export default Datatable;
|
|
@@ -7,7 +7,7 @@ import { DropdownMenu, DropdownMenuCheckboxItem, DropdownMenuContent, DropdownMe
|
|
|
7
7
|
import { Input } from "../../ui/input";
|
|
8
8
|
import { Table, TableBody, TableCell, TableHead, TableHeader, TableRow, } from "../../ui/table";
|
|
9
9
|
import { useState } from "react";
|
|
10
|
-
export function Datatable({ data, columns, initialVisibleColumns,
|
|
10
|
+
export function Datatable({ data, columns, initialVisibleColumns, datatypeLabel, searchColumn, enableGlobalFilter = false, HeaderButtons, }) {
|
|
11
11
|
const [sorting, setSorting] = useState([]);
|
|
12
12
|
const [columnFilters, setColumnFilters] = useState([]);
|
|
13
13
|
const [globalFilter, setGlobalFilter] = useState("");
|
|
@@ -15,7 +15,9 @@ export function Datatable({ data, columns, initialVisibleColumns, HeaderButtons,
|
|
|
15
15
|
const [rowSelection, setRowSelection] = useState({});
|
|
16
16
|
// Determine search mode
|
|
17
17
|
const tanstackGlobalSearchEnabled = enableGlobalFilter || Array.isArray(searchColumn);
|
|
18
|
-
const searchableColumns = Array.isArray(searchColumn)
|
|
18
|
+
const searchableColumns = Array.isArray(searchColumn)
|
|
19
|
+
? searchColumn
|
|
20
|
+
: undefined;
|
|
19
21
|
// Custom filter for multi-column search (when searchColumn is an array)
|
|
20
22
|
const multiColumnFilterFn = (row, _columnId, filterValue) => {
|
|
21
23
|
if (!filterValue || !searchableColumns)
|
|
@@ -23,7 +25,9 @@ export function Datatable({ data, columns, initialVisibleColumns, HeaderButtons,
|
|
|
23
25
|
const search = filterValue.toLowerCase();
|
|
24
26
|
return searchableColumns.some((colId) => {
|
|
25
27
|
const value = row.getValue(colId);
|
|
26
|
-
return String(value ?? "")
|
|
28
|
+
return String(value ?? "")
|
|
29
|
+
.toLowerCase()
|
|
30
|
+
.includes(search);
|
|
27
31
|
});
|
|
28
32
|
};
|
|
29
33
|
const table = useReactTable({
|
|
@@ -38,7 +42,9 @@ export function Datatable({ data, columns, initialVisibleColumns, HeaderButtons,
|
|
|
38
42
|
onColumnVisibilityChange: setColumnVisibility,
|
|
39
43
|
onRowSelectionChange: setRowSelection,
|
|
40
44
|
...(tanstackGlobalSearchEnabled && {
|
|
41
|
-
globalFilterFn: searchableColumns
|
|
45
|
+
globalFilterFn: searchableColumns
|
|
46
|
+
? multiColumnFilterFn
|
|
47
|
+
: "includesString",
|
|
42
48
|
onGlobalFilterChange: setGlobalFilter,
|
|
43
49
|
}),
|
|
44
50
|
state: {
|
|
@@ -54,14 +60,18 @@ export function Datatable({ data, columns, initialVisibleColumns, HeaderButtons,
|
|
|
54
60
|
}
|
|
55
61
|
return (_jsxs("div", { className: "w-full flex flex-col justify-start items-center", children: [_jsxs("div", { className: "flex flex-row flex-wrap gap-4 items-center py-2 md:py-4 w-full", children: [(searchColumn || enableGlobalFilter) && (_jsx(Input, { placeholder: `Filter ${datatypeLabel.toLowerCase()}s...`, value: tanstackGlobalSearchEnabled
|
|
56
62
|
? globalFilter
|
|
57
|
-
: table
|
|
63
|
+
: (table
|
|
64
|
+
.getColumn(searchColumn)
|
|
65
|
+
?.getFilterValue() ?? ""), onChange: (event) => {
|
|
58
66
|
if (tanstackGlobalSearchEnabled) {
|
|
59
67
|
setGlobalFilter(event.target.value);
|
|
60
68
|
}
|
|
61
69
|
else if (typeof searchColumn === "string") {
|
|
62
|
-
table
|
|
70
|
+
table
|
|
71
|
+
.getColumn(searchColumn)
|
|
72
|
+
?.setFilterValue(event.target.value);
|
|
63
73
|
}
|
|
64
|
-
}, className: "max-w-sm min-w-24 w-auto grow" })), _jsxs("div", { className: "ml-auto flex flex-row flex-wrap justify-end gap-2 md:gap-4", children: [_jsx(HeaderButtons, {}), _jsxs(DropdownMenu, { children: [_jsx(DropdownMenuTrigger, { asChild: true, children: _jsxs(Button, { variant: "outline", className: "ml-auto", children: ["Columns ", _jsx(ChevronDown, { className: "ml-2 h-4 w-4" })] }) }), _jsx(DropdownMenuContent, { align: "end", children: table
|
|
74
|
+
}, className: "max-w-sm min-w-24 w-auto grow" })), _jsxs("div", { className: "ml-auto flex flex-row flex-wrap justify-end gap-2 md:gap-4", children: [typeof HeaderButtons === "function" && _jsx(HeaderButtons, {}), _jsxs(DropdownMenu, { children: [_jsx(DropdownMenuTrigger, { asChild: true, children: _jsxs(Button, { variant: "outline", className: "ml-auto", children: ["Columns ", _jsx(ChevronDown, { className: "ml-2 h-4 w-4" })] }) }), _jsx(DropdownMenuContent, { align: "end", children: table
|
|
65
75
|
.getAllColumns()
|
|
66
76
|
.filter((column) => column.getCanHide())
|
|
67
77
|
.map((column) => {
|
|
@@ -72,4 +82,5 @@ export function Datatable({ data, columns, initialVisibleColumns, HeaderButtons,
|
|
|
72
82
|
: flexRender(header.column.columnDef.header, header.getContext()) }, header.id));
|
|
73
83
|
}) }, headerGroup.id))) }), _jsx(TableBody, { children: table.getRowModel().rows?.length ? (table.getRowModel().rows.map((row) => (_jsx(TableRow, { "data-state": row.getIsSelected() && "selected", children: row.getVisibleCells().map((cell) => (_jsx(TableCell, { children: flexRender(cell.column.columnDef.cell, cell.getContext()) }, cell.id))) }, row.id)))) : (_jsx(TableRow, { children: _jsx(TableCell, { colSpan: columns.length, className: "h-24 text-center", children: "No results." }) })) })] }) }), _jsxs("div", { className: "flex items-center justify-end space-x-2 py-4", children: [_jsxs("div", { className: "flex-1 text-sm text-muted-foreground", children: [table.getFilteredSelectedRowModel().rows.length, " of", " ", table.getFilteredRowModel().rows.length, " row(s) selected."] }), _jsxs("div", { className: "space-x-2", children: [_jsx(Button, { variant: "outline", size: "sm", onClick: () => table.previousPage(), disabled: !table.getCanPreviousPage(), children: "Previous" }), _jsx(Button, { variant: "outline", size: "sm", onClick: () => table.nextPage(), disabled: !table.getCanNextPage(), children: "Next" })] })] })] }));
|
|
74
84
|
}
|
|
85
|
+
export default Datatable;
|
|
75
86
|
//# sourceMappingURL=datatable.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"datatable.js","sourceRoot":"","sources":["../../../../src/components/ui/datatable/datatable.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAC;;AAEb,OAAO,EAML,UAAU,EACV,eAAe,EACf,mBAAmB,EACnB,qBAAqB,EACrB,iBAAiB,EACjB,aAAa,GAEd,MAAM,uBAAuB,CAAC;AAC/B,OAAO,EAAE,WAAW,EAAE,MAAM,cAAc,CAAC;AAE3C,OAAO,EAAE,MAAM,EAAE,MAAM,wBAAwB,CAAC;AAChD,OAAO,EACL,YAAY,EACZ,wBAAwB,EACxB,mBAAmB,EACnB,mBAAmB,GACpB,MAAM,+BAA+B,CAAC;AACvC,OAAO,EAAE,KAAK,EAAE,MAAM,uBAAuB,CAAC;AAC9C,OAAO,EACL,KAAK,EACL,SAAS,EACT,SAAS,EACT,SAAS,EACT,WAAW,EACX,QAAQ,GACT,MAAM,uBAAuB,CAAC;AAC/B,OAAO,EAAqB,QAAQ,EAAW,MAAM,OAAO,CAAC;
|
|
1
|
+
{"version":3,"file":"datatable.js","sourceRoot":"","sources":["../../../../src/components/ui/datatable/datatable.tsx"],"names":[],"mappings":"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"}
|
|
@@ -1,2 +1,3 @@
|
|
|
1
|
-
export * from
|
|
2
|
-
export type * from
|
|
1
|
+
export * from "./datatable";
|
|
2
|
+
export type * from "./datatable";
|
|
3
|
+
export { default as default } from "./datatable";
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/components/ui/datatable/index.ts"],"names":[],"mappings":"AAAA,cAAc,aAAa,CAAC"}
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/components/ui/datatable/index.ts"],"names":[],"mappings":"AAAA,cAAc,aAAa,CAAC;AAE5B,OAAO,EAAE,OAAO,IAAI,OAAO,EAAE,MAAM,aAAa,CAAC"}
|