@bsol-oss/react-datatable5 1.0.35 → 1.0.36

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.
Files changed (5) hide show
  1. package/dist/index.d.ts +2 -1
  2. package/dist/index.js +3 -3
  3. package/dist/index.mjs +4 -4
  4. package/dist/types/components/DataTableServer.d.ts +2 -1
  5. package/package.json +1 -1
package/dist/index.d.ts CHANGED
@@ -75,6 +75,7 @@ interface DataTableServerProps<TData> {
75
75
  };
76
76
  sorting?: SortingState;
77
77
  rowSelection?: RowSelectionState;
78
+ loadingComponent?: JSX.Element;
78
79
  }
79
80
  interface Result<T> {
80
81
  results: T[];
@@ -89,7 +90,7 @@ declare module "@tanstack/react-table" {
89
90
  displayName: string;
90
91
  }
91
92
  }
92
- declare const DataTableServer: <TData>({ columns, url, enableRowSelection, enableMultiRowSelection, enableSubRowSelection, onRowSelect, columnOrder: defaultColumnOrder, columnFilters: defaultColumnFilter, density, globalFilter: defaultGlobalFilter, pagination: defaultPagination, sorting: defaultSorting, rowSelection: defaultRowSelection, children, }: DataTableServerProps<TData>) => react_jsx_runtime.JSX.Element;
93
+ declare const DataTableServer: <TData>({ columns, url, enableRowSelection, enableMultiRowSelection, enableSubRowSelection, onRowSelect, columnOrder: defaultColumnOrder, columnFilters: defaultColumnFilter, density, globalFilter: defaultGlobalFilter, pagination: defaultPagination, sorting: defaultSorting, rowSelection: defaultRowSelection, loadingComponent, children, }: DataTableServerProps<TData>) => react_jsx_runtime.JSX.Element;
93
94
 
94
95
  declare const DensityToggleButton: () => react_jsx_runtime.JSX.Element;
95
96
 
