es-grid-template 1.8.52 → 1.8.54

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/es/table-component/TableContainer.js +23 -18
  2. package/es/table-component/TableContainerEdit.js +6 -1
  3. package/es/table-component/type.d.ts +1 -0
  4. package/lib/table-component/TableContainer.js +23 -18
  5. package/lib/table-component/TableContainerEdit.js +6 -1
  6. package/lib/table-component/type.d.ts +1 -0
  7. package/package.json +1 -1
package/es/table-component/TableContainer.js CHANGED
@@ -75,7 +75,8 @@ const TableContainer = props => {
75
75
  setColumns,
76
76
  columnSizing,
77
77
  columnSizingInfo,
78
- rowClassName
78
+ rowClassName,
79
+ title
79
80
  } = props;
80
81
  const tableContainerRef = React.useRef(null);
81
82
  const containerRef = React.useRef(null);
@@ -175,17 +176,21 @@ const TableContainer = props => {
175
176
  return /*#__PURE__*/React.createElement("div", {
176
177
  ref: containerRef,
177
178
  id: id
178
- }, (showToolbar !== false || fullScreen !== false) && /*#__PURE__*/React.createElement("div", {
179
+ }, (showToolbar !== false || fullScreen !== false || title) && /*#__PURE__*/React.createElement("div", {
179
180
  ref: topToolbarRef,
180
181
  className: classNames(`${prefix}-grid-top-toolbar`, {})
181
182
  }, /*#__PURE__*/React.createElement("div", {
183
+ style: {
184
+ textAlign: 'center'
185
+ }
186
+ }, typeof title === 'function' ? title?.(originData) : title), /*#__PURE__*/React.createElement("div", {
182
187
  style: {
183
188
  display: 'flex',
184
189
  justifyContent: 'space-between',
185
190
  alignItems: 'center',
186
191
  gap: '.75rem'
187
192
  }
188
- }, toolbarItems && toolbarItems?.length > 0 && /*#__PURE__*/React.createElement("div", {
193
+ }, /*#__PURE__*/React.createElement("div", {
189
194
  style: {
190
195
  flex: 1,
191
196
  overflow: 'hidden'
@@ -193,20 +198,6 @@ const TableContainer = props => {
193
198
  }, /*#__PURE__*/React.createElement(Toolbar, {
194
199
  items: (toolbarItems ?? []).filter(it => it.position !== 'Bottom'),
195
200
  mode: 'scroll'
196
- })), fullScreen !== false && (isFullScreen ? /*#__PURE__*/React.createElement(Minimize, {
197
- fontSize: 16,
198
- onClick: () => {
199
- setIsFullScreen(!isFullScreen);
200
- },
201
- "data-tooltip-id": `${id}-tooltip-content`,
202
- "data-tooltip-content": t ? t('Minimized') : 'Minimized'
203
- }) : /*#__PURE__*/React.createElement(Maximize, {
204
- fontSize: 16,
205
- onClick: () => {
206
- setIsFullScreen(!isFullScreen);
207
- },
208
- "data-tooltip-id": `${id}-tooltip-content`,
209
- "data-tooltip-content": t ? t('Full screen') : 'Full screen'
210
201
  })), /*#__PURE__*/React.createElement("div", {
211
202
  style: {
212
203
  display: 'flex',
@@ -222,7 +213,21 @@ const TableContainer = props => {
222
213
  showTotal: (totalItems, range) =>
223
214
  // @ts-ignore
224
215
  `${range[0]}-${range[1]} / ${totalItems} ${t ? t(pagination?.locale?.items ?? 'items') : 'items'}`
225
- }, pagination)), typeof actionTemplate === 'function' ? actionTemplate() : actionTemplate, showColumnChoose && /*#__PURE__*/React.createElement(ColumnsChoose, {
216
+ }, pagination)), typeof actionTemplate === 'function' ? actionTemplate() : actionTemplate, fullScreen !== false && (isFullScreen ? /*#__PURE__*/React.createElement(Minimize, {
217
+ fontSize: 16,
218
+ onClick: () => {
219
+ setIsFullScreen(!isFullScreen);
220
+ },
221
+ "data-tooltip-id": `${id}-tooltip-content`,
222
+ "data-tooltip-content": t ? t('Minimized') : 'Minimized'
223
+ }) : /*#__PURE__*/React.createElement(Maximize, {
224
+ fontSize: 16,
225
+ onClick: () => {
226
+ setIsFullScreen(!isFullScreen);
227
+ },
228
+ "data-tooltip-id": `${id}-tooltip-content`,
229
+ "data-tooltip-content": t ? t('Full screen') : 'Full screen'
230
+ })), showColumnChoose && /*#__PURE__*/React.createElement(ColumnsChoose, {
226
231
  columnHidden: columnHidden,
227
232
  columns: columns,
228
233
  originColumns: propsColumns,
package/es/table-component/TableContainerEdit.js CHANGED
@@ -59,6 +59,7 @@ const TableContainerEdit = props => {
59
59
  const {
60
60
  t,
61
61
  table,
62
+ title,
62
63
  id,
63
64
  prefix,
64
65
  commandClick,
@@ -1776,10 +1777,14 @@ const TableContainerEdit = props => {
1776
1777
  return /*#__PURE__*/React.createElement("div", {
1777
1778
  ref: containerRef,
1778
1779
  id: id
1779
- }, (showToolbar !== false || fullScreen !== false || showColumnChoose) && /*#__PURE__*/React.createElement("div", {
1780
+ }, (showToolbar !== false || fullScreen !== false || showColumnChoose || title) && /*#__PURE__*/React.createElement("div", {
1780
1781
  ref: topToolbarRef,
1781
1782
  className: classNames(`${prefix}-grid-top-toolbar`, {})
1782
1783
  }, /*#__PURE__*/React.createElement("div", {
1784
+ style: {
1785
+ textAlign: 'center'
1786
+ }
1787
+ }, typeof title === 'function' ? title?.(originData) : title), /*#__PURE__*/React.createElement("div", {
1783
1788
  style: {
1784
1789
  display: 'flex',
1785
1790
  justifyContent: 'space-between',
package/es/table-component/type.d.ts CHANGED
@@ -188,6 +188,7 @@ export type Locale = TableLocale & {
188
188
  };
189
189
  export type ColumnsTable<RecordType = AnyObject> = ColumnTable<RecordType>[];
190
190
  export type TableProps<RecordType = AnyObject> = {
191
+ title?: ReactNode | ((data: RecordType) => ReactNode);
191
192
  editAble?: boolean;
192
193
  infiniteScroll?: boolean;
193
194
  next?: () => void;
package/lib/table-component/TableContainer.js CHANGED
@@ -85,7 +85,8 @@ const TableContainer = props => {
85
85
  setColumns,
86
86
  columnSizing,
87
87
  columnSizingInfo,
88
- rowClassName
88
+ rowClassName,
89
+ title
89
90
  } = props;
90
91
  const tableContainerRef = _react.default.useRef(null);
91
92
  const containerRef = _react.default.useRef(null);
@@ -185,17 +186,21 @@ const TableContainer = props => {
185
186
  return /*#__PURE__*/_react.default.createElement("div", {
186
187
  ref: containerRef,
187
188
  id: id
188
- }, (showToolbar !== false || fullScreen !== false) && /*#__PURE__*/_react.default.createElement("div", {
189
+ }, (showToolbar !== false || fullScreen !== false || title) && /*#__PURE__*/_react.default.createElement("div", {
189
190
  ref: topToolbarRef,
190
191
  className: (0, _classnames.default)(`${prefix}-grid-top-toolbar`, {})
191
192
  }, /*#__PURE__*/_react.default.createElement("div", {
193
+ style: {
194
+ textAlign: 'center'
195
+ }
196
+ }, typeof title === 'function' ? title?.(originData) : title), /*#__PURE__*/_react.default.createElement("div", {
192
197
  style: {
193
198
  display: 'flex',
194
199
  justifyContent: 'space-between',
195
200
  alignItems: 'center',
196
201
  gap: '.75rem'
197
202
  }
198
- }, toolbarItems && toolbarItems?.length > 0 && /*#__PURE__*/_react.default.createElement("div", {
203
+ }, /*#__PURE__*/_react.default.createElement("div", {
199
204
  style: {
200
205
  flex: 1,
201
206
  overflow: 'hidden'
@@ -203,20 +208,6 @@ const TableContainer = props => {
203
208
  }, /*#__PURE__*/_react.default.createElement(_rcMasterUi.Toolbar, {
204
209
  items: (toolbarItems ?? []).filter(it => it.position !== 'Bottom'),
205
210
  mode: 'scroll'
206
- })), fullScreen !== false && (isFullScreen ? /*#__PURE__*/_react.default.createElement(_becoxyIcons.Minimize, {
207
- fontSize: 16,
208
- onClick: () => {
209
- setIsFullScreen(!isFullScreen);
210
- },
211
- "data-tooltip-id": `${id}-tooltip-content`,
212
- "data-tooltip-content": t ? t('Minimized') : 'Minimized'
213
- }) : /*#__PURE__*/_react.default.createElement(_becoxyIcons.Maximize, {
214
- fontSize: 16,
215
- onClick: () => {
216
- setIsFullScreen(!isFullScreen);
217
- },
218
- "data-tooltip-id": `${id}-tooltip-content`,
219
- "data-tooltip-content": t ? t('Full screen') : 'Full screen'
220
211
  })), /*#__PURE__*/_react.default.createElement("div", {
221
212
  style: {
222
213
  display: 'flex',
@@ -232,7 +223,21 @@ const TableContainer = props => {
232
223
  showTotal: (totalItems, range) =>
233
224
  // @ts-ignore
234
225
  `${range[0]}-${range[1]} / ${totalItems} ${t ? t(pagination?.locale?.items ?? 'items') : 'items'}`
235
- }, pagination)), typeof actionTemplate === 'function' ? actionTemplate() : actionTemplate, showColumnChoose && /*#__PURE__*/_react.default.createElement(_ColumnsChoose.ColumnsChoose, {
226
+ }, pagination)), typeof actionTemplate === 'function' ? actionTemplate() : actionTemplate, fullScreen !== false && (isFullScreen ? /*#__PURE__*/_react.default.createElement(_becoxyIcons.Minimize, {
227
+ fontSize: 16,
228
+ onClick: () => {
229
+ setIsFullScreen(!isFullScreen);
230
+ },
231
+ "data-tooltip-id": `${id}-tooltip-content`,
232
+ "data-tooltip-content": t ? t('Minimized') : 'Minimized'
233
+ }) : /*#__PURE__*/_react.default.createElement(_becoxyIcons.Maximize, {
234
+ fontSize: 16,
235
+ onClick: () => {
236
+ setIsFullScreen(!isFullScreen);
237
+ },
238
+ "data-tooltip-id": `${id}-tooltip-content`,
239
+ "data-tooltip-content": t ? t('Full screen') : 'Full screen'
240
+ })), showColumnChoose && /*#__PURE__*/_react.default.createElement(_ColumnsChoose.ColumnsChoose, {
236
241
  columnHidden: columnHidden,
237
242
  columns: columns,
238
243
  originColumns: propsColumns,
package/lib/table-component/TableContainerEdit.js CHANGED
@@ -66,6 +66,7 @@ const TableContainerEdit = props => {
66
66
  const {
67
67
  t,
68
68
  table,
69
+ title,
69
70
  id,
70
71
  prefix,
71
72
  commandClick,
@@ -1783,10 +1784,14 @@ const TableContainerEdit = props => {
1783
1784
  return /*#__PURE__*/_react.default.createElement("div", {
1784
1785
  ref: containerRef,
1785
1786
  id: id
1786
- }, (showToolbar !== false || fullScreen !== false || showColumnChoose) && /*#__PURE__*/_react.default.createElement("div", {
1787
+ }, (showToolbar !== false || fullScreen !== false || showColumnChoose || title) && /*#__PURE__*/_react.default.createElement("div", {
1787
1788
  ref: topToolbarRef,
1788
1789
  className: (0, _classnames.default)(`${prefix}-grid-top-toolbar`, {})
1789
1790
  }, /*#__PURE__*/_react.default.createElement("div", {
1791
+ style: {
1792
+ textAlign: 'center'
1793
+ }
1794
+ }, typeof title === 'function' ? title?.(originData) : title), /*#__PURE__*/_react.default.createElement("div", {
1790
1795
  style: {
1791
1796
  display: 'flex',
1792
1797
  justifyContent: 'space-between',
package/lib/table-component/type.d.ts CHANGED
@@ -188,6 +188,7 @@ export type Locale = TableLocale & {
188
188
  };
189
189
  export type ColumnsTable<RecordType = AnyObject> = ColumnTable<RecordType>[];
190
190
  export type TableProps<RecordType = AnyObject> = {
191
+ title?: ReactNode | ((data: RecordType) => ReactNode);
191
192
  editAble?: boolean;
192
193
  infiniteScroll?: boolean;
193
194
  next?: () => void;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "es-grid-template",
3
- "version": "1.8.52",
3
+ "version": "1.8.54",
4
4
  "description": "es-grid-template",
5
5
  "keywords": [
6
6
  "react",