@kdcloudjs/table 1.2.0-canary.14 → 1.2.0-canary.15

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 (11) hide show
  1. package/dist/@kdcloudjs/table.css +1 -1
  2. package/dist/@kdcloudjs/table.js +52 -33
  3. package/dist/@kdcloudjs/table.js.map +1 -1
  4. package/dist/@kdcloudjs/table.min.css +1 -1
  5. package/dist/@kdcloudjs/table.min.js +2 -2
  6. package/dist/@kdcloudjs/table.min.js.map +1 -1
  7. package/es/table/base/table.d.ts +1 -0
  8. package/es/table/base/table.js +45 -26
  9. package/lib/table/base/table.d.ts +1 -0
  10. package/lib/table/base/table.js +45 -26
  11. package/package.json +1 -1
package/es/table/base/table.d.ts CHANGED
@@ -154,6 +154,7 @@ export declare class BaseTable extends React.Component<BaseTableProps, BaseTable
154
154
  private renderLockShadows;
155
155
  private renderStickyScroll;
156
156
  private getScrollBarWidth;
157
+ private getStickyScrollContainerStyle;
157
158
  render(): JSX.Element;
158
159
  componentDidMount(): void;
159
160
  componentDidUpdate(prevProps: Readonly<BaseTableProps>, prevState: Readonly<BaseTableState>): void;
