@kdcloudjs/table 1.2.1-canary.6 → 1.2.1-canary.7-hotfix.1

package/es/table/pipeline/features/columnResizeWidth.js

@@ -1,8 +1,6 @@
 import _extends from "@babel/runtime-corejs3/helpers/extends";
 import _taggedTemplateLiteral from "@babel/runtime-corejs3/helpers/taggedTemplateLiteral";
-
 var _templateObject, _templateObject2;
-
 import _Set from "@babel/runtime-corejs3/core-js-stable/set";
 import _Object$keys from "@babel/runtime-corejs3/core-js-stable/object/keys";
 import _mapInstanceProperty from "@babel/runtime-corejs3/core-js-stable/instance/map";
@@ -17,36 +15,29 @@ var TableHeaderCellResize = styled.div(_templateObject || (_templateObject = _ta
 var TableHeaderGroupCellResize = styled(function (props) {
   return /*#__PURE__*/React.createElement(TableHeaderCellResize, _extends({}, props));
 })(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n  &:after {\n    height: 100%;\n    top: 0;\n  }\n"])));
-
 function clamp(min, x, max) {
   return Math.max(min, Math.min(max, x));
 }
-
 function disableSelect(event) {
   event.preventDefault();
 }
-
 var stateKey = 'columnResize';
 export var COLUMN_SIZE_KEY = 'columnResize';
 export var RESIZED_COLUMN_KEY = 'resizedColumn';
 export var LAST_RESIZED_COLUMN_KEY = 'lastResizedColumn';
 export function columnResize() {
   var opts = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
-
   var _a, _b, _c;
-
   var minSize = (_a = opts.minSize) !== null && _a !== void 0 ? _a : 60;
   var fallbackSize = (_b = opts.fallbackSize) !== null && _b !== void 0 ? _b : 150;
   var maxSize = (_c = opts.maxSize) !== null && _c !== void 0 ? _c : 1000;
   return function columnResizeFeature(pipeline) {
     var _a, _b;
-
     var columnSize = (_b = (_a = opts.columnSize) !== null && _a !== void 0 ? _a : pipeline.getStateAtKey(stateKey)) !== null && _b !== void 0 ? _b : {};
     var leafColumns = collectNodes(pipeline.getColumns(), 'leaf-only');
     leafColumns.forEach(function (_ref) {
       var code = _ref.code,
-          width = _ref.width;
-
+        width = _ref.width;
       if (columnSize[code] === undefined) {
         if (typeof width === 'number') {
           columnSize[code] = width;
@@ -54,36 +45,31 @@ export function columnResize() {
           columnSize[code] = fallbackSize;
         }
       }
-    }); // 实时存储一份最新的columnSize，与autoFill共用一份数据
+    });
+    // 实时存储一份最新的columnSize，与autoFill共用一份数据
     // 存在state里可能存到取不到最新的
-
     pipeline.setFeatureOptions(COLUMN_SIZE_KEY, columnSize);
-
     var onChangeSize = function onChangeSize(nextColumnSize) {
       window.requestAnimationFrame(function () {
         var _a;
-
         pipeline.setStateAtKey(stateKey, nextColumnSize);
         (_a = opts === null || opts === void 0 ? void 0 : opts.onChangeSize) === null || _a === void 0 ? void 0 : _a.call(opts, nextColumnSize);
       });
     };
-
     var handleDoubleClick = function handleDoubleClick(e, col) {
       var _a;
-
       (_a = opts.doubleClickCallback) === null || _a === void 0 ? void 0 : _a.call(opts, e, col);
     };
-
     var handleMouseDown = function handleMouseDown(e, col) {
       window.addEventListener('selectstart', disableSelect);
       var changedColumnSize = {};
       var startX = e.clientX;
       var children = col.children,
-          code = col.code,
-          _col$features = col.features,
-          features = _col$features === void 0 ? {} : _col$features;
+        code = col.code,
+        _col$features = col.features,
+        features = _col$features === void 0 ? {} : _col$features;
       var minWidth = features.minWidth,
-          maxWidth = features.maxWidth;
+        maxWidth = features.maxWidth;
       var realMinSize = typeof minWidth === 'number' ? minWidth : minSize;
       var realMaxSize = typeof maxWidth === 'number' ? maxWidth : maxSize;
       var columnSize = pipeline.getFeatureOptions(COLUMN_SIZE_KEY);
@@ -91,12 +77,9 @@ export function columnResize() {
       e.stopPropagation();
       var nextSize$ = fromEvent(window, 'mousemove').pipe(op.takeUntil(fromEvent(window, 'mouseup')), op.map(function (e) {
         var movingX = e.clientX;
-
         var nextColumnSize = _extends({}, columnSize);
-
         var deltaSum = movingX - startX;
         var deltaRemaining = deltaSum;
-
         if ((children === null || children === void 0 ? void 0 : children.length) > 0) {
           var leafChildColumns = collectNodes(children, 'leaf-only');
           var childrenWidthSum = leafChildColumns.reduce(function (sum, _ref2) {
@@ -107,7 +90,6 @@ export function columnResize() {
             var code = _ref3.code;
             var startSize = columnSize[code];
             var currentDeltaWidth = Math.round(deltaSum * startSize / childrenWidthSum);
-
             if (index < leafChildColumns.length - 1) {
               nextColumnSize[code] = clamp(realMinSize, startSize + currentDeltaWidth, realMaxSize);
               changedColumnSize[code] = nextColumnSize[code];
@@ -122,51 +104,43 @@ export function columnResize() {
           nextColumnSize[code] = clamp(realMinSize, startSize + deltaSum, realMaxSize);
           changedColumnSize[code] = nextColumnSize[code];
         }
-
         recordColumnSize = nextColumnSize;
         return nextColumnSize;
       }));
       nextSize$.subscribe({
         next: function next(nextColumnSize) {
-          onChangeSize(nextColumnSize); // 由于COLUMN_RESIZE_KEY记录的是全量的列宽，此处记录被改变过的列宽
-
+          onChangeSize(nextColumnSize);
+          // 由于COLUMN_RESIZE_KEY记录的是全量的列宽，此处记录被改变过的列宽
           var resizedColumnSet = pipeline.getFeatureOptions(RESIZED_COLUMN_KEY) || new _Set();
-
           _Object$keys(changedColumnSize).forEach(function (code) {
             resizedColumnSet.add(code, changedColumnSize[code]);
           });
-
           pipeline.setFeatureOptions(RESIZED_COLUMN_KEY, resizedColumnSet);
           pipeline.setFeatureOptions(LAST_RESIZED_COLUMN_KEY, code);
         },
         complete: function complete() {
           var _context;
-
           var changedColumnSizes = _mapInstanceProperty(_context = _Object$keys(changedColumnSize)).call(_context, function (code) {
             return {
               code: code,
               width: changedColumnSize[code]
             };
           });
-
           window.requestAnimationFrame(function () {
             var _a;
-
             (_a = opts === null || opts === void 0 ? void 0 : opts.afterChangeSize) === null || _a === void 0 ? void 0 : _a.call(opts, recordColumnSize, changedColumnSizes);
           });
           window.removeEventListener('selectstart', disableSelect);
         }
       });
     };
-
     var isGroup = isGroupColumn(pipeline.getColumns());
     return pipeline.mapColumns(makeRecursiveMapper(function (col) {
       var _a;
-
       var prevTitle = internals.safeRenderHeader(col);
       var code = col.code,
-          features = col.features,
-          width = col.width;
+        features = col.features,
+        width = col.width;
       return _extends(_extends({}, col), {
         width: (_a = columnSize[code]) !== null && _a !== void 0 ? _a : width,
         title: /*#__PURE__*/React.createElement(React.Fragment, null, prevTitle, (features === null || features === void 0 ? void 0 : features.resizeable) !== false && (isGroup ? /*#__PURE__*/React.createElement(TableHeaderGroupCellResize, {

package/es/table/pipeline/features/contextMenu.js

@@ -17,26 +17,22 @@ export function contextMenu() {
     var popupParent = opts.popupParent || document.body;
     var menuClassName = opts.menuClassName;
     var menuHelper = new MenuHelper();
-
     var addPopup = function addPopup(menu) {
       var ePopupDiv = document.createElement('div');
       ePopupDiv.setAttribute('class', 'kd-table-popup');
       popupParent.appendChild(ePopupDiv);
       var popupHidden = false;
       var eventList = ['mousedown', 'contextmenu'];
-
       var hidePopup = function hidePopup(event) {
         if (isEventFromCurrentPopup(event, ePopupDiv) || popupHidden) {
           return;
         }
-
         popupHidden = true;
         popupParent.removeChild(ePopupDiv);
         eventList.forEach(function (eventType) {
           window.removeEventListener(eventType, hidePopup, true);
         });
       };
-
       ReactDOM.render(menu, ePopupDiv, function () {
         setTimeout(function () {
           eventList.forEach(function (eventType) {
@@ -46,7 +42,6 @@ export function contextMenu() {
       });
       return hidePopup;
     };
-
     var onContextMenu = function onContextMenu(e) {
       if (canShowContextMenu(e, pipeline)) {
         e.preventDefault();
@@ -54,18 +49,14 @@ export function contextMenu() {
         showContextMenu(e);
       }
     };
-
     pipeline.addTableProps({
       onContextMenu: onContextMenu
     });
-
     var getContextMenuOptions = function getContextMenuOptions(record, column, value, event) {
       var defaultMenuOptions = [];
-
       if (column) {
         defaultMenuOptions.push(getCopyItem(value));
       }
-
       if (opts.getContextMenuItems) {
         var params = {
           record: record,
@@ -75,25 +66,20 @@ export function contextMenu() {
         };
         return opts.getContextMenuItems(params);
       }
-
       return defaultMenuOptions;
     };
-
     var hideContextMenu = function hideContextMenu() {
       menuHelper.destroy();
     };
-
     var getPopupParent = function getPopupParent() {
       return popupParent;
     };
-
     var showContextMenu = function showContextMenu(e) {
       var path = getEventPath(e);
       var cellEle = getCellEleInEventPath(path);
       var code;
       var rowIndex;
       var isInFooter;
-
       if (cellEle) {
         code = cellEle.getAttribute('data-code');
         rowIndex = cellEle.getAttribute('data-rowindex');
@@ -103,7 +89,6 @@ export function contextMenu() {
         rowIndex = rowEle === null || rowEle === void 0 ? void 0 : rowEle.getAttribute('data-rowindex');
         isInFooter = isElementInsideTheFooter(rowEle);
       }
-
       var dataSource = isInFooter ? pipeline.getFooterDataSource() || [] : pipeline.getDataSource();
       var record = dataSource[rowIndex];
       var column = code !== undefined && findByTree(pipeline.getColumns(), function (item) {
@@ -111,12 +96,10 @@ export function contextMenu() {
       });
       var value = column && record && internals.safeGetValue(column, record, rowIndex);
       var options = getContextMenuOptions(record, column, value, e);
-
       if (options.length === 0) {
         console.warn('context menu options is empty');
         return;
       }
-
       var position = positionForMenu(e, popupParent);
       var menu = /*#__PURE__*/React.createElement(Menu, {
         options: options,
@@ -125,54 +108,42 @@ export function contextMenu() {
         getPopupParent: getPopupParent,
         className: menuClassName
       });
-
       var _hidePopup = addPopup(menu);
-
       menuHelper.init(_hidePopup);
     };
-
     return pipeline;
   };
 }
-
 function getMenuItemKey(_ref) {
   var name = _ref.name,
-      index = _ref.index;
-
+    index = _ref.index;
   if (name) {
     var _context;
-
     var _key = 0;
     name = name + '';
-
     for (var i = 0; i < name.length; i++) {
       _key += name.charCodeAt(name[i]);
     }
-
     return _concatInstanceProperty(_context = "".concat(_key, "_")).call(_context, index);
   }
-
   return index;
 }
-
 function Menu(props) {
   var className = props.className,
-      _props$options = props.options,
-      options = _props$options === void 0 ? [] : _props$options,
-      hideContextMenu = props.hideContextMenu,
-      position = props.position,
-      getPopupParent = props.getPopupParent;
+    _props$options = props.options,
+    options = _props$options === void 0 ? [] : _props$options,
+    hideContextMenu = props.hideContextMenu,
+    position = props.position,
+    getPopupParent = props.getPopupParent;
   var menuRef = useRef();
   useEffect(function () {
     if (menuRef.current) {
       var popupParent = getPopupParent();
       var x = position.x,
-          y = position.y;
-
+        y = position.y;
       var _keepWithinBounds = keepWithinBounds(popupParent, menuRef.current, x, y),
-          _x = _keepWithinBounds.x,
-          _y = _keepWithinBounds.y;
-
+        _x = _keepWithinBounds.x,
+        _y = _keepWithinBounds.y;
       menuRef.current.style.left = _x + 'px';
       menuRef.current.style.top = _y + 'px';
     }
@@ -200,50 +171,40 @@ function Menu(props) {
     });
   })));
 }
-
 function MenuItem(props) {
   var name = props.name,
-      action = props.action,
-      className = props.className,
-      disabled = props.disabled,
-      hideContextMenu = props.hideContextMenu;
+    action = props.action,
+    className = props.className,
+    disabled = props.disabled,
+    hideContextMenu = props.hideContextMenu;
   var itemRef = useRef();
-
   var handleClick = function handleClick() {
     if (disabled) {
       return;
     }
-
     hideContextMenu();
     typeof action === 'function' && action();
   };
-
   var handleMouseEnter = function handleMouseEnter(e) {
     if (disabled) {
       return;
     }
-
     var itemDom = itemRef.current;
-
     if (itemDom) {
       itemDom.classList.add(MenuClasses.menuOptionActive);
     }
   };
-
   var handleMouseLeave = function handleMouseLeave(e) {
     if (disabled) {
       return;
     }
-
     var itemDom = itemRef.current;
-
     if (itemDom) {
       setTimeout(function () {
         itemDom.classList.remove(MenuClasses.menuOptionActive);
       }, 10);
     }
   };
-
   return /*#__PURE__*/React.createElement("div", {
     className: cx(MenuClasses.menuOption, className, _defineProperty({}, MenuClasses.menuOptionDisable, disabled)),
     ref: itemRef,
@@ -254,40 +215,29 @@ function MenuItem(props) {
     className: MenuClasses.menuOptionText
   }, name));
 }
-
 var MenuHelper = /*#__PURE__*/_createClass(function MenuHelper() {
   var _this = this;
-
   _classCallCheck(this, MenuHelper);
-
   this.init = function (hidePopup) {
     _this.hidePopup = hidePopup;
   };
-
   this.destroy = function () {
     _this.hidePopup && _this.hidePopup();
     _this.hidePopup = null;
   };
 });
 /** 是否点击是外部 start */
-
-
 function isEventFromCurrentPopup(event, ele) {
   if (!event || !ele) {
     return false;
   }
-
   if (isElementInEventPath(ele, event)) {
     return true;
   }
-
   return false;
 }
 /** 是否点击是外部 end */
-
 /** 计算位置 start */
-
-
 function calculatePointerRelative(event, popupParent) {
   var parentRect = popupParent.getBoundingClientRect();
   var documentRect = document.documentElement.getBoundingClientRect();
@@ -296,31 +246,25 @@ function calculatePointerRelative(event, popupParent) {
     y: event.clientY - (popupParent === document.body ? documentRect.top : parentRect.top)
   };
 }
-
 function positionForMenu(event, popupParent, params) {
   var _calculatePointerRela = calculatePointerRelative(event, popupParent),
-      x = _calculatePointerRela.x,
-      y = _calculatePointerRela.y;
-
+    x = _calculatePointerRela.x,
+    y = _calculatePointerRela.y;
   if (params) {
     var offsetX = params.offsetX,
-        offsetY = params.offsetY;
-
+      offsetY = params.offsetY;
     if (offsetX) {
       x -= offsetX;
     }
-
     if (offsetY) {
       y -= offsetY;
     }
   }
-
   return {
     x: x,
     y: y
   };
 }
-
 function keepWithinBounds(popupParent, ePopup, x, y) {
   var parentRect = popupParent.getBoundingClientRect();
   var docElement = document.documentElement;
@@ -328,14 +272,12 @@ function keepWithinBounds(popupParent, ePopup, x, y) {
   var ePopupRect = ePopup.getBoundingClientRect();
   var parentWidth = parentRect.width;
   var parentHeight = parentRect.height;
-
   if (popupParent === document.body) {
     parentWidth = documentRect.width;
     parentWidth -= Math.abs(documentRect.left - parentRect.left);
     parentHeight = documentRect.height + docElement.scrollTop;
     parentHeight -= Math.abs(documentRect.top - parentRect.top);
   }
-
   if (x) {
     var minWidth = Math.min(ePopupRect.width, 120);
     ePopup.style.minWidth = minWidth + 'px';
@@ -354,49 +296,36 @@ function keepWithinBounds(popupParent, ePopup, x, y) {
   };
 }
 /** 计算位置 end */
-
 /** 获得点击的元素 start */
-
-
 function getCellEleInEventPath(path) {
   return getTargetEleInEventPath(path, function (ele) {
     return ele && ele.getAttribute('data-role') === 'table-cell';
   });
 }
-
 function getRowEleInEventPath(path) {
   return getTargetEleInEventPath(path, function (ele) {
     return ele && ele.getAttribute('data-role') === 'table-row';
   });
 }
 /** 获得点击的元素 end */
-
-
 function isElementInsideTheFooter(ele) {
   var pointer = ele;
-
   while (pointer) {
     if (pointer.tagName === 'TFOOT') {
       return true;
     }
-
     if (pointer.tagName === 'TABLE' || pointer.tagName === 'TBODY') {
       return false;
     }
-
     pointer = pointer.parentElement;
   }
-
   return false;
 }
-
 function canShowContextMenu(e, pipeline) {
   var _a, _b;
-
   return ((_a = pipeline.ref.current.domHelper) === null || _a === void 0 ? void 0 : _a.tableBody.contains(e.target)) || ((_b = pipeline.ref.current.domHelper) === null || _b === void 0 ? void 0 : _b.tableFooter.contains(e.target));
-} // 默认选项
-
-
+}
+// 默认选项
 function getCopyItem(v) {
   return {
     name: '复制',

package/es/table/pipeline/features/filter/DefaultFilterContent.js

@@ -1,9 +1,7 @@
 import _defineProperty from "@babel/runtime-corejs3/helpers/defineProperty";
 import _slicedToArray from "@babel/runtime-corejs3/helpers/slicedToArray";
 import _taggedTemplateLiteral from "@babel/runtime-corejs3/helpers/taggedTemplateLiteral";
-
 var _templateObject;
-
 import _filterInstanceProperty from "@babel/runtime-corejs3/core-js-stable/instance/filter";
 import _mapInstanceProperty from "@babel/runtime-corejs3/core-js-stable/instance/map";
 import React, { useEffect, useRef } from 'react';
@@ -13,38 +11,30 @@ import { DEFAULT_FILTER_OPTIONS } from './util';
 import { Classes, ButtonCSS } from '../../../base/styles';
 import KeyCode from '../../../utils/keyCode';
 var DefaultFilterContentStyle = styled.div(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  display: flex;\n  flex-direction: column;\n  background-color: #ffffff;\n  border-radius: 2px;\n  width: 100%;\n\n  ", "\n  .filter-option-list {\n    display: flex;\n    flex-direction: column;\n    margin-top: 8px;\n    ul {\n      margin: 0;\n      padding: 0;\n      li {\n        display: flex;\n        position: relative;\n        flex-shrink: 0;\n        height: 32px;\n        align-items: center;\n        border-radius: 2px;\n        font-size: 12px;\n        color: var(--color);\n        padding: 0 12px;\n        overflow: hidden;\n        cursor: pointer;\n        &:hover{\n          background-color: var(--primary-color-level1);\n        }\n      }\n      li.active{\n        background-color: var(--primary-color-level1);\n      }\n    }\n  }\n\n  .filter-search {\n    display: flex;\n    padding: 6px 12px;\n\n    .filter-search-inner {\n      width: 100%;\n      font-size: 12px;\n      color: #333333;\n      height: 28px;\n      line-height: 28px;\n      padding: 0 8px;\n      outline: none;\n      background-color: #FAFAFA;\n      border-radius: 2px;\n      border: 1px solid var(--strong-border-color);\n      &:hover{\n        border-color: var(--primary-color)\n      } \n      &:focus{\n        border-color: var(--primary-color)\n      }  \n    }\n  }\n\n  .filter-footer {\n    display: flex;\n    flex-direction: row;\n    padding: 8px 12px;\n    justify-content: space-between;\n\n    .filter-btn {\n      text-align: center;\n      font-size: 12px;\n      width: 60px;\n      height: 24px;\n      line-height: 24px;\n    }\n    \n  }\n"])), ButtonCSS);
-
 function DefaultFilterContent(_ref) {
   var _cx2;
-
   var setFilterModel = _ref.setFilterModel,
-      filterModel = _ref.filterModel,
-      hidePanel = _ref.hidePanel,
-      _ref$localeText = _ref.localeText,
-      localeText = _ref$localeText === void 0 ? {} : _ref$localeText;
-
+    filterModel = _ref.filterModel,
+    hidePanel = _ref.hidePanel,
+    _ref$localeText = _ref.localeText,
+    localeText = _ref$localeText === void 0 ? {} : _ref$localeText;
   var _a, _b;
-
   var _React$useState = React.useState((filterModel === null || filterModel === void 0 ? void 0 : filterModel.filterCondition) || 'contain'),
-      _React$useState2 = _slicedToArray(_React$useState, 2),
-      selectedValue = _React$useState2[0],
-      setSelectedValue = _React$useState2[1];
-
+    _React$useState2 = _slicedToArray(_React$useState, 2),
+    selectedValue = _React$useState2[0],
+    setSelectedValue = _React$useState2[1];
   var _React$useState3 = React.useState((filterModel === null || filterModel === void 0 ? void 0 : _filterInstanceProperty(filterModel)) || []),
-      _React$useState4 = _slicedToArray(_React$useState3, 2),
-      innerValue = _React$useState4[0],
-      setInnerValue = _React$useState4[1];
-
+    _React$useState4 = _slicedToArray(_React$useState3, 2),
+    innerValue = _React$useState4[0],
+    setInnerValue = _React$useState4[1];
   var inputRef = useRef();
   var handleClick = React.useCallback(function (option) {
     setSelectedValue(option.key);
   }, []);
-
   var reset = function reset() {
     hidePanel();
     setFilterModel();
   };
-
   var confirm = function confirm() {
     hidePanel();
     setFilterModel({
@@ -52,13 +42,11 @@ function DefaultFilterContent(_ref) {
       filterCondition: selectedValue
     });
   };
-
   var handleKeyDown = function handleKeyDown(e) {
     if (e.keyCode === KeyCode.ENTER) {
       confirm();
     }
   };
-
   useEffect(function () {
     setSelectedValue((filterModel === null || filterModel === void 0 ? void 0 : filterModel.filterCondition) || 'contain');
     setInnerValue((filterModel === null || filterModel === void 0 ? void 0 : _filterInstanceProperty(filterModel)) || []);
@@ -67,7 +55,6 @@ function DefaultFilterContent(_ref) {
     // 兼容设置焦点后发生滚动
     setTimeout(function () {
       var _a;
-
       (_a = inputRef.current) === null || _a === void 0 ? void 0 : _a.focus({
         preventScroll: true
       });
@@ -77,7 +64,6 @@ function DefaultFilterContent(_ref) {
     className: 'filter-option-list'
   }, /*#__PURE__*/React.createElement("ul", null, _mapInstanceProperty(DEFAULT_FILTER_OPTIONS).call(DEFAULT_FILTER_OPTIONS, function (option, index) {
     var _a;
-
     return (
       /*#__PURE__*/
       // eslint-disable-next-line jsx-a11y/no-noninteractive-element-interactions
@@ -113,5 +99,4 @@ function DefaultFilterContent(_ref) {
     onClick: confirm
   }, (_b = localeText.confirmFilter) !== null && _b !== void 0 ? _b : '确定')));
 }
-
 export default DefaultFilterContent;

package/es/table/pipeline/features/filter/DefaultFilterIcon.js

@@ -1,7 +1,7 @@
 import React from 'react';
 export default function DefaultFilterIcon(_ref) {
   var width = _ref.width,
-      height = _ref.height;
+    height = _ref.height;
   return /*#__PURE__*/React.createElement("svg", {
     width: width,
     height: height,