@spark-web/data-table 0.3.1 → 0.3.2

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 (6) hide show
  1. package/CHANGELOG.md +9 -0
  2. package/dist/declarations/src/data-table.d.ts +4 -3
  3. package/dist/spark-web-data-table.cjs.dev.js +4 -3
  4. package/dist/spark-web-data-table.cjs.prod.js +4 -3
  5. package/dist/spark-web-data-table.esm.js +4 -3
  6. package/package.json +1 -1
package/CHANGELOG.md CHANGED
@@ -1,5 +1,14 @@
1
1
  # @spark-web/data-table
2
2
 
3
+ ## 0.3.2
4
+
5
+ ### Patch Changes
6
+
7
+ - [#507](https://github.com/brighte-labs/spark-web/pull/507)
8
+ [`e3090c4`](https://github.com/brighte-labs/spark-web/commit/e3090c469dc34b74f1eb0d891f27cee25e625782)
9
+ Thanks [@mkt-brighte](https://github.com/mkt-brighte)! - Support for custom
10
+ table rows
11
+
3
12
  ## 0.3.1
4
13
 
5
14
  ### 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/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'
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'
package/dist/spark-web-data-table.esm.js CHANGED
@@ -11,7 +11,7 @@ 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.2",
4
4
  "homepage": "https://github.com/brighte-labs/spark-web#readme",
5
5
  "repository": {
6
6
  "type": "git",