package/es/table/base/table.js CHANGED
@@ -434,18 +434,21 @@ export var BaseTable = /*#__PURE__*/function (_React$Component) {
434
434
  hasStickyScroll = _this$props5.hasStickyScroll,
435
435
  stickyBottom = _this$props5.stickyBottom;
436
436
  var hasScroll = this.state.hasScroll;
437
+ var isScroll = hasStickyScroll && hasScroll;
438
+ var stickyScrollContainerStyle = this.getStickyScrollContainerStyle();
437
439
  return /*#__PURE__*/React.createElement("div", {
438
- className: cx(Classes.horizontalScrollContainer, Classes.horizontalStickyScrollContainer)
440
+ className: cx(Classes.horizontalScrollContainer, Classes.horizontalStickyScrollContainer),
441
+ style: stickyScrollContainerStyle
439
442
  }, /*#__PURE__*/React.createElement("div", {
440
443
  className: cx(Classes.horizontalScrollLeftSpacer),
441
444
  style: {
442
445
  width: info.leftLockTotalWidth,
443
- display: hasStickyScroll && hasScroll ? 'block' : 'none'
446
+ display: isScroll ? 'block' : 'none'
444
447
  }
445
448
  }), /*#__PURE__*/React.createElement("div", {
446
449
  className: cx(Classes.stickyScroll),
447
450
  style: {
448
- display: hasStickyScroll && hasScroll ? 'block' : 'none',
451
+ display: isScroll ? 'block' : 'none',
449
452
  bottom: stickyBottom
450
453
  }
451
454
  }, /*#__PURE__*/React.createElement("div", {
@@ -454,7 +457,7 @@ export var BaseTable = /*#__PURE__*/function (_React$Component) {
454
457
  className: cx(Classes.horizontalScrollRightSpacer),
455
458
  style: {
456
459
  width: info.rightLockTotalWidth,
457
- display: hasStickyScroll && hasScroll ? 'block' : 'none'
460
+ display: isScroll ? 'block' : 'none'
458
461
  }
459
462
  }));
460
463
  }
@@ -463,6 +466,22 @@ export var BaseTable = /*#__PURE__*/function (_React$Component) {
463
466
  value: function getScrollBarWidth() {
464
467
  return this.props.scrollbarWidth || getScrollbarSize().width;
465
468
  }
469
+ }, {
470
+ key: "getStickyScrollContainerStyle",
471
+ value: function getStickyScrollContainerStyle() {
472
+ var _this$props6 = this.props,
473
+ hasStickyScroll = _this$props6.hasStickyScroll,
474
+ stickyScrollHeight = _this$props6.stickyScrollHeight;
475
+ var hasScroll = this.state.hasScroll;
476
+ var isScroll = hasStickyScroll && hasScroll;
477
+ var height = stickyScrollHeight === 'auto' ? this.getScrollBarWidth() : stickyScrollHeight;
478
+ var stickyHeight = isScroll ? height : 0;
479
+ return {
480
+ height: stickyHeight,
481
+ maxHeight: stickyHeight,
482
+ minHeight: stickyHeight
483
+ };
484
+ }
466
485
  }, {
467
486
  key: "render",
468
487
  value: function render() {
@@ -471,20 +490,20 @@ export var BaseTable = /*#__PURE__*/function (_React$Component) {
471
490
  // console.log('render table')
472
491
  var info = calculateRenderInfo(this);
473
492
  this.lastInfo = info;
474
- var _this$props6 = this.props,
475
- dataSource = _this$props6.dataSource,
476
- className = _this$props6.className,
477
- style = _this$props6.style,
478
- hasHeader = _this$props6.hasHeader,
479
- useOuterBorder = _this$props6.useOuterBorder,
480
- isStickyHead = _this$props6.isStickyHead,
481
- isStickyHeader = _this$props6.isStickyHeader,
482
- isStickyFooter = _this$props6.isStickyFooter,
483
- isLoading = _this$props6.isLoading,
484
- getTableProps = _this$props6.getTableProps,
485
- footerDataSource = _this$props6.footerDataSource,
486
- components = _this$props6.components,
487
- bordered = _this$props6.bordered;
493
+ var _this$props7 = this.props,
494
+ dataSource = _this$props7.dataSource,
495
+ className = _this$props7.className,
496
+ style = _this$props7.style,
497
+ hasHeader = _this$props7.hasHeader,
498
+ useOuterBorder = _this$props7.useOuterBorder,
499
+ isStickyHead = _this$props7.isStickyHead,
500
+ isStickyHeader = _this$props7.isStickyHeader,
501
+ isStickyFooter = _this$props7.isStickyFooter,
502
+ isLoading = _this$props7.isLoading,
503
+ getTableProps = _this$props7.getTableProps,
504
+ footerDataSource = _this$props7.footerDataSource,
505
+ components = _this$props7.components,
506
+ bordered = _this$props7.bordered;
488
507
  var artTableWrapperClassName = cx(Classes.artTableWrapper, (_cx = {
489
508
  'use-outer-border': useOuterBorder,
490
509
  empty: dataSource.length === 0,
@@ -521,10 +540,10 @@ export var BaseTable = /*#__PURE__*/function (_React$Component) {
521
540
  this.initSubscriptions();
522
541
  this.didMountOrUpdate(); // console.log('did mount end')
523
542
 
524
- var _this$props7 = this.props,
525
- cssVariables = _this$props7.cssVariables,
526
- enableCSSVariables = _this$props7.enableCSSVariables,
527
- bordered = _this$props7.bordered;
543
+ var _this$props8 = this.props,
544
+ cssVariables = _this$props8.cssVariables,
545
+ enableCSSVariables = _this$props8.enableCSSVariables,
546
+ bordered = _this$props8.bordered;
528
547
  cssPolifill({
529
548
  variables: cssVariables || {},
530
549
  enableCSSVariables: enableCSSVariables,
@@ -540,10 +559,10 @@ export var BaseTable = /*#__PURE__*/function (_React$Component) {
540
559
  var _a; // console.log('did update start')
541
560
 
542
561
 
543
- var _this$props8 = this.props,
544
- cssVariables = _this$props8.cssVariables,
545
- enableCSSVariables = _this$props8.enableCSSVariables,
546
- bordered = _this$props8.bordered;
562
+ var _this$props9 = this.props,
563
+ cssVariables = _this$props9.cssVariables,
564
+ enableCSSVariables = _this$props9.enableCSSVariables,
565
+ bordered = _this$props9.bordered;
547
566
 
548
567
  if (!shallowEqual(prevProps === null || prevProps === void 0 ? void 0 : prevProps.cssVariables, (_a = this.props) === null || _a === void 0 ? void 0 : _a.cssVariables)) {
549
568
  cssPolifill({
package/lib/table/base/table.d.ts CHANGED
@@ -154,6 +154,7 @@ export declare class BaseTable extends React.Component<BaseTableProps, BaseTable
154
154
  private renderLockShadows;
155
155
  private renderStickyScroll;
156
156
  private getScrollBarWidth;
157
+ private getStickyScrollContainerStyle;
157
158
  render(): JSX.Element;
158
159
  componentDidMount(): void;
159
160
  componentDidUpdate(prevProps: Readonly<BaseTableProps>, prevState: Readonly<BaseTableState>): void;
package/lib/table/base/table.js CHANGED
@@ -483,18 +483,21 @@ var BaseTable = /*#__PURE__*/function (_React$Component) {
483
483
  hasStickyScroll = _this$props5.hasStickyScroll,
484
484
  stickyBottom = _this$props5.stickyBottom;
485
485
  var hasScroll = this.state.hasScroll;
486
+ var isScroll = hasStickyScroll && hasScroll;
487
+ var stickyScrollContainerStyle = this.getStickyScrollContainerStyle();
486
488
  return /*#__PURE__*/_react.default.createElement("div", {
487
- className: (0, _classnames.default)(_styles.Classes.horizontalScrollContainer, _styles.Classes.horizontalStickyScrollContainer)
489
+ className: (0, _classnames.default)(_styles.Classes.horizontalScrollContainer, _styles.Classes.horizontalStickyScrollContainer),
490
+ style: stickyScrollContainerStyle
488
491
  }, /*#__PURE__*/_react.default.createElement("div", {
489
492
  className: (0, _classnames.default)(_styles.Classes.horizontalScrollLeftSpacer),
490
493
  style: {
491
494
  width: info.leftLockTotalWidth,
492
- display: hasStickyScroll && hasScroll ? 'block' : 'none'
495
+ display: isScroll ? 'block' : 'none'
493
496
  }
494
497
  }), /*#__PURE__*/_react.default.createElement("div", {
495
498
  className: (0, _classnames.default)(_styles.Classes.stickyScroll),
496
499
  style: {
497
- display: hasStickyScroll && hasScroll ? 'block' : 'none',
500
+ display: isScroll ? 'block' : 'none',
498
501
  bottom: stickyBottom
499
502
  }
500
503
  }, /*#__PURE__*/_react.default.createElement("div", {
@@ -503,7 +506,7 @@ var BaseTable = /*#__PURE__*/function (_React$Component) {
503
506
  className: (0, _classnames.default)(_styles.Classes.horizontalScrollRightSpacer),
504
507
  style: {
505
508
  width: info.rightLockTotalWidth,
506
- display: hasStickyScroll && hasScroll ? 'block' : 'none'
509
+ display: isScroll ? 'block' : 'none'
507
510
  }
508
511
  }));
509
512
  }
@@ -512,6 +515,22 @@ var BaseTable = /*#__PURE__*/function (_React$Component) {
512
515
  value: function getScrollBarWidth() {
513
516
  return this.props.scrollbarWidth || (0, _utils.getScrollbarSize)().width;
514
517
  }
518
+ }, {
519
+ key: "getStickyScrollContainerStyle",
520
+ value: function getStickyScrollContainerStyle() {
521
+ var _this$props6 = this.props,
522
+ hasStickyScroll = _this$props6.hasStickyScroll,
523
+ stickyScrollHeight = _this$props6.stickyScrollHeight;
524
+ var hasScroll = this.state.hasScroll;
525
+ var isScroll = hasStickyScroll && hasScroll;
526
+ var height = stickyScrollHeight === 'auto' ? this.getScrollBarWidth() : stickyScrollHeight;
527
+ var stickyHeight = isScroll ? height : 0;
528
+ return {
529
+ height: stickyHeight,
530
+ maxHeight: stickyHeight,
531
+ minHeight: stickyHeight
532
+ };
533
+ }
515
534
  }, {
516
535
  key: "render",
517
536
  value: function render() {
@@ -520,20 +539,20 @@ var BaseTable = /*#__PURE__*/function (_React$Component) {
520
539
  // console.log('render table')
521
540
  var info = (0, _calculations.calculateRenderInfo)(this);
522
541
  this.lastInfo = info;
523
- var _this$props6 = this.props,
524
- dataSource = _this$props6.dataSource,
525
- className = _this$props6.className,
526
- style = _this$props6.style,
527
- hasHeader = _this$props6.hasHeader,
528
- useOuterBorder = _this$props6.useOuterBorder,
529
- isStickyHead = _this$props6.isStickyHead,
530
- isStickyHeader = _this$props6.isStickyHeader,
531
- isStickyFooter = _this$props6.isStickyFooter,
532
- isLoading = _this$props6.isLoading,
533
- getTableProps = _this$props6.getTableProps,
534
- footerDataSource = _this$props6.footerDataSource,
535
- components = _this$props6.components,
536
- bordered = _this$props6.bordered;
542
+ var _this$props7 = this.props,
543
+ dataSource = _this$props7.dataSource,
544
+ className = _this$props7.className,
545
+ style = _this$props7.style,
546
+ hasHeader = _this$props7.hasHeader,
547
+ useOuterBorder = _this$props7.useOuterBorder,
548
+ isStickyHead = _this$props7.isStickyHead,
549
+ isStickyHeader = _this$props7.isStickyHeader,
550
+ isStickyFooter = _this$props7.isStickyFooter,
551
+ isLoading = _this$props7.isLoading,
552
+ getTableProps = _this$props7.getTableProps,
553
+ footerDataSource = _this$props7.footerDataSource,
554
+ components = _this$props7.components,
555
+ bordered = _this$props7.bordered;
537
556
  var artTableWrapperClassName = (0, _classnames.default)(_styles.Classes.artTableWrapper, (_cx = {
538
557
  'use-outer-border': useOuterBorder,
539
558
  empty: dataSource.length === 0,
@@ -568,10 +587,10 @@ var BaseTable = /*#__PURE__*/function (_React$Component) {
568
587
  this.initSubscriptions();
569
588
  this.didMountOrUpdate(); // console.log('did mount end')
570
589
 
571
- var _this$props7 = this.props,
572
- cssVariables = _this$props7.cssVariables,
573
- enableCSSVariables = _this$props7.enableCSSVariables,
574
- bordered = _this$props7.bordered;
590
+ var _this$props8 = this.props,
591
+ cssVariables = _this$props8.cssVariables,
592
+ enableCSSVariables = _this$props8.enableCSSVariables,
593
+ bordered = _this$props8.bordered;
575
594
  (0, _utils.cssPolifill)({
576
595
  variables: cssVariables || {},
577
596
  enableCSSVariables: enableCSSVariables,
@@ -587,10 +606,10 @@ var BaseTable = /*#__PURE__*/function (_React$Component) {
587
606
  var _a; // console.log('did update start')
588
607
 
589
608
 
590
- var _this$props8 = this.props,
591
- cssVariables = _this$props8.cssVariables,
592
- enableCSSVariables = _this$props8.enableCSSVariables,
593
- bordered = _this$props8.bordered;
609
+ var _this$props9 = this.props,
610
+ cssVariables = _this$props9.cssVariables,
611
+ enableCSSVariables = _this$props9.enableCSSVariables,
612
+ bordered = _this$props9.bordered;
594
613
 
595
614
  if (!(0, _utils.shallowEqual)(prevProps === null || prevProps === void 0 ? void 0 : prevProps.cssVariables, (_a = this.props) === null || _a === void 0 ? void 0 : _a.cssVariables)) {
596
615
  (0, _utils.cssPolifill)({
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@kdcloudjs/table",
3
- "version": "1.2.0-canary.14",
3
+ "version": "1.2.0-canary.15",
4
4
  "description": "金蝶 react table 组件",
5
5
  "title": "table",
6
6
  "keywords": [