package/dist/index.js CHANGED
@@ -200,7 +200,7 @@ const useDataFromUrl = ({ url, params = {}, defaultData, }) => {
200
200
  const DataTableServer = ({ columns, url, enableRowSelection = true, enableMultiRowSelection = true, enableSubRowSelection = true, onRowSelect = () => { }, columnOrder: defaultColumnOrder = [], columnFilters: defaultColumnFilter = [], density = "sm", globalFilter: defaultGlobalFilter = "", pagination: defaultPagination = {
201
201
  pageIndex: 0, //initial page index
202
202
  pageSize: 10, //default page size
203
- }, sorting: defaultSorting = [], rowSelection: defaultRowSelection = {}, children, }) => {
203
+ }, sorting: defaultSorting = [], rowSelection: defaultRowSelection = {}, loadingComponent = jsxRuntime.jsx(jsxRuntime.Fragment, { children: "Loading..." }), children, }) => {
204
204
  const [sorting, setSorting] = react.useState(defaultSorting);
205
205
  const [columnFilters, setColumnFilters] = react.useState(defaultColumnFilter); // can set initial column filter state here
206
206
  const [pagination, setPagination] = react.useState(defaultPagination);
@@ -286,12 +286,12 @@ const DataTableServer = ({ columns, url, enableRowSelection = true, enableMultiR
286
286
  react.useEffect(() => {
287
287
  onRowSelect(table.getState().rowSelection);
288
288
  }, [table.getState().rowSelection]);
289
- return (jsxRuntime.jsx(TableContext.Provider, { value: {
289
+ return (jsxRuntime.jsxs(TableContext.Provider, { value: {
290
290
  table: { ...table },
291
291
  refreshData: refreshData,
292
292
  globalFilter,
293
293
  setGlobalFilter,
294
- }, children: children }));
294
+ }, children: [loading && loadingComponent, !loading && children] }));
295
295
  };
296
296
 
297
297
  const DensityToggleButton = () => {
package/dist/index.mjs CHANGED
@@ -1,4 +1,4 @@
1
- import { jsx, Fragment, jsxs } from 'react/jsx-runtime';
1
+ import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
2
2
  import { makeStateUpdater, functionalUpdate, useReactTable, getCoreRowModel, getFilteredRowModel, getSortedRowModel, getPaginationRowModel, flexRender } from '@tanstack/react-table';
3
3
  import { createContext, useState, useEffect, useContext } from 'react';
4
4
  import { rankItem } from '@tanstack/match-sorter-utils';
@@ -198,7 +198,7 @@ const useDataFromUrl = ({ url, params = {}, defaultData, }) => {
198
198
  const DataTableServer = ({ columns, url, enableRowSelection = true, enableMultiRowSelection = true, enableSubRowSelection = true, onRowSelect = () => { }, columnOrder: defaultColumnOrder = [], columnFilters: defaultColumnFilter = [], density = "sm", globalFilter: defaultGlobalFilter = "", pagination: defaultPagination = {
199
199
  pageIndex: 0, //initial page index
200
200
  pageSize: 10, //default page size
201
- }, sorting: defaultSorting = [], rowSelection: defaultRowSelection = {}, children, }) => {
201
+ }, sorting: defaultSorting = [], rowSelection: defaultRowSelection = {}, loadingComponent = jsx(Fragment, { children: "Loading..." }), children, }) => {
202
202
  const [sorting, setSorting] = useState(defaultSorting);
203
203
  const [columnFilters, setColumnFilters] = useState(defaultColumnFilter); // can set initial column filter state here
204
204
  const [pagination, setPagination] = useState(defaultPagination);
@@ -284,12 +284,12 @@ const DataTableServer = ({ columns, url, enableRowSelection = true, enableMultiR
284
284
  useEffect(() => {
285
285
  onRowSelect(table.getState().rowSelection);
286
286
  }, [table.getState().rowSelection]);
287
- return (jsx(TableContext.Provider, { value: {
287
+ return (jsxs(TableContext.Provider, { value: {
288
288
  table: { ...table },
289
289
  refreshData: refreshData,
290
290
  globalFilter,
291
291
  setGlobalFilter,
292
- }, children: children }));
292
+ }, children: [loading && loadingComponent, !loading && children] }));
293
293
  };
294
294
 
295
295
  const DensityToggleButton = () => {
package/dist/types/components/DataTableServer.d.ts CHANGED
@@ -19,6 +19,7 @@ export interface DataTableServerProps<TData> {
19
19
  };
20
20
  sorting?: SortingState;
21
21
  rowSelection?: RowSelectionState;
22
+ loadingComponent?: JSX.Element;
22
23
  }
23
24
  export interface Result<T> {
24
25
  results: T[];
@@ -33,4 +34,4 @@ declare module "@tanstack/react-table" {
33
34
  displayName: string;
34
35
  }
35
36
  }
36
- export declare const DataTableServer: <TData>({ columns, url, enableRowSelection, enableMultiRowSelection, enableSubRowSelection, onRowSelect, columnOrder: defaultColumnOrder, columnFilters: defaultColumnFilter, density, globalFilter: defaultGlobalFilter, pagination: defaultPagination, sorting: defaultSorting, rowSelection: defaultRowSelection, children, }: DataTableServerProps<TData>) => import("react/jsx-runtime").JSX.Element;
37
+ export declare const DataTableServer: <TData>({ columns, url, enableRowSelection, enableMultiRowSelection, enableSubRowSelection, onRowSelect, columnOrder: defaultColumnOrder, columnFilters: defaultColumnFilter, density, globalFilter: defaultGlobalFilter, pagination: defaultPagination, sorting: defaultSorting, rowSelection: defaultRowSelection, loadingComponent, children, }: DataTableServerProps<TData>) => import("react/jsx-runtime").JSX.Element;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@bsol-oss/react-datatable5",
3
- "version": "1.0.35",
3
+ "version": "1.0.36",
4
4
  "type": "module",
5
5
  "main": "dist/index.js",
6
6
  "module": "dist/index.mjs",