@spark-web/data-table 0.3.1 → 0.3.3

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 (7) hide show
  1. package/CHANGELOG.md +17 -0
  2. package/dist/declarations/src/data-table.d.ts +4 -3
  3. package/dist/declarations/src/index.d.ts +1 -1
  4. package/dist/spark-web-data-table.cjs.dev.js +8 -3
  5. package/dist/spark-web-data-table.cjs.prod.js +8 -3
  6. package/dist/spark-web-data-table.esm.js +5 -4
  7. package/package.json +1 -1
package/CHANGELOG.md CHANGED
@@ -1,5 +1,22 @@
1
1
  # @spark-web/data-table
2
2
 
3
+ ## 0.3.3
4
+
5
+ ### Patch Changes
6
+
7
+ - [#509](https://github.com/brighte-labs/spark-web/pull/509)
8
+ [`99b1199`](https://github.com/brighte-labs/spark-web/commit/99b1199ec7624aa2ecc5d03d7f0a18ea377936e9)
9
+ Thanks [@mkt-brighte](https://github.com/mkt-brighte)! - Export flexRender
10
+
11
+ ## 0.3.2
12
+
13
+ ### Patch Changes
14
+
15
+ - [#507](https://github.com/brighte-labs/spark-web/pull/507)
16
+ [`e3090c4`](https://github.com/brighte-labs/spark-web/commit/e3090c469dc34b74f1eb0d891f27cee25e625782)
17
+ Thanks [@mkt-brighte](https://github.com/mkt-brighte)! - Support for custom
18
+ table rows
19
+
3
20
  ## 0.3.1
4
21
 
5
22
  ### Patch Changes
package/dist/declarations/src/data-table.d.ts CHANGED
@@ -1,13 +1,13 @@
1
1
  import { type DataAttributeMap } from '@spark-web/utils/internal';
2
2
  import type { ColumnDef, ColumnHelper, ExpandedState, OnChangeFn, Row, Table, TableOptions } from '@tanstack/react-table';
3
- import { createColumnHelper } from '@tanstack/react-table';
3
+ import { createColumnHelper, flexRender } from '@tanstack/react-table';
4
4
  import type { HTMLAttributes, ReactElement } from 'react';
5
5
  /**
6
6
  * DataTable
7
7
  *
8
8
  * @see https://spark.brighte.com.au/package/data-table
9
9
  */
10
- declare function DataTable<T>({ data, items, className, columns, enableExpanding, enableHiding, enableMultiRowSelection, enableClickableRow, headerClassName, footerClassName, showBottomSpinner: showSpinner, expandedRowComponent, onBottomSpinnerShown, onRowClick, onRowSelectionChange, ...tableOptions }: DataTableProps<T>): import("react/jsx-runtime").JSX.Element;
10
+ declare function DataTable<T>({ data, items, className, columns, enableExpanding, enableHiding, enableMultiRowSelection, enableClickableRow, headerClassName, footerClassName, showBottomSpinner: showSpinner, expandedRowComponent, onBottomSpinnerShown, onRowClick, onRowSelectionChange, renderRow, ...tableOptions }: DataTableProps<T>): import("react/jsx-runtime").JSX.Element;
11
11
  declare type TableSubsetAttributes = Pick<HTMLAttributes<HTMLTableElement>, 'className'>;
12
12
  declare type TableSubsetOptions<T> = Pick<TableOptions<T>, 'columns' | 'enableExpanding' | 'enableHiding' | 'enableMultiRowSelection' | 'state' | 'onStateChange' | 'onExpandedChange' | 'onRowSelectionChange' | 'getRowId'>;
13
13
  declare type DataTableProps<T> = TableSubsetAttributes & TableSubsetOptions<T> & {
@@ -21,6 +21,7 @@ declare type DataTableProps<T> = TableSubsetAttributes & TableSubsetOptions<T> &
21
21
  expandedRowComponent?: (row: Row<T>, table?: Table<T>) => ReactElement<T>;
22
22
  onBottomSpinnerShown?: (isInView: boolean) => void;
23
23
  onRowClick?: (row: Row<T>) => void;
24
+ renderRow?: (table: Table<T>) => ReactElement<T>;
24
25
  };
25
- export { createColumnHelper, DataTable };
26
+ export { createColumnHelper, DataTable, flexRender };
26
27
  export type { ColumnDef, ColumnHelper, DataTableProps, Row as DataTableRow, ExpandedState, OnChangeFn, };
package/dist/declarations/src/index.d.ts CHANGED
@@ -1,2 +1,2 @@
1
- export { createColumnHelper, DataTable } from "./data-table.js";
1
+ export { createColumnHelper, DataTable, flexRender } from "./data-table.js";
2
2
  export type { ColumnDef, ColumnHelper, DataTableProps, DataTableRow, ExpandedState, OnChangeFn, } from "./data-table.js";
package/dist/spark-web-data-table.cjs.dev.js CHANGED
@@ -18,7 +18,7 @@ function _interopDefault (e) { return e && e.__esModule ? e : { 'default': e };
18
18
 
19
19
  var React__default = /*#__PURE__*/_interopDefault(React);
20
20
 
21
- var _excluded = ["data", "items", "className", "columns", "enableExpanding", "enableHiding", "enableMultiRowSelection", "enableClickableRow", "headerClassName", "footerClassName", "showBottomSpinner", "expandedRowComponent", "onBottomSpinnerShown", "onRowClick", "onRowSelectionChange"];
21
+ var _excluded = ["data", "items", "className", "columns", "enableExpanding", "enableHiding", "enableMultiRowSelection", "enableClickableRow", "headerClassName", "footerClassName", "showBottomSpinner", "expandedRowComponent", "onBottomSpinnerShown", "onRowClick", "onRowSelectionChange", "renderRow"];
22
22
  function DataTable(_ref) {
23
23
  var data = _ref.data,
24
24
  items = _ref.items,
@@ -38,6 +38,7 @@ function DataTable(_ref) {
38
38
  onBottomSpinnerShown = _ref.onBottomSpinnerShown,
39
39
  onRowClick = _ref.onRowClick,
40
40
  onRowSelectionChange = _ref.onRowSelectionChange,
41
+ renderRow = _ref.renderRow,
41
42
  tableOptions = _objectWithoutProperties(_ref, _excluded);
42
43
  var theme$1 = theme.useTheme();
43
44
  var enableRowSelection = !!onRowSelectionChange;
@@ -92,7 +93,7 @@ function DataTable(_ref) {
92
93
  })
93
94
  }) : null, /*#__PURE__*/jsxRuntime.jsxs(box.Box, {
94
95
  as: "tbody",
95
- children: [table.getRowModel().rows.map(function (row) {
96
+ children: [!renderRow ? table.getRowModel().rows.map(function (row) {
96
97
  return /*#__PURE__*/jsxRuntime.jsxs(React__default["default"].Fragment, {
97
98
  children: [/*#__PURE__*/jsxRuntime.jsx(box.Box, {
98
99
  as: "tr",
@@ -126,7 +127,7 @@ function DataTable(_ref) {
126
127
  })
127
128
  }), enableExpanding && row.getIsExpanded() && expandedRowComponent && expandedRowComponent(row, table)]
128
129
  }, row.id);
129
- }), showSpinner && /*#__PURE__*/jsxRuntime.jsx(reactIntersectionObserver.InView, {
130
+ }) : renderRow(table), showSpinner && /*#__PURE__*/jsxRuntime.jsx(reactIntersectionObserver.InView, {
130
131
  as: "tr",
131
132
  className: css.css({
132
133
  columnSpan: 'all'
@@ -174,4 +175,8 @@ Object.defineProperty(exports, 'createColumnHelper', {
174
175
  enumerable: true,
175
176
  get: function () { return reactTable.createColumnHelper; }
176
177
  });
178
+ Object.defineProperty(exports, 'flexRender', {
179
+ enumerable: true,
180
+ get: function () { return reactTable.flexRender; }
181
+ });
177
182
  exports.DataTable = DataTable;
package/dist/spark-web-data-table.cjs.prod.js CHANGED
@@ -18,7 +18,7 @@ function _interopDefault (e) { return e && e.__esModule ? e : { 'default': e };
18
18
 
19
19
  var React__default = /*#__PURE__*/_interopDefault(React);
20
20
 
21
- var _excluded = ["data", "items", "className", "columns", "enableExpanding", "enableHiding", "enableMultiRowSelection", "enableClickableRow", "headerClassName", "footerClassName", "showBottomSpinner", "expandedRowComponent", "onBottomSpinnerShown", "onRowClick", "onRowSelectionChange"];
21
+ var _excluded = ["data", "items", "className", "columns", "enableExpanding", "enableHiding", "enableMultiRowSelection", "enableClickableRow", "headerClassName", "footerClassName", "showBottomSpinner", "expandedRowComponent", "onBottomSpinnerShown", "onRowClick", "onRowSelectionChange", "renderRow"];
22
22
  function DataTable(_ref) {
23
23
  var data = _ref.data,
24
24
  items = _ref.items,
@@ -38,6 +38,7 @@ function DataTable(_ref) {
38
38
  onBottomSpinnerShown = _ref.onBottomSpinnerShown,
39
39
  onRowClick = _ref.onRowClick,
40
40
  onRowSelectionChange = _ref.onRowSelectionChange,
41
+ renderRow = _ref.renderRow,
41
42
  tableOptions = _objectWithoutProperties(_ref, _excluded);
42
43
  var theme$1 = theme.useTheme();
43
44
  var enableRowSelection = !!onRowSelectionChange;
@@ -92,7 +93,7 @@ function DataTable(_ref) {
92
93
  })
93
94
  }) : null, /*#__PURE__*/jsxRuntime.jsxs(box.Box, {
94
95
  as: "tbody",
95
- children: [table.getRowModel().rows.map(function (row) {
96
+ children: [!renderRow ? table.getRowModel().rows.map(function (row) {
96
97
  return /*#__PURE__*/jsxRuntime.jsxs(React__default["default"].Fragment, {
97
98
  children: [/*#__PURE__*/jsxRuntime.jsx(box.Box, {
98
99
  as: "tr",
@@ -126,7 +127,7 @@ function DataTable(_ref) {
126
127
  })
127
128
  }), enableExpanding && row.getIsExpanded() && expandedRowComponent && expandedRowComponent(row, table)]
128
129
  }, row.id);
129
- }), showSpinner && /*#__PURE__*/jsxRuntime.jsx(reactIntersectionObserver.InView, {
130
+ }) : renderRow(table), showSpinner && /*#__PURE__*/jsxRuntime.jsx(reactIntersectionObserver.InView, {
130
131
  as: "tr",
131
132
  className: css.css({
132
133
  columnSpan: 'all'
@@ -174,4 +175,8 @@ Object.defineProperty(exports, 'createColumnHelper', {
174
175
  enumerable: true,
175
176
  get: function () { return reactTable.createColumnHelper; }
176
177
  });
178
+ Object.defineProperty(exports, 'flexRender', {
179
+ enumerable: true,
180
+ get: function () { return reactTable.flexRender; }
181
+ });
177
182
  exports.DataTable = DataTable;
package/dist/spark-web-data-table.esm.js CHANGED
@@ -6,12 +6,12 @@ import { Spinner } from '@spark-web/spinner';
6
6
  import { useTheme } from '@spark-web/theme';
7
7
  import { buildDataAttributes } from '@spark-web/utils/internal';
8
8
  import { useReactTable, getCoreRowModel, flexRender } from '@tanstack/react-table';
9
- export { createColumnHelper } from '@tanstack/react-table';
9
+ export { createColumnHelper, flexRender } from '@tanstack/react-table';
10
10
  import React from 'react';
11
11
  import { InView } from 'react-intersection-observer';
12
12
  import { jsxs, jsx } from 'react/jsx-runtime';
13
13
 
14
- var _excluded = ["data", "items", "className", "columns", "enableExpanding", "enableHiding", "enableMultiRowSelection", "enableClickableRow", "headerClassName", "footerClassName", "showBottomSpinner", "expandedRowComponent", "onBottomSpinnerShown", "onRowClick", "onRowSelectionChange"];
14
+ var _excluded = ["data", "items", "className", "columns", "enableExpanding", "enableHiding", "enableMultiRowSelection", "enableClickableRow", "headerClassName", "footerClassName", "showBottomSpinner", "expandedRowComponent", "onBottomSpinnerShown", "onRowClick", "onRowSelectionChange", "renderRow"];
15
15
  function DataTable(_ref) {
16
16
  var data = _ref.data,
17
17
  items = _ref.items,
@@ -31,6 +31,7 @@ function DataTable(_ref) {
31
31
  onBottomSpinnerShown = _ref.onBottomSpinnerShown,
32
32
  onRowClick = _ref.onRowClick,
33
33
  onRowSelectionChange = _ref.onRowSelectionChange,
34
+ renderRow = _ref.renderRow,
34
35
  tableOptions = _objectWithoutProperties(_ref, _excluded);
35
36
  var theme = useTheme();
36
37
  var enableRowSelection = !!onRowSelectionChange;
@@ -85,7 +86,7 @@ function DataTable(_ref) {
85
86
  })
86
87
  }) : null, /*#__PURE__*/jsxs(Box, {
87
88
  as: "tbody",
88
- children: [table.getRowModel().rows.map(function (row) {
89
+ children: [!renderRow ? table.getRowModel().rows.map(function (row) {
89
90
  return /*#__PURE__*/jsxs(React.Fragment, {
90
91
  children: [/*#__PURE__*/jsx(Box, {
91
92
  as: "tr",
@@ -119,7 +120,7 @@ function DataTable(_ref) {
119
120
  })
120
121
  }), enableExpanding && row.getIsExpanded() && expandedRowComponent && expandedRowComponent(row, table)]
121
122
  }, row.id);
122
- }), showSpinner && /*#__PURE__*/jsx(InView, {
123
+ }) : renderRow(table), showSpinner && /*#__PURE__*/jsx(InView, {
123
124
  as: "tr",
124
125
  className: css({
125
126
  columnSpan: 'all'
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@spark-web/data-table",
3
- "version": "0.3.1",
3
+ "version": "0.3.3",
4
4
  "homepage": "https://github.com/brighte-labs/spark-web#readme",
5
5
  "repository": {
6
6
  "type": "git",