@trackunit/react-table 0.0.7 → 0.0.11
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/index.cjs.js +16 -8
- package/index.esm.js +16 -8
- package/package.json +8 -7
- package/src/useTable.d.ts +1 -1
package/index.cjs.js
CHANGED
|
@@ -9180,16 +9180,16 @@ const useRelayPagination = (props = { pageSize: 50 }) => {
|
|
|
9180
9180
|
*/
|
|
9181
9181
|
const useTable = (_a) => {
|
|
9182
9182
|
var _b, _c, _d, _e;
|
|
9183
|
-
var { onTableStateChange, initialState } = _a, reactTableProps = __rest(_a, ["onTableStateChange", "initialState"]);
|
|
9184
|
-
const
|
|
9183
|
+
var { onTableStateChange, initialState, columns } = _a, reactTableProps = __rest(_a, ["onTableStateChange", "initialState", "columns"]);
|
|
9184
|
+
const hiddenByDefaultState = React.useMemo(() => {
|
|
9185
|
+
return Object.fromEntries(columns.map(column => { var _a, _b; return [column.id, (_b = !((_a = column.meta) === null || _a === void 0 ? void 0 : _a.hiddenByDefault)) !== null && _b !== void 0 ? _b : true]; }));
|
|
9186
|
+
}, [columns]);
|
|
9187
|
+
const [columnVisibility, setColumnVisibility] = React.useState(((_b = reactTableProps.state) === null || _b === void 0 ? void 0 : _b.columnVisibility) || (initialState === null || initialState === void 0 ? void 0 : initialState.columnVisibility) || hiddenByDefaultState || {});
|
|
9185
9188
|
const [columnOrder, setColumnOrder] = React.useState(((_c = reactTableProps.state) === null || _c === void 0 ? void 0 : _c.columnOrder) || (initialState === null || initialState === void 0 ? void 0 : initialState.columnOrder) || []);
|
|
9186
9189
|
const [sorting, setSorting] = React.useState(((_d = reactTableProps.state) === null || _d === void 0 ? void 0 : _d.sorting) || (initialState === null || initialState === void 0 ? void 0 : initialState.sorting) || []);
|
|
9187
9190
|
const [columnSizing, setColumnSizing] = React.useState(((_e = reactTableProps.state) === null || _e === void 0 ? void 0 : _e.columnSizing) || (initialState === null || initialState === void 0 ? void 0 : initialState.columnSizing) || {});
|
|
9188
|
-
const hiddenByDefaultState = React.useMemo(() => {
|
|
9189
|
-
return Object.fromEntries(reactTableProps.columns.map(column => { var _a, _b; return [column.id, (_b = (_a = column.meta) === null || _a === void 0 ? void 0 : _a.hiddenByDefault) !== null && _b !== void 0 ? _b : true]; }));
|
|
9190
|
-
}, [reactTableProps.columns]);
|
|
9191
9191
|
React.useEffect(() => {
|
|
9192
|
-
if (initialState) {
|
|
9192
|
+
if (initialState && Object.keys(initialState || {}).length > 0) {
|
|
9193
9193
|
setColumnVisibility(Object.keys(initialState.columnVisibility || {}).length > 0
|
|
9194
9194
|
? initialState.columnVisibility
|
|
9195
9195
|
: hiddenByDefaultState || {});
|
|
@@ -9197,14 +9197,22 @@ const useTable = (_a) => {
|
|
|
9197
9197
|
setSorting(initialState.sorting || []);
|
|
9198
9198
|
setColumnSizing(initialState.columnSizing || {});
|
|
9199
9199
|
}
|
|
9200
|
-
}, [
|
|
9200
|
+
}, [
|
|
9201
|
+
hiddenByDefaultState,
|
|
9202
|
+
initialState,
|
|
9203
|
+
initialState === null || initialState === void 0 ? void 0 : initialState.columnVisibility,
|
|
9204
|
+
initialState === null || initialState === void 0 ? void 0 : initialState.columnOrder,
|
|
9205
|
+
initialState === null || initialState === void 0 ? void 0 : initialState.sorting,
|
|
9206
|
+
initialState === null || initialState === void 0 ? void 0 : initialState.columnSizing,
|
|
9207
|
+
]);
|
|
9201
9208
|
const state = React.useMemo(() => {
|
|
9202
9209
|
return Object.assign({ sorting,
|
|
9203
9210
|
columnVisibility,
|
|
9204
9211
|
columnOrder,
|
|
9205
9212
|
columnSizing }, reactTableProps.state);
|
|
9206
9213
|
}, [sorting, columnVisibility, columnOrder, columnSizing, reactTableProps.state]);
|
|
9207
|
-
const table = useReactTable(Object.assign(Object.assign({ manualSorting: true, columnResizeMode: "onChange", onColumnVisibilityChange: setColumnVisibility, onColumnSizingChange: setColumnSizing, onColumnOrderChange: setColumnOrder, onSortingChange: setSorting, getSortedRowModel: getSortedRowModel(), getCoreRowModel: getCoreRowModel() }, reactTableProps), {
|
|
9214
|
+
const table = useReactTable(Object.assign(Object.assign({ manualSorting: true, columnResizeMode: "onChange", onColumnVisibilityChange: setColumnVisibility, onColumnSizingChange: setColumnSizing, onColumnOrderChange: setColumnOrder, onSortingChange: setSorting, getSortedRowModel: getSortedRowModel(), getCoreRowModel: getCoreRowModel() }, reactTableProps), { columns,
|
|
9215
|
+
state }));
|
|
9208
9216
|
React.useEffect(() => {
|
|
9209
9217
|
if (onTableStateChange) {
|
|
9210
9218
|
onTableStateChange(state);
|
package/index.esm.js
CHANGED
|
@@ -9154,16 +9154,16 @@ const useRelayPagination = (props = { pageSize: 50 }) => {
|
|
|
9154
9154
|
*/
|
|
9155
9155
|
const useTable = (_a) => {
|
|
9156
9156
|
var _b, _c, _d, _e;
|
|
9157
|
-
var { onTableStateChange, initialState } = _a, reactTableProps = __rest(_a, ["onTableStateChange", "initialState"]);
|
|
9158
|
-
const
|
|
9157
|
+
var { onTableStateChange, initialState, columns } = _a, reactTableProps = __rest(_a, ["onTableStateChange", "initialState", "columns"]);
|
|
9158
|
+
const hiddenByDefaultState = useMemo(() => {
|
|
9159
|
+
return Object.fromEntries(columns.map(column => { var _a, _b; return [column.id, (_b = !((_a = column.meta) === null || _a === void 0 ? void 0 : _a.hiddenByDefault)) !== null && _b !== void 0 ? _b : true]; }));
|
|
9160
|
+
}, [columns]);
|
|
9161
|
+
const [columnVisibility, setColumnVisibility] = useState(((_b = reactTableProps.state) === null || _b === void 0 ? void 0 : _b.columnVisibility) || (initialState === null || initialState === void 0 ? void 0 : initialState.columnVisibility) || hiddenByDefaultState || {});
|
|
9159
9162
|
const [columnOrder, setColumnOrder] = useState(((_c = reactTableProps.state) === null || _c === void 0 ? void 0 : _c.columnOrder) || (initialState === null || initialState === void 0 ? void 0 : initialState.columnOrder) || []);
|
|
9160
9163
|
const [sorting, setSorting] = useState(((_d = reactTableProps.state) === null || _d === void 0 ? void 0 : _d.sorting) || (initialState === null || initialState === void 0 ? void 0 : initialState.sorting) || []);
|
|
9161
9164
|
const [columnSizing, setColumnSizing] = useState(((_e = reactTableProps.state) === null || _e === void 0 ? void 0 : _e.columnSizing) || (initialState === null || initialState === void 0 ? void 0 : initialState.columnSizing) || {});
|
|
9162
|
-
const hiddenByDefaultState = useMemo(() => {
|
|
9163
|
-
return Object.fromEntries(reactTableProps.columns.map(column => { var _a, _b; return [column.id, (_b = (_a = column.meta) === null || _a === void 0 ? void 0 : _a.hiddenByDefault) !== null && _b !== void 0 ? _b : true]; }));
|
|
9164
|
-
}, [reactTableProps.columns]);
|
|
9165
9165
|
useEffect(() => {
|
|
9166
|
-
if (initialState) {
|
|
9166
|
+
if (initialState && Object.keys(initialState || {}).length > 0) {
|
|
9167
9167
|
setColumnVisibility(Object.keys(initialState.columnVisibility || {}).length > 0
|
|
9168
9168
|
? initialState.columnVisibility
|
|
9169
9169
|
: hiddenByDefaultState || {});
|
|
@@ -9171,14 +9171,22 @@ const useTable = (_a) => {
|
|
|
9171
9171
|
setSorting(initialState.sorting || []);
|
|
9172
9172
|
setColumnSizing(initialState.columnSizing || {});
|
|
9173
9173
|
}
|
|
9174
|
-
}, [
|
|
9174
|
+
}, [
|
|
9175
|
+
hiddenByDefaultState,
|
|
9176
|
+
initialState,
|
|
9177
|
+
initialState === null || initialState === void 0 ? void 0 : initialState.columnVisibility,
|
|
9178
|
+
initialState === null || initialState === void 0 ? void 0 : initialState.columnOrder,
|
|
9179
|
+
initialState === null || initialState === void 0 ? void 0 : initialState.sorting,
|
|
9180
|
+
initialState === null || initialState === void 0 ? void 0 : initialState.columnSizing,
|
|
9181
|
+
]);
|
|
9175
9182
|
const state = useMemo(() => {
|
|
9176
9183
|
return Object.assign({ sorting,
|
|
9177
9184
|
columnVisibility,
|
|
9178
9185
|
columnOrder,
|
|
9179
9186
|
columnSizing }, reactTableProps.state);
|
|
9180
9187
|
}, [sorting, columnVisibility, columnOrder, columnSizing, reactTableProps.state]);
|
|
9181
|
-
const table = useReactTable(Object.assign(Object.assign({ manualSorting: true, columnResizeMode: "onChange", onColumnVisibilityChange: setColumnVisibility, onColumnSizingChange: setColumnSizing, onColumnOrderChange: setColumnOrder, onSortingChange: setSorting, getSortedRowModel: getSortedRowModel(), getCoreRowModel: getCoreRowModel() }, reactTableProps), {
|
|
9188
|
+
const table = useReactTable(Object.assign(Object.assign({ manualSorting: true, columnResizeMode: "onChange", onColumnVisibilityChange: setColumnVisibility, onColumnSizingChange: setColumnSizing, onColumnOrderChange: setColumnOrder, onSortingChange: setSorting, getSortedRowModel: getSortedRowModel(), getCoreRowModel: getCoreRowModel() }, reactTableProps), { columns,
|
|
9189
|
+
state }));
|
|
9182
9190
|
useEffect(() => {
|
|
9183
9191
|
if (onTableStateChange) {
|
|
9184
9192
|
onTableStateChange(state);
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@trackunit/react-table",
|
|
3
|
-
"version": "0.0.
|
|
3
|
+
"version": "0.0.11",
|
|
4
4
|
"repository": "https://github.com/Trackunit/manager",
|
|
5
5
|
"license": "SEE LICENSE IN LICENSE.txt",
|
|
6
6
|
"engines": {
|
|
@@ -11,13 +11,14 @@
|
|
|
11
11
|
"@tanstack/react-virtual": "3.0.0-alpha.0",
|
|
12
12
|
"@trackunit/css-class-variance-utilities": "0.0.12",
|
|
13
13
|
"@trackunit/css-core": "0.0.93",
|
|
14
|
-
"@trackunit/i18n-library-translation": "0.0.
|
|
15
|
-
"@trackunit/
|
|
14
|
+
"@trackunit/i18n-library-translation": "0.0.73",
|
|
15
|
+
"@trackunit/iris-app-api": "0.0.111",
|
|
16
|
+
"@trackunit/react-components": "0.1.154",
|
|
16
17
|
"@trackunit/react-core-contexts-api": "0.2.53",
|
|
17
|
-
"@trackunit/react-core-contexts-test": "0.1.
|
|
18
|
-
"@trackunit/react-form-components": "0.0.
|
|
19
|
-
"@trackunit/react-table-base-components": "0.0.
|
|
20
|
-
"@trackunit/shared-utils": "0.0.
|
|
18
|
+
"@trackunit/react-core-contexts-test": "0.1.101",
|
|
19
|
+
"@trackunit/react-form-components": "0.0.134",
|
|
20
|
+
"@trackunit/react-table-base-components": "0.0.5",
|
|
21
|
+
"@trackunit/shared-utils": "0.0.5",
|
|
21
22
|
"@trackunit/ui-icons": "0.0.73",
|
|
22
23
|
"immutability-helper": "3.1.1",
|
|
23
24
|
"react": "18.2.0",
|
package/src/useTable.d.ts
CHANGED
|
@@ -9,7 +9,7 @@ export interface TableOptionsProps<TData extends object> extends Omit<TableOptio
|
|
|
9
9
|
* @param {TableOptionsProps<TData>} props - The props object containing configuration options.
|
|
10
10
|
* @returns {TableOptionsProps<TData>} An object containing the React Table instance and associated state management functions.
|
|
11
11
|
*/
|
|
12
|
-
export declare const useTable: <TData extends object>({ onTableStateChange, initialState, ...reactTableProps }: TableOptionsProps<TData>) => {
|
|
12
|
+
export declare const useTable: <TData extends object>({ onTableStateChange, initialState, columns, ...reactTableProps }: TableOptionsProps<TData>) => {
|
|
13
13
|
table: import("@tanstack/react-table").Table<TData>;
|
|
14
14
|
};
|
|
15
15
|
export default useTable;
|