es-grid-template 1.9.49 → 1.9.50

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.
@@ -15,7 +15,6 @@ import ContextMenu from "../table-component/ContextMenu";
15
15
  import { TableContext } from "./useContext";
16
16
  import { ColumnsChoose } from "./pipeline/features/ColumnsChoose";
17
17
  import { StyleTableContainer } from "./base-table/styles";
18
- // const Grid = (props: GridProps) => {
19
18
  const Grid = /*#__PURE__*/React.forwardRef((props, ref) => {
20
19
  const {
21
20
  id,
@@ -56,7 +55,8 @@ const Grid = /*#__PURE__*/React.forwardRef((props, ref) => {
56
55
  loading,
57
56
  useVirtual,
58
57
  useOuterBorder = true,
59
- showHeader = true
58
+ showHeader = true,
59
+ gridLines
60
60
  } = props;
61
61
  const {
62
62
  cssVariables
@@ -159,7 +159,11 @@ const Grid = /*#__PURE__*/React.forwardRef((props, ref) => {
159
159
  return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(StyleTableContainer, {
160
160
  className: classNames(`${prefix}-grid`, {
161
161
  [tableClassNames]: !!tableClassNames,
162
- [`${prefix}-grid-theme-dark`]: theme?.theme === 'dark'
162
+ [`${prefix}-grid-theme-dark`]: theme?.theme === 'dark',
163
+ [`${prefix}-grid-line-horizontal`]: gridLines === 'Horizontal',
164
+ [`${prefix}-grid-line-vertical`]: gridLines === 'Vertical',
165
+ [`${prefix}-grid-line-none`]: gridLines === 'None',
166
+ [`use-outer-border`]: useOuterBorder
163
167
  }),
164
168
  style: {
165
169
  maxHeight: height ?? 700,
@@ -168,8 +172,8 @@ const Grid = /*#__PURE__*/React.forwardRef((props, ref) => {
168
172
  flexDirection: 'column',
169
173
  ...artTableWrapperProps.style
170
174
  }
171
- }, (showToolbar !== false || fullScreen !== false || title) && /*#__PURE__*/React.createElement("div", {
172
- className: classNames(`${prefix}-grid-top-toolbar`, {})
175
+ }, (showToolbar !== false || fullScreen !== false || title || topToolbaritems.length > 0) && /*#__PURE__*/React.createElement("div", {
176
+ className: classNames(`${prefix}-grid-top`, {})
173
177
  }, /*#__PURE__*/React.createElement("div", {
174
178
  style: {
175
179
  display: 'flex',
@@ -244,7 +248,7 @@ const Grid = /*#__PURE__*/React.forwardRef((props, ref) => {
244
248
 
245
249
  // estimatedRowHeight={50}
246
250
  ,
247
- useOuterBorder: useOuterBorder
251
+ useOuterBorder: false
248
252
  // style={{ height: 700, overflow: 'auto' }}
249
253
  ,
250
254
  style: minHeight ? {
@@ -293,7 +297,9 @@ const Grid = /*#__PURE__*/React.forwardRef((props, ref) => {
293
297
  },
294
298
  theme: theme,
295
299
  footerDataSource: footerDataSource
296
- })), bottom, pagination && !infiniteScroll && /*#__PURE__*/React.createElement(Pagination, _extends({
300
+ })), (bottom || pagination && !infiniteScroll) && /*#__PURE__*/React.createElement("div", {
301
+ className: classNames(`${prefix}-grid-bottom`, {})
302
+ }, bottom, pagination && !infiniteScroll && /*#__PURE__*/React.createElement(Pagination, _extends({
297
303
  pageSizeOptions: pageSizeOptions,
298
304
  rootClassName: 'pagination-template',
299
305
  showSizeChanger: true,
@@ -320,7 +326,7 @@ const Grid = /*#__PURE__*/React.forwardRef((props, ref) => {
320
326
  }
321
327
  },
322
328
  responsive: true
323
- }))), /*#__PURE__*/React.createElement(Tooltip, {
329
+ })))), /*#__PURE__*/React.createElement(Tooltip, {
324
330
  id: `${id}-tooltip-content`,
325
331
  style: {
326
332
  zIndex: 1999,
@@ -236,6 +236,35 @@ const InternalTable = props => {
236
236
  // colorLink: '#eb4619',
237
237
  },
238
238
  components: {
239
+ // Input: {
240
+ // activeBorderColor: '#1677ff',
241
+ // hoverBorderColor: '#1677ff',
242
+ // },
243
+ // Button: {
244
+ // colorLink: '#eb4619',
245
+ // colorLinkHover: '#eb4619'
246
+ // },
247
+ TableSelect: {
248
+ // activeBorderColor: '#1677ff',
249
+ // hoverBorderColor: '#1677ff',
250
+ zIndexPopup: 1158
251
+ },
252
+ Select: {
253
+ // activeBorderColor: '#1677ff',
254
+ // hoverBorderColor: '#1677ff',
255
+ zIndexPopup: 1158
256
+ // colorPrimary: '#eb4619',
257
+ // colorBgBase: 'red'
258
+ },
259
+ DatePicker: {
260
+ // colorPrimary: '#eb4619',
261
+ // activeBorderColor: '#1677ff',
262
+ // hoverBorderColor: '#1677ff',
263
+ zIndexPopup: 1158
264
+ },
265
+ // Pagination: {
266
+ // fontSize: 12
267
+ // },
239
268
  Dropdown: {
240
269
  zIndexPopup: 1158
241
270
  },
@@ -2,9 +2,13 @@
2
2
  export declare const LOCK_SHADOW_PADDING = 20;
3
3
  export declare const Classes: {
4
4
  /** Outer wrapper div for BaseTable component */
5
- readonly artTableWrapper: "ui-rc-grid-table-wrapper";
5
+ readonly tableWrapper: "ui-rc-grid-table-wrapper";
6
6
  readonly tableThemeDark: "ui-rc-grid-theme-dark";
7
7
  readonly artTable: "ui-rc-grid-table";
8
+ readonly tableTop: "ui-rc-grid-top";
9
+ readonly gridHorizontal: "ui-rc-grid-line-horizontal";
10
+ readonly gridVertical: "ui-rc-grid-line-vertical";
11
+ readonly gridNone: "ui-rc-grid-line-none";
8
12
  readonly tableHeader: "ui-rc-grid-table-header";
9
13
  readonly tableBody: "ui-rc-grid-table-body";
10
14
  readonly tableFooter: "ui-rc-grid-table-footer";
@@ -3,9 +3,18 @@ export const LOCK_SHADOW_PADDING = 20;
3
3
  const prefix = 'ui-rc-grid-';
4
4
  export const Classes = {
5
5
  /** Outer wrapper div for BaseTable component */
6
- artTableWrapper: `${prefix}table-wrapper`,
6
+ tableWrapper: `${prefix}table-wrapper`,
7
7
  tableThemeDark: `${prefix}theme-dark`,
8
8
  artTable: `${prefix}table`,
9
+ tableTop: `${prefix}top`,
10
+ // toolbar_top + title
11
+ gridHorizontal: `${prefix}line-horizontal`,
12
+ // line-horizontal
13
+ gridVertical: `${prefix}line-vertical`,
14
+ // line-vertical
15
+ gridNone: `${prefix}line-none`,
16
+ // line-vertical
17
+
9
18
  tableHeader: `${prefix}table-header`,
10
19
  tableBody: `${prefix}table-body`,
11
20
  tableFooter: `${prefix}table-footer`,
@@ -45,11 +54,11 @@ const Z = {
45
54
  scrollItem: 30,
46
55
  loadingIndicator: 40
47
56
  };
48
- const outerBorderStyleMixin = css(["border-top:var(--cell-border-horizontal);border-right:var(--cell-border-vertical);border-bottom:var(--cell-border-horizontal);border-left:var(--cell-border-vertical);td.first,th.first{border-left:none;}td.last,th.last{border-right:none;}thead tr.first th,tbody tr.first td{border-top:none;}&.has-footer tfoot tr.last td{}&.has-footer tbody tr.last td{&.lock-left,&.lock-right{border-bottom-width:0;border-top-width:0;box-shadow:0 -1px 0 0 var(--border-color),0 0px 0 0 var(--border-color),-1px 0 0 0 var(--border-color);}}&.has-footer tfoot tr td{&.", "{width:100%;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;word-break:keep-all;}&.", "{width:100%;white-space:normal;word-break:break-word;}&.", "{text-align:center;}&.", "{text-align:right;}}&:not(.has-footer) tbody tr.last td{border-bottom:none;}"], Classes.cellEllipsis, Classes.cellWrap, Classes.cellTextCenter, Classes.cellTextRight);
57
+ const outerBorderStyleMixin = css(["border-top:var(--cell-border-horizontal);border-right:var(--cell-border-vertical);border-bottom:var(--cell-border-horizontal);border-left:var(--cell-border-vertical);.", "{border-left:0;border-right:0;border-top:0;}td.first,th.first{border-left:none;}td.last,th.last{border-right:none;}thead tr.first th,tbody tr.first td{border-top:none;}.has-footer tfoot tr.last td{}.has-footer tbody tr.last td{&.lock-left,&.lock-right{border-bottom-width:0;border-top-width:0;box-shadow:0 -1px 0 0 var(--border-color),0 0px 0 0 var(--border-color),-1px 0 0 0 var(--border-color);}}.has-footer tfoot tr td{background:var(--footer-bgcolor);&.", "{width:100%;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;word-break:keep-all;}&.", "{width:100%;white-space:normal;word-break:break-word;}&.", "{text-align:center;}&.", "{text-align:right;}}:not(.has-footer) tbody tr.last td{}&:has(.", ") thead tr.first th{border-top:var(--cell-border-vertical);}&.", "{&:has(.", ") thead tr.first th{border-top:0;}}"], Classes.tableWrapper, Classes.cellEllipsis, Classes.cellWrap, Classes.cellTextCenter, Classes.cellTextRight, Classes.tableTop, Classes.gridNone, Classes.tableTop);
49
58
  export const StyledArtTableWrapper = styled.div.withConfig({
50
59
  displayName: "StyledArtTableWrapper",
51
60
  componentId: "es-grid-template__sc-ipj1ht-0"
52
- })(["--row-height:38px;--color:#333;--bgcolor:white;--hover-bgcolor:var(--hover-bgcolor,#f5f5f5);--hover-color:var(--hover-color,#333);--highlight-bgcolor:#eee;--header-row-height:36px;--header-color:#000000de;--header-bgcolor:#ffffff;--header-hover-bgcolor:#ddd;--header-highlight-bgcolor:#e4e8ed;--cell-padding:7px 8px;--font-size:13px;--line-height:1.28571;--lock-shadow:rgba(152,152,152,0.5) 0 0 6px 2px;--border-color:#dfe3e8;--cell-border:1px solid var(--border-color);--cell-border-horizontal:var(--cell-border);--cell-border-vertical:var(--cell-border);--header-cell-border:1px solid var(--border-color);--header-cell-border-horizontal:var(--header-cell-border);--header-cell-border-vertical:var(--header-cell-border);--footer-bgColor:#fafafa;box-sizing:border-box;*{box-sizing:border-box;}cursor:default;color:var(--color);font-size:var(--font-size);line-height:var(--line-height);position:relative;overflow-anchor:none;&::-webkit-scrollbar{width:8px;height:8px;}&::-webkit-scrollbar-track{background:var(--bgcolor);}&::-webkit-scrollbar-thumb{background:rgba(0,0,0,0.4);border-radius:8px;}&::-webkit-scrollbar-thumb:hover{background:#555;}&.dark{&::-webkit-scrollbar-thumb{background:rgba(255,255,255,0.3);}&::-webkit-scrollbar-thumb:hover{background:rgba(255,255,255,0.5);}}&.use-outer-border{", ";}.no-scrollbar{scrollbar-width:none;::-webkit-scrollbar{display:none;}}.", "{overflow-x:auto;overflow-y:hidden;background:var(--header-bgcolor);.ui-rc-table-column-title{flex:1;min-width:0;text-align:start;}.", "{font-weight:500;.ui-rc-header-trigger{padding-left:6px;display:flex;align-items:center;.ui-rc-table-column-sorter-cancel{opacity:0;}}&:hover{.ui-rc-header-trigger{.ui-rc-table-column-sorter-cancel{opacity:1;}}}.", "{width:100%;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;word-break:keep-all;}.", "{width:100%;white-space:normal;word-break:break-word;}.", "{text-align:center;}.", "{text-align:right;}}}.", "{.", "{&.", "{width:100%;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;word-break:keep-all;.expansion-cell{.expansion-content{width:100%;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;word-break:keep-all;}}}&.", "{width:100%;white-space:normal;word-break:break-word;}&.", "{text-align:center;}&.", "{text-align:right;}}.", "{background:var(--footer-bgcolor);}}.", ",.", "{overflow-x:auto;overflow-y:hidden;}&.sticky-header .", "{position:sticky;top:0;z-index:", ";}&.sticky-footer .", "{position:sticky;bottom:0;z-index:", ";}.", "{tr{td{&.lock-left,&.lock-right{border-bottom-width:0;box-shadow:0 -1px 0 0 var(--border-color),0 0px 0 0 var(--border-color),-1px 0 0 0 var(--border-color);}}}}table{width:100%;table-layout:fixed;border-collapse:separate;border-spacing:0;display:table;margin:0;padding:0;}tr:not(.no-hover):hover > td{background:var(--hover-bgcolor);color:var(--hover-color);}tr:not(.no-highlight).highlight > td{}th{font-weight:normal;text-align:left;padding:var(--cell-padding);height:var(--header-row-height);color:var(--header-color);background:var(--header-bgcolor);border:none;border-right:var(--header-cell-border-vertical);border-bottom:var(--header-cell-border-horizontal);}tr.first th{border-top:var(--header-cell-border-horizontal);}th.first{border-left:var(--header-cell-border-vertical);}td{padding:var(--cell-padding);background:var(--bgcolor);height:var(--row-height);border:none;border-right:var(--cell-border-vertical);border-bottom:var(--cell-border-horizontal);}td.first{border-left:var(--cell-border-vertical);}tr.first td{border-top:var(--cell-border-horizontal);}&.has-header tbody tr.first td{border-top:none;}&.has-footer tbody tr.last td{border-bottom:none;}&.has-footer tfoot tr > td{background:var(--footer-bgcolor);color:var(--footer-color);}&.has-footer tfoot tr:not(.no-hover):hover > td{background:var(--footer-bgcolor);}.lock-left,.lock-right{z-index:", ";}.resize-handle{width:6px;height:100%;position:absolute;top:0;right:0;cursor:col-resize;background-color:transparent;border-right:2px solid transparent;}.", "{position:absolute;top:0;bottom:0;z-index:", ";pointer-events:none;overflow:hidden;.", "{height:100%;}.", "{margin-right:", "px;box-shadow:none;&.show-shadow{box-shadow:var(--lock-shadow);border-right:var(--cell-border-vertical);}}.", "{margin-left:", "px;box-shadow:none;&.show-shadow{box-shadow:var(--lock-shadow);border-left:var(--cell-border-vertical);}}}.", "{pointer-events:none;color:#99a3b3;font-size:12px;text-align:center;position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);.empty-image{width:50px;height:50px;}.empty-tips{margin-top:16px;line-height:1.5;}}.", "{overflow:auto;position:sticky;bottom:0;z-index:", ";margin-top:-17px;}.ui-rc-grid-loading-wrapper{}.ui-rc-grid-table{}.art-loading-content-wrapper{}.", "{height:1px;visibility:hidden;}.", "{position:relative;.", "{position:absolute;inset:0;pointer-events:none;}.", "{position:sticky;z-index:", ";transform:translateY(-50%);}}"], outerBorderStyleMixin, Classes.tableHeader, Classes.tableHeaderCell, Classes.cellEllipsis, Classes.cellWrap, Classes.cellTextCenter, Classes.cellTextRight, Classes.tableBody, Classes.tableCell, Classes.cellEllipsis, Classes.cellWrap, Classes.cellTextCenter, Classes.cellTextRight, Classes.tableFooter, Classes.tableBody, Classes.tableFooter, Classes.tableHeader, Z.header, Classes.tableFooter, Z.footer, Classes.tableBody, Z.lock, Classes.lockShadowMask, Z.lockShadow, Classes.lockShadow, Classes.leftLockShadow, LOCK_SHADOW_PADDING, Classes.rightLockShadow, LOCK_SHADOW_PADDING, Classes.emptyWrapper, Classes.stickyScroll, Z.scrollItem, Classes.stickyScrollItem, Classes.loadingWrapper, Classes.loadingIndicatorWrapper, Classes.loadingIndicator, Z.loadingIndicator);
61
+ })(["box-sizing:border-box;*{box-sizing:border-box;}cursor:default;color:var(--color);font-size:var(--font-size);line-height:var(--line-height);position:relative;overflow-anchor:none;&::-webkit-scrollbar{width:8px;height:8px;}&::-webkit-scrollbar-track{background:var(--bgcolor);}&::-webkit-scrollbar-thumb{background:rgba(0,0,0,0.4);border-radius:8px;}&::-webkit-scrollbar-thumb:hover{background:#555;}&.dark{&::-webkit-scrollbar-thumb{background:rgba(255,255,255,0.3);}&::-webkit-scrollbar-thumb:hover{background:rgba(255,255,255,0.5);}}&.", "{border:var(--cell-border-vertical);&.has-footer{.", "{td{}}}}&.use-outer-border{}.no-scrollbar{scrollbar-width:none;::-webkit-scrollbar{display:none;}}.", "{overflow-x:auto;overflow-y:hidden;background:var(--header-bgcolor);.ui-rc-table-column-title{flex:1;min-width:0;text-align:start;}.", "{font-weight:500;.ui-rc-header-trigger{padding-left:6px;display:flex;align-items:center;.ui-rc-table-column-sorter-cancel{opacity:0;}}&:hover{.ui-rc-header-trigger{.ui-rc-table-column-sorter-cancel{opacity:1;}}}.", "{width:100%;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;word-break:keep-all;}.", "{width:100%;white-space:normal;word-break:break-word;}.", "{text-align:center;}.", "{text-align:right;}}}.", "{.", "{&.", "{width:100%;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;word-break:keep-all;.expansion-cell{.expansion-content{width:100%;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;word-break:keep-all;}}}&.", "{width:100%;white-space:normal;word-break:break-word;}&.", "{text-align:center;}&.", "{text-align:right;}}.", "{background:var(--footer-bgcolor);}}.", ",.", "{overflow-x:auto;overflow-y:hidden;}&.sticky-header .", "{position:sticky;top:0;z-index:", ";}&.sticky-footer .", "{position:sticky;bottom:0;z-index:", ";}.", "{tr{td{&.lock-left,&.lock-right{border-bottom-width:0;box-shadow:0 -1px 0 0 var(--border-color),0 0px 0 0 var(--border-color),-1px 0 0 0 var(--border-color);}}td.first{&.lock-left{border-bottom-width:1px;}}}}table{width:100%;table-layout:fixed;border-collapse:separate;border-spacing:0;display:table;margin:0;padding:0;}tr:not(.no-hover):hover > td{background:var(--hover-bgcolor);color:var(--hover-color);}tr:not(.no-highlight).highlight > td{}th{font-weight:normal;text-align:left;padding:var(--cell-padding);height:var(--header-row-height);color:var(--header-color);background:var(--header-bgcolor);border:none;border-right:var(--header-cell-border-vertical);border-bottom:var(--header-cell-border-horizontal);}tr.first th{}th.first{}td{padding:var(--cell-padding);background:var(--bgcolor);height:var(--row-height);border:none;border-right:var(--cell-border-vertical);border-bottom:var(--cell-border-horizontal);}td.first{}tr.first td{border-top:var(--cell-border-horizontal);}&.has-header tbody tr.first td{border-top:none;}&.has-footer tbody tr.last td{border-bottom:none;}&.has-footer tfoot tr > td{background:var(--footer-bgcolor);color:var(--footer-color);}&.has-footer tfoot tr:not(.no-hover):hover > td{background:var(--footer-bgcolor);}.lock-left,.lock-right{z-index:", ";}.resize-handle{width:6px;height:100%;position:absolute;top:0;right:0;cursor:col-resize;background-color:transparent;border-right:2px solid transparent;}.", "{position:absolute;top:0;bottom:0;z-index:", ";pointer-events:none;overflow:hidden;.", "{height:100%;}.", "{margin-right:", "px;box-shadow:none;&.show-shadow{box-shadow:var(--lock-shadow);border-right:var(--cell-border-vertical);}}.", "{margin-left:", "px;box-shadow:none;&.show-shadow{box-shadow:var(--lock-shadow);border-left:var(--cell-border-vertical);}}}.", "{pointer-events:none;color:#99a3b3;font-size:12px;text-align:center;position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);.empty-image{width:50px;height:50px;}.empty-tips{margin-top:16px;line-height:1.5;}}.", "{overflow:auto;position:sticky;bottom:0;z-index:", ";margin-top:-17px;}.ui-rc-grid-loading-wrapper{}.ui-rc-grid-table{}.art-loading-content-wrapper{display:flex;height:100%;}.", "{height:1px;visibility:hidden;}.", "{position:relative;height:100%;.", "{position:absolute;inset:0;pointer-events:none;}.", "{position:sticky;z-index:", ";transform:translateY(-50%);}}"], Classes.tableWrapper, Classes.tableFooter, Classes.tableHeader, Classes.tableHeaderCell, Classes.cellEllipsis, Classes.cellWrap, Classes.cellTextCenter, Classes.cellTextRight, Classes.tableBody, Classes.tableCell, Classes.cellEllipsis, Classes.cellWrap, Classes.cellTextCenter, Classes.cellTextRight, Classes.tableFooter, Classes.tableBody, Classes.tableFooter, Classes.tableHeader, Z.header, Classes.tableFooter, Z.footer, Classes.tableBody, Z.lock, Classes.lockShadowMask, Z.lockShadow, Classes.lockShadow, Classes.leftLockShadow, LOCK_SHADOW_PADDING, Classes.rightLockShadow, LOCK_SHADOW_PADDING, Classes.emptyWrapper, Classes.stickyScroll, Z.scrollItem, Classes.stickyScrollItem, Classes.loadingWrapper, Classes.loadingIndicatorWrapper, Classes.loadingIndicator, Z.loadingIndicator);
53
62
 
54
63
  // type StyleTableContainerProps = {
55
64
 
@@ -58,4 +67,4 @@ export const StyledArtTableWrapper = styled.div.withConfig({
58
67
  export const StyleTableContainer = styled.div.withConfig({
59
68
  displayName: "StyleTableContainer",
60
69
  componentId: "es-grid-template__sc-ipj1ht-1"
61
- })(["--color:#333;--bgcolor:white;--header-bgcolor:#ffffff;--header-hover-bgcolor:#ddd;--header-highlight-bgcolor:#e4e8ed;--cell-padding:7px 8px;--font-size:13px;--line-height:1.28571;--border-color:#dfe3e8;--cell-border:1px solid var(--border-color);--cell-border-horizontal:var(--cell-border);--cell-border-vertical:var(--cell-border);--header-cell-border:1px solid var(--border-color);--header-cell-border-horizontal:var(--header-cell-border);--header-cell-border-vertical:var(--header-cell-border);--footer-bgcolor:#fafafa;&.", "{--bgcolor:#343e59;--footer-bgcolor:#2e3342;--header-bgcolor:#343e59;--hover-bgcolor:#232b43;--header-hover-bgcolor:#606164;--highlight-bgcolor:#eff2f5;--header-highlight-bgcolor:#191a1b;--color:#dadde1;--header-color:#dadde1;--lock-shadow:rgb(37 37 37 / 0.5) 0 0 6px 2px;--border-color:#4f5266;background-color:var(--bgcolor);}&.ui-rc-grid .ui-rc-pagination{background-color:var(--bgcolor);color:var(--color);padding:10px;border-top:1px solid var(--border-color);border-bottom:1px solid var(--border-color);border-inline:1px solid var(--border-color);background-color:var(--bgcolor);.ui-rc-pagination-prev{.anticon.anticon-left{color:var(--color);}}.ui-rc-pagination-disabled{.anticon.anticon-left{color:#7d7a7a;}}.ui-rc-pagination-next{.anticon.anticon-right{color:var(--color);}&.ui-rc-pagination-disabled{.anticon.anticon-right{color:#7d7a7a;}}}}&.", "{&.ui-rc-grid{.ui-rc-toolbar-bottom{background-color:var(--footer-bgcolor);color:#ffffff;}}.ui-rc-grid-top-toolbar{border-color:var(--border-color);color:#ffffff;}.ui-rc-toolbar{.ui-rc-toolbar-selection-item{background-color:var(--footer-bgcolor);color:#ffffff;}}}"], Classes.tableThemeDark, Classes.tableThemeDark);
70
+ })(["--row-height:38px;--color:#333;--bgcolor:white;--body-hover-bgcolor:#f5f5f5;--body-hover-color:#333;--hover-bgcolor:var(--body-hover-bgcolor,#f5f5f5);--hover-color:var(--body-hover-color);--highlight-bgcolor:#eee;--header-row-height:36px;--header-color:#000000de;--header-bgcolor:#ffffff;--header-hover-bgcolor:#ddd;--header-highlight-bgcolor:#e4e8ed;--cell-padding:7px 8px;--font-size:13px;--line-height:1.28571;--lock-shadow:rgba(152,152,152,0.5) 0 0 6px 2px;--border-color:#dfe3e8;--cell-border:1px solid var(--border-color);--cell-border-horizontal:var(--cell-border);--cell-border-vertical:var(--cell-border);--header-cell-border:1px solid var(--border-color);--header-cell-border-horizontal:var(--header-cell-border);--header-cell-border-vertical:var(--header-cell-border);--footer-bgcolor:#fafafa;&.", "{--bgcolor:#343e59;--footer-bgcolor:#2e3342;--header-bgcolor:#343e59;--hover-bgcolor:#232b43;--header-hover-bgcolor:#606164;--highlight-bgcolor:#eff2f5;--header-highlight-bgcolor:#191a1b;--hover-color:#dadde1;--color:#dadde1;--header-color:#dadde1;--lock-shadow:rgb(37 37 37 / 0.5) 0 0 6px 2px;--border-color:#4f5266;background-color:var(--bgcolor);}&.use-outer-border{", ";}&.", "{.", "{border-left:0;border-right:0;td,th{border-right:0;}td.first,th.first{}td.last,th.last{}thead tr.first th,tbody tr.first td{}&.has-footer tfoot tr.last td{}&.has-footer tbody tr.last td{}&.has-footer tfoot tr td{}&:not(.has-footer) tbody tr.last td{}&:has(.", ") thead tr.first th{}}}&.", "{.", "{border-top:0;td,th{border-bottom:0;}td.lock-left{box-shadow:none;}td.first,th.first{}td.last,th.last{}thead tr.first th,tbody tr.first td{}&.has-footer tfoot tr td{border-bottom:0;border-top:0;}&.has-footer tbody tr.last td{}&.has-footer tfoot tr td{}&:not(.has-footer) tbody tr.last td{}&:has(.", ") thead tr.first th{}}}&.", "{.", "{border:0;td,th{border-right:0;border-bottom:0;}td.lock-left{box-shadow:none;}td.first,th.first{}td.last,th.last{}thead tr.first th,tbody tr.first td{}&.has-footer tfoot tr td{border-bottom:0;border-top:0;}&.has-footer tbody tr.last td{}&.has-footer tfoot tr td{}&:not(.has-footer) tbody tr.last td{}&:has(.", ") thead tr.first th{border-top:0;border:0;}}}.", "{padding:8px;}&.ui-rc-grid .ui-rc-pagination{background-color:var(--bgcolor);color:var(--color);padding:10px;background-color:var(--bgcolor);.ui-rc-pagination-prev{.anticon.anticon-left{color:var(--color);}}.ui-rc-pagination-disabled{.anticon.anticon-left{color:#7d7a7a;}}.ui-rc-pagination-next{.anticon.anticon-right{color:var(--color);}&.ui-rc-pagination-disabled{.anticon.anticon-right{color:#7d7a7a;}}}}&.", "{&.ui-rc-grid{.ui-rc-toolbar-bottom{background-color:var(--footer-bgcolor);color:#ffffff;}}.ui-rc-grid-top-toolbar{border-color:var(--border-color);color:#ffffff;}.ui-rc-toolbar{.ui-rc-toolbar-selection-item{background-color:var(--footer-bgcolor);color:#ffffff;}}}"], Classes.tableThemeDark, outerBorderStyleMixin, Classes.gridHorizontal, Classes.tableWrapper, Classes.tableTop, Classes.gridVertical, Classes.tableWrapper, Classes.tableTop, Classes.gridNone, Classes.tableWrapper, Classes.tableTop, Classes.tableTop, Classes.tableThemeDark);
@@ -350,7 +350,7 @@ export class BaseTable extends React.Component {
350
350
  footerDataSource,
351
351
  components
352
352
  } = this.props;
353
- const artTableWrapperClassName = cx(Classes.artTableWrapper, {
353
+ const artTableWrapperClassName = cx(Classes.tableWrapper, {
354
354
  'use-outer-border': useOuterBorder,
355
355
  empty: dataSource.length === 0,
356
356
  lock: info.hasLockColumn,
@@ -402,7 +402,6 @@ export function isRowChecked(key, selectedKeys, treeIndex, checkedStrategy, isDi
402
402
  // =========================
403
403
  if (checkedStrategy === 'parent') {
404
404
  // node disable => chỉ true nếu explicit chọn
405
- // console.log('isDisabled', isDisabled)
406
405
  if (isDisabled) {
407
406
  const abc = selectedKeys.has(key);
408
407
  return abc;
@@ -194,10 +194,10 @@ export declare const fixColumnsLeft: <RecordType>(columns: ColumnTable<RecordTyp
194
194
  value: any;
195
195
  rowData: RecordType;
196
196
  }) => import("react").ReactElement<any, string | import("react").JSXElementConstructor<any>> | import("react").ReactNode);
197
- onCellStyles?: Omit<CSSProperties, "position" | "display" | "left" | "minWidth" | "right" | "width"> | ((cellValue: any, cell: import("@tanstack/react-table").Cell<RecordType, unknown>) => Omit<CSSProperties, "position" | "display" | "left" | "minWidth" | "right" | "width">);
198
- onCellHeaderStyles?: Omit<CSSProperties, "position" | "display" | "left" | "minWidth" | "right" | "width"> | ((cell: import("@tanstack/react-table").Header<RecordType, unknown>) => Omit<CSSProperties, "position" | "display" | "left" | "minWidth" | "right" | "width">);
197
+ onCellStyles?: Omit<CSSProperties, "left" | "right" | "position" | "display" | "minWidth" | "width"> | ((cellValue: any, cell: import("@tanstack/react-table").Cell<RecordType, unknown>) => Omit<CSSProperties, "left" | "right" | "position" | "display" | "minWidth" | "width">);
198
+ onCellHeaderStyles?: Omit<CSSProperties, "left" | "right" | "position" | "display" | "minWidth" | "width"> | ((cell: import("@tanstack/react-table").Header<RecordType, unknown>) => Omit<CSSProperties, "left" | "right" | "position" | "display" | "minWidth" | "width">);
199
199
  onCell?: (rowData: RecordType, index: number) => import("react").TdHTMLAttributes<HTMLTableCellElement>;
200
- onCellFooterStyles?: Omit<CSSProperties, "position" | "display" | "left" | "minWidth" | "right" | "width"> | ((cellValue: any, cell: import("@tanstack/react-table").Header<RecordType, unknown>) => Omit<CSSProperties, "position" | "display" | "left" | "minWidth" | "right" | "width">);
200
+ onCellFooterStyles?: Omit<CSSProperties, "left" | "right" | "position" | "display" | "minWidth" | "width"> | ((cellValue: any, cell: import("@tanstack/react-table").Header<RecordType, unknown>) => Omit<CSSProperties, "left" | "right" | "position" | "display" | "minWidth" | "width">);
201
201
  getValue?: (row: any, rowIndex: number) => any;
202
202
  getCellProps?: (value: any, row: any, rowIndex: number) => import("./../../grid-component/type").CellProps;
203
203
  headerCellProps?: import("./../../grid-component/type").CellProps;
@@ -25,7 +25,6 @@ function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return
25
25
  function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && Object.prototype.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
26
26
  // import type { TableProps } from "../table-component"
27
27
 
28
- // const Grid = (props: GridProps) => {
29
28
  const Grid = /*#__PURE__*/_react.default.forwardRef((props, ref) => {
30
29
  const {
31
30
  id,
@@ -66,7 +65,8 @@ const Grid = /*#__PURE__*/_react.default.forwardRef((props, ref) => {
66
65
  loading,
67
66
  useVirtual,
68
67
  useOuterBorder = true,
69
- showHeader = true
68
+ showHeader = true,
69
+ gridLines
70
70
  } = props;
71
71
  const {
72
72
  cssVariables
@@ -169,7 +169,11 @@ const Grid = /*#__PURE__*/_react.default.forwardRef((props, ref) => {
169
169
  return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(_styles2.StyleTableContainer, {
170
170
  className: (0, _classnames.default)(`${prefix}-grid`, {
171
171
  [tableClassNames]: !!tableClassNames,
172
- [`${prefix}-grid-theme-dark`]: theme?.theme === 'dark'
172
+ [`${prefix}-grid-theme-dark`]: theme?.theme === 'dark',
173
+ [`${prefix}-grid-line-horizontal`]: gridLines === 'Horizontal',
174
+ [`${prefix}-grid-line-vertical`]: gridLines === 'Vertical',
175
+ [`${prefix}-grid-line-none`]: gridLines === 'None',
176
+ [`use-outer-border`]: useOuterBorder
173
177
  }),
174
178
  style: {
175
179
  maxHeight: height ?? 700,
@@ -178,8 +182,8 @@ const Grid = /*#__PURE__*/_react.default.forwardRef((props, ref) => {
178
182
  flexDirection: 'column',
179
183
  ...artTableWrapperProps.style
180
184
  }
181
- }, (showToolbar !== false || fullScreen !== false || title) && /*#__PURE__*/_react.default.createElement("div", {
182
- className: (0, _classnames.default)(`${prefix}-grid-top-toolbar`, {})
185
+ }, (showToolbar !== false || fullScreen !== false || title || topToolbaritems.length > 0) && /*#__PURE__*/_react.default.createElement("div", {
186
+ className: (0, _classnames.default)(`${prefix}-grid-top`, {})
183
187
  }, /*#__PURE__*/_react.default.createElement("div", {
184
188
  style: {
185
189
  display: 'flex',
@@ -254,7 +258,7 @@ const Grid = /*#__PURE__*/_react.default.forwardRef((props, ref) => {
254
258
 
255
259
  // estimatedRowHeight={50}
256
260
  ,
257
- useOuterBorder: useOuterBorder
261
+ useOuterBorder: false
258
262
  // style={{ height: 700, overflow: 'auto' }}
259
263
  ,
260
264
  style: minHeight ? {
@@ -303,7 +307,9 @@ const Grid = /*#__PURE__*/_react.default.forwardRef((props, ref) => {
303
307
  },
304
308
  theme: theme,
305
309
  footerDataSource: footerDataSource
306
- })), bottom, pagination && !infiniteScroll && /*#__PURE__*/_react.default.createElement(_pagination.default, (0, _extends2.default)({
310
+ })), (bottom || pagination && !infiniteScroll) && /*#__PURE__*/_react.default.createElement("div", {
311
+ className: (0, _classnames.default)(`${prefix}-grid-bottom`, {})
312
+ }, bottom, pagination && !infiniteScroll && /*#__PURE__*/_react.default.createElement(_pagination.default, (0, _extends2.default)({
307
313
  pageSizeOptions: _hooks.pageSizeOptions,
308
314
  rootClassName: 'pagination-template',
309
315
  showSizeChanger: true,
@@ -330,7 +336,7 @@ const Grid = /*#__PURE__*/_react.default.forwardRef((props, ref) => {
330
336
  }
331
337
  },
332
338
  responsive: true
333
- }))), /*#__PURE__*/_react.default.createElement(_reactTooltip.Tooltip, {
339
+ })))), /*#__PURE__*/_react.default.createElement(_reactTooltip.Tooltip, {
334
340
  id: `${id}-tooltip-content`,
335
341
  style: {
336
342
  zIndex: 1999,
@@ -243,6 +243,35 @@ const InternalTable = props => {
243
243
  // colorLink: '#eb4619',
244
244
  },
245
245
  components: {
246
+ // Input: {
247
+ // activeBorderColor: '#1677ff',
248
+ // hoverBorderColor: '#1677ff',
249
+ // },
250
+ // Button: {
251
+ // colorLink: '#eb4619',
252
+ // colorLinkHover: '#eb4619'
253
+ // },
254
+ TableSelect: {
255
+ // activeBorderColor: '#1677ff',
256
+ // hoverBorderColor: '#1677ff',
257
+ zIndexPopup: 1158
258
+ },
259
+ Select: {
260
+ // activeBorderColor: '#1677ff',
261
+ // hoverBorderColor: '#1677ff',
262
+ zIndexPopup: 1158
263
+ // colorPrimary: '#eb4619',
264
+ // colorBgBase: 'red'
265
+ },
266
+ DatePicker: {
267
+ // colorPrimary: '#eb4619',
268
+ // activeBorderColor: '#1677ff',
269
+ // hoverBorderColor: '#1677ff',
270
+ zIndexPopup: 1158
271
+ },
272
+ // Pagination: {
273
+ // fontSize: 12
274
+ // },
246
275
  Dropdown: {
247
276
  zIndexPopup: 1158
248
277
  },
@@ -2,9 +2,13 @@
2
2
  export declare const LOCK_SHADOW_PADDING = 20;
3
3
  export declare const Classes: {
4
4
  /** Outer wrapper div for BaseTable component */
5
- readonly artTableWrapper: "ui-rc-grid-table-wrapper";
5
+ readonly tableWrapper: "ui-rc-grid-table-wrapper";
6
6
  readonly tableThemeDark: "ui-rc-grid-theme-dark";
7
7
  readonly artTable: "ui-rc-grid-table";
8
+ readonly tableTop: "ui-rc-grid-top";
9
+ readonly gridHorizontal: "ui-rc-grid-line-horizontal";
10
+ readonly gridVertical: "ui-rc-grid-line-vertical";
11
+ readonly gridNone: "ui-rc-grid-line-none";
8
12
  readonly tableHeader: "ui-rc-grid-table-header";
9
13
  readonly tableBody: "ui-rc-grid-table-body";
10
14
  readonly tableFooter: "ui-rc-grid-table-footer";
@@ -11,9 +11,18 @@ const LOCK_SHADOW_PADDING = exports.LOCK_SHADOW_PADDING = 20;
11
11
  const prefix = 'ui-rc-grid-';
12
12
  const Classes = exports.Classes = {
13
13
  /** Outer wrapper div for BaseTable component */
14
- artTableWrapper: `${prefix}table-wrapper`,
14
+ tableWrapper: `${prefix}table-wrapper`,
15
15
  tableThemeDark: `${prefix}theme-dark`,
16
16
  artTable: `${prefix}table`,
17
+ tableTop: `${prefix}top`,
18
+ // toolbar_top + title
19
+ gridHorizontal: `${prefix}line-horizontal`,
20
+ // line-horizontal
21
+ gridVertical: `${prefix}line-vertical`,
22
+ // line-vertical
23
+ gridNone: `${prefix}line-none`,
24
+ // line-vertical
25
+
17
26
  tableHeader: `${prefix}table-header`,
18
27
  tableBody: `${prefix}table-body`,
19
28
  tableFooter: `${prefix}table-footer`,
@@ -53,11 +62,11 @@ const Z = {
53
62
  scrollItem: 30,
54
63
  loadingIndicator: 40
55
64
  };
56
- const outerBorderStyleMixin = (0, _styledComponents.css)(["border-top:var(--cell-border-horizontal);border-right:var(--cell-border-vertical);border-bottom:var(--cell-border-horizontal);border-left:var(--cell-border-vertical);td.first,th.first{border-left:none;}td.last,th.last{border-right:none;}thead tr.first th,tbody tr.first td{border-top:none;}&.has-footer tfoot tr.last td{}&.has-footer tbody tr.last td{&.lock-left,&.lock-right{border-bottom-width:0;border-top-width:0;box-shadow:0 -1px 0 0 var(--border-color),0 0px 0 0 var(--border-color),-1px 0 0 0 var(--border-color);}}&.has-footer tfoot tr td{&.", "{width:100%;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;word-break:keep-all;}&.", "{width:100%;white-space:normal;word-break:break-word;}&.", "{text-align:center;}&.", "{text-align:right;}}&:not(.has-footer) tbody tr.last td{border-bottom:none;}"], Classes.cellEllipsis, Classes.cellWrap, Classes.cellTextCenter, Classes.cellTextRight);
65
+ const outerBorderStyleMixin = (0, _styledComponents.css)(["border-top:var(--cell-border-horizontal);border-right:var(--cell-border-vertical);border-bottom:var(--cell-border-horizontal);border-left:var(--cell-border-vertical);.", "{border-left:0;border-right:0;border-top:0;}td.first,th.first{border-left:none;}td.last,th.last{border-right:none;}thead tr.first th,tbody tr.first td{border-top:none;}.has-footer tfoot tr.last td{}.has-footer tbody tr.last td{&.lock-left,&.lock-right{border-bottom-width:0;border-top-width:0;box-shadow:0 -1px 0 0 var(--border-color),0 0px 0 0 var(--border-color),-1px 0 0 0 var(--border-color);}}.has-footer tfoot tr td{background:var(--footer-bgcolor);&.", "{width:100%;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;word-break:keep-all;}&.", "{width:100%;white-space:normal;word-break:break-word;}&.", "{text-align:center;}&.", "{text-align:right;}}:not(.has-footer) tbody tr.last td{}&:has(.", ") thead tr.first th{border-top:var(--cell-border-vertical);}&.", "{&:has(.", ") thead tr.first th{border-top:0;}}"], Classes.tableWrapper, Classes.cellEllipsis, Classes.cellWrap, Classes.cellTextCenter, Classes.cellTextRight, Classes.tableTop, Classes.gridNone, Classes.tableTop);
57
66
  const StyledArtTableWrapper = exports.StyledArtTableWrapper = _styledComponents.default.div.withConfig({
58
67
  displayName: "StyledArtTableWrapper",
59
68
  componentId: "es-grid-template__sc-ipj1ht-0"
60
- })(["--row-height:38px;--color:#333;--bgcolor:white;--hover-bgcolor:var(--hover-bgcolor,#f5f5f5);--hover-color:var(--hover-color,#333);--highlight-bgcolor:#eee;--header-row-height:36px;--header-color:#000000de;--header-bgcolor:#ffffff;--header-hover-bgcolor:#ddd;--header-highlight-bgcolor:#e4e8ed;--cell-padding:7px 8px;--font-size:13px;--line-height:1.28571;--lock-shadow:rgba(152,152,152,0.5) 0 0 6px 2px;--border-color:#dfe3e8;--cell-border:1px solid var(--border-color);--cell-border-horizontal:var(--cell-border);--cell-border-vertical:var(--cell-border);--header-cell-border:1px solid var(--border-color);--header-cell-border-horizontal:var(--header-cell-border);--header-cell-border-vertical:var(--header-cell-border);--footer-bgColor:#fafafa;box-sizing:border-box;*{box-sizing:border-box;}cursor:default;color:var(--color);font-size:var(--font-size);line-height:var(--line-height);position:relative;overflow-anchor:none;&::-webkit-scrollbar{width:8px;height:8px;}&::-webkit-scrollbar-track{background:var(--bgcolor);}&::-webkit-scrollbar-thumb{background:rgba(0,0,0,0.4);border-radius:8px;}&::-webkit-scrollbar-thumb:hover{background:#555;}&.dark{&::-webkit-scrollbar-thumb{background:rgba(255,255,255,0.3);}&::-webkit-scrollbar-thumb:hover{background:rgba(255,255,255,0.5);}}&.use-outer-border{", ";}.no-scrollbar{scrollbar-width:none;::-webkit-scrollbar{display:none;}}.", "{overflow-x:auto;overflow-y:hidden;background:var(--header-bgcolor);.ui-rc-table-column-title{flex:1;min-width:0;text-align:start;}.", "{font-weight:500;.ui-rc-header-trigger{padding-left:6px;display:flex;align-items:center;.ui-rc-table-column-sorter-cancel{opacity:0;}}&:hover{.ui-rc-header-trigger{.ui-rc-table-column-sorter-cancel{opacity:1;}}}.", "{width:100%;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;word-break:keep-all;}.", "{width:100%;white-space:normal;word-break:break-word;}.", "{text-align:center;}.", "{text-align:right;}}}.", "{.", "{&.", "{width:100%;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;word-break:keep-all;.expansion-cell{.expansion-content{width:100%;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;word-break:keep-all;}}}&.", "{width:100%;white-space:normal;word-break:break-word;}&.", "{text-align:center;}&.", "{text-align:right;}}.", "{background:var(--footer-bgcolor);}}.", ",.", "{overflow-x:auto;overflow-y:hidden;}&.sticky-header .", "{position:sticky;top:0;z-index:", ";}&.sticky-footer .", "{position:sticky;bottom:0;z-index:", ";}.", "{tr{td{&.lock-left,&.lock-right{border-bottom-width:0;box-shadow:0 -1px 0 0 var(--border-color),0 0px 0 0 var(--border-color),-1px 0 0 0 var(--border-color);}}}}table{width:100%;table-layout:fixed;border-collapse:separate;border-spacing:0;display:table;margin:0;padding:0;}tr:not(.no-hover):hover > td{background:var(--hover-bgcolor);color:var(--hover-color);}tr:not(.no-highlight).highlight > td{}th{font-weight:normal;text-align:left;padding:var(--cell-padding);height:var(--header-row-height);color:var(--header-color);background:var(--header-bgcolor);border:none;border-right:var(--header-cell-border-vertical);border-bottom:var(--header-cell-border-horizontal);}tr.first th{border-top:var(--header-cell-border-horizontal);}th.first{border-left:var(--header-cell-border-vertical);}td{padding:var(--cell-padding);background:var(--bgcolor);height:var(--row-height);border:none;border-right:var(--cell-border-vertical);border-bottom:var(--cell-border-horizontal);}td.first{border-left:var(--cell-border-vertical);}tr.first td{border-top:var(--cell-border-horizontal);}&.has-header tbody tr.first td{border-top:none;}&.has-footer tbody tr.last td{border-bottom:none;}&.has-footer tfoot tr > td{background:var(--footer-bgcolor);color:var(--footer-color);}&.has-footer tfoot tr:not(.no-hover):hover > td{background:var(--footer-bgcolor);}.lock-left,.lock-right{z-index:", ";}.resize-handle{width:6px;height:100%;position:absolute;top:0;right:0;cursor:col-resize;background-color:transparent;border-right:2px solid transparent;}.", "{position:absolute;top:0;bottom:0;z-index:", ";pointer-events:none;overflow:hidden;.", "{height:100%;}.", "{margin-right:", "px;box-shadow:none;&.show-shadow{box-shadow:var(--lock-shadow);border-right:var(--cell-border-vertical);}}.", "{margin-left:", "px;box-shadow:none;&.show-shadow{box-shadow:var(--lock-shadow);border-left:var(--cell-border-vertical);}}}.", "{pointer-events:none;color:#99a3b3;font-size:12px;text-align:center;position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);.empty-image{width:50px;height:50px;}.empty-tips{margin-top:16px;line-height:1.5;}}.", "{overflow:auto;position:sticky;bottom:0;z-index:", ";margin-top:-17px;}.ui-rc-grid-loading-wrapper{}.ui-rc-grid-table{}.art-loading-content-wrapper{}.", "{height:1px;visibility:hidden;}.", "{position:relative;.", "{position:absolute;inset:0;pointer-events:none;}.", "{position:sticky;z-index:", ";transform:translateY(-50%);}}"], outerBorderStyleMixin, Classes.tableHeader, Classes.tableHeaderCell, Classes.cellEllipsis, Classes.cellWrap, Classes.cellTextCenter, Classes.cellTextRight, Classes.tableBody, Classes.tableCell, Classes.cellEllipsis, Classes.cellWrap, Classes.cellTextCenter, Classes.cellTextRight, Classes.tableFooter, Classes.tableBody, Classes.tableFooter, Classes.tableHeader, Z.header, Classes.tableFooter, Z.footer, Classes.tableBody, Z.lock, Classes.lockShadowMask, Z.lockShadow, Classes.lockShadow, Classes.leftLockShadow, LOCK_SHADOW_PADDING, Classes.rightLockShadow, LOCK_SHADOW_PADDING, Classes.emptyWrapper, Classes.stickyScroll, Z.scrollItem, Classes.stickyScrollItem, Classes.loadingWrapper, Classes.loadingIndicatorWrapper, Classes.loadingIndicator, Z.loadingIndicator);
69
+ })(["box-sizing:border-box;*{box-sizing:border-box;}cursor:default;color:var(--color);font-size:var(--font-size);line-height:var(--line-height);position:relative;overflow-anchor:none;&::-webkit-scrollbar{width:8px;height:8px;}&::-webkit-scrollbar-track{background:var(--bgcolor);}&::-webkit-scrollbar-thumb{background:rgba(0,0,0,0.4);border-radius:8px;}&::-webkit-scrollbar-thumb:hover{background:#555;}&.dark{&::-webkit-scrollbar-thumb{background:rgba(255,255,255,0.3);}&::-webkit-scrollbar-thumb:hover{background:rgba(255,255,255,0.5);}}&.", "{border:var(--cell-border-vertical);&.has-footer{.", "{td{}}}}&.use-outer-border{}.no-scrollbar{scrollbar-width:none;::-webkit-scrollbar{display:none;}}.", "{overflow-x:auto;overflow-y:hidden;background:var(--header-bgcolor);.ui-rc-table-column-title{flex:1;min-width:0;text-align:start;}.", "{font-weight:500;.ui-rc-header-trigger{padding-left:6px;display:flex;align-items:center;.ui-rc-table-column-sorter-cancel{opacity:0;}}&:hover{.ui-rc-header-trigger{.ui-rc-table-column-sorter-cancel{opacity:1;}}}.", "{width:100%;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;word-break:keep-all;}.", "{width:100%;white-space:normal;word-break:break-word;}.", "{text-align:center;}.", "{text-align:right;}}}.", "{.", "{&.", "{width:100%;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;word-break:keep-all;.expansion-cell{.expansion-content{width:100%;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;word-break:keep-all;}}}&.", "{width:100%;white-space:normal;word-break:break-word;}&.", "{text-align:center;}&.", "{text-align:right;}}.", "{background:var(--footer-bgcolor);}}.", ",.", "{overflow-x:auto;overflow-y:hidden;}&.sticky-header .", "{position:sticky;top:0;z-index:", ";}&.sticky-footer .", "{position:sticky;bottom:0;z-index:", ";}.", "{tr{td{&.lock-left,&.lock-right{border-bottom-width:0;box-shadow:0 -1px 0 0 var(--border-color),0 0px 0 0 var(--border-color),-1px 0 0 0 var(--border-color);}}td.first{&.lock-left{border-bottom-width:1px;}}}}table{width:100%;table-layout:fixed;border-collapse:separate;border-spacing:0;display:table;margin:0;padding:0;}tr:not(.no-hover):hover > td{background:var(--hover-bgcolor);color:var(--hover-color);}tr:not(.no-highlight).highlight > td{}th{font-weight:normal;text-align:left;padding:var(--cell-padding);height:var(--header-row-height);color:var(--header-color);background:var(--header-bgcolor);border:none;border-right:var(--header-cell-border-vertical);border-bottom:var(--header-cell-border-horizontal);}tr.first th{}th.first{}td{padding:var(--cell-padding);background:var(--bgcolor);height:var(--row-height);border:none;border-right:var(--cell-border-vertical);border-bottom:var(--cell-border-horizontal);}td.first{}tr.first td{border-top:var(--cell-border-horizontal);}&.has-header tbody tr.first td{border-top:none;}&.has-footer tbody tr.last td{border-bottom:none;}&.has-footer tfoot tr > td{background:var(--footer-bgcolor);color:var(--footer-color);}&.has-footer tfoot tr:not(.no-hover):hover > td{background:var(--footer-bgcolor);}.lock-left,.lock-right{z-index:", ";}.resize-handle{width:6px;height:100%;position:absolute;top:0;right:0;cursor:col-resize;background-color:transparent;border-right:2px solid transparent;}.", "{position:absolute;top:0;bottom:0;z-index:", ";pointer-events:none;overflow:hidden;.", "{height:100%;}.", "{margin-right:", "px;box-shadow:none;&.show-shadow{box-shadow:var(--lock-shadow);border-right:var(--cell-border-vertical);}}.", "{margin-left:", "px;box-shadow:none;&.show-shadow{box-shadow:var(--lock-shadow);border-left:var(--cell-border-vertical);}}}.", "{pointer-events:none;color:#99a3b3;font-size:12px;text-align:center;position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);.empty-image{width:50px;height:50px;}.empty-tips{margin-top:16px;line-height:1.5;}}.", "{overflow:auto;position:sticky;bottom:0;z-index:", ";margin-top:-17px;}.ui-rc-grid-loading-wrapper{}.ui-rc-grid-table{}.art-loading-content-wrapper{display:flex;height:100%;}.", "{height:1px;visibility:hidden;}.", "{position:relative;height:100%;.", "{position:absolute;inset:0;pointer-events:none;}.", "{position:sticky;z-index:", ";transform:translateY(-50%);}}"], Classes.tableWrapper, Classes.tableFooter, Classes.tableHeader, Classes.tableHeaderCell, Classes.cellEllipsis, Classes.cellWrap, Classes.cellTextCenter, Classes.cellTextRight, Classes.tableBody, Classes.tableCell, Classes.cellEllipsis, Classes.cellWrap, Classes.cellTextCenter, Classes.cellTextRight, Classes.tableFooter, Classes.tableBody, Classes.tableFooter, Classes.tableHeader, Z.header, Classes.tableFooter, Z.footer, Classes.tableBody, Z.lock, Classes.lockShadowMask, Z.lockShadow, Classes.lockShadow, Classes.leftLockShadow, LOCK_SHADOW_PADDING, Classes.rightLockShadow, LOCK_SHADOW_PADDING, Classes.emptyWrapper, Classes.stickyScroll, Z.scrollItem, Classes.stickyScrollItem, Classes.loadingWrapper, Classes.loadingIndicatorWrapper, Classes.loadingIndicator, Z.loadingIndicator);
61
70
 
62
71
  // type StyleTableContainerProps = {
63
72
 
@@ -66,4 +75,4 @@ const StyledArtTableWrapper = exports.StyledArtTableWrapper = _styledComponents.
66
75
  const StyleTableContainer = exports.StyleTableContainer = _styledComponents.default.div.withConfig({
67
76
  displayName: "StyleTableContainer",
68
77
  componentId: "es-grid-template__sc-ipj1ht-1"
69
- })(["--color:#333;--bgcolor:white;--header-bgcolor:#ffffff;--header-hover-bgcolor:#ddd;--header-highlight-bgcolor:#e4e8ed;--cell-padding:7px 8px;--font-size:13px;--line-height:1.28571;--border-color:#dfe3e8;--cell-border:1px solid var(--border-color);--cell-border-horizontal:var(--cell-border);--cell-border-vertical:var(--cell-border);--header-cell-border:1px solid var(--border-color);--header-cell-border-horizontal:var(--header-cell-border);--header-cell-border-vertical:var(--header-cell-border);--footer-bgcolor:#fafafa;&.", "{--bgcolor:#343e59;--footer-bgcolor:#2e3342;--header-bgcolor:#343e59;--hover-bgcolor:#232b43;--header-hover-bgcolor:#606164;--highlight-bgcolor:#eff2f5;--header-highlight-bgcolor:#191a1b;--color:#dadde1;--header-color:#dadde1;--lock-shadow:rgb(37 37 37 / 0.5) 0 0 6px 2px;--border-color:#4f5266;background-color:var(--bgcolor);}&.ui-rc-grid .ui-rc-pagination{background-color:var(--bgcolor);color:var(--color);padding:10px;border-top:1px solid var(--border-color);border-bottom:1px solid var(--border-color);border-inline:1px solid var(--border-color);background-color:var(--bgcolor);.ui-rc-pagination-prev{.anticon.anticon-left{color:var(--color);}}.ui-rc-pagination-disabled{.anticon.anticon-left{color:#7d7a7a;}}.ui-rc-pagination-next{.anticon.anticon-right{color:var(--color);}&.ui-rc-pagination-disabled{.anticon.anticon-right{color:#7d7a7a;}}}}&.", "{&.ui-rc-grid{.ui-rc-toolbar-bottom{background-color:var(--footer-bgcolor);color:#ffffff;}}.ui-rc-grid-top-toolbar{border-color:var(--border-color);color:#ffffff;}.ui-rc-toolbar{.ui-rc-toolbar-selection-item{background-color:var(--footer-bgcolor);color:#ffffff;}}}"], Classes.tableThemeDark, Classes.tableThemeDark);
78
+ })(["--row-height:38px;--color:#333;--bgcolor:white;--body-hover-bgcolor:#f5f5f5;--body-hover-color:#333;--hover-bgcolor:var(--body-hover-bgcolor,#f5f5f5);--hover-color:var(--body-hover-color);--highlight-bgcolor:#eee;--header-row-height:36px;--header-color:#000000de;--header-bgcolor:#ffffff;--header-hover-bgcolor:#ddd;--header-highlight-bgcolor:#e4e8ed;--cell-padding:7px 8px;--font-size:13px;--line-height:1.28571;--lock-shadow:rgba(152,152,152,0.5) 0 0 6px 2px;--border-color:#dfe3e8;--cell-border:1px solid var(--border-color);--cell-border-horizontal:var(--cell-border);--cell-border-vertical:var(--cell-border);--header-cell-border:1px solid var(--border-color);--header-cell-border-horizontal:var(--header-cell-border);--header-cell-border-vertical:var(--header-cell-border);--footer-bgcolor:#fafafa;&.", "{--bgcolor:#343e59;--footer-bgcolor:#2e3342;--header-bgcolor:#343e59;--hover-bgcolor:#232b43;--header-hover-bgcolor:#606164;--highlight-bgcolor:#eff2f5;--header-highlight-bgcolor:#191a1b;--hover-color:#dadde1;--color:#dadde1;--header-color:#dadde1;--lock-shadow:rgb(37 37 37 / 0.5) 0 0 6px 2px;--border-color:#4f5266;background-color:var(--bgcolor);}&.use-outer-border{", ";}&.", "{.", "{border-left:0;border-right:0;td,th{border-right:0;}td.first,th.first{}td.last,th.last{}thead tr.first th,tbody tr.first td{}&.has-footer tfoot tr.last td{}&.has-footer tbody tr.last td{}&.has-footer tfoot tr td{}&:not(.has-footer) tbody tr.last td{}&:has(.", ") thead tr.first th{}}}&.", "{.", "{border-top:0;td,th{border-bottom:0;}td.lock-left{box-shadow:none;}td.first,th.first{}td.last,th.last{}thead tr.first th,tbody tr.first td{}&.has-footer tfoot tr td{border-bottom:0;border-top:0;}&.has-footer tbody tr.last td{}&.has-footer tfoot tr td{}&:not(.has-footer) tbody tr.last td{}&:has(.", ") thead tr.first th{}}}&.", "{.", "{border:0;td,th{border-right:0;border-bottom:0;}td.lock-left{box-shadow:none;}td.first,th.first{}td.last,th.last{}thead tr.first th,tbody tr.first td{}&.has-footer tfoot tr td{border-bottom:0;border-top:0;}&.has-footer tbody tr.last td{}&.has-footer tfoot tr td{}&:not(.has-footer) tbody tr.last td{}&:has(.", ") thead tr.first th{border-top:0;border:0;}}}.", "{padding:8px;}&.ui-rc-grid .ui-rc-pagination{background-color:var(--bgcolor);color:var(--color);padding:10px;background-color:var(--bgcolor);.ui-rc-pagination-prev{.anticon.anticon-left{color:var(--color);}}.ui-rc-pagination-disabled{.anticon.anticon-left{color:#7d7a7a;}}.ui-rc-pagination-next{.anticon.anticon-right{color:var(--color);}&.ui-rc-pagination-disabled{.anticon.anticon-right{color:#7d7a7a;}}}}&.", "{&.ui-rc-grid{.ui-rc-toolbar-bottom{background-color:var(--footer-bgcolor);color:#ffffff;}}.ui-rc-grid-top-toolbar{border-color:var(--border-color);color:#ffffff;}.ui-rc-toolbar{.ui-rc-toolbar-selection-item{background-color:var(--footer-bgcolor);color:#ffffff;}}}"], Classes.tableThemeDark, outerBorderStyleMixin, Classes.gridHorizontal, Classes.tableWrapper, Classes.tableTop, Classes.gridVertical, Classes.tableWrapper, Classes.tableTop, Classes.gridNone, Classes.tableWrapper, Classes.tableTop, Classes.tableTop, Classes.tableThemeDark);
@@ -357,7 +357,7 @@ class BaseTable extends _react.default.Component {
357
357
  footerDataSource,
358
358
  components
359
359
  } = this.props;
360
- const artTableWrapperClassName = (0, _classnames.default)(_styles.Classes.artTableWrapper, {
360
+ const artTableWrapperClassName = (0, _classnames.default)(_styles.Classes.tableWrapper, {
361
361
  'use-outer-border': useOuterBorder,
362
362
  empty: dataSource.length === 0,
363
363
  lock: info.hasLockColumn,
@@ -433,7 +433,6 @@ function isRowChecked(key, selectedKeys, treeIndex, checkedStrategy, isDisabledF
433
433
  // =========================
434
434
  if (checkedStrategy === 'parent') {
435
435
  // node disable => chỉ true nếu explicit chọn
436
- // console.log('isDisabled', isDisabled)
437
436
  if (isDisabled) {
438
437
  const abc = selectedKeys.has(key);
439
438
  return abc;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "es-grid-template",
3
- "version": "1.9.49",
3
+ "version": "1.9.50",
4
4
  "description": "es-grid-template",
5
5
  "keywords": [
6
6
  "